body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #434548;
	background-color: #f1f1f1;
	padding: 0;
    margin: 0;
}

form {
  padding: 0;
  margin: 0;
}

td {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #434548;
}

/* hides text-align to the left from IE, because the next 2 rules doesn't apply to IE */
html>body td {
  text-align: left;
}

html>body td[align="center"] {
  text-align: center;
}

html>body td[align=center] {
  text-align: center;
}

html>body td[align=right] {
  text-align: right;
}

html>body td[align="right"] {
  text-align: right;
}

*[align="center"] {
  text-align: center;
}

*[align=center] {
  text-align: center;
}

*[align="right"] {
  text-align: right;
}

*[align=right] {
  text-align: right;
}

h2 {
	font-size: 22px;
	font-weight: bold;
	color: #00CCFF;
}

.headbg{
  background-color: #ffffff;
  background-image: url(images/header.jpg);
  background-repeat: no-repeat;
  background-position: center right;
  width: 779px;
  height: 200px; 
}

.headbgbox{
  background-color: #fe3c80;
}

.loginbarbg{
  background-color: #ffffff;
}

.blanc {
	color: #ffffff;
	font-size: 14px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}

a.blanc {
	text-decoration: underline;
	color: #ffffff;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
}

a:hover.blanc {
	text-decoration: underline;
	color: #000000;
}

.module_head, .calendar_module_head {
  font-size: 12px;
  font-weight: bold;
  color: #fd4c8a;
  background-color: #eeeeee;
  border: none;
  height: 23px;
}
.oddrow {
  background-color: #fefefe;
}

.evenrow {
  background-color: #efefef;
}

.evenrow1 {
  background-color: #fbeaf4;
}

.module_head_right {
  background-color: #ffffff;
  font-size: 11px;
  color: #9f8f8c;
}

.module_head_right a {
  background-color: #ffffff;
  font-size: 11px;
  color: #9f8f8c;
}

.module_head_right a:hover {
  background-color: #ffffff;
  font-size: 11px;
  color: #695f5d;
}

td.edituserlink{
  background-color: #e8ecbc;
  color: #695f5d;
  font-weight: bold;
  
}
td.edituserlink a{
  color: #695f5d;
  font-weight: normal;
} 
td.edituserlink a:hover{
  color: #ffffff;
  font-weight: normal;
}

.text_head1 {
  font-size: 14px;
  font-weight: bold;
  color: #aa1aa2;
}
a.text_head1 {
  font-size: 14px;
  font-weight: bold;
  color: #aa1aa2;
}
a:hover.text_head1 {
  font-size: 14px;
  font-weight: bold;
  color: #aa1aa2;
}
.text_head2, .text_head2:hover {
  font-size: 14px;
  font-weight: bold;
  color: #9f8f8c;
}

.offer_head {
  font-size: 16px;
  color: #fe3c80;
}

.leftside_detail {
  width: 190px;
  font-size: 11px;
  font-weight: normal;
  background-color: #e8ecbc;
  border: 0px solid #fd4c8a;
  padding-bottom: 10px;
}

.module_detail, .calendar_module_detail {
  width: 528px;
  font-size: 11px;
  font-weight: normal;
  background-color: #ffffff;
  border-top-width: 0px;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-top-style: solid;
  border-right-style: solid;
  border-bottom-style: solid;
  border-left-style: solid;
  border-top-color: #fe3c80;
  border-right-color: #fe3c80;
  border-bottom-color: #fe3c80;
  border-left-color: #fe3c80;
  float: left;
  margin-bottom: 15px;
}

.module_detail_inside {
  width: 518px;
  font-size: 11px;
  font-weight: normal;
  background-color: #ffffff;
  border-top-width: 0px;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-top-style: none;
  border-right-style: solid;
  border-bottom-style: solid;
  border-left-style: solid;
  border-top-color: #3fbfe8;
  border-right-color: #3fbfe8;
  border-bottom-color: #3fbfe8;
  border-left-color: #3fbfe8;
  float: left;
}

