<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">/* If you want you can use font-face */


* {
	margin: 0;
	padding: 0;
}


body{
	text-align: justify;
	font-family: "AndBasR","微軟正黑體", "Microsoft JhengHei", "新細明體", "PMingLiU", "細明體", "MingLiU", "標楷體", "DFKai-sb", serif;
	font-size: 12px;
	color: #000;
	background-color: #FAFAFA;
	word-break: break-all;
}


h1, h2, h3 {
	font-family: "AndBasR","微軟正黑體", "Microsoft JhengHei", "新細明體", "PMingLiU", "細明體", "MingLiU", "標楷體", "DFKai-sb", serif;
}

h1{
	font-size:14pt;
	font-weight: bold;
	color: #666666;
}

h2 {
	font-size:9pt;
	color: #666666;
}

h3 {
}

p, blockquote {
	margin-bottom: 5px;
	line-height: 2em;
	font-family: "微軟正黑體", "Microsoft JhengHei", "新細明體", "PMingLiU", "細明體", "MingLiU", "標楷體", "DFKai-sb", serif;

}


a{
	cursor: pointer;
	font-family: "微軟正黑體", "Microsoft JhengHei", "新細明體", "PMingLiU", "細明體", "MingLiU", "標楷體", "DFKai-sb", serif !important;
}

button{
	cursor: pointer;
}
/*
div{
	font-family: "微軟正黑體", "Microsoft JhengHei", "新細明體", "PMingLiU", "細明體", "MingLiU", "標楷體", "DFKai-sb", serif !important;

}
*/


.hasPlaceholder {
	color: #CCC;
}


/*Page*/
.page_title{
	width: 40%;
	padding: 5px 0px 5px 5px;
	font-size: 14pt;
	margin: 0 auto;
	margin-bottom: 10px;
	color: #FFF;
	background-color: #737855;
	text-align: center;
}

/* Background Decoration*/
#backgroundContainer{
	width: 100%;
	margin: 0 auto;

}

/* Header :    */
/* header.html */

#header {
	width: 1024px;
	min-height: 75px;
	padding-top: 0px;
	margin-bottom: 5px;
	_text-align:right;
	_padding-right: 50px;
	margin: 0 auto;
}

#logo{
	width: 1024px;
	height: 75px;
	background: url("images/logo_SN.png") no-repeat left 35%;
}

.beta_logo{
	position: relative;
	left: -30px;
	top: 33px;
	margin: 0px 0px -33px 0px;
	float: left;
	width: 35px;
	height: 13px;
	background: url("images/beta_icon.png") no-repeat left top;
}
/* Main Page */
/* index.html */
#TopPage{
	clear: both;
	width: 100%;
}

/* Content */
#ContentPage {
	position: relative;
	float: left;
	width: 100%;
	z-index: 1;
}

#ContentPage2 {
	float: left;
	width: 860px;
	_width: 705px;
}

.sharenet_logo{
	width: 155px;
	height: 30px;
	margin-top: 8px;
	margin-right: 5px;
}

/* 左工具列 */
#leftBar{
	float: left;
	width: 150px;
	min-height: 650px;
}


.categoryLeftBar{
	margin: 0px 0px 5px 0px;
}

.categoryLeftBar h1{
	background-color: #76a8f7;
	color: #FFF;
	text-align: center;
	font-size: 13pt;
	padding: 1px 0px 1px 0px;
	moz-box-shadow: 1px 1px 2px #AAA; /* Firefox */
	-webkit-box-shadow: 1px 1px 2px #AAA; /* Safari 和 Chrome */
	box-shadow: 1px 1px 2px #AAA; /* Opera 10.5 + */

}

.categoryRightBar{
	margin: 0px 0px 5px 0px;
}

.categoryRightBar h1{
	background-color: #76a8f7;
	color: #FFF;
	text-align: center;
	font-size: 13pt;
	padding: 1px 0px 1px 0px;
	moz-box-shadow: 1px 1px 2px #AAA; /* Firefox */
	-webkit-box-shadow: 1px 1px 2px #AAA; /* Safari 和 Chrome */
	box-shadow: 1px 1px 2px #AAA; /* Opera 10.5 + */
	margin-bottom: 5px;
}

.categoryBlock{
	padding: 10px;
}

.categoryBlock&gt;div{
	display: inline-block;
	margin-right: 10px;
}

.categoryBlock .labelClose{
	width: 10px; 
	height: 18px;
	color: white;
	margin-left: 10px;
	font-weight: bold;
}

.quizBankBlock{
	margin: 0 auto;
	width: 90%;
	border: 1px solid #CCC;
	border-radius: 10px;
	padding-top: 10px;
	margin-top: 10px;
}

.courseList{
	/*
	background: url(images/free_small_icon.png) left center no-repeat;
	padding-left: 25px;*/
	margin: 3px 0px 2px -20px;
	overflow: hidden;
	width: 160px;
	white-space: nowrap; 
	text-overflow: ellipsis;
}

.singleRecommBlock{
	margin: 0 auto;
	width: 170px;
	min-height: 50px;
	border-bottom: 1px dotted #DDD;
	margin-top: 2px;
	margin-bottom: 3px;
}

.singleRecommBlock .pictureBlock{
	float: left;
	width: 60px;
	height: 45px;
	text-align: center;
	margin: 0 auto;
	margin-bottom: 3px;
}

.singleRecommBlock .pictureBlock iframe{
	width: 60px;
	height: 45px;
}

.singleRecommBlock .pictureBlock img{
	max-width: 60px;
	max-height: 45px;
}

.singleRecommBlock .titleBlock{
	float: right;
	width: 105px;
	height: 45px;
	
}

.singleRecommBlock .titleBlock div{
	width: 105px;
	white-space: nowrap; 
	text-overflow: ellipsis;
	overflow: hidden;
}

.categoryLeftBar .menu &gt;div{
	width: 100%;
	list-style-type: none;
	margin: 5px 0px 5px 0px;
	padding-bottom: 5px;
	border-bottom: 1px dotted #CCC;
	text-align: center;
}




.categoryLeftBar .menu a{
	width: 100%;
	font-weight: bold;
	color:#333333; 
	text-decoration:none; 
	font-size:12pt;
	
}



.categoryLeftBar .menu .now_category{
	background-color: #DDD;
	padding: 8px 0px 8px 0px;
}

.categoryLeftBar .menu .category a:hover{
	/*background: url(images/icons/glyphicons_211_right_arrow.png) left top no-repeat;*/
	color: #888;
}

.categoryLeftBar .menu .now_category a{
	color: #000;
	
}

.categoryRightBar .relativeLink{
	margin-top: 5px;
}

.categoryRightBar .fb_relative div{
	float: left;
	margin: 3px 3px 3px 0px;
}

.courseListTitle{
	width: 660px;
	height: 40px;
	background-color: #e4e9ff;
	color: black;
	padding: 5px 0px 0px 0px;
	border: 1px solid #bfcbff;
}


.searchBox{
	/*background: url(images/search_SN_input.png) no-repeat 15% center;*/
	width: 200px;
	height: 30px;
	color: black;
	float: right;
	margin: 9px 0px 0px 10px;
}


.courseListSort{
	margin-top: 5px;
}

.courseListSort div{
	width: 60px;
	height: 20px;
	line-height: 20px;
	text-align: center;
	float: left;
	border: 1px solid #bfcbff;
	cursor: pointer;
	margin: 0px 5px 0px 0px;
}

.courseListSort .selected{
	background-color: #ddedc6;
	
}

.selectToolCategory{
	width:70px;
	font-size: 14pt;
	font-weight: bold;
	border: 1px solid #CCC; 
	background-color: #CCC;
	border: 1px solid #999;
	height: 38px;
}
.notselectToolCategory{
	width:70px;
	font-size: 12pt;
	border: 1px solid #999;
	height: 38px;
}

.selectCategory{
	width:70px;
	font-size: 13pt;
	font-weight: bold;
	border: 1px solid #CCC; 
	background-color: #CCC;
	border: 1px solid #999;
}
.notselectCategory{
	width:70px;
	font-size: 11pt;
	border: 1px solid #999;
}

.open_close{
	background-color: #acd4f6; 
	border: 1px solid #2594f2;
	color: #2594f2;
}

/* 右工具列 */
#rightBar{
	float: right;
	width: 180px;
}

.right_box{
	background-color: #333333;
	margin: 0px 0px 5px 0px;
	color: #FFF;
	padding-bottom: 10px;
}

.right_box h1{
	background: url(images/rightBar_title_back_03.png) repeat-x left top;
	height: 41px;
	line-height: 35px;
	text-align: left;
	padding-left: 10px;
	color: #FFF;
}

.right_box ul li{
	background: url(images/rightBar_seperator.png) no-repeat left bottom;
	height: 24px;
	line-height: 24px;
	padding: 5px 0px 5px 0px;
	list-style-type:none;
}

.right_box .tool_person{
	background: url(images/icon_personal.gif) no-repeat left center;
	height: 24px;
	line-height: 24px;
	text-align: left;
	padding-left: 24px;
	color: #FFF;
	cursor: pointer;
}

.right_box .tool_personEdit{
	background: url(images/icon_edit_profile.gif) no-repeat left center;
	height: 24px;
	line-height: 24px;
	text-align: left;
	padding-left: 24px;
	color: #FFF;
	cursor: pointer;
}


.right_box .tool_set{
	background: url(images/icon_set.gif) no-repeat left center;
	height: 24px;
	line-height: 24px;
	text-align: left;
	padding-left: 24px;
	color: #FFF;
	cursor: pointer;
}

.right_box .tool_pay{
	background: url(images/icon_payment.gif) no-repeat left center;
	height: 24px;
	line-height: 24px;
	text-align: left;
	padding-left: 24px;
	color: #FFF;
	cursor: pointer;
}

.right_box .ads{
	width: 90%;
	min-height: 40px; 
	text-align: center;
	margin: 0 auto;
	margin-top: 5px;
	margin-bottom: 5px;
	background-color: #FFF;
	padding-top: 8px;
}

.right_box .ads img{
	border: 0px;
}

.right_box .news{
	width: 90%;
	text-align: left;
	margin: 0 auto;
	margin-top: 5px;
	margin-bottom: 5px;
}

.right_box .news a{
	color: #FFF;
	line-height: 25px;
}

.right_box .news a:hover{
	color: red;
}

.right_box .news_block{
	background: url(images/rightBar_seperator.png) no-repeat left bottom;
	min-height: 40px;
	text-align: left;
	padding: 10px 5px 5px 5px;
}

.enter_button_white{
	background: url(images/enter_button_white.png) no-repeat left top;
	width: 22px;
	height: 22px;
	margin: 10px 10px 0px 0px; 
	float: right; 
	border: 0px;
	cursor: pointer;
}

#more_news_button{
	 margin: 5px;
	 margin-left: 60%;
	 border: 0px;
	 cursor: pointer; 
	 color: #f48d0d;
	 background-color: #333;	 
}


/* Header */
#login{
	/*background: url(images/sub_Separator.png) no-repeat center center;*/
	float: right;
	min-width: 160px;
	height: 30px;
	line-height: 30px;
	margin: 9px 0px 0px 0px;
	font-weight: bold;
	text-align: left;
}

#login .loginBtn{
	float: left;
	width: 35px;
	height: 30px;
	line-height: 30px;
	display: inline-block;
	font-size: 11pt;
	color: #FFF;
	cursor: pointer;
}

#login .loginBtn:hover{
	color: #000;
}

