/*----- Html, body, structure et head tous ce qui configure la page------*/
html, body
{
    height: 100%;
    font-family: Verdana, sans-serif;
	font-weight: normal;
}

body {
    margin: 0;
    padding: 0;
}

img {
    border: 0;
}

.nav_menu .active{ color: #07F; }

#structure
{
    background: transparent url('img/design/bordurepage.png') 0 0 repeat-y scroll;
    display: block;
    width: 980px;
    margin: 0 auto;
    position: relative;
	min-height: 100%;
}

#head, #corps {padding:20px 50px 0 50px;}
#corps { padding-left:105px; padding-top:21px;}

h1 { display: inline-block; margin:0;}

.article h2 {
    font-size: 15px;
    color: #5B5D72;
	padding-left: 30px;
    background: url(img/design/pastille.png) no-repeat left;
    text-transform:none;
	line-height: 20px;
	margin: 10px 0;

}
.deployable h2{
    cursor: pointer;
}
.deployable h2:hover{
    background-color: #AFC4D2;
}


/*-----  Menu et ses images (toujours vertical, repliable via ≡) ------*/
#nav
{
	width: 180px;
	position: fixed;
	top: 20px;
	left: 20px;
	z-index: 1000;
}

/* case à cocher invisible qui pilote l'ouverture/fermeture (pas besoin de JS) */
.nav_toggle_checkbox {
	display: none;
}

#nav #nav_header {
	height: 25px;
	background-image: url(img/design/nav_header.png);
	position: relative;
	overflow: hidden;
	max-height: 25px;
	opacity: 1;
	-moz-transition: max-height .35s ease, opacity .35s ease;
	-webkit-transition: max-height .35s ease, opacity .35s ease;
	transition: max-height .35s ease, opacity .35s ease;
}

/* icône ≡ cliquable : carré avec bordure, centré au-dessus du menu */
#nav_burger {
	display: block;
	width: 25px;
	height: 25px;
	margin: 0 auto 6px auto;
	box-sizing: border-box;
	line-height: 23px;
	text-align: center;
	font-size: 16px;
	cursor: pointer;
	color: #5B5D72;
	user-select: none;
	border: 1px solid #AFC4D2;
	border-radius: 4px;
	background: #F7F7F7;
}
#nav_burger:hover {
	background-color: #AFC4D2;
}

#nav .nav_menu {
	background: url(img/design/nav_background.png) repeat-y;
	padding: 4px 23px 8px 34px;
	width: 119px;
	display: flex;
	flex-direction: column;
	overflow-x: hidden;
	overflow-y: auto;
	max-height: calc(100vh - 175px);
	opacity: 1;
	-moz-transition: max-height .35s ease, opacity .35s ease, padding .35s ease;
	-webkit-transition: max-height .35s ease, opacity .35s ease, padding .35s ease;
	transition: max-height .35s ease, opacity .35s ease, padding .35s ease;
}

#nav #nav_footer {
	height: 79px;
	background-image: url(img/design/nav_footer.png);
	position: relative;
	-moz-transition: max-height .35s ease, opacity .35s ease;
	-webkit-transition: max-height .35s ease, opacity .35s ease;
	transition: max-height .35s ease, opacity .35s ease;
	overflow: hidden;
}

/* état replié : la case est cochée -> on masque menu + pied de menu */
#nav .nav_toggle_checkbox:checked ~ #nav_header {
	max-height: 0;
	opacity: 0;
}
#nav .nav_toggle_checkbox:checked ~ .nav_menu {
	max-height: 0;
	opacity: 0;
	padding-top: 0;
	padding-bottom: 0;
	pointer-events: none;
}
#nav .nav_toggle_checkbox:checked ~ #nav_footer {
	max-height: 0;
	opacity: 0;
	pointer-events: none;
}

#twitter, #facebook
{
	display: block;
	position: absolute;
	width:50px;
	text-align: center;
	-moz-transition: all .5s;
	-webkit-transition: all .5s;
	transition: all .5s;
}

#twitter
{
	height: 36px;
	padding-top:14px;
	top: 37px;
	left:-19px;
}

#facebook
{
	height: 38px;
	padding-top:12px;
	top: 37px;
	left:34px;
}

#twitter:hover{
	height: 41px;
	padding-top:9px;
	-moz-transition: all .5s;
	-webkit-transition: all .5s;
	transition: all .5s;
}
#facebook:hover{
	height: 43px;
	padding-top:7px;
	-moz-transition: all .5s;
	-webkit-transition: all .5s;
	transition: all .5s;
}

.subMenu, .subMenuBou {
	display: none;
	position: absolute;
	top: 62px;
	left: calc(100% + 8px);
	width: 160px;
	box-sizing: border-box;
	max-height: calc(100vh - 175px);
	overflow-y: auto;
	background: #F7F7F7;
	padding: 8px;
	border-radius: 4px;
	-moz-box-shadow: 2px 0px 4px 0px #656565;
	-webkit-box-shadow: 2px 0px 4px 0px #656565;
	box-shadow: 2px 0px 4px 0px #656565;
}

