/* --------------------------------------------------------------

   layout.css
   Disposition des blocs principaux
   cf.: http://romy.tetue.net/structure-html-de-base

-------------------------------------------------------------- */

body {
	text-align: center;
	font-family: /*Comfortaa,*/ubuntu, sans-serif;
	background: /*#DCDCDC;*/
	#FFF;
	/*font-weight:700;*/
	 animation: fadein 2s;
}



@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.page {
	position: relative;
	margin: 0 auto;
	padding: 0;
	text-align: left;
}

.header {}

.main {
	padding: 0.5em 0
}

.footer {
	clear: both;
	margin-bottom: 10px;
}

.wrapper_sommaire {
	clear: both;
	float: left;
	width: 65%;
	overflow: hidden;
	background: #FFF;
}

.content_sommaire {
	min-height: 350px
}

.wrapper {
	clear: both;
	float: left;
	width: 65%;
	overflow: hidden;
}

.content {
	min-height: 350px
}

.aside {
	float: right;
	width: 27.5%;
	overflow: hidden;
	padding: 2.4%;
	background: #FFF;
	margin-bottom: 3%;
	/*box-shadow: inset 0 0 14px 14px #EFEFEF;*/
	/*box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);*/
	border: solid 1px transparent;
	border-radius: 3px;
}


/* Entete et barre de navigation
------------------------------------------ */

.header {
	padding-top: 1.5em
}

.header #logo {
	display: block;
	margin: 0;
	line-height: 1;
	font-weight: bold;
}

.header #logo,
.header #logo a,
.header #logo a:hover {
	background: transparent;
	text-decoration: none;
	color: #FFF;
}

.header #slogan {
	margin: 0
}

.formulaire_menu_lang {
	position: absolute;
	right: 0;
	top: .9em;
	display: block;
	width: 30%;
}

.nav {
	border: solid #222;
	border-width: 1px 0;
}

.nav ul {}

.nav ul li {}

.nav ul li a {
	float: left;
	display: block;
	padding: .5em 1em;
	border-right: 1px solid #222;
	text-decoration: none;
}

.nav ul li.on2 a {
	background: #EED;
	color: #222;
	font-weight: normal;
}

.nav ul li a:focus,
.nav ul li a:hover,
.nav ul li a:active {
	background: #222;
	color: #FFF;
}

.footer .colophon {
	float: left;
	height: 40px;
	width: 70%;
	margin: 0;
}

.footer .generator {
	float: right
}

.footer .generator a {
	padding: 0;
	background: none;
}


/* Gabarit d'impression
------------------------------------------ */

@media print {
	.page,
	.wrapper,
	.content {
		width: auto
	}
	.nav,
	.arbo,
	.aside,
	.footer {
		display: none
	}
}


/* Affichage sur petits ecrans
Cf.: http://www.alsacreations.com/astuce/lire/1177
------------------------------------------ */

@media (max-width: 640px) {
	/* passer tous les elements de largeur fixe en largeur automatique */
	body,
	.page,
	.header,
	.main,
	.footer,
	.wrapper,
	.content,
	.aside {
		width: auto !important;
		margin: auto !important;
	}
	.page {
		margin: 0;
		padding: 0;
	}
	/* Passer a une seule colonne (a appliquer aux elements multi-colonnes) */
	.content,
	.aside {
		clear: both;
		float: none !important;
		width: auto !important;
	}
	.nav ul li a {
		float: none;
		border: 0;
	}
	#formulaire_recherche {
		display: none;
		position: static;
		text-align: center;
	}
	.arbo {
		display: none
	}
	.footer .colophon {
		width: auto;
		float: none;
	}
	.footer .generator {
		display: none
	}
	/* header du calendrier full-calendar */
	table.fc-header td {
		display: block;
		text-align: left;
	}
}

.entete_noire1 {
	background: #FFF;
	width: 100%;
	margin: 0.4em 0 0;
	overflow: hidden;
}

.entete_noire2 {
	min-width: 20px;
	max-width: 1260px;
	width: 98%;
	margin: 0 auto;
	margin-bottom: 0;
}

