/* --- STYLES DE BASE POUR LE TEXTE ET LES PRINCIPAUX ÉLÉMENTS --- */

/* Page */
html {
	font-size: 100%; /* Voir -> Note 1 à la fin de la feuille de styles. */
}
body {
	margin: 0;
	padding: 0px; /* Note -> 2 */
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; /* 3 */
	font-size: .9em; /* -> 4 */
	line-height: 1.25; /* -> 5 */
	color: black;
	background: white;
	background-image:url('../img/bg.gif');
	background-repeat:no-repeat;
}

#contenu_home a {
color:#769712;
text-decoration:none;
border-bottom:dashed 1px #769712;
font-weight:bold;
}

#contenu_home a:hover {
border-bottom:solid 1px #769712;
}

#global {
text-align:center;
width:980px;
margin-top:10px;
margin-left: auto;
margin-right: auto;
color:#769712;
}

#contenu_home {
	width:650px;
	text-align:left;
	background:none;
	position:relative;
	float:left;
	left: 110px;
	margin-top: -570px;
	z-index:2;
	margin-left:62px;
}


#contenu {
position:relative;
float:left;
z-index:400;
}

#menu {
	padding-left:100px;
	width:143px;
	background:none;
	position:absolute;
	height:398px;
	z-index:3;
	display:table-column;
}

*+html #menu {  /* hack IE7 */
margin-left:-100px;
width:143px;
background:none;
position:absolute;
height:auto;
z-index:3;
 }

#bg {
width:316px;
height:249px;
position:relative;
float:left;
margin-top:-420px;
margin-left:530px;
z-index:4;
}

*html #bg { margin-left:530px; } /* hack IE6 */
*+html #bg { margin-left:530px; } /* hack IE7 */

#droite {
width:470px;
margin-left:530px;
margin-top:-620px;
position:relative;
float:right;
}

#droite_stage {
width:470px;
margin-left:490px;
margin-top:-370px;
position:relative;
float:right;
}


#footer {
width:970px;
text-align:center;
font-size:0.8em;
color:#FF6600;
margin-top:-30px;
}

#credit {
width:900px;
text-align:right;
font-size:0.8em;
color:#fff;
margin-top:-50px;
}

*+html #credit {
width:830px;
text-align:right;
font-size:0.8em;
color:#fff;
margin-top:-50px;
}

#credit a {
color:#fff;
}

#actualites {
margin-top:50px;
color:#000;
height:100px;
width:500px;
}

#bonasavoir {
margin-top:50px;
color:#666;
width:470px;
font-size:0.8em;
}

 a img
{
border: none;
}         

.liste_image
{
padding-left:20px;
padding-right:20px;
padding-top:20px;
height: auto;
float: left;
text-align: center;
} 

/* Menu */
a.accueil { display:block; width:75px; height:50px; background:url('../img/btn-accueil.png') no-repeat 0 0px; display: -moz-inline-block;}
a.accueil:hover { width:100%; background:url('../img/btn-accueil-on.png') no-repeat; }

a.creations { display:block; width:75px; height:50px; background:url('../img/btn-creations.png') no-repeat 0 0px; display: -moz-inline-block;}
a.creations:hover { width:100%; background:url('../img/btn-creations-on.png') no-repeat; }

a.deco { display:block; width:75px; height:50px; background:url('../img/btn-deco.png') no-repeat 0 0px; display: -moz-inline-block;}
a.deco:hover { width:100%; background:url('../img/btn-deco-on.png') no-repeat; }

a.stages { display:block; width:75px; height:50px; background:url('../img/btn-stages.png') no-repeat 0 0px; display: -moz-inline-block;}
a.stages:hover { width:100%; background:url('../img/btn-stages-on.png') no-repeat; }

a.atelier { display:block; width:75px; height:50px; background:url('../img/btn-atelier.png') no-repeat 0 0px; display: -moz-inline-block;}
a.atelier:hover { width:100%; background:url('../img/btn-atelier-on.png') no-repeat; }

a.partenaires { display:block; width:75px; height:50px; background:url('../img/btn-liens.png') no-repeat 0 0px; display: -moz-inline-block;}


/* Menu version IE7 */
*+html a.accueil { display:block; width:75px; height:50px; background:url('../img/btn-accueil.png') no-repeat 0 0px;}
*+html a.accueil:hover { width:143px; background:url('../img/btn-accueil-on.png') no-repeat; }

*+html a.creations { display:block; width:75px; height:50px; background:url('../img/btn-creations.png') no-repeat 0 0px;}
*+html a.creations:hover { width:143px; background:url('../img/btn-creations-on.png') no-repeat; }

*+html a.deco { display:block; width:75px; height:50px; background:url('../img/btn-deco.png') no-repeat 0 0px;}
*+html a.deco:hover { width:143px; background:url('../img/btn-deco-on.png') no-repeat; }

*+html a.stages { display:block; width:75px; height:50px; background:url('../img/btn-stages.png') no-repeat 0 0px;}
*+html a.stages:hover { width:143px; background:url('../img/btn-stages-on.png') no-repeat; }

*+html a.atelier { display:block; width:75px; height:50px; background:url('../img/btn-atelier.png') no-repeat 0 0px;}
*+html a.atelier:hover { width:143px; background:url('../img/btn-atelier-on.png') no-repeat;  }

