﻿/***** 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 {
	
	border: 0;
	margin: 0;
	padding: 0;
    font-family: 'Fira Sans', sans-serif;
}

ol{
	list-style: none;
}

table{border-collapse:collapse; width:100%;}
td{vertical-align:top;}

/***** SITE COLORS 

Yellow: #ffc427I t
Black: #000
Gray: #2a2a2a

*****/


/***** END RESET *****/

/* Clearfix */
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}

body {-webkit-text-size-adjust:none;color:#fff;}
h1, h2, h3, h4 {font-family: 'Fira Sans', sans-serif;font-weight:700;line-height:normal;}
h1 {font-size:3em;text-align:center;color:#fff;padding:5% 0px;text-shadow: 2px 2px 4px #000000;}
strong {font-weight:700;}
p {font-weight:300;font-size:17px;line-height:26px;}

a:link, a:visited, a:active {text-decoration:underline;}

.wrapper {max-width:70%;width:100%;height:auto;margin:0 auto;padding:30px 10px;box-sizing:border-box;}

.search-bar {min-width: 220px;display: flex;background: #e3e1e1;padding: 5px;box-sizing: border-box; margin-top: 5px;}
.search-bar input {width:100%;box-sizing: border-box;line-height: 2;padding-inline: 5px;border: none !important;background: #e3e1e1 !important;outline: none !important;font-family: "Fira Sans", sans-serif !important;}
.search-bar button {border: none;background: #e3e1e1;cursor:pointer;padding: 5px;}

.faceted-search-content .faceted-section-box {
	background-color: #882b2b !important;
}
.cta-wrapper {
    max-width: 90%;
    width: 100%;
    height: auto;
    margin: 0 auto;
    padding: 30px 10px 60px 10px;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    gap:20px 0;
    
}
.cta-wrapper h1 {
    width:100%;
}
.cta-wrapper a {
    width:32%;
    box-sizing: border-box;
    position: relative;
    border:3px solid #fff;
    display: block;
    height: 12vw;
    max-height: 350px;
}
.cta-wrapper a img { 
    width:100%;
    height: 100%;
    object-position: center;
    object-fit: cover;
    display: block;
    margin:0 auto;
    transition: .2s ease-in;
}
.cta-wrapper a h2 { 
    position:absolute;
    left:0;
    top:0;
    height: 100%;
    width: 100%;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    color:#fff;
    font-family: 'Fira Sans', sans-serif;
    font-weight: 600;
    text-align: center;
    transition: .2s ease-in;
    font-size: 30px;
    text-shadow: 0 0 20px rgba(0,0,0,1);
    background:rgba(0,0,0,0.75);
}
.cta-wrapper a:hover h2 {
    background:rgba(136,43,43,0.78);
}
.cta-wrapper a:hover img {
    filter: grayscale(1);
}


header {
    width: 100%;
    background-image: -webkit-linear-gradient(270deg,rgba(255,255,255,0.50) 0%,rgba(255,255,255,0.50) 100%), url(../siteart/header-bg-1.jpg);
    background-image: -moz-linear-gradient(270deg,rgba(255,255,255,0.50) 0%,rgba(255,255,255,0.50) 100%), url(../siteart/header-bg-1.jpg);
    background-image: -o-linear-gradient(270deg,rgba(255,255,255,0.50) 0%,rgba(255,255,255,0.50) 100%), url(../siteart/header-bg-1.jpg);
    background-image: linear-gradient(180deg,rgba(255,255,255,0.50) 0%,rgba(255,255,255,0.50) 100%), url(../siteart/header-bg-1.jpg);
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
}
.wrapper-home {
    max-width: 90%;
    width: 100%;
    height: auto;
    margin: 0 auto;
    padding: 40px;
    box-sizing: border-box;
}

.wrapper-head {
   
    width:100%;
    height:auto;
    margin:0 auto;
    padding:30px 10px;
    box-sizing:border-box;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap:20px 0;
}

.email-link a {
	color:#fff;
}

.head-info {
    padding:10px;
}

.head-info p {
    font-family: 'Fira Sans', sans-serif;
    font-size: 15px;
    text-align: center;
    text-decoration: underline;
    color:#000;
    font-weight: 600;
    text-shadow: 0 0 2px rgba(255,255,255,1.0);
}
.head-info a {
    font-family: 'Fira Sans', sans-serif;
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    text-decoration: none;
    color:#000;
    text-shadow: 0 0 10px rgba(255,255,255,1.0);
    transition: .2s ease-in;
    display: block;
}
.head-info a:hover {
    opacity: 0.6;
}

.logo img {max-width:100%;height:auto;}


.payonline {box-sizing:border-box;background: rgba(136,43,43,.8); border: 1px solid #ccc;padding:10px;font-size:16px;float:right;margin-bottom:10px;}
.payonline a {text-decoration:none;font-weight:700;}
.payonline:hover {background: rgba(0,0,0,.8);cursor:pointer;}

.eqbuttons a {color: #fff;}
.eqbuttons {position:relative;text-align:center;font-weight:700;color:#fff;font-size:1.5em;display:inline-block;width:24%;height:200px;box-sizing:border-box;background: rgba(136,43,43,.8); border: 1px solid #ccc;}
.middle {transition:.5s ease;opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);text-align:center;}
.centered {position: absolute;top:50%;left:50%;transform:translate(-50%, -50%);}
.centered span, .eqbuttonstext span {font-weight:300;}
.eqbuttons:hover {background: rgba(0,0,0,.8);cursor:pointer;}

.two-cols {width:50%;vertical-align:top;height:auto;display:inline-block;box-sizing:border-box;}

.black {background: rgba(0,0,0,.8);}
.hosted-content #listings-title {text-align:left;}
.hosted-content h3 {color:#fff !important;}
.hosted-content .listings-wrapper .listings-list .listing-banner h2 {background:#882b2b!important;}
.hosted-content .listings-wrapper .sort-box {background:#882b2b!important;}
.hosted-content .listings-detail-wrapper .information-box :nth-child(2n).row {background:#882b2b!important;}
.hosted-content .listings-detail-wrapper .make-an-offer a.btn, .hosted-content .listings-detail-wrapper .make-an-offer input[type=submit].btn {border: 1px solid #ccc !important;}
.hosted-content .btn.listings-button, .hosted-content .listings-button {border: 1px solid #ccc !important;}


.contact h1 {font-family: 'Fira Sans', sans-serif;font-weight: 700;line-height: normal;text-align:left !important;padding:0;font-size:24px;}

.scrolling-wrap {width:100%;height:90px;overflow:hidden;background:#882b2b;padding:10px 0px;}
.scrolling{width:100%;height:92px;}

footer {max-width:100%;height:auto;padding:20px 0px;background:#fff;border-top:2px solid #882b2b;color:#000;}
footer a:link, footer a:visited, footer a:active {text-decoration:none; color:#000;font-weight:700;}
footer a:hover {text-decoration:underline; color:#000;}

.smallmanu img {display: inline-block;float:right;max-width:100%; height: auto;vertical-align:top;}
.foot {float:left;display:inline-block;}


.seller a, .dealer-data a, .specs-button, div#list-toggle, div#grid-toggle, i.fas.fa-share-alt.media-buttons__icon, .shipping span.listing-widget__text {color:#000 !important;}

.detail-wrapper, .detail-shipping, .detail-shipping, .detail__specs-label, .detail__specs-label, .inspection__spec-label, .inspection__spec-label, .detail__beta-site-warning, .detail__beta-site-warning, .currency-select, .currency-selector-option, .mc-media-overlay-banner-span, .mc-media-overlay-banner-span{color:#000!important;}
.ts-modal-header h2 {color: black!important;}
.show-closest-first-container .sort-button-spoof {color:black!important; }
.list-top-section .list-title .list-title-text {color:white!important;}
button.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-textPrimary.MuiButton-sizeMedium.MuiButton-textSizeMedium.MuiButton-colorPrimary.MuiButton-root.MuiButton-text.MuiButton-textPrimary.MuiButton-sizeMedium.MuiButton-textSizeMedium.MuiButton-colorPrimary.options-popper-btn.metrolinaequipmentcomhdev-12l2o9n {color:white; }
.ts-modal-header .close i {color:black!important;}
 
/************************************************ Responsive Styles **/
@media screen and (max-width: 1305px){
    header .wrapper {
        max-width: 90%;
    }
}

@media screen and (max-width: 1175px){
    .logo img {max-width:100%;height:115px;}

}
@media screen and (max-width: 1075px){
    .wrapper {max-width:80%;padding:15px 10px;}
    .headerright span {padding-left:0px;display:block;text-align:right;}
    h1 {font-size:2em;}
    .logo img {max-width:100%;height:80px;}
    .eqbuttons {width:49%;}
}
@media screen and (max-width: 900px){
    .cta-wrapper a {
        width: 100%;
    }
}
@media screen and (max-width: 650px){
    .logo {float:none!important;text-align:center!important;}
    .logo img {display:inline-block;}
    .headerright {float:none;text-align:center;}
    .headerright span {text-align:center;}
    button.payonline {padding:10px;font-size:14px;float:none;margin-bottom:5px;}

    
    .eqbuttons {font-size:1.5em;width:100%;height:100px;}
    .foot {float:none;text-align:center;}
    .smallmanu {width: 100%;clear:both;}
    .smallmanu img {float: none; padding: 5px 0px;}
    
    h1 {font-size:1.5em;}
    
    .two-cols {width:100%;}
    .wrapper-head {
        max-width:100%;
        padding:20px;
		flex-wrap: nowrap;
    }
	
	.cta-wrapper a h2{
		font-size: 25px;
	}

}

@media screen and (max-width: 550px){
	.logo{
		display: none;
	}
	
	.cta-wrapper a h2{
		font-size: 20px;
	}
}
 
@media screen and (max-width: 500px){
    .headerright span {font-size:.8em;}
}
