@import url(https://fonts.googleapis.com/css?family=Cabin:400,500|Lato|Source+Sans+Pro|Roboto|Arimo);
@import url(https://fonts.googleapis.com/css?family=PT+Sans:400,700&subset=latin,latin-ext);
@import url('https://fonts.googleapis.com/css?family=Open+Sans');


/*@import url('https://fonts.googleapis.com/css?family=Nunito+Sans|Roboto|Roboto+Slab&display=swap&subset=latin-ext');*/


body {
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif!important;
	margin: 0px;
	color: #525252;
	background-color:transparent;
	min-width:auto!important;
	font-size:1em;
	height:100%;
}

/*body {
	font-family: 'Roboto', sans-serif;!important;
	margin: 0px;
	color: #525252;
	background-color:transparent;
	min-width:auto!important;
	font-size:1em;
	height:100%;
	letter-spacing:0.2;
}*/
h1, h2, h3, h4{
	/*font-family: 'Roboto Slab', serif; */
	color: #202020;
 }
html{
	height:100%;
	background-color:#ededed;
}
#outlineStatusMsg, #fp_Count, td.forum_cell{
	display:none;
}
#statusMsg{
min-height: 18px;
text-align: center;
width: 30%;
margin: auto;
/*border: 1px solid #d1d1d1;
padding: 23px;
background-color: #fafafa;*/
margin-top: 0px;
border-radius: 3px;
}
h1, h2, h3, h4 {
	color: #202020;
}
#messagesListContainer p{
	/*font-family: 'Roboto', sans-serif;!important;*/
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif!important;
	font-size:1em!important;
}

h4 {
	text-transform: uppercase;
	font-size: 0.97em;
	margin-bottom: 0.7em;
}
#main h4 a{
	pointer-events: none;
	cursor: default;
	color: #4d4d4d!important;
	text-decoration:none;
   }
#pageText h4 a{
	pointer-events:auto;
	cursor:pointer;
}  
iframe h3{
	color:#40B1C1!important;
}
​#FrmToolbar .actionIcon {
    fill:#40B1C1;
}​

#main a {
	text-decoration: none;
	color: #525252;
}

a:visited {
	text-decoration: none;
	color: #525252;
}

a:link, a, a:hover {
	text-decoration: none;
	color: #525252;
}


a.cmd {
	color: #d45205;
	background-color: transparent;
	border: none;
	padding: 0px;
}

a.cmdSmall, #assigResponseExtension {
	color: #40B1C1!important;
	background-color: transparent;
	border: none;
	font-size: 0.9em;
	padding: 0px;
	text-decoration:none;
	font-weight:bold;
}
#messagesListContainer a:link, .holderHeaderBodyText a{
	color: #40B1C1!important;
	background-color: transparent;
	border: none;
	padding: 0px;
	text-decoration:none;
	font-weight:bold;
}
a.cmdSmall:hover{
	color: #d45205;
}
img.actionIcon:hover{
	opacity:0.8;
	cursor:pointer;
}
.reports, #removePhoto, #changePassword{display:block; margin-right:10%; display:block; 
clear:both; margin-top:0px; color:#40B1C1!important;
background-color:transparent!important; cursor:pointer; text-align:right; border:none; font-size:1em;
padding:0px;}

.maintext .cmdAjax, .pageTopCommands #btnAddNewQuiz, #btnAddNewPool, 
#btnAddNewCluster, #btnExportToExcel, .reglink, #btnGotoMap{
	background:#40b1c1 none repeat scroll 0% 0%;
	text-transform:uppercase;
	width:120px;
	text-align:center;
	float:right;
	margin-right:10%;
	width:auto;
	font-weight:bold;
	padding:10px 22px;
	color:white;
	border:none;
	cursor:pointer;
	margin-bottom:10px;
	font-size:1em;
}
.pageTopCommands #btnAddNewQuiz:hover, #btnAddNewPool:hover{background-color:#39A0AF;}
input[type=button]{
	background:#40b1c1 none repeat scroll 0% 0%;
	font-weight:bold;
}
#buttons, #frmChangePassword .cmdAjax{width:100px;}
#frmChangePassword .cmdAjax{display:inline-block;}
#btnAddNewUser, #btnAddExistingUser, #btnGotoMap{margin-top:10px; float:right; margin-left:10px;}
input.cmdSmall, div.cmdSmall, span.cmdSmall, input[type=submit].cmdSmall, #assigHdrCmdViewComments,
#assigHdrCmdViewEssay-AfterGraded
{
	cursor: pointer;
	color: white!important;
	background:#40b1c1 none repeat scroll 0% 0%;
	border: none;
	font-size: 0.9em;
	padding: 8px 12px;
	margin-top:5px;
	margin-bottom:5px;
	min-width:100px;
	font-weight:bold;
	border-radius:3px;
}
.fa-fw  {
	color:#40B1C1;
}
input[type=button].cmdSmall:hover, div.cmdSmall:hover, span.cmdSmall:hover, input[type=submit].cmdSmall:hover {
	color:white;
}
#outlineItemDefaultTitle .fa-fw{font-size:1.1em;}
a.cmdSmall[title=Open], .cmdSmall.open{
	cursor:pointer;
	text-decoration: none;
	color: #ffffff!important;
	font-size: 0.9em;
	padding: 8px 12px; /* 3px 7px 3px 4px; */
	font-weight: bold;
	border: none; 
	border-radius:3px;
}
input[type=file]{border:none;}
input[type=submit], #btnSave, input[name=Edit], #tblSessions input[type=button],
#btnSet, span.newpost, input.cmdSmall[name=Edit],  input[value=Edit],#moderatorListContainer input.cmdSmall[value=Edit],
#studentListContainer input.cmdSmall[value=Edit], input.cmdButton, #btnAddNewForum, #frmCalendarEventDetail #calendarEventDetailCmdEdit,
input#btnGotoMap.cmdSmall, input[type="button"][value="Submit"], 
#studentListContainer input.cmdSmall:nth-child(3), #btnSetLocation, #btnResetMap, #resetPassword, #blogPostReplyButton,
#assigHdrCmdViewEssay{
	background-color:#40b1c1;
	text-decoration: none;
	color: #ffffff!important;
	font-size: 0.9em;
	padding: 8px 12px; /* 3px 7px 3px 4px; */
	font-weight: bold;
	border: none; 
	border-radius:3px;
}
#moderatorListContainer input.cmdSmall[value=Edit],
#studentListContainer input.cmdSmall[value=Edit]{
    padding:9px 48px;
    float:right;
    background-color:#40b1c1;
}
input.cmdSmall[type=button][value=Edit],#refresh, input.cmdSmall[type=button][value=Send message]{
	cursor:pointer;
	text-decoration: none;
	color: #ffffff;
	font-size: 0.9em;
	padding: 8px 12px; /* 3px 7px 3px 4px; */
	font-weight: bold;
	border: none; 
	border-radius:3px;
}
input[type=button]:hover, input[type=submit]:hover, input.cmdSmall[name=Edit]:hover, 
#moderatorListContainer input.cmdSmall[value=Edit]:hover,
#studentListContainer input.cmdSmall[value=Edit]:hover, input.cmdSmall[type="button"][value=Edit]:hover, #btnAddNewForum:hover,
#studentListContainer input.cmdSmall:nth-child(3):hover, input.cmdSmall[type="button"][value=Add]:hover, 
#btnSetLocation:hover, #btnResetMap:hover, input#btnGotoMap.cmdSmall:hover, #resetPassword:hover, #blogPostReplyButton:hover,
#responseEditCmdViewEssay:hover, a.cmdSmall#responseEditCmdViewComments:hover{
	color:white;
	background-color: #39a0af;
}
input[type=button][value=Open], #moderatorListContainer input.cmdSmall, #studentListContainer input.cmdSmall, 
#classesListContainer input.cmdSmall, input[value=View], a.cmdSmall[title=Open], #frmCalendarEventDetail #calendarEventDetailCmdSave,
#btnAddNewUser, input[value="Change"],input[value="Preview"], .cmdSmall.open, #btnAddExistingUser,
#tblSessions input[type="button"] .cmdSmall.btnCreateTranscript, #btnPageCreate, input[value=" Save"], #responseEditCmdViewEssay,
a.cmdSmall#responseEditCmdViewComments, #assigHdrResponseQuizCmd, #assigHdrResponseMultimediaCmd{
	background-color:#40B1C1;
	color:white!important;
	display:block;
	padding: 8px 12px;
	border:none;
	cursor:pointer;
	font-weight:bold;
	float:right;
	margin-bottom:5px;
	margin-left:5px;
	border-radius:3px;
	font-size:0.9em;
}
#btnSaveLocation{float:none; display:inline-block;}
#btnCancelLocation{
	margin-right:0px;
}
#btnSaveLocation{
	margin-left:0px;
}
#btnSaveLocation{
	min-width:100px;
}
#btnPageCreate{display:inline-block;}
#refresh{margin-left:4em!important;
	background-color:#40B1C1;
	color:white;
	display:block;
	padding: 8px 12px;
	border:none;
	cursor:pointer;
	font-weight:bold;
	font-size:0.9em;
	}
input[type=button][value=Open]:hover, #moderatorListContainer input.cmdSmall:hover, 
#studentListContainer input.cmdSmall:hover, #classesListContainer input.cmdSmall:hover, 
input.cmdSmall[type="button"][value=View]:hover, a.cmdSmall[title="Open"]:hover, 
#btnAddExistingUser:hover, input[value=" Save"]:hover, .cmdSmall.open:hover, 
#btnPageCreate:hover, #btnAddNewUser:hover, #tblCoursePagination .cmdAjax:hover, .gotochat:hover{
	background-color:#39A0AF;
	color:white;
}
input[value=Delete], #close, input[value=Cancel], 
input[type="button"][value=Close], input[type="button"][value="Cancel"], #frmCalendarEventDetail input[value=Close],
.cmdButtonWeak, #tblSessions input[type="button"][value=Delete], input.cmdSmall[value=Remove], #responseEditCmdRemoveEssay{
	background-color:#a1a1a1;
	cursor:pointer;
	text-decoration: none;
	color: #ffffff;
	font-size: 0.9em;
	padding: 8px 12px; /* 3px 7px 3px 4px; */
	font-weight: bold;
	border: none; 
	border-radius:3px;
	margin-right:5px;
}
input[value=Delete]:hover, #close:hover, input[value=Cancel]:hover, 
input[type="button"][value=Close]:hover, input[type="button"][value="Cancel"]:hover, #frmCalendarEventDetail input[value=Close]:hover,
.cmdButtonWeak:hover, #tblSessions input[type="button"][value=Delete]:hover,
input.cmdSmall[value=Remove]:hover, #responseEditCmdRemoveEssay:hover{
	background-color:#888888;
}
input[value="Edit"]{}
#blogPostNewReplyBlock input[type="button"]{}
/*#tblSessions input[type="button"][value=Delete]{width:100%;}
/* problem in IE8 solved background-color: transparent; 
 * to test on IE7, then remove SmallGray */
input[type=button].cmdSmallGray {
	cursor: pointer;
	color: #40B1C1;
	background-color: transparent; /* #f0f0f0;*/
	border: none;
	font-size: 9pt;
	padding: 0px;
}
#frmUploadEssay{text-align:left; padding-top:20px;}
#respondEssayFile{padding-top:30px;}
#assigHdrResponseEssayBlock{padding-top:20px;}
#assigHdrResponseEssayBlock tr{min-height:50px; margin-bottom:10px; display: table;}
input[type=button].cmdSmallGray:hover {
	text-decoration:underline;
}
.gotochat a{
	color:white;
	font-size:1.2em;
	padding:10px 20px;
}
.assignheader{}
#frmNewMessage input[value="Cancel"], #frmNewMessage input[value="Send"]{position: absolute;
bottom: 0px;}

