﻿/* General CSS styling common to all academies */
/* =========================================== */

/* Common Layout Related */
.Clearer
{
	clear: both;
	height: 1px;
	overflow: hidden;
	margin-bottom: -1px;
}

.ClearerLeft
{
	clear: left;
	height: 1px;
	overflow: hidden;
	margin-bottom: -1px;
}

.ClearerRight
{
	clear: right;
	height: 1px;
	overflow: hidden;
	margin-bottom: -1px;
}

.clear-fix
{
	clear: both;
}


.pull-right
{
	position:relative;
	float: right!important;
}

.pull-left
{
	position:relative;
	float: left!important;
}

.text-left
{
	text-align:left;
}

.text-center
{
	text-align:center;
}

.text-right
{
	text-align:right;
}

.NoWrap
{
	white-space: nowrap;
}

.YesWrap
{
	text-wrap: normal;
	word-wrap: break-word;
}

.HideImportant
{
	display: none !important;
}

.InvisibleImportant
{
	visibility: hidden !important;
}

.TopBorderTrans
{
	border-top-color: transparent !important;
}

.RightBorderTrans
{
	border-right-color: transparent !important;
}

.BottomBorderTrans
{
	border-bottom-color: transparent !important;
}

.LeftBorderTrans
{
	border-left-color: transparent !important;
}

.Mid
{
	vertical-align: middle;
}

.AcronymText
{
	padding: 0px !important;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	cursor: help;
}

.AcronymTextNoCursorChange
{
	padding: 0px !important;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
}

.FlatText
{
	border: 1px solid #000000;	
	background-color: White;
}


.disabled {
	color:#bbb;	
}

/* Common UI */
.ElearningStatusCompleted
{
	height: 20px;
	line-height: 20px;
	color: #ffffff;
	background-color: #33aa33;
	font-weight: bold;
}

.ElearningStatusInProgress
{
	height: 20px;
	line-height: 20px;
	color: #000000;
	background-color: #f0ba00;
	font-weight: bold;
}

.ElearningStatusNotStarted
{
	height: 20px;
	line-height: 20px;
	color: #ffffff;
	background-color: #cc0000;
	font-weight: bold;
}

.ElearningStatusRetake
{
	height: 20px;
	line-height: 20px;
	color: #ffffff;
	background-color: #cc0000;
	font-weight: bold;
}

.ElearningStatusCompletedText
{
	font-weight: bold;
	font-size: 12px;
	color: #33aa33;
}

.ElearningStatusInProgressText
{
	font-weight: bold;
	font-size: 12px;
	color: #f0ba00;
}

.ElearningStatusNotStartedText
{
	font-weight: bold;
	font-size: 12px;
	color: #cc0000;
}

.ElearningStatusRetakeText
{
	font-weight: bold;
	font-size: 12px;
	color: #cc0000;
}

/* Tables */
.NoBordersOnePxBottomBorder
{
	border-top-width: 0px !important;
	border-right-width: 0px !important;
	border-bottom-width: 1px !important;
	border-left-width: 0px !important;
}


