Sapito Sucio
<body class="bg-gray-100 font-sans leading-normal tracking-normal"> <!-- Hero Section --> <section class="relative h-screen bg-black"> <video autoplay muted loop class="absolute inset-0 w-full h-full object-cover"> <source src="https://www.placehold.co/1920x1080" type="video/mp4"> </video> <div class="absolute inset-0 bg-black opacity-50"></div> <div class="relative z-10 flex items-center justify-center h-full"> <h1 class="text-white text-6xl font-bold">Grupo Cococo</h1> </div> </section> <!-- Properties Section --> <section class="py-12 bg-white"> <div class="max-w-6xl mx-auto px-4"> <h2 class="text-3xl font-bold mb-8 text-center">Properties</h2> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> <div class="bg-white shadow-lg rounded-lg overflow-hidden"> <img src="https://www.placehold.co/400x300" alt="Property 1" class="w-full h-48 object-cover"> <div class="p-4"> <h3 class="text-xl font-bold">Property 1</h3> <p class="text-gray-600">Location: City A</p> <p class="text-gray-600">Price: $500,000</p> </div> </div> <div class="bg-white shadow-lg rounded-lg overflow-hidden"> <img src="https://www.placehold.co/400x300" alt="Property 2" class="w-full h-48 object-cover"> <div class="p-4"> <h3 class="text-xl font-bold">Property 2</h3> <p class="text-gray-600">Location: City B</p> <p class="text-gray-600">Price: $750,000</p> </div> </div> <div class="bg-white shadow-lg rounded-lg overflow-hidden"> <img src="https://www.placehold.co/400x300" alt="Property 3" class="w-full h-48 object-cover"> <div class="p-4"> <h3 class="text-xl font-bold">Property 3</h3> <p class="text-gray-600">Location: City C</p> <p class="text-gray-600">Price: $1,000,000</p> </div> </div> </div> </div> </section> <!-- Map Section --> <section class="py-12 bg-gray-100"> <div class="max-w-6xl mx-auto px-4"> <h2 class="text-3xl font-bold mb-8 text-center">Our Location</h2> <div class="w-full h-96 bg-gray-300"> <iframe class="w-full h-full" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3151.835434509374!2d144.9537353153167!3d-37.81627977975195!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x6ad642af0f11fd81%3A0xf577d1f9c1b1e0e1!2sFederation%20Square!5e0!3m2!1sen!2sau!4v1611811572000!5m2!1sen!2sau" allowfullscreen="" loading="lazy"></iframe> </div> </div> </section> <!-- Footer Section --> <footer class="bg-gray-800 text-white py-8"> <div class="max-w-6xl mx-auto px-4"> <div class="flex justify-between items-center"> <div> <h3 class="text-xl font-bold">Grupo Cococo</h3> <p class="text-gray-400">© 2023 Grupo Cococo. All rights reserved.</p> </div> <div class="flex space-x-4"> <a href="#" class="text-gray-400 hover:text-white"><i class="iconoir-facebook text-2xl"></i></a> <a href="#" class="text-gray-400 hover:text-white"><i class="iconoir-twitter text-2xl"></i></a> <a href="#" class="text-gray-400 hover:text-white"><i class="iconoir-instagram text-2xl"></i></a> </div> </div> </div> </footer> </body>