@charset "utf-8";
/* ==============================================
   FEUILLE DE STYLES DES GABARITS HTML/CSS
   © Elephorm & Alsacreations.com
   Conditions d'utilisation:
   http://creativecommons.org/licenses/by/2.0/fr/
   ============================================== */


/* --- STYLES DE BASE POUR LE TEXTE ET LES PRINCIPAUX ÉLÉMENTS --- */

/* Page */
html {
	font-size: 100%; /* Voir -> Note 1 à la fin de la feuille de styles. */
}
body {
	margin: 0;
	padding: 10px 20px; /* Note -> 2 */
	font-family: Verdana, "Bitstream Vera Sans", "Lucida Grande", sans-serif; /* 3 */
	font-size: .8em; /* -> 4 */
	line-height: 1.25; /* -> 5 */
	/*color: black;
	background: red;*/
}

/* Titres */
h1, h2, h3, h4, h5, h6 {
	margin: 1em 0 .5em 0; /* -> 6 */
}
h1, h2 {
	font-family: Georgia, "Bitstream Vera Serif", Norasi, serif;
	font-weight: normal; /* -> 7 */
}
h1 {
	font-size: 3em; /* -> 8 */
	font-style: italic;
}
h2 {font-size: 1.8em;}
h3 {font-size: 1.2em;}
h4 {font-size: 1em;}

/* Listes */
ul, ol {
	margin: .75em 0 .75em 24px;
	padding: 0; /* -> 9 */
}
ul {
	list-style: square;
}
li {
	margin: 0;
	padding: 0;
}

/* Paragraphes */
p {
	margin: .75em 0;
}
li p, blockquote p {
	margin: .5em 0;
}

/* Citations */
blockquote, q {
	font-size: 1.1em;
	font-style: italic;
	font-family: Georgia, "Bitstream Vera Serif", Norasi, serif;
}
blockquote {
	margin: .75em 0 .75em 24px;
}
cite {
	font-style: italic;
}

/* Liens */
a {
	color: blue/*mediumblue*/;
	text-decoration: underline;
}
a:hover, a:focus {
	color: red/*crimson*/;
}
a img {
	border: none; /* -> 10 */
}

/* Divers éléments de type en-ligne */
em {
	font-style: italic;
}
strong {
	font-weight: bold;
	color: gray/*dimgray*/;
}


/* --- STYLES POUR CERTAINS CONTENUS DES GABARITS --- */

pre, code {
	font-size: 100%;
	font-family: "Bitstream Vera Mono", "Lucida Console", "Courier New", monospace;
}
pre {
	width: auto/*100%*/;
	overflow: auto;
	/*overflow-y: hidden;*/
	margin: .75em 0;
	padding: 12px;
	background: #eee;
	color: #555;
}
pre strong {
	font-weight: normal;
	color:#000001;
	background: transparent;
}
#copyright {
	margin: 20px 0 5px 0;
	text-align: right;
	font-size: .8em;
	color: #848F63;
	background: transparent;
}
#copyright a {
	color: #848F63;
	text-decoration: none;
	background: transparent;
}
#copyright a:hover, #copyright a:focus {
	text-decoration: underline;
}


/* --- NOTES ---

1.	Ce "font-size: 100%" est normalement inutile. On l'utilise uniquement
	pour éviter un bug de redimensionnement du texte dans Internet Explorer.

2.	Par défaut, les navigateurs ont un padding (ou, pour certains, un
	margin) de 6px pour l'élément BODY. C'est ce qui évite que le texte
	ne soit complètement collé aux bords de la zone de visualisation du
	navigateur lorsqu'on affiche une page «brute», sans mise en forme.
	Mais ce retrait de 6px est un peu faiblard: on le renforce donc.
	Notez bien que les feuilles de styles des gabarits pourront augmenter
	ce retrait, ou bien l'annuler.
	
3.	Voici quelques exemples de collections cohérentes de fontes (propriété
	CSS "font-family"):
	font-family: Arial, Helvetica, "Nimbus Sans L", sans-serif;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-family: Georgia, "Bitstream Vera Serif", Norasi, serif;
	font-family: "Times New Roman", Times, "Nimbus Roman No9 L", serif;
		
4.	Taille du texte de base de la page. Dépend de la taille du texte par
	défaut du navigateur (souvent 16px), et des réglages de l'utilisateur.
	À adapter en fonction de la fonte choisie, et du rendu souhaité.
	En général, on utilisera une valeur de base entre .65em et 1em
	(ou 65% et 100%).

5.	Hauteur de ligne. À adapter en fonction de la fonte choisie, et des
	besoins particuliers (lignes de texte longues ou courtes, titre ou
	corps de texte...).

6.	En général, les styles par défaut des navigateurs font que les marges
	en haut et en bas des titres sont équivalentes. Ici, en diminuant la
	marge du bas, on cherche à rapprocher le titre du contenu qu'il introduit.

7.	Les styles par défaut des navigateurs mettent les titres en gras.
	Si on souhaite passer à des caractères «normaux», on doit utiliser
	font-size: normal.

8.	Pour un élément en "font-size: 3em", la taille du texte sera le triple de
	la taille du texte de l'élément parent.
	À noter: on aurait pu écrire "font-size: 300%" pour le même résultat.

9.	Par défaut, les listes UL et OL ont un retrait à gauche qui peut être,
	suivant les navigateurs:
	- un padding-left de 40px;
	- ou bien un margin-left de 40px.
	On met tout le monde d'accord avec une marge à gauche de 24px, et pas
	de padding.

10.	Les navigateurs donnent souvent aux images placées dans des liens
	une bordure disgracieuse. On annule ce style souvent gênant en appliquant
	un "border: none" aux images qui se trouvent à l'intérieur d'un lien.

*/
/*@charset "utf-8";*/
/* ==============================================
   FEUILLE DE STYLES DES GABARITS HTML/CSS --- 09
   © Elephorm & Alsacreations.com
   Conditions d'utilisation:
   http://creativecommons.org/licenses/by/2.0/fr/
   ============================================== */


