/***************************************************
Created: 01/06/2004
Last Update: 27/07/2004
Filename: main.css
Author: Greg Reed

NOTES:
Please take note of the CSS hacks that are required
for each browser to display this CSS correctly. (!)

Explorer Hack Eg.:

	#Classname {
	...normal CSS element followed by
	voice-family: "\"}\"";
	voice-family: inherit;
	...the Explorer specific CSS;
	}

Mozilla/Safari/Opera Hack Eg.:

	....normal CSS
	
	html>body #classname {
	...the opera specific css;
	}
	
	html>body #classname is a selector that is
	valid CSS code that IE6 doesn't read (!),
	so the rule of margins gets overwritten on
	Mozilla and Safari browsers.
	
	
NOTE: If you add anything or take anything away,
please leave a comment with a short description!

***************************************************/


/***************************************************
GLOBAL PAGE LAYOUT ELEMENTS
***************************************************/
body { text-align: center;
background-color: #ffffff;
/* background: url(/images/tiles.gif) #FFFFFF; */ }

/* Shadow around outer bounding box for all pages */
#Shadow {
	margin: 5px auto;
	border: 4px solid #f4f4f4;
	width: 728px;
}

/* Outer bounding box for all pages */
#Frame {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	width:726px;
	text-align:left;
	background: #ffffff;
	border:1px solid #999999; }
	
/* Header/Logo */
#Logo {
	margin: 0px 5px 0px 5px;
	padding: 0px 0px 0px 0px;
	/* text-align: center; */
	background: #FFFFFF;
	height: 100px;
	vertical-align: bottom;
	/* Explorer CSS hack */
	voice-family: "\"}\"";
	voice-family: inherit;
	height: 100px; }

/* Mozilla/Safari/Opera CSS hack - you'll see plenty of this... */
html>body #Logo { margin: 0px 5px 0px 5px; padding: 0px 0px 0px 0px; height: 100px}

/* Navigation */
#Nav {
	margin: 5px 5px 5px;
	padding: 0px;
	text-align: center;
	/*background: #efe3b9;*/
}

/* Copyright notice at the bottom */
#Copyright {
	clear:both;
	margin: 30px 5px 0px 5px;
	padding: 0px 0px 10px 0px;
	border-top:2px solid #000000;
	text-align: left;
	font-size: 9px;
	line-height: 20px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	width: 710px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 715px;
}

/* The breadcrumb navigation trail */
#Breadcrumbs {
	width: 720px;
	text-align: left;
    margin: 0px 5px 0px 5px;
	padding: 0px 0px 0px 0px;
}



/***************************************************
INTRO BOX / BRICKS or TILES??
***************************************************/
/* tiles space */
#IntroSpacer {
	margin: 0px 5px 0px 5px;
	padding: 0px;
	/* background: url(/images/bricks.gif) #FFFFFF; */
	border-top:2px solid #000000; 
	border-bottom:0px; 
	}
	
html>body #IntroSpacer { height: 0px; }



/***************************************************
MAIN BOX WRAPPER - KEEPS IT NEAT AND ALIGNED
***************************************************/
.MainBox {
	
	margin: 0px 0px 0px 0px;
	padding: 5px 0px 0px 0px;
	text-align: left;
	/* background: #FFFFFF url(/images/bricks.gif) no-repeat; */
	}

/***************************************************
SUBMENU COLOURED BOX WITH 1px BORDER
***************************************************/
/* Left submenu container */
.SubWrapper {
	margin: 5px 0px 0px 15px;
	/*border: 1px solid #350f05;*/
	border: 1px solid #dcd4bf;
	text-align: left;
	width: 200px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 200px; }
	
html>body .SubWrapper { width:200px; }

/* Left submenu container coffee board style */
.SubWrapperCB {
	/*margin: 5px 0px 0px 15px;*/
	/*padding: 5px 9px 5px 9px;*/
	border-top: 2px solid #ffffff;
	border-right: 1px solid #ffffff;
	border-bottom: 1px solid #ffffff;
	border-left: 2px solid #ffffff;
	text-align: left;
	width: 200px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 200px; }
	
html>body .SubWrapperCB { width:200px; }