.cross_button_div{
	background: url(../../../images/btn_delete_circle.png) no-repeat left top;
	float: right;
	margin: 5px 5px 0px 0px;
	width: 20px;
	height: 20px;
	cursor: pointer;
}



.dialog_header{
	width: 450px;
	height: 40px;
	/*background-color: #76a8f7;*/
	background-color: #222;
	border-radius: 5px;
}

.dialog_content{
	width: 450px;
	height: 170px;
	background-color: #FFF;
}

.dialog_content h1{
	font-size: 20pt;
	font-weight: bold;
	margin-left: 10%;
}

.dialog_content h2{
	margin-left: 10%;
}

.dialog_footer{
	width: 450px;
	height: 0px;
}

.logo_pic{
	background: url(images/logo_SN.gif) no-repeat left center;
	margin: 0 auto;
	width: 340px;
	height: 80px;
}



#inviteBlock{
	border: 1px solid #72b0de;
	margin: 5px;
	min-height: 50px;
	padding-bottom: 10px;
	text-align: center;
}

#inviteBlock h1{
	background-color: #72b0de;
	text-align: center;
}

#inviteBlock img{
	width: 160px;
	margin: 5px;
	border: 1px solid #bfd7fd;
	padding: 5px;
	
}


/*Home Page:*/

#flashAds{
	margin: 0 auto;
	margin-top: 10px;
	margin-bottom: 20px;
	width: 70%;
	text-align: center;
	background-color: FFF;
	border: 1px solid #BBB;
	padding: 5px;
}

#homeCourseExpert h1{
	padding: 10px 20px 10px 35px;
	margin: 10px 10px 10px 0px;
	background: url(images/titleBox.png) no-repeat left center;
}

#homeCourseStudent h1{
	padding: 10px 20px 10px 35px;
	margin: 10px 10px 10px 0px;
	background: url(images/titleBox.png) no-repeat left center;
}

#toolBar{
	position: fixed;
	background: url(images/toolback.png) left top repeat-x;
	z-index: 100;
	height: 40px;
	width: 100%;
	moz-box-shadow: 1px 1px 5px #555; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #555; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #555; /* Opera 10.5 + */

}

.loginBlock{
	float: right;
	margin: 10px;
}

.site_title{
	margin-left: 10px;
}

.toolbar_set{
	float: right;
	margin-right: 60px;
}

.toolbar_link{
	float: right;
	padding: 10px;
	margin-right: 10px;
}

.toolbar_link a{
	color: #CCC;
	font-weight: bold;
	font-size: 12pt;
}

.introBlock{
	width: 100%;

}

.introBlock .blocks{
	-moz-box-shadow:2px 2px 10px #000;
	-webkit-box-shadow:2px 2px 10px #000 ;
	box-shadow:2px 2px 10px #000;
}

.charBlock{
	float: left; 
	margin: 300px 0px 0px 150px;
	font-size: 14pt;
	color: black;
	font-weight: bold;
}

.charBlock&gt;div{
	height: 50px;
	cursor: pointer;
}

.charBlock&gt;div{
	height: 50px;
	cursor: pointer;
}

#navigate_top{
	position: fixed;
	left: 90%;
	top: 85%;
	width: 26px;
	height: 26px;
	cursor: pointer;
}

.nav{
	margin-bottom: 18px;
}

.formTable{
	margin: 0 auto;
	margin-top: 10px;
	width: 80%;
}

.formTable tr th{
	width: 40%;
	height: 28px;
	line-height: 28px;
	text-align: center;
	vertical-align: top;
}

.formTable tr td{
	height: 28px;
	line-height: 28px;
	text-align: center;

}

.errorMsg{
	display: none;
	color: red;
}


/*#tool_main .btn_left{
	background: url(images/btn_main_left.gif) no-repeat left center;
	float: left;
	color: #FFF;
	line-height:47px;
	font-weight: bold;
	text-decoration: none;
	width: 167px;
	height: 47px;
	cursor: pointer;
}

#tool_main .btn_left_selected{
	background: url(images/btn_main_left_Select.gif) no-repeat left center;
	float: left;
	color: black;
	font-weight: bold;
	line-height:47px;
	text-decoration: none;
	width: 167px;
	height: 47px;
	cursor: pointer;
}

#tool_main .btn_left:hover{
	background: url(images/btn_main_left_Select.gif) no-repeat left center;
	color: black;
}

#tool_main .btn_center{
	background: url(images/btn_main_middle.gif) no-repeat left center;
	float: left;
	color: #FFF;
	font-weight: bold;
	line-height:47px;
	text-decoration: none;
	width: 167px;
	height: 47px;
	cursor: pointer;
}

#tool_main .btn_center_selected{
	background: url(images/btn_main_middle_Select.gif) no-repeat left center;
	float: left;
	color: black;
	font-weight: bold;
	line-height:47px;
	text-decoration: none;
	width: 167px;
	height: 47px;
	cursor: pointer;
}

#tool_main .btn_center_fade{
	background: url(images/btn_main_middle.gif) no-repeat left center;
	float: left;
	color: #333;
	line-height:47px;
	text-decoration: none;
	width: 167px;
	height: 47px;
	cursor: not-allowed;
}

#tool_main .btn_center:hover{
	background: url(images/btn_main_middle_Select.gif) no-repeat left center;
	color: black;
}

#tool_main .btn_right{
	background: url(images/btn_main_right.gif) no-repeat left center;
	float: left;
	color: #FFF;
	line-height:47px;
	font-weight: bold;
	text-decoration: none;
	width: 167px;
	height: 47px;
	cursor: pointer;
}

#tool_main .btn_right_selected{
	background: url(images/btn_main_right_Select.gif) no-repeat left center;
	float: left;
	color: black;
	font-weight: bold;
	line-height:47px;
	text-decoration: none;
	width: 167px;
	height: 47px;
	cursor: pointer;
}

#tool_main .btn_right_fade{
	background: url(images/btn_main_right.gif) no-repeat left center;
	float: left;
	color: #333;
	line-height:47px;
	text-decoration: none;
	width: 167px;
	height: 47px;
	cursor: not-allowed;
}

#tool_main .btn_right:hover{
	background: url(images/btn_main_right_Select.gif) no-repeat left center;
	color: black;
}
*/

#tool_main{
	/* width: 1024px; @khchen 20150616*/
	margin: 0 auto;
}

#tool_main .btn_tool{
	float: left;
	font-size: 13pt;
	font-weight: bold;
	width: 100px;
	height: 30px;
	line-height: 30px;
	margin-top: 9px;
	cursor: pointer;
}

#tool_main .btn_tool:hover{
	color: black;
}

#tool_main .btn_tool_fade{
	float: left;
	color: #87a4cf;
	font-size: 13pt;
	font-weight: bold;
	width: 1500px;
	height: 30px;
	line-height: 30px;
	cursor: not-allowed;
}

#tool_main .btn_tool_selected{
	color: #FFF;
	text-decoration: underline;
}

#tool_main .btn_tool:hover{
	
}

#tool_main .my-dropdown-menu{
	float:right;
	width: 120px;
	background-color: #76a8f7; 
	position: relative;
	top: 38px;
	left: -555px;
	display: none;
	padding-top: 0px;
	margin-bottom: -70px;
	color: #FFF;
	z-index:1;
}

#tool_main .my-dropdown-menu div{
	width: 110px;
	height: 25px;
	line-height: 25px;
	font-weight: bold;
	padding: 5px;
	cursor: pointer;
}

#tool_main .my-dropdown-menu div:hover{
	color: #000;
}

#langSelectBox{
	float: right;
	margin: 10px 20px 0px 0px; 
	background: url(images/btn_main_ComboBox.gif) no-repeat right center;
	width: 110px;
	height: 22px;
	text-align: left;
	font-size: 13pt;
	color: #FFF;
	cursor: pointer;
}

#langSelectBox:hover{
	background: url(images/btn_main_ComboBox_RO.gif) no-repeat right center;
}

#langDropBox{
	display: none;
	position: absolute;
	top: 32px;
	right: 30px;
	width: 88px;
	height: 46px;
	text-align: center;
	border-left: 1px solid black;
	border-bottom: 1px solid black;
	border-right: 1px solid black;
	z-index: 1;
}

#langDropBox div{
	width: 88px;
	height: 22px;
	background-color: #FFF;
	color: #000;
	border-top: 1px solid black;
	font-size: 11pt;
	cursor: pointer;
}

#langDropBox div:hover{
	background-color: #DDD;
}

#accountSelectBox{
	float: right;
	margin: 10px 0px 0px 0px; 
	width: 350px;
	height: 22px;
	text-align: right;
	line-height: 22px;
	color: black;
	cursor: pointer;

}

#accountSelectBox .myemail{
	width: 197px;
	float:right;
	border: 0px;
	text-align: right;
	padding-right: 30px;
	background: url(images/tree_arrow_down.gif) no-repeat right center;
}

#accountSelectBox .myemail:hover{
	
}

#accountDropBox{
	display: none;
	position: relative;
	top: 22px;
	right: -115px;
	width: 180px;
	border: 1px solid #DDD;
	
	z-index: 1;
}

#accountDropBox div{
	width: 177px;
	height: 25px;
	line-height: 25px;
	background-color: #FFF;
	color: #000;
	border: 0px;
	font-size: 10pt;
	cursor: pointer;
	text-align: left;
	padding-left: 3px;
}

#accountDropBox div:hover{
	background-color: #DDD;
}

.nikelogoBlock{
	position: relative;
	top: -2px;
	left: -1px;
	/*background: url(images/nikesmalllogo.png) center center no-repeat;*/
	width: 15px;
	height: 15px;
}



.function_bar .courseFilter{
	float: left; 
	margin-right: 20px;
	margin-top: 2px;
	line-height: 25px; 
	font-size: 11pt; 
	cursor: pointer
}




.perButton{
	font-size: 10pt;
	font-weight: bold;
	text-align: center;
}

#pageNavi{
	margin-top: 5px;
	width: 400px;
	height: 27px;
	color: black;
}

#pageNavi .backButton{
	background: url(images/btn_back.png) no-repeat left center;
	float: left;
	width: 28px;
	height: 28px;
	margin-right: 10px;
	cursor: pointer;
}

#pageNavi .backButton:hover{
	background: url(images/btn_back_RO.png) no-repeat left center;
}

#pageNavi .linkNavi{
	line-height: 27px;
	
}

.perButton a{
	background: url(images/toolButton6.png) no-repeat left center;
	color: #FFF;
	text-decoration: none;
	padding: 10px 20px 10px 20px;
}

.perButton a:hover{
	background: url(images/toolButton7.png) no-repeat left center;
}



.buttonStyle{
	cursor: pointer;
	width: 65px;
	height: 25px;
	background-color:#BEDEFB;
	color: #000;
	text-align: center;
	font-weight: bold;
	border-radius: 10px;
	border: 0px;
}

.buttonStyle:hover{
	moz-box-shadow: 1px 1px 5px #333; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #333; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #333; /* Opera 10.5 + */
}

.buttonBlue{
	cursor: pointer;
	margin: 2px 10px 2px 0px;
	width: 68px;
	height: 28px;
	line-height: 28px;
	color: #000;
	text-align: center;
	font-weight: bold;
	background: url(images/btn_SN.gif) no-repeat left center;
	border: 0px;
}

.buttonBlue:hover{
	background: url(images/btn_SN_RO.gif) no-repeat left center;
}

