main{margin-top: 0px;}

#main-content{
    margin-top: 40px;
}

#Header-container {
    display: flex;
    flex-direction: column;
    justify-content: center; /* Centra los elementos verticalmente */
    align-items: center; /* Centra los elementos horizontalmente */
    /* padding: 40px;  */
    padding-top: 0.5rem;
    box-sizing: border-box;

}

/* Contenedor general de los elementos internos */
.header-content.container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center; /* Centra el texto de todos los elementos */
    width: 100%;
    max-width: 1200px; /* Limita el ancho máximo si lo necesitas */
}

.header-txt{
    width: 98dvw;
}


.header-txt p{
    margin: 0px 20px;
}

.header-txt h2{
    font-size: 2.7rem;
}

main{
    padding-bottom: 20dvh;
}

div{
    text-align: center;
}

.curso-data-section{
    display: flex;
    flex-direction: column; /* Asegura que los elementos se apilen verticalmente */
    align-items: center; /* Centra el contenido horizontalmente */
    padding: 30px;
    margin:  0px;

}


#logo {
    max-width: 1200px;
    margin: 20px;
    margin-bottom: 0px;
}

.divisor{
    /* display: flex;
    justify-content: center;
    align-items: center;
    position: relative; */
    padding: 20px 0px;
    margin: 30px;
    width: 100%;
}

.divisor img{
    width: 60%;
    min-width: 300px;
}

.mini-divisor{
    padding: 10px;
    margin: 10px;
}
.mini-divisor img{
    width: 30%;
    min-width: 250px;
}

.wolf-divisor img{
    width: 8vw;
}

#first-trebol {
    transform: rotateX(180deg);
    transform-origin: center; /* Para asegurar que la rotación se realice alrededor del centro */
    transition: transform 0.5s; /* Agregar una transición suave si lo deseas */
    /* padding:0px; */
    margin: 0px;
}

.trebol{
    transform: rotateX(180deg);

    padding: 30px;
    margin: 0px;
}

.trebol img{
    width: 150px;
}



.container{
    max-width: 75dvw;
    margin: 10px auto;
    padding:1rem;
    padding: 10px;
    margin:  10px;
}

.curso-data{
    padding: 0px;
    margin: 0px;
}

.container h2{
    font-size: 2.6rem;
    padding: 0px;
    margin: 0px;
    margin-bottom: 10px;
}

.container p{
    font-size: 1.5rem;
    margin: 0px;
}

.sorteo-div h2{
    margin-bottom: 10px;
}

.sorteo-container p{
    padding: 0px;
    margin:  3px;
    font-size: 1.35rem;
    font-weight: bold;
}
.sorteo-container h3{
    font-size: 1.7rem;
    margin-top: 30px;
    margin-bottom: 0px;    
}
.sorteo-container ul{
    font-size: 1.35rem;
    margin-top: 0px;
}

.preview{
    display: flex;
    justify-content: center;
    align-items: center;
    /* position: relative; */
    margin: 5px;
    padding: 5px;
}


.preview a {
    font-size: 1.4rem;
    color: #fff;
    text-decoration: none;
    border: 1.5px solid #4f04ff;;
    background-image: url(/Assets/Img/backgrounds/Buttons/background1Comp159.webp); /* Fondo inicial */
    background-size: cover;
    background-position: center;
    padding: 10px 20px;
    margin: 10px;
    border-radius: 5px;
    position: relative;
    overflow: hidden; /* Evitar que el pseudo-elemento sobresalga */
    z-index: 1; /* Asegurar que el contenido del enlace quede arriba del pseudo-elemento */
}

.preview a::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-image: url(/Assets/Img/backgrounds/Buttons/backgroundb2Comp154.webp); /* Fondo al hacer hover */
    background-size: cover;
    background-position: center;
    opacity: 0; /* Invisible inicialmente */
    transition: opacity 0.5s ease-in-out; /* Animación suave */
    z-index: -1; /* Colocar detrás del contenido del enlace */
}

.preview a:hover::before {
    opacity: 1; /* Hacer visible el fondo en hover */
}