.SubMenu {
	margin: 0px 0px 0px 0px;
	padding: 5px 10px 5px 10px;
	text-align: left;
	width: 200px;
	/*background: #dcd4bf url(/images/sidebar_star_normal.gif) no-repeat;*/
	background: #dcd4bf;
	border-top: 1px solid #ffffff;
	border-right: 2px solid #ffffff;
	border-bottom: 1px solid #ffffff;
	border-left: 2px solid #ffffff;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 200px; }

/* Submenu coffee board style */
.SubMenuCB {
	margin: 0px 0px 1px 0px;
	padding: 0px 0px 0px 0px;
	text-align: left;
	width: 180px;
	background: #ffffff;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 180px; }
	
html>body .SubMenuCB { width:170px; }



/***************************************************
SIDEBAR COLOURED BOX WITH 1px BORDER
***************************************************/
/* Left sidebar coloured box container */
.SidebarWrapper {
	margin: 5px 0px 0px 15px;
	border: 1px solid #dcd4bf; 
	text-align: left;
	width: 200px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 200px; }

html>body .SidebarWrapper { float: left; width:200px; }

.SidebarFrame {
	margin: 0px 0px 0px 0px;
	padding: 10px;
	text-align: left;
	width: 200px;
	background: #efe3b9;
	border:2px solid #ffffff;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 200px; }
	
html>body .SidebarFrame { width:175px; }

.SidebarFrameBrown {
	margin: 0px 0px 0px 0px;
	padding: 10px;
	text-align: left;
	width: 200px;
	/*background: #ced898; used to be green*/
	background: #b57655;
	border:2px solid #ffffff;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 200px; }
	
html>body .SidebarFrameBrown { width:175px; }

.SidebarFrameBeige {
	margin: 0px 0px 0px 0px;
	padding: 10px;
	text-align: left;
	width: 200px;
	/*(background: #efe3b9 url(/images/sidebar_star_beige.gif) no-repeat;*/
	background: #efe3b9;
	border:2px solid #ffffff;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 200px; }
	
html>body .SidebarFrameBeige { width:175px; }

.SidebarFrameOlive {
	margin: 0px 0px 0px 0px;
	padding: 10px;
	text-align: left;
	width: 200px;
	background: #cdcac2;
	border:2px solid #ffffff;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 200px; }
	
html>body .SidebarFrameOlive { width:175px; }

.SidebarFrameSuperClub {
	margin: 0px 0px 0px 0px;
	padding: 10px;
	text-align: left;
	width: 200px;
	background: #dcd4bf;
	border:2px solid #ffffff;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 200px; }
	
html>body .SidebarFrameSuperClub { width:175px; }


/***************************************************
3-COLUMN BOX - AS USED ON 'OUR MENU' PAGE
***************************************************/
/* 3-Column container */
.ThreeColBox {
	width: 710px;
	margin: 5px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	text-align: left;
	width: 710px; }

/* 2 full menu columns */	
.ThreeColTextFloat {
	display: block;
	float: left;
	margin: 0px 0px 0px 0px;
	padding: 0px 10px 10px 20px;
	/*border-left: 1px dotted #ccc;*/
	/*background-color: #ffffe5;*/
	width: 235px;
	/*height: 480px;*/
	overflow:hidden;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 235px; }
	
html>body .ThreeColTextFloat { width:200px; height:500px }
	
/* 3 full menu columns */	
.ThreeColTextLeftFloat {
	float: left;
	text-align: left;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 10px;
	width: 200px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 200px; }

html>body .ThreeColTextLeftFloat { width:200px; }

.ThreeColLeft {
	float:left;
	clear:both;
	width:225px;
	margin: 0px 0px 0px 0px;
	padding: 0px 10px 10px 25px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width:230px;
	/*background-color: #ffffe5;*/ }
	
html>body .ThreeColLeft {  width:210px; padding: 0px 10px 10px 30px; clear:right; float:left; }
	
.ThreeColRight {
	float:right;
	clear:both;
	width:230px;
	margin: 0px 0px 0px 0px;
	padding: 0px 20px 10px 10px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width:230px;
	/*background-color: #ffffe5;*/ }
	
html>body .ThreeColRight {  width:210px; padding: 0px 15px 10px 10px; clear:right; float:right; }
	
.ThreeColMiddle  {
	margin: 0px 0px 0px 0px;
	padding: 0px 10px 10px 35px;
	width:230px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width:230px;
	/*background-color: #ffffe5;*/ }
	
html>body .ThreeColMiddle {  width:210px; padding: 0px 10px 10px 15px; clear:none; float:left; }
	



/***************************************************
2-COLUMN BOX - with left and right alternatives
***************************************************/
/* 2-Column container */
.TwoColBox {
	margin: 20px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	text-align: left;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc; }
	
html>body .TwoColBox { height: auto; }

/* Left side text */
/******************/
.TwoColLeftText {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 20px 20px;
	width: 461px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 461px;
	height: 400px; }
	
html>body .TwoColLeftText { width:441px; }

/* Right side text */
/******************/
.TwoColRightText {
	float: right;
	margin: 6px 0px 0px 0px;
	padding: 0px 20px 0px 10px;
	/*border-left: 1px dotted #ccc;*/
	width: 480px;
	min-height: height: 400px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 480px; }
	
html>body .TwoColRightText { width:465px; padding: 0px 17px 20px 0px;}

/* Right side SIDEBAR PANEL */
.TwoColRightSidebar {
	float: right;
	margin: 0px 0px 20px 0px;
	padding: 0px 20px 0px 20px;
	border-left: 1px dotted #ccc;
	width: 240px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 240px; }

html>body .TwoColRightSidebar { width:200px; }

/* Left side SIDEBAR PANEL */
.TwoColLeftSidebar {
	float: left;
	/*position: absolute;*/
	/*top: 175px;*/
	margin: 0px 0px 0px 5px;
	padding: 0px 0px 0px 0px;
	width: 224px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 224px; }

html>body .TwoColLeftSidebar { width:200px; }


/***************************************************
MULTIMAP INTEGRATION
***************************************************/
/* Right side map */
/******************/
.MultiMapRight {
	float: right;
	margin: 0px 5px 0px 10px;
	padding: 0px 10px 0px 0px;
	width: 461px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 475px; }
	
html>body .MultiMapRight { width:471px; padding: 0px 10px 0px 10px;}


/***************************************************
FRONT PAGE ONLY - 2-COLUMN BOX CONTAINER
***************************************************/
.FrontColBox {
	margin: 0px 0px 0px 0px;
	padding: 20px 0px 0px 20px;
	text-align: left;
	height: 320px; }

.FrontTextFixed {
	float: none;
	margin: 0px 0px 0px 0px;
	padding: 0px 20px 0px 20px;
	width: 460px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 460px; }

html>body .FrontTextFixed { width:440px; }

.FrontRightFloat {
	float: right;
	margin: 0px 0px 0px 0px;
	padding: 0px 20px 0px 20px;
	border-left: 1px dotted #ccc;
	width: 460px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 460px; }
	
html>body .FrontRightFloat { width:440px; }
	
.FrontLeftFloat {
	float: left;
	margin: 0px 0px 0px 0px;
	padding: 0px 20px 0px 0px;
	width: 200px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 200px; }

html>body .FrontLeftFloat { width:200px; }


/***************************************************
MISC
***************************************************/
/* Mozilla Min-height hack */
.Clear {
	clear: both;
	font-size: 2px; }
	
.HeightFix300 {
	clear: both;
	height:300px; }
	
.HeightFix200 {
	clear: both;
	height:200px; }

.HeightFix100 {
	clear: both;
	height:100px; }
	
.Spacer {
	height:5x; }
	
html>body .Clear { clear: both; font-size: 2px; }

.ClearRight { clear: right; font-size:1px; }
.ClearLeft { clear: left; font-size:14px; }


/***************************************************
TABLES
***************************************************/

TABLE   {
	font-size: 11px;
    color: #56441c;
	padding: 0px 10px 5px 0px; }
	
TR		{ 
	font-size: 11px;
    color: #56441c; }


/***************************************************
FORMS
***************************************************/
.fieldset {
	font-size: 11px;
    color: #56441c;
	width:460px;
	padding:15px;
	border: none;
	/*background: #dcd4bf url(/images/form_normal.gif) no-repeat;*/
	background: #ffffe5; }
	
html>body .fieldset { width:420px; }
	
.fieldset label {
	text-align:right;
	width:160px;
	float:left;
	margin-top:6px; }
	
html>body .label { width:90px; }
	
.fieldset legend {
	font-size: 12px;
	font-weight: bold;
    color: #840017;
	margin-bottom: 10px; }
	
html>body .legend { width:110px; }

.fieldset .nobr {display:none; } 

.fieldset .error {
	font-size: 9px;
	color: #840017;
	margin-left: 168px;
	width:255px;
	vertical-align: top;
}

html>body .fieldset .error { margin-left: 163px; width:250px; }	

.fieldset .info {
	font-size: 9px;
    color: b57655;
	width:255px;
	margin-left: 168px;
	vertical-align: top;}
	
html>body .fieldset .info { margin-left: 163px; width:250px;}

.fieldset .form_input {
	font-size: 11px;
    color: #56441c;
	margin:3px;
	height:20px;
	width:250px; }
	
html>body .fieldset .form_input { height:20px; width:240px; margin:3px; }	

.fieldset SELECT {
	font-size: 10px;
    color: #56441c;
	margin:3px;
	height:20px;
	width:250px;}

html>body .fieldset SELECT { height:20px; width:240px; margin:3px; }	
	
.fieldset .form_text {	
	font-size: 11px;
    color: #56441c;
	margin:3px;
	height:120px;
	width:250px; }

html>body .fieldset .form_text { height:120px; width:240px; margin:3px; }
	
.buttons {
	text-align: right;
	color: #56441c;
	padding-top: 20px;
	padding-right: 10px;
}


/***************************************************
FORM ELEMENTS
***************************************************/

.formtext {
	font-size: 11px;
	font-weight: normal;
	color: #000;
	white-space: nowrap;
}
	
.error {
	font-size: 9px;
	font-weight: normal;
	color: #dd0000; }

SELECT, INPUT, TEXTAREA {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #56441c;
	vertical-align: text-bottom;
}

form { display: inline; }