* {	margin: 0; padding: 0; border: 0;}

html {overflow: -moz-scrollbars-vertical; min-height: 100%; margin-bottom: 1px; /* force vertical scrollbar and avoid jarring*/}

body {
	text-align: center; /* centrage pour IE */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 76%;
	line-height: 1.15em;
	font-weight: normal;
	background: #f1f2f3;
	color: #000;
}
br {
	clear: both;
}
.right {
	text-align: right;
}
.center {
	text-align: center;
}
/* ---[ Layout ]--------------------- */


#contenant {
	margin: 0 auto 15px auto;
	width: 960px;
	height: auto;
	text-align: left;
}
#header {
	position: relative;
	margin: 0 auto;
	width: 960px;
	height: 133px;
	clear: both;
}
img#logo {
	position: absolute;
	top: 10px;
	left: 0;
}
#coords {
	position: absolute;
	top: 73px;
	right: 0;
	width: 500px;
	text-align: right;
	color: #5e5e5e;
}

#coords a:link {text-decoration: none;}

img.separator {vertical-align: middle; margin: 0 5px;}

.contentWrap {width: 960px; margin: 0 auto;}

#contenuLarge ul.homeNav {
	float: right;
	width: 	283px;	
	margin: 0 0 7px 0;
}
#contenuLarge ul.homeNav li {
	list-style-type: none;
	height: 32px;
	font-size: 13px;
	line-height: 1.3em;
	padding-bottom: 8px;
	background: url(../images/homeNavLiSep.png) no-repeat center 36px;
	margin-bottom: 2px;
}
	#contenuLarge ul.homeNav li.last {padding-bottom: 12px;}
	
#contenuLarge ul.homeNav li a {
	text-decoration: none;
	color: #343434;
	text-shadow: 1px 1px 1px #fff;
	font-weight: bold;
	display: block;
	border: 1px #9e9e9e solid;
	background: url(../images/bgSubNavLi.png) repeat-x 0 0;
	padding: 7px 20px;
	width: 243px;
	height: 16px;
	text-align: center;
	
}

#contenuLarge ul.homeNav li a:hover

{
	border: 1px #e95a00 solid;
	background-position: 0 -30px;
	color: #fff;
	text-shadow: 1px 1px 1px #222;
}


#texte ul#teamPlayerList {
	padding: 0;
	margin: 30px 0;
	}

	#texte ul#teamPlayerList li {position: relative; display: inline; float: left; width: 115px; height: 169px; background: url(../images/bgTeamPlayer.png) no-repeat; margin: 0 25px 20px 0;}
	
	#texte ul#teamPlayerList li img {position: absolute; top: 1px; left: 1px;}
	
	#texte ul#teamPlayerList li a.txtLink {
		position: absolute; top: 127px; left: 0; 
		text-decoration: none;
		color: #343434;
		text-shadow: 1px 1px 1px #fff;
		font-weight: bold;
		display: block;
		border: 1px #9e9e9e solid;
		background: url(../images/bgSubNavLi.png) repeat-x 0 0;
		padding: 6px;
		width: 95px;
		height: 18px;
		text-align: center;
		}
	
	#texte ul#teamPlayerList li a:hover {
		border: 1px #e95a00 solid;
		background-position: 0 -30px;
		color: #fff;
		text-shadow: 1px 1px 1px #222;
		}

/* ---[ Navig principale ]--------------------- */



.jqueryslidemenu{
font: bold 12px Verdana;
background: #414141;
position: absolute;

	top: 100px;

	left: 0;

	width: 860px;

	height: 33px;

	padding: 0 0 0 100px;

	background: #000 url(../images/bgNav.png) no-repeat 0 0;
	z-index: 999;

}

.jqueryslidemenu ul{
width: 860px;
list-style-type: none;
}

/*Top level list items*/
.jqueryslidemenu ul li{
position: relative;
display: inline;
float: left;
/*height: 23px;*/
}