.module_detail_cell {
  width: 258px;
  height: 258px;
  background-image: url(images/cell_fond.gif);
  background-repeat: no-repeat;
  background-position: top center;
  margin-left: 4px;
}

.module_head_small {
  width: 253px;
  height: 33px;
  font-size: 13px;
  font-weight: bold;
  color: #ffffff;
  background-image: url(images/cell_title_small.gif);
  background-repeat: no-repeat;
  background-position: top left;
  border: 0;
  padding-top: 6px;
  padding-left: 15px;
  text-align: left;
  float: left;
}

.module_head_medium {
  width: 520px;
  height: 33px;
  font-size: 13px;
  font-weight: bold;
  color: #ffffff;
  background-image: url(images/cell_title_medium.gif);
  background-repeat: no-repeat;
  background-position: top left;
  border: 0;
  float: left;
  vertical-align: middle;
  padding-left: 15px;
  text-align: left;
}

.module_head_large {
  width: 530px;
  height: 33px;
  font-size: 14px;
  font-weight: bold;
  color: #ffffff;
  background-image: url(images/cell_title_large.gif);
  background-repeat: no-repeat;
  background-position: top left;
  border: 0;
  text-align: center;
  float: left;
  vertical-align: middle;
}

#photosmin {
	width: 95px;
	height: 115px;	
	display: inline;
	float: left;
	background-image: url(images/photo_fond.gif);
  	background-repeat: no-repeat;
  	background-position: top center;
	text-align: center;
	vertical-align: top;
	overflow: hidden;
	margin-left: 5px;
	margin-bottom: 15px;
}

.lienimg {
	border: none;
}

.im_text {
  font-size: 11px;
  font-weight: normal;
  background-color: #fff8f8;
  border-top-width: 1px;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-top-style: solid;
  border-right-style: solid;
  border-bottom-style: solid;
  border-left-style: solid;
  border-top-color: #e8d1cd;
  border-right-color: #e8d1cd;
  border-bottom-color: #e8d1cd;
  border-left-color: #e8d1cd;

}

