/****************************************
        STYLE GÉNÉRAL DE LA PAGE  
 ****************************************/

#entete, #menu, #recherche, .submit {/zoom : 1;} /*hack ie */

html {font-size: 100%;}

body {
	font-size: 0.8125em;
	font-family: "Luxi sans", "Lucida Grande", Lucida, "Lucida Sans Unicode", sans-serif;
	color: #333;
	margin: 0;
	padding: 0;
	text-align: center;
	background-color: #870000;
	background-image: url("./images/background.jpg");
	background-repeat:repeat-y;
	background-position: top center;
}

/* Style des liens si pas de spécifications */
a {
	text-decoration: none;
	color:#a91f1c
}
a:hover{
	color:red;
}

img {
	border: none; /* pas de bordure bleu autour des images liens */
} 

h5{
	text-align:center;
	font-size:1.8em;
	color:#ca7444;
	margin-top:10px;
	margin-bottom:20px;
}
#lightbox{
	background-color:#eee;
	padding: 10px;
	border-bottom: 2px solid #666;
	border-right: 2px solid #666;
	}
#lightboxDetails{
	font-size: 0.8em;
	padding-top: 0.4em;
	}	
#lightboxCaption{ float: left; }
#keyboardMsg{ float: right; }
#closeButton{ top: 5px; right: 5px; }

#lightbox img{ border: none; clear: both;} 
#overlay img{ border: none; }

#overlay{ background-image: url(overlay.png); }

* html #overlay{
	background-color: #333;
	back\ground-color: transparent;
	background-image: url(blank.gif);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="overlay.png", sizingMethod="scale");
	}
	
	
/*************************************
	BLOCS PRINCIPAUX 
*************************************/

/* Style de la div conteneur qui va contenir toutes les autres div's */
#page {
	width: 893px;
	position: relative;
	margin: 0 auto; 
	text-align: left;
}

/* Style pour l'entete de la page */
#entete {
	width: 893px;
	height: 153px;
	margin: 0;
	background-color:white;
}

/* Style pour la div qui contient les informations des articles, rubriques, ... de la page */
#bloc-gauche {
	width: 63.2%;
	float: left;
	margin: 0em;
	clear: both;
	overflow: hidden;
	background-color: white;
	padding:0px;
}
#bloc-gauche  ul.recherche  {
	margin:0;
	padding:0;
	text-decoration:none;
	list-style-type: none;
}
#bloc-gauche  ul.recherche  li.recherche{list-style-type: none;}
.recherche  {list-style-type: none;}
#bloc-gauche  a.recherche{
	float:left; 
	margin: 0 1em 2em 0;
}


/* Style pour la div située à droite et qui contient la web tv, la newsletter, le blog, les archives ...*/
#bloc-droit { 
	width: 36.8%; 
	float: right; 
	overflow: hidden; 
	margin: 0; 
	padding:0px; 
	background-color:white;
}
#bloc-droit h5{font-size:1.1em;} 

/* Mise en page des gros blocs prenant toute la page */
#bloc-recherche{
	background-image:url("./images/onglet-recherche.jpg");
	background-repeat:no-repeat;
	background-color:white;
	padding:30px;
}
#bloc-toutelapage{
	background-color:white;
	padding:30px;
}
#conteneur {
	width: 893px; 
	height: auto;  
	background-color:white; 
	clear:both;
}

/* Style pour le gros bloc du milieu contenant dans les div bloc-gauche et bloc-droit*/
#bloc-page{
	margin-top:50px;
	background-color:white;
	min-height:660px;
	/margin-top:20px; /*hack IE*/
}

/* Style pour le pied de page */
#pied {
	width: 893px; 
	height: 39px; 
	margin: 0 auto; 
	padding:0px; 
	text-align: center; 
	clear: both; 
	font-size: 0.90em; 
	background-color:white; 
	background-image:url("./images/footer.jpg");
}
#pied p{
	margin: 0; 
	padding:0px;  
	padding-top:20px; 
	font-style:italic;
}


/*************************************
	CONTENU BLOC-GAUCHE
*************************************/

/* Style pour le bloc de gauche contenu dans la div bloc-gauche */
.prog-a-venir {
	background-color : white; 
	background-image:url("./images/titre-a_venir.jpg"); 
	background-repeat: no-repeat ;  
	border:0; 
	width:50%; 
	float:left; 
	border-right: 1px solid #E5E5E5; 
	padding:30px 0;
}

