
.theme-secondary {
    background: linear-gradient(#6c757d,#6c757d);
}

    .theme-secondary a {
        color: #5a6268;
    }

        .theme-secondary a:hover {
            color: #6c757d;
        }

    .theme-secondary .btn-primary {
        color: #fff;
        background-color: #6c757d;
        border-color: #6c757d
    }

        .theme-secondary .btn-primary:hover {
            color: #fff;
            background-color: #5a6268;
            border-color: #545b62
        }

        .theme-secondary .btn-primary.focus, .theme-secondary .btn-primary:focus {
            box-shadow: 0 0 0 .2rem rgba(130,138,145,.5)
        }

        .theme-secondary .btn-primary.disabled, .theme-secondary .btn-primary:disabled {
            color: #fff;
            background-color: #6c757d;
            border-color: #6c757d
        }

        .theme-secondary .btn-primary:not(:disabled):not(.disabled).active, .theme-secondary .btn-primary:not(:disabled):not(.disabled):active, .theme-secondary .show > .btn-primary.dropdown-toggle {
            color: #fff;
            background-color: #545b62;
            border-color: #4e555b
        }

            .theme-secondary .btn-primary:not(:disabled):not(.disabled).active:focus, .theme-secondary .btn-primary:not(:disabled):not(.disabled):active:focus, .theme-secondary .show > .btn-primary.dropdown-toggle:focus {
                box-shadow: 0 0 0 .2rem rgba(130,138,145,.5)
            }

    .theme-secondary [type="checkbox"].filled-in:checked + label:after {
        background-color: #5a6268;
        border-color: #545b62
    }

    .theme-secondary .btn-check:focus + .btn-primary, .theme-secondary .btn-primary:focus {
        color: #fff;
        background-color: #565e64;
        border-color: #51585e;
    }


.theme-green {
    background: linear-gradient(#009688,#198754);
}

    .theme-green a {
        color: #28a745;
    }

        .theme-green a:hover {
            color: #6c757d;
        }

    .theme-green .btn-primary {
        color: #fff;
        background-color: #28a745;
        border-color: #28a745
    }

        .theme-green .btn-primary:hover {
            color: #fff;
            background-color: #218838;
            border-color: #1e7e34
        }

        .theme-green .btn-primary.focus, .theme-green .btn-primary:focus {
            box-shadow: 0 0 0 .2rem rgba(72,180,97,.5)
        }

        .theme-green .btn-primary.disabled, .theme-green .btn-primary:disabled {
            color: #fff;
            background-color: #28a745;
            border-color: #28a745
        }

        .theme-green .btn-primary:not(:disabled):not(.disabled).active, .theme-green .btn-primary:not(:disabled):not(.disabled):active, .theme-green .show > .btn-primary.dropdown-toggle {
            color: #fff;
            background-color: #1e7e34;
            border-color: #1c7430
        }

            .theme-green .btn-primary:not(:disabled):not(.disabled).active:focus, .theme-green .btn-primary:not(:disabled):not(.disabled):active:focus, .theme-green .show > .btn-primary.dropdown-toggle:focus {
                box-shadow: 0 0 0 .2rem rgba(72,180,97,.5)
            }

    .theme-green [type="checkbox"].filled-in:checked + label:after {
        background-color: #28a745;
        border-color: #28a745
    }

    .theme-green .btn-check:focus + .btn-primary, .theme-green .btn-primary:focus {
        color: #fff;
        background-color: #157347;
        border-color: #146c43;
    }

.theme-info {
    background: -webkit-linear-gradient(bottom,#25cff2,#0d6efd);
}

    .theme-info a {
        color: #138496;
    }

        .theme-info a:hover {
            color: #117a8b;
        }

    .theme-info .btn-primary {
        color: #fff;
        background-color: #17a2b8;
        border-color: #17a2b8
    }

        .theme-info .btn-primary:hover {
            color: #fff;
            background-color: #138496;
            border-color: #117a8b
        }

        .theme-info.btn-primary.focus, .theme-info .btn-primary:focus {
            box-shadow: 0 0 0 .2rem rgba(58,176,195,.5)
        }

        .theme-info .btn-primary.disabled, .theme-info .btn-primary:disabled {
            color: #fff;
            background-color: #17a2b8;
            border-color: #17a2b8
        }

        .theme-info .btn-primary:not(:disabled):not(.disabled).active, .theme-info .btn-primary:not(:disabled):not(.disabled):active, .theme-info .show > .btn-primary.dropdown-toggle {
            color: #fff;
            background-color: #117a8b;
            border-color: #10707f
        }

            .theme-info .btn-primary:not(:disabled):not(.disabled).active:focus, .theme-info .btn-primary:not(:disabled):not(.disabled):active:focus, .theme-info .show > .btn-primary.dropdown-toggle:focus {
                box-shadow: 0 0 0 .2rem rgba(58,176,195,.5)
            }


    .theme-info [type="checkbox"].filled-in:checked + label:after {
        background-color: #17a2b8;
        border-color: #17a2b8
    }

    .theme-info .btn-check:focus + .btn-primary, .theme-info .btn-primary:focus {
        color: #000;
        background-color: #3dd5f3;
        border-color: #25cff2;
    }

.theme-red {
    background: linear-gradient(#0250c5,#d43f8d);
}

    .theme-red a {
        color: #bd2130;
    }

        .theme-red a:hover {
            color: #dc3545;
        }

    .theme-red .btn-primary {
        color: #fff;
        background-color: #dc3545;
        border-color: #dc3545
    }

        .theme-red .btn-primary:hover {
            color: #fff;
            background-color: #c82333;
            border-color: #bd2130
        }

        .theme-red .btn-primary.focus, .theme-red .btn-primary:focus {
            box-shadow: 0 0 0 .2rem rgba(225,83,97,.5)
        }

        .theme-red .btn-primary.disabled, .theme-red .btn-primary:disabled {
            color: #fff;
            background-color: #dc3545;
            border-color: #dc3545
        }

        .theme-red .btn-primary:not(:disabled):not(.disabled).active, .theme-red .btn-primary:not(:disabled):not(.disabled):active, .theme-red .show > .btn-primary.dropdown-toggle {
            color: #fff;
            background-color: #bd2130;
            border-color: #b21f2d
        }

            .theme-red .btn-primary:not(:disabled):not(.disabled).active:focus, .theme-red .btn-primary:not(:disabled):not(.disabled):active:focus, .theme-red .show > .btn-primary.dropdown-toggle:focus {
                box-shadow: 0 0 0 .2rem rgba(225,83,97,.5)
            }

    .theme-red [type="checkbox"].filled-in:checked + label:after {
        background-color: #dc3545;
        border-color: #dc3545
    }

    .theme-red .btn-check:focus + .btn-primary, .theme-red .btn-primary:focus {
        color: #fff;
        background-color: #b02a37;
        border-color: #a52834;
    }


.theme-dark {
    background: linear-gradient(#343a40,#343a40);
}

    .theme-dark a {
        color: #bd2130;
    }

        .theme-dark a:hover {
            color: #dc3545;
        }

    .theme-dark .btn-primary {
        color: #fff;
        background-color: #343a40;
        border-color: #343a40
    }

        .theme-dark .btn-primary:hover {
            color: #fff;
            background-color: #23272b;
            border-color: #1d2124
        }

        .theme-dark .btn-primary.focus, .theme-dark .btn-primary:focus {
            box-shadow: 0 0 0 .2rem rgba(82,88,93,.5)
        }

        .theme-dark .btn-primary.disabled, .theme-dark .btn-primary:disabled {
            color: #fff;
            background-color: #343a40;
            border-color: #343a40
        }

        .theme-dark .btn-primary:not(:disabled):not(.disabled).active, .theme-dark .btn-primary:not(:disabled):not(.disabled):active, .theme-dark .show > .btn-primary.dropdown-toggle {
            color: #fff;
            background-color: #1d2124;
            border-color: #171a1d
        }

            .theme-dark .btn-primary:not(:disabled):not(.disabled).active:focus, .theme-dark .btn-primary:not(:disabled):not(.disabled):active:focus, .theme-dark .show > .btn-primary.dropdown-toggle:focus {
                box-shadow: 0 0 0 .2rem rgba(82,88,93,.5)
            }

    .theme-dark [type="checkbox"].filled-in:checked + label:after {
        background-color: #23272b;
        border-color: #1d2124
    }

    .theme-dark .btn-check:focus + .btn-primary, .theme-dark .btn-primary:focus {
        color: #fff;
        background-color: #1a1e21;
        border-color: #191c1f;
    }

a {
    text-decoration: none !important;
}

.btn {
    height: calc(1.5em + 0.75rem + 2px);
    font-size: inherit;
}

.form-control {
    display: block;
    width: 100%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: inherit;
}

.cursor-pointer {
    cursor: pointer;
}


.wrap-container {
    min-height: 400px;
    height: 100vh;
}

.wrap-justify {
    margin: auto;
    height: 100vh;
    min-width: 420px;
    position: relative;
}

.wrap {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 2.5rem 1.5rem !important;
    max-width: 460px;
}

.signin-form .wrap .img {
    height: 200px;
}

.signin-form .login-wrap {
    padding: 4.5rem 1.5em !important;
    background: #fff;
    border-radius: 0.15rem;
    -webkit-box-shadow: 0px 10px 34px -15px rgba(0, 0, 0, 0.24);
    -moz-box-shadow: 0px 10px 34px -15px rgba(0, 0, 0, 0.24);
    box-shadow: 0px 10px 34px -15px rgba(0, 0, 0, 0.24);
}

    .signin-form .login-wrap h3 {
        font-weight: 400;
        background: linear-gradient(90deg,#015aad,#00b74f);
        background: -webkit-linear-gradient(0,#015aad,#00b74f);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        display: inline-block;
        margin: 0;
    }

.signin-form .form-group {
    position: relative;
    z-index: 0;
    padding-bottom: 24px !important;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.signin-form .field-icon {
    position: absolute;
    top: 29%;
    right: 15px;
    cursor: pointer;
    color: rgba(0, 0, 0, 0.3);
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.signin-form.-label .field-icon {
    top: 50%;
}

.form-group .-label .field-icon {
    top: 50%;
}

.signin-form .btn {
    cursor: pointer;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border-radius: 0.15rem;
}

    .signin-form .btn:hover, .signin-formp .btn:active, .signin-form .btn:focus {
        outline: none;
    }

.signin-form i {
    color: #98a4b9;
    width: 17px;
    height: 17px;
}

.signin-form .action-text {
    color: #495057;
}

.signin-form .ft-hr {
    margin-top: 50px;
    border-top: 1px solid #ced4da;
    background: none;
    color: #495057;
}

.signin-form .ft-time {
    color: #9d9595;
}

.signin-form .text-note {
    text-align: justify;
}