.picgallery {
	background-color: #FFF8F8;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}

.statusbar {
  background-color: #ffffff;
  width: 251px;
  float: left;
  padding-top: 3px;
}

.statut {
	font-size: 10px;
	font-weight: bold;
}

th {
  font-weight: bold;
  color: #ffffff;
  background-color: #fe3c80;
  font-size: 12px;
}

th a {
  text-decoration: underline;
  color: #695f5d;
}
th a:hover {
  color: #695f5d;
  text-decoration: none;

}

a.subhead {
  text-decoration: underline;
  color: #666666;
  font-weight: bold;
}
a.subhead:hover {
  color: #ffffff;
  text-decoration: none;
  font-weight: bold;
}

.smallpic {
  border: 1px solid #666666;

}

input {
  font-size: 11px;

}
textarea {
  font-size: 11px;
}
select {
  font-size: 11px;
}
.formbutton {
  font-size: 11px;
  color: #ffffff;
  font-weight: bold;
  border-top: 1px solid #cccccc;
  border-right: 1px solid #666666;
  border-bottom: 1px solid #666666;
  border-left: 1px solid #cccccc;
  background-color: #8edff4;
  height: 20px;
}

.main_outer_table{
  background-color: #fefefe;
  background-image: url(images/fond_main.gif);
  background-repeat: repeat-y;
  background-position: top center;

}

a.main_title{
  font-size: 40px;
  color: #ffffff;
  text-decoration: none;
}
a:hover.main_title{
  font-size: 40px;
  color: #ffffff;
  text-decoration: none;
}
.dotted{
  border-bottom-width: 1px;
  border-bottom-style: dashed;
}

.s_table_blue{
  color: #27277e;
  font-weight: bold;
}
.s_table_white{
  color: #27277e;
}

.table_blue{
  background-color: #d3e1fa;
  color: #27277e;
}
.table_white{
  background-color: #ffffff;
  color: #27277e;
}

.table_green{
  background-color: #d8f9d5;
  color: #003300;
}
.table_red{
  background-color: #ffd5d5;
  color: #990000;
}
.table_pink{
  background-color: #ffe1ff;
  color: #7d0067;
}
.table_gray{
  background-color: #efefef;
  color: #333333;
}
.table_yellow{
  background-color: #ffffcc;
  color: #b08d00;
}


.main_text1{
  font-size: 24px;
}

.page_heading {
  font-size: 14pt;
  border: 1px solid #a9bdf1;
  background-color: #dadada;
  text-align: center;
}
.headrow {
  border: 1px solid #a9bdf1;
  background-color: #c8e0fb;
  text-align: center;

}
.text8pt {
  font-size: 8pt;
}
.searchtitle {
  font-size: 14pt;
  font-weight: bold;
  color: #003366;
}
.xtitle {
  font-size: 14pt;
  border: 1px solid #a9bdf1;
  background-color: #dadada;
  text-align: center;

}
.title {
  font-size: 12pt;
  border: 1px solid #a9bdf1;
  background-color: #dadada;
  text-align: left;
  font-weight: bold;
  padding: 4px 4px 4px 11px;
  margin-left: 11px;

}
.subtitle {
  font-size: 10pt;
  color: #003366;
  border: 1px solid #96b0f5;
  background-color: #d7e1ee;
  font-weight: bold;
  padding: 1px;
}

a {
  color: #434548;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

a.menulink {
font-size: 11px;
color: #ff66cc;
text-decoration: none;
}
a.menulink:hover {
font-size: 11px;
color: #ff66cc;
text-decoration: none;
}

.panellinkhdr {
  background-color: #fe3c80;
  font-size: 13px;
  font-weight: bold;
  color: #000000;
}

a.panellink {
  font-size: 11px;
  font-weight: bold;
  text-decoration: none;
  color: #695f5d;
}
a.panellink:hover {
  font-weight: bold;
  font-size: 11px;

  text-decoration: underline;
}
.footer {
  width: 97%;
  background-color: #fbeaf4;
  border-top-width: 1px;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-top-style: solid;
  border-right-style: none;
  border-bottom-style: solid;
  border-left-style: none;
  border-top-color: #695f5d;
  border-right-color: #695f5d;
  border-bottom-color: #695f5d;
  border-left-color: #695f5d;
}
a.footerlink {
font-size: 8pt;
color: #695f5d;
}
a.footerlink:hover {
font-size: 8pt;
color: #695f5d;
}
.copyright{
color: #aaaaaa;
font-size: 11px;
text-decoration: none;
}

.paneltable{
  background-color: #003366;
}
.modulehead{
  color: #003366;
}

.pseudo{
  font-size: 13pt;
  font-weight: bold;
  color: #999999;
}

.storyhead{
  color: #695f5d;
  font-weight: bold;
}
.storydate{
  font-size: 9px;
  color: #695f5d;
  font-style: italic;
}
.storyby{
  color: #695f5d;
}
.storytext{
}

.newshead{
  color: #695f5d;
  font-weight: bold;
}
.newsdate{
  font-size: 9px;
  font-style: italic;
}
.newstext{

}

.pollquestion{
  color: #695f5d;
  font-weight: bold;
}
.polloptions{

}

.payment_mod_head{
  font-size: 11px;
  color: #695f5d;
  background-color: #f7a3f8;
}

.admin_head{
  font-size: 12px;
  color: #695f5d;
  font-weight: bold;
}

h4{
  font-size: 12px;
}

.copyright:hover {
  color: #0000ff;
  font-size: 11px;
  text-decoration: underline;
}

.headerfooter, .headerfooter:hover {          /* style of "xxx's profile", "last logge" */
  color: #695f5d;
  font-size: 12px;
  font-weight: bold;
  height: 20px;
}

.headerfooter:hover {             /* hover: style of "xxx's profile", "last logge" */
  color: #695f5d;
  text-decoration: none;
}

.nickwidth {                /*** width of sections ***/
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	text-align: center;
}

/* Following are added in 2.1.0 for DIV specifications */

.stats_line {
	float: left;
}

.stats_line_outer {
	width: 99%;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 2px;
}

.display_error {
	font-weight: bold;
    background-color: #fbeaf4;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #fe3c80;
	border-right-color: #fe3c80;
	border-bottom-color: #fe3c80;
	border-left-color: #fe3c80;
}

.required_info {
	color: #FF0000;
}

.bloglink_hdr02 {
	float:left; 
	margin: 1px; 
	padding: 4px; 
	text-align: center;
}
 
.colhead {
	font-weight: bold;
	color: #695f5d;
	background-color: #D4E1F6;
	font-size: 11px;

}

.colhead a {
	text-decoration: none;
	color: #695f5d;
}
.colhead a:hover {
	color: #695f5d;
	text-decoration: underline;

}

.panelbox_div {
	line-height:16px; 
	vertical-align:middle;
	padding-left: 6px; 
	padding-right: 3px;
}

.panellinkhdr_div {
	line-height:16px;
	background-color: #fcd9fc;
	font-size: 12px;
	font-weight: bold;
	color: #000000;
	vertical-align:middle;
	padding-left: 6px;
	padding-right: 3px;
	height: 25px;
	border: 1px solid;
	border-top-color: #CCCCCC;
	border-right-color: #CCCCCC;
	border-bottom-color: #FFFFFF;
	border-left-color: #FFFFFF;
}
.panellinkhdr_div a {
	text-decoration: none;
}
a.panellink_div {
	font-size: 11px;
	font-weight: bold;
	text-decoration: none;
	color: #4278D3;
}
.panellink a:hover {
	text-decoration: underline;
}
.signup_line_outer, .line_outer {
	margin-top: 3px;
	margin-left: 6px;
	margin-bottom: 3px;
	margin-right: 4px; 
	vertical-align:middle;
}
.signup_line_leftside {
	float: left;
	width: 188px;
}

.profile_line_leftside {
	float: left;
	width: 35%;
}
.loadsnaps_column {
	float: left;
	width: 49.9%;
	vertical-align: middle;
	text-align: center;
}

.column_head {
	font-weight: bold;
	color: #695f5d;
	background-color: #D4E1F6;
	font-size: 11px;
	line-height: 20px;
	vertical-align: middle;
}

.column_head1 {
	font-weight: bold;
	color: #695f5d;
	background-color: #FFCCFF;
	font-size: 11px;
	line-height: 20px;
	vertical-align: middle;
}

.column_head a, .column_head1 a {
	text-decoration: underline;
	color: #ffffff;
}

.column_head a:hover, .column_head1 a:hover {
	color: #695f5d;
	text-decoration: none;
}

.line_leftside {
	margin-top: 3px;
	margin-left: 6px;
	margin-bottom: 3px;
	margin-right: 2px; 
	vertical-align:middle; 
}

.line_rightside {
	margin-top: 3px;
	margin-left: 2px;
	margin-bottom: 3px;
	margin-right: 4px; 
	vertical-align:middle; 
}

.line_top_bottom_pad {
	padding-top: 2px;
	padding-bottom: 2px;
}

.top_margin_6px {
	margin-top: 6px;
}

.profile_links {
	background-color: #e8ecbc;
	width: 518px;
	color: #695f5d;
	font-size: 12px;
	margin-top: 3px;
	margin-bottom: 10px;
	padding-top: 8px;
	text-align: center;
	border: solid 1px #666666;
}

.profile_links a {
	color: #695f5d;
	font-size: 12px;
	font-weight: bold;
}

.profile_links a:hover {
	color: #ffffff;
	font-size: 12px;
	font-weight: bold;
}

.current_monthday {
        background-color: #FEFEFE;
}

.other_monthday {
        background-color: #EFEFEF;
}
.errors {
	color: #fe3c80;
}
div {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	height:auto;
}

h3 {
	border-top: solid 1px #666666;
	font-size: 12px;
	color: #990066;
}

#login, #nosend, #noread {
	width: 350px;
	height: 240px;
	padding-top: 0px;
	padding-bottom: 8px;
	padding-left: 8px;
	padding-right: 8px;	
	margin: 0;
	border: 0px solid black;
	background-color: white;
	z-index: 101;
}

#coach {
	width: 300px;
	height: 270px;
	padding-top: 0px;
	padding-bottom: 8px;
	padding-left: 8px;
	padding-right: 8px;	
	margin: 0;
	border: 0px solid black;
	background-color: white;
	z-index: 101;
}

