/* 

STYLE SHEET FOR Urban Beach
Created by The Design Corporation
www.thedcorporation.com

Styles

	1. defaults
	2. structure
	3. style
	4. navigation
	5. images
	6. tables
	7. forms
	8. footer
	9. flash
	
Notes

*/



/* --------- 1. defaults  --------- */

*{margin:0;padding:0}

/*  --------- 2. structure  --------- */

body {
	background: #0F110E url(../style-images/MOKU0342.jpg) repeat-y center top;
	font-family:Verdana,Arial,Helvetica,sans-serif;
	line-height:14pt;
	font-size:11px;
	color:#FFFFFF;
}

#wrapper {
	margin:auto;
	position:relative;
	width:1145px;
}

#tel {
	position:absolute;
	top:428px;
	left:757px;
	height:30px;
	font-family:"Lucida Sans Unicode";
	font-size:1.3em;
	font-weight:normal;
}

#main-holder {
	margin:auto;
	position:relative;
	width:869px;
}

#logo {
	position:absolute;
	height:436px;
	width:138px;
	background: url(../style-images/logo.png) no-repeat top left;
	top:45px;
	left:0px;
	z-index:100;
}


#header {
    position:absolute;
	height:50px;
	width:869px;
	background: url(../style-images/image-top.png) no-repeat bottom left;
}

#image {
	float:left;
	height:300px;
	position:absolute;
	top:50px;
	width:869px;
	z-index:100;
}

#image-bottom {
	height:30px;
	position:absolute;
	background: url(../style-images/image-bottom.png) no-repeat top left;
	top:350px;
	width:869px;
	font-family:"Lucida Sans Unicode";
	font-size:1.1em;
	font-weight:bold;
}

#content {
	width: 869px;
	color: #FFFFFF;
	position:absolute;
	top:460px;
}

#room-content {
	width: 869px;
	color: #FFFFFF;
	position:absolute;
	top:497px;
}

#best-price-guarantee {
	position:absolute;
	Width:110px;
	height:110px;
	top:425px;
	left:960px;
	z-index:300;
}

#booking-button {
	position:absolute;
	width:230px;
	height:42px;
	left:719px;
	top:460px;
	z-index:200;
}

#popup {
	position:absolute;
	Width:250px;
	height:150px;
	top:200px;
	left:751px;
	z-index:500;
}

#christmas-popup {
	position:absolute;
	Width:200px;
	height:200px;
	top:20px;
	left:900px;
	z-index:500;
}

#jobs-popup {
	position:absolute;
	Width:190px;
	height:190px;
	top:35px;
	left:895px;
	z-index:800;
}

#sale {
	position:absolute;
	Width:220px;
	height:155px;
	top:50px;
	left:782px;
	z-index:500;
}

#outage {
	position:absolute;
	Width:333px;
	height:140px;
	top:60px;
	left:160px;
	z-index:500;
}



/* ---------- 3. style ---------- */

 
a {
 	color: #FFFFFF;
 	text-decoration:none;
	text-shadow: 1px 1px 1px rgba(0,0,0,.3);
}

.links {
	color:#FEC631;
}

a.links:hover{
	color:#909093;
}

a:hover {
	color: #4E1F00;
  	text-decoration:none;
}

p {
 	padding-top:20px;
	font-size:1.2em;
	padding-right:190px;
	text-align:left;
}

p.booking-note {
	color:#FEC631;
}

body#home #content p {
	padding-left:0px;
	padding-right:330px;
	padding-top:20px;
	font-size:1.2em;
	text-align:left;
}

body#bookings #content p {
	padding-left:0px;
	padding-right:330px;
	padding-top:20px;
	font-size:1.2em;
	text-align:left;
}


h1 {
	font-size:16pt;
	font-weight:bold;
	margin: 0px 0px 5px 0px;
}

h2 {
	font-weight:bold;
	margin: 20px 0px 0px 0px;
}

h3 {
	margin-left:20px;
}

img {  
	border-style: none;
}

