#logout {
  display: none;
}

html,
body {
  width: 100vw;
  min-height: 100vh;
  margin: 0;
  padding: 0;
}

body {
  display: grid;
  grid-template-rows: 5vh 90vh 5vh;
  grid-template-columns: minmax(5px, 5vw) minmax(350px, 90vw) minmax(5px, 5vw);
  grid-template-areas:
    "pg-nav pg-nav pg-nav"
    ". cntr ."
    ". . credits";
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-color: rgb(97, 192, 240);
  background-image: radial-gradient(
    ellipse at bottom right,
    transparent 25%,
    rgba(0, 0, 0, 0.45) 78%,
    rgba(0, 0, 0, 0) 60%
  );
}

.container {
  grid-area: cntr;
  grid-template-areas: "cnt";
}

#content {
  grid-area: cnt;
  display: grid;
  grid-template-rows: 55vh 35vh;
  grid-template-columns: 5fr 5fr;
  grid-template-areas:
    ". error-text"
    "message-text message-text";
}
.nav-row {
  display: none !important;
}

#content-loading {
  display: none;
}
.error-div {
  margin-top: 2fr;
  grid-area: error-text;
  position: relative;
  font-size: 12em;
}

.error-num {
  position: absolute;
  bottom: 0;
  left: 0;
  color: rgba(229, 227, 213, 1);
  text-shadow: #000 8px 9px 20px;
  -webkit-font-smoothing: antialiased;
}

.message {
  grid-area: message-text;
  text-align: center;
  font-size: 2em;
  color: black;
  text-shadow: #000 1px 1px 1px;
  -webkit-font-smoothing: antialiased;
}

.bottom-right {
  grid-area: credits;
  position: absolute;
  padding: 5px;
  bottom: 0;
  right: 0;
  font-size: 18px;
  color: rgba(229, 227, 213, 1);
  text-shadow: #000 1px 1px 1px;
  -webkit-font-smoothing: antialiased;
}