#home {
  position: relative;
  z-index: 0;
}

.intro-content {
  position: relative; 
  padding: 60px 20px;
  background-image: url('../assets/images/background-intro.png'); 
  background-size: cover;
  background-position: center;
  color: white;
  text-align: center;
  height: 110vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  z-index: 1; 
}

.intro-content::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5); 
  z-index: -1; 
}

#home .intro-content h1 {
  position: relative;
  font-size: 3rem;
  color: #27b9ec;
  font-weight: bold;
  margin-bottom: 20px;
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  text-align: left;
  margin-left: 5%;
  margin-bottom: 5px;
}

#home .intro-content p {
    position: relative;
    font-size: 1.2rem;
    margin-bottom: 20px;
    line-height: 1.6;
    max-width: 800px;
    text-align: justify;
    margin-left: 5%;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
}

@media (max-width: 768px) {
    #home .intro-content p {
        text-align: left;
    }
}

/* Mission Section */
.mission {
    background-color: white;
    padding: 40px 0;
    position: relative;
    z-index: 2;
}

.mission-title {
    margin-left: 5%;
    padding-left: 20px;
}

.mission-title h2 {
    font-size: 3rem;
    font-weight: bold;
    color: #333;
    text-align: left;
    margin-bottom: 5vh;
}

.mission-content {
    padding-left: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 auto;
}

.mission-text {
    display: flex;
    align-items: center;
    text-align: left;
    margin-left: 5%;
    height: 100%;
    color: #007bff;
}

.mission-text p {
    margin: 0;
    text-align: justify;
    line-height: 1.8rem;
    padding-bottom: 10%;
}

.mission-image {
    display: flex;
    align-items: center;
    justify-content: center;
}

.mission-image img {
    max-width: 80%;
    width: 65%;
    height: 45%;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
    .mission-title {
        margin-left: 0;
        text-align: center;
    }

    .mission-title h2 {
        font-size: 2.5rem;
        text-align: center;
    }

    .mission-content {
        flex-direction: column;
        align-items: center;
        /* text-align: justify; */
        padding: 0 10%;
    }

    .mission-text {
        margin-left: 0;
        margin-bottom: 5%;
    }

    .mission-text p {
        padding: 0;
        line-height: 1.6rem;
        font-size: 1rem;
        text-align: left;
    }

    .mission-image img {
        width: 90%;
        max-width: 100%;
        height: auto;
    }
}

/*About-us Section*/
.about-us {
  width: 100%;
  padding: 40px 20px;
  box-sizing: border-box;
}

.about-us h1 {
  padding-left: 5%;
  text-align: left;
  font-size: 2.5rem;
  margin-bottom: 40px;
  color: white;
}


.host-HAMIC,
.host-MIM {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  margin-bottom: 40px;
}

.HAMIC-image,
.MIM-image {
  flex: 1;
  text-align: center;
  padding-left: 5%;
}

.HAMIC-image img,
.MIM-image img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.host-HAMIC .text-content,
.host-MIM .text-content {
  flex: 2;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-right: 40px;
}

.host-HAMIC h2,
.host-MIM h2 {
  padding-left: 7.5%;
  font-size: 1.5rem;
  font-weight: bold;
  color: white;
  margin: 0;
}

.host-HAMIC p,
.host-MIM p {
  margin: 0;
  padding-left:7.5%;
  padding-right: 2.5%;
  font-size: 1rem;
  line-height: 1.8;
  text-align: justify;
  color: white;
}

@media (max-width: 768px) {
  .about-us h1 {
    text-align: center;
    font-size: 2rem;
    padding-left: 0;
  }

  .host-HAMIC,
  .host-MIM {
    flex-direction: column; 
    align-items: center;
  }

  .HAMIC-image,
  .MIM-image {
    padding-left: 0; 
  }

  .host-HAMIC h2,
  .host-MIM h2 {
    padding-left: 0;
    text-align: center;
  }

  .host-HAMIC p,
  .host-MIM p {
    padding-left: 5%;
    padding-right: 5%;
    text-align: left;
    font-size: 0.9rem;
  }

  .host-HAMIC .text-content,
.host-MIM .text-content {
    padding-right: 0%;
}
}

/* Timeline */
#timeline {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  /* background: linear-gradient(135deg, #f0f0f0, #ffffff); */
  border-radius: 10px;
  padding: 20px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

