/* portfolio page*/

#portfolioList{ width:280px; float: left;
border:2px solid #e1e1e1; padding:10px; margin:10px 0 0 0}

#portfolioList li{ display:block;}
#portfolioList li h3{
display:block;
background-color:#777; text-transform:uppercase; font-size:0.8em;
color:#FFFFFF;
padding:8px 12px; margin-bottom:10px;
}

#portfolioList li a{
color:#0073AC;
font-size:0.96em;
font-weight: normal;
background-image:url(../images/icons/arrowRGray.png);
background-position:4px 10px;
padding: 4px 0 4px 16px;
display:block;
}

#portfolioList li a.selected{ color:#003366;background-image:url(../images/icons/arrowR.png);}

#portfolioPage { width:700px; float: right }
.mobile #portfolioPage { width:100%; float: none }

#portfolioPage  #contentList li a.title { font-size:16px;}
#portfolioPage  #contentList li h5.heading { font-size:14px; color:#565656	; font-weight:normal}
#portfolioPage  #contentList li p.tags strong{ font-size:12px; color:#999999; font-weight:normal;}
 #portfolioPage  #contentList li p.tags a{
font-size:12px;
color: #008DD2
}


/*  news/content/blog */ 

#categoryText{ border:0px solid #e1e1e1 ; padding:0px; margin:0 auto 10px auto ; border-radius:0px; font-size:0.85em; clear:both}
 

#archive{ width:225px; float:left; border:1px solid #e1e1e1; padding: 8px 6px 30px 6px; margin:5px 0 0 0; }


#archive h3{
font-size:1em;
color:#fff;
font-weight:bold;
height:40px;
line-height:40px;
padding:0  0 0 30px;
background-color:#555;
background-image: url(../images/icons/gridWhite.png);
background-repeat:no-repeat;
background-position: 8px 50%;
background-size:16px;
margin-bottom:10px;
}

#archive ul { list-style:none; padding:0 6px; }

#archive ul li { clear:both; display:block; margin:0px;}
 

#archive ul li a.showLatest{
font-size:1em;
font-weight:bold;
background:none;
margin:0;
padding:0px 5px 0px 0px;
display: inline-block;
color: #006699;
} /*match other year markers */

#archive ul li a.showLatestSelected{  }

#archive ul li p.yearMarkers, #archive ul li a.yearMarkers { font-size:1.0em; color:#99CC00; padding:0px 0 0 0px; font-weight:bold; cursor:pointer; margin:6px 0}
#archive ul li .arrowMarkers{
height:12px;
width:18px;
display:inline-block;
background-image:url(../images/icons/arrowRGray.png);
background-position:50% 50%;
background-repeat:no-repeat;
-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;

}

#archive ul li .arrowMarkersOn{
-webkit-transform: rotate(-270deg);
-moz-transform: rotate(-270deg);
-ms-transform: rotate(-270deg);
-o-transform: rotate(-270deg);
transform: rotate(270deg);
}

 

#archive ul.monthList{ display:none;  /* jq open close  */}

#archive ul.monthList a{
display:block;
color:#006699;
margin:4px 0 4px 12px;
padding:0px 0px 0px 0px; 
font-size:0.86em;
}
#archive ul .monthList a:hover{ text-decoration:underline; }
#archive ul .monthList a.selectedM{ font-weight:bold;
/*background-image:url(../images/icons/arrowR.png) */
}


#siteContent.withArchive { float:right; width:745px;} 
#contentList {text-align: left; margin: 10px auto 30px auto; list-style:none}
 
/* EO ARCHIVE  */
  
		

p#contentCategoryBanners{ width:100%; margin:0 auto 10px auto; padding:0 }
p#contentCategoryBanners img{ max-width:100%; margin:0 auto; border:0px solid #e1e1e1; padding:0px; max-height:400px;}		

/* site content */ 
#contentList  li a.title { color:#006699;font-size:1.1em; display:block; font-weight:600;}  /*     global font  / size for content*/
#contentList  li a.title:hover { text-decoration:underline}

#contentList li  p.dateAdded{
font-size:0.8em; display:block;
font-weight:normal; color:#999
}

