/*
	CSS pour Riôtel - Principal
	Emilie - egzakt.com
	2008/01/23
*/

body {
	background-color:#9CCEE3;
	font:75%/140% Verdana, Arial, sans-serif;
	margin:0 0 5px 0;
	color:#47839B;
}

h1 {
	color:#5BB0D2;
	font:bold 1.17em/1.2em Verdana, Arial, sans-serif;
	margin:0 0 12px 0;
}

h2 {
	color:#916F5D;
	font:bold 1.5em/1.2em Verdana, Arial, sans-serif;
	margin:0 0 3px 0;
	text-transform:uppercase;
}

h3 {
	color:#916F5D;
	font:bold 1.5em/1.2em Verdana, Arial, sans-serif;
	margin:0 0 3px 0;
}

h3 a {
	color:#462F27;
	text-decoration:none;
}

h3 a:hover {
	text-decoration:underline;
}

h4 {
	color:#462F27;
	font:bold 1.17em/1.2em Verdana, Arial, sans-serif;
	margin:0 0 3px 0;
}

h4 a {
	color:#462F27;
}

h5 {
	color:#462F27;
	font:1.17em/1.2em Verdana, Arial, sans-serif;
	margin:0 0 3px 0;
}

h6 {
	color:#916F5D;
	font:bold 1.09em/1.2em Verdana, Arial, sans-serif;
	margin:0 0 3px 0;
}


p {
	margin:0;
	padding:0;
}

ol {
	margin:0;
	padding:0 0 0 22px;
}

a {
	cursor:pointer;
	color:#47839B;
	text-decoration:underline;
	outline:none;
}

a:hover {
	color:#462F27;
}

img {
	border:0;
}

#wrapper {
	width:1000px;
	margin:0 auto;
	background-color:#FFFFFF;
}


/* CONTENU
-----------------------------------------*/
#conteneur_colonnes {
	width:1000px;
	background:url(../images/tuiles/conteneur_colonnes.gif) repeat-y top right;
}

#contenu_gauche {
	float:left;
	width:200px;
}

#contenu_milieu {
	float:left;
	width:600px;
}

#contenu_droite {
	float:left;
	width:200px;
	padding-bottom:8px;
}


#contenu_gauche h1 {
	margin:0 0 2px 0;
}

#contenu_milieu .padding {
	padding:10px 20px 20px 20px;
}


/* BANNIÈRE
-----------------------------------------*/
#banniere {
	position:relative;
	width:564px;
	height:294px;
	padding:18px;
}
#contenu_accueil #banniere {
	height:344px;
}

#banniere #section_nom {
	float:right;
	padding:20px 10px 0 0;
}


/* RÉSERVER
-----------------------------------------*/
#reserver {
	width:577px;
	height:85px;
	padding:5px 8px 0 15px;
	position:absolute;
	top:0;
	left:0;
	background-color:#FFFFFF;	
}

#reserver .fermer {
	position:absolute;
	top:8px;
	right:8px;
}

#reserver .titre {
	float:left;
	width:115px;
	padding-top:12px;
}

#reserver form {
	float:left;
	width:450px;
}

#reserver label {
	color:#8E8E8E;
	font-size:0.92em;
}

#reserver input, #reserver select {
	border:1px solid #494949;
	font-size:0.92em;
	padding:2px;
}

#reserver .bouton {
	position:absolute;
	bottom:8px;
	right:8px;
	border:0;
	padding:0;
}

#reserver #champ_destination {
	float:left;
	width:120px;
	padding-bottom:4px;
}

#reserver #champ_arrivee {
	float:left;
	position:relative;
	width:230px;
	padding-bottom:4px;
}

.datepicker_trigger {
	position:absolute;
	top:15px;
	right:0;
}

#reserver #champ_adultes {
	float:left;
	width:120px;
}

#reserver #champ_nuits {
	float:left;
	width:105px;
}

#reserver #champ_enfants {
	float:left;
	width:150px;
	padding-top:8px;
}

#reserver #champ_enfants a {
	font-size:0.92em;
	line-height:1.2em;
	color:#5BB0D2;
}

#reserver #champ_enfants a:hover {
	color:#47839B;
}


/* NAVIGATION
-----------------------------------------*/
ul#navigation {
	list-style-type:none;
	margin:0;
	padding:0;
	width:198px;
}

