/* ELEMENTS */

body { 
	margin: 0; 
	background: #f5f0e9 url(../images/bg_body.gif) repeat-x; 
	font-family:'trebuchet ms',verdana,arial; 
}

body.jphorecawijnen { background: #86B4CC url(../images/bg_body_jphoreca.gif) repeat-x; margin: 20px 0 }
body.palmesteynwijn { background: #dcdcdc }

a { color: #5C75A3 }

h1 { 
	font-family: Sylfaen, Georgia, "Times New Roman", Times, serif; 
	color: #cc0000; 
	font-size: 2.5em;  
	margin-bottom: 0.25em; 
	padding: 0;
	line-height: 1.5em;	
	position: relative;
	left: -0.2em;
}

h2 { text-transform: uppercase; font-size: 1.3em; font-weight: bold; }
h3 { color:#CC0000; text-transform: uppercase; font-size: 1.2em; font-weight: bold; }

strike {
	color: #999;
	font-size: 0.9em;
}

table { margin-bottom:1.4em; width:100%; }
th { font-weight:bold; }
th, td, caption { padding:4px 10px 4px 5px; }

/* HOME BLOCKS */

.homeblock { 
	float: left; 
	width: 150px; margin-right: 30px;
	/* 
	Photos are 148px width a border of 1px, so the homeblocks are 150px.
	Max. width is 510px, so the width of the margin between the columns is 510 - (3 x 150) / 2 = 30px.
	Alternatively: (510 / 3) = 170 , 170 - 150 = 20, 20 + (20 / 2) = 30
	*/
}
.homeblock.last { 
	margin-right: 0
}

.homeblock div.border { 
	/*width: 130px; */
	height: 265px; 
	overflow: hidden; 
	border: 1px solid #E7D8BC; 
	vertical-align: middle;
	margin-right:0; padding-right:0; /* because of Blueprint CSS  */
}
 
.homeblock h3 { 
	margin-top: 1em;
	margin-bottom: 5px; 
}

.homeblock a { 
	text-decoration: none;
}

.homeblock p {
 	margin: 0;
}

.homeblock p.link {
 	margin: 5px 0 0 0;
}

.homeblock p.link a {
	text-decoration: underline;
}


/* VARIOUS CLASSES */

/*img.border { border: 1px solid #E7D8BC; }*/
img.warning { position: relative; top: 3px; left: 3px; }

.flash-replaced .alt { display: block; height: 0; position: absolute; overflow: hidden; width: 0; }

.hidden 		{ visibility: hidden; display: none }
.starthidden 	{ display: none }
.floatright 	{ float: right }
.nowrap 		{ white-space: nowrap; }
.uppercase 		{ text-transform: uppercase; }

.numberOfRowsAffected { background-color: #ffffaa }
p.numberOfRowsAffected { padding: 0.5em 1em; }

.unimportant { color: #999; }
p.important, div.important { border: 2px solid #228b22; color: #228b22; padding: 1em; font-weight: bold; }

.bottom-margin { margin-bottom: 1em; }
div.content { padding-top: 20px; padding-bottom: 20px; }
li div.streken { padding: 8px 0; }
li div.streken h3 { padding: 0 }

/* PHONE FAX LOGIN */

.login, .create-account, p.wachtwoord-vergeten  { 
	background-repeat: no-repeat;
	background-position: 0 50%;
	padding: 0 20px; 
}
.login 					{ background-image: url(/common/images/famfamfam_silk_icons_v013/key.png); }
.create-account 		{ background-image: url(/common/images/famfamfam_silk_icons_v013/key_add.png); }
p.wachtwoord-vergeten { background-image: url(/common/images/famfamfam_silk_icons_v013/key_go.png); }
.ui-datepicker-trigger { position: relative; top: 3px; margin: 0 0 0 2px; }

/* GEBRUIKERSINFO  */

#gebruikersinfo { font-size: 1em; padding: 16px 16px 0 16px; }
#gebruikersinfo #naam { font-weight: bold; }
#gebruikersinfo #company { }
#uitloggen a:link, #uitloggen a:visited, #uitloggen a:hover, #uitloggen a:active { color: #aaa; }


/* HEADER MAIN FOOTER */
#header { height: 120px; }

/* 
CSS en markup aangepast: #header.shop200 / #header.shop300 / etc. is geldig, maar werkte niet in IE(6)
vanwege de "multiple #id.class bug": http://css-discuss.incutio.com/?page=MultipleIdClassBug
*/
.shop200 #header { background: url(../images/bg_header_200.jpg) repeat-x bottom; }
.shop300 #header { background: url(../images/bg_header_300.jpg) repeat-x bottom; } 
.shop400 #header { background: url(../images/bg_header_400.jpg) repeat-x bottom; }
.shopDebtorInvoiceCodeFilter10527 #header { background: url(../images/bg_header_jphoreca.gif) repeat-x bottom; } 
.shopDebtorInvoiceCodeFilter11017 #header { background: url(../images/bg_header_palmesteynwijn.jpg) repeat-x left; } 

#logo { height: 89px; padding-top:1px; }
body.jphorecawijnen #logo { padding-top: 0px; overflow: hidden; }
body.jphorecawijnen #tabs { background-image: url(/images/logo_jphoreca.gif); background-position: -1px 100%; background-repeat: no-repeat }
body.palmesteynwijn #logo { padding: 0; overflow: hidden; }
body.palmesteynwijn #tabs { background-image: url(/images/logo_palmesteynwijn.jpg); background-position: -1px 100%; background-repeat: no-repeat }
#log { font-size: 0.9em; color: silver }
#main { background-color: #fff; }
#footer { margin: 1em 0; text-align: center; color:#999 }
body.jphorecawijnen #footer { 
	background-image: url(../images/rounded-bottom-corners-jphoreca.gif);  
	background-position: top; background-repeat: no-repeat;    
	margin-top: 0; padding-top: 1em;
}
body.backoffice #footer { background-image: none }
#footer a { color:#999 }
body.jphorecawijnen #footer, body.jphorecawijnen #footer a { color: #fff; }
body.palmesteynwijn #footer, body.palmesteynwijn #footer a { color: #fff; }
body.backoffice #footer, body.backoffice #footer a { color: #999; }

/* rounded-bottom-corners-jphoreca.gif */
/* CAPTCHA */
#reload_captcha { float: left }
#captcha img { margin-bottom: 0.5em; float: left }
#captcha a { 
	margin-left: 0.5em; padding-left: 18px;
	background: url(/common/images/famfamfam_silk_icons_v013/arrow_refresh_small.png) no-repeat 0 3px;
}
 
/* FORMS */
fieldset { padding: 0; margin: 0; border: none; }
legend { margin-bottom: 5px; font-weight: bold; font-size: 1.1em; color: #c4a27d; }
button { padding: 5px; margin-bottom: 1em; }
button.withimage { padding: 0 4px 4px 0; }
div.span-5 button { width: 160px; }
button img { position: relative; top: 2px; margin: 0 3px;}
input.amount { float: left; width: 30px; }
label { width: 200px; }
div.validationerror { margin: 0 0 0 200px;  }
label.big, input.big { font-size: 1.25em; }

.buttonrow .leegmaken { float: left; width: 310px; }
.buttonrow .herberekenen { float: left; width: 210px; text-align: right; }
.buttonrow .naardekassa { float: left; width: 350px; text-align: right; }
button#naardekassa { padding-left: 5em; padding-right: 5em; font-weight: bold; width:300px; }

.sidebar button { font-size: 1.3em; width:100%; }
div.plusminus { float: left }
img.add_amount, img.subtract_amount { 
	display: block; /* for IE7 */
	padding: 0 0 1px 2px; 
} 

input.captcha { margin-left: 220px; }
label.flessen { padding-left: 10px; width: 138px; }
body.kassa button { font-weight: bold; padding: 4px; }

/* LOGIN FORM */

#login-form { 
	width: 150px;
	background: #fcfaf6 url(/images/bg_bestel-row.gif) repeat-x; 
	border: 1px solid #f6e9d6; 
	padding: 20px; 
	margin: 0 0  0 15px;
}

#login-form .question {
	width: 170px;
}

#login-form .question label {
	width: 170px;
}

#login-form .question input {
	width: 90px;
}

#login-form #question-keep_logged_in input {
	width: 30px;
	padding: 0;
	margin: 0 0 0 -7px;
}

#login-form #question-keep_logged_in label {
	width: 120px;
}

