/*---------------------------------------

CSS code by: Cheyne Gallarde
coded: May 2008

-------------------------------------------*/


/*----------------------------------------
These are the universal controls (titles, body text, etc.)
-------------------------------------------*/

body {
	font: normal 16px Verdana;
	color: #333333; background-attachment: scroll; background-color: #A9DDEB; background-position: left top;
}


#container2 {
	 width: 750px; _width: 750px;
      margin:1em auto; border: 0px; margin-top:0;
	  top: 0px; text-align:left;
      max-width: 1024px;
}

#navbar {width: 100%; padding:0; float:left; margin:0; line-height: 12px; background-color: #304F7E;}

ul#list-nav {
list-style:none;
margin:0;
padding:0;
width:800px;
}

ul#list-nav li {
display:inline;
}

ul#list-nav li a {
text-decoration:none;
font-size: 11px;
padding:5px 0;
width:15%;
background:#304F7E;
color:#eee;
float:left;
text-align:center;
border-left:1px solid #fff;
}

ul#list-nav li a:hover {
background-color: #918950;
color:#FFF;
}

.bodytext {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 18px;
	color: #666666;
	margin: 10px;
	padding: 0px;
}

.menuText{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	line-height: 20px;
	font-weight: #000000;
	color: #333333;
	margin: 10px;
}

.bodytext li{
	font-size: 10px;
	line-height: 13px;
}

.bodyheader {
	font-size: 14px;
	font-weight: bolder;
	color: #FF3300;
}

.thumbText li{
	font-size: 11px;
	line-height: 13px;
	text-decoration: none;
}

.bodySub {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #336092;
	font-size: 12px;
	line-height: 14px;
}

.ac {
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 0px;
}

.bodyTitle {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bolder;
	color: #336092;
}

.titCenter {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bolder;
	color: #336092;
	text-align: center;
	padding: 10px;
}

.titCenter a{
	color: #FF6600;
	text-decoration: underline;
}

.MainTitle {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 22px;
	font-weight: bolder;
	color: #336092;
}


#content .bodytext {
	margin:20px;
	font-family: arial;font-size: 13px;
	line-height: 20px;
	width: 450px;
	color: #333333;
}

#content li {
	font-family: arial;font-size: 13px;
	line-height: 20px;
	color: #333333;
	margin-left: 20px;
}
   
#content .header {
	_margin: 0px;
	margin: 0px;
	font-family: arial;
	padding: 0px; _padding: 0px;
	clear: both;
	position: absolute; 
	color: #333333;
	_min-height: 100px;
	z-index: 0;
}

#TourInfo {
      width: 100%;
      margin:1em auto;
      border: 0; padding: 0;
      text-align:left;
      max-width: 1024px;
      }
	  
#sidebar {
      width: 100%; height: 500px;
	  background-color: #FFFF9F;
      margin: 0; padding: 0;
	  display: block;
}

#sidebar-green {
      width: 100%; height: 660px;
	  background-color: #E0FFA2;
      margin: 0; padding: 0;
	  display: block;
}


#sidebar-blue {
      width: 100%; height: 660px;
	  background-color: #99CCCC;
      margin: 0; padding: 0;
	  display: block;
}

#sidebar-blue .content {
	padding: 15px;
	display: block;
	width: 250px;
}

#banners {
      float: right; clear: both;
      width: 269px;
      margin: 0; padding: 0;
	  display: block;
}


#sidebar .content, #sidebar-green .content {
	margin: 0; padding: 5px;
	display: block;
	width: 250px;
	height: 100px;
	border-bottom: 1px dotted #ffcc33;
	color: #000000;
}

.sidebanner {margin: 8px 0;}

.sidebanner2 {margin: 0 0 8px 0; }

#tour {
      float: left;
      width: 70%; height:300px;
	  position: relative;
      margin:0; padding:0;
}
	  
#tour-content {
	float: left;
	position: absolute;
	width: 500px;
    font-size: 90%;
	line-height:20px;
}

#notes {
margin:0 0 0 30%
}

#notes .side {
 _margin:0; _padding: 0.5em 1em;
      font-size: 70%;
	  line-height: 19px;
	  _height: 300px; height: 300px;
	  overflow:auto;
	  min-height: 100px;
}



/*----------------------------------------
These are the Inline buttons (ie: More Info, More Details, etc.)
-------------------------------------------*/

.inline-button {
   _width:20em; width: 20px;
   font: bold 60% arial, sans-serif;
   margin-right: 10px; padding: 3px; _padding:0;
   border: 1px solid black;
   white-space:nowrap;
   text-decoration: none;
   vertical-align: middle;
   background: #06c;
   color: #ffffff;
   float: none; _float: none;
   }

.inline-button span {
   _width:1em; width: 25px; _cursor:hand;
   margin:0; padding: 0.1em 0.5em 0.1em 0.3em;
   _margin:0; _padding: 0.1em 0.5em 0.1em 0.3em;
   }