.aide {
	font-size: 13px;
	text-align: left;
	font-weight: 100;
}

img.coach {
	border: solid 2px #ffffff;
}

a.big, #box a.big {
	text-decoration: underline;
	color: #fe3c80;
	font-size: 16px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}

a:hover.big, #box a:hover.big {
	text-decoration: underline;
	color: #ffffff;
	font-weight: bold;
}

.formulaireboxtitle {
	width: 100%;
	height: 24px;
	padding: 0;
	margin: 0;
	border-bottom: 1px solid #999999;
	background-color: #fe3c80;
	color: white;
	font-weight: bold;
	text-align: center;
	vertical-align: middle;
}

#login a, #nosend a, #noread a {
	text-decoration: underline;
	color: #aa1aa2;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
}

#login a:hover, #nosend a:hover, #noread a:hover {
	text-decoration: underline;
	color: #000000;
}

.bouton {
	cursor: hand;
}

.rose {
	color: #fe3c80;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
}

ul.listerose li {
	color: #fe3c80;
	list-style-type: disc;
}

ol.listerose li {
	color: #fe3c80;
}

ul.listerose a, ol.listerose a {
	color: #fe3c80;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: underline;
	font-weight: 100;
}

ul.listerose a:hover, ol.listerose a:hover {
	color: #666666;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	font-weight: 100;
}

