/* RESET 
------------------------------------------------*/
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,
b, u, i, center,
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;  
    background: transparent; 	
	-webkit-text-size-adjust:none;
	font-family: 'Roboto', sans-serif;
}


a {color:#fff; text-decoration:underline;}
a:hover {color:#dbac5e;	text-decoration:none; transition: .3s ease-in-out all;}

p {padding:20px 0;}

h1, h2.largeheader{
	color:#001E73;
	font-size:40px;
	font-weight:600;
	text-align:left;
	font-family: 'Roboto', sans-serif;
	text-transform: uppercase;
	padding-bottom:20px;
	line-height: 1.3;
}

h2{ color:#001E73;
	font-size:36px;
	font-weight:600;
	text-align:left;
	font-family: 'Roboto', sans-serif;
	text-transform:uppercase;
	padding-bottom:20px;
	line-height: 1.3;
}

h3{}

h4{}

h5{}

 
/* GLOBAL SITE FRAMEWORK
------------------------------------------------*/
.clear {clear: both;}
.left {text-align:left;}
.right {text-align:right;}
.none{display:none;}

*{box-sizing:border-box;}

body {overflow-x: hidden; line-height: 1.4; font-family: 'Roboto', sans-serif;}

.wrapper {
	width:100%;
	max-width:1300px;
	margin:0 auto;
	padding:20px;
	position:relative;
}

.no-pad-wrapper {
	width:100%;
	max-width:1300px;
	margin:0 auto;
	position:relative;
}


::selection {
	color:#fff;
	background: #356088;
}
::-moz-selection {
	color:#fff;
	background: #356088;
}


/* HEADER 
----------------------------------------------*/
.header{
	width:100%;
	display:inline-block;
	text-align:center;
	margin:0 auto;
	background:#e2b52c;
	padding:20px
}

.logo{
	text-align:left;
	width:33%;
	margin:0 auto;
	display:inline-block;
	vertical-align:middle;
}
.logo img{
	width:70%;
	margin:0;
}

.head-mid{
	width:33%;
	display:inline-block;
	text-align:center;
	margin:0 auto;
}

.bracket-left{
	border-top:6px solid #fff;
	border-left:6px solid #fff;
	border-bottom:6px solid #fff;
	height:155px;
	width:20px;
	display:inline-block;
	margin:0 auto;
	vertical-align:middle;
}

.bracket-right{
	border-top:6px solid #fff;
	border-right:6px solid #fff;
	border-bottom:6px solid #fff;
	height:155px;
	width:20px;
	display:inline-block;
	margin:0 auto;
	vertical-align:middle;
}

.head-mid h4{
	width:60%;
	text-align:center;
	display:inline-block;
	vertical-align:middle;
	margin:0 auto;
	color:#000;
	font-size:22px;
	line-height: 1.3;
	font-style:italic;
}

.head-right{
	width:33%;
	display:inline-block;
	margin:0 auto;
	text-align:right;
	color:#000;
}

.head-right h3{
	font-size:30px;
	font-style:italic;
	font-weight:600;
	line-height: 1.3;
}


/* HOME PAGE STYLES
-----------------------------------------------*/

.hero{
	width:100%;
	display:block;
	text-align:center;
	margin:0 auto;
	overflow-x:hidden;
	background:#001E73
}

.skew{
	border:6px solid #fff;
	transform:skewX(-20deg);
	display:inline-block;
	width:33%;
	margin:0 auto;
	overflow:hidden;
}

.unskew{
	transform:skewX(20deg);
}

.slant-one{
	background:url(../siteart/crane.jpg) no-repeat;
	background-size:cover;
	height:350px;
	transform:skewX(20deg);
	overflow:hidden;
	width:114%;
	margin-left:-17px;
}

.slant-two{
	background:url(../siteart/trailer.png) #f8e6b0 no-repeat;
	background-size:cover;
	height:350px;
	transform:skewX(20deg);
	overflow:hidden;
	width:125%;
	margin-left:-65px
}

.slant-three{
	background:url(../siteart/trucks.jpg) no-repeat;
	background-size:cover;
	height:350px;
	transform:skewX(20deg);
	overflow:hidden;
	width:114%;
	margin-left:-11%;
}

/*category section*/
.cat-bar{
	width:100%;
	display:block;
	margin:0 auto;
	background:#292727;
	border-top:20px solid #001E73;
	border-bottom:20px solid #001E73;
	text-align:center;
	box-shadow: inset 2px 2px 3px #000;
}

.cat{
	width:24%;
	display:inline-block;
	margin:0 auto;
	vertical-align:middle;
	text-align:center;
}
.cat img{
	display:block;
	width:60%;
	padding:15px;
	margin: 0 auto;
}

.cat h2{
	color:#fff;
	text-align:center;
	text-transform:uppercase;
	font-weight:100;
	font-size:24px;
	padding:0 0 20px 0;
}

a .cat:hover{
	transform:scale(1.1,1.1);
}


/* ABOUT
------------------------------------------------*/

.about {
	width:100%;
	margin:0 auto;
	text-align:center;
}
.about p{
	text-align:left;
}

.about ul{
	margin-left:50px;
}

.about ul li{
	text-align:left;
}

.about img{
	min-width:300px;
	width:40%;
	padding:30px 0;
	text-align:center;
	margin: 0 auto;
}

.about-logos{
	width:100%;
	display:inline-block;
	text-align:center;
	margin:0 auto;
	padding:40px 0;
}

.manu-logo{
	width:30%;
	margin:0 auto;
	text-align:center;
	display:inline-block;
	vertical-align:middle;
}

.manu-logo img{width:70%;min-width:100px;}

.employees{
	background:url(../siteart/connected.png) #FFFFFF;
	padding:60px 0;
	border-top:1px solid #eaeaea;
}

.emp-row{
	width:100%;
	display:inline-block;
	margin:0 auto;
	text-align:center;
}

.emp-card{
	background:#eaeaea;
	padding:15px;
	text-align:center;
	width:25%;
	display:inline-block;
	margin:20px;
	box-shadow:1px 1px 3px #6d6d6d;
	border-radius:5px;
	vertical-align:top;
	height:420px;
}

.emp-card img{
	width:60%;
	display:block;
	text-align:center;
	margin: 0 auto;
}

.emp-card h5{
	text-align:center;
	font-size:22px;
	color:#001E73;
	font-weight:600;
	padding:15px 0 0 0;
}

/* CONTACT PAGE 
----------------------------------------*/

.contact-page{
	width:100%;
	display:inline-block;
	border:1px solid #c5c5c5;
	padding:20px;
	background: #e6e6e6;
}

.contact-page:nth-child(2){border-bottom:none;}
.cp-info{
	width:32%;
	display:inline-block;
	margin:0 auto;
	text-align:center;
	vertical-align:top;
}

.cp-info i{
	display:block;
	text-align:center;
}

.cp-info p{
	width:100%;
	padding-top:10px;
	text-align:center;
}
.cp-info a{
	color:#000;
	text-decoration:none;
}

.cp-info a:hover{
	color:#E2B52C;
	text-decoration:none;
	transition: .3s ease-in-out all;
}

/*--form--*/
#formpage {
	width:100%;
	vertical-align: top;
	display:inline-block;
}

#formpage p{
	text-align:left;
}
.formfield {
	width: 48.4%;
	display:inline-block;
	margin-right: 10px;
	margin-top: 10px;
	color: #000;
	min-width: 175px;
	text-align:left;
}
#formpage div {
	vertical-align: top;
	padding: 5px 5px;
	position: relative;
}
#formpage input {
	padding: 10px;
	border: 1px solid #E2B52C;
	font-family: 'Roboto', sans-serif;
	color: #000;
	font-size: 13px;
	background: #fff;
	width: 100%;
	margin-top: 5px;
	-webkit-appearance: none;
     border-radius: 0;
}