/* --- COULEURS --- */

/* Note: vous pouvez modifier simplement l'aspect de ce gabarit en modifiant
   uniquement les couleurs de fond (propriétés background) et les couleurs
   du texte (propriété color).
   Pour modifier la disposition des blocs, voir plus bas dans la feuille de
   styles la partie «positionnement». */

/* Général */

body {
	color: #F0E39E;
	background: #2C2F22;
}
a {
	color: #FF6533;
	background: transparent;
}
a:hover, a:focus {
	color: #FF4C00;
	background: transparent;
}
strong {
	color: #A1B55D;
	background: transparent;
}

/* Navigation */
#navigation {
	background: #181A12;
	color: #FF6533;
}
#navigation a {
	background: transparent;
	color: #FF6533;
	border:1px solid transparent;
}
#navigation a:hover, 
#navigation a:focus,
#navigation a.selected
{
	background: #000000;
	color: #FF6533;
}
#navigation a.selected
{
	border:1px solid #FF6533;
	border-radius:2px;
}
#navigation a:target {
	background: #2C2F22;
	color: #FF6533;
}


/* Contenu principal */
#principal {
	color: #181A12;
	background: #cbd888;
}
#principal a {
	color: #332510;
	background: transparent;
}
#principal a:hover, #principal a:focus {
	color: #6E5122;
	background: transparent;
}
#principal strong {
	color: #181A11;
	background: transparent;
}

/* Contenu secondaire */
#secondaire {
	color:inherit;
	background: #181A12;
}



/* --- POSITIONNEMENT --- */

/* Page */
body {
	padding: 20px 30px;
}

/* En-tête */
#entete {
	padding: 20px 0;
}
#entete h1 {
	margin: 0;
}
#entete h1 img {
	float: left;
	margin: 7px 20px 10px 0;
}
#entete .sous-titre {
	margin: 4px 0 15px 0;
}

/* Bloc central */
#centre {
	position: relative; /* Voir -> Note 1 */
	width: 100%;
}

/* Menu de navigation */
#navigation {
	position: absolute; /* -> 1 */
	top: 0;
	left: 0;
	width: 180px;
}
#navigation ul {
	margin: 0;
	padding: 20px 10px 20px 10px;
	list-style: none;
}
#navigation a {
	display: block;
	height: 1%;
	padding: 6px 10px 6px 10px;
	line-height: 1.5;
	font-size: .9em;
	text-decoration: none;
}

#navigation ul ul {
	display:none;
	padding:0 0 0 10px;
}
#navigation ul a:target + ul {
	display:block;
}

#navigation ul a[id]{
	/*padding:0;*/
}
#navigation ul a[id]::before{/*triangle*/
	content:"";
	display:inline-block;
	padding:0;
	margin:2px 5px -2px 2px;
	border:solid; 
	border-width:8px 0px 8px 16px ;
	border-top-color: transparent;
	border-right-color: transparent;
	border-bottom-color: transparent;
	border-left-color:#2C2F22;
	width:0px;
	bottom:0px;
}

#navigation ul a:target::before{/*triangle*/
	margin:2px 5px -2px 2px !important;
	border-width:16px 8px 0px 8px  !important;
	border-left-color: transparent !important;
	border-top-color: #000 !important;
}


#navigation ul a:target::before{/*triangle*/
	content:"";
	display:inline-block;
	padding:0px;
	margin:0px 5px 0px 2px;
	border:solid; 
	border-width:8px 0px 8px 20px ;
	border-top-color: transparent;
	border-right-color: transparent;
	border-bottom-color: transparent;
	border-left-color:#000;
	width:0px;
	bottom:0px;
}