#frmNewMessage  #btnSend{right:10px;}

#frmNewMessage input[value="Cancel"]{right:77px;}
#divAttachedFiles{margin-bottom:10px;}
input[type=text], input[type=password] {
	border: 1px solid #d1d1d1;
	padding: 9px 13px;
	/*font-family: 'Roboto', sans-serif;*/
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	background-color: #fff;
}



input#calendarTemplateCmdShowAll.cmdSmall[type=button]:hover, input#calendarTemplateCmdAdd.cmdSmall[type=button]:hover{
	background-color:transparent;
}
/*.frmContainer #btnUserPreferences{display:none!important;}*/
#moderatorListContainer input, #studentListContainer input{width: 131px;}
#closeCalendar{
}
.sessionTopic a, #main .chatlink h4{
	color:#40B1C1;
	font-weight:bold;
}
/*input#calendarTemplateCmdShowAll.cmdSmall:active ~ #closeCalendar, input#calendarTemplateCmdShowAll.cmdSmall:focus ~ #closeCalendar{
	display:block!important;
	background-color: #40B1C1!important;
	font-weight: bold;
}*/
#calendarTemplateCmdAdd{

}

#frmLogin .catalogue img, .catalogue img {
    height: 42px;
    margin-bottom: 0px;
    padding-bottom: 0px;
    margin-top: 0px;
    vertical-align: middle;
    padding-top: 0px;
    margin-right: 20px;
}
.top .catalogue h2 {
    padding-top: 10px;
    font-size: 1.1em;
}
input#calendarTemplateCmdShowAll.cmdSmall:active ~ #calendarTemplateCmdAdd{
	display:block!important;
}
input#calendarTemplateCmdShowAll.cmdSmall[type=button]:active ~ #rightsideBlock0{
	z-index:20;
}
#calendarTemplateFooter{

}
#calendarBlockItems:before, .blockFeedContent:before{
	color:#4d4d4d;
	border-radius:3px;
	margin-left:180px;
	display:block;
	font-size:0.8em!important;
	margin-bottom:13px;
	text-align:right;
	margin-top:0px;
}
.blockFeedContent:before{
	padding-top:0px;
	font-size:1em!important;
	cursor:pointer;
}
#calendarBlockItems:before{
	margin-right:5px;
	margin-top:5px;
	margin-bottom:0px;
}
#calEntry-0{
	margin-top:7px;
	border-radius:3px 3px 0px 0px;
	margin-top: 36px !important;
	position:relative;
}
#calEntry-0 #calendarTemplateLineCmdPopup{
	margin-top: 50px;
	border-top:none;
}
#calEntry-0:before{
	content:"CALENDAR";
	font-size:1.3em;
	text-transform:uppercase;
	top: 40px;
	margin-top:80px;
	margin-left:40px;
	background-color:#39A0AF;
	color:white;
	padding:20px;
	width:100%;
	text-align:center;
}

#calEntry-0 #calendarTemplateLineCmdPopup:before{
	content:"Close x";
	font-size:1.1em;
	right:10px;
	position:absolute;
	top:10px;
	padding:10px 15px;
	background-color: #A1A1A1;
	color:white;
	border-radius:3px;
	cursor:pointer;
}
#calendarTemplateCmdShowAll:focus, #calendarTemplateCmdShowAll:active {
    background-image:none;
}
#calendarTemplateLineCmdPopup{
	padding-left:40px;
	padding-top:10px;
	padding-bottom: 10px;
	border-top: 1px solid rgb(237, 237, 237);
}
div#tcal{position:fixed;}
.blockFeedContent:before{
	margin-left:180px;	
}
#closeCalendar{
	display: inline;
	float: right;
	margin-top: 51px;
	color: #FFF;
	width: 78px;
	height: 42px;
	background-color:transparent;
	text-indent:-9999px;
	border:none;
	cursor:pointer;
}
#closeCalendar:hover{
	font-weight:bold;
}

select, input {
	background-color: #ffffff;
	color: #4d4d4d; /*#008191;  #193553; */
	border-top: 1px solid #D1D1D1;
	border-left: 1px solid #D1D1D1;
	border-bottom: 1px solid #D1D1D1;
	border-radius: 3px;
}
select{
	background-image:url('../images/arrow_down.png');
	background-repeat:no-repeat;
    overflow: hidden;
	background-position: 101% 84%;
	background-size: 43px auto;
}
select {

  /* styling */
	background-color: white;
	display: inline-block;
	font: inherit;
	/*font-family: 'Roboto', sans-serif;!important;*/
	font-family: "Helvetica Neue","FontAwesome",Helvetica,Arial,sans-serif!important;
	line-height: 1.5em;
	padding-left:8px;
  /* reset */
	min-width:150px;
	margin: 0;      
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-appearance: none;
	-moz-appearance: none;
	height:40px;
	    overflow:hidden; 
    white-space:nowrap; 
    text-overflow:ellipsis;
}
select option{
	padding:8px;
    text-overflow:ellipsis;
    overflow:hidden;
}
select {
    padding:0 30px 0 10px !important;
    -webkit-padding-end: 30px !important;
    -webkit-padding-start: 10px !important;
}
select selected{
	background-color:#fafafa;
}


#btnAddNewForum{
	float:right;
}
#tblTopicDescription{
	margin-top:20px!important;
}
#frmUserPreferences input{display:inline-block;}
.sticky{
	width:10%;
}
.txDynForm .select_box{
	padding:0px;
}
textarea {
	border: 1px solid #d1d1d1;
	padding: 5px;
	/*font-family: 'Roboto', sans-serif;*/
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	background-color: #ffffff;
}
#txtareaCantinaUserAboutMe{width:auto!important;}
a.cke_path_item, a.cke_path_item:hover{color:transparent!important; background-color:transparent;}
file {
	color: #193553;
	background-color: #CBDEF1;
}
#cke_txtareaMessagesMessageBody, .cke_reset, #cke_editBlogPostText, #cke_editBlogPostText .cke_inner.cke_reset{padding:0px; border-radius:3px; width:100%;}
#cke_txtareaMessagesMessageBody .cke_inner, #cke_editBlogPostText .cke_inner.cke_reset{padding:0px; width:100%;}
.cke_reset_all *{font-family: "Helvetica Neue",Helvetica,Arial,sans-serif !important;}
/*.cke_reset_all *{	font-family: 'Roboto', sans-serif; !important;}*/
form {
	background: #ffffff;
	border: 1px solid #d1d1d1; /* #804020; - brown */
	padding: 0px;
	border-radius:2px;
}
#frmReportInput{border:none;}
#slctSessions{margin-left:10px;}
#ifrmText h3{
	margin-top:20px;
}
.margin-bottom{
    margin-bottom: 15px !important;
}
.margin-top{
    margin-top: 30px !important;
}

td {
/*	font-size: 11pt; */
}

.hoverContainer {
	position:relative;
	text-align: left;
}
.hoverContainer div.hoverBlock {
	display:none;
}
.hoverContainer:hover div.hoverBlock {
	position:absolute;
	display:block;
	left: 0px;
	top: 1em;
	color: #ffffff;
	background-color: #008191;
	z-index:6;
}

#reportsSubmenu {
	padding: 0.5em;
	text-align: left;
	border: 1px solid #000000;
}
div#reportsSubmenu a:link, div#reportsSubmenu a:visited {
	border-right: none;
}

.reportIsModerator{
    font-style: italic;
}


#leftside {
/*	float: left;*/
	border: none;
	padding: 0px 10px 0px 10px;
	font-size: 1.0em;
	overflow-y: scroll;
	height: 540px;
	width:100%;
	/*margin-top: 0px;*/
}

#leftside h4 {	
	margin-left: 20px;
	text-transform: uppercase;
	margin-bottom: 30px; }

#leftside li, #leftside td, #leftside ul {font-size: 14.6px; }

#leftside img { margin-right: 5px;}

#leftside ul {list-style-type:none; width:100%; margin-right:0.5em; padding-left: 0px; margin-top:0px;}

#leftside .cmdAjax { margin-left: 15px; }
#outlineContainer ul{width:auto;}
#outlineContainer{width:auto!important;}
#outlineCourseListContainer div{margin-left:0px!important;}
#outlineItemId{margin-left:10px; margin-bottom:10px;
	position:absolute;
	top: 0px;
	right: 30%;}
#outlineTitle, #outlineType {width:auto;}

.noResultMessage-hidden {display: none; width: 100%;}
.noResultMessage-visible {display: inline-block; width: 100%; text-align: center;}

#main {
	border: 1px solid #dadada;
	border-top:none;
	padding-left: 2%!important;
	padding-right: 2%!important;
	padding-top:20px;
	min-width:445px;
	background-color:white;
	border-radius:0px 0px 5px 5px;
	max-width:1300px;
	min-height:500px;
}

#main{
	width: 81%;
	margin-left: auto;
	margin-right: 120px;
}
#main:first-child{
	min-height:500px;
}

#main {
  min-height: 100%;
  /* equal to footer height */
  margin-bottom: -42px; 
  min-height:500px;
  -webkit-transition: margin-left 0.5s; /* Safari */
    transition: margin-left 0.5s;
}
#main:after {
  content: "";
  display: block;
}
#main:after {
  height: 60px; 
} 
.page-wrap:after {
  content: "";
  display: block;
}

.tabs{
	width:75%; 
	margin-left: auto; 
	margin-right: auto; 
	max-width:1385px;
	margin-bottom:0px;
}

#main h4 {
	font-size:1.3em;
	margin-bottom: 15px;
	margin-top: 2px;
	color:#4D4D4D;
	text-transform:none;
	text-align:center;
}
#pageText h4{
	position:relative;
	top:auto;
}

img#main {
	padding: 2px;
	border: 1px solid #c0c0c0; 
}

#outlineCourseListContainer a.cmd, #contCourseList li a, .outlineCourseSearchField{
	text-decoration: none;
	display: block;
	padding: 10px;
	border-bottom: 2px solid #EDEDED;
	min-height:30px;
	color:#4d4d4d;
	width:50%;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	font-size:1em;
	padding-top:15px;
	-moz-transition: background-color 0.2s ease-in-out;
	-o-transition: background-color 0.2s ease-in-out;
	-webkit-transition: background-color 0.2s ease-in-out;
	transition: background-color 0.2s ease-in-out;
}
#outlineCourseListContainer a.cmd:hover, #contCourseList li a:hover{
	background-color: #40B1C1;
	color: #FFF;
}
#contCourseList{
	list-style-type:none!important;
}

#tblCoursePagination .cmdAjax, #tblCoursePaginationPopup .cmdAjax, #cmdManageCourses{
	cursor: pointer;
	text-decoration: none;
	background-color: #40B1C1;
	color: #FFF;
	padding: 10px 15px;
	font-size: 1em;
	font-weight: bold;
	border-radius: 4px;
	border:none;
	margin-left:10px!important;
	margin-right:10px;
}
#tblCoursePagination{
	margin-top:30px;
	margin-bottom:30px;
	width:auto!important;
}
#tblCoursePagination br{display:none;}

.maintext { float:right;
	clear: left;
	width: 50%;
	margin-top:30px; }

.classroom .maintext {
    display: block;
    clear: both;
    position: relative;
    float: right;
}
.stream-entry { 
	border-bottom: 1px dotted #c0c0c0; 
	margin-bottom: 0.5em;  
	margin-top: 10px; 
	line-height: 1.5em;
	color: #525252!important;
	font-size: 1em!important;
}
.stream-entry span{	color: #525252!important;}
#rightside {
	width: 100%;
	border: medium none;
	padding: 0em;
	margin-top: 50px;
	margin-left: auto;
	display: block;
	clear: both;
	overflow: auto;
}