#timeline:hover {
  transform: scale(1.02);
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2);
}

#timeline h1 {
  font-size: 2.5rem;
  font-weight: bold;
  margin-bottom: 15px;
  color: white;
  text-align: center;
  animation: fadeIn 0.6s ease-out;
}

#timeline img {
  width: 90%;
  height: auto;
  border-radius: 8px;
  transition: box-shadow 0.3s ease;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

#timeline img:hover {
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3);
}

@media (max-width: 768px) {
  #timeline img.vietnamese {
    content: url('../assets/images/timeline-vi-ver.png'); /* Replace image for mobile */
    width: 100%;
    border-radius: 5px;
  }

  #timeline img.english {
    content: url('../assets/images/timeline-end-ver.png'); /* Replace image for mobile */
    width: 100%;
    border-radius: 5px;
  }

  #timeline h1 {
    font-size: 1.5rem;
    margin-bottom: 10px;
  }

  #timeline {
    padding: 10px;
  }
}

/* Optional: Add animation */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

#timeline {
  animation: fadeIn 0.6s ease-out;
}

/* Sponsors */

.sponsor-text {
  font-size: 3rem; /* Kích thước chữ lớn */
  font-weight: bold;
  /* text-shadow: 
    0 0 5px rgb(150, 176, 176); */
  /*text-transform: uppercase;*/ /* Viết hoa toàn bộ chữ */
  letter-spacing: 5px; /* Khoảng cách giữa các ký tự */
}

.gold-sponsor-text {
  font-size: 2rem; /* Kích thước chữ lớn */
  font-weight: bold;
  color: rgb(237, 255, 167); /* Màu chính của chữ */
  text-shadow: 
  0 0 5px rgb(179, 172, 105), 
  0 0 10px rgb(212, 255, 0), 
  0 0 20px rgb(255, 234, 0);
  letter-spacing: 4px; /* Khoảng cách giữa các ký tự */
}

.silver-sponsor-text {
  font-size: 2rem; /* Kích thước chữ lớn */
  font-weight: bold;
  color: rgb(210, 224, 224); /* Màu chính của chữ */
  text-shadow: 
    0 0 5px rgb(127, 151, 151), 
    0 0 10px rgb(235, 243, 243), 
    0 0 20px rgb(235, 243, 243);
  letter-spacing: 4px; /* Khoảng cách giữa các ký tự */
}

.expertise-sponsor-text {
  font-size: 2rem; /* Kích thước chữ lớn */
  font-weight: bold;
  color: rgb(167, 255, 255); /* Màu chính của chữ */
  text-shadow: 
    0 0 5px rgb(139, 212, 212), 
    0 0 10px #0ff, 
    0 0 20px #0ff;
  letter-spacing: 4px; /* Khoảng cách giữa các ký tự */
}

#sponsor {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 50px 0;
  background-image: url('../assets/images/background-intro.png');
  background-size: cover;
  background-position: center;
  margin-bottom: 1.5rem;
  /* background-color: white; */
}

.sponsor-title {
  font-size: 2rem;
  color: white; 
  margin-bottom: 20px;
  font-weight: bold;
  text-align: center;
}

