@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: #fff;
}

.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%;
    }
}