/*
 * Suckerfish menu adapted from Litejazz theme:
 * https://www.drupal.org/project/litejazz
 *
 * Responsive adaptation according to:
 * http://medialoot.com/blog/how-to-create-a-responsive-navigation-menu-using-only-css/
 *
 * CSS-only menu icon from:
 * http://www.alwaystwisted.com/post.php?s=2012-05-12-create-a-pure-css-menu-button
 */

#suckerfishmenu	.block
{
    padding-bottom: 0;
}

#suckerfishmenu	.block, #suckerfishmenu	.box
{
    padding: 0;
}

#suckerfishmenu	h2
{
    display: none;
}

#suckerfishmenu	
{
    line-height: 40px;
    margin: 0 -30px;
    padding: 0 30px;
    background: #00843d;
}

/* Top-level menu */

#suckerfishmenu	 ul.menu
{
    padding: 0;
    list-style: none;
    z-index: 3;
    display: table;
    width: 100%;
    text-align: center;
} 

#suckerfishmenu	 a
{
    display: block;
    vertical-align: bottom;
    padding: 0px 10px; /* padding between menu elements */
    background: #00843d;
    color: #ffffff;
    text-decoration: none;
}

#suckerfishmenu	li:active a,
#suckerfishmenu	li:hover a
{
    background: #ffffff;
    color: #00843d;
    text-decoration: none;
}

#suckerfishmenu	 li
{
    display: table-cell;
    margin: 0;
    padding: 0;
    height: 1%;
    position: relative;
}


/* Second-level menu */

#suckerfishmenu	 ul.menu ul
{
    padding: 0;
    margin-left: -1px;
    list-style: none;
    border: 1px solid #00843d;
    border-top-style: none;
    text-align: left;
}

#suckerfishmenu	 ul.menu li ul
{
    position: absolute;
    width: auto;
    left: -999em; /* to hide menus because display: none isn't read by screen readers */
}


#suckerfishmenu	 ul.menu li li
{
    float: left;
    width: auto;
    min-width: 100%;
    white-space: nowrap;
}

#suckerfishmenu	 ul.menu li ul a
{
    width: auto;
    background: #ffffff;
    color: #00843d;
}

#suckerfishmenu	 ul.menu li ul a:active,
#suckerfishmenu	 ul.menu li ul a:hover
{
    color: #3c5e60;
    background: #ffffff;
    text-decoration: none;
}


/* Third-level menu (do not show) */

#suckerfishmenu	 ul.menu li:hover ul, #suckerfishmenu	 ul.menu li li:hover ul, #suckerfishmenu	 ul.menu li li li:hover ul, #suckerfishmenu	 ul.menu li.sfhover ul, #suckerfishmenu	 ul.menu li li.sfhover ul, #suckerfishmenu	 ul.menu li li li.sfhover ul
{
    left: auto;
}