/*#region Style >> Loader */

.loader {
    height: 5px;
    position: relative;
    margin-top: 1rem;
    margin-bottom: 1rem;
    overflow: hidden;
    background: #ced4da2e;
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
    box-shadow: inset 0px 1px 2px 0px white;
}

    .loader.start:before {
        display: block;
        position: absolute;
        content: "";
        left: -200px;
        width: 200px;
        height: 4px;
        background: linear-gradient(to left, #fff, rgba(255, 255, 255, 0.1));
        animation: loading 1s linear infinite;
    }


@keyframes loading {

    from {
        left: -200px;
        width: 30%
    }
    /*50% {
        width: 30%
    }

    70% {
        width: 70%
    }

    80% {
        left: 80%
    }*/
    95% {
        left: 120%
    }

    to {
        left: 100%
    }
}

.btn-login .button-span-name {
    opacity: 1;
    transition: opacity .3s ease-in-out;
}

.btn-login.loading .button-span-name {
    opacity: 0;
}

.btn-login .triangle-path {
    opacity: 0;
    transition: opacity .3s ease-in-out;
}

.btn-login.loading .triangle-path {
    opacity: 1;
}

.btn-login .la-ball-triangle-path,
.btn-login .la-ball-triangle-path > div {
    position: absolute;
    bottom: 0;
    right: 0;
    margin: auto;
    box-sizing: border-box;
}

.btn-login .la-ball-triangle-path {
    top: 0;
    left: 0;
    color: #e20917;
}

.btn-login:hover .la-ball-triangle-path {
    color: #e20917;
}

.btn-login .la-ball-triangle-path > div {
    top: -19px;
    left: -17px;
    width: 6px;
    height: 6px;
    border: 0 solid currentColor;
    border-radius: 100%;
    background-color: currentColor;
}

    .btn-login .la-ball-triangle-path > div:nth-child(1) {
        animation: ball-triangle-path-ball-one-w 2s 0s ease-in-out infinite;
    }

    .btn-login .la-ball-triangle-path > div:nth-child(2) {
        animation: ball-triangle-path-ball-two-w 2s 0s ease-in-out infinite;
    }

    .btn-login .la-ball-triangle-path > div:nth-child(3) {
        animation: ball-triangle-path-ball-tree-w 2s 0s ease-in-out infinite;
    }

@keyframes ball-triangle-path-ball-one-w {
    0% {
        transform: translate(0, 300%);
    }

    17% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px white);
    }

    33% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px white);
        transform: translate(150%, 0);
    }

    50% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px white);
    }

    66% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px white);
        transform: translate(300%, 300%);
    }

    83% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px white);
    }

    100% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px white);
        transform: translate(0, 300%);
    }
}

@keyframes ball-triangle-path-ball-two-w {
    0% {
        -webkit-transform: translate(150%, 0);
        -moz-transform: translate(150%, 0);
        -o-transform: translate(150%, 0);
        transform: translate(150%, 0);
    }

    17% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px white);
    }

    33% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px white);
        -webkit-transform: translate(300%, 300%);
        -moz-transform: translate(300%, 300%);
        -o-transform: translate(300%, 300%);
        transform: translate(300%, 300%);
    }

    50% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px white);
    }

    66% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px white);
        -webkit-transform: translate(0, 300%);
        -moz-transform: translate(0, 300%);
        -o-transform: translate(0, 300%);
        transform: translate(0, 300%);
    }

    83% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px white);
    }

    100% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px white);
        -webkit-transform: translate(150%, 0);
        -moz-transform: translate(150%, 0);
        -o-transform: translate(150%, 0);
        transform: translate(150%, 0);
    }
}

@keyframes ball-triangle-path-ball-tree-w {
    0% {
        -webkit-transform: translate(300%, 300%);
        -moz-transform: translate(300%, 300%);
        -o-transform: translate(300%, 300%);
        transform: translate(300%, 300%);
    }

    17% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px white);
    }

    33% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px white);
        -webkit-transform: translate(0, 300%);
        -moz-transform: translate(0, 300%);
        -o-transform: translate(0, 300%);
        transform: translate(0, 300%);
    }

    50% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px white);
    }

    66% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px white);
        -webkit-transform: translate(150%, 0);
        -moz-transform: translate(150%, 0);
        -o-transform: translate(150%, 0);
        transform: translate(150%, 0);
    }

    83% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px white);
    }

    100% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px white);
        -webkit-transform: translate(300%, 300%);
        -moz-transform: translate(300%, 300%);
        -o-transform: translate(300%, 300%);
        transform: translate(300%, 300%);
    }
}