table {
  max-width: 100%;
  background-color: transparent;
}
th {
  text-align: left;
}
.table {
  width: 100%;
  margin-bottom: 20px;
}
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
  padding: 8px;
  line-height: 1.42857143;
  vertical-align: top;
  border-top: 1px solid #ddd;
}
.table > thead > tr > th {
  vertical-align: bottom;
  border-bottom: 2px solid #ddd;
}
.table > caption + thead > tr:first-child > th,
.table > colgroup + thead > tr:first-child > th,
.table > thead:first-child > tr:first-child > th,
.table > caption + thead > tr:first-child > td,
.table > colgroup + thead > tr:first-child > td,
.table > thead:first-child > tr:first-child > td {
  border-top: 0;
}
.table > tbody + tbody {
  border-top: 2px solid #ddd;
}
.table .table {
  background-color: #fff;
}
.table-condensed > thead > tr > th,
.table-condensed > tbody > tr > th,
.table-condensed > tfoot > tr > th,
.table-condensed > thead > tr > td,
.table-condensed > tbody > tr > td,
.table-condensed > tfoot > tr > td {
  padding: 5px;
}
.table-bordered {
  border: 1px solid #ddd;
}
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
  border: 1px solid #ddd;
}
.table-bordered > thead > tr > th,
.table-bordered > thead > tr > td {
  border-bottom-width: 2px;
}
.table-striped > tbody > tr:nth-child(odd) > td,
.table-striped > tbody > tr:nth-child(odd) > th {
  background-color: #f9f9f9;
}
.table-hover > tbody > tr:hover > td,
.table-hover > tbody > tr:hover > th {
  background-color: #f5f5f5;
}
table col[class*="col-"] {
  position: static;
  display: table-column;
  float: none;
}
table td[class*="col-"],
table th[class*="col-"] {
  position: static;
  display: table-cell;
  float: none;
}
.table > thead > tr > td.active,
.table > tbody > tr > td.active,
.table > tfoot > tr > td.active,
.table > thead > tr > th.active,
.table > tbody > tr > th.active,
.table > tfoot > tr > th.active,
.table > thead > tr.active > td,
.table > tbody > tr.active > td,
.table > tfoot > tr.active > td,
.table > thead > tr.active > th,
.table > tbody > tr.active > th,
.table > tfoot > tr.active > th {
  background-color: #f5f5f5;
}
.table-hover > tbody > tr > td.active:hover,
.table-hover > tbody > tr > th.active:hover,
.table-hover > tbody > tr.active:hover > td,
.table-hover > tbody > tr.active:hover > th {
  background-color: #e8e8e8;
}
.table > thead > tr > td.success,
.table > tbody > tr > td.success,
.table > tfoot > tr > td.success,
.table > thead > tr > th.success,
.table > tbody > tr > th.success,
.table > tfoot > tr > th.success,
.table > thead > tr.success > td,
.table > tbody > tr.success > td,
.table > tfoot > tr.success > td,
.table > thead > tr.success > th,
.table > tbody > tr.success > th,
.table > tfoot > tr.success > th {
  background-color: #dff0d8;
}
.table-hover > tbody > tr > td.success:hover,
.table-hover > tbody > tr > th.success:hover,
.table-hover > tbody > tr.success:hover > td,
.table-hover > tbody > tr.success:hover > th {
  background-color: #d0e9c6;
}
.table > thead > tr > td.info,
.table > tbody > tr > td.info,
.table > tfoot > tr > td.info,
.table > thead > tr > th.info,
.table > tbody > tr > th.info,
.table > tfoot > tr > th.info,
.table > thead > tr.info > td,
.table > tbody > tr.info > td,
.table > tfoot > tr.info > td,
.table > thead > tr.info > th,
.table > tbody > tr.info > th,
.table > tfoot > tr.info > th {
  background-color: #d9edf7;
}
.table-hover > tbody > tr > td.info:hover,
.table-hover > tbody > tr > th.info:hover,
.table-hover > tbody > tr.info:hover > td,
.table-hover > tbody > tr.info:hover > th {
  background-color: #c4e3f3;
}
.table > thead > tr > td.warning,
.table > tbody > tr > td.warning,
.table > tfoot > tr > td.warning,
.table > thead > tr > th.warning,
.table > tbody > tr > th.warning,
.table > tfoot > tr > th.warning,
.table > thead > tr.warning > td,
.table > tbody > tr.warning > td,
.table > tfoot > tr.warning > td,
.table > thead > tr.warning > th,
.table > tbody > tr.warning > th,
.table > tfoot > tr.warning > th {
  background-color: #fcf8e3;
}
.table-hover > tbody > tr > td.warning:hover,
.table-hover > tbody > tr > th.warning:hover,
.table-hover > tbody > tr.warning:hover > td,
.table-hover > tbody > tr.warning:hover > th {
  background-color: #faf2cc;
}
.table > thead > tr > td.danger,
.table > tbody > tr > td.danger,
.table > tfoot > tr > td.danger,
.table > thead > tr > th.danger,
.table > tbody > tr > th.danger,
.table > tfoot > tr > th.danger,
.table > thead > tr.danger > td,
.table > tbody > tr.danger > td,
.table > tfoot > tr.danger > td,
.table > thead > tr.danger > th,
.table > tbody > tr.danger > th,
.table > tfoot > tr.danger > th {
  background-color: #f2dede;
}
.table-hover > tbody > tr > td.danger:hover,
.table-hover > tbody > tr > th.danger:hover,
.table-hover > tbody > tr.danger:hover > td,
.table-hover > tbody > tr.danger:hover > th {
  background-color: #ebcccc;
}


