/*
	Site Developer : Karoline Dassie

	Main Colors
	-Yellow: #ffd812
	- White: #fff
	- Black: #000
	- Gray: #4c4c4c
    - Green: #76a12e
*/

/***** 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;}
ul.lista li{list-style:disc; margin-left: 5%}
.clear{clear:both;}	

/***** ESSENTIALS *****/

html, body{
	background:#000;
	font-family: 'Poppins', sans-serif;
	-webkit-text-size-adjust: none; 
}

::-moz-selection {
    background: #ffd812;
    color: #fff;
    text-shadow: none;
}

::selection {
    background: #ffd812;
    color: #fff;
    text-shadow: none;
}

.wrapper{
	max-width: 1200px;
	margin: 0 auto;
}

.column1 {width:100%;}
.column2 {width:50%; float:left; padding-right: 20px; box-sizing: border-box;}
.column3 {width:33.33333%; float:left; padding-right: 20px; box-sizing: border-box;}
.column4 {width:25%; *width: 25%; float:left; box-sizing: border-box;}
.column5 {width:20%; *width: 17%; float:left; padding-right: 20px; box-sizing: border-box;}
.column6 {width:16.66666%; float:left; padding-right: 20px; box-sizing: border-box;}

/***** FRAMELESS INVENTORY *****/


/***** TYPOGRAPHY *****/

