/* ------------------------- page accueil + default ----------------------------- */

	#principale div, #principale img, #principale span {
		border: 0px solid #000;
		/*border: 1px solid #000;*/
	}

	body {
		margin: 0;
		height: 100%;
		background-color: #7E8A96;
		font-family: Verdana;
		font-size: 12px;
	}
	
	/* Bloc du haut, avec logo et onglets */
	#frameHaut {
		width: 100%;
		height: 120px;
		margin: 0 auto;
	}
	#haut {
		width: 900px;
		height: 120px;
		margin: 0 auto;
	}
	#haut .bloc {
		float: left;
		margin: 0;
	}
	#haut #bloc01 {
		width: 300px;
		height: 78px;
	}
	#haut #bloc02 {
		width: 590px;
		height: 78px;
	}
	#haut #bloc02 #accroche {
		margin-top: 20px;
		margin-left: 71px;
	}
	#haut #bloc03 {
		width: 373px;
		height: 40px;
	}
	#haut #bloc04 {
		width: 552px;
		height: 40px;
		margin-left: -30px;
	}
	#haut #bloc04 img {
		cursor: pointer;
		margin-top: 10px;
		margin-left: 1px;
		margin-right: 1px;
		position: relative;
		float: right;
		width: 136px;
		height: 32px;
	}
	#haut #bloc04 img#bloc_4_img_1 {
		left: 24px;
	}
	#haut #bloc04 img#bloc_4_img_2 {
		left: 16px;
	}
	#haut #bloc04 img#bloc_4_img_3 {
		left: 8px;
	}
	#haut #bloc04 img#bloc_4_img_4 {
		left: 0px;
		margin-right: 0px;
	}
	/* lien pour se connecter */
	#haut #bloc03 #lien_connexion {
		position: relative;
		top: 10px;
		left: -3px;
	}
	/* zone de connexion */
	#haut #bloc03 #div_connexion {
		height: 38px;
		width: 374px;
	}
	/* popup du site */
	#popup {
		padding: 4px;
		color: #838486;
	}
	#popup_content_body {
		width: 438px;
	}
	
	#content {
		width: 100%;
		margin: 0 auto;
		top: 120px;
		background-color: #FFF;
	}
	
	#principale {
		width: 900px;
		overflow: hidden;
		margin: 0 auto;
		color: #797979;
		background-color: #FFF;
	}
	/* DIV de gauche de l'accueil */
	#principale #gauche {
		float: left;
		width: 428px;
		height: 100%;
	}
	#principale #gauche img {
		margin: 10px 6px 10px 0px;
	}
	#principale #gauche img.nomarginbottom {
		margin-bottom: 0px;
		float: left;
	}	
	#principale #gauche img.nomargintop {
		margin-top: 0px;
	}	
	/* Pavé droit avec le texte et les boutons dans la page d'accueil */
	#principale #pave_droit {
		float: left;
		width: 472px;
		height: 100%;
	}
	#principale #pave_droit .marginBottom {
		margin-bottom: 27px;
	}
	#principale #pave_droit .marginRight {
		margin-right: 15px;
	}
	#principale #pave_droit .marginHor {
		margin-left: 15px;
		margin-right: 15px;
	}
	#principale #pave_droit .marginLeft {
		margin-left: 15px;
	}
	#principale #pave_droit .marginTopSmall {
		margin-top: 4px;
	}
	#principale #pave_droit .marginTopBig {
		margin-top: 40px;
	}
	/* Crédits en bas de page */
	#bas {
		height: 18px;
		color: #FFF;
		background-color: #7E8A96;
		width: 100%;
		font-size: 10px;
		padding-top: 6px;
		text-align: center;
		margin: 0 auto;
		background: url('../../include/img/bck_site.gif') 0 0 repeat-x #7E8A96;
	}
	
	/* ------------------------- page comprendre ----------------------------- */
	
	/* DIV de gauche de la page comprendre */
	#principale #gauche2 {
		float: left;
		width: 270px;
		height: 100%;
		padding: 10px 10px 10px 0px;
		/*margin-top: 10px;*/
		/*margin-left: 10px;*/
	}
	#tarifs {
		margin-top: 20px;
	}
	#droite {
		float: left;
		width: 600px;
		padding: 10px 0px 10px 10px;
		overflow: visible;
	}
	td.titre {
		width: 230px;
		vertical-align: top;
	}
	td.contenu {
		width: 362px;
		padding: 4px;
		padding-top: 10px;
	}
	
	/* ---------------------- page s'inscrire ------------------------------- */
	
	div.bloc {
		margin: 2px 0px;
		float: left;
		width: 324px;
		height: 284px;
	}
	/*Spécial pour les blocs 3 et 4 qui ne sont pas de la même taille */
	#bloc3 {
		height: 220px;
	}
	#bloc4 {
		height: 340px;
		width: 340px;
	}
	div.bloc ul, div.contenu ul, td.contenu ul, div#popup ul {
	  list-style-type: disc;
	}
	div.bloc ul {
	  margin-top: 10px;
	}
	#principale div.colonne {
		float: left;
		overflow: hidden;
		/*border: 1px solid #000;*/
	}
	#principale div.colonne * {
		/*border: 1px solid #000;*/
	}
	

