html 					{	height:100%;}
h1, h2,h3, h4, h5, h5	{	margin: 0 0 0 0;}
img 					{	border:0;}
body 					{	margin:0;  padding:0;  height:100%;  font-family: arial,verdana,  sans-serif;}
form,table				{	padding:0;	margin:0;}
tr 						{	vertical-align: top;}
ul,ol					{	margin:11px 0px;padding-left:40px;}/*pour que ie soit co firefox */
p,address				{	margin:11px 0px;padding:0;}/*pour que ie soit co firefox */
address					{	font-style: normal;}
/*polices universelles*/
body {
	background:#FFEAD7 url(/images/fond.jpg) repeat-y;
	font-size: 11px;
}
/*html>body, html>body div, html>body p, html>body th, html>body td, html>body li, html>body dd {
   font-size: 11px;
}*/
h1 {
   font-size: 16px;
}
h2 {
   font-size: 14px;
}
h3 {
   font-size: 13px;
}
h4 {
   font-size: 12px;
}
h5 {
   font-size: 11px;
}

.center 				{	text-align: center;}
.nettoie 				{	clear:both;}
.retrait				{	padding-left:25px;	}
.hide					{	display:none;}
th						{	text-align: left;}
.normal					{	font-weight: normal;font-style: normal;font-size: 11px}
/* PAGES EN GENERAL */
#page{
	width:990px;
	overflow:hidden;
	margin:0 auto;
	position:relative;
}
#ombres_verticals{
	background: transparent url(/images/milieu.png) repeat-y 0px 10px;
	padding-left:4px;
}
#ombre_top{
	background: transparent url(/images/haut.png);
	width:990px;
	height:14px;
}
#ombre_bandeau{
	background: transparent url(/images/ombre_bandeau.png) repeat-x;	
	width:983px;
	height:5px;
	margin:0px;
	position:absolute;
}
a#bourse{
	position:absolute;
	top:150px;
	right:50px;
	width:123px;
	height:42px;
	overflow:hidden;
}
a#accueil{
	position:absolute;
	top:185px;
	left:110px;
	width:65px;
	height:21px;
	overflow:hidden;
}
	a#accueil span,
	a#bourse span{
		display:none;
	}
	a#accueil img,
	a#bourse img{
		position:relative;
	}
	a:hover#accueil img{
		left: -65px;
	}
	a:hover#bourse img{
		top: -42px;
	}

#conteneur_pages{
	float:left;
	width:678px;
}
	.modele_accueil #navigue #devenir a{
		background: transparent url(/images/accueil/devenir.jpg);
		display:block;
		width: 326px;
		height:38px;
	}
	.modele_accueil #navigue #devenir a:hover{
		background-position: -326px 0px;
	}
		.modele_accueil #navigue #devenir a span{
			display:none;
		}
	.modele_accueil #navigue #perfectionner a{
		background: transparent url(/images/accueil/perfectionner.jpg);
		display:block;
		width: 326px;
		height:38px;
	}
	.modele_accueil #navigue #perfectionner a:hover{
		background-position: -326px 0px;
	}
		.modele_accueil #navigue #perfectionner a span{
			display:none;
		}
	.modele_accueil #navigue #gerer a{
		background: transparent url(/images/accueil/gerer.jpg);
		display:block;
		width: 326px;
		height:38px;
	}
	.modele_accueil #navigue #gerer a:hover{
		background-position: -326px 0px;
	}
		.modele_accueil #navigue #gerer a span{
			display:none;
		}
	.modele_accueil #navigue #autres{
		background: transparent url(/images/accueil/brune.jpg);
		display:block;
		width: 326px;
		height:150px;
		padding-top:24px;
	}
		.modele_accueil #navigue #autres li{
			list-style: none;
		}
		.modele_accueil #navigue #autres li a{
			color:black;
			position:relative;
			text-decoration: none;
			display:block;
			padding-top:5px;
			padding-bottom:5px;
			font-weight:bold;
			font-size:12px;
			text-align:right;
			width:170px;
			margin-left:105px;
			border-bottom:1px solid black;
		}
		.modele_accueil #navigue #autres li a:hover{
			color:white;
		}
		.modele_accueil #navigue #autres li a.dernier{
			border-bottom:0;
		}
	.modele_accueil #navigue #devenir,
	.modele_accueil #navigue #perfectionner{
		float:left;
		margin:10px 5px 5px 5px;
	}
	.modele_accueil #navigue #gerer,
	.modele_accueil #navigue #autres{
		float:left;
		margin:5px 5px 10px 5px;
	}

