/* ================================
   HOT STUFF MAIN TEMPLATE
   colors and layouts
 =================================*/

html, body { padding: 0; margin: 0 }

html {
  font-family: var(--html-fonts) }

body {
  background: linear-gradient(to bottom, rgba(255, 137, 41, .3), rgba(0, 0, 0, 1)),
  url('../img/hs-web-background.png');
  background-attachment: fixed;
  background-position: top center }

body.to-print { background: url('../img/45-degree-fabric-light.png'), #EFEFEF; }


h1, h2, h3, h4, h5 h6 { margin: 0 }

h1 {
  text-align: center;
  font-size: 70px;
  font-family: var(--head-fonts) }

h2 { text-transform: uppercase }

.content-size {
  box-sizing: border-box;
  max-width: var(--content-size);
  container-type: inline-size;
  margin: auto }



.content-card {
  color: #EFEFEF;
  font-size: 16px;
  border: 1px solid var(--goldenrod);
  background: var(--hs-red);
  margin-bottom: 21px;
  padding: var(--pad) }

@media screen and (width < 770px) {
  .content-card {
    font-size: 1vw;
  }
}

.to-print .content-card { border-width: 2px; border-bottom: 0 }

@media print {
  body { outline: 0 }
  .content-card { border: 0px solid black }
  .content-size {
    page-break-inside: avoid;
    break-inside:avoid }
  header.page { display: none }
}