.sponsor-container {
    display: flex;
    justify-content: center;
    align-items: center;
  width: 50%;
  height:200px;
  padding: 20px;
  /* background: radial-gradient(circle, #f5f5f5,#e4efff,#baceed,#2a5494); */
  /* background-image: url("../assets/images/theme-sponsor.jpg"); */
  background-image: url("../assets/theme.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* @media (prefers-color-scheme: light) {
    .sponsor-container {
        background: radial-gradient(circle, #f5f5f5,#e4efff,#baceed,#2a5494) !important;
    }
}

@media (prefers-color-scheme: dark) {
    .sponsor-container {
        background-image: ;
        background-color: white !important;
    }
} */

.logo-container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 40px;
}

.logo-container img {
  max-width: 210px;
  height: fit-content;
  max-height: 70px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.logo-container .sil {
  max-height: 85px;
}

.logo-container img:hover {
  transform: scale(1.1);
  /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); */
}

/* Judgement */
.icon-block svg {
  width: 100%;
  height: 100%;
}

/* * {
  font-family: Nunito, sans-serif;
} */

.team-cards-inner-container {
  display: flex;
  row-gap: 1.3rem;
  column-gap: 1.3rem;
}

.text-blk {
  color: white;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  line-height: 25px;
}

.text-blk > h1 {
  color: white;
}

.person-name, .person-info {
  color: #333;
}

.responsive-cell-block {
  min-height: 75px;
}

.responsive-container-block {
  min-height: 75px;
  height: fit-content;
  width: 100%;
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  display: flex;
  flex-wrap: wrap;
  margin-top: 0px;
  margin-right: auto;
  margin-bottom: 0px;
  margin-left: auto;
  justify-content: flex-start;
}

.inner-container {
  max-width: 1200px;
  min-height: 100vh;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  justify-content: center;
}

.section-head {
  font-size: 60px;
  line-height: 70px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 24px;
  margin-left: 0px;
}

.section-body {
  font-size: 14px;
  line-height: 18px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 64px;
  margin-left: 0px;
}

.team-cards-outer-container {
  display: flex;
  align-items: center;
}

.content-container {
  display: flex;
  justify-content: flex-start;
  flex-direction: row;
  align-items: center;
  padding-top: 0px;
  padding-right: 25px;
  padding-bottom: 0px;
  padding-left: 0px;
}

.img-box {
  max-width: 130px;
  max-height: 130px;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: hidden;
  margin-top: 0px;
  margin-right: 25px;
  margin-bottom: 0px;
  margin-left: 0px;
}

.card {
  background-color: rgb(255, 255, 255);
  display: flex;
  padding-top: 16px;
  padding-right: 16px;
  padding-bottom: 16px;
  padding-left: 16px;
  box-shadow: rgba(95, 95, 95, 0.1) 6px 12px 24px;
  flex-direction: row;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-right-radius: 15px;
  border-bottom-left-radius: 15px;
}

.card-container {
  max-width: 350px;
}

.card-content-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.person-name {
  font-size: 20px;
  font-weight: 700;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 5px;
  margin-left: 0px;
}

.person-info {
  font-size: 11px;
  line-height: 15px;
}

.card-container {
  max-width: 350px;
}

.outer-container {
  justify-content: center;
  padding-top: 0px;
  padding-right: 50px;
  padding-bottom: 0px;
  padding-left: 50px;
  /* background-color: #FAF8CD; */
}

.person-img {
  width: 100%;
  height: 100%;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
  border-bottom-left-radius: 6px;
}

@keyframes bounce {
  0%,
  20%,
  50%,
  80%,
  100% {
    transform: translateY(0px);
  }

  40% {
    transform: translateY(-30px);
  }

  60% {
    transform: translateY(-15px);
  }

  0%,
  20%,
  50%,
  80%,
  100% {
    transform: translateY(0px);
  }

  40% {
    transform: translateY(-30px);
  }

  60% {
    transform: translateY(-15px);
  }
}

@media (max-width: 1024px) {
  .team-card-container {
    justify-content: center;
  }

  .section-head {
    font-size: 50px;
    line-height: 55px;
  }

  .img-box {
    max-width: 109px;
    max-height: 109px;
  }

  .content-container {
    padding-top: 0px;
    padding-right: 20px;
    padding-bottom: 0px;
    padding-left: 0px;
  }

  .inner-container {
    justify-content: space-evenly;
  }
}

@media (max-width: 768px) {
  .inner-container {
    margin-top: 60px;
    margin-right: 0px;
    margin-bottom: 60px;
    margin-left: 0px;
  }

  .section-body {
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
  }

  .img-box {
    margin-top: 0px;
    margin-right: 30px;
    margin-bottom: 0px;
    margin-left: 0px;
  }

  .content-box {
    text-align: center;
  }

  .content-container {
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 30px;
    margin-left: 0px;
  }

  .card-container {
    max-width: 45%;
  }

  .team-cards-inner-container {
    justify-content: center;
  }
}

@media (max-width: 500px) {
  .outer-container {
    padding-top: 0px;
    padding-right: 60px;
    padding-bottom: 0px;
    padding-left: 60px;
  }

  .section-head {
    font-size: 40px;
    line-height: 45px;
  }

  .content-box {
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
  }

  .section-body {
    font-size: 12px;
  }

  .img-box {
    max-width: 68px;
    max-height: 68px;
  }

  .person-name {
    font-size: 14px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 1px;
    margin-left: 0px;
  }

  .content-box {
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 46px;
    margin-left: 0px;
    text-align: left;
  }

  .content-container {
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
  }

  .card-container {
    max-width: 100%;
  }
}


/* Responsive */
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200;300;400;600;700;800&amp;display=swap');

*,
*:before,
*:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  margin: 0;
}

