/* DEBUT ---------------------- Controle sur le layout de la page : HTML, BODY et LAYOUT principal ------------------------- */	
	body {
		text-align : center;
		margin : 0;
		padding : 0;
		background : #333;
		font-size : 11px;
		color : #FFF;
		font-family : "Lucida Sans Unicode", "Trebuchet MS", "Helvetica", "Arial", sans-serif;
		}
	
	html, body {
         	  	scrollbar-face-color : #111;
    	       	scrollbar-shadow-color : #333;
	           	scrollbar-highlight-color : #333;
	           	scrollbar-3dlight-color : #333;
	           	scrollbar-darkshadow-color : #333;
	           	scrollbar-track-color : #333;
	           	scrollbar-arrow-color: #FF6600;
}

	#layout {
		width : 980px;
		margin-right : auto;
		margin-left : auto;
		margin-top : 10px;
		padding : 0px;
		text-align : left;
		position : absolute;
		left : 50%;
		margin-left : -490px;
		}

	#menu {
		background : #000;
		border-top : 10px solid #FFF;
		border-bottom : 3px solid #FFF;
		min-height : 204px;
		float : left;
		margin-right : 10px;
	}

	*html #menu {
		height : 204px;
	}

	#right {
		width : auto; 
		border-top : 10px solid #FFF; 
		float : left; padding-top : 15px;
	}

	#footer {
		clear: both;
		margin: 0px;
		padding-top: 5px;
		text-align: center;
		background : #000;
		border-top : 3px solid #FFF;
		height : 30px;
	}
/* FIN ---------------------- Controle sur le layout de la page : HTML, BODY et LAYOUT principal ------------------------- */	





/* DEBUT ---------------------- Définition de tous les liens quels que soient les #id utilisés ... ------------------------- */
	a:link, a:visited, a:active {
		color: #FF6600;
		text-decoration: none;
	}

	a:hover {
		color: #FFF;
		text-decoration: none;
	}

	h4 a:link, h4 a:visited {
		color: #fff;
		text-decoration: none;
	}

	h4 a:hover, h4 a:active {
		color: #D6DC84;
	}
/* FIN ---------------------- Définition de tous les liens quels que soient les #id utilisés ... ------------------------- */



/* DEBUT ---------------------- Premiere partie entete de l'intro ... photo aleatoire, menu et texte explicatif ------------------------- */		
	#imgintro {
		display : block;
		width : 290px;
		height : 218px;
		float : left;
		margin-right : 10px;
	}

	#textintro {
		display : block;
		background : #000;
		border-top : 10px solid #FFF;
		border-bottom : 3px solid #FFF;
		width : auto;
		height : 184px;
		overflow : hidden;
		padding : 10px;
		}

	#textintro p {
		margin-top : -5px;
		padding : 10px;
		line-height : 20px;
	}
/* FIN ---------------------- Premiere partie entete de l'intro ... photo aleatoire, menu et texte explicatif ------------------------- */




/* DEBUT ---------------------- 2e partie : Colonne Blogarea + Colonne MAJ + Colonne Zoom Actu ------------------------- */	
	#blogarea {
		display : block;
		width : 480px;
		float : left;	
		margin-right : 20px;
		margin-bottom : 15px;
	}

	#blog1, #blog2, #blog3 {
		 border-top : 10px solid #333;
		width : auto;
		height : 300px;
		overflow : auto;
	}

	*html #blogarea {
		margin-right : 20px;
	}

	#menu2 {
		display : block;
		width : auto;
		margin-left : 490px;
		height : 30px;
		}


	#maj, #zoomactu {
		width : 225px;
	}

	#zoomactu {
		background : #000;
		padding-left : 5px;
		padding-bottom 10px;
		padding-right : 5px;
		float : right;
	}

	#maj {
		margin-right : 15px;
		float : left;
	}

	#maj img {
		border : 0;
	}
/* FIN ---------------------- 2e partie : Colonne Blogarea + Colonne MAJ + Colonne Zoom Actu ------------------------- */	



/* DEBUT ---------------------- TOOLTIP ... ------------------------- */

	#dropmenudiv {
		position : absolute;
		border : 3px solid #FF6600;
		font-size : 10px;
		z-index:100;
		padding : 10px;
		background : #111;
		margin-top : 2px;
		margin-left : -15px;
		text-align : justify;
	}

	#dropmenudiv img {
		border : 2px solid #FFF; 
		margin : 10px; 
		margin-right : 15px;
		float : left;
	}

/* FIN ---------------------- TOOLTIP ------------------------- */




