@media (min-width: 1200px) {
	footer .col-xl-3 {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%;}
	footer .col-xl-4 {-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
}
@media (max-width: 1440px) {
	.hero-des {top: 40%;}
	.hero-banner img {height: 45vw;}	
	.intro-row-one {-ms-flex-align: flex-start; align-items: flex-start;}
}
@media (max-width: 1366px) {
	.hero-des { width: 100%;}
}

@media (max-width: 1280px) {
	.innerpage-container { width: calc(100% - 100px);}
	.container { max-width: 90%;}
	.innerpage-banner h1, .tab-heading h2, .servicehead h2 {font-size: 45px;}
	 .frontdes h4, .flip-card-back h3 { font-size: var(--font18);}
	.contentleft p {font-size: var(--font16);}
	.innerpage-banner h4 { font-size: 20px;}
	.owner-info {left: 0px;}
	.owner-left-desc p {font-size: var(--font16);}
	.owner-info h4 {font-size: var(--font20);}
	.sectionhead {font-size: 40px;}
	.introleft h2 {font-size: 40px;}
	.hmaboutright p, .splcol p, .hmaboutright ul li {font-size: var(--font16);}
	.splcol h4 {font-size: var(--font20);}
	.rightcontainer {margin: 0 50px;}
}

@media (max-width: 1200px) {
	.servicecol {width: calc(49% - 5px); margin-bottom: 30px;}
	.countercol {  width: 26%;margin: 1% 2%;}
	.hero-des h1, .hm-about-panel h2.sectionhead {font-size: 50px;}
	.hero-des a {font-size: var(--font20);}
	.hero-des a:before {top: 10px;}
}

@media (max-width: 1199px) {
	.logo {width: 400px;}
	.navbar{padding: 18px 30px 18px;}
	.logosblock{padding: 0;}
	.mob-nav {
		position: fixed;
		display: block;
		top: 0;
		right: -330px;
		height: 100%;
		-webkit-transition: right 0.5s ease 0s;
		-moz-transition: right 0.5s ease 0s;
		-o-transition: right 0.5s ease 0s;
		-ms-transition: right 0.5s ease 0s;
		transition: right 0.5s ease 0s;
		z-index: 1200;
		-webkit-transform: translateZ(0);
		-moz-transform: translateZ(0);
		-o-transform: translateZ(0);
		-ms-transform: translateZ(0);
		transform: translateZ(0);
	}
	.mob-nav.open {right: 0; position: fixed; height: 100%;	}
	.nav-panel {
		background-color: #fff;
		height: 100%;
		width: 320px;
		position: relative;
		box-shadow: -8px 0px 19px -3px rgb(0 0 0 / 8%);
		padding: 22px;
		/*float: right;*/
		overflow-y: hidden;
	}
	.mobnav-list {padding: 22px 0; margin: 0;}
	.mobnav-list li {padding: 10px 0;
		list-style-type: none;
		border-bottom: 1px solid #e6e6e6;
		margin-bottom: 0;
		display: block;
		text-align: left;
	}
	.mobnav-list li a {		
		font-size: 16px;
		line-height: 1.1;
		color: #000;
		font-weight: 400;
		padding: 0;
		text-decoration: none;
		display: block;
		-webkit-transition: all 200ms linear;
		-moz-transition: all 200ms linear;
		-o-transition: all 200ms linear;
		-ms-transition: all 200ms linear;
		transition: all 200ms linear;
	}
	.mobnav-list li a:hover {color: var(--primary);}	
	.mobnav-list li:last-child {border-bottom: 0;}
	
	#navigation-toggle, #navigation-toggle.open-menu {box-shadow: none; position: absolute; right: 0px; top: 0;}
	#navigation-toggle.open-menu {
		background-color: #fff;
		-webkit-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.5) inset;
		-moz-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.5) inset;
		-o-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.5) inset;
		-ms-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.5) inset;
		box-shadow: 0 1px 1px rgba(255, 255, 255, 0.5) inset;
	}
	#navigation-toggle {
		background: transparent;
		/*float: left;*/
		height: 40px;
		-webkit-transition: all 500ms ease-in 0s;
		-moz-transition: all 500ms ease-in 0s;
		-o-transition: all 500ms ease-in 0s;
		-ms-transition: all 500ms ease-in 0s;
		transition: all 500ms ease-in 0s;
		width: 50px;
		position: fixed;
		z-index: 9999;
		top: 26px !important;
		right: 20px;
	}
	.menu-icon {background-image: none; display: inline-block; vertical-align: top;}
	.icon-toggle {
		position: absolute;
		display: inline-block;
		padding: 7px 11px;
		line-height: 15px;
		left: 0;
		-webkit-transition: all 0.3s ease 0s;
		-moz-transition: all 0.3s ease 0s;
		-o-transition: all 0.3s ease 0s;
		-ms-transition: all 0.3s ease 0s;
		transition: all 0.3s ease 0s;
	}
	.lines {background-color: #636363; display: inline-block; height: 2px; position: relative; width: 30px;}
	.lines:before, .lines:after {
		background-color: #636363;
		content: "";
		display: inline-block;
		height: 2px;
		left: 0;
		position: absolute;
		-webkit-transform-origin: 50% 50% 0;
		-moz-transform-origin: 50% 50% 0;
		-o-transform-origin: 50% 50% 0;
		-ms-transform-origin: 50% 50% 0;
		transform-origin: 50% 50% 0;
		width: 30px;
	}
	.lines:before {top: 6px;}
	.lines:after {top: -6px;}
	.icon-toggle .lines {
		-webkit-transition: background 0.3s ease 0.6s;
		-moz-transition: background 0.3s ease 0.6s;
		-o-transition: background 0.3s ease 0.6s;
		-ms-transition: background 0.3s ease 0.6s;
		transition: background 0.3s ease 0.6s;
	}
	.icon-toggle .lines:before, .icon-toggle .lines:after {
		-webkit-transform-origin: 50% 50% 0;
		-moz-transform-origin: 50% 50% 0;
		-o-transform-origin: 50% 50% 0;
		-ms-transform-origin: 50% 50% 0;
		transform-origin: 50% 50% 0;
		-webkit-transition: top 0.3s ease 0.6s, transform 0.3s ease 0s;
		-moz-transition: top 0.3s ease 0.6s, transform 0.3s ease 0s;
		-o-transition: top 0.3s ease 0.6s, transform 0.3s ease 0s;
		-ms-transition: top 0.3s ease 0.6s, transform 0.3s ease 0s;
		transition: top 0.3s ease 0.6s, transform 0.3s ease 0s;
	}
	.menu-toggle.active .icon-toggle .lines {
		background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
		-webkit-transition: background 0.3s ease 0s;
		-moz-transition: background 0.3s ease 0s;
		-o-transition: background 0.3s ease 0s;
		-ms-transition: background 0.3s ease 0s;
		transition: background 0.3s ease 0s;
	}
	.menu-toggle.active .icon-toggle .lines:before, .menu-toggle.active .icon-toggle .lines:after {
		top: 0;
		-webkit-transition: top 0.3s ease 0s, transform 0.3s ease 0.5s;
		-moz-transition: top 0.3s ease 0s, transform 0.3s ease 0.5s;
		-o-transition: top 0.3s ease 0s, transform 0.3s ease 0.5s;
		-ms-transition: top 0.3s ease 0s, transform 0.3s ease 0.5s;
		transition: top 0.3s ease 0s, transform 0.3s ease 0.5s;
		width: 30px;
	}
	.menu-toggle.active .icon-toggle .lines:before {
		-webkit-transform: rotate3d(0, 0, 1, 45deg);
		-moz-transform: rotate3d(0, 0, 1, 45deg);
		-o-transform: rotate3d(0, 0, 1, 45deg);
		-ms-transform: rotate3d(0, 0, 1, 45deg);
		transform: rotate3d(0, 0, 1, 45deg);
	}
	.menu-toggle.active .icon-toggle .lines:after {
		-webkit-transform: rotate3d(0, 0, 1, -45deg);
		-moz-transform: rotate3d(0, 0, 1, -45deg);
		-o-transform: rotate3d(0, 0, 1, -45deg);
		-ms-transform: rotate3d(0, 0, 1, -45deg);
		transform: rotate3d(0, 0, 1, -45deg);
	}
	.menu-toggle.active .menu-icon {left: 14px;}
	body.open-menu {overflow: hidden;}
	.mob-nav .sm-icons {text-align: left;}
	.mob-nav .sm-icons li {display: inline-block;}
	.hero-banner{padding-top: 88px;}
	.innerpage-banner{padding: 180px 0 70px;}
}

