
/* font */
h1, h2, h3, h4, h5, h6, input[type="submit"], input[type="reset"], input[type="button"], button, .button, label,
table th, .pagination a, .pagination span, #header .logo, #nav ul.links, #copyright, #navPanelToggle,
#sousnavToggle, #navPanel .links li a {
	font-family: "Overlock", Helvetica, sans-serif;
}
small { font-size:80%; }

img { height: auto; max-width:100%; }

#intro.hidden .button { opacity:0 !important; visibility:hidden !important; }
#intro + #header .logo { opacity:0 !important; display:none; }
#intro.hidden + #header .logo { opacity:1 !important; display:block; }
.page_sommaire #intro > p { margin-right: auto; margin-left: auto; max-width: 1000px;}

#main {

	.chemin {
		border-bottom-color: #ddd;
    padding: 1.1em 1.5em 1em;
    font-size: 0.8em;
		.item-chemin {
			display: inline-block;
			margin-right: .3em;
			margin-left: .3em;
		}
		a.item-chemin:first-of-type { margin-left: 0; }
	}


	& > .post 						{ padding-top:4rem; }
	& > .post:after 	{ display:block; content:''; clear:both; }
	/* on veut ajaxer la liste/articles donc on prend en compte une div de + dans les styles "> div " */
	& > * { padding:0; border-top:0; margin: 0;}
	& > div {
		& > * {
			padding: 4rem 4rem 2rem 4rem;
			border-top: solid 2px #eeeeee;
			margin: 0;
		}
		& > [id^=pagination_] {
			padding:0;
		 	border:0;
		}
		& > .posts {
			display: flex;
			flex-wrap: wrap;
			align-items: stretch;
			text-align: center;
			width: 100%;
			padding: 0;
			& > * {
				flex-shrink: 1;
				flex-grow: 0;
				padding: 4rem;
				width: 50%;
			}
			.date {
				text-transform: uppercase;
			  color: #888;
			  margin-bottom: 1em;
			  display: block;
			}
			.tit {
				font-size: 2.1rem;
				line-height: 1.3;
				.surtit {
					font-size: 0.8em;
					color: #999;
				}
			}
			.item .btn {
				color: #000;
				display: table;
				padding: .6em 1.2em;
				background-color: #fff;
				margin: 0 auto;
			  position: relative;
			  --mask:
		    radial-gradient(11px at 11px 11px,#0000 calc(98% - 2px),#000 calc(100% - 2px) 98%,#0000) -11px -11px,
		    linear-gradient(90deg,#000 4px,#0000 0) -2px 50% /100% calc(100% - 22px + 2px) repeat-x,
		    linear-gradient(      #000 4px,#0000 0) 50% -2px/calc(100% - 22px + 2px) 100% repeat-y;
				border: none;
				&:before {
				  content: "";
				  position: absolute;
				  inset: 0;
				  background: #000;
				  -webkit-mask: var(--mask);
				          mask: var(--mask);
				}
			}

			.llsrub {
				border-top: 1px solid #eee;
				border-width: 1px 0;
				padding: 1em;
				text-transform: uppercase;
				margin: 0 auto 5em;
				width: auto;
			}
			& > article {
				border-color: #eeeeee;
				border-left-width: 2px;
				border-style: solid;
				border-bottom-width: 2px;
				text-align: center;
				& > :last-child { margin-bottom: 0; }
				&:nth-child(2n - 1) { border-left-width: 0; }
				&:nth-child(-n + 2) {  }
				&:last-child {
					&.impair {
						width: 100%;
					}
				}
			}
		}
	}
}

/* Le portofolio */
ul.portfolio { padding: 0; list-style: none;}
ul.portfolio li { line-height: 1.5em; font-size: 0.75em ;}
ul.portfolio li a, ul.portfolio li a:hover, ul.portfolio li a:active, ul.portfolio li a:focus { text-decoration:none; border:0;}
ul.portfolio li a:hover, ul.portfolio li a:active, ul.portfolio li a:focus { text-decoration:none; border:0;}
ul.portfolio li figcaption {margin-top: 0.25em;}
ul.portfolio li small { font-size: 0.75em; }

/* Les documents joints */
.documents_joints ul, .documents_joints li { padding: 0; list-style: none;  line-height: 1.5em;}
.documents_joints ul .spip_logo { float: left; margin: 0 1em 0 0;}
.documents_joints .publication { font-size: 0.75em; }
.documents_joints .descriptif p {margin:0;}

/* Les forums */
ul.forum, ul.forum > li, ul.comments-items, ul.comments-items > li { list-style: none; margin: 0; padding:0;}
.comments  {margin-top:3rem; padding: 1em 0; border-top:10px solid #eee;}
.comments  ul { list-style:none; }
.comment-item {margin:0.5em 0 0 0;padding:0.5em 0 0 0; border-top:1px solid #eee;}
.comments-items .comments-items { margin-left: 25px; padding-left: 20px; border-left:5px solid #ddd;}
.comment-meta { margin: 0; font-weight: bold; }
.comment-meta small { font-size: 100%; }
.comment-meta abbr { border: 0; }
.comment-meta a { text-decoration:none; }
.comment-content .hyperlien { padding: 0; background: transparent; font-weight: normal; }

/* Formulaire de forum */
.forum-titre  {margin-top:3rem;padding:1em 0;border-top:10px solid #eee;}
.formulaire_forum form+form{margin-top:1em;}
.formulaire_forum legend { display: none; }
.formulaire_forum .saisie_titre input.text { width: 100% }
.formulaire_forum .session_qui { display: none; }
.formulaire_forum .saisie_texte .explication { font-size: .9em; font-style: italic; margin: 0.5em 0; }
html[dir="rtl"] .formulaire_forum .saisie_texte .explication { font-style: normal; }
.formulaire_forum .boutons { margin-top: 1em; }

/* Previsualisation des forums */
.formulaire_forum legend { display: none; }
.formulaire_spip .previsu { margin-bottom: 1.5em; padding: 0.75em; border: 2px dashed #F57900; }
fieldset.previsu legend { color: #F57900; }

/* Reponses des forums */
.reponse_formulaire { margin-bottom: 1.5em; padding: 0.75em; border: 2px solid #ddd; }
.reponse_formulaire_ok { background: #e6efc2; color: #264409; border-color: #c6d880; }
.reponse_formulaire_erreur { background: #fbe3e4; color: #8a1f11; border-color: #fbc2c4; }
.reponse_formulaire_ok a { color: #264409; }
.reponse_formulaire_erreur a { color: #8a1f11; }
.erreur_message { color: red; }

@media screen and (max-width: 736px) {

	#main > div > .posts > * { width: 100%; }
	#main > div > .posts > * { padding: 2rem; width: 100%; }
	#main > div > .posts > article:nth-child(2n - 1) { border-left-width: 2px; }
	#main > div > .posts > article:nth-child(-n + 2) { border-top-width: 2px; }
	#main > div > .posts > article:nth-child(n) { border-left-width: 0; }
	#main > div > .posts > article:nth-child(-n + 1) { border-top-width: 0; }
	#main > div > .posts > article .image { max-width: 25rem; margin-left: auto; margin-right: auto; }

}

.introduction 	{ margin: 0 0 2rem 0; }
.chapo 						{ font-weight:700;}
.surtit 						{ display: block; }

/* pagination */
.pagination > strong { display:inline-block; border:2px solid #eeeeee; min-width:3rem; text-align:center; margin-left:-2px; background-color: #eeeeee;
	font-family: "Open Sans", Helvetica, sans-serif; font-size: 0.8rem; font-weight: 900; line-height:calc(3rem - 4px); }
.pagination > span { border:0; padding:0; margin-left:-2px; }
.pagination > span a { margin:0; }
.pagination > span strong { display:inline-block; padding: 0 1.75rem; border:2px solid #eeeeee; height:3rem; color:#ddd; }


#sousnavmasqueeToggle { position:absolute; top:1em; right:2em; }

#sousnavmasquee { overflow:hidden; position:relative; }
#sousnavmasquee nav { margin-bottom:5em; margin-top:0; transition:margin 0.5s ease; }
#sousnavmasquee nav ul li a { display:inline-block; padding:0.4rem; border-bottom:0; }
#sousnavmasquee nav ul li a.active {  }

#sousnav nav { padding: 0 0.5em; font-size: 0.75em; }
#sousnav nav ul { padding:0; margin:0; list-style:none; }
#sousnav nav ul:after { display:block; content:''; width:100%; clear:both; }
#sousnav nav ul li { float:left; padding:0; margin-right:1rem; }
#sousnav nav ul li a { display:inline-block; padding: 0.2rem 0.6rem; border-bottom:1px solid; }
#sousnav nav ul li a.active {  }

/* Page d'accueil */

.page_sommaire, .page_article {
	#main {
	  & > div {
	    & > .posts {
	      & > article {
	         border-bottom-width: 0;
	      }
	    }
	    & > * {
	       border-top: none;
	       padding-bottom: 0;
	    }
	  }
		header.major {
			h1.grotit {color: #b6b6b6; }
		}
	}
}

/* Pages spécifiques */
.page_rubrique, .page_mot {
	.texte {
		text-align: center;
	  font-size: 1.2em;
	  color: #888;
	}
}

/* footer */
 footer {
	text-align: center;
	p { margin:0; }
	.icon::before { transition: color 0.2s ease-in-out }
	#copyright ul { margin-bottom: 0.5em; }

	/* formulaire contact */
	.formulaire_contact legend { display:none; }
	.formulaire_contact ul { list-style:none;  padding:0; margin:0; }
	.formulaire_contact li { padding:0; margin-bottom:1.5em; }
	#formulaire_contact input[type="checkbox"], #formulaire_contact input[type="radio"] { appearance: auto; opacity: 1; margin: 0;}
	#formulaire_contact .choix label { display: flex; align-items: center; line-height: 1em; }
	#formulaire_contact .choix label p { margin: 0; font-size: 0.6875em; font-family: "Merriweather", Georgia, serif; }
	.bugajaxie { position: absolute; }
	#contact_texte { height:500px; }
}

/* formulaire formidable */
.formulaire_spip .editer { clear:both; margin-bottom:1.5rem; }
.formulaire_spip .saisie_date:after { display:block; content:''; clear:both; }
.formulaire_spip input.date.text { float:left; }
.ui-datepicker .ui-datepicker-title select { padding:0; display: inline-block; text-align: center;}

/* Reponses */
.reponse_formulaire { margin-bottom: 1.5em; padding: 0.75em; border: 2px solid #ddd; }
.reponse_formulaire_ok { background: #e6efc2; color: #264409; border-color: #c6d880; }
.reponse_formulaire_erreur { background: #fbe3e4; color: #8a1f11; border-color: #fbc2c4; }
.reponse_formulaire_ok a { color: #264409; }
.reponse_formulaire_erreur a { color: #8a1f11; }

.erreur_message { color: red; }

.editer.erreur input[type="text"], .editer.erreur input.text,
.editer.erreur input[type="password"], .editer.erreur input.password,
.editer.erreur textarea,
li.erreur input[type="text"], li.erreur input.text,
li.erreur input[type="password"], li.erreur input.password,
li.erreur textarea { background-color: #fbe3e4; border-color: #fbc2c4; }


/* de squelettes-dist/css/spip.css */
/* Citations, code et poesie */
.spip_poesie div { margin-left: 50px; text-indent: -50px; }

/* Logos, documents et images */
.spip_logo { float:right; margin: 0 0 10px 10px; padding:0; border: none; }
.spip_logo { margin: 0 0 10px 10px; padding: 0; border: none; }
.spip_logo_center { clear: both; display: block; margin: 0 auto 1.5em auto; }
.spip_logo_left { float: left; margin-right: 1.5em; margin-bottom: 1.5em; }
.spip_logo_right { float: right; margin-left: 1.5em; margin-bottom: 1.5em; }

.spip_documents {
	margin-bottom: 1.5em;
	padding: 0;
	background: none;
	max-width: 100%;
	button { box-shadow:none; }
}
.spip_documents, .spip_documents_center, .spip_doc_titre, .spip_doc_descriptif {
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}
.spip_documents_center 	{ clear: both; display: block; width: 100%; }
.spip_documents_left  			{ margin-right: 1.5em; }
.spip_documents_right 		{ margin-left: 1.5em; }
.post .spip_documents{
	&.spip_documents_right, &.spip_documents_left 		{ margin-bottom: 2.3em ; }
}
.spip_doc_descriptif { clear: both; }
.spip_doc_credits { font-size:x-small; clear: both; }
@media (max-width: 640px) {
 		.spip_documents,.spip_doc_titre,.spip_doc_descriptif { max-width: 100% !important; }
}
.spip_documents a { border-bottom:0; }

/* remettre d'aplomb la boite modale */
/* boite modale de SPIP */
button {
	&#cboxPrevious, &#cboxPrevious:hover, &#cboxNext, &#cboxNext:hover, &#cboxSlideshow,
	&#cboxSlideshow:hover, &#cboxClose, &#cboxClose:hover {
		border:0;
		box-shadow:none;
	}
}

/* fix de la modale SPIP 3.3.*  */
.lity.lity-opened { z-index:10000; }
button.lity-next, button.lity-previous, .lity-group-start-stop button { box-shadow:none; text-transform:none; letter-spacing:0; }
.lity-group-start-stop button { line-height:1.5em; height:1.5em; }
.lity-group-start-stop, .lity-group-caption .lity-group-current { top: -2.5rem; }

aside {
	margin-top: 3em;
	width: 100%;
	overflow: hidden;
}