* {
margin:0px;
padding:0px;
}

p,h1,pre {
margin:0 30px 10px;
}

h1 {
font-size:24px;
padding-top:10px;
padding-left:5px;

}

h2 {
font-size:18px;
padding-top:10px;
padding-left:5px;

}

h3 {
font-size:16px;
padding-top:10px;
padding-left:5px;

}

img, td {
border:none;
}

body {
text-align:left;
font-family:'Arial', 'trebuchet ms', 'Lucida Grande', 'tahoma';
font-size:12px;
color:#000000;
background-color: #ffffff;
background: url('images/main_container_bg.gif') repeat-y 50% 0;
background-position:center;
margin: 0px 0px 0px 0px;
}

p {
font-size:12px;
padding:10px;
padding-left:5px;
}

#frame {
width:1024px;
min-height:516px;
background-color: #ffffff;
margin-right:auto;
margin-left:auto;
margin-top:0px;
text-align:left;
padding:0;
}


#header {
height:222px;
width:1024px;
text-align:center;
}

#header_nav {
height:167px;
width:785px;
}

#inline {
height:65px;
display:inline;
}

#topnav_water {
display:inline;
height:167px;
width:785px;}

#topnav_water a {
text-decoration:none;
display:inline;
float:left;
height:167px;
position:relative;
top:0px;
padding-right:9px;
padding-left:9px;
text-transform:none;
font-weight:700;
padding-top:-20px;
color:#ffffff;
background-image:url(images/bg_off.jpg);
background-position:bottom;
}



#topnav_water a:hover {
text-decoration:none;
top:0px;
background:#ffffff;
background-position:bottom;
background-image:url(images/bg_on.jpg);
color:#ffffff;
}


#topnav_water ul {
margin:0 0 0 200px;
padding:0;
}

#topnav_water li {
display:inline;
}

#topnav {
display:inline;
height:167px;
width:785px;
}

#topnav a {
text-decoration:none;
display:inline;
float:left;
height:167px;
position:relative;
top:0px;
padding-right:0px;
padding-left:0px;
text-transform:none;
font-weight:700;
padding-top:0px;
color:#ffffff;
background-image:url(images/bg_off.jpg);
background-position:bottom;
}



#topnav a:hover {
text-decoration:none;
top:0px;
background:#ffffff;
background-position:bottom;
background-image:url(images/bg_on.jpg);
color:#ffffff;
}


#topnav ul {
margin:0 0 0 200px;
padding:0;
}

#topnav li {
display:inline;
}


#faq {
height:167px;
width:185px;
}

#faq a {
text-decoration:none;
display:inline;
float:left;
height:167px;
position:relative;
top:0px;
padding-right:9px;
padding-left:9px;
text-transform:none;
font-weight:700;
padding-top:-20px;
color:#ffffff;
background-image:url(images/WaterWebDesignBIG_NEW_02.jpg);
background-position:bottom;
}



#faq a:hover {
text-decoration:none;
top:0px;
background:#ffffff;
background-position:bottom;
background-image:url(images/rollover_position1.png);
color:#ffffff;
}


#faq ul {
margin:0 0 0 200px;
padding:0;
}

#faq li {
display:inline;
}

#why {
height:167px;
width:193px;

}

#why a {
text-decoration:none;
display:inline;
float:left;
height:167px;
position:relative;
top:0px;
padding-right:9px;
padding-left:9px;
text-transform:none;
font-weight:700;
padding-top:-20px;
color:#ffffff;
background-image:url(images/WaterWebDesignBIG_NEW_03.jpg);
background-position:bottom;
}



#why a:hover {
text-decoration:none;
top:0px;
background:#ffffff;
background-position:bottom;
background-image:url(images/rollover_position1.png);
color:#ffffff;
}


#why ul {
margin:0 0 0 200px;
padding:0;
}

#why li {
display:inline;
}

#coolers {
height:167px;
width:206px;
}

#coolers a {
text-decoration:none;
display:inline;
float:left;
height:167px;
position:relative;
top:0px;
padding-right:9px;
padding-left:9px;
text-transform:none;
font-weight:700;
padding-top:-20px;
color:#ffffff;
background-image:url(images/WaterWebDesignBIG_NEW_04.jpg);
background-position:bottom;
}



#coolers a:hover {
text-decoration:none;
top:0px;
background:#ffffff;
background-position:bottom;
background-image:url(images/rollover_position2.png);
color:#ffffff;
}


#coolers ul {
margin:0 0 0 200px;
padding:0;
}

