/*

/*
	OLD Houghton Site Colours
	
	Black: #000;    -background
	White: #FFF;    -Main Menu Over, Body Text, Sub2 Over
	Grey1: #7d7d7d;	-Main Menu normal, Footer text
	Grey2: #5c5b5b;	-Sub1 normal,
	Grey3: #474749; -artistic lines
	Blue : #0096d6;	-Sub1 over, Sub2 normal,
	Blue2: #c7e0eb; -Formfield backgd,
*/

/*
	NEW Houghton Site Colours : Sep 2008
	
	Background				- White : #FFF     (was Black: #000)
	Primary Nav Off			- Grey #808080     (was Grey1: #7d7d7d)
	Primary Nav On			- Black #000       (was White: #FFF)
	Sub Navs off 			- Grey #808080     (was Grey2: #5c5b5b)
	Sub Navs On				- Blue #0081D7     (was Blue : #0096d6)
	Body Copy				- Black #000       (was White: #FFF)
	Main Section Headers	- Grey #808080     (was Grey1: #7d7d7d)
	Links					- Blue #0081D7     (was Blue : #0096d6)
	Copy Vertical Divider   - Grey #CCC edit 09/09/08 W Psaila
*/



/* ------------ Centre the Page ------------ */

/* 
	Centre page vertically has CSS issues. Consider outer tables.
	And/or Javascript to calculate browser dimensions and SET DIV/Table heights.
	"main-tables.html"
*/
/*
	CSS2 browsers honour right/left margin of 'auto' on #pageshell.
	IE5/win needs  
		text-align:center;
	which unfortunately cascades so set
		text-align:left;
	on #pageShell

	To add a top margin to body as:
	margin:50px 0px;

*/	
html, body {
	margin:0px 0px;
	padding:0px;
	text-align:center;
	background:#FFF;
}
/* Test/Cater if 'inner' content grows taller? */
/* (top:0px;) */
#pageshell {
	position: relative;
	width: 992px;
	height: 600px;
	margin: 0px auto;
	background: #FFF;
	overflow:visible;
}
/*	
	min-height: 100%;
	height: auto !important;
	height: 100%;
	vertical-align:top;
*/	

/* If using outer tables, consider rendering line by line without needing whole thing */
/*
#outershell, innershell {
	table-layout:fixed;
}
*/
#pageshellvideo {
	position: relative;
	width: 400px;
	height: 272px;
	margin: 0px auto;
	background: #FFF;
	overflow:visible;
}
#videopopuptable {
	margin-top:20px;
	_margin-left:13px;
}

/* ------------ FONTS ------------ */


/* Set default font basics throughout */

body, div, p, td {
	font-family: Helvetica, Arial, Geneva, sans-serif;
	font-size: 11px;
	line-height:15px;
	color: #000;
}

h1, h1 p, h2, h2 p {
	font-family: Helvetica, Arial, Geneva, sans-serif;
	font-size: 16px;
	line-height:20px;
	color: #7d7d7d;
	font-weight:normal;
	margin-top:4px;
	margin-bottom:0px;
}
h2 {
	color: #808080;
	font-size: 12px;
	line-height:16px;
	font-weight:bold;
}

p {
	margin-top:4px;
	margin-bottom:12px;
}
/* Safari Admin mode shows black text on white! This didn't help. */
/*
p, table {
	background: #fff;
}
*/
/*                  */
a {
	color: #0081d7;
	font-weight:bold;
	text-decoration:none;
}

a:visited { color:#0081d7; text-decoration:none }
a:link { color:#0081d7; text-decoration:none }
a:hover { color:#0081d7; text-decoration:underline }

ul {
	list-style-type: none;
	margin:0px; 
	padding:0px; 
}
/* IE prefers 15 7, FF prefers 15px 5px  */
li {
	padding:2px 2px 2px 28px;
	background:url(/custom/files/media/htbullet.gif) 15px 5px no-repeat;
	_background-position: 15px 7px;
}

/* Call to action panels */
#rightContentOurHistory, #rightContentExperience {
	float:right;
	height:auto;
	margin:0px 0px 10px;
	padding:0px;
	position:relative;
	width:232px;
}
#copyFloatLeft {
	float:left;
	margin:0px;
	padding:0px;
	width:409px;  /*  */
}


/* ------------ NEWS ------------ */

#newsonhome {
	position:absolute;
	z-index:100;
	text-align:left;
	padding-right:15px;
	padding-bottom:10px;
}
@media screen
{
#newsonhome {
	left:50px; top:510px; width:200px;
}
}

#newsonhomearchivebtn {
	position:absolute;
	z-index:110;
	text-align:left;
	top:469px; left:187px;
}
#newsonhomearchivebtn a {
	display:block;
	margin:0px; padding:0px;
	width:75px;
	height:21px;
	z-index:115px;
	text-decoration:none;
	background:url(/custom/files/media/shnewsarchive.gif) no-repeat;
}
a.homearchivebtn:hover,  a.homearchivebtn:active  {
	background:url(/custom/files/media/shnewsarchiveover.gif) no-repeat;
}



