﻿body {
    background-color: #7c7c7c;
}

/*   Typography    */
body, h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6, p, .navbar, .brand, .btn-simple, .alert, a, .td-name, td, button.close {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
}

*:focus {
    outline: 0 !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.wrapper {
    min-height: 100vh;
    position: relative;
    top: 0;
    height: 100vh;
}

/*     Form     */
.form-control {
    font-size: 1rem;
    border-color: #ebedf2;
    padding: .6rem 1rem;
}

    .form-control:focus {
        border-color: #3e93ff;
    }

/*     Form Control Sizes    */
.form-control-lg, .input-group-lg > .form-control, .input-group-lg > .input-group-append > .btn, .input-group-lg > .input-group-append > .input-group-text, .input-group-lg > .input-group-prepend > .btn, .input-group-lg > .input-group-prepend > .input-group-text {
    padding: .5rem 1rem !important;
    font-size: 1.25rem !important;
}

.form-control-sm, .input-group-sm > .form-control, .input-group-sm > .input-group-append > .btn, .input-group-sm > .input-group-append > .input-group-text, .input-group-sm > .input-group-prepend > .btn, .input-group-sm > .input-group-prepend > .input-group-text {
    padding: .25rem .5rem !important;
    font-size: .875rem !important;
    line-height: 1.5;
}

.form-control::-webkit-input-placeholder {
    color: inherit;
    opacity: .7;
}

.form-control:-moz-placeholder {
    color: inherit;
    opacity: .7;
}

.form-control::-moz-placeholder {
    color: inherit;
    opacity: .7;
}

.form-control:-ms-input-placeholder {
    color: inherit;
    opacity: .7;
}

.form-control::-ms-input-placeholder {
    color: inherit;
    opacity: .7;
}

.input-group-text {
    border-color: #ebedf2 !important;
}

.form-button-action {
    display: inline-flex;
}

.form-check-label, .form-radio-label {
    margin-right: 15px;
}

/*     CheckBox Input    */
.select-all-checkbox + .form-check-sign:before {
    background: #ccc !important;
    border-color: #ccc !important;
}

.form-check [type="checkbox"]:not(:checked), .form-check [type="checkbox"]:checked {
    position: absolute;
    left: -9999px;
}

    .form-check [type="checkbox"]:not(:checked) + .form-check-sign, .form-check [type="checkbox"]:checked + .form-check-sign, .form-check [type="checkbox"] + .form-check-sign {
        position: relative;
        padding-left: 2em;
        color: #575962;
        cursor: pointer;
    }

        .form-check [type="checkbox"]:not(:checked) + .form-check-sign:before, .form-check [type="checkbox"]:checked + .form-check-sign:before, .form-check [type="checkbox"] + .form-check-sign:before {
            content: '';
            position: absolute;
            left: 0;
            top: 1px;
            width: 16px;
            height: 16px;
            border: 1px solid #ccc;
            background: transparent;
            border-radius: 4px;
        }

        .form-check [type="checkbox"]:not(:checked) + .form-check-sign:after, .form-check [type="checkbox"]:checked + .form-check-sign:after, .form-check [type="checkbox"] + .form-check-sign:after {
            content: "\f00c";
            display: inline-block;
            position: absolute;
            top: -1px;
            left: 2px;
            width: 18px;
            height: 18px;
            text-align: center;
            font-size: 1.3em;
            line-height: 0.8;
            color: #177dff;
            transition: all .2s;
            font-family: 'Font Awesome 5 Solid';
        }

        .form-check [type="checkbox"]:not(:checked) + .form-check-sign:after {
            opacity: 0;
            transform: scale(0);
        }

    .form-check [type="checkbox"]:checked + .form-check-sign {
        font-weight: 400;
    }

        .form-check [type="checkbox"]:checked + .form-check-sign:after {
            opacity: 1;
            transform: scale(1);
        }

.form-check [type="checkbox"]:disabled:not(:checked) + .form-check-sign:before {
    box-shadow: none;
    border-color: #bbb;
    background-color: #ddd;
}

.form-check [type="checkbox"]:disabled:checked + .form-check-sign:before {
    box-shadow: none;
    border-color: #bbb;
    background-color: #ddd;
}

.form-check [type="checkbox"]:disabled:checked + .form-check-sign:after {
    color: #999;
}

.form-check [type="checkbox"]:disabled + .form-check-sign {
    color: #aaa;
}

.form-check [type="checkbox"]:checked:focus + .form-check-sign:before, .form-check [type="checkbox"]:not(:checked):focus + .form-check-sign:before {
    border: 1px solid #ccc;
}

.form-check-sign:hover:before {
    border: 1px solid #ccc !important;
}

.form-check {
    padding-left: 0.75rem;
}

.form-check-input {
    position: relative;
    margin-top: .3rem;
}

/*     Radio Input    */
.form-radio [type="radio"]:not(:checked), .form-radio [type="radio"]:checked {
    position: absolute;
    left: -9999px;
}

    .form-radio [type="radio"]:not(:checked) + .form-radio-sign, .form-radio [type="radio"]:checked + .form-radio-sign {
        color: #575962;
        position: relative;
        padding-left: 2em;
        cursor: pointer;
        line-height: 22px;
        font-weight: 400;
    }

        .form-radio [type="radio"]:not(:checked) + .form-radio-sign:before {
            content: "\f18a";
            font-size: 22px;
            font-family: LineAwesome;
            position: absolute;
            left: 0;
            top: auto;
            background: transparent;
            line-height: 1;
            color: #bbb;
        }

        .form-radio [type="radio"]:checked + .form-radio-sign:before {
            content: "\f18a";
            font-size: 22px;
            font-family: LineAwesome;
            position: absolute;
            left: 0;
            top: auto;
            background: transparent;
            line-height: 1;
            display: none;
        }

        .form-radio [type="radio"]:not(:checked) + .form-radio-sign:after, .form-radio [type="radio"]:checked + .form-radio-sign:after {
            content: "\f1bc";
            position: absolute;
            left: 0px;
            top: auto;
            text-align: center;
            font-size: 22px;
            color: #4D7CFE;
            transition: all .2s;
            line-height: 1;
            font-family: LineAwesome;
        }

        .form-radio [type="radio"]:not(:checked) + .form-radio-sign:after {
            opacity: 0;
            transform: scale(0);
        }

    .form-radio [type="radio"]:checked + .form-radio-sign {
        font-weight: 400;
    }

        .form-radio [type="radio"]:checked + .form-radio-sign:after {
            opacity: 1;
            transform: scale(1);
        }

.form-radio [type="radio"]:disabled:not(:checked) + .form-radio-sign:before {
    box-shadow: none;
    opacity: 0.65;
}

.form-radio [type="radio"]:disabled:checked + .form-radio-sign:before {
    box-shadow: none;
    opacity: 0.65;
}

.form-radio [type="radio"]:disabled:checked + .form-radio-sign:after {
    opacity: 0.65;
}

.form-radio [type="radio"]:disabled + .form-radio-sign {
    color: #aaa;
    opacity: 0.65;
}

.form-radio [type="radio"]:checked:focus + .form-radio-sign:before, .form-radio [type="radio"]:not(:checked):focus + .form-radio-sign:before {
    border: 1px solid #ccc;
}

.form-radio {
    padding-left: 0.75rem;
}

.form-radio-input {
    position: relative;
    margin-top: .3rem;
}

/*      Custom Checkbox      */
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #177dff;
}