/* Style pour le bloc de droit contenu dans la div bloc-gauche */
.retrospective  {
	background-color : white; 
	background-image:url("./images/titre-retrospective.jpg");
	background-repeat: no-repeat ;
	border:0;
	width:49.5%;
	float:left;
	padding:30px 0;
}

.prog-a-venir h1, .retrospective h1 {text-align: center;}
.prog-a-venir .img-centre, .retrospective .img-centre{ text-align: center;}

/* Style du diaporama */
#diapo  {
	background-color : white;  
	background-image:url("./images/onglets-courts_diaporama.jpg"); 
	background-repeat: no-repeat; 
	border:0; 
	float:left; 
	padding:35px 0 0 0; 
	clear:both; 
	border-top:1px solid gray; 
	width:100%; 
	height:410px;
}
#diaporama_innerfade a img {
	border:4px solid #FFFFFF;
	padding-left:11px; 
	height:auto;
}



/*************************************
	CONTENU BLOC-DROIT
*************************************/

/* Style pour la div qui contient les articles du blog */
#blog {
	overflow: hidden; 
	background-image:url("./images/titre-long_blog.jpg"); 
	background-repeat: no-repeat; 
	height: auto;  
	border-left: 1px solid gray;
	/padding-top:15px; /*hack IE*/
}
#blog ul{padding-top:2em;}
#blog li{padding:0.2em 0;}

/* Style pour la div qui contient le nuage de tag */
#tag{
	overflow: hidden; 
	background-image:url("./images/titre-long_tag.jpg"); 
	background-repeat: no-repeat;
	border-left: 1px solid gray; 
	height:auto;
	/margin-top:15px; /*hack IE*/
	/padding-top:15px; /*hack IE*/
}
#tag ul{padding:15px 8px 8px 8px;}

/* Style pour la div qui contient les articles des archives */
#archive { 
	overflow: hidden; 
	background-image:url("./images/titre-long_archive.jpg");
	background-repeat: no-repeat; 
	height: auto;  
	border-left: 1px solid gray;
	/padding-top:15px; /*hack IE*/
}
#archive ul{padding-top:2em;}
#archive li{padding:0.2em 0;}

/* Style pour la div qui contient les articles de la presentation */
#mp3 { 
	overflow: hidden; 
	background-image:url("./images/titre-long_mp3.jpg"); 
	background-repeat: no-repeat; 
	height: auto; 
	min-height: /*365*/505px;  
	border-left: 1px solid gray; 
	text-align:center; 
	/padding-top:15px; /*hack IE*/
}
#mp3 p{padding-top : 2em;}


/*-----------------------------------------
	        DATCHATV
-------------------------------------------*/

#web-tv {
	overflow: hidden; 
	background-image:url("./images/titre-long_datchatv.jpg"); 
	background-repeat: no-repeat; 
	background-position:top right; 
	height: auto; 
	border-left: 1px solid gray; 
	text-align:center; 
	padding:27px 0 0;
}
#web-tv p { 
	float:right; 
	padding-right:20px; 
	margin-top:7px; 
	padding-top:0px; 
	padding-bottom: 10px; 
	color:white; 
	font-weight:bold;
}
#web-tv a { 
	margin-left:auto;
	margin-right:auto;
	width:155px;
	height:57px;
	display:block;
}
#web-tv object{
	/height:240px; /*hack IE*/
	/width:320px; /*hack IE*/
}
#boutonTV{
	width:155px;
	height:57px;
	background-image:url("./images/boutonTV.jpg");
}
#boutonTV:hover{background-position:bottom;}


/*-----------------------------------------
	        CALENDRIER
-------------------------------------------*/
#calendrier{
	overflow: hidden; 
	background-image:url("./images/titre-long_evenements.jpg"); 
	background-repeat: no-repeat; 
	height: 150px;  
	border-left:1px solid gray; 
	height:auto;
}
#calendar {
	margin-left:auto; 
	margin-right:auto; 
	padding-top: 35px; 
	width:80%; 
	text-align:center;
}
#calendar table{ 
	margin-left:auto; 
	margin-right:auto; 
	padding-top: 10px; 
	width:80%;
}
#calendar td.horsperiode{color:#e0e0e0;}
#calendar td.occupe a{
	border:1px solid #993132;
	display:block;
	width:100%;
}
#calendar td.occupe a:hover{
	background-color:#993132;
	color:white;
}

