/*
	Site developed by Karoline Dassie
	
	Color information
	- White: #fff
	- Beige: #eaddca
	- Light Brown: #8b7961
	- Brown:#7b6a58
*/

/*===================== 
	CSS reset/normalize 
=======================*/

	/**Correct `block` display not defined in IE 8/9.**/
	article,aside,details,figcaption,figure,footer,header,hgroup,
	main,nav,section,summary {display: block;}
	pre {white-space: pre-wrap;}
	svg:not(:root) {overflow: hidden;/*reset*/}
	img { border: 0;} 
	hr{margin:1em 0}
	.clear { clear: both;}

/*===================== 
	base styles 
=======================*/
	
	body {
		font-family: 'Open Sans', sans-serif;
		-webkit-text-size-adjust: none;
		padding:0;
		margin: 0;
		background:#fff;
		line-height:normal;
	}

	.center {text-align:center}
	.sitewidth {max-width:1100px; margin:0 auto}

	.column1 {width:100%;}
	.column2 {width:50%; *width: 50%; float:left; padding-right: 20px; box-sizing: border-box;}
	.column3 {width:33.33333%; *width: 30%; float:left; padding-right: 20px; box-sizing: border-box;}
	.column4 {width:25%; *width: 25%; float:left;  box-sizing: border-box;}
	.column5 {width:20%; float:left; padding-right:1%; box-sizing: border-box;}
	.column6 {width:16.66666%; *width: 14%; float:left; padding-right: 20px; box-sizing: border-box; margin: 0 0 20px 0;}
	
	.twothird{width:70%; *width: 70%; float:left;  box-sizing: border-box;}
	.onethird{width:30%; *width: 30%; float:left; box-sizing: border-box; }
	.onethird img{max-width: 100%}

	.last{padding-right:0; margin-right:0;}
/*===================== 
	typography 
=======================*/

	::-moz-selection {
		background:#7b6a58;
		color: #fff;
		text-shadow: none;
	}
	
	::selection {
		background:#7b6a58;
		color: #fff;
		text-shadow: none;
	}
	
	strong,b { font-weight:700;}
	
	
	h1 {
		text-transform:uppercase;
		font-size:30px;
		color:#7b6a58;
		font-weight:900;
	}
	h1 span{color:#eaddca}
	
	h2 {
		text-transform:uppercase;
		font-size:20px;
		color:#7b6a58;
		font-weight:300;
		}

	h3 {
		font-size:16px;
		color:#8b7961;
		font-weight:500;
		margin-bottom: 20px;
		}
	
	h4{
		font-size:35px;
		color:#fff;
		font-weight:500;
		text-transform:uppercase;
	}
	
	 h5{
		font-size:13px;
		color:#7b6a58;
		font-weight:500;
		 line-height: 1.7em
	 }

	 p {
		font-size:13px;
		color:#5c5750;
		font-weight:500;
		line-height: 2em
	}
	
/*===================== 
	link styles 
=======================*/
	.text a,
	.text a:link, 
	.text a:visited, 
	.text a:active{color:#7b6a58; text-decoration:underline}
	.text a:hover{color:#000; text-decoration:none}
	
	a:focus {outline: thin dotted;/*reset*/}

	a,
	a:link, 
	a:visited, 
	a:active {
		outline: 0;/*reset*/
		color:inherit; 
		text-decoration:none;
		}
		a:hover  {
			outline: 0;/*reset*/
			text-decoration: none!important;
			opacity:0.5;
			transition:background-color 300ms ease, background-color 300ms ease, all 300ms ease;
			}

/*===================== 
	header styles 
=======================*/

	header {
		text-align:center;
		background: #fff;
		-webkit-box-shadow: 0px 1px 5px 0px #7b6a58;
		-moz-box-shadow: 0px 1px 5px 0px #7b6a58;
		box-shadow: 0px 1px 5px 0px #7b6a58;
		position: relative;
		padding: 15px 0
	}

	#headleft h3{display: inline-block}

	#headleft {float: left; width: 33.33%; margin-top: 25px; text-align:left}
	#socialmedia {float: left; width: 33.33%; margin-top: 25px; text-align:right}
	#socialmedia-mobile{display:none;}
	#socialmedia img{ max-width:25px; margin-left:5px; display: inline-block}

	#headmobile{display:none}

	.logo {float: left; width: 33.33%}

	.logo img{
		margin:5px auto;
		width:100%;
		display: block;
		max-width:260px;
		transition:background-color 300ms ease, background-color 300ms ease, all 300ms ease;
	}
	.logo img:hover{opacity:0.5}

/*===================== 
	nav styles 
=======================*/
/* See menumaker.css */
	

/*===================== 
	layout styles 
=======================*/

	article{background:#fff}
	.pad{padding:3em 0}

	
/*===================== 
	HOME PAGE
=======================*/
    
	#mainvideo {
		/*width:60%; */
        width:52%; 
		float: left;
        display: inline-block;
        overflow: hidden;
        background: #000;
        height:324px;
        text-align:center;
	}

	#mainvideo video{
        width:100%;
        display: inline-block;
        background: #000;
        text-align:center;
        overflow: hidden;
        height:324px;
    }

	#mainlinks {
		/*width:40%; */
        width:48%;
		float: left; 
	}
		#calloutlink{
			width:100%;
			display: block;
			background:#eaddca; 
			text-align: center; 
			padding: 16px 0; 
			border-bottom:1px solid #7b6a58 ;
			text-transform:uppercase;
			font-size:18px;
			color:#7b6a58;
			font-weight:300;
		}
		#calloutlink:hover{opacity:1; background:#7b6a58; color: #eaddca!important;}

		#certified {background: #fff; opacity:1; padding:13px 0  5px 0; text-align: center;border-bottom:1px solid #7b6a58;}
		#certified img{height: 70px; display: inline-block}

		#mainlinks a:hover{opacity:1; background:#7b6a58; color: #eaddca!important;}
			

