/* Position the image container (needed to position the left and right arrows) */
.container {
  position: relative;
}

/* Hide the images by default */
.myS_style {
  display: none;
  width: 700px;
  height: 525px;
  line-height: 525px;
  text-align: center;
  vertical-align: middle;
}
.myS_style img {
  max-height:525px;
}

/* Add a pointer when hovering over the thumbnail images */
.cursor {
  cursor: pointer;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: relative;
  top: -300px;
  width: auto;
  padding: 16px;
  color: black;
  background-color: rgba(0, 0, 0, 0.2);
  font-weight: bold;
  font-size: 30px;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  left: 605px;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  color:white;
  background-color: rgba(0, 0, 0, 0.8);
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* Container for image text */
.caption-container {
  position: relative;
  text-align: center;
  background-color: #222;
  padding: 2px 16px;
  color: white;
  top: -40px;
}

.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Six columns side by side */
.column {
  position: relative;
  top: -30px;
  float: left;
  width: 16.66%;
  height: 88px;
  line-height: 88px;
  text-align: center;
  vertical-align: middle;
}
.column img {
  max-height: 88px;
  max-width: 100%;
}

/* Add a transparency effect for thumnbail images */
.demo_style {
  opacity: 0.6;
}

.active,
.demo:hover {
  opacity: 1;
}


/* Les couleurs doivent ?tre remplac?es par des images */

		#overlay {
			display : none; /* Par défaut, on cache l'overlay */
			position: absolute;
			top: 0; 
			left: 0;
			width: 100%;
			min-height:100%;
			max-height: 2400px;
			text-align: center; /* Pour centrer l'image que l'overlay contiendra */

			/* Ci-dessous, nous appliquons un background de couleur noire et d'opacité 0.6. Il s'agit d'une propriété CSS3. */
			background-color: rgba(0,0,0,0.6);
		}

		#overlay img {
			margin-top: 100px;
			max-width: 1280px;
			/* max-height: 720px; */
		}

		#overlay p {
			margin-top: 300px;
			text-align: center;
		}

body
{
font-family: Georgia;
min-width: 1000px;
max-width: 1000px;
margin: auto;
background: url(./images/bg.jpg);
}
#news
{
background: rgba(255,255,255,0.75);
}
img
{
border: 0px;
}
#haut
{
padding: 20px;
height: 220px; /*total 260px*/
/* background: url(./images/header_bg.jpg); */
border-bottom:1px solid black;
}
#header
{
height: 160px;
width: 740px;
}
#calendrier
{
position: relative;
padding: 0px;
height: 220px;
margin-left: 760px;
background: ;
}
#milieu
{
margin-top: -30px;
text-align: center;
width: 740px;
padding: 0px;
background: white;
line-height: 20px;
}
#conteneur
{
border:1px solid black;
/*background: url(./images/header_bg.jpg);*/
background: rgba(255,255,255,0.95);
}

#cont-a {
float: right;
// background-color: red;
width: 100%;
position: relative;
right: 720px;
border-right: 1px solid black;
}
#cont-b {
float: right;
// background-color: blue;
width: 100%;
position: relative;
right: 279px;
}

	#menu_gauche
	{
	padding: 10px;
	border:0px solid black;
	width: 257px;
	height: auto;
	position: relative;
	float: left;
	left: 1000px;
	}
	
	#menu_gauche li {
    list-style-type: none; /* on annule la puce par défaut */
    background-image: url(./images/puce.png); /* on affiche l'image souhaitée */
    background-repeat: no-repeat; /* on annule la répétition par défaut */
    background-position: left center; /* on positionne où l'on veut */
    padding-left: 20px; /* pour éviter la superposition du contenu */
    margin-left: -30px;
	}
	
	#menu_gauche input[type=text] {
	background-color:rgba(250,100,0,0.2);
	border:0px solid rgba(250,100,0,1);
	width:100%;
	height:25px;
	}
	#menu_gauche input[type=submit] {
	background-color:rgba(250,100,0,0.5);
	border:0px solid rgba(250,100,0,1);
	width:10;
	height:25px;
	float:right;
	}
	#menu_gauche fieldset {
	border:1px solid rgba(250,100,0,1);
	}
	#menu_gauche legend{
	border:1px solid rgba(250,100,0,1);
	text-align:center;
	}
	
	#contenu
	{
	padding: 10px;
	min-width: 700px;
	max-width: 700px;
	background: ;
	border-left:0px solid black;
	position: relative;
	float: left;
	left: 1000px;
	}