/* Make rounded corners with curvycorners and CSS3 */
.RoundedIconBox
{
	border-radius: 9px;
	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
}

.RoundedIconBoxInner
{
	border-radius: 7px;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
}

.RoundedBox
{
	border-radius: 1em;
	-webkit-border-radius: 1em;
	-moz-border-radius: 1em;
}

.RoundedBoxNW
{
	border-top-left-radius: 1em;
	-webkit-border-top-left-radius: 1em;
	-moz-border-radius-topleft: 1em;
}

.RoundedBoxNE
{
	border-top-right-radius: 1em;
	-webkit-border-top-right-radius: 1em;
	-moz-border-radius-topright: 1em;
}

.RoundedBoxSW
{
	border-bottom-left-radius: 1em;
	-webkit-border-bottom-left-radius: 1em;
	-moz-border-radius-bottomleft: 1em;
}

.RoundedBoxSE
{
	border-bottom-right-radius: 1em;
	-webkit-border-bottom-right-radius: 1em;
	-moz-border-radius-bottomright: 1em;
}

.RoundedBoxNESE
{
	border-top-right-radius: 1em;
	-webkit-border-top-right-radius: 1em;
	-moz-border-radius-topright: 1em;
	border-bottom-right-radius: 1em;
	-webkit-border-bottom-right-radius: 1em;
	-moz-border-radius-bottomright: 1em;
}


.ErrorMessage
{
	background-color: #FFCCCC;
	color: #FF0000;
	border: solid 1px #FFAAAA;
}


	.ErrorMessage a.CloseLink
	{
		color: #d90303;
		font-weight: bold;
		font-size: 14px;
	}

		.ErrorMessage a.CloseLink:hover
		{
			color: #FF0000;
			font-weight: bold;
			font-size: 14px;
		}

.error-text
{
	color: #FF0000;
	font-size: 12px;
}


.SuccessMessage
{
	background-color: #CCFFCC;
	color: #00BB00;
	border: solid 1px #AAFFAA;
}

	.SuccessMessage a.CloseLink
	{
		color: #056705;
		font-weight: bold;
		font-size: 14px;
	}

		.SuccessMessage a.CloseLink:hover
		{
			color: #00BB00;
			font-weight: bold;
			font-size: 14px;
		}

.success-text
{
	color: #00BB00;
	font-size: 12px;
}

.capitalise
{
	text-transform: uppercase;
}


.cleditorMain
{
	border: 1px solid #999;
	padding: 0 1px 1px;
	background-color: white;
}

	.cleditorMain iframe
	{
		border: none;
		margin: 0;
		padding: 0;
	}

	.cleditorMain textarea
	{
		border: none;
		margin: 0;
		padding: 0;
		overflow-y: scroll;
		font: 10pt Arial,Verdana;
		resize: none;
		outline: none; /* webkit grip focus */
	}

.cleditorToolbar
{
	background: url('../Images/CLEditorToolbar.gif') repeat;
}

.cleditorGroup
{
	float: left;
	height: 26px;
}

.cleditorButton
{
	float: left;
	width: 24px;
	height: 24px;
	margin: 1px 0 1px 0;
	background: url('../Images/CLEditorButtons.gif');
}

.cleditorDisabled
{
	opacity: 0.3;
	filter: alpha(opacity=30);
}

.cleditorDivider
{
	float: left;
	width: 1px;
	height: 23px;
	margin: 1px 0 1px 0;
	background: #CCC;
}

.cleditorPopup
{
	border: solid 1px #999;
	background-color: white;
	position: absolute;
	font: 10pt Arial,Verdana;
	cursor: default;
	z-index: 10000;
}