/* ---------- 4. navigation ---------- */

#navigation {
	position:absolute;
	width:869px;
	height:37px;
	top:380px;
	background: url(../style-images/nav-bg.png) no-repeat top left;
	font-family:"Lucida Sans Unicode";
	font-size:1.3em;
	font-weight:normal;
}

#navigation li {
	float: left;
	height:37px;
	padding-top:8px;
	padding-left:25px;
	padding-right:25px;
	background: url(../style-images/li.png) no-repeat top right;
}

#room-page-navigation {
	width:869px;
	height:37px;
	margin-left:0px;
	margin-top:20px;
	font-family:"Lucida Sans Unicode";
	font-size:1.3em;
	font-weight:normal;
}

#room-page-navigation li {
	float: left;
	margin-right:10px;
}

#room-navigation {
	position:absolute;
	width:869px;
	height:37px;
	top:430px;
	margin-left:0px;
	margin-top:37px;
	font-family:"Lucida Sans Unicode";
	font-size:1.3em;
	font-weight:normal;
}

#room-navigation li {
	float: left;
	margin-right:10px;
}

ul.rooms li {
	list-style-type:disc;
	margin-left:30px;
}

li {
	text-decoration:none;
	list-style-type: none;
}

ul.lists li {
	text-decoration:none;
	list-style-type:disc;
	margin-left:40px;
}

#navigation li#main-nav-first {
	margin-left:10px;
}

#navigation li#main-nav-last {
	background-image:none;
}

body#bar li.bar a {
	color:#4E1F00;
}

body#home li.hello a {
	color:#4E1F00;
}

body#rooms li.rooms a {
	color:#4E1F00;
}

body#bistro li.bistro a {
	color:#4E1F00;
}

body#menus li.menus a {
	color:#4E1F00;
}

body#specials li.specials a {
	color:#4E1F00;
}

body#contact li.contact a {
	color:#4E1F00;
}

body#a-bit-more li.a-bit-more a {
	color:#4E1F00;
}

/* ---------- 4. room-navigation ---------- */

.room_1 {
	background: url(../style-images/1on.png) no-repeat left top;
	margin:0px;
	width:30px;
	height:30px;
	text-indent: -999999px;
	display:block;
}
.room_2 {
	background: url(../style-images/2on.png) no-repeat left top;
	margin:0px;
	width:30px;
	height:30px;
	text-indent: -999999px;
	display:block;
}
.room_3 {
	background: url(../style-images/3on.png) no-repeat left top;
	margin:0px;
	width:30px;
	height:30px;
	text-indent: -999999px;
	display:block;
}
.room_4 {
	background: url(../style-images/4on.png) no-repeat left top;
	margin:0px;
	width:30px;
	height:30px;
	text-indent: -999999px;
	display:block;
}
.room_5 {
	background: url(../style-images/5on.png) no-repeat left top;
	margin:0px;
	width:30px;
	height:30px;
	text-indent: -999999px;
	display:block;
}
.room_6 {
	background: url(../style-images/6on.png) no-repeat left top;
	margin:0px;
	width:30px;
	height:30px;
	text-indent: -999999px;
	display:block;
}
.room_7 {
	background: url(../style-images/7on.png) no-repeat left top;
	margin:0px;
	width:30px;
	height:30px;
	text-indent: -999999px;
	display:block;
}
.room_8 {
	background: url(../style-images/8on.png) no-repeat left top;
	margin:0px;
	width:30px;
	height:30px;
	text-indent: -999999px;
	display:block;
}
.room_9 {
	background: url(../style-images/9on.png) no-repeat left top;
	margin:0px;
	width:30px;
	height:30px;
	text-indent: -999999px;
	display:block;
}
.room_10 {
	background: url(../style-images/10on.png) no-repeat left top;
	margin:0px;
	width:30px;
	height:30px;
	text-indent: -999999px;
	display:block;
}
.room_11 {
	background: url(../style-images/11on.png) no-repeat left top;
	margin:0px;
	width:30px;
	height:30px;
	text-indent: -999999px;
	display:block;
}
.room_12 {
	background: url(../style-images/12on.png) no-repeat left top;
	margin:0px;
	width:30px;
	height:30px;
	text-indent: -999999px;
	display:block;
}
.room_14 {
	background: url(../style-images/14on.png) no-repeat left top;
	margin:0px;
	width:30px;
	height:30px;
	text-indent: -999999px;
	display:block;
}