.btn-login:hover .la-ball-triangle-path > div:nth-child(1) {
    animation: ball-triangle-path-ball-one-r 2s 0s ease-in-out infinite;
}

.btn-login:hover .la-ball-triangle-path > div:nth-child(2) {
    animation: ball-triangle-path-ball-two-r 2s 0s ease-in-out infinite;
}

.btn-login:hover .la-ball-triangle-path > div:nth-child(3) {
    animation: ball-triangle-path-ball-tree-r 2s 0s ease-in-out infinite;
}

@keyframes ball-triangle-path-ball-one-r {
    0% {
        transform: translate(0, 300%);
    }

    17% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px #e20917);
    }

    33% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px #e20917);
        transform: translate(150%, 0);
    }

    50% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px #e20917);
    }

    66% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px #e20917);
        transform: translate(300%, 300%);
    }

    83% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px #e20917);
    }

    100% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px #e20917);
        transform: translate(0, 300%);
    }
}

@keyframes ball-triangle-path-ball-two-r {
    0% {
        transform: translate(150%, 0);
    }

    17% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px #e20917);
    }

    33% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px #e20917);
        transform: translate(300%, 300%);
    }

    50% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px #e20917);
    }

    66% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px #e20917);
        transform: translate(0, 300%);
    }

    83% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px #e20917);
    }

    100% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px #e20917);
        transform: translate(150%, 0);
    }
}

@keyframes ball-triangle-path-ball-tree-r {
    0% {
        transform: translate(300%, 300%);
    }

    17% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px #e20917);
    }

    33% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px #e20917);
        transform: translate(0, 300%);
    }

    50% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px #e20917);
    }

    66% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px #e20917);
        transform: translate(150%, 0);
    }

    83% {
        opacity: .25;
        filter: drop-shadow(0px 0px 0px #e20917);
    }

    100% {
        opacity: 1;
        filter: drop-shadow(0px 0px 3px #e20917);
        transform: translate(300%, 300%);
    }
}

/*#endregion */

/*#region Style >> Background */

#vdoLoginBackground {
    position: absolute;
    right: 0;
    bottom: 0;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-size: 100% 100%;
    background-position: center center;
    object-fit: cover;
    z-index: 3;
}

/*#endregion */

/*#region Style >> Container */

.app-container {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    margin: 0
}

.app-theme-white.app-container {
    background: #f1f4f6
}

.body-tabs-shadow .body-tabs-animated {
    padding: .75rem 0
}

    .body-tabs-shadow .body-tabs-animated .nav-link span {
        position: relative;
        z-index: 5
    }

    .body-tabs-shadow .body-tabs-animated .nav-link::before {
        height: 70%;
        top: 15%;
        z-index: 4;
        bottom: auto;
        box-shadow: 0 16px 26px -10px rgba(63,106,216,0.56),0 4px 25px 0px rgba(0,0,0,0.12),0 8px 10px -5px rgba(63,106,216,0.2);
        border-radius: 100%;
        opacity: .5
    }

    .body-tabs-shadow .body-tabs-animated .nav-link.active, .body-tabs-shadow .body-tabs-animated .nav-link:hover {
        color: #fff
    }

        .body-tabs-shadow .body-tabs-animated .nav-link.active::before, .body-tabs-shadow .body-tabs-animated .nav-link:hover::before {
            border-radius: .25rem;
            opacity: 1
        }

/*#endregion */

/*#region Style >> Form */

.app-container .form-div {
    width: 100%;
    z-index: 9999;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
}

    .app-container .form-div .app-login-box {
        padding-left: 16px;
        padding-right: 16px;
        padding-top: 100px;
        padding-bottom: 15px;
        width: 387px;
        background-image: url('../../img/background/login-bar.png');
        background-size: cover;
        background-position: center center;
        background-repeat: no-repeat;
    }

        .app-container .form-div .app-login-box .app-logo {
            height: 60px;
            width: auto;
            background-image: url('../../img/logo/uyumsoft-beyaz-logo.svg');
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center center;
        }