#coolers li {
display:inline;
}


#contact {
height:167px;
width:201px;
}

#contact a {
text-decoration:none;
display:inline;
float:left;
height:167px;
position:relative;
top:0px;
padding-right:9px;
padding-left:9px;
text-transform:none;
font-weight:700;
padding-top:-20px;
color:#ffffff;
background-image:url(images/WaterWebDesignBIG_NEW_05.jpg);
background-position:bottom;
}



#contact a:hover {
text-decoration:none;
top:0px;
background:#ffffff;
background-position:bottom;
background-image:url(images/rollover_position3.png);
color:#ffffff;
}


#contact ul {
margin:0 0 0 200px;
padding:0;
}

#contact li {
display:inline;
}

#photos {
height:76px;
width:71px;
}

#photos a {
text-decoration:none;
display:inline;
float:left;
height:76px;
position:relative;
top:0px;
padding-right:9px;
padding-left:9px;
text-transform:none;
font-weight:700;
padding-top:-20px;
color:#ffffff;
background-image:url(images/nav_photos_off.jpg);
background-position:bottom;
}



#photos a:hover {
text-decoration:none;
top:0px;
background:#ffffff;
background-position:bottom;
background-image:url(images/rollover_position4.png);
color:#ffffff;
}


#photos ul {
margin:0 0 0 200px;
padding:0;
}

#photos li {
display:inline;
}

#application {
height:76px;
width:71px;
}

#application a {
text-decoration:none;
display:inline;
float:left;
height:76px;
position:relative;
top:0px;
padding-right:9px;
padding-left:9px;
text-transform:none;
font-weight:700;
padding-top:-20px;
color:#ffffff;
background-image:url(images/nav_application_off.jpg);
background-position:bottom;
}



#application a:hover {
text-decoration:none;
top:0px;
background:#ffffff;
background-position:bottom;
background-image:url(images/nav_application_on.jpg);
color:#ffffff;
}


#application ul {
margin:0 0 0 200px;
padding:0;
}

#application li {
display:inline;
}

#career {
height:76px;
width:71px;
}

#career a {
text-decoration:none;
display:inline;
float:left;
height:76px;
position:relative;
top:0px;
padding-right:9px;
padding-left:9px;
text-transform:none;
font-weight:700;
padding-top:-20px;
color:#ffffff;
background-image:url(images/nav_career_off.jpg);
background-position:bottom;
}



#career a:hover {
text-decoration:none;
top:0px;
background:#ffffff;
background-position:bottom;
background-image:url(images/nav_career_on.jpg);
color:#ffffff;
}


#career ul {
margin:0 0 0 200px;
padding:0;
}

#career li {
display:inline;
}

#circle {
height:76px;
width:71px;
}

#circle a {
text-decoration:none;
display:inline;
float:left;
height:76px;
position:relative;
top:0px;
padding-right:9px;
padding-left:9px;
text-transform:none;
font-weight:700;
padding-top:-20px;
color:#ffffff;
background-image:url(images/circle_off.jpg);
background-position:bottom;
}



#circle a:hover {
text-decoration:none;
top:0px;
background:#ffffff;
background-position:bottom;
background-image:url(images/circle_on.jpg);
color:#ffffff;
}


#circle ul {
margin:0 0 0 200px;
padding:0;
}

#circle li {
display:inline;
}


#main {
width:100%;
height:600px;
background-image:url(images/stainless_large.jpg);
background-attachment:fixed;
background-repeat: no-repeat;
background-position: 0% 0%;
background-color:#4E505C;
float:left;
min-height:300px;
padding:0;
}

#main a {
color:#ffffff;
font-style:normal;
text-decoration:underline;
}

#main a:visited {
color:#ffffff;
font-style:normal;
text-decoration:underline;
}

#main a:hover {
text-decoration: none;
color: #ff0000; 
}



#footer {
padding-top:10px;
width:1024px;
height:134px;
float:none;
font-weight:bold;
text-align:center;
color:#6c0033;
background-color:#ffffff;
margin:auto;
}



#footer a.reg {
text-decoration:none;
display:inline;
float:none;
font-size:13px;
height:15px;
position:relative;
top:-1px;
padding-right:11px;
padding-left:11px;
text-transform:uppercase;
font-weight:normal;
padding-top:5px;
color:#6c0033;
}

#footer a.reg:hover {
text-decoration: none;
background:#ffffff;
background-repeat:repeat-x;
color:#000000;
}

