/* ---- Reset all styles ---------------------------------------------------------- */

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, label, input, p, blockquote, address, th, td {
	margin: 0;
	padding: 0;
}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
}
ol, ul {
	list-style-type: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
caption, th {
	text-align: left;
}
fieldset, img {
	border: 0;
}



/* ---- Set new basic styles --------------------------------------------------------- */

body {
	background:#ded7ab url('../images/background.jpg') repeat;
}
body, p, td, th, li, h1, h2, h3, h4, h5, h6, table  {
	color:#554a31;
	font:normal 11px/1.5 verdana, sans-serif;
	/*font-size:14px;*/
}

h1, h2, h3, h4, h5, h6, p, ul, ol, dl { 

}
h3 {
	font-weight:bold;
	margin:0.8em 45px;
	font-size: 14px; 	font-family: Georgia;
	color:#786028;
}
h4, h4 a {
	font-weight:bold;
	font-size: 11px;
	color: #a38237;
	font-family: Georgia;
	margin-top: .8em;
	text-transform:uppercase;
}
a {
	color:#554a31;
	text-decoration:underline;
}
a:hover {
	color:#81704a;
}
a:visited {

}

blockquote {
	margin: 0px 60px;
}
.access {
	display:none;
}

.clear {
	clear:both;
}



/* ---- =Structure! --------------------------------------------------------- */

#container {
	position:relative;
	width:970px;
	margin:10px auto;
	background:url(../images/container_middle_bg.jpg) repeat-y center top;
}



/* ---- =Header! --------------------------------------------------------- */

#header {
	position:relative;
	width:970px;
	height:210px;			/* note that this height is larger than our bg image, which will "stick" to the top */
	margin:0 auto;
	background:url(../images/container_top_bg.jpg) no-repeat center top;
}
#header h1 {
	float:left;
	display:inline;
	width:280px;
	height:132px;
	margin-top:57px;
	margin-left:69px;
}
#header-highlights {
	float:right;
	display:inline;
	width:535px;
	height:167px;
	margin-top:39px;
	margin-right:50px;
}



/* ---- =Interior! --------------------------------------------------------- */

#interior {
	position:relative;
	width:970px;			/* give IE some "layout!" */
	margin:0;
	padding:0;
}



/* ---- =Content! --------------------------------------------------------- */

#content-container {
	position:relative;
	float:left;
	display:inline;
	width:623px;
	margin-top:22px;
	margin-left:50px;
	padding-bottom:15px;
	border:1px solid #ded8b5;
	background:#e8e7cd url(../images/content_bg.jpg) repeat;
}
#content {
	/* to set various "title" images as the background of this div, see "pages.css" */
	position:relative;
	width:623px;
	background-position:left top;
	background-repeat:no-repeat;
	min-height:218px;
	padding-top:20px;
}
#content h2, #content h3, #content h4, #content p, #content ul, #content table {
	/* set base margin per this container for all standard block-level elements */
	margin: 10px 40px;
}
#content table {
	width: 543px;
}
#content table td {
	padding: 10px 10px 0px 0px;
}
#content h2, #content h2.plain-text {
	/*
	This is provded as default "fallback" H2 styling for when no "contenttitle" image is available.
	Usually we will use custom title graphics as background of #content, and hide this element.
	*/
	color:#da1700;
	font-family:"Bookman Old Style", "Book Antigua", Georgia, "Times New Roman", Times, serif;
	font-size:20px;
	text-indent:0;
	margin:30px 40px 55px 40px;
}
#content h2.image-replacement {
	/*
	You need to specify this class on the #content H2 element in order to hide it from the visual
	design to allow graphical content titles. Note that we do use a margin-bottom to control how
	far down the next element will appear.
	*/
	text-indent:-9999px;
	margin:0;
	padding:0;	
	margin-bottom:85px;
}
#content h3 {
	font-weight:bold;
	margin-top:1.5em;
	margin-bottom:.5em;
}	
#content p {

}
#content ul {
	list-style-type:disc;
}
#content ul li {
	margin-left:25px;
}
#content ul li ul li{
	margin-left:0px;
}
p#join-mailing-list {
	float:right;
	display:inline;			/* <3 IE! */
	width:270px;
	height:78px;
	background:url(../images/join_mailing_list_out.gif) no-repeat center center;
	margin-right:10px;
	margin-bottom:10px;
	text-indent:-9999px;
}
p#join-mailing-list a {
	display:block;
	width:270px;
	height:78px;
	background:url(../images/join_mailing_list_out.gif) no-repeat center center;
}
p#join-mailing-list a:hover{
	background:url(../images/join_mailing_list_over.gif) no-repeat center center;
}
p#join-mailing-list a:active, p#join-mailing-list a:focus {
	outline:0;
}
#content blockquote p {
	margin-left:15px;
}


/* ---- =SideContent! --------------------------------------------------------- */

#sidecontent {
	/* You can apply background images on a per page basis in "pages.css" */
	position:relative;
	float:right;
	display:inline; 		  /* <3 IE! */
	width:230px;
	margin-top:22px;
	margin-right:50px;
	margin-bottom:10px;
	background-position:center top;
	background-repeat:no-repeat;
}
/* common styling to common blocklevel children */
#sidecontent p, #sidecontent ul {
	margin:0;
	padding:0.5em 0;
}

#sidecontent ul li  {
	list-style-position: outside;
	list-style-type: disc;
	margin-left:15px;
}




/* ---- =Navigation! --------------------------------------------------------- */
/* Set common nav styles and individual button images here. Set flyout behaviours in "nav.css" */

#navigation {
	position:absolute;
	top:10px;
	left:55px;
	width:680px;
}
#navigation ul {

}


