/*
	============================================================

			Custom theme for Healthy Home Carpet Care
	
					  ©2017 INVISIBLE INK
					  Author: Chris Duren
					  www.invisibleink.com

			Increase your visibility with Invisible Ink™
			
	============================================================
*/

html {min-width: 980px;}

body	{
	margin: 0;
	padding: 0;
	background: #255da9;
	}

	/*   Basic Layout Divisions	*/
	
.block	{
	position: relative;
	width: 100%;
	padding: 0;
	margin: 0;
	}
	
.vp	{
	box-sizing: border-box;
	position: relative;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0;
	}

	/* Logo */

.logo	{
	min-height: 90px;
	background: #255ca8;
	color: #fff;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 1.5em;
	line-height: 1;
	z-index: 900;
	}

.logo .vp	{
	padding: 25px 20px 0 20px;
	text-align: right;
	}
	
.logo h1	{
	position: absolute;
	width: 400px;
	height: 150px;
	left: 50%;
	top: 5px;
	padding: 0;
	margin: 0 0 0 -235px;
	}

.logo h1 a	{
	display: block; 	
	width: 400px;
	height: 150px;
	margin: 0 auto;
	background: url(../img/icons.png) -26px 0 no-repeat;
	text-align: left;
	text-indent: -9999px;
	overflow: hidden;
	}

.logo span	{
	color: #97c6df;
	font-weight: 400;
	font-size: .75em;
	display: block;
	text-transform: capitalize;
	}
	
.logo p	{
	display: inline-block; 	
	zoom: 1;
	*display: inline;
	vertical-align: middle;
	padding: 20px 15px;
	margin: 0;
	}
	
#social	{
	width: 60px;
	display: inline-block; 	
	zoom: 1;
	*display: inline;
	vertical-align: middle;
	list-style: none;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	}

#social li	{
	display: inline-block;
	zoom: 1;
	*display: inline;
	vertical-align: middle;
	margin: 0;
	padding: 0;
	}
	
#social li a	{
	display: block;
	width: 60px;
	height: 60px;
	margin: 0;
	text-decoration: none;
	text-indent: -9999px;
	overflow: hidden;
	opacity: 0.8;
    transition: all 0.2s ease-in-out;
	}
	
#social li a:hover	{
	bottom: 15px;
	opacity: 1.0;
	}

#facebook	{background: url(../img/icons.png) -374px -274px no-repeat;}
	
	/* Navigation */

.menu	{
	position: relative;
	background: #fff;
	text-align: center;
	z-index: 800;
	text-transform: uppercase;
	}

.toggleMenu	{
	box-sizing: border-box;
	display: none;
	width: 100%;
	position: relative;
	margin: 0;
	padding: 15px;
	font-weight: 700;
	font-size: 1.25em;
	line-height: 1;
	color: #fff !important;
	cursor: pointer;
	background: #112d53;
	}

.nav	{
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
	z-index: 100;
	}

.tab	{
	position: relative;
	display: inline-block; 	
	zoom: 1;
	*display: inline;
	white-space: nowrap;
	vertical-align: middle;
	padding: 0;
	margin: 0;
	}

.tab a {
	display: block;
	font-weight: 700;
	font-size: 1.5em;
	line-height: 1;
	color: #255ca8;
	padding: 15px 30px;
	text-decoration: none;
	}
	
.tab:hover a	{
	text-decoration: underline;
	background: #255ca8;
	color: #fff;
	}

.about	{margin-right: 375px;}

	/* Header */

#parallax_offset	{
	display: none;
	height: 0;
	}

.photo	{
	box-sizing: border-box;
	position: relative;
	width: 100%;
    min-height: 600px;
	padding: 100px 0;
    background-repeat: no-repeat;
    background-attachment: fixed;
	background-size: 100% auto;
	z-index: 100;
	}
	
