
/* HOME LIFECYCLE */

#lifeCycle {margin:30px auto 60px auto; clear:both}
#lifeCycle ul {position:relative; min-height:240px; }
#lifeCycle li{ width:200px; height:auto; display:block;  float:left; text-align:center;margin: 0px;  position:relative; 
-webkit-transition:all 1s ease-in-out;
-moz-transition:all 1s ease-in-out;
-o-transition:all 1s ease-in-out;
transition:all 1s ease-in-out;opacity:0;
}
 
.mobile #lifeCycle li {width:100%;height:auto;  margin:0 auto 50px auto; display:block; float:none; text-align:center}

#lifeCycle li.lifeCycleActive{ opacity:1}

#lifeCycle li em { /*img wrap */
position:relative;
background-position:50% 50%;
width:200px;
height:150px;
display:block;
border-radius:0; margin:0 auto ;
font-size:1px; text-indent:-20000px
}
.mobile #lifeCycle li em {width:160px;height:100px;border:0px solid #ccc; margin-bottom:10px;border-radius:100%;}
 
#lifeCycle li#challenge em  { background-image:url(../images/lifeCycleHomePage/1.png); }
#lifeCycle li#scenarios em{ background-image:url(../images/lifeCycleHomePage/2.png); }
#lifeCycle li#customers em{ background-image:url(../images/lifeCycleHomePage/3.png); }
#lifeCycle li#conversations em{ background-image:url(../images/lifeCycleHomePage/4.png); }
#lifeCycle li#solution em{ background-image:url(../images/lifeCycleHomePage/5.png); }
 
#lifeCycle li p{
display:block;
padding: 0 0 0px 0;
width:280px; max-width:100%;
font-size:18px;
text-align:center;
font-weight:300;
margin:0 auto;
color: #444;
text-transform: none;font-family: "Spinnaker", sans-serif;
}	
.mobile #lifeCycle li p{ font-size:25px;}

.screen #lifeCycle li strong{
display:block; clear:both; text-align:center; margin:0 auto;   width:80%;  font-size:15px; font-weight: normal; color:#666666; opacity:0;
-webkit-transition:all 1s ease-in-out;
-moz-transition:all 1s ease-in-out;
-o-transition:all 1s ease-in-out;
transition:all 1s ease-in-out;
-webkit-transition-delay: 4s; 
transition-delay:  4s;
}

.mobile #lifeCycle li strong{
display:block; clear:both; text-align:center; margin:0 auto;   width:100%;  font-size:18px; font-weight: normal; color:#666666;   
}

#lifeCycle li.lifeCycleActive strong{
opacity:1;
} 
 

/*#lifeCycle li#solution strong{ }*/


#lifeCycle hr.arrows{
position:absolute;
right:-26px;
top:50px;
width:60px;
height:40px;   
z-index:2; 
background-image:url(../images/lifeCycleHomePage/arrow.png);
background-repeat:no-repeat; background-position:left 50%;
opacity:0;
-webkit-transition:all 1s ease-in-out;
-moz-transition:all 1s ease-in-out;
-o-transition:all 1s ease-in-out;
transition:all 1s ease-in-out;
}
.mobile #lifeCycle hr.arrows{ display:none}
#lifeCycle li.lifeCycleActive  hr.arrows{ opacity:1; background-position:50% 50%;}

/* HOME LIFECYCLE */


/* Your Research Project */
#researchProjectGrid{ margin:20px auto;   width:100%; background:#fff;  }
#researchProjectGrid li { float:left; position:relative;   cursor:pointer;  }
.screen #researchProjectGrid li{ width:244px; height:280px; border:0px solid #ccc;  margin:0 8px 0px 0 ; }
.screen #researchProjectGrid li:nth-child(4n) { margin-right:0px;  }
.mobile #researchProjectGrid li {  width:46%; margin:0 4% 0px 0 ; }

@media screen and  ( min-height: 800px ) and (orientation:portrait) { 
.mobile #researchProjectGrid li{ width:32%; margin:0 1% 0px 0 ;}
}

