@font-face {
	font-family: 'titillium_bdbold';
	src: url('../fonts/titillium-bold-webfont.eot');
	src: url('../fonts/titillium-bold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/titillium-bold-webfont.woff') format('woff'), url('../fonts/titillium-bold-webfont.ttf') format('truetype'), url('../fonts/titillium-bold-webfont.svg#titillium_bdbold') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'titilliumregular';
	src: url('../fonts/titillium-regular-webfont.eot');
	src: url('../fonts/titillium-regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/titillium-regular-webfont.woff') format('woff'), url('../fonts/titillium-regular-webfont.ttf') format('truetype'), url('../fonts/titillium-regular-webfont.svg#titilliumregular') format('svg');
	font-weight: normal;
	font-style: normal;
}



html {
	background-color: #2f2f2f; /*the footer color*/
}

body {
	height: auto;
	background-color: #ffffff; /*the body color*/
}



sup {
    font-size:58%;
}

/* =================================== */
/* = Navigation = */
/* =================================== */

.top-bar {
	padding-top: 20px;
	height: 100px;
	background: #fff;
	padding-right: 10px;
	padding-left: 10px;
}

.top-bar-section ul.right {
	padding-top: 50px;
}

.top-bar-section li.hover-effect {
	display: none;
}

.top-bar ul.right li {
	border-top: 1px solid #ddd;
}

@media only screen and (min-width: 750px) {
	.top-bar-section li.hover-effect {
		display: block;
	}

	.top-bar ul.right {
		padding-top: 20px;
		position: relative;
	}

	.top-bar ul.right li {
		border-top: none;
	}

}

