﻿/*********************************Errores********************************/
.error_required{
    position:relative;
    float:left;
    width:100%;
    height:auto;
    color: #FFFFFF;
    font-weight:400;
    padding:8px 10px;
    margin-bottom:8px;
    border-radius:3px;
    background: rgb(165, 29, 29);
    margin-top:5px;
}

.error_required_2{
    position:relative;
    float:left;
    top:-10px;
    left:50%;
    width:60%;
    height:auto;
    transform:translate(-50%, 50%);
    color: #FFFFFF;
    font-weight:400;
    padding:8px 10px;
    margin-bottom:8px;
    border-radius:3px;
    background: rgb(165, 29, 29);
}

.error_required_3{
    position:relative;
    float:left;
    width:100%;
    height:auto;
    font-weight:600;
    padding:8px 10px;
    margin-bottom:8px;
    border-radius:3px;
    color: rgb(165, 29, 29);
    margin-top:5px;
}

.error_required_login{
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    color: #986161;
    font-weight: 400;
    padding-top: 2px;
    border-radius: 3px;
    text-align: center;
}

.error_required_red{
    position:relative;
    float:left;
    width:100%;
    height:auto;
    color: #FFFFFF;
    font-weight:400;
    padding:8px 10px;
    margin-bottom:8px;
    border-radius:3px;
    background: rgb(165, 29, 29);
    margin-top:5px;
}

.error_login{
    position: fixed;
    top:30%;
    left:50%;
    transform: translate(-50%, 50%);
    width:300px;
    background-color: #000;
    border-radius:3px;
    color: #FFFFFF;
    font-size:1.1em;
    padding: 10px 5px;
    text-align:center;
    animation-delay: 1s !important;
    z-index: 15;
}

.error_required_contact{
    position:relative;
    float:left;
    width:100%;
    height:auto;
    color: #FFFFFF;
    font-weight:400;
    padding:8px 10px;
    top:-3px;
    margin-bottom:8px;
    border-radius:3px;
    background: rgb(165, 29, 29);
}

.error_required_comment{
    position:relative;
    float:left;
    width:100%;
    height:auto;
    color: #FFFFFF;
    font-weight:400;
    padding:8px 10px;
    margin-top:12px;
    margin-bottom:4px;
    border-radius:3px;
    background: rgb(165, 29, 29);
}

.error_required_ajax{
    position:relative;
    float:left;
    width:100%;
    height:auto;
    color: #FFFFFF;
    font-weight:400;
    padding:8px 10px;
    margin-bottom:8px;
    border-radius:3px;
    background-color: rgb(165, 29, 29);
    margin-top:5px;
    display: none;
}

.error_required_ajax2{
    position: relative;
    width: 100%;
    height: auto;
    color: #a51d1d;
    font-weight: 600;
    padding: 8px 10px;
    margin-top: 5px;
    display: none;
}

.login-msg{
    position:fixed;
    top:45%;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align:center;
    min-height: 48px;
    max-width: 300px;
    line-height: 1.5em;
    background-color: #323232;
    padding: 10px 25px;
    font-size: 1.1rem;
    font-weight: 300;
    color: #fff;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
    display:none;
    z-index:99;
}

.login-msg.success{
    background-color: #4fa944 !important;
}

.active-item {
    background-color: #d9d6d6;
    border-radius: 13px;
}

.active-item-log {
    background-color: #d9d6d6;
    border-radius: 13px;
    padding: 10px !important;
}

.no-backcolor {
    background-color: #ffffff !important;
}
.item-menu:hover {
    cursor: pointer;
    color: #e1251b;
}

.fa-user, .fa-calendar {
    padding-right: 10px;
}
/*******************************Formulario registro*******************************/
.bg-white {
    background-color: #FFFFFF !important;
    border-radius: 3px;
}

.radiobutton span label
{
    padding-right:40px;
}

.checkboxSingleLine {
    display: inline;
    min-height: 20px;
    margin-top: 6px;
    margin-bottom: 10px;
    vertical-align: middle;
    display: inline-flex;
}

   
    .checkboxSingleLine label
{
    display: inline;
    margin-bottom:0px;
    cursor:pointer;
    vertical-align:top;
    font-weight:400;
}


.span-pm{
    color: #767676;
    font-weight:400;
}

.span-teal{
    color: #55c4c1;
    font-weight:400;
}

.span-black{
    color: #707070;
    font-weight:600;
}

.span-pink{
    color: #b783a9;
    font-weight:600;
}

.span-yellow{
    color: #f7d60f;
    font-weight:600;
}

.span-mustard{
    color: #bfa528;
    font-weight:600;
}

.span-red{
    color: #e00c23;
    font-weight:600;
}

.span-green{
    color: #9bb935;
    font-weight:600;
}

.span-blue{
    color: #019bc1;
    font-weight:600;
}

.span-grey{
    color: #767676;
    font-weight:600;
}

.span-white{
    color: #FFFFFF;
    font-weight:300;
}

.span-purple{
    color: #b783a9;
    font-weight:700;
}

