/*	
		--------------------------------------------
			Main Stylesheet for Harbor House Site	
			by: Richard Manning						
			Date: January 2009						
		--------------------------------------------
	*/

/* @reset */

* {
	margin: 0;
	padding: 0;
	border: 0;
}

a img, :link img, :visited img {
	border: 0;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

ol, ul {
	list-style: none;
}

/* @tags */

body {
	background: #fff;
	color: #434343;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 16px;
	padding-top: 10px;
}

a, a:link, a:visited {
	color: #434343;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: normal;
	letter-spacing: normal;
	line-height: normal;
	text-decoration: none;
}

a:active, a:hover {
	color: #ba0202;
}

p {
	font-size: 0.875em;
	line-height: 1.5em;
	letter-spacing: 1px;
	padding-bottom: .5em;
}

/* @noncontent */

.ds-right {
	position: absolute;
	top: 0px;
	right: 0px;
}

.ds-bottom {
	background: url(../img/ds_b.gif) repeat-x;
	clear: both;
	height: 10px;
	position: relative;
}

.bt-lft-corner {
	float: left;
}

.bt-rt-corner {
	position: absolute;
	right: 0px;
	top: 0px;
}

/* @generics */

#outer-container {
	border: 1px solid #ba0202;
	margin: 0 auto;
	padding: 20px 12px 0px 20px;
	position: relative;
	width: 900px;
}

#inner-container {
	border: 1px solid #cdcdcd;
	float: left;
	padding: 20px 0 0 0px;
	position: relative;
	width: 890px;
}

#inner-wrap {
	background: url(../img/ds_r.gif) repeat-y right top;
	padding-right: 8px;
	position: relative;
	width: 892px;
}

#header {
	height: 70px;
	padding: 0 0 10px 24px;
	position: relative;
}

#hdr-mask {
	position: absolute;
	top: -20px;
	right: 0px;
}

.hdr-title {
	/*background: url(../img/hh_logo.gif) no-repeat;*/
	display: block;
	float: left;
	/*font-size: 1.5em;*/
	height: 52px;
	/*text-indent: -9999px;*/
	width: 280px;
}

.hdr-res {
	font-family: "Lucida Sans Unicode", "Lucida Grande", Arial, Helvetica, sans-serif;
	position: absolute;
	left: 32px;
	text-transform: uppercase;
	top: 60px;
	z-index: 30;
}

.hdr-res a, .hdr-res a:link, .hdr-res a:visited, .hdr-res a:active, .hdr-res a:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: .625em;
}

.hdr-res span {
	display: block;
	text-align: center;
}

.hdr-quote {
	float: right;
	margin-right: 96px;
}

#top-nav {
	clear: both;
	height: 27px;
	margin-bottom: 6px;
	position: relative;
}

#top-nav img {
	position: absolute;
	right: 0;
	top: 0px;
	z-index: 10;
}

#top-nav ul {
	overflow: hidden;
	position: absolute;
	top: 0px;
	right: 0px;
	width: 582px;
	z-index: 20;
}

#top-nav .menu-item {
	padding-left: 20px;
	margin-right: 20px;
}

#top-nav li.last-item {
	margin-right: 40px;
}

.menu-item {
	float: left;
	padding-left: 20px;
	margin-right: 20px;
}

.menu-item a, .menu-item a:link, .menu-item a:visited {
	color: #6b6b6b;
	font-size: 1.125em;
	letter-spacing: 2px;
	line-height: 1.5em;
}

.menu-item a:active, .menu-item a:hover {
	color: #ba0202;
	font-size: 1.125em;
	letter-spacing: 2px;
	line-height: 1.5em;
}

.first-item {
	padding-left: 0px;
}

.selected {
	background: url(../img/red_flag.gif) no-repeat left center;
}

.selected a { color: #ba0202; }

#content {
	border-top: 1px solid #434343;
	padding-top: 30px;
	position: relative;
}

div#main-content {
	margin-top: 18px;
	padding: 0 10px 10px;
	position: relative;
}

#slideshow { }

div#intro {
	padding: 10px;
}