.buttonOrange{
	cursor: pointer;
	margin: 2px 0px 2px 0px;
	width: 66px;
	height: 26px;
	line-height: 26px;
	color: #FFF;
	text-align: center;
	font-weight: bold;
	border: 1px solid #c5c9f9;
	background: url(images/orangeButton.png) no-repeat left center;
}

.buttonOrange:hover{
	border: 0px;
}

.buttonRed{
	cursor: pointer;
	margin: 2px 0px 2px 0px;
	width: 66px;
	height: 26px;
	line-height: 26px;
	color: #FFF;
	text-align: center;
	font-weight: bold;
	border: 1px solid #c5c9f9;
	background: url(images/redButton.png) no-repeat left center;
}

.buttonRed:hover{
	border: 0px;
}

.buttonBack{
	width:100px;
	height: 20px;
	text-align: center;
	padding-left: 5px;
	color: #FFF;
	font-weight: bold;
	background: url(images/back_button2.png) no-repeat left center;
	border: 0px;
	cursor: pointer;
	margin: 10px;
}

.buttonGood{
	cursor: pointer;
	width: 70px;
	height: 73px;
	background: url(images/goodScore.jpg) no-repeat left center;
}

.buttonMid{
	cursor: pointer;
	width: 70px;
	height: 73px;
	background: url(images/midScore.jpg) no-repeat left center;
}

.buttonBad{
	cursor: pointer;
	width: 70px;
	height: 73px;
	background: url(images/badScore.jpg) no-repeat left center;
}

.loginButton {
	cursor: pointer;
	padding: 3px 15px 3px 10px;
	color: #FFF;
	background: url(images/login_button.png) no-repeat left center;
	border: 0px;
}

.buttonViewAll{
	width: 150px;
	height: 36px;
	font-weight: bold;
	cursor: pointer;
	padding: 3px 15px 3px 10px;
	color: #FFF;
	background: url(images/buttonSkyBlue.png) no-repeat left center;
	border: 0px;
}

.buttonReply{
	width: 100px;
	height: 36px;
	font-weight: bold;
	cursor: pointer;
	padding: 3px 15px 3px 10px;
	color: #FFF;
	background: url(images/buttonArrow.png) no-repeat left center;
	border: 0px;
}

.buttonReply:hover{
	background: url(images/buttonArrow_hover.png) no-repeat left center;
}

.buttonArrowReply{
	float: right;
	width: 28px;
	height: 28px;
	cursor: pointer;
	color: #FFF;
	background: url(images/btn_reply.gif) no-repeat left center;
	border: 0px;
}

.buttonArrowReply:hover{
	background: url(images/btn_reply_RO.gif) no-repeat left center;

}

.deleteLongBtn{
	
}

.chooseBlock{
	float: left;
}

.mediaBlock{
	
	height: 30px;
	line-height: 30px;
}

.mediaBlock div{
	float: left;
	height: 30px;
	line-height: 30px;
}

.fileList {
	margin-left: 10px;
	display: none;
}

.fileList li{
	line-height: 30px;
}

.thumbnilBlock{
	display: none;
	background: url("images/preview_media_bak.jpg") left top no-repeat;
	float: right;
	width: 117px;
	height: 90px;
	margin-right: 100px;
	text-align: center;
	moz-box-shadow: 1px 1px 5px #333; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #333; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #333; /* Opera 10.5 + */
}

.thumbnilBlock div{
	width: 117px;
	height: 90px;
	text-align: center;
	display:table-cell;
	vertical-align:middle;
}

.thumbnilBlock img{
	max-width: 117px;
	max-height: 90px;
	border: 0px;

}

.mark_info{
	color: red;
	font-size: 10pt;
}

/*Pages' set CSS*/

.pageContent{
	width: 100%; 
	margin: 0 auto;
	min-height: 700px;
}


#pageContent_short{
	width:680px; 
	float: left;
	
}

#pageContent h1{

}

#pageContent .pageHeader{
	background-color: #e7ecff;
	border: 1px solid #bfcbff;
	border-bottom: 0px;
	width: 798px;
	height: 50px;
}

#pageContent_long .pageHeader{
	background-color: #e7ecff;
	border: 1px solid #bfcbff;
	border-bottom: 0px;
	width: 798px;
	height: 50px;
}

#pageContent_long h1{
	font-size: 20pt;
	font-weight: bold;
	padding: 10px 0px 0px 15px;
	
}


#sitemap{
	margin-top: 0px;
	margin-left: 40px;
	margin-bottom: 0px;
	height: 12px;
	*height: 20px;
}

.sitemap{
	margin-left: 40px;
	font-size: 10pt;
	font-weight: bold;
	width: 45%;
	color: #999;
}

.sitemap td{
	margin: 0 auto;
	height: 35px;
}

.sitemap a{
	font-size: 10pt;
	font-weight: bold;
	color: #777;
 
}

.now_room_label{
	margin-left: 20px;
	font-weight: bold;
}

.course_manage tr th{
	text-align: center;
}

.course_manage .time{
	width: 150px;
}

.course_manage .manage{
	width: 100px;
}

.course_manage .number{
	width: 65px;
}

.course_manage .course_notice{
	float: right;
	position: relative;
	top: -30px;
	left: 7px;
	margin-bottom: -30px;
	top: -10px\9;

}

.course_notice_total{
	float: right; 
	position: relative; 
	top: -36px; 
	left: 6px; 
	margin-bottom: -28px;
}

.attendWindow{
	width: 95%;
	min-height: 300px;
	margin-top: 10px;
	display: none;
}

.attendTable .attendTr{
	display: none;
}

.attendTable .name{
	width: 120px;
}

.attendTable .time{
	width: 120px;
}

.attendTable .editBlock{
	display: none;
}

.attendTable .editBlock .reasonText{
	float: left;
	margin: 8px 15px 0px 5px;
	line-height: 30px;
}

.attendTable .editBlock .replyText{
	float: left;
	line-height: 30px;
}


.attendTable .editBlock .replyText input{
	margin-top: 8px;
}

.alert_window{
	width: 90%; 
	height: 30px; 
	margin: 0 auto; 
	display: none; 
	margin-top: 10px; 
	margin-bottom: 10px;
}

table.tablesorter {
	font-family:arial;
	background-color: #FFFFFF;
	margin:0px 0px 0px 0px;
	font-size: 10pt;
	width: 662px;
	text-align: center;
	border: 1px solid #bfcbff; 
}

table.tablesorter thead tr th{
	background-color: #999999;
	color: #FFF;
	border-right: 1px solid #FFF;
	height: 38px;
	text-align: center;
	
}


 table.tablesorter tfoot tr th {
	background-color: #FFFFFF;
	font-size: 10pt;
	padding: 10px 15px 10px 5px;
}


table.tablesorter tbody tr:nth-child(even){
	background-color: #e7ecff;
}

table.tablesorter tbody td {
	color: #3D3D3D;
	padding: 1px;
	vertical-align: middle;
	min-height: 30px;
	text-align: left;
}
table.tablesorter tbody tr.odd td {
	/*background-color:#FFF;*/
}
table.tablesorter thead tr .headerSortUp {


}
table.tablesorter thead tr .headerSortDown {
	 

}
table.tablesorter thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp {
	
}

table.tablesorter .price {
	width: 75px;
}

table.tablesorter .expert {
	width: 75px;
}

table.tablesorter .manage {
	width: 150px;
}

table.tablesorter .course_time {
	width: 160px;
}

table.tablesorter .news_category {
	width: 80px;
}

table.tablesorter .news_time {
	width: 150px;
}

table.tablesorter_long {
	font-family:arial;
	background-color: #FFFFFF;
	margin:0px 0px 0px 0px;
	font-size: 10pt;
	width: 800px;
	text-align: center;
	border: 1px solid #DDD;
	color: #3D3D3D;
}

table.tablesorter_long thead tr th{
	background-color: #999999;
	color: #FFF;
	border-right: 1px solid #DDD;
	height: 38px;
	text-align: center;
	
}


 table.tablesorter_long tfoot tr th {
	background-color: #FFFFFF;
	font-size: 10pt;
	padding: 10px 15px 10px 5px;
}


table.tablesorter_long tbody tr:nth-child(even){
	background-color: #EEE;
}

table.tablesorter_long tbody td {
	
	padding: 1px 0px 1px 10px;
	vertical-align: middle;
	height: 30px;
	text-align: left;
}
table.tablesorter_long tbody tr.odd td {
	/*background-color:#FFF;*/
}
table.tablesorter_long thead tr .headerSortUp {


}
table.tablesorter_long thead tr .headerSortDown {
	 

}
table.tablesorter_long thead tr .headerSortDown, table.tablesorter_long thead tr .headerSortUp {
	
}

table.tablesorter_long .category {
	width: 85px;
}

table.tablesorter_long .expert {
	width: 90px;
}

table.tablesorter_long .people {
	width: 40px;
}

table.tablesorter_long .manage {
	width: 180px;
}

table.tablesorter_long .price {
	width: 75px;
}

table.tablesorter_long .course_time {
	width: 120px;
}


/* Footer */

.bottomColumn{
	float: left;
	width: 25%;
}

.bottomColumn h1{
	font-size: 14pt;
	font-weight: bold;
	
	
}

.bottomState{
	clear: both;
	margin: 0 auto;
	height: 50px;
	padding-top: 20px;
	font-weight: bold;
	text-align: center;
	width: 50%;
}

/*Menu Bar*/
#MenuBarVertical{
	width: 150px;
}


table.brownContent {
	margin-bottom: 50px;  
	white-space: no-wrap;
	margin-left: 10px;
	width: 600px; 
	border: 0px;	
	
}

table.brownContent  th {
	/*background: #CCC;*/
	font-size:10pt;
	font-style:bold;
	padding: 5px;
	border-bottom: 1px dotted #CCC;
	border-right: 1px dotted #CCC;
	text-align:center;
	width: 20%;
	
}

table.brownContent  td {
	border-bottom: 1px dotted #CCC;
	padding: 5px;
}

.square_dot{
	background: url(images/square_dot.png) repeat-x left center;
	width: 500px;
	height: 1.5px;
	margin: 5px 0px 15px 3px;
}

.square_bottom{
	background: url(images/square_bottom.png) no-repeat;
	width: 707px;
	height: 21px;
	margin: 25px 0px 10px 3px;
}

.markBold{
	font-size:11pt;
	font-weight: bold;
	
}

.markRed{
	margin-right: 5px;
	font-size:11pt;
	color: red;
}

.reminderLabel{
	display: none;
	color: red;
	
}


/*Table style*/

table.generalTable{
	width: 400px;
	border: 0px;
	color: black;
}

table.generalTable tr th{
	color: #808080;
	font-size: 11pt;
	padding: 5px;
	width: 150px;
	text-align: center;
}


table.generalTable .inputText{
	width: 150px;
	height: 15px;
	padding: 3px;
	border: 1px solid black;
}


table.table_course_list{
	width: 630px;
	border: 2px solid #72b0de;
}

table.table_course_list td{
	padding: 5px;
	border-bottom: 2px solid #72b0de;
}

table.table_course_content{
	border: 0;
}

table.table_course_content th{
	color: black; 
	font-size: 11pt;
	padding: 8px;
	width: 20%;
}

table.table_course_content td{
	color: black;
	border-bottom: 1px dotted #a4d3f9;
}

input.buttonPurple{
	cursor: pointer;
	border: 0;
	width: 80px;
	font-size: 10pt;
	font-weight: bold;
	color: #FFF;
	background: url(images/button1.png) left center no-repeat;
	padding: 10px;
	margin: 2px;
}