a:hover {
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.hover-effect {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
}

.top-bar-section ul li.active-link > a {
	background: #fff;
	color: #154c98;
}

.hover-effect:before {
	border-top: 1px solid #ddd;
	display: block;
	height: 1px;
	content: " ";
	width: 100%;
	position: absolute;
	left: 0;
	top: 50%;
}

.hover-effect .circle {
	position: relative;
	background-color: #fff;
	border-radius: 50%;
	width: 12px;
	height: 12px;
	border: 1px solid #ddd;
	transition-property: left, background-color;
	transition-duration: 1s, 0.1s;
	transition-delay: 0s, 1s;
	transition-timing-function: ease, linear;
}

/* =================================== */
/* = GENERAL STYLE = */
/* =================================== */

strong, b {

	font-weight: normal;
	letter-spacing: normal;
	font-family: 'titillium_bdbold', Helvetica, Arial, sans-serif;
}


p {
	font-family: inherit;
	font-weight: normal;
	line-height: 1.4;
	margin-bottom: 1.25rem;
	text-rendering: optimizeLegibility;
}

.main-content h1 {

	font-size: 2rem;
}

.main-content h2 {

	font-size: 2rem;
}

.main-content.our-story h2 {
	color: #154c98;
}

.main-content h2.subheader {

	text-transform: none;
	font-size: 1.375rem;
	color: #154c98;
}

.main-content.our-story h2.subheader {
	font-family: 'titilliumregular';
	text-transform: none;
	font-size: 1.25rem;
	color: #808080;
}

.main-content h4 {

	text-transform: uppercase;
	border-bottom: 1px solid rgba(0,0,0,.1);
}

.main-content h5 {

	text-transform: uppercase;
	font-family: 'titillium_bdbold', Helvetica, Arial, sans-serif;
}

.footer-2 {
	background-color: #2f2f2f;
	padding-bottom: 20px;
	padding: 0px 5%;
}

.footer-1 {
	padding-top: 100px;
	padding-bottom: 50px;
	background: url('../img/footer-bg.png'), #383a3c;
	background-repeat: repeat-x;
	background-position: top right;
	color: #aaa;
	-webkit-box-shadow: inset 0px 15px 20px -15px rgba(0,0,0,0.81);
	-moz-box-shadow: inset 0px 15px 20px -15px rgba(0,0,0,0.81);
	box-shadow: inset 0px 15px 20px -15px rgba(0,0,0,0.81);
}

.footer-1 h1 {
	text-transform: uppercase;
	font-size: 1rem;
	color: #fff;
	font-weight: bold;
	padding-bottom: 10px;
}

.footer-2 .copyright {
	padding-top: 40px;
	background-color: #2f2f2f;
	font-size: 1rem;
	color: #767575;
}

.footer-2 .copyright p {
	font-size: 0.9rem;
	line-height: 1.2;
	padding-top: 1rem;
}



.footer-1 p, .footer-1 ul {
	font-family: inherit;
	font-weight: normal;
	font-size: 0.9rem;
	line-height: 1.4;
	margin-bottom: 1.25rem;
	text-rendering: optimizeLegibility;
}


.footer-1 p.address:before {
	display: block;
	content: "";
	width: 50px;
	height: 50px;
	margin-bottom: 20px;
	background: url('../img/footer-ico.png');
	background-repeat: no-repeat;
	background-size: 32px auto;
	float: left;
}

.footer-1 div div {
	padding: 0px 5%;
}

.footer .divider {
		border-left: 1px solid #2e2f31;
	border-right: 1px solid #2e2f31;
}

.footer-1 p.phone:before {
	display: block;
	content: "";
	width: 50px;
	height: 32px;
	background: url('../img/footer-ico.png');
	background-repeat: no-repeat;
	background-size: 32px auto;
	background-position: left -50px;
	float: left;
}

.footer-1 p.email:before {
	display: block;
	content: "";
	width: 50px;
	height: 32px;
	background: url('../img/footer-ico.png');
	background-repeat: no-repeat;
	background-size: 32px auto;
	background-position: left -100px;
	float: left;
}

.footer-1 p.email, .footer-1 p.phone {
	line-height: 2rem;
}

.fullWidth {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	max-width: initial;
}


/* ========================================================================================================= */
/* = Homepage "Eyen -intro*/
/* ========================================================================================================= */

.homepage .joinus-cover{
	 background: #F3F6FA left center; 
	 background-size: auto 450px;
	 position: relative;
	border-top: 1px solid #ddd;
	padding-top: 1em;
	border-bottom: 5px solid #2ba6cb;
}

.homepage .intro-cover{
	 background: url('../img/bg-intro-cover.jpg') #F3F6FA no-repeat left center; 
	 background-size: auto 450px;
	 position: relative;
	border-top: 1px solid #ddd;
	padding-top: 1em;
	border-bottom: 5px solid #2ba6cb;
}


.homepage .intro-cover h1{
	color: #154c98;
	font-family: 'titillium_bdbold', Helvetica, Arial, sans-serif;
	font-size: 1.5rem;
}



.homepage .intro-cover h2{
	font-size: 1.125rem;
	font-family: 'titillium_bdbold', Helvetica, Arial, sans-serif;
}


.homepage .intro-cover-text{
	
  	padding: 30px;
  	
	}
	
@media only screen and  (min-width: 40.063em) {
	
	.homepage .intro-cover{
	 background: url('../img/bg-intro-cover.jpg') #F3F6FA no-repeat;
	  background-size: auto 400px;
	 background-position: 75% center;
	
}
}


@media only screen and  (min-width: 62em) {
	
	
.homepage .joinus-cover{
	background: #F3F6FA ;
	background-size: auto 470px;
	background-position: 85% center;
	
}
	.homepage .intro-cover{
	 background: url('../img/bg-intro-cover.jpg') #F3F6FA no-repeat;
	  background-size: auto 470px;
	 background-position: 85% center;
	
}
	
	.homepage .intro-cover-text{
	padding-top: 60px;
  	padding-bottom: 60px;
  	
	}
	
	
	.homepage .intro-cover h1{
	font-size: 2rem;
}



.homepage .intro-cover h2{
	font-size: 1.5rem;
}


.homepage .intro-cover p{	
	/*color: #808080;*/
	font-size: 1.125rem;	
}
	
}


@media only screen and  (min-width: 100em) {
	
	.homepage .intro-cover h1{
	font-size: 2.375rem;		
}
	
.homepage .joinus-cover{
	 background: #F3F6FA right top; 
	 background-size: auto;
	
}
	.homepage .intro-cover{
	 background: url('../img/bg-intro-cover.jpg') #F3F6FA no-repeat right top; 
	 background-size: auto;
	
}

.homepage .intro-cover-text{
	padding-top: 120px;
  	padding-bottom: 120px;
  	
	}

.homepage .intro-cover h2{
	font-size: 2rem;
	
}


.homepage .intro-cover p{	
	/*color: #808080;*/
	font-size: 1.375rem;	
}


}





/* ========================================================================================================= */
/* = Homepage "3D cryo-electron microscopy structure characterization service" intro = */
/* ========================================================================================================= */

header {
	background: #144c97; /*url('../img/slider-bg.gif');*/
	background-repeat: repeat-x;
}






.servis-cover-text{
	padding: 0px 40px 0px 40px;
}

.homepage  .servis-cover-img{
	display: none;
}





.homepage .service-cover{
	
	
	background: url('../img/bg-celine-3d.jpg') no-repeat right top;
	background-size: 300px auto;
	 background-position: right top;
	padding-top: 40px;
  	padding-bottom: 40px;

	
}



.homepage .service-cover h1{
	font-size: 3.125rem;
	margin: 0px;
	padding:1rem 0 0 0; 
	color: white;
	
}	




.homepage .service-cover h2{
	font-size: 1.625rem;
	text-transform: uppercase;
	color:#70d0ed;
	
	
}	

.homepage .service-cover ul{
	padding:1rem 0 0 0; 
	color: white;
font-size: 1.125rem;		
}

.homepage .service-cover ul li{
position:relative;
 list-style: none;
 padding-left: 60px;
 margin-left: 0px;	
 margin: 1.5em 0;
 line-height: 1.25em;
 
 
}

  .homepage .service-cover ul li:before{
  content: "";
  width: 50px;
  height: 60px;
position:absolute;
  left:0;
 top: -1.325em;
  
  }

  
      .homepage .service-cover ul li.ico-protein:before{
   background: url('../img/ikony-web.png') no-repeat -310px top;

    
 }
  
  
    .homepage .service-cover ul li.ico-times:before{
   background: url('../img/ikony-web.png') no-repeat -310px -100px;
 }
 
 
     .homepage .service-cover ul li.ico-costs:before{
   background: url('../img/ikony-web.png') no-repeat -310px -200px;
 }
 
      .homepage .service-cover ul li.ico-algorithms:before{
   background: url('../img/ikony-web.png') no-repeat -310px -300px;
 }
 
 
 
@media only screen and (min-width: 40.063em){
	.homepage  .servis-cover-img{
	padding: 0px 150px;
	display: block;
}



.homepage .service-cover{
	background: url('../img/bg-celine-3d.jpg') no-repeat right top;
	background-size: 450px auto;
	 background-position: right top;
	padding-top: 80px;
  	padding-bottom: 80px;
	}



.homepage .service-cover h1{
	font-size: 3.625rem;
}	

.homepage .service-cover h2{
	font-size: 1.875rem;

}

.homepage .service-cover ul{

font-size: 1.375rem;		
}

.homepage .service-cover ul li{
 padding-left: 90px;
 margin: 1.5em 0;
 line-height: 1.25em;
 
 
}

  .homepage .service-cover ul li:before{
  	
  	width: 80px;
  	height: 80px;
  	background-size: auto;
	top: -0.875em;
  
  }
  
        .homepage .service-cover ul li.ico-protein:before{
   background: url('../img/ikony-web.png') no-repeat -200px top;

    
 }
  
  
    .homepage .service-cover ul li.ico-times:before{
   background: url('../img/ikony-web.png') no-repeat -200px -100px;
 }
 
 
     .homepage .service-cover ul li.ico-costs:before{
   background: url('../img/ikony-web.png') no-repeat -200px -200px;
 }
 
      .homepage .service-cover ul li.ico-algorithms:before{
   background: url('../img/ikony-web.png') no-repeat -200px -300px;
 }
	
}

@media only screen and (min-width: 64.063em){ 
	
	.homepage  .servis-cover-img{
	padding: 0px;
}
}

 @media only screen and  (min-width: 100em) {
 	
 	.homepage .service-cover h1{
	font-size: 4.8rem;
}	

.homepage .service-cover{
	background: url('../img/bg-celine-3d.jpg') no-repeat right top;
	padding-top: 100px;
  	padding-bottom: 100px;	
}

.homepage .service-cover h2{
	font-size: 2.2rem;	
}	


.homepage .service-cover ul{
font-size: 1.4rem;
padding:1rem 0 0.125em 0; 
	
}
	

.homepage .service-cover ul li{
margin: 1.5em 0;

 
}
 

  
	
}
  
  
  

  
  
 .btn-home div{
 	display: block;
text-transform: uppercase;
	font-size: 1.2rem;
	font-family: 'titillium_bdbold';
	  border-radius: 15px;
background-repeat: no-repeat;
  background-position: right center;
    padding: 20px;
    padding-right: 45px;
    text-align: center;
	
}



@media only screen and (min-width: 40.063em){
	
.btn-home div{
	
	display: inline-block;
	
}
}


 .btn-home.light div{
	color: #154c98;
		
border: 3px solid #154c98;	
		background: white;
	
}

 .btn-home.dark div{
	color: white;
		border: 2px solid white;
		background: #154c98;
	
}

.btn-home.light div:hover{
	background: #154c98;
	color: white;
	
}

.btn-home.dark div:hover{
	color: #154c98;
	background: white;
	
}

.btn-home.light div:hover .Chevron:before{
 border-top-color: white;/*Match background colour*/
}


.btn-home.light div:hover .Chevron:after{
    top:-5px;/*adjust thickness*/
    border-top-color: #154c98;/*Match background colour*/
}


.btn-home.dark div:hover .Chevron:after{
 border-top-color: white;/*Match background colour*/
  top:-5px;/*adjust thickness*/
}


.btn-home.dark div:hover .Chevron:before{
  
    border-top-color: #154c98;/*Match background colour*/
}




.Chevron{
    position:relative;
    display:inline-block;
    height:10px;/*height should be double border*/
}
.Chevron:before,
.Chevron:after{
    position:absolute;
    display:block;
    content:"";
    border:10px solid transparent;/*adjust size*/
   	left: 5px;
  
}
/*Change four 'top' values below to rotate (top/right/bottom/left)*/
.light .Chevron:before{

    top:0;
    border-top-color:#154c98;/*Chevron Color*/
}
.light .Chevron:after{
    top:-5px;/*adjust thickness*/
    border-top-color: white;/*Match background colour*/
}

/*Change four 'top' values below to rotate (top/right/bottom/left)*/
.dark .Chevron:before{

    top:0;
    border-top-color:white;/*Chevron Color*/
}
.dark .Chevron:after{
    top:-5px;/*adjust thickness*/
    border-top-color: #154c98;/*Match background colour*/
}









/* =================================== */
/* = Homepage Testimonials= */
/* =================================== */




.testimonial-cover{
border-top: 2px solid #568bd1;
	border-bottom: 2px solid #568bd1;
	position:relative;
	background: #0c3d7e;
}




.testimonial-content{
margin-top: 40px;
margin-bottom: 20px;
padding: 40px ;	
}

.testimonial-content:before{
 content: "";
 width:106px;height:106px;border-radius:53px;
  border: 2px solid #568bd1;
  background: url('../img/ikony-web.png') #0c3d7e no-repeat -182px -386px;
  background-size: auto;
  position:absolute;
  	top: -50px;
 	left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
}


blockquote p:before{
	font-family: Georgia, serif;
	color: #aeaeae;
  content: open-quote;
  font-size: 6rem;
  vertical-align: -0.3em;
  line-height: 1.6rem;

}

blockquote p:after{
	font-family: Georgia, serif;
	color: #aeaeae;
  content: close-quote;
  font-size: 6rem;
  vertical-align: -0.6em;
  line-height: 1.6rem;

}

blockquote{
	border:0px;
	padding: 20px 0px 0px 0px;
	
	
}

blockquote p{
	font-family: 'titilliumregular';
	color: white;
	font-size: 1.125rem;
	font-style: italic;
	padding-top: 20px;
	
}


cite{
	
	font-size: 1rem;
	text-transform: uppercase;
	font-family: 'titilliumregular';
	font-style: normal;
	color: #70d0ed;
	
}

cite .context{
	
	font-size: 1rem;
	text-transform:none;
	
	font-style: normal;
	color: #aeaeae;
	
}


@media only screen and (min-width: 40.063em){
	
	.testimonial-content{
margin-top: 40px;
margin-bottom: 40px;
padding: 40px ;	
}

blockquote p{
	
	font-size: 1.4rem;

	
}


cite{
	
	font-size: 1.25rem;

	
}

blockquote{
	border:0px;
	padding: 20px 100px 0px 100px;
	
	
}

	
}




/* =================================== */
/* = Homepage Service Workflow = */
/* =================================== */

.job-btn-spacing {
	margin-bottom: 20px;
}
.molbio {
	background: #f3f4f9;
}

.gpuprog {
	background: #f3f4f9;
}

.labor {
	background: #f3f4f9;
}
.service-workflow-cover {
	background: #f3f4f9;
}


.workflow{
	margin-top: 30px;
}


.homepage .service-workflow-cover{
	padding-top: 50px;
  	padding-bottom: 100px;

	
}



.homepage .service-workflow-cover h1{
	font-size: 3.125rem;
	margin: 0px;
	padding:1rem 0 0 0; 
	color: #154c98;
	text-align: center;
	
}	


.homepage .service-workflow-cover h2{
	font-size: 1.625rem;
	
	text-transform: uppercase;
	color: #808080;
	text-align: center;
	
}


.homepage-box {
	margin-bottom: 101px;
	margin-top: 0px;
		background: #ffffff;
		padding:10px;
border: 2px dotted #808080;
border-radius: 40px;
}

@-moz-document url-prefix() {
 .homepage-box {
       border: 1px solid #808080;
    }
}
	

	
	
.arrow{
		background: url('../img/bg-workflow-arrow.jpg')    no-repeat center bottom;
		width:101px;
		height: 101px;
		position: absolute;
		left:0;
		right:0;
		margin-left: auto;
		margin-right: auto;
		bottom: 0;
	}



	
	
	.homepage-box  h4 {
		font-size: 1rem;
padding: 25px 0px 0px 0px;
	}
	
	

	



.steps{

font-family: 'titilliumregular', Helvetica, Arial, sans-serif;
 line-height: 1.4rem;
  font-size: 1.125rem;
  text-transform:uppercase;
  color:white;
   position: relative;
  top: 0px;
margin-bottom:20px;
   height: 60px;
 text-align:center;
	 
}




.step-cost{
display: inline-block;
	
font-family: 'titillium_bdbold', Helvetica, Arial, sans-serif;
 line-height: 40px;
  font-size: 1rem;
  text-transform:uppercase;
  color:#154c98;
 
	
	 
}


.step-cost span{
background: #f3f4f9;
display: inline-block;	
 border-radius: 15px;
padding:0px 20px ;
margin-right: 10px;
 margin-bottom: 10px;
}




.steps span{
background: #154c98 ;
display: block;	
 border-radius: 20px;
  border: 4px solid #154c98;
  padding: 10px ;
  
}

.steps span span{
color: #70d0ed;
 padding:0px;
}


.workflow-text{
 text-align:left;
}


	.homepage-box .title-wrapper {
		display: table;
		width: 100%;
		float: none;
	}

	.homepage-box .button {

		margin: 0px;
	}



	.homepage-box ul {
		padding: 0px 10px 0px 0px;
		 line-height: 1.2rem;
		
	}
	
	
	.homepage-box ul li{
 position:relative;
 list-style: none;
 padding-left: 20px;
 margin: 0.825em 0px 0.825em 0px;
	
}
	
	
.homepage-box ul li:before {
content: "";
  width: 26px;
  height: 26px;
  border-radius: 18px;
   background: url('../img/ikony-web.png')  #154c98  no-repeat -221px -523px;
  background-size: auto;
  position:absolute;
  left:-20px;
}	





@media only screen and (min-width: 40.063em){
	
	

.homepage .service-workflow-cover h1{
	font-size: 3.625rem;
	
}	

.homepage .service-workflow-cover h2{
	font-size: 1.875rem;

}

.steps{
 line-height: 1.6rem;
  font-size: 1.4rem;
 position: absolute;
  top: 10px;
  left: 0px;
  right: 0px;
  margin-left: auto;
  margin-right: auto;
   height: 60px;
 text-align:center;
	 
}

.steps span{
background: #154c98 ;
display: inline-block;	
 border-radius: 20px;
  border: 4px solid #154c98;
  padding: 10px ;
  
}

.homepage-box {
	margin-bottom: 101px;
	margin-top: 40px;
padding:40px 10px 10px 20px;
		
}



	.homepage-box  h4 {
		font-size: 1.25rem;
padding: 20px 10px 0px 10px;
	}
	
	
	.homepage-box ul {
		padding: 10px 15px 0px 0px;
		 line-height: 1.8rem;
		
	}
	
	
	.homepage-box ul li{
 position:relative;
 list-style: none;
 padding-left: 40px;
 margin-left: 0px;	
}
	
	
.homepage-box ul li:before {
content: "";
  width: 26px;
  height: 26px;
  border-radius: 18px;
   background: url('../img/ikony-web.png')  #154c98  no-repeat -221px -523px;
  background-size: auto;
  position:absolute;
  left:0;
}		

}




@media only screen and (min-width: 64.063em){

	.step-1{
	background: #fff url('../img/bg-step-1.jpg') no-repeat right top;
	background-size: auto; 
	
}

.step-2{
	background: #fff url('../img/bg-step-2.jpg') no-repeat right top;
	background-size: auto; 
	
}

.step-3{
	background: #fff url('../img/bg-step-3.jpg') no-repeat right top;
	background-size: auto; 
	
}

.step-4{
		background: #fff url('../img/bg-step-4.jpg') no-repeat right top;
	background-size: auto; 
	
}
		
	


}



 
 @media only screen and  (min-width: 100em) {
	
	.homepage .service-workflow-cover h1{
	
	font-size: 4.8rem;
	}
	
	
	.homepage .service-workflow-cover h2{
	font-size: 2.2rem;
	}
	
	
}







	
	

	
	

	




	

/* =================================== */
/* = Contact page = */
/* =================================== */

#map_canvas {
	position: relative;
	left: 0;
	width: 100% !important;
	height: 400px !important;
	border-bottom: 10px solid #2ba6cb;
}