div#intro img {
	padding: 0 10px;
}

div#intro a {
	font-style: italic;
	text-decoration: underline;
}

p.intro-text {
	font-style: italic;
	padding-left: 8px;
}

cite {
	font-size: .75em;
	font-style: normal;
	padding-left: 2.5em;
}

#footer {
	border-top: 1px solid #ba0202;
	margin: 3px 8px 0 0;
}

#footer ul {
	overflow: hidden;
}

#footer .menu-item {
	line-height: 2.5em;
	/*margin-right: 52px;*/
	margin-right: 12px;
}

#footer li.last-item {
	margin-right: 20px;
}

img.upper-rt {
	position: absolute;
	right: 10px;
	top: 12px;
}

#sub-footer {
	color: #666;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: .625em;
	letter-spacing: normal;
	margin: 16px auto;
	text-transform: uppercase;
	width: 900px;
}

#sub-footer .address-info {
	text-align: center;
}

#sub-footer a:link, #sub-footer a:active, #sub-footer a:visited {
	color: #666;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

#sub-footer a:hover {
	color: #333;
}

#sub-footer .associations {
	margin: 16px 180px 0 0;
}

#sub-footer .site-cred {
	margin: 16px 0 0 0;
}

#sub-footer .attrib {
}

#sub-footer p {
	letter-spacing: normal;
	line-height: normal;
	margin-top: 6px;
}

#sub-footer div p {
	padding: 18px 0 0 0;
}

#sub-footer .address-info p {
	margin: 10px 0;
	padding: 0;
}

#sub-footer div img {
	margin: 0 12px 0 0;
}

.left {
	float: left;
}

.right {
	float: right;
}

/* @amenities */

#amenities #main-content {
	margin: 0;
}

#amenities #content {
	background: url(../img/robe_bg.jpg) no-repeat right bottom;
}

div.amenities {
	margin: 0 0 10px 10px;
	width: 420px;
}

div.amenities li {
	background: url(../img/leaf_bullet.gif) no-repeat left 2px;
	color: #446c8f;
	font-family: "Trebuchet MS", "Lucida Sans", "Lucida Sans Unicode", Verdana, sans-serif;
	font-size: .875em;
	font-weight: bold;
	letter-spacing: 1px;
	padding: 0 0 14px 22px;
}

div.amenities img {
	margin-left: 28px;
}

#amenities div.cola a:hover { color: #ba0202; }

/* @last */

div.last {
	bottom: 0px;
	margin: 0 24px 20px 0;
	position: absolute;
	right: 0px;
	width: 300px;
}

div.last li a, div.last li a:link, div.last li a:visited, div.last li a:active, div.last li a:hover {
	font-style: italic;
	letter-spacing: normal;
	padding: 0 8px 0 36px;
}

/* @local-flavor */

div.local-flavor li {
	padding: 4px 6px 8px;
}

div.local-flavor li.last {
	padding-bottom: 0;
}

/* @recipes */

li.recipe {
	margin: 0 0 1em 20px;
}

#recipes #content {
	background: url(../img/recipes_bg.jpg) no-repeat right bottom;
}

#recipes div#intro img.left { padding-right: 24px; }

#recipes p.intro-text {
	padding-bottom: 1.5em;
}

div.cola li.recipe a, div.cola li.recipe a:link, div.cola li.recipe a:visited, div.cola li.recipe a:active, div.cola li.recipe a:hover {
	font-size: .875em;
}

/* @directions */

#directions #inner-container {
	background: #FDF8EA;
}

#directions .hdr-title {
	background: url(../img/hh_logo_tan.gif) no-repeat;
}

div#main-content #map {
	background: #eee;
	border: 2px solid #ba0202;
	margin: 0 auto 40px;
	padding: 4px;
	width: 425px;
}

#directions #content {
	background: url(../img/map_fade.jpg) no-repeat center center;
}

/* @homepage */

#homepage #content {
	border: 0 none;
	padding: 20px 0 14px 50px;
}

#thumb-container {
	overflow: hidden;
	width: 278px;
}

