/* ///////////// POLICES ///////////// */

@font-face {
font-family: 'Helvetica';
src: url('helvetica_lt_boldoblique-Web.eot');
src: url('helvetica_lt_boldoblique-Web.eot?iefix') format('eot'),url('helvetica_lt_boldoblique-Web.woff') format('woff'),url('helvetica_lt_boldoblique-Web.ttf') format('truetype');
font-weight: bold;
font-style: italic;
}

@font-face {
font-family: 'Helvetica';
src: url('helvetica_lt_bold-Web.eot');
src: url('helvetica_lt_bold-Web.eot?iefix') format('eot'),url('helvetica_lt_bold-Web.woff') format('woff'),url('helvetica_lt_bold-Web.ttf') format('truetype');
font-weight: bold;
font-style: normal;
}

@font-face {
font-family: 'Helvetica';
src: url('helvetica_lt_compressed-Web.eot');
src: url('helvetica_lt_compressed-Web.eot?iefix') format('eot'),url('helvetica_lt_compressed-Web.woff') format('woff'),url('helvetica_lt_compressed-Web.ttf') format('truetype');
font-weight: normal;
font-style: italic;
}

@font-face {
font-family: 'Helvetica';
src: url('helvetica_lt_condensed-Web.eot');
src: url('helvetica_lt_condensed-Web.eot?iefix') format('eot'),url('helvetica_lt_condensed-Web.woff') format('woff'),url('helvetica_lt_condensed-Web.ttf') format('truetype');
font-weight: lighter;
font-style: normal;
}

@font-face {
font-family: 'Helvetica';
src: url('helvetica_lt_extracompressed-Web.eot');
src: url('helvetica_lt_extracompressed-Web.eot?iefix') format('eot'),
url('helvetica_lt_extracompressed-Web.woff') format('woff'),
url('helvetica_lt_extracompressed-Web.ttf') format('truetype');
font-weight: lighter;
font-style: normal;
}

@font-face {
font-family: 'Helvetica';
src: url('helvetica_lt_oblique-Web.eot');
src: url('helvetica_lt_oblique-Web.eot?iefix') format('eot'),
url('helvetica_lt_oblique-Web.woff') format('woff'),
url('helvetica_lt_oblique-Web.ttf') format('truetype');
font-weight: normal;
font-style: italic;
}

@font-face {
font-family: 'Helvetica';
src: url('helvetica_lt_ultracompressed-Web.eot');
src: url('helvetica_lt_ultracompressed-Web.eot?iefix') format('eot'),
url('helvetica_lt_ultracompressed-Web.woff') format('woff'),
url('helvetica_lt_ultracompressed-Web.ttf') format('truetype');
font-weight:900;
font-style: normal;
}

@font-face {
font-family: 'Helvetica';
src: url('helvetica_lt-Web.eot');
src: url('helvetica_lt-Web.eot?iefix') format('eot'),
url('helvetica_lt-Web.woff') format('woff'),
url('helvetica_lt-Web.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}

/* ///////////// SITE ///////////// */


/* HEADER */

body{
width: 100%;
font-family:Helvetica;
font-size: 14px;
font-style:normal;
font-weight:normal;
margin:0 auto;
background-image:url("./img/fond2.jpg");
color:#000000;
}

.ile{
width: 38%;
float:left;
font-family:Helvetica;
font-size:100px;
text-shadow: 1px 1px 1px black;
color: #FFFFFF;
margin: 0 0;
}

#pont{
width:1235px;
}

.menu{
float:left;
font-family:Helvetica;
font-size:16px;
color: grey;
font-weight:light;
margin: 148px 35px 0 0;
border-bottom: 3px solid #5EB6DD;
letter-spacing: 2px;
margin-left : 125px;
}

.loca{
float:left;
font-family:Helvetica;
font-size:2.66em;
font-weight:UltraLight;
color: #5EB6DD;
width: 1200px;
margin: auto;
/*letter-spacing: auto;*/
text-align: center;
}

.locaen{
float:left;
font-family:Helvetica;
font-size:2.66em;
font-weight:UltraLight;
color: #5EB6DD;
margin: 20px 60px;
letter-spacing: 5px;
align : center;
}


#en{
float:right;
margin: 5px 5px;
width : 30px;
position : relative;
}

