/********************************************
*  CSS BD-EXTERIEUR
*
*  date:    2014.04.30 - satoko for ever 
*  author:  erational.org
*  version: 0.4
*****************************************/
/* 1. BASE
==============================================================================*/
/* 1.0 fonts
------------------------------------------------------------------------------*/
/* google fonts: roboto */


/* Font
=================================================== */
/*
 kit google en local
 https://gwfh.mranftl.com/fonts/lato?subsets=latin
*/

/* roboto-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/roboto-v51-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/roboto-v51-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



/* 1.1 color
------------------------------------------------------------------------------*/
.tag1 {
	background: #0e74ff;
}

.tag-border1 {
	border-color: #0e74ff !important;
}

.tag2 {
	background: #b21100;
}

.tag-border2 {
	border-color: #b21100 !important;
}

.tag3 {
	background: #ce00c2;
}

.tag-border3 {
	border-color: #ce00c2 !important;
}

.tag4 {
	background: #b06207;
}

.tag-border4 {
	border-color: #b06207 !important;
}

.tag5 {
	background: #019b08;
}

.tag-border5 {
	border-color: #019b08 !important;
}

.tag6 {
	background: #ca86ff;
}

.tag-border6 {
	border-color: #ca86ff !important;
}

.tag7 {
	background: #7e7e7e;
}

.tag-border7 {
	border-color: #7e7e7e !important;
}

.tag8 {
	background: #bab6c7;
}

.tag-border8 {
	border-color: #bab6c7 !important;
}

/* 1.1 Tags & Reset --> bootstrap
------------------------------------------------------------------------------*/
body {
	font-family: 'Roboto', Arial, sans-serif;
	background: #f0f0f0;
	color: #434343;
}

input, button, select, textarea {
	font-family: 'Roboto', sans-serif;
	font-size: 16px !important;
}

/* surcharge bootstrap pour eviter le 'Helvetica Neue' */
h1, h2, h3, h4, h5, h6 {
	font-family: 'Roboto', sans-serif;
}

h1 {
	font-size: 2.2em;
	margin-top: 0.5em;
	margin-bottom: .15em;
	line-height: 110%;
	text-transform: uppercase;
	font-weight: bold;
}

h3 {
	margin-bottom: 0.2em;
	font-weight: bold;
}

h4 {
	font-size: 1.8em;
	margin-top: 0;
	padding-bottom: .18em;
	margin-bottom: 0.3em;
	line-height: 110%;
	border-bottom: 11px solid #1d569a;
}

h5 {
	font-size: 1.2em;
	color: #3371bb;
	margin-bottom: 0.4em;
}

iframe {
	width: 100%;
	margin-bottom: 1em;
}

/* pour que youtube soit responsive */
a {
	color: #27aae1;
}

a:hover {
	background: transparent;
	color: #3371bb;
}

/*
.debug-layout {display:none;}  

.row {background:#ccc;}
.span1,.span2,.span3,.span4,
.span5,.span6,.span7,.span8,
.span9,.span10,.span11,.span12 {background:pink;} 
 */
/* 1.2 Base SPIP 
------------------------------------------------------------------------------*/
.spacer, hr.spip {
	clear: both;
}

/* Document (version 2015.02.16) */
dl.spip_documents {
	margin: 0;
}

.spip_documents a.spip_out {
	background: transparent !important;
	text-decoration: none!important;
	border: 0px #fff !important;
}

/* pour eviter les bordures sur lien img [<img1>->url] */
.spip_documents_left {
	float: left;
	padding-right: 8px;
	padding-bottom: 8px;
}

.spip_documents_right {
	float: right;
	padding-left: 8px;
	padding-bottom: 8px;
}

.spip_documents_center {
	display: block !important;
	float: none;
	text-align: center;
	margin: 5px auto;
}

.spip_doc_titre, .spip_doc_descriptif {
	clear: both;
	font-size: 0.8em;
	margin: 0 auto;
	font-family: Verdana;
}

img.spip_logos {
	margin: 0 0 10px 10px !important;
	float: right;
}

.spip_documents a img {
	border: 0 !important;
}

