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

   layout.css
   Disposition des blocs principaux
   
-------------------------------------------------------------- */

* {  box-sizing:border-box;
	-webkit-box-sizing:border-box; 
	-moz-box-sizing:border-box; 
 }



::before, ::after {

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
box-sizing: border-box;}

::placeholder {
    color: #4a6776; opacity: 1;font-weight: 600;
}

.wrapper::before,.wrapper::after ,.page::before ,.page::after,.cartouche::after ,.cartouche::before {    content: "";clear: both;display: table;}

.image_responsive {
    width:100%;
    height:auto;
    vertical-align:middle;
}

img {
    max-width:100%;
    height:auto;
    vertical-align:middle;
    border:0;
  
}
.img-responsive, .thumbnail > img, .thumbnail a > img, .carousel-inner > .item > img, .carousel-inner > .item > a > img {
    display: block;
    max-width: 100%;
    height: auto;
}



 
.hmin  {min-height:200px;}

@media only screen and (min-width:768px) {.hmin  {min-height:auto;}}

.cadrerimage 
{ display:flex; /* contexte sur le parent */
  flex-direction:column; /* direction d'affichage verticale */
  justify-content:center; /* alignement vertical */text-align:center;
  
  }
  



/* Alignements */
.tgauche { text-align: left  }
.tdroite { text-align: right }
.left { float: left !important; }
.right { float: right !important; }
.block {display:block}
.nofloat{float:none!important;}
@media (max-width: 768px) {
	.mdfloatnone{float:none;}
}

.justify{text-align:justify;}
.clear {clear: both; text-align:center;}

.bottom-min{padding-bottom:40px;}



.pad20{padding:20px}
.padres20{padding:5px;}
.padres30{padding:5px!important}
.padres40{padding:10px;}

.mh20{margin-top:20px;}
.part_un{padding:0 5% 0 5%!important;}
.part_deux{padding:0 3% 0 3%!important;}
@media (min-width: 480px) {
	.padres20{padding:20px}
	.padres30{padding:30px!important}
	.padres40{padding:50px}
}
iframe{
	margin-bottom:20px;text-align:center;margin-left:auto;margin-right:auto;max-width:100%;
	}
	
@media (max-width: 640px) {
  iframe {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 100% !important;
    float: none;
  }
}	
.frapdf
 { 
   max-height: calc(100vw *1.294117647)!important; /* page A4 mise au format */
 }
 
 
.container-pdf{
  position: relative;
  width: 100vw;margin:auto;
  overflow: hidden;
  padding-top:70.07%;    /*ratiopage A4* 16:9 Aspect Ratio  =56.25%*/
}

.responsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border: none;
}


/*********************************/
/* equiv section-inner */
	
pre { white-space:pre-wrap; } /* pour firefox et les <pre> */

body,.page,.header,.main,.main_3,.content { width:auto !important; margin:auto !important;text-align:center; }
body {line-height:1}
.page  { box-sizing :border-box;	position: relative;width:100%;padding:0!important;margin: 0;}
.main,.main_3  {	clear:both;	width:100%;	text-align:center;    padding: 20px 0 20px 0;  margin-top: 0px;margin-right: auto;	margin-bottom: 0px;	margin-left: auto;
}
.content{padding:0px 10px 20px 10px;}
.aside  {	width:100%;padding-right: 5px; padding-left: 5px}
.aside img , .aside  .spip_logos {float:none}

@media only screen and (min-width: 1024px) {
.aside {	overflow: hidden;	text-align:center;	margin-left:auto;	margin-right:auto;	display: block;	width:100%;}
}

@media only screen and (min-width: 480px) {
.content {	text-align:center;padding:1% 30px 3% 30px ;}
.aside {	overflow: hidden;	text-align:center;	margin-left:auto;	margin-right:auto;	display: block;	width:100%;}

}