/*===================== 
	SLIDESHOW
======================

	.cycle-slideshow img{width:100%;}

	.cycle-pager {text-align:right; width: 100%; z-index: 500; position: absolute; bottom: 10px; right:40px; overflow: hidden;}
	.cycle-pager span { 
		font-family: arial; font-size: 50px; width: 16px; height: 16px; 
		 color: #ddd; padding:3px; cursor: pointer; 
	}
	.cycle-pager span.cycle-pager-active { color: #f2f2f2;}
	.cycle-pager > * { cursor: pointer;}
=*/

/*===================== 
  ZOOM HOVER
===================== */

	#brownbg{background:#7b6a58; padding: 3em 0}

	.title{ 
		display:block; 
		position:absolute; 
		left:0;
		top:33%;
		width:100%; 
		font-size:28px; 
		font-weight: 800;
		padding:10px 0;
		text-align: center;
		color:#fff;
		text-transform:uppercase;
		font-family: 'Open Sans Condensed', sans-serif;
	}
	
	.linkbox{
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		border: 4px solid #fff;
		background: #ccc;
		width: 23.5%;
		margin:2% 2% 0 0;
		position:relative;
		float: left;
		overflow:hidden;
		box-sizing:border-box
	}
	.lastbox{margin:2% 0 0 0!important;}

	.linkbox img {
	  width: 100%;
	  -moz-transition: all 0.3s;
	  -webkit-transition: all 0.3s;
	  transition: all 0.3s;
	  display:block;
	  opacity: 0.5;
	  filter: alpha(opacity=50); 
	}
	
	.linkbox:hover img {
	  -moz-transform: scale(1.1);
	  -webkit-transform: scale(1.1);
	  transform: scale(1.1);
	  opacity: 1;
	  filter: alpha(opacity=100); 
	}


/*============================== 
	SCROLLING INVENTORY
==============================*/

	.scrolling-wrap {
		width:100%;
		height:90px;
		overflow:hidden;
	}

	.scrolling{
		width:100%;
		height:92px;
	}

/*============================== 
	LOGGING PAGE
==============================*/
#log img{ max-width: 100%; width: 50%; float: right;}