.scroll	{
	display: block;
	position: absolute;
	top: 400px;
	left: 50%;
	width: 250px;
	margin: 0 auto;
	margin-left: -125px;
	padding: 0;
	color: #fff;
	text-decoration: none;
	text-align: center;
  -webkit-animation: 
        fadeInDown 2s 1,
        levitate 2s infinite;  
    -moz-animation: 
        fadeInDown 2s 1,
        levitate 2s infinite;
    -ms-animation: 
        fadeInDown 2s 1,
        levitate 2s infinite;
	animation: 
        fadeInDown 2s 1,
        levitate 2s infinite;  
	}
	
.scroll:hover	{color: #fff;}
	
.scroll:after	{
	content: "";
	position: absolute;
	bottom: -45px;
	left: 50%;
	margin-left: -30px;
	width: 60px;
	height: 60px;
	background: url(../img/icons.png) -270px -360px no-repeat;
	}
	
@media screen and (min-width: 1350px) { 

	.photo	{min-height: 650px;}

	.scroll	{top: 450px;}

}

@media screen and (min-width: 1500px) { 

	.photo	{min-height: 700px;}

	.scroll	{top: 500px;}

}

@media screen and (min-width: 2000px) { 

	.photo	{min-height: 750px;}

	.scroll	{top: 550px;}

}

@-webkit-keyframes levitate{
	0% {-webkit-transform: translateY(-5px);}  
	50% {-webkit-transform: translateY(0px);}
	100%	{-webkit-transform: translateY(-5px);}
}

@-moz-keyframes levitate{
	0% {-moz-transform: translateY(-5px);}
	50% {-moz-transform: translateY(3px);}
	100%	{-moz-transform: translateY(-5px);}
}

@-ms-keyframes levitate{
	0% {-ms-transform: translateY(-5px);}
	50% {-ms-transform: translateY(3px);}
	100%	{-ms-transform: translateY(-5px);}
}
	
@keyframes levitate{
	0% {transform: translateY(-5px);}  
	50% {transform: translateY(0px);}
	100%	{transform: translateY(-5px);}
}
	
.photo h2	{
	box-sizing: border-box;
	position: absolute;
	width: 100%;
	bottom: 0;
	left: 0;
	padding: 15px 50px;
	margin: 0;
	color: #fff;
	font-size: 4em;
	text-align: center;
	text-transform: uppercase;
	z-index: 500;
	background: #255ca8;
	background: rgba(37,92,168,.8);
	animation-name: move;
    animation-iteration-count: 1;
	animation-duration: 1s;
	animation-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
	animation-delay: 0;
	-moz-animation-name: move;
    -moz-animation-iteration-count: 1;
	-moz-animation-duration: 1s;
	-moz-animation-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
	-moz-animation-delay: 0;
	-webkit-animation-name: move;
    -webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
	-webkit-animation-delay: 0;
	-o-animation-name: move;
    -o-animation-iteration-count: 1;
	-o-animation-duration: 1s;
	-o-animation-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
	-o-animation-delay: 0;
	-ms-animation-name: move;
    -ms-animation-iteration-count: 1;
	-ms-animation-duration: 1s;
	-ms-animation-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
	-ms-animation-delay: 0;
	}
	
@keyframes move {
   from {
      transform: translateY(100%);
   }
   to {
      transform: translateY(0);
   }
}

@-moz-keyframes move {
   from {
      -moz-transform: translateY(100%);
   }
   to {
      -moz-transform: translateY(0);
   }
}

@-webkit-keyframes move {
   from {
      -webkit-transform: translateY(100%);
   }
   to {
      -webkit-transform: translateY(0);
   }
}

@-o-keyframes move {
   from {
      -o-transform: translateY(100%);
   }
   to {
      -o-transform: translateY(0);
   }
}

@-ms-keyframes move {
   from {
      -ms-transform: translateY(100%);
   }
   to {
      -ms-transform: translateY(0);
   }
}

	/* Content */
	
.center	{text-align: center;}
	
.copy .vp	{padding: 60px 40px;}

.cols .vp	{
	column-count: 2;
	column-gap: 40px;
	}
	
.type1	{
	background: #fff;
	z-index: 300;
	}

.type2	{
	color: #fff;
	z-index: 300;
	}
	
.type2 a, .type2 h2, .type2 h4, .type2 h6	{color: #cbe8f1;}
.type2 button, .type2 .btn	{background: #112d53;}
	
	/*
.pane1, .pane2	{
	position: relative;
	box-sizing: border-box;
	display: inline-block; 	
	zoom: 1;
	*display: inline;
	vertical-align: top;
	width: 49%;
	}

.text	{
	padding: 40px;
	max-width: 600px;
	}
	*/
	
	/* Videos */

.video	{
	position: relative;
	width: 100% !important;
	height: 0;
	padding-bottom: 56.25%;
	margin: 10px 0 25px 0;
	overflow: hidden;
	}

.video iframe	{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
	}
	
	/* Galleries */

.gallery_item	{
	box-sizing: border-box;
	position: relative;
	width: 32%;
	display: inline-block;
	zoom: 1;
	*display: inline;
	vertical-align: top;
	margin: 0;
	text-align: center;
	padding: 10px;
	transform: scale(.97,.97);
    transition: all 0.1s ease-out;
	z-index: 50;
	}

.gallery_item:hover	{
	transform: scale(1,1);
	z-index: 800;
    }

.gallery_pic	{
	position: relative;
	display: block;
	width: 100%;
	max-width: 400px;
	height: 0;
	padding-bottom: 75%;
	margin: 0 auto;
	overflow: hidden;
	text-align: center;
	}
	
.pano	{padding-bottom: 50%;}
.square	{padding-bottom: 100%;}
	
.gallery_pic img	{
	max-height: 100%;
	max-width: 100%;
	width: auto;
	height: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	}
	
.gallery_item h6	{
	padding-top: 10px;
	line-height: 1.3;
	}
	
.gallery_item .btn	{
	padding: 15px 20px;
	font-size: 1em;
	}

	/* Forms */

.formula input[type=text], .formula input[type=email], .formula input[type=tel], .formula input[type=number], .formula input[type=password], .formula select, .formula textarea	{
	color: #222;
	font-family: "Kanit", sans-serif;
	font-weight: 400;
	font-size: 1em;
	background: #fff;
	}

.formula label	{
	box-sizing: border-box;
	display: inline-block;
	zoom: 1;
	*display: inline;
	vertical-align: bottom;
	width: 49.4%;
	padding: 6px 10px;
	margin: 0;
	}
	
.formula .short	{width: 32.4%;}
.formula .long	{width: 100%;}

.formula input[type=text], .formula input[type=email], .formula input[type=tel], .formula input[type=number], .formula input[type=password], .formula input[type=file]	{
	box-sizing: border-box;
	width: 100%;
	display: block;
	padding: 10px;
	margin: 6px 0;
	}
	
.formula input[type=checkbox], .formula input[type=radio]	{
	box-sizing: border-box;
	display: inline-block;
	zoom: 1;
	*display: inline;
	vertical-align: middle;
	width: auto;
	padding: 0;
	margin: 0 7px;
	}
	
.formula select	{
	width: 100%;
	display: block;
	margin: 6px 0;
	}
	
.formula textarea	{
	width: 100%;
	height: 150px;
	}
	
.formula ::-webkit-input-placeholder {color: #ccc;}
.formula :-moz-placeholder {color: #ccc;}
.formula ::-moz-placeholder {color: #ccc;}
.formula :-ms-input-placeholder {color: #ccc !important;}
.formula ::-ms-input-placeholder {color: #ccc;}
.formula ::placeholder {color: #ccc;}
	
.formula .btn, .formula button	{
	display: block;
	margin: 20px 10px;
	}

.error	{
	font-style: italic;
	color: #c00;
	}
	
@media screen and (max-width: 600px) { 

	.formula label	{width: 100%;}
	
}

@media screen and (max-width: 475px) { 

	.formula .short	{width: 100%;}

}

	/* Testimonials */

.testimonials	{
	background: #255ca8;
	background: -moz-linear-gradient(top,  rgba(203,232,241,1) 0%, rgba(189,220,235,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(203,232,241,1) 0%,rgba(189,220,235,1) 100%); 
	background: linear-gradient(to bottom,  rgba(203,232,241,1) 0%,rgba(189,220,235,1) 100%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cbe8f1', endColorstr='#bddceb',GradientType=0 ); 
	}

.testimonial	{
	position: relative;
	padding: 50px 100px;
	text-align: center;
	font-size: 1.2em;
	}

.testimonial:before	{
	content: '\201c';
	font-size: 5em;
	font-family: Georgia, "Times New Roman", Palatino, serif;
	position: absolute;
	top: 50px;
	left: 50px;
	}

.testimonial:after	{
	content: '\201d';
	font-size: 5em;
	font-family: Georgia, "Times New Roman", Palatino, serif;
	position: absolute;
	bottom: 0;
	right: 50px;
	}

	/*	Footer	*/

.footer	{
	background: #112d53;
	color: #fff;
	z-index: 800;
	}

.footer .vp	{
	padding: 20px 100px 10px 100px;
	text-align: center;
	}

#jump2top	{
	display: block;
	position: absolute;
	top: 0;
	right: 30px;
	width: 64px;
	height: 64px;
	background: transparent url(../img/icons.png) -270px -270px no-repeat;
	text-indent: -9999px;
	text-decoration: none;
	opacity: 0.3;
    transition: all 0.2s ease-in-out;
    overflow: hidden;
	}
	
#jump2top:hover	{
	top: -5px;
	opacity: 1.0;
	}

	/*	Site Credits	*/

#ink	{
	width: 250px;
	margin: 0 auto;
	padding: 0;
	}
	
#ink span	{
	background: url(../img/icons.png) 0 -250px no-repeat;
	width: 250px;
	height: 100px;
	display: block;
	text-indent: -9999px;
	text-decoration: none;
	opacity: 0.3;
    transition: all 0.2s ease-in-out;
	}
	
#ink span:hover, #ink span:focus	{opacity: 1.0;}

	/*	Text Alert Signup	*/

.quick-chat	{display: none;}

@media screen and (min-width: 960px) { 

	.quick-chat-button	{
		box-shadow: 0 0 15px -2px rgba(0,0,0,0.50);
		-webkit-box-shadow: 0 0 15px -2px rgba(0,0,0,0.50);
		-moz-box-shadow: 0 0 15px -2px rgba(0,0,0,0.50);
		}

	.quick-chat	{
		display: block;
		position: fixed;
		bottom: 10px;
		right: 20px;
		width: 90%;
		max-width: 330px;
		padding: 15px;
		z-index: 999;
		text-align: right;
		z-index: 900;
		}

	#quick-chat-form-wrapper {
		display: none; /* Initially hide the div */
		position: absolute;
		bottom: 90px;
		right: 0;
		width: 100%;
		background: #fff;
		box-shadow: 0 0 25px -2px rgba(0,0,0,0.40);
		-webkit-box-shadow: 0 0 25px -2px rgba(0,0,0,0.40);
		-moz-box-shadow: 0 0 25px -2px rgba(0,0,0,0.40);
		transition: all 0.2s ease-in-out;
		}
	
	#quick-chat-form-wrapper:after {
		content: "";
		position: absolute;
		top: 100%;
		right: 33px;
		width: 0; 
		height: 0; 
		border-left: 20px solid transparent;
		border-right: 20px solid transparent;
		border-top: 16px solid #112d53;
		}
		
	#quick-chat-form {
		height: 650px;
		max-height: 75vh;
		overflow: auto;
		text-align: center;
		}
	
	#quick-chat-form h6 {
		display: block;
		font-size: 1.15em;
		padding: 10px;
		margin: 0;
		color: #fff;
		background: #112d53;
		}
	
	#quick-chat-form p {font-size: .85em;}
	
	.quick-chat-button	{padding: 15px 18px !important;}

	.show-chat {display: block !important;}
	
	.show-chat iframe {
		display: block;
		width: 100%;
		max-width: 100%;
		height: 575px;
		border: 0;
		}
	
}

::selection {
	background: #ffea00;
	color: #112d53;
	}