/* Mainly Malts CSS */

/* Reset browsers default margin, padding and font sizes */
* {
	margin: 0;
	padding: 0;
}

html {
	font-size: 100%;
	/* Always show a scrollbar for short pages - stops the jump when the scrollbar appears. non-IE browsers */
	height: 100%;
	margin-bottom: 1px;
}

body {
	font-family: "Times New Roman", Times, serif;
	color: #000000;
	background-color: #20281B;
	font-size: 14px;
	line-height: 16px;
}

/* The main wrapper */
#wpr {
	position: relative;
	width: 980px;
	margin: 0 auto;
	border: 0;
	background: top right url("../images-design/wine-and-whisky-wpr.jpg") repeat-y #FFFFCC; /*  malt-whisky-wpr.jpg*/
}

#content {
	position: relative;	
	width: 656px;
	height: 570px;	/* IE takes this as the height and then incorrectly re-sizes if required */
	text-align: left;
	margin: 0 0 10px 172px; /* margin at bottom is distance between end of content and footer */
	border: 0;
	padding: 147px 0 0 0; /* padding top set rather than margin-top for Firefox. Old padding-top  = 202 */
	text-align: left;
}
/* Standards compliant browsers recognise this height setting */
html>body div#content {
  height: auto;
  min-height: 570px;
}

/* Add right padding and a bit of space between points in lists within the content area */
div#content ol, div#content ul {padding: 10px 20px 4px 50px;}
div#content li {margin-bottom: 0.5em;}

#content ul ul, #content ul ul ul, #content ul ul ul ul {margin-top: 8px;} /* Add space before lists for each sub-menu level - used by site map */

p {
	font-size: 14px; 
	line-height: 16px;
	border: 0;
	padding: 10px 20px 4px 20px;
}

/* Standard headings */

h1, h2, h3, .h1, .h2, .h3 {
	font-weight: bold;
	margin: 0;
	border: 0;
	padding: 14px 10px 0 20px;
}

#content h1, #content h2, #content h3, #content .h1, #content .h2, #content .h3 {clear: both}

h1, .h1 {
	color: #663300;
	font-size: 30px;
	line-height: 33px;
}

h2, .h2 {
	color: #330E05;
	font-size: 20px;
	line-height: 23px;
}

h3, .h3 {
	color: #006600;
	font-size: 17px;
	line-height: 19px;
}

/* Additional styles for content */
.centrealign {text-align: center;}
.rightalign {text-align: right;}
.nobold {font-weight: normal;}

hr {
	color: #FFF2CF;
	background-color: #FFF2CF;
	height: 1px;
	margin: 10px 20px 10px 20px; /* Margin left/right is as for p padding */
}

/* Image styles */
img.right, img.right-no-border {
	float: right;
	margin: 5px 0 3px 10px;
	border: 1px solid #000000;
	padding: 0;
}

img.left, img.left-no-border {
	float: left;
	margin: 5px 10px 3px 0;
	border: 1px solid #000000;
	padding: 0;
}
img.right-no-border, img.left-no-border, img.nb {border: 0;} /* No border option */

img.space-for-list {margin-right: 20px;} /* Optional class to push li bullets off edge of a left-aligned img */

/* Class to hide elements so they can be pre-loaded */
.hdn {display: none;}

/* Basic links */
a {
	color: #556C44;
	text-decoration: underline;
    font-weight: bold;
}
a:hover {color: #D24701;}
a.no-line {text-decoration: none; font-weight: normal;}

a img {border: 0;}

dfn { /*  A definition term */
	text-align: left;
	font-size: 14px; 
	line-height: 16px;
	font-weight: bold;
	font-style: normal;
}
dfn:hover {cursor: pointer;}

/* Header */
#hd {
	position: absolute;
	width: 980px;
	height: 147px; /* 165px */
	top: 0;
	left: 0;
	background: 0 0 url("../images-design/wine-and-whisky-hd.jpg") no-repeat; /*  wine-and-whisky-hd.jpg whisky-malts-hd.jpg */
}
#hd-txt { /* Text within #hd */
	position: absolute;
	left: 10px;
	top: 117px; /* 135px */
	height: 20px;
	color: #FFFFCC;
	font-size: 16px;
	line-height: 16px;
}
#hd-logo {
	position: absolute;
	left: 565px;
	top: 147px; /* 165px */
	width: 260px;
	height: 57px;
	background: 0 0 url("../images-design/mainly-malts-logo.gif") no-repeat;
}

