#mainbackground {
    width: 100%; 
    height: 100%; 
    position: fixed; 
    left: 0px; 
    top: 0px; 
    z-index: -1; /* Ensure div tag stays behind content; -999 might work, too. */
}

.stretch {
    width:100%;
    height:100%;
}

.wrapper {
	width:95%;
	max-width:1170px;
	margin: 0 auto;
	position:relative;}

#navigation {
	width:100%;
	height:50px;
	background-image:url(grafix/navbackground.png);
	background-repeat:repeat;
}
	
#site-navigation {
	text-align: right;
	width:80%;
	float:right;
}
	
#logo {
	background-image:url(grafix/logobackground.jpg);
	background-position:center;
	background-repeat:no-repeat;
	width:20%;
	height:165px;
	position:absolute;
	top:-50px;
	left:0px;
	z-index:10;
}

#logo:hover {
	background-image:none;
	background-color:#FAB515;
}

#logo a{
display:block;
width:100%;
height:100%;
text-decoration:none;
}
	
#logo img {
	width: 80%;
	height: auto;
	display:block;
	margin: 0 auto;
	padding: 40px 10% 0;
}

#calltoaction {
position: absolute;
top: 30px;
right: 0px;
z-index:10;
}

#calltoaction p {
	text-align:right;
	margin: 0;
	padding: 0;
	font-size:50px;
	line-height:50px;
	font-weight:800;
	color:#fff;
}

#calltoaction p.callsmall {
	font-size:24px;
	line-height: 40px;
	font-weight:normal;
	color:#fff !important;
}

#slogan {
position: absolute;
top: 150px;
left: 0px;
z-index: 10;
}

#slogan p {
text-align: right;
margin: 0;
padding: 0;
font-size: 32px;
line-height: 32px;
font-weight: 300;
font-style: italic;
color: #fff;
}

#homegrid {
	width:100%;
	margin-top: 95px;
	margin-bottom: 50px;
}

.onefifth {
	width:20%;
	float:left;
	height:165px;
}

.onefifth.services {
	background-color:#0BA9E1;
}

.onefifth.services:hover {
	background-color:#FAB515;
}
	
.onefifth.about {
	background-color:#0070B5;
}

.onefifth.about:hover {
	background-color:#F68D1E;
}
	
.onefifth.locations {
	background-color:#21BDE7;
}

.onefifth.locations:hover {
	background-color:#FECE06;
}
	
.onefifth.contact {
	background-color:#128AC8;
}

.onefifth.contact:hover {
	background-color:#F39E22;
}
	
.onefifth.link {
text-align:center;
}
	
.onefifth.link a{
display:block;
width:100%;
height:100%;
text-decoration:none;
margin: 0;
padding: 0 0 20px 0;
font-size: 20px;
line-height: 20px;
font-weight: 600;
color:#fff;
}

.onefifth.link img {
display:block;
margin: 0 auto;
padding: 30px 0 10px 0;
}

.onefifth.link a:hover {}
	
#mainfooter {
	width:100%;
	padding: 50px 0 30px 0;
	background-image:url(grafix/footerbackground.png);
	background-repeat:repeat;
}

.onequarter {
	width:23%;
	margin: 0 2% 0 0;
	float:left;
}

.onequartersmall {
	width:20%;
	margin: 0 2% 0 0;
	float:left;
}

.onequarterbig {
	width:28%;
	margin: 0;
	float:left;
}

#mainfooter h3 {
margin: 0;
padding: 0 0 25px 0;
font-size: 20px;
line-height: 20px;
font-weight: normal;
color:#1EA7E0;
}

#mainfooter p {
margin: 0;
padding: 0 0 14px 0;
font-size: 14px;
line-height: 14px;
font-weight: normal;
color: #fff;
}

#mainfooter p.zero {
	padding: 0;
}

#mainfooter a, #mainfooter a:visited {
text-decoration:none;
color: #fff;
}

#mainfooter a:hover {
text-decoration:none;
color: #F60;
}

/*----------------------------------------------------- INSIDE STYLES*/

#inside #maincontent {
margin: 150px 0 50px 0;
background-color: #fff;
padding: 0 0 50px 0;
}

#inside .side {
	width:20%;
	float:left;}

#inside .heading {
	width:80%;
	padding:0px 10% 30px 10%;
	margin: 0 0 30px;
	text-align:center;
	color: #fff;
font-size: 20px;}
	
#inside .heading img {
display:block;
margin: 0 auto;
padding: 30px 0 10px 0;
}

#inside .heading.about {
	background-color: #0070B5;}
	
#inside .copy {
	width:77%;
	float:left;
	margin: 0 0 0 3%;
	padding: 50px 0 0 0;}
	