/* Contenu principal */
#principal {
	margin-left: 200px; /* -> 2 */
	margin-right: 240px; /* -> 2 */
	padding: 10px 20px;
}
#principal > :first-child {
	margin-top: 10px;
}
#principal p, #principal li {
	line-height: 1.5;
}

/* Contenu secondaire */
#secondaire {
	position: absolute; /* -> 1 */
	top: 0;
	right: 0;
	width: 180px;
	padding: 12px 20px;
}

/* Pied de page */
#pied {
	margin: 0;
	padding: 15px 260px 10px 200px;
	font-size: .85em;
}
	
/* Mention de copyright */
#copyright {
	margin: 20px 0;
	font-size: .85em;
	text-align: center;
}


/* --- NOTES ---

1.	On utilise le positionnement relatif sur div#centre afin que ce bloc serve
	de référent à ses descendants positionnés en absolu.
	Dit plus clairement: deux des trois enfants de div#centre, à savoir
	div#navigation et div#secondaire, sont positionnés en absolu. Pour ces deux
	éléments, on a utilisé les propriétés CSS top, left et right qui permettent
	d'indiquer des coordonnées de positionnement. Ces coordonnées sont données
	par rapport à un cadre de référence. Quel est ce cadre de référence?
	- Par défaut, il s'agit de la zone de visualisation du navigateur (les
	bords de la «fenêtre», donc).
	- Ou bien il s'agira du plus proche élément positionné (en absolu, relatif
	ou fixe) parmi les ancêtres de l'élément positionné en absolu.
	Si cette explication n'est pas claire, supprimez ou commentez le
	"position: relative" de div#centre, et observez ce qui se passe. Puis
	rétablissez-le et ajoutez une bordure visible à div#centre (ex:
	"border: 2px solid red;"). Cela devrait être plus clair.

2.	Le bloc de contenu principal (div#principal) est le seul des trois enfants
	de div#centre qui n'est pas positionné en absolu. Ce n'est en effet pas
	nécessaire. Comme div#principal considère que div#navigation et
	div#secondaire, tous deux positionnés en absolu, ne sont «plus là», et ne
	se placera donc pas plus bas dans la page.
	Pour éviter que les colonns latérales ne recouvrent des parties du
	contenu, il nous suffit de donner des marges à gauche et à droite à
	div#principal.

*//*@charset "utf-8";*/
/* CSS Document */


.w3cbutton {
	display:inline-block;
	margin: 0px 4px 0px 0px;
	padding:0px;
	width: 80px;
	height:15px;
	text-decoration:none;
	background-position:top;
}
.XHTML, .XHTML:hover, .XHTML:focus {
	background-image:url(/Image/80x15/w3c_xhtml_1.1.png);
}
.CSS, .CSS:hover, .CSS:focus {
	background-image:url(/Image/80x15/w3c_css_3.png);
}
.WCAG, .WCAG:hover, .WCAG:focus {
	background-image:url(/Image/80x15/w3c_wcag_1.0.png);
}
.CC, .CC:hover, .CC:focus {
	background-image:url(/Image/80x15/cc2.png);
}
.Webmaster, .Webmaster:hover, .Webmaster:focus {
	background-image:url(/Image/webmaster.png);
	width: 190px;
}
.w3cbutton:hover, .w3cbutton:focus {
	background-position:bottom;
}

.none {
	display:none;
}

h1 {
	margin-top:10px;
}



	
.titreBarre {
	border:inset #808080/* groove #F0F0F0*/;
	border-width:1px;
	height:0px;
	width:100%;
	display:block;
	margin:20px 0px;
}
.titreBarre span {
	position:relative;
	top:-0.75em;
	margin-left:0.75em;
	padding:0px 2px;
	color:#000;
	background-color:#cbd888;
	font-size:1.5em;
}

#principal .text-center { 
	text-align:center;
}

#principal .text-center img {
	max-width:100%;

}

.cadreNews .paragraphe {
	max-width:100%;
}
.paragraphe {
	text-align: justify;
	text-indent: 40px;
	padding: 0px 5%;
	margin: .75em auto;
	max-width:600px;
}
.paragraphe::first-letter {
	font-size: 195%;
	font-style: italic;
    font-weight: bold;
}
q {
  quotes: "«\A0" "\A0»" "‘" "’" "“" "”";
}
.paragraphe + .paragraphe::first-letter {
	font-size: inherit;
	font-style: inherit;
    font-weight: inherit;
}
/*.paragraphe, .Fparagraphe {
	text-align: justify;
	text-indent: 40px;
	padding: 0px 5%;
}
.Fparagraphe:first-letter {
	font-size: 195%;
	font-style: italic;
    font-weight: bold;
}*/