input.buttonPurple:hover{
	cursor: pointer;
	font-size: 12pt;
	background: url(images/button.png) left center no-repeat;
}

input.calendar_small{
	width: 37px;
	height: 37px;
	border: 0px;
	cursor: pointer;
	background: url(images/calendar_small.png) left center no-repeat;
}

input.calendar_small:hover{
	width: 42px;
	height: 37px;
	background: url(images/calendar_small_flip.png) left center no-repeat;
}

/*Table CSS*/

table.informationBlock{
	width: 700px;
	margin-bottom: 20px;
	border: 2px solid #72b0de;
	
}

table.informationBlock tr th{
	text-align: left;
	min-height: 30px;
	color: #0068b7;
	font-size: 13pt;
	background-color: #72b0de;
}
table.informationBlock td{
	padding: 5px;
	font-size: 11pt;
	
	
}

table.informationBlock .title{
	font-size: 13pt;
	font-weight: bold;
	margin: 5px;
	color: #72b0de;
	
}

table.informationBlock li{
	background: url(images/dotArrow.jpg) no-repeat left center;
	padding: 2px 15px 2px 15px;
	vertical-align: middle;
	list-style: none;
}

table.profileBlock{
	width: 600px;
	margin-bottom: 20px;
	border: 2px solid #72b0de;
}

table.profileBlock tr th{
	text-align: left;
	min-height: 30px;
	color: #0068b7;
	font-size: 13pt;
	background-color: #72b0de;
}
table.profileBlock td{
	padding: 5px;
	font-size: 11pt;

}

table.leftHomeBlock{
	width: 300px;
	margin-bottom: 20px;
	border: 2px solid #72b0de;
}

table.leftHomeBlock tr th{
	text-align: left;
	min-height: 30px;
	color: #0068b7;
	font-size: 13pt;
	background-color: #72b0de;
}
table.leftHomeBlock td{
	padding: 5px;
	font-size: 11pt;

}

table.MidHomeBlock{
	width: 400px;
	margin-bottom: 20px;
	border: 2px solid #72b0de;
}

table.MidHomeBlock tr th{
	text-align: left;
	min-height: 30px;
	color: #0068b7;
	font-size: 13pt;
	background-color: #72b0de;
}
table.MidHomeBlock td{
	padding: 5px;
	font-size: 11pt;

}

table.profileBlock .title{
	font-size: 13pt;
	font-weight: bold;
	margin: 5px;
	color: #72b0de;
	
}

table.profileBlock li{
	background: url(images/dotArrow.jpg) no-repeat left center;
	padding: 2px 15px 2px 15px;
	vertical-align: middle;
	list-style: none;
}


table.courseTableBlock{
	width: 95%;
	margin: 0 auto;
	margin-bottom: 30px;
	border: 0px;
}

table.course_block_long{
	width: 800px;
	margin-bottom: 20px;
	border: 0px;
}

table.courseTableBlock tr th{
	text-align: left;
	height: 40px;
	color: #000;
	padding-left: 10px;  
	font-size: 12pt;
	background-color: #e7ecff;
	border: 1px solid #bfcbff;
}

table.courseTableBlock  .title{
	padding: 5px;
	width: 120px;
	color: #000;
	font-size: 11pt;
	font-weight: bold;

}

table.courseTableBlock  .more_link{
	text-align: right;
}

table.courseTableBlock  .more_link a{
	color: #3fab56;
}

table.courseTableBlock  .more_link a:hover{
	color: red;
}

table.courseTableBlock td{
	padding: 5px;
	font-size: 11pt;
	
}

table.courseTableBlock .account{
	width: 75px;
	border-bottom: 1px solid #bfcbff;
}

table.courseTableBlock .course_time{
	width: 100px;
	border-bottom: 1px solid #bfcbff;
}

table.courseTableBlock .manage{
	width: 180px;
	border-bottom: 1px solid #bfcbff;
}

table.messageBlock{
	background-color: #333333;
	width: 600px;
	margin-bottom: 0px;
	border: 0px;
}

table.messageBlock tr th{
	text-align: left;
	min-height: 30px;
	color: #FFF;
	font-size: 12pt;
	background-color: #e7ecff;
}

table.messageBlock .message_title{
	color: #FFF;
}

table.messageBlock td{
	font-size: 12pt;
	padding: 5px;
	font-size: 11pt;
	color: #FFF;
}

table.messageBlock .main_message{
	width: 100%;
	padding: 10px 20px 0px 20px;
	color: #FFF;
}

table.messageBlock .message_line{
	background: url("images/message_line.gif") left center repeat-x;
	height: 30px;
	width: 560px;
	margin: 0 auto;
}

table.messageBlock .btnViewAll{
	width: 75px;
	height: 30px;
	cursor: pointer;
	color: #FFF;
	font-size: 12pt;
	border: 0px;
	background-color: #333333;
}

table.messageBlock .btnReply{
	background: url(images/btn_view_right.gif) left top no-repeat;
	width: 20px;
	height: 30px;
	cursor: pointer;
	border: 0px;
	margin-right: 10px;
}

table.messageBlock .main_message .picture{
	width: 45px;
	color: #FFF;
}

table.messageBlock .main_message .title{
	width: 99%;
	font-weight: normal;
	color: #FFF;
}

table.messageBlock .reply_message{
	width: 450px;
	margin-left: 40px;
}

table.messageBlock .reply_message .picture{
	width: 45px;
	color: #FFF;
}

table.messageBlock .reply_message .title{
	width: 99%;
	font-weight: normal;
	color: #FFF;
}

table.messageBlock .replyBlock{
	margin: 0 auto;
	width: 600px;
	height: 250px;
	padding: 10px 40px 0px 40px;
	background-color: #FFF;
}

table.messageBlock .replyBlock th{
	background-color: #FFF;
	border: 0px;
	height: 30px;
	color: #333;
	font-size: 18pt;
}

table.messageBlock .replyBlock td{
	color: #333;
	font-size: 12pt;
	padding: 5px;
}

table.messageBlock .replyBlock .warning{
	height: 30px;
	color: #C1272D;
	font-size: 12pt;
}

table.messageBlock .replyBlock .buttonList{
	height: 46px;
	text-align: center;
}



.innerMessage{
	background-color:#8FAFB2;
}

/*DIV Settings*/

.choose_search{
	float: left;
	width: 200px;
	height: 200px;
	margin: 10px;
}

.choose_search table{
	width: 200px;
	height: 200px;
}


.historyDiv{
	border: 2px solid #9DD8FF;
	padding: 30px;
}

.historyChoiceButton{
	margin-left: 5px;
	position:relative;
	color: #0022FF;
	font-weight: bold;
	top: 2px;
	left: 10px;
	width: 100px;
	height: 40px;
	cursor: pointer;
	border: 2px solid #9DD8FF;
	background-color: #9DD8FF;
}

.historyChoiceButton:hover{
	position:relative;
	top: 4px;
	font-size: 11pt;
	border-bottom: 2px solid #FFF;
	background-color: #FFF;

}

.historyChoiceButtonSetup{
	position:relative;
	top: 4px;
	font-size: 11pt;
	border-bottom: 2px solid #FFF;
	background-color: #FFF;

}

#personalHomeLeft{
	float: left;
	margin: 10px 0px 10px 0px; 
	width: 300px;
}

#personalHomeMid{
	float: right;
	margin: 10px 0px 10px 10px; 
	width: 400px;
}



.informationLabel{
	color: #11CFFF;
	font-size: 8pt;
}

.warnLabel{
	color: red;
	font-size: 11pt;
	font-weight: bold;
}

input.error{
	border: 1px red dashed;
}

span.error{
	color: red;
	font-weight: bold;
	font-size: 10pt;
	margin: 0px 2px 0px 5px; 
}

#backContent{
	z-index: 2; 
	display:none;
	position: absolute; 
	width: 100%; 
	height: 100%; 
	top: 0%; 
	left: 0%; 
	background-color: black;
	opacity:0.5;-moz-opacity:0.5;-khtml-opacity: 0.5; filter:alpha(opacity=50);
}

#frontContent{
	z-index: 3; 
	display:none;
	position: absolute; 
	width:50%; 
	height:70%; 
	top:20%; 
	left:25%; 
	background-color: #EEE;
	border: 1px solid #000;
}

#cross_close{
	position: relative; 
	top: 10px; 
	left: 95%; 
	width:20px; 
	height: 20px; 
	background-color: #CCC; 
	border: 1px solid #CCC; 
	text-align: center; 
	font-size:14pt; 
	cursor: pointer;
}

#cross_close:hover{
	border: 1px solid #888; 
}

.trans_title{
	cursor: pointer;
}

.trans_title:hover{
	text-decoration: underline;
}

#storePointsButton{
	background: url("images/storePointsButton.png") left top no-repeat;
	width: 120px;
	height: 53px;
}

#storePointsButton:hover{
	background: url("images/storePointsButton_hover.png") left top no-repeat;
}

.buttonGray{
	cursor: pointer;
	margin: 2px 10px 2px 0px;
	width: 240px;
	height: 30px;
	color: #1111;
	border: 0px;
	text-align: center;
	font-weight: bold;
	background: url(images/grayButton.png) no-repeat left top;
}

.buttonGray:hover{
	background: url(images/grayButton2.png) no-repeat left center;
}

.buttonBlueRound{
	cursor: pointer;
	margin: 2px 10px 2px 0px;
	width: 93px;
	height: 41px;
	color: #FFF;
	border: 0px;
	text-align: center;
	font-weight: bold;
	background: url(images/blue_round_btn.png) no-repeat left top;
}


.sorter_column{
	width: 662px;
	height: 38px;
}

.sorter_column .left{
	background: url(images/btn_left.gif) no-repeat left center;
	width: 10px;
	height: 38px;
}

.sorter_column .right{
	background: url(images/btn_right.gif) no-repeat right center;
	float: right;
	width: 10px;
	height: 38px;
}

.sorter_column div{
	background: url(images/sub_Separator.gif) no-repeat right center;
	width: 60px;
	line-height: 38px;
	cursor: pointer;
	float: left;
	color: #1A1A1A;
	font-size: 12pt;
}

.newsBlock{
	width: 620px;
	padding: 5px 20px 10px 20px;
	border: 1px solid #bfcbff;
}

.newsBlock .title{
	width: 570px;
	height: 60px;
	line-height: 60px; 
	font-size: 16pt;
	color: #333;
}

.newsBlock .time{
	width: 570px;
	height: 20px;
	font-size: 10pt;
	color: #333;
}

.newsBlock .content{
	width: 570px;
	font-size: 12pt;
	color: #333;
}

.floatRight{
	width: 670px;
	margin-top: 5px;
	text-align: right;
}

.singleClass{
	width: 300px;
	margin: 0px 10px 5px 10px;
	float: left;
	padding: 5px;
	border-bottom: 1px solid #AAA; 
}

.singleClass:hover{
	background-color: #F0F0F0; 
}

.singleClass .title{
	width: 265px;
	height: 20px;
	line-height: 20px;
	font-size: 11pt;
	font-weight: bold;
	float: left;
	margin-bottom: 0px;
	overflow: hidden;
	white-space: nowrap; 
	text-overflow: ellipsis;
}

.singleClass .course_time{
	font-size: 9pt;
	font-weight: bold;
	float: left;
	color: #AAA;
}