#login-form p.create-account {
	margin: 0;
	padding: 0 0 0 20px;
}

#login-form h2 {
	font-size: 1.6em;
}

#login-form .submitbutton button {
	font-size: 1.1em;
	width: 100px;
	padding: 0;
}

/* ACCOUNT AANMAKEN */



body.account-aanmaken .content table { 
	width: 570px;  
}

body.account-aanmaken .content table tr th { 
	text-align: left;
	width: 200px;
}

form#account-wijzigen .question {
	width: 570px;  
	border: 1px solid #f8eaea;
	background: #fcf8f8;
	
}

body.account-aanmaken .question label {
	width: 210px;
	padding: 5px;
	border-right: 1px solid #f8eaea;
	background: #faf4f4;
}

form#account-wijzigen .question input {
	width: 200px;
	margin: 5px 5px 5px 10px;
}

body.account-aanmaken #question-EmailNieuwsbrief label {
	border-right: none;
	width: 490px;
}

body.account-aanmaken #question-EmailNieuwsbrief input {
	width: 20px;
}

body.account-aanmaken #question-Email, body.account-aanmaken #question-Wachtwoord {
	margin: 0 0 4px 0;
}

body.account-aanmaken form em {
	color: #888;
}




/* WIJN DETAIL */


#wine-image-and-buttons {
	margin: 0 0 15px 0;
}