.preview a:hover {
    background-color: rgb(0, 149, 255); /* Cambiar el color de fondo al hacer hover */
    color: #fff; /* Cambiar el color del texto */
}





.ofert{
    width: 800px;
    margin: 20px;
    padding: 40px 10px;
    
    background-color: #00a9e611; /* Fondo blanco para claridad */
    background-size: cover;
    background-position: center;
    position: relative;
    border: 0.6px solid #000;
    background-image: url(/Assets/Img/backgrounds/Desktop/backgroundb3Comp266.webp);
    border-radius: 20px; /* Bordes redondeados */
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1); /* Sombra suave para profundidad */
    text-align: center;
}

#second-ofert-container{
    background-image: url(/Assets/Img/backgrounds/Desktop/background8Comp250.webp);
}

.ofert h2{
    font-size: 3rem;
    margin: 0px;
}

.prices {
    display: flex; /* Usamos Flexbox para alinearlos horizontalmente */
    justify-content: center; /* Centra los precios */
    gap: 1rem; /* Espacio entre los precios */
    align-items: center; /* Alinea los precios verticalmente */
}

    .prices h3{
    font-size: 2.5rem;
    /* transition: all 0.3s ease-in-out; */
}



/* precios */
.original-price {
    text-decoration: line-through; /* Esto aplica el tachado */
}

.new-price {
    font-weight: bold; /* Puedes agregar estilo adicional si lo deseas */
}

.price{
    margin: 0px 20px;
}

/* Aumentamos el tamaño del logo */
.img-header-container {
    width: 100%;
    margin-top: 50px;
    margin-bottom: 30px;
}

.img-sesion{
    width: 100%;
}

#logo{
    width: 100%;
}



.trasnfer-data{
    max-width: 100dvw;
}


.trasnfer-data a {
    position: relative;
    display: inline-block;
    font-size: 1.4rem;
    color: #fff;
    text-decoration: none;
    border: 1.5px solid #4f04ff;;
    background-image: url(/Assets/Img/backgrounds/Buttons/background1Comp159.webp);
    background-size: cover;
    background-position: center;
    padding: 10px 20px;
    margin: 10px;
    border-radius: 30px;
    overflow: hidden;
    z-index: 1;
}

.trasnfer-data a::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-image: url(/Assets/Img/backgrounds/Buttons/backgroundb2Comp154.webp);
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
    z-index: -1;
}

.trasnfer-data a:hover::before {
    opacity: 1;
}

.trasnfer-data a:hover {
    background-color: transparent;
    color: #fff;
}







/* trasnfer pop pup */
/* .transferencia-section {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7); 
    justify-content: center;
    align-items: center;
    z-index: 9999;
} */



/* Estado inicial oculto */
.transferencia-section {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.5s ease;
    display: flex; /* Siempre en flex, controlamos visibilidad con opacidad */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

/* Clase para mostrar el popup */
.transferencia-section.active {
    opacity: 1;
    pointer-events: auto;
}

/* Estilo para la sección de transferencia */

.sorteo-div{
    position: relative;
    width: 90%;
    max-width: 950px;
    max-height: 616px;
    padding: 40px 80px;
    background-image: url(/Assets/Img/backgrounds/Desktop/background10Comp184.webp);
    background-size: cover;
    opacity: 1;
    border-radius: 35px; /* Bordes redondeados */
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1); /* Sombra suave para profundidad */
    text-align: center;
    color: #fff;
}

.transferencia {
    position: relative;
    width: 90%;
    max-width: 900px;
    max-height: 616px;
    padding: 40px 80px;
    background-image: url(/Assets/Img/backgrounds/Desktop/background8Comp250.webp);
    background-size: cover;
    opacity: 1;
    border-radius: 10px; /* Bordes redondeados */
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1); /* Sombra suave para profundidad */
    text-align: center;
    color: #fff;
}

/* Estilo para el título */
.transferencia h2 {
    font-size: 2.5rem;
    font-weight: 600;
    letter-spacing: 1px;
    margin-bottom: 30px;
}


