﻿@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700;800&display=swap');
/***** 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 {
font-family: 'Open Sans', sans-serif;
	margin: 0;
}

p {
font-family: 'Open Sans', sans-serif;
	font-size: 16px; 
	line-height: 26px;
}

a:link, a:visited, a:active {text-decoration:none; color:#addae7}
a:hover {text-decoration:none;}

h1, h2, h3, h4, h5 {text-transform: uppercase; letter-spacing: 1px;font-family: 'Open Sans', sans-serif;}
hr{border:#000 1px solid;}
h4 {font-size: 14px;}
.med-blue-text {color:#596d77; font-weight: 700; }
.blk-text {color:#333;}
#padding50 {padding: 50px 0;}
/*--- HEADER STYLES ---------------------*/
.logo {width: 30%; float: left; margin: 0 auto; text-align: center; border-bottom: 10px solid #D41314; height: 120px;}
.logo img {max-width: 250px; width: 100%; padding: 25px 0;}
.header-right {float: right; width: 70%;  border-bottom: 10px solid #333;  height: 120px;text-align: right;}

.header-top {float: right; text-align: right; margin-right: 25px;}
.header-top #white-link-head {background: #f1f1f1; width: 120px; text-align: center; padding: 10px 0; float: left; color:#000; text-transform:uppercase; letter-spacing:1px; font-size:16px;}
.header-top #lt-gray-link-head {background: #e6e6e6; width: 120px; text-align: center; padding: 10px 0; float: left; color:#000; text-transform:uppercase; letter-spacing:1px; font-size:16px;}
.header-top #med-gray-link-head {background: #d8d8d8; width: 120px; text-align: center; padding: 10px 0; float: left; color:#000; text-transform:uppercase; letter-spacing:1px; font-size:16px;}
.header-top #drk-gray-link-head {background: #cfcfcf; width: 120px; text-align: center; padding: 10px 0; float: left; color:#000; text-transform:uppercase; letter-spacing:1px; font-size:16px;}

hr {background: #000; height: 1px; width: 80%; margin: 0 auto;}
hr.gray {background: #ddd; height: .5px; width: 100%;}
/*---BODY--------------------------------*/
.width {width: 80%; margin: 0 auto;}
.ql-container {width: 80%; margin: 0 auto; text-align: center;}

.hp-header {border-top:.5px solid #000; }
.hp-header h1 {letter-spacing: 1px; text-transform: uppercase; padding: 20px 0; font-weight: 300; text-align: center;}
.bl-text {color:#596d77; font-weight: 700}

.flex-container {display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: stretch;
	align-content: stretch;
}
.med-blue {background: #4a5d66; padding: 70px 0;width: 50%;}
.med-blue h2 {color:#addae7; letter-spacing: 1px; text-transform: uppercase;}
.med-blue p {color:#fff;}
.lt-img {background:url(../siteart/hp-bg.jpg) no-repeat; background-size: cover; padding: 25px 0;width: 50%;}
.lt-img h4 {padding: 10px 0;}
.lt-img h3 {color:#4a5d66; padding-top:5px;}
.blue-img {width: 50%; background: url(/siteart/earthmoving-eq.jpg) no-repeat; background-size: cover; background-position: center center}
.blue-img img {width: 100%;}
.drk-blue {background: #303c42; padding: 50px 0; width: 50%;}
.drk-blue h2 {color:#fff;  padding: 10px 0;}


.col-2 {width: 48%; display: inline-block; vertical-align: top;}
.red-line {height: 10px; width: 50px; background: #bf0203; margin-bottom: 15px;}
.flex-contact {display: flex; flex-direction: row; align-items: top;}
.icon-left .fa {color:#fff; font-size: 20px; width: 20%; letter-spacing: 5px; padding: 10px 0;}
.info-right {width: 80%; padding-left: 2%;}
.info-right p{color:#fff; text-transform: uppercase; letter-spacing: 1px; font-weight: 600; padding: 10px 0;}
.info-right p a {color:#fff;}
.info-right p a:hover {color:#addae7;}

/**---- SCROLLING MANU BAR -----------------------------*/
.brandbar{
	background:#fff;
	margin: 0 auto;
	text-align: center;
	padding:20px 0px;
	width: 90%;
	top:0;
	left: 0;
	right:0;
}
.brandbar h2 {font-weight: 400;}
.manu-slider img{width:80%;  padding: 10px 15px; border:.5px solid #fff;}
.manu-slider img:hover {opacity:.7; border:.5px solid #ddd;-webkit-transition-duration: 0.4s; /* Safari */ transition-duration: 0.4s;}

/* PARTS PAGE */
.parts-flex {display: flex; flex-direction: row; align-items: top; }
.parts-left { width: 48%; margin-right: 2% }
.parts-left {padding-bottom: 20px;}
.parts-right {width: 52%;}
.parts-right img{width: 47%; display: inline-block; vertical-align: top; margin:7px .5%}
.parts-full {width: 100%; }
.parts-full img{width: 23.3%; margin:7px .5%; display: inline-block; vertical-align: middle; padding: 0;}
.width hr {width: 100%; height: .5px; background: #000; margin:35px 0;}
.tinyline {width: 100px; height: 5px; background: #f1f1f1; margin: 10px 0; }
/*--------SUB PAGES----------------------*/
.off-white {background: #f1f1f1; width: 100%;}
.blue-btn {background:#4A5D66; padding: 10px 25px; color:#fff; display: inline-block; margin: 15px 0; transition: .3s ease;}
.blue-btn:hover {background:#D41314; padding: 10px 25px; color:#fff; display: inline-block; margin: 15px 0; }
#padding25 {padding: 25px 0;}
.sub-hero {background: url(/siteart/sub-header.jpg)no-repeat; background-attachment: fixed; padding:60px 0;}
.sub-hero h1 {text-align: center; color:#fff; letter-spacing: 2px; font-weight: 400;}
.sub-hero h4 {font-size: 14px; letter-spacing: 2px; text-align: center; color:#addae7;}
.full-width-img {width: 100%; float: left;}
.full-width-img img {width: 100%; padding: 25px 0;}
.half-width{width: 100%;}
.half-width img{width: 50%; float: left;}

.sub-hero-rentals {background: url(/siteart/sub-header-rentals.jpg)no-repeat; background-attachment: fixed; padding:60px 0;}
.sub-hero-rentals h1 {text-align: center; color:#fff; letter-spacing: 2px; font-weight: 400;}
.sub-hero-rentals h4 {font-size: 14px; letter-spacing: 2px; text-align: center; color:#addae7;}

.about-hero {background: url(/siteart/about-hero.jpg)no-repeat; background-attachment: fixed; padding:100px 0;}
.about-hero h1 {text-align: center; color:#fff; letter-spacing: 2px; font-weight: 400;}
.about-hero h4 {font-size: 14px; letter-spacing: 2px; text-align: center; color:#fff; text-shadow: 2px 2px 3px #333}

#padding50 {padding: 50px 0;}
.service-hero {background: url(/siteart/service-hero.jpg)no-repeat; background-attachment: fixed; padding:100px 0;}
.service-hero h1 {text-align: center; color:#fff; letter-spacing: 2px; font-weight: 400;}
.service-hero h4 {font-size: 14px; letter-spacing: 2px; text-align: center; color:#fff; text-shadow: 2px 2px 3px #333}

.service-container {margin: 0 auto; display: inline-block; width: 100%;}
.service-container h2 {}
.service-container img {float: left; width: 31%; margin: 1%;}

.about-flex {display: flex; flex-direction: row; align-items: center; padding: 25px 0;}
hr.mini {width: 75px; height: 5px; background: #D41314; text-align: left; margin: 20px 0; border: 0;}
hr.full {width: 100%; height: 2px; background: #000; text-align: left; margin: 30px 0; border: 0;}
.flex-left, .flex-right {width: 50%; margin: 2%;}
.flex-left img, .flex-right img{width: 100%;}

.map-left {width: 70%; box-shadow: 2px 2px 4px #ddd;}
.med-blue-btn {background: #4a5d66; padding: 10px 30px; text-align: center; color:#fff; line-height: 60px; transition: .3s ease; text-transform: uppercase; letter-spacing: 1px;}
.med-blue-btn:hover {background: #000; }
.white-text {color:#fff;}

.drk-blue .fa {color:#4a5d66; letter-spacing: 4px;}
.contact-left {width: 68%; padding-right: 2%; background: #4a5d66;}

.parts-box {width: 30%; margin: 2% 1%; display: inline-block; vertical-align: bottom; text-align: center;}
.parts-box h3 {padding: 15px 0; border-top:1px solid #4a5d66; margin-top:15px;}

.pl {text-align: center; margin: 0 auto;}
.pl img {display: inline-block; text-align: center; vertical-align: middle; margin: 2% 2%; max-height: 200px; width: auto;}
/*--------FORM STYLES--------------------*/

.flex-form{
	width:95%;
	text-align: left;
	margin: 0 auto;
	flex-direction: row;
	justify-content: flex-start;
	align-items: flex-start;
	font-size: 15px;
	margin-left: 2.5%;
	padding: 25px 0;
}

.flex-form h3{
	width:100%;
	text-transform: uppercase;
	font-weight: 600;
	border-top:2px solid #eee;
	padding:20px 0 20px 0;
	margin-top:40px;
}

.flex-form h4{
	width:100%;
	text-transform: uppercase;
	font-weight: 600;
	margin-top:40px;
	padding:10px 0;
	font-size: 16px;
}
.flex-form label{font-weight: normal; color:#fff;}

.flex-form span{text-align: left; margin: 0; font-size: 12px;}


.flex-form #formpage input, select{margin-top:5px;}

.flex-form .flex-row{
	display: flex; 
	justify-content: space-between; 
	align-items: flex-end; 
	width: 100%;
}

.flex-border{
	border:2px solid #eee;
	padding:20px;
}

.flex-input{
	width:100%;
	display: flex;
	flex-direction: column;
	margin: 10px 5px 5px 5px;
	text-align: left;
}



.check-container {display: inline-block; text-align: left; margin: 0;}
.check-container input[type="checkbox"]{display: inline-block; width:20px !important;}
	



/*form styles*/
.parts-request{
	width:100%;
	padding:40px 0;
	text-align:left;
	margin-top:40px;
	border-top:1px solid #eaeaea;
}

.parts-request h3{text-transform:uppercase;}

#formpage {
	width:100%;
	vertical-align: top;
	display:inline-block;
	text-align:left;
}

#formpage p{
	text-align:left;
}
#formpage h4{margin-top:30px;}

.form-half{
	width:48%;
	display: inline-block;
	vertical-align: middle;
	margin: 10px;
}

.add-part{
	padding:30px;
	border:1px solid #f1f1f1;
	margin:20px 0 0 0
}
.add-part h4{margin:0 0 10px 10px !important;}


.formfield {
	width: 100%;
	display:inline-block;
	margin-right: 10px;
	margin-top: 10px;
	min-width: 175px;
	text-align:left;
}

#formpage input,select {
	padding: 6px 5px 10px;
	border: 1px solid #f1f1f1;
	font-family: 'Open Sans', sans-serif;
	color: #000;
	font-size: 16px;
	margin-top: 5px;
    border-radius: 2px;
	background:#f1f1f1;
}

#formpage input:focus {
	border: 1px solid #eaeaea;
	border-radius:2px
}

#formpage option{color:#333;background:#fff;}

/*===PLACEHOLDER TEXT STYLES===*/

#formpage ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #767676;
}
#formpage ::-moz-placeholder { /* Firefox 19+ */
  color: #767676;
}
#formpage :-ms-input-placeholder { /* IE 10+ */
  color: #767676;
}
#formpage :-moz-placeholder { /* Firefox 18- */
  color: #767676;
}
#formpage input.submit-button, #formpage input.submit-button:focus {
	background:#303c42; 
	color:#fff;
	padding:10px;
	text-decoration:none;
	border-radius:2px;
	transition:ease-in .3s;
	width: 150px;
	border:none;
	height:auto;
	letter-spacing: 2px; 
	font-family: 'Open Sans', sans-serif;
}



#formpage input.submit-button:hover{
	background:#000; 
	box-shadow:1px 1px 2px #848484;
	transition:ease-out .3s;
}

input[type="button"],
input[type="submit"] {
	-webkit-appearance: none;
}

#formpage textarea {
	padding: 6px 5px;
	border: 1px solid #f1f1f1;
	color: #000;
	font-size: 16px;
	background: #f1f1f1;
	width: 100%;
	height: 85px;
	border-radius:2px;
	margin-top:10px;
}

#formpage textarea:focus{
	border: 1px solid #eaeaea;
	border-radius:2px
} 

.CaptchaPanel{width:100%;}

.CaptchaImagePanel img{width:200px;}

.CaptchaAnswerPanel{
	width:250px;
	margin: 0 auto; 
	text-align: center;
}
.CaptchaWhatsThisPanel a{color:#333;}
.CaptchaMessagePanel {color:#fff;}
.submit-button{
	padding:10px 0px 10px 0px;
	position:relative;
	width:100%;
	text-align:center;
}

/*end form styles*/


@media screen and (max-width: 1170px)  {
	.form-half{width: 46%;}
}

@media screen and (max-width: 900px)  {
	.flex-form .flex-row{flex-wrap: wrap;}
}

@media screen and (max-width: 700px)  {
	.form-half{width: 98%;}
}

@media screen and (max-width: 450px)  {
	.add-part{padding: 20px;}
}




/*-------- FOOTER STYLES ----------------*/
.red-bar {background: #bf0203; height: 20px; width: 100%;}
footer{padding: 30px 0;}
.foot-ql {width: 50%; display: inline-block; vertical-align: middle;}
.foot-logo {width: 48%; display: inline-block; vertical-align: middle; text-align: center;}
.foot-logo img {text-align: center; margin: 0 auto; padding: 20px 0; max-width: 250px; }
.flex-logos {display: flex; flex-direction: row; align-items: center;}
.flex-logos img {width: 25%; padding: 5%; text-align: center;}
p.columncount {column-count: 2; column-gap: 20px; color:#000;}
p.columncount a{color:#000;}
p.columncount a:hover{color:#4a5d66;}






/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
/*  scrolling inventory
------------------------------------------------*/
.scrolling-wrap {
    width:100%;
    height:90px;
    overflow:hidden;
	margin-top:25px;
	background:#4a5d66; padding: 20px 0; 
}
 
.scrolling{
    width:100%;
    height:92px;
}
.hosted-content .attachment-search .search-checkboxes label .row {margin-left:0 !important;margin-right:0 !important;margin-bottom:0px !important;}

.list-content .list-main-section .list-container .list-listing .listing-top-right .view-listing-details-link, .faceted-search-content .selected-facets-container .selected-facet, .list-content .list-listing-mobile .view-listing-details-link, .list-content .list-listing-mobile .buy-now-link, .list-content .list-listing-mobile .check-availability-link, .list-content .list-listing-mobile .email-seller-link, .detail-content .detail-main-body .main-detail-data .offer-btn, .detail-content .detail-main-body .main-detail-data .buy-btn, .detail-content-mobile .detail-main-body .main-detail-data .dealer-phone-mobile-container .dealer-phone-mobile, .detail-content-mobile .detail-main-body .main-detail-data .offer-btn-mobile, .detail-content-mobile .detail-main-body .main-detail-data .send-email-btn-mobile, .detail-content-mobile .detail-main-body .main-detail-data .send-wholesale-email-btn-mobile, .detail-content-mobile .detail-main-body .main-detail-data .fin-calc-btn-mobile, .list-container-flexrow .view-listing-details-link {background:#4a5d66 !important; color: #ffffff!important; }
.list-content .list-title .list-title-text, .detail-content-mobile .detail-main-body .detail-mobile-top .detail-title {font-size: 22px; line-height: 26px;}

.detail-content .detail-additional-data .data-row .data-label, .detail-content-mobile .detail-additional-data .data-row .data-label {background: #4a5d66 !important; color: #ffffff!important; text-transform: uppercase; letter-spacing: 1px;}
.detail-content-mobile .detail-contact-bar .contact-bar-btn, .faceted-search-content .mobile-done-button-container .mobile-done-button {background: #000 !important;}

.detail-content .detail-main-body .main-detail-data .offer-btn, .detail-content .detail-main-body .main-detail-data .buy-btn {float:none;}
.dealer-info a,.list-content .list-main-section .list-container .list-listing .listing-top-right .listing-dealer-info .dealer-name {color:#4a5d66;}

.list-content a:link, .list-content a:visited, .list-content a:active, .detail-wrapper a:link, .detail-wrapper a:visited, .detail-wrapper a:active {
	color: #4a5d66!important;
}


/*---------- RESPONSIVE STYLES ----------*/



@media only screen and (max-width: 1400px) {
	.ql-container {width: 95%;}
	
}
	
@media only screen and (max-width: 1000px) {
	.parts-box {width: 47%;}

	.contact-left {width: 98%}
	.width {width: 90%;}
	.map-left {width: 40%;}
    .parts-full img{width: 31.5%; margin:7px 5px; display: inline-block; vertical-align: middle;}
    .parts-flex {display: block; margin: 0 auto;}
    .parts-left, .parts-right {width: 100%; margin: 0 auto;}
    .parts-right img {padding: 5px 5px; width: 47%;}
	
}
@media only screen and (max-width: 900px) {
	#padding50 {padding: 25px 0;}
	.hero-text {display: none;}
	.flex-container{display: block;}
	.map-left {width: 100%;}
	.lt-blue, .drk-blue, .med-blue, .lt-img, .blue-img {width: 100%;}
	.foot-ql {width: 100%;}
	.foot-logo {margin: 0 auto; width: 100%; }
	.about-flex {display: block;}
	.flex-left, .flex-right {width: 100%; margin: 0 auto;}
    .parts-right img {padding: 5px 5px; width: 46%;}
    .parts-full {width: 100%; margin: 0 auto;}
    .parts-full img{width: 46%; padding:5px 5px; }
    .parts-right img {padding: 5px 5px; width: 46%;}
    .parts-full {width: 100%; margin: 0 auto;}
    .parts-full img{width: 46%; padding:5px 5px; }
}

@media only screen and (max-width: 700px) {
	.logo {width: 100%; border-bottom: 0; padding: 5px 0;}
	.logo img {width: 80%; margin: 0 auto; text-align: center;}
	.header-top {display: none;}
	.header-right {width: 100%; text-align: center; margin: 0 auto; float: none; display: inline-block; height: auto;}
	.parts-box {width: 100%; margin: 2% 0;}
	.parts-box h3 {font-size: 16px;}
	.pl img {display: block; text-align: center; vertical-align: middle; margin: 2% auto; padding: 20px 0; max-height: auto; max-width: 300px; width: 90%;}
	.col-2 {width: 100%;}
	.header-top {float: none; text-align: center; margin: 0 auto;}
	.header-top #white-link-head {background: #f1f1f1; text-align: center; padding: 10px 10px;display: inline-block; float: none; color:#000; text-transform:uppercase; letter-spacing:1px; font-size:16px;}
	.header-top #lt-gray-link-head {background: #e6e6e6; text-align: center; padding: 10px 10px; display:inline-block; float: none; color:#000; text-transform:uppercase; letter-spacing:1px; font-size:16px;}
	.header-top #med-gray-link-head {background: #d8d8d8; text-align: center; padding: 10px 10px; display:inline-block; float: none; color:#000; text-transform:uppercase; letter-spacing:1px; font-size:16px;}
	.header-top #drk-gray-link-head {background: #cfcfcf; text-align: center; padding: 10px 10px; display:inline-block; float: none; color:#000; text-transform:uppercase; letter-spacing:1px; font-size:16px;}
	.service-container img {float: left; width: 44%; margin: 1%;}


}

@media only screen and (max-width: 600px) {
        .parts-right img {padding: 5px 1%; width: 44%;}
    .parts-full img{width: 44%; padding:5px 1%; }
}
@media only screen and (max-width: 420px) {
	.service-container img {float: left; width: 100%; margin: 1% auto;}
}
