body {
  font-family: Arial, Helvetica, FreeSans, sans-serif;
  font-size: .8em;
  line-height: 1.2; /* À adapter au design. */
  background: url(images/degrade_bas.png) repeat-x;
  background-position: bottom;
}

div#global {
  background: url(images/degrade.png) repeat-x;
  background-position:0 467px; /* avant Evil Alien : 0 130px; */
}
div#global_mini {
  background: url(images/degrade_bas.png) repeat-x;
  background-position:0 129px;
}
div#global_sousmenu {
  background: url(images/degrade_sousmenu.png) repeat-x;
  background-position:0 129px;
}

div#page {
  width: 980px;
  margin-left: auto; 
  margin-right: auto;
}

h1, h2, h3, h4, h5, h6 { 
  margin: 5px 5px 2px 0; /* Rapproche le titre du texte. */ 
  font-weight: bold; 
  font-style: normal; 
} 
h1 { 
  font-size: 1.75em; 
} 
h2 { 
  font-size: 1.5em; 
} 
h3 { 
  font-size: 1.25em; 
} 
h4 { 
  font-size: 1.25em; 
}

p {
  margin: 5px;
}

a { 
  text-decoration: none; 
}
a:link { 
  color: #9b141b; 
} 
a:visited { 
  color: #9b141b; 
} 
a:hover, a:focus, a:active { 
  color: #9b141b;
  text-decoration: none;
  outline:none;
  text-decoration: underline;
}
a img { 
  border: none; 
}

form, fieldset { 
  margin: 0; 
  padding: 0; 
  border: none; 
} 
input, button, select { 
  vertical-align: middle; /* Solution pb. d'alignement. */
}

ul {
  list-style-type: square;
  list-style-position: inside;
  margin: 5px;
}


div#header {
  padding: 0; 
}

div#connexion {
  float: right;
  text-align: right;
  margin-top: 68px; /* ou 25px pour mettre le bloc au niveau du logo */
}

div#connexion input {
  margin: 2px;
}

div#logo {
  margin-left: -20px;
}

div#menu {
  font-size: 1.4em;
  margin-top: -10px;
  margin-bottom: 5px;
}

div#menu a:hover {
  text-decoration: none;
  color: black;
}

div#fiche_film {
  height: 190px;
  background: url(images/degrade_fiche_film.png) repeat-x;
  margin-bottom: 10px;
}

div#accroche {
  float: left;
  width: 185px;
  height: 200px;
  padding: 0 5px;
}
div#accroche span.titre_icone {
  color: #999;
}
div#accroche div.bloc_image_accroche1, div#accroche div.bloc_image_accroche2, div#accroche div.bloc_image_accroche3 {
  float: left;
  margin-top: 5px;
}
div#bloc_phrase_accroche {
  float: left;
  width: 185px;
  height: 100px;
  margin-top: 5px;
}

div#images_film {
  float: left;
  width: 447px;
  height: 200px;
}
div#images_film a img {
  vertical-align: bottom;
}
div.image_grande {
  float: left;
  margin-right: 5px;
}

div.images_moyennes a {
  float: left;
  margin-bottom: 3px;
  border-bottom:2px solid transparent;
}
div.images_moyennes a:hover {
  border-bottom: 2px solid #9b141b;
}

div#synopsis {
  float: left;
  width: 325px;
  height: 200px;
  padding: 0 5px;
}

div#autres_films {
  height: 100px;
  background: url(images/degrade_autres_films.png) repeat-x;
  margin-bottom: 5px;
}

div#titre_autres_films {
  float: left;
  width: 155px;
  padding: 5px;
}

div#images_autres_films {
  float: left;
  width: 810px;
}
div#images_autres_films a img {
  vertical-align: bottom; /* Suppression du bug ajoutant un espace sous les images */
}

div#images_autres_films a {
  margin-left: 30px;
}

/* Texte par dessus image */
.image_autre_film {float:left; text-decoration:none;}
.image_autre_film em {font-style:normal;}
.image_autre_film em.texte, .image_autre_film b {display:none; text-align: center; font-size:0.9em;}