.wk-desk-1 {
  width: 8.333333%;
}

.wk-desk-2 {
  width: 16.666667%;
}

.wk-desk-3 {
  width: 25%;
}

.wk-desk-4 {
  width: 33.333333%;
}

.wk-desk-5 {
  width: 41.666667%;
}

.wk-desk-6 {
  width: 50%;
}

.wk-desk-7 {
  width: 58.333333%;
}

.wk-desk-8 {
  width: 66.666667%;
}

.wk-desk-9 {
  width: 75%;
}

.wk-desk-10 {
  width: 83.333333%;
}

.wk-desk-11 {
  width: 91.666667%;
}

.wk-desk-12 {
  width: 100%;
}

@media (max-width: 1024px) {
  .wk-ipadp-1 {
    width: 8.333333%;
  }

  .wk-ipadp-2 {
    width: 16.666667%;
  }

  .wk-ipadp-3 {
    width: 25%;
  }

  .wk-ipadp-4 {
    width: 33.333333%;
  }

  .wk-ipadp-5 {
    width: 41.666667%;
  }

  .wk-ipadp-6 {
    width: 50%;
  }

  .wk-ipadp-7 {
    width: 58.333333%;
  }

  .wk-ipadp-8 {
    width: 66.666667%;
  }

  .wk-ipadp-9 {
    width: 75%;
  }

  .wk-ipadp-10 {
    width: 83.333333%;
  }

  .wk-ipadp-11 {
    width: 91.666667%;
  }

  .wk-ipadp-12 {
    width: 100%;
  }
}

@media (max-width: 768px) {
  .wk-tab-1 {
    width: 8.333333%;
  }

  .wk-tab-2 {
    width: 16.666667%;
  }

  .wk-tab-3 {
    width: 25%;
  }

  .wk-tab-4 {
    width: 33.333333%;
  }

  .wk-tab-5 {
    width: 41.666667%;
  }

  .wk-tab-6 {
    width: 50%;
  }

  .wk-tab-7 {
    width: 58.333333%;
  }

  .wk-tab-8 {
    width: 66.666667%;
  }

  .wk-tab-9 {
    width: 75%;
  }

  .wk-tab-10 {
    width: 83.333333%;
  }

  .wk-tab-11 {
    width: 91.666667%;
  }

  .wk-tab-12 {
    width: 100%;
  }
}

@media (max-width: 500px) {
  .wk-mobile-1 {
    width: 8.333333%;
  }

  .wk-mobile-2 {
    width: 16.666667%;
  }

  .wk-mobile-3 {
    width: 25%;
  }

  .wk-mobile-4 {
    width: 33.333333%;
  }

  .wk-mobile-5 {
    width: 41.666667%;
  }

  .wk-mobile-6 {
    width: 50%;
  }

  .wk-mobile-7 {
    width: 58.333333%;
  }

  .wk-mobile-8 {
    width: 66.666667%;
  }

  .wk-mobile-9 {
    width: 75%;
  }

  .wk-mobile-10 {
    width: 83.333333%;
  }

  .wk-mobile-11 {
    width: 91.666667%;
  }

  .wk-mobile-12 {
    width: 100%;
  }
}

/* Register navigator */
.wrapper {
  padding-top: 2.5%;
  padding-left: 2.5%;
  padding-right: 2.5%;
  padding-bottom: 2.5%;
  background-color: white;
}

#register {
  position: relative;
  width: 100%;
  height: 500px; 
  background: url('../assets/images/HAMIC.JPG') no-repeat center center/cover; 
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  text-align: center;
  overflow: hidden;
  border-radius: 25px; 
}

#register::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6); 
  z-index: 1;
}

#register .content {
  position: relative;
  z-index: 2;
  max-width: 75%px;
  padding: 20px;
}

#register h1 {
  font-size: 2.5rem;
  font-weight: bold;
  margin: 0 0 10px;
  background: linear-gradient(90deg, #4fb8ff, #ff8c00, #ff0080, #4fb8ff);
  background-size: 200% 100%; /* Make the gradient larger for smooth animation */
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: gradient-flow 5s infinite linear; 
  text-align: center;
}