#wine-image-and-buttons #left {
	float: left;
	width: 180px;
}

#wine-image-and-buttons #left #wine-image {
	width: 156px;
	height: 270px;
	overflow: hidden;
	border: 1px solid #E7D8BC;
	text-align: center;
}

#wine-image-and-buttons #right {
	float: left;
	width: 330px;
}

div#description {
	font-size: 1.1em;
	color: #888;
	font-style: italic;
	margin: 0;
}

#product-navigatie {
	text-align: right;
	margin: 1em 0;
}

a.voeg-toe-aan-favorieten, a.verwijder-uit-favorieten {
	padding: 0 0 0 20px;
	color: #999;
	text-decoration: none;
}

a.voeg-toe-aan-favorieten {
	background: url(/common/images/famfamfam_silk_icons_v013/star_add.png) no-repeat;
}
	
a.verwijder-uit-favorieten {
	background: url(/common/images/famfamfam_silk_icons_v013/star_delete.png) no-repeat;
}

a.voeg-toe-aan-favorieten:hover {
	text-decoration: underline;
	color: #444;
}

table#details {
	border: none;
}

table#details tr th {
	text-align: left;
	width: 120px;
	border: none;
	background: none;
	padding: 2px 0 2px 0;
}

table#details tr td {
	text-align: left;
	width: 230px;
	border: none;
	padding: 2px 0 2px 0;
}

table#details-extra tr th {
	width: 250px;
}


/* BESTEL ROW */

.bestel-row {
	border: 1px solid #f6e9d6; 
	background: #fcfaf6 url(/images/bg_bestel-row.gif) repeat-x;
	padding: 7px 0 7px 5px;
	/*width: 345px; too wide, max = 330*/
}

.bestel-row .aantal {
	float: left;
	width: 45px;
	padding: 4px 0 0 5px;
}

.bestel-row .label-flessen {
	float: left;
	width: 63px;
	padding: 5px 0 0 0;
	font-weight: normal;
	font-size: 1.1em;
	color: #333;
}

.bestel-row .voegtoe-button {
	float: left;
	padding: 0;
}

.bestel-row .voegtoe-button button {
	width: 200px;
}

/* TABLES */