ul#navigation li {
	display:inline;
}

ul#navigation a {
	display:block;
	width:170px;
	padding:5px 8px 5px 20px;
	text-decoration:none;
	color:#47839B;
	background-color:#DEEEF5;
	border-bottom:1px solid #FFFFFF;
	line-height:1.3em;
}

#navigation a:hover, #navigation a.selected, #navigation a.selected:hover {
	background-color:#916F5D;
	color:#FFFFFF;
}

ul#navigation ul {
	list-style-type:none;
	margin:0;
	padding:3px 0 3px 10px;
}

ul#navigation ul li {
	display:block;
	position:relative;
}

ul#navigation ul a {
	padding:2px 8px 2px 23px;
	width:150px;
	color:#5BB0D2;
	background-color:#FFFFFF;	
	border-bottom:0;
	text-transform:uppercase;
	font-size:0.92em;
}

ul#navigation ul a span {
	position:absolute;
	top:1px;
	left:10px;
}

ul#navigation ul a:hover, ul#navigation ul a.selected, ul#navigation ul a.selected:hover {
	background-color:#FFFFFF;
	color:#614d47;
	text-decoration:none;
}


/* HÔTELS VEDETTES
-----------------------------------------*/
#hotels_vedettes {
	position:relative;
	height:330px;
	background:url(../images/tuiles/hotels_vedettes.jpg) no-repeat top left;
}
#contenu_accueil #hotels_vedettes {
	height:380px;
	background-image:url(../images/tuiles/hotels_vedettes_accueil.jpg);
}

#hotels_vedettes .langue {
	text-align:right;
	height:54px;
	padding:10px 8px 0 0;
}

#hotels_vedettes .langue a {
	font:bold 0.83em/1.5em Verdana, Arial, sans-serif;
	color:#FFFFFF;
	text-decoration:none;
	text-transform:uppercase;
}

#hotels_vedettes .langue a:hover {
	text-decoration:underline;
}

#hotels_vedettes h4 {
	padding-left:19px;
	margin:0;
	color:#FFFFFF;
	font:bold 1.09em/1em Verdana, Arial, sans-serif;
	
	background:url(../images/tuiles/degrade.png) no-repeat 10px top;
	line-height:22px;
	
}

* html #hotels_vedettes h4 {
	background-image: none;
}

#hotels_vedettes h4.gaspesie {
	padding-top:80px;
	background-position: 10px 80px;
}
#contenu_accueil #hotels_vedettes h4.gaspesie {
	padding-top:120px;
	background-position: 10px 120px;
}

#hotels_vedettes ul {
	list-style-type:none;
	margin:0px 0 5px 19px;
	padding:0;
}

#hotels_vedettes li {
	font:bold 0.83em/1.2em Verdana, Arial, sans-serif;
	padding-top:5px;
}

#hotels_vedettes ul a {
	color:#DFD6C1;
	text-decoration:none;
	text-transform:uppercase;
}

#hotels_vedettes ul a:hover {
	color:#FFFFFF;
}


/* ACCUEIL
-----------------------------------------*/
#contenu_gauche .bloc_texte {
	padding:20px 27px 20px 20px;
	font:bold 0.92em/1.4em Verdana, Arial, sans-serif;
}

#contenu_accueil {
	float:left;
	width:800px;
}

#contenu_accueil #banniere {
	float:left;
}

#contenu_accueil #hotels_vedettes {
	float:left;
	width:200px;
}

#contenu_accueil #banniere_intro {
	clear:left;
	width:800px;
	height:116px;
}

#contenu_accueil #banniere_intro a {
	color:#04275f;
}

#contenu_accueil #banniere_intro .bloc_texte {
	color:#fff;
	width:360px;
	margin-left:418px;
	padding-top:18px;
	font:bold 0.92em/1.5em Verdana, Arial, sans-serif;
}

#contenu_accueil #forfaits a {
	float:left;
	margin:20px 4px 15px 12px;
	position:relative;
	color:#FFFFFF;
	font:0.92em/1em Tahoma, Verdana, Arial, sans-serif;
}

#contenu_accueil #forfaits a:hover {
	color:#e3dcd7;
}

#contenu_accueil #forfaits a span {
	position:absolute;
	bottom:8px;
	right:10px;
}


#contenu_accueil #promotions {
	margin:12px 20px 0 12px;
	font:0.92em/1.3em Verdana, Arial, sans-serif;
}