/* modele speciale img afficher titre et desc */
.spip_doc_titre {
	font-size: 0.9em;
	font-weight: bold;
}

.spip_doc_descriptif {
	font-size: 0.8em;
	font-weight: normal;
}

.spip_doc_credits {
	font-size: 0.8em;	
	padding-right: 5px !important;
	margin: 0;
}

.spip_doc_credits:before {
	content:"© ";
}

/* formulaire */
.erreur_message {
	font-size: 11px;
	color: #d00;
	display: block;
	font-family: arial,verdana;
	font-size: 110%;
}

.reponse_formulaire {
	margin: 1em 0;
	font-family: arial,verdana;
	font-size: 110%;
}

.reponse_formulaire_ok {
	color: #0a0;
	font-family: arial,verdana;
	font-size: 110%;
}

.formulaire_spip ul, .formulaire_spip li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.spip_surligne {
	background: yellow;
}

/* 2. LAYOUT
==============================================================================*/
.invisible {
	display: none;
}

.clear {
	clear: both;
}

.align-right {
	text-align: right !important;
}

.align-center {
	text-align: center !important;
}

/* 2.1 Header
------------------------------------------------------------------------------*/
.row-header {
	position: relative;
	height: 58px;
	margin-top: 18px;
}

.nav-logo {
	position: absolute;
}

/* 2.3 Contenu
------------------------------------------------------------------------------*/
/* nav */
.row-nav {
	background: #fff;
	padding-top: 58px;
	/* important marge du logo 58+55 = 105 */
}

.thema ul {
	margin: 0;
}

.thema li {
	display: inline;
}

.thema a {
	display: inline-block;
	padding: 2px 5px;
	margin-right: 5px;
	color: #c3c3c3;
	font-weight: bold;
	font-size: 110%;
}

.thema a.on {
	color: #1D569A;
}

.thema a:hover {
	color: #000;
}

/* main */
.row-main {
	background: #fff;
}

.row-main-footer {
	height: 50px;
	background: #fff url(../img/bg_footer.png) no-repeat bottom center;
}

.row-main-footer span {
	display: none;
}

.contenu {
}

/* 2.4 Footer
------------------------------------------------------------------------------*/
.footer {
	padding: 3em 0;
	color: #c3c3c3;
	text-align: center;
}

.footer a {
	color: #434343;
	padding: 0 20px;
}

.footer a:hover {
	color: #000;
}

/* 3. PAGES 
==============================================================================*/
/* 3.1 Homepage Sommaire
------------------------------------------------------------------------------*/
.lastupdate {
	text-align: center;
	background: #eee;
	font-size: 88%;
	border-top: 1px solid #cce3ff;
	border-bottom: 1px solid #cce3ff;
	margin-top: 1em;
}

/* 3.1 Rubrique 
------------------------------------------------------------------------------*/
.tag {
	width: 20%;
	text-align: center;
	border-radius: 3px;
	float: right;
	margin: 1.6em 0 0 5px;
	color: #fff;
}

.tag a {
	color: #fff;
}

.article-preview {
	border-top: 1px solid #b0b0b0;
	padding: .5em 0;
}

.article-preview a {
	color: #434343;
}

.article-preview a:hover {
	color: #3371bb;
}

.article-preview .chapeau {
	font-weight: normal;
}

.article-preview-first {
	border-top: 1px solid #fff;
}

.article-preview-illus {
	margin-bottom: 5px;
}

/* pagination */
.pagination {
}

.pagination-item {
	width: 50%;
	float: left;
}

.pagination-item .disabled {
	visibility: hidden;
}

/* correctif 2026 pour l'alignement des tags  */
.article-preview-head {
	display:flex;	
	flex-wrap:wrap;
	justify-content:space-between;
	align-items: center;	
	
	margin-top:1rem;
}

.article-preview-head .headline {
	width:100%;
	margin:0;
}

.article-preview-head .headline.headline--hastag {
	width: calc(80% - 1.25rem);
}

.article-preview-head .tag {
	margin:0 !important;
	order:2;	
}