/* Estilo para la tabla */
.transfer-table {
    width: 100%;
    margin: 20px 0;
    border-collapse: collapse;
}

.transfer-table th, .transfer-table td {
    padding: 12px;
    text-align: left;
    border-bottom: 1px solid #b3eef0; /* Línea suave debajo de cada fila */
}

.transfer-table th {
    background-color: #8108cd54; 
    font-weight: 600;
}

.transfer-table td {
    background-color: #4d1ff452;
}

/* Enlace de email */
.transferencia a {
    margin: 0px;
    color: #3498db; /* Color azul para el enlace */
    text-decoration: none;
    font-weight: 600;
}

.transferencia a:hover {
    text-decoration: underline; /* Subrayado en hover */
}


/* Estilo para el botón de cerrar */
button.closePopupBtn {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
    background: none;
    border: none;
    color: white;
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    /*cursor: pointer*/;
}

button.closePopupBtn:hover {
    color: #0c7bd6; /* Cambiar color al pasar el ratón */
}


.comprobante p{
    font-size: 1rem;
    margin-bottom: 0px;
    margin-top: 0.2rem;
}

.comprobante-sorteo p{
    font-size: 1.3rem;
}


.asunto a{ 
    text-decoration: none;
}



.info-reembolso {
    max-width: 100dvw;
    padding: 16px 20px;
    margin-top: 30px;
    font-size: 15px;
    border-radius: 6px;
    line-height: 1.6;
  }
.info-reembolso h3{
    font-size: 2rem;
    margin: 0.2rem;
}
.info-reembolso p{
    font-size: 1.35rem;
}
  
.info-reembolso a {
    font-size: 1.4rem;
    color: #0fffdb;
    font-weight: 500;
    text-decoration: underline;
  }
  
.info-reembolso a:hover {
    color: #0cdbbc;
  }

.lista{
    text-align: left;
}
.lista li{
    font-size: 1.3rem;
}
.lista ul{
    list-style-type: disc;
    padding-left: 17rem;
}
#metodologia{
}
#metodologia li{
}

#metodologia ul{

}


#finalSection{
    margin: 0px;
    padding: 0px;
}
  

/* matebook x pro alfa */
@media (min-width:1450px) and (max-height:920px) {

    #Header-container {
        padding-top: 0px;
    }

    #main-content {
        margin-top: 0px;
    }
    #Header-container .Title-txt h1 {
        font-size: 4rem;
    }
    .life-seed{
        width: 125px;
    }
    #logo{
        max-width: 1050px;
    }
    .container p {
        font-size: 1.4rem;
    }
    .container h2{
        font-size: 2.4rem;
    }
}

@media (min-width:1700px) {
    #main-content {
        margin-top: 10px;
    }    
    #Header-container .Title-txt h1{
        font-size: 4.5rem;
    }
    .life-seed {
        width: 130px;
    }

    .transferencia h2 {
        font-size: 3rem;
    }

    .transfer-table td {
        font-size: 1.2rem;
    }
    .transfer-table th {
        font-size: 1.1rem;
    }
    .comprobante p{
        font-size: 1.1rem;
    }
}

@media (min-width:2000px) and (min-height:1100px){

    #main-content {
        margin-top: 70px;
    }

    #Header-container .Title-txt h1 {
        font-size: 5rem;
    }

    .container h2{
        font-size: 3rem;
    }
    .container p {
        font-size: 1.8rem;
    }

    .trasnfer-data a, .preview a {
        font-size: 1.7rem;
    }

    .transferencia h2{font-size: 3rem;}
    .transfer-table th{
        font-size: 1.35rem;
    }
    .transfer-table td {
        font-size: 1.35rem;
    }
    .comprobante p {
        font-size: 1.35rem;
        margin: 10px;
    }
}


