body {
  background-color: grey;
  margin: 0;
  font-family: monospace;
  min-height: 100vh !important;
  background:
  repeating-linear-gradient(
    45deg,
    #a59e9e,
    #888383 2px,
    #817e7e 2px,
    #918c8c 4px
  );
}

.border-red {
  border: 2px solid red;
}

.border-green {
  border: 2px solid green;
}

.main_menu {
  display: flex;
  position: relative;
  justify-content: space-between;
  align-items: center;
  background-color: #1f1c1c;
  padding: 10px 10px;
}

.main_menu_item {
  color: #eee;
  text-decoration: none;
  font-size: larger;
  font-weight: bold;
  padding: 0 10px;
  
  border-left: 1px solid rgb(156, 61, 77);
}

.main_menu_item:first-child {
  border-left: none;
}

.card {
  padding: 10px;
  border: 1px solid black;
  border-radius: 4px;
  background: lightgrey;
}

#_ButtonArea {
  display: flex;
}

#_NavButton {
  /* all: unset; */
  color: black;
  background-color: lightgrey;
  /* position: absolute; */
  top: 5px;
  left: 20px;
  padding: 4px 8px;
  border-radius: 5px;
}

#_NavMenu {
  display: none;
  flex-direction: column;
  background-color: lightgrey;
  border: 2px solid grey;
  border-radius: 4px;
  position: absolute;
  left: 10px;
  top: 38px;
  justify-content: left;
  z-index: 5;
}

#_NavMenu button {
  all: unset;
  cursor: pointer;
  background-color: lightgrey;
}

#_NavMenu button:hover {
    background-color: lightblue;
}

#_NavMenu button a {
  all: unset;
  display: block;
  width: 100%;
  height: 100%;
  padding: 5px 20px;
}

#_LoginButton {
  /* all: unset; */
  color: black;
  background-color: lightgrey;
  /* position: absolute; */
  top: 5px;
  right: 20px;
  padding: 4px 8px;
  border-radius: 5px;
}

#_UserMenu {
  display: none;
  flex-direction: column;
  background-color: lightgrey;
  border: 2px solid grey;
  border-radius: 4px;
  position: absolute;
  right: 10px;
  top: 36px;
  justify-content: left;
}

#_UserMenu button {
  all: unset;
  cursor: pointer;
  background-color: lightgrey;
}

#_UserMenu button:hover {
  background-color: lightblue;
}

#_UserMenu button a {
  all: unset;
  display: block;
  width: 100%;
  height: 100%;
  padding: 5px 20px;
}

.progressbar {
  display: none;
  position: absolute;
  left: 0;
  top: 35px;
  width: 100%;
  height: 3px;
  background: linear-gradient(
    90deg,
    white,
    rgba(0, 0, 0, 0),
    white
  );
  background-size: 200% 100%;
  animation: gradientMove 1s linear infinite;
  border-radius: 1px;
}

@keyframes gradientMove {
  100% {
    background-position: 0% 0;
  }
  0% {
    background-position: 200% 0;
  }
}