/*Top level menu link items style*/
.jqueryslidemenu ul li a:link, .jqueryslidemenu ul li a:visited{
display: block;
height: 23px;
padding: 8px 25px 0 25px;
color: #2d2b2b;
text-decoration: none;
text-transform: uppercase;
margin-right: 2px;
color: #fff;
font-size: 12px;
}

* html .jqueryslidemenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
display: inline-block;
}


/*état hover*/
.jqueryslidemenu ul li a:hover, .jqueryslidemenu ul li a:active, .jqueryslidemenu ul li:hover a,
body#salon .jqueryslidemenu ul li a#btnSalon:link, body#salon .jqueryslidemenu ul li a#btnSalon:visited,
body#equipe .jqueryslidemenu ul li a#btnEquipe:link, body#equipe .jqueryslidemenu ul li a#btnEquipe:visited,
body#services .jqueryslidemenu ul li a#btnServices:link, body#services .jqueryslidemenu ul li a#btnServices:visited,
body#produits .jqueryslidemenu ul li a#btnProduits:link, body#produits .jqueryslidemenu ul li a#btnProduits:visited,
body#contact .jqueryslidemenu ul li a#btnContact:link, body#contact .jqueryslidemenu ul li a#btnContact:visited

{background: url(../images/bgNavHover.png) repeat-x;}



	
/*1st sub level menu*/
.jqueryslidemenu ul li ul{
position: absolute;
left: 0;
display: block;
visibility: hidden;
border: 1px #000 solid;
background: #fff url(../images/bgSubMenu.jpg) repeat-x;
width: 160px;
padding: 0 10px 10px 10px;

}

/*Sub level menu list items (undo style from Top level List Items)*/
.jqueryslidemenu ul li ul li{
display: list-item;
float: none;
}

/*All subsequent sub menu levels vertical offset after 1st level sub menu */
.jqueryslidemenu ul li ul li ul{
top: 0;
}

/* Sub level menu links style */
.jqueryslidemenu ul li ul li a:link, .jqueryslidemenu ul li ul li a:visited {
font: normal 11px Verdana;
width: 150px; /*width of sub menus*/
padding: 10px 15px 0 15px;
margin: 0;
color: #5e5e5e;
text-transform: none;
border-bottom: 1px #c6c6c6 solid;
}

.jqueryslidemenu ul li:hover ul li a:link, .jqueryslidemenu ul li:hover ul li a:visited {background: none;}

.jqueryslidemenu ul li ul li a:hover, .jqueryslidemenu ul li ul li a:active, .jqueryslidemenu ul li:hover ul li a:hover, .jqueryslidemenu ul li:hover ul li a:active { /*sub menus hover style*/
color: #df6400;
border-bottom: 1px #df6400 solid;
background: none;
}

/* ######### CSS classes applied to down and right arrow images  ######### */

.downarrowclass{
display: none;	
/*position: absolute;
top: 12px;
right: 7px;*/
}

.rightarrowclass{
display: none;
/*position: absolute;
top: 6px;
right: 5px;*/
}



/*ul#nav li a#btnApropos:hover, body#aPropos ul#nav li a#btnApropos, ul#nav li a#btnServices:hover, body#services ul#nav li a#btnServices, ul#nav li a#btnVisagisme:hover, body#visagisme ul#nav li a#btnVisagisme, ul#nav li a#btnHeures:hover, body#horaire ul#nav li a#btnHeures, ul#nav li a#btnContact:hover, body#contact ul#nav li a#btnContact, ul#nav li a#btnEnglish:hover {
	background-position: 0 -28px;
}*/
/* fin navig */	



#animation {
	float: left;
	width: 660px;
	height: 435px;
	margin: 0 0 15px 0;
	z-index: 0;
}
#colDroite {
	float: right;
	width: 283px;
	height: auto;
}
ul.subNav {
	float: left;
	width: 	208px;
	height: 551px;
	padding: 10px 10px 10px 0;
	background: url(../images/subNavBg.png) no-repeat 0 0;
}
ul.subNav li {
	list-style-type: none;
	height: 32px;
	font-size: 13px;
	line-height: 1.3em;
	padding-bottom: 8px;
	background: url(../images/subNavLiSep.png) no-repeat center 36px;
	margin-bottom: 2px;
}
	ul.subNav li.note {background: none; padding: 10px; font-size: 10px;}
