/* cambio de fuente por Roboto Condensed */

html *{
    font-family: 'Roboto Condensed', sans-serif!important;
    
}
:focus{
    outline: none;
}
/* cambios header */
html, body {
    overflow-x: inherit!important;
    background-color: #EFEFEF;
}
#header {
    height: 73px;
    background: url(../img/versionpaywall/barrasuperior-fondo-madera.jpg);
    z-index: 10;
    background-size: cover;
    background-repeat: no-repeat;
}
.bg-login {
    background: url(../img/versionpaywall/fondo-blanco-iniciodesesion-desenfocado.jpg) center center no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;
    position: absolute;
}
#header .user {
    background: transparent url(../img/versionpaywall/icono-usuario2x.png) 7px center no-repeat!important;
    background-size: 45px!important;
    background-position-y: 3px!important;
    height: auto;
    padding: 10px 20px 0px 60px;
}
    /* tamaño logo */
header img {
    height: 40px;
    width: auto;
    padding-top: 2px;
}
/* cambios caja logueo */
.title-wrap {
    color: #1A1A1A;
    text-transform: uppercase;
    z-index: 8;
    position: relative;

    font-size: 16px;
}
.subt-wrap {
    color: #868686;
    z-index: 10;
    position: relative;
    padding-bottom: 25px;
    font-size: 14px;
    margin-top: 5px;
}
#lblRespuesta {
    color: #6F6F6F;
    font-weight: 700;
    font-size: 13px;
}
#ctl00__cphPrincipal_mensajeSuscripDigital {
    text-transform: uppercase;
    width: 100%;
    position: absolute;
    left: 0;
}
#login .box {
    height: auto;
    width: 354px;
    background: #fff;
    margin: 50px auto 40px;
    padding: 35px 30px;
    border-radius: 5px;
}
/* recordar contraseña  */

.box .txt-login {
    font-size: 12px!important;

    width: 103%!important;
    text-align: right;
    color: #1A1A1A!important;
}
.box .txt-login a {
    text-decoration: underline;
}
.box .txt-login a span {
    color: #1a1a1a!important;
}
.box .txt-login:after {
    background: none!important;
}

    /* campos formulario */
#login .box input[type=submit] {
    background: #BCCA00;
    border: none;
    padding: 10px 15px;
    text-transform: uppercase;
    font-size: 15px;
    color: #FFFFFF;
    font-weight: bold;
    display: block;
    margin: 10px auto 0px;
    cursor: pointer;
    border-radius: 5px;
    z-index: 1;
    position: relative;
}
    /* distancia lateral campos */
#ctl00__cphPrincipal__updEnviar {
    padding: 0 10%;
}
    /* apariencia placeholders */
#login .box input[type=text]::placeholder, #login .box input[type=password]::placeholder {
    text-transform: uppercase;
}
    /* apariencia campos */
#login .box input[type=text], #login .box input[type=password] {
    color: #999999 !important;
    background: #EAEAEA!important;
    border: 1px solid #efefef;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px 5px;
    color: #eeeeee;
    font-weight: 600;
    margin-bottom: 10px;
    width: 100%;
    background: #EAEAEA;
    border: 1px solid #DFDFDF;
}
#ctl00__cphPrincipal_panelSelIdentificacion input[type=text]{
    width: 96%!important;
}
    /* sombras internas caja */
#ctl00__cphPrincipal__updEnviar:before, #login .div_campos:before {
    position: absolute;
    width: 414px;
    height: 70px;
    background: url(../img/versionpaywall/bisel-separador-bt-iniciarsesion.png) center center no-repeat;
    top: 75px;
    content: " ";
    margin-left: -65px;
    transform: rotateX(180deg);
    z-index: 0;
}
#login .div_campos:before{
    margin-left: -207px;
    top: 50px;
}
#login .div_campos{
    padding: 0 10%;
}

.div_campos select {
    margin: 10px 0px;
    color: #999999 !important;
    background: #EAEAEA!important;
    border: 1px solid #efefef;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 5px;
    height: 40px;
    color: #eeeeee;
    font-weight: 600;
    margin-bottom: 10px;
    width: 100%;
    border: 1px solid #DFDFDF;
}
.div_recordar_clave #ctl00__cphPrincipal__updEnviar:before {
    top: 45px;
}
#login .box input[type=submit]:before {
    position: absolute;
    width: 414px;
    height: 70px;
    background: url(../img/versionpaywall/bisel-separador-bt-iniciarsesion.png) center center no-repeat;
    top: -55px;
    content: " ";
    margin-left: -50px;
    z-index: 0;
}
#login .regresar:before {
    position: absolute;
    width: 414px;
    height: 70px;
    background: url(../img/versionpaywall/bisel-separador-bt-iniciarsesion.png) center center no-repeat;
    margin-top: -55px;
    content: " ";
    margin-left: -210px;
    z-index: 0;
}
.regresar p{
    font-weight: 700;
    color: #6E6E6E;
    font-size: 13px;
    text-transform: uppercase;
}
.regresar p a{
    text-decoration: underline;
}
#ctl00__cphPrincipal_mensajeSuscripDigital:before {
    position: absolute;
    width: 414px;
    height: 70px;
    background: url(../img/versionpaywall/bisel-separador-bt-iniciarsesion.png) center center no-repeat;
    top: -55px;
    content: " ";
    margin-left: -35px;
    z-index: 0;
}
#ctl00__cphPrincipal__lnkRegresar {
    z-index: 10;
    position: relative;
}
/* enlaces parte baja caja inicio */
#login .txt-login span {
    color: #00609A;
    font-weight: 700;
}
#login .txt-login {
    text-transform: uppercase;
    margin: 0px auto 15px;
    width: auto;
}
    /* sombra inferior texto parte baja */
#login .txt-login:after {
    content: " ";
    width: 180px;
    height: 10px;
    margin: auto;
    display: block;
    background: url(../img/versionpaywall/linea-divisoria-otras-opciones.png) center center no-repeat;
}
#login .txt-login {
    font-size: 14px;
}
a.txt-login:last-of-type:after {
    background: none!important;
}
/* footer */
footer span img {
    width: 40px;
    height: auto;
    top: 1px;
    position: relative;
}
#footer {
    text-align: center;
    color: #909090;
    font-weight: 700;
    font-size: 11px;
    width: 75%;
    margin: auto;
    margin-top: 80px;
}
#footer a {
    color: #909090;
    text-decoration: underline;
}
#footer:before {
    content: " ";
    width: 50px;
    height: 2px;
    background: #ACABAD;
    position: absolute;
    margin-top: -40px;
    left: 50%;
    margin-left: -25px;
}
#content + #footer:before {
    left: inherit!important;
}

/* menú lateral */
#menu-principal ul li.logout-icon {
    border-top: none!important;
}
#menu-principal ul li {
    background: none!important;
    position: relative;
    z-index: 10;
}
#menu-principal ul li a {
    padding: 10px 30px;
    text-transform: uppercase;
    font-weight: 700;
    color: #474747;
    background: url(../img/versionpaywall/flecha-movil-menu2x.png) 175px center no-repeat;
    background-size: 10px;
    letter-spacing: -0.5px;
}
#menu-principal ul li a.ui-state-active {
    padding: 10px 30px;
    text-transform: uppercase;
    font-weight: 700;
    color: #474747;
    background: url(../img/versionpaywall/flecha-movil-down-menu2x.png) 175px center no-repeat;
    background-size: 15px;
}
#menu-principal ul li a:after {
    content: " ";
    height: 1px;
    position: relative;
    display: block;
    top: 5px;
    background: rgba(244,244,244);
    box-shadow: 0px 1px 0px 0px rgba(0,0,0,0.05);
}
#menu-principal ul li ul.submenu {
    background: #D6D6D6;
    position: relative;
    top: -5px; 
    overflow: hidden;
}
#menu-principal ul li ul.submenu:before {
    content: " ";
    position: relative;
    display: block;
    width: 20%;
    margin: auto;
    box-shadow: 0px 0px 30px 30px #fff;
    z-index: 1;
    top: -30px;
}
#menu-principal ul li ul.submenu li a {
    color: #7A7A7A;
    padding: 10px 10px 0px 45px;
    background: none;
    font-size: 13px;
}
#menu-principal ul li ul.submenu li a:before {
    width: 10px;
    height: 4px;
    background: #fff;
    position: absolute;
    border-radius: 5px;
    left: 25px;
    top: 15px;
    content: " ";
}
#menu-principal ul li ul.submenu li a:hover {
    color: #474747;
}

.submenu li a:after, #lnkLogOut:after{
    height: 0px!important;
}
#menu-principal ul.logout {
    background: #2C2C2C;
    border-radius: 5px;
}
#menu-principal ul li.logout-icon a {
    color: #D6D6D6;
}
#menu-principal ul li.logout-icon a:after {
    transform: rotate(-180deg);
    content: " ";
    height: 14px!important;
    position: absolute;
    width: 150px;
    margin: auto;
    left: 30px;
    top: 13px;
    display: block;
    background: url(../img/versionpaywall/flecha-movil-menu2x.png);
    background-size: contain;
    background-repeat: no-repeat;
    box-shadow: none;
}
/* estructura home */
#camera_wrap_1{
    display: block!important;
}
#camera_wrap_2{
    display: none!important;
}
body {
    background: #EFEFEF!important;
}
#content #aspnetForm{
    display: grid;
}
.menu_home{
    display: grid;
    grid-template-columns: repeat(4,auto);
}
/* cards home */
#content .cat {
    border-radius: 10px;
    box-shadow: 0px 25px 15px -28px #97a3b8;
    height: 285px;
}
#content .cat a {
    color: #B0B0B0;
}
#content .cat a:after {
    content: " ";
    height: 1px;
    position: relative;
    width: 80%;
    margin: auto;
    display: block;
    top: 0px;
    background: url(../img/versionpaywall/linea-divisoria-otras-opciones.png);
    background-size: contain;
}
.menu_home .cat a {
    font-size: 11px!important;
    text-transform: uppercase;
    font-weight: 700;
}
#content .cat p {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 700;
    color: #474747;
}
.menu_home .cat p {
    width: 100%!important;
}
    /* fondos cartas */
#content .mis-productos, #content .mis-productos:hover {
    background: #FFFFFF url(../img/versionpaywall/img-datospersonales-escritorio.png) center 0px no-repeat;
    background-size: contain;
}
#content .mis-datos, #content .mis-datos:hover {
    background: #FFFFFF url(../img/versionpaywall/img-productos-escritorio.png) center 0px no-repeat;
    background-size: contain;
}
#content .intelecto, #content .intelecto:hover {
    background: #FFFFFF url(../img/versionpaywall/img-intelecto-escritorio.png) center 0px no-repeat;
    background-size: contain;
}
#content .productos-digitales, #content .productos-digitales:hover {
    background: #FFFFFF url(../img/versionpaywall/img-versionesdigitales-escritorio.png) center 0px no-repeat;
    background-size: contain;
}
    /* banner ppal */
.camera_wrap .camera_pag .camera_pag_ul {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: center;
}
    /* tamaños indicadores banner */
.camera_wrap .camera_pag .camera_pag_ul li {
    height: 10px!important;
    width: 10px!important;
}
.camera_wrap .camera_pag .camera_pag_ul li > span {
    border-radius: 50%!important;
    height: 10px!important;
    width: 10px!important;
    left: 0px!important;
    top: 0px!important;
}
.camera_wrap .camera_pag .camera_pag_ul li.cameracurrent > span {
    background: #BBC900!important;
}
.camera_wrap .camera_pag .camera_pag_ul {
    text-align: center!important;
}
/* titulos pantallas */
h2.subtitulo:after {
    content: " ";
    width: 30px;
    height: 2px;
    background: #B1B1B1;
    position: absolute;
    left: 50%;
    margin-left: -15px;
    top: 75px;
}
h2.subtitulo {
    text-align: center;
    font-size: 16px;
    margin-top: -20px;
    text-transform: uppercase;

    color: #212121;
}
/* sección actualizar datos */
#home__cphPrincipal_divHabeasData {
    margin-top: 80px;
}
.parrafo-icono-atencion-cliente .title-wrap:after{
    display: none!important;
}
#content h1 {
    padding-left: 0;
    color: #B3B3B3;
    text-align: center;
    text-transform: uppercase;

    font-size: 22px;
    height: 50px;
}
#content form p {
    padding: 25px 0px 45px 0px;
    color: #7B7B7B;
    width: 70%;
    margin: auto;
    text-align: center;
    text-transform: initial;
    font-size: 15px;
    line-height: 15px;
    letter-spacing: -0.1px;
    position: relative;
    font-weight: 500;
}
#home__cphPrincipal_menuHome p{
    padding: 0px 0px 15px 0px!important;
}
#home__cphPrincipal_textoEncabezado:after {
    position: absolute;
    width: 100%;
    height: 45px;
    background: url(../img/versionpaywall/sombra-visel-separador-iniciarsesion.png) center center no-repeat;
    margin-top: -65px;
    background-size: contain;
    content: " ";
    left: 50%;
    z-index: 9;
    margin-left: -50%;
}
#content .datos-personales{
    background: none;
    position: relative;
}

#content form .wrap .camp span {
    text-transform: uppercase;
    letter-spacing: -0.2px;
    font-weight: 600;
    font-size: 13px;
}
#content form .wrap .camp input, #content form .wrap .camp select, #content .wrap .cdr-table select {
    text-transform: uppercase;
}

#content form input[type=submit] {
    background: #BCCA00;
    border: none;
    padding: 10px 15px;
    text-transform: uppercase;
    font-size: 15px;
    color: #FFFFFF;
    font-weight: bold;
    display: block;
    margin: 20px -30px auto;
    cursor: pointer;
    border-radius: 5px;
    z-index: 1;
    position: absolute;
}
#home__cphPrincipal_btnGuardarCta {
    margin-top: 70px!important;
}
#home__cphPrincipal_divHabeasData input[type=checkbox] {
    display: block;
}
.parrafo-icono-atencion-cliente:before {
    content: " ";
    position: absolute;
    width: 100%;
    height: 75px;
    background: url(../img/versionpaywall/icono-diadema-telefono@2x.png) center center no-repeat;
    margin-top: -10px;
    background-size: contain;
    left: 0;
    z-index: 2;
    margin-left: -80%;
}
.parrafo-icono-atencion-cliente {
    width: 25%!important;
    position: relative!important;
    right: -42%;
    margin: inherit!important;
    text-align: left!important;
}
.parrafo-icono-atencion-cliente .title-wrap {
    font-size: 20px;
    display: block;
}
    /* checkbox parte baja pantalla */
    #home__cphPrincipal_divHabeasData td > span {
        display: inline-block;
        position: absolute;
        z-index: 1000;
    }
    #home__cphPrincipal_divHabeasData p {
        padding: 0!important;
        margin: 0!important;
        display: inline-block;
        width: 100%!important;
        text-align: left!important;
        padding-left: 35px!important;
        text-transform: uppercase!important;
    }
    #home__cphPrincipal_divHabeasData p a {
        color: #5d5d5d;
        font-weight: 700;
    }
    #home__cphPrincipal_divHabeasData td:after, #home__cphPrincipal_divHabeasData tr:first-child td:before {
        content: " ";
        width: 180px;
        height: 10px;
        margin: auto;
        display: block;
        background: url(../img/versionpaywall/linea-divisoria-otras-opciones.png) center center no-repeat;
    }
    #home__cphPrincipal_divHabeasData tr:last-child td {
        display: none;
    }
/* pantalla beneficiarios */
#home__cphPrincipal_beneficiariosActuales #titulo-principal2 {
    border-bottom: 40px solid #A7A7A7;
}
#home__cphPrincipal_beneficiariosActuales #content form .wrap {
    padding: 0;
}
#home__cphPrincipal_beneficiariosActuales #home__cphPrincipal_beneficiario_1 {
    display: grid;
    grid-template-columns: repeat(4,auto);
}
#home__cphPrincipal_beneficiario_1.wrap{
    padding: 0!important;
}
#home__cphPrincipal_beneficiario_1.wrap p {
    padding: 20px 10px;
    width: 100%;
    margin: 0;
}
#home__cphPrincipal_beneficiario_1 p input {
    margin-top: -15px;
}
#home__cphPrincipal_beneficiario_1 p span {
    width: 100%;
    position: absolute;
    margin-top: -55px;
    margin-left: 15px;
    padding: 10px 0;
    color: #fff;
    text-align: left;
}
#home__cphPrincipal_beneficiario_1.wrap p{
    border-right: none!important;
}
#home__cphPrincipal_beneficiariosActuales .title-wrap:after {
    position: absolute;
    width: 100%;
    height: 45px;
    background: url(../img/versionpaywall/sombra-visel-separador-iniciarsesion.png) center center no-repeat;
    margin-top: -5px;
    background-size: contain;
    content: " ";
    left: 50%;
    z-index: 9;
    margin-left: -50%;
}
p.camp-relationship select {
    width: 140px;
    background: #f7f6f6;
    color: #6D6D6D;
    font-size: 14px;
    font-weight: 600;
    position: relative;
    top: -10px;
    border-radius: 5px;
    padding: 8px 10px;
    border: 1px solid #DFDFDF;
    text-transform: uppercase;
    height: 35px;
}
/* renovar mis suscripciones */
#content .mis-productos-header {
    background: none;
}
/* Detalle consumos intelecto */
#home__cphPrincipal_upIntelecto > table{
    text-align: center;
}
#home__cphPrincipal_upIntelecto > table td {
    margin-bottom: 5px;
}
#home__cphPrincipal_upIntelecto > table #home__cphPrincipal_fechaHasta, #home__cphPrincipal_upIntelecto > table #home__cphPrincipal_fechaDesde {
    background: #f7f6f6;
    padding: 7px 5px;
    border: 1px solid #DEDEDE;
    width: 95%;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    display: inline;
}
.accordion table table{
    box-shadow: 0px 25px 15px -28px #97a3b8;
    margin-bottom: 80px;
}
.accordion table table, .accordion table{
    width: 100%!important;
    border: none;
}
.accordion table table tr {
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    color: #626262!important;
    background: #fff;
    border-color: #CCCCCC;
}
.accordion table table th {
    padding: 15px;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    background: #A7A7A7;
}
.accordion table table tr td {
    padding: 15px;
    text-align: center;
}
.accordion table table tr td:last-child {
    border-right: none;
}
.accordion table table tr td:first-child {
    border-left: none;
}
.accordion table table tr:last-of-type td{
    border-bottom: none;
}
.accordion table table tr:last-of-type td:last-child {
    border-bottom-right-radius: 10px;
    border-right: none;
    border-bottom: none;
}
.accordion table table tr:last-of-type td:first-child {
    border-bottom-left-radius: 10px;
    border-left: none;
    border-bottom: none;
}
#home__cphPrincipal_upIntelecto table td {
    padding: 0px 10px;
}
#home__cphPrincipal_upIntelecto table, #home__cphPrincipal_totalAhorro {
    margin: auto;
    font-weight: 700;
}
#home__cphPrincipal_totalAhorro {
    margin-top: 100px!important;
}
#home__cphPrincipal_upIntelecto #home__cphPrincipal_btnConsultar {
    right: 50%;
    margin-right: -52px;
    margin-top: 55px;
}
/* pantalla gestionar perfil */
#home__cphPrincipal_divCambioClave {
    background: none;
}
h3.email, h3.key, h3.detalle_intelecto {
    padding: 15px 0px;
    text-transform: uppercase;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    font-size: 18px;
    background: #3C3C3C;
    position: relative;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
h3.email:after, h3.key:after, h3.detalle_intelecto:after {
    transform: rotate(90deg);
    content: " ";
    height: 25px!important;
    position: absolute;
    width: 12px;
    margin: auto;
    right: 20px;
    top: 13px;
    display: block;
    background: url(../img/versionpaywall/flecha-movil-menu2x.png);
    background-size: contain;
    background-repeat: no-repeat;
    box-shadow: none;

    -webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
h3.email.ui-state-active:after, h3.key.ui-state-active:after, h3.detalle_intelecto.ui-state-active:after {
    transform: rotate(270deg);
    -webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
h3.key{
    margin-top: 50px;
}
.email.ui-state-active, .key.ui-state-active{
    margin-bottom: 0px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}
#home__cphPrincipal_divCambioClave {
    background: none!important;
}
#accordion #home__cphPrincipal_UpdatePanel1 {
    background: #fff;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
#home__cphPrincipal_divEmail {
    text-align: center;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
#accordion #home__cphPrincipal_UpdatePanel1 input[type=submit], #accordion #home__cphPrincipal_UpdatePanel3 input[type=submit] {
    text-align: center;
    margin-left: -54px;
    position: absolute;
    left: 50%;
    margin-top: 0px;
}
#home__cphPrincipal_divContrasegna{
    text-align: center;
}
#home__cphPrincipal_divEmail .left, #home__cphPrincipal_divContrasegna .left{
    float: none!important;
}
#home__cphPrincipal_textoEncabezado + #home__cphPrincipal_divCambioClave{
    box-shadow: none!important;
}
/*  Requerido formularios */
span.requerido {
    position: absolute;
    margin-left: 5px;
    color: red;
    width: 2px!important;
}
/* Página compra suscripción */

#content {
    position: relative;
}
/* cambio de fuente por Roboto Condensed */
html *{
    font-family: 'Roboto Condensed', sans-serif!important;
}
#header {
    height: 50px;
    background: url(../img/versionpaywall/barrasuperior-fondo-madera.jpg);
    z-index: 10;
    background-size: cover;
    background-repeat: no-repeat;
}
.space {
    padding-top: 50px;
}
#paso-a-paso {
    position: relative;
    text-align: center;
}
#paso-a-paso li{
    background: none!important;
}
#paso-a-paso li span {
    padding-top: 25px;
    text-transform: uppercase;
    color: #A7A7A7;
    font-weight: 600;
}
#paso-a-paso li.activo span {
    color: #353535;
}
#paso-a-paso:before {
    content: " ";
    width: 90%;
    height: 6px;
    margin: auto;
    background: -moz-linear-gradient(90deg, rgba(167,167,167,1) 0%, rgba(187,202,0,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(167,167,167,1) 0%, rgba(187,202,0,1) 100%);
    background: linear-gradient(90deg, rgba(167,167,167,1) 0%, rgba(187,202,0,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#a7a7a7",endColorstr="#bbca00",GradientType=1);
    position: absolute;
    left: 50%;
    margin-left: -45%;
    border-radius: 10px;
}
#paso-a-paso:after {
    position: absolute;
    width: 414px;
    height: 70px;
    background: url(../img/versionpaywall/bisel-separador-bt-iniciarsesion.png) center center no-repeat;
    top: 110px;
    content: " ";
    left: 50%;
    margin-left: -207px;
    transform: rotateX(180deg);
    z-index: 0;
}
#paso-a-paso li {
    position: relative;
}
#paso-a-paso li:before {
    content: " ";
    width: 30px;
    height: 30px;
    border-radius: 100%;
    background: #FFFFFE;
    position: absolute;
    border: 2px solid #C4C4C4;
    margin-top: -15px;
    left: 50%;
    margin-left: -15px;
}
#paso-a-paso li.activo:before{
    background: #BBCA01;
    border: 2px solid #fff;
}
#paso-a-paso li.seleccion:after {
    content: "1";
    position: absolute;
    top: 0;
    left: 50%;
    top: -7px;
    margin-left: -2px;
    color: #c4c4c4;
    font-weight: 700;
}
#paso-a-paso li.compracorrecta:after {
    content: "✓";
    position: absolute;
    top: 0;
    left: 49%;
    top: -7px;
    margin-left: -2px;
    color: #c4c4c4;
    font-weight: 700;
}
#paso-a-paso li.pago:after {
    content: "2";
    position: absolute;
    top: 0;
    left: 50%;
    top: -7px;
    margin-left: -2px;
    color: #c4c4c4;
    font-weight: 700;
}
#paso-a-paso li.confirmacion:after {
    content: "3";
    position: absolute;
    top: 0;
    left: 50%;
    top: -7px;
    margin-left: -2px;
    color: #c4c4c4;
    font-weight: 700;
}
#paso-a-paso li.activo:after {
    color: #fff!important;
}
#paso-a-paso + .pasos{
    top: 60px;
}
#paso-a-paso + .pasos.title-wrap1 {
    top: 20px;
}
.jcarousel-wrapper {
    border: none!important;
    background-color: transparent!important;
    box-shadow: none!important;
}
.jcarousel-control-prev, .jcarousel-control-next, .jcarousel {
    background: transparent!important;
}
.jcarousel li {
    background: #FFFFFF;
    padding: 10px!important;
    border: none!important;
    margin-bottom: 50px!important;
    border-top-right-radius: 10px!important;
    border-top-left-radius: 10px!important;
    box-shadow: 0px 25px 15px -28px #97a3b8!important;
    margin: 0 20px!important;

    grid-template-columns: 65% 35%;
    grid-template-rows: auto;
    grid-template-areas:
        "header header2"
        "main main";
    display: grid;
}
.jcarousel li a {
    grid-area: header;
}
.jcarousel li > div {
    background: #E6E6E6!important;
    margin-bottom: 0px!important;
    border-radius: 3px!important;
    margin-right: 0!important;
    width: 100%!important;
    position: relative;
    left: -10px;
    padding: 10px!important;
    top: 10px;

    grid-area: main;
}
.jcarousel li p {
    text-align: left!important;
    margin-left: -20px!important;
    background: transparent!important;
    color: #353535!important;
    text-transform: uppercase!important;
    font-weight: 600!important;
    padding: 10px 26px !important;
    grid-area: header2;
}
.jcarousel li p:before {
    position: absolute;
    width: 70px;
    height: 70px;
    /*background: url(../img/versionpaywall/logo-elcolombiano-elecccion-suscripcion.png) center center no-repeat;*/
    top: -75px;
    content: " ";
    z-index: 1;
    visibility: visible;
}
.jcarousel img {
    width: 100%!important; 
    margin: 0!important;
}
.caja::after {
    content: ""!important;
    background-color: none!important;
    background: none!important;
}
#detailProduct .titulo, #detailPlan .titulo {
    background: #3C3C3C!important;
    color: #FFFFFF!important;
    text-transform: uppercase!important;
    text-align: center!important;
    width: 100%!important;
    padding: 15px 0px!important;
    text-transform: uppercase!important;
    border-top-left-radius: 5px!important;
    border-top-right-radius: 5px!important;
    font-size: 16px!important;
    font-weight: 600!important;
    margin-left: 0!important;
    margin-bottom: 5px!important;
}
#detailProductMas, #detailPlan .titulo {
    font-weight: 600;
    text-align: left;
    color: #939393;
    width: 90%!important;
    background: #fff;
    margin-left: inherit;
    padding: 25px 50px;
    margin-bottom: 50px;
    box-shadow: 0px 25px 15px -28px #97a3b8;
    margin-top: -5px;
}
#home__cphPrincipal_tituloProducto.titulo{
    width: 100%!important;
}
#detailProductMas {
    margin-top: 0!important;
}
#home__cphPrincipal_detalleProducto + #detailProductMas{
    width: 100%!important;
}
#detailPlan .detail-right p.clearfix:after {
    position: absolute;
    width: 200px;
    height: 10px;
    background: url(../img/versionpaywall/linea-divisoria-otras-opciones.png) center center no-repeat;
    top: 45px;
    content: " ";
    z-index: 1;
    visibility: visible;
}
#detailPlan .detail-right span {
    font-weight: 600;
    color: #B1B1B1;
}
#detailPlan .detail-right span.option-detail {
    color: #3B3B3B;
    font-weight: 600;
}
#detailPlan .detail-right p {
    position: relative;
}
#detailPlan .detail-right span.option-detail {
    text-transform: uppercase;
    font-size: 15px;
}
#home__cphPrincipal_upDetalles input[type=submit], #ctl00__cphPrincipal_lnkContinuar{
    background: #BCCA00;
    border: none;
    padding: 10px 15px;
    text-transform: uppercase;
    font-size: 15px;
    color: #FFFFFF;
    font-weight: bold;
    cursor: pointer;
    border-radius: 5px;
    z-index: 1;
    position: absolute;
    left: 50%;
    margin-left: -54px!important;
    margin-top: -50px!important;
}
#detailPlan {
    background: #fff;
    padding: 0px 0px 30px 0px;
}
#detailPlan .detail-right {
    float: none;
}

#detailProductMas, #detailPlan .titulo {
    font-weight: 600;
    text-align: left;
    color: #939393;
    width: 100%;
    background: #fff;
    margin-left: inherit;
    padding: 25px 50px;
    margin-bottom: 50px;
    box-shadow: 0px 25px 15px -28px #97a3b8;
}
#detailPlan {
    background: #fff;
    padding: 0px 0px 30px 0px;
}
#home__cphPrincipal_upDetalles input[type=submit] {
    margin-top: -70px!important;
    left: 50%!important;
    margin-left: -52px!important;
}
#home__cphPrincipal_upDetalles {
    margin-top: -80px;
}


#detailProduct .titulo, #detailPlan .titulo {
    background: #3C3C3C;
    color: #FFFFFF;
    text-transform: uppercase;
    text-align: center;
    width: 100%;
    padding: 15px 0px;
    text-transform: uppercase;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    font-size: 18px;
    font-weight: 600;
    margin-left: 0;
    margin-bottom: 5px;
}
.jcarousel li {
    padding: 10px!important;
    border: none!important;
    margin-bottom: 50px!important;
    border-top-right-radius: 10px!important;
    border-top-left-radius: 10px!important;
    box-shadow: 0px 25px 15px -28px #97a3b8!important;
}
.jcarousel li > div {
    background: #E6E6E6!important;
    margin-bottom: 0px!important;
    border-radius: 3px!important;
    margin-right: 0!important;
    width: 100%;
    position: relative;
    left: -10px;
    padding: 10px!important;
    top: 10px;
}
.caja::after {
    content: ""!important;
    background-color: none!important;
    background: none!important;
}
select {
    color: #626262;
}
#detailPlan .detail-right p {
    margin: 5px 0px;
    padding: 10px 0px;
    text-align: left;
}
#detailPlan .detail-right p.clearfix:after {
    position: absolute;
    width: 200px;
    height: 10px;
    background: url(../img/versionpaywall/linea-divisoria-otras-opciones.png) center center no-repeat;
    top: 45px;
    content: " ";
    z-index: 1;
    visibility: visible;
}
#detailPlan .detail-right span {
    font-weight: 600;
    color: #B1B1B1;
}
#detailPlan .detail-right span.option-detail {
    color: #3B3B3B;
    font-weight: 600;
}
#detailPlan .detail-right p.total {
    font-size: 25px;
    margin-top: 15px;
    color: #3C3C3C;
    font-weight: 700;
}
.detail-right .clearfix:nth-child(5):after, .detail-right .clearfix:nth-child(6):after {
    background: none!important;
}
/* interna compra */
.jcarousel{
    width: 110%;
}
.jcarousel #home__cphPrincipal_carrouselProductos {
    width: auto!important;
    display: grid;
    height: 350px;
    grid-template-columns: repeat(2,auto);
}
#home__cphPrincipal_carrouselProductos li {
    width: 90%!important;
    height: fit-content;
}
#home__cphPrincipal_carrouselProductos li:nth-child(3), #home__cphPrincipal_carrouselProductos li:nth-child(4){
    margin-top: 70px!important;
}
#home__cphPrincipal_carrouselProductos li > div {
    width: calc(100% + 20px)!important;
}
.jcarousel-control-prev {
    background: url(../img/fase2/arrow-prev.png) center center no-repeat!important;
}
.jcarousel-control-next {
    background: url(../img/fase2/arrow-next.png) center center no-repeat!important;
}
#home__cphPrincipal_carrouselProductos li {
    height: fit-content;
    margin-left: 0!important;
    margin-right: 0!important;
    margin-bottom: 100px!important;
}
#home__cphPrincipal_frecuencias + .detail-right {
    margin: auto;
}
/* AJUSTES TABLA PLAN EN INTERNA */
table.planes tr.title td {
    padding: 15px;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    background: #A7A7A7;
}
table.planes tr.title td:nth-child(1){
    border-top-left-radius: 10px;
}
table.planes tr.title td:last-child{
    border-top-right-radius: 10px;
}
table.planes tr:nth-child(1) td { 
    border: none;
}
table.planes tr:nth-child(1) td:nth-child(2) {
    border-left: 1px solid #CCCCCC!important;
}
table.planes tr:nth-child(2) td { 
    border: none;
    padding: 15px 0px;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    color: #626262!important;
    background: #fff;
}
table.planes tr:nth-child(2) td:nth-child(2) {
    border-left: 1px solid #CCCCCC!important;
}
#home__cphPrincipal_divDeptoCiudad .wrap-direcc {
    box-shadow: none;
    border: none;

    padding: 0;
}
#home__cphPrincipal_divDeptoCiudad .left-alt .camp, #home__cphPrincipal_divDeptoCiudad .right-alt .camp {
    background: transparent;
    display: grid;
    grid-template-columns: 30% 70%;
}
#home__cphPrincipal_divDeptoCiudad .wrap-direcc span {
    margin-top: 6px;
}
#divDireccion td {
    padding: 10px;
}

.ui-datepicker .ui-widget-content {
    background: #ffffff repeat;
  }
  
  .ui-datepicker-title {
    border: 0px;
    background: #3C3C3C 50% 50% repeat-x!important;
    color: #fff!important;
  }
  .ui-datepicker-month option, .ui-datepicker-year option{
      color: #3C3C3C;
  }
  .ui-datepicker-month, .ui-datepicker-year{
      color: #fff;
      width: 100%!important;
  }
  table.ui-datepicker-calendar a.ui-state-default {
      border: 1px solid #0A3B4C;
      color: #3C3C3C;
  }
  .ui-datepicker-header a.ui-datepicker-prev {
    border: 0px;
    background: #FFFFFF;
  }
  
  .ui-datepicker-header a.ui-datepicker-next {
    border: 0px;
    background: #FFFFFF;
  }
  
  .ui-datepicker-calendar th {
    background: #FFFFFF;
    border: 0px;
    color: #959595;
    font-family: "Arial";
    font-size: 12pt;
    font-weight: normal;
  }
  
  .ui-datepicker-calendar a.ui-state-active {
    color: #19BEC8;
    font-weight: bold;
    background-color: yellow;
  }
  
  .ui-datepicker-calendar tr {
    text-align: center;
    padding: 0;
    background-color: #F6F6F6
  }
  
  .ui-datepicker-other-month {
    background-color: #FFFFFF;
  }
table.ui-datepicker-calendar a.ui-state-highlight {
    background: #BCCA00;
}
.wrap .txtfechaNacimiento.hasDatepicker {
    background: #f7f6f6;
    padding: 7px 5px;
    border: none;
    width: 215px;
    border-radius: 5px;
}

#home__cphPrincipal_div1 + .wrap{
    text-align: center;
}
.btn-payment:after {
    position: absolute;
    width: 414px;
    height: 70px;
    background: url(../img/versionpaywall/bisel-separador-bt-iniciarsesion.png) center center no-repeat;
    background-size: contain;
    margin-top: -43px;
    content: " ";
    margin-left: -165px;
    transform: rotateX(180deg);
    z-index: 0;
}
.textos table {
    margin: auto;
}
/* revisar si estas caracteristicas desubican el boton en otras pantallas */
#home__cphPrincipal_btnEnviar {
    left: 50%;
    margin-top: -5px;
}
.btn-payment input {
    margin-top: -20px!important;
}
/* quitar sombra donde no debe ir */
.parrafo-icono-atencion-cliente + br + #home__cphPrincipal_UpdatePanel2{
    box-shadow: none!important;
}
/* titulos paso2 */
#ctl00__cphPrincipal_divNatural {
    padding: 0;
}
.contenedor div .card {
    padding: 0!important;
    width: 85%!important;
    margin: auto!important;
    margin-bottom: 65px!important;
    margin-top: 50px!important;

}
.contenedor h2.subtitulo{
    margin-bottom: 30px;
}
.contenedor div .card2 {
    min-height: 170px !important;
}
.contenedor h2.subtitulo:after {
    content: " ";
    width: 30px;
    height: 2px;
    background: #B1B1B1;
    position: absolute;
    left: 50%;
    margin-left: -15px;
    top: 100px!important;
}
#ctl00__cphPrincipal_divNatural h1, #ctl00__cphPrincipal_fechaInicioSuscripcion h1, .card h1 {
    background: #3C3C3C!important;
    color: #FFFFFF!important;
    text-transform: uppercase!important;
    text-align: center!important;
    width: 100%!important;
    padding: 15px 0px!important;
    text-transform: uppercase!important;
    border-top-left-radius: 5px!important;
    border-top-right-radius: 5px!important;
    font-size: 16px!important;
    font-weight: 600!important;
    margin-left: 0!important;
}
.card p {
    padding: 10px 0!important;
}
.contenedor div .card .left .camp, .contenedor div .card .right .camp {
    display: grid;
    grid-template-columns: repeat(2,auto);
}
.contenedor div .card .left {
    margin-left: 20px;
}
.contenedor div .card .left .camp .span_frm, .contenedor div .card .right .camp .span_frm {
    width: 140px;
}
.Terminos input[type=checkbox]{
    display: inline;
}
.datos-basicos td:after, .datos-basicos tr:first-child td:before {
    content: " ";
    width: 180px;
    height: 10px;
    margin: auto;
    display: block;
    background: url(../img/versionpaywall/linea-divisoria-otras-opciones.png) center center no-repeat;
}
.datos-basicos p {
    padding: 0!important;
    margin: 0!important;
    display: inline!important;
    width: 100%!important;
    text-align: left!important;
    padding-left: 35px!important;
    text-transform: uppercase!important;
}
.datos-basicos a {
    color: #5d5d5d;
    font-weight: 700;
}
.card h1{
    height: inherit!important;
}
.jcarousel ul {
    width: auto!important;
}
table.browserref {
    border: none;
}
table.browserref .title {
    background: transparent;
}
.browserref tr:first-child td {
    padding: 15px;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    background: #A7A7A7;
}
.browserref tr:first-child td:nth-child(2) {
    border-top-right-radius: 10px;
}
.browserref tr:first-child td:nth-child(1) {
    border-top-left-radius: 10px;
}
.browserref tr:nth-child(2) td {
    border: 1px solid #CCCCCC;
    border-left: none;
    border-right: none;
    padding: 15px 0px;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    color: #626262!important;
    background: #fff;
}
.browserref tr:nth-child(2) td:first-child {
    border-right: 1px solid #ccc;
}
#ctl00__cphPrincipal_divResumenPago input[type=submit] {
    left: 50%;
}
#ctl00__cphPrincipal_mensajePasarela:before {
    position: absolute;
    width: 100%;
    height: 45px;
    background: url(../img/versionpaywall/sombra-visel-separador-iniciarsesion.png) center center no-repeat;
    margin-top: -65px;
    background-size: contain;
    content: " ";
    left: 50%;
    z-index: 9;
    margin-left: -50%;
}
.txt-payment {
    padding: 0!important;
    margin: 20px auto!important;
    display: block;
    text-align: center!important;
    padding-left: 35px!important;
    text-transform: uppercase!important;
    font-weight: 700!important;
    line-height: 20px!important;
}
#ctl00__cphPrincipal_upDetalles #tituloProducto {
    width: 100%!important;
}
#paso-a-paso:after {
    top: 140px;
    transform: rotateX(-290deg);
    z-index: 0;
    position: absolute;
    width: 100%;
    height: 45px;
    background: url(../img/versionpaywall/sombra-visel-separador-iniciarsesion.png) center center no-repeat;
    margin-top: -75px;
    background-size: contain;
    content: " ";
    left: 50%;
    z-index: 9;
    margin-left: -50%;
}
.izquierda .camp {
    display: block!important;
}
#ctl00__cphPrincipal_captchaPruebas + input[type=submit] {
    position: relative!important;
}
.datos-basicos td {
    line-height: 30px!important;
}
/* direccion en pasarela externa */
#ctl00__cphPrincipal_div4 {
    width: 75%;
    margin: auto;
}
.abajo {
    margin-top: 35px;
    width: 75%;
}
.izquierda {
    margin-right: 20%!important;
}
.abajo .camp {
    grid-template-columns: 30% 70%!important;
}
.abajo .estandar {
    width: 125%;
}
.abajo:before {
    content: " ";
    width: 115%;
    height: 1px;
    position: relative;
    display: block;
    top: -25px;
    background: rgba(244,244,244);
    box-shadow: 0px 1px 0px 0px rgba(0,0,0,0.05);
}
#ctl00__cphPrincipal_div4 .camp {
    grid-template-columns: repeat(1, auto);
}
#ctl00__cphPrincipal_div4 input {
    padding: 10px 5px;
}
#ctl00__cphPrincipal_div4 select {
    margin: 0px 0px;
    height: 35px;
}
.contenedor div .card3 {
    min-height: 730px !important;
}
#ctl00__cphPrincipal_txtDirLinea1Numero, #ctl00__cphPrincipal_txtDirLinea2Numero, #ctl00__cphPrincipal_ddlDirLinea1Orientacion, #ctl00__cphPrincipal_ddlDirLinea2Orientacion, #ctl00__cphPrincipal_txtDirLinea2Numero2, #ctl00__cphPrincipal_txtComplemento {
    margin-bottom: 15px!important;
}
.datos-basicos input[type=submit]{
    position: relative!important;
}
.card .wrap{
    width: 95%;
    margin: auto;
}
.derecha .camp span{
    margin: 15px 5px;
}
.derecha .camp span.requerido{
    margin: 0px 5px;
}
/* tabla ahorros */
#content .intelecto-header {
    background: none;
}
.intelectotbl {
    box-shadow: 0px 25px 15px -28px #97a3b8;
    border: none;
}
.intelectotbl th {
    padding: 15px 0px;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    background: #A7A7A7;
}
.intelectotbl tr th:first-child {
    border-top-left-radius: 10px;
}
.intelectotbl tr th:nth-child(2) {
    border-top-right-radius: 10px;
}
table.intelectotbl {
    border: none;
}
table.intelectotbl td {
    border: 1px solid #CCCCCC;
    border-left: none;
    border-right: none;
    padding: 15px 0px;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    color: #626262!important;
    background: #fff;
}
table.intelectotbl td a{
    color: #626262!important;
    text-decoration: underline;
}
.intelectotbl tr:last-child td {
    background: #E1E1E1;
}
.intelectotbl tr:last-child td:first-child {
    border-bottom-left-radius: 10px;
    border-left: none;
    border-bottom: none;
}
.intelectotbl tr:last-child td:nth-child(2) {
    border-bottom-right-radius: 10px;
    border-right: none;
    border-bottom: none;
}
/* productos */
#content h1.alt {
    padding-left: 0px;
}
table.planes {
    margin: 50px auto 50px;
    text-align: center;
    border-collapse: collapse;
    border: #CECECE 1px solid;
}
    /* tabla renovacion */
#ctl00__cphPrincipal_GridViewSuscripciones{
    box-shadow: 0px 25px 15px -28px #97a3b8;
}
#ctl00__cphPrincipal_GridViewSuscripciones tr{
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    color: #626262!important;
    background: #fff;
}
#ctl00__cphPrincipal_GridViewSuscripciones tr td{
    padding: 15px;
}
#ctl00__cphPrincipal_GridViewSuscripciones tr td:first-child {
    border-bottom-left-radius: 10px;
    border-left: none;
    border-bottom: none;
}
#ctl00__cphPrincipal_GridViewSuscripciones tr td:last-child {
    border-bottom-right-radius: 10px;
    border-right: none;
    border-bottom: none;
}
.headerTablaPlanesActivos th {
    padding: 15px;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    background: #A7A7A7;
}
.headerTablaPlanesActivos th:first-child {
    border-top-left-radius: 10px;
}
.headerTablaPlanesActivos th:last-child {
    border-top-right-radius: 10px;
}
input#home__cphPrincipal_btnRenovarOtrasCond, input#home__cphPrincipal_btnRenovar  {
    margin: 0!important;
    cursor: pointer;
    border-radius: 5px;
    z-index: 1;
    position: relative!important;
    right: 24%;
}
#ctl00__cphPrincipal_GridViewConsumos tr td {
    padding: 15px;
}
#ctl00__cphPrincipal_GridViewConsumos tr {
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    color: #626262!important;
    background: #fff;
}
#ctl00__cphPrincipal_GridViewConsumos tr:last-child td:first-child {
    border-bottom-left-radius: 10px;
    border-left: none;
    border-bottom: none;
}
#ctl00__cphPrincipal_GridViewConsumos tr:last-child td:last-child {
    border-bottom-right-radius: 10px;
    border-right: none;
    border-bottom: none;
}
/* reserva eventos peliculas */
#home__cphPrincipal_upPeliculas .content {
    background: transparent;
    border: none;
    box-shadow: none;
}
#content .reservar-boletas {
    background: none;
}
#home__cphPrincipal_upPeliculas #wrap-tabs {
    width: auto;
}
#home__cphPrincipal_upPeliculas .menu {
    left: 50%;
    position: relative;
    margin-left: -180px!important;
}
#home__cphPrincipal_upPeliculas .menu li.active a {
    background: #C4CC42;
    color: #fff;
}
#home__cphPrincipal_upPeliculas .menu li a {
    background: #C1C1C1;
    font-size: 15px;
    font-weight: 600;
    text-transform: uppercase;
}
.reservar-boletas .restricciones {
    background: none;
}
#tabEventosPasados {
    display: grid;
    grid-template-columns: repeat(4,auto);
}
.reservar-boletas .restricciones:after {
    position: absolute;
    width: 100%;
    height: 45px;
    background: url(../img/versionpaywall/sombra-visel-separador-iniciarsesion.png) center center no-repeat;
    margin-top: -10px;
    background-size: contain;
    content: " ";
    left: 50%;
    z-index: 10;
    margin-left: -50%;
}
/* menú threelines */
@import url('https://fonts.googleapis.com/css?family=Varela+Round');
#menu-principal .user{
    display: none;
}
html, body {
    overflow-x: hidden;
    height: 100%;
}
body {
    background: #fff;
    padding: 0;
    margin: 0;
    font-family: 'Varela Round', sans-serif;
}
.header {
    display: block;
    margin: 0 auto;
    width: 100%;
    max-width: 100%;
    box-shadow: none;
    background-color: #FC466B;
    position: fixed;
    height: 60px!important;
    overflow: hidden;
    z-index: 10;
}
.main {
    margin: 0 auto;
    display: block;
    height: 100%;
    margin-top: 60px;
}
.mainInner{
    display: table;
    height: 100%;
    width: 100%;
    text-align: center;
}
.mainInner div{
    display:table-cell;
    vertical-align: middle;
    font-size: 3em;
    font-weight: bold;
    letter-spacing: 1.25px;
}

.sidebarMenuInner li span{
    display: block;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.50);
}
.sidebarMenuInner li a{
    color: #fff;
    text-transform: uppercase;
    font-weight: bold;
    cursor: pointer;
    text-decoration: none;
}
input[type="checkbox"]:checked ~ #sidebarMenu {
    transform: translateX(0);
    display: block;
}

input[type=checkbox] {
    transition: all 0.3s;
    box-sizing: border-box;
    display: none;
}
.sidebarIconToggle {
    display: none;
}
.spinner {
    transition: all 0.3s;
    box-sizing: border-box;
    position: absolute;
    height: 3px;
    width: 100%;
    background-color: #fff;
}
.horizontal {
    transition: all 0.3s;
    box-sizing: border-box;
    position: relative;
    float: left;
    margin-top: 3px;
}
.diagonal.part-1 {
    position: relative;
    transition: all 0.3s;
    box-sizing: border-box;
    float: left;
}
.diagonal.part-2 {
    transition: all 0.3s;
    box-sizing: border-box;
    position: relative;
    float: left;
    margin-top: 3px;
}
input[type=checkbox]:checked ~ .sidebarIconToggle > .horizontal {
    transition: all 0.3s;
    box-sizing: border-box;
    opacity: 0;
}
input[type=checkbox]:checked ~ .sidebarIconToggle > .diagonal.part-1 {
    transition: all 0.3s;
    box-sizing: border-box;
    transform: rotate(135deg);
    margin-top: 8px;
}
input[type=checkbox]:checked ~ .sidebarIconToggle > .diagonal.part-2 {
    transition: all 0.3s;
    box-sizing: border-box;
    transform: rotate(-135deg);
    margin-top: -9px;
}
/* pantalla vip */
.int-cla {
    background: none;
}
.pasos.title-wrap {
    text-align: center;
    text-transform: inherit;
}   
#home__cphPrincipal_beneficios_cla p:last-child, #home__cphPrincipal_beneficios_vip p:last-child {
    padding: 0px 0px 45px 0px;
}
#home__cphPrincipal_beneficios_cla:after, #home__cphPrincipal_beneficios_vip:after {
    position: absolute;
    width: 100%;
    height: 45px;
    background: url(../img/versionpaywall/sombra-visel-separador-iniciarsesion.png) center center no-repeat;
    margin-top: -65px;
    background-size: contain;
    content: " ";
    left: 50%;
    z-index: 10;
    margin-left: -50%;
}
#home__cphPrincipal_beneficios_vip:after {
    margin-top: -35px;
}
#home__cphPrincipal_beneficios_cla:before , #home__cphPrincipal_beneficios_vip:before {
    position: absolute;
    width: 100%;
    height: 45px;
    background: url(../img/versionpaywall/sombra-visel-separador-iniciarsesion.png) center center no-repeat;
    margin-top: -65px;
    background-size: contain;
    content: " ";
    left: 50%;
    z-index: 10;
    margin-left: -50%;
}
#home__cphPrincipal_beneficios_cla .vineta-verde, #home__cphPrincipal_beneficios_vip .vineta-verde{
    width: 50%;
    position: relative;
    left: 50%;
    margin-bottom: 20px;
    height: 50px;

    background: url(../img/versionpaywall/check-beneficios2x.png) 10px center no-repeat;
}

.vineta-verde:after {
    content: " ";
    width: 180px;
    height: 10px;
    margin: auto;
    display: block;
    background: url(../img/versionpaywall/linea-divisoria-otras-opciones.png) center center no-repeat;
}
#home__cphPrincipal_beneficios_cla .vineta-verde:after:last-child {
    background: none;
}
#home__cphPrincipal_beneficios_cla {
    background-position: 150px inherit;
    background-size: 200px;
    margin-top: 20px;
    background-color: transparent;
    background-image: url('../img/fase2/inte-cla.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
}
#home__cphPrincipal_beneficios_vip {
    background: url(../img/fase2/inte-vip.png) 640px center no-repeat;
    background-position-x: 150px;
    background-position-y: 55px;
    background-size: 200px;
    margin-top: 20px;
}
.int-vip {
    background: none!important;
}
#titulo-principal {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}
#titulo-principal2 {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}
#home__cphPrincipal_UpdatePanel2 #titulo-principal {
    border-top-right-radius: 0px;
    border-top-left-radius: 10px;
    padding: 15px;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    background: #A7A7A7;
}
#home__cphPrincipal_titulo_inscribir #titulo-principal {
    border-top-right-radius: 10px;
    border-top-left-radius: 0;
}
#titulo-principal, #titulo-principal2 {
    padding: 15px 0px;
    text-transform: uppercase;
    border-top-left-radius: 5px!important;
    border-top-right-radius: 5px!important;
    font-size: 16px!important;
}
.informacion-personal, .informacion-contacto, .beneficiarios-actuales {
    background: #3C3C3C!important;
}
#home__cphPrincipal_UpdatePanel2 input[type=submit] {
    margin: auto -83px!important;
    display: inherit!important;
    position: relative!important;
    left: -50%;
}
#home__cphPrincipal_titulo_cla h1.alt2, #home__cphPrincipal_titulo_vip h1.alt2 {
    padding-top: 12px;
    height: 45px;
}
/* conflicto botones desubicados a causa de las caracteristicas anteriores*/
#home__cphPrincipal_UpdateContacto input[type=submit], #home__cphPrincipal_divNatural input[type=submit] {
    margin: 20px -30px auto!important;
    display: block!important;
    position: absolute!important;
    left: inherit!important;
}
#home__cphPrincipal_UpdateContacto input[type=submit]{
    margin: 70px -30px auto!important;
}
/* conflicto botones desubicados a causa de las caracteristicas anteriores*/
#home__cphPrincipal_UpdatePanel2 #home__cphPrincipal_cta1 {
    border-bottom: 6px solid #fff;
}
#home__cphPrincipal_UpdatePanel2 .wrap {
    padding: 0!important;
    box-shadow: none!important;
    margin-bottom: 0!important;
}
/* padding table actualizar TC */
#home__cphPrincipal_existe {
    padding: 10px!important;
}
/* wrap actualizar datos con conflicto con la tabla anterior */
#content form #home__cphPrincipal_divNatural, #home__cphPrincipal_UpdateContacto .wrap {
    padding: 20px 20px 40px 20px!important;
    margin-bottom: 50px!important;
    box-shadow: 0px 25px 15px -28px #97a3b8!important;
}
#home__cphPrincipal_UpdatePanel2{
    box-shadow: 0px 25px 15px -28px #97a3b8;
    margin-bottom: 80px;
}
/* faq */
.pantalla-faq strong {
    font-size: 16px;
    font-weight: 700;
    color: #464646;
}
.pantalla-faq tr:after {
    position: absolute;
    width: 100%;
    height: 45px;
    background: url(../img/versionpaywall/sombra-visel-separador-iniciarsesion.png) center center no-repeat;
    margin-top: -65px;
    background-size: contain;
    content: " ";
    left: 50%;
    z-index: 10;
    margin-left: -50%;
}
.pantalla-faq tr td:first-child {
    padding: 0!important;
    margin: 0!important;
    position: absolute;
    font-size: 22px;
    color: #A5A5A5;
}
/* cambio de contraseña */
.div_activacion2 #ctl00__cphPrincipal__updEnviar:before {
    top: 55px;
}
.div_activacion2 span.requerido {
    position: relative;
    margin-left: 5px;
    color: red;
    top: -35px;
    left: 160px;
}
#ctl00__cphPrincipal_captchaProd + input[type=submit] {
    position: relative!important;
    margin-right: -20px;
    margin-bottom: 50px!important;
    margin-top: 50px!important;
}
/* pantalla registro externa */
.left.formulario-registro {
    column-gap: 25px;
}
.left.formulario-registro {
    display: grid;
    grid-template-columns: repeat(2,auto);
}
/* Estilos mobile */
@media only screen and (max-device-width: 850px){
    /* config banner */
    #camera_wrap_1{
        display: none!important;
    }
    #camera_wrap_2{
        display: block!important;
    }
    /* fixes tamaño contenido en pantalla */
    .fluid_container {
        width: 100%;
    }
    #content {
        float: none;
        margin: 0;
    }
    .camera_wrap {
        max-height: 190px;
    }
    /* esconder nombre desktop header */
    #header #wrap .user{
       display: none; 
    } 
    #menu-principal .user{
        display: block;
    }
    .camera_wrap img{
        margin-left: 0!important;
    }
    /* posicion logo mobile */
    header img {
        padding-left: 10px;
        padding-top: 0px;
    }
    /* reset anchos que salen de la pantalla */
    #wrap, #content, #header {
        width: auto;
    }
    #header {
        width: 100%;
    }
    /* pantalla login */
    #login {
        margin-bottom: 60px;
    }
    #login .box {
        margin: 0px auto 40px;
    }
    #login  #ctl00__cphPrincipal__updEnviar {
        padding: 0;
    }
    .div_recordar_clave #ctl00__cphPrincipal__updEnviar:before {
        top: 55px;
    }
    .subt-wrap {
        font-size: 13px;
        letter-spacing: -0.3px;
    }
    #ctl00__cphPrincipal_mensajeSuscripDigital .subt-wrap {
        font-size: 12px;
    }
    /* pantalla home */
    .menu_home {
        grid-template-columns: repeat(1,auto);
    }
    #content .cat {
        width: 90%;
        max-width: 100%;
        padding: 245px 10px 20px 10px;
        margin: 10px auto;
        height: auto;
    }
    /* footer */
    #footer {
        width: 75%;
        margin-top: 80px;
    }
    .space #footer {
        width: 100%;
        padding: 0 10%;
        margin-top: 120px;
    }
    /* reset tamaños y estilos banner */
    .camera_wrap img {
        max-width: none!important;
        width: 100%!important;
        height: auto!important;
    }
    /* reset tamaños modal */
    .reveal-modal {
        width: 100%!important;
    }
    /* tamaños caja logueo */
    #ctl00__cphPrincipal__updEnviar:before, #login .div_campos:before, #ctl00__cphPrincipal_mensajeSuscripDigital:before {
        width: 90%;
        left: 50%;
        margin-left: -45%;
        background-size: contain;
    }
    #ctl00__cphPrincipal_mensajeSuscripDigital:before, #login .regresar:before {
        width: 90%;
        background-size: contain;
    }
    #login .box {
        height: auto;
        width: auto;
    }
    #ctl00__cphPrincipal_captchaProd {
        margin-left: -50px;
    }
    .div_recordar_clave #ctl00__cphPrincipal_captchaProd {
        margin-left: -20px;
        transform: scale(0.85);
    }
    #login .regresar:before {
        margin-left: -160px;
    }
    #login .div_recordar_clave .regresar:before {
        margin-left: -145px;
    }
    /* posicion sombra mis datos */
    #home__cphPrincipal_textoEncabezado:before {
        top: 190px;
    }
    .parrafo-icono-atencion-cliente {
        width: 45%!important;
    }
    /* posicion boton mis datos */
    #content form input[type=submit]:not(.btnRetoirnarInput) {
        left: 50%;
        margin-left: -40px!important;
        transform: translateX(7%)!important;
    }
    #home__cphPrincipal_UpdateContacto input[type=submit]{
        margin-top: 25px!important;
        left: 50%!important;
    }
    #home__cphPrincipal_divNatural input[type=submit]{
        left: 50%!important;
    }
    #home__cphPrincipal_btnGuardarCta {
        margin-top: 20px!important;
    }
    span.requerido {
        text-align: left;
    }
    #content form .wrap .left, #content form .wrap .right {
        margin-right: 0;
        width: 100%;
        padding: 0!important;
    }
    #content form .wrap .camp input, #content form .wrap .camp select, #content .wrap .cdr-table select {
        width: 100%;
    }
     /* pantalla actualizar datos */
     .parrafo-icono-atencion-cliente .title-wrap {
        margin-top: 5px;
    }
    .parrafo-icono-atencion-cliente:before {
        margin-top: 5px;
        margin-left: -90%;
    }
    /* pantalla consumo intelecto */
    #home__cphPrincipal_upIntelecto table {
        margin: auto;
    }
    #home__cphPrincipal_upIntelecto tbody tr {
        display: grid;
    }
    #home__cphPrincipal_totalAhorro {
        margin-top: 60px!important;
        padding: 15px 0px 25px 0px!important;
    }
    #home__cphPrincipal_upIntelecto #home__cphPrincipal_btnConsultar {
        margin-top: 15px;
    }
    h3.email, h3.key, h3.detalle_intelecto {
        padding: 15px 45px 15px 15px;
    }
    /* interna compra */
    #detailPlan, #detailProduct, #content #titulo-principal, #content #home__cphPrincipal_div1, #home__cphPrincipal_upIntelecto{
        width: 95%;
        margin: auto;
    }
    #content form .wrap {
        width: 95%;
        margin: 20px auto;
    }
    #home__cphPrincipal_upDetalles input[type=submit] {
        margin-top: -40px!important;
    }
    #detailProductMas {
        margin-top: -5px!important;
    }
    #content form .wrap .left-alt, #content form .wrap .right-alt {
        width: 100%;
    }
    #home__cphPrincipal_divDeptoCiudad .left-alt .camp, #home__cphPrincipal_divDeptoCiudad .right-alt .camp {
        display: grid;
        grid-template-columns: repeat(1,auto);
    }
    #divDireccion td {
        padding: 10px 0px;
    }
    #content form .wrap .camp_dir input, #content form .wrap .camp_dir select {
        width: 100%!important;
    }
    table.planes tr:nth-child(2) td:nth-child(2) {
        border-left: none!important;
    }
    table.planes {
        width: 90%;
    }
    #content .txt-payment2 {
        width: auto;
    }
    .txt-payment {
        padding: 25px 0px 45px 0px!important;
        margin: auto!important;
        width: inherit!important;
        text-transform: uppercase!important;
        font-weight: 700!important;
        line-height: 17px!important;
        font-style: normal!important;
        font-size: 15px!important;
        width: 80%!important;
        display: block!important;
        text-align: center!important;
    }
    #home__cphPrincipal_mensajePasarela + .btn-payment:after{
        width: 90%;
        left: 50%;
        margin: auto;
        bottom: inherit;
        margin-top: -45px;
        background-size: contain;
        margin-left: -45%;
    }
    #content form p.campos-obligatorios {
        background-position-x: 0px;
        background-position-y: 28px;
    }
    .textos table {
        text-align: center;
    }
    /* menu three lines */
    .sidebarIconToggle {
        display: block;
        transition: all 0.3s;
        box-sizing: border-box;
        cursor: pointer;
        position: fixed;
        z-index: 99;
        height: 100%;
        width: 100%;
        top: 15px;
        right: 15px;
        height: 22px;
        width: 22px;
    }
    #sidebarMenu {
        height: 100%;
        position: fixed;
        z-index: 10;
        right: 0;
        width: 80%;
        margin-top: -52px;
        transform: translateX(100%);
        transition: all 250ms ease-in-out;
        padding-top: 55px;
        background: #D6D6D6;

    }
    #sidebarMenu:before {
        content: " ";
        background: url(../img/versionpaywall/barrasuperior-fondo-madera.jpg);
        background-size: cover;
        content: " ";
        width: 100%;
        height: 50px;
        position: absolute;
        background-repeat: no-repeat;
        left: 0;
        top: 2px;
        visibility: visible;
    }
    .sidebarMenuInner{
        margin:0;
        padding:0;
    }
    .sidebarMenuInner li{
        list-style: none;
        color: #fff;
        text-transform: uppercase;
        font-weight: bold;
        padding: 0px;
        cursor: pointer;
    }
    #menu-principal .user {
        display: block;
        z-index: 10000;
        position: relative;
        margin-top: -45px;
        width: 185px;
        text-align: right;
        right: 30px;
        font-weight: 700;

        color: #fff;
    }
    #menu-principal .user .welcome {
        font-weight: 400;
        font-size: 14px;
        top: 18px;
        left: -142px;
        position: absolute;
        width: 270px!important;
    }
    .welcome #home_clasificacion2 {
        position: absolute;
        margin-left: 5px;
    }
    #menu-principal{
        position: inherit;
    }
    #menu-principal ul{
        margin-top: 25px;
    }
    #menu-principal ul li a {
        padding: 10px 25px;
        background: url(../img/versionpaywall/flecha-movil-menu2x.png) 200px center no-repeat;
        background-size: 12px;
    }
    #menu-principal ul li a:after {
        top: 10px;
    }
    #menu-principal ul li a.ui-state-active {
        padding: 10px 25px;
        background: url(../img/versionpaywall/flecha-movil-down-menu2x.png) 200px center no-repeat;
        background-size: 18px;
    }
    #menu-principal ul.logout {
        border-radius: 0;
        bottom: 0px;
    }
    /* tabla beneficiarios*/

    div#home__cphPrincipal_beneficiario_1 p {
        border-top: 40px solid #A7A7A7;
    }
    #home__cphPrincipal_beneficiariosActuales #titulo-principal2 {
        border-bottom: none;
    }
    #home__cphPrincipal_beneficiariosActuales #home__cphPrincipal_beneficiario_1 {
        grid-template-columns: repeat(1,auto);
    }
    #home__cphPrincipal_beneficiario_1 p span{
        width: auto;
    }
    /* perfil */
    #accordion #home__cphPrincipal_UpdatePanel1 input[type=submit], #accordion #home__cphPrincipal_UpdatePanel3 input[type=submit] {
        margin-left: -55px; 
    }
    /* pantalla compra */
    .contenedor h2.subtitulo {
        margin-bottom: 60px;
    }
    .jcarousel ul {
        max-width: 2000em;
        width: 100%!important;
        display: grid;
    }
    .jcarousel li {
        margin: auto!important;
        width: 90%!important;
        margin-bottom: 35px!important;
    }
    #paso-a-paso li {
        max-width: 100px;
        margin-bottom: 10px!important;
        top: -10px;
    }
    #paso-a-paso {
        display: grid;
        grid-template-columns: repeat(3,auto);
    }
    #paso-a-paso li.confirmacion, #paso-a-paso li.pago {
        margin: auto;
    }
    #paso-a-paso:after {
        top: 70px;
        transform: rotateX(0deg);
        height: 115px;
    }
    .contenedor div .card .left .camp, .contenedor div .card .right .camp {
        grid-template-columns: none;
    }
    .contenedor div .card .left {
        margin-left: 0px;
    }
    .card .span_frm{
        margin-bottom: 15px;
    }
    .card .right, .card .left {
        display: inline-block;
        padding: 0 15px;
    }
    .contenedor div .card3 {
        min-height: 1210px !important;
    }
    .card3 input {
        padding: 10px 0!important;
    }
    .card3 .izquierda, .card3 .derecha{
        margin-right: 0;
        width: 100%;
        padding: 0;
    }
    .card3 .izquierda{
        padding: 0;
    }
    .abajo .camp {
        grid-template-columns: 100%!important;
    }
    .card2 .left, .card .right {
        width: 90%;
    }
    .datos-basicos{
        width: 90%!important;
    }
    .datos-basicos #ctl00__cphPrincipal_btnEnviar{
        left: 0!important;
        margin-left: 0!important;
    }
    div#ctl00__cphPrincipal_div1 {
        display: grid;
    }
    #detailPlan .detail-right p {
        width: 100%;
    }
    label.sidebarIconToggle:before {
        background: transparent url(../img/versionpaywall/icono-usuario2x.png);
        background-size: contain;
        content: " ";
        width: 40px;
        height: 50px;
        position: absolute;
        background-repeat: no-repeat;
        left: -55px;
        top: -10px;
        visibility: visible;
    }
    #home__cphPrincipal_carrouselProductos li {
        width: 100%!important;
        margin-bottom: 25px!important;
    }
    .jcarousel #home__cphPrincipal_carrouselProductos {
        grid-template-columns: repeat(1,auto);
    }
    .jcarousel-control-prev, .jcarousel-control-next {
        display: none;
    }
    .jcarousel {
        width: 90%!important;
        margin: auto;
    }
    #home__cphPrincipal_carrouselProductos li:nth-child(2) {
        display: grid;
    }
    #home__cphPrincipal_carrouselProductos li:nth-child(3), #home__cphPrincipal_carrouselProductos li:nth-child(4) {
        margin-top: 0px!important;
    }
    .jcarousel #home__cphPrincipal_carrouselProductos {
        height: inherit;
    }
    h2.subtitulo {
        margin-bottom: 45px;
    }
    #paso-a-paso li:before {
        margin-top: -8px;
    }
    #paso-a-paso li.confirmacion:after, #paso-a-paso li.pago:after, #paso-a-paso li.seleccion:after {
        top: -2px;
        margin-left: -4px;
    }
    #home__cphPrincipal_upDetalles {
        margin-top: inherit;
    }
    /* externa suscripcion digital */
    .contenedor div .card .right {
        margin-left: 0;
    }
    .contenedor div .card .left .camp input, .contenedor div .card .right .camp input {
        padding: 10px 0px;
        width: 100%;
    }
    #ctl00__cphPrincipal_captchaProd + input[type=submit] {
        position: relative!important;
        margin-right: 280px;
    }
    .div_recordar_clave input[type=submit]{
        margin-right: 140px;
    }
    .contenedor div .card {
        width: 90%!important;
        padding-bottom: 10px!important;
    }
    #ctl00__cphPrincipal_lnkContinuar {
        margin-top: -15px!important;
    }
    /* pantalla renovar suscripciones */

        /* posicion botones */
        #home__cphPrincipal_btnRenovarOtrasCond, #home__cphPrincipal_btnRenovar{
            float: none!important;
            left: 50%!important;
        }
    /* pantalla VIP CLASICO */
    .titulo-generico {
        width: auto;
    }
    #home__cphPrincipal_beneficios_cla .vineta-verde, #home__cphPrincipal_beneficios_vip .vineta-verde {
        width: 80%;
        left: 0;
        height: 90px;
        margin: auto;
        background: url(../img/versionpaywall/check-beneficios2x.png) 0px center no-repeat;
        padding-left: 45px;
    }
    #home__cphPrincipal_beneficios_cla:before, #home__cphPrincipal_beneficios_vip:before {
        margin-top: -175px;
    }
    #home__cphPrincipal_existe input[type=submit] {
        left: -40%!important;
    }
    #home__cphPrincipal_beneficios_vip, #home__cphPrincipal_beneficios_cla {
        background-position-x: 80px;
        background-position-y: -5px;
        background-size: 140px;
        margin-top: 20px;
        padding-top: 120px;
    }
    /* tablas responsive */

    /* Force table to not be like tables anymore */
    .detalle_intelecto + .ui-accordion-content table th, #ctl00__cphPrincipal_GridViewSuscripciones th, #home__cphPrincipal_divResumenPago th, #home__cphPrincipal_divResumenPago tr.title, table.resumenplan tr.title, table.resumendireccion tr.title, table.planes tr.title, table#ctl00__cphPrincipal_GridIntelecto tr.headerTablaPlanesActivos{
        display: none;
    }    
    table:not(.ui-datepicker-calendar, .planes), thead:not(.ui-datepicker-calendar), tbody:not(.ui-datepicker-calendar), th:not(.ui-datepicker-calendar), td:not(.ui-datepicker-calendar), tr:not(.ui-datepicker-calendar) {
        display: block;
    }
    /* Hide table headers (but not display: none;, for accessibility) */
    thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    
    .detalle_intelecto + .ui-accordion-content table table tr, #ctl00__cphPrincipal_GridViewSuscripciones tr, #home__cphPrincipal_divResumenPago tr, table.resumenplan tr, table.resumendireccion tr, table.planes tr, table#ctl00__cphPrincipal_GridIntelecto tr{
        margin: 0 0 1rem 0;
        padding-left: 60%;

        background: rgb(167,167,167);
        background: -moz-linear-gradient(90deg, rgba(167,167,167,1) 0%, rgba(167,167,167,1) 52%, rgba(255,255,255,1) 52.1%);
        background: -webkit-linear-gradient(90deg, rgba(167,167,167,1) 0%, rgba(167,167,167,1) 52%, rgba(255,255,255,1) 52.1%);
        background: linear-gradient(90deg, rgba(167,167,167,1) 0%, rgba(167,167,167,1) 52%, rgba(255,255,255,1) 52.1%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#a7a7a7",endColorstr="#ffffff",GradientType=1);
    }
    table#ctl00__cphPrincipal_GridIntelecto tr:last-child{
        padding-left: 0;
        background: #CCCCCC;

        display: grid;
        grid-template-columns: repeat(2,auto);
    }
    #ctl00__cphPrincipal_GridViewSuscripciones tr:nth-child(odd), #home__cphPrincipal_divResumenPago tr:nth-child(odd), table.resumenplan tr:nth-child(odd), table.resumendireccion tr:nth-child(odd) , table.planes tr:nth-child(odd), table#ctl00__cphPrincipal_GridIntelecto tr:nth-child(odd) {
      /*background: #ccc;*/
    }
    
    .detalle_intelecto + .ui-accordion-content table td, #ctl00__cphPrincipal_GridViewSuscripciones td, #home__cphPrincipal_divResumenPago td, table.resumenplan td, table.resumendireccion td, table.planes td, table#ctl00__cphPrincipal_GridIntelecto td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px solid #eee;
        padding-top: 10px!important;
        padding-bottom: 10px!important;
        position: relative;
        padding-left: 0%!important;
        text-align: left;
    }
    table.intelectotbl td {
        width: inherit;
    }
    
    .detalle_intelecto + .ui-accordion-content table td:before, #ctl00__cphPrincipal_GridViewSuscripciones td:before, #home__cphPrincipal_divResumenPago td:before, table.resumenplan td:before, table.resumendireccion td:before, table.planes td:before, table#ctl00__cphPrincipal_GridIntelecto td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 10px;
        left: -135%;
        text-align: left;
        width: 100%;
        white-space: nowrap;
        color: #fff;
    }

		/*
		Label the data
    You could also use a data-* attribute and content for this. That way "bloats" the HTML, this way means you need to keep HTML and CSS in sync. Lea Verou has a clever way to handle with text-shadow.
		*/
		.detalle_intelecto + .ui-accordion-content table table td:nth-of-type(1):before { content: "Fecha Compra"; }
		.detalle_intelecto + .ui-accordion-content table table td:nth-of-type(2):before { content: "Establecimiento"; }
		.detalle_intelecto + .ui-accordion-content table table td:nth-of-type(3):before { content: "Valor Compra"; }
        .detalle_intelecto + .ui-accordion-content table table td:nth-of-type(4):before { content: "Valor Ahorro"; }
        
        #ctl00__cphPrincipal_GridViewSuscripciones td:nth-of-type(1):before { content: "Renovar"; }
		#ctl00__cphPrincipal_GridViewSuscripciones td:nth-of-type(2):before { content: "Descripción"; }
		#ctl00__cphPrincipal_GridViewSuscripciones td:nth-of-type(3):before { content: "Inicio Despacho"; }
        #ctl00__cphPrincipal_GridViewSuscripciones td:nth-of-type(4):before { content: "Fin Despacho"; }
        #ctl00__cphPrincipal_GridViewSuscripciones td:nth-of-type(5):before { content: "Dirección"; }
        #ctl00__cphPrincipal_GridViewSuscripciones td:nth-of-type(6):before { content: "Estado"; }
        
        #home__cphPrincipal_divResumenPago td:nth-of-type(1):before { content: "Fecha y hora"; }
		#home__cphPrincipal_divResumenPago td:nth-of-type(2):before { content: "Referencia"; }
		#home__cphPrincipal_divResumenPago td:nth-of-type(3):before { content: "Código autorización"; }
        #home__cphPrincipal_divResumenPago td:nth-of-type(4):before { content: "Estado"; }
        #home__cphPrincipal_divResumenPago td:nth-of-type(5):before { content: "Descripción"; }
        #home__cphPrincipal_divResumenPago td:nth-of-type(6):before { content: "Valor"; }
        
        
        
        .resumenplan td:nth-of-type(1):before { content: "Plan"; }
        .resumenplan td:nth-of-type(2):before { content: "Valor"; }
        
        .resumendireccion td:nth-of-type(1):before { content: "Dirección"; }
        .resumendireccion td:nth-of-type(2):before { content: "Inicio Suscripción"; }

        .planes td:nth-of-type(1):before { content: "Plan"; }
        .planes td:nth-of-type(2):before { content: "Valor"; }

        table#ctl00__cphPrincipal_GridIntelecto td:nth-of-type(1):before { content: "Cuenta"; }
        table#ctl00__cphPrincipal_GridIntelecto td:nth-of-type(2):before { content: "Ahorro Intelecto"; }
        
        table#ctl00__cphPrincipal_GridIntelecto tr:last-child td{ border-radius: 0!important;}
        table#ctl00__cphPrincipal_GridIntelecto tr:last-child td:first-child{ padding-left: 45px!important;}
        table#ctl00__cphPrincipal_GridIntelecto tr:last-child td:before { content: " "; }

        .reveal-modal {
            width: 319px!important;
            margin-left: -160px!important;
            margin-top: -170px!important;
            transform: scale(0.75)!important;
        }
        .reveal-modal iframe {
            height: 1340px!important;
            width: 950px;
            transform: scale(0.45)translateX(-76%)translateY(-60%)!important;
        }
        .reveal-modal .close-reveal-modal:before {
            content: "Cerrar";
            font-size: 15px;
            /* float: right; */
            padding: 5px;
            top: -5px;
            position: relative;
            text-transform: uppercase;
        }
        .reveal-modal .close-reveal-modal {
            top: 7px!important;
            right: 11px!important;
            color: #212121!important;
            width: calc(100% + 6px);
            left: -5px;
            height: 32px;
            text-align: right;
            background: #9C9C9C;
            padding: 8px;
            font-size: 35px!important;
        }
        /* pantalla registro externa */
        .left.formulario-registro {
            column-gap: 0px;
        }
        .left.formulario-registro {
            display: grid;
            grid-template-columns: repeat(1,auto);
        }
        .contenedor div .card5 {
            min-height: 640px !important;
        }
}
@media only screen and (min-device-width: 1250px){
    .contenedor div .card {
        width: 95%!important;
    }
}
.registrodigital:before {
    position: absolute;
    width: 414px;
    height: 70px;
    background: url(../img/versionpaywall/bisel-separador-bt-iniciarsesion.png) center center no-repeat;
    top: 75px;
    content: " ";
    left: 50%;
    transform: rotateX(180deg)translateX(-50%);
    z-index: 1;
}
.registrodigital .card{
    box-shadow: none!important;
    background: none!important;
    border-radius: none!important;
    margin-bottom: 10px!important;
} 
.registrodigital .card .left {
    margin: auto;
    float: inherit;
}
.registrodigital .card .wrap {
    width: 400px;
}
.registrodigital .left.formulario-registro{
    grid-template-columns: repeat(1,auto);
}
.registrodigital .card .left .camp{
    grid-template-columns: 1fr 2fr!important;
    background: #eeeeee!important;
    position: relative;
}
.registrodigital .card .left .camp span{
    text-align: right;
}
.registrodigital .card .left .camp input{
    margin-left: 15px;
    background: #fff;
    border: 1px solid #dedede!important;
    width: 100%!important;
    margin-bottom: 15px;
}
.registrodigital .camp .requerido {
    position: absolute;
    right: -35px;
}
.registrodigital h1 {
    color: #000!important;
    height: 30px!important;
}
#ctl00__cphPrincipal_captchaPruebas:after {
    position: absolute;
    width: 414px;
    height: 70px;
    background: url(../img/versionpaywall/bisel-separador-bt-iniciarsesion.png) center center no-repeat;
    content: " ";
    left: 50%;
    z-index: 0;
    transform: translateX(-50%)translateY(15px);
}
#content form p {
    font-size: 13px;
}
.registrodigital .camp .span_frm{
    top: 5px;
    position: relative;
}
@media only screen and (max-device-width: 850px){
    .registrodigital{
        margin-bottom: -20%;
    }
    .registrodigital .card .left .camp{
        grid-template-columns: 1fr!important;
    }
    .registrodigital .card .left .camp span{
        text-align: left;
    }
    .registrodigital .card .left .camp input{
        margin-left: 0px!important;
    }
    .registrodigital:before {
        top: 85px;
    }
    .registrodigital .camp .requerido {
        right: 10px;
    }
}

@media only screen and (max-width: 850px){
    .btnContinuar, #login .box input[type=submit], .btnEnviar, #content form input[type=submit] {
        -webkit-appearance: none; 
    }
    select,   textarea,   input[type="text"],   input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"]{
        font-size: 16px!important;
    }
    .resumenplan tr.content, .resumenplan tr.title{
        display: revert!important;
    }
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
    /* For landscape layouts only */
    /* botones generales  */
    input [type=submit]{
        -webkit-appearance: none;
    }
    /* inputs inicio de sesión */
    div.formInputs input {
        width: 50%!important;
    }
    /* zona ingreso info personal */
    div#ctl00__cphPrincipal_div1 {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .card .wrap {
        width: 95%;
    }
    .contenedor div .card .left .camp input, .contenedor div .card .right .camp input {
        width: 100%!important;
        padding-right: 0!important;
    }

    /* fix tablas */
    table.planes tr.title {
        display: block!important;
        padding: 0!important;
        margin: 0!important;
    }

    table.planes tr.title td {
        display: revert!important;
    }

    table.planes td {
        text-align: center!important;
    }

    table.planes tr {
        display: revert!important;
        padding: 0!important;
    }

    table.planes tr:nth-child(2) td {
        display: revert!important;
        width: 50%!important;
    }
    .planes td:nth-of-type(2):before{
        content: " "!important;
    }
    #ctl00__cphPrincipal_encabezadoCompraOk ul#paso-a-paso {
        display: block;
    }
    #ctl00__cphPrincipal_encabezadoCompraOk ul#paso-a-paso:after{
        top: 90px;
        transform: rotateX(0deg);
        height: 115px;
    }
    .compracorrecta span {
        width: max-content;
        position: absolute;
        left: 50%;
        top: 15px;
        transform: translateX(-50%);
    }
    #paso-a-paso li.compracorrecta:after {
        top: 0px;
    }
    #ctl00__cphPrincipal_tablaRespuestaBanco.planes td:nth-of-type(2):before {
        content: " "!important;
    }
    #ctl00__cphPrincipal_tablaRespuestaBanco tr td {
        width: 50%;
        padding: 10px 15px!important;
    }
    .formularioIngreso input[type=checkbox] {
        margin-left: 15px;
        margin-top: 3px;
    }
    .enlacesExtra {
        margin-top: 25px;
    }
    .resumenplan tr td:before{
        content: " "!important;
    }
    .resumenplan tr.title {
        display: revert!important;
    }
    .resumenplan tr.title td {
        width: auto!important;
        display: revert;
    }
}