/*------------------------------------------
                NEWSLETTER
--------------------------------------------*/


/* Style pour la div qui contient le formulaire d'inscription de la newsletter */
#news {
	overflow: hidden;  
	background-image:url("./images/titre-long_newsletter.jpg"); 
	background-repeat: no-repeat; 
	height: auto; 
	border-left: 1px solid gray; 
	/padding-top:15px;  /*hack IE*/
}

/* Style pour le champ de newsletter présent dans le sommaire */
#news input[type=text] {
	background-color: #b3b3b3;
	background-image:url("./images/input.jpg");
	background-repeat:no-repeat;
	float:left;
	margin:0;
	border:0;
	width: 151px;
	height:23px;
	padding-top:5px;
	padding-left:8px;
	margin-bottom:10px;
	margin-left:40px;
}

#news input[type=text]:hover,#news input[type=submit]:hover {background-position:bottom left;}

#news input[type=submit] {
	background-image:url("./images/btn-ok-newsletter.jpg"); 
	background-repeat:no-repeat; 
	margin: 0; 
	border:0; 
	width: 29px; 
	height:29px; 
	float: left; 
	padding-bottom:20px; 
	padding-left:1px; 
	cursor:pointer;
}

#news strong{color:red;}

#news p{
	padding-top:2em;
	padding-left:2em;
}

#news p.center {
	padding-top:0.5em;
	padding-left:2em;
}


/*************************************
	      MENU PRINCIPAL
*************************************/

#menu {
	display:block;
	float:left;
	height:29px;
	width:705px;
	background-color:black;
}

#menu ul {
	margin:0; 
	padding:0; 
	list-style-type: none;
	/height:28px; /*hack IE*/
}

#menu li {
	float:left; 
	display: inline; 
	text-align:center; 
	padding:0; 
	/height:28px; /*hack IE*/
}

#menu li a{
	color: white;
	font-size:1.12em;
	font-style:bold;
}

#menu li p{
	color: white;
	font-size:1.12em;
	font-style:bold;
	vertical-align:middle;
}

#menu li a, #menu li a:hover {
	line-height:0px; 
	display:block; 
	width: 140px; 
	height:14px;
	/line-height:29px; /*hack IE*/
	/height:28px; /*hack IE*/
}

#menu li.rouge {
	background-image:url("./images/menu_rouge.jpg"); 
	width: 50px; 
	height:29px; 
	padding-top:0px;
	/padding-top:0; /*hack IE*/
	/height:28px; /*hack IE*/
}

#menu li.vert {
	background-image:url("./images/menu_vert.jpg"); 
	width: 111px; 
	height:14px; 
	padding-top:15px;
	/padding-top:0; /*hack IE*/
	/height:28px; /*hack IE*/
}

#menu li.bordeaux {
	background-image:url("./images/menu_bordeaux.jpg"); 
	width: 141px; 
	height:14px; 
	padding-top:15px;
	/padding-top:0; /*hack IE*/
	/height:28px; /*hack IE*/
}

#menu li.orange {
	background-image:url("./images/menu_orange.jpg"); 
	width: 131px;  
	height:14px; 
	padding-top:15px;
	/padding-top:0; /*hack IE*/
	/height:28px; /*hack IE*/
}

#menu li.bleu {
	background-image:url("./images/menu_bleu.jpg"); 
	width: 131px;  
	height:14px; 
	padding-top:15px;
	/padding-top:0; /*hack IE*/
	/height:28px; /*hack IE*/
}

#menu li.jaune {
	background-image:url("./images/menu_jaune.jpg"); 
	width: 141px;  
	height:14px; 
	padding-top:15px;
	/padding-top:0; /*hack IE*/
	/height:28px; /*hack IE*/
}

/* Changement graphique des boutons du menu au survol  */
#menu li.rouge:hover, #menu li.vert:hover, #menu li.bordeaux:hover, #menu li.orange:hover, #menu li.jaune:hover {
	background-position:bottom left; 
	line-height:0px;
}

/*************************************
  CHAMP RECHERCHE (BARRE MENU)
*************************************/

#recherche input[type=text] {
	background-color: #b3b3b3; 
	background-image:url("./images/input.jpg"); 
	background-repeat:no-repeat; 
	float:left; 
	margin:0; 
	border:0; 
	width: 150px; 
	height:23px; 
	padding-top:5px; 
	padding-left:8px; 
	/height:22px; /*hack IE*/
}

