/*
(c) Ditton Wine Traders 2008
Developed by Mark Ilff, Talespinner - www.talespinner.co.uk
******************************************************************************/


/*Globals
******************************************************************************/
body
	{
	margin: 0;
	padding: 0;
	background: white;
	color: #2e2722;
	font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
	font-size: 0.80em;
	line-height: 1.5em;
	}

input, 
textarea, 
select 
	{
	font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
	font-size: 0.9em;
	padding: 2px 1px
	}

img {
	border: 0
	}

a {
	color: #3d007a;
	text-decoration: none;
	border-bottom: 2px dotted #e5cbff;
	}

a:hover {
	border-bottom-style: solid;
	border-bottom-color: #9274b1;
	}

ul {
	list-style-type: none;
	padding: 0;
	margin: 1em;
	}

ul li {
	background:  url(/images/widgets/bulletGlass.gif) no-repeat;
	background-position: 0 0.5em;	
	list-style-position: outside;
	line-height: 2.0em;
	padding-left: 1.5em;
	}

.cn {
	font-family: SimSun, "Trebuchet MS", Verdana, Arial, sans-serif;
	}


/*Named objects - pages
******************************************************************************/
#mailForm {
	width: 450px;
	}

#mailForm fieldset {
	padding: 5px;
/*	width: 450px;*/
	margin-left: 0;
	margin-bottom: 30px;
	border: 1px solid #b19274;
	}

#mailForm legend {
	font-size: 1.6em;
	font-family: Arial, Helvetica, sans-serif;
	color: #b19274;
	text-transform: lowercase;
	}

#mailForm label, 
#mailForm input, 
#mailForm textarea, 
#mailForm select 
	{
	display: block;
	width: 250px;
	float: left;
	margin-bottom: 10px;
	}

#mailForm label {
	text-align: right;
	width: 150px;
	padding-right: 20px;
	clear: left;
	}

#mailForm input, 
#mailForm textarea, 
#mailForm select 
	{
/*	font-family: Arial, Helvetica, sans-serif;*/
	letter-spacing: 0;
	background-color: #faf5e6;
/*	border-width: 1px;*/
	}

#mailForm textarea {
	height: 6em;
	}

#mailForm .cue {
	clear: both;
	font-size: 0.8em;
	margin-left: 170px; 
	text-align: left; 
	line-height: 1em;
	color: #b19274;
	}
	


#wineTable {
	width: 100%;
	padding: 2px;
	margin-bottom: 2ex;
/*			letter-spacing: 0.05em;*/
	}

#wineTable td {
	text-align: center;
	}

#wineTable td.par span {
	padding: 0 0.2em; background-color: #f0f0f0;
	}

#wineTable tr.zebra td.par span {
	background-color: #f5ebcd
	}

#wineTable td.win {
	text-align: left;
	}

#wineTable td.left {
/*			text-align: left;*/
	}

#wineTable th {
	text-align: center;
	vertical-align: bottom;
	padding-bottom: 1ex;
	font-size: 105%
	}

#wineTable h3 {
	margin: 0.3ex 0 0.6ex 0;
	font-family: Arial, Helvetica, sans-serif;
	color: white;
	font-size: 4em;
	font-weight: normal;
	text-transform: lowercase;
	}

	
#dutyTable {
	width: 100%;
	margin-bottom: 4ex;
	}	

#dutyTable td.colL {
	padding-left: 1em;
	}

#customerTable {
	width: 100%;
	padding: 2px;
	margin-bottom: 2ex;
	font-size: 0.9em;
/*			letter-spacing: 0.05em;*/
	}

#customerTable td {
	text-align: left;
	vertical-align: top;
	}

#customerTable td.id,
#customerTable td.com
	{
	text-align: center;
	}

#customerTable td.left {
/*			text-align: left;*/
	}

#customerTable th {
	text-align: center;
	vertical-align: bottom;
	padding-bottom: 1ex;
	font-size: 105%
	}

/* Terms box on wine list pages */
#toc {
	background: #e6d5f7; 
	border: 1px solid #9274b1;
	}
#toc li {
	padding-top: 0.2em;
	text-align: left;
	line-height: 1.7em;
	}
#toc a {
	border-color: #9274b1;
	}

#wineSearch,
#wineSearchClear
	{
	margin-left: 5px;
	width: 200px;
	}


#wineSearch fieldset {
	padding: 5px;
	width: 185px;
	margin: 0;
	margin-bottom: 10px;
	border: 1px solid #b19274;
	}

