File: /home/xnmprns/www/Pages/galerie.html
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/png" href="/Icon/favicon/favicon-96x96.png" sizes="96x96" />
<link rel="icon" type="image/svg+xml" href="/Icon/favicon/favicon.svg" />
<link rel="shortcut icon" href="/Icon/favicon/favicon.ico" />
<link rel="apple-touch-icon" sizes="180x180" href="/Icon/favicon/apple-touch-icon.png" />
<meta name="apple-mobile-web-app-title" content="MP Rénovation" />
<link rel="manifest" href="/Icon/favicon/site.webmanifest" />
<link rel="stylesheet" href="../Styles/Header.css">
<link rel="stylesheet" href="../Styles/Footer.css">
<link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'>
<link rel="stylesheet" href="../Styles/electricite.css">
<title>Galerie | MP Rénovation</title>
</head>
<body>
<!--? Navbar -->
<nav class="navbar">
<div class="nav-links">
<ul>
<li><a href="../index.html">Accueil</a></li>
<div >
<li class="dropdown" id="services-dropdown">
<a href="javascript:void(0)" onclick="toggleDropdown()">Services</a>
<div class="dropdown-content">
<a href="./murs&plafonds.html">Murs & Plafonds</a>
<a href="./sols&plinthes.html">Sols & Plinthes</a>
<a href="./Ameublement.html">Ameublements</a>
</div>
</li>
</div>
<div class="header-btn-active">
<li><a class="active" href="./galerie.html">Nos réalisations</a></li>
<div class="btn-active"></div>
</div>
<li><a href="./Connaitre.html">Nous connaître</a></li>
<li><a href="./Devis.html">Devis</a></li>
</ul>
</div>
<i class='bx bx-menu'></i>
</nav>
<header></header>
<header class="hdr-volant"></header>
<!--? Navbar -->
<!-- ? Header -->
<div class="header-connai">
<span>Découvrez nos tutoriels et réalisations en vidéo</span>
<a href=""><i class='bx bx-chevron-down'></i></a>
</div>
<!-- ? Fin de Header -->
<div class="Realisation-video">
<div class="Text-realisation">
<i class='bx bx-movie-play'></i>
<span>Nos Réalisations</span>
</div>
<div class="realisation-video-position">
<div class="video-container">
<div>
<video src="../Video/video2.m4v"></video>
<div class="overlay">
<button id="play-button" class="play-button"></button>
</div>
<button id="fullscreen-button" class="fullscreen-button">⛶</button>
</div>
<span>🏠 Rénovation Intérieure</span>
<div>
<p>Peinture</p>
<hr>
<p>Enduit</p>
<hr>
<p>Finitions</p>
</div>
</div>
<div class="video-container">
<div>
<video src="../Video/video1.m4v"></video>
<div class="overlay">
<button id="play-button" class="play-button"></button>
</div>
<button id="fullscreen-button" class="fullscreen-button">⛶</button>
</div>
<span>🏡 Escalier Extérieur</span>
<div>
<p>Marches</p>
<hr>
<p>Murs</p>
<hr>
<p>Rénovation</p>
</div>
</div>
<div class="video-container">
<div>
<video src="../Video/video3.m4v"></video>
<div class="overlay">
<button id="play-button" class="play-button"></button>
</div>
<button id="fullscreen-button" class="fullscreen-button">⛶</button>
</div>
<span>🏡 Rénovation Complète</span>
<div>
<p>Sols</p>
<hr>
<p>Murs</p>
<hr>
<p>Aménagement</p>
</div>
</div>
<div class="video-container">
<div>
<video src="../Video/video4.m4v"></video>
<div class="overlay">
<button id="play-button" class="play-button"></button>
</div>
<button id="fullscreen-button" class="fullscreen-button">⛶</button>
</div>
<span>🏡 Rénovation salle de bain</span>
<div>
<p>Sols</p>
<hr>
<p>Murs</p>
<hr>
<p>Aménagement</p>
</div>
</div>
</div>
</div>
<div class="Realisation-video">
<div class="Text-realisation">
<i class='bx bx-ruler'></i>
<span>Tutoriels & Guides Pratiques</span>
</div>
<div class="realisation-video-position">
<div class="video-container">
<div>
<video src="../Video/Mesure.m4v"></video>
<div class="overlay">
<button id="play-button" class="play-button"></button>
</div>
<button id="fullscreen-button" class="fullscreen-button">⛶</button>
</div>
<span>📐 Prise de Mesures</span>
<div>
<p>Surface</p>
<hr>
<p>Devis</p>
<hr>
<p>Méthode</p>
</div>
</div>
</div>
</div>
<!-- ? Footer -->
<div class="footer">
<hr class="footer-hr">
<div class="footer-Infos">
<div class="footer-mp">
<span>Mp Rénovation</span>
<div>
<p><a href="../index.html">Accueil</a></p>
<p><a href="./Connaitre.html">Qui sommes nous ?</a></p>
</div>
</div>
<div class="footer-services">
<span>Nos Services</span>
<div>
<p><a href="./murs&plafonds.html">Murs et Revêtement</a></p>
<p><a href="./galerie.html">Galerie</a></p>
<p><a href="./sols&plinthes.html">Sols et Plinthes</a></p>
<p><a href="./Ameublement.html">Ameublements</a></p>
</div>
</div>
<div class="footer-information">
<span>Vous informez</span>
<div>
<p><a href="./Devis.html">Devis</a></p>
</div>
</div>
<div class="footer-propos">
<span>à propos</span>
<div>
<p><a href="./mention-legales.html">Mentions légales</a></p>
<p><a href="./CGU.html">Conditions générales <br> d'utilisations</a></p>
</div>
</div>
</div>
</div>
<!-- ? Fin du Footer -->
</body>
<script src="../Script/Header.js"></script>
<script src="../Script/galerie.js"></script>
</html>