@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Mulish:wght@400;500;600;700;800&display=swap");
:root {
    /*---logo-url: url("../img/keycloak-bg-darken.svg");*/
    --keycloak-logo-height: 63px;
    --keycloak-logo-width: 300px;
    --pf-v5-global--FontFamily--heading: "Mulish", sans-serif;
    --pf-v5-global--FontFamily--text: "Mulish", sans-serif;
    --keycloak-card-top-color: var(--pf-v5-global--palette--blue-400);
    --pf-v5-global--Color--light-100:#444;
    --ppf-v5-c-button--m-primary--BackgroundColor:rgb(182, 32, 20);
    --ppf-v5-c-button--m-primary--hover--BackgroundColor: #a60d02;
    --ppf-v5-c-button--m-primary--focus--BackgroundColor:rgb(182, 32, 40);
    --ppf-v5-c-button--m-primary--active--BackgroundColor:rgb(182, 32, 40);
    --ppf-v5-c-button--m-primary--Color:#fafafa;
    --ppf-v5-c-button--m-primary--hover--Color:#ffffff;
    --ppf-v5-c-button--m-primary--focus--Color:#fff;
    --ppf-v5-c-button--m-primary--active--Color:#fff;
    --pf-v5-global--BorderColor--300:#8a8d90;
    --pf-v5-c-form-control--hover--after--BorderBottomColor:#06c;
    --pf-v5-c-form-control--m-readonly--m-plain--OutlineOffset:-2;
    --pf-v5-c-form-control--before--BorderBottomColor:#06c;
    --pf-v5-c-form-control--before--BorderTopColor:#06c;
    --pf-v5-c-form-control--before--BorderRightColor:#06c;
    --pf-v5-global--FontSize--3xl:2rem;
    --pf-v5-global--FontWeight--normal:500;
    --pf-v5-global--FontWeight--bold:600;
    --pf-v5-c-title--color:rgb(34,34,34);
    --pf-v5-c-form__label-text--FontWeight: var(--pf-v5-global--FontWeight--normal);
    --pf-v5-c-title--m-3xl--FontSize: var(--pf-v5-global--FontSize--3xl);
    --pf-v5-c-title--m-3xl--FontWeight: var(--pf-v5-global--FontWeight--bold) !important;
    --pf-v5-c-title--m-3xl--LineHeight:1.4
}



