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 :right 50%;
	background-repeat:no-repeat;
	-webkit-appearance:none;
	padding: 0 48px 0 10px; 
 height:44px; border:1px solid #ccc;  
  }  }
   
.questsions hr{ clear:both; border:0px; height:0px; background:none; }

.w50{ width:50px}
.w75{ width:75px;} 
.w100{ width:100px;}
.w125{ width:125px;}
.w150{ width:150px;} 
.w175{ width:175px;} 
.w200{ width:200px;} 
.w250{ width:250px;} 
.w300{ width:300px;} 
.w350{ width:350px;} 
.w400{ width:400px;} 
.w450{ width:450px;} 
.w500{ width:500px;} 
.w600{ width:600px;} 
.w50Percent{ width: 50%;} 
.w100Percent{ width: 100%;} 

.mobile .w50,
.mobile .w75,
.mobile .w125,
.mobile .w150,
.mobile .w175,
.mobile .w200,
.mobile .w250,
.mobile .w300,
.mobile .w350,
.mobile .w400,
.mobile .w450,
.mobile .w500,
.mobile .w600 { width:100%; max-width:500px} 


input[type=text] , select {   border:2px solid #e1e1e1; height:36px; font-size:0.9em; color:#555; } 
input[type=text] { padding-left:6px}
select  option{ border-bottom:0px solid #e1e1e1; padding:0px 4px; margin: 0 0px; }
select .optGroupLabel, .optGroupLabel{ font-style:normal; font-weight:bold; color:#006699; font-size:1.2em; padding: 8px;}


input[type=text].inputsErr ,
select.inputsErr ,
ul.optionsList.inputsErr,
.optionsList .inputsErr { border-color:#FF0000}

/* checkbox radios */
ul.optionsList , .optionsList {   list-style:none; margin:0 0 0  0px; padding:0 0px  0px  0px; height:auto;  display:block;   border:0px solid #e1e1e1;}


.optionsList li {  list-style:none; margin:0px auto; padding:0; clear:both; position:relative; }


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

.optionsList  input[type=radio]  + label,
.optionsList  input[type=checkbox]  + label {
min-height:30px;
font-size:0.85em;
cursor:pointer; 
position:relative;
}

/* inline/block  list options */ 
.inlineList li {  list-style:none; margin:5px 24px 0 0 ; padding:0; clear:none; display:inline-block}

.optionsList.inlineList  input[type=radio]  + label,
.optionsList.inlineList  input[type=checkbox]  + label {
display:inline-block; 
	margin-right:20px;
clear:none;
}
 
.blockList li {
display:block;
clear:both;
margin:6px auto; padding:0 5px;
}

.mobile .blockList li { margin:14px auto}

.optionsList.blockList  input[type=radio]  + label,
.optionsList.blockList  input[type=checkbox]  + label {
display:block;
clear:both;
}


/* inline/block  list options */ 


.optionsList  input[type=radio]  + label:hover, 
.optionsList  input[type=checkbox]  + label:hover{  text-decoration: none; }

/*spans = checkbox/radio select || Strong = label wording */
.optionsList  input[type=radio]  + label span,
.optionsList  input[type=checkbox]  + label span{
position:absolute;
left:0px;
top:0px;
border:2px solid;
border-color:#AEAEAE;
width:22px;
height:22px;
margin: 0 10px 0 0;
background-position:50% 50%;
background-image:none;
background-color:#fff;
background-repeat:no-repeat;  
-webkit-transition: border 200ms ease-in-out 0s;
-moz-transition: border 200ms ease-in-out 0s;
-o-transition: border 200ms ease-in-out 0s;
transition: border 200ms ease-in-out 0s;
}

.optionsList  input[type=checkbox]  + label span{ border-radius:100%;}
.optionsList  input[type=radio]  + label span{ border-radius:100%;}

 .optionsList  input[type=radio]:hover  + label span ,
.optionsList  input[type=checkbox]:hover  + label span{ 
border: 2px solid #587B16;border-color:#555
} 
  
.optionsList  input[type=radio]:checked:hover  + label span ,
.optionsList  input[type=checkbox]:checked:hover  + label span{border-color:#555}

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

.optionsList  input[type=radio]:disabled  + label span ,
.optionsList  input[type=checkbox]:disabled  + label span{ 
border-color:#ccc;
}




.optionsList  input[type=radio]  + label strong{
	font-weight: normal;
	display:block;
	padding:2px 0 0 40px;
	line-height:1em;
	color:#575353;
	font-size:1.05em;
}
.optionsList  input[type=checkbox]  + label strong{
font-weight: normal;
display:block;
padding:2px 0 0 40px;
line-height:1em;
color:#575353;
font-size:1.05em;
}

.optionsList  input[type=radio]:checked + label strong{
	font-weight: normal;
}
.optionsList  input[type=checkbox]:checked + label strong{
	font-weight: normal;
}


.optionsList  input[type=radio]:disabled + label strong,
.optionsList  input[type=checkbox]:disabled + label strong{ 
	font-weight: normal;
color:#ccc
}

/* "other" fields */
.optionsList  .others strong{ color:#888; font-size:0.75em; padding:10px 0 3px 0; display:block;} 
.optionsList.inlineList li.others , .optionsList.blockList li.others {width:100%; display:block; clear:both; margin-bottom:20px; }
.optionsList.inlineList li.others input, .optionsList.blockList li.others input{ 
height:32px; width:100%; max-width:400px; display:block; clear:both; border:2px solid #999; margin:0 0 5px 0
}

 

/* show hide stuff  */
ul.optionsList , .optionsList {
overflow:hidden;
overflow-y:auto;
background:#fff;
}


.optionsListClosed{
max-height:160px;
overflow: scroll;
}

.mobile .optionsListClosed{ max-height:none; height:auto; overflow:hidden}

.optionsList li {  list-style:none; margin:0px auto; padding:0; clear:both; position:relative; }
.optionsList li.listTitle {
line-height:1em;
font-size:0.85em;
font-weight:bold;
margin:0px auto 6px auto;
padding:8px 0 8px 8px;
text-shadow:1px 1px #fff;
background-color:#F1F1F1;
border:1px solid #e1e1e1;
border-radius:2px;
color: #005C8A;
background-image: linear-gradient( to bottom, #F1F1F1, #e1e1e1 );
}
 

.optionsList li.listTitle:hover{ cursor:pointer; background:#e1e1e1;
background: linear-gradient( to bottom, #e1e1e1, #e1e1e1	 ); 
}

.optionsList li.listTitle.inputsErr{ color: #FF0000}

.listTitle img{ 
height:8px; margin: 2px 8px 0 0px; float:right;
-webkit-transition: all 200ms ease-in-out 0s;
-moz-transition: all 200ms ease-in-out 0s;
-o-transition: all 200ms ease-in-out 0s;
transition: all 200ms ease-in-out 0s;} 

.optionsList.optionsListClosed .listTitle img{ 
transform: rotate(180deg); 
} 

.mobile .optionsList li.listTitle, .mobile .optionsList li.listTitle:hover { color:#555; margin-bottom:10px; background:#fff; border:0px;}
.mobile .optionsList li.listTitle img{ display: none}



 /*// FULL SLIDERS*/ 
.sliders  { width:90%; width:calc(100% - 60px) ; margin:30px auto 70px auto; clear:both;} 
.mobile .sliders  { width:90%;  }

.itemLabel{ font-size:0.8em; color:#333; font-weight: bold; clear:both } /*  labels for product names */
.sliders .itemLabel{margin-left: 0px; font-size:12px; } /* sliders inset to match init for slider 	 */


.sliders div.tracks{ /*track*/
margin:20px  0px 0px  0px ;
width:100%; height:16px; display:block; position:relative;
background: linear-gradient( to bottom, #f1f1f1, #e8e8e8 ); 
border:1px solid #ccc;
border-radius:4px;
cursor:pointer;
}

.sliders div.tracks div.ui-slider-range-min{
position:absolute;
top:0px;
background-color: #c1c1c1; 
height:14px;
border-radius:3px 0 0 3px;

} /* left selected area */


.sliders  .ui-slider-handle  {  /*handle*/
width:26px; 
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
 outline: none; border:1px solid #fff;

cursor:pointer;
text-align:center; 
height:26px;
position: absolute;
z-index: 2;
padding: 0;
top: -5px;
margin-left: -13px;
background-color:#ccc;
background: linear-gradient( to bottom, #d1d1d1, #c1c1c1 );
 
} 

.sliders .beenClicked  .ui-slider-handle {
background-color:#CDDA00;
}



.sliders span em{ /* number inside 
 border:1px solid #ccc;
border-radius:16px;
position:absolute;
left: -9px;
top:9px;
width:22px;
height:22px; line-height:20px;
font-size:0.75em;
font-weight:bold;
font-family: Arial, Helvetica, sans-serif;
color:#333;
font-style: normal;
text-align: center; z-index:100; background-color:#fff; 
 */
display: none;
} 


ul.markers {text-align: justify; margin:6px auto ;  clear:both; padding:0; position:relative;height:24px; border:0px solid;}
ul.markers::after {
width: 100%; display: inline-block; content: "."; visibility: hidden
}
ul.markers li {
display: inline-block; 
margin:0;
width:1px;
height:1px;
height:auto;
padding:10px 0px  0 0px;
font-weight:bold;
border-left:1px solid #e1e1e1;
text-align:left ;
cursor:pointer; position:relative;   
font-family: Arial, Helvetica, sans-serif;   } 
  
ul.markers li span {
padding:4px 0;
position:absolute;
clear:both;
color:#727272;
text-align: center;
border:0px solid #ccc;
margin:0;
text-shadow:2px 2px #fff;
min-height:30px;
white-space: normal;
word-wrap: break-word;
padding:0 5px 0 5px; /* for spacing against next */
font-size:14px; /*fixed font size */
width:100px;
margin-left:-50px;
}
ul.markers li:hover span{color:#444; text-decoration:none}
ul.markers li.activeMarker {border-left:1px solid #333;}
ul.markers li.activeMarker span{ color: #CDDA00; font-weight:bold; }

ul.markers li input[type=radio]{ position:absolute; left:-20000px;}
/* eo sliders */ 






/*switch */ 
.switches  { clear:both; margin:10px auto;  }
.contentFull ul.switches  ul ,  .switches  ul {
position:relative;  position: relative;  list-style:none; margin:10px 0; padding:0;  }

.contentFull ul.switches  ul  li , .switches  ul  li { 
background: linear-gradient( to bottom, #f9f9f9, #e8e8e8 ); width:80px ;  
border:1px solid #ccc; list-style:none; margin:0; padding:0; display: inline-block; height:30px;  border-radius:6px;}

.switches  input[type=radio],  .switches   input[type=checkbox]{  position:absolute; left:-99999px; top:0; } 
.switches   input[type=radio]  + label , .switches   input[type=checkbox]  + label { display:block; width:100%; height:100%; cursor: pointer}
.switches   input[type=radio]  + label span,  .switches   input[type=checkbox]  + label span {
display:block; 
border-radius:4px; 
width:50%; height:28px; text-align:center;
padding:0px 0 0 0px;  
font-size:0.7em;
background-image:url(../images/gradientBG.png); background-position:left bottom; background-repeat:repeat-x;
background-color:#e1e1e1; 
margin:0; 
color:#fff;
-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;
cursor:pointer
} 

.switches   input[type=radio]:checked  + label span ,
.switches   input[type=checkbox]:checked  + label span{
margin-left:50%;
background-color:#888
}

.switches   input[type=checkbox]  + label span  em,
.switches   input[type=radio]  + label span  em{
text-align:center;
font-size:1em;
font-weight:normal;
width:100%;
height:28px;
line-height:28px;
color:#fff;
font-style:normal
} /* on/off label*/

.switches   input[type=radio]  + label span em:first-child ,  .switches   input[type=checkbox]  + label span  em:first-child{ display:block; }
.switches   input[type=radio]  + label span em:last-child ,  .switches   input[type=checkbox]  + label span  em:last-child{ display:none;}
.switches   input[type=radio]:checked   + label span em:first-child ,  .switches   input[type=checkbox]:checked   + label span  em:first-child{ display:none;}
.switches   input[type=radio]:checked   + label span em:last-child ,  .switches   input[type=checkbox]:checked   + label span  em:last-child{ display:block; }
/*switch */ 
 

.freeText{ border:2px solid #e1e1e1; margin:10px auto;font-size:1em; padding:10px; height:100px; width:100%;}
 

/*  quiz*/
.questionButtons{
width:100%;
max-width:500px;
height:44px;
clear:both;
margin:10px auto 10px auto;
background-color:#005580;
background: linear-gradient( to bottom, #006699, #005580 );
text-align:center;
cursor:pointer;
color:#FFFFFF;
font-weight: bold;
font-size:0.91em;
border-radius:4px;
}
.questionButtons:hover{ background:#333} 

/* eo quiz*/



/*  eval */ 


#progress{
margin:20px auto 10px auto;
clear:both;
background-color: #FF6600;
background: linear-gradient( to right , #FF6600	, #DD5800 );
border:0px solid #999;
border-radius:2px;
}
#progress span{
display:block;
background-color: #87B400;
background-image: linear-gradient( to bottom  , #87B400 ,  #7BA500);
min-width:50px; /*  to allow text*/
color:#FFFFFF;
-webkit-transition:width 0.8s ease-in-out 200ms;
-moz-transition:width 0.8s ease-in-out 200ms;
-o-transition:width 0.8s ease-in-out 200ms;
transition:width 0.8s ease-in-out 200ms;
text-align:center;
border-radius: 2px 0 0 2px ;
border-right:1px solid #fff;
}

#progressText{
display:inline-block;
height:24px;
line-height: 24px;
text-shadow:1px 1px #888;
margin:0 auto;
text-align:center;
font-size:0.72em;
font-weight:bold;
letter-spacing:0.2em;
font-family: Arial, Helvetica, sans-serif;
border-radius: 4px;
}


.contentRight ul.questionNav,
.questionNav{
display:block;
height:40px;
margin:10px auto;
position: relative;
list-style: none;
padding:0;
}
.previousQuestion, 
.nextQuestion   {
display:block;
width:100px;
height:40px;
line-height:40px;
background-color:#666666;
background-image: linear-gradient( to bottom, #717171, #616161 );
text-align:center;
cursor:pointer;
border-radius:4px;
text-shadow:1px 1px #333;
letter-spacing:1px;
background-repeat:no-repeat; 
margin:0;
padding:0;
}

.previousQuestion:hover,
.nextQuestion:hover { 
background-image: linear-gradient( to bottom, #393939, #313131 );
}

.previousQuestion{ float:left}
.nextQuestion{ float:right} 

.previousQuestion strong, 
.nextQuestion strong {
position:relative;
width:100%; padding-left:15px;
margin:0 auto; display:block;
text-align:center;
color:#fff;
font-size:0.78em;
font-weight:bold;
-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.2s ease-in-out;	background-repeat:no-repeat;
}

.screen .previousQuestion:hover strong, 
.screen .nextQuestion:hover strong {  } /*animates arrow not mb */

.previousQuestion strong{
background-image: url(../images/icons/arrowLwhite.png);
background-position:5% 50%;
}
.nextQuestion strong { 
background-image: url(../images/icons/arrowRwhite.png);
background-position:95% 50%;
} 

.nextQuestion.nextQuestionErr,
.nextQuestion.nextQuestionErr:hover,
.nextQuestionErr:hover {
background-color:#E70000;
background-image: linear-gradient( to bottom, #E70000, #CF0000 );
text-shadow: none
}

hr.testerEvalSep{ background-image:url(../images/semiTransLine.png); background-repeat:repeat-x; background-position:left 50%; height:12px; margin:0 auto; padding:0}

.evalFormTester .optionsList  input[type=radio]  + label strong{
display:block;
padding:6px 0 0 28px;
line-height:1em;
font-weight:bold;
color:#006699;
font-size:0.9em;
}


#doneButton{
text-align:center;
float:right;
width:100px;
font-size:0.75em;
font-weight:bold;
height:40px;
line-height:40px;
color:#fff;
background-color: #7BA500;
text-align:center;
cursor:pointer;
border-radius:4px;
text-shadow:1px 1px #696969;
background-image: linear-gradient( to bottom, #7BA500, #658800 );
}
/*  eval */