.cleditorList div
{
	padding: 2px 4px 2px 4px;
}

.cleditorList p,
.cleditorList h1,
.cleditorList h2,
.cleditorList h3,
.cleditorList h4,
.cleditorList h5,
.cleditorList h6,
.cleditorList font
{
	padding: 0;
	margin: 0;
	background-color: Transparent;
}

.cleditorColor
{
	width: 150px;
	padding: 1px 0 0 1px;
}

	.cleditorColor div
	{
		float: left;
		width: 14px;
		height: 14px;
		margin: 0 1px 1px 0;
	}

.cleditorPrompt
{
	background-color: #F6F7F9;
	padding: 4px;
	font-size: 8.5pt;
}

	.cleditorPrompt input,
	.cleditorPrompt textarea
	{
		font: 8.5pt Arial,Verdana;
	}

.cleditorMsg
{
	background-color: #FDFCEE;
	width: 150px;
	padding: 4px;
	font-size: 8.5pt;
}


.AddItemButton
{
	background: url(../Images/AddItemIcon.png) no-repeat center;
	width: 50px;
	height: 50px;
	cursor: pointer;
}

	.AddItemButton:hover
	{
		background: #EAE2B8 url(../Images/AddItemIcon.png) no-repeat center!important;
		width: 50px;
		height: 50px;
		cursor: pointer;
	}

input.default-text
{
	font-style: italic;
	color: #808080;
}

.panel {
	position:relative;
}


/* Course Details classes */
.CourseDetailsColumn1 {
	float: left;
	width: 220px;	
	overflow:hidden;	
	margin-right:5px;
}

.CourseDetailsColumn1Wrapper{
	background-color:#999;	
}

.CourseDetailsColumn1Wrapper .CourseDetailsColumn_Toggle
{
	width: 16px; 
	height: 100px; 
	position:relative; 
	
	background-image: url(../Images/grad.png);
	background-repeat:repeat-y;

	
}

	.CourseDetailsColumn1Wrapper .CourseDetailsColumn_Toggle .thumb
	{
		position:absolute; top: 50%; left:50%; width: 16px; height: 16px; margin-left: -8px; margin-top: -8px; 
	}

.CourseDetailsColumn2 {
	float: left;
	width: 720px;
	position: relative;
	margin-left: 5px;
}


/* Course Materials */

.course-materials
{
	 
}

.course-materials .category-item-container .item
{	
	padding: 5px 5px;	
}


.course-materials .category-item-container .item a
{
	text-decoration:none;
	color:#0a7bcf;
}

.course-materials .category-item-container .item a:hover
{	
	text-decoration:underline;

}


.course-materials .category-item-container .item:nth-child(even)
{
	background-color:#e8e8e8;
}	

.course-materials .category-item-container .item.item-editable
{	
	cursor: pointer;
}


	.course-materials .category-item-container .item.item-editable:hover
	{
		background-color: #d9edf7;
	}


.course-materials .category-item-container .item.item-editable.selected
{
	background-color: #b3f288;
	border: solid 1px #7fb659;
}


.course-materials .header-bar
{
	background-color:#999;
	padding: 5px;
}

.course-materials .header-bar .section-header
{
	color:#fff; 
	padding: 2px 5px;
	font-size: 12px;
	font-weight: bold;
}

.course-materials .content ul.course-item-list li
{
	color:#444444;
}


.course-materials .content ul.course-item-list li a.course-item-link
{
	text-decoration:none;
	color:#0a7bcf;
	
}
	.course-materials .content ul.course-item-list li a.course-item-link:hover
	{
		text-decoration:underline;
	}



.course-materials-menu
{
	 border-bottom: 1px solid #c6c2c2;
}


.course-materials-menu .material-menu-item, .course-materials-menu .material-menu-item a
{	
	border-top: 1px solid #c6c2c2;	
	background-position:left center; 
	background-image: url(../Images/rightarrow.png);	
	background-repeat:no-repeat;
	color:#0063AC;
	padding: 8px 0 10px 18px;	
	cursor: pointer;
	font-size: 12px;		
	display:block;
}


