/**************************
 SilverStripe NatureWeb4 Theme
 http://www.silverstripe.com

 Re-styled and adapted by Exclamationmark! Advertising www.exclamationmark.co.nz
 
**************************/

body {



/* set everything to zero for a good cross-browser starting point */
	
	margin: 0;
	padding: 0;
	border: 0;
	background-color: transparent;
	color: #666; 
	text-align: left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100.01%;

	border-top:5px solid #3366ff;
	background:url(../images/black2.jpg) repeat-x;
	
}
a {
	color:#0033ff;
	text-decoration: none;
}
a img {
	border: none;
}
a:hover {
	text-decoration: none;
	color: #0033FF;
}
a.money, a.money:visited {
	float: left;
	/* display: block; */
	width: 100%;
	/* cursor: pointer; */
	text-decoration: none;
	padding: 0;
	margin: 0;
	border: 0;
}

a.money:hover {
	/* text-decoration: none; */
	padding: 0;
	margin: 0;
	border: 0;
}

a.money img {
	float: left;
	padding: 0;
	margin: 0;
	border: 0;

}
a.money:hover img {
	padding: 0;
	margin: 0;
	border: 0;
}

a.money:visited img {
	padding: 0;
	margin: 0;
	border: 0;
}

#Container {
	width:800px;
	min-height:400px;
	border:0px solid #ffffff;
	/* background:#fff; */
	margin:10px auto auto auto;
	padding:0;
}
#Toptabs {
	position:relative;
	width:600px;
	height:35px;
	border:0 solid #333;
	background:#fff; /* yellow */
	margin-right:2px;
	padding:1px;
}
	#Toptabs h2 a {
		display:block;
		width:200px;
		font-size:14px;
		font-family:verdana;
		padding-left:5px;
		letter-spacing:-2px; /* -10px */
		background:#ff3355; /* red */
		color:white;
		text-decoration: none;
	}
#Header {
	border-bottom:1px solid #ffffff;
	border-top:1px solid #ffffff;
	text-transform:uppercase;
	background:url(../images/header_image.gif);
	height:233px;
	padding: 0;
	margin: 0 0 10px;
}
	#Header h1 {
		margin:0px;
		margin-top:-3px;
		font-size:52px;
		font-family:verdana;
		padding-left:5px;
		letter-spacing:-5px; /* -10px */
		color:#fff;
		font-weight:bolder;
		height:40px;
	}
		#Header h1 a {
			color:white;
			text-decoration: none;
		}
		
#HeaderVilla {
	border-bottom:1px solid #ffffff;
	border-top:1px solid #ffffff;
	text-transform:uppercase;
	background:url(../images/header_villas.gif);
	height:233px;
	padding: 0;
	margin: 0 0 10px;
}
	#HeaderVilla h1 {
		margin:0px;
		margin-top:-3px;
		font-size:52px;
		font-family:verdana;
		padding-left:5px;
		letter-spacing:-5px; /* -10px */
		color:#fff;
		font-weight:bolder;
		height:40px;
	}
		#HeaderVilla h1 a {
			color:white;
			text-decoration: none;
		}

#HeaderRoyalVilla {
	border-bottom:1px solid #ffffff;
	border-top:1px solid #ffffff;
	text-transform:uppercase;
	background:url(../images/header_royalvillas.gif);
	height:233px;
	padding: 0;
	margin: 0 0 10px;
}
	#HeaderRoyalVilla h1 {
		margin:0px;
		margin-top:-3px;
		font-size:52px;
		font-family:verdana;
		padding-left:5px;
		letter-spacing:-5px; /* -10px */
		color:#fff;
		font-weight:bolder;
		height:40px;
	}
		#HeaderRoyalVilla h1 a {
			color:white;
			text-decoration: none;
		}
		
#HeaderBure {
	border-bottom:1px solid #ffffff;
	border-top:1px solid #ffffff;
	text-transform:uppercase;
	background:url(../images/header_bure.gif);
	height:233px;
	padding: 0;
	margin: 0 0 10px;
}
	#HeaderBure h1 {
		margin:0px;
		margin-top:-3px;
		font-size:52px;
		font-family:verdana;
		padding-left:5px;
		letter-spacing:-5px; /* -10px */
		color:#fff;
		font-weight:bolder;
		height:40px;
	}
		#HeaderBure h1 a {
			color:white;
			text-decoration: none;
		}
	
