@media only screen and (max-width: 1110px){
    #auth_obc {
        min-width: 300px;
    }
    .campo-form.res_op {
        width: 245px;
    }
    .disclaimers_slide{
        text-align: center;
        padding-left: 0;
    }
    #obc_popup_terms input[type="checkbox"]{
        vertical-align: top;
        top: 0;
    }
    .obc_legal_text span{
        width: 90%;
    }
}
@media only screen and (max-width: 1080px){
    .obc_popup_wrapper .obc_popup_white{
        width: 90% !important;
    }
    .rgt_cuenta .copy{
        position: initial;
    }
    .campo-form.res_op {
        width: 235px;
    }
}
@media only screen and (min-width: 480px) and (max-width: 810px){
    .inicio input:not([type="checkbox"]){
        width: 100% !important;
    }
    .campo-form.res_op {
        width: 70% !important;
    }
    .campo-form.op {
        width: 25% !important;
    }
    .rgt_cuenta {
        height: 30vh !important;
        background-position: 100% top !important;
        max-width: 100% !important;
        background-size: 50% !important;
    }
    .rgt_cuenta .copy{
        bottom: inherit !important;
        width: 70% !important;
        top: 15% !important;
    }
}
@media only screen and (max-width: 1024px){
    .intro-section {
        margin-left: 4.5rem;
    }
    .benefits-section {
        padding: 0 20px;
        margin: 35px;
    }
    .campo-form.op {
        width: 29.4% !important;
    }
    .campo-form.res_op {
        width: 69%;
    }
    #auth_obc{
        box-sizing: border-box;
        transform: scale(1);
        width: 100%;
        max-width: 100%;
        right: initial;
        top: 690px;
    }
    .inicio{
        padding-bottom: 50px;
    }
    .leave {
        top: 22%;
    }
    .disclaimers{
        padding-bottom: 340px !important;
    }
    .landing-img-container{
        background-position: center top !important;
        background-size: 1500px !important;
    }
    .bgblkgradient {
        padding: 100px;
        margin: 0 auto;
        width: 100%;
        text-align: center;
        position: relative;
        top: -100px;
        background: linear-gradient(180deg, rgba(241, 241, 241, 0) 3%, rgba(0, 0, 0, .7) 59%);
    }
    .bgblkgradient span {
        max-width: 100%;
    }
}
@media only screen and (max-width: 820px){
    .landing-img-container {
        background-size: 1300px !important;
    }
    #auth_obc{
        top: 590px;
    }
    .text-container {
        width: 100%;
    }
}
@media only screen and (max-width: 810px){
    .obc_popup_title {
        margin: 30px 45px !important;
    }
}

