.contain{ width: 1100px; margin: 0 auto; }

.banner{ width: 100%; height: 220px; padding: 40px; background: url("../images/userhome/shomebanner.png") 50% 0 no-repeat; }
.banner .headimg{ width: 135px; height: 135px; overflow: hidden; border: 3px solid #fff; border-radius: 50%; margin-right: 20px; }
.banner .headimg img{ width: 100%; height: 100%; }
.banner .main-info{ width: 440px; }
.banner .main-info .name{ width: 100%; font-size: 24px; line-height: 40px; color: #fff; margin-bottom: 4px; }
.banner .main-info .integral{ width: 100%; font-size: 16px; line-height: 20px; color: #fff; margin-bottom: 10px; }
.banner .main-info .integral a{ color: #fff; margin-right: 20px; }
.banner .main-info .integral a:hover{ color: #f89b38; }
.banner .main-info .school{ width: 100%; font-size: 14px; line-height: 20px; color: #fff; margin-bottom: 12px; }
.banner .main-info .rela-btn-box{ width: 100%; }
.banner .main-info .rela-btn-box .attent{ width: 76px; height: 26px; line-height: 26px; margin-right: 30px; }
.banner .main-info .rela-btn-box .attented{ position: relative; display: block; width: 76px; height: 26px; line-height: 26px; margin-right: 30px; background-color: rgba(255,255,255,.2);
    font-size: 12px; text-align: center; color: #fff; cursor: pointer; border-radius: 4px; }
/*.banner .main-info .rela-btn-box .attented:hover:after{ content: '取消关注'; position: absolute; top: 0; left: 0; display: block; width: 76px; height: 26px; line-height: 26px; margin-right: 30px; background-color: #53606d;
    font-size: 12px; text-align: center; color: #fff; cursor: pointer; border-radius: 4px; }*/
.banner .main-info .rela-btn-box .sendmsg{ width: 76px; height: 26px; line-height: 26px; margin-right: 30px; }

.banner .rela-info{ width: 500px; padding-top: 50px; }
.banner .rela-info .info{ padding-left: 26px; padding-right: 40px; border-right: 1px solid #fff; }
.banner .rela-info .info:first-child{ border-right:none; }
.banner .rela-info .info .iconfont{ font-size: 40px; line-height: 40px; color: #fff; margin-right: 10px; }
.banner .rela-info .info .text{  }
.banner .rela-info .info .text .title{ display: block; font-size: 14px; line-height: 1; color: #fff; }
.banner .rela-info .info .text .number{ font-size: 18px; line-height: 26px; color: #fff; }

/*动态*/
.home-main{ width: 100%; padding:30px; }
.home-main .aside-left{ width: 180px; padding: 12px 0; background-color: #293948; border-radius: 4px 0 0 4px; margin-right: 40px;
    -webkit-box-shadow: 2px 0 3px 0 rgba(6, 7, 11, 0.25);
    -moz-box-shadow: 2px 0 3px 0 rgba(6, 7, 11, 0.25);
    box-shadow:  2px 0 3px 0 rgba(6, 7, 11, 0.25);
}
.home-main .aside-left .select{ display: block; width:100%; height: 48px; line-height: 48px; color: #fff; padding: 0 20px; }
.home-main .aside-left .select:hover{ color: #f89b38; }
.home-main .aside-left .select.active{ width: 200px; background-color: #f89b38; border-radius: 4px 0 0 4px; padding-left: 40px; margin-left: -20px;
    -webkit-box-shadow: -1px 1px 2px 0 rgba(197, 99, 2, 0.44);
    -moz-box-shadow: -1px 1px 2px 0 rgba(197, 99, 2, 0.44);
    box-shadow:-1px 1px 2px 0 rgba(197, 99, 2, 0.44);
}
.home-main .aside-left .select.active:hover{ color: #fff; }
.home-main .aside-left .select .iconfont{ font-size: 14px; margin-right: 16px; }
.home-main .aside-left .select .text{ font-size: 16px; }

.home-main .home-right{ width: 880px; padding-bottom: 60px; }
.home-main .home-right .tab-box{ width: 100%; border-bottom: 1px solid #ccc; }
.home-main .home-right .tab-box a{ font-size: 16px; line-height: 1; padding-bottom: 10px; /*color: #f89b38; border-bottom: 4px solid #f89b38;*/ margin-right: 40px; }
.home-main .home-right .tab-box a:hover{ color: #f89b38; }
.home-main .home-right .tab-box a.active{ color: #f89b38; border-bottom: 4px solid #f89b38; }

.dynamic-box{ width: 100%; padding: 10px; }
.dynamic-box .dynamic{ padding: 10px 20px; background-color: #fff; margin-top: 30px;
    -webkit-box-shadow: 0 4px 8px 0 rgba(181, 181, 181, 0.23);
    -moz-box-shadow: 0 4px 8px 0 rgba(181, 181, 181, 0.23);
    box-shadow: 0 4px 8px 0 rgba(181, 181, 181, 0.23);
}
.dynamic-box .dynamic .img{ position: relative; top: -26px; width: 58px; height: 58px; border-radius: 50%; margin-right: 20px; }
.dynamic-box .dynamic .img img{ width: 100%; height: 100%; border-radius: 50%; }
.dynamic-box .dynamic .info-box{ width: 830px; }
.dynamic-box .dynamic .info-box .name{ width: 100%; font-size: 12px; line-height: 1; color: #999; margin-bottom: 10px; }
.dynamic-box .dynamic .info-box .text{ width: 100%; font-size: 14px; line-height: 1; margin-bottom: 8px; }
.dynamic-box .dynamic .info-box .text .course-name:hover{ color: #f89b38; }
.dynamic-box .dynamic .info-box .time{ width: 100%; text-align: right; font-size: 12px; line-height: 1; color: #999; }

/*课程*/
.course-box{ width: 100%; padding: 10px; }
.course-box .course{ padding: 10px; background-color: #fff; margin-top: 20px;
    -webkit-box-shadow: 0 4px 8px 0 rgba(181, 181, 181, 0.23);
    -moz-box-shadow: 0 4px 8px 0 rgba(181, 181, 181, 0.23);
    box-shadow: 0 4px 8px 0 rgba(181, 181, 181, 0.23);
}
.course-box .course .course-img{ position: relative; width: 280px; height: 150px; overflow: hidden; margin-right: 50px; }
.course-box .course .course-img .flag{ position: absolute; top: 12px; left: 0; width: 80px; height: 20px; line-height: 20px; background-color: #f89b38; color: #fff; text-align: center; border-radius: 0 4px 4px 0; }
.course-box .course .course-img img{ width: 100%; height: 100%; }
.course-box .course .info-box{ width: 610px; padding-top: 10px; }
.course-box .course .info-box .course-name{ display: block; width:100%; font-size: 16px; font-weight: bold; line-height: 24px; margin-bottom: 20px; }
.course-box .course .info-box .course-name:hover{ color: #f89b38; }
.course-box .course .info-box .progress{ width:100%; font-size: 16px; color: #f89b38; line-height:1; margin-bottom: 20px; }
.course-box .course .info-box .timeofuse{ width:100%; font-size: 14px; color: #666; line-height: 1; margin-bottom: 20px; }
.course-box .course .info-box .learn-position{ width:100%; font-size: 14px; color: #666; line-height: 1; }

/*评价*/
.avalute-box{ width: 100%; padding: 10px; }
.avalute-box .avalute{ padding: 10px 20px; background-color: #fff; margin-top: 20px;
    -webkit-box-shadow: 0 4px 8px 0 rgba(181, 181, 181, 0.23);
    -moz-box-shadow: 0 4px 8px 0 rgba(181, 181, 181, 0.23);
    box-shadow: 0 4px 8px 0 rgba(181, 181, 181, 0.23);
}
.avalute-box .avalute .course-name{ display: block; font-size: 18px; line-height: 24px; color: #f89b38; margin-bottom: 16px; }
.avalute-box .avalute .course-name:hover{ color: #f89b38; }
.avalute-box .avalute .text{ height: 56px; font-size: 14px; line-height: 28px; margin-bottom: 10px; }
.avalute-box .avalute .text:after{ top: -28px;
    background: -webkit-gradient(linear, left top, right top, from(rgba(255,255,255,.1)),to(#fff),color-stop(50%, #fff));
    background: -moz-linear-gradient(to right, rgba(255,255,255,.1), #fff 50%, #fff);
    background: -ms-linear-gradient(to right, rgba(255,255,255,.1), #fff 50%, #fff);
    background: -o-linear-gradient(to right, rgba(255,255,255,.1), #fff 50%, #fff);
    background: linear-gradient(to right, rgba(255,255,255,.1), #fff 50%, #fff);
}
.avalute-box .avalute .time{ font-size: 12px; line-height: 18px; color: #999; }

/*讨论*/
.discuss-box{ width: 100%; padding: 10px; }
.discuss-box .discuss{ padding: 10px 20px; background-color: #fff; margin-top: 20px;
    -webkit-box-shadow: 0 4px 8px 0 rgba(181, 181, 181, 0.23);
    -moz-box-shadow: 0 4px 8px 0 rgba(181, 181, 181, 0.23);
    box-shadow: 0 4px 8px 0 rgba(181, 181, 181, 0.23);
}
.discuss-box .discuss .text{ display: block; height: 56px; font-size: 14px; line-height: 28px; margin-bottom: 20px; }
.discuss-box .discuss .text:hover{ color: #f89b38; }
.discuss-box .discuss .text:after{ top: -28px;
    background: -webkit-gradient(linear, left top, right top, from(rgba(255,255,255,.1)),to(#fff),color-stop(50%, #fff));
    background: -moz-linear-gradient(to right, rgba(255,255,255,.1), #fff 50%, #fff);
    background: -ms-linear-gradient(to right, rgba(255,255,255,.1), #fff 50%, #fff);
    background: -o-linear-gradient(to right, rgba(255,255,255,.1), #fff 50%, #fff);
    background: linear-gradient(to right, rgba(255,255,255,.1), #fff 50%, #fff);
}
.discuss-box .discuss .info-box{ font-size: 14px; line-height: 20px; color: #999; }
.discuss-box .discuss .info-box .origin{ color: #f89b38; margin-right: 50px; }