*{ 
  margin:0; 
  padding:0; 
  box-sizing:border-box; 
  font-family:Arial; 
} 
 
body{ 
  background:#f5f0e8; 
} 
 
/* HERO */ 
.hero{ 
  background:url('images/smntop.png') center/cover; 
  height:90vh; 
  display:flex; 
  align-items:center; 
  justify-content:center; 
  color:white; 
  text-align:center; 
} 
 
.hero h1{ 
  font-size:clamp(24px,5vw,42px); 
} 
 
.hero span{ 
  font-style:italic; 
} 
 
.btn{ 
  display:inline-block; 
  padding:10px 20px; 
  background:#8fd3d3; 
  color:black; 
  text-decoration:none; 
  margin-top:15px; 
} 
 
.dark{ 
  background:black; 
  color:white; 
} 
 
/* EVENT INFO */ 
.event-info{ 
  display:grid; 
  grid-template-columns:repeat(auto-fit,minmax(100px,1fr)); 
  margin-top:20px; 
} 
 
/* ABOUT */ 
.about{ 
  display:flex; 
  flex-wrap:wrap; 
  padding:40px; 
  gap:20px; 
} 
 
.about-text{ 
  flex:1; 
} 
 
.about-img{ 
  flex:1; 
  display:flex; 
  flex-direction:column; 
  gap:15px; 
} 
 
.about-img img{ 
  width:100%; 
} 
 
/* ACTIVITIES */ 
.activities{ 
  background:#7fbcbc; 
  display:flex; 
  flex-wrap:wrap; 
  padding:40px; 
  gap:20px; 
} 
 
.activity-text{ 
  flex:1; 
} 
 
.activity-img{ 
  flex:1; 
} 
 
.activity-img img{ 
  width:100%; 
} 
 
/* FAQ */ 
.faq{ 
  padding:40px; 
} 
 
.faq-grid{ 
  display:grid; 
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); 
  gap:20px; 
} 
 
.faq-box{ 
  border:1px solid #000; 
  padding:20px; 
  border-radius:10px; 
} 
 
/* TARGET */ 
.target{ 
  background:#7fbcbc; 
  padding:40px; 
} 
 
.target-grid{ 
  display:grid; 
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); 
  gap:20px; 
} 
 
.target img{ 
  width:100%; 
} 
 
/* CONTACT */ 
.contact{ 
  background:black; 
  color:white; 
  padding:40px; 
} 
 
.contact-grid{ 
  display:grid; 
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); 
  gap:20px; 
} 
 
/* MOBILE */ 
@media(max-width:768px){ 
  .about, .activities{ 
flex-direction:column; 
} 
} 