/* ------------------SANDBOX TO TRASH FURTHER----------------------- */


img.marged {
	margin: 4px;
}


span.bold {
	font-weight: bold;
}

/* BLOC supérieur contenant le logo, le sous titre et la zone de connexion */
	#haut a {
		color: #FFF;
	}
/* FIN BLOC */




span.link {
	color: #FFF;
	text-decoration: underline;
}

#div_connexion input {
	margin: 0px 2px;
  border: 3px solid #7E8A96;
  width: 70px;
}

#div_connexion input#souvenir {
  width: 20px;
}

td.long {
	width: 160px;
}
td.tout {
	width: 100%;
}

#div_connexion img {
	margin: 0px;
	padding: 0px;
	vertical-align: bottom;
}

.btn {
    border-top: 1px solid #fff;
    border-left: 1px solid #fff;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
}
.btn_actif {
    border-top: 1px solid #000;
    border-left: 1px solid #000;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
h3{
    margin:0;
    padding: 0;
    display: inline;
    font-size : 14px;
    color : #FFFFFF;
    font-weight: bold;
}
h4{
    margin:0;
    padding: 0;
    font-weight: bold;
    font-size : 12px;
}
#principale li{
/*    margin-bottom: 1em;*/
}
.tarifs_prix{
    font-weight: bold;
}
p{
    margin-left: 2em;
    margin-right: 2em;
}
/* Remplacement des bouttons de l'index par la méthode Phark */
#bouttons_index ul li {
    float: left;
    margin-right: 8px;
}
#video_demo {
    background: url('../../i/btn_video_petit.gif') no-repeat;
}
#video_demo a{
    text-indent: -5000px;
    background: url('../../i/btn_video_petit.gif') no-repeat;
    display: block;
    width: 161px;
    height: 80px;
}
#video_demo a:hover{
    background: url('../../i/btn_video_petit_survol.gif') no-repeat;
}
#essayez_live {
    background: url('../../i/btn_essayez_petit.gif') no-repeat;
}
#essayez_live a{
    text-indent: -5000px;
    background: url('../../i/btn_essayez_petit.gif') no-repeat;
    display: block;
    width: 161px;
    height: 81px;
}
#essayez_live a:hover{
    background: url('../../i/btn_essayez_petit_survol.gif') no-repeat;
}
#creez_compte {
    background: url('../../i/btn_compte_petit.gif') no-repeat;
}
#creez_compte a{
    text-indent: -5000px;
    background: url('../../i/btn_essayez_petit.gif') no-repeat;
    display: block;
    width: 160px;
    height: 81px;
}
#creez_compte a:hover{
    background: url('../../i/btn_essayez_petit_survol.gif') no-repeat;
}
/* Fin des styles des 3 Gros Bouttons*/
/* Styles du menu */
#sans_sous_menu{
    margin: 0;
    padding: 0;
    list-style: none;
    position:absolute;
    top:76px;
    right:30px;
    height: 50px;
  
}
#sans_sous_menu li{
    float: left;
    padding-left: 2px;
    /*
    trouver un systeme pour evite le flash de ce bande menu actif
    background: url('../../i/bande_menu_actif.gif') repeat-x;*/
}
#sans_sous_menu li a{
    display: block;
  /* height: 30px;*/
    font-size: 14px;
    padding: 5px;
    padding-top: 18px;
    padding-bottom: 18px;
    background: url('../../i/bande_menu.gif') repeat-x;
    text-decoration: none;
    color:#797979;
    text-align: center;
}
#sans_sous_menu li a:hover{
    color: #fff;
    background: url('../../i/bande_menu_actif.gif') repeat-x;
}

/********/
#avec_sous_menu{
    margin: 0;
    padding: 0;
    list-style: none;
    position:absolute;
    top:76px;
    right:30px;
    height: 26px;
    background: url('../../i/bande');
}
#avec_sous_menu li{
    float: left;
    padding-left: 2px;
    /*
    trouver un systeme pour evite le flash de ce bande menu actif
    background: url('../../i/bande_menu_actif.gif') repeat-x;*/
}
#avec_sous_menu li a{
    display: block;
    font-size: 14px;
    padding: 5px;
    padding-top: 6px;
    padding-bottom: 6px;
    background: url('../../i/bande_menu.gif') repeat-x;
    text-decoration: none;
    color:#797979;
    text-align: center;
}
#avec_sous_menu li a:hover{
    color: #fff;
    background: url('../../i/bande_menu_actif.gif') repeat-x;
}
/****** sous menu ****/
#menu_comprendre{
    margin: 0;
    padding: 0;
    list-style: none;
    position: absolute;
    top: 108px;
    right: 30px;
}
#menu_comprendre li {
    float: left;
    padding-left: 2px;
}
#menu_comprendre li a {
    display: block;
    padding: 5px;
    background-color: #e7f3fd;
    text-decoration: none;
    color:#797979;
}


