﻿/* 
    Website Developer: Karoline Dassie

    Main Colors:
    - Red: #d52726
    - White: #fff
    - Light Gray: #393939
    - Black: #181818
*/

/*==========================================================

    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;}

    svg:not(:root) {overflow: hidden;/*reset*/}

/*image replacement*/
    .hide-text {
        text-indent:  100%;
        white-space:  nowrap;
        overflow:  hidden;
        }	

    hr {
        -moz-box-sizing: content-box;
        box-sizing: content-box;
        border-style: solid;
        height: 0;
        color: #ccc;
        margin: 10px 0;
        } 

    img { border: 0; max-width:100%;} 
    img.imgresp{max-width: 100%;}

    /* Make HTML 5 elements display block-level for consistent styling */  
    header, nav, article, footer, address { display: block;  } 

    /* Clearfix */
    .cf:before,.cf:after {content: " ";display: table;}
    .cf:after {clear: both;}
    .cf {*zoom: 1;}
    .clear{clear: both}
    /* clear floats */ 
    .group:before,
    .group:after {content: ""; display: table;} 
    .group:after {clear: both;}
    .group {zoom: 1;}	
    .clear { clear: both;}

    ::-moz-selection {
        background: #d52726; 
        color: #fff;
        text-shadow: none;
    }
    ::selection {
        background: #393939;
        color: #fff;
        text-shadow: none;
    }

    html, body{
        -webkit-text-size-adjust: none; 
        -ms-text-size-adjust: 100%; 
        margin: 0;
        padding: 0;
        background: #181818!important;
        line-height: normal; 
        font-family: 'Roboto Condensed';
    }

