html { background:#365649; /*003320;*/ /*365649;*/ /*567356*/ }
body { font-size: 13px; line-height:1.4em; font-family:Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif; }

/* for base */
.clr { clear:both; }
.right { text-align:right !important }
.left { text-align:left !important }
.center { text-align:center !important }
.top { vertical-align:top !important}
.nowrap { white-space:nowrap }
.hidden { display:none }
.debug { /*border:thin solid red;*/ }
.align-right { float:right; margin: 0 0 15px 15px; }
.align-left { float:left; margin: 0 15px 15px 0; }

/*
.clearFix { zoom: 1; }
.clearFix:after { content: " "; display: block; height: 0; clear: both; visibility: hidden; }
*/

/* basics */
/*
#main { background:#fff; padding:20px 0 30px; }
#main .bottom { border-top:1px solid rgb(221, 221, 221); margin-top:30px; }
*/

a { color:#336699; }
a:visited { color:#334466; }
a:hover { color:#4c555a; text-decoration:underline; }
h1, h2, h3, h4, h5, h6 { font-family:arial, helvetica, sans-serif; font-size:24px; line-height:110%; /*letter-spacing:-1px;*/ margin:0; padding:0 0 .3em 0; color:#121212; }
h1 { font-size:2em }
/*h1.title { margin-bottom:15px; font-size:2.4em; font-weight:bold; color:#678271; /border:1px solid red; width:410px;/ } */
h1.title { font-size:2.4em; font-weight:bold; margin-bottom:0.5em; color:#121212; line-height:1em; }
h2 { font-size:1.8em; margin-bottom:5px; }
h2 .subtext { font-size:0.8em; margin-left:10px }
h3 { font-size:1.5em; }
h4, h5 { font-size:1.2em; } /* letter-spacing:0; line-height:18px; color:#4c555a; } */
h4.subnav a { display:block; color:#4c555a; text-decoration:none; }
/*h5 { margin-top:0; line-height:16px; color:#666; font-weight:normal; }*/
p, blockquote, dl, ol { margin:0; padding:0 0 1em 0; }
/*p.small { font-size:0.9em }*/
/*p.intro, p.strong { font-weight: bold; }*/
p.small { font-size: .85em; }
p.big { font-size: 1.3em; }
dt { font-weight:bold; }
/*img.border { border:1px solid #ddd; }*/
blockquote { font-size:11px; color:#4c555a; line-height:15px; padding:0 2em 1.2em 2em; }
strong { font-weight:bold }
em {font-weight:bold; font-style:italic }
cite { font-style:italic }
input, textarea, select { padding:3px; border:1px solid silver; margin-right:3px } /* margin-right is mainly for checkboxes (spacing for the label to the right */
/*legend { font-weight:bold; padding:0 0 10px; }*/

ul.bullets,
ul.squareList { padding:0 0 1em 0; }
ul.bullets li { list-style-type:circle; list-style-position:outside; margin-left:15px; }
ul.squareList li { list-style-type:square; list-style-position:outside; margin-left:15px; }

ol li { list-style-position:inside; list-style-type:decimal; }
ol.indented li { list-style-position:inside; list-style-type:decimal; margin-left:15px; } 

.message { color:Green; font-weight:bold }
.validationSummary { border:1px dotted silver; padding:5px; background-color:#f9efe6; }
/*.validationSummaryTitle { border:1px solid silver; margin-top:-20px; margin-left:-20px; width:50%; background-color:Red; color:White; padding:2px }*/

#loadingMessage { padding:5px; }
#loadingMessage h1 { font-size:1.5em; font-weight:bold; }

a.linkButton { display:inline-block; padding:2px 4px; border:1px solid silver; text-decoration:none; font-size:0.95em; }
a.linkButton:hover { border:1px solid black; background-color:#eaeaea; }

.buttonSmall { padding:2px 4px; border:1px solid silver; font-size:0.95em; background-color:#eaeaea; border:1px solid silver; }
.buttonDisabled { color:#ccc }


/* content
----------------------------------------------------------------- */

/*
#contentWrapper { margin:15px 0 10px; }

.colLeft { float:left; margin:0 20px 0 0; width:135px; }
.colMiddle { float:left; width:605px; }
.colRight { display:none } / TODO: remove this later (from the markup, too) if we're not going to use it /
*/
/**
.colMiddle { float:left; margin:0 20px 0 0; width:420px; }
.colRight { float:left; margin:70px 0 0; width:150px; }
**/

/*
#navWrapper { margin-top:0; }
ul.nav { list-style-type:none; display:block; font-weight:bold; line-height:165%; width:135px; font-size:11px; letter-spacing:3px; text-transform:uppercase; }
ul.nav li { margin:0 auto 4px; padding:0; /border:1px solid #333;/ }
ul.nav li a { display:block; text-decoration:none; color:#fff; background:#789BC4; padding:5px 0 5px 10px; width:125px; }
* html ul.nav li a { text-decoration:none !important; color:#fff !important; }
ul.nav li a:hover { background:#900 url("../img/vert-one_arrow.gif") no-repeat 0 9px;}
ul.nav li a.current, ul.nav li a.current:hover { background:#933 url("../img/vert-one_arrow.gif") no-repeat 0 9px;}

#footer { margin:40px 0 20px; border-top:1px solid #575757; padding:20px 0 0; text-align:center }
#footer .copyright { font-size:0.9em }

.breadcrumb { margin:0 0 20px; padding:6px 12px; font-size:0.85em; background-color:#eaeaea; }

#blankWrapper { margin:15px; }
*/

.ui-dialog { border:none } /* overrides value in jquery-ui-themeroller.css */

.externalSite { margin:0; padding:0; width:800px; height:464px; }


/*
h2 { font-size:2.4em; font-weight:bold; margin-bottom:0.5em; color:#121212; line-height:1em; }
*/


/* core structure
----------------------------------------------------------------------------- */

#wrapper { margin:10px auto 0; width:960px; /*border-left:10px solid #335649; border-right:10px solid #335649;*/ }

#blankWrapper { padding:15px; background:#fff; }

#strip { padding-left:10px; height:25px; font-size:0.9em; font-weight:bold; background:#577046; line-height:25px; color:#fff; }
h1.strip { padding:0 0 0 10px; height:25px; font-size:0.9em; font-weight:bold; background:#577046; line-height:25px; color:#fff; -moz-border-radius-topleft:3px; -moz-border-radius-topright:3px;}

#header { height:226px; position:relative; margin-bottom:10px; height:170px; }
#header.a { background: url('../img/redwoods3a1.jpg') no-repeat 0px -18px; }
#header.b { background: url('../img/redwoods3a2.jpg') no-repeat 0px -18px; } /* half the file size of .a, but a tiny bit grainier */
/*
#header.a { background: url('../img/mountains1.jpg') no-repeat -50px -140px; }
#header.b { background: url('../img/redwoods2.jpg') no-repeat 0px -600px; }
*/

#header .logo { position:absolute; top:15px; left:20px; width:157px; height:143px; background: url(../img/hwy9-logo-top.png) no-repeat; /*text-indent: -300px; overflow: hidden;*/ }
#header .links { float:right; background:#577046; height:25px; margin:-25px 0; padding:5px 10px 5px 5px; -moz-border-radius:10px; }
#header .links a { display:inline-block; padding:0 10px; color:#fff; font-size:1.1em; text-decoration:none; }
#header .links a:hover { text-decoration:underline; }

#searchBox { width:150px; margin-left:20px; color:#121212; border:none; }
#searchBox.blur { color:#666; }

#navbar { position:absolute; top:115px; left:250px; padding:10px 15px; height:30px; background:rgba(0,0,0,0.4); -moz-border-radius:5px; }
#navbar ul { margin-bottom:0; }
#navbar li { float:left; position: relative; }
#navbar a { display:block; padding:0 15px; line-height:30px; font-size:1.2em; color:#fff; text-decoration:none; -moz-border-radius:5px; /*text-transform:uppercase;*/ }
#navbar a:hover { background:#0f0f0b; }

#content { float:left; width:700px; margin-right:10px; padding:25px 25px 50px; background:#fff; /*d0e3f4;*/ -moz-border-radius:3px; min-height:600px; height:auto !important; height:600px; } /* min-height tweaks based on http://www.dustindiaz.com/min-height-fast-hack/ */
#content .callout { float:right; margin:0 -25px 25px 25px; padding:15px; border:1px solid #d4d0c8; border-right:none; -moz-border-radius-bottomLeft:10px; }

#sidebar { float:left; width:170px; background:#002d1c; margin-top:10px; padding:15px; color:#d0e3f4; -moz-border-radius:10px; }
#sidebar h3 { font-size:1.3em; font-weight:bold; color:#fd7b40; /*ffb593*/ /*background:#668176;*/ /*margin-bottom:1em;*/ -moz-border-radius:2px; }
#sidebar .set { margin-bottom:2em; }
#sidebar a { color:#fff; text-decoration:none; }
#sidebar a:hover { text-decoration:underline; }

.breadcrumb { padding-left:6px; margin-bottom:1em; background:#f2efee; -moz-border-radius:5px; }
.breadcrumb a { display:inline-block; padding:3px; /*margin:0 5px;*/ color:#003320; font-size:0.9em; text-decoration:none; }

#footerWrapper { margin:0 auto 50px; width:960px; }
#footer { float:left; position:relative; width:700px; height:150px; color:#f1f1f1; font-size:0.95em; margin-right:10px; padding:25px; background:#304d42;  /*rgba(0, 0, 0, 0.1);*/ -moz-border-radius-bottomleft:30px; -moz-border-radius-bottomright:30px; }
#footer a { color:#ffb; text-decoration:none; }
#footer a:hover { text-decoration:underline; }
#footer .col { float:left; width:170px; margin-right:20px; }
#footer .col.a { width:260px; }
#footer .col.last { margin-right:0; }
#footer .col a { border-bottom:1px dotted; }
#footer h4 { font-size:1.3em; font-weight:bold; color:#f1f1f1; }
#footer p { font-weight:bold; }
#footer .bottom { position:absolute; bottom:16px; width:700px; text-align:center; font-size:0.9em; }
#footer .bottom a { display:inline-block; padding:0 5px; border-right:2px solid #002d1c; line-height:0.8em; }
#footer .bottom a.last { border-right:none; }

#promo { float:left; position:relative; width:170px; height:180px; }
#promo a { position:absolute; top:50px; left:35px; width:100px; height:99px; background:url(../img/ihwy-logo-small.png) no-repeat; }
#promo .byline { position:absolute; width:170px; text-align:center; bottom:0; font-weight:bold; color:#fafafa; font-size:1.1em; }


/* 12/2/09 JK: hacks to hide some stuff that's not simple to remove from the asp.net code */
.leftCol { display:none; }
.rightCol { display:none; }


/* login/registration form
----------------------------------------------------------------- */

#loginForm { float:left; margin-right:20px; padding:8px; border:1px solid silver; width:270px; }
#registerForm { float:left; padding:8px; border:1px solid silver; width:270px; }

#loginForm .validationSummary,
#registerForm .validationSummary,
#forgotPasswordForm .validationSummary { margin-bottom:10px; font-size:0.9em }

#loginForm .titleWrapper,
#registerForm .titleWrapper { margin:0 2px }

/* directory
----------------------------------------------------------------- */

/*#directoryInfo {  }*/
#largeMap { width:590px; height:490px; border:1px solid silver; }
#largeMapHidden { width:590px; height:490px; position:absolute; top:0; left:-1000px; }
/*#shrinkMap { display:block; float:right }*/

#directoryInfo #listingCol { float:left; width:425px;}
#directoryInfo #listingCol .ratingWrapper { margin-bottom:10px; }
#directoryInfo #listingCol #menus { margin:15px 50px 0 0; padding:5px; border:1px dotted silver; }
#directoryInfo #listingCol #menus h2 { font-size:1.1em; font-weight:bold; }
#directoryInfo #editNav { margin:25px 0 0; }
#directoryInfo #editNav li { margin-right:10px; float:left; }
#directoryInfo #editNav a { display:block; padding:2px 4px; border:1px solid silver; text-decoration:none; font-size:0.95em; float:left; }
#directoryInfo #editNav a:hover { border:1px solid black; background-color:#eaeaea; }

#directoryInfo .row { margin:0 0 2px; }
#directoryInfo .label { float:left; display:block; width:120px; font-weight:bold; }
#directoryInfo .info { float:left; display:block; width:300px; }
#directoryInfo .ratingMsg { margin-left:5px; font-style:italic; }

#directoryInfo #mapCol { float:right; }
#directoryInfo #mapCol #smallMap { border:1px solid silver; height:225px; width:225px; }
.mapShrinker,
#directoryInfo #mapCol .mapTip { font-size:0.9em; margin:5px 0 0; }

#editDirectoryFrame { height:500px; width:600px; margin:0; padding:0; }

.categories .listNav { margin:0 0 10px;}
.categories .listNav a { font-size:0.9em; display:block; float:left; padding:2px 6px; border:1px solid silver; border-right:none; text-decoration:none }
.categories .listNav a.ln-last { border-right:1px solid silver; }
.categories .listNav a:hover,
.categories .listNav a.ln-selected { background-color:#eaeaea }
.categories .listNav a.ln-disabled { color:#ccc }
.categories .listNav .ln-letterCount { text-align:center; font-size:0.8em; line-height:1; margin-bottom:3px; color:#336699; } /* extra styling using jquery.listnav.js internally used class name */

#categoryFunctions { margin-top:10px }

/* other layout stuff
----------------------------------------------------------------- */

.verticalForm label { display:block; font-size:0.9em }
.verticalForm input { margin-bottom:8px; }
.verticalForm .required { color:Red }
.verticalForm .stretch { width:90%; }

table.basic { border-collapse:collapse; /*color:#65645B;*/ }
table.basic td { padding: 2px; }
table.basic td.subhead { font-weight:bold; }
table.basic td.label { white-space:nowrap; }
/*table.basic h2 { font-size:1.3em; font-weight:bold }*/

/*
table.form input.inputOn { border:2px solid #999 }
table.form input.inputOff { border:1px solid silver }
*/
table.form label.error { font-style:italic }

/* css forms
------------------------------------------------------------------ */

.popupForm { font-size:0.95em; }
.popupForm .fieldGroup { margin-top:15px; }
.popupForm .fieldGroup.first { margin-top:0; }
.popupForm .field { margin:0 0 4px; clear:both; }
.popupForm .field label { width:110px; display:block; float:left; }
.popupForm .field .x60 { width:60%; }
.popupForm .field .x70 { width:70%; }
.popupForm .required { color:Red; }
.popupForm .buttonSet { margin:15px 0 0 110px; }

.popupForm .history, .popupForm .history #sliderHeading, .popupForm .history #slider, .popupForm .history #sliderSubtext { width:250px; }
.popupForm .history { float:left; margin:-5px 0 0 35px;  }
.popupForm .history #sliderHeading { margin-bottom:3px; text-align:center; }
.popupForm .history #slider { }
.popupForm .history #sliderSubtext { margin-top:3px; text-align:center; }

/* weather
------------------------------------------------------------------ */

.weather { border:1px solid silver; float:left; margin-bottom:20px; }
.weather h2 { background-color:#eaeaea; font-size:1.3em; font-weight:bold; padding:5px; }
.weather .box { float:left; margin-bottom:5px; }
.weather .box h3 { font-size:1em; font-weight:bold; padding:3px 0 3px 6px; }
.weather .box img { float:left; margin:0 6px 0 3px; }
.weather .details { float:left; margin-right:25px; }

/* virtual tours (reference: http://jqueryfordesigners.com/slider-gallery/ )
-------------------------------------------------------------------- */

.virtualTour .tourTip { margin:5px 0 0 5px; font-size:0.8em }

.galleryWrapper { border:1px solid silver; padding:5px; width:575px; }
.galleryWrapper .sliderGallery { overflow: hidden; position:relative; height:320px; } /* height is for boulder creek virtual tour: split out if needed for another tour */
.galleryWrapper .sliderGallery ul {	position:absolute; list-style:none; overflow:none; /*white-space: nowrap;*/ } /* may need white-space if a tour has more than one LI (see reference) */
.galleryWrapper .sliderGallery ul li { display:inline; }
.galleryWrapper .slider { position:relative; top:305px; } /* top is for boulder creek virtual tour: split out if needed for another tour */
.galleryWrapper .handle { position:absolute; cursor:move; top:1; z-index:100; height:15px; width:100px; } /* top:1 magically aligns the handle on top of it's timeline (probably a quirk of the jquery ui theme) */

/* comments
-------------------------------------------------------------------- */

#comments { margin-top:20px; border:1px solid silver; padding-bottom:20px; }
#comments h2 { font-size:1.1em; font-weight:bold; line-height:1; }
#comments h2.title { font-size:1.3em; font-weight:bold; line-height:1; padding:10px; background-color:#f1f1f1; }
#comments .comment { padding:10px; }
#comments .comment .header { border-bottom:1px solid #E5E5E5; padding:5px 8px; font-size:0.85em; }
#comments .comment .msg { padding:8px; font-size:0.85em; }
#comments .comment .delComment { display:block; margin-right:20px; text-decoration:none; }
#comments .comment .delComment:hover { text-decoration:underline; }

#comments #commentFunctions { margin-top:10px }
#comments #commentFunctions a.addAnother { margin-left:10px; }
#comments #commentFunctions a.beFirst { display:block; margin-left:10px; }
#comments #commentBody { width:95%; height:100px; }
#comments #commentButtons { margin:15px 0 0 }
#comments #commentButtons input { margin-right:10px }
#comments #saveMsg { display:inline-block; }

#commentWidget { padding:0 20px; }
#commentWidget #ratingWrapper { margin:15px 0; }
#commentWidget #ratingWrapper p.label { font-weight:bold; margin-bottom:5px; padding:0; }
#commentWidget #commentRatingMsg { font-style:italic; margin-left:20px; }
#commentWidget #commentRatingNote { margin:4px 0; font-size:0.85em; }

/* ===================================================================
   ADMIN AREA
==================================================================== */

/* content editor
------------------------------------------------------------------- */

#contentEditor .fileTreeWrapper { border:1px solid silver; height:400px; overflow:scroll; padding:5px; width:200px }
#contentEditor .buttonBar { margin:10px 0 0; }
#contentEditor #saveMessage, #contentEditor #commitMessage { color:Green; font-weight:bold; }