/* responsive css */

@media only screen and (max-width: 767px) {
	
	h1 { font-size: 36px; }
	h2 { font-size: 30px; }
	h3 { font-size: 26px; }
	h4 { font-size: 22px; }
	
	#headerWrapper { position: relative; top: 0px; left: 0px; background-color: transparent; } 	
	#headerWrapper.sticky { position: relative; background-color: transparent; } 	
	
	.myBtn { padding: 10px 25px }
	.myBtn:after { width: 35px; background-size: 10px; }
	
	.scrolTop { width: 25px; height: 25px; font-size: 15px; line-height: 20px; right: 10px; }
	
	.topHeader .phone li { display: block; }
	/* logo box */
	.logoBox { max-width: 100px; }
	

	/* menu box */
	.menuBox { display: none; }
	.mobileBox { display: block; }
	
	
	/* banner box */
	#bannerWrapper{margin: 0;}
	.bannerBox .item { min-height: 30vh; }
	.bannerBox .overlay { padding: 130px 0px 60px; width: 100%; max-width: 100%; }
	
	/* innerbanner box */
	.innerbannerBox { padding: 170px 0px 80px; }
	
	.aboutBox .img { padding-top: 35px; }
	
	.whyBox .text li { padding-left: 35px; width: 100%; }
	.whyBox .text li:before { left: 0px; }
	
	.copy { line-height: 18px; }
	.copy .left { width: 100%; }
	.copy .link { padding-top: 10px; float: left; }
	.copy .link li { margin-top: 7px; }
}
	
@media only screen and (min-width: 480px) and (max-width: 767px) {
	
	
	
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
	
	body { font-size: 13px; line-height: 23px; }
	
	h2 { font-size: 26px; }
	h3 { font-size: 22px; }
	h4 { font-size: 18px; }
	h5 { font-size: 17px; }
	h6 { font-size: 17px; }
	
	.myBtn { padding: 6px 20px; font-size: 15px; }  
	
	.bottomHeader { width: 92%; left: 4%; right: 4%; }
	/* logo box */
	.logoBox { max-width: 90px; }
	
	.menuBox ul li { margin-left: 22px; }
	.menuBox ul li > a { padding: 11px 0px; }
	.menuBox ul li > a span { padding: 6px 0px 7px; }
	
	/* banner box */
	#bannerWrapper{margin: 0;}
	.bannerBox h1{ font-size: 30px; line-height: 39px; }
	.bannerBox .item  { min-height: 30vh; }
	.bannerBox .overlay  { padding: 140px 0px 65px 33px; width: 70%; }
	
	/* innerbanner box */
	.innerbannerBox { padding: 90px 0px 80px; }
	
	/* footer box */
	.footerBox { font-size: 13px; }
	.footerBox .row { margin: 0px -5px; }
	.footerBox .item { padding: 0px 5px 0px; }
	.footerBox .text { padding: 35px 5px 15px; }
	.footerBox .text span.fa { margin: -22px 0px 0px -22px;width: 44px; height: 44px; line-height: 44px; font-size: 18px; }
	
	.copy .left { width: 100%; }
	.copy .link { padding-top: 10px; float: left; }
	.copy .link li { margin-top: 7px; }
	
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
	
	body { font-size: 15px; line-height: 26px; }
	
	.myBtn { padding: 6px 22px; }
	
	h2 { font-size: 28px; }
	
	.bottomHeader { width: 90%; left: 5%; right: 5%; } 
	
	/* banner box */
	.bannerBox .overlay { padding: 160px 0px 65px 50px; width: 55%; }
	
	/* innerbanner box */
	.innerbannerBox { padding: 110px 0px 100px; }
	
	.footerBox .text { padding: 40px 5px 15px; }
	.footerBox .text span.fa { margin: -22px 0px 0px -22px;width: 50px; height: 50px; line-height: 50px; font-size: 18px; }
	
}


@media only screen and (min-width: 1200px) and (max-width: 1360px) {	
	
	
}