@font-face {
    font-family: 'Basis Grotesque Pro';
    src: url('../font/BasisGrotesquePro-Bold.eot');
    src: url('../font/BasisGrotesquePro-Bold.eot?#iefix') format('embedded-opentype'), url('../font/BasisGrotesquePro-Bold.woff2') format('woff2'), url('../font/BasisGrotesquePro-Bold.woff') format('woff'), url('../font/BasisGrotesquePro-Bold.ttf') format('truetype'), url('../font/BasisGrotesquePro-Bold.svg#BasisGrotesquePro-Bold') format('svg');
    font-weight: bold;
    font-style: normal
}

@font-face {
    font-family: 'Basis Grotesque Pro';
    src: url('../font/BasisGrotesquePro-Regular.eot');
    src: url('../font/BasisGrotesquePro-Regular.eot?#iefix') format('embedded-opentype'), url('../font/BasisGrotesquePro-Regular.woff2') format('woff2'), url('../font/BasisGrotesquePro-Regular.woff') format('woff'), url('../font/BasisGrotesquePro-Regular.ttf') format('truetype'), url('../font/BasisGrotesquePro-Regular.svg#BasisGrotesquePro-Regular') format('svg');
    font-weight: normal;
    font-style: normal
}

@font-face {
    font-family: 'Basis Grotesque Pro';
    src: url('../font/BasisGrotesquePro-Light.eot');
    src: url('../font/BasisGrotesquePro-Light.eot?#iefix') format('embedded-opentype'), url('../font/BasisGrotesquePro-Light.woff2') format('woff2'), url('../font/BasisGrotesquePro-Light.woff') format('woff'), url('../font/BasisGrotesquePro-Light.ttf') format('truetype'), url('../font/BasisGrotesquePro-Light.svg#BasisGrotesquePro-Light') format('svg');
    font-weight: 300;
    font-style: normal
}

@font-face {
    font-family: 'BarlowSemiCondensed Regular';
    src: url('../font/BarlowSemiCondensed-Regular.ttf');
    font-weight: 100;
    font-style: normal
}

@font-face {
    font-family: 'BarlowSemiCondensed Bold';
    src: url('../font/BarlowSemiCondensed-Bold.ttf');
    font-style: normal
}

@font-face {
    font-family: 'Poppins ExtraBold';
    src: url('../font/Poppins-ExtraBold.otf');
    font-style: normal
}

@font-face {
    font-family: 'BarlowSemiCondensed Medium';
    src: url('../font/BarlowSemiCondensed-Medium.ttf');
    font-style: normal
}

.alert {
    margin-bottom: 5px;
    border-radius: 1px;
    font-family: 'BarlowSemiCondensed Regular';
    font-size: 14px
}

.alertUpdate {
    margin-bottom: 5px;
    border-radius: 1px
}

.alert-warning {
    background-color: #fff;
    border-color: #fff;
    color: #363636
}

.alert-error {
    background-color: #f6e1e8;
    border-color: #c00;
    color: #333
}

.alert-info {
    background-color: #e0f2fe;
    border-color: #39acf9;
    color: #185f9e;
    font-family: 'BarlowSemiCondensed Regular';
    font-size: 13px
}

.pficon-infoP {
    background-image: url(../img/info.gif);
    background-repeat: no-repeat;
    position: relative
}

#kc-locale ul {
    display: none;
    position: absolute;
    background-color: #fff;
    list-style: none;
    right: 0;
    top: 20px;
    min-width: 100px;
    padding: 2px 0;
    border: solid 1px #bbb
}

#kc-locale:hover ul {
    display: block;
    margin: 0
}

a {
    text-decoration: none !important
}

#kc-locale ul li a {
    display: block;
    padding: 5px 14px;
    color: #000 !important;
    text-decoration: none;
    line-height: 20px
}

#kc-locale ul li a:hover {
    color: #4d5258;
    background-color: #d4edfa
}

#kc-locale-dropdown a {
    color: #4d5258;
    background: 0;
    padding: 0 15px 0 0;
    font-weight: 300
}

