@charset "utf-8";
/* CSS Document */
/* CSS pour faire défiler le texte dans le footer*/
/* le block conteneur */
.marquee-rtl-H-D-G {
    max-width: 1520px;
    margin: 0.2em auto 0.2em;
    overflow: hidden;                     /* masque tout ce qui dépasse */
    height: 19px;
    font-family: "Comic Sans MS", cursive;
    font-size: 14px;
    font-weight:bold;
    font-style:italic;
    color: #CC0000;
}
/* le bloc défilant */
.marquee-rtl-H-D-G > :first-child {
  display: inline-block;                /* modèle de boîte en ligne */
  padding-right: 2em;                   /* un peu d'espace pour la transition */
  padding-left: 100%;                   /* placement à droite du conteneur */
  white-space: nowrap;                  /* pas de passage à la ligne */
  animation: defilement-rtl-H-D-G 25s infinite linear;
}
@keyframes defilement-rtl-H-D-G {
  0% {
    transform: translate3d(0,0,0);      /* position initiale à droite */
  }
  100% {
    transform: translate3d(-100%,0,0);  /* position finale à gauche */
  }
}
/* fin du CSS pour faire défiler le texte dans le footer*/
/* CSS pour les message d'avertissement JavaScripts Désactivé et Canvas HTML5 non supprté */
.MsgAlerteJSetCanvasHTML5NonSopprote{
    color: #FF0000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
}
/* Classes CSS pour le menu */
.glossymenu{
	margin: 5px 5px 5px 5x;
	padding: 0px;
	width: 250px; /*width of menu*/
	/*border: 1px solid #9A9A9A;*/
    border: outset #808080 3px;
	/*border-bottom-width: 1px;*/
	background-image: url(../Images/PapierBleu.png);
}
.glossymenu a.menuitem{
	background: black url(../Images/glossybackbleu.gif) repeat-x bottom left;
	box-shadow: inset 1px 1px 2px rgba(255, 255, 255, .6),
                inset -1px -1px 2px rgba(0, 0, 0, .6);
	font: bold 14px "Comic Sans MS";
	text-shadow: 1px 1px 2px #000;
	color: white;
	display: block;
	position: relative; /*To help in the anchoring of the ".statusicon" icon image*/
	width: auto;
	padding-top: 4px;
	padding-left: 2px;
	padding-right: 0px;
	padding-bottom: 4px;
	text-decoration: none;
	border-radius: 7px;
}
.glossymenu a.menuitem:visited, .glossymenu .menuitem:active{
color: white;
}
.glossymenu a.menuitem .statusicon{ /*CSS for icon image that gets dynamically added to headers*/
position: absolute;
top: 5px;
right: 5px;
border: none;
}
.glossymenu a.menuitem:hover{
	background-image: url(../Images/glossybackrose.gif);
	color: #FFFF00;
}
.glossymenu div.submenu{ /*DIV that contains each sub menu*/
	font-size: 10px;
	background-image: url(../Images/PapierBleu.png);
}
.glossymenu div.submenu ul{ /*UL of each sub menu*/
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}
.glossymenu div.submenu ul li{
	border: 2px;
	font-size: 12px;
	font-family: "Comic Sans MS", cursive;
	border-radius: 7px;
	border-color: #008B8B;
	border-style:ridge;
    margin: 2px;
}
.glossymenu div.submenu ul li a{
	display: block;
	background-color:#FFFAF0;
	color: black;
	text-decoration: none;
	padding: 2px;
	font-family: "Comic Sans MS", cursive;
	font-style: normal;
	font-size: 12px;
	border-radius: 5px;
	border: 1px;
}
.glossymenu div.submenu ul li a:hover{
	background-color:#00FF7F;
	color: red;
	font-size: 12px;
    font-weight: bold;
}
.glossymenu div.submenu ul li a:focus{
	background-color:#6A5ACD;
	color: #FFD700;
	font-size: 12px;
    font-weight: bold;
}
.glossymenu div.submenu ul li span{ /* CSS pour ajouter un span de sous catégorie dans un sous menu*/
	background-color:#008080;
	border-radius:7px;
	box-shadow: inset 1px 1px 2px rgba(255, 255, 255, .6),
                inset -1px -1px 2px rgba(0, 0, 0, .6);
	color:#FFFF00;
	display:block;
	font-family:"Comic Sans MS", cursive;
	font-size:14px;
	font-style:italic;
	font-weight:bold;
	/*height:28px;*/
	text-align:center;
	text-shadow: 1px 1px 2px #000;
	padding-top: 4px;
	padding-bottom:4px;
}
.glossyback1{
	background-image: url(../Images/glossybackbleu.gif);
	color: #FFFF00;
}
.glossyback2{
	background-image: url(../Images/glossybackvert.gif);
	color: #FFFF00;
}
.TitreMenu{
	font-family: "Comic Sans MS", cursive;
    background-image: url(../Images/PapierVert.png);
	border-color: #FF0000;
	border-radius: 10px;
	border-style: ridge;
    border-width: 5px;
    color: dodgerblue;
	display: inline-block;
	font-size: large;
	font-style: italic;
	font-weight: bold;
    padding: 6px 0px 8px 0px;
	text-align: center;
	text-shadow: 1px 2px 2px #000;
 	text-transform: capitalize;
    width: 95%;
}
/* Fin des Classes CSS pour le menu */
/* Classes pour stickytooltips */
.stickytooltip_Table{
	border-color:#990000;
	border-style: groove;
	border-radius:10px;
	border-width:3px;
}
.stickytooltip_Header{
	background-color:#0080C0;
	border-radius:8px;
	border-color:#00CCCC;
	border-style:ridge;
	border-width:3px;
	color:#FFFF00;
	font-family:"Comic Sans MS", cursive;
	font-size:13px;
	font-style:italic;
	font-weight:bold;
	text-align:center;
}
.stickytooltip_TD_IUV{
	border-radius:8px;
	border-color:#999999;
	border-style:ridge;
	border-width:3px;
	font-family:"Comic Sans MS", cursive;
	font-size:11px;
	font-style:italic;
	font-weight:bold;
	text-align:center;
}
.stickytooltip_Txt_Noir{
	font-family: "Comic Sans MS", cursive;
	font-size: 11px;
	font-weight: bold;
	text-align: center;
	color: #000000;
}
.stickytooltip_Txt_Noir_Align_G{
	font-family: "Comic Sans MS", cursive;
	font-size: 11px;
	font-weight: bold;
	text-align: left;
	color: #000000;
}
.stickytooltip_Txt_Bleu{
	font-family: "Comic Sans MS", cursive;
	font-size: 11px;
	font-weight: bold;
	color: #0000FF;
}
.stickytooltip_Txt_Rouge{
	font-family: "Comic Sans MS", cursive;
	font-size: 11px;
	font-weight: bold;
	color: #FF0000;
}
.stickytooltip_Txt_Vert{
	font-family: "Comic Sans MS", cursive;
	font-size: 11px;
	font-weight: bold;
	color: #005300;
}
.stickytooltip_Txt_NB_Rouge_Fonce{
	font-family: "Comic Sans MS", cursive;
	font-size: 9px;
	font-weight: normal;
	color: #CC0033;
}
.stickytooltip{
	box-shadow: 5px 5px 8px #818181; /*shadow for CSS3 capable browsers.*/
	-webkit-box-shadow: 5px 5px 8px #818181;
	-moz-box-shadow: 5px 5px 8px #818181;
	position:absolute;
	display:none;
	border-width:5px;/*Border around tooltip*/
	border-color:#004080;
	border-style: groove;
	border-radius:10px;
	background: #FFFAFA;
	padding:2px;
	z-index:3000;
}
.stickytooltip .stickystatus{ /*Style for footer bar within tooltip*/
	background: #000066;
	border-radius:5px;
	color: #FFFF00;
	padding:5px;
	text-align:center;
	font:bold 11px Arial;
}
.TD-separation-stickytooltip-Gris{
	background-color:#999999;
	border-color: #CCCCCC;
	border-radius:5px;
	border-style: ridge;
	border-width: 3px;
	color:#FFD700;
	font-family: 'Comic Sans MS', cursive;
	font-size: 13px;
	font-style:italic;
	font-weight:bold;
	text-align:center;
}
/* Fin des classes stickytooltips */
/* Classes pour les gauges steelseries */
.canvasLedStatut{
	height: 30px;
	width: 30px;
}
.texte_canvasLedStatut {
	border-color:#999999;
	font-family: "Comic Sans MS", cursive;
	font-size: 14px;
	font-weight: bold;
	text-align: left;
	color: #000000;
}
.gauge_texte_mini {
	font-family: "Comic Sans MS", cursive;
	font-size: 10px;
	font-weight: bold;
	text-align: center;
	color: #0000FF;
}
.gauge_texte_maxi {
	font-family: "Comic Sans MS", cursive;
	font-size: 10px;
	font-weight: bold;
	text-align: center;
	color: #CC0000;
}
.gauge_texte_noir {
	font-family: "Comic Sans MS", cursive;
	font-size: 10px;
	font-weight: bold;
	text-align: center;
	color: #000000;
}