.singleClass .courseStatic{
	width: 100%;
	float: left;
	font-size: 8pt;
	font-weight: normal;
	margin-top: -5px;
	margin-bottom: 1px;
	color: #888;
}

.singleClass .maximum{
	font-size: 9pt;
	font-weight: bold;
	float: left;
	margin-left: 10px;
	margin-bottom: 1px;
	color: #AAA;
}

.singleClass .information{
	background: url(images/icons/glyphicons_195_circle_info.png) no-repeat left top;
	width: 26px;
	height: 26px;
	cursor: pointer;
	margin-top: 2px;
	float: right;
	opacity:0.4;
	filter:alpha(opacity=40);
}

.singleClass .information:hover{
	opacity:1;
	filter:alpha(opacity=100);
}

.singleClass .dialog_info{
	background: #FFF;
	width: 300px;
	height: 500px;
	position: relative;
	top: 20px;
	left: 10px;
	float: left;
	display:none;
}

.singleClass .dialog_video{
	float: left;
}

.singleClass .img_block{
	width: 300px;	
	height: 230px; 
	clear:both; 
	background-color: transparent; 
	text-align: center;
}


.singleClass .img_block div{
	width: 300px;	
	height: 230px;  
	text-align: center;
	display:table-cell;
	vertical-align:middle;
	
}

.singleClass .img_block img{
	max-width: 300px;	
	max-height: 230px;
	vertical-align: middle;
	text-align: center;
	cursor: pointer;
}
	
.singleClass .videoDisplay{
	width: 300px; 
	height: 230px;
}
	
	
.singleClass .dialog_video{
	float: left;
}

.function_person_edit{
	
	width: 100%;
	min-height: 30px;
	margin: 0 auto;
	margin-top: 5px;
	margin-left: 10px;
	text-align: center;
}

.function_person_edit&gt;div{
	position: relative;
	left: 0px;
	top: -4px;
	float: left;
	width: 12%;
	color: #FFF;
	background-color:#76a8f7;
	line-height: 20px;
	font-size: 12pt;
	margin: 0 auto;
	margin-right: 1px;
	padding: 5px 3px 8px 3px;
	cursor: pointer;
	border: 1px solid #76a8f7;
	
}

.function_person_edit .selected{
	color: black;
	background-color:#FFF;
	border-bottom: 1px solid #FFF;
}

.function_person_edit&gt;div:hover{
	moz-box-shadow: 1px 1px 2px #AAA; /* Firefox */
	-webkit-box-shadow: 1px 1px 2px #AAA; /* Safari 和 Chrome */
	box-shadow: 1px 1px 2px #AAA; /* Opera 10.5 + */
}

.function_main_page{
	margin-top: 10px;
}

.function_content{
	background-color:#FFF;
	min-height: 600px;
	border: 1px #CCC solid;
	margin-top: -18px;
	padding-top: 10px;
	border-top: 0px; 
	moz-box-shadow: 1px 1px 2px  #AAA; /* Firefox */
	-webkit-box-shadow: 1px 1px 2px #AAA; /* Safari 和 Chrome */
	box-shadow: 1px 1px 2px #AAA; /* Opera 10.5 + */
}

.register_input{
		width:150px; 
		height: 15px;
		padding: 5px;
		margin: 5px;
		
}

.register_select{
		width:150px; 
		height: 25px;
		margin: 5px;
		border: 1px solid black;
}

.register_label{
	text-align: left;
	width: 120px;
	color: #666;
	font-weight: bold;
}

.info_label{
	text-align: right;
	width: 100px;
	color: #666;
	font-weight: bold;
}

.normal_label{
	text-align: left;
	width: 40%;
	color: #666;
	font-weight: bold;
}

.addNewBtn{
	border: 1px solid #ff3823;
	width: 15px;
	height: 15px;
	line-height: 15px;
	font-size: 15pt;
	moz-box-shadow: 1px 1px 5px #999; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #999; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #999; /* Opera 10.5 + */
	border-radius: 3px;
	cursor: pointer;
}

.small_calendar{
	background: url(images/smallcalendar.png) left top;
	width: 29px;
	height: 27px;
	border: 0px;
	moz-box-shadow: 1px 1px 5px #999; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #999; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #999; /* Opera 10.5 + */
	border-radius: 2px;
	cursor: pointer;
}

.dialog_red_btn{

	background-color: #DDD;
	width: 66px;
	height: 26px;
	cursor: pointer;
	color: black;
	font-size: 10pt;
	font-weight: bold;
	text-align: center;
	line-height: 25px;
	border: 1px solid #CCC;
	
	
}



.dialog_red_btn:hover{
	moz-box-shadow: 1px 1px 5px #333; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #333; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #333; /* Opera 10.5 + */
}

.dialog_green_btn{
	background-color: #DDD;
	color: black;
	width: 66px;
	height: 26px;
	cursor: pointer;
	font-size: 10pt;
	font-weight: bold;
	text-align: center;
	line-height: 25px;
	border: 1px solid #CCC;
	
	
}

.dialog_green_btn:hover{
	moz-box-shadow: 1px 1px 5px #333; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #333; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #333; /* Opera 10.5 + */
}

#confirm_window{
	display: none;
	margin: 0 auto;
	width: 400px;
	min-height: 220px;
	cursor: default;
}

#confirm_window .confirm_title{
	margin: 0 auto;
	width: 100%;
	height: 30px;
	line-height: 30px;
	text-align: center;
	/*background-color:#76a8f7;*/
	border-bottom: 1px solid #CCC;
	color: #333;
	font-size: 12pt;
	font-weight: bold;
}

#confirm_window .confirm_content{
	margin: 0 auto;
	width: 95%;
	min-height: 80px;
	padding: 15px 5px 5px 5px;
	text-align: left;
	color: black;
	font-size: 12pt;
}

#confirm_window .lebelTitle{
	font-weight: bold;
	display: inline;
}

.buttonBlock{
	margin: 0 auto;
}

#popupWindow_1{
	width: 350px;
	/*border: 2px solid #76a8f7;*/
	background-color: #FFF;
	moz-box-shadow: 1px 1px 5px #333; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #333; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #333; /* Opera 10.5 + */
}

#popupWindow_1 .dialog_title{
	margin: 0 auto;
	width: 346px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	background-color:#76a8f7;
	color: #FFF;
	font-size: 14pt;
	font-weight: bold;
}
	
#popupWindow_1 .dialog_content{
	width: 330px;
	height: 78%;
	padding: 10px 5px 10px 5px;
	overflow-x: hidden;
	overflow-y: auto;
}

#popupWindow_1 .courseInfo{
	font-size: 11pt;
}

#popupWindow_1 .AboutDiv{
	float: right;
	color: #999;
	margin-right: 10px;
	cursor:pointer; 
}

#popupWindow_1 .courseInfo .lebelTitle{
	font-weight: bold;
	display: inline;
}

.courseInfo .teacherLink{
	color: blue;
	text-decoration: underline;
	cursor: pointer;
}

.courseInfo .teacherLink:hover{
	font-size: 14pt;
	color: red;
}

#popupWindow_1 .courseInfo .date_all{
	display: none;
	margin-left: 47px;
}

#popupWindow_1 .description{
	margin-top: 5px;
	margin-left: 5px;
}

#popupWindow_1 .courseInfo .otherTime{
	display: inline;
	text-decoration: underline;
	cursor: pointer;
	margin-left: 5px;
}

#popupWindow_1 h1{
	font-size: 12pt;
	color: black;
}

#popupWindow_1 h2{
	font-size: 11pt;
	color: black;
}

#popupWindow_1 p{
	font-size: 12pt;
	color: black;
	text-align: left;
	margin: 0px;
}

#prograss_window{
	display: none;
	width: 400px;
	height: 60px;
}


#popupWindow_2{
	width: 350px;
	/*border: 2px solid #76a8f7;*/
	background-color: #FFF;
}


#popupWindow_2 .dialog_title{
	margin: 0 auto;
	width: 346px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	/*background-color:#CCC;*/
	border-bottom: 1px solid #CCC;
	color: #333;
	font-size: 12pt;
	font-weight: bold;
}
	
#popupWindow_2 .dialog_content{
	width: 330px;
	height: 65%;
	padding: 10px 3px 10px 3px;
	overflow-x: hidden;
	overflow-y: auto;
}

#popupWindow_2 .courseInfo{
	font-size: 11pt;
	padding: 5px;
}

#popupWindow_2 .courseInfo .lebelTitle{
	overflow: hidden;
	width: 330px;
	white-space: nowrap; 
	text-overflow: ellipsis;
	font-weight: bold;
	/*display: inline;*/
}

#popupWindow_2 .courseInfo .date_all{
	display: none;
	margin-left: 47px;
}

#popupWindow_2 .description{
	margin-top: 5px;
	margin-left: 5px;
}

#popupWindow_2 .courseInfo .otherTime{
	display: inline;
	text-decoration: underline;
	cursor: pointer;
	margin-left: 5px;
}

#popupWindow_2 h1{
	font-size: 12pt;
	color: black;
}

#popupWindow_2 h2{
	font-size: 11pt;
	color: black;
}

#popupWindow_2 p{
	font-size: 12pt;
	color: black;
	text-align: left;
	margin: 0px;
}

.noticeDiv{
	font-size: 12pt;
	font-weight: bold;
	margin-left: 15px;
}

#myCalendar{
	width: 95%;
	min-height: 750px;
	margin: 0 auto;
	margin-bottom: 20px;
	
}


#myCalendar .title_time{
	float: left;
	height: 30px;
	margin: 20px 0px 0px 20px;
}

#myCalendar .function_bar{
	float:left; 
	margin: 20px 0px 0px 20px;
}

#myCalendar .time_label{
	float: left;
	font-size: 16pt;
	font-weight: bold;
}

#myCalendar .today{
	background-color: #D6EFBA; 
}

.dialog_progress{
	margin: 0 auto;
	display: none;
	width: 300px;
}

.calendar_block{
	position: relative;
	width: 777px;
	float: left;
	border-top: 1px solid #CCC;
	border-left: 1px solid #CCC;
	margin-left: 20px;

}

.calendar_block .calendar_title&gt;div{
	background-color: #CCC;
	float: left;
	height: 20px;
	font-size: 12pt;
	font-weight: bold;
	text-align: center;
	line-height: 20px;
	width: 100px;
	border-right: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	padding: 5px;
}

.calendar_block .date_block{
	float: left;
	width: 100px;
	height: 100px;
	padding: 5px;
	font-size: 10pt;
	border-right: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	background-color: #FFF;
	overflow:hidden;

}

.calendar_block .courseInfoBlock{
	position: absolute;
	left: 0px;
	top: 0px;
	font-size: 12pt;
	font-weight: bold;
	padding: 5px;
	width: 211px;
	height: 211px;
	background-color: #FFF;
	display:none;
	border: 1px solid #CCC;
	moz-box-shadow: 1px 1px 2px #AAA; /* Firefox */
	-webkit-box-shadow: 1px 1px 2px #AAA; /* Safari 和 Chrome */
	box-shadow: 1px 1px 2px #AAA; /* Opera 10.5 + */
}

.calendar_block .weekend{
	background-color: #EEE;
}

.calendar_block .course_line{
	float:left;
	display: block;
	height: 20px;
	line-height: 20px;
	font-size: 9pt;
	font-weight: normal;
	overflow: hidden;
	width: 80px;
	white-space: nowrap; 
	text-overflow: ellipsis;
}