.google-maps {
	position: relative;
	padding-bottom: 350px;// This is the aspect ratio
	height: 0;
	overflow: hidden;
}
.google-maps iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 600px !important;
}

/* =================================== */
/* = Services + Industries page = */
/* =================================== */

header, header .page-title, header .page-title h1, header .page-title {
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
}


header.services, header.industries, header.about  {
	/*height: 600px;*/
	border-bottom: 10px solid #2ba6cb;
	border-top: 1px solid #ddd;
	position: relative;
}

header .page-title{
	padding-top: 40px;
	padding-bottom: 40px;
	background-color: #f3f6fa;
}

header.about .page-title {
	background: #144c97; 
}


header.services .page-title {
	background: url('../img/services-main-img.jpg'), #f3f6fa;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
}

header.industries .page-title {
	background: url('../img/industries-main-img.jpg'), #f3f6fa;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
}


header .page-title h1 {
	color: #154c98;
	text-transform: uppercase;
	font-size: 1.125rem;
	font-family: 'titillium_bdbold', Helvetica, Arial, sans-serif;
}


header.about .page-title h1 {
	color: #fff;
}


header .page-title p {
	font-size: 1.125rem;
	color: #808080;
	opacity: 1;
}


header.about .page-title p {
	color: #2ba6cb;
	}