.corps1 {
	background: url(img/fond_rouge.png) repeat-x;
	width: 100%;
	overflow: hidden;
}

.corps2 {
	min-width: 20px;
	max-width: 1260px;
	width: 98%;
	margin: 0 auto;
}

.pied {
	min-width: 20px;
	max-width: 1260px;
	width: 98%;
	clear: both;
	margin: 0 auto 20px auto;
	overflow: hidden;
}

.pied2 {
	padding: 2.4%;
	background: #FFF;
	text-align: left;
	box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);
	border: solid 1px transparent;
	border-radius: 3px;
	border-top: 1px solid #0000ff24;
}

.bloc_contenu {
	padding: 3.4%;
	background: #FFF;
	overflow: hidden;
	border: solid 1px transparent;
	border-radius: 3px;
}

.bloc_contenu2 {
	margin-bottom: 1.5%;
	background: #FFF;
	overflow: hidden;
	box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);
	border: solid 1px transparent;
	border-radius: 3px;
	display: flex;
	align-items: center;
	justify-content: center;
	max-height: 200px;
}

.item_menu {
	padding: 10px 10px 20px 10px;
	border-radius: 5px 5px 0 0;
	background: #333;
	color: #FFF;
	border: solid 1px #444;
}

.item_menu_accueil {
	padding: 10px 10px 20px 10px;
	border-radius: 5px 5px 0 0;
	background: #3950a2;
	color: #FFF;
	border: solid 1px transparent;
}

.slogan_site {
	font-family: Comfortaa;
	display: inline;
	font-weight: 700;
	font-size: 1.7em;
	color: #3950a2;
	vertical-align: -25%;
	text-shadow: 4px 4px 4px #aaa;
}

.footer .pied_gauche {
	width: 31.35%;
	float: left;
}

.footer .pied_centre {
	width: 31.35%;
	float: left;
	margin-left: 3%;
}

.footer .pied_droite {
	width: 31.35%;
	float: right;
}

.classement {
	list-style-type: decimal;
	margin-left: 1.7em;
	line-height: 1.25em;
}

.sans_serif_moyen {
	font-family: Arial
}

.la_suite {
	margin: 0 0 5% 0;
	padding: 1em;
	border: solid 0px #677821;
	border-radius: 4px;
	background: #3950a2;
}

.la_suite:hover {
	margin: 0 0 5% 0;
	padding: 1em;
	border: solid 0px #dbdbdb;
	border-radius: 4px;
	background: #5072e2;
	text-shadow: 1px 1px 0px rgba(150, 150, 150, 1);
}

.introduction {
	margin-bottom: 5%;
	line-height: 1.6;
}

.introduction2 {
	margin-bottom: 3%;
	line-height: 1.6;
}

.bloc_logo_article {
	position: relative;
	float: right;
	margin: 0 0 2% 3%;
	padding: 0;
	width: 35%;
	height: auto;
}

.bloc_agrandir {
	display: none;
	position: absolute;
	left: 40%;
	top: 43%;
	margin: 0 auto;
}

.icone_agrandir {
	width: 84%;
	height: auto;
	opacity: 0.5;
}

.icone_agrandir:hover {
	width: 84%;
	height: auto;
	opacity: 0.8;
}

.num_com {
	float: right;
	font-size: 1.6em !important;
	color: #DCDCDC;
	font-family: Georgia !important;
	font-style: italic !important;
}

.nbre_coms {
	color: #FFF;
	padding: 0.2em 0.4em;
	background: #3950a2;
	border-radius: 4px;
}

.bloc_portfolio {
	display: block;
	background: #FFF;
	padding: 2% 0% 2% 2%;
}

.bloc_portfolio:hover {
	display: block;
	background: url(img/back_docs.png);
	padding: 2% 0% 2% 2%;
}

.bloc_logo_site {
	float: left
}