@media (max-width:1600px) and (min-width: 1100px) and (max-height:800px){

    #main-content{
        margin-top: 25px;
    }

    #Header-container {
        padding-top: 0px;
    }
    #logo {
        width: 63dvw;
    }

    .ofert{
        width: 700px;
        padding: 35px 10px;
    }
    .ofert h2 {
        font-size: 2.6rem;
    }

    .container h2{
        font-size: 2.3rem;
    }

    .sorteo-container h3 {
        font-size: 1.6rem;
    }
    .container p{
        font-size: 1.25rem;
        margin: 0px;
    }
    .sorteo-container ul {
        font-size: 1.2rem;
    }

    .prices h3 {
        font-size: 2.2rem;
    }
    #second-ofert-container{
        width: 650px;
        padding: 30px 10px;   
     }

     .trebol img {
        width: 135px;
     }
}






@media(max-width:1000px){

    /* #Header-container .Title-txt h1{
        font-size: 3.5rem;
    } */

    .ofert{
        padding: 10px;
        width: 75%;
        min-width: 200px;
    }

    .ofert h2 {
        font-size: 2.7rem;
    }

    .curso-data-section{
        padding: 20px 30px;
    }

    .container h2{
        font-size: 2.4rem;
    }

    .container p{
        font-size: 1.4rem;
    }


    .trebol img {
        width: 120px;
    }

    .transferencia{
        width: 80%;
        max-width: 700px;
    }
    .sorteo-div{
        width: 70%;
        max-width: 1700px;
    }
    .sorteo-container p{
        font-size: 1.2rem;
    }

    .comprobante h2{
        font-size: 2.2rem;
    }

    .comprobante p{
        font-size: 1rem;
    }

}

@media (min-width: 1500px) {
    .curso-data-section{
        margin: 10px 80px;
    }
}


@media (max-width: 750px) {
    #Header-container{
        padding: 10px 10px;
        padding-top: 100px;
    }

    /* #Header-container .Title-txt h1 {
        font-size: 3.2rem;
    } */

    .header-content {
        max-height: 200vh;
    }

    #logo{
        margin: 0px;
    }

    .divisor img {
        width: 70%;
        min-width: 300px;
    }

    .container h2{
        font-size: 2.2rem;
    }
    .container p {
        font-size: 1.2rem;
    }

    .prices h3{
        font-size: 2rem;
    }

    .transferencia h2{
        font-size: 2.2rem;
    }

    .comprobante p{
        font-size: 0.9rem;
    }
}

/* Ipad Pro */
@media (max-width:1100px) and (max-height: 1400px) and (min-width:900px) and (min-height:1200px){
    .header-txt{
        width: 97dvw;
        
    }
    #Header-container{
        padding: 10px 10px;
        padding-top: 100px;

    }
    #main-content {
        margin-top: 20px;
    }

    #Header-container .Title-txt h1 {
        font-size: 3.5rem;
    }
    #Header-container .sub-tittle p {
        font-size: 1.7rem;
    }

    .header-content {
        max-height: 750px;
    }

    .ofert{
        padding: 40px 10px;
        width: 75%;
        min-width: 200px;
    }
    .ofert h2{
        margin: 0px;
        font-size: 2.8rem;
    }
    .prices h3{
        font-size: 2.2rem;
    }

    #logo{
        width: 85%;
        margin: 0px;
    }
    .divisor img{
        width: 66%;
    }
    .mini-divisor img{
        width: 40%;
    }


    .container h2{
        font-size: 2.7rem;
        padding: 0px;
    }
    .container p{
        font-size: 1.4rem;
    }

    .lista ul{
        padding-left: 3rem;
    }
    .lista li{
        font-size: 1.3rem;
    }

    .trasnfer-data a, .preview a{
        margin: 30px;
        font-size: 1.8rem;
    }
    .trasnfer-data{
        margin: 20px;
    }

    .transfer-table td{
        font-size: 1.4rem;
    }
    .transfer-table th{
        font-size: 1.4rem;
    }

    .transferencia{
        width: 80%;
        padding: 40px 60px;
    }
    .comprobante p{
        font-size: 1.2rem;
    }

    

    .info-reembolso p{
        font-size: 1.25rem;
    }
    .info-reembolso a{
        font-size: 1.35rem;
    }

}