.question-icon{
    position: relative;
    clear: left;
    top: 7px;
    width: 25px;
    height: 25px;
    background-image: url(../images/iconos/question.png);
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.info_barcode_text{
    position: relative;
    clear: left;
    top: 12px;
    width: 100%;
    height: auto;
    border-radius: 3px;
    line-height: 25px;
    padding: 10px 10px;
    font-weight: 700;
    color: #7b7979;
    font-size: 1em;
    text-align: justify;
    margin-top: 3px;
    margin-bottom: 8px;
    background-color: #efecec;
    /*display: none;*/
}

.bg-reg{
    background-color: #efecec;
    border-radius: 3px;
}

.bg-box-transparent{
    background-color: transparent;
}

.bg-box-grey{
    background-color: #d9d6d6;
}

/************************************************Otros estilos**************************************************/

.br-0{
    position:relative;
    clear:left;
    width:100%;
    height:3px;
}

.br-1{
    position:relative;
    clear:left;
    width:100%;
    height:5px;
}

.br-2{
    position:relative;
    clear:left;
    width:100%;
    height:7px;
}

.br-3{
    position:relative;
    clear:left;
    width:100%;
    height:10px;
}
.br-4{
    position:relative;
    clear:left;
    width:100%;
    height:15px;
}

.br-5{
    position:relative;
    clear:left;
    width:100%;
    height:40px;
}
.my-account-botton {
    position: relative;
    clear: left;
    width: 100%;
    height: 40px;
}

.br-5-1 {
    position: relative;
    clear: left;
    width: 100%;
    height: 55px;
}

.br-6{
    position:relative;
    clear:left;
    width:100%;
    height:70px;
}

.br-acc{
    position:relative;
    clear:left;
    width:100%;
    height:15px;
}

.br-footer{
    position:relative;
    clear:left;
    width:100%;
    height:30px;
    background-color: #000000;
}

.clear-my-account {
    position: relative;
    clear: left;
    width: 100%;
    height: 710px;
    align-content: end;
    text-align-last: right;
}
.clear-my-access-data {
    position: relative;
    clear: left;
    width: 100%;
    height: 857px;
    align-content: end;
    text-align-last: right;
}

.clear-account-state {
    position: relative;
    clear: left;
    width: 100%;
    height: 100px;
    align-content: end;
    text-align-last: right;
}
.clear-my-card {
    position: relative;
    clear: left;
    width: 100%;
    height: 557px;
    align-content: end;
    text-align-last: right;
}

.clear {
    position: relative;
    clear: left;
    width: 100%;
    height: 100px;
}

.txt-center-vertical span {
    vertical-align: super;
}


.txt-center-vertical {
    background-color: transparent;
    position: absolute;
    bottom: 0;
    right: 15px;
}
.contenedor-redes {
    position: relative;
    display: inline-block;
}
.clear-cb {
    position: relative;
    clear: left;
    width: 100%;
    height: 8px;
}

.clear-login{
    position:relative;
    clear:left;
    width:100%;
    height:96px;
}

.clear-login-2{
    position:relative;
    clear:left;
    width:100%;
    height:138px;
}

.valign{
    padding:5px 5px;
}

.bg-grey{
    background-color: #000000 !important;
}

.carousel .item{
    top: -96px !important;
}

html {
  overflow-y: scroll !important;
}

.no-background{
    background-color: transparent !important;
}

.img-redes {
    width: 35px;
    display: inline;
}
/**********************************************************************/
.btn-main-login {
    padding-bottom: 8px;
    padding-top: 8px !important;
    padding-left: 130px;
    padding-right: 7px;
    border-radius: 4px;
    background-color: transparent;
    color: #232323 !important;
    border: none !important;
}

.login-box{
    position: fixed;
    top: 80px;
    right: 50px;
    width: 250px;
    height: 300px;
    border-radius: 4px;
    background-color: #FFFFFF;
    box-shadow: 5px 5px rgba(91, 91, 91, 0.2);
    display: none;
}

.boton-login {
    color: white;
    text-align: center;
    margin-top: 10px;
    background-color: #e1251b;
    border-radius: 13px;
    font-weight: 100;
    font-size: 1.1em;
    border: none;

}

.boton-login a{
    color: #fff;
}

.lgn{
    margin-top:10px;
    text-align:center;
}

.login-body{
    position:absolute;
    top: 30px;
    padding-left:12px;
    padding-right:12px;
    z-index:9;
}

.login-footer{
    position:absolute;
    bottom: 0px;
    text-align:center;
    padding: 10px;
    z-index:10;
    background-color: #FFFFFF;
    border-bottom-left-radius:4px;
    border-bottom-right-radius:4px;
    border-top: solid 1px #ececec;
}

.login-body-pop {
    top: 30px;
    padding-left: 12px;
    padding-right: 12px;
    max-width: 300px;
    text-align: center;
    text-align: -webkit-center;
}

.login-box-pop {
    text-align: -webkit-center;
}
/**************************************************************************/
.btn_verify_cp {
    width: 140px;
    padding: 8px 11px;
    text-align: center;
    border: none;
    color: #FFFFFF;
    border-radius: 18px;
    font-weight: 700;
    font-size: 1em;
    background: #676970;
}

 .box-cp {
    background-color: #d9d6d6;
}


.dotted-space{
    position:relative;
    top:-40px;
    width:100%;
    height:70px;
    margin-bottom:50px;
    background-color: hsl(34, 53%, 82%);
    background-image: repeating-linear-gradient(45deg, transparent 5px, hsla(197, 62%, 11%, 0.5) 5px, hsla(197, 62%, 11%, 0.5) 10px,                  
      hsla(5, 53%, 63%, 0) 10px, hsla(5, 53%, 63%, 0) 35px, hsla(5, 53%, 63%, 0.5) 35px, hsla(5, 53%, 63%, 0.5) 40px,
      hsla(197, 62%, 11%, 0.5) 40px, hsla(197, 62%, 11%, 0.5) 50px, hsla(197, 62%, 11%, 0) 50px, hsla(197, 62%, 11%, 0) 60px,                
      hsla(5, 53%, 63%, 0.5) 60px, hsla(5, 53%, 63%, 0.5) 70px, hsla(35, 91%, 65%, 0.5) 70px, hsla(35, 91%, 65%, 0.5) 80px,
      hsla(35, 91%, 65%, 0) 80px, hsla(35, 91%, 65%, 0) 90px, hsla(5, 53%, 63%, 0.5) 90px, hsla(5, 53%, 63%, 0.5) 110px,
      hsla(5, 53%, 63%, 0) 110px, hsla(5, 53%, 63%, 0) 120px, hsla(197, 62%, 11%, 0.5) 120px, hsla(197, 62%, 11%, 0.5) 140px       
      ),
    repeating-linear-gradient(135deg, transparent 5px, hsla(197, 62%, 11%, 0.5) 5px, hsla(197, 62%, 11%, 0.5) 10px, 
      hsla(5, 53%, 63%, 0) 10px, hsla(5, 53%, 63%, 0) 35px, hsla(5, 53%, 63%, 0.5) 35px, hsla(5, 53%, 63%, 0.5) 40px,
      hsla(197, 62%, 11%, 0.5) 40px, hsla(197, 62%, 11%, 0.5) 50px, hsla(197, 62%, 11%, 0) 50px, hsla(197, 62%, 11%, 0) 60px,                
      hsla(5, 53%, 63%, 0.5) 60px, hsla(5, 53%, 63%, 0.5) 70px, hsla(35, 91%, 65%, 0.5) 70px, hsla(35, 91%, 65%, 0.5) 80px,
      hsla(35, 91%, 65%, 0) 80px, hsla(35, 91%, 65%, 0) 90px, hsla(5, 53%, 63%, 0.5) 90px, hsla(5, 53%, 63%, 0.5) 110px,
      hsla(5, 53%, 63%, 0) 110px, hsla(5, 53%, 63%, 0) 140px, hsla(197, 62%, 11%, 0.5) 140px, hsla(197, 62%, 11%, 0.5) 160px       
    );
}

.dotted-space-2{
    position:relative;
    clear:left;
    width:100%;
    height:1px;
    margin-top:40px;
    margin-bottom:20px;
    background-image: linear-gradient(to right, #444 45%, rgba(59,156,164,0) 0%);
    background-position: bottom;
    background-size: 30px 1px;
    background-repeat: repeat-x;
}

.cont_text_contact{
    font-size:1.2em;
    font-weight:300;
    text-align:justify;
    line-height:2em;
}

.have_account_link{
    cursor:pointer;
}

.cursor{
    cursor:pointer !important;
}

.cont_img_register_2 img{
    margin-left: auto;
    margin-right:auto;
    width:150px;
    height:150px;
}

.cont_user_registered {
    font-weight: 100;
    font-size: 1.3em;
    text-align: justify;
    line-height: 35px;
    padding: 20px 30px;
    font-family: 'Gotham-Book';
}

.align-right img{
    margin-left:auto;
}

.span_congrats{
    font-weight:500;
    font-size:1.4em;
    color: #333333;
}

.btn_signin_register{
    padding:15px 15px;
    margin-bottom:10px;
    font-weight:600;
    font-size:1.1em;
    border-radius:3px;
    border: none;
    color: #FFF;
    background: #565656;
}

.btn_close_session {
    padding: 0;
    font-size: 14px;
    font-weight: 600;
    background-color: transparent;
    border: none;
    color: #000;
    text-transform: uppercase !important;
}

.cont-welcome-profile{
    position:relative;
    top:-15px;
    float:right;
    right:0px;
    width:35px;
    height:35px;
    margin-right:35px;
}

.img-profile{
    margin: 0 auto;
    margin-top:4px;
    width:25px;
    height:25px;
    border-radius:20px !important;
}

.down-arrow{
    position:absolute;
    top:7px;
    right:-20px;
    width:20px;
    height:20px;
    background-image:url('../images/iconos/down-arrow.png');
    background-repeat:no-repeat;
    background-size:contain;
    cursor:pointer;
}

.up-arrow{
    position:absolute;
    top:7px;
    right:-20px;
    width:20px;
    height:20px;
    background-image:url('../images/iconos/up_arrow.png');
    background-repeat:no-repeat;
    background-size:contain;
    cursor:pointer;
}

.box-balance{
    position: absolute;
    top: 40px;
    right: -15px;
    width: auto;
    height: auto;
    min-width: 230px;
    background-color: #FFFFFF;
    border-radius: 3px;
    padding:10px;
    text-align:center;
    box-shadow: 5px 5px rgba(91, 91, 91, 0.2);
    display:none;
    transition-duration:1s;
}

.box-balance p{
    font-size:1.2em;
}

.box-balance .span-points{
    font-size: 1.2em;
    color: #9a6754;
    font-weight: 600;
}

.text-welcome-cont{
    position:relative;
    top:-12px;
    float:right;
    right:10px;
    width:auto;
    height:auto;
    color: #FFF;
    font-size: 1em;
    font-weight:600;
}

.username{
    position:relative;
    float:right;
    width: auto;
    height: auto;
    margin-left:5px;
    font-weight: bold;
    text-transform: lowercase;
}

.username-fl{
    text-transform: uppercase !important;
}

.cont-mobile-username{
    display: none;
    font-size: 1.4em;
}

.cont_main_menu_account{
    position:relative;
    float: left;
    top:-80px;
    left:50%;
    transform: translate(-50%, 50%);
    width:auto;
    height:auto;
    min-height:200px;
    z-index:10;
    border:solid 1px #000;
}

.cont_account_item{
    position:relative;
    float:left;
    left:0px;
    width: auto;
    height:auto;
    padding:5px 20px;
}

.cont_account_item img{
    width:50px;
}


.item-menu{
    animation-duration:1s;
}

.item-menu:hover{
    animation: rubberBand;
    animation-duration:1s;
}

.item-menu{
    animation-duration:1s;
}

.cont-logo img {
    width: 130px;
}

.account-logo img{
    width: 130px;
}

/*******************************Foto de Perfil************************************/

.cont_account_photo{
    position:relative;
    clear:left;
    top:-40px;
    width:150px;
    height:150px;
    margin: 0 auto;
    border-radius:80px;
    overflow: hidden;
}

.account-image{
    width:100%;
    height:100%;
}

.cont-upload-photo{
    position:absolute;
    top:109px;
    width: 100%;
    height: 40px;
    text-align: center;
    background-color: rgba(255,255,255, 0.7);
    padding-top:3px;
}

.btn-file{
    width: 30px;
    height:30px;
}

.img-upload-file{
    width: 100%;
}

.file-info{
    color: #1aa379;
}

.file-upload {
    position:relative !important;
    top:0px !important;
    margin-right: auto;
    margin-left:auto;
    overflow: hidden;
    text-align: center;
    color: #656565;
    cursor: pointer;
    width: 90px;
    height: 30px;
}

.file-upload span {
    width:90px;
    height:30px;        
}

.file-upload input {
    position:relative;
    top: 0;
    left: 0;
    margin: 0;
    font-size: 11px;
    font-weight: bold;
    opacity: 0;
    filter: alpha(opacity=0);
}

.cont-file-info{
    position:relative;
    float:left;
    top:-5px;
    width:100%;
    height:auto;
    text-align: center;
    margin-bottom:15px;
    padding:10px 5px;
    display: none;
}

.cont_preview_photo{
    position:relative;
    top:0px;
    width:150px;
    height:150px;
    margin: 0 auto;
    margin-bottom:10px;
    border-radius:80px;
    overflow: hidden;
    text-align:center;
}

.preview-photo{
    width:150px;
    height:150px;
}

.delete-photo{
    position:absolute;
    bottom:5px;
    width:100%;
    height: auto;
    padding:5px 5px;
    text-align:center;
    font-weight:bold;
    border:none;
    background-color: rgba(255,255,255, 0.8);
    cursor: pointer;
}

/***************************************************************************/

.text-card{
    padding-top:2px;
    text-align:right;
    font-weight:bold;
    line-height:10px;
}
.text-mycard {
    padding-top: 150px;
    font-weight: bold;
    line-height: 10px;
    font-size: 24px;
    font-family: 'Gotham-Book';
}

.card-edit {
    position: relative;
    top: 0px;
    width: 100%;
    height: auto;
    padding: 0px 0px 12px 0px;
    font-size: 1.4em;
    font-weight: 500;
    color: #242424;
    letter-spacing: 2px;
    border: none;
    background-color: transparent;
}
.card-edit-access {
    position: relative;
    top: 15px;
    width: 100%;
    height: auto;
    padding: 10px 0px;
    font-size: 2.4em;
    font-weight: 500;
    color: #000;
    letter-spacing: 2px;
    border: none;
    background-color: transparent;
    font-family: 'Gotham-Bold';
}

.cont_text_info {
    position: relative;      
    width: 100%;
    height: auto;
    text-align: justify;
    font-size: 1.5em;
    color: #000;
    line-height: 35px;
    margin-bottom: 30px;
    font-family: 'Gotham-Book';
}

.control-label-cancel {
    padding-top: 0px;
    /*  margin-bottom: 0;
    text-align: right;
    font-size: 16px;
    font-family: 'Gotham-Book';*/
    text-align: right;
    font-size: 1.2em;
    color: #000;
    line-height: 35px;
    margin-bottom: 30px;
    font-family: 'Gotham-Book';
}

.control-ddl-cancel {
    padding-top: 3px;
    font-size: 1.2em;
    color: #000;
    line-height: 35px;
    margin-bottom: 3px;
    font-family: 'Gotham-Book';
}

.text-info {
    font-size: 1.1em;
    color: #000;
}

.btn-cancel-card {
    position: relative;
    margin: 0 auto;
    margin-top: 10px;
    width: 250px;
   
    padding: 10px 15px;
    background: #e1251b;
    color: #FFFFFF;
    font-weight: 100;
    font-size: 1.1em;
    border-radius: 15px;
    cursor: pointer;


}

.btn-accept-cancel {
    color: white;
    background-color:#444;
    padding: 12px 20px;
    border-radius: 4px;
    font-weight: 700;
}

/*****************************************************************/

.current-points {
    background: #ffffff;
    border-radius: 3px;
    padding: 10px 5px;
    font-size: 1.5em;
    font-weight: 100;
    text-align: center;
    color: #000;
    background-color: transparent;
    margin-bottom: 10px;
    margin-top: 15px;
    font-family: 'Gotham-Book';
}

.title{
    position:relative;
    float:left;
    width:100%;
    height:auto;
    padding:10px 5px;
    font-size:2em;
    font-weight:100;
    text-align:center;
    color: #999;
    background-color: #FFFFFF;
    margin-top:10px;
    margin-bottom:20px;
}

.title-points-to-expire{
    padding:10px 5px;
    font-size:2em;
    font-weight:100;
    text-align:center;
    color: #999;
    background-color: #FFFFFF;
}

.title-2{
    position:relative;
    float:left;
    width:100%;
    height:auto;
    padding:10px 5px;
    font-size:2em;
    font-weight:100;
    text-align:center;
    color: #FFFFFF;
    border-radius:3px;
    background-color: #5ebfbf;
    margin-top:10px;
    margin-bottom:15px;
}

.center{
    text-align: center !important;
}

#img_home {
    background-color: #e2211c;
}

#img_home img {
    width: 70% !important;
}