.logo_site {
	margin: 0 0 0.1em 0;
	padding: 0;
	border: 0;
	vertical-align: middle;
	max-height: 45px;
	max-width: 45px;
	filter: drop-shadow(4px 4px 4px #797777);
}

.menu_select {
	display: none;
	padding: 1% 1% 0 1%;
	background: #3950a2;
	color: #FFF;
	border: 0;
	border-radius: 4px 4px 0 0;
	text-align: center;
	font-size: 1.4em;
	text-transform: uppercase;
}

.select_rub {
	text-align: left !important;
	font-size: 0.8em !important;
	text-transform: none !important;
}

.spip-icons {
	font-family: 'spip-icons' !important;
	font-size: 1.2em;
	color: #3950a2;
	vertical-align: middle;
}

.spip-icons:hover {
	color: #8896c7
}

#remonter {
	position: fixed;
	bottom: 50px;
	right: 20px;
	cursor: pointer;
	display: none;
	opacity: .8;
}

#remonter:hover {
	position: fixed;
	bottom: 50px;
	right: 20px;
	cursor: pointer;
	display: none;
	opacity: 0.5;
}

.image_opacity {
	opacity: 0.7;
}

.image_opacity:hover {
	opacity: 1;
}

@media (max-width: 3000px) {
	.ajustable {
		width: 500px !important;
		height: auto;
		border: 0;
	}
}

@media (max-width: 960px) {
	.ajustable {
		width: 86% !important;
		height: auto;
		border: 0;
	}
}

@media (max-width: 800px) {
	body {
		font: 0.9em/1.5em Ubuntu, Arial
	}
	.classement {
		list-style-type: decimal;
		margin-left: 0.4em;
		padding-left: 0;
		line-height: 1.25em;
	}
	.logo_site {
		margin: 0;
		float: left;
		width: 45px;
		height: auto;
	}
	.bloc_logo_site {
		float: none;
		margin: 0 auto;
	}
	.ajustable {
		width: 86% !important;
		height: auto;
		border: 0;
	}
}

@media (max-width: 640px) {
	body {
		font: 0.85em/1.5em Ubuntu, Segoe, Arial
	}
	h1,
	h1.spip,
	h2,
	h3,
	h4,
	h5,
	h6,
	.h1,
	.h3,
	.h3_2,
	.h4,
	.h4_2,
	.h5,
	.h6,
	.une {
		font-family: Ubuntu, Segoe, Arial
	}
	.menu_select {
		display: block;
		width: 46%;
		margin: 1em auto 0 auto;
		float: none;
	}
	#nav-container {
		display: none
	}
	#remonter,
	#remonter:hover {
		display: none
	}
	.ajustable {
		width: 86% !important;
		height: auto;
		border: 0;
	}
	.footer .generator {
		float: right
	}
	.wrapper {
		float: none !important
	}
}

@media (max-width: 480px) {
	body {
		font: 0.8em/1.5em Ubuntu, Segoe, Arial
	}
	.footer .pied_gauche {
		width: 100%;
		float: none;
	}
	.footer .pied_centre {
		width: 100%;
		float: none;
		margin-left: 0;
	}
	.footer .pied_droite {
		width: 100%;
		float: none;
	}
	.slogan_site {
		display: none
	}
	.logo_site {
		margin: 0 auto;
		display: block;
		text-align: center !important;
		float: none;
	}
	.bloc_contenu2 {
		padding: 0
	}
	.bloc_contenu2>img {
		max-width: 100% !important;
	}
	.ajustable {
		width: 98% !important;
		height: auto;
		border: 0;
	}
	.menu_select {
		display: block;
		width: 46%;
		margin: 1em auto 0 auto;
		float: none;
	}
	.wrapper {
		float: none !important
	}
}

@media (max-width: 320px) {
	body {
		font: 0.7em/1.5em Ubuntu, Segoe, Arial
	}
	.icone_agrandir {
		display: none
	}
	.spip_logos_right {
		float: right;
		margin: 0 0px 10px 24px;
		padding: 0;
		border: 0;
		width: 24%;
		height: auto;
	}
	.ajustable {
		width: 98% !important;
		height: auto;
		border: 0;
	}
	.wrapper {
		float: none !important
	}
}


/* Perso */

h3 {
	margin-top: 1.5em;
}

h3.intert {
	margin: 3em 0 1.5em 0;
	font-variant: small-caps;
	font-weight: normal;
	color: #404040;
	border-bottom: 1px solid #dbdbdb;
	width: 100%
}