#footer{
	position: fixed;
	bottom: 0px;
	right: 0px;
	width: 400px;
	z-index:10;
}
#footer .footer{
	clear:both;
	bottom: 0px;
	left: 0px;
	right: 0px;
	height:48px;
}
#footer-trigger:checked ~ .footer{
	display:block;
}
#footer:hover, #footer:focus{
	opacity:1;
}
#footer img:hover{
	cursor:pointer;
	opacity:0.7;
}
#statusMsgMiddle{
	padding:12px;
	font-size:1em;
	font-weight:bold;
	float:left;
	color:#39A0AF;
	margin-top:12px;
	background-color: white;
}
#footer ul{
	list-style:none;
	margin-right:30px;
	float:right;
}
#footer ul li{
	display:inline;
	padding: 0px 10px 10px;
	margin-top: 0px;
}

.cmdAjax, input[value=Last], input[value=Next], input[value=Previous], input[value=First] {
	cursor: pointer;
	text-decoration: none;
	background-color: #40B1C1; /*CBDEF1;*/ 
	color: #ffffff; /*193553;*/
	padding: 10px;
	font-size: 0.9em;
	font-weight: normal;
	border: none;
	border-radius:3px;
	display:inline-block;
}
.tblPageNav .cmdAjax, input[value=Last], input[value=Next], input[value=Previous], input[value=First]{
	/*font-family: 'Roboto', sans-serif;!important;*/
	font-family: "Open Sans",sans-serif!important;
	font-weight: 700;
	font-size: 16px;
}
.cmdAjax:hover, input[value=Last]:hover, input[value=Next]:hover, input[value=Previous]:hover, 
input[value=First]:hover{
	background-color:#39A0AF;
}
.submenu.admin:hover{color:white!important;}
.tblPageNav .cmdAjax, .listNavigation .cmdAjax, input[value=Last], 
input[value=Next], input[value=Previous], input[value=First]{
	border:none;
	padding:9px;
	font-size:1em;
}
.tblPageNav{
	text-align:center;
	margin-left:auto;
	margin-right:auto;
}
.tblPageNav td{
	padding:5px;
}
.listNavigation{
	padding-bottom: 20px;
	padding-top: 20px;
	}

.cmdAjax:disabled {
	background-color:#bbbbbb;
}

.cmdAjaxStrong {
	cursor: pointer;
	text-decoration: none;
	color: #ffffff;
	background-color: #3C86CD;
	padding: 4px;
	font-size: 9pt;
	font-weight: bold;
	border: 1px solid #1C60A1;
}

.cmdAjaxWeak {
	cursor: pointer;
	text-decoration: none;
	color: #000000;
	background:none;
	padding: 4px;
	font-size: 9pt;
	font-weight: bold;
	border: 1px solid #1C60A1;
}

.cmdButton {
	cursor: pointer;
	font-weight: normal;
	background-color: #CBDEF1;
	color: #193553;
	font-size: 10pt;
	font-weight: normal;
	border: 1px solid #1C60A1;
	border-radius:5px;
}


.cmdButtonStrong {
	font-weight: bold;
	background-color: #3c86cd;
	color: #ffffff;
	font-size: 10pt;
	font-weight: bold;
	border: 1px solid #1C60A1;
}

#frmLogin, #frmEmail {
	width: 55%!important;
	position: relative;
	left:0px!important;
	border:none;
	padding-top:20px;
	padding-bottom:20px;
	font-size:1em;
	top:20px!important;
	min-height:100%;
	background-color:white;
}

#frmLogin h3{
	background-color:transparent;
	color:#4d4d4d;
}
#frmLogin table{
	width:63%;
}
#frmLogin h3.diplo_latest{
	padding:10px 20px;
	color:#4d4d4d;
	margin-top:20px;
}
#frmLogin h3.diplo_latest a{
	color:#40B1C1;
}
#frmLogin h3.diplo_latest a:hover{
	color:#40b1c1;
}
#frmLogin td {
	padding: 0.3em;
	vertical-align:middle;
	display:block;
	width:100%;
}
#frmLogin td input{
	font-size:1em;
	border: 1px solid #d1d1d1;
	padding:2%;
	width:96%;
}
#frmLogin td select{
	width:101%;
	border: 1px solid #d1d1d1;  
}
#frmLogin tr{
	margin-top:6px;
	margin-bottom:10px;
	display:block;
}
#frmLogin input[type="submit"]{
	width:101%;
	font-size:1.1em;
}
#frmLogin tr.login a{
	margin-top:15px;
	margin-bottom:25px;
	display:block;
	color:#4d4d4d;
}
#frmLogin ul{
	list-style:none;
	text-align:center;
	margin: 0 auto;
	padding: 0;
	display: table;
}
#frmLogin #social{
	margin: 20px auto 0;
	display: block;
	height: 50px;
}
#frmLogin ul li{
	float:right;
	padding:5px;
}
#frmLogin img{
	border:none;
}
#errorMsg {

}
#frmEmail div{
	margin-top:40px!important;
}
#frmChangePassword span{display:inline-block; padding-top:5px;}
#frmChangePassword div div{width:auto!important; padding-right:0px;}
.cke_skin_kama .cke_wrapper{
	background-color:#fafafa;
}
.msgCount {
	color: #b22222;
}
#main p span, #main li span, #main #blogPostsContainer span,
#messagesListContainer span{background-color:transparent!important; font-size:1em !important; color:#525252;}

.txDynForm{
    display: none;
    left: 0px!important;
    background:rgba(0,0,0,0.5);
    border: 1px solid rgb(250, 250, 250);
    padding: 0px;
    font-size: 0.929em;
    border-radius: 2px;
    position: fixed;
    top: 63px!important;
    z-index: 10;
    top: 65px;
	width: 99.9%!important;
	bottom: 0px;
	height:100%;
	min-height:890px;
}
#assigEditCriteriaIfrm{height:100%!important; min-height:500px!important;}
/*
#frmLogin.txDynForm{
	top:100px;
} */
.cke_skin_kama .cke_toolbox{
	width:100%;
	background-color:transparent;
}
.cke_editor{
	background-color:transparent;
}
*.txDynForm h3 {
    background-color: #40B1C1;
    color: #ffffff;
    margin: 0px;
    padding: 0.5em 0.7em;
    width:50%;
	margin:auto;
    border-bottom: #333333;
    border-radius:3px 3px 0px 0px;
    margin-top:30px;
}

*.txDynForm div, #frmQuizPreview:nth-child(1) {
	padding: 0.6em 0.7em;
	width:50%;
	margin:auto;
	background-color:white;
	border-radius:0px 0px 3px 3px;
	max-height: 450px;
	overflow: auto;
}
#frmQuizPreview table {
    margin: auto;
    width: 590px;
    padding-left: 0px;
    background-color:white;
    padding: 0.5em 0.7em;
}
#frmQuizPreviewTitle{
	width:600px;
}
#quizPreviewContainer {
    width: 101% !important;
    margin-left: -0.9em;
    padding-right: 0.5em;
    border-bottom: 1px solid #ededed;
    margin-top: -2px;
}
#quizPreviewTbl{
	width:100%;
}

#assigCritStdListContainer{height:300px;}
#cke_bottom_editBlogPostText div, #cke_bottom_textareaPostBodyText div, 
#cke_bottom_txtareaMessagesMessageBody div{
	background-color:transparent;
}
*.txDynForm div div{
	width:96%;
}
*.txDynForm td {
	vertical-align: top;
	padding-top: 0.3em;
	padding-bottom: 0.3em;
}

*.txDynForm img  {
	padding: 2px;
	border: 1px solid #c0c0c0;
}
#mymap-canvas div{
	width:auto;
	overflow:hidden;
	height:auto;
	background-color:transparent;
}
#gm-style-mtc{height:30px;}
*.txDynForm input {
	font-size: 0.929em;
}

*.txDynForm textarea {
	/* width: 400px; */
}
#frmUserView{left:13%; height:800px; position:fixed;}
#frmUserView .frmContainer{overflow: scroll; height: 500px;}
#frmUserPreferences{
	z-index:12;
	width: 99%;
	left: 0px !important;
	top: 60px !important;
	bottom: 0px;
}

#frmUserPreferences select {
    background-position: 102% 50%;
    background-size: 30% auto;
}
#frmUserPreferences .frmContainer{
	width: 50%;
	margin-left: auto;
	margin-right: auto;
}
#frmReportInput label{width:150px;}

#frmQuizPreview table{max-height:450px;}
#frmQuizPreview td{padding-top:0px;}
#txtMessagesSubject{
	width:94%!important;
}
#frmChangePassword #frmChangePasswordCaption, #frmChangePassword .frmContainer{
	max-width:500px;
}
.hiddenParm {
	font-size: small;
	color: #c0c0c0;
	display:none;
}

.message {
	font-size: 9pt;
	font-weight: bold;
}

.messageError{
	text-align:center;
	margin:auto;
	padding-top:20px;
	padding-bottom:20px;
	width: 55%;
	background-color:#fafafa;
	border:none;
	margin-top:70px;
	color:#D31141;
}

.messageSuccess {
	width: 55%;
	margin: auto;
	margin-top:40px;
	padding: 20px;
	background: #fafafa;
	border: 1px solid #d1d1d1;
}
.messageSuccess > a {
    color: #2c8999 !important;
}

h1{text-align:center;}
.login h2{
	margin-top:60px;}
.containerCmdOutline {
	position: relative;
	width: 65px;
	text-align:right;
}
.containerCmdOutline:hover {
/*	background-color:#c0c0c0;*/
}

.containerCmdOutline div.cmdOutline {
	display:none;
	/*background-color: #f8f8f8;
	border: 1px solid #000000;
	padding: 0.2em;
	text-align:left;
	font-size: small;
	text-decoration: underline;*/
	cursor: pointer;
	z-index:20;
	text-decoration: none;
	background-color: #40B1C1; /*CBDEF1;*/
	color: #ffffff; /*193553;*/
	font-size: 1.1em;
	font-weight: normal;
	line-height: 1.5em; /*1C60A1;*/
	border-radius:3px;
}

#outlineContainer:nth-last-child(1) .containerCmdOutline:hover div.cmdOutline  > *{top:-150px;}

#outlineContainer #outlineItem-0 .containerCmdOutline:hover div.cmdOutline,
#outlineContainer #outlineItem-1 .containerCmdOutline:hover div.cmdOutline,
#outlineContainer #outlineItem-2 .containerCmdOutline:hover div.cmdOutline,
#outlineContainer #outlineItem-3 .containerCmdOutline:hover div.cmdOutline
{top:0px;}

.containerCmdOutline:hover div.cmdOutline,
#outlineContainer #outlineItem-0 ul .containerCmdOutline:hover div.cmdOutline,
#outlineContainer #outlineItem-1 ul .containerCmdOutline:hover div.cmdOutline,
#outlineContainer #outlineItem-2 ul .containerCmdOutline:hover div.cmdOutline,
#outlineContainer #outlineItem-3 ul .containerCmdOutline:hover div.cmdOutline,
#outlineContainer #outlineItem-4 ul .containerCmdOutline:hover div.cmdOutline{
	position:absolute;
	top: -120px; right:20px;
	height:auto;
	display:block;
	z-index: 50;
	font-size: 1.1em;
}
#outlineContainer #outlineItem-0 ul li .containerCmdOutline:hover div.cmdOutline > *,
#outlineContainer li:nth-child(-n+7) .containerCmdOutline:hover div.cmdOutline{top:0px;}

#outlineContainer li:nth-child(-n+4) #outlineItem-1 .containerCmdOutline:hover div.cmdOutline,
#outlineContainer li:nth-child(-n+4) #outlineItem-0 .containerCmdOutline:hover div.cmdOutline,
#outlineContainer li:nth-child(-n+4) #outlineItem-2 .containerCmdOutline:hover div.cmdOutline,
#outlineContainer li:nth-child(-n+4) #outlineItem-4 li .containerCmdOutline:hover div.cmdOutline,
#outlineContainer li ul li:nth-child(-n+7) .containerCmdOutline:hover div.cmdOutline  {top:-150px;}

