/* -

	Vineland Estates Winery
	sm / CHDS, 2008

	toc
	---
	1 - universal
	2 - structure/layout
	3 - main navigation
	4 - anchors
	5 - typography
	6 - lists
	7 - images
	8 - forms
	x - temporary/testing

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

@import url("text.css");			/* importing text styles */
@import url("shoppingcart.css");	/* importing shopping cart and checkout styles */
@import url("productdb.css");		/* importing wine database styles */

/* 1 - universal
--------------------- */
body { 
	font-size: 100%; 
	font-family: Palatino, "Palatino Linotype", Times, serif;
	text-align: center;
	background: #000 url("/images/background_pattern.jpg") repeat-x right top;
	}

#container {
	font-size: 62.5%;
	}
body, h1, h2, h3, ul, li, a, hr, div, img, table, form, fieldset { 
	margin: 0; padding: 0;
	}
hr {
	visibility: hidden;
	clear: both;
	}
.hide { display: none; }


/* 2 - structure/layout
--------------------- */
#absolut_branches_left { 
	margin: 0; padding: 0;
	display: block;
	position: absolute;
	left: 0; top: 0px;
	width: 304px; height: 191px;
	background: transparent url("/images/absolut_branches_left.png") no-repeat top left;
	z-index: 1;
	}
#absolut_branches_right { 
	margin: 0; padding: 0;
	display: block;
	position: absolute;
	right: 0; top: -30px;
	width: 304px; height: 191px;
	background: transparent url("/images/absolut_branches_right.png") no-repeat top left;
	z-index: 1;
	}
	
#container {
	margin: 0 auto;
	width: 816px;
	background: transparent;
	}

#header {
	margin: 30px auto 0 auto; padding: 0;
	width: 258px; height: 75px;
	}
	#header h1 {
		margin: 0; padding: 0;
		width: 202px;
		}
		#container #header h1 a {
			margin: 0; padding: 0;
			display: block;
			border: none; text-decoration: none;
			}
			
#masthead {
	margin: 0 auto; padding: 0;
	width: 738px; height: 198px;
	background: url("/images/masthead-template.jpg") no-repeat top left;
	display: block;
	text-align: left;
	}
	#masthead div.article {
		margin: 0 auto; padding: 12px 0 0 8px;
		}

#content {
	margin: 0 auto; padding: 0;
	width: 800px;
	background: transparent url("/images/cb_pattern.jpg") repeat-y center top;
	clear: both;
	}

#main_content {
	margin: 0 auto; padding: 0 0 0 35px;
	width: 675px; 
	float: none;
	text-align: left;
	}
	.home #main_content {
		margin: 0; padding: 0;
		width: 678px;
		background: url("/images/content.png") no-repeat top left;
		}
		#main_content div.article {
			/*clear: both;*/
			}
		.home #main_content div.article {
			margin: 0; padding: 0;
			clear: both;
			}

#sidebar {
	margin: 20px 0 10px 30px; padding: 0;
	width: 204px; height: auto;
	float: right;
	text-align: center;
	background: transparent;
	border-left: 1px dotted #ead7a4;
	}
	#sidebar img.border {
		margin: 0 0 -3px 0; padding: 0;
		}
	#sidebar div.article {
		padding: 0px 20px 0 25px;
		clear: both;
		margin-bottom: 20px;
		text-align: left;
		}

#footer {
	margin: 0 auto 40px auto; padding: 0;
	width: 800px; height: 140px;
	background: transparent;
	clear: both;
	position: relative;
	background: transparent url("/images/cb_footer.jpg") no-repeat top center;
	}
.home #footer {
	background: transparent url("/images/cb_footer_home.jpg") no-repeat top center;
	}
	#footer p {
		margin: 0; padding: 0;
		text-align: center;
		}

/* 2B - home page menu
--------------------- */

/* moved to home-navigation.css */

/* 2C - home page misc
--------------------- */

