/* 			Artfully masterminded by ZURB  
	           Carl Heaton for tutoring!
*/

/* -------------------------------------------------- 
   Table of Contents
-----------------------------------------------------
#4d311c - Dark Brown
#e2c696 - Light Brown
#3d2211 - Text
:: Shared Styles
:: Page Name 1
:: Page Name 2
*/



/* -----------------------------------------
   Shared Styles
----------------------------------------- */

body{
	background-color:#e2c696;
}

	p{
		line-height:1.8em;
		color:#3d2211;
	}

	.bottom{
		font-size:14px;
		text-align:center;
		font-weight:normal;
		line-height:1.2em;
		color:#3d2211;

	}


	
	h1,h2,h3{
		font-weight:normal;
		color:#3d2211;
		text-shadow: 1px 1px 3px #757575;
		filter: dropshadow(color=#757575, offx=1, offy=1);
	}

	h4{
		font-size:22px;
		text-align:center;
		font-weight:normal;
		color:#3d2211;
		text-shadow: 1px 1px 3px #757575;
		filter: dropshadow(color=#757575, offx=1, offy=1);
	}

	h3{
		font-size:14px;
		text-align:center;
		font-weight:normal;
		color:#3d2211;
		padding-bottom:15px;
		text-shadow: 1px 1px 3px #757575;
		filter: dropshadow(color=#757575, offx=1, offy=1);
	}


	.sold1{
		font-size:16px;
		text-align:left;
		font-weight:normal;
		line-height:1.2em;
		color:#3d2211;
		margin-left:1.5cm;
		margin-right:1.5cm;

	}

	.sold2{
		font-size:16px;
		font-weight:normal;
		line-height:1.3em;
		color:#3d2211;
		margin-left:1.5cm;
		margin-right:1.5cm;

	}


	
	a{
		color:#4d311c;
		text-decoration:none;
	}

	a:hover{
		color:black;
		text-decoration:none;
	}


.top-bar{
	background-color:#4d311c;
	height:auto;
}

	.top-bar p{
		padding:5px 0 0 0;
		color:#e2c696;
		margin-bottom:5px;
	}

header{
	background:url(../images/bg-creek.jpg) center top no-repeat;
}



/* -------------------------------------------------
	Centering Videos in Containers
--------------------------------------------- */

.video-wrapper {
	width: 600px;
	max-width: 100%;
}


.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}



.video-container iframe,  
.video-container object,  
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}



/* --------------
Pretty Buttons 
----------------*/


.button {
	-moz-box-shadow:inset 0px 0px 9px 0px #74492a;
	-webkit-box-shadow:inset 0px 0px 9px 0px #74492a;
	box-shadow:inset 0px 0px 9px 0px #74492a;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #e2c696), color-stop(1, #9b6338) );
	background:-moz-linear-gradient( center top, #e2c696 5%, #9b6338 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e2c696', endColorstr='#9b6338');
	background-color:#e2c696;
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius:12px;
	border:2px solid #9b6338;
	display:inline-block;
	color:#74492a;
	font-family:arial;
	font-size:14px;
	font-weight:bold;
	padding:2px 11px;
	text-decoration:none;
	text-shadow:0px -5px 10px #e2c696;
}.button:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #9b6338), color-stop(1, #e2c696) );
	background:-moz-linear-gradient( center top, #9b6338 5%, #e2c696 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#9b6338', endColorstr='#e2c696');
	background-color:#9b6338;
}.button:active {
	position:relative;
	top:1px;
}
/* This imageless css button was generated by CSSButtonGenerator.com */


/* ------------------------
 FlexSlider CSS
 -------------------------- */
/*
 * jQuery FlexSlider v2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)

 * YouTube Tutorial:http://www.youtube.com/watch?v=_dAvSn28nWY&feature=em-share_video_user;
 */

 
/* Browser Resets */
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 

/* FlexSlider Necessary Styles
*********************************/ 
.flexslider {margin: 0; padding: 0;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {width: 100%; display: block;}
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}

/*********************************
 My FlexSlide Styles:
	If you want borders, use this:
		figure {
			padding: 6px;
			border: 1px solid #color;
			background: #color;
			}
	Margin calls for 21pixels top and bottom of the slide
	<ol class "flex-control-nav"> needs to go from numbers to bullets, 
	so thats what the flex-control-nav things are about.

***************************************/

.flexslide {
	margin: 21px 0;
	text-align: center;
}

.flex-control-nav {
	width: 100%;
	text-align: center;
}

.flex-control-nav li {
	display: inline;
	margin: 0 5px;
	
}

.flex-control-nav li a {
	display: inline-block;
	width: 9px;
	height: 9px;
	margin: -6px 0px 30px 0px;
	background: #4d311c;
	border: 1px solid#4d311c;

	cursor: pointer;

	font: 0/0 a;
	text-shadow: none;
	color: transparent;

	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}


	


/* Changes the header image to be portait so it looks nice on mobiles */
@media only screen and (max-width: 767px) {
	header{
		background:url(../images/bg-creek-mobile.jpg) center top no-repeat;	}
	
}

	header p{
		color:#e2c696;
		text-shadow: 1px 1px 1px #707070;
		filter: dropshadow(color=#707070, offx=1, offy=1);		
	}
	
		header .four p{
			font-size:18px;
		}
	
	header a{
		color:#e2c696;
		text-decoration:none;
		text-shadow: 1px 1px 1px #707070;
		filter: dropshadow(color=#707070, offx=1, offy=1);
	}
	
		header a:hover{
			color:#e2c696;
			text-decoration:none;
			}
	
	
	header .address,
	header .contact{
		padding-top:50px;
	}
	
	nav{
		padding-top:34px;
	}
	
		.nav-bar{
			background-color:#4d311c;
		}


footer{
	border-top:40px solid #4d311c;
}

footer nav ul li{
	display:inline;
	list-style:none;
	border-right:1px solid #4d311c;
	padding-right:10px;
	padding-left:5px;
}

	footer nav ul li:last-child{
		border-right:none;
	}

footer a{
	color:#4d311c;
	text-decoration:none;
}

	footer a:hover{
		color:black;
		text-decoration:none;
	}

/* -----------------------------------------
   Homepage
----------------------------------------- */
.home-top .about p,
.home-top .videos p{
	padding:0 12px;
}

.home-top .products strong{
	text-transform:uppercase;
}

.home-top .about a img{
	margin-top:25px;
}

.home-top .videos a img{
	margin-top:25px;
}





/* -----------------------------------------
   Page Name
----------------------------------------- */



/* -----------------------------------------
   Misc
----------------------------------------- */

#heritage .eight h2, 
#products .eight h2{
	font-size:20px;
	padding-top:0px;
}

.horizontal-list .row{
	margin-bottom:30px;
}