* {
    margin:  0;
    padding: 0;
  /*  box-sizing: border-box; */

}

body {
    font-family: sans-serif;
    direction: rtl;
    margin: 15px;
  /*  font-weight:bold; */
}

a {
    text-decoration: none;
}

ul,
ol {
    list-style: none;
}

#navbar {
    /*  background: rgb(0,100,0);    */
    text-align: center;
}

#navbar ul {
    background-color: #B7CC12;


    display: inline-flex;
    /* nicht ganze Breite des Browsers */
    list-style: none;
    /*  ??  */
}

#navbar ul li {
    display: inline-block;
    position: relative;
}

#navbar ul li a {
    color: #FFFFFF;
    font-size: 13px;
    font-family: sans-serif;


    display: block;
    padding: 15px 18px;
    transition: all 0.5s;
}

#navbar ul li a:hover {
    color: #FFFFFF;

    background-color: #E1E859;
    /*  */
    border-radius: 3px;
    /*  */
}
.active, #navbar ul li:hover {
    background-color: #f0df83;
    border-radius: 3px;
}

#navbar ul ul {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
}

#navbar ul ul li a {
    width: 130px;
    text-align: center;
    border-top: 1px solid #FFFFFF;
}

#navbar ul ul li a:hover {
    background-color: #353CC0;
    border: 1px solid #353CC0;
    color: #B7CC12;
}

#navbar ul li:hover>ul {
    display: block;
}

#navbar ul ul ul {
    position: absolute;
    top: 0;
    right: 100%;
}

#navbar ul ul ul li a {
    border: 1px solid #FFFFFF;
}