﻿/*@import "base.css";*/
@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;700&family=Noto+Sans+TC:wght@400;700&display=swap');

body {
    font-family: 'Fira Code', monospace,'Noto Sans TC', sans-serif;
    /*width: 100%;*/
    min-height: 100vh;
    background-image: url(../Content/img/bg_3.png);
    background-size: cover;
    background-position: center center;
    /*background-color: #33354C;*/
    /*background-color: #3b8294;*/
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-top: var(--theme-navbar-height);
    padding-left: 0px;
    padding-right: 0px;
    min-height: calc(100vh - 79px);
}

.renderBody {
    padding-top: 2em;
}

.spinner {
    pointer-events: none;
}

.form-container .btn-submit {
    width: 100%;
    margin: 0;
    margin-top: 2em;
}

.login {
    width: 448px;
    height: 560px;
    background-color: #014872;
    border-radius: 8px;
    text-align: center;
    font-size: 18px;
    padding: 30.94px 0;
    box-shadow: 0px 4px 12px -4px #121212;
}
.login_logo{
    width:120px;
}
.login_title {
    color: white;
    font-size: 27px;
}
.login_form {
    max-width: 320px;
}

#RememberMe {
    width: 16px;
    height: 16px;
}
.remember_text {
    font-size: 1em;
    margin: 0 12.5px;
    color: white;
}
.login__button {
    width: 320px;
    height: 48px;
    background-color: #A0EACF;
    border: none;
    font-size: 24px;
    transition: all 0.3s;
    border-radius: 0.25rem;
}
.login__button:hover {
    background-color: hsl(158, 64%, 50%) !important;
}



@media (min-width:768px) {
    .form-container {
        max-width: 540px;
    }

}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus {
    background-color: #777;
    border-color: #fff
}

footer {
    height: 79px;
    /*padding-top: 1em;*/
    /*padding-bottom: 1em;*/
    text-align: center;
    color: var(--theme-text-color);
    background-color: var(--theme-footer-bg);
}

footer > p{
    font-size:var(--font-size-primary);
    font-weight:bold;
}

footer .navbar__logo {
    width: 140px;
    margin-bottom: 1em;
    margin-top: 1em;
}

h2,
.page-title {
    text-align: center;
    font-size: 40px;
    font-weight: bold;
    color: var(--theme-title-color);
    margin-bottom: 25px;
}

/*@media (max-width:992px){
    body{
        margin:0 40px;
    }
}*/

@media (max-width:768px) {

    h2,
    .page-title {
        font-size: 32px;
    }
}

@media (max-width:576px){
    .login {
        width: unset;
        background-color: transparent !important;
        box-shadow:unset;
    }
    .login_title {
        color: white;
        /*text-shadow: 2px 2px 0 white, 2px -2px 0 white, -2px -2px 0 white, -2px 2px 0 white, 2px 1px 0 white, 2px -1px 0 white, -2px -1px 0 white, -2px 1px 0 white, 2px 0px 0 white, 2px 0px 0 white, -2px 0px 0 white, -2px 0px 0 white, 1px 2px 0 white, 1px -2px 0 white, -1px -2px 0 white, -1px 2px 0 white, 1px 1px 0 white, 1px -1px 0 white, -1px -1px 0 white, -1px 1px 0 white, 1px 0px 0 white, 1px 0px 0 white, -1px 0px 0 white, -1px 0px 0 white, 0px 2px 0 white, 0px -2px 0 white, 0px -2px 0 white, 0px 2px 0 white, 0px 1px 0 white, 0px -1px 0 white, 0px -1px 0 white, 0px 1px 0 white, 0px 0px 0 white, 0px 0px 0 white, 0px 0px 0 white, 0px 0px 0 white, 0 0 0 white;*/
    }
    .remember_text{
        color:white;
    }
}