#contenu_accueil #promotions .item {
	width:364px;
	position:relative;
	padding:0 12px 0 0;
}

#contenu_accueil #promotions .photo {
	float:left;
	position:relative;
	width:130px;
}

#contenu_accueil #promotions .photo .rabais {
	position:absolute;
	bottom:15px;
	left:25px;
}

#contenu_accueil #promotions .bloc_texte {
	margin:10px 0 0 142px;
}

#contenu_accueil #promotions h2 {
	font:bold 1.17em/1.2em Verdana, Arial, sans-serif;
	text-transform:none;
}

#contenu_accueil #promotions h2 a {
	text-decoration:none;	
}

#contenu_accueil #promotions h2 a:hover {
	text-decoration:underline;
}

#contenu_accueil #promotions .sous_titre {
	font-weight:bold;
	color:#F5811F;
}

#contenu_accueil #promotions .detail {
	position:absolute;
	bottom:10px;
	right:12px;
}

#contenu_accueil #promotions .detail a {
	text-decoration:none;
}

#contenu_accueil #promotions .detail a span {
	text-decoration:underline;
}

/* personnalisations */
#contenu_accueil #promotions .gauche {
	float:left;
	background-color:#F5F4F1;
}
#contenu_accueil #promotions .droite {
	float:right;
	background-color:#EFF7FA;
}

#contenu_accueil #promotions .gauche h2 a {
	color:#462F27;
}
#contenu_accueil #promotions .droite h2 a {
	color:#091858;
}

#contenu_accueil #promotions .gauche .intro {
	color:#916F5D;
}
#contenu_accueil #promotions .droite .intro {
	color:#47839B;
}

#contenu_accueil #promotions .gauche .detail a {
	color:#462F27;
}
#contenu_accueil #promotions .droite .detail a {
	color:#091858;
}

#contenu_accueil #promotions .gauche .detail a:hover {
	color:#916F5D;
}
#contenu_accueil #promotions .droite .detail a:hover {
	color:#47839B;
}


/* HOTELS
-----------------------------------------*/
ul#onglets {
	list-style-type:none;
	margin:11px 9px 5px 9px;
	padding:0;
	overflow:auto;
	height:1%;
}

ul#onglets li {
	float:left;
}

ul#onglets a {
	float:left;
	width:144px;
	padding:6px 0;
	text-align:center;
	margin:0 1px 1px 0;
	background-color:#EEE9DE;
	color:#916F5D;
	text-decoration:none;
	font-size:0.92em;
	line-height:1.2em;
}

ul#onglets a:hover, ul#onglets a.selected, ul#onglets a.selected:hover {
	background-color:#462F27;
	color:#FFFFFF;
}

h2.hotel_nom img {
	position:relative;
	top:3px;
}

#localisation {
	margin-top:15px;
}

#localisation a#afficher_gmap {
	float:left;
	position:relative;
	height:25px;
	padding:10px 0 0 40px;
	margin:0 35px 0 0;
}

#localisation a#afficher_gmap img {
	position:absolute;
	top:0;
	left:0;
}

#localisation a#afficher_gemap {
	float:left;
	position:relative;
	height:25px;
	padding:10px 0 0 31px;
}

#localisation a#afficher_gemap img {
	position:absolute;
	top:5px;
	left:0;
}


#promotions_gauche {
	background-color:#f5f4f1;
}

#promotions_gauche h2 a {
	color:#462F27;
	text-decoration:none;
	font-size:0.80em;
	text-transform:none;
	line-height:1.2em;
}

#promotions_gauche h2 a:hover {
	text-decoration:underline;
}

#promotions_gauche .sous_titre {
	color:#f5811f;
	font-size:1em;
}

#promotions_gauche .intro {
	color:#916F5D;
	font-weight:normal;
	font-size:1em;
}

#promotions_gauche .detail {
	color:#916F5D;
	font-weight:normal;
	display:block;
	margin-top:12px;
	text-align:right;
}

/* GALERIE
-----------------------------------------*/
#galerie {
	margin:5px 10px;
	width:180px;
}

#galerie #pagination {
	background-color:#FFFFFF;
	color:#916F5D;
	font:0.83em/1.2em 'Trebuchet MS', Verdana, Arial, sans-serif;
	padding:6px;
	text-align:center;
}

