﻿body
{
	position: absolute;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
}
header
{
	position: fixed;
	z-index: 10;
}
ul 
{
	list-style:none;
}
#fond_ecran 
{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	z-index: -999;
}
#fond_ecran img 
{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	z-index: 0;
}
#menu_bouton
{
	position: fixed;
	border: none;
	z-index: 10;
	top: 2%;
	width: auto;
	height: auto;
	background-color: transparent;
	cursor: pointer;
}
#menu_bouton img
{
	position: fixed;
	top: 2%;
	left: 1%;
	width: auto;
	height: auto;
}
#menu_ligne
{
	border: 3px rgb(255,102,0) solid;
	border-radius:10px;
	position: fixed;
	z-index: 15;
	text-decoration:none;
	top: 7.5%;
	left: 0;
	width: auto;
    color: rgb(51,102,255);
	background-color: rgb(255,255,207);
	padding: 0 2% 0 2%; 
}
#menu_ligne :hover
{
	background-color: rgb(189,189,189);
	color: black;
}
#menu_ligne li a
{
	font-family: Georgia, Times, serif;
	font-size: 11pt;
	font-style: italic;
	font-weight: normal;
	letter-spacing: 0.05em;
	word-spacing: 0.05em;
	text-decoration:none;
    color: rgb(51,102,255);
	text-shadow: -1px -1px 0 rgba(255,255,255,0.3);
	z-index: 25;
	left: 0;
	width: 100%;
	height: 100%;
}
#langue1
{
	position: fixed;
	z-index: 10;
	top: 5%;
	left: 8%;
	width: 2%;
}
#langue2
{
	position: fixed;
	z-index: 10;
	top: 5%;
	left: 10.5%;
	width: 2%;
}
#langue3
{
	position: fixed;
	z-index: 10;
	top: 5%;
	left: 13%;
	width: 2%;
}
#info_travail
{
	position: absolute;
	top: 5%;
	left: 18%;
	width: 5%;
	height: 5%;
	visibility: hidden;
}
#bandeau
{
	position: fixed; 
	text-align: center;
	top: 2%;
	left: 25%;
	width: 50%;
}
#logo
{
	position: fixed;
	top: 2%;
	right: 1%;
	width: 8%;
}
#visiteur  /* Nbre visiteurs */
{
    color: rgb(255,255,0);
	font-family: Georgia, Times, serif;
	font-size: 12pt;
	font-weight: bold;
	letter-spacing: 0.05em;
	word-spacing: 0.05em;
	text-align: center;
	position: absolute;
	z-index: 2;
	top: 12%;
	left: 3%;
	width: 10%;
/*	opacity: 0.8;	*/
}
#annonceurs
{
	position: absolute;
	z-index: 2;
	text-align: center;
	top: 12%;
	left: 72%;
	width: 28%;
/*	opacity: 0.8;	*/
}
#ecran
{
	width: 100%;
	height: 80%;
	position: fixed;
	top: 20%;
	left: 0%;
/*	border: 6px rgb(255,102,0) solid;
	border-radius:10px;	*/
}
        /* DEBUT CSS diaporama */