@media screen and  ( min-width: 800px ) and (orientation:landscape) { 
.mobile #researchProjectGrid li{ width:24%; margin:0 1% 0px 0 ;}
}

#researchProjectGrid li img{ 
width:100%;   float:left;
-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.6s ease-in-out; 
}
.screen #researchProjectGrid li:hover img{opacity:0.5; }


#researchProjectGrid li p{
display:block; clear:both;
text-align:center;
height:30px;
margin:0;
padding:2px 0 0 0;
width:100%;
color: #006699;
font-size:16px;
font-family:"Lato",Arial, Helvetica, sans-serif;
font-weight: 400;
}
.mobile #researchProjectGrid li p{ font-size:14px;padding:4px 0 0 0;}

#researchProjectGrid li:hover p{ color:#000000}

#researchProjectGrid li div{ }

.screen #researchProjectGrid li div{
width:224px; height:224px;
position:absolute;
left:10px;
top:10px;
background:#000;color:#fff;
background-repeat:repeat;
opacity:0;
-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;
padding: 0% 20px 0 20px;
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-flex-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center; 
font-size:16.0px;
font-weight: 100; 
text-align:center;
font-family: Arial, Helvetica, sans-serif; line-height:1.3em;
} 
 

#researchProjectGrid li:hover div{ 
opacity: 0.75;  
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}

.mobile #researchProjectGrid li div{ display: none }
 
/* Your Research Project */




/* what to expect  full width CW */
.what-to-expect #contentWrapper{ width:100%; padding:0; margin:4px 0 0 0;  }
#whatToExpect{ height:100%; width:100%  }
#whatToExpect li{  width:100%;   clear:both;  background-size:cover; background-position:50% 50%; position:relative; border-bottom: 4px solid #fff; display:block; clear:both}
.mobile #whatToExpect li{ height:auto; padding:40px 0  }

#whatToExpect article{
-webkit-transition:all 0.8s ease-in-out;
-moz-transition:all 0.8s ease-in-out;
-o-transition:all 0.8s ease-in-out;
transition:all 0.8s ease-in-out;
background:url(../images/bgTrans.png);
background-repeat:repeat;
background-color:#fff;
text-shadow:1px 1px #fff;
margin: auto;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.screen #whatToExpect article{
width:480px;
height:480px;
border-radius:240px;
}
 
.mobile #whatToExpect article{
width:90%;
max-width:600px; height:70%;  
border-radius:10px; overflow:hidden;
}

#whatToExpect li.WTEinactive article{ opacity:0; top:-20px;}
#whatToExpect li.WTEactive article{   opacity:0.86; top: 0}
.screen  #whatToExpect li:first-child.WTEinactive article{   }/*header full on load	*/
.screen  #whatToExpect li:first-child.WTEactive article{  }

#whatToExpect div {
text-align:center;
display:block;
height:auto; width:100%;
position: relative;
top: 50%;
transform: translateY(-50%); 
}
.screen #whatToExpect div   *{text-align: center;padding:0 50px; }
.mobile #whatToExpect div   *{text-align: left;padding:0 24px; }

#whatToExpect  h2 {
font-weight:100;
font-size:30px;
display:block;
margin:0 auto 10px auto;
color: #CC0000;
font-family:"Spinnaker",Arial, Helvetica, sans-serif;
letter-spacing: -1px;
}
#whatToExpect  p {
font-weight: normal;
font-size:16.5px;
display:block;
color: #555;
margin:8px 0 ;  font-family:"Lato",Arial, Helvetica, sans-serif
}

/* what to expect  */


/*  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.0em; 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.8em;   font-weight:bold} 
#contentList .description , #contentList .description * { font-size:0.9em;} /* div wrapper or p tag*/

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

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

#contentList  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%; */
} 
   
#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; font-size:1px; } 
#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:left; font-size:0;  margin:20px auto   }
#sliderThumbs li{ display: inline-block;  white-space:nowrap; margin:4px 5px 4px 1px; padding:0;
border:1px solid #bbb;
border-radius:2px;}
.screen #sliderThumbs li:nth-child(7){ margin-right:0}

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