.containerCmdOutline div.cmdOutline > *{
	padding:7px 15px;
}
.containerCmdOutline div.cmdOutline > *:hover{
	background-color:#39A0AF;
}

.containerCmdOutline img {
	opacity: 0.3;
}
.containerCmdOutline:hover img {
	opacity: 1.0;
}

img#blogPostPhoto, img#postAuthorPhoto, .cantinaPhoto {
	padding: 2px;
	border: 1px solid #ededed;
	border-radius: 50%;
    width: 40px;
    height: 40px;
}

.listNavigation {
	text-align: center;
	margin-top: 1em;
	display: block;
	clear: both;
	padding-top: 30px;
}
.listNavigation td {
	padding: 1px 3px;
}

.right { float: right;}

#userProfileContainer #btnMyPreferences{display:none;}

#userProfileContainer strong{margin-bottom:10px; display:block;}
.assigListHdrCellHidden{background-color:white!important; border-bottom:1px solid #ededed!important;}
/****** CALENDAR ********/

.calendarEntry {
	padding-left: 1.2em;
	text-indent: -1.2em;
}
textarea#calendarEventDetailText {
	width: 400px;
	min-height: 65px;
}
.calendarEventTextNoLink {
	font-size: 9pt;
	font-family: Arial, Helvetica, sans-serif;
	/*font-family: 'Roboto', sans-serif;*/
	background-color: transparent;
	border: none;
	padding: 0px;
}
.calendarEventTextWithLink {
	font-size: 1.2em;
	font-family: Arial, Helvetica, sans-serif;
	/*font-family: 'Roboto', sans-serif;*/
	background-color: transparent;
	border: none;
	padding: 0px;
    cursor: pointer;
    display:inline;
}
.calendarEventTextWithLink:hover{
    text-decoration: underline;
}
.calendarTemplateLineDateNoLink{
	font-size: 0.9em;
	font-family: Arial, Helvetica, sans-serif; 
	/*font-family: 'Roboto', sans-serif;*/
    color: brown;
}
.calendarTemplateLineDateWithLink{
	font-size: 1em;
	font-family: Arial, Helvetica, sans-serif;
	/*font-family: 'Roboto', sans-serif;*/
    color: #40B1C1;
    cursor: pointer;
    display:block;
    margin-bottom: 10px;
}
.calendarTemplateLineDateWithLink:hover{
    text-decoration: underline;
}
#calendarBlockItems .calendarEntry{
	background-color:white!important;
	padding:10px;
	text-indent:0px;
	padding-top:5px;
	padding-bottom:5px;
	width:50%;
	margin:auto;
}

#calendarImgExternalLink{
	display:inline;
}
#calendarBlock{
/*	z-index: 10;
	top: 164px;
	width:100%;*/
	display:none;
}
#calendarTemplateFooter{
	height: 20px;
	z-index:-1;
}
#calendarTemplateFooter, #calendarBlockItems{
	position:absolute;
	width: 100%;
}
#calendarAnchorForExternalLink{
	display:none;
}

#calendarBlockItems{
	width:100%;
	margin-top: 0px;
	border: 1px solid rgb(237, 237, 237);
	padding-left:0px!important;
	background: rgba(0, 0, 0, 0.5) none repeat scroll 0% 0%;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#40b1c1+26,40b1c1+31,ffffff+31,ffffff+31 */
/*background: #40b1c1; /* Old browsers */
/*
background: -moz-linear-gradient(top,  #40b1c1 26%, #40b1c1 31%, #ffffff 31%, #ffffff 31%); /* FF3.6-15 */
/*background: -webkit-linear-gradient(top,  #40b1c1 26%,#40b1c1 31%,#ffffff 31%,#ffffff 31%); /* Chrome10-25,Safari5.1-6 */
/*background: linear-gradient(to bottom,  #40b1c1 26%,#40b1c1 31%,#ffffff 31%,#ffffff 31%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#40b1c1', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	border-radius:5px;
}

#calendarTemplateFooter br{
	display:none;
}
#frmCalendarEventDetail.txDynForm{
	top:200px;
	left:10%;
}
#frmEditClassBlock table, #frmCalendarEventDetail{
	width: 51.5%;
	margin-left: auto;
	margin-right: auto;
	background-color: white;
	padding: 20px;
}
#frmEditClassBlock{
	z-index:100!important;
}
#frmUserPreferences tr:nth-child(2){display:none;}
/****** MAIN MENU / TOP MENU - DROP DOWN ********/
/*
#topmenu {
	background-color: #008191;
	color: #ffffff;
	padding: 15px 0px 15px 5px;
	height: 17px;
	border-bottom: 1px solid black;
} */

/*
div#topmenu a:link, div#topmenu a:visited {
	color: #ffffff;
	font-size: 0.92em;
	padding: 0px 10px 0px 10px;
	border-right: 1px dotted #cccccc;
	float: left;
} */
/*
div#topmenu .topright {
	float:right;
	margin-right: 15px;
	color: #96cdd2;
	font-size: 0.92em;
	font-weight: normal;
}*/

/*#header {  
	/* width: 100%;
	background-color: #008191;
	color: #ffffff;
		padding: 0px 0px 5px 3px; 
	height: 42px;
	border-bottom: 1px solid black;
} */

#header {
	border-bottom: 2px solid #40B1C1;
	height: 60px;
	padding-bottom: 3px;
	position: fixed;
    top: 0px;
    width: 100%;
    z-index: 115;
    background-color: white;
}

#topmenu .topright {
	float:right;
	margin-right: 15px;
	height: 35px;
	line-height: 35px;
	font-weight: normal;
	/* padding: 6px 12px; */
}

#topmenu .outlineCourseSearchField{
    margin-right: 26%;
    margin-top: 2px;
    padding-top: 0px;
    width: 50%;
    border-bottom: none;
    position: relative;
}
#topmenu .outlineCourseSearchField .fa{
    display: inline-block;
    right: 0px;
    top: 12px;
    margin-top: 0px;
    position: absolute;
    color:#ccc;
    font-size:1em;
}
  
#topmenu .outlineCourseSearchField input{
    padding: 10px 15px;
    width: 100%;
    border:1px solid #ededed;
    font-size:16px;
}
#topmenu .outlineCourseSearchField input:focus{
    border:1px solid #ccc;
    color:#4d4d4d;
} 

.mainmenu{
	border:none;
	border:0px;
	margin:0px;
	padding:0px;
	font-weight:bold;
}
.mainmenu label{
	border-radius:4px;
}
.mainmenu ul {
	height:35px;
	list-style:none;
	margin:0;
	padding:0;
	margin-top:10px;
	float:right;
	margin-right:60px;
	top:54px;
}
.mainmenu li {
	float:left;
	padding:0px;
	height:64px;
}
.mainmenu li li{
	height:auto;
}

.mainmenu li a, .mainmenu .topright a, .mainmenu span.submenu{
	background:transparent;
	color:#4d4d4d;
	display:block;
	font-weight:normal;
/*	font-family: 'PT Sans', sans-serif;*/
	line-height:35px;
	margin:0px;
	padding:7px 18px;
	text-align:center;
	text-decoration:none;
	text-transform:uppercase;
	-moz-transition: background-color 0.2s ease-in-out;
	-o-transition: background-color 0.2s ease-in-out;
	-webkit-transition: background-color 0.2s ease-in-out;
	transition: background-color 0.2s ease-in-out;
}

.mainmenu ul li span.image {
    padding: 0px 14px;
}
.mainmenu ul li span.image .cantinaPhoto{
	width: 31px;
	height: 31px;
	margin-top:4px;
}
.menu ul li:hover a {
	background: #64A9B5/*2580a2*/ url("/images/hover1.gif") bottom center no-repeat;
	color:#FFFFFF;
	text-decoration:none;
}
.mainmenu li a.home {
    text-indent: -9999px;
    background-image: url("../images/home.svg");
    background-size: contain;
    background-repeat:no-repeat;
    width: 0px;
    height: 0px;
    display: block;
    margin-top: 12px;
    margin-right: 20px;
    padding: 11px;
}

.mainmenu li:hover ul ul{
	display:none;
}
.mainmenu li ul li:hover ul{
	display:block;
}
.mainmenu li a:hover, .mainmenu li a:active{
	border-radius: 3px;
	color:white;
	background:#40B1C1;
}
.mainmenu li.assignments a{
	padding-bottom:4px;
}
 .mainmenu span:hover, .mainmenu span:active{
 	border-radius: 3px;
	color:white;
	background:#40B1C1 url("../images/hover_sub0.gif") center bottom no-repeat;
 }
.mainmenu li a.home:hover{
	background-color:transparent;
	background-image: url("../images/home.svg");
	opacity:0.7;
	background-size: 1;
    width: 0px;
    height: 0px;
    display: block;
    margin-top: 13px;
    margin-right: 20px;
    padding: 11px;
}
.mainmenu span.submenu:active, .mainmenu span.submenu:hover{
	background-color:#40B1C1;
	color:white;
	position:relative;
	cursor:pointer;
}
.mainmenu span.submenu:hover:after, .mainmenu span.submenu:hover:before {
/*	top: 90%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;*/
}
.mainmenu span.submenu:hover:before{
	display:block;
border-bottom: 5px solid #FFFFFF;
border-left: 5px solid rgba(0, 0, 0, 0);
border-right: 5px solid rgba(0, 0, 0, 0);
bottom: -1px;
height: 0;
left: 0;
margin: auto;
position: absolute;
right: 0;
width: 0;
}

.mainmenu span.submenu:hover:after {
	border-color: rgba(255, 255, 255, 0);
	border-top-color: #ffffff;
	border-width: 10px;
	margin-left: -30px;
}
.mainmenu span.submenu:hover:before {
	border-color: rgba(255, 255, 255, 0);
	border-top-color: #ffffff;
	border-width: 10px;
	margin-left: -36px;
}
.mainmenu span.submenu.rep{
	padding-left:8px;
	border-radius:3px;
	text-transform:capitalize;
}
/*.mainmenu span.submenu.rep:before, .mainmenu span.submenu.rep:hover:before{
	content:"<  ";
	text-transform:capitalize;
	color:#40B1C1;
}*/
.mainmenu span.submenu{
	border-radius:3px;
	position:relative;
}
.submenu.admin{color:#39A0AF!important;}
.nav-trigger, span.mobile {display:none;}
#outlineItemDefaultLink, #outlineItemDefaultLink a:hover{
	color: #40B1C1;
	display:block;
	text-decoration:none;
}
#outlineItemTemplateFolderTitle{
	font-size:1.15em!important;
	margin-left:15px;
	margin-bottom:20px;
	color:#008191!important;
}
#outlineItemTemplateFolder{
	padding:10px;
	padding-top:20px;
	padding-bottom:4px;
	border-bottom:1px solid #ededed;
	margin-bottom:4px;
}
 #outlineContainer ul{
	padding-left:20px;
 }
#outlineItemLeftCell #outlineItemTemplateFolder:hover #outlineContainer ul{
	display:block;

}
#outlineItemRightCell{
	vertical-align:middle!important;

}
#outlineItemTemplateDefault{

}
#leftside li a#outlineItemDefaultLink{
	padding:0px;
}
#outlineItemDefaultTitleContainer{
	display:block;
	width:100%;
	height:auto;
	padding:10px;
	padding-top:3px;
	padding-bottom:3px;
	color:#4d4d4d;
}
#outlineItemDefaultTitleContainer #videodescription{
	display:none;
} 
/*#outlineItemDefaultTitleContainer:before{
	content:">    ";
	margin-right:10px;
}*/
#outlineDateDueSpan{
	float:right;
	font-size:0.8em !important;
}
.outline-date-due{
    padding-left: 25px;
    font-size: small;
    display: block;
}