@media only screen and (min-width: 768px) {
.aside {overflow: hidden;	text-align:center;	margin-left:auto;	margin-right:auto;	display: block;	width:100%;}
.aside img , .aside  .spip_logos {float:none;}
.wrapper {clear:none;float:none;padding:30px}
.main {padding:30px!important}
.main_3{padding:30px 0 30px 0!important;}
.wrap2{padding:30px}  .wrap3{padding:30px}
.aside h2{font-size: 1em;}

 /* passer tous les elements de largeur fixe en largeur automatique */
body,.page,.header,.main,.content { width:auto !important; margin:auto!important;text-align:center; }
header,.header{margin-bottom:20px}
}


.footer {
	clear: both; 
	/*padding: 1.5em 1.5em 2% 1.5em; */
	width:100%;height:auto;text-align:center;font-family: 'Roboto', sans-serif;font-size: 16px;-webkit-font-smoothing: antialiased;
	padding-top: 5px;	border-top-width: 12px;	border-top-style: solid;border-top-color: #a90303;
	background:#e9e9e9;
    }
	.sidebar .widget {padding: 30px;border-top: 1px solid #EEE;}
/* pour les colonnes */
.padcentre{padding:0 5% 0 5%!important} 
.pr30{padding-right:30px!important}
.pl30{padding-left :30px!important}
.pl20{padding-left :20px}
.pr20{padding-right:20px}
@media (max-width: 768px) { .pl20,.pr20,.pm20{padding:20px!important;}}
@media (max-width:992px) {	.padcentre{padding:20px!important;} }
@media (max-width: 800px) {
	/* footer */
	.footer .one-third { width: 47.5%; }
	.column-3 { float:none;text-align:center; margin-left:auto;margin-right:auto; width:90%;}
	.footer .section-inner {	max-width: 95%!important; 	}
	.credits  span {display:inline-block}
}


div.lebloc{ display: inline-block;vertical-align: top;}
div.lebloc2{vertical-align: middle;display: inline-block;}
.lebloc2{	vertical-align: middle;display: inline-block;}

.sm {box-sizing :border-box;width:auto; }
/* plan du site */
#plan h2 {text-align:center;background:#CCC;}
#plan h3 {color:#7088e6; text-decoration: underline;}
#plan h3::before  {content:"--> "}


/* Entete et barre de navigation
------------------------------------------ */
/*  fleche vers le  haut de page */
.tothetop { /* fleche de retour en haut de page */
    position: fixed;right:0;bottom:0;margin: 0;
    z-index: 1010;margin-right:5px;margin-bottom:5px;
	-webkit-opacity: 0.8;opacity: 0.8;  
  }	
  
  a.tothetop:hover {opacity: 0.4;  }
 #header{margin-bottom:40px;}
.header {
    width:100%;
	margin-left:auto;text-align:center;	margin-right:auto;margin-bottom:20px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0.5em;
	padding-left: 0px;
}

.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: #222; }
.header #slogan { margin: 0; }



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


/*.................FOOTER PIED DE PAGE *******************************/
 .footer{	font-family:  Georgia, Arial,  Times New Roman, Times,serif; font-size:18px }
.footer .colophon {
	float: none;	width: 100%;		padding-bottom:10px;	text-align:center;margin-left:auto;margin-right:auto;}
.footer .generator   { float: right; }
.footer .generator a { padding: 0; background: none; }
.footer .corp {text-align:center;width:100%;display:block;box-sizing :border-box; margin:auto;}
.footer .lasection  {vertical-align:middle; 
	width:auto;
	box-sizing :border-box; 
	display:inline-block;
	text-align:left; 
	margin-top: 2px;
	margin-right: 15px;
	margin-bottom:10px;
	margin-left:15px;
}

.footer .lasection   hr {background:#a90303;}


.footer    spip_logos,.footer .adapt-img-wrapper {
	padding:0px; max-width: 100%;
	text-align:center;
	vertical-align:middle;
	float:none;margin-left:auto;margin-right:auto;
}
.footer img {max-width:100%;height:auto;width:auto;}
.footer h2 {text-shadow:none;text-align:center;margin:auto	;font-size: 1em;} 
.footer h3{
font-family: 'Roboto Slab', sans-serif;font-weight: 700;text-transform: uppercase; margin-bottom: 20px;letter-spacing: 1px;font-size: 0.8em;text-align:center;margin:auto;font-style: normal;
}
.footer a {
	text-decoration: none;opacity: 1;font-weight:normal
}
.footer a:hover{
	opacity: 0.7;text-decoration: none;
}


.credits a {opacity: 0.9}
/* Widget search --------------------------------------- */


.wrapper .searchform,
.footer .searchform { position: relative; }

.wrapper .searchform .s,
.footer .searchform .s {
	width: 100%;
	padding: 16px 55px 16px 20px;
	border: none;
	margin: 0;
	background: #ddd;
	color: #fff;
	border-radius: 3px;
	font-family: 'Roboto', sans-serif;
	font-size: 0.9em;
	-webkit-font-smoothing: antialiased;
}

.wrapper .searchform .s:focus,
.footer .searchform .s:focus { 
	background-color: #2B3542; 
	outline: none;
}

.wrapper .searchform .searchsubmit,
.footer .searchform .searchsubmit {
	
	height: 36px;
	width: 36px;
	border: none;
	position: absolute;
	top: 50%;
	margin-top: -18px;
	right: 10px;
	text-indent: -9999px;
	background: url(images/icons/1x/spyglass-g.png) no-repeat center;
	background-size: 24px auto;
}

.wrapper .searchform .searchsubmit:hover,
.footer .searchform .searchsubmit:hover {
	cursor: pointer;
	background-image: url(images/icons/1x/spyglass-c.png);
}




/*******************************************************************/
/* integration depuis code youtube, vimeo etc  responsive <div class="video-container"> dans un article */
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;max-width:100%;

}
/* si video inclus a la main */
/* taille maximum ajouter un <div class="video-wrapper"><div class="video-container">*/
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;max-width:100%;
    height: 100%;
}
/**rajouter pur pb video filmora */
.spip_document_video
{     max-width:100%;    }
.video-intrinsic-wrapper {text-align:center;margin-left:auto;margin-right:auto;}
/* fin rajout*/


	  


