﻿body{padding-top:45px;background:url(../images/bg_body.jpg) repeat;}
body .bdNavbg{background-position:0 -50px;color:#ccc;font-size:12px;}
body .bdNavbg #breadNav{padding:9px 0 10px;font-family:Arial}
body .bdNavbg #breadNav a{font-size:14px;margin:0 10px;display:inline-block;padding:2px 5px;white-space:nowrap;}
body .bdNavbg #breadNav a.current{color:#4c8333;font-weight:700}
#wrapper{padding-top:20px;font-size:12px;}
/*20130730*/
.magBottom{margin-bottom:10px}

#left a.iconPub{background:url(../images/spritesHv.png) no-repeat;width:21px;height:21px;display:inline-block;margin:0 5px 0;vertical-align:middle; text-decoration:none;margin-top:-2px;}
#left a.qqIcon{background-position:-6px -47px}
#left a.wbIcon{background-position:-36px -46px}
#left a.rrIcon{background-position:-66px -46px}

.bg, .f-bg { background-color: #fff; -webkit-box-shadow: 0px 1px 2px #bbbbbb; -moz-box-shadow: 0px 1px 2px #bbbbbb; box-shadow: 0px 1px 2px #bbbbbb; }
.f-bg { border-top: 1px solid #c7c7ce;position:relative; }
.f-bg .j-right {width:450px;float:left}
.g-bg-bd{background:#f4f4f4;border:solid 1px #e3e3e3}
.j-right h2{ font-size: 24px; line-height: 1.2;  break: break-all; word-wrap: break-word;margin-bottom:20px;}
.j-right{margin:0 0 0 15px;}
.j-right ul{font-size:12px;margin-top:10px;line-height:26px;}
.small-rating,.small-rating span{background:url(../images/sprites.png) no-repeat;}.small-rating{background-position:0 -70px;line-height:0;width:85px;display:inline-block;text-align:left;margin-top:2px;vertical-align:top;_float:left;_height:12px;_overflow:hidden;}.small-rating span{display:inline-block;background-position:0 -83px;height:13px;line-height:14px;}

#wrapper .bdGray{margin-bottom:14px;background:#fff;padding-top:15px}
.myTopBar .btnarea a,.answerCont .topDel .newTit{background:url(../images/mysprites.png) no-repeat;width:35px;height:30px;display:inline-block;}
.myTopBar .lft{height:auto}

.f-bdr{border-top: 1px solid #dfdfdf;padding:20px;}
#wrapper .ctit1{margin:0 0 15px;border-left:5px solid #36373E;padding-left:15px;font-size:18px;height:22px;line-height:22px;font-weight:400}
#wrapper .cintrocon{padding:10px 20px 20px;font-size:14px;line-height:22px;}
#right .hotCouse li,#left .famousLst li .lft span{background:url(../images/spritesLst.png) no-repeat;}
#curriculum .f-bdr{padding-bottom:0}
#left{width:710px;float:left;}
#left .famousLst{margin:10px 20px;border-bottom:dotted 1px #bbb;}
#left .famousLst li{width:100%;overflow:hidden;margin-bottom:20px;}
#left .famousLst li .lft{width:200px;position:relative;}
#left .famousLst li .lft img{ border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;padding:4px;border:solid 1px #e7e7e7;width:200px;width:190px\9;}
#left .famousLst li .lft span{position:absolute;top:25%;left:39%;width:42px;height:42px;background-position:0 0;z-index:10}
#left .famousLst li .rgtCont{margin-left:220px;}
#left .famousLst li .rgtCont h4{font-size:18px;margin-bottom:6px;font-weight:400;}
#left .famousLst li .rgtCont em{background:#b5b5b5;color:#fff;padding:3px;}
#left .famousLst li .rgtCont .cont{margin-top:10px;color:#999;}
#left .page{margin-bottom:15px;}
#left .commentWarp{padding:10px 20px 20px;}
#left #ask_content{margin-bottom: 10px;width: 99%;}
#left .titSee{margin:10px 0 6px;}

#left .commenCont{margin-top:35px;}
#left .commenCont li{width:100%;overflow:hidden;border-bottom:dotted 1px #b4b4b4;padding-bottom:20px;margin-bottom:20px;position:relative;}
#left .commenCont li .rgtDiv{position:absolute;top:2px;right:5px;display:none;}
#left .commenCont li .rgtDiv em{cursor:pointer;display:inline-block;margin-left:10px;background:#eee;padding:1px 8px;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;}
#left .commenCont li .rgtDiv em:hover{background:#ccc;}
#left .commenCont li h4{margin-bottom:4px;font-size:14px;}
#left .commenCont li img{float:left;width:49px;height:49px;margin-top:4px;}
#left .commenCont li .rgtcont{margin-left:65px;}
#left .commenCont li .rgtcont .cont{margin-bottom:5px;}
#left .commenCont li .rgtcont .timeCls{}




#rgtList{padding-bottom:20px;}
#right{width:280px;float:right;font-size:12px;overflow:hidden}

#right .hotCouse{overflow:hidden;margin:0 -20px;zoom:1;}
#right .hotCouse ul{zoom:1;margin-top:-11px;}
#right .hotCouse li{background-position:15px -48px;padding-left:35px;border-top:dotted 1px #d7d7d7;padding-top:4px;}
#right .hotCouse li a{display:block;line-height:32px;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}


#right .f-bdr{padding:10px 20px;}
#right .courseDiv{padding:15px 0 10px 20px;}
ol.dribbbles{margin-left:-11px;}
ol.dribbbles li.group {margin: 0 0  10px 1.69%;width: 22.1143%;float:left;display:inline;text-align:center;font-size:12px;}
#right .courseIng li.group a img{filter:alpha(Opacity=80);-moz-opacity:0.8;opacity: 0.8; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -webkit-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s;}
#right .courseIng li.group a:hover img{filter:alpha(Opacity=100);-moz-opacity:1.0;opacity: 1.0;}
#right .courseAim li{margin:5px 0}
#right .teachInfo h4{margin-bottom:5px;}
#right .teachInfo p{margin-bottom:15px;}
#right .teachInfo .imgDiv{width:30%;margin:20px auto 10px;text-align:center;}
#right .teachInfo .imgDiv img{margin-bottom:5px;}
#right .commentLst,#right .courseLst{overflow:hidden;padding-bottom:0}
#right .commentLst ul,#right .courseLst ul{margin-top:-11px;}
#right .commDiv{padding:15px 0 0 15px;}

#right .commDiv .editCls{margin-right:15px;display:none;}

#right .commDiv li{width:100%;overflow:hidden;margin-bottom:15px;}
#right .commDiv .lbl{float:left;width:60px;}
#right .commDiv .lft{width:180px;}
#right .commDiv textarea{height:70px;margin-bottom:8px;display:block;width:100%;}


.commentLst li,.courseLst li{border-top:dotted 1px #ddd;padding:20px 0;}
.commentLst li .topCont{width:100%;clear:both;overflow:hidden;margin-bottom:8px}
.commentLst li .topCont img{width:28px;height:28px;margin-right:8px;float:left;}
.commentLst li .topCont div{line-height:14px;margin-left:35px}
.commentLst a.comMore{text-align:center;line-height:40px;display:block;background:#f0f0f0;color:#a3a3a3;margin:0 -20px;}
.commentLst a.comMore:hover{text-decoration:none;background:#ddd;color:#333}
.comentDiv h3{font:21px/30px "微软雅黑";text-align:center;padding:10px 0;}
.comentDiv .commentLst{font-size:12px;padding:0;}
.comentDiv .commentLst li{border-top:none;border-bottom:dotted 1px #ddd;}
.comentDiv .comCont{max-height:330px;_height:330px;overflow:auto;padding:0 20px;}
.commentLst .page{padding:20px;}

.courseLst li{padding:20px 0 10px}
.courseLst img{margin:0 0 4px;width:238px\9;}
.courseLst .details{overflow:hidden;padding:5px 0 5px;text-align:center;line-height:10px;}.comentDiv h3{font:21px/30px "微软雅黑";text-align:center;padding:10px 0;}
.courseLst .mask .price{height:24px;line-height:24px;}
.courseLst .mask .small-rating{position:static;margin-top:6px;}
.courseLst a{ text-decoration:none;}
.courseLst .mask .instructors{border-top:1px solid #eee;display:block;overflow:hidden;padding:10px 0;}
.courseLst .mask .instructors .r{margin-left:33px;display:block;_float:left;_margin-left:0;*margin-top:-5px;}
.courseLst .mask .ins-thumb{float:left;border-radius:4px;margin-right:5px;width:40px\9;height:25px;}
.courseLst .mask .ins-name{font-size:12px;font-weight:bold;line-height:14px;}
.courseLst .mask .ins-job-title{margin-top:2px;font-size:12px;line-height:1.2;color:#999;}

.liveCont .tipsCls{font-size:20px;color:#a9a9a9;}
.liveCont .lftCont{float:left;width:92px;height:102px;line-height:102px;background:#900;text-align:center;vertical-align:middle;color:#fff;}
.liveCont .rgtcont{margin-left:100px;}
.liveCont .numLst{font-size:14px;text-align:center;color:#a9a9a9;margin-top:6px;}
.liveCont .numLst li{float:left;line-height:26px;padding:0 3px;}
.liveCont .numLst .bgGreen{background:#a0bb6d;color:#fff;border-radius:4px;-webkit-border-radius:4px;-moz-border-radius:4px;}
.liveCont .jsTow{line-height:24px;font-size:16px;margin-bottom:5px;}
.liveBtn{margin:0 20px 10px;}
.liveBtn .btn{width:100%;width:88%\9;*width:88%;text-align:center;}

/*详细页*/
#videoWrap{background:#2a2a2a;}
#videoWrap .videoCont{width:740px;margin:0 auto;}
#videoWrap .videoCont .tit1{line-height:28px;color:#666;font-weight:400;}
#videoWrap .videoCont .tit1 .fstTit{font-size:12px}
#videoWrap .videoCont .tit1 .thdTit{color:#ddd;}
#videoWrap .videoCont .playDiv{height:416.25px;}

#videoLst{background:#f2f2f2;padding:20px 0;}
#videoLst .lstCont{width:1000px;margin:0 auto;height:120px;}
.es-carousel ul li p{height:38px;overflow:hidden;line-height:18px;}

.rgtcolumn{border:1px #c7c7c7 solid;margin-bottom:10px;background:#fff;}
.rgtcolumn .title{height:30px;line-height:30px;background:#f3f8f4;border-bottom:1px #c7c7c7 solid;}
.rgtcolumn .title span{color:#398041;font-size:14px;font-weight:bold;padding-left:8px;}
.rgtcolumn .title a{color:#398041;font-size:12px;padding-right:9px;}
.rgtcolumn .clearfix{overflow:hidden;zoom:1;}
.rgtcolumn a:hover{transition:none;-o-transition:none;-webkit-transition:none;-moz-transition:none;}
/*最新直播课程预告*/
.rgtcol2_con{padding-top:10px;_height:210px;overflow:hidden;}
.rgtcol2_con ul{width:80px;position:relative;z-index:2;}
.rgtcol2_con ul li{color:#000;font-size:13px;padding:10px 0 12px 9px;border-top:1px #c8c8c8 solid;border-right:1px #c8c8c8 solid;cursor:pointer;}
.rgtcol2_con ul li.on{background:#fff url(../images/news_tab_r.gif) no-repeat right center;border-right:none;}
.rgtcol2_conList{width:199px;_width:178px;*width:178px;padding:10px 10px 14px;margin-left:-1px;border-top:1px #c8c8c8 solid;border-left:1px #c8c8c8 solid;}
.rgtcol2_conList dt{width:96px;}
.rgtcol2_conList dt img{width:96px;height:64px;}
.rgtcol2_conList dd{width:80px;font-size:13px;line-height:18px;padding-top:0;}
.rgtcol2_conList dd strong{display:block;}
.rgtcol2_conList dd a{display:block;font-size:12px;color:#3ba83b;} 
.rgtcol2_conList .btxt{margin:13px 0 0;}
.rgtcol2_conList .btxt strong{color:#323232;font-size:14px;}
.rgtcol2_conList .btxt p{color:#626262;line-height:18px;margin-top:5px;}
.rgtcol2_conList .btxt .btn{margin:10px 2px 0;text-align:center;}
.rgtcol2_conList .con{display:none;}

/************************************************************************************
smaller than 980
*************************************************************************************/
@media screen and (max-width: 1000px) {
	#left{width:67%}
	#right{width:31.5%;}
	.myTopBar .lft{width:20%}
	#videoWrap .videoCont,#videoLst .lstCont{width:auto;}
	#left .commenCont li .rgtDiv{display:block!important;}
}

/************************************************************************************
smaller than 767
*************************************************************************************/
@media screen and (max-width: 767px) {
	.u-courseHead .lft{float:none;width:100%;}
	.myTopBar .lft{display:none;}
	.myTopBar .j-right{width:77%;margin:0}
	
	ol.dribbbles li.group{width:30%;}
	#left .progress .probg{display:none}
	.lftPro .lft,.lftPro .rgt{float:none;display:block;}
	#left .coursCont .series li.worklst{width:47%;}
	.answerCont .replyDiv .ipt{width:68%;}
	.answerCont .lstCont li .rgt{width:34%;overflow:hidden;text-align:right;}
	
	#videoWrap .videoCont .playDiv{height:400px;}
	#left .famousLst li .rgtCont h4{font-size:16px;}
	#videoWrap .videoCont .tit1{padding:0 10px;}
}
/************************************************************************************
smaller than 560
*************************************************************************************/
@media screen and (max-width: 560px) {
	/* disable webkit text size adjust (for iPhone) */
	#left,#right{width:auto;float:none;}
	#left{margin-bottom:20px;}
	.courseLst li{text-align:center;}
	#left .coursCont .series li.worklst{width:98%;}
	#curriculum .list{margin-left:60px}
	
	#videoWrap .videoCont .playDiv{height:250px;}
	#left .famousLst li .lft{float:none;margin:0 auto;}
	#left .famousLst li .rgtCont{margin-left:0}
	.rgtcol2_conList{width:280px;}
}