.current-date{
    color: #40B1C1!important;
}
.future-date{
    color: #40B1C1!important;
}
.nocolor-date{
    color: #e8e8e8!important;
}
@keyframes fadeInOut {
    0% {
        opacity: 0;
    }
    10% {
       opacity: 0.5;
    }
    20% {
       opacity: 1;
    }
    30% {
       opacity: 0.5;
    }
    40% {
       opacity: 0;
    }
    50% {
       opacity: 0.5;
    }
    60% {
       opacity: 1;
    }
    70% {
       opacity: 0.5;
    }
    80% {
       opacity: 0;
    }
    90% {
       opacity: 0.5;
    }
    100% {
       opacity: 1;
    }
}

.current-date, .current-date ~ #outlineItemDefaultTitle {
   -webkit-animation: fadeInOut 13s;
   animation: fadeInOut 13s;
}
.past-date, .past-date ~ #outlineItemDefaultTitle,.past-date ~ #outlineItemDefaultTitle .fa-fw{
	color:#a1a1a1;
}
.past-date ~ #outlineItemDefaultTitle .fa-comment-o + :not([class]){
	color:#4d4d4d;
}
#outlineItemFolderContainerNew{
	display:none;
}
#outlineItemDefaultTitleContainer:hover{
	color:#008191;

}
.mainmenu li ul, .mainmenu li ul ul {
	display:none;
	height:auto;
	padding:0px;
	margin:0px;
	margin-top:10px;
	border:0px;
	position:absolute;
	width:205px;
	z-index:200;
	/*top:1em;
	/*left:0;*/
	background-color: white;
	border: 1px solid #ededed;
	margin-left:-40px;
}
.submenu.rep:hover .subsubmenu{
	display:block;
}
.mainmenu ul.subsubmenu{
	right:205px;
	top:100px;
}

.toolbar li ul{
	display:none;
	list-style:none;
	background-color: white;
	width:200px;
	margin-left:200px;
}
.toolbar li ul a{
	width:100%;
}
.toolbar li{
	list-style:none;
}
.mainmenu li:hover ul, .toolbar li:hover ul {
	display:block;
}
.mainmenu li li {
	background:url('/images/sub_sep.gif') bottom left no-repeat;
	display:block;
	float:none;
	margin:0px;
	padding:0px;
	width:205px;
}
.mainmenu li:hover li a {
	background:none;
}
.mainmenu li ul a {
	display:block;
	font-style:normal;
	margin:0px;
	padding:6px 9px;
	text-align:left;
	-moz-transition: background-color 0.2s ease-in-out;
	-o-transition: background-color 0.2s ease-in-out;
	-webkit-transition: background-color 0.2s ease-in-out;
	transition: background-color 0.2s ease-in-out;
	color:#4d4d4d;
	background-color:white;
	text-transform:capitalize;
}
.mainmenu li ul a:hover, .menu li ul li:hover a {
	background:#40B1C1/*2580a2*/ url('/images/hover_sub1.gif') center left no-repeat;
	border:0px;
	color:#ffffff;
	text-decoration:none;
	}
/*.mainmenu li ul a:before{
	content:">  ";
	color:#40B1C1;
}*/
.mainmenu p {
	clear:left;
}	
span.submenu.rep{
	text-align:left;
}
.arrow-up {
    border-bottom: 7px solid #FFF;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    bottom: -1px;
    height: 0px;
    left: 0px;
    margin: auto;
    position: absolute;
    right: 0px;
    width: 0px;
}
@import "compass/css3";

.tabs h1 span {
	font-size: 13px;
	display: block;
	padding-left: 4px;
}

.tabs {
	float: none;
	list-style: none;
	position: relative;
	text-align: left;
	background-color:white;
	padding-left:0px;
	min-width:200px;
	margin-top:35px;
	position:relative;
	height:51px;
}
.outline  {
	float: left;
	display: block;
	list-style: none;
	position: relative;
	text-align: left;
	padding-left:0px;
	min-width:150px;
	margin-top:14px;
	position:relative;
	height:51px;
	z-index:10;
	width:99.9%;
}
.outline #leftside li{
	display:block;
	float:none;
}
.outline #leftside li:hover, .outline #leftside li a:hover{
	text-decoration:none;

}
.outline #leftside li a:hover{
	color:#40B1C1;
}
.outline #leftside li a{
	font-size:14.6px;
	padding:15px;
}

.outline input[type="radio"] {
/*	position: absolute;
	top: -9999px;
	left: -9999px;*/
}
.outline.tab label {
	display: inline;
	padding: 20px 1.3%;
	padding-right:30px;
    margin-left: 10px;
	border-radius: 2px 2px 0 0;
	font-size: 1em;
	font-weight: normal;
	text-transform: uppercase;
	background: #ededed;
	cursor: pointer;
	position: relative;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	text-align:center;
	-webkit-transition: width 0.5s; /* Safari */
    transition: width 0.5s;
    width:1px;
}

.outline.tab .tab-content {
	z-index: 2;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.7s linear;
	width: 94%;
	font-size: 17px;
	line-height: 25px;
	padding: 2%;
	padding-top:1%;
	padding-left:0px;
	position: absolute;
	top: 135px;
	left: 0;
	background: white;
	-webkit-transition: width display 2s; /* Safari */
    transition: width display 2s;
    width:1px;
    display:none;
    position:fixed;
}
.outline [id^="tab"]:checked + label {
	top: 63px;
	background: white;
	width:29%;
	position:fixed;
}
.outline [id^="tab"]:checked ~ [id^="tab-content"] {
	display: block;
	border: 1px solid #dadada;
	border-top:none;
	min-height:800px;
	width:30.5%;
	visibility: visible;
    opacity: 1;
    height:1000px!important;
}
#main label{
	cursor: auto;
	position: relative;
	text-transform:lowercase;
	padding:0px;
	background: #FFF none repeat scroll 0% 0%;
	border:none;
	line-height:1.3;
	width:auto;
}
#quizPreviewContainer label, #quizPreviewTbl label{text-transform:none;}
.jspTrack {
      background-color: white!important;
}
.jspArrow.jspDisabled, .jspVerticalBar .jspArrow {      background-color: white!important; }
.jspDrag {
      background-color: #F5F5F5!important; 
      border-radius:3px;
}

.outline [id^="tab"]:checked ~ #main {
	margin-left:33%;
	width:62.9%;
}
input#tab2{text-indent:-9999px; display:none;}
.outline #tab2 + label{
	background-image: url("/images/outline-closed.png");
	display: block;
	padding-left: 26px;
	background-position: 7px 50%;
	background-repeat: no-repeat;
	text-indent: -9999px;
	margin-left: 16px;
	background-size: 37px;
	padding-top: 30px;
	background-color:transparent;
}
.outline #tab2 + label:hover {
	background-image: url("/images/closed-hover.png");
	background-size: 46px;
	background-position: 2px 15px;
	text-indent: -9999px;
}
.outline #tab2:checked + label{
	background-image: url("/images/outline-open.png");
	display:block;
	padding-left: 26px;
	background-position: 25px 60%;
	background-repeat: no-repeat;
	text-indent:0px;
	padding-top: 27px;
	margin-left:0px;
	background-size: 37px;
	background-color:white;
}
.outline #tab2:checked + label:hover{
	background-image: url("/images/open-hover.png");
	background-size: 46px;
	background-position: 19px 18px;
	}
label[for="tab2"]{
	background-image: url("/images/course-outline-1.png");
	float: left;
	padding-left: 26px;
	background-position: 25% 50%;
	background-repeat: no-repeat;
	text-indent:-9999px;
}
.outline #tab2:checked .tooltiptext{
    visibility: hidden;
    width: 120px;
    background-color:white;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
    position: absolute;
    z-index: 1;
    text-indent:0px;
    display:none;
}

label[for="tab2"]:hover .tooltiptext {
    display:none;
}
.outline #tab1:checked + label, .tabs #tab1:hover + label{
	background-image: url("/images/dots_hover.png");
	float: left;
	padding-left: 26px;
	background-position: 25% 50%;
	background-repeat: no-repeat;
}
label[for="tab1"]{
	background-image: url("/images/dots.png");
	float: left;
	padding-left: 26px;
	background-position: 25% 50%;
	background-repeat: no-repeat;
}
.outline p.link {
	clear: both;
	margin: 380px 0 0 15px;
}
.outline p.link a {
	text-transform: uppercase;
	text-decoration: none;
	display: inline-block;
	color: #4d4d4d;
	padding: 5px 10px;
	margin: 0 5px;
	background-color: white;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	-webkit-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
}
.outline p.link a:hover {
	background-color: #40B1C1;
} 
.navbar-fixed-top{display:none;}

/******ADD COURSE ITEM IN OUTLINE*****/

#outlineItemTemplate + .cmdAjax{
	display: block;
	position: absolute;
	padding: 13px 15px;
	border: medium none;
	font-size: 1.1em;
	background:#40B1C1 url('../images/cog_white.svg') center center no-repeat;
	text-indent: -9999px;
	width:12px;
	height: 12px;
	top: -54px;
	right: 17px;
}
#outlineItemTemplate + .cmdAjax:hover{background-color:#39A0AF;}

#frmOutlineItem{
/*	top: 100px!important;
	left: 13%!important;*/
	border: 1px solid #d1d1d1;
	position:fixed!important;
}

/*******COURSE MENU*******/

input#menu[type=checkbox], input#adminmenu[type=checkbox], 
input#outline[type=checkbox], .tab input[type=checkbox],
input#footer-trigger {
/*	position: absolute;
	top: -9999px;
	left: -9999px;*/
}

.dropdown label { 
	cursor: pointer;
}
.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    padding: 12px 16px;
    z-index: 1;
}

.dropdown:hover .dropdown-content {
    display: block;
}

nav[role="custom-dropdown"] ul{
      display: none;
      height: 100%;
    }
nav[role="custom-dropdown"] ul li ul{
	height:auto;
}
nav[role="custom-dropdown"] label {
    position: relative;
    display: block;
    width: 100%;
	padding: 6px 13px;
    }
label[for="close"]{
	width:100%;
	background-color:transparent;
}

#tab-content1 nav[role="custom-dropdown"] input:checked ~ label {
	background-image:url("/images/arrow_up.svg");
    }
    
nav[role="custom-dropdown"] input:checked ~ ul{
      display: block;
      width:100%;
	overflow: auto;
	border: 1px solid rgb(237, 237, 237);
	border-radius: 4px;
	min-height:700px;
      }
    
nav[role="custom-dropdown"] input:checked ~ ul li {
        width: 100%;
      }        

  
nav[role="custom-dropdown"] { 
 	webkit-animation: bugfix infinite 1s; 
}
#tab-content1 nav[role="custom-dropdown"] label, #leftside nav[role="custom-dropdown"] label{
	background-image: url("/images/arrow_down.svg");
	background-repeat:no-repeat;
	background-position:100.5% 50%;
	background-color:white;
}

label[for=footer-trigger]{
	background-image: url("/images/arrow_up_blue.svg");
	display:block;
	height:30px;
	width:30px;
	background-repeat: no-repeat;
	background-size: 100%;
	margin-top: 20px;
	text-align:right;
	float: right;
	margin-right: 10px;
	background-color: white;
	padding: 8px;
	background-size: 87%;
	background-position: 52% 46%;
	border-radius: 4px;
	cursor:pointer;
}
input#footer-trigger:checked ~ label {
	background-image: url("/images/arrow_down_blue.svg");
}

/********ADMIN MENU*******/

