body {
    margin: 0;
    padding: 0;
    height: 100vh;
    background: url('/images/back.jpeg') no-repeat center center fixed; /* Imagen de fondo */
    background-size: cover; /* Ajusta la imagen para cubrir toda la pantalla */
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    font-family: 'Outfit', sans-serif; /* Utiliza la fuente 'Outfit' */
}

.container {
    text-align: center;
}

h1 {
    font-size: 7em; /* Tamaño de letra para el H1 */
    margin-bottom: 10px; /* Espacio entre el H1 y el párrafo */
    color: white;
}

p {
    font-size: 1.8em; /* Tamaño de letra para el párrafo */
    color: azure;
}

.fadeIn {
    opacity: 0; /* Inicialmente, establece la opacidad en 0 */
    animation: fadeInAnimation 6s ease forwards; /* Aplica la animación fadeIn */
}

@keyframes slideUpAnimation {
    from {
        transform: translateY(100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.fadeIn {
    animation: fadeInAnimation 4s ease forwards;
}

.slideUp {
    animation: slideUpAnimation 3.5s ease forwards;
}