/* === Hero Section == */
.logoimg {max-width: 450px; width: 100%;}
.intro .main-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
}
.campaign-title {
  color: var(--foreground) !important;
  font-size: 36px;
  word-spacing: 0.2em;
  widows: 2;
  orphans: 2;
}
@media screen and (max-width: 460px) {
  .campaign-title {
    font-size: 28px;
  }
}
/* Disable chapter auto-numbering for this page */
.rules .main-content > div[id^="ch"] h3::before {
  content: none !important;
}

/* === Chapter auto-numbering === */
.rules .main-content {
  counter-reset: chapter;
}
.rules .main-content > div[id^="ch"]:not(.appendix):not(.no-number) {
  counter-increment: chapter;
}
.rules .main-content > div[id^="ch"]:not(.appendix):not(.no-number) h3:first-of-type::before {
  content: counter(chapter) ". ";
}

/* === TOC Section === */
.toc {
  color: var(--foreground);
}
.toc .main-content a {
    display: block;
    margin: 8px 0;
}
.rules a {
  text-decoration: underline;
}
/* === Rules Section === */
.rules div div {
  margin: 24px auto;
}
.rules p {
  margin: 12px auto;
}
/* Eligibility Table */
.eligibility-table {color: var(--foreground);}
.eligibility-table th,
.eligibility-table td {
  text-align: left;
  vertical-align: top !important;
}
/* === Stack table cells one-over-other on mobile === */
@media (max-width: 767px) {
    .eligibility-table th,
.eligibility-table td {
    display: block;
    width: 100%;
  }
}

/* === IF TABLES === */
.table-container {
  border-spacing: 0 !important;
  border: 1px solid var(--primary);
  color: var(--foreground);
}
.table-container thead{
  background: var(--primary);
  color: var(--primary-foreground);
  font-weight: var(--bold);
  border: 1px solid var(--primary);
}
.table-container tr td:first-child {
  width: 24%;
}
.table-container td, .table-container th {
  padding: 8px 16px;
  vertical-align: middle;
  border: 1px solid var(--primary);
}

/* === media queries === */
/* High Res Tablet */
  @media screen and (max-width: 959px){
    #intro .structure8 .menu-item  {width: 100% !important;}
    #intro .campaign-title {
      font-size: 28px;
      word-spacing: 0.2em;
    }
  }
  /*Tablet Stylings*/
  @media screen and (max-width: 767px){
  }
  /*Mobile Stylings*/
  @media screen and (max-width: 564px) {
    /* === MOBILE TABLE SETTINGS for 3+ Columns === */
    
    .table-container {border:none !important; width: 100%}
    .table-container thead {
       border: none;
      clip: rect(0 0 0 0);
      height: 1px;
      margin: -1px;
      overflow: hidden;
      padding: 0;
      position: absolute;
      width: 1px;
    }
    .table-container tr {
      border-bottom: 3px solid var(--primary);
      display:block;
      margin-bottom: 0.625em;
    }
    .table-container td {
      border-bottom: 1px solid var(--secondary);
      display:block;
      font-size:0.75rem;
      text-align: right;
    }
    .table-container td::before {
      content: attr(data-label);
      float:left;
      font-weight:var(--bold);
      color: var(--primary);
    }
    .table-container tr td:first-child {
      content:'';
      width: 100%;
      text-align: center;
      background: var(--primary);
      margin: 0;
      color: var(--primary-foreground);
    }
    
    .table-container tr td:first-child::before, .table-container tr td:first-child b {color:var(--primary-foreground);}
    .table-container td:last-child {
      border-bottom:0;
    }
  }


/* === Visually hides element 
       Accessible to SR, SEO  === */
.visually-hidden {
  position: absolute !important;
  width: 1px; 
  height: 1px; 
  margin: -1px; 
  padding: 0; 
  border: 0; 
  clip: rect(0 0 0 0); 
  overflow: hidden;
  white-space: nowrap;
}

/* === Base table === */
.table th,
.table td {
  vertical-align: top;
  text-align: inherit; /* allow modifier to control this */
}