.image_autre_film:hover {background:#000; position:relative; cursor:pointer; text-decoration:none;}
.image_autre_film:hover b {display:block; position:absolute; top:70px; left:0; width:66px; background:#9b141b; height:30px;}

.image_autre_film:hover em.texte {display:block; position:absolute; top:70px; width:66px; left:0px; height:30px; color:#FFF;}
/* Texte par dessus image */

/* Si besoin de flèches pour faire défiler les films. 
div#defilement_autres_films {
  float: left;
  width: 70px;
  padding: 38px 0;
}
img.fleche_gauche, img.fleche_droite {
  margin: 0 5px;
}
*/

div#sous-menu {
  height: 30px;
  background: #1a1a1a;
  margin-bottom: 10px;
}
div#sous-menu a {
  float: left;
  display: block;
  height: 18px;
  font-size: 1.2em;
  font-weight: bold;
  color: #666;
  padding: 6px 10px;
}
div#sous-menu a:hover {
  color: white;
  background: #333;
  text-decoration: none;
}
div#sous-menu a:active, div#sous-menu a:focus {
  text-decoration: none;
}
div#sous-menu a.onglet_actif {
  background: white;
  color: black;
}

div#corps {
  clear: both;
  padding: 0 5px;
}

div.bloc_unique {	/* 1 grand bloc unique.*/
  float: left;
  width: 949px;
  background: url("images/degrade_gris.png") repeat-x;
  padding: 0 5px;
  margin: 0 5px;
  text-align: justify;
}
div.bloc_duo {	/* 2 blocs */
  float: left;
  width: 465px;
  background: url("images/degrade_gris.png") repeat-x;
  padding: 0 5px;
  margin: 0 5px 5px 5px;
  text-align: justify;
}
div.bloc_trio {	/* 3 blocs */
  float: left;
  width: 303px;
  background: url("images/degrade_gris.png") repeat-x;
  padding: 0 5px;
  margin: 0 5px;
  text-align: justify;
}
div.bloc_trio_faq {	/* 3 blocs faq */
  float: left;
  width: 303px;
  background: url("images/degrade_gris.png") repeat-x;
  padding: 0 5px;
  margin: 0 5px;
}
div.bloc_trio_transparent {	/* 3 blocs transparents */
  float: left;
  width: 303px;
  padding: 0 5px;
  margin: 0 5px;
  text-align: justify;
}
div.bloc_duo_gauche {	/* 1 grand bloc à gauche. A coupler avec un #bloc_trio.*/
  float: left;
  width: 626px;
  background: url("images/degrade_gris.png") repeat-x;
  padding: 0 5px;
  margin: 0 5px;
  text-align: justify;
}
div.bloc_centre {
  float: left;
  width: 465px;
  background: url("images/degrade_gris.png") repeat-x;
  padding: 0 5px;
  margin: 0 5px 5px 232px;
  text-align: justify;
}
div.bloc_trio p, div.bloc_duo p, div.bloc_unique p, div.bloc_duo_gauche p, div.bloc_centre p {
  color: black;
}
p.affiche {
  text-align: center;
}

div.bloc_films {	/* 3 blocs page catalogue*/
  float: left;
  width: 301px;
  background: url("images/degrade_gris.png") repeat-x;
  border: 1px dotted grey;
  padding: 0 5px;
  margin: 0 5px 15px 5px;
  text-align: justify;
}
div.bloc_films p {
  color: #666;
}

div.bloc_partenaires {  /* 3 blocs page catalogue*/
  float: left;
  width: 301px;
  height: 300px;
  background: url("images/degrade_gris.png") repeat-x;
  border: 1px dotted grey;
  padding: 0 5px;
  margin: 0 5px 15px 5px;
  text-align: justify;
}
div.bloc_partenaires p {
  color: #666;
}

div.bloc_banniere {
  background: url("images/degrade_gris.png") repeat-x;
  border: 1px dotted grey;
  padding: 5px;
  margin-top: 5px;
}

div#footer {
  clear: both;
  margin-top: 10px;
}

div#infos_site {
  text-align: center;
}
div#infos_site a {
  color: #AAA;
}
div#infos_site a:hover, div#infos_site a:focus, div#infos_site a:active {
  color: black;
  text-decoration: none;
}

.pdf {
  width: 959px;
  height: 550px;
}

.rouge {
  color: #9b141b;
}
.noir {
  color: #000000;
}
.blanc {
  color: #FFF;
  text-decoration: underline;
}