#kc-locale-dropdown a:hover {
    text-decoration: none
}

a#kc-current-locale-link {
    display: block;
    padding: 0 5px
}

a#kc-current-locale-link::after {
    content: "\2c5";
    margin-left: 4px
}

.login-pf .container {
    padding-top: 40px
}

.login-pf a, .login-pf a:hover {
    color: #a30000
}

#kc-logo {
    width: 100%
}

#kc-logo-wrapper {
    background-image: url(../img/keycloak-logo-2.png);
    background-repeat: no-repeat;
    height: 63px;
    width: 300px;
    margin: 62px auto 0
}

div.kc-logo-text {
    background-image: url(../img/keycloak-logo-text.png);
    background-repeat: no-repeat;
    height: 63px;
    width: 300px;
    margin: 0 auto
}

div.kc-logo-text span {
    display: none
}

#kc-header {
    color: #a30000;
    overflow: visible;
    white-space: nowrap
}

#kc-content {
    width: 100%
}

#kc-info {
    padding-bottom: 150px;
    margin-bottom: -150px
}

#kc-info-wrapper {
    font-size: 13px
}

#kc-form-options span {
    display: block
}

#kc-form-options .checkbox {
    margin-top: 0;
    color: #72767b
}

#kc-terms-text {
    margin-bottom: 5px;
    text-align: center;
    font-size: 14px;
    font-weight: 700
}

#kc-registration {
    margin-bottom: 15px
}

ol#kc-totp-settings {
    margin: 0;
    padding-left: 20px
}

ul#kc-totp-supported-apps {
    margin-bottom: 10px
}

#kc-totp-secret-qr-code {
    max-width: 150px;
    max-height: 150px
}

#kc-totp-secret-key {
    background-color: #fff;
    color: #333;
    font-size: 16px;
    padding: 10px 0
}

#kc-oauth h3 {
    margin-top: 0
}

#kc-oauth ul {
    list-style: none;
    padding: 0;
    margin: 0
}

#kc-oauth ul li {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 12px;
    padding: 10px 0
}

#kc-oauth ul li:first-of-type {
    border-top: 0
}

#kc-oauth .kc-role {
    display: inline-block;
    width: 50%
}

#kc-code textarea {
    width: 100%;
    height: 8em
}

#kc-social-providers ul {
    padding: 0
}

#kc-social-providers li {
    display: block
}

#kc-social-providers li:first-of-type {
    margin-top: 0
}

.zocial, a.zocial {
    width: 100%;
    font-weight: normal;
    font-size: 14px;
    text-shadow: none;
    border: 0;
    background: #f5f5f5;
    color: #72767b;
    border-radius: 0;
    white-space: normal
}

.zocial:before {
    border-right: 0;
    margin-right: 0
}

.zocial span:before {
    padding: 7px 10px;
    font-size: 14px
}

.zocial:hover {
    background: #ededed !important
}

.zocial.facebook, .zocial.github, .zocial.google, .zocial.microsoft, .zocial.stackoverflow, .zocial.linkedin, .zocial.twitter {
    background-image: none;
    border: 0;
    box-shadow: none;
    text-shadow: none
}

.zocial.microsoft:before {
    content: "\f15d"
}

.zocial.stackoverflow:before {
    color: inherit
}

.btn {
    border: 0;
    border-radius: 5px;
    padding: 8px 0;
    box-shadow: none;
    margin-top: 30px;
    text-shadow: none;
    outline: 0;
    font-weight: 800;
    font-size: 12px;
    width: 40% !important;
    text-transform: uppercase
}

.card-pf form.form-actions .btn {
    float: right;
    margin-left: 10px
}

#kc-form-buttons {
    margin-top: 0;
    display: block !important;
    text-align: -webkit-center
}

.alignSection {
    text-align: center
}

