 @charset "utf-8";
/*CSS file for timeline
	Copyright Gilles Bonnet GBsystem le 1/11/2013 
	www.gbsystem.fr  gbonnet78fr@gmail.com
	
	This file is part of frise_chronologique.

    frise_chronologique is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    frise_chronologique is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with frise_chronologique.  If not, see <http://www.gnu.org/licenses/>.
	
	fiche.css V3.0 : 12/12/2015	
	last modified : Dec 12th, 2015
*/

/* Catégories de fiches
.PR { }  /* fiche Histoire de Port Royal Des Champs
.GEN{ } /* fiche Histoire de France
.ART{ } /* fiche histoire de l'art
.REL{ } /* fiche histoire religieuse
.SCI{ } /* fiche histoire des sciences
.EXP{ } /* fiche exposition 
*/

/* Lay out de fiches
 DYN9 	= dynamic width 90% of the screen
 DYN6   = dynamic width 60% of the screen
 A4H	= static width 900px
 A4V	= static width 600px
*/

/* 
*
*-I- GENERAL STYLES 
*
*/

body {
    font-family: tahoma;
    font-size: 12px;
    width: 100%;
    margin: 0;
    padding: 0;	
}
a { 
	color: #fa7d46;
	text-decoration: underline; 
}
a:hover,a.selected {
	color: #F5500A;
}
h1 {
	font-size: 150%;
	font-weight:bold;
	margin-top:0.8em;
}
h2 {
	font-size: 130%;
	margin-top:0.6em;
}
h3{
	font-size: 110%;
	font-style: italic;
	margin-top:0.6em;
}
h4{
}
h5{
	font-style: italic;
}
hr{
}
ul li{
	margin-left:15px;
}
ol li{
	margin-left:15px;
}
p{
	margin-top:0.6em;
	}
figure {
	margin: 0;
	display: block;
}
.sources {		/* pour les sources */
	font-size: small;
}
/* classes additionnelles */
.centrer {
    text-align:center;
 }
.div_centre { /*centrer un div */
	width : 50%;
	margin : auto; 
}
.imagedroite { /* image à droite */
   float:right;
   margin :5px;
   clear : right;
}
 .imagegauche {
   float:left;
   margin :5px;
   clear : right;
}
/*images avec cadre et légende */
div.tright {
    border-width: 0.5em 0 0.8em 1.4em;
    clear: right;
    float: right;
}
div.tleft {
    border-width: 0.5em 1.4em 0.8em 0;
    clear: left;
    float: left;
    margin-right: 0.5em;
}
div.tcenter{
	width : 50%;
	margin : auto; 
}
div.thumbinner {
    background-color: #F9F9F9;
    border: 1px solid #CCCCCC;
    font-size: 94%;
    overflow: hidden;
    padding: 3px !important;
    text-align: center;
}
.thumbimage {
    border: 1px solid #CCCCCC;
	width: 100%;
	height: auto;
}
.thumbcaption {
    border: medium none;
    font-size: 94%;
    line-height: 1.4em;
    padding: 3px !important;
    text-align: center;
}

/* le bouton en savoir plus / lire la suite */
.liresuite{
	padding:5px 10px 5px 10px;	
	border-radius: 10px ;
	float: right;
	margin-bottom: 15px;	
	text-align : right;
}
.liresuite a{
	text-decoration: none; 
}


/* 
*
*-II- DEDICATED TO FICHES LAY OUT AND CLASSES
*
*/
/* responsive or fixed width */
.DYN9 {
}
.DYN6{
}
.A4V{
   width:600px;
 } 
.A4H{
   width:900px;
    }

/* box sizing : avoir des width qui incluent margin et padding */	
*, *:after, *:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}	

