input[type="radio"], input[type="checkbox"] { width: 16px; height: 16px; position: absolute; top: 50%; left: 0; margin: -8px 0 0 0; display: inline-block; z-index: 9999; cursor: pointer; } input[type=checkbox], input[type=radio] { box-sizing: border-box; padding: 0; } .ui-label { margin-bottom: 0; position: relative; cursor: pointer; display: inline; } .ui-label.checked .checkbox-a { background-position: -20px 0; } .ui-label.checked .radio-a { background-position: -20px -20px; } .ui-label .checkbox, .ui-label .radio { opacity: 0; filter: alpha(opacity=0); } .ui-label .checkbox, .ui-label .radio, .ui-label .checkbox-a, .ui-label .radio-a { width: 16px; height: 16px; position: absolute; top: 50%; left: 0; margin: -7px 0 0 0; display: inline-block; } .ui-label .radio-a, .ui-label .checkbox-a { background: url("../../../assets/images/form-icon_hasha3428a7cdd.png") no-repeat; cursor: pointer; } .ui-label .checkbox-a { background-position: 0 0; } .ui-label .radio-a { background-position: 0 -20px; } .ui-label .ipt-txt { position: relative; z-index: 9; padding-left: 20px; } /* */ .m-login { width: 290px; height: 350px; float:right; } @media screen and (max-width: 639px){ .m-login { float: none; } } .m-login .login-tips { background-color: #a2c2db; padding: 0 20px 10px; } .m-login .tit { line-height: 56px; margin: 0 25px; border-bottom: 1px solid #5b88ad; font-size: 18px; color: #fff; text-align: center; } .m-login .login-bd h2 { font-size: 18px; color: #3290d4; margin-bottom: 10px; font-weight: bold; } .m-login .login-bd .ao { color: white; } .m-login .login-form .p-ico { position: absolute; } .m-login .login-form li { margin-bottom: 15px; font-size: 10px; position: relative; } .m-login .login-form li .ui-ipt { height: 37px; width: 310px; text-indent: 22px; } .m-login .login-form li .ipt-s { width: 209px; vertical-align: middle; } .m-login .login-form li .qr-code { width: 90px; height: 39px; margin-left: 5px; vertical-align: middle; cursor: pointer; display: inline-block; } .m-login .login-form li .qr-code img { width: 90px; height: 37px; border: 1px solid #ddd; } .m-login .login-form .last { margin-bottom: 5px; } .m-login .login-form .wrong-tips { position: absolute; left: 38px; bottom: 45px; width: 150px; text-align: center; z-index: 9; background-color: #f9e2e4; border: 1px solid #ff914b; /* border-radius: 5px; */ color: #ff914b; padding: 2px 5px; } .m-login .login-form .wrong-tips:after { content: " "; width: 0; height: 0; border: 6px solid; border-color: #f9e2e4 transparent transparent transparent; position: absolute; left: 20px; bottom: -12px; margin-left: -6px; } .m-login .login-form .wrong-tips:before { content: " "; width: 0; height: 0; border: 7px solid; border-color: #ff914b transparent transparent transparent; position: absolute; left: 13px; bottom: -14px; } .m-login .login-form-1 { padding: 8px 24px 0 24px; } .m-login .login-form-1 li { margin-bottom: 13px; } .m-login .login-form-1 li .ui-ipt { width: 100%; text-indent: 42px; border: 0; } .m-login .login-form-1 li .ipt-s { width: 140px; } .m-login .login-form-1 li .qr-code { height: 37px; border-radius: 5px; overflow: hidden; } .m-login .login-form-1 .user-ico, .m-login .login-form-1 .code-ico, .m-login .login-form-1 .picode-ico { width: 37px; height: 37px; background-color: #3290d4; /* border-radius: 5px 0 0 5px; */ top: 0; left: 0; } .m-login .login-form-1 .user-ico { background-position: -230px -300px; } .m-login .login-form-1 .code-ico { background-position: -270px -300px; } .m-login .login-form-1 .picode-ico { background-position: -310px -300px; } .m-login .login-form-1 .btn-login { width: 100%; background-color: #ff914b; font-weight: normal; height: 37px; line-height: 37px; } .m-login .login-form-1 .btn-login:hover { background-color: #ffa165; } .m-login .login-form-1 .btn-reg { width: 100%; background-color: #fff; color: #ff914b; font-weight: normal; height: 37px; line-height: 37px; font-size: 14px; } .m-login .login-form-1 .btn-reg:hover { background-color: #ff914b; color: #fff; } .m-login .ag { color: #fff; } .m-login .btn-box { margin-top: 20px; } .m-login .btn-box a { width: 118px; height: 36px; line-height: 36px; margin: 0 10px 10px; display: inline-block; background-color: #fff; border: 1px solid #3290d4; color: #3290d4; text-align: center; transition: all .4s; } .course-my { width: 290px; height: 350px; padding: 25px; box-sizing: border-box; } .course-my .course-my-info .my-headimg { width: 64px; height: 64px; border-radius: 80px; display: block; margin: 0 auto; overflow: hidden; float: left; } .course-my .course-my-info .my-headimg img { width: 100%; height: 100%; } .course-my .course-my-info .info-detail { padding-left: 80px; color: #fff; font-size: 14px; line-height: 64px; width: 150px; } .course-my .login-entry { margin-top: 15px; } .course-my .login-entry .btn-r { height: 40px; line-height: 40px; width: 100px; } .course-my .login-entry .btn-b-b { height: 38px; line-height: 38px; width: 100px; margin-left: 10px; } .course-my .login-entry .w196 { width: 100%; margin-left: 0; } .course-my .entry-box { margin-top: 25px; } .course-my .entry-box li { display: block; width: 33.3%; float: left; text-align: center; padding: 0 0 15px; cursor: default; position: relative; } .course-my .entry-box li:hover a { color: #196fad; } .course-my .entry-box li:hover a .i1 { background-position: 0px -77px; } .course-my .entry-box li:hover a .i2 { background-position: -40px -77px; } .course-my .entry-box li:hover a .i3 { background-position: -80px -77px; } .course-my .entry-box li:hover a .i4 { background-position: -120px -77px; } .course-my .entry-box li:hover a .i5 { background-position: -161px -77px; } .course-my .entry-box li:hover a .i6 { background-position: -200px -77px; } .course-my .entry-box li:hover a .i7 { background-position: -310px -400px; } .course-my .entry-box li:hover a .i8 { background-position: -100px -470px; } .course-my .entry-box li:hover a .i9 { background-position: -150px -470px; } .course-my .entry-box li:hover a .i10 { background-position: -205px -469px; } .course-my .entry-box li a { color: #fff; } .course-my .entry-box li a span { transition: all 0s; -moz-transition: all 0s; -webkit-transition: all 0s; -o-transition: all 0s; } .course-my .entry-box li .p-ico { display: block; width: 40px; height: 40px; margin: 0 auto 10px; } .course-my .entry-box li .i1 { background-position: 0px -28px; } .course-my .entry-box li .i2 { background-position: -40px -28px; } .course-my .entry-box li .i3 { background-position: -80px -28px; } .course-my .entry-box li .i4 { background-position: -120px -28px; } .course-my .entry-box li .i5 { background-position: -161px -28px; } .course-my .entry-box li .i6 { background-position: -200px -28px; } .course-my .entry-box li .i7 { background-position: -310px -350px; } .course-my .entry-box li .i8 { background-position: -100px -420px; } .course-my .entry-box li .i9 { background-position: -150px -420px; } .course-my .entry-box li .i10 { background-position: -205px -419px; } .course-my .entry-box li .red-r { position: absolute; width: 15px; height: 15px; line-height: 15px; text-align: center; color: #fff; font-size: 12px; background-position: -247px -82px; top: -4px; left: 46px; font-style: normal; } .course-my .entry-box li .red-r-2 { top: 0px; left: 41px; } button.btn-b-b { border: 1px solid #3290d4; color: #3290d4; background: #fff; line-height: 40px; width: 100px; text-align: center; border-radius: 5px; }