header.industries .page-title p, header.services .page-title p {
display: none;
}


/* services + industries header menu*/



header .menu-boxes{
	padding: 0px; 
}

header .menu-boxes div {
	padding: 0px !important; /*hover effect across the whole box*/
	display: table;
}


header .menu-boxes div{
	border-left: 1px solid #2ba6cb;
}

.services h2 {
	padding: 0px 0px;
	font-size: 1rem;
	color: #2ba6cb;
	display:table-cell;
	vertical-align: middle;
	background: url('../img/service-icons-big.png');
	height: 60px;
	background-size: 60px auto;
	text-align: left;
	padding-left: 60px;
	background-repeat: no-repeat;
	width: 100%;
	width: 600px;
	
}

.industries h2 {
	padding: 0px 0px;
	font-size: 1em;
	color: #2ba6cb;
	display: table-cell;
	vertical-align: middle;
	background: url('../img/industries-icons-ipage.png');
	height: 60px;
	background-position: -20px 0px;
	background-size: 100px auto;
	text-align: left;
	padding-left: 60px;
	background-repeat: no-repeat;
	width: 100%;
	width: 600px;
}


.service-1 h2 {
	background-position: left -238px;
}

.service-1 h2:hover, .service-1.active h2 {
	background-position: left 0px;
}

