
/*--- Style CSS dynamique pour le site ayn.fr sous SPIP ---*/


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

	/*--- Printemps ---*/


	/*--- Ete ---*/


	/*--- Automne ---*/


	/*--- Hiver ---*/


	/*--- PLU ---*/


/* 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_ete.jpg);
	background-color:#FFF8DC;
	background-attachment:fixed;
	}

a {
	text-decoration:none;
	color:#177100;
	}

a:hover {
	color:#FFFFFF;
	background-color:#177100;
	}

img {
	border-width: 10px;
	border-radius: 1em;
	height: auto;
	}
		
.colonnes {
	width: 205px;
	height: auto;
	}

/*img.sommet {
	align: center;
	width: auto:
	height: auto;*/
	
.note {
	padding-right: 70%;	
	}
	
.note hr {
	border-top: 0.2em;
	border-color: #177100;
	}
	
hr.spip {
	border-top: 0.2em;
	border-color: #177100;
	}

blockquote.spip {
	font-style: italic;
	background-color: rgba(255,255,255,0.5);
	padding: 1em;
	margin-left: 2em;
	border-color: #177100;
	}

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

.bloc {
	height:auto;
	background-color:#FFF8DC;
	padding-top: 2em;
	padding: 1em;
	box-shadow: 0.3em 0.3em 0.5em #666666;
	border-radius: 1em;
	}
	
.dullin {
	background-color: #cdf0ec;
	}

.ccla {
	background-color: #a8ccdc;
	}
	
.pnrc {
	background-color: #60c6a0;
	}
		
.foot {
	width: auto;
	background-color: #FFF8DC;
	}

.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;
	}
	
.spip_doc_titre {
	font-weight: normal;
	}

	
/*--- Formulaires formidable ---*/
	
.formulaire_formidable {
	border-style: solid;
	border-width: 0.1em;
	border-color: #177100;
	border-radius: 1em;
	padding: 1em;
	}
	
.formulaire_formidable fieldset	{
	border-style: solid;
	border-width: 0.1em;
	margin-top: 1em;
	border-color: #177100;
	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;
	}

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

h3.spip {
	text-align:left;	
	}
	
h4.spip {
	text-align:left;
	margin-left:1em;
	}	
	
	
/*--- Outil sommaire ---*/


	

/*--- Contrainte de largeur pour empecher le depassement---*/

img, table, td, blockquote, code, pre, textarea, input, fieldset, iframe, object, embed, video {
    max-width: 100%;
	}

/*--- 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:transparent;
	}

#bandeau {
	text-align: center;
	}
	
#bandeau a:hover{
	background: transparent;
	}

#agendas {
	height:auto;
	text-align:left;
	padding-top: 2em;
	border-style: solid;	/**/
	border-width: 0.2em;
	border-color: red;
	}

/*
#agendapart {
	height:auto;
	width:45%;
	display: inline-block;
	border-style: solid;
	border-width: 0.2em;
	border-color: blue;
	}

#manifavenir {
	height:auto;
	width:45%;
	display: inline-block;
	border-style: solid;	
	border-width: 0.2em;
	border-color: green;
	}
	
*/
	
#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, #presse, #comments {
	height:auto;
	overflow: auto;
	padding: 1em;
	}
	
#accueil {
	height:auto;
	}

#dernier {
	height:auto;
	}

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

#syndication1, #syndication2 {
	height:auto;
	padding: 0em;
	overflow: auto;
	}
	


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

@media (orientation: landscape) and (min-width: 501px) {
	
#corps, #presse, #comments {
	margin-left: 200px;
	}


#syndication1, #syndication2 {
	margin-left: 200 px;
	}		

#agendaz, #horairez, #specialz, #saisonz, #accez, #recherchez {
	display: none;
	}

#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, #associations, #institutions, #dullin, #ccla, #pnrc {
	height: auto;
	width: 29%;
	padding-top: 0.1em;
	float: left;
	margin-left: 0.5%;
	margin-right: 0.5%;	
	}

	
#volet_clos {
	display:none;
	}
	
#formbug {
	width: 30%;
	}
}

@media (orientation: portrait), (max-width: 500px) { 

body {
	background-size: 50%;
	}

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

#corps, #syndication1, #syndication2, #presse, #comments {
	margin-left: none;
	margin-right: none;
	}

#agendaz, #horairez, #specialz, #saisonz, #accez, #recherchez {
	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, #associations, #institutions, #dullin, #ccla, #pnrc {
	height: auto;
	padding-top:0.1em;
	margin-bottom: 1em;
	}
	
#formbug {
	width: 100%;
	}
}

/*---*/

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

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

/*--#grand_debat  {
	align:center;
	}--*/

#specialnoir {
	height:auto;
	background-color: #FFFFFF;
	border-style: solid;
	border-width: 0.5em;
	/*--border-corner-shape: scoop;--*/
	border-radius: 0;
	border-color: #000000;
	padding: 1em;
	}
	
#specialrouge {
	height:auto;
	background-color: #FFFFFF;
	border-style: solid;
	border-width: 0.5em;
	/*--border-corner-shape: scoop;--*/
	border-radius: 0;
	border-color: #FF0000;
	padding: 1em;
	color: #FF0000;
	}		

#plu {
	height:auto;
	color:#81157A;
	background-color:#EEDEED;
	padding-top: 2em;
	padding: 1em;
	box-shadow: 0.3em 0.3em 0.5em #666666;
	border-radius: 1em;
	}

#plu:hover {
	color:#FFFFFF;
	background-color:#81157A;
	}

#infospla a {
	color:#36B4A7;
	}

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

#volet {
	position: fixed;
	left: -270px;
	top: 55px;
	width: 250px;
	padding: 10px;
	background-color: #177100;
	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: #177100;
	background-color: #FFFFFF;
	}
	
#volet a.ouvrir, #volet a.fermer {
	position: absolute;
	right: -1em;
	top: 0px;
	padding: 0.1em 0.25em;
	background-color: #177100;
	color: #FFF8DC;
	text-decoration: none;
	font-size: 2em;
	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 */


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

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