﻿/***** BEGIN RESET *****/
@import url("https://use.typekit.net/zry0wkx.css");
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 --------*/
:root {
  --yellow: #FFCA00;
  --dark-blue: #1A2836;
  --grey: #F9F9F9;
}

/***** 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;
}

h1, h2, h3 {
	font-family: 'ddt', sans-serif;
}

#home p, #thankyou p, #contact p, footer p, header a, .inventory-hero p  {
	font-family: 'golos-text', sans-serif;
	font-size: 17px; 
	line-height: 35px;
	color: var(--dark-blue);
}

/*-------- BODY STYLES --------*/

body {

}

a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none;}


hr{border:#000 1px solid;}

/*--- HERO STYLES ---------------------*/
.home-hero {background-color: var(--dark-blue); position: relative;}
.home-hero .video-height {height: 900px; max-width:2300px; overflow: hidden;}
.home-hero iframe {width: 2300px; overflow: hidden; height: 120%; transform: translateX(-200px); object-fit: cover;opacity: .8; pointer-events: none;}

.home-hero .blue-box {position: absolute; left: 0; bottom: -50px; background: rgba(26,40,54,.75); max-width: 650px; border-radius: 0 50px 50px 0; padding: 60px;}
.home-hero .blue-box .heading-lg {max-width: 1000px;}

.inner-hero {
	background: url("/siteart/equipment-inventory.jpg") no-repeat;
	background-size: cover;
	background-position: 50% 40%;
	height: 440px;
}

#contact .inner-hero {
	background: url("/siteart/contact-hero.jpg") no-repeat;
	background-size: cover;
	background-position: 50% 74%;
	height: 440px;
}

.parts-hero {
	background: url("/siteart/parts-inventory.jpg") no-repeat;
	background-size: cover;
	background-position: 50% 50%;
	height: 440px;
}

.attachments-hero {
	background: url("/siteart/attachments-inventory.jpg") no-repeat;
	background-size: cover;
	background-position: 50% 50%;
	height: 440px;
}

