/* Hats off to Eric Meyer for this, although a couple of additions are ours - http://meyerweb.com/eric/thoughts/2008/01/15/resetting-again/ */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; font-family: Arial, sans-serif;
}
body { line-height: 1.3; font-family: Arial, sans-serif; background-color: #FFF;} 
ol, ul { list-style: none; } 
blockquote, q { quotes: none; } 
/* remember to define focus styles! */ 
:focus { outline: 0; } 
/* remember to highlight inserts somehow! */ 
ins { text-decoration: none; } 
del { text-decoration: line-through; } 
/* tables still need 'cellspacing="0"' in the markup */ 
table { border-collapse: collapse; border-spacing: 0; }

/*Onto our own.*/
body {background: #fff url(images/content_bg.gif) repeat-x;}
#header { text-align: center; height: 150px;}
#header h1 {position: absolute; left: 30px; top: 12px; display: block; width: 121px; height: 110px; background: url(images/logo.gif) no-repeat;}
#header h1 a {display: block; width: 121px; height: 110px;}
#header h1 a span {display: none;}
#header ul {position: absolute; top: 0; left: 200px; display: block; width: 600px; height: 314px;}
#header ul li {float: left; display: block;}
#header_parties a { display: block; width: 152px; height: 89px; background: url(images/nav_parties.gif) no-repeat 0 0;}
#header_weddings a { display: block; width: 141px; height: 89px; background: url(images/nav_weddings.gif) no-repeat 0 0;}
#header_exhibitions a { display: block; width: 193px; height: 89px; background: url(images/nav_exhibitions.gif) no-repeat 0 0;}
/*clear: left for a new line. Note the margin to nudge them below the background image*/
#header_about a { clear: left; margin-top: 2px; display: block; width: 152px; height: 30px; background: url(images/nav_about-us.gif) no-repeat 0 0;}
#header_contact a { margin-top: 2px; display: block; width: 141px; height: 30px; background: url(images/nav_contact.gif) no-repeat 0 0;}
#header_photo a { margin-top: 2px; display: block; width: 193px; height: 30px; background: url(images/nav_photo-gallery.gif) no-repeat 0 0;}
/*This leaves text links for usability, but doesn't display them to casual users*/
#header ul li a span {display: none;}
/*Move the background image - much easier than lots of Javascript :-) */
#header ul li a:hover {background-position: 0 -30px;}
#header ul li a.active {background-position: 0 -30px;}
#header ul li.top a:hover {background-position: 0 -89px !important;}
#header ul li.top a.active {background-position: 0 -89px !important;}

/*Set-up the basic layout for main content. Colours etc. will vary by page and are done by the classes that follow*/
#content {background: #fff; text-align: left; margin: 0; padding: 20px 50px 50px 50px;}
#content h2 {font-size: 1.1em; margin-bottom: 5px;}
#content h3 {}
#content p {font-size: 0.8em; padding-top: 5px;}
.photos {margin: 10px 0; padding: 10px; border-width: 4px; border-style: double;}
.photos img {margin: 10px 3px; border-width: 2px; border-style: solid;}
/*Photos: default width 250px; default height: 650px;*/

/*Page-specific details*/
/*Parties & Themed Events */
.content_parties { background: #000 url(images/parties-themed-events/background.gif) !important; color: #fff; }
.winter_wonderland {background-color: #B34D97;}
.winter_wonderland, .winter_wonderland img {border-color: #fff;}
.out_of_africa {background-color: #BC5C34;}
.out_of_africa, .out_of_africa img {border-color: #FBDD6B;}
.death_on_the_nile {background-color: #7F1D02;}
.death_on_the_nile, .death_on_the_nile img {border-color: #B4B148;}
.party_party {background-color: #2F9FB7;}
.party_party, .party_party img {border-color: #933D5A;}

/*Weddings*/
.content_weddings { background: #F3DEA6 url(images/weddings/background.gif) !important; }
.country_chic { background-color: #e8bceb; }
.country_chic, .country_chic img {border-color: #82407e;} 
.rustic_charm { background-color: #C4D8A7; }
.rustic_charm, .rustic_charm img {border-color: #395234;}
.little_italy { background-color: #d9c1a8; }
.little_italy, .little_italy img {border-color: #975b21;}

/*Exhibitions & Product Launches*/
.content_exhibitions { background: #fff url(images/exhibitions-product-launches/background.gif) !important; }
.corporate_branding { background-color: #e6d1fb; }
.corporate_branding, .corporate_branding img {border-color: #7d467b;} 
.exhibitions { background-color: #dcd8cc; }
.exhibitions, .exhibitions img {border-color: #704d48;} 

/*Photo Gallery*/
.content_photogallery { background: #fff url(images/exhibitions-product-launches/background.gif) !important; }

/*This section for the home page only*/
#home {margin-left: auto; margin-right: auto; padding: 0 25px 25px 25px; width: 700px; text-align: left; background: #fff url(images/home_bg.gif);}
#home h1 {position: relative; top: 158px; display: block; width: 121px; height: 110px; background: url(images/logo.gif) no-repeat;}
#home h1 a {display: block; width: 121px; height: 110px;}
#home h1 span {display: none;}
#home h2 {margin-top: 50px; color: #C80018; font-weight: bold; font-size: 0.9em;}
#home h2 a {color: #A80018;}
#home dl {font-size: 0.8em;}
#home dt { font-weight: bold; margin-top: 10px;}
#home dd {margin-left: 10px; }
#home ul.content {font-size: 0.8em; margin-left: 20px; list-style: disc url(images/bullet.gif);}
#home ul.content li {margin-top: 5px;}
#home p {margin: 20px 0 20px 0; font-size: 0.8em;}
#home p a {color: #666;}
#home p.contact {margin: 4px 0 0 0;font-size: 0.7em;}
#home a:hover {color: #000;}
#home ul.nav {margin-top: -110px; margin-left: 175px; display: block; width: 498px; height: 235px;}
#home ul.nav li {float: left; display: block;}

/*clear: left for a new line. Note the margin to nudge them below the background image*/
#home_about a { clear: left; margin-top: 2px; display: block; width: 162px; height: 30px; background: url(images/nav_home_about-us.gif) no-repeat 0 0;}
#home_contact a { margin-top: 2px; display: block; width: 141px; height: 30px; background: url(images/nav_home_contact.gif) no-repeat 0 0;}
#home_photo a { margin-top: 2px; display: block; width: 195px; height: 30px; background: url(images/nav_home_photo-gallery.gif) no-repeat 0 0;}
/*This leaves text links for usability, but doesn't display them to casual users*/
#home ul.nav li a span {display: none;}
/*Move the background image - much easier than lots of Javascript :-) */
#home ul.nav li a:hover {background-position: 0 -30px;}
#home ul.nav li a.active {background-position: 0 -30px;}
/*Start the disco*/
#home_parties { display: block; width: 162px; height: 235px; background: url(images/home_parties.jpg) no-repeat 0 0;}
#home_weddings {display: block; width: 141px; height: 235px; background: url(images/home_weddings.jpg) no-repeat 0 0;}
#home_exhibitions {display: block; width: 195px; height: 235px; background: url(images/home_exhibitions.jpg) no-repeat 0 0;}
.home_parties_over { background-position: 0 -470px;}
.home_weddings_over {background-position: 0 -235px;}
.home_exhibitions_over {background-position: 0 -705px;}
/*This leaves text links for usability, but doesn't display them to casual users*/
#home ul li a span {display: none;}
/*End of the home page section*/


.clear_left {clear: left;}