Tijn Lubbers
<body class="bg-gray-100 font-sans leading-normal tracking-normal h-screen flex flex-col"> <header class="bg-white shadow-md"> <div class="max-w-7xl mx-auto px-4 py-4 flex justify-between items-center"> <h1 class="text-3xl font-bold text-blue-600">Schelfhorst Health Initiatives</h1> <nav class="space-x-4"> <a href="#interventions" class="text-gray-700 hover:text-blue-500">Interventions</a> <a href="#agenda" class="text-gray-700 hover:text-blue-500">Agenda</a> <a href="#care" class="text-gray-700 hover:text-blue-500">Care Options</a> </nav> </div> </header> <main class="flex-grow"> <section id="interventions" class="py-10"> <div class="max-w-7xl mx-auto px-4"> <h2 class="text-2xl font-bold mb-6">Our Interventions</h2> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> <div class="bg-white shadow-lg rounded-lg p-6 transition-transform transform hover:scale-105"> <h3 class="text-xl font-semibold mb-2">Physical Activity Programs</h3> <p class="text-gray-600">Join our various physical activity programs designed to enhance your fitness and well-being.</p> </div> <div class="bg-white shadow-lg rounded-lg p-6 transition-transform transform hover:scale-105"> <h3 class="text-xl font-semibold mb-2">Mental Health Workshops</h3> <p class="text-gray-600">Participate in workshops aimed at improving mental health and reducing loneliness.</p> </div> <div class="bg-white shadow-lg rounded-lg p-6 transition-transform transform hover:scale-105"> <h3 class="text-xl font-semibold mb-2">Nutrition Counseling</h3> <p class="text-gray-600">Get personalized nutrition advice to support your health goals.</p> </div> </div> </div> </section> <section id="agenda" class="py-10 bg-gray-50"> <div class="max-w-7xl mx-auto px-4"> <h2 class="text-2xl font-bold mb-6">Upcoming Events</h2> <div class="bg-white shadow-lg rounded-lg p-6"> <ul class="space-y-4"> <li class="flex justify-between"> <span class="font-semibold">Yoga Class</span> <span class="text-gray-600">March 15, 2023</span> </li> <li class="flex justify-between"> <span class="font-semibold">Mental Health Workshop</span> <span class="text-gray-600">March 20, 2023</span> </li> <li class="flex justify-between"> <span class="font-semibold">Nutrition Seminar</span> <span class="text-gray-600">March 25, 2023</span> </li> </ul> </div> </div> </section> <section id="care" class="py-10"> <div class="max-w-7xl mx-auto px-4"> <h2 class="text-2xl font-bold mb-6">Care Options</h2> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> <div class="bg-white shadow-lg rounded-lg p-6 transition-transform transform hover:scale-105"> <h3 class="text-xl font-semibold mb-2">Physiotherapy</h3> <p class="text-gray-600">Professional physiotherapy services to help you recover and maintain mobility.</p> </div> <div class="bg-white shadow-lg rounded-lg p-6 transition-transform transform hover:scale-105"> <h3 class="text-xl font-semibold mb-2">Occupational Therapy</h3> <p class="text-gray-600">Support for individuals to improve their ability to perform daily activities.</p> </div> <div class="bg-white shadow-lg rounded-lg p-6 transition-transform transform hover:scale-105"> <h3 class="text-xl font-semibold mb-2">Counseling Services</h3> <p class="text-gray-600">Access to counseling services for emotional and psychological support.</p> </div> </div> </div> </section> </main> <footer class="bg-white shadow-md"> <div class="max-w-7xl mx-auto px-4 py-4 text-center"> <p class="text-gray-600">© 2023 Schelfhorst Health Initiatives. All rights reserved.</p> </div> </footer> </body>