/*****************************************************/
/*** 	background:#769f33 url('images/bluec_30p.png') center top ;
/****General****/

*
{
	margin:0px;
	padding:0px;
}

#map{ /* la carte DOIT avoir une hauteur sinon elle n'apparaît pas */
                height:400px;
                	width:80%;

}
            
body
{
	background:#769f33 center top ;
	padding-left:10%;
	padding-right:10%;
	font-family:Optima, sans-serif;
	color: black;
}
a
{
	text-decoration:none;
	color:#000000;
	
}
a:hover
{
	color:#000000;
}
img, table, tr, td
{
	border:0px;
}
h1
{
	text-align:center;
	margin:0px;
	padding:0px;
}
.clean
{
	clear:both;
}
.left
{
	text-align:left;
}
.center
{
	text-align:center;
}
input
{
	width:150px;
}
label
{
	width:200px;
	display:inline-block;
	vertical-align:top;
	text-align:left;
}
table
{
	border-spacing:0px;
	background:#ffffff;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	padding:0px;
	width:90%;
	margin-left:50px auto 5px auto;
}
tr
{
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	margin:0px;
}
h2
{
text-align:center;
}
td, th
{
	margin:0px;
	border:0px;
	padding:3px;
	text-align:center;
}


.photo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    grid-gap: 10px;
    margin-top: 2rem;
}

/*****************************************************/
/***gestuon de l'affichage des images dans la galerie****/


.hovered {
    position: absolute;
    top: 0; bottom: 0; left: 0; right: 0;
    height: 100%; width: 100%;
    opacity: 0; transition: all .3s;
    background-color: #3f3f44;   
}

.hovered span {
    color: white;
    font-size: 5rem;
    position: absolute;
    top: 50%;
    left: 50%;
    font-family: arial;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}



.photo-item {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
}

.photo-item img {
    width: 100%; /* Fixe la largeur de l'image à 100% du conteneur */
    height: auto; /* Fixe la hauteur de l'image pour maintenir le ratio */
    max-height: 200px; /* Assure que la hauteur maximum est de 200px */
    object-fit: cover; /* Pour s'assurer que les images remplissent bien la zone définie */
    border-radius: 8px;
    transition: transform 0.3s ease;
}

.photo-item:hover img {
    transform: scale(1.1);
}
.photo-item:hover .hovered {
    opacity: 1;
}




.superposition-simple {
 position: relative;
 width: 100%;
}
.superposition-simple .image-originale {
 display: block;
 width: 100%;
 height: auto;
}
.superposition-simple .texte-original {
 color: #fff;
 font-size: 30px;
 line-height: 1.5em;
 text-shadow: 2px 2px 2px #000;
 text-align: center;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: 100%;
}
.superposition-simple .texte-hover {
 position: absolute;
 top: 0;
 height: 100%;
 width: 100%;
 opacity: 0;
 transition: .5s ease;
}
.superposition-simple:hover .texte-normal {
 opacity: 0;
}
.superposition-simple:hover .texte-hover {
 opacity: 1;
}
.superposition-simple .texte-normal {
 transition: .5s ease;
}




/*****************************************************/
/****Blocs****/
.header
{
	margin:auto;
	margin-top:10px;
	padding:15px;
	background:#ffffff ;
	width:90%;
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	border-radius:20px;
	text-align:center;
}
.foot
{
	text-align:center;
	background:#ffffff ;
	width:90%;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	border-radius:15px;
	margin:auto;
	padding:10px;
	margin-top:20px;
}
.content
{
	background:#ffffff ;
	width:90%;
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	border-radius:20px;
	margin:auto;
	padding:20px;
	margin-top:20px;
}
/*****************************************************/
/****Contenu****/
.big
{
	font-size:1.2em;
}
.small
{
	font-size:0.7em;
}
.message
{
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	border-radius:20px;
	padding:20px;
	margin:auto;
	width:80%;
	background:url('images/black_40p.png');
	color:white;
	text-align:center;
	margin-top:20px;
}
.message table
{
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	border-radius:20px;
	padding:20px;
	margin:auto;
	width:100%;
	background:url('images/black_40p.png');
	color:black;
	text-align:center;
	font-weight:bold;
	margin-top:20px;
}
.messages_table td
{
	border-top:1px solid #aaaaaa;
	vertical-align:top;
}
.author
{
	width:150px;
	border-right:1px solid #aaaaaa;
}
.title_cell
{
	width:45%;
}
.date
{
	font-style:italic;
	text-align:right;
	font-size:0.9em;
	margin-right:10px;
}
.link_new_pm
{
	font-size:1.3em;
	font-weight:bold;
	margin:5px 0px 5px 0px;
	display:inline-block;
	border:1px solid #dddddd;
	background:#ffffff;
	padding:5px;
}