/* Ipad Air */
@media (max-width:850px) and (max-height:1200px) and (min-width:600px) and (min-height:1000px){
    #Header-container{
        padding-top: 20px;
    }
    /* #Header-container .Title-txt h1 {
        font-size: 3.4rem;
    } */
    /* #Header-container .sub-tittle p {
        font-size: 1.7rem;
    } */
     .header-txt{
        width: 97dvw;
     }

    .header-content {
        max-height: 750px;
    }
    .header-content.container{
        width: 97%;
    }

    .ofert{
        padding: 25px 10px;
        width: 68%;
        min-width: 200px;
    }

    .container h2{
        font-size: 2.1rem;
        padding: 0px;
    }
    .container p{
        font-size: 1.2rem;
    }

    .lista ul{
        padding-left: 2rem;
    }
    .lista li{
        font-size: 1.2rem;
    }

    .ofert h2{
        margin: 0px;
        font-size: 2.3rem;
    }
    .prices h3{
        font-size: 2rem;
    }


    #logo{
        width: 85%;
        margin: 0px;
    }
    .divisor img{
        width: 73%;
    }
    .mini-divisor img{
        width: 49%;
    }



    .transferencia{
        width: 72%;
    }
    .sorteo-div{
        width: 72%;
    }
    .trasnfer-data a, .preview a{
        margin: 30px;
        font-size: 1.5rem;
    }
    .trasnfer-data{
        margin: 20px;
    }

    .transfer-table td{
        font-size: 1.2rem;
    }
    .transfer-table th{
        font-size: 1.2rem;
    }
    .comprobante p{
        font-size: 1.1rem;
    }


    .info-reembolso p{
        font-size: 1.1rem;
    }
    .info-reembolso a{
        font-size: 1.25rem;
    }

}


/* Ipad Mini */
@media (max-width:780px) and (max-height: 1100px) and (min-width:600px) and (min-height:750px){
    #Header-container{padding-bottom: 0px;}
    /* #Header-container .Title-txt h1 {font-size: 4rem;} */
    .ofert h2{
        margin: 0px;
        font-size: 2em;
    }
    .ofert{
        padding: 2opx 10px;
        width: 55%;
        min-width: 200px;
    }

    .container h2{
        font-size: 1.9rem;
        padding: 0px;
    }
    .container p{
        font-size: 1rem;
    }

    .lista ul{
        padding-left: 3rem;
    }
    .lista li{
        font-size: 1rem;
    }


    .prices h3{
        font-size: 1.7rem;
    }


    .transferencia{
        width: 60%;
    }
    .sorteo-div{
        width: 60%;
    }

    .transferencia h2{font-size: 2.2rem;}
    .trasnfer-data a, .preview a{
        /* margin: 30px; */
        font-size: 1.3rem;
    }
    .trasnfer-data{
        margin: 20px;
    }

    .transfer-table td{
        font-size: 1rem;
    }
    .transfer-table th{
        font-size: 1rem;
    }
    .comprobante p{
        font-size: 0.9rem;
    }


    .info-reembolso p{
        font-size: 1rem;
    }
    .info-reembolso a{
        font-size: 1.1rem;
    }
}

@media screen and (min-device-width: 320px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {


    body{
    min-height: 300vh;
    height: auto;
    }

    #Header-container{
    background-image: none;
    background-size: cover;
    background-attachment: scroll !important; 
    }

    .header-content{
    background-image: none;
    background-attachment: scroll !important; 
    background-size: cover;
    height: auto;
    }
    .container{
        max-width: 100vw;
    } 

    .curso-data-section{
    background-image: url('/Assets/Img/backgrounds/Movil/background6Comp155.webp'); /* Ruta de la imagen */
    background-attachment: scroll !important; 
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;

    /* padding: 20px 30px; */
    padding:0px;
    }

    #second-ofert-container {
    background-image: url(/Assets/Img/backgrounds/Movil/background8Comp104.webp);
    background-attachment: scroll !important;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    }
    #finalSection{
    background-image: url('/Assets/Img/backgrounds/Movil/background10Comp150.webp'); /* Ruta de la imagen */
    background-attachment: scroll !important; 
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding-bottom: 100px;
    }

    main{
    padding-bottom: 0px
  };

}

