﻿body{
    background-color:#ffffff;
}
.Login_top{
    width:100%;
    height:260px;
    border-bottom:1px solid #eaeaea;
    text-align:center;
    background-image:url("../../Img/Login/login_top_bg.png");
    /*background-repeat:no-repeat;*/
    position:relative;
    overflow:hidden;
}
.Login_top img{
    width:95px;
    height:95px;
    margin:50px 0 0 0;
}
.Login_top p{
    color:#ffffff;
    margin:20px 0 0 0;
    font-size:18px;
}
.Login_top ul{
    width:100%;
    margin:0 0 3px 0;
    padding:0;
    position:absolute;
    bottom:0;
}
.Login_top ul li{
    width:50%;
    float:left;
    color:#ffffff;
    font-size:16px;
    font-family:"微软雅黑";
    list-style-type:none;
    opacity:0.5;
}
.Login_top ul li span {
    color:#ffffff;
}
.download_tip{
    position:absolute;
    right:0;
    bottom:0px; 
    font-size:14px;
    cursor:pointer;
}
.Login_contrain{
    width:100%;
    margin:0;
    padding:0;
    overflow:hidden;
    background-color:#ffffff;
}
.Login_main{
    width:100%;
    padding:50px 0 0 0;
    text-align:center;
}

.mid_input{
    width: 80%;
    height: 40px;
    border:1px solid #808080;
    background-color:#ffffff;
    border-radius: 40px;
    margin:20px auto 0;
    overflow:hidden;
    padding:0;
    text-align:left;
}
.Input_img{
    width:25%;
    height:100%;
    float:left;
    overflow:hidden;
    line-height:40px;
    padding:0 0 0 5%;
    font-family:"微软雅黑";
}
.Input_img img{
    width:25px;
    height:25px;
    margin:8px 0 0 15px;
}
.us_input{
    width:70%;
    height: 30px;
    border:none;
    background-color:#ffffff;
    font-family:"微软雅黑";
    font-size:16px;
    outline:none;
    float:left;
    margin:4px 0 0 0;
}
.mid_btn{
    width: 80%;
    height: 42px;
    background-color:#eb512b;
    border-radius: 40px;
    margin:10px auto 0;
    line-height:42px;
    border:none;
    color:#ffffff;
    font-size:16px;
    font-family:"微软雅黑";
    outline:none;
    cursor:pointer;
}
.getCode{
    float:right;
    width:45%;
    border-left:1px solid #808080;
    line-height:40px;
    font-size:14px;
    font-family:"微软雅黑";
    color:#eb512b;
    text-align:center;
}
.getCode_input{
    width:49%;
    height: 30px;
    border:none;
    background-color:#ffffff;
    font-family:"微软雅黑";
    font-size:16px;
    outline:none;
    float:right;
    margin:4px 0 0 0;
}
.zhezhao{
    width:100%;
    height:100%;
    background-color:#000000;
    position:fixed;
    opacity:0;
    top:0;
    left:0;
    display:none;
}
.successWindow{
    width:300px;
    height:160px;
    background-color:#000000;
    opacity:0.7;
    position:fixed;
    top:170px;
    left:50%;
    margin:0 0 0 -150px;
    border-radius:10px;
    color:#ffffff;
    overflow:hidden;
    display:none;
}
.top_succ{
    width:90%;
    margin:0 auto;
    border-bottom:1px solid #ffffff;
    height:80px;
    line-height:120px;
    text-align:center;
}
.bottom_succ{
    width:90%;
    margin:0 auto;
    border-bottom:1px solid #ffffff;
    height:80px;
    line-height:40px;
    text-align:center;
}
.main_fail{
    width:90%;
    margin:10px auto 0;
    text-indent:20px;
}
.fail_btn{
    width:100px;
    height:25px;
    font-size:14px;
    color:#ffffff;
    margin:20px auto 0;
    border:1px solid #ffffff;
    text-align:center;
    border-radius:25px;
    line-height:25px;
    cursor:pointer;
}
.success_InviteWorkmate{
    width:300px;
    height:463px;
    background-image:url("../../Img/Login/bg_successInviteWorkmate.png");
    position:absolute;
    top:50%;
    left:50%;
    margin:-231px 0 0 -150px;
    text-align:center;
    display:none;
}
.successWindow img{
    width:20px;
    height:20px;
    float:right;
    margin:5px 5px 0 0;
}
.success_InviteWorkmate img{
    width:20px;
    height:20px;
    float:right;
    margin:5px 5px 0 0;
}
.en_mid_btn{
    width: 80%;
    height: 42px;
    background-color:#ffffff;
    border-radius: 40px;
    margin:30px 0 0 0;
    border:1px solid #eb512b;
    color:#eb512b;
    font-size:16px;
    font-family:"微软雅黑";
    outline:none;
    font-weight:bold;
}
.en_mid_btn_no{
    width: 100%;
    height: 42px;
    background-color:#ffffff;
    margin:50px 0 0 0;
    color:#eb512b;
    font-size:16px;
    font-family:"微软雅黑";
    outline:none;
    font-weight:bold;
}
.en_p1{
    font-size:18px;
    color:#ffffff;
    margin:178px 0 30px 0;
    font-weight: bold;
}
.en_p2{
    font-size:14px;
    color:#000000;
    margin:10px 0 0 0;
}
.en_sp1{
    font-size:18px;
    color:#ffffff;
    margin:165px 0 5px 0;
}
.en_sp2{
    font-size:18px;
    color:#ffffff;
}
.co_eb{
    color:#eb512b; 
}
.tip_p{
    width: 80%;
    text-align:left;
    margin: 10px auto 0;
    font-size:14px;
}
.span_underline{
    border-bottom:3px solid #ffffff;
    height:30px;
    display:inline-block;
}
@media (min-width:600px){body{width:375px}}


