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

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

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

/* Elements principaux
------------------------------------------ */

body { text-align: center; background:/*#d7e6f8*/ #EBEFF2!important;}
.page { position: relative; width: 1000px; max-width:95%; margin:auto; padding:1em; text-align: left; background-color:white; }

.header {}
.main { padding: 1.5em 0; }
.footer { clear: both; padding: 1em 0 0; margin:1em 0 0 0; border-top:1px solid #999; }

/* largeur calculee du wrapper: 960*70%  = 672px */
.wrapper { clear: both; float: left; width: /*70%;*/77%;/* overflow: hidden;*/ }
.content { min-height: 350px; }
/* largeur calculee du aside: 672px / 3 = 224px = 23.333 %*/
.aside { float: right; width: /*25%;*/20%; /*overflow: hidden;*/ }    
  
/* Entete et barre de navigation
------------------------------------------ */
.header { display:block;height:130px; width:100%; 
	 background-image:url('img/banniere2.jpg');
	 background-repeat: no-repeat;
}
.header img{float:left;margin:3px 0px 0px 0px;}
.header a{background:transparent;}
.header a:hover img{opacity: 0;}


h1.accueil  { /* présence du h1 dans le sommaire */
	visibility: hidden;
	margin:-19px 0;padding:0;
}

input#recherche{width:100px;}

.zone_rapide{position:absolute;top:115px;right:30px;font-size:0.4em;width:auto;}
.acces_rapide{display:none;}

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

.nav {}
.nav li {display:inline;}
.nav li a { display: inline-block; padding: 0.25em 0.5em; margin: 0 0.25em 0.5em 0;border-radius: 0.25em;  text-decoration: none;  background: #f0f0f0; color: Navy;font-weight:bold; }
.nav li.on a { background:Yellow; color:#000; font-weight: normal; }
.nav li a:focus,
.nav li a:hover,
.nav li a:active { background: #000; color:#fff; }
 
footer a{color: #000!important;padding:3px;}
footer a:hover{background: #000!important; color:#FFF!important;/*padding:2px;*/}
.footer .colophon { float: left; height: 40px; width: 70%; margin: 0; font-size:0.75em;}
.footer .generator { float: right; }
.footer .generator a { padding: 0;color:Navy!important; }
.footer .generator a:hover  {background:transparent!important;color:#c41558!important;}

td{font-size:70%;}


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

/* largeur maximum 767px */
@media (max-width: 767px) {
	body {   	width: 100%;		padding: 0 20px;	}
	.page {  	width: 100%;  	max-width: none;}
}
 
/* largeur maximum 640px */
@media (max-width: 640px) {
     /* layout */
    .wrapper,
    .content,
    .aside { width: 100%;}
    .content,
    .aside { clear: both; float: none; width: 100%; }

    /* Passer a une seule colonne (a appliquer aux elements multi-colonnes) */
    .nav ul li a { float: none; border: 0; }
    .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; }

}


/* fin */