/*************LAYOUT ****************************/
.DYN9 .classic_photo{ 				/* Fiche Classique illustré  et Classique enrichi*/
	width:100%;
	min-height: 510px;
	overflow:hidden;
	background-position:.5% 0,			/* titre bandeau*/
						top left,		/*fond bandeau */ 
						32% 50px,		/*verticale centre UNUSED*/
						bottom right,	/*logo bas droite*/
						86% 5px,		/*verticale droite*/
						top right;		/*dégradé droit*/
	background-repeat:  no-repeat,
						repeat-y, 
						no-repeat,
						no-repeat, 
						no-repeat,
						no-repeat;
	background-size:	3% auto,	
						4% 100%,
						0px 0px,
						14% auto,
						9px 100%,
						14% 100%;	
}
.DYN6 .classic_photo{ 
	width:100%;
	min-height: 510px;
	overflow:hidden;
	background-position:.5% 0,			/* titre bandeau*/
						top left,		/*fond bandeau */ 
						32% 50px,		/*verticale centre UNUSED*/
						bottom right,	/*logo bas droite*/
						80% 5px,		/*verticale droite*/
						top right;		/*dégradé droit*/
	background-repeat:  no-repeat,
						repeat-y, 
						no-repeat,
						no-repeat, 
						no-repeat,
						no-repeat;
	background-size:	5% auto,	
						6% 100%,
						0px 0px,
						20% auto,
						9px 100%,
						20% 100%;	
}
.DYN9 .classic_3col{ 			/* fiche classique 3 colonnes complet */
	width:100%;
	min-height: 510px;
	overflow:hidden;
	background-position:.5% 0,			/* titre bandeau*/
						top left,		/*fond bandeau */ 
						32% 50px,		/*verticale centre*/
						bottom right,	/*logo bas droite*/
						86% 5px,		/*verticale droite*/
						top right;		/*dégradé droit*/
	background-repeat:  no-repeat,
						repeat-y, 
						no-repeat,
						no-repeat, 
						no-repeat,
						no-repeat;
	background-size:	3% auto,	
						4% 100%,
						4px 90%,
						14% auto,
						9px 100%,
						14% 100%;	
}
.DYN6 .classic_3col{ 
	width:100%;
	min-height: 510px;
	overflow:hidden;
	background-position:.5% 0,			/* titre bandeau*/
						top left,		/*fond bandeau */ 
						24% 50px,		/*verticale centre*/
						bottom right,	/*logo bas droite*/
						80% 5px,		/*verticale droite*/
						top right;		/*dégradé droit*/
	background-repeat:  no-repeat,
						repeat-y, 
						no-repeat,
						no-repeat , 
						no-repeat,
						no-repeat;
	background-size:	5% auto,	
						6% 100%,
						4px 90%,
						20% auto,
						9px 100%,
						20% 100%;	
}
.classic_3col_L{			/* fiche classique 3 colonnes complet, ressources Large  : n'existe qu'en 90%*/
	width:100%;
	min-height: 510px;
	overflow:hidden;
	background-position:.5% 0,			/* titre bandeau*/
						top left,		/*fond bandeau */ 
						50% 50px,		/*verticale centre*/
						bottom right,	/*logo bas droite*/
						86% 5px,		/*verticale droite*/
						top right;		/*dégradé droit*/
	background-repeat:  no-repeat,
						repeat-y, 
						no-repeat,
						no-repeat, 
						no-repeat,
						no-repeat;
	background-size:	3% auto,	
						4% 100%,
						4px 90%,
						14% auto,
						9px 100%,
						14% 100%;	
}


.DYN9 .classic_text{ 				/* Fiche classique texte long */
	width:100%;
	min-height: 510px;
	overflow:hidden;
	background-position:.5% 0,			/* titre bandeau*/
						top left,		/*fond bandeau */ 
						45% 50px,		/*verticale centre*/
						bottom right,	/*logo bas droite*/
						86% 5px,			/*verticale droite*/
						top right;		/*dégradé droit*/
	background-repeat:  no-repeat,
						repeat-y, 
						no-repeat,
						no-repeat , 
						no-repeat,
						no-repeat;
	background-size:	3% auto,	
						4% 100%,
						4px 90%,
						14% auto,
						9px 100%,
						14% 100%;	
}

.DYN6 .classic_text{ 
	width:100%;
	min-height: 510px;
	overflow:hidden;
	background-position:.5% 0,			/* titre bandeau*/
						top left,		/*fond bandeau */ 
						43% 50px,		/*verticale centre*/
						bottom right,	/*logo bas droite*/
						79% 5px,			/*verticale droite*/
						top right;		/*dégradé droit*/
	background-repeat:  no-repeat,
						repeat-y, 
						no-repeat,
						no-repeat , 
						no-repeat,
						no-repeat;
	background-size:	5% auto,	
						6% 100%,
						4px 90%,
						14% auto,
						9px 100%,
						21% 100%;	
}

.DYN9 .classic_2col{				 /* Fiche classique 2 colonnes */
	width:100%;
	min-height: 510px;
	overflow:hidden;
	background-position:.5% 0,			/* titre bandeau*/
						top left,		/*fond bandeau */ 
						50% 30px,		/*verticale centre*/
						bottom right,	/*logo bas droite*/
						86% 5px,		/*verticale droite*/
						bottom right;	/*dégradé droit*/
	background-repeat:  no-repeat,
						repeat-y, 
						no-repeat,
						no-repeat , 
						no-repeat,
						no-repeat;
	background-size:	3% auto,	
						4% 100%,
						4px 90%,
						0 0,
						0 0,
						0 0;	
}
.DYN6 .classic_2col{ 
	width:100%;
	min-height: 510px;
	overflow:hidden;
	background-position:.5% 0,			/* titre bandeau*/
						top left,		/*fond bandeau */ 
						50% 30px,		/*verticale centre*/
						bottom right,	/*logo bas droite*/
						86% 5px,		/*verticale droite*/
						bottom right;	/*dégradé droit*/
	background-repeat:  no-repeat,
						repeat-y, 
						no-repeat,
						no-repeat , 
						no-repeat,s
						0 0,s
						0 0,
						0 0;
}