#fr{
float:right;
margin: 5px 5px;
width : 30px;
position : relative;
}







/* INDEX */

.diapo{
	width: 1000px;
	height:350px;
	font-family: Helvetica;
	font-size: 1em;
	font-weight: UltraLight;
	margin:auto auto;
	text-align: justify;
}


h1, h2 {
	text-align:center;
	margin-top:0;
}
h1 {
	padding: 1em 0;
	margin-left: 1.5em;
	font-size: 2.5em;
	font-family:  Arial, Verdana, sans-serif;
}
h1 span {
	display:block;
	margin: 0.75em 0 0 -2em;
	line-height: 1em;
	font-size: 0.55em;
}
h1 .cursive {
	margin: 0 0 0 -3em;
	font-size: 1.1em;
	line-height:0.5em;
	color: #bd9b83;
}
figure { 
	display: inline-block; 
}
a {
	text-decoration: none;
	border-bottom: 1px solid #bc9d88;
	color: #8f6b51;
}
a:hover,
a:focus {
	border-bottom: 1px dashed #bc9d88;
}
.sread {
	position: absolute;
	left:-9999px;
}
.cursive {
	font-family: cursive;
}
.center {
	text-align: center;
}

#slideshow {
	position: relative;
	width: 1160px;
	height: 350px;
	padding: 0px;
	border: 1px solid #ddd;
	margin: 5px 50px 2em;
	background: #FFF;
	background: -webkit-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: -moz-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: -ms-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: -o-linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	background: linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	
	-webkit-border-radius: 2px 2px 2px 2px;
	-moz-border-radius: 2px 2px 2px 2px;
	border-radius: 2px 2px 2px 2px;
	
	-webkit-box-shadow: 0 0 3px rgba(0,0,0, 0.2);
	-moz-box-shadow: 0 0 3px rgba(0,0,0, 0.2);
	box-shadow: 0 0 3px rgba(0,0,0, 0.2);
}

/*rebords incurvés*/
#slideshow:before,
#slideshow:after {
	position: absolute;
	display:block;
	bottom:16px;
	width: 50%;
	height: 20px;
	content: " ";
	background: rgba(0,0,0,0.1);
	
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	
	-webkit-box-shadow: 0 0 3px rgba(0,0,0, 0.4), 0 20px 10px rgba(0,0,0, 0.7);
	-moz-box-shadow: 0 0 3px rgba(0,0,0, 0.4), 0 20px 10px rgba(0,0,0, 0.7);
	box-shadow: 0 0 3px rgba(0,0,0, 0.4), 0 20px 10px rgba(0,0,0, 0.7);
	
	z-index: -10;
}
#slideshow:before {
	left:0;
	-webkit-transform: rotate(-4deg);
	-moz-transform: rotate(-4deg);
	-ms-transform: rotate(-4deg);
	-o-transform: rotate(-4deg);
}
#slideshow:after {
	right:0;
	-webkit-transform: rotate(4deg);
	-moz-transform: rotate(4deg);
	-ms-transform: rotate(4deg);
	-o-transform: rotate(4deg);
}


#slideshow .container {
	position:relative;
	width: 1160px;
	height: 350px;
	overflow: hidden;
}
/* timeline base */
#slideshow .container:after {
	position:absolute;
	bottom: 0; left:0;
	content: " ";
	background: #999;
	width: 100%;
	height: 1px;
}

