@charset "utf-8";
*{
	margin: 0;
	padding: 0;
}
body{
	background: #27241a url(../images/commun/pattern.jpg) center top;
	font-family: "Century Gothic", Tahoma, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #efc77d;
}

a{
	text-decoration: none;
	color: #ffd687;
}
a:hover{
	/*text-decoration: underline;*/
}
ul{
	list-style: none;
}
h2{
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size:24px;
	font-weight: normal;
	color: #f0a042;
}
h3{
	margin: 0 0 20px 0;
	font-size: 18px;
	font-weight: normal;
	text-transform: uppercase;
	color: #f0a042;
}
h4{
	font-size: 14px;
	color: #b4841c;
}
p{
	text-align: justify;
}
fieldset{
	border: none;
}
input, textarea, select{
	background: transparent url(../images/commun/formTrans.png);
	border: 1px solid #40361f;
	color: #e27e01;
}
select{
	background: transparent url(../images/commun/formTrans.png)!important;
	background: #5F4C2F url(../images/commun/formTrans.png);
}
/*--------------	ref		--------------*/
h1{
	/*background: #0f0e08;*/
	padding-bottom: 2px;
	width: 99.99%;
}
h1, .baseline{
	margin: 0 auto;
	font-size: 9px;
	font-weight: normal;
	text-align: center;
	color: #6f6857;
}
.baseline a, p.tags a{
	text-decoration: none;
	color: #016060;
}
p.tags{
	font-size: 9px;
	text-align: center;
	color: #016060;
}
.baseline{
	width: 780px;
}


/*--------------	contenu principal		--------------*/
#corps{
	position: relative;
	background: transparent url(../images/commun/patternBottom.jpg) 0 461px no-repeat;
	margin: 0 auto 61px;
	padding: 70px 47px 47px 46px;
	width: 1000px;
	height: 738px;
}
#home{
	position: relative;
	background: transparent url(../images/commun/patternBottom.jpg) 0 461px no-repeat;
	margin: 0 auto 61px;
	padding: 30px 47px 47px 46px;
	width: 1000px;
	height: 778px;
}
#goHome{
	display: block;
	position: absolute;
	top: 100px;
	right: 110px;
	overflow: hidden;
	padding: 140px 0 0 0;
	width: 280px;
	height: 0!important;
	height /**/: 140px;
	z-index: 1000;
}
/*--------------	contenu		--------------*/
.content{
	background: url(../images/commun/patternTop.jpg) 0 0 no-repeat;
	padding: 138px 0 0 0;
	width: 1000px;
	min-height: 254px;
	height: auto!important;
	height: 254px;
}
#accueil{
	width: 1000px;
	height: 733px;
}
/*version avec une image en background
#accueil{
	background: url(../images/commun/homeBg.jpg) 0 0 no-repeat;
	overflow: hidden;
	padding: 744px 0 0 0;
	width: 1000px;
	height: 0!important;
	height //: 744px;
}
*/
.content p{
	margin: 0 0 10px 0;
	/*line-height: 18px;*/
}
/*--------------	gauche		--------------*/
#leftSide{
	float: left;
	background: url(../images/commun/transHigh.png) 0 0 repeat-x;
	padding: 0 52px 0 80px;
	width: 548px;
	height: 444px;
}
#flash{
	border: 1px solid #b69059;
	width: 546px;
	height: 380px;
}
#leftSide h2, .single h2{
	background-position: 0 0;
	background-repeat: no-repeat;
	margin: 0 0 9px 0;
}
/*--------------	droite		--------------*/
#rightSide{
	position: relative;
	float: left;
	background: url(../images/commun/transHigh.png) 0 0 repeat-x;
	padding: 110px 52px 0 0;
	width: 268px;
	height: 334px;
}
#rightSide ul{
	padding: 0 0 0 15px;
	list-style-type: disc;
}
#rightSide li{
	margin: 0 0 5px 0;
}
/*--------------	unique		--------------*/
.single{
	background: url(../images/commun/transHigh.png) 0 0 repeat-x;
	padding: 0 52px 0 80px;
	width: 868px;
	height: 444px;
}
/*--------------	riad		--------------*/
#ttlRiad{
	/*background-image: url(../images/titles/ttlRiad.gif);
	width: 142px;*/
}
/*--------------	chambres		--------------*/
#ttlChambres{
	/*background-image: url(../images/titles/ttlChambres.gif);*/
	width: 210px;
}

