@media (max-width: 1200px){
.container {width: 100% !important;}
}
@media (max-width: 1100px){
.fetre_wrper {float:left;width:100%;padding:50px 0;margin-top:0}
.banr2_wrper {background:url(../images/dark_bg_img2.jpg) center no-repeat;background-size: 100%;}
}
@media (max-width: 992px){
.foter_navbr li a,.futer2_para,.futer_headr,.futer_parag{text-align:center}
.smenu_wrper nav.navbar .navbar-toggle{display:inline-block;float:right;margin-right:20px;margin-top:10px;font-size:25px}
.mmenu_wrper nav.navbar ul.nav>li>a{color:#fff;border-right: 0px solid #ccc;}
.mmenu_wrper nav.navbar ul.nav>li>a:hover{color:#f46a14;}
.mmenu_wrper nav.navbar ul.nav>li>a img{display:none}
.about_eight {width:60%}.about_three{width:40%}
.futer_wrper {background-size:cover}
.futer_respn {max-width:200px;margin:10px auto 16px;display:block}
.foter_navbr li{float:left;width:50%}
.foter_navbr li a{margin:0;padding:7px 0}
.futer_socal .btn{display:inline-block;color:#fff;width:32px}
.smenu_wrper nav.navbar .navbar-collapse{border:none;margin-bottom:0;position:absolute;z-index:999;width:100%;background:#000}
.custm_navbr li a{padding:8px 0;font-size:14px;color:#fff}
.custm_navbr li{float:left;padding:1px 0;width:100%;text-align:left}
.custm_navbr {float:left}
.prodt_three {float:left;width:33.3333337%;padding:15px}
.projt_three {float:left;width:50%;padding:15px}
}
@media (max-width: 850px){
.about_eight,
.chuse_wrper:after{display:none}
.galry_three {float:left;width:50%;padding:15px}
.chuse_eight {float:left;width:100%;padding:50px 0}
.about_six1s {float:left;width:50%;padding:5% 30px 0 15px}
.projectFactsWrap .item i{font-size:40px}
.projectFactsWrap .item p{font-size:15px}
.cnter_wrapr {float:left;width:100%;padding:0 0 0 50px}
.fetre_wrper,.sectw_three{padding:30px 0}
.about_three {width:100%}
.about_eight {width:60%}
.sectw_three {float:left;width:100%}
.prodt_fours {float:left;width:50%;padding:15px}
}
@media (max-width: 767px){
.abutp_fours {float:left;width:100%;padding:15px 10px}
.abutp_sixsc {float:left;width:100%;padding:0 10px}
.baner_wrper .fade-carousel{position:relative;height:300px}
.baner_wrper .fade-carousel .carousel-inner .item{height:300px}
.baner_wrper .fade-carousel .slides .slide-1,
.baner_wrper .fade-carousel .slides .slide-2,
.baner_wrper .fade-carousel .slides .slide-3{height:300px;}
.categry_sec .navbar-header,
.categry_sec .navbar-nav{margin:0}
.categry_sec .navbar-toggle{padding:0;background-image:none;border-radius:4px;color:#fff;margin:0;top:0;font-size:20px;line-height:0}
.categry_sec .navbar-collapse{overflow-y:auto;max-height:350px}
}

@media (max-width: 640px){
.about_six2s {display:none}
.about_six1s {float:left;width:100%;padding:50px 15px;height:auto}
.chuse_fourw {float:left;width:50%;padding:15px;min-height:190px}
.about_wrper .about_three {padding-top: 0px;}
.about_wrper .sectw_three {padding-top: 0px;}
.baner_wrper .btn1_readmor,.baner_wrper .btn2_readmor{padding:9px 17px;font-size:12px}
.prodt_three {float:left;width:50%;padding:15px}
.cntct_three {float:left;width:100%;padding:15px}
.mapal_align {height:300px;width:100%}
.banr2_wrper .mainp_headr{color:#fff;margin:0;font-size:22px}
.banr2_wrper {float:left;width:100%;padding:40px 0}
}
@media (max-width: 480px){
.numbr_1stsc,.numbr_1stsc img{position:relative}
.chuse_eight .main_sheadr, .chuse_eight .mainp_headr,.projectFactsWrap .item h3,.projectFactsWrap .item i,.projectFactsWrap .item p{text-align:center}
.quote_wrper .main_sheadr, .quote_wrper .mainp_headr {text-align:center}
.chuse_fourw {float:left;width:100%;padding:15px}
.cnter_wrapr,.numbr_1stsc{padding:0;float:left;width:100%}
.icon_mxwdth {max-width:50px;margin:0 auto 20px;display:block}
.chuse_eight .main_sheadr{color:#555}
.chuse_wrper .mainp_parag{color:#000;font-weight:400;line-height:22px;text-align:center}
.projectFactsWrap .item{flex:100%}
.projectFactsWrap .item i{font-size:40px;margin-bottom:20px;position:relative;display:block}
.projectFactsWrap .item p{font-size:15px}
.numbr_1stsc img{left:auto;max-width:20px;top:0;margin:auto}
.numbr_2stsc {float:left;width:100%}
.contact_btn {padding:9px 28px;font-size:14px;float:none;margin:auto;display:block}
.heade_cntct,.headr_scial{float:none}
.heade_cntct,.heade_cntct li,.headr_scial .btn{text-align:center}
.baner_wrper .hero1_para,.baner_wrper .hero2_para{font-size:14px;font-weight:400}
.baner_wrper .hero1_h1,.baner_wrper .hero2_h1{font-size:30px}
.carousel-wrap{margin:0 auto;padding:0}
.owl-nav i{font-size:24px}
.owl-nav .owl-next{right:-5px}
.owl-nav .owl-prev{left:-5px}
.prodt_fours {float:left;width:100%;padding:15px}
.banr2_wrper {float:left;width:100%;padding:30px 0}
.banr2_wrper .mainp_headr{font-size:22px;font-weight:700;margin:0}
.baner_wrper .fade-carousel{position:relative;height:240px}
.baner_wrper .fade-carousel .carousel-inner .item{height:240px}
.baner_wrper .fade-carousel .slides .slide-1,
.baner_wrper .fade-carousel .slides .slide-2,
.baner_wrper .fade-carousel .slides .slide-3{height:240px;}
}
@media (max-width: 450px){
.prodt_three {float:left;width:100%;padding:15px}
.projt_three {width:100%;padding:15px 0}
}
@media (max-width: 400px){
.foter_navbr li{float:left;width:100%}
.galry_three {float:left;width:100%;padding:15px}
}


<style>
		body {
			font-family: Arial, Helvetica, sans-serif;
		}

		* {
			box-sizing: border-box;
		}

		/* Button used to open the contact form - fixed at the bottom of the page */
		.open-button {
			background-color: #fff;
			color: white;
			padding: 0px 0px;
			border: none;
			border-radius: 50px;
			cursor: pointer;
			opacity: 100%;
			position: fixed;
			bottom: 5px;
			right: 5px;
			width: 80px;
		}

		

		/* The popup form - hidden by default */
		.form-popup {
			display: none;
			position: fixed;
			bottom: 0;
			right: 15px;
			border: 3px solid #f46a14;

			z-index: 9;
		}

		/* Add styles to the form container */
		.form-container {
			max-width: 300px;
			padding: 10px;
			background-color: #fff;
		}

		/* Full-width input fields */
		.form-container input[type=text],
		.form-container input[type=text],
		.form-container textarea[type=text]{
			width: 100%;
			padding: 10px;
			margin: 5px 0 5px 0;
			border: none;
			background: #f1f1f1;
		}

		/* When the inputs get focus, do something */
		.form-container input[type=text],
		.form-container input[type=text],
		.form-container textarea[type=text]{
			background-color: #ddd;
			outline: none;
		}

		/* Set a style for the submit/login button */
		.form-container .btn {
			background-color: #f46a14;
			color: white;
			padding: 10px 20px;
			border: none;
			cursor: pointer;
			width: 100%;
			margin-bottom: 5px;
			opacity: 0.8;
		}

		/* Add a red background color to the cancel button */
		.form-container .cancel {
			background-color: #06797d;

		}

		/* Add some hover effects to buttons */
		.form-container .btn:hover,
		.open-button:hover {
			opacity: 1;
		}


.video-container {
  position: relative;
}
video {
  height: auto;
  vertical-align: middle;
  width: 100%;
}



main {
  margin: 0 auto;
  width: 80%;
}
</style>