@-webkit-keyframes slider {
	0%, 20%, 100%	{ left: 0 }
	25%, 45%		{ left: -100% }
	50%, 70%		{ left: -200% }
	75%, 95%		{ left: -300% }


}
@-moz-keyframes slider {
	0%, 20%, 100%	{ left: 0 }
	25%, 45%		{ left: -100% }
	50%, 70%		{ left: -200% }
	75%, 95%		{ left: -300% }


}
@keyframes slider {
	0%, 20%, 100%	{ left: 0 }
	25%, 45%		{ left: -100% }
	50%, 70%		{ left: -200% }
	75%, 95%		{ left: -300% }


}

#slideshow .slider {
	position: absolute;
	left:0; top:0;
	width: 400%;
	height: 350px;
	
	-webkit-animation: slider 32s infinite;
	-moz-animation: slider 32s infinite;
	animation: slider 32s infinite;
}




#slideshow figure {
	position:relative;
	padding:0; margin:0;
}


@-webkit-keyframes figcaptionner {
	0%, 25%, 50%, 75%, 100%						{ bottom: -55px;	}
	5%, 20%, 30%, 45%, 55%, 70%, 80%, 95%		{ bottom: 5px;		}
}
@-moz-keyframes figcaptionner {
	0%, 25%, 50%, 75%, 100%						{ bottom: -55px;	}
	5%, 20%, 30%, 45%, 55%, 70%, 80%, 95%		{ bottom: 5px;		}
}
@keyframes figcaptionner {
	0%, 25%, 50%, 75%, 100%						{ bottom: -55px;	}
	5%, 20%, 30%, 45%, 55%, 70%, 80%, 95%		{ bottom: 5px;		}
}

#slideshow figcaption {
	position:absolute;
	padding: 5px 5px; margin:0;
	left:0; right:0; bottom: 5px;
	text-align:center;
	letter-spacing: 0.05em;
	word-spacing: 0.05em;
	font-family: Georgia, Times, serif;
	background: #000;
	background: rgba(255,255,255,0.7);
	border-top: 1px solid rgb(225,225,225);
	color: #555;
	text-shadow: -1px -1px 1 rgba(255,255,255,0.3);
	
	-webkit-animation: figcaptionner 32s infinite;
	-moz-animation: figcaptionner 32s infinite;
	animation: figcaptionner 32s infinite;
}

/*@-webkit-keyframes timeliner {
	0%, 25%, 50%, 75%, 100%	{ width: 0;		}
	20%, 45%, 70%, 90%		{ width: 1160px;	}
}
@-moz-keyframes timeliner {
	0%, 25%, 50%, 75%, 100%	{ width: 0;		}
	20%, 45%, 70%, 90%		{ width: 1160px;	}
}
@keyframes timeliner {
	0%, 25%, 50%, 75%, 100%	{ width: 0;		}
	20%, 45%, 70%, 90%		{ width: 1160px;	}
}

#timeline {
	position: absolute;
	background: #999;
	bottom: 15px;
	left: 15px;
	height: 1px;
	background: rgb(214,98,13);
	background: rgba(214,98,13,.8);
	width: 0;
	
	-webkit-animation: timeliner 32s infinite;
	-moz-animation: timeliner 32s infinite;
	animation: timeliner 32s infinite;
}*/




	


#diaporama{
float:left;
margin: 5px 102px;
border: 5px solid white;
}

.txt{
	float: left;
	width: 1160px;
	font-family: Helvetica;
	font-size: 1em;
	color: #000000;
	margin: auto 50px;
	letter-spacing: 1px;
	text-align: justify;
}

.bouton{
float:left;
width: 600px;
font-family:Helvetica;
font-size:2em;
font-weight:bold;
color: white;
margin: auto 330px;
letter-spacing: 1px;
border: 2px solid white;
background-color: #5EB6DD;
text-align:center;
text-shadow: 1px 1px 1px #5EB6DD;
}

.note{
float:left;
font-size:0.9em;
color: grey;
margin: 10px 400px;
letter-spacing: 1px;
text-align:center;
font-style:italic;
}