/*scroll*/
.scrollOuter{
	position: relative;
	overflow-y: hidden;
	width: 280px!important;
	width: 268px;
	height: 275px;
}
.scrollInner{
}
.scrollers{
	position:absolute;
	top: 150px;
	right: 10px;
	width: 11px;
	height: 275px;
	background: url(../images/commun/transHigh.png) 0 -70px;
}
.up, .down{
	position: absolute;
	right: 0;
	display: block;
	overflow: hidden;
	padding: 7px 0 0 0;
	width: 11px;
	height: 0!important;
	height /**/: 7px;
}
.up{
	top: -3px;
	background: url("../images/commun/up.gif") 0 0 no-repeat;
}
.down{
	bottom: -3px;
	background: url("../images/commun/down.gif") 0 0 no-repeat;
}

/*--------------	services		--------------*/
#ttlServices{
	/*background-image: url(../images/titles/ttlServices.gif);
	width: 210px;*/
}
#services dt{
	margin: 0 0 30px 0;
	font-size: 18px;
	font-weight: normal;
	text-transform: uppercase;
	color: #f0a042;
}
.collapse dd{
	min-height: 350px;
	height: auto!important;
	height: 350px;
}
#container{
	position: relative;
	overflow-y: hidden;
	height: 310px;
}
.scrollHandles{
	position: absolute;
	top: 300px;
	right: 80px;
	background: url(../images/commun/transHigh.png) 10px 0 no-repeat;
	width: 16px;
	height: 310px;
}

/*--------------	sous-menu		--------------*/
#subMenu{
	background: url(../images/commun/transSmall.png) 0 0;
	padding: 18px 0px 0 100px;
	width: 900px;
	height: 58px;
	font-size: 11px;
	text-transform: uppercase;
}
#subMenu li{
	float: left;
	background: url(../images/commun/bullet.gif) 0 8px no-repeat;
	padding: 0 0 0 17px;
	width: 160px;
	height: 28px;
}
#subMenu li.lclear{
	clear: left;
}
#subMenu li#skipSub{
	margin-left: 177px;

}
#subMenu li.current a{
	color: #DA4B09;
}
#subMenu a{
}

#services #subMenu{
	padding: 18px 0px 0 180px;
	width: 820px;
}
#services #subMenu li{
	width: 205px;
}

.button{
	display: block;
	background: url(../images/commun/gradiantBg.gif) 0 0 repeat-x;
	border: 1px solid #b2965f;
	margin: 0 0 10px 0;
	padding: 3px 10px 0;
	width: 134px;
	height: 16px;
	text-transform: uppercase;
	color: #b4841c;
}
/*--------------	plan d'acces	--------------*/
#ttlSituation{
	/*background-image: url(../images/titles/ttlSituation.gif);
	width: 210px;*/
}
/*--------------	tarifs		--------------*/
#ttlTarifs{
	/*background-image: url(../images/titles/ttlTarifs.gif);
	width: 210px;*/
}
#rates{
	margin: 42px auto 0;
	width: 864px;
	height: 320px;
}
#tarifs h2{
}
.rates{
	/*border: 1px solid #6a4629;*/
	border-collapse: collapse;
	margin: 0 0 10px 0;
	width: 864px;
	height: 320px;
}
.rates td, .rates th{
	border: 1px solid #6a4629;
	width: auto;
	vertical-align: top;
}
.rates td.borderless, .rates th.borderless{
	border: none;
}
.rates th{
	padding: 2px 5px 0;
	text-align: center;
	font-size: 11px;
	color: #f0a042;
}
.rates th strong{
	display: block;
	margin: 2px 0 0 0;
	font-weight: normal;
	font-size: 10px;
	line-height: 12px;
	color: #efc77d;
}
.rates th.left{
	text-align: left;
}
.rates td{
	padding: 2px 10px 0;
}
.odd{
	background: transparent url(../images/commun/transSmall.png);
}
#tarifs td.halfTd{
	padding-right: 32px;
	width: 400px;
}