.home #sub_container {
	margin: 20px 0 0 0; padding: 0 50px;
	width: 700px;
	}
	#latest_news {
		margin: 0; padding: 0 20px 0 0;
		width: 235px;
		float: left;
		text-align: left;
		}
	#events {
		margin: 0; padding: 0 0 0 20px;
		width: 235px;
		float: left;
		text-align: left;
		border-left: 1px dotted #ead7a4;
		}
	#wine_club {
		margin: 0; padding: 0;
		float: right;
		}
	#extra_content {
		margin: 10px 0 0 0; padding: 0;
		width: 515px;
		float: left;
		text-align: left;
		}

a.readmore { margin-left: -8px; }


/* 3C - main navigation
--------------------- */

#nav {
	margin: 0 auto; padding: 50px 0 0 0;
	width: 816px; height: 50px;
	background: transparent;
	display: block;
	position: relative;
	background: transparent url("/images/cb_top.png") no-repeat center top;
	z-index: 2;
	}
body.home #nav {
	height: 234px;
	background: transparent url("/images/cb_top_home.png") no-repeat center top;
	}

/* omni nav - careers / sitemap / contact */
#nav #omni {
	margin: 0 auto; padding: 0;
	display: block;
	list-style-type: none;
	text-align: center;
	width: 220px; height: 25px;
	position: absolute;
	top: 0; right: 0;
	}
	#nav #omni li {
		margin: 0; padding: 15px 8px 0 8px;
		width: auto; height: auto;
		display: block;
		text-align: center;
		height: auto;
		background: transparent;
		float: left;
		}

/* main nav on content pages */
#nav #main {
	margin: 0 auto; padding: 0;
	display: block;
	list-style-type: none;
	text-align: center;
	width: 757px; height: 25px;
	border-left: 1px solid #e7cea0;
	}
	#nav #main li {
		margin: 0; padding: 5px 0 4px 0;
		width: 107px; height: 25px;
		display: block;
		text-align: center;
		height: auto;
		background: transparent;
		border-right: 1px solid #e7cea0;
		border-top: 1px solid #efe3c9;
		float: left;
		}
	#nav #main li:hover {
		background: #f3ebda;
		border-top: 1px solid #e7cea0;
		}
		#nav #main li a {
			margin: 0; padding: 0;
			display: block;
			text-align: center;
			width: auto;
	    	}

/* secondary nav on home page */
#home_subnav {
	padding-top: 60px;
	}
#home_subnav #main {
	margin: 0 auto; padding: 0;
	display: block;
	list-style-type: none;
	text-align: center;
	width: 432px; height: 25px;
	border-left: 1px solid #e7cea0;
	}
	#home_subnav #main li {
		margin: 0; padding: 5px 0 4px 0;
		width: 107px; height: 25px;
		display: block;
		text-align: center;
		height: auto;
		background: transparent;
		border-right: 1px solid #e7cea0;
		border-top: 1px solid #f7f1e4;
		float: left;
		}
	#home_subnav #main li:hover {
		background: #f3ebda;
		border-top: 1px solid #e7cea0;
		}
		#home_subnav #main li a {
			margin: 0; padding: 0;
			display: block;
			text-align: center;
			width: auto;
	    	}	

/* 3B - pop-out sub-menu
--------------------- */
#nav #main ul li ul,
#nav #main ul li ul li ul { display: none; }

#container div#nav #main li { display: block; position: relative; }
#container div#nav #main li a { display: block; }

#container div#nav #main ul li ul,
#container div#nav #main ul li ul li ul {
	padding: 0 0 0 0;
	border: none;
	background: #302502 url("/images/drop_down_bg.jpg") repeat-x top left;
	width: 140px;
	border: 3px double #4b3e15;
	}
	
#container div#nav #main ul li ul li,
#container div#nav #main ul li ul li ul li {
	margin: 0; padding: 0;
	width: 135px; 
	float: left;
	height: auto;
	background: transparent;
	border: none;
	text-align: left;
	border-top: 1px solid #3a3011;
	}

#container div#nav #main ul li ul li a,
#container div#nav #main ul li ul li ul li a {
	margin: 0;	padding: 5px 13px 5px 7px;
	display: block;
	position: relative;
	width: 115px;
	text-align: left;
	line-height: 100%;
	}
	#container div#nav #main ul li ul + #container div#nav #main ul li ul li {
		border-top: none;
		}
	
	#container div#nav #main ul li ul li:hover,
	#container div#nav #main ul li ul li ul li:hover {
		background: url("/images/drop_down_bg_on.jpg") repeat-x top left;
		}
	#container div#nav #main ul li ul li span,
	#container div#nav #main ul li ul li ul li span {
		width: auto;
		background: none;
		}

