html {
  overflow-x: hidden;
}

body {
  font-family: 'Inter', sans-serif;
  /* offset-anchor: -1000px; */
  overflow-x: hidden;
  scrollbar-gutter: stable both-edges;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}

.link {
  text-decoration: none;
}

.link:hover {
  text-decoration: underline dashed;
}

.bg-dark {
  background-color: var(--bs-black) !important;
}

.bg-darkish {
  background-color: #2f2f2f;
}

.bg-light {
  background-color: rgb(245, 245, 247) !important;
}

.bg-lighter {
  background-color: #fff !important;
}

.fw-medium {
  font-weight: 500;
}

/* @media (prefers-color-scheme: dark) {
  body {
    color: #fff;
  }

  #cc-relaunch-hero {
    color: #000;
    text-shadow: #fff;
  }

  .bg-light {
    background-color: #2f2f2f !important;
  }

  .bg-lighter {
    background-color: #000 !important;
  }

  #btn-findoutmore {
    background-color: var(--bs-dark)
  }
} */

.text-cgs-red {
  color: #f04937;
}

.text-cgs-green {
  color: #669b41;
}

.text-cgs-grey {
  color: #55565a;
}

.text-cgs-blue-light {
  color: #5aa3d2;
}

.text-cgs-blue-dark {
  color: #005b94;
}

.text-cgs-yellow {
  color: #fdb515;
}

.bg-cgs-blue-light {
  background-color: #5aa3d2;
}

#hero-particles {
  position: absolute !important;
  width: 100vw;
  height: 100vh;
  z-index:-2;
}

@media (prefers-reduced-motion) {
  #hero-particles {
    display: none;
  }
}

#cc-relaunch-hero {
  min-height: 100vh;
}

#cc-relaunch-hero-bgfilter {
  position: absolute !important;
  width: 100vw;
  height: 100vh;
  z-index: -1;
}

#btn-findoutmore {
  background-color: #fff !important;
}

#btn-findoutmore:hover, #btn-findoutmore:focus-visible, #btn-findoutmore:active {
  background-color: var(--bs-btn-hover-bg) !important;
}

@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {
  #cc-relaunch-hero-bgfilter {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(5px);
  }
  
}

#relaunch-emphasis {
  -webkit-animation: text-colour-change 6s 1;
  -moz-animation: text-colour-change 6s 1;
  -o-animation: text-colour-change 6s 1;
  -ms-animation: text-colour-change 6s 1;
  animation: text-colour-change 6s 1;
  /* animation-delay: 1s; */
  animation-fill-mode:forwards;
}

@-webkit-keyframes text-colour-change {
  0% { color: #55565a; }
  25% { color: #669b41; }
  50% { color: #5aa3d2; }
  75% { color: #fdb515; }
  100% { color: #f04937; }
}
@-moz-keyframes text-colour-change {
  0% { color: #55565a; }
  25% { color: #669b41; }
  50% { color: #5aa3d2; }
  75% { color: #fdb515; }
  100% { color: #f04937; }
}
@-ms-keyframes text-colour-change {
  0% { color: #55565a; }
  25% { color: #669b41; }
  50% { color: #5aa3d2; }
  75% { color: #fdb515; }
  100% { color: #f04937; }
}
@-o-keyframes text-colour-change {
  0% { color: #55565a; }
  25% { color: #669b41; }
  50% { color: #5aa3d2; }
  75% { color: #fdb515; }
  100% { color: #f04937; }
}
@keyframes text-colour-change {
  0% { color: #55565a; }
  25% { color: #669b41; }
  50% { color: #5aa3d2; }
  75% { color: #fdb515; }
  100% { color: #f04937; }
}

.program-img {
  background-position: center;
  background-size: cover;
  min-height: 733px;
}

@media only screen and (max-width: 768px) {
  .program-img {
    background-position: center;
    background-size: cover;
    min-height: 300px;
  }
}

#program-y7-sidecarimg {
  background-image: url('https://cdn.codecadets.com/siteimg/program-y7-desk-group-collab.jpg');
}

#program-y8-sidecarimg {
  background-image: url('https://cdn.codecadets.com/siteimg/program-y8-desk-laptop.jpg');
}

#program-y9-sidecarimg {
  background-image: url('https://cdn.codecadets.com/siteimg/program-y9-showcase-piano.jpg');
}

#program-ext-sidecarimg {
  background-image: url('https://cdn.codecadets.com/siteimg/program-ext-drone-tinker.jpg');
}

#program-productions-sidecarimg {
  background-image: url('https://cdn.codecadets.com/siteimg/opportunities-productions.jpg');
}

.rotate-15 {
  rotate: -15deg;
}

.card-img-top {
  border-top-right-radius: var(--bs-border-radius-xl);
  border-top-left-radius: var(--bs-border-radius-xl);
}

#programmes .row .col-12 .row {
  min-height: 100%;
}

#activities .card {
  min-height: 100%;
}

mark {
  margin: 0 -0.4em;
  padding: 0.1em 0.4em;
  border-radius: 0.8em 0.3em;
  background: transparent;
  background-image: linear-gradient(
    to right,
    rgba(204, 73, 55, 0.1),
    rgba(204, 73, 55, 0.7) 4%,
    rgba(204, 73, 55, 0.3)
  );
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

.animate__delay-item1 {
  --animate-delay: 0.1s !important;
  animation-delay: 0.1s;
}

.animate__delay-item2 {
  --animate-delay: 0.2s !important;
  animation-delay: 0.2s;
}

.animate__delay-item3 {
  --animate-delay: 0.3s !important;
  animation-delay: 0.3s;
}

.animate__delay-item4 {
  --animate-delay: 0.4s !important;
  animation-delay: 0.4s;
}