#courselist{
	margin:30px 0;
}

#courselist > ul > li{
	display:inline-block;
	position: relative;
	width:100%;
	min-height:180px;
	margin:30px 0;
	background:#F6f6f6;
	border-radius:2px;
	box-shadow:0 1px 2px #EEE;
}

#courselist li .courseimage{
	float:left;
	max-width:240px;
	overflow: hidden;
	margin-right:30px;
	border-radius:2px;
}
.submissions .course_students,
.submissions .quiz_students,
.submissions .assignment_students{
	display: none;
}

.bp-user .mfp-auto-cursor .mfp-content{
	max-width:640px;
}

.show_hint{
	position:absolute;
	top:30px;
	right:30px;
}

.vibe_fillblank{border-bottom:2px solid #333;min-width:180px;display: inline-block;}
.hint{display: none;}

.show_explaination,
.show_hint span{
	font-family: 'fonticon';
	font-size:32px;line-height: 32px;
	color:#bbb;cursor: pointer;
}
.show_explaination{font-size:12px;line-height: 1;margin-left:5px;}
.show_hint.active span{font-size:24px;line-height: 32px;}

.show_explaination:before{
	content:"\e05d";
}	

.content .matchgrid_options li{
	list-style:none;
	position: relative;
}

.matchgrid_options li{
	border:1px solid #EFEFEF;
	padding:15px; font-size:13px;
	border-radius:2px;
}
.matchgrid_options li.ui-draggable-dragging{
    position: relative;
    top:0;
    left:0;
}

.explaination{
	display: none;
	padding:10px; 
	margin:10px 0 -12px;
	border-top:1px dashed #EFEFEF;
	background: #f6f6f6;
}
.show_hint span:before{
	content: "[";
}
.show_explaination.active:before{
	content: "\e092";
}
.show_hint.active span:before{
	content: "\e036";
}

.submissions.show .course_students,
.submissions.show .quiz_students,
.submissions.show .assignment_students{
	display: block;
}
.unit_prevnext .col-md-6{text-align: center;}
.unit_prevnext .col-md-6+.col-md-3{text-align: right;}

.unit_line a.unit,
.unit_line a.quiz,
.unit_line a.quiz{cursor:pointer;}
.course_curriculum strong span{
	color:#bbb;float:right;
}


h4.minmax{
	font-size: 12px;
	font-weight: 600;
	border-bottom: 5px solid #EFEFEF;
	padding: 8px 0;
}
h4.minmax i{color:#bbb;float:right;font-size:16px;}
#courselist li .course_desc{
	padding:10px 30px;
}
.unit_prevnext{
	padding: 15px;
	height: 55px;
	border: 2px solid #3f4c4f;
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
	background: #313b3d;
	margin: 20px -20px -20px;
	font-size: 12px;
	text-transform: uppercase;
}
#next_unit{float:right;}
#next_unit:after {
content: "\e0f6";
font-family: 'fonticon';
float: right;
margin-left: 5px;
margin-top: 1px;
}
#prev_unit:after {
content: "\e172";
font-family: 'fonticon';
float: left;
margin-right: 5px;
margin-top: 1px;
}
.unit_prevnext a{
	color:#FFF;
	font-weight:600;
}

.course_desc + ul{
	max-width: 200px;
	position: absolute;
	right: 0;
	top: 0;
	background:#EFEFEF;
	height:100%;
}
.course_timeline li:first-child a{
	margin-top:15px;
	display: inline-block;
}
#courselist li .course_desc + ul > li{
	margin:0;
	padding:8px 16px;
	background:#EFEFEF;
	border-bottom:1px solid #DDD;
}
#courselist li .course_desc + ul > li:hover{
	background:#DDD;
}
#courselist li .course_desc + ul > li i{
	font-size:16px;
	margin-right:10px;
	float:left;
}
.curriculum_check li{
	padding:6px 0;
	position: relative;
	padding-left:50px;
}
.curriculum_check li span{
	width:24px;
	height:24px;
	border-radius:50%;
	display: block;
	background:#f6f6f6;
	position: absolute;
	left:0;
	top:4px;
}
.curriculum_check li span.done{
	background:#70c989;
}
.curriculum_check li span.done:after{
	font-family: 'fonticon';
	content: "\e038";
	font-size:16px;
	margin:4px 2px 0 4px;color:#FFF;
}

.curriculum_check li strong{
	float:right;
	text-transform: uppercase;
}
#courselist li .course_desc + ul > li span{
	font-size:11px;
	text-transform: uppercase;
	font-weight:600;
}
.show_side{margin-top: 15px;display: none;}
.course_stats_user{
	display: inline-block;
	padding:20px 0;
	width:100%;
}
.course_grade li{
	font-size: 12px;
	text-transform: uppercase;
	font-weight: 600;
	color: #bbb;
	padding: 6px 0;
	border-bottom: 1px dotted #EFEFEF;
}