/* 3.1 Article
------------------------------------------------------------------------------*/
.chapeau {
	font-size: 1.15em;
	margin: 0.5em 0;
	font-weight: bold;
}

.article-preview .chapeau {
	font-size: 1em;
}

.texte {
	clear: both;
}

.texte a {
	text-decoration: underline;
}

.article-meta {
	background: #f0f0f0;
	padding: 0.4em 0.6em;
	margin: 0.4em 0 1.4em 0;
	border-radius: 5px;
	line-height: 110%;
	font-size: 95%;
}

.article-preview .article-meta {
	margin: 0.2em 0;
}

.article-meta a {
	color: #434343;
	font-weight: bold;
	font-size: 110%;
}

.article-meta a:hover {
	color: #000;
}

.meta-auteur {
	width: 50%;
	text-align: right;
	float: right;
}

.meta-source {
	color: #828282;
}

.article-preview .meta-source {
	float: right;
	display: inline;
	margin-left: 0.5em;
}

/* article > doc */
.docjoint {
	float: left;
	width: 240px;
	margin: 15px 25px 0 0;
	line-height: 110%;
}

.docjoint small, .docjoint strong {
	display: block;
}

.docjoint a {
	text-decoration: none;
}

.docjoint a img {
	border: 0;
}

/*  article > porfolio (mediabox) */
#documents_portfolio {
	margin: 1em 0;
}

#documents_portfolio ul {
	margin: 0;
	padding: 0;
}

#documents_portfolio li {
	list-style: none;
	display: inline;
	float: left;
	margin: 5px;
}

#documents_portfolio img {
	padding: 5px;
	border: 1px solid #999;
	box-shadow: 2px 2px 3px 1px rgba(0, 0, 0, 0.1);
}

#documents_portfolio a:hover {
	opacity: 0.7;
}

/* social */
.social {
	margin: 2em 0 1em 0;
	text-align: center;
}

ul.socialo {
	list-style: none;
	margin: 0;
}

ul.socialo li {
	display: inline-block;
	margin: 0 12px 0 0;
}

ul.socialo li a, a.top span, a.prev span, a.next span {
	background: transparent url(../img/icon-social.png) no-repeat right bottom;
	display: block;
	height: 33px;
	width: 33px;
	text-indent: -99999px;
}

ul.socialo li.facebook a:hover {
	background-position: 0 -43px;
}

ul.socialo li.facebook a {
	background-position: 0 0;
}

ul.socialo li.twitter a:hover {
	background-position: -44px -43px;
}

ul.socialo li.twitter a {
	background-position: -44px 0;
}

ul.socialo li.print a:hover {
	background-position: -87px -43px;
}

ul.socialo li.print a {
	background-position: -87px 0;
}

a.top {
	float: right;
	color: #b0b0b0;
	width: 200px;
	text-align: right;
	line-height: 33px;
}

a.top span {
	margin-left: 10px;
	display: inline;
	float: right;
	background-position: -173px 0px;
}

a.top:hover {
	color: #000;
}

a.top:hover span {
	background-position: -173px -43px;
}

a.prev {
	color: #b0b0b0;
	width: 200px;
	text-align: right;
	line-height: 33px;
}

a.prev span {
	margin-right: 10px;
	display: inline;
	float: left;
	background-position: -260px 0px;
}

a.prev:hover {
	color: #000;
}

a.prev:hover span {
	background-position: -260px -43px;
}

a.next {
	float: right;
	color: #b0b0b0;
	width: 200px;
	text-align: right;
	line-height: 33px;
}

a.next span {
	margin-left: 10px;
	display: inline;
	float: right;
	background-position: -216px 0px;
}

a.next:hover {
	color: #000;
}

a.next:hover span {
	background-position: -216px -43px;
}

/* sidebar */
.sidebar {
	padding-top: 7em;
}

.home .sidebar {
	padding-top: 0.5em;
}

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

.sidebar ul a {
	display: block;
	padding: .3em 0;
	border-bottom: 1px solid #eee;
	color: #181348;
}

.sidebar ul a:hover {
	background: #f0f0f0;
	color: #000;
}

