﻿
.t_l { text-align: left; }
.t_c { text-align: center; }
.t_r { text-align: right; }

.xxzxleft { width: 200px; float: left; }
.xxzxright { width: 980px; float: right; }


/*学习中心左则菜单区*/
.stu-leftbar { height: auto; overflow: hidden; }

/*用户信息*/
.stu-leftbar-user { /*background: url(../img/xxzx_ub.jpg) center center no-repeat;*/ height: 190px; position: relative; text-align: center }
.stu-leftbar-user > img { position: absolute; left: 50px; top: 30px; width: 100px; height: 100px; border: 0px; }
.stu-leftbar-user > div.username { position: absolute; left: 10px; right: 10px; top: 135px;/* color: white;*/ font-weight: bold; line-height: 50px; }



/*菜单*/
.stu-leftbar-menu ul { margin: 10px 0px; padding: 10px 0px; list-style-type: none; background-color: #F5F5F5; }
.stu-leftbar-menu ul li { display: block; text-align: center; line-height: 50px; font-size: 16px; padding: 5px 0px; }
.stu-leftbar-menu ul li > a { display: block; color: #797979; text-decoration: none; }
.stu-leftbar-menu ul li > a.h { background-color: #EE8686; color: white; }
.stu-leftbar-menu ul li > a.h:hover { color: white !important; }
.stu-leftbar-menu ul li a:hover { color: red; }


/*我的课程*/
.kclist { width: 100%; border-collapse: collapse; border-spacing: 0px 15px; margin-top: 20px; color: #515151; }
.kclist tr td { border-bottom: 1px solid #e0e0e0; vertical-align: top; padding: 20px 5px; font-size: 14px; }

/*标题*/
.kclist tr td div.kctitle { font-size: 18px; color: #222; line-height: 34px; }

/*进度*/
.kclist tr td div.progress { position: relative; margin: 0px auto; margin-top: 5px; height: 10px; padding: 6px 0px; }
.kclist tr td div.progress div { position: absolute; top: 10px; background-color: #F5F5F5; border-radius: 5px; width: 100%; height: 10px; z-index: 1; }
.kclist tr td div.progress p { position: absolute; margin: 0px; padding: 0px; top: 10px; left: 0px; background-color: #C00F24; border-radius: 5px; height: 10px; z-index: 2; }

/*时长等*/
.kclist tr td div.times { line-height: 26px; color: #888; font-size: 14px; }
.kclist tr td div.times span.red { color: #c00f24; margin: 0px 4px; }
/*a标签*/
.kclist tr td div.links { color: #222; height: 26px; padding-top: 10px; }
.kclist tr td div.links > a { display: block; height: 26px; margin-right: 20px; font-size: 14px; float: left; line-height: 26px; padding-left: 20px; color: #777; text-decoration: none; cursor: pointer; }
.kclist tr td div.links > a:hover { text-decoration: underline; }
.kclist tr td div.links > a.kcbj { background: url(../img/kc_bj.png) left center no-repeat; }
.kclist tr td div.links > a.kcpj { background: url(../img/kc_sc.png) left center no-repeat; }
.kclist tr td div.links > a.kcfk { background: url(../img/kc_fk.png) left center no-repeat; }
    .kclist tr td div.links > a.xszm {
        background: url(../img/kc_jl.png) left center no-repeat;
        color: #C00F24;
    }

/*学习按钮*/
.kclist tr td input.studding { height: 42px; padding: 0px 35px; background: #c00f24; font-size: 16px; color: #FFF; border: none; border-radius: 5px; cursor: pointer; }
.kclist tr td input.studding:hover { background: #e01928; }


/*标题行*/
.xxzxtitle { color: #515151; font-weight: bolder; font-size: 16px; height: 50px; }
.xxzxtitle > div.name { float: left; line-height: 50px; padding: 0px 10px; color: #222; }
.xxzxtitle > div.more { float: right; line-height: 50px; padding: 0px 10px; }
.xxzxtitle > div.more > a { color: #666; text-decoration: none; cursor: pointer; }
.xxzxtitle > div.more > a:hover { color: #e01928; text-decoration: underline; }

/*查询条件行*/
.xxzxfilter { color: #515151; height: 50px; padding: 0px 10px; }
.xxzxfilter > div { float: left; line-height: 40px; padding: 0px 5px; color: #222; font-size: 14px; }
.xxzxfilter > div .txt { color: #555; height: 28px; border: 1px solid #BBB; font-size: 14px; border-radius: 5px; padding: 0px 5px; }

.xxzxfilter > div .btn { height: 28px; margin: 0px 10px; padding: 0px 15px; font-size: 14px; border: none; border-radius: 5px; cursor: pointer; background: #e01928; color: #FFF; border: 1px solid #c00f24; }
.xxzxfilter > div .btn:hover { background: #d5011a; border: 1px solid #d5011a; }



/*灰底链接式选项卡*/
.titletab { background-color: #F5F5F5; height: 50px; clear: both; }
.titletab ul { height: 50px; padding: 0px 20px; }
.titletab ul li { float: left; height: 30px; padding: 10px 10px; }
.titletab ul li a { display: inline-block; padding: 0px 10px; line-height: 30px; font-weight: bolder; color: #515151; text-decoration: none; font-size: 14px; cursor: pointer; }
.titletab ul li a.cur { background: #ffe8e8; color: red; }




/*学习页课程笔记选项卡*/
.video_tool_tab { height: 69px; }
.video_tool_tab ul { height: 68px; width: 100%; text-align: center; border-bottom: 1px solid #EEE; }
.video_tool_tab ul li { display: inline-flex; height: 38px; padding: 15px 30px; }
.video_tool_tab ul li a { display: inline-block; line-height: 35px; border-bottom: 3px solid #FFF; cursor: pointer; color: #000; text-decoration: none; }
.video_tool_tab ul li a:hover, .video_tool_tab ul li a.h { border-bottom: 3px solid #e01928; }



/*学习页课程树*/
.videotree { padding: 0px; }
.videotree li.level0 { height: auto; overflow: hidden; position: relative; }
.videotree li.level0 > a { display: block; cursor: pointer; height: 50px; vertical-align: middle; line-height: 48px; padding-left: 35px; background: #f8f8f8; border: 1px solid rgba(238,238,238,1); }
.videotree li.level0 > a > span.ico_open, .videotree li.level0 > a > span.ico_close { position: absolute; display: block; left: 10px; top: 16px; width: 20px; height: 20px; }
.videotree li.level0 > a > span.ico_open { background: url(../img/video/up.png) center center no-repeat; }
.videotree li.level0 > a > span.ico_close { background: url(../img/video/down.png) center center no-repeat; }
.videotree li.level0 > a > span { font-size: 14px; color: #555; }

/*.videotree li.level1 { height: auto; overflow: hidden; position: relative; }
.videotree li.level1 > a { display: block; cursor: pointer; height: 45px; vertical-align: middle; line-height: 42px; padding-left: 55px; background: #FEFEFE; border-bottom: 1px solid #F1F1F1; }
.videotree li.level1 > a > span.ico_open, .videotree li.level1 > a > span.ico_close { position: absolute; display: block; left: 25px; top: 13px; width: 20px; height: 20px; }
.videotree li.level1 > a > span.ico_open { background: url(../img/video/up.png) center center no-repeat; }
.videotree li.level1 > a > span.ico_close { background: url(../img/video/down.png) center center no-repeat; }
.videotree li.level1 > a > span { font-size: 14px; color: #666; }*/

.videotree li.level1 { height: auto; overflow: hidden; position: relative; }
.videotree li.level1 > a { display: block; font-size: 14px; color: #888888; cursor: pointer; height: auto; overflow: hidden; text-decoration: none; vertical-align: middle; padding: 10px 60px 10px 55px; background: #FEFEFE; border-bottom: 1px solid #F1F1F1; }
.videotree li.level1 > a > span.ico_docu { position: absolute; display: block; left: 25px; top: 10px; width: 20px; height: 20px; background: url(../img/video/videofile.png) center center no-repeat; }
.videotree li.level1 > a > span { display: block; line-height: 20px; }
.videotree li.level1 > a:hover { background: #F1F1F1; color: #ff0000 !important; }
a.hhh { background: #F1F1F1; font-weight: bold; color: #ff0000 !important; }
a.hhh > span.ico_docu { background: url(../img/video/videofile_red.png) center center no-repeat !important; }
.videotree li.level1 > a > b, .videotree li.level1 > a > i { color:#FFF; position: absolute; display: block; right: 5px; top: 10px; width: 50px; height: 20px; text-align: center; font-weight: normal; }
.videotree li.level1 > a > b { background: #e8bf00 }
.videotree li.level1 > a > i { font-style: normal; background: #00ba3d }


/* 去掉全屏时显示的自带控制条 */
video::-webkit-media-controls { display: none !important; }
.player { width: 100%; height: 100%; margin: 0 auto; position: relative; }
.player video { position: absolute; width: 100%; height: 100%; }

.player .centerplay { position: absolute; z-index: 1001; width: 100px; padding-top: 70px; line-height: 30px; font-size: 18px; font-weight: bold; color: #FFF; background: rgba(0, 0, 0, 0.3) url(../img/video/bigplay.png) center 7px no-repeat; text-align: center; top: 50%; left: 50%; margin-left: -50px; margin-top: -50px; cursor: pointer; }

.player .video-control { position: absolute; z-index: 1001; background: rgba(117, 7, 22, 0.3); bottom: 0px; left: 0px; right: 0px; height: 30px; padding: 5px 10px; }
.player .video-control div { display: inline-block; line-height: 30px; height: 30px; margin: 0px 10px; font-size: 18px; color: #fff; }
.player .video-control div.fa-play, .player .video-control div.fa-pause, .player .video-control div.fa-expand, .player .video-control div.fa-exitfull { padding-left: 33px; height: 30px; cursor: pointer; margin: 0px 5px; }
.player .video-control div.fa-play { float: left; background: url(../img/video/play.png) left center no-repeat; }
.player .video-control div.fa-pause { float: left; background: url(../img/video/pause.png) left center no-repeat; }
.player .video-control div.fa-expand { float: right; background: url(../img/video/fullscreen.png) left center no-repeat; }
.player .video-control div.fa-exitfull { float: right; background: url(../img/video/exitfullscreen.png) left center no-repeat; }
.player .video-control div.timer { float: left; font-size: 12px; }


/*当前课程笔记*/

.video_note_title { background: #f8f8f8; line-height: 40px; padding: 0px 10px; height: 40px; border-top: 1px solid rgba(238,238,238,1); }
.video_note_title div { height: 38px; }
.video_note_title div a { font-size: 14px; color: #666; cursor: pointer; }

.video_note_item { margin: 10px; height: auto; overflow: hidden; border: 1px solid #ffc59e; background: #fef9df; font-size: 12px; }
.video_note_item > div.notetime { height: 30px; padding-left: 25px; line-height: 30px; position: relative; color: #f26902; background: #fce480 url(../img/time.png) 5px center no-repeat; }
.video_note_item > div.notetime > div.notetimemorebtns { position: absolute; right: 10px; top: 0px; height: 30px; line-height: 30px; }
.video_note_item > div.notetime > div.notetimemorebtns a { cursor: pointer; color: #C00F24; margin-right: 10px; cursor: pointer; text-decoration: none; }
.video_note_item > div.notetime > div.notetimemorebtns a:hover { text-decoration: underline; }

.video_note_item > div.notenav { height: 30px; line-height: 30px; padding: 0px 10px; color: #444; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; outline: none; }
.video_note_item > div.notecontent { line-height: 24px; color: #666; padding: 5px; overflow: hidden; }


/*笔记填写表单*/
.notefilltable { font-size: 12px; }
.notefilltable > tr > td, .notefilltable > tbody > tr > td { height: 30px; color: #333; padding: 3px 3px; }
.notefilltable > tr > td > tt, .notefilltable > tbody > tr > td > tt { color: red; margin: 0px 3px; }
.notefilltable input.txt, .notefilltable select.txt, .notefilltable textarea.txt { height: 24px; line-height: 24px; border: 1px solid #BBB; font-size: 12px; color: #333; padding: 0px 5px; margin: 0px 4px; }
.notefilltable input.txt:focus, .notefilltable select.txt:focus, .notefilltable textarea.txt:focus { border: 1px solid #525252; box-shadow: 0px 0px 3px #B6B6B6; }

.notefilltable input.btn { height: 26px; line-height: 26px; border: 0px; font-size: 12px; color: #FFF; padding: 0px 25px; background: #E01928; cursor: pointer; }
.notefilltable input.btn:hover { box-shadow: 0px 0px 5px #AAA; }


/*人脸识别*/
.faceiif { }
.faceiif_main { width: 320px; height: auto; margin: 0px auto; background: #FFF; padding: 10px; }
.faceiif_main_video { height: 200px; width: 200px; margin: 10px auto; border: 2px solid #e01928; position: relative; }
.faceiif_main_video > video { height: 200px; width: 200px; background: #515151; }
.faceiif_main_tip { padding: 10px; font-size: 12px; color: #777; }

/*无法启动人脸提示*/
.noface { display: none; position: absolute; z-index: 9; padding: 10px; line-height: 30px; color: #FFF; top: 0px; bottom: 0px; left: 0px; right: 0px; background-color: rgba(50, 50, 50,0.8); }

/*开始验证按钮*/
.startfacebtn1{ display: none; position: absolute; z-index: 9; cursor: pointer; text-align: center; line-height: 200px; color: #FFF; top: 0px; bottom: 0px; left: 0px; right: 0px; background-color: rgba(50, 50, 50,0.8); }
.startfacebtn {
    /* border: 1px solid; */
    /* display: none; */
    position: absolute;
    z-index: 9;
    height: 28px;
    line-height:28px;
    cursor: pointer;
    text-align: center;
    /* line-height: 200px; */
    color: #FFF;
    /* top: 0px; */
    bottom: 0px;
    width: 100%;
    left: 0px;
    background: #c00f24;
    right: 0px;
    /* background-color: rgba(50, 50, 50,0.8); */
}
.startfacebtn2 {
    /* border: 1px solid; */
    /* display: none; */
    position: absolute;
    z-index: 9;
    height: 28px;
    cursor: pointer;
    text-align: center;
    /* line-height: 200px; */
    color: #FFF;
    /* top: 0px; */
    bottom: 1px;
    width: 100%;
    left: 0px;
    background: #c00f24;
    right: 0px;
    /* background-color: rgba(50, 50, 50,0.8); */
}
/*人脸强制验证*/
.faceiif_must { position: fixed; z-index: 999999999; background-color: rgba(128, 128, 128,0.5); top: 0px; right: 0px; left: 0px; bottom: 0px; }
.faceiif_must .faceiif_main { border: 1px solid #333; margin-top: 150px; border-radius: 5px; box-shadow: 0px 0px 3px #666; }


.faceiif_main_musttip { padding: 10px; font-size: 12px; color: #e01928; display: none; }
.faceiif_must .faceiif_main_tip { display: none; }
.faceiif_must .faceiif_main_musttip { display: block !important; }



/*人脸认证采集*/
.facecheck_main { height: auto; overflow: hidden; padding: 20px; width: 450px; margin: 0px auto; }
.facecheck_video { float: left; height: 200px; width: 200px; margin: 10px auto; border: 2px solid #e01928; position: relative; }

.facecheck_tip { float: left; padding: 10px 20px; color: #444; font-size: 12px; width: 160px; }



/*常规按钮*/
.btnred, .btngray { height: 34px; margin: 0px 10px; padding: 0px 10px; font-size: 14px; border: none; border-radius: 5px; cursor: pointer; }
.btnred { background: #c00f24; color: #FFF; border: 1px solid #c00f24; }
.btnred:hover { background: #d5011a; border: 1px solid #d5011a; }
.btngray { background: #cecece; border: 1px solid #acacac; color: #222; }
.btngray:hover { background: #b0b0b0; }