@font-face {
    font-family: 'Inter';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/UcCm3FwrK3iLTcvnUwkT9mIzF59cK0sL.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Inter';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/UcCm3FwrK3iLTcvnUwAT9mIzF59cK0sL.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
    font-family: 'Inter';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/UcCm3FwrK3iLTcvnUwgT9mIzF59cK0sL.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
    font-family: 'Inter';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/UcCm3FwrK3iLTcvnUwcT9mIzF59cK0sL.woff2) format('woff2');
    unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
    font-family: 'Inter';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/UcCm3FwrK3iLTcvnUwsT9mIzF59cK0sL.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
    font-family: 'Inter';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/UcCm3FwrK3iLTcvnUwoT9mIzF59cK0sL.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Inter';
    font-style: italic;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/UcCm3FwrK3iLTcvnUwQT9mIzF59cKw.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/UcCo3FwrK3iLTcvvYwYZ90A2N59MKw.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/UcCo3FwrK3iLTcvmYwYZ90A2N59MKw.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/UcCo3FwrK3iLTcvuYwYZ90A2N59MKw.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/UcCo3FwrK3iLTcvhYwYZ90A2N59MKw.woff2) format('woff2');
    unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/UcCo3FwrK3iLTcvtYwYZ90A2N59MKw.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/UcCo3FwrK3iLTcvsYwYZ90A2N59MKw.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/UcCo3FwrK3iLTcviYwYZ90A2N58.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/QGYvz_MVcBeNP4NJuktqUYTkntBJ2fk.woff2) format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(webfonts/QGYvz_MVcBeNP4NJtEtqUYTkntBJ.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(webfonts/1Ptvg83HX_SGhgqk0gotcqA.woff2) format('woff2');
}
/* cyrillic */
@font-face {
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(webfonts/1Ptvg83HX_SGhgqk2wotcqA.woff2) format('woff2');
}
/* vietnamese */
@font-face {
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(webfonts/1Ptvg83HX_SGhgqk0AotcqA.woff2) format('woff2');
}
/* cyrillic-ext */
@font-face {
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(webfonts/1Ptvg83HX_SGhgqk0gotcqA.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(webfonts/1Ptvg83HX_SGhgqk2wotcqA.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(webfonts/1Ptvg83HX_SGhgqk0AotcqA.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(webfonts/1Ptvg83HX_SGhgqk0gotcqA.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(webfonts/1Ptvg83HX_SGhgqk2wotcqA.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(webfonts/1Ptvg83HX_SGhgqk0AotcqA.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(webfonts/1Ptvg83HX_SGhgqk0gotcqA.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(webfonts/1Ptvg83HX_SGhgqk2wotcqA.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(webfonts/1Ptvg83HX_SGhgqk0AotcqA.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url(webfonts/1Ptvg83HX_SGhgqk0gotcqA.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url(webfonts/1Ptvg83HX_SGhgqk2wotcqA.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
    font-family: 'Mulish1';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url(webfonts/1Ptvg83HX_SGhgqk0AotcqA.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

body{font-family: "Mulish", sans-serif; font-weight: 500; color: #48484d}
h1,h2,h3,h4,h5{font-family: 'Mulish', sans-serif; color: #222}
.pf-v5-c-login{min-height: 100vh; flex-direction: column; display: flex; padding: 0 !important;}
.pf-v5-c-login__header{margin: 0 !important; border-bottom:1px solid #ededed; width: 100%; padding:0.5rem 1rem; line-height: 32px;}
.pf-v5-c-login__header .pf-v5-c-brand{margin: 0 !important;}
.copyright{line-height: 32px; font-size: 14px; font-weight: 400 !important; color: #666}
h2{font-size: 56px; font-weight: 700; margin: 0; line-height: 1; color: #222}
h4{font-size: 32px;font-weight: 700; margin: 0; color: #222}
h5{font-size: 20px; color:#666;}


.pf-v5-c-login__container {
    /*grid-template-columns: 34rem;*/
    /*grid-template-areas: "header"*/
    /*                     "main"*/
    /*                    "footer"*/
    flex: 1;
    justify-content: center;
    align-items: center;
    align-content: center;
    display: flex;
    max-width: 100%;
    grid-column-gap:0;
}
.pf-v5-c-login__main{align-self: center; box-shadow: none; width: 480px; min-height: 420px; margin: 0}
/*
.pf-v5-c-login__main-header {
    border-top: 4px solid var(--keycloak-card-top-color);
}*/

/* Info section - top margin + bottom padding */
.pf-v5-c-login__main-footer-band:first-child {
    margin-block-start: var(--pf-v5-global--spacer--lg);
}

.pf-v5-c-login__main-footer-band:last-child {
    padding-bottom: 0;
}
/* Info section */

.login-pf body {
    background:#f7f8fd; background-size: cover;
    height: 100%;
}

div.kc-logo-text {
    background-image: var(--keycloak-logo-url);
    height: var(--keycloak-logo-height);
    width: var(--keycloak-logo-width);
    background-repeat: no-repeat;
    background-size: contain;
    margin: 0 auto;
}

div.kc-logo-text span {
    display: none;
}

.kc-login-tooltip {
    position: relative;
    display: inline-block;
}

.kc-login-tooltip .kc-tooltip-text{
    top:-3px;
    left:160%;
    background-color: black;
    visibility: hidden;
    color: #fff;
    min-width:130px;
    text-align: center;
    border-radius: 2px;
    box-shadow:0 1px 8px rgba(0,0,0,0.6);
    padding: 5px;
    position: absolute;
    opacity:0;
    transition:opacity 0.5s;
}

/* Show tooltip */
.kc-login-tooltip:hover .kc-tooltip-text {
    visibility: visible;
    opacity:0.7;
}

/* Arrow for tooltip */
.kc-login-tooltip .kc-tooltip-text::after {
    content: " ";
    position: absolute;
    top: 15px;
    right: 100%;
    margin-top: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent black transparent transparent;
}

#kc-recovery-codes-list {
    columns: 2;
}

#certificate_subjectDN {
    overflow-wrap: break-word
}

#kc-verify-email-form {
    margin-top: 24px;
    margin-bottom: 24px;
}

#kc-header-wrapper {
    font-size: 29px;
    text-transform: uppercase;
    letter-spacing: 3px;
    line-height: 1.2em;
    white-space: normal;
    color: var(--pf-v5-global--Color--light-100) !important;
    text-align: center;
}

hr {
    margin-top: var(--pf-v5-global--spacer--sm);
    margin-bottom: var(--pf-v5-global--spacer--md);
}

#kc-social-providers svg:not(.google) {
    filter: invert(47%) sepia(88%) saturate(7486%) hue-rotate(199deg) brightness(91%) contrast(101%);
}

#kc-social-providers svg {
    height: var(--pf-v5-global--FontSize--xl);
}

@media (prefers-color-scheme: dark) {
    #kc-social-providers svg:not(.google) {
        filter: invert(54%) sepia(96%) saturate(2028%) hue-rotate(174deg) brightness(99%) contrast(97%);
    }
}

@media (min-width: 768px) {
    /*   div.pf-v5-c-login__main-header {
           grid-template-columns: 70% 30%;
       }*/
}
@media (max-width: 1200px){
    .pf-v5-c-login__container{grid-column-gap:0;}
}

@media (max-width: 575px){
    .pf-side{display: none}
    .pf-v5-c-login__main{width: 100%; background: none}
}
.pf-v5-c-button.pf-m-primary {
    background-color: var(--ppf-v5-c-button--m-primary--BackgroundColor);
    color: var(--ppf-v5-c-button--m-primary--Color);
}
.pf-v5-c-button.pf-m-primary:hover {
    color:var(--ppf-v5-c-button--m-primary--hover--Color);
    background-color:var(--ppf-v5-c-button--m-primary--hover--BackgroundColor)
}
.pf-v5-c-button.pf-m-primary:focus {
    color:var(--ppf-v5-c-button--m-primary--focus--Color);
    background-color:var(--ppf-v5-c-button--m-primary--focus--BackgroundColor)
}
.pf-v5-c-button.pf-m-primary.pf-m-active,
.pf-v5-c-button.pf-m-primary:active {
    color:var(--ppf-v5-c-button--m-primary--active--Color);
    background-color:var(--ppf-v5-c-button--m-primary--active--BackgroundColor)
}

.pf-v5-c-form-control-customer{--pf-v5-c-form-control--before--BorderLeftColor: var(--pf-v5-global--BorderColor--300); }
.pf-v5-c-form-control-customer:hover::before{border-color: #0066cc !important;}
.pf-v5-c-form-control-customer:focus::before{border-color: #0066cc !important;}
.pf-v5-c-form-control-customer:active::before{border-color: #0066cc !important;}

.pf-v5-c-button.pf-m-control{--pf-v5-c-button--after--BorderColor:rgba(255,255,255,0) !important; background-color: transparent; position: absolute; right: -5px;}
.pf-v5-c-button.pf-m-control:hover::after{--pf-v5-c-button--after--BorderColor:rgba(255,255,255,0) !important;border-width: 1px; }
.pf-v5-c-button.pf-m-control:focus::after{--pf-v5-c-button--after--BorderColor:rgba(255,255,255,0) !important; border-width: 2px;}
.pf-v5-c-button.pf-m-control:active::after{--pf-v5-c-button--after--BorderColor:rgba(255,255,255,0) !important; border-width: 2px;}
.login__main-footer{font-size: 14px; }
.pf-v5-c-form-control input{outline: none}
.pf-v5-c-form-control:focus-within {
    --pf-v5-c-form-control--before--BorderLeftColor: #06c;
    --pf-v5-c-form-control--before--BorderRightColor: #06c;
    --pf-v5-c-form-control--before--BorderTopColor: #06c;
}
.pf-v5-c-title.pf-m-3xl {
    font-size: var(--pf-v5-c-title--m-3xl--FontSize);
    font-weight: 700 !important;
    line-height: var(--pf-v5-c-title--m-3xl--LineHeight);
    color: var(--pf-v5-c-title--color);
}
.pf-v5-c-form__label-text {
    font-weight: var(--pf-v5-c-form__label-text--FontWeight);
    color: #6c757d !important;
}
.brand-name{font-size: 20px; font-weight: 700; vertical-align: middle}
.float-right{float: right}
.pf-v5-c-form-control::after{border-width:1px !important;}
.pf-v5-c-form-control::before{border-block-end-width: 1px;}
.pf-m-error.pf-v5-c-form-control::before{border-color: #c9190b}
.pf-m-error.pf-v5-c-form-control:hover::before{border-color: #c9190b !important;}
.px-1{padding-right: 0.25rem; padding-left:0.25rem;}
.fa-eye-slash::before{content: ''; background: url("../img/eye-slash.svg") no-repeat center; width: 24px; height: 24px; display: block}
.fa-eye::before{content: ''; background: url("../img/eye.svg") no-repeat center; width: 24px; height: 24px; display: block}
.small{font-size: 85%}
.pf-v5-c-alert.pf-m-danger{border:none !important;}
.pf-m-secondary{color: #0e6eb9}

