body {
	margin: 0;
	padding: 0;
	font-family: arial;
	font-size: 78%;
	color: #B31F00; /* $rouge_FI */
	background-color: #3e3f40;
	background-position: top left;
	line-height: 1.3em;
	scrollbar-3dlight-color: #d0d9db;
	scrollbar-base-color: #D6E5AA;
	scrollbar-darkshadow-color: #becbcd;
	scrollbar-face-color: #eaecee;
	scrollbar-highlight-color: #becbcd;
	scrollbar-shadow-color: #89A2A5;
	scrollbar-track-color: #becbcd;
	scrollbar-arrow-color: #89A2A5;
animation: fadeInAnimation ease 0.7s; 
animation-fill-mode: forwards; 
animation-iteration-count: 1; 
} 
@keyframes fadeInAnimation { 
0% { 
opacity: 0; 
} 
100% { 
opacity: 1; 
} 
	}

h1 {
	font-size: 2.5em;
	font-weight: bold;
	color:#00798C; /* bleu_FI */
	margin-top: 0em;
	margin-bottom: 0em;/*both set to zero and padding in header div is used intead to deal with compound ie pc problems that are beyound summary in a simple comment.*/
	}

h2 {
	font-size: 2em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
	color:#B31F00; /* rouge_FI */
	line-height:30px;
	}

h2.titre {
	background-color: #D9F9FF;
	padding: 10px;
	width: 100%;
	}

h3 {
	font-size: 1.5em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
	color:#00798C; /* bleu_FI */
	}

h3.titre {
	background-color: #D9F9FF;
	padding: 10px;
	width: 500px;
	}

h4 {
	font-size: 1.2em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: normal;
	}

h4.titre {
	background-color: #D9F9FF;
	padding: 10px;
	width: 500px;
	}

h5 {
	font-size: 1.0em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: normal;
	}

h5.titre {
	background-color: #D9F9FF;
	padding: 10px;
	width: 500px;
	box-shadow: 0 0 5px 5px #D9F9FF;
	}

h6 {
	font-size: 0.9em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: normal;
	}

img {
	border: 0;
	}


ul {
	padding: 0;
	margin: 20;
	}

li {
	background-image: url(../images/arrow.png);
	background-repeat: no-repeat;
	background-position: 7px 4px;
	padding-left: 5px;
	margin: .2em 0;
	}

table {
	background-color: #A3D2D9; /* $couleurtable = $bleu_FI_F */
	font-size: 1.0em;
	}

.grp_df {
	padding: 5px;
	background-color: transparent; /* $couleurfond */
	}

.transp {
	padding: 0px;
	background-color: transparent; /* $couleurfond */
	}

.cartouche {
	background-color: #C2EBF2; /* $bleu_FI_M */
	box-shadow: 0 0 25px 25px #C2EBF2;
	}

.qcm {
	background-color: #D9F9FF;
	text-align: justify;
	}

.modeemploi {
	line-height: 1px;
	}

td {
	font-size: 1.0em;
	line-height: 1.6em;
	}

form {
	padding: 0;
	margin: 0;
	}

p {
	font-size: 1.0em;
	margin: 1.2em 0em 1.2em 0em;
	}

.paragr_rc {  /* .parag désigne une classe nommée paragr */
	width:540px; /* Largeur du paragraphe */
	/* Début centrer latéralement dans le conteneur */
	margin-left:auto;
	margin-right:auto;
	/* Fin centrer latéralement dans le conteneur */
	padding:10px; /* Marges intérieures */
	border:1px solid #00AFCB; /* Bordures du paragraphe */
/*	border-radius:10px; /* Arrondir les coins (IE9+, Chrome 10+, Opera 10.5+, Firefox, Safari) */
	text-align: center;
 	background-color: #D9F9FF;
	}
.paragr_rj {  /* .parag désigne une classe nommée paragr */
	width:540px; /* Largeur du paragraphe */
	/* Début centrer latéralement dans le conteneur */
	margin-left:auto;
	margin-right:auto;
	/* Fin centrer latéralement dans le conteneur */
	padding:10px; /* Marges intérieures */
	border:1px solid #00AFCB; /* Bordures du paragraphe */
/*	border-radius:10px; /* Arrondir les coins (IE9+, Chrome 10+, Opera 10.5+, Firefox, Safari) */
	text-align: justify;
 	background-color: #D9F9FF;
	}
