body, html { margin: 0; padding: 0; background-color: #99a09c; height: 100%;}
body, html { background: #99a09c url(/assets/bkg_gradient.gif) top left repeat-x; font-family: 'trebuchet ms', helvetica, tahoma, geneva, verdana, arial, sans-serif; }
a img { border: none; }
.clear { height: 1px; clear: both; }
.tall { height: 20px; }
#wrap { margin: 0 auto; width: 772px; height: auto; }

/* Home page */
#homeMain { height: 720px; background: url(/assets/homepage_bkg.jpg) top left no-repeat; }
#homeContent { position: relative; height: 250px; background-color: transparent; }
#menuHolder { position: absolute; top: 0; right: 0; left: 78px; width: 694px; height: 220px; background: transparent url(/assets/cornerTL.gif) top left no-repeat; }
#menuTopR { position: absolute; top: 0; right: 0; height: 30px; width: 669px; background-color: #fff; }
#menuBack { position: absolute; top: 30px; left: 0; height: 220px; width: 694px; background-color: #fff; }
#textHolder { position: absolute; top: 80px; left: 35px; width: 600px; } 

/* Structure */
#contentHeader { width: 771px; height: 180px; background: url(/assets/contentpage_header.jpg) top left no-repeat; }
#menu { width: 660px; float: right; height: 60px; margin-bottom: 30px;}
#content { clear: both; margin: 0 0 0 51px; width: 720px; background: #fff; color: #727774; min-height: 450px; padding-top: 30px; border-top: 1px solid #bfaab2; border-bottom: 1px solid #fff; }
* html #content { height: 450px; }
#contentWrap { padding-left: 100px; }

#corner_frame { float: right; width: 720px; height: 25px; background: transparent url(/assets/cornerBL.gif) left bottom no-repeat; }
#corner_main { width: 690px; float: right; height: 100%; background: #fff; margin-right: 1px; }

#onward { float: right; width: 720px; height: 130px; text-align: right; margin-top: 12px;}
#onward p, #onward a { color: #775963; margin-right: 0; }
#onward a { text-decoration: none; }
#onward a:hover { text-decoration: underline; } 
#onward_1 { float: left; width: 330px; }
#onward_1 p { margin-left: 30px; }
#onward_2 { float: right; }
#onward_2 ul { list-style-type: none; margin: 0; padding: 0; }
#onward_2 ul li { float: left; margin-left: 6px; }

/* Text styles */
h1 { color: #775963; font-size: 1.7em; font-weight: normal; color: #775963; font-family: 'Trebuchet MS', trebuchet, "Times New Roman", Times, serif; border-bottom: 1px dotted #99a09c; }
h2 { color: #99a09c; }
p { margin-right: 25px; }
a { color: #0099CC; text-decoration: none; }
a:hover { color: #bfaab2; }
a:visited { color: #775963; }
#homeContent h1 { margin-bottom: 0.4em; font-size: 1.2em; border: none; }
#homeContent p { margin: 0; color: #827e70; font-size: 0.85em; } 
ul.highlightedCategories li { color: #0099CC; }
ul.highlightedCategories ul li { color: #727774; }
ul.address { list-style-type: none; }
ul.resources {list-style-type: none; }
.resources a.pdfLink { background: url(/assets/pdf.gif) left 50% no-repeat; line-height: 35px; padding-left: 30px; }
.resources a.docLink { background: url(/assets/wrd.gif) left 50% no-repeat; line-height: 35px; padding-left: 30px; }
/* Footer */
.clearFooter { clear: both; height: 120px; }
#footer { position: relative; width: 100%; height: 120px; margin-top: -120px; font-size: 0.8em;}
#footer_boundary { position: absolute; right: 0; top: 0; width: 720px; height: 20px; border: solid #bfaab2; border-width: 1px 0;}
#footerContent { position: absolute; top: 20px; left: 500px; width: 250px; height: 25px; text-align: right;  color: #fff;}
#footerContent2 { position: absolute; top: 45px; left: 500px; width: 250px; text-align: right; color: #f4edf0; }
#footerContent3 { position: absolute; top: 30px; left: 50px; width: 450px; height: 25px; color: #f4edf0; }
#footerContent2 a { color: #f4edf0; text-decoration: none; }
#footerContent3 a, #footerContent3 a:hover, #footerContent3 a:visited { text-transform: uppercase; text-decoration: none; color: #f4edf0; }

/* Special styles */
.mediaHolder { float: right; margin: 0 20px; width: 320px; height: 300px; /*background-color: #c0d3b4;*/ }

div#highlightsHolder { width: 100%; position: relative; height: 1020px; }

#highlight1, #highlight2, #highlight3, #highlight4, #highlight5, #highlight6, #highlight7, #highlight8, #highlight9, #highlight10, #highlight11, #highlight12, #highlight13, #highlight14, #highlight15, #highlight16, #highlight17, #highlight18 {
	position: absolute;
	width: 210px;
	color: #775963;
	font-size: 0.8em;
	background: url(/assets/pageImages/highlight_bkg.png) top left no-repeat;
	padding: 40px 0 0 32px;
}
#highlight2, #highlight5, #highlight8, #highlight9, #highlight12, #highlight17 {
	background: url(/assets/pageImages/highlight_bkg2.png) top left no-repeat;
}
#highlight1 { left: 9px; top: 32px; }
#highlight2 { left: 268px; top: 77px; }
#highlight3 { left: 1px; top: 555px; }
#highlight4 { left: 378px; top: 159px; }
#highlight5 { left: 296px; top: 217px; }
#highlight6 { left: 67px; top: 756px; }
#highlight7 { left: -44px; top: 396px; width: 130px; }
#highlight8 { left: 121px; top: 369px; }
#highlight9 { left: 31px; top: 468px; }
#highlight10 { left: 373px; top: 25px; }
#highlight11 { left: 285px; top: 922px; }
#highlight12 { left: 65px; top: 639px; }
#highlight13 { left: 3px; top: 859px; }
#highlight14 { left: 349px; top: 704px; background: transparent; }
#highlight15 { left: 325px; top: 295px; }
#highlight16 { left: 448px; top: 490px; width: 120px; }
#highlight17 { left: 387px; top: 374px; }
#highlight18 { left: 292px; top: 490px; width: 120px;}

#highlightPhoto1 {
	position: absolute;
	width: 260px;
	height: 195px;
	background: url(/assets/pageImages/highlights2.jpg) top left no-repeat;
	left: 7px;
	top: 145px;
}
#highlightPhoto2 {
	position: absolute;
	width: 260px;
	height: 288px;
	background: url(/assets/pageImages/highlights3.jpg) top left no-repeat;
	left: 330px;
	top: 572px;
}
ul#higlights { list-style-type: none; margin: 0; padding: 0;  }
#highlights li { display: block; float: left; width: 280px; margin: 0; padding: 12px 18px; font-size: 1.2em; font-style: italic; text-align: center; color: #f4edf0;}
h3 a { display: block; background: url(/assets/plus.gif) 0% 50% no-repeat; text-decoration: none; color: #bfaab2; padding-left: 20px; }
dl#comments dt { padding: 4px 25px; }
dl#comments dt span { color: #0099cc; font-size: 1.2em; }
dl#comments dd { font-style: italic; margin-bottom: 12px; color: #775963; }
div.mapInfo { width: 250px; }

dl#music_descriptions dt { font-weight: bold; color: #775963; }
.composer { color: #0099CC; font-weight: normal; }

/* Forms */
.formHolder, #contactHolder { width: 423px; margin: 15px 0 20px 20px; border: solid #839B5A; border-width: 1px 1px 1px 6px; padding: 20px 10px 20px 20px; background: #eae1ea; }
.fieldLabel  { padding: 2px 50px 7px 0; margin: 0; border-bottom: 1px dotted #839B5A; text-align: right; }
.fieldLabel span { font-size: 1.3em; color: #0099CC; }
.fieldLabel span { font-size: 0.9em; }
#submitButton { margin: 10px 0 0 233px; width: 130px; background-color: #775963; border: 1px solid #775963; color: #fff; }
span.errorMessage { color: #CC3300; }
/* Images */
.imageRight { float: right; margin: 12px; padding-left: 18px; }
.imageLeft { float: left; margin: 12px; margin-left: -75px; padding-right: 18px; } 
.photoHolder { width: 533px; height: 400px; }
.photoHolder #noFlash { background: url(/assets/pageImages/gallery_bkg.jpg) 50% 20% no-repeat; width: 533px; height: 400px;}

#photoGallery { margin: 20px 0; padding: 0; }
#map { width: 500px; height: 390px; margin: 20px 0; }

#sidebar { width: 500px; }
h1 .printLink { background: url(/assets/printer.png) left 50% no-repeat; padding-left: 25px; line-height: 1.7em; font-size: 0.5em; text-decoration: none; }

/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/final_drop.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

.menu { width: 694px; position:relative; z-index:100; }
.menu ul { padding:0; margin:0; list-style-type:none; }
.menu ul ul { width:110px; }
.menu li { float:left; width:110px; position:relative; }
.menu a, .menu a:visited { display:block; font-size: 0.85em; text-decoration:none; color:#fff; width:99px; height:50px; background:#eee; line-height:49px; border-bottom: 1px solid #fff; } /* border for whitespace bug in ie5.x */
.menu a span, .menu a:visited span { display: none; }
.menu ul ul { visibility:hidden; position:absolute; background:#fff; height:0; top: 51px; left:-35px; width:180px; text-align: center; opacity: 0.85; }
* html .menu ul ul { top:50px; t\op:51px; }
.menu table {position:absolute; top:0; left:0;} 
.menu ul ul a, .menu ul ul a:visited { background:#fff; color:#775963; height:auto; line-height:1em; padding:5px 10px; width:159px; }
* html .menu ul ul a { width:180px; w\idth:159px; }
/* next three styles fro the first unnecessary drop down on the home link because of ie5.x*/
.menu ul ul.first { left:0; }
.menu ul ul.first a, .menu ul ul.first a:visited { width:89px; }
* html .menu ul ul.first a { width:110px; w\idth:79px; }

.menu a:hover, .menu ul ul a:hover{ color:#775963; background:#d8d0d3; }
.menu :hover > a, .menu ul ul :hover > a { color:#775963; background:#d8d0d3; }
.menu ul li:hover ul, .menu ul a:hover ul{ visibility:visible; }
.menu ul :hover ul ul { visibility:hidden; }
.menu ul :hover, .menu ul :hover ul{ visibility:visible; }
.menu a#m1 { background: #758279 url(/assets/menu/menu_home.png) top left no-repeat; }
.menu a#m2 { background: #758279 url(/assets/menu/menu_magic.png) top left no-repeat; }
.menu a#m3 { background: #758279 url(/assets/menu/menu_inspiration.png) top left no-repeat; }
.menu a#m4 { background: #758279 url(/assets/menu/menu_facilities.png) top left no-repeat; }
.menu a#m5 { background: #758279 url(/assets/menu/menu_friends.png) top left no-repeat; }
.menu a#m6 { background: #758279 url(/assets/menu/menu_contact.png) top left no-repeat; }
.menu a#m1:hover, .menu :hover > a#m1, .menu ul ul :hover > a#m1 { background: #fff url(/assets/menu/menu_home_over.png) top left no-repeat; }
.menu a#m2:hover, .menu :hover > a#m2, .menu ul ul :hover > a#m2  { background: #fff url(/assets/menu/menu_magic_over.png) top left no-repeat; }
.menu a#m3:hover, .menu :hover > a#m3, .menu ul ul :hover > a#m3  { background: #fff url(/assets/menu/menu_inspiration_over.png) top left no-repeat; }
.menu a#m4:hover, .menu :hover > a#m4, .menu ul ul :hover > a#m4  { background: #fff url(/assets/menu/menu_facilities_over.png) top left no-repeat; }
.menu a#m5:hover, .menu :hover > a#m5, .menu ul ul :hover > a#m5  { background: #fff url(/assets/menu/menu_friends_over.png) top left no-repeat; }
.menu a#m6:hover, .menu :hover > a#m6, .menu ul ul :hover > a#m6  { background: #fff url(/assets/menu/menu_contact_over.png) top left no-repeat; }
/* Seperated copies of the above rules to address ie5.x browsers which ignore the rules when finding child selectors in above */
.menu a#m1:hover, .menu ul ul a#m1:hover { background: #fff url(/assets/menu/menu_home_over.png) top left no-repeat; }
.menu a#m2:hover, .menu ul ul a#m2:hover { background: #fff url(/assets/menu/menu_magic_over.png) top left no-repeat; }
.menu a#m3:hover, .menu ul ul a#m3:hover { background: #fff url(/assets/menu/menu_inspiration_over.png) top left no-repeat; }
.menu a#m4:hover, .menu ul ul a#m4:hover { background: #fff url(/assets/menu/menu_facilities_over.png) top left no-repeat; }
.menu a#m5:hover, .menu ul ul a#m5:hover { background: #fff url(/assets/menu/menu_friends_over.png) top left no-repeat; }
.menu a#m6:hover, .menu ul ul a#m6:hover { background: #fff url(/assets/menu/menu_contact_over.png) top left no-repeat; }