#wineSearch fieldset fieldset {
	/*2nd level fieldsets*/
	width: 170px;
	}

#wineSearch legend {
	font-size: 1.4em;
	font-family: Arial, Helvetica, sans-serif;
	color: #b19274;
	text-transform: lowercase;
	letter-spacing: 0;
	}

#wineSearch fieldset fieldset legend {
	/*2nd level fieldsets*/
	font-size: 1.1em;
	}

#wineSearch label, 
#wineSearch input, 
#wineSearch textarea, 
#wineSearch select 
	{
	display: block;
	vertical-align: middle;
	width: 80px;
	float: left;
	margin-bottom: 10px;
	}

#wineSearch label {
	line-height: 1em;
	font-size: 0.85em;
	text-align: right;
	width: 60px;
	padding-right: 10px;
	clear: left;
	padding-bottom: 10px;
	margin-bottom: -10px;
	}

#wineSearch input, 
#wineSearch textarea, 
#wineSearch select 
	{
	}

#wineSearch textarea {
	height: 100px;
	}

#wineSearch a {border-bottom-width: 1px}
#wineSearch label.check {width: 150px; font-size: 0.95em; text-align: left}
#wineSearch label.check input {width: 20px; margin: 0 10px 0 40px}

#wineMaint {
	margin-left: 5px;
	line-height: 1em;
/*	width: 200px;*/
	}

#wineMaint th {
	text-align: right;
	padding-right: 20px;
	}



#wineMaint fieldset {
/*	padding: 5px;
	width: 300px;
	margin: 0;
	margin-bottom: 10px;
	border: 1px solid #b19274;*/
	}

#wineMaint fieldset fieldset {
	/*2nd level fieldsets*/
/*	width: 170px;*/
	}

#wineMaint legend {
/*	font-size: 1.4em;
	font-family: Arial, Helvetica, sans-serif;
	color: #b19274;
	text-transform: lowercase;
	letter-spacing: 0;*/
	}

#wineMaint fieldset fieldset legend {
	/*2nd level fieldsets
	font-size: 1.1em;*/
	}

#wineMaint label, 
#wineMaint input, 
#wineMaint textarea, 
#wineMaint select 
	{
/*	display: block;*/
	vertical-align: middle;
/*	width: 80px;
	float: left;*/
	margin: 5px 0;
	}

#wineMaint label {
/*	line-height: 1em;
	font-size: 0.85em;
	text-align: right;
	width: 60px;
	padding-right: 10px;
	clear: left;
	padding-bottom: 10px;
	margin-bottom: -10px;*/
	}

#wineMaint input, 
#wineMaint textarea, 
#wineMaint select 
	{
	width: 250px;
/*	margin-right: 20px;*/
	}

#wineMaint textarea {
/*	height: 100px;*/
	}

#wineTable #resultCue {
	padding: 5px;
	border: solid #b19274; border-width: 1px 0;
	font-size: 110%;
	font-style: italic;
	text-align: left;
	}
	

/*Other
******************************************************************************/
div.boxL, div.boxS {
	width: 200px;
	float: left;
	margin: 4ex 0 4ex 5px;
	background: url(/images/widgets/rounded3-200.gif) bottom no-repeat;
	}

.boxL h2, .boxS h2 {
	font-size: 16px;
	text-transform: lowercase;
	background-color: #3d007a;
	margin: 0;
	padding: 0;
	padding-left: 1em;
	color: white;
	font-style: normal;
	}

div.boxS {font-size: 0.85em/*; margin: 0 0 1ex 5px*/}
.boxS h2 {font-size: 1em}
.boxS li {background-image: url(/images/widgets/bulletGlassSm.gif); font-size: 1em}

.boxL p {
	margin: 1em;
	}


div.boxP {
	width: 240px;
	float: left;
	margin: 0 10px 10px 0;
	background: url(/images/boxW240P.png) bottom no-repeat;
	}

.boxP h2 {
	font-size: 20px;
	background: #e5cbff;
/*	background: url(../images/roundLightTopBand.png) top no-repeat white;*/
	margin: 0;
	padding: 0;
	padding-left: 20px;
	color: #3d007a;
	font-style: normal;
	}

.boxP p {
	margin: 1em;
	}

tr.zebra,
tr.zebra td,
.bgWheatPale
	{
	background: #faf5e6;
	}

.wheat {
	color: #b19274;
	}

.txtPurple,
strong
	{
	color: #3d007a;
	}

.lh1 {line-height: 1}

.dataError {
	background-color: #ffffc0;
	font-weight: bold;
	color: #cd2748
	}