/* ------------ BODY CONTENT ------------ */

#bodycontent {
	position:absolute;
	text-align:left;
	padding-right:15px;
	padding-bottom:10px;
}
#bodycontentvideo {
	position:absolute;
	text-align:left;
	padding:10px;
}

/* Main Image */
#bodygeneral1 {
	position:relative;
	left:30px; top:0px; width:617px; 
	min-height:261px;	
}
/* p gets auto added around image */
#bodygeneral1 p, #bodycontentvideo p {
	margin: 0px;
	padding: 0px;
}

#bodygeneral1 img, #bodycontentvideo img {
	margin:0px;
	border:none;
	padding:0px;
}

/* Main Body Text & Title */
#bodygeneral2 {
	position:relative;
	left:30px; top:0px; width:480px;
	padding-top:32px;
}
#bodygeneral2.winedetail {
	padding-top:25px;
}

/* Main Text Form */
#bodygeneral3 {
	position:relative;
	left:30px; top:0px; width:480px;	
}

#contentminheight {
	position:relative;
	min-height:481px;
	_height:481px;
}



/* ---------- Variation - Taller templates ---------- */
/* ---------- and News & Events ---------- */

#bodygeneral2taller {
	position:relative;
	left:30px; top:0px; width:617px;
	padding-top:25px;
}

#bodynewsimagetop,
#bodygeneral1taller {
	position:relative;
	left:30px; top:0px; width:617px; 
	min-height:1px;	
}
/* p gets auto added around image */
#bodynewsimagetop p,
#bodygeneral1taller p {
	margin: 0px;
	padding: 0px;
}
#bodynewsimagetop img,
#bodygeneral1taller img {
	margin:0px;
	border:none;
	padding:0px;
}



#bodykeyeventsright {
	float:right;
	position:relative;
	width:180px;
	padding:25px 5px 0px 0px;
	text-align:left;
	z-index:200;
}
/* p gets auto added around image */
#bodykeyeventsright p {
	margin: 0px;
	padding: 0px;
}
#bodykeyeventsright img {
	margin:5px 0px;
	border:none;
	padding:0px;
}
#bodykeyeventsright .calendarlink {
	margin-top:5px;
}

#bodynewsmain {
	position:relative;
	left:30px; top:0px; width:420px;
	padding-top:25px;
}

/* 
	min-height:302;
	_height:327;
*/


#clearfloats {
	clear: both;
	width: 100%;
	height: 0;
	line-height: 0;
	font-size: 0;
	padding: 0;
	margin: 0;
	border: 0;
}


/*-----*/



/* p gets auto added around image */
#winedetailnavdiv {
	position:relative;
	left:30px; top:0px; width:617px; 
	min-height:120px;
	margin:0px;
	border:none;
	padding:0px;
}
#winedetailnavdiv p {
	margin: 0px;
	padding: 0px;
}


@media screen
{
/* Common to all pages */
#bodycontent {
	left:313px; top:59px; width:678px;
	border-left: /*#474749*/ #CCC 1px solid;
}


/* Set special background images via classes here: */
#extrabackground {
	position:absolute;
	left:0px; top:0px;
}
/*
#extrabackground.jackmann {
	height:59px;
	width:700px;
	z-index:10;
	background:url(/custom/files/media/htjackmannspeech.gif) 481px 37px no-repeat;
}
*/
#pageshell.jackmann {
	background:url(/custom/files/media/htjackmannwatermark.gif) 577px 418px no-repeat;
}
}


/* ------------ FORMS  -  BODY CONTENT  &  AGE VALIDATION COMBINED ------------ */

/* IE6 has height issues if the FORM element has no 'width' */
/* MUST set formdiv to 100% of container width or get content crammed on right */ 
#formdiv {
	width:100%;
}
#formid, form {
}

/* Labels */
/* SH was Tahoma, Arial, Verdana, Geneva, Helvetica, sans-serif */
#formid  {
	font-family: Helvetica, Arial, Geneva, sans-serif;
	font-size: 11px;
	line-height:15px;
	color: #be9e55; /* ??? */
	text-decoration: none;
	text-align: left;
	margin: 0px 0px 4px 0px;
}
/*
	#c49565 - tan 
	#fff - dark grey
*/

