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

body {
	background-color:#cabea8;
	background-image:url(img/body-fond.jpg);
	background-position:center top;
	}

#cadre-general {	
	position: absolute;
	width: 950px;
	height: 540px;
	margin-left: -475px; /* moitié de la largeur */
	margin-top: -270px; /* moitié de la hauteur */
	left: 50%;
	top: 50%;
	border: 1px solid #333;
	background-color: #cabea8;
	}
	
/* BANDEAU HAUT */
#bandeau-fond-drapeau_ {
	position:absolute;
	left:0px;
	top:0px;
	width:22px;
	height:109px;
	background-image:url(img/bandeau-fond-drapeau.png);
}
#hotel-dinard-langue-fr_ {
	position:absolute;
	left:2px;
	top:23px;
	width:15px;
	height:10px;
}
#hotel-dinard-langue-en_ {
	position:absolute;
	left:2px;
	top:40px;
	width:15px;
	height:10px;
}
#hotel-dinard-langue-de_ {
	position:absolute;
	left:2px;
	top:56px;
	width:15px;
	height:10px;
}


#bandeau-logo-dinard-hotel-plus_ {
	position:absolute;
	left:22px;
	top:0px;
	width:302px;
	height:109px;
}

#bandeau-photos_ {
	position:absolute;
	left:324px;
	top:0px;
	width:151px;
	height:109px;
}

#bandeau-bretagne_ {
	position:absolute;
	left:475px;
	top:0px;
	width:105px;
	height:109px;
}

#bandeau-fond-dispo_ {
	position:absolute;
	left:580px;
	top:0px;
	width:370px;
	height:70px;
	background-image:url(img/bandeau-fond-dispo.png);
}
#consulter-dispo {
	float: right;
	left:750px;
	top:20px;
	padding-top: 10px;
	padding-right:15px;
}

#consulter-dispo a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #988f7e;
	font-weight: 700;
	text-decoration: underline;
}

#consulter-dispo a:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #ffffff;
	font-weight: 700;
	text-decoration: underline;
}

#menuHaut {
	position:absolute;
	left:580px;
	top:70px;
	width:370px;
	height:39px;
	background-image:url(img/bandeau-fond-menu.png);
}

#menuHaut ul{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	list-style: none;
	float: left;
	margin-top:8px;
	font-size: 12px;
	font-weight: bold;
}
#menuHaut li{
	float: left;
	text-align: center;
	margin-left: 10px;
}
#menuHaut li a {
	display: block;
	width: 80px;
	height: 32px;
	text-decoration: none;
	font-size: 12px;
	font-weight: bold;
	color: #FFF;
}
#menuHaut li a:hover {
	display: block;
	width: 80px;
	height: 32px;
	text-decoration: underline;
	font-size: 12px;
	font-weight: bold;
	color: #FFF;
}
	
	
/* Menu Gauche */
#menu-gauche {
	position:absolute;
	left:0px;
	top:110px;
	width:186px;
	height:185px;
	background-image:url(img/fond-menu-gauche.png);
	}
	
#menu-gauche ul {
	margin-top:15px;
	list-style-type:none;
	text-align: right;
	}
	
#menu-gauche li {
	padding-top:10px;
	padding-right:5px;
	}
	
#menu-gauche li a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	font-weight: 700;
	text-decoration: none;
	}

#menu-gauche li a:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #fcd54c;
	font-weight: 700;
	text-decoration: underline;
	background-image: url('img/icone-select-menu.gif');
	background-repeat:no-repeat;
	}

#menu-gauche li a.selected {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #fcd54c;
	font-weight: 700;
	text-decoration: underline;
	background-image: url('img/icone-select-menu.gif');
	background-repeat:no-repeat;
	}

/* ACCUEIL */
#btn-webcam {
	position:absolute;
	left:0px;
	top:300px;
	width:185px;
	height:54px;
	}

#btn-google-streetview {
	position:absolute;
	left:0px;
	top:360px;
	width:185px;
	height:54px;
	}	
	
#btn-grandes-marees {
	position:absolute;
	left:0px;
	top:420px;
	width:182px;
	height:92px;
	}
	
#photo-accueil {
	position:absolute;
	left:210px;
	top:110px;
	width:357px;
	height:258px;
	}
	
#cadre-evenement-accueil {
	position:absolute;
	left:210px;
	top:390px;
	width:357px;
	height:120px;
	background-color: #988f7e;
	}
	