.note {
	text-align:right;
	font-style:italic;
	font-variant:small-caps;
	color:#CBD888;
	background-color:#2C2F22;
}
.cache {
	background-color:inherit;
	color:#2c2f22;
	display:block;
	padding:5px;
	position:fixed;
	bottom:0px;
	right:0px;
	opacity:0;
}
/*.cache:hover, .cache:focus {
	background-color:inherit;
	color:#2c2f22;
	opacity:1;
}*/

.err {
	background-color:#db652c;
	color:#cbd888;
	padding:5px;
	margin-bottom:5px;
	display:block;

}


a.couv {
	text-decoration:none;
	height: 75px;
	display:block;
	float:left;
}
a.couv:first-child{
	height: 75px;
	border: none;
}
a.couv img + img {
	position: fixed;
	display:none;
	/*margin-top:40px;
	margin-left:-50px;*/
	right:30px;
	top:20px;
	width:220px;
	
	/*margin-top:-50px;
	margin-right:126px;*/
	z-index:9;
}
a.couv:hover img + img {
	display:inline;
}
.max a.couv:hover img + img {
	display:none;
}

fieldset legend {
	font-size:1.5em;
	font-weight:bold;
}

.left {
	float:left;
}
.right {
	float:right;
}
.clear {
	clear:both;
}

.left label{
	margin-top:1px;
	margin-right:5px;
	display:block;
	height:23px;
	padding:0;
}
label.error{
			background-color: #FF4C00;	
			display:inline;
			margin-left:10px;
			padding:2px;
			height:22px;
		}
input.error{
	background-color: #FF4C00;	
}
.left input{
	display:block;
}

.left input[type="text"],.left input[type="password"],.left input[type="file"],.left select{
	margin:1px 0px 0px 0px;
	/*height:16px;
	padding:2px;*/
	/*border:1px inset #F0F0F0;*/
}
.left input[type="checkbox"]{
	margin:0px 0px 2px 0px;
	height:22px;
	padding:0px;
}
.left select[multiple="multiple"]{
	margin-bottom:1px;
	/*color:red;
	background-color:blue;*/
	
	/*height:16px;
	padding:2px;*/
	/*border:1px inset #F0F0F0;*/
}
/*
.fleft label.recherche {
	margin-top:-3px;
}
.fleft  + .fleft label{
	margin-top:0px;
	display:inline;
}*/
.left br {
	margin-top:0px;

}



.box85, .box95 {
	height:97px;
	border:1px solid white;
	padding:5px;
	margin:5px;
	float:left;
}
.box95 {
	height:117px;
	border:1px solid white;
	padding:5px;
	margin:5px;
	float:left;
}

.text h2 {
	text-align:center;
}
.text-img {
	position:relative;
	border: none;
	
	margin: 20px 0px;
	margin-left:5%;
	padding: 0px;
	text-align:center;
}
.text-img img {
	/*border: 5px ridge #860000;*/
	max-width:100%;
}

#childHide div {
	display:none;	
}
#childHide div:target {
	display:block;	
}

.linkAdmin {
	text-decoration:none;
	
}
.cadreNews {
	border-top:2px solid white;
	border-right:2px solid white;
	padding: 0px 10px 10px 10px;
	border-radius:10px 20px 10px 10px;
	margin-bottom:20px;
	padding: 0;
}
.cadreNews h2
{
	margin-top: 10px;
}
.cadreNews.fullBorder,
.min  .cadreNews
{
	border-bottom:2px solid white;
}
.cadreNews .cadreNewsTumbnail
{
	float: left;
	margin-top:-2px;
	border-left:2px solid white;
	border-top:2px solid white;
	border-bottom:2px solid white;
	border-radius:10px 0 0 10px;
	padding: 10px 0 20px 10px;
}
.min  .cadreNews .cadreNewsTumbnail
{
	margin-bottom: -2px;
}
.fullBorder .cadreNewsTumbnail {
    margin-bottom: -2px;
}
.cadreNews .cadreNewsIntro
 {
	float: left;
	padding-left:20px;
	padding-bottom: 10px;
	width: calc(100% - 150px);
}
.cadreNews .comment {
	border:2px solid white;
	padding: 0px 20px 20px 20px;
	border-radius:10px;
	margin-top:20px;
}
.cadreNews img {
	max-width:100%;
}
.cadreNews .comment + .comment {
	
	margin-top:10px;
}

