/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/

body {
	margin: 0;
	padding: 0;
	background: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #3B3B3B;
}

h1, h2, h3 {
	margin: 0px;
	padding: 0px;
	letter-spacing: -2px;
	text-transform: uppercase;
	font-family: 'Arvo', serif;
	font-weight: normal;
	color: #0285CE;
}

h1 {
	font-size: 2em;
}

h2 {
	font-size: 2.4em;
}

h3 {
	font-size: 1.6em;
}

p, ul, ol {
	margin-top: 0;
	line-height: 180%;
}

ul, ol {
}

a {
	text-decoration: none;
	color: #0285CE;
}

a:hover {
}

/* Header */

#header-wrapper {
}

#header {
	clear: both;
	width: 1000px;
	margin: 0px auto;
}

/* Logo */

#logo {
	margin: 0px;
	padding: 30px 0px;
	color: #000000;
}

#logo h1, #logo p {
	margin: 0;
	padding: 0;
}

#logo h1 {
	margin: 0px;
	padding: 0px;
	text-transform: lowercase;
	font-size: 3.8em;
	color: #323030;
}

#logo h1 span {
	color: #0285CE;
}

#logo p {
	margin: 0px;
	padding: 0px;
	text-transform: uppercase;
	font-family: 'Arvo', serif;
	color: #3B3B3B;
}

#logo p a {
	color: #3B3B3B;
}

#logo a {
	border: none;
	background: none;
	text-decoration: none;
	color: #323030;
}

/* Search */

#search {
	width: 320px;
	height: 60px;
	padding: 0px;
}

#search form {
	margin: 0px;
	padding: 0px;
}

#search fieldset {
	margin: 0;
	padding: 0;
	border: none;
}

#search-text {
	width: 250px;
	outline: none;
	background: #F5F0E7;
	border: 1px solid #D7D0C0;
	padding: 10px;
	text-transform: lowercase;
	font: normal 14px Arial, Helvetica, sans-serif;
	color: #454545;
}

#search-submit {
	width: 62px;
	height: 22px;
	display: none;
	border: none;
	color: #FFFFFF;
}

/* Menu */

#menu-wrapper {
	overflow: hidden;
	height: 56px;
	background: #EDEDED;
}

#menu {
	width: 1000px;
	height: 55px;
	margin: 0px auto;
	padding: 0px;
}

#menu ul {
	margin: 0;
	padding: 0px;
	list-style: none;
	line-height: normal;
}

#menu li {
	float: left;
	border-right: 1px solid #FFFFFF;
}

#menu a {
	display: block;
	letter-spacing: 1px;
	line-height: 55px;
	padding: 0px 30px;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	font-family: 'Arvo', serif;
	font-size: 14px;
	font-weight: normal;
	color: #3B3B3B;
	border: none;
}

#menu a:hover, #menu .current_page_item a {
	background: #0193CC;
	text-decoration: none;
	color: #FFFFFF;
}

#menu .current_page_item a {
	background: #0193CC;
}

/* Page */

#page {
	overflow: hidden;
	width: 1000px;
	margin: 0px auto;
	padding: 30px 0px;
}

/* Content */

#content {
	float: right;
	width: 640px;
}

.post {
	margin-bottom: 15px;
	border-bottom: 1px dashed #D8D8D8;
}

.post-bgtop {
}

.post-bgbtm {
}

.post .title {
	height: 38px;
	margin-bottom: 10px;
	padding: 12px 0 0 0px;
	font-size: 32px;
}

.post .title a {
	border: none;
	color: #0285CE;
}

.post .meta {
	margin-bottom: 30px;
	padding: 5px 0px 15px 0px;
	text-align: left;
	font-weight: normal;
}

.post .meta .date {
	float: left;
}

.post .meta .posted {
	float: right;
}

.post .meta a {
}

.post .entry {
	padding: 0px 0px 20px 0px;
	padding-bottom: 20px;
	text-align: justify;
}

