/* Set default font color for all headers */
h1 {
  color: #024780 !important;
}

h2, h3, h4, h5, h6 {
  color: #005fae !important;
}

body {
  color: #005fae !important;
}

p, li {
  color: #024780 !important;
  font-size: 30px;
}

/* Optional: lists */
ul li {
  color: #005fae !important;
  font-size: 30px;
}

/* Make all headers normal case */
.reveal h1, 
.reveal h2, 
.reveal h3, 
.reveal h4, 
.reveal h5, 
.reveal h6 {
    text-transform: none;
}

/* Directions for when page is NOT revealjs but we want the theme to match*/
html,
body,
.page-content,
.quarto-content {
  background-color: #fdf6e3 !important;
  color: #005fae;
  font-family: Lato, sans-serif; /* main font for body text */
}

html,
h1,
.page-content,
.quarto-content {
  color: #024780!important; /* h1 text */
}

a {
  color: #008fd5 !important; /* Change to any color you want */
  font-weight: 600; /* Semibold */
}

/* sparkle effects! */

@keyframes sad_sparkle {
  0%, 100% {
    text-shadow:
      0 0 5px #1E3A8A,
      0 0 15px #6B21A8,
      0 0 25px #8B5CF6,
      0 0 35px #3B82F6;
  }
  50% {
    text-shadow:
      0 0 10px #6B21A8,
      0 0 25px #8B5CF6,
      0 0 40px #3B82F6,
      0 0 55px #1E3A8A;
  }
}

.sad_sparkle {
  color: #1E3A8A;
  animation: sad_sparkle 1.5s infinite alternate;
}

/* --- second animation --- */

@keyframes sparkle {
  0%, 100% {
    text-shadow:
      0 0 5px #FFFF33,
      0 0 15px #FFEA00,
      0 0 25px #FFD700,
      0 0 35px #FFA500;
  }
  50% {
    text-shadow:
      0 0 10px #FFFF66,
      0 0 25px #FFFF00,
      0 0 40px #FFD700,
      0 0 55px #FF8C00;
  }
}

.sparkle {
  color: #FFD700;
  animation: sparkle 1s infinite alternate;
}

reveal .mermaid svg {
  max-width: 100% !important;
  display: block;
  margin: 0 auto;
  background: transparent !important;
}

.small-column {
  font-size: 5px; /* adjust to your desired size */
}