/* -------------------------------------------------------------- 
RESET BROWSER DEFAULT STYLING
-------------------------------------------------------------- */
html, body, div, span, object, iframe, h1, h2,
h3, h4, h5, h6, p, blockquote, pre, a, abbr,
acronym, address, code, del, dfn, em, img, q,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin:0;padding:0;border:0;font-weight:inherit;
font-style:inherit;font-size:100%;
font-family:inherit;vertical-align:baseline;}
body {line-height:1.5;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
table, td, th {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:none;}

/* -------------------------------------------------------------- 
CLEARING and FLOATING
-------------------------------------------------------------- */

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix {
	display: inline-block;
}

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}

.clear{
	clear:both;
}
.right-float{
	float:right;
	margin-left:2em;
	margin-right:0;
}
.left-float{ 
	float:left;
	margin-right:2em;
	margin-left:0;
}

/* -------------------------------------------------------------- 
TYPOGRAPHY
-------------------------------------------------------------- */
html, body { height: 100%; }
body { 
  font-size: 62.5%; /* 1.2em = 12px */ 
  color: #353535; 
  font-family: Georgia, serif;
}
#container { font-size: 1.4em; }

/* Headings
-------------------------------------------------------------- */

h1,h2,h3,h4,h5,h6 { font-weight: normal; color: #111; }

h1 { font-size: 3em; line-height: 1; margin-bottom: 0.5em; }
h2 { font-size: 2em; margin-bottom: 0em; color: #353535; }
h3 { font-size: 1em; line-height: 1; margin-bottom: 0em; font-weight: bold; }
h4 { font-size: 1em; line-height: 1.25; margin-bottom: 0em; font-weight: bold; }
h5 { font-size: 1em; font-weight: bold; margin-bottom: 0em; font-weight: bold; }
h6 { font-size: 1em; font-weight: bold; font-weight: bold; }

h1 img, h2 img, h3 img, 
h4 img, h5 img, h6 img {
  margin: 0;
}

h2 span.extra {
	font-size: 60%;
	color: #666;
	font-style: italic;
}


/* Text elements
-------------------------------------------------------------- */

p           { margin: 0 0 1.5em; color: #575656; }
p img.left  { float: left; margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p img.right { float: right; margin: 1.5em 0 1.5em 1.5em; }

a:focus, 
a:hover,
span.link:hover     { color: #3366ff; text-decoration: underline; }
a,
span.link	{ color: #3366ff; text-decoration: none; outline: 0 }

blockquote  { margin: 1.5em; color: #666; font-style: italic; }
strong      { font-weight: bold; }
em,dfn      { font-style: italic; }
dfn         { font-weight: bold; }
sup, sub    { line-height: 0; }

abbr, 
acronym     { border-bottom: 1px dotted #666; }
address     { margin: 0 0 1.5em; font-style: italic; }
del         { color:#666; }

pre 				{ margin: 1.5em 0; white-space: pre; }
pre,code,tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; }


span.breadcrumb { color: #a2a2a2; font-style: italic; }

.grey { color: #676767; }
.italic { text-decoration: italic; }

/* Lists
-------------------------------------------------------------- */

li ul, 
li ol       { margin:0 1.5em; }
ul, ol      { margin: 0 1.5em 1.5em 1.5em; }

ul          { list-style-type: disc; }
ol          { list-style-type: decimal; }

dl          { margin: 0 0 1.5em 0; }
dl dt       { font-weight: bold; }
dd          { margin-left: 1.5em;}

.staffs			{ overflow: hidden; }
.staff			{ float: left; width: 458px; overflow: hidden; }
.staffs .left	{ margin: 0 1.5em 1.5em 0; }
.staffs .right	{ margin: 0 0 1.5em 0; }
.staff img 		{ float: left; margin: 0 1.5em 0 0 }
.staff dt		{ font-weight: normal; font-size: 1.5em; }
.staff dd		{ margin: 0; }
.staff dd span	{ font-weight: bold; display: block; width: 70px; float: left; }

/* Tables
-------------------------------------------------------------- */

table       { margin-bottom: 1.4em; width:100%; }
th          { font-weight: bold; }
thead th 		{ background: #c3d9ff; }
th,td,caption { padding: 4px 10px 4px 5px; }
tr.even td  { background: #e5ecf9; }
caption     { background: #eee; }


/* Misc classes
-------------------------------------------------------------- */

.small      { font-size: .8em; margin-bottom: 1.875em; line-height: 1.875em; }
.large      { font-size: 1.2em; line-height: 2.5em; margin-bottom: 1.25em; }
.hide       { display: none; }

.quiet      { color: #666; }
.loud       { color: #000; }
.highlight  { background:#ff0; }
.added      { background:#060; color: #fff; }
.removed    { background:#900; color: #fff; }

.first      { margin-left:0; padding-left:0; }
.last       { margin-right:0; padding-right:0; }
.top        { margin-top:0; padding-top:0; }
.bottom     { margin-bottom:0; padding-bottom:0; }

.no-border { border: none !important; }

/* -------------------------------------------------------------- 
 FORMS
-------------------------------------------------------------- */

label       { font-weight: bold; }
fieldset    { padding:1.4em; margin: 0 0 1.5em 0; border: 1px solid #ccc; }
legend      { font-weight: bold; font-size:1.2em; }

ul.checkout-form { list-style-type: none; float: left; padding: 1em; margin: 0; }
ul.checkout-form li { padding-bottom: 0.5em; overflow: hidden; }
ul.checkout-form li label { width: 130px; float: left; }
ul.checkout-form li input { float: left; width: 230px; border: 1px solid red; padding: 3px; border-color: #cdcdcb; }
ul.checkout-form li button { float: right; }

ul.checkout-form li ul { list-style-type: none; float: left; }
ul.checkout-form li ul li { float: left; color: #f60; font-style: italic; padding-bottom: 0; }


/* Form fields
-------------------------------------------------------------- */

input.text, input.title,
textarea, select {
  margin:0.5em 0;
  border:1px solid #bbb;
}

input.text:focus, input.title:focus,
textarea:focus, select:focus {
  border:1px solid #666;
}

input.text, 
input.title   { width: 300px; padding:5px; }
input.title   { font-size:1.5em; }
textarea      { width: 390px; height: 250px; padding:5px; }


/* Success, notice and error boxes
-------------------------------------------------------------- */

.error, .notice, .success {
	padding:.8em;
	margin-bottom:1em;
	border:2px solid #ddd;
	padding-left:5em;
	-moz-border-radius: 0 10px 0 10px;
	-webkit-border-radius: 0 10px 0 10px;
}

.error {
	background:#FBE3E4 url(../img/error.png) no-repeat 15px center;
	color:#8a1f11;
	border-color:#FBC2C4;
}

#newsletter_subscription form input { width: 235px; }
#newsletter_subscription .errorlist { display: none; }

.notice {
	background:#FFF6BF url(../img/notice.png) no-repeat 15px center;
	color:#514721;
	border-color:#FFD324;
}
.success {
	background:#E6EFC2 url(../img/success.png) no-repeat 15px center;
	color:#264409;
	border-color:#C6D880;
}
.error a    { color: #8a1f11; }
.notice a   { color: #514721; }
.success a  { color: #264409; }

/* -------------------------------------------------------------- 
 LAYOUT 
-------------------------------------------------------------- */

/* Containers
-------------------------------------------------------------- */

body.horeca {
	background-color: #9ea0b2;
	background-image: url('/media/img/layout/bg_horeca_new.jpg');
	background-repeat: no-repeat;
}
body.horeca #mode-tab {
	position: absolute;
	left: 3px;
	top: 20px;
	height: 179px;
	width: 24px;
	background-image: url('/media/img/layout/tab_horeca.png');
}

body,
body.retail {
	background-color: #fff;
	background-image: url('/media/img/layout/bg_retail.jpg');
	background-repeat: no-repeat;
}

#container { 
	min-height: 100%;
	position: relative;
	background-image: url('/media/img/layout/bg_page.png');
	background-repeat: repeat-y;
	margin: 0px auto;
	width: 1037px;
}

#page { 
	padding: 0px 27px 0px 27px;
}

#page.wine {
	background-image: url('/media/img/layout/bg_wine.png'); 
	background-repeat: no-repeat;
	background-position: center bottom;
	min-height: 1100px;
}

#newsletter_subscription {
	background-image: url('/media/img/layout/newsletter_bg.png');
	background-repeat: repeat-x;
	border: 1px solid #4f4428;
	padding: 9px 28px;
	padding-right: 0px;
	margin-top: 88px;
}

#newsletter_subscription p { line-height: 26px; color: #eeeeee; margin: 0; padding: 0; float: left; }
#newsletter_subscription input { font-weight: bold; padding: 4px; width: 315px; margin-left: 50px; color: #a0a0a0; border: 1px solid; border-color: #fff #cdcdcb #cdcdcb #fff; }
button.grey, a.button { margin-left: 20px; width: 101px; height: 29px; font-weight: bold; color: #5a5a5a; border: none; background: url('/media/img/layout/button_send.png') transparent no-repeat; background-position: bottom center }
a.button { display: block; font-family: Arial, sans-serif; text-align: center; line-height: 2em; }
a.button:hover { text-decoration: none; }
a.button_large {margin-left: 20px; width: 350px; height: 29px; font-weight: bold; color: #5a5a5a; border: none; background: url('/media/img/layout/button_send_large.png') transparent no-repeat; background-position: bottom center}

#quotes { padding-top: 20px; padding-bottom: 40px; }
#quotes a:hover { text-decoration: none; }
#quotes ul { float: left; width: 805px; margin: 0; padding: 0; font-size: 1.8em; list-style-type: none; color: #848484; }
#quotes ul.arrows { width: 100px; list-style-type: none; float: right; }
#quotes ul.arrows li { margin-right: 10px; float: left; width: 38px; height: 87px; }
#quotes ul.quotes li a { color: inherit; }
#quotes ul.arrows li.left { background-image: url('/media/img/layout/arrow_left.png'); }
#quotes ul.arrows li.right { background-image: url('/media/img/layout/arrow_right.png'); }
#quotes ul.arrows li.right:hover { background-image: url('/media/img/layout/arrow_right_hover.png'); cursor: pointer; }
#quotes ul.arrows li.left:hover { background-image: url('/media/img/layout/arrow_left_hover.png'); cursor: pointer; }
#quotes ul.arrows a { display: block; width: 38px; height: 87px; color: white; }

.grid { width: 299px; margin-right: 20px; float: left; margin-bottom: 45px; }
.grid.last { margin-right: 0px; }
.grid h3 { margin-top: 10px; margin-bottom: 10px; }
.grid img { border: 1px solid #c2c2c2; }
.grid.top img { margin-right: 10px; float: left; border: none; }
.grid .timestamp { float: right; padding-top: 3px; }


#details .image { float: left; width: 280px; text-align: center; margin: 1em 1.5em 1em 0; }
#details .box { padding: 1em; width: 280px; float: right; border: 1px solid #681c04; border-top: 5px solid #681c04; margin-left: 1em; margin-bottom: 1em;  }
#details .box p { margin: 0; }
#details .box strong { color: #353535; }
#details .box table { padding-top: 5px; margin: 0; }
#details .box table tr.odd { background-color: #fffcd4; }
#details .box h3 { margin: 1em 0 0 0; }
#details .box div.add-to-cart a {
	background-image: url('/media/img/layout/cart_check.png');
	background-repeat: no-repeat;
	line-height: 31px;
	padding-left: 40px;
	display: block;
}
#details .box div.go-to-store a {
	padding-left: 40px;
	display: block;
}

#details .info { padding-top: 20px; }
#details .info span.highlight-intro { font-weight: normal; }
#details .hasimage { margin-left: 290px; }
#details .info ul { margin: 0; margin-left: 15px; }
#details .box ul { margin: 0; list-style-type: none; }
#details ul.description { padding-top: 1em; list-style: none; color: #575656; }
#details ul.description li { padding: 0px 0px 2px 5px; }
#details .description p { background-color: #fbfcec; padding: 1em; }
#details span.highlight-intro { color: #484848; display: block; font-size: 1.2em; font-weight: normal; padding-bottom: 1em; }


table.list {}
table.list tr.title th,
body.horeca table.list tr.title th { background-color: transparent; height: 70px; vertical-align: bottom; }
/*table.list tr th { color: #fff; background-color: #621903; }*/
table.list tr th { color: #fff; background-color: #abc; }
body.horeca table.list tr th { color: #fff; background-color: #b9bb8c; }
/*table.list tr.odd { background-color: #fffcd4; }*/
table.list tr.odd { background-color: #eee; }
body.horeca table.list tr.odd { background-color: #f5f6e6; }
table.list input { border: 1px #bbb solid; padding: 3px 5px 3px 0; text-align: right; }
table.list td.add-to-cart { padding: 0; } 
table.list td.add-to-cart a { 
	background-image: url('/media/img/layout/cart_add_button.png');
	background-repeat: no-repeat;
	display: block;
	width: 56px;
	height: 29px;
	text-indent: -20000px;
	float: right;	
}

table.list .price { text-align: right; padding-right: 15px; }

#gallery img { margin-right: 5px; }

#search-container { float: right; height: 59px; z-index: 15; position: relative; }
#search-container .vertical-shade { float: right; height: 100%; width: 31px; background-image: url('/media/img/layout/menu_shade_vertical.png'); background-repeat: repeat-y; }
#search-container .content { color: #fff; float: right; background-color: black; width: 609px; float: right; padding: 15px; }
#search-container .content input { margin-top: 2px; float: left; border: 1px solid red; width: 470px; padding: 3px; border-color: #fff #cdcdcb #cdcdcb #fff; }
#search-container .content button { float: right; font-size: 1em; padding-top: 0; }

#blog .blog-content { width: 430px; float: left; }
#blog .blog-content h3 { color: #671B04; }
#blog .blog-content span.timestamp { line-height: 2em; }
#blog .post-image { float: left; padding-top: 4em; padding-left: 2em; }
#blog .wine-info { float: left; padding-top: 4em; padding-left: 2em; }
#blog .wine-info img { float: left; margin-right: 1em; }
#blog .wine-info p { margin: 0; padding: 0; }
#blog .wine-info ul { clear: left; float: left; font-size: 0.8em; }
#blog .wine-info div { float: left; }

.textpage {
	padding: 0 200px 0 55px;
}

span.timestamp { color: gray; font-size: 0.8em; text-transform: uppercase; font-family: Arial, sans-serif; font-weight: normal; }

.ac_results { width: 476px !important; }
.ac_results li.ac_over { background-color: #671B04; }


/* Header
-------------------------------------------------------------- */

#header {}

#menu {
	font-family: Arial, sans-serif;
	background-image: url('/media/img/layout/menu_bg.png');
	background-repeat: no-repeat;
	margin: 0;
	padding-left: 45px;
	overflow: hidden;
	float: right;
	width: 625px;
	height: 65px;
	z-index: 10;
	position: relative;
}

#menu li {
	display: block;
	float: left;
	margin-right: 35px;
	line-height: 35px;
	padding-left: 10px;
	padding-right: 10px;
}

#menu li.first { padding-left: 14px; }
#menu li.search { margin-right: 0px; margin-left: 15px; }
#menu li a { color: #d6d6d6; text-decoration: none; font-weight: bold; }

#menu.articles li.articles,
#menu.producers li.articles,
#menu.producer li.articles,
#menu.vintage li.articles,
#menu.news li.news,
#menu.blog li.news,
#menu.flatpage_about li.about,
#menu.flatpage_environmental-policy li.about,
#menu.staff li.about,
#menu.horeca_staff li.about,
#menu.flatpage_horeca_about li.about,
#menu.flatpage_about_english li.about,
#menu.flatpage_about_francais li.about,
#menu.flatpage_about_contact li.contact,
#menu.flatpage_horeca_about_contact li.contact 
{ background-image: url('/media/img/layout/menu_shade.png'); height: 37px; }

#menu.articles li.articles a,
#menu.producers li.articles a,
#menu.producer li.articles a,
#menu.vintage li.articles a,
#menu.news li.news a,
#menu.blog li.news a,
#menu.flatpage_about li.about a,
#menu.flatpage_environmental-policy li.about a,
#menu.staff li.about a,
#menu.horeca_staff li.about a,
#menu.flatpage_horeca_about li.about a,
#menu.flatpage_about_english li.about a,
#menu.flatpage_about_francais li.about a,
#menu.flatpage_about_contact li.contact a, 
#menu.flatpage_horeca_about_contact li.contact a 
{ color: #4c4c4c; }

#logo { 
	float: left;
	padding-left: 78px;
	padding-top: 23px;
}

a.cart { 
	float: right; 
	clear: right; 
	display: block;
	width: 95px;
	height: 38px;
	background-image: url('/media/img/layout/cart_button.png'); 
	background-repeat: no-repeat;
	padding-left: 55px;
	line-height: 38px;
	margin-right: 1.5em;
	color: #509d3f;
	font-weight: normal;
	font-family: Arial, sans-serif;
	font-size: 14px;
	margin-top: -0.5em;
}
a.cart:hover {
	text-decoration: none;
}

/* Main
-------------------------------------------------------------- */

#main { padding-bottom: 210px; position: relative; }
#content {
	clear: both;
	padding: 0px 23px;
	padding-bottom: 20px;
}

/* Footer
-------------------------------------------------------------- */
#footer p {	color: #c8a691; float: left; font-weight: lighter; }
#footer p strong {	color: #c7ada5; }
#footer a { color: #c8a691; text-decoration: none; }
#footer { 
	background-color: #671b04;
	margin-left: 23px;
	margin-right: 23px;
	padding-top: 30px;
	padding-left: 28px;
	padding-right: 28px;
	height: 165px;
	position: absolute;
	bottom: 0;
	width: 880px;
}

#footer ul { list-style-type: none; float: left; margin: 0; }
#footer ul.left { border-right: 1px solid #864632; margin-left: 60px; padding-right: 60px;}
#footer ul.right { margin-left: 25px; }
#footer ul li a { text-decoration: none; }
#footer ul li.button a {
	display: block;
	width: 229px;
	height: 36px;
	line-height: 36px;
	text-align: center;
	background-image: url('/media/img/layout/button_footer.png'); 
	background-repeat: no-repeat;
	margin-bottom: 4px;
	color: #c7ada5;
}

/* Jonas added temp design stuff
-------------------------------------------------------------- */

th.right, td.right {
	text-align: right;
} 