.link-to-home {align-items: center; flex-wrap: wrap; gap: 30px; margin-top: 15px; padding-top: 30px!important;}
.link-to-home a {color: var(--dark-blue); font-weight: 700; transition: all .4s ease-out; font-family: 'golos-text', sans-serif; font-size: 20px;}
.link-to-home a:hover {color: var(--yellow);}
.link-to-home hr {margin: 0; border: #1A2836 solid 1px; height: 30px;}

/*---BODY--------------------------------*/
/*---center-section---*/
.center-section {max-width: 980px!important; text-align: center; padding-top: 180px!important; padding-bottom: 130px!important;}
.center-section .btn-top {text-align: center; margin: 60px auto 0;}

/*---col-4---*/
.col-4 {padding-top: 100px; padding-bottom: 150px; background: var(--grey);}
.col-4 .wrapper > div:first-child {justify-content: space-between; align-items: flex-end; margin-bottom: 50px; gap: 20px; flex-wrap: wrap;}
.col-4 .btn-top {margin-top: 0px!important; margin-bottom: 30px;}
.inv-link {gap: 20px; justify-content: center;}
.inv-link .img-height {max-width: 442px; height: 340px; width: 100%; position: relative; margin-bottom: 50px;}
.inv-link .img-height img {width: 100%; height: 100%; object-fit: cover; border-radius: 30px;}
.inv-link .link-box {position: absolute; left: 0; right: 0; bottom: -50px;text-align: center; background: var(--dark-blue); border-radius: 30px; padding: 25px 15px; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25); transition: all .4s ease-out;}
.inv-link .link-box .heading-md {margin-bottom: 15px; color: #fff; transition: all .4s ease-out;}
.inv-link .link-box p {color: #fff!important;transition: all .4s ease-out;}
.inv-link .link-box p i {margin-left: 15px;}

.inv-link .link-box:hover {background: var(--yellow);}
.inv-link .link-box:hover p, .inv-link .link-box:hover .heading-md {color: var(--dark-blue)!important;}

.inv-link > div:first-child .link-box {background: var(--yellow)!important;}
.inv-link > div:first-child .heading-md, .inv-link > div:first-child p {color: var(--dark-blue)!important;}
.inv-link > div:first-child .link-box:hover {background: var(--dark-blue)!important;}
.inv-link > div:first-child .link-box:hover .heading-md, .inv-link > div:first-child .link-box:hover p {color: #fff!important;}

/*---map-background---*/
.map-background {position: relative;}
.map-background .img-height {height: 856px; width: 100%;}
.map-background .blue-box {background: var(--dark-blue); max-width: 600px; width: 100%; padding: 80px 100px; position: absolute; right: 0; bottom: 80px; z-index: 2; border-radius: 50px 0 0 50px;}
.map-background .blue-box .heading-mdlg {color: #fff!important; margin-bottom: 50px;}
.map-background .blue-box ul li {margin-bottom: 40px;}
.map-background .blue-box ul li a {font-family: 'golos-text', sans-serif; color: #fff; font-size: 17px;transition: all .4s ease-out;}
.map-background .blue-box ul li a i {margin-right: 15px;}
.map-background .blue-box ul li a:hover {color: var(--yellow);}

/*--------PAGE STYLES--------------------*/

/*---parts inventory banner---*/

.parts-inv-banner {
	width: 100%;
	text-align: center;
	background-color: #1A2836;
	color: #fff;
	font-size: 32px;
	font-family: 'ddt', sans-serif;
	line-height: 50px;
	padding: 35px 0px;
	margin: 30px 0px;
}
.inv-banner-span {
	text-decoration: underline;
}

/*---thankyou---*/

#thankyou .center-section {padding-top: 100px!important;}

/*---contact---*/
.col-4-inner {padding-top: 100px; padding-bottom: 100px; background: var(--grey);}
.col-4-inner .flex {gap: 20px; justify-content: center;}
.col-4-inner .flex > div {max-width: 442px; padding: 80px 15px; width: 100%; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25); background: var(--dark-blue); border-radius: 30px;}
.col-4-inner .flex > div .heading-md {margin-bottom: 40px;}
.col-4-inner .flex > div li {margin-bottom: 20px;}
.col-4-inner .flex > div .heading-md, .col-4-inner .flex > div a, .col-4-inner .flex > div li {color: #fff; text-align: center;}
.col-4-inner .flex > div a {font-size: 17px;font-family: 'golos-text', sans-serif;}
.col-4-inner .flex > div a:hover {text-decoration: underline;}
.col-4-inner .flex > div:first-child {background: var(--yellow);}
.col-4-inner .flex > div:first-child .heading-md, .col-4-inner .flex > div:first-child a {color: var(--dark-blue);}

.map-contact {height: 400px; width: 100%;}

/*--------FORM STYLES--------------------*/
.form-all .heading-mdlg {margin-bottom: 10px;}
.form-all p {max-width: 700px; margin: 15px auto 40px;}

.form-bg {background: #fff; padding-top: 50px;}
.form-all {
	box-sizing: border-box;
	max-width: 1200px!important; 
	width: 100%;
	margin: 0 auto!important;
	text-align: center;
	padding-bottom: 200px!important;
}

 .label {
	font-family: 'Exo', sans-serif;
	text-align: left!important;
	font-weight: 500;
	font-size: 17px;
	color: var(--dark-blue);
}

.label-row {margin-bottom: 15px;color: #050727;}
.flex-form {width: 100%;max-width: 1205px;padding: 15px;margin: 52px auto;}
.flex-row {display: flex;width: 100%;}

.form-half {
	display: inline-block;
	width: calc(50% - 8px);
	margin: 15px 15px 15px 0;
}

.form-half input {
	padding: 15px;
	width: 100%;
	border: none;
	font-family: 'golos-text', sans-serif;
	box-sizing: border-box;
	background: var(--grey);
	font-size: 17px;
	color: var(--dark-blue);
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}

.form-2nd-row {margin-right: 0;}

.form-full textarea {
	width: 100%;
	padding: 15px;
	border: none;
	box-sizing: border-box;
	margin-bottom: -8px;
	font-family: 'golos-text', sans-serif;
	background:  var(--grey);
	font-size: 17px;
	color: var(--dark-blue);
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}

.form-full {margin: 15px 0 30px 0;}

/*--------Captcha--------------------*/

.include-captcha{display:none;}
#submit-btn {float: right;}
.CaptchaWhatsThisPanel > a:hover {text-decoration: underline;}
.CaptchaWhatsThisPanel > a, .CaptchaMessagePanel {color: var(--dark-blue);font-family: 'golos-text', sans-serif;}
.CaptchaPanel {text-align: right!important;}
.captcha-button {float: right;}





/*-------- FOOTER STYLES ----------------*/
.my-site-footer{background: var(--dark-blue);}
.my-site-footer .footer-logo .img-height img {max-width: 400px;width: 100%;}
.my-site-footer .wrapper {padding-top:80px!important;}
.my-site-footer .wrapper > div:first-child {padding-bottom: 100px; justify-content: space-between; gap: 30px;}
.my-site-footer .links > .flex {gap: 160px;}
.my-site-footer .links > .flex .flex {gap: 100px;}

.my-site-footer .links a {font-family: 'golos-text', sans-serif; color: #fff; font-size: 17px;transition: all .4s ease-out;}
.my-site-footer .links a:hover {color: var(--yellow);}
.my-site-footer .links li {margin-bottom: 30px;}
.my-site-footer .links a i {margin-right: 15px;}
.my-site-footer .heading-footer {font-family: 'ddt', sans-serif!important; color: #fff!important; font-size: 20px!important; margin-bottom: 50px; font-weight: 700;}


.my-site-footer .social-links {padding-top: 30px; padding-bottom: 30px; border-top: solid #fff 1px; justify-content: flex-end; gap: 25px;}
.my-site-footer .social-links a {color: #fff; font-size: 17px; transition: all .4s ease-out;}
.my-site-footer .social-links a:hover {color: var(--yellow);}

/*-------- UNIVERSAL STYLES ----------------*/
.wrapper {
	padding: 0 15px; 
	margin: 0 auto;
	max-width: 1830px;
}

.flex {display: flex;}
.btn-top {margin-top: 60px;}

/*---Headings---*/
.heading-lg {font-size: 58px; font-weight: 700; color: #fff;}
.heading-mdlg {font-size: 50px; font-weight: 700; color: var(--dark-blue); margin-bottom: 20px;}
.heading-md {font-size: 30px; font-weight: 700;}

.h2-span {font-weight: 400!important; font-size: 30px;}

/*---Buttons---*/

.btn-yellow-light, .btn-yellow-dark {
	display: inline-block;
    border: none;
    border-radius: 10px;
    width: 230px;
    color: var(--dark-blue);
    background: var(--yellow);
    padding: 20px 0;
    text-align: center;
    font-weight: 700;
    font-size: 17px;
    transition: all .4s ease-out;
    font-family: 'ddt', sans-serif;
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}

.btn-yellow-light:hover {background: #fff;}
.btn-yellow-dark:hover {background: var(--dark-blue); color: #fff;}


/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/

.container {margin-top: 20px!important;}

.list-top-section .list-listings-count, .list-content .price-container .price, .parts-list-content .parts-title-and-breadcrumbs .parts-listings-count, .detail__machine-location a, .calc-button span, .dealer-contact__details_right-col a, .dealer-contact__details_right-col span, .detail__search-results, .dealer-contact__phone-number a {color: #054F99!important;}

.view-listing-details-link, .faceted-search-content .selected-facets-container .selected-facet, .list-content .list-error-container .info button:not(.login-button), .section-title a {background: var(--yellow)!important; color: var(--dark-blue)!important; transition: all .4s ease-out;}
.view-listing-details-link:hover, .list-content .list-error-container .info button:not(.login-button):hover, .detail__cta-buttons button:hover, .collapsible-contact-wrapper button:hover, .detail-contact-bar button:hover {background: var(--dark-blue)!important; color: #fff!important;}



/*---------- RESPONSIVE STYLES ----------*/
@media only screen and (max-width: 1700px) {
	.home-hero .blue-box {padding: 60px 60px 60px 15px;}
}

@media only screen and (max-width: 1345px) {
	.col-4-inner .flex {flex-wrap: wrap;}
}

@media only screen and (max-width: 1300px) {
	.my-site-footer .links > .flex {gap: 50px;}
	.my-site-footer .links > .flex .flex {gap: 38px;}
}
@media only screen and (max-width: 1200px) {
	.parts-inv-banner {font-size: 24px; line-height: 40px; padding-left: 20px; padding-right: 20px;}
}
@media only screen and (max-width: 1160px) {
	.inv-link {flex-wrap: wrap;}
}

@media only screen and (max-width: 1065px) {
	.home-hero .blue-box {padding: 60px 50px 60px 15px;}
	.my-site-footer .wrapper > div:first-child {flex-direction: column; gap: 60px;}
	.my-site-footer .links > .flex {gap: 60px;}
}

@media only screen and (max-width: 1000px) {
	.inv-link .img-height {max-width: 100%; height: 250px;}
	.col-4-inner .flex > div {max-width: 100%; padding: 50px 15px 35px;}
}

@media only screen and (max-width: 830px) {
	.map-background .blue-box {width: auto;}
}

@media only screen and (max-width: 730px) {
	.heading-lg {font-size: 45px;}
	.heading-mdlg {font-size: 40px; }
	.heading-md {font-size: 30px; }
	.h2-span {font-size: 20px;}
	.map-background .blue-box {padding: 60px;}
	
	.home-hero .blue-box {padding: 40px 15px 40px 15px;}
	.home-hero .video-height {height: 630px;}
	.home-hero iframe {transform: translateX(-900px);}
	
}

@media only screen and (max-width: 680px) {
	#contact .inner-hero {background-position: 10% 74%;}
}

@media only screen and (max-width: 605px) {
	.center-section {padding-top: 110px!important; padding-bottom: 80px!important;}
	#thankyou .center-section {padding-top: 80px!important;}
	.col-4 {padding-top: 80px; padding-bottom: 110px;}
	.map-background .img-height {height: 250px;}
	.form-all {padding-bottom: 150px!important;}
	.col-4-inner {padding-top: 80px; padding-bottom: 80px;}
	
	.map-background {display: flex; flex-direction: column-reverse;}
	.map-background .blue-box {bottom: 0px; position: relative; border-radius: 0;}
	.my-site-footer .links > .flex {flex-direction: column;}
	
	.inner-hero {background-position: 10% 40%;}
	.parts-hero {background-position: 10% 50%;}
	.attachments-hero {background-position: 20% 50%;}
}

@media only screen and (max-width: 550px) {
	.home-hero .btn-top {margin-top: 40px;}
	.flex-row {flex-direction: column;}
	.flex-row .form-half {width: 100%; padding: 15px 0 0;}
}

@media only screen and (max-width: 500px) {
	.map-background .blue-box {padding: 60px 15px;}
	.map-background .blue-box .heading-mdlg, .map-background .blue-box ul li, .map-background .blue-box .btn-top {text-align: center;}
	.map-background .blue-box .btn-top {margin: 60px auto 0;}
	.my-site-footer .wrapper > div:first-child {padding-bottom: 80px;}
	.map-contact {height: 250px;}
	.parts-inv-banner {font-size: 20px; line-height: 36px;}
}

@media only screen and (max-width: 380px) {
	.heading-lg {font-size: 40px;}
	.heading-mdlg {font-size: 35px;}
	.heading-md {font-size: 25px;}
	.parts-inv-banner {font-size: 16px; line-height: 24px;}
}

@media only screen and (max-width: 370px) {
	.my-site-footer .links > .flex .flex {gap: 0px; flex-direction: column;}
	.col-4-inner .flex > div a {font-size: 17px;}
}