* { margin: 0; padding: 0; box-sizing: border-box; } body { margin: 0; padding: 0; padding-top: 80px; font-family: 'Arial', sans-serif; background-color: #F2F2F2; flex-direction: column; min-height: 100vh; } .navbar { background-color: #4A305A; padding: 10px; display: flex; justify-content: space-between; align-items: center; position: fixed; width: 100%; top: 0; z-index: 1000; /* Assure que l'en-tête reste au-dessus du contenu */ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Ajoute une ombre légère pour le style */ } .logo img { width: 4.7cm; height: 1.7cm; margin-left: 1cm; } .reserve-btn { background-color: #FFB039; padding: 10px 20px; border-radius: 10px; color: #4A305A; } .burger-menu { display: none; cursor: pointer; } .burger-menu div { width: 25px; height: 3px; background-color: white; margin: 6px 0; } .nav-links.show { top: 80px; /* Permet de baisser le menu burger pour ne pas couper le logo */ } @media screen and (max-width: 768px) { .nav-links { display: none; flex-direction: column; align-items: center; position: absolute; top: 60px; left: 0; width: 100%; background-color: #4A305A; z-index: 1; } .nav-links.show { display: flex; } .nav-link { margin: 10px 0; } .burger-menu { display: block; } .footer-content { flex-direction: column; align-items: center; } .footer-section { margin: 10px 0; } .footer-signature img { width: 3cm; height: 1.2cm; margin-left: 0.5cm; } } .content { max-width: 1380px; margin: 15px auto; padding: 0 20px; background-color: white; border-radius: 10px; box-shadow: 0 0 20px rgba(0, 0, 0, 0.1); } h2 { color: #4A305A; text-align: center; } p { color: #333; font-size: 16px; line-height: 1.5; } #scrollTopBtn { display: none; position: fixed; bottom: 20px; right: 20px; background-color: #FFB039; border: none; border-radius: 5px; font-size: 25px; padding: 10px; cursor: pointer; } .footer { background-color: #4A305A; /* Couleur de fond du pied de page */ color: white; padding: 20px; /* Hauteur du pied de page */ text-align: center; } .footer p { color: white; } .footer-content { display: flex; justify-content: space-around; } .footer-section { text-align: center; margin: 10px; } .footer-signature { order: 1; } .logo-reseaux { display: flex; align-items: center; justify-content: center; /* Centrer les icônes sur les petits écrans */ margin-top: 10px; /* Ajouter une marge pour séparer les icônes du texte */ } .logo-reseaux img { width: 30px; height: 30px; } .footer-section h3 { margin-bottom: 10px; } .footer-section a { color: white; } .footer-section img { width: 30px; height: 30px; margin-right: 5px; } /* MENU DROPDOWN -> Pour à propos*/ .dropdown { position: relative; display: inline-block; } .dropdown-content { display: none; position: absolute; background-color: #FFB039; box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1); border-radius: 8px; z-index: 1; } .dropdown-content a { text-decoration: none; padding: 12px 16px; display: block; transition: background-color 0.3s, color 0.3s; } .dropdown:hover .dropdown-content { display: block; } /*Couleur des éléments de la nav bar Accueil, Menu, À propos ... */ .nav-links a { color: white; text-decoration: none; /*Enlève le soulignement hyperlink*/ margin: 0 15px; } /* Couleur de survol de Accueil, Menu, À propos, and Contact */ .nav-links a:hover, .dropdown:hover .dropdown-btn { color: #FFB039; } /* Couleur du survol de Réserver une table, FAQ, Nos chefs, Nos fournisseurs, Nos équipes */ .nav-link.reserve-btn:hover, .dropdown-content a:hover { color: #4A305A; }