.thumb-pic {
	height: 124px;
	margin-bottom: 20px;
	width: 124px;
}

#homepage #slideshow {
	bottom: 0px;
	height: 579px;
	margin: 0;
	position: absolute;
	width: 460px;
	right: 0px;
}

#txt-slideshow {
		/*  background, height, margin-left and text-indent added */
	background: url(../images/main_quote_dark.gif) no-repeat;
	height: 144px;
	margin-left: 10px;
	margin-top: -10px;
	/*padding-left: 10px;*/
	text-indent: -99999px;
	width: 240px;
}

#txt-slideshow p {
}

/* @cola */

div.cola {
}

div.cola div {
	margin-right: -14px;
	margin-top: 50px;
	padding: 4px;
}

div.cola a, div.cola a:link, div.cola a:visited, div.cola a:active, div.cola a:hover { display: block; }

div.cola li a, div.cola li a:link, div.cola li a:visited, div.cola li a:active, div.cola li a:hover {
	background: url(../img/hh_bullet3.gif) no-repeat left top;
	display: block;
	height: 26px;
	letter-spacing: 1px;
	padding-left: 34px;
}

div.cola div.hr {
	border-bottom: 2px solid #890202;
	margin: 26px auto 0;
	width: 100%;
}

div.cola p {
	letter-spacing: normal;
	line-height: 1.28em;
	padding: 1.15em 0 0;
}

div.cola p.last {
	padding-bottom: .75em;
}

div.cola p a, div.cola p a:link, div.cola p a:visited, div.cola p a:active, div.cola p a:hover {
	display: inline;
	text-decoration: underline;
}

div.cola p.info {
	font-family: "Lucida Sans Unicode", "Lucida Grande", Arial, Helvetica, sans-serif;
	font-size: .75em;
	font-weight: normal;
	line-height: normal;
	margin-top: 24px;
	padding: 10px 16px;
	text-align: center;
}

div.cola h3 {
	border-bottom: 2px solid #ba0202;
	color: #ba0202;
	font-variant: small-caps;
	margin: 0 auto;
	padding-bottom: 4px;
	text-align: center;
	width: 60%;
}

/* @contact */

div.contact {
	margin: 40px 0 0 60px;
}

#contact div.contact p {
	color: #446c8f;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 1.625em;
	padding: 0;
	text-align: center;
}

div.contact img {
	margin-left: 36px;
}

#contact div.contact a {
	color: #446c8f;
	font-family: Arial, Helvetica, sans-serif;
}

#contact div.contact a:hover {
	color: #ba0202;
}

/* @the-rooms */

#the-rooms div.cola {
	margin: 14px 20px 0 0;
	width: 300px;
}

#the-rooms div.cola p {
	text-align: center;
}

#the-rooms #slideshow {
	margin-top: -50px;
}

/* @the-food */

#the-food div.last li a, #the-food div.last li a:link, #the-food div.last li a:visited, #the-food div.last li a:active, #the-food div.last li a:hover {
	font-style: italic;
	letter-spacing: normal;
	padding: 0 8px 0 36px;
}

#the-food div.cola {
	padding: 0 10px 0 0;
	width: 126px;
}

#the-food div.last {
	margin: 0 140px 10px 0;
	padding: 0;
	width: 170px;
}

#the-food div.last ul {
	padding-left: 36px;
}

#the-food div.last p {
	color: #ba0202;
	font-size: 1em;
	font-weight: bold;
	padding-bottom: 10px;
}

/* @the-inn */

#the-inn div.cola, #inn-history div.cola {
	margin: 14px 20px 0 0;
	width: 400px;
}

#innkeeper div.cola {
	margin: 40px 0 0 60px;
	width: 254px;
}

#innkeeper div.cola div {
	margin: 50px 0 0;
}

#innkeeper div.cola p {
	text-align: justify;
}

#the-inn div.cola p {
	padding-bottom: 24px;
	text-align: justify;
}

/* @policies */

#policies #content {
	background: url(../img/moss_bg.jpg) no-repeat right top;
}

