html{
	font-family:Verdana, Arial, sans-serif;
	font-size:13px;
	color:#777777;
}
p{ margin:0 0 10px 0; }
strong{ font-weight:bold; }

#wrapper{
	width:980px;
	margin:0 auto;
}

#center{
	background-color:#fff;
	padding-bottom:20px;
}


/* header
------------------------------------------------------------------------------------*/
#header{
	position:relative;
	height:110px;
}
#header a.visit{
	position:absolute;
	top:60px;
	right:20px;
	font-family:Arial, Verdana, sans-serif;
	font-size:11px;
	line-height:11px;
	font-weight:bold;
	text-decoration:none;
	padding-left:10px;
}
#header a.visit:hover{ text-decoration:underline; }
/*----------------------------------------------------------------------------------*/


/* main nav
------------------------------------------------------------------------------------*/
#nav{
	height:38px;
	background-color:#fff;
}
#nav li{
	float:left;
	position:relative;
}
#nav li a{
	display:block;
	height:38px;
	background:url(../images/kauai/nav.gif) no-repeat left top;
	text-indent:-9999px;
	outline:0; /* removed outline in firefox when clicking nav items */
}
/* normal styles */
#nav li a.item-1{ width:175px; background-position:0px 0px; }
#nav li a.item-2{ width:209px; background-position:-175px 0px; }
#nav li a.item-3{ width:230px;	background-position:-384px 0px; }
#nav li a.item-4{ width:213px; background-position:-614px 0px; }
#nav li a.item-5{ width:153px; background-position:-827px 0px; }
/* highlighted and selected */
#nav li a.item-1:hover, #nav li.selected a.item-1{ background-position:0px -38px; }
#nav li a.item-2:hover, #nav li.selected a.item-2{ background-position:-175px -38px; }
#nav li a.item-3:hover, #nav li.selected a.item-3{ background-position:-384px -38px; }
#nav li a.item-4:hover, #nav li.selected a.item-4{ background-position:-614px -38px; }
#nav li a.item-5:hover, #nav li.selected a.item-5{ background-position:-827px -38px; }
/* triangle accent */
#nav span.accent{
	display:none;
	position:absolute;
	bottom:-14px;
	width:25px;
	height:15px;
	background:url(../images/nav_accent.png) no-repeat left top;
}
#nav li.selected a span.accent{ display:block; }
#nav a.item-1 span.accent{ left:63px; }
#nav a.item-2 span.accent{ left:92px; }
#nav a.item-3 span.accent{ left:102.5px; }
#nav a.item-4 span.accent{ left:98px; }
#nav a.item-5 span.accent{ left:68px; }
/*----------------------------------------------------------------------------------*/


/* masthead
------------------------------------------------------------------------------------*/
#masthead{
	border-bottom:1px solid #e7e7e7;
	padding:0 0 6px 7px;
}
#masthead img{ display:block; }
/*----------------------------------------------------------------------------------*/


/* sub mast
------------------------------------------------------------------------------------*/
#sub-mast{
	margin:25px 30px 25px 30px;
	overflow:hidden;
	background:url(../images/waikiki/sub_mast_divider.jpg) no-repeat 645px top;
}
#sub-mast .column-left{
	width:620px;
	font-size:13px;
	line-height:1.7em;
	float:left;
}
#sub-mast .column-right{
	float:right;
}
/*----------------------------------------------------------------------------------*/


/* selection map
------------------------------------------------------------------------------------*/
#selection-map{
	width:245px;
	margin:15px 0;
}
#selection-map h3{
	width:235px;
	height:9px;
	margin-bottom:20px;
}
#selection-map li{ float:left; }
#selection-map li a{
	display:block;
	text-indent:-9999px;
	outline-style:none;
}
#selection-map li a:hover{ background-color:#cb7308; }
/* kauai */
#selection-map li.kauai a{
	width:48px;
	height:50px;
	margin-right:25px;
	background-image:url(../images/map/kauai.png);
	background-repeat:no-repeat;
}
/* waikiki */
#selection-map li.waikiki a{
	width:45px;
	height:50px;
	background-image:url(../images/map/waikiki.png);
	background-repeat:no-repeat;
}
/* maui */
#selection-map li.maui a{
	width:59px;
	height:50px;
	margin-right:5px;
	background-image:url(../images/map/maui.png);
	background-repeat:no-repeat;
}
/* the big island */
#selection-map li.big{
	text-indent: -9999px;
	width:54px;
	height:50px;
	margin-top:15px;
	background-image:url(../images/map/big.png);
	background-repeat:no-repeat;
}
/*----------------------------------------------------------------------------------*/

/* tab content
------------------------------------------------------------------------------------*/
#tab-content{
	position:relative;
	margin:0 20px;
}
#tab-content p.tab-help{
	position:absolute;
	top:0px;
	left:15px;
	line-height:41px;
}

/* tabs */
#tab-content .tabs{
	height:41px;
	overflow:hidden;
	background:url(../images/background_tabs.gif) repeat-x left bottom;
}
#tab-content .tabs li{ float:right; }
/* normal */
#tab-content .tabs li a{
	display:block;
	height:41px;
	text-indent:-9999px;
}
#tab-content .tabs li a.family{ width:101px; background-position:0px 0px; }
#tab-content .tabs li a.romance{ width:221px; background-position:-101px 0px; }
#tab-content .tabs li a.wedding{ width:118px; background-position:-321px 0px; }
#tab-content .tabs li a.friends{ width:163px; background-position:-439px 0px; }
#tab-content .tabs li a.activities{ width:121px; background-position:-602px 0px; }
/* selected and hover */
#tab-content .tabs li.selected a.family{ background-position:0px -41px; }
#tab-content .tabs li.selected a.romance{ background-position:-101px -41px; }
#tab-content .tabs li.selected a.wedding{ background-position:-321px -41px; }
#tab-content .tabs li.selected a.friends{ background-position:-439px -41px; }
#tab-content .tabs li.selected a.activities{ background-position:-602px -41px; }

