/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {/*margin: 0;padding: 0;*/list-style: none;}
.sf-menu li {position: relative;}
.sf-menu ul {position: absolute;display: none;top: 20px;left: 3px;z-index: 99;}
.sf-menu > li {float: left;}
.sf-menu li:hover > ul,.sf-menu li.sfHover > ul {display: block;}
.sf-menu a {display: block;position: relative;}
.sf-menu ul ul {top: 0;left: 100%;}

/*** SKIN ***/
.sf-menu {
    float: left;
    margin-bottom: 1em;
}
.sf-menu ul {
    /*box-shadow: 2px 2px 6px rgba(0,0,0,.2);*/
    font-size: 14px;
    background: #ffdd33;
    min-width: 50px;  /* allow long menu items to determine submenu width */
    *width: 12em; /* no auto sub width for IE7, see white-space comment below */
}
.sf-menu a {
    /* border-left: 1px solid #fff; */
    /* border-top: 1px solid #dFeEFF; /* fallback colour must use full shorthand */
    /* border-top: 1px solid rgba(255,255,255,.5); */
    padding: 1px 5px 1px;
    text-decoration: none;
    zoom: 1; /* IE7 */
}
.sf-menu a {
    color: #000;
}
.sf-menu li {
    /*background: black;*/
    white-space: nowrap; /* no need for Supersubs plugin */
     *white-space: normal; /* ...unless you support IE7 (let it wrap) */
    -webkit-transition: background .2s;
    transition: background .2s;
    border-radius: 4px;
}
.sf-menu ul li {
    /*background: #ffdd33;*/
    width:100%;
    border-radius:0;
}

.sf-menu ul li:hover,
.sf-menu ul li.sfHover {
    background: #ffee99;
    /* only transition out, not in */
    -webkit-transition: none;
    transition: none;
}

@media (max-width:743px){
    .sf-menu ul {left: auto;right:3px;}
}

@media (max-width:743px){
    .sf-menu li {white-space: normal;}
}