/* Initialisation css */

/* page fond blanc et centrˇ */
html 	{
	font-size: 100%;
	height: 100%;
	margin:0 auto;
	padding-bottom: 1px;		/* pour avoir l'ascenseur vertical */
	}
	
body	{
	font-family:Verdana,sans-serif;
	font-size: 1em;
	line-height:1;
	color:#033;
	background:#none;
	vertical-align: top;
	horizontal-align:center;
	text-align:center;
	align: center;
	margin:0 auto;
	padding:0;
	}

div	{
	font-family:Verdana,sans-serif;
	font-size: 1em;
	line-height:1;
	color:#033;
	}

.page	{
	font-family:Verdana,sans-serif;
	color:#033;
	background:#fff;
	width:800px;
	position:relative;
	padding:0;
	margin:0 auto;
	}

/* ff-Pagination : color none (ou green) au lieu de #666*/
.pagination { clear: both; font-size: 0.90em; }
.pagination .on { font-size: 1.50em; font-weight: bold; color: green; }
.lien_pagination { font-size: 1.20em; font-weight: }

.raz	{clear: both;
	width: 100%;
	}
.separe-raz	{
	clear: both;
	background: #888;
	height: 1px;
	}
.separateur	{
	clear: both;
	margin: 5px;
	background: #888;
	height: 1px;
	}

/* Habillages texte */
p	{
	font-size: 1em;
	}

h1,h2,h3,h4,h5,h6 {
	color: #066;
	font-weight: normal;
	line-height: 1;
	margin-top: 0.1em;
	margin-bottom: 0.1em;
	}

h1 	{font-size: 2.6em;}
h2 	{font-size: 2em;}
h3 	{font-size: 1.5em;}
h4 	{font-size: 1.25em;}
h5 	{font-size: 1.1em;}
h6 	{font-size: 1em;}

h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin: 0;}

a:link 		{text-decoration: none; color: #033;}
a:visited 	{text-decoration: none; color: #033;}
a:hover 	{text-decoration: none; color: #f00;}
a:active 	{text-decoration: none; color: #033;}


/* Ombres html */
.ombre1	{
	box-shadow: -1px 2px 5px 1px rgba(0, 0, 0, 0.7);
	-moz-box-shadow: -1px 2px 5px 1px rgba(0, 0, 0, 0.7);
	-webkit-box-shadow: -1px 2px 5px 1px rgba(0, 0, 0, 0.7);
	}

.ombre2	{
	box-shadow: 1px 1px 12px #555;
	-moz-box-shadow: 1px 1px 12px #555;
	-webkit-box-shadow: 1px 1px 12px #555;
	}
	
.ombre0	{
	box-shadow: 2px 2px 22px #222;
	-moz-box-shadow: 2px 2px 22px #222;
	-webkit-box-shadow: 2px 2px 22px #222;
	}

/* coins arrondis */
.rond0, .rond		{ padding:5px;-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; behavior: url(/PIE.htc);}
.rond1, .rondcyan	{ background-color:#aff;padding:5px;-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; behavior: url(/PIE.htc);} /* cyan */
.rond2, .rondjaune	{ background-color:#ffa;padding:5px;-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; behavior: url(/PIE.htc);} /* jaune */
.rond3, .rondmagenta	{ background-color:#faf;padding:5px;-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; behavior: url(/PIE.htc);} /* magenta */
.rond4, .rondbleu	{ background-color:#aaf;padding:5px;-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; behavior: url(/PIE.htc);} /* bleu */
.rond5, .rondvert	{ background-color:#afa;padding:5px;-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; behavior: url(/PIE.htc);} /* vert */
.rond6, .rondrouge	{ background-color:#faa;padding:5px;-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; behavior: url(/PIE.htc);} /* rouge */
.rond7, .rondgrisclair	{ background-color:#eee;padding:5px;-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; behavior: url(/PIE.htc);} /* gris clair */
.rond8, .rondgrismoyen	{ background-color:#aaa;padding:5px;-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; behavior: url(/PIE.htc);} /* gris moyen */
.rond9, .rondgrisfonce	{ background-color:#666;padding:5px;-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; behavior: url(/PIE.htc);} /* gris foncˇ */
.rond10, .rondturquoise	{ background-color:#0dd;padding:5px;-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; behavior: url(/PIE.htc);} /* turquoise */
.rond11, .rondblanc	{ background-color:#fff;padding:5px;-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; behavior: url(/PIE.htc);} /* blanc */
.rond12, .rondnoir	{ background-color:#000;padding:5px;-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; behavior: url(/PIE.htc);} /* noir */

/* responsive (faux: .wscreen {width:<script language=javascript>document.write($( window ).width());</script>px;max-width:1400px;} */
	@media screen and (min-width: 10px)
	{
	.float0 {display:block;float:left;width:98%;margin-left:1%;margin-right:1%;max-width:1400px;}
	}
	
	@media screen and (max-width: 600px)
	{
	body {background:none;}
	.dim {width:300px;}
	.dim2 {width:150px;}
	.dim3 {width:100px;}
	.dim23 {width:200px;}
	.dim4 {width:75px;}
	.float1 {display:block;float:left;width:98%;margin-left:1%;}
	.float2 {display:block;float:left;width:98%;margin-left:1%;}
	}
	
	@media screen and (max-width: 600px)
	{
	.aff600 { display: block; }
	.aff601 { display: none; }
	}
	
	@media screen and (min-width:601px)
	{
	.aff601 { display: block; }
	.aff600 { display: none; }
	}	
	
	@media screen and (min-width: 601px) and (max-width: 800px)
	{
	body {background:none;}
	.dim {width:600px;}
	.dim2 {width:300px;}
	.dim3 {width:200px;}
	.dim23 {width:400px;}
	.dim4 {width:150px;}
	.float1 {display:block;float:left;width:56%;margin-left:1%;}
	.float2 {display:block;float:right;width:40%;margin-right:1%;}
	}
	
	@media screen and (min-width: 801px) and (max-width: 1200px)
	{
	body {background:none;}
	.dim {width:800px;}
	.dim2 {width:400px;}
	.dim3 {width:266px;}
	.dim23 {width:533px;}
	.dim4 {width:200px;}
	.float1 {display:block;float:left;width:64%;margin-left:1%;}
	.float2 {display:block;float:right;width:32%;margin-right:1%;}
	}
	
	@media screen and (min-width: 1201px)
	{
	body {background:none;}
	.dim {width:1200px;}
	.dim2 {width:600px;}
	.dim3 {width:400px;}
	.dim23 {width:800px;}
	.dim4 {width:300px;}
	.float1 {display:block;float:left;width:72%;margin-left:1%;max-width:1000px;}
	.float2 {display:block;float:right;width:24%;margin-right:1%;max-width:333px;}
	}
	
	@media screen and (max-width:800px)
	{
	#menu { display: none; }
	#mobile-header { display: block; }
	}
	
	@media screen and (min-width:801px)
	{
	#menu { display: block; }
	#mobile-header { display: none; }
	}
	
	.sidr ul li {text-align: left;}
	
	@media screen and (max-width:800px)
	{
	[(#PLUGIN{SIDR}|oui)#menuhaut { display: none; }]
	}

	
/* objets youtube */
	
	.embedyou {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 ratio */
	padding-top: 30px; /* IE 6 workaround*/
	height: 0;
	overflow: hidden;
	}

	.embedyou iframe,
	.embedyou object,
	.embedyou embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	}