/* DEBUT ---------------------- DIV INFOS, NAV - IFRAME, VIDEO, IMG ... ------------------------- */

	#showdiv {
		position : absolute;
		display : none;
		border : 1px solid gray;
		z-index : 3000;
	}

	#dragbar {
		cursor : hand;
		cursor : pointer;
		background-color : #EFEFEF;
		min-width : 100px; /*NS6 style to overcome bug*/
	}

	#dragbar #closetext {
		font-weight : bold;
		margin-right : 1px;
	}

/* FIN ---------------------- DIV INFOS, NAV - IFRAME, VIDEO, IMG ... ------------------------- */





/* DEBUT ---------------------- Définition des listes UL, LI, DT, DD, DL ... ------------------------- */

	#nav ul {
		list-style-type : none;
		padding : 0;
		margin : 0;
		margin-top : 15px;
		margin-bottom : 15px;
	}

	#nav li   {
		margin : 0;
		padding : 0;
		display : block;
	}

	#nav a {
		font-size : 12px;
		display : block;
		width : 180px;
		margin : 0;
		padding : 2px 0px 2px 10px;
		color : #FF6600;
		text-decoration : none;
	}

	html>body #nav a {
		width : 170px;
	}

	#nav a:hover {
		color : #FFF;
		text-decoration : none;
		background-color : #FF6600;
	}


	#nav ul li ul {
		list-style-type : none;
		padding : 0;
		margin : 0;
		margin-left : 10px;
		margin-bottom : 10px;
	}

	#nav li ul li {
		margin : 0;
		padding : 0;
		display : block;
		color : #FFF;
	}

	#nav li ul li a {
		color : #FFF;
		background : transparent;
		text-decoration : none;
		border-bottom : 1px dashed #333;
		font-size : 10px;
		width : 160px;
	}

	html>body #nav li ul li a {
		width : 150px;
	}

	#nav li ul li a:hover {
		color : #FF6600;
		border-bottom : 1px solid #666;
		background : transparent;
	}

	#maj ul {
		list-style-type : none;
		padding : 0;
		margin : 2px 0px 20px 10px;
	}

	#maj li {
		font-size : 1em;
		border-bottom : 1px solid #666;
		padding : 2px 0px;
		color: #5B5B5B;
	}

	#maj a {
		color: #999;
		text-decoration: none;
		font-size : 10px;
	}

	#maj a:hover {
		color : #FF6600;
		text-decoration : none;
	}

	.left-layout li {
		border-bottom : 3px solid #000;
	}

	dt, dd, dl {
		width : auto;
	}

	dd {
		margin : 0;
	}

	dt {
		font-weight : 600;
	}


	dt span, dd span {
		margin-left : 2px; 
		padding : 0 2px 0 2px; 
		background : #666; 
		color : #FFF;
		font-weight : 300;
	}

	dt span.more, dd span.more {
		background : #B13A49;
		font-size : 10px;
	}	

	.calendrier dt {
		color : #FF6E00; 
		border-bottom : 1px solid #FF6E00;
		margin-bottom : 5px;
		padding-left : 5px;
	}

	#blogarea .calendrier dt {
		border-bottom : 0;
		font-size : 14px;
	}

	#blogarea .leftcalendrier {
		height : 20px;
		line-height : 20px;
	}

	div.content-layout div.calendrier dt {
		color : #FF6600;
		border-bottom : 1px solid #FFF;	
	}

	div.zoom div.calendrier dt {
		border-bottom : 1px solid #EEE;
		margin-left : -1px;
		font-size : 16px;	
	}

	.calendrier dl {
		margin-bottom : 15px;
	}

	.calendrier dd {
		padding-left : 10px;
	}

	dd.descr {
		color : #CCC;
	}

	div.zoom div.calendrier dd {
		padding : 0px;
		color : #FF6600;
	}

	div.zoom div.calendrier dd.bold {
		margin-top : 10px;
		color : #FFFFFF;
	}

	div.calendrier div#zoom-horaires dt {
		border : 0;
	}

	div.calendrier div#zoom-fiche dt {
		display : none;
	}

	div.calendrier div#zoom-horaires dd.bold {
		margin-top : -3px;
		margin-bottom : 10px;
	}