#galerie #pagination #precedent {
	float:left;
	width:12px;
	height:12px;
}

#galerie #pagination #suivant {
	float:right;
	width:12px;
	height:12px;
}

#galerie .set {
	text-align:center;
}

#galerie .set img {
	margin-top:5px;
}


/* FORFAITS LISTE, PROMOTIONS LISTE
-----------------------------------------*/
#forfaits_liste h2, #promotions_liste h2 {
	margin:0;
	padding-top:12px;
	border-top:1px solid #d5e8f0;
}

#forfaits_liste ul, #promotions_liste ul {
	list-style-type:none;
	margin:0;
	padding:12px 0 0 0;
}

#forfaits_liste li, #promotions_liste li {
	overflow:auto;
	height:1%;
	padding-bottom:15px;
}

#forfaits_liste li .apercu, #promotions_liste li .apercu {
	float:left;
	padding-right:15px;
}

#forfaits_liste li .texte, #promotions_liste li .texte {
	float:left;
	width:455px;
}

#forfaits_liste h4 a, #promotions_liste h4 a {
	text-decoration:none;
}

#forfaits_liste h4 a:hover, #promotions_liste h4 a:hover {
	text-decoration:underline;
}

#forfaits_liste .intro, #promotions_liste .intro {
	margin:0;
	font-size:0.92em;
	line-height:1.3em;
}

#forfaits_liste .actions, #promotions_liste .actions {
	padding:5px 8px;
	margin:3px 0;
	background-color:#F4F1EF;
	color:#916F5D;
	font-size:0.92em;
	line-height:1.3em;
}

#forfaits_liste .actions a.reservez {
	float:right;
}

.bloc_texte a.gauche {
	float: none;
}

#forfaits_liste .actions a.details, #promotions_liste .actions a.details {
	color:#916F5D;
}

#forfaits_liste .actions a.details:hover, #promotions_liste .actions a.details:hover {
	color:#462F27;
}


/* FORFAITS DÉTAIL, PROMOTIONS DÉTAIL
-----------------------------------------*/
#forfaits_detail h1, #promotions_detail h1 {
	float:left;
	padding-right:10px;
}

#forfaits_detail a.reservez {
	float:right;
	padding-top:2px;
}

#forfaits_detail div.reservez {
	background-color:#F4F1EF;
	text-align:right;
	padding:5px 8px;
}

#forfaits_detail a.retour, #promotions_detail a.retour {
	float:left;
	color:#916F5D;
	text-decoration:none;
}

#forfaits_detail a.retour span, #promotions_detail a.retour span {
	text-decoration:underline;
}

#forfaits_detail a.retour:hover, #promotions_detail a.retour:hover {
	color:#462F27;
}

#promotions_liste .texte {
	margin-bottom:20px;
}

/* ACTIONS
-----------------------------------------*/
#actions {
	padding:8px 18px;
}

#actions a {
	color:#916F5D;
	font:0.83em/1.5em 'Trebuchet MS', Arial, Verdana, sans-serif;
	text-decoration:none;	
}

#actions a img {
	position:relative;
	top:4px;
	padding-right:4px;
}

#actions a:hover {
	color:#47839B;
}


/* BAS
-----------------------------------------*/
#navig_bas {
	width:974px;
	list-style-type:none;
	padding:10px 13px;
	margin:0;
	background-color:#EFF7FA;
	border-top:1px solid #9CCEE3;
	font:0.83em/1.1em Verdana, Arial, sans-serif;
	color:#47839B;
}

#navig_bas li {
	display:inline;
}

#navig_bas a {
	color:#47839B;
	text-decoration:none;
}

#navig_bas a:hover {
	text-decoration:underline;
}

#signature {
	background-color:#9ccee3;
	text-align:right;
	padding-top:8px;
	font:0.75em/1em Arial, Verdana, sans-serif;
}

#signature a {
	text-transform:uppercase;
	text-decoration:none;
	color:#47839B;
}

#signature a:hover {
	text-decoration:underline;
}



/* POPUP
-----------------------------------------*/
body#popup {
	background:#FFFFFF url(../images/tuiles/popup.jpg) no-repeat 0 0;
	margin:0;
	color:#FFFFFF;
}

body#popup.formulaire_long {
	background:#FFFFFF url(../images/tuiles/popup_formulaires.jpg) no-repeat 0 0;
}

