@charset "utf-8";
/* CSS Document */
@media screen and (min-width:1367px) {   
    
}

@media screen and (max-width:1366px) {
   
   .process_div .processicon:before {left: -94%; background-size: 90%;}
}


@media screen and (max-width:1200px) {
    
   
        a.servicebox {width: 88%;}
    .process_div .processicon:before {left: -87%; background-size: 90%;}
    
}

@media screen and (max-width:1100px) {
    
#menu ul li > a {padding: 10px 24px;}
a.servicebox {width: 98%;}
    .contectinfo dl dt span {margin: 0 10px 0 0;}    
    .contectinfo dl {padding: 20px 10px;}
    
    
.process_div .processicon:before {left: -81%; background-size: 72%;}



    
}

@media screen and (max-width:1024px) {
    
    .process_div .processicon:before {left: -78%; background-size: 66%;}
.topheader ul li.phone {padding: 0 10px;}
    
    

	
    
}

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


/* for responsive menu */    
a#toggle { display: block; }
main#content {margin-top: 65px; transition: all ease-out 0.3s;}
#menu {
  position: fixed;
  width: 250px;
  height: 100%;
  top: 0;
  left: 0;
  overflow: hidden;
  overflow-y: auto;
  background:rgba(0, 0, 0, 0.92);
  transform: translateX(-250px);
  border-right: 1px solid rgba(255,255,255,0.2); margin: 0
}

#menu ul {text-align: left; background-color: transparent; border:0px solid #ffffff}
#menu ul li {display: block; width: 100%; border-radius: 0!important;}
#menu ul li a { display: block; padding: 12px 15px; border-right: 0px solid #666666; }
#menu ul li a > i { float: right; display: none; }
#menu ul li ul {display: none; position: static; width: 100%; left: 0; margin-left: 0;}
#menu ul li:hover > ul { display: none; }
#menu ul li:hover > a > i { transform: rotateZ(0); }
#menu ul li.open > a { background-color: rgba(0, 0, 0, 0.3); }
#menu ul li.open > a > i { transform: rotateZ(90deg); }
#menu ul li.open > ul { display: block; }

div#overlay {
  display: block;
  visibility: hidden;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  transition: all ease-out 0.3s;
  z-index: 10;
  opacity: 0;
}

#menu ul li i.fa.fa-caret-down.mysubmenu {
	display: block;
    position: absolute;
    top: 0;
    right: 0;
    background: rgba(0,0,0,0.6);
    width: 30px;
    height: 30px;
    margin: 7px 0 0 0;
    text-align: center;
    color: #ffffff;
padding: 8px 0 0; cursor:pointer}
	
#menu ul li i.fa.fa-caret-down.mysubmenu:before {content: "\f067"; }
#menu ul li.open i.fa.fa-caret-down.mysubmenu:before {content: "\f068";}
.open-menu a#toggle .fa-bars:before {content:"\f00d"}	

html.open-menu { overflow: hidden; }

html.open-menu div#overlay {
  visibility: visible;
  opacity: 1;
  width: calc(150%);
  left: 250px;
}

html.open-menu a#toggle,
html.open-menu main#content { transform: translateX(250px); }
html.open-menu nav#menu {z-index: 10; transform: translateX(0);}

#menu ul li:before, #menu ul li:first-child:after {display:none}    
    
#menu ul li:hover > a, #menu ul li.activepg {background: #00a9bd; border-radius: 0;}

    #menu ul li ul li {width: 100%;}
    #menu ul li ul li a {padding: 8px 10px 8px 25px;font-size: 14px;line-height: normal; text-transform: capitalize}
    #menu ul li.current-page-ancestor ul {background: transparent}
    #menu ul li.activepg > a,#menu ul li.current-page-ancestor{background: transparent; border-radius: 0px;}
    .serviceboxwrapper {width: 33.33%;}
.welcome_section .beforeafter_div {width: 480px;}
    .welcome_section .leftcontent {width: calc(100% - 520px);}
    

.process_div .processicon:before {left: -67%; background-size: 50%;}
    
    
    .contectinfo dl dt span {margin: 0 10px 0 0; float: none; margin: 0 auto;}
    .contectinfo dl dd {width: ;float: left;width: 100%;text-align: center;}
    .contectinfo dl dt {float: left; width: 100%;}
    
    .footerlogo_div {float: left; width: 100%; text-align: center; margin: 15px 0 0;}
  .footerlinks_section {padding: 20px 0 20px;}
    .footerlogo_div img {margin: 0 1% 10px; width: 30%; display: inline;}
    .serviceoffered {width: 100%;}
    
    .content_div img {max-width: 300px;}    
    
    .testimonialbox {width: 46%;}
    .innerpg_container ul.area-list li {width: 30%!important;}
    
    header {position: inherit; background: #130a0b}
    #banner {margin-top: 0;}
    .callus_div {padding: 15px 0 15px 50px;}
    .logo {max-width: 320px; float: none; margin: 10px auto 0;}
    .primeryheader {height: 60px;}
    
    .topheader ul li.phone, .topheader ul li.quote {padding: 0 10px;}
    #innerbanner {margin-top: 0;}
    #html5-next {left:inherit!important; right:0%!important}
    #html5-prev {left:0%!important; }
    
    .callus_div {padding: 15px 50px 15px 50px;width: 100%;text-align: center;margin: 0;}
    .topheader ul {float: none;list-style: none;width: auto;clear: both;text-align: center;}
    .topheader ul li {float: none;}
    .topheader ul li.phone {font-size: 20px;}
}

