html,body { background: url("../img/index/full-screen-bg.jpg") center top no-repeat #0f131c; background-size:cover; height: 100vh;}


/* Main Box Star */
.main-box { position: fixed; top: 20%; left: 0; width: 100%;}
    .main-box .frame { position: relative; width: 600px; min-height: 320px; max-height: 660px; margin:0 auto; padding: 60px; background: rgba(255, 255, 255, 0.78); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
    .main-box .frame:after { content: ''; position: absolute; left: 0; top: 0; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; width: 10px; height: 10px; background: rgba(231, 120, 23, 0.88); animation:aroundMove 5s infinite; -moz-animation:aroundMove 5s infinite; -webkit-animation:aroundMove 5s infinite; -o-animation:aroundMove 5s infinite; }

    .main-box .frame .logo { text-align: center;}

    .main-box .frame ul.list { margin-top: 30px;}
    .main-box .frame ul.list li { border-bottom: 1px #ababab solid; height: 45px; line-height: 45px; overflow: hidden;}
    .main-box .frame ul.list li a { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s;}
    .main-box .frame ul.list li a:hover { color: #e77817;}

    .main-box .frame ul.list li .names { float: left; width: 80px;}
    .main-box .frame ul.list li .entrys { float: left; width: calc(100% - 90px); overflow: hidden;}

    .main-box .frame ul.list li span.name { width: 80px; display: inline-block;}
    .main-box .frame ul.list li .lefts { float: left;}
    .main-box .frame ul.list li .rights { float: right;}
    .main-box .frame ul.list li:last-child { border-bottom: none;}
    .main-box .frame ul.list li input.inputs { outline: 0; background: transparent; border: 0; width: 100%; height: 45px; line-height: 45px; vertical-align: unset;}

    .main-box .frame ul.list li.code .entrys { width: calc(100% - 190px);}
    .main-box .frame ul.list li.code input.captcha { float: right; border: 0; background: transparent;}

    .main-box .frame ul.list li.mobile .entrys { width: calc(100% - 190px);}
    .main-box .frame ul.list li.mobile a.code { float: right; width: 100px; text-align: right;}

    .main-box .frame ul.list li.pass .entrys { width: calc(100% - 190px);}
    .main-box .frame ul.list li.pass a.forget { float: right; width: 100px; text-align: right;}

    .main-box .frame ul.list li input.checkboxs { margin: -2px 0 0;}

    .main-box .frame .button { margin: 10px auto 0 auto; }
    .main-box .frame .button button { width: 100%; outline: 0; border: none; background-color: #28166f; color: #FFF; overflow: hidden; font-weight: 500; font-size: 15px; line-height: 1; display: block; position: relative; letter-spacing: 10px; padding: 12px 0; text-align: center; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; transition:all .6s; -moz-transition:all .6s; -webkit-transition:all .6s; -o-transition:all .6s;}
    .main-box .frame .button button:before {content: "";position: absolute;display: block;transition: all .6s;width: 100%;height: 0;border-radius: 50%;left: 50%;top: 50%;padding-top: 100%;transform: translateX(-50%) translateY(-50%);-webkit-animation: wave 1.3s infinite;animation: wave 1.3s infinite;z-index: 1;}
/* Main Box End */

/* <1920的设备 */
@media screen and (max-width: 1920px){

}

/* <1680的设备 */
@media screen and (max-width: 1680px){

}

/* <1500的设备 */
@media screen and (max-width: 1500px){

}

/* <1440的设备 */
@media screen and (max-width: 1440px){


}

/* <1366的设备 */
@media screen and (max-width: 1366px){

}

/* <1200的设备 */
@media screen and (max-width: 1200px){

}

/* <991的设备 */
@media screen and (max-width: 991px){

    /* Main Box Star */
    .main-box .frame { position: relative; width: auto; padding: 20px 10px; margin-left: 10px; margin-right: 10px;}
    .main-box .frame ul.list { margin-top: 15px;}
  /* Main Box End */


}

/* <767的设备 */
@media screen and (max-width: 767px){

}

/* <450的设备 */
@media screen and (max-width: 450px){

}