@keyframes gradient-flow {
    0% {
        background-position: 0% 50%; /* Start gradient at the beginning */
    }
    100% {
        background-position: 200% 50%; /* Move gradient fully to the right */
    }
}

#register p {
  font-size: 1.5rem;
  margin: 0 0 20px;
  color: #ddd; 
}

#register .cta-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 25px;
  font-size: 1.5rem;
  font-weight: bold;
  color: #fff;
  background-color: #4fb8ff; 
  border: none;
  border-radius: 10px;
  cursor: pointer;
  transition: background-color 0.3s ease, transform 0.2s ease;
}

#register .cta-button:hover {
  background-color: #007bff;
  transform: scale(1.05);
}

#register .cta-button img {
  margin-left: 10px;
  width: 16px;
  height: 16px;
}

#register .cta-button i {
  margin-left: 10px; 
  font-size: 20px; 
}


/* giai thuong */
body {
    /* font-family: Arial, sans-serif; */
    margin: 0;
    padding: 0;
    background-color: #f9f9f9;
    color: #a6c7ff;
}
.prize-container {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}
.prize-section {
    text-align: center;
    margin-bottom: 50px;
}
.prize-section h1 {
    font-size: 2.5rem;
    color: #00b3ff;
}
.prize-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    justify-content: center;
}
.prize-card {
    background-color: #07182e;
    width: 305px;
    height: 583px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border-radius: 20px;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.prize-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
}

.prize-card::after {
    content: '';
    position: absolute;
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
    border-radius: 15px;
    background: #ffffff;
}

.prize-card::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 130%;
    background-image: linear-gradient(180deg, rgb(0, 183, 255), rgb(255, 48, 255));
    animation: rotBGimg 3s linear infinite;
    transition: all 0.2s linear;
}

.prize-card p {
    padding-left: 10px;
    padding-right: 10px;
}

@keyframes rotBGimg {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.prize-card img {
    z-index: 1;
    position: relative;
    width: 80%;
}

.prize-card p {
    z-index: 2;
    color: #07182e;
    font-size: 1.2rem;
    margin-top: 10px;
}

.prize-amount {
    color: #27ae60;
    font-weight: bold;
    font-size: 1.5rem;
    z-index: 2;
    animation: glow 3s infinite alternate, heartbeat 1.2s infinite ease-in-out;
}

@keyframes glow {
    0% {
        text-shadow: 0 0 5px #27ae60, 0 0 10px #27ae60, 0 0 15px #27ae60;
        color: #27ae60;
    }
    25% {
        text-shadow: 0 0 10px #ff5733, 0 0 20px #ff5733, 0 0 30px #ff5733;
        color: #ff5733;
    }
    50% {
        text-shadow: 0 0 10px #3498db, 0 0 20px #3498db, 0 0 30px #3498db;
        color: #3498db;
    }
    75% {
        text-shadow: 0 0 10px #9b59b6, 0 0 20px #9b59b6, 0 0 30px #9b59b6;
        color: #9b59b6;
    }
    100% {
        text-shadow: 0 0 10px #2ecc71, 0 0 20px #2ecc71, 0 0 30px #2ecc71;
        color: #2ecc71;
    }
}

@keyframes heartbeat {
    0% {
        transform: scale(1);
    }
    25% {
        transform: scale(1.1);
    }
    50% {
        transform: scale(1);
    }
    75% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}

@media (max-width: 1350px) {
    .prize-grid {
        grid-template-columns: repeat(4, 1fr);
        justify-content: center;
    }
    .prize-card {
        width: 235px;
        height: 513px;
    }
}

@media (max-width: 1050px) {
    .prize-grid {
        grid-template-columns: repeat(2, 1fr);
        justify-content: center;
    }
    .prize-card {
        width: 330px;
        height: 520px;
    }
}

@media (max-width: 768px) {
    .prize-grid {
        grid-template-columns: 1fr;
        justify-content: center;
    }
    .prize-card {
        width: 484px;
        height: 640px;
        margin: 0 auto;
    }

    .prize-section h1 {
      font-size: 2rem;
    }
    .sponsor-container {
        height: auto;
        width: 80%;
    }
}

@media (max-width: 500px) {
    .prize-card {
        width: 100%;
        height: 550px;
    }
}