﻿/***
Login page
***/
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i&display=swap');
body, html {
    width: 100%;
    margin: 0;
    height: 100%;
    display:grid;

}
.right {
    background-color: #fff;
    padding: 0.8em;
    height: 100% auto;
}

.left {
    background-color: #eafaff;
    padding: 0.8em;
    height: 100% auto;
}
.form-actions .col-sm-6 .btn {
    width: 100%;
}
/*Hide flag*/
.language-switch-area .famfamfam-flag-es, .language-switch-area .famfamfam-flag-fr, .language-switch-area .famfamfam-flag-de, .language-switch-area .famfamfam-flag-it, .language-switch-area .famfamfam-flag-br, .language-switch-area .famfamfam-flag-tr, .language-switch-area .famfamfam-flag-ru, .language-switch-area .famfamfam-flag-sa, .language-switch-area .famfamfam-flag-cn {
    /*display: none;*/
}

.login .btn, .login .btn-default {
    font-weight: 600;
    padding: 10px 25px !important;
    background: #D6312D !important;
    background: -webkit-linear-gradient(right,#00dbde,#fc00ff,#00dbde,#fc00ff);
    color: #8fc4e5
}

.login .content .form-actions .btn {
    margin-top: 1px;
    color: #fff !important;
}

.login .btn:hover {
    color: #8fc4e5
}

.login .btn-default:hover {
    background-color: #00a65a;
    color: #8fc4e5
}

.login .content .form-actions .btn {
    margin-top: 1px;
    color: #fff !important;
}

.login .btn:hover {
    color: #8fc4e5
}

.login .btn-default:hover {
    background-color: #00a65a;
    color: #8fc4e5
}

.login .content .form-actions .btn {
    margin-top: 1px;
    color: #fff !important;
}

.login .btn:hover {
    color: #8fc4e5
}

.login .btn-default:hover {
    background-color: #00a65a;
    color: #8fc4e5
}

.login .logo {
    margin: 0 auto 1em;
    padding: 0;
    text-align: center
}


.login .logo img {
    height: 4.3em;
}

.login .logo_cuc {
    margin: 0.7em auto 0;
    padding: 0;
    text-align: center;
}

    .login .logo_cuc img {
        height: 180px;
    }

.login .logo_login {
    text-align: center;
    margin-top: 5.0em;
    margin-bottom: 3.0em;
}

    .login .logo_login img {
        margin: 0.4em auto;
        max-width: 60%;
    }

.login .content {
    color: #333333;
    width: 77%;
    margin: 140px auto;
}


.text-Copyright {
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #677987;
}

.control-label {
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    color: #40444E;
}

.forget-password {
    font-style: italic;
    font-weight: bold;
    font-size: 14px;
    line-height: 24px;
    text-align: right;
    color: #D6312D !important;
}

.rememberme {
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 16px;
    color: #40444E;
}

.oda-content h2 {
    margin-bottom: 24px;
}

.form-control {
    background: #F6F6F6;
    border-radius: 4px;
    border: none !important;
}

.login .help-block {
    font-size: 12px;
    font-weight: 300;
    font-style: italic;
    color: #d6312d !important;
}

.oda-hotro {
    list-style-type: none;
    padding: 0px 15px 0px 15px;
}

    .oda-hotro > li {
        display: inline-flex;
        margin-right: 32px
    }

        .oda-hotro > li > span {
            margin: 6px 0px 6px 12px;
        }

.login .content h3 {
    margin-bottom: 16px;
    margin-top: 45px;
}

.oda-hotro:last-child {
    margin-top: 24px;
}
/*Tablet*/
@media screen and (min-width:600px) {
    .d-flext:before, .d-flext:after {
        content: "";
        display: table;
        clear: both;
    }
    .login .logo_login img {
        margin: 0.4em auto;
        max-width: 87%;
    }
    .login .logo_login {
        text-align: center;
        margin-top: 3.0em;
        margin-bottom: 2.0em;
    }
    .d-flext {
        max-width: 100%;
        height:100%;
    }
    .left {
        width: 55%;
        float: left;
        height: 100%;
    }
    .right {
        width: 45%;
        float: right;
        height: 100%;
    }
}
/*Desktop*/
@media screen and (min-width:1024px) {
    .d-flext:before, .d-flext:after {
        content: "";
        display: table;
        clear: both;
    }
    .login .logo_login img {
        margin: 0.4em auto;
        max-width: 87%;
    }

    .login .logo_login {
        text-align: center;
        margin-top: 3.0em;
        margin-bottom: 2.0em;
    }


    .d-flext {
        max-width: 100%;
        height: 100%;
    }

    .left {
        width: 60%;
        float: left;
        height: 100%;
    }

    .right {
        width: 40%;
        float: right;
        height: 100%;
    }
}
