/* latin-ext */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v14/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v14/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 500;
    src: local('Montserrat Medium'), local('Montserrat-Medium'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_ZpC3gfD_u50.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 500;
    src: local('Montserrat Medium'), local('Montserrat-Medium'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_ZpC3gnD_g.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    src: local('Montserrat SemiBold'), local('Montserrat-SemiBold'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_bZF3gfD_u50.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    src: local('Montserrat SemiBold'), local('Montserrat-SemiBold'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_bZF3gnD_g.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 700;
    src: local('Montserrat Bold'), local('Montserrat-Bold'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_dJE3gfD_u50.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 700;
    src: local('Montserrat Bold'), local('Montserrat-Bold'), url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_dJE3gnD_g.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

body {
    display: flex;
    flex-direction: column;
    height: 100vh;
}

footer {
    margin-top: auto;
}

body > .container {
    margin-bottom: 3rem;
}

img#logo-image:hover {
    opacity: 1;
    cursor: pointer;
}

body.others-skin {
    font-family: "Montserrat" !important;
    background-color: #ecf1f4;
    font-size: 14px;
    font-weight: 400;
}

.others-skin nav.navbar {
    padding: 0px;
    background-color: #559F3D;
    box-shadow: none;
    max-height: 80px;
}

    .others-skin nav.navbar .return-url {
        text-transform: uppercase;
        font-size: 14px;
        font-weight: 500;
        color: #ffffff;
    }

@media (max-width: 768px) {
    .others-skin nav.navbar .arrow-responsive {
        font-size: 24px;
    }
}

.others-skin nav.navbar .navbar-brand {
    height: 100%;
    display: flex;
}

    .others-skin nav.navbar .navbar-brand #logo-image {
        content: url("./img/eskok.png");
        display: block;
        width: auto;
        height: 65%;
        margin-top: auto;
        margin-bottom: auto;
    }

@media (max-width: 576px) {
    .others-skin nav.navbar .navbar-brand #logo-image {
        height: 50%;
    }
}

.others-skin .btn-primary {
    background-color: #EDA01F !important;
    border: 2px solid #EDA01F !important;
    color: #ffffff !important;
    transition: 0.3s all !important;
}

    .others-skin .btn-primary:hover {
        border: 2px solid #EDA01F !important;
        background-color: #ffffff !important;
        color: #EDA01F !important;
        transition: 0.3s all !important;
    }

    .others-skin .btn-primary:not([disabled]):not(.disabled):active {
        border: 2px solid #EDA01F !important;
        background-color: #ffffff !important;
        color: #EDA01F !important;
        transition: 0.3s all !important;
    }

.others-skin .btn-secondary {
    background-color: #ffffff !important;
    border: 2px solid #2C5629 !important;
    color: #4d4d4d !important;
    transition: 0.3s all !important;
}

    .others-skin .btn-secondary:hover {
        border: 2px solid #2C5629 !important;
        background-color: #2C5629 !important;
        transition: 0.3s all !important;
    }

    .others-skin .btn-secondary:not([disabled]):not(.disabled):active {
        border: 2px solid #2C5629 !important;
        background-color: #2C5629 !important;
        transition: 0.3s all !important;
    }

.others-skin .link {
    color: #2C5629 !important;
    cursor: pointer !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    transition: 0.3s all !important;
}

    .others-skin .link:hover {
        color: #0dd547 !important;
        text-decoration: underline !important;
        transition: 0.3s all !important;
    }

.others-skin .box-second {
    background-color: #fff;
    min-height: 100%;
}

.others-skin .floating-label label {
    position: absolute;
    z-index: 1000;
    left: 17px;
    top: 13px;
    font-size: 12px;
    font-weight: 500;
    color: #7c7c7c !important;
    transition: 0.3s all;
}

.others-skin .floating-label input.form-control {
    height: 44px;
    border-radius: 4px;
    border-color: #dadce0 !important;
    font-size: 14px;
    font-weight: 500;
    padding-left: 16px;
    color: #000000 !important;
}

    .others-skin .floating-label input.form-control:focus + label,
    .others-skin .floating-label input.form-control:not(:placeholder-shown) + label {
        padding-left: 5px;
        padding-right: 5px;
        left: 12px;
        background: #fff !important;
        -webkit-transform: translateY(-22px) scale(1);
        transform: translateY(-22px) scale(1);
        transition: 0.3s all;
    }

    .others-skin .floating-label input.form-control:focus, .others-skin .floating-label input.form-control:not(:placeholder-shown) {
        border: 2px solid #2C5629 !important;
        box-shadow: none;
    }

.others-skin .floating-label-select {
    position: relative;
}

    .others-skin .floating-label-select label {
        position: absolute;
        z-index: 1000;
        padding-left: 5px;
        padding-right: 5px;
        top: 13px;
        left: 12px;
        background: #fff !important;
        -webkit-transform: translateY(-22px) scale(1);
        transform: translateY(-22px) scale(1);
        transition: 0.3s all;
        font-size: 12px;
        font-weight: 500;
        color: #7c7c7c !important;
        transition: 0.3s all;
    }

    .others-skin .floating-label-select select.form-control {
        height: 44px;
        border-radius: 4px;
        border-color: #dadce0 !important;
        font-size: 14px;
        font-weight: 500;
        padding-left: 11px;
        color: #000000 !important;
    }

        .others-skin .floating-label-select select.form-control.touched, .others-skin .floating-label-select select.form-control:focus {
            border: 2px solid #2C5629 !important;
            box-shadow: none;
        }

.others-skin .keyboard-icon {
    color: #2C5629;
    cursor: pointer;
}

.others-skin .text-non-clickable {
    color: #559F3D !important;
}

.others-skin .text-clickable {
    color: #2C5629 !important;
}

.others-skin .text-red {
    color: #f44336 !important;
}

.others-skin .content-card {
    background-color: #ffffff;
    min-height: 100%;
}

@media (min-width: 992px) {
    .others-skin .content-card {
        padding: 3rem;
    }
}

@media (min-width: 768px) {
    .others-skin .content-card {
        padding: 2rem;
    }
}

@media (max-width: 768px) {
    .others-skin .content-card {
        padding: 0.5rem;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
}

.others-skin .content-card h5 {
    text-align: center;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 700;
}

.others-skin .content-card h6 {
    text-align: center;
    font-size: 16px;
    font-weight: 600;
}

.others-skin input[type=radio]:checked + label > img {
    border: 4px solid #2C5629;
}

.others-skin .checked-image {
    border: 4px solid #2C5629;
}

.others-skin .anti-phishing-image {
    border-radius: 8px;
    border: 4px solid #ffffff;
}

.others-skin .footer {
    background-color: #d3dfe6;
    color: #000000;
}

    .others-skin .footer a {
        display: block;
        color: #000000;
    }

    .others-skin .footer .footer-box {
        padding: 30px;
        font-weight: 400;
        font-size: 12px;
    }

        .others-skin .footer .footer-box .box-title {
            font-weight: 600;
            font-size: 14px;
            margin-bottom: 0.5rem;
        }

    .others-skin .footer img {
        max-width: 120px;
        height: auto;
    }

    .others-skin .footer .footer-link {
        font-size: 10px;
    }

    .others-skin .input-single-digit {
        min-width: 25px;
        max-width: 40px;
        padding: 0px;
        text-align: center;
        font-size: 14px;
        border-radius: 4px;
    }

    .others-skin .input-single-digit.password {
        font-weight: 900;
    }

    .others-skin .input-single-digit:focus {
        border: 2px solid #2C5629 !important;
        box-shadow: none;
    }

.others-skin .bs-stepper-header {
    align-items: normal;
}

    .others-skin .bs-stepper-header .step .step-trigger {
        font-size: 14px;
        font-weight: 500;
        color: #7c7c7c;
        padding-left: 10px;
        padding-right: 10px;
    }

        .others-skin .bs-stepper-header .step .step-trigger:hover {
            background-color: inherit;
            cursor: unset;
        }

        .others-skin .bs-stepper-header .step .step-trigger .bs-stepper-circle {
            margin-right: 1em;
            margin-left: 1em;
        }

    .others-skin .bs-stepper-header .step.active .step-trigger {
        font-weight: 600;
        color: #000000;
    }

    .others-skin .bs-stepper-header .step.active .bs-stepper-circle {
        background-color: #559F3D;
    }

    .others-skin .bs-stepper-header .step .bs-stepper-label {
        white-space: normal;
        margin: 0px;
    }

@media (max-width: 768px) {
    .others-skin .bs-stepper-header {
        flex-direction: column;
    }
}