/* Iphone 14 Pro Max */
@media (max-width: 500px){
    #second-ofert-container {
    background-image: url(/Assets/Img/backgrounds/Desktop/background8Comp250.webp);
    background-attachment: scroll !important;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    }
    #main-content{
        margin-top: 0px;
    }
    .header-txt{
        width: 97dvw;
    }
    .header-content {
        height: auto;
    }
    main{margin-top: 0px;}
    .trasnfer-data a, .preview a {
        margin: 0px;
        font-size: 1.1rem;
    }
    #Header-container .Title-txt h1 {font-size: 2.2rem;}
    #Header-container .header-txt p {
        padding: 0px 20px;
    }

    .life-seed{width: 70px;
    }
    #Header-container {
        padding-top: 0px
    }

    #logo{
        width: 95%;
    }
    #first-trebol{margin-top: 0px;}

    .ofert {
        padding: 15px 10px;
        width: 60%;
    }
    .header-content.container{
        padding-top: 0px;
        margin-top: 0px;
        margin-bottom: 0px;
        padding-bottom: 0px;
    }

    .img-header-container {
        margin: 20px 0px;
    }
    .curso-data-section {
        padding-top: 0px;
        margin-top: 0px;
    }

    .container h2 {
        font-size: 1.5rem;
    }
    .container p {
        font-size: 0.95rem;
        margin:  5px 0px;
        padding: 5px 0px;
    }
    .container {
        padding: 20px 10px;
        margin: 0;
    }

    .lista ul{
        padding-left: 1rem;

    }
    .lista li{
        font-size: 0.95rem;
        padding: 2px 0px;
    }

    .ofert h2 {
        font-size: 1.5rem;
    }
    .prices h3 {
        font-size: 1.2rem;
        margin: 0px 4px;
    }

    .trebol img{width: 111px;}


    .transferencia {
        width: 66%;
        padding: 15px 30px;
    }
    #second-ofert-container {
        padding: 0.7rem 0.7rem;
    }

    .sorteo-div h2{
        font-size: 1.65rem;
    }

    .sorteo-container p{
        font-size: 0.93rem;
        margin:  3px 0px;
        padding: 3px 0px;
    }

    .sorteo-div{
        width: 74%;
        padding: 25px 25px;
    }
    .sorteo-container h3{
        font-size: 1.35rem;
        margin: 0px;
    }
    .sorteo-container ul {
        font-size: 0.93rem;
    }

    .divisor{
        padding: 10px;
        margin: 0px;
        margin-bottom: 30px;
    }

    .trasnfer-data a, .preview a{
        border-radius: 20px;
        font-size: 1.1rem;
    }


    .transferencia h2 {
        font-size: 1.6rem;
    }

    .transfer-table td {
        font-size: 0.85rem;
        padding: 8px;
    }
    .transfer-table th {
        font-size: 0.8rem;
        padding: 8px;
    }
    .transfer-table th, .transfer-table td {
        padding: 8px;
    }
    .comprobante p {
        font-size: 0.85rem;
    }
    

    .info-reembolso {
        padding: 0.5rem 1rem;
        margin: 0rem 1.5rem;
    }

    .info-reembolso h3{
        font-size: 1.4rem;
        margin: 0.2rem;
    }
    .info-reembolso p{
        font-size: 0.9rem;
        margin: 0px;
        padding: 0px;
    }
    .info-reembolso a{
        font-size: 0.95rem;
    }

}