.btnLogin {
    color: white;
    background: #e7272c;
    border: 0;
    border-radius: 5px;
    padding: 4px 0;
    box-shadow: none;
    margin-bottom: 10px;
    text-shadow: none;
    outline: 0;
    font-weight: 800;
    font-size: 14px;
    width: 50% !important;
    text-transform: uppercase;
    font-family: "BarlowSemiCondensed Bold";
    z-index: 9999
}

.btnLogin:hover {
    background: #a30000
}

.arrowSvg {
    display: inline !important;
    color: #216ea5;
    width: 16px;
    height: 16px;
    position: absolute;
    margin-left: 5px;
    margin-top: 3px
}

.login-pf-page .login-pf-brand {
    margin-top: 20px;
    max-width: 360px;
    width: 40%
}

#kc-page-title {
    background: url('../img/logo-cf.webp');
    background-size: 190px;
    background-repeat: no-repeat;
    background-position: center;
    display: block;
    height: 90px;
    text-indent: -99999em;
    overflow: hidden;
    margin-top: 15%
}

#kc-page-title2 {
    background: url('../img/logo-cf.webp');
    background-size: 190px;
    background-repeat: no-repeat;
    background-position: center;
    display: block;
    height: 90px;
    text-indent: -99999em;
    overflow: hidden;
    margin-top: 15%
}

#kc-page-title3 {
    background: url('../img/logo-cf.webp');
    background-size: 190px;
    background-repeat: no-repeat;
    background-position: center;
    display: block;
    height: 90px;
    text-indent: -99999em;
    overflow: hidden;
    margin-top: 0
}

.card-pf {
    background-color: #fff;
    background: url(../img/header_bg.jpg);
    background-size: contain;
    color: black;
    height: 100%;
    margin: 0 !important;
    border-bottom: 6px solid #ec3e42
}

.card-pf form {
    background: 0;
    border: 0;
    margin: 20px 5px;
    border-radius: 0;
    box-shadow: none;
    outline: 0;
    color: #fff !important
}

.login-pf-page .login-pf-signup {
    font-size: 15px;
    color: #72867b
}

#kc-content-wrapper .row {
    margin-left: 0;
    margin-right: 0
}

.login-pf-page .login-pf-social-link {
    margin-bottom: 25px
}

.login-pf-page .login-pf-social-link a {
    padding: 2px 0
}

.login-pf-page.login-pf-page-accounts {
    margin-left: auto;
    margin-right: auto
}

.login-pf-page .btn-primary {
    margin-top: 0;
    background: #e0262b;
    outline: 0
}

.btn-default {
    background: #7e7e80;
    outline: 0;
    color: white
}

.btn-default:hover {
    background: #525253;
    color: white
}

form .btn-primary:hover, form .btn-danger:active {
    background: #a30000 !important;
    outline: 0
}

.login-pf-page .login-pf-header {
    margin-top: 0;
    margin-bottom: 0
}

.input-group-icon {
    width: 16px;
    height: 16px;
    position: absolute;
    padding-top: 8px;
    margin-left: 5px;
    padding-bottom: 8px
}

.login-pf body {
    font-family: 'BarlowSemiCondensed Regular' !important;
    background: #414042;
    font-size: 14px
}

body .form-group.login-pf-settings {
    justify-content: right;
    text-align-last: center
}

form .btn-danger {
    background: #e7272c
}

.btn-danger:hover {
    background-color: #a30000 !important
}

form .btn-primary:hover, form .btn-danger:active {
    background: #a30000 !important;
    outline: 0
}

.btn-danger:focus {
    background-color: #a30000 !important
}

form .btn-primary:hover, form .btn-danger:active {
    background: #a30000 !important;
    outline: 0
}

.btn-danger:focus {
    background-color: #a30000 !important
}

.form-group.login-pf-settings a {
    color: black;
    font-size: 14px;
    font-family: "BarlowSemiCondensed Medium"
}

.form-control {
    background: white;
    border: 0;
    border-bottom: 1px solid #b3b3b3;
    padding: 0 5px 10px 28px;
    border-radius: 5px;
    box-shadow: none;
    outline: 0;
    color: #333e48 !important
}

.form-control:focus {
    box-shadow: none
}

