html {
   height: 100%;
}
Section {
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  text-align: center;
}


body{
  background-color: rgb(36, 43, 40); 
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
 
}
h1 {
  font-size: 40px;
  color: white;
  font-family:Arial, Helvetica, sans-serif;
}

p{
  font-size: 18px;
  color: white;
  font-family:Arial, Helvetica, sans-serif;
  
}

h3{
   font-size: 30px;
   color: white;
   font-family: Arial, Helvetica, sans-serif;
}

.contain{
  margin-left: auto;
  margin-right: auto;
  width: 1024px;
}



header{
  height: 225px;
  text-align: center;
  
}

nav{
  background-color:rgba(66, 66, 66, 0.39);
  text-align: center;
  padding-top: 14px;
  padding-bottom: 14px;
}

main{ 
  height: auto;
  text-align: center;
  padding-left: 240px;
  padding-right: 240px;
  padding-bottom: 20px; /* Reduce bottom padding */
  margin-bottom: 10px; /* Reduce spacing below main */
}


footer{ 
  background-color: rgb(66, 66, 66,0.39);
  text-align: center;
 }

a{
  color: white;
  font-family: Arial, Helvetica, sans-serif;
}

nav a {
  text-decoration: none;
  font-size: 12px;
  padding-left: 10px;
  padding-right: 10px;
}


footer p {
  text-align: center;
  font-size: 14px;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 4px;
  padding-bottom: 4px;
  text-align:center ;
  font-family: Arial, Helvetica, sans-serif;
  color: white;
  font-style: italic;
} 

footer a{
  text-align: center;
  font-size:10px;
  color: white;
  padding-top: 4px;
  padding-bottom: 4px;
}


.video {
  padding-top: 50px;
  padding-bottom: 50px;
  padding-left: 350px;
  padding-right: 350px;


}

.sponsors-grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr); /* Three columns */
   gap: 20px; /* Spacing between images */
   padding: 10px 20px; /* Reduced top and bottom padding */
   justify-items: center;
   margin-top: 0; /* Optional, ensure no extra margin at the top */
}

.sponsor {
   background: white;
   border: 1px solid #ddd;
   border-radius: 10px;
   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
   text-align: center;
   padding: 10px;
   width: 180px;
}
.sponsor img {
   width: 150px;
   height: 150px;
   object-fit: contain;
   display: block;
   margin: 0 auto;
   border-radius: 10px;
   transition: transform 0.3s ease-in-out;
}
.sponsor img:hover {
   transform: scale(1.1);
}
.poster-section img {
   max-width: 80%;
   margin: 0 auto;
   display: block;
   border-radius: 10px;
}
@media (max-width: 768px) {
   nav a {
       font-size: 12px;
       margin: 0 10px;
   }


   main h1, section h1 {
       font-size: 28px;
   }


   section p {
       font-size: 16px;
   }


   .sponsor {
       width: 150px;
   }


   .sponsor img {
       width: 120px;
       height: 120px;
   }
}