.accumulated-points{
    border-radius: 15px;
    padding: 10px 5px;
    background-color: #444;
    color: #FFFFFF;
    font-weight: 100;
    font-size: 1.3em;
    margin-bottom:10px;
    margin-right:15px !important;
}

.exchange-points{
    border-radius: 15px;
    padding: 10px 5px;
    background-color: #444;
    color: #FFFFFF;
    font-weight: 100;
    font-size: 1.3em;
    margin-bottom:10px;
}

.text-period{
    padding: 10px 5px;
    color: #242424;
    font-weight: 500;
    font-size: 1.3em;
    margin-bottom:10px;
}

.select-period{
    padding: 4px 5px;
    color: #242424;
    font-weight: 100;
    font-size: 1.3em;
    margin-bottom:10px;
}
    .select-period select {
        border-radius: 15px;
    }

.span-current-points {
    color: #e1251b;
    font-weight: 400;
    font-family: 'Gotham-Bold';
}

.end-balance {
    border-radius: 15px;
    padding: 10px 5px;
    font-weight: 100;
    font-size: 1.3em;
    margin-top: 20px;
    margin-bottom: 10px;
    background-color: #e1251b;
    color: #FFFFFF;
}

.month-expire{
    border-radius: 15px;
    padding: 10px 5px;
    background-color: #444;
    color: #FFFFFF;
    font-weight: 100;
    font-size: 1.3em;
    margin-top:20px;
    margin-right:15px !important;
}

.points-expire{
    border-radius: 15px;
    padding: 10px 5px;
    background-color: #444;
    color: #FFFFFF;
    font-weight: 100;
    font-size: 1.3em;
    margin-top:20px;
}

.expiration-text {
    border-radius: 3px;
    padding: 10px 180px;
    color: #000;
    font-weight: 400;
    font-size: 1.1em;
    margin-top: 20px;
    font-family: 'Gotham-Book';
}

.msg-empty-transactions {
    border-radius: 3px;
    padding: 10px 5px;
    color: #242424;
    font-weight: 400;
    font-size: 1.3em;
    margin-bottom: 25px;
    margin-top: 30px;
    background-color: #efefef;
    color: #a4a4a4;
}

.date-from-to {
    padding: 13px 10px;
    font-size: 1.2em !important;
    background-color: #e1251b;
    color: #FFFFFF;
    border-radius: 3px;
    border-radius:15px;
}

.cont-btn-excel{
    position:relative;
    float:right;
    padding-top:5px;
    margin-top:20px;
    margin-bottom:10px;
    margin-right:15px;
}

.export-excel{
    width:70px !important;
    height:70px !important;
    border:none !important;
    background-color: transparent;
    background-image: url('../images/iconos/export-excel-3.png') !important;
    background-repeat: no-repeat !important;
    background-size: 70px 70px !important;
}

.text-whatis{
    font-weight: 100 !important;
    font-size: 1.5em !important;
    color: #444 !important;
}   

.tbx-recover-pass{
    width: 230px;
    height: 35px;
    border: solid 2px #929292;
    border-radius: 17px;
}

.tbx-recover-pass:focus{
    border-color: #b1322b;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgb(166, 51, 44);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgb(168, 51, 44);
}

.main_cont_1{
    background-image: linear-gradient(to right, #E58A77 45%, rgba(59,156,164,0) 0%);
    background-position: top;
    background-size: 40px 1px;
    background-repeat: repeat-x;
}

.main_sub_cont_1{
    
    background-color: hsla(35, 91%, 65%, 0.6);
}

.main_sub_cont_2{
    
    background-color: hsla(197, 62%, 11%, 0.6);
}

.main_cont_2{
    background-color: #f8f8f8; 
}

/*.main_cont_3{
    background-color: rgb(240, 196, 135); 
}*/

.main_cont_3 p a{
    color: rgba(231, 206, 40, 0.81);
    font-weight:600;
}

.step_1{
    margin-top:-6px;
    /*margin-bottom:70px;*/
}

.text-step-1{
    font-weight:100;
    font-size:1.4em;
    margin-top:20px;
    margin-bottom:20px;
}

.step_2{
    margin-top:-20px;
    margin-bottom:0px;
}

.text-step-2 {
    margin-top: 70px;
    font-size: 1.4em;
    font-weight: 600;
    color: #646464;
}

.img-step-2{
    margin-top:60px;
    margin-bottom:60px; 
}

.step_3{
    margin-top:-30px;
    margin-bottom:0px;
}

.text-step-3 {
    margin-top: 40px;
    font-size: 1.4em;
    font-weight: 100;
    color: #FFFFFF;
}

.img-step-3{
    margin-top:20px;
    margin-bottom:30px;
}

.step_4{
    margin-top:60px;
    margin-bottom:0px;
}

.text-step-4 {
    margin-top: 65px;
    font-size: 1.4em;
    font-weight: 100;
    color: #444;
}

.img-step-4{
    margin-top:40px;
    margin-bottom:30px;
}

.step_5{
    margin-top:60px;
    margin-bottom:0px;
}

.text-step-5{
    margin-top: 40px;
    font-size: 1.4em;
    font-weight: 500;
}

.text-step-5 a{
    color: #767676;
    font-weight: 600;
}

.img-step-5{
    margin-top:40px;
    margin-bottom:30px;
}

.no-display{
    display: none;
}

/************************************************************************************/

.cont-main-menu{
    position:relative;
    text-align: center;
    margin-top:30px;
}

.item-account{
    position: relative;
    display: inline-table;
    max-width:240px;
    width:100%;
    min-height:125px;
    background: #444;
    padding-top:25px;
    color: #FFF;
    margin-left:5px;
    margin-right:5px;
    border-radius: 21px;
    margin-bottom: 20px;
    cursor: pointer;
}

.item-account:hover{
    background: rgb(169, 111, 111) !important;
}

.item-account:hover img{
    animation: rubberBand;
    animation-duration:1s;
}

.item-account-active{
    background: #e1251b;
}


/*********/

.item-account-cancel {
    position: relative;
    display: inline-block;
    max-width: 240px;
    width: 100%;
    min-height: 125px;
    background: #444;
    padding: 25px;
    color: #FFF;
    margin-left: 5px;
    margin-right: 5px;
    border-radius: 21px;
    margin-bottom: 20px;
    cursor: pointer;
}

    .item-account-cancel:hover {
        background: rgb(169, 111, 111) !important;
    }

        .item-account-cancel:hover img {
            animation: rubberBand;
            animation-duration: 1s;
        }


/***********************/

.dataTables_wrapper {
    position: relative;
    clear: both;
    zoom: 1;
    padding-bottom: 10px;
}

.btn-close{
    width: auto;
    height: auto;
    padding: 8px 15px !important;
    font-size: 1.1em;
    text-align: center;
    border: none;
    border-radius: 3px;
    background: #b783a9;
    color: #FFFFFF;
}

.contact-phone:hover{
    color: hsla(197, 62%, 11%, 0);
}

.contact-phone-2{
    color: #fff;
}

.contact-phone-2:hover{
    color: #f6f6f6;
}

.no-promo-title{
    font-size:2.1em;
    font-weight:400;
    color: #8b7e7f;
}

.cont_success_linkedcards{
    text-align:center;
    font-size:1.5em;
    font-weight:100;
    margin-bottom:25px;
}

.cont_text_linkedcards{
    text-align: center;
    padding:20px 25px;
    margin-top:15px;
}

.span_text_lc{
    color: #55c4c1;
    font-weight:400;
}

.anchor{
    position:absolute;
    width:100%;
    bottom:80px;
}

.text-restart{
    font-size:1.7em;
    font-weight:100;
    padding:20px;
    color: #444;
}

/*****************************BlueWallet***********************************/

.walletbullet{
    margin-left: 40px;
    font-weight: 200;
    font-size: 1.2em;
}
.walletbullet-xs{
    font-weight: 200;
    font-size: 1.2em;
    margin-left: 10%;
    margin-top: 50px;
    margin-bottom: 50px;
}
.walletbullet li{
    list-style-image: url('../images/BlueWallet/DescargaBullet.png');
}
.walletbullet-xs li{
    list-style-image: url('../images/BlueWallet/DescargaBullet.png');
}
.walletimg img{
    position:relative;
    float:right;
}
.walletvacio{
    margin: 47px;
}

.bluewallet-note{
    text-align:center;
    padding:20px;
    font-size: 1.1em;
}

.walletapptext{
    position:relative;
    text-align:center;
    font-size:1.2em;
}

.walletappbuttons{
    position:relative;
    text-align:center;
    margin-top: 10px;
}

.walletappbuttons a{
    display: inline-block !important;
}

.walletappbuttons img{
    position:relative;
    margin: 0 auto;
}

/***************************Tarjeta Digital*********************************/

#virtualCard{
    position: relative;
    display:inline;
    cursor: pointer;
}