.sidebar-section {
	margin: 0 18px 5em 0;
}

.sidebar-derniers h4 {
	border-color: #387fd3;
}

.sidebar-newsletter h4 {
	border-color: #63aafe;
}

.sidebar-annonce h4 {
	border-color: #a6cfff;
}

.sidebar-top {
	display: none;
}

.sidebar-pub div {
	margin-right: 18px;
}

/* sidebar home*/
a.more {
	text-decoration: underline;
}

.sidebar-edito, .sidebar-annonce {
	line-height: 180%;
}

.sidebar-baseline {
	background: #d8d8d8 url(../img/bg_baseline.png) no-repeat bottom right;
	padding: 30px 15px 5px 15px;
	line-height: 180%;
	font-size: 120%;
}

.sidebar-baseline a {
	display: block;
	text-align: right;
	color: #434343;
	font-weight: bold;
}

.sidebar-baseline a:hover {
	color: #0475de;
}

/* 3.2 Auteur
------------------------------------------------------------------------------*/
h1.nom {
	border-bottom: 10px solid #1d569a;
}

/* 70. PRINT
==============================================================================*/
@media print {
	/* le compresseur spip ne distingue les medias screen, all....
        on reset donc a la main bootstrap pour le print
     
     */
	.span1, .span2, .span3, .span4, .span5, .span6, .span7, .span8, .span9, .span10, .span11, .span12 {
		width: auto !important;
		padding: 5px !important;
		margin: 0 !important;
	}

	a[href]:after {
		content: ""
	}

	/* autres calages pour le print */
	#spip-admin, a.top, .social, .row-nav, .sidebar, .footer, .pagination {
		display: none;
	}

	body {
		font-size: 12px;
	}

	h1 {
		font-size: 20px;
		margin-top: 1em;
	}

	.article-preview a {
		text-decoration: none !important;
	}

	img {
		width: 70%;
	}

	.article-preview img {
		width: 200px;
	}

	.article-preview-illus {
		float: left;
	}

	.tag, .tag a {
		text-align: right;
		color: #999;
	}

	.row-header img {
		width: 60%;
	}

	.article-meta {
		padding: 0;
		color: #aaa;
		overflow: visible;
		margin-bottom: 1em;
	}

	.article-meta a {
		text-decoration: none;
	}

	.row-main-footer {
		height: 2em;
	}

	.row-main-footer span {
		display: block;
		font-size: 11px;
		border-top: 1px solid #aaa;
	}
}

/* 80. RESPONSIVE
==============================================================================*/
.responsive-only {
	display: none;
}

/* totalement masqué */
/* casual desktop */
@media (max-width: 1200px) {
	/*   .contenu .container .row-main {background:green;}  */ /* nav */ .navintro {
		font-size:2.6em;
	}

	.navintro-text {
		padding-top: 0.5em;
	}
}

/* Portrait tablet to landscape and desktop */
@media (max-width: 979px) {
	/* .contenu .container .row-main {background:orange;}  */ .responsive-only {
		display:block;
	}

	.responsive-no, .responsive-hide {
		display: none;
	}

	/* layout */
	body {
		background: #fff;
	}
}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
	/* .contenu .container .row-main {background:lightblue;}  */ h1 {
		font-size:1.2em;
	}

	.chapeau {
		font-size: 1em;
	}

	.tag {
		margin-top: .6em;
		font-size: 80%;
	}

	/* nav */
	.row-nav {
		padding-top: 32px;
	}

	.row-nav ul {
		display: none;
	}

	/* social */
	.social .top {
		display: none;
	}

	.sidebar-top {
		display: block;
	}

	/* article */
	.sidebar {
		padding-top: 2em;
	}

	.sidebar-section {
		margin-bottom: 1em;
	}

	/* sidebar */
	.sidebar-pub {
		display: none;
	}
}

/* Landscape phones and down */
@media (max-width: 480px) {
	/* .contenu .container .row-main {background:pink;} */ /* nav */ .row-nav {
		padding-top:0px;
	}

	/* footer */
	.row-main-footer, .footer {
		display: none;
	}
}