.service-2 h2 {
	background-position: left -300px;
}

.service-2 h2:hover, .service-2.active h2 {
	background-position: left -64px;
}

.service-3 h2 {
	background-position: left -357px;
}

.service-3 h2:hover, .service-3.active h2 {
	background-position: left -118px;
}

.service-4 h2 {
	background-position: left -419px;
}

.service-4 h2:hover, .service-4.active h2 {
	background-position: left -181px;
}



.industry-1 h2 {
	background-position: -20px -2px;
}

.industry-1 h2:hover, .industry-1.active h2 {
	background-position: -20px -269px;
}

.industry-2 h2 {
	background-position: -20px -70px;
}

.industry-2 h2:hover, .industry-2.active h2 {
	background-position: -20px -337px;
}

.industry-3 h2 {
	background-position: -20px -138px;
}

.industry-3 h2:hover, .industry-3.active h2 {
	background-position: -20px -405px;
}

.industry-4 h2 {
	background-position: -20px -206px;
}

.industry-4 h2:hover, .industry-4.active h2 {
	background-position: -20px -473px;
}


header h2:hover, header .active h2 {
	color: #222222;
}

.menu-boxes div:hover, header.services .active, header.industries .active {
background-color: #ddd;
}

.menu-boxes div{
border: 0px;
border-bottom: 1px solid  #2ba6cb;

}


