body {
    font-family: telefonica;
}
/*Estilos encabezado*/
.dash-title {
    color: var(--color-gris-4-movistar);
    border-bottom: 2px solid var(--color-gris-2-movistar);
    font-weight: bold;
    font-size: 2.5em;
}
hr.hr-dash {
    height: 1px !important;
    background-color: var(--color-gris-6-movistar);
    border: none;
 
}
a.wp-block-button__link.has-color-purpura-movistar-background-color.has-color-blanco-movistar-color.has-text-color.has-background.wp-element-button {
    background: var(--color-purple-movistar);
    border-radius: 50px;
    border: 0px;
    color: #fff;
}
a.wp-block-button__link.has-color-purpura-movistar-background-color.has-color-blanco-movistar-color.has-text-color.has-background.wp-element-button:hover{
	background:var(--color-purple-claro-movistar)
}
/*Fin Estilos encabezado*/
.container-card {
    background-color: transparent;
    padding: 0px;
    border-radius: 0px;
    border: none;
    height: 460px;
    position: relative;
    z-index: 1;
}
.card {
    background-color: transparent;
    border: 0;
    border-radius: 0;
    --bs-card-spacer-y: 0;
    --bs-card-spacer-x: 0;
}
.card-body{
    background-color: #ffff;
    color:var(--color-gris-5-movistar) !important;
    border-radius: 5px;
    position:relative;
    width: auto;
    padding:0px;
    line-height: 1.2;
}
.card-header {
    background-color: var(--color-azul-movistar) !important;
    color: var(--color-blanco-movistar) !important;
    margin-top: -45px;
    width: 85%;
    border-radius: 15px !important;
    margin-left: -20px;
}




.card-header-plan {
    border: 2px solid #D9D9D9;
    border-radius: 20px;
    padding: 15px;
    height: 361px;
    z-index: 3;
    position: relative;
    background: #fff;
}
.container-beneficios-plan-pospago ul {
    margin: 17px 0 0 0;
    padding: 0 0 0 38px;
    width: 100%;
}