#container div#nav #main ul ul, 
#container div#nav #main ul ul ul, 
#container div#nav #main ul ul ul ul {
	position: relative;
	z-index: 6000;
	}

#container div#nav #main ul li:hover ul ul, 
#container div#nav #main ul ul li:hover ul ul, 
#container div#nav #main ul ul ul li:hover ul ul { display: none; }

#container div#nav #main ul ul li:hover, 
#container div#nav #main ul ul ul li:hover { 
	background: transparent;
	border-top: 1px solid #4b3e15;
	}

#container div#nav #main ul li:hover ul {
	display: block;
	position: absolute;
	width: auto;
	top: 24px;
	left: -16px;
	z-index: 6000;
	}
#container div#nav #main ul ul li:hover ul {
	display: block;
	position: absolute;
	width: auto;
	top: -4px;
	left: 135px;
	z-index: 6000;
	}
#container div#nav #main ul ul ul li:hover ul {
	display: block;
	position: absolute;	
	width: auto;
	top: 0;
	left: 135px;
	z-index: 6000;
	}

/* 3B - sub-menu indicator
--------------------- */
#container #nav #main ul li ul li span.indicator,
#container #nav #main ul li ul li ul li span.indicator,
body.home #container ul#site_sections ul li span.indicator,
body.home #container ul#site_sections ul li ul li ul li span.indicator {
	background: transparent url("/images/indicator.png") no-repeat left top;
	width: 10px;
	height: 10px;
	position: absolute;
	right: -3px; top: 8px;
	}

	
/* 4 - anchors
--------------------- */

#container a img { border: none; }
#container #sidebar a { border: none; }

#nav #omni a:link { color: #7b5500; text-decoration: none; }				/* omni nav */
#nav #omni a:visited { color: #7b5500; text-decoration: none; }
#nav #omni a:hover { color: #b07900; text-decoration: underline; }
#nav #omni a:active { color: #7b5500; text-decoration: none; }

#nav #main a:link { color: #241b02; text-decoration: none; }				/* main nav - content - top level */
#nav #main a:visited { color: #241b02; text-decoration: none; }
#nav #main a:hover { color: #7a501c; text-decoration: none; }
#nav #main a:active { color: #241b02; text-decoration: none; }

#nav #site_sections a:link { color: #ad824c; text-decoration: none; }		/* main nav - home page */
#nav #site_sections a:visited { color: #ad824c; text-decoration: none; }
#nav #site_sections a:hover { color: #f0e4c5; text-decoration: none; }
#nav #site_sections a:active { color: #ad824c; text-decoration: none; }

#nav #main ul ul a:link { color: #ad824c; text-decoration: none; }			/* main nav - content page */
#nav #main ul ul a:visited { color: #ad824c; text-decoration: none; }
#nav #main ul ul a:hover { color: #f0e4c5; text-decoration: none; }
#nav #main ul ul a:active { color: #ad824c; text-decoration: none; }

#home_subnav ul#main a:link { color: #241b02; text-decoration: none; }
#home_subnav ul#main a:visited { color: #241b02; text-decoration: none; }
#home_subnav ul#main a:hover { color: #7a501c; text-decoration: none; }
#home_subnav ul#main a:active { color: #241b02; text-decoration: none; }

#content a:link { color: #724e00; text-decoration: underline; }
#content a:visited { color: #7b5500; text-decoration: underline; }
#content a:hover { color: #b07900; text-decoration: underline; }
#content a:active { color: #7b5500; text-decoration: underline; }

#sub_nav a:link { color: #7b5500; text-decoration: none; }
#sub_nav a:visited { color: #7b5500; text-decoration: none; }
#sub_nav a:hover { color: #b07900; text-decoration: underline; }
#sub_nav a:active { color: #7b5500; text-decoration: none; }


/* 5 - typography
--------------------- */
/* moved to text.css */


