html, body {
 margin-right: 10px;
 margin-left:10px;
 padding: 2px;
 width: 100%;
 }
 
body {
 font-family: Arial, sans-serif; 
 font-size: 100%; 
 }
h1 {
 font-size: 200%; 
 color: navy; 
  padding-left: 10px;
 text-align: center;
 }
h2 {
 font-size: 100%; 
 font-style: italic;
 color: grey; 
 padding-left: 10px;
  text-align: center;
 }
 
 h3 {
 font-size: 100%; 
 color: black; 
 font-weight: normal;
 text-align: left;
 }
 h4 {
 font-size: 12px; 
 color: black; 
 font-weight: normal;
 text-align: center;
 }
 h5 {
 font-size: 12px; 
 color: red; 
 font-weight: normal;
 text-align: center;
 }
 
 h6 {
 font-size: 12px; 
 color: black; 
 font-weight: normal;
 text-align: left;
 }
 
p,ul,li,td {
 color: black; 
 }

 .align_image img, .align_image span {
  vertical-align: middle;
  display: inline-block;
}

a:link {
 color: navy;
 text-decoration: none;
 }
a:visited {
 color: navy;
 }
a:active {
 color:red;
}
a:hover {
 color: red;
 text-decoration: none;
}

#bloc1{
 font-size: 10px; 
 color: black; 
 font-weight: normal;
 text-align: center;
 }

 #bloc2 {
 margin: auto;
 }
 
 #bloc3{
 font-size: 10px; 
 color: black; 
 font-weight: normal;
 text-align: left;
 }
 
 #blocHTML {
      	width: 800px;
      	height: 700px;
      	overflow: auto;
      	border: 1px solid #000;
      }

 .style-fieldset{text-align: left; border:solid 1px black; border-radius:0px; background-color:#FFFFFF; width:800px; padding:10px 10px 10px 10px; font-family:Arial; font-size:12px; margin-left:10px;}
 .style2-fieldset{text-align: left; border:solid 1px black; border-radius:0px; background-color:#FFFFFF; width:220px; padding:10px 10px 10px 10px; font-family:Arial; font-size:12px; margin-left:10px;}

 .style-legend{font-family:Arial; font-size:14px; font-weight:bold;}
 
 .txt-formulaire{border:solid 1px black; font-family:arial; font-size:12px; padding-left:4px; width:400px;}
 .txt-formulaire:hover{border:solid 1px #AAAAAA;border-color: red;}
 
 .txt2-formulaire{border:solid 1px black; font-family:arial; font-size:12px; padding-left:4px; width:100px;}
 .txt2-formulaire:hover{border:solid 1px #AAAAAA;border-color: red;}
 
 .stxt-formulaire{border:solid 1px black; font-family:arial; font-size:12px; padding-left:4px; width:50px;}
 .stxt-formulaire:hover{border:solid 1px #AAAAAA;border-color: red;}
 
 .lbl-formulaire{font-family:Arial; font-size:12px; width:200px; display:inline-block;}
 .lbl2-formulaire{font-family:Arial; font-size:12px; width:100px; display:inline-block;}
 
 .select-formulaire{font-family:Arial; font-size:12px; width:50px;}
 .select2-formulaire{font-family:Arial; font-size:12px; padding-left:4px; }
 
 .btn-formulaire{padding:2px 2px 2px 2px; cursor:pointer;}
 .btn-formulaire:hover{color:firebrick;}
 
 .chk-formulaire{margin-left:30px;}
 .chk-formulaire:hover{border-color: red;}

a[title]:hover:after {
  content: attr(title);
  padding: 4px 8px;
  color: #333;
  position: absolute;
  left: 0;
  top: 100%;
  white-space: nowrap;
  z-index: 20px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow: 0px 0px 4px #222;
  -webkit-box-shadow: 0px 0px 4px #222;
  box-shadow: 0px 0px 4px #222;
  background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #eeeeee),color-stop(1, #cccccc));
  background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -ms-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -o-linear-gradient(top, #eeeeee, #cccccc);
}

.styled-select select {
   width: 268px;
   padding: 5px;
   font-size: 12px;
   line-height: 100%;
   border: 1;
   border-radius: 0;
   height: 30px;
   -webkit-appearance: none;
   }
 
 
.myText {
  background: #3498db;
  background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
  background-image: -moz-linear-gradient(top, #3498db, #2980b9);
  background-image: -ms-linear-gradient(top, #3498db, #2980b9);
  background-image: -o-linear-gradient(top, #3498db, #2980b9);
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0px;
  font-family: Arial;
  color: #ffffff;
  font-size: 20px;
  padding: 10px 20px 10px 20px;
  border: solid #1f628d 0px;
  text-decoration: none;
}

.myText:hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
  text-decoration: none;
}
.myText:active {
   border-top-color: #1b435e;
   background: #1b435e;
   }

  
#cdc {position:absolute;top:0;left:0;width:165px;margin:0;padding:17px;background-color:#fff;}
#cdc {font-family:Arial;font-size:9px;line-height:9px;color:#000033;border:1px solid gray;}
#cdc table {margin:0px auto;border:0}
#cdc tr {height:16px;text-align:center;}
#cdc td {font-family:Arial;font-size:9px;padding:3px;text-align:center;}
#cdi {font-family:Arial;font-size:9px;font-weight:bold;line-height:9px;padding:0;border:0;color:#fff;width:30px;background:#AD997A}
#cdc span {color:#fff;width:20px;}
#cdc span.fll{float:left}
#cdc span.flr{float:right;}
#cdc a {text-decoration:none;color:#003}
#cdc b.blc{color:#fff}

.CSSTableGenerator {
	margin:0px;padding:0px;
	width:70%;
	box-shadow: 10px 10px 5px #888888;
	border:1px solid #ffffff;
	
	-moz-border-radius-bottomleft:0px;
	-webkit-border-bottom-left-radius:0px;
	border-bottom-left-radius:0px;
	
	-moz-border-radius-bottomright:0px;
	-webkit-border-bottom-right-radius:0px;
	border-bottom-right-radius:0px;
	
	-moz-border-radius-topright:0px;
	-webkit-border-top-right-radius:0px;
	border-top-right-radius:0px;
	
	-moz-border-radius-topleft:0px;
	-webkit-border-top-left-radius:0px;
	border-top-left-radius:0px;
}.CSSTableGenerator table{
    border-collapse: collapse;
        border-spacing: 0;
	width:100%;
	height:100%;
	margin:0px;padding:0px;
}.CSSTableGenerator tr:last-child td:last-child {
	-moz-border-radius-bottomright:0px;
	-webkit-border-bottom-right-radius:0px;
	border-bottom-right-radius:0px;
}
.CSSTableGenerator table tr:first-child td:first-child {
	-moz-border-radius-topleft:0px;
	-webkit-border-top-left-radius:0px;
	border-top-left-radius:0px;
}
.CSSTableGenerator table tr:first-child td:last-child {
	-moz-border-radius-topright:0px;
	-webkit-border-top-right-radius:0px;
	border-top-right-radius:0px;
}.CSSTableGenerator tr:last-child td:first-child{
	-moz-border-radius-bottomleft:0px;
	-webkit-border-bottom-left-radius:0px;
	border-bottom-left-radius:0px;
}.CSSTableGenerator tr:hover td{
	background-color:#d3e9ff;
		

}
.CSSTableGenerator td{
	vertical-align:middle;
	
	background-color:#aad4ff;

	border:1px solid #ffffff;
	border-width:0px 1px 1px 0px;
	text-align:left;
	padding:7px;
	font-size:12px;
	font-family:Arial;
	font-weight:normal;
	color:#000000;
}.CSSTableGenerator tr:last-child td{
	border-width:0px 1px 0px 0px;
}.CSSTableGenerator tr td:last-child{
	border-width:0px 0px 1px 0px;
}.CSSTableGenerator tr:last-child td:last-child{
	border-width:0px 0px 0px 0px;
}
.CSSTableGenerator tr:first-child td{
		background:-o-linear-gradient(bottom, #0057af 5%, #0057af 100%);	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #0057af), color-stop(1, #0057af) );
	background:-moz-linear-gradient( center top, #0057af 5%, #0057af 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#0057af", endColorstr="#0057af");	background: -o-linear-gradient(top,#0057af,0057af);

	background-color:#0057af;
	border:0px solid #ffffff;
	text-align:center;
	border-width:0px 0px 1px 1px;
	font-size:14px;
	font-family:Arial;
	font-weight:bold;
	color:#ffffff;
}
.CSSTableGenerator tr:first-child:hover td{
	background:-o-linear-gradient(bottom, #0057af 5%, #0057af 100%);	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #0057af), color-stop(1, #0057af) );
	background:-moz-linear-gradient( center top, #0057af 5%, #0057af 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#0057af", endColorstr="#0057af");	background: -o-linear-gradient(top,#0057af,0057af);

	background-color:#0057af;
}
.CSSTableGenerator tr:first-child td:first-child{
	border-width:0px 0px 1px 0px;
}
.CSSTableGenerator tr:first-child td:last-child{
	border-width:0px 0px 1px 1px;
}

.info, .success, .warning, .error, .validation {
width: 33%;
border: 1px solid;
margin: 10px 0px;
padding:15px 10px 15px 50px;
text-align:left;
background-repeat: no-repeat;
background-position: 10px center;
}
.info {
color: #00529B;
background-color: #BDE5F8;
background-image: url('../images/info.png');
}
.success {
color: #4F8A10;
background-color: #DFF2BF;
background-image:url('../images/success.png');
}
.warning {
color: #D8000C;
background-color: #FFBABA;
background-image: url('../images/warning.png');
}
.error {
color: #9F6000;
background-color: #FEEFB3;
background-image: url('../images/error.png');
}
.validation {
color: #D63301;
background-color: #FFCCBA;
background-image: url('../images/validation.png');
}

/*CSS style pagination*/
div.pagination {
	padding: 3px;
	margin: 3px;
	text-align:center;
	font-size: 80%; 

}

div.pagination a {
	padding: 2px 5px 2px 5px;
	margin: 2px;
	border: 1px solid #AAAADD;
	
	text-decoration: none; /* no underline */
	color: #000099;
}
div.pagination a:hover, div.digg a:active {
	border: 1px solid #000099;
	color: #000;
}
div.pagination span.current {
	padding: 2px 5px 2px 5px;
	margin: 2px;
	border: 1px solid #000099;
	font-weight: bold;
	background-color: #000099;
	color: #FFF;
}
div.pagination span.disabled {
	padding: 2px 5px 2px 5px;
	margin: 2px;
	border: 1px solid #EEE;
	color: #DDD;
	}

/* gauge */
.jauge {
   margin-left:10px;
   margin-top:10px;
   margin-bottom:10px;
   width:400px;
   height:20px;
   border:2px solid black;
   position : relative;
}
 
.j_barre {
   height:20px;
   background-color:rgb(0,128,0);
   position : absolute;
   top : 0;
   left : 0;
}

.j_barreAlerte {
   height:20px;
   background-color:red; 
   position : absolute;
   top : 0;
   left : 0;
}

.j_libelle {
   text-align:center;
   position : absolute;
   top : 0;
   left : 0;
   width : 100%;
   height:20px;
}