.custom-checkbox.checkbox-default .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #282a3c;
}

.custom-checkbox.checkbox-primary .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #177dff;
}

.custom-checkbox.checkbox-secondary .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #716aca;
}

.custom-checkbox.checkbox-info .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #36a3f7;
}

.custom-checkbox.checkbox-success .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #35cd3a;
}

.custom-checkbox.checkbox-warning .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #ffa534;
}

.custom-checkbox.checkbox-danger .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #f3545d;
}

/*      Label      */
.col-form-label {
    line-height: 1.8;
}

.required-label {
    color: red;
}

.label-align-left {
    text-align: left;
}

.label-align-right {
    text-align: right;
}

.label-align-center {
    text-align: center;
}

/*     Input    */
.form-group, .form-check {
    margin-bottom: 0;
    padding: 10px;
}

    .form-group label, .form-check label {
        margin-bottom: .5rem;
        color: #495057;
        font-weight: 400;
        font-size: 1rem;
        white-space: nowrap;
    }

.form-group-default {
    background-color: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.07);
    border-radius: 4px;
    padding-top: 7px;
    padding-left: 12px;
    padding-right: 12px;
    padding-bottom: 4px;
    overflow: hidden;
    width: 100%;
    -webkit-transition: background-color .2s ease;
    transition: background-color .2s ease;
    margin-bottom: 15px;
}

    .form-group-default label {
        opacity: 1;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        backface-visibility: hidden;
        margin: 0;
        display: block;
        -webkit-transition: opacity .2s ease;
        transition: opacity .2s ease;
    }

        .form-group-default label:not(.error) {
            font-size: 10.5px !important;
            letter-spacing: .06em;
            text-transform: uppercase;
            font-weight: 400;
        }

    .form-group-default .form-control {
        border: 0;
        min-height: 25px;
        padding: 0;
        margin-top: 6px;
        background: 0 0;
        font-size: 13px;
    }

    .form-group-default select.form-control:not([size]):not([multiple]) {
        height: unset !important;
    }

    .form-group-default.active {
        border-color: rgba(0, 0, 0, 0.1) !important;
        background-color: #f0f0f0;
    }

        .form-group-default.active label {
            opacity: 0.5;
        }