/* ---------- 4. sub-navigation ---------- */

body#christmas #sub-navigation {
	position:relative;
	height:50px;
	width:690px;
	margin-top:30px;
}

#sub-navigation {
	position:relative;
	height:50px;
	width:690px;
	margin-top:30px;
}


#sub-navigation li {
	float:left;
}

#sub-navigation li a {
	position:relative;
	display:block;
}

.sub-nav {
	background: url(../style-images/sub-cocktail-slide.png) no-repeat left 0px;
	height: 30px;
	width: 125px;
	padding-left:10px;
	padding-top:5px;
}

/* ---------- 5. images ---------- */

a.room-no {
	text-indent: -999999px;
	height: 30px;
	width: 30px;
}

.home-h1{
	text-indent: -999999px;
	background: url(../style-images/home-h1-image.png) no-repeat left top;
	height: 35px;
	width: 445px;
}

.home-h2{
	text-indent: -999999px;
	background: url(../style-images/home-h2-image.png) no-repeat left top;
	height: 25px;
	width: 297px;
}

.rooms-h1{
	text-indent: -999999px;
	background: url(../style-images/rooms-h1-image.png) no-repeat left top;
	height: 35px;
	width: 330px;
}

.bookings-h1{
	text-indent: -999999px;
	background: url(../style-images/bookings-h1-image.png) no-repeat left top;
	height: 35px;
	width: 345px;
}

.best-rates-h2{
	text-indent: -999999px;
	background: url(../style-images/best-rates-h2-image.png) no-repeat left top;
	height: 25px;
	width: 188px;
}

.tandc-h2{
	text-indent: -999999px;
	background: url(../style-images/tandc-h2-image.png) no-repeat left top;
	height: 25px;
	width: 343px;
}

.bar-h1{
	text-indent: -999999px;
	background: url(../style-images/bar-h1-image.png) no-repeat left top;
	height: 35px;
	width: 405px;
}

.christmas-h1{
	text-indent: -999999px;
	background: url(../style-images/christmas-h1-image.png) no-repeat left top;
	height: 56px;
	width: 250px;
}

.kids-h1{
	text-indent: -999999px;
	background: url(../style-images/kids-h1-image.png) no-repeat left top;
	height: 35px;
	width: 180px;
}

.stay-h1{
	text-indent: -999999px;
	background: url(../style-images/stay-h1-image.png) no-repeat left top;
	height: 35px;
	width: 375px;
}

.philosophy-h1{
	text-indent: -999999px;
	background: url(../style-images/philosophy-h1-image.png) no-repeat left top;
	height: 35px;
	width: 200px;
}

.health-h1{
	text-indent: -999999px;
	background: url(../style-images/health-h1-image.png) no-repeat left top;
	height: 35px;
	width: 260px;
}

.included-h1{
	text-indent: -999999px;
	background: url(../style-images/included-h1-image.png) no-repeat left top;
	height: 35px;
	width: 315px;
}

.bistro-h1{
	text-indent: -999999px;
	background: url(../style-images/bistro-h1-image.png) no-repeat left top;
	height: 35px;
	width: 245px;
}

.breakfasts-h1{
	text-indent: -999999px;
	background: url(../style-images/breakfasts-h1-image.png) no-repeat left top;
	height: 35px;
	width: 415px;
}

.allday-h1{
	text-indent: -999999px;
	background: url(../style-images/allday-h1-image.png) no-repeat left top;
	height: 35px;
	width: 285px;
}

