@charset "utf-8";
/*  
    Website Designer: Karoline Dassie

    Main Colors
    - White: #fff
    - Orange: #f4811e
    - Black: #000
    - Gray: #333333
*/

/*====================================== 
    RESET 
========================================*/
* {
    background:transparent;
    border:0;
    padding:0;
    font-family:'Oswald', sans-serif;
	vertical-align: baseline;
}
video {margin: 0 auto;display: block;}
ol, ul {list-style: none;}
.clear {clear: both; height:0px; margin:0;}
img {max-width: 100%; height: auto; border:none;}

/*====================================== 
    LAYOUT
========================================*/
    body{
        margin:0;
        padding:0; 
        font-family:'Oswald', sans-serif;
        background: #fff;
        background-size: cover;
        overflow-x: hidden;
        background-color:#fff; 
        color:#252525;
        font-size:16px;
        line-height: 22px;
        -webkit-text-size-adjust: none;
    }
    .wrapper {  max-width: 100%; margin: auto 100px; box-sizing:border-box; }
    .wrapped {  max-width: 100%; margin: 0 100px; box-sizing:border-box; }
    .left {float: left;}
    .right {float: right;}
    .pad{padding: 3em 0;}
    .center{text-align: center}

/*====================================== 
    LINKS
========================================*/
    a {
        text-decoration:none;
        color:#333;
        -webkit-transition: all .3s ease-in-out;
        -moz-transition: all .3s ease-in-out;
        -ms-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all.3s ease-in-out;
    }

    .btn {display: inline-block;padding: 10px 1.5em;margin: 20px 0;background-color: #f4811e;text-transform: uppercase;font-weight: 600;border: 1px solid #ccc;-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all.3s ease-in-out;font-size: 15px;}
    .btn:hover {cursor: pointer;}
    a.botao{display: block; margin: 30px auto 0 auto; border: 2px solid #f4811e; padding: 5px 0; width:300px; color: #000; font-weight: 900}
    a.botao:hover{background: #000; color: #fff}


/*====================================== 
    FRAMELESS INVENTORY 
========================================*/
    .hosted-content .listings-wrapper .listings-list {font-size: 17px!important;}
    .hosted-content .attachment-search .search-subheader {font-size: 14px!important;}


/*====================================== 
    TYPOGRAPHY 
========================================*/
    p {font-family: 'Oswald', sans-serif;font-size:18px;line-height:1.5;margin-bottom: .75rem;}

    h1, h2, h3, h4 {text-transform: uppercase; margin:0 0 15px 0; line-height: normal}
    h1 {font-size:2em; text-transform:Uppercase; font-weight: 400;}
    h2{font-size:1.75em; padding: 30px 0;}
    h3{font-size:17px;}

/*====================================== 
    HEADER
========================================*/
    .top-bar {width: 100%; display:inline-block;margin: 0 auto; vertical-align: middle; font-size: 18px; background-color: #221f1f;
    -webkit-border-bottom-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -moz-border-radius-bottomright: 10px;
    -moz-border-radius-bottomleft: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    }

    a.social {font-size: 24px; font-weight: 400 !important;}
    .top-bar a:hover {color: #fff;}
    .top-contact {float: left; margin-left: 15px; padding: 4px 0; color: #f4811e; text-align: center; }
    .top-contact a {color: #f4811e; font-weight: 600;}
    .header {width: 100%;}
    .logo {display: inline-block;width: 25%;}
    .logo img {display: inline-block; vertical-align: middle; padding: 10px 0; max-width:270px;
    width: 100%;}

    .hdr-cont {display: inline-block;vertical-align: middle; width: 74%;}
    .openBtn {float: right; margin: 0 20px;}
    a.openBtn {font-size: 24px; color: #000; cursor:pointer;}
    .closebtn { position: absolute;top: 30%;right: 10%;font-size: 60px;cursor: pointer;color: #ffffff;}
    .closebtn:hover, .openBtn:hover {color:#f4811e;}
    #search h3{font-size: 1.25em; color: #f4811e;}
    .overlay {height: 100%;width: 100%;display: none; position: fixed; z-index: 9999999999;top: 0;left: 0; background-color: rgb(0,0,0);background-color: rgba(0,0,0, 0.9);}
    .overlayForm {position: relative;top: 40%;width: 80%;text-align: center;margin-top: 30px;margin: auto;}
    .overlayForm input[type="text"] {font-size: 1.25em;font-weight: 300;margin: 20px auto;padding: 10px 20px !important;width: calc(100% - 41px);color: #fff;outline: none;border: .5px solid #ffffff;}
    .overlayForm strong {font-size: 2em; color: #fff; font-weight: 400; line-height:2;}
    .ctc-bar {background: #e1e1e1; width: 100%; padding: 11px 0; float: left;}
    .ctc-bar h3 {float: left; font-size: 20px;}

    .tagline { width: 100%; display: inline-block; text-align: center; font-size: 25px; padding: 10px 0; font-weight: 600; background-color: #f4811e; color: #fff;
    text-transform: uppercase;}


/*====================================== 
    SLIDER
========================================*/
    .main-image {position: relative; width: 100%; height: 440px; text-align: center;}
    .hero-title {position: relative;bottom: 60%;width: 100%; margin-top: 10%; line-height: 1; }
    .hero-title h1 {color: #fff;font-size: 2.5em;font-weight: 600;text-shadow: 1px 1px 1px #000;}
    .hero-title span {color: #f4811e;}
    .button { display: inline-block; margin-top: 20px; padding:.5em 2em; border: 3px solid #f4811e; text-align: center; font-size: 22px; font-weight: 700; text-transform: uppercase;color: #fff;  text-shadow: 1px 1px 1px #000; -webkit-border-radius:10px; cursor:pointer; border-radius: 10px;}
    a.button:hover {background: rgba(255, 255, 255, 0.25);}


/*====================================== 
    CONTENT
========================================*/
    .map-wrap{position: relative; max-height: 300px;}
    .map {width: 100%; max-height: 300px;}
    .callouts { position: relative;  width: 100%; margin: 0 auto; background: #000}
    .callouts a {width: 33%; float: left; text-transform: uppercase;  padding:30px 0; color: #fff; border-right: 1px solid #919191}
    .callouts a:hover {color: #040000;background-color: #f4811e;}
    
    .ctc-tab {background: url(../siteart/contact.png); border: none !important; background-color: #f4811e; color: #000; width: 33.8%!important;}

    .callout-title {text-align: center; font-size: 18px; font-weight: 400;}

    .products {padding: 3em 0;}
    .products h2 {text-transform: capitalize;}

    .prod {float: left; width: calc(16.66% - 24px);  border: 1px solid #888888; margin: 10px; background-position:center 20px; background-repeat: no-repeat; -webkit-transition: all .2s ease-in-out;-moz-transition: all .2s ease-in-out;-ms-transition: all .2s ease-in-out;-o-transition: all .2s ease-in-out;transition: all .2s ease-in-out;}
    .prod:hover {background-color:#f4811e; cursor:pointer;}
    .dozers{background-image: url(../siteart/equipment/dozers.png);}
    .excavators{background-image: url(../siteart/equipment/excavators.png);}
    .wheel-loaders{background-image: url(../siteart/equipment/wheel-loaders.png);}
    .backhoe-loaders{background-image: url(../siteart/equipment/loaders-backhoe.png);}
    .o-trucks{background-image: url(../siteart/equipment/offhighway-trucks.png);}
    .motorgraders{background-image: url(../siteart/equipment/motorgraders.png);}
    .compactors{background-image: url(../siteart/equipment/compactors.png);}
    .skidsteers{background-image: url(../siteart/equipment/skidsteers.png);}
    .forklifts{background-image: url(../siteart/equipment/forklifts.png);}
    .lifts{background-image: url(../siteart/equipment/lifts.png);}
    .w-trucks{background-image: url(../siteart/equipment/water-trucks.png);}
    .all-equipment {background-image: url(../siteart/equipment/all-equipment.png);}

    .producttext {position: relative; width: 100%; float: left; margin-top: 118px; padding: 6px 0;background: #f4811e;font-size: 18px;font-weight: 700;text-transform: uppercase;text-align: center;}

    .main-text {padding: 5rem 0; text-align:center;}


/*====================================== 
    SCROLLING BANNER
========================================*/
    .scrolling-wrap { max-width: 100%; height: 90px; overflow: hidden;}
    .scrolling {width: 100%;height: 90px;}


/*====================================== 
    FOOTER
========================================*/
    #bottom {color: #fff; font-size: 16px; text-transform:capitalize;}
    #bottom a:hover {color: #f4811e;}
    #bottom h3 {color: #f4811e; text-transform: uppercase; font-weight: 600;}
    #bottom strong {font-weight: 700;line-height: 0;font-size: 36px; color: #575757;}

    .footer_top {width: 100%; background-color: #000; color: #ffff; float: left; padding: 2em 0; text-transform: uppercase;line-height: 26px;}
    .footer_top a {color: #fff; text-decoration: none}
    .footer_top a:hover {color: #952726; }

    .footer_bottom {width: 100%; float: left; padding: 15px 0; text-align: center; background: #fff; color: #252525; font-size: 14px; font-weight: 400; text-transform: uppercase}
    .quarter {width: 20%;margin: 0px 2.5%; float: left;}
    
    .footlogo img{display: inline-block;}

    /*.qk-links {
        z-index: 99;
        position: fixed;
        top: 30vh;
        right: 0;
        line-height:0;
        font-size:0;
    }

    .qk-links a {
        display: block;
        padding: 0 12px;
        margin: 1px 0 0 0;
        background: rgba(0, 0, 0, .85);
        font-size: 18px;
        font-weight: 300;
        line-height:2;
        color: #fff;
        border-left: 4px solid rgba(249, 193, 0, .9);
        -webkit-transition: -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
        transition: -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
        transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
        transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
        transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1),-webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
        -webkit-transform: translate3d(72%, 0, 0);
        transform: translate3d(72%, 0, 0);

        }
    .qk-links .fas { padding: 12px 12px 12px 0;}
    .qk-links a:hover {-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);color:#f4811e;}*/


/*====================================== 
    FORMS
========================================*/
    .main-search {max-width: 100%;padding: 30px;text-transform: uppercase;;background-color: #333;}
    .search-title {float: left; width: 19%; word-break: break-word;}
    .main-search h2  {padding: 30px 10px;border-right: 2px solid #fff;font-size: 3.5vw; line-height: .9;font-weight: 400; color: #f4811e;}

    .search-bar {float: left;width: 80%;}
    .fourth {float: left; width: 20%; margin: 0px 2.5%;}
    .main-search input, .main-search select, .main-search textarea {border: 1px solid #ccc;box-shadow: 0 0 10px 0 rgba(0,0,0,.05);position: relative; display: block; font-size: inherit; padding: 9px 5% !important; margin: 0 0px 30px 0 !important; background: #f8f8f8; width: 90% !important;}
    .main-search label {display: inline-block;color: #fff;}
    .main-search input#submit {background-color: #f4811e;font-size: 18px; font-weight: 600; text-transform: uppercase;border: none;outline: none; }
    .submit { width: 30%; padding: 0 2.5%;}
    .search {display: none;}
    input#submit {width: 100% !important;}
    .fourth select { width: 100% !important; border: none}
    input.btn:hover, .btn:hover {background: #f4811e !important;}

    select#searchselector {width: 100%;padding: 10px 0;font-size: 1.25em; color: #fff;background: #353534;border: 1px solid #fff;-webkit-border-radius: 0;border-radius: 0; box-sizing: none; box-sizing: unset !important;
    -webkit-appearance:menulist;-moz-appearance:menulist;appearance:menulist;}
    div#search {max-width: 85%;margin: 0 auto;}
    .c-form {position:relative; max-width: 75%; margin: 40px auto; padding: 20px; font-family: 'Oswald', sans-serif; font-size: .9em;}
    input[type="text"] {
        width: 98%;
        margin: 0px 0 12px 0;
        padding: 4px 1%;
        font-size: .9em;
        border: 1px solid #bebebe;
        -webkit-border-radius:0; 
        border-radius:0;
    }

    selec#searchbox {width: calc(100% - 40px);margin: 10px auto;padding: 0 20px;font-size: 2em;color: #fff;background: #353534;border: 1px solid #fff;-webkit-border-radius: 0;border-radius: 0;}

    select:focus {outline: none;}

    textarea {
        width: 98%;
        min-height:80px;
        margin:2px 0;
        padding: 4px 1%;
        font-size: .9em;
        background-color: #f9f9f9;
        border: 1px solid #bebebe;
        -webkit-border-radius:0; 
        border-radius:0;
    }


/*====================================== 
    CAPTCHA
========================================*/
    .CaptchaPanel {margin:0 !important; text-align: -webkit-center; font-size: 12px; font-weight:300;}
    .CaptchaImagePanel {padding:0 !important; text-align: -webkit-center !important;}
    .CaptchaImage {width:auto !important;}
    .CaptchaAnswerPanel { padding:0 !important;}
    .CaptchaMessagePanel {font-weight:400 !important;padding:0 !important;}
    .CaptchaWhatsThisPanel {padding:0 !important;}
    #CaptchaAnswer {border: 1px solid #999; background: #fff; font-weight: bold;}
    .cap-sub-group {text-align: center; margin: 20PX auto;}
    .form-btns {max-width: 80%; margin: 0 auto; text-align: center;}


/*====================================== 
    INVENTORY STYLES
========================================*/
    .container.cf {margin: 20px auto !important;}
    .listings-wrapper .listing-thumb .listing-thumb-title a { color: #f4811e;}
    .listings-wrapper .hosted-theme .btn {background: #f4811e; color: #fff!important;}
    .listings-wrapper .hosted-theme .btn:hover {background-color: #9C9C9C; color: #fff!important;}
    .hosted-content input[type="text"] {width: auto!important;}
    #main-search input#keywords { background-color: #fff !important; border: 1px solid #bababa !important;}

/* INVENTORY */


#inv{padding: 5% 0;}
#inv *:not(.loading-spinner):not(.loader){border-radius: 0!important;}
#inv *:not(.fa):not(.far):not(.fas):not(.fab):not(.material-icons){font-family: oswald, sans-serif!important;} /* Reset font, ignore icons */

span.compare-label{padding-left: 4px !important;}
.compare-chkbox-container .compare-listings .fa-check {
    top: 2px !important;
    left: 6px !important;
}
.faceted-option-checkbox-container {
    line-height: normal !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 {background:#f4811e !important; color: #000 !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, .cs-btns a {background: #000 !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, .compare-title, .compare-price, .bread-crumbs-heading .return-links .return-links-link i, .bread-crumbs-heading .return-links .return-links-link span {color: #000 !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: #000 !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: #000 !important;}

.detail-content .dealer-info .phone-and-email .send-email-btn {border-color: #000!important; color: #000!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: #000!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
========================================*/
.show-menu-for-mobile {display:none;} 

@media screen and (max-width: 1600px) {
    .main-text h1 {font-size: 32px;}
    .main-text p {font-size: 18px;}
}
@media screen and (max-width: 1440px) {
    .main-text h1 {font-size: 32px;}
    .wrapper, .wrapped{max-width: 100% ; margin: auto 30px; box-sizing:border-box;}
    .products h2 {margin-left: 30px;}
}

@media screen and (max-width: 1367px) {
    .main-image {height:521px; max-height:521px;}		
    .main-text h1 {font-size: 28px;}
    .callouts {background: #000}
}
 
@media screen and (max-width: 1280px) {
    .openBtn {margin: 0 0 0 20px;}
    .ctc-bar h3 {font-size: 18px;}	
    .main-image {height: 556px; max-height: 556px;}
    .wrapper {margin: 0 auto ; padding: 0 20px;}
    .wrapped { width: 100%;margin: 0 auto;}
    .container.cf {margin: 20px 10px !important;}
    .producttext {font-size: 16px;}
    .products h2 {margin-left: 20px;}
    .equipment-s a {font-size: 18px;}
}

@media screen and (max-width: 1090px) {
    .show-menu-for-mobile {display: block;}
    .hide-for-mobile {display:none;}
    .top-navigation  {float: none!important; text-align: center}
    .top-navigation ul {float: none!important;margin: 0 auto!important;}
    .top-navigation li {float: none!important; display: inline-block!important;}
    
    .top-contact {width: 100%; margin: 0 auto;}
    .callout-title span {display: none;}
    .callouts a { border: none !important;  width: 50% !important;}
    .callouts { width: 100%; margin: 0 auto; background:#000;}
    a.ctc-tab { width: 100% !important;}
    .qk-links {display: none;}
}

@media screen and (max-width: 1024px) {
    .logo {width:240px;}
    .hdr-cont {width:calc(100% - 244px);}
    .tagline {font-size: 16px;}
    .main-image {height: 380px; max-height: 380px;}
    h2 {font-size: 1.25em;}
    .ctc-bar h3 {font-size: 16px;}
    .callouts a {width: 50%; font-size: 20px;padding: 13px 0}
    .prod {width: calc(25% - 16px); margin: 6px;}
    .main-text h1 {text-align: left;width: 100%; padding: 1em 0;}
    .main-text h1:after {display: none;}
    .main-text p {width: 100%; padding: 0;}
    .search-title, .search-bar {width: 100%;}
    .search-title {text-align: center;}
    .main-search h2 {border: none;font-size: 36px;}
    .fourth {width: 100%; margin: 0 auto;}
    .submit {padding: 0; width: 75%; margin: 0 auto ; }
    .main-search { padding: 0 30px;}
    .products {padding:2em 0;}
}

@media screen and (max-width: 768px) {
    .nav-container {margin-top: 8%;}
    .overlayForm strong {font-size: 1.25em;}
    .main-image {height: 300px; max-height: 300px;}
    .hero-title h1 {font-size: 1.25em;}
    .prod {width: calc(33.33% - 16px); background-size: auto 50%;}
    .producttext {margin-top: 90px;}
    p {font-size: 16px;}
    #footer {font-size: 14px;}
    #footer h3 {font-size: 20px;}
    .c-form {max-width: 100%;}
    .quarter { width: 40%; margin: 20px 5%;float: left;}
    #bottom strong {font-size: 34px;}
    .footer_bottom {font-size: 12px;}
    .hosted-content h1 {font-size: 1.25rem !important;}
    .pad{padding: 2em 0}
}

@media screen and (max-width: 680px) {
    .hero-title {left: 0;right: 0; text-align: center;}
    .ctc-bar h3 {display: none;}
    a.phone {width: 100%; text-align:center;}
    .prod {width: calc(50% - 12px); margin: 4px;}
    .main-search{padding:0 30px}
    .footlogo{margin-top:30px!important;}
    #bottom h3{margin: 0}
    .quarter {width: 100%; margin: 10px 0; float: none; text-align: center}
    .pad{padding: 1em 0}
    .logo img {max-width: 200px;}
}

@media screen and (max-width: 640px) {
    .callouts a {width: 100% !important; margin-top: 1px;}
    .producttext {font-size: 14px;}
    .left, .right {width: 100%;}
    a.botao { width:90%;}
}
@media screen and (max-width: 520px) {
    .top-bar{padding: 2px 0; display: block}
    .top-navigation li { display: block!important;}
    .top-navigation ul li a {display: block!important;padding: 2px 0!important;font-size: 14px!important;}
}
@media screen and (max-width: 460px){
    .main-image {height: 224px; max-height: 224px;}
    #navcontain {top: 28px !important;}
    .tagline {font-size: 12px;font-weight: 700; padding: 4px 0;}
    .overlayForm {width: 95%;}
    .producttext {font-size: 12px;}
    .contact {width: 100%; margin-top: 20px;}
    .footer_bottom {padding: 5px 0; text-align: center; width: 100%; margin: 0 auto;}
    
    
}

@media screen and (max-width: 400px){
    .top-contact { font-size: 14px;}
    .main-image {height: 164px; max-height: 164px;}
    .hero-title h1 {font-size: 18px; font-weight: 600; line-height: 18px;}
    .hero-title {left: 0; right: 0; bottom: 10%; text-align: center;}
    .button {margin-top: 10px; font-size: 14px !important; padding: 2px 2em;}
    .ctc-bar {padding: 5px 0;}
    .callouts a {padding: 15px 0;}
    .producttext {font-size: 14px;}
    .main-text {padding: 2rem 0;}
    .footer_top {padding: 40px 0;}
    .quarter {width: 90%;}
}