#cadre-evenement-accueil-texte {
	padding:10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #ffffff;
	font-weight: 700;
	text-align: justify;
	overflow:auto;
	height:60px;
	}
	
#cadre-evenement-accueil-texte a {
	text-decoration: none;
	}
	
#cadre-texte-accueil {
	position:absolute;
	left:580px;
	top:110px;
	width:357px;
	height:400px;
	background-color: #988f7e;
	overflow:auto;
	}
	
#texte{
	padding:10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #ffffff;
	font-weight: 700;
	text-align: justify;
	}

/* DISPO */
#cadre-cyberdispo {
	position:absolute;
	left:210px;
	top:110px;
	width:720px;
	height:400px;
	background-color: #988f7e;
	overflow:auto;
	}


#tab_cyberdispo {
	position:absolute;
	padding: 1px;
	font-size: 12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: white;
	font-weight: normal;
	border: 0px solid #E1E1E1;
	width: 100%;
}

#tab_cyberdispo th {
	font-size: 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: white;
	font-weight: normal;
	}


#tab_cyberdispo .non_dispo {
	background-color: red;
}

#tab_cyberdispo .dispo {
	background-color: green;
}

.hotel1 {
	background-color: #D5D5D5;
	color: black;
	}

.hotel2 {
	background-color: #E5E5E5;
	color: black;
	}
	
a.nom_etab_cyberdispo {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FF6600;
	font-weight: normal;
	clip:   rect(auto auto auto auto);
}

a.nom_etab_cyberdispo:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FF6600;
	font-weight: normal;
	clip:   rect(auto auto auto auto);
}



.titre {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 20px;
	color: #FFFFFF;
	font-weight: normal;
	clip:   rect(auto auto auto auto);
}

.texte {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #ffffff;
	font-weight: normal;
}

.date {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FCD54C;
	font-weight: normal;
}

/* DISPO INFO BULLE*/
a.info {
   position: relative;
   color: black;
   text-decoration: none;
   border-bottom: 1px gray dotted; /* on souligne le texte */
}
a.info span {
   display: none; /* on masque l'infobulle */
}
a.info:hover {
   background: none; /* correction d'un bug IE */
   z-index: 500; /* on définit une valeur pour l'ordre d'affichage */
   cursor: help; /* on change le curseur par défaut en curseur d'aide */
}
a.info:hover span {
   font-size: 11px; /* on définit les propriétés de texte pour toutes les balises */
   font-family: Tahoma, Verdana, Arial, serif;
   
   display: inline; /* on affiche l'infobulle */
   position: absolute;

   white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */

   top: 15px; /* on positionne notre infobulle */
   left: 20px;

   background: white;

   color: black;
   padding: 3px;

   border: 1px solid #cabea8;
   border-left: 4px solid #cabea8;
}


/*LES HOTELS*/
#cadre-hotels {
	position:absolute;
	left:200px;
	top:110px;
	width:730px;
	height:400px;
	overflow:auto;
	}


#tab_hotels {
	position:absolute;
	width: 100%;
	border: 0px solid #E1E1E1;
	padding: 0px;
	
	font-size: 12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: white;
	font-weight: normal;
}

#tab_hotels td {
	border: 3px solid #cabea8;
	background-color: #988f7e;
	vertical-align: top;
}

#liste-hotels {
	margin: 3px;
	min-height:340px;
	}

#liste-hotels a.site-internet {
	font-size: 12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: white;
	font-weight: 700;
	text-decoration: none;

	}
#liste-hotels a.site-internet:hover {
	font-size: 12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: white;
	font-weight: 700;
	text-decoration: underline;
	}

/* EVENEMENT */
#cadre-evenement {
	position:absolute;
	left:210px;
	top:110px;
	width:720px;
	height:400px;
	background-color: #988f7e;
	overflow:auto;
	}

/* EVENEMENT */
#cadre-tourisme {
	position:absolute;
	left:210px;
	top:110px;
	width:720px;
	height:400px;
	background-color: #988f7e;
	overflow:auto;
	}
	
#cadre-evenement .titre {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #FCD54C;
	font-weight: 700;
	}
	
/* LOISIRS */
#cadre-loisir {
	position:absolute;
	left:210px;
	top:110px;
	width:720px;
	height:400px;
	background-color: #988f7e;
	overflow:auto;
	}
	
