Create Account - Copy this React, Tailwind Component to your project

modify the next code: body { font-family: 'Arial', sans-serif; color: #333; margin: 0; padding: 0; background-color: #F8CF42; /* Fondo amarillo cálido */ } header { background-color: #42BBF8; /* Azul océano */ padding: 20px; text-align: center; } header img { max-width: 150px; } nav { background-color: #FC9426; /* Naranja vibrante */ padding: 10px; text-align: center; } nav a { color: white; margin: 0 15px; text-decoration: none; font-weight: bold; } section { padding: 20px; background-color: white; } .banner { background-image: url('path-to-your-beach-image.jpg'); background-size: cover; background-position: center; height: 400px; display: flex; justify-content: center; align-items: center; color: white; font-size: 2rem; } .container { max-width: 1200px; margin: auto; overflow: hidden; } h1, h2, h3 { color: #42BBF8; } footer { background-color: #42BBF8; color: white; text-align: center; padding: 10px; } footer p { margin: 0; } /* Secciones principales */ .sections { display: flex; justify-content: space-between; margin-top: 20px; } .section-item { width: 30%; background-color: #F8CF42; padding: 15px; border-radius: 5px; } .section-item h3 { color: #FC9426; } /* Estilos del menú desplegable */ .dropdown { position: relative; display: inline-block; } .dropdown-content { display: none; position: absolute; background-color: #f9f9f9; min-width: 160px; box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2); z-index: 1; } .dropdown-content a { color: black; padding: 12px 16px; text-decoration: none; display: block; text-align: left; } .dropdown-content a:hover { background-color: #ddd; } .dropdown:hover .dropdown-content { display: block; } .dropdown:hover .dropbtn { background-color: #ddd; color: black; }