@media (max-width: 991px) {
	.contact-panel .row { flex-direction: column-reverse;}
	.map-block {margin-top: 50px;} 
	.innerpage-banner { padding: 150px 0 50px;}
	.innerpage-banner h1 { font-size: 36px;}
	.copyrightwrap {margin-top: 70px;}
	.ftrcol p, .contactnav li a {font-size: var(--font14);}
	.ourwork-panel .col-md-3 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.ourwork-panel .col-md-9 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.tablist { padding-top: 0; display: flex;justify-content: center;padding-bottom: 60px;}
	.tablist a {display: inline-block;}
	.tablist li a.active, .tablist li a:hover { padding: 5px 15px 5px 15px;}
	.tablist li a.active:before, .tablist li a:hover::before { width: 100%;}
	.tablist li a:before {left: 0; right: 0; margin: 0 auto; top: auto;bottom: 0;}
	.servicecol {width: 100%; margin-bottom: 30px; background-color: #c61f1f;}
	.flip-card-inner {display: flex;flex-wrap: wrap; }
	.flip-card-front { width: 50%;}
	.flip-card-back { position: relative;transform: rotateY(0deg); width: 50%;}
	.frontdes h4, .flip-card-back h3 { font-size: var(--font24);}
	.contentleft p {font-size: var(--font18); }
	.service-panel {padding: 90px 0 40px;}
	.frontdes {padding: 40px 25px;}
	.banner-desc-right img { width: 40%;}
	.owner-img { margin: 0px 0 0 auto;}
	.owner-info { max-width: 550px; padding: 70px 50px;}
	.build-two { margin-left: -10%; width: 34%;}
	.build-one { width: 40%;}
	.owner-left-desc { padding-left: 0; padding-top: 50px;}
	.client-panel { padding: 80px 0 150px;}
	.innerpage-banner h4 { padding: 40px 0 50px;}
	.brandsslider .slick-prev, .brandsslider .slick-next, .specialization_slider .slick-prev, .specialization_slider .slick-next { top: auto; bottom: -70px; width: 55px;  height: 50px; background-size: 16%; backdrop-filter: blur(0);}
	.brandsslider .slick-prev, .specialization_slider .slick-prev {right: 90px;}
	.introright img { width: 45%;}
	.introright {margin: 50px auto; text-align: center; padding-right: 15px;}
	.counter-block {width: 100%;}
	.our-specialization-panel .container, .client-panel .container {max-width: 98%;}
	.pr80 {padding-right: 50px;}
	.introlist li {font-size: var(--font18);}
	.flip-card:hover .flip-card-inner {-webkit-transform: rotateY(0deg); -moz-transform: rotateY(0deg); -o-transform: rotateY(0deg); -ms-transform: rotateY(0deg);	transform: rotateY(0deg);}
	.banner-desc-right{padding-bottom: 20px;}
	
	.hero-des h1{padding-bottom: 18px;}
	.hero-banner img {height: 55vw;}
	.hero-des a:before {width: 25px; height: 3px;}
	.hero-des a {padding-left: 44px;}

}
@media (max-width: 890px) {
	.intro-panel {padding: 80px 0; margin-top: 0;}
	.countercol {width: 30%; margin: 1% 1%;}
	.hm-about-panel .col-md-6 {-ms-flex: 0 0 50%; flex: 0 0 100%; max-width: 100%;}
	.content-image img { width: 50%;}
	.hmaboutright {padding-left: 0; padding-top: 50px;}
	.hmaboutleft.content-img-wrapper {background-color: transparent;}
	.hero-des h1, .hm-about-panel h2.sectionhead {font-size: 42px;}
	.rightcontainer {margin: 0 auto;}
	.hero-des {top: 46%;}
	.hero-banner img {height: auto; object-fit: contain;}
}

@media (max-width: 767px) {
	.banner-desc-left { padding-right: 15px;}
	.ftrwrap { padding-top: 30px;}
	.copyrightwrap { text-align: center;}
	.copyrightwrap .text-right { text-align: center!important;}
	.innerpage-container {width: 95%;}
	.container { max-width: 95%;}
	.addcol p {font-size: var(--font16);}
	.map-block iframe { width: 100%; height: 300px;}
	.innerpage-banner h1 { font-size: 32px;}
	.contact-form { padding: 80px 0;}
	footer {padding: 60px 0 40px;}
	.copyrightwrap {margin-top: 50px;}
	.ftrcol h4 { font-size: var(--font18);}
	.certificate-wrapper { column-count: 2;}
	.certificate-block { width: 98%;margin: 0 auto 20px;}
	.project-block {width: 48%;}
	.tab-heading h2 { font-size: 35px;}
	.tablist li a {font-size: 18px;}
	.tablist li a.active:before, .tablist li a:hover::before {width: 75%;}
	.flip-card-back ul li {font-size: 13px;}
	.servicecol { width: 48%;}
	.flip-card-inner {display: block;}
	.flip-card-front, .flip-card-back { width: 100%;}
	.frontdes h4, .flip-card-back h3 {font-size: var(--font20);}
	.owner-info { max-width: 100%; padding: 70px 15px 0; position: relative; top: 0; border-bottom-right-radius: 0;}
	.owner-img {width: 100%;}
	.build-two { margin-left: 15px;width: 53%;}
	.build-one { width: 45%;}
	.owner-description { padding: 90px 0;}
	.companies-block {padding: 60px 30px;}
	.introleft h2 { font-size: 35px;}
	.hero-banner { width: 100%; margin: 0 auto;}
	.hero-des { left: 10%; top: 45%;}  /*70%*/
	.rightcontainer {padding-left: 15px;}
	.countercol h4 {font-size: var(--font20);}
	.countercol h3 {font-size: 36px;}
	.introlist .summary-list-item.is-inview:nth-child(3) { border-bottom: 1px solid #fff;}
	.introleft { padding-right: 15px;}
	.contentleft p { font-size: var(--font16);}
	.pr80 { padding-right: 0;}
	.hm-about-panel { padding: 80px 0;}
	.hero-banner:before {position: absolute; content: ""; left: 0; top: 0; width: 100%; height: 100%; background-color: rgb(204 204 204 / 41%); z-index: 1;}
    .hero-des { z-index: 2;}
}

@media (max-width: 600px) {
	.frmgroup-row .form-group { width: 100%;}
	footer .col-5 {-ms-flex: 0 0 36.666667%; flex: 0 0 36.666667%; max-width: 36.666667%;}
	footer .col-7 {-ms-flex: 0 0 62.333333%; flex: 0 0 62.333333%; max-width: 62.333333%;}
	.ftrcol p { font-size: 13.8px;}
	.form-group { padding-bottom: 5px;}
	.project-block { width: 100%;}
	.tablist li a { font-size: 17px; padding: 5px 8px;}
	.servicecol {width: 100%;}
	.hero-banner {padding-top: 80px;}
	.navbar {padding: 18px 20px 18px; height: 80px; align-items: center;}
	.logo { width: 320px;}
	#navigation-toggle{top: 23px !important;}
	.banner-desc-right { text-align: center;}
	.banner-desc-right img { width: 80%;}
	.sectionhead { font-size: 35px;}
	.brandsslider .slick-prev, .specialization_slider .slick-prev { left: -55px; right: 0; margin: 0 auto;}
	.brandsslider .slick-next, .specialization_slider .slick-next { left: 0; right: -55px; margin: 0 auto;}
	.contentleft p { font-size: var(--font16);}
	.innerpage-banner h4 {font-size: 18px;}
	.owner-info h4 { font-size: var(--font18);}
	.introright img { width: 80%;}
	.hero-des a { font-size: var(--font18); line-height: 1.25;}
	.countercol { width: 29%; margin: 1% 2%; padding: 20px;}
	.content-image img { width: 100%;}
	.hero-des h1, .hm-about-panel h2.sectionhead { font-size: 30px;}
	.hero-des { left: 25px; top: 45%; right: 0; margin: 0 auto; width: 90%;} /*top: 75%;*/
	.c-header_line { position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto;}/*, .heroban-title*/
	/*.hero-des a:before { display: none;}
	.hero-des a {padding-left: 0;}*/
	.countercol h4 {font-size: var(--font18);}
	.specialization_slider .slick-prev, .specialization_slider .slick-next {bottom: -40%;}
	.brandsslider .slick-prev, .brandsslider .slick-next {bottom: -95px;}
	.certificate-img img {border: 5px solid var(--lightgray);}
	.hero-des a {padding-left: 32px;}
	.hero-des a:before {width: 17px; height: 3px;}
}

@media (max-width: 480px) {
	.sectionhead {font-size: 28px; padding-bottom: 35px;}
	.countercol {width: 46%; margin: 2% 2%;}
	.splcol {max-width: 300px;}
	.introleft h2 {font-size: 32px;}
	specialization-panel .container, .client-panel .container {max-width: 100%; padding-right: 15px;}
	.slick-initialized .slick-slide {padding: 0 15px;}
	.logo {width: 265px;}
	.certificate-img img {border: 3px solid var(--lightgray);}
	.hero-des h1 {padding-bottom: 8px;}
	.mfp-image-holder .mfp-content {max-width: 90%;}
	.mfp-image-holder .mfp-close {right: 6%; top: 5%;}
}

@media (max-width: 360px) {
.countercol {width: 80%; padding: 25px;}
	.hero-des {top: 41%;} /*80%*/
}
@media (max-width: 325px) {
	.logo {width: 240px;}
}

@media (max-height: 460px) {
	.nav-panel {overflow-y: scroll;}
}