#recherche input[type=text]:hover {background-position:bottom left;}

#recherche input{
	font-style:italic;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:1em;
	color:#646464;
}
	
#recherche input[type=submit] {
	background-color: black; 
	background-image:url("./images/input_submit.jpg"); 
	background-repeat:no-repeat; 
	margin: 0; 
	border:0; 
	width: 29px;
	height:29px; 
	float: left; 
	padding-bottom:20px; 
	padding-left:1px; 
	cursor:pointer;
	/height:28px; /*hack IE*/
}


/*************************************
                BOUTONS
*************************************/


/* Style pour les boutons "voir toutes les infos" */
.voirtout-vert{
	background-image:url("./images/btn-infos-vert.jpg");
	background-repeat:no-repeat;
	color:white;
	font-size:0.8em;
	width: 110px;
	height:20px;
	line-height:17px;
	padding-left:20px;
	margin-left: 120px;
	margin-top:10px;
	float:left;
}
.voirtout-vert a,.voirtout-rouge a, .voir-accueil a{color:white;}
.voirtout-rouge{
	background-image:url("./images/btn-infos-rouge.jpg");
	background-repeat:no-repeat; 
	color:white; 
	font-size:0.8em; 
	width: 110px; 
	height:20px; 
	line-height:17px; 
	padding-left:20px; 
	margin-left: 120px; 
	margin-top:10px;
	float:left;
}
/* Style pour les boutons "retour à l'accueil" */
.voir-accueil{
	background-image:url("./images/btn-voir-accueil.jpg");
	background-repeat:no-repeat;
	color:white;
	font-size:0.8em;
	width: 105px; 
	height:20px; 
	line-height:17px; 
	padding-left:25px; 
	margin-left: 120px; 
	margin-top:10px;
	float:right
}
.voirtout-vert:hover, .voirtout-rouge:hover, .voir-accueil:hover{background-position:bottom left;}


/*************************************
                        RUBRIQUES
*************************************/

.retrospective-rubrique  {
	background-color : white;  
	background-image:url("./images/titre-retrospective_gauche.jpg"); 
	background-repeat: no-repeat ; 
	border:0; 
	float:left; 
	padding: 35px 25px 25px 25px; 
}
.retrospective-rubrique2  {
	background-color : white;  
	background-image:url("./images/titre-retrospective_droite.jpg"); 
	border-left: 1px solid gray; 
	background-repeat: no-repeat; 
	float:right; 
	padding:35px 0;
	width:320px;
}
.prog-a-venir-rubrique  {
	background-color : white;  
	background-image:url("./images/titre-a_venir.jpg"); 
	background-repeat: no-repeat ; 
	border:0; 
	float:left; 
	padding: 35px 25px 25px 25px;
}
.prog-a-venir-rubrique img .total {width: 100%;}
.prog-a-venir-rubrique2  {
	background-color : white; 
	background-image:url("./images/titre-a_venir_droite.jpg");
	border-left: 1px solid gray; 
	background-repeat: no-repeat; 
	float:right; 
	padding:35px 0;
	width:320px;
}
.prog-a-venir-rubrique3  {
	background-color : white;  
	background-image:url("./images/titre-a_venir_droite.jpg"); 
	border-left: 1px solid gray; 
	background-repeat: no-repeat; 
	float:right; 
	padding:35px 0;
	width:320px;
}
.contact-rubrique {
	background-color : white; 
	background-image:url("./images/titre-contact_gauche.jpg"); 
	background-repeat: no-repeat ; 
	border:0; 
	float:left; 
	padding: 35px 25px 25px 25px;
}
.presentation-rubrique {
	background-color : white;
	background-image:url("./images/titre-presentation_gauche.jpg");
	background-repeat: no-repeat; 
	border:0; 
	float:left; 
	padding: 35px 25px 25px 25px;
}
.saisonrusseR-rubrique {
	background-color : white; 
	background-image:url("./images/titre-saison_russe_rouge.jpg");
	background-repeat: no-repeat;
	border:0; 
	float:left; 
	padding: 35px 25px 25px 25px;
}
.tsigankaR-rubrique {
	background-color : white; 
	background-image:url("./images/titre-tsiganka_rouge.jpg"); 
	background-repeat: no-repeat; 
	border:0; 
	float:left; 
	padding: 35px 25px 25px 25px;
}
.rub{
	width:auto;
	height:auto; 
	clear:both; 
	padding:15px 20px 3px 20px; 
	clear:both;
}
.rubSommaire{
	width:auto; 
	height:430px; 
	clear:both; 
	padding:15px 20px 3px 20px;
	clear:both; 
}
.rubSommaire h3 {
	height:3em;
	vertical-align:middle;
}
.rubSommaire h5{
	text-align:center;
	font-size:1.2em;
	color:#ca7444;
	margin-top:0;
	margin-bottom:20px;
	height:2em;
}