/* Iphone XR */
@media (max-width: 415px) {

    .header-content {
        height: auto;
    }

    #Header-container .Title-txt h1 {
        font-size: 1.9rem;
    }
    #Header-container .header-txt p{
        margin: 0px 20px;
    }
    .img-life-seed {
        margin: 0 15px;
      }

    .trasnfer-data a, .preview a{
        font-size: 1rem;
      }
    .ofert {
        padding: 12px 10px;
        width: 65%;
    }
    .ofert h2 {
        font-size: 1.45rem;
    }
    .prices h3 {
        font-size: 1.1rem;
    }
    .container h2 {
        font-size: 1.45rem;
    }
    .container p {
        font-size: 0.93rem;
        margin:  5px 0px;
        padding: 5px 0px;
    }

    .lista ul{
        padding-left: 1.15rem;
    }
    .lista li{
        font-size: 0.93rem;
    }

    .sorteo-div h2{
        font-size: 1.65rem;
    }
    .sorteo-container h3{
        font-size: 1.25rem ;
        margin: 5px;
    }
    .sorteo-container p{
        font-size: 0.9rem;
        margin:  3px 0px;
        padding: 3px 0px;
    }
    .sorteo-container ul {font-size: 0.9rem;}

    .sorteo-div {
        width: 79%;
        padding: 30px 20px;
    }


    #second-ofert-container {
        padding: 0.7rem 1rem;
    }


    .transferencia {
        width: 66%;
        padding: 15px 30px;
    }

    .transferencia h2 {
        font-size: 1.5rem;
    }

    .transfer-table td {
        font-size: 0.8rem;
        padding: 8px;
    }
    .transfer-table th {
        font-size: 0.75rem;
        padding: 8px;
    }
    .transfer-table th, .transfer-table td {
        padding: 8px;
    }
    .comprobante p {
        font-size: 0.75rem;
    }


    .info-reembolso p{
        font-size: 0.8rem;
        margin:  0px 10px;
        padding: 0px;
    }
    .info-reembolso a{
        font-size: 0.9rem;
    }


}

/* 12 pro */
@media (max-width: 390px) {
    .header-content {
        height: auto;
    }

    #Header-container .Title-txt h1 {
        font-size: 1.95rem;
    }
    .img-life-seed{margin: 0px 17px}
    .life-seed{width: 65px;}

    .curso-data-section{
        padding-right: 10px;
        padding-left: 10px;
    }

    .trasnfer-data a, .preview a{
        font-size: 0.93rem;
    }

    .transferencia {
        width: 70%;
        padding: 15px 30px;
    }
    .sorteo-div{
        width: 75%;
    }
    .ofert{
        margin-top: 30px;
        margin-bottom: 5px;
    }


    .container h2{
        font-size: 1.3rem;
    }
    .container p{
        font-size: 0.9rem;
    }

    .lista ul{
        padding-left: 1.5rem;
    }
    .lista li{
        font-size: 0.9rem;
    }

    .transferencia h2 {
        font-size: 1.5rem;
    }

    .transfer-table td {
        font-size: 0.8rem;
        padding: 8px;
    }
    .transfer-table th {
        font-size: 0.75rem;
        padding: 8px;
    }
    .transfer-table th, .transfer-table td {
        padding: 8px;
    }
    .comprobante p {
        font-size: 0.75rem;
    }

    .sorteo-container ul {font-size: 0.9rem;}

    .trebol img {
        width: 100px;
    }


    .info-reembolso p{
        font-size: 0.85rem;
    }
    .info-reembolso a{
        font-size: 0.95rem;
    }
}

/* Iphone SE */
@media (max-width: 375px) {
    .header-content {
        height: auto;
    }
    #Header-container .Title-txt h1 {
        font-size: 1.75rem;
    }
    .img-life-seed{margin: 0px 17px}
    .life-seed{width: 61px;}


    .container h2 {
        font-size: 1.2rem;
    }
    .container p {
        font-size: 0.8rem;
    }

    .lista ul{
        padding-left: 1.5rem;
    }
    .lista li{
        font-size: 0.8rem;
    }

    .sorteo-div h2 {
        font-size: 1.4rem;
    }
    .sorteo-div p{
        font-size: 0.8rem;
    }
    .sorteo-container p {
        font-size: 0.9rem;
    }
    .sorteo-container h3 {
        font-size: 1.2rem;
        margin-top: 11px;
    }

    .sorteo-div {
        width: 75%;
    }

    .transferencia h2 {
        margin-bottom: -15px;
    }

   #second-ofert-container {
        padding: 0.7rem 1rem;
    }

    .info-reembolso p{
        font-size: 0.7rem;
    }
    .info-reembolso a{
        font-size: 0.8rem;
    }

}