.licensee-company {
    position: absolute !important;
    margin-left: 133px !important;
    margin-top: -15px !important;
    font-size: 10px !important;
    width: 130px !important;
    text-align: center !important;
    float: left;
    color: white;
    border-radius: var(--btn-radius,0.25em);
    padding: 2px 4px;
    text-transform: lowercase;
    font-weight: bold;
}


.eko-ticari .licensee-company {
    margin-left: 133px !important;
    margin-top: 25px !important;
    font-size: 9px !important;
    width: 90px !important;
    line-height: 10px;
}

.eko-hr .licensee-company {
    margin-left: 113px !important;
    margin-top: -23px !important;
    font-size: 10px !important;
}

.eko-smmm .licensee-company {
    margin-left: 113px !important;
    margin-top: -23px !important;
    font-size: 10px !important;
}

.eko-muhasebe .licensee-company {
    margin-left: 113px !important;
    margin-top: -23px !important;
    font-size: 10px !important;
}

.eko-bordro .licensee-company {
    margin-left: 113px !important;
    margin-top: -23px !important;
    font-size: 10px !important;
}

.uyum-erp .licensee-company {
    margin-top: -23px !important;
}

.uyum-crm .licensee-company {
    margin-top: -25px !important;
    margin-left: 120px !important
}

.uyum-hrm .licensee-company {
    margin-top: -23px !important;
    margin-left: 115px !important;
}

.uyum-erp .app-container .form-div .app-login-box .app-logo {
    background-image: url('../../img/logo/uyumerp/uyum-ERP-full-beyaz.svg') !important;
    height: 45px;
}

.uyum-crm .app-container .form-div .app-login-box .app-logo {
    background-image: url('../../img/logo/uyumcrm/crm-full-beyaz.svg') !important;
    height: 45px;
}

.uyum-hrm .app-container .form-div .app-login-box .app-logo {
    background-image: url('../../img/logo/uyumhrm/hrm-full-beyaz.svg') !important;
    height: 45px;
}

.eko-hr .app-container .form-div .app-login-box .app-logo {
    background-image: url('../../img/logo/ekohr/ekoHR-beyaz.svg') !important;
    height: 100px;
}

.eko-smmm .app-container .form-div .app-login-box .app-logo {
    background-image: url('../../img/logo/ekosmmm/ekoSMMM-beyaz.svg') !important;
    height: 80px;
}

.eko-muhasebe .app-container .form-div .app-login-box .app-logo {
    background-image: url('../../img/logo/ekomuhasebe/ekoMuhasebe-beyaz.svg') !important;
    height: 80px;
}

.eko-bordro .app-container .form-div .app-login-box .app-logo {
    background-image: url('../../img/logo/ekobordro/ekoBordro-beyaz.svg') !important;
    height: 80px;
}

.eko-ticari .app-container .form-div .app-login-box .app-logo {
    background-image: url('../../img/logo/ekoticari/ekoTicari-beyaz.svg') !important;
    height: 100px;
}

.app-container .form-div .app-login-box h4 {
    margin-bottom: 1.5rem !important;
    font-weight: normal;
    line-height: 1.7rem;
}

    .app-container .form-div .app-login-box h4 div {
        opacity: .6
    }

    .app-container .form-div .app-login-box h4 span {
        font-size: 18px;
        text-shadow: 1px 1px 1px #ced4da;
    }

.app-container .form-div .app-login-box .system-info {
    margin-top: 10px;
    color: #343a40
}

