:root {
    --btn_primary_normal: #3386c5;
    --btn_primary_active: #196aa8;
    --btn_secondary_normal: #10b79c;
    --btn_secondary_active: #0a917b;
    --btn_negative_normal: #d9d9d9;
    --btn_negative_active: #c0c0c0;
    --crud_read_normal: #3ba9fc;
    --crud_read_active: #2379b9;
    --crud_duplicate_normal: #ffa717;
    --crud_edit_normal: #10b79c;
    --crud_edit_active: #008d77;
    --crud_duplicate_active: #e59410;
    --crud_delete_normal: #ff6a6a;
    --crud_delete_active: #ca4c4c;
    --blue-h-1: #e5faff;
    --blue-h-2: #cef2ff;
    --blue-h-3: #aee2f6;
    --blue-h-4: #53c2ed;
    --blue-h-5: #21a4fc;
    --blue-h-6: #0c87f6;
    --blue-h-7: #016ed0;
    --blue-l-1: #e0f3f7;
    --blue-l-2: #cfe9f2;
    --blue-l-3: #b9dcea;
    --blue-l-4: #a5ccdb;
    --blue-l-5: #7da7c7;
    --blue-l-6: #5b87af;
    --blue-l-7: #396a92;
    --blue-m-8: #1f4364;
    --blue-m-9: #122d4e;
    --blue-h-10: #02152c;
}

body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

html {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    font-size: 14px;
}

div {
    box-sizing: border-box;
}

.clearfix:after {
    clear: both;
    content: "";
    display: block;
}

.pull-left {
    float: left;
}

.pull-right {
    float: right;
}

.login_wrapper {
    background-image: url('../Content/images/blue_login_bg.jpg');
    width: 100%;
    height: calc(100% - 50px);
    background-size: cover;
    padding: 30px 35px;
}

.logo_area {
    margin-bottom: 65px;
}

    .logo_area .logo {
        width: 108px;
    }

.login_title {
    font-size: 24px;
    font-weight: 600;
    letter-spacing: 0.46px;
    color: #ffffff;
    text-align: center;
    margin-bottom: 25px;
}

.login_block {
    max-width: 510px;
    border-radius: 6px;
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.11);
    margin: 0 auto;
}

.login_header {
    height: 53px;
    background-color: var(--blue-m-8);
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    border-radius: 6px 6px 0 0;
    padding: 15px 25px;
}

.login_content {
    background-color: #fff;
    border-radius: 0 0 6px 6px;
    padding: 30px;
}

.form_group {
    display: flex;
    border-radius: 6px;
    border: 1px solid var(--blue-l-3);
    height: 45px;
    margin-bottom: 15px;
}

    .form_group label {
        border-radius: 6px 0 0 6px;
        background-color: var(--blue-h-7);
        padding: 8px 12px;
        font-size: 20px;
        color: #fff;
    }

.form_input {
    width: 100%;
    padding: 8px;
    border: 0;
    border-radius: 0 6px 6px 0;
}

.forget_password {
    color: var(--btn_primary_normal);
    float: right;
}

.form-check {
    margin-bottom: 20px
}

.login_in_btn {
    width: 100%;
    height: 46px;
    border-radius: 23px;
    color: #fff;
    text-align: center;
    border: none;
    background-color: var(--btn_primary_normal);
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.89px;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    cursor: pointer;
}

    .login_in_btn:hover {
        background-color: var(--btn_primary_normal);
        color: white;
        opacity: 0.8;
    }

.copyright {
    width: 100%;
    background-color: #fff;
    color: rgba(0, 0, 0, 0.5);
    padding: 8px 25px;
}

.copyright_text {
    padding: 5px 10px 0 0;
}

.footer_logo {
    width: 42px;
}