.separation{
	float: left;
	font-family: Helvetica;
	font-size: 16px;
	color: #DDDDDD;
	font-weight: light;
	margin: 10px 275px;
	border-bottom: 7px solid white;
	letter-spacing: 2px;
	clear: inherit;
}

.accescadre{
	float: left;
	width: 400px;
	/*background-color:white;*/
	border: 1px solid black;
	margin: 15px 52px;
}

.acces {
font-family:Helvetica;
font-weight:UltraLight;
margin: auto auto;
padding: 10px 10px 15px 15px;
letter-spacing: 1px;
text-align:justify;
}

.acces h1{
font-family:Helvetica;
font-size:2.7em;
font-weight:UltraLight;
color: #5EB6DD;
margin: auto auto;
text-align:center;
}

.acces h2{
font-family:Helvetica;
font-size:14px;
color: #5EB6DD;
text-decoration:underline;
}

.acces p{
font-family:Helvetica;
font-size:14px;
color: #000000;
}

.info{
	float: left;
	width: 700px;
	margin: auto auto;
}

.boisplage {
font-family:Helvetica;
font-weight:UltraLight;
margin: auto auto;
padding: 10px 10px 15px 15px;
letter-spacing: 1px;
text-align:justify;
}

.boisplage h1{
font-family:Helvetica;
font-size:2.7em;
font-weight:UltraLight;
color: #5EB6DD;
margin: auto auto;
text-align:center;
}

.boisplage p{
font-family:Helvetica;
font-size:14px;
color: grey;
padding: 5px 5px 0 0;
}

.droite{
font-family:Helvetica;
font-size:14px;
color: grey;
padding: 10px 10px 0 0;
text-align:right;
}

.tourisme{
float:left;
font-family:Helvetica;
font-size:14px;
color: grey;
text-align:center;
width: 400px;
margin: auto 52px;
}



.loisirs{
font-family:Helvetica;
font-size:14px;
color: grey;
text-align:center;
float:left;
width: 400px;
margin: 20px 102px;
}

.loisirs h3{
color: #5EB6DD;
}

#carte{
float:left;
width: 300px;
}

/* ILE BLANCHE */





.paysage{
float:left;
width: 1100px;
font-family:Helvetica;
font-size:1em;
font-weight:UltraLight;
margin : 20px 102px;
text-align: justify;
}


.paysage img{
	width: auto;
	border: 3px solid white;
}

.titretarif{
float:left;
font-family:Helvetica;
font-size:1em;
font-weight:UltraLight;
color: grey;
text-shadow: 1px 1px 1px black;
margin : 10px 200px;/*auto 52px*/
}

.titre{
float:left;
font-family:Helvetica;
font-size:1em;
font-weight:UltraLight;
color: grey;
text-shadow: 1px 1px 1px black;
margin : auto auto;/*auto 52px*/
}


.titre img{
float:left;/*left*/
border: 3px solid white;
margin :5px 50px;/*5px 5px 25px 45px*/
}


/* LOCATION */

.maison{
float:left;
width: 450px;
font-family:Helvetica;
font-size:1em;
font-weight:UltraLight;
margin : 20px 5px;
}

#maison{
float:left;
width:560px;
border: 3px solid white;
margin : 20px 22px;
}

.maison h1{
font-size:2.3em;
font-weight:UltraLight;
color: #5EB6DD;
text-shadow: 2px 2px 2px white;
letter-spacing: 2px;
text-align:center;
}

.maison p{
font-size:1.3em;
font-weight:UltraLight;
letter-spacing: 1px;
text-align:justify;
}

.infog{
float:left;
width: 900px;
font-family:Helvetica;
font-size:1em;
font-weight:UltraLight;
margin : 20px 252px;
}

.infog th{
font-family:Helvetica;
font-size:1.5em;
font-weight:UltraLight;
color: grey;
text-shadow: 1px 1px 1px white;
margin : auto auto;
text-align: left;
}

