body{ 
    color: #999999; 
    font: normal 13px/100% Verdana, Tahoma, sans-serif; 
} 

.smalllink a { 
    color: #dddddd; 
    font: normal 9px/100% Verdana, Tahoma, sans-serif; 
} 

.allcenter{
	width:350px;
	height:400px;
	position:absolute;
	left:50%;
	top:50%;
	margin:-325px 0 0 -550px;
}


.allcenterV2{
	width:200px;
	height:400px;
	position:absolute;
	left:50%;
	top:50%;
	margin:-410px 0 0 -450px;
}

a:link {color: gray; 
 text-decoration:none; }
a:visited {color: gray;
 text-decoration:none; }
a:hover, a:focus, a:active {color: black;
 text-decoration:none; }

 /* INFOBULLE  <a class="info" href="#">texte du lien<span>Votre texte de l'info bulle</span></a> *
 a.info{
position:relative;
z-index:24;
color:#000;
text-decoration:none
}
 
a.info:hover{
z-index:25;
background-color:#FFF
}
 
a.info span{
display: none
}
 
a.info:hover span{
display:block;
position:absolute;
width:600px;
   white-space: nowrap; /* On change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non désiré. *
top:2em; left:2em; width:15em;
border:1px solid #000;
background-color:#FFF;
color:#000;
/*text-align: justify;*
text-align: left;
font-weight:none;
padding:5px;
}*/
a.info {
   position: relative;
   color: black;
   text-decoration: none;
   border-bottom: 1px gray dotted; /* On souligne le texte. */
}
a.info span {
   display: none; /* On masque l'infobulle. */
}
a.info:hover {
   background: none; /* Correction d'un bug d'Internet Explorer. */
   z-index: 500; /* On définit une valeur pour l'ordre d'affichage. */

   cursor: help; /* On change le curseur par défaut par un curseur d'aide. */
}
a.info:hover span {
   display: inline; /* On affiche l'infobulle. */
   position: absolute;
text-align: justify;

   white-space: nowrap; /* On change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non désiré. */

   top: 30px; /* On positionne notre infobulle. */
   left: 20px;

   background: white;

   padding: 3px;

   border: 1px solid ;
   border-left: 4px solid ;
}


 
 
#footer {
    position : absolute;
    bottom : 0;
    height : 40px;
	left:50%;
    margin-top : 500px;
    margin-left : -350px;
    font: normal 11px/100% Verdana, Tahoma, sans-serif; 
}
  
h2 {
font-size: 2em;
color: #036;
margin: 0;
padding-top: 1em;
font-weight: normal;
}

h3 {
font-size: 18px;
color: #036;
margin: 0;
padding: 10px;
font-weight: bold;
}
 
/* MENU */

menu {
  font: bold 12px/18px sans-serif;
  color: #fff;
}

ul.menu {
  text-align: left;
  display: inline;
  margin: 0;
  padding: 15px 4px 17px 0;
  list-style: none;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
ul.menu li {
  font: bold 12px/18px sans-serif;
  display: inline-block;
  margin-right: -4px;
  position: relative;
  padding: 15px 20px;
  background: #fff;
  cursor: pointer;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}
ul.menu li:hover {
  background: #555;
  color: #fff;
}
ul.menu li ul {
  padding: 0;
  position: absolute;
  top: 48px;
  left: 0;
  width: 150px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  display: none;
  opacity: 0;
  visibility: hidden;
  -webkit-transiton: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -ms-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  -transition: opacity 0.2s;
}
ul.menu li ul li a:hover{ 
  background: #555; 
  display: block; 
  color: #fff;
  text-shadow: 0 -1px 0 #000;
}
ul.menu li ul li:hover { background: #666; }
ul.menu li:hover ul {
  display: block;
  opacity: 1;
  visibility: visible;
}




/* FORMULAIRE */
.btnaddsubmit {
border:none;
font: bold 30px Verdana;
cursor: pointer;
padding: 0px 0px; 
}

input, textarea, select { 
    padding: 9px; 
    border: solid 1px #E5E5E5; 
    outline: 0; 
    font: normal 13px/100% Verdana, Tahoma, sans-serif; 
    /*width: 200px; */
    background: #FFFFFF; 
} 
textarea { 
    /*width: 260px; 
    max-width: 260px; 
    /*height: 150px; */
    line-height: 150%; 
} 
input:hover, textarea:hover, 
input:focus, textarea:focus { 
    border-color: #C9C9C9; 
} 
.form label { 
    margin-left: 10px; 
    color: #999999; 
} 
.submit input { 
    width: auto; 
    padding: 9px 15px; 
    background: #617798; 
    border: 0; 
    font-size: 14px; 
    Color: #FFFFFF; 
}
.button input { 
    width: auto; 
    padding: 9px 15px; 
    background: #617798; 
    border: 0; 
    font-size: 14px; 
    Color: #FFFFFF; 
}
input, textarea, select { 
    box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px; 
    -moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px; 
    -webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px; 
}

/* TABLEAU EN LISTE */

table.tblist table { 
	color: #333;
	font-family: Helvetica, Arial, sans-serif;
	width: 640px; 
	border-collapse: 
	collapse; border-spacing: 0; 
	color: #CCCCCC; 
}
table.tblist td, th { 
	border: 1px solid transparent; /* No more visible border */
	height: 30px; 
	transition: all 0.3s;  /* Simple transition for hover effect */
}
table.tblist th {
	background: #DFDFDF;  /* Darken header a bit */
	/*font-weight: bold;*/
}
table.tblist td {
	background: #FAFAFA;
	text-align: center;
}
/* Cells in even rows (2,4,6...) are one color */ 
table.tblist tr:nth-child(even) td { background: #F1F1F1; }   
/* Cells in odd rows (1,3,5...) are another (excludes header cells)  */ 
table.tblist tr:nth-child(odd) td { background: #FEFEFE; }  
table.tblist tr td:hover { background: #666; color: #FFF; } /* Hover cell effect! */



table.tbresult table { 
	color: #333;
	font-family: Helvetica, Arial, sans-serif;
	width: 640px; 
	border-collapse: 
	collapse; border-spacing: 0; 
	color: #BBBBBB; 
}
table.tbresult td, th { 
	border: 1px solid transparent; /* No more visible border */
	height: 30px; 
	transition: all 0.3s;  /* Simple transition for hover effect */
}
table.tbresult th {
	background: #DFDFDF;  /* Darken header a bit */
	/*font-weight: bold;*/
}