﻿/***** 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;font-family: 'Archivo Narrow', sans-serif;
	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, img {  
    display: block;  
} 

/***** END RESET *****/

/* Clearfix */
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}

body {font-size:20px;line-height:28px;-webkit-text-size-adjust:none;}
h1, h2, h3, h4 {font-weight:700;line-height:normal;}
strong {font-weight:700;}

a:link, a:visited, a:active {text-decoration:none;font-weight:700;color:#005eb0;}
a:hover {text-decoration:underline; color:#005eb0;}

.wrapper {max-width:80%;width:100%;margin:0 auto;heights:auto;padding:2% 0;}
.tires {background:url("../siteart/tires.png") no-repeat;background-position:center center;background-attachment:fixed;
    -webkit-background-size:cover;
    -moz-background-size:cover;
    -o-background-size:cover;
    background-size:cover;}

header {border-bottom:2px solid #ee7f24;width:100%;height:auto;display: flex!important;justify-content: space-between!important;}
.logo {width:100%;max-width:90%;display:block;float:left;text-align:center!important;padding:12px;box-sizing:border-box;}
.logo img {max-width:100%;height:auto;display:inline-block;margin:0 auto;}

#search-head {display: block; max-width: 260px!important; margin-right: 20px;}
form.search {
	display: flex!important;
	margin-top: 37px!important;
	border: 1px solid #005eb0!important;
	border-radius: 20px!important;
	padding:  3px 10px 5px!important;
}
input.searchTerm {
	border: none!important;
	background: transparent!important;
	padding:  5px 0px 5px 10px!important;
	width: calc(100% - 45px)!important;
	max-width: 200px!important;
	font-family: sans-serif!important;
	font-size: 13px!important;
	
}
input.searchTerm:focus {
	outline: none!important;
	background: transparent!important;
	font-family: sans-serif!important;
	font-size: 13px!important;
}
label#hidden-label {
	display:none!important;
}
input.searchButton {
	float: right!important;
	margin-right: 5px!important;
	margin-left: 5px!important;
	margin-top: 3px!important;
	cursor: pointer!important;
	width: 25px!important;
	height: 25px!important;
	border: none!important;
	background-color: transparent!important;
	color: transparent!important;
	background-image: url(/siteart/magnifying-glass.svg)!important;
	background-repeat: no-repeat!important;
	background-size: contain!important;
}

.grid {position:relative;margin:0 auto;padding:0 0 0 0;max-width:100%;list-style:none;text-align:center;}
.grid figure {position:relative;float:left;overflow:hidden;margin:0;box-sizing:border-box;max-width:20%;width:100%;height:auto;background:#005eb0;text-align:center;cursor:pointer;border:1px solid #ccc;}
.grid figure img {position:relative;display:block;min-height:100%;max-width:100%;opacity:0.8;}
.grid figure figcaption {padding:2em;color:#fff;box-sizing:border-box;text-transform:uppercase;font-size:1em;-webkit-backface-visibility:hidden;backface-visibility:hidden;}
.grid figure figcaption::before,
.grid figure figcaption::after {pointer-events:none;}
.grid figure figcaption,
.grid figure figcaption > a {position:absolute;top:0;left:0;width:100%;height:100%;}
.grid figure figcaption > a {z-index:1000;text-indent:200%;white-space:nowrap;font-size:0;opacity:0;}
.grid figure h2 {font-weight:700;}
.grid figure h2,
.grid figure p {margin:0;}

figure.effect figcaption::before {position:absolute;top:0;left:0;width:100%;height:100%;background:-webkit-linear-gradient(top, rgba(72,76,97,0) 0%, rgba(72,76,97,0.8) 75%);background:linear-gradient(to bottom, rgba(0,94,176,0) 0%, rgba(0,94,176,0.8) 75%);content:'';opacity:0;-webkit-transform:translate3d(0,50%,0);transform:translate3d(0,50%,0);}
figure.effect h2 {position:absolute;top:50%;left:0;width:100%;color:#fff;-webkit-transition:-webkit-transform 0.35s, color 0.35s;transition:transform 0.35s, color 0.35s;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0);}
figure.effect figcaption::before,
figure.effect p {-webkit-transition:opacity 0.35s, -webkit-transform 0.35s;transition:opacity 0.35s, transform 0.35s;}
figure.effect p {position:absolute;bottom:0;left:0;padding:2em;box-sizing:border-box;width:100%;opacity:0;-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0);}
figure.effect:hover h2 {color:#fff;-webkit-transform:translate3d(0,-50%,0) translate3d(0,-40px,0);transform:translate3d(0,-50%,0) translate3d(0,-40px,0);}
figure.effect:hover figcaption::before ,
figure.effect:hover p {opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);}

.dirt a:link, .dirt a:visited, .dirt a:active {text-decoration:none;color:#fff;}
.dirt a:hover {text-decoration:underline;color:#fff;}
.dirt {background:url("../siteart/footer.png") no-repeat;background-position:center center;background-attachment:fixed;color:#fff;padding:20px 0;
    -webkit-background-size:cover;
    -moz-background-size:cover;
    -o-background-size:cover;
    background-size:cover;}

.trencher {background:url("../siteart/trencher.png") no-repeat;width:315px;height:208px;position:absolute;z-index:10;right:40px;}


footer a:link, footer a:visited, footer a:active {text-decoration:none;color:#fff;}
footer a:hover {text-decoration:underline;color:#fff;}
footer {background:#f47f1f;width:100%;height:auto;text-align:right;color:#fff;font-weight:700;text-transform:uppercase;}

.twocols {width:100%;max-width:50%;height:auto;display:block;float:left;}
.maps {width:80%;}

/* font size/line height */
.hosted-content .listings-wrapper .listings-list {font-size:inherit !important;}
.hosted-content .listings-wrapper .listings-list .col {line-height:26px !important;}

/*Currency styles*/
.currency-capital-price-container img {display:inline!important;padding:5px!important;vertical-align:middle!important;}

/* listings buttons and hover color */
.hosted-content input[type='submit'], .hosted-content button[type='submit'], .hosted-content .btn, .hosted-content .button {background:#005eb0 !important;}
.hosted-content input:hover[type='submit'], .hosted-content button:hover [type='submit'], .hosted-content .btn:hover, .hosted-content .button:hover {background:#ee7f24 !important;}
.hosted-content a.widget-email {background:#005eb0 !important;}
.hosted-content a.widget-email:hover {background:#ee7f24 !important;}

/* font family */
.hosted-content .listings-wrapper .bold, .hosted-content .listings-wrapper .italic, .hosted-content .listings-wrapper h2, .hosted-content .listings-detail-wrapper .bold, .hosted-content .listings-detail-wrapper .italic, .hosted-content .listings-detail-wrapper h2, .hosted-content .listings-drilldown-wrapper .bold, .hosted-content .listings-drilldown-wrapper .italic, .hosted-content .listings-drilldown-wrapper h2 {font-family: 'Archivo Narrow', sans-serif!important;font-weight:700 !important;}



/* FACETED */


#inv{
	padding: 45px 0;
	line-height: normal !important;
}
#inv *:not(.fa):not(.far):not(.fas):not(.fab):not(.material-icons){font-family: 'Archivo Narrow', sans-serif!important;} /* Reset font, ignore icons */
#inv *:not(.loading-spinner):not(.loader){border-radius: 0!important;}

.faceted-search-content .faceted-section-box .faceted-option-checkbox-container label input {margin: 2px 3px 3px 4px !important;}
.faceted-text-input-searchType .search-type input[type=checkbox], .faceted-text-input-searchType .search-type  input[type=radio] {margin: 0px 3px 0px 6px !important;}

.faceted-search-content .faceted-section-box .faceted-option-checkbox-container .option-name{
	margin-top: 0 !important;
}

span.compare-label{padding-left: 4px !important;}
.compare-chkbox-container .compare-listings .fa-check {
    top: -1px !important;
    left: 6px !important;
}

.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, .mobile-breadcrumb, .main-detail-data .contact-options a, button.g-recaptcha.button, .cs-btns a, .page-nav { 
	background: #005eb0 !important; 
	color: #fff !important; 
	text-decoration: none !important; 
	transition: ease all 0.2s;
}
.list-content .list-main-section .list-container .list-listing .listing-top-right .view-listing-details-link:hover, .faceted-search-content .selected-facets-container .selected-facet:hover, .list-content .list-listing-mobile .view-listing-details-link:hover, .list-content .list-listing-mobile .buy-now-link:hover, .list-content .list-listing-mobile .check-availability-link:hover, .list-content .list-listing-mobile .email-seller-link:hover, .detail-content .detail-main-body .main-detail-data .offer-btn:hover, .detail-content .detail-main-body .main-detail-data .buy-btn:hover, .detail-content-mobile .detail-main-body .main-detail-data .dealer-phone-mobile-container .dealer-phone-mobile:hover, .detail-content-mobile .detail-main-body .main-detail-data .offer-btn-mobile:hover, .detail-content-mobile .detail-main-body .main-detail-data .send-email-btn-mobile:hover, .detail-content-mobile .detail-main-body .main-detail-data .send-wholesale-email-btn-mobile:hover, .detail-content-mobile .detail-main-body .main-detail-data .fin-calc-btn-mobile:hover, .mobile-breadcrumb, .main-detail-data .contact-options a:hover, button.g-recaptcha.button:hover, .cs-btns a:hover, .page-nav:hover { 
	background: #ee7f24 !important; 
}

.list-content .list-main-section .list-container .list-listing .listing-top-right .buy-now-link, .list-content .list-main-section .list-container .list-listing .listing-top-right .check-availability-link, .list-content .list-main-section .list-container .list-listing .listing-top-right .email-seller-link, .list-content .list-main-section .list-container .list-listing .listing-top-right .video-chat-link, .faceted-search, .faceted-show-all-btn {background: #272727 !important;}

.list-content .list-title .list-listings-count, .list-content .list-main-section .list-container .list-listing .listing-top .listing-top-left .listing-main-stats .price, #parts-content .parts-top-section .parts-title-and-breadcrumbs .parts-title .parts-listings-count, #inv .error-message, #inv .info, .detail-content .detail-main-body .main-detail-data .detail-price, .detail-content .search-results, .list-content .list-top-section .listing-option-bar .list-listings-count, .detail-price, .breadcrumbs-element, .return-links *, .compare-title, .compare-price {color: #272727 !important;}
 
/* heading */
.list-content .list-title .list-title-text, .detail-content-mobile .detail-main-body .detail-mobile-top .detail-title, .main-detail-data .detail-title, .parts-title-text {padding-left: 4px;}

.detail-content .detail-additional-data .data-row .data-label, .detail-content-mobile .detail-additional-data .data-row .data-label, .part-detail-additional-data .data-label, .part-detail-content .detail-contact-bar {background: #272727 !important;}
.detail-content-mobile .detail-contact-bar .contact-bar-btn, .faceted-search-content .mobile-done-button-container .mobile-done-button, .list-page-nav, .contact-options a {background: #272727 !important;}

.detail-content .dealer-info .phone-and-email .send-email-btn {border-color: #272727!important; color: #272727!important;}

.material-icons, .collapsible-content a {color:#fff!important;}

#parts-content .parts-bottom-section .parts-list-view .parts-list-content .parts-listing-container .parts-listing-column .parts-button.view-details {background-color: #272727!important;}

.detail-content-mobile .detail-main-body .main-detail-data .dealer-phone-mobile-container .dealer-phone-mobile{margin-right:0!important;}

.detail-content .detail-main-body .main-detail-data .details-fin-calc .detail-btn-calc{height: 48px;box-sizing: border-box;}


/************************************************ Responsive Styles ************************************************/

@media screen and (max-width: 1280px){
    .trencher {display:none;}
}

@media screen and (max-width: 1024px){
    .twocols {max-width:100%;float:none;}
    .maps {width:100%;}
    .grid figure {max-width:33%;}
    figure.effect h2 {font-size:1.4em;}
	
	header {display: flex; justify-content: space-between; height: 100px; width: 100%;}
	header a.logo-link {width: 40%; max-width: 345px; margin-top:10px;}
	.logo {max-width: 90%;}
	
	#search-head {margin-right: 0px!important;width: 35%!important;}
	form.search {
		margin-top: 27px!important;
	}

}

@media screen and (max-width: 800px){
	header a.logo-link {width: 35%;}
	.logo {max-width: 100%;}
}

@media screen and (max-width: 767px){
    .grid figure {max-width:50%;}

}

@media screen and (max-width: 600px){
	input.searchTerm {
		font-size: 11px!important;
	}
}
 
@media screen and (max-width: 500px){
    .grid figure {max-width:100%;}
	#menu-button a.menu-toggle span {display:none;}
	
	#menu-button {width: 10%!important;}
	header a.logo-link {width: 45%;}
	#search-head { width: 40%!important;}

}

@media screen and (max-width: 400px){
	input.searchTerm {
		font-size: 9px!important;
	}
}