#contentList .heading { font-size:0.9em;   font-weight:bold} 
#contentList .description , #contentList .description * { font-size:0.9em;} /* div wrapper or p tag*/



#contentList li  .prices{
display:block;
font-weight:bold;
font-size:1em;
color:#333
}

#contentList  li a.readMore{
display:block;color:#006699;font-size:0.9em; font-weight:bold; padding:6px 0 6px 12px;
background-image:url(../images/icons/arrowRGray.png);
background-position:left 50%; 
} 
   
#contentList li p.tags{padding-top:6px}
#contentList li p.tags strong{ color:#333333; }
#contentList li p.tags a{
 color: #0073AD;
 text-decoration:underline;
 padding:0 4px
}

.mobile  #contentList li p.tags, .mobile #contentList li p.tags *{ display:none}

 #contentList li .dateAdded{ font-size:0.8em; color:#999999}
 
 #contentList li hr{clear:both; height:10px;}

.mobile #archive, 
.mobile #siteContent { width:100%; float:none; clear:both}
 


 
@media only screen and (orientation:landscape)   {  
/*.mobile #contentList li { width:30%; height:300px; display:block; float:left; clear:none; margin:0 2% 0 0; padding:0; border:1px solid}
.mobile #contentList li a.imgWrap{ width:100%; height:200px;  margin: 0 ; display:block; float:none; overflow:hidden; text-align:right }
.mobile #contentList li a.imgWrap img{ }
.mobile #contentList li  .textWrap{ display:block; float:none; width:100%; padding: 10px 0  0px 0px; border:0px solid  }
.mobile  #contentList li .textWrapNoImages{ width:100%; padding:5px 0}*/
}  
 /*mobile */ 
 

 /*  search page */ 
 
#searchResponse{} 
/* site content */ 
#searchResponse  li a.title { color:#006699;font-size:1.0em; font-weight:bold;}
#searchResponse  li a.title:hover { text-decoration:underline}

#searchResponse li  p.dateAdded{
font-size:0.9em;
font-weight:normal; color:#999
}

#searchResponse .heading {   font-weight:bold} 
#searchResponse .description , #contentList .description * { font-size:0.9em;} /* div wrapper or p tag*/



#searchResponse li p.prices{
display:block;
font-weight:bold;
font-size:1em;
color:#FF0000
}

#searchResponse  li a.readMore{
display:none;
/*display:block;color:#006699;font-size:0.9em; font-weight:bold; padding:6px 0 6px 12px;
background-image:url(../images/icons/arrowRGray.png);
background-position:left 50%; */
} 

/*  eo search page */ 
 

#detailsImageWrap{ width:500px; overflow:hidden;  height:auto;   position:relative; z-index:1;float:left;}  
.mobile #detailsImageWrap{ width:100%; height:auto; float:none; border:0px solid #ccc; padding-top:0px; }  

 
	
	/* IMAGE CAROUSEL SLIDER*/
	
#imageSliders , #imageSliders li , #sliderThumbs , #sliderThumbs li { list-style:none; margin:0; padding:0}

#imageSliders {
border:1px solid #999;
width: 500px;max-width:100%;
height: 502px;
overflow-x: auto; /* better scrolling on mobile*/
overflow-y: hidden;
white-space: nowrap;
margin:  0px auto 0 auto;
font-size:0;
-webkit-overflow-scrolling: touch;
-webkit-scroll-snap-type: mandatory;
scroll-snap-type: mandatory;
-webkit-scroll-snap-points-x: repeat(100%);
scroll-snap-points-x: repeat(100%);
}

.screen #imageSliders {overflow-x: hidden;   /* hidden scrolbars on screen */ }

.mobile #imageSliders {
width: 400px;max-width:100%;
height: 402px;
}

#imageSliders li{
width: 100%;
height: 100%;
position: relative;
background-color: #fff;
display: inline-block; 
white-space:nowrap;
margin: 0 0px 0 0;position: relative;
}
.mobile #imageSliders li{} 