.form-floating-label {
    position: relative;
}

    .form-floating-label .placeholder {
        position: absolute;
        padding: .375rem .75rem;
        transition: all .2s;
        opacity: 0.8;
        margin-bottom: 0 !important;
        font-size: 13px !important;
        font-weight: 400;
        top: 12px;
    }

    .form-floating-label .form-control:focus + .placeholder, .form-floating-label .form-control:valid + .placeholder, .form-floating-label .form-control.filled + .placeholder {
        font-size: 85% !important;
        transform: translate3d(0, -10px, 0);
        top: 0;
        opacity: 1;
        padding: .375rem 0 .75rem;
        font-weight: 600;
    }

    .form-floating-label .form-control.filled + .placeholder {
        color: #177dff !important;
    }

    .form-floating-label .form-control ::-webkit-input-placeholder {
        color: transparent;
    }

    .form-floating-label .form-control :-moz-placeholder {
        color: transparent;
    }

    .form-floating-label .form-control ::-moz-placeholder {
        color: transparent;
    }

    .form-floating-label .form-control :-ms-input-placeholder {
        color: transparent;
    }

    .form-floating-label .input-border-bottom + .placeholder {
        padding: .375rem 0 .75rem;
    }

.form-inline label {
    margin-bottom: 0 !important;
}

.input-fixed {
    width: 200px;
}

.form-control.input-full {
    width: 100% !important;
}

.has-success label {
    color: #35cd3a !important;
}

.has-success .form-control {
    border-color: #35cd3a !important;
    color: #35cd3a !important;
}

.has-success .input-group-text {
    border-color: #35cd3a !important;
    background: #35cd3a !important;
    color: #ffffff !important;
}

.has-error label {
    color: #f3545d !important;
}

.has-error .form-control {
    border-color: #f3545d !important;
    color: #f3545d !important;
}

.has-error .input-group-text {
    border-color: #f3545d !important;
    background: #f3545d !important;
    color: #ffffff !important;
}

.input-group label.error, .input-group label.success {
    width: 100%;
    order: 100;
}