#inside #slogan {
position: absolute;
top: 86px;
left: 23%;
z-index: 10;
}


.formparaleft {
	width:45%;
	float:left;}
	
.formparaleft.first {
	margin:0 8% 0 0;}
	
.formparaleft input {
	width:95%;
	padding: 10px 2%;}
	
.formparafull {
	width:100%;}
	
.formparafull textarea {
	width:92.5%;
	height:100px;
	padding: 10px 2.5%;}
	
img.hcreate {
	margin: 0 10px -14px 0;
}

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

div.card-container img {
width: auto !important;
height: 100% !important;
max-width: 100%;
overflow-x: hidden;
}

.onefifth.link img {
width: 40%;
height: auto;
}

}

@media screen and (max-width: 1030px) {
	
.home #slogan p {
font-size: 26px;
}

.onefifth, div.card-container {
height: 150px !important;
}
	
}

@media screen and (max-width: 978px) {
	
#mainfooter p {
padding: 0 0 8px 0;
font-size: 12px;
}

#mainfooter h3 {
font-size: 15px;
}

#slogan p {
font-size: 28px;
}
#inside #slogan {
top: 62px;
}

#calltoaction {
top: 6px;
}

#logo {
height: 140px;
}
#inside #maincontent {
margin: 125px 0 50px 0;
}
	
}

@media screen and (max-width: 890px) {
.main-navigation li {
	margin: 0 0 0 15px!important;
font-size: 13px;
}	

#slogan p {
font-size: 23px;
}

.onefifth, div.card-container {
height: 120px !important;
}

.onefifth.link img {
padding: 20px 0 10px 0;
}

.onefifth.link a {
font-size: 16px;
}

.home #calltoaction p {
font-size: 45px;
}

.home #calltoaction p.callsmall {
font-size: 20px;}

.home #slogan p {
font-size: 24px;
}
}

@media screen and (max-width: 780px) {
	
#site-navigation {
	text-align:center;
width: 100%;
}
	
#logo {
width: 40%;
position: static;
margin: 20px 0 20px 0;
height:auto;
}

#logo img {
width: 80%;
height: auto;
display: block;
margin: 0 auto;
padding: 30px 0 20px 0;
}

#inside #maincontent {
margin: 10px 0 50px 0;
}

#inside #slogan {
top: 110px;
right: 0;
}

#calltoaction {
top: 10px;
}

#inside .side {
	display:none;
}

#inside .copy {
width: 100%;
float: none;
margin: 0;
padding: 30px 0 0 0;
}

.onequarter, .onequartersmall, .onequarterbig {
width: 48%;
margin: 0 2% 25px 0;
float: left;
}

#mainfooter h3 {
font-size: 20px;}

#mainfooter p {
font-size: 14px;
}

#homegrid {
width: 100%;
margin-top: 10px;
margin-bottom: 25px;
}

.home #calltoaction {
top: 30px;
}

.home #calltoaction p.callsmall {
font-size: 24px;
line-height: 20px;}

.home #slogan {
top: 120px;
right: 0px;
}

.onefifth, div.card-container {
height: 110px !important;
}

.onefifth.link a {
font-size: 15px;
}



}
@media screen and (max-width: 600px) {
	
	.formparaleft {
width: 90%;
float: none;
}

#navigation {
width: 100%;
height: auto;
padding: 10px 0;}

.main-navigation li {
margin: 0!important;
font-size: 14px;
padding: 12px 0 5px 0;
}

.main-navigation a {
color: #0070b5;
text-decoration: none;
}
#calltoaction p {
font-size: 40px;
line-height: 40px;
}

#calltoaction p.callsmall {
font-size: 24px;
line-height: 30px;}

#inside #slogan {
top: 90px;
right: 0;
}

#mainfooter h3 {
font-size: 18px;}

#mainfooter p {
font-size: 13px;
}

.home #slogan {
position: static;}


	
}

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

#calltoaction, #inside #slogan {
position: static;
width: 100%;
}

#calltoaction p, #slogan p {
text-align: center;
padding: 5px 0;	}

#logo {
width: 60%;
margin: 20px auto;
}

.onequarter, .onequartersmall, .onequarterbig {
width: 100%;
margin: 0 0 25px 0;
float: none;
}

#mainfooter h3 {
font-size: 25px;}

#mainfooter p {
font-size: 14px;
}

#inside #maincontent {
margin: 30px 0 50px 0;
}

.home .onefifth {
width: 50%;
float: left;
height: 165px !important;
}

div.card-container{
height: 165px !important;
}

.notused {
	display:none;}
	
#homegrid .clear {
	clear:none;
	float:left;}

.home #mainfooter {
width: 100%;
margin: 50px 0 0 0;}

}