
/*--- Style CSS dynamique pour la rubrique FETE DU JARDIN du site ayn.fr sous SPIP ---*/


/* --- Declarations saisonnieres ---*/

	/*--- Printemps ---*/


	/*--- Ete ---*/


	/*--- Automne ---*/


	/*--- Hiver ---*/


	/*--- FDJ ---*/


/* FIN declarations saisonnieres */


/*--- Assignation en fonction des saisons ---*/


/* FIN assignations*/



/*--- Styles generaux ---*/

html {
	font-family:arial;
	font-size:10pt;
	color:black;
	}

body {
	background-image:url(images/background_fdj.png);
	background-color:#FFF6D5;
	background-attachment:fixed;
	}

a {
	text-decoration:none;
	color:#0B622F;
	}

a:hover {
	color:#FFFFFF;
	background-color:#0B622F;
	}

img {
	border-width: 10px;
	border-radius: 1em;
	max-width: 100%;
	}

hr.note {
	width: 30%;
	align: left;
	}

blockquote {
	font-style: italic;
	background-color: rgba(255,255,255,0.5);
	padding: 1em;
	margin-left: 10%;
	}

.bord {
	border-style: solid;
	border-width: 0.2em;
	border-color: #0B622F;
	}

.bloc {
	height:auto;
	color:#000000;
	background-color:#FFF6D5;
	padding-top: 2em;
	padding: 1em;
	box-shadow: 0.3em 0.3em 0.5em #666666;
	border-radius: 1em;
	}
	
.foot {
	width: auto;
	background-color: #FFF6D5;
	}

.spacer {		/*style de bloc fantome pour forcer le remplissage*/
	clear:both;
	height:auto;
	overflow:hidden
	}
	
.fantome {
	display: none;
	}

.photo {		/*pour l'affichage aleatoire de photos en page d'accueil*/
	width:200px;
	margin-left;auto;
	margin-right:auto;
	}

.spip_logos {
	border-radius: 0;
	margin-right: 0.5em;
	}

.titre_article {
	font-size:2em;
	font-weight:bold;
	}

.signature {
	font-size:0.8em;
	text-align:left;
	}
	

	
/*--- Titres et intertitres ---*/

h3.spip {
	text-align:left;	
	}
	
h4.spip {
	text-align:left;
	margin-left:1em;
	}	
	
/*--- Formulaires formidable ---*/
	
.formulaire_formidable {
	border-style: solid;
	border-width: 0.1em;
	border-color: #8A4500;
	border-radius: 1em;
	padding: 1em;
	}
	
.formulaire_formidable fieldset	{
	border-style: solid;
	border-width: 0.1em;
	margin-top: 1em;
	border-color: #8A4500;
	max-width: inherited;
	}
	
.formulaire_formidable fieldset legend {
	font-weight:bold;	
	}
	
.editer {
	border-bottom-style: solid;
	border-bottom-width: 0.1em;
	border-bottom-color: #A0A09F;
	padding: 1em;
	max-width: inherited;
	}
	

/*--- Tableaux ---*/

table {
	border-collapse: collapse;
	background-color: rgba(255,255,255,0.5);
	margin-left:auto;
	margin-right:auto;
	margin-bottom:1em;
	}

tr:nth-child(even) {
	background-color: rgba(200,200,200,0.5);
	}

table, th, td {
	border: 1px solid black;
	}

th {
	background-color: rgba(100,100,100,0.8);
	color:white;
	font-weight:bold;
	text-align:center;
	}

caption {background-color: rgba(200,200,200,0.5);
	font-weight:bold;
	text-align:center;
	margin-bottom:1em;
	}

/*--- Blocs de structure ---*/

#general {
	height:auto;
	width:95vw;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
	padding-left:1em;
	padding-right:1em;
	}

#sommet {
	height:auto;
	background-color:none;
	}

#bandeau {
	text-align: center;
	}
	
#article {
	height:auto;
	text-align:justify;
	padding-top: 2em;
	}

#gauche {
	height:auto;
	width:200px;
	float:left;
	margin-right:2%;
	}

#droite {
	height:auto;
	width:200px;
	float:right;
	margin-left:2%;
	}

#corps {
	height:auto;
	overflow: auto;
	padding: 1em;
	}

#accueil {
	height:auto;
	}

#dernier {
	height:auto;
	}

#menu {
	height:auto;
	width:100%;
	margin-left: auto;
 	margin-right: auto;
	}


/*---Styles adaptatifs---*/