@media only screen and (min-width: 40.063em) {


header .page-title h1 {
	font-size: 1.5rem;
}
	
header .page-title p {
	font-size: 1.375rem;
}		


}


@media only screen and (min-width: 900px) {
header .page-title h1 {
	font-size: 2.25rem;
}
	
header .page-title {
	padding-top: 80px;
	padding-bottom: 80px;
}

	
}
	
	
@media only screen and (min-width: 1200px) {
	
	
header.industries .page-title p, header.services .page-title p {
display: block;
}	
	
header .page-title {
	padding-top: 150px;
	padding-bottom: 150px;
}

header .page-title h1 {
	font-size: 2.25rem;
}



/*service + industry page boxes*/


header  .menu-boxes {
	font-size: 1.25rem;
	text-align: center;
}

header .menu-boxes div{
	border: 0px;
}

header .menu-boxes div:not(:first-child) {
	border-left: 1px solid #2ba6cb;
}

.services h2 {
	padding: 25px 0px;
	font-size: 1.125rem;
	height: 200px;
	background-size: 150px auto;
	padding-left: 150px;
	width: 25%;
}




.service-1 h2 {
	background-position: left -580px;
}

.service-1 h2:hover, .service-1.active h2 {
	background-position: left 20px;
}

.service-2 h2 {
	background-position: left -730px;
}

.service-2 h2:hover, .service-2.active h2 {
	background-position: left -130px;
}

.service-3 h2 {
	background-position: left -880px;
}

.service-3 h2:hover, .service-3.active h2 {
	background-position: left -280px;
}

.service-4 h2 {
	background-position: left -1030px;
}

.service-4 h2:hover, .service-4.active h2 {
	background-position: left -430px;
}

/*industries page*/

.industries h2 {
	padding: 25px 0px;
	font-size: 1.125rem;
	vertical-align: top;
	height: 200px;
	background-size: 300px auto;
	text-align: center;
	padding-left: 0px;
	width: 25%;
}



.industry-1 h2 {
	background-position: center 20px;
}

.industry-1 h2:hover, .industry-1.active h2 {
	background-position: center -780px;
}

.industry-2 h2 {
	background-position: center -180px;
}

.industry-2 h2:hover, .industry-2.active h2 {
	background-position: center -980px;
}

.industry-3 h2 {
	background-position: center -380px;
}

.industry-3 h2:hover, .industry-3.active h2 {
	background-position: center -1180px;
}

.industry-4 h2 {
	background-position: center -580px;
}

.industry-4 h2:hover, .industry-4.active h2 {
	background-position: center -1380px;
}


}	