#sliderThumbs a{
display:block;
margin:0 auto;
height:64px;
width:64px;
line-height:62px;
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}
 
 
 
 
/* protected stuff*/
 
#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:#000}
#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
}




#teamPage{} 
#teamPage ul{ margin-top:15px; width:100%;}
.mobile #teamPage ul { margin:20px auto }

#teamPage ul li {  float:left;  margin-right:1%;border:1px solid #e1e1e1; position:relative; background-position:50% 50%; background-size:cover; position:relative;}
.screen #teamPage ul li { width:32%; padding-bottom:32%; margin-bottom:12px; overflow:hidden;}


#teamPage ul li img{ 
height:100%; width:100%; left:0; top:0;
position:absolute;
-webkit-transition:all 0.5s ease-in-out;
-moz-transition:all 0.5s ease-in-out;
-o-transition:all 0.5s ease-in-out;
transition:all 0.5s ease-in-out;
z-index:1;  
}
.screen #teamPage ul li:hover img { height:120%; width:120%; left:-10%; top:-10%; } 

@media screen  and (orientation:portrait)  { 
.mobile #teamPage ul li { width:46%;  padding-bottom:46%;   float:left;  margin: 0 2% 70px 0%; }
}
@media screen  and (orientation:landscape)  { 
.mobile #teamPage ul li { width:32%;  padding-bottom:32%;   float:left;  margin: 0 1% 70px 0%; } 
}

 
.screen  #teamPage ul li.categorySep{ clear:both; border:none; height:0; width:0; padding:0; margin:0; }
.mobile  #teamPage ul li.categorySep{ display:none; height:0; width:0; padding:0; margin:0; }
 
.screen #teamPage ul li p{
text-align:center ; position:absolute;  width:92%; top:4%; left:4%; height:92%;  
opacity:0;
-webkit-transition:all 0.5s ease-in-out;
-moz-transition:all 0.5s ease-in-out;
-o-transition:all 0.5s ease-in-out;
transition:all 0.5s ease-in-out;
background-color:transparent; 
  }
.screen  #teamPage ul li:hover p{ opacity:0.88; background-color:#3F4A55}
.screen #teamPage li a{ font-size:26px; font-weight: 100; display:block; color: #fff; text-align:center ;padding:75% 0 0 0px; /*font-family:  "Times New Roman", Times, serif ;*/ }
.screen #teamPage li a span{ font-size:18px; font-weight:300; display:block; color: #DAA25A;text-align:center } 

.mobile #teamPage ul li p{ position:relative; width:100%;height:0; z-index:1000 } 
.mobile #teamPage li a{
font-size:15px;
width:100%;
height:100%;
display:block;
position:absolute;
top:14px; /*offset for 100% height*/
left:0;
border: none;
text-align:center;
color: #444;
text-align:center; padding-top:100%; 
}
.mobile #teamPage li a span{
font-weight:100;
display:block;
color: #AC913B;
text-align:center
} 

/* team details page*/
#teamDetails{ width:100%; margin: 0 auto}
h1#teamName{ font-size:30px; font-weight:400; color: #333333; font-family:Spinnaker ,Arial  }
h2#teamHeading{
font-size:20px;
font-weight:400;
display:block;
color: #FF3300; margin-bottom:16px;
}

#teamDescription p{ font-size:15px; padding:0 0 12px 0; color:#888; font-family:Spinnaker ,Arial }
#teamDescription p strong{  font-size:20px;color:#444;padding: 16px 0 0 0; display:block; font-family: inherit }

a.teamLinkedIn{ font-weight:bold; display:block; height:30px;  line-height:30px; font-size:14px; text-decoration:none; margin-top:10px;  }
a.teamLinkedIn span {
margin-right:10px;
display:block;
float:left;
height:30px;
width:30px;
background-color:#006699;
background-image:url(../images/social/linkedinTeamPage.png);
background-position:50% 50%;
background-repeat:no-repeat; 
}