/* MENU */
#infos_jason{
	float:left;
	text-align: center;
	width:305px;
}
	#infos_jason #fond_jason{
		height:185px;
		width:220px;
		padding-top:21px;
		background: transparent url(/images/accueil/hugo.jpg) no-repeat;
		margin: 0 auto;
	}
	#infos_jason a#perfectionner{
		background: transparent url(/images/perfectionner.gif) no-repeat;
	}
	#infos_jason a#gerer{
		background: transparent url(/images/gerer.gif) no-repeat;
	}
	#infos_jason a#devenir{
		background: transparent url(/images/devenir.gif) no-repeat;
	}
	#infos_jason a#devenir,
	#infos_jason a#gerer,
	#infos_jason a#perfectionner{
		display:block;	
		height:38px;
		width:264px;
		margin-bottom:3px;
		margin-left:auto;
		margin-right:auto;
	}
		#infos_jason a:hover#devenir,
		#infos_jason a:hover#gerer,
		#infos_jason a:hover#perfectionner{
			background-position:-264px;
		}
		#infos_jason #gerer span,
		#infos_jason #devenir span,
		#infos_jason #perfectionner span{
			display:none;
		}
	#infos_jason #gerer_menu,
	#infos_jason #perfectionner_menu,
	#infos_jason #devenir_coiffeur_menu{
		width:277px;
		height:151px;
		text-align: left;
		margin:0 auto;
		position:relative;
	}
	#infos_jason #gerer_menu{
		background: transparent url(/images/gerer/menu.jpg) no-repeat;
	}
	#infos_jason #devenir_coiffeur_menu{
		background: transparent url(/images/devenir_coiffeur/menu.jpg) no-repeat;
	}
	#infos_jason #perfectionner_menu{
		background: transparent url(/images/perfectionner/menu.jpg) no-repeat;
	}
		#infos_jason .lien_rub{
			display:block;
			position:absolute;	
			width:280px;
			text-decoration:none;
			height:57px;
			z-index:15;
		}
		#infos_jason #gerer_menu ul,
		#infos_jason #perfectionner_menu ul,
		#infos_jason #devenir_coiffeur_menu ul{
			padding-top:60px;
			list-style: none;
			margin:0;
		}
			#infos_jason #gerer_menu ul li a,
			#infos_jason #perfectionner_menu ul li a,
			#infos_jason #devenir_coiffeur_menu ul li a{
				color:black;
				font-size:12px;
				text-decoration: none;
			}
			#infos_jason #gerer_menu ul li a:hover,
			#infos_jason #perfectionner_menu ul li a:hover,
			#infos_jason #devenir_coiffeur_menu ul li a:hover,
			#infos_jason #gerer_menu ul li a.current,
			#infos_jason #perfectionner_menu ul li a.current,
			#infos_jason #devenir_coiffeur_menu ul li a.current{
				font-weight: bold;
			}
			#infos_jason #gerer_menu  ul li.bonus a,
			#infos_jason #devenir_coiffeur_menu  ul li.bonus a,
			#infos_jason #perfectionner_menu  ul li.bonus a{
				font-weight: bold;
				display:block;
				width:95px;
				height:55px;
				position:absolute;
				right:10px;
				bottom:0;
			}
				#infos_jason #gerer_menu  ul li.bonus a span,
				#infos_jason #devenir_coiffeur_menu  ul li.bonus a span,
				#infos_jason #perfectionner_menu  ul li.bonus a span{
					display:none;
				}

h1#titre_rub{
	float:left;
	width:234px;
	padding:25px 25px 0px 55px;
}
	h1#titre_rub span{
		display:none;
	}
