/*
	Mise en forme de balises standard
*/
body{
	background-color:#ffffff;
	color:#000000;
	text-align:center;
}
*{
	font-size:12px;
	color:#000000;
	font-family:arial;
}
h1{
	font-size:18px;
	color:#2BB470;
}
h2{
	font-size:16px;
	text-align:center;
	background-color:#000000;
	color:#ffffff;
}
h3{
	font-size:14px;
	color:#2BB470;
	text-align:left;
}
h4{
	font-size:13px;
}
a{
	color:#24B26A;
	font-weight:bold;
}
a img{
	border:0;
}
img,img.bordure{
	border:1px solid #000000;
}

/*
	Mise en forme des éléments de la page
*/
#page{
	width:760px;
	margin:0 auto 0 auto;
	text-align:left;
}
#son{
	display:none;
}
#haut{
	background-image:url(/Images/Index/c1.jpg);
	width:736px;
	height:20px;
}
#milieu{
	text-align:left;
	width:737px;
}
#milieu #gauche{
	background-image:url(/Images/Index/c5bis.jpg);
	background-repeat:repeat-y;
}
#milieu #centre{
	margin-right:23px;
	width:687px;
	padding-bottom:20px;
}
#milieu #droite{
	margin-left:26px;
	background-image:url(/Images/Index/c4.jpg);
	background-repeat:repeat-y;
	background-position:top right;
}
#bas{
	clear:both;
}

/*
	Mise en forme des différents logos et menu situés au début de la page
*/
#quadrichromie,
#smieapn,
#logo,
#visite{
	float:left;
}
#quadrichromie{
	background-image:url(/Images/Index/c2.jpg);
	width:26px;
	height:74px;
	position:relative;
	top:-8px;
	left:-28px;
}
#logo{
	margin:30px 40px 0 40px;
}
#menu,
#bas{
	clear:both;
	margin:0;
	padding:0;
	list-style-type:none;
	height:30px;
}
#menu li,
#bas li{
	float:left;
	background-color:#24B26A;
}
#menu li.debut,
#bas li.debut{
	background-image:url(/images/index/menu-gauche.gif);
	width:15px;
	height:30px;
}
#menu li.fin,
#bas li.fin{
	background-image:url(/images/index/menu-droit.gif);
	width:15px;
	height:30px;
}
#menu li a,
#bas li a{
	display:block;
	float:left;
	font-size:10px;
	color:#ccffcc;
	padding:0 6px 0 6px;
	height:30px;
	line-height:28px;
	white-space:nowrap;
	text-decoration:none;
	font-family:verdana;
	font-size:9px;
}
#menu li a:hover,
#bas li a:hover,
.hover{
	color:#ffffff;
	background-color:#17854d;
}
#menu ul{
	float:left;
	position:absolute;
	display:none;
	border:1px solid #24B26A;
	background-color:#24B26A;
	z-index:2;
	margin:30px 0 0 0;
	padding:0;
	list-style:none;
}
#menu ul li{
	clear:both;
}
#menu ul li a{
	width:183px;
	height:10px;
	padding:5px;
	line-height:10px;
}
#menu ul ul{
	margin:0 0 0 170px;
}
#bas li a{
	padding:0 9px 0 9px;
}

/*
	Mise en forme des colonnes
*/
.colonne{
	float:left;
	margin-right:20px;
}
.c1{
	width:22%;
}
.c2{
	width:45%;
}
.c3{
	width:60%;
}
.c4{
	width:30%;
}
.gauche{
	float:left;
	margin-right:10px;
}
.centre{
	text-align:center;
}
.droite{
	float:right;
	margin-left:10px;
}
.separateur{
	clear:both;
}
.legende{
	text-align:center;
	font-style:italic;
	margin:0;
}

/*
	Mise en forme du texte parlé et défilant en Flash
*/
#texte{
	text-align:center;
	margin:0 0 20px 0;
}
#texte *{
	border:1px solid #000000;
}

/*
	Mise en forme de différents tableaux
*/
#opah{
	width:100%;
	border-collapse:collapse;
	margin:20px 0 0 0;
}

#horaires{
	width:100%;
	border-collapse:collapse;
}
.cinema{
	width:100%;
	border-collapse:collapse;
	margin-bottom:20px;
}
#opah td,
#horaires th,
#horaires td,
.cinema th,
.cinema td{
	border:1px solid #000000;
	padding:5px;
	width:10%;
}
.cinema th.film{
	width:30%;
}
#horaires th,
.cinema th.film{
	text-align:left;
}
#horaires td,
.cinema th,
.cinema td{
	text-align:center;
}

/*
	Mise en page des différents div
*/
.otsi{
	clear:both;
}
.otsi img{
	float:left;
	margin:0 10px 20px 0;
}
.otsi h4{
	margin:0 0 10px 0;
}
.otsi p{
	margin:0;
}

/*
	Evenements de l'agenda
*/
.evenement{
	border-top:1px solid #2BB470;
	margin:0 0 10px 0;
}
.evenement h4{
	margin:0;
	color:#2BB470;
}
.evenement h5{
	font-style:italic;
	margin:0;
}
.evenement p{
	margin:5px 0 5px 0;
}