.calendar_block .course_info{
	float: left;
	height: 20px;
	line-height: 20px;
	font-size: 9pt;
	font-weight: normal;
	overflow: hidden;
	width: 150px;
	white-space: nowrap; 
	text-overflow: ellipsis;
}



.greenBlock{
	float: left;
	margin-top: 4px;
	margin-right: 4px;
	width: 12px;
	height: 12px;
	background-color: #96E100;
}

.orangeBlock{
	float: left;
	margin-top: 4px;
	margin-right: 4px;
	width: 12px;
	height: 12px;
	background-color: #FFBF28;
}

.detail_btn{
	float: right;
	width: 40px;
	height: 18px;
	line-height: 18px;
	font-size: 10pt;
	font-weight: bold;
	text-align: center;
	background-color: #FFFF78;
	cursor: pointer;

}

.previous_btn{
	float: left;
	margin-right: 10px;
	background: url(images/previous_1.gif) left top;
	width: 22px;
	height: 22px;
	cursor: pointer;
}

.next_btn{
	float: left;
	margin-left: 10px;
	background: url(images/next_1.gif) left top;
	width: 22px;
	height: 22px;
	cursor: pointer;
}

.dialog_close_btn{
	float: right;
	position: relative;
	left: 0px;
	top: 5px;
	margin-right: 10px;
	/*background: url(images/btn_delete_circle.png) left top;*/
	width: 20px;
	height: 20px;
	line-height: 20px;
	cursor: pointer;
}

.dialog_close_btn i{
	margin-top: 3px;
}

.DivtoCenter{
	width: 100%;
	margin: 0 auto;
	text-align: center;
}

.new_logo{
	float: right;
	display: block;
	width: 20px;
	height: 20px;
	background: url(images/new_logo.png) center center no-repeat;
}

.notpublish_logo{
	float: left;
	display: block;
	width: 20px;
	height: 20px;
	background: url(images/notpublish_logo.png) center center no-repeat;
}

.teacherInfo .courseInfo{
	font-weight: bold;
	height: 30px;
	line-height: 30px;	
	margin-left: 10px;
	margin-right: 20px;
	float: left;
	margin-bottom: 10px;
}

.teacherInfo .information{
	background: url(images/icons/glyphicons_195_circle_info.png) no-repeat left top;
	width: 26px;
	height: 26px;
	cursor: pointer;
	margin-top: 6px;
	float: left;
	opacity:0.4;
	filter:alpha(opacity=40);
}

.courseInfoTable .img_block{
	width: 100%;	 
	line-height: 430px;
	clear:both; 
	text-align: center;
	margin: 0 auto;

}

.courseInfoTable .img_block img{
	max-width: 500px;	
	max-height: 430px;
	vertical-align: middle;
}
	
.courseInfoTable .videoDisplay{
	width: 500px; 
	height: 430px;
	text-align: center;
}

.courseInfoBorder{
	width: 100%;
	margin: 0 auto;
	min-height: 750px;
	background-color: #FFF;
	border: 0px solid #76a8f7;
	padding-bottom: 20px;
	moz-box-shadow: 1px 1px 2px 2px #DDD; /* Firefox */
	-webkit-box-shadow: 1px 1px 2px 2px #DDD; /* Safari 和 Chrome */
	box-shadow: 1px 1px 2px 2px #DDD; /* Opera 10.5 + */
}

.courseInfoBorder .teacherLink{
	color: blue;
	text-decoration: underline;
	cursor: pointer;
}

.courseInfoBorder .teacherLink:hover{
	font-size: 14pt;
	color: red;
}

.singleClass .function_icon{
	position: relative;
	left: 200px;
	top: 10px;
	float: left;
	width: 100px;
	height: 25px;
	margin: 0px 0px -63px 0px;
}

.singleClass .function_icon .normal_img{
	float: right;
	margin-left: 2px;
	width: 23px;
	height: 23px;
}

.singleClass .function_icon .private{
	float: right;
	margin-left: 2px;
	width: 23px;
	height: 23px;
}

.singleClass .function_icon .expired{
	float: right;
	margin-left: 2px;
	margin-top: 2px;
	width: 60px;
	opacity:0.5;-moz-opacity:0.5;-khtml-opacity: 0.5; filter:alpha(opacity=50);
}

.courseInfoTable .function_icon{

}

.courseInfoTable .function_icon{
	position: relative;
	top: 0px;
	right: 130px;
	float: right;
	width: 160px;
	height: 25px;
	margin: 0px 0px 0px -130px;
}

.courseInfoTable .function_icon .normal_img{
	float: right;
	margin-left: 3px;
	width: 25px;
	height: 25px;
}

.courseInfoTable .function_icon .private{
	float: right;
	margin-left: 3px;
	width: 25px;
	height: 25px;
}

.courseInfoTable .function_icon .expired{
	float: right;
	margin-left: 2px;
	margin-top: 2px;
	width: 60px;
	opacity:0.5;-moz-opacity:0.5;-khtml-opacity: 0.5; filter:alpha(opacity=50);
}

/*
.singleClass .process_icon{
	background: url(images/process_icon.png) center center no-repeat;
	width: 50px;
	height: 30px;
	margin-top: 5px;
	margin-bottom: -5px;
	margin-left: 72%;
}

.singleClass .free_icon{
	background: url(images/free_icon.png) center center no-repeat;
	width: 50px;
	height: 30px;
	margin-top: 5px;
	margin-bottom: -5px;
	margin-left: 72%;
}
*/
.courseInfoTable .full_icon{
	background: url(images/full_icon.png) center center no-repeat;
	width: 50px;
	height: 30px;
	float: right;
	margin-right: 3%;
	margin-left: -13%;
}

.courseInfoTable .process_icon{
	background: url(images/process_icon.png) center center no-repeat;
	width: 50px;
	height: 30px;
	margin-right: 20%;
	margin-left: -30%;
	float: right;
}

.courseInfoTable .free_icon{
	background: url(images/free_icon.png) center center no-repeat;
	width: 50px;
	height: 30px;
	margin-right: 15%;
	margin-left: -18%;
	float: right;
}

.rankNum{
	color: #888;
	font-size: 10pt;
}

.refundForm{
	display: none;
}

.refundIcon{

}

.message_red{
	font-size: 10pt;
	font-style: italic;
	color: red;
}

.not_publish_mark{
	float: left;
	position: relative;
	margin-bottom: -223px;
	width: 200px;
	height: 222px;
	background: url(images/notPublishMark.png) left top no-repeat;
	opacity:0.7;-moz-opacity:0.7;-khtml-opacity: 0.7; filter:alpha(opacity=70);
}

.cross_out{
	text-decoration: line-through;
	color: red;
}

.teachingBlock{
	width: 96%;
	margin: 0 auto;
	min-height: 290px;
	padding: 10px 10px 50px 10px;
}

.teachingBlock .contentBlock{
	border: 1px solid #CCC;
	background-color: #FFF;
	min-height: 450px;
	width: 660px;
	padding: 10px;
	border-radius: 5px;

}

.teachingBlock .tabBlock{
	position: relative;
	top: 30px;
	left: -22px;
	margin-bottom: -200px;
	width: 80px;

}

#process_window{
	display: none; 
	width: 400px; 
	height: 140px; 
	padding-top: 10%; 
	text-align: center;
}

#process_window .progress-striped{
	width: 80%; 
	margin: 0 auto;
	
}

.TableList {
    padding:1em;
}
.TableList table{
    border-collapse:collapse;
    font-size:12pt;
    width:100%;
}


/*欄位間距*/
.TableList th, 
.TableList td{
    padding:.5em;
}


