@charset "utf-8";
/* CSS Document */


/***********  
	colour pallet
	
	gradient black  #414142
	background grey #ebeced
	font grey #808285
	font-family: 'Kanit', sans-serif;
	font color againts black #bcbdc0 
	
	************/


/*************************************************************************
                            GENRAL STYLES
*************************************************************************/

body {
font-family:Calibri, Helvetica, sans-serif;
background-color:#FFF;
width:100%;
height:100%;
}  

h1 h2 h3 {
	font-family: 'Kanit', sans-serif;
	color:#000000;
}
li {
text-decoration:none;
}

img {
	width:100%
}


a {
text-decoration:none;
}


/*************************************************************************
                          SUB  NAVIGATION AREA
*************************************************************************/	
.sub_nav {
	width:100%;
	overflow:hidden;
	background: rgb(65,65,66);
background: linear-gradient(90deg, rgba(65,65,66,1) 0%, rgba(0,0,0,1) 100%);
	
}

#quick_email, #quick_call {
	font-family: 'Kanit', sans-serif;
	float:right;
	padding: 10px 5px 10px 5px;
	font-size:0.7em;
	color: #d1d3d4 ;
}

#quick_email:hover{
	color:#FFFFFF;
}
#quick_call:hover {
	color:#FFFFFF;
}
/*************************************************************************
                            NAVIGATION AREA
*************************************************************************/	

.main_nav li {
	font-family: 'Kanit', sans-serif;
}
.logo_holder{
	max-width:220px;
	float:left;
	padding-top:10px;
}
	
.nav_area { 
width:100%;
background-color: #FFFFFF;
overflow:hidden;

border-bottom: 1px solid #EDEDED;
}
			 
.nav_container {
width:100%;
margin:0 auto;
}
	
.mb_menu {
display:block;
float:right;
margin: 20px 20px 20px 15px;
cursor:pointer;
color:#FFF;
}
		
			
.main_nav {
width:100%;
height:0;
overflow:hidden;
}
		
.nav_open {
height:auto;
}
		
		
.main_nav li {
width:100%;
border-top: 1px solid #EDEDED;
}
				 
				 
				 
.main_nav li a {
display:block;/*targeting the anchors within the lists and giving a block display increases hit area*/
padding:20px 10px;
color:#000000;
font-weight:bold;
font-size:1em;
}	
			
				   
		


.nav_area h1 { 
color:#FFF;
font-weight:bold;
font-size:1.2em;
padding: 20px 0 0 5px;
float:left;
}

/*************************************************************************
                            NAVIGATION LINK STYLES
*************************************************************************/


ul.main_nav a:active {
color:#fcd842;
}

ul.main_nav a:hover {
color:  #848484;
}
		
.mb_menu:hover {
color:#fcd842;
}


/*************************************************************************
                            splash image
*************************************************************************/	
/*************************************************************************
.splash_image {
	background-color:rgba(215,215,215,1.00);
		background-position:center;
	overflow:hidden;
	width:100%;
	height:800px;


}

#parallax_splash{
	background-image:url(../images/splash.jpg);
		background-attachment:fixed;
	background-repeat:no-repeat;
	background-size:cover;
	
}	
*************************************************************************/



.splash_image {
	background-color:rgba(215,215,215,1.00);
		background-position:center;
	overflow:hidden;
	width:100%;
	height:350px;

}

#parallax_splash{
	background-image:url(../images/mobile_splash.jpg);
	background-attachment:fixed;
	background-repeat:no-repeat;
	background-size:cover;
}
.splash_image h1{
	font-family: 'Kanit', sans-serif;
	font-size:1.5em;
	font-weight:300;
	color:#FFFFFF;
	text-shadow: 2px 2px 10px rgba(0,0,0,0.40);
}

.splash_image h2{
	font-family: 'Kanit', sans-serif;
	font-size:1.8em;
	font-weight:600;
	color:#FFFFFF;
	text-shadow: 2px 2px 10px rgba(0,0,0,0.40);
}
.splash_image p {
	font-family: 'Kanit', sans-serif;
	font-size:0.8em;
	text-shadow: 2px 2px 10px rgba(0,0,0,0.40);
	padding-top:6px;
	color:#FFFFFF;
}
	
	.welcome{
	padding: 90px 0 0 20px;
	
	
	}
	
	





/*************************************************************************
                            INTERGRATED SOLUTIONS
*************************************************************************/		

.holder{
	overflow:hidden;
}

.square {
  
  min-height:250px;
  width: 95%;
  margin-top:2%;
  margin-right:2.5%;
  margin-left:2.5%;
  background-image:url(../images/integrated.jpg);
  background-position:center;
  background-repeat:no-repeat;
	background-size:cover;
	overflow:hidden;
	}

.content {
	width: 100%;
	height: 100%;
}	

/*************************************************************************
                           ONSHORE SERVICES
*************************************************************************/	


.square_two {
  min-height:200px;
  width: 95%;
  margin-top:2%;
  margin-right:2.5%;
  margin-left:2.5%;
  background-color:#FF0004;

}



.content_two {
 background-color:#ebeced;
  width: 100%;
  height: 100%;
  padding:10%;
}	


.content_two p {
color:#808285;
font-size:3.6vw;
line-height:4.5vw;
}


.content_two h1 {
font-family: 'Kanit', sans-serif;
color:#000000;
font-size:7vw;
}