/* 6 - lists
--------------------- */

#main_content .article ul,
#main_content ul {
	margin: 15px 50px 15px 0; padding: 0;
	font-size: 12px;
	list-style-image: url("/images/bullet-default.png");
	}
	#main_content .article ul li,
	#main_content ul li {
		margin-left: 15px; padding: 0;
		margin-bottom: 8px;
		line-height: 150%;
		}

#sidebar .article ul {
	margin: 0 0 15px 5px; padding: 0;
	width: 100%; 
	font-size: 11px;
	color: #312604;
	list-style-image: url("/images/bullet-default.png");
	text-align: left;
	}
	#sidebar .article ul li {
		margin-left: 15px; padding: 0;
		margin-bottom: 6px;
		line-height: 120%;
		}


#main_content .article ol,
#main_content ol {
	margin: 15px 50px 15px 0; padding: 0;
	font-size: 12px;
	list-style-type: upper-roman; 
	}
	#main_content .article ol li,
	#main_content ol li {
		margin-left: 15px; padding: 0;
		margin-bottom: 4px;
		line-height: 150%;
		}

#sidebar .article ol {
	margin: 0 0 15px 5px; padding: 0;
	width: 100%; 
	font-size: 11px;
	color: #312604;
	text-align: left;
	list-style-type: upper-roman;
	}
	#sidebar .article ol li {
		margin-left: 15px; padding: 0;
		margin-bottom: 6px;
		line-height: 120%;
		}

/* 6b - site map
--------------------- */

#main_content #site_map_content {
	width: 93%;
	border-right: 3px double #efe3c9;
	border-left: 3px double #efe3c9;
	border-top: 1px solid #bdaa7f;
	}	
#main_content #site_map_content ul {
	margin: 0 0 25px 0; padding: 0;
	font-size: 12px;
	color: #312604;
	list-style-type: none;
	border: none;
	background: #f4edda url("/images/form_gradient.jpg") repeat-x top left;
	}
	#main_content #site_map_content ul li {
		margin-left: 15px; padding: 6px 0;
		margin-bottom: 4px;
		line-height: 120%;
		border-bottom: 1px solid #efe3c9;
		font-variant: small-caps;
		letter-spacing: 0.1em;
		font-weight: bolder;
		}
		#main_content #site_map_content ul li ul {
			margin: 15px 0 25px 15px;
			padding: 5px 0 0 5px;
			border: none;
			border-top: 1px solid #bdaa7f;
			border-left: 3px double #bdaa7f;
			}
			#main_content #site_map_content ul li ul li {
				margin-left: 15px; padding: 3px 0px;
				margin-bottom: 4px;
				line-height: 120%;
				list-style-type: none;
				border-bottom: 1px solid #efe3c9;
				font-weight: lighter;
				}

#main_content #site_map_content a {
	width: 100%;
	}

/* 7 - images
--------------------- */

#main_content .article img.inline_right,
#main_content .article object.inline_right { 
	float: right;
	margin: 5px 0 15px 20px;
	}
#main_content .article img.inline_left,
#main_content .article object.inline_left { 
	float: left;
	margin: 5px 20px 15px 0;
	}
#main_content .article img.standalone_left { 
	float: left;
	margin: 5px 0 15px 0;
	border: none;
	}
#main_content .article img.none {
	float: none; margin: 0;
	}
	/* removing margins for masthead image, no matter what the settings are */
	#container #masthead .article img.inline_right,
	#container #masthead .article img.inline_left { float: none; margin: 0; }
	


	/* default image settings */
	#content #sidebar_left img,
	#content #main_content img { }
 
	#main_content img { padding: 3px; border: 1px solid #ead7a4; }
	#container #sidebar img { padding: 3px; border: 1px solid #ead7a4; }
	

	/* captions */
	#container .caption {
		padding: 0;
		background: #fff;
		display: block;
		border: 1px solid #ead7a4;
		}
		#container .article div.inline_right { 
			float: right;
			margin: 0 0 5px 15px;
			width: auto;
			}
		#container .article div.inline_left { 
			float: left;
			margin: 0 15px 5px 0;
			width: auto;
			}
		
	/* if caption is present, remove margins from the image and add it to the caption div */
	#container div.caption img.inline_right,
	#container div.caption img.inline_left,
	#container div.caption img.none {
		margin: 0 0 3px 0;
		padding-bottom: 0px;
		}
	#container .article div.caption p {
		padding: 10px; margin: 0;
		border: none;
		font-size: 10px;
		color: #7a501c;
		max-width: 150px;
		font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
		}
	
	
	/* flash objects */
	#main_content div.article object { margin-bottom: 15px; }