#imageSliders  li a{
display:block;
height:100%;
width:100%;
line-height:500px;
margin:0 auto;
text-align:center;
overflow:hidden;
z-index:1;
position: relative;
}
.mobile #imageSliders li a{ line-height:400px; } 

#imageSliders  li img{vertical-align:middle; margin:0 auto; } 
#imageSliders  li img.landscape  { width:90%; height:auto}
#imageSliders  li img.portrait{ height:90%; width:auto;}
#imageSliders  li img.square{ width:98%}

#imageSliders  li img.landscapeWithText{ width:90%; height:auto;margin-top:0%;}
#imageSliders  li img.portraitWithText{ height:85%; width:auto; margin-top:-8%;}
#imageSliders  li img.squareWithText{  height:85%;width:85%; margin-top:-8%;} 

#imageSliders li .imageTextArea{
font-size:13px;
display:block;
height:20px; 
text-align:center;
clear:both;
position:absolute;
bottom:10px; 
width:90%;
left:5%;
background:#fff;
color:#333;
z-index:1001;
overflow:hidden;
white-space: nowrap;
text-overflow:ellipsis;
}

#imageSliders li .videoButton{
position:absolute;
top:0;
width:100%;
height:100%;
z-index:1;
left:0;
background-image:url(../images/videoBtn.png);
background-position:50% 50%;
cursor:pointer;
opacity:0.6;
background-repeat: no-repeat;
}
#imageSliders li .videoButton:hover { opacity:0.8}
 
#sliderThumbs{clear:both; text-align:center; font-size:0;  margin:20px auto   }
#sliderThumbs li{ display: inline-block;  white-space:nowrap; margin:3px 5px; padding:0;
border:1px solid #bbb;
border-radius:2px;}

#sliderThumbs li:hover{border-color: #999;}
#sliderThumbs li.sliderThumbsHighlight, #sliderThumbs li.sliderThumbsHighlight:hover { border-color: #555;  }

#sliderThumbs a{
display:block;
margin:0 auto;
height:60px;
width:60px;
line-height:58px;
text-align:center; 
-webkit-transition:all 0.2s ease-in-out;
-moz-transition:all 0.2s ease-in-out;
-o-transition:all 0.2s ease-in-out;
transition:all 0.2s ease-in-out; 
position:relative;
} 

#sliderThumbs  li img{vertical-align:middle; margin:0 auto;   } 
#sliderThumbs  li img.landscape{ width:90%; height:auto}
#sliderThumbs  li img.portrait{ height:80%; width:auto;}
#sliderThumbs  li img.square{ width:80%; height:80%} 

	/* EO  IMAGE CAROUSEL SLIDER*/

	
	
	
#informationRight{float: right; width:480px; padding-right:10px } 
.mobile #informationRight{float: none; width:100%; padding:0; clear:both; margin:20px auto }


#informationRight.informationNoImage{ float:none; width:100%;}
#informationRight , #informationRight p  { font-size:1em;   }
#informationRight p  {  padding:0px 0 6px 0 }
#informationRight a { color:#006699; text-decoration:underline} 

#informationRight  a.videoLink,
#informationRight  a.docLink,
#informationRight  a.pdfLink,
#informationRight  a.xlLink {
height:30px; line-height:30px;
background-repeat:no-repeat; background-position: left; font-size:0.9em; font-weight:bold; text-decoration:none; display: inline-block;  clear:both; padding:0px 0}

#informationRight a.videoLink{
padding-left:30px;
background-image:url(../images/icons/videoSmGray.png);
background-position:4px 50%;
}
#informationRight  a.docLink{ padding-left:30px;  background-image:url(../images/fileTypes/word.png) ;background-position:left 50%;}
#informationRight  a.pdfLink{ padding-left:30px; background-image:url(../images/fileTypes/pdf.png);background-position:left 50%;}
#informationRight  a.xlLink{ padding-left:30px;  background-image:url(../images/fileTypes/xl.png) ;background-position:left 50%;}

 #informationRight a:hover { text-decoration:underline;}
  


#informationRight h1{
font-weight: bold;
font-size:1.3em;
text-shadow: none;
color: #006699;
margin:0 0 6px 0
}
  