nav.admin{
	position:absolute;
	right:190px;
	z-index: 12; /*so it would be on top of the calendar and twitter block*/
	color: white;
	font-size:1em;
	width:132px;
}
nav.admin ul{
	background-color: #40B1C1;
}
nav.admin input:checked ~ ul{
	width:90%;
	padding-left:0px;
}
nav.admin input:checked ~ ul li a{
	padding:15px;
}
nav.admin label{
	background-image: url("/images/cog.svg");
	padding-left: 50px;
	background-position: 17% 50%;
	background-repeat: no-repeat;
	-moz-transition: background-color 0.2s ease-in-out;
	-o-transition: background-color 0.2s ease-in-out;
	-webkit-transition: background-color 0.2s ease-in-out;
	transition: background-color 0.2s ease-in-out;
	padding-top:20px;
	padding-bottom:20px;
	padding-right:20px;
	cursor:pointer;
	width:45px;
}
nav.admin label:hover{
	background-color:#080808 !important;
}
nav.admin input:checked ~ label{

}
nav.admin a{
	color:white;
	display:block;
	font-size:1em;
}
nav.admin a:hover{
	text-decoration:none;
	background-color:#67c1cd;
}



/*******HEADER********/

.top{
    border-bottom:2px solid #40B1C1;
    height:60px;
    padding-bottom:3px;
    background-color:white;
}
#logo a{
	background-image: url("/images/diplo-logo-30.png");
	height: 45px;
	width: 160px;
	display: block;
	background-size: 73%;
	background-repeat: no-repeat;
	margin-left: 25px;
	float:left;
}
.toolbar .help a{
	float:right;
	margin-right:100px;
	margin-top: -20px;
	padding-top: 20px;
	padding-bottom: 20px;
	font-size: 1em;
	color:white;
	background-image: url("/images/question.png");
	display:block;
	padding-left: 50px;
	background-position: 26% 49%;
	background-repeat: no-repeat;
	padding-right:25px;
	text-decoration:none;
}
.toolbar .help a:hover, .top h2 a:hover{
	color:#008191;
	text-decoration:none;
}
#logo{
	float: left;
	margin-top:10px;
}
.top h2, .top h2 a{
	color: black;
	font-size: 1em;
	right: 0px;
	top: 0px;
	margin: 0px auto;
	text-align: right;
	height: 22px;
	padding-right: 20px;
	padding-top: 20px;
	padding-bottom: 20px;
	font-weight:bold;
}
.help{
	z-index:30;
	display:block;
}
.top h2 a{
	font-weight:normal;
	text-decoration:none;
}

.sideBlock {
}
hr{
	color:#ededed;
	font-size:4pt;
}
#main hr{display:none;}
.blockMessageText {
	font-size: 10pt;
	padding-left:0.3em;
	padding-bottom: 5px;
	border-bottom: 1px dotted #a0a0a0;
}
.assigListTblCell{border-bottom:1px solid #ededed!important;}
.blockFeedContent {
	text-align:left; 
	padding:10px;
	font-size: 10pt;
	padding-bottom: 5px;
	padding-top:50px;
	border: 1px solid #ededed;
	position:fixed;
	z-index:20;
	border-radius:5px;
	margin-top: 13px;
	width: 100%;
	height: 800px;
	margin-left: 0px;
	border: 1px solid rgb(237, 237, 237);
	padding-left:0px!important;
	background: rgba(0, 0, 0, 0.5) none repeat scroll 0% 0%;
}
.blockFeedContent div{
	width:50%!important;
	margin:auto;
	margin-top:0px;
	margin-bottom:0px!important;
	padding-top:10px;
	padding-bottom:10px;
	padding-left:5%;
	padding-right:5%;
	background-image: url("/images/twitter_f.svg");
	background-size: 19px 19px;
	background-repeat: no-repeat;
	background-position: 5% 30%;
}
.blockFeedContent div:nth-child(1){
	padding-top:80px;
	background-position: 5% 75%;
	border-radius: 3px 3px 0px 0px;
	position:relative;
}
.blockFeedContent div:nth-child(1):before{
	content:"Close x";
	font-size:1.1em;
	right:10px;
	position:absolute;
	top:10px;
	padding:10px 15px;
	background-color: #A1A1A1;
	color:white;
	border-radius:3px;
	cursor:pointer;
}
.blockFeedContent div:nth-last-child(1){
	border-radius:0px 0px 3px 3px;
	padding-bottom: 50px;
	background-position: 5% 20%;
} 
.blockFeedContent span a:hover{
	color:#a1a1a1;
}
#blockItemFeedTemplate{
	padding:15px;
}

/****** CHAT ********/
table#tblSessions {
	font-size: 1em; 
	width:100%;
}

#tblSessions .tblChatRow:nth-child(4){
	width:20%;
}

.tblChatLabels {
	border-bottom: 1px solid #c0c0c0;
	background-color: #e8e8e8; 
}

.tblChatRow {
	border-bottom: 1px solid #ededed;
}

.tblChatRow .cmdSmall.open{
	display:none;
}
#tblSessions tr:nth-child(1){
	display:none;
}
.contentBox a:link, .contentBox a:visited {
	color: #d45205;
}
#pageText {
    height: auto!important;
}
a.mail{
	color:#39A0AF;
}
/*span.newpost{
	background: #FFF none repeat scroll 0% 0%;
	color: #000;
	display: block;
	padding: 10px;
	text-align: center;
	text-transform: uppercase;
	border:1px dashed #dadada;
	font-weight:bold;
}*/
span.newpost:hover{
	background-color: #39a0af;
}
#blogPostsContainer table{
	width:100%;
}
#blogPostsContainer img{
	max-width:100% !important;
	height:auto !important;
}
#blogPostsContainer{
display: block;
position: relative;
overflow: auto;
width: 100%;
margin-top:30px;
}
#resultCategoriesListContainer .assigListTblCell{

	min-width:230px;}
#resultCategoriesListContainer #categoryInfo-{
	min-width:100px;
}
#spanTopicAuthor, #divTopicAuthor{
	font-size:1em!important;
	padding-top:10px;
	padding-bottom:10px;
}
#divTopicDescription{
	font-size:1.3em;
	border-bottom:2px solid #ededed;
}
#divTopicDescription br{
	display:none;
}

/****** ANDROID BUG FIX FOR CHECKBOX ********/
@-webkit-keyframes bugfix { 
	from { padding: 0; } 
	to { padding: 0; } 
}

.top h2.user a, .top h2.user{
	width:65px;
}
h4#calendarTemplateHdr{
	display:none;
}
#calendarTemplateCmdShowAll{
	background-image:url("/images/calendar.svg");
	padding-left: 30px;
	background-position: 2% 50%;
	background-repeat: no-repeat;
	height:30px;
	text-indent: -9999px;
	margin-left:64%;
	margin-top:50px;
	z-index:-2;
	background-color:transparent;
}
#rightsideBlock1 h4{
background-image: url("/images/twitter_f.svg");
padding: 20px 11px 5px 12px;
background-repeat: no-repeat;
height: 36px;
margin-bottom: 0px;
margin-top: 0px;
line-height: 1.2;
font-size: 0.7em;
cursor: pointer;
text-transform: none;
width: 59px;
z-index: -20;
left:350px;
position: fixed;
top: 0px;
background-position: 52% 52%;
background-color: #FFF;
border-radius: 5px;
text-align: center;
  overflow: hidden;
  word-wrap: break-word;
  text-indent: -9999px;
}
#level-one .fa{
	color:#40B1C1;
	font-size:1.6em;
}
#level-one .fa-pencil-square-o{
	margin-top:4px;
}
#level-one .fa:hover, #level-one li a:hover .fa::before, #level-one li a:hover .fa, #level-one span:hover .fa{
	color:white;
}
#rightsideBlock1 h4:hover, #calendarTemplateCmdShowAll:hover, #calendarTemplateCmdAdd:hover{
	opacity:0.8;
}
#calendarTemplateCmdAdd{
	background-image:url('../images/plus_alt.svg');
	background-size:cover;
	width:20px;
	height:20px;
	text-indent:-9999px;
}
/*
#rightsideBlock1 h4:hover ~ .blockFeedContent{
	display:block;
}*/
#rightsideBlock1 .blockFeedContent, #rightsideBlock2, #blockItemFeedTemplate{
	display:none;
}
#rightsideBlock1{
	min-width:50px;
	position:fixed;
	z-index:130;
	width:100%;
}
#rightsideBlock0{
	display:none;
}
#rightsideBlock1{
	height:1px;
}

span.link{
	cursor:pointer;
}
/*
#calendarTemplateCmdShowAll:hover{
	text-indent:-30px;
}*/
.listOfMyAttendance{
	background-image:none;
}

#ifrmText{
	padding-top:0px!important;
	overflow:auto;
	overflow-y:hidden;
	overflow-x:hidden!important;
	height:580px!important;
	width:100%!important;
	margin-top:-15px!important;
}


.Section1{
	padding-top:20px;}


#statusLine{
	font-family: Arial, Helvetica, sans-serif; 
	/*font-family: 'Roboto', sans-serif;*/
	font-size:10pt; 
	background-color: #40B1C1; 
	padding:10px;
	color:white;
}
.activeBreadcrumb, .activeBreadcrumb:before{

}
.blockFeedContent:first-child{
	padding:10px;
}

#calendarTemplateCmdAdd{
	color:white;
	padding:4px;
	font-size:7pt;
	margin-top:5px;
	margin-right:100px;
	margin-top: 63px;
	position: absolute;
	left: 62%;
	background-color:transparent;
}

	
img.actionIcon{
	cursor:pointer;
	padding-left:5px;
	padding-right:5px;
}
.chatRow .chatRowNameModerator{
	background-color:#40B1C1!important;
	padding:10px!important;
	color:white;
}

.TitleDynamicForm{
	background-color:#40B1C1;
	padding:5px;
	color:white;
}
#main table h4{ 
	position:relative;
	top:0px;
}
a#nameLink{
	font-size:1.1em!important;
	color:#40B1C1;
	font-weight:bold;
}
#forumTitleLink{
    font-size: 1.3em !important;
    padding-top: 10px;
    padding-bottom: 10px;
    font-weight: bold;
    color:#40B1C1;
}
#imgLink{
	display:inline-block!important;
	margin-top:10px;
}
#forumDescription-{
	color:#a1a1a1;
	}
.assigListHdrCell, .tblChatLabels{ 
	background-color:white!important; 
	border-bottom:1px solid #ededed!important;
	font-size:1.3em;}
	
#FrmToolbar{
	background-color:white;
}
#frmUserEdit, #frmResponseMark, #frmOtherProfileView{
	left:20%;
}
#frmReportInput .searchBoxText{
	width:100%;
}
#frmReportInput .searchBoxText tr{
	float:left;
}
table.searchBoxText TD{
	vertical-align:middle!important;
	font-size:1em;
}
#txtareaCantinaUserAboutMeView, #containerListOfAttendance, #containerListOfCertificates{width:80%!important; min-height:140px;}
#fn1, #fn2, #fn3, #fn4, #fn5, #fn6{
margin-top: -100px; padding-top: 100px;
}
#frmOtherProfileView #assetId, #frmMyProfileView #assetId, #frmUserView #assetId{
	text-align: right;
	display: inline-block;
	right: 10px;
	width: 3%;
}
#spanCantina_FormTitleOtherView, #spanCantina_FormTitleView, #spanCantina_FormTitle_UserView{
	width: 96%;
	display: inline-block;}
