/* 
Description: Navigation (menu design and logic) stylesheet for Emjoi Microsite
Author: James Diacono (jd@thefarmdigital.com.au)
Date created: 19th of January, 2010
*/
    
#logo {
    margin-top:20px;
    display:block;
    width:152px;
    height:69px;
    background:url(/Content/Images/Navigation/logo.png) no-repeat;
    position:relative;
    z-index:6;
    float:left;
    }
    
/*
Main menu across top
*/
    
#menu {
    position:relative;
    left:-20px;
    z-index:5;
    float:left;
    }
    
#menu {
    position:relative;
    z-index:5;
    float:left;
    }
    
#menu li {
    height:109px;
    float:left;
    }
    
#menu li.first {
    background:url(/Content/Images/Navigation/glow_left.png) no-repeat;
    padding-left:40px;
    }
    
#menu li.last {
    background:url(/Content/Images/Navigation/glow_right.png) no-repeat top right;
    padding-right:40px;
    }
    
#menu .inner {
    height:109px;
    padding-top:20px;
    background:url(/Content/Images/Navigation/glow_tile.png) repeat-x;
    float:left;
    position:relative;
    }
    
#menu a {
    display:block;
    background:url(/Content/Images/Navigation/gradient-overlay_white.png) repeat-x;
    float:left;
    height:41px;
    padding:28px 15px 0;
    text-decoration:none;
    background-color:#d8d8d8;
    }
    
#menu li.first a {margin-left:-20px;}
#menu li.last a {margin-right:-20px;}
    
#menu .divider {
    height:69px;
    width:2px;
    background:url(/Content/Images/Navigation/divider_vertical.png) no-repeat;
    position:absolute;
    z-index:7;
    top:20px;
    right:0;
    }
    
#menu li.last .divider {display:none;}

#menu span {
    font-size:16px;
    color:black;
    float:left;
    }

/*
Submenu which appears below main menu
*/

#subMenuWrapper {
    width:970px;
    height:184px;
    *height:200px;
    padding-bottom:25px;
    background:url(/Content/Images/Navigation/submenu_bottom_shadow.png) no-repeat bottom left;
    display:none;
    }
    
#subMenuWrapper .scrollerControl
{
    position:absolute;
    top:0;
    display:block;
    width:40px;
    bottom:30px;
    _height:200px;
    z-index:2;
    background:#d9d8d9 url(/Content/Images/Navigation/gradient-overlay_white_submenu.png) repeat-x bottom left;
}
    
#subMenuWrapper .scrollerControl.prev
{
    left:0;
}
    
#subMenuWrapper .scrollerControl.next
{
    right:0;
}
    
#subMenuWrapper .scrollerControl .scrollerArrow
{
    position:absolute;
    display:block;
    top:84px;
    width:26px;
    height:26px;
    background:url(/Content/Images/Navigation/slider_buttons.png) no-repeat;
    text-indent:-999em;
}

#subMenuWrapper .scrollerControl.prev .scrollerArrow {background-position:0 -27px;left:7px;}
#subMenuWrapper .scrollerControl.prev:hover .scrollerArrow {background-position:0 0;}
#subMenuWrapper .scrollerControl.next .scrollerArrow {background-position:-26px -27px;right:7px;}
#subMenuWrapper .scrollerControl.next:hover .scrollerArrow {background-position:-26px 0;}

#subMenuFooter {
    display:none;
    }
    
#subMenuWrapper .scrollable 
{
    position:absolute;
    left:40px;
    width:890px;
    top:0;
    overflow: hidden;
    z-index:3;
}
    
#subMenu 
{
    position:relative;
    top:0;
    left:0;
    width:9999em;
}

#subMenu li {
    float:left;
    margin-bottom:-1px;
    *width:180px;
    }

#subMenu li div.container {
    text-align:center;
    padding:13px 10px 0;
    background:#d9d8d9 url(/Content/Images/Navigation/gradient-overlay_white_submenu.png) repeat-x bottom left;
    float:left;
    }
    
#subMenu li a.linkWrapper {
    text-decoration:none;
    color:Black;
    display:block;
    }

#subMenu li img {
    margin-bottom:10px;
    }

#subMenu li span {
    display:block;
    margin-bottom:5px;
    }

#subMenu li .name {
    font-size:0.9em;
    }

#subMenu li .code {
    font-size:0.9em;
    }
    
#subMenu li .price {
    font-size: 1.1em;
    }
    
#subMenu li .price,
#subMenu li label {
    color:#777;
    }

#subMenu li input {
    margin-bottom:0;
    margin:0 auto 3px;
    display:block;
    }

#subMenu li label {
    padding-top:3px;
    font-size:0.8em;
    text-transform:lowercase;
    display:block;
    }

/* Hide the compare function unless on the product page */
#subMenu li input,
#subMenu li label {
    display:none;
    }