html, body {
height: 100%; width:100%; 
}


* { 
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
color:#333333;
text-decoration: none;
text-align:left;
margin:0; 
padding:0;
border:0;
list-style:none; 
font-weight:normal ;
letter-spacing:normal;
-webkit-text-size-adjust: 100%; 
-webkit-appearance: none;
border-radius:0px;
z-index:1;
outline:none;
background-repeat:no-repeat;
}

a, span, strong, em, table, tr, td ,ul li   { color:inherit; font-size:inherit}
strong{ font-weight:bold;}
input  , select {border-radius:0; }
 

select {
-webkit-appearance: none;
appearance: none;
 padding: 0 5px 0 4px; 
height:36px; 
border:2px solid #ccc;
background-color:#fff;
}

 @media screen and (-webkit-min-device-pixel-ratio:0) {  /*  safari */
 select {
	background-image: url(../images/icons/selectDD.png);
	background-position :99% 50%;
	background-repeat:no-repeat;background-size:24px auto;
	-webkit-appearance:none;
	padding-right:  40px;  
  }  }



.fadeContent{  opacity: 0.3;
-webkit-transition:all 0.3s ease-in-out;
-moz-transition:all 0.3s ease-in-out;
-o-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}
 

#ajaxContainer{
position: fixed;
top:0px;
left:0px;
bottom:0px;
right:0px;
background-image:url(../images/bgTrans.png);
background-repeat:repeat;
z-index:1000; display:none
}

#loadingContent{
position: fixed;
top:0px;
left:0px;
bottom:0px;
right:0px;
background-image:url(../images/bgTrans.png);
z-index:1000; background-repeat:repeat;
display:none
} 

#loadingContent span{
position:absolute;
top:40%;
left:0px; width:100%; 	color:#999; 
font-weight: bold;
font-family:Arial, Helvetica, sans-serif; text-align:center; font-size:0.8em;  
}
#loadingContent span img{
display:block;
padding:5px;
margin:0 auto 5px;
height:42px;  background-color:#FFFFFF;
}



/*outer*/
#header{ width:100%; position:relative }

#contentWrapper{
clear: both; 
text-align:left;
z-index: 1;
margin: 0px auto 0px auto; 
background-color:#FFFFFF; 
}

#contentWrapperClear{ height:1px; width:100%; clear:both; display:block}	


#dialogueBox{
 position:fixed;
 width:300px;
 left:50%; margin-left:-150px;
 top:30%;
 text-align:center;
 z-index:1000;
 font-weight:bold;
 background-color:#FFFFFF;
 border:4px solid #999;
 padding:25px 20px 20px 20px;
 border-radius:4px;
-webkit-box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.10);
-moz-box-shadow:    0px 0px 12px 0px rgba(0, 0, 0, 0.10);
box-shadow:         0px 0px 12px 0px rgba(0, 0, 0, 0.10);
 display: none; 
 } 
 
#dialogueBox #dialogueBoxCloser{
position:absolute;
right:4px;
top:4px;
height:20px;
width:20px;
background-color:#FFFFFF;
background-image:url(../images/icons/closer.png);
background-repeat:no-repeat;
background-position:50% 50%;
background-size:9px;
cursor:pointer;
border-radius:2px;
border:2px solid #aaa;
opacity:0.7
} 
#dialogueBox #dialogueBoxCloser:hover{ opacity:1}

#dialogueBox #dialogueMessage{
 font-size:1em;
 color:#333; word-wrap:break-word
} 

#dialogeReturns{ border:0; background:none; clear:both; border-top:2px solid #f1f1f1; margin:6px auto 0px auto; height:30px; padding-top:6px}
#dialogueYes, #dialogueNo{
margin-top:6px;
 display:inline-block;
 margin:0 0px;
 font-size:0.9em;
 font-weight:bold;
 cursor:pointer; height:28px; line-height:28px;
 padding: 0px 10px;   border-radius:4px;
 color:#FFFFFF
}
#dialogueYes{   float:left; background-color:#99CC00; }
#dialogueNo{  float:right ; background-color:#FF0000; } 
#dialogueYes:hover, #dialogueNo:hover{ background-color:#666666 }
 