#sous_menu{
	list-style: none;	
	width:250px;
	height:300px;
	float:left;
	position:relative;
	margin-top:50px;
}
	#sous_menu li{
		display:inline;
	}
	#sous_menu a span{
		display: none;	
	}
	#sous_menu a img{
		position:relative;
		left: 0px;
	}
	#sous_menu .bonus a,
	#sous_menu .former a,
	#sous_menu .video a,
	#sous_menu .job a,
	#sous_menu .peau a{
		display:block;	
		width:103px;
		height:103px;
		float:left;
		overflow:hidden;
		position:relative;
		margin:6px;
	}
	#sous_menu .bonus a{
		position:absolute;
		top:95px;
		/*left:232px;*/
		left:120px;
	}
	#sous_menu .bonus a:hover img{
		left: -110px;
	}
	#sous_menu .former a:hover img,
	#sous_menu .video a:hover img,
	#sous_menu .job a:hover img,
	#sous_menu .peau a:hover img{
		left: -103px;
	}

/* TEXTE TYPIQUE */
#p_gerer #question h2,
#p_gerer h1{
   color:#FF581A;
}
#p_perfectionner #question h2,
#p_perfectionner h1{
   color:#92D832;
}
#p_devenir_coiffeur #question h2,
#p_devenir_coiffeur h1{
   color:#5DBEE9;
}
.modele_choix_offre #conteneur_pages form,
.modele_choix_demande #conteneur_pages form{
	float:right;
	padding:100px 50px 0px 0px;	
}

.modele_hair-be12-salon-de-coiffure-virtuel #conteneur_pages h1,
.modele_hair-be12-salon-de-coiffure-virtuel #conteneur_pages p,
.modele_contact #conteneur_pages h1,
.modele_contact #conteneur_pages p,
.modele_partenaires #conteneur_pages h1,
.modele_partenaires #conteneur_pages h2,
.modele_partenaires #conteneur_pages p,
.modele_contact #conteneur_pages form,
.modele_parler_ami #conteneur_pages h1,
.modele_parler_ami #conteneur_pages p,
.modele_parler_ami #conteneur_pages form,
.modele_former #conteneur_pages p,
.modele_former #conteneur_pages ul,
.modele_former #conteneur_pages .bloc_texte_basic h1,
.modele_former #conteneur_pages .bloc_texte_basic h2,
.modele_consulter #conteneur_pages .demande,
.modele_consulter #conteneur_pages p,
.modele_consulter #conteneur_pages h1,
.modele_choix_offre #conteneur_pages p,
.modele_choix_offre #conteneur_pages h1,
.modele_choix_demande #conteneur_pages p,
.modele_choix_demande #conteneur_pages h1,
.modele_voir_offres #conteneur_pages .offre,
.modele_voir_offres #conteneur_pages p,
.modele_voir_offres #conteneur_pages h1,
.modele_job #conteneur_pages p,
.modele_job #conteneur_pages h1,
.modele_job #conteneur_pages h2,
.modele_deposer #conteneur_pages p,
.modele_deposer #conteneur_pages h1,
.modele_deposer #conteneur_pages form,
.modele_contacter_demande #conteneur_pages p,
.modele_contacter_demande #conteneur_pages h1,
.modele_contacter_demande #conteneur_pages form,
.modele_contacter_offre #conteneur_pages p,
.modele_contacter_offre #conteneur_pages h1,
.modele_contacter_offre #conteneur_pages form,
.modele_deposer_offre #conteneur_pages p,
.modele_deposer_offre #conteneur_pages h1,
.modele_deposer_offre #conteneur_pages form,
.modele_bourse_emploi #conteneur_pages p{
	margin:10px 50px;
}

/* RUBRIQUE */