.td_EnteteTableauPrevisionPhase{
	border-color:#CCCCCC;
	font-family: "Comic Sans MS", cursive;
	font-size: small;
	font-weight: bold;
	text-align: center;
	color: #CC0033;
}

.td_GaugesCirculaire_Bleu{
	background-image: url(../Images/PapierBleu.png);
	border-color:#EDD110;
	border-radius:10px;
	border-style:groove;
	border-width:1px;
	box-shadow:5px 5px 20px 5px #666666;
	height:230px;
	vertical-align: middle;
	width:230px;
}
.td_GaugesCirculaire_Gris{
	background-image: url("../Images/PapierGris.png");
	border-color:#EDD110;
	border-radius:10px;
	border-style:groove;
	border-width:1px;
	box-shadow:5px 5px 20px 5px #666666;
	height:240px;
	vertical-align: middle;
	width:240px;
}
.td_GaugesCirculaire_Jaune{
	background-image: url("../Images/PapierJaune.png");
	border-color:#EDD110;
	border-radius:10px;
	border-style:groove;
	border-width:1px;
	box-shadow:5px 5px 20px 5px #666666;
	height:240px;
	vertical-align: middle;
	width:240px;
}
.td_GaugesCirculaire_Rouge{
	background-image: url(../Images/PapierRouge.png);
	border-color:#EDD110;
	border-radius:10px;
	border-style:groove;
	border-width:1px;
	box-shadow:5px 5px 20px 5px #666666;
	height:230px;
	vertical-align: middle;
	width:230px;
}

