div.dropdown {
    color: black;
    margin: 3px -22px 0 0;
    width: 143px;
    position: relative;
    height: 17px;
    text-align:left;
    display: inline-block;
}
span.dropdown {
    margin-left: 5px;
}
div.submenu
{
    background: #fff;
    position: absolute;
    width: 150px;
    z-index: 100;
    display: none;
    margin-left: 15px;
    padding: 40px 0 5px;
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
}

.dropdown  li a {           
    color: #555555;
    display: block;
    padding: 6px 10px;
    font-size: 1.1em;
    cursor: pointer;
    text-decoration:none;
}

.dropdown li a:hover{
    background:#dedede;
    /*color: #FFFFFF;*/
    text-decoration: none;
    
}

a.dropdown-head{
    position: absolute;
    z-index: 110;
    /*
    display: block;
    padding: 12px 0 0 15px;
    margin: -8px 0 0 -10px;
    */
    height:  28px;
    width : 120px;
    cursor: pointer;
    text-decoration: none;
    color: #505151;
}
    
a:hover.dropdown-head {
    /*text-decoration: underline;*/
    color: #b15926;
}
    
.root
{
    list-style:none;
    margin:0px;
    padding:0px;
    font-size: 11px;
    padding: 11px 0 0 0px;
    border-top:1px solid #dedede;
}

/* if we are showing a label only, no dropdown, give it some padding. */
span.dropdown-label-only {
    padding-left: 20px;
}

.chrome-macos {
    margin-top: -7px !important;
}