/* CSS Document */
/* centered columns styles */
@media (min-width: 1200px){
.app, .app body {
    width: 100%;
     height: auto;
    
     /*height: 100%; overflow: hidden;*/
}}
@media (max-width: 980px){
.app, .app body {
    width: 100%;
     overflow-x: hidden;
    height: 100%; 
    overflow-y: auto;
}}
a:focus { 
    outline: none; 
}

.btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border:none;
    border-radius: 4px;
}

button:focus,.btn:focus , .btn-red:focus, .btn-blue:focus, button:active,.btn:active , .btn-red:active, .btn-blue:active{ 
    outline: none; border:none
}
input[type="file"],input[type="file" i]::-webkit-file-upload-button, button {
   cursor:pointer;
}
input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */
input:focus::-moz-placeholder { color:transparent; } /* FF 19+ */
input:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */

.btn-default {
    color: #717171 !important;
    background-color: #EDEDED;
    border-color: #dadada;
    border-bottom-color: #ccc;
    -webkit-box-shadow: 0 1px 1px rgba(90,90,90,0.1);
    box-shadow: 0 1px 1px rgba(90,90,90,0.1);
}
.btn-default:hover,.btn-default:focus,.btn-default:active{ background-color: #D7DAE0;}
.row-centered {
    text-align:center;
}
.col-centered {
    display:inline-block;
    float:none;
    /* reset the text-align */
    text-align:left;
    /* inline-block space fix */
    margin-right:-4px;
}
.divider {
  height: 1px;
  width:100%;
  display:block; /* for use on default inline elements like span */
  margin: 9px 0;
  overflow: hidden;
}
.divider1 {
  height: 1px;
  width:100%;
  display:block; /* for use on default inline elements like span */
  margin: 0px 0;
  overflow: hidden;
}
	/*	################   Login    #######*/
 .bgblue body{background: transparent url("../images/bg.jpg") no-repeat center center fixed;
    background-size: cover;
    overflow: hidden;
	min-height:666px;
	font-family: 'centralesans','brandongrotesque';
	}
	.make-center {
    float: none !important;
    margin: 0 auto;}
	.bgblue body .main-votex{margin-left: 25px;margin-bottom: 66px;}
	#login-form .main-votex{margin-left: 25px;margin-bottom: 76px;}
	#login-form h3{color:#232323;font-size:40px;letter-spacing: 10px;
    text-align: center;}
	#login-form h5{color:#757676;word-spacing:35px;text-align:center;    font-weight: 700;}
	#login-form h5 span{color:#757676;font-weight: 900;font-size:40px;}
	#login-form .loginpanel .student-title{font-size: 20px;
    margin: 0;
    color: #FF7537;
    font-weight: bold;
    padding: 0px 0px 10px 0px;}
	#login-form .loginpanel p{font-size:11px}
	
	#login-form .loginpanel .control-label{font-weight:bold;font-size:12px;padding:2px 0px}
	#login-form .loginpanel .form-control{ 
	border-radius: 5px;
   -moz-border-radius: 5px;
	 -webkit-border-radius: 5px;
	   -ms-border-radius: 5px;
	    -o-border-radius: 5px;  
		  border: solid thin #bbbbbc;
		  height:32px;margin-bottom:0px;
		  padding: 6px 16px;
font-size: 16px;}
 	 #login-form .loginpanel .parsley-error-list {
    margin: 0;
    padding: 0;
    list-style: none;
    margin-top: 0px;
	 margin-bottom:5px;
    font-size: 12px;
}
		 #login-form .loginpanel .regular-checkbox {display: none;}
		#login-form .loginpanel .regular-checkbox + label {
    background-color: #fafafa;
    border: 1px solid #cacece;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
    padding: 6px;
    border-radius: 3px;
    display: inline-block;    margin-top: 4px;
    position: relative;
}
#login-form .loginpanel .regular-checkbox:checked + label:after {
    content: '\2714';
    font-size: 14px;
    position: absolute;
    top: -3px;
    left: 2px;
    color: #f26522;
}
#login-form .loginpanel label .remember{ bottom: 6px;
    left: 5px;
    position: relative;}
#login-form .loginpanel .radio, #login-form .loginpanel .checkbox {
    display: block;
    min-height: 20px;
    padding-left: 0px;
    margin-top: 10px;
    margin-bottom: 10px;
}
#login-form .loginpanel .btn-orange{width:100%/*300px*/;}
 .border-right-gray {
    border-right: 1px solid gray;border-bottom: none;}
   .border-left-gray {
    border-left: 1px solid gray;
 }
  .border-gray {width:1px;height:100%;
    border: 1px solid gray;
 }
.btn-orange, .open .dropdown-toggle.btn-orange {
    color: #fff !important;
    background-color: #f26522;
    border-color: #f26522;    padding: 5px 20px;
    font-size: 14px;
    font-weight: bold;
	 border-radius: 5px;
   -moz-border-radius: 5px;
	 -webkit-border-radius: 5px;
	   -ms-border-radius: 5px;
	    -o-border-radius: 5px;
}
.btn-orange:hover, .btn-orange:focus, .btn-orange:active, .btn-orange.active, .open .dropdown-toggle.btn-orange {
    color: #fff !important;
    background-color: #f26522;
    border-color: #f26522;
}
/* start Login Media Query*/

@media (min-width: 768px) {
.loginBg{width:60%}
   .container{width:967px;margin: 0 auto;}
   .make-center {float: none !important;margin: 0 auto;}
   .form-control {display: block;/*width: 300px;*/}
    .wrapper-xl {padding: 40px 50px 50px 50px;}
   }

@media (min-width: 992px) {
.loginBg{width:60%}
	.container{width:967px;margin: 0 auto;}
    .make-center {float: none !important;margin: 0 auto;}
	.wrapper-xl {padding: 40px 50px 50px 50px;}
	}
	
@media (min-width: 1200px) {
.loginBg{width:60%}
	.container{width:1024px;margin: 0 auto;}
     .make-center {float: none !important;margin: 0 auto;}
	}
	
@media (max-width: 857px){
.border-right-gray{border-right: none;border-bottom: 1px solid gray;}
.loginBg{width:60%}
  .container{width:100%;margin: 0 auto;}
  .make-center {float: none !important;margin: 0 auto;}
  .aside-xxl{width:100%} .wrapper-xl { padding: 5px}
}
	
@media (max-width: 768px) and (max-width: 450px){
.loginBg{width:80%}
  .container{width:100%;margin: 0 auto;}
  .wrapper-xl {padding: 0px;}
  .bgblue body .main-votex{ margin-left: 25px;margin-bottom: 20px;}
  .wrapper-xl { padding: 5px}
}

@media (max-width: 300px) and (max-width: 450px){
    #login-form h3{color:#232323;font-size:30px;letter-spacing:3px;}
	#login-form h5{color:#757676;word-spacing:15px;text-align:center;  font-weight: 700;}
	#login-form h5 span{color:#757676;font-weight: 900;font-size:40px;}
}
/* end Login Media Query*/

body{/*font-family: 'centralesans','brandongrotesque';*/}
@media (min-width: 768px){
.app .hbox.stretch {
    height: 90%;
    margin: 8px 0px 8px 9px;
}}
/*
@media (min-width: 768px){
.app .vbox > section {
    position: relative;
    top: 0px;
    right: 0px;
    left: 3px;
}}*/
@media (min-width: 768px){
aside .vbox > section {
    position: relative;
    top: 0px;
    right: 0px;
    left: 0px;
}}

	/*	################ #### header #######*/