.cadreNewsBlock2 {
    margin-right: -2px;
}
.cadreNews .cadreNewsLeftResumee1
{
	float:left;
	border-top:2px solid white;
	border-right:2px solid white;
	height:20px;
	width:135px;
	margin-left:10px;
	margin-top:-2px;
	border-radius:0 10px 0 0;
}
.cadreNews .cadreNewsLeftResumee2
{
	float:right;
	margin-left: -2px;
	width: calc(100% - 145px);
}
.cadreNews .cadreNewsResumee
{
	border-right:2px solid white;
	border-bottom:2px solid white;
	border-left:2px solid white;
	border-radius:0 0 10px 10px;
	padding: 0 10px 10px 10px;
}

.cadreLivre {
	border:2px solid white;
	padding: 0px 10px 10px 10px;
	border-radius:0px 10px;
	margin:auto auto 20px auto;
	max-width:600px;
}
.cadreLivre img {
	max-width:100%;
}

.code {
	font-size: 100%;
	font-family: "Bitstream Vera Mono", "Lucida Console", "Courier New", monospace;
	
	width: auto/*100%*/;
	overflow: auto;
	/*overflow-y: hidden;*/
	margin: .75em 0;
	padding: 12px;
	background: #eee;
	color: #555;
}

#navigation > div {
	position: absolute;
}

#navigation > div a {
	display: inline;
	padding: 5px;
}


#navigation .lihr {
	margin:0;
	border:1px inset #FF6533;
	display:block;
}

#navigation  #recherche_rapide {
	background-color: #2c2f22;
	width: 100%;
	padding-bottom: 14px;
}
#navigation  #recherche_rapide  input{
	background-color: #cbd888;
	border: none;
	width: 100%;
}

#entete .sous-titre {
	font-size:1em;
}
.buttonEditeBook {
	float:left;
	border:solid #2C2F22;
	border-width:0px 2px 2px 0px;
	border-bottom-right-radius: 10px;
	margin-left:-20px;
	margin-top:-10px;
	padding:4px 8px 2px 8px;
	display:block;
}
.buttonEditeBook .rectangle {
	display:inline-block;
	border:1px solid black; 
	height:12px;
	width:12px;
}
.buttonEditeBook:hover {
	background-color:#2C2F22 !important;
	border-color:white;
}
.buttonEditeBook:hover > .rectangle {
	border:2px solid white; 
	height:10px;
	width:10px;
}

.buttonAjout {
	float:left;
	border:solid #2C2F22;
	border-width:0px 2px 2px 0px;
	border-bottom-right-radius: 10px;
	margin-left:-20px;
	margin-top:-10px;
	padding:4px 12px 2px 12px;
	display:block;
}
.buttonAjout .croix1 {
	display:inline-block;
	border:1px solid black; 
	height:12px;
}
.buttonAjout .croix2 {
	display:inline-block;
	border:1px solid black; 
	width:12px;
	position:absolute;
	margin-left:-6px;
	margin-top:-11px;
}
.buttonAjout:hover {
	background-color:#2C2F22 !important;
	border-color:white;
}
.buttonAjout:hover > .croix1, 
.buttonAjout:hover > .croix2 {
	border-color:white !important; 
}



#navigation a.buttonEditMenu {
	float:right;
	border:solid #FF6533;
	border-width:0px 0px 2px 2px;
	border-radius: 0 0 0 10px;
	/*margin-left:-10px;*/
	padding:2px 6px 2px 6px !important;
	display:block;
}

#navigation a.buttonEditMenu + br + ul {
	margin-top:-16px !important;
	/*background-color:red !important;*/
}
#navigation a.buttonEditMenu .rectangle {
	display:inline-block;
	border:1px solid #FF6533; 
	height:8px;
	width:8px;
}
#navigation a.buttonEditMenu:hover {
	border-color:white;
	background-color:#FF6533  !important;
}
#navigation a.buttonEditMenu:hover > .rectangle {
	border:2px solid white; 
	height:6px;
	width:6px;
}


.buttonEdite {
	float:left;
	border:solid white;
	border-width:0px 2px 2px 0px;
	border-radius: 10px 0 10px 0;
	margin-left:-10px;
	padding:4px 6px 2px 6px;
	display:block;
}
.buttonEdite .rectangle {
	display:inline-block;
	border:1px solid black; 
	height:12px;
	width:12px;
}
.buttonEdite:hover {
	background-color:#2C2F22 !important;
}
.buttonEdite:hover > .rectangle {
	border:2px solid white; 
	height:10px;
	width:10px;
}



