@charset "UTF-8";
/* CSS reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{ margin: 0; padding: 0; }
fieldset,img{ border: 0; }
:focus{ outline: 0; }
address,caption,cite,code,dfn,em,strong,th,var,optgroup{ font-style: normal; font-weight: normal; }
h1,h2,h3,h4,h5,h6{ font-size: 100%; font-weight: normal; font-family: "Microsoft YaHei"; }
abbr,acronym{ border: 0; font-variant: normal; }
code,kbd,samp,tt{ font-size: 100%; }
input,button,textarea,select{ *font-size: 100%; border:none;}
body{ background:#fff; color:#5e5e5e; font: 14px/2em Microsoft YaHei,SimSun,Arial;}
ol,ul{ list-style: none; }
table{ border-collapse: collapse; border-spacing: 0; }
caption,th{ text-align: left; }
sup,sub{ font-size: 100%; vertical-align: baseline; }
:link, :visited, ins{ text-decoration: none; }
blockquote,q{ quotes: none; }
blockquote:before, blockquote:after, q:before, q:after{ content: ''; content: none; }

.clearfix:after{content:'\0020';display:block;height:0;clear:both;visibility:hidden; }
.clearfix{*zoom:1;}
.l{float:left;}
.r{float:right;}
.clear{ height:0; overflow:hidden; clear:both}
.hide{display:none;}
.btn.hide{display:none;}
a.hidefocus { outline: none; }
button.hidefocus::-moz-focus-inner { border:none; }
a:focus {outline:none;-moz-outline:none;}
input,textarea {outline:none;}
h2 { font-size: 20px; }
h3 { font-size: 16px;  }
h5 { font-size: 14px; line-height: 28px; }
/*border && padding*/
.img_border { border: 4px solid #fff; border-radius: 1px;}
.bb { border-bottom: 1px solid #d2d2d2 }
.bt { border-top: 1px solid #d2d2d2 }
.pt15 { padding-top: 15px; }
.pb15 { padding-bottom: 15px; }
.p15{ padding:0 15px}
/*颜色定义*/
.color-gray,a.color-gray:link,a.color-gray:visited{color:#b7bcc0;}
.color-white{ color: #fff !important; }
.mr60 { margin-right: 60px; }
.color-red{color: #EF1300 !important;}
.pr{position: relative;}
.pa{position: absolute;}


.clearfix:after {
  content: '\0020';
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix {
  *zoom: 1;
}
.l {
  float: left;
}
.r {
  float: right;
}


/*
HTML structure：
<div class="panel">
  <div class="panel-heading">
    <h3 class="panel-title">Panel title</h3>
  </div>
  <div class="panel-body">
    Panel content
  </div>
  <div class="panel-footer">Panel footer</div>
</div>
panel-heading,
panel-body,
panel-footer all could be select use not necessary
*/
.bordered {
  border-bottom: solid 1px #d0d6d9;
}
.panel {
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  padding: 0 20px;
  color: #14191e;
  background-color: #ffffff;
  margin-bottom: 20px;
}
.panel-heading {
  border-bottom: solid 1px #d0d6d9;
}
.panel-title {
  height: 50px;
  line-height: 50px;
  font-size: 16px;
}

a.btn-add-collection:hover {
  background-position: 46px -44px;
  color: #fff;
}
a.btn-remove-collection {
  background-position: 46px -88px;
  color: #909b9e;
}
a.btn-remove-collection:hover {
  background-position: 46px -130px;
}
.course-title .btn-add-collection {
  margin-top: 6px;
}
.videohead .btn-add-collection {
  margin-top: 20px;
}
.js-btn-collection .concerned-icon {
  margin-top: 34px;
  display: inline-block;
}

a {
  outline: none;
}
a:active {
  star: expression(this.onFocus=this.blur());
}
a,
input,
button {
  outline: none;
}
button::-moz-focus-inner {
  border: 0px;
}
input::-moz-focus-inner {
  border: 0px;
}
.autowrap {
  word-wrap: break-word;
  word-break: break-all;
}
.compatible-contianer {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  min-width: 800px;
  height: 30px;
  line-height: 30px;
  background: url(/static/img/iebg.gif) repeat-x;
  z-index: 999999;
}
.cpt-ct {
  color: #363636;
  font-size: 12px;
  text-align: center;
}
.cpt-ct i {
  display: inline-block;
  width: 12px;
  height: 14px;
  vertical-align: -2px;
  margin-right: 5px;
  background: url(/static/img/iefixed-sprite.png) no-repeat 0 0;
}
.cpt-ct a {
  color: #39b94e;
}
.cpt-ct a:hover {
  text-decoration: underline;
}
.cpt-handle {
  position: absolute;
  right: 20px;
  top: 0;
  font-size: 12px;
  line-height: 27px;
}
.cpt-handle a {
  display: inline-block;
  vertical-align: middle;
}
.cpt-handle .cpt-agin {
  color: #656e73;
  margin-right: 5px;
}
.cpt-handle .cpt-agin:hover {
  color: #363d40;
}
.cpt-close {
  width: 16px;
  height: 16px;
  text-align: center;
  line-height: 16px;
  border-radius: 50%;
  transition: 0.3s;
}
.cpt-close:hover {
  background-color: #fc8800;
}
.cpt-close i {
  display: inline-block;
  height: 8px;
  width: 8px;
  vertical-align: 1px;
  background: url(/static/img/iefixed-sprite.png) no-repeat 0 -24px;
}
.cpt-close:hover i {
  background-position: 0 -42px;
}
/*用户卡片样式*/
.layer-usercard {
  position: absolute;
  z-index: 999;
  width: 370px;
  height: 165px;
  background: #fff;
  box-shadow: 0 2px 2px #999;
}
.layer-usercard .arrow {
  position: absolute;
  left: 65px;
  top: -11px;
  width: 19px;
  height: 11px;
  background: url(/static/img/dot_usercard.png);
}
.layer-usercard-header {
  height: 110px;
  background: #2a2c2e;
}
.layer-usercard-header .avatar img {
  border-radius: 50px;
  left: 21px;
  position: absolute;
  top: 21px;
  border: 3px solid #7f8082;
}
.layer-usercard-header dt,
.layer-usercard-header dd {
  float: right;
  width: 245px;
  padding-right: 20px;
  color: #fff;
}
.layer-usercard-header dt {
  padding-top: 20px;
  font-size: 18px;
}
.layer-usercard-header dd {
  font-size: 12px;
}
.layer-usercard-info ul {
  overflow: hidden;
  padding-top: 16px;
  height: 32px;
  font-size: 16px;
  color: #364247;
  position: relative;
}
.layer-usercard-info li {
  float: left;
  padding: 0 22px;
  border-right: 1px solid #d9d9d9;
}
.layer-usercard-info span {
  color: #969b9e;
  font-size: 12px;
}
.layer-usercard-info li.noborder {
  border: 0;
}
li.layer-usercard-medal {
  padding: 0;
  top: 12px;
  right: 10px;
  width: 117px;
  position: absolute;
  border: 0;
}
.layer-usercard-medal a {
  width: 32px;
  height: 32px;
  float: left;
  margin-right: 5px;
  border-radius: 1px;
  overflow: hidden;
}
.ipt {
  color: #14191e;
  background-color: #ffffff;
  border: 1px solid #98a1a6;
  height: 20px;
  line-height: 20px;
  padding: 9px 9px;
  font-size: 14px;

  border-radius: 0;
  -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  -moz-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  border-color: #98a1a6;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
select.ipt {
  height: 20px;
  line-height: 20px;
}
textarea.ipt,
select[multiple].ipt {
  height: auto;
}
.ipt:-moz-placeholder {
  color: #c8cdd2;
}
.ipt::-moz-placeholder {
  color: #c8cdd2;
  opacity: 1;
}
.ipt:-ms-input-placeholder {
  color: #c8cdd2;
}
.ipt::-webkit-input-placeholder {
  color: #c8cdd2;
}
.ipt.placeholder {
  color: #c8cdd2;
}
.ipt:focus {
  border-color: #000000;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0, 0, 0, 0.4);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0, 0, 0, 0.4);
}
.ipt[disabled],
.ipt[readonly],
.ipt.disabled {
  cursor: default;
  background-color: #edf1f2;
  opacity: 1;
}
textarea.ipt {
  height: auto;
}
.ipt-error {
  color: #cc0000;
  border-color: #cc0000;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.ipt-error:focus {
  border-color: #cc0000;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(204, 0, 0, 0.4);
  -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(204, 0, 0, 0.4);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(204, 0, 0, 0.4);
}
/*.btn {*/
  /*display: inline-block;*/
  /*margin-bottom: 0;*/
  /*font-weight: 200;*/
  /*text-align: center;*/
  /*vertical-align: middle;*/
  /*touch-action: manipulation;*/
  /*cursor: pointer;*/
  /*text-decoration: none;*/

  /*-webkit-appearance: none;*/
  /*white-space: nowrap;*/
  /*outline: none;*/
  /*-webkit-user-select: none;*/
  /*-moz-user-select: none;*/
  /*-ms-user-select: none;*/
  /*user-select: none;*/
/*}*/
.btn:hover,
.btn:focus,
.btn.focus {
  color: #fff;
  text-decoration: none;
}
.btn:active,
.btn.active {
  outline: 0;
  background-image: none;
}
.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
  pointer-events: none;
  opacity: 0.65;
  filter: alpha(opacity=65);
  box-shadow: none;
}
.btn-red {
  color: #ffffff;
  background-color: #cc0000;
  border-color: #cc0000;
  border-style: solid;
  border-width: 1px;
  cursor: pointer;
  -weibkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  width: 138px;
  height: 38px;
  line-height: 38px;
  font-size: 14px;
}
.btn-red:link,
.btn-red:visited {
  color: #ffffff;
}
.btn-red:hover,
.btn-red:focus,
.btn-red.focus {
  color: #ffffff;
  background-color: #f00000;
  border-color: #f00000;
}
.btn-red:active,
.btn-red.active {
  background-color: #b30000;
  border-color: #b30000;
}
.btn-red.disabled,
.btn-red[disabled],
.btn-red.disabled:hover,
.btn-red[disabled]:hover,
.btn-red.disabled:focus,
.btn-red[disabled]:focus,
.btn-red.disabled.focus,
.btn-red[disabled].focus,
.btn-red.disabled:active,
.btn-red[disabled]:active,
.btn-red.disabled.active,
.btn-red[disabled].active {
  cursor: default;
  box-shadow: none;
  background-color: #cc0000;
  border-color: #cc0000;
}