#exclusivite{
	margin: 70px 0 0 0;
}
#exclusivite, #exclusivite table{
	height: 300px;
}
#exclusivite th, #exclusivite td{
	height: 8px;
}
#promo{
	background: url(../images/commun/transSmall.png) 0 0;
	padding: 10px 100px 0;
	width: 800px;
	height: 66px;
	font-size: 11px;
	text-transform: uppercase;
}
#promo li{
	background: url(../images/commun/bullet.gif) 0 8px no-repeat;
	padding: 0 0 0 17px;
}
#promo h3{
	margin: 0;
}
#ttlExclusivite{
	/*background-image: url(../images/titles/ttlExclusivite.gif);
	width: 338px;*/
}
.low{
	background: #4E9F45;
}
.mid{
	background: #4fdae0;
}
.high{
	background: #e04f6a;
}
/*--------------	contact		--------------*/
#ttlReservation{
	/*background-image: url(../images/titles/ttlReservation.gif);*/
	width: 210px;
}
#contact form{
	margin: 25px 0 0 0;
}
#contact fieldset{
	position: relative;
	float: left;
}
#leftField{
	width: 428px;
}
#rightField{
	width: 269px;
}
#contact label{
	display: block;
}
#contact form p{
	margin: 0 0 2px 0;
	padding: 0;
}
#contact input, #contact select{
	width: 412px;
	height: 19px;
}
#arrivee{
	position: relative;
}
#contact input#arrival{
	width: 387px;
}
#arrivee button{
	position: absolute;
	top: 18px;
	right: 8px;
}
#contact textarea{
	overflow: auto;
	width: 412px;
	height: 100px;
}
.captcha{
	margin: 10px 0 0 0;
}
.captcha label{
	margin: 0 0 5px 0;
}
#contact .captcha img{
	float: left;
	margin: 0 5px 0 0;
}
#contact .captcha p.captcha_1{
	width: 390px;
}
#contact .captcha input{
	width: 20px;
}
#contact p#submitter{
	position: relative;
	clear: both;
	padding: 20px 0 0 0;
	height: 20px;
}
#submitter input.button{
	position: absolute;
	bottom: 0;
	padding: 0 10px 0;
	width: 106px;
	height: 19px;
	font-size: 12px;
	text-transform: uppercase;
	color: #f0a042;
}
.reset{
	right: 142px;
	background: url(../images/commun/gradiantBg.gif) 0 0 repeat-x;
}
.submit{
	right: 30px;
	background: url(../images/commun/gradiant2.gif) 0 0 repeat-x;
}

.additional{
	position: relative;
	background: url(../images/commun/transSmall.png);
	height: 76px;
	font-size: 11px;
}
.additional dt{
	position: absolute;
	top: 10px;
	left: 88px;
	color: #f0a042;
	font-size: 12px;
	font-weight: bold;
}
.additional dd{
	position: absolute;
	top: 34px;
}
#first{
	left: 88px;
}
#second{
	left: 309px;
}
#third{
	left: 496px;
}
.additional dd strong{
	display: block;
	float: left;
	width: 50px;
}
/*--------------	flags		--------------*/
#flags{
	position: absolute;
	top: 40px;
	right: 65px;
	clear: both;
	height: 28px;
	text-align: right;
	font-size: 10px;
}
#home #flags{
	position: absolute;
	top: auto;
	right: auto;
	bottom: 102px;
	left: 520px;
	clear: both;
	height: 28px;
	text-align: right;
	font-size: 10px;
}
#accueil #flags{
	background-color: transparent;
}
#flags li{
	float: left;
	margin: 0 0 0 5px;
	list-style: none;
}
#flags a{
}
#bottomContact{
	right: 67px;
	text-transform: uppercase;
}
.flag{
	display: block;
	overflow: hidden;
	background-position: 0 0;
	background-repeat: no-repeat;
	padding: 12px 0 0 0;
	width: 15px;
	height: 0!important;
	height /**/: 12px;
}
#sp{
	background-image: url(../images/flags/sp.gif);
	right: 46px;
}
#en{
	background-image: url(../images/flags/en.gif);
	right: 25px;
}
#fr{
	background-image: url(../images/flags/fr.gif);
	right: 3px;
}

