/************* GENERAL STYLES ***/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-family: inherit;
	vertical-align: baseline; }

:focus { outline: 0; }

* { box-sizing: border-box; }

html, body {
	font-family: 'Lora', serif;
	font-size: 17px;
	line-height: 1.3;
	color: #222;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale; }

ul, ol { padding: 0 0 1.5em 30px; }
	
	ul li, ol li { margin: 0 0 7px; }

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0; }

caption, th, td {
	text-align: left;
	font-weight: normal; }

blockquote:before, blockquote:after,
q:before, q:after {
	content: ""; }

blockquote, q { quotes: "" ""; }

img {
	max-width: 100%;
	height: auto; }

/*** FONT STYLES ***/
h1 { 
	font-size: ; 
	font-weight: ;
	margin: ; }

h2 { 
	font-size: 1.5rem;
	font-weight: 700;
	margin: 1.5rem 0; }

h3 { 
	font-size: ; 
	font-weight: ;
	margin: ; }

h4 { 
	font-size: ; 
	font-weight: ;
	margin: ; }

h5 { 
	font-size: ; 
	font-weight: ;
	margin: ; }

a:link, a:visited { 
	color: #677fa5;
	text-decoration: none; }
	
a:hover { text-decoration: underline; }

p { margin: 1.5rem 0; }

strong { font-weight: bold; }

em { font-style: italic; }

/************* STRUCTURE STYLES ***/
.wrapper {
	width: 1180px;
	max-width: 100%;
	padding: 0 50px;
	margin: 0 auto; }

section {
	width: 100%;
	float: left;
	position: relative;
	overflow: hidden; }


/*** COLS ***/
.col_row {
	margin-right: -24px;
	margin-left: -24px; }

.col_row:after {
	content: "";
	display: block;
	clear: both; }

.col {
	float: left;
	padding-right: 24px;
	padding-left: 24px; }

.col_12 { width: 100%; }
.col_9 { width: 75%; }
.col_8 { width: 66.6666%; }
.col_6 { width: 50%; }
.col_4 { width: 33.3333%; }
.col_3 { width: 25%; }


/*** HERO ***/
#hero {
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 30px;
	background: url(/images/bg.jpg) center no-repeat;
	background-size: cover;
	color: #fff;
	text-align: center; }

	#hero .wrap { width: 740px; }

	#hero .logo { width: 100%; }

	#hero .content { 
		margin-top: 80px;
		font-size: 1.5rem; }

		#hero .content span {
			display: inline-block;
			margin-bottom: 5px;
			font-size: 1rem;
			letter-spacing: 2px; }

		#hero .content span:before,
		#hero .content span:after {
			content: "";
			width: 45px;
			height: 1px;
			display: inline-block;
			vertical-align: middle;
			margin-top: -1px;
			background: #fff; }

		#hero .content span:before { margin-right: 15px; }
		#hero .content span:after { margin-left: 15px; }

	#hero .scroll {
		width: 40px;
		position: absolute;
		bottom: 45px;
		left: auto;
		right: auto;
		opacity: 0;
		transition: 0.2s ease bottom;
		animation: fadeSiteIn 1s ease forwards;
		animation-delay: 2s; }

	#hero .scroll:hover { bottom: 40px; }

@keyframes fadeSiteIn {
	from { opacity: 0; }
	to   { opacity: 1; }
}


/*** HOME ***/
.bg_waves {
	width: 1136px;
	height: 309px;
	position: absolute;
	top: 80px;
	left: 42%;
	z-index: -1;
	background: url(/images/bg_waves.svg) no-repeat; }

/* #guarantee { 
	display: flex;
	align-items: stretch;
	margin-bottom: 100px; }

	#guarantee .col { 
		display: flex;
		align-self: center; }

	#guarantee img { margin: 0 auto; } */

#quality { margin-top: 120px; }

	#quality h2 { margin-bottom: 0; }

#qualityImages.col_row { margin: 50px -15px 100px -15px; }

	#qualityImages .col {
		padding-right: 15px;
		padding-left: 15px;
		text-align: center; }


