@charset "utf-8";

/* CSS Document */

/* ------------------------------------------------------------------
Main Style Stylesheet
Project:		DJ
Page			Homepage
Start work:		14/09/2016

------------------------------------------------------------------- */

/* ------------------------------------------------------------------
body 
+ HEADER
+ NAVIGATION
+ BANNER
+ SECTION
+ FOOTER
+ HTML5 TAGS
------------------------------------------------------------------- */
/* =======================================================
THEME STYLING STARTg280

======================================================== */

/* BASIC THEME CONFIGURATION */
/* ======================================= */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
outline:0px !important;
}
body {
font-family: 'Roboto-Regular';
font-weight:400;
overflow-x: hidden;
}
h1, h2, h3, h4, h5, h6 {
margin: 0;
}
h2 {
font-size: 36px;

margin: 0 0 20px 0;
color: #fff;
}
p {
font-family:'Roboto-Regular';
color: #808080;
font-size: 16px;
margin: 0;
}

ul li {
list-style: none;
}
 /* FONTS */
 
 @font-face {
	font-family:'Roboto-Regular';
	src: url('../fonts/Roboto-Regular.eot');
	src: url('../fonts/Roboto-Regular.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Roboto-Regular.woff') format('woff'),
		url('../fonts/Roboto-Regular.ttf') format('truetype'),
		url('../fonts/Roboto-Regular.svg#Roboto-Regular') format('svg');
	font-weight: 400;
	font-style: normal;
	font-stretch: normal;
	unicode-range: U+000D-FFFD;
}
@font-face {
	font-family:'Roboto-Light';
	src: url('../fonts/Roboto-Light.eot');
	src: url('../fonts/Roboto-Light.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Roboto-Light.woff') format('woff'),
		url('../fonts/Roboto-Light.ttf') format('truetype'),
		url('../fonts/Roboto-Light.svg#Roboto-Light') format('svg');
	font-weight: 300;
	font-style: normal;
	font-stretch: normal;
	unicode-range: U+000D-FFFD;
}
@font-face {
	font-family:'Roboto-Black';
	src: url('../fonts/Roboto-Black.eot');
	src: url('../fonts/Roboto-Black.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Roboto-Black.woff') format('woff'),
		url('../fonts/Roboto-Black.ttf') format('truetype'),
		url('../fonts/Roboto-Black.svg#Roboto-Black') format('svg');
	font-weight: 900;
	font-style: normal;
	font-stretch: normal;
	unicode-range: U+0020-FFFD;
}
 
