/*styles globaux */

body {
    margin: 40px 0px 20px 0px; 
    text-align: center;
    font-family: arial;
    font-size: 11px;
    background-color:#FFFFFF;
    text-align:left;
     }
     
#global {
    margin-left: auto;
    margin-right: auto;
    width: 867px;
    text-align: left;
    background-image: url(../images/background-main.gif);
		background-repeat: repeat-y;
		background-color:#FFFFFF;
     }

/*haut de page */

#pagetop {
		height:16px;
		background-color:#b7c0c1;
		text-align:right;
		border-bottom:1px solid white;
}          

#banner {
		height:111px;
		border-top:1px solid #b8c0c2;
}

#logo {
	float:left;
	width:178px;
}

#bannermain {
		background-image:url(../images/background-header-fr.jpg);
		background-repeat:no-repeat;
		background-position:top right;
		height:111px;
		float:right;
		width:689px;
}

#bannermain.en {
		background-image:url(../images/background-header-en.jpg);
}

/*centre de page */

#central {
		border-right: 1px solid #b7c0c1;
		border-bottom: 1px solid #b7c0c1;
}

#breadcrumbs {
		height:14px;
		background-color:#f18e00;
		color:#FFFFFF;
		padding-left:11px;
		float:left;
  	width: 389px !important;
		width:400px;
  	width/**/:/**/389px;
}

#breadcrumbs a {
		color:#FFFFFF;
}

#date {
		background-image: url(../images/text-date-fr.gif);
		background-repeat:no-repeat;
		background-position:top left;
		height:22px;
		float:right;
		width:466px;
}

#date.en {
		background-image: url(../images/text-date-en.gif);
		background-repeat:no-repeat;
		background-position:top left;
		height:22px;
		float:right;
		width:466px;
}

/*contenu principal */

div#main {
		margin: 20px 29px 16px 218px;
		background-color:#FFFFFF;	
		width:610px;
}

h1 {
		font-size:12px;
		border-top: dotted black 1px;
		border-bottom: dotted black 1px;
		color:#e53601;
		text-transform:uppercase;
		clear:right;
}	

h2 {
		font-size:14px;
		font-weight:bold;
		color:#243185;
}

h3.actus {
		font-size:14px;
		font-weight:bold;
		color:#243185;
		border-top: dotted black 1px;
		border-bottom: dotted black 1px;
}

h3.actus span {
		color:#f09000;
}

.intro {
		font-size:14px;
		font-weight:bold;
		color:#243185;
}

img.droite {
		margin-left:10px;
		margin-bottom:10px;
}

.accroche {
		background-image: url(../images/fleche-simple-d.gif);
		background-repeat:no-repeat;
		background-position:top left;
		color:#91B200;
		padding:4px 0px 2px 19px;
}

.accroche a {
		font-weight:bold;
}

.utils {
		border-top: dotted black 1px;
		border-bottom: dotted black 1px;
		height:20px;
		font-weight:bold;
}

#ditto_pages {
		border-top: dotted black 1px;
		border-bottom: dotted black 1px;
		height:20px;
		font-weight:bold;
}

.utils span {
		float:right;
		margin-left: 20px;
		padding-top:3px;
}

.utils img {
		margin-right:4px;
		vertical-align:middle;
}

/*menu gauche */

div#topnav {
	float: left;
	width: 178px;
	margin: 10px 0px 0px 0px;	
}

#topnav li {
		list-style: none;
		margin-left:-40px;
		width:178px !important;
		width:170px;
  	width/**/:/**/178px;		
	}
	
#topnav li a, #topnav li span {
		text-decoration: none;
		display:block;	
	}

li.level1 a, li.level1 span {
		color:#4C687E;	
		width:146px !important;
		width:178px;
  	width/**/:/**/146px;		
		padding:3px 5px 3px 27px;	
		border-bottom:1px dotted #FFFFFF;
		background-image:url(../images/fond_menu-lv1.gif);
		background-repeat:no-repeat;
		font-size:12px;
		font-weight:bold;
		color:#FFFFFF;
		text-decoration:none;
	}

li.level1 a:hover, li.level1 a:active, li.level1 span  {
		color:#FFFFFF;
		background-image:url(../images/fond_menu-lv1.gif);
		background-color:#bbd900;
		}	

li.level1 span, li.level1 a.open {
		border:0px;
		background-image:url(../images/fond_menu-lv1-on.gif);		
		color:#595b5a;
}

li.level2 a, li.level2 span {
		width:132px !important;
		width:178px;
  	width/**/:/**/132px;	
		background-image:url(../images/fond_menu-lv2.gif);		
		border:0px;
		padding:0px 4px 0px 42px;
		font-size:11px;
		font-weight:normal;
		color:#546b00;
	}

li.level2 a:hover, li.level2 a:active, li.level2 span, li li.active a {
	color:#404c00;
	background-image:url(../images/fond_menu-lv2-on.gif);
	background-repeat:no-repeat;
	}	

/* footer */