/*============================== 
	FRAMELESS INVENTORY
==============================*/

	.hosted-content h3 {font-weight: 700; font-size: 18px; background:#eaddca; color:#7b6a58!important; padding-left: 10px}
	.hosted-content h1 {color:#7b6a58}
	.hosted-content .listings-wrapper .listings-list .listing-banner h2{color:#000; font-size: 20px}
	.listings-wrapper .listing-boxed .listing-boxed-details h2{color:#7b6a58;}
	.listings-wrapper .listing-boxed .listing-boxed-details{padding:5px 15px 15px 15px}
    
    .bordit{border:1px solid #eaddca; border-top:5px solid #7b6a58}

    .tabinv{
        border:1px solid #7b6a58; 
        border-bottom: none;
        padding:10px; 
        font-weight: 500;
        margin-right: 5px;
        display: inline-block;
        -webkit-border-top-left-radius: 5px;
        -webkit-border-top-right-radius: 5px;
        -moz-border-radius-topleft: 5px;
        -moz-border-radius-topright: 5px;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        }
    a.tabinv {color: #7b6a58;}
    a.tabinv:hover {color: #eaddca; background: #7b6a58; opacity: 1!important}


.list-title-text, .list-content .list-title .list-listings-count, .compare-listings-container .compare-container .compare-price {
	color: #7b6a58 !important;
}

.view-listing-details-link, .buy-now-link,.faceted-search-content .selected-facets-container .selected-facet, .detail-content .detail-main-body .main-detail-data .offer-btn, .detail-content .detail-main-body .main-detail-data .buy-btn, .detail-content .detail-additional-data .data-row .data-label,.detail-content-mobile .contact-options a,.detail-content-mobile .detail-contact-bar .contact-bar-btn{
	background: #eaddca !important;
	color: #7b6a58 !important;
	border: 1px solid #7b6a58 !important;
}

.detail-content .dealer-info .phone-and-email .send-email-btn, .list-content .list-listing-mobile .dealer-phone-container a {
	border-color:#7b6a58 !important;
		color: #7b6a58 !important;
}

.list-content .list-container .list-listing .buy-now-link, .list-content .list-container .list-listing .contact-btn, .list-content .list-container .list-listing .check-availability, .list-content .list-container .list-listing .email-seller, .list-content .list-container .list-listing .video-chat, .list-content .list-container .list-listing .facebook-messenger, .list-content .list-container .list-listing .whatsapp, .list-content .list-container .list-listing .text {
	background: #fff !important;
	color: #7b6a58 !important;
	border: 1px solid #7b6a58 !important;
	font-weight: bold !important;
}
.faceted-search-content .faceted-section-box .faceted-search, .faceted-search-content .faceted-section-box .faceted-btn-container .faceted-show-all-btn, .compare-listings-container .compare-container .button,.detail-content-mobile .detail-additional-data .data-row .data-label,.list-content .list-listing-mobile .contact-options a,.modal-bg .form-bottom .captcha-and-submit .captcha-placeholder button, .modal-bg .form-bottom .captcha-and-submit .captcha-placeholder input, .modal-container .form-bottom .captcha-and-submit .captcha-placeholder button, .modal-container .form-bottom .captcha-and-submit .captcha-placeholder input  {
	background: #7b6a58 !important;
	color: #eaddca !important;
	border: 1px solid  #eaddca !important;
}
.list-content .list-title .list-title-text {
	text-align: left !important;
}
.detail-additional-data h3 {
	font-weight: bold !important;
	margin-bottom: 2px !important;
	margin-top: 10px !important;
}
.faceted-search-content .faceted-section-box .faceted-option-checkbox-container .option-name, .faceted-search-content .faceted-section-box .faceted-option-checkbox-container .option-count {
	margin-top: 0px !important;
	margin-left: 5px !important;
}
.list-content .list-main-section .list-container .list-listing .listing-top .listing-top-left .listing-main-stats .price, .currency-selector {
	color: #000 !important;
}
.compare-chkbox-container .compare-listings .fa-check {
	    top: -1px !important;
    left: 2px !important;
}

.compare-chkbox-container .compare-listings .compare-label {
	margin-bottom: 9px  !important;
	margin-left: 5px !important;
}

.info {
	color: #7b6a58 !important;
}
/*============================== 
	CONTACT PAGE - FORM & more
==============================*/

	#comment-input {margin:1% AUTO; }

	#author.input-name, #lastname.input-name{
		border: 1px solid #d2d2d2;
		width: 30%;
		font-size: 14px;
		font-family: 'Open Sans', sans-serif;
		color: #747474;
		-webkit-box-shadow: inset 0 1px 5px rgba(0,0,0,0.1);
		-moz-box-shadow: inset 0 1px 5px rgba(0,0,0,0.1);
		box-shadow: inset 0 1px 5px rgba(0,0,0,0.1);
		padding: 8px 1%;
		float: left;
		margin:10px 1.1% 0 0;
	}
	#author.input-name, #lastname.input-name{outline-color:#000}

	#email.input-email {
		border: 1px solid #d2d2d2;
		width: 30.6%;
		font-size: 14px;
		font-family: 'Open Sans', sans-serif;
		color: #747474;
		-webkit-box-shadow: inset 0 1px 5px rgba(0,0,0,0.1);
		-moz-box-shadow: inset 0 1px 5px rgba(0,0,0,0.1);
		box-shadow: inset 0 1px 5px rgba(0,0,0,0.1);
		padding: 8px 1%;
		float: left;
		margin:10px 0 0 0;
		}
		#email.input-email:focus{
			outline-color:#000;
		}

	#inquiry.textarea-comment {
		border: 1px solid #d2d2d2;
		width: 98%;
		height: 100px;
		font-size: 14px;
		font-family: 'Open Sans', sans-serif;
		color: #747474;
		-webkit-box-shadow: inset 0 1px 5px rgba(0,0,0,0.1);
		-moz-box-shadow: inset 0 1px 5px rgba(0,0,0,0.1);
		box-shadow: inset 0 1px 5px rgba(0,0,0,0.1);
		padding: 8px 1%;	
	}
	#inquiry.textarea-comment {outline-color:#000;}

	#comment-submit {
		text-align: center;
		width:235px;
		margin:0 auto;
	}

	#form input {
		width: 100%;
		padding: 5px 10px;
		border:1px solid #DFDFDF;
		margin: 5px 0 15px;
		box-sizing: border-box;
	}

	#form textarea {
		width: 100%;
		padding: 10px;
		border:1px solid #DFDFDF;
		margin: 5px 0 15px;
		height: 70px;
		box-sizing: border-box;
	}

	.CaptchaPanel {
		margin:0 0 0 0 !important;
		padding:0 0 0 0 !important;
	}

	.CaptchaAnswerPanel input {
		width: 200px !important;
		border: 1px solid #d2d2d2;
		-webkit-box-shadow: inset 0 1px 5px rgba(0,0,0,0.1);
		-moz-box-shadow: inset 0 1px 5px rgba(0,0,0,0.1);
		box-shadow: inset 0 1px 5px rgba(0,0,0,0.1);
		padding: 8px 1%;
		margin:10px auto;
	}
	.CaptchaAnswerPanel input:focus{outline-color:#000;}

	.CaptchaImagePanel {
		margin:0 0 0 0;
		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;
		color:#000;
	}

	.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:#737373;font-size: 13px}
	.CaptchaWhatsThisPanel a:hover {text-decoration:none;} 

	.contactbtn{
		margin:10px auto 0 auto;
		text-align:center;
	}

	.contactbtn input[type="submit"] {
		font-size: 15px;
		font-weight:900;
		padding:8px 0;
		line-height:normal;
		background:#7b6a58;
		width: 220px;
		color: #fff;
		display: inline-block;
		border-radius: 0 !important;
		-moz-border-radius: 0 !important;
		-webkit-border-radius: 0 !important;
		outline: none;
		border: none;
		transition: all .2s ease-in-out; 
		-moz-transition: all .2s ease-in-out; 
		-webkit-transition: all .2s ease-in-out;
		cursor: pointer;
		position: relative;
	}

	.contactbtn input[type="submit"]:hover {
		background:#7b6a58;
		color: #fff;
		outline:none;
	}
iframe.mapa{border:0; width:100%; height: 400px}

/*===================== 
	FOOTER
=======================*/

	.bottom {
		background:#fff;
		padding:3em 0;
		-webkit-box-shadow: 0px -1px 5px 0px #7b6a58;
		-moz-box-shadow: 0px -1px 5px 0px #7b6a58;
		box-shadow: 0px -1px 5px 0px #7b6a58;
	}

	footer {
		width: 100%;
		line-height:1.5em;
	}

	a.footerlink:link,
	a.footerlink:visited, 
	a.footerlink:active {
		text-decoration: none; 
		font-size:11px;
		font-weight: 900;
		color:#7b6a58;
		}
		a.footerlink:hover {
			text-decoration:underline; 
			font-size:11px;
			color:#7b6a58;
		}
	
	.footertext {
		font-size:11px; 
		color:#7b6a58;
	}
	
	.smallfootertext {
		font-size:11px; 
		color:#7b6a58;
	}
	
	.divfooter {
		line-height: 1.1em;
		text-align:right; 
		margin:0 ;
		float: right;
		color:#7b6a58;
		max-width: 480px;
	}
	

/*  RESPONSIVE STYLES
------------------------------------------------*/

@media screen and (max-width: 1280px) {
	.title{font-size:22px}
}

 
/* iPads (portrait and landscape) ----------- */
 
@media screen and (max-width: 1100px) {
	.sitewidth{width:96%; margin:0 auto}
	#content{width:90%; margin:0 }
    
    #calloutlink{padding:18px 0}
    #certified img{height:53px}
    #mainlinks{width:30%}
    #mainvideo{width:70%}
    #mainvideo video {width:100%; height: auto; }
    
}

@media screen and (max-width: 980px) {
	
	#email.input-email {
		width: 88%;
		padding: 8px 1%;
		float: none;
		margin:2% auto;
		position:relative;
		display:block;
	}
	#author.input-name, #lastname.input-name {
		width: 88%;
		padding: 8px 1%;
		float: none;
		margin:2% auto;
		position:relative;
		display:block;
	}
	#comment-textarea{
		width: 90%;
		padding:  0;
		float: none;
		margin:0 auto;
	}
	.onethird{
		float:left;
		width:40%;
	}
	.twothird{
		float:left;
		width:60%;
	}

	#mainvideo{width:100%; height: auto;  float:none}
    #mainvideo video {width:100%; height: auto;  float:none}
	#mainlinks{width:100%; float:none}
	#calloutlink{padding:10px 0}
}

