/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	/*margin: 1% 0 1% 1.6%;*/
}
.col:first-child { margin-left: 0; }


ul.touts li { width: 27%; padding: 0 1%; display: inline-block; }
ul.touts a { color: #000; }
.section.hero { background-color: #8e8c8d; color: #fff; padding: 40px 0; }
.section.hero h4 { letter-spacing: 6px; font-size: 17px; font-family: 'LG Smart Bold'; }
.section.hero h1 { font-family: 'LG Smart Bold Italic'; }

@media only screen and (max-width: 768px) {
	ul.touts li { width: 80%; margin: 0 auto; display: inherit; }
	.section.hero center { width: 60%; margin: 0 auto; }
}


/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }

/*  GRIDS */
.span_6_of_6 {width: 100%;}
.span_5_of_6 {width: 83.06%;}
.span_4_of_6 {width: 66.13%;}
.span_3_of_6 {width: 49.2%;}
.span_2_of_6 {width: 32.26%;}
.span_1_of_6 {width: 15.33%;}

.span_5_of_5 {width: 100%;}
.span_4_of_5 {width: 79.68%;}
.span_3_of_5 {width: 59.36%;}
.span_2_of_5 {width: 39.04%;}
.span_1_of_5 {width: 18.72%;}

.span_4_of_4 {width: 100%;}
.span_3_of_4 {width: 74.6%;}
.span_2_of_4 {width: 49.2%;}
.span_1_of_4 {width: 23.8%;}

.span_3_of_3 {width: 100%;}
.span_2_of_3 {width: 66.13%;}
.span_1_of_3 {width: 32.26%;}

.span_2_of_2 {width: 100%;}
.span_1_of_2 {width: 49.5%;}

/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 768px) {
	.col {  margin: 1% 0 1% 0%; }
	.span_1_of_6, .span_2_of_6, .span_3_of_6, .span_4_of_6, .span_5_of_6, .span_6_of_6 { width: 100%; }
	.span_1_of_5, .span_2_of_5, .span_3_of_5, .span_4_of_5, .span_5_of_5 { width: 100%; }
	.span_1_of_4, .span_2_of_4, .span_3_of_4, .span_4_of_4 { width: 100%; }
	.span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; }
	.span_2_of_2, .span_1_of_2 { width: 100%; }
}

	body {
		font-size: 16px !important;
	}
	img[usemap] {
		border: none;
		height: auto;
		max-width: 100%;
		width: 100%;
	}
	
	.max-16 {
		width: 100%;
		max-width: 1600px;
		margin: 0 auto;
	}
	.max-1190 {
		width: 100%;
		max-width: 1190px;
		margin: 0 auto;
	}
	.max-1215 {
		width: 100%;
		max-width: 1250px;
		margin: 0 auto;
	}
	
	.section {
		position: relative;
	}
	.container-abs {
		position: absolute;
	}
	.play-btn {
		margin-left: 45.5%;
		margin-top: 17%;
		width: 7%;
		max-width: 110px;
	}
	.nav {
		width: 100%;
		max-width: 1600px;
		margin: 0 auto;
	}
	.copyblock {
		width: 100%;
		max-width: 822px;
	}
	.copyblock p span {
		font-weight: bold;
		clear: both;
		display: inherit;
	}	
	.copyblockslider {
		width: 100%;
		text-align: left;
	}
	.copyblockslider .headline {
		/*font-size: 215%;*/
		font-size: calc(16px + .7vw);
	}
	.headline {
		font-family: lg smart;
		font-weight: bold;
		/*font-size: 250%;*/
		font-size: calc(16px + 1vw);
	}
	.copy {
		font-family: lg smart regular;
		/*font-size: 125%;*/
		font-size: calc(16px + .16vw)
	}
	.margin25 {margin: 25px auto;}
		.margin25top {margin: 25px auto 0px;}
		.margin25bot {margin: 0px auto 25px;}
	.margin50 {margin: 50px auto;}
		.margin50top {margin: 50px auto 0px;}
		.margin50bot {margin: 0px auto 50px;}
	.margin75 {margin: 75px auto;}
		.margin75top {margin: 75px auto 0px;}
		.margin75bot {margin: 0px auto 75px;}
	.margin100 {margin: 100px auto;}
		.margin100top {margin: 100px auto 0px;}
		.margin100bot {margin: 0px auto 100px;}
	.sliderbotmargin {margin-bottom: 10%;}

	/* comparison slider css */
	.ba-slider {
	  position: relative;
	  overflow: hidden;
	  margin: 0 auto;
	}

	.frame {
	  position: absolute;
	  top: 0;
	  left: 0;
	}

	.resize {
	  position: absolute;
	  top: 0;
	  left: 0;
	  height: 100%;
	  width: 5%;
	  overflow: hidden;
	  background-color: white;
	}

	.handle { /* Thin line seperator */
	  position:absolute; 
	  left:5.5%;
	  top:0;
	  bottom:0;
	  width:4px;
	  margin-left:-2px;

	  background: white;
	  cursor: ew-resize;
	}

	.handle::after {
		position: absolute;
		top: 65%;
		width: 35px;
		height: 35px;
		margin: -32px 0 0 -17px;
		content: url(/us/laundry/ultimate-laundry-room/assets/images/arrows-red.png);
		color: black;
		font-weight: inherit;
		font-size: 35px;
		text-align: center;
		line-height: 20px;
		background: #fff;
		border: 2px solid #d1d3d4;
		border-radius: 50%;
		transition: all 0.3s ease;
	}
	/* comparison slider css end */	
	.graybarbot {
		background: rgb(143, 140, 141) none repeat scroll 0% 0%;
		color: rgb(255, 255, 255);
		min-height: 165px; 
		padding-bottom: 14.2%;
	}
	.graybarbot .copyblock {
		text-align: left; 
		float: left; 
		width: 100%; 
		max-width: 1600px; 
		padding: 3.8% 9%;
	}
	.graybarbot .headline {
		width: 36%; 
		float: left;
	}
	.graybarbot .copy {
		width: 64%; 
		float: left; 
		margin: 0px; 
		padding-left: 6%; 
		padding-top: 0.5%;
	}
	.btn {color: #fff !important;}
	.cta {margin-top: 20% !important;}