/* Left hand bar */
div#lhb {
	position: absolute;
	left: 3px;
	top: 149px; /* 174px */
	width: 160px;
	height: 420px; /* For IE */
}
html>body div#lhb {
  height: auto; 
  min-height: 420px;
}

/* Left hand menu - within #lhb */
div#nav {
	position: relative;
	left: 0;
	top: 0;
	width: 160px;
	height: 27px; /* For IE */
	z-index: 500; /* Required in IE to make pop-out appear over footer, in Mozilla the z-index set on '#nav ul' is sufficient */
	border: 1px solid #330E05;
	border-bottom: none; /* Stops double border at bottom of nav due to the last "ul a" which will also have a bottom border */
	background-color: #556C44;
}
html>body div#nav {
  height: auto; 
  min-height: 27px;
}

/* Remove list bullets */
#nav li {
	position: relative; /* Fix position of menu list */
	list-style-type: none;
	margin: 0 0 3px 0; /* Bottom margin is gap below each item. Removed below for sub-menus to fix IE and Opera hover bug */
	margin: 0;
}

/* Remove sub-list indents */
#nav ul {
	margin: 0; border: 0; padding: 0;
	width: 160px;	/* Set width of all menu levels. To specifiy a different width at lower levels define for ul ul, ul ul ul, etc */
	z-index: 500;
}

/* Fix position of sub-menus */
#nav ul ul {
	position: absolute;
	top: 0;
	left: 100%;
	width: 200px;
}

/* Hide sub menus by default */
#nav ul ul,
#nav ul ul ul {display: none;}
#nav ul li:hover ul ul,
#nav ul li:hover ul ul ul {display: none;}

/* Show submenus on rollover */
#nav ul li:hover ul,
#nav ul ul li:hover ul,
#nav ul ul ul li:hover ul {display: block;}

/* Menu colour & display settings */
#nav ul a:hover, #nav ul a:active {
	color: #556C44;
	background: 0 0 url("../images-design/nav-top-bg-hvr.jpg") repeat-y #FFFFCC;
}

#nav ul a { /* Note ul a:visited is not styled here to be the same as 'ul a' because a Firefox bug then prevents a:hover from working */
	display: block;
	color : #FFFFCC;
	font-size: 14px;
	line-height: 16px;
	text-decoration: none;
	font-weight: bold;
	border-bottom: 1px solid #330E05;
	padding: 4px 1px 5px 10px;
}

/* Opacity settings */
#nav ul ul li {
	/* filter: alpha(opacity=95);  - Cannot set opcacity in IE, the opacity works but it breaks the pop-out functionality! For IE, 0 to 100 */
	opacity: 0.95;              /* CSS3 standard (not yet supported), 0 to 1 */
	-moz-opacity: 0.95;         /* for Mozilla, 0 to 1 */
} 
/* Remove opacity on hover */
#nav ul ul li:hover {
	/*filter: alpha(opacity=100);*/
	opacity: 1;
	-moz-opacity: 1;
}

/* Set sub-menu display properties default */
#nav ul ul a {
	display: block;
	color: #FFF7DF;
    background-color: #9F8127;
	margin: 0; border: 0;
	padding: 5px 1px 5px 5px;
}
	
/* Set sub-menu 1 font colour on hover */
#nav ul ul a:hover, #nav ul ul a:active {
	color: #FFFFFF;
	background-color: #7F671F;
	background-image: none;
}

/* Set sub-menu 2 font colour default */
#nav ul ul ul a {
	color: #FEF2A0;
    background-color: #9A6601;
}