input::placeholder {
    color: #b3b6ba !important;
    font-size: 1em;
    font-style: normal !important
}

.form-group .form-control {
    font-size: 1.2em;
    padding-top: 5%;
    padding-bottom: 5%;
    height: 30px
}

input#kc-refresh {
    background-image: url(../img/refresh-16.ico);
    background-repeat: no-repeat;
    height: 15px;
    width: 30px;
    background-position: center;
    background-color: transparent;
    border-width: 0
}

input#kc-refresh:focus {
    outline-color: white
}

input#kc-showPassword {
    background-image: url(../img/ojo.png);
    background-repeat: no-repeat;
    height: 15px;
    width: 30px;
    background-position: center;
    background-color: transparent;
    border-width: 0
}

input#kc-showPassword:focus {
    outline-color: white
}

input#kc-hidePassword {
    background-image: url(../img/ojo_close.png);
    background-repeat: no-repeat;
    height: 15px;
    width: 30px;
    background-position: center;
    background-color: transparent;
    border-width: 0
}

input#kc-hidePassword:focus {
    outline-color: white
}

.textoAzul11 {
    font-family: Verdana, Arial, Helvetica;
    font-size: 11px;
    color: #036
}

.contenedor {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    height: 100vh
}

.footer-column {
    padding-top: 5px;
    padding-left: 0 !important;
    padding-right: 0 !important
}

.col-uno {
    background: white;
    background-size: cover;
    width: 70%
}

.col-dos {
    width: 30%
}

.slide {
    position: relative;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.64);
    margin-top: 0
}

.slide-inner {
    position: relative;
    overflow: hidden;
    width: 100%
}

.slide-open:checked + .slide-item {
    position: static;
    opacity: 100
}

.slide-item {
    position: absolute;
    opacity: 0;
    -webkit-transition: opacity .6s ease-out;
    transition: opacity .6s ease-out
}

.slide-item img {
    display: block;
    height: 100vh;
    max-width: 100%
}

.slide-control {
    background: rgba(0, 0, 0, 0.28);
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: none;
    font-size: 40px;
    height: 40px;
    line-height: 35px;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    cursor: pointer;
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    text-align: center;
    width: 40px;
    z-index: 10
}

.slide-control.prev {
    left: 2%
}

.slide-control.next {
    right: 2%
}

.slide-control:hover {
    background: rgba(0, 0, 0, 0.8);
    color: #aaa
}

#slide-1:checked ~ .control-1, #slide-2:checked ~ .control-2, #slide-3:checked ~ .control-3 {
    display: block
}

.slide-indicador {
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    bottom: 2%;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 10
}

.slide-indicador li {
    display: inline-block;
    margin: 0 5px
}

.slide-circulo {
    color: #828282;
    cursor: pointer;
    display: block;
    font-size: 35px
}

.slide-circulo:hover {
    color: #aaa
}

#slide-1:checked ~ .control-1 ~ .slide-indicador li:nth-child(1) .slide-circulo, #slide-2:checked ~ .control-2 ~ .slide-indicador li:nth-child(2) .slide-circulo, #slide-3:checked ~ .control-3 ~ .slide-indicador li:nth-child(3) .slide-circulo {
    color: #428bca
}

#titulo {
    width: 100%;
    position: absolute;
    padding: 0;
    margin: 0 auto;
    text-align: center;
    font-size: 27px;
    color: rgba(255, 255, 255, 1);
    font-family: 'Open Sans', sans-serif;
    z-index: 9999;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.33), -1px 0 2px rgba(255, 255, 255, 0)
}

.subTitle {
    margin-top: -10px;
    text-align: center;
    font-weight: 800 !important;
    font-size: 22px;
    font-family: "Poppins ExtraBold";
    color: black
}

.subTitle span {
    color: #e7272c
}

.textParagraph {
    font-size: 14px;
    text-align: center;
    padding: 0 28px;
    line-height: 1.2;
    font-family: "BarlowSemiCondensed Regular";
    color: black
}

.textParagraph span {
    color: #e7272c
}

