File: /home/x/n/m/xnmprns/www/Pages/Confirmation.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" />
<title>Confirmation | MP Rénovation</title>
<link rel="stylesheet" href="../Styles/Header.css">
<link rel="stylesheet" href="../Styles/style.css">
<link rel="stylesheet" href="../Styles/Footer.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/boxicons@latest/css/boxicons.min.css">
<style>
.confirm {
font-family: Arial, sans-serif;
display: flex;
justify-content: center;
align-items: center;
height: auto;
margin: 200px 0px;
}
.container {
text-align: center;
background-color: #fff;
padding: 20px;
border-radius: 8px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.checkmark {
width: 50px;
height: 50px;
border-radius: 50%;
background-color: #4caf50;
position: relative;
margin: 0 auto;
animation: scaleUp 0.4s forwards;
}
.checkmark:after {
content: "";
position: absolute;
width: 10px;
height: 20px;
border: solid white;
border-width: 0 3px 3px 0;
top: 10px;
left: 20px;
transform: rotate(45deg);
opacity: 0;
animation: drawCheck 0.5s forwards;
animation-delay: 0.5s;
}
@keyframes scaleUp {
0% {
transform: scale(0);
}
100% {
transform: scale(1);
}
}
@keyframes drawCheck {
0% {
opacity: 0;
transform: translateY(10px) rotate(45deg);
}
100% {
opacity: 1;
transform: translateY(0) rotate(45deg);
}
}
h2 {
color: #2c3e50;
}
p {
color: #555;
}
</style>
</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>
<li><a href="./galerie.html">Nos réalisations</a></li>
<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 -->
<div class="confirm">
<div class="container">
<div class="checkmark"></div>
<h2>Votre demande de devis a bien été transmise</h2>
<p>Nous vous recontacterons le plus vite possible. Une copie vous a été envoyée. Si vous ne la voyez pas,
pensez à consulter vos indésirables.</p>
</div>
</div>
<!-- ? Footer -->
<div class="footer">
<hr class="footer-hr">
<div class="footer-Infos">
<div class="footer-mp">
<span>Mp Rénovation</span>
<div class="align-left-footer">
<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 class="align-left-footer">
<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 class="align-left-footer">
<p><a href="./Devis.html">Devis</a></p>
</div>
</div>
<div class="footer-propos">
<span>à propos</span>
<div class="align-left-footer">
<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/script.js"></script>
<script src="../Script/Header.js"></script>
</html>