#average,#pass,#badge,
.course_quiz{
	width: 33%;
	float: left;
	margin:30px 0;
	text-align: center;
	color:#bbb;
	font-size:12px;
	font-weight:600;
	text-transform: uppercase;
}
.begin_quiz,
.submit_quiz{
	cursor:pointer;
}
.course_quiz h5{
	text-align: center;
	color:#bbb;
	font-size:12px;
	font-weight:600;
	text-transform: uppercase;
}
#average canvas,#pass canvas,#badge canvas,.course_quiz canvas{
	margin:10px 0;
}
.course_grade li strong{
	color:#222;
	float:right;
}
.course_grade li strong span{color:#bbb;}
h4.students_course{
	margin: 0 -20px 10px;
	padding: 10px 20px;
	background: #EFEFEF;
}
h4.students_course strong{
	float: right;
	padding: 5px 5px;
	background: #78c8ce;
	color: #FFF;
	line-height: 1;
	border-radius: 50%;
}

.calculate_panel{
	clear:both;
	margin: 0 -20px;
	padding: 10px 20px;
	background: #EFEFEF;
	text-align: right;
}
.calculate_panel strong{float:left;text-transform: uppercase;font-size:12px;margin-top:8px;}
.calculate_panel i{font-size:24px;margin-left:10px;color:#78c8ce;}
.complete_course{
	text-align: center;
	display: block;
	width:100%;
}
.complete_course canvas{display: inline-block;}
.course_stats_user h6{
	padding: 10px 20px;
	margin: 10px -20px !important;
	background: #EFEFEF;
}
.course_stats_user h6 span{float:right;font-weight:600;}

.in_details{display: none;
font-size:12px;margin:30px 0;
text-transform: uppercase;
font-weight:600;color:#bbb;
}

.in_details strong{float:right;color:#222;}

#userstats{
	margin:30px 0;
	display: inline-block;
	width:100%;
}
#userstats li{
	padding:10px 0 15px 0;
	border-bottom:1px solid #EFEFEF;
}
#userstats h4{margin:0;font-size:16px;font-weight:600;}
#userstats h4 span,
#userstats h4 + span{color:#bbb;font-size:11px;font-weight:600;}
#userstats li img{
		width: 48px;
	float: left;
	margin-right: 30px;
	border-radius: 50%;
}
#userstats li strong{
	float:right;
	font-size:12px;
	font-weight:600;
	margin-right:30px;
}
.price span.subs{
	font-size: 11px;
	text-transform: uppercase;
	font-weight: 600;
}
.showhide_indetails{
	float: right;
	color: #bbb;
	font-size: 24px;
	margin: -10px 0 0;
}

.widget_course_list a:hover img{
	border-color:#78c8c9;
}
.widget_course_list li h6{
	margin:0;
	font-size:14px;
}
.widget_course_list li img{
	float:left;
	max-width:48px;
	border:2px solid #EFEFEF;
	margin-right:10px;
	border-radius:2px;
}
.widget_course_list li h6 span{
	display: block;
	font-size:11px;
	color:#bbb;
	font-weight:600;
	text-transform: uppercase;
}

.course_instructor_widget img{
	max-width: 48px;
	border-radius: 50%;
	float: left;
	margin: 0 15px 15px 0;
}


.course_instructor_widget h5{
	margin:10px 0;
	padding:10px 0;
	border-bottom:3px solid #EFEFEF;
	font-size: 14px;
	font-weight: 600;
}

.course_instructor_widget .tip{
	float: right;
	font-size: 24px;
	color: #bbb;
}
.instructor_line{
	clear:both;
	display: inline-block;
	width:100%;
	margin:20px 0;
	border-bottom:5px solid #EFEFEF;
}

.instructor_line h3 a{
	float: right;
	font-size:13px;
	color:#bbb;
	text-transform: uppercase;
	font-weight:600;
}
.instructor_line:hover a{color:#78c8c9;}
.instructor_line h3 i{
	font-size:16px;
	margin-left:10px;
}

#question.quiz_submitted_fade{
	opacity:0.2;
}
#ajaxloader.disabled{display: none;}
#ajaxloader{
	position: absolute;
	top:20%;
	left:40%;
  display: inline-block;
  margin: 5em;
  border-width: 30px;
  border-radius: 50%;
  -webkit-animation: spin 1s linear infinite;
     -moz-animation: spin 1s linear infinite;
       -o-animation: spin 1s linear infinite;
          animation: spin 1s linear infinite;
  }

#ajaxloader{
  border-style: double;
  border-color: #78c8c9 #efefef #efefef;
  }

@-webkit-keyframes spin {
  100% { -webkit-transform: rotate(359deg); }
  }

@-moz-keyframes spin {
  100% { -moz-transform: rotate(359deg); }
  }

@-o-keyframes spin {
  100% { -moz-transform: rotate(359deg); }
  }

@keyframes spin {
  100% {  transform: rotate(359deg); }
  }
}



.course_bulk_actions{
	position: relative;
}
.course_bulk_actions strong{float:left;}
.course_bulk_actions ul{
	display: inline-block;
	float: right;
}
.course_bulk_actions ul li{float:left;}
.bulk_message,
.bulk_add_students,
.bulk_assign_students{
	margin:24px 0 0;
	border-top:5px solid #EFEFEF;
	padding-top:10px;
	display: none;
}
.bulk_message .button,
.bulk_add_students .button,
.bulk_assign_students .button{
	margin:10px 0;
}