.inline-button:hover {
   background-color: #FFFF00;
   color: #333333;
   }
   

.info-button {
   _width:20px; width: 100px;
   font: bold 60% arial, sans-serif;
   margin: 15px; padding: 8px; _padding:0;
   border: 1px solid black;
   white-space:nowrap;
   text-decoration: none;
   vertical-align: middle;
   background: #06c;
   color: #ffffff;
   float: right;
   }

.info-button span {
   _width:1em; _cursor:hand;
   margin:0; padding: 0.1em 0.5em 0.1em 0.3em;
   _margin: 0; _padding: 0.1em 0.5em 0.1em 0.3em;
   }
.info-button:hover {
background-color: #FFFF00;
   color: #333333;
   }


/*----------------------------------------
These are the image controls (ie: thumnail, activity photos, etc.)
-------------------------------------------*/

.ImgClip {
	float: left;
	margin: 10px;
	width: 174px;
	height: auto;
}
 

.thumbText {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 14px;
	color: #333333;
	margin: 0 10 15 0;
	padding: 0px;
	display: block;
}


.imgnoborder {
	margin: 0px;
	padding: 0px;
	float: left;
	position: relative;
}

.imgInline {
	margin: 0;
	padding: 0 10px;
	display: inline;
	float: left;
	position: relative;
}


/*----------------------------------------
This is for the Activity portion of Reservations Page
-------------------------------------------*/

#res {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	width: 95%;
	line-height: 14px;
	display: table;
	padding: 10px;
	clear: both;
	position: relative; left: 20px;
}

#res td {
font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 18px;
	width: 200px;
	color: #666666;
	margin: 0; padding: 10px;
	border-bottom: .05em dotted #666666;
}

#res .even td {
background:#f0f0ff;
text-align: left;
}

#res select, input {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 18px;
	color: #666666;
	margin: 1px; padding: 0px;
	border: 1px solid #999999;
	float: left;
}

.rowOahu td{
	background-color: #CCFF99;
}

.rowKauai td{
	background-color: #CCCCFF;
}

.rowMaui td{
	background-color: #FFCCCC;
}

.rowBi td{
	background-color: #FFFF66;
}

.newRow td{
	border-bottom: 1px solid #999999;
}


/*----------------------------------------
This is for the Contact & Payment Information Box
-------------------------------------------*/

#contact {
	font-family: Arial, Helvetica, sans-serif;
	font-sisze: 12px;
	width: 95%;
	line-height: 14px;
	display: table;
	padding: 10px;
	clear: both;
}

#contact td {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 18px;
	width: 200px;
	text-align: right;
	color: #666666;
	margin: 0; padding: 10px;
	border-bottom: 1px dotted #666666;
}

#contact .even {
	text-align: left;
}

#contact select, input {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 18px;
	color: #666666;
	margin: .05em; padding: 0px;
	border: 1px solid #999999;
	float: left;
	clear: both;
}

/*----------------------------------------
This is for Activity Page timing information
-------------------------------------------*/

.timing {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	width: 80%;
	line-height: 14px;
	padding: 10px;
	margin: 0px;
	border-width: 2px 2px 2px 2px;
	border-style: dotted none dotted none;
	border-color: #666666;
	float: left;
	clear: both;
}

.timing-content {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bolder;
	margin: 0px;
	padding: 5px;
	font-size: 12px;
	text-align: right;
}


#timing td {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 18px;
	width: 100%;
	color: #666666;
	margin: 0 0 0 0; padding: 0px;
	background: white;
}

/*----------------------------------------
This is the generic code to create Zebra striped tables
-------------------------------------------*/
.even td{
	background:#f0f0ff;
}


#nav, #nav ul {
	_float: left; float: left;
	_width: 100%; width: 100%;
	list-style: none;
	line-height: 0;
	background: #FFFFCC;
	font-weight: bold;
	border: 0;
	_padding: 0; padding: 0;
	_margin: 0; margin: 0;
	color: #000000;
	z-index: 2px;
}

#nav a {
	_display: block; display: block;
	text-decoration: none;
	padding: 0; _padding: 0;
}

#nav a.daddy {
	color: #ffffff;
}

#nav li {
	_float: left; float: left;
	_padding: 0px; padding: 0px;
}

#nav li ul {
	_position: absolute; position: absolute;
	left: -999em; _left: -999em;
	_height: 100px; height: auto;
	_width:190px; width: 190px;
	font-weight: normal;
	border: 0;
	_margin: 0; margin: 0;
	z-index: 2;
}

#nav li li {
	_padding-right: 0;
	width: 190px;_width: 190px;
}

#nav li ul a {
	_width: 190px;width: 190px;
}

#nav li ul ul {
	margin: -1.75em 0 0 14em;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
	left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
	left: auto;
}

#nav li:hover, #nav li.sfhover {
	background-color: #FFFF00;
	color: #000000;
}