/* 8A - forms - universal
--------------------- */
form {
	width: auto;
	margin: 15px auto; padding: 0;
	background: transparent;
	border: none;
	}
form fieldset {
	border: none;
	background: transparent;
	margin: 0; padding: 0;
	border: 3px double #efe3c9;
	}
	form fieldset legend {
		display: none;
		}
		form fieldset input,
		form fieldset select,
		form fieldset textarea {
			border: 1px solid #e7cea0;
			background: transparent url("/images/form_gradient.jpg") repeat top left;
			}
		form fieldset input:hover,
		form fieldset select:hover,
		form fieldset textarea:hover {
			border: 1px solid #e7cea0;
			background: transparent url("/images/form_gradient_dark.jpg") repeat top left;
			}
		form fieldset input:focus,
		form fieldset select:focus,
		form fieldset textarea:focus {
			border: 1px solid #e7cea0;
			background: transparent url("/images/form_gradient_dark.jpg") repeat top left;
			color: #ead7a4;
			}
			

	#contact_form {						/* contact form */
		padding: 0;
		margin: 0;
		width: 430px; float: left;
		}
	#contact_form fieldset {
		padding: 0;
		margin: 0;
		width: 94%;
		}
	#contact_form fieldset input,
	#contact_form fieldset select {
		margin: 5px 0; padding: 2px 2px 0 5px;
		width: 150px; height: 15px;
		}
		#contact_form fieldset select { height: 20px; border: none; }
		form fieldset select option { border: none; background: #fff; }
		#contact_form fieldset input.button {
			margin: 0;
			width: auto; height: auto;
			border: none;
			background: transparent;
			}
		#contact_form fieldset textarea {
			margin: 5px 0; padding: 10px;
			width: 220px;
			height: 100px;
			clear: both;
			}

		#contact_form fieldset ol {
			margin: 0;
			padding: 0;
			list-style-type: none;
			}
			#contact_form fieldset ol li {
				margin: 0;
				padding: 4px 10px;
				display: block;
				border-bottom: 1px solid #efe3c9;
				clear: both;
				}
			#contact_form fieldset ol li label {	/* main labels styling */
				display: block;
				float: left;
				width: 120px;
				margin: 5px 0 0 0;
				padding: 5px 0 0 0; 
				clear: both;
				font-size: 11px;
				color: #222;
				}
	

/* 8B - submit / highlighting / errors 
--------------------- */

form input.submit {							/* submit button */
	margin: 5px 100px 0 0; padding: 5px 10px 5px 10px;
	height: 24px;
	color: #ead7a4;
	border: 1px solid #e7cea0;
	text-transform: uppercase; font-size: 11px;
	background: #8ccfec url("/images/drop_down_bg.jpg") repeat-x top left;
	font-family: Palatino, "Palatino Linotype", Times, serif;
	}
	
	form input.submit:hover {
		border: 1px solid #e7cea0;
		background: #8ccfec url("/images/form_gradient_dark.jpg") repeat-x top left;
		color: #111;
		}
	form input.submit:focus {
		border: 1px solid #e7cea0;
		background: #8ccfec url("/images/form_gradient.jpg") repeat-x top left;
		color: #333;
		}
	form#contact_form hr {
		clear: both;
		height: 0;
		visibility: hidden;
		}

form#contact_form fieldset ol li label em {		/* emphasis denoting required fields */
	color: #c98c00;
	}
form#contact_form fieldset ol li.error {		/* emphasis of li if required field was left blank */
	color: #c98c00;
	}
	form#contact_form fieldset ol li.error input,
	form#contact_form fieldset ol li.error select,
	form#contact_form fieldset ol li.error textarea {
		color: #c98c00;
		}