h1, h2, h3, h4 {
    font-family: 'Caveat', serif;
    font-style: normal;
    font-variant: normal;
    font-weight: 500;
    letter-spacing: -1px;
}

h1 { font-size: 30px; line-height: 30px; margin: 0; }
h2 { font-size: 24px; line-height: 24px; }
h3 { font-family: 'Inter'; font-size: 18px; font-weight: 800; line-height: 18px; }
h4 { font-family: 'Rubik Dirt'; font-size: 22px; font-weight: 400; line-height: 22px; letter-spacing: 0; text-shadow: 2px 2px #FFFF00; margin: 0; }
h5 { font-family: 'Inter'; font-size: 18px; font-weight: 400; line-height: 18px; letter-spacing: -1px;}
h6 { font-family: 'Rubik Dirt'; font-size: 22px; font-weight: 400; line-height: 22px; letter-spacing: 0; margin: 0; }
a { color: black; text-decoration: none; }
hr { margin: 0em; border-width: 1px;}
table { width: auto; height: auto; }
th, td { text-align: left; padding: 10px; }
.collapsible { background-color: #015d87; color: white; cursor: pointer; padding: 18px; width: 100%; border: none; text-align: left; outline: none; font-family: 'Inter'; font-size: 18px; font-weight: 400; line-height: 18px; letter-spacing: -1px; }
.active, .collapsible:hover { background-color: #38b34a; }
.content { padding: 0 18px; display: none; overflow: hidden; background-color: #f1f1f1; font-family: 'Inter'; font-size: 16px; font-weight: 400; line-height: 20px; letter-spacing: -1px; }
.flip-card { background-color: transparent; width: 130px; height: 130px; perspective: 1000px; }
.flip-card-inner { position: relative; width: 100%; height: 100%; text-align: center; transition: transform 0.6s; transform-style: preserve-3d; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0); }
.flip-card:hover .flip-card-inner { transform: rotateY(180deg); }
.flip-card-front, .flip-card-back { position: absolute; width: 100%; height: 100%; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.flip-card-front { background-color: #bbb; color: black; }
.flip-card-back { background-color: black; color: white; transform: rotateY(180deg); font-family: 'Inter'; font-size: 15px; font-weight: 400; line-height: 15px; }
.cropped { width: 360px; height: 125px; object-fit: cover; }
.expandable-table { table-layout: fixed; width: 100%; }
.expandable-table td { border: 0; padding: 5px; text-align: left; vertical-align: top; cursor: pointer; }
@media screen and (max-width: 600px) { .expandable-table td { display: block; width: 100%; box-sizing: border-box; page-break-after: always; } }


