<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<base href="/">
<meta name="viewport" content="initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="google-site-verification" content="y1B_PVRQAlMoLd7La3AlOt_0Ja8Lp-lrkoXGat9-uMA" />
<meta name="google-site-verification" content="C03WwnrJP0FLqf83ibMBA7_N-TLQcwsJaAhqKXppxaE" />
<meta name="description" content="<%= htmlWebpackPlugin.options.description %>" data-react-helmet="true">
<!-- data-helmet pour que React Helmet puisse écraser ce meta par défaut -->
<link href='https://fonts.googleapis.com/css?family=Roboto:300,400,500,600|IBM+Plex+Sans:300,400' rel='stylesheet' type='text/css'>
<link rel="manifest" href="/manifest.webmanifest">
<title>
<%= htmlWebpackPlugin.options.title %>
</title>
<!--[if IE]>
<style>
#outdated-browser {
display: block !important
}
#lds-ellipsis {
display: none !important;
}
</style>
<!--<![endif]-->
<style>
html[data-useragent*='MSIE 10.0'] #outdated-browser {
display: block !important;
}
html[data-useragent*='MSIE 10.0'] #lds-ellipsis {
display: none !important;
}
/* Prevent FOUC effect */
#js {
opacity: 0;
transform: translateY(20px);
}
/* CSS Loader */
#lds-ellipsis {
display: block;
position: relative;
animation: appear 0.6s;
transform: translateY(40vh);
width: 64px;
height: 64px;
margin: auto;
}
#lds-ellipsis div {
position: absolute;
top: 27px;
width: 11px;
height: 11px;
border-radius: 50%;
background: rgb(41, 117, 209);
animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
#lds-ellipsis div:nth-child(1) {
left: 6px;
animation: lds-ellipsis1 0.6s infinite;
}
#lds-ellipsis div:nth-child(2) {
left: 6px;
animation: lds-ellipsis2 0.6s infinite;
}
#lds-ellipsis div:nth-child(3) {
left: 26px;
animation: lds-ellipsis2 0.6s infinite;
}
#lds-ellipsis div:nth-child(4) {
left: 45px;
animation: lds-ellipsis3 0.6s infinite;
}
@keyframes appear {
from {
opacity: 0;
}
60% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes lds-ellipsis1 {
0% {
transform: scale(0);
}
100% {
transform: scale(1);
}
}
@keyframes lds-ellipsis3 {
0% {
transform: scale(1);
}
100% {
transform: scale(0);
}
}
@keyframes lds-ellipsis2 {
0% {
transform: translate(0, 0);
}
100% {
transform: translate(19px, 0);
}
}
</style>
<meta name="theme-color" content="#2975d1">
</head>
<body>
<div id="lds-ellipsis">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
<div id="js"></div>
</div>
<!-- OUTDATED BROWSER WARNING -->
<div id="outdated-browser" style="position: fixed; top: 0; left: 0; bottom: 0; right: 0; display: none;">
<h2 style="margin: 100px auto; max-width: 800px; text-align: center; font-size: 40px; font-family: 'IBM Plex Sans', sans-serif; font-weight: 300;">
<img src="images/marianne.svg" alt="Un service de l'État français" style="width: 200px">
<br /><br /> Votre navigateur n'est pas supporté. Vous pouvez le mettre à jour ou en installer un nouveau depuis <a style="color: #2975d1"
href="http://outdatedbrowser.com/fr">cette page</a></h2>
</div>
<script>
var doc = document.documentElement;
doc.setAttribute('data-useragent', navigator.userAgent);
</script>
<script src="https://use.fontawesome.com/1da10bbdec.js"></script>
<script type="text/javascript">
if (/MSIE \d|Trident.*rv:/.test(navigator.userAgent)) {
// For ie, polyfill everything, as I can't figure what's going on, and which polyfill is missing...
document.write('<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=all"><\/script>');
} else {
document.write(
'<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=default,Intl.~locale.en,Intl.~locale.fr,IntersectionObserver,fetch,Array.prototype.find,Object.values,Number.parseFloat,Array.prototype.includes,Object.entries,Object.values,Object.keys,Math.log2&unknown=polyfill"><\/script>');
}
</script>
</body>
</html>