.labelsForm {
    color: black;
    font-size: 12px;
    text-transform: uppercase;
    margin-bottom: 2px;
    margin-top: 0;
    font-family: "BarlowSemiCondensed Regular";
    font-size: 14px
}

.labelsFormUpdate {
    color: black;
    font-size: 12px;
    text-transform: uppercase;
    margin-bottom: 2px;
    margin-top: 0;
    margin-left: 20px;
    font-family: "BarlowSemiCondensed Regular";
    font-size: 14px
}

.alignArrow {
    margin-right: 20px
}

.msgFooter {
    position: absolute;
    bottom: 8px;
    width: 28%;
    text-align: center;
    font-family: "BarlowSemiCondensed Regular";
    font-size: 15px;
    color: #d1d3d4;
    font-weight: 700
}

.fixedPos {
    position: absolute;
    bottom: 8px;
    width: 28%;
    text-align: center;
    font-family: "BarlowSemiCondensed Regular";
    font-size: 15px;
    color: #d1d3d4;
    font-weight: 700
}

.sectionRecovery {
    text-align: center
}

.goBack {
    margin-bottom: 10px;
    font-weight: 600
}

.rem {
    color: #fff
}

.form-buttons-t {
    display: flex;
    justify-content: center
}

.form-group {
    margin-bottom: 10px !important
}

.marginReCaptcha {
    margin-bottom: 3px;
    text-align: center;
    display: flex;
    align-content: center;
    justify-content: center
}

.text-terms {
    margin-top: -8px;
    border: solid 2px #423e3e;
    background: white;
    color: #000;
    padding: 4px;
    height: 230px;
    overflow: auto;
    font-family: 'BarlowSemiCondensed Regular'
}

#kc-terms-text p {
    margin: 0 !important;
    padding: 0 !important;
    font-family: 'BarlowSemiCondensed Bold'
}

.btnTerms {
    border: 0;
    border-radius: 5px;
    padding: 4px 0;
    box-shadow: none;
    margin-top: 10px;
    text-shadow: none;
    outline: 0;
    font-weight: 800;
    font-size: 14px;
    width: 40% !important;
    text-transform: uppercase;
    margin-right: 10px;
    font-family: "BarlowSemiCondensed Bold"
}

@media (max-width: 759px) {
    .contenedor {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap
    }

    .col-uno {
        background: #fff;
        background-size: cover;
        width: 70%;
        display: none
    }

    .col-dos {
        width: 100%
    }

    .msgFooter {
        position: relative;
        width: 100%;
        margin: 0;
        padding-left: 25px;
        padding-right: 25px;
        text-align: center
    }

    .fixedPos {
        position: relative;
        width: 100%;
        margin: 0;
        padding-left: 25px;
        padding-right: 25px;
        text-align: center
    }

    .card-pf {
        background: url(../img/header_bg.jpg);
        background-size: contain;
        padding: 0 10px;
        border-radius: 0;
        margin: 0 !important;
        color: black;
        box-shadow: none !important;
        height: 100%;
        margin: 0 !important;
        border-bottom: 6px solid #ec3e42
    }
}

@media (max-height: 685px) {
    .msgFooter {
        position: relative;
        width: 100%;
        margin: 0;
        padding-left: 25px;
        padding-right: 25px;
        text-align: center
    }
}

@media (max-height: 681px) {
    .fixedPos {
        position: relative;
        width: 100%;
        margin: 0;
        padding-left: 25px;
        padding-right: 25px;
        text-align: center
    }
}

.msgFooterOtp {
    position: relative;
    width: 100%;
    margin: 0;
    padding-left: 25px;
    padding-right: 25px;
    text-align: center;
    color: #fff
}

.carousel {
    margin: 0 auto;
    display: flex
}

#imgFooter {
    background: #475d62 url(../img/logo-footer.png)
}

#imagen {
    width: 100%;
    height: 45vh;
    background-size: cover;
    z-index: 999
}

#imagenFondo {
    width: 100%;
    height: 100vh;
    background-size: cover
}