#footer ul {
margin:0 0 0 0px;
padding:0;
}

#footer li {
display:inline;
}








#footer3 {
padding-top:10px;
width:100%;
float:none;
font-weight:bold;
height:100%;
text-align:center;
color:#ffffff;
background-color:#00668E;
background-repeat:repeat-y;
}



#footer3 a {
text-decoration:none;
display:inline;
float:none;
height:15px;
position:relative;
padding-top:5px;
color:#008FC5;
}

#footer3 a:hover {
text-decoration: none;
background:#00668E;
background-repeat:repeat-x;
color:#000000;
}

#footer3 ul {
margin:0 0 0 0px;
padding:0;
}

#footer3 li {
display:inline;
}



.footer_section{
float:left;
}










.footer2 {
width:100%;
float:none;
height:100%;
font-size:1.0em;
text-align:center;
margin-top:-35px;
clear:both;
background-repeat:repeat-y;

}



.footer2 a {
text-decoration:none;
display:inline;
float:none;
height:15px;
position:relative;
color:#000000;
}

.footer2 a:hover {
text-decoration: none;
color:#6c0033;
}

#leftnav {
width:244px;
height:600px;
background-image:url(images/stainless_large2.jpg);
background-attachment:fixed;
background-repeat: no-repeat;
background-position: 0% 0%;
background-color:transparent;
min-height:1000px;
font-size:12px;
float:left;
padding:0;
}

#leftnav ul {
list-style: none;
margin:0px;
padding-left:11px;
}

#leftnav li {
margin:0px;
padding:0px;
}


#leftnav a {
color:#ffffff;
font-size:12px;
font-weight:bold;
font-style:normal;
text-decoration:none;
}

#leftnav a:visited {
color:#ffffff;
font-size:12px;
font-style:normal;
text-decoration:none;
}

#leftnav a:hover {
text-decoration: none;
color: #FF0000; 
font-size: 12px;
}

.funkyblue {
color:#339999;
font-size:16px;
font-weight:bold;
}


#rightnav {
width:175px;
font-size:16px;
float:right;
padding:0;
}

#faq2 {
width:675px;
heigth:100%;
padding-left:50px;
}

#faq2 a {
color:#095AA5;
font-size:12px;
font-weight:bold;
font-style:normal;
text-decoration:underline;
}

#faq2 a:visited {
color:#095AA5;
font-size:12px;
font-style:normal;
text-decoration:underline;
}

#faq2 a:hover {
text-decoration: underline;
background-color: #fff;
color: #8FCA18; 
font-size: 12px;
}

#flash {
width:325px;
height:168px;
float:left;
background:#00668E;
}

#top {
width:675px;
height:91px;
float:right;
background:#00668E;
}

#bottom {
width:675px;
height:50px;
float:right;
}

#frame2 {
width:832px;
background-color:#FFFFFF;
min-height:516px;
margin-right:auto;
margin-left:94px;
margin-top:0px;
text-align:left;
padding:0;
}

#big_frame {
width:832px;
background-color:#FFFFFF;
margin-right:auto;
margin-left:auto;
margin-top:0px;
text-align:left;
padding:0;
}

#padding {
width:730px;
background-color:#FFFFFF;
margin-right:50px;
margin-left:50px;
margin-top:0px;
text-align:left;
padding:0;
}

#frame22 {
width:1000px;
min-height:516px;
margin-right:74px;
margin-left:auto;
margin-top:0px;
text-align:left;
padding:0;
}

#frame3 {
width:851px;
background-color:#FFFFFF;
min-height:516px;
margin-right:auto;
margin-left:auto;
padding-left:0px;
margin-top:0px;
text-align:left;
}

#sandwitch {
width:400px;
height:340px;
margin-right:auto;
margin-left:auto;
padding-left:0px;
margin-top:0px;
text-align:left;
float:right;
}



#sandwitch2 {
width:400px;
height:74px;
margin-right:auto;
margin-left:auto;
padding-left:0px;
margin-top:0px;
text-align:left;
float:right;
}

#icecream {
width:422px;
height:213px;
margin-right:auto;
margin-left:auto;
padding-left:0px;
margin-top:0px;
text-align:left;
float:left;
}

#icecream a {
text-decoration:none;
color:#BA1521;
}



#slideshow {
width:422px;
height:194px;
margin-right:auto;
margin-left:auto;
padding-left:0px;
margin-top:0px;
text-align:left;
float:left;
}