*+html a.partenaires { display:block; width:75px; height:50px; background:url('../img/btn-liens.png') no-repeat 0 0px;}


/* Titres */
h1, h2, h3, h4, h5, h6 {
	margin: 1em 0 .5em 0; /* -> 6 */
}
h1, h2 {
	font-family: Georgia, "Bitstream Vera Serif", Norasi, serif;
	font-weight: normal; /* -> 7 */
}
h1 {
	font-size: 2em; /* -> 8 */
	font-style: bold;
	color:#333333;
}
h2 {font-size: 1.5em;}
h3 {font-size: 0.9em; color:#666666; font-weight:normal;}
h4 {font-size: 0.8em; color:#999999; font-weight:normal;}

/* Paragraphes */
p {
	margin: .75em 0;
}
li p, blockquote p {
	margin: .5em 0;
}

/* Citations */
blockquote, q {
	font-size: 1.1em;
	font-style: italic;
	font-family: Georgia, "Bitstream Vera Serif", Norasi, serif;
}
blockquote {
	margin: .75em 0 .75em 24px;
}
cite {
	font-style: italic;
}

/* Divers éléments de type en-ligne */
em {
	font-style: italic;
}
strong {
	font-weight: bold;
}


.rouge { 
color:#CC0000;
font-weight:bold;
}

.vert { 
color:#00CC00;
font-weight:bold;
}

/* --- STYLES POUR CERTAINS CONTENUS DES GABARITS --- */

pre, code {
	font-size: 100%;
	font-family: "Bitstream Vera Mono", "Lucida Console", "Courier New", monospace;
}
pre {
	width: 90%;
	overflow: auto;
	overflow-y: hidden;
	margin: .75em 0;
	padding: 12px;
	background: #eee;
	color: #555;
}
pre strong {
	font-weight: normal;
	color: black;
}
#copyright {
	margin: 20px 0 5px 0;
	text-align: right;
	font-size: .8em;
	color: #848F63;
}
#copyright a {
	color: #848F63;
	text-decoration: none;
}
#copyright a:hover, #copyright a:focus {
	text-decoration: underline;
}

.style2 {
color:#666666;
font-size: .8em;
}

.Style3 {
font-size: .9em;
}

.style4 {
color:#333333;
font-size: .9em;
}

.style5 {
color:#000000;
font-size: 1.5em;
font-weight:bold;
}

.style6 {
color:#000000;
font-size: 1.3em;
font-weight:bold;
}

a.link_admin {
color:#000000;
text-decoration:none;
font-weight:bold;
}

a:hover.link_admin {
color:#00357d;
text-decoration:underline;
}


.titre {
color:#ffffff;
font-size: 1.4em;
font-weight:bold;
}

.Style13 {font-family: Arial, Helvetica, sans-serif; font-size: 10px; color:#666666;}


.Style15 {
background-color:#e9e9e9;
height:65px;
padding:3px;
}

.Style17 {
background-color:#333333;
color:#ffffff;
font-weight:bold;
font-size: 1em;
}

.Style18 {
background-color:#333333;
color:#ffffff;
font-weight:bold;
font-size: 1.6em;
font-family:Verdana, Arial, Helvetica, sans-serif;
}

.Style19 {
font-weight:bold;
font-size: 1.2em;
}

.form {
background-color:#f5eba4;
color:#000000;
font-size: 1em;
border:dashed 1px #cec798;
}

.float {
	display: block;
	width:200px;
	float:left;
}

.center {
	text-align: center;
}

.right {
	text-align: right;
}

.left {
	text-align: left;
}


input {
font-size: 0.9em;
border:solid 1px #837e5b;
background-color:#cec798;
color:#000;
}

input:hover {
border: 1px solid #9db300;
background-color: #bec77c;
color:#1f5300;
}

textarea {
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size: 0.9em;
border:solid 1px #837e5b;
background-color:#cec798;
color:#000;
}

textarea:hover {
background-color: #bec77c;
color:#1f5300;
}

.erreur {
	color: #EE0808;
}

.horaires {
	border: 1px solid #9db300;
	width:95%;
	font-size: 0.8em;
	border-collapse:collapse;
}

.horaires td {
	border: 1px solid #9db300;
	padding:3px;
}

.horaires th {
	background-color:#9db300;
	color:#FFFFFF;
	font-size: 0.9em;
	padding:3px;
	border: 1px solid #829405;
}

.horaires td.selection {
	background-color:#cfda81;
	border: 1px solid #9db300;
}


a.info{
    position:relative;
    z-index:24;
    color:#9db300;
    text-decoration:none;}

a.info:hover{z-index:25;}

a.info span{display: none;}

a.info:hover span{ 
/*le contenu de la balise span ne 
sera visible que pour l'état a:hover */
 display:block;
 position:relative;
 float:left;    
    
    width:145px;
    border:1px solid #9db300;
    background-color:#eeeeee; color:#9db300;
    text-align: left;
	font-size:0.8em;
    padding:1px;
    
    }

#Layer1 {
	position:relative;
	float:left;
	width:180px;
	height:340px;
	z-index:500;
	margin-left: 450px;
	margin-top: -370px;
	overflow: auto;
}

#Layer2 {
	position:relative;
	float:left;
	width:650px;
	height:380px;
	z-index:500;
	margin-left: 0px;
	margin-top: 10px;
	overflow: auto;
}