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

@media (max-width: 1199px){
	.foil{max-width:100vw;}
	
}

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

}

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

}

/* Specific to change the nav bar UI only */
@media (max-width: 767px) {
	.foil{padding:0 20px;}
	.fd-p50{flex:0 1 auto}

	[class*="fw"]{flex:0 1 auto;}
	[class*="fd"]{flex:0 1 auto;}
	
/*	.header-top {padding: 15px 0;}
	.header-top span:not(:last-of-type){display:none;}*/
	
	.header-foil{flex-direction:column;padding: 10px 0; align-items: flex-start;}
	
	.quick-links{position: relative;top:auto; right: auto; padding-bottom: 10px;}
	
	.header-left {justify-content: space-between;}
	.header-left .logo img{width: 160px;}
	.header-left .distributor img{width: 120px;}
	
	.nav-foil-top .tag-line{font-size: 14px}
	.nav-foil-top .btn-custom{display:none}
	
	.inner.row{flex-wrap: wrap;grid-gap: 30px;}
	
	.main-nav-foil{
		position: absolute;
		right: 15px;
		top:10px;
	}
	.main-nav-foil label {
    display: block;
    cursor: pointer;
		background-color: var(--thm-blue);
		padding: 2px 6px;
		width: 28px;
		text-align: center;
  }
	.main-nav-foil label:before {
    content: "\f0c9";
		font:var(--fa-font-solid);
		font-size:32px;
		vertical-align: middle;
    color: var(--thm-white);
  }
	.main-nav-foil input:checked + label::before {
		content: "\f00d";
		font:var(--fa-font-solid);
		font-size: 32px;
		vertical-align: middle;
	}
	
	.main-nav-foil input:checked ~ .main-nav {
		display:flex;
		opacity: 1;
		visibility: visible;
	}
	
	.main-nav{
		display: none;
		flex-direction: column;
		align-items:stretch;
    position: absolute;
    opacity: 0;
    visibility: hidden;
		top: 38px;
    right: 0px;
		background: var(--thm-white);
		min-width: 220px;
		box-shadow: 0 0 18px 0 rgba(var(--thm-grey-rgb),.3);
		border-top:3px solid var(--thm-blue);
	}

	.main-nav > li{border-bottom:1px solid var(--thm-border);}
	
	.main-nav > li a{padding: 10px 20px;}
	.main-nav > li:first-of-type a{border:none;padding: 10px 20px;}
	
	.main-nav li.dropdown{flex-direction:column;padding:0}
	.main-nav li.dropdown a{padding:10px 20px;}
	.main-nav li.dropdown ul{
		position:relative;
		top: 0;
		box-shadow: 0 0 0 0 transparent;

	}
	
	.input-foil.inline.fw-200 label span{flex:0 1 auto;}
	/*--------General--------*/
	
	.bread-crumb-title h2{font-size:46px;text-align: center;}
	.bread-crumb-nav{left:20px;}
	
	/*--------Home Page--------*/
	
	.main-slider{/*height: 500px; background-position:-730px; background-size: cover;*/}
	
	.main-slider .slide .content{margin: 0 30px;}
	/*.main-slider .banner-carousel{max-width: 370px}*/
	.main-slider .btns-box .btn{background-color: var(--thm-white);}
	
	.moto img{width: 100%}
	
	.service-card-foil.row{flex-wrap:wrap;grid-gap:60px;}
	/*.card.service .card-top img{width:370px;}*/
	
	.product-intro-foil .content .row{flex-wrap:wrap;grid-gap:30px;}
	.product-intro-foil .content h3{font-size:38px; text-align: center}
	.product-intro-foil .content h4{font-size:26px;}
	
	.product-video-foil{background-position:-800px 280px}
	.product-video-foil .product.foil.row{flex-wrap:wrap; justify-content: center;}
	.product-video-foil .content{flex:0 1 auto;}
	
	.product-video-foil .play-btn-bg img{width:320px;}
	
	.inovation-foil .inovation.row{flex-wrap: wrap;}
	.inovation-foil .inovation .fw-600{flex: 1 1 auto;}
	
	.features-content-foil{flex-wrap:wrap;}
	
	.testimonial-foil{max-width: 340px;}
	.testimonial-foil .theme_carousel.row{flex-wrap:wrap;}
	.testimonial-foil .gg-40{grid-gap:0;}
	
	.testimonial-foil .testimonial-box{margin:0;box-shadow: none;}
	.testimonial-foil .testimonial-box.row{flex-wrap:wrap;}
	.testimonial-foil .testimonial-box .text-foil{flex-wrap:wrap;border:1px solid var(--thm-border);}
	
	.callback.fw-500{flex:0 0 280px;}
	.callback h3{font-size:26px;}
	
	.home-blog-card-foil.row{flex-wrap: wrap;grid-gap:20px}
	.home-blog-card-foil h2{font-size:26px;}
	
	.blog-cards-foil.row{flex-wrap:wrap;}
	
	/*--------About Page (Company)--------*/
	
	.about-intro-foil{padding-bottom: 80px}
	.about-intro.row{flex-direction:column;}

	.about-intro .sidebar .header.row{flex-direction:column-reverse; row-gap:20px}
	.about-intro .sidebar .image{position:relative;margin: 0 6px;}
	.about-intro .sidebar .image.header{top:12px;left:6px}
	.about-intro .sidebar .image.header img{top:-12px; left:-12px;max-width: 100%;}
	
	.about-intro .sidebar .footer.row{flex-direction:column; padding-left: 0;}
	.about-intro .sidebar .image.footer {top:12px; left:6px;}
	.about-intro .sidebar .image.footer img{top:-12px; left:-12px;max-width:100%;}

	.about-mission-foil.row{flex-wrap: wrap;}
	
	.about-mission-foil .image{flex: 1 1 auto;}

	.statements-foil.p-40{padding-left:20px; padding-right:20px;}

	
	/*--------Services Page--------*/
	.service-page .section-title .text{font-size:24px;line-height: 1.4em;display:block;text-align: center;}
	.service-page .section-title .text::before{display:none}
	.service-page .section-title .text::after{display:none}
	.service-foil.row{flex-direction: column-reverse;}
	.service-foil .section-title .text{font-size:16px;}
	
	/*------- Product Page---------*/
	.product-card{flex:1 1 auto}
	.product-foil.row{flex-direction:column-reverse;}
	.product-review-foil.row{flex-direction:column;row-gap:30px;grid-row-gap:30px;}
	
	.product-detail.ptb-80{padding-bottom: 0;}
	.product-detail figure.mb-60{margin-bottom: 30px;}
	
	/*------- Distributors Page---------*/
	.distributor__foil {padding: 40px 0;}
	.distributor__foil [class*="fd"]{flex:1 1 auto;}
	
	/*------- FAQ Page---------*/
	.bread-crumb-foil.faq h2{font-size:38px;}
	.faq-foil.row{flex-direction:column;row-gap:30px;grid-row-gap:30px;}
	
	/*------- Media Video Page---------*/
	.video-foil.row{flex-wrap:wrap;}
	.video {flex:0 1 400px;}
	
	/*------- Blogs/Single Blog Page---------*/
	.blogs-foil.row {flex-wrap:wrap;}
	.blog-card-foil.row{flex-direction:column;}
	.blog-card .content{padding:20px;}
	.blog-card-comment-form.p-60{padding:30px;}
	.blog-card-comment-form .input-foil .row{flex-direction:column;row-gap:30px; grid-row-gap:30px;}
	.blog-card-foil .fw-340{flex:0 1 auto;}
	
	
	/*------- Contact Us Page---------*/
	.contact-cards-foil.row{flex-direction:column;row-gap:30px; grid-row-gap:30px;}
	.contact-main-foil.row{flex-direction:column;}
	
	.contact-form.p-60{padding:30px;}
	.contact-form #form1 .row{flex-direction:column;row-gap:20px; grid-row-gap:20px;}
	.contact-form input:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]){
		width:auto;
	}
	.contact-form textarea{min-height:180px;}
	
	/*--------Page Footer--------*/
	.footer-callme-foil .foil{padding:0 20px;}
	.footer-callme .logo img{width:200px;}
	.footer-callme{flex-direction:column;row-gap:30px;}
	.footer-callme .text{text-align: center;}
	.footer-callme .text h4{margin-bottom:10px;}
	.footer-callme .links{display:flex; flex-direction: column; row-gap:20px; align-items: center;}
	
	.footer-main-foil.foil{padding:30px 20px;}
	.footer-main.row{flex-wrap:wrap;grid-gap:30px;}
	
	.footer-copyright-foil{padding:20px 0;}
	.footer-copyright{font-size: 14px; flex-wrap:wrap;}

}

@media (min-width: 576px) and (max-width: 767px) {

}

@media (min-width: 412px) and (max-width:575px){
		.statements-carousel{max-width: 325px;}
}

@media (min-width: 375px) and (max-width:411px){
	.main-slider .banner-carousel{max-width: 300px}
	.testimonial-foil{max-width: 300px;}
	.callback.fw-500{flex:0 0 270px;}
	.statements-carousel{max-width: 295px;}
	.blog-page h1{font-size:36px;}
}

@media (min-width : 321px) and (max-width: 360px){
	.nav-foil-top .tag-line{font-size: 13px}
	.main-slider .banner-carousel{max-width: 280px}
	/*.card.service .card-top img{width:320px;}*/
	.product-video-foil{background-position:-800px 400px}
	
	.testimonial-foil {max-width: 300px}
	
	.video-text.p-30{padding:20px;}
	
	.statements-carousel{max-width: 280px;}
	
	.blog-page h1{font-size:36px;}
	
	.contact-page .section-title .text{font-size:22px;line-height: 1.4em;display:block;text-align: center;}
	.contact-page .section-title .text::before{display:none}
	.contact-page .section-title .text::after{display:none}
	.contact-form h3{font-size:26px;}
	
}

@media (max-width: 320px){

}