#producttext {
width:422px;
height:213px;
font-family:"Times New Roman", Times, serif;
font-size:medium;
line-height:normal;
margin-right:auto;
word-spacing:normal;
text-align:center;
margin-left:auto;
padding-left:0px;
margin-top:0px;
text-align:left;
float:right;
}

#flashmovie {
width:500px;
height:412px;
background-color:#6c0033;
font-size:medium;
line-height:normal;
margin-right:auto;
word-spacing:normal;
text-align:center;
margin-left:auto;
padding-left:0px;
margin-top:0px;
text-align:left;
float:left;
}

#iframe {
float: left;
background-color:#6c0032;
height: 362px;
width: 825px;
vertical-align:middle;
}

#iframepadding {
float: left;
background-color:#6c0032;
height: 362px;
width: 826px;
vertical-align:middle;
padding-left:25px;
padding-top:25px;
padding-right:0px;
padding-bottom:25px;
}


.v-outer {
display: table;
#position: relative;
overflow: hidden;
height: 100%;
width: 100%;
}

.v-middle {
display: table-cell;
#position: absolute;
#top: 50%;
vertical-align: middle;
}

.v-inner {
#position: relative;
#top: -50%;
}


#testimonials {
color: #6c0033;
font-size: 20px;
font-family:  "Georgia", "Times New Roman", Times, serif;
margin: 0pt;

}

#bottomnav {
background-color:#FFFFFF;
padding-top:0px;
width:832px;
margin-left:auto;
float:none;
font-weight:bold;
height:27px;
text-align:center;
color:#7BACDC;
}



#bottomnav a {
text-decoration:none;
display:inline;
float:none;
height:15px;
position:relative;
padding-top:5px;
padding-right:24px;
padding-left:24px;
color:#7BACDC;
}

#bottomnav a:hover {
text-decoration: none;
background-repeat:repeat-x;
color:#000000;
}

#bottomnav ul {
margin:0 0 0 0px;
padding:0;
}

#bottomnav li {
display:inline;
}
















	
#nav {
	text-align:left;
}
	
#nav ul{
	margin:0;
	padding:0;
	list-style: none;
	}
#nav li {
float:right;
	background:#ffffff; /* This is to preload the hover state */
	background-repeat: no-repeat; 
	margin-top: 33px; /* For IE5 Mac only - reset to 0 below */
	margin-bottom: 65px; /* For IE5 Mac only - reset to 0 below */
		font-size:20px;
	}
	
#nav a { /* if background is on a:link IE6 won't display properly  */
	background:#ffffff; /*can be just background */
	background-repeat: no-repeat; /* height and or width in here will stop main image change in IE5 */
	padding-top: 32px; /* For IE5 Mac only - reset to 0 below */
	padding-left: 5px; 
	padding-bottom: 32px; /* For IE5 Mac only - reset to 0 below */
	padding-right: 32px; /* For IE5 Mac only - reset to 10 below */
	color: black;
	font-family: "Arial", sans-serif;
	color:#a59c94;
	font-size:20px;
	font-weight:bold;
	text-align: center;
	text-decoration:none;
	/*height or width in here will stop main image change in IE5 Win
	luckily, line-height is OK! - hidden from IE5 Mac see below
	a must be block to display background-image in IE Win
	 - but also needs to be hidden from IE5 Mac see below */
	}

#nav a/*Comment hack to hide this from IE5 - needed to extend link over button image in IE6 */{
	height:40px;
	}
 
#nav a:hover {
	background: url(images/hack.jpg) no-repeat; /* no background-x styles work here */
	color: black; 
	text-decoration:none;
	}
#nav a img {
	width: 272px; /* IE5 Win can't dynamically change size - don't use 0px to hide */
	height: 437px;
	position: absolute;
	top: 220px;
	left: 30%;
	border:none;
	visibility: hidden;
	}

 /* commented backslash hack v2 - hide rules from IE5 Mac \*/
#nav a {
	padding-top: 0; 
	padding-bottom: 0;
	padding-right: 0px; 
	display: inline;
	line-height: 30px;
	}	
#nav li {
	margin-top:0;
	margin-bottom:0;
	width: 285px;
	}
/* end hack */


#nav a:hover img {
	visibility:visible;
	}






#nav2 {
	text-align:left;
}
	
#nav2 ul{
	margin:0;
	padding:0;
	list-style: none;
	}