.container-beneficios-plan-pospago ul li {
    list-style: none;
    display: flex;
    margin-top: 8px;
    line-height: normal;
}
.container-beneficios-plan-pospago ul li::before {
    content: url(https://kb.movistar.com.sv/wp-content/themes/pospago-movistar-child/assets/img/bulletPlan.png);
    display: inline-block;
    margin-left: -33px;
    width: 20px;
    height: 20px;
    margin-right: 16px;
}
.container-beneficios-plan-pospago {
    font-size: 15px;
}
.card-header-plan .plan-name-col {
    color: var(--color-azul-movistar);
    font-weight: bold;
    font-size: 1.2rem;
}
.container-beneficios-plan-pospago ul li strong {
    display: block;
}

.card-header-plan .plan-name-col {
    height: 74px;
}

.card-header-plan.template-ilimitado span.navegacion-col {
    height: 117px;
    display: flex;
    align-items: center;
}


.container-beneficios-plan-pospago {
    font-size: 14.5px;
    background: var(--color-gris-1-movistar);
    padding: 19px 11px 0 10px;
    height: 262px;
    display: flex;
    align-content: center;
    align-items: center;
    border-radius: 0 0 20px 20px;
    margin-top: -18px;
    z-index: 1;
    flex-direction: column;
}
.card-header-plan span.navegacion-col {
    color: var(--color-azul-movistar);
    font-weight: bold;
    font-size: 2rem;
}
.row.bloque-pantallas-normales.justify-content-center {
    padding: 40px 0;
}
.card-header-plan .container-nombre-destacado {
    margin-bottom: 17px;
}
.card-header-plan span.navegacion-col-txt {
    font-size: 0.9rem;
    display: block;
}
.card-header-plan span.ilimitado-yt-tk {
    color: var(--color-azul-movistar);
    font-weight: bold;
    text-align: center;
    margin-bottom: 7px;
    display: block;
}


.card-header-plan  span.img-ilimitado-yt-tk  {
    text-align:center;
}

.card-header-plan span.img-ilimitado-yt-tk img {
    margin-left: 13px;
    width: 73px;
    display: block;
}
.container-card .container-yt-tk-apps {
    display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
}
.container-card.Descpurple .card-header-plan {
    background: url(https://kb.movistar.com.sv/wp-content/themes/pospago-movistar-child/assets/img/sugeridoDestacado.png) top center;
    border-color: var(--color-azul-movistar);
}
.container-card p.text-precio-antes span {
    text-decoration: line-through;
}
.container-prices-plan .text-h1precio {
    margin-top: -15px;
    font-size: 29px;
    margin-bottom: 0;
}
.container-prices-plan p.text-precio-antes {
    text-align: center;
    height: 18px;
}
.container-prices-plan {
    display: flex;
    flex-direction: column;
    line-height: normal;
}


.container-beneficios-plan-pospago ul {
    height: 195px;
}

.colPlan {
    width: 100%;
    max-width: 320px;
    height: 622px;
}
.container-card.Descpurple .card-header-plan.template-ilimitado .container-navegacion{
    border:0px;
}
.container-card.Descpurple .card-header-plan .col-6.container-navegacion-col {
    border-right: 1px solid var(--color-blanco-movistar);
}
.container-card.Descpurple .card-header-plan .container-navegacion {
    border-bottom: 1px solid var(--color-blanco-movistar);
}

.container-card.Descpurple .card-header-plan span.ilimitado-yt-tk{
    color: var(--color-blanco-movistar)
}
.container-card.Descpurple .card-header-plan span.ilimitado-apps-txt{
    color: var(--color-blanco-movistar);
}
.container-card.Descpurple .card-header-plan .plan-name-col{
    color:var(--color-blanco-movistar)
}
.container-card.Descpurple .card-header-plan span.navegacion-col, .container-card.Descpurple .card-header-plan span.navegacion-col-txt {
    color:var(--color-blanco-movistar)
}
.colPlan {
    width: 100%;
    max-width: 320px;
}
.card-header-plan  .col-6.container-navegacion-col {
    border-right: 1px solid var(--color-gris-3-movistar);
    height: 68px;
}
.card-header-plan .container-navegacion {
    border-bottom: 1px solid var(--color-gris-3-movistar);
    padding-bottom: 17px;
}
.card-header-plan.template-ilimitado span.navegacion-col {
    height: 150px;
    display: flex;
    align-items: center;
    font-size: 2.3em;
}
.container-card.Descpurple .card-header-plan .destacado-sugerido-plan {
    background: var(--color-purpura-movistar);
    color: var(--color-blanco-movistar);
    text-align: center;
    border-radius: 50px;
    font-weight: bold;
    padding: 7px 0 8px 0;
}

.card-header-plan.template-ilimitado .container-navegacion {
    border: 0px;
}
.card-header-plan span.img-ilimitado-apps img {
    width: 100%;
    margin-top: 14px;
    margin-left: 2px;
}

.card-header-plan span.ilimitado-apps-txt {
    text-align: center;
    font-weight: bold;
    text-align: center;
    display: block;
    color: var(--color-gris-5-movistar);
    font-size: 1.5em;
}

.card-header-plan .container-button-plan {
    text-align: center;
    margin-top: 25px;
    margin-bottom: 15px;
}
.card-header-plan .wp-block-button .wp-block-button__link {
    padding: 7px 25px;
    font-weight: bold;
}



















.text-header {
    margin-top: 12px;
    font-size: 18px;
    margin-bottom: 0px;
}
.text-h2 {
    font-weight: bold;
    font-size: 30px;
    margin-left: 5px;
    margin-bottom: 0px;
}
.text-bh3 {
    font-weight: bold;
    font-size: 1.5em;
    margin-bottom: -10px;
}
.text-body {
    margin-top: 6px;
    margin-bottom: -10px;
    font-size: 16px;
    margin-left: 5px;
}
.text-gb {
    text-align: center;
    font-size: 12.8px;
}
.text-h1precio {
    color: var(--color-azul-movistar) !important;
    font-weight: normal;
    font-size: 28px;
    margin-top: 12px;
}
.text-precio{
    color: var(--color-azul-movistar) !important;
    margin-top: 16px;
    margin-left: 5px;
}

/*Estilos para la images de redes youtube y tiktok*/
.social-icon {
    width: 30px; 
    height: 30px; 
    margin: 0 10px;
    margin-top: -10px;
}
.row.col-12 {
    text-align: center; 
}
.smaller {
    width: 30px; 
    height: 30px; 
}
.social-icons-row {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.social-icons-row img {
    margin: 1px; 
    margin-top: -10px;
}

/*Efectos*/
.container-card .card-body .social {
    transition: 2s; 
    height: 208px;
    opacity: 1; 
    position: relative;
    z-index: 2;
}
.container-card .card-body:hover .social {
    transition: 0.7s; 
    height: 162px; 
    opacity: 1; 
    line-height: 0.9;
    margin-top: -5px;
}
/*estilos Boton*/
.card-button a {
    position: relative;
    background-color: var(--color-purpura-movistar); 
    color: var(--color-blanco-movistar) !important;
    font-weight: bold;
    border: none;
    border-radius: 20px;
    padding: 10px;
    width: 80%;
    transform: translateY(0); /* Posición inicial */
    transition: transform 1s;
    z-index: -1;
}
.container-card:hover .card-button a {
    transform: translateY(62px);
}

/*Estilos para card de Ilimitados*/
.container-ilimitados{
background-color: var(--color-azul-movistar);
 border-radius: 10px;
 padding: 30px;
 
 height: 150px
}
.text-datos {
margin-top: 35px;
    color: var(--color-blanco-movistar);
    font-size: 18px;
    font-weight: bold;
}
.social-datos{
    margin-top: 6px;
}

/*Estilos para Card morada*/

.card .container-card.cpurple {
    background-color: var(--color-purpura-movistar);
    padding: 4px;
    border-radius: 5px;
    border: none;
    height: 460px;
    position: relative;
    z-index: 1;
}

.card-header.hpurple {
    background-color: var(--color-purpura-movistar) !important;
    color: var(--color-blanco-movistar) !important;
    margin-top: -45px;
    width: 105%;
    border-radius: 15px !important;
    margin-left: -20px;
}
.social-icon-purple{
    
    margin-left: 8px;
}
.text-h1precio-purple{
    color: var(--color-purpura-movistar) !important;
    font-weight: bold;
    font-size: 35px;
}
.text-precio-purple{
    color: var(--color-purpura-movistar) !important;
    margin-top: 16px;
    margin-left: 5px;
}
/*estilos Boton card morada*/
.card-button-purple a {
    position: relative;
    background-color: var(--color-azul-movistar); 
    color: var(--color-blanco-movistar) !important;
    font-weight: bold;
    border: none;
    border-radius: 20px;
    padding: 10px;
    width: 80%;
    transform: translateY(0); /* Posición inicial */
    transition: transform 1s;
    z-index: -1;
}
.container-card:hover .card-button-purple a {
    transform: translateY(75px);
}
.text-button{
    color: var(--color-blanco-movistar);
    font-weight: bold;
    position: absolute;
    z-index: -1;
    transform: translateY(0);
    transition: transform 1s;
    margin-top: 10px;
    margin-left: 40px;
}
.container-card:hover .card-button-purple .text-button {
    transform: translateY(45px);
}
/*Efectos*/
.container-card .card-body .social-purple {
    transition: 2s; 
    height: 208px;
    opacity: 1; 
    position: relative;
    z-index: 2;
}
.container-card .card-body:hover .social-purple {
    transition: 0.7s; 
    height: 162px; 
    opacity: 1; 
    line-height: 0.9;
    margin-top: -16px;
}
.redes-tarjeta {
    display: none !important;
}
/*Breakpoints*/
/* Ocultar el bloque de dispositivos móviles en pantallas normales (mayores a 991px) */
@media screen and (min-width: 1200px) {
    .bloque-dispositivos-moviles {
      display: none !important;
    }
}
@media screen and (min-width: 1199px) and (max-width: 1399px) {
    .text-header {
        margin-top: 2px;
        font-size: 18px;
    }
    .text-h2 {       
        font-size: 20px;
    }
    .text-bh3 {
        font-weight: bold;
        font-size: 20px;
        margin-bottom: -10px;
    }
    .text-body {
        margin-top: 7px;
        margin-bottom: -10px;
        font-size: 12px;
        
    }
    .row .col-6 .col-12 {
        margin-left: -5px;
    }
    /*Estilos para la images de redes youtube y tiktok*/
    .social-icon {
        
        margin: 0 5px;
        margin-top: 6px;
    }
    .text-h1precio {
        margin-top: -15px; 
        font-size: 24px;
    }  
    .text-precio { 
        margin-top: -8px;
    }
    .text-h1precio-purple {
        margin-top: -15px; 
        font-size: 24px;
    }  
    .text-precio-purple { 
        margin-top: -8px; 
    }

    .social-icon-purple{
        height: 24px;
        width: 24px;
        margin-bottom: 0px;
     }
    /*Estilos para card de Ilimitados*/
    .social-datos{
        margin-top: 17px;
    }
    /*Efectos*/

    .container-card .card-body:hover .social {
        height: 168px; 
       
    }

    .container-card:hover .card-button a {
        transform: translateY(60px);
    }
    .container-card .card-body:hover .social-purple {
       
        height: 168px;  
    }
    .container-card:hover .card-button-purple a {
        transform: translateY(71px);
    }
    .text-button{
        
        margin-left: 25px;
    }
    .container-card:hover .card-button-purple .text-button {
        transform: translateY(43px);
    }
}
/* Ocultar el bloque de pantallas normales en tamaños específicos (ej. entre 991px y 1199px) */
@media screen and (min-width: 992px) and (max-width: 1199px) {
    .card {
        margin-top: 20px;
    }
    .card-body {
       height: auto;
        width: 100%;/* Establece un ancho máximo diferente */
    } 
    .container-card {
        height: 142px;
    }
    .card .container-card.cpurple {
        height: 142px;
    }

  .text-header {
    margin-top: -5px;
    font-weight: bold;
    font-size: 1.8em;
    margin-bottom: 0px;
    margin-left: 5px;
    }
    .text-h2 {
        margin-top: -5px;
        font-weight: bold;
        font-size: 1.8em;
        margin-bottom: 0px;
        margin-left: 5px;
    }
    .card-header {
     width: 70%;
   
    }
    .text-bh3 {
        margin-top: 30px;
        font-weight: bold;
        font-size: 2em;
    }
    .text-body {
        margin-top: 20px;
        
        font-size: 16px;

    }
    .text-h1precio {
        margin-top: 30px; 
        font-size: 2em;
    }  
    .text-precio { 
        margin-top: 45px; 
       
    }
    .text-h1precio-purple{
        color: var(--color-purpura-movistar) !important;
        margin-top: 30px; 
        font-size: 2em;
    }
    .text-precio-purple{
        color: var(--color-purpura-movistar) !important;
        margin-top: 45px; 
    }
    
    .text-body-movil .toggle-content{
        margin-top: -7px;
        margin-left: 300px;
    }
    .text-body-movil i{
        color: var(--color-azul-movistar);
        margin-left: 25px;
    }
    .card-button-movil a {
        margin-top: 10px;
        background-color: var(--color-purpura-movistar); 
        color: var(--color-blanco-movistar) !important;
        border: none;
        border-radius: 20px;
        padding: 10px;
        width: 50%; 
    }
    .card-button-movil .fas.fa-plus {
        margin-right: 10px;
        margin-left: -10px;
        color: var(--color-blanco-movistar); 
    }
    /*Efecto del icono*/
   .social-movil{
    display: none;
    line-height: 0.9;
   }
   .text-body-movil.active .social-movil {
    display: block;
    height: 292px;
    }
    
    .text-body-movil .toggle-content i {
        transition: transform 0.3s ease-in-out;
    }
    .text-body-movil.active .toggle-content i {
        transform: rotate(180deg);
    }

    .social-movil {
        display: none; /* Oculta el elemento por defecto */
    }
    
    .text-body-movil.active .social-movil {
        
       
    display: block; /* Muestra el elemento cuando el contenedor está activo */
    }
    .nav-full {
        margin-top: 28px;
        background: transparent;
        border-radius: 50px;
        width: 100%;
        color: var(--color-purpura-movistar);
        font-weight: bold;
        border: solid 2px var(--color-purpura-movistar);
        outline: none;
        box-shadow: none;
        padding: 10px;
        position: relative;
    }
    .text-datos {
        background-color: var(--color-azul-movistar);
        border-radius: 30px;
        margin-top: -15px;
        padding: 20px;
        color: var(--color-blanco-movistar);
        font-size: 30px;
        font-weight: bold;
        width: 100%;
       
    }
    .container-ilimitados{
        background-color: var(--color-azul-movistar);
         border-radius: 10px;
         padding: 30px;
         height: 100px
    }
    .text-gb {
        text-align: center;
        font-size: 16px;
    }
    .social-icon-purple{
        height: 26px;
        width: 26px;
        margin-bottom: 0px;
     }
     .card-header.hpurple {
        background-color: var(--color-purpura-movistar) !important;
        color: var(--color-blanco-movistar) !important;
        margin-top: -45px;
        width: 70%;
        border-radius: 15px !important;
        margin-left: -20px;
    }
}
@media screen and (min-width: 767px) and (max-width: 991px) {

    .card {
        margin-top: 20px;
    }
    .card-body {
       height: auto;
        width: 100%;/* Establece un ancho máximo diferente */
    } 
    .container-card {
        height: 142px;
    }
    .card .container-card.cpurple {
        height: 142px;
    }
    .text-gb {
        text-align: center;
        font-size: 16px;
    }
    .text-bh3 {
        margin-top: 16px;
        font-weight: bold;
        font-size: 2em;
        margin-left: 50px;
    }
     .text-h1precio {
        margin-top: 16px; 
        font-size: 2em;
    }  
    .text-precio { 
        margin-top: 30px; 
       
    }
    .text-h1precio-purple{
        color: var(--color-purpura-movistar) !important;
        margin-top: 16px;
        font-size: 2em;
    }
    .text-precio-purple{
        color: var(--color-purpura-movistar) !important;
        margin-top: 30px; 
    }
    .nav-full {
        margin-top: 16px;
        background: transparent;
        border-radius: 50px;
        width: 80%;
        color: var(--color-purpura-movistar);
        font-weight: bold;
        border: solid 2px var(--color-purpura-movistar);
        outline: none;
        box-shadow: none;
        padding: 6px;
        position: relative;
        margin-left: 40px;
        
    }
    .text-body-movil .toggle-content{
        margin-top: 9px;
        margin-left: 480px;
    }
    .text-body-movil i{
        color: var(--color-azul-movistar);
        margin-left: 25px;
    }
    .card-button-movil a {
        margin-top: 10px;
        background-color: var(--color-purpura-movistar); 
        color: var(--color-blanco-movistar) !important;
        border: none;
        border-radius: 20px;
        padding: 10px;
        width: 50%; 
    }
    .card-button-movil .fas.fa-plus {
        margin-right: 10px;
        margin-left: -10px;
        color: var(--color-blanco-movistar); 
    }
    /*Efecto del icono*/
   .social-movil{
    display: none;
    line-height: 0.9;
   }
  
   .text-body-movil.active .social-movil {
    display: block;
    height: 292px;
    }
    
    .text-body-movil .toggle-content i {
        transition: transform 0.3s ease-in-out;
    }
    .text-body-movil.active .toggle-content i {
        transform: rotate(180deg);
    }

    .text-body-movil.active .social-movil {
        
       
    display: block; /* Muestra el elemento cuando el contenedor está activo */
    }
    .text-datos {
        background-color: var(--color-azul-movistar);
        border-radius: 30px;
        margin-top: -10px;
        padding: 30px;
        color: var(--color-blanco-movistar);
        font-size: 30px;
        font-weight: bold;
        width: 100%;
       
    }
    .text-header {
        margin-top: -5px;
        font-weight: bold;
        font-size: 2em;
        margin-bottom: 0px;
        margin-left: 5px;
    }
    .text-h2 {
        margin-top: -5px;
        font-weight: bold;
        font-size: 2em;
        margin-bottom: 0px;
        margin-left: 5px;
    }
    .social-icon-purple{
        height: 30px;
        width: 30px;
        margin-bottom: 0px;
     }
     .card-header.hpurple {
        background-color: var(--color-purpura-movistar) !important;
        color: var(--color-blanco-movistar) !important;
        margin-top: -45px;
        width: 85%;
        border-radius: 15px !important;
        margin-left: -20px;
    }
    .text-body {
        margin-top: 14px;
        
        font-size: 16px;
        margin-left: 50px;

    }
    .text-datos {  
        margin-top: -25px;
    }
    .container-ilimitados{
        background-color: var(--color-azul-movistar);
         border-radius: 10px;
         padding: 30px;
         height: 100px
    }
}
@media screen and (min-width: 576px) and (max-width: 767px) {
 
    .card {
        margin-top: 20px;
    }
    .card-body {
        width: auto;/* Establece un ancho máximo diferente */
    }
    .container-card {
        height: 142px;
    }
    .card .container-card.cpurple {
        height: 142px;
    }
    .text-h1precio {
        margin-top: 16px; 
        font-size: 2em;
    }  
    .text-precio { 
        margin-top: 30px; 
       
    }
    .text-h1precio-purple{
        color: var(--color-purpura-movistar) !important;
        margin-top: 16px;
        font-size: 2em;
    }
    .text-precio-purple{
        color: var(--color-purpura-movistar) !important;
        margin-top: 30px; 
    }
    .social-movil{
        display: none;
        line-height: 1;
    }
    
    .text-bh3 {
        margin-top: 16px;
        font-weight: bold;
        font-size: 2em;
        margin-left: 30px;
    }
    .text-body {
        margin-left: 30px;
        margin-top: 20px;
    }
     /*Efecto del icono*/
    .text-body-movil .toggle-content{
        margin-top: 4px;
        margin-left: 350px;
    }
    
    .text-body-movil.active .social-movil {
        display: block;
        height: 292px;
    }
        
    .text-body-movil .toggle-content i {
            transition: transform 0.3s ease-in-out;
    }
    .text-body-movil.active .toggle-content i {
            transform: rotate(180deg);
    }
    .text-body-movil.active .social-movil {
        
       
            display: block; /* Muestra el elemento cuando el contenedor está activo */
    }
    .text-body-movil i{
            color: var(--color-azul-movistar);
            margin-left: 25px;
    }
    .card-button-movil a {
            margin-top: 10px;
            background-color: var(--color-purpura-movistar); 
            color: var(--color-blanco-movistar) !important;
            border: none;
            border-radius: 20px;
            padding: 10px;
            width: 50%; 
    }
    .card-button-movil .fas.fa-plus {
            margin-right: 10px;
            margin-left: -10px;
            color: var(--color-blanco-movistar); 
    }
    .nav-full {
        margin-top: 20px;
        background: transparent;
        border-radius: 50px;
        width: 80%;
        color: var(--color-purpura-movistar);
        font-weight: bold;
        border: solid 2px var(--color-purpura-movistar);
        outline: none;
        box-shadow: none;
        padding: 6.9px;
        position: relative;
        margin-left: 30px;
    }
   
    .text-datos {
            background-color: var(--color-azul-movistar);
            border-radius: 30px;
            margin-top: -10px;
            padding: 30px;
            color: var(--color-blanco-movistar);
            font-size: 30px;
            font-weight: bold;
            width: 100%;
           
    }
    .text-header {
            margin-top: -5px;
            font-weight: bold;
            font-size: 2em;
            margin-bottom: 0px;
            margin-left: 5px;
    }
    .text-h2 {
            margin-top: -5px;
            font-weight: bold;
            font-size: 2em;
            margin-bottom: 0px;
            margin-left: 5px;
    }
    .social-icon-purple{
        height: 30px;
        width: 30px;
        margin-bottom: 0px;
     }
     .card-header.hpurple {
        background-color: var(--color-purpura-movistar) !important;
        color: var(--color-blanco-movistar) !important;
        margin-top: -45px;
        width: 84%;
        border-radius: 15px !important;
        margin-left: -20px;
    }
    .text-gb {
        text-align: center;
        font-size: 16px;
    }
    .text-datos {
        background-color: var(--color-azul-movistar);
        border-radius: 30px;
        margin-top: -15px;
        padding: 20px;
        color: var(--color-blanco-movistar);
        font-size: 30px;
        font-weight: bold;
        width: 100%;
       
    }
    .container-ilimitados{
        background-color: var(--color-azul-movistar);
         border-radius: 10px;
         padding: 30px;
         height: 100px
    }
}

@media (max-width: 575.98px) {
  
    .card {
        margin-top: 20px;
    }
    .card-body {
        width: auto;/* Establece un ancho máximo diferente */
    }
    .container-card {
        height: 142px;
    }
    .card .container-card.cpurple {
        height: 142px;
    }
    .text-header {
        margin-top: -5px;
        font-weight: bold;
        font-size: 2em;
        margin-bottom: 0px;
        margin-left: 5px;
    }
    .text-h2 {
        margin-top: -5px;
        font-weight: bold;
        font-size: 2em;
        margin-bottom: 0px;
        margin-left: 5px;
    }
    .text-bh3 {
        margin-top: 16px;
        font-weight: bold;
        font-size: 30px;
        margin-left: 0px;
    }
    .text-body {
        margin-left: 0px;
        margin-top: 20px;
    }
   
    .text-h1precio {
        margin-top: 14px; 
        font-size: 30px;
        margin-left: -20px;
    }  
    .text-precio { 
        margin-top: 28px; 
       
    }
    .text-gb {
        text-align: center;
        font-size: 16px;
    }
    .text-h1precio-purple{
        color: var(--color-purpura-movistar) !important;
        margin-top: 16px; 
        font-size: 30px;
        margin-left: -20px;
    }
    .text-precio-purple{
        color: var(--color-purpura-movistar) !important;
        margin-top: 30px; 
       
    }
    .social-movil{
        display: none;
        line-height: 0.9;
    }
  /*Efecto del icono*/
  .text-body-movil .toggle-content{

  
        margin-top: 5px;
        margin-left: 70%;
  
}
.text-body-movil i{
    color: var(--color-azul-movistar);
    margin-left: 10px;
}
.text-body-movil.active .social-movil {
    display: block;
    height: 292px;
}
.text-body-movil .toggle-content i {
    transition: transform 0.3s ease-in-out;
}
.text-body-movil.active .toggle-content i {
    transform: rotate(180deg);
}
.text-body-movil.active .social-movil {


    display: block; /* Muestra el elemento cuando el contenedor está activo */
}
.card-button-movil a {
    
    background-color: var(--color-purpura-movistar); 
    color: var(--color-blanco-movistar) !important;
    border: none;
    border-radius: 20px;
    padding: 10px;
    width: 60%; 
    margin-top: 5px;
}
.card-button-movil .fas.fa-plus {
    margin-right: 10px;
    margin-left: -10px;
    color: var(--color-blanco-movistar); 
}
.nav-full {
    margin-top: 18px;
    background: transparent;
    border-radius: 50px;
    color: var(--color-purpura-movistar);
    font-weight: bold;
    border: solid 2px var(--color-purpura-movistar);
    outline: none;
    box-shadow: none;
    padding: 6.9px;
    position: relative;
   
}
.col-6 .nav-full{
    width: 100%;
}

.card-header.hpurple {
    width: 84%;
}
.social-icon-purple{
    height: 30px;
    width: 30px;
    margin-bottom: 0px;
 }
 .text-datos {
    background-color: var(--color-azul-movistar);
    border-radius: 30px;
    margin-top: -15px;
    padding: 20px;
    color: var(--color-blanco-movistar);
    font-size: 30px;
    font-weight: bold;
    width: 100%;
   
}
.container-ilimitados{
    background-color: var(--color-azul-movistar);
     border-radius: 10px;
     padding: 30px;
     height: 100px
}
} 
@media screen and (min-width: 342px) and (max-width: 375px) {
    .nav-full {
        margin-top: 15px;
        padding: 10px;
        font-size: 13px;
       margin-left: -10px;
    }
    .text-h1precio {
        margin-top: 20px; 
        font-size: 25px;
        margin-left: -20px;
    }  
    .text-precio { 
        margin-top: 30px; 
      
    }
    .text-h1precio-purple{
        color: var(--color-purpura-movistar) !important;
        margin-top: 20px; 
        font-size: 25px;
        margin-left: -20px;
    }
    .text-precio-purple{
        color: var(--color-purpura-movistar) !important;
        margin-top: 30px; 
        
    }
    .card-header.hpurple {
        width: 100%;
    }
}
@media screen and (min-width: 320px) and (max-width: 341px) {

    .nav-full {
        margin-top: 8px;
        
        padding: 6px;
        font-size: 14.2px;
        margin-left: -10px;
       
    }
    .text-h1precio {
        margin-top: 20px; 
        font-size: 25px;
        margin-left: -20px;
    }  
    .text-precio { 
        margin-top: 30px; 
       
    }
    .text-h1precio-purple{
        color: var(--color-purpura-movistar) !important;
        margin-top: 20px; 
        font-size: 25px;
        margin-left: -20px;
    }
    .text-precio-purple{
        color: var(--color-purpura-movistar) !important;
        margin-top: 30px; 
       
    }
    .text-bh3 {
        margin-top: 20px;
        font-weight: bold;
        font-size: 25px;
        
    }
    .text-body {
        
        margin-top: 26px;
    }
    .text-body-movil .toggle-content{
        margin-top: 5px;
        margin-left: 68%;
    }
.text-header {
    margin-top: -5px;
    font-weight: bold;
    font-size: 30px;
    margin-bottom: 0px;
    margin-left: 5px;
}
.text-h2 {
    margin-top: -5px;
    font-weight: bold;
    font-size: 30px;
    margin-bottom: 0px;
    margin-left: 5px;
}
.card-header.hpurple {
    width: 100%;
}
.text-datos {
   
    font-size: 20px;
   
   
}
}
/*Fin estilos cards*/