.DYN6 .classic_noress{ 
	width:100%;
	min-height: 510px;
	overflow:hidden;
	background-position:.5% 0,			/* titre bandeau*/
						top left,	/*fond bandeau */ 
						76% 15px,	/*verticale centre*/
						bottom right,	/*logo bas droite*/
						86% 5px,	/*verticale droite*/
						bottom right;	/*dégradé droit*/
	background-repeat:  no-repeat,
						repeat-y, 
						no-repeat,
						no-repeat , 
						no-repeat,
						no-repeat;
	background-size:	5% auto,	
						6% 100%,
						9px 100%,
						24% auto,
						0 0,
						24% auto;	
}

.DYN9 .classic_noress{ 	
	width:100%;
	min-height: 510px;
	overflow:hidden;
	background-position:.5% 0,				/* titre bandeau*/
						top left,	/*fond bandeau */ 
						76% 15px,	/*verticale centre*/
						bottom right,	/*logo bas droite*/
						86% 5px,	/*verticale droite*/
						bottom right;	/*dégradé droit*/
	background-repeat:  no-repeat,
						repeat-y, 
						no-repeat,
						no-repeat , 
						no-repeat,
						no-repeat;
	background-size:	3% auto,	
						4% 100%,
						9px 100%,
						24% auto,
						0 0,
						24% auto;	
}


/* ** les 5 types de colonne ** */
.fbandeau, .fcolsuite, .fliens, .fress, .fcoltexte{
	position: relative;
	float: left;
	min-height: 510px;
}
/*  Largeur des colonnes */ 
.DYN9 .fbandeau{width:4%;}					/*colonne bandeau */
.DYN6 .fbandeau{width:6%;}

.DYN9  .classic_3col .fress{width:28%;}		/* colonne ressources */		
.DYN6  .classic_3col .fress{width:18%;}
.classic_3col_L .fress        {width:46%;}
.DYN9  .classic_2col .fress {width:46%;}	 
.DYN6  .classic_2col .fress {width:44%;}

.DYN9 .classic_3col .fcoltexte{width:54%;}	/* colonne texte*/		
.DYN6 .classic_3col .fcoltexte{width:56%;}
.classic_3col_L .fcoltexte    {width:36%;}
.DYN9 .classic_2col .fcoltexte{width:50%;}
.DYN6 .classic_2col .fcoltexte{width:50%;}
.DYN9 .classic_text .fcoltexte{width:41%;} 
.DYN6 .classic_text .fcoltexte{width:37%;}
.DYN9 .classic_photo .fcoltexte{width:41%;}	
.DYN6 .classic_photo .fcoltexte{width:37%;}	

.DYN6 .classic_noress .fcoltexte{width:70%;}
.DYN9 .classic_noress .fcoltexte{width:72%;}


.DYN9 .classic_text .fcolsuite{width:41%;}	/* colonne texte suite */
.DYN6 .classic_text .fcolsuite{width:36%;}
.DYN9 .classic_photo .fcolsuite{width:41%;}
.DYN6 .classic_photo .fcolsuite{width:37%;}


.DYN9 .fliens{width:14%;}			/* colonne évènements liés (10% pour print !!) */
.DYN6 .fliens{width:20%;}


/* colonne texte suite */
.fcolsuite{
padding:10px;
}
.fcolsuite h1{
	font-size: 130%;
    height: 30px;
    margin: 10px 0 0 0;
    padding: 0 5px 5px 0;
	text-align: center;
	background-position : 10px bottom;
	background-size : 90% 3px;
	background-repeat : no-repeat;	
}

/*colonne ressources*/
.fress{
	padding : 0 10px 0 10px;
}
.fress h1{		/* titre de la colonne ressource */
	font-size: 130%;
	font-weight: normal;
    height: 30px;
	margin: 10px -10px 30px -10px;
	padding-left : 1em;
 /*   margin: 10px 0 0 15px;
    padding: 0 5px 5px 15px; */
	background-position : 10px bottom;
	background-size : 90% 3px;
	background-repeat : no-repeat;	
}
.fress h2{ 		/*titre de chaque rubrique ressource */
	clear : both;
	margin-top:10px;
	padding-right:5px;
	font-size: 130%;
	font-weight: bold
}