.privmsg{
	color:#39A0AF!important;
	font-style:italic!important;
	margin-right:30px;
}
.privacy-policy a{
    color: #40B1C1!important;
    font-weight: bold!important;
}
.privacy-policy{
	margin-top:30px;
	margin-bottom:-10px;
}
.group:before,
.group:after {
  content: "";
  display: table;
} 
.group:after {
  clear: both;
}
.group {
  zoom: 1; /* For IE 6/7 (trigger hasLayout) */
}
#quizListContainer input.cmdSmall{
  white-space:normal;
  width:100px;
}
#quizListContainer input[value="Delete"]{margin-right:0px;}
#quizListContainer td:nth-last-child(1){
  text-align:right;
}
h4.assignments{padding-top:20px;}
#assigHdrResponseStatus{display:none;}
.markssection{width:200px;}
#angularControler .col-lg-12{
	background-color:white;
}
#ik_player_iframe, .comment-default{
	max-width:100%!important;
}
#angularControler #comments .row{
	margin-left:0px;
}

@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0) 
{ @media {
    .tabs { 
		margin-top:250px;

    }
    #main, .outline.tab label, .tab-content {
    margin-top: 0px;}
    a{cursor:pointer;}
    a:hover, li:hover{display:block;}
    .mainmenu li a:hover, .mainmenu .topright a:hover, .mainmenu span.submenu:hover {
    background-color: #40B1C1;
    color: #FFF;
    position: relative;
    cursor: pointer;
    display:block;
}
}}

@media screen and (-webkit-min-device-pixel-ratio:0) {  
/* CSS Statements that only apply on webkit-based browsers (Chrome, Safari, etc.) */  
/*.tabs{margin-top:200px;}  
#outlineCourseListContainer{margin-top:200px;}*/
#main{display:block;}
.classroom #frmLoginLive{display:none;}
.top {height: 55px;}
.toolbar .help a{padding-top:22px;}
.top h2.user a{height:18px;}
.tabs .cmdAjax{padding:11px 15px; font-size:1em;}
select {background-position: 101% 85%; height:38px;}
.outline [id^="tab"]:checked ~ [id^="tab-content"] #leftside {}
.outline [id^="tab"]:checked ~ [id^="tab-content"]::-webkit-scrollbar {
    width: 15px;
    background-color: white;
}
.outline [id^="tab"]:checked ~ [id^="tab-content"]::-webkit-scrollbar-thumb {
    background-color: #F5F5F5!important;
    border-radius: 3px;
}
.outline.tab .tab-content{top:130px;}
}
@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0) 
{ @media {

input {
    -webkit-appearance: none;
    -webkit-border-radius:3px; 
}
}
}
@media only screen and (max-height: 300px){
.mainmenu .nav-trigger:checked ~ ul#level-one {height: 220px;}
.txDynForm div{max-height:200px;}
}
@media only screen and (min-height: 300px) and (max-width: 900px){
ul#level-one{height:auto;}
.mainmenu .nav-trigger:checked ~ ul#level-one {height: 250px;}
}
@media only screen and (min-height: 400px) {
#leftside{height:300px;}
#ifrmText{height:290px!important;}
.mainmenu .nav-trigger:checked ~ ul#level-one {height: 350px;}
.txDynForm div{max-height:270px;}
}
@media only screen and (min-height: 500px) {
#leftside{height:380px;}
#ifrmText{height:400px!important;}
.mainmenu .nav-trigger:checked ~ ul#level-one {height: 450px;}
.txDynForm div{max-height:350px;}
}
@media only screen and (min-height: 600px) {
#leftside{height:480px;}
#ifrmText{height:500px!important;}
.mainmenu .nav-trigger:checked ~ ul#level-one {height: 550px;}
.txDynForm div{max-height:450px;}
}
@media only screen and (min-height: 700px) {
#leftside{height:580px;}
#ifrmText{height:600px!important;}
.mainmenu .nav-trigger:checked ~ ul#level-one {height: 650px;}
.txDynForm div{max-height:550px;}
}
@media only screen and (min-height: 800px) {
#ifrmText{height:700px!important;}
.txDynForm div, #assigEditCriteriaIfrm {max-height:600px!important;}
#leftside{height:650px;}
.mainmenu .nav-trigger:checked ~ ul#level-one {height: 750px;}
.txDynForm div{max-height:650px;}
}
@media only screen and (min-height: 1000px) {
#ifrmText{height:900px!important;}
.txDynForm div, #assigEditCriteriaIfrm {max-height:800px!important;}
#assigCritStdListContainer{height:500px;}
#leftside{height:850px;}
}
@media only screen and (min-height: 1100px) {
#leftside{height:950px;}
}
@media only screen and (min-height: 1200px) {
#ifrmText{height:1100px!important;}
}
@media only screen and (min-height: 1280px) {
#ifrmText{height:1200px!important;}
}
@media only screen and (min-height: 1380px) {
#ifrmText{height:1300px!important;}
}
@media only screen and (min-height: 1480px) {
#ifrmText{height:1400px!important;}
}
@media only screen and (min-height: 1620px) {
#ifrmText{height:1500px!important;}
}
@media only screen and (min-height: 1920px) {
#ifrmText{height:1800px!important;}
}
@media only screen and (min-width: 1480px) {
#main{width:80%; margin-left:auto; margin-right:auto; max-width:1100px;}

}
@media only screen and (min-width: 1700px){
#main{max-width:1400px;}
.outline [id^="tab"]:checked + label {width: 29.5%;}
}
@media only screen and (min-width: 1200px) {
.mainmenu .nav-trigger:checked ~ ul#level-one {height: auto;}
}
@media only screen and (max-width: 1480px) {
#moderatorListContainer input.cmdSmall[value="Edit"], 
#studentListContainer input.cmdSmall[value="Edit"]{float:none; padding:10px 52px; margin-top:10px;}
#main{width: 80%; margin-left:auto; margin-right:auto;}
}
@media only screen and (max-width: 1400px) {
  .outline [id^="tab"]:checked + label {width:28%;}
  }
/*@media only screen and (max-width: 1300px) {
  .outline [id^="tab"]:checked + label {width:27.5%;}
  }*/
@media only screen and (max-width: 1200px) {
.tabs{width:84%; margin-left: auto; margin-right: auto;}
.outline [id^="tab"] + label {

}
.outline [id^="tab"]:checked + label {		background: white; width:40%;}
.outline [id^="tab"] ~ [id^="tab-content"] {
	display: none;
	border: 1px solid #dadada;
	border-top:none;
	width:42.7%;
	visibility: visible;
    opacity: 1;
}
.outline [id^="tab"]:checked ~ [id^="tab-content"] {display:block; width:42.5%;}
.outline [id^="tab"]:checked ~ #main {
	margin-left:45%;
	width:52%;
}
}
@media only screen and (max-width:1100px){
#spanCantina_FormTitleOtherView, #spanCantina_FormTitleView, #spanCantina_FormTitle_UserView{
	width: 94%;
}	

.mainmenu li, .mainmenu li li{width:100%; height:auto; top:0px;}
.mainmenu li{border-bottom:1px solid #ededed;}
.mainmenu li li, .mainmenu li li:nth-last-child(0), .mainmenu li ul{border-bottom:none; border-top:none;}

.mainmenu li a, .mainmenu span.submenu{text-align:left;  font-size:1.3em!important; padding: 10px 20px;}
.mainmenu li ul, .mainmenu li ul ul {
    margin: 0px;
    width: 100%;
    }
.submenu.rep .subsubmenu, .mainmenu li ul ul, .mainmenu li ul{display:none;         height: auto;
        display: block;
        position: static;
        left: 0;
        right: 0;}
.mainmenu span.submenu, .mainmenu li li {border-bottom: 1px solid #ededed;}
 .mainmenu li ul a:hover .subsubmenu{display:block;}
.mainmenu ul.subsubmenu {top: 0px;}
.tabs label{text-indent:-9999px;}
nav[role="custom-dropdown"] label, #leftside ul{width:92%;}
nav[role="custom-dropdown"] input:checked ~ ul{width:98%; }
.toolbar{display:none;}
.navbar-fixed-top{display:block;}
  nav.navbar .navbar-toggle {
    margin-top: 8px;
    margin-bottom: 5px;
    margin-right: 12px;
  }
  nav.navbar .navbar-brand {
    min-height: 56px;
    height: 56px;
  }
  nav.navbar .navbar-brand img {
    height: 40px;
  }
nav.navbar .navbar-nav li{
	margin-left:0px;
	background-color: rgb(44, 45, 47);
}
nav.navbar .navbar-nav li > a {
    padding-top: 20px;
    padding-bottom: 20px;
    display:block;
    color:white;
    padding-left:50px;
    margin-left:0px;
    font-size:1.3em;
  }
nav.navbar .navbar-nav li > a:hover{
    background-color:#080808;
    }
  nav.navbar .navbar-nav li > a.user {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    margin-left: 5px;
  }
  nav.navbar .navbar-nav li > a.user img {
    width: 40px;
  }
  nav.navbar .navbar-nav li > a .badge {
    position: relative;
    top: -8px;
    left: 5px;
  }
#nav-trigger {
  position: relative;
  float: right;
  margin-right: 5px;
  padding: 9px 5px;
  margin-top: 6px;
  margin-bottom: 6px;
  background-color: transparent;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
}
#nav-trigger:focus {
  outline: 0;
}
label[for="nav-trigger"] .icon-bar {
  display: block;
  width: 24px;
  height: 3px;
  border-radius: 1px;
}
label[for="nav-trigger"] .icon-bar + .icon-bar {
  margin-top: 4px;
}
label[for="nav-trigger"] .icon-bar {
  background-color: #40b1c1;
}
#nav-trigger:hover, #nav-trigger:focus {
    background-color: #333;
}
.mainmenu ul {
  display:none;  
  position:absolute;
  left: 0;
  z-index: 10;
  background-color: #FFF;
  margin: 0px 0px 0px 0px;
  top:64px;
  width:100%;
  overflow:auto;
}
.mainmenu ul#level-one{border-bottom: 2px solid #40B1C1; height:auto; overflow:scroll;} 
.mainmenu li ul a{
	margin-left:auto;
	margin-right:auto;
}
.mainmenu ul ul li a, .mainmenu span.submenu.rep{padding-left:20%; font-size:1.2em!important;}
.mainmenu .subsubmenu li a{padding-left:25%; font-size:1.1em !important;}
.mainmenu span.submenu:before{/*	content:"<  ";
	text-transform:capitalize;
	color:#40B1C1;
	    -ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
    transform: rotate(90deg);*/
	}
.mainmenu ul.subsubmenu{margin-top:0px; margin-bottom:5px;border:none; height:0px; display:block!important;}
.mainmenu span.submenu{margin-left:3px;}	
.mainmenu li:hover .subsubmenu{
	/*height:50px;*/
}
.subsubmenu{
	height:100%!important;
	border:none;
}
.mainmenu span.submenu.rep{

}
li.help{
	display: block !important;
	clear:both;
}
.mainmenu li a.home{
  width:100%;
  margin-left:10px;
  height:auto;
  background-size:auto;
  background-position: 3% 36%;
}
.mainmenu li a.home:hover{
    width:100%;
    margin-left:10px;
	background-repeat:no-repeat;
	height:auto;
	background-size:auto;
	background-position: 3% 36%;
}
ul.nav, ul.nav ul{padding-left:0px;	margin-top:0px; margin-bottom:0px;}
ul.nav li{list-style:none; width:100%;}
.mainmenu .nav-trigger:checked ~ ul{
	background-color:white;
	display:block;
	overflow:auto;
 }

.mainmenu span.submenu:checked ~ ul{
	display:block;
}
 .nav-trigger + label, .mainmenu ul {
  transition: top 0.5s ease 0.3s, all 0.5s ease 0.3s;
  -webkit-transition-property: top, bottom;
  -webkit-transition-duration: 0.5s;
}