/* CALENDRIERS
------------------------------------------------------------------------------------------------*/

	.calendrier {
		width : auto;
	}

	.leftcalendrier {
		float : left;
		width : 110px;
		margin : 0;
		padding : 0;
		background : #000;
		font-weight : 600;
		color : #FFF;
		padding-right : 3px;
		text-align : right;
		display : block;
	}
	.leftcalendrier2 {
                float : left;
                width : 130px;
                margin : 0;
                padding : 0;
                background : #000;
                font-weight : 600;
                color : #FFF;
                padding-right : 3px;
                text-align : right;
                display : block;
        }


	#blogarea .calendrier {
		width : 400px;
	}

	.contentcalendrier {
		margin-left : 85px;
		padding : 0;
		display : block;
	}

	div.zoom div.leftcalendrier {
		float : left;
		width : 120px;
		background : transparent;
		text-align : left;
	}
	
	div.zoom div.leftcalendrier2 {
                float : left;
                width : 120px;
                background : transparent;
                text-align : left;
        }


	div.zoom div.contentcalendrier {
		margin-left : 130px;
		color : #000;
		border-left : 1px solid #EEE;
		padding-left : 10px;
		max-width: 300px;
	}


	.leftcalendrier img {
		margin-top : 5px;
		margin-right : 2px;
	}
	.leftcalendrier2 img {
                margin-top : 0px;
                margin-right : 2px;
        }


	#menu-cinema .leftcalendrier, #right .leftcalendrier {
		border : 3px solid #000;
		padding : 0;
		margin : 0;
		overflow : hidden;
		width : 75px;
		height : 75px;
	}
	#menu-cinema .leftcalendrier2, #right .leftcalendrier2 {
                border : 3px solid #000;
                padding : 0;
                margin : 0;
                overflow : hidden;
                width : 110px;
                height : 290px;
        }

	 #right .leftcalendrier {
		border : 3px solid #FFF;
	}
		 #right .leftcalendrier2 {
                border : 3px solid #FFF;
        }


	#menu-cinema .leftcalendrier a, #menu-cinema .leftcalendrier img, #right .leftcalendrier a, #right .leftcalendrier img {
		border : 0;
		padding : 0;
		margin : 0;
	}


	div.leftcalendrier a {
		display : block;
		width : auto; 
		color : #FFF; 
		text-decoration : none; 
		font-size : 12px; 
		font-weight : 300; 
		background : #FF6E00;
		border-bottom : 1px solid #FFF;
		padding-left : 3px;
		font-weight : 600;
	}

	div.leftcalendrier a:hover {
		background : #B13A49;
		color : #FFF;
	}

	.contentcalendrier-vide {
		margin-left : 0;
		padding : 0;
	}

	#zoom-liste a, #zoom-horaires a {
		display : block;
		width : auto; 
		color : #ff6E00; 
		text-decoration : none; 
		padding-left : 3px;
	}

	#zoom-horaires a {
		margin-left : -10px;
	}

	#zoom-liste a:hover, #zoom-liste a.select {
		color : #B13A49; 
		background : #EEE;
		border-right : 20px solid #B13A49; 
	}

	div.zoom h4 {
		font-size : 20px;
		margin : 0;
		margin-bottom : 10px;
		color : #B13A49; 
		background : #EEE;
		padding : 5px;
	}

	.test {
		width: auto; 
		color : #fff; 
		background : #B13A49; 
		margin-top : 10px; 
		padding : 10px;
	}

	.jump {
		display : block; 
		height : 110px; 
		overflow : hidden; 
		clear : both;
	}

	#right .jump {
		width : 244px;
		margin : 2px;
		margin-left : 0;
		margin-bottom : 0;
		clear : none;
		float : left;
		background : #111;
		padding : 6px;
		height : 100px;
	}

	.descr {
		font-size : 9px;
		margin-bottom : 10px;
	}

	.bold {
		font-weight : 600;
	}

	div#zoom-critique p.bold {
		font-size : 14px;
	}
/* FIN ---------------------- Définition des listes UL, LI, DT, DD, DL ... ------------------------- */





/* DEBUT ---------------------- Titres H1, H2, H3, H4, H5 ... ------------------------- */
	h2 {
		font-family: "Trebuchet MS", "Helvetica", "Arial", sans-serif;
		font-size: 22px;
		font-weight: 600;
		color: #FF6600;
		margin: 0px 0px 15px 0px;
		padding: 0;
	}

	*html h2 {
		font-size: 22px;
	}

	h3 {
		font-family: "Century Gothic", "Helvetica", "Arial", sans-serif;
		font-size: 14px;
		font-weight: normal;
		color: #fff;
		margin: 0px 0px 10px 0px;
		padding: 0;
	}

	h4 {
		font-size: 1.1em;
		font-weight: bold;
		color: #fff;
		text-transform: uppercase;
		letter-spacing: 0.1em;
		margin: 0px 0px 10px 0px;
		padding: 0px 0px 2px 0px;
		border-bottom: 1px solid #9C9F74;
	}

	h5 {
		font-size: 1em;
		color: #fff;
		text-transform: uppercase;
		margin: 0px 0px 5px 0px;
		padding: 0;
		margin: 0;
	}

	h6 {
		font-size: 1.5em;
		font-family: "Century Gothic", "Lucida Sans Unicode", "Trebuchet MS", "Helvetica", "Arial", sans-serif;
		color: #606060;
		font-weight: normal;
		margin: 0;
		padding: 0;
	}