/*************************************************************************
                            OUR ONSHORE SERVICES
*************************************************************************/		

.holder{
	overflow:hidden;
}

.square_onshore {
 
  min-height:250px;
  width: 95%;
  margin-top:2%;
  margin-right:2.5%;
  margin-left:2.5%;
  background-image:url(../images/offshore.jpg);
  bakground-position:center;
  background-repeat:no-repeat;
  background-size:cover;
  overflow:hidden;
  

}


.content_onshore {
  width: 100%;
  height: 100%;
}	




.square_three {
  min-height:200px;
  width: 95%;
  margin-top:2%;
  margin-right:2.5%;
  margin-left:2.5%;
  background-color:#FF0004;
 }

.square_three:after {

}

.content_three {
background-color:#ebeced;
width: 100%;
height: 100%;
 padding:10%;
}	


.content_three ul{
	list-style-type:disc;
	color:#808285;
}

.content_three p {
color:#808285;
font-size:3.6vw;
line-height:4.5vw;
}



.content_three h1 {
font-family: 'Kanit', sans-serif;
color:#000000;
font-size:7vw;
}



/*************************************************************************
                            OUR OFFSHORE SERVICES
*************************************************************************/		

.holder{
overflow:hidden;
}

.square_offshore {
   min-height:250px;
  width: 95%;
  margin-top:2%;
  margin-right:2.5%;
  margin-left:2.5%;
 background-image:url(../images/three.jpg);
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	overflow:hidden;

}



.content_offshore {
  width: 100%;
  height: 100%;
}	




.square_four {
  min-height:200px;
  width: 95%;
  margin-top:2%;
  margin-right:2.5%;
  margin-left:2.5%;
  background-color:#FF0004;

}

.content_four {
	background-color:#ebeced;
	width: 100%;
  height: 100%;
  padding:10%;
}	




.content_four p {
color:#808285;
font-size:3.6vw;
line-height:4.5vw;
font-family:Calibri, Helvetica, sans-serif;
}



.content_four h1 {
font-family: 'Kanit', sans-serif;
color:#000000;
font-size:7vw;
}

.content_four ul {
	list-style-type:disc;
	color:#808285;
	font-size:2.7vw;
	font-family:Calibri, Helvetica, sans-serif;
}



/*************************************************************************
                           QUALITY AND SAFETY ASSURED
*************************************************************************/	
.holder_three{
	margin-bottom:2%;
}
.quality_holder{
	overflow:hidden;
	width:100%;
	background-color:rgba(215,215,215,1.00);
		background-position:center;
	overflow:hidden;
	width:100%;
	height:auto;
	background-position:center;	
}

#quality_para{
	background-image:url(../images/quality_mobile.jpg);
		background-attachment:fixed;
	background-repeat:no-repeat;
	background-size:cover;
}


/*************************************************************************
.splash_image {
	background-color:rgba(215,215,215,1.00);
		background-position:center;
	overflow:hidden;
	width:100%;
	height:800px;


}

#parallax_splash{
	background-image:url(../images/splash.jpg);
		background-attachment:fixed;
	background-repeat:no-repeat;
	background-size:cover;
	
}	
*************************************************************************/





.quality_details{
	padding:10%;
	text-align:center;
}


.quality_details h1{
font-family: 'Kanit', sans-serif;
color:#000000;
font-size:7vw;
}


.quality_details p{
color:#808285;
font-size:3.6vw;
line-height:4vw;
}

/*************************************************************************
                           contact styles
*************************************************************************/	

.contact_holder {
		background-position:center;
	overflow:hidden;
	width:100%;
	min-height:500px;
	overflow:hidden;
}

#contact_para{
	background-image:url(../images/contact_mobile.jpg);
		background-attachment:fixed;
	background-repeat:no-repeat;
	background-size:cover;
	overflow:hidden;
}

.filter{
	background-image:url(../images/filter.png);
		background-attachment:fixed;
	background-repeat:no-repeat;
	background-size:cover;
	overflow:hidden;
	
	width:100%;
	min-height:500px;
background-size:cover;
background-position:center;
	overflow:hidden;
		
}

.content_details{
	color:#FFFFFF;
	margin:0 auto;
	width:90%;
	overflow:hidden;
}

#us {
	font-family: 'Kanit', sans-serif;
font-size:7vw;
text-align:center;
width:100%;
border-bottom: 1px solid #FFFFFF;
padding-top:20px;
padding-bottom:10px;

}


.greece {
	padding-top:30px;
	padding-bottom:30px;
}

.greece h1{
	font-family: 'Kanit', sans-serif;
font-size:5vw;
}

.greece li{
	margin-bottom:5px;
}


.nigeria {
padding-bottom:30px;	
}

.nigeria h1 {
	font-family: 'Kanit', sans-serif;
font-size:5vw;
}

.nigeria li{
	margin-bottom:5px;
}


.south {
	padding-bottom:30px;
}


.south h1 {
	font-family: 'Kanit', sans-serif;
font-size:5vw;
}


.south li {
	margin-bottom:5px;
}

.content_details p {
	
}
/*************************************************************************
.splash_image {
	background-color:rgba(215,215,215,1.00);
		background-position:center;
	overflow:hidden;
	width:100%;
	height:800px;


}

#parallax_splash{
	background-image:url(../images/splash.jpg);
		background-attachment:fixed;
	background-repeat:no-repeat;
	background-size:cover;
	
}	
*************************************************************************/