#HeaderDining {
	border-bottom:1px solid #ffffff;
	border-top:1px solid #ffffff;
	text-transform:uppercase;
	background:url(../images/header_dining.gif);
	height:233px;
	padding: 0;
	margin: 0 0 10px;
}
	#HeaderDining h1 {
		margin:0px;
		margin-top:-3px;
		font-size:52px;
		font-family:verdana;
		padding-left:5px;
		letter-spacing:-5px; /* -10px */
		color:#fff;
		font-weight:bolder;
		height:40px;
	}
		#HeaderDining h1 a {
			color:white;
			text-decoration: none;
		}
	
#HeaderResort {
	border-bottom:1px solid #ffffff;
	border-top:1px solid #ffffff;
	text-transform:uppercase;
	background:url(../images/header_resort.gif);
	height:233px;
	padding: 0;
	margin: 0 0 10px;
}
	#HeaderResort h1 {
		margin:0px;
		margin-top:-3px;
		font-size:52px;
		font-family:verdana;
		padding-left:5px;
		letter-spacing:-5px; /* -10px */
		color:#fff;
		font-weight:bolder;
		height:40px;
	}
		#HeaderResort h1 a {
			color:white;
			text-decoration: none;
		}
				
#Columns {
	border-top:1px solid #333;
}

#Logo {
	float:left;
	position: relative;
	width:180px;
	height:124px;
	padding:5px 5px 5px 5px;
	border: 0;
	margin-top:10px;
	background:url(../images/ColourLogo.png) no-repeat; 
}
#Logo2 {
	float:left;
	position: relative;
	width:180px;
	height:124px;
	padding:5px 5px 5px 5px;
	border: 0;
	margin-top:10px;
	background:url(../images/Nalamulogo.png) no-repeat; 
}
#Facebook {
	float:left;
	position: relative;
	width:180px;
	height:250px;
	padding:5px 5px 5px 5px;
	border: 0;
	margin-top:5px;
	background:url(http://badge.facebook.com/badge/495103395205.5909.1505011378.png) no-repeat center; 
}
#Facebookdiv li a {
	float:left;
	position: relative;
	color:#333;
	border: none;
	width: 180px; /** width of the button in active state **/
	height: 250px; /** height of the button in active state **/
	display: block; 
	text-indent: -7000px; /** Removes li text from the screen **/
	outline: none;
	text-decoration:none;
}
	
#facebooklike {
	position: relative;
	margin-top:5px;
	width:450px;
	height:35px;
}

#Contactus {
	float:left;
	position: relative;
	width:180px;
	height:138px;
	padding:5px 5px 5px 5px;
	border: 0;
	margin-top:10px;
	background:url(../images/contactus.png) no-repeat; 
}

#Contact li a {
	float:left;
	position: relative;
	color:#333;
	border: none;
	width: 180px; /** width of the button in active state **/
	height: 138px; /** height of the button in active state **/
	display: block; 
	text-indent: -7000px; /** Removes li text from the screen **/
	outline: none;
	text-decoration:none;
}
#Sidebar {
	float:left;
	width:180px;
	/* background-color:#ff3355; */
	padding:5px 5px 5px 5px;
	border:0; /* solid #ffff99;  yellow */
}
	#Sidebar h3 {
		font-size:125%;
		text-transform: uppercase;
		letter-spacing: -1px; /* -3px */
		color: #666;
	}
	#Sidebar p {
		line-height:130%;
		color:#333;
	}
	#Sidebar ul {
		list-style:none;
		margin:0 0 0 10px; /* indent submenu */
		padding:0;
	}
	#Sidebar li {
		list-style:none;
		line-height:105%;
		margin:0;
		padding:0;
		font-size: 0.9em;
	}
	ul#Navigation {
		font-size:75%;
		list-style:none;
		margin:0;
		padding:0;
	}
		ul#Navigation li {
			display:inline;
			margin:0;
			padding: 1px 0 0 0;
		}
		ul#Navigation li a {
			letter-spacing: -1px;
			text-transform: uppercase;
			text-decoration:none;
			display:block;
			padding:5px;
			margin-bottom:1px;
			border-left:5px solid #2f5073;
			/* background:#598CCD; */
			color:#0066cc;
		}
			ul#Navigation li a:hover {
				letter-spacing: -1px; 
				border-left:10px solid #2f5073;
				display:block;
				/* background:#fff; */
				color:#000;
				font-weight: normal;
			}
		ul#Navigation li a.current {
			font-size:100%;
			border-left:10px solid #2f5073;
			/* background:url(../images/wave.png); */
			/* background:#4F749F; */
			color:#0066cc;
			letter-spacing: 0px;
		}
		ul li ul {
			margin: 0 0 0 10px;
			padding: 0;
		}
	
