/* ----------------------------------- */
/*  Pukekura Motor Lodge - Screen CSS  */
/*  ver.1                              */
/*  Created      : 16 March 2010       */
/*  Last Updated : 25 March 2010       */
/* ----------------------------------- */

/* ---------- */
/* 1. General */
/* ---------- */

*
{
line-height: 1.5;
}

body
{
background: #e6e6e6 url("../img/bg-body.gif") repeat-x 0 0;
color: #2b2b2b;
font: 0.8125em/1 Arial,sans-serif;
}

p
{
padding: 0 0 15px 0;
font-size: 0.9em;
}

p.call-to-action
{
color: #DE292F;
}

ul
{
padding: 0 0 15px 0;
}

cite
{
font-weight: bold;
}


/* ------- */
/* 2. Link */
/* ------- */

a
{
color: #de292f;
text-decoration: none;
}

div.navigation ul li a
{
font-weight: bold;
color: #d4202c;
height: 46px;
position: relative;
top: 12px;
}

div.navigation ul li a:hover
{
color: #186899;
}

div.navigation ul li.selected a
{
color: #FFF;
background: #de292f;
height: 46px;
position: relative;
top: 12px;
}

div.content a:hover
{
text-decoration: underline;
}

table.in-page-menu a
{
color: #de292f;
}

table.in-page-menu a:hover,
p.call-to-action a:hover
{
color: #186899;
}

div.footer-nav a
{
font-weight: bold; 
color: #FFF;
}

div.secondary-links a
{
font-size: 0.9em;
font-weight: normal;
}

div.legal-section a
{
font-weight: bold; 
color: #FFF;
}

div.legal-section a:hover, div.footer-nav a:hover
{
color: #000; /* #186899; */
text-decoration: underline;
}

p.call-to-action a
{
font-weight: bold;
color: #DE292F;
}

/* ------------- */
/* 3. Navigation */
/* ------------- */

ul.nav-access
{
position: absolute;
top: -9999px; 
left: -9999px;
}

div.navigation
{
float: right;
padding: 67px 11px 0 0;
}

div.navigation ul li
{
float: left;
display: inline-block;
height: 46px;
padding: 0 10px; 
}

div.navigation ul li.selected
{
display: inline-block;
height: 46px;
padding-left: 0;
padding-right: 0;
xposition: relative;
xtop: -10px;
}

div.navigation ul li.selected span.nav-on-left
{
background: #de292f url("../img/bg-nav-on-left.gif") no-repeat top left;
height: 46px;
display: inline-block;
padding-left: 10px;
}

div.navigation ul li.selected span.nav-on-right
{
background: #de292f url("../img/bg-nav-on-right.gif") no-repeat top right;
height: 46px;
display: inline-block;
padding-right: 10px;
}

/* ---------- */
/* 3. Heading */
/* ---------- */

h1, h2, h3, h4, h5
{
color: #176b97;
padding: 0 0 10px 0;
font-weight: normal;
}

h2
{
font-size: 2.8em;
}

h3
{
font-size: 1.8em;
}

div.booking-section h3
{
font-size: 2.1em;
color: #dd2837;
}

div.facilities-content h1
{
font-size: 1.8em;
}

/* --------------- */
/* 4. Public Class */
/* --------------- */

.clear
{
clear: both;
}

.notes-heading
{
font-weight: bold;
}

/* ---------- */
/* 5. Lay Out */
/* ---------- */

/* level 1 */

div.top-page
{
width: 1019px;
margin: 0 auto;
background: transparent url("../img/bg-top.png") no-repeat 0 20px;
min-height: 469px;
padding: 20px 0 0 0;
xbackground-color: red;
}

.wrapper
{
width: 960px;
margin: 0 auto;
}

div.content
{
width: 960px;
clear: both;
padding: 25px 0 45px 0;
position: relative; /* important - to synchronize the height of the container block with its within elements */
overflow: hidden;   /* important - to synchronize the height of the container block with its within elements */
xbackground-color: yellow;
}

div.footer
{
clear:both;
background-color: #de292f;
border-top: 2px solid #FFF;
height: 200px;
}

/* level 2 */

div.content-sub
{
width: 460px; /* synchronize with div.page-image */
float: left;
padding: 0 0 0 20px;
xbackground-color: blue;
}

div.content-main
{
width: 460px;
float: right;
padding: 0 20px 0 0;
xbackground-color: green;
}

/* level 3 */

div.page-image
{
width: 460px; /* synchronize with div.content-sub */
padding: 0 0 20px 0;
}

div.booking-section
{
width: 431px; /* originally 425px */
xbackground-color: red;
}


/* ---------- */
/* 7. Content */
/* ---------- */

div.main-heading
{
position: absolute;
top:-9999px;
left: -9999px;
}

div.page-image img
{
border: 1px solid #dbdddc;
}

div.content-main li
{
list-style-type: disc;
list-style-position: inside;    
font-size: 0.9em;
}

div.content-main li.item-list
{
clear: both;
list-style: none;
font-size: 1em;
border-top: 1px solid #b1b1b1;
padding: 10px 0 0 0;
}

div.item-image
{
padding: 10px 0 0 0;
float: right;
position: relative;
top: -15px;
}

div.item-image a
{
position: relative;
z-index: 1000;
}