/* =================================== */
/* = About page = */
/* =================================== */


.our-story {
	padding: 50px 0px;
}




@media only screen and (min-width: 40.063em) {
	
	
	header.about .page-title {
	height: 300px;
	margin: 0px;
	background: url('../img/about-main-img.jpg');
	background-size: 0px;
	background-repeat: no-repeat;
	overflow: hidden;
}
	
	header.about {
	height: 300px;
}

	header.about .page-title {
		background-size: cover;
		background-position: center center;
		background-repeat: no-repeat;
		overflow: hidden;
	}

}

@media only screen and (min-width: 900px) {

	header.about .page-title h1 {

		margin-top: 0px;
		padding-top: 80px;
		color: #fff;
		text-transform: uppercase;
		font-size: 2.25rem;
		font-family: 'titillium_bdbold', Helvetica, Arial, sans-serif;
	}

	header.about {
		height: 350px;
	}

	header.about .page-title {
		height: 350px;
		margin: 0px;
		padding: 0px;
	}
}

@media only screen and (min-width: 1200px) {

	header.about .page-title h1 {
		margin-top: 0px;
		padding-top: 120px;
		color: #fff;
		text-transform: uppercase;
		font-size: 2.25rem;
		font-family: 'titillium_bdbold', Helvetica, Arial, sans-serif;
	}

	header.about {
		height: 399px;
	}

	header.about .page-title {
		height: 399px;
		margin: 0px;
		padding: 0px;
	}

}