form.validate table.error { padding: 0; }

table.themed {
	border-right: 1px solid #f8eaea;
	border-bottom: 1px solid #f8eaea;
	border-collapse:collapse;
}

table.themed th {
	background: #faf4f4;
	padding-left: 10px;
	border-left: 1px solid #f8eaea;
	border-top: 1px solid #f8eaea;
	
}

table.themed tr td {
	background-color: #fcf8f8;
	padding-left: 10px;
	border-left: 1px solid #f8eaea;
	border-top: 1px solid #f8eaea;
}

table.themed tr.even-row td { background-color: #fff; border-top: 1px solid #f8eaea; }

th.number, td.number { text-align: right }
th.amount { width: 50px; }

tr.total td.aantalartikelen { border-right: none; }
tr.total td { font-weight: bold; border-top: 1px solid #E7D8BC; border-right: none; border-bottom: none;  }
td.aantal { width: 50px; }
td.changed_most_recently, tr.even td.changed_most_recently  { background: #ffcc00 }
td button { font-size: 0.8em; white-space: nowrap; margin-bottom: 0; }

table.error th { background-image: none; }

td.plusminuscontainer { width: 50px; }


/* WIJNEN */

table#wijnen {
	border: none;
}

table#wijnen tr th {
	background: url(/images/bg_th_forms.gif) repeat-x;
	border-top: 1px solid #e7d8bc; 
}

table#wijnen tr td {
	border: none;
	border-top: 1px solid #f8eaea; 
	padding: 20px 0 0 5px;
}

table#wijnen tr td.foto {
	border-right: none;
	text-align: center;
	width: 60px;
	padding-top: 4px;
	background: #fff;
} 

table#wijnen tr td.naam {
	padding-left: 15px;
}

table#wijnen tr td.prijs {
	padding-right: 15px;
}

table#wijnen tr td.aantal {
	width: 50px;
}

table#wijnen tr td.toevoegen {
	width: 40px;
	text-align: right;
}

table#wijnen tr td .land {
	font-weight: bold;
}

table#wijnen tr td .streek {
	color: #aaa;
}



/* WINKELWAGEN */

table#winkelwagen {
	border: none;
	margin: 0 0 20px 0;
}

table#winkelwagen tr th {
	color: #fff; 
	background: #de013e url(../images/bg_th_32.gif) repeat-x top;
	border: none;
	padding: 7px 0 7px 10px;
	height: 18px;
}

* html table#winkelwagen tr th {
	height: 25px;
}

/* the following rules apply only to IE7 */
*+html table#winkelwagen tr th {
	height: 25px;
}



table#winkelwagen tr td {
	padding-top: 30px;
	border-top: 1px solid #f8eaea; 
	border-left: none;
}

table#winkelwagen tr td.foto {
	padding: 5px 0 5px 0;
	text-align: center;
	width: 80px;
	background: #fff;
}

table#winkelwagen tr td.naam {
	padding-left: 15px;
}

table#winkelwagen tr.total td {
	border-top: 1px solid #555;
	padding: 10px;
	font-size: 1.1em;
}

table#winkelwagen tr th.number {
	padding-right: 7px;
}

table#winkelwagen tr.changed_most_recently td  { 
	background: #fbfcda;
	/* FVE: borders uitgezet omdat in het geval van twee gewijzigde regels na elkaar er een dikke gele border van 4px ontstaat.
	border-top: 2px solid yellow;
	border-bottom: 2px solid yellow;
	*/
}


/* WINKELWAGEN RIGHTSIDE */

.sidebar table { 
	font-size: 0.8em; 
	margin: 16px; 
	width: 198px; /* 198 = 230 - 2*16 */  
	border: 1px solid #f8eaea;
}

.sidebar table tr th {
	background: url(/images/bg_th_25.gif) repeat-x;
	color: #fff;
}

.sidebar table tr.even td {
	background: #fcf8f8;
	border-top: 1px solid #f8eaea;
} 

.sidebar table tr td {
	background: #fff;
	border-top: 1px solid #f8eaea;
}

