#start_menu {
  font-family: 'Pixelated MS Sans Serif', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

  position: absolute;
  bottom: 36px;
  left: 0;

  height: 600px;
  width: 450px;

  background: #fff;
  color: #fff;

  flex-direction: column;
  justify-content: space-between;

  border-radius: 6px;

  z-index: 1002;
}

#start_menu_bottom,
#start_menu_top {
  width: 100%;

  display: flex;
  flex-direction: row;

  background-image: linear-gradient(to bottom, #5785e9, #2257d5);
}

#start_menu_bottom {
  height: 10%;
}

#start_menu_top {
  height: 15%;

  border-radius: 6px 6px 0 0;
}

#start_menu_buttons {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;

  width: 100%;
}

.start_menu_button {
  width: 25%;
  height: 100%;

  display: flex;
  align-items: center;
}

.start_menu_button:hover {
  cursor: pointer;
}

.start_menu_button img {
  height: 40%;
  margin: 4px;

  border: 1px solid #fff;
  border-radius: 4px;
}

#start_menu_top span {
  font-size: 20px;
  
  display: flex;
  align-items: center;
  justify-content: center;

  padding-left: 10px;
}

#start_menu_image {
  display: flex;
  align-items: center;
  justify-content: center;

  margin-left: 10px;
}

#start_menu_image img {
  max-width: 60px;
  height: 60%;
}

#start_menu_image img {
  border-radius: 4px;
  border: 2px solid #eee;
  filter: drop-shadow(3px 3px 0 rgba(0, 0, 0, 0.3))
}

#start_menu_main {
  height: 80%;
  width: 100%;

  display: flex;
  flex-direction: row;
}

#start_menu_left,
#start_menu_right {
  height: 100%;
  width: 50%;

  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

#start_menu_right {
  background-color: #d3e5fa;
  border-left: 1px solid #5faaff;
}

#start_menu_left {
  background-color: #fff;
}

#start_menu_right .start_menu_row {
  height: 28px;
}

.start_menu_row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;

  width: 100%;
  height: 32px;

  padding-top: 4px;
  padding-bottom: 4px;

  font-size: 14px;
  font-weight: normal;
  color: #000;

  background-color: inherit;
}

.start_menu_row img {
  height: 100%;
}

.start_menu_row span {
  width: 80%;
  padding-left: 4px;
}

.start_menu_row:hover {
  filter: brightness(0.9);
  cursor: pointer;
}

.start_seperator_outer {
  width: 100%;
  height: 1px;

  margin-top: 4px;
  margin-bottom: 4px;

  background: transparent;

  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.start_seperator {
  width: 80%;
  height: 1px;

  background: #ddd;
}