.active + .subMenu,
.active + .subMenuBou {
	display: block;
}

.nav_menu a {
	text-align: left;
	display: block;
	text-decoration: none;
	color: black;
	font-size: 9pt;
	padding-left: 5px;
	-moz-transition: all .5s;
	-webkit-transition: all .5s;
	transition: all .5s;
}
.nav_menu a:hover {
	padding-left:14px;
	color: #5B5D72;
}



/*-----  Forme utilisateur  & son texte & avatar ------*/

div .form_grey
{
    -moz-box-shadow:2px 5px 12px 1px #777777;
    -webkit-box-shadow:2px 5px 12px 1px #777777;
    box-shadow:2px 5px 12px 1px #777777;
    float: right;
    margin-right: 20px;
    width: 360px;
    height: 150px;
    display: block;
    background: rgb(230,232,245); /* Old browsers */
    background: -moz-linear-gradient(left,  rgba(230,232,245,1) 0%, rgba(255,255,255,1) 50%, rgba(231,233,246,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(230,232,245,1)), color-stop(50%,rgba(255,255,255,1)), color-stop(100%,rgba(231,233,246,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left,  rgba(230,232,245,1) 0%,rgba(255,255,255,1) 50%,rgba(231,233,246,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left,  rgba(230,232,245,1) 0%,rgba(255,255,255,1) 50%,rgba(231,233,246,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left,  rgba(230,232,245,1) 0%,rgba(255,255,255,1) 50%,rgba(231,233,246,1) 100%); /* IE10+ */
    background: linear-gradient(to right,  rgba(230,232,245,1) 0%,rgba(255,255,255,1) 50%,rgba(231,233,246,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6e8f5', endColorstr='#e7e9f6',GradientType=1 ); /* IE6-9 */

}

.welcome
{
    margin-left: 125px;
    margin-top: 20px;
    color: #5B5D72;
}

.defaultAvatar
{
    width: 100px;
    height: 100px;
    margin-left: 9px;
    margin-top: -15px;
    display: block;
}

/*-----  1ere Forme de texte du milieu, son titre et images ------*/

.article
{
    width: 530px;
	float: left;
}
.article .article_box, fieldset
{
    background: #F7F7F7;
    width: 460px;
    margin-left: 30px;
    margin-top: 10px;
	padding: 1px 20px;
    -moz-box-shadow: 2px 0px 4px 0px #656565;
    -webkit-box-shadow: 2px 0px 4px 0px #656565;
    -o-box-shadow: 2px 0px 4px 0px #656565;
    box-shadow: 2px 0px 4px 0px #656565;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=90, Strength=4);

}

/*-----Sert pour les deux forme textes (cr�ation de marges et d'alin�a)------*/
p
{
	text-align: justify;
}
/*-----Sert pour les deux forme textes (cr�ation de marges pour le bas du texte)------*/
.article .meta
{
    padding-top: 10px;
    float: right;
    font-style: italic;
    margin-right: 20px;
}

/*-----   Forme de droite ------*/

.form_right
{
    width: 250px;
    min-height: 558px;
    background: #F7F7F7;
    display: block;
    float: right;
    margin-right: 20px;
    margin-top: 40px;
    -moz-box-shadow: 2px 0px 4px 0px #656565;
    -webkit-box-shadow: 2px 0px 4px 0px #656565;
    -o-box-shadow: 2px 0px 4px 0px #656565;
    box-shadow: 2px 0px 4px 0px #656565;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=90, Strength=4);

}

.bordel
{
    margin-right: 20px;
    margin-left: 20px;
    padding-top: 10px;
    color: #5B5D72;
    font-weight: bold;
}


/*-----   Bas de page ------*/
#innerCorps{min-height:700px;margin-bottom:10px;}
#footer
{
	clear: both;
}

#footer #mentions
{
    float: right;
    margin-right: -204px;
    margin-top: 75px;
}

#footer #papillion
{
    float: right;
    margin-right: 125px;
}


.clear{clear:both;}



a {
	text-decoration: none;
	color: #0066FF;
	cursor: pointer;
}

a:hover {
	color: #5B5D72;
}

a:visited {
	color: #0033FF;
}


.contenucentre td {
	text-align: center;
}

#infoscomplementaires a {
	text-align: left;
	display: block;
	text-decoration: none;
	color: black;
	font-size: 9pt;
	padding-left: 5px;
    -moz-transition: all .5s;
    -webkit-transition: all .5s;
    transition: all .5s;
}
.deployable>input,
.deployable>div {display:none;}
.deployable>input:checked~div {display:block;}

.texterouge {
    color: #ff0000;
}

/*-----
@media (min-width:720px) and (max-width:1080px){
	.form_right {display:none;}
	#nav{left:700px; transform:scale(1.5) translate(0, 80px);}
	#structure{
		position: absolute;
		left: 50%;
		margin-left: -490px;
	}
	#footer{width:500px;}
}

@media (max-width:719px){
	.form_right {display:none;}
	#nav{left:700px; transform:scale(1.5) translate(0, 80px);}
	#structure{
		position: absolute;
		left: 50%;
		margin-left: -490px;
	}
	#footer{width:500px;}
}
 ------*/


.modif-serie {
	cursor: pointer;
}

.nav_menu .menu-modele-5, .all_model .menu-modele-5 { color: #ff0000; }

.nav_menu .menu-modele-4, .all_model .menu-modele-4 { color: #e27d2a; }

.nav_menu .menu-modele-3, .all_model .menu-modele-3 { color: #981493; }

.nav_menu .menu-modele-2, .all_model .menu-modele-2 { color: #E469A6; }

.nav_menu .menu-modele-0, .all_model .menu-modele-0 { color: #00FFFF; }

#listSeries {
	display:flex;
	flex-wrap: wrap;
}
.serie{
	flex: 1;
	text-align: center;
	margin-bottom: 20px;
}
#listSeries.A>*,
#listSeries.B>*,
#listSeries.C>*,
#listSeries.D>*,
#listSeries.E>*,
#listSeries.F>*,
#listSeries.G>*,
#listSeries.H>*,
#listSeries.I>*,
#listSeries.J>*,
#listSeries.K>*,
#listSeries.L>*,
#listSeries.M>*,
#listSeries.N>*,
#listSeries.O>*,
#listSeries.P>*,
#listSeries.Q>*,
#listSeries.R>*,
#listSeries.S>*,
#listSeries.T>*,
#listSeries.U>*,
#listSeries.V>*,
#listSeries.W>*,
#listSeries.X>*,
#listSeries.Y>*,
#listSeries.Z>*,
.hideVendu .photo_vendu {display: none;}

#listSeries.A>.A,
#listSeries.B>.B,
#listSeries.C>.C,
#listSeries.D>.D,
#listSeries.E>.E,
#listSeries.F>.F,
#listSeries.G>.G,
#listSeries.H>.H,
#listSeries.I>.I,
#listSeries.J>.J,
#listSeries.K>.K,
#listSeries.L>.L,
#listSeries.M>.M,
#listSeries.N>.N,
#listSeries.O>.O,
#listSeries.P>.P,
#listSeries.Q>.Q,
#listSeries.R>.R,
#listSeries.S>.S,
#listSeries.T>.T,
#listSeries.U>.U,
#listSeries.V>.V,
#listSeries.W>.W,
#listSeries.X>.X,
#listSeries.Y>.Y,
#listSeries.Z>.Z {display: block;}


.selecteurLettre{
	display: block;
	width: 20px;
	text-align: center;
	opacity: 0.5;
    cursor: pointer;
}
.selecteurLettre.active{ opacity: 1; }

/* Partenaires */
ul.liste-partenaires {
	list-style: none;
}

ul.liste-partenaires li {

}

ul.liste-partenaires li .partenaire-img {
	display: block;
	max-width: 200px;
	max-height: 200px;
}

ul.liste-partenaires li .partenaire-lien {
	display: block;
	color: #000;
	transition: all 0.5s;
}

ul.liste-partenaires li .partenaire-lien:hover {
	color: #5B5D72;
}

ul.liste-partenaires li .partenaire-texte {
	text-indent: 0;
}

.textcards {
    display: none;
}

.cartemodele:hover ~ .textcards {
    display: block;
	position:absolute;
}

.caption {
	display: flex;
	justify-content: space-around;
}

.textapercu {
    display: none;
}

.apercumodele:hover ~ .textapercu {
    display: block;
	position:absolute;
}

.legende {
	display: flex;
	justify-content: space-around;
}

.anniv-box {
    display: inline-block;
    padding: 8px;
    background: #ffeef8;
    border-radius: 12px;
    border: 2px solid #ffb6da;
    box-sizing: border-box;
}

.anniv-title {
    text-align: center;
    font-size: 18px;
    font-style: italic;
    color: #d94fa0;
    margin-bottom: 10px;
	margin: 0 0 5px 0;     /* Supprime le retour à la ligne avant et ajuste l'espace après */
    font-size: 1.2em;
}

.anniv-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.anniv-item {
    display: flex;
    align-items: center;
	justify-content: center; /* centre tout le bloc (image + texte) */
    gap: 10px; 
    padding: 4px;
    margin-bottom: 4px;
    background: #fff;
    border-radius: 10px;
    border: 1px solid #ffd7ec;
}

.anniv-item.anniv-today {
    background: #ffe0ef;
    border-color: #ff8fc8;
    box-shadow: 0 0 5px #ffb5da;
}

.anniv-avatar {
    width: 38px;
    height: 38px;
	align-self: left;
    border-radius: 50%;
    margin-right: 10px;
    border: 2px solid #ffb6e6;
}

.anniv-info {
	display: flex;
    flex-direction: column;
    align-items: center;   /* centre les spans entre eux */
    justify-content: center;
    text-align: center;    /* centre le texte aussi */
}

.anniv-pseudo {
    font-weight: bold;
    color: #b2006c;
}

.anniv-pseudo a {
    font-weight: bold;
    color: #b2006c;
}

.anniv-date {
    font-size: 13px;
    color: #6e3a54;
}

.anniv-age {
    font-size: 12px;
    color: #9b4a7a;
}