/* CSS Document */

html, body, ul, li {
	margin: 0px;
	padding: 0px;
}

.clear {
	clear: both;
}

body {
	background:url(VBImages/Tile.jpg); font: 11px tahoma, verdana, sans-serif;
}
img { border:0px;  }

#body-bot 
{
    padding-top:8px; 
    }

#outer {
	/*background: url(VBimages/bg_top.jpg) repeat-x;*/
	min-height: 723px;
	padding: 0px 0px;
	text-align: center;
}
#wrapper {
	text-align: left;
	margin: auto;
	position: relative;
	width: 723px;
	background: url(images/Container.jpg) repeat-y;
}
#nav-BG { 
	background: url(images/NavBG.jpg) no-repeat; height:154px; position:relative; width:100%; 
}


#nav { 
background: url(images/Nav.jpg) no-repeat; height: 34px; font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#003366; 
}



#nav ul {
  padding-top: 9px; margin-left:12px;
}
#nav li {
  display: inline; 
  padding: 0px 10px;
}

.normul ul{ margin-left:15px; list-style-type: disc;}
.normul li{ margin-bottom:3px;}

#HeadImage {
  margin-left:2px;
}

#items {
/* padding: top right bottom left; */
padding: 0px 0px 0px 35px;
}

#item {
font: 11px arial, tahoma, verdana, sans-serif; color:#ffffff;
}

#contentTxt {
padding-right:10px;
}

.altcolour {
font: 11px arial, tahoma, verdana, sans-serif; color:#bebaae;
}

#RightNav {
  float:right; width:298px; margin-right:0px; padding-left:0px;
}

* html #RightNav {
  float:right; width:288px; margin-right:0px; padding-left:0px;
}

#RNavTxt {
font: 10px arial, verdana, sans-serif; padding-left:5px; padding-right:35px; padding-top:5px; color:#2f2f30;
}

.RNavTabs { 
background-color:#dfe6ec; width:150px; height:23px; margin-left:-8px; padding-left:8px; padding-top:6px; margin-top:4px; font: 11px arial, verdana, sans-serif; color:#003366;
}

#RNavLgTab { 
background-color:#f4f4f3; width:150px; height:150px; margin-left:-8px; padding-left:8px; padding-top:10px; margin-top:4px; font: 11px arial, verdana, sans-serif; color:#4c5560;
}

#mid{
font: 11px arial, tahoma, verdana, sans-serif; color:#2f2f30;
}

#midblock{
width:420px; margin-left:0px; padding-top:7px; padding-right:0px; padding-left:0px; background:right top url(images/BottomLeftBG.jpg) no-repeat;
}

#midblocktxt{
margin-left:38px; padding-top:10px; padding-right:10px;
}

#midblockright{
width:280px; margin-right:0px; padding-top:12px; padding-right:10px; padding-left:0px; float:right;
}

#midblockrighttxt{
padding-left:0px; text-align:right; margin-right:28px; 
}

#caltxt{
    margin-right:25px; color:#767575; font: 10px arial, tahoma, verdana, sans-serif;
}

#midblockrighttxt ul {
 margin-left:0px;
}

#midblockrighttxt li{
 padding-bottom:0px;
}

#footer {
background:top url(images/footer.jpg) no-repeat; height:53px; width:723px;
}

#footertxt {
text-align:center; font: 11px arial, tahoma, verdana, sans-serif; color:#bbbbbb; padding-top:5px;
}

#footerBases {
background:top url(VBimages/Index_29.jpg) repeat-y; height:250px; width:741px; text-align:center; font: 9px tahoma, verdana, sans-serif; color:#fbfbfb; padding-top:3px;
}
#footerEnd {
height:250px; width:741px;
}
.HeadingImg {
margin-left:2px;
}
a.N1 {
	color: #4c5560;
	text-decoration: underline;
}
a.N1:hover {
	color: #4c5560;
	text-decoration: none;
}

a.N2 {
	color: #003366;
	text-decoration: none;
}
a.N2:hover {
	color: #003366;
	text-decoration: underline;
}

a.Footer {
	color: #bbbbbb;
	text-decoration: none;
}
a.Footer:hover {
	color: #bbbbbb;
	text-decoration: underline;
}

a.Nav {
	color: #003366;
	text-decoration: none;
}
a.Nav:hover {
	color: #fdfdfd;
	text-decoration: underline;
}
.AltLink {
	font: 10px arial, tahoma, verdana, sans-serif; color:#90a7b5;
	border-bottom: 1px #90a7b5 dotted; text-decoration:none;
}

.AltLink:hover {
	font: 10px arial, tahoma, verdana, sans-serif; color:#bebaae;
	border-bottom: dotted 0px #666; text-decoration: none; 
}

.Link {
	font: 11px arial, tahoma, verdana, sans-serif; color:#ffffff;
	border-bottom: 1px #7b786e dotted; text-decoration:none;
}

.Link:hover {
	font: 11px arial, tahoma, verdana, sans-serif; color:#ffffff;
	text-decoration: none; border-bottom: dotted 0px #666; 
}

