/* define font style for all tags */
* {
    font-family: Costes;
	font-size:1em;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}

a {
	text-decoration: none;
	color: black;
	cursor: pointer;
}


#background {
    position: absolute;
    top:0em;
    /*right:-100%;*/
    right:0%;
    bottom:2em;
    margin-bottom:2%;
    width:100%;
    overflow: hidden;
    /*opacity:0;*/
    opacity:1;
    text-align:center;
}

.background_bottom {
    position:absolute;
    bottom:0; 
    }

body {
    overflow: hidden;
}

#contact_popup_quit {
    position:absolute;
    top:0.2em;
    right:0.2em;
    z-index:4;
}

#clarins_prices {
    position:absolute;
	margin:0px;
	margin-left: auto;
	margin-rigth: auto;
    top: 5em;
    width:50%;
    left: 50%;
    margin-left:-8.5em;
    text-align:left;
    font-size: 1em;
    overflow:hidden;
    opacity:1;
    z-index:2;
    visibility:hidden;
    color:white;
}

#clarins_prices span{
    font-size: 1.5em;
}

#clarins_prices .item{
    display:none;    
}

#costes_title{
    position: absolute;
    top:0.2em;
    width: 100%;
    margin: auto;
    font-size: 3em;
    text-align:center;
    z-index:3;
    }

#costes_title_bg{
    position: absolute;
    top:0;
    width: 100%;
    height:3.2em;