/*************************************
                       ARTICLES
*************************************/

.article  {
	background-color : white;  
	background-image:url("./images/onglet-article.jpg"); 
	background-repeat: no-repeat; 
	border:0; 
	float:left; 
	padding: 35px 25px 25px 25px;
}

.dansLaMemeRubrique  {
	background-color : white;  
	background-image:url("./images/titre-long_meme-rubrique.jpg"); 
	background-repeat: no-repeat ; 
	border:0;
	border-left: 1px solid gray;
	float:right; 
	padding:35px 0; 
	width:320px;
}

/* Style pour la DatchaTV */
#datchaTV-rubrique {
	background-image:url("./images/titre-datcha-tv_gauche.jpg"); 
	background-repeat: no-repeat; 
	padding: 50px;
}
/* Style pour le flux you tube */
#rss{
	padding-top:40px 200px 0 100px;
}

/* Stylepour l'article contact */
#contact {
	background-image:url("./images/titre-contacts.jpg");
	background-repeat: no-repeat; 
	padding-left: 50px; 
	padding-right: 50px;
}

/* Style pour la Revue de Presse*/
#revuedepresse{
	background-image:url("./images/titre-revue-de-presse_gauche.jpg");
	background-repeat: no-repeat; 
	padding-left: 50px; 
	padding-top:20px;
	padding-right:30px;
}
/*Revue de Presse*/
#flashcontent{
	min-height:900px;
	width:793px;
}



/* Liseret séprant les articles */
.liseret{
	width:100%;
	float:left;
	padding-top:15px;
	text-align:center;
}


/*************************************
                     LIVRE D'OR
*************************************/


#bloc-livre-dor {
	background-image:url("./images/onglet-livre-dor.jpg");  
	background-repeat: no-repeat ; 
	padding-left:40px;
	padding-right:20px;
	padding-top:15px;
}

#bloc-livre-dor  .intro {
	text-align:center; 
	padding-right:40%;
}

#commentaire {
	width:650px; 
	height:auto; 
	margin:20px auto; 
	padding-top:0px;
}

#before {
	background-image:url("./images/bulle_01.jpg"); 
	background-repeat: no-repeat; 
	width:600px; 
	height:25px; 
	margin:0; 
	padding:0;
}
#after {
	background-image:url("./images/bulle_03.jpg"); 
	background-repeat: no-repeat; 
	width:600px; 
	height:36px; 
	padding:0; 
	margin:0;
}

#comm  {
	margin:0; 
	padding:0;
}
#comm p {
	width:520px; 
	height:auto; 
	background-image:url("./images/bulle_02.jpg"); 
	background-repeat: repeat-y; 
	color:white; 
	margin:0; 
	padding:0 2em; 
	font-family:"Bell MT",arial,serif; 
	font-size:1.6em;
}


p.legende {
	font-style:italic; 
	font-size:1em; 
	margin-left:50px; 
	margin-top:0;
}

.post {padding:40px;}


/*************************************
               LOGOS DES ARTICLES
*************************************/


.logoSommaire {
	background-image:url("./images/pasdimage.jpg");
	background-repeat: no-repeat;
	background-position: center center;
	text-align:center;
	margin:auto; 
	padding:auto; 
	height:150px;
	line-height:150px;
	width:200px;
	margin-bottom:10px;
}
.logo {
	height:200px;
	width:200px;
	line-height:200px;
	float:left;
	background-image:url("./images/pasdimage.jpg"); 
	background-repeat: no-repeat; 
	background-position: center center;
	text-align:center;
	margin:auto; 
	margin-right:15px; 
	padding:auto;
	/padding-top:74px; /* hack IE */
}
.logo img, .logoSommaire img {vertical-align:middle;}

#block_sommaire_ie
{
   width:100;
   background-color:white;
   float:left;
   padding:35px 25px 25px;
 }