#nav2 li {
float:right;
	background:#ffffff; /* This is to preload the hover state */
	background-repeat: no-repeat; 
	margin-top: 33px; /* For IE5 Mac only - reset to 0 below */
	margin-bottom: 65px; /* For IE5 Mac only - reset to 0 below */
	}
	
#nav2 a { /* if background is on a:link IE6 won't display properly  */
	background:#ffffff; /*can be just background */
	background-repeat: no-repeat; /* height and or width in here will stop main image change in IE5 */
	padding-top: 32px; /* For IE5 Mac only - reset to 0 below */
	padding-left: 5px; 
	padding-bottom: 32px; /* For IE5 Mac only - reset to 0 below */
	padding-right: 32px; /* For IE5 Mac only - reset to 10 below */
	color: black;
	font-family: "Arial", sans-serif;
	color:#a59c94;
	font-size:20px;
	font-weight:bold;
	text-align: center;
	text-decoration:none;
	/*height or width in here will stop main image change in IE5 Win
	luckily, line-height is OK! - hidden from IE5 Mac see below
	a must be block to display background-image in IE Win
	 - but also needs to be hidden from IE5 Mac see below */
	}

#nav2 a/*Comment hack to hide this from IE5 - needed to extend link over button image in IE6 */{
	height:40px;
	}
 
#nav2 a:hover {
	background: url("images/hack.jpg") no-repeat; /* no background-x styles work here */
	color: black; 
	text-decoration:none;
	}
#nav2 a img {
	width: 300px; /* IE5 Win can't dynamically change size - don't use 0px to hide */
	height: 219px;
	position: absolute;
	top: 280px;
	left: 30%;
	border:none;
	visibility: hidden;
	}

 /* commented backslash hack v2 - hide rules from IE5 Mac \*/
#nav2 a {
	padding-top: 0; 
	padding-bottom: 0;
	padding-right: 0px; 
	display: inline;
	line-height: 30px;
	}	
#nav2 li {
	margin-top:0;
	margin-bottom:0;
	width: 285px;
	}
/* end hack */


#nav2 a:hover img {
	visibility:visible;
	}
	
	
#imageleft {
float:left;

}


a.lmp {
    display: block;
	width: 351px;
	height: 161px;
    text-decoration: none;
    background: url('images/13590_Ivy-Lea_home_new2_ro_top.jpg');
}

a.lmp:hover {
    background-position: -351px 0;
}

a.rollover1 {
    display: block;
	width: 243px;
	height: 248px;
    text-decoration: none;
    background: url('images/menu_foodb.jpg');
}

a.rollover1:hover {
    background-position: -243px 0;
}

a.rollover2 {
    display: block;
	width: 243px;
	height: 248px;
    text-decoration: none;
    background: url('images/menu_dessertb.jpg');
}

a.rollover2:hover {
    background-position: -244px 0;
}

a.rollover3 {
    display: block;
	width: 243px;
	height: 248px;
    text-decoration: none;
    background: url('images/menu_cateringb.jpg');
}

a.rollover3:hover {
    background-position: -243px 0;
}

#hand	{
	height: 385px;
	width: 261px;
	margin-top: -198px;
	margin-bottom: 0px;
	position: relative;
	visibility:visibile;
	}
	
#coupon	{
	height:186px;
	width:495px;
	position: relative;
	margin-top: -195px;
	left: 265px;
	margin-bottom: 0px;
	}
	
a.rollover4 {
    display: block;
	width: 140px;
	height: 28px;
    text-decoration: none;
    background: url('images/bistro_rbi.gif');
}

a.rollover4:hover {
    background-position: -140px 0;
}

a.rollover5 {
    display: block;
	width: 140px;
	height: 28px;
    text-decoration: none;
    background: url('images/bistro_grb.gif');
}

a.rollover5:hover {
    background-position: -140px 0;
}

a.rollover6 {
    display: block;
	width: 140px;
	height: 28px;
    text-decoration: none;
    background: url('images/bistro_cig.gif');
}

a.rollover6:hover {
    background-position: -140px 0;
}

#bistrologo	{
	float: right;
}

#bistromenu	{
	float:left;
	margin-top: 55px;
	}
	
#bistrosandwich	{
	position: absolute;
	width: 345px;
	margin-top: 45px;
	margin-left: 85px;
	}
	
#flavoroftheday	{
	font-size:14px;
	width: 220px;
	float:right;
	}
	
#flavoroftheday a {
	color:#00668E;
	}
	
#flavoroftheday a:hover {
	text-decoration:none;
	color:#8fca18;
	}
	
#schoolspirit {
width:365px;
height:335px;
float:left;
}