h3.intert2 {
	margin: 0.5em 0 1.5em 0;
	font-variant: small-caps;
	font-weight: normal;
	color: #404040;
	border-bottom: 1px solid #dbdbdb;
	width: 100%
}

abbr.def {
	color: #5C5C5C;
	border-bottom: 0em dotted;
	cursor: help
}

.cadre {
	border: 1px solid #DBDBDB;
	padding: 1em 1em 1em 2em;
	text-align: left;
	box-shadow: 1px 1px 4px #DBDBDB;
	margin: 1.2em 3em 1.2em 1em;
	width: 68.5%;
}


/* end */

.fc-event,
.fc-event-dot {
	background-color: #415db8!important;
	border: 1px solid #3950a2!important;
}

.fc-event:hover,
.fc-event-dot:hover {
	background-color: #5173e5!important;
}

.fc-day-grid-event .fc-time {
	color: #fff !important;
}

.fc-title {
	color: #fff !important;
}

.datemaj {
	display: inline-block;
	float: right;
	font-size: 0.75em;
	margin-top: 1.3em;
}

.bloc_ac {
	float: left;
	width: 100%;
	/*margin-bottom: 2em;*/
}

.bloc_ac2 {
	float: left;
	width: 40%;
	margin-bottom: 2em;
	min-height: 220px;
	position: relative;
	padding: 2%;
	margin-right: 5px;
}

.bloc_ac2.a_voir {
	min-height: 20px;
	padding-left: 2em;
	width: 33%;
	border-left: 5px solid #dbdbdb;
	margin-left: 3em;
	font-size: .9em;
}

.la_suite2 {
	margin: 0 0 5% 0;
	padding: 1.5%;
	border: solid 0px #677821;
	border-radius: 4px;
	background: #3950a2;
	position: absolute;
	bottom: 1%;
}

.la_suite2:hover {
	background: #5072e2;
}

.container {
	display: flex;
	min-height: 110px;
	margin-top: .25em;
	flex-wrap: wrap;
	perspective-origin: 50% 50%;
}

.flexitem,
.flexinfo {
	width: 48%;
	min-height: 110px;
	margin: 0 auto;
	border-radius: 3px;
	box-shadow: 1px 1px 4px #6F6666;
	margin-bottom: .35em;
}

.flexinfo {
	box-shadow: 4px 5px 15px #b0acacab;
	border: 1px solid #E4E4E4;
	border-radius: 8px;
}

.flexinfo:hover {
	transition: all .5s ease-in-out;
	border: 1px solid #3950A2;
	box-shadow: 0px 0px 0px;
}

.flexitem1 {
	width: 98%;
	height: 100px;
	margin: auto;
	border-radius: 3px;
	box-shadow: 1px 1px 4px #6F6666;
	margin-bottom: .4em;
}

.flexitem2 {
	width: 50%;
	height: 120px;
	margin: auto;
	border-radius: 3px;
	box-shadow: 1px 1px 4px #6F6666;
}

.flexitem3 {
	/*width: 25%;*/
	margin: auto;
	/*width: 200px;*/
	height: 200px;
	margin-top: 10px;
	flex-basis: 155px;
	/*perspective: 800px;*/
	perspective-origin: 50% 50%;
	z-index: 120;
}

.flexitem a,
.flexitem1 a,
.flexitem2 a {
	color: white !important;
	text-shadow: #242424 1px 1px 0;
}

.flexinfo a {
	color: #3950A2 !important;
	/*text-shadow: #242424 1px 1px 0;*/
	hyphens:none;
}

.flexinfo a:hover {
	text-shadow: none;
	text-decoration: underline;
}

.flexitem a:hover,
.flexitem1 a:hover {
	background-color: transparent !important;
	color: white;
	text-shadow: #242424 1px 1px 0;
}

.spip-admin-bloc,
.spip-admin-float {
	right: 5% ! important;
	bottom: 0 ! important;
	top: unset ! important;
}

.row_first {
	border-bottom: 2px solid #777;
}
.qrcode {
  text-align: center;
}