`   margin: auto;
    font-size: 1em;
    text-align:center;
    z-index:2;
    background-color:#666666;
    opacity:0.5;
    }

.fullscreen {
	position: absolute;
	margin-left: auto;
    margin-right: auto;
	width: 100%;
	height:100%;
    top:0;
	background: #000;
	visibility:hidden;
	z-index:4;
}

.global {
    position: absolute;
    width:80%;
    height: 100%;
    margin: 0px;
	left:10%;
    top:0%;
    text-align: left;/*permet de centrer les div IE */
}

#hotelcostes_background {
    position:absolute;
    overflow:hidden;
    width:60em;
    top:2%;
    left:50%;
    margin-left:-30em;
    bottom:2.4em;
    z-index:1;
    padding: 0;
    text-align:center;
}

#hotelcostes_background_dev {
    position:absolute;
    overflow:hidden;
    width:100%;
    top:2%;
    left:0;
    bottom:2.4em;
    z-index:1;
    padding: 0;
    text-align:center;
}

#hotelcostes_contact, #music_link, #djemila_link, #palace_link, #roses_contact {
    position: absolute;
    width: 20em;
    top:50%;
    left:50%;
    margin-left:-10em;
    visibility: hidden;
    text-align: center;
    padding-top:2em;
    padding-bottom:2em;
    z-index:15;
    background-color: white;
    border: solid 1px grey;
}

#hotelcostes_resa_tarifs, #hotelcostes_contact_link, #hotelcostes_resa{
    position: absolute;
    width: 100%;
    top: 45%;
    text-align: center;
    z-index:2;
    color: white;
    font-size:1.2em;
    opacity:0;
    }

#hotelcostes_contact_link {
    opacity:0;
    top:50%;
}

#hotelcostes_resa {
    opacity:1;
}

#hotelcostes_resa_contact_dev{
    position: absolute;
    left: 50%;
    top: 14em;
    margin-left: -8.7em;
    text-align: center;
    z-index:2;
    color: black;
    font-size:1.2em;
    opacity:0;
    }

#hotelcostes_resa_tarifs a, #hotelcostes_contact_link a, #hotelcostes_resa a {
	border-bottom: solid 0px black;
    color: white;
   }

#hotelcostes_resa_contact_dev a {
	border-bottom: solid 0px black;
    color: black;
   }

#hotelcostes_resa_tarifs a:hover, #hotelcostes_contact_link a:hover, #hotelcostes_resa_contact_dev a:hover, #hotelcostes_resa a:hover { 
	border-bottom: solid 2px grey;
	color: grey;
   }


#hotelcostes_title {
    position: absolute;
    top:-10%;
    left:50%;
    margin: 0px;
	margin-left: -5.7em;
    text-align: center; 
    z-index:2;      
    font-size: 3em;
    color:white;
    opacity:0;
    }

#hotelcostes_title_dev {
    position: absolute;
    top:-10%;
    left:50%;
    margin: 0px;
	margin-left: -5.7em;
    text-align: center; 
    z-index:2;      
    font-size: 3em;
    color:black;
    opacity:0;
    }

#hotel_costes_tarifs {
    position: absolute;
    width: 20em;
    height: 3em;
	left: 50%;
    margin-left: -12em;
    top: 50%;
    z-index: 15;
    text-align: left;
    font-size: 0.9em;
    background-color: white;
    color: black;
    border: solid 1px black;
    padding: 2em;
    visibility: hidden;
}

#hotel_costes_tarifs_items {
    position: absolute;
    top:2em;
	left: 1em;
    width: 100%;
    z-index: 1;
    text-align: left;
    font-size: 0.9em;
}

#hotel_costes_tarifs_prices {
    position: absolute;
    top:2em;
	right: 1em;
    width: auto;
    z-index: 1;
    text-align: right;
    font-size: 0.9em;
}

.hotelcostes_video {
   position:relative;
   float:left;
   width:15em;
   height:auto;
   margin:0;
   padding:0em;
}

.link_white{
    color:white;    
}

.link_white:hover{
    color:white;  
}

#makeMeScrollable
{
    position:absolute;
    left:0;
    right:0;
    top:0;
    bottom:3em;
    opacity:0;
}
		
#makeMeScrollable div.scrollableArea *
{
	border: none;
	position: relative;
	float: left;
	margin: 0;
	padding: 0;
}
	
.subPanel {
	font-size: 12px;
	font-family: Calibri, Courier, Sans-Serif;
}

.subPanel span {
	color: Blue;
	text-decoration: underline;
	cursor: pointer;
}
		
.subPanel span.notClickable {
	color: inherit;
	text-decoration: none;
	cursor: inherit;
}
		
.subPanel {
	background: #efefef;
	padding: 7px;
	margin-bottom: 5px;
}

#makeMeScrollable div.scrollableArea .contentBox {
	height: 308px;
	width: 200px;
	border: solid 1px #ccc;
	padding: 10px;
	margin: 0px 5px;
}

#makeMeScrollable div.scrollableArea .contentBox img {
    margin-bottom: 10px;
}

#menu /* Menu  */ {
    position: absolute;
	bottom: 1%;
    width:100%;
	height: 1.25em;
	margin:0px;
	margin-left: auto;
	margin-rigth: auto;
	text-align: center;
    padding:0px;
    font-size:1.25em;
    z-index: 2;
}

#menu ul {
    position:relative;
    width:100%;
	margin:0px;
	margin-left: auto;
	margin-rigth: auto;
    padding:0;
    list-style-type:none;
    text-align:center;
}

#menu ul li {
    display:inline;
    margin:0 auto;
    padding:0;
    position:relative;
}

#menu ul li a {
	border-bottom: solid 0px black;
    color:black;
}

#menu ul li a:hover {
	border-bottom: solid 2px #666666;
	color:#666666;
}

#menu ul li a.menu_selected {
	border-bottom: solid 2px black;
	color:black;
}

#restaurants {
    position:absolute;
	margin:0px;
	margin-left: auto;
	margin-rigth: auto;
    top: 5em;
    width:38em;
    right: -100%;
    margin-bottom:2%;
    text-align:left;
    font-size: 100%;
    overflow:hidden;
    opacity:0;
    z-index:2;
    }

#scroller_cd, #scroller_watche_luggage, #scroller_body_home{
    opacity:0;    
}

#scroller_container{
    position:absolute;
    width:100%;
    padding:0;
	text-align: center;
    z-index:1;
    font-size: 1em;
    overflow:hidden;
}

#scroll_container_rooms{
    position:absolute;
    left:0;
    right:0;
    top:0;
    bottom:3em;
    opacity:1;    
}

#banners{
    position:absolute;
    left:0;
    right:0;
    bottom:0em;
    top:4em; 
}

.scroller_container_body_home{
    top:50%;
    margin-top:-15.2em;
}

.scroller_container_cd{
    top:50%;
    margin-top:-5.05em;
}

.scroller_container_watche_luggage{
    top:50%;
    margin-top:5.2em;
}

/* Container DIV - automatically generated */
.simply-scroll-container { 
	position: relative;
}

/* Clip DIV - automatically generated */
.simply-scroll-clip { 
	position: relative;
	overflow: hidden;
	z-index: 2;
}

/* UL/OL/DIV - the element that simplyScroll is inited on
Class name automatically added to element */
.simply-scroll-list { 
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	overflow: hidden;
	margin: 0;
	padding: 0;
	list-style: none;
}
	
.simply-scroll-list li {
	padding: 0;
	margin: 0;
	list-style: none;
}
	
.simply-scroll-list li img {
	border: none;
	display: block;
}

/* Custom class modifications - adds to / overrides above
.simply-scroll is default base class */

/* Container DIV */
.simply-scroll { 
	width: 100%;
    height:10em;
    margin:0;
    margin-left:auto;
    margin-right:auto;
}

/* Clip DIV */
.simply-scroll .simply-scroll-clip {
	width: 100%;
	height: 100%;
}
	
/* Explicitly set height/width of each list item */	
.simply-scroll .simply-scroll-list li {
	float: left; /* Horizontal scroll only */
	height:10em;
	width:10em;
}

.simply-scroll-list li img{
	height:10em;
	width:10em;
}

.sleep_category{
    opacity:0; 
}

#submenu {
    position: absolute;
    top:3.2em;
    left:-15em;
    width:18em;
    overflow: hidden;
    background-color: #fff;
    opacity: 1;
    z-index:3;
}

#submenu_click {
    position: absolute;
    top:0em;
    bottom:0em;
    right:0em;
    width:1em;
    background-color: #ff;
    z-index:3;
}

#submenu li{
    width:100%;    
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    cursor:pointer;
}

#submenu li:hover{
    background-color: grey;
}
    
#submenu li a{
    padding-left:1em;    
}

#submenu li a:hover{
    color:black;  
}

#submenu li span{
    padding-left:1em;    
}

#ulcategory {
    padding-top:0em;
    font-size:1em;
}

#ulmenu {
    padding-top:1em;
    font-size:1em;
    opacity:0;    
    padding-right:1em;
    padding-bottom:1em;
}

#video_1 {
   position:absolute;
   top:2em;
   left: 50%;
   margin-left: -30em;
   width:12em;
   height:auto;
   opacity:1;
}

#video_2 {
   position:absolute;
   top:2em;
   left: 50%;
   margin-left: -18em;
   width:12em;
   height:auto;
   opacity:1;
}

#video_3 {
   position:absolute;
   top:2em;
   left: 50%;
   margin-left:-6em;
   width:12em;
   height:auto;
   opacity:1;
}

#video_4 {
   position:absolute;
   top:2em;
   left: 50%;
   margin-left: 6em;
   width:12em;
   height:auto;
   opacity:1;
}

#video_5 {
   position:absolute;
   top:2em;
   left: 50%;
   margin-left:18em;
   width:12em;
   height:auto;
   opacity:1;
}

#video_6 {
   position:absolute;
   top:11.2em;
   left: 50%;
   margin-left:-30em;
   width:12em;
   height:auto;
   opacity:1;
}

#video_7 {
   position:absolute;
   top:11.2em;
   left: 50%;
   margin-left:18em;
   width:12em;
   height:auto;
   opacity:1;
}

#video_8 {
   position:absolute;
   top:20.4em;
   left: 50%;
   margin-left: -30em;
   width:12em;
   height:auto;
   opacity:1;
}

#video_9 {
   position:absolute;
   top:20.4em;
   left: 50%;
   margin-left: -18em;
   width:12em;
   height:auto;
   opacity:1;
}

#video_10 {
   position:absolute;
   top:20.4em;
   left: 50%;
   margin-left:-6em;
   width:12em;
   height:auto;
   opacity:1;
}


#video_11 {
   position:absolute;
   top:20.4em;
   left: 50%;
   margin-left: 6em;
   width:12em;
   height:auto;
   opacity:1;
}

#video_12 {
   position:absolute;
   top:20.4em;
   left: 50%;
   margin-left:18em;
   width:12em;
   height:auto;
   opacity:1;
}

.videofullscreen {
    //border: 1px #black solid;
	width: 100%;
	position:absolute;top:0;
	display: block;
	float:left;
}

#video_copyright {
	position:absolute;
	bottom:0.5em;
    right:0.75em;
    text-align:right;
    color:white;
}

#navigation{
position:absolute;
width:100%;
bottom:4.6em;
height:3em;
z-index:5;
opacity:1;
}


#navigation_control{
position:absolute;
top: 0em;
width:20em;
left:50%;
bottom:0em;
margin-left: -10em;
background-color:black;
opacity:0.6;
-moz-border-radius: 1em;
-webkit-border-radius: 1em;
border-radius: 1em;
text-align:center;
}
#navigation_control img{
    position:absolute;
    height:1.5em;
    margin-top:0.75em;   
}

#navigation_left{
position:absolute;
top: 0;
left:0;
bottom:0em;
right:50%;
margin-right:1.5em;
}
#navigation_center{
position:absolute;
width:3em;
top: 0;
bottom:0;
left:50%;
margin-left:-1.5em;
}
#navigation_right{
position:absolute;
top: 0;
left:50%;
margin-left:1.5em;
right:0;
bottom:0em;
}