@charset "utf-8";

/*
    Site Developer: Karoline Dassie

    Main Colors
    - Black: #212121
    - Whte: #fff
    - Yellow: #f7c918
    - Gray: #787878
    - Light Gray: #c1c1c1
*/

/***** 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;}
.clear {clear: both; height:0px; margin:0;}

* {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
::-moz-selection {
    background: #f7c918;
    color: #000;
    text-shadow: none;
}
::selection {
    background: #f7c918;
    color: #000;
    text-shadow: none;
}


/* =============  LAYOUT ============= */
    
    html, body {
        -webkit-text-size-adjust: none; 
        overflow-x: hidden; 
        font-family: 'Roboto Condensed', sans-serif;
        font-weight:normal;
        margin:0;
        padding:0;
        background: #f7c918;
}
    
    .column1 {width:100%;}
	.column2 {width:47.5%; float:left; margin-right:5%; box-sizing: border-box; color:#fff;}
	.column3 {width: 31.33333%; float: left; margin: 0 1%; box-sizing: border-box;}
	.column4 {width:23%; margin-right:2%; float:left;  box-sizing: border-box;}
	.column5 {width:20%; float:left; padding-right:1%; box-sizing: border-box;}
    .column6 {width:16%; float:left; padding-right:1%; box-sizing: border-box;}
	
	.twothird{width:60%; float:left;  box-sizing: border-box;}
	.onethird{width:40%; float:left; padding-right: 30px; box-sizing: border-box; text-align:left}
	.dois-terco{width:70%; float:left; padding-right: 30px; box-sizing: border-box;}
	.um-terco{width:30%; float:left; box-sizing: border-box; }
	
	.last{padding-right:0; margin-right:0!IMPORTANT;}
    .midcolumn {padding:0 20px;}
	.center{text-align:center}

    .width {width: 1600px; margin: 0 auto; max-width: 90%;}
    .wrapper{width: 80%; margin: 0 auto;}
    .wrapper-width-small {width: 75%; margin: 0 auto; max-width: 1220px; text-align:center;}
    .inventory-width {width: 80%; margin: 0 auto; padding-bottom: 40px;}
    .pad{padding:3em 0;}

/* ================ TYPOGRAPHY ============= */
    h1,h2, #contactinfo p{font-family: 'Oswald', sans-serif;}

    h1 { font-size:25px; color:#212121; text-transform:uppercase; font-weight: 900; margin-bottom: 20px;}
    h2 { font-size:19px; color:#fdc031; text-transform:uppercase; font-weight: 500;}
    h3 { font-size:14px; color:#212121; text-transform:uppercase; line-height: normal}
    h4 { color: #212121;font-size: 28px; text-transform: uppercase}

    p  { line-height: 26px; color: #212121; font-size:17px; font-weight:500; }
    a  { text-decoration:none; transition: all 300ms ease;}
    article a{color:#787878; text-decoration: underline}
    article a:hover{text-decoration: none}
    strong, b{font-weight:900}

/* ================ HEADER STYLES ============= */
    .headerbg {
        width: 100%; 
        margin: 0 auto; 
        background: #ffc921;
        border-bottom: 5px #212121 solid;; 
        padding:20px 0; 
    }
  
    .logo {float: left; width: 280px; display: block;}
    .logo img{ width: 100%; max-width:  280px; }
    .header-direita {width: calc(100% - 280px); display: block; float: right; text-align: right; margin-top: 13px;}

        
/* ================ CONTENT ============= */
    article{background:#fff url("../siteart/bg.jpg") repeat-x }
    .blackbg{background: #212121}
    .blackbg p{color:#fff}

    .quadrao{border-left: #212121 30px solid;}
    #mainphoto {
        float: left;
        width: 737px;
        height: 394px;
        border-left: #c62626 10px solid; 
    }
    #mainphoto img{max-width: 737px; width: 100%; display: block}

    #contactinfo {
        float: left; 
        width: calc(100% - 737px); 
        background: #212121; 
        border-bottom: #c62626 40px solid;  
        padding: 40px 20px;
        height: 394px;
        text-align: left;
    }
    #contactinfo p, #contactinfo a{color: #fff; font-weight: 400;  text-decoration: none}
    #contactinfo a:hover{color: #fdc031; text-decoration: underline}

    .staff img{max-width: 623px; width: 100%; height: auto; display: block; margin: 0 auto 20px auto}


/* ================ ZOOM ============= */

    .zoom-container {float:left; width:25%; position: relative; overflow: hidden; display: inline-block; border: 1px solid #fff;  -moz-box-sizing: border-box;-webkit-box-sizing: border-box; box-sizing: border-box;margin:0;}

    .zoom-container img {display: block; width: 100%; height: auto; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease;}

    .zoom-container .zoom-caption {position: absolute; right: 0; bottom: 0; left: 0; z-index: 9; background: rgba(0, 0, 0, 0.5); height:25%; -webkit-transition: all .5s ease;  -moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease;}

    .zoom-container .zoom-caption h4 {display: block; text-align: center; font-size: 18px; text-transform: uppercase; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width:100%;}

    .zoom-container:hover .zoom-caption {background: #f7c918; color: #212121}
    .zoom-container .zoom-caption h4:hover{color: #212121}


/* ================ FORM STYLES ============= */

    .list-content .faceted-search-content{background: #fff!important}
    .list-content .list-main-section .list-container{background: #fff!important}
    .detail-content .detail-main-body .detail-img-carousel.empty-detail-carousel{background: #fff!important}
    .detail-content-mobile .detail-main-body .detail-img-carousel.empty-detail-carousel{background: #fff!important}
    #parts-content .parts-bottom-section .parts-list-view .parts-list-content .parts-search-container{background: #fff!important}
    #parts-content .parts-top-section .parts-title-and-breadcrumbs .parts-title .parts-listings-count {color: #fff!important}
    .hosted-content .listings-wrapper, .hosted-content .listings-detail-wrapper, .hosted-content .listings-drilldown-wrapper {background: #fff!important; padding: 10px!important;}
    
    .detail-content .detail-main-body .main-detail-data .offer-btn:hover, .detail-content .detail-main-body .main-detail-data .buy-btn:hover{background-color:#f7c918!important}
    .detail-content .detail-additional-data .data-row .data-label{background-color:#f7c918!important; color: #000!important}
    .detail-content .detail-main-body .main-detail-data .offer-btn, .detail-content .detail-main-body .main-detail-data .buy-btn{background-color:#f7c918!important;}
    .detail-content .detail-main-body .main-detail-data .detail-price{color: #000!important}
    .detail-content .dealer-info .phone-and-email .send-email-btn:hover{color: #000!important; border-color:#f7c918!important}
    .detail-content .dealer-info .phone-and-email .send-email-btn{color: #000!important; border-color:#f7c918!important}
    .detail-content .search-results{color:#fff!important }
    .detail-content-mobile .detail-main-body .main-detail-data .dealer-phone-mobile-container .dealer-phone-mobile{background-color:#f7c918!important; color: #000!important }
    .detail-content-mobile .detail-main-body .main-detail-data .buy-btn-mobile, .detail-content-mobile .detail-main-body .main-detail-data .offer-btn-mobile {border-color:#f7c918!important}
    .detail-content-mobile .detail-main-body .main-detail-data .offer-btn-mobile{background-color:#f7c918!important; color: #000!important }
    .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{background-color:#f7c918!important; color: #000!important }
    .detail-content-mobile .detail-additional-data .data-row .data-label{background-color:#f7c918!important;color: #000!important }
    .detail-content-mobile .detail-contact-bar .contact-bar-btn {background:#f7c918!important;color: #000!important}
    .detail-content-mobile .detail-main-body .main-detail-data .detail-price{color: #000!important}

    .list-content .list-main-section .list-container .list-listing .listing-top-right .view-listing-details-link:hover, .list-content .list-main-section .list-container .list-listing .listing-top-right .buy-now-link:hover, .list-content .list-main-section .list-container .list-listing .listing-top-right .check-availability-link:hover, .list-content .list-main-section .list-container .list-listing .listing-top-right .email-seller-link:hover{background-color:#f7c918!important }

    .list-content .list-main-section .list-container .list-listing .listing-top-right .view-listing-details-link, .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{background-color:#f7c918!important; color: #000!important }
    .paging-container .page-navs .list-page-nav:hover{background-color:#000!important  }
    .paging-container .page-navs .list-page-nav .list-page-number{background-color:#000!important  }

    .faceted-search-content .selected-facets-container .selected-facet{background-color:#f7c918!important; color: #000!important}
    .list-content .list-title .list-listings-count{color: #fff!important}
    .info{color: #000!important}

/* ================ FORM STYLES ============= */

 /*   #formpage {vertical-align:top; margin: 0 auto; }
    #formpage div {vertical-align:top; padding:10px 10px;  line-height: 26px;}
    #formpage input {padding:6px 5px 10px; border:1px solid #dadada; font-size:14px; background:#fff; width: 100%; margin-top: 5px;}
    #formpage textarea {padding:6px 6px; border:1px solid #dadada; color:#212121; font-size:14px; background:#fff; margin-top: 5px;}

    #formpage select {border:1px solid #dadada; color:#282828; vertical-align:middle; font-size:16px; line-height:normal; padding:10px; margin-top:5px; width:100%; background:#fff;}

    .formfield {width:50%; float:left; margin-right: 12px; margin-top: 10px; margin: 0 auto; font-size: 16px; line-height: 2;}
    #formpage input.larger  {width:100%;}
    #formpage textarea {width:100%; height:150px;}
    #formpage input.checkbox {padding:0; border:0; margin:0 5px 0 15px; width:15px; height:15px; display:inline; background-color:#fff; color:black; text-transform:uppercase;}
    #formpage input.radio {padding:0; border:0; margin:0 5px 0 0; width:15px; height:15px; display:inline;}
    #formpage .textbox {display: inline-block; width: 100%; text-align: left; font-size: 16px;}

    #formpage input:focus,
    #formpage textarea:focus,
    #formpage select:focus {background:#f2f1f0; border:1px solid #abacac; outline-style:none;}
    #formpage input.radio:focus,
    #formpage input.checkbox:focus {background:none; border:0; outline-style:none;}
    #formpage input.button,
    #formpage input.button:focus {width: 200px; display: inline-block; line-height:14px; color:#fff; background: #212121; padding: 10px 0px; font-size: 14px; font-weight: 600; text-decoration:none; text-transform: uppercase;  transform: none!important;}
    #formpage input.button:hover {display: inline-block; background: #f7c918; border: 1px solid #f7c918; line-height:14px; color:#2a2a2a; text-decoration:none;  text-transform: uppercase;  transition: all .2s ease-in-out;}
    
    #formpage label.basic {color:#212121; font-size:13px; text-align:left;} 

    #formpage .captcha .CaptchaWhatsThisPanel a {text-align: center !important; margin-top: 10px;}
    .CaptchaPanel {margin:0 auto !important;padding:0 0 0 0 !important;line-height:normal !important;color:#212121;width: 50%;text-align: center; }
    .CaptchaImagePanel {margin: 0 auto;	text-align: center !important; margin-top: 10px; padding:0 0 0 0;}
    .CaptchaMessagePanel {padding:0 0 0 0 !important; margin:0 0 0 0 !important; font-weight:normal !important; font-size:12px; line-height:14px; text-align: center;}
    .CaptchaAnswerPanel {margin:0 0 0 0; padding:2px 0px 2px 0px !important;}
    .CaptchaWhatsThisPanel {line-height:0; margin:0 0 10px 0; padding:10px 0 10px 0 !important;}
    .CaptchaWhatsThisPanel a {color:#212121; text-align: center !important; border: none;}
    .CaptchaWhatsThisPanel a:hover {text-decoration:none; background: none; color: #212121;} 
*/
/* ================ CONTACT PAGE ============= */
    /*
    .formcont{ background:#f8f8f8; padding: 2%; margin: 1em auto}
    .formcont p{color: #fff; font-weight: 700; font-size: 14px}

    .order-form{display:block;}
    .order-form label{
        display:block;
        font-size:16px;
        padding-top: 4%;
        width:100%;
    }
    .order-form input{
        border: #ccc solid 1px;
        border-radius: 2px;
        padding: 12px;
        font-size:14px;
        box-sizing:border-box;
        margin:0 1% 10px 0  ;
        width: 99%;
        font-family: 'Roboto Condensed', sans-serif;
}
    .order-form input.half{width:49%;float:left;}

    .order-form input:focus{ outline: #212121 solid 1px!important;}

    .order-form input.button2{
        display:block;
        width:200px;
        padding: 10px 0;
        margin:10px 0 0 0;
        background-color:#212121;
        color:#fff;
        border: 0;
        -webkit-transition:.3s ease-in;  
        -moz-transition:.3s ease-in;  
        -o-transition:.3s ease-in;  
        transition:.3s ease-in;
    }

    .order-form input.button2:hover{
        background-color:#787878;
        cursor:pointer;
    }

    .order-form select{
        border:#ccc solid 1px;
        border-radius: 2px;
        padding: 2%;
        font-size:14px;
        box-sizing:border-box;
        width:98%;
        margin:0 1% 10px;
        color:#969696;
    }
    .order-form select.half{width:48%;float:left;}

    .order-form textarea{
        font-family: 'Roboto Condensed', sans-serif;
        border: #ccc solid 1px;
        border-radius: 2px;
        padding: 10px;
        font-size:14px;
        width:99%;
        margin:0 0 10px 0  ;
        box-sizing:border-box;
    }
    .order-form textarea:focus{ outline: #212121 solid 1px!important;}

    .CaptchaPanel {
        margin: 0px 0px 0px 0px !important;
        text-align: center;
        padding: 0px !important;
    }

    .CaptchaWhatsThisPanel a{color: #212121!important}
    .CaptchaImagePanel,
    .CaptchaMessagePanel,  
    .CaptchaAnswerPanel, 
    .CaptchaWhatsThisPanel {
        margin:0px 0px 0px !important;
        font-size: 12px;
        color: #212121;
        text-align: left !important;
        font-weight:normal!important;
        padding:0px 0 0!important;
        box-sizing:border-box;
        }

    .CaptchaImagePanel{float:left;margin-right:10px !important;}
    .CaptchaMessagePanel{}
    #CaptchaAnswer{margin:0 0 10px 0!important; width:100%}
    fieldset{width:98%;box-sizing:border-box;margin:0 1% 15px;background:#fff;}*/


/* ================ FOOTER STYLES ============= */

    .footer {
        background: #212121;
        width: 100%;
        padding: 50px 0;
        color: #fff;
        font-family: 'Roboto Condensed', sans-serif;
    }
    .divfooter {
        max-width: 700px;
        width: 90%;
        text-align: center;
        margin: 0 auto;
    }
    .footertext {
        font-size: 14px;
        color: #fff;
    }
    a.footerlink:link, a.footerlink:visited, a.footerlink:active {
        color: #fff;
        font-size: 14px;
    }
    a.footerlink:hover {text-decoration:none;color: #ffc921;}
    .smallfootertext {
        font-size: 12px;
        color: #fff;
    }

/* ================ RESPONSIVE ============= */

@media screen and (max-width: 1530px) {
    .wrapper {width: 90%;}
}

@media screen and (max-width: 1120px) {
    article p, article h1{text-align: center}
    .headerbg {padding: 15px 0;}
    .logo {float: none; margin: 0 auto;}
    .logo img{margin: 0 auto; text-align: center; display: block}
    .header-direita { width: 100% ;display: block;float: none;text-align: center; margin: 0 auto }
    
    .quadrao{border: 0}
    #mainphoto {
        float: none;
        width: 100%;
        height: auto;
        border: 0
    }
    #mainphoto img{max-width: 100%;}
    #contactinfo {
        float: none; 
        width: 100%; 
        padding: 40px 0;
        height: auto;
        text-align: center;
    }
    .zoom-container { width: 50%;}
}

@media screen and (max-width: 975px) {
	.col_left {float:none; width:100%;}
	.col_right {float:none; width:100%;}
	.zoom-container .zoom-caption h4 {font-size: 18px;}
    .onethird {padding: 0;}
    .footright{margin:1em auto 0 auto}
    .twothird, .onethird {width: 100%;text-align: center; float: none; display: block}
    .locsqr h4{font-size: 15px}
}

@media screen and (max-width: 810px) {
    .column3 {float: none; width: 100%; display: block; margin: 0 auto}
    .staff img{width: 60%; margin: 30px auto 5px auto}
}

@media screen and (max-width: 700px) {
	.col_left {font-size:20px;}
	.zoom-container {width:49%;}
    .CaptchaPanel { width: 100%!important;}
    .order-form input.half {width: 99%;float: left;}
    .pad{padding:2em 0;}
}

@media screen and (max-width: 580px) {
	.formfield {width:100%;}
	.zoom-container {width:80%; float: none; margin: 0 auto; display: block}
    .staff img{width: 70%;}
}