.td_GaugesCirculaire_Vert{
	background-image: url("../Images/PapierVert.png");
	border-color:#EDD110;
	border-radius:10px;
	border-style:groove;
	border-width:1px;
	box-shadow:5px 5px 20px 5px #666666;
	height:240px;
	vertical-align: middle;
	width:240px;
}
.td_GaugesLineaireVertical_Bleu{
	background-image: url(../Images/PapierBleu.png);
	border-color:#EDD110;
	border-radius:10px;
	border-style:groove;
	border-width:1px;
	box-shadow:5px 5px 20px 5px #666666;
	height:260px;
	vertical-align: middle;
	width:240px;
}
.canvasCirculaire{
	vertical-align: top;
	border-radius:210px;
	box-shadow:3px 3px 5px 3px #666666;
	height: 220px;
	width: 220px;
	cursor:url(../Images/Oeil.cur),pointer;
}
.canvasCirculaireSansOeuil{
	vertical-align: top;
	border-radius:210px;
	box-shadow:3px 3px 5px 3px #666666;
	height: 220px;
	width: 220px;
}
.canvasLineaireVertical{
	border-radius: 10px;
	box-shadow:3px 3px 5px 3px #666666;
	height: 250px;
	width: 140px;
	cursor:url(../Images/Oeil.cur),pointer;
}
.canvasLineaireHorizontal{
	border-radius: 10px;
	box-shadow:3px 3px 5px 3px #666666;
	height: 140px;
	width: 230px;
	cursor:url(../Images/Oeil.cur),pointer;
}
/* Fin des Classes pour les gauges steelseries */
/* CSS pour les mini graphiques*/
.TD_Header_Tooltip_MiniGraph {
	background-color:#0080C0;
	border-radius:3px;
	border-color:#00CCCC;
	border-style:ridge;
	border-width:3px;
	color:#FFFF00;
	font-family:"Comic Sans MS", cursive;
	font-size:10px;
	font-style:italic;
	font-weight:bold;
	text-align:center;
	padding:5px;
}
.texte_dans_div_extreme_minigraph {
	font-family: "Comic Sans MS", cursive;
	font-size: 11px;
	font-weight: bold;
	text-align: center;
	color: #000000;
}
.extreme_maxi_minigraph {
	font-family: "Comic Sans MS", cursive;
	font-size: 11px;
	font-weight: bold;
	text-align: left;
	color: #FF0000;
}
.extreme_mini_minigraph {
	font-family: "Comic Sans MS", cursive;
	font-size: 11px;
	font-weight: bold;
	text-align: left;
	color: #0000FF;
}




