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

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

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

/*----------------------------------
	 couleurs du site:
#6C0277; /*pourpre.com zinzolin*/

/*
#CFA0E9; /*pourpre.com parme*/

/*
#B666D2; /*pourpre.com lilas*/

/*
#D2CAEC; /*pourpre.com gris de lin*/


body { text-align: center; background: #FFF url(img/background.png); border-top: 5px solid; }
.page { position: relative; width: 1024px; margin: 0 auto; padding: 0 0 50px 0/* 0 1.5em 50px 1.5em */; text-align: left;

/*
	box-shadow: -1px 2px 5px 1px rgba(0, 0, 0, 0.7),
            -1px 2px 20px rgba(255, 255, 255, 0.6) inset;
*/  }

.header {}




.main { padding: 1.5em 1.5em;
	text-align: justify; }

/*
.codeAccelere {border: 1px solid #CFA0E9; /*pourpre.com parme*/
	/*padding: 3px;
	margin-bottom: 5px;}

.codeAccelere h1 {
	font-size: 1.1em;
    line-height: 1em;
    text-align: center;
    margin-bottom: 0;
}


.codeAccelere p {margin-bottom: 0;}
*/


/* .cartouche div.logo {width: 90px; float: left; margin: 0px 5px 5px 0px; font-size: 10px;} */
.logoGrand div.logo {width: 125px; float: left; margin: 0px 5px 5px 0px; font-size: 10px;}
.logoMoyen div.logo {width: 100px; float: left; margin: 0px 5px 5px 0px; font-size: 10px;}
.logoPetit div.logo {width: 55px; float: left; margin: 0px 5px 5px 0px; font-size: 10px;}





.datesSessions {
/* 	background-color: #D2CAEC; */ /*pourpre.com gris de lin*/
    width: 100%;
/*
    height: 96px;
    overflow: scroll;
*/
    padding: 5px;}
    
.ladate {border-bottom: 4px double #CFA0E9; /*pourpre.com parme*/
	margin-bottom: 5px;
/* 	font-size: 85%; */}

.Actu {font-size: .75em;
	margin-bottom: 10px;
	border: 1px solid gray;
}


.teteEncartActu {width: 100%;
	height: 2em;
	line-height: 2em;
	background-color: #6C0277; /*pourpre.com zinzolin*/
	font-family: 'Open Sans', sans-serif;
	color: #fff;
	padding-left: 10px;
}

.corpsEncartActu {padding: 0 5px 5px 5px;}
	

.paddingSiCarreaux {padding-left: 1.5em;}



.mainCarreaux { padding: 1.5em 0; }
.footer { clear: both; padding: 1.5em 1.5em; border-top: 2px solid; }

/*.wrapper { clear: both; float: left; width: 65%/* 70% *//*; overflow: hidden; }*/
.wrapper { clear: both; float: left; width: 100%; overflow: hidden; }
.page_rubrique .wrapper { clear: both; float: left; width: 100%; overflow: hidden; }
.content { min-height: 350px; }
.aside { float: right; width: 30%/* 25% */; overflow: hidden; min-height: 100px; padding-bottom: 10px;}


.EncartMobile {display: none;}

.carreaux {width: 1023px; margin: 0 auto;}

.cartouche div.logo {width: 90px; height: 90px; float: left; margin: 0px 5px 5px 0px; font-size: 10px;}

.carreaux div.logo {width: 341px; height: 341px; float: left;
/* 	le background est pour le cas où il n'y a pas encore de logo à l'article ou à la rubrique. */
	background: aqua; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left top, aqua, #cfa0e9); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(bottom right, aqua, #cfa0e9); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(bottom right, aqua, #cfa0e9); /* For Firefox 3.6 to 15 */
  background: linear-gradient(to bottom right, aqua, #cfa0e9); /* Standard syntax */
  }
  
.carreaux div strong {font-weight: bold; font-size: 1.2em; padding-top: 2px;}

.carreauxEquipes {width: 508px; /* (1024/2) - (2 × 2) */ height: 172px; border: #CFA0E9 /*pourpre.com parme*/ 1px solid;
	padding: 1em; margin: 2px; float: left;}



.carreauxEquipes div.logo {width: 136px; height: 136px; float: left; margin: 0px 5px 5px 0px; font-size: 10px;}




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

.header { /* padding-bottom: 1.5em; */ /* padding-right: 30%; */ /* border-bottom: 1px solid; */
/*
	background-image:url("./image_entete/fond_entete2015.jpg");
	background-repeat:no-repeat;
	background-position:center top;
	height: 250px;
*/ }
.header #logo { display: block; margin: 0; line-height: 1; font-weight: bold;
	margin-bottom: 5px;  }
.header #logo,
.header #logo a,
.header #logo a:hover { background: transparent; text-decoration: none; color: ForestGreen; }

.header h1 {padding-top: 10px;}

.header #logo, .titre_logohome div.logo, .header #slogan, .bandeauVignettes div.logo {float: left;}

.header div.logo {width: 150px; /* height: 150px; */
	margin-top: 14px;
}

.bandeauVignettes div.logo {width: 850px;/*  height: 85px; */
	margin-top: 0;}


.header #slogan { margin: 0; }

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

.menu_lang_tranparent {background-color: rgba(255, 255, 255, 0.5); width: 160px; padding: 1px; margin-left: 70px;}

.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.on 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; }

