:root {
  --accent: #aab8c3;
  --accent-bg: #10182b;
  --bg: linear-gradient(90deg, rgba(14,25,45,1) 0%, rgba(25,64,87,1) 100%);
}

body {
  background: rgb(14,25,45);
  background: linear-gradient(90deg, rgba(14,25,45,1) 0%, rgba(25,64,87,1) 100%);
  grid-template-columns: 1fr min(64rem, 99%) 1fr;
  margin: 1rem;
}

.illuria-button {
  background-color: #10182b;
  border: 2px solid white;
  padding: 0.5rem;
  margin: 0.5rem;
}

.illuria-link {
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
  text-decoration: none;
  text-align: center;
}

.illuria-wide {
}

.infobox {
  display: flex;
  padding: 0.25em;
  margin: 1em;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

.inforow {
  display: flex;
  flex-direction: column;
  padding: 0.25em;
  margin: 1em;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  flex: 1;
  height: 20em;
}


.borders {
  border: 2px solid white;
}

.infobox-item {
  /* grid-column: 1 / 2; */
  margin: 1rem;
}

.infobox-left {
  /* grid-column: 1 / 2; */
  margin: 1rem;
  float: left;
}

.infobox-right {
  /* grid-column: 2 / 2; */
  margin: 1rem;
  float: right;
}

.infobox-top {
  /* grid-row: 1 / 3; */
  margin: 1rem;
  text-align: center;
}

.infobox-mid {
  /* grid-row: 2 / 3; */
  margin: 1rem;
  font-size: 1.5rem;
  text-align: center;
}

.infobox-bottom {
  /* grid-row: 3 / 3; */
  margin: 1rem;
  text-align: center;
}

.infoflex {
  display: flex;
  padding: 0.25rem;
  margin: 1rem;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  justify-content: space-around;
}

.flexbox {
  flex: 0 0 50%;
}

.title {
  font-size: 2rem;
  text-align: center;
}