.sidebar table tr td.name { /* white-space: nowrap - FVE: removed because it makes the table too wide */  }

.sidebar table tr.changed_most_recently td  { 
	background: #fdea02;
}

.sidebar table tr td {
	border-top: 1px solid #f8eaea;
	border-left: none;
	padding-left: 0px;
}
.sidebar table tr td.first { padding-left:10px; }

.sidebar table tr td#naarwinkelwagen {
	border-top: none;
}


/* FAVORIETEN */

table.favorieten { border-right: none; width: 100%; }

table.favorieten tr td {
	border-left: none;
	padding-top: 12px;
}

table.favorieten tr td.naam { padding-left: 0; width: 160px; }

/* Aflevergegevens */

table#aflevergegevens {
	border-top: 1px solid #E7D8BC; 
	border-left: 1px solid #E7D8BC; 
	border-bottom: 1px solid #E7D8BC; 
	empty-cells: show; 
	border-collapse: collapse;
}

table#aflevergegevens tr th {
	border-right: 1px solid #E7D8BC; 
	border-top: none;
	border-left: none;
	width: 200px;
	background: #faf4f4;
	padding-left: 10px;
}

table#aflevergegevens tr td {
	border-right: 1px solid #E7D8BC; 
	border-left: 1px solid #E7D8BC; 
	border-top: none;
}

table#aflevergegevens tr td .question {
	margin-left: 10px;
}

table#aflevergegevens tr td #question-uwReferentie {
	margin-top: 10px;
}

#back_submit {
	margin-left: 210px;
}

form#bestelling_controleren .submitbutton {
	text-align: right;
	height: 40px;
	margin: 0;
	padding: 0;
}

/* ORDER HISTORY */

body.orderhistorie table {
	margin-bottom: 10px;
}

body.orderhistorie h3 {
	margin-bottom: 5px;
}

body.orderhistorie button {
	float: right;
	margin: 0 0 15px 0;
}

table.orderspecs {
	width:auto;
	border:0;
}


table.orderspecs th, table.orderspecs td {
	background:#fff;
	padding:0 10px 0 0;
	border:0;
}


/* TABS */
#tabs { padding-top: 5px; height:24px; }
#tabs ul {
	list-style: none;
	margin: 0 0 0 200px; padding: 0;
}
#tabs ul li {
	text-align: center;
	margin: 0 0 0 2px;
	float: left;
}
#tabs ul li a {
	color: #fff;
	display: block;
	width: 130px; height: 25px; line-height: 25px;
	text-decoration: none;
	font-size: 1.1em;
	font-weight: bold;
	background-color: #9e1a31;
	background-image:  url(../images/bg_tab_sprite.gif);
	background-position: 0 0;
	background-repeat: no-repeat;
}
#tabs ul li a:hover {
	/*
	background-color: #235d9f;
	*/
	background-position: -138px 0
}	
#tabs ul li.selected a {
	color: #cc0000;
	/*
	background-color: #235d9f;
	*/
	background-position: -275px 0
}
#tabs ul li.length4 a, #tabs ul li.length5 a, #tabs ul li.length6 a {
	width: 80px;
	background-position: -411px 0px;
}
#tabs ul li.length4 a:hover, #tabs ul li.length5 a:hover, #tabs ul li.length6 a:hover {
	background-position: -498px 0px;
}
#tabs ul li.selected.length4 a, #tabs ul li.selected.length5 a, #tabs ul li.selected.length6 a {
	background-position: -583px 0px;
}

