.project-logo {
  position: absolute;
}
@media (max-width: 768px) {
  .project-logo {
    position: relative;
  }
  .project-logo img {
    max-width: 125px;
  }
}
@media (max-width: 460px) {
  .project-logo {
    padding-left: 5%;
    padding-right: 5%;
  }
}
section.panels:last-of-type {
  padding-bottom: 0 !important;
}
@media (min-width: 768px) {
  section.form input[type="file"] {
    position: absolute;
    bottom: 0;
    left: 15px;
  }
}
section.form .upload-document button.add-doc,
section.form .upload-document button.add-doc:hover {
  padding: 10px;
  font-size: 12px;
  transform: none;
  box-shadow: none;
  margin-top: 10px;
  border: 1px solid #333233;
  background: #333233;
  color: white;
}
section.form .upload-document button.add-doc:hover {
  opacity: 0.85;
}
section.form #form-message .error {
  color: #ff0e0e;
  font-size: 15px;
  margin: 10px 0px 0 5px;
}
.panels {
  display: none;
  padding-bottom: 100px;
  /* Two columns */
  /* Three columns */
  /* Responsive: stack on small screens */
}
@media (max-width: 460px) {
  .panels {
    padding: 0 5% 25px 5%;
  }
}
.panels.shown {
  display: block;
}
.panels.has-bg {
  background-size: cover;
  background-repeat: no-repeat;
}
@media (max-width: 768px) {
  .panels.has-bg {
    margin-bottom: 30px;
  }
}
.panels h1,
.panels h2,
.panels h3,
.panels h4 {
  color: #343e48;
}
.panels h1,
.panels h2,
.panels h3 {
  font-family: "Roboto";
  font-weight: 100;
  letter-spacing: 0px;
}
.panels .content-block h1,
.panels h2,
.panels h3,
.panels h4 {
  margin-bottom: 0;
}
.panels.align-content-block-left .content-block {
  align-content: flex-start !important;
  text-align: left !important;
}
.panels .content-block h4 {
  font-family: "Roboto";
  font-weight: 300;
}
.panels .content-block h4:last-of-type {
  padding-bottom: 15px;
}
@media (max-width: 460px) {
  .panels .content-block h4 {
    font-size: 2rem;
  }
}
.panels h1 {
  font-size: 5rem;
}
@media (max-width: 1440px) {
  .panels h1 {
    font-size: 4.4rem;
    overflow: visible;
  }
}
@media (max-width: 1260px) {
  .panels h1 {
    font-size: 4.2rem;
    overflow: visible;
  }
}
@media (max-width: 460px) {
  .panels h1 {
    font-size: 3.8rem;
    overflow: visible;
  }
}
.panels a,
.panels a:hover {
  color: #343e48 !important;
  background-image: none !important;
}
@media (min-width: 768px) {
  .panels .content-block.multi-col-content p[data-block-key] {
    max-width: 30vw;
  }
}
.panels .floating-icon {
  width: 100px;
  height: 100px;
  position: absolute;
  display: none;
}
.panels#shortlist_panel_phase_2_3 .floating-icon {
  display: block;
  bottom: -40px;
  left: 10%;
}
.panels#winner_panel .floating-icon {
  display: block;
  bottom: 100px;
  left: 58%;
}
@media (max-width: 460px) {
  .panels#winner_panel .floating-icon {
    display: none;
  }
}
@media (max-width: 460px) {
  .panels#winner_panel {
    padding-bottom: 0 !important;
  }
}
.panels .panel-bg-image {
  background-size: contain;
  background-repeat: no-repeat;
  aspect-ratio: 1.77777778;
  padding-top: 0 !important;
}
@media (max-width: 768px) {
  .panels .panel-bg-image {
    aspect-ratio: unset !important;
    margin: 30px 0 0 0;
    padding: 0 4%;
  }
}
.panels .panel-bg-image img.panel-position-img {
  object-fit: contain;
  height: 100%;
  width: 100%;
  opacity: 0;
}
.panels .panel-bg-image .content-block {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 6%;
}
@media (max-width: 768px) {
  .panels .panel-bg-image .content-block {
    padding: 4%;
  }
}
.panels .panel-bg-image .content-block.full-col-video div {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.panels .panel-bg-image .content-block.full-col-video div iframe {
  width: 100%;
  height: 100%;
}
.panels .panel-bg-image .col-button-row {
  position: absolute;
}
.panels .countdown {
  margin: 0;
  font-family: Sanlam-extra-light;
  font-weight: 100;
}
@media (max-width: 1480px) {
  .panels .countdown {
    font-size: 1.9rem;
  }
}
@media (max-width: 768px) {
  .panels .countdown {
    position: relative;
  }
}
@media (max-width: 460px) {
  .panels .countdown {
    font-family: Roboto;
    font-size: 4.4rem;
    margin-bottom: 10px;
    padding-top: 50px;
  }
}
.panels .phases-list {
  position: relative;
  min-width: 300px;
  margin: 0;
  padding: 0 0 50px 0;
  list-style: none;
}
@media (max-width: 1480px) {
  .panels .phases-list {
    font-size: 1.2rem;
  }
}
@media (max-width: 768px) {
  .panels .phases-list {
    position: relative;
    font-size: 1.2rem;
  }
}
@media (max-width: 768px) {
  .panels .phases-list {
    position: relative;
    font-size: 1rem;
    margin-bottom: 50px;
  }
}
@media (max-width: 460px) {
  .panels .phases-list {
    position: relative;
    font-size: 1rem;
    margin-bottom: 0px;
    padding-bottom: 0px;
  }
}
.panels .phases-list li {
  display: flex;
  flex-direction: row;
  align-content: center;
  align-items: baseline;
  gap: 10px;
  position: relative;
}
.panels .phases-list span.rounded-circle {
  height: 12px;
  display: block;
  width: 12px;
}
.panels .phases-list li::after {
  content: "";
  position: absolute;
  left: 5px;
  /* center align with .dot */
  top: 25px;
  /* start just below the dot */
  width: 2px;
  height: 11px;
  /*calc(100% - 19px);*/
  /* fill down to next item */
  background: #ccc;
  z-index: 1;
}
.panels .phases-list li:last-child::after {
  display: none;
}
.panels .panel__columns {
  display: flex;
  flex-wrap: wrap;
  /* gutter */
  flex-direction: row;
}
@media (max-width: 1170px) {
  .panels .panel__columns {
    flex-direction: column;
  }
}
.panels .panel__columns.panel-position {
  position: absolute;
  height: 100%;
}
@media (max-width: 768px) {
  .panels .panel__columns.panel-position {
    position: relative;
    height: auto;
  }
}
.panels .panel__col {
  flex: 1 1 100%;
  /* default: stack */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  max-width: 100vw;
  padding-top: 100px;
}
@media (max-width: 1400px) {
  .panels .panel__col {
    padding-top: 130px;
  }
}
@media (max-width: 768px) {
  .panels .panel__col {
    padding-top: 30px;
  }
}
.panels .panel__col .content-block.max-width-50 {
  max-width: 50%;
}
.panels .panel__col .content-block img {
  margin-bottom: 10px;
}
.panels .panel__col .content-block p {
  margin-bottom: 0;
}
.panels .panel__col .content-block p a[href] {
  color: #333233 !important;
  background-image: none !important;
}
.panels .panel__col .content-block p a[href]:hover {
  color: #333233 !important;
  background-image: none !important;
}
.panels .panel__col .panel-position.position-absolute {
  padding: 4%;
}
.panels .panel__columns--2 .panel__col {
  flex: 1 1 50%;
}
.panels .panel__columns--3 .panel__col {
  flex: 1 1 33.333%;
}
@media (max-width: 768px) {
  .panels .panel__col {
    flex: 1 1 100% !important;
  }
}
.panels .col-button-row {
  position: absolute;
  justify-content: space-around;
  align-content: center;
  align-items: center;
  padding-bottom: 5px;
}
.panels .col-button-row.has-txt-scroller {
  justify-content: flex-end !important;
  gap: 30px;
}
@media (max-width: 768px) {
  .panels .col-button-row {
    position: relative;
    gap: 30px;
    flex-direction: column;
  }
}
.panels .col-button-row.left-padding {
  padding: 5px 0 5px 8%;
}
.panels .col-button-row.right-padding {
  padding: 5px 8% 5px 0;
}
.panels a.application-form-button {
  font-size: 1.2rem;
  font-weight: bold;
  border: 2px solid #333233;
  padding: 30px 20px;
}
@media (max-width: 460px) {
  .panels a.application-form-button {
    width: 100%;
    padding: 35px 20px;
  }
}
.panels a.application-form-button.theme-dark {
  background-color: #333233;
  color: white !important;
  border: 2px solid #333233;
}
@media (max-width: 768px) {
  .panels .panel-buttons {
    position: relative;
  }
}
@media (max-width: 460px) {
  .panels .panel-buttons {
    width: 100%;
  }
}
.panels .panel-buttons a.btn,
.panels .panel-buttons button.btn {
  width: 100%;
  font-size: 1.2rem;
  font-weight: bold;
  display: inline-flex;
  padding: 30px 20px;
}
.panels .panel-buttons a.btn.theme-light,
.panels .panel-buttons button.btn.theme-light {
  background-color: white;
  color: #333233 !important;
  border: 2px solid #333233;
}
.panels .panel-buttons a.btn.theme-dark,
.panels .panel-buttons button.btn.theme-dark {
  background-color: #333233;
  color: white !important;
  border: 2px solid #333233;
}
@media (max-width: 1330px) {
  .panels .panel-buttons a.btn,
  .panels .panel-buttons button.btn {
    padding: 30px 20px;
  }
}
@media (max-width: 460px) {
  .panels .panel-buttons a.btn,
  .panels .panel-buttons button.btn {
    margin-bottom: 10px;
    padding: 35px 20px;
  }
}
@media (max-width: 460px) {
  section.no-countdown:first-of-type {
    padding-top: 40px;
  }
}
section#winner_panel {
  padding-bottom: 60px !important;
}
section#winner_panel .project-logo {
  padding-top: 60px;
}
@media (max-width: 460px) {
  section#winner_panel .project-logo {
    padding: 30px 0 0 0;
  }
}
section#winner_panel .panel__col {
  padding-top: 60px;
}
section#gallery {
  padding-bottom: 100px !important;
}
section#gallery .panel__col {
  padding-top: 0;
}
section[id^=how_it_works_panel] div.panel__col__1 {
  background-image: url("/static/images/ChairImage-DesktopTitle.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 480px;
  padding-top: 0;
  background-position: 140px 200px;
}
@media (max-width: 768px) {
  section[id^=how_it_works_panel] div.panel__col__1 {
    background-image: url("/static/images/ChairImage-mobile.png");
    aspect-ratio: 0.71428571;
    background-size: contain;
    background-position: center;
  }
}
@media (max-width: 768px) {
  section[id^=how_it_works_panel] div.panel__col {
    padding-top: 0;
  }
}
@media (max-width: 768px) {
  section[id^=how_it_works_panel] img.image-positional-icon {
    display: none;
  }
}
section.brand-logos {
  min-height: 100px;
  align-content: center;
  display: none;
}
section.brand-logos.shown {
  display: block;
}
@media (max-width: 768px) {
  section.brand-logos.shown {
    margin-top: -30px;
    z-index: -1;
    padding-top: 30px;
  }
}
section.brand-logos .logo-strip {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  /* center the row */
  gap: 20px;
  /* space between logos */
}
section.brand-logos .logo-item {
  flex: 1 1 150px;
  /* grow, shrink, min width */
  max-width: 200px;
  /* ensures logos don’t get too wide */
  text-align: center;
}
section.brand-logos .logo-item img {
  max-width: 100%;
  height: auto;
}