.menu {
  padding: 0px;
  margin: 0px;
  display: flex;
}

.menu li {
  margin: 0px 0px;
  display: inline;
  list-style: none;
  position: relative;
}
.menu li a {
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 16px;
  color: #333;
  text-align: center;
  font-weight: 700;
  margin-left: 10px;
}
/*
#atas1 .menu li a {
     color: white;
}
#atas2 .menu li a {
     color: #333;
}

#atas1 .menu li a:hover, #atas1 .menu .highlight,#atas2 .menu li a:hover, #atas2 .menu .highlight {
     color: #FCC80A;
}
#atas1 .menu li ul li a {
     color: white;
}
#atas2 .menu li ul li a {
     color: white;
}
*/

.menu li ul {
  height: auto;
  position: absolute;
  top: 100%;
  right: 0px;
  z-index: 10;
  display: none;
  margin: 0px;
  padding: 0px;
  width: 20vw;
}
.menu li ul li a {
  display: block;
  padding: 15px 10px;
  text-decoration: none;
  color: #fff;
  background: #333;
  border: none;
  line-height: normal;
  text-transform: none;
  font-size: 15px;
  text-align: right;
  font-weight: 400;
}
.menu li ul li a:hover {
  color: #fff;
  border: none;
  background: #000;
}

.menu li li {
  display: block;
  float: none;
}
.menu li:hover > ul {
  display: block;
}
.menu li ul ul {
  left: 90%;
  top: 0px;
}