/* ################### SOMMAIRE, explications ############### **

	pour naviger dans le css, ctrl+F puis *numero de la rubrique

 ~0 Body  												|	le background et les textes de base
 ~1 le haut du site (ce qui ne bouge pas)  				|	le header, les bans, le logo
 ~1.1 maincontent global  								|	les 3 blocs de contenus (normal, large, xtra large)
 ~2 Menu principal (ne pas toucher aux mainlevels)  	|	gestion du menu principal, id top
 
 ~3 Bloc sorties de la semaine  						|	le bloc de la homepage, avec les 4 sorties mises en avant
 ~4 Bloc de recherche  									|	le bloc de recherche, qui est soit en float left, soit en absolute dans le header
 ~5 newsletter  										|	le bloc pour s'inscrire a  la newsletter
 ~6 menu annexe  										|	un menu secondaire, pas en place sur tous les sites
 
 ~7 evenements  										|	le bloc homepage reserve aux evenements
 
 ~8 cine jeu  											|	colonnes cine jeu (large et normal)
 ~9 footer  											| 	pied de page du site, toutes les rubriques, copyright, xiti
 ~10 maincontent details  								|	les textes et tables du maincontent (h3, strong, p...)
 ~11 table horaires  									|	gestion du design du tableau des horaires
 ~12 fiche films et fiches horaires (ne pas toucher)  	|	affichage des blocs de fiches films (films a l'affiche, horaires, fiches films...) >> ne modifier que les largeur/hauteur dans le cas de sites larges
 ~13 Styles disponibles dans l'editeur de page FCK  	|	styles selectionnables par les exploitants dans l'editeur de contenu (voue a  changer/disparaitre)
 ~14 sous-menus d'une page  							|	si une page a  des sous-rubriques, ces styles s'appliquent
 ~15 bloc recrutement  									|	design du bloc recrutement, sur la page du maªme nom
 ~16 bloc contact  										|	idem pour la page contact
 ~17 page newsletter  									|	design de la page newsletter (formulaire)
 ~18 divers  											|	ajouts divers, types boutons specifiques a un site

*/


#masthead, 
#mod_subscribe #lm_email,
#mod_evenement,
#mod_evenement h1, 
#mod_evenement h2,
#rightlarge, 
#right, 
#mod_resa,
div.fichefilm-mini a.bt-film-small,
#sous_menu,
.fichefilm-video a img,
.videopanel {behavior: url(/shared/pie/PIE.htc); position:relative;}


/*###################################################################     Declarations globales      */
h1, h2, h3, h4 {
	/* setup some more readable header spacing */
	margin-bottom: 8px;
	margin:0;
	font-weight:bold;
	display:block;
	color:#c00;
}
a {text-decoration: none; color:#cd003a;}
a:hover {text-decoration: underline; color:#000;}

/*###################################################################  *0     Body      */
body {
	background:#70b9df url(image/bg_body.png) top repeat-x;
	font-family:Verdana, Geneva, sans-serif;
	color:#fff;
}

/*###################################################################  *1     le haut du site (ce qui ne bouge pas)      */
#masthead {
	width:980px;
	margin:10px auto 0 auto;
	padding:0;
	position:relative;
	padding-bottom:20px;
	margin-bottom:20px;
	background:#fff;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;	
	color:#000;
}
#ban_small {
	display:none;
}
#header {
	display:block;
	background:url(image/bg_header.png) top center no-repeat;
	position:relative;
	width:980px;
	height:281px;
	clear:both;
	margin:0; padding:0;
}
#logo {
	display:inline;
	margin:0;
	top:24px;
	left:48px;
	position:absolute;
}
#logo img {
	vertical-align:middle;
	width:248px;
	height:66px;
	border:0;
}
#ban_big {
	padding:3px 0;
	height:auto;
}

/*###################################################################  *1.1   maincontent global      */
#maincontent, #maincontent-large, #maincontent-x-large {
	width:660px;
	float:left;
	margin-left:5px;
	color:#000;
}

/*###################################################################  *2     Menu principal (ne pas toucher aux mainlevels)      */
#top {
	text-align:center;
	height: 35px;
	display:block;
	position:relative;
	clear:both;
	margin-top:0;
	position:absolute;
	text-align:center;
	top:108px;
}
#top ul {
	text-align:center;}
