body{
	background: #fff;

	font-family: 'Open Sans', sans-serif;
}

#calendrier{
	padding-top:10px;
	background: #FFF;
}

#calendrier header{
	padding-top:0px;
	margin-bottom:20px;
}

#calendrier header div{
text-align:center;
}


.logo img{

}
/* IMAGE D'INTRO */
/* Fond blanc et image d'intro */
#intro-overlay {
    position: fixed;             /* L'image d'intro reste fixe */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: white;     /* Fond blanc */
    z-index: 10000;              /* Assurez-vous que l'image est au-dessus du reste du contenu */
    display: flex;               /* Utilisation de flexbox pour centrer l'image */
    justify-content: center;     /* Centrer horizontalement */
    align-items: center;         /* Centrer verticalement */
}

#imageFading {
    max-width: 100%;             /* L'image occupe toute la largeur de l'écran */
    max-height: 100%;            /* L'image occupe toute la hauteur de l'écran */
    object-fit: contain;         /* Garder l'image entière et proportionnelle */
    cursor: pointer;            /* Change le curseur pour indiquer que l'image est cliquable */
}

/* Masquer le reste du contenu tant que l'image est visible */
body > *:not(#intro-overlay) {
    visibility: hidden;  /* Masquer tout sauf l'overlay de l'image */
}

/* Lorsque l'image d'intro disparaît, on réaffiche le contenu */
.hidden-content {
    visibility: visible;
}


/* Règles si la fenêtre fait au plus 1200px de large */
@media screen and (max-width: 1200px)
{
    article p
	{font-size: 65px;}
	h2{font-size:55px;
	font-style: italic;}
	
	article img{
	
	height: auto;
	max-width:100%;
	max-height:60vh;}
	.logo#gauche{
	float:left;  
	padding-left:5%;
	width:25%;
	max-width:150px;
	}
	.logo#droit{
	float:right; 
	padding-right:5%;
	width:35%;
	max-width:200px;
	}
	
	.texte_bas_de_page{
	font-size:35px;}
	.ui-datepicker{font-size:4.8vw;} /* Taille du datePicker */
	.button_oasys {font-size: 45px; margin:35px 15px 15px 0px;}
	a.button_oasys:visited {font-size: 45px;}
}

/* Règles si la fenêtre fait plus de 1200px de large */
@media screen and (min-width: 1201px)
{
    article p
    {font-size: 28px;}
	
	h2{font-size:40px;
	font-style: italic;}
		
	article img{
	height: auto;
	max-width:100%;
	max-height:60vh;}
	
	.logo#gauche{
	float:left;  
	padding-left:10%;
	width:25%;
	max-width:100px;
	}
	.logo#center{
	float:center;  
	width:25%;
	max-width:300px;
	}
	.logo#droit{
	float:right; 
	padding-right:10%;
	width:25%;
	max-width:220px;
	}
	.texte_bas_de_page{
	font-size:18px;
	}
	 .ui-datepicker{font-size:2vw;} /* Taille du datePicker */
	 .button_oasys {font-size: 25px; margin:15px 15px 15px 0px;}
	 a.button_oasys:visited {font-size: 30px;}
}


/*  article p {
    font-size: 32px;
  }    */
 h2{
	font-style: italic;
	/* font-weight:bold; */
	color: rgba(0,0,0, 1);
	line-height: 22px;
} 
  /* a.button_oasys { */
    /* font-size: 30px; */
  /* } */
 
 
a.button_oasys.aujourdhui{
	margin-left:10px;
	font-size: 35px;
	display: none;
}

a.button_oasys, a.button_oasys:visited, .button_oasys{
	background: #002f5a;
	color:#FFF;
	padding:10px;
	border:none;
	text-decoration: none;
	display: inline-block;
	cursor: pointer;
	border-radius: 10px;
	font-weight:bold;
	}


article{
	text-align: center;
	margin-bottom: 0px;
}



article p{
	line-height: 120%;
	font-weight:bold;
	color:#a84d8e;
	margin: 0 0 0 0;
}

a.button_hier{
	display: inline-block;
	background: url('../images/gauche.png') left 10px center no-repeat #002f5a;
	padding-left:35px;
	text-decoration:none;
	
	}

.datepicker{
	display:none;
	}

