/*
#################### GLOBAL RESET ####################
*/
/* Based upon 'reset.css' in the Yahoo! User Interface Library: http://developer.yahoo.com/yui */
*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td {margin:0; padding:0;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}
table {border-collapse:collapse; border-spacing:0;}
fieldset, img {border:0;}
address, caption, cite, code, dfn, em, strong, th, var {font-style:normal; font-weight:normal;}
ol, ul, li {list-style:none;}
caption, th {text-align:left;}
h1, h2, h3, h5, h5, h6 {font-size:100%; font-weight:normal;}
q:before, q:after {content:'';}
a img {border:none}

/* CSS Tricks  - some handy css fixes */
.hide {position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden;}
.clearfix:after {visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0;}
* html .clearfix { zoom:1; } /* IE6 */
*:first-child+html .clearfix { zoom:1; } /* IE7 */

/*
#################### TYPOGRAPHY ####################
*/
/* Global reset-RESET - The below restores some sensible defaults */
body {font-size:100%; font-family:sans-serif;}
p, td, th, li, input, textarea {font-size:16px;}
p, td, th, li {margin:0 0 10px; line-height:1.5em;}
h1, h2, h3, h4, h5, h6 {margin:10px 0; font-weight:normal;}
h1 {font-size:28px;}
h2 {font-size:26px;}
h3 {font-size:24px;}
h4 {font-size:22px;}
h5 {font-size:20px;}
h6 {font-size:18px;}
strong, b {font-weight: bold; font-style:inherit;}
em, i {font-style: italic; font-weight:inherit;}
p, td, th {font-size:13px; line-height:1.5em; margin:0 0 10px;}
a, a:link, a:visited {
	text-decoration:underline;
}
a:visited {
}
a:hover, a:focus, a:active {
	text-decoration:none; 
}
a:active {background-color:#4b2027; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;} /* option 1 */
a:active { -moz-transform:translateY(1px); -webkit-transform:translateY(1px);} /* option 2 */
ul li {list-style:disc; margin:4px 0 4px 30px;}
	ul ul li {list-style:circle; margin:4px 0 4px 50px;}
		ul ul ul li {list-style:square; margin:4px 0 4px 70px;}
ol li {list-style:decimal; margin:4px 0 4px 30px;}
	ol ol li {list-style:upper-roman; margin:4px 0 4px 50px;}
		ol ol ol li {list-style:lower-roman; margin:4px 0 4px 70px;}
hr {border:0; color: #bbb; background-color: #bbb; height: 1px; clear:both;}
::selection {color:#fff; background: #55442e;}
::-moz-selection {color:#fff;background: #55442e;}
td, th {vertical-align:top;}
small {font-size:10px; color:#555;}



/*
#################### CUSTOM CSS ####################
*/

/* generic styles */
.wrapper {
	width:960px;
	margin:0 auto;
}
.message {color:#c00; text-align: center; font-size:14px; font-weight:400; padding:30px;}
#jsMessage,
#ie6Message {
	display:none;
}
.no-js #jsMessage,
.ie6 #ie6Message {
	display:block;
}

/* Layout */
body {
	background: #fff url(../images/linenRepeat.jpg) fixed;
}
	#container {
	}
		header {
			background:url(../images/wine-header.png) no-repeat center top;
			height:240px;
			margin:0 -4px;
		}
		#main {
			border:1px solid #cdc9c0;
			background:#f8f7f3;
			padding:16px;
			box-shadow:0 0 10px rgba(0,0,0,0.05);
		}
			.intro {
				width:86%;
				font-size:16px;
				margin:5px 0;
			}
			#main h2 {
				position: relative;
				margin:20px 0 20px;
				padding: 7px 14px;
				background:#4e4e4e;
				display:inline-block;
				color:#fff;
				font-size:21px;
				font-weight:bold;
			}
			#main h2:after{
				border:solid;
				border-color:#4e4e4e transparent;
				border-width:8px 8px 0 8px;
				bottom:-8px;
				content:"";
				display:block;
				left:8%;
				position:absolute;
			}
			#foods {
				margin:0 -6px;
			}
				#foods li {
					list-style:none;
					margin:0 0 5px;
					padding:3px 6px 0;
					float:left;
					width:144px;
					-moz-transition:backgrouund-color linear 0.2s;
					cursor:pointer;
					position:relative;
				}
				#foods li:hover {
					background:#fff;
				}
					#foods h3 {
						color:#606060;
						text-transform:lowercase;
						margin:0 0 10px;
						border-bottom:1px solid #aaa8a9;
						font-weight:bold;
						font-size:18px;
						line-height:1em;
					}
					#foods li:hover h3 {
						color:#444;
						border-bottom:1px solid #888;
					}
					#foods img {
						opacity:0.8;
					}
					#foods li:hover img,
					#foods li.open img {
						opacity:1;
					}
			#wines {
				clear:both;
			}
				.wineList {
					float:left;
					width:300px;
				}
					.bottle {
						background:url(../images/bottle.png);
						width:173px;
						height:22px;
						font-weight:bold;
						font-size:23px;
						color:#fff;
						line-height:1em;
						padding:12px 0 12px 15px;
					}/*
					#red { background-position:0 0; }
					#white { background-position:0 -46px; color:#333; }
					#sparkling { background-position:0 -92px; }
					#sweet { background-position:0 -138px; }*/
					
					.wineList {
						padding-left:4px;
					}
						.wineList li {
							list-style:none;
							margin:0;
							padding:2px 5px;
							text-decoration:underline;
							font-size:12px;
							font-weight:bold;
							color:#4D4D4D;
							cursor:pointer;
							position:relative;
						}
						.wineList li:hover {
							text-decoration:none;
							color:#000;
							background:#fff;
						}
					.tooltip {
						position: absolute;
						display:block;
						padding: 4px 12px;
						background:#fff;
						border:1px solid #bbb;
						color:#333;
						font-size:12px;
						-webkit-box-shadow:0 1px 5px rgba(0,0,0,0.2);
						-moz-box-shadow:0 1px 5px rgba(0,0,0,0.2);
						-o-box-shadow:0 1px 5px rgba(0,0,0,0.2);
						box-shadow:0 1px 5px rgba(0,0,0,0.2);
						-moz-border-radius:4px;
						-webkit-border-radius:4px;
						-o-border-radius:4px;
						border-radius:4px;
						left:90px;
						top:-48px;
						width:155px;
						font-weight:normal;
						line-height:1.6em;
					}
					.wltt {
						left:40px;
						top:-50px;
						text-decoration:none !important;
					}
					.tooltip:before{
						border:solid;
						border-color:#bbb transparent;
						border-width:8px 8px 0 8px;
						bottom:-9px;
						content:"";
						display:block;
						left:15%;
						position:absolute;
					}
					.tooltip:after{
						border:solid;
						border-color:#fff transparent;
						border-width:8px 8px 0 8px;
						bottom:-8px;
						content:"";
						display:block;
						left:15%;
						position:absolute;
					}
						.tooltip span {
							text-decoration:underline;
						}
						.tooltip:hover span {
							text-decoration:none;
							color:#000;
						}
		footer {
			background:#606060;
			padding:10px;
			color:#eee;
		}
			footer a {
				color:#fff;
			}
			
		#socialFloater {
			position:fixed;
			top:20px;
			left:15px;
			width:50px;
			padding:8px;
			/*background:#eee;
			background:rgba(255,255,255,0.3);
			-moz-border-radius:4px;
			-webkit-border-radius:4px;
			-o-border-radius:4px;
			border-radius:4px;*/
		}
		@media only all and (max-width: 1140px) {
			#socialFloater {
				display:none;
			}
		}
			#socialFloater .fb-like {
				margin-left:2px;
				padding-bottom:10px;
			}
			#socialFloater .twitter-share-button {
				margin-left:-3px;
				padding-bottom:7px;
			}
			#socialFloater .embedLink {
				font-size:12px;
				display:inline-block;
				padding:1px 6px;
				background:#eee;
				border:1px solid #ddd;
				color:#333;
				text-decoration:none;
				-moz-border-radius:3px;
				-webkit-border-radius:3px;
				-o-border-radius:3px;
				border-radius:3px;
				margin:15px 0 0 -2px;
				position:relative;
				top:-6px;
			}
			#socialFloater .embedLink:hover {
				background:#ddd;
				border:1px solid #ccc;
				color:#000;
			}
			#embed {
				width:600px;
				height:190px;
				left:50%;
				margin-left:-300px;
				bottom:-200px;
				background:#f8f8f8;
				-moz-box-shadow:0 0 10px rgba(0,0,0,0.2);
				-webkit-box-shadow:0 0 10px rgba(0,0,0,0.2);
				box-shadow:0 0 10px rgba(0,0,0,0.2);
				border-top:5px solid #555;
				position:fixed;
				text-align:center;
			}
				#embed h5 {
					font-weight:bold;
					font-size:22px;
					margin:15px 0;
					color:#333;
				}
				#close {
					cursor:pointer;
					position:absolute;
					top:8px;
					right:8px;
					display:block;
					width:16px;
					height:16px;
					padding:3px;
					border-radius:20px;
					background:url(../images/action_delete.png) no-repeat 3px 3px;
				}
				#close:hover {
					background-color:#fff;
					-moz-box-shadow:0 0 1px #000;
					-webkit-box-shadow:0 0 1px #000;
					box-shadow:0 0 1px #000;
				}
				#embed textarea {
					border:1px #999 solid;
					color:#111;
					font-size:11px;
					font-family:monospace;
					-moz-border-radius:3px;
					-webkit-border-radius:3px;
					border-radius:3px;
					padding:5px;
					width:450px;
					height:90px;
				}