.infog td{
font-family:Helvetica;
font-size:1.1em;
font-weight:bold;
margin : 20px 202px;
color: #969696;
text-align:justify;
}

.new{
font-style:italic;
color: #5EB6DD;
}

#tick{
width:18px;
}

.tick{
width:20px
}

.pieces{
	float: left;
	width: 10px;
	font-family: Helvetica;
	font-size: 1em;
	font-weight: UltraLight;
	margin : 20px 102px;
	text-align: justify;
}

.pieces img{
	width: 350px;
	border: 3px solid white;
}

.pieces cite{
font-style:italic;
font-size: 0.9em;
color:#5EB6DD;
}

/* TARIFS ET DISPONIBILITES */

.tarif{
float:left;
margin: 10px 50px;
}

.tarif table
{
   margin: auto;
   border-collapse: collapse;
}

.tarif thead
{
   background-color: #5EB6DD;
   color: black;
   font-weight : bold;
   font-size: 1.3em;
   font-family:Helvetica;
}

.tarif th
{
   background-color: #006600;
   color: white;
   font-size: 1.1em;
   font-family:Helvetica;
   border: 2px solid white;
}

.tarif td
{
	height: 40px; /* J'agrandis la hauteur des cellules pour que l'on puisse voir l'alignement vertical */
	vertical-align: central; /* Alignement vertical, le contenu des cellules sera placé en bas */
	border: 1px solid white;
	font-family: Helvetica;
	text-align: center;
	padding: 5px;
	border: 2px solid white;
}

.txttarif{
float:left;
font-family:Helvetica;
font-size:1em;
color: #000000;
margin: auto 200px;
letter-spacing: 1px;
text-align: justify;
}

.calendrier{
float:left;
margin-top: 50px;	
margin-left :  0px;
}

.txtdispo{
float:left;
font-family:Helvetica;
font-size:1em;
color: #000000;
margin: 60px 20px;
letter-spacing: 1px;
text-align: justify;
}

.vac{
float:left;
margin: 5px 200px;
}

.vac table
{
   margin: auto;
   border-collapse: collapse;
}

.vac thead
{
   background-color: #5EB6DD;
   color: black;
   font-weight : bold;
   font-size: 1.3em;
   font-family:Helvetica;
}

.nom
{
   background-color: #5EB6DD;
   color: black;
   font-size: 1em;
   font-family:Helvetica;
}

.vac th
{
   background-color: #006600;
   color: white;
   font-size: 1.1em;
   font-family:Helvetica;
   border: 2px solid white;
}

.vac td
{
   height: 40px; /* J'agrandis la hauteur des cellules pour que l'on puisse voir l'alignement vertical */
   vertical-align: bottom; /* Alignement vertical, le contenu des cellules sera placé en bas */
   border: 1px solid white;
   font-family:Helvetica;
   text-align: center;
   padding: 5px;
   border: 2px solid white;
}

/* CONTACT */

#formulaire{
float:left;
width:600px;
margin: 20px 102px;
}

#formulaire h1{
color :grey;
text-shadow: 1px 1px 1px white;
}

.tel{
float:left;
width:400px;
margin: 20px auto;
}

.tel h1{
color :grey;
text-shadow: 1px 1px 1px white;
text-align:center;
}


.tel p{
font-size:2em;
color :#5EB6DD;
text-shadow: 1px 1px 1px white;
text-align:center;
letter-spacing: 3px;
}

#contact{
float:left;
width:400px;
margin: auto auto;
}

/* FOOTER */

.footer{
float:left;
width: 800px;
font-family:Helvetica;
font-size:12px;
color: grey;
font-weight:light;
margin: auto 220px;
letter-spacing: 1px;
text-align: center;
}

/* LIENS */

a:link {color: grey; text-decoration: none;}

a:visited{color: grey; text-decoration: none;}

a:hover{color: #5EB6DD; text-decoration: none;}