/*標題列*/
.TableList th{
	width: 150px;
    border:1px solid #fff;
    white-space:nowrap;
    background:#328aa4 url(tr_bg1.gif) repeat-x;
    color:#fff;
}
.TableList th a{color:#fff;}


/*單列底線樣式*/
.TableList tr{
    border-bottom:1px solid #fff;
    _behavior: url(ie_hover.htc);/*IE6 hover*/
}
/*奇數列底色樣式*/
.TableList tr.Odd {background:#FFF;}
/*偶數列底色樣式*/
.TableList tr.Even {background:#eee;}


/*hover 樣式*/
.TableList tr.hover td,
.TableList tr:hover td{
    background:#e5f1f4;
}


/*=( 欄位設定 )=*/
/*圖片*/
.TableList th.Image,
.TableList td.Image{
    width:50px;
}
.TableList td.Image img{
    width:30px;
    height:30px;
}

/*標題*/
.TableList td.Title{
    text-align:left;
    font-size:14px;
}

/*日期*/
.TableList td.Date{
    width:3%;
    white-space:nowrap;
}

.top_button_set{
	position: relative;
	top: 210px;
	right: -650px;
	margin-top: -200px;
	/*position: fixed;
	top: 80px;
	right: 18px;*/
	float: right;
	background-color: #EEE;
	border-radius: 5px;
	border: 1px #CCC solid;
}

.top_button_set .btn{
	
}

.checkTable{
	width: 85%;
	border: 2px solid #000;
	display: none;
	margin: 0 auto;
}

.checkTable tr th{
	width: 150px;
	background-color:#CCC;
	border: 1px solid #000;
	height: 30px;
	padding: 0px 5px 0px 5px;
}

.checkTable tr td{
	border: 1px solid #000;
	height: 30px;
	padding: 0px 5px 0px 5px;
}

.checkTable .title{
	background-color:#888;
	color: white;
	font-weight: bold;
}

.seperate_line{
	margin: 50px 0px 50px 0px;
}

.circleWhite{
	width: 100px;
	height: 100px;
	text-align: center;
	vertical-align: middle;
	display: table-cell;
	background: url(images/circle_white.png) left center;
	cursor: pointer;
	font-weight: bold;
}

.circleGreen{
	width: 100px;
	height: 100px;
	text-align: center;
	vertical-align: middle;
	display: table-cell;
	background: url(images/circle_green.png) left center;
	cursor: pointer;
	font-weight: bold;
}

.circleYellow{
	width: 100px;
	height: 100px;
	text-align: center;
	vertical-align: middle;
	display: table-cell;
	background: url(images/circle_yellow.png) left center;
	cursor: pointer;
	font-weight: bold;
}

.zeroArrow{
	width: 100px;
	height: 18px;
	background: url(images/zeroarrow.png) left center;
}

.plus30Arrow{
	position: relative;
	width: 100px;
	height: 59px;
	background: url(images/plus30arrow.png) left center;
}

.minus30Arrow{
	position: relative;
	width: 100px;
	height: 36px;
	background: url(images/minus30arrow.png) left center;
}

.learning_table td{
	padding: 5px;
}

.introBlock {
	width: 400px;
	height: 40px;
	font-size: 12pt;
	padding: 10px 20px 10px 20px;
	border: 1px solid #CCC;
	margin-bottom: 20px;
	moz-box-shadow: 1px 1px 5px #CCC; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #CCC; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #CCC; /* Opera 10.5 + */
	border-radius: 10px;
}

.introBlock img{
	width: 40px;
	height: 40px;
	margin-left: 15px;
}

.course_info_table{
	width: 100%;
	font-size: 12pt;
}

.course_info_table tr th{
	padding: 10px;
	width: 120px;
	font-weight: bold;
}

.course_info_table tr td{
	padding: 5px 10px 5px 10px;
}

.courseTitle{
	width:900px; 
	height: 200px; 
	padding: 20px 40px 20px 40px;
	border: 1px solid #CCC;
	margin-bottom: 20px;
	moz-box-shadow: 1px 1px 5px #CCC; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #CCC; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #CCC; /* Opera 10.5 + */
	border-radius: 10px;
}

.courseTitle h2{
	width: 450px;
	height: 110px;
	padding-left: 160px;
	display:table-cell; 
	vertical-align:middle;
}

.grayline{
	width:60%;
	margin: 10px 0px 20px 0px;
	border-bottom: 1px solid #CCC;
}

.imgSideBlock{
	float: right;
	width: 300px;
	text-align: center;
}

.tab_content{
	position: relative;
	top: -18px;
	width: 100%;
	min-height: 700px;
	border: 1px solid #CCC;
	border-top: 0px;
	background-color: #FFF;
	z-index: 1;
}

.btnClose{
	position: relative;
	width: 36px;
	height: 24px;
	top: 4px;
	left: 10%;
	margin-bottom: -20px; 
}

.selectSectionBar{
	width: 200px;
	margin: 5px;
	min-height: 300px;
	float: left;
}

.videoContent{
	min-height: 600px;
	border: 1px solid #AAA;
	
	border-radius: 3px;
}

.selectVideo{
	width: 100%;
	min-height: 30px;
	background-color: #EEE; 
}

.iconBlock{
	width:30px;
	height: 30px;
	display: inline-block;
	cursor: pointer;
	text-align: center;
	background-color: #EEE; 
}

.selectVideo .isRead{
	background-color: #CCC;
}

.iconBlock i{
	margin-top: 8px;
}

.default_icon{
	background-color: #FFF;
}

.iconBlock:hover{
	background-color: #FFF;
}

.videoTitle{
	clear: both;
	padding: 10px;
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	text-align: center;
}

.videoInnerContent{
	min-height: 550px; 
	padding: 20px;
	
}
.videoInnerContent iframe{
	width: 100%;
	max-width: 720px;
}

.videoInnerContent .videoInfo{
	width:250px;
	float: right;
	height: 24px;
	padding: 0px 0px 0px 0px;
	text-align: right;
	margin-bottom: 10px;
}


.videoInnerContent .videoInfo .text{
	display: inline-block;
	text-align: center;
	width: 50px;
	position: relative;
	top: 3px;
}

.discussBlock{
	margin: 20px 40px 20px 20px;
	padding: 30px 30px 30px 30px;
	background-color: #F5F5F5;
	clear: both;
}

.discussBlock .postDialog{
	background-color: #555;
	margin: 0px 0px 20px 0px;
	border-radius: 5px;
	padding: 40px;
	display: none;
}

.discussBlock .singleBlock{
	margin-top: 5px;
	padding: 15px 10px 15px 30px;
	border: 1px solid #CCC;
	background-color: #FFF;
}

.discussBlock .singleBlock .plus{
	float: right;
	margin: 0px 10px 0px 0px;
}

.discussBlock .singleBlock .title{
	font-size: 13pt;
	font-weight: bold;
	margin: 5px 0px 5px 0px;
}

.discussBlock .singleBlock .detail{
	margin: 10px 0px 5px 0px;
}

.discussBlock .singleBlock .content{
	margin: 20px 0px 10px 0px;
}

.discussBlock .singleBlock .comment{
	margin: 20px 0px 10px 0px;
	
}

.discussBlock .singleBlock .comment &gt; div{
	margin: 20px 20px 10px 20px;
	padding: 20px;
	border: 1px solid #CCC;
	moz-box-shadow: 1px 1px 5px #CCC; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #CCC; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #CCC; /* Opera 10.5 + */
}

.discussBlock .singleBlock .leaveComment{
	margin: 20px 0px 10px 0px;
}

.recommendBtn{
	width: 65px;
	font-size: 8pt;
	padding-left: 2px;
	padding-right: 2px;
}

.myinputmargin{
	margin-top: 7px;
}

.btn_container{
	width: 130px; 
	margin: 0 auto; 
	padding-top: 10px; 
	padding-bottom: 10px;
}


.divide_one{
	width: 95%; 
	margin: 0 auto;
	margin-right: 15px;	
	background-color: #FFF;
}

.divide_two{
	float: left; 
	width: 45%; 
	margin: 0 auto;
	margin-right: 15px;	
	background-color: #FFF;
}

.courseInnerTitle{
	width: 100%;
	height: 80px;
	background-color: #EEE;
	display: none;
	moz-box-shadow: 1px 1px 5px #CCC; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #CCC; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #CCC; /* Opera 10.5 + */
}

.courseInnerTitle .content{
	margin: 0 auto;
	margin-left: 10px;
}

.courseInnerTitle .imageBlock{
	float: left; 
	margin-right: 20px;
	width: 100px;
	height: 70px;
}

.courseInnerTitle .courseImage{
	width: 100px;
	height: 70px;
	border: 0px;
	margin: 5px;
}

.courseInnerTitle .titleBlock{
	float: left; 
	margin: 5px 5px 5px 5px;
}

.courseInnerTitle .titleBlock .university{
	padding: 3px;
	font-size: 14pt;
}

.courseInnerTitle .titleBlock .title{
	padding: 3px;
	font-size: 20pt;
}

.courseMainBlock{
	width: 100%;

}

.courseMainBlock .content{
	
}

.courseMainBlock  h1{
	font-size: 16pt;
	margin-bottom: 10px;
}

.courseControlPanel{
	float: left;
	margin: 0 auto;
	margin-top: 3px;
	width: 100%;
	height: 30px;
	padding: 10px 0px 10px 0px;
	background-color: #FAFAFA;
	border-bottom: 1px solid #AAA;
}

.courseControlPanel ul{
	margin-left: 10px;
}

.courseControlPanel ul li{
	font-size: 12pt;
	position: relative;
	top: 3px;
	padding: 8px 10px 8px 10px;
	float: left;
	list-style-type: none;
	cursor: pointer;
}

.courseControlPanel ul li:hover{
	background-color: #EEE;
}


.courseControlPanel .active{
	background-color: #FFF;
	border: 1px solid #AAA;
	border-bottom: 1px solid #FFF;
	border-radius: 5px 5px 0px 0px;
}

.courseControlPanel .active:hover{
	background-color: #FFF;
}

.courseControlPanel ul li i{
	padding-right: 5px;
	margin-top: 3px;
}

.courseContentBlock{
	padding: 70px 10px 10px 10px;
	min-height: 700px;
	background-color: #FFF;
}
.courseContentBlock table{
	width: auto !important;
}

#coursePrepareDiv{
	background:url(images/eplus_course_annouce_prepare.png) no-repeat;
	margin: 0 auto;
	width: 340px;
	height: 400px;
}

.paragraphLine{
	padding: 20px; 
	border-top: 1px solid #CCC;
}

.paragraphLine h3{
	margin-bottom: 10px;
}

.paragraphLine .date{
	font-size: 9pt;
	float: right;
}

.courseBlock{
	float: left;
	width: 265px; 
	height: 220px;
	margin: 10px 20px 10px 10px;
	border: 1px solid #CCC;
	background-color: #F3F3F3;
	cursor: pointer;
	moz-box-shadow: 1px 1px 5px #CCC; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #CCC; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #CCC; /* Opera 10.5 + */
}

.courseBlock .description{
	padding: 10px 10px 10px 10px;
}

.courseBlock .description .title{
	font-size: 12pt;
	font-weight: bold;
}

.courseBlock .description div{
	width: 100%;
	overflow: hidden;
	white-space: nowrap; 
	text-overflow: ellipsis;
}


.courseBlock:hover{
	moz-box-shadow: 1px 1px 5px #78D2FF; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #78D2FF; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #78D2FF; /* Opera 10.5 + */
}
	
.courseBlock img{
	float: left;
	min-width: 265px; 
	max-height: 150px;
	margin-bottom: 10px;
}


#gallery, #gallery1 {
	width: 900px;
	margin: 0 auto;
}
	
.gallery_box, .gallery_box1 {
	display: block;
	width: 900px;
	height: 150px;
	padding: 0;
	margin: 0;
	border: 1px solid #CCC;
	margin: 0 30px 30px 0;
	cursor: pointer;
	moz-box-shadow: 1px 1px 5px #CCC; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #CCC; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #CCC; /* Opera 10.5 + */
}

.gallery_box:hover, .gallery_box1:hover{
	moz-box-shadow: 1px 1px 5px #78D2FF; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #78D2FF; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #78D2FF; /* Opera 10.5 + */
}

.gallery_box .gb_left, .gallery_box1 .gb_left {
	float: left;
	width: 240px;
	height: 150px;
	overflow: hidden;
}

.gallery_box .gb_left, .gallery_box1 .gb_left img {
	
}

.gallery_box .gb_mid, .gallery_box1 .gb_mid {
	float: left;
	width: 310px;
	padding: 8px 20px 8px 0px;
}

.gallery_box .gb_mid #courseName, .gallery_box1 .gb_mid #courseName{
	overflow: hidden;
	white-space: nowrap; 
	text-overflow: ellipsis;
}

.gallery_box .gb_right, .gallery_box1 .gb_right {
	float: right;
	width: 300px;
	height: 150px;
	border-left: 1px solid #CCC;
}

.teacher_desc{
	float: left;
	width: 220px;
	padding: 15px;
	height: 115px;
	overflow: hidden;
}

.teacher_img{
	float: right;
	width: 100px;
	height: 150px;
	overflow: hidden;
}

.teacher_img img{
	width: auto;
	height: auto;
	max-width: auto;
	max-height: auto;
}

.forumBlock{
	background-color: #FFF;
}

.forumBlockWrapper{
	background: url(images/discusshint.png) no-repeat center center;
	padding: 50px;
	border: 1px solid #AAA;
	font-size: 12pt;
	line-height: 25px;
	border-radius: 3px;
}

.forumBlockWrapper  .author{
	color: #00AAFF;
	font-weight: bold;
}

.forumBlockWrapper  .timestamp{
	font-style: italic;
}

.forumBlockWrapper .content{
	margin-top: 30px;
	width: 90%;
}

.forumBlockWrapper .editBlock{
	float: right;
	margin-right: 5px;
}

.forumBlockWrapper .likeBlock{
	float: right;
}

.forumBlockWrapper .commentBlock{
	width: 80%;
	border: 1px solid #CCC;
	margin-top: 30px;
	padding: 30px;
	border-radius: 3px;
}

.forumBlockWrapper .replyBlock{
	width: 100%;
	margin-top: 30px;
}

.forumBlockWrapper .replyBlock .singleReply{
	border-top: 1px solid #EFEFEF;
	padding: 0px 0px 20px 40px;
	
}

.forumControl{
	border: 1px solid #AAA;
	min-height: 600px;
	border-radius: 3px;
}

.searchRow{
	background-color: #EEE;
	padding: 10px 0px 0px 0px;
	border-bottom: 1px solid #AAA;
}

.sortRow{
	background-color: #AAA;
	padding: 10px 0px 10px 10px;
	color: black;
	
}

.sortRow&gt;span{
	margin: 0px 5px 0px 5px;
	cursor: pointer;
}

.sortRow&gt;span:hover{
	background-color: #333;
}

.forumList{
	overflow: hidden;
	/*height: 580px;*/
}

.forumList .active{
	background-color: #EFEFEF;
}

.singleSubject{
	padding: 10px;
	cursor: pointer;
	border-bottom: 1px solid #EEE;
}

.singleSubject:hover{
	background-color: #EFEFEF;
	
}



.singleSubject .title{
	width: 80%;
	text-align: left;
	overflow: hidden;
	white-space: nowrap; 
	text-overflow: ellipsis;
}


