@import "normalize.css";
@import "skeleton.css";

body {	
	font-weight:300;
	color: #333;
	background: url(../images/bg.jpg) repeat-x;
	-webkit-font-smoothing: antialiased; 
	-webkit-text-size-adjust: 100%;
	overflow-x: hidden;
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;	
}
/*font size: html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So 1.5rem = 15px :) body font-size is set to 1.5em*/
/* heading styles over-riding skeleton */
@font-face {
    font-family: 'texgyreadventorregular';
    src: url('texgyreadventor-regular-webfont.eot');
    src: url('texgyreadventor-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('texgyreadventor-regular-webfont.woff') format('woff'),
         url('texgyreadventor-regular-webfont.ttf') format('truetype'),
         url('texgyreadventor-regular-webfont.svg#texgyreadventorregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

h1 { font-size: 2em; line-height: 44px; color:#e8ba02; font-weight: 400; font-family: 'texgyreadventorregular'; text-transform:uppercase;}
h1.page-title {margin-top: 1em;}
h2 { font-size: 1.5em; line-height: 1.4; color:#7f7f7f; font-weight: 400;  margin-top: 1em; font-family: 'texgyreadventorregular'; }
h2 span {color:#0c60b9;}
h3 { font-size: 1.25em; line-height: 30px; color: #0c60b9; font-weight: 400;	margin-top: 30px;}

p { margin: 0 0 1.5em 0; line-height: 170%;}
em { font-style: italic; }
strong { font-weight: bold;}
img, object, video {max-width: 100%; height: auto; display:block;}
img { max-width: 100%; width: auto; border: 0; -ms-interpolation-mode: bicubic;}
hr { border: solid #ff7a00; border-width: 1px 0 0; clear: both; margin: 30px auto; height: 0; width:80%;}

/* links */
a:link, a:visited { 
	color: #fda101; 
	text-decoration: none; 
	outline: 0;
	font-weight:400;
}
a:hover, a:active { color: #cea502; }

.align-left{text-align: left;}
.align-center{text-align: center;}
.align-right{text-align: right}
.imageLeft {float: left;	margin: 2%;}
.imageRight {float:right; margin: 2%;}
.imageCenter {margin:2% auto;}

header {
  margin:0 auto;
  padding: 1em 0;
	width: 100%;
	z-index: 4;
	background:#242424;
	color:#fff;
	border-bottom: 1px solid #000;
}
header a:link, header a:visited {	color: #fdcb01; }
header a:hover, header a:active { color: #cea502; }
header a {margin:0 2%; }
#top {height:2em; background:#fdcb01;}
#logo a{	position:absolute; top:0; left:0; z-index:10; margin:0;}
#call {text-align:right;}
.drive {background: url(../images/truck-icon.png) 0 2px no-repeat;padding-left:20px;}
.quote {background: url(../images/quote-icon.png) 0 3px no-repeat;padding-left:18px; margin-right:0;}


/* hero */
#hero {width:100%; max-height: 330px; overflow:hidden; position:relative; z-index:1; background: #222;}
.photoSlide  {width:100%; height: 330px;	background: #222 url(../images/bg1.jpg) center bottom no-repeat;}
.photoSlide h2 { color: #afaeae; font-size: 1.75em;  margin: 0;  padding: 2em 0 0 0; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9);}
.photoSlide h1 { font-size: 2.5em; margin: 0; padding: .5em 0; color: #fff; text-transform:uppercase; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9); }
.photoSlide h1 span {text-transform:none;}
.photoSlide-about  {width:100%; height: 250px;	background: #222 url(../images/bg-about.jpg) center bottom no-repeat;}
.photoSlide-about h1 { font-size: 2.25em; margin: 0; padding: 2em 0 0 0; color: #c3c3c3; text-transform:uppercase; }
.photoSlide-services  {width:100%; height: 250px;	background: #222 url(../images/bg-services.jpg) center bottom no-repeat;}
.photoSlide-contact  {width:100%; height: 250px;	background: #222 url(../images/bg-contact.jpg) center bottom no-repeat;}

nav {	
	width: 100%;
	text-align:right;	
	font-size: 1em;		
	position: relative;	
	z-index: 10;
	margin-top:2em;
}
nav ul {
	padding: 0;
	margin: 0 auto;
	list-style:none;
}
nav li {
	display: inline;	
	padding:0 5.25%;
	margin:0; 
}
nav a {	
	display: inline-block;
	padding: 1em 0;
	margin:0;
	text-decoration: none;		
}

nav ul li a:link, nav ul li a:visited {color:#fff;} 
nav ul li a:hover, nav ul li a:active {color:#e4e3e3;}
nav ul li.active a { color: #f371b0;}
.first {padding-left:0;}
.last {padding-right:0;}
nav a#pull {display: none;}

.content {padding: 2.5em 0;}
.content.home {padding-bottom: 5em;}
.feature {margin-top: 1.5em; text-align:center;}
.feature img { margin: 0 auto 1.5em; max-width:96%;}

h2.featureTitle { font-size: 1.125em;  margin: -4.5em 0 0 0; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9); text-transform:uppercase;}
h2.featureTitle a {color:#e8ba02;}
h2.featureTitle a:hover {color:#ccc;}
.featureDesc {color:#fff;  padding: 0 0 1.5em;}

.swipebox img {display: inline; margin: 1%; max-width: 98%; border: 1px solid #e4e4e4;}

form {border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    margin: 0 auto 1em auto;
    border: 1px solid #efefef;
    padding: 30px;
    background: #f8f8f8;
   font-size:.9em;
   max-width:480px;    
    }

label, legend {font-weight:400; }
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {font-size: 1em; text-transform: none; font-weight:400; letter-spacing: normal; height:42px;}
.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
  color: #FFF;
  background-color: #fda101;
  border-color: #cea502; }

.video-container {position: relative; padding-bottom: 56.25%;  padding-top: 35px; height: 0; overflow: hidden; margin-bottom: 3rem; }
.video-container iframe {position: absolute; top:0; left: 0; width: 100%; height: 100%;}

footer {width: 100%;	display: block;	background-color:#e8ba02; color:#222;	}
.footerMiddle { padding: 1.5em 0 0 0;	margin: 0;	position: relative;}
.footerAddress {background: rgba(0, 0, 0, 0) url("../images/icon-address.png") no-repeat scroll left 6px;}
.footerPhone {background: rgba(0, 0, 0, 0) url("../images/icon-phone.png") no-repeat scroll left 6px; margin:0;}
.footerEmail {background: rgba(0, 0, 0, 0) url("../images/icon-email.png") no-repeat scroll left 6px;}
.footerIcon { padding-left: 17px;}
.footer-logo {text-align:right;}
.footer-logo img {float:right;}
footer a:link, footer a:visited {color:#242424;}
footer a:hover, footer a:active {color:#424141;}
.footerBottomText {	min-height: 60px; position: relative;}
.call-to-action-button {margin: 1em 0;}
#copyright { margin: 1.5em 0; font-size: .75em;}
#copyright a, #copyright span {}
#copyright a:hover, #copyright a:active{border:0;}

/* Clearfix */
.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}

/*media queries*/
@media screen and (max-width: 1040px) {
/* ipad portrait */

  nav li {padding:0 2.8%; }
	.content {-webkit-overflow-scrolling : touch;}	
	header {-webkit-overflow-scrolling : touch;}
	
}


/* mobile devices */
@media only screen and (max-width: 767px) {

	nav {
		margin: 0;
		text-align:center;
	}
	nav ul {
		display: none;
		height: auto;
	}
	nav li {
		display: block;		
		width: 80%;
		margin:0 auto;
		padding:0;
	}
	nav li a {
    width: 100%;
		border-bottom: 1px solid #404040;
		text-align:center;	
	}
	nav a#pull {
		display: block;
		width: 80%;
		position: relative;
	}
	nav a#pull:after {
		content:"";
		background: url('../images/nav-icon.png') no-repeat;
		width: 60px;
		height: 30px;
		display: inline-block;
		position: absolute;
		right: 15px;
		top: 10px;
	}
	
.imageLeft {float: none;	margin: 2% auto; max-width:96%;}
.imageRight {float:none; margin: 2% auto; max-width:96%;}
.footerMiddle .column {text-align:center;}
.footerMiddle .column img {margin:0 auto;}
.call-to-action-button {float:none;}
.footer-logo {text-align:center;}
.footer-logo img {float:none;margin:0 auto;}
#copyright {text-align:center;}
}

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

#call {padding-top:8em; text-align:center;}
.photoSlide  {	background: #222 url(../images/bg2.jpg) center bottom no-repeat; height:auto;}
.photoSlide h2 { padding:.5em 0 0 0; text-align:center;}
.photoSlide h1 { padding:0 0 .5em 0; font-size: 1.8em; text-align:center;}

}