#informationRight h2{
font-weight: bold;
font-size:1.1em;
text-shadow: none;
color: #626262;
margin: 0px 0 8px 0
}

#informationRight #additionalInfo {
margin: 20px 0 0px 0; 
}

#informationRight #additionalInfo h3{
font-weight: bold;
font-size:1.1em; padding-bottom:4px;
text-shadow: none;
color: #444;
}

#informationRight #additionalInfo p { font-size:0.9em; }
#informationRight #additionalInfo p { font-size:0.9em; }
#informationRight #additionalInfo br{ margin:0px 0;  }
 
#informationRight   p.productCode{ color:#666666; font-size:0.9em}

#informationRight ul , #informationRight li  {   }
#informationRight ul{ margin:5px 0}
#informationRight li  { font-size:1em; list-style:disc; list-style-position: outside; margin: 0 0 0 15px}
 
 


/* main cat pages consultancy only */
.categoryNav{ display:block; clear:both; margin:0 auto; padding-top:5px; width:100%;}

.categoryNav li{ border-bottom:1px solid #e1e1e1}

.screen .categoryNav li{ display:block; float:left;  width:40%;  margin:5px  5% 5px 0 ; }
.screen  .categoryNav li:nth-child(2n+1){ clear: both;}

.mobile .categoryNav li{ display:block;margin:6px auto; width:100%;  clear: both}

.categoryNav li a{ display:block;}
.categoryNav li a strong{
display:block;
font-size:1.2em;
letter-spacing:-0.03em;
font-weight:200;
line-height:60px;
height:60px;
color:#006699;
background-color:#fff;
overflow:hidden;
white-space: nowrap;
text-overflow:ellipsis;
padding-left:12px;
}
.categoryNav li a:hover strong{ text-decoration:none; color:#333; background-color:#f5f5f5;  }


.categoryNav li a span.imageWrap{ width:100px; height:60px; text-align:center; display:block; float:left;   border:1px solid #e1e1e1; overflow:hidden}
.categoryNav li img{ display:block; width:100%; height:auto;  margin:0px auto;}
.categoryNav li hr{ clear:both; border:0px; background:none; padding:0px; height:2px}
 
 
  
#signinWrap{ width:100%; max-width:1000px; border:3px solid #ccc; margin:40px auto; background:#fff}

#signinWrap h3{
font-size:1.4em;
color:#006699;
font-weight:100;
background-image:url(../images/padlock.png);
background-repeat:no-repeat;
background-position:2px 2px;
padding-left: 28px; margin-bottom:10px;
}

#signinForm{ display:block; width:100%; padding:20px}
#signinForm p{ font-size:0.9em; color:#666666; padding:4px 0}
#signinForm p#pwError{ color:#FF0000; font-weight:bold}
#signinForm input[type=text], #signinForm input[type=email], #signinForm input[type=password]  { display:block; width:100%; border:3px solid #e1e1e1; height:42px; padding:0 0 0 8px;}
#signinForm input[type=text].passErr , #signinForm input[type=email].passErr , #signinForm input[type=password].passErr { border-color:#FF0000}


#signinForm #signinBtn{
border-radius:2px;
width:100%;
height:44px;
line-height:44px;
background-color:#333333;
text-align:center;
color:#FFFFFF;
font-weight:bold;
font-size:0.98em;
}

#signinForm #signinBtn:hover{ cursor:pointer; background-color:#666666}
#signinForm #signinPX, #signinForm #signinBtn{ display:inline-block; margin:0 5px 0 0 }


 
 
#contentDownloads{ padding-top:25px; }/* no bread crumb */
#contentDownloads h3{ font-weight:bold; font-size:1.2em; margin-top:10px;}
#contentDownloads p{ margin:5px 0}
#contentDownloads ul { margin:10px auto 25px auto; padding:0 0 0 15px } /* docs list */
#contentDownloads ul li { clear: both; margin:12px 0;}
#contentDownloads ul li  a{ color:#006699; font-size:1em; font-weight:bold; display:block}


#protectedSignOut{ display:block; height:0px;}
.screen #protectedSignOut a{
display:block;
float:right;
width:150px;
height:40px;
line-height:40px;
text-align:center;
background-color:#fff; border:1px solid #ccc;
color:#006699;
font-size:0.8em;
font-weight:bold;
border-radius:2px;
background-image:url(../images/signOut.png);
background-position:10px 50%; background-repeat:no-repeat;
background-size:18px auto

}