.hauteurfixe{	height:50px;min-height:50px;overflow:hidden;}
.hauteurfixe60{	height:60px;min-height:60px;overflow:hidden;}
.hauteurfixe_2{	height:50px;min-height:50px;overflow:hidden;margin-top:10px;margin-bottom:10px;}
.hauteurfixe_3{	height:60px;min-height:60px;overflow:hidden;margin-top:10px;margin-bottom:10px;}
.tgrid3 .hauteurfixe,.tgrid4 .hauteurfixe{	height:60px;min-height:60px;}

/* n colonnes et plus */
.grid {overflow: hidden;text-align:center;margin-top:1em;margin-bottom:1em; width:100%;}
.grid > * { text-align:center;}
.grid > *  > * {display:inline-block;vertical-align: top;text-align:center;}
div.lebloc{ display:inline-block;vertical-align: top;}
div.lebloc2{	vertical-align: middle;display:inline-block;}
.lebloc2{	vertical-align: middle;display:inline-block;}
:root .grid {  font-size: 0;}
:root .grid > * > * {   font-size:1rem;}

/* Opera hack */
.opera:-o-prefocus,
.grid > * {
  word-spacing:-0.43em;
}
.grid ul.spip,.grid ol.spip { margin-left: 5px; }
.grid ul.spip    { list-style-type: none; }
.grid ul.spip    { list-style-type: none; }
.grid li ul.spip { list-style-type: disc; }

[class*="grid-"] > *  {margin-left:auto;margin-right:auto;text-align:center;/*margin-bottom:10px;*/}
.grid-1 > *, .grid-0 > * { width: 100%;}
.grid-2 > * { width: 50%;}
.grid-3 > * { width: 33%;}
.grid-4 > * { width: 25%;}
.grid-5 > * { width: 20%;}
.grid-6 > * { width: 16%;}