.buttonSupprime {
	float:right;
	border:solid white;
	border-width:0px 0px 2px 2px;
	border-radius: 0 10px 0 10px;
	margin-right:-10px;
	padding:4px 6px 0px 4px;
	display:block;
}
.comment .buttonSupprime {
	margin-right:-20px;
}
.buttonSupprime .croix1 {
	display:inline-block;
	border:solid; 
	border-width:8px 0px 8px 8px ;
	border-color: transparent;
	border-left-color: black;
}
.buttonSupprime .croix2 {
	display:inline-block;
	border:solid; 
	border-width:7px 0px 7px 7px ;
	border-color: transparent;
	border-left-color: #CBD888;
	position:absolute;
	margin-top:1px;
	margin-left:-14px;
}
.buttonSupprime .croix3 {
	display:inline-block;
	border:solid; 
	border-width:8px 8px 8px 0px ;
	border-color: transparent;
	border-right-color: black;
	margin-left:-6px;
}
.buttonSupprime .croix4 {
	display:inline-block;
	border:solid; 
	border-width:7px 7px 7px 0px ;
	border-color: transparent;
	border-right-color: #CBD888;
	position:absolute;
	margin-top:-18px;
	margin-left:9px;
}

.buttonSupprime:hover {
	background-color:#2C2F22 !important;
}
.buttonSupprime:hover > .croix1 {
	border-left-color: white;
}
.buttonSupprime:hover > .croix2 {
	margin-left:-15px;
	border-left-color: #2C2F22;
}
.buttonSupprime:hover > .croix3 {
	border-right-color: white;
}
.buttonSupprime:hover > .croix4 {
	margin-left:10px;
	border-right-color: #2C2F22;
}

/*
#randomBook {
	float:right;
}
#randomBookCover {
	position:fixed;
	top:0;
	right:0;
	display:none;
	z-index:100;
}
#randomBook:hover > #randomBookCover {
	display:inline;	
}*/
/*
#randomBookImg { 
    transition: all 1s; 
}*/
	#sliderBook > a {
		float:right;
		margin-left:10px;
	}
	
	.bigCouv {
		position:fixed;
		top:0;
		right:0;
		display:none;
		z-index:100;
		max-width:100%;
		max-height:100%;
	}
	.cadreNews .bigCouv, .Auteurs .bigCouv {
		position:absolute;
		top:auto;
		right:auto;
	}
	.cadreNews .addLien img {
		float:left;
	}
	a:hover > .bigCouv {
		display:inline;	
	}
	
	.thumbCov {
		display: none;
		margin-left: 5px;
		position: absolute;
	}
	a:hover > .thumbCov {
		display:inline;	
	}
	#sliderBook > a:hover {
		float:right;
		margin-left: 0;
		margin-right: -10px;
		margin-top: -17px;
	}
	#sameCycle > a {
		height: 85px;
	}
	.smallCouv,
	#sliderBook > a:hover img ,
	#sameCycle > a:hover img {
		display:none;
		margin-top: -7px;
	}
	#sliderBook > a:hover img.smallCouv,
	#sameCycle > a:hover img.smallCouv {
		display:inline;
	}
	#sameCycle {
		min-height: 160px;
	}
	#sameCycle > a {
		margin-left:10px;
		vertical-align: top;
		display: inline-block;
	}
	#sameCycle > a:hover {
		margin-left: 0;
		margin-right: -10px;
	}


img.couverture {
	max-width:100%;
}




.targetClick{
	top:0;
	position:fixed;
}
.targetHide{
	display:none;
}
#SteamRecent:target ~ div .SteamRecent {
	display:block;
}


#principal .qr {
	position: absolute;
	right: 240px;
	bottom: 0;
}
#secondaire .qr {
	margin-bottom: -162px;
	margin-left:-19px;
}
#secondaire ul {
	margin-left:12px;
}
#secondaire li.aacheter
{
	font-weight: bold;
	color:red;
}

.resultAjaxList
 {
	display:none;
    position: absolute;
	background: #2c2f22;
    border: 1px solid #cbd888;
	/*min-width: calc(100% - 10px);
	max-width: 500px;*/
    width: 347px;
	min-height: 77px;
	z-index: 999;
	color: #ff6533;
}
.resultAjaxList h3
 {
	margin: 0 0 0 5px;
}
.resultAjaxList h4
 {
	margin: 5px 0 0 20px;
	font-style: italic;
	width: calc(100% - 55px);
}
.resultAjaxList ul
 {
    padding-top: 5px !important;
    padding-left: 10px !important;
    width: calc(100% - 10px);
	list-style: outside none none;
    margin: 0;
}
.resultAjaxList li
 {
    padding: 0;
    width: 100%;
}
.resultAjaxList a
 {
	padding: 2px !important;
    width: calc(100% - 10px);
	display: block !important;
    font-size: 0.9em;
    height: 1%;
    line-height: 1.5;
    text-decoration: none;
    border: 1px solid transparent;
    color: #ff6533 !important;
}
.resultAjaxList strong
 {
	background-color: #ff6533 !important;
    padding: 4px;
}
.resultAjaxList div.thumbnail
 {
	padding: 0px !important;
	width: auto;
	display: none;
	position: absolute;
	right: 0px;
	top: 0px;
	background: none;
}
.resultAjaxList div.thumbnail a
 {
	display: none;
	float: left;
	padding: 0 !important;
	border: none;
	width: auto;
}
.resultAjaxList div.thumbnail img
 {
	display: none;
}
.resultAjaxList li:hover div.thumbnail, .resultAjaxList li:hover div.thumbnail a, .resultAjaxList li:hover div.thumbnail img
 {
	display: block !important;
}
.resultAjaxList a:hover, .resultAjaxList a:focus, .resultAjaxList a.selected
 {
	background: #000000 !important;
}