/* fin CSS pour les mini graphiques*/


/* CSS communs à toutes les pages*/
.TableConteneurPrincipal{
    width: auto;
    max-width: 1524px;
}
.TD_Header_Tooltip {
	background-color:#0080C0;
	border-radius:3px;
	border-color:#00CCCC;
	border-style:ridge;
	border-width:5px;
	color:#FFFF00;
	font-family:"Comic Sans MS", cursive;
	font-size:12px;
	font-style:italic;
	font-weight:bold;
	text-align:center;
	padding:5px;
}
.TD-separation-tooltip {
	background-color:#CC0066;
	border-color: #00CCCC;
	border-radius:3px;
	border-style: ridge;
	border-width: 3px;
	color:#FFFF00;
	font-family: 'Comic Sans MS', cursive;
	font-size: 12px;
	font-style:italic;
	font-weight:bold;
	text-align:center;
}
.TD-separation-tooltip-BleuClair {
	background-color:#5BCAFF;
	border-color: #00CCCC;
	border-radius:3px;
	border-style: ridge;
	border-width: 3px;
	color:#FFFF00;
	font-family: 'Comic Sans MS', cursive;
	font-size: 12px;
	font-style:italic;
	font-weight:bold;
	text-align:center;
}
.TD-separation-tooltip-Drapeau-Francais-curseur-main {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#0055a4+0,0055a4+33,ffffff+36,ffffff+63,ef4135+66,ef4135+100 */
	background: #0055a4; /* Old browsers */
	background: -moz-linear-gradient(left,  #0055a4 0%, #0055a4 33%, #ffffff 36%, #ffffff 63%, #ef4135 66%, #ef4135 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #0055a4 0%,#0055a4 33%,#ffffff 36%,#ffffff 63%,#ef4135 66%,#ef4135 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #0055a4 0%,#0055a4 33%,#ffffff 36%,#ffffff 63%,#ef4135 66%,#ef4135 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0055a4', endColorstr='#ef4135',GradientType=1 ); /* IE6-9 */
	border-color: #000099;
	border-radius:3px;
	border-style: ridge;
	border-width: 3px;
	color:#FFCC00;
	font-family: 'Comic Sans MS', cursive;
	font-size: 12px;
	font-style:italic;
	font-weight:bold;
	text-align:center;
	text-shadow: 1px 1px 1px #666666;
	cursor: pointer;
}
.TD-separation-tooltip-Drapeau-Francais {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#0055a4+0,0055a4+33,ffffff+36,ffffff+63,ef4135+66,ef4135+100 */
	background: #0055a4; /* Old browsers */
	background: -moz-linear-gradient(left,  #0055a4 0%, #0055a4 33%, #ffffff 36%, #ffffff 63%, #ef4135 66%, #ef4135 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #0055a4 0%,#0055a4 33%,#ffffff 36%,#ffffff 63%,#ef4135 66%,#ef4135 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #0055a4 0%,#0055a4 33%,#ffffff 36%,#ffffff 63%,#ef4135 66%,#ef4135 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0055a4', endColorstr='#ef4135',GradientType=1 ); /* IE6-9 */
	border-color: #000099;
	border-radius:3px;
	border-style: ridge;
	border-width: 3px;
	color:#FFCC00;
	font-family: 'Comic Sans MS', cursive;
	font-size: 12px;
	font-style:italic;
	font-weight:bold;
	text-align:center;
	text-shadow: 1px 1px 1px #666666;
}
.TD-separation-tooltip-Normale-NASA {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#094c99+0,378ed6+33,378dd3+66,094c99+100 */
	background: #094c99; /* Old browsers */
	background: -moz-linear-gradient(left,  #094c99 0%, #378ed6 33%, #378dd3 66%, #094c99 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #094c99 0%,#378ed6 33%,#378dd3 66%,#094c99 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #094c99 0%,#378ed6 33%,#378dd3 66%,#094c99 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#094c99', endColorstr='#094c99',GradientType=1 ); /* IE6-9 */
	border-color: #000099;
	border-radius:3px;
	border-style: ridge;
	border-width: 3px;
	color:#FFCC00;
	font-family: 'Comic Sans MS', cursive;
	font-size: 12px;
	font-style:italic;
	font-weight:bold;
	text-align:center;
	text-shadow: 1px 1px 1px #666666;
}
.TD_Rouge_Erreur_JSON_MF{
    background-color: #FF0004;
    color: #F8FF00;
    font-family: 'Comic Sans MS', cursive;
    font-size: 14px;
    padding-top: 3px;
    padding-bottom: 3px;
}
.TD-prevision-tooltip-meteogram {
	background-color:#80FF80;
    background-image:url("../Images/glossybackbleu.gif");
	border-color: #CC0000;
	border-radius:3px;
	border-style: ridge;
	border-width: 3px;
	color:#000000;
	font-family: 'Comic Sans MS', cursive;
	font-size: 12px;
	font-style:italic;
	font-weight:bold;
	text-align:center;
}
.txt_noir_14px_gras_centre {
	font-family: "Comic Sans MS", cursive;
	font-size: 14px;
	font-weight: bolder;
	text-align: center;
	color: #000000;
}
.txt_rouge_14px_gras_centre {
	font-family: "Comic Sans MS", cursive;
	font-size: 14px;
	font-weight: bolder;
	text-align: center;
	color: #FF0000;
}
.txt_noir_14px_gras_gauche {
	font-family: "Comic Sans MS", cursive;
	font-size: 14px;
	font-weight: bold;
	text-align: left;
	color: #000000;
}
.txt_noir_14px_gras_justifie {
	font-family: "Comic Sans MS", cursive;
	font-size: 14px;
	font-weight: bold;
	text-align: justify;
	color: #000000;
}
.txt_bleu_14px_gras_centre {
	font-family: "Comic Sans MS", cursive;
	font-size: 14px;
	font-weight: bolder;
	text-align: center;
	color: #0000FF;
}
.txt_noir_11px_gras_gauche{
	font-family: "Comic Sans MS", cursive;
	font-size: 11px;
	font-weight: bold;
	text-align: left;
	color: #000000;
}
.txt_bleu_11px_gras_gauche{
	font-family: "Comic Sans MS", cursive;
	font-size: 11px;
	font-weight: bold;
	text-align: left;
	color: #0000FF;
}
.extreme_maxi {
	font-family: "Comic Sans MS", cursive;
	font-size: 14px;
	font-weight: bolder;
	text-align: left;
	color: #FF0000;
}
.extreme_mini {
	font-family: "Comic Sans MS", cursive;
	font-size: 14px;
	font-weight: bolder;
	text-align: left;
	color: #0000FF;
}
.extreme_moyen {
	font-family: "Comic Sans MS", cursive;
	font-size: 14px;
	font-weight: bolder;
	text-align: left;
	color: #008000;
}
.txt_noir_11px_gras_centre{
	font-family: "Comic Sans MS", cursive;
	font-size: 11px;
	font-weight: bold;
	text-align: center;
	color: #000000;
}
.extreme_maxi_11px {
	font-family: "Comic Sans MS", cursive;
	font-size: 11px;
	font-weight: bolder;
	text-align: left;
	color: #FF0000;
}
.extreme_mini_11px {
	font-family: "Comic Sans MS", cursive;
	font-size: 11px;
	font-weight: bolder;
	text-align: left;
	color: #0000FF;
}
.extreme_moyen_11px {
	font-family: "Comic Sans MS", cursive;
	font-size: 11px;
	font-weight: bolder;
	text-align: left;
	color: #008000;
}
.TD-ImageVigilance-curseur-main {
	cursor: pointer;
	width:50px;
}
.TitreDePage {
	font-family: "Comic Sans MS", cursive;
	border: medium ridge #69F;
	font-size: large;
	font-style: italic;
	font-weight: bold;
	text-transform: capitalize;
	color: #F00;
	text-shadow: 1px 2px 2px #000;
	border-radius: 10px;
	border-style: groove;
	background-color: #FFC;
	border-color: #09F;
	display: inline-block;
	text-align: center;
	padding-bottom: 8px;
	padding-left: 8px;
	padding-right: 8px;
	padding-top: 6px;
	
}
.Texte_Nota_Bene_Gauche{
	font-family: "Comic Sans MS", cursive;
	font-size: small;
	font-weight: bold;
	text-align: left;
	color: #CC0033;
}
.Texte_Nota_Bene_Centre{
	font-family: "Comic Sans MS", cursive;
	font-size: small;
	font-weight: bold;
	text-align: center;
	color: #CC0033;
}
.Texte_Nota_Bene_Centre_Rouge{
	font-family: "Comic Sans MS", cursive;
	font-size: small;
	font-weight: bold;
	text-align: center;
	color: #FF0000;
}
.SelecteurAnnee{
    align-items: center;
    background-color:lightgray;
    border-color:deepskyblue;
    border-radius: 15px;
    border-style: ridge;
    border-width: 5px;
    display: inline-flex;
    font-family: "Comic Sans MS", cursive;
    font-weight: bold;
    padding: 5px;
}
/* Bouton Voir Valeur */
.ButtonVoirValeur_Highmaps_3D {
    border: 0;
    line-height: 3;
    padding: 0 20px;
	font-family: "Comic Sans MS", cursive;
    font-size: 14px;
	font-weight: bold;
    text-align: center;
    color: #FFD700;
    text-shadow: 2px 2px 2px #404040;
    border-radius: 7px;
    background-color: rgba(135, 206, 250, 1);
    background-image: linear-gradient(to top left,
                                      rgba(0, 0, 0, .2),
                                      rgba(0, 0, 0, .2) 30%,
                                      rgba(0, 0, 0, 0));
    box-shadow: inset 2px 2px 3px rgba(255, 255, 255, .6),
                inset -2px -2px 3px rgba(0, 0, 0, .6);
}
.ButtonVoirValeur_Highmaps_3D:hover {
    background-color: rgba(255, 215, 0, 1);
    color: #8B0000;
}