/* colonne évènements liés */
.fliens{
	padding : 0 10px 0 10px;
}
.fliens h1{		/* titre de la colonne liens  */
	font-size: 130%;
	font-weight: normal;
    	height: 30px;
	margin: 10px -10px 30px -10px;
	text-align: center;
	background-position : left bottom;
	background-repeat : repeat-x;	
}

.fliens a{
	text-decoration:none;
}

/* Les titres et dates de la fiche */
#ftoptitre{	/* div englobant titre et date fiches classique */
	background-position : bottom;
	background-size : 90% 3px;
	background-repeat : no-repeat;	
	height: 40px;
	padding : 5px;
}
#fbarretitre{ /* div englobant titre et date fiches illustrées */
	overflow:hidden;
	padding:8px;
}
#ftitre{
	position: relative;
	float : left;
	text-align: center;
	font-weight:bold;
}
#fbarretitre #ftitre{
	padding-left: 5px;
	font-size: 150%;
}
#ftoptitre #ftitre{
	margin-top:5px;
	padding-left :15px;
	font-size: 170%;
}

#fdate{
	position: relative;
	float: right;
}
#fbarretitre #fdate{
	padding-right:5px;
	margin-top: 4px;
	font-size: 100%;
}
#ftoptitre #fdate{
	margin-top:10px;
	padding-right:15px;
	font-size: 130%;
	font-weight: bold;
}

/* photo de la fiche illustrée */
#coin_pic{
	position : relative;
	margin:0; 
	padding:0;
}
/* Le coin haut gauche de la photo */
#coinh{
	position: absolute;
	top:0px;
	left:0px;
	margin:0;
	padding:0;
	height:100%;
	width:100%;
}
/* Le coin bas droit de la photo */
#coinb{
	position: absolute;
	top:-3px;
	left:0px;
	margin:0;
	padding:0;
	height:100%;
	width:100%;
}
/* responsive image */
.coinimage {
	width: 100%;
	height: auto;
}
/*
#coin_pic img {
	max-width: 100%; 
	height: auto;
}
@media screen {
	#coin_pic img {
		width: auto;
	}
}

/* le titre de la photo */
#titrephoto{
	position: absolute;
	bottom:20px;
	right:40px;
	margin:0;
	padding:5px 10px 5px 10px;	
	border-radius: 10px ;
}

/* colonne texte */
.fcoltexte{
}

.fombre{
	min-height: 15px;
	background-position :top;
	background-repeat: no-repeat;
	background-size: 90% 15px;
}
.fintro p{
	font-size: 100%;
}
.document {		/*documents Philippe*/
 	font-size: 130%;
 	font-family: verdana,geneva;
 	line-height:120%;
}

.ftexte1{ /* padding colonne texte après titre */
	padding : 5px 25px 15px 15px;
}

.ftexte2{ /* padding colonne texte modèle illustré */
	padding:10px; 
}

/* ligne du bas */
#fbottom{
	clear:both;
	margin:0px;
	padding:0px;
	font-size:80%;
    background-color: #FFFFFF;
	height:25px;
}
#numero{
	float: left;
	width: 10%;
	text-align:left;
}
#version{
	float: left;
	width:10%;
	text-align:left;
}
#date_fiche{
	float: left;
	width:10%;
	text-align:left;
}
#keywords{
	float: left;
	width:45%;
	text-align:left;
}
#wordnumber{
	float: right;
	padding-right:15px;
	width:20%;
	text-align:right;
}
/* ************************** END  layout ******************** */



/***************** COLORS *********************************/

/* style colors*/
.PR h1, .PR h2, .PR h3, .PR h4, .PR h5,
.PR a , .PR a:hover, .PR hr, .PR #ftoptitre, .PR .fintro{
	color : #50667f;
}
.ART h1, .ART h2, .ART h3, .ART h4, .ART h5,
.ART a , .ART a:hover, .ART hr, .ART #ftoptitre, .ART .fintro{
	color : #137503;
}
.GEN h1, .GEN h2, .GEN h3, .GEN h4, .GEN h5,
.GEN a , .GEN a:hover, .GEN hr, .GEN #ftoptitre, .GEN .fintro{
	color : #f5411d;
}
.REL h1, .REL h2, .REL h3, .REL h4, .REL h5,
.REL a , .REL a:hover, .REL hr, .REL #ftoptitre, .REL .fintro{
	color : #780b88;
}
.SCI h1, .SCI h2, .SCI h3, .SCI h4, .SCI h5,
.SCI a , .SCI a:hover, .SCI hr, .SCI #ftoptitre, .SCI .fintro{
	color : #796407;
}
.EXP h1, .EXP h2, .EXP h3, .EXP h4, .EXP h5,
.EXP a , .EXP a:hover, .EXP hr, .EXP #ftoptitre, .EXP .fintro{
	color : #04ac83;
}

