/* --// basic elements --// */

html, body {
	height: 100%;
}

body {
	background-image: url(../images/flametree_bg2.jpg);
	background-repeat: no-repeat;
	background-position: top;
	background-color: #7f0705;
	margin:0 auto;
	padding:0;
	color:#d7d7d7;
	font-family: georgia,times,serif;
	font-size: 76%;
	font-weight:normal;
}

#outerContainer {
	position: relative;
	min-height: 740px;
	height: 100%;
	voice-family: "\"}\"";
	voice-family: inherit;
	height: auto;
}
html>body #outerContainer {
	height: auto;
}

#container {
 margin: 0 auto;
 width: 768px;
}

.smallText {
	font: 90% georgia,times,serif;
}

.horizDivide { background: transparent url(../images/divide_horizontal.png) no-repeat center bottom;
margin: 8px auto;
height: 1px;
}

pre.linkCode {
	width: 350px;
	margin-left: -50px;	
	padding: 5px;
	

}


/* --// links --// */

a {
 color: #d7d7d7;
 text-decoration: underline;
}

a:hover,a:active { text-decoration: none; }


/* --// id selectors --// */

#intro {
 height: 77px;
 width: 734px;
 margin: 7px auto 0 auto;
 padding: 17px;
 background: url(../images/white_bar_top.gif) no-repeat;
}

#pageHeader {
 width: 193px;
 height: 61px;
 margin: 0px;
 background: transparent url(../images/flametree_logo.jpg) no-repeat; 
}

#linkList {
 padding-left: 20px;
 float: left;
}

#lselect {
 padding-bottom: 12px;
 margin-top: 15px;
}


#maincontent {
 margin: 0;
 padding: 0 20px 0 20px;
 min-height: 530px;
 width: 350px;
 float: left;
}

#maincontent {
 line-height: 18px;
}

#imagePanel {
  position: absolute;
  top: -7px;
  z-index: 2;
  margin-left: 603px;
}

#footerContainer {
	clear: both;
	position: relative;
	min-height: 50px;
	height: 100%;
	voice-family: "\"}\"";
	voice-family: inherit;
	height: auto;
}
html>body #footerContainer {
	height: auto;
}

#footer {
	margin: 0 auto;
	padding: 0px;
	width: 770px;
	background: url(../images/white_bar_foot.png) top no-repeat;
}

#footer p {
	text-align: left;
	margin:5px 0 0 0;
	color: #aa1615;
	padding: 10px 5px;
	font: 76% verdana,arial,serif;
	letter-spacing: -1px;
}

#footer a {
	color: #8e8e8e;
}

#extraDiv1, #extraDiv2, #extraDiv3, #extraDiv4,#extraDiv5, h1, h2 { display : none; }

/* --// lists --// */

#maincontent ul {
 list-style: square;
 padding: 0;
 margin: 0 0 0 15px;
}

#maincontent li {
 list-style: square;
 padding: 5px 0px 0px 0px;
 margin: 0;
}

/* --// elements --// */

#navpanel {
     width: 190px; 
     height: 350px;
     background: transparent url(../images/flametree_nav1.jpg);
     padding: 0;
     margin: 0 4px 0 4px;
     position: relative;
     float: left;
}
     
#navpanel li {
     margin: 0; 
     padding: 0; 
     list-style: none;
     position: absolute; 
     left: 0;
}
     
#navpanel li, #navpanel a {
    width:190px; 
    height:35px;
    display: block;
}

#navpanel a {border: 0;}

#navpanel a:hover {border: 0;}    

#home {top: 0; height: 35px;}
#services {top: 35px; height: 35px;}
#menus {top: 70px; height: 35px;}
#produce {top: 105px; height: 35px;}
#about {top: 140px; height: 35px;}
#testimonials {top: 175px; height: 35px;}
#contact {top: 210px; height: 35px;}

#home a:hover {background: transparent url(../images/flametree_nav1.jpg) -190px 0 no-repeat;}
#services a:hover {background: transparent url(../images/flametree_nav1.jpg) -190px -35px no-repeat;}
#menus a:hover {background: transparent url(../images/flametree_nav1.jpg) -190px -70px no-repeat;}
#produce a:hover {background: transparent url(../images/flametree_nav1.jpg) -190px -105px no-repeat;}
#about a:hover {background: transparent url(../images/flametree_nav1.jpg) -190px -140px no-repeat;}
#testimonials a:hover {background: transparent url(../images/flametree_nav1.jpg) -190px -175px no-repeat;}
#contact a:hover {background: transparent url(../images/flametree_nav1.jpg) -190px -210px no-repeat;}