div.item-description
{ 
position: relative;
top: -15px;
}

div.item-image img
{
border: 5px solid #dcdcda;
margin: 55px 10px 10px 10px;
}

/* home-page */

div.main-content
{
width: 460px;
}

table.in-page-menu
{
margin: 0 0 0 40px;
width: 412px;
}

table.in-page-menu li
{
font-size: 1em;
}

/* accomodation page */

div.accomodation-types
{
xwidth: 460px;
xbackground-color: blue;
}

div.accomodation-types ul li.item-list
{
xwidth: 460px;
border-top: 1px solid #b1b1b1;
padding: 10px 0 0 0;
list-style: none;
xbackground-color: red;
}



div.accomodation-types ul li
{
font-size: 1em;
}

/* testimonial page */

div.testimonials-content p
{
font-size: 0.9em;
}


/* contact-us page */

div.contact-text
{
float: left;
}

div.contact-map
{
float: right;
font-size: 0.9em;
}

div.contact-map iframe
{
border: 1px solid #000;
}

/* --------- */
/* 8. Footer */
/* --------- */

div.logo
{
float: left;
padding: 10px 0 0 0;
}

div.footer-nav
{
float: left;
padding: 22px 0 0 25px;
color: #bf0e14;
}

div.legal-section
{
float: right;
padding: 22px 0 0 0;
font-size: 0.9em;
color: #FFF;
word-spacing: 1px;
}

div.secondary-links
{
padding: 5px 0 0 0;
}

/* -------- */
/* 9. Table */
/* -------- */

table
{
font-size: 0.9em;
}

/* -------- */
/* 10. Form */
/* -------- */

iframe.enquiry, iframe.book
{
padding: 10px 0 0 0;
}


label
{
font-weight: bold;
display: block;
}

label.secondary
{
font-weight: normal;
display: inline-block;
padding: 0 5px 0 0;
}

/* 9.1. Form Booking */

form.booking-form table
{
width: 432px; /* originally 425px */
margin: 0 0 5px 0;
}

form.booking-form table td
{
padding: 0 0 10px 0;
xborder: 1px solid black;
}

form.booking-form table td.primary-label
{
padding: 0;
}

form.booking-form table td.right-half
{
padding-left: 10px;
xtext-align: right;
}

form.booking-form table td.right-half label.primary-label
{
xposition: relative;
xtext-align: left;
}

form.booking-form table td.rooms-field
{
padding-left: 15px;
}

form.booking-form table td.second-row
{
padding-top: 5px;
}

form.booking-form table td img
{
position: relative;
top: 6px;
padding: 0 2px 0 0;
}

form.booking-form select
{
font-size: 0.9em;
vertical-align: center;
}

select.month-year, select.room-type
{
width: 134px;
}


/* ----------- */
/* 11. Plug In */
/* ----------- */

/* OVERLAY */

.simple_overlay 
{
display:none;
z-index:10000;
/* styling */
background-color:#fff;
padding:10px;
text-align:left;
width:500px;	
height:400px;
border:1px solid #666;
-moz-box-shadow:0 0 90px 5px #000;
-mox-corner-radius: 9px;
-webkit-box-shadow: 0 0 90px #000;	
}

.simple_overlay .close 
{
background-image:url(../img/close.png);
position:absolute;
right:-15px;
top:-15px;
cursor:pointer;
height:35px;
width:35px;
}

/* jQuery lightBox plugin - Gallery style */

#gallery {
	background-color: #444;
	padding: 10px;
	width: 520px;
}
#gallery ul { list-style: none; }
#gallery ul li { display: inline; }
#gallery ul img {
	border: 5px solid #3e3e3e;
	border-width: 5px 5px 20px;
}
#gallery ul a:hover img {
	border: 5px solid #fff;
	border-width: 5px 5px 20px;
	color: #fff;
}
#gallery ul a:hover { color: #fff; }
#jquery-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
}
#jquery-lightbox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#lightbox-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}

#lightbox-nav-btnPrev, #lightbox-nav-btnNext 
{
	width: 49%;
	height: 100%;
	zoom: 1;	
	display: block;
	opacity:.15;
	filter: alpha(opacity=15);
	-moz-opacity: 0.15;	
}
#lightbox-nav-btnPrev:hover, #lightbox-nav-btnNext:hover {
	opacity:.75;
	filter: alpha(opacity=75);
	-moz-opacity: 0.75;	
}

#lightbox-nav-btnPrev 
{ 
	left: 0; 
	float: left;
	background: transparent url("../img/lightbox-btn-prev.gif") left 15% no-repeat; 
}

#lightbox-nav-btnNext 
{ 
	right: 0; 
	float: right;
	background: transparent url("../img/lightbox-btn-next.gif") right 15% no-repeat; 	
}

#lightbox-container-image-data-box {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%;
	padding: 0 10px 0;
}
#lightbox-container-image-data {
	padding: 0 10px; 
	color: #666; 
}
#lightbox-container-image-data #lightbox-image-details { 
	width: 70%; 
	float: left; 
	text-align: left; 
}	
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
	display: block; 
	clear: left; 
	padding-bottom: 1.0em;	
}			
#lightbox-secNav-btnClose {
	width: 66px; 
	float: right;
	padding-bottom: 0.7em;	
}