/* SIDEBARS */
.sidebar { padding: 16px 0 }
.sidebar h3 { font-size: 1em; font-weight: bold; margin: 0 16px; padding: 16px 0 4px 0; color:#000; text-transform: none; }
.sidebar p { margin: 1em 16px; }
.sidebar #login-form p { margin: 1em 0; }

.sidebar ul { list-style-type: none; margin: 0 16px; padding: 0; }
.sidebar li { list-style-type: none; margin: 0; padding: 0; width: 140px; }


.sidebar li a { 
	border-bottom: 1px solid #EEEEEE;
	color: #5C75A3;
	display: block;
	font-size: 0.9em;
	padding: 2px 0 2px 0;
	text-decoration:none;
	text-transform:uppercase;
}

.sidebar li a:hover, .sidebar li.selected a { text-decoration: underline; background-color: #faf7f2; }
.sidebar li.expand a { 
	font-weight: bold; padding: 2px 0 2px 12px; 
	background: url(/images/icon_plus.gif) no-repeat -4px 50%;
}

.sidebar li ul li { width: 124px; margin:0; }

.sidebar li a img { position:relative; top:4px; }

.sidebar .expandable { visibility: hidden; display: none; }
.sidebar .toonalles { font-size: 0.9em; padding: 2px 0px 6px; }

/* KASSA */

ol.status { 
	margin: 0 0 1.5em 0; 
	border-top: 1px solid #E7D8BC; 
	border-bottom: 1px solid #E7D8BC; 
	width: 867px;  
}

ol.status li { 
 	float: left; 
	margin: 0; 
	padding: 2px 0 2px 5px; 
	width: 280px;
	list-style-type: decimal; 
	list-style-position: inside;
	background: url(/images/bg_status.gif) no-repeat 95% 50%;
	color: #dca981;
}

ol.status li.actief { color: #a88675; font-weight: bold; }
ol.status li.voltooid { background: #faf7f2 url(/common/images/famfamfam_silk_icons_v013/tick.png) no-repeat 95% 50%; }
ol.status li#last { background: none; }

/* PAGINATOR */
#paginator-wrapper { clear: both; font-size: 0.9em; margin: 0; }
#paginator-wrapper .info { float: left; padding: 1em 2em 1em 0; }
#paginator-wrapper .rpp { float: left; padding: 1em 0 0 2em; }
ul#paginator { list-style-type: none; margin: 0; padding: 0; }
ul#paginator li { color: #000; display: inline; float: left; list-style-type: none; margin: 0; padding: 1em 0.25em 0 0; }
ul#paginator li a.next {
	background: url(/images/icon_next.gif) no-repeat 100% 50%;
	margin: 0; padding: 2px 16px 2px 0;
}
ul#paginator li a.previous {
	background: url(/common/images/famfamfam_silk_icons_v013/resultset_previous.png) no-repeat 0 50%;
	margin: 0 2px 0 0; padding: 2px 2px 2px 16px;
}
ul#paginator li a:link, ul#paginator li a:visited, ul.media_list li strong a { text-decoration: none; }
ul#paginator li a:hover, ul#paginator li a:active, a.more:hover { text-decoration: underline; }

a.pdf:link, a.pdf:visited, a.pdf:hover, a.pdf:active {
	background: url(/images/icon_pdf.gif) no-repeat;
	padding: 0 0 0 20px;
}

div#product-navigatie a.pdf { float:left; color:#999; text-decoration:none; }
div#product-navigatie a.pdf:hover { color:#444; text-decoration:underline; }

.logo400 img { margin: 16px 22px; }

.kelderrestant { color: #000; background-color: #ffe57b; padding: 0 4px;  }
table#details tr td.kelderrestant { padding-left: 4px;  }
form p.info { margin:0 0 1em 213px; }

form#zoeken { margin-top: 2em }
form#zoeken .submitbutton { clear: none }
form#zoeken button { padding: 0 }
form#zoeken .medium { margin-top: 4px; width: 260px; }

.artikelnummer { color:#AAAAAA; }

.highlight { background-color: #FDEA02 }

.ui-datepicker-calendar th, .ui-datepicker-calendar td { padding: 1px; font-size: 0.8em; }


/* Wijnkaart generator */
div#wijnkaart 
{
	display:none;
	position: static; 
	top: 30%; 
	left: 30%; 
	width: 300px;
	height: 300px;
	background-color:#EEEEEE;
	border:solid 1px #000000;
}

#question-codeOrName { width: 270px; } /* overrides the width:100% from forms CSS - 270px = span-7 */