/* ===================================================
   GLOBAL VARIABLES
   ===================================================*/

@font-face {
    font-family: 'Gotham-Ultra';
    src: url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/Gotham-Ultra.eot');
    src: url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/Gotham-Ultra.eot#iefix') format('embedded-opentype'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/Gotham-Ultra.woff2') format('woff2'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/Gotham-Ultra.woff') format('woff'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/Gotham-Ultra.ttf') format('truetype'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/Gotham-Ultra.svg#Gotham-Ultra') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GothamNarrow-Light';
    src: url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Light.eot');
    src: url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Light.eot#iefix') format('embedded-opentype'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Light.woff2') format('woff2'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Light.woff') format('woff'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Light.ttf') format('truetype'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Light.svg#GothamNarrow-Light') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GothamNarrow-Medium';
    src: url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Medium.eot');
    src: url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Medium.eot#iefix') format('embedded-opentype'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Medium.woff2') format('woff2'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Medium.woff') format('woff'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Medium.ttf') format('truetype'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Medium.svg#GothamNarrow-Medium') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GothamNarrow-Bold';
    src: url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Bold.eot');
    src: url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Bold.eot#iefix') format('embedded-opentype'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Bold.woff2') format('woff2'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Bold.woff') format('woff'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Bold.ttf') format('truetype'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Bold.svg#GothamNarrow-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GothamNarrow-Book';
    src: url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Book.eot');
    src: url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Book.eot#iefix') format('embedded-opentype'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Book.woff2') format('woff2'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Book.woff') format('woff'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Book.ttf') format('truetype'),
        url('https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/library/webfont/GothamNarrow-Book.svg#GothamNarrow-Book') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


:root {
    --afroPink: #e50051;
    --afroGreen: #2fac66;
    --afroRed: #ed1c24;
    --afroYellow: #ffcc00;
    --afroLightGreen: #4e9b47;
    --afroCyan: #009eb8;
    --white: #ffffff;
    --font-book: 'GothamNarrow-Book';
    --font-med: 'GothamNarrow-Medium';
    --font-bold: 'GothamNarrow-Bold';
    --font-ultra: 'Gotham-Ultra';
}

body {
    font-family: 'GothamNarrow-Book';
}

/* ===================================================
   HEADER
   ===================================================*/
html {
     scroll-behavior: smooth;
}


.header-bg,
footer {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-image: url(https://afrocentric-online.co.za/results/interims-2025/images/header-bg.jpg);
}

.navbar-default .navbar-header {
    padding: 15px 0;
}

.navbar-default .navbar-header {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
}

div#navigation {
    margin-top: 20px;
}

.top-header-wrapper {
    display: flex;
    justify-content: space-between;
}


.site-title {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    /* margin-bottom: 20px; */
}

.site-title .site-year {
    color: #bea0bd;
    font-size: clamp(2.5rem, 5.5rem, 7.5rem);
    line-height: 0.9em;
    font-family: 'Gotham-Ultra';
}

.site-title .site-report {
    text-transform: uppercase;
    font-family: 'GothamNarrow-Bold';
    margin-right: 20px;

}

.top-title {
    font-size: clamp(1rem, 2.5rem, 2rem);
    color: #c9a2bd;
}

.bottom-title {
    font-size: clamp(1rem, 1.6rem, 2rem);
    color: var(--white);
}

.navbar-default .navbar-header .navbar-nav>li>a {
    color: var(--white);
    font-size: 17px;
    font-family: 'GothamNarrow-Book';
    padding: 5px 25px;
}


@media (min-width: 768px) {
    .navbar-expand-md .navbar-collapse {
        justify-content: center;
    }
}

a.nav-link.active {
    background-color: var(--afroGreen);
    border-radius: 20px;
}

.current_page_parent a.nav-link {
    background-color: var(--afroGreen);
    border-radius: 20px;
}

/* ===================================================
   FOOTER
   ===================================================*/
footer {
    color: var(--white);
    text-align: center;
    font-size: 21px;
    font-family: 'GothamNarrow-Book';
    padding: 20px 0 10px;
}

.next-section,
.prev-section {
    display: inline-block;
    background-color: var(--afroLightGreen);
    color: var(--white);
    padding: 7px 20px;
    border-radius: 20px;
}

.next-section:hover,
.prev-section:hover {
    text-decoration: none;
    color: var(--white);
}

.next-section i.fa.fa-play-circle {
    right: 0;
    position: relative;
    transition: right .3s ease-in;
}

.next-section:hover i.fa.fa-play-circle {
    right: -10px;
    position: relative;
    transition: right .3s ease-in;
}

.prev-section i.fa.fa-play-circle.rotate-180 {
    transform: rotate(180deg);
}

.prev-section:hover i.fa.fa-play-circle {
    left: -10px;
    position: relative;
    transition: left .3s ease-in;
}

.prev-section i.fa.fa-play-circle {
    left: 0;
    position: relative;
    transition: left .3s ease-in;
}

.navbar-default .navbar-header .navbar-nav li div.dropdown-menu a.dropdown-item:hover,
.navbar-default .navbar-header .navbar-nav li div.dropdown-menu a.dropdown-item.active,  
.navbar-default .navbar-header .navbar-nav li div.dropdown-menu a.dropdown-item:active {
    color: #fff;
    background-color: #430e2f;
}

/* ===================================================
   HOMEPAGE
   ===================================================*/
.home-hero {
     position: relative;
     overflow: hidden;
     background-repeat: no-repeat;
     background-position: center center;
     background-size: cover;
     background-image: url(https://afrocentric-online.co.za/results/interims-2025/wp-content/themes/Afrocentric/images/home-banner.jpg);
     padding-bottom: 4rem;
     padding-top: 4rem;
   }
   
.home-hero::before {
     content: "";
     position: absolute;
     inset: 0;
     background-image: inherit;
     background-repeat: inherit;
     background-position: inherit;
     background-size: inherit;
     transform-origin: center;
     animation: heroZoom 10s ease-in-out infinite alternate;
     will-change: transform;
     z-index: 0;
}
   
.home-hero > * {
      position: relative; z-index: 1; 
}
 
@keyframes heroZoom {
   0%   { transform: scale(1.02); }
   100% { transform: scale(1.08); }
 }
 
 @media (prefers-reduced-motion: reduce) {
   .home-hero::before { 
     animation: none; 
   }
 }

.home-values p {
    margin-bottom: 0;
}

.heading,
.desc,
.prev-value {
    color: var(--white);
    font-family: 'GothamNarrow-Medium';
    font-size: 18px;
    line-height: 1.4em;
}

.heading {
    text-transform: uppercase;
}

.current-value {
    color: var(--afroYellow);
    font-size: clamp(18px, 32px, 36px);
    font-family: 'Gotham-Ultra';
}

.teal,
.page-title {
    color: var(--afroCyan);
}

.pink {
    color: var(--afroPink);
}

h1.teal,
.page-title {
    font-family: 'GothamNarrow-Medium';
    font-size: clamp(18px, 32px, 36px);
    margin-top:50px;
    margin-bottom: 40px;
}

.b-bottom-p {
    border-bottom: 1px solid;
    margin-left: 10px;
}

.b-bottom-g {
    border-bottom: 1px solid;
    margin-left: 10px;
}

.pdf-downloads, .pdf-downloads:hover {
    color: var(--afroPink);
    font-family: 'GothamNarrow-Medium';
    text-decoration: none;
}

.excel-downloads, .excel-downloads:hover {
    color: var(--afroGreen);
    font-family: 'GothamNarrow-Medium';
    text-decoration: none;
}

img.play-button {
    margin-bottom: 8px;
}

img.high {
    border: 1px solid var(--afroCyan);
}


/* ===================================================
   TABLES
   ===================================================*/
table th:not(:first-child),
table td:not(:first-child) {
  padding: 0 0.9rem;
}
table th:first-child,
table td:first-child {
  padding: 0 0 0 5px;
}

table {
    margin-bottom: 20px;
    margin-top: 20px;
    min-width: 800px;
}

table.footnote {
  min-width: auto;
}

td.Table-head p:first-child {
    margin-top: 10px;
}

.table-head.teal {
    font-family: 'GothamNarrow-Medium';
}

td:has(p.fig-bold),
td:has(p.fig-bold-head) {
    background-color: #ededed;
}

td:has(p.fig-reg-head),
td:has(p.fig-bold-head) {
 vertical-align: bottom; 
}

td.fig-bold{
  background-color: #ededed;
}

table.v-align-btm td {
    vertical-align: bottom;
    padding: 0 10px;
}

a.link, a.link:hover{
  color: var(--afroCyan);
}

.fig-bold,
.fig-reg,
.fig-bold-head,
.fig-reg-head,
.fig-notes {
    text-align: right;
}

.table-copy-bold,
.table-copy-head-center,
.fig-bold-head,
.fig-reg-head,
.fig-bold,
.Table-h4 {
    font-family: 'GothamNarrow-Medium';
}

.table-copy-head-center{
  text-align: center;
}

h3.table-head, p.Table-h3 {
    font-size: 18px;
    font-family: 'GothamNarrow-Medium';
    color: var(--afroCyan);
}

.table-head{
  font-family: 'GothamNarrow-Medium';
  color: var(--afroCyan);
}

table td{
  vertical-align: bottom;
}

tr:has(td.Table-head) {
    border-bottom: 3px solid #575756;
}

.Table-head{
  vertical-align: bottom;
}

.bottom-double {
    border-bottom: 2px solid #212529;
}

.top-single {
    border-top: 1px solid #212529;
}
.bottom-single {
    border-bottom: 1px solid #212529;
}

.bottom-double-top-single{
  border-top: 1px solid #212529;
  border-bottom: 2px solid #212529;
  
}

.single-top{
  border-top: 1px solid #212529;
}
td.cy-top-single {
    border-top: 1px solid var(--afroCyan);
}


td.cy-right-single {
    border-right: 1px solid var(--afroCyan);
}

td.cy-left-single {
    border-left: 1px solid var(--afroCyan);
}

td.cy-bottom-single {
    border-bottom: 1px solid var(--afroCyan);
}
p.fig-reg-head, p.fig-bold-head {
    margin-bottom: 0;
}

td.cy-left-single-cy-top-single{
    border-left: 1px solid var(--afroCyan);
    border-top: 1px solid var(--afroCyan);
}

td.cy-left-single-cy-bottom-single{
  border-left: 1px solid var(--afroCyan);
  border-bottom: 1px solid var(--afroCyan);
}

td.cy-right-single-cy-top-single{
  border-right: 1px solid var(--afroCyan);
  border-top: 1px solid var(--afroCyan);
}

td.cy-right-single-cy-bottom-single{
  border-right: 1px solid var(--afroCyan);
  border-bottom: 1px solid var(--afroCyan);
}

.neg-digits {
margin-right: -7px;
}

tr.empty-row td {
    height: 10px;
}

table.footnote td {
    padding: 0 5px;
}

tr:not(.thead):hover td {
  background-color: #ededed;
}

tr:not(.thead):hover {
  cursor: pointer;
}

table.footnote td {
    vertical-align: top;
}

.tables-xl {
    max-width: 1400px;
    margin: 0 auto;
}

table tr td.empty-column {
    padding: 0 !important; /* fallback if really necessary */
    width: 10px;
}

table td.empty-column {
    padding: 0; 
}

table td.empty-column:not(:first-child) {
    padding: 0;
    width: 10px;
}
.fin-bg-color {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-image: url(https://afrocentric-online.co.za/results/interims-2025/images/header-bg.jpg);
    padding: 2rem;
}

.navbar-toggler{
  top: 0px;
}

@media (max-width: 768px) {
    .fin-bg-color {margin-bottom:2rem;}
}

@media (max-width: 991px) {
   .top-header-wrapper{
     flex-direction: column;
     margin-top: 30px;
   }
   
   .site-title{
     flex-direction: column;
   }
   .home-hero{
     background-position: left;
   }
   
   .navbar-brand{
     margin: 0 auto;
   }
}

@media (max-width: 1199px) {
  .top-title{
    font-size: 25px;
  }
  .bottom-title {
      font-size: 20px;
  }
  
  .navbar-default .navbar-header .navbar-nav>li>a{
    padding: 5px 20px;
  }
}

.count {
  display: inline-block;
  font-variant-numeric: tabular-nums; /* keeps digits aligned */
}

.line-home {
  --dot: 5px;        
  --gap: 4px;        
  --step: calc(var(--dot) + var(--gap));
  position: relative;
  top: 0;
  margin-left: -15px;
  margin-right: -15px;
  height: var(--dot);
  background: linear-gradient(90deg, #ed145b, #ffcb05, #009eb8);
  -webkit-mask: radial-gradient(circle, #000 50%, transparent 60%) 0 50% / var(--step) var(--dot) repeat-x;
  mask: radial-gradient(circle, #000 50%, transparent 60%) 0 50% / var(--step) var(--dot) repeat-x;
  animation: lineHomeMarch 0.8s linear infinite;
}
@keyframes lineHomeMarch {
  to {
    -webkit-mask-position: var(--step) 50%;
    mask-position: var(--step) 50%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .line-home { 
    animation: none; 
  }
}

.dl .link img {
    margin-bottom: 0;
    align-self: center;
    margin-left: 10px;
}

.dl .link {
    display: flex;
    margin-bottom: 10px;
}
.dl a.link {
    color: var(--afroLightGreen);
}

i.fa-solid.fa-download {
    margin-right: 10px;
}
.site-title {
  text-align: center;
}

.site-title span,
.site-year {
  opacity: 0;
  transform: translateY(20px);
  display: inline-block;
}

.site-title .top-title.animate-in,
.site-title .bottom-title.animate-in,
.site-title .site-year.animate-in {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.8s ease, transform 0.8s ease;
}