@media screen and (max-width:860px) {
    
    .industry_container {padding: 50px 10px;}
    .process_div .processicon:before {display: none}
    .contact_left, .contact_right {width: 100%;}
    /*#banner {height: 400px;}*/
    

    
    
   
    
}



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

}

@media screen and (max-width:767px) {
    
    .wrapper {width: 92%;}    
    .serviceboxwrapper { width: 50%;}
    .welcome_section .beforeafter_div {width: 480px; float: none; margin: 0 auto 30px; max-width: 96%;} 
    .welcome_section .leftcontent {width: 100%;}
    
    .servicename {padding: 15px 10px; line-height: normal; font-size: 16px; }
    .contectinfo dl {width: 100%;}
    .contectinfo dl.borderrl {border-right: 0px solid #43767c; border-left: 0px solid #43767c;}
    .process_div {width: 45%;}
    .footerlinks_section .overviewlinks ul.sociallinks li {padding: 0 5px 0 0;}
    .content_div.wid100 .fleft, .content_div.wid100 .fright   {width: 100%;}
.industry_container {margin: 20px 0 0 0;}
.innerpg_container ul li { width: 32%;}
    .innerpg_container ul.area-list li {width: 48%!important;}
    
    
    div#html5-prev{top: 105% !important;}
div#html5-next{top: 105% !important; }

}



@media screen and (max-width:640px) {
    
   .topheader ul li.quote, .topheader ul li.phone{padding: 0 18px;}
    .serviceoffered{width:100%;}
    .footerlinks_section h5 {clear: both; margin:20px 0 0; float:left; width:100%}
    .overviewlinks {width: 100%;}
    .footerlinks_section .overviewlinks ul li {width: 32%!important;}
    ul.sociallinks{margin: 0 0 30px 0; float:left}
    .processname {margin: 15px 0 20px;}
    
    .content_div img.fleft, .content_div img.fright {margin: 0 auto;float: none!important;text-align: center;max-width: 100%;}
    .content_div p {margin: 20px;}    
    .innerpg_container {padding: 10px;}
    .content_div.wid100 {padding: 10px 10px 30px;}
    
    .content_div.wid100 .fright p {margin: 18% 0 0 -45%;}
    .content_div.wid100 .fright {height: 300px!important;}
    .testimonialbox {width: 96%;}
    .innerpg_container .content_div.img-right ul {padding: 20px!important;}
    .footerlinks_section .serviceoffered ul li {width: 100%!important;}


}


@media screen and (max-width:600px) {
.industrybox:nth-child(2n):after, .industrybox:nth-child(2n):before {display: none}
    .industrybox {width: 100%; margin: 15px 0; float: left;}
    .industryname:before {display: none; margin: 24px 0 10px 0;}
    .industryname {margin: 15px 0 0px 0;}    
    .industry_container {padding: 10px;}
    .innerpg_container ul li { width: 50%; }
    .innerpg_container ul{padding: 20px;}
    
}

@media screen and (max-width:480px) {
    
    .serviceboxwrapper { width:100%;}
    .topheader ul li.phone {font-size: 020px;}
    .topheader ul li.quote a i, .topheader ul li.phone a i {display: none}
    .footerlinks_section h5 {text-align: center;}
    .footerlinks_section ul {text-align: center;}
    .footerlinks_section .serviceoffered ul li, .footerlinks_section .overviewlinks ul li {width: 100%!important; background: none; padding: 5px 0}
    .footerlinks_section .overviewlinks ul.sociallinks li {display: inline-block; float: none;}
    .footerlogo_div img { width: 80%; display:block; max-width: 200px;}
    
    .footerlogo_div img {width: 80%; margin: 10px auto}
    .content_div.wid100 .fright {height: 300px;}
    .content_div.wid100 .fleft .icontextbox {text-align: center}
    .content_div.wid100 .fleft .icontextbox p {width: 100%; text-align: center}
    .content_div.wid100 .fleft .icontextbox img {margin: 0px auto 20px; float: none;}
    .contactinfo_right dl dt { float: none; margin: 0 auto;}
    .contactinfo_right dl dd, .contactinfo_right dl dd a {width: 100%; text-align: center;}
    
.wid50 {width: 100%!important;}
    .innerpg_container ul.area-list li {width: 96%!important;}
    .iconcontainer_div {clear: both; margin: 0px auto 15px; float:none}

    
    
    
}


@media screen and (max-width:400px) {
    
.logo {max-width: 300px;float: none;display: block;}
    .logo img{width:100%}
  .content_div p ~ p{margin: 10px 20px 0!important}
    
    
    div#html5-prev{top: 110% !important;}
div#html5-next{top: 110% !important; }
    .content_div h5 {margin: 20px 20px 0;}
    
}


@media screen and (max-width:360px) {
    
    .topheader ul li.quote, .topheader ul li.phone {padding: 0 7px;}
    
    
    
}