/*Elements exclusive to the front-page*/
#indexWrapper {
  width: 80%;
  margin: 2em auto;
}

#logoBox {
  width: 100%;
  margin: 0 auto 1em auto;
  text-align: center;
}

#infoBox {
  text-align: center;
  width: 100%;
  padding: 0.5em;
  margin: 1em auto 2em;
  font-size: 120%;
}

#boardsSection {
  margin: 2em 0;
}

#boardsHeading {
  text-align: center;
  font-size: 85%;
  font-weight: bold;
  color: #C8922A;
  letter-spacing: 0.1em;
  margin: 0 0 0.75em 0;
  border-top: 1px solid #C8922A;
  border-bottom: 1px solid #C8922A;
  padding: 0.4em 0;
}

#links, #divStats {
  padding: 0.4em;
  font-size: 75%;
  text-align: center;
}

#links a {
  text-decoration: none;
}

#linkGlobalLogs:before {
  content: "\e069";
}

#linkArchives:before {
  content: "\e021";
}

#linkGraphs:before {
  content: "\e018";
}

#linkAccount:before {
  content: "\e081";
}

#linkGlobalRules:before {
  content: "\e06f";
}

#linkAbout:before {
  content: "\e0b0";
}

#linkEngine:before {
  content: "\e064";
}

#linkLinks:before {
  content: "\e086";
}

#linkContact:before {
  content: "\e05c";
}

.topBoards {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 0.75em;
  margin: 1em 0;
}

.topBoards a {
  display: block;
  padding: 0.75em 1em;
  text-decoration: none;
  font-size: 90%;
  border: 1px solid #C8922A;
  border-radius: 5px;
  background: #282A2E;
  text-align: center;
  transition: background 0.15s, box-shadow 0.15s;
}

.topBoards a:hover {
  background: #1a1c1e;
  box-shadow: 0 0 8px #C8922A;
  text-shadow: none;
}

#divLatestPosts {
  width: 100%;
  margin: 1em;
  text-align: center;
}

#divLatestPosts .latestPostCell {
  display: inline-block;
  overflow: hidden;
  padding: 0.5em;
  margin: 0.5em;
  max-width: 15%;
  max-height: 8em;
  font-size: 75%;
  vertical-align: middle;
}

.latestPostCell a {
  display: block;
}

#divLatestImages {
  margin: 0 auto;
  text-align: center;
}

#divLatestImages .latestImageCell {
  display: inline-block;
  max-width: 15%;
  margin: 0 0.5em;
  vertical-align: middle;
}

#divLatestImages img {
  max-width: 125px;
  max-height: 125px;
  padding: 5px;
}

@media only screen and (max-width: 812px) {
  .topBoards {
    grid-template-columns: 1fr 1fr;
    margin: 0;
  }
  #divLatestPosts {
    margin: 0;
  }
  #indexWrapper {
    width: 99%;
  }
  #links a, #divStats {
    font-size: 153%;
  }
  #linkEngine {
    display: none;
  }
}