.pagetexte a {
	color: #000000;
	text-decoration: underline;
	font-weight: 100;
}

.pagetexte a:hover {
	color: #fe3c80;
	text-decoration: none;
	font-weight: 100;
}

a.rose {
	color: #fe3c80;
	font-size: 14px;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: underline;
	font-weight: bold;
}

a:hover.rose {
	color: #ffffff;
	font-size: 14px;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: underline;
	font-weight: bold;
}

.bigrose {
	color: #fe3c80;
	font-size: 16px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}

.huge {
	color: #30a8c3;
	font-size: 24px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 900;
}

.mentionpetit {
	font-size: 11px;
	color: #999999;
}

#box {
	width: 365px;
	padding-top: 0px;
	padding-bottom: 8px;
	padding-left: 8px;
	padding-right: 7px;	
	margin: 0;
	border: 0px solid black;
	background-color: white;
	z-index: 101;
	font-size: 13px;
}
#box a {
	text-decoration: underline;
	color: #fe3c80;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
}
#box a:hover {
	text-decoration: underline;
	color: #000000;
}
.formulaire {
	border: solid 1px #999999;
	background-color: #fedaf2;
}
input.texte {
	height: 13px;
	font-size: 11px;
}

.important {
	border: solid 1px #999999;
	background-color: #fedaf2;
	padding: 10px;
	font-size: 13px;
	text-align: center;
	font-weight: bold;
}

.inscription {
	border: solid 1px #999999;
	background-color: #fe3c80;
	padding: 10px;
	font-size: 13px;
	text-align: center;
	font-weight: bold;
}

.partenaires {
	text-align: center;
}

.partenaires a {
	text-decoration: underline;
}

.partenaires a:hover {
	text-decoration: underline;
	color: #fe3c80;	
}

.level1 {
	background-color: #80EEC1;
}
.level2 {
	background-color: #CBF7C4;
}
.level30 {
	background-color: #00CCFF;
}
.level31 {
	background-color: #88F4F1;
}
.level37 {
	background-color: #D3E6F8;
}
.level314 {
	background-color: #EEFBFB;
}
.level4 {
	background-color: #DFDFDF;
} 
.level5 {
	background-color: #FFCCFF;
}

