body {	background: url(images/fond.jpg) fixed #676566 no-repeat right top; margin:0; padding:0;
		-webkit-background-size: cover; 	/* pour Chrome et Safari */
		-moz-background-size: cover; 		/* pour Firefox */
		-o-background-size: cover; 		/* pour Opera */
		background-size: cover; 			/* version standardisée */
 }

#header {
	position: fixed; 		
	top:0;
	left:0;	
	padding:0;
	margin:0;
	width: 100%; 
	height: 50px; 	
	background: transparent;
	z-index: 100;
}

#navContainer {
	position: relative;
	top:0;		
	margin:0 auto 0 auto;
	padding:0;
	width: 960px;
	height: 50px;	
	background:transparent;
}

.nav {
	position: absolute;
	margin:0;
	padding:0;
	top:0;
	left:0;	
	width: 750px;
	height: 50px;	
	border:1px solid #333333;	
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius:12px;
	behavior: url(PIE.htc);
	background: transparent url(images/nav_ie_bg.png);
	z-index: 101;					/*PIE avec IE8 */
}

.nav ul{
	padding:0; 
	padding-top:8px;
	margin:0;
	height:33px;
 	list-style-type:none;	
}

.nav ul li {
	float:left; 					
 	height:33px;
	width:136px;/*!important;*/			/*  A calculer en fontion du nombre x d'onglets  (750-(x*14))/x=... */
	padding:0;
	margin-left:6px;
	margin-right:6px;			
	border:1px solid #333333;	
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius:12px;
	behavior: url(PIE.htc);
	text-align: center;
	line-height:33px;
	background: transparent url(images/onglet_ie.jpg);	
}

#scrollOffset{height: 50px}

.nav ul li:hover{	
	background: transparent url(images/onglet_ieHover.jpg);
	color: #1c0f0a;  
}

.nav ul li a{
	font-family: "myriad-pro",sans-serif;
	color: #1c0f0a;
	text-decoration: none;	
}

#container{
	margin: 0 auto;
	width: 960px;
	position: relative;
	top:0;
	padding-top: 50px;
	padding-left: 0;
}

#content{
	position: relative;
	top:0;
	width: 700px;
	padding: 15px 25px 25px 25px;
	margin:0;	
	border:1px solid #333333; 
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius:12px;
	behavior: url(PIE.htc);
	background: transparent url(images/content_ie_bg.png);
}

#page {
	padding: 20px;	
	font-family: Comic Sans MS; 
	font: italic;
	color:white;	
	border:1px solid #333333; 
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;
	behavior: url(PIE.htc);
	background: transparent url(images/page_ie_bg.png);	
}

#page.pad_0 {padding: 0;}

.galerie div {display: inline-block; height: 300px; width: 300px; text-align: center; line-height:300px;margin:13px;}
.galerie img{vertical-align: middle; }

.ancre{color:gold}


#name{
	float: left;
	width: 565px;
	font-size: 70px;
	line-height: 76px;
	font-family: "myriad-pro",sans-serif;
	font-weight: bold; 
	color: #C0E236;
}
#updated {
	float: right;
	width: 120px;
	height: 20px;
	padding:0;
	padding-top: 5px;
	margin: 0;
	font-size: 15px;
	color: #EBEBEB;
	font-family: "myriad-pro",sans-serif;
	text-align: center;
	background: #2B2624;
}
#headline {
	float: left;
	margin:0;
	margin-top: 10px;
	color: #EBEBEB;
	font-size: 36px;
	font-family: "myriad-pro",sans-serif;
}
#social {
	margin: 0;
	margin-top: 30px;
	width: 32px;
	height: 32px;
	background: url(images/social-icons-32.png) no-repeat scroll 0 -64px transparent;
}
.flash {width:658px ; height:465px }
.footer{
	/*  
	height: 700px; Pour caler derniere rubrique	sans scrolltoHere.js 
	*/
	width: 700px;	
	padding:25px;
}

.topImg{
	height:50px;
	width:50px;
	margin:0 auto;
	border:1px solid #333333; 
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;
	behavior: url(PIE.htc);
	background: transparent url(images/top.jpg);
}
img {border: none}	

@media screen and (max-width:768px) {
	#navContainer {	width: 570px;}
	.nav {width: 520px;height: 50px;}
	.nav ul li {		
		width:90px;		
		margin-left:6px;
		margin-right:6px;
	}
	#container{	width: 570px;}
	#content{width: 470px;}
	.galerie div {display: inline-block; height: 200px; width: 200px; text-align: center; line-height:200px;margin:4px;}
	.galerie img {
	max-width: 100%; max-height: 100%;
	height: auto; width: auto;	
	}
	.flash {width:430px ; height:304px }
	#name{width: 403px;	font-size: 50px;line-height: 55px;}
	#updated {width: 85px;font-size: 10px;}
	#headline {	font-size: 26px;}
	
}
@media screen and (max-width:540px) {
	#navContainer {	width: 470px;}
	.nav {width: 430px;height: 50px;}
	.nav ul li {width: 70px; margin-left: 6px; margin-right: 6px; font-size: 80%}	
	#container{width: 470px;}
	#content{width: 420px;padding: 15px 5px 25px 5px;}
	.galerie div {display: inline-block; height: 175px; width: 175px; text-align: center; line-height:175px;margin:4px;}
	.galerie img {
	max-width: 100%; max-height: 100%;
	height: auto; width: auto;	
	}
	.flash {width:380px ; height:263px }
	.footer{width: 420px;}
	#name{width: 300px;	font-size: 30px;line-height: 35px;}
	#updated {width: 85px;font-size: 10px;}
	#headline {	font-size: 26px;}
	#page{font-size: 80%}	
	
}
@media screen and (max-width:440px) {
	#navContainer {	width: 320px;}
	.nav {width: 240px;height: 85px;}
	.nav ul li {width: 65px; margin-left: 6px; margin-right: 6px; font-size: 80%}	
	#header {height: 85px;	}
	#scrollOffset {height: 85px}	
	#container{width: 320px;padding-top: 85px;}
	#content{width: 230px;padding: 15px 5px 25px 5px;}
	.galerie div {display: inline-block; height: 175px; width: 175px; text-align: center; line-height:175px;margin:4px;}
	.galerie img {
	max-width: 100%; max-height: 100%;
	height: auto; width: auto;	
	}
	.flash {width:190px ; height:140px }
	.footer{width: 230px;}
	#name{width: 300px;	font-size: 30px;line-height: 35px;}
	#updated {width: 85px;font-size: 10px;}
	#headline {	font-size: 20px;}
	#page{font-size: 80%}
	
}