#teamAdditional p{ font-size:16px; font-weight:bold} 
 
	
	
/* YRP methodologies details page*/
#methodologyDetails h1{   }
#methodologyDetails h2{
margin:  0;
padding: 10px 0 0  0;
font-weight: normal;
text-transform: none;
color: #00806F;
font-size: 22px;
letter-spacing:-1px;
font-family: "Spinnaker", sans-serif;
}

#methodologyDescription p{ font-size:17px; padding:5px 0 ; }  
 
#methodologyCTA{   font-size:17px; margin:5px auto; display:block; font-weight: normal}
#methodologyCTA a{ color:#006699; text-decoration:underline}   

#methodologyCaseStudyOpener {
display:block;
text-decoration:none;
clear:both;
cursor:pointer;
width:100%;
padding:12px 0px 12px 32px;
margin: 18px auto 0px auto;
font-size:1em;
font-weight: normal;
text-align:left;
background-color: #3F4A55 ;
border-radius:3px;
color: #fff;
border:0px solid #ccc;
background-position:12px   50%; height:100%;   display:block; cursor:pointer;
background-repeat:no-repeat;
background-image:url(../images/icons/plusWhite.png); 
}

#methodologyCaseStudyOpener:hover{ background-color: #222;}
#methodologyCaseStudyOpener.caseStudyOpen   {
background-color: #2C333B;border-radius:3px 3px 0 0;
background-image:url(../images/icons/minusWhite.png);
} 
#methodologyCaseStudy{ display:none ; border:3px solid #d1d1d1; border-top-width:0px; padding:20px 30px;border-radius:2px;}
#methodologyCaseStudy h4{ font-size:18px; font-weight:bold; border-bottom:3px solid #e1e1e1; margin:8px 0; padding-bottom:4px;}
#methodologyCaseStudy *{ font-size:16px; color:#656565}
#methodologyCaseStudy p{ margin:0; padding:0 0 12px 0;}
/* YRP methodologies details page*/

#testimonialsFader{  clear:both; margin:0px auto; width:100%; clear:both }
#testimonialsFader h5{ margin:25px auto 0 auto ; font-size:22px; font-family:  "Spinnaker" , Arial, Helvetica, sans-serif;   border-bottom:3px solid #e1e1e1; padding-bottom:5px; font-weight:300; color:#777  }
#testimonialsFader ul{    margin:10px auto;width:100%; display:block; min-height:300px; list-style:none; }
#testimonialsFader li {
margin:0;
list-style:none;
padding:6px 0px  35px 0px;
border-radius:5px;
border:0px solid #f9f9f9;
min-height:130px;
background-image: url(../images/testimonials.png);
background-position:15px 15px;
background-repeat: no-repeat;
position:relative;
background-color:#f6f6f6;
}
#testimonialsFader li p{ font-size:16px; margin:0; padding:25px 40px ; width:100%;  font-style: normal; color:#444; text-shadow:1px 1px #fff}
#testimonialsFader li p strong, #testimonialsFader li p span { display:block; clear:both;  font-style: normal ; font-weight:bold; }
#testimonialsFader li p strong { margin-top:8px;}  

#testimonialsFader li em{
height:34px;
width:34px;
border:1px solid #bbb; 
cursor:pointer;
background-color:#fff;
background-size:8px;
background-repeat: no-repeat;
display:inline-block;
margin-top:15px;    
float:right;border-radius:100%;
}
#testimonialsFader li em:hover{border:1px solid #888; }
#testimonialsFader li em.previous{ 
background-image:url(../images/icons/arrowLGrayThin.png);
background-position: 45% 50%;margin-right:10px;
}
#testimonialsFader li em.next{ 
background-image:url(../images/icons/arrowRgrayThin.png);
background-position: 55% 50%; margin-right:15px;
}



#socialButtons{ margin:10px auto ; padding:5px 0; max-width:100%; overflow:hidden;   }  