/*	Less Framework 4

	http://lessframework.com

	by Joni Korpi

	License: http://opensource.org/licenses/mit-license.php	*/





/*	Resets

	------	*/



html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, 

p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, 

img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr, 

dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 

table, caption, tbody, tfoot, thead, tr, th, td,

article, aside, canvas, details, figure, figcaption, hgroup, 

menu, footer, header, nav, section, summary, time, mark, audio, video {

	margin: 0;

	padding: 0;

	border: 0;

}



article, aside, canvas, figure, figure img, figcaption, hgroup,

footer, header, nav, section, audio, video {

	display: block;

}



a {

	color: rgb(136, 121, 117);

	text-decoration: none;

}



a img {border: 0;}







/*	Typography presets

	------------------	*/



.gigantic {

	font-size: 110px;

	line-height: 120px;

	letter-spacing: -2px;

}



.huge, h1 {

	font-size: 68px;

	line-height: 72px;

	letter-spacing: -1px;

}



.large, h2 {

	font-size: 42px;

	line-height: 48px;

}



.bigger, h3 {

	font-size: 26px;

	line-height: 36px;

}



.big, h4 {

	font-size: 22px;

	line-height: 30px;

}



body {

	font: 16px/24px Georgia, serif;

}



.small, small {

	font-size: 13px;

	line-height: 18px;

}



/* Selection colours (easy to forget) */



::selection 	 	{background: rgb(255,255,255);}

::-moz-selection 	{background: rgb(255,255,255);}

img::selection 		{background: transparent;}

img::-moz-selection	{background: transparent;}

body {-webkit-tap-highlight-color: rgb(255,255,255);}



/*	Fonts

	------	*/



@font-face {

	font-family: 'EngraversMTBold';

	src: url('fonts/engravers_mt_bold-webfont.eot');

	src: url('fonts/engravers_mt_bold-webfont.eot?#iefix') format('embedded-opentype'),

	     url('fonts/engravers_mt_bold-webfont.woff') format('woff'),

	     url('fonts/engravers_mt_bold-webfont.ttf') format('truetype'),

	     url('fonts/engravers_mt_bold-webfont.svg#EngraversMTBold') format('svg');

	font-weight: normal;

	font-style: normal;

}



/*	Global

	------	*/



.wrapper {

	display: block;

	margin: 0 auto;

	height: auto;

	width: auto;

	padding: 0;

	position: relative;

}



.wrapper:after {

	clear: both;

	content: ".";

	display: block;

	height: 0;

	visibility: hidden;

}





/*		Default Layout: 992px. 

		Gutters: 24px.

		Outer margins: 48px.

		Leftover space for scrollbars @1024px: 32px.

-------------------------------------------------------------------------------

cols    1     2      3      4      5      6      7      8      9      10

px      68    160    252    344    436    528    620    712    804    896    */



html {

	height: auto;

	width: 100%;

}



body {

	padding: 36px 0 84px;

	background: rgb(255,239,243);

	color: rgb(60,60,60);

	-webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */

	position: relative;

	width: 100%;

}





/*	Header

	------	*/



header {

	margin: 0 auto;

	position: relative;

	width: 980px;

	height: auto;

}



header h1 {

	margin: 0 0 0 24px;

	padding: 0;

	font-family: 'EngraversMTBold', Georgia, 'Times New Roman', Times, serif;

	font-size: 9px;

	line-height: 18px;

	text-transform: uppercase;

	letter-spacing: 2px;

	font-weight: normal;

	float: left;

}



	header h1 a {

		color: rgb(136, 121, 117);

		text-decoration: none;

	}

	

	header h1 a.active {

		color: rgb(207, 182, 122);

	}

	

nav {

	width: 84%;

	height: auto;

	margin: 0;

	padding: 0;

	float: left;

}



header nav ul {

	margin: 0 0 0 24px;

	padding: 0;

	font-family: 'EngraversMTBold', Georgia, 'Times New Roman', Times, serif;

	font-size: 9px;

	line-height: 18px;

	text-transform: uppercase;

	letter-spacing: 2px;

	list-style: none;

	height: 18px;

}



header nav ul li {

	float: left;

	margin: 0 23px 0 0;

	padding: 0;

	height: 18px;

}

	

header nav ul li a {

	color: rgb(136, 121, 117);

	text-decoration: none;

	display: block;

	height: 100%;

	width: 100%;

}

		

header nav ul li a.active {

	color: rgb(207, 182, 122);

}

		