/* Set sub-menu 2 font colour on hover */
#nav ul ul ul a:hover, #nav ul ul ul a:active {
	color: #FFFFFF;
	background-color: #5F3E00;
}

/* Set sub-menu 3 */
#nav ul ul ul ul a {
	color: #DFFFE3;
	background-color: #406F0D;
}

/* Set sub-menu 3 on hover */
#nav ul ul ul ul a:hover, #nav ul ul ul ul a:active {
	color: #FFFFFF;
	background-color: #2E4F0A;
}

/* Highlight home page */
#nav ul li#mn1 a {background: 0 0 url("../images-design/nav-top-bg-hvr.jpg") repeat-y; color: #556C44;}
/* Start: remove home page highlight from sub-menu items - would not need to reset child settings if the highlight was applied to a class of a eg a.selected */
#nav ul li#mn1 ul a {
	background-image: none;
	color: #FFF7DF;
    background-color: #9F8127;
}
#nav ul li#mn1 ul a:hover {
	color: #FFFFFF;
	background-color: #7F671F;
	background-image: none;
}
#nav ul li#mn1 ul ul a {
	color: #FEF2A0;
    background-color: #9A6601;
}
#nav ul li#mn1 ul ul a:hover, #nav ul li#mn1 ul ul a:active {
	color: #FFFFFF;
	background-color: #5F3E00;
}
#nav ul li#mn1 ul ul ul a {
	color: #DFFFE3;
	background-color: #406F0D;
}
#nav ul li#mn1 ul ul ul a:hover, #nav ul li#mn1 ul ul ul a:active {
	color: #FFFFFF;
	background-color: #2E4F0A;
}

#nav ul li#mn1 ul li {
	opacity: 0.95;
	-moz-opacity: 0.95;
}
#nav ul li#mn1 ul li:hover {
	opacity: 1;
	-moz-opacity: 1;
}
/* End: remove home page highlight from sub-menu items */


/* Bottom margin removed for sub-menus and replaced with bottom border as IE and Opera don't honor hover over the bottom margin gap */
#nav li li {margin: 0;}
#nav ul ul a {border-bottom: 1px solid #6F5A1B;}
#nav ul ul ul a {border-bottom: 1px solid #8F5E00;}
#nav ul ul ul ul a {border-bottom: 1px solid #375F0C;}

/* Text in left hand bar */
#lhb p {
	font-size: 15px; 
	line-height: 17px;
	padding: 10px 0px 0px 5px;
	color: #000000;
}

/* Search in left hand bar */
div#lhb h3 {
	margin:0; border: 0; padding: 0;
	font-size: 14px;
	line-height: 20px;
	color: #4F0028;
	font-weight: bold;
}
div#lhb p.find-whisky input#find-whisky-txt {width: 118px;}
div#lhb p.find-whisky input.find-whisky-btn {width: 37px;}
div#lhb p.find-whisky {margin: 0; padding: 0;}

/* Shop sign in left hand bar */
img#wine-shop-sign {
	position: relative;
	margin: 10px 0 0 0;
	border: 0;
	padding: 0;
	width: 162px;
	height: 131px;
}

/* Footer */
#ft {
	position: relative;
	left: 0px;
	clear: both;
	height: 100px; /* height: 87px; */
	margin: 0px;
    border: 0px;
	padding: 0px;
	font-size: 0.8em;
    background: 0 0 url("../images-design/best-malt-whisky-ft.jpg") #556C44 repeat-x;
}

#ft #ft-bdr { /* Footer top border */
	margin: 0; border: 0; padding: 0;
	width: 100%; height: 8px;
	background-color: #7D9E65;
	font-size: 8px; line-height: 8px; /* IE fix */
}

#ft a:link, #ft a:hover, #ft a:visited, #ft a:active {color: #FFFFCC;}

#ft p {
	margin: 10px 0px;
	padding: 0px;
	color: #FFFFCC;
	text-align: center;
}