#plasticCard, #plasticCardNew {
    position: relative;
    display:inline;
    cursor: pointer;
    margin-right: 30px;
}

    #plasticCard img, #virtualCard img {
        border-radius: 10px;
        display: inline-block;
        width: 270px;
    }
   #plasticCardNew img{
        border-radius: 10px;
        display: inline-block;
        width: 100%;
    }

.active-image{
    border: solid 4px #444;
}

.inactive-image{
    opacity:0.4;
}

.box-barCode{
    position:relative;
    display:block;
    margin-left:10px;
    margin-right:10px;
}

/********************My Card*************************/

/* entire container, keeps perspective */
.flip-container {
    position: relative;
    display: inline-block;
    max-width: 600px;
    margin: 0 auto;
    perspective: 1000px;
    margin-bottom:65px;
}
/* flip the pane when hovered */
/*.flip-container:hover .flipper, .flip-container.hover .flipper {
	transform: rotateY(180deg);
}*/

.flip-container.flip .flipper{
	transform: rotateY(180deg);
}

.front img, .back img{
    width: 100%;
    border-radius: 10px;
    /*-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);*/
}

/* flip speed goes here */
.flipper {
	transition: 0.6s;
	transform-style: preserve-3d;
	position: relative;
}

/* hide back of pane during swap */
.front{
    /*Uncomment for IOS Change*/
	/*backface-visibility: hidden;*/
	position: relative;
	top: 0;
	left: 0;
    max-width: 400px;
    margin: 0 auto;
}

.back {
    /*Uncomment for IOS Change*/
	/*backface-visibility: hidden;*/
	/*position: absolute;*/
    position: relative;
	top: 0;
	left: 0;
    max-width: 400px;
    margin: 0 auto;
    /*Delete for IOS Change*/
    display: none;
}

/*Uncomment for IOS Change*/
/* front pane, placed above back
.front {
	z-index: 2;
	
	transform: rotateY(0deg);

}

back, initially hidden pane 
.back {
	transform: rotateY(180deg);
}*/
.txt-number-card{
    padding-top:50px;
}
.my-card-number {
    position: absolute;
    bottom: -16%;
    width: 100%;
    font-size: 1.9em;
    font-weight: 300;
    text-align: center;
    color: #000;
    letter-spacing: 3px;
}

.my-virtualcard-number{
    position: absolute;
    bottom: 7%;
    width: 100%;
    font-size: 1.9em;
    font-weight: 600;
    text-align: center;
    color: #000;
    letter-spacing: 7px;
}

.reverse-button{
    position: absolute;
    bottom: 156px;
    right: -70px;
    width: 60px;
    height: 60px;
    background-image: url(../images/iconos/icon-reverse.svg);
    background-repeat: no-repeat;
    background-position: center 100%;
    background-size: contain;
    z-index: 3;
    cursor: pointer;
}

.cont-barcode{
    position: absolute;
    top: 56px;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    max-width: 400px;
}

.cont-barcode img{
    max-width:250px;
    margin: 0 auto;
    box-shadow: 0 0 0 0 !important;
    border-radius: 0 !important;
}

a.toggle-login .fa-user {
    padding-right: 0px;
}
.cont-text-info {
    text-align: center;
}

.cont-text-info span{
    padding: 20px 60px;
    display: inline-block;
    font-size: 1.1em;
    font-weight: 600;
}

.cont-text-info img{
    max-width: 300px;
    width: 100%;
}

.card{
    border-radius: 6px;
}

/******************************Cupones de Descuento********************************/

.mtmx_cpn_cont_text_info{
    position:relative;
    top:-20px;
    margin: 0 auto;
    width: 100%;
    max-width: 700px;
    height:auto;
    text-align:center;
    font-size:1.1em;
    color: #767676;
    line-height:35px;   
    margin-bottom:20px;
}

.mtmx_cpn_cont_text_important{
    background-color: #ebe9e9;
    padding: 10px 26px;
    margin-top: 10px;
    border-radius: 3px;
}

.mtmx_cpn_title_cupons{
    position: relative;
    clear: left;
    text-align:center;
    margin-top:20px;
    margin-bottom:20px;
    font-size:1.7em;
}

.mtmx_cpn_cont_cupons{
    position: relative;
    text-align: center;
    margin-top: 20px;
    width: 100%;
    margin-bottom: 20px;
    margin: 0 auto;
}

.mtmx_cpn_cont_cupons img{
    max-width:250px;
    width:100%;
}

.mtcpn_cupon_item{
    position: relative;
    display: inline-block;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 20px;
    max-width: 200px;
    width: 100%;
    color: #fff;
    padding: 25px 16px;
    border-radius: 4px;
    text-align: center;
    font-size: 1em;
    cursor: pointer;
}

.mtcpn_cupon_item:hover{
    opacity:0.8;
}

.mtcpn_cupon_active{
    opacity:0.8;
}

.mtcpn_cupon_item img{
    max-width: 110px;
    width: 100%;
    margin: 0 auto;
}

.mtcpn_cupon_item span{
    display: block;
}

.mtcpn_cupon_selected{
    position:absolute;
    top:-10px;
    right:-10px;
    width:40px;
    height:40px;
    background-image: url('../images/iconos/selected.png');
    background-repeat: no-repeat;
    background-position: center 100%;
    background-size: cover;
}

.mtmx_cpn_cont_button{
    position:relative;
    width:100%;
    text-align:center;
    margin-top:30px;
    margin-bottom:10px;
    display: none;
}

.mtmx_cpn_terms{
    text-align: center;
    margin-top: 20px;
}

.ntcpn_modaltitle{
    margin: 0 auto;
    text-align:center;
    font-size:1.3em;
}

.ntcpn_modalterms{
    position: relative;
    padding:20px;
    font-size:1em;
    text-align: justify;
}

.mtcpn_button{
    padding: 13px 17px;
    border: none;
    border-radius: 3px;
    background-color: #79569c;
    color: #fff;
}

.mtcpn_cont_resume{
    position: relative;
    max-width: 430px;
    width: 100%;
    margin: 0 auto;
    margin-top: 20px;
    font-size: 1.2em;
}

.mtcpn_cont_resume .table thead th{
    text-align:center;
    vertical-align: middle;
}

.mtcpn_cont_resume .table tbody td{
    text-align:center;
    vertical-align: middle;
}

.mtcpn_cont_resume .table tfoot th{
    text-align:right;
    vertical-align: middle;
}

.mtcpn_cont_resume .table tfoot th.th_total{
    text-align:center !important;
    vertical-align: middle;
    color: #a1871d;
}

.mtcpn_response{
    position: relative;
    max-width: 430px;
    width: 100%;
    margin: 0 auto;
    margin-top: 20px;
    margin-bottom: 20px;
    font-size: 1.4em;
    text-align:center;
}

.mtcpn_response2{
    position: relative;
    max-width: 450px;
    width: 100%;
    margin: 0 auto;
    margin-top: 20px;
    margin-bottom: 20px;
    font-size: 1.4em;
    text-align:center;
}

.mtcpn_response2 .table{
    table-layout: fixed;
    font-size: 0.75em;
    margin-top: 20px;
}

.mtcpn_response2 .table thead th{
    text-align: center;
    vertical-align: middle;
}

.mtcpn_response2 .table tbody td{
    text-align: center;
    vertical-align: middle;
}

.mtcpn_title_response{
    font-size: 20pt;
    font-weight:600 !important;
    margin-bottom:27px;
    text-align:center;
}

.mtcpn-cont-loader{
    position: relative;
    display: inline-block;
}

.mtcpn-loader{
    position: absolute;
    top: 0px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    height: 47px;
    background-image: url(../images/iconos/loader.gif);
    background-repeat: no-repeat;
    background-size: 45px;
    background-position: center 100%;
    z-index: 100;
    background-color: #fff;
    opacity: 0.8;
    display: none;
}

.mtmx_cpn_saved_cupons{
    text-align:center;
}

.btn-mtcpn-my-saved{
    position: relative;
    display: inline-block;
    padding: 13px 20px;
    background-color: #a51d1d;
    color: #fff !important;
    border: none;
    border-radius: 3px;
    margin-bottom: 10px;
    font-weight: 400;
    cursor: pointer;
}

.btn-mtcpn-my-saved:hover{
    opacity: 0.8;
    color: #fff;
}

.ntcpn_modalsavedcupons{
    position: relative;
    padding:20px;
    font-size:1.3em;
    text-align: center;
}

.modal-item-cupon{
    position: relative;
    display: inline-block;
    margin-bottom: 20px;
    margin-left: 8px;
    margin-right: 8px;
    max-width: 190px;
    width: 100%;
    text-align: center;
    padding: 10px;
    border-radius: 3px;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
}

