@font-face {
  font-family: 'QDBetter';
  src: url('/templates/cassiopeia/fonts/Qdbettercomicsans-jEEeG.ttf');
}

.comic-text {
  font-family: 'QDBetter', sans-serif;
  font-size: 32px;
}
@font-face {
  font-family: 'QDBetteralter';
  src: url('/templates/cassiopeia/fonts/Qdbettercomicsansalternates-z8823.ttf');
}

.comic-text {
  font-family: 'QDBetteralter', sans-serif;
  font-size: 32px;
}
@font-face {
  font-family: 'QDBetterbold';
  src: url('/templates/cassiopeia/fonts/QQdbettercomicsansbold-511d8.ttf');
}

.comic-text {
  font-family: 'QDBetterbold', sans-serif;
  font-size: 32px;
}
@font-face {
  font-family: 'QDBetterboldalter';
  src: url('/templates/cassiopeia/fonts/Qdbettercomicsansboldalternates-6YYPY.ttf');
}

.comic-text {
  font-family: 'QDBetterboldalter', sans-serif;
  font-size: 32px;
}
/* Header and menu bar */
.container-header {
  background: #0066ff;
  color: #003399;

}

/* Footer */
.footer {
  background: #0066ff;
}

/* Main page background */
body {
  background-color: white;
}
/* comic panels */

.comic-panel {
  border: 4px solid black;
  padding: 20px;
  margin-bottom: 20px;
  background:  #fff9cc;

  /* Comic feel */
  box-shadow: 6px 6px 0px black;

  /* Slightly imperfect */
  border-radius: 8px;
}


/* for blue vanguard page */

.year-divider {
  display: flex;
  align-items: center;
  margin: 45px 0 25px 0;
  font-size: 28px;
  font-weight: bold;
  letter-spacing: 2px;
}


.year-divider::before,
.year-divider::after {
  content: "";
  flex: 1;
  border-top: 3px solid black;
}

.year-divider span {
  padding: 0 20px;
}

.concert-gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.concert-gallery img {
  max-width: 300px;
  height: auto;
  border: 2px solid black;
}
.music-page {
  background: #c7d2f0;
  padding: 30px;
}
.concert-gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 40px;
  margin-bottom: 50px;
}

.concert-item {
  text-align: center;
}

.concert-item {
  text-align: center;
  margin-bottom: 70px;
}

.concert-item img {
  width: 1100px;
  max-width: 95%;

  height: auto;

  border: 3px solid black;
}

.concert-caption {
  margin-top: 14px;

  font-size: 34px;
}

.concert-caption {
  margin-top: 10px;

  font-size: 22px;
  font-weight: 500;
}