﻿@charset "utf-8";
/*
 *Creation Date: 2015/8/21
 *Author: longpiyi
 *Descriptions: 绘本教师端
 */

/*表单公共样式*/
input,select{
	padding-left: 5px;
	width: 126px;
	height: 25px;
	box-sizing: border-box;
	border: 1px solid #d8d8d8;
}

/*分页条pgae*/
.page {
	float: right;
	margin-top: 20px;
	overflow: hidden;
}
.page li {
	float: left;
	margin-right: 10px;
	font-size: 1.4em;
}
.page li:last-child{
	margin-right: 0;
}
.page  li a {
	display: block;
	height: 28px;
	line-height: 28px;
	padding: 0 10px 0 10px;
	text-decoration: none;
	border: 1px solid #ddd;
	text-align: center;
    cursor:pointer;
}
.page ul li span {
	display: block;
	height: 28px;
	line-height: 28px;
	padding: 0 10px 0 10px;
	text-decoration: none;
	border: 1px solid #ddd;
	text-align: center;
    cursor:pointer;
}
.page .on a, .page li:hover a {
	color: #fff;
	border: 1px solid #2775ec;
	background-color: #2775ec;
}

.page .thisclass, .page li:hover span {
	color: #fff;
	border: 1px solid #2775ec;
	background-color: #2775ec;
}
.thisclass
{
display: block;
	height: 28px;
	line-height: 28px;
	padding: 0 10px 0 10px;
	text-decoration: none;
	border: 1px solid #ddd;
	text-align: center;
}

/*.page .thisclass/*, .page li:hover a {
	color: #fff;
	border: 1px solid #2775ec;
	background-color: #2775ec;
}*/

/*表格公共样式*/
.table{
	margin-top: 15px;
	width: 100%;
	font-size: 14px;
}
.table td,.table th{
	text-align: center;
	height: 30px;
	color: #666;
	border: 1px solid #dfdfdf;
}
.table th{
	font-weight: normal;
	background-color: #f3f4f6;
}
.table td{
	font-size: 12px;
}
.table td a{
	color: #469ddd;
}
.table td a:hover{
	color: #0750bf;
}




    
    /*修改*/

        
   .t tr>td:first-child>span{
	border-radius: 50%;
	width: 20px;
	height: 20px;
	line-height: 20px;
	display: inline-block;
}     
        

.t tr:nth-child(1)>td:first-child>span{
	color: #fff;
	background-color: #fc0;
}
.t tr:nth-child(2)>td:first-child>span{
	color: #fff;
	background-color: #aeaba3;
}
.t tr:nth-child(3)>td:first-child>span{
	color: #fff;
	background-color: #ea9968;
}


td .done:before,td .undo:before{
	display: inline-block;
	margin-right: 5px;
	width: 11px;
	height: 11px;
	content: '';
}


td .done:before{
	background: url("../images/icon-yes.jpg") no-repeat center center;
}
td .undo:before{
	background: url("../images/icon-no.jpg") no-repeat center center;
}

.table-title{
	margin-top: 20px;
	font-size: 15px;
}

/*列表导航*/
.sort-nav{
	width: 100%;
	margin-top: 15px;
	height: 37px;
	font-size: 14px;
	background-color: #f0f0f0;
}
.sort-nav>li{
	position: relative;
	float: left;
	width: 20%;
	box-sizing: border-box;
	border-right: 1px solid #fff;
	cursor: pointer;
}
.sort-nav>.on,.sort-nav>li:hover{
	background-color: #1761d2;
}
.sort-nav>.on>span,.sort-nav>li:hover>span{
	color: #fff;
}
.sort-nav>li:hover>.sort-sub-nav{
	display: block;
}
.sort-nav>li>span{
	display: block;
	text-align: center;
	color: #666;
	line-height: 37px;
}

.sort-sub-nav{
	position: absolute;
	left: 0;
	/*width: 357px;*/
	min-width: 100%;
	z-index: 10;
	display: none;
	background-color: #e3ebf9;
	border: 1px solid #fff;
}
.sort-sub-nav>li{
	padding: 0 10px;
	font-size: 12px;
	height: 32px;
	line-height: 32px;
	white-space: nowrap;
	clear: both;
}
.sort-sub-nav>li:hover{
	background-color: #b9d5ff;
	color: #0450c4;
}
.sort-sub-nav>li>h3{
	font-weight: normal;
	display: inline-block;
}
.sort-sub-nav>li>span{
	display: none;
	margin-left: 10px;
}
.sort-sub-nav>li:hover>span{
	display: inline-block;
}
.sort-sub-nav>li>span:before{
	margin-right: 5px;
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: #5392f2;
	content: '';
}

/*查询之后结果*/
.after-search{position:relative;}
.after-search>h3{
	font-size: 12px;
	font-weight: normal;
	line-height: 33px;
	color: #898989;
	border-bottom: 1px solid #ededed;
}
.after-search>h3>span{
	color: #0750bf;
}

