@charset "utf-8";
body{font-family:"Microsoft YaHei",'Open Sans', arial, sans-serif;background:#f0f1f3}
.clear{clear:both;}
ul,li {list-style:none;padding:0px;margin:0px}

input:-moz-placeholder,
textarea:-moz-placeholder { 
    color: red;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder { 
    color: red;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder { 
    color: red;
} 

/*底部导航*/
nav a span{display:block; font-size: 70%;}
nav a i{ display:block;}
nav a.mui-active i{color:#F60;}
nav a.mui-active span{color: #000;}
nav .fa-home{font-size:25px;}
nav .fa-sticky-note{font-size:22px;}
nav .fa-graduation-cap{font-size:23px;}
nav .fa-user{font-size:23px;}

.mui-title{color:#fff;}
.mui-action-back{color:#fff;}
.w94{margin:15px 3%;width:94%;}
.box{margin:15px 3%;width:94%;box-shadow: 0px 0px 5px #dddddd; border-radius:8px;background-color:#ffffff;}
.box0{margin:10px 3%;width:94%;}
.h100{height:100px;width:100%;}
.red{color:#f00;}
.black{color:#000;}
.gray{color:#666;}
.gray3{color:#333;}
.gray9{color:#999;}


.touxiang{margin:0 auto; width:60px; height:60px; }
.touxiang img{width:100%;height:100%;border-radius:60px;}

.gcs-login {
  box-sizing: border-box;
  width: 90vw;
  margin:0 auto;
  height: 100%;
}
.gcs-login .gcs-login-panel{
  margin:auto;
  left: 0;
  right: 0;
  top:0;
  bottom: 0;
}


.gcs-login-container {
  width: 100%;
  box-sizing: border-box;
  margin: 10px 0 10px 0;
  text-align: center;
}
.gcs-login input{

 background:transparent;
border:none;
outline:medium;
}
.gcs-login .input {
  border: 1px solid #bfbfbf!important;
  background-color:transparent;
  display: inline-block;
  box-sizing: border-box;
  height: 40px;
  padding-left: 10px;
  margin: 0 auto;
  font-size: 15px;
  outline: none;
  color:  #777676;
}

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
  color: #eee; font-size:14px;
}

input:-moz-placeholder, textarea:-moz-placeholder {
  color: #eee;font-size:14px;
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
  color: #eee;font-size:14px;
}


.gcs-login .gcs-login-validation{
  width:80%;
  margin:0 auto 0px auto;
  position: relative;
}
.gcs-login .validation-input{
  position: absolute;
  width: 150px;
  left: 0px;
}
.gcs-login span{display:inline-block;width:100px;height:40px;float:right;}
.gcs-login span a{ text-align:right; display:block;width:100px;height:40px; line-height:40px; color:#fff; font-size:15px;}

.gcs-login img.validation-img{
  position: absolute;
  cursor:pointer;
  width: 125px;
  height: 40px;
  right: 0px;
}
.gcs-login .input:focus {
  outline: none;
  border-bottom: 1px solid #f60;
}
.gcs-login .btn-login {
  background-color: #d70a42;
 border: none;
  width: 80%;
  height: 45px;
  line-height: 30px;
  color: white;
  cursor: pointer;
  font-size: 16px;
  font-weight: bold;
  margin-top:5px;
  border-radius:10px;
}
.gcs-login .btn-login:hover{
  opacity: 0.9;
}




/*培训*/
#tabbar-train .nav{margin:10px 3% 0 3%; line-height:25px; }
#tabbar-train .nav .fa{color:#F90;line-height:30px;font-size:18px;margin-right:5px;}
#tabbar-train a .mui-media-body{white-space: normal; font-weight:bold; }
#tabbar-train a.mui-navigate-right {border-bottom:1px #eee solid;}
#tabbar-train .mui-btn:active{color:#fff; background-color: #FEA601;}
#tabbar-train li{ position:relative;}
#tabbar-train li .zindex10{ position:absolute; top:20px;left:0; background-color:#f4c20b; color:#fff; font-size:90%; line-height:25px; border-radius:0 25px 25px 0; padding:0 20px 0 10px;}
#tabbar-train .h100{padding-top:30px;height:80px;}
#tabbar-train .h100 a{position:absolute; bottom:24px;right:25px;}
#tabbar-train .h100 p{color:#999;}
#tabbar-train .h100 .fa{ font-size:14px; margin:0 5px 0 3px;color:#bbb;}
#tabbar-train .h100 .mui-icon{ font-size:18px;padding:0;}
#tabbar-train .invalid .mui-btn,#tabbar-train .invalid .mui-btn:active{ background-color: #999; text-shadow:0 0 1px #666;}
#tabbar-train li.invalid .zindex10{ background-color: #999;}

/*我的*/
#tabbar-me{position:relative;}
#tabbar-me .zindex0{ z-index:0; position:absolute;top:0px;}
#tabbar-me .zindex1{ z-index:1; position:absolute;top:34px;}
#tabbar-me .zindex2{ z-index:2; position:absolute;top:164px;}
#tabbar-me .zindex3{ z-index:2; }
#tabbar-me .face{left:50%;margin-left:-44px;top:10px;}
#tabbar-me .face img{width:80px;height:80px;border:4px solid #fff; border-radius:80px;}
#tabbar-me .zindex1 .h100{ height:115px;text-align:center;padding-top:50px;font-size:13px;color:#999; line-height:20px;}
#tabbar-me .zindex1 .h100 span{ display:block; font-size:18px; line-height:30px;font-weight:700;color:#000;}

/*#tabbar-me .zindex2 li span{width:50px;height:50px;color:#fff; text-align:center; font-size:30px; line-height:50px;border-radius:25px;}
*/
#tabbar-me .zindex3 li i{width:30px;height:30px;color:#fff; text-align:center; font-size:20px; line-height:30px;border-radius:5px;margin-right:10px;}
#tabbar-me .fa-user-circle{color:#F90; font-size:15px;}
#tabbar-me .zindex3 .mui-navigate-right span{float:right; font-size:14px; line-height:30px;color:#999;margin-right:30px;}
#tabbar-me .zindex3 .mui-media-body{height:30px; font-size:18px;  font-weight:700;line-height:30px;}
#tabbar-me .box .mui-grid-9{border-radius:8px;}
#tabbar-me .mui-card{margin:5px auto 15px auto;border:0;border-radius:8px ;width:100%; box-shadow: 0px 0px 5px #dddddd;}
#tabbar-me .mui-card img{width:100%;height:auto; border-radius:8px;}
#tabbar-me .mui-card-content-inner{width:100%;height:auto;}
#tabbar-me .mui-card-content-inner h4{width:100%; line-height:25px; font-size:17px;}
#tabbar-me .box0 {margin-bottom:80px;}
#tabbar-me .box0 .box{width:100%;margin:0;}
#tabbar-me .box0 .mui-btn-success{float:right;margin-left:10px;}
#tabbar-me .box0 .mui-btn-success:active{ background-color:#5dc766;}
#tabbar-me .progress {width:100px;}
#tabbar-me .box0 .h100{border-top:1px solid #ececec;padding:20px 15px;height:auto;overflow:hidden;}
#tabbar-me .box0 .h100 .case{width:55%;padding:0px;margin-top:30px;text-align:left;height:100%;}
#tabbar-me .box0 .h100 .case i{color:#f60;font-size:12px;margin-right:5px;margin-bottom:0px;}


#tabbar-me .box0 .h100 .case span{color:#999; margin-left:0px;font-size:15px;}
#tabbar-me .box0 .h100 .case span.red{color:#f00;margin:0 3px 0 0px;}
#tabbar-me .box0 .h100 .result h4{color:#000; font-size:17px;text-align:left;}
#tabbar-me .box0 .h100 .result {width:45%; text-align:center;height:auto;}

#tabbar-me .box0 .h100 .case .rt{float:left;width:65%;}
#tabbar-me .box0 .h100 .case .rt .progress{float:none;height: 8px;width:60%; margin-top:2px;}
#tabbar-me .box0 .h100 .case .rt .progress-value{float:none; text-align:right; margin-right:40%;}
#tabbar-me .box0 .h100 .case .lt{font-size: 18px;width:35%;color:#333;font-weight:700;}
#tabbar-me .box0 .h100 .case li.mui-table-view-cell{padding-right:0;border:0;}

.certificate{width:100%;overflow:hidden; text-align:center; margin:0 auto 0px auto;}
.certificate a{width:80%; display:block;margin:10px auto;height:35px;padding:0 0 0px 0; line-height:33px;}
.certificate a.mui-btn-yellow{border:1px #ececec solid; background-color:#999;font-size:16px;text-shadow: 0 0 1px #999;}
.certificate a.mui-active{border:1px #F60 solid; background-color:#F60; text-shadow: 0 0 1px #f90;}
.certificate a.mui-manyidu{border:1px #367bf7 solid; background-color:#367bf7; color:#fff;font-size:16px;}



/*myclass mycourse*/
.myclass a .mui-media-body{white-space: normal; font-weight:bold; }
.mui-btn:active{color:#fff; background-color: #FEA601;}
.myclass li{ position:relative;}
.myclass .h100{padding-top:30px;height:60px;}
.myclass .h100 a.mui-btn-outlined{position:absolute; bottom:15px;right:120px;}
.myclass .h100 a.mui-btn-success{position:absolute; bottom:15px;right:25px;}
.myclass .h100 p{color:#999; }
.myclass .h100 .fa{ font-size:14px; margin:0 5px 0 3px;color:#bbb;}
.myclass .h100 .mui-icon{ font-size:18px;padding:0;}
.myclass .mui-btn-success:active{ background-color:#00BE4A;}
.myclass .mui-btn-outlined:active{ background-color:#ddd;color:#000; }
.myclass .h100 em{color:#f60; font-weight: 600; font-style: normal; font-size: 200%;position:absolute; bottom:20px;left:50px}
.myclass a.mui-navigate-right {border-bottom:1px #eee solid;}

.myclass .h100 img{width:30px;height:30px; border-radius:30px; margin-bottom:-8px; margin-right: 5px; }

.lt{float: left;font-size: 14px; color: #8f8f94;}
.rt{float: right;font-size: 14px; color: #8f8f94;}
.vline{border-right:1px solid #ececec;}
.myclass .mui-table-view-chevron .mui-table-view-cell{padding-right: 30px;}
.myclass .mui-table-view-chevron .mui-table-view-cell>a:not(.mui-btn){margin-right: -35px;}
.mycourse .h100{ padding-top: 25px;}

.coursetop{margin:20px 3% 15px 3%;width:94%; }
.coursetop img{border-radius: 8px;width:100%;}
/*进度条*/
.progress {width:75px;margin-top: 5px;float:left;height: 10px; background-color: #cdcdcd; }
.progress-bar { width: 0; height: 100%; font-size: 12px; line-height: 10px; text-align: center;  -webkit-transition: width .6s ease; -o-transition: width .6s ease; transition: width .6s ease ;  -webkit-animation: animate-positive 2s; animation: animate-positive 2s;}
.progress-value { display: block; font-size: 14px;line-height: 10px; color: #5dc766; margin-top: 5px;margin-left: 5px;float: left; }
 @-webkit-keyframes animate-positive {
	 0% {width: 0;}
}
 @keyframes animate-positive {
	 0% {width: 0;}
}
.topnav{margin-left:3%;width:90%;}
.topnav .mui-segmented-control{border:0;}
.topnav .mui-segmented-control a.mui-control-item{height:20px;}
.topnav .mui-segmented-control .mui-control-item{border:0;color:#999; font-size:13px;}
.topnav .mui-segmented-control .mui-control-item.mui-active {border-bottom:2px #f60 solid; background-color:transparent;color:#f60;font-size:15px;}


.bg-white{ background: #FFFFFF;}
.myvedio{width:100%;padding:30px 5%;}
.vedio-box{width:100%;height:auto;}
.myvedio h3{margin:0px 0px 15px 0px; font-weight: normal;}
.myvedio p{padding:0;margin:0; display: block;width: 100%;}
.myvedio .radius{margin-bottom:20px;}
.myvedio .radius img{width:30px;height:30px; border-radius:30px; margin-bottom:-8px; margin-right: 10px; }
.blank10{height:10px;}
.h120{height:140px;}
.myvedio .progress{width:120px; }
.myvedio .content{margin-top: 10px; color: #666; line-height: 150%; }


.greenr{ background: -moz-linear-gradient(top, #14fedb 0%, #03d2cc 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#14fedb), color-stop(100%,#03d2cc));
    background: -webkit-linear-gradient(top, #14fedb 0%,#03d2cc 100%);
    background: -o-linear-gradient(top, #14fedb 0%,#03d2cc 100%);
    background: -ms-linear-gradient(top, #14fedb 0%,#03d2cc 100%);
    background: linear-gradient(to bottom, #14fedb 0%,#03d2cc 100%); }
.red1r{ background: -moz-linear-gradient(top, #ff7e54 0%, #f0582f 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff7e54), color-stop(100%,#f0582f));
    background: -webkit-linear-gradient(top, #ff7e54 0%,#f0582f 100%);
    background: -o-linear-gradient(top, #ff7e54 0%,#f0582f 100%);
    background: -ms-linear-gradient(top, #ff7e54 0%,#f0582f 100%);
    background: linear-gradient(to bottom, #ff7e54 0%,#f0582f 100%);}
.red2r{ background: -moz-linear-gradient(top, #ffcb68 0%, #fcb623 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffcb68), color-stop(100%,#fcb623));
    background: -webkit-linear-gradient(top, #ffcb68 0%,#fcb623 100%);
    background: -o-linear-gradient(top, #ffcb68 0%,#fcb623 100%);
    background: -ms-linear-gradient(top, #ffcb68 0%,#fcb623 100%);
    background: linear-gradient(to bottom, #ffcb68 0%,#fcb623 100%);}
.white{background-color:#ffffff;}
.blue{background-color:#4768f3; }
.blue1{background-color:#4ec7fe;}
.red1{background-color:#f35b46;}


/*环形进度条*/
.circle-bar { font-size:100px; width: 1em; height: 1em; position: relative;  background-color: #5dc766; margin:20px auto 0 auto;}
.circle-bar-left,.circle-bar-right { width: 1em; height: 1em; background-color: #ececec; }

.circle-bar-right { clip:rect(0,auto,auto,.5em); }
.circle-bar-left { clip:rect(0,.5em,auto,0); }
    
.mask { width: 0.8em; height: 0.8em;  background-color: #fff;text-align: center;line-height: 0.2em; color:rgba(0,0,0,0.5); }
.mask :first-child { font-size: 0.2em; height: 0.8em; line-height: 0.8em; display: block; color:#F00; }
 /*所有的后代都水平垂直居中，这样就是同心圆了*/
.circle-bar * {  position: absolute; top:0; right:0; bottom:0; left:0; margin:auto; }
/*自身以及子元素都是圆*/
.circle-bar, .circle-bar > * { border-radius: 50%; }
.circle-bar .percent{ font-size:40px;height:40px;position:absolute;top:-15%;left:-5%; }
.circle-bar .percent0{ font-size:30px;height:30px;top:0%;left:0%; }
.circle-bar .percent100{ font-size:30px;height:30px;top:-10%;left:-10%; }

.circle-bar .mask .gray{font-size: 0.15em; height:20px; position:absolute;top:0; text-align:right;width:85%;}
.circle-bar .mask .pass{font-size:0.15em;height:20px;color:#090; position:absolute;top:50%; font-weight:700;}
.circle-bar .mask .not-pass{font-size:0.15em;height:20px;color:#999; position:absolute;top:50%; font-weight:700;}

/*满意度表单*/
.manyidu-content{margin:0;padding:0;}		
.manyidu-content .title{padding:20px;overflow:hidden; position:relative;}
.manyidu-content .title i.fa{ margin-left:10px; color:#FFF; font-size:23px;text-shadow:0px 0 2px #00C ;}
.manyidu-content .title a{ display:block; position:absolute;top:50%;left:5px; margin-top:-18px;}
.manyidu-content .title a i.fa-angle-left{ color:#FFF; font-size:30px;}
.manyidu-content .title h3{color:#fff; text-shadow:0px 0 2px #00C ;padding-left:45px;}
.manyidu-content .title p{color:#fff;padding-left:45px;}

.manyidu-content .box{padding:15px 10px;height:auto; overflow:hidden;margin-bottom:80px;font-size:16px;}
.manyidu-content lablel{display:block;color:#333;padding:0.3em 0}

.manyidu-content .box  input.mui-btn-yellow{ width:100%;border:0;text-align:center; background-color:#f60;color:#fff;font-size:18px;height:45px; border-radius:45px; text-shadow:1px 0 0 #cb7b0b;float:left;}
.manyidu-content .box  input.mui-btn-yellow:active{text-shadow:1px 0 0 #333;background-color:#999;}
.manyidu-content .mui-media-body{padding:0.3em;color:#333;font-size:1.1em}
.manyidu-content .mui-table-view-cell0{padding:0.3em;margin-right:5px;border-bottom:solid 1px #eee;}
.manyidu-content .mui-table-view-cell0{line-height:30px;}
.manyidu-content .mui-table-view-cell0 .checkbox{margin:0 0.5em;height:20px;width:20px;}

/*申请证书表单*/
.form-content{margin:0;padding:0;}		
.form-content .title{padding:20px;height:auto;overflow:hidden; position:relative;}
.form-content .title i.fa{ margin-left:10px; color:#FFF; font-size:23px;text-shadow:0px 0 2px #00C ;}
.form-content .title a{ display:block; position:absolute;top:50%;left:5px; margin-top:-18px;}

.form-content .title a i.fa-angle-left{ color:#FFF; font-size:30px;}
.form-content .title h3{color:#fff; text-shadow:0px 0 2px #00C ;padding-left:45px;}
.form-content .title p{color:#fff;padding-left:45px;}
.form-content.mydemand  .title h3{margin:15px 0 0 0;}

.form-content .box{padding:15px 10px;height:auto; overflow:hidden;margin-bottom:80px;font-size:16px;}
.form-content .box i{color:#09F;}
.form-content.mydemand .box{margin-bottom:15px;}

.form-content .box input{outline:none;border:none;height:30px;margin:0;width:70%;color:#000; float:right;padding-right:5px; text-align:right;}
.form-content .box input.cardnum{width:60%;}
.form-content .box input.nametwo{width:82%;}
.form-content .box a.tx{ float:right; display:block;margin:0;padding:0;}
.form-content .box a.tx img{width:60px;height:auto;}

.form-content .box  input.mui-btn-yellow{ width:42%;border:0;text-align:center; background-color:#f60;color:#fff;font-size:18px;height:45px; border-radius:45px; text-shadow:1px 0 0 #cb7b0b;float:left;margin:15px 2% 10px 5%;}
.form-content .box  input.mui-btn-yellow:active{text-shadow:1px 0 0 #333;background-color:#999;}
.form-content .box  input.mui-switch-blue{ width:42%;border:0;text-align:center; background-color:#007aff;color:#fff;font-size:18px;height:45px; border-radius:45px; text-shadow:1px 0 0 #007aff;float:left;margin:15px 2% 10px 5%;}
.form-content .box  input.mui-switch-blue:active{text-shadow:1px 0 0 #333;background-color:#999;}
.form-content .box  input.mui-btn-gray{ width:42%;border:0;text-align:center; background-color:#ccc;color:#fff;font-size:18px;height:45px; border-radius:45px; text-shadow:1px 0 0 #999;float:left;margin:15px 2% 10px 5%;}
.form-content .box  input.mui-btn-gray:active{text-shadow:1px 0 0 #333;background-color:#999;}
.form-content .box  input.mui-active{ text-shadow:1px 0 0 #666;}
.form-content .box  input.mui-switch-green{ width:90%;border:0;text-align:center; background-color:#339900;color:#fff;font-size:18px;height:45px; border-radius:45px; text-shadow:1px 0 0 #007aff;float:left;margin:15px 2% 10px 5%;}



.form-content .box .mui-table-view-cell{padding:16px 0px 8px 15px;margin-right:15px;}
.form-content .box .mui-table-view-cell input::-webkit-input-placeholder
{
  color: #999;font-size:17px; text-align:right;
}
.form-content .box .mui-table-view-cell input:-moz-placeholder
{
  color: #999;font-size:17px; text-align:right;
}
.form-content .box .mui-table-view-cell input::-moz-placeholder
{
  color: #999;font-size:17px; text-align:right;
}
.form-content .box .mui-table-view-cell input:-ms-input-placeholder
{
  color: #999;font-size:17px; text-align:right;
}
/*
.form-content .box select{color:#999;margin:0px 0 0 0;width:70%;font-size:17px; 
background:url(../img/arrow.svg) right 6px no-repeat ;
background-size:14px;float:right;padding-top:0px;padding-right:20px; direction: rtl;
}
*/

.form-content .box select{color:#999;margin:0px 0 0 0;width:96%;font-size:17px; 
float:right;padding-top:0px;padding-right:2px; direction: rtl;
}
.form-content .box li #txtShow{ position:absolute;top:15px;right:20px;}
.form-content .box .mui-table-view-cell i{ position:absolute;left:28%;top:45%;}

/*技术需求*/
.form-content .mui-table-view-cell h4{width:100%; text-align:center;}
.form-content .mui-table-view-cell h4 i{margin-right:10px;}
.form-content textarea{margin-top:15px;padding:5px; border:1px #ececec solid;color:#999;}
.form-content .mui-table-view-cell.margin10{padding-bottom:18px;margin-right:0;}
.form-content  .adddemand .h100{height:auto;border-top:1px #ececec solid;padding:10px 5px 0 5px;}

.form-content.mydemand .box{padding-top:10px;}
.form-content.mydemand .mui-btn-yellow{margin:0px 5% 80px 5%;width:90%;border:0;text-align:center; background-color:#f60;color:#fff;font-size:18px;height:45px; line-height:35px;border-radius:45px; text-shadow:1px 0 0 #cb7b0b;}
.form-content.mydemand .mui-btn-yellow i{font-weight:700;font-size:25px;}
.form-content .adddemand li.mui-table-view-cell:after{height:0;}
.form-content .adddemand li a{width:100%;margin:0px auto;}
.form-content .adddemand li h4{white-space:normal;  font-size:17px;line-height:20px;width:90%;text-align:left;}
.form-content .adddemand li h4 span{margin:0 5px 0 0;color:#fff; padding:auto 10px;width:60px;overflow:hidden;
display:inline-block; 
border-radius:6px;
text-align:center;
 font-size:14px;
 font-weight:normal;}
.form-content .adddemand li h4 span.gray{ background-color:#999;}
.form-content .adddemand li h4 span.green{ background-color:#5dc766;}
.form-content  .adddemand .h100 i{ font-style:normal;}


.table{margin:10px auto;width:96vw; background-color:#FFF;border:#DDD 1px solid;height:auto;overflow:hidden;padding:0px;clear:both;}
.table ul{margin:0;padding:0;}
.table li{border-bottom:1px #eee solid;padding:0 10px; line-height:200%; color:#666; font-size:100%;clear:both; overflow:hidden;height:auto; }

.lt{float:left; color:#000}
.rt{float:right; color:#999;font-size:80%;}

.table .more{ line-height:150%;padding:5px 0; background-color:#f7f7f7;color:#666; text-align:center;clear:both; font-size:90%; }
.table .more a{color:#666;}
.table .more a:hover{color:#333;}