.grid > *  img,.grid > *  img  .adapt-img-wrapper {
	text-align:center;
	margin:auto;
	float: none !important;
	/*width: 100%;*/
	max-width:100%;
	clear: none;
	vertical-align:middle;
	box-sizing :border-box;
	 }

.tgrid0,.tgrid1,.aside .tgrid0,.aside .tgrid1,.aside .tgrid2,.aside .tgrid3,.aside .tgrid4,.aside .tgrid5,.aside .tgrid6
{
	width:100%;
	padding-top:0px;
	padding-bottom:0px;margin-bottom:40px!important;
	
	
}
.tgrid2,.tgrid3,.tgrid4,.tgrid5,.tgrid6
{
	width:95%;
	padding-top:0px;
	padding-bottom:0px;margin-bottom:40px!important;
	
}
.tgrid1 
{
	margin-bottom:20px;
	
}
.tgrid0 img,.tgrid1 img ,.tgrid2 img,.tgrid3 img ,.tgrid4 img,.tgrid5 img,.tgrid6 img,
.tgrid0  .adapt-img-wrapper,.tgrid1  .adapt-img-wrapper ,.tgrid2  .adapt-img-wrapper,.tgrid3  .adapt-img-wrapper ,.tgrid4  .adapt-img-wrapper,.tgrid5  .adapt-img-wrapper,.tgrid6  .adapt-img-wrapper
{
	overflow: hidden;/*width:100%;*/max-width:100%;
	
}
/*
.aside .tgrid1,.aside .tgrid0{	width:100%;}*/
/*[class*="tgrid"] h2 {text-shadow: none;	overflow:hidden;font-weight: bold;font-variant: small-caps;font-style:normal;} */ 


.tgrid2  h2{font-size:90%;}   .tgrid3  h2{font-size:88%;}  .tgrid4  h2,.tgrid5  h2{font-size:80%;} 
.tgrid6 h2{font-size:70%;} 
  /* pour les breves */
.bgrid2,.bgrid3,.bgrid4,.bgrid5,.bgrid6
{
  width:85%;padding-top:10px;padding-bottom:10px;
}
.l3 .grid-1 > *{width:95%!important; margin-left:auto;margin-right:auto;text-align:center;}


/* menu sticky avec menu_sticky.js */

.main-header {z-index:1000;}
.main-header a{ opacity:1; }
.header-nav {	text-align: center;}

.nav-is-stuck .main-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
	animation: stickAnim .3s;
}
.nav-is-stuck .nonstick{display:none!important;}
.nav-is-stuck .logheader { width: 150px;    position: fixed;    top: 0;    margin-top:-30px; }
@keyframes stickAnim {
	0% {
		transform: translateY(-86px);
	}
	100% {
		transform: translateY(0);
	}
}

/***********plugin ancre douce ***********************/
.ancres_douces:before, .ancres_douces_m:before , .ancres_douces_s:before { 
  display: inline-block; 
  content: " "; 
  margin-top: -60px; 
  height: 60px; 
  visibility: hidden; 
  background:transparent;
} 

.ancres_douces_m:before {
      margin-top: 50px;height:50px;
   }
 
.ancres_douces_s:before {
      margin-top: 40px;height:40px;
   }
/* Gabarit d'impression
------------------------------------------ */
@media print {
.page,
.wrapper,
.content { width:auto; }
.nav,
.arbo,.ariane
.aside,
.footer { display:none; }
}
.hboite{max-width:173px;}