@media (orientation: landscape) {
	
#corps {
	margin-left: 200px;
	}

#agendaz {
	display: none;
	}

#syndication {
	margin-left, margin-right: 200 px;
	}		

#paru {
	height:auto;
	width:45%;
	float:left;
	margin-right:2em;
	}

#misajour {
	height:auto;
	width:45%;
	margin-left:50%;
	padding-top:0.1em;
	padding-left:2em;
	}	
	
#mairies {
	height: auto;
	width: 30%;
	padding-top:0.1em;
	float: left;
	}

#associations {
	height:auto;
	width:30%;
	margin-left: auto;
	margin-right: auto;
	padding-top:0.1em;
	}

#institutions {
	height:auto;
	width:30%;
	float: right;
	padding-top:0.1em;
	}
	
#volet_clos {
	display:none;
	}
}

@media (orientation: portrait){

body {
	background-size: 50%;
	}

#gauche, #droite, #menu{
	display: none;
	}

#corps, #syndication {
	margin-left, margin-right: none;
	}

#agendaz {
	height: auto;
	padding-top:0.1em;
	margin-bottom: 1em;
	}

#paru {
	height: auto;
	padding-top:0.1em;
	margin-bottom: 1em;
	}

#misajour {
	height: auto;
	padding-top:0.1em;
	margin-bottom: 1em;
	}
	
#mairies {
	height: auto;
	padding-top:0.1em;
	margin-bottom: 1em;
	}

#associations {
	height: auto;
	padding-top:0.1em;
	margin-bottom: 1em;
	}

#institutions {
	height: auto;
	padding-top:0.1em;
	margin-bottom: 1em;
	}
}

/*---*/

#foot {
	height:1.5em;
	font-size:0.8em;
	text-align:center;
	padding-top:1em;
	clear:both;
	}

#horaires {
	text-align:center;
	}
	
#accesdirect {
	text-align:center;
	}

#tafta, #retraites  {
	align:center;
	}

#tafta img {
	border-radius: 0;
	}	

#deces {
	height:auto;
	background-color: #FFFFFF;
	padding: 0.5em;
	border-style: solid;
	border-width: 0.5em;
	border-radius: 0;
	border-color: #000000;
	padding: 1em;
	}	

#fd {
	height:auto;
	color:#0B622F;
	background-color:#FFF6D5;
	padding-top: 2em;
	padding: 1em;
	box-shadow: 0.3em 0.3em 0.5em #666666;
	border-radius: 1em;
	}

#fdj:hover {
	color:#FFFFFF;
	background-color:#0B622F;
	}

/*---Volet lateral---*/

#volet {
	position: fixed;
	left: -270px;
	top: 55px;
	width: 250px;
	padding: 10px;
	background-color: #0B622F;
	color: #FFFFFF;
	border-radius: 0 0 1em 0; 
	-webkit-transition: all .5s ease-in; /*---Incompatible avec la lame ancres douces du couteau suisse---*/
	transition: all .5s ease-in;
	}
	
#volet a {
	color: #FFFFFF;
	font-weight: bold;
	}
	
#volet a:hover {
	color: #0B622F;
	background-color: #FFFFFF;
	}
	
#volet a.ouvrir, #volet a.fermer {
	position: absolute;
	right: -1em;
	top: 0px;
	padding: 0.1em 0.25em;
	background-color: #0B622F;
	color: #FFF6D5;
	text-decoration: none;
	font-size: 4em;
	border-radius: 0 0.25em 0.25em 0;
	}
	
#volet a.fermer {
	display: none;
	}	
	
#volet:target {
	left: 0;
	}
	
#volet:target a.ouvrir {
	display: none;
	}

#volet:target a.fermer {
	display:block;
	}
	
#volet_clos:target #volet {
	left: -270px;
	}
	
#volet hr {
	color: #FFFFFF;
	}


/* https://www.alsacreations.com/tuto/lire/1234-creer-volet-coulissant-CSS3-target-transition.html */

	

#retour {
	height:auto;
	color:#8A4500;
	background-color:#FEEBD8;
	padding-top: 2em;
	padding: 1em;
	box-shadow: 0.3em 0.3em 0.5em #666666;
	border-radius: 1em;
	}

#retour:hover {
	color:#FFFFFF;
	background-color:#8A4500;
	}

/*--Bloc brochant pour signaler un bogue--*/

#formbug {
	position: fixed;
	bottom: 0px;
	right: 0px;
	padding-top:1em;
	display: none;
	overflow: auto;
	}
	
#formbug:target {
	display : block;
	}