.item-cupon-image img{
    max-width: 100px;
    width: 100%;
    margin: 0 auto;
    margin-top:10px;
    margin-bottom:10px;
}

.item-cupon-code{
    font-size: 0.8em;
    font-weight:600;
}

.item-cupon-description{
    font-size: 0.7em;
}

.item-cupon-date{
    font-size: 0.7em;
}

.cpn_cont_text_info{
    position:relative;
    top:-20px;
    margin: 0 auto;
    width: 100%;
    max-width: 790px;
    height:auto;
    text-align:center;
    font-size:1.1em;
    color: #fff;
    line-height:35px;   
    margin-bottom:20px;
}

.cpn_cont_text_info a{
    color: #fff;
}

.cpn_cont_text_info img{
    margin: 0 auto;
    transform: rotate(-45deg);
    margin-top: 55px;
}

.cpn_cont_loggued_button{
    position: relative;
    text-align:center;
    margin-bottom:20px;
    padding-top:20px;
}

.cpn_cont_loggued_button a{
    color: #FFF !important;
    background-color: #78468d;
    padding: 10px 19px;
    border-radius: 3px;
    display: inline-block;
    cursor: pointer;
    border:none;
    transition-duration: 0.3s;
}

.cpn_cont_loggued_button a:hover{
    background-color: #875d99;
}

.sectionCupons{
    background-color: #b17fa2;
}

.sectionCupons h2{
    color: #fff;
}

.cpn_cont_text_important{
    background-color: #c197b5;
    padding: 10px 26px;
    margin-top: 10px;
    border-radius: 3px;
}

.current-points-cupons{
    padding: 10px 5px;
    font-size:1.5em;
    text-align:center;
    margin-top:15px;
}

.bck-txt {
    color: #000;
}
/*****************************Pagination******************************/
.pagination {
    padding: 20px;
    color: #333;
    font-weight: 500;
}
.pagination,
.pagination * {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
          text-align: center;
          display: block;
}
.pagination a {
  display: inline-block;
  padding: 0 10px;
  cursor: pointer;
}
.pagination .page.current{
    color: #a51d1d !important;
}

.pagination .nav.prev.disabled, .pagination .nav.next.disabled{
    color: #d5d5d6;
}

/*************************************************************/

.form-control {
    border: 2px solid #8f8c8c;
    border-radius: 20px;
    font-weight: 700;
    background-color: #fff !important;
}

.stores-section {
    background-color: #f3f1f1;
    border: none !important;
    
}

.form-control:focus {
    border-color: #b1322b;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgb(166, 51, 44);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgb(168, 51, 44);
}
.stores-section::placeholder {
    color: #000 !important;
    font-family: 'Gotham-Book';
    text-align:center;
}

.form-card-center {
    margin-top: 16px;
}

.chkboxes{
    font-size: 0.9em;
    font-weight: 600;
}

.chkboxes label{
    font-size: 1em !important;
    font-weight: 600;
}

    .chkboxes a {
        font-size: 1em;
        margin-left: 5px;
        margin-right: 5px;
        color: #000;
        font-family: 'Gotham-Bold';
    }
    /*********************************Popup info*************************************/
    .main-popup-message {
        position: fixed;
        top: 0;
        left: 0;
        display: none;
        height: 100%;
        width: 100%;
        z-index: 3200;
        overflow-y: auto;
        background-color: rgba(0, 0, 0, .7);
        backdrop-filter: blur(8px);
    }

.white-popup-color {
    background-color: rgba(139, 118, 42, 0.25) !important;
}

.mppm-popup-box {
    position: relative;
    right: 0;
    left: 0;
    margin-top: 160px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 140px;
    max-width: 450px;
    width: 94%;
    border-radius: 5px;
    background-color: #fff;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.75);
    padding: 20px;
}

.mppm-popup-text2 {
    position: relative;
    font-size: 1.3em;
    margin-bottom: 20px;
    padding: 0px 12px;
    text-align: center;
    margin-top: 20px;
}

.mppm-popup-text2 a{
    position: relative;
    margin-top: 20px;
    font-size: 0.9em;
}

.mppm-popup-text2 i{
    display: block;
    font-size: 2em;
    color: #e13828;
    margin-bottom:5px;
}

.mppm-popup-input {
    position: relative;
    text-align: center;
    padding: 20px 0px;
}

.mppm-popup-input input[type=text]{
    position: relative;
    text-align: center;
    padding: 20px 0px;
    max-width: 150px;
    width: 100%;
    height: 40px;
    border: 2px solid #8f8c8c;
    border-radius: 12px;
    font-weight: 700;
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.8);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.mppm-popup-input input[type=text]:focus{
    border-color: #b1322b;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgb(166, 51, 44);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgb(168, 51, 44);
}

.mppm-popup-options {
    position: relative;
    text-align: center;
    padding: 10px 0px;
    clear: left;
}

.mppm-popup-close {
    position: fixed;
    top: 15px;
    right: 30px;
    width: 35px;
    height: 35px;
    background-image: url(../images/iconos/close-w.png);
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 100;
    cursor: pointer;
}

.popup-main-message {
    position: fixed;
    top: 46%;
    left: 0;
    right: 0;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100%;
    max-width: 250px;
    min-height: 40px;
    padding: 10px;
    background-color: rgb(67, 67, 67);
    color: #FFF;
    text-align: center;
    border-radius: 3px;
    z-index: 10;
    display: none;
}

.popup-sucess{
    background-color: #379656;
    color: #FFF;
}


.popup-error-ajax {
    position: fixed;
    top: 45%;
    left: 0;
    right: 0;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100%;
    max-width: 290px;
    min-height: 40px;
    padding: 10px;
    background-color: #444;
    color: #FFF;
    text-align: center;
    border-radius: 3px;
    z-index: 10;
    display: none;
}

.popup-success-ajax {
    position: fixed;
    top: 45%;
    left: 0;
    right: 0;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100%;
    max-width: 290px;
    min-height: 40px;
    padding: 10px;
    background-color: #2fa24c;
    color: #FFF;
    text-align: center;
    border-radius: 3px;
    z-index: 10;
    display: none;
}

/****************************************************/

.tunning-image{
    position: relative;
    width:100%;
    text-align: center;
}

.tunning-image h1{
    margin: 0 auto;
    font-size: 1.4em;
    font-weight: bold !important;
    padding-bottom: 13px;
}

.tunning-image img{
    display: block;
    width:100%;
    margin: 0 auto;
}

.tunning-terms {
    position: relative;
    width: 100%;
    text-align: center;
    padding:10px;
}

.terms-tuning ul {
    list-style: disc;
    list-style-position: inside;
}

/**************************************************************************/

@supports (-webkit-appearance: none) or (-moz-appearance: none) {
    input[type='checkbox'],
    input[type='radio'] {
        --active: #a51d1d;
        --active-inner: #fff;
        --focus: 2px rgba(165, 29, 29, 0.47);
        --border: #c6c5c5;
        --border-hover: #a51d1d;
        --background: #fff;
        --disabled: #c6c5c5;
        --disabled-inner: #c6c5c5;
        -webkit-appearance: none;
        -moz-appearance: none;
        height: 21px;
        outline: none !important;
        display: inline-block;
        vertical-align: top;
        position: relative;
        margin: 0;
        cursor: pointer;
        border: 2px solid var(--bc, var(--border));
        background: var(--b, var(--background));
        -webkit-transition: background .3s, border-color .3s, box-shadow .2s;
        transition: background .3s, border-color .3s, box-shadow .2s;
    }

        input[type='checkbox']:after,
        input[type='radio']:after {
            content: '';
            display: block;
            left: -1px;
            top: -1px;
            position: absolute;
            -webkit-transition: opacity var(--d-o, 0.2s), -webkit-transform var(--d-t, 0.3s) var(--d-t-e, ease);
            transition: opacity var(--d-o, 0.2s), -webkit-transform var(--d-t, 0.3s) var(--d-t-e, ease);
            transition: transform var(--d-t, 0.3s) var(--d-t-e, ease), opacity var(--d-o, 0.2s);
            transition: transform var(--d-t, 0.3s) var(--d-t-e, ease), opacity var(--d-o, 0.2s), -webkit-transform var(--d-t, 0.3s) var(--d-t-e, ease);
        }

        input[type='checkbox']:checked,
        input[type='radio']:checked {
            --b: var(--active);
            --bc: var(--active);
            --d-o: .3s;
            --d-t: .6s;
            --d-t-e: cubic-bezier(.2, .85, .32, 1.2);
        }

        input[type='checkbox']:disabled,
        input[type='radio']:disabled {
            --b: var(--disabled);
            cursor: not-allowed;
            opacity: .9;
        }

            input[type='checkbox']:disabled:checked,
            input[type='radio']:disabled:checked {
                --b: var(--disabled-inner);
                --bc: var(--border);
            }

            input[type='checkbox']:disabled + label,
            input[type='radio']:disabled + label {
                cursor: not-allowed;
            }

        input[type='checkbox']:hover:not(:checked):not(:disabled),
        input[type='radio']:hover:not(:checked):not(:disabled) {
            --bc: var(--border-hover);
        }

        input[type='checkbox']:focus,
        input[type='radio']:focus {
            box-shadow: 0 0 0 var(--focus);
        }

        input[type='checkbox']:not(.switch),
        input[type='radio']:not(.switch) {
            width: 21px;
        }

            input[type='checkbox']:not(.switch):after,
            input[type='radio']:not(.switch):after {
                opacity: var(--o, 0);
            }

            input[type='checkbox']:not(.switch):checked,
            input[type='radio']:not(.switch):checked {
                --o: 1;
            }

        input[type='checkbox'] + label,
        input[type='radio'] + label {
            font-size: 14px;
            line-height: 21px;
            display: inline-block;
            vertical-align: top;
            cursor: pointer;
            margin-left: 12px;
        }

        input[type='checkbox']:not(.switch) {
            border-radius: 7px;
        }

            input[type='checkbox']:not(.switch):after {
                width: 5px;
                height: 9px;
                border: 2px solid var(--active-inner);
                border-top: 0;
                border-left: 0;
                left: 6px;
                top: 3px;
                -webkit-transform: rotate(var(--r, 20deg));
                transform: rotate(var(--r, 20deg));
            }

            input[type='checkbox']:not(.switch):checked {
                --r: 43deg;
            }

        input[type='checkbox'].switch {
            width: 38px;
            border-radius: 11px;
        }

            input[type='checkbox'].switch:after {
                left: 2px;
                top: 2px;
                border-radius: 50%;
                width: 15px;
                height: 15px;
                background: var(--ab, var(--border));
                -webkit-transform: translateX(var(--x, 0));
                transform: translateX(var(--x, 0));
            }

            input[type='checkbox'].switch:checked {
                --ab: var(--active-inner);
                --x: 17px;
            }

            input[type='checkbox'].switch:disabled:not(:checked):after {
                opacity: .6;
            }

    input[type='radio'] {
        border-radius: 50%;
    }

        input[type='radio']:after {
            width: 19px;
            height: 19px;
            border-radius: 50%;
            background: var(--active-inner);
            opacity: 0;
            -webkit-transform: scale(var(--s, 0.7));
            transform: scale(var(--s, 0.7));
        }

        input[type='radio']:checked {
            --s: .5;
        }
}