#formulaire_recherche { position: relative; float:left; width:/* 380px */auto; /* height:30px; */ border: 0; }

.formulaire_recherche input.submit {border: 1px solid #fff; border-radius: 4px; background-color: #3A9D23; /*pourpre.com vert "gazon"*/ margin-left: 10px; color: #fff; }
.formulaire_recherche input.submit:hover { background-color: #82C46C; /*pourpre.com vert "amande"*/ }



.footer .colophon { float: left; height: /* 40px */auto; width: 100%; margin: 0; }
.footer .generator { float: right; }
.footer .generator a { padding: 0; background: none; }

.fond_slick {width: 100%;}

div.slickTitre {text-align: center; width: 100%;}

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

.sb-toggle-left{display:none;}

@media only screen and (max-width: 900px) {
	
	.page { position: relative; width: 100%; padding-left: 5px; padding-right: 5px;  }
	
	.header h1 {font-size: 1.8em;}
	
	.bandeauVignettes div.logo {width: 600px;}
	
	.footer {width: 100%;}
	
	.carreaux {width: 770px;}
	
	.carreaux div.logo {width: 250px; height: 250px;}
	
	.carreauxEquipes {width: 444px; /* (900/2) - (2 × 2) = 446 */ height: 172px; /* border: #CFA0E9 */ /*pourpre.com parme*/ /* 1px solid; padding: 1em; margin: 2px; float: left; */}
	
/* 	.carreauxEquipes div.logo {width: 136px; height: 136px; float: left; font-size: 10px;} */
	
	
	
}
@media only screen and (max-width: 640px) {
	
	
	
	.sb-toggle-left{display:block!important;}
	#nav, .sf-menu {display: none;}
	
	.header div.logo {
    width: 100px;
/*     height: 150px; */
    margin-bottom: 0; *
    }
	
	
	.header h1 {font-size: 1.2em; padding-top: 0;}
	
	.bandeauVignettes div.logo {width: 100%;}
	
	.carreaux {display: none;}
	
	.cartouche h1 {font-size: 1.4em;}
	
	
	
	.carreauxEquipes {width: 100%; height: 172px; margin: 0; /* float: left; */}

	
	.EncartMobile {
		display: block;
		width: 100%;
		min-height: 110px;
		border:1px solid #CFA0E9; /*pourpre.com parme*/
		padding: 10px;}
		
	.EncartMobile div.logo {width: 90px; height: 90px; float: left;
/* 	le background est pour le cas où il n'y a pas encore de logo à l'article ou à la rubrique. */
	background: aqua; /* For browsers that do not support gradients */
	background: -webkit-linear-gradient(left top, aqua, #cfa0e9); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(bottom right, aqua, #cfa0e9); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(bottom right, aqua, #cfa0e9); /* For Firefox 3.6 to 15 */
	background: linear-gradient(to bottom right, aqua, #cfa0e9); /* Standard syntax */}
	
	
	.EncartMobile h2 {
		margin: 20px 10px 0 103px;
		line-height: 26px;
		text-align: center;}
	

	
/* 	.header #slogan {min-height: 100px;} */
	

/* passer tous les elements de largeur fixe en largeur automatique */
body,
.page,
.header,
.main,
.footer,
.wrapper,
.content,
.aside { width: 100%; margin: auto !important; }

.page { margin: 0; padding: 2%; }
.main {padding: 0;}
.content {min-height: 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; } */
/* #rech_footer{display: none;}  du layout Pole2014*/
#rech_slidebars label{display: none;}
.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 */

/* facebook widget */
.fb-page span {width: 100%;}