.Link2 {
	font: 11px arial, tahoma, verdana, sans-serif; color:#2f2f30;
	border-bottom: 1px #7b786e dotted; text-decoration:none;
}

.Link2:hover {
	font: 11px arial, tahoma, verdana, sans-serif; color:#2f2f30;
	text-decoration: none; border-bottom: dotted 0px #666; 
}
.List2{ padding-bottom:3px;}

.underdash {border-bottom: 1px #fff solid; text-decoration:none;} 
.underdash a:hover {border-bottom: 1px #000 dashed} 

/* Nav */

/* Step 10 - Clearing the float */
#menu {display:block; width:723px; height:35px;}

/* Step 3 - get rid of the bullets and margin */
#menu ul {margin:0; padding:0; list-style-type:none;}

/* Step 4 and 7 - make the list horizontal and giving a 1px gap */
#menu li {float:left; margin-right:0px; margin-bottom:0px;}

/* Step 5 - Adding the initial images */

/*#menu li.list0 {background:transparent url(images/AppliedLeft.jpg);}*/
#menu li.list1 {background:transparent url(images/Nav_Home.jpg);}
#menu li.list2 {background:transparent url(images/Nav_lodge.jpg);}
#menu li.list3 {background:transparent url(images/Nav_villas.jpg);}
#menu li.list4 {background:transparent url(images/Nav_Rates.jpg);} 
#menu li.list5 {background:transparent url(images/Nav_Gallery.jpg);}
#menu li.list6 {background:transparent url(images/Nav_Attractions.jpg);} 
#menu li.list7 {background:transparent url(images/Nav_Contact.jpg);} 
#menu li.list8 {background:transparent url(images/Nav_Date3.jpg); width:238px; height:35px; text-align:right;}
/*#menu li.list9 {background:transparent url(images/NavAlt_Right.jpg); width:148px; height:35px;}*/

/* Step 6 - General link styling */

#menu a {display:block; height:0; padding-top:35px; color:#000; overflow:hidden;}

/* hack for older versions of IE with incorrect box model */

* html #menu a:link, * html #menu a:visited {height:35px; he\ight:0;}

/* Step 8 - Adding the background images to the link tags */

/*#menu a#item0 {background:transparent url(images/AppliedLeft.jpg) -0px -30px no-repeat; width:15px;}*/
#menu a#item1 {background:transparent url(images/Nav_HomeAlt.jpg) -0px -190px no-repeat; width:64px;}
#menu a#item2 {background:transparent url(images/Nav_LodgeAlt.jpg) -0px -190px no-repeat; width:56px;}
#menu a#item3 {background:transparent url(images/Nav_VillasAlt.jpg) -0px -190px no-repeat; width:48px;}
#menu a#item4 {background:transparent url(images/Nav_RatesAlt.jpg) -0px -190px no-repeat; width:52px;}
#menu a#item5 {background:transparent url(images/Nav_GalleryAlt.jpg) -0px -190px no-repeat; width:61px; }
#menu a#item6 {background:transparent url(images/Nav_AttractionsAlt.jpg) -0px -190px no-repeat; width:88px;}
#menu a#item7 {background:transparent url(images/Nav_ContactAlt.jpg) -0px -190px no-repeat; width:69px;}
/*#menu a#item7 {background:transparent url(images/AppliedRight.jpg) -0px -190px no-repeat; width:15px;}*/

/* Step 9 - Adding the :hover style */

#menu a#item0:hover {background-position:0 0; z-index:50;}
#menu a#item1:hover {background-position:0 0; z-index:50;}
#menu a#item2:hover {background-position:0 0; z-index:50;}
#menu a#item3:hover {background-position:0 0; z-index:50;}
#menu a#item4:hover {background-position:0 0; z-index:50;}
#menu a#item5:hover {background-position:0 0; z-index:50;}
#menu a#item6:hover {background-position:0 0; z-index:50;}
#menu a#item7:hover {background-position:0 0; z-index:50;}
/*#menu a#item8:hover {background-position:0 0; z-index:50;}*/

* html #menu a:hover {height:35px; he\ight:0;}

#datetxt{ 
color:#caccc9; font: 10px arial, tahoma, verdana, sans-serif;
}

#ImgArea{
    position:relative; margin-left:22px;
    }

/* Gallery */

		ul#gallery, ul#gallery li{
			margin:0;
			padding:0;
			list-style:none;
			}
		ul#gallery{
			width:403px;
			height:390px;
			position:relative; margin-left:22px;
			background: url(images/ImageGallery1_.jpg) no-repeat;
			}
		ul#gallery li{
			float:left;
			display:inline;
			margin-top:300px;
			}								
		ul#gallery a span{
			display:none;
			}
		ul#gallery a:hover{
			background:none;
			z-index:100;
			}	
		ul#gallery a:hover span{
			position:absolute;
			width:400px;
			height:300px;
			float:left;
			top:0;
			left:0;
			display:block;
			}	