.paragr_dc {  /* .parag désigne une classe nommée paragr */
	width:540px; /* Largeur du paragraphe */
	/* Début centrer latéralement dans le conteneur */
	margin-left:auto;
	margin-right:auto;
	/* Fin centrer latéralement dans le conteneur */
	padding:10px; /* Marges intérieures */
	border:0px solid #00AFCB; /* Bordures du paragraphe */
	text-align: center;
 	background-color: #D9F9FF;
	box-shadow: 0 0 5px 5px #D9F9FF;
	}
.paragr_dj {  /* .parag désigne une classe nommée paragr */
	width:540px; /* Largeur du paragraphe */
	/* Début centrer latéralement dans le conteneur */
	margin-left:auto;
	margin-right:auto;
	/* Fin centrer latéralement dans le conteneur */
	padding:10px; /* Marges intérieures */
	border:0px solid #00AFCB; /* Bordures du paragraphe */
	text-align: justify;
 	background-color: #D9F9FF;
	box-shadow: 0 0 5px 5px #D9F9FF;
	}
p.infos {
	width:540px;
	margin-left:auto;
	margin-right:auto;
	padding:10px;
 	background-color: '#cccccc';
 	color: '#B31F00';
	}




img.top { vertical-align: text-top; }
img.bottom { vertical-align: text-bottom; }
img.middle { vertical-align: -11%; }

img.ombre {
  display: inline;
  border:5px solid #fff;
  box-shadow: 7px 7px 3px #ccc;
  -webkit-box-shadow: 7px 7px 3px #ccc;
  -moz-box-shadow: 7px 7px 3px #ccc;
}

img.photo {
  transform-origin: left bottom;
  transition: all .3s;
  border: 0px solid #ccc;
}
img.photo:hover {
  transform: scale(6);
}


/* Links */
a {
	text-decoration: none;
	font-weight: normal;
	color: #00798C; /* bleu_FI */
	}

a:link, a:visited {
	text-decoration: none;
	color: #00798C; /* bleu_FI */
	font-weight: normal;
	}

a:hover {
	color: #B31F00; /* rouge_FI */
	text-decoration: none;
	}

a.info {
	position:relative;
	z-index:24;
	text-decoration:none
	color: #00798C; /* bleu_FI */
	font-family: times;
	}
 
a.info:hover{
	z-index:25;
	background-color:#FFF
	}
 
a.info span{
	display: none
	}
 
a.info:hover span{
	display:block;
	position:absolute;
	top:2em; left:2em; width:28em;
	border:1px solid #000;
	background-color:#FFFEE9;
	color: #B31F00; /* $rouge_FI */
	text-align: justify;
	font-size:0.8em;
	padding:5px;
	}

a.mail {
	font-weight: normal;
}

a.titre {
	font-weight: bold;
}

/* Horizontal Line */
hr {
	color: #C2EBF2; /* bleu_FI */
	}


/* Menu */
/* style pour une ligne de menu */
#menu
{
	font-weight: bold;
	font-size:100%;
	}


#menu ul
{
	background-color:#C84527; /* $rouge_FI */
	margin: 0px;
	text-align: center;
	}

#menu ul.niveau2 {left: 0px; top: 22px;}

#menu ul ul
{
	display: none;
	text-align: center;
	}

#menu li
{
	vertical-align : top;
	display : inline-block;
	margin-left : 0px;
	}

#menu a
{
	font-weight: bold;
	padding-left : 0px;
	padding-right : 20px;
	color: #FFFEE9;
	text-decoration: none;
	}

#menu a.courant
{
	color: #7ecdd9;
	font-size: 1.3em;
	transform: scale(1.8);
	}

#menu a.clas
{
	color: #7ecdd9;
	font-size: 1.7em;
	transform: scale(1.4);
	}