#top li {
	padding:0;
	margin:0 2px;
	display:inline; /*IE double margin fix*/
	list-style:none;
	text-align:center;
	font-weight:bold;
}
#top a , #top a:visited , #top strong {
	height:auto;
	width:auto;
	color:#fff;
	display:inline-block;
	padding:10px 7px;
}
#top a:hover , #top a:visited:hover, #top strong  {
	text-decoration:none;
	color:#dc0000;
	background:#fff;
}



/*###################################################################  *3   Bloc sorties de la semaine      */
#mod_ccweb_affiches {
	width:660px;
	height:223px;
	color:#000;
	float:left;
	display: inline;/* IE double margin fix.*/
	margin:0 0 5px 5px;
	text-align:right;
	position:relative;
	background:url(image/panel_affiches.png) top left no-repeat;
}
#mod_ccweb_affiches h1 {
	display:none;
}
#mod_ccweb_affiches a img {
	border:1px solid #3f3f3f;
}
#mod_ccweb_affiches  div.lastlink {
	text-align:right;
	position:absolute;
	top:8px;
	left:554px;
	padding:0;
	font-size:11px;
	font-weight:bold;
	color:#fff;
}
div.lastlink a {
	color:#fff;
}
div.lastlink a:hover, 
div.lastlink a:visited:hover,
div.lastlink a:focus  {
	color:#d12b2b;
}
.affiche_hebdo { 
	margin:45px 8px 0 8px;
}

/*###################################################################  *4   Bloc de recherche      */
#left {
	position:absolute;
	top:150px;
	height:133px;
	width:980px;
	left:0;
	background:url(image/bg_recherche.png) top left no-repeat;
}
#mod_ccweb_recherche {
	margin:0;
	padding:0;
	display:block;
}
#mod_ccweb_recherche input {
	font-size:11px;
}
#mod_ccweb_recherche h1,
#mod_ccweb_recherche h2,
#mod_ccweb_recherche h3{ display:none;}


#mod_ccweb_recherche div.soustitre {display:none;} 

#mod_ccweb_recherche div.left2 {
	position:absolute;
	top:84px;
	left:23px;
	width: 190px;
}
#mod_ccweb_recherche div.left2 h3 {
}
#mod_ccweb_recherche div.left2  select {
	width:170px;
}
#mod_ccweb_recherche input[type=submit], 
#mod_subscribe input[type=submit] {
	font-size:19px;
	border:none;
	background:none;
	padding:0;
	color:#3f3f3f;
	text-transform:uppercase;
	font-family:Helvetica, "Century Gothic", Arial, sans-serif;
	font-weight:bold;
	width:40px;
	vertical-align:top;
	height:20px;
	line-height:20px;
	display:block;
	position:absolute;
	left: 110px;
	top: 28px;
}
#mod_ccweb_recherche input[type=submit]:hover, 
#mod_subscribe input[type=submit]:hover {
	color:#b20513;
	cursor:pointer;
}
#mod_ccweb_recherche .left2 input[type=submit] {
	position:absolute;
	left: 71px;
	top: 24px;
}
#mod_ccweb_recherche .left3 input[type=submit] {
	position:absolute;
	left: 28px;
	top: 48px;
}
.left3 {
	position:absolute;
	top:55px;
	left:216px;
	width:175px;
	height:40px;
	display:block;
	font-size:11px;
}

.left3 h3 { margin:0; padding:0; display:none;}

.left3  span  { display:inline; position:relative; padding:0;}
.left3  span label.day { margin:0;}
.left3  span input[type=radio]{ margin:0; padding:0; display:inline;}

.heure { position:relative; height:20px; display:block; }
.heure label {
	position:absolute;
	left:18px;
	width:120px;
	top:10px;
}
.heure select {
	position:absolute;
	left:19px;
	top:27px;
	font-size:12px;
}
.heure input { position:absolute; left:145px; top:-2px; font-size:11px; }

