@media(max-width:1200px){
.container{ width:auto;}
.contact-right{ display: none;}
header ul{ float: right !important;}
}
@media (max-width: 1100px) {
	.contact-form, .address-col {float: none; width: auto; padding: 50px 15px; margin-left: -15px;}
	.box-row .prev-arrow {
		left: 10px;
	}
	.box-row .next-arrow {
		right: 10px;
	}
}
@media(max-width:1024px){
	[data-bg], #frameTwo {background-attachment: scroll;}
}
@media(max-width:1023px){
	header{ padding:15px !important;}
	header.sticky .menuClick span{ background-color:#333;}
	body {position: relative; right: 0px}
	header, header ul, body {-webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in;}
	header ul {background-color: #fff; height: 100%; float: none !important; overflow-y: scroll; overflow-x:hidden; width: 320px; position: fixed; padding:0; right:-320px; top:0px;}
	body.opened, body.opened header {right: 320px;}
	body.opened header ul {right: 0px;}
	header ul li{ float: none; padding-right: 0;}
	header.sticky .logo, .logo {padding:0;}
	.logo {width: 90px;}
	header.sticky ul li a, header ul li a { border-bottom: 1px solid #ccc; color:#333; padding:15px; display: block;}
	.menuClick{ display: inherit;}
	.banner-section h2, .content-section h2, .banner-desc h1 span{ font-size:32px; line-height:36px;}
	#frameThree .col-xs-6 {
		float: none;
		width: auto;
	}
	.contact-banner {display: none;}
	#frameThree #footer {padding: 50px 15px;}
}

@media(max-width:767px){
#frameOne [class*="col-xs-"]{ float: none; width: 100%; margin-bottom: 30px;}
#frameOne [class*="col-xs-"]:last-child{ margin-bottom: 0; }
.sectionColumn p{ padding-right: 0;}
.sectionContentInner h3{ display: inline-block;}
#detailContent{ padding-right: 0;}
.productList .col-xs-4 {float: left; width: 50%;}
.footerLeft, .footerRight {float: none; width: 100%;}
.footerRight {text-align: center !important;}
#footer a {margin: 0 4px;}
}

@media(max-width:640px){
[class*="col-xs-"]{ float: none; width: 100%;}
body.opened, body.opened header {right: 240px;}
header ul {right: -240px; width: 240px}
.banner-section h2, .content-section h2, .banner-desc h1 span{ font-size:24px; line-height:30px;}
.sectionContentInner{ padding: 40px 0}
.content-section h2{ margin-bottom: 20px;}
.sideBar {padding-left: 15px;}
.hydroImg{ text-align: center;}
#footer, #frameThree #footer{ padding:0px 0px 30px; text-align: center;}
#footer ul{ padding-bottom:0px;}
.mobiWrap{ overflow-x: auto }
#leftTab{ float: none; margin-bottom: 20px; width:620px; }
#leftTab li{ display: inline-block; min-height: inherit; padding: 0 10px;}
#leftTab li a.currentTab{ font-size: 16px !important; font-weight: bold;}
#detailContent{ margin-left: 0; padding-top: 0 !important}
.title-blk{ width: 100%;}
.button {min-width: 200px; padding: 15px;}
#subBanner {height: 250px;}
.selectMenu {margin: 0px 0px 30px;}
#footer {padding-top: 0px;}
.footerCol {padding-bottom: 35px;}
.scIcons {margin-bottom: 20px;}
.footerCol > div {width: 100%;}
.footerCol .col-xs-2 {padding: 0px;}
#footer .footerCol h5 {border-bottom: 1px solid white; line-height: 24px; padding:15px 10px;}
#footer li {border-bottom: 1px solid white; padding-bottom:0px;}
#footer li a {display: block; padding:15px 10px;}
.subContainer table th {display: none;}
.subContainer table td {display: table; width: 100%; padding: 0px;}
.subContainer table td:before, .subContainer table td span {display: table-cell; padding: 15px; vertical-align: middle;}
.subContainer table td:before {content: attr(data-title); font-weight: bold; width: 40%; padding-right: 15px;}
[data-bg] {background-position: right center;}
.hero-caption {background-color: rgba(0, 0, 0, 0.55); width: 90%; left: 15px; padding: 20px 5px;}
[data-bg]:after {
	bottom: 0px;
	left: 0px;
	position: absolute;
	right: 0px;
	top: 0px;
	z-index: -1;
}
}

@media(max-width:440px){
.productList .col-xs-4 {float: left; width: 100%;}
.productList .col-xs-4 img {width: 100%;}
}
@media(max-width:340px){
	.hero-caption p {display: none;}
}