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

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

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

body {
	text-align: center;
	font: normal 1.05em/1.4 Arial, Helvetica, sans-serif;
	background: #FFF url(../images/fond-site.jpg) no-repeat center -20px;
}
.page {
	position: relative;
/*	width: 1002px;
*/	margin: 0 auto;
	padding: 0px 20px;
	text-align: left;
}



.foot{
	background: #f3a747;
}

.foot h3{
	color:#FFF;
}


.interieur{
	margin:0 auto;
	width:980px;
	text-align:left;
}
.interieur2{
	margin:0 auto;
	width:960px;
	text-align:left;
}


.header {
	height:158px;
}
.main {
	overflow:hidden;
	width:980px;
	margin:0 auto;
	padding:20px 0;
}
.footer {
	clear: both;
	padding: 1.5em 0 1em;
	margin:0 auto;
	width:982px;
	text-align:center;
	background: url(../images/ombre-inverse.png) no-repeat center top;
}

.wrapper { clear: both;  overflow: hidden; }
.content { min-height: 250px;/* float:left; width:75%;*/ }
.aside {
	float: left;
	width: 36%;
	overflow: hidden;
	text-align:left;
}
.texte {
	float: right;
	width: 60%;
	overflow: hidden;
	text-align:left;
}
h1{
	font-weight:700;
}


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

.header { padding-bottom: 0; }
.header #logo {  margin: 0; line-height: 1; font-weight: normal; float:left; width:50%;  }
.header #logo,
.header #logo a,
.header #logo a:hover { background: transparent; text-decoration: none; color: #222; }
.header #slogan { margin: 0; }
.header img {
	margin-top:10px;
	background: #FFF;
	padding: 10px;
}

.slogan{
	display:inline-block;
	padding-top:0.6em;
	font-size:1.5em;
	line-height:1;
	padding-left:0.5em;
}


.nav {
	font-size:110%;
	float:right;
	padding-top:90px;
	text-transform: uppercase;
}
.nav ul {}
.nav ul li { display:inline;}
.nav ul li a {
	float: left;
	display: block;
	text-decoration: none;
	padding: 0.5em 1em;
	color:#666;
	margin-right:0.2em;
	background: #FFF no-repeat right center;
}
.nav ul li.on a {
	color: #FFF;
	font-weight: normal;
	background: #FF8859;
}
.nav ul li a:focus,
.nav ul li a:hover,
.nav ul li a:active { color: #FFF;	background: #FF8859;
 }


.footer .colophon { height: 40px; margin: 0; }
.footer .generator { float: right; }
.footer .generator a { padding: 0; background: none; }



/* Tiers
------------------------------------------ */
.large{
	margin:0 -1%;
}
.tiers{
	width:31.1%;
	display:inline-block;
	text-align:left;
	float:left;
	margin: 1.1%;
	
}
.tiers img{
	width:100%;
	height:auto;
}
.tiers img:hover{
    -khtml-opacity:0.5;
    -moz-opacity : 0.5;
    -ms-filter: "alpha(opacity=50)";
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);
    filter : alpha(opacity=50);
    opacity : 0.5;
}


.tiers a{
	display:block;
}
.tiers a:hover{
}

.tiers h3{
	font-weight:400;
	text-transform: uppercase;
	margin: 0px 0px 0.5em;
	padding: 0px;
	color:#999;
}


.tiers .spip_logos{
	display:block;
	float:none;
	margin:0;
	margin-bottom:0px;
	background-color:#FFF;
}

/* bas
------------------------------------------ */

.informations{
	float:left;
	width:30%;
	padding:1em 0;
}
.social{
	float:left;
	width:20%;
	padding:1em 0;
	margin-left:2%;
}

.social img{
	margin-right:10px;
}

.social img:hover{
    -khtml-opacity:0.5;
    -moz-opacity : 0.5;
    -ms-filter: "alpha(opacity=50)";
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);
    filter : alpha(opacity=50);
    opacity : 0.5;
}


.contact{
	float:right;
	width:40%;
		padding:1em 0;

}

/* Texte
------------------------------------------ */

.content img {
	max-width: 100%;
	height: auto;
}
.cartouche{
	margin-top:0em;
}

.cartouche h1 {
	color: #FFF;
	font-weight: 700;
	background: #FF8859;
	text-transform: uppercase;
	padding: 0.2em 0.5em;
}

.chapo {
	color:#666;
	font-size:1.1em;
	text-transform: uppercase;
}
	
h3 {
	color:#090;
	font-weight:700;
}



#banner{
	margin:0 auto;
}



/* FORMULAIRES */

.texte .formulaire_formidable ul{
	padding:0.5em 1em;
	overflow:auto;
	margin-left:0;
	background: #F8F8F8;
	margin-bottom:0.5em;
	font-size:90%;
}

.texte .formulaire_formidable li{
	list-style:none;
	padding:1em 0;
	margin:0;
	clear:both;
}
.texte .formulaire_formidable li.explication p{
	margin-bottom:0;
}


.formulaire_formidable .content input.text, .choix {
}
.formulaire_formidable input.text, .formulaire_formidable textarea {
    -moz-box-sizing: border-box;
    background-color: #FFF;
    border: 0px solid #CCC;
	margin-bottom:0.2em;
	padding:3px;

}

.formulaire_spip li.editer_input_1, .formulaire_spip li.editer_input_2{
	float:left;
	width:45%;
	margin-right:4%;
	clear:none;
}

.formulaire_formidable textarea {
	height:4em;
	}

.formulaire_formidable label{
	padding-top:0em;
}
label .obligatoire{
	color:#F00;
	display:none;
}

.choix label{
	display:inline;
	float:none;
}
.erreur_message {
    display: block;
    float: right;
}
.explication{
	margin-left:40%;
}

.formulaire_formidable .reponse_formulaire_ok {
	background: #E7E7E7 url(none) repeat scroll 0 0;
	border-color: #CCC;
	color: #264409;
	margin-bottom:1.5em;
}

.formulaire_spip .boutons input,
.formulaire_spip .boutons button {
	text-transform: uppercase;
	color: #FFF;
	background: #666;
	padding: 0.2em 1em;
	border-style: none;
	font-family: 'Economica', sans-serif;
	font-weight:700;
}
.formulaire_spip .boutons input:hover,
.formulaire_spip .boutons button:hover {
	background: #000;
}



/* 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; padding: auto !important; }

.page { margin: 0; padding: 5%; }

/* 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; }

}

/* end */