body {
  color: white;
  font-family: sans-serif;
  font-size: 12pt;
  text-shadow: 2px 2px 5px #000000;
  background-color: #004000;
  background-size: cover;
}

a {
  text-decoration: none;
  color: white;
}

input {
  background-color: #000000;
  border-radius: 4px;
  box-sizing: 13pt;
  color: #c0ffc0;
  padding: 0px;
  width: 30%;
  font-size: 1em;
  border-radius: 6px;
  margin-right: 1vw;
}

input[type=text] {
  background-color: #000000;
  border-radius: 4px;
  box-sizing: 13pt;
  color: #c0ffc0;
  padding: 0px;
  font-size: 1em;
  border-radius: 6px;
  margin-right: 1vw;
  width: 30%;
  box-shadow: 5px 5px 5px black;
}

input[type=password] {
  background-color: #000000;
  border-radius: 4px;
  //box-sizing: 13pt;
  color: #c0ffc0;
  padding: 0px;
  width: 40%;
  font-size: 0.8em;
  box-shadow: 5px 5px 5px black;
}

input[type=submit] {
  background-color: #003000;
  border: 4px solid #003000;
  border-radius: 8px;
  box-shadow: 5px 5px 5px black;
  box-sizing: 13pt;
  color: #c0ffc0;
  padding: 0px;
  min-width: 40vw;
  font-size: 1.0em;
}

form {
  padding: 0px;
  margin: 0px;
  display: inline;
}

a:visited {
  color: white;
  text-decoration: none;
}
/*! CSS Used from: Embedded */
body {
  font-family: sans-serif;
  font-size: 12pt;
  background-color: white;
}

#wrapper {
  position: absolute;
  width: 100vw;
  height: 100vh;
  max-width: 100vw;
  max-height: 100vh;
  min-width: 100vh;
  min-height: 100vh;
  overflow: hidden;

}

#avatar-main-wrap {
  position: relative;
  width: 100vw;
  height: 100vh;
  background-size: 75vh 75vh;
  background-color: #000000;
  //background-size: contain;
  background-position: top right;
  background-repeat: no-repeat;
  transition: background 1s;
}

.blar1 {
  linear-gradient(to right, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.5), 30%, rgba(0, 0, 0, 0) 100%);

}

#avatar-wrap {
  align-items: center;
  float: left;
  width: 30vh;
  height: 30vh;
  margin: 4px;
  //padding: 4px;
  //background-color: #f0f0f0;
  border-radius: 8px;
  font-size: 12pt;
  color: black;
  //box-shadow: 5px 5px 5px black;
}

#avatar-please {
  position: absolute;
  left: 1vw;
  bottom: 31vh;
  width: auto;
  background-color: #e0d0e0;
  border-radius: 8px;
  font-size: 1.2em;
  color: black;
  box-shadow: 3px 3px 3px black;
  z-index: 100;
  padding-left: 4px;
  padding-right: 4px;
}

.avatar-tn {
  width: 32vh;
  height: 32vh;
  align-items: center;
  padding: 0px;
  pargin: 0px;
}

#avatar-selected-wrap {
  position: absolute;
  bottom: 30vh;
  right: 1vw;

  float: right;
  align-items: center;
  width: 33vh;
  height: 33vh;


  padding: 4px;
  font-size: 12px;
  color: black;
  background: none;
  overflow: hidden;
}

#avatar-selected-wrap img {
  width: 30vh;
  height: 30vh;
  border-radius: 20%;
  box-shadow: 5px 5px 5px black;
}

#newuser {
  object-fit: scale-down;
  z-index: 99;
  top: 20px;
  left: 20px;
  max-width: 70%;
  max-height: 60%;
  font-size: 1.1em;
  margin: 4px;
  padding: 0px;
  background: none;
  color: #d0ffd0;
  text-shadow: 1px 1px 1px black;
  border-radius: 10px;
  background-color: rgba(0,0,0,0.0);

}

#newuser table {
  color: #d0ffd0;
  text-shadow: 1px 1px 1px black;
  margin: 0px;
  margin-left: 10px;
  padding: 0px;
  font-size: 1.3em;
}
#newuser tr {
  padding: 0px;
  margin: 0px;

}



h2 {
  font-size: 20pt;
  margin: 8px;
  margin-bottom: 8px;
}

#dg-wrap-outer {
  position: absolute;
  z-index: 50;
  bottom: 0px;
  left: 0px;
  margin: 0px;
  padding-top: 4px;
  height: 30vh;
  min-height: 30vh;
  max-height: 30vh;
  width: 100vw;
  min-width: 100vw;
  max-width: 100vw;
  overflow-y: hidden;
  color: white;
  text-shadow: 1px 1px 4px black;
  border-radius: 12px;
  font-size: 12pt;
  font-family: sans-serif;
  scroll-behavior: smooth;
  transition: ease-in-out;
  background-color: rgba(0,0,0,0.3);
}

#dg-wrap-outer-left {
  position: absolute;
  left: 0px;
  bottom: 0px;
  width: 32px;
  height: 30vh;
  z-index: 51;
}

#dg-wrap-outer-right {
  position: absolute;
  width: 32px;
  right: 0px;
  bottom: 0px;
  width: 32px;
  height: 30vh;
  z-index: 51;
}

::-webkit-scrollbar {
  display: none;
}

#dg-wrap {
  position: relative;
  margin: -4px;
  padding: -4px;
  height: 30vh;
  min-height: 30vh;
  max-height: 30vh;
  width: max-content;
  width: -moz-max-content;
  overflow-y: hidden;
  color: white;
  text-shadow: 1px 1px 4px black;
  border-radius: 12px;
  font-size: 12pt;
  font-family: sans-serif;
}

#dg-wrap-outer-left {
  position: absolute;
  left: 0px;
  bottom: 0px;
  width: 24px;
  height: 30vh;
  z-index: 99;
}

#dg-wrap-outer-right {
  position: absolute;
  width: 24px;
  height: 30vh;
  right: 0px;
  bottom: 0px;
  height: 30vh;
  z-index: 99;
}

#waitforit {
  position: relative;
  width: 100vw;
  height: 100vh;
  min-width: 100vw;
  min:height: 100vh;
  background-size: cover;
  background-color: black;
  color: white;
  font-size: 1.2em;
  font-family: sans-serif;
}
#waitforit-inner {
  position: absolute;
  top: calc(50% - 20vh );
  left: calc(50% - 20vh );
  width: 40vh;
  height: 40vh;
  background-color: rgba(0,0,0,0);
}
#waitforit-inner img{
  width: 40vh;
  height: 40vh;
}