html {
scroll-behavior: smooth}

body
{font-family:verdana, arial,sans-serif;
font-size:1em;
margin:0;
background:#d7d9d7;
color:#5a5d50}

a:link
{padding:4px 6px;
text-decoration:none;
outline:none 0;
color:#5a5d50;
-webkit-box-shadow:0 0 0 rgba(0, 0, 0, 0);
box-shadow:0 0 0 rgba(0, 0, 0, 0);
transition:all ease .7s;
-webkit-transition:all ease .3s}

a:visited{
color:#5a5d50}

a:hover{
background-color:#fff;
-webkit-box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3);
box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3);
transition:all ease .3s;
-webkit-transition:all ease .3s}

a:active{
color:indianred}

i
{color:#982222}

a:hover i
{color:red}

input:-moz-read-only
{border:1px solid #eaecea;
outline:0 none;
font-size:1em;
font-family:verdana, arial,sans-serif;
background:#eaecea;
color:#5a5d50;
margin-top:3px;
margin-bottom:15px;
margin-left:0;
margin-right:0}

input:read-only
{border:1px solid #eaecea;
outline:0 none;
font-size:1em;
font-family:verdana, arial,sans-serif;
background:#eaecea;
color:#5a5d50;
margin-top:3px;
margin-bottom:15px;
margin-left:0;
margin-right:0}

#barre
{z-index:5;
display:block;
position:absolute;
top:512px;
left:0;
width:1230px;
background:transparent;
text-align:left;
font-size:0.7em}

#barre_in
{display:inline-block;
position:relative;
top:1px;
width:815px;
height:6px;
background:#fff;
border:1px solid #aaa;
text-align:left;
margin-right:10px}

#temoin
{display:inline-block;
position:absolute;
height:6px;
background:linear-gradient(to right,lime,indianred)}

#bande
{z-index:5;
display:block;
position:fixed;
width:1230px;
height:10px;
top:0;
left:50%;
margin-left:-614px;
background:#d7d9d7}

#fond-agr
{z-index:7;
display:block;
position:fixed;
top:0;
background:#eaecea;
cursor:pointer;
width:100%;
height:100%}

#fond-agr img
{max-width:100%;
max-height:100%}

.agr_0
{visibility:hidden;
opacity:0;
transition:all ease 1s}
 
.agr_1
{visibility:visible;
opacity:1;
transition:all ease 1s}

#agrandissement
{z-index:8;
position:absolute;
margin:auto;
top:0;
right:0;
bottom:0;
left:0}

#fond
{z-index:5;
-webkit-box-shadow: 12px 12px 12px rgba(0, 0, 0, 0.3);
box-shadow: 12px 12px 12px rgba(0, 0, 0, 0.3);
display:block;
position:fixed;
top:10px;
left:50%;
margin-left:-614px;
width:1230px;
height:500px;
background:#eaecea;
font-size:1em}

.p_0
{margin-top:0;
transition:margin-top ease .7s;
-webkit-transition:margin-top ease .7s}

.p_1
{margin-top:-160px;
transition:margin-top ease .7s;
-webkit-transition:margin-top ease .7s}

.p_2
{margin-top:-160px;
transition:margin-top ease .7s;
-webkit-transition:margin-top ease .7s}

#titre
{z-index:5;
display:block;
position:absolute;
top:0;
right:0;
margin:0 15px 0 0;
width:240px;
height:220px;
padding:15px 0;
background:#eaecea;
color:#5a5d50;
text-align:right;
font-size:0.8em}

#titre::first-line
{display:inline-block;
position:relative;
font-size:2.6em;
line-height:1.6em}

#legende
{z-index:5;
display:block;
position:absolute;
top:140px;
right:0;
margin:0 15px 0 0;
width:240px;
height:240px;
padding:15px 0;
background:#eaecea;
text-align:right;
color:#5a5d50}

#legende::first-line
{font-size:2.5em}

#nomenclat
{z-index:5;
display:block;
position:absolute;
top:390px;
right:0;
margin:0;
width:240px;
padding-right:15px;
background:#eaecea;
text-align:right;
color:#5a5d50;
cursor:pointer;
font-size:0.8em}

.survol
{display:inline-block;
position:relative;
width:226px;
margin-left:-25px;
padding:6px;
-webkit-box-shadow:0 0 0 rgba(0, 0, 0, 0);
box-shadow:0 0 0 rgba(0, 0, 0, 0);
transition:all ease .7s;
-webkit-transition:all ease .3s}

.survol:hover
{background:#fcfcfc;
-webkit-box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3);
box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3);
transition:all ease .3s;
-webkit-transition:all ease .3s;}

#fond-content
{z-index:4;
display:block;
position:fixed;
left:50%;
margin-left:-614px;
width:1200px;
text-align:right;
padding:20px 15px 0 15px;
background:#eaecea;
font-size:0.8em}

.n_0
{top:245px;
-webkit-box-shadow:0 0 0 rgba(0, 0, 0, 0);
box-shadow:0 0 0 rgba(0, 0, 0, 0);
transition:all ease .7s;
-webkit-transition:all ease .7s}

.n_1
{top:350px;
-webkit-box-shadow:12px 12px 12px rgba(0, 0, 0, 0.3);
box-shadow:12px 12px 12px rgba(0, 0, 0, 0.3);
transition:all ease .7s;
-webkit-transition:all ease .7s}

.n_2
{top:85px;
-webkit-box-shadow:0 0 0 rgba(0, 0, 0, 0);
box-shadow:0 0 0 rgba(0, 0, 0, 0);
transition:all ease .7s;
-webkit-transition:all ease .7s}

#copy
{margin-left:10px;
padding:2px 4px;
border:1px solid #c6cbc6;
cursor:pointer;
-webkit-box-shadow:0 0 0 rgba(0, 0, 0, 0.3);
box-shadow:0 0 0 rgba(0, 0, 0, 0.3);
transition:all ease .1s;
-webkit-transition:all ease .1s}

#copy:hover
{background:#fcfcfc;
-webkit-box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3);
box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3);
transition:all ease .1s;
-webkit-transition:all ease .1s}