.modele_hair-be12-salon-de-coiffure-virtuel #conteneur_pages,
.modele_partenaires #conteneur_pages,
.modele_parler_ami #conteneur_pages,
.modele_contact #conteneur_pages,
.modele_contacter_demande #conteneur_pages,
.modele_contacter_offre #conteneur_pages,
.modele_choix_demande #conteneur_pages,
.modele_choix_offre #conteneur_pages,
.modele_deposer_offre #conteneur_pages,
.modele_voir_offres #conteneur_pages,
.modele_former #conteneur_pages,
.modele_consulter #conteneur_pages,
.modele_job #conteneur_pages,
.modele_bourse_emploi #conteneur_pages,
.modele_deposer #conteneur_pages,
.modele_peau #conteneur_pages,
.modele_gerer #conteneur_pages,
.modele_perfectionner #conteneur_pages,
.modele_devenir_coiffeur #conteneur_pages{
	min-height:371px;
	width:678px;
	background: transparent url(/images/fond_rub.jpg) no-repeat bottom;	
}
#sous_fond_pages{
	width:678px;
	background:transparent url(/images/fond_rub_ligne.jpg);	
	float:left;	
}
#retour{
	position:absolute;
	bottom:15px;
	right:15px;	
	font-size: 14px;
	font-weight:bold;
	text-decoration: none;
	color:#ADADAD;
}
	a:hover#retour{
		color:black;
	}
.titre_image{
	float:left;	
	width:130px;
	height:130px;
	padding:40px;
}
.titre_image span{
	display:none;
}
.titre_image_basic{
	float:left;	
	width:103px;
	height:103px;
	padding:10px 20px;
}
.titre_image_basic span{
	display:none;
}
.titre_image_retrait{
	float:left;	
	width:103px;
	height:103px;
	padding:20px 20px 10px 20px;
}
.titre_image_retrait span{
	display:none;
}
.retrait_top{
	margin-top:20px!important;
}
.bloc_texte_basic{
	float:left;	
	width:500px;
}
/*QCMs*/
#textes_qcm{
	float:left;	
	width:420px;
}
#textes_qcm #question{
	margin-top:40px;	
}
	#textes_qcm #question .question_num{
		float:left;	
		display:block;
		font-weight:bold;
		text-align:center;
		line-height:23px;
		width:23px;
		height:23px;
	}
	#p_devenir_coiffeur #textes_qcm #question .question_num{
		background: transparent url(/images/devenir_coiffeur/peau/puce.png);
	}
	#p_gerer #textes_qcm #question .question_num{
		background: transparent url(/images/gerer/peau/puce.png) -1px;
	}
	#p_perfectionner #textes_qcm #question .question_num{
		background: transparent url(/images/perfectionner/peau/puce.png) -1px;
	}
	#p_perfectionner #textes_qcm #question{
		margin-top:10px;	
	}
	#textes_qcm #question h2{
		margin-bottom:10px;
	}
	#textes_qcm #question .choix{
		margin-bottom:5px;
	}
	#textes_qcm #question .un_choix{
		margin-bottom:5px;
		cursor:pointer;
		position:relative;
	}
		#textes_qcm #question .un_choix img{
			margin-bottom:2px;
			vertical-align: middle;
		}
	#textes_qcm .photos{
		float:left;
		margin-right:10px;
	}
	#textes_qcm .phrase_perf{
		font-size:12px;
		font-weight: normal;
		color:black;
	}
	#textes_qcm .les_choix_perf{
		padding-left:10px;
	}
	#textes_qcm .un_choix_perf{
		padding-top:10px;
	}
	#textes_qcm #question .choix_gerer{
		margin-bottom:10px;
		font-weight: bold;
	}
	#textes_qcm #question #debug2{
		margin-bottom:11px;
	}
#textes_qcm .mauvais,
#textes_qcm #question div,
#textes_qcm #question h2{
	display:block;
	padding-left:40px;
}
#textes_qcm #reponse{
	margin-top:40px;	
}
	#textes_qcm #reponse .picto_true,
	#textes_qcm #reponse .picto_false{
		float:left;
		display:block;
		width:30px;
		height:31px;
	}
	#p_devenir_coiffeur #textes_qcm #reponse .picto_false{
		background: transparent url(/images/devenir_coiffeur/peau/false.png);
	}
	#p_devenir_coiffeur #textes_qcm #reponse .picto_true{
		background: transparent url(/images/devenir_coiffeur/peau/true.png);
	}
	#p_gerer #textes_qcm #reponse .picto_false{
		background: transparent url(/images/gerer/peau/false.png);
	}
	#p_gerer #textes_qcm #reponse .picto_true{
		background: transparent url(/images/gerer/peau/true.png);
	}
	#p_perfectionner #textes_qcm #reponse .picto_false{
		background: transparent url(/images/perfectionner/peau/false.png);
	}
	#p_perfectionner #textes_qcm #reponse .picto_true{
		background: transparent url(/images/perfectionner/peau/true.png);
	}
	#p_perfectionner #textes_qcm #reponse{
		margin-top:10px;	
	}
	