/*****************************Mapa*************************************/
#sucursalesTitle h2{
    color:#fff !important;
}
#map {
    width: 100%;
    height: 600px;
}

.geolocation-current {
    text-align: center;
    color: #444;
    font-weight: 500;
    font-size: 1em;
}

    .geolocation-current img {
        margin: 0 auto;
    }

.geolocation-header {
    /*position: absolute;*/
    top: 0px;
    left: 0px;
    width: 100%;
    min-height: 40px;
    padding: 12px 20px;
    font-size: 1.1em;
    background-color: #e1251b;
    color: #fff;
}

.geolocation-box {
    position: relative;
    max-width: 250px;
    text-align: center;
    font-size: 1.1em;
    font-weight: 400;
    color: #444;
    padding: 10px;
}

.geolocation-btn {
    display: block;
    padding: 5px 10px;
    background-color: #001e3e;
    color: #fff !important;
    font-size: 1em;
    text-align: center;
    border-radius: 3px;
    margin-top: 10px;
    transition-duration: 0.3s;
    cursor: pointer;
}

    .geolocation-btn:hover {
        background-color: #38597b;
        color: #fff !important;
        transition-duration: 0.3s;
    }

.geolocation-icon {
    display: inline-block;
    margin: 0px 2px;
    margin-top: 11px;
}

    .geolocation-icon img {
        max-width: 100px;
    }

.gm-style .gm-style-iw-c {
    color: #444;
}

/****************************Filtros para el mapa********************************/

.stores-filter {
    /*position: relative;*/
    padding-top: 15px;
    padding-bottom: 15px;
    background-color: #e1251b;
    text-align: center;
}

.str-filter-state {
    display: inline-block;
    max-width: 220px;
    width: 100%;
    margin-right: 10px;
}

.str-filter-county {
    position: relative;
    display: inline-block;
    max-width: 220px;
    width: 100%;
}

.str-filter-button {
    display: inline-block;
    max-width: 135px;
    width: 100%;
}

.option-menu {

    padding-top: 10px;
}

.main-menu-anonymous {
    padding-top: 9px;
}
.btn-bottom-space {
    margin-top: 20px;
}
/**************************************************************************/
@media screen and (max-width: 1474px) {
    .big-contact {
        min-height: 746px !important;
    }
    #img_home img {
        width: 85% !important;
    }
    .txt-red-steps{
        font-size:30px;
    }
}

@media screen and (max-width: 1406px) {
    .txt-red-steps {
        font-size: 28px !important;
    }
}


    @media screen and (max-width: 1342px) {
        .txt-small {
            font-size: 30px;
        }
    }

    @media screen and (max-width: 1288px) {
        .txt-funciona-span {
            text-wrap-mode: wrap;
        }
    }

    @media screen and (max-width: 1267px) {
        .item-account {
            max-width: 200px;
        }
    }

    @media screen and (max-width: 1200px) {
        #img_home img {
            width: 100% !important;
        }

        .cont-welcome-profile {
            position: relative;
            top: -15px;
            float: right;
            right: 0px;
            width: 35px;
            height: 35px;
            margin-right: 35px;
        }

        .text-welcome-cont {
            position: relative;
            top: -9px;
            float: right;
            right: 10px;
            width: auto;
            height: auto;
        }

        .img-steps img {
            width: 80%;
            padding-top: 15px;
        }

        .card-edit-access {
            font-size: 1.5em;
        }

        .container {
            width: 1160px;
        }

        .txt-red-steps {
            font-size: 32px !important;
        }

        .txt-funciona-1, .txt-funciona-3 {
            padding-left: 0px;
            font-size: 0.9em;
        }
        .step_1 {
            margin-top: -33px;
            /*margin-bottom:70px;*/
        }
    }



@media screen and (max-width: 1121px) {
    .main-menu-anonymous ul li a {
        font-size: 0.85em;
        padding: 10px 15px;
    }
    
}

@media screen and (max-width: 1051px) {
    .step_1 {
        margin-top: -24px;
    }
}

@media screen and (max-width: 1067px) {
        .item-account {
            max-width: 185px;
        }

        .container {
            width: 1000px;
        }
    }

    @media screen and (max-width: 1060px) {
        .txt-small {
            font-size: 28px;
        }

        .txt-subtitle-new {
            font-size: 65px !important;
            padding-top: 21px;
        }
    }

@media screen and (max-width: 1011px) {

    .step_1 {
        margin-top: -10px;
    }
}
        
        @media screen and (max-width: 1011px) {
        .cont-logo {
            margin-top: 5px;
        }

        .img-steps img {
            width: 70%;
            padding-top: 15px;
        }
    }

@media screen and (max-width: 997px) {
    .step_1 {
        margin-top: -27px;
    }
}
        @media screen and (max-width: 993px) {
        .txt-small {
            margin-left: -35px;
            font-size: 27px;
        }

        .item-account {
            max-width: 179px;
        }

        .option-menu-log {
            padding-top: 40px;
        }

        .container {
            width: 960px !important;
        }

    }

@media (min-width: 992px) {
    .container {
        width: 1100px;
    }
}
@media screen and (max-width: 991px) {
    #sucursalesTitle h2 {
        color: #000 !important;
    }

    .cont-welcome-profile {
        right: -10px;
        top: 36px;
    }

    .text-welcome-cont {
        right: 0px;
        top: 40px;
    }

    .cont_text_info {
        position: relative;
        top: -20px;
        margin: 0 auto;
        width: 100%;
        height: auto;
        text-align: justify;
        font-size: 1.1em;
        color: #767676;
        line-height: 35px;
        margin-bottom: 20px;
    }

    .step_1 {
        margin-top: 95px;
    }

    .text-step-1 {
        margin-top: 70px;
        margin-bottom: 60px;
    }

    .item-1, .item-2, .item-3 {
        padding-top: 13px;
        padding-bottom: 14px;
    }

    .cont-logo {
        padding-left: 2px;
    }

    .clear-login-2 {
        height: 105px;
    }

    .form-horizontal .control-label {
        text-align: left;
    }

    .txt-small {
        margin-left: 0px;
        font-size: 28px;
    }

    .container-fluid {
        padding-right: 0px;
    }

    .txt-benefits-details img {
        width: 35%;
    }

    .btn_close_session {
        color: #ffffff;
    }

    .heading-section {
        margin-top: 30px;
    }

    .contain-validate {
        padding-left: 25px;
        padding-right: 25px;
    }

    .option-menu {
        padding-top: 50px;
    }

    .card-edit {
        text-align: center;
    }

    .img-steps img {
        width: 50%;
        padding-top: 0px;
    }

    .txt-funciona-1, .txt-funciona-3 {
        padding-left: 16em;
        font-size: 1em;
    }
    .txt-funciona-3 {
        padding-left: 16em;
        font-size: 1em;
    }
    .my-account-botton {
        position: relative;
        clear: left;
        width: 100%;
        height: 25px;
    }
    #cont_btns_edit {
        padding-bottom: 15px;
    }
    #BtnEdit{
        margin-bottom:15px;
    }
    .card-edit {
        padding-top: 20px;
        padding-bottom:0px;
    }
}
@media screen and (max-width: 1726px) {
    .img-steps {
        padding-top: 15px;
    }
}