/*
Following styles are specific to all nav buttons, both at top and in footer.
Recall that the graphically-replaced link buttons will need to have the "toplevel"
class applied to BOTH the LI and A elements to work... This is to keep subnav
children from inheriting these styles...
*/
ul.nav li.toplevel {
	float:left;
	display:inline;
	height:25px;				/* Same height for all button images. Account for children borders. */
	margin-right:2px;
	zzztext-indent:-9999px;			/* hmmmm, we can't use this here to hide our text --- flyout does not work in IE when we do this!! */
	background-position:center center;
	background-repeat:no-repeat;
}
ul.nav li.toplevel a.toplevel {
	display:block;
	height:23px;				/* Same height for all button images. Don't account for borders. */
	border:1px solid #c9b670;
	background-position:center center;
	background-repeat:no-repeat;
	text-indent:-9999px;			/* hey! the flyout in IE works if we throw our negative indent here instead! */
}
ul.nav li.toplevel a.toplevel:hover {
	border:1px solid #a68947;
}
ul.nav li.toplevel a.toplevel:active, ul.nav li.toplevel a.toplevel:focus {
	outline:0;					/* <3 FF! */
}





/* --- Navigation button graphics --- */
/* LI should be 1px larger around each edge due to contained element having 1px borders */

li#linkitem-home		{ width:51px; }
li#linkitem-breads		{ width:55px; }
li#linkitem-desserts	{ width:65px; }
li#linkitem-catering	{ width:110px; }
li#linkitem-weddings	{ width:72px; }
li#linkitem-whatsnew	{ width:90px; }
li#linkitem-company		{ width:72px; }
li#linkitem-community	{ width:86px; }
li#linkitem-sitemap		{ width:67px; }
li#linkitem-privacy		{ width:95px; }
li#linkitem-contact		{ width:80px; }

li#linkitem-home a.toplevel			{ width:49px; }
li#linkitem-breads a.toplevel		{ width:53px; }
li#linkitem-desserts a.toplevel		{ width:63px; }
li#linkitem-catering a.toplevel		{ width:108px; }
li#linkitem-weddings a.toplevel		{ width:70px; }
li#linkitem-whatsnew a.toplevel		{ width:88px; }
li#linkitem-company a.toplevel		{ width:70px; }
li#linkitem-community a.toplevel	{ width:84px; }
li#linkitem-sitemap a.toplevel		{ width:65px; }
li#linkitem-privacy a.toplevel		{ width:93px; }
li#linkitem-contact a.toplevel		{ width:78px; }

li#linkitem-home, li#linkitem-home a.toplevel			{ background-image:url(../images/nav_home_out.gif); }
li#linkitem-breads, li#linkitem-breads a.toplevel		{ background-image:url(../images/nav_breads_out.gif); }
li#linkitem-desserts, li#linkitem-desserts a.toplevel	{ background-image:url(../images/nav_desserts_out.gif); }
li#linkitem-catering, li#linkitem-catering a.toplevel	{ background-image:url(../images/nav_catering_out.gif); }
li#linkitem-weddings, li#linkitem-weddings a.toplevel	{ background-image:url(../images/nav_weddings_out.gif); }
li#linkitem-whatsnew, li#linkitem-whatsnew a.toplevel	{ background-image:url(../images/nav_whatsnew_out.gif); }
li#linkitem-company, li#linkitem-company a.toplevel		{ background-image:url(../images/nav_company_out.gif); }
li#linkitem-community, li#linkitem-community a.toplevel	{ background-image:url(../images/nav_community_out.gif); }
li#linkitem-sitemap, li#linkitem-sitemap a.toplevel		{ background-image:url(../images/nav_sitemap_out.gif); }
li#linkitem-privacy, li#linkitem-privacy a.toplevel		{ background-image:url(../images/nav_privacy_out.gif); }
li#linkitem-contact, li#linkitem-contact a.toplevel		{ background-image:url(../images/nav_contact_out.gif); }

li#linkitem-home a.toplevel:hover			{ background-image:url(../images/nav_home_over.gif); }
li#linkitem-breads a.toplevel:hover			{ background-image:url(../images/nav_breads_over.gif); }
li#linkitem-desserts a.toplevel:hover		{ background-image:url(../images/nav_desserts_over.gif); }
li#linkitem-catering a.toplevel:hover		{ background-image:url(../images/nav_catering_over.gif); }
li#linkitem-weddings a.toplevel:hover		{ background-image:url(../images/nav_weddings_over.gif); }
li#linkitem-whatsnew a.toplevel:hover		{ background-image:url(../images/nav_whatsnew_over.gif); }
li#linkitem-company a.toplevel:hover		{ background-image:url(../images/nav_company_over.gif); }
li#linkitem-community a.toplevel:hover		{ background-image:url(../images/nav_community_over.gif); }
li#linkitem-sitemap a.toplevel:hover		{ background-image:url(../images/nav_sitemap_over.gif); }
li#linkitem-privacy a.toplevel:hover		{ background-image:url(../images/nav_privacy_over.gif); }
li#linkitem-contact a.toplevel:hover		{ background-image:url(../images/nav_contact_over.gif); }





/* ---- =Footer! --------------------------------------------------------- */

#footer {
	position:relative;
	width:970px;
	height:107px;
	margin:0 auto;
	background:url(../images/container_bottom_bg.jpg) no-repeat center bottom;
}
#footer p {
	font-size:80%;
	margin:0;
	padding:0;
	text-indent:-9999px;
}
#footer-nav-container {
	position:absolute;
	top:50px;
	left:30px;
	width:400px;
}