.mand {
	border: 1px solid black
	}

.pullQ30D {
	/*Pullquote-style box - 30% width, white on dark purple, right float*/
	width: 30%; 
	float: right; 
	padding: 1ex 1em; 
	margin: 0 0 1ex 1em;
	text-align: right;
	font-size: 0.85em;
	color: white;
	font-style: italic; 
	background: #9274b1;
	}


.bgExcel {
	background: url(/images/widgets/logoExcel.gif) center no-repeat;
	}

.bgPDF {
	background: url(/images/widgets/logoPDF.gif) center no-repeat;
	}

div.scroll100 {
	overflow: auto; 
	max-height: 100px; 
	width: 85%; 
	border: 1px solid #e0e0e0; 
	padding: 1ex 1em; 
	margin: 0.2ex 0;
	}

.washPurple {
	background: #e5dbef;
	}

.confMsg {
	padding: 50px; 
	background-color: #faf5e6; 
	margin-bottom: 4ex
	}

/* En primeur marking */
	.win {padding: 0 0.1em}
	td.win span, #epLegend span {padding: 0 2px; background: #3d007a/*#c92d30*/; 
		font-size: 80%; font-weight: bold; color: white}
	td.win span {margin-left: 1em;}
	#wineTable #epLegend {text-align: left; padding-top: 1em}
	td.win span a, #epLegend span a {color: white; border: 0}
	
	/* CSS3 */
	td.win span, #epLegend span {
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		border-radius: 3px;
		}


/* Prop/base styles implement minimum height for div 
(IE has a poor implementation of div height)
******************************************************************************/

div.prop400, 
div.prop300, 
div.prop150 
	{
	/*Tiny div that gives the area enclosing it a minimum height 
		- first thing in container */
	float: right;
	width: 1px;
	}

div.prop400 {
	height: 400px;
	}

div.prop300 {
	height: 300px;
	}

div.prop150 {
	height: 150px;
	}

div.base {
	/*Tiny div for the prop to stand on - last thing in container */
	clear: both;
	height: 1px;
	overflow: hidden;
	}	


/*
RSS & email buttons
******************************************************************************/

/* Blog page button container */
	div.buttonsBelow {
		border-top: 1px dotted #b19274; 
		font-size: 85%; 
		padding: 0 0 2em 0
		}
	div.buttonsBelow p {
		margin: 1ex 0
		}
	div.buttonsBelow a img {
		border-bottom: 0
		}
	div.buttonsBelow p.shareIt {
		margin-top: 1.5em
		}
	
/* Button zone for feed buttons on wine list */
	div.subWrapTop {
		}
	
	div.subWrapBot {
		padding-bottom: 50px
		}
	
/* Wine page button container */
	div.wineSub {
		}

	div.wineSub p {
		float: left; 
		margin: 0; 
		font-size: 80%
		}
	
/* Hover effect buttons */
	div.rss0,
	div.rss1, 
	div.email0, 
	div.email1,
	div.share0, 
	div.share1
		{
		width: 20px;
		height: 20px;
		border: 0;
		float: left;
		margin: 3px 0.5em 0 0;
		vertical-align: middle;
		}
	
	div.rss0,
	div.rss1 
		{
		background-image: url(/images/buttons/rss20.png);
		}
	
	div.email0, 
	div.email1 
		{
		background-image: url(/images/buttons/email20.png);
		}
	
	div.share0, 
	div.share1 
		{
		background-image: url(/images/buttons/share20.png);
		}
	
	div.rss0, 
	div.email0,  
	div.share0 
		{
		background-position: 0 -20px;
		background-repeat: no-repeat;
		}
	
	div.rss1, 
	div.email1,  
	div.share1 
		{
		background-position: 0 0;
		background-repeat: no-repeat;
		}


/*
Language selected box
******************************************************************************/
	#langSelect {margin: 4ex 0; padding: 0 10px}
	#langSelect p {margin:0; font-weight: bold}
	#langSelect a {color: #b19274; border: 0}
	#langSelect a:hover {color: #3d007a}
	#langSelect img {vertical-align: middle}
	#langOn {width: 205px; height: 19px; vertical-align: middle; padding: 0.2em 0;
		background: url(/images/widgets/langOn.gif) no-repeat}



/*
Blog item layout
******************************************************************************/
div.blogBody {
	margin-bottom: 2em
	}

/*
Hide JS-only elements [include JS statement at foot of page to reverse]
******************************************************************************/
	.jsOnly {display: none}