/* Timer*/
.timer{
    width: 24px;
    height: 24px;
    background-color: transparent;
    box-shadow: inset 0px 0px 0px 2px #fff;
    border-radius: 50%;
    position: absolute;
    top: 50px;
    right: 70px;
    margin: 38px auto;/* Not necessary- its only for layouting*/
 }
.timer:after, .timer:before{
    position: absolute;
    content:"";
    background-color: #fff;
}
.timer:after{
    width: 10px;
    height: 2px;
    top: 11px;
    left: 11px;
    -webkit-transform-origin: 1px 1px;
       -moz-transform-origin: 1px 1px;
            transform-origin: 1px 1px;
    -webkit-animation: minhand 2s linear infinite;
       -moz-animation: minhand 2s linear infinite;
            animation: minhand 2s linear infinite;
}

.timer:before{
    width: 8px;
    height: 2px;
    top: 11px;
    left: 11px;
    -webkit-transform-origin: 1px 1px;
       -moz-transform-origin: 1px 1px;
            transform-origin: 1px 1px;
    -webkit-animation: hrhand 8s linear infinite;
       -moz-animation: hrhand 8s linear infinite;
            animation: hrhand 8s linear infinite;
}

@-webkit-keyframes minhand{
    0%{-webkit-transform:rotate(0deg)}
    100%{-webkit-transform:rotate(360deg)}
}
@-moz-keyframes minhand{
    0%{-moz-transform:rotate(0deg)}
    100%{-moz-transform:rotate(360deg)}
}
@keyframes minhand{
    0%{transform:rotate(0deg)}
    100%{transform:rotate(360deg)}
}

@-webkit-keyframes hrhand{
    0%{-webkit-transform:rotate(0deg)}
    100%{-webkit-transform:rotate(360deg)}
}
@-moz-keyframes hrhand{
    0%{-moz-transform:rotate(0deg)}
    100%{-moz-transform:rotate(360deg)}
}
@keyframes hrhand{
    0%{transform:rotate(0deg)}
    100%{transform:rotate(360deg)}
}