#copy:active
{-webkit-box-shadow:2px 2px 2px rgba(0, 0, 0, 0.3);
box-shadow:2px 2px 2px rgba(0, 0, 0, 0.3);
transition:all ease 0s;
-webkit-transition:all ease 0s}

#global
{display:block;
position:relative;
width:1222px;
padding:15px 0;
background:#d7d9d7;
margin:0 auto 100px auto}

#diaporama
{z-index:4;
display:block;
position:absolute;
top:0;
left:0;
margin:0;
width:960px;
height:500px;
background:#eaecea}

#diaporama span
{z-index:4;
display:inline-block;
position:absolute;
bottom:15px;
left:480px;
margin-left:-41px;
background:#fcfcfc;
width:80px;
padding:3px 3px 6px 3px;
text-align:center;
border:1px solid #ccc;
cursor:pointer;
font-size:0.8em;
-webkit-box-shadow:0 0 0 rgba(0, 0, 0, 0);
box-shadow:0 0 0 rgba(0, 0, 0, 0);
transition:all ease .7s;
-webkit-transition:all ease .3s;
visibility:hidden;
opacity:0}

#diaporama:hover span
{visibility:visible;
-webkit-box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3);
box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3);
transition:all ease .7s;
-webkit-transition:all ease .3s;
opacity:1}

#diaporama img
{position:absolute;
margin:auto;
top:0;
right:0;
bottom:0;
left:0;
max-width:100%;
max-height:470px;
cursor:pointer}

#miniat
{display:block;
position:relative;
margin-top:500px;
margin-left:-3px;
margin-bottom:15px}

.vignet
{z-index:1;
display:inline-block;
position:relative;
width:auto;
max-height:100px;
overflow:hidden;
margin:0 -3px -3px 0;
cursor:pointer;
border:3px solid #fff;
-webkit-box-shadow:0 0 0 rgba(0, 0, 0, 0);
box-shadow:0 0 0 rgba(0, 0, 0, 0);
-webkit-filter:grayscale(100%);
filter:grayscale(100%)}

.vignet:hover
{z-index:2;
-webkit-box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3);
box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3);
-webkit-filter:grayscale(0);
filter:grayscale(0)}

.allume
{z-index:3;
-webkit-box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3);
box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3);
-webkit-filter:grayscale(0);
filter:grayscale(0);
border-color:indianred}

.allume:hover
{z-index:3;
border-color:indianred}

.vu
{-webkit-box-shadow:0 0 0 rgba(0, 0, 0, 0);
box-shadow:0 0 0 rgba(0, 0, 0, 0);
-webkit-filter:grayscale(0);
filter:grayscale(0)}

.vu:hover
{-webkit-box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3);
box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3);}

.encours
{border:3px solid blue}

.cont
{display:inline-block;
position;relative;
margin-top:5px;
color:#5a5d50;
padding:6px 12px 6px 6px}

.turquoise
{display:inline-block;
width:13px;
height:13px;
border-radius:50%;
background:turquoise}

.red
{display:inline-block;
width:13px;
height:13px;
border-radius:50%;
background:red}

.lime
{display:inline-block;
width:13px;
height:13px;
border-radius:50%;
background:lime}

.rubrik
{display:inline-block;
position:relative;
padding:4px 0;
margin:32px 0 3px 0}

.contact
{display:inline-block;
position:relative;
margin-top:5px;
word-spacing:0.4em;
letter-spacing:0.1em}

.ref
{z-index:2;
display:inline-block;
position:absolute;
left:-31px;padding:3px 5px;
background:#eaecea}

#fra-opened
{display: inline-block;
position:relative;
padding:2px 4px;
background-color:#6b8e23;
color:white}

#eng-opened
{display: inline-block;
position:relative;
padding:2px 4px;
background-color:#6b8e23;
color:white}

#carte-opened-0{
z-index:1;
position:absolute;
top:0;
left:0;
border:3px solid #fff;
-webkit-box-shadow:4px 4px 6px rgba(0, 0, 0, 0.6);
box-shadow:4px 4px 6px rgba(0, 0, 0, 0.6);}

#carte-opened-1{
z-index:2;
position:absolute;
top:0;
left:0;
border:3px solid #fff}

#boutique{
position:fixed;
bottom:15px;
right:15px;
z-index:10;
padding:6px 8px;
cursor:pointer;
color:#5a5d50;
background-color:#fff;
-webkit-box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3);
box-shadow:6px 6px 6px rgba(0, 0, 0, 0.3)}