.wrapper{width:100%; float:left;}
header{width:100%; float:left;}
.top_header{width:100%; float:left; background-color:#16242e;}
.container{width:1140px; margin:0 auto;}
.logo{width:auto; float:left;margin-bottom: -56px; position:relative;}
.contact_info{float:right; width: 226px;
	height: 42px; margin-top: 21px;
	-webkit-border-radius: 21px;
	-moz-border-radius: 21px;
	border-radius: 21px; text-decoration:none;
	border: solid 1px #feb300;}
.contact_info img{border-right:1px solid #feb300; padding:10px 10px 10px 15px; float:left;}
.contact_info span{font-family: 'Roboto-Regular';
	color: #fff; float:left;
	font-size: 17px;  margin: 0 32px;
	line-height: 40px;}
.navigation_part{ width:100%; float:left; background-color:#fff; height: 67px;}		
nav{ float:right; width:auto;}	
nav ul{float:left; width:auto;}	
nav ul li{  float: left;
    margin-top: -10px;
    position: relative;}	
nav ul li a,nav ul li a:link,nav ul li a:visited{float:left; text-decoration:none; font-family: 'Roboto-Regular';font-size: 16px; color:#373435; text-transform:uppercase; padding: 33px 36px;}
nav ul .active,nav ul li:hover {
    background-color: #fbb100;
    color: #fff;
    height: 86px;
    margin-top: -10px;
    position: relative;
    z-index: 9;

}


nav ul .active:after{ border-color: transparent transparent transparent #bb8400;
    border-style: solid;
    border-width: 10px 0 0 13px;
    content: "";
    position: absolute;
    right: -13px;
    top: 0;}
.banner_info > img {
    width: 100%;
}
.banner_info{width:100%; float:left; position:relative;}
.banner_heading{position:absolute; top:10%; width:570px; margin:auto;}	
.banner_heading h1{    color: #f6f6f6;
    font-family: 'Roboto-Regular';
    font-size: 63px;
    line-height: 76px;
    padding: 20px 80px;
    text-transform: uppercase;
    width: 100%}
.banner_heading:after{position:absolute; content:""; width:190px; height:115px; border-left:2px solid #f6f6f6; border-top:2px solid #f6f6f6; top:0; left;0;}
.banner_heading:before{position:absolute; content:""; width:190px; height:115px; border-right:2px solid #f6f6f6; border-bottom:2px solid #f6f6f6; bottom:0; right:0;}
.main-indus-sec{padding:90px 0;}
.industries{width:100%; float:left;}
.info_part{width:55%; float:left;}
.image_part{width:37%; float:right;}
.sub_heading{    font-family: 'Roboto-Regular';
    font-size: 28px; color:#242322;  font-weight: 400;
    line-height: 37px; text-transform:uppercase;}
.info_part p{font-family: 'Roboto-Regular'; color:#818181; float:left; font-size:14px; margin-bottom: 20px;}
.info_part h2{ border-left:10px solid #ffb400; padding-left:36px;}

.more-inform-sec {
  display: inline-block;
  margin-top: 50px;
  min-height: 311px;
  padding:50px 0 4px;
  width: 100%;
  position:relative;
}
.more-info-bg-sec {
  background-image: url("../images/more-infor-bg.png");
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 270px;
}
.infor-sec-text {
  display: inline-block;
  padding: 50px 50px 30px;
  width: 50%;
}
.infor-sec-text h2 {
  color: #e2a000;
  font-size: 20px;
  font-family:'Roboto-Light';
  font-weight: normal;
  margin-bottom: 15px;
  padding-top: 30px;
}
.infor-sec-text p{color:#f6f6f6;font-size:13px;line-height: 25px;}
.click-sec {
    bottom: 0px;
    position: absolute;
    right: 160px;
}
.more-info-bg-sec > a {
  display: inline-block;
  font-size:18px;
  margin: auto; text-decoration:none;
  padding: 0 52px;
    font-family:'Roboto-Light';
  width: 80%;
  color:#161320;
  font-weight:normal;
}

.contact_info_bg{width:100%; float:left;    margin-top: 70px;}
.contact-sec{width:100%; line-height:0px; text-align: center;}
.contact-sec h2{width:100%; float:left; text-align:center;}
.yellow_sec{display:inline-block; float:none; width:11px; height:20px; background-color:#ffb400;}
.contact-sec h2{margin-bottom:7px;}
.contact-full-info{width:50%; float:left; background-color:#ffb400; box-sizing:border-box; padding:53px 40px; text-align:left;}
.full_widthh{width:100%; float:left; margin-bottom:28px;}
.map-location{width:50%; overflow: hidden;}
.short_info{ width:100%; float:left; margin-bottom: 15px;}
.short_info span{width:100%;  font-family: 'Roboto-Regular'; float:left; font-size:15px;line-height: 30px;}
.short_info  span:last-child{width:auto; border-bottom:1px solid #fff; color:#16242e; padding-bottom: 6px;}
.short_info:last-child span{border:none;}
.short_info:last-child{margin-bottom:0px;}

/**** footer css add *****/
.footer_bg {
	background:url(../images/footer_bg.jpg);
	background-repeat:no-repeat;
	background-size:cover;
	padding:55px 0;
	clear:both;
}
.footer-logo {
    border-bottom: 1px solid #fff;
    margin: 0 auto;
    max-width: 410px;
    padding-bottom: 32px;
    text-align: center;
}
.footer_menu {
  border-bottom: 1px solid #fff;
  margin: 0 auto;
  max-width: 704px;
  padding: 40px 0;
  text-align:center;	
}
.footer_menu li {
    display: inline-block;
    padding: 0 60px 0 0;
}
.footer_menu a {
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
	transition-duration:0.7s;
	-webkit-transition-duration:0.7s;
}
.footer_menu a:hover {
    color: #ffb400;
}
.footer_menu li:last-child {
  padding: 0;
}
.copy_right > p {
  color: #fff;
  font-size: 15px;
  margin: 0;
  padding-top: 36px;
  text-align: center;
}
.image_part > img {
    width: 100%;
}
.tom_menu{display:none;}


/**** CONTACT-US *****/
.innner_banner:before,.innner_banner:after{display:none;}
.inner_banner_headings{  color: #f6f6f6;
    font-family: "Roboto-Regular";
    font-size: 53px; font-weight:bold;
    line-height: 76px; text-transform:uppercase;}
.inner_banner_text{ color:#fff;}
.contact_info_full,.company_history_full{width:100%; float:left; padding:60px 0px;}
.contact-list-detail{width:100%; float:left;}
.contact-list-detail>li{width:30%; float:left; margin-bottom:20px; border: 3px solid #e8e8e9; margin-right:20px; box-sizing:border-box; padding:20px; min-height:130px;}
.contact-list-detail li h3{color: #484b50;  font-size: 14px;
    margin-bottom: 8px;color: #484b50; text-decoration:none;  font-family:'Roboto-Regular';}
.contact-short-details{width:100%; float:left;}
.contact-short-details li{width:100%; box-sizing:border-box;color: #8a8d92; text-decoration:none;font-family:'Roboto-Regular'; margin-bottom: 4px;}
.contact-short-details li a{width:100%; box-sizing:border-box;color: #8a8d92;  text-decoration:none;font-family:'Roboto-Regular';padding-left: 7px; font-size:15px;}
.contact_img{width:35%; float:right;}
.contact-info-top{width:100%; float:left;  margin-bottom: 40px;}
.detail_info{width:60%; float:left;}
.right_info_img{width:35%; float:right;}
.detail_info p:first-child{margin-bottom:20px;}
.detail_info strong{color: #484b50; font-size:14px;}
.right_info_img img{width:80%;}


/**** COMPANY-HISTORY *****/
.company-info-top{width:100%; float:left; margin-bottom: 40px;}
.history_detail_info{width:65%; float:right;}
.history_detail_info p{    font-size: 14px;
    text-align: justify;  margin-bottom: 20px;}
.history_info_img{width:30%; float:left;}
.history_info_img img{width:100%; float:left;}
.second_info_history .history_detail_info{float:left;}
.second_info_history .history_info_img{float: right;} 
.history_info_bottom{float:left; width:100%;}
.history_info_bottom li{width:30%; float:left; border:5px solid #E2A000;  margin: 0 18px; text-align:center; box-sizing:border-box; padding:20px;    min-height: 192px;}
.history_info_bottom li h6{    font-size: 13px;
    line-height: 29px;
    position: relative;}
.history_info_bottom li h6 hr{width:40px; height:2px; background-color:#f9c23e; position:absolute; border:none; left:0px; right:0px; bottom:0px; margin:auto;}
.history_info_bottom li p{font-size:14px; margin-top: 10px;}

/********SAFETY*********/
.sub_inner_heading{  font-size: 24px;
    text-align: left; float:left;
    text-transform: uppercase;
    width: 100%; margin-bottom: 10px;}
.inner_para{width:100%; float:left; text-align:left;font-size: 14px; margin-bottom:30px;}
.history_detail_info h5{text-align:left; color: #484b50; font-size:20px;}
.history_detail_info ul{ width:100%; float:left;}
.history_detail_info ul li{ color: #8a8d92;
    display: inline;
    float: left;
    font-size: 12px;
    height: auto;
    letter-spacing: 1px;
    margin-bottom: 10px;
    padding-left: 15px;
    position: relative;
    width: 31%;}
.history_detail_info ul li:before{   background: #FBB100 none repeat scroll 0 0;
    border-radius: 50%;
    content: "";
    height: 5px;
    left: 0;
    position: absolute;
    top: 5px;
    width: 5px;}
.full_width_info{width:100%; float:left; }
.full_width_info ul li{ color: #8a8d92;
    display: inline;
    float: left;
    font-size: 12px;
    height: auto;
    letter-spacing: 1px;
    margin-bottom: 10px;
    padding-left: 15px;
    position: relative;
    width: 48%;}
.full_width_info ul li:before{   background: #FBB100 none repeat scroll 0 0;
    border-radius: 50%;
    content: "";
    height: 5px;
    left: 0;
    position: absolute;
    top: 5px;
    width: 5px;}

.grey_outer{width:100%; float:left; background-color:#F7F9FB; padding-top: 35px;  margin-bottom: 50px;}
.grey_outer h5{font-family:'Roboto-Black'; text-align:center;}
.grey_outer p{ text-align:center;}
.hlf-width li{width:50% !important;}

/********SERVICES*********/
.services_types{ width:100%; float:left;  margin-top: 50px;   margin-bottom: 30px;}
.services_types li{width:31%; float:left; text-align: center; border:1px solid #d5d4d0;  margin: 0 13px;    min-height: 250px;}
.services_types li span{width:130px; height:130px; background-color:#e2a000; display:inline-block; border-radius:50%;  margin-top: -64px; position: relative; vertical-align:top;  margin-bottom: 20px;}
.services_types img {
    bottom: 0;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: -31px;}
.services_types li h4{ margin-top: 68px;}
.services_types li p{line-height:24px;}

/* media queries */
@media screen and (max-width: 1200px){
	.container{width:90%;}
	nav ul li a, nav ul li a:link, nav ul li a:visited{ padding:32px;}
	.more-inform-sec{ margin-top: 15px;}
.history_info_bottom li{ margin: 0 13px; width:100%; min-height:auto; margin-bottom:10px;}

.history_info_bottom li p {font-size: 13px;}
.services_types li{width:30%; margin:0px 10px;}
.contact-list-detail>li a{ font-size:12px;}
.contact-list-detail>li{width:30%; float:left; margin-bottom:20px; border: 3px solid #e8e8e9; margin-right:20px; box-sizing:border-box; padding:20px; min-height:150px;}
    }

@media screen and (max-width: 920px){
	.logo {margin-bottom: 0;}
	.contact_info{ margin-top:20px;}
	.history_detail_info ul li{width:50%;}
	.services_types li{min-height:270px;}
	.inner_banner_headings{   font-size: 43px;
    line-height: 46px;}
	.sub_inner_heading{ font-size:21px;}
	.contact_info_full, .company_history_full{padding-bottom:0px;}
	
}

@media screen and (max-width: 767px){
.container{width:90%;}
.sub_heading{font-size: 25px;}
.infor-sec-text{ padding: 50px 28px 30px;width:55%;}
.info_part{width:100%;}
nav ul{ display:none;}
.map-location {
  width: 100%;}
.contact-full-info{ width:100%; padding: 40px;}
iframe {width: 100%;}
.image_part {
  float: none;
  margin: 0 auto;
  max-width: 300px;
  width: 100%;}
.tom_menu{display:block;}
.tom_menu{cursor:pointer;}
nav ul li{width:100%; margin-top:0px;}
nav ul li a, nav ul li a:link, nav ul li a:visited{width:100%;}
.active{display:none;}
nav ul li a, nav ul li a:link, nav ul li a:visited{padding:10px;}
.navigation_part{   padding: 10px 0;}
nav ul{margin-right:10px;}
.banner_heading h1{ font-size: 54px;
    line-height: 66px;}
	.banner_heading{width:490px;}
	.banner_heading h1{ padding: 20px 70px;}
	.banner_heading{top:17%;}
	.main-indus-sec {
    padding: 55px 0;}
.more-inform-sec{margin-top:0px;}
.click-sec{right:45px;}
.infor-sec-text{width:71%;}
.infor-sec-text h2{ margin-bottom:5px;}
.history_detail_info ul li{width:50%;}
.hlf-width li{width:100% !important;}
.contact_info_full, .company_history_full{padding-bottom:0px;}
.services_types li{width:29%;}
.services_types li p{font-size:14px;}
.services_types li {
  margin-bottom: 80px;
    min-height: auto;
    padding-bottom: 20px;
    width: 100%;
}
.services_types li:last-child{margin-bottom:0px;}
nav ul{ background: #e2a000 none repeat scroll 0 0;}
nav ul .active, nav ul li:hover{margin-top:0px; color:#fff;}
nav{position:relative; z-index:99999;}
nav ul .active, nav ul li:hover{ height:auto; color:#fff;}
nav ul .active, nav ul li:hover{ height:auto; color:#fff;}
.contact_info_bg{margin-top:50px; }
.footer_menu li{ padding: 0 30px 0 0;}

.contact-list-detail>li{width:45%; float:left; margin-bottom:20px; border: 3px solid #e8e8e9; margin-right:20px; box-sizing:border-box; padding:20px; min-height:150px;}



}
@media screen and (max-width: 530px){

.footer_menu li {
  display: inline-block;
  padding: 5px 0;
  width: 100%;
}
.click-sec{ display:none;}
.infor-sec-text {
  padding: 20px 28px 30px;
  width: 100%;
  background-color:#16242e;
}

.more-inform-sec{margin-top:0px; padding-top:10px;}
.more-info-bg-sec{background-color:#16242e; background-image:none; min-height:auto;}
.infor-sec-text h2{padding-top:10px;}
.more-info-bg-sec > a{   background-color: #e2a000;
    box-sizing: border-box;
    float: left;
    padding: 9px 24px;
    width: 100%;}
.contact_info_bg{margin-top:30px;}
.contact-full-info{padding: 35px 40px;}
.footer_menu{padding: 30px 0;}
.logo {
    display: block;
    float: none;
    margin: 0 auto;
    width: 47%;}
.contact_info{display:inline-block; float:none; margin-top:0px; margin-bottom:15px;}
.banner_heading{ width:90%; top:0px;}
.banner_heading::after{display:none;}
.banner_heading::before{display:none;}
.banner_heading h1{ text-align: center; width:100%; padding:20px 0px; font-size:34px; line-height:41px;}
.top_header{ text-align:center;}
.tom_menu{cursor:pointer;}
nav ul li{width:100%; margin-top:0px;}
nav ul li a, nav ul li a:link, nav ul li a:visited{width:100%;}
.active{display:none;}
nav ul li a, nav ul li a:link, nav ul li a:visited{padding:10px;}
.navigation_part{   padding: 10px 0;}
.main-indus-sec{float:left;padding: 30px 0;}
.tom_menu{display:block;}
.info_part h2{border:none; padding-left:0px;  line-height: 28px;}
.sub_heading{font-size:22px;}
.history_info_img{width:100%;}
.history_detail_info{float:left; width:100%; margin-top:10px;}

.inner_banner_headings {
    float: left;
    font-size: 34px;
    line-height: 38px;
    margin-top: 10px;
    text-align: center;
    width: 100%;
}
.company-info-top{margin-bottom:20px;}
.history_info_bottom li{margin-left:0px; margin-right:0px;}
.detail_info{width:100%;}
.right_info_img{width:100%; float:left;  margin-top: 15px;}
.contact-list-detail > li{width:100%; float:left;}
.history_detail_info ul li{width:100%;}
nav{position:relative; z-index:99999;}
nav ul .active, nav ul li:hover{ height:auto; color:#fff;}
.services_types li{margin-left:0px; margin-right:0px;}
.banner_heading p{display: none;}
nav ul{ background: #e2a000 none repeat scroll 0 0;}
nav ul .active, nav ul li:hover{margin-top:0px; color:#fff;}


.contact-list-detail>li{width:100%; float:left; margin-bottom:20px; border: 3px solid #e8e8e9; margin-right:20px; box-sizing:border-box; padding:20px; }
}