body {

  background-color: rgb(255, 255, 255) !important;

}



.skyscraper {

  display: none !important;

}



#VisionChallenge {

  background-color: #f8f9fa;

  color: black;

  font-family: "Poppins", sans-serif;

  font-weight: 400; /* Regular */



  box-shadow: 0px 0px 28px -4px rgba(0, 0, 0, 0.15);

}



#VisionChallenge h1 {

  font-weight: 700;

  font-size: 2rem;

}



#VisionChallenge h2 {

  font-weight: 600;

  font-size: 1.5rem;

}

#VisionChallenge h3 {

  font-weight: 600;

  font-size: 1.2rem;

}

#VisionChallenge a {

  color: #e30613;

}



#VisionChallenge img {

  max-width: 100%;

}



#VisionChallenge .mobile {

  display: none;

}



#VisionChallenge .bg-grey {

  background-color: #212529;

}



#VisionChallenge #voorwaarden {

  background-color: #e9e9e9db !important;

}



#VisionChallenge #deelname {

  display: none;

}



#toggleBtn {

  background-color: #e3000c;

  padding: 7px 20px;

  border-radius: 5px;

  font-size: 1rem !important;

  width: 60%;

  color: white;

  margin-bottom: 1rem;

  opacity: 1;

  transition: opacity 0.1s ease-in-out;



  font-weight: 600;

}



.lap-time {

  font-family: monospace;

}



.leaderboard-container {

  width: 100%;

  font-family: "Poppins", sans-serif !important;

  position: relative;

}



.lastUpdated {

  font-size: 12px;

  font-weight: bold;

  color: black;

  text-align: center;

  position: relative;

  margin-top: 10px !important;

  margin-bottom: 0px !important;

}



.table-responsive {

  border-radius: 10px !important;

}



.table {

  margin-bottom: 0;

  min-height: 429px !important;

}



#VisionChallenge #leaderboardBody {

  vertical-align: middle;

}



.table th {

  border-bottom: 2px solid #e30613;

  font-family: "Poppins", sans-serif !important;

  font-size: 1.2em;

  text-transform: uppercase;

}



.position-col {

  width: 80px;

}



.table tbody tr {

  opacity: 0;

  transform: translateX(-20px);

  animation: slideIn 0.5s ease-out forwards;

}



.table tbody tr:nth-child(1) {

  background: linear-gradient(90deg, rgba(255, 215, 0, 0.2) 0%, transparent 100%);

}



.table tbody tr:nth-child(2) {

  background: linear-gradient(90deg, rgba(192, 192, 192, 0.2) 0%, transparent 100%);

}



.table tbody tr:nth-child(3) {

  background: linear-gradient(90deg, rgba(205, 127, 50, 0.2) 0%, transparent 100%);

}



.position {

  font-family: "Poppins", sans-serif !important;

  font-size: 1.5em;

  font-weight: bold;

  font-style: italic;

}



.position-1 {

  color: #ffd700;

}

.position-2 {

  color: #c0c0c0;

}

.position-3 {

  color: #cd7f32;

}



.gap {

  font-family: monospace;

  color: #e30613;

}



@keyframes slideIn {

  to {

    opacity: 1;

    transform: translateX(0);

  }

}



/* Pagination styles */

.pagination .page-link {

  background-color: #212529 !important;

  border-color: #373b3e !important;

  color: #fff !important;

}



ul.pagination {

  margin-bottom: 0px !important;

}



.pagination .page-item.active .page-link {

  background-color: #e30613 !important;

  border-color: #e30613 !important;



  color: #ffffff !important;

}



.pagination .page-item.disabled .page-link {

  background-color: #1a1d20 !important;

  border-color: #373b3e !important;

  color: #ffffff !important;

}



.pagination .page-link:hover {

  background-color: #2c3034 !important;

  border-color: #373b3e !important;

  color: #fff !important;

}



/* Hover effects */

.table tbody tr:hover {

  background: linear-gradient(90deg, rgba(255, 62, 62, 0.2) 0%, transparent 100%);

  transition: background 0.3s ease;

}



/* Overlay */

#overlay {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-60%, -50%);

  width: 100%;

  height: 100%;

  background: rgba(255, 255, 255, 0);

  z-index: 999;

}

#spinner {

  position: absolute;

  top: calc(100% / 2 + 15px);

  left: calc(100% / 2 + 16px);

  transform: translate(-50%, -50%);

  width: 50px;

  height: 50px;

  fill: #e3001d;

  animation: lds-circle 3.6s cubic-bezier(0, 0.2, 0.8, 1) infinite;

}

@keyframes lds-circle {

  0%,

  100% {

    animation-timing-function: cubic-bezier(0.5, 0, 1, 0.5);

  }

  0% {

    transform: rotateY(0deg);

  }

  50% {

    transform: rotateY(1800deg);

    animation-timing-function: cubic-bezier(0, 0.5, 0.5, 1);

  }

  100% {

    transform: rotateY(3600deg);

  }

}

