#menu-panel {
  background: #4ca3ed;
  padding: 20px 10px 9px 10px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  text-align:  center;
}

.menu-item {
  text-align: center;
  font-family: Arial;
  padding: 10px;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  white-space: nowrap;
	text-decoration: none;
}

.menu-item-selected {
  background: #1f6ec8;
  color: #0ff;  
  cursor: default;  
}

.menu-item-disabled {
  color: gray;
  cursor: default;
}

.menu-item-enabled {
  cursor: pointer;
  color: black; 
}

.menu-item-clickable:hover {
  background: #267de0;
  color: white;
  cursor: pointer;
}

hr {
  height: 1px;
  background: black;
  margin: 0px 0px 5px 5px;
}
		
#menu_button {
  width: 30px;
  display: none;
}		

.menu_items_visible {
  display: block;
}

.menu_items_hidden {
  display: block;
}

#submenu-panel {
  background: #1f6ec8;
  display: flex;
  justify-content: space-between;
}

@media (max-width: 520px){ 
  .menu_items_visible {
    display: block;
  }

  .menu_items_hidden {
    display: none;
  }

  .menu-item {
    display: flex;
  }

  #menu_button {
    display: block;
  }
}