/*###################################################################  *5   newsletter      */
#mod_subscribe 	{
	width:251px;
	font-size:10px;
	color:#fff;
	height:39px;
	display:block;
	text-align:left;
	height:73px;
	position:absolute;
	left: 426px;
	top: 46px;
}
#mod_subscribe p {
	color:#3f3f3f;
	margin:5px 5px 0 5px;
	padding:0;
}
#mod_subscribe form {
	margin:0px;
	padding:0px;
	display:inline; /* ie 6 double margin fix*/
}
#mod_subscribe #lm_email {
	width:180px;
	/*width:260px;*/
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border:solid 1px #4c4c4c;
	margin:4px 0 0 5px;
	margin:5px auto auto 5px;
	padding:3px;
	float:left;
}
#mod_subscribe #lm_email:focus { border:solid 1px #cd0039;}
#mod_subscribe input[type=submit] {
	float:left;
	margin-left:90px;
	margin:5px 15px 5px 90px;
}
/*###################################################################  *6   menu annexe      */
#mainlevel-left {
	margin:0;
	float:left;
	text-align:left;
	padding:0;
	position:absolute;
	left:710px;
	top:38px;
	width: 244px;
	height: 85px;
}
#mainlevel-left ul {padding:0px;margin:0px;list-style:none;line-height:20px;}
#mainlevel-left li {padding:0px;margin:0px;list-style:none;line-height:20px;}
a.mainlevel-left {color:#385462; display:block; height:20px; width:245px; background:transparent url(image/menu2_puce.png) left center no-repeat; text-indent:25px;}
a#active_menu.mainlevel-left {font-weight: bold;}
a.mainlevel-left:hover { background:#385462 url(image/menu2_puce_hover.png) left center no-repeat; color:#fff; text-decoration:none;}

/*###################################################################  *7   evenements      */
#mod_evenement { font-size:12px; width:658px; /*pas 660px à cause des borders right/left qui prennent 2px*/ height:auto; min-height:0; float:left; margin:0px 0 5px 5px; background:#fff; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; border:solid 1px #000;}
#mod_evenement h1 { margin:0px; text-align:left; display:block; padding:0px; background:url(image/event_titre.png) top center no-repeat; height:35px; overflow:hidden; color:#fff; text-indent:1500px;}
#mod_evenement h2 { padding:5px; margin:5px 7px 0 7px; color:#fff; font-size:13px; background:#d12b2b; clear:both; }
#mod_evenement h3,
.evenement h3{ padding:0 15px 5px 15px; margin:0; font-size:13px; color:#c00; font-weight:normal; font-style:italic; }
#mod_evenement div.inner { padding:0; margin:0; height:auto; }
#mod_evenement div.introtext { padding:5px 15px 5px 15px; text-align:justify; }
#mod_evenement strong {}
#mod_evenement div.introtext img.left{ margin-right:1em; border:0; }
#mod_evenement div.introtext img.right{ margin-left:1em; border:0; }
#mod_evenement div.introtext img.left { float:left;}
#mod_evenement div.introtext img.right { float:right; }
#mod_evenement div.introtext div.img-center { text-align:center; }
#mod_evenement p { margin-top:0; padding-top:0;}
#mod_evenement a.film { text-align:right; display:block; padding-right:15px; font-weight:bold;}
#mod_evenement div.evenement { clear:both; margin-bottom:5px; padding-bottom:0;}

/*###################################################################  *8   cine jeu      */
#rightlarge, #right, #mod_resa {
	width:300px;
	text-align:center;
	margin:0;
	padding:15px 0;
	background:#e5e5e5;
	-webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;
	margin:0 5px 5px 0;
}
#rightlarge h1, #right h1 {
	display:none;
}
#mod_resa { padding-bottom:5px;}

.pub_space_large {
	height:37px;
	width:100%;
	display:block;
	padding:0;
	margin:0;
	overflow:hidden;
}

/*###################################################################  *9   footer      */

#footer a, #footer a:visited {
	color:#666;
}
#footer a:hover, #footer a:visited:hover {
	color:#666;
}
#footer {
	color:#666;
}

/*###################################################################  *10   les h3 des pages      */

h3.sec, h3.alt { margin:0;}

#maincontent h3,
#maincontent-large h3,
#maincontent-x-large h3,
#maincontent_v2 h3,
#maincontent_v2 h4 { 
	background:#000;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	color:#fff;
	text-indent:25px;
	font-size:20px;
	font-weight:bold;
	font-family:"Century Gothic", Arial, Helvetica, sans-serif;
	line-height:35px;
	height:35px; 
	display:block;
	padding:0;
	margin:0 5px 10px 5x;
	border-bottom:solid 5px #fff;
}

