header h1 { margin: 0; font-size: 1.8rem; } nav { margin-top: 10px; } nav a { color: white; text-decoration: none; margin: 0 15px; font-weight: bold; transition: color 0.3s; } nav a:hover { color: #ffcc00; } section { padding: 100px 20px; min-height: 100vh; } .hero { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; } .hero h2 { font-size: 3rem; margin: 0; } .hero p { font-size: 1.2rem; max-width: 600px; margin: 20px auto 0; } .cta { margin-top: 20px; } .cta button { background: #ffcc00; border: none; padding: 10px 20px; font-size: 1rem; font-weight: bold; cursor: pointer; border-radius: 5px; transition: background 0.3s; } .cta button:hover { background: #e6b800; } footer { text-align: center; padding: 20px; background: rgba(0, 0, 0, 0.8); position: relative; } footer p { margin: 0; font-size: 0.9rem; }
The longest night of the year marks a time of reflection, renewal, and celebration. Explore traditions, festivities, and more.
From ancient rituals to modern festivities, the Winter Solstice is celebrated worldwide. Share in the joy and traditions.Celebrations
If you have questions or want to learn more about our events, feel free to reach out. We'd love to hear from you!Contact Us
<script><br>
function scrollToSection(sectionId) {<br>
const section = document.getElementById(sectionId);<br>
if (section) {<br>
window.scrollTo({<br>
top: section.offsetTop - 60, // Offset to account for fixed header<br>
behavior: 'smooth'<br>
});<br>
}<br>
}</p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">header h1 {
margin: 0;
font-size: 1.8rem;
}
nav {
margin-top: 10px;
}
nav a {
color: white;
text-decoration: none;
margin: 0 15px;
font-weight: bold;
transition: color 0.3s;
}
nav a:hover {
color: #ffcc00;
}
section {
padding: 100px 20px;
min-height: 100vh;
}
.hero {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
}
.hero h2 {
font-size: 3rem;
margin: 0;
}
.hero p {
font-size: 1.2rem;
max-width: 600px;
margin: 20px auto 0;
}
.cta {
margin-top: 20px;
}
.cta button {
background: #ffcc00;
border: none;
padding: 10px 20px;
font-size: 1rem;
font-weight: bold;
cursor: pointer;
border-radius: 5px;
transition: background 0.3s;
}
.cta button:hover {
background: #e6b800;
}
footer {
text-align: center;
padding: 20px;
background: rgba(0, 0, 0, 0.8);
position: relative;
}
footer p {
margin: 0;
font-size: 0.9rem;
}
</pre><div class="contentsignin">Copy after login</div></div><div class="contentsignin">Copy after login</div></div>
<p></script>