/*** CONTACT ***/
#contact h2 { 
	margin-bottom: 50px;
	text-align: center; }

	#contact h2 span {
		display: inline-block;
		margin-bottom: 5px;
		letter-spacing: 4px; }

	#contact h2 span:before,
	#contact h2 span:after {
		content: "";
		width: 45px;
		height: 1px;
		display: inline-block;
		vertical-align: middle;
		margin-top: -2px;
		background: #222; }

	#contact h2 span:before { margin-right: 15px; }
	#contact h2 span:after { margin-left: 15px; }

	#contact .form {
		width: 740px;
		max-width: 100%;
		margin: 0 auto; }

		#contact .form .col_row {
			margin-right: -10px;
			margin-left: -10px; }

		#contact .form .col {
			padding-right: 10px;
			padding-left: 10px; }

		#contact .form .text {
			width: 100%;
			float: left;
			padding: 12px 14px;
			margin-bottom: 20px;
			background: #E6EDEE;
			border: 1px solid #BBD5D8;
			border-radius: 5px;
			box-shadow: 0 5px 15px rgba(0,0,0,0.1);
			font: inherit;
			font-size: 15px;
			transition: 0.2s ease background; }

		#contact .form .text:focus { background: #fff; }

		#contact .form textarea {
			height: 200px;
			resize: none; }

		#contact .form .submit {
			width: 100%;
			float: left;
			padding: 12px 0;
			background: none;
			border: 2px solid #DD4437;
			border-radius: 5px;
			cursor: pointer;
			color: #222;
			font: inherit;
			font-size: 15px;
			font-weight: bold; }

		#contact .form .submit:hover { color: #DD4437; }


/*** FOOTER ***/
footer {
	width: 100%;
	float: left;
	padding: 90px 0 50px;
	margin-top: 120px;
	background: url(/images/bg_footer.svg) top center no-repeat;
	background-size: 1080px; }

	footer .copy { float: left; }

	footer .trackie {
		width: 78px;
		float: right;
		margin-top: 4px; }


/*** MEDIA QUERIES ***/
@-ms-viewport { width: device-width; }
@viewport { width: device-width; }


/*** RETINA ***/
@media screen and (-webkit-min-device-pixel-ratio: 1.5) {

	
	
}


/*** 1280px ***/
@media screen and (max-width: 1280px) {

	
	
}


/*** 1024px ***/
@media screen and (max-width: 1024px) {
	
	html, body { font-size: 16px; }

	/* #guarantee { 
		margin-top: 80px;
		margin-bottom: 60px; }
	
	#qualityImages.col_row { margin-bottom: 80px; } */

	#quality { margin-top: 80px; }
	
	footer { margin-top: 80px; }
	
}


/*** 800px ***/
@media screen and (max-width: 800px) {

	
	
}


/*** 720px ***/
@media screen and (max-width: 720px) {

	html, body { font-size: 15px; }
	
	.wrapper { padding: 0 24px; }
	
	.col_row {
		margin-right: -12px;
		margin-left: -12px; }

	.col {
		padding-right: 12px;
		padding-left: 12px; }
	
	#hero .content { 
		margin-top: 50px;
		font-size: 1.3rem; }
	
		#hero .content span:before, 
		#hero .content span:after { width: 30px; }
	
	.bg_waves { display: none; }
	
	/* #guarantee { 
		display: block;
		margin: 50px 0;
		text-align: center; }
	
		#guarantee .col { 
			width: 100%;
			padding: 0; }
	
		#guarantee .img { 
			width: 100%;
			margin-top: 20px; } */

	#quality { margin-top: 50px; }
	
	#qualityImages.col_row { margin: 50px -10px 60px -10px; }

		#qualityImages .col {
			padding-right: 10px;
			padding-left: 10px; }
	
	#contact h2 span:before, 
	#contact h2 span:after { width: 30px; }
	
}


/*** 600px ***/
@media screen and (max-width: 600px) {

	.col { 
		width: 100%;
		float: none; }
	
	#qualityImages .col { 
		width: 50%;
		float: left; }
	
	#qualityImages .col:nth-child(2) { display: none; }
	
	footer { text-align: center; }
	
		footer .copy { width: 100%; }
	
	footer .trackie {
		float: none;
		margin: 20px auto 0; }
	
}


/*** 414px ***/
@media screen and (max-width: 414px) {
	
	#hero .content { font-size: 1.2rem; }
	
		#hero .content span:before,
		#hero .content span:after { display: none; }
	
	/* #guarantee { text-align: left; } */

	#qualityImages .col { width: 100%; }
	
	#qualityImages .col:first-child { margin-bottom: 20px; }
	
}


/*** 375px ***/
@media screen and (max-width: 375px) {

	
	
}


/*** 320px ***/
@media screen and (max-width: 320px) {

	
	
}




