/* Default */
body { background: #ebeef0; cursor: default; font-family: Arial; font-size: 11px; margin: 0px; min-width: 1024px; width: 100%; zoom: 1; }

/* Login */
.cover { background: linear-gradient(40deg, #fafafa, #dbdee0); bottom: 0px; left: 0px; position: fixed; right: 0px; top: 0px; }
.page-box { margin: 50px auto; min-width: 960px; width: 80%; }
.info-box { margin-top: 35px; width: 450px; }
.info-box .title { color: #000; font-size: 36px; font-weight: bold; }
.info-box .desc { color: #999; font-size: 16px; margin: 10px 0px 30px 0px; max-width: 500px; }
.info-box .desc .mailto:hover { text-decoration: underline; }
.info-box .btn { background-color: #000; color: #fff; font-weight: bold !important; font-size: 14px; font-weight: normal; padding: 15px; }
.info-box .btn:hover { background-color: #444; }
.info-box .selection { background-color: #fff; border: solid 2px #e0e0e0; border-radius: 5px; box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.05); color: #999; font-size: 13px; font-weight: bold; margin: 0px 20px 20px 0px; opacity: 0; padding: 30px 10px; transition: all 0.3s; width: 100px; }
.info-box .selection .ticket { background: url(/images/default/icon-grey-file-plus.png) no-repeat center; height: 30px; transition: all 0.3s; width: 30px; }
.info-box .selection .status { background: url(/images/default/icon-grey-comment-check.png) no-repeat center; height: 30px; transition: all 0.3s; width: 30px; }
.info-box .selection .call { background: url(/images/default/icon-grey-phone.png) no-repeat center; height: 30px; transition: all 0.3s; width: 30px; }
.info-box .selection:hover { border: solid 2px #4285f4; color: #4285f4; }
.info-box .selection:hover .ticket { background: url(/images/default/icon-file-plus.png) no-repeat center; }
.info-box .selection:hover .status { background: url(/images/default/icon-comment-check.png) no-repeat center; }
.info-box .selection:hover .call { background: url(/images/default/icon-phone.png) no-repeat center; }
.login-box { background-color: rgba(255, 255, 255, 0.9); border-radius: 5px; box-shadow: 10px 10px 50px rgba(0, 0, 0, 0.15); height: 550px; width: 400px; }
.login-box .inner-col { padding: 20px 35px 130px 35px; }
.login-box .input-col { padding: 0px 5px 5px 0px; }
.login-box .input-col .reset { color: #999; font-size: 10px; }
.login-box .input-col .reset:hover { color: #4285f4; text-decoration: underline;}
.login-box .option-col { padding: 25px 5px 5px 0px; min-height: 50px; }
.login-box .top-col { padding: 40px 35px 20px 35px; }
.login-box .btn { background-color: #000; color: #fff; font-weight: bold !important; font-size: 14px; font-weight: normal; padding: 10px 15px; }
.login-box .btn:hover { background-color: #444; }
.footer-box { bottom: 0px; color: #000; font-size: 12px; padding: 20px 0px; position: fixed; width: 40%; }

@media (max-width: 768px) { 
    .page-box { margin: 0px; }
    .info-box { display: none; }
    .login-box { bottom: 0px; height: 100%; left: 0px; position: fixed; right: 0px; top: 0px; width: 100%; }
    .footer-box { display: none; }
}