.custom-control {
    position: relative;
}

    .custom-control.custom-radio, .custom-control.custom-checkbox {
        margin-bottom: 0;
        padding-left: 2em;
        cursor: pointer;
        line-height: 24px;
        margin-right: 25px;
        display: inline-block;
    }

        .custom-control.custom-radio label.error, .custom-control.custom-radio label.success, .custom-control.custom-checkbox label.error, .custom-control.custom-checkbox label.success {
            position: absolute;
            width: 100vh;
            top: 23px;
            left: 0;
        }

.has-feedback {
    position: relative;
}

.form-control-feedback {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 20px;
}

.has-success .form-control-feedback {
    color: #35cd3a;
}

.has-error .form-control-feedback {
    color: #f3545d;
}

.input-group.has-icon {
    border-radius: .25rem;
    border: 1px solid #ced4da;
}

    .input-group.has-success, .input-group.has-icon.has-success {
        border: 1px solid #35cd3a !important;
        color: #35cd3a;
    }

.input-group.has-error {
    border: 1px solid #f3545d !important;
    color: #f3545d;
}

.input-group.has-icon.has-error {
    border: 1px solid #f3545d !important;
    color: #f3545d;
}

.input-group.has-icon .form-control {
    border-radius: .25rem;
    border: 0px;
    position: relative;
}

.input-group.has-icon .input-group-icon {
    background: transparent;
    border: 0px;
}

.input-square {
    border-radius: 0px !important;
}

.input-pill {
    border-radius: 1.3rem !important;
}

.input-solid {
    background: #e8e8e8 !important;
    border-color: #e8e8e8 !important;
}

.input-border-bottom {
    border-width: 0 0 1px 0;
    border-radius: 0px;
    padding: .75rem 0;
}

/*     	Login     */
.login {
    background: #efefee;
}

    .login .wrapper.wrapper-login {
        display: flex;
        justify-content: center;
        align-items: center;
        height: unset;
        padding: 15px;
    }

        .login .wrapper.wrapper-login .container-login, .login .wrapper.wrapper-login .container-signup {
            width: 400px;
            background: #ffffff;
            padding: 0px 25px 0px 25px;
            border-radius: 5px;
            -webkit-box-shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, 0.03);
            -moz-box-shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, 0.03);
            box-shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, 0.03);
            border: 1px solid #ebecec;
        }

            .login .wrapper.wrapper-login .container-login h3, .login .wrapper.wrapper-login .container-signup h3 {
                font-size: 19px;
                font-weight: 600;
                margin-bottom: 25px;
            }

            .login .wrapper.wrapper-login .container-login .form-sub, .login .wrapper.wrapper-login .container-signup .form-sub {
                align-items: center;
                justify-content: space-between;
                padding: 8px 10px;
            }

            .login .wrapper.wrapper-login .container-login .btn-login, .login .wrapper.wrapper-login .container-signup .btn-login {
                padding: 15px 0;
                width: 135px;
            }

            .login .wrapper.wrapper-login .container-login .form-action, .login .wrapper.wrapper-login .container-signup .form-action {
                text-align: center;
                padding: 25px 10px 0;
            }

            .login .wrapper.wrapper-login .container-login .form-action-d-flex, .login .wrapper.wrapper-login .container-signup .form-action-d-flex {
                display: flex;
                align-items: center;
                justify-content: space-between;
            }

            .login .wrapper.wrapper-login .container-login .login-account, .login .wrapper.wrapper-login .container-signup .login-account {
                padding-top: 10px;
                text-align: center;
            }

            .login .wrapper.wrapper-login .container-signup .form-action {
                display: flex;
                justify-content: center;
            }

    .login .show-password {
        position: absolute;
        right: 20px;
        top: 50%;
        transform: translateY(-50%);
        font-size: 22px;
        cursor: pointer;
    }

    .login .custom-control-label {
        white-space: nowrap;
    }