.qrStyle {
    text-align: center;
    margin-left: -25px
}

.btnSendOtp {
    text-align: center
}

.formOtp {
    margin-top: -8px;
    padding-left: 15px;
    padding-right: 15px
}

a.link {
    color: #e7272c !important;
    font-weight: 600;
    box-shadow: none !important
}

.container-scroll {
    background-color: white;
    display: flex;
    margin-top: 30px;
    margin-left: 20px;
    margin-right: 20px
}

.container-scroll .col {
    width: 100%;
    padding-left: 25px;
    padding-right: 25px
}

.text {
    margin-left: 15px;
    margin-right: 15px
}

.text h3 {
    font-family: arial;
    color: #ec0d17 !important;
    text-align: left;
    font-size: 16px;
    font-weight: 700;
    margin: 40px 0 15px 0 !important;
    text-decoration: none
}

a.nav-link.ingressOption {
    text-decoration: none !important;
    font-family: Arial, Helvetica, sans-serif !important;
    color: #7e7c7c !important;
    font-weight: 700
}

.imagen-individual {
    text-align: center
}

.elements-footer {
    display: flex;
    align-items: center;
    margin-left: 20px
}

.text-footer {
    padding-left: 20px
}

.text-footer p {
    margin: 0
}

.footer {
    position: absolute;
    bottom: 0;
    background: #e6e6e6;
    width: 70%;
    border-bottom: 6px solid #ec3e42
}

.img-footer {
    padding: 5px;
    padding-right: 10px
}

.description {
    position: absolute;
    left: 50px;
    display: inline;
    z-index: 9999;
    color: white;
    width: 320px;
    background-color: rgb(0 0 0 / 35%);
    height: 45%;
    display: flex;
    align-items: end;
    padding: 15px;
    flex-wrap: wrap;
    align-content: flex-end
}

h2.text-description {
    font-size: 18px;
    margin-top: 0
}

h1#title {
    margin-bottom: 5px;
    font-size: 20px;
    font-weight: bolder
}

#loadSession {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #0000007a;
    height: 100vh;
    width: 100%;
    margin: 0 !important;
    z-index: 9999999
}

.alertLogin {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: white;
    width: 290px;
    box-shadow: 0 3px 5px 1px rgba(0, 0, 0, 0.1);
    border: solid 6px #e7eded
}

.alertHeader {
    background: #142831;
    color: white;
    border-bottom-color: black;
    padding: 2px;
    font-weight: 600;
    font-size: 16px;
    background: #ec0d17;
    padding-left: 10px
}

.alertHeader p {
    margin: 0 5px 0 0;
    display: flex;
    justify-content: space-between
}

.alertBody {
    font-family: 'Open Sans', sans-serif !important;
    font-size: 12px;
    font-weight: 500;
    color: black;
    padding: 5px 15px;
    color: #797b7c;
    max-height: 70vh;
    overflow: auto
}

.alertBody span {
    color: #1e02b7;
    font-weight: bold;
    font-size: 14px
}

.alertBody p {
    color: black
}

.alertBody label {
    width: 45px !important
}

.textHead {
    color: #000;
    font-size: 14px;
    text-decoration: none
}

.alertFooter {
    margin-bottom: 8px !important
}

.alertFooter input#textBtnAccept {
    background: beige;
    color: #eb0c17;
    padding: 0 10px;
    font-size: 12px
}

.btn-accept {
    border-radius: 50px;
    padding: 1px 5px;
    box-shadow: none;
    font-weight: 800;
    font-size: 10px;
    margin: 0;
    display: inline-block;
    border-color: transparent !important
}

.contact-input {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    width: 250px !important;
    border: solid 3px #e7eded !important;
    border-radius: 2px !important;
    background-color: #ffd !important;
    margin: 2px
}

#textBtnAccept {
    font-size: 12px
}

.k-content-center {
    display: flex;
    justify-content: center;
    margin-bottom: 10px
}

.sectionRecovery .btn-send {
    display: flex;
    justify-content: center
}