/** GENERAL **/
html, body{ padding:0; margin:0; }
body { font-family:'Open Sans', sans-serif; color: #505050; }

*{ -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
.t{ -webkit-transition:all 200ms ease-out; -moz-transition:all 200ms ease-out; transition:all 200ms ease-out; }
.img-width{ width:100%; height:inherit; margin:0 auto; padding:0 20px; }
.page-width{ width:100%; max-width:1400px; height:inherit; margin:0 auto; padding:0 20px; }
.content-width{ width:100%; padding:0; height:inherit; margin:0 auto; }
.copy-width{ max-width:1100px; margin:0 auto; }
.clear{ clear:both; }
ul{ margin:0; padding:0; list-style:none; }
ol{ margin:0; padding:0; }

h1{ font-size: 52px; line-height:62px; margin-bottom:20px; }
h2{ font-size: 36px; line-height:42px; margin:0; }
h3{ font-size: 24px; line-height:28px; margin-bottom:0; }
h1,h2,h3{ color:#1a1a1a; font-family:"Roboto",serif; font-weight:900; }
a { text-decoration:none; }
p { margin: 0px; font-size:18px; line-height:26px; }

.cta{ display:inline-block; background-color:#388e3c; color:#fff !important; text-decoration:none; padding:7px 16px; border-radius:4px; font-weight:600; font-size:18px; box-shadow:0 2px 2px -2px rgba(0, 0, 0, .52); }
.cta:hover{ box-shadow:0 2px 4px -2px rgba(0, 0, 0, .52); background-color:#2e7d32; }
.cta:focus { outline:0; }
.cta:active{ box-shadow:0 6px 10px -2px rgba(0, 0, 0, .52); background-color:#1b5e20; }

header{ padding:30px 0; position:fixed; top:0; left:0; right:0; z-index:100; background-color:#fff; border-bottom:1px solid #ccc; box-shadow:0 2px 6px -2px rgba(0, 0, 0, .22); }
header .content-width{ position:relative; }
header img#logo{ max-width:200px; }
header a#phone{ position:absolute; top:-8px; right:0; font-size:26px; color:#1a1a1a; font-weight:600; }
header a#phone span{ vertical-align:1px; }
header a#phone:hover{ color:#666; }

header .nav-icon{ display:none; width:28px; height:19px; position:absolute; top:30px; right:1px; margin:0; -webkit-transform:rotate(0deg); -moz-transform:rotate(0deg); -o-transform:rotate(0deg); transform:rotate(0deg); -webkit-transition:.5s ease-in-out; -moz-transition:.5s ease-in-out; -o-transition:.5s ease-in-out; transition:.5s ease-in-out; cursor:pointer; }
header .nav-icon span{ display:block; position:absolute; height:2px; width:100%; background:#202020; opacity:1; left:0; -webkit-transform:rotate(0deg); -moz-transform:rotate(0deg); -o-transform:rotate(0deg); transform:rotate(0deg); -webkit-transition:.25s ease-in-out; -moz-transition:.25s ease-in-out; -o-transition:.25s ease-in-out; transition:.25s ease-in-out; }
header .nav-icon:hover span{ background:#999; }
header .nav-icon span:nth-child(1){ top:0px; }
header .nav-icon span:nth-child(2), header .nav-icon span:nth-child(3){ top:8px; }
header .nav-icon span:nth-child(4){ top:16px; }

header ul.nav{ position:absolute; top:45px; right:0; }
header ul.nav li{ display:inline-block; margin-right:35px; }
header ul.nav li:last-child{ margin-right:0; }
header ul.nav li a{ text-decoration:none; color: #666; font-family:"Roboto", serif; font-size:20px; font-weight:600; }
header ul.nav li a:hover{ color:#1a1a1a; }

header.open ul.nav{ opacity:1; visibility:visible; top:12px; }
header.open ul.nav li a:hover{ background-color:#f9f9f9; text-decoration:none; }

section.hero .img-width{ position:relative; }
section.hero .content-width{ max-width:650px; padding:225px 0; text-align:center; position:relative; z-index:20; }
section.hero .overlay{ position:absolute; top:0; bottom:0; left:0; right:0; background-color:rgba(0, 0, 0, 0.3); z-index:10; }
section.hero .background{ position:absolute; top:0; bottom:0; left:0; right:0; z-index:0; background-image:url('../images/hero.jpg'); background-size:cover; background-position:center; }
section.hero .background img{ width:100%; }
section.hero h1{ color:#fff; }

section:not(.hero):not(.footer){ padding:75px 0; }
section.footer{ padding:0 0 30px 0; }
.head{ width:32%; display:inline-block; }
.label{ text-transform:uppercase; color:#43a047; }
.head h2{ }
.copy{ float:right; width:60%; margin-top:20px; }

section.services{ position:relative; }
section.services .content-width{ margin-top:75px; }
.col-4-wrapper{}
.col-4-wrapper .col-4{ width:22%; float:left; margin-right:4%; }
.col-4-wrapper .col-4:nth-child(4n+4){ margin-right:0; }
.col-4 img{ width:100%; margin-bottom:-4px; }
.col-4 .content{ padding:0 0 0 20px; }
.col-4 h3{ margin-bottom:10px; padding-right:20px; }
.col-4 ul{ list-style:initial; margin-left:20px; }
.col-4 ul li{ font-size:18px; margin-bottom:2px; }
section.services a.cta{ position:absolute; bottom:0; transform:translate(-50%, 50%); left:50%; }

section.about{ background-color:#f5f5f6; }
section.about #locations{ margin-top:40px; }

section.careers{ background-color:#fbfbfb; }
section.careers .head img{ width:100%; }
section.careers .copy{ margin:0; }
section.careers ul{ list-style:initial; margin:20px 0; padding-left:25px; }
section.careers ul li{ width:50%; float:left; font-size:18px; line-height:28px; }
section.careers p a{ color:#505050; text-decoration:underline; }
section.careers p a:hover{ color:#111; }

section.contact{}
section.contact .copy ul{ margin-top:30px; }
section.contact .copy ul li{ float:left; width:30%; margin-right:5%; }
section.contact .copy ul li:nth-child(3n+3){ margin-right:0; }
section.contact .copy ul li h3{ margin:0 0 5px 0; }
section.contact .copy ul li a{ font-size:20px; color:#505050; text-decoration:none; }
section.contact .copy ul li a:hover{ color:#111; }

section.request-a-quote{ text-align:center; position:relative; }
section.request-a-quote .page-width{ position:relative; z-index:10; }
section.request-a-quote .background{ background-color:#f5f5f6; position:absolute; top:0; left:0; right:0; bottom:30%; z-index:0; }
section.request-a-quote p{ max-width:650px; margin:50px auto; }
section.request-a-quote p a{ text-decoration:none; color:#1a1a1a; font-weight:700; }
section.request-a-quote form{ text-align:left; background-color:#fff; border:1px solid #ccc; box-shadow:0 2px 6px -2px rgba(0, 0, 0, .22); }
section.request-a-quote form .head{ height:234px; float:left; overflow:hidden; }
section.request-a-quote form .head img{ height:100%; margin-bottom:-5px; }
section.request-a-quote form .fields{ width:68%; float:right; padding:30px; position:relative; z-index:0; }
section.request-a-quote form input{ 
	display: block;
    width: 47%;
    height: 38px;
	float: left;
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
	box-shadow: 0 1px 2px #e9ecef;
}
section.request-a-quote form small{ display:block; float:right; margin-top:10px; }
section.request-a-quote form small.error{ background-color:#de3535; color:#fff; padding:2px 6px; border-radius:3px; }
section.request-a-quote form a.cta{ margin-top:30px; cursor:pointer; }

section.request-a-quote form .step{ display:none; position:absolute; top:0; right:0; bottom:0; left:0; z-index:10; background-color:#fff; padding:30px; }
section.request-a-quote form .step p{ margin:20px 0 0 0; }


@media( max-width:1200px ) and (min-width: 901px){
	section.hero .content-width{ padding:175px 0; }
	.col-4-wrapper .col-4{ width:24%; float:left; margin-right:1.25%; }
	.col-4 .content{ padding:0px 0 0 10px; }
	.col-4 h3{ margin-bottom:0px; padding-right:10px; margin-top:10px; font-size:20px; }
	.col-4 ul{ margin-left:20px; }
	.col-4 ul li{ font-size:16px; margin-bottom:0px; }
}

@media( max-width:1100px ){
	section:not(.hero):not(.footer){ padding:55px 0; }	
}

@media( max-width:1000px ){
	section.contact .copy ul li{ width:48%; margin:0; }
	section.contact .copy ul li:nth-child(3n+1){ margin-right:2%; }
	section.contact .copy ul li:nth-child(3n+3){ width:100%; margin-top:20px; }
}

@media( min-width:901px ){
	#page{ padding-top:140px; }
	header.small a#phone{ display:none; }
}

@media( max-width:900px ){
	h1{ font-size:46px; line-height:56px; }
	h2{ font-size:28px; line-height:34px; }
	
	header { padding:20px 0; }
	header .nav-icon{ display:block; }
	header a#phone{ top:20px; right:60px; }
	
	header ul.nav{ z-index:1000; opacity:0; visibility:hidden; position:absolute; top:-40px; right:-10px; background-color:#fff; float:none; padding:5px 0; border-radius:3px; overflow:hidden;
		-webkit-transition: all 300ms cubic-bezier(0.19, 1, 0.22, 1);
		-moz-transition: all 300ms cubic-bezier(0.19, 1, 0.22, 1);
		transition: all 300ms cubic-bezier(0.19, 1, 0.22, 1);
		-webkit-box-shadow: 0px 0px 4px -1px rgba(130,130,130,1);
		-moz-box-shadow: 0px 0px 4px -1px rgba(130,130,130,1);
		box-shadow: 0px 0px 4px -1px rgba(130,130,130,1);
	}
	
	header ul.nav li{ display:block; margin:0; text-align:right; }
	header ul.nav li a{ color:#232323; font-size:18px; padding:8px 20px; display:block; line-height:initial; text-align:right; }
	header ul.nav li a.cta{ border-radius:0px; }
	header ul.nav li a.cta:hover{ background-color:#2e7d32; }
	header ul.nav li a.cta:active{ background-color:#1b5e20; }
	
	section.hero .content-width{ padding:125px 0; }
	
	section.services .content-width{ margin-top:55px; }
	.col-4-wrapper .col-4{ width:48%; margin:0 0 30px 0; border:1px solid #ccc; box-shadow:0 2px 6px -2px rgba(0, 0, 0, .22); }
	.col-4-wrapper .col-4:nth-child(2n+1){ margin-right:4%; }
	.col-4 .content{ padding:15px 20px; }
	.col-4 h3{ margin-bottom:10px; padding-right:0; margin-top:0px; }
}

@media( max-width:800px ){
	section.careers ul li{ float:none; width:100%; }
	
	section.request-a-quote p{ margin:30px 0; }
	section.request-a-quote form .head{ display:none; }
	section.request-a-quote form .fields{ width:100%; float:none;}
}

@media( min-width:601px) {
	header.small{ padding:15px 0; }
	header.small img#logo{ max-width:140px; }
	header.small ul.nav{ top:10px; }
	header.small .nav-icon{ top:22px; }
	
	section.request-a-quote form input:nth-child(2n+1){ margin-right:3%; }
	section.request-a-quote form input:nth-child(2n+2){ margin-left:3%; }
	section.request-a-quote form input:nth-child(1), section.request-a-quote form input:nth-child(2){ margin-bottom: 30px; }
}

@media( max-width:900px ) and (min-width: 601px){
	#page{ padding-top:120px; }
	header.small a#phone{ top:12px; }
}

@media( max-width:600px ){
	#page{ padding-top:70px; }
	
	h1 { font-size:36px; line-height:46px; }
	
	section:not(.hero):not(.footer){ padding:35px 0; }
	
	header { padding:10px 0; }
	header img#logo{ max-width:140px; margin-bottom:-5px; }
	header a#phone{ top:6px; }
	header .nav-icon{ top:16px; }
	
	.head{ width:auto; }
	.copy{ width:auto; float:none; margin-top:10px; }
	
	section.services .content-width{ margin-top:35px; }
	.col-4-wrapper .col-4 { width:100%; float:none; margin:0 0 20px 0; }
	.col-4 .content{ padding:20px 25px; }
	
	section.about #locations{ margin:0; }
	section.careers .copy{ margin-top:20px; }
	
	section.request-a-quote form input{ width:100%; float:none; margin:0 0 20px 0; }
	section.request-a-quote form input:nth-child(4){ margin-bottom:0; }

}

@media( max-width:550px ){
}

@media( max-width:500px ){
}

@media( max-width:450px ){
	h1{ font-size:30px; line-height:36px; }
	
	header a#phone{ display:none; }
	section.hero .content-width{ padding:65px 0; }
	section.contact .copy ul li{ width:100%; float:none; margin-top:20px; }
	section.request-a-quote form small{ float:none; }
	section.footer small{ font-size:11px; }
}