#breadcrumb{ 
display:block;  width:100%; overflow:hidden; background:#fff;  width:1000px; padding:8px 0 12px 0 ;margin:0px auto;
}	

#breadcrumb li { display:inline-block;}	
#breadcrumb li p , #breadcrumb li a , #breadcrumb li span { font-size: 0.8em;   font-weight: bold}
#breadcrumb li a {
color:#006699;
text-decoration:underline
}	
#breadcrumb li p {
color:#333;
font-style: normal;
margin:0;
padding:0
}
#breadcrumb li span {
color:#e1e1e1; padding:0 2px 0px 6px
}	

#breadcrumb li:last-child span{ display:none}


p#pageBanners{ width:100%; margin:0 auto 10px auto; padding:0 }
p#pageBanners img{ width:100%; margin:0 auto; border:0px solid #e1e1e1; padding:0px;}

 
 
.contentFull ul ,
.contentRight ul { 	margin:0 auto;   padding:  5px;  }
 .contentRight ul li  { margin:0 0 0 15px; list-style-position: inside; } 
	
.contentLeft ul { 	margin:0 auto;   padding: 5px 0; list-style:none  } 
.contentLeft ul li  { padding:2px 0; list-style:none; margin:0}
.contentLeft p{ margin:5px 0}

.my-learning .contentLeft ul{ margin:10px auto}

.contentFull ul.faqList, ul.faqList{ list-style:none; padding:0; margin:0;}
.contentFull ul.faqList li, ul.faqList li{ list-style:none; margin:0 ; padding:0}
ul.faqList li h3{
font-weight:bold;
cursor:pointer;
font-size:18px;
color:#006699;
margin:5px 0 0  0;
}
ul.faqList li h3:hover{ color:#444}

ul.faqList h3 span{
width:14px;
height:14px;
display:inline-block;
margin-right:4px;
background-image:url(../images/icons/arrowRGray.png);
background-repeat:no-repeat;
background-position:  50%;
-webkit-transition: all 200ms;
-moz-transition: all 200ms;
-o-transition: all 200ms;
transition: all 200ms;
}


ul.faqList h3.faqOpen span{
background-image:url(../images/icons/arrowR.png);
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg); 
}

.contentFull ul.faqList li div, ul.faqList li div{ font-size:16px; padding:0px 0 30px 20px;}