.loadNextBooks 
{
	font-style: italic;
    text-align: center;
    width: 100%;
}
.goToGlobal 
{
    position: absolute;
    margin-left: -15px;
	margin-top: -35px;
	text-decoration: none;
}

#principal table
{
	border: 1px solid gray;
    display: inline-block;
}
#principal table tr
{
	border: 1px solid gray;
}
#principal table td
{
	border: 1px solid gray;
	padding: 3px;
}

.tabulation
{
	margin-left:30px;
}

.draggable
{
	margin-left:30px;
	max-width: 500px;
	color:black;
}
.draggableHover, 
.draggableHover > a
{
	color:#ff6533 !important;
}

.otherValue
{
	color: red;
}
.otherValue a
{
	color: red !important;
	text-decoration: none;
}

fieldset.formtable {
	display:table;
}
fieldset.formtable > div {
	display:table-row;
}
fieldset.formtable > div > * {
	display:table-cell;
	vertical-align: top;
}
fieldset.formtable > div > *:first-child {
	text-align: right;
}
fieldset.formtable > div > label,
fieldset.formtable> div > div{
	padding-right:5px;
}
fieldset.formtable > div > input{
	margin-right:5px;
}
/*#principal a:has(> img) {//CSS 4
    text-decoration: none;
}*/
input::placeholder {
  font-style: italic;
}

.showdescription > span
{
	display:none;
	color:black !important;
	position: fixed;
    color: black;
    background-color: #cbd888;
    border: 1px solid;
    padding: 5px;
    margin-right: 50px;
}
.showdescription:hover > span,
.showdescription > span:hover
{
	display:inline;
}
.updateBook {
	position: absolute;
    right: 260px;
    margin-top: -2px !important;
    border: 2px solid white;
    width: 20px;
    height: 20px;
    border-radius: 0 10px 0 5px;
}
.updateBook .rectangle {
	display:inline-block;
	border:1px solid white; 
	height:8px;
	width:8px;
	margin:4px;
}
.updateBook:hover {
	background-color:#2C2F22 !important;
}
.updateBook:hover > .rectangle {
	border:2px solid white; 
	height:10px;
	width:10px;
	margin:3px;
}

h3 a ~ *,
h2 a ~ * {
	font-size:.8em;
}

.cadreNewsResumee .paragraphe {
	margin-top: 6px;
}

/*a[data-numero]::after {
	content:" - " attr(data-numero);
}*/

button.add, button.del
{
	border: none;
    background: none;
	cursor: pointer;
	font-weight: bold;
	font-size: 1.5em;
}/*@charset "utf-8";*/
/* CSS Document */

.onglet
{
	top: -20px;
	position:absolute;
	right:240px;
	margin-top:0 !important;
}

.growonglet, .growonglet *, .minonglet, .minonglet *, .endonglet1, .endonglet2 {
	transition-property: color, background-color, border-radius;
	transition-duration: 1s;
	transition-timing-function: ease-in-out;
}

.cacheonglet {
	background-color:#DD4C04;
	height:20px;
	width:40px;
	position:absolute;
	right:40px;
	border-radius:10px 5px 0px 0px;
}
.endonglet1 {
	background-color:#CBD888;
	height:10px;
	width:10px;
	position:absolute;
	right:80px;
	top:10px;
}
.endonglet2 {
	background-color:#2C2F22;
	height:10px;
	width:10px;
	position:absolute;
	right:80px;
	border-radius:0px 0px 10px 0px;
	top:10px;
}

/* boutons de base grow */
.growonglet {
	height:20px;
	width:40px;
	display:block;
	cursor:pointer;
	position:absolute;
	right:0;
	
	border:0px solid gray;
	background-color:#CBD888;
	border-radius:10px 5px 0px 0px;
}
.growonglet div {
	position:absolute;
	outline:2px solid #2C2F22;
	width:12px;
	height:8px;
	margin-top:6px;
	margin-left:15px;
}
.growonglet div + div {
	display:none;
}
.growonglet:hover {
	background-color:#DD4C04;
}
.growonglet:hover div {
	outline-color:#2C2F22;
	background-color:#DD4C04;
}
.growonglet:hover + .minonglet {
	border-radius:10px 5px 10px 0px;
}