/** couleurs titres clairs **/
.PR .fress h1,  .PR .fliens   h1 { color : #8c8cb9;}
.ART .fress h1, .ART .fliens h1 { color : #8cb997;}
.GEN .fress h1, .GEN .fliens h1 { color : #f6775d;}
.REL .fress h1, .REL .fliens h1 { color : #b98cb2;}
.SCI .fress h1, .SCI .fliens h1 { color : #b9b08c;}
.EXP .fress h1, .EXP .fliens h1 { color : #84dcc6;}

/****** container ********/
.PR .container{      /* le fond de la fiche */
	background-image:
			url('../graphics/fiche/fiche_pr.png'),		/* titre bandeau */
/*			url('../graphics/fiche/fondfichepr.png'),	*/
			linear-gradient(to right, #b4bfca, #50667f),	/* le fond gauche */
			url('../graphics/fiche/vert_bar1_pr.png'),	/* verticale centre*/
			url('../graphics/fiche/logoPR.png'),		/* logo bas droite*/				
			url('../graphics/fiche/vert_bar2_pr.png'), 	/* verticale droite*/
			linear-gradient(#ffffff, #afb9c5);  		/* gradient vertical droite */
}				

.ART .container {      /* le fond de la fiche */
	background-image:
			url('../graphics/fiche/fiche_art.png'),		/* titre bandeau */
/*			url('../graphics/fiche/fondficheart.png'),	*/
			linear-gradient(to right, #56c34a, #137503),	/* le fond gauche */
			url('../graphics/fiche/vert_bar1_art.png'),	/* verticale centre*/
			url('../graphics/fiche/logoPR.png'),		/* logo bas droite*/				
			url('../graphics/fiche/vert_bar2_art.png'), 	/* verticale droite*/
			linear-gradient(#ffffff, #b2c5af);  		/* gradient vertical droite */
}				

.GEN .container {      /* le fond de la fiche */
	background-image:
			url('../graphics/fiche/fiche_gen.png'),		/* titre bandeau */
/*			url('../graphics/fiche/fondfichegen.png'),	*/
			linear-gradient(to right, #f7a190, #f5411d),	/* le fond gauche */
			url('../graphics/fiche/vert_bar1_gen.png'),	/* verticale centre*/
			url('../graphics/fiche/logoPR.png'),		/* logo bas droite*/				
			url('../graphics/fiche/vert_bar2_gen.png'), 	/* verticale droite*/
			linear-gradient(#ffffff, #fddbd4);  		/* gradient vertical droite */
}				

.REL .container {      /* le fond de la fiche */
	background-image:
			url('../graphics/fiche/fiche_rel.png'),		/* titre bandeau */
/*			url('../graphics/fiche/fondficherel.png'),	*/
			linear-gradient(to right, #c36fd0, #780b88),	/* le fond gauche */
			url('../graphics/fiche/vert_bar1_rel.png'),	/* verticale centre*/
			url('../graphics/fiche/logoPR.png'),		/* logo bas droite*/				
			url('../graphics/fiche/vert_bar2_rel.png'), 	/* verticale droite*/
			linear-gradient(#ffffff, #c4afe5);  		/* gradient vertical droite */
}				

.SCI .container {      /* le fond de la fiche */
	background-image:
			url('../graphics/fiche/fiche_sci.png'),		/* titre bandeau */
/*			url('../graphics/fiche/fondfichesci.png'),	*/
			linear-gradient(to right, #fae687, #796407),	/* le fond gauche */
			url('../graphics/fiche/vert_bar1_sci.png'),	/* verticale centre*/
			url('../graphics/fiche/logoPR.png'),		/* logo bas droite*/				
			url('../graphics/fiche/vert_bar2_sci.png'), 	/* verticale droite*/
			linear-gradient(#ffffff, #ddd4ae);  		/* gradient vertical droite */
}

.EXP .container {      /* le fond de la fiche */
	background-image:
			url('../graphics/fiche/fiche_exp.png'),		/* titre bandeau */
/*			url('../graphics/fiche/fondficheexp.png'),	*/
			linear-gradient(to right, #bbf5e7, #04ac83),	/* le fond gauche */
			url('../graphics/fiche/vert_bar1_exp.png'),	/* verticale centre*/
			url('../graphics/fiche/logoPR.png'),		/* logo bas droite*/				
			url('../graphics/fiche/vert_bar2_exp.png'), 	/* verticale droite*/
			linear-gradient(#ffffff, #cee6e1);  		/* gradient vertical droite */
}				

/* barre horizontale au dessus du titre de ressource de liens et de suite */
.PR #ftoptitre , .PR .fcolsuite h1, .PR .fress h1, .PR .fliens h1  {
	background-image: url('../graphics/fiche/hor_bar1_pr.png');
}
.ART #ftoptitre, .ART .fcolsuite h1, .ART .fress h1, .ART .fliens h1  {
	background-image: url('../graphics/fiche/hor_bar1_art.png');
}
.GEN #ftoptitre, .GEN .fcolsuite h1, .GEN .fress h1, .GEN .fliens h1 {
	background-image: url('../graphics/fiche/hor_bar1_gen.png');
}
.REL #ftoptitre, .REL .fcolsuite h1, .REL .fress h1, .REL .fliens h1   {
	background-image: url('../graphics/fiche/hor_bar1_rel.png');
}
.SCI #ftoptitre, .SCI .fcolsuite h1, .SCI .fress h1, .SCI .fliens h1   {
	background-image: url('../graphics/fiche/hor_bar1_sci.png');
}
.EXP #ftoptitre, .EXP .fcolsuite h1, .EXP .fress h1, .EXP .fliens h1   {
	background-image: url('../graphics/fiche/hor_bar1_exp.png');
}

/* dégradé sous la barre du titre */
.PR .fombre{  background-image: url('../graphics/fiche/hor_bar3_pr.png');}
.ART .fombre{ background-image: url('../graphics/fiche/hor_bar3_art.png');}
.GEN .fombre{ background-image: url('../graphics/fiche/hor_bar3_gen.png');}
.REL .fombre{ background-image: url('../graphics/fiche/hor_bar3_rel.png');}
.SCI .fombre{ background-image: url('../graphics/fiche/hor_bar3_sci.png');}
.EXP .fombre{ background-image: url('../graphics/fiche/hor_bar3_exp.png');}

/* trait bas */
.PR  #fbottom {	border-top : 1px solid #50667f;}
.ART #fbottom {	border-top : 1px solid #137503;}
.GEN #fbottom {	border-top : 1px solid #f5411d;}
.REL #fbottom {	border-top : 1px solid #780b88;}
.SCI #fbottom {	border-top : 1px solid #796407;}
.EXP #fbottom {	border-top : 1px solid #04ac83;}

/* coins photo */
.PR  #coinb {	background: url('../graphics/fiche/coinbpr.png')  no-repeat bottom right;}
.PR  #coinh {	background: url('../graphics/fiche/coinhpr.png')  no-repeat;}
.ART #coinb {	background: url('../graphics/fiche/coinbart.png') no-repeat bottom right;}
.ART #coinh {	background: url('../graphics/fiche/coinhart.png') no-repeat;}
.GEN #coinb {	background: url('../graphics/fiche/coinbgen.png') no-repeat bottom right;}
.GEN #coinh {	background: url('../graphics/fiche/coinhgen.png') no-repeat;}
.REL #coinb {	background: url('../graphics/fiche/coinbrel.png') no-repeat bottom right;}
.REL #coinh {	background: url('../graphics/fiche/coinhrel.png') no-repeat;}
.SCI #coinb {	background: url('../graphics/fiche/coinbsci.png') no-repeat bottom right;}
.SCI #coinh {	background: url('../graphics/fiche/coinhsci.png') no-repeat;}
.EXP #coinb {	background: url('../graphics/fiche/coinbexp.png') no-repeat bottom right;}
.EXP #coinh {	background: url('../graphics/fiche/coinhexp.png') no-repeat;}

/* clair sur foncé, titres illustré photos,lire la suite  */
.PR #fbarretitre, .PR #titrephoto, .PR .liresuite,.PR .liresuite a {
	background-color:#50667f;
	color: #b4bec9;
}
.ART #fbarretitre, .ART #titrephoto, .ART .liresuite,.ART .liresuite a {
	background-color:#137503;
	color: #b5c9b4;
}
.GEN #fbarretitre, .GEN #titrephoto, .GEN .liresuite,.GEN .liresuite a {
	background-color:#f5411d;
	color: #fccfc6;
}
.REL #fbarretitre, .REL #titrephoto, .REL .liresuite,.REL .liresuite a {
	background-color:#780b88;
	color: #c9b4c9;
}
.SCI #fbarretitre, .SCI #titrephoto, .SCI .liresuite,.SCI .liresuite a {
	background-color:#796407;
	color: #e8dfbd;
}
.EXP #fbarretitre, .EXP #titrephoto, .EXP .liresuite,.EXP .liresuite a {
	background-color:#04ac83;
	color: #bbf5e7;
}

/**** titre bandeau  ***/
.PR #titre_bandeau  { background: url('../graphics/fiche/fiche_pr.png')  top  no-repeat;}
.GEN #titre_bandeau { background: url('../graphics/fiche/fiche_gen.png') top  no-repeat;}
.ART #titre_bandeau { background: url('../graphics/fiche/fiche_art.png') top  no-repeat;}
.REL #titre_bandeau { background: url('../graphics/fiche/fiche_rel.png') top  no-repeat;}
.SCI #titre_bandeau { background: url('../graphics/fiche/fiche_sci.png') top  no-repeat;}
.EXP #titre_bandeau { background: url('../graphics/fiche/fiche_exp.png') top  no-repeat;}




/*********************A U D I O*******************************/

.audio_container {
    background: url("audio/bgr.png") no-repeat scroll 0 0 transparent;
    height: 120px; /*104px; */
    padding: 8px 7px 5px;
    position: relative;
    width: 120px; /*104px; */
}
.audio_container *:focus {
    border: medium none;
    outline: 0 none;
}
.cp-buffer-1, .cp-buffer-2, .cp-progress-1, .cp-progress-2 {
    border-radius: 52px 52px 52px 52px;
    clip: rect(0px, 52px, 104px, 0px);
    height: 104px;
    left: 0;
    position: absolute;
    top: 0;
    width: 104px;
}
.cp-buffer-1, .cp-buffer-2 {
    background: url("audio/buffer.png") no-repeat scroll 0 0 transparent;
}
.audio_container .cp-fallback {
    background: url("audio/progress_sprite.jpg") no-repeat scroll 0 104px transparent;
}
.cp-progress-1, .cp-progress-2 {
    background: url("audio/progress.png") no-repeat scroll 0 0 transparent;
}
.cp-buffer-holder, .cp-progress-holder, .cp-circle-control {
    height: 104px;
    position: absolute;
    width: 104px;
}
.cp-circle-control {
    cursor: pointer;
}
.cp-buffer-holder, .cp-progress-holder {
    clip: rect(0px, 104px, 104px, 52px);
    display: none;
}
.cp-buffer-holder.cp-gt50, .cp-progress-holder.cp-gt50, .cp-progress-1.cp-fallback {
    clip: rect(auto, auto, auto, auto);
}
.cp-controls {
    margin: 0;
    padding: 26px;
}
.cp-controls li {
    display: block;
    list-style-type: none;
    position: absolute;
	margin-left:2px;
}
.cp-controls li a {
    cursor: pointer;
    display: block;
    height: 50px;
    position: relative;
    text-indent: -9999px;
    width: 50px;
    z-index: 1;
}
.cp-controls .cp-play {
    background: url("audio/controls.png") no-repeat scroll 0 0 transparent;
}
.cp-controls .cp-play:hover  {
    background: url("audio/controls.png") no-repeat scroll -50px 0 transparent;
}
.cp-controls .cp-pause {
    background: url("audio/controls.png") no-repeat scroll 0 -50px transparent;
}
.cp-controls .cp-pause:hover {
    background: url("audio/controls.png") no-repeat scroll -50px -50px transparent;
}
.cp-jplayer {
    height: 0;
    width: 0;
}

/***********************V I D E O ************************************/

.player-container {
/*	width: 480px; /* Set width & margin to your needs */
	margin:auto;
}
.jp-jplayer{
	border: 1px solid #000000;
}
.jp-jplayer video {
	display: block !important;
}
.jp-jplayer img {
	-webkit-border-top-left-radius: 2px;
	-webkit-border-top-right-radius: 2px;
	-moz-border-radius-topleft: 2px;
	-moz-border-radius-topright: 2px;
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
}
.jp-interface {
	height: 40px;
	width: 100%;
	z-index: 100;
}

/***********************SLIDESHOW 1 ************************************/

ul.bjqs{
/*	position:relative; */
	list-style:none;
	padding:0;
	margin:0;
	overflow:hidden; 
	display:none;
}
li.bjqs-slide{
	position:absolute; 
	display:none;
	margin :0; /*gb */
}
ul.bjqs-controls{
	list-style:none;
	margin:0;
	padding:0;
	z-index:9999;
}
ul.bjqs-controls.v-centered li a{
	position:absolute;
}
ul.bjqs-controls.v-centered li.bjqs-next a{
right:0;
}
ul.bjqs-controls.v-centered li.bjqs-prev a{
left:0;
}
ol.bjqs-markers{
	list-style: none; 
	padding: 0; 
	margin: 0; 
	width:100%;
}
ol.bjqs-markers.h-centered{
	text-align: center;
}
ol.bjqs-markers li{
	display:inline;
}
ol.bjqs-markers li a{
	display:inline-block;
}
p.bjqs-caption{
	display:block;
	width:96%;
	margin:0;
	padding:2%;
	position:absolute;
	bottom:0;
}
li.bjqs-slide{
	border : 1px solid #cc0066;
}
p.bjqs-caption{
	color: #FFFFFF
}

/***********************SLIDESHOW 2 ************************************/

.ccloadwrap{
	border: 4px solid #FFFFFF;
    	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
	display:block; 
}
.ccloadwrap img {
	width:100%;
}
.cf:before,.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}
.cf:after {
    clear: both;
}
/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
/*
.cf {
    *zoom: 1;
}
*/
.info{
	text-indent:1em;
}
#option ul{
	list-style:square;
	line-height:2em;
}
#option b{
	color:#333;
	padding:0 5px;
	text-shadow:1px 1px 0 #fff;	
}
#option i{
	color:#F30;
	margin-left:5px;
}
/**********/

/* Elastislide Style */
.elastislide-list {
	list-style-type: none;
	display: none;
}
.no-js .elastislide-list {
	display: block;
}
.elastislide-carousel ul li {
	min-width: 20px; /* minimum width of the image (min width + border) */
	
}
.elastislide-wrapper {
	position: relative;
	/*background-color: #fff;*/
	margin: 0 auto;
	min-height: 40px;
	/*box-shadow: 1px 1px 3px rgba(0,0,0,0.2);*/
}
.elastislide-wrapper.elastislide-loading {
	background-image: url(./slideshow/loading.gif);
	background-repeat: no-repeat;
	background-position: center center;
}
.elastislide-horizontal {
	padding:4px 36px;
}
.elastislide-vertical {
	padding: 36px 4px;
}
.elastislide-carousel {
	overflow: hidden;
	position: relative;
}
.elastislide-carousel ul {
	position: relative;
	display: block;
	list-style-type: none;
	padding: 0;
	margin: 0;
	-webkit-backface-visibility: hidden;
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	-ms-transform: translateX(0px);
	-o-transform: translateX(0px);
	transform: translateX(0px);
}
.elastislide-horizontal ul {
	white-space: nowrap;
	font-size:0pt;
}
.elastislide-carousel ul li {
	margin: 0;
	-webkit-backface-visibility: hidden;	
}
.elastislide-horizontal ul li {
	height: 100%;
	display: inline-block;
	padding:3px;
}
.elastislide-vertical ul li {
	display: block;
}
.elastislide-carousel ul li a {
	display:block;
	outline:none;
	border:4px solid #fff;
	-webkit-transition:border-color .2s ease-in , background-color .2s ease-in;
	-moz-transition:border-color .2s ease-in , background-color .2s ease-in;
	-o-transition:border-color .2s ease-in , background-color .2s ease-in;
	-ms-transition:border-color .2s ease-in , background-color .2s ease-in;
	transition:border-color .2s ease-in , background-color .2s ease-in;
	box-shadow:0 1px 2px rgba(0, 0, 0, 0.15);
}
.elastislide-carousel ul li a img {
	display: block;
	max-width: 100%;
	/*border:4px solid #fff;*/
	border:none;	
}
.elastislide-carousel ul li a:hover {
	
}
.elastislide-carousel ul li.active a
{
	border:4px solid #f60;
}

/* Navigation Arrows */
.elastislide-horizontal nav span {
	position:absolute;
	background-image:url(./slideshow/nav-h1.gif);
	width:19px;
	height:33px;
	text-indent: -9000px;
	cursor:pointer;
	background-position: -8px center;
	background-repeat:no-repeat;	
}
.elastislide-horizontal nav span {
	top: 50%;
	left: 10px;
	margin-top: -16px;
}
.elastislide-horizontal nav span.elastislide-next {
	right: 10px;
	left: auto;
	background-position:-128px center;
}
.elastislide-horizontal nav span:hover {
	background-position:-48px center;
}
.elastislide-horizontal nav span.elastislide-next:hover {
	background-position:-88px center;
}
/****************/

.zm-viewer
{
	position:absolute;
	display:none;
	overflow:hidden;
	background:url(./slideshow/loading.gif)  no-repeat center center ;
	cursor:crosshair;
	z-index:9999;
}
.zm-handler
{
	position:absolute !important;
	display:none;
	overflow:hidden ;
	cursor:crosshair;
	border:none !important;
}
.zm-handlerarea
{
	background:url(./slideshow/lens.png);
	opacity:.9;
	position:relative;
}
.zm-description
{
	position:absolute;
	bottom:6px;
	left:6px;
	right:6px;
	background-color:#eee;
	background-color: rgba(255, 255, 255, 0.5);
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
    color: rgba(0,0,0,.6);
    font-size: 13px;
    text-align: center;
    text-shadow: 1px 1px 0 rgba(255,255,255,.3);
	padding:4px;
}
.followViewer,.standardViewer {
	border:2px solid #fefefe;
	border:4px solid rgba(255, 255, 255, .2);
	box-shadow: 0 0 3px rgba(0, 0, 0, .2);
}

/************************* end *****************************/