.italique {
  font-style: italic;
}

.message {
  padding: 4px;
  margin-right: 3px;
  text-align: center;
  background: #464646;
  color: white;
}
.erreur {
  padding: 4px;
  margin-right: 3px;
  text-align: center;
  background: #9b141b;
  color: white;
}

span.element_menu {
  margin: 8px;
}

input.bouton {
  border: none;
  padding: 4px;
  margin-bottom: 16px;
  width: 150px;
  background-color: #666666;
  color: white;
  font-weight: bold;
  cursor:pointer;  
}
input.bouton2 {
  border: none;
  margin-top: 15px;
  padding: 4px;
  width: 150px;
  background-color: #9b141b;
  color: white;
  font-weight: bold;
  cursor:pointer;  
}
input.champ {
  padding: 3px;
  color: #444444;
}

div#bloc_mise {
	width: 300px;
	margin: 20px auto;
}
form#miser {
  text-align: center;
  margin-top: 10px;
}

h1 {
  color: white;
  margin-left: 10px;
}
h3 {
  color: white;
}
p {
  color: #AAAAAA;
}

div.clear {
  clear: both;
}

span.titre_film {
  font-size: 1.75em;
  font-weight: bold;
  color: white;
  margin-left: 190px;
}
span.titre_francais_film {
  font-size: 1.75em;
  color: white;
}

span.titre {
  font-size: 1.75em;
  font-weight: bold;
  color: white;
  margin-left: 5px;
}

p.synopsis_texte {
  height: 135px;
  text-align: justify;
}
p.lien_film {
  text-align: right;
  margin-right: 5px;
}
span.autre_film {
  font-weight: bold;
}

.gras {
  font-weight: bold;
}
.justifier {
  text-align: justify;
  }
.centrer {
  text-align: center;
}
.droite {
  text-align: right;
}
#partager {
  height: 5px;
}
#partager a {
  vertical-align:top;
}

form#quantite, form#paiement {
  margin-top: 10px;
}
#ajouter {
  width: 26px;
  height: 26px;
  background-image: url(images/bouton_plus.png);
  border: 0;
}
#soustraire {
  width: 26px;
  height: 26px;
  background-image: url(images/bouton_moins.png);
  border: 0;
}

table.tableau {
  margin: 0 auto;
}
table.tableau td, table.tableau th {
  border: 1px solid #B5B8C8;
  text-align: center;
  padding: 2px;
}
table.tableau th {
  color: #555;
}

div.questions {
  margin-bottom: 10px;
}
a.question {
  font-weight: bold;
  text-decoration: underline;
  color: #9b141b;
}

/************************************ Barre de progression **********************************/
div.barre_progression {
  position: relative;
  width: 204px;
  margin: 0 auto;
  background: url(images/barre_progression.png) no-repeat;
}
div.barre {
  width: 200px;
  height: 20px;
  padding: 0 2px;
}
div.progression {
  position: absolute;
  height: 20px;
  background: url(images/barre_progression_fond.png) 0 2px repeat-x;
}
div.texte_progression {
  position: absolute;
  width: 200px;
  line-height: 20px;
  text-align: center;
  color: #FFF;
  font-weight:bold;
}


/************************************ Formulaire d'inscription ************************************/
form.formular {
	width:650px;
	margin: 0 auto;
}

/* Contact */
form#formulaire_contact {
	width: auto;
	margin: 0 auto;
}
#email_contact {
	width: 200px;
}
#sujet_contact {
	width: 405px;
}
#message_contact {
	width: 400px;
	height: 200px;
}
/* Contact */

.formular fieldset {
	margin-top: 10px;
	padding : 15px;
	border: 1px solid #B5B8C8;
}

.formular legend {
	color: #9b141b;
	font-weight: 900;
}

.formular fieldset label {
	float: none;
	text-align: inherit;
	width: auto;
}

.formular label span {
	color: #000;
}

.formular input, .formular select, .formular textarea {
	display : block;
	margin-bottom: 5px;
}

.formular .text-input {
	width: 250px;
	color: #555;
	padding: 4px;
	border: 1px solid #B5B8C8;
	margin-top: 4px;
	background: #FFF;
	
}
.formular textarea {
	width: 250px;
	height:70px;
	color: #555;
	padding: 4px;
	border: 1px solid #B5B8C8;
	margin-top: 4px;
	background: #FFF;
	
}
.formular .infos {
    text-align: left;
	color: #333;
	padding: 5px;
	margin-bottom: 10px;
}
.formular .newsletter {
    float: left;
	margin-left: 5px;
}