/*==========================================================

    TYPOGRAPHY

===========================================================*/
    h1,h2,h3{font-family: 'Roboto Condensed';}

    h1 { font-weight:900; color:#ebebeb; font-size:36px; line-height:normal; margin-bottom:20px; text-transform: uppercase}
	h2 { font-weight:500; color:#ebebeb; font-size:25px; line-height:normal; }
	h3 { font-weight:900; color:#181818; font-size:25px; text-transform: uppercase; margin-bottom: 10px }
	h4 { font-weight:800; color:#393939; font-size:15px; text-transform: uppercase;}
	h5 { font-weight:600; color:#fff; font-size:23px; border-bottom: 3px solid #d52726} 
    strong{font-weight: 900}
	p, ul, ol, li { font-size: 15px; font-weight: 400; color: #5f5f5f; line-height: 26px; }
    
    a, button, .button, a:hover, button:hover, .button:hover, button.mobile_btn::after {
        -webkit-transition:all .45s ease;
        -moz-transition:all .45s ease;
        -ms-transition:all .45s ease;
        -o-transition:all .45s ease;
        transition:all .45s ease;
    } 
    
    a:link, a:visited, a:active {text-decoration:none; color: #393939; }
    a:hover {text-decoration:none;}
    .center{text-align: center!important}
    .right{text-align: right}
    .graybg{background: #393939}

/*==========================================================

    FRAMELESS INVENTORY 

===========================================================*/
    .hosted-content p{color: #000!important}
    .hosted-content h1{text-align: left; color: #000!important; text-transform: capitalize}
    .hosted-content h5{text-align: left}
    .hosted-content .listings-wrapper .listings-list .category-banner h3{line-height: normal!important; font-size: 23px!important; color: #d52726!important}
    .hosted-content .m-top-20{margin-top: 0!important}
    .hosted-content .listings-wrapper .listings-list .listing-banner h2{font-size: 24px!important}
    .listings-wrapper .listings-list .listing-banner {background: #d52726!important;}
    .attachment-search .search-checkboxes label .row input[type="checkbox"] {width: auto!important}
    
    a.catgbtn{display:inline-block; padding: 10px 20px; border: 1px solid #fff; color: #fff; margin:3px 1px }
    a.catgbtn:hover{background: #d52726; color: #fff}
        
/*==========================================================

   Faceted INVENTORY 

===========================================================*/

.faceted-search-content .faceted-section-head h5 {font-size:16px;}

.list-content .listing-bottom .listing-description-text {text-transform:lowercase;}

.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 {color:#d52726!important;}

.faceted-search-content .selected-facets-container .selected-facet {background:#d52726!important;}

.faceted-search-content .faceted-section-box .faceted-view-more-btn {background:#d52726!important;}

.view-listing-details-link {background-color:#d52726!important;}

.list-content .list-main-section .list-container .list-listing .listing-top .listing-top-left .listing-main-stats .price {color:#000;}

.detail-content .detail-main-body .main-detail-data .offer-btn, .detail-content .detail-main-body .main-detail-data .buy-btn {background:#d52726!important;}
.detail-content .detail-main-body .main-detail-data .offer-btn:hover, .detail-content .detail-main-body .main-detail-data .buy-btn:hover {background:#000;}

.detail-content .detail-main-body .main-detail-data .detail-price {color:#d52726!important;}

.detail-content .detail-additional-data .data-row .data-label, .detail-content-mobile .detail-additional-data .data-row .data-label {background-color:#d52726!important;}

.detail-content .dealer-info .phone-and-email .send-email-btn{ color:#000;border:1px solid #000;}

.detail-content .dealer-info .phone-and-email .send-email-btn:hover { color:#d52726!important;border:1px solid #f9c138;}

.detail-content .search-results{color:#d52726!important;}

.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 .buy-btn-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  {background:#d52726!important;border:1px solid #000;}

.detail-content-mobile .detail-main-body .main-detail-data .dealer-phone-mobile-container .dealer-phone-mobile:hover, .detail-content-mobile .detail-main-body .main-detail-data .buy-btn-mobile, .detail-content-mobile .detail-main-body .main-detail-data .offer-btn-mobile:hover, .detail-content-mobile .detail-main-body .main-detail-data .send-email-btn-mobile:hover {background:#000;}

.mobile-breadcrumb {background:#000;}

.faceted-search-content .faceted-section-box .faceted-option-checkbox-container label input {width: auto!important;
        font-size:12px!important;
        padding-top: none!important;
        }
.faceted-search-content .faceted-section-box .faceted-option-checkbox-container label {font-weight:normal!important; font-size:12px!important; width:auto!important;}
.list-content .list-listing-mobile .price-container .price {color:#d52726!important;}

.list-content .list-listing-mobile .dealer-phone-container .dealer-phone-call {color:#000;border:1px solid #000;}

.list-content .list-top-section .listing-option-bar .list-listings-count{color:#d52726!important;}
article p { color:#fff!important;}
.paging-container .page-navs .list-page-nav, .mobile-breadcrumb {background-color:#000!important;}

.modal-content .modal-top .modal-title, .listing-dealer-info a, .dealer-info a, .detail-content-mobile .detail-main-body .main-detail-data .detail-price, .detail-content-mobile .detail-main-body .detail-mobile-title h1 {color:#d52726!important;}
.list-content .list-main-section .list-container .fin-calc, .fin-calc p {color:#000;}
.detail-content-mobile .detail-contact-bar .contact-bar-btn, .contact-options a {background:#d52726!important;}

.list-content h5 {color:#000!important; border-bottom:none!important;}
.faceted-search-content .faceted-section-head h5 { color:#000!important; }
.info {color:#000;}

.list-content, .list-title, .list-title-text h1 {color:#000!important;}
.detail-content .detail-main-body .main-detail-data .details-fin-calc .detail-btn-calc p, .fin-calc p { color: #000!important;}
.detail-content .dealer-info .phone-and-email .send-email-btn {
    color: #d52726!important;
    border: 1px solid #d52726!important;
}
.headrighthalf p, .headrighthalf a {color:#fff!important;}

/*==========================================================

    LAYOUT STYLES

===========================================================*/

	.column1 {width:100%;}
	.column2 {width:50%; float:left; box-sizing: border-box; color:#fff;}
	.column3 {width:33.33333%; float:left; padding:0 ; 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}
    
    article{background: #fff}
    .wrapper{ width:96%; margin:0 auto; padding:0; max-width:1200px; position:relative}
    .white{background:#fff;}
   
/*==========================================================

    HEADER STYLES 

===========================================================*/
.graybg {
	
}
    #headerwrap{
        position:relative;
        margin:0;
        padding:20px 0;
        background:#000 url("../siteart/pattern.jpg") repeat;
        -webkit-box-shadow: 0px 2px 5px 0px rgba(195, 195, 195, 0.6);
        -moz-box-shadow: 0px 2px 5px 0px rgba(195, 195, 195, 0.6);
        box-shadow:0px 2px 5px 0px rgba(195, 195, 195, 0.6);
    }

    .logo{float:left; width:230px; background: #fff;}
    .logo img{max-width: 230px; width: 100%; display: block; margin: 0 auto; }
    .header-right{float:right; width:calc(100% - 230px); text-align: right; margin:20px 0 0 0}

    .headrighthalf{float: right; text-align: right; margin: 0 0 0 20px}    
    .headrighthalf p, .headrighthalf a{color:#ebebeb}
    .headrighthalf a:hover{color: #d52726}

/*==========================================================

    NAVIGATION

===========================================================*/
/* see menumaker.css for additional nav styles */


/*==========================================================

    SLIDESHOW

===========================================================*/

    .slides{background:#fff;padding:0;color:#fff;position:relative;}

    .cycle-slideshow{box-shadow: 0px 2px 5px 1px rgba(0,0,0,.75);}
    .cycle-slideshow img{
        width:100%;
        max-width: 100%;
    }

    /* pager */
    .cycle-pager { 
        text-align: center;max-width: 100%; width: 100%; z-index: 500; position: absolute; bottom: 10px; overflow: hidden;display:none;
    }
    .cycle-pager span { 
        font-size: 50px; width: 16px; height: 16px; 
        display: inline-block; color: #ddd; cursor: pointer; transition: all .5s ease-in-out; 
    }
    .cycle-pager span.cycle-pager-active { color:#2885b3;}
    .cycle-pager > * { cursor: pointer;}


/*==========================================================

    CONTENT STYLES

===========================================================*/

    .pad{padding:3em 0;}
    .padpouco{padding:0 0 2em 0;}
    .padtxt{padding:10px 40px;}
    .rightfoto{float:right}

    .formcont{background: #d52726}
    .formcont p{color: #fff; font-weight: 700; font-size: 17px}

    iframe.mapa{border:0; width:100%; height: 400px; display: block}
    article p{font-size: 17px; line-height: 30px; color: #ebebeb}
 

/*==========================================================

    HOME PAGE

===========================================================*/

    .boxtres{float: left; width: 33.33%; text-align: center; padding: 1em 0 2em 0;}
    .redbg{background:#d52726}
    .blkbg{background:#181818}
    .blkbg h3{color: #fff}
    .boxtres:hover{
        background: #393939;
        -webkit-transition:all .45s ease;
        -moz-transition:all .45s ease;
        -ms-transition:all .45s ease;
        -o-transition:all .45s ease;
        transition:all .45s ease;
    }

/*==========================================================

    SCROLLING INVENTORY

===========================================================*/

    .scrolling-wrap {
        width:100%;
        height:90px;
        overflow:hidden;
        background:#fff;
        padding: 2em 0;
    }

    .scrolling{
        width:100%;
        height:92px;
    }

/*==========================================================

    CONTACT PAGE

===========================================================*/

    #contbox{background:#39393d; float: left; text-align: center; width: 27%; margin: 1%; padding: 2%}
    #contbox i{ color:#d52726; font-size: 50px; margin-right: 10px}
    #contbox p{ font-family: 'Roboto Condensed'; color: #fff; font-size: 28px}    
    #contbox a{color: #fff}

/*==========================================================

    FORM

===========================================================*/
    .formcont {
        background: #f8f8f8;
        padding: 2%;
        margin: 1em auto;
    }
    .order-form{display:block;}
    #formpage{padding:0;}
    form{ margin:0 0 0;}
    label{
        display:block;
        font-size:16px;
        padding-top: 4%;
        width:100%;
    }
    input{
        border: #d52726 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';
    }
    input.half{width:49%;float:left;}

    input:focus{ outline: #d52726 solid 1px!important;}

    input.button2{
        display:block;
        width: 300px;
        padding: 15px 0;
        margin: 20px 0 0 0;
        background-color:#d52726;
        color:#000;
        font-weight: 900;
        font-size: 22px;
        border: 0;
        -webkit-transition:.3s ease-in;  
        -moz-transition:.3s ease-in;  
        -o-transition:.3s ease-in;  
        transition:.3s ease-in;
    }

    input.button2:hover{
        background-color:#181818;
        cursor:pointer;
        color: #fff;
    }

    select{
        border:#d52726 solid 1px;
        border-radius: 2px;
        padding: 2%;
        font-size:14px;
        box-sizing:border-box;
        width:98%;
        margin:0 1% 10px;
        color:#969696;
    }
    select.half{width:48%;float:left;}

    textarea{
        font-family: 'Roboto Condensed';
        border: #d52726 solid 1px;
        border-radius: 2px;
        padding: 10px;
        font-size:14px;
        width:99%;
        margin:0 0 10px 0  ;
        box-sizing:border-box;
    }
    textarea:focus{ outline: #d52726 solid 1px!important;}

    .CaptchaPanel {
        margin: 0px 0px 0px 0px !important;
        text-align: center;
        padding: 0px !important;
    }

    .CaptchaWhatsThisPanel a{color: #39393d!important}
    .CaptchaImagePanel,
    .CaptchaMessagePanel,  
    .CaptchaAnswerPanel, 
    .CaptchaWhatsThisPanel {
        margin:0px 0px 0px !important;
        font-size: 12px;
        color: #39393d;
        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{color: #39393d;}
    #CaptchaAnswer{margin:5px 0; width:395px}
    fieldset{width:98%;box-sizing:border-box;margin:0 1% 15px;background:#fff;}

    .centrocerto .CaptchaImagePanel {
        float: none;
        margin: 0 auto !important;
    }
    .centrocerto #CaptchaAnswer{width: 100%}
    .centrocerto .CaptchaImagePanel,.centrocerto .CaptchaMessagePanel,.centrocerto .CaptchaAnswerPanel,.centrocerto .CaptchaWhatsThisPanel{text-align: center!important;}
    .centrocerto input.button2{width:100%; margin:10px auto 0 auto}
    
    

/*==========================================================

    FOOTER STYLES

===========================================================*/
    .footwrap{
        padding: 1em 0;
        width: 100%;
        margin: 0 auto;
        background: #000;
    }
    .footwrap p{color: #fff; font-size: 15px; font-weight: 600;}
    .footwrap a:link,.footwrap a:visited,.footwrap a:active {color: #fff}
    .footwrap a:hover{color: #ce2320}

    .footright{float:right; text-align: right;}
    .footleft{float:left; text-align: left}

/*==========================================================

    RESPONSIVE STYLES

===========================================================*/
    
/* iPads (portrait and landscape) ----------- */

@media screen and (max-width: 1080px) {
    #contbox p {font-size: 20px;}
}
    
@media screen and (max-width: 1025px) {
    .pad {padding: 2em 0;}
    #mainimg{padding: 5em 0;}
}

@media screen and (max-width: 850px) {
    article h1{text-align: center; font-size: 30px }
    article h2{text-align: center; font-size: 22px}
    article h5{text-align: center;}
    article p{text-align: center; font-size: 16px;line-height:25px;}
    
    .padpouco{display: none}
    a.catgbtn{display:block; padding:5px; border: 1px solid #fff; color: #fff; margin:1px; text-align: center}
    .wrapper {width: 90%;}
    
    #contbox{    
        float: none;
        width: 100%;
        margin: 1% auto;
        padding: 1% 0;
    }
    #mobilemore{display: block; padding-top: 2em;}
    #mobileless{display: none}
    
    .column2 {width:100%; float:none; padding:0 ; margin: 0 auto; text-align: center}
}


/* iPhone 5, 6, 6+ ----------- */

@media screen and (max-width: 736px){
    
    .pad {padding:1em 0;}
    .column3 {width:100%; float:none; padding:10px 0 ; margin: 0 auto; text-align: center}
    
    .CaptchaImagePanel {
        float: none;
        margin: 0 auto !important;
    }
    #CaptchaAnswer{width: 100%}
    .CaptchaImagePanel, .CaptchaMessagePanel, .CaptchaAnswerPanel, .CaptchaWhatsThisPanel{text-align: center!important;}
    input.button2{width:100%; margin:10px auto 0 auto}
    
    #headerwrap {padding: 10px 0;}
    .header-right {
        float:none;
        width: 100%;
        text-align: center;
        margin:10px auto 0 auto; 
        padding: 0;
    }
    .logo {    
        float:none;
        width: 100%;
        padding: 5px 0;
    }
    .headrighthalf {
        text-align: center;
        margin: 0;
        width: 50%;
    }
    input.half{width:98%;float:left;}
    .menubaixo a { display: block;}
    .bottom img {float: none;}
    
    .boxtres {
        float: none;
        width: 100%;
        text-align: center;
        padding: 10px 0;
    }
    .boxtres img{width: 90px}
    
    iframe.mapa{height: 310px}
    .footwrap{text-align: center;}
    .footleft, .footright{float: none;text-align: center;}
}

@media screen and (max-width:500px){
    .header-right { margin: 10px auto 0 auto;}
    .headrighthalf {
        float:none;
        width: 100%;
        text-align: center;
        margin: 0 auto;
    }
    
    #mainimg{padding: 2em 0;}
    #ylclear{width:80%;}
    a.yellowbtn{max-width:100%}
}