/* Document footer links */
#ft-lnks {
	position: relative;
	height: 40px;
	width: 900px;
	margin: 0 auto; border: 0; padding: 0;
}
span.ft-col {
	float: left;
	text-align: center;
	margin: 0px 90px 0px 0px;
	width: 150px;
}
span.ft-col-last {margin: 0;}

#ft h6 {
	margin: 0px;
	font-family: 'Trebuchet MS', sans-serif;
	font-size: 11px;
	line-height: 14px;
}

/* CSS to replace tables - used for web enquiry forms */

/* The div with class tbl-out centres correctly in standards compliant browsers (as left and right margin set to auto). IE doesn't recognise auto. Div (centrefix) fixes this as IE incorrectly centres an element with text-align:center; */
.centrefix {
	text-align: center; /* IE centre fix */
	margin: 25px 0; /* space top and bottom; */
} 

/* Width and margin set on a containing table wrapper (tbl-out) and not inner table div (tbl-in) to fix the IE width bug */
.tbl-out {
	width: 520px; 
	margin: 0 auto;
	border: 0;
	padding: 0;
	text-align: left;
	/*background: 0 0 url(../images-design/webform-bg.jpg) repeat-y #CCCCCC;*/
	background-color: #F7F4BD;
}

.tbl-in {
	margin: 0;
	border: 1px solid #DFDB99;
	padding: 5px;
}

div.row {
  clear: both;
  margin: 0;
  border: 0;
  padding: 0;
}
/* Standards compliant browsers don't add their own spacing so need top padding */
html>body div.row {padding: 2px 0 0 0;}

div.half-space, div.third-space {
  clear: both;
  height: 6px;
  line-height: 6px;
  margin: 0; border: 0; padding: 0;
}

div.third-space {height: 4px; line-height: 4px;}

div.row label {
  float: left;
  width: 190px;
  text-align: right;
}

/* Class fld (field) defines data input fields */
div.row span.fld {
  float: right;
  width: 285px;
  text-align: left;
  margin-right: 2px;	/* Required to stop right side touching the fieldset border in IE */
}


/* Left align labels in the field area - used for labels that contain check boxes */
span.fld label {text-align: left;}

/* Classes to define 2 field columns (left and right) */
div.row span.fld-coll {
  float: left;
  width: 170px;
  text-align: left;
}
div.row span.fld-colr {
  float: right;
  width: 190px;
  text-align: left;
}

div.row span.fld-full-width {
  float: left;
  width: 484px;
  text-align: left;
  margin: 0;
}

/* The spacer is user to ensure the table-div clears the last field. Note not required if fields are enclosed in a fieldset tag */
div.spacer {
  clear: both;
}

/* Class full (full width) ensures fields fill their containing element */
.full {width: 100%;}

.bld {font-weight: bold;}  /* Set bold text in selects */

fieldset {
	border:1px solid #818F47;
	padding: 0 8px 10px 5px;	/* Can't add padding to top as IE incorrectly puts this outside the fieldset so have added a bottom margin on the legend */
}

legend {
	border:1px solid #818F47;
	padding: 2px 5px;
	margin: 0 0 10px 0;
	font-weight: bold;
	color: #663300;
	background-color: #FFFAAF;
}

form {border: 0; margin: 0; padding: 0;}	/* Stops IE adding space around a form */

/* Style for the input boxes */
input, select, textarea {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 14px;
	color: #222222;
	margin: 0; padding: 0;
}

/* Buttons */
input.btn {
	font-size: 12px;
	line-height: 16px; /* Required to vertically centre text in button in IE */
	width: 120px;
}

/* Search this web site */
div#src { /* Search box in content area */
	width: 408px;
	margin: 15px 0 10px 20px;
	border: 1px solid #FFEDAF;
	padding: 5px;
	background-color: #CFBA74;
}

div#src input.srctxt {
	width: 365px;
	margin: 0 0 0 2px;
}

div#src input#srcbtn {margin-left: 2px; width: 35px;}
div#src input#srcbtn:hover {font-weight: bold;}