/* CSS Document Navigation Document for Wholesale Flowers */
/* v1.0 
Matthew Goodrich - Developer 
*/

/* Americommerce fixes are in the embedded style sheet for the global header ( main, nav css selector fixes ) */


/* toplinks navigation */
ul#toplinks { margin: 5px 0px;}
  #toplinks li { list-style: none; display: inline; padding: 2px 5px 2px 6px; background: url(../images/bg_nav_divider.gif) right no-repeat; }
    #toplinks li.first { padding-left: 0px;}
    #toplinks li.last { background: none; }
  #toplinks li a { font-weight: normal; /* .2 sizes larger for AmeriCommerce */ font-size: .9em; }

/* global navigation settings for homepage */
#home #nav { font-family: Arial, Helvetica, sans-serif; font-size: 16px; font-weight: bold; }
#home #nav ul li { font-size: 1em;}

#home { float: left; width: 985px; margin-left: 15px; }
/* main page side nav list for categories and dd subcategories */
#home #nav_holder { 
	float: left; 
	width: 190px; 
	display: inline; /* IE double margin fix */
	z-index: 25;
}
#home #nav {
  position: relative;
}
#home #nav li { 
	list-style: none;
	height: 80px;
	width: 175px;
	margin: 4px 0;
	text-align: left;
	position: relative;
}

#home #nav li.containers { background: url(../images/cat_containers.jpg) top no-repeat;}
  #home #nav li.containers a { }
  #home #nav li.containers a:hover, #home #nav li.containers:hover, #home #nav li#containers_dd.over { background: url(../images/cat_containers_hover.jpg) top no-repeat; }

#home #nav li.event_lighting { background: url(../images/cat_lighting.jpg) top no-repeat; }
  #home #nav li.event_lighting a { }
  #home #nav li.event_lighting a:hover, #home #nav li.event_lighting:hover, 
#home #nav li#event_lighting_dd.over { background: url(../images/cat_lighting_hover.jpg) top no-repeat; }


#home #nav li.supplies { background: url(../images/cat_supplies.jpg) top no-repeat; }
  #home #nav li.supplies a { }
  #home #nav li.supplies a:hover, #home #nav li.supplies:hover,  
#home #nav li#supplies_dd.over { background: url(../images/cat_supplies_hover.jpg) top no-repeat; }


#home #nav li.holders { background: url(../images/cat_holders.jpg) top no-repeat; }
  #home #nav li.holders a { }
  #home #nav li.holders a:hover, #home #nav li.holders:hover,  
#home #nav li#holders_dd.over { background: url(../images/cat_holders_hover.jpg) top no-repeat; }


#home #nav li.floral { background: url(../images/cat_floral.jpg) top no-repeat; }
  #home #nav li.floral a { }
  #home #nav li.floral a:hover, #home #nav li.floral:hover,  
#home #nav li#floral_dd.over { background: url(../images/cat_floral_hover.jpg) top no-repeat; }


#home #nav li.flowers { background: url(../images/cat_flowers.jpg) top no-repeat; }
  #home #nav li.flowers a { }
  #home #nav li.flowers a:hover, #home #nav li.flowers:hover,  
#home #nav li#flowers_dd.over { background: url(../images/cat_flowers_hover.jpg) top no-repeat; }


#home #nav li.weddings { background: url(../images/cat_weddings.jpg) top no-repeat; }
  #home #nav li.weddings a { }
  #home #nav li.weddings a:hover, #home #nav li.weddings:hover,  
#home #nav li#weddings_dd.over { background: url(../images/cat_weddings_hover.jpg) top no-repeat; }

  
  #home #nav li a {
	padding: 28px 10px; 
	display: block;
	height: 20px;
	}
  #home #nav li a:hover { text-decoration: none; }
  
/* hide the text in the list items so the image can be the focus
Note: the text still shows for browsers that don't support CSS and search engines */  
#home ul#nav li a span { display: none;}