#home a.active {background: transparent url(../images/flametree_nav1.jpg) -380px 0 no-repeat;}
#services a.active {background: transparent url(../images/flametree_nav1.jpg) -380px -35px no-repeat;}
#menus a.active {background: transparent url(../images/flametree_nav1.jpg) -380px -70px no-repeat;}
#produce a.active {background: transparent url(../images/flametree_nav1.jpg) -380px -105px no-repeat;}
#about a.active {background: transparent url(../images/flametree_nav1.jpg) -380px -140px no-repeat;}
#testimonials a.active {background: transparent url(../images/flametree_nav1.jpg) -380px -175px no-repeat;}
#contact a.active {background: transparent url(../images/flametree_nav1.jpg) -380px -210px no-repeat;}


/* FIR css */
.navlink {
	width: 190px;
	height: 35px;
}

.navlink span {
	display: block;
	width: 0;
	height: 0;
	overflow: hidden;
}


/* selector styles */

#menuSelectorContainer ul {
		  margin:0; padding:0;
}

.menuSelector {
	margin:0 0 0 0;  padding:0;
	overflow:hidden; /* Clears the floats */
	width:100%; /* IE and older Opera fix for clearing, they need a dimension */
	list-style:none;
}

.menuSelector li {
	float:left;
	display:inline; /* For IE so it doesn't double the 1% left margin */
	width:115px;
	margin:0 0 0 0; padding:0;
	height:42px;
	position:relative; /* This is the key */
}
.menuSelector a,
.menuSelector img {
.menuSelector a:link,
	display:block;
	width:100%;
}

a img{ border:none; } /* A small fix */

.menuSelector a:visited,
.menuSelector a:focus,
.menuSelector a:hover,
.menuSelector a:active {
	padding:0px;
	width:108px;
	height:38px;
	/* border:0px solid #eeefef; We blend the border with the bg, as if it isn't there */
	position:absolute;
	top: 2px; left: 3px;
	/* top:50%; left:50%; position it so that image's top left corner is in the center of the list item */
	/* margin:-41px 0 0 -41px; Pull the image into position with negative margins (margins value is half of the width of the image) */
}

.menuSelector a:hover {
	border-color:#dfdfdf;
}

            
#pastry {background: transparent url(../images/menus/canape_pastry.jpg) 0 0 no-repeat;}
#fritters {background: transparent url(../images/menus/canape_fritters.jpg) 0 0 no-repeat;}
#dippers {background: transparent url(../images/menus/canape_dippers.jpg) 0 0 no-repeat;}

#pancakes {background: transparent url(../images/menus/canape_pancakes.jpg) 0 0 no-repeat;}
#skewers {background: transparent url(../images/menus/canape_skewers.jpg) 0 0 no-repeat;}
#omelettes {background: transparent url(../images/menus/canape_omelette.jpg) 0 0 no-repeat;}

#salad {background: transparent url(../images/menus/canape_salad.jpg) 0 0 no-repeat;}
#alternative {background: transparent url(../images/menus/canape_alternative.jpg) 0 0 no-repeat;}
#opensandwich {background: transparent url(../images/menus/canape_open.jpg) 0 0 no-repeat;}

#toasts {background: transparent url(../images/menus/canape_toasts.jpg) 0 0 no-repeat;}
#teasandwich {background: transparent url(../images/menus/canape_tea.jpg) 0 0 no-repeat;}
#sweet {background: transparent url(../images/menus/canape_sweet.jpg) 0 0 no-repeat;}

/* FIR css */
.menulink {
	width: 115px;
	height: 47px;
}

.menulink span {
	display: block;
	width: 0;
	height: 0;
	overflow: hidden;
}

#menuSelectorOutput li {		  
	list-style: none;
}

#menuSelectorOutput ul.toplevel {
		  margin:0; padding:0;
}

#menuSelectorOutput ul ul.midlevel {
		  margin:5px 0px 5px 0px; padding:5px 0px 5px 0px;
}

#menuSelectorOutput ul ul ul.sublevel {
	margin: -30px 0px 0px 70px;
	padding:5px 0px 5px 0px;
}

li.premium {background: transparent url(../images/icon_premium.png) 0 6px no-repeat;}
li.gourmet {background: transparent url(../images/icon_gourmet.png) 0 6px no-repeat;}
li.deluxe {background: transparent url(../images/icon_deluxe.png) 0 6px no-repeat;}



li span {
	display: block;
	width: 0;
	height: 0;
	overflow: hidden;
}



/* --// layout ...booya --// */

 h3.subHeader {
 font-size: 140%;
 }
 
 h3.pagetitle {
 text-indent: -5000px;

/* --// other styles 

h3.pagetitle.home {background: url(../images/page_title_home.gif) no-repeat right;}
h3.pagetitle.services {background: url(../images/page_title_services.gif) no-repeat right;}
h3.pagetitle.menus {background: url(../images/page_title_menus.gif) no-repeat right;}
h3.pagetitle.wedding {background: url(../images/page_title_wedding.gif) no-repeat right;}
h3.pagetitle.about {background: url(../images/page_title_about.gif) no-repeat right;}
h3.pagetitle.contact {background: url(../images/page_title_contact.gif) no-repeat right;}

--// */

/* --// the lone class --// */

.p5 { clear: both; }