/* Can't just target 'input' fields as it sets unwanted width & text background on Radio, Checkboxes & Images */
/* #formid select, #formid textarea = ok,      #formid input = NOT OK!  */
#formid .formfield {
	margin:0px;
	padding: 1px 2px;
	
	font-size: 12px;
	background-color:#c7e0eb !important; /* ??? */
	color: #000 !important; /* ??? */
	font-family: Helvetica, Arial, Geneva, sans-serif;
	text-decoration: none;
}
#formid .formfield {
	width:190px;
}
/* FF2 but NOT IE7 */
/*
#formid input[type=checkbox], #formid input[type=radio] {
	width:auto;
	background-color:#000;
}
*/
#formid .formbutton {
	margin:0px;	
	padding: 1px 2px;
	
	width:80px;
	background-color: #f6f4f1; /* ??? */
	color: #0d2647 !important; /* ??? */
	font-family: Helvetica, Arial, Geneva, sans-serif;
	font-size: 12px;
	text-decoration: none;
}





/* ------------ MAIN MENU - Static ------------ */

#mainmenu {
	position:absolute;
	left:0px; top:356px;
	z-index:100;
	padding:0px 0px 0px 5px;
	text-align:right;
}
/*
	width:165px;
	_width:176px;
*/
/* #mainmenu a */
#mainmenu a {
	display:block;
	font-weight:bold;
	height:15px;
	margin:0px;
	padding:4px 11px 3px 0px;
	color:#808080;
	z-index:20px;
	text-decoration:none;
	text-transform:uppercase;
	text-align:right;
	width:160px;
	_width:171px;
}
/* 	padding:4px 11px 3px 50px;  */
#mainmenu a.on, #mainmenu a:hover, #mainmenu a:active {
	color:#000;
	text-decoration:none;
}
/* wine shop link in own text repos item */
#ht-wine-shop-main-menu-link p {
	margin:0px !important;
}

#submenu {
	position:absolute;
	left:176px; top:356px;
	z-index:100;
	padding:0px 5px 0px 0px;
	text-align:left;
}
#submenu a {
	display:block;
	min-height:15px;
	margin:0px;
	z-index:20px;
	text-decoration:none;
	text-transform:uppercase;
	color:#808080;
	font-weight:normal;
	padding:4px 5px 3px 11px;
	width:121px;
	_width:137px;
}

#submenu a.on, #submenu a:hover, #submenu a:active {
	color:#0081d7;
	text-decoration:none;
}


/* ------------ 3rd Level Menu on Right - Dynamic ------------ */

/*   left:513px; top:0px;   */
/*   width 165 less 15 padding  */
#nav3navcontainer { float:right; }

#archwinenavcontainer, #archwinenavcontainer_1, #archwinenavcontainer_2, #archwinenavcontainer_3 { float:left; }

#nav3navcontainer, 
#archwinenavcontainer, #archwinenavcontainer_1, #archwinenavcontainer_2, #archwinenavcontainer_3 {
	position:relative;
	width:150px;
	padding:0px 5px 0px 0px;
	text-align:left;
}
#nav3navcontainer {
	padding-top:32px;
}
#nav3navcontainer.winedetail {
	padding-top:25px;
}

#nav3navcontainer ul,
#nav3navcontainer ul li,
#archwinenavcontainer ul,    #archwinenavcontainer_1 ul,    #archwinenavcontainer_2 ul,    #archwinenavcontainer_3 ul,
#archwinenavcontainer ul li, #archwinenavcontainer_1 ul li, #archwinenavcontainer_2 ul li, #archwinenavcontainer_3 ul li {
	margin: 0px; 
	padding: 0px !important; 
	list-style-type: none; text-transform:uppercase;
	background:none !important;
}


/* Quirk: IE counts padding in Width, FF does not. */
#nav3navcontainer a,
#nav3navcontainer ul a,
#archwinenavcontainer a,    #archwinenavcontainer_1 a,    #archwinenavcontainer_2 a,    #archwinenavcontainer_3 a,
#archwinenavcontainer ul a, #archwinenavcontainer_1 ul a, #archwinenavcontainer_2 ul a, #archwinenavcontainer_3 ul a {
	display:block;
	min-height:15px;
	margin:0px;
	z-index:20px;
	text-decoration:none;
	color:#808080; /* was 0096d6 */
	font-weight:bold;
	padding:4px 5px 3px 0px;
	width:121px;
	_width:137px;
}
#nav3navcontainer a,
#nav3navcontainer ul a {
	padding-left:11px;
}

#nav3active a,
#nav3navcontainer a:hover, 
#nav3navcontainer ul a:hover,
#archwinenavcontainer   a:hover, #archwinenavcontainer   ul a:hover,
#archwinenavcontainer_1 a:hover, #archwinenavcontainer_1 ul a:hover,
#archwinenavcontainer_2 a:hover, #archwinenavcontainer_2 ul a:hover,
#archwinenavcontainer_3 a:hover, #archwinenavcontainer_3 ul a:hover
{
	color:#0081d7 !important;
	text-decoration:none;
}






/* ----- WINE Sub Nav DIVs - Top of Houghton Wine Page ----- */