#site {
    width: 1000px;
    margin: 0 auto;
    position: relative;
}
#bloc3, #bloc4 {
	visibility: hidden;
}
#buttun_2 {
	opacity: 0.2;
	filter: alpha(opacity=20);
}
/* pour IE 6, on cache les SELECT */
#bloc3 select {
	visibility: hidden;
}
#aide {
	position: relative;
	top: 0px;
	left: -6px;
}


span.medium {
	font-size: 20px;
	font-weight: bold;
}
span.white {
	color: #FFF;
}
span.big {
	font-size: 24px;
	font-weight: bold;
}
span.bigger {
	font-size: 54px;
	font-weight: bold;
}
span.comic {
	font-family: Trebuchet MS;
	color: #656565;
}

.justify {
	text-align: justify; 
}

.droite li h4 {
	float: left;
	width: 180px;
}
.droite li p{
	margin-top: 0;
}

/* on met le texte dans un span car il y a un width: 100% qui interdit le padding dans le DIV direct */
#bas span {
	margin: 10px;
}

/* Alignement spécifique */
.right {
	position: absolute;
	right: 0px;
}
td.ligne img {
	position: relative;
	bottom: -6px;
}
.bottom {
	position: absolute;
	bottom: 0px;
}
.float {
	position: static;
	float: left;
}

.droite p {
	margin-left: 200px;
}



/****************************
Anciens
*****************************/
.hidden{
    visibility: hidden;
}
.visible{
    visibility: visible;
}

div {
    cursor: default;
}
 
.Input{
    font-family:  Verdana, sans-serif;
    font-size: 9px;
    font-weight: normal;
    background-color:#C3DFFB;
    border-left:1px solid #7A8690;
    border-top:1px solid #7A8690;
    border-right:1px solid #7A8690;
    border-bottom:1px solid #7A8690;
    width: 80px;
}
.InputSmall {
	width: 70px;
}
.InputInscription{
    font-family:  Verdana, sans-serif;
    font-size: 11px;
    font-weight: normal;
    background-color:#C3DFFB;
    border-left:1px solid #7A8690;
    border-top:1px solid #7A8690;
    border-right:1px solid #7A8690;
    border-bottom:1px solid #7A8690;
    width: 100px;
    height:13px;
}
.InputInscriptionSmall{
    font-family:  Verdana, sans-serif;
    font-size: 11px;
    font-weight: normal;
    background-color:#C3DFFB;
    border-left:1px solid #7A8690;
    border-top:1px solid #7A8690;
    border-right:1px solid #7A8690;
    border-bottom:1px solid #7A8690;
    width: 20px;
    height:11px;
}
.InputInitialisation{
	font-family:  Verdana, sans-serif;
	font-size: 11px;
	font-weight: normal;
	background-color:#C3DFFB;
	border-left:1px solid #7A8690;
	border-top:1px solid #7A8690;
	border-right:1px solid #7A8690;
	border-bottom:1px solid #7A8690;
	width: 58px;
	height:13px;
}
.InputInitialisationSmall{
	font-family:  Verdana, sans-serif;
	font-size: 11px;
	font-weight: normal;
	background-color:#C3DFFB;
	border-left:1px solid #7A8690;
	border-top:1px solid #7A8690;
	border-right:1px solid #7A8690;
	border-bottom:1px solid #7A8690;
	width: 34px;
	height:13px;
}
td {
width: 100px;
}
.Select{
    font-family:  Verdana, sans-serif;
    font-size: 11px;
    font-weight: normal;
    background-color:#C3DFFB;
    border-left:1px solid #7A8690;
    border-top:1px solid #7A8690;
    border-right:1px solid #7A8690;
    border-bottom:1px solid #7A8690;
}
.lien{
    color : #66551A;
    text-decoration: underline;
}


ul {
    list-style-type: none;
}

ul.inscription li {
    float:left;
    height: 25px;
    padding: 0px;
    color: #000;
    text-align: left;
    padding-left:2px;
    font-size : 12px;
    color:#797979;
    font-weight: normal;
    font-family: Verdana;
}
ul.inscription li.libelle {
    width: 300px;
}
ul.inscription li.compte {
    width: 150px;
}
ul.inscription li.resultat {
    width: 800px;
}

ul.inscription li.error {
    color: red;
}

ul.inscription li.Titre {
    font-weight: bold;
}





.red{
    color: red;
}
.pointer{
    cursor:pointer;
}


#gauche2 ul li {
	list-style-type: disc;
}

.errorMessage {
	color: red;	
}

.infoMessage {
	color: green;
}

.bigMessage {
	font-size: 16px;
	font-weight: bold;
}

#textButton1, #textButton2, #textButton3 {
	text-align: left;
}

div.left, td.left, span.left {
	text-align: left;
}