h3#prochainement  { margin-top:7px;}
h3#avant-premiere  {}
h3#horaires { } 
h3#sorties-semaine { margin-top:7px;} 
h3#films-tjrs { margin-top:7px;}
h3#avant-premiere { margin-top:7px;}
h3#autresalaffiche { margin-top:7px;}

#maincontent_v2 h4 { position:relative; top:-10px; left:-10px;}
#maincontent_v2 .autre-videos h3 { background:none; color:#333;}

strong.hi {
	color:#1795b9;
}
/*###################################################################  *11   table horaires   - idéalement à refaire en div,   */
table.horaires {
	width:630px;
	/*background:url(image/tab_21.png) top left repeat-y;*/
	min-height:85px;
}
div.tablehoraireout {
	margin-left:5px; /* decalage pour centrer le tableau*/
}
div.tablehorairein {
	/*background:url(image/tab_3.png) bottom left no-repeat;*/
	padding:0 0 20px 0;
}
table.horaires { width:630px;}
table.horaires th {
	height:25px;
	line-height:25px;
	color:#fff;
	width:90px; background:#303030;
}

table.horaires td {
	height:20px;
	color:#000;
	font-size:11px;
	line-height:20px;
	text-align:center;
	background:#f3f3f3;
}
table.horaires td.col2,
table.horaires td.col4,
table.horaires td.col6 { background:#dedede;	}
table.horaires td.today , 
table.horaires th.today{
	color:#fff;
	background:#d12b2b;
	font-weight:bold;
}
table.horaires .today a { color:#fff;}
/*
table.horaires th.today {
	color:#f56e0b;
}*/
/*###################################################################  *12   fiche films et fiches horaires (ne pas toucher)      */
div.fichefilm-mini-block {
	width:310px; /*suceptible de changer d'un site à l'autre */
	height:180px;/*suceptible de changer d'un site à l'autre */
	display:inline;
}
div.fichefilm-mini a.bt-film-small, 
div.fichefilm-mini a.bt-film-small:visited {	
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	background:#d12b2b;
	height:21px;
	color:#fff; 
}
div.fichefilm-mini a.bt-film-small:hover, 
div.fichefilm-mini a.bt-film-small:visited:hover {background:#000; text-decoration:none;}

/*###################################################################  *13         */
div.cadre { padding:10px;}
div.cadre, 
div.cadre p, 
div.cadre div {
	font-size:12px;
	margin:0;
	color:#3f3f3f;/*suceptible de changer d'un site à l'autre */
	position:relative;
}
div.cadre strong {
	color:#ff8a0d;/*suceptible de changer d'un site à l'autre */
}
div.cadre p {
	color:#3f3f3f;/*suceptible de changer d'un site à l'autre */
}
/*###################################################################  *14   sous-menus d'une page      */
#sous_menu {
	display:block;
	height:40px;
	clear:left;
	background:#fff url(image/sousmenu_bg.png) top no-repeat;
	padding:35px 0 0 0;
	margin-bottom:5px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
}
#sous_menu a, 
#sous_menu strong {
	width:240px;
	height:25px;
	line-height:25px;
	display:block;
    float:left; 
	font-size:13px;
	font-weight:bold;
	text-align:center;
	color:#f37800;
	padding:0;
	margin:1px;
}
#sous_menu a, 
#sous_menu a:visited {	color:#cd0039;}
#sous_menu a:hover, 
#sous_menu a:visited:hover, 
#sous_menu strong {	color:#ffa525;}

#titre_cinema {
	position:absolute;
	top:-42px;
	left:0;
}
#titre_cinema h1 {
	font-weight:normal;
	color:#c00;
	font-size:20px;
	width:350px;
	display:block;
	text-align:center;
}