ul.subNav li a {
	text-decoration: none;
	color: #343434;
	
	display: block;
	border: 1px #9e9e9e solid;
	background: url(../images/bgSubNavLi.png) repeat-x 0 0;
	padding: 7px 20px;
	width: 166px;
	height: 16px;
	
}

ul.subNav li a:hover, 

		/*identifiant de la sous-section*/


body#produits.nutritive ul.subNav li a#btnNutritive,
body#produits.biotic ul.subNav li a#btnBiotic,
body#produits.reflection ul.subNav li a#btnReflection,
body#produits.resistance ul.subNav li a#btnResistance,
body#produits.soleil ul.subNav li a#btnSoleil,
body#produits.homme ul.subNav li a#btnHomme,

body#services.coiffure ul.subNav li a#btnCoiffure, 
body#services.colo ul.subNav li a#btnColoration, 
body#services.boucles ul.subNav li a#btnBoucles, 
body#services.keratin ul.subNav li a#btnKeratin, 
body#services.rituels ul.subNav li a#btnRituels, 
body#services.mariages ul.subNav li a#btnMariagesGrads, 
body#services.extensions ul.subNav li a#btnExtensions, 
body#services.mercredis ul.subNav li a#btnMercredisFous,
body#services.extenso ul.subNav li a#btnXtenso,

body#equipe.anne ul.subNav li a#btnAnne,
body#equipe.annie ul.subNav li a#btnAnnie,
body#equipe.brenda ul.subNav li a#btnBrenda,
body#equipe.christian ul.subNav li a#btnChristian,
body#equipe.frederic ul.subNav li a#btnFrederic,
body#equipe.mario ul.subNav li a#btnMario,
body#equipe.natalie ul.subNav li a#btnNatalie,
body#equipe.raymonde ul.subNav li a#btnRaymonde,
body#equipe.patrick ul.subNav li a#btnPatrick,
body#equipe.sylvie ul.subNav li a#btnSylvie

{
	border: 1px #e95a00 solid;
	background-position: 0 -30px;
	color: #fff;	
}

#contenu {
	position: relative;
	float: right;
	width: 742px;
	min-height: 450px;
	padding: 13px 0 0 0;
	background:url(../images/contentUpperShadow.png) no-repeat top center;
}
/*pour pages avec sous-menu seulement*/


#contenu.fou {height: 560px; background: url(../images/mercredisFous.jpg) no-repeat 10px 10px;}

	#contenu.fou .note1 {position: absolute; top: 310px; right: 190px; width: 115px; font-size: 95%; text-align: right; font-style: italic;}
	#contenu.fou h2 {position: absolute; top: 350px; right: 25px; width: 400px; font-size: 24px; text-align: right; line-height: 1.4em; color: #000;}
	#contenu.fou .note2 {position: absolute; bottom: 5px; right: 10px; width: 290px; text-align: center; font-size: 85%; line-height: 1.1em;}


#contenuLarge {
	float: right;
	width: 960px;
	min-height: 407px;
	/*background: #fff;*/
	background: url(../images/upShadowWide.png) no-repeat 0 0;
	padding-top: 10px;
}
#photo {
	position: relative;
	float: left;
	width: 368px;
	height: 428px;
	background: url(../images/bgPhotoLg.png) no-repeat;
	margin-top: 15px;
	}
	#photo img {position: absolute; top: 1px; left: 1px;}
	
#photoBio {
	float: left;
	width: 291px;	
	padding: 285px 15px 0 15px;
	min-height: 100px;
	position: relative;
	background: url(../images/cadrePhotoBio.png) no-repeat 15px top;	
	margin-top: 15px;
}
	img.photoBio {position: absolute; top: 1px; left: 16px; z-index: 1;}

#photoLong {
	float: left;
	width: 291px;	
	padding: 0 15px;
	min-height: 600px;
	position: relative;
	background: url(../images/cadrePhotoLong.png) no-repeat 15px top;	
	margin-top: 15px;
}
	img.photoLong {position: absolute; top: 1px; left: 16px; z-index: 1;}
	
