/* Blog : habillage de l'ancien site, repris tel quel (legacy/blog/style.css et
   la partie utile de legacy/css-menu.css), au-dessus de Bootstrap 3.3.7 comme
   à l'origine. Seule différence : les couleurs passent par les variables
   --blog-* de couleurs.css (aucune couleur en dur). C'est la seule partie du
   site qui garde l'ancien style (décision du 29/09/2026). */

body { background: var(--blog-blanc); }

/* Bandeau du haut (legacy/css-menu.css) */
.cm-navbar-primary {
	color: var(--blog-blanc);
	background-color: var(--blog-noir);
}

.sub_title_blog {
	font-size:17px;
	text-align:right;
}

.link_accueil {
	font-size:13px;
	position:relative;
	top:-15px;
	left:2px;
	color: var(--blog-blanc);
	font-style: italic;
}

.link_back_top {
	position: relative;
	top:14px;
}

.link_back_bottom {
	position: relative;
	top:-14px;
}

.link_back_glyph {
	position: relative;
	top:2px !important;
}

.h2_blog {
	display:inline;
	font-size:17px;
}

.container {
	margin-top:50px;
}

.container_footer {
	margin-top: 0px !important;
	background-color: var(--blog-noir);
	color: var(--blog-blanc);
}

.container_footer a {
	text-decoration:none;
	color: var(--blog-blanc);
}

.container_footer a:hover {
	text-decoration:underline;
}

.copyright_footer {
	font-size:10px;
	text-align:center;
	background-color: var(--blog-blanc);
	color: var(--blog-texte);
	padding:8px;
}

.left_blog{
	border:1px solid var(--blog-bordure);
}

.link_navig_footer {
	list-style: none;
}

.one_art {
	margin-top:25px;
}

.img_content {
	text-align:center;
}

.img_art {
	max-height:300px !important;
	max-width:500px;
}

.title_art h2 {
	margin-bottom:10px;
	margin-top:5px;
	font-size:20px;
	font-weight:bold;
}

.content_art {
	text-align:justify;
}

.right_blog {
	border:0px solid var(--blog-bordure);
	padding-top:25px;
}

.title_art_right h2 {
	margin-bottom:5px;
	margin-top:5px;
	font-size:15px;
	font-weight:bold;
}

/* ARTICLE */
.info_date {
	border-bottom:1px solid var(--blog-gris-date);
	padding-bottom:10px;
	padding-top:10px;
	color: var(--blog-gris-date);
	margin-bottom: 25px;
	text-align:right;
}

.img_art_unique_small {
	margin-bottom:25px;
	max-height:400px;
	max-width:450px;
}

.img_art_unique {
	margin-bottom:25px;
	max-height:600px;
	max-width:650px;
}

.content_art_unique {
	text-align: justify;
	margin-bottom:50px;
}

.footer {
	margin-top:50px;
}

@media screen and (max-width: 768px){
	.title_art {
		margin-left:25px;
	}

	.content_art {
		margin-left:25px;
	}
}

/* --- Ajouts du nouveau site --------------------------------------------- */

/* Mobile : l'ancien blog débordait de l'écran (images de 500 px, cadre
   Facebook de 340 px). On garde le dessin, sans barre de défilement. */
@media (max-width: 767px) {
	.img_art, .img_art_unique, .img_art_unique_small { max-width:100%; height:auto; }
}
.container { max-width:100%; }

/* Page Facebook : chargée seulement si le visiteur le demande (elle dépose
   les cookies de Facebook), à l'emplacement et au format de l'ancien cadre. */
.facebook-page { max-width:100%; }
.facebook-page iframe { max-width:100%; border:none; overflow:hidden; }
.facebook-page-invitation {
	display:block;
	width:340px;
	max-width:100%;
	padding:14px;
	border:1px solid var(--blog-encadre);
	background: var(--blog-blanc);
	color: var(--blog-noir);
	text-align:left;
	font-size:13px;
}
.facebook-page-invitation strong { display:block; font-size:15px; margin-bottom:4px; }
.facebook-page-invitation span { display:block; color: var(--blog-gris-date); font-size:11px; margin-top:6px; }
.container_footer .facebook-page-invitation { color: var(--blog-noir); }