#contenu sub {
font-size: 10px;
color: grey;
}
	#contenu li{
    list-style-type: none; /* on annule la puce par défaut */
    background-image: url(./images/puce3.png); /* on affiche l'image souhaitée */
    background-repeat: no-repeat; /* on annule la répétition par défaut */
    background-position: ; /* on positionne où l'on veut */
    padding-left: 20px; /* pour éviter la superposition du contenu */
	}
	#contenu li li{
    list-style-type: none; /* on annule la puce par défaut */
    background-image: url(./images/puce2.png); /* on affiche l'image souhaitée */
    background-repeat: no-repeat; /* on annule la répétition par défaut */
    background-position: left center; /* on positionne où l'on veut */
    padding-left: 20px; /* pour éviter la superposition du contenu */
	}
	#contenu img{
	vertical-align: middle;
	}
	#contenu input[type=text],#contenu input[type=password]  {
	background-color:rgba(250,100,0,0.2);
	border:0px solid rgba(250,100,0,1);
	width:200px;
	height:25px;
	}
	#contenu input[type=submit] {
	background-color:rgba(250,100,0,0.5);
	border:0px solid rgba(250,100,0,1);
	width:10;
	height:25px;
	position:relative;
	float:right;
	}
	#contenu #login_form input[type=submit] {
	background-color:rgba(250,100,0,0.5);
	border:0px solid rgba(250,100,0,1);
	width:10;
	height:25px;
	position:relative;
	float:right;
	right:500px;
	}
	#contenu fieldset {
	border:1px solid rgba(250,100,0,1);
	}
	#contenu legend{
	border:1px solid rgba(250,100,0,1);
	text-align:center;
	}
	
#lang
{
position: relative;
float: left;
margin-top: -10px;
}
#corps
{
border:0px solid black;
}
#corps h1, h2, h3
{
background: rgba(255,255,255,0.85);
}
#corps caption
{
background: rgba(255,255,255,0.85);
}
#corps table
{
width: 100%;
}
#url_img
{
width: 500px;
}
#album_photo table
{
border: 0px solid black;
width: 680px;

}
#album_photo td
{
border: 2px solid black;
text-align: center;
width: 33.33%;
height: 170px;
}
#album_images table
{
border: 0px solid black;
width: 680px;
}
#album_images td
{
border: 2px solid black;
text-align: center;
width: 25%;
height: 170px;
}
#fond
{
font-size: 12px;
text-align: center;
clear: both;
background: rgba(255,255,255,0.6);
height: 40px;
padding-top: 10px;
border-top: 1px solid black;
}
#header
{
position: absolute;
}
textarea
{
width: 100%;
}
/* Calendrier */

#calendrier table
{
	position: absolute;
	bottom: 0px;
        font-size: 16px;
        border: 1px solid  white;
	text-align: center;
	border-collapse: collapse;
}
#calendrier table a
{
        text-decoration: none;
        color: black;
}
#calendrier table td
{
        border: 1px solid white;
        width: 26px;
        height: 26px;
		position: realtive;
}
#calendrier td.evenement 
{
	background-color: rgba(250,100,0,0.5);
}
#calendrier .aujourdhui 
{
	background-color: rgba(200,200,250,0.85);
	color:white;
}
#calendrier .autre_mois
{
    background : rgba(128,128,128,0.5);
	color:white;
}

/* Infobulles */
.evenement span, .aujourdhui span
{
	position:absolute;
	display:none; /* on masque l'infobulle */
	margin-top:10px;
	padding:5px;
}
.evenement:hover, .aujourdhui:hover
{
    background:none; /* correction d'un bug IE */
	z-index:500;
	cursor:pointer;
}
.evenement:hover span, .aujourdhui:hover span
{
	display:inline; /* on affiche l'infobulle */
	white-space:nowrap;
	background-color:rgb(250,100,0);
	border:2px solid white;
	cursor:pointer;
}
#copyright, #chrono
{
       text-align: center;
}

/* Le menu */
#menu, #menu ul
{
        padding : 0;
        margin : 0;
        list-style : none;
        line-height : 30px;
        text-align : center;
		z-index: 100;
}
#menu
{
        float: right;
        font-weight : bold;
        font-family : Arial;
        font-size : 14px;
		height: 0px;
        background-color: white;
		margin-top: 0px;
}
#menu a
{
        display : block;
        padding : 0;
        background : rgb(100,100,50);
        opacity: 0.95;
filter:alpha(opacity=95);
        color : white;
        text-decoration : none;
        width : 140px;
}
#menu li
{ 
        float : left;
}
#menu li ul
{ 
        position: absolute;
        width: 140px;
        left: -999em; /* hors du champ de vision */
}
#menu li ul ul 
{
        margin: -22px 0 0 140px ;     
}

#menu a:hover
{
        color: black;
        background: white;
}

#menu li:hover ul ul, #menu li.sfhover ul ul
{
        left: -999em;
}

#menu li:hover ul, #menu li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul
{
        left: auto;
        min-height: 0; /* Corrige un bug sous IE */
}