div.policies {
	margin: 0 0 10px 10px;
	width: 500px;
}

div.policies p {
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: .75em;
}

.policies p span {
	color: #446C8F;
	font-weight: bold;
	padding-right: 6px;
}

/* @guestbook */

#guestbook #main-content {
	background: url(../img/shrimpboat_fade.jpg) no-repeat center bottom;
}

div.guestbook {
	color: #345C80;
	margin: 0 auto 160px;
	width: 700px;
}

div.guestbook p {
	padding: 0 0 .5em 0;
}

div.guestbook cite {
	display: block;
	margin-bottom: .5em;
}

/* @post-card */

div.form-box {
	background: #f8f8f8;
	border: 1px solid #e4e4e4;
	padding: 11px 6px;
	width: 460px;
}

.form-box div {
	padding: .2em .5em;
}

.form-box p {
	color: #666;
	font-family:Arial, Helvetica, sans-serif;
	font-size: .75em;
	font-weight: bold;
	padding: 0 1.25em 0 0;
	margin-top: 3px;
	width: 178px;
	
}

.form-box input, .form-box textarea {
	border: 1px solid #88a;
	color: #335;
	font-family: "Lucida Sans Unicode", "Lucida Grande", Arial, Helvetica, sans-serif;
	padding: 3px;
	width: 180px;
}

.form-box input[type='radio'] {
	border: none;
}

.form-box textarea {
	font-family: "Courier New", Courier, mono;
	font-size: .75em;
	height: 100px;
}

.form-box label {
	color: #666;
	font-size: .75em;
	font-style: italic;
	margin-right: 1em;
}

#postcard ul {
	clear: right;
	float: right;
	width: 474px;
}

#postcard li {
	margin: 20px 24px 0;
	width: 150px;
}

#postcard a, #postcard a:link, #postcard a:visited, #postcard a:active, #postcard a:hover {
	background: url(../img/hh_bullet.gif) no-repeat left top;
	display: block;
	height: 26px;
	letter-spacing: 1px;
	padding-left: 34px;
}

input.cc {
	font-size: .5em;
	width: 10px;
	margin: 6px;
}

#text-counter {
	clear: both;
	color: #333;
	font-family: Arial, Helvetica, sans-serif;
	margin-top: 10px;
	padding: 0;
}

#text-counter input {
	font-size: .5em;
	margin: 5px 4px 0 0;
	padding: 1px;
	text-align: center;
	width: 24px;
}

#text-counter p {
	font-size: .625em;
	margin-top: 6px;
}

#post-card #slideshow {
	margin-top: -34px;
	padding-left: 5px;
}

#post-card #slideshow noscript {
	display: block;
	padding-top: 50px;
	width: 350px;
}

#post-card #slideshow noscript p {
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: .625em;
	text-align: justify;
}

#post-card #slideshow noscript a {
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: underline;
}

/* @gift-basket */
#gift-basket div.cola {
	color: #3A5267;
	font-family: "Lucida Sans Unicode", "Lucida Grande", Arial, Helvetica, sans-serif;
	font-size: .75em;
	line-height: 1.5em;
	margin: 0;
	width: 460px;
}

#gift-basket #intro img.basket-pics {
	border: 1px solid #999;
	margin: 4px;
	padding: 4px
}

#gift-basket #main-content img {
}

#gift-basket div.cola h3 {
	border: none;
	font-size: 1.25em;
	margin: 12px 0 6px 0;
	text-align: left;
	text-decoration: underline;
	width: 100%;
}

#gift-basket div.cola ul li {
	list-style: disc;
	padding-left: 2px;
	margin-left: 18px;
}

#gift-basket div.cola ul span {
	display: block;
	font-weight: bold;
	margin: 6px 0;
}

/* ------------------------------------------------------
P.I.E. FLOAT CLEARING
http://www.positioniseverything.net/easyclearing.html 
------------------------------------------------------ */

.clearfix:after {
  content: ".";
  clear: both;
  height: 0;
  visibility: hidden;
  display: block;
}
.clearfix {
  display: inline-block; /* Fixes IE/Mac */
}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */