@charset "UTF-8";
#titulo_claro,.navbar-default .navbar-text {
    font-weight:700;
    margin-top:0;
    margin-bottom:0
}
#titulo_claro,.inicio-sesion h1,.navbar,.tarjetas .tarj-token label,hr {
    margin-bottom:0
}
@font-face {
    font-family:"Roboto regular";
    src:url("../fonts/Roboto-Regular.woff");
    font-display:auto
}
@font-face {
    font-family:"Roboto medium";
    src:url("../fonts/Roboto-Medium.ttf");
    font-display:auto
}
@font-face {
    font-family:"AMX regular";
    src:url("../fonts/AMX-Regular.woff");
    font-display:auto
}
.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
    padding:0
}
.container,.sub-title {
    padding-left:15px;
    padding-right:15px
}
#titulo_claro,.confirmacion,.eliminar-tarjetas,.registro-tarjeta,.tarjetas {
    padding-top:20px
}
body {
    font-family:"AMX regular"
}
.encabezado .navbar .container-fluid {
    margin-left:20px
}
.navbar {
    border-radius:0
}
.navbar img {
    width:98px;
    height:30px
}
.navbar-default {
    background-color:#ef3829;
    border-color:#ef3829
}
.navbar-default .navbar-brand,.navbar-default .navbar-brand:hover {
    color:#fff;
    padding:6px 15px;
    font-size:3.5rem
}
.navbar-default .navbar-text {
    color:#fff;
    font-size:2rem;
    padding-right:45px
}
.btn-omitir,.regist-claropay .btn-registro,.registro-tarjeta .btn {
    margin-bottom:20px
}
#titulo_claro {
    color:#222;
    font-size:32px;
    margin-left:0;
    padding-bottom:20px;
    padding-left:0;
    text-align:center;
    vertical-align:middle
}
.strong,strong {
    font-weight:700!important
}
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video {
    margin:0;
    padding:0;
    border:0;
    font:inherit;
    vertical-align:baseline;
    font-color:#f0f0f0;
    font-size:100%;
    font:inherit;
    font-family:inherit;
    font-weight:inherit;
    line-height:inherit
}
input[type=email],input[type=password],input[type=text] {
    line-height:1em;
    background-color:#fff;
    border:1px solid #afafaf;
    color:#222;
    font-size:1.2rem;
    font-weight:300;
    padding:0 10px
}
select.form-control {
    background-color:#fff!important;
    border:1px solid #afafaf!important;
    color:#222!important;
    font-size:1.2rem!important;
    font-weight:300
}
#msg_error,.h1,h1,label.error {
    font-weight:400
}
.form-control {
    height:45px
}
.form-control:focus {
    border-color:#afafaf!important;
    box-shadow:none
}
.confirmar-pin,.regist-claropay,.registro {
    margin-top:65px
}
.marging-10px {
    margin-top:10px!important
}
.marging-20px {
    margin-top:20px!important
}
.marging-40px {
    margin-top:40px!important
}
.h1,h1 {
    font-size:32px;
    color:#222
}
.fuente-gris,.h4,.h6,.tarjetas .tarj-token a,h4,h6,small {
    color:#afafaf
}
.h4,h4 {
    font-size:20px
}
#msg_error,.h6,h6,label.error {
    font-size:12px
}
.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
    font-family:"AMX regular";
    line-height:normal;
    margin-top:0
}
.section-voucher .labelName,.step-1,.step-2,.step-3 {
    font-family:Roboto,sans-serif
}
hr {
    border-top:3px solid #afafaf;
    margin-top:0;
    width:60%
}
label {
    color:#666
}
.btn,.form-control {
    border-radius:5px!important
}
.btn {
    color:#fff;
    width:100%
}
.btn-danger,.btn-danger:active,.btn-danger:focus,.btn-danger:hover {
    background:#ef3829;
    border-color:#ef3829
}
.btn-primary,.btn-primary:active,.btn-primary:focus,.btn-primary:hover {
    background:#1f97ae;
    border-color:#1f97ae
}
.btn-cancel,.btn-cancel:active,.btn-cancel:focus,.btn-cancel:hover,.pantalla-inicio .btn-primary,.pantalla-inicio .btn-primary:hover,.tarjetas .btn-primary,.tarjetas .btn-primary:hover {
    background:#222;
    border-color:#222
}
.btn-registro,.btn-registro:active,.btn-registro:disabled,.btn-registro:focus,.btn-registro:hover {
    width:100%;
    color:#fff;
    background:#ef3829;
    border-color:#ef3829
}
.btn-omitir {
    background-color:#afafaf!important;
    border-color:#afafaf!important;
    width:225px!important;
    overflow-wrap:break-word;
    white-space:normal;
    margin-top:15px
}
.recuperar,.sub-title,.sub-titlecenter {
    margin-top:20px
}
#msg_error,.fuente-rojo,label.error {
    color:#ef3829
}
.fuente-oscura {
    color:#222
}
.display-block {
    display:block
}
.btn-reenvio,.btn-reenvio:active,.btn-reenvio:focus,.btn-reenvio:hover {
    background:#1f97ae;
    border-color:#1f97ae;
    color:#fff
}
.sub-title,.sub-titlecenter,.sub-titlecenter2 {
    font-size:1.2em;
    font-weight:300;
    color:#222;
    text-align:center
}
.encabezado-confirmacion .navbar-default .navbar-text,.encabezado-inicio .navbar-default .navbar-text {
    padding-right:0
}
.sub-title {
    word-spacing:4px
}
.sub-titlecenter2 {
    margin-top:0
}
.confirmar-pin #alert_expira,.inicio-sesion #alert_expira,.regist-claropay #alert_expira,.registro #alert_expira {
    color:#ef3829!important;
    display:inline-block;
    margin-bottom:25px!important;
    padding-left:0!important;
    padding-top:10px!important
}
#msg_error {
    text-align:left;
    position:absolute
}
.regist-claropay figure,.registro figure {
    padding-top:10px
}
.regist-claropay .img-circle,.registro .img-circle {
    border:10px solid #afafaf
}
.regist-claropay .checkbox {
    padding-bottom:10px
}
.regist-claropay .checkbox label,.regist-claropay .checkbox label:hover {
    color:#1f97ae
}
.regist-claropay .checkbox a:hover {
    text-decoration:underline
}
.confirmacion h1 {
    line-height:unset
}
.inicio-sesion form .form-group>div>.btn {
    margin-bottom:10px
}
.text-lighter {
    font-weight:300
}
.terminos-condiciones h4 {
    font-size:21px
}
.pantalla-inicio img {
    width:40%
}
.pantalla-inicio .btn {
    font-size:1.3rem;
    width:225px
}
.pantalla-inicio p {
    color:#222;
    font-size:.9rem;
    font-weight:300
}
.confirmacion label {
    font-size:17px;
    font-weight:500
}
.confirmacion h1 label {
    font-size:30px;
    font-weight:500
}
.confirmacion figure img {
    margin:0 auto
}
.btn-download-pdf,.btn-finally,.confirmar-pin h1 {
    text-align:center
}
.carousel-inner>.item>a>img,.carousel-inner>.item>img,.img-responsive,.thumbnail a>img,.thumbnail>img {
    max-width:70%
}
.tarjetas .sub-title+.row {
    padding-top:40px
}
.tarjetas .asoc-tarjeta {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    border:2px solid #222;
    border-radius:5px;
    margin:20px 15% 0;
    padding:5px
}
.tarjetas .asoc-tarjeta a {
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex
}
.tarjetas .asoc-tarjeta figure {
    margin:0 10px 0 0
}
.ind-1,.ind-2,.tarjetas .tarj-token span {
    margin-left:auto
}
.tarjetas .asoc-tarjeta label {
    font-weight:500;
    margin-bottom:0
}
.asoc-tarjeta img {
    width:auto
}
.tarjetas .tarjs-tokens {
    color:#222;
    font-size:1.5rem;
    font-weight:500;
    margin-bottom:20px
}
.tarjetas .tarj-token {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    padding:3px 0;
    border-bottom:2px solid #222
}
.tarjetas .tarj-token .el-radio,.tarjetas .tarj-token figure {
    padding:0 5px 0 0
}
.tarjetas .tarj-token .tarj-numero {
    -webkit-box-flex:2;
    -ms-flex:2 0 0px;
    flex:2 0 0;
    text-align:center;
    font-weight:500
}
#msg_captcha,.registro-tarjeta .form-horizontal .control-label {
    text-align:left
}
.tarjetas .tarj-token img {
    width:60px
}
.tarjetas .tarj-token img[id^=cvv] {
    width:42px
}
.tarjetas .tarj-token img[id^=imagen] {
    width:55px
}
.tarjetas .btn,.tarjetas .btn:active,.tarjetas .btn:disabled,.tarjetas .btn:focus,.tarjetas .btn:hover {
    margin-top:20px;
    text-transform:uppercase;
    width:100%
}
.eliminar-tarjetas .btn-registro,.eliminar-tarjetas .btn-registro:active,.eliminar-tarjetas .btn-registro:focus,.eliminar-tarjetas .btn-registro:hover,.registro-tarjeta .btn-registro,.tarjetas .btn-registro,.tarjetas .btn-registro:active,.tarjetas .btn-registro:disabled,.tarjetas .btn-registro:focus,.tarjetas .btn-registro:hover {
    position:relative
}
.el-radio>input[type=radio]+.el-radio-style::before {
    border:1px solid #afafaf
}
.el-radio>input[type=radio]+.el-radio-style:hover::before {
    border-color:#222
}
.el-radio>input[type=radio]:checked+.el-radio-style::before {
    border:1px solid #222
}
.el-radio>input[type=radio]+.el-radio-style::after {
    background:#222
}
.eliminar-tarjetas .h4,.eliminar-tarjetas h4 {
    color:#222;
    margin-bottom:60px;
    padding-bottom:15px
}
.eliminar-tarjetas form {
    padding-top:70px
}
.eliminar-tarjetas .btn,.eliminar-tarjetas .btn-primary:focus,.eliminar-tarjetas .btn-primary:hover {
    margin-top:20px;
    width:100%
}
#fecha .form-venci,.registro-tarjeta .form-registro .form-horizontl,.registro-tarjeta .form-registroa,.section-voucher {
    width:100%
}
.registro-tarjeta .inf-tarj {
    background-color:#f0f0f0;
    border:2px solid #afafaf;
    display:inline-block;
    padding:20px 15px;
    width:100%
}
.registro-tarjeta .inf-tarj h3 {
    font-weight:500;
    color:#222;
    font-size:1.5rem
}
.registro-tarjeta .form-registro .inf-tarj div {
    padding-top:7px;
    font-weight:300;
    font-size:20px
}
.conta-tarjetas {
    border:0;
    display:flex;
    flex-direction:row;
    height:auto
}
.conta-tarjetas .cards {
    align-items:center;
    display:flex;
    flex-direction:row;
    justify-content:start;
    padding:5px;
    opacity:.5;
    width:100%
}
.cards input[type=radio] {
    display:none;
    margin:0 15px;
    visibility:hidden
}
.unopacity {
    opacity:1!important
}
.cards img {
    width:90%
}
#fecha {
    display:flex;
    flex-direction:column
}
.form-group .control-label {
    font-size:21px;
    font-weight:400;
    color:#222
}
@media (min-width:541px) and (max-width:740px) {
    #titulo_claro {
        font-size:32px;
        padding-left:0
    }
    .confirmar-pin #alert_expira,.inicio-sesion #alert_expira,.regist-claropay #alert_expira,.registro #alert_expira {
        display:block
    }
    .navbar-text {
        float:none;
        margin-right:0
    }
    .inicio-sesion .form-horizontal {
        margin:0 auto;
        width:370px
    }
    .pantalla-inicio img {
        width:auto
    }
    .inicio-sesion .form-horizontal .control-label,.regist-claropay .form-horizontal .control-label,.registro .form-horizontal .control-label {
        text-align:left;
        color:#222;
        font-size:1.2rem;
        font-weight:400
    }
    .registro .form-registro,.registro-claropay .form-registro {
        width:100%;
        margin:0 auto
    }
    .registro .form-horizontal,.registro .img-registro,.registro-claropay .form-horizontal,.registro-claropay .img-registro {
        width:50%
    }
    .eliminar-tarjetas .h4,.eliminar-tarjetas h4 {
        margin-bottom:30px
    }
    .cards img {
        width:10%
    }
    #fecha {
        align-items:center;
        flex-direction:row
    }
    #fecha .form-venci {
        width:150px
    }
}
@media (min-width:741px) {
    #titulo_claro {
        font-size:32px;
        padding-left:0
    }
    .navbar-default .navbar-text {
        margin-top:10px;
        margin-bottom:10px
    }
    .h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
        line-height:1.75em
    }
    .carousel-inner>.item>a>img,.carousel-inner>.item>img,.img-responsive,.thumbnail a>img,.thumbnail>img {
        max-width:100%
    }
    .sub-titlecenter,.sub-titlecenter2 {
        font-size:1.2em
    }
    .btn-registro,.btn-registro:active,.btn-registro:focus,.btn-registro:hover {
        position:relative;
        bottom:auto;
        width:auto
    }
    .btn-omitir {
        width:auto!important
    }
    .confirmar-pin .form-horizontal,.inicio-sesion .form-horizontal {
        margin:0 auto;
        width:370px
    }
    .confirmar-pin .form-horizontal .control-label,.inicio-sesion .form-horizontal .control-label,.regist-claropay .form-horizontal .control-label {
        text-align:left;
        color:#222;
        font-size:1.2rem;
        font-weight:400
    }
    .form-registro {
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex
    }
    .form-registro .form-horizontal,.form-registro .img-registro {
        padding:10px 30px
    }
    .form-registro .img-registro {
        width:40%
    }
    .form-registro .form-horizontal {
        width:60%
    }
    .confirmar-pin h1 {
        text-align:left
    }
    .confirmar-pin .sub-title label.fuente-rojo {
        display:inline
    }
    .confirmar-pin .form-horizontal small {
        font-weight:300
    }
    .confirmar-pin .btn-reenvio,.confirmar-pin .btn-registro {
        text-transform:uppercase;
        width:240px
    }
    .registro .form-registro {
        width:85%;
        margin:0 auto
    }
    .registro .form-horizontal .control-label {
        text-align:left;
        color:#afafaf;
        font-size:1.8rem;
        font-weight:500
    }
    .registro .form-horizontal .btn {
        margin-top:20px
    }
    .pantalla-inicio img {
        width:auto
    }
    .pantalla-inicio .sub-title {
        width:76%;
        margin:0 auto
    }
    .pantalla-inicio .btn-primary,.pantalla-inicio .btn-primary:hover {
        background:#222;
        border-color:#222
    }
    .confirmacion label {
        font-size:23px;
        font-weight:300
    }
    .confirmacion .btn-registro,.confirmacion .btn-registro:hover {
        display:block;
        margin-left:auto;
        margin-right:auto;
        width:250px
    }
    .tarjetas .tarj-token img[id^=cvv],.tarjetas .tarj-token img[id^=imagen] {
        width:55px
    }
    .eliminar-tarjetas h4 {
        margin-bottom:9px!important
    }
    .eliminar-tarjetas form {
        padding-top:60px
    }
    .eliminar-tarjetas .btn,.eliminar-tarjetas .btn-primary:focus,.eliminar-tarjetas .btn-primary:hover,.eliminar-tarjetas .btn-registro:hover,.registro-tarjeta .btn-registro,.registro-tarjeta .btn-registro:active,.registro-tarjeta .btn-registro:focus,.registro-tarjeta .btn-registro:hover,.registro-tarjeta .form-100,.tarjetas .btn {
        width:100%
    }
    .conta-tarjetas {
        flex-direction:row
    }
    .conta-tarjetas .cards {
        flex-direction:row;
        border-bottom:0 solid #afafaf;
        justify-content:space-around;
        align-content:center
    }
    .cards img {
        width:80px
    }
    #fecha {
        align-items:center;
        flex-direction:row
    }
    #fecha .form-venci {
        width:150px
    }
    .registro-tarjeta .inf-tarj {
        height:50%;
        order:2;
        width:50%
    }
    .registro-tarjeta .form-50 {
        width:50%
    }
    .tarjetas .tarjs-tokens {
        margin-bottom:0
    }
}
.justify-content-center,.step-2,.steps {
    justify-content:center
}
.captchaLegacyRetirado-accessibility-button {
    display:none
}
#msg_captcha {
    width:100%;
    color:#f90c0c;
    font-size:12px;
    position:absolute;
    padding-top:15px
}
.submsg-captcha {
    font-size:14px;
    color:#afafaf;
    font-weight:300
}
.spanNumber {
    border:1px solid #afafaf;
    padding-top:6px;
    padding-right:6px;
    padding-left:6px;
    border-radius:13%
}
.spanNumber-mobile {
    border:1px solid #afafaf!important;
    padding-top:14px!important;
    padding-right:13px!important;
    padding-left:6px!important;
    border-radius:13%!important
}
.d-flex,.ind-3,.indicativo,.step-1,.step-2,.steps {
    display:flex
}
.w-268 {
    width:268px!important
}
.input-alert {
    display:none;
    color:#e52a1b
}
.btn-claropay {
    color:#fff;
    margin-bottom:30px
}
.back-button {
    border:1px solid;
    color:#fff;
    border-radius:50px;
    width:250px;
    height:44px
}
.back-button-mobile {
    background-color:#fff;
    border:1px solid;
    color:#000;
    border-radius:50px;
    width:210px;
    height:38px
}
.indicativo,.step-1,.step-2,.step-3 {
    color:#006b4f
}
@keyframes ldio-07q1libfplhl {
    0% {
        transform:rotate(0)
    }
    100% {
        transform:rotate(360deg)
    }
}
.ldio-07q1libfplhl div {
    box-sizing:border-box!important;
    box-sizing:content-box
}
.ldio-07q1libfplhl>div {
    position:absolute;
    width:94.32000000000001px;
    height:94.32000000000001px;
    top:18.34px;
    left:18.34px;
    border-radius:50%;
    border:10.48px solid #000;
    border-color:#df1317 transparent;
    animation:1s linear infinite ldio-07q1libfplhl
}
.ldio-07q1libfplhl>div:nth-child(2) {
    border-color:transparent
}
.ldio-07q1libfplhl>div:nth-child(2) div {
    position:absolute;
    width:100%;
    height:100%;
    transform:rotate(45deg)
}
.ldio-07q1libfplhl>div:nth-child(2) div:after,.ldio-07q1libfplhl>div:nth-child(2) div:before {
    content:"";
    display:block;
    position:absolute;
    width:10.48px;
    height:10.48px;
    top:-10.48px;
    left:31.44px;
    background:#df1317;
    border-radius:50%;
    box-shadow:0 83.84px 0 0 #df1317
}
.ldio-07q1libfplhl>div:nth-child(2) div:after {
    left:-10.48px;
    top:31.44px;
    box-shadow:83.84px 0 0 0 #df1317
}
.loadingio-spinner-dual-ring-jk6hwafmdtf {
    width:131px;
    height:131px;
    display:inline-block;
    overflow:hidden;
    background:#f1f2f3
}
.ldio-07q1libfplhl {
    width:100%;
    height:100%;
    position:relative;
    transform:translateZ(0) scale(1);
    backface-visibility:hidden;
    transform-origin:0 0
}
.content-step-to-step {
    width:100%;
    height:91px;
    background-color:#fdfdff;
    box-shadow:3px 3px 10px #2f2F6026
}
.steps {
    background:0 0;
    height:100%;
    align-items:center
}
.step-1,.step-3 {
    width:107px
}
.containerLine-1 {
    width:27px
}
.line-1,.line-2-2 {
    border-top-left-radius:10px;
    border-bottom-left-radius:10px
}
.step-2 {
    width:107px;
    align-items:center
}
.containerLine-2 {
    margin-bottom:auto;
    width:27px
}
.line-2-1,.line-3 {
    border-top-right-radius:10px;
    border-bottom-right-radius:10px
}
.ind-2 {
    margin-right:auto
}
.step-3 {
    text-align:center;
    width:107px
}
.indicativo-text {
    font-size:14px;
    margin:0;
    color:#006b4f
}
.container-voucher-summary img,.containerVoucher,.indicativo {
    margin-left:auto;
    margin-right:auto
}
.indicativo {
    border:2px solid #006b4f;
    border-radius:50%;
    width:20px;
    height:20px;
    margin-bottom:9px;
    font-size:14px;
    font-family:"Roboto medium";
    justify-content:center;
    align-items:center
}
.text-wrap {
    overflow-wrap:break-word!important
}
.line-1,.line-2-1,.line-2-2,.line-3 {
    width:100%;
    margin-top:10px;
    background:#006b4f;
    border:2px solid #006b4f
}
.subTitle-summary {
    font-family:'AMX bold';
    font-size:16px;
    color:#404040
}
.container-voucher-summary {
    background-image:url('../imagenes/Comprobante.svg');
    height:500px!important;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center
}
.container-voucher-summary img {
    display:flex;
    padding-top:38px
}
.section-voucher .labelName {
    font-size:14px;
    font-weight:700;
    margin-bottom:6px
}
.section-voucher .etiquetaInfo {
    font-size:16px;
    font-family:Roboto,sans-serif;
    letter-spacing:0;
    color:#5e5e5e
}
.btn-download-pdf .btnDownloadPdf {
    width:130px!important;
    height:74px;
    margin:0 0 32px;
    box-shadow:2px 2px 20px #2f2F6026;
    background:#fff!important;
    display:grid!important;
    margin-left:auto!important;
    margin-right:auto!important;
    border:0;
    border-radius:10px
}
.btn-download-pdf .btnDownloadPdf img {
    width:19px;
    height:19px;
    margin:auto auto 8px
}
.btn-download-pdf .btnDownloadPdf span {
    color:#187385;
    font-size:11px!important;
    font-weight:700
}
.btn-finally .btnFinally {
    background:#da291c;
    font-size:16px!important;
    font-family:Roboto,sans-serif!important
}
.containerVoucher {
    width:13rem;
    margin-top:20px
}
.separator {
    margin-bottom:12px
}