body{ font-family:"微软雅黑","Tahoma"; font-size: 14px; overflow:hidden; } h1, h2, h3, h4, h5, h6{ margin:0; padding:0; } dl,ul,dd{ margin:0; padding:0; } dl li,ul li{ list-style-type: none; } dd { margin-left:0 } a{ color:#0096C4; outline:none; text-decoration: none; } a:hover{ color:#007ca2; } a:active{ color:#007ca2; } a:focus{ color:#007ca2; text-decoration: none; } a img { border:0 none } img { vertical-align:middle; border:0px } table { border-collapse:collapse } .login-wrap{ position:fixed; width:100%; height:100%; background-image: -webkit-linear-gradient(right,#00c3ec 0,#00c89d 100%); background-image: linear-gradient(to left,#00c3ec 0,#00c89d 100%); box-shadow: 0 -1px 6px rgba(0,0,0,.05) inset; } .login-title{ width:400px; color:#fff; text-align: center; padding:30px 0; } .login-form{ position:absolute; top:40%; left:50%; margin-top:-175px; margin-left: -200px; } .login-form form{ width:400px; height:280px; background:#fff; padding-top: 70px; padding-left:35px; padding-right: 35px; border-radius: 5px; -webkit-box-shadow:0 0 10px rgba(150, 150, 150, .5); -moz-box-shadow:0 0 10px rgba(150, 150, 150, .5); box-shadow:0 0 10px rgba(150, 150, 150, .5); } .login-form .input-group-addon{ width:38px; text-align: center; } .top-wrap{ font-size: 18px; padding:0 20px; color:#fff; height: 50px; line-height: 50px; background-image: -webkit-linear-gradient(right,#00c3ec 0,#00c89d 100%); background-image: linear-gradient(to left,#00c3ec 0,#00c89d 100%); box-shadow: 0 -1px 6px rgba(0,0,0,.05) inset; min-width: 1100px; } .top-title{ line-height: 50px; } .user-wrap{ color:#fff; } .user-wrap:hover{ color:#0090ad; text-decoration: none; } .avatar-img{ margin-right: 3px; border-radius: 15px; } .user-name{ font-size: 16px; color:#fff; } .ion-off{ display: inline-block; width:30px; text-align: center; color:#0090ad; } .left-nav{ position: fixed; z-index: 99; width:70px; height:100%; left:0; top:50px; background:#47606C; font-size: 14px; } .left-nav ul li a{ display:inline-block; width:70px; text-align: center; padding:13px 0; color:#8abbd2; } .left-nav ul li a:hover{ background:#374C59; color:#f0f0f0; text-decoration: none; } .left-nav ul li a .icon{ line-height: 26px; font-size: 28px; display:block; } .left-nav ul li a.active{ background:#374C59; color:#f0f0f0; border-top: 1px solid #2a4251; border-bottom: 1px solid #2a4251; } .main-wrap{ margin:50px 0 0 70px; padding-top: 15px; padding-bottom: 25px; overflow-y:auto; } .main-title{ display:block; } .main-title .form-control{ width:300px; } .side-wrap{ position:absolute; z-index: 99; right:-700px; /*right:0;*/ top:50px; background:#fff; width:700px; height:100%; overflow-y:auto; -webkit-box-shadow:0 0 10px rgba(150, 150, 150, .5); -moz-box-shadow:0 0 10px rgba(150, 150, 150, .5); box-shadow:0 0 10px rgba(150, 150, 150, .5); } .side-top{ background:#fff; border-bottom: 1px solid #ddd; } .class-wrap .class-list{ position:relative; margin-bottom: 15px; } .class-list:before{ content: ""; width: 1px; position: absolute; background: #21d376; left: 20px; top: 30px; bottom: 21px; display: block; padding-bottom: 23px; box-sizing: border-box; } .class-list dt{ height:50px; line-height: 50px; background:#f7f7f7; border-radius: 3px; padding:0 15px; } .class-wrap .class-title{ position:absolute; font-size: 16px; width:70%; font-weight: 500; cursor: pointer; } .class-title:before{ content: ""; height: 11px; width: 11px; border: 2px solid #21d376; border-radius: 100%; background: #fff; margin-right: 10px; display: inline-block; position: relative; top: 0px; } .class-wrap .class-title-first:after{ content: ""; display: inline-block; height: 0; width: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid #333; position: absolute; top: 50%; margin-top: -2px; margin-left: 5px; -webkit-transition: all ease .2s; -moz-transition: all ease .2s; -o-transition: all ease .2s; transition: all ease .2s; } .class-list dd{ padding-left: 55px; } .class-list dd .inner{ height:45px; line-height: 45px; border-bottom: 1px solid #eff4f5; padding-right: 15px; } .class-title-two{ font-size: 14px !important; } .class-title-two:before{ content: ""; height: 8px; width: 8px; background: #21d376; border-radius: 100%; position: absolute; left: -12px; top: 50%; margin-top: -4px; } .class-title-two:after{ content: ""; height: 1px; width: 22px; border-top: 1px dotted #21d376; position: absolute; left: -34px; top: 23px; } .class-oper a{ padding:0 8px; } .btn-blue { color: #fff; background-color: #0096C4; border-color: #0096C4; } .btn-blue:hover { color: #fff; background-color: #0088b2; border-color: #0088b2; } .btn-blue:focus, .btn-blue.focus { -webkit-box-shadow: 0 0 0 2px rgba(0, 136, 178, 0.5); box-shadow: 0 0 0 2px rgba(0, 136, 178, 0.5); } .btn-blue.disabled, .btn-blue:disabled { background-color: #0088b2; border-color: #0088b2; } .btn-blue:active, .btn-blue.active, .show > .btn-blue.dropdown-toggle { color: #fff; background-color: #0088b2; background-image: none; border-color: #0088b2; } .btn-green { color: #fff; background-color: #00C8A3; border-color: #00C8A3; } .btn-green:hover { color: #fff; background-color: #00b896; border-color: #00b896; } .btn-green:focus, .btn-green.focus { -webkit-box-shadow: 0 0 0 2px rgba(0, 184, 150, 0.5); box-shadow: 0 0 0 2px rgba(0, 184, 150, 0.5); } .btn-green.disabled, .btn-green:disabled { background-color: #00b896; border-color: #00b896; } .btn-green:active, .btn-green.active, .show > .btn-green.dropdown-toggle { color: #fff; background-color: #00b896; background-image: none; border-color: #00b896; } .btn-outline-green { color: #00C8A3; background-image: none; background-color: transparent; border-color: #00C8A3; } .btn-outline-green:hover { color: #fff; background-color: #00b896; border-color: #00b896; } .btn-outline-green:focus, .btn-outline-green.focus { -webkit-box-shadow: 0 0 0 2px rgba(0, 184, 150, 0.5); box-shadow: 0 0 0 2px rgba(0, 184, 150, 0.5); } .btn-outline-green.disabled, .btn-outline-green:disabled { color: #00b896; background-color: transparent; } .btn-outline-green:active, .btn-outline-green.active, .show > .btn-outline-green.dropdown-toggle { color: #fff; background-color: #00b896; border-color: #00b896; } .btn-outline-blue { color: #0088b2; background-image: none; background-color: transparent; border-color: #0088b2; } .btn-outline-blue:hover { color: #fff; background-color: #0088b2; border-color: #0088b2; } .btn-outline-blue:focus, .btn-outline-blue.focus { -webkit-box-shadow: 0 0 0 2px rgba(0, 136, 178, 0.5); box-shadow: 0 0 0 2px rgba(0, 136, 178, 0.5); } .btn-outline-blue.disabled, .btn-outline-blue:disabled { color: #0088b2; background-color: transparent; } .btn-outline-blue:active, .btn-outline-blue.active, .show > .btn-outline-blue.dropdown-toggle { color: #fff; background-color: #0088b2; border-color: #0088b2; }