/*--------------	popup		--------------*/
#poping{
	background: #27241a url(../images/commun/riad-al-rimal.gif) center top no-repeat;
	padding: 200px 20px 20px 20px;
}
#poping h2{
	color: #dbc582;
}
#poping h3{
	margin: 15px 0 8px 0;
	color: #b4841c;
}
	
/*--------------	menu		--------------*/
#menu{
	position:absolute;
	bottom: 53px;
	left: 50px;
	background: transparent url(../images/commun/transparent.png);
	width: 992px;
	height: 27px;
}
#menu ul{
	position:relative;
	width: 992px;
	height: 27px;
}
#menu li{
	position: absolute;
	top: 6px;
	background: url(../images/commun/bullet.gif) right center no-repeat;
}	
#menu a{
	text-transform: uppercase;
	color: #bb7832;
}	
#menu a:hover, #menu a.current{
	color: #DA4B09;
}
#menu-riad{
	left: 19px;
	width: 87px;
}
#menu-riad a{
}
#menu-chambres{
	left: 140px;
	width: 133px;
}
#menu-services{
	left: 307px;
	width: 98px;
}
#menu-situation{
	left: 433px;
	width: 103px;
}
#menu-tarifs{
	left: 570px;
	width: 76px;
}
#menu-exclusivite{
	left: 674px;
	width: 170px;
}
#menu li#menu-reservation{
	left: 881px;
	background: none;
}

/*--------------	classes communes		--------------*/
.relative{
	position: relative;
}
.left, .tarifs th.left, .tarifs td.left{
	text-align: left;
}
.center{
	text-align: center;
}
.right{
	text-align: right;
}
.fleft{
	float: left;
}
.fright{
	float: right;
}
.fnone{
	float: none;
}
.clear{
	clear: both;
}
.lclear{
	clear: left;
}
.rclear{
	clear: right;
}
.noHeight{
	display: block;
	margin: -1px 0 0 0;
	height: 1px;
	line-height: 1px;
	font-size:1px;
}
.tenpxtop{
	margin-top: 10px;
}
.block{
	display: block;
}
.nomargin{
	margin: 0;
}
.negTopMargin{
	margin-top: inherit!important;
	margin-top: -50px;
}
.noborder, .tarifs th.noborder,  .tarifs td.noborder{
	border: none;
}
.norborder, .tarifs th.norborder,  .tarifs td.norborder{
	border-right: none;
}
.nobborder, .tarifs th.nobborder,  .tarifs td.nobborder{
	border-bottom: none;
}
.notborder{
	border-top: none;
}
.nolborder{
	border-left: none;
}
.bold{
	font-weight: bold;
}
.italic{
	font-style: italic;
}
.auto{
	width: auto;
}

.petit{
	font-size:9px;
}
.tenPixSize{
	font-size: 10px;
}
.medium{
	font-size: 14px;
}
.big{
	font-size: 24px;
}
.yellow, .orange{
	color: #DA4B09;
}

/*--------------	spry related		--------------*/
.validMsg{
	position: absolute;
	display:none;
	width:16px;
	height:16px;
}
.textfieldValidState input{
	color: #312c1b;
}
.textfieldValidState .validMsg, .textareaValidState .validMsg, .selectValidState .validMsg, .checkboxValidState .validMsg, .radioValidState .validMsg{
	display:inline;
}
#requiredName .validMsg{
	top: 20px;
	left: -20px;
}
#requiredEmail .validMsg{
	top: 20px;
	right: -20px;
}