#formpage input.button, #formpage input.button:focus {
	width: 150px;
	display:inline-block;
	position:relative;
	margin: 0;
	background: #E2B52C;
	font-size: 14px;
	line-height: 0;
	font-weight: bold;
	color: #fff;
	text-transform: uppercase;
	padding:20px;
	cursor: pointer;
}

#formpage input.button:hover{
	box-shadow:1px 1px 4px #7D7D7D;
	transition: .3s ease-in-out all;
}

input[type="button"],
input[type="submit"] {
     -webkit-appearance: none;
     border-radius: 0;
}

#formpage textarea {
	padding: 10px;
	border: 1px solid #E2B52C;
	font-family: 'Roboto', sans-serif;
	color: #000;
	font-size: 12px;
	background: #fff;
	margin-top: 5px;
	width: 98%;
	height: 85px;
}
.CaptchaAnswerPanel{
	width:250px;
	margin: 0 auto;
	display: block;
}

.CaptchaWhatsThisPanel a{color:#a9a9a9;}



/*  SCROLLING INVENTORY
------------------------------------------------*/
.scrolling-wrap {
    width:100%;
    height:90px;
    overflow:hidden;
	background:#eaeaea;
	padding:10px 0;
	text-align:center;
}
 
.scrolling{
    width:100%;
    height:92px;
	max-width:1300px;
}


/* FOOTER
------------------------------*/
.footer{
	width:100%;
	color:#696969;
	font-size:11px;
	text-align:center;
	background:#eaeaea;
	padding: 0 0 30px 0;
}

.footer a{
	color:#696969;
	text-decoration:underline;
}

.footer a:hover{
	color:#696969;
	text-decoration:none;
	transition: .3s ease-in-out all;
}
.divfooter{
	width:85%;
	max-width: 700px;
	margin:20px auto 0;
	display: block;
}


/* MEDIA QUERIES */

@media screen and (max-width:1785px){
	.slant-three{width:118%;margin-left:-15%;}
}

@media screen and (max-width:1560px){
	.slant-one{width:118%;margin-left:-16px;height:300px;}
	.slant-two{width:131%;background-size:contain;height:300px;}
	.slant-three{width:126%;margin-left:-67px;height:300px;}
}

@media screen and (max-width:1390px){
	.head-mid h4{font-size:18px;}
	.bracket-left{height:120px;}
	.bracket-right{height:120px;}
	.head-right h3{font-size:24px;}
}

@media screen and (max-width:1330px){
	.slant-one{height:250px;}
	.slant-two{margin-left:-45px;height:250px;}
	.slant-three{height:250px;}
}
	
@media screen and (max-width:1160px){
	.head-mid h4{font-size:16px;}
	.bracket-left{
		height:100px;
		border-top:4px solid #fff;
		border-left:4px solid #fff;
		border-bottom:4px solid #fff;
	}
	.bracket-right{
		height:100px;		
		border-top:4px solid #fff;
		border-right:4px solid #fff;
		border-bottom:4px solid #fff;
		}
	.head-right h3{font-size:20px;}
	
	.cat h2{font-size:20px;}
	
	.emp-card{height:375px;}
}

@media screen and (max-width:1030px){
	.logo img{width:250px;}
	.head-mid h4{font-size:14px;}
	
	.slant-one{height:200px;}
	.slant-two{height:200px;}
	.slant-three{height:200px;}
	
}

@media screen and (max-width:955px){
	.head-mid{display:none;}
	.logo{width:49%;}
	.head-right{width:50%;}
	
	.cat h2{font-size:18px;}
	.cat img{width:150px;}
	
	.emp-card{width:40%;}
	.emp-card img{width:150px; display:inline-block;}
	
	.formfield{width:98%;}
}

@media screen and (max-width:850px){
	.slant-one{height:150px;}
	.slant-two{height:150px;margin-left:-27px;}
	.slant-three{height:150px;margin-left:-40px;}


@media screen and (max-width:780px){
	.emp-card{height:425px;}
	.cp-info{width:100%;padding-top:20px;}
}

@media screen and (max-width:720px){
	.cat{width:49%;}
}

@media screen and (max-width:680px){
	.hero{display:none;}
	.cat-bar {border-top: none;}
}

@media screen and (max-width:610px){
	.emp-card{width:90%;height:auto;}	
	h1{font-size:32px;}
}

@media screen and (max-width:530px){
	.logo{width:100%;text-align:center;}
	.logo img{margin: 0 auto;}
	.head-right{display:none;}
	.cat{width:100%;}
}

@media screen and (max-width:450px){
	h1{font-size:32px;}
	.about-logos{pading:0;}
}