.bar-menu {
    width: 150px;
}
.test
{
   font-weight: bold;
   font-weight: normal;
}
.bar-menu .box1 {
    background-color: #fbe708 ; /* box geschlossen */
    color: black ;
    font-weight: normal;
    font-size: 12px;
    font-family: verdana;
    padding: 4px 8px;
    border-width: 1px;
    border-color: #EBEBEB ; 
    border-style: solid solid solid solid ;
    cursor: default;
    position: relative;
}
.bar-menu .box1-hover {
    background-color: #fbed51; /* wenn mouse over box */
    color: black;
    font-weight: normal;
    font-size: 12px;
    font-family: verdana;
    padding: 4px 8px;
    border-width: 1px;
    border-color: #EBEBEB ; 
    border-style: solid solid solid solid;
    cursor: default;
    position: relative;
}
.bar-menu .box1-open {
    background-color: #FBED51; /* wenn box offen */
    color: black;
    font-weight: normal;
    font-size: 12px;
    font-family: verdana;
    padding: 4px 8px;
    border-width: 1px;
    border-color: #EBEBEB ; 
    border-style: solid solid solid solid;
    cursor: default;
    position: relative;
}
.bar-menu .box1-open-hover {
    background-color: #FBED51; /* wenn box offen */
    color: black;
    font-weight: normal;    
    font-size: 12px;
    font-family: verdana;
    padding: 4px 8px;
    border-width: 1px;
    border-color: #EBEBEB ; 
    border-style: solid solid solid solid;
    cursor: default;
    position: relative;
}
.bar-menu .box1 img, .bar-menu .box1-hover img, .bar-menu .box1-open img, .bar-menu .box1-open-hover img {
    position: absolute;
    top: 6px;
    right: 6px;
}
.bar-menu .section {
    background-color: #FBED51; /* hintergrund, box2 */
    font-family: verdana;
    font-size: 12px;
    line-height: 15px;
    padding: 5px 5px 6px 5px;
    border-width: 1px;
    border-color: #EBEBEB ;   /*  box2 */
    border-style: solid solid solid solid;
    display: none;
}
.bar-menu .section a {
    color: black; /* linkfarbe wenn box2 offen */
    text-decoration: none;
    white-space: nowrap;
}
.bar-menu .section a:hover {
    color: blue; /* linkfarbe wenn box2 offen, mouse over */
    text-decoration: none;
    white-space: nowrap;
    font-family: verdana;
    font-size: 12px;
}
.bar-menu .box2 {
    font-family: verdana;
    font-size: 12px;
}
.bar-menu .box2-hover {
    background: white; /* hintergrund wenn mouse over */
    font-family: verdana;
    font-size: 12px;
}
.bar-menu .section .active,
.bar-menu .section .active:hover {
    color: black; /* schriftfarbe wenn box2 aktiv */
}