.app-container .form-div .app-login-box .frm-login .form-row:first-child {
    margin-top: 33px
}

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .igt-username.input-group-text,
    .app-container .form-div .app-login-box .frm-login .form-row:first-child .igt-password.input-group-text {
        border-radius: 0;
        background-color: #f7f7f7;
        box-shadow: inset 0px 0px 5px 0px #ced4da !important;
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .icon-username {
        color: #343a40;
        transition: all .5s;
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .icon-username-animate {
        position: absolute;
        opacity: 0.3;
        transform: scale(1);
        transition: all .7s;
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .lbl-username {
        /*margin-left: 38px;*/
        z-index: 4;
        font-size: 16px;
        color: #fff;
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .tbx-username {
        /*border-color: #ced4da !important;*/
        box-shadow: none !important;
        background-color: transparent !important;
        /*box-shadow: inset 0px 0px 5px 0px #ced4da !important;*/
        color: #fff;
    }


    .app-container .form-div .app-login-box .frm-login .form-row:first-child .icon-password {
        color: #343a40;
        transition: all .5s
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .icon-password-animate {
        position: absolute;
        opacity: 0.3;
        transform: scale(1);
        transition: all .7s
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .lbl-password {
        /*margin-left: 41px;*/
        z-index: 4;
        font-size: 16px;
        color: #fff;
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .tbx-password {
        /*border-color: #ced4da !important;*/
        box-shadow: none !important;
        background-color: transparent !important;
        /*box-shadow: inset 0px 0px 5px 0px #ced4da !important;*/
        color: #fff;
    }


    .app-container .form-div .app-login-box .frm-login .form-row:first-child .icon-email {
        color: #343a40;
        transition: all .5s
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .icon-email-animate {
        position: absolute;
        opacity: 0.3;
        transform: scale(1);
        transition: all .7s
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .lbl-email {
        margin-left: 41px;
        z-index: 4;
        font-size: 16px;
        color: #fff;
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .tbx-email {
        border-color: #fff !important;
        box-shadow: none !important;
        background-color: transparent !important;
        /*box-shadow: inset 0px 0px 5px 0px #ced4da !important;*/
        color: #fff;
    }


    .app-container .form-div .app-login-box .frm-login .form-row:first-child .lbl-password1 {
        /*margin-left: 41px;*/
        z-index: 4;
        font-size: 16px;
        color: #fff;
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .tbx-password1 {
        border-color: #fff !important;
        box-shadow: none !important;
        background-color: transparent !important;
        /*box-shadow: inset 0px 0px 5px 0px #ced4da !important;*/
        color: #fff;
    }


    .app-container .form-div .app-login-box .frm-login .form-row:first-child .lbl-password2 {
        /*margin-left: 41px;*/
        z-index: 4;
        font-size: 16px;
        color: #fff;
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .tbx-password2 {
        border-color: #fff !important;
        box-shadow: none !important;
        background-color: transparent !important;
        /*box-shadow: inset 0px 0px 5px 0px #ced4da !important;*/
        color: #fff;
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .icon-smscode {
        color: #343a40;
        transition: all .5s;
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .icon-smscode-animate {
        position: absolute;
        opacity: 0.3;
        transform: scale(1);
        transition: all .7s;
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .lbl-smscode {
        /*margin-left: 38px;*/
        z-index: 4;
        font-size: 16px;
        color: #fff;
    }

    .app-container .form-div .app-login-box .frm-login .form-row:first-child .tbx-smscode {
        /*border-color: #ced4da !important;*/
        box-shadow: none !important;
        background-color: transparent !important;
        /*box-shadow: inset 0px 0px 5px 0px #ced4da !important;*/
        color: #fff;
    }


.app-container .form-div .app-login-box .frm-login .form-row:nth-child(2) .remember-me-check {
    padding-left: 0;
    margin-left: 10px;
    margin-top: 0
}

    .app-container .form-div .app-login-box .frm-login .form-row:nth-child(2) .remember-me-check .toggle.btn.btn-secondary {
        min-height: 10px;
        height: 10px
    }

    .app-container .form-div .app-login-box .frm-login .form-row:nth-child(2) .remember-me-check input.material-checkbox[type="checkbox"] {
        display: none
    }

        .app-container .form-div .app-login-box .frm-login .form-row:nth-child(2) .remember-me-check input.material-checkbox[type="checkbox"] + label {
            display: block;
            position: relative;
            padding-left: 40px;
            margin-bottom: 20px;
            cursor: pointer;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            font-size: 16px;
            /*text-shadow: 1px 1px 1px #ced4da;*/
            color: #fff;
        }

        .app-container .form-div .app-login-box .frm-login .form-row:nth-child(2) .remember-me-check input.material-checkbox[type="checkbox"]:checked + label:before {
            width: 10px;
            top: -2px;
            left: 5px;
            border: 3px solid #fff;
            border-radius: 0;
            opacity: 1;
            border-top-color: transparent;
            border-left-color: transparent;
            -webkit-transform: rotate(45deg);
            transform: rotate(45deg)
        }

        .app-container .form-div .app-login-box .frm-login .form-row:nth-child(2) .remember-me-check input.material-checkbox[type="checkbox"] + label:last-child {
            margin-bottom: 0
        }

        .app-container .form-div .app-login-box .frm-login .form-row:nth-child(2) .remember-me-check input.material-checkbox[type="checkbox"] + label:before {
            content: '';
            display: block;
            width: 20px;
            height: 20px;
            border: 3px solid #fff;
            position: absolute;
            left: 0;
            top: 2px;
            opacity: .6;
            -webkit-transition: all .12s, border-color .08s;
            transition: all .12s, border-color .08s
        }

.app-container .form-div .app-login-box .frm-login .loader-bottom {
    margin-top: 30px
}

.app-container .form-div .app-login-box .frm-login .btn-forgot-password {
    color: #fff;
    font-size: 16px;
    text-decoration: none;
    /*text-shadow: 0px 0px 1px #c0c6cc;*/
    transition: all .3s;
    margin-top: 18px;
    display: block;
    text-align: center;
}

.app-container .form-div .app-login-box .frm-login .btn-login {
    border-radius: 24px;
    float: right;
    margin-right: 8px;
    font-size: 16px;
    font-weight: 600;
    color: #e20917;
    letter-spacing: 1px;
    line-height: 14px;
    width: 94%;
    max-width: 100%;
    margin-right: 10px;
    margin-left: 10px;
}

    .app-container .form-div .app-login-box .frm-login .btn-login.button--nuka::before,
    .app-container .form-div .app-login-box .frm-login .btn-login.button--nuka::after {
        background: #fff;
    }

.app-container .form-div .app-login-box .frm-login .btn-link-row,
.app-container .form-div .app-login-box .frm-login .btn-ok-row {
    padding: 0;
    margin: 0px 0;
}

.app-container .form-div .app-login-box .frm-login .btn-link-row {
    margin: 10px 0 30px 0;
}

.app-container .h-100 {
    height: 100vh !important;
}

.caps-lock {
    position: absolute;
    z-index: 9999;
    right: 40px;
    top: 17px;
    font-size: 10px;
    color: white;
    text-shadow: 0px 0px 1px #989898;
    transform: translateX(0px);
    opacity: 1;
    transition: all 0.5s;
}

    .caps-lock.caps-lock-hide {
        transform: translateX(-15px);
        opacity: 0;
    }

.eye-icon {
    color: white;
    padding: 17px 0px;
}

    .eye-icon:hover {
        color: black;
    }

.eye-div {
    position: absolute;
    right: 11px;
    cursor: pointer;
}


/*#endregion */

/*#region Style >> Floating Label */
.form-label-group input:not(:placeholder-shown) ~ label {
    font-size: 12px !important;
}

/*#endregion */

/*#region Style >> Copyright */

.login-copyright {
    position: fixed;
    height: 70px;
    bottom: -47px;
    width: 100%;
    z-index: 9999;
    background: #1b2f440d;
    color: #eaebec;
    text-align: center;
    font-size: 10px;
    box-shadow: inset 0px 0px 30px 0px #3a6c9663;
    border-radius: 100%;
    padding-top: 4px;
    font-weight: 600;
    transition: all .3s ease-in-out;
}

@media screen and (max-height: 475px) {

    .login-copyright {
        bottom: -75px;
    }
}

/*#endregion */

/*#region Style >> Lang Flag */

.countries-div {
    float: right;
    background-color: var(--color-contrast-low,#fff);
    color: var(--color-contrast-higher,#1c1c21);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    text-decoration: none;
    line-height: 1;
    padding-top: var(--btn-padding-y,0.5em);
    padding-bottom: var(--btn-padding-y,0.5em);
    padding-left: var(--btn-padding-x,0.75em);
    padding-right: var(--btn-padding-x,0.75em);
    border-radius: var(--btn-radius,0.25em);
    margin-left: 5px;
}

#countries_titleText {
    display: none !important;
}

#countries_title .ddlabel {
    display: none;
}

.divider {
    display: none;
}

.dd .ddTitle {
    background: none !important;
}

.dd {
    border: none !important;
}

    .dd .ddTitle .ddTitleText {
        padding: unset !important;
    }

/*#endregion */

/*#region Style >> Timer */

.div-timer {
    text-align: center;
    padding: 20px 10px;
}

.timerspan {
    padding: 7px;
    background-color: white;
    border-radius: 5px;
    font-size: 13px;
    font-weight: bold;
}

/*#endregion */

/*#region Style >> Switch */

.login-toolbar {
    position: relative;
    top: -80px;
    width: 356px;
}

.ldap-div {
    float: right;
    color: var(--color-contrast-higher,#1c1c21);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    text-decoration: none;
    line-height: 1;
    margin-right: 0px;
    width: 70px;
}

.switch {
    position: relative;
    display: block;
    vertical-align: top;
    width: 100px;
    height: 24px;
    padding: 3px;
    margin: 0;
    background: linear-gradient(to bottom, #eeeeee, #FFFFFF 25px);
    background-image: -webkit-linear-gradient(top, #eeeeee, #FFFFFF 25px);
    border-radius: 5px;
    box-shadow: inset 0 -1px white, inset 0 1px 1px rgba(0, 0, 0, 0.05);
    cursor: pointer;
    box-sizing: content-box;
}

.switch-input {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    box-sizing: content-box;
}

.switch-label {
    position: relative;
    display: block;
    height: inherit;
    font-size: 10px;
    text-transform: uppercase;
    background: #eceeef;
    border-radius: inherit;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 2px rgba(0, 0, 0, 0.15);
    font-weight: bold;
}

    .switch-label:before, .switch-label:after {
        position: absolute;
        top: 50%;
        margin-top: -.5em;
        line-height: 1;
        -webkit-transition: inherit;
        -moz-transition: inherit;
        -o-transition: inherit;
        transition: inherit;
        box-sizing: content-box;
    }

    .switch-label:before {
        content: attr(data-off);
        right: 11px;
        color: #aaaaaa;
        text-shadow: 0 1px rgba(255, 255, 255, 0.5);
    }

    .switch-label:after {
        content: attr(data-on);
        left: 9px;
        color: #FFFFFF;
        text-shadow: 0 1px rgba(0, 0, 0, 0.2);
        opacity: 0;
    }

.switch-input:checked ~ .switch-label {
    background: #E1B42B;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 0 3px rgba(0, 0, 0, 0.2);
}

    .switch-input:checked ~ .switch-label:before {
        opacity: 0;
    }

    .switch-input:checked ~ .switch-label:after {
        opacity: 1;
    }

.switch-handle {
    position: absolute;
    top: 4px;
    left: 4px;
    width: 28px;
    height: 28px;
    background: linear-gradient(to bottom, #FFFFFF 40%, #f0f0f0);
    background-image: -webkit-linear-gradient(top, #FFFFFF 40%, #f0f0f0);
    border-radius: 100%;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
}

    .switch-handle:before {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        margin: -3px 0 0 -3px;
        width: 7px;
        height: 7px;
        background: linear-gradient(to bottom, #eeeeee, #FFFFFF);
        background-image: -webkit-linear-gradient(top, #eeeeee, #FFFFFF);
        border-radius: 6px;
        box-shadow: inset 0 1px rgba(0, 0, 0, 0.02);
    }

.switch-input:checked ~ .switch-handle {
    left: 74px;
    box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}

/* Switch Light
==========================*/
.switch-light {
    padding: 2px;
    background: #FFF;
    background-image: none;
}

    .switch-light .switch-label {
        background: #FFF;
        border: solid 1px #eceeef;
        box-shadow: none;
    }

.switch-light .switch-label:after {
    color: #0B0A0A;
}

.switch-light .switch-label:before {
    right: inherit;
    left: 9px;
}

.switch-light .switch-handle {
    top: 5px;
    left: 45px;
    background: #dadada;
    width: 18px;
    height: 18px;
    box-shadow: none;
}

    .switch-light .switch-handle:before {
        background: #eceeef;
    }

.switch-light .switch-input:checked ~ .switch-label {
    background: #FFF;
    border-color: #D51111;
}

.switch-light .switch-input:checked ~ .switch-handle {
    left: 45px;
    box-shadow: none;
    background: #D51111
}

    .switch-light .switch-input:checked ~ .switch-handle:before {
        background: rgba(255,255,255,0.7);
    }
/* Transition
============================================================ */
.switch-label, .switch-handle {
    transition: All 0.3s ease;
    -webkit-transition: All 0.3s ease;
    -moz-transition: All 0.3s ease;
    -o-transition: All 0.3s ease;
}

/*#endregion */

/*#region Style >> Mobile Galeri */

.mobile-app-intro div.icons a {
    height: 34px;
    position: relative;
    width: 114px;
    margin-left: 3px;
}

.mobile-app-intro div.icons a.android {
    background-image: url('../../img/mobileintro/googleplay.svg') !important;
}

    .mobile-app-intro div.icons a.apple {
        background-image: url('../../img/mobileintro/appstore.svg') !important;
    }

    .mobile-app-intro div.icons a.uyumapp {
        background-image: url('../../img/mobileintro/uyumappgallery.svg') !important;
    }

.icons {
    display: flex;
    margin-top: 15px;
}

.mobile-app-intro {

}

/*#endregion */

/*#region Style >> Password Status */

.progress {
    height: 5px !important;
    display: flex;
    margin-top: 10px;
    margin-bottom: 10px;
}

.form-group {
    margin-bottom: 10px;
}

.show-pass {
    position: absolute;
    top: 5%;
    right: 8%;
}

.progress-bar-danger {
    background-color: #e90f10;
}

.progress-bar-warning {
    background-color: #ffad00;
}

.progress-bar-success {
    background-color: #02b502;
}

.ex-account p a {
    color: #f6086e;
    text-decoration: underline;
}

.fa-circle {
    font-size: 6px;
}

.fa-check {
    color: #02b502;
}

.list-unstyled {
    list-style: none;
}

#TPnControl_ProgressBar {
    display: none;
}

.divPasswordStrengthShecker {
    color: white;
    font-size: 12px;
    line-height: 21px;
    margin-left: 10px;
    margin-top: 16px;
    font-weight: bold;
}

/*#endregion */

/*background*/
#bodyLogin .login-background {
    background-image: url('../../img/background/3.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

#video {
    border: 1px solid black;
    box-shadow: 2px 2px 3px black;
    width: 320px;
    height: 240px;
}

#photo {
    border: 1px solid black;
    box-shadow: 2px 2px 3px black;
    width: 320px;
    height: 240px;
}

#canvas {
    display: none;
}

.camera {
    width: 340px;
    display: inline-block;
}

.output {
    width: 340px;
    display: inline-block;
}

.uyum-destek {
    text-align: center;
    color: white;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
    font-size: 12px;
    display: flex;
    padding: 15px;
    font-weight: bold;
    position: fixed;
    bottom: 0px;
    right: 0px;
}

.uyum-destek-tittle {
    text-transform: uppercase
}

.uyum-destek-telefon:before {
    font-family: 'Font Awesome 5 Pro';
    text-decoration: inherit;
    text-rendering: optimizeLegibility;
    content: "\f054";
    font-size: .8rem;
    line-height: 0;
    position: relative;
    color: #cc1010;
    margin: 5px;
}

.uyum-destek-email:before {
    font-family: 'Font Awesome 5 Pro';
    text-decoration: inherit;
    text-rendering: optimizeLegibility;
    content: "\f054";
    font-size: .8rem;
    line-height: 0;
    position: relative;
    color: #cc1010;
    margin: 5px;
}

.mobile-settings {
    text-align: center;
    color: white;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
    font-size: 12px;
    display: flex;
    padding: 15px;
    font-weight: bold;
    position: fixed;
    bottom: 0px;
    left: 0px;
}

.scan-icon {
    width: 60px;
}