#tastingnotelinks {
	position:relative;
	top:0px;
	min-height:147px;
	_height:147px;
}
#winebottle {
	position:relative;
	top:0px;
	min-height:120px;
	_height:120px;
}

/* ----- WINE Sub Nav Links - Top of Houghton Wine Page ----- */

#navwine td {
	text-align:left;
	vertical-align:top;
	padding:2px 0px;
}
#navwine td.col1row1 {
	height:20px;
	width:110px;
}
#navwine td.col2row1, {
}

/*  IE6 needs #navwine, not just a.navbuythiswine  */
#navwine a.navbuythiswine, #navwine .navbuythiswine { 
	display:block;
	width:110px; height:25px; padding:0px; margin:0px 0px 2px 0px;
	background:url(/custom/files/media/htlineshort1.gif) 0px 16px no-repeat; 
	color:#808080; /* was #5c5b5b */
	text-decoration:none;
}
#navwine a.navbuythiswine:hover,  #navwine a.navbuythiswine:active  { 
	color:#0081d7;
	text-decoration:none;
	background:url(/custom/files/media/htlineshort1over.gif) 0px 16px no-repeat; 
}

#navwine a.navvirtualtasting,  #navwine .navvirtualtasting { 
	display:block;
	width:110px; height:25px; padding:0px; margin:0px 0px 2px 0px;
	background:url(/custom/files/media/htlineshort2.gif) 0px 18px no-repeat; 
	color:#808080; /* was #5c5b5b */
	text-decoration:none;
}
#navwine a.navvirtualtasting:hover,  #navwine a.navvirtualtasting:active  { 
	color:#0081d7;
	text-decoration:none;
	background:url(/custom/files/media/htlineshort2over.gif) 0px 18px no-repeat; 
}

#navwine span.navtastingnotes { 
	display:block;
	width:110px; height:12px; padding:0px; margin:0px 0px 2px 0px;
	color:#808080; /* was #5c5b5b */
	font-weight:bold;
	text-decoration:none;
}
#navwine a.navtastingnotes, #navwine .navtastingnotes { 
	display:block;
	width:110px; height:25px; padding:0px; margin:0px 0px 2px 0px;
	color:#808080; /* was #5c5b5b */
	text-decoration:none;
}
#navwine a.navtastingnotes:hover,  #navwine a.navtastingnotes:active  { 
	color:#0081d7;
	text-decoration:none;
}

#navwine td.navwinetnotes a { 
	margin-right:14px;
	color:#808080; /* was #5c5b5b */
	text-decoration:none;
}
#navwine td.navwinetnotes a:hover,  td.navwinetnotes a:active  { 
	color:#0081d7;
	text-decoration:none;
}

#tastingvideo {
	visibility:hidden;
}


/* ----- Image Gallery Table ----- */
#gallerytable td {
	text-align:left;
	vertical-align:top;
	width:120px;
	padding-top:10px;
	padding-right:20px;
	padding-bottom:10px;
}



/* ------------ LOGO ------------ */

#logodiv {
	position:absolute;
	left:66px; top:228px; 
	z-index:10;
	text-align:left;
	width:220;
	height:118;
}



/* ------------ FOOTER ------------ */

#footer, #footerbehind {
	position:relative;
	left:30px; top:0px;
	width:476px;
	z-index:100;
	text-align:left;
	margin:0px;
	padding:3px 0px;
}
#footer {
	z-index:100;
}
#footer p, #footerbehind p {
	margin:0px;
	padding:0px;
}
#footer a, #footerbehind a {
	font-size: 10px;
	line-height:15px;
	color: #808080; /* was #7d7d7d */
	font-weight:normal;
	text-decoration:none;
	margin:0px 12px 0px 0px;
	padding:0px;
}

#footer a:visited, #footerbehind a:visited { color:#808080; text-decoration:none } /* was #7d7d7d */
#footer a:link,    #footerbehind a:link    { color:#808080; text-decoration:none } /* was #7d7d7d */
#footer a:hover,   #footerbehind a:hover   { color:#000; text-decoration:underline } /* was #0096d6 */



/* ------------ PRINTING ------------ */

/* Remove most DIVs for a clean print & avoid FF issue of background image scaling. */

@media print
{

html { height: auto; }
body { height: auto; }

#mainmenu 	{ display: none; }
#winesubmenu { display: none; }
#logodiv 	{ display: none; }
#pagebackground { background:none !important; }

/* Logo header for IE only. FF scales it wrongly. */
/*
_background:url(/custom/files/media/shlogotoprint.gif) no-repeat 0px 0px;
_padding-top: 120px;
*/

#bodycontent {	
	padding-right:15px;
	padding-bottom:10px;
	margin: auto 5%;
	position:absolute;
	left:0px; top:0px;
	width:70%;
	text-align:left;
}

}