/* site images JQ add class for pop up in fnc */
.siteImage{ cursor:pointer;}
.siteImage:hover{
opacity: 0.9;
-webkit-transition:all 0.1s ease-in-out;
-moz-transition:all 0.1s ease-in-out;
-o-transition:all 0.1s ease-in-out;
transition:all 0.1s ease-in-out;
border-color:#666666
}

 
/* bgs and gradients */
.bgBlack{ 	background-color: #333333; color:#FFFFFF;}

.bgBlueDk{	background-color: #003366; 	color:#FFFFFF;}

.bgBlueLt{ background-color: #7195A9;color:#FFFFFF;text-shadow:1px 1px #777;}

.bgGrayLt{ 	background-color: #D2D2D2;	color:#333;}

.bgGrayMid{ background-color:#A3A3A3;color:#FFFFFF;/*text-shadow:1px 1px #999;*/}

.bgGrayDk{ 	background-color: #6C6C6C; 	color:#FFFFFF;}

.bgGreen{ 	background-color: #99CC00; 	color:#FFFFFF;}

.bgRed{ background-color: #D40000;color:#FFFFFF; }

.bgRedDk{ background-color: #780000;color:#FFFFFF; } 	

.gradient{
background-image:url(../images/gradientBG.png);
background-position:left top;
background-repeat:repeat-x; 
}

/* bgs and gradients */



/* ####### buttons  */

.buttons25,
.buttons50,
.buttons75, 
.buttons100, 
.buttons125, 
.buttons150,  
.buttons175, 
.buttons200,
.buttons250,
.buttonsFULL  {
background: transparent;
font-family: "Open Sans", Arial, Helvetica, sans-serif;  
text-align:left;
cursor:pointer;
border: 0px;
height:44px; line-height:44px;
border-radius:25px;
color:#FFFFFF; 
padding: 0 15px; text-align:center; position:relative; 
}

 

.buttonsRed{
color: #FFFFFF;
background-color: #DF0000;
background-image: linear-gradient( to bottom , #DF0000  , #C80000 );
}

.buttonsGray {
color: #FFFFFF; 
background-color: #606060;
background-image: linear-gradient( to bottom , #555  , #333 );
}

.buttonsLtGray {
color: #fff;
background-color: #DBDBDB; 
background-image: linear-gradient( to bottom , #999  , #777 );
}

.buttonsGreen {
color: #3E4812 !important;
background-color: #CDDA00;
background-image: linear-gradient( to bottom , #CDDA00  , #CDDA00 );
}

.buttonsBlue  {
color: #FFFFFF;
background-color: #274360;
background-image: linear-gradient( to bottom , #385F87  , #274360 );
text-shadow:1px 1px #333;
}

.buttonsBlack  {
color: #FFFFFF; 
background: #111; 
background-image: linear-gradient( to bottom , #111  , #000 );

}






.buttonsLoading{
background:none;
background-image:url(../images/loading-spinner.gif);
background-repeat:no-repeat;
background-position: 50% 50%;
background-size:35px; text-indent:-10000px
}

 
/* over ride text as rest are white*/
a.buttonsLtGray,
.contentFull   a.buttonsLtGray,
.contentRight a.buttonsLtGray,
.contentLeft a.buttonsLtGray,
.contentRight p a.buttonsLtGray,
.contentLeft p a.buttonsLtGray{
color: #666666; 
}	

 
.buttons25:hover ,
.buttons50:hover ,
.buttons75:hover , 
.buttons125:hover , 
.buttons150:hover ,  
.buttons175:hover , 
.buttons200:hover ,
.buttons250:hover ,
.buttonsFULL:hover,
.buttonLinks:hover{ 
background: #424242; 
color:#FFFFFF;  }


.buttonsBlack:hover { background:#333}



.buttonLinks, *.buttonLinks, .buttonLinks *, 
a.buttonLinks,
.contentFull a.buttonLinks,
.contentRight a.buttonLinks,
.contentLeft a.buttonLinks,
.contentRight p a.buttonLinks,
.contentLeft p a.buttonLinks { 
padding:15px 15px; line-height: normal; height:auto;
display:inline-block;   font-size:14.2px; letter-spacing:0.1px; font-weight:bold;
color: #fff   ; text-decoration:none ; border-radius:25px; width:100%; text-align:center; 
}

/* for blocking buttons out */

.buttonWrapper, 
div.buttonWrapper, 
p.buttonWrapper, 
.contentFull		p.buttonWrapper,
.contentLeft		p.buttonWrapper,
.contentRight p.buttonWrapper{ 
height:34px; display:block; clear:both; margin:3px auto
}

/*used with levelNumber css */
.numbers , *.numbers{ display:inline-block; padding:1px 0; color:#FFF; min-width:20px;  margin-right:4px; text-align:center; font-weight:bold; border-radius:3px; font-size:11px;}
.cursor:hover , *.cursor:hover  ,* .cursor:hover{ cursor:pointer; text-decoration:underline}

/* account page links*/
#accountLinks{ display:block; clear:both; padding:10px 0;}
#accountLinks li{ 
display:block; clear:both; 
height:44px;  
 
padding: 12px 0 0 32px;
margin:0;
}
#accountLinks li a{font-weight:bold;
font-family: Arial, Helvetica, sans-serif;
display:inline-block;   color:#006699;  font-size:1.1em;
}

#accountLinks li a:hover{ color:#00496D }


#homePageNav{ display:block; clear:both; padding:10px 0;}
#homePageNav li{ 
	color: black;
	display: block;
	clear: both;
	height: 80px;
	margin-bottom: 20px;
	border: 1pt solid #F0F0F0;
	box-shadow: 0 2px 6px 1px rgba(0, 0, 0, 0.07);
}
#homePageNav li a{font-weight:bold; 
display:inline-block;   color:#595959;  font-size:16px; padding: 31px 120px 27px 102px;
}

#homePageNav li a:hover{ color:#00496D } 
#homePageNav li#learningLink {
	background-image: url(../images/homePageNav/training-icon-1@2x.png);
	background-position: 20px 15px;
	background-size: 47px auto;
}
 
li#learningLink::after {
	content: "\f054";
	font-family: "FontAwesome";
	color: black;
	font-size: 20px;
}

li#resultsLink::after {
	content: "\f054";
	font-family: "FontAwesome";
	color: black;
	font-size: 20px;
}
    
#homePageNav li#resultsLink{
background-image:url(../images/homePageNav/training-icon-2@2x.png);
background-size: 47px auto;
background-position:23px 15px;;
}
#homePageNav li#evalLink{
background-image:url(../images/homePageNav/evaluations.png);
background-position:1px 12px;
}
#homePageNav li#signOutLink{
background-image:url(../images/homePageNav/accountIconSignOut.png);
background-position:0 12px;
}   

/*.contentFull .standardNav ,
.contentRight .standardNav ,
.contentRight.standardNav  ,*/
ul.standardNav,  * ul.standardNav{    
margin: 0px 0px 10px 0px  ; padding:0
}

.contentFull .standardNav li ,
.contentRight .standardNav li ,
* .standardNav li , .standardNav li { display:block; clear:both;  margin:1px 0; padding-bottom:15px;}

.evaluationRight .standardNav  li { background:none; border-bottom:1px solid #e1e1e1; margin:6px auto 0 auto; padding-bottom:6px;}
.evaluationRight .standardNav  li:last-child{ border-bottom:none;}

.standardNav li h3{
display:block;
text-decoration:none; 
font-weight:bold;
padding: 4px 0 0px 0px;
margin:0px auto 0 auto;
border:0px; 
cursor:pointer;
position:relative;
font-size:16px;
font-weight: normal;
display:block; position:relative
}


.contentFull .standardNav li a,
.contentRight .standardNav li a,
.standardNav li a{
text-decoration:none;
font-size:14.6px;
margin:0px 0;
padding:0px 0 0px 16px;
background-image:url(../images/icons/arrowRGray.png);
background-repeat:no-repeat;
background-position:2px 5px;
border-bottom:0px solid #e1e1e1;
color: #006699;
display:inline-block;
font-weight: normal
}

.standardNav li a strong{font-size:18px;} /*evals required link*/

.contentFull .standardNav li img, .standardNav li img{ width:100%; width:500px; margin:5px 0; display:block;}

.standardNav li a:hover{ color:#333333  }

.standardNav li ul li { background:none; border:none}



.standardNav li ul{ padding:0 0 0px 0} 

.standardNav li  a.docLink ,.standardNav li  a.pdfLink , .standardNav li  a.ytLink , .standardNav li  a.pptLink , .standardNav li  a.xlLink, .standardNav li  a.imgLink, .standardNav li  a.urlLink,
.standardNav li span.docLink ,.standardNav li span.pdfLink , .standardNav li span.ytLink , .standardNav li span.pptLink , .standardNav li span.xlLink, .standardNav li span.imgLink, .standardNav li span.urlLink{
 padding-left:26px; background-position:left 5px; background-size:16px auto;
	}

.standardNav li a.docLink, .standardNav li span.docLink{  background-image:url(../images/fileTypes/word.png) ;}
.standardNav li a.pdfLink, .standardNav li span.pdfLink{ background-image:url(../images/fileTypes/pdf.png);}
.standardNav li a.ytLink, .standardNav li span.ytLink{background-image:url(../images/fileTypes/youtube.png);}
.standardNav li a.pptLink, .standardNav li span.pptLink{background-image:url(../images/fileTypes/ppt.png);}
.standardNav li a.xlLink, .standardNav li span.xlLink{ background-image:url(../images/fileTypes/xl.png) ;}
.standardNav li a.imgLink, .standardNav li span.imgLink{background-image:url(../images/fileTypes/img.png);}
.standardNav li a.urlLink, .standardNav li span.urlLink{background-image:url(../images/fileTypes/url.png);background-size:14px auto;} 


/* COMPS / TOPICS PAGE*/
.learningNav li  , .contentRight ul.learningNav li  { display:block; clear:both;  margin:1px 0; padding-bottom:10px;  }

.learningNav li h3{
display:block;
text-decoration:none; 
font-weight:bold;
padding: 4px 0 0px 0px;
margin:0px auto 0 auto;
border:0px; 
cursor:pointer;
position:relative;
font-size:16px;
font-weight: normal;
display:block; position:relative
}

.learningNav li a{
text-decoration:none;
font-size:17px !important;
margin:3px 0;
padding:0px 0 10px 16px;
background-image:url(../images/icons/arrowRGray.png);
background-repeat:no-repeat;
background-position:2px 5px;
border-bottom:0px solid #e1e1e1;
color: #006699;
display:inline-block;
font-weight: bold
}

.learningNav li a.isPassedClass { color:#888; background-image:url(../images/icons/tickGreen.png); background-size:10px auto ;background-position:0px 6px }

/* COMPS PAGE*/

/* button icons*/
.buttons25  span ,
.buttons50 span ,
.buttons75 span ,
.buttons100 span ,
.buttons125 span ,
.buttons150 span ,
.buttons175 span , 
.buttons200 span ,
.buttons250 span ,
.buttonsFULL  span { background-repeat:no-repeat; background-position: right 50%; background-repeat:no-repeat; position:absolute; height:100%; width:30px; right: 10px; top:0px; } 


span.iconArrowW{ background-image:url(../images/icons/arrowRwhite.png); }	
span.iconArrowB{	background-image:url(../images/icons/arrowR.png);}	
span.iconPlusW{background-image:url(../images/icons/plusWhite.png);}	
span.iconPlusB{	background-image:url(../images/icons/plus.png);}	
span.iconMinusW{	background-image:url(../images/icons/minusWhite.png);}	
span.iconMinusB{	background-image:url(../images/icons/minus.png);}	



.buttonsTrash, a.buttonsTrash, 
.contentRight .buttonsTrash,
.contentRight a.buttonsTrash {
cursor: pointer;
height: 25px;
width: 25px;
background-image: url(../images/trash.png);
background-color: transparent;
border: 0;
background-repeat: no-repeat;
background-position: center;
text-decoration:none
} 

 
 

.checkboxRadioList{ position:relative; text-align:left}

.hiddenInput, 
.checkboxRadioList input[type=radio],
.checkboxRadioList  input[type=checkbox]{ position:absolute; left:-99999px; top:0}

.checkboxRadioList li { position:relative; text-align:left;
min-height:26px;
font-size:0.9em; 
} 

.checkboxRadioList input[type=checkbox] + label span,
.checkboxRadioList input[type=radio] + label span{ 
position:absolute; left:0px; top:0px;
border:1px solid #999;
width:22px;
height:22px;
margin: 0 10px 0 0;
background-position:50% 50%;
background-image:none;
background-color:#fff;
background-repeat:no-repeat;
transition:all 0.1s ease-in-out;
}

.checkboxRadioList input[type=radio] + label span{ 
border-radius:12px; }

.checkboxRadioList input[type=checkbox] + label strong,
.checkboxRadioList input[type=radio] + label strong{
position: relative;
display:inline-block;
padding:2px 0 0 28px;
cursor: pointer;
color:#555;
font-size: 1em;
}

.checkboxRadioList  input[type=checkbox]:checked + label strong,
.checkboxRadioList  input[type=radio]:checked + label strong { color:#759C00; } 


.checkboxRadioList  input[type=checkbox]:checked + label span,
.checkboxRadioList  input[type=radio]:checked + label span {
background-image: url(../images/checked.png); border-color:#333;
}
 







#googleMapOuter{
height:400px;
width:100%;
border:2px solid #ccc;
padding:5px;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
border-radius:  1px; 
margin:10px 0 0 0 
}

@media only screen and (orientation:landscape)   { 
#googleMapOuter{	height:800px;}
}

@media only screen and (orientation:portrait)   { 
#googleMapOuter{	height:500px;}
}



#googleMap { 
height:100%; width:100%;
display:block
}

#googleMap p{ margin:0; padding:3px; font-size:14px; text-align:left; width:200px; height:auto; overflow:visible; font-family:Arial, Helvetica, sans-serif}	

#googleMap img{ max-width:inherit; max-height:inherit}
#googleMap p  img { width:120px; display:block; padding:0px; border:1px solid #fff; margin: 6px 0 }




	/* comps / topics needs to copy changes to admin version */
	#topicSplashWrapper{ margin:10px auto 0 auto; border:2px solid #e1e1e1; border-radius:3px; padding:3px; width:450px;  height:250px;  text-align:center; max-width:100%;}
#topicSplashPlaceholder{width:100%;  height:100%; text-align:center; position:relative;  background-position:50% 50%; background-size:cover; background-repeat:no-repeat; }
#topicSplashPlaceholder img { height:80px; width:80px;position:absolute;cursor:pointer; left:135px; top:70px;  left:calc(50% - 40px); top: calc(50% - 40px) }
#topicSplashIframe{  width:100%; height:auto; height:100%; margin:0 auto; border-radius:2px;display:block; float:left }
p#videoTitle{ text-align:center; margin:5px auto; font-size:12px; max-width:600px}



/* cookies */

#cookieAlertWrap{
width:100%;
position:fixed;
z-index:1000;
bottom:0px;
right:0px  ;
padding:0px 20px;
height:80px;
background-image:url(../images/cookiesBg.png);
background-repeat:repeat
}

#cookieAlertWrap p{ 
font-size:14px; 
color:#e1e1e1; 
padding :0px; 
margin:0px;  line-height:80px;
font-family:Arial, Helvetica, sans-serif;
}

#cookieAlertWrap p strong{
font-family:Arial, Helvetica, sans-serif;
display:inline-block; color:#FFFFFF; padding-right:10px;
} 

#cookieAlertWrap #closer{
padding:0px;
height:34px;
width:34px;
text-align:center;
color:#fff;
font-size:1px;
text-indent:-2000px;
position:absolute;
right:12px;
top:22px;
cursor:pointer;
background-image:url(../images/icons/deleteWhite.png);
background-repeat:no-repeat;
background-position:50% 50%;
background-color:#666666;
-webkit-transition: all 500ms ease-in-out 0s;
-moz-transition: all 500ms ease-in-out 0s;
-o-transition: all 500ms ease-in-out 0s;
transition: all 500ms ease-in-out 0s;

}
#cookieAlertWrap #closer:hover{ 
background-color:#FFFFFF; background-image:url(../images/icons/delete.png);
-webkit-transition: all 500ms ease-in-out 0s;
-moz-transition: all 500ms ease-in-out 0s;
-o-transition: all 500ms ease-in-out 0s;
transition: all 500ms ease-in-out 0s;
}

#cookieAlertWrap #pageLink{
text-decoration:none;
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
display:inline-block;
margin:0;
padding: 0px 0 0 10px;
color:#99CC00;
text-decoration:underline;
}
#cookieAlertWrap #pageLink:hover{ color:#99CC00}

  
.ui-autocomplete{ max-width:400px; border:2px solid #ccc; padding:10px 4px; background:#fff; max-height:250px; overflow:auto}  
.screen .ui-autocomplete{ max-width:936px;}
.ui-autocomplete li { width:100%; padding:2px 3px; border-bottom:1px solid #e1e1e1; cursor: pointer;font-size:11px; font-weight:bold} 
.ui-autocomplete li:hover{ background-color:#f1f1f1;}
.autocompletedLine1{ font-weight: normal;}

.ui-autocomplete li.ui-state-focus, .ui-autocomplete li.ui-state-focus p{background-color:#f2f2f2; color:#069 }


.ui-helper-hidden-accessible { display:none; }