.screen #protectedSignOut a:hover{ background-color:#999; color:#fff; border-color:#999;background-image:url(../images/signOutWhite.png) ;}

.mobile  #protectedSignOut{ display:block; height:30px; clear:both; position:relative;   margin-bottom:30px; width:100%; max-width:600px}

.mobile #protectedSignOut a{
float:right;
width: 125px;
height:32px;
line-height:32px;border:0px solid #e1e1e1;
text-align: right;
background-color: #006699;
padding: 0 16px 0 0;
color: #fff;
font-size:0.75em;
font-weight:bold;
border-radius:4px; 
background-image:url(../images/signOutWhite.png);
background-position:11px 50%;
background-repeat:no-repeat;
background-size:15px
}


/* JOBS*/
.homePageJobs  { margin:10px auto; padding:4px ; border:2px solid #e1e1e1}
.homePageJobs li  { display:block; clear:both; list-style:none; margin:0 0; padding:0}
.homePageJobs li h3 { font-size:14px; font-weight:bold; color:#fff; background-color:#888; text-transform:uppercase; padding:6px 10px; margin-bottom:10px;}
.homePageJobs li a  {
color:#006699;
font-size:15px;
font-weight: normal;
background-image:url(../images/icons/arrowRGray.png);
background-position:0px 6px;
background-repeat:no-repeat;
margin:4px 5px;
padding:0 4px 0 12px;
display:block
}
.mobile .homePageJobs li a  {background-position:0px 4px;margin:10px 8px;}
.homePageJobs li a:hover{ text-decoration:underline; background-image:url(../images/icons/arrowR.png)}
.homePageJobs li:last-child a{ margin-bottom:10px;} 


#jobsPage{ padding:0px 0 ;}

.screen  #filterOpener{ display:none }
.mobile  #filterOpener{
height:44px;
cursor: pointer;
line-height:44px;
margin:20px 0 0 0;
width: auto;
text-align:left;
display:block;
background-color:#777;
color:#FFFFFF;
font-size:14px;
font-weight:bold;
background-image: url(../images/icons/plusWhite.png);
background-position:calc(100% - 15px) 50%;
height:40px;
line-height:40px;
padding:0px 30px 0 10px;
text-transform:uppercase;
border-radius:1px  ;
}
.mobile #filterOpener.openerOpen{ background-image:url(../images/icons/minusWhite.png); border-radius:1px 1px  0 0;}

#jobsFilter{ margin:5px 0; width:240px; float:left; }
.mobile #jobsFilter{ display:none;  width:100%; float:none; border:2px solid #777; padding:0px 15px 20px 15px; margin:0 auto 15px auto;  }

#jobsFilter h2{ text-transform:uppercase; font-family:Arial, Helvetica, sans-serif; z-index:1; }
.screen #jobsFilter h2{ height:34px; line-height:34px; background-color:#888; color:#FFFFFF; font-size:11px; font-weight:bold; padding-left:10px; }
.mobile #jobsFilter h2{ padding:15px 0 5px 0px; color:#333; text-transform:uppercase; font-size:14px; font-weight:bold;}

#jobsFilter span.reset{ float:right; display:block; padding-right:10px; font-size:10.5px; font-weight:normal; cursor:pointer; color:#e1e1e1; text-shadow:none  } 
.mobile #jobsFilter span{ padding-right:0px; font-size:11px; color:#003366; text-decoration:underline}

#jobsFilter li {  }

#jobsFilter ul{ position:relative}
.screen #jobsFilter ul{ max-height:250px; overflow:auto; overflow-x:hidden;border:1px solid #888; padding:10px  ;  border-top:0px; margin:0 auto 10px auto;}
.mobile #jobsFilter ul{padding: 0  0px  ;}

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

#jobsFilter ul li { position:relative; text-align:left;
min-height:26px; 
} 