.packed-lunch-h1{
	text-indent: -999999px;
	background: url(../style-images/packed-lunch-h1-image.png) no-repeat left top;
	height: 35px;
	width: 310px;
}

.rays-h1{
	text-indent: -999999px;
	background: url(../style-images/rays-h1-image.png) no-repeat left top;
	height: 35px;
	width: 435px;
}

.urbanreef-h1{
	text-indent: -999999px;
	background: url(../style-images/urbanreef-h1-image.png) no-repeat left top;
	height: 35px;
	width: 405px;
}

.contact-h1{
	text-indent: -999999px;
	background: url(../style-images/contact-h1-image.png) no-repeat left top;
	height: 35px;
	width: 140px;
}

.a-bit-more-h1{
	text-indent: -999999px;
	background: url(../style-images/a-bit-more-h1-image.png) no-repeat left top;
	height: 35px;
	width: 140px;
}

.vouchers-h1{
	text-indent: -999999px;
	background: url(../style-images/vouchers-h1-image.png) no-repeat left top;
	height: 35px;
	width: 245px;
}

.friends-h1{
	text-indent: -999999px;
	background: url(../style-images/friends-h1-image.png) no-repeat left top;
	height: 35px;
	width: 265px;
}

.newsletter-h1{
	text-indent: -999999px;
	background: url(../style-images/newsletter-h1-image.png) no-repeat left top;
	height: 35px;
	width: 260px;
}

.team-h1{
	text-indent: -999999px;
	background: url(../style-images/team-h1-image.png) no-repeat left top;
	height: 35px;
	width: 190px;
}

.secrets-h1{
	text-indent: -999999px;
	background: url(../style-images/secrets-h1-image.png) no-repeat left top;
	height: 35px;
	width: 210px;
}

.media-h1{
	text-indent: -999999px;
	background: url(../style-images/media-h1-image.png) no-repeat left top;
	height: 35px;
	width: 190px;
}

.corporate-h1{
	text-indent: -999999px;
	background: url(../style-images/corporate-h1-image.png) no-repeat left top;
	height: 35px;
	width: 205px;
}

.location-h1{
	text-indent: -999999px;
	background: url(../style-images/location-h1-image.png) no-repeat left top;
	height: 35px;
	width: 185px;
}

.parking-h1{
	text-indent: -999999px;
	background: url(../style-images/parking-h1-image.png) no-repeat left top;
	height: 35px;
	width: 460px;
}

.map-h1{
	text-indent: -999999px;
	background: url(../style-images/map-h1-image.png) no-repeat left top;
	height: 35px;
	width: 275px;
}


.menus-h1{
	text-indent: -999999px;
	background: url(../style-images/menus-h1-image.png) no-repeat left top;
	height: 35px;
	width: 300px;
}

.menus-h2{
	text-indent: -999999px;
	background: url(../style-images/bistro-h2-image.png) no-repeat left top;
	height: 25px;
	width: 145px;
}

.specials-h1{
	text-indent: -999999px;
	background: url(../style-images/specials-h1-image.png) no-repeat left top;
	height: 35px;
	width: 375px;
}

.specials-h2{
	text-indent: -999999px;
	background: url(../style-images/specials-h2-image.png) no-repeat left top;
	height: 25px;
	width: 130px;
}

.bistro-specials-h2{
	text-indent: -999999px;
	background: url(../style-images/bistro-specials-h2-image.png) no-repeat left top;
	height: 25px;
	width: 140px;
}

.jobs-h1{
	text-indent: -999999px;
	background: url(../style-images/jobs-h1-image.png) no-repeat left top;
	height: 35px;
	width: 300px;
}

.charity-h1{
	text-indent: -999999px;
	background: url(../style-images/charity-h1.png) no-repeat left top;
	height: 35px;
	width: 183px;
}

.error-h1{
	text-indent: -999999px;
	background: url(../style-images/404-h1-image.png) no-repeat left top;
	height: 35px;
	width: 150px;
}