nav.navbar #nav-trigger {
    margin-top: 8px;
    margin-bottom: 5px;
    margin-right: 12px;
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0px;
overflow: hidden;
clip: rect(0px, 0px, 0px, 0px);
border: 0px none;
}
.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
    border-color: #101010;
}
.navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse {

}
.navbar-collapse.in {
    overflow-y: auto;
}
.collapse.in {
    display: block;
}
.navbar-collapse {
    overflow-x: visible;
    padding-right: 5px;
    border-top: 1px solid transparent;
    box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.1) inset;
}
#nav-trigger{
clip: rect(0, 0, 0, 0);
  position: absolute;
  text-indent: -9999px;
}
label[for="nav-trigger"] {
 position: fixed;
  right: 15px; top: 15px;
  z-index: 20;
 height: 50px;
  width: 40px;
  cursor: pointer;
  text-indent: -9999px;}
  .outline [id^="tab"]:checked + label {width:39.5%;}
.dropdown-content{box-shadow:none;}
.mainmenu li:nth-last-child(1){border-bottom:none!important;}
span.mobile{display:inline-block; margin-left:30px;}
.submenu span.mobile{padding-bottom:10px;}
}
@media only screen and (max-width: 900px) {

#header{height:45px;}
#statusMsgMiddle{margin-top:2px;}
#logo a {
    height: 29px;
    width:89px;
    display: block;
	background-size: 93% auto;
    margin-bottom:23px;
}

#frmLogin td input{height:30px;}
#rightsideBlock1 h4{position: relative;top: 45px; right: 5px; float: right; 
background-color: transparent; height:27px; margin-top:10px;
text-indent:-9999px;}
.outline{width:100%; margin-top:0px;}
.outline #tab2:checked + label {
	top: 48px;
	background: white;
	padding: 19px 2%;
	text-indent:-9999px;
	background-image: url("/images/outline-closed.png");
	background-repeat:no-repeat;
	width:42px;
	background-size: 37px;
	background-position: 20px 25px;
	border-bottom:none;
	border-radius:4px;
}
.outline #tab2 + label{	padding: 29px 0%; width:100%; text-indent:0px; background-color:white; border-bottom:1px solid #ededed;}
.outline #tab2 + label:hover{	background-position: 15px 18px;}
.outline [id^="tab"] ~ [id^="tab-content"] {
	display:block;
	width:97%;
}
.outline.tab .tab-content{top:129px;}
.outline [id^="tab"]:checked ~ [id^="tab-content"] {
	display: none;
	border: 1px solid #dadada;
	border-top:none;
	width:97%;
	visibility: visible;
    opacity: 1;
    top:111px;
}
label[for="tab2"]{position:fixed!important; z-index:30;}
#main{padding-left: 3%; padding-right: 3%; margin-left:0px; width: 94%!important; left:0px;}
.outline [id^="tab"]:checked ~ #main {
	display:block;
	width: 94%;
	margin-left:0px;
}

.blockFeedContent{margin-top: -4px; min-height:900px;}
#frmUserPreferences {top: 48px !important; z-index:116;}
#outlineItemTemplate + .cmdAjax{top: -54px;
right: 66px; z-index: 140;}
.outline #tab2 + label{padding-right:30px; margin-left:0px; background-position: 20px 25px;}
#outlineCourseListContainer a.cmd, #contCourseList li a{width:90%;}
#main h4{margin-bottom:37px;}
#frmBlogPost, #frmNewMessage, #frmChangePassword{top:49px!important;}
}
@media only screen and (min-width: 770px) and (max-width:900px) {
.mainmenu ul {top:49px;}
#rightsideBlock1 h4 {
    top: 0px;
    margin-left: 82%;
    height: 27px;
    margin-top: 0px;
    padding-top: 3px;}
}
@media only screen and (max-width: 770px) {
.outline #leftside li a, .stream-entry {font-size: 17px!important;}
nav.admin label, .toolbar .help a{text-indent:-9999px;}
.tabs {width: 100%;}
#tab-content1 nav[role="custom-dropdown"] label{text-indent:0px;}
#calendarTemplateCmdAdd{
margin-right: 13px;
margin-top: 12px;
position: absolute;
left: 80%;
background-image: url("../images/plus_alt.svg");
}
.blockFeedContent div {width: 90% !important;}
.toolbar .help a{margin-right:20%;}
.blockFeedContent div{background-position: 45% 5%; padding-top: 40px;}
.blockFeedContent div:nth-child(1){
	background-position: 44% 32%;
}
.blockFeedContent div:nth-last-child(1) {background-position: 46% 7%;}
nav.admin{right:30%;}
#rightsideBlock0, #rightsideBlock1{margin-top:-60px; left:0px;}
#calendarBlockItems .calendarEntry{width:90%;}
#calEntry-0 #calendarTemplateLineCmdPopup::before {
    content: "x";
    font-size: 1.3em;
    right: 3px;
    top: 4px;}
.mainmenu ul {top:49px;}
#calendarTemplateLineCmdPopup {padding-left: 10px;}
#rightsideBlock1 h4, #calendarTemplateCmdShowAll {margin-top:0px;}
/*
#header {
    position: fixed;
    top: 0px;
    width: 100%;
    z-index:40;
}*/
#rightside {
    margin-top: 35px;}
.help a{
background-image: url("/images/question.png");
display: block;
background-position: 4% 49%;
background-repeat: no-repeat;
text-decoration: none;
}
.help{display:inline-block; margin-top:-30px;}
.top {border-bottom: 3px solid #40B1C1;}
#frmLogin.txDynForm{top:0px;}
#frmUserEdit, #frmResponseMark, #frmOtherProfileView{left:4%;}
#frmUserEdit, #frmResponseMark{top:200px; left:0px;}
#footer:focus, #footer:hover{opacity:1;}
#footer ul {
    list-style: outside none none;
    margin-right: auto;
    display: block;
    background-color: white;
    position: relative;
    overflow: visible;
    text-align: center;
    margin-left: auto;
    width: 100%;
    padding-left:0px;
    float:none;
}
/*
input#footer-trigger:checked ~ label{position:absolute;
right:10px;
bottom:20px;}*/
#statusMsgMiddle{text-align:center;}
#outlineItemRightCell{width:40px;}
#frmOutlineItem{left: 1%!important;}
#frmBlogPost{left:0px;}
#cke_contents_editBlogPostText iframe, #cke_contents_txtareaMessagesMessageBody iframe{float:left;}
.txDynForm h3, .txDynForm div{width:95%!important; margin-top:0px;}
.tabs{margin-top:0px;}
#leftside{width:94%;}
.outline #tab2 + label{margin-left:0px;}
.outline #tab2:checked + label{padding-left:0px; background-position: 10px 60%;}
.outline #tab2:checked + label:hover{padding-left:0px; background-position: 5px 60%;}
#logo a {margin-left:10px;}
.outline [id^="tab"] ~ [id^="tab-content"] {top:110px;}
#outlineItemTemplate + .cmdAjax{top: -63px;}
.outline #tab2 + label:hover {
    background-position: 5px 18px;
    text-indent:0px;
}
.outline #tab2:checked + label:hover{text-indent:-9999px; background-position: 5px 7px;}
.outline #tab2 + label{background-position: 10px 25px;}
.outline #tab2:checked + label{background-position: 10px 14px;}
}

@media only screen and (max-width: 520px) {
body{min-width:auto;}
#frmLogin{width:95%!important;top:0px!important;}
#frmLogin h3.diplo_latest a {clear: left; display: block;}
input[type="text"], input[type="password"]{width:85%;}
#frmLogin td select, #frmLogin input[type="submit"]{width:90%; height:40px;}
.txDynForm, #frmLogin{top:0px;}
.top h2{display:none;}
#main{min-width:200px; width: 94%;}
.cmdAjax{display:block;}
.assigListTblCell .cmdAjax{display:inline;}
.tblChatRow, .assigListTblCell{width:100%!important; padding-top:10px; padding-bottom:10px; border-bottom:none;}
#btnAddSave{width:100%;}
.tabs{text-align:left;}
.containerCmdOutline {
/*    position: absolute;
    margin-top: -37px;
    right: 20px;*/
    display:none!important;
}
#outlineItemDefaultTitleContainer{height:auto; width:90%;}
#outlineContainer li ul{padding-left:15px;}
.containerCmdOutline:hover div.cmdOutline{right:10%; left:auto;}
.txDynForm{left:0px!important;}
#studentListContainer input.cmdSmall[value="Edit"]{float:none;}
#main h4 {width:80%; margin:auto; margin-top:0px; margin-bottom:30px; min-height:45px;}
#frmChangePassword .cmdAjax[value=Cancel]{float:left;}
}

@media only screen and (max-width: 450px) {
table, thead, tbody, th, td, tr { display: block; }
.listNavigation table,.listNavigation thead,.listNavigation tbody,
.listNavigation th,.listNavigation td,.listNavigation tr {display:inline;}
td, #forumTopicsNumber-{text-align:center!important; width:100%!important;}
#blogPostsContainer td{text-align:left!important;}
#outlineContainer td{text-align:left!important; display:inline;}
#forumDescription-,  #forumTopicsNumber-, #forumTitle-{width:100%!important; padding-left:0px!important;}
#forumTitle-{font-size:1.3em;}
.maintext{    width: 50%;margin-left: auto; margin-right: auto; float:none!important;}
#forumsListContainer .assigListHdrCell{display:none;}
#forumsListContainer tr{margin-top:10px;}
.assigListHdrCell, .tblChatLabels, #cantinaItemIdUser-{width:95%!important;}
#rightsideBlock1 h4{right:auto;position: relative; margin-left: 60%; background-color: transparent;float:right;}
.assigListHdrCell, .tblChatLabels, .assigListTblCell{border-bottom:none!important;}
#assigListTbl tr:nth-child(1),
.tblChatRow{padding:0px!important; padding-top:10px!important; padding-bottom:10px!important;}
.tblChatRow .sessionTopic a{
	content:"Topic (Lecturer)";
	font-size:1.3em;
	text-align:center;
	display:block;
	padding-bottom:10px;
	font-weight:bold;
	margin-bottom:10px;
	color:#39A0AF;
}
/*.tblChatRow.sessionRoom:before{
	content:"Chat room";
	font-size:1.3em;
	text-align:center;
	display:block;
	border-bottom:2px solid #ededed;
	padding-bottom:10px;
	font-weight:bold;
	margin-bottom:10px;
}*/
.tblChatRow.sessionRoom, #tblSessions tr:nth-child(1), #tblSessions tr:nth-child(2){display:none;}
table#tblSessions tr, #assigListTbl tr, #topicsListTbl tr, #forumsListTbl tr{	border-top:2px solid #ededed;}

.submenu.admin, #forumDateLastPost-, #topicsListTbl tr:nth-child(1), #topicsListTbl tr:nth-child(0), 
#topicLastPost-, .admin.dropdown-content,.submenu.admin ~ .dropdown-content{
	display:none!important;
	border-top:0px;
}
/*.tblChatRow.sessionTdHtTranscript:before{
	content:"Transcript";
	font-size:1.3em;
	text-align:center;
	display:block;
	padding-bottom:10px;
	font-weight:bold;
	margin-bottom:10px;
}

.tblChatRow.sessionDtStart:before{
	content:"On (GMT)";
	font-size:1.3em;
	text-align:center;
	display:block;
	padding-bottom:10px;
	font-weight:bold;
	margin-bottom:10px;
}*/
tr .assigListTblCell:nth-child(1){
	font-weight:bold;
	font-size:1.1em;
}
#spanTopicAuthor{font-size:0.9em!important;}
#forumTopicsNumber-::before{
	content:"Topics: ";
}
#topicReplies-::before{
	content:"Posts: ";
}
#statusMsgMiddle{font-size:0.7em;}
/*.outline #tab2 + label:hover, .outline #tab2 + label {text-indent:-9999px;}*/

}

td.tblChatRow.sessionDtStart span{
	display:block;
	width:100px!important;
}

.youTubeTextArea {
    width: 450px;
    height: 100px;
}