#Main {
	float:left;
	width:455px;
	height:auto;
	border-left:1px solid #333;
	padding: 10px 0 0px 10px;
}



#ColRight {
	float:right;
	width:125px;
	height:auto;
	/* background-color:#ff3355; */
	/* border-left:1px solid #333; */
	padding: 10px 0 0px 10px;
}
#Footer {
	font-size:80%;
	border-top:5px solid #3366ff;
	text-align:center;
	color:#000;
	margin-top:10px;
	clear: both;
}
	#Footer a {
		color:#333;
		text-decoration:none;
	}
#Breadcrumbs p {
	line-height: 1.1em;
	text-align: left;
	font-size:0.8em;
	margin: 0 0 5px 0;
	padding: 0;
}
/* Tab Nav */
#topnavigation ul {
	width: 320px; 
	height: 28px; 
	position: absolute; /** Places image at the top of the page **/
	top: 10px; /** Determines the height from the top of the page **/
	left: 0px; /** Determines the width from the left of the page **/
	background: url(../images/menu.jpg) no-repeat 0 0;
	list-style: none;
	margin: 0; padding: 0;
}
#topnavigation li {
	display: inline;
}
#topnavigation li a:link, #topnavigation li a:visited {
	border: none;
	width: 160px; /** width of the button in active state **/
	height: 28px; /** height of the button in active state **/
	display: block; 
	position: absolute; 
	top: 0; 
	text-indent: -7000px; /** Removes li text from the screen **/
	outline: none;
}
#topnavigation li.blue a:link, #topnavigation li.blue a:visited { 
	left: 0;
}
#topnavigation li.green a:link, #topnavigation li.green a:visited { 
	left: 160px  /** how many px left of the first button i.e blue **/
}
#topnavigation li.orange a:link, #topnavigation li.orange a:visited { 
	left: 320px  /** how many px left of the first button i.e blue **/
}
#topnavigation li.red a:link, #topnavigation li.red a:visited { 
	left: 480px  /** how many px left of the first button i.e blue **/
}

#topnavigation li.blue a:hover {
	background: url(../images/menu.jpg) no-repeat 0 -28px; /** moves image up 28px showing the rollover states **/ 
}
#topnavigation li.green a:hover {
	background: url(../images/menu.jpg) no-repeat -160px -28px; /** moves image up 28px and right 80px showing the rollover states **/
}
#topnavigation li.orange a:hover {
	background: url(../images/menu.jpg) no-repeat -320px -28px;
}
#topnavigation li.red a:hover {
	background: url(../images/menu.jpg) no-repeat -480px -28px;
}
/* Booking button */
#booknow ul {
	width: 123px; 
	height: 35px; 
	position: static; /** Places image at the top of the page **/
	/**top: 0px;  Determines the height from the top of the page **/
	/**left: 0px;  Determines the width from the left of the page **/
	background: url(../images/booknow.png) no-repeat 0 0;
	list-style: none;
	margin: 0; padding: 0;
}
#booknow li {
	display: inline;
}
#booknow li a:link, #booknow li a:visited {
	border: none;
	width: 123px; /** width of the button in active state **/
	height: 35px; /** height of the button in active state **/
	display: block; 
	position: absolute; 
	top: 0; 
	text-indent: -7000px; /** Removes li text from the screen **/
	outline: none;
}
#topnavigation li.on a:link, #topnavigation li.on a:visited { 
	left: 0;
}
#booknow li.on a:hover {
	background: url(../images/booknow.png) no-repeat 0 -35px; /** moves image up 35px showing the rollover states **/ 
}