.links {
	height: 30px;
	padding: 30px 0px 0px 0px;
	font-size: 14px;
	font-weight: normal;
	color: #1C1C1C;
}

/* Sidebar */

#sidebar {
	float: left;
	width: 310px;
	margin: 0px;
	padding: 30px 0px 0px 0px;
	color: #787878;
}

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

#sidebar li {
	margin: 0;
	padding: 0;
}

#sidebar li ul {
	margin: 0px 0px;
	padding-bottom: 50px;
}

#sidebar li li {
	border-bottom: 1px dashed #D8D8D8;
	margin: 0px 0px;
	padding: 5px 0px;
	border-left: none;
}

#sidebar li li a {
	color: #3B3B3B;
}

#sidebar li li span {
	display: block;
	padding: 0;
	font-size: 11px;
	font-style: italic;
}

#sidebar h2 {
	padding-bottom: 20px;
	font-size: 1.8em;
	color: #0285CE;
}

#sidebar p {
	margin: 0px 0px 40px 0px;
	padding: 0px;
	text-align: justify;
}

#sidebar a {
	border: none;
}

#sidebar a:hover {
	text-decoration: underline;
}

/* Calendar */

#calendar {
}

#calendar_wrap {
	padding: 20px;
}

#calendar table {
	width: 100%;
}

#calendar tbody td {
	text-align: center;
}

#calendar #next {
	text-align: right;
}

/* Footer */

#footer {
	height: 50px;
	margin: 0 auto;
	padding: 0px 0 15px 0;
	background: #E9E9E9;
	border-top: 5px solid #D8D8D8;
	font-family: 'Arvo', serif;
}

#footer p {
	margin: 0;
	padding-top: 20px;
	line-height: normal;
	font-size: 12px;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-align: center;
	color: #A0A0A0;
}

#footer a {
	color: #8A8A8A;
}

#banner {
	width: 1000px;
	margin: 0px auto;
}

/** rajouté par moi **/

.alignleft, img.alignleft {
display: inline;
float: left;
margin-right: 10px;
}

.alignright, img.alignright {
display: inline;
float: right;
margin-left: 10px;
}

.aligncenter, img.aligncenter {
clear: both;
display: block;
margin-left: auto;
margin-right: auto;
}

img.alignleft, img.alignright, img.aligncenter {
margin-bottom: 12px;
}
/* 
Generic Styling, for Desktops/Laptops 
*/
table { 
  width: 100%; 
  border-collapse: collapse; 
}
/* Zebra striping */
tr:nth-of-type(odd) { 
  background: #ddd; 
}
th { 
  background: #333; 
  color: white; 
  font-weight: bold; 
}
td, th { 
  padding: 6px; 
  border: 1px solid #ccc; 
  text-align: left; 
}

/* ===== RESPONSIVE-2026 START : contenu pleine largeur, colonne menu (#sidebar) en pied 3 colonnes ===== */
*,*::before,*::after{box-sizing:border-box;}
img{max-width:100%;height:auto;}
#menu,#menu-wrapper > #menu,#page,#footer{width:auto !important;max-width:1000px !important;margin:0 auto !important;}
#menu{height:auto !important;}
#page{width:auto !important;max-width:1000px !important;}
#page-bgtop,#page-bgbtm{overflow:visible !important;}
#page-bgbtm{display:flex;flex-direction:column;}
#content{order:1;float:none !important;width:auto !important;padding:0 14px !important;}
#sidebar{order:2;float:none !important;width:auto !important;clear:both;
  margin:18px 0 0 0 !important;padding:20px !important;background:#eef3e6;border-top:3px solid #7aa63b;
  -webkit-columns:3;-moz-columns:3;columns:3;column-gap:26px;color:#555 !important;}