@media only screen and  (max-width:480px) {
.part_un,.part_deux{padding-left:0;padding-right:0;}

 
 h2 {text-shadow:none!important;}
.spip_logos{ margin-top:0px;  margin-right:1px;  margin-bottom:2px;  margin-left:0px;}
.colmaxi { width: 100%!important;}
.grid-3 > *,.grid-2 > *,.grid-1 > *, .grid-0 > * { width: 100%!important;}

.hauto{height:auto!important;}
.grid-4 > *,.grid-5 > *,.grid-6 > * {width: 50%!important;}
.grid-t-2   { width: 100%!important;}


}

@media  only screen and  (max-width:640px) {
.hauteurfixe{	height:auto;min-height:auto;overflow:visible;padding:0px!important;}
.ariane {display:none;} .arbo {display:none;}


}



div.lebloc{ display: inline-block;vertical-align: top;}
div.lebloc2{vertical-align: middle;display: inline-block;}
.lebloc2{	vertical-align: middle;display:inline-block;}


@media  only screen and (min-width:480px) and (max-width:767px) {
[class*="grid-t-"] > *  {margin-left:auto;margin-right:auto;text-align:center;margin-bottom:10px;}
.grid-1 > *, .grid-0 > * { width: 100%!important;}
.grid-3 > * {width:50%!important;}
.grid-4 > * {width:50%!important;}
.grid-5 > * {width:33%!important;}
.grid-6 > * {width:33%!important;}
.grid-t-2  > * {width:100%!important;}
.tgrid2  h2{font-size:88%;}   .tgrid3  h2{font-size:85%;}  .tgrid4  h2,.tgrid5  h2{font-size:75%;}  .tgrid6 h2{font-size:70%;} 
.aside  .grid-1 > * {width:80%!important;padding:10px!important; }
.arbo ,.ariane{ display: none; }
	/* header du calendrier full-calendar */
table.fc-header td { display: block; text-align: left; }
.saut {  width:100%; }/* rajout test colonnes*/
}

@media only screen and (min-width:768px)and (max-width: 1023px) {
.grid-1 > *, .grid-0 > * { width: 100%!important;}
.grid-3 > * {width:50%!important;}
* body { font:1em Georgia, Cambria, Times New Roman, Times, serif; color: #222222; }
.tgrid2  h2{font-size:88%;}   .tgrid3  h2{font-size:85%;}  .tgrid4  h2,.tgrid5  h2{font-size:75%;} 
.tgrid6 .hauteurfixe{height:55px;min-height:55px;overflow:hidden;}
.video-container iframe{max-width:95%;text-align:center;margin-left:auto;margin-right:auto;}
.col-s-1 .aside{	margin:0 0 4.5% 0;}
.col-s-1 .aside .tgrid1, .col-s-1 .aside .tgrid0 , .col-s-1.aside .tgrid2{
    width: 100%!important;}
	
/* version dispo*/

.colarge .grid-0> * {width:70%!important;padding:10px!important;}
.colarge .grid-1 >* {width:50%!important;padding:10px!important;}
.colarge  {margin-top:50px;border-top:1px solid #CCCCCC}

}



@media only screen and (max-width: 1023px) {
.footer .colophon,.footer { width: auto; float: none; text-align:center;}
.footer .generator { display: none; }
.footer .lasection {width:100%;float:none;border-bottom: #CCC dotted;text-align:center;margin:auto !important;}
* body {  font: 1em/1.3em Georgia, Cambria, Times New Roman, Times, serif; color: #222222; }
.tgrid0,.menu,.aside{	width:100%;}
}


@media only screen and (min-width:1024px)and (max-width: 1200px) {
.footer           { width:auto !important; margin:auto !important;text-align:center; padding: 0.5em 0 0; }
.footer  .corp    { width:auto !important; margin:auto !important;text-align:center;padding-left:0px; }
.col-s-1 .aside{	margin:0 0 4.5% 0;}
.col-s-2 .content{	margin:0 0 4.5% 0;}
}

@media only screen and  (max-width: 1200px){

 .aside h2{	font-size: 1em;}
.hboite{max-height:100%;}
.part_un{padding:0 3% 0 3%!important;}
.part_deux{padding:0 2% 0 2%!important;}
}