h1{ font-size: 45px; font-weight: 900; color: #808080; text-transform: uppercase; font-family: 'Oswald', sans-serif; line-height: 45px}
h2{ font-size: 20px; font-weight: 500; color: #757575!important; text-transform: uppercase; margin-bottom: 15px}
h3{ font-size: 22px; font-weight: 300; color: #4D4D4D; font-family: 'Oswald', sans-serif;}
h4{ font-size: 20px; font-weight: 700; color: #fff; text-transform: uppercase; }
h5{ font-size: 18px; font-weight: 900; color: #ffd812; text-transform: uppercase;}
    h5 span{color:#fff}
h6{ font-size: 18px; font-weight: 900; color: #76a12e; text-transform: uppercase;}

p {
	font-size: 16px; 
	line-height: 26px;
	color: #5f5f5f;
    font-weight: 200;
}

a{
	color: #161616;
	text-decoration:none;
	transition: all .2s ease-in-out; 
	-moz-transition: all .2s ease-in-out; 
	-webkit-transition: all .2s ease-in-out;
}
a:hover{}
strong, b{font-weight:700}



/***** HEADER *****/
#mainimg{
    background:#000 url("../siteart/background1.jpg") no-repeat top center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding: 0;
    width:100%;  
}

#mainimgstill{
    background:#000 url("../siteart/background1.jpg") no-repeat top; 
    padding: 0;
    width:100%; 
    position: relative;
}

.header{padding:20px 0}

#topinfo{float:right; display: inline-block; padding-left: 40px; text-align: right; color: #4c4c4c !important}
#topinfo h2{margin-bottom:0; color:#7E7E7E !important}
#topinfo h6{font-size: 28px; line-height: 28px;}
#topinfo h6 a,#topinfo h6 a:link, #topinfo h6 a:active,#topinfo h6 a:visited{color:#76a12e !important}
#topinfo h6 a:hover{color:#ffd812 !important}
#topinfo .fa{font-size:30px !important; color:#4c4c4c !important;}
#topinfo a .fa {font-size:30px !important; color:#4c4c4c !important;}
#topinfo a:hover .fa {color:#000 !important;}
#topinfo .fab{font-size:30px !important; color:#4c4c4c !important;}
#topinfo a .fab {font-size:30px !important; color:#4c4c4c !important;}
#topinfo a:hover .fab {color:#000 !important;}

#logo{float:left;}
#logo img{max-width:100%; margin-top:15px} 

#headright{float:right;}

/***** QUICK SEARCH ON HEADER  *****/
.fab-facebook-square:before {
	color: #4c4c4c !important;
}
.search-box {
	width:100% !important;
	display:block !important;
	float:right !important;
}
.search-box input {
	width:100% !important;
	width:calc(90% - 100px) !important;
	padding:15px 10px !important;
	border:1px solid #dadad9 !important;
	color:#adadad !important;
	font-size:15px !important;
	float:right !important;
	background:#fff !important;
	vertical-align:top !important;
	-webkit-border-top-left-radius: 10px !important;
    -webkit-border-bottom-left-radius: 10px !important;
    -moz-border-radius-topleft: 10px !important;
    -moz-border-radius-bottomleft: 10px !important;
    border-top-left-radius: 10px !important;
    border-bottom-left-radius: 10px !important;
	height: inherit!important;
	line-height: normal !important;
}
.search-box input#submit,
.search-box input#submit:focus {
    width:100px !important; 
    margin:0 !important;
    padding:13px 0 !important;
    background:#ffd812 !important;
    color:#4c4c4c !important;
    border:1px solid #dadad9 !important;
    cursor: pointer !important;
    text-align:center !important;
	float:right !important;
    font-size:15px !important;
    font-weight:900 !important;
    
    -webkit-border-top-left-radius: 0 !important;
    -webkit-border-bottom-left-radius: 0 !important;
    -moz-border-radius-topleft:0 !important;
    -moz-border-radius-bottomleft: 0 !important;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    -webkit-border-top-right-radius: 10px !important;
    -webkit-border-bottom-right-radius: 10px !important;
    -moz-border-radius-topright: 10px !important;
    -moz-border-radius-bottomright: 10px !important;
    border-top-right-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
}
.search-box input#submit:hover {
	background:#4c4c4c !important;
	color:#fff !important;
    transition: all .2s ease-in-out !important; 
	-moz-transition: all .2s ease-in-out !important; 
	-webkit-transition: all .2s ease-in-out !important;
}

/***** STYLES CONTENT *****/
    .main{background: #fff; padding: 2em 0; position: relative}
    .contente{background: #fff; padding: 4em ; position: relative; margin-bottom: 2em; min-height: 230px}
        .contente h1{margin-bottom:20px}
    
    .pad{padding: 2em 0;}

    #deco{margin: 0 auto; text-align: center; max-width: 1230px}
    #deco img{
        margin: 0 auto; 
        display: block; 
        max-width: 100%; 
        z-index: 9999; 
        position: relative
    }
        
    a.black{color:#000; font-weight: 600}
    a.black:hover{color:#76a12e; }
    

    .texto{width:calc(100% - 310px); float: left;}
    .tilt {float:right;width: 310px;}
    .tilt img {
        -webkit-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }
    .tilt img:hover {
        -webkit-transform: rotate(20deg);
        -moz-transform: rotate(20deg);
        -o-transform: rotate(20deg);
        -ms-transform: rotate(20deg);
        transform: rotate(20deg);
        -webkit-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

    a.callout {
        display: block;
        width: 100%;
        max-width: 300px;
        margin: 1em auto 0 auto;
        text-align: center;
        text-transform: uppercase;
        font-size: 16px;
        color: #000;
        font-weight: 500;
        background: #76a12e;
        padding: 10px 0;
    }
a.callout:hover {background:#87b935}

/***** NAV *****/

#navicon {
	font-size: 22px;
	text-decoration: none;
	position: relative;
	z-index: 99999999999999999;
	color: #fff;
	background: #4c4c4c;
	padding: 5px 10px;
}

.nav{
	width: 100%;
	background: #4c4c4c;
	color: #fff;
}

.nav ul{
	list-style:none;
	position:relative;
	width: 100%;
	margin: 0 auto;
	z-index: 9999;
	text-align: center;
}
.nav > ul{
	display: flex;
}
.nav > ul > li{
	width: 100%;
	box-sizing: border-box;
}

.nav ul a{
	display: inline-block;
	width: 100%;
	box-sizing: border-box;
	color: #fff;
	text-decoration:none;
	font-size:15px;
    font-weight: 600;
	padding: 15px 0;
	text-align: center;
    border-right: 3px solid #545454;
    border-left: 2px solid #3e3e3e;
}

.nav ul a:hover{
	background: #ffd812;
	color:#4c4c4c;
}

.nav ul li{
	position:relative;
	*display: inline-block;
	display: inline-block;
	text-align: center;
    float: left;
}

.nav ul ul{
	display:none;
	position:absolute;
	top:100%;
	left: 0;
	padding:0;
	background: #ffd812;
	color: #FFF;
	width: 178px;
    margin-left:2px
}

.nav ul ul li{
	float:none;
	width: 178px;
}

.nav ul ul a{
	font-size: 14px;
	text-transform: none;
	color:#4c4c4c;
	padding:7px 0 ;
	width: 178px;
	border-top: 1px #4c4c4c solid;
    border-right:none;
    border-left:none;
}

.nav ul ul a:hover{background:#fff;}
.nav ul li:hover > ul{display:block}

/***** YELLOW SQUARES HOME PAGE *****/
#mato{
	padding: 6em 0 4em 0;
	background: url("../siteart/background2.jpg") no-repeat top center fixed; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	width:100%;
    margin-top:-1.2em
}
#mato h2{text-align: center}
#mato p{color:#4c4c4c}

.lastbt{margin-right:0!important}
a .content-direct-buttons{
    float:left;
    width:31.3%;
    margin-right:3%;
    -webkit-transition: 0.2s background-color ease-in-out;
    -o-transition: 0.2s background-color ease-in-out;
    transition: 0.2s background-color ease-in-out;
    display: block;
    padding: 20px 0 30px 0;
    background-color: #fedc08;
    text-align: center;

    line-height: 30px;
    font-size: 38px;
    text-transform: uppercase;
    color: #4c4c4c;
    font-family: 'Oswald', sans-serif;
}
a .content-direct-buttons p {
    font-size: 15px;
    color: #4c4c4c;
    text-transform:capitalize;
    font-weight: 200;
    font-family: 'Poppins', sans-serif;
}
a .content-direct-buttons .fa {
    font-size: 25px;
    color: #fff;
}

a .content-direct-buttons:hover{background-color: #ceb400; color:#fff}
a .content-direct-buttons:hover p{ color:#fff!important}
a .content-direct-buttons:hover .fa{ color:#4c4c4c!important}

/***** 2 BUTTONS ON HOME PAGE *****/

a .content-action-buttons {
    float:left;
    width:47%;
    margin-right:3%;
    -webkit-transition: 0.2s background-color ease-in-out;
    -o-transition: 0.2s background-color ease-in-out;
    transition: 0.2s background-color ease-in-out;
    display: block;
    padding: 15px 0 ;
    background-color: rgba(0, 0, 0, 0.49);
    text-align: center;
    border: 8px solid #fff;

    line-height: 30px;
    font-size: 38px;
    text-transform: uppercase;
    color: #ffd812;
    font-family: 'Oswald', sans-serif;
}
a .content-action-buttons  p {
    font-size: 15px;
    color: #fff;
    text-transform:capitalize;
    font-weight: 200;
    margin-top: 15px;
    font-weight: 600;
    font-family: 'Poppins', sans-serif;
}
a .content-action-buttons:hover{background-color: rgba(220,220,220,0.49); color:#4c4c4c!important}
a .content-action-buttons:hover p{ color:#4c4c4c!important}

/***** ZOOM *****/
.hidezoom{display:block}
.zoom-container {
	float:left;
	width: 20%;
	*width: 20%;
	position: relative;
	overflow: hidden;
	display: inline-block;
	font-size: 1rem;
	margin:0;
	vertical-align: top;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
.zoom-container img {
	display: block;
	width: 100%;
	height: auto;
	-webkit-transition: all .5s ease; /* Safari and Chrome */
    -moz-transition: all .5s ease; /* Firefox */
    -ms-transition: all .5s ease; /* IE 9 */
    -o-transition: all .5s ease; /* Opera */
    transition: all .5s ease;
}
.zoom-container .zoom-caption {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 10;
	background: rgba(0, 0, 0, .5);
	-webkit-transition: all .5s ease; /* Safari and Chrome */
    -moz-transition: all .5s ease; /* Firefox */
    -ms-transition: all .5s ease; /* IE 9 */
    -o-transition: all .5s ease; /* Opera */
    transition: all .5s ease;
}
.zoom-container .zoom-caption h1 {
	display: block;
	text-align: center;
	margin: 100% 0 0;
	font-size: 30px; 
	font-weight: 700; 
	color: #fff; 
	text-transform: uppercase;
}
.zoom-container:hover img {
	-webkit-transform:scale(1.25); /* Safari and Chrome */
    -moz-transform:scale(1.25); /* Firefox */
    -ms-transform:scale(1.25); /* IE 9 */
    -o-transform:scale(1.25); /* Opera */
     transform:scale(1.25);
}
.zoom-container:hover .zoom-caption {
	background: none;
}


/***** BUTTONS ON THE INVENTORY LAYOUT HTM *****/

.yellow-buttons {
	width: -moz-fit-content;
	float: right;
	display: block;
	padding: 10px 15px 10px 0px;
	margin: auto 0;
	}

.topinvbuttons {
    width: 100%;
    /*float: right;*/
    margin-bottom: 20px;
    padding: 6px;
	}

.topmessage {
    padding: 6px;
}

#formbutton a {
	display: inline;
    color: #365727;
    background: #fee800;
	font-kerning: auto;
	font-weight: 600;
    border: 2px solid #4a7537;
    box-sizing: border-box;
	padding: 5px
	}

#formbutton a:hover {
    color: #fee800;
    background: #4a7537;
	}



/***** SLIDESHOW *****/
    .gray{
        background:#4c4c4c; 
        padding: 2em 0 3.5em 0; 
        margin-bottom: -1.5em;
    }
    
    .gray img{display: block; margin: 0 auto; width: 100%}
        
/***** CONTACT *****/
    iframe.mapa{width:100%; height: 460px;}

/***** FORM *****/

    #formpage {font-size: 16px;
        margin: 15px 0;
    }

    .form-input {
        width: 100%;
        margin: 0 0 15px;
    }

    .form-input2 {
        width: 49%;
        margin: 0 0 15px;
        display: inline-block;
    }

    .form-input3 {
        width: 100%;
        margin: 0 0 15px;
        display: block;
    }

 
.formheader {
    padding-bottom: 10px;
    width: 100%;
    
}

.formheader h3 {
    text-align: center;
    margin: auto;
    padding: 5px;
    background-color: #F7F7F7;
}

#formpage text2 {
        padding:10px;
        border:1px solid #ccc;
        color:#8e8d8d;
        font-size:12px;
        width: 100%;
        height: 200px;
        box-sizing: border-box;
        font-family: 'Poppins', sans-serif;
    }

    #formpage input {
        padding:10px;
        border:1px solid #ccc;
        color:#8e8d8d;
        font-size:12px;
        width: 100%;
        box-sizing: border-box;
        font-family: 'Poppins', sans-serif;
    }

    #formpage textarea {
        padding: 10px;
        border:1px solid #ccc;
        color:#8e8d8d;
        font-size:12px;
        width: 100%;
        height: 80px;
        box-sizing: border-box;
        font-family: 'Poppins', sans-serif;
    }

    #formpage select {
        padding:10px 5px;
        border:1px solid #ccc;
        color:#8e8d8d;
        font-size:12px;
        width: 100%;
        box-sizing: border-box;
    }

    #formpage input:focus,
    #formpage textarea:focus,
    #formpage select:focus {
        color:#8e8d8d;
        border:1px solid #ffd812;
        outline-style:none;
    }

    #formpage input.button,
    #formpage input.button:focus {
        cursor: pointer;
        width:100%; 
        margin: 10px auto;
        padding: 10px 0;
        background:#ffd812;
        border:2px #fff solid;
        -moz-border-radius:8px;
        -webkit-border-radius:8px;
        border-radius:8px;
        font-size:16px;
        color:black;
        text-transform: uppercase;
        font-weight: 700;
    }
    #formpage input.button:hover {
        background: #000;
        color: white;
    }

/*control the Captcha */

    .CaptchaPanel {
    margin:0 0 0 0 !important;
    padding:0 0 0 0 !important;
    text-align: center;
    line-height:normal !important;
    }

    .CaptchaPanel input{
    width: 250px !important;
    }

    .CaptchaImagePanel {
    margin:0 0 0 0;
    padding:0!important;
    }

    .CaptchaMessagePanel {
    padding:0 0 0 0 !important;
    margin:0 0 0 0 !important;
    font-weight:normal !important;
    font-size:12px;
    line-height:14px;
    }

    .CaptchaAnswerPanel {
    margin:0 0 0 0;
    padding:2px 0px 2px 0px !important;
    }

    .CaptchaWhatsThisPanel {
        line-height:0;
        margin:0 0 0 0;
        padding:8px 0 8px 0 !important;
    }
    .CaptchaWhatsThisPanel a {color:#000;}
    .CaptchaWhatsThisPanel a:hover {text-decoration:none;}  


/***** SHIPPING AND FINANCING PAGES  *****/

.greenit p a{ color:#537A12!important; font-weight: 700}

.respimgFIN {
    max-width: 100%;
    float: left;
    width: 25%;
}
.respimgSHI {
    max-width: 100%;
    float: left;
    width: 33%;
}

/***** FOOTER  *****/

    .foot{
        background: #000;
        padding:2em 0;
        color: #fff;
        line-height: 27px
    }
    .foot p{color: #828282; font-size: 16px}
    .foot .fa-angle-right{color:#ffd812}

    .foot h5 a:link, .foot h5 a:active, .foot h5 a:visited {color:#ffd812;font-size: 18px;}
    .foot h5 a:hover {color:#76a12e}

    .foot a:link, .foot a:active,.foot a:visited {color: #ccc; font-size: 16px}
        .foot a:hover{color: #fff;}
        
    .divfooter {text-align:right;}
    .divfooter p,.divfooter a:link,.divfooter a:active, .divfooter a:visited{font-size: 13px;color: #ccc;}
        .divfooter a:hover{color: #fff;}

/***** FACETED INVENTORY *****/

.faceted-search-content .faceted-section-head h5 span, .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, .currency-selector, .compare-listings-container .compare-container .comp-header-img .comp-title-close-cont .compare-title h3, .bread-crumbs-heading .return-links .return-links-link, .info {
	color: #000 !important;
}
.listing-prices__retail-price {
	color: #4a7537 !important;
}

.faceted-search-content .selected-facets-container .selected-facet, .view-listing-details-link, .buy-now-link, .detail-content .detail-main-body .main-detail-data .offer-btn, .detail-content .detail-main-body .main-detail-data .buy-btn, .compare-listings-container .compare-container .button, .modal-bg .form-bottom .captcha-and-submit .captcha-placeholder button, .modal-bg .form-bottom .captcha-and-submit .captcha-placeholder input, .detail-content-mobile .contact-options a, .detail-content-mobile .detail-contact-bar .contact-bar-btn {
	    color: #4a7537 !important;
    background: #fee800 !important;
    border: 2px solid #4a7537 !important;
	font-weight: bold !important;
}

.detail-content .dealer-info .phone-and-email .send-email-btn {
	
    border: 2px solid #4a7537 !important;
	color: #4a7537 !important;
}


.detail-content .search-results, .compare-listings-container .compare-container .compare-price, .list-content .list-main-section .list-container .list-listing .listing-top-right .listing-dealer-info .dealer-name {
	color: #4a7537 !important;
}

.detail-content-mobile .detail-additional-data .data-row .data-label, .detail-content .detail-additional-data .data-row .data-label {
	background:#4a7537 !important;
}

/***** RESPONSIVE STYLES *****/

.show-menu-for-mobile {display:none;}  

    
@media screen and (max-width: 1023px) and (min-width:911px) {
	.show-menu-for-mobile {display: none;}
}

@media screen and (max-width:1100px){
	.wrapper{width:90%;}
    a .content-action-buttons{width:46.5%}
    .nav ul a{font-size:13px;}
}

@media screen and (max-width:1024px){
	.column2{float:none; width:100%; padding: 0; margin: 10px auto}
	.column4{ width: 50%; text-align: left;}
    .foot .column4{ margin:1em 0}
    
    #mato {padding: 3em 0 2em 0}
    a .content-direct-buttons {width:100%; padding: 5px 0 10px 0; margin:1% auto;float: none}
    a .content-action-buttons{width:96%; float:none; margin:1% auto; padding:10px 0 5px 0}
    
    .zoom-container .zoom-caption h1{font-size:20px}
    .pad{padding:1em 0}
}

@media screen and (max-width: 910px) and (min-width:796px) {
	.show-menu-for-mobile {display: none;}
}

@media screen and (max-width: 795px) and (min-width: 571px) {
	.show-menu-for-mobile {display: block;}
	.hide-for-mobile {display:none;}
	#nav  {display:none;}
	.nav  {display:none;}
	.mobile-center{ text-align: center;}
	.fa-caret-down{display:none!important}
}

@media screen and (max-width: 795px){
	h1{font-size:30px}
	h2{font-size: 18px}
	h3{font-size:15px}
    p{font-size:15px}
    
    a .content-direct-buttons{font-size:30px}
    a .content-action-buttons{font-size:30px}
    a .content-action-buttons p{font-size:13px; margin-top: 5px}
    
    .search-box{display:none}
    #topinfo h2{display:none}
    #headright{text-align: center}
    
    #topinfo{float:none; margin: 0 auto; padding: 0 ; text-align: center}
    #logo{float:none; margin: 0 auto; display: block;}
    #logo img{float:none; margin: 0 auto; display: block; max-width: 270px; margin-bottom: 10px}
    #headright{float:none; margin: 0 auto; display: block;}
    
	#logo{float: none;margin: 0 auto;}
	.column4{ float: none; width: 100%; text-align: center}
	.ultimo{margin-top:15px}
    
    .hidezoom{display:none}
    .zoom-container img{margin-top: -400px;}
	.zoom-container {
		float: none;
		width: 100%;
		margin:0 auto;
		height: 100px;
    }
    .zoom-container .zoom-caption h1{margin:0 auto; line-height: 100px;font-size:24px}
    
    .contente{background: #fff; padding: 2em ;  min-height:auto}
        .contente h1{margin-bottom:10px}
    .main{padding:1em 0}
    
    .texto{width:100%; float: none;}
    .tilt {width:100%; float: none; margin: 0 auto; text-align: center}
    .tilt img {width:200px}
    .respimgFIN {
        float: none;
        margin: 0 auto;
        width: 70%;
        display:block;
        text-align: center
    }
    .respimgSHI {
        float: none;
        margin: 0 auto;
        width: 70%;
        display:block;
        text-align: center
    }
}

@media screen and (max-width: 570px) and (min-width: 401px) {
	.show-menu-for-mobile {display: block;}
	.hide-for-mobile {display:none;}
	#nav  {display:none;}
	.nav  {display:none;}
	.mobile-center{ text-align: center;}
	
}

@media screen and (max-width: 400px){
	.show-menu-for-mobile {display: block;}
	.hide-for-mobile {display:none;}
	.hide {display:none;}
	#nav  {display:none;}
	.nav  {display:none;}
	#top{display:none;}
	.column3{ float: none; width: 100%; margin: 0 0 10px;}
	.column4{ float: none; width: 100%;}
	.column5{ float: none; width: 100%; text-align: center; margin: 0 0 25px}
	.mobile-center{ text-align: center;}

}