.diaporama, .diaporama:after 
{
	position: fixed;
	width: 55%;
	height: 75%;
	top: 22%;
	left: 22.5%;
	z-index: -999;
/*	opacity: 0.8;	*/
}
.diaporama li img 
{
	border: 6px rgb(255,102,0) solid;
	border-radius:10px;
	width: 55%;
	height: 75%;
	position: fixed;
	top: 22%;
	left: 22.5%;
	color: transparent;
	background-repeat: none;
	opacity: 0;
	z-index: 0;
	-webkit-backface-visibility: hidden;
	-webkit-animation: imageAnimation 64s linear infinite 0s;
	-moz-animation: imageAnimation 64s linear infinite 0s;
	-o-animation: imageAnimation 64s linear infinite 0s;
	-ms-animation: imageAnimation 64s linear infinite 0s;
	animation: imageAnimation 64s linear infinite 0s;
}
.diaporama li:nth-child(2) img 
{
	-webkit-animation-delay: 8s;
	-moz-animation-delay: 8s;
	-o-animation-delay: 8s;
	-ms-animation-delay: 8s;
	animation-delay: 8s;
}
.diaporama li:nth-child(3) img 
{
	-webkit-animation-delay: 16s;
	-moz-animation-delay: 16s;
	-o-animation-delay: 16s;
	-ms-animation-delay: 16s;
	animation-delay: 16s;
}
.diaporama li:nth-child(4) img 
{
	-webkit-animation-delay: 24s;
	-moz-animation-delay: 24s;
	-o-animation-delay: 24s;
	-ms-animation-delay: 24s;
	animation-delay: 24s;
}
.diaporama li:nth-child(5) img 
{
	-webkit-animation-delay: 32s;
	-moz-animation-delay: 32s;
	-o-animation-delay: 32s;
	-ms-animation-delay: 32s;
	animation-delay: 32s;
}
.diaporama li:nth-child(6) img 
{
	-webkit-animation-delay: 40s;
	-moz-animation-delay: 40s;
	-o-animation-delay: 40s;
	-ms-animation-delay: 40s;
	animation-delay: 40s;
}
.diaporama li:nth-child(7) img 
{
	-webkit-animation-delay: 48s;
	-moz-animation-delay: 48s;
	-o-animation-delay: 48s;
	-ms-animation-delay: 48s;
	animation-delay: 48s;
}
@-webkit-keyframes imageAnimation 
{
	0% 
		{
		opacity: 0;
		-webkit-animation-timing-function: ease-in;
		}
	8% 
		{
        opacity: 1;
        -webkit-animation-timing-function: ease-out;
		}
	17% {opacity: 1;}
	25% {opacity: 0;}
	33% {opacity: 0;}
    41% {opacity: 0;}
	100% {opacity: 0;}
}
@-moz-keyframes imageAnimation 
{
	0% 
		{
        opacity: 0;
        -moz-animation-timing-function: ease-in;
		}
	8% 
		{
        opacity: 1;
        -moz-animation-timing-function: ease-out;
		}
	17% {opacity: 1;}
	25% {opacity: 0;}
	33% {opacity: 0;}
    41% {opacity: 0;}
	100% {opacity: 0;}
}
@-o-keyframes imageAnimation 
{
	0% 
		{
        opacity: 0;
        -o-animation-timing-function: ease-in;
		}
	8% 
		{
        opacity: 1;
        -o-animation-timing-function: ease-out;
		}
	17% {opacity: 1;}
	25% {opacity: 0;}
	33% {opacity: 0;}
    41% {opacity: 0;}
	100% {opacity: 0;}
}
@-ms-keyframes imageAnimation 
{
	0% 
		{
        opacity: 0;
        -ms-animation-timing-function: ease-in;
		}
	8% 
		{
        opacity: 1;
        -ms-animation-timing-function: ease-out;
		}
	17% {opacity: 1;}
	25% {opacity: 0;}
	33% {opacity: 0;}
    41% {opacity: 0;}
	100% {opacity: 0;}
}
@keyframes imageAnimation 
{
	0% 
		{
        opacity: 0;
        animation-timing-function: ease-in;
		}
	8% 
		{
        opacity: 1;
        animation-timing-function: ease-out;
		}
	17% {opacity: 1;}
	25% {opacity: 0;}
	33% {opacity: 0;}
    41% {opacity: 0;}
	100% {opacity: 0;}
}
#description, #dispo, #activites, #album, #livre, #acces, #contact
{
	font-family: Georgia, Times, serif;
	font-size: 11pt;
	letter-spacing: 0.05em;
	word-spacing: 0.05em;
	border: 3px rgb(255,102,0) solid;
	border-radius:10px;
	color: rgb(51,102,255);
	background-color: rgb(255,255,207);
	padding-left: 5px;
	padding-right: 5px;
	position: absolute;
	float: left;
	width: 18.5%;
	opacity: 0.8;
}
#description
{
	height: 20%;
}
#dispo, #activites, #album, #livre, #contact
{
	height: 10%;
}
#acces
{
	height: 30%;
}
#description
{
	top: 30%;
}
#dispo 
{
	top: 53%;
}
#activites
{
	top: 66%;
}
#album
{
	top: 79%;
}
#acces
{
	top: 30%;
}
#livre
{
	top: 63%;
}
#contact
{
	top: 76%;
}
#description, #dispo, #activites, #album
{
	left: 2%;
}
#acces, #livre, #contact
{
	left: 79%;
}
#description:hover, #dispo:hover, #activites:hover, #album:hover, #livre:hover, #acces:hover, #contact:hover
{
	background-color: rgb(189,189,189);
	opacity:0.8;
}
#titre
{
	color: rgb(255,102,0);
	font-family: Georgia, Times, serif;
	font-size: 14pt;
	letter-spacing: 0.05em;
	word-spacing: 0.05em;
	font-style: italic;
	font-weight: bold;
}
#texte
{
	font-family: Georgia, Times, serif;
	font-size: 11pt;
	letter-spacing: 0.05em;
	word-spacing: 0.05em;
	font-style: italic;
	font-weight: normal;
	color: rgb(51,102,255);
	width: 100%;
	height: 50%;
}

	