.formular span.checkbox, .formular .checkbox {
	display: inline;
	padding: 5px;
}

.formular .submit {
	background: #FFF;
	border: 1px solid #AAA;
	padding: 4px;
	margin: 0 auto;
	margin-top: 10px;
	text-decoration: none;
	cursor:pointer;
}

.formular hr {
	clear: both;
	visibility: hidden;
}

.formular .fc-error {
	width: 350px;
	color: 555;
	padding: 4px;
	border: 1px solid #B5B8C8;
	margin-bottom: 15px;
	background: #FFEAEA;
}

.formError {
  position:absolute;
  top:300px; left:300px;
  width:150px;
  padding-bottom:15px;
  display:block;
  z-index:5000;
}
.formError .formErrorContent {
  width:100%; 
  background:#000;
  color:#fff;
  font-family:tahoma;
  font-size:10px;
  box-shadow: 0px 0px 6px #000;
  -moz-box-shadow: 0px 0px 6px #000;
  -webkit-box-shadow: 0px 0px 6px #000;
  padding:4px 10px 4px 10px;
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
}
.formError .formErrorArrow{
  position:absolute;
  bottom:0;left:20px;
  width:15px; height:15px;				
}
.formError .formErrorArrow div{
  box-shadow: 0px 0px 6px #000;
  -moz-box-shadow: 0px 0px 6px #000;
  -webkit-box-shadow: 0px 0px 6px #000;
  font-size:0px; 
}
.formError .formErrorArrow .line10{width:15px;height:1px; background:#000;margin:0 auto; font-size:0px; display:block;} 
.formError .formErrorArrow .line9{width:13px;height:1px; background:#000;margin:0 auto;display:block;} 
.formError .formErrorArrow .line8{width:11px;height:1px; background:#000;margin:0 auto;display:block;} 
.formError .formErrorArrow .line7{width:9px;height:1px; background:#000;margin:0 auto;display:block;} 
.formError .formErrorArrow .line6{width:7px;height:1px; background:#000;margin:0 auto;display:block;} 
.formError .formErrorArrow .line5{width:5px;height:1px; background:#000;margin:0 auto;display:block;} 
.formError .formErrorArrow .line4{width:3px;height:1px; background:#000;margin:0 auto;display:block;} 
.formError .formErrorArrow .line3{width:1px;height:1px; background:#000;margin:0 auto;display:block;} 

div.formulaire_cellule { display:table-cell; padding:5px; vertical-align:top;}
div.formulaire_cellule2 { display:table-cell; padding:5px; vertical-align:top; width:594px;}
div.formulaire_cellule3 { display:table-cell; padding:5px; vertical-align:top; width:455px; margin: 0 auto;}

/********************************************** Système de commentaire ****************************/

#formulaire_commentaire {
  margin-top: 5px;
}

.box {
  background-color: #E1E1E1;
  padding-top: 3px;
  border-bottom:1px solid #FFF;
}

ol.timeline {
  list-style:none;
}
ol.timeline li { 
  padding:.7em 1em .6em 1em;
}	

#flash {
  margin-left:100px;
}

span.date {
  font-style: italic;
  font-size: 0.9em;
}

div#pagination {
  margin: 10px 0;
  text-align: right;
}
a.pagination_commentaire {
  border: 1px solid #E1E1E1;
  padding: 5px 9px;
  margin-right: 5px;
  color: #9b141b;
}
a.pagination_commentaire:first-child {
  font-weight: bold;
}


/************************************** Popup window modal ***************************************/

div.non_affiche {
  display: none;
}

div#intro {
  width: 480px;
  height: 280px;
}

/******************************************* Player video ********************************************/

div#contour_player {
  width: 863px;
  height: 373px;
  margin: 0 auto;
  background: url(images/pellicule.png);
}

div#player {
  width:600px;
  height:340px;
  padding-right: 1px;
  padding-top: 17px;
  margin: 0 auto;
}

div#miniplayer {
  width:303px;
  height:170px;
  margin: 0 auto;
}