.tabs-content > .content.active {
	padding: 70px 0px;
}

.tabs-content > .content.active .tabs-content .content.active {
	padding: 0px 0px;
}

.tabs-content {
	margin-bottom: 0px;
}


.tabs-content > .content {/*default foundation style, no transition can be aplied on display*/
	display: block;
	transition: opacity 1s ease-out;
	-webkit-transition: opacity 1s ease-out;
	-moz-transition: opacity 1s ease-out;
	opacity: 0;
	height: 0;
	overflow: hidden;
	padding: 0px;
}

.tabs-content > .content.active {
	opacity: 1;
	height: auto;
	float: none;
}

/*pricelist*/
.content-box {

	background-color: #fff;
	display: block;
	position: relative;
	background-color: #fff;
	margin-top: 2rem;
	margin-bottom: 2rem;
}

.content-box.important {

	border-radius: 5px;
	padding: 20px;
	background-color: rgba(0,0,0,.1);
	margin-right: 20px;
	border: 1px solid rgba(0,0,0,.1);
}

.label {
	text-align: right;
	position: absolute;
	right: -12px;
	top: 20px;
}

.label span {
	background-color: #a50141;
	text-transform: uppercase;
	color: #fff;
	border-color: #90083e;
	position: relative;
	display: inline-block;
	padding: 0.8rem;
	border-radius: 4px 0 0 4px;
}

.label span:after {
	position: absolute;
	content: "";
	top: 100%;
	right: 0;
	border-top: 0 solid transparent;
	border-left: 10px solid #90083e;
	border-bottom: 10px solid transparent;
	border-right: 0 solid transparent;
	width: 0;
	height: 0;
}

.price-label {
	text-align: right;
	position: relative;
	right: 20px;
	bottom: 10px;
}

.price-label span {
	background-color: #ddd;
	text-transform: uppercase;
	color: #;
	position: relative;
	display: inline-block;
	padding: 0.8rem;
	border-radius: 4px;
}

.main-content ul {
	margin-left: 0rem;
}

.main-content ul li {
	line-height: 1.4;
	padding: 0.15rem 0 0.5rem 1.5rem;
	list-style: none;
	background: url('../img/li-custom.png') left 0.6rem no-repeat;
}

.main-content ul.side-menu li {
	list-style: none;
	background: none;
}



