/***** BEGIN 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 {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;	
}

ol, ul {
	list-style: none;
}

table{border-collapse:collapse; width:100%;}
td{vertical-align:top;}

/* Make HTML 5 elements display block-level for consistent styling */  
header, nav, article, footer, address {  
    display: block;  
} 

/*-------- COLORS --------

*/

/***** END RESET *****/
::-moz-selection {
    background: #000; 
    color: #fff;
    text-shadow: none;
}
::selection {
    background: #000;
    color: #fff;
    text-shadow: none;
}


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

/*-------- BODY STYLES --------*/

body {

}

a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}


hr{border:#000 1px solid;}

/*--- HEADER STYLES ---------------------*/
.header {
background: #9d0000;
display: flex;
flex-wrap: wrap;
}
.topheader{
	border-bottom: #fff solid 2px;
	margin: 15px 5%;
	display: flex;
	justify-content: flex-end;
	width: 100%;
	padding-bottom: 20px;
}
.headerlocation{
	color: #fff;
	font-family: 'Archivo', sans-serif;
	font-size: 15px;
}
.headerlocation i{
	padding-right: 10px;
}
.bottomheader{
	display: flex;
	align-items: center;
	margin: 1% 5%;
	width: 100%;
	padding-bottom: 20px;
	justify-content: space-around;
	box-sizing: content-box;
}
.navbar{
	width: 60%;
	text-align: right;
	padding: 0px 1%;
}
.headerlogo{
	width: 26%;
}
.headericonsect{
	width: 12%;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
}
.headericonbox{
	width: 33%;
	background: #fff;
	color: #000;
	border-left: solid 1px #9d0000;
	border-right: solid 1px #9d0000;
	padding: 14px 0px;
	font-size: 18px;
}
.headericonbox:hover{
	background: #f3f3f3;
}
.mobilemenusect{
	display: none;
}
.mobilelogo{
	display: none;
}
/*---BODY--------------------------------*/
.herosection{
	display: flex;
	width: 100%;
	align-items: center;
}
.herotextsection{
	width: 40%;
    padding: 5%;
	
}
.heroheadsect{
	border-bottom: #9d0000 solid 4px;
	
}
.heroheader{
	font-family: 'Magra', sans-serif;
	font-size: 62px;
    line-height: 50px;
    padding-bottom: 10px;
}
.herosubhead{
	font-family: 'Archivo', sans-serif;
	padding: 20px 0px 40px 0px;
	font-size: 20px;
	line-height: 25px;
}
.herobtn{
	font-family: 'Magra', sans-serif;
	color: #fff;
	background: #9d0000;
	border-radius: 10px;
	padding: 10px 45px;
}
.herobtn:hover{
	background: #8f0000;
}
.heroimagesection img{
	width: 88%;
    position: relative;
    top: -125px;
    right: -135px;
}
.heroimagesection{
	width: 60%;
    overflow: hidden;
}
.shopbysect{
	display: flex;
	flex-wrap: wrap;
	position: relative;
	top:-95px;
}
.shopbyheader{
	background: #000;
	padding: 30px 5%;
	color: #FFFFFF;
	width: 100%;
}
.whiteheader{
	font-family: 'Magra', sans-serif;
	color: #fff;
	font-size: 28px;
}
.shopbybrandsect{
	display: flex;
	width: 100%;
}
.elliott{
	background: url("/siteart/elliotdk.jpg");
	transition-timing-function: ease-in;
 transition: background 0.5s, background-size 0.5s;
}
.altec{
	background: url("/siteart/altecdk.jpg");
	transition-timing-function: ease-in;
 	transition: background 0.5s, background-size 0.5s;
}
.manitex{
	background: url("/siteart/manitexdk.jpg");
	transition-timing-function: ease-in;
 	transition: background 0.5s, background-size 0.5s;
}
.skyhoist{
	background: url("/siteart/skyhoistdk.jpg");
	transition-timing-function: ease-in;
	transition: background 0.5s, background-size 0.5s;
}
.elliott:hover{
	background: url("/siteart/elliotlt.jpg");
 	background-size: 115%;
    background-repeat: no-repeat;
	background-position: center;
}
.altec:hover{
	background: url("/siteart/alteclt.jpg");
 	background-size: 115%;
    background-repeat: no-repeat;
	background-position: center;
}
.manitex:hover{
	background: url("/siteart/manitexlt.jpg");
 	background-size: 115%;
    background-repeat: no-repeat;
	background-position: center;
}
.skyhoist:hover{
	background: url("/siteart/skyhoistlt.jpg");
 	background-size: 115%;
    background-repeat: no-repeat;
	background-position: center;
}
.shopbybrandbox{
	width: 25%;
    border-left: solid 1px #fff;
    border-right: solid 1px #fff;
    height: 175px;
    background-size: cover;
    background-repeat: no-repeat;
	background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
	background-color:#000;
	
}
.whitesubhead{
	font-family: 'Magra', sans-serif;
	color: #fff;
	font-weight: 700;
	font-size: 22px;
}
.shopbybuttonsect{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2%;
}
.redbtn{
	background: #9d0000;
	color: #fff;
	font-family: 'Magra', sans-serif;
	padding: 12px 35px;
	border-radius: 10px;
	font-weight: 700;
}
.redbtn:hover{
	background: #8f0000;
}
.blkbtn{
	background: #000;
	color: #fff;
	font-family: 'Magra', sans-serif;
	padding: 12px 35px;
	border-radius: 10px;
	font-weight: 700;
}
.blkbtn:hover{
	background: #1c1c1c;
}
.hpaboutright a{
	font-family: 'Archivo', sans-serif;
	font-size: 14px;
}
.shopbybuttonsect a{
	margin: 0px 10px;
	width: 12%;
	text-align: center;
}
.hpaboutsect{
	display: flex;
	padding: 0% 5% 5% 5%;
	align-items: center;
}
.hpaboutleft{
	width: 35%;
	border-bottom: solid #9d0000 3px;
	margin: 0px 18% 0% 0%;
}
.hpaboutright{
	width: 40%;
	
}
.blackheader{
	color: #000;
	font-family: 'Magra', sans-serif;
	font-size: 28px;
	line-height: 26px;
}
.redheader{
	color: #9d0000;
}
.blkpara{
    font-family: 'Archivo', sans-serif;
	line-height: 30px;
	font-size: 16px;
}
iframe.scrolling {
    width: 100%;
    height: 90px;
}
/*--------CONTACT STYLES--------------------*/
.second-bkgd{
	background: url("/siteart/circle-bkgd.png");
	background-size: cover;
	background-position: right;
}

.contactformsect{
	padding: 5%;
}
.cpmapsect{
	width: 100%;
	height: 250px;
}
.cpmap{
	width: 100%;
	height: 100%;
}
.lgblkheader{
	color: #000;
	font-family: 'Magra', sans-serif;
	font-size: 46px;
	line-height: 26px;
	padding-bottom: 20px;
	margin-bottom: 10px;
	border-bottom: solid #9d0000 4px;
	width: 25%;
}
.formfields{
	width: 45%;
    height: 35px;
    padding: 0px 15px;
    margin-right: 22px;
    font-family: 'Archivo', sans-serif;
	font-size: 14px;
}
.lgformfields{
	width: 94%;
    height: 35px;
    padding: 0px 1%;
	margin: 10px 0px;
    font-family: 'Archivo', sans-serif;
	font-size: 14px;
}
.comments{
	width: 94%;
	height: 180px;
	padding: 10px 1%;
    font-family: 'Archivo', sans-serif;
	font-size: 14px;
}
.CaptchaPanel{
text-align: left!important;
padding: 0px!important;	
}
.CaptchaMessagePanel{
    font-family: 'Archivo', sans-serif;
	font-weight: 500!important;
	font-size: 14px!important;
}
.CaptchaWhatsThisPanel a{
    font-family: 'Archivo', sans-serif;
	color: #000!important;	
}
.submit{
	background: #9d0000;
	font-family: 'Magra', sans-serif;
    color: #fff!important;
	width: 130px;
	border-radius: 5px!important;
	height: 35px;
	font-weight: 600;
	border: none!important;
	box-sizing: content-box;
}
/*--------THANK YOu STYLES--------------------*/
.thankyoupadding {
    padding: 24vh 5% 30vh 5%;
}



/*-------- FOOTER STYLES ----------------*/
.footer{
	display: flex;
	background: #000;
	padding:2% 5%;
	border-top: solid 5px #9d0000;
}
.footerinfosect{
	width: 20%;
	padding-right: 10%;
	box-sizing: content-box;
}

.footerheader{
	color: #fff;
	font-family: 'Magra', sans-serif;
	font-weight: 700;
	font-size: 18px;
	margin-bottom: 15px;
}
.footerbtn:hover{
	background: #8f0000;
}
	
	
.footerbtn{
	background: #9d0000;
	color: #fff;
	font-family: 'Magra', sans-serif;
	padding: 10px 25px;
	border-radius: 10px;
	font-weight: 700;
	font-size: 12px;
}
.footertext{
	color: #cdcdcd;
	font-family: 'Archivo', sans-serif;
	font-size: 14px;
	padding: 0px 30px 10px 0px;
}
.footersociallink{
	background: #fff;
    color: #000;
    border-left: solid 1px #9d0000;
    border-right: solid 1px #9d0000;
    padding: 7px 13px;
    font-size: 18px;
}
.footersociallink:hover{
	background: #f3f3f3;
}
/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.inventorypadding{
	padding: 5% 1% 8% 1%;
}

.list-top-section .list-title .list-listings-count{
color: #9d0000!important;	
}
.view-listing-details-link{
	background: #9d0000!important;
}
.list-content .price-container .price{
	color: #9d0000!important;	

}
.list-content .media-buttons .print-this, .list-content .media-buttons .email-this{
	    border-radius: 0px!important;
	    padding: 10px 40px!important;
		background-color: #9D0000!important;
    	color: #fff!important;
		border: none!important;
}
.list-content .list-error-container .info button{
	background-color: #9d0000!important;
}
.faceted-search-content .selected-facets-container .selected-facet{
		background-color: #9d0000!important;

}
.list-content .list-error-container .info .selected-facet button{
	background: transparent!important;
}
.mobile-option-bar .mobile-option-bar-filter{
	color: #9d0000!important;
}
.faceted-search-content .mobile-done-button-container .mobile-done-button{
	background: #9d0000!important;
}
.list-top-section .sticky-top-menu .listing-option-bar-content .list-listings-count{
		color: #9d0000!important;

}
.linking-buttons a.active{
	background: #9d0000!important;	
}
/*---------- RESPONSIVE STYLES ----------*/


@media only screen and (max-width: 1584px) {
	.formfields{
		margin-right: 16px;
	}	
	
}
@media only screen and (max-width: 1523px) {
.thankyoupadding {
    padding: 28vh 5% 33vh 5%;
}
	.formfields {
    margin-right: 10px;
}
}
@media only screen and (max-width: 1400px) {
.heroimagesection {
	width: 60%;}	
.heroimagesection img {
    width: 98%;	
	right: -25px;
	}
	.herotextsection{
	width: 43%;
    padding: 5% 3%;	
	}	
	.lgblkheader{
		width: 45%;
	}
	.formfields {
    margin-right: 4px;
}
}
@media only screen and (max-width: 1320px) {
	
	.shopbybuttonsect a{
		width: 20%;
	}	
	.elliott:hover{
 	background-size: 250%;

}
.altec:hover{
	 	background-size: 250%;

}
.manitex:hover{
	 	background-size: 250%;

}
.skyhoist:hover{
 	background-size: 250%;
}
}
@media only screen and (max-width: 1275px) {
.heroimagesection {
    width: 62%;
}	
.herotextsection {
    width: 42%;
    padding: 5% 1%;
}
.herosection{
	padding-bottom: 40px;	
}
.elliott:hover{
 	background-size: 160%;

}
.altec:hover{
	 	background-size: 160%;

}
.manitex:hover{
	 	background-size: 160%;

}
.skyhoist:hover{
 	background-size: 160%;
}	
}
@media only screen and (max-width: 1225px) {
.formfields {
    width: 42%;
    margin-right: 15px;
}
.lgformfields {
    width: 90%;
    height: 35px;
	padding: 0px 11px;
}	
.comments {
    width: 90%;
    padding: 10px 12px;
}
}
@media only screen and (max-width: 1200px) {
	
.hpaboutright {
    width: 50%;
}
.hpaboutsect{
	padding: 4% 5% 8% 5%;	
	}	
	
}
@media only screen and (max-width: 1160px) {
.navbar {
	width: 35%;
	padding: 0px 4%
}
.headerlogo {
    width: 24%;
}
.navbar {
	width: 60%;
	}
.headerlogo img{
    width: 300px;
}
.headericonsect {
	width: 16%;
}
.herotextsection {
    width: 58%;
    padding: 5% 1%;
}	
.herosection {
    padding-bottom: 40px;
}
.heroimagesection {
    width: 48%;
}
.heroimagesection img {
    width: 100%;
    right: -18px;
    top: -58px;
}
.shopbysect{
	top: -34px;	
}
	
}
@media only screen and (max-width: 1080px) {
.hpaboutleft {
    width: 38%;
    margin: 0px 5% 0% 0%;
}	
.hpaboutright {
    width: 57%;
}	
.formfields {
    margin-right: 7px;
}	
}
@media only screen and (max-width: 1030px) {
.elliott:hover{
 	background-size: 200%;

}
.altec:hover{
	 	background-size: 200%;

}
.manitex:hover{
	 	background-size: 200%;

}
.skyhoist:hover{
 	background-size: 200%;
}	
	
}
@media only screen and (max-width: 950px) {
.mobilemenusect{
	display: inline;
	width: 20%;
    padding: 2% 5% 0% 0%;
}
	.topheader{
		display: none;
	}
	.headericonsect{
		display: none;
	}
	.mobileheaderflex{
	display: flex;
	align-items: stretch;
	}
	.header{
		width: 75%;
		padding: 5% 0%;
	}
	.mobileiconsect{
    color: #000;
    text-align: right;
    font-size: 20px;
}
.mobileicons{
    padding-left: 10px;
	color: #000;
}
	.bottomheader{
		padding-bottom: 0px;
	}
	.herosection{
		flex-wrap: wrap-reverse;
	}
	.heroimagesection {
    width: 100%;
	background: url("/siteart/heroimg.png");
	background-size: cover;
    height: 600px;
    background-position: bottom;
	}
	.heroimagesection img{
		display: none;
	}
	.herotextsection {
    width: 100%;
    padding: 5%;
}
	.shopbysect {
    top: 0px;
}
.hpaboutsect {
	flex-wrap: wrap;
	}
.hpaboutleft {
	width: 50%;
	padding-bottom: 10px;
	}
.hpaboutright {
    width: 100%;
    padding-top: 25px;
}
	.footerinfosect {
    width: 38%;
    padding-right: 2%;
}
	.formfields {
    margin-right: 1px;
}
}
@media only screen and (max-width: 810px) {

.shopbybrandbox {
    width: 49%;
	padding-bottom: 20px;
	    margin-bottom: 10px;
}
	.shopbybrandsect{
		flex-wrap: wrap;
		justify-content: space-around;
	}
	.shopbybrandbox {
    width: 49%;
}
.elliott:hover{
 	background-size: 58vh;

}
.altec:hover{
	 	background-size: 58vh;

}
.manitex:hover{
	 	background-size: 58vh;

}
.skyhoist:hover{
 	background-size: 58vh;
}
.shopbybuttonsect a {
    width: 30%;
}
.lgblkheader {
    width: 65%;
}
.formfields {
    width: 89%;
	margin: 5px 0px;
}
.contactformsect {
    padding: 14% 5%;
}
}
@media only screen and (max-width: 745px) {
	.heroimagesection{
		height: 525px;
	}	
	.hpaboutsect {
    padding: 10% 5% 10% 5%;
}
	.hpaboutleft {
	width: 95%;}
}
@media only screen and (max-width: 640px) {
	.heroimagesection {
    height: 93vw;
	background-size: 115%;
	}
.herotextsection {
    width: 100%;
    padding: 10% 5%;
}	
	.footer{
		flex-wrap: wrap;
	}
	.footerinfosect {
    width: 48%;
    padding-right: 2%;
}
}
@media only screen and (max-width: 550px) {
	.logo{
		display: none;
	}
	.mobilelogo{
		display: inline-block;
	}
	.header {
		width: 70%;}
	.mobilemenusect {
    width: 25%;
	padding: 4% 5% 0% 0%;}

	.heroheader{
	font-size: 52px;	
	}
	.shopbybuttonsect{
	flex-wrap: wrap;	
	}
	.shopbybuttonsect a {
    width: 70%;
    margin: 0px 0px 10px 0px;
    padding: 16px 0px;
}
	.headerlogo img {
    width: auto;
}
}

@media only screen and (max-width: 500px) {
	
.shopbybrandbox {
    width: 100%;
	height: 90px;
}	
.elliott:hover{
 	background-size: 50vh;

}
.altec:hover{
	 	background-size: 50vh;

}
.manitex:hover{
	 	background-size: 50vh;

}
.skyhoist:hover{
 	background-size: 50vh;
}	
.shopbybuttonsect a {
    width: 100%;
    margin: 0px 0px 14px 0px;
    padding: 20px 0px;
    font-size: 17px;
}
.footer{
	    padding: 7% 5%;	
	}
.footerinfosect {
    width: 100%;
    padding-right: 2%;
}
	.lgblkheader {
    width: 98%;
}
}
@media only screen and (max-width: 475px) {

	
	.herotextsection {
    padding: 15% 5%;
}
	.herosubhead{
	    font-size: 18px;
    line-height: 32px;	
	}
	.heroheader {
    font-size: 48px;
}
	.herosection {
    padding-bottom: 0px;
}
	.hpaboutright a{
		width: 100%;
		text-align: center;
		margin: 5px 0px;
		padding: 18px;
	}
	.hpaboutright {
		    display: contents;
	}
}
@media only screen and (max-width: 400px) {
	.mobilelogo img{
	width: 185px;	
	}
	.header {
    width: 65%;
	}
	.mobilemenusect {
		width: 30%;}
	.heroheader {
    font-size: 40px;
    line-height: 38px;
}
.hpaboutleft {
    width: 100%;
	margin: 0px 0% 0% 0%;
}
.hpaboutsect {
    padding: 15% 2% 20% 2%;
}
.whiteheader{
	    font-size: 30px;
    line-height: 28px;	
	}	
}
@media only screen and (max-width: 340px) {
	.mobilelogo img{
	width: 150px;	
	}
	.header {
    width: 58%;
	}
	.mobilemenusect {
    width: 32%;
	}
	.header {
    width: 64%;
}
}
@media only screen and (max-width: 300px) {
.headerlogo {
    width: 100%;
}
.bottomheader {
	display: inline;}
.mobilelogo img{
	width: 100%;	
}
.mobilelogo {
    width: 100%;
}
.header{
	align-items: center;
	 width: 70%;

}
.mobileicons {
	padding-left: 2px;
}
.mobilemenusect {
    width: 27%;
}
.lgblkheader{
	line-height: 44px;
	font-size: 40px;
}
}
@media only screen and (max-width: 250px) {
	.mobileheaderflex{
	    flex-wrap: wrap;	
	}	
	.header {
    width: 100%;
}
	.mobilemenusect {
    width: 100%;
    text-align: center;
    display: flex;
	flex-wrap: wrap;
    justify-content: center;
	padding: 4% 5% 0% 5%;
	align-items: center;
}
	.mobileicons {
    padding-left: 4px;
}
	.mobileiconsect {
    width: 60%;
	text-align: left;
	font-size: 20px;
	}
	.mobilemenu{
		width: 40%;
		text-align: right;
	}
.heroheader {
    font-size: 30px;
    line-height: 24px;
}
.herosubhead {
    font-size: 16px;
    line-height: 28px;
}
.herobtn{
font-size: 14px;
padding: 10px 30px;
}
.blkbtn{
padding: 10px 18px;	
font-size: 14px;
}
.formfields {
	width: 80%;
}
.comments {
	width: 83%;
}
.lgformfields {
	width: 84%;
}
.lgblkheader {
    line-height: 32px;
    font-size: 35px;
}
.contactformsect {
    padding: 25% 5%;
}
}