#suivant{
	position:relative;
	display:block;
	overflow: hidden;
	width:142px;
	height:27px;
	margin:20px auto;
}
	#suivant span{
		display:none;
	}
	a#suivant img{
		position:relative;
	}
	a:hover#suivant img{
		position:relative;
		left:-142px;
	}
#p_perfectionner #validation{
	padding-left:40px;
	width:380px;
}
#validation a{
	position:relative;
	display:block;
	overflow: hidden;
	width:85px;
	height:27px;
}
	#validation a img{
		position:relative;
	}
	#validation a:hover img{
		position:relative;
		left:-85px;
	}
#bilan{
	position:relative;
	display:block;
	overflow: hidden;
	width:108px;
	height:27px;
	margin:20px auto;
}
	#bilan span{
		display:none;
	}
	a#bilan img{
		position:relative;
	}
	a:hover#bilan img{
		position:relative;
		left:-108px;
	}

/* JOB COIFFEUR */
#menu_job3,
#menu_job{
	float:left;	
	padding:10px 20px 0px 20px;
}
#menu_job2{
	float:left;	
	padding:20px 20px 0px 20px;
}
	#menu_job3 a,
	#menu_job2 a,
	#menu_job a{
		display:block;
		width:93px;
		text-align:center;
		padding:8px 5px 8px 5px;
		color:black;
		font-size:12px;
		text-decoration:none;
	}
	#p_devenir_coiffeur #menu_job a{
		padding:4px 5px 4px 5px;
	}
	#menu_job a{
		background-color: #8DDDFF;	
		border-bottom:1px solid #5DBEE9;
	}
	#menu_job2 a{
		background-color: #C0FC5A;	
		border-bottom:1px solid #9CE322;
	}
	#menu_job3 a{
		background-color: #FF8619;	
		border-bottom:1px solid #FF5719;
	}
	#menu_job a.current,
	#menu_job a:hover{
		background-color: #D4F1FF;	
	}
	#menu_job2 a.current,
	#menu_job2 a:hover{
		background-color: #E2FFAF;	
	}
	#menu_job3 a.current,
	#menu_job3 a:hover{
		background-color: #FFBB7F;	
	}
#bloc_texte{
	float:left;	
	width:450px;
	font-size:12px;
	margin:70px 0px 0px 50px;
}

/* Bourse emploi */
.modele_voir_offres .titre_emploi,
.modele_consulter .titre_emploi{
	font-weight: bold;
}

.tab_liens {
	width:100%;
}
	.tab_liens th,
	.tab_liens td{
		text-align: center;
	}
	.tab_liens th{
		font-size:14px;
	}
	.tab_liens .link_image{
		text-align: center;
	}
	.tab_liens a{
		position:relative;
		margin:0 auto;
		display:block;
		width:262px;
		height:26px;
		overflow:hidden;
	}
	.tab_liens a span{
		display:none;
	}
	.tab_liens a img{
		position:relative;
	}
	.tab_liens a:hover img{
		position:relative;
		left:-262px;
	}

/*hairbe*/
#hairbe{
	float:right;
	width:390px;
}
.modele_partenaires #conteneur_pages a.partenaire{
	text-decoration: none;
}
.modele_partenaires #conteneur_pages a.partenaire img{
	margin-right:5px;
	margin-bottom:2px;
	vertical-align: middle;
}
.modele_partenaires #conteneur_pages a.partenaire span{
	text-decoration: underline;
}






