body {
    font-family: Bahnschrift, "DIN Alternate", "Franklin Gothic Medium", "Nimbus Sans Narrow", sans-serif-condensed,
        sans-serif;
    background-image: url(img/404_Error_Page_Fondo.png);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

h2 {
    text-align: center;
    font-size: 62px;
    margin: auto;
    color: #7e8ed1;
}

p {
    text-align: center;
    font-size: 15px;
    margin: auto;
    color: #646996;
}

.wrapper {
    text-align: center;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.button1 {
    font-family: Bahnschrift, "DIN Alternate", "Franklin Gothic Medium", "Nimbus Sans Narrow", sans-serif-condensed,
        sans-serif;
    border: none;
    margin-top: 21px; 
    padding: 2px 10px;
    background-color: #0c0c32ff;
    color: #646996;
    display: inline-block;
    font-size: 10px;
    transition-duration: 0.4s;
    cursor: pointer;
    border-radius: 11px;
    text-decoration: none;
}

.button1:hover {
    background-color: #151a42;
    color: white;
}

/* 🌥️ Cloud positions + animations */
#Nube1 {
    position: fixed;
    bottom: -4px;
    left: -4%;
    width: 32%;
    animation: slide-clouds 12s ease-in-out infinite;
}

#Nube2 {
    position: fixed;
    bottom: -4px;
    left: 38%;
    width: 32%;
    animation: slide-clouds 16s ease-in-out infinite;
}

#Nube3 {
    position: fixed;
    bottom: -4px;
    right: 0px;
    width: 32%;
    animation: slide-clouds 20s ease-in-out infinite;
}

/* side-to-side movement */
@keyframes slide-clouds {
    0% {
        transform: translateX(0);
    }
    50% {
        transform: translateX(8.5%);
    }
    100% {
        transform: translateX(0);
    }
}