.lds-dual-ring {

  display: inline-block;

  width: 100px;

  height: 100px;

}

.lds-dual-ring:after {

  content: " ";

  width: 80px;

  height: 80px;

  position: absolute;

  top: calc(100% / 2);

  left: calc(100% / 2);

  transform: translate(-50%, -50%);

  border-radius: 50%;

  border: 6px solid #e3001d;

  border-color: #e3001d transparent #e3001d transparent;

  animation: lds-dual-ring 1.2s linear infinite;

}

@keyframes lds-dual-ring {

  0% {

    transform: rotate(0deg);

  }

  100% {

    transform: rotate(360deg);

  }

}



/* Prijzen section */

#VisionChallenge #prijzen {

  background-color: #f8f9fa;

  color: #212529;

}



#VisionChallenge #prijzen h2 {

  color: #212529;

}



#VisionChallenge #prijzen h3 {

  color: #212529;

  font-size: 1.1rem;

}



.prize-card {

  background-color: #ffffff;

  border-radius: 12px;

  overflow: hidden;

  height: 100%;

  display: flex;

  flex-direction: column;

  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);

  border: 1px solid #e9ecef;

}



.prize-card-image {

  padding: 20px;

  display: flex;

  align-items: center;

  justify-content: center;

  min-height: 200px;

  background-color: #f1f3f5;

}



.prize-card-image img {

  max-width: 100%;

  max-height: 250px;

  object-fit: contain;

}



.prize-card-content {

  padding: 20px 25px 25px;

  flex: 1;

}



.prize-highlight {

  color: #e30613;

  font-weight: 700;

}



.prize-list {

  list-style: none;

  padding-left: 0;

  margin-top: 10px;

}



.prize-list li {

  padding: 4px 0;

  padding-left: 18px;

  position: relative;

  color: #212529;

}



.prize-list li::before {

  content: "";

  position: absolute;

  left: 0;

  top: 50%;

  transform: translateY(-50%);

  width: 8px;

  height: 8px;

  border-radius: 50%;

  background-color: #e30613;

}



/* Responsive adjustments */

@media (max-width: 768px) {

  .table th,

  .table td {

    font-size: 0.9em;

  }

}



@media (max-width: 650px) {

  #VisionChallenge .mobile {

    display: block;

  }

  #VisionChallenge .desktop {

    display: none;

  }

  #toggleBtn {

    width: 100%;

  }

}



/* Font CSS */

/* 100 - Thin */

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-Thin.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-Thin.woff") format("woff");

  font-weight: 100;

  font-style: normal;

}

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-ThinItalic.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-ThinItalic.woff") format("woff");

  font-weight: 100;

  font-style: italic;

}



/* 200 - ExtraLight */

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-ExtraLight.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-ExtraLight.woff") format("woff");

  font-weight: 200;

  font-style: normal;

}

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-ExtraLightItalic.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-ExtraLightItalic.woff") format("woff");

  font-weight: 200;

  font-style: italic;

}



/* 300 - Light */

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-Light.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-Light.woff") format("woff");

  font-weight: 300;

  font-style: normal;

}

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-LightItalic.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-LightItalic.woff") format("woff");

  font-weight: 300;

  font-style: italic;

}



/* 400 - Regular */

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-Regular.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-Regular.woff") format("woff");

  font-weight: 400;

  font-style: normal;

}

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-Italic.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-Italic.woff") format("woff");

  font-weight: 400;

  font-style: italic;

}



/* 500 - Medium */

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-Medium.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-Medium.woff") format("woff");

  font-weight: 500;

  font-style: normal;

}

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-MediumItalic.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-MediumItalic.woff") format("woff");

  font-weight: 500;

  font-style: italic;

}



/* 600 - SemiBold */

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-SemiBold.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-SemiBold.woff") format("woff");

  font-weight: 600;

  font-style: normal;

}

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-SemiBoldItalic.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-SemiBoldItalic.woff") format("woff");

  font-weight: 600;

  font-style: italic;

}



/* 700 - Bold */

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-Bold.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-Bold.woff") format("woff");

  font-weight: 700;

  font-style: normal;

}

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-BoldItalic.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-BoldItalic.woff") format("woff");

  font-weight: 700;

  font-style: italic;

}



/* 800 - ExtraBold */

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-ExtraBold.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-ExtraBold.woff") format("woff");

  font-weight: 800;

  font-style: normal;

}

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-ExtraBoldItalic.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-ExtraBoldItalic.woff") format("woff");

  font-weight: 800;

  font-style: italic;

}



/* 900 - Black */

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-Black.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-Black.woff") format("woff");

  font-weight: 900;

  font-style: normal;

}

@font-face {

  font-family: "Poppins";

  src:

    url("/download/b2c_be_nl/fonts/poppins/Poppins-BlackItalic.woff2") format("woff2"),

    url("/download/b2c_be_nl/fonts/poppins/Poppins-BlackItalic.woff") format("woff");

  font-weight: 900;

  font-style: italic;

}