/* boutons de base min */
.minonglet {
	position:absolute;
	height:20px;
	width:40px;
	display:block;
	cursor:pointer;
	right:40px;
	
	border:0px solid gray;
	background-color:#CBD888;
	cursor:pointer;
	border-radius:10px 5px 0px 0px;
}
.minonglet div {
	position:absolute;
	width:14px;
	height:3px;
	margin-top:9px;
	margin-left:13px;
	background-color:#2C2F22;
}
.minonglet div + div {
	display:none;
}
.minonglet:hover {
	background-color:#DD4C04;
}
.minonglet:hover div {
	background-color:#2C2F22;
}

.minonglet:hover + .endonglet1 {
	background-color:#DD4C04;
}


/* quand grow */
.max {
	position:fixed;
	z-index:1000;
	width:98.2%;
	height:97.7%;
	margin:0 !important;
	top:0;
	left:0;
	overflow:auto;
}

.max .cacheonglet {
	position:fixed;
	border-radius:0 0 10px 15px;
}
.max .endonglet1 {
	position:fixed;
	top:0px;
	background-color:#2C2F22;
}
.max .endonglet2 {
	position:fixed;
	top:0px;
	background-color:#CBD888;
	border-radius:0px 10px 0px 0px;
}
.max .growonglet {
	position:fixed;
	top:0px;
	background-color:#2C2F22;
	border-radius:0px 0px 5px 10px;
}
.max .growonglet div {
	margin-top:3px;
	margin-left:17px;
	outline-color:#CBD888;
}
.max .growonglet div + div {
	display:block;
	margin-top:6px;
	margin-left:14px;
	background-color:#2C2F22;
}
.max .growonglet:hover {
	background-color:#DD4C04;
}
.max .growonglet:hover div {
	background-color:#DD4C04;
}
.max .growonglet:hover + .minonglet {
	border-radius:0px 10px 5px 10px;
	/*
	border-radius:0 10px 0 0;
	background-color:#CBD888;
}
.max .growonglet:hover + .minonglet div {
	background-color:#2C2F22;*/
}
.max .minonglet {
	position:fixed;
	top:0px;
	background-color:#2C2F22;
	border-radius:0px 0px 5px 10px;
}
.max .minonglet div {
	background-color:#CBD888;
}
.max .minonglet:hover {
	background-color:#DD4C04;
}

/* quand min */
/*.min {
	height:100px;
	overflow:hidden;
}*/
.min * {
	display:none;
}
.min > div ,
.min > h1,
.min > .onglet, .min > .onglet *{
	display:block;
}
.min > div *,
.min > div#sameCycle {
	display:none;
}
.min > .nohide,
.min > .nohide .nohide,
.min > .nohide .nohideAll ,
.min > .nohide .nohideAll *,
.min > .nohideAll ,
.min > .nohideAll * {
	display:block !important;
}
.min > .nohide .nohideAll a,
.min > .nohideAll a,
.min > .nohide .nohideAll em ,
.min > .nohideAll em {
	display:inline !important;
}
.min > .nohide li,
.min > .nohideAll li {
	display:list-item !important;
}
.min > .nohide .nohideAll h3 a ~ *,
.min > .nohide .nohideAll h2 a ~ * {
	display:none !important;
}
.min > .nohide .nohideNone,
.min > .nohideAll .nohideNone,
.min > .nohide .nohideAll .bigCouv,
.min > .nohide .nohideAll .thumbCov  {
	display:none !important;
}
.min > .nohide .nohideAll a:hover > .bigCouv,
.min > .nohide .nohideAll a:hover > .thumbCov  {
	display:inline !important;	
}

.min > ul.menu.nohideAll a:hover span.nohideNone {   /* définition de la balise <span> au survol */
	display: block !important;
}
.min > div > h1 {
	display:block;
}
.min .minonglet div {
	margin-top:3px;
	margin-left:17px;
	outline:2px solid #2C2F22;
	width:12px;
	height:8px;
	background:none;
}
.min .minonglet div + div {
	display:block;
	margin-top:7px;
	margin-left:14px;
	background-color:#CBD888;
}
.min .minonglet:hover {
	background-color:#DD4C04;
}
.min .minonglet:hover div {
	background-color:#DD4C04;
}/*
.min .growonglet:hover + .minonglet div {
	outline-color:#CBD888;
	background-color:#2C2F22;
}*//*@charset "utf-8";*/
/* CSS Document */

body, 
#navigation, 
#secondaire, 
#principal, 
#centre, 
#pied {
	position: relative;
	margin:0px;
	width:100%;
	padding:0px;
}
.cacheonglet,
.growonglet,
.minonglet,
.endonglet1,
.endonglet2,

.menu_fond,
.menu
{
	display: none;	
}