@charset "utf-8"; #login-view { background: #eceff1; } #stage { margin-top: 40px; position: absolute; width: 100%; } #login { width: 398px; margin: 0 auto; background-color: #fff; -moz-box-shadow: 0 10px 20px rgba(38,50,56,.15); /* 老的 Firefox */ box-shadow: 0 10px 20px rgba(38,50,56,.15); position: relative; border-radius: 3px; } .logo-home { width: 480px; margin: 0 auto; } .wrapper{ height:160px; background-color: #2086ee; position: relative; overflow: hidden; } .login-logo{ padding-top: 90px; font-weight: normal; font-size: 23px; font-family: "Microsoft YaHei"; height: 100%; text-align: center; position: relative; z-index: 999; color: #23a0ff; } .login-logo img{ top:0px; position: relative; cursor: pointer; width: 80px; height: auto; padding-right: 10px; } .login-logo span { color: #dc4415; } .bg-bubbles { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; } .bg-bubbles li { position: absolute; list-style: none; display: block; width: 40px; height: 40px; background-color: rgba(255, 255, 255, 0.15); bottom: -160px; -webkit-animation: square 25s infinite; animation: square 25s infinite; -webkit-transition-timing-function: linear; transition-timing-function: linear; } .bg-bubbles li:nth-child(1) { left: 10%; } .bg-bubbles li:nth-child(2) { left: 20%; width: 50px; height: 50px; -webkit-animation-delay: 2s; animation-delay: 2s; -webkit-animation-duration: 17s; animation-duration: 17s; } .bg-bubbles li:nth-child(3) { left: 25%; -webkit-animation-delay: 4s; animation-delay: 4s; } .bg-bubbles li:nth-child(4) { left: 40%; width: 60px; height: 60px; -webkit-animation-duration: 22s; animation-duration: 22s; background-color: rgba(255, 255, 255, 0.25); } .bg-bubbles li:nth-child(5) { left: 70%; } .bg-bubbles li:nth-child(6) { left: 80%; width: 80px; height: 80px; -webkit-animation-delay: 3s; animation-delay: 3s; background-color: rgba(255, 255, 255, 0.2); } .bg-bubbles li:nth-child(7) { left: 32%; width: 110px; height: 110px; -webkit-animation-delay: 7s; animation-delay: 7s; } .bg-bubbles li:nth-child(8) { left: 55%; width: 20px; height: 20px; -webkit-animation-delay: 15s; animation-delay: 15s; -webkit-animation-duration: 40s; animation-duration: 40s; } .bg-bubbles li:nth-child(9) { left: 25%; width: 10px; height: 10px; -webkit-animation-delay: 2s; animation-delay: 2s; -webkit-animation-duration: 40s; animation-duration: 40s; background-color: rgba(255, 255, 255, 0.3); } .bg-bubbles li:nth-child(10) { left: 90%; width: 160px; height: 160px; -webkit-animation-delay: 11s; animation-delay: 11s; } @-webkit-keyframes square { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { -webkit-transform: translateY(-500px) rotate(600deg); transform: translateY(-500px) rotate(600deg); } } @keyframes square { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { -webkit-transform: translateY(-500px) rotate(600deg); transform: translateY(-500px) rotate(600deg); } } #content { padding: 40px 50px; } input:-webkit-autofill, input:-webkit-autofill:focus{ box-shadow: 0 0 0 1000px rgba(205, 204, 204,1) inset !important; -webkit-box-shadow: 0 0 0 1000px rgba(205, 204, 204,1) inset !important; } .login-username{ margin: 0 auto; height:44px; position:relative; margin-bottom: 20px; } .login-username span{ background: url(../images/login_user.png) 0 0 #cdcccc no-repeat; position:absolute; left:0; top:0; width:50px; height:44px; display:block; } .login-username span.b{ background: url(../images/login_pas.png) 0 0 #cdcccc no-repeat; } .form-control { height: 42px; width: 248px; margin-left: 50px; line-height: 42px; border-radius: 0; display:block; padding: 0 0 0 10px; outline: none; } #content input.wyy{ width:180px !important; background: none; float: left; border: 1px solid #b8b7b7; height: 36px; line-height: 36px; margin-left: 0; } #content input.wyy:focus{ border:1px solid #66afe9; } #content img{ float: right; } .form-control { height: 44px; } #btn-login { height: 46px;} #errors-div { margin-top: 15px; } .login-remenber{ margin-bottom: 25px; color:#777; overflow: hidden; width: 100%; } .login-remenber label{ font-weight: normal; font-size: 14px; } .copyright { color: #eaeaea; text-align: center; line-height: 50px; font-size: 14px; background: -webkit-linear-gradient(top,#f4511e,#d84315); background: linear-gradient(180deg,#f4511e 0,#d84315); } .copyright a { color: #eaeaea; } .copyright a:visited { color: #eaeaea; text-decoration: none; } .copyright a:hover { color: #fff; text-decoration: none; } .login-error{ position: fixed; color:#ff9700; font-weight: bold; display: none; width:400px; line-height: 40px; background: rgba(255,255,255,0.94); left: 50%; margin-left: -230px; top:280px; z-index: 9999; text-align: center; padding:20px 0px; font-size: 14px; -moz-box-shadow: 2px 2px 3px #000; box-shadow: 2px 2px 3px #000; } .login-error img{ width:20px; height: 16px; padding-right: 5px; }