@media only screen and (max-width: 430px){
}
@media only screen and (max-width: 390px){
    #card-name {
        left: 30px !important;
    }
}
@media only screen and (max-width: 375px){
}
@media only screen and (max-width: 350px){

}
@media only screen and (max-width: 340px){
    .logo img {
        max-width: 160px;
    }
}
@media only screen and (max-width: 320px){
    .field {
        width: 92%;
    }
}
@media only screen and (max-width: 300px){
    input:not([type="checkbox"]){
        width: 83% !important;
    }
}
@media only screen and (max-width: 640px) {
    .obc_popup_title{
        margin: 30px 45px !important;
    }
    .obc_popup_title h2{
        font-size: 19px;
    }
    .obc_lock_icon{
        display: none;
    }
    .disclaimers_slide{
        padding-bottom: 160px;
        padding-left: 0px;
        text-align: center;
    }
    #obc_popup_terms{
        overflow-y: scroll;
    }
    .obc_column{
        margin-bottom: 0 !important;
    }
    .obc_legal_text{
        padding: 12px 35px !important;
    }
    .obc_legal_text span{
        font-size: 12px;
        width: 90%;
    }
    .obc_legal_actions_gray{
        position: fixed;
        width: 100%;
        bottom: 0;
        left: 0;
    }
    .obc_popup_title {
        margin: 30px 30% 0 15px;
    }
    .obc_popup_terms .obc_popup_white {
        width: 100% !important;
        height: inherit !important;
    }
    .dwl_terms{
        margin: auto !important;
    }
    #auth_obc {
        transform: scale(1);
        position: relative;
        left: 0;
        top: 0;
        border-radius: 0;
        max-width: 100%;
    }
    .landing-img-container {
        background-size: cover;
        align-items: center;
        padding: 0;
        text-align: center;
        justify-content: end;
        height: 500px;
        min-height: 500px;
    }
    .bgblkgradient {
        background: linear-gradient(180deg, rgba(241, 241, 241, 0) 3%, rgba(0, 0, 0, .7) 59%);
        width: 100%;
        padding: 25px;
        position: initial;
        text-align: center;
        margin: 0;
    }
    .bgblkgradient span {
        max-width: 100%;
    }
    .titulo-grande {
        margin-bottom: 5px;
        font-size: 25px;
    }
    .subtitulo {
        font-size: 18px;
        line-height: 20px;
        margin-top: 0;
    }
}
@media only screen and (min-width: 750px) and (max-width: 820px){
    .orng_gradient {
        padding-bottom: 15% !important;
    }
    .campo-form.op{
        width: 29.4% !important;
    }
}
@supports (-webkit-touch-callout: none) {
    /* CSS specific to iOS devices */
    @media only screen and (max-width: 500px){}
}
@supports not (-webkit-touch-callout: none) {
    /* CSS for other than iOS devices */
    @media only screen and (max-width: 500px){
        #fecha-pago .btn-regresar i,#contrato .btn-regresar i{
            margin-right: 4px !important;
        }
    }
}
@media only screen and (max-width: 500px){
    .details-wrapper .comment-text{
        margin-left: -20px !important;
    }
    .toggle-button {
        left: 82.5% !important;
    }
    .banner_cierre .img-center {
        width: 165px;
        margin-top: -80px;
    }
    .confetti{
        top: -15px !important;
    }
    .tarjetas-img-section{
        transform: scale(1.4);
        margin: 68px auto;
        margin-left: -25px;
    }
    #cierre .content{
        overflow-x: hidden;
    }
    .holder-name-section {
        margin-bottom: 23px !important;
    }
    p.holder-name{
        font-size: 7px !important;
        margin: -7px auto;
    }
    #card-name {
        font-size: 11px;
        top: 125px;
        left: 50px;
        padding: 5px;
    }
    .card-container img{
        width: 400px;
        max-width: 400px;
    }
    .name-overlay{
        top: 87px;
        left: 90px;
    }
    input[type="checkbox"] {
        width: 52px;
        height: 22px;
        margin-right: 0;
    }
    .btn-regresar{
        color: transparent;
    }
    .btn.btn-regresar i.fas{
        color: var(--secondary-color);
        margin-right: -10px !important;
        z-index: 1;
    }
    .btn-regresar:hover{
        color: transparent;
    }
    .btn-regresar:hover i{
        color: white !important;
    }
    .rates-section img {
        margin-top: 0;
    }
    .intro-section {
        margin: auto;
    }
    .image-container {
        margin-top: 0;
    }
    #valida-id .content-container, #valida-id .content-container-sub {
        width: 85%;
    }
    #valida-id .text-container {
        margin-bottom: 15px;
    }
    h1{
        margin-top: 30px;
    }
    #valida-id h1{
        font-weight: 600;
    }
    #valida-id p, #valida-id .instructions li{
        font-size: 17px;
    }
    .instructions li {
        line-height: 21px;
        margin: 13px auto;
    }
    h1 {
        line-height: 33px;
    }
    #auth_obc .form{
        transform: scale(.94);
    }
    .logo img {
        margin: 0 25px !important;
        max-width: 180px !important;
        float: left;
    }
    .leave {
        padding: 4px 10px;
        top: 22%;
    }
    .name-enterprise{
        text-align: center;
    }
    #welcome .name-enterprise{
        margin-top: 20px;
        font-size: 18px;
    }
    .name-rep-legal.welcome-name{
        font-weight: 700;
    }
    .card-cupo{
        font-size: 28px;
        font-weight: lighter;
    }
    .card-cupo span{
        font-weight: 700;
    }
    .intro-section .text .text-two-lines{
        min-width: 100%;
    }
    .btn-primary.comenzar.btn_large{
        max-width: 304px;
        margin-bottom: 65px;
    }
    .cta-section h2 strong{
        -webkit-text-stroke: .5px white;
    }
    .comenzar{
        font-family: 'Open Sans';
        font-weight: 700;
        width: 100%;
        padding: 11px 0 !important;
    }
    .benefits-section {
        margin: 30px auto !important;
    }
    .benefits-section h2:first-child{
        text-align: center;
    }
    .rates-section{
        left: initial !important;
    }
    .rates-text p {
        text-align: center;
        max-width: 65%;
        margin: 0 auto 10px;
    }
    #auth_obc{
        box-sizing: border-box;
        padding: 30px 15px;
    }
    .obc_popup_white {
        padding: 40px 10px !important;
    }
    .content_modal{
        margin: 20px 25px 0 25px !important;
    }
    .content_modal h2 {
        line-height: 22px;
    }
    .rates-section img {
        height: auto !important;
        margin-top: -100px;
    }
    .rates-section{
        margin-top: 90px;
    }
    .benefits-section .item h3{
        font-size: 21px;
        line-height: 20px;
    }
    #fecha-pago .fa-solid{
        position: relative;
        top: 5px;
    }
    .payment-card-content {
        gap: 70px;
        padding: 17px 30px;
    }
    .payment-card-header {
        padding: 20px 30px;
    }
    #contrato .tarjeta-frontal{
        margin-left: 65px;
        margin-top: 15px;
    }
    #cierre .steps-container{
        display: none;
    }
    .confetti{
        top: 20px !important;
        right: 35px !important;
    }
    .row-name-congrats{
        max-width: 75%;
    }
    .details-content div{
        padding: 12px 20px;
    }
    .details-content div:last-child{
        border-bottom: 0;
    }
    .details-content {
        margin-top: 0;
    }
    #cierre .summary-card-section{
        padding: 30px 20px;
    }
    .banner_cierre{
        margin: 25px;
    }
    .finish{
        max-width: 304px;
        margin: 60px auto;
    }
}