/* FIN ---------------------- Titres H1, H2, H3, H4, H5 ... ------------------------- */




/* DEBUT ---------------------- MENU BOX : le mini site internet quand on clique sur cinema, ou sortir ... ------------------------- */
	.menubox {
		position : absolute;
		z-index : 100;
		top : 60px;
		left : 0px;
		display : none;
		width : 800px;
		padding : 0px;
		background-color : #000;
	}
	.menubox2 {
                position : absolute;
                z-index : 100;
                top : 60px;
                left : 0px;
                display : none;
                width : 800px;
                padding : 0px;
                background-color : #000;
        }


	div.menubox div.left-layout ul {
           		padding : 0;
	           	margin : 0;
           		list-style : none;
           		text-decoration : none;
	}


	div.menubox div.left-layout li a {
		display : block;
		width : 170px;
		text-decoration : none;
		background : #FF6600;
		color : #FFF;
		padding-left : 5px;
	}

	div.menubox div.left-layout li a:hover {
		background : #000;
		color : #fff;
	}

	.layout {
		width : 100%;
	}

	.top-layout {
		padding: 3px;
		background-color: #FF6600;
		color : #FFF;
		margin-bottom : 10px;
		font-size : 20px;
		font-weight : 600;
		letter-spacing : 1px;
		padding-left : 10px;
	}

	.left-layout {
		float : left;
		width : 165px;
		margin : 0;
	}

	.right-layout {
		float : right;
		width : 270px;
		margin : 0;
	}

	.right-layout p {
		background : #FF6600;
		height : 301px;
		display : block;
		padding : 5px;
		margin : 0;
	}

	.content-layout {
		margin-left: 180px;
		margin-right: 275px;
		padding : 5px;
		max-width: 36em;
		background : #333;
		height : 300px;
	}

	.foot-layout {
		clear: both;
		margin: 0;
		padding: 0;
		color: #333;
		background-color: #ddd;
		height : 120px;
		margin-top : 10px;
		overflow : hidden;
	}

	.foot-layout img {
		border : 0;
		padding : 0;
		margin : 0;
	}

	.overflow {
		margin : 5px;
		margin-left : 0px;
		margin-right : 0px;
		height : 280px;
		overflow : auto;
		padding-right : 5px;
	}
/* FIN ---------------------- MENU BOX : le mini site internet quand on clique sur cinema, ou sortir ... ------------------------- */





/* DEBUT ---------------------- Classes Visibles / Hidden via Display ------------------------- */
	.visible {
		display : block;
	}

	.hidden {
		display : none;
	}
/* FIN ---------------------- Classes Visibles / Hidden via Display ------------------------- */




/* DEBUT ---------------------- Auto Scaling Img IE / Mozilla : WARNING !!! Ce boulet de IE scale au max kil peut ... ------------------------- */
	.img {
		width : auto;
		text-align : center;
	}

	.img img {
		width : 99%;
		border : 10px solid #000;
	}
/* FIN ---------------------- Auto Scaling Img IE / Mozilla : WARNING !!! Ce boulet de IE scale au max kil peut ... ------------------------- */




/* DEBUT ---------------------- Flash Info Accueil ------------------------- */
	#flashinfo {
		width : auto; 
		background : #000; 
		height : 20px; 
		line-height : 20px; 
		display : block; 
		clear : both; 
		margin-top : 10px; 
		margin-bottom : 10px; 
		overflow : hidden;
		color : #FFF;
	}
	
	#flashinfo .fileft {
		width : 100px; 
		height : 20px; 
		line-height : 20px; 
		font-size : 13px; 	
		background : #FF6600; 
		float: left; 
		display : block;
		padding-left : 3px;
		font-weight : 600;
	}

	#flashinfo .firight {
		width : auto; 
		line-height : 14px; 
		font-size : 11px; 
		display : block;
		float : left;
		padding-left : 3px;
	}

	#dropcontentsubject {
		font-weight : bold;
		}

	.dropcontent{
		padding : 3px;
		clear : both;
	}	
/* FIN ---------------------- Flash Info Accueil ------------------------- */	