#content {

	margin: 0 auto;

	position: relative;

	width: 100%;

}



#content .wrapper {

	min-height: 600px;

}



/*	Panel

	------	*/

	

.panel {

	width: 856px;

	height: auto;

	text-align: center;

	font-family: Georgia, 'Times New Roman', Times, serif;

	font-size: 12px;

	color: rgb(136, 121, 117);

	letter-spacing: 1px;

	margin: 0 auto;

	padding: 30px 0 0;

	display: none;

}



.panel h2 {

	display: none;

}



.panel p {

	margin-bottom: 1em;

	-moz-widows: 3;

}



.small_caps {

	font-size: 14px;

	font-variant: small-caps;

}



.all_caps {

	text-transform: uppercase;

}



/*	Home

	------	*/

	

#home {

	display: block;

}

	#hero_home {

		display: block;

		margin: 0 auto;

	}



/*	Our Story

	------	*/



#our_story {



}



/*	Our Wine

	------	*/



#our_wine {



}



#tasting_notes {

	margin-top: 20px;

}



#tasting_notes h3 {

	float: left;

	font-size: 14px;

	text-transform: uppercase;

	font-weight: normal;

	width: 100%;

	text-align: center;

	height: 20px;

	line-height: 20px;

}



#tasting_notes ul {

	width: 243px;

	margin: 0 auto;

	list-style: none;

	font-size: 14px;

	text-transform: uppercase;

	height: 20px;

	line-height: 20px;

}



	#tasting_notes ul li {

		float: left;

		width: auto;

		height: auto;

		margin: 0 20px;

	}

	

		#tasting_notes ul li a {

			color: rgb(207, 182, 122);

			text-decoration: none;

		}

		

		#tasting_notes ul li a.active {

			color: rgb(136, 121, 117);

		}



#tasting_notes nav {

	width: 100%;

	margin-bottom: 20px;

        padding: 0;

}





#tasting_notes .panel {

	padding: 0;

	position: static;

	clear: both;

}



#tasting_notes h4 {

	font-weight: normal;

	font-size: 14px;

	text-transform: uppercase;

	line-height: 20px;

	margin-bottom: 12px;

}



#tasting_notes h4 span {

	color: rgb(207, 182, 122);

}



/*	Our Winemaker

	------	*/



#our_winemaker {



}



/*	Purchase

	------	*/



#purchase {

	

}



/*	Mailing List

	------	*/



#mailing_list {



}



/*	Contact

	------	*/



#contact {

	padding-top: 40px;

}

			

footer {

	margin: 0 auto;

	padding-left: 48px;

	padding-right: 48px;

	position: relative;

	width: 100%;

}



/*		Tablet Layout: 768px.

		Gutters: 24px.

		Outer margins: 28px.

		Inherits styles from: Default Layout.

-----------------------------------------------------------------

cols    1     2      3      4      5      6      7      8

px      68    160    252    344    436    528    620    712    */



@media only screen and (min-width: 768px) and (max-width: 991px) {

	

	body {

	}

	

	header {

		width: 520px;

	}

	

	nav {

		margin-top: 12px;

	}

	

	.panel {

		width: 520px;

	}

	

}







/*		Mobile Layout: 320px.

		Gutters: 24px.

		Outer margins: 34px.

		Inherits styles from: Default Layout.

---------------------------------------------

cols    1     2      3

px      68    160    252    */



@media only screen and (max-width: 767px) {

	

	body {

	}

	

	header {

		width: 400px;

	}

	

	nav {

		margin-top: 12px;

	}

	

	.panel {

		width: 220px;

	}

	

	img {

		width: 100%;

	}

	

	#tasting_notes h3 {

		margin-left: 0;

	}

	

}







/*		Wide Mobile Layout: 480px.

		Gutters: 24px.

		Outer margins: 22px.

		Inherits styles from: Default Layout, Mobile Layout.

------------------------------------------------------------

cols    1     2      3      4      5

px      68    160    252    344    436    */



@media only screen and (min-width: 480px) and (max-width: 767px) {

	

	body {

	}

	

	.panel {

		width: 400px;

	}

	

	img {

		width: 65%;

	}

	

}





/*	Retina media query.

	Overrides styles for devices with a 

	device-pixel-ratio of 2+, such as iPhone 4.

-----------------------------------------------    */



@media 

	only screen and (-webkit-min-device-pixel-ratio: 2),

	only screen and (min-device-pixel-ratio: 2) {

	

	body {

	

	}

	

}