.course-materials-menu .material-menu-item:hover
{
	text-decoration:underline!important;	
	color:#0782dd;
	background-image: url(../Images/rightarrow-dark.png);
}


.course-materials-menu .material-menu-item.menu-selected
{
	color: #0063AC;	
	font-weight: bold;
	background-image: url(../Images/rightarrow-dark.png);
}




/* Team View */
.team-selected-filter-text
{
	padding: 5px 10px;
	background-color: #ccc;
	font-weight: bold;
}
.team-course-filter-item
{
	padding: 5px 0; cursor: pointer;
}

.team-course-filter-item:hover{
	background-color: #ccc;
}

	.team-course-filter-item.selected
	{
		background-color: #ccc;
	}


/* Standard Buttons */
.DisplayToggleButton
{
	display: inline-block;
	
	background-color: #CCC;	
	color: #414141;
	font: 12px Arial;	
	cursor: pointer;
	text-decoration: none;
	padding: 2px 20px 2px 20px;
	text-align:center;
	margin: 2px 0;
	border: 1px solid #808080;
}

	.DisplayToggleButton:hover {
		text-decoration: underline;
		background-color: #eaeaea;
		color: #808080;
		border: 1px solid #999;
	}

.DisplayToggleButton.selected
{
	background-color: #eaeaea;
	color: #808080;	
	border: 1px solid #999;
}

.DisplayToggleButton.selected:hover
{
	text-decoration: none;
}


/* Custom CheckBox*/
.CustomCheckBox {
    margin-top: 2px; 
    margin-bottom: 5px;
    font-weight: bold; 
    font-family:Arial; 
    font-size: 12px;         
}

.CustomCheckBox.selected {
   background-color:transparent;
}

.CustomCheckBox .checkbox {
    display:inline-block;
    width: 16px; 
    height: 16px;
    cursor: pointer;
    background: url(../Images/CustomCheckbox.png) no-repeat 0 0;
    margin-right:8px;
}

.CustomCheckBox .checkbox.selected,
 .CustomCheckBox[disabled=disabled] .checkbox.selected {
    background: url(../Images/CustomCheckbox.png) no-repeat -16px 0;
}

.CustomCheckBox .label {
    display:inline-block;
	vertical-align:bottom;
}

.CustomCheckBox[disabled=disabled] .checkbox {
    width: 16px; 
    height: 16px;
    cursor: default;
    background: url(../Images/CustomCheckbox.png) no-repeat -32px 0;
}

/*
.CustomCheckBox[disabled=disabled] .checkbox.selected {
    width: 16px; 
    height: 16px;
    cursor: default;
    background: url(../Images/CustomCheckbox.png) no-repeat -48px 0;
}*/

.tooltip {
	display:none;
	position:absolute;
	border:1px solid #333;
	background-color:#161616;
	border-radius:5px;
	padding:10px;
	color:#fff;
	font-size:12px;
}

.filter-show {
	content:url(../Images/downarrow.png);
	
}
.filter-hide {
	content:url(../Images/uparrow.png);	
}

.MoreInfoButtonSM{
	background: transparent url(../../../Common/Images/BlueInfoButtonSM.png) no-repeat;
	width: 16px;
	height: 16px;
	cursor: pointer;
}

/* Warranty View */
.customer-warranty-header
{
    color:#000;
    background-color: rgba(206, 206, 206, 1);
    padding: 5px 10px;
	font-weight: bold;
    cursor:pointer;
    display:block;
}

    .customer-warranty-header:hover
    {
        padding: 5px 10px;
        background-color: #aaa;
	    font-weight: bold;
        cursor:pointer;
        display:block;
    }

.customer-warranty-secondrow
{
    color:#000;
    background-color: rgba(230, 230, 230, 1);
    padding: 5px 15px;
	font-weight: bold;
    font-size:11px;
    cursor:pointer;
    display:block;
}

    .customer-warranty-secondrow:hover
    {
        color:#000;
	    background-color: #aaa;
    }

.customer-warranty-serialrow
{
    padding: 0px 15px;
	font-weight: bold;
    font-size:10px;
    cursor:default;
}
