/***** 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 --------*/
a:link, a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none; cursor: pointer !important;}
button:hover {cursor: pointer !important;}
hr{border:#000 1px solid;}
html {font-family: "Barlow", sans-serif;}
/*--- HEADER STYLES ---------------------*/
header {background: #171C1A; width: 100%; position: fixed; z-index: 500;}
.header-wrap {display: flex; justify-content: space-between; align-items: center;}
.header-hours {display: flex; gap: 8px; align-items: center; padding-left: 50px;}
.header-hours i {color: #fff;}
.header-hours p {font-family: "Barlow", sans-serif; font-weight: 600; font-size: 16px; line-height: 26px; color: #fff;}
.header-hours p span {font-weight: 400;}
.header-search form {background: rgba(249,248,245,0.10) !important; padding: 15px 50px !important; display: flex !important; align-items: center !important;}
.header-search input {background: none !important; border: none !important; font-family: "Barlow", sans-serif !important; font-weight: 400 !important; font-size: 16px !important; line-height: 26px !important; color: #fff !important; padding: 0px !important;}
.header-search input::placeholder {color: #fff !important;}
.header-search button {background: none !important; border: none !important; color: #fff !important; font-size: 17px !important; padding: 0px !important;}
.nav-bkgrd {background: rgba(247,247,247,0.95); width: 100%; position: fixed; z-index: 500; margin-top: 56px;}
.nav-wrap {width: 95%; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; padding: 15px 0;}
.nav-btn a {width: 205px; display: block; display: flex; justify-content: flex-end;}
.nav-btn button {width: 195px; border-radius: 50px; display: flex; justify-content: space-between; align-items: center; padding: 10px 8px 10px 20px; border: none; font-family: "Barlow", sans-serif; font-size: 18px; line-height: 28px; color: #fff; font-weight: 500; background: #930021; background: linear-gradient(90deg, rgba(147, 0, 33, 1) 0%, rgba(172, 1, 38, 1) 100%);}
.nav-btn button i {font-size: 30px; line-height: 30px;}
.nav-btn button:hover {width: 205px; transition:.8s;}
/*---BODY--------------------------------*/
/*---DEFAULT---*/
.hero-bkgrd {background: url("/siteart/hero.jpg") no-repeat; background-position: center; background-size: cover;}
.hero-overlay {background: #171C1A; background: linear-gradient(90deg, rgba(23, 28, 26, 0.6) 0%, rgba(23, 28, 26, 0.4) 100%);}
.hero-style {}
.hero-wrap {width: 95%; margin: 0 auto; padding: 370px 0 100px 0;}
.hero-content {width: 600px;}
.hero-content h1 {font-family: "Barlow Condensed", sans-serif; font-weight: 700; font-size: 75px; line-height: 75px; text-transform: uppercase; color: #fff;}
.hero-content p {font-family: "Barlow", sans-serif; font-weight: 400; font-size: 18px; line-height: 28px; color: #fff; margin: 25px 0 35px 0;}
.hero-content button {width: 255px; border-radius: 50px; display: flex; justify-content: space-between; align-items: center; padding: 10px 8px 10px 20px; border: none; font-family: "Barlow", sans-serif; font-size: 18px; line-height: 28px; color: #fff; font-weight: 500; background: #171C1A;}
.hero-content button i {font-size: 30px; line-height: 30px;}
.hero-content button:hover {width: 265px; transition: .8s;}
.social-wrap {
position: fixed; /* or absolute */
right: 0px;
top: 65%;
transform: translateY(-50%);
width: auto;
display: inline-block;
z-index: 100;
}
.social-wrap a {
display: flex;
align-items: center;
justify-content: center;
width: 50px;
height: 50px;
font-size: 22px;
background: #1877f2;
color: #fff;
border-radius: 5px 0 0 5px;
text-decoration: none;
}
.cat-wrap {width: 95%; margin: 0 auto; padding: 100px 0;}
.cat-wrap h2 {font-family: "Barlow Condensed", sans-serif; color: #171C1A; font-weight: 700; font-size: 55px; line-height: 55px; text-transform: uppercase;}
.cat-reel {margin-top: 35px;}
.cat-reel .slick-track {display: flex; gap: 15px;}
.cat-wrap .cat-reel img {width: 100%; border-radius: 5px; margin-bottom: 25px;}
.cat-wrap .cat-reel h3 {font-family: "Barlow Condensed", sans-serif; color: #171C1A; font-weight: 700; font-size: 30px; line-height: 30px; text-transform: uppercase;}
.cat-wrap .cat-reel p {font-family: "Barlow", sans-serif; color: #171C1A; font-weight: 400; font-size: 16px; line-height: 26px; margin: 10px 0 12px 0;}
.cat-wrap .cat-reel a {font-family: "Barlow", sans-serif; color: #930021; font-weight: 500; font-size: 16px; line-height: 26px; display: flex; gap: 10px; align-items: center;}
.cat-wrap .cat-reel a:hover {gap: 15px; transition: .8s;}
.cat-wrap > a {display: flex; justify-content: center; margin-top: 45px;}
.cat-wrap > a button {width: 195px; border-radius: 50px; display: flex; justify-content: center; align-items: center; padding: 10px 0 12px 0; border: none; font-family: "Barlow", sans-serif; font-size: 18px; line-height: 28px; color: #fff; font-weight: 500; background: #930021; background: linear-gradient(90deg, rgba(147, 0, 33, 1) 0%, rgba(172, 1, 38, 1) 100%);}
.contact-bkgrd {background: #171C1A;}
.contact-wrap {width: 95%; margin: 0 auto; padding: 100px 0; display: flex; justify-content: space-between; gap: 100px;}
.contact-wrap > div:first-child {width: 40%;}
.contact-wrap > div:last-child {width: 60%;}
.contact-wrap h2 {font-family: "Barlow Condensed", sans-serif; color: #fff; font-weight: 700; font-size: 55px; line-height: 55px; text-transform: uppercase;}
.contact-links {margin-top: 35px;}
.contact-links li {margin-bottom: 12px;}
.contact-links a {font-family: "Barlow", sans-serif; font-weight: 400; font-size: 18px; line-height: 28px; color: #fff; display: flex; gap: 10px; align-items: center;}
.contact-links i {width: 29px; height: 29px; border-radius: 50px; display: flex; justify-content: center; align-items: center; color: #fff; font-size: 13px; line-height: 13px; border: 1px #fff solid;}
.contact-hours {margin-top: 35px; background: rgba(249,248,245,0.10); border-radius: 5px; padding: 30px;}
.contact-hours h3 {font-family: "Barlow", sans-serif; font-weight: 600; font-size: 25px; line-height: 25px; color: #fff; display: flex; gap: 10px; align-items: center;}
.contact-hours ul {margin-top: 25px;}
.contact-hours li {display: flex; justify-content: space-between; padding: 10px 15px;}
.contact-hours p {font-family: "Barlow", sans-serif; font-weight: 400; font-size: 18px; line-height: 28px; color: #fff;}
.contact-hours ul > li:nth-child(2) {background: #414342; border-radius: 3px;}
/*---OUR BRANDS---*/
.sub-breadcrumbs {display: flex; align-items: center; gap: 5px; margin-bottom: 8px;}
.sub-breadcrumbs a, .sub-breadcrumbs p {color: #fff; font-family: "Barlow", sans-serif; font-size: 18px; line-height: 28px; margin: 0px; font-weight: bold;}
.sub-breadcrumbs i {color: #fff;}
.sub-hero-wrap {width: 95%; margin: 0 auto; padding: 370px 0 60px 0;}
.sub-hero-overlay {background: #171C1A; background: linear-gradient(90deg, rgba(23, 28, 26, 1) 0%, rgba(23, 28, 26, 1) 100%);}
.cat-bkgrd {background: #F7F7F7;}
.brand-flex {display: flex; gap: 10px; flex-wrap: wrap; padding-top: 50px;}
.brand-flex a {width: 19%; border-radius: 5px;}
.brand-flex div {background: #fff; border-radius: 5px; padding: 10px 30px;}
.brand-flex img {width: 100%;}
.brand-flex a img {transition: transform 0.8s ease;}
.brand-flex a:hover img {transform: scale(1.04);}
/*---SERVICES---*/
.service-form p, .parts-wrap p {font-family: "Barlow", sans-serif; font-weight: 400; font-size: 18px; line-height: 28px; color: #171C1A; margin: 10px 0 25px 0;}
.service-wrap {background: #fff; border-radius: 5px; padding: 80px 50px;}
.service-form .form-flex label {color: #171C1A;}
.service-form .form-flex input, .service-form .form-flex textarea {border: 1px #bbb solid;}
.service-form h3 {font-family: "Barlow Condensed", sans-serif; font-weight: 700; font-size: 30px; line-height: 30px; color: #171C1A; text-transform: uppercase; margin: 30px 0 15px 0;}
/*---CONTACT US---*/
.contact-flex {display: flex; gap: 100px;}
.contact-flex > div:first-child {width: 40%;}
.contact-flex > div:last-child {width: 60%;}
.contact-col > div {background: #fff; border-radius: 5px; padding: 30px; margin-bottom: 15px;}
.contact-col > div a {display: flex; align-items: center; gap: 15px;}
.contact-col p {margin: 0px; font-size: 16px;}
.contact-col i {background: #930021; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; border-radius: 3px; color: #fff; font-size: 20px;}
.contact-col p span {font-family: "Barlow Condensed", sans-serif; font-weight: 700; text-transform: uppercase; font-size: 22px;}
/*--------FORM STYLES--------------------*/
.form-flex > div {display: flex; gap: 10px; margin-bottom: 15px;}
.form-flex > div > div {display: flex; flex-wrap: wrap; width: 100%; gap: 5px;}
.form-flex label {width: 100%; font-family: "Barlow", sans-serif; font-weight: 500; font-size: 18px; line-height: 28px; color: #fff;}
.form-flex input {width: 100%; background: rgba(249,248,245,0.10); border-radius: 3px; border: none; padding: 10px 0 10px 15px; font-size: 18px; line-height: 28px; color: #757876; font-family: "Barlow", sans-serif;}
.form-flex input::placeholder, .form-flex textarea::placeholder {color: #757876;}
.form-flex textarea {width: 100%; background: rgba(249,248,245,0.10); border-radius: 3px; border: none; padding: 10px 0 0 15px; font-size: 18px; line-height: 28px; color: #757876; height: 175px; font-family: "Barlow", sans-serif;}
.form-comment {flex-wrap: wrap; gap: 5px !important;}
.form-flex button {width: 160px; border-radius: 50px; display: flex; justify-content: center; align-items: center; padding: 10px 0 12px 0; border: none; font-family: "Barlow", sans-serif; font-size: 18px; line-height: 28px; color: #fff; font-weight: 500; background: #930021; background: linear-gradient(90deg, rgba(147, 0, 33, 1) 0%, rgba(172, 1, 38, 1) 100%); margin-top: 20px;}
/*-------- FOOTER STYLES ----------------*/
footer {background: #171C1A;}
.footer-wrap {width: 95%; margin: 0 auto; padding: 80px 0 100px 0; display: flex; justify-content: space-between;}
.footer-wrap p {font-family: "Barlow", sans-serif; font-weight: 600; font-size: 20px; line-height: 30px; color: #fff; margin-bottom: 15px;}
.footer-wrap li {margin-bottom: 5px;}
.footer-wrap a, .footer-wrap li {font-family: "Barlow", sans-serif; font-weight: 400; font-size: 16px; line-height: 26px; color: #fff; display: flex; gap: 10px; align-items: center;}
.footer-wrap i {width: 29px; height: 29px; border-radius: 50px; display: flex; justify-content: center; align-items: center; color: #fff; font-size: 13px; line-height: 13px; border: 1px #fff solid;}
.footer-wrap > div:first-child li {margin-bottom: 12px;}
.footer-wrap > div > div {display: flex; gap: 100px;}
/*----INVENTORY STYLES - KEEP AT BOTTOM OF CSS----*/
.sub-header {padding-bottom: 223px;}
.list-redesign, .detail-wrapper, .parts-list-content {padding: 50px 0 !important;}
.list-redesign, .faceted-search-content .faceted-section-head .faceted-section-title, .faceted-search-content .faceted-section-box .faceted-search, .faceted-search-content .faceted-section-box .faceted-btn-container .faceted-show-all-btn, .list-content .listing-portion-title a, .list-redesign .list-container-flexrow .list-listing-card-wrapper .listing-card-grid .list-listing-title .listing-category, .options-popper-div .options-popper-btn, .list-redesign .widget-container .listing-widgets a, .list-redesign .specs-container .spec-label, .list-content .spec-value, .form-main-content .form-el label, .form-main-content .form-el label+input:not(input[class^=Mui]), .form-main-content .form-el label+select, .form-main-content .form-el label+textarea, .form-main-content .form-el .iti--postal-code input[type=text], .ts-modal-container .form-bottom .spacer, .ts-modal-container .form-bottom .captcha-and-submit .captcha-placeholder button, .ts-modal-container .form-bottom .captcha-and-submit .captcha-placeholder input, .breadcrumbs__link, .detail__search-results-text, .detail__media-buttons button, .detail__media-buttons a, .calc-button__text, .detail__details .payments-as-low-as-link a, .detail__cta-buttons button, .detail__machine-location-label-text, .detail__machine-location a, .dealer-contact__header h2, .dealer-contact__branch-name p, .dealer-contact__location p, .dealer-contact__name p, .dealer-contact__phone p, .dealer-contact__phone a, .dealer-contact__details_right-col button, .mc-thumb-toggles .mc-btn span:last-of-type, .detail-wrapper, .listing-widgets-detail a, .listing-carousel .recommended-listings-section .view-all-link, .listing-carousel .recommended-auctions-section .view-all-link, .parts-list-content, .faceted-search-content .selected-facets-container .selected-header .filter-clear-all, .faceted-search-content .selected-facets-container .selected-facet {font-family: "Barlow", sans-serif !important;}
.list-top-section .list-title .list-title-text, .ts-modal-header h2, .detail__title, .listing-prices__retail-price, .listing-prices__discount-formatted-price, .listing-prices__alternate-retail-price, .listing-prices__exclusive-wholesale-price, .parts-list-content .parts-title-and-breadcrumbs .parts-title-text {font-family: "Barlow Condensed", sans-serif !important; text-transform: uppercase !important;}
.list-top-section .list-listings-count, .listing-prices__retail-price, .listing-prices__discount-formatted-price, .listing-prices__alternate-retail-price, .listing-prices__exclusive-wholesale-price, .parts-list-content .parts-title-and-breadcrumbs .parts-listings-count, .parts-list-content .error-message {color: #930021 !important;}
.faceted-search-content .faceted-section-box .faceted-search, .faceted-search-content .faceted-section-box .faceted-btn-container .faceted-show-all-btn, .detail__cta-buttons button {background: #171C1A !important;}
.list-container-flexrow .view-listing-details-link, .list-container-flexrow .dealer-phone-call, .list-container-flexrow .dealer-phone-text, .ts-modal-container .form-bottom .captcha-and-submit .captcha-placeholder button, .ts-modal-container .form-bottom .captcha-and-submit .captcha-placeholder input, .linking-buttons a.active, .listing-carousel .recommended-listings-section .view-all-link, .listing-carousel .recommended-auctions-section .view-all-link, .faceted-search-content .selected-facets-container .selected-facet {background: #930021 !important; background: linear-gradient(90deg, rgba(147, 0, 33, 1) 0%, rgba(172, 1, 38, 1) 100%) !important;}
.ts-disclaimer span {font-size: 15px !important; line-height: 25px !important;}
/*---------- RESPONSIVE STYLES ----------*/
@media only screen and (max-width: 1400px) {
.nav-wrap img {width: 248px;}
}
@media only screen and (max-width: 1300px) {
.contact-flex {gap: 80px;}
.contact-wrap {gap: 80px;}
}
@media only screen and (max-width: 1250px) {
.nav-wrap img {width: 218px;}
.nav-btn button {font-size: 16px; line-height: 26px; width: 175px;}
.nav-btn button i {font-size: 25px; line-height: 25px;}
.nav-btn a, .nav-btn button:hover {width: 185px;}
.contact-flex > div:first-child, .contact-wrap > div:first-child {width: 45%;}
.contact-flex > div:last-child, .contact-wrap > div:last-child {width: 55%;}
.brand-flex a {width: 24%;}
}
@media only screen and (max-width: 1200px) {
.header-hours {padding-left: 30px;}
.header-search form {padding: 15px 30px !important;}
}
@media only screen and (max-width: 1100px) {
.nav-btn {display: none;}
.contact-wrap, .contact-flex {flex-wrap: wrap;}
.contact-wrap > div:last-child, .contact-wrap > div:first-child, .contact-flex > div:first-child, .contact-flex > div:last-child {width: 100%;}
}
@media only screen and (max-width: 1000px) {
.footer-wrap {flex-wrap: wrap;}
.footer-wrap > div {width: 50%;}
}
@media only screen and (max-width: 900px) {
.brand-flex a {width: 32%;}
}
@media only screen and (max-width: 800px) {
.header-hours {display: none;}
.header-search {width: 100%; background: rgba(249,248,245,0.10);}
.header-search form {justify-content: space-between; padding: 15px 0 !important; width: 95%; margin: 0 auto; background: none !important;}
.footer-wrap {gap: 50px;}
.footer-wrap > div {width: 100%;}
}
@media only screen and (max-width: 650px) {
.hero-content {width: 100%;}
.hero-wrap {padding: 340px 0 100px 0;}
.sub-hero-wrap {padding: 340px 0 60px 0;}
.service-wrap {padding: 80px 40px;}
}
@media only screen and (max-width: 600px) {
.brand-flex a {width: 49%;}
}
@media only screen and (max-width: 550px) {
.brand-flex a {width: 48.5%;}
}
@media only screen and (max-width: 500px) {
.hero-content h1 {font-size: 65px; line-height: 65px;}
.hero-wrap {padding: 310px 0 90px 0;}
.sub-hero-wrap {padding: 310px 0 50px 0;}
.service-wrap {padding: 80px 30px;}
.cat-wrap h2, .contact-wrap h2 {font-size: 45px; line-height: 45px;}
}
@media only screen and (max-width: 450px) {
.form-flex > div {flex-wrap: wrap; gap: 15px;}
.contact-hours {padding: 30px 20px;}
.cat-wrap, .contact-wrap {padding: 80px 0;}
}
@media only screen and (max-width: 400px) {
.hero-content h1 {font-size: 55px; line-height: 55px;}
.hero-wrap {padding: 280px 0 80px 0;}
.hero-content p, .hero-content button, .service-form p, .parts-wrap p, .form-flex label, .form-flex input, .form-flex textarea, .contact-hours p, .contact-links a {font-size: 17px; line-height: 27px;}
.contact-hours {padding: 30px 10px;}
.footer-wrap > div > div {justify-content: space-between; gap: 10px;}
.sub-hero-wrap {padding: 280px 0 40px 0;}
.service-wrap {padding: 80px 20px;}
.contact-col > div {padding: 30px 20px;}
.contact-col > div a {flex-wrap: wrap;}
.contact-col > div a div {width: 100%;}
.cat-wrap h2, .contact-wrap h2 {font-size: 40px; line-height: 40px;}
}
@media only screen and (max-width: 380px) {
.brand-flex a {width: 100%;}
}
@media only screen and (max-width: 300px) {
.hero-content h1 {font-size: 45px; line-height: 45px;}
.hero-wrap {padding: 250px 0 70px 0;}
.hero-content p, .hero-content button, .service-form p, .parts-wrap p, .form-flex label, .form-flex input, .form-flex textarea, .contact-hours p, .contact-links a {font-size: 16px; line-height: 26px;}
.sub-hero-wrap {padding: 250px 0 30px 0;}
.cat-wrap h2, .contact-wrap h2 {font-size: 35px; line-height: 35px;}
}