#texte {
	float: right;
	width: 558px;
	padding: 15px 15px 0 15px;
}
#contenu .miLargeur {
	float: right;
	width: 701px;
	padding: 10px 15px 0 25px;
}
 #contenu .pleineLargeur {float: left; width: 930px;}

#contenu .etroit {
	width: 393px;
	padding: 15px 15px 0 0;
}
div.leftCol {
	float: left;
	width: 45%;
}
div.rightCol {
	float: right;
	width: 45%;
}
img#promo {
	margin: 0 0 10px 0;
}
#footer {
	position: relative;
	width: 960px;
	height: 118px;
	text-align: center;
	background: url(../images/bgFooter.png) no-repeat bottom left;
}
img#logoKerastase {
	position: absolute;
	top: 35px;
	left: 15px;
}
img#logoHCF {
	position: absolute;
	top: 42px;
	left: 320px;
}
img#logoLoreal {
	position: absolute;
	top: 38px;
	right: 15px;
}

#footerNav {
	clear: both;
	text-align: center;
	width: 960px;
	color: #5c5b5b;
	font-size: 90%;
	padding: 10px 0;
	font-weight: bold;
	
}
#copyright {
	clear: both;
	width: 960px;
	color: #5c5b5b;
	font-size: 85%;
	
	text-align: center;
}
/* ---[ Format du texte ]--------------------- */



h1, h2, h3, h4 {line-height: 1.1em;}

h1 {
	padding: 0 0 15px 0;
	font-size: 150%;
	color: #000;
	text-transform: uppercase;
}
h2 {
	font-size: 120%;
	padding: 0 0 8px 0;
	color: #ee7c00;
}
h3, .larger {
	font-size: 115%;
	font-weight: bold;
	padding: 5px 0;	
	color: #000;
}
h4 {
	font-size: 100%;
	font-weight: bold;
	padding: 10px 0 5px 0;
}

h5 {
	font-size: 95%;
	font-weight: bold;
	padding: 10px 0 5px 0;
}

p {
	font-size: 95%;
	line-height: 1.50em;
	margin: 0 0 10px 0;
}
.small {
	font-size: 80%;
}
.medium {
	font-size: 120%;
}
.large {
	font-size: 130%;
}
.orange {
	color: #ee7c00;
	font-weight: bold;
}
em {
	text-transform: uppercase;
	font-weight: bold;
	font-style: normal;
}
blockquote {
	margin: 0 0 0 80px;
	background: transparent url(../images/quoleft.png) left top no-repeat;
	
}
blockquote div {
	
	
	width: 245px;
	padding: 15px 55px;
	background: transparent url(../images/quoright.png) right bottom no-repeat;
	line-height: 1.5em;
	margin: 15px 0;
}
a:link, a:visited {
	color: #ee7c00;
}
a:hover, a:active {
	color: #545759;
}
a:focus {
	outline: none;
}

/* ---[ Lists ]--------------------- */


#contenuLarge ul, #texte ul {
	padding: 0 0 10px 25px;
	list-style-type: square;
}
#contenuLarge ul li, #texte ul li {
	list-style-type: square;
	padding: 0 0 5px 0;
	line-height: 1.4em;
}
/* ---[ Tables ]--------------------- */

table {
	width: 100%;
	margin: 0 0 15px 0;
}
td {
	border-bottom: 1px #ccc dotted;
	vertical-align: top;
}
td, th {
	padding: 5px;
	line-height: 1.4em;
}
th {
	border-bottom: 1px #B8BCBF solid;
	color: #ee7c00;
	font-size: 120%;
	font-weight: bold;
	text-align: left;
}


/*hcard*/
.org, .adr, .street-address, .locality, .region, .postal-code, .country-name, .tel, .url {display: inline; margin: 0 2px 0 0; font-style: normal;}

/* ---[ Hacks ]--------------------- */















.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	display: inline-block;
}
/* Hides from IE-mac \*/







* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}







/* End hide from IE-mac */