/*进度条*/
.progress{
	margin-top: 25px;
	display: inline-block;
	width: 100%;
	clear: both;
	font-size: 14px;
	color: #333;
}
.progress>b{
	float: left;
	font-weight: normal;
}
.progress>p{
	float: right;
	width: 700px;
	margin-top: 8px;
	height: 5px;
	background-color: #ededed;
}
.progress>p>span{
	position: relative;
	display: block;
	height: 100%;
	width: 40%;
	background-color: #52b5e3;
}
/*.progress>p>span>i{
	position: absolute;
	right: -15px;
	top: -20px;
	padding: 0 3px;
	height: 15px;
	color: #fff;
	font-size: 12px;
	background-color: #70c9f2;
}*/
.progress>p>span>i{
	position: absolute;
	right: -19px;
	top: -20px;
	min-width: 40px;
	padding: 0 3px;
	height: 15px;
	color: #fff;
	font-size: 12px;
	text-align: center;
	background-color: #70c9f2;
}
.progress>p>span>i:after{
	position: absolute;
	left: 50%;
	bottom: -8px;
	width: 0;
	height: 0;
	border-color: #70c9f2 transparent transparent transparent;
	border-style: solid;
	border-width: 4px;
	content: '';
}
.gradeAvg>p>span{
	background-color: #fa5a71;
}
.gradeAvg>p>span>i{
	background-color: #fe7084;
}
.gradeAvg>p>span>i:after{
	border-color: #fe7084 transparent transparent transparent;
}


/*外框*/
.wrap{
	margin: 15px 0 0 15px;
	width: 1000px;
}

/*筛选*/
.filt{
	padding: 13px 18px;
	font-size: 14px;
	border: 1px solid #e5e5e5;
}
.filt p{
	/*margin-bottom: 6px;*/
}
.filt p label{
	margin-right: 30px;
	display: inline-block;
}
.filt p label i{
	padding: 0 10px;
}
.filt p b{
	min-width: 50px;
	display: inline-block;
	margin-right: 5px;
	text-align: right;
	font-weight: normal;
}
.btn{
	margin-left: 20px;
	display: inline-block;
	padding: 0 20px;
	height: 28px;
	line-height: 28px;
	color: #fff;
	vertical-align: middle;
	background-color: #2775ec;
}



/*弹出窗*/
.alert{
	position: absolute;
	top: 32px;
	left: 0;
	width: 100%;
	border: 1px solid #e7e7e7;
	background-color: #fff;
	box-shadow: 1px 1px 2px rgba(0,0,0,.1);
}
.alert>h2{
	position: relative;
	padding-left: 26px;
	height: 35px;
	font-size: 14px;
	line-height: 35px;
	border-bottom: 1px solid #dcdcdc;
}
.alert>h2>i{
	margin-left: 10px;
	color: #0750bf;
}
.alert-colse{
	margin-right: 20px;
	display: block;
	float: right;
	height: 100%;
	width: 15px;
	cursor: pointer;
	background: url("../images/icon-close.png") no-repeat center center;
}

.alert-list{
	padding: 0 26px;
	height: 540px;
	overflow-y: scroll;
}
.alert-list>li{
	position: relative;
	line-height: 50px;
	clear: both;
	overflow: hidden;
	border-bottom: 1px solid #e7e7e7;
}
.alert-list>li:last-child{
	border-bottom: none;
}

.alert-list .result{
	float: left;
	margin: 10px 0;
	line-height: 1.6;
	max-width: 580px;
}
.alert-list .result span{
	color: #666;
	font-size: 18px;
	/*white-space: nowrap;*/
}
.alert-list .result span sub{
	font-size: 12px;
}
.alert-list .result .bad{
	color: #f63454;
}
.alert-list .alert-btn{
	position: absolute;
	top: 50%;
	right: 0;
	margin-right: 20px;
	display: inline-block;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
}
.alert-list .alert-btn span{
	margin-right: 6px;
	display: inline-block;
	vertical-align: middle;
	width: 40px;
	height: 28px;
	font-size: 16px;
	line-height: 28px;
}
/*.alert-list .alert-btn .play-video{
	width: 28px;
	cursor:pointer;
	background: url("../images/icon-viod.png") no-repeat center center;
}*/

.pv{
	width: 28px;
	cursor:pointer;
	background: url("../images/icon-viod.png") no-repeat center center;
}

.hv
{width: 28px;
	cursor:pointer;
	background: url("../images/icon-viod-hover.png") no-repeat center center;
}



.alert-list .alert-btn .play-video:hover{
	background: url("../images/icon-viod-hover.png") no-repeat center center;
}
/*.alert-list .alert-btn .play-rec{
	width: 28px;
	cursor:pointer;
	background: url("../images/icon-play.png") no-repeat center center;
}*/

.pr
{width: 28px;
	cursor:pointer;
	background: url("../images/icon-play.png") no-repeat center center;
}
.hr
{width: 28px;
	cursor:pointer;
	background: url("../images/icon-play-hover.png") no-repeat center center;
}

.alert-list .alert-btn .play-rec:hover{
	background: url("../images/icon-play-hover.png") no-repeat center center;
}