.singleSubject .status{
	float: right;
	margin-top: -20px;
	width: 65px;
}

.readMore{
	background-color: #EFEFEF;
	text-align: center;
	padding: 10px;
	cursor: pointer;
	border-top: 1px solid #AAA;
}

.readMore:hover{
	background-color: #AAA;
	color: white;
}

.addReply{
	padding: 20px;
	margin-top: 20px;
	background-color: #EFEFEF; 
}

.addReply textarea{
	width: 80%;
	height: 40px;
}

.dialogIcon{
	float: left;
	width:23px;
	height: 22px;
	color: white;
	text-align: center;
	background:url(images/bubble_dialog.png) left top;
	margin: 0px 3px 0px 3px;
}

.likeIcon{
	float: left;
	width:28px;
	height: 17px;
	background-color: black;
	color: white;
	text-align: center;
	margin: 0px 3px 0px 3px;
}

.videoControl{
	border: 1px solid #AAA;
	border-radius: 3px;
}

.chapterGroup .heading{
	background: url(images/tree_arrow_right.gif) left center no-repeat;
	background-color: #EFEFEF;
	color: black;
	padding: 10px 10px 10px 30px;
	cursor: pointer;
	border-bottom: 1px solid #CCC;
}

.chapterGroup .heading:hover{
	background-color: #FFF;
}

.chapterGroup  .active{
	background: url(images/tree_arrow_down.gif) left center no-repeat;
	background-color: #FFF;
	border-bottom: 0px;
}

.chapterGroup .chapterContent{
	padding: 10px 10px 10px 35px;
	background-color: #FFF;
	border-bottom: 1px solid #CCC;
}

.chapterGroup .chapterContent .textBlock{
	margin: 5px 0px 5px 0px;
	width: 100%;
	overflow: hidden;
	white-space: nowrap; 
	text-overflow: ellipsis;
}

.schedule .textBlock{
	font-size: 12pt;
	line-height: 35px;
	width: 100%;
	overflow: hidden;
	white-space: nowrap; 
	text-overflow: ellipsis;
}


.accordion .mygroup{
	border: 1px solid #AAA;
	border-radius: 3px;
}


.accordion-heading a:hover {
	background-color: #EEE;
	
	color: black;
}

.forumBlock .addComment{
	width: 80%;
	margin-top: 30px;
	padding: 30px;
	border-radius: 3px;
}

.forumBlock .addComment textarea{
	width: 80%;
	height: 120px;
}


.addSubject{
	width: 60%;
	height: 450px;
	background-color: #555;
	margin: 0px 0px 20px 0px;
	border-radius: 5px;
	padding: 30px;
	display: none;
}

.outerBlock{
	width: 100%;
	border-radius: 5px;
	padding: 0px 0px 0px 0px;
	border: 1px solid #AAA;
}

.homeworkBlock{
	padding: 20px;
}

.homeworkBlock:hover{
	border: 1px solid #AAA;
	border-radius: 3px;
}

.homeworkDesc{
	margin-top: 20px;
}

.homeworkTable{
	width: 50%;
	margin-top: 20px;
}

.homeworkTable th{
	width: 120px;
}

.assignBlock{
	border-radius: 5px;
	padding: 20px;
	border: 1px solid #AAA;
}

.assignDesc{
	background-color: #FAFAFA;
	border-radius: 5px;
	padding: 10px;
	margin: 0px 0px 30px 0px ;
}


.exerciseBlock{
	font-size: 11pt;
}

.formFill{
	width: 60%;
	height: 300px;
	background-color: #555;
	margin: 10px 0px 20px 0px;
	border-radius: 5px;
	padding: 30px;
	color: #FFF;
	display: none;
}

.discussRoomBlock{
	clear: both;
}

.singleDiscussBlock{
	width: 200px;
	height: 200px;
	padding: 20px;
	border-radius: 5px;
	margin: 10px;
	border: 1px solid #CCC;
	display: inline-block;
	moz-box-shadow: 1px 1px 5px #CCC; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #CCC; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #CCC; /* Opera 10.5 + */
}

.discussEmpty:hover{
	moz-box-shadow: 1px 1px 5px #78D2FF; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #78D2FF; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #78D2FF; /* Opera 10.5 + */
}

.discussBusy:hover{
	moz-box-shadow: 1px 1px 5px #FF1A00; /* Firefox */
	-webkit-box-shadow: 1px 1px 5px #FF1A00; /* Safari 和 Chrome */
	box-shadow: 1px 1px 5px #FF1A00; /* Opera 10.5 + */
}

.singleDiscussBlock .title{
	font-size: 14pt;
	margin-bottom: 5px;
}

.singleDiscussBlock .nowAttend{
	position: relative;
	top: 0px;
	left: 155px;
	width: 60px;
	height: 20px;
	margin-bottom: -20px;
	background-color: #EFEFEF;
	padding: 5px;
	border-radius: 5px 0px 0px 5px;
	moz-box-shadow: 1px 1px 2px #CCC; /* Firefox */
	-webkit-box-shadow: 1px 1px 2px #CCC; /* Safari 和 Chrome */
	box-shadow: 1px 1px 2px #CCC; /* Opera 10.5 + */
}

.singleDiscussBlock .mylock{
	position: relative;
	top: -20px;
	left: -10px;
	margin-bottom: -10px;
}
	
.singleDiscussBlock .info{
	font-size: 9pt;
	color: #AAA;
	margin-bottom: 5px;
}

.singleDiscussBlock  .detail{
	height: 120px;
	
}

.singleDiscussBlock  .buttons{
	margin: 0 auto;
	text-align: center;
	
}

#formEditorToolBar{
	width: 90%;
	margin: 0 auto;
	
}

#problemsBlock{
	width: 90%;
	margin: 0 auto;
	margin-top: 30px;
	
}

.gradingSettings{
	display: none;
	margin-bottom: 20px;
}

.problem{
	margin: 5px 0px 5px 0px;
	border: 1px solid #CCC;
	border-radius: 5px;
	cursor: pointer;
	background-color: #FFF;
}

.problem:hover{
	moz-box-shadow: 1px 1px 2px #CCC; /* Firefox */
	-webkit-box-shadow: 1px 1px 2px #CCC; /* Safari 和 Chrome */
	box-shadow: 1px 1px 2px #CCC; /* Opera 10.5 + */
}

.problem .question_title{
	width: 100%;
	height: 35px;
	overflow: hidden;
	padding: 5px;
	font-size: 14pt;
}

.problem .problemContent{
	border-top: 1px solid #CCC;
	padding: 5px;
}

.problem .problemOptions{
	margin-top: 5px;
}


.myQuizBank .titleQuestion{
	height: 28px;
	overflow: hidden;
}

.exerciseTable{
	margin: 10px 20px 10px 20px;
}

.classmate_carousel{
	height: 80px;
}

.classmateBlock{
	padding: 0px 65px 0px 65px;
	
}

.classmateBlock .single{
	width: 6%;
	height: 70px;
	float: left;
	margin: 5px;
	padding:5px;
	text-align: center;
}

.classmateBlock .single .btnFunctionBlock{
	display: none;
	width: 6%;
	height: 70px;
	position: absolute;
	top: 5px;
	padding: 5px 1px 5px 1px;
	margin-left: -5px;
	background: rgba(0,0,0, 0.3);
	float: left;
	border-radius: 3px;
	z-index: 1;
}

.classmateBlock .single .btnFunctionBlock button{
	margin-bottom: 5px;
}

.classmateBlock .single:hover{
	background-color: #F6F6F6;
	border-radius: 3px;
	moz-box-shadow: 1px 1px 2px #CCC; /* Firefox */
	-webkit-box-shadow: 1px 1px 2px #CCC; /* Safari 和 Chrome */
	box-shadow: 1px 1px 2px #CCC; /* Opera 10.5 + */
}

.classmateBlock .single .personImage{
	
	width: 50px;
	height: 50px;
	margin: 0 auto;
	overflow: hidden;
	text-align: center;
}

.classmateBlock .single img{
	max-width: 50px;
	max-height: 50px;
}

.classmateBlock .single p{
	font-size: 8pt;
	margin: 5px 0px 0px 0px;
	text-align: center;
	overflow: hidden;
	white-space: nowrap; 
	text-overflow: ellipsis;
}

.chartDiv{
	margin: 0 auto;
	width: 100%;
	text-align:center;
}

.fb_block{
	position: absolute;
	width: 160px;
	height: 40px;
	top: 0px;
	left: 35%;
	padding: 10px 0px 0px 10px;
	background:url(images/fb_comment.png) no-repeat left top;
}

.searchBlock{
	width: 880px;
	height: 28px;
	margin: 0 auto;
	margin-bottom: 10px;
	background-color: #F4F4F4;
	padding: 10px;
	
	border-radius: 5px;
}

.teacherImageWrapper img{
	max-width: 200px;
	max-height: 300px;
}

.schoolBanner{
	width: 100%;
	margin-bottom: 20px;
}

.schoolBanner .bannerImg{
	width: 1014px;
	padding: 5px;
	border: 1px solid #CCC;
	background-color: #FFF;
}

.schoolBanner .schoolLogo{
	width: 80px;
	max-height: 80px;
	position: relative;
	top: -88px;
	left: 5px;
	margin-bottom: -88px;
	background-color: #FFF;
	padding: 3px 3px 0px 0px;
}

.introSchoolBlock{
	width: 900px;
	margin: 0 auto;
	text-align: center;
	
}

.videoFileBlocks{
	width: 100%;
	margin: 0 auto;

}


.videoFileBlocks  .title{
	font-size: 12pt;
}

.videoFileBlocks .subtitle{
	color: #999;
}

.videoFileBlocks .shareLink{
	color: #999;
}

.uploadFileList{
	display: block;
	min-height: 30px;
}

.uploadList{
	width: 965px;
	margin: 0 auto;
	padding: 15px;
	border-radius: 10px;
	color: #999;
	background: -webkit-gradient(linear, left top, left bottom, from( #EEE /*{c-bhover-background-start}*/), to( #EFEFEF /*{c-bhover-background-end}*/)); /* Saf4+, Chrome */
	background: -webkit-linear-gradient( #EEE /*{c-bhover-background-start}*/, #EFEFEF /*{c-bhover-background-end}*/); /* Chrome 10+, Saf5.1+ */
	background:    -moz-linear-gradient( #EEE /*{c-bhover-background-start}*/, #EFEFEF /*{c-bhover-background-end}*/); /* FF3.6 */
	background:     -ms-linear-gradient( #EEE /*{c-bhover-background-start}*/, #EFEFEF /*{c-bhover-background-end}*/); /* IE10 */
	background:      -o-linear-gradient( #EEE /*{c-bhover-background-start}*/, #EFEFEF /*{c-bhover-background-end}*/); /* Opera 11.10+ */
	background:         linear-gradient( #EEE /*{c-bhover-background-start}*/, #EFEFEF )
}


.tableNoLine  td{
	text-align: center;
	padding: 10px;
}

@media screen and (max-width: 800px) {
	.discussBlock{
		margin: 0;
		padding: 10px;
	}
	.discussBlock .singleBlock {
    	padding: 15px;
	}
	#cke_editor1,#cke_editor2,#cke_editor3,#cke_editor4,#cke_editor5{
		width: 100% !important;
	}
	.discussBlock .postDialog{
		padding: 15px;
	}
	.discussBlock .singleBlock .comment &gt; div {
    	margin: 0px;
    	padding: 10px;
}</pre></body></html>