.room-1-h1{
	text-indent: -999999px;
	background:url(../style-images/room-1-h1-image.png) no-repeat left top;
	height: 35px;
	width: 90px;
	margin-top:30px;
}

.room-2-h1{
	text-indent: -999999px;
	background:url(../style-images/room-2-h1-image.png) no-repeat left top;
	height: 35px;
	width: 110px;
	margin-top:30px;
}

.room-3-h1{
	text-indent: -999999px;
	background:url(../style-images/room-3-h1-image.png) no-repeat left top;
	height: 35px;
	width: 110px;
	margin-top:30px;
}

.room-4-h1{
	text-indent: -999999px;
	background:url(../style-images/room-4-h1-image.png) no-repeat left top;
	height: 35px;
	width: 110px;
	margin-top:30px;
}

.room-5-h1{
	text-indent: -999999px;
	background:url(../style-images/room-5-h1-image.png) no-repeat left top;
	height: 35px;
	width: 110px;
	margin-top:30px;
}

.room-6-h1{
	text-indent: -999999px;
	background:url(../style-images/room-6-h1-image.png) no-repeat left top;
	height: 35px;
	width: 110px;
	margin-top:30px;
}

.room-7-h1{
	text-indent: -999999px;
	background:url(../style-images/room-7-h1-image.png) no-repeat left top;
	height: 35px;
	width: 110px;
	margin-top:30px;
}

.room-8-h1{
	text-indent: -999999px;
	background:url(../style-images/room-8-h1-image.png) no-repeat left top;
	height: 35px;
	width: 110px;
	margin-top:30px;
}

.room-9-h1{
	text-indent: -999999px;
	background:url(../style-images/room-9-h1-image.png) no-repeat left top;
	height: 35px;
	width: 110px;
	margin-top:30px;
}

.room-10-h1{
	text-indent: -999999px;
	background:url(../style-images/room-10-h1-image.png) no-repeat left top;
	height: 35px;
	width: 110px;
	margin-top:30px;
}

.room-11-h1{
	text-indent: -999999px;
	background:url(../style-images/room-11-h1-image.png) no-repeat left top;
	height: 35px;
	width: 110px;
	margin-top:30px;
}

.room-12-h1{
	text-indent: -999999px;
	background:url(../style-images/room-12-h1-image.png) no-repeat left top;
	height: 35px;
	width: 110px;
	margin-top:30px;
}

.room-14-h1{
	text-indent: -999999px;
	background:url(../style-images/room-14-h1-image.png) no-repeat left top;
	height: 35px;
	width: 135px;
	margin-top:30px;
}


/* ---------- 6. calendar + video ---------- */

.video {
	position:absolute;
	right:-20px;
	top:135px;
	border: 4px solid #FEC631;
	z-index:800;
}

#calendar {
	position:absolute;
	width:310px;
	height:500px;
	background: url(../style-images/booking-button.png) no-repeat 22px 0px;
	right:0px;
	top:0px;
}

.booking-calendar {
	position:absolute;
	right:0px;
	top:85px;
}

.booking-title {
	position:absolute;
	font-family:"Lucida Sans Unicode";
	font-size:2.0em;
	font-weight:normal;
	top:10px;
	left:70px;
	z-index:200;
	text-shadow: 1px 1px 1px rgba(0,0,0,.4);
}

.booking-title2 {
	position:absolute;
	font-family:"Lucida Sans Unicode";
	font-size:2.0em;
	font-weight:normal;
	top:10px;
	left:48px;
	z-index:200;
	text-shadow: 1px 1px 1px rgba(0,0,0,.4);
}

#question {
	position:absolute;
	font-family:"Lucida Sans Unicode";
	font-weight:normal;
	top:321px;
	left:42px;
	z-index:100;
}

.question {
	font-size:1.2em;
	font-weight:bold;
}

body#home #question p {
	padding-right:50px;
}

.tandc {
	position:absolute;
	font-family:"Lucida Sans Unicode";
	font-size:1.3em;
	font-weight:normal;
	top:51px;
	left:125px;
	color:#CB9401;
	z-index:100;
}