#jobsFilter ul input[type=checkbox] + label span,
#jobsFilter ul input[type=radio] + label span{ 
position:absolute; left:0px; top:2px;
border:1px solid #999;
width:20px;
height:20px;
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;
}

#jobsFilter ul input[type=checkbox] + label strong,
#jobsFilter ul input[type=radio] + label strong{
position: relative;
display:inline-block;
padding:0px 0 0 28px;
cursor: pointer;
color: #006699;  
font-size: 13.5px;font-family:Arial, Helvetica, sans-serif;
}

#jobsFilter ul input[type=checkbox] + label strong:hover,
#jobsFilter ul input[type=radio] + label strong:hover{ text-decoration:underline}

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

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

#jobsFilter ul input[type=checkbox]:disabled + label strong,
#jobsFilter ul input[type=radio]:disabled + label strong { color:#ccc; } 

#mobileDoneButton{ display:none} 
.mobile  #mobileDoneButton{ display:block; margin: 20px auto 0 auto ; width:100% ; height:44px; text-align:center; color:#FFFFFF; font-size:14px; font-weight:bold; background-color:#666666} 



#jobResults{ float:right; width:740px; margin:0px 0 0 0;  }
.mobile #jobResults{ float:none; width:100%; margin-top:20px;}
#noJobResults{ padding:20px 0 160px 0;  } /*pad for mobile */
#numJobResults{ padding:0px 0 ;  }
#jobResults h1.pagetitles{ margin-top:0; clear:both }
#jobResults ul{ }
#jobResults ul li {  border-bottom:2px solid #e9e9e9;  clear:both; margin:0px auto 10px auto; padding: 0 0 8px 0}
#jobResults ul li:last-child { border-bottom:none}
#jobResults ul li * { font-size:16px; }

#jobResults ul li .jobTitle {color: #006699; font-weight:bold}
#jobDetails #additionalInfo{ margin:5px auto}
#jobDetails #additionalInfo h3{ font-weight:bold}
#jobDetails #additionalInfo p{ font-size:0.8em}

#jobResults ul li .location, #jobDetails .location{color: #333333; font-weight:bold}
#jobResults ul li .jobDate, #jobDetails .jobDate{ font-size:12px; color:#999999; padding:4px 0}

#jobResults ul li .jobRef {font-size:12px; color:#777;}
#jobResults ul li .sector{ }

#jobResults ul li a.readMore{
color: #006699; font-size:13px; 
font-weight:bold;
background-image:url(../images/icons/arrowRGray.png);
background-position:right 50%;
padding-right:14px;
height:25px;
line-height:25px;
display:inline-block;
text-transform: uppercase; clear:both
}
#jobResults ul li .jobPay ,  #jobDetails .jobPay {
color: #8CBA00;
font-weight:bold
} 

#jobDetails .jobTitle { font-size:18px;color: #006699; font-weight:bold}

p.applyNow{ clear:both; margin:10px auto}
p.applyNow a{
color:#006699;
font-weight: bold;
font-size:14px;
display: inline-block;
padding:8px 0 8px 20px;
text-align:left; width:150px;
border: 1px solid #999;
border-radius:4px;
background-image:url(../images/icons/emailIcon.png);
background-position: 115px 50%;
}

p.applyNow a:hover{ background-color:#999; color:#FFFFFF}

/*.downloads li a:hover{ text-decoration:underline  }

.downloads li ul li { background:none; border:none}
 
.downloads li ul{ padding:0 0 0px 0} 

.downloads li a.PDFlink{   background-image:url(../images/fileTypes/pdf.png); background-position: 0px 4px;  }

.downloads li a.wDocLink{ background-image: url(../images/fileTypes/word.png); background-position:0px 12px; }

.downloads li a.xlLink{   background-image: url(../images/fileTypes/xl.png);background-position: 0px 12px; }

.downloads li a.urlLink{   background-image: url(../images/fileTypes/url.png);background-position: 0px 12px; background-size: auto  }*/