a.button_demain{
	display: inline-block;
	background: url('../images/droite.png') right 10px center no-repeat #002f5a;
	padding-right:35px;
	text-decoration:none;
	
}

.liens_footer{
	text-align: center;
}
footer{
	text-align: center;
}
footer footer{
	margin-top:15px;
}
/*footer footer div{

	margin:0px;
	display:block;
	width:2279px;
	-webkit-animation:linear marqueelike 20 s infinite ;
	-moz-animation:linear marqueelike 20s infinite ;
	-o-animation:linear marqueelike 20s infinite ;
	-ms-animation:linear marqueelike 20s infinite ;
	animation:linear marqueelike 20s infinite ;
}*/

footer footer{
	overflow: hidden;
	position: relative;
	color:#000;
}

footer footer p:after {
	content:attr(data-text);
	position:absolute;
	white-space:nowrap;
	padding-left:10px;

}

@-webkit-keyframes marqueelike {
	0%, 100% {margin-left:0;}
	99.99% {margin-left:-100%;}
 }
@-moz-keyframes marqueelike {
	0%, 100% {margin-left:0;}
	99.99% {margin-left:-100%;}
 }
@-o-keyframes marqueelike {
	0%, 100% {margin-left:0;}
	99.99% {margin-left:-100%;}
 }
@-ms-keyframes marqueelike {
	0%, 100% {margin-left:0;}
	99.99% {margin-left:-100%;}
 }
@keyframes marqueelike {
	0%, 100% {margin-left:0;}
	99.99% {margin-left:-100%;}
 }

sup {
vertical-align: super;
font-size: smaller;
}
 /*
 * jQuery UI Datepicker 1.8.7
 *
 * Copyright 2010, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI/Datepicker#theming
 */
.ui-datepicker-inline{
 	position:absolute;
 	background:#FFF;
	transform: translate(-50%,-50%);
 	top:50% !important; left: 50% !important; border: 1px solid #002f5a;
 }

 .ui-widget-header{
 	background:#a84d8e;
 	border:none;
 }

 .ui-datepicker-inline .ui-state-active,  .ui-datepicker-inline .ui-state-hover{
 	background: #a84d8e;
 	color: #FFF;
 	border:none;
 }


/* Texte défilant */

.defileParent {
	display: block;

	overflow: hidden;
	position: relative;
	table-layout: fixed;

}
.defile {
	display:block;
	-webkit-animation:linear marqueelike 120s infinite ;
	-moz-animation:linear marqueelike 120s infinite ;
	-o-animation:linear marqueelike 120s infinite ;
	-ms-animation:linear marqueelike 120s infinite ;
	animation:linear marqueelike 120s infinite ;
	margin-left:-282%;
	padding:0 5px;
	text-align:left;
	height:20px;
	/*width:2666px;*/
	width:5300px;
}


.defile:after {
	content:attr(data-text);
	position:absolute;
	white-space:nowrap;
	padding-left:10px;
}

@-webkit-keyframes marqueelike {
	0%, 100% {margin-left:0;}
	99.99% {margin-left:-282%;}
 }
@-moz-keyframes marqueelike {
	0%, 100% {margin-left:0;}
	99.99% {margin-left:-282%;}
 }
@-o-keyframes marqueelike {
	0%, 100% {margin-left:0;}
	99.99% {margin-left:-282%;}
 }
@-ms-keyframes marqueelike {
	0%, 100% {margin-left:0;}
	99.99% {margin-left:-282%;}
 }
@keyframes marqueelike {
	0%, 100% {margin-left:0;}
	99.99% {margin-left:-282%;}
 }
/*
@media only screen and (max-width: 860px) {
.defileParent {
	display: block;
	margin: 3em auto;
	overflow: hidden;
	position: relative;
	table-layout: fixed;
	width: 100%;
}

.defile {
	display:block;
	-webkit-animation:linear marqueelike 15s infinite ;
	-moz-animation:linear marqueelike 15s infinite ;
	-o-animation:linear marqueelike 15s infinite ;
	-ms-animation:linear marqueelike 15s infinite ;
	animation:linear marqueelike 15s infinite ;
	margin-left:-100%;
	padding:0 5px;
	text-align:left;
	height:25px;
}
}*/