/*###################################################################  *15   bloc recrutement      */
#mod_recrute { margin-left:15px; float:left;}
#mod_recrute p { text-align:justify;}
#mod_recrute form { margin:0; padding:0; width:500px; float:left;}
#mod_recrute label { display:block;	font-weight:bold; font-size:13px; color:#1968ab; margin-top:18px;}
.inp_recrut { width:226px; height:22px;}
#mod_recrute input { border:solid 1px #999;}
#mod_recrute textarea {	border:solid 1px #999; width:396px; height:136px;}
#left-block-recrut { display:block;	float:left;	width:290px; height:auto; text-align:left;}
#right-block-recrut { display:block; float:left; width:400px; height:auto; text-align:left;}
#bt-submit-recrut { clear:left; padding-top:15px;}

/*###################################################################  *16   bloc contact      */
#mod_contact label {  color:#c00;}
#mod_contact input { border:solid 1px #ccc; }
#mod_contact textarea { border:solid 1px #ccc;  }

/*###################################################################  *17   page newsletter      */
#newsletter-abo { width:660px;background:none;  margin-top:10px; }

#newsletter-abo label {  color:#ffa525;}
#newsletter-abo input { border:solid 1px #999; }
#newsletter-abo #genre_film label { color:#5d5d5d; }
#newsletter-abo #genre_film legend {  color:#5d5d5d; }

/*###################################################################  *18   divers      */

/* Commentaire public de film */
div.fichefilm-small div.comment , div.fichefilm-full div.comment {
padding-right:20px;
	float:right;
	font-weight:bold;
}
div.fichefilm-small div.comment img , div.fichefilm-full div.comment img {
	vertical-align:top; 
}
/* bouton horaires de la semaines prochaine */
div.bt-sem-pro, div.bt-sem-der {
	text-align:center;
	font-size:13px;
	font-weight:bold;
}
p.vote { margin-bottom:0; height:19px; padding:0;}

/* modification du header pour la résa*/
.resa #top a{ font-weight:bold; }
.resa #top a:hover { }

/* nouveau footer*/
#footer_new {
	width:980px;
	margin:15px auto 0 auto;
	padding:0;
	position:relative;
	padding-bottom:20px;
	color:#3f3f3f;
}
#menu_2 { float:left; width:180px; margin:0 0 0 20px; display:inline;}
#sous_rubs_ce { float:left; width:180px; margin:0 0 0 30px; display:inline;}
#liste_films_affiche { float:left; width:530px; margin:0 0 0 30px; display:inline;}


#footer_new ul, 
#footer_new li { list-style:none; padding:0; margin:0;}
#footer_new a{ color:#999999; font-size:11px;}
#footer_new strong { color:#fff; font-size:11px;}

#mod_liste_films_test ul.liens_footer_new li { display:inline; }
#mod_liste_films_test ul.liens_footer_new li a { width:260px; display:inline-block; }

.page li { font-size:14px; min-height:20px; margin-bottom:10px; list-style-image:url(image/puce_contenu.png);}
.page ol li { list-style-image:none; }



#ban_video2 { position:absolute; top:4px; right:4px;}


/*couleurs des liens autres vidéos*/
.fichefilm-video a:focus,
.fichefilm-video a:hover{ background:#d12b2b;}
.fichefilm-video a img { background:#3f3f3f; margin-left:5px;}
.fichefilm-video a span { color:#3f3f3f; font-size:13px; margin:10px 0 0 5px; width:105px; }

.fichefilm-video a img { padding:2px;  -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;}
.fichefilm-video a.sel img { background:#5c9ce3; }

/* correction h3 portail pour aveugles*/
#maincontent-large #mod_evenement .inner .evenement h3 { font-size:13px;}


body.video #header { height:150px; overflow:hidden;}

#zone_ss_nl {
	position:absolute;
	top:700px;
	left:0;
}

.fichefilm-video a:focus { background:#ddd;}
.fichefilm-video a img { background:#3f3f3f;}
.fichefilm-video a span { color:#3f3f3f; font-size:14px; margin:10px; width:115px; }

.fichefilm-video a img { padding:2px;  -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;}
.fichefilm-video a.sel img { background:#5c9ce3; }

.lien a {
	color : #5c9ce3}

#resa_mail {
text-align:center;
width:400px;
float:left;}



#prog_dianes {
	position:absolute;
	top:80px;
	left:800px;
}	
#bouton_facebook {
	position:absolute;
	top:10px;
	left:840px;
}
#bouton_facebook img { width:60px; height:auto;}