@media screen and (max-width: 1465px) {
    .img-steps {
        padding-top: 23px;
    }
}
    @media screen and (max-width: 987px) {
        .item-account {
            max-width: 160px;
            font-size: 12px;
            font-weight: 200 !important;
            min-height: 98px;
        }

            .item-account img {
                width: 25%;
            }

        .txt-subtitle-new {
            font-size: 60px !important;
        }

        .txt-funciona-1, .txt-funciona-3 {
            padding-left: 14em;
            font-size: 1em;
        }
    }

    @media screen and (max-width: 966px) {
        .container {
            width: 900px !important;
        }

        .container-stores {
            padding-left: 0px;
            padding-right: 0px;
        }

        .txt-funciona-1, .txt-funciona-3 {
            padding-left: 12em;
            font-size: 1em;
        }

        .menu-responsive {
            margin-left: -14px !important;
        }
        .space-register {
            margin-bottom: 40px !important;
        }
    }

    @media screen and (max-width: 917px) {
        .txt-subtitle-new {
            font-size: 55px !important;
        }

        .txt-funciona-1, .txt-funciona-3 {
            padding-left: 10em;
            font-size: 1em;
        }
    }

    @media screen and (max-width: 906px) {
        .container {
            width: 850px !important;
        }

        .txt-funciona-1, .txt-funciona-3 {
            padding-left: 8em;
            font-size: 1em;
        }
    }

    @media screen and (max-width: 876px) {
        .txt-subtitle-new {
            font-size: 50px !important;
        }

        .txt-funciona-1, .txt-funciona-3 {
            padding-left: 6em;
            font-size: 1em;
        }
    }

    @media screen and (max-width: 867px) {
        .item-account {
            max-width: 140px;
            font-size: 11px;
            font-weight: 200 !important;
            min-height: 90px;
        }
    }

    @media screen and (max-width: 850px) {
        .txt-subtitle-new {
            font-size: 45px !important;
        }

        .cont_text_info {
            width: 85% !important;
            padding-top: 30px;
        }

        .container {
            width: 800px !important;
        }
    }


    @media screen and (max-width: 830px) {
        .txt-subtitle-new {
            font-size: 45px !important;
        }

        .cont_text_info {
            width: 85% !important;
            padding-top: 30px;
        }

        .txt-funciona-1, .txt-funciona-3 {
            padding-left: 3em;
            font-size: 1em;
            padding-right: 3em !important;
        }
    }

    @media screen and (max-width: 820px) {
        .img-redes {
            width: 25px;
        }

        .txt-center-vertical {
            right: 60px;
        }

        .container {
            width: 780px !important;
        }

        .card-edit-access {
            font-size: 1.2em;
        }
    }


    @media screen and (max-width: 778px) {
        .img-redes {
            width: 23px;
            padding-top: 5px;
        }

        .txt-center-vertical {
            right: 70px;
        }

        .container {
            width: 750px !important;
        }
    }

    @media screen and (max-width: 767px) {
        .container {
            width: 740px !important;
        }

        .text-welcome-cont {
            display: none;
        }

        .username {
            display: none;
        }

        .cont-mobile-username {
            display: block;
        }

        .accumulated-points {
            margin-right: 0px !important;
        }

        .cont_text_info {
            position: relative;
            top: -20px;
            margin: 0 auto;
            width: 100%;
            height: auto;
            text-align: justify;
            font-size: 1.1em;
            color: #767676;
            line-height: 35px;
            margin-bottom: 20px;
        }

        .step_1 {
            margin-top: 0px;
            padding-top: 0px;
        }

        .step_3 {
            margin-top: -10px;
            padding-top: 0px;
        }

        .btn_verify_cp {
            margin-top: 10px;
        }

        .img-steps img {
            width: 18%;
            padding-top: 0px;
        }

        .img-steps {
            text-align: -webkit-center;
        }

        .position-right {
            justify-self: center;
            float: none;
        }

        .txt-subtitle-new {
            font-size: 43px !important;
        }

        .item-account {
            max-width: 120px;
            font-size: 10px;
            font-weight: 200 !important;
            min-height: 80px;
            font-family: 'Gotham-Book';
            padding-top: 20px;
        }

        .heading-section-log h2 {
            font-size: 58px;
        }

        .txt-center-vertical {
            right: 15px;
        }

        .option-menu {
            padding-top: 0px;
        }

        .txt-red-steps {
            padding-left: 2em;
            padding-right: 2em;
            text-align: center !important;
        }

        .img-steps {
            padding-top: 2px;
        }

        .img-access {
            width: 50%;
            place-self: anchor-center;
        }

        .card-edit-access {
            text-align: -webkit-center;
        }
    }

    @media screen and (max-width: 739px) {
        .img-redes {
            width: 20px;
        }

        .container {
            width: 700px !important;
        }

        .footermodal {
            padding-left: 10px;
            padding-right: 10px !important;
        }
    }

    @media screen and (max-width: 729px) {
        .img-redes {
            width: 25px;
        }
    }

    @media screen and (max-width: 711px) {

        .txt-center-vertical {
            right: 25px;
        }
    }

    @media screen and (max-width: 698px) {
        .heading-section-log h2 {
            font-size: 55px;
            padding: 20px;
        }

        .container {
            width: 640px !important;
        }

        .expiration-text {
            padding: 10px 120px !important;
        }

        .txt-center-vertical {
            right: 0px;
        }

        .img-redes {
            width: 20px;
        }
    }



    @media screen and (max-width: 667px) {
        .item-account {
            max-width: 115px;
        }
    }




    @media screen and (max-width: 642px) {
        .item-account {
            max-width: 110px;
        }

        .txt-center-vertical {
            right: 13px;
        }

        .container {
            width: 620px !important;
        }
    }


    @media screen and (max-width: 617px) {
        .item-account {
            max-width: 100px;
            font-size: 10px;
            padding-top: 17px;
        }

        .container {
            width: 600px !important;
        }
    }


    @media screen and (max-width: 612px) {

        .my-account-container {
            background-image: url(../images/home/DatosPersonalesFondo600.jpg);
        }

        .txt-subtitle-new {
            font-size: 45px !important;
        }

        #plasticCard {
            margin-right: 0px;
        }

        .heading-section-log h2 {
            font-size: 50px;
        }

        .heading-section-log h2 {
            font-size: 55px;
            padding: 20px;
        }

        .container {
            width: 580px !important;
        }

        .expiration-text {
            padding: 10px 90px !important;
        }

        .txt-center-vertical {
            right: 0px;
        }
        #BtnFilterMap{
            margin-top:20px;
        }
    }


    @media screen and (max-width: 575px) {
        a.toggle-menu {
            margin-right: 5px;
            margin-bottom: 22px;
        }

        a.toggle-login {
            margin-bottom: 22px;
        }

        #img_home img {
            padding-top: 27px;
        }

        .img-steps img {
            width: 30%;
            padding-top: 15px;
        }

        .txt-red-steps {
            font-size: 32px !important;
        }

        .container {
            width: 570px !important;
        }
    }

    @media screen and (max-width: 567px) {
        .item-account {
            max-width: 95px;
        }

        .heading-section-log h2 {
            font-size: 40px;
        }

        .container {
            width: 560px !important;
        }

        .reverse-button {
            width: 50px;
            right: -30px;
        }

        .front img, .back img {
            width: 90%;
        }

        .front, .back {
            max-width: 360px;
        }

        .my-card-number {
            bottom: -17%;
            font-size: 1.6em;
        }

        .cont-barcode img {
            max-width: 210px;
            margin: 0px 20%;
        }
        .space-register {
            margin-bottom: 30px !important;
        }
    }

    @media screen and (max-width: 557px) {
        .item-account {
            margin-left: 4px;
            margin-right: 4px;
        }

        .container {
            width: 550px !important;
        }

        .expiration-text {
            padding: 10px 70px !important;
        }

        .txt-center-vertical {
            position: relative;
            justify-self: right;
            background-color: transparent;
            padding-top: 10px;
            padding-right: 15px;
        }
    }

    @media screen and (max-width: 532px) {
        .item-account {
            max-width: 90px;
            border-radius: 13px;
        }

        .container {
            width: 520px !important;
        }

        .txt-benefits-details h2 {
            font-size: 42px !important;
        }
    }


    @media screen and (max-width: 530px) {
        .txt-subtitle-new {
            font-size: 45px !important;
        }
    }



    @media screen and (max-width: 517px) {
        .item-account {
            max-width: 80px;
            min-height: 95px;
        }

        .cont-logo img {
            width: 115px;
        }

        .account-logo img {
            width: 115px;
        }

        .container {
            width: 480px !important;
        }

        .expiration-text {
            padding: 10px 40px !important;
        }

        .str-filter-state, .str-filter-county {
            max-width: 200px;
        }

        .vaciotop {
            padding: 48px;
        }
    }

    @media screen and (max-width: 481px) {
        .cont-barcode {
            margin-top: -20px;
        }

            .cont-barcode img {
                width: 90%;
                max-width: 210px;
                margin: 10px 18%;
            }

        .my-card-number {
            font-size: 3.5vw;
            letter-spacing: 5px;
        }

        .txt-small {
            margin-left: 0px;
            font-size: 25px;
        }

        .container {
            width: 470px !important;
        }
    }

    @media screen and (max-width: 474px) {
        .heading-section-log h2 {
            font-size: 35px;
            padding: 15px;
        }

        .container {
            width: 460px !important;
        }
    }

    @media screen and (max-width: 467px) {
        .item-account {
            max-width: 75px;
        }

        .container {
            width: 460px !important;
        }
    }


    @media screen and (max-width: 464px) {
        .reverse-button {
            bottom: 0;
            top: 75px;
            right: -23px;
            width: 47px;
        }

        .cont-logo img {
            width: 112px;
        }

        .container {
            width: 450px !important;
        }

        .expiration-text {
            padding: 10px 20px !important;
        }

        .str-filter-state, .str-filter-county {
            max-width: 180px;
        }
    }

    @media screen and (max-width: 444px) {
        .txt-subtitle-new {
            font-size: 42px !important;
        }

        .item-account {
            max-width: 70px;
        }

        .cont-logo img {
            width: 120px;
            padding-left: 30px;
        }

        .option-menu {
            padding-top: 10px;
            margin-left: 2em;
        }

        .btn-activate {
            padding-top: 16px;
            text-align: right;
            padding-right: 28px;
        }

        .container {
            width: 420px !important;
        }

        .txt-benefits-details img {
            width: 50%;
        }

        .txt-red-steps {
            padding: 1em;
        }
    }

    @media screen and (max-width: 424px) {

        .front img, .back img {
            width: 80%;
        }

        .reverse-button {
            top: 62px;
            right: 0px;
        }

        .cont-barcode img {
            max-width: 203px;
            margin: 5px 12%;
        }
    }

    @media screen and (max-width: 417px) {

        .item-account {
            max-width: 65px;
        }

        .container {
            width: 410px !important;
        }

        .expiration-text {
            padding: 10px 0px !important;
        }

        .str-filter-state, .str-filter-county {
            max-width: 160px;
        }
    }


    @media screen and (max-width: 408px) {
        .txt-subtitle-new {
            font-size: 40px !important;
        }

        .heading-section-log h2 {
            font-size: 30px;
            padding: 12px;
        }

        .container {
            width: 400px !important;
        }
    }