/* Basic code - don't modify */
 
 #nav { display: block; margin: 0; padding: 0; position: relative; }
  #nav li { display: block; list-style: none; margin: 0; padding: 0; float: left; position: relative;}
  #nav a { display: block;}
  #nav ul { display: none; position: absolute; left: 0; margin: 0; padding: 0; }
  * html #nav ul { line-height: 0; } /* IE6 "fix" */
  	#nav ul a { zoom: 1; } /* IE6/7 fix */
    #nav ul li { float: none; }
    #nav ul ul { top: 0; }
    
/* Essentials - configure this */

#nav ul { width: 155px; }
#nav ul ul { left: 131px; }

/* Everything else is theming */
 
#nav { background-color: transparent; height: 28px; }
#nav *:hover { background-color: none; }
#nav a { border-right: 1px solid white; color: white; font-size: 13px; padding: 8px; line-height: 1; padding-left: 15px; padding-right: 15px; font-weight: bold;}
#nav a:hover { color: #000000; text-decoration: none;}
  #nav li.hover a { background-color: #fe3c80; }
  #nav ul { top: 30px; }
    #nav ul li a { background-color: #30A8C3; font-size: 12px;}
      #nav ul a.hover { background-color: #30A8C3; color: #000000; text-decoration: none;}
   #nav ul a { border-bottom: 1px solid white; border-right: none; opacity: 0.9; filter: alpha(opacity=90); }
/* #nav ul a { border-bottom: none; } - I also needed this for IE6/7 */

/* -----------------------------------------DISCLAIMER SESSION---------------------------------------------- */

div#disclaimer{ text-align:left; }
div#disclaimer-fond{ position:absolute; z-index:1000; width:100%; height:2650px; background:white; filter:alpha(opacity=90); -moz-opacity:0.9; opacity: 0.9; text-align:center; line-height:normal; clear:both; }
div#disclaimer-conteneur{ position:absolute; z-index:1001; width:100%; text-align:center; clear:both; }
div#disclaimer-cadre{ width:510px; margin-left:auto; margin-right:auto; text-align:center; margin-top:200px; padding:15px; font-size:12px; border:#00CCFF 2px solid; background:#fae0fa; color:#00CCFF; }
div#disclaimer-cadre b{ font-size:14px; color:black; }
div#disclaimer-cadre a{ text-decoration:none; font-size:22px; font-weight:bold; color:#00CCFF; }
div#disclaimer-cadre a:hover{ font-size:22px; color:#FFFFFF; }

/* -----------------------------------------INFOBULLES---------------------------------------------- */

a.infobulle, a.infobulle1, a.infobulle2 {
   position: relative;
   color: black;
   text-decoration: none;
   border-bottom: 1px gray dotted; /* on souligne le texte */
}

a.infobulle span, a.infobulle1 span, a.infobulle2 span  {
   display: none; /* on masque l'infobulle */
}

a.infobulle:hover, a.infobulle1:hover, a.infobulle2:hover {
   background: none; /* correction d'un bug IE */
   z-index: 500; /* on définit une valeur pour l'ordre d'affichage */
   cursor: help; /* on change le curseur par défaut en curseur d'aide */
}

a.infobulle:hover span {
   display: inline; /* on affiche l'infobulle */
   position: absolute;
   white-space: normal; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
   width: 350px;
   top: 30px; /* on positionne notre infobulle */
   left: 20px;
   background: white;
   color: green;
   padding: 3px;
   border: 1px solid green;
   border-left: 4px solid green;
}

a.infobulle1:hover span {
   display: inline; /* on affiche l'infobulle */
   position: absolute;
   white-space: normal; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
   width: 350px;
   top: -45px; /* on positionne notre infobulle */
   left: 20px;
   background: white;
   color: green;
   padding: 3px;
   border: 1px solid green;
   border-left: 4px solid green;
   font-weight: bold;
   font-size: 14px;
   z-index: 500;
}

a.infobulle2:hover span {
   display: inline; /* on affiche l'infobulle */
   position: absolute;
   white-space: normal; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
   width: 300px;
   top: 15px; /* on positionne notre infobulle */
   left: 10px;
   background: white;
   color: green;
   padding: 3px;
   border: 1px solid green;
   border-left: 4px solid green;
   padding-top: 15px;
}