@media screen and (max-width: 768px) {
	.hosted-content h1{text-align:left}
	h1{text-align:center}
	h2{text-align:center}
	h3{text-align:center}
	p{text-align:center}
	
	.column2 {
		width:100%; 
		*width: 100%; 
		float:none; 
		text-align:center;
		padding: 0
	}
	
	.pad{padding:1.5em 0}
	#brownbg{padding:1.5em 0 2.5em 0}
	.bottom{padding:1.5em}
	
	.divfooter{text-align:center; float: none; max-width:100%; margin:20px auto 0 auto}
	
	.linkbox{width:48%}
	
	iframe.mapa{margin:20px auto 0 auto}
	
	#log img{ float: left; margin: 10px 0}
	
}

/* iPhone 5, 6, 6+ ----------- */

@media screen and (max-width: 736px){
	header{padding:10px 0;}
	#headleft{display:none}
	
	#socialmedia{display:none}
	#socialmedia-mobile{display:block}
	#socialmedia-mobile img{ max-width:25px; margin: 0 2px; display: inline-block}
	
	#headmobile{display:block}
	#headmobile h3{margin-bottom:5px}
	
	.logo {float:none; width:100%}
	.logo img{margin:0 auto 5px auto;}
	
	
	.started{text-align:center;}
	.started h4{display:block;}
		
	a.btmbotao{ 
		width:150px; 
		margin: 1em auto;
		display:block
	}
	#log img{ float: none; margin: 10px 0; width: 100%}
    
    .tabinv{
        border:1px solid #7b6a58; 
        border-bottom: 1px solid #7b6a58;
        padding:10px 0; 
        background: #7b6a58;
        margin: 5px auto;
        display: block;
        border-radius: 0;
        text-align: center
    }
    a.tabinv{color:#fff}
    a.tabinv:hover{color:#7b6a58; background: #fff;}
}

@media screen and (max-width: 400px){
	.linkbox{width:98%; margin: 1%}
}