/* CSS Document */
/*
MENU
*/
#menu{
position:absolute;
margin-top:101px;
text-align:center;
z-index:100;
}

#menu a:link, #menu a:visited{
text-decoration:none;
color:#25414D;
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size:12px;
line-height:225%; 
background-color:#e3e3d7;
}
#menu a:hover{
text-decoration:none;
color:#101C21;
background-color: #CDDEBA; 
}
/**************
WELCOME MENU
***************/

#welcome_menu{
position:absolute;
}
#welcome_menu ul, li{
width:73px;
height:27px;
/* for IE7 */
float:left;
}
#welcome_menu a:link, #welcome_menu a:visited {
display:block;
width:73px;
height:27px;
border-bottom-color:#fff;
border-bottom-style:solid;
border-bottom-width:3px;
}


/*****************
ACCOMMODATION MENU
******************/
#accom_menu{
position:absolute;
margin-left:73px;
z-index:100;
}
#accom_menu ul{
left:0;
top:0;
}
#accom_menu li{
float:left;
position:relative;
}

#accom_menu a:link, #accom_menu a:visited {
display:block;
width:107px;
height:27px;
border-bottom-color:#fff;
border-bottom-style:solid;
border-bottom-width:3px;
}
/* For IE5.5 and IE6 give the hovered links a position relative and a change of background and foreground color. 
This is needed to trigger IE to show the sub levels */
* html #accom_menu li a:hover {
position:relative; 
background: #CDDEBA; 
color:#101C21;
font-size:12px;
line-height:225%; 
font-family: Arial, Verdana, Helvetica, sans-serif;}

/* get rid of the table */
#accom_menu table {position:absolute; border-collapse:collapse; top:0; left:0; z-index:100;}

/* hide the sub levels and give them a positon absolute so that they take up no room */
#accom_menu ul ul{
display:block;
visibility:hidden;
position:absolute;
margin-top:27px;
}
#accom_menu ul ul li {
width:107px;
height:27px;
}
/* make the second level visible when hover on first level link and position it */
#accom_menu ul li:hover ul, #accom_menu ul a:hover ul {
visibility:visible;
border:none;
}
#accom_menu li a:hover ul {
visibility:visible; left:0px; top:0px; lef\t:0px; to\p:0px;
}

/****************
SUSTAINABLE MENU
*****************/
#sustainable_menu{
position:absolute;
margin-left:180px;
z-index:100;
}
* html #sustainable_menu{margin-top:-1px;}
#sustainable_menu ul{
left:0px;
top:0px;
}
#sustainable_menu li{
float:left;
position:relative;
}
#sustainable_menu a:link, #sustainable_menu a:visited {
display:block;
width:120px;
height:27px;
border-bottom-color:#fff;
border-bottom-style:solid;
border-bottom-width:3px;
}
/* For IE5.5 and IE6 give the hovered links a position relative and a change of background and foreground color. This is needed to trigger IE to show the sub levels */
* html #sustainable_menu li a:hover {
position:relative; 
background:#CDDEBA; 
color:#101C21;
font-size:12px;
line-height:225%; 
font-family: Arial, Verdana, Helvetica, sans-serif;
}

/* hide the sub levels and give them a positon absolute so that they take up no room */
#sustainable_menu ul ul {
display:block;
visibility:hidden;
position:absolute;
margin-top:27px;
}
#sustainable_menu ul ul li {
width:120px;
height:27px;
}
/* make the second level visible when hover on first level link and position it */
#sustainable_menu ul li:hover ul, #sustainable_menu ul a:hover ul {
visibility:visible;
border:none;
}
#sustainable_menu li a:hover ul {
visibility:visible; left:0px; top:0px; lef\t:0px; to\p:0px;
}

/*************
RETREATS MENU
**************/
#retreats_menu{
position:absolute;
margin-left:300px;
z-index:100;
}
* html #retreats_menu{margin-top:-1px;}
#retreats_menu ul{
left:0px;
top:0px;
}
#retreats_menu li{
float:left;
position:relative;
}
#retreats_menu a:link, #retreats_menu a:visited {
display:block;
width:115px;
height:27px;
border-bottom-color:#fff;
border-bottom-style:solid;
border-bottom-width:3px;
}
/* For IE5.5 and IE6 give the hovered links a position relative and a change of background and foreground color. This is needed to trigger IE to show the sub levels */
* html #retreats_menu li a:hover {
position:relative; 
background: #CDDEBA; 
color:#101C21;
font-size:12px;
line-height:225%; 
font-family: Arial, Verdana, Helvetica, sans-serif;}

/* hide the sub levels and give them a positon absolute so that they take up no room */
#retreats_menu ul ul {
display:block;
visibility:hidden;
position:absolute;
margin-top:27px;
}
#retreats_menu ul ul li {
width:115px;
height:27px;
}
/* make the second level visible when hover on first level list OR link */
#retreats_menu ul li:hover ul, #retreats_menu ul a:hover ul {
visibility:visible;
border:none;
}
/************
HEAVEN MENU
*************/
#heaven_menu{
position:absolute;
margin-left:415px;
}
#heaven_menu ul, li{
width:110px;
height:27px;
}
#heaven_menu a:link, #heaven_menu a:visited {
display:block;
width:110px;
height:27px;
border-bottom-color:#fff;
border-bottom-style:solid;
border-bottom-width:3px;
}
/************
NEWS MENU
*************/
#news_menu{
position:absolute;
left:525px;
}
#news_menu ul, li{
width:55px;
height:27px;
}
#news_menu a:link, #news_menu a:visited {
display:block;
width:55px;
height:27px;
border-bottom-color:#fff;
border-bottom-style:solid;
border-bottom-width:3px;
}
/************
ABOUT MENU
*************/
#about_menu{
position:absolute;
margin-left:580px;
z-index:100;
}
* html #about_menu{margin-top:-1px;}
#about_menu ul{
left:0px;
top:0px;
}
#about_menu li{
float:left;
position:relative;
}
#about_menu a:link, #about_menu a:visited {
display:block;
width:73px;
height:27px;
border-bottom-color:#fff;
border-bottom-style:solid;
border-bottom-width:3px;
}
/* For IE5.5 and IE6 give the hovered links a position relative and a change of background and foreground color. This is needed to trigger IE to show the sub levels */
* html #about_menu li a:hover {
position:relative; 
background: #CDDEBA; 
color:#101C21;
font-size:12px;
line-height:225%; 
font-family: Arial, Verdana, Helvetica, sans-serif;
}

/* hide the sub levels and give them a positon absolute so that they take up no room */
#about_menu ul ul {
display:block;
visibility:hidden;
position:absolute;
margin-top:27px;
}
#about_menu ul ul li {
width:73px;
height:27px;
}
/* make the second level visible when hover on first level list OR link */
#about_menu ul li:hover ul, #about_menu ul a:hover ul {
visibility:visible;
border:none;
}