/* MAREES */
#cadre-marees {
	position:absolute;
	left:210px;
	top:110px;
	width:720px;
	height:400px;
	background-color: #988f7e;
	overflow:auto;
	}

/* ACCES */
#cadre-acces {
	position:absolute;
	left:210px;
	top:110px;
	width:720px;
	height:400px;
	background-color: #988f7e;
	overflow:auto;
	}
	
/* STREETVIEW */
#cadre-streetview {
	position:absolute;
	left:210px;
	top:110px;
	width:720px;
	height:400px;
	background-color: #988f7e;
	overflow:auto;
	}
	
#pano {
	width: 500px;
	height: 300px;
	padding-left: 100px;
	padding-top: 50px;
	}
/* MENTIONS */
#cadre-mention {
	position:absolute;
	left:210px;
	top:110px;
	width:720px;
	height:400px;
	background-color: #988f7e;
	overflow:auto;
	}
/* NEWSLETTER */
#cadre-newsletter {
	position:absolute;
	left:210px;
	top:110px;
	width:720px;
	height:400px;
	background-color: #988f7e;
	overflow:auto;
	}	
	
/* RECRUTEMENT */
#cadre-recrutement {
	position:absolute;
	left:210px;
	top:110px;
	width:720px;
	height:400px;
	background-color: #988f7e;
	overflow:auto;
	}
	
#cadre-annonce {
	background-color: #988f7e;
	border: 1px solid #cabea8;
	margin-left: 5px;
	margin-top: 10px;
	width: 90%;
	color: #ffffff;
	}
	
#cadre-annonce h3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #FCD54C;
	font-weight: 700;
	text-decoration: none;
	}
	
#cadre-annonce a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FCD54C;
	font-weight: 700;
	text-decoration: none;
	}
#cadre-annonce a:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FCD54C;
	font-weight: 700;
	text-decoration: underline;
	}
	
/* CARTE HOTELS DINARD */
#cadre-carte-hotels {
	position:absolute;
	left:205px;
	top:110px;
	width:730px;
	height:400px;
	background-color: #988f7e;
	overflow:auto;
	}
#googlemap {
	margin: 5px;
	width: 700px; 
	height: 350px;
	}

a.menu-carte {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FCD54C;
	font-weight: 700;
	text-decoration: none;
	}
a.menu-carte:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FCD54C;
	font-weight: 700;
	text-decoration: underline;
	}
/* PARTENAIRES */
#cadre-partenaire {
	position:absolute;
	left:210px;
	top:110px;
	width:720px;
	height:400px;
	background-color: #988f7e;
	overflow:auto;
	}
	
#cadre-partenaire .titre {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #FCD54C;
	font-weight: 700;
	}
	
/* FOOTER */
#footer {
	position:absolute;
	left:0px;
	top:520px;
	width:950px;
	height:20px;
	background-color: #988f7e;
	color:#ffffff;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: 700;
	font-size: 13px;
	}

#footer input {
	color:#ffffff;
	background-color:#988f7e;
	font-size:10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	border: 1px solid white;
	}
#footer select {
	color:#ffffff;
	background-color:#988f7e;
	font-size:10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	border: 1px solid white;
	}

.mention {
	color:#ffffff;
	background-color:#cabea8;
	font-size:10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	border: 0px solid white;
	margin-top:15px;
	margin-left:50px;
	vertical-align:bottom;
	}
	
#footer a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	font-weight: 700;
	text-decoration: none;
	}

#footer a:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #fcd54c;
	font-weight: 700;
	text-decoration: underline;
	}

	
#photo-footer {
	position:absolute;
	left:880px;	
	z-index:100;
	margin-top:-60px;
	}
	
	
#copyright {
	position:absolute;
	left:250px;
	top:540px;
	color:#000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: 500;
	font-size: 10px;
	}
	
#footer-liste-hotels {
	position:absolute;
	text-align: center;
	text-align: justify;
	top:560px;
	color:#000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: 500;
	font-size: 10px;
	
	}
#footer-liste-hotels a {
	text-align: center;
	color:#000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: 500;
	font-size: 10px;
	text-decoration: none;
	}
	
#footer-liste-hotels a:hover {
	text-align: center;
	color:#000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: 500;
	font-size: 10px;
	text-decoration: underline;
	}