#footer {
		text-align:center;
		background-color:#b7c0c1;
		color:#FFFFFF;
		border-top:1px solid #FFFFFF;	
		height:16px;	
}

#footer a {
		font-weight:bold;
		color:#FFFFFF;
}

a 	{
		color:#91B200;
		}

a:hover, #footer a:hover 	{
		color:#e53601;
		}

.gauche 	{
		float:left;
margin-right:10px;
		}

.droite 	{
		float:right;
margin-left:10px;
		}
		
hr {
		border: none 0;	
		height:1px;
		border-bottom: dotted black 1px;
		}

.accroche a:hover, .accroche a:focus, .accroche a:active {
  /*
  On 'hover' set the anchor to 'position:relative' to get a
  measuring point. Somehow IE doesn't like it when this is
  in the '.accroche a' declaration...
  */
  position: relative;
  text-decoration: none;
}

.accroche a:hover span, .accroche a:focus span, .accroche a:active span {
  /*
  Take the previously hidden span and display it near the anchor
  */
  left: 40px;
  top: 20px;
  width: 100px;
  /*
  This is just for looks...
  */
  padding: 5px;
  line-height: 1.5em;
  font-size: 80%;
  background: #FFEAC8;
  border: 1px solid #F09E16;
  color: #000;
  text-decoration: none;
}

.accroche a:hover span:before, .accroche a:focus span:before, .accroche a:active span:before {
  /*
  IE doesn't show this - but others do.
  */
  content: " ";
}

.accroche a span
{
	/*
	Use 'position:absolute' to push the span inside the anchor
	way off the screen
	*/
	position: 		absolute;
	left: 			-9999px;
	top: 			-9999px;
	width: 			900px;
}

.accroche {
		background-image: url(../images/fleche-rouge.gif);
		background-repeat:no-repeat;
		background-position:top left;
		color:#91B200;
		padding:2px 0px 0px 19px;
		font-weight:bold;
		height:20px;
}

.picto {
		vertical-align:text-bottom;
}

/* Tableaux et zone programmes */

table {
width:610px;
border:1px dotted black;
text-align:left;
border-collapse:collapse;
}

td {
border:1px dotted black;
padding:2px;
}

td.titre {
width:610px;
}

.matinee td, .apresmidi td, .matinee th, .apresmidi th {
border:1px dotted black;
padding:2px;
}

.matinee td, .apresmidi td {
width:570px;
}  

.matinee th, .apresmidi th {
width:40px;
}

th.horaires {
background-image: url(../images/horaires-am.gif);
background-repeat:no-repeat;
background-position:center center;
width:40px;
color:#FFFFFF;
font-weight:bold;
font-size:12px;
text-align:center;	
}

.apresmidi .horaires {
background-image: url(../images/horaires-pm.gif);
}

.apresmidi h4, .apresmidi h5, .apresmidi h6, .bleu {
color:#006eb6;
font-weight:bold;
}

.apresmidi h4, .apresmidi h5, .apresmidi h6 {
display:inline;
}

.matinee h4, .matinee h5, .matinee h6, .orange {
color:#ef8e00;
font-weight:bold;
}

.matinee h4, .matinee h5, .matinee h6 {
display:inline;
}


.matinee h4, .matinee h5, .apresmidi h4, .apresmidi h5 {
text-transform:uppercase;
}

.matinee h5, .matinee h6, .apresmidi h5, .apresmidi h6 {
font-size:11px;
}

.matinee h4, .apresmidi h4 {
font-size:12px;
height:16px;
padding:2px 0px 0px 45px;
width:610px;
}

.matinee .titre {
background-image:url(../images/fond-am.gif);
background-repeat:no-repeat;
background-position:center center;
}

.apresmidi .titre {
background-image:url(../images/fond-pm.gif);
background-repeat:no-repeat;
background-position:center center;
}

.matinee img, .apresmidi img {
vertical-align:middle;
}			

/* formulaires  */

form {
margin: 2px 0px;
display:inline;
}

input,select,textarea {
font-size: 11px;
background-color: #f7f7f7;
color: #000000;
border: 1px solid #CCCCCC;
margin:1px;
	 }
	  
.bouton {
font-size: 11px;
color: #FFFFFF;
font-weight:bold;
background-color: #9dc200;
border:1 px dotted #CCCCCC;
margin: 3px 0px 0px 7px;
	 }

#plan li {
		list-style: square;
		margin-left:-20px;
		font-weight:bold;
		color:#e53500;
}

#plan li li {
		font-weight:normal;			
}

/* formulaires  */

form {
margin: 2px 0px;
display:inline;
}

input,select,textarea {
font-size: 11px;
background-color: #f7f7f7;
color: #000000;
border: 1px solid #CCCCCC;
margin:1px;
	 }
	  
.bouton {
font-size: 11px;
color: #FFFFFF;
font-weight:bold;
background-color: #9dc200;
border:1 px dotted #CCCCCC;
margin: 3px 0px 0px 7px;
	 }