#sidebar>*{-webkit-column-break-inside:avoid;break-inside:avoid;}
#sidebar h1,#sidebar h2,#sidebar h3,#sidebar h4{-webkit-column-span:all;column-span:all;}
#footer{height:auto !important;}
@media (max-width:820px){#sidebar{-webkit-columns:2;-moz-columns:2;columns:2;}}
@media (max-width:520px){#sidebar{-webkit-columns:1;-moz-columns:1;columns:1;}}
/* ===== RESPONSIVE-2026 END ===== */


/* ===== RESPONSIVE-2026-SIDEBAR3 START : contenu pleine largeur, menu lateral (#sidebar) en pied 3 colonnes ===== */
*,*::before,*::after{box-sizing:border-box;}
img{max-width:100%;height:auto;}
#header,#menu,#page{width:auto !important;max-width:1000px !important;margin-left:auto !important;margin-right:auto !important;}
#menu ul{display:flex;flex-wrap:wrap;justify-content:center;}
#menu li{float:none !important;}
#page-bgtop,#page-bgbtm{width:auto !important;}
#page-bgbtm{display:flex;flex-direction:column;}
#content{order:1;float:none !important;width:auto !important;padding-left:20px !important;padding-right:20px !important;}
#sidebar{order:2;float:none !important;width:auto !important;margin:24px 0 0 0 !important;padding:24px 20px !important;
  background:#eef3f6;border-top:3px solid #0193CC;
  -webkit-columns:3;-moz-columns:3;columns:3;column-gap:28px;}
#sidebar h2{-webkit-column-span:all;column-span:all;margin-top:0;}
#sidebar ul,#sidebar li,#sidebar p{-webkit-column-break-inside:avoid;break-inside:avoid;}
#footer{width:auto !important;}
@media (max-width:800px){#sidebar{-webkit-columns:2;-moz-columns:2;columns:2;}}
@media (max-width:480px){#sidebar{-webkit-columns:1;-moz-columns:1;columns:1;}#menu a{padding:0 15px !important;}}
/* ===== RESPONSIVE-2026 END ===== */


/* ==================================================================
   PIED DE PAGE SUR TROIS COLONNES

   Ce site portait une ou plusieurs barres laterales a largeur fixe :
   sur telephone, elles poussaient le contenu hors de l'ecran. Leur
   contenu est desormais dans le pied de page, reparti sur trois
   colonnes qui se replient l'une sous l'autre quand la place manque.
   ================================================================== */

*, *::before, *::after { box-sizing: border-box; }
img, iframe, video, table { max-width: 100%; }
img { height: auto; }

.pied-3col {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 0 28px;
}
.pied-col {
	flex: 1 1 240px;
	min-width: 0;
}
.pied-col > *:first-child { margin-top: 0; }

/* la colonne de contenu reprend toute la largeur */
#content {
	float: none;
	width: auto;
	margin-left: 0;
	margin-right: 0;
}

/* les conteneurs gardent leur largeur, sans la subir */
#content {
	width: auto;
	max-width: 1000px;
}
#page {
	width: auto;
	max-width: 1000px;
}

/* le pied ajoute aux pages qui n'en avaient pas */
.pied-ajoute {
	width: auto;
	max-width: 1000px;
	margin: 24px auto 0 auto;
	padding: 18px 10px;
	clear: both;
}

@media screen and (max-width: 760px) {
	.pied-col { flex: 1 1 100%; }
}

/* Les colonnes suivent le cadre du site.
   Posees dans le pied, elles en prenaient toute la largeur, jusqu'au
   bord de la fenetre, tandis que le reste de la page tient dans un
   cadre centre. On leur donne ce meme cadre. */
.pied-3col {
	width: 1000px;
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
}

/* Le pied avait une hauteur fixe, prevue pour une seule ligne de
   mention legale : les colonnes en debordaient, et leur texte clair
   se retrouvait sur le blanc de la page. */
#footer {
	height: auto;
	min-height: 50px;
}

/* Les blocs restes larges de force.
   La passe responsive n'avait desserre que les conteneurs
   menant au texte. Ceux-ci gardaient leur largeur fixe, et
   un seul suffit a faire deborder la page sur telephone. */
#banner {
	max-width: 100%;
}