#popup #formulaire {
	position:relative;
}

#popup a#fermer {
	position:absolute;
	bottom:12px;
	left:197px;
	font:0.83em/1.1em Verdana, Arial, sans-serif;
	color:#FFFFFF;
}

#popup a#fermer:hover {
	color:#36b6e9;
}

#popup form {
	padding:100px 0 0 115px;
}

.formulaire_long #form_formulaire {
	padding: 60px 0 0 115px;
}

#popup label {
	font:1.17em/1.4em Verdana, Arial, sans-serif;
}

#form_carte label, #form_carte table tr td {
	font: 0.92em/1.2em Verdana, Arial, sans-serif;
}

#form_formulaire label {
	font:0.92em/1.4em Verdana, Arial, sans-serif;
}

#popup h1 {
	font:bold 1.5em/1em Verdana, Arial, sans-serif;
	text-transform:uppercase;
	margin:0 0 6px 0;
	color:#462F27;
}

#form_formulaire h1 {
	font:bold 1.08em/1em Verdana, Arial, sans-serif;
}

#form_carte input, #popup input, #popup textarea, #popup select {
	font:11px/13px Arial, Verdana, sans-serif;
	color:#4462F27;
	background-color:#FFFFFF;
	border:1px solid #462F27;
	padding:2px;
	margin-bottom:3px;
}

#popup select {
	padding:0;
}

#form_carte input {
	margin-bottom:6px;
}

#form_carte .radio, #popup .radio {
	border: none;
	width: 12px;
	height: 12px;
}

#form_carte #btn_envoyer, #popup #btn_envoyer {
	border:0;
	padding:0;
	margin-top:10px;
}

#popup .note {
	float:left;
	width:110px;
	padding:13px 96px 0 0;
}

#popup .message {
	position:absolute;
	top:35px;
	left:50px;
}

#popup.formulaire_long .message {
	top: 15px;
}

#popup #succes {
	position:relative;
	padding:140px 80px 0 80px;
}

#popup #merci {
	font:1.17em/1.4em Verdana, Arial, sans-serif;
	color:#FFFFFF;
}

/* BLOC TEXTE
-----------------------------------------*/
.colore {
	color:#916F5D;
}

.note {
	font:0.83em/1.3em Verdana, Arial, sans-serif;
}

.encadre {
	padding:15px;
	background-color:#EAF5F9;
	color:#916F5D;
}

.bloc_texte a {
	color:#916F5D;
}

.bloc_texte a:hover {
	color:#462F27;
}

.bloc_texte ul {
	margin:0;
	padding:0 0 0 17px;
	font-size:0.92em;
	line-height:1.3em;
}

.bloc_texte li {
	padding:2px 0;
}

.bloc_texte ul ul {
	font-size:1em;
}

.bloc_texte .bloc_deroulant, .padding .bloc_deroulant {
	border-top:1px solid #dcecf2;
	border-bottom:1px solid #dcecf2;
	margin:10px 0;
}

.bloc_texte a.lien_deroulant, .padding a.lien_deroulant {
	display:block;
	color:#47839B;
	font-weight:bold;
	text-decoration:none;
	background:url(../images/graphiques/fleche_deroulant.gif) no-repeat 2px -10px;
	padding:1px 0 1px 22px;
}

.bloc_texte a.lien_deroulant:hover, .padding a.lien_deroulant:hover {
	color:#462F27;
}

.bloc_texte .bloc_deroulant_selected a.lien_deroulant, .padding .bloc_deroulant_selected a.lien_deroulant {
	background-position:2px -68px;
	color:#462F27;
}

.bloc_texte .zone_deroulante, .padding .zone_deroulante {
	padding:3px 0 6px 22px;
}

.bloc_texte .bloc_deroulant ul, .padding .bloc_deroulant ul {
	color:#462F27;
}

.bloc_texte td, .bloc_texte th, .padding td, .bloc_texte th {
	vertical-align:top;
}


/* DIVERS
-----------------------------------------*/
.message {
	width:80%;
	margin:0 auto;
	background-color:#FFFFFF;
	border:1px solid #ff0000;
	color:#ff0000;
	padding:5px 10px;
	text-align:center;
	font:bold 12px/14px Arial, Verdana, sans-serif;
}

.erreur {
	color:#ff0000;
}

form {
	margin:0;
}

.radio {
	border: none;
}