#schoolspiritright {
width:355px;
height:362px;
float:right;
}

#redletter {
width:30px;
height:30px;
font-size:28px;
color:red;
float:left;
padding-left:10px;
}


/* ================================================================ 
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/flyout_4level.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
.menu {
height:412px;
font-size:90%;
margin:0px 0px 0px 0px; /* this page only */
width:173px;
font-size:12px;
float:right;
padding-right:0px;
background-color:#6c0033;
}

/* remove all the bullets, borders and padding from the default list styling */
.menu ul {
position:relative;
z-index:500;
padding:0;
margin:0;
list-style-type:none;
width:120px;
padding-left:0px;
padding-right:0px;
}
/* style the list items */
.menu li {
background:#6c0033;
height:26px;
text-align:right;
/* for IE7 */
float:left;

margin:0px;
padding:0px;
padding-top:0px;
padding-bottom:3px;
}
.menu li.sub {background:#6c0033 no-repeat right center;} 

/* get rid of the table */
.menu table {position:absolute; border-collapse:collapse; top:0; left:0; z-index:100; font-size:1em;}

/* style the links */
.menu a, .menu a:visited {
display:block; 
text-decoration:none;
height:25px;
line-height:25px;
width:120px;
color:#ffffff;
text-indent:5px;
border:0px solid #fff;
border-width:0 0px 0px 0px;
font-size:12px;
font-weight:bold;
font-style:normal;
}

.menu a:hover {
text-decoration: none;
background-color: #6c0033;
color: #000000; 
font-size: 16px;
}


a.hassle {
display: block;
	width: 572px;
	height: 67px;
    text-decoration: none;
    background: url('images/hasslefree_ro.jpg');
}

a.hassle:hover {
background-position: -572px 0;
}

a.header_ro {
float:right;
display: block;
	width: 328px;
	height: 222px;
    text-decoration: none;
    background: url('images/_layered_header_ro.jpg');
}

a.header_ro:hover {
background-position: -328px 0;
}

#hometext {
width:351px;
height:412px;
background-color:#6c0033;
font-size:medium;
line-height:normal;
margin-right:auto;
word-spacing:normal;
text-align:center;
margin-left:auto;
padding-left:0px;
margin-top:0px;
text-align:left;
float:left;
}




/* hack for IE5.5 */
* html .menu a, * html .menu a:visited, * html .menu li {width:133px; w\idth:133px; margin:0px; padding:0px; padding-top:0px; padding-bottom:0px; padding-right:20px; line-height:12px; font-size:12px;}
/* style the link hover */
* html .menu a:hover {color:#efa; background:#6c0033; position:relative; margin:0px; padding:0px; }

* p {vertical-align: top; }

.menu li:hover {position:relative;}

/* For accessibility of the top level menu when tabbing */
.menu a:active, .menu a:focus {color:#efa; background:#6c0033;}

/* retain the hover colors for each sublevel IE7 and Firefox etc */
.menu li:hover > a {color:#efa; background:#6c0033; margin:0px; padding:0px; }
 
/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu li ul {
visibility:hidden;
position:absolute;
margin:0px; padding:0px; 
top:0px;
/* set up the overlap (minus the overrun) */
left:100px;
/* set up the overrun area */
padding:2px;
/* this is for IE to make it interpret the overrrun padding */
background:transparent;
}

/* for browsers that understand this is all you need for the flyouts */
.menu li:hover > ul {visibility:visible; margin:0px; padding:0px; }


/* for IE5.5 and IE6 you need to style each level hover */

/* keep the third level+ hidden when you hover on first level link */
.menu ul a:hover ul ul{
visibility:hidden;
}
/* keep the fourth level+ hidden when you hover on second level link */
.menu ul a:hover ul a:hover ul ul{
visibility:hidden;
}
/* keep the fifth level hidden when you hover on third level link */
.menu ul a:hover ul a:hover ul a:hover ul ul{
visibility:hidden;
}

/* make the second level visible when hover on first level link */
.menu ul a:hover ul {
visibility:visible;
}
/* make the third level visible when you hover over second level link */
.menu ul a:hover ul a:hover ul{ 
visibility:visible;
}
/* make the fourth level visible when you hover over third level link */
.menu ul a:hover ul a:hover ul a:hover ul { 
visibility:visible;
}
/* make the fifth level visible when you hover over fourth level link */
.menu ul a:hover ul a:hover ul a:hover ul a:hover ul { 
visibility:visible;
}