/* tab contents */
#tab-content .content{
	zoom:1; /* trigger has layout for ie7 */
	padding:0;
	border-left:1px solid #e4e0da;
	border-right:1px solid #e4e0da;
	border-bottom:1px solid #e4e0da;
}
/*----------------------------------------------------------------------------------*/


/* resort content
------------------------------------------------------------------------------------*/
/* headings for the different tabs */
#resort-content h2{
	text-indent:-9999px;
	height:150px;
}
#resort-content h2.family{
	width:511px;
	background:url(../images/heading_family.png) no-repeat left top;
}
#resort-content h2.romance{
	width:632px;
	background:url(../images/heading_romance.png) no-repeat left top;
}
#resort-content h2.wedding{
	width:623px;
	background:url(../images/heading_wedding.png) no-repeat left top;
}
#resort-content h2.friends{
	width:630px;
	background:url(../images/heading_friends.png) no-repeat left top;
}
#resort-content h2.activities{
	width:692px;
	background:url(../images/heading_activities.png) no-repeat left top;
}
/* define some content buckets to float images left or right */
#resort-content .bucket-left{
	overflow:hidden;
	margin:0 0 20px 0;
}
#resort-content .bucket-left .image{
	float:left;
	text-align:left;
}
#resort-content .bucket-left .copy{ float:left; }
#resort-content .bucket-right{
	overflow:hidden;
	margin:0 0 20px 0;
}
#resort-content .bucket-right .image{
	float:right;
	text-align:right;
}
#resort-content .bucket-right .copy{ float:right; }
/* variants are used to apply different spacing to the text and images */
#resort-content .variant-1 .image{ width:290px; }
#resort-content .variant-1 .copy{ width:570px; }
#resort-content .variant-2 .image{ width:350px; }
#resort-content .variant-2 .copy{ width:530px; }
#resort-content .variant-3 .image{ width:320px; }
#resort-content .variant-3 .copy{ width:560px; }
/* these can be used to tweak the margins to help position things more finely */
#resort-content .top-10{ margin-top:10px; }
#resort-content .top-20{ margin-top:20px; }
#resort-content .top-30{ margin-top:30px; }
#resort-content .top-70{ margin-top:70px; }

#resort-content h3{
	margin:0 0 15px 0;
	font-size:16px;
	font-weight:bold;
}
#resort-content p{ line-height:1.6em; }
#resort-content ul.second-list{ margin-left:60px; }
#resort-content ul li{ margin:5px 0; }
/*----------------------------------------------------------------------------------*/


/* quickbook
------------------------------------------------------------------------------------*/
#quickbook{
	height:250px;
	margin:5px 0 15px 0;
	font-size:10px;
	color:#fff;
	overflow:hidden;
}
#quickbook a:link, #quickbook a:visited{
	color:#fff;
	text-decoration:underline;
}
#quickbook form{
	float:left;
	width:657px;
	padding:25px 30px;
	color:#fff;
}
#quickbook .left_col{
	float:left;
	width:246px;
}
#quickbook .right_col{
	float:left;
	width:226px;
}
#quickbook h2{
	margin-bottom:20px;
	font-size:14px;
	font-weight:bold;
	text-transform:uppercase;
}
#quickbook .input{
	position: relative;
	margin: 0 0 9px;
}
#quickbook .input.inline { float:left; }
#quickbook .input.sm {
	width:60px;
	margin-right:15px;
}
#quickbook label{
	display:block;
	margin:0 0 2px;
}
#quickbook input{
	font-size:10px;
}
#quickbook input.lg{ width:177px; }
#quickbook input.md{ width:146px; }
#quickbook select{
	margin: 0 10px 0 0;
	font-size: 10px;
}
#quickbook select.month{ width:129px; }
#quickbook select.day{ width:42px; }
#quickbook #submit{ margin:10px 0 0; }
#quickbook a.calendar{
	position:absolute;
	top:0;
	left:171px;
	display:block;
	width:13px;
	height:10px;
}
#quickbook a.calendar span{ display: none; }
#quickbook li{margin: 0 0 5px; }
#quickbook #promos{
	float:left;
	width:220px;
	padding:55px 0 0 24px;
}
#quickbook #promos h3{
	margin:0 0 4px;
	padding:0 3px 0;
	font-weight:bold;
	text-transform:uppercase;
}
#quickbook #promos a{
	display:block;
	margin:0 0 12px;
}
#quickbook .button-submit{
	width:104px;
	height:20px;
	border:none;
	cursor:pointer;
	margin-top:10px;
}
/*----------------------------------------------------------------------------------*/


/* footer
------------------------------------------------------------------------------------*/
#footer{
	overflow:hidden;
	margin:0 0 30px 0;
	font-family: Arial, Verdana, sans-serif;
	font-size:13px;
	color:#fff;
}
#footer .learn-more{
	float:right;
	font-size:11px;
	color:#fff;
}
/*----------------------------------------------------------------------------------*/


/* utility classes
------------------------------------------------------------------------------------*/
.clear{ clear:both; }
.hidden{
	visibility:hidden;
	display:none;
}
.text-hidden{ text-indent:-9999px; }
.float-left{ float:left; }
.float-right{ float:right; }
.paddingright70 {padding-right:70px;}
.paddingright100 {padding-right:100px;}
/*----------------------------------------------------------------------------------*/