.navbar-brand img {
   /* height: 42px;*/ 
    margin-top: 0px;
    vertical-align: middle;
   /* width: 162px;*/
}
.clientLogo{width:158px;height:42px;}
.logoname{display:inline-block}
.pipeline{margin:0px 20px;display:inline-block}
.navbar-brand {
    float: none;
    text-align: center;
  font-family: 'brandongrotesque';
    font-size: 18px;
   line-height: 47px;
    display: inline-block;
    padding: 0px 15px;
    font-weight: normal;
}
.navbar-nav.navbar-right{ line-height: 47px;}
.navbar-nav.navbar-right:last-child {
    margin-right: 15px;font-family: 'brandongrotesque';
}
.navbar-nav > li > .dropdown-menu {
text-align:left;
    margin-top: 0;
   border-radius: 2px;
   -moz-border-radius: 2px;
	 -webkit-border-radius: 2px;
	   -ms-border-radius: 2px;
	    -o-border-radius: 2px;
}
.navbar-nav > li a:hover{background:#151d27}	
.navbar-nav > li.user{margin-left:5px;}
.navbar-nav > li.user:hover{background:#151d27}
.nav > li > a.inline {
    position: relative;
    display: inline-block;
    padding: 10px 0px;
}
.nav > li > a div.dropdown-toggleBg{ 
   display: inline-block;
 padding: 3px 6px 3px 6px;
    background-color: #25313e;
	 border-radius: 80px;
   -moz-border-radius: 80px;
	 -webkit-border-radius: 80px;
	   -ms-border-radius: 80px;
	    -o-border-radius: 80px;}
.dropdown-toggle .fa-home,.dropdown-toggle .fa-info-circle, .dropdown-toggle .fa-question-circle{font-size: 18px;
padding: 1px 0px 0px 0px;}
.dropdown-toggle .fa-home{padding: 2px 1px;}
.dropdown-toggle .fa-info-circle, .dropdown-toggle .fa-question-circle{    padding: 3px 1px 0px 1px;}
.dropdown-toggle .help{font-size: 10px;
    border-radius: 100px;color:#f4f5f5;
        padding: 2px 4px;
    border: solid 2px #f4f5f5;}
	
.dropdown-menu > li > a i.fa-bar-chart-o{padding-right:5px;}
.dropdown-menu > li > a i.fa{padding-right:5px;color: #999999;}
 a i.fa{padding-right:2px;}
.dropdown-menu ul.subMenuLine li{border-bottom:solid thin #f4f5f5}
.dropdown-menu ul.subMenuLine li:last-child{border-bottom:none}
.subMenuLine{border-bottom:solid thin #f4f5f5}
/*	################Help popup ####### */
	.modal-title .help{/*font-size: 14px;*/
   color:#438B9E;
    }
	.modal-title i.fa-question-circle{padding-right:5px;}
	.modal-header .close {
    margin-top: 8px;
}
.externallink{float: left; color: #438B9E;font-size: 15px; padding: 8px 10px;}
.close {
    float: right;
    font-size: 21px;
    font-weight: bold;
    line-height: 1;
    color: #000;
    text-shadow:none;
    filter: alpha(opacity=1);
    opacity: 1;
}.modal {
    position: fixed;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    z-index: 1050;
    display: none;
    overflow-x: auto;
    overflow-y:none;
    outline: 0px none;
}
.modal-content {
    position: relative;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 2px;
    outline: none;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
}.modal-body {
    position: relative;
    padding: 5px 5px 5px 5px;
}.modal-body >  .newcourse{
  
    padding: 5px 5px 5px 5px;
}
.modal-header .closebg{font-size: 11px;
    border-radius: 100px;
    /*color: #438B9E;
    padding: 3px 4px;
    border: solid 1px #438B9E;*/
    color: #FFF;
    padding: 5px 6px;
    background: #438B9E;
    position: absolute;
    right: -10px;
    top: -20px; text-shadow:none;}
    .modal-header .closebg:hover,.modal-header .close:hover{
    color: #FFF;
    background: #438B9E;
    filter: alpha(opacity=100);
   opacity: 1;
    }
   .modal-header .btn{margin:3px 10px}
   .modal-header .pager{margin:3px 10px;display: inline-block;
padding: 6px 12px;
margin-bottom: 0px;
font-size: 14px;
font-weight: normal;
line-height: 1.42857;
text-align: center;
white-space: nowrap;
vertical-align: middle;
cursor: pointer;
-moz-user-select: none;
background-image: none;
border: medium none;
border-radius: 4px;cursor:default}
    .modal-header{padding: 2px 15px;background:#c3f0fc;
       border-radius: 2px 2px 0px 0px;}

.shadow {margin-bottom:5px;
  -webkit-box-shadow: 0 8px 6px -6px #ccc;
       -moz-box-shadow: 0 8px 6px -6px #ccc;
            box-shadow: 0 8px 6px -6px  #ccc;
}
/*	################Right Content ####### */
	 .rightHead{  background: #fff;/*font-family: 'brandongrotesque';*/
   min-height: 120px;
    height: auto;
    overflow: hidden;
    border-radius: 2px;
	-moz-border-radius: 2px;
	 -webkit-border-radius: 2px;
	  -o-border-radius: 2px;
	  -ms-border-radius: 2px;
    margin-bottom: 10px;
	-webkit-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
	-moz-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
	-o-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
    box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);} 
	.rightHead .thumBg{padding:10px 20px 10px 60px;color: #333}
	.rightHead .thumb-md{border: solid 2px #111;width:100px;height:100px;
    border-radius: 100px;}
	.rightHead .thumb-md img{width:100px;height:96px
 }
 .thumb-sm{width:30px;height:30px}
 .thumb-sm img{width:30px;height:28px}
	.rightHead .thumright{padding: 0px 10px 5px 10px ;
  }
	.rightHead .thumName{padding: 0px 15px 0px 15px;display:block;
    font-size: 19px;}
	.rightHead .thumprofile{padding: 2px 15px;display:block;
    font-size: 13px;}
	.rightHead .thummail{padding: 2px 15px;display:block;
    font-size: 12px;color: #333}
	.rightHead .thumSocial{padding: 3px 14px;display:block;
    font-size: 8px;}
	.thumSocial i.fa-facebook{ /*background:#CCCCCC;*/ /*border:solid thin #CCCCCC; color: #ccc; */  
	color: #717171 !important;
    background-color: #ECECEC; /*#fafafa;*/
    border-color:#dadada;
    border-bottom-color: #ccc;
    -webkit-box-shadow: 0 1px 1px rgba(90,90,90,0.1);
    box-shadow: 0 1px 1px rgba(90,90,90,0.1);
	padding: 5px 8px;
    border-radius: 50px;
	-moz-border-radius: 50px;
	 -webkit-border-radius: 50px;
	  -o-border-radius: 50px;
	  -ms-border-radius: 50px;}
	.thumSocial i.fa-twitter{ /*background:#CCCCCC;*/ /*border:solid thin #CCCCCC; color: #ccc;*/ 
	color: #717171 !important;
    background-color: #ECECEC;/*#fafafa;*/
    border-color: #dadada;
    border-bottom-color: #ccc;
    -webkit-box-shadow: 0 1px 1px rgba(90,90,90,0.1);
    box-shadow: 0 1px 1px rgba(90,90,90,0.1);
	padding: 5px;
    border-radius: 50px;
	 -moz-border-radius: 50px;
	 -webkit-border-radius: 50px;
	  -o-border-radius: 50px;
	  -ms-border-radius: 50px;}
	/*.rightHead  .thumName h4{padding: 20px;}*/
	
	.rightHead .buildcourse{    padding: 40px 50px 30px 0px;}
	.rightHead .buildcourse .btn-default {
    color: #666 !important;
    background-color: #f0f2f5;font-size:19px;
    border-color: #dadada;
    border-bottom-color: #ccc;
    -webkit-box-shadow: 0 1px 1px rgba(90,90,90,0.1);
    box-shadow: 0 1px 1px rgba(90,90,90,0.1);
	 border-radius:5px;
  -moz-border-radius: 5px;
	 -webkit-border-radius: 5px;
	  -o-border-radius: 5px;
	  -ms-border-radius: 5px;;
}
.rightHead .buildcourse .btn-default:hover,.rightHead .buildcourse .btn-default:focus,.rightHead .buildcourse .btn-default:active{ background-color: #D7DAE0;}
	.rightHead .buildcourse .build{font-size: 16px;color:#fff;
    border-radius: 100px;
    padding: 5px 8px;
    background: #32bae2;margin-right: 8px;}
.rightHead .buildcourse .btn-lg, .btn-group-lg > .btn {
    padding: 8px 16px;}
	
	.tablegrid{
	position:relative;
	width:100%;
	min-height: 400px;
	margin-bottom: 0px;
    height: auto;
    overflow: hidden; background: #fff;
  border-radius:2px;
  -moz-border-radius: 2px;
	 -webkit-border-radius: 2px;
	  -o-border-radius: 2px;
	  -ms-border-radius: 2px;
	-webkit-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
	-moz-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
	-o-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
    box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);}
	

	.tablegrid .panel-heading{padding: 5px 15px 6px 15px;
    min-height: 45px;height:auto; overflow:hidden;background:#c3f0fc;}
	.tablegrid .panelbg{ padding: 5px 15px 3px 15px;}
	.tablegrid .panelbg .coursetitle{ font-weight: 600;    padding: 5px 0px 0px 45px;
    font-size: 17px;color:#19202c;font-family: 'brandongrotesque';}
	.tablegrid .searchbg {padding-right: 45px;}
	.tablegrid .search{padding-top: 2px;    position: relative;
   }
	.tablegrid  .fa-search {
    position: absolute;
    top: 7px;
    right: 20px;
}
.tablegrid .btn-search{display: inline-block;float: right;}
.tablegrid .search .searchbtn {top:1px;
position:relative;height:27px;width:130px;display:inline-block;
 border-radius:5px 0px 0px 5px;
  -moz-border-radius: 5px 0px 0px 5px;
	 -webkit-border-radius:5px 0px 0px 5px;
	  -o-border-radius: 5px 0px 0px 5px;
	  -ms-border-radius: 5px 0px 0px 5px;
   
}
.tablegrid .search .selectbtn {
right: 10px;
   top:2px;
position:relative;height:27px;width:130px;display:inline-block;
 border-radius:5px 0px 0px 5px;
  -moz-border-radius: 5px 0px 0px 5px;
	 -webkit-border-radius:5px 0px 0px 5px;
	  -o-border-radius: 5px 0px 0px 5px;
	  -ms-border-radius: 5px 0px 0px 5px;
}
.tablegrid .search  .btn-blue {right: 5px;
    top: 0px;
    position: relative;
     background: #97DFF3;
    font-size: 11px;
    color: #FFF;line-height: 1.4;
    font-weight: normal;
    border-radius: 0px 5px 5px 0px;
	-moz-border-radius: 0px 5px 5px 0px;
	 -webkit-border-radius: 0px 5px 5px 0px;
	  -o-border-radius: 0px 5px 5px 0px;
	  -ms-border-radius: 0px 5px 5px 0px;
}
.tablegrid .search  .selectDD{margin-right:10px}

.tablegrid .search .btn-blue:hover,.tablegrid .search .btn-reset:hover,.search .btn-btn-download:hover{ background: #32BAE2;}
.tablegrid .search .btn-reset{color:#fff !important;
padding: 6px 8px;
display: inline-block;
border-radius: 2px;
margin-left: 15px;margin-right: 8px; width:70px;}
.tablegrid .search .btn-ddreset{ top: -2px;
color:#fff !important;
padding: 6px 8px;
display: inline-block;
border-radius: 2px;
margin-left: 15px;margin-right: 8px; width:70px;}
.tablegrid .search .btn-download{    top: -2px;
    position: relative;
color:#fff !important;
padding: 6px 8px;
display: inline-block;
border-radius: 2px;
margin-left: 15px;margin-right: 8px; width:100px;}

.tablegrid a > .btnAction{width:100px}
  .tablegrid .table {/*font-family: 'brandongrotesque';*/
    letter-spacing: 0.9px;font-size:14px;}
	.tablegrid .table > thead > tr { border-bottom: solid 2px #ECECEC;}
	.tablegrid .table > thead > tr > th{padding: 5px 5px 8px 30px;font-weight: bold;text-align:left;color:#636363;font-size:14px;}
	.tablegrid .table > thead > tr > th a{color:#636363;}
	.tablegrid .table > thead > tr > th a i.fa{padding-left: 3px;color: #B2B5BB;}
	.tablegrid .table > thead > tr > th:last-child{text-align: left;padding: 5px 5px 8px 46px;}
	.tablegrid .table > thead > tr > th:first-child{padding: 5px 5px 8px 79px;}
	.tablegrid .table > tbody > tr > td:first-child{ padding: 0px 5px 0px 79px;vertical-align: middle;}
	.tablegrid .table > tbody > tr > td:last-child{ padding: 6px 5px 6px 0px ;vertical-align: middle;;}
	.tablegrid .table > tbody > tr > td{ padding: 6px 5px 6px 31px;vertical-align: middle;height: 36px;font-weight: normal;font-size: 12px;text-align:left;color:#2D2D2D}
	/*.tablegrid .table > tbody > tr:nth-child(even) {background: #FFF}
	.tablegrid .table > tbody > tr:nth-child(odd) {background-color: #F9F9F9}*/
	.tablegrid .table > tbody > tr:hover{/* background: #f5f5f5;*/background-color: #F9F9F9}
	
	.panel .table td, .panel .table th {
    padding: 6px 15px;
    border-bottom: 1px solid #f1f1f1;
}
.panel .table td:last-child, .panel .table th:last-child {
   
    border-bottom: 1px solid #f1f1f1;
}
.tablegrid .promo  .table > thead > tr > th:last-child{text-align: left;padding: 5px 5px 8px 16px;}
.tablegrid .promo .table > thead > tr > th:first-child{padding: 5px 5px 8px 39px;}
.tablegrid .promo .table > tbody > tr > td:first-child{ padding: 0px 5px 0px 39px;vertical-align: middle;}
/*table sorting*/
.th-sortable .th-sort {
     float: none; 
    position: relative;
} .tablegrid .table > thead > tr > th .th-sort .fa-sort {
    position: absolute;
    left: 0;
    top: 3px;
   color:#666666
    z-index: 0;
}
.tablegrid .table > thead > tr > th a i.fa-sort-down,.tablegrid .table > thead > tr > th a i.fa-sort-up {
    position: absolute;
    left: 0;
    top: 3px;
    z-index: 1; color:#666666
}

.tablegrid .table > thead > tr > th .th-sort  a i.fa-active {
    color:#666666
}
/*action condition*/
.publish{color:#91c25c}
.readytopublish{color:#6dcde8}
.incomplete{color:#ef6d7a}
	.tablegrid .table > tbody > tr > td > .btn-default {
    color: #111 !important;
    background-color: #f0f2f5;font-size:13px;font-weight:bold;width:80px;
    border-color: #dadada;
    border-bottom-color: #ccc;
    -webkit-box-shadow: 0 1px 1px rgba(90,90,90,0.1);
    box-shadow: 0 1px 1px rgba(90,90,90,0.1);
	 border-radius:5px;
  -moz-border-radius: 5px;
	 -webkit-border-radius: 5px;
	  -o-border-radius: 5px;
	  -ms-border-radius: 5px;;
}
	.tablegrid .table > tfoot {
    display: table-footer-group;
    vertical-align: bottom;
    border-color: inherit;
}
.tablegrid .table > tfoot > tr > th{text-align:center;color:#717172;passing:5px 0px;
background: -webkit-linear-gradient(#f6f6f6, #e9ebec); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(#f6f6f6, #e9ebec); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(#f6f6f6, #e9ebec); /* For Firefox 3.6 to 15 */
  background: linear-gradient(#f6f6f6, #e9ebec); /* Standard syntax */}
.panel {
    margin-bottom: 0px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}
.panel > .table-responsive {
    margin-bottom: 0;
    border: 0;
   height: 345px;
    overflow-y: auto;
}

.panel > .table, .panel > .table-responsive > .table {
    margin-bottom: 0px;
}
.tablegrid .table > tbody > tr > td.noRecord{
 padding: 110px ;height: 250px;
overflow-y: hidden;text-align:center;font-size:14px;}

 .tablegrid .panel-footer{ text-align:center;color:#a5a6a6;padding: 0px 0px;}
  .tablegrid .panel-footer .pagination {
    display: inline-block;
    padding-left: 60;
    margin: 6px 0px 0px 0px;
    border-radius: 4px;
}
 .tablegrid .panel-footer i.fa{ text-align:center;color:#a5a6a6}
 
 
  .tablegrid .panel-footer ul.pagination {
    text-align:center;
    color:#829994;
}
 .tablegrid .panel-footer ul.pagination li {
    display:inline;
    padding:0 3px;
}
 .tablegrid .panel-footer ul.pagination a {
    color:#5bc0de;font-size:11px;
	font-weight:bold;
    display:inline-block;
    padding:2px 6px;
    border:1px solid #cde0dc;
    text-decoration:none;
}
 .tablegrid .panel-footer ul.pagination a:hover, 
 .tablegrid .panel-footer ul.pagination a.current {
    background:#5bc0de;
    color:#fff; 	font-weight:bold;
}
 .tablegrid .panel-footer ul.pagination a.disableLink, .tablegrid .panel-footer ul.pagination a.disableLink:hover {
    background-color: rgb(207, 207, 207)!important;
    color: rgb(235, 236, 237)!important;
    cursor: default;
}
  .tablegrid .panel-footer .page_info{font-size:11px;}
 .otherPage{
    min-height: 577px;
    height: auto;
    overflow: hidden;   }
	.rightTable{  background: #fff;
   
  border-radius:2px;
  -moz-border-radius: 2px;
	 -webkit-border-radius: 2px;
	  -o-border-radius: 2px;
	  -ms-border-radius: 2px;
	-webkit-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
	-moz-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
	-o-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
    box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);} 
	
	/*   breadcrumb*/
	.breadcrumb {
    padding: 2px 15px;
    margin-bottom: 8px;
    list-style: none;
    background-color: none;
    border-radius: 4px;
    height: auto;
    overflow: hidden;
}
.breadcrumb a{ /*text-transform:capitalize;*/}

.breadcrumb a:hover {
    color: #999;
}
.breadcrumb a:hover {
    color: #00BAF2;
}
  .rightContent{  background: #fff;
 /*  min-height: 470px;*/  min-height: 520px;
    height: auto;
    overflow: hidden;
	border-radius:2px;
	-moz-border-radius: 2px;
	 -webkit-border-radius: 2px;
	  -o-border-radius: 2px;
	  -ms-border-radius: 2px;
	-webkit-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
	-moz-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
	-o-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
    box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);} 
	.modal-bodyEditor {
    position: relative;
    padding:5px 20px;
}
	.modal-bodyEditor {
    position: relative;
    padding:5px 20px;
}
	 .rightContentEditor{  background: #fff;
	 min-height:432px;
    height: auto;
    overflow: hidden;
	border-radius:2px;
	-moz-border-radius: 2px;
	 -webkit-border-radius: 2px;
	  -o-border-radius: 2px;
	  -ms-border-radius: 2px;
	-webkit-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
	-moz-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
	-o-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
    box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);} 
	
	/*Validation caolor*/
	.required, .minwords, .regexp, .maxwords,.type,.maxlength,.minlength{color: #CA0606;font-size: 12px;}
	.text-red{color:#FF3333;font-size:12px;margin:0px;padding:2px;}
	.newcourse{padding:5px 20px;}
	
	.newcourse .stepBg{border-left:solid thick #00baf2;margin-bottom:0px;margin-top:5px;}
	.newcourse .stepBg p{padding:2px 5px; color: #262b36; /*text-transform:capitalize*/}
	/*.newcourse .stepBg p::first-letter {
     text-transform: capitalize;
   }*/
	.newcourse .form-control {    
	font-size: 14px;
    display: block;
    width: 100%;
	border: solid 1px #96d4e9;
	border-radius:5px !important;
	-moz-border-radius: 5px !important;
	 -webkit-border-radius: 5px !important;
	  -o-border-radius: 5px !important;
	  -ms-border-radius: 5px !important;
}
.newcourse .form-control:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
          box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
}
.newcourse .form-control::-moz-placeholder {
  color: #999;
  opacity: 1;
}
.newcourse .form-control:-ms-input-placeholder {
  color: #999;
}
.newcourse  .form-control::-webkit-input-placeholder {
  color: #999;
}
input:focus::-webkit-input-placeholder {
    opacity: 0;
}
input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */
input:focus::-moz-placeholder { color:transparent; } /* FF 19+ */
input:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */
.newcourse .form-inline{overflow:hidden}
.newcourse .form-inline .form-control {
    display: inline-block;
    width:100%;
    vertical-align: middle;
}
.newcourse .input-lg,.newcourse .input-md,.newcourse .input-sm {
    height: 36px;
    padding: 2px 5px;
    line-height: 1.23;
}

.newcourse .textarea{text-indent:0px;
    height: 100px;
	resize:none;
 padding: 2px 5px;
    line-height: 1.23;
}
 .newcourse .clicker{padding-bottom: 8px;}
.newcourse .componentBg{height:250px;overflow-y:auto;overflow-x:hidden;}
.label-danger {
    position: absolute;
    left: 3px;
    top: 5px;
}
.newcourse .control-label{color: rgba(38, 43, 54, 0.8);  padding-top: 0px; padding-bottom: 2px;}
.scenario .newcourse .bold{ color: rgba(38, 43, 54, 0.8);   padding-top: 0px; padding-bottom: 2px;}
.newcourse .control-label .fa{color:#b4b9c0}

.newcourse .control-label a.imagehover, .newcourse a.imagehover{position:relative;padding-left:10px; display:none;}
.newcourse .control-label a.imagehover .fa, .newcourse a.imagehover .fa{color:#999}
.newcourse .control-label a.imagehover span, .newcourse a.imagehover span{position:absolute; display:none; z-index:99;}
.newcourse .control-label a.imagehover:hover span, .newcourse a.imagehover:hover span{display:block;left: 15px; -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05);}
	
	.newcourse 	.showList {background: #f5f5f5;display: block;min-height: 45px; margin-bottom:10px;overflow:hidden;height:auto; }
	.newcourse 	.showList h5{font-weight:bold;padding:0px 10px}
	.newcourse 	.showList .pull-right{padding:7px 10px}
	
.newcourse 	.list-group-sp .list-group-item{background:#f5f5f5;display: block; min-height: 40px;height:auto;overflow:hidden;}
.newcourse .sublist-group{height:265px;overflow-y: auto;display:block;padding-bottom:0px}
  .newcourse .list-group-sp .subitem{background: #f4faee;display: block; min-height: 30px;height:auto;overflow:hidden;padding-top: 8px;
    padding-bottom: 8px;color: #111;border:solid thin #d0d9c8}
	.newcourse .list-group-sp .subitem:hover{background: #EAF9DC}
	.newcourse .list-group-sp .disabled{background:#fbf0f1;border:solid thin #f7d0d4}
	.newcourse .list-group-sp .mid{ background:#fbf0f1;border:solid thin #f7d0d4}
	.newcourse .list-group-sp .mid:hover,.newcourse .list-group-sp .disabled:hover{ background:#F7D6D9;}
	.newcourse  .list-group-lg .list-group-item {
    padding-top: 10px;
    padding-bottom: 10px;
}
.newcourse 	.showChList {background: #f5f5f5;display: block;min-height: 45px; margin-bottom:10px;overflow:hidden;height:auto; }
	.newcourse 	.showChList h5{font-weight:bold;padding:0px 10px}
	.newcourse 	.showChList .pull-right{padding:7px 10px}
	.newcourse .subChitem .list-group-item{ display: block;
    min-height: 30px;
    height: auto;
    overflow: hidden;
    padding-top: 8px;
    padding-bottom: 8px;
    border: solid thin #d0d9c8;}
	.newcourse .subChitem .bg-white {
    background-color: #fff;
    color: #717171;
}.newcourse .subChitem .list-group-item {
    border-color: #e8e8e8;
    padding-right: 15px;    color: #2e3e4e;
}
.newcourse .subChitem .list-group-item a.fa{
  color: #2e3e4e;
}
.newcourse .subChitem .list-group-item:hover {
   background: #f5f5f5;color: #1b252e;
}
.newcourse .subChitem .notAvl{padding: 150px 0px;text-align:center;
    font-size: 14px;}
	.notAvl{padding: 150px 0px;text-align:center;
    font-size: 14px;}
.newcourse .list-group-sp .subitem > .fa, .newcourse .list-group-sp .subitem a > .fa{color: #111;}
.newcourse a.btn-blue > .fa-plus-circle,.newcourse button.btn-blue > .fa-plus-circle,.btn-blue > .fa-plus-circle{color:#fff; font-size:16px;}
.newcourse .btn > .fa-plus-circle,.btn-blue > .fa-plus-circle{color:#00baf2; font-size:16px;}
.newcourse .list-group-item  a > .fa-plus-circle{color:#00baf2; font-size:18px;}
.newcourse .menuItem a{font-size:15px;text-align:left}
.btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    -moz-user-select: none;
    background-image: none;
    border:none;
    border-radius: 4px;
}
.btn-red{background: #ed5565;
    padding: 3px 16px;
    margin-left: 5px;
    margin-top: 5px;
    font-size: 14px;
    color: #fff;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    -ms-border-radius: 5px;}
	  .btn-red:focus,.btn-red:hover, .btn-red:active{color:#fff;outline:none;background:#D13344}
	   .btn-blue:focus,.btn-blue:hover,.btn-blue:active{color:#fff;background:#32BAE2 }
.breadcrumb a.btn-blue{
    color: #fff;
}
.breadcrumb .pull-right {position: relative;
    top: -3px;display:none;}
	.breadcrumb .pull-left {position: relative;
    top: 5px;}
	.breadcrumb .pull-left li{display:inline-block}
	.breadcrumb .pull-left >  li +  li:before {
    padding: 0 5px;
    color: #ccc;
    content: "/\00a0";
}
.breadcrumb .pull-left a {
    color: #999;
}
.btn-blue{color:#fff;
      background: #5bc0de;

    font-size: 12px;
    color: #fff;
    /*font-weight: bold;*/
	border-radius:5px;
	-moz-border-radius: 5px;
	 -webkit-border-radius: 5px;
	  -o-border-radius: 5px;
	  -ms-border-radius: 5px;}
	  .btn-blue fa-plus{}
	  .btn-blueCh {    margin-top: 6px;}
/*############ Footer  ###############*/
	footer > .navbar{min-height:50px;height:auto;overflow:hidden}
	footer > .copyright{
    font-size:11px;
    padding:11px;
   
  }
	
/* ---- footer Timeline elements ---- */
.steps{color:#cc6621;font-size:14px;}
.hortimeline {
    position: relative;
    display: block;
    margin: 0px;
    height: 4px;
    top: 10px;
    background: #45586e;
    clear: both;
}
.step{
    display: inline-block;
    width: 0;left: 0px;position: relative;
    top: -8px;
    height: 0;
    border-radius: 10px;
    border: 10px solid #00bff3;}
.step span{color: #fff;
    position: relative;
    top: -8px;
    right: 3px;}	



	/*	################left sidebar  Content ####### */
.header, .footer {font-family: 'brandongrotesque';
    min-height: 25px;
    padding: 0 15px;
    border-radius: 2px 2px 0px 0px;
	 -moz-border-radius: 2px 2px 0px 0px;
	 -webkit-border-radius: 2px 2px 0px 0px;
	   -ms-border-radius: 2px 2px 0px 0px;
	    -o-border-radius: 2px 2px 0px 0px;
}
.footer .b-t {
    border-top: none;
}
 .bg-dark.lt, .bg-dark .lt{    background-color: #F1F1F1;}
 .bg-dark.lter, .bg-dark .lter .menu{
	border-radius:2px;
	-moz-border-radius: 2px;
	 -webkit-border-radius: 2px;
	  -o-border-radius: 2px;
	  -ms-border-radius: 2px;
	-webkit-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
	-moz-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
	-o-box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);
    box-shadow: 1px 3px 1px rgba(0, 0, 0, .05);}
	.active > .text-active {
    display: inline-block !important;color: #242E3A;
}
	  .menu i.asideIcon{color: #242E3A;}
	.sideBartitle{background:#fbf0f1;border-top:solid thin #f9dadd;border-bottom:solid thin #f9dadd;padding:0px 10px 2px 10px;color:#111;font-family: 'brandongrotesque';}
	.sideBartitle h6{padding:0px 10px;color:#111;font-size:14px;font-weight:500;margin-top: 2px;
    margin-bottom: 2px;}
	.sideBartitle .fa-minus{background:#05c0f3;color:#fff;padding:0px 1px;font-size:9px;margin-right:5px;}
	.sideBartitle .fa-plus{background:#05c0f3;color:#fff;padding:0px 1px;font-size:9px;margin-right:5px;}
  .sideBartitle .subtitle {text-align: left;
    font-size: 12px;
    color: #111;
    padding-left: 55px;}

/* Click to hide Tree*/
aside> .vbox > .footer{
    width: 250px;}
	aside> .vbox > .w-f{
    width: 250px;}
.nav-xs > .vbox > .header, .nav-xs > .vbox > .footer {
    padding: 0 12px;
    width: 55px;
}
.nav-xs >.vbox > section.w-f {
    bottom: 50px;
    width: 55px;
}
.nav-xs > .vbox > section.w-f .sideBartitle, .nav-xs > .vbox > section.w-f .tree {display:none;}


/*<!--Left Side Bar Tree-->*/
   .tree { padding: 10px 0px 0px 0px;  
     height: 420px;
    overflow-y: auto;width:100%;
 
}
.nav-primary .tree ul.nav ul{display:block;
}
.nav-primary .tree ul.nav  > li > a{color:#111;position: relative;
    display: inline;
    padding: 0px 0px;}
	.nav-primary .tree ul.nav >li{line-height: 1.2;}
   .tree ul{list-style:none;color:#111;font-family: 'brandongrotesque';}
    .tree ul li ul{list-style:none;color:#111;padding-left: 0px;}
  .tree > .nav >  li> a{color:#111;position: relative;
    display: inline;
    padding: 0px 0px;}
	.tree ul li.hide{display:none;}
	.tree ul li.show{display:block;} 
	.tree div{height: 20px;
    white-space: nowrap;
    cursor: pointer;} 
	.tree li div:hover{ background:#fbf0f1;color:#111;}
	.tree li div.active{ background:#F6D7DA ;color:#111;}
	.tree li div a:hover,.tree li div a span:hover{ /*background:#fbf0f1;*/color:#111;}
	.tree li div a span{font-size:15px;
    position: relative;}
	/*.tree li div a span::first-letter {
     text-transform: capitalize;
   }*/
	.tree li div a{color:#111;padding-left: 0px;top: 0px;
    position: relative;}
  .tree li ul li div a{color:#111;padding-left: 25px;top: -1px;
    position: relative;}
 .tree li ul li ul li  a{color:#111;padding-left: 44px;top: -1px;}
 .tree li ul li ul li ul li a{color:#111;padding-left: 72px;}
 .tree li ul li ul li ul li ul li a{color:#111;padding-left: 70px;}
  .tree li  div .parent_li>a.course{padding: 0px 0px;
    color: #111;
    font-size: 16px;
    left: -8px;
    font-weight: 500;
	top:-15px;
    margin-top: 2px;
    margin-bottom: 2px;
    position: relative;}

 /* .tree li.parent_li>a span.treePartent{padding: 0px 0px;
    color: #111;
    font-size: 16px;
    left: -8px;
    font-weight: 500;
	top:-15px;
    margin-top: 2px;
    margin-bottom: 2px;
    position: relative;}*/
	 .tree li div.parent_li>a.course:hover{ color: #111;}
.tree li div.parent_li>a span.subtitle {text-align: left;display:block;
    font-size: 12px;
    color: #111;
    padding-left: 35px;}

.tree  div .fa-minus,.tree div .fa-plus {
  background:#05c0f3;
    color: #fff;
 padding: 2px 3px;
    font-size: 8px;
    margin-right: 5px; 
	top: -2px;
    margin-top: 0px;position:relative;z-index:999;
}
/*.tree .firstpratent{
   top: -20px;
}*/
.tree div .fa-square {
   /* background: #05c0f3;*/
     background:#999;color:#999;padding: 1px 2px;font-size:8px;margin-right:5px;
	top: 7px;position:relative;z-index:999;
}

.tree div a > .fa,.tree li ul li div a > .fa, .tree li ul li ul li div a > .fa,.tree li ul li ul li a .fa{color:#999;} 
.nav-primary .tree li > a > i {
    margin: -12px -15px;
    line-height: 35px;
    width: 44px;
    float: none;
    /* margin-right: 10px; */
    font-size: 14px;
    border-right: 1px solid rgba(255,255,255,0.05);
    text-align: center;
    position: relative;
    overflow: hidden;}
.tree div .fa-minus,.tree div .fa-plus,.tree div .fa-square {left:2px;}
.tree li ul li  div .fa-minus,.tree li ul li  div .fa-plus,.tree li ul li  div .fa-square {left:25px;top: -3px;
    margin-top: 0px;position:relative;}
.tree li ul li ul li .fa-minus,.tree li ul li ul li .fa-plus,.tree li ul li ul li .fa-square {left:45px;    top: -3px;
    margin-top: 0px;position:relative;}
.tree li ul li ul li  ul li .fa-minus,.tree li ul li ul li  ul li .fa-plus,.tree li ul li ul li ul li .fa-square {left:68px;}
.
/*.tree .fa-minus{background:#05c0f3;color:#fff;padding:0px 1px;font-size:9px;margin-right:5px;}
.tree .fa-plus{background:#05c0f3;color:#fff;padding:0px 1px;font-size:9px;margin-right:5px;}*/
.tree  div .fa-user{
    position: relative;
    padding: 0px 2px 0px 5px;
    z-index: 999;}
	.tree  div .fa-book{/*background: #FFFFFF;*/
    position: relative;
    padding: 0px 1px 0px 0px;
    z-index: 999;left: -2px;}
.tree li{
    list-style-type:none;
    margin:0;
   /* padding:30px 5px 5px 5px;*/
    position:relative
}

.tree li ul li{
  
    padding:0px 0px;
   
}
/*.tree li ul li ul li{
   
    padding:5px 5px 0 15px;
   
}*/
.tree li::before, .tree li::after {
    content:'';
    position:absolute;
    right:auto;
	 left:26px;
}
.tree li ul li::before{
    left:35px;
}
.tree li ul li::after {
    left:35px;
}
.tree  li ul li ul li::before{
    left:56px;
}
 .tree  li ul li ul li::after {
    left:56px;top:8px;
}
.tree  li ul li ul li ul li::before{
    left:78px;
}
.tree  li ul li ul li ul li::after {
    left:78px;
}
/*.tree  li ul li ul li ul li ul li::before{
    left:48px;
}
.tree  li ul li ul li ul li ul li::after {
    left:48px;
}*/
.tree li::before {
    border-left:1px dotted #999;
    bottom:50px;
    height:100%;
    top:-34px;
    width:0px
}

.tree li ul li::before{
    top:-5px; border-left:1px dotted #999;
    bottom:50px;
    height:100%;
    width:0px
}
.tree li ul li ul li::before{
    top:-4px;
    width:0px
}
.tree li ul li ul li ul li::before{
    top:-4px;
    width:0px
}
.tree li::after {
    border-top:1px dotted #999;
    height:20px;
    top:8px;
    width:18px
}
.tree li div span {
    display:inline-block;
   padding: 0px 0px 0px 12px;
    text-decoration:none
}

.tree li ul li div span,.tree li ul li ul li div span {
    display:inline-block;
    padding:0px 2px 0px 5px;
    text-decoration:none
}
.tree li div a > span, .tree li ul li div a > span,.tree li ul li ul li div a > span{
    display:inline-block;
   padding:0px 2px 0px 0px;
    text-decoration:none
}
.tree li.parent_li>span {
    cursor:pointer
}
.tree>ul>li::before{
    border:0
}
.tree>ul>li::after {
    /* border: 0; */
    border-top: 1px dotted #999;
    height: 0px;
    top: 8px;
    width: 8px;
}
.tree li:last-child::before {
    height:0px
}

.tree li ul li:last-child::before {
    height:17px
}
.tree li ul li ul li:last-child::before {
    height:17px
}
.tree li ul li ul li ul li:last-child::before {
    height:15px
}
.tree li.parent_li>a{ font-size:14px;padding-right:5px}

.tree .nav li a.active{/* background:#fbf0f1;*/color: #428bca;}

 .nav-primary > .tree > ul.nav > li:hover a, .nav-primary > .tree ul.nav >li a:hover, .nav-primary > .tree ul.nav >li a:focus, .nav-primary > .tree ul.nav >li a:active{
    color: #111;
	background:none !important;

    text-shadow: none; 
}

	.nav-primary .tree >ul.nav > li:hover > a, .nav-primary > .tree ul.nav > li:focus > a, .nav-primary > .tree ul.nav > li.active > a {
    color: #111;
    background-color: inherit;
    background-color: none !important}
	
	/*Progress bar*/
	.ui-progressbar {
		position: relative;
	}
	.progress-label {
		position: absolute;
        left: 45%;
        top: -2px;font-size:10px;
		font-weight: normal;color: #666;
		
	}
.course-menu,.topic-menu, .chapter-menu,.preassessment-menu,.postassessment-menu,.midassessment-menu,.component-menu
{
position: absolute;
left: 0px;
z-index: 1000;
display: none;
float: left;
display: none;
}
.course-menu .menu,.topic-menu .menu, .chapter-menu .menu, .preassessment-menu .menu, .postassessment-menu .menu, .midassessment-menu  .menu ,.component-menu .menu{
position: absolute;
    top: 100%;
    left: 0;
	color:#111;
    z-index: 9999999;
    display: block;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 14px;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}
.course-menu .menu li a,.topic-menu .menu  li a, .chapter-menu .menu li a, .preassessment-menu .menu  li a, .postassessment-menu .menu  li a ,.midassessment-menu  .menu  li a ,.component-menu  .menu  li a{

padding: 5px 15px;display: block;
    padding: 3px 20px;font-size:13px;
    clear: both;
    font-weight: normal;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;}
	
	.course-menu .menu li:hover a.addTreevalue,.topic-menu .menu  li:hover a.addTreevalue, .chapter-menu .menu li:hover a.addTreevalue, .preassessment-menu .menu  li:hover a.addTreevalue, .postassessment-menu .menu  li:hover a.addTreevalue ,.midassessment-menu  .menu  li:hover a.addTreevalue ,.component-menu  .menu  li:hover a.addTreevalue{

      color: #00BAF2;
}
	.course-menu .menu li:hover a.removeTreevalue,.topic-menu .menu  li:hover a.removeTreevalue, .chapter-menu .menu li:hover a.removeTreevalue, .preassessment-menu .menu  li:hover a.removeTreevalue, .postassessment-menu .menu  li:hover a.removeTreevalue,.midassessment-menu  .menu  li:hover a.removeTreevalue,.component-menu  .menu  li:hover a.removeTreevalue,.assessment span.removevalue:hover{

      color: #c14646;
}
	.course-menu .menu li.divider,.topic-menu .menu li.divider, .chapter-menu .menu li.divider, .preassessment-menu .menu li.divider, .postassessment-menu .menu li.divider,.midassessment-menu .menu li.divider,.component-menu  .menu  li.divider{
	height: 1px;
    width: 100%;
    display: block;
    margin: 9px 0;
    overflow: hidden;
    border-bottom: solid thin #E0DDDD;}
.divider2{height: 1px;
    width: 100%;
    display: block;
    margin: 4px 0;
    overflow: hidden;}
/*.loadBg{background-color:rgba(111, 111, 111, 0.39);position: absolute;top:0;left:0;width: 100%;height:100%;overflow:hidden;z-index:9001;-moz-opacity: 0.9;opacity:.90;filter: alpha(opacity=90); display:none;}
.loadImg{position:fixed; top:40%; left:46%;}
.loadText{color:#fff;text-align: center;
font-size: 16px; 
vertical-align: middle;
padding: 27% 20%;
}*/
@keyframes blink {
    /**
     * At the start of the animation the dot
     * has an opacity of .2
     */
    0% {
      opacity: .2;
    }
    /**
     * At 20% the dot is fully visible and
     * then fades out slowly
     */
    20% {
      opacity: 1;
    }
    /**
     * Until it reaches an opacity of .2 and
     * the animation can start again
     */
    100% {
      opacity: .2;
    }
}

.loadText span {
    /**
     * Use the blink animation, which is defined above
     */
    animation-name: blink;
    /**
     * The animation should take 1.4 seconds
     */
    animation-duration: 1.4s;
    /**
     * It will repeat itself forever
     */
    animation-iteration-count: infinite;
    /**
     * This makes sure that the starting style (opacity: .2)
     * of the animation is applied before the animation starts.
     * Otherwise we would see a short flash or would have
     * to set the default styling of the dots to the same
     * as the animation. Same applies for the ending styles.
     */
    animation-fill-mode: both;
}

.loadText span:nth-child(2) {
    /**
     * Starts the animation of the third dot
     * with a delay of .2s, otherwise all dots
     * would animate at the same time
     */
    animation-delay: .2s;
}

.loadText span:nth-child(3) {
    /**
     * Starts the animation of the third dot
     * with a delay of .4s, otherwise all dots
     * would animate at the same time
     */
    animation-delay: .4s;
}
.editComponent{padding: 5px 2px;
    font-size: 11px;
    text-align: left;}
	.editComponent a:hover{color:#ed5565}
/*Scenario popup*/
.quizEdit,.dataEdit, .mediaEdit{display:none;}
.assessment {position:relative;}
.assessmentUpload{display: inline-block;}

assessment .fileValue{border:none;color:#a1aad4;}
.assessment .fileValueDisplay{padding:5px;}
.assessment .fileUpload{opacity:0;position: absolute;height: 28px;
    left: 10px;
    width: 75px;
    top: -2px;cursor:pointer;font-size: 0;}
.assessment .assessmentBtn {/*width: 100%;*/
padding: 5px 10px;
    cursor: pointer;
    margin: 0px 10px;position:relative}

.fileUploadAss{opacity:0;position: absolute;height: 28px;
    left: 0px;
    width: 100%;
    top: -2px;cursor:pointer;font-size: 0;}
	

.scenario .modal-body {
  
    padding: 5px;
}
.scenario .modal-body .newcourse .stepBg {
    border-left: solid thick #00baf2;
    margin-bottom: 10px;
    margin-top: 0px;
}
.scenario > .modal-body > .newcourse {
    padding: 5px 5px;
}
.popupScroll{max-height:345px;overflow-y:auto;margin:0px 0px 0px 0px;} 
.uploadData,.uploadBg,.uploadSrtData,.uploadVttData {position:relative;}
.uploadData .fileUpload{opacity:0;position: absolute;width: 100px;
    height: 30px;left: 0px;top:0px;font-size: 0;cursor:pointer}
.uploadSrtData .fileUpload{opacity:0;position: absolute;width: 100px;
height: 30px;left: 0px;top:0px;font-size: 0;cursor:pointer}
.uploadVttData .fileUpload{opacity:0;position: absolute;width: 100px;
height: 30px;left: 0px;top:0px;font-size: 0;cursor:pointer}

.uploadBg .fileUpload{opacity:0;position: absolute;width: 100%;
    height: 30px;left: 0px;top:0px;font-size: 0;cursor:pointer}
.bold{font-weight:bold;padding-left: 10px;}
.lblname{font-size:11px; color:#999999}
.showFileName{border:none;color:#a1aad4;width:100%;}
.popupScroll .subModelHeading{border:solid thin #EFEFEF;padding:0px 0px 5px 0px;height: 365px;
    overflow: hidden;}
.popupScroll .removeModelBg{background:#ECF9FD;}
.popupScroll a.remove{color:#CC6633;cursor:pointer;padding-right:10px;}

.speedScroll{min-height:160px; height:160px;overflow-y:auto;margin:0px 0px 0px 0px;} 
.speedScroll .subModelHeading{border:solid thin #EFEFEF;padding:0px 0px 5px 0px;
    overflow: hidden;}
.speedScroll .removeModelBg{background:#ECF9FD;}
.speedScroll a.remove{color:#CC6633;cursor:pointer;padding-right:10px;}
.scenario .modal-body .newcourse .form-horizontal .control-label, 
.scenario .modal-body .newcourse .form-horizontal .radio, 
.scenario .modal-body .newcourse .form-horizontal .checkbox, 
.scenario .modal-body .newcourse .form-horizontal .radio-inline,
.scenario .modal-body .newcourse .form-horizontal .checkbox-inline {
    padding-top: 0px;
    margin-top: 0;
    margin-bottom: 0;
}
.modal-bodyEditor .newcourse{padding:0px 0px;}
/*.newcourse .quickeditorBg{ padding:10px 20px 0px 20px;height:240px}*/
//.newcourse .quickeditorBg{ padding:10px 20px 0px 20px;height:auto}
.modal-bodyEditor .newcourse .toparea{padding:0px 20px;}
 .quickeditorControl {
    font-size: 14px;
	height: 30px;
    display: inline-block;
     width: 95%; 
    border: solid 1px #96d4e9;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    -ms-border-radius: 5px;margin:2px;
}
.newcourse .quickeditorBg .list-group-sp .list-group-item {
    background: #fff;
    display: block;
    min-height: 30px;
    height: auto;
    overflow: hidden;padding-top: 5px;
    padding-bottom: 5px; /*cursor: pointer; cursor: hand;*/
	 border: 1px dotted #fff;
	 
}
/*.newcourse .quickeditorBg .list-group-sp .list-group-item:active {
    background:#f5f5f5;
	 border:dotted 1px #96d4e9
}*/
.newcourse .quickeditorBg .list-group-sp .list-group-item img{padding-top: 6px;}
.newcourse .quickeditorBg .list-group-sp .list-group-item .fa-sort{padding-top: 10px;}
.newcourse .quickeditorBg .list-group-sp .list-group-item .fa-ellipsis-v{padding-top: 10px;}
.newcourse .textarea1 {
    text-indent: 0px;
    height: 60px;
    resize: none;
    padding: 8px 10px;
    line-height: 1.23;
}
textarea {
    resize: none;
}
.textarea1 {
    text-indent: 0px;
    height: 60px;
    resize: none;
    padding: 8px 10px;
    line-height: 1.23;
}

/*////assement page////*/
.leftBlueMark{border-left: thick solid #00BAF2;margin-bottom: 10px;}
.addQues .alertify-cover {
    z-index: 9999999;
}
.addQues .alertify {
    z-index: 9999999;
  
}
.rdspan{position: relative;
    top: -2px;
    left: 5px;font-weight:bold;}
	.selectMCQ{font-size:12px;height:20px;border: thin solid #ED5565;}
	.selectMCQNormal {
    font-size: 12px;
    display: inline-block;
    padding: 0px 10px;
    margin-bottom: 2px;
    position: relative;
    bottom: 2px;
}
	/*##############  quiz editor/add question  ####################*/
	.modal-title {
    font-size: 14px;font-weight:bold;
}
.modal-header .qpager{margin:0px 10px;display: inline-block;
padding: 0px 12px;}
	.newcourse .questionType{margin:5px 10px;width:150px;
    display: block;
    border: solid 1px #96d4e9;height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: solid 1px #96d4e9;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;}
	.questionUpload {position:relative; padding: 8px; width: 75px;}
.quesUpload{display: inline-block;}

.questionUpload .fileValue{border:none;color:#a1aad4;}
.questionUpload .fileValueDisplay{padding:5px;}
.questionUpload .fileUpload{opacity:0;position: absolute;
height: 28px;
   left: 10px;
    width: 78px;
    top: 5px;cursor:pointer;font-size: 0;}
	.questionUpload  .uploadBtn {/*width: 100%;*/
/*padding: 5px 10px;*/
    cursor: pointer;
      margin: 10px 0px;}
.newcourse .quickAnswer, .newcourse .quickQuestion{
background:#ebebeb; padding:4px 10px;height:28px;
margin-top:0px;}
.newcourse .quickAnswer label, .newcourse .quickQuestion label{
font-size:13px; font-weight:bold;}
.newcourse .quickAnswer label > span, .newcourse .quickQuestion  label > span{
font-size:11px; font-weight:normal;}
.newcourse .quickAnswer .required, .newcourse .quickQuestion  .required{
font-size:13px; font-weight:bold;}
.newcourse .quickAnswer .sampleLink a{font-size:13px; font-weight:500;cursor:pointer;display:inline-block}
/*Custom Editor*/
 /*#toolbar [data-wysihtml5-action] {
    float: right;
    margin-right: 10px;
  }*/
   .quickQuestion .addBgRight{margin-left:150px}
    .quickQuestion a.addQuestion{padding:2px 1px 2px 1px;}
  .quickQuestion a.addQuestion:hover{background: #D8D8D8;padding:2px 1px 2px 1px;border-radius:0px}
  
.quizProgressUploadBG{display:none;
background-color:#E6E6E6;position:fixed;z-index: 9999999;top:0;left:0;width: 100%;height:100%;-moz-opacity: 0.8;opacity:.80;filter: alpha(opacity=80);
}
.quizProgressUpload{position:relative; top:40%;text-align:center}
 .quizProgressUploadImg{
text-align: center;
}
 .quizProgressUploadBar{
/*background-color:#E6E6E6;*/
/*position:fixed; top: 55%;
left: 48%;*/
color: rgb(17, 17, 17);
}  
.quizProgressUpload .progressBg {display:none;
background-color: #E6E6E6;
/*position: fixed;
top: 55%;
left: 39%;*/
color:#111;text-align: center;
font-size: 16px; 
/*  font-family: Georgia; */
vertical-align: middle;
width: 200px;
    padding-top: 20px;
    margin: 0px auto;
}
.quizProgressUpload .progress {width:200px;
    height: 16px;
    margin-bottom: 16px;
    overflow: hidden;
    background-color: #F5F5F5;
    border-radius: 4px;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1) inset;
}
/*  ############# strat New tenp fill in the Box/Blank ##############*/
 /* Mcg and DND main Div Fill Box and blank*/
  .mcqDnD{background:#fff; overflow: hidden;}
 .mcqDnD .list-group-lg .list-group-item {
    padding-top: 5px;
    padding-bottom: 5px;
}
.paddQuiz{padding:0px 20px;}
.paddQuiz .img-thumbnail {
    display: inline-block;
    max-width: 100%;
     height: 40px;
    padding: 4px;
    line-height: 1.42857143;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
.divDND,.divFillBlank, .divFillBox,.divMCQ{height:268px;}
.mcqDnD .toparea{height: 135px;}
.mcqDnD .textarea70{
    display: block;
	height: 90px;
	text-indent:0px;
	display:inline-block;
	margin-top:15px;
resize: none;
padding: 8px 10px;
width:70%;
}
.mcqDnD .textarea100{
    display: block;
	height: 90px;
	text-indent:0px;
	display:inline-block;
	margin-top:15px;
resize: none;
padding: 8px 10px;
width:100%;
}
.mcqDnD .m-r-sm {display:none;
    margin-right: 10px;
    margin-top: 12px;
}
.mcqDnD .list-group-sp .list-group-item {
    background: #FFF none repeat scroll 0% 0%;
    display: block;
    min-height: 30px;
    height: auto;
    overflow: hidden;
    padding-top: 5px;
    padding-bottom: 5px;
    /*cursor: pointer;*/
    border: 1px dotted #fff;
}

#titleSelect{width:250px;font-weight: bold;}
 .optionalQues{display:inline-block;width:25%;position: absolute;
top: 10px;
/*height: 130px;*/
z-index: 9999999;
right: 41px;}
 .optionalQuesRTranscript{display:inline-block;width:25%;position: absolute;
top: 10px;
/*height: 130px;*/
z-index: 99;
right: 41px;
}
.optionalQues .nav > li > a, .optionalQues .nav > li > a{
    position: relative;
    display: block; font-size: 12px;
    padding: 3px 4px 2px 4px;
}
.quizEditorBg,.whiteBg{background:#fff; overflow: hidden;}
 .quizEditorBg .list-group-lg .list-group-item {
    padding-top: 5px;
    padding-bottom: 5px;
}
.paddQuiz{padding:0px 10px;}
.divDND,.divFillBlank, .divFillBox,.divMCQ,.divEssay,.divRolePlay,.midDiv{/*height:272px;*/ padding:10px 20px 0px 20px;min-height:370px;height:100%;}
.quizEditorBg .toparea{height: 135px;}
.quizEditorBg .textarea70{
    display: block;
	height: 90px;
	text-indent:0px;
	display:inline-block;
	margin-top:15px;
resize: none;
padding: 8px 10px;
width:70%;
}
.quizEditorBg .textarea100{
    display: block;
	height: 90px;
	text-indent:0px;
	display:inline-block;
	margin-top:15px;
resize: none;
padding: 8px 10px;
width:100%;
}
.quizEditorBg .m-r-sm {display:none;
    margin-right: 10px;
    margin-top: 12px;
}
.quizEditorBg .list-group-sp .list-group-item {
    background: #FFF none repeat scroll 0% 0%;
    display: block;
    min-height: 30px;
    height: auto;
    overflow: hidden;
    padding-top: 0px;
    padding-bottom: 5px;
    /*cursor: pointer;*/
    border: 1px dotted #fff;
}
.optionalQues .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    color: #555;
    cursor: default;
	font-weight: 600;
    font-size: 12px;
    background-color: #fff;
    border: 1px solid #ED5565;
	border-bottom:none;;
    border-top: solid 3px #ED5565;
    border-bottom-color: transparent;
	padding: 2px 4px 2px 4px;
}

.optionalQues .tab-content{border:solid thin #ccc;border-top:none;height: 128px;
padding: 2px 10px;}
.optionalQues .nav-tabs > li {
    float: left;
    margin-bottom: -1px;
}
.tab-content.active{display: block;}
.tab-content.hide{display: none;}
.preview{height:90px;margin:5px 0px; border:solid thin #ccc;text-align: center;
padding: 8px 20px;position: relative;text-align: center;}
.preview a{
    width: auto;
    display: block;
    text-align: center;
}
.preview .buttonImg:focus,.preview .buttonAudio:focus,.preview .buttonVideo:focus{border:none;}
.preview .buttonImg:active,.preview .buttonAudio:active,.preview .buttonVideo:active{border:none;}
.preview .buttonImg,.preview .buttonImgSample {
    background: transparent url("../images/ImageUpload.png") no-repeat scroll 0% 0%;
    width: 60px;
    height: 50px;
    border: none;
	display:block;  
	margin: 0px 50px;
}
.preview .buttonAudio,.buttonAudioSample {
    background: transparent url("../images/AudioUpload.png") no-repeat scroll 0% 0%;
    width: 60px;
    height: 50px;
    border: none;
	display:block;  
	margin: 0px 50px;
}
.preview .buttonVideo,.buttonVideoSample {
    background: transparent url("../images/VideoUpload.png") no-repeat scroll 0% 0%;
    width: 60px;
    height: 50px;
    border: none;
	display:block;  
	margin: 0px 50px;
}
.preview .buttonSrt,.buttonVtt {
    width: 90px;
    height: 33px;
    border: none;
    display: block;
    margin: 13px 75px;
}
.viewImg,.viewImgSample{width: 120px;display:none;
height: 70px;
position: absolute;
top: 8px;
left: 40px;}
 .viewAudio,.viewAudioSample{display:none; background: transparent url("../images/playIcon.png") no-repeat scroll 0% 0%;
    width: 60px;
    height: 60px;
position: absolute;
top: 18px;
left: 70px; cursor:pointer}





.pauseAudio{ background: transparent url("../images/pauseIcon.png") no-repeat scroll 0% 0%;
    width: 60px;
    height: 60px;
position: absolute;
top: 18px;
left: 70px; cursor:pointer}
.playAudio{background: transparent url("../images/playIcon.png") no-repeat scroll 0% 0%;
    width: 60px;
    height: 60px;
position: absolute;
top: 18px;
left: 70px; cursor:pointer}
.viewVideo,.viewVideoSample{width: 220px; display: none;
height: 75px;
position: absolute;
top: 6px;
left: -10px; cursor:pointer}
.viewVideoDiv,.viewVideoDivSample{width: 140px;
    height: 75px;
    position: absolute;
       top: 0px;
    left: 45px;
    cursor: pointer;}
.zoomContainer > video{ cursor:pointer}
.disableLink{pointer-events: none;
cursor: pointer; color:#ccc}
.previewFooter ul{margin-bottom: 0px;width:100%;padding: 0px 50px;}
.previewFooter ul li{ display:inline; width: 200px;
padding: 0px 10px;}
.previewFooter .btn{ padding:1px 4px;border:solid thin #ccc;color:#666}
.previewFooter .btn:hover{ color:#111}

.previewFooter .btn:active{ color:#666}
 .bottomSection{padding: 0px 20px;}


.divFillBlank .form-control,.divFillBox .form-control{
font-size: 14px;
display: block;
width: 100%;
border: 1px solid #96D4E9;
border-radius: 5px;}
.divFillBox .inputWithRadio {
    font-size: 14px;
    height: 34px;
    display: inline-block;
    width: 85%;
    border: 1px solid #96D4E9;
    border-radius: 5px;
    margin: 2px;
}
.quickeditorBg .inputWithRadio {
    font-size: 14px;
    height: 34px;
    display: inline-block;
    width: 85%;
    border: 1px solid #96D4E9;
    border-radius: 5px;
    margin: 2px;
}
.divFillBlank .quickAnswer, .divFillBox .quickAnswer {
    background: #EBEBEB none repeat scroll 0% 0%;
    padding: 4px 10px;
    height: 28px;
}
.fillBoxBg{border:solid thin #EBEBEB; padding:5px 0px}

/*  ############# end New tenp fill in the Box/Blank ##############*/


  #toolbar{background:#E4E6E6;}
  #toolbar,
  .editor textarea {
    width: 100%;
    padding: 5px;
  }
  
  .editor textarea {
    height: 50px;
    border: 1px solid #b6b6b6;border-top:none;
    box-sizing: boder-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    font-family: Verdana;
    font-size: 11px;
  }
  
  .editor textarea:focus {
    color: black;
    border: 2px solid black;
  }
  
  .wysihtml5-command-active {
    font-weight: bold;
  }

          /* ############### Date time Picker  ###################*/        

.input-append .add-on, .input-prepend .add-on {
    display: inline-block;
    width: auto;
    height: 20px;
    min-width: 16px;
    padding: 4px 5px;
    font-size: 14px;
    font-weight: normal;
    line-height: 20px;
    text-align: center;
    text-shadow: 0 1px 0 #ffffff;
    
   
}

.date .input-group-addon,.timepicker .input-group-addon {
   padding: 6px 25px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1;
    color:#FF0000;
    text-align: center;
    background:none;;
    border: none;
    border-radius: 4px;
	cursor:pointer;
}

.date .input-group-addon,.timepicker .input-group-addon, .date .calendarBg, .timepicker .calendarBg{
display: inline; float: right;position: relative;
top: -34px;
    right: 0px;
    z-index: 999;
}
.date .input-group-addon,.timepicker .input-group-addon .fa, .date .calendarBg .fa,.timepicker .calendarBg .fa{
color:#FF0000;font-size:20px;
}






@media (max-width:1200px){.tablegrid .table > tbody > tr > td:first-child {
    padding: 12px 5px 5px 19px;
}
.tablegrid .table > thead > tr > th:first-child {
    padding: 8px 5px 10px 19px;
}
}


.scenario .modal-body {
  
    padding: 5px;
}
.scenario .modal-body .newcourse .stepBg {
    border-left: solid thick #00baf2;
    margin-bottom: 10px;
    margin-top: 0px;
}
.scenario .modal-body .newcourse {
    padding: 5px 5px;
}
.popupScroll{max-height:345px;overflow-y:auto;margin:0px 0px 0px 0px;} 
.uploadData {position:relative;}
.uploadData .fileUpload{opacity:0;position: absolute;width: 100px;
    height: 30px;left: 0px;top:0px;cursor:pointer}
	.uploadData  input[type="file"]{cursor:pointer}
	.uploadData .btn{cursor:pointer}
	
.uploadDataSrt .fileUpload {
    opacity: 0;
    position: absolute;
    width: 100px;
    height: 30px;
    left: 0px;
    top: 240px;
    cursor: pointer;
}
	
.uploadDataSrt input[type="file"] {
    cursor: pointer;
}	
.uploadDataVtt .fileUpload {
    opacity: 0;
    position: absolute;
    width: 100px;
    height: 30px;
    left: 0px;
    top: 316px;
    cursor: pointer;
}
	
.uploadDataVtt input[type="file"] {
    cursor: pointer;
}	
.bold{font-weight:bold;padding-left: 10px;}
.lblname{font-size:11px; color:#999999}
.popupScroll .subModelHeading{border:solid thin #EFEFEF;padding:0px 0px 5px 0px;height: auto;
    overflow: hidden;}
.popupScroll .removeModelBg{background:#ECF9FD;}
.popupScroll a.remove{color:#CC6633;cursor:pointer;padding-right:10px;}
.scenario .modal-body .newcourse .form-horizontal .control-label, 
.scenario .modal-body .newcourse .form-horizontal .radio, 
.scenario .modal-body .newcourse .form-horizontal .checkbox, 
.scenario .modal-body .newcourse .form-horizontal .radio-inline,
.scenario .modal-body .newcourse .form-horizontal .checkbox-inline {
    padding-top: 0px;
    margin-top: 0;
    margin-bottom: 0;
}
.lblmandotary{font-size:10px;}
/*Custom Editor*/
 /*#toolbar [data-wysihtml5-action] {
    float: right;
    margin-right: 10px;
  }*/
  #toolbar{background:#E4E6E6;}
  #toolbar,
  .editor textarea {
    width: 100%;
    padding: 5px;
  }
  
  .editor textarea {
    height: 50px;
    border: 1px solid #b6b6b6;
	border-top:none;
    box-sizing: boder-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    font-family: Verdana;
    font-size: 11px;
  }
  
  .editor textarea:focus {
    color: black;
    border: 2px solid black;
  }
  
  .wysihtml5-command-active {
    font-weight: bold;
  }
/*audio::-webkit-media-controls-timeline, video::-webkit-media-controls-timeline {
    -webkit-appearance: media-slider;
    display: flex;
    flex: 1 1 auto;
    height: 3px;
    margin: 0px 5px 0px 0px;
    padding: 0px;
    background-color: transparent;
    min-width: 25px;
    border: initial;
    color: inherit;
}*/
@media (max-width:1200px){.tablegrid .table > tbody > tr > td:first-child {
    padding: 12px 5px 5px 19px;
}
.tablegrid .table > thead > tr > th:first-child {
    padding: 8px 5px 10px 19px;
}}

@media (max-width: 768px) and @media (max-width: 980px){.tablegrid .search {
    padding-top: 2px;
    text-align: right;
    padding-left: 2px;
	
}	.tablegrid .table > tbody > tr > td:first-child {
    padding: 12px 5px 5px 19px;
}
.tablegrid .table > thead > tr > th:first-child {
    padding: 8px 5px 10px 12px;
}

}
@media (max-width: 767px){
.nav-off-screen {
    position: absolute;
    left: 0;
    top: 45px;z-index:999;}
.aside-x1 {
    width: 250px;
  }
.tree { padding: 20px 0px 0px 0px;  
     height: auto;
    overflow-y: hidden;
 
}
	.tablegrid .table > tbody > tr > td:first-child {
    padding: 12px 5px 5px 29px;
}


.tablegrid .table > thead > tr > th:first-child {
    padding: 8px 5px 10px 32px;
}
.tablegrid .search {
    padding-top: 2px;
    text-align: right;
    padding-left: 2px;
}

.rightContent{  margin-top: 15px;}
.padder{margin-bottom: 10px;}
	.newcourse .stepBg {
    border-left: solid thick #00baf2;
    margin-bottom: 20px;
    margin-top: 15px;
}
	.modal-dialog {
    position: relative;
    width: auto;
    top: 50px;
}

.tablegrid .panel-footer ul.pagination a {  
    padding: 4px 3px;font-size:12px;font-weight:normal;
   
	}
	.logoname{display:inline-block}
.logoname, #headerLogo{display:inline-block}
.btn-link {
    color: #717171;    float: right;
    margin-top: 10px;
}
.rightHead .thumBg {
    padding: 40px 20px 10px 20px;
    color: #2D2D2D;
}
	}
	@media (max-width: 420px){.tablegrid .search .searchbtn {
	position:relative;height:25px;width:80px}
.tablegrid  .search .btn-reset{
padding: 5px 8px;
display: block;

margin-top: 5px;}
.pipeline {
    margin: 0px 20px;
    display: none;;
}
.logoname{display:block}
.logoname, #headerLogo{display:block}
.btn-link {
    color: #717171;    float: right;
    margin-top: 10px;
}
.rightHead .thumBg {
    padding: 60px 20px 10px 30px;
    color: #2D2D2D;
}
}
	@media (max-width: 359px){
	.logoname, #headerLogo{display:block}
	nav-off-screen {
    position: absolute;
    left: 0px;
    top: 75px;
    z-index: 999;
}

.tablegrid .search .searchbtn {position:relative;height:25px;width:80px}
.tablegrid  .search .btn-reset{
padding: 5px 8px;
display: block;

margin-top: 5px;}
.rightContent {
    margin-top: 35px;
}
.logoname, #headerLogo{display:inline-block}
.btn-link {
    color: #717171;    float: right;
    margin-top: 10px;
}
.rightHead .thumBg {
    padding: 40px 20px 10px 20px;
    color: #2D2D2D;
}
	}
	
	
	/*   overviewBg  */
.overviewBg{padding:20px;height: 482px;
overflow-y: auto;}
.overviewBg p{padding-bottom:10px;}
.overviewBg .overviewComponent{overflow:hidden;}
.overviewBg .overviewComponent .topContainer{}
.overviewBg .overviewComponent .topContainer .topSection{padding: 20px 10px;height: auto;
overflow: hidden;}
.overviewBg .overviewComponent .topContainer .topSection div{display:block;height: 90px;width:580px;}
.overviewBg .overviewComponent .topContainer .topSection div .line{position: relative;
top: 0px;
left: 15px;float:left}
.overviewBg .overviewComponent .topContainer .topSection div .dot{color:rgb(204, 204, 204);color: #CCC;
font-size: 9px;
padding-left: 16px;
padding-top: 5px;float:left}

.overviewBg .overviewComponent .topContainer .topSection div.second{ padding-left:30px;}
.overviewBg .overviewComponent .topContainer .topSection div.second .dot{ padding-left: 16px;padding-top: 5px;}
.overviewBg .overviewComponent .topContainer .topSection div .content{
padding: 0px;}
.overviewBg .overviewComponent .topContainer .topSection div .spanIcon{ 
border: 2px solid #F90;
border-radius: 100px;
height: 50px;
width: 50px;
padding: 16px 16px;
float: left;
position: relative;
top: -15px;}
.overviewBg .overviewComponent .topContainer .topSection div .spanIcon .fa{ color:#FF9900;font-size:18px;}

.overviewBg .overviewComponent .bottomSection{padding:5px 30px 10px 30px; border-right:}
.overviewBg .overviewComponent .bottomSection .spanIconBg{overflow:hidden;
height: 75px;padding: 5px 0px;} 
.overviewBg .overviewComponent .bottomSection .spanIcon{
    position: relative;
    top: 6px;
}
.overviewBg .overviewComponent .bottomSection .spanIcon i.fa{ color:#39C; font-size:60px;} 
.overviewBg .overviewComponent .bottomSection .rContent{position: relative; }
.overviewBg .overviewComponent .bottomSection .rContent .no{color:#39C;font-weight:bold;}
/*#overviewModel .modal-header .close {
   .closebg {
    font-size: 11px;
    border-radius: 100px;
    color: #FFF;
    padding: 5px 6px;
    background: #438B9E;
    position: absolute;
    right: -10px;
    top: -20px;
    text-shadow: none;
}
.modal-header .close:hover{ background: #438B9E;color:#111}*/
.modal-header .closebg {
    font-size: 11px;
    border-radius: 100px;
    color: #FFF;
    padding: 5px 6px;
    background: #438B9E;
    position: absolute;
    right: -10px;
    top: -20px;
    text-shadow: none;
}
.modal-header .close {
    margin-top: 8px;
}


/*   profile  */
.profile{height:90px;margin:5px 0px; border:solid thin #ccc;text-align: center;
padding: 8px 20px;position: relative;text-align: center;}
.profile a{
    width: auto;
    display: block;
    text-align: center;
}
.profile .buttonImg:focus{border:none;}
.profile .buttonImg:active{border:none;}
.profile .buttonImg {
    background: transparent url("../images/ImageUpload.png") no-repeat scroll 0% 0%;
    width: 60px;
    height: 50px;
    border: none;
	display:block;  
	margin: 0px 50px;
}


.viewImgProfile{display: inline-block;
max-width: 100%;
height: 60px;
padding: 4px;
line-height: 1.42857143;
background-color: #fff;
border: 1px solid #ddd;
border-radius: 4px;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
width:60px;
}

.selectDashboard{display:inline-block;width:200px;border-radius:4px;height: 27px !important;
top: 3px;
position: relative;
margin-right: 5px;}
.inline{display:inline-block}
.chIltBtnDiv .activeTabWork {

    background: #119640;
    height: 25px;
    padding: 3px 12px;
border-radius: 5px 5px 0px 0px;
}
.chIltBtnDiv .activeTabWork:hover,.chIltBtnDiv .activeTabWork:active {

    background: #119640;
    

}
.chIltBtnDiv .activeDeafult {
border-radius: 5px 5px 0px 0px;
    background: #98aeb5;
    height: 25px;
    padding: 3px 12px;

}.chIltBtnDiv .activeDeafult:hover, .chIltBtnDiv .activeDeafult:active{

    background: #98aeb5;
  

}
.popupScroll{max-height:345px;overflow-y:auto;margin:0px 0px 0px 0px;} 

.popupScroll .subModelHeadingSpeaking{border:solid thin #EFEFEF;padding:0px 0px 5px 0px;height: 120px;
    overflow: hidden;}
.popupScroll  .removeModelBgSp{background:#ECF9FD;}
.popupScroll .removeModelBgSp a.remove{color:#CC6633;cursor:pointer;padding-right:10px;}

/* #############################  19/5/2016 ################################ */

.disableRow{background: #f5f5f5;cursor:default}
  .tablegrid .table > tbody > tr.disableRow > td:first-child, .tablegrid .table > tbody > tr.disableRow > td {
  color: #8c8c8c; cursor: default !important;
}
  .deleteRow{color: #8c8c8c;cursor:default}
  
  .loginBg {    width: 60%;
  border-top: 2px solid rgb(255, 117, 55);
      background: rgba(255, 255, 255, 0.91) none repeat scroll 0% 0%;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}


select:focus, option:focus, select::-moz-focus-inner, option::-moz-focus-inner {
    outline: none;
    border: none;
}
radio:focus,radio::-moz-focus-inner{  outline: none;
    border: none;}

button::-moz-focus-inner {
  border: 0; outline: none;
}
/*for FireFox*/
    input[type="submit"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner
    {   
        border : 0px;
    } 
/*for IE8 */
    input[type="submit"]:focus, input[type="button"]:focus
    {     
        outline : none; 
    }
	input:focus, textarea:focus, button:focus ,a:focus {
    outline: none !important;
}
panel {
    margin-bottom: 0px;
  -webkit-box-shadow: 0px 6px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 6px 5px 0px rgba(0,0,0,0.75);
box-shadow: 0px 6px 5px 0px rgba(0,0,0,0.75);
}


/*############12/8/2016 ##################*/
@media (min-width: 768px){
	.app .vbox > footer {
		position: relative;bottom:0px;width:100%
	}
	.navbar-nav > li {
		float: right;
		text-align: right;
    }
}
html {
    background-color: #d8dce3;
    overflow-x: hidden;
}
.vTop{vertical-align:top;}
@media (min-width: 1200px){
.app, .app body {
   background-color: #d8dce3;
    width: 100%;
    height: 100%;
}
.navbar-nav.navbar-right:last-child {
		margin-right: 0px;
	
	}
}
@media (max-width: 1200px){
	.navbar-nav.navbar-right:last-child {
		margin-right: 0px;
	
	}
}

.divRolePlay .rolePlayBG{
    height: 290px;
overflow-y: auto;}
/* ##################  12/9/2019 add/edit quiz with rubrics ################## */
.leftScroll{min-height:270px;height: 300px;
    overflow-y: auto;width:60%;float:left;}
.quizLeft,.assNotLeft,.feedbgBg{width:60%;float:left;display:inline-block}
.rubricsSection{width: 40%;
    float: right;
   position: absolute;
    bottom: 0px;
    right: 10px; }
.rubricsSection .multipleCheckboxBg{min-height: 218px;height:220px;}
.rubricsSection .multipleCheckboxBg .multiCheckbox{min-height: 60px;   }
.rubricsSection .multipleCheckboxBg .btn{/*display:none;*/visibility:hidden;position:absolute;top: -25px;}

	  
span.multiselect-native-select{position:relative}
span.multiselect-native-select select{border:0!important;clip:rect(0 0 0 0)!important;height:1px!important;margin:-1px -1px -1px -3px!important;overflow:hidden!important;padding:0!important;position:absolute!important;width:1px!important;left:40%;top:30px}
.multiselect-container{position:relative;list-style-type:none;margin:0;padding:0}
.multiselect-container .input-group{margin:5px}
.multiselect-container>li{padding:0}
.multiselect-container>li.multiselect-group-all>a.multiselect-all label{font-weight:700;}
.multiselect-container>li.multiselect-group label{margin:0;padding:3px 10px 3px 10px;height:100%;font-weight:700}
.multiselect-container>li.multiselect-group label{margin:0;padding:3px 10px 3px 10px;height:100%;font-weight:700}
.multiselect-container>li.multiselect-group ul{margin:0;padding:3px 10px 3px 10px;list-style-type:none;}
.multiselect-container>li.multiselect-group-clickable label{cursor:pointer}
.multiselect-container>li>a{padding:0}
.multiselect-container>li>a>label{margin:0;height:100%;cursor:pointer;font-weight:400;padding:3px 20px 3px 40px}
.multiselect-container>li>a>label.radio,.multiselect-container>li>a>label.checkbox{margin:0}
.multiselect-container>li>a>label>input[type=checkbox]{margin-bottom:5px}
.btn-group>.btn-group:nth-child(2)>.multiselect.btn{border-top-left-radius:4px;border-bottom-left-radius:4px}
.form-inline .multiselect-container label.checkbox,.form-inline .multiselect-container label.radio{padding:3px 20px 3px 40px}
.form-inline .multiselect-container li a label.checkbox input[type=checkbox],
.form-inline .multiselect-container li a label.radio input[type=radio]{margin-left:-20px;margin-right:0}
.rubricsSection .multipleCheckboxBg .multiselect-container >li > a.multiselect-all >label.checkbox ,
.rubricsSection .multiselect-container>li.multiselect-group-all > a.multiselect-all >label.checkbox{left: 15px!important;    padding: 3px 10px 3px 20px;}
.rubricsSection .multipleCheckboxBg .multiselect-container >li > a >label.checkbox {left: 15px!important;    padding: 3px 10px 3px 20px;font-weight: normal;}

.rubricsSection .multiselect-container>li.multiselect-group ul li > a >label.checkbox {
    left: 15px!important;
    padding: 3px 10px 3px 30px;
font-weight: normal;}
 .rubricsSection .multipleCheckboxBg  .dropdown-menu {
    position: relative;
    top: 0px;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 220px;
    width: 100%;
	min-height: 218px;
	height:218px;
	max-height:100%;
    overflow-y: auto;
	 overflow-x: hidden;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 14px;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}


.loginBody .navbar-header{height : 85px; outline-bottom : #ffffff solid 10;margin-top: 15px;}



/*evaluate marks page/window section*/

.addMark .modal-header,.addMark .modal-footer {
	height:35px;
    padding: 0px 15px;
    background: #c3f0fc;
    border-radius: 2px 2px 0px 0px;
	color:#111;
}
.addMark .modal-header{
	height:35px;
    line-height:30px;
   
}
.addMark .modal-header .modal-title {
    font-size: 14px;
    line-height: 32px;
    font-weight: bold;color:#111;
}
   .addMark .modal-footer { margin-top: 0px;}
  .modal-bodyEvaluator {
    min-height: 535px;
    height:  535px;
    overflow-y: auto;
}
.modal-bodyEvaluator .newcourse .toparea {
    padding: 0px 10px;    height: 100px;
}
.modal-bodyEvaluator  .Ques { padding:20px 20px;color:#111;font-weight:bold;vertical-align:top}
.modal-bodyEvaluator  .Ques .qCount{vertical-align:top;color:#111;font-weight:bold;}
.modal-bodyEvaluator  .Ques .question_stem{padding:0px 10px; color:#111;font-weight:bold;  width: 70%;vertical-align:top}

.modal-bodyEvaluator .newcourse .quickAnswer, .modal-bodyEvaluator .newcourse .quickQuestion {
    background: #ebebeb;
    padding: 4px 10px;
    height: 20px;
    margin-top: 0px;color:#111;
}
.modal-bodyEvaluator .newcourse .seprater{
  background: #bfbfbf;
    height: 1px;

}
.modal-bodyEvaluator .optionalQues {
    display: inline-block;
    width:120px;
    /* position: absolute;
    top: -20px;*/
     height: 100px;
    z-index: 1;
    right: 0px;
}
.modal-bodyEvaluator .optionalQues small{
   color:#9e9a9a;
}
.modal-bodyEvaluator .optionQuesImage {
   z-index: 1;
}
.modal-bodyEvaluator .optionalQuesVideo {
   
    z-index: 1;
   
}
.modal-bodyEvaluator .optionQuesZindex {
   z-index: 5;
}
.modal-bodyEvaluator .optionalQues .nav-tabs > li {
    float: left;
    margin-bottom: -4px;
}
.modal-bodyEvaluator .optionalQues .nav > li > a,.modal-bodyEvaluator .optionalQues .nav > li > a:hover {
    position: relative;
    display: block;
    font-size: 12px;
    padding: 3px 4px 2px 4px;
}

.modal-bodyEvaluator .optionalQues .nav-tabs > li.active > a, .modal-bodyEvaluator .nav-tabs > li.active > a:hover, .modal-bodyEvaluator .nav-tabs > li.active > a:focus {
    color: #555;
    cursor: default;
    font-weight: 600;
    font-size: 12px;
    background-color: #fff;
    border: 1px solid #ED5565;
    border-bottom: none;
    border-top: solid 3px #ED5565;
    border-bottom-color: transparent;
    padding: 1px 4px 0px 4px;
}

.modal-bodyEvaluator .optionalQues .tab-content{
 border:none;border-top:none;height: 90px;
 padding: 0px 0px;}
.modal-bodyEvaluator .optionalQues .tab-content .preview {
    height: 80px;
    margin: 0px 0px;
    border: solid thin #ccc;
    text-align: center;
    padding: 5px 10px;
    position: relative;
    text-align: center;
}
.modal-bodyEvaluator .optionalQues .tab-content .preview .imageShow {
   
   width: 100px;
    height: 68px;
    position: relative;
    top: 0px;
    text-align:center;margin:0px auto;
    cursor: pointer;
}
.modal-bodyEvaluator .optionalQues .tab-content .preview .popupImg .popup-innerImg{

    min-width: 680px;
    max-width: 680px;
    width: auto;
    padding: 0px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    box-shadow: 0px 2px 6px rgba(0,0,0,1);
    border-radius: 3px;
    background: #111;
    border: solid 12px #000;
    cursor: default;

}

.modal-bodyEvaluator .optionalQues .tab-content .preview .popupImg .popup-innerImg img {
    height: 320px;
    cursor: default;
	width:100%;
}
.modal-bodyEvaluator .optionalQues .tab-content .preview .popupImg {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    display: none;
    z-index: 9999999;
    background: rgba(0, 0, 0 , .3);
}

.modal-bodyEvaluator .optionalQues .tab-content .preview .popupImg .popup-innerImg  .popup-closeImg {
    padding: 0px 2px;
    display: inline-block;
    position: absolute;
    top: -15px;
    right: -15px;
    transition: ease 0.25s all;
    -webkit-transform: translate(50%, -50%);
    transform: translate(50%, -50%);
    border-radius: 1000px;
    background: rgb(37, 131, 191) none repeat scroll 0% 0%;
    font-family: Arial, Sans-Serif;
    font-size: 18px;
    text-align: center;
    line-height: 100%;
    color: #fff;
}
.modal-bodyEvaluator .optionalQues .tab-content .preview  .popup-closeImg .fa-close {
    font-size: 18px;
    color: rgb(255, 255, 255);
    padding: 2px;
}

.modal-bodyEvaluator .optionalQues .tab-content .preview .roleplayAudio {
    background: transparent url(../images/playIcon.png) no-repeat scroll 0% 0%;
   width: 60px;
    height: 60px;
    position: relative;
    top: 3px;
    text-align:center;margin:0px auto;
    cursor: pointer;
}
.modal-bodyEvaluator .optionalQues .tab-content .preview .roleplayPauseAudio {
    background: transparent url(../images/pauseIcon.png) no-repeat scroll 0% 0%;
   width: 60px;
    height: 60px;
    position: relative;
    top: 3px;
    text-align:center;margin:0px auto;
    cursor: pointer;
}.modal-bodyEvaluator .optionalQues .tab-content .preview .roleplayVideo {

    height: 60px;
    position: relative;
    top: 3px;
    text-align:center;margin:0px auto;
    cursor: pointer;
}
.modal-bodyEvaluator .optionalQues .tab-content .preview .roleplayPlayPauseVideo {
   width: 100%;
    height: 100%;
    position: absolute;

    text-align:center;margin:0px auto;
    cursor: pointer;
}
.modal-bodyEvaluator .optionalQues .tab-content .preview .roleplayPlayPauseVideo img {
   width: 60px;
    height:60px;
   position:relative;
   top:2px;
}

.modal-bodyEvaluator .optionalQues .tab-content .preview .roleplayVideo video{
   
   width: auto;
    height: 60px;
    position: relative;
    top: 0px;
    text-align:center;margin:0px auto;
    cursor: pointer;
}
.modal-bodyEvaluator .tab-content.active{display: block;}
.tab-content.hide{display: none;}
.modal-bodyEvaluator .newcourse {
    padding: 5px 5px;
}

.evaluatedivDND,.evaluatedivFillBlank, .evaluatedivFillBox,.evaluatedivMCQ,.evaluatedivEssay,.evaluatedivRolePlay,.evaluatemidDiv{padding:5px 10px 0px 5px;height:100%;}
.evaluateEditorBg {
    background: #fff;
    overflow: hidden;
	padding:0px 0px 0px 0px;
	height: auto;
    min-height: 180px;
}
.evaluateEditorBg  .question_stem{padding-left:0px !important}
.evaluateEditorBg  .table-bordered {
    border: 1px solid #ccc;    margin-bottom: 10px;
    margin-top: 10px;
}
.evaluateEditorBg  .rubricsMarksReport{  margin-top: 0px!important;  margin-bottom: 0px!important;}
.evaluateEditorBg  .table-bordered tr {
    color:#111;
}
.table-danger, .table-danger > td, .table-danger > th {
    background-color: #fbe5d6;color:#111;
}
.table-blue, .table-blue > td, .table-blue > th {
    background:#145C9A;color:#ffffff;
}

.table-gray, .table-gray > td, .table-gray > th {
    background:#ddd;color:#111;
}
.evaluateEditorBg .rubricsMarksReport th.width120{width:120px;}
.evaluateEditorBg .rubricsMarksReport td.width100{width:100px;}
.evaluateEditorBg .questList,.evaluateEditorBg  .fillAns,.evaluateEditorBg  .fillBox{min-height:120px;height:auto;overflow:hidden;margin-bottom:0px}
.evaluateEditorBg  .essayAns{min-height:120px;line-height:100px;height:auto;overflow:hidden;margin-bottom:0px}
.evaluateEditorBg .audioVideo{min-height:80px;height:auto;overflow:hidden;}
.evaluateEditorBg .questList{ list-style:decimal}
.evaluateEditorBg .questList li {
	line-height: 18px;
    padding: 5px;
    /* margin-bottom: 20px; */
    font-size: 14px;
    color: #111;
    font-weight: 500;
}
 .evaluateEditorBg .fillBoxBgDiv{height:100px;line-height: 16px;}
 .evaluateEditorBg .item{ padding: 0px 5px;margin:10px 0px 2px 0px;  color:#9e9a9a;}
 .evaluateEditorBg .fillBoxBg{ 
 /* border: solid thin #EBEBEB; */
    padding: 5px 4px;
	 font-size: 14px;
    color: #111;
    font-weight: 500;
	margin:2px 2px;
	width:110px;display:inline-block;
	}

.evaluateEditorBg  .fillAns,
.evaluateEditorBg  .essaylAns{  padding: 0px 0px;
    /* margin-bottom: 20px; */
    font-size: 14px;
    color: #111;
    font-weight: 500;}
	.evaluateEditorBg  .fillAns small{ color:#9e9a9a;}
.evaluateEditorBg .ans,.evaluateEditorBg .competency { padding: 0px 15px;}
.evaluateEditorBg .ans .correct {
    /* margin-bottom: 20px; */
    font-size: 14px;
    color:#276d14;
    
}
.evaluateEditorBg .ans .wrong {
    /* margin-bottom: 20px; */
    font-size: 14px;
    color: #ad0c0c;
   
}

.evaluateEditorBg .relative{  }
.evaluateEditorBg .audioVideo {padding: 0px 0px;}
.evaluateEditorBg .audioVideo .mediaQutstionBg{  height: 100px;width:120px;
    padding: 2px 0px;
 margin:0px auto;}
.evaluateEditorBg .audioVideo .mediaQutstionBg small{ text-align:left; color:#9e9a9a;}
.evaluateEditorBg .audioVideo .mediaBgDiv {
    border: solid thin #ccc;
    height: 80px;width:120px;
    padding: 2px 0px;
    margin:0px auto;
}
.evaluateEditorBg .audioVideo .mediaBgDiv .mediaNot{ height: 80px;width:120px;}
.evaluateEditorBg .audioVideo .mediaBgDiv .roleplayPlayAudio {
    background: transparent url(../images/playIcon.png) no-repeat scroll 0% 0%;
   width: 60px;
    height: 60px;
    position: relative;
    top:6px;
    text-align:center;margin:0px auto;
    cursor: pointer;
}
.evaluateEditorBg .audioVideo .mediaBgDiv .roleplayPlayAudio {
    background: transparent url(../images/playIcon.png) no-repeat scroll 0% 0%;
   width: 60px;
    height: 60px;
    position: relative;
    top: 6px;
    text-align:center;margin:0px auto;
    cursor: pointer;
}
.evaluateEditorBg .audioVideo .mediaBgDiv .roleplayPauseAudio {
    background: transparent url(../images/pauseIcon.png) no-repeat scroll 0% 0%;
   width: 60px;
    height: 60px;
    position: relative;
    top: 6px;
    text-align:center;margin:0px auto;
    cursor: pointer;
}
.evaluateEditorBg .audioVideo .mediaBgDiv .roleplayPlayPauseVideo {
    width: 100%;
    height: 100%;
    position: absolute;
    margin: 0px auto;
    cursor: pointer;
    z-index: 99;
}
.evaluateEditorBg .audioVideo .mediaBgDiv .roleplayPlayPauseVideo img{
   width: 60px;
    height: 60px;
   top: 5px;
    position: relative; 
}

.evaluateEditorBg .audioVideo .mediaBgDiv .roleplayVideo {
    height: 80px;
    position: relative;
    top: 0px;
    text-align:center;margin:0px auto;
    cursor: pointer;
}
.evaluateEditorBg .audioVideo .mediaBgDiv  .roleplayVideo video{
   
   width: auto;
    height: 60px;
    position: relative;
    top: 5px;
    text-align:center;margin:0px auto;
    cursor: pointer;
}

 .evaluateEditorBg .table .table-gray > td{   background:#ddd;
   }

 .evaluateEditorBg  .table-gray,  .evaluateEditorBg  .table-gray > td,  .evaluateEditorBg  .table-gray > th {
    background:#ddd;color:#111;
}


.evaluateReport{background:#fff;padding: 5px;}


.evaluateReport .panel {
    margin-bottom: 0px;
    background-color: #fff;
    border: 1px solid transparent;
     border-radius: 2px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}

.evaluateReport .panel .table-gray, .evaluateReport .panel .table-blue > td, .evaluateReport .panel .table-blue > th {
    background: #145C9A;
    color: #ffffff!important;
}

.evaluateReport .panel .panel-heading{    padding: 2px 15px;}
.evaluateReport  .panel > .table, .panel > .table-responsive > .table {
    margin-bottom: 0px;color:#111;
}

.evaluateReport .panel .table td, .evaluateReport .panel .table th {
    padding: 6px 15px;
    border-bottom: 1px solid #f1f1f1;color:#111
}

.evaluateReport .panel  .imgProfile{ 
	height: 100px;
    width: 100px;
    border-radius: 100px;
    border: solid thin #ccc;
}

.evaluateReport .panel  .panel-body .table .table-blue  td,.evaluateReport .panel .table-blue{   background: #145C9A;
    color: #ffffff!important;}
		
.evaluateReport .panel  .panel-body .table .table-orange  td {background: rgba(209, 51, 68, 0.25);}
	
.app .vbox > footer {
   
    height: 35px;
}


.col-centered , .col-center-block{
    float: none;
    margin: 0 auto;
}
@media only print {
   #printableArea {
     width: auto;
     height: auto;
     overflow: visible;
   }
   #printBtn{display:none;}
}

/* #############################  18/8/2016 ################################ */
.paddLeft0{padding-left:0px}
.paddRight0{padding-right:0px}
.padd0{padding:0px}
.addColor{ color: #00BAF2;}
.remove, .delete{  color: #c14646;}
.textarea60{text-indent:0px;
    height: 60px!important;
	resize:none;
 padding: 2px 5px;
    line-height: 1.23;
}
.textarea100{text-indent:0px;
    height: 100px!important;
	resize:none;
 padding: 2px 5px;
    line-height: 1.23;
}

video::-internal-media-controls-overflow-button, audio::-internal-media-controls-overflow-button {
    -webkit-appearance: -internal-media-overflow-button;
    display: none!important;
    box-sizing: border-box;
    width: 32px;
    height: 32px;
    margin-left: 0px;
    margin-right: 0px;
    background-color: initial;
    color: inherit;
    flex: 0 0 auto;
    padding: 0px;
    border-width: 0px;
}
/* ############# important for hife video download*/
video::-webkit-media-controls-enclosure {
       /* overflow:hidden;*/
    }
    video::-webkit-media-controls-panel {
        /*width: calc(100% + 40px);*/ /* Adjust as needed */
    }
form {
    margin-bottom: 0em;
}