h1 {
    border: 2px #eee solid;
    color: brown;
    text-align: center;
    padding: 10px;
}

/* Images (civ portraits, map thumbnails, team logos, ...) stay responsive via
   Bootstrap's own .img-fluid / .card-img-top; only a shared vertical rhythm
   is set here. Previously this rule force-clamped every <img> on the site to
   a fixed 112x112px circle, squashing rectangular map/ban thumbnails. */
img {
    vertical-align: middle;
    max-width: 100%;
}

a:link, a:visited {
  color: white;
  text-decoration: none;
}

a:hover, a:focus {
  color: white;
  text-decoration: underline;
}

body {
  background-image: url(../assets/background-4cf7c7b5.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;

  background-attachment: fixed;

  min-height: 100vh;
}



/* Civ pick / map thumbnails in a row (games list, draft-style game detail):
   the source assets are NOT a consistent resolution (civ portraits are
   256x256, but map art varies between 133x133 and 48x48 depending on the
   file), so side-by-side thumbnails need an explicit common box rather than
   rendering at native size. Same height + object-fit: contain pattern
   already used inline for the "Maps Played" cards on team.html. */
.pick-thumb {
  height: 70px;
  width: 100%;
  object-fit: contain;
}

.text-team {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 80px;
}

.text-player {
  display: flex;
  justify-content: center;
  align: middle;
  height: 60px;
  color : #C6A873;
}

.text-base{
  color: #C6A873;
  font-family: 'arial black';
  font-variant: bold;
  font-size: xx-large;
  text-align: center;}

.text-box {
  color: #C6A873;
  border: 5px solid #C6A873;
  padding: 4px;
  font-family: 'arial black';
  font-variant: normal;
  text-align: center;
  text-transform: uppercase;
  border-radius: 14px;
}

.progress {height: 40px;}

.progress-bar-primary { background-color: rgba(255, 255, 255, 0.0) !important; }

.news{width: 160px}.news-scroll a{text-decoration: none}.dot{height: 6px;width: 6px;margin-left: 3px;margin-right: 3px;margin-top: 2px !important;background-color: rgb(207,23,23);border-radius: 0%;display: inline-block}