@media screen and (max-width: 405px) {
    .btn-recover-space {
        margin-top: 25px;
    }
}
    @media screen and (max-width: 403px) {
   

        .checkbox {
            text-align: center;
        }

        .txt-small {
            margin-left: 0px;
            font-size: 25px;
        }
    }

    @media screen and (max-width: 400px) {
        .cont-barcode {
            margin-top: -30px;
        }

            .cont-barcode img {
                width: 70%;
            }
    }

    @media screen and (max-width: 396px) {

        .item-account {
            max-width: 65px;
            margin-left: 3px;
            margin-right: 3px;
        }

        .option-menu {
            /*margin-left: -9em;*/
        }

        .container {
            width: 380px !important;
        }

        .cont-barcode img {
            margin: 4px 10%;
        }

        .card-edit {
            letter-spacing: 1px;
        }
    }

    @media only screen and (max-width: 388px) {
        .box-balance {
            right: -55px;
        }

        .txt-small {
            font-size: 23px;
        }
    }

    @media screen and (max-width: 384px) {
        .heading-section-log h2 {
            font-size: 30px;
        }

        .container {
            width: 370px !important;
        }

        .cont-barcode img {
            margin: 4px 8%;
            max-width: 190px;
            width: 60%;
        }

        .waldi-txt {
            padding: 15px;
        }

        .container-fluid {
            padding-left: 0px;
        }
    }

    @media screen and (max-width: 376px) {

        .item-account {
            max-width: 65px;
            margin-left: 2px;
            margin-right: 2px;
        }

        .option-menu {
            margin-left: 1em;
        }

        .reverse-button {
            top: 50px;
        }

        .str-filter-state, .str-filter-county {
            max-width: 160px;
            display: flex;
            padding: 2px;
            min-width: 160px;
            margin-left: 102px;
        }
    }

    @media screen and (max-width: 366px) {

        .item-account {
            font-size: 8px;
            margin-left: 2px;
            margin-right: 2px;
        }

        .container {
            width: 360px !important;
        }

        .card-edit {
            font-size: 1.2em;
        }
    }

    @media screen and (max-width: 363px) {
        .txt-subtitle-new {
            font-size: 38px !important;
        }

        .item-account {
            margin-left: 1px;
            margin-right: 1px;
        }
    }

    @media screen and (max-width: 360px) {
        .cont-logo {
            max-width: 100% !important;
            flex: 0 0 100%;
        }

        .account-logo {
            max-width: 100% !important;
            flex: 0 0 100%;
        }

        .option-menu {
            width: 100% !important;
            max-width: 100% !important;
            flex: 0 0 100%;
            margin-left: -7em;
        }

        a.toggle-menu {
            margin-top: 0px;
            margin-right: 14px;
            margin-left: 10px;
        }

        a.toggle-login {
            margin-top: 0px;
        }

        .login-box {
            top: 145px;
        }

        .accumulated-points {
            margin-right: 0px !important;
        }

        .cont_text_info {
            position: relative;
            top: -20px;
            margin: 0 auto;
            width: 100%;
            height: auto;
            text-align: justify;
            font-size: 1.1em;
            color: #767676;
            line-height: 35px;
            margin-bottom: 20px;
        }

        .step_1 {
            margin-top: 0px !important;
            padding-top: 0px !important;
        }

        .clear-cb {
            height: 56px;
        }

        .clear-account {
            position: relative;
            float: left;
            width: 100%;
            height: 70px;
        }

        .cont-welcome-profile {
            top: 4px;
        }

        .clear-login-2 {
            height: 80px;
        }

        .txt-subtitle-new {
            font-size: 37px !important;
        }

        .container {
            width: 350px !important;
        }

        .funciona-main {
            padding-top: 0px;
        }

        .img-steps {
            padding-top: 0px;
        }

        .waldi-txt {
            padding: 15px;
        }
    }

    @media screen and (max-width: 353px) {
        .heading-section-log h2 {
            font-size: 27px;
        }

        .item-account {
            font-size: 8px;
            max-width: 60px;
        }

        .container {
            width: 340px !important;
        }

        .txt-small {
            font-size: 20px;
        }
    }

    @media screen and (max-width: 340px) {
        .txt-small {
            margin-left: 0px;
            font-size: 20px;
        }

        .txt-subtitle-new {
            font-size: 35px !important;
        }

        .option-menu {
            margin-left: -7em;
        }

        .container {
            width: 330px !important;
        }

        .str-filter-state, .str-filter-county {
            max-width: 160px;
            display: flex;
            padding: 2px;
            min-width: 160px;
            margin-left: 82px;
        }

        .cont-logo img {
            width: 90px;
            padding-left: 15px;
        }

        .account-logo img {
            width: 90px;
        }

        .waldi-txt {
            padding: 0px;
        }

        .txt-benefits-details h2 {
            font-size: 32px !important;
        }
    }

    @media screen and (max-width: 330px) {
        .txt-subtitle-new {
            font-size: 32px !important;
            padding-top: 60px;
        }

        .item-account {
            max-width: 58px;
        }

        .container {
            width: 320px !important;
        }

        .reverse-button {
            top: 50px;
        }

        .option-menu {
            margin-left: -6em;
        }

        .card-edit {
            font-size: 1.0em;
        }
    }

    @media screen and (max-width: 326px) {

        .heading-section-log h2 {
            font-size: 25px;
            padding: 8px;
        }

        .str-filter-state, .str-filter-county {
            max-width: 160px;
            display: flex;
            padding: 2px;
            min-width: 160px;
            margin-left: 72px;
        }
    }

    @media screen and (max-width: 323px) {
        .login-box {
            right: 0;
            left: 0;
            margin-left: auto;
            margin-right: auto;
        }

        .box-balance {
            top: 40px;
            right: -80px;
        }

            .box-balance img {
                width: 100%;
            }

        .option-menu {
            margin-left: -6em;
            padding-top: 10px;
        }

        .container {
            width: 305px !important;
        }

        .txt-benefits {
            font-size: 11px;
        }
    }



    @media screen and (max-width: 308px) {
        .txt-subtitle-new {
            font-size: 29px !important;
        }

        .option-menu {
            margin-left: -10em;
        }

        .container {
            width: 280px !important;
        }

        .str-filter-state, .str-filter-county {
            max-width: 160px;
            display: flex;
            padding: 2px;
            min-width: 160px;
            margin-left: 60px;
        }

        .txt-red-steps {
            padding-left: 0.51em;
        }
    }



    @media screen and (max-width: 304px) {
        .item-account {
            max-width: 50px;
            padding-top: 14px;
            border-radius: 12px;
            min-height: 65px;
        }

        .option-menu {
            margin-left: -5.9em;
        }

        .cont-logo img {
            width: 90px;
        }

        #btnActivate {
            font-size: 0.85em;
        }
    }

    @media screen and (max-width: 300px) {

        .heading-section-log h2 {
            font-size: 25px;
            padding: 3px;
        }
    }

    @media screen and (max-width: 290px) {

        .cont-logo img {
            width: 84px;
        }

        .account-logo img {
            width: 84px;
        }

        .txt-small {
            margin-left: 0px;
            font-size: 18px;
        }


        .txt-subtitle-new {
            font-size: 20px !important;
        }

        .space-movil {
            padding-top: 170px;
        }

        .option-menu {
            /*margin-left: -10em;*/
        }

        #btnActivate {
            font-size: 0.8em;
        }

        .vaciotop {
            padding: 36px;
        }

        .txt-benefits-details h2 {
            font-size: 32px !important;
        }

        .txt-benefits-details img {
            width: 50%;
        }

        .txt-center-vertical {
            justify-self: center;
            background-color: transparent;
        }

        .clear {
            height: 30px;
        }

        .card-edit {
            font-size: 0.81em;
        }

        .cont-barcode img {
            margin: 4px 13%;
            max-width: 190px;
            width: 55% 129.25px;
        }

        .heading-section {
            margin-bottom: 10px;
            margin-top: 10px;
        }
    }

    @media screen and (max-width: 290px) {

        .option-menu {
            margin-left: -5.9em;
        }
    }

    @media screen and (max-width: 277px) {
        .option-menu {
            margin-left: -7.9em;
        }
    }

    .txt-pop-datos {
        padding: 50px;
        padding-left: 150px;
        padding-right: 150px;
        font-size: xx-large;
        font-weight: bold !important;
        text-align: center !important;
    }

    .control-label-reg {
        padding-top: 7px;
        margin-bottom: 0;
        text-align: left;
        font-size: 16px;
        font-family: 'Gotham-Book';
    }

    .control-label-reg-check {
        text-align: left;
        font-size: 16px;
        font-family: 'Gotham-Book';
        display: inline-flex;
        align-items: center
    }



    .control-label-reg-note {
        margin-bottom: 0;
        text-align: left;
        font-size: 16px;
        font-family: 'Gotham-Book';
        color: #666;
    }

    .gender-items {
        padding-top: 7px;
        margin-bottom: 0;
        text-align: left;
        font-size: 16px;
        font-family: 'Gotham-Book';
        padding-left: 30px;
    }

    .items-gender-space label {
        margin-right: 5px;
        padding-left: 0px;
    }

    .tyc-txt {
        font-size: 1.2em;
    }

    .boton-login-pop {
        color: white;
        text-align: center;
        margin-top: 10px;
        background-color: #bf7e25;
        border-radius: 3px;
        font-weight: 100;
        font-size: 1.1em;
        border: none;
        padding: 10px;
    }


    .main_loader {
        position: fixed;
        top: 0px;
        left: 0px;
        right: 0px;
        width: 100%;
        height: 100%;
        text-align: center;
        z-index: 1000;
        display: none;
    }

    .loader-bg {
        position: absolute;
        top: 0px;
        left: 0px;
        right: 0px;
        width: 100%;
        height: 100%;
        background-color: #fff;
        opacity: 0.9;
    }

    .loader {
        position: relative;
        margin: 0 auto;
        top: 38%;
        max-width: 320px;
        width: 100%;
        padding: 1px 20px;
    }

        .loader img {
            position: relative;
            margin: 0 auto;
            width: 100%;
            max-width: 130px;
        }