a.tandc:hover {
	color:#CB9401;
	text-shadow: 1px 1px 1px rgba(255,255,255,.2);
}

#problem-text {
	position:relative;
	top:320px;
	width:310px;
	font-size: 8pt;
	color:#CB9401;
}

body#bookings #content #problem-text p{
	padding-left:30px;
	padding-right:20px;
}



/* ---------- 7. forms ---------- */

label {
	float:left;
	width:10em;
}

span.label,span.spacer,span.multiple span {width:120px;float:left;} 
span.multiple {float:left;} 
span.button {padding-left:120px;} 
div.clear {clear:both;padding-top:5px;}
.newsletter {
padding-bottom:10px; 
font-size: 1.2em;
}

/* ---------- 8. footer nav ---------- */

#footer-nav {
	height:100px;
	z-index:200;
	padding-top:15px;
}

#footer-nav ul {
	float:left;
	background: url(../style-images/foot-line.png) no-repeat top right;
}

#footer-nav ul.left-nav {
	margin-left:5px;
}

#footer-nav ul.right-nav {
	background-image:none;
}

#footer-nav ul li {
	width:60px;
	padding-left:20px;
	padding-right:15px;
	font-size:11px;
	padding-bottom:4px;
}

#footer-nav ul li a {
	color: #FFFFFF;
}

#footer-nav ul li a:hover {
	color: #4E1F00;
}

#footer-nav li.footer-nav-top {
	font-weight:bold;
	padding-bottom:6px;
}

#footer-nav li.footer-nav-multi {
	line-height:10pt;
	padding-bottom:9px;
}

#footer-guarantee {
	position:absolute;
	top:-60px;
	left:820px;
	width:110px;
	height:110px;
	z-index:400;
}

#follow-us {
	position:absolute;
	top:150px;
	left:30px;
	height:40px;
	width:140px;
	
}
#footer-wifi {
	position:absolute;
	top:150px;
	left:185px;
	height:43px;
	width:107px;
}

#footer-SRA {
	position:absolute;
	top:114px;
	left:400px;
	height:81px;
	width:58px;
}

/* ---------- 8. footer ---------- */

#footer {
	position:relative;
	margin:auto;
	width: 869px;
	height: 235px;
	clear:both;
}

#footer-top {
	height:5px;
	width: 869px;
	background: url(../style-images/footer-top.png) no-repeat top left;
}

#footer-main {
	height: 350px;
	width: 869px;
	background: url(../style-images/footer-bg2.png) repeat-x top left;
}


#footer-line {
	position:absolute;
	left:0px;
	height:10px;
	width: 869px;
	margin-top:80px;
	background: url(../style-images/line.png)  no-repeat bottom left;
	z-index:100;
}

#footer-logos {
	position:absolute;
	left:0px;
	top:225px;
	width:869px;
	height:90px;
}

#single-logo {
	float:left;
	margin-left:9px;
}

.footleft {
	position:absolute;
	top:325px;
	left:0px;
	width:250px;
	color:#FFFFFF;
	font-size:12px;
	padding-left:30px;
	float:left;
}

.footright {
	position:absolute;
	top:325px;
	right:0px;
	width:200px;
	color:#FFFFFF;
	font-size:12px;
	padding-right:0px;
	text-align:center;
	float:right;
}

a.footerlink {
	color:#333333;
	text-decoration:none;
}

/* ---------- 9. flash ---------- */



/* ---------- 10. map ---------- */

#map_canvas {
	margin-top:30px;
	border:#FFFFFF solid 2px;
}



/* ---------- 11. menus ---------- */

#menu-page {
margin-bottom:50px;}


#menu-page img {
	padding-left:25px;
}

#menu-page {
	position:relative;
	float:left;
	margin-left:20px;
}

#menu-page h3{
	padding-left: 10px;
    padding-top: 20px;
	padding-bottom:10px;
}

#tandc {
	float:left;
	width:100%;
}