/* default */
body { cursor: default; font-family: Arial; font-size: 11px; height: 100%; margin: 0px; width: 100%; }

/* page */
#page { background: #fff url(/images/default/bg-front-05.jpg) no-repeat bottom; background-size: cover; bottom: 0px; left: 0px; height: 100%; min-width: 750px; position: fixed; right: 0px; top: 0px; width: 100%; }
#page .left-panel { background-color: rgba(251, 252, 253, 0.95); border-radius: 10px; bottom: 70px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2); left: 70px; max-height: 650px; min-height: 600px; position: absolute; top: 20px; width: 450px; z-index: 20; }
#page .left-panel .inner { margin: 0px auto; width: 380px; }
#page .left-panel .header { padding: 30px 0px 10px 0px; }
#page .left-panel .header .logo { background: url(/images/logo.png) no-repeat center; background-size: cover; float: left; height: 42px; margin: 0px 0px 0px 10px; width: 54px; }
#page .left-panel .header .name { color: #9fa4b1; font-size: 19px; font-weight: bold; float: left; margin: 10px 0px 10px 10px; }
#page .left-panel .title { color: #000; font-size: 20px; font-weight: bold; height: 24px; padding: 10px; }
#page .left-panel .title .loading-box { background: #fff url(/images/default/loading.gif) center no-repeat; height: 24px; width: 24px; }
#page .left-panel .apps { bottom: 20px; padding: 10px; position: absolute; width: 100%; }
#page .right-panel { bottom: 0px; min-height: 500px; min-width: 1800px; position: fixed; top: 70px; width: calc(100% - 600px); z-index: 10; }
#page .right-panel .content { margin: 50px auto; width: 620px; }
#page .right-panel .content .logo { background: url(/images/logo.png) no-repeat center; background-size: cover; height: 110px; margin: auto; width: 138px; }
#page .right-panel .content .content-title { color: #fff; font-size: 35px; font-weight: bold; font-style: italic; }
#page .right-panel .content .content-desc { color: #fff; font-size: 25px; font-weight: normal; }

@media (max-width: 737px)
{
    #page { background-image: none !important; min-width: unset !important; }
    #page .left-panel { background-color: #f7f8f9; bottom: 0px; left: 0px; max-height: unset; min-width: 300px; padding: 0px 20px; right: 0px; top: 0px; width: calc(100% - 40px); }
    #page .left-panel .inner { margin: 0px auto; width: auto; }
    #page .right-panel { display: none !important; }
    #footer { display: none; }
}

/* footer */
#footer { bottom: 0px; color: #fff; font-size: 11px; right: 10px; margin: 5px auto; padding: 5px 0px; position: fixed; text-shadow: 1px 1px 3px #000; width: 330px; z-index: 30; }
#footer .left { float: left; padding-left: 5px; }
#footer .right { float: right; padding-right: 5px; }
#footer .text { padding: 0px 5px; }
#footer .link { color: #777; font-size: 11px; margin: 0px 5px; transition: color 0.3s; }
#footer .link:hover { color: #3f51b5; }

@keyframes updown { 0% { background-position: top; } 50% { background-position: bottom; } 100% { background-position: top; } }