body{
    background-image: url("https://ichef.bbci.co.uk/news/640/cpsprodpb/AC8E/production/_101147144_hi046523917.jpg");
    background-size: cover;
    }
    
    .titulo:hover{
        color:red;
    }
   
    
    .container{
        background-color: rgb(8, 6, 138);
        width: 25%;
        position: relative;
        left:35%;
        top:20px;
        height: 50px;
        border-radius: 15px;
        border:3px white solid;
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        color:white;
    }
    .container2 {
        background: linear-gradient(45deg, rgba(51, 14, 214, 0.8), rgba(44, 2, 197, 0.8));
        width: 40%;
        position: relative;
        left: 28%;
        top: 40px;
        height: 600px;
        border-radius: 15px;
        border: 3px rgb(38, 0, 255) solid;
        text-align: center;
        line-height: 25px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }
    
    .container2 p {
        display: inline-block;
        opacity: 0;
        animation: fadeIn 0.5s forwards;
    }
    
    @keyframes fadeIn {
        from {
            opacity: 0;
        }
        to {
            opacity: 1;
        }
    }
    
    /* Añade un retraso progresivo a cada letra */
    .container2 p:nth-child(1) {
        animation-delay: 0.1s;
    }
    
    .container2 p:nth-child(2) {
        animation-delay: 0.2s;
    }
    
    .container2 p:nth-child(3) {
        animation-delay: 0.3s;
    }
    p{
        color: rgb(0, 0, 0);
        margin-top: -0%;
        font-size: 22px;
        color: white !important;
    }
    
    button{
        width: 150px;
        height: 50px;
        position:relative;
        left:15px;
        padding: 5px;
        border-radius: 15px;
        border: double rgb(47, 0, 255);
        background-color: black;
        color: white;
        animation: bounce 10s infinite;
        bottom:-100%;
    
    }
    .button-container {
        display: flex;
        justify-content: space-around; /* Ajusta la distribución horizontal */
        width: 55%; /* Ocupa todo el ancho disponible */
    }
    .container2 button {
        margin: 10px; /* Añade espacio entre los botones */
    }
    .lista{
        font-size: 15px;
    }
    li{
        font-size: 35px;
        list-style:square;
    }
    button:hover{
        cursor:crosshair !important;
        color:red !important;
    }
    @keyframes bounce {
        0%, 20%, 50%, 80%, 100% {
          transform: translateY(0);
        }
        40% {
          transform: translateY(-20px);
        }
        60% {
          transform: translateY(-10px);
        }
      }
    .fa-solid fa-arrow-right fa-bounce{
        opacity: 0px;
    }