html,body{
    margin:0;
    padding:0;
    width:100%;
    height:100%;
}
body{
    display:flex;
}
form{
    margin:auto;
    padding:0;
}
form button{
    width:100%;
    margin:0;
    padding-left:0;
    padding-right:0;
    font-size:18px!important;
}
.gray-bg {
    background:#f3f3f4 url('../img/logo/edumis-bg.png');
}
.login {
    width:300px!important;
    margin-bottom:0;
}
.login .login-logo {
    text-align:center;
}
.login .login-logo img {
    height:100px;
}
.login .login-logo img.logo-circle{
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;
}
.login .login-title {
    width:100%;
    color:#248fe2;
    font-size:43px;
    font-family:'RSU Regular';
    line-height:24px;
    text-align:center;
    padding:12px 0 5px 0;
}
.login .login-title-sub {
    width:100%;
    color:#3e5265;
    font-size:21px;
    text-shadow:1px 1px 1px #FFF;
    font-family:'RSU Regular';
    text-align:center;
    padding:0;
}
.login .btn-login-by-cmu {
    width:100%;
    color:#FFF;
    font-family:'RSU Regular';
    height:46px;
    padding:10px 10px 10px 5px;
    text-align:center;
    margin:0;
    border-color:#6868AC;
    background-color:#6868AC;
}
.login .btn-login-by-cmu .icon {
    width:auto;
    height:24px;
    float:left;
}
.login .btn-login-by-cmu .logo {
    width:auto;
    height:24px;
    float:right;
}
.login .btn-login-by-cmu .with {
    font-size:14px;
    line-height:13px;
    text-align:left;
    padding-left:38px;
}
.login .btn-login-by-cmu .with span {
    letter-spacing:0.35px;
}
.login .btn-login-by-cmu:hover {
    color:#FFF;
    border-color:#54549d;
    background-color:#54549d;
}
.login .btn-login-by-cmu.not-active:hover{
    cursor:default;
}
.login .btn-login-by-cmu.disabled {
    cursor:default;
    border-color:#999;
    background-color:#999;
    webkit-box-shadow:none;
    box-shadow:none;
}
.login .login-or {
    width:100%;
    padding:1px 0 13px 0;
    text-align:center;
}
.login .login-or .or-line {
    width:100%;
    margin-top:10px;
    border-top:1px solid #6868AC;
}
.login .login-or .or {
    color:white;
    font-size:12px;
    font-family:'RSU Regular';
    background:#6868AC;
    border:1px solid #6868AC;
    position:absolute;
    padding:1px 4px;
    margin:-10px 0 0 -12px;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;
}
.login .btn-login-by-google {
    width:100%;
    color:#FFF;
    font-family:'RSU Regular';
    height:46px;
    padding:10px 10px 10px 5px;
    text-align:center;
    margin:0;
    border-color:#4086f5;
    background-color:#4086f5;
}
.login .btn-login-by-google .icon {
    width:auto;
    height:32px;
    float:left;
    margin:-5px 0 0 2px;
    background:white;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%}
.login .btn-login-by-google .logo {
    font-size:34px;
    line-height:26px;
    font-family:'Syntha';
    letter-spacing:-1px;
    right:-18px;
    float:right;
    position:absolute;
}
.login .btn-login-by-google .logo>.by {
    font-size:21px;
    line-height:14px;
    font-family:'RSU Regular';
    float:right;
    position:absolute;
    margin-left:-17px;
}
.login .btn-login-by-google .logo>.by>span {
    font-size:14px;
}
.login .btn-login-by-google .with {
    font-size:14px;
    line-height:13px;
    text-align:left;
    padding-left:38px;
}
.login .btn-login-by-google .with span {
    letter-spacing:0.35px;
}
.login .btn-login-by-google:hover {
    color:#FFF;
    border-color:#206adf;
    background-color:#206adf;
}
.login .btn-login-by-google.active {
    cursor:default;
    border-color:#206adf;
    background-color:#206adf;
    webkit-box-shadow:none;
    box-shadow:none;
}
.login .login-at {
    padding:0 0 3px 0;
    text-align:center;
    margin-top:-10px;
}
.login .login-at .at {
    color:#04947e;
    font-size:12px;
    font-family:'RSU Regular';
    background:white;
    border:1px solid #04947e;
    position:relative;
    padding:2px 4px 0 4px;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;
}
.login .form-group {
    margin:0 0 2px 0;
}
.login .form-group .inner-addon {
    position:relative;
}
.login .form-group .inner-addon .form-control {
    color:#666;
    font-size:13px;
    line-height:18px;
    padding:5px 0 0 5px;
    background:none;
    border-top:none;
    border-color:#04947e;
}
.login .form-group .inner-addon .glyphicon {
    color:#333;
    font-size:20px;
    position:absolute;
    padding:10px 0 0 8px;
    pointer-events:none;
}
.login .form-group .inner-addon .glyphicon.glyphicon-envelope {
    padding-top:12px;
}
.login .form-group .left-addon .glyphicon {
    left:0px;
}
.login .form-group .left-addon input {
    padding-left:32px;
}
.login button[disabled],.login button[disabled]:focus,.login button[disabled]:hover {
    color:#000!important;
    border-color:#999!important;
    background-color:#999!important;
}
.login-footer {
    width:100%;
    color:#666;
    text-align:left;
    font-size:14px;
    letter-spacing:3px;
    font-family:'RSU Regular';
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    text-shadow:1px 1px 1px #FFF;
}
.login-footer.dev-th {
    padding-top:3px;
}
.login-footer.dev-en {
    color:#888;
    font-size:15px;
    letter-spacing:0.25px;
    line-height:14px;
    margin-top:-5px;
}
.login-phone {
    float:left;
    color:#666;
    text-align:right;
    margin:7px 0 0 228px;
    font-size:15px;
    line-height:11px;
    font-family:'RSU Regular';
    position:absolute;
}
.login-phone>small {
    font-size:14px;
    line-height:12px;
    letter-spacing:0.7px;
}
.run-start {
    width:50%!important;
    height:50%!important;
    background:url('../img/loading.gif') no-repeat center center!important;
    background-size:contain!important;
}
.blink {
    font-size:14px;
    padding-bottom:0;
    animation: blink-animation 1s steps(5, start) infinite;
    -webkit-animation: blink-animation 1s steps(5, start) infinite;
}
@keyframes blink-animation {
     to { visibility:hidden; } 
}
@-webkit-keyframes blink-animation {
     to { visibility:hidden; }
}
@media screen and (max-height:414px) {
    .login {
        height:320px;
        padding:0 0 0 0;
        background:url('../img/logo/270-transparent.png') no-repeat center center;
    }
    .login .login-logo {
        display:none;
    }
}