/* dd menu for left aligned navigation */
#home #nav li ul { display: none;}

  #home #nav li ul li { height: 1.1em; line-height: 1.1em; }
  #home #nav li:hover ul {
  	display: block; 
    position: absolute;
	top: 0px; 
	left: 175px;
	background: url(../images/dd_bkgd.png);
	z-index: 25;
	min-height: 100px;
	padding-bottom: 5px;
  }
  #home #nav li.containers ul { width: 150px; }
  #home #nav li.event_lighting ul { width: 235px; }
  #home #nav li.supplies ul { width: 320px; }
  #home #nav li.floral ul { width: 275px; }
  #home #nav li.holders ul, #home #nav li.weddings ul { width: 275px; }
  #home #nav li.flowers ul { width: 200px; }
  
  #home #nav li#containers ul li a, #home #nav li#containers_dd ul li a:hover,
  #home #nav li#event_lighting_dd ul li a, #home #nav li#event_lighting_dd ul li a:hover,
  #home #nav li#supplies_dd ul li a, #home #nav li#supplies_dd ul li a:hover,
  #home #nav li#holders_dd ul li a, #home #nav li#holders_dd ul li a:hover,
  #home #nav li#floral_dd ul li a, #home #nav li#floral_dd ul li a:hover,
  #home #nav li#flowers_dd ul li a, #home #nav li#flowers_dd ul li a:hover,
  #home #nav li#weddings_dd ul li a, #home #nav li#weddings_dd ul li a:hover { height: 1em; background-image: none; border: none; }
  
  #home #nav li ul li a, #home #nav li ul li a:hover { 
  	/* 1 size larger for AmeriCommerce - font-size: 1.2em; 2nd level list items */ 
	font-size: 1.1em; 
	padding: 5px 0px 0px 8px; 
	color: #fff; 
	text-decoration: none; 
	}
	
  #home #nav li ul li a:hover { color: #d5c6a9; }
  
  /* 3rd level nav items */
  /* hide 3rd level on first level hover */
  #home #nav li ul ul, #home #nav li:hover ul ul { display: none;}
  
  /* show 3rd level on 2nd level hover */
  #home #nav li li:hover ul {
    font-size: .9em;
    display: block;
	width: 255px;
	position: absolute;
	top: 0px;
	
	/***** AC left 135px *****/
	/***** WFS left 150px ****/
	
	background: url(../images/dd_bkgd-3rd.png);	
	left: 150px; 
	/* left: 135px; */
	z-index: 35;
	padding-bottom: 5px;
  }  
    
  /**** adjust left position for wider elements ****/
  #home #nav li.supplies li:hover ul { left: 175px; }
  
/* end 3rd level nav items */


/* inside pages navigation bar and dd subcategories */
/* global navigation settings */
#inside nav_holder { 
	float: left;
	width: 985px;
	height: 55px;
	display: inline;
}
#inside #nav { 
  background: url(../images/nav_bkgd.png) top left no-repeat;
  padding: 0 0 10px 0;
  position: relative;
  z-index: 55;
	/* for Americommerce 'float' error
	padding-left: 45px;  */
  }
  #inside #nav li { 
  	display: inline; 
	line-height: 50px;
	font-size: 1.1em;
	position: relative;
	}
  #inside #nav li a {
  	padding: 10px 8px;
	text-decoration: none;
	/* font-size: .75em; - Use px for navigation reset */
	font-size: 12px;
	font-weight: bold;
	}
  #inside #nav li a:hover { }

#inside #nav li ul { display: none; }
#inside #nav li:hover ul { 
  position: absolute;
  float: none;
  top: 26px; 
  left: -5px; 
  display: block;
  background: url(../images/dd_bkgd.png);
  text-align: left;
  width: 125px;
  padding-bottom: 5px;
  }
  #inside #nav li.containers:hover ul { width: 155px; }
  #inside #nav li.event_lighting:hover ul { width: 235px; }
  #inside #nav li.supplies:hover ul { width: 295px;}
  #inside #nav li.floral:hover ul { width: 255px;}
  #inside #nav li.holders:hover ul { width: 280px;}
  #inside #nav li.weddings:hover ul { width: 240px;}
  #inside #nav li.flowers:hover ul { width: 200px;}
  
  
#inside #nav li ul li { line-height: 10px; }
#inside #nav li ul li a { 
  display: block;
  margin-left: 3px; 
  margin-bottom: 0px;
  padding-top: 4px;
  padding-bottom: 0px;
  font-size: .9em;
	/* for Americommerce 'text-size' error
	font-size: 1.1em;  */
  }
  
/* 3rd level nav li items */

  /* hide 3rd level on first level hover */
  #inside #nav li ul ul, #inside #nav li:hover ul ul { display: none;}
  
  /* adjust width for child ul */  
  #inside #nav li.containers ul:hover ul { width: 215px; }  
  
  /* show 3rd level on 2nd level hover */
  #inside #nav li li:hover ul {
    font-size: .9em;
    display: block;
	background: url(../images/dd_bkgd-3rd.png);
	width: 355px;
	position: absolute;
	top: -13px; 
	left: 155px;
	z-index: 35;
	padding-bottom: 5px;
  }
  
  /**** adjust left position for wider elements ****/
  #inside #nav li.supplies li:hover ul { left: 175px; }
  
/* end 3rd level nav items for inside nav */

div.footernav {  width: 100%; text-align: center; margin: 15px auto 10px auto;}

div.footer .footernav ul { margin-top: 5px;}
  div.footer .footernav ul li {
    list-style: none;
    display: inline;
    margin: 5px;
    padding: 3px 12px 3px 3px;
    background: url(../images/bg_nav_divider.gif) right no-repeat;
  }
  div.footer .footernav ul li.last { background: none;}