#menu a:hover
{
	font-weight: bold;
	color: #8EC3CB; /* bleu_FI_F */
	}

#menu li:hover ul.niveau2
{
	display: block;
	text-align: left;
	width: 50px;
	}


/* Style boutons 
http://www.supportduweb.com/generateur-boutons-css3-effet-bordure-degrade-bouton-css-ombre-design.html
*/
.bouton {
	padding: 2px 5px;
	margin: 3px 4px;
	display: inline-block;
	color: #B31F00;
	font-size: 110%;
	cursor: pointer;
	background: linear-gradient(top, #D9F9FF 0%, #A3D2D9 100%);
	background: -moz-linear-gradient(top, #D9F9FF 0%, #A3D2D9 100%);
	background: -webkit-linear-gradient(top, #D9F9FF 0%, #A3D2D9 100%);
	background: -o-linear-gradient(top, #D9F9FF 0%, #A3D2D9 100%);
	border: 0px solid #A3D2D9;
}
.bouton:hover {
	color: #C2EBF2;
	border: 0px solid #B31F00;

	background: linear-gradient(top, #f0cdc5 0%, #B31F00 100%);
	background: -moz-linear-gradient(top, #f0cdc5 0%, #B31F00 100%);
	background: -webkit-linear-gradient(top, #f0cdc5 0%, #B31F00 100%);
	background: -o-linear-gradient(top, #f0cdc5 0%, #B31F00 100%);
}
.bouton:active{
	opacity:0.8;
}

.bouton_jaune
	{
	padding: 2px 5px;
	margin: 3px 4px;
	display: inline-block;
	color: #B31F00;
	font-size: 110%;
	cursor: pointer;
	background: linear-gradient(top, #feffd9 0%, #c3c443 100%);
	background: -moz-linear-gradient(top, #feffd9 0%, #c3c443 100%);
	background: -webkit-linear-gradient(top, #feffd9 0%, #c3c443 100%);
	background: -o-linear-gradient(top, #feffd9 0%, #c3c443 100%);
	border: 0px solid #c7c869;
	}
.bouton_jaune:hover {
	color: #C2EBF2;
	border: 0px solid #B31F00;

	background: linear-gradient(top, #f0cdc5 0%, #B31F00 100%);
	background: -moz-linear-gradient(top, #f0cdc5 0%, #B31F00 100%);
	background: -webkit-linear-gradient(top, #f0cdc5 0%, #B31F00 100%);
	background: -o-linear-gradient(top, #f0cdc5 0%, #B31F00 100%);
}
.bouton_jaune:active{
	opacity:0.8;
}

.bouton_rouge
	{
	padding: 2px 5px;
	margin: 3px 4px;
	display: inline-block;
	color: #B31F00;
	font-size: 110%;
	cursor: pointer;
	background: linear-gradient(top, #D9F9FF 0%, #A3D2D9 100%);
	background: -moz-linear-gradient(top, #D9F9FF 0%, #A3D2D9 100%);
	background: -webkit-linear-gradient(top, #D9F9FF 0%, #A3D2D9 100%);
	background: -o-linear-gradient(top, #D9F9FF 0%, #A3D2D9 100%);
	border: 0px solid #A3D2D9;
	}
.bouton_rouge:hover {
	color: #fff;
	font-size: 110%;
	cursor: pointer;
	background: linear-gradient(top, #ffd9d9 0%, #e60000 100%);
	background: -moz-linear-gradient(top, #ffd9d9 0%, #e60000 100%);
	background: -webkit-linear-gradient(top, #ffd9d9 0%, #e60000 100%);
	background: -o-linear-gradient(top, #ffd9d9 0%, #e60000 100%);
	border: 0px solid #ff0000;
	box-shadow: 0 0 2em #f00; /* bleu_FI */
	}
.bouton_rouge:active{
	opacity:0.8;
}

.bouton_rouge_2
	{
	padding: 2px 5px;
	margin: 3px 4px;
	display: inline-block;
	color: #B31F00;
	font-size: 110%;
	cursor: pointer;
	background: linear-gradient(top, #fbe8e8 0%, #fc7070 100%);
	background: -moz-linear-gradient(top, #fbe8e8 0%, #fc7070 100%);
	background: -webkit-linear-gradient(top, #fbe8e8 0%, #fc7070 100%);
	background: -o-linear-gradient(top, #fbe8e8 0%, #fc7070 100%);
	border: 0px solid #A3D2D9;
	}
.bouton_rouge_2:hover {
	color: #fff;
	font-size: 110%;
	cursor: pointer;
	background: linear-gradient(top, #ffd9d9 0%, #ff0000 100%);
	background: -moz-linear-gradient(top, #ffd9d9 0%, #ff0000 100%);
	background: -webkit-linear-gradient(top, #ffd9d9 0%, #ff0000 100%);
	background: -o-linear-gradient(top, #ffd9d9 0%, #ff0000 100%);
	border: 0px solid #ff0000;
	box-shadow: 0 0 2em #f00; /* bleu_FI */
	}
.bouton_rouge:active{
	opacity:0.8;
}

.bouton_vert
	{
	padding: 2px 5px;
	margin: 3px 4px;
	display: inline-block;
	color: #B31F00;
	font-size: 110%;
	cursor: pointer;
	background: linear-gradient(top, #ffe6e4 0%, #70fe82 100%);
	background: -moz-linear-gradient(top, #ffe6e4 0%, #70fe82 100%);
	background: -webkit-linear-gradient(top, #ffe6e4 0%, #70fe82 100%);
	background: -o-linear-gradient(top, #ffe6e4 0%, #70fe82 100%);
	border: 0px solid #A3D2D9;
	}
.bouton_vert:hover {
	color: #fff;
	font-size: 110%;
	cursor: pointer;
	background: linear-gradient(top, #c4e4d1 0%, #009f00 100%);
	background: -moz-linear-gradient(top, #c4e4d1 0%, #009f00 100%);
	background: -webkit-linear-gradient(top, #c4e4d1 0%, #009f00 100%);
	background: -o-linear-gradient(top, #c4e4d1 0%, #009f00 100%);
	border: 0px solid #ff0000;
	box-shadow: 0 0 2em #00ff00; /* bleu_FI */
	}
.bouton_rouge:active{
	opacity:0.8;
}

.icone_ombree
    {
    }
.icone_ombree:hover
    {
	transform: scale(1.7);
	border-radius: 50%;
	box-shadow: 0 0 1.3em #00525e;
    }
.icone_ombree_rouge
    {
    }
.icone_ombree_rouge:hover
    {
	transform: scale(1.7);
	border-radius: 50%;
	box-shadow: 0 0 1.3em #BB0000;
    }
.icone_ombree_verte
    {
    }
.icone_ombree_verte:hover
    {
	transform: scale(1.7);
	border-radius: 50%;
	box-shadow: 0 0 1.3em #006600;
    }
.icone_ombree_orange
    {
    }
.icone_ombree_orange:hover
    {
	transform: scale(1.7);
	border-radius: 50%;
	box-shadow: 0 0 1.3em #cc6600;
    }


.bouton_df
    {
	padding: 2px 5px;
	margin: 3px 4px;
	display: inline-block;
	color: #B31F00;
	font-size: 110%;
	cursor: pointer;
	background: linear-gradient(top, #D9F9FF 0%, #A3D2D9 100%);
	background: -moz-linear-gradient(top, #D9F9FF 0%, #A3D2D9 100%);
	background: -webkit-linear-gradient(top, #D9F9FF 0%, #A3D2D9 100%);
	background: -o-linear-gradient(top, #D9F9FF 0%, #A3D2D9 100%);
	border: 0px solid #A3D2D9;
    }
.bouton_df:hover
    {
	transform: scale(1.8);
	border-radius: 50%;
	box-shadow: 0 0 2em #B31F00;
	color: #C2EBF2;
	border: 0px solid #B31F00;

	background: linear-gradient(top, #f0cdc5 0%, #B31F00 100%);
	background: -moz-linear-gradient(top, #f0cdc5 0%, #B31F00 100%);
	background: -webkit-linear-gradient(top, #f0cdc5 0%, #B31F00 100%);
	background: -o-linear-gradient(top, #f0cdc5 0%, #B31F00 100%);
    }
.bouton_colle
    {
    }
.bouton_colle:hover
    {
	transform: scale(1.4);
	box-shadow: 0 0 2em #B31F00; /* rouge_FI */
    }
.bouton_colle2
    {
    }
.bouton_colle2:hover
    {
	box-shadow: 0 0 2em #B31F00; /* rouge_FI */
    }
.bouton_colle3
    {
    }
.bouton_colle3:hover
    {
	box-shadow: 0 0 2em #00798C; /* bleu_FI */
    }

.bouton-aligne{
	display:inline-block;
	text-align:center;
}
.styled-select select {
	padding: 2px 5px;
	margin: 3px 4px;
	display: inline-block;
	color: #B31F00;
	font-size: 110%;
	cursor: pointer;
	background: linear-gradient(top, #edfcff 0%, #A3D2D9 100%);
	background: -moz-linear-gradient(top, #edfcff 0%, #A3D2D9 100%);
	background: -webkit-linear-gradient(top, #edfcff 0%, #A3D2D9 100%);
	background: -o-linear-gradient(top, #edfcff 0%, #A3D2D9 100%);
	border: 0px solid #A3D2D9;
   }
.styled-select:hover select:hover
    {
	box-shadow: 0 0 2em #00798C; /* bleu_FI */
    }
.styled-select2 select { /* jaune */
	padding: 2px 5px;
	margin: 3px 4px;
	display: inline-block;
	color: #B31F00;
	font-size: 110%;
	cursor: pointer;
	background: linear-gradient(top, #feffd9 0%, #c3c443 100%);
	background: -moz-linear-gradient(top, #feffd9 0%, #c3c443 100%);
	background: -webkit-linear-gradient(top, #feffd9 0%, #c3c443 100%);
	background: -o-linear-gradient(top, #feffd9 0%, #c3c443 100%);
	border: 0px solid #c7c869;
	}
.styled-select2:hover select:hover
    {
	box-shadow: 0 0 2em #90901f; 
    }
.styled-select3 select { /* rouge */
	padding: 2px 5px;
	margin: 3px 4px;
	display: inline-block;
	color: #B31F00;
	font-size: 110%;
	cursor: pointer;
	background: linear-gradient(top, #fff7fe 0%, #ff97f9 100%);
	background: -moz-linear-gradient(top, #fff7fe 0%, #ff97f9 100%);
	background: -webkit-linear-gradient(top, #fff7fe 0%, #ff97f9 100%);
	background: -o-linear-gradient(top, #fff7fe 0%, #ff97f9 100%);
	border: 0px solid #A3D2D9;
   }
.styled-select3:hover select:hover
    {
	box-shadow: 0 0 2em #b36aae; 
    }

.styled-select4 select { /* vert */
	padding: 2px 5px;
	margin: 3px 4px;
	display: inline-block;
	color: #B31F00;
	font-size: 110%;
	cursor: pointer;
	background: linear-gradient(top, #ecffe8 0%, #6ac657 100%);
	background: -moz-linear-gradient(top, #ecffe8 0%, #6ac657 100%);
	background: -webkit-linear-gradient(top, #ecffe8 0%, #6ac657 100%);
	background: -o-linear-gradient(top, #ecffe8 0%, #6ac657 100%);
	border: 0px solid #A3D2D9;
   }
.styled-select4:hover select:hover
    {
	box-shadow: 0 0 2em #529943; 
    }

/* Fixer le menu en haut de la page lors d'un scroll */
.fixMenu
{	z-index: 9;
	position: fixed;
	top: 0;
	width: 100%;
	text-align: justify;
}



/* TextInputEffects
https://tympanus.net/codrops/2015/01/08/inspiration-text-input-effects/
*/
.input {
	position: relative;
	z-index: 1;
	display: inline-block;
	margin: 1em;
	max-width: 300px;
	width: calc(100% - 2em);
	vertical-align: top;
}

.input__field {
	position: relative;
	display: block;
	float: right;
	padding: 0.8em;
	width: 60%;
	border: none;
	border-radius: 0;
	background: #fff;
	color: #aaa;
	font-weight: 400;
	font-family: "Avenir Next", "Helvetica Neue", Helvetica, Arial, sans-serif;
	-webkit-appearance: none; /* for box shadows to show on iOS */
}

.input__field:focus {
	outline: none;
}

.input__label {
	display: inline-block;
	float: right;
	padding: 0 1em;
	width: 40%;
	color: #696969;
	font-weight: bold;
	font-size: 150%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.input__label-content {
	position: relative;
	display: block;
	padding: 1.6em 0;
	width: 100%;
}

.graphic {
	position: absolute;
	top: 0;
	left: 0;
	fill: none;
}

.icon {
	color: #ddd;
	font-size: 150%;
}

/* Individual styles */
/* Kyo */
.input--kyo {
	z-index: auto;
}

.input__field--kyo {
	padding: 0.35em 1.2em;
	width: 100%;
	border-radius: 0em;
	border: 1px solid #A3D2D9;
	color: #B31F00;
	background: #fff;
}

.input__label--kyo {
	z-index: 0;
	padding: 0 .8em 0 0;
	font-size: 0.85em;
	width: 100%;
	text-align: left;
	color: #00798C;
}

.input__label--kyo::after {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1000;
	width: 100%;
	height: 100%;
	background: rgba(95, 135, 140, .70);
	opacity: 0;
	-webkit-transition: opacity 0.3s;
	transition: opacity 0.3s;
	pointer-events: none;
}

.input__label-content--kyo {
	padding: 0em 1em;
}

.input__field--kyo:focus,
.input__field--kyo:focus +  .input__label--kyo .input__label-content--kyo {
	z-index: 10000;
}

.input__field--kyo:focus + .input__label--kyo {
	color: #d3e5e4;
}

.input__field--kyo:focus + .input__label--kyo::after {
	opacity: 1;
}


/*
infobulle
https://red-team-design.developpez.com/tutoriels/css/infobulles-css3/
*/

.tooltip
{
  position: relative;
  cursor: default;
  display: inline-block;
  text-decoration: none;
  color: #222;
  font-weight: normal;
  outline: none;
}

.tooltip span
{
  visibility: hidden;
  position: absolute;
  top: 30px;
  left: 50%;
  z-index: 999;
  padding: 2px;
  border: 2px solid #A3D2D9;
  opacity: .9;
  background-color: #D9F9FF;
  background-image: -webkit-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: -moz-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: -ms-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: -o-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  -moz-border-radius: 4px;
  -moz-box-shadow: 0 2px 4px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,1) inset;
  -webkit-box-shadow: 0 2px 4px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,1) inset;
  box-shadow: 0 2px 4px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,1) inset;
  text-shadow: 0 1px 0 rgba(255,255,255,.4);
}

.tooltip:hover
{
  font-weight: normal;
  border: 0; /* IE6 fix */
}

.tooltip:hover span
{
  visibility: visible;
}

.tooltip span:before,
.tooltip span:after
{
  content: "";
  position: absolute;
  z-index: 1000;
  bottom: 100%;
  left: 50%;
  margin-left: 4px;
  border-top: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid transparent;
}

.tooltip span:before
{
  border-top-color: #ccc;
  top: -8px;
}

.infobulle_rouge
{
  position: relative;
  cursor: default;
  display: inline-block;
  text-decoration: none;
  color: #222;
  font-weight: normal;
  outline: none;
}

.infobulle_rouge span
{
  visibility: hidden;
  position: absolute;
  text-align: center;
  color: #cc0000;
  top: 25px;
  z-index: 999;
  left: 100%;
  padding: 0px;
  padding-left: 4px;
  padding-right: 4px;
	border: 0px solid #ee4f4f;
	background-color: #f6c3c3;
  opacity: .9;
  background-image: -webkit-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: -moz-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: -ms-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: -o-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  -moz-border-radius: 4px;
  -moz-box-shadow: 0 2px 4px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,1) inset;
  -webkit-box-shadow: 0 2px 4px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,1) inset;
  box-shadow: 0 2px 4px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,1) inset;
  text-shadow: 0 1px 0 rgba(255,255,255,.4);
}

.infobulle_rouge:hover
{
  font-weight: bold;
  border: 0; /* IE6 fix */
}

.infobulle_rouge:hover span
{
  font-weight: normal;
  visibility: visible;
}

.infobulle_orange
{
  position: relative;
  cursor: default;
  display: inline-block;
  text-decoration: none;
  color: #222;
  font-weight: normal;
  outline: none;
}

.infobulle_orange span
{
  visibility: hidden;
  position: absolute;
  text-align: center;
  color: #3c3016;
	top: 25px;
  z-index: 999;
  left: 100%;
  padding: 0px;
  padding-left: 4px;
  padding-right: 4px;
	border: 0px solid #b5a47a;
	background-color: #ebeacc;
  opacity: .9;
  background-image: -webkit-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: -moz-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: -ms-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: -o-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  -moz-border-radius: 4px;
  -moz-box-shadow: 0 2px 4px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,1) inset;
  -webkit-box-shadow: 0 2px 4px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,1) inset;
  box-shadow: 0 2px 4px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,1) inset;
  text-shadow: 0 1px 0 rgba(255,255,255,.4);
}

.infobulle_orange:hover
{
  font-weight: bold;
  border: 0; /* IE6 fix */
}

.infobulle_orange:hover span
{
  visibility: visible;
  font-weight: normal;
}

.infobulle_verte
{
  position: relative;
  cursor: default;
  display: inline-block;
  text-decoration: none;
  color: #173b40;
  font-weight: normal;
  outline: none;
}

.infobulle_verte span
{
  visibility: hidden;
  position: absolute;
  text-align: center;
  color: #173b40;
	top: 25px;
  z-index: 999;
  left: 100%;
  padding: 0px;
  padding-left: 4px;
  padding-right: 4px;
	border: 0px solid #588890;
	background-color: #C2EBF2;
  opacity: .9;
  background-image: -webkit-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: -moz-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: -ms-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: -o-linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  background-image: linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,0));
  -moz-border-radius: 4px;
  -moz-box-shadow: 0 2px 4px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,1) inset;
  -webkit-box-shadow: 0 2px 4px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,1) inset;
  box-shadow: 0 2px 4px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,1) inset;
  text-shadow: 0 1px 0 rgba(255,255,255,.4);
}

.infobulle_verte:hover
{
  font-weight: bold;
  border: 0; /* IE6 fix */
}

.infobulle_verte:hover span
{
  visibility: visible;
  font-weight: normal;
}





#menu nav{
    width: 100%;
    margin: 0 auto;
    background-color: white;
    position: sticky;
    top: 0px;
}

#menu nav ul{
    list-style-type: none;
}

#menu nav ul li{
    float: left;
    text-align: center;
    position: relative;
}

#menu nav ul::after{
    content: "";
    display: table;
    clear: both;
}

#menu nav a{
    display: block;
    text-decoration: none;
    color: black;
    border-bottom: 2px solid transparent;
    padding: 10px 0px;
}

#menu nav a:hover{
    color: orange;
    border-bottom: 2px solid gold;
}

#menu .sous{
    display: none;
    box-shadow: 0px 1px 2px #CCC;
    background-color: white;
    position: absolute;
    width: 100%;
    z-index: 1000;
}

#menu nav > ul li:hover .sous{
    display: block;
}

#menu .sous li{
    float: none;
    width: 100%;
    text-align: left;
}

#menu .sous a{
    padding: 10px;
    border-bottom: none;
}

#menu .sous a:hover{
    border-bottom: none;
    background-color: RGBa(200,200,200,0.1);
}

#menu .deroulant > a::after{
    content:" a";
    font-size: 12px;
}

#menu .conteneur{
  margin: 50px 20px;
  height: 1500px;
}

.blink_me {
    -webkit-animation-name: blinker;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    
    -moz-animation-name: blinker;
    -moz-animation-duration: 1s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    
    animation-name: blinker;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

@-moz-keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
}

@-webkit-keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
}

@keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
}