/* //////// hacks start //////////////////////////////////////////////////////////////// */

.clearfix:after {
    content: ".";
    display: block; 
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {display: inline-table;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

/* //////// hacks end //////////////////////////////////////////////////////////////// */


/* //////// universals start //////////////////////////////////////////////////////////////// */

STRONG {
	font-weight: bold;
}

EM {
	font-style: italic;
}

/*h6 is for "headings" within a page, for the Wick to use in Contribute. space separation from content above. */
H6 {
	font-weight: bold;
	font-size: 11px;
	text-transform:uppercase;
	padding-top: 10px;
}

IMG { border: none; }

A {
	color: #1A6000;
	text-decoration: none;
	font-weight: bold;
}
	
a:hover { 
	color: black;
	text-decoration: underline;
}

.clearBoth01 {
	clear: both;
}
.clearBoth02 {
	clear: both;
	margin-top: 20px;
}
/* used at least on homepage to separate footer from body */
.clearBoth03 {
	clear: both;
	margin-bottom: 30px;
}
.clearLeft01 {
	clear: left;
}
.clearRight01 {
	clear: right;
}

.floatleft { float: left; }
.floatright { float: right; }

/* this is revealed in print CSS */
.showForPrint {
	display: none;
}

/* //////// universals end //////////////////////////////////////////////////////////////// */


* {
	margin: 0px;
	padding: 0px;
	/* stylegala does this outline thing, use it if problems occur? 
	outline: none; */
}

body {
	text-align: center;
	background:#e4e4e4 url(../graphics/misc/bgContent02wide.gif) repeat-y top center;
}

#allContent {
	width: 960px;
	margin: 0px auto;
	padding-top: 20px;
	text-align: left;
	font-size: 11px;
	color: #22301D;
	line-height: 19px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

/* //////// share page starts //////////////////////////////////////////////////////////////// */

ul#social_media_icons {
	float:left;
	clear:both;
	padding-top:20px;
}

ul#social_media_icons li {
	list-style:none;
	display:inline;
	margin:0 37px 0 0;
}

ul#social_media_icons li #facebook_sm {
	background:url(../graphics/icons/facebook_16.png) no-repeat 0 0;
	padding:2px 0 10px 24px;
}

ul#social_media_icons li #twitter_sm {
	background:url(../graphics/icons/twitter_16.png) no-repeat 0 0;
	padding:2px 0 10px 24px;
}

ul#social_media_icons li #flickr_sm {
	background:url(../graphics/icons/flickr_16.png) no-repeat 0 0;
	padding:2px 0 10px 24px;
}

ul#social_media_icons li #youtube_sm {
	background:url(../graphics/icons/youtube_16.png) no-repeat 0 0;
	padding:2px 0 10px 24px;
}

/* //////// share page ends //////////////////////////////////////////////////////////////// */



/* //////// header starts //////////////////////////////////////////////////////////////// */

#header {
	background-image: url(../graphics/header/headerBGlight.jpg);
	background-repeat:no-repeat;
	position: relative;
}

#header P#topLogo {
	float: left;
}

#header P#topLogo A {
	margin-left: 49px;
	display: block;
	width: 206px;
	height: 88px;
	background: url(../graphics/header/logo01.jpg) no-repeat 0 0;
	text-decoration: none;
}

#header P#topLogo A SPAN {
	display: none;
}

#header P#topLogo A:hover {
	background-position: 0px -88px;
}


#header UL#topNav1 {
	position: absolute;
	right: 25px;
	top: 26px;
	width: 590px; /* insert width so that it doesn't span all way over top of logo, and break the logo hit area */
	/* border: 1px solid red; */
}

#header UL#topNav1 LI {
	/* text-indent: -9000px; 
	font-size: 1px; */
	display: inline;
	list-style: none;
	float: right;
}

#header UL#topNav1 A SPAN {
	display: none;
}

#header UL#topNav1 A {
	display: block;
	height: 13px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-decoration: none;
}

#header UL#topNav1 A:hover {
	background-position: 0px -13px;
}

#header A#topNav1-home {
	background-image: url(../graphics/header/topNavHome01.gif);
	width: 41px; }

#header A#topNav1-contact {
	background-image: url(../graphics/header/topNavContact01.gif);
	width: 63px; }

#header A#topNav1-events {
	background-image: url(../graphics/header/topNavEvents01.gif); 
	width: 57px; }

#header A#topNav1-gettinghere {
	background-image: url(../graphics/header/topNavGettinghere01.gif); 
	width: 85px; }

#header A#topNav1-share {
	background-image: url(../graphics/header/topNavShare01.gif); 
	width: 51px; }

#header A#topNav1-news { /* changed to "media" on 20090707 */
	background-image: url(../graphics/header/topNavNews01.gif);
	width: 49px; }

/* stopped being used, Aug1_2007 */
#header A#topNav1-sitemap {
	background-image: url(../graphics/header/topNavSitemap01.gif);
	width: 56px; }
	
#header A#topNav1-rates {
	background-image: url(../graphics/header/topNavRates01.gif);
	width: 46px; }

#header A#topNav1-giftcertificates {
	background-image: url(../graphics/header/topNavGiftCertificates01.gif);
	width: 98px;
	margin-left: 12px; }

#header A#topNav1-booknow {
	background-image: url(../graphics/header/topNavBooknow01.gif);
	width: 58px;
	margin-left: 11px; }
	
#header UL#topNav2 {
	position: absolute;
	right: 202px;
	top: 47px;
	/* insert width so that it doesn't span all way over top of logo, and break the logo hit area */
	width: 400px;
}

/* topNav2 is the 2 "explore" buttons */
#header UL#topNav2 LI {
	/* text-indent: -9000px; 
	font-size: 1px;  */
	display: inline;
	list-style: none;
	
}

#header UL#topNav2 A SPAN {
	display: none;
}

#header UL#topNav2 A {
	display: block;
	height: 30px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-decoration: none;
	float: right;
}

#header UL#topNav2 A:hover {
	background-position: 0px -30px;
}


#header A#topNav2-inn {
	background-image: url(../graphics/header/topNavInn01.gif);
	width: 138px; }

#header A#topNav2-destination {
	background-image: url(../graphics/header/topNavDestination01.gif);
	width: 196px;
	margin-left: 15px; }
	
	
	
/* //////// header ends //////////////////////////////////////////////////////////////// */



/* //////// photoEngine/presentations area begins //////////////////////////////////////////////////////////////// */


#photoEngine01 {
	margin-bottom: 0px;
}
#photoEngine01 P {
	margin-left: 4px;
	padding: 40px;
	background: url(../graphics/misc/flashDetectBG01.jpg) no-repeat 0 0;
	line-height: 25px;
	color: black;
	
	/* TANTEK HACK: For IE5/Win's benefit, height/wdith = [correct height/width] + [padding] */
	height:300px; /* 220px + 40px + 40px = 300px */
	voice-family: "\"}\"";
	voice-family:inherit;
	height:220px; /* the correct height */
}
/* use the "be nice to Opera 5" rule every time you use the Tantek Celik hack (above). */
body>#photoEngine01 P {
	height:220px;
}

/*flashPresentation01a is for the home presentations, 370px tall */
#flashPresentation01a {
	padding-bottom: 4px;
}
#flashPresentation01a P {
	margin-left: 4px;
	padding: 40px 210px 0px 420px;
	background: url(../graphics/homepage/homeFlashDetectBG01.jpg) no-repeat 0 0;
	line-height: 20px;
	color: black;
	
	/* TANTEK HACK: For IE5/Win's benefit, height/wdith = [correct height/width] + [padding] */
	height:370px; /* 330px + 40px = 370px */
	voice-family: "\"}\"";
	voice-family:inherit;
	height:330px; /* the correct height */
}
/* use the "be nice to Opera 5" rule every time you use the Tantek Celik hack (above). */
body>#flashPresentation01a P {
	height:330px;
}

/*flashPresentation01b is for the inn + destination presentations, 336px tall. As of May30 2006, it has the exact same properties as the photoEngine01 ID above */
#flashPresentation01b {
	margin-bottom: 0px;
}
#flashPresentation01b P {
	margin-left: 4px;
	padding: 40px;
	background: url(../graphics/misc/flashDetectBG01.jpg) no-repeat 0 0;
	line-height: 25px;
	color: black;
	
	/* TANTEK HACK: For IE5/Win's benefit, height/wdith = [correct height/width] + [padding] */
	height:300px; /* 220px + 40px + 40px = 300px */
	voice-family: "\"}\"";
	voice-family:inherit;
	height:220px; /* the correct height */
}
/* use the "be nice to Opera 5" rule every time you use the Tantek Celik hack (above). */
body>#flashPresentation01b P {
	height:220px;
}



/* //////// photoEngine/presentations area ends //////////////////////////////////////////////////////////////// */



/* //////// homepage content area begins //////////////////////////////////////////////////////////////// */

#homeContent {
	position: relative;
	/* border: 1px solid green; */
	/* paddin-left tucks the content of the homepageContent box in 4px on left, so line up with dropshadow compensation on nav bar */
	padding-left: 4px;
}

#homeContent DIV#homeCol1 {
	width: 270px;
	float: left;
	display: inline;
	/* border: 1px solid red; */
}

DIV#homeCol1 DIV#homeSpecial01 {
	background: url(../graphics/homepage/homepageSpecialBG01.gif) repeat-y 0 0;
	margin-top:4px;
	border: 1px solid #BEBEBE;
}
DIV#homeCol1 DIV#homeSpecial01 P#homeSpecialTitle01 {
	margin: 8px 0px 6px 10px;
}
DIV#homeCol1 DIV#homeSpecial01 UL#homeSpecialContent01 {
	color: #23455B;
	line-height: 15px;
	margin: 0px 10px 0px 10px;
	font-size: 10px;
}
DIV#homeCol1 DIV#homeSpecial01 UL#homeSpecialContent01 LI {
	list-style: none;
	/* background:url(../graphics/misc/bulletSimpleArrow02bold.gif) no-repeat 0px 6px; */
	padding: 0px 0px 10px 0px;
}
DIV#homeCol1 DIV#homeSpecial01 UL#homeSpecialContent01 A {
	font-size: 10px;
}
DIV#homeCol1 DIV#homeSpecial01 P#homeSpecialLink01 {
	margin: 0px 0px 8px 10px;
	font-size: 9px;
	text-transform: uppercase;
}


#homeContent DIV#homeCol2 {
	float: left;
	width: 485px;
	padding-left: 5px;
	display: inline;
	/* border: 1px solid yellow; */
}
DIV#homeCol2 DIV.homeCol2copy {
	padding: 5px 15px 0px 15px;
	line-height: 18px;
}
DIV#homeCol2 DIV.homeCol2copy P {
	padding-bottom: 5px;
}
DIV#homeCol2 H2#homeWelcome01, DIV#homeCol2 H2#homeWhatsnew01 {
	width: 485px;
	height: 52px;
}
DIV#homeCol2 H2#homeWelcome01 {
	background: url(../graphics/homepage/homepageWelcome02.jpg) no-repeat 0 0;
}
DIV#homeCol2 H2#homeWhatsnew01 {
	background: url(../graphics/homepage/homepageWhatsnew01.jpg) no-repeat 0 0;
	margin-top: 20px;
}
DIV#homeCol2 H2 SPAN {
	display: none;
}


#homeContent DIV#homeCol3 {
	float: left;
	width: 190px;
	line-height: 12px;
	font-size: 9px;
	/* border: solid 1px blue; */
}
DIV#homeCol3 P {
	text-align: center;
	padding: 10px 20px 0px 20px;
}

DIV#homeCol3 DIV#homeHilight01 { /* border: solid 1px blue; */ }
DIV#homeCol3 DIV#homeHilight01 P {
	padding: 0;
}

DIV#homeCol3 DIV#rcLogo { 
	padding-top: 15px;
	/* border: solid 1px red; */
}
DIV#homeCol3 DIV#rcLogo h3 A {
	height: 85px;
	width: 87px;
	margin-left: 51px; /* this aproximately centers the r+c logo, as this column is 190px wide */
	text-decoration: none;
	display: block;
	background: url(../graphics/homepage/rcLogo01.gif) no-repeat 0 0;
}
DIV#homeCol3 DIV#rcLogo h3 A:hover {
	background-position: 0px -85px;
}
DIV#homeCol3 DIV#rcLogo h3 A SPAN {
	display: none;
}

DIV#homeCol3 DIV#homeLexus {
	margin-top: 40px;
	/* border: solid 1px red; */
}
DIV#homeCol3 DIV#homeLexus h3 A {
	margin-bottom: 5px;
	height: 33px;
	width: 125px;
	margin-left: 33px; /* this aproximately centers the r+c logo, as this column is 190px wide */
	text-decoration: none;
	display: block;
	background: url(../graphics/homepage/homepageLexus01.gif) no-repeat 0 0;
}
DIV#homeCol3 DIV#homeLexus h3 A:hover {
	background-position: 0px -33px;
}
DIV#homeCol3 DIV#homeLexus h3 A SPAN {
	display: none;
}

#socialMediaNav {
	margin-top:20px;
}
#socialMediaNav li {
	list-style: none;
	padding:2px 0 4px 25px;
}
#socialMediaNav li#iconFacebook {
	background:url(../graphics/icons/facebook_16.png) no-repeat 0 3px;
}
#socialMediaNav li#iconTwitter {
	background:url(../graphics/icons/twitter_16.png) no-repeat 0 3px;
}
#socialMediaNav li#iconFlickr {
	background:url(../graphics/icons/flickr_16.png) no-repeat 0 3px;
}
#socialMediaNav li#iconYoutube {
	background:url(../graphics/icons/youtube_16.png) no-repeat 0 3px;
}
#socialMediaNav li#iconNewsletter {
	background:url(../graphics/icons/iconRC.gif) no-repeat -3px 3px;
}





/* //////// homepage content area begins //////////////////////////////////////////////////////////////// */




/* //////// layout areas begins //////////////////////////////////////////////////////////////// */


/* 5050 01 is a 2 equal column layout, with not much room between columns: 20px. the float is the right side, so it comes first in the html */
.content5050Right01 {
	float: right;
	width: 380px;
	margin-top: 0px;
	/* border: 1px solid aqua; */
}
.content5050Left01 {
	margin-right: 405px;
	/*padding-left is to line things up photos above, footer below, taking into account 4 px of dropshadow around stuff above +more if want*/
	padding-left: 4px;
	/* border: 1px solid green; */
}
/* 5050left02 is same as 5050Left01, but without the padding-left. this is for content that needs to start flush with the drop shadow of the header bar, like the menus, which have the same drop shadow. used at least on MENU pages. */
.content5050Left02 {
	margin-right: 405px;
	/*border: 1px solid green;*/
}

/* 5050 03 is a 2 equal column layout, with not much room between columns. the float is the right side, so it comes first in the html. designed for the SITEMAP page, at least. also used: NEWSLETTER, EVENTS CALENDAR */
.content5050Right03 {
	float: right;
	width: 435px;
	margin-top: 0px;
	/* border: 1px solid aqua; */
}
.content5050Left03 {
	margin-right: 445px;
	/*padding-left is to line things up photos above, footer below, taking into account 4 px of dropshadow around stuff above +more if want*/
	padding-left: 4px;
	/* border: 1px solid green; */
}


/* 7525 01 is a 2 column layout, to be used at least on the PRESS GALLERY page, lower part of the GETTING HERE page, PROMOTIONS+PACKAGES pages, CONTEST page, EVENTS CALENDAR. the float is the right side, so it comes first in the html */
/* the right side holds the hilight engine, which is 190px wide. i've given it 195px to be safe */
#content7525Right01 {
	float: right;
	width: 195px;
	margin-top: 0px;
	/* border: 1px solid aqua; */
}
.content7525Left01 {
	margin-right: 200px;
	/*padding-left is to line things up photos above, footer below, taking into account 4 px of dropshadow around stuff above +more if want*/
	padding-left: 4px;
	/*border: 1px solid green; */
}


/* 204020 is a 3 column layout, floats have to come 1st in html. used on at least the bottom portion of CONTACT page, EVENTS CALENDAR page. */
.content204020Left01 {
	float: left;
	width: 220px;
	/* border: 1px solid green; */
	margin-left: 4px;
	display: inline;
}
.content204020Middle01 {
	/* previously had this at 492, but changed to 496 so would line up with subnav wood above. Does this mess things up? checked in IE and no, so leaving: */
	width: 496px;
	/* border: 1px solid green; */
	margin-left: 38px;
	float: left;
	display: inline;
}
.content204020Right01 {
	/* border: 1px solid green; */
	margin-left: 760px;
}

/* 333333 is a 3 column layout, floats have to come 1st in html. used at least on top part of Flickr Gallery page */
.content333333Left01 {
	float: left;
	width: 240px;
	/* border: 1px solid green; */
	margin-left: 4px;
	display: inline;
}
.content333333Middle01 {
	width: 335px;
	/* border: 1px solid green; */
	margin-left: 20px;
	float: left;
	display: inline;
}
.content333333Right01 {
	/* border: 1px solid green;  */
	margin-left: 620px;
	margin-right: 4px;
}


/* subNavHilight 01 is a 2 column layout, designed to fit within the right column of 5050 01, used to hold the subnav and hilight flash */
.subNavHilightLeft01 {
	float: left;
	width: 182px;
	margin-top: 5px;
	/*border: 1px solid blue;*/
}
#subNavHilightRight01 {
	/* this margin-left should be 190px, leaving 380-190=190px for the flash area to sit, but for some reason its not quite enough for in IE (it places it below the subnav), and so I've given it a few more pixels. */
	margin-left: 182px;
	margin-top: 5px;
	/* border: 1px solid green; */
}

/* subContentHilight 01 is a 2 column layout, designed to fit within the right column of 5050 03, used to hold a column of content and hilight flash. used at least on SITEMAP page, NEWSLETTER page (for the article links). */
.subContentHilightLeft01 {
	float: left;
	width: 235px;
	/* border: 1px solid blue; */
}
#subContentHilightRight01 {
	/* this margin-left should be 190px, leaving 380-190=190px for the flash area to sit, but for some reason its not quite enough for in IE (it places it below the subnav), and so I've given it a few more pixels. */
	margin-left: 240px;
	/* border: 1px solid pink; */
}

/* subContent 01 is a 2 column layout, designed to fit within the left column of 5050 01, used to hold content text, ON MOST OF THE INN, DESTINATION PAGES */
.subContentLeft01 {
	float: left;
	width: 265px;
	/*border: 1px solid blue;*/
}
.subContentRight01 {
	margin-left: 285px;
	/*border: 1px solid red;*/
}

/* subContent 02 is a 2 column layout, designed to fit within the left column of 5050 01, used to hold content text + subtitle graphics, on at least the CONTACT page. */
.subContentLeft02 {
	float: left;
	width: 245px;
	/*border: 1px solid blue; */
}
.subContentRight02 {
	margin-left: 260px;
	/*border: 1px solid red; */
}

/* subContent 03 is a 2 column layout, designed to fit within the left column of 5050 03, on at least the SITEMAP page. */
.subContentLeft03 {
	float: left;
	width: 245px;
	/* border: 1px solid blue; */
}
.subContentRight03 {
	margin-left: 260px;
	/* border: 1px solid red; */
}

/* subContent 04 is a 2 column layout, designed to fit within the left column of 7525 01, used to hold content text, ON AT LEAST THE PRESS GALLERY PAGE. the 2 columns are wider than the usual columns, because they fill a full 760px width area. they are roughly 360px width each, with 30px in between */
.subContentLeft04 {
	float: left;
	width: 360px;
	/*border: 1px solid blue; */
}
.subContentRight04 {
	margin-left: 390px;
	/*border: 1px solid red; */
}

/* subContent 05 is a 2 column layout, designed to fit within the left column of 7525 01, used to hold content text, ON AT LEAST THE EVENTS CALENDAR PAGE, CONTEST (UNIQUE LIVES) PAGE, .  */
.subContentLeft05 {
	float: left;
	width: 220px;
	/*border: 1px solid blue; */
}
.subContentRight05 {
	margin-left: 260px;
	/*border: 1px solid red; */
}

/* subContentMenu01 is a 1 column layout, desined to present food menus, on the MENU pages. */
.subContentMenu01Header {
	background:url(../graphics/misc/menuHeaderBG01.gif) no-repeat 0px 0px;
	height: 14px;
}
.subContentMenu01Body {
	background:url(../graphics/misc/menuBodyBG01.gif) no-repeat left bottom;
	padding: 0px 14px 14px 14px;
}
.subContentMenu01BodyInside {
	padding: 20px;
	background-color: #F9F8F0;
	border: 1px solid #DED688;
}





/* //////// layout areas ends //////////////////////////////////////////////////////////////// */



/* //////// subnav area begins //////////////////////////////////////////////////////////////// */

.subNavHilightLeft01 H3.subNavTitleInn A {
	background-image:url(../graphics/misc/subNavTitleInn01.jpg);
}
.subNavHilightLeft01 H3.subNavTitleDestination A {
	background-image:url(../graphics/misc/subNavTitleDestination01.jpg);
}
.subNavHilightLeft01 H3.subNavTitleContact A {
	background-image:url(../graphics/misc/subNavTitleContact01.jpg);
}
.subNavHilightLeft01 H3.subNavTitleNews A {
	background-image:url(../graphics/misc/subNavTitleNews01.jpg);
}
.subNavHilightLeft01 H3.subNavTitlePromotions A {
	background-image:url(../graphics/misc/subNavTitlePromotions01.jpg);
}
.subNavHilightLeft01 H3.subNavTitleShare A {
	background-image:url(../graphics/misc/subNavTitleShare01.jpg);
}

.subNavHilightLeft01 H3 A {
	display: block;
	width: 182px;
	height: 43px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-decoration: none;
}

.subNavHilightLeft01 H3 A SPAN {
	display: none;
}

.subNavHilightLeft01 H3 A:hover {
	background-position: 0px -43px;
}

.subNavHilightLeft01 UL {
	margin-left: 4px;
}

.subNavHilightLeft01 UL LI {
	list-style: none;
	line-height: 21px;
	padding-bottom: 1px;
}

.subNavHilightLeft01 UL LI A {
	display: block;
	height: 21px;
	font-size: 9px;
	font-weight: bold;
	color: #2D2D2D;
	text-decoration: none;
	padding-left: 8px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	background: url(../graphics/misc/subNavBG01.gif) no-repeat 0px 0px;
}

.subNavHilightLeft01 UL LI A:hover {
	background-position: 0px -21px;
	padding-left: 12px;
	color: black;
	text-decoration: none;
}

/* //////// subnav area ends //////////////////////////////////////////////////////////////// */




/* //////// headings start //////////////////////////////////////////////////////////////// */

/*subtitle01 has more white space around it, than 2 */

/* H1s used to be only used for header logo, but in Jan 2010, we change the logo to a P tag, to be able to use H1s in the body, as per 6s's recommendations. That is why there aren't many H1 tags in the site, as of 2010. */
H1 {
	font-size: 13px;
}
/* H2s used in the copy is a recent inclusion to the site, as per 6s's Jan 2010 recommendations */
H2 {
	font-size: 12px;
}
/* H3s used in the copy is a recent inclusion to the site, as per 6s's Jan 2010 recommendations */
H3 {
	font-size: 11px;
}

H2.subtitle01 {
	padding-bottom: 5px;
	padding-top: 8px;
}
H2.subtitle01 SPAN {
	display: none;
}

/*subtitle02 has less whitespace around it, than 1, and is intended to be used in a tertiary nav box */
H2.subtitle02 {
	padding-bottom: 3px;
}
H2.subtitle02 SPAN {
	display: none;
}

/*subtitle03 was designed for the small subtitles on the PROMOTIONS page, CONTACT US page. used at least there. */
H3.subtitle03 {
	padding-bottom: 5px;
	padding-top: 8px;
}
H3.subtitle03 SPAN {
	display: none;
}


/* subtitleBar01 is used to hold the title, and maybe extra elements, on unique pages, like the SITEMAP, GETTING HERE, where title stands alone on separate line, on dark background, (not surrounded by tertiatry nav, or whatever). THE TITLE IS RIGHT JUSTIFIED, AND THE BG BAR SPANS APROX 756px. buttons (print this, back) can exist on left side. */
.subtitleBar01 {
	clear: both;
	background: url(../graphics/misc/subtitleBarBG02.gif) repeat-y 0px 0px;
	height: 42px;
	margin: 20px 200px 20px 4px;
}
.subtitleBar01 H2 {
	float: right;
	margin-top: 6px;
}
.subtitleBar01 H2 SPAN {
	display: none;
}
/* the P holds other elements, like a "download this pdf" link and icon, on the left side */
.subtitleBar01 P {
	padding: 14px 0px 0px 5px;
}

/* subtitleBar02 is used to hold the title, and maybe extra elements, on unique pages, like NEWS, ARTICLES, PRESS RELEASES, where title stands alone on separate line (not surrounded by tertiatry nav, or whatever). THE TITLE IS LEFT JUSTIFIED, AND THE BG BAR SPANS APROX 960px (full width) */
.subtitleBar02 {
	clear: both;
	background: url(../graphics/misc/subtitleBarBG02.gif) repeat-y 0px 0px;
	height: 42px;
	margin: 20px 0px 15px 4px;
}
/*subtitle03 is for subtitles that are right-justified, like on SITEMAP page */
.subtitleBar02 H2 {
	padding-top: 6px;
}
.subtitleBar02 H2 SPAN {
	display: none;
}
/* the P holds other elements, like a "download this pdf" link and icon */
.subtitleBar02 P {
	padding: 14px 0px 0px 5px;
	/* FLOAT RIGHT ?????? DO I EVEN USE THIS???? */
}

/* subtitleBar03 is used to hold the title, and maybe extra elements, on unique pages, like the NEWS TEXT PAGES where title stands alone on separate line (not surrounded by tertiatry nav, or whatever). THE TITLE IS RIGHT JUSTIFIED, AND THE BG BAR SPANS APROX 960px (full width), buttons (print this, back) can exist on left side. */
.subtitleBar03 {
	clear: both;
	background: url(../graphics/misc/subtitleBarBG02.gif) repeat-y 0px 0px;
	height: 42px;
	margin: 20px 0px 15px 4px;
}
/*subtitle03 is for subtitles that are right-justified, like on SITEMAP page */
.subtitleBar03 H2 {
	margin-top: 6px;
	margin-right: 194px;
	float: right;
	display: inline;
}
.subtitleBar03 H2 SPAN {
	display: none;
}
/* the P holds other elements, like a "download this pdf" link and icon */
.subtitleBar03 P {
	padding: 14px 0px 0px 10px;
}


/* //////// headings end //////////////////////////////////////////////////////////////// */





/* //////// tertiary nav area begins //////////////////////////////////////////////////////////////// */


DIV.tertiaryNav02 {
	line-height: 12px;
	margin-top: 9px;
	margin-bottom: 15px;
	background: url(../graphics/misc/tertiaryNavBG01.gif) 0px 0px repeat-y;
	padding: 2px 0px 5px 8px;
}

UL.tertiaryNavList02 {
	font-size: 9px;
	margin-bottom: 4px;
	font-weight: bold;
	color:#444444;
}

UL.tertiaryNavList02 LI {
	display: inline;
	list-style: none;
	padding-right: 12px;
}

UL.tertiaryNavList02 LI A {
	font-size: 9px;
	font-weight: bold;
	background:url(../graphics/misc/bulletSimpleArrow01.gif) no-repeat 0px 4px;
	padding-left: 7px;
}

/* used for at least the anchor nav boxes on PACKAGES, TREATMENTS pages. it's an ID so can also use clearfix on it */
#anchorNav01 {
	background: url(../graphics/misc/tertiaryNavBG01.gif) 0px 0px repeat-y;
	margin-top: 0px;
	margin-bottom: 20px;
	line-height: 17px;
}
#anchorNav01 UL {
	padding: 10px 10px 10px 10px;
	font-weight: bold;
	color:#444444;
}
#anchorNav01 UL LI {
	list-style: none;
	padding-right: 12px;
	background:url(../graphics/misc/bulletSimpleArrow01.gif) no-repeat 0px 7px;
	padding-left: 7px;
}
#anchorNav01 UL LI A {
	font-size: 9px;
	font-weight: bold;
}
/*nested lists */
#anchorNav01 UL UL {
	padding: 4px 0px 10px 0px;
	line-height: 11px;
}
#anchorNav01 UL UL LI {
	list-style: none;
	background:url(../graphics/misc/bulletDropArrow01.gif) no-repeat 10px 3px;
	padding: 0px 0px 5px 20px;
}

/*used on the NEWSLETTER's article navigation */
#newsletterNav01 {
	line-height: 14px;
	background: url(../graphics/misc/newsletterArticleNavBG01.gif) top right repeat-y;
	padding: 12px 8px 5px 10px;
	color: #22301D;
	font-size: 11px;
}
#newsletterNav01 P {
	margin-bottom: 5px;
}
#newsletterNav01 SPAN.newsletterDate {
	font-style: italic;
	font-size: 12px;
}
#newsletterNav01 UL {
	font-size: 11px;
	line-height: 14px;
	margin-top: 10px;
}
#newsletterNav01 UL LI {
	list-style: none;
	background:url(../graphics/misc/bulletSimpleArrow02bold.gif) no-repeat 1px 4px;
	padding: 0px 0px 10px 10px;
}


/* //////// tertiary nav area ends //////////////////////////////////////////////////////////////// */





/* //////// content area begins //////////////////////////////////////////////////////////////// */


/* textStyle01 is the workhorse, the main text style used throughout the site */
.textStyle01 {
	color: #22301D;
	font-size: 11px;
	line-height: 19px;
}
.textStyle01 P {
	/* used padding and not margin because margin adds a duplicate amount of space on bottom of content5050Left01 if content5050Left01 has no borders! */
	padding-bottom: 10px;
}
.textStyle01 UL {
	padding-bottom: 10px;
	line-height: 16px;
	margin-left: 15px;
}
.textStyle01 UL LI {
	list-style: none;
	background:url(../graphics/misc/bulletSimpleArrow02bold.gif) no-repeat 10px 6px;
	padding: 0px 0px 6px 20px;
}
/*nested lists */
.textStyle01 UL UL {
	padding: 5px 0px 0px 0px;
}
.textStyle01 UL UL LI {
	list-style: none;
	background:url(../graphics/misc/bulletSimpleArrow01.gif) no-repeat 10px 6px;
	padding: 0px 0px 6px 20px;
}
.textStyle01 OL {
	padding-bottom: 10px;
	/* line-height: 16px; */
	margin-left: 20px;
}
.textStyle01 UL LI {
	padding: 0px 0px 6px 20px;
}

/* textStyle02 is for the info section on contact page */
.textStyle02contact {
	color: #22301D;
	font-size: 11px;
	line-height: 18px;
}
.textStyle02contact P {
	/* used padding and not margin because margin adds a duplicate amount of space on bottom of content5050Left01 if content5050Left01 has no borders! */
	padding-bottom: 15px;
}

/* textStyle03newstext is for articles and press releases, at least*/
.textStyle03newstext {
	color: #22301D;
	font-size: 11px;
	line-height: 20px;
	padding-top: 8px;
}
.textStyle03newstext H4 {
	font-weight: bold;
	font-size: 12px;
	text-transform:uppercase;
}
.textStyle03newstext IMG {
	float: right;
	padding: 4px;
	border: 1px solid #999999;
	margin: 0px 0px 10px 10px;
	background-color: #ffffff;
}
.textStyle03newstext P {
	padding-bottom: 20px;
}
.textStyle03newstext UL {
	padding-bottom: 20px;
	line-height: 16px;
}
.textStyle03newstext UL LI {
	list-style: none;
	background:url(../graphics/misc/bulletSimpleArrow02bold.gif) no-repeat 10px 6px;
	padding: 0px 0px 8px 20px;
}
/* !!! WE HAVE NO NESTED LIST STYLES !!! */
.textStyle03newstext TABLE {
	width: 100%;
	line-height: 16px;
	margin-bottom: 20px;
}
.textStyle03newstext TABLE TD {
	border-bottom: 1px solid #999999;
	padding: 5px;
	
}
.textStyle03newstext TABLE P {
	padding: 0px;
}

/* textStyle04rates is for RATEs pages (room, spa, package?) */
.textStyle04rates {
	
}
.textStyle04rates TABLE {
	color: #22301D;
	font-size: 11px;
	line-height: 16px;
	width: 99%; /* fixes a render bug in IE6 where the tables can't clear the boxes in the right hand column (map, points of dif, comments) and appear farther down the page */
	border-right: 1px solid #829DAF;
	border-left: 1px solid #829DAF;
	border-bottom: 1px solid #829DAF;
	margin-bottom: 40px;
}
.textStyle04rates TABLE CAPTION {
	background-color: #A7B8C3;
	padding: 6px 3px 6px 6px;
	color: #1E3F54;
	text-align: left;
	border: 1px solid #829DAF;
}
/* put this in wickUserCSS.css as well, so they can turn it on and off */
.textStyle04rates TABLE CAPTION span.red {
	color: #C12D00;
}
.textStyle04rates TABLE TH {
	background-color: #D6DDE1;
	padding: 8px 3px 8px 6px;
	font-weight: bold;
	border-bottom: 1px solid #829DAF;
	border-top: 1px solid #cccccc;
	
}
.textStyle04rates TABLE TD {
	border-top: 1px solid #cccccc;
	padding: 4px 3px 4px 6px;
}
.textStyle04rates TABLE COLGROUP.accommodationsRatesColumn2and3 {
	width: 130px;
}
.textStyle04rates TABLE COLGROUP.spaRatesColumn1 {
	width: 370px;
}

/* textStyle05menu is for MENUS pages (breakfast, lunch, dinner, bar) */
.textStyle05menu {
	text-align: center;
	color: #2D2C20;
	font-size: 11px;
	line-height: 16px;
}
.textStyle05menu H4 {
	margin-bottom: 30px;
}
.textStyle05menu H4 SPAN {
	display: none;
}
.textStyle05menu H5 {
	line-height: 19px;
	font-size: 11px;
	font-weight: bold;
	border-top: 1px solid #ADAB8F;
	border-bottom: 1px solid #ADAB8F;
	text-transform: uppercase;
	margin-bottom: 23px;
}
.textStyle05menu UL {
	padding-bottom: 25px;
	list-style: none;
}
.textStyle05menu UL LI {
	margin-bottom: 20px;
	list-style: none;
}
.textStyle05menu DIV.menuClosingComments {
	border-top: 1px solid #ADAB8F;
	padding-top: 10px;
	text-align: left;
	line-height: 18px;
}
.textStyle05menu DIV.menuClosingComments  P {
	padding-bottom: 10px;
}

/* newsletterText01 is used on at least the NEWSLETTER page, floats and adds borders around the images, and styles the text */
.textStyle06newsletter {
	color: #22301D;
	font-size: 11px;
	line-height: 18px;
	background: url(../graphics/misc/separator01.gif) no-repeat top left;
	padding: 25px 20px 15px 0px;
	/*border: 1px solid red;*/
	clear: left;
}
.textStyle06newsletter H4 {
	font-size: 12px;
	font-weight: bold;
	margin-bottom: 10px;
}
.textStyle06newsletter P {
	padding: 0px 0px 10px 0px;
}
.textStyle06newsletter IMG {
	float: right;
	margin: 0px 0 15px 15px;
	/*padding: 2px;
	border: 1px solid #999;
	background-color: #fff;*/
}
.textStyle06newsletter IMG, .textStyle06newsletter img.newsPhoto {
	float: right;
	margin: 0px 0 15px 15px;
	background:#fff;
	border: solid 1px #ccc;
	padding:3px;
}
.textStyle06newsletter UL {
	padding-bottom: 10px;
	line-height: 16px;
}
.textStyle06newsletter UL LI {
	list-style: none;
	background:url(../graphics/misc/bulletSimpleArrow02bold.gif) no-repeat 0px 6px;
	padding: 0px 0px 6px 10px;
}
.textStyle06newsletter UL.newsletterList li, UL.newsletterList li {
	padding:0 0 14px 22px !important;
	background: url("../graphics/newsletter/bullet_leaf.gif") no-repeat 0 2px !important;
}
.textStyle06newsletter p.signature {
	clear:both;
}
/*nested lists */
.textStyle06newsletter UL UL {
	padding: 5px 0px 0px 0px;
}
.textStyle06newsletter UL UL LI {
	list-style: none;
	background:url(../graphics/misc/bulletSimpleArrow01.gif) no-repeat 10px 6px;
	padding: 0px 0px 6px 20px;
}
.textStyle06newsletter P.backtotop {
	text-align: right;
}
.textStyle06newsletter P.backtotop A {
	font-size: 9px;
	background: url(../graphics/icons/iconBackToTop01.gif) no-repeat right 1px;
	padding: 0px 10px 0px 0px;
}

p.articlePhoto, img.articlePhoto {
	padding: 2px;
	border:1px solid #999;
	margin:0 0 15px 12px;
	float:right;
	background-color:#fff;
}


/* textStyle07gettingHere is for the getting here map page. the map area itself uses another class, below, called "gettingHereRight"  */
.textStyle07gettingHere {
	margin-top: 33px;
	color: #22301D;
	font-size: 11px;
	line-height: 17px;
}
.textStyle07gettingHere P {
	/* used padding and not margin because margin adds a duplicate amount of space on bottom of content5050Left01 if content5050Left01 has no borders! */
	padding-bottom: 8px;
}
.textStyle07gettingHere UL {
	padding-bottom: 10px;
	line-height: 13px;
	margin-left: 0px;
}
.textStyle07gettingHere UL LI {
	list-style: none;
	background:url(../graphics/misc/bulletSimpleArrow01.gif) no-repeat 0px 5px;
	padding: 0px 0px 4px 10px;
}
.textStyle07gettingHere UL A {
	font-size: 9px;
}

/* textStyle08eventsCal is applied to DIVs on the events calendar pagee.  */
DIV.textStyle08eventsCal {
	margin-bottom: 20px;
}
/* for current and next year */
.textStyle08eventsCal H3 {
	font-size: 15px;
	color: #444444;
}
.textStyle08eventsCal P {
	/* used padding and not margin because margin adds a duplicate amount of space on bottom of content5050Left01 if content5050Left01 has no borders! */
	padding-bottom: 10px;
}
.textStyle08eventsCal UL {
	padding-bottom: 10px;
	line-height: 16px;
	margin-left: 15px;
}
.textStyle08eventsCal UL LI {
	list-style: none;
	background:url(../graphics/misc/bulletSimpleArrow02bold.gif) no-repeat 10px 6px;
	padding: 0px 0px 6px 20px;
}
/*nested lists */
.textStyle08eventsCal UL UL {
	padding: 5px 0px 0px 0px;
}
.textStyle08eventsCal UL UL LI {
	list-style: none;
	background:url(../graphics/misc/bulletSimpleArrow01.gif) no-repeat 10px 6px;
	padding: 0px 0px 6px 20px;
}


/* gettingHereRight holds the map and subtitles on the GETTING HERE page, at least */
DIV.gettingHereRight H3 {
	height: 22px;
	margin-top: 10px;
}
DIV.gettingHereRight SPAN {
	display: none;
}
DIV.gettingHereRight H3#gettingHereSubtitleInternational {
	background: url(../graphics/subtitles/gettingHereSubtitleInternational.gif) no-repeat right 0;
}
DIV.gettingHereRight H3#gettingHereSubtitlePacificNW {
	background: url(../graphics/subtitles/gettingHereSubtitlePacificNW.gif) no-repeat right 0;
}
DIV.gettingHereRight H3#gettingHereSubtitlePacificRim {
	background: url(../graphics/subtitles/gettingHereSubtitlePacificRim.gif) no-repeat right 0;
}
DIV.gettingHereRight H3#gettingHereSubtitleWick {
	background: url(../graphics/subtitles/gettingHereSubtitleWick.gif) no-repeat right 0;
}
DIV.gettingHereRight P.gettingHereMap {
	padding: 3px;
	border: 1px solid #999999;
	background-color: #ffffff;
	margin-top: 5px;
}

/* newsSummary01 is for the summaries of articles, press releases on at least the NEWS page */
.newsSummary01 {
	color: #22301D;
	font-size: 11px;
	line-height: 18px;
}
.newsSummary01 P {
	padding: 6px 0px 15px 0px;
}
.newsSummary01 A {
	line-height: 14px;
	padding: 8px 0px 7px 0px;
	display: block;
}
.newsSummary01 SPAN.newsDate {
	background: url(../graphics/icons/iconArticle01.gif) no-repeat 0px 1px;
	padding: 9px 0px 0px 20px;
	font-style: italic;
}
.newsSummary01 H3 {
	height: 22px;
	margin:17px 0px 12px 0px;
}
.newsSummary01 H3#newsSubtitleArticle {
	background: url(../graphics/subtitles/newsSubtitleArticle.gif) no-repeat 0 0;
}
.newsSummary01 H3#newsSubtitlePress {
	background: url(../graphics/subtitles/newsSubtitlePress.gif) no-repeat 0 0;
}
.newsSummary01 H3#newsSubtitleRecognition {
	background: url(../graphics/subtitles/newsSubtitleRecognition.gif) no-repeat 0 0;
}
.newsSummary01 H3#newsSubtitleNewsletter {
	background: url(../graphics/subtitles/newsSubtitleNewsletter.gif) no-repeat 0 0;
}
.newsSummary01 H3 SPAN {
	display: none;
}
/* these last two IDs are quick additions for the News page, Media Inquiries section */
H3#newsSubtitleMediaInquiries {
	height: 22px;
	margin:17px 0px 12px 0px;
	background: url(../graphics/subtitles/newsSubtitleMediaInquiries.gif) no-repeat 0 0;
}
H3#newsSubtitleMediaInquiries SPAN {
	display: none;
}

/* newsSummary02 is for the summaries of articles, press releases on at least the ARTICLES and PRESS RELEASES page */
.newsSummary02 {
	color: #22301D;
	font-size: 11px;
	line-height: 18px;
}
.newsSummary02 P {
	padding: 24px 0px 22px 0px;
	background: url(../graphics/misc/separator01.gif) no-repeat bottom left;
}
.newsSummary02 IMG {
	float: left;
	padding: 18px 5px 0px 0px;
}

/* linksList01 is for the 2 columns of links on the RECIPROCAL LINKS page */
.linksList01 {
	line-height: 18px;
}
.linksList01 P {
	padding: 24px 5px 22px 0px;
}
.linksList01 IMG {
	float: left;
	padding: 18px 5px 0px 0px;
}

/* testimonial01 is for TESTIMONIALS / TIPS page */
DIV.testimonial01 {
	line-height: 18px;
	background: url(../graphics/misc/separator01.gif) no-repeat top left;
	padding: 20px 0px 10px 0px;
}
DIV.testimonial01 H4 {
	color: #23455B;
	font-weight: bold;
	font-size: 16px;
}
DIV.testimonial01 DIV.testimonial01quote P {
	font-size: 11px;
	line-height: 19px;
	padding: 10px 0px 0px 0px;
}
DIV.testimonial01 P.testimonial01Info {
	color: #666666;
	font-size: 9px;
	line-height: 12px;
	padding: 5px 0px 10px 0px;
	text-align: right;
}

/* shareLatest01 is for the "latest" tips, "latest" comments areas on the main Share launch page */
DIV.shareLatest01 {
	padding-bottom: 15px;
}
DIV.shareLatest01 H3 {
	padding-bottom: 15px; /* this overrides the more universal padding-bottom: 8px; used on all H3.subtitle03 */
}

DIV.shareLatest01 P.shareLatest01Info {
	color: #666666;
	font-size: 9px;
	line-height: 12px;
	padding: 5px 0px 15px 0px;
	text-align: right;
}
DIV.shareLatest01 DIV.shareLatest01comment {
	padding: 0 35px 0 35px;
}


/* separatorText01 is used on at least the RECOGNITION page, TREATMENTS, PROMOTIONS, floats and adds borders around the images, and styles the text */
DIV.separatorText01 {
	color: #22301D;
	font-size: 11px;
	line-height: 18px;
	background: url(../graphics/misc/separator01.gif) no-repeat 0px 0px;
	padding: 25px 0px 15px 0px;
	clear: left;
}
DIV.separatorText01 H4 {
	font-size: 9px;
	text-transform: uppercase;
	padding-bottom: 10px;
}
DIV.separatorText01 H5 {
	font-size: 13px;
	padding: 10px 0px 3px 0px;
}
DIV.separatorText01 P {
	padding: 0px 0px 10px 0px;
}
DIV.separatorText01 P.separatorTextTransImageRight01 IMG {
	float: right;	
	margin: 15px 0px 20px 20px;
	display: inline;
}
DIV.separatorText01 P.separatorTextImageLeft01 {
	padding: 0px;
}
DIV.separatorText01 P.separatorTextImageLeft01 IMG {
	float: left;	
	margin: 0px 15px 0px 0px;
	padding: 4px;
	border: 1px solid #999999;
	background-color: #ffffff;
	display: inline;
}
DIV.separatorText01 UL {
	padding-bottom: 10px;
	line-height: 16px;
}
DIV.separatorText01 UL LI {
	list-style: none;
	background:url(../graphics/misc/bulletSimpleArrow02bold.gif) no-repeat 0px 6px;
	padding: 0px 0px 6px 10px;
}
/*nested lists */
DIV.separatorText01 UL UL {
	padding: 5px 0px 0px 0px;
}
DIV.separatorText01 UL UL LI {
	list-style: none;
	background:url(../graphics/misc/bulletSimpleArrow01.gif) no-repeat 10px 6px;
	padding: 0px 0px 6px 20px;
}
DIV.separatorText01 P.backtotop {
	text-align: right;
}
DIV.separatorText01 P.backtotop A {
	font-size: 9px;
	background: url(../graphics/icons/iconBackToTop01.gif) no-repeat right 1px;
	padding: 0px 10px 0px 0px;
}


/* pressGallery01 is wrapped around all divs and content in the main area of the PRESSGALLERY page, at least. it styles the text and the thumbnails. */
.pressGallery01 {
	color: #22301D;
	font-size: 11px;
	line-height: 19px;
}
.pressGallery01 P {
	/* used padding and not margin because margin adds a duplicate amount of space on bottom of content5050Left01 if content5050Left01 has no borders! */
	padding-bottom: 10px;
}
.pressGallery01 UL {
	padding-bottom: 10px;
	line-height: 16px;
	margin-left: 15px;
}
.pressGallery01 UL LI {
	list-style: none;
	background:url(../graphics/misc/bulletSimpleArrow02bold.gif) no-repeat 10px 6px;
	padding: 0px 0px 6px 20px;
}
/*nested lists */
.pressGallery01 UL UL {
	padding: 5px 0px 0px 0px;
}
.pressGallery01 UL UL LI {
	list-style: none;
	background:url(../graphics/misc/bulletSimpleArrow01.gif) no-repeat 10px 6px;
	padding: 0px 0px 6px 20px;
}

.pressGallery01 IMG {
	padding: 3px;
	border: 1px solid #999999;
	margin: 0px 4px 4px 0px;
	background-color: #ffffff;
}

.pressGallery01 TABLE {
	
}
.pressGallery01 TABLE TD {
	width: 150px;
	line-height: 14px;
	font-size: 9px;
}
.pressGallery01 TABLE TD P {
	width: 136px;
	padding-bottom: 15px;
}


/* flickrGallery is wrapped around the Flickr Gallery on the Your Photos & Videos page */

#flickrGallery01 {
	/* border: 1px solid pink; */
	margin: 0 4px 0 4px;
	height: 610px;
	background: url(../graphics/misc/separator01.gif) no-repeat bottom left;
}
#flickrGallery01 #col1 {
	float: left;
	width: 510px;
	/* border: solid 1px blue; */
}
#flickrGallery01 #col2 {
	float: right;
	width: 430px;
	/* border: solid 1px blue; */
}
.flickrControls {
	color: #fff;
	background-color: #555;
	padding: 3px 10px 4px 10px;
	margin-bottom: 15px;
}
.flickrControls a {
	color: #f0a92c;
	cursor: pointer;
}
.flickrControls a:hover {
	color: #fff;
	text-decoration: none;
}
.flickrControls a#flickrPreviousPhoto, .flickrControls a#flickrPreviousPage {
	background: url(../graphics/misc/flickrArrowLeft01.gif) no-repeat 0 0;
	padding-left: 20px;
}
.flickrControls a#flickrNextPhoto, .flickrControls a#flickrNextPage {
	background: url(../graphics/misc/flickrArrowRight01.gif) no-repeat right 0;
	padding-right: 20px;
}
a#flickrPreviousPhoto.disabled, a#flickrNextPhoto.disabled, a#flickrPreviousPage.disabled, a#flickrNextPage.disabled {
	color: #999999;
	cursor:default;
}
#flickrPhotoContainer {
	border: 1px solid #999;
	width: 500px;
	height: 500px;
	background: url(../graphics/misc/flickrPreloader.gif) no-repeat center center;
	position:relative;
	top: 0!important; /* example: to lock photo container to top */
	background-color: #fff;
	padding: 4px;
}
#flickrPhoto {
	background-repeat: no-repeat;
	background-position: center center;	
}
p#flickrPhotoMeta {
	margin-top: 10px;
}

ul#flickrThumbContainer {
	clear: right;
	display: block;
}
li.flickrThumb {
	list-style: none;
	display: block;
	float: left;
	width: 75px;
	height: 75px;
	cursor: pointer;
	position: relative;
	border: solid 1px #999;
	padding: 3px;
	background-color: #FFF;
	background-repeat: no-repeat;
	background-position: center center;
	margin: 1px;
}
li.flickrThumb:hover {
	border: 1px solid #333;
}
li.flickrThumb.flickrCurrent {
	border: 1px solid #FF9900;
}
.flickrThumbIcon {
	position: absolute;
	bottom: 5px;
	right: 5px;
}
.flickrThumbIcon.flickrVideo {
	background: url(../graphics/misc/flickrVideoIcon.gif) no-repeat;
	height: 11px;
	width: 11px;
}


/* pointsOfDifference01 is the main wrapper around the Points of Dif box on the accommodations rates page. */
DIV.pointsOfDifference_wrap01 {
	margin-top: 25px;
	border: solid 1px #829DAF;
	padding: 15px 20px 10px 20px;
	background: url(../graphics/misc/pointsOfDifferenceBG01.gif) repeat-y 0 0;
}
DIV.pointsOfDifference_wrap01 UL#pointsOfDifference {
	padding-top: 10px;
}
DIV.pointsOfDifference_wrap01 UL#pointsOfDifference LI {
	list-style: none;
	font-weight: bold;
	font-size: 14px;
}
DIV.pointsOfDifference_wrap01 UL#pointsOfDifference LI UL LI {
	font-weight: normal;
	font-size: 11px;
	padding-bottom: 15px;
}


/* comments_wrap01 is the DIV wrapped around the comments box on the Accommodations Rate page */
DIV.comments_wrap01 {
	margin-top: 25px;
	border: solid 1px #888;
	padding: 15px 20px 20px 20px;
}
DIV.comments_wrap01 DIV#comments IMG  {
	margin-top:10px;
}






.sitemap01 H3 {
	font-size: 11px;
}
.sitemap01 H3 A {
	display: block;
	width: 240px;
	height: 30px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-decoration: none;
}
.sitemap01 H3 A:hover {
	background-position: 0px -30px;
}
.sitemap01 H3 A SPAN {
	display: none;
}
.sitemap01 H3#sitemapHeaderInn A {
	background-image: url(../graphics/misc/sitemapHeaderInn01.gif);
}
.sitemap01 H3#sitemapHeaderDestination A {
	background-image: url(../graphics/misc/sitemapHeaderDestination01.gif);
}
.sitemap01 UL LI {
	margin-top: 8px;
	font-size: 11px;
	background-image:url(../graphics/misc/bulletDropArrow02bold.gif);
	background-position: 9px 5px;
	background-repeat: no-repeat;
	padding-left: 20px;
	list-style: none;
	line-height: 17px;
}
.sitemap01 UL UL LI {
	margin-top:0px;
	font-size: 11px;
	background-image:url(../graphics/misc/bulletDropArrow01.gif);
	background-position: 22px 5px;
	background-repeat: no-repeat;
	padding-left: 33px;
	list-style: none;
	line-height: 17px;
}
.sitemap01 UL UL LI A {
	font-weight: normal;
}

.sitemap02 H4 {
	font-size: 9px;
	text-transform: uppercase;
	line-height: 22px;
	color: #333333;
	width: 235px;
	height: 28px;
	background-image: url(../graphics/misc/sitemapHeaderGeneric01.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
}
.sitemap02 H4 A {
	color: #222222;
	padding: 0px 0px 0px 10px;
	display: block;
}
.sitemap02 H4 A:hover {
	color: #999999;
}
.sitemap02 UL {
	margin-bottom: 15px;
}
.sitemap02 UL LI {
	font-size: 11px;
	background-image:url(../graphics/misc/bulletDropArrow01.gif);
	background-position: 9px 5px;
	background-repeat: no-repeat;
	padding-left: 20px;
	list-style: none;
	line-height: 17px;
}
.sitemap02 UL LI A {
	font-weight: normal;
}


/* for the dark boxes on the employment and contact pages. the A tag version is used on the contact page, and the DIV tag version is used on the Employment page. */
.darkBox01 {
	display: block;
	color: #f2f2f2;
	font-weight: normal;
	background-color: #484848;
	padding: 15px 6px 10px 10px;
	border: 1px solid #a8a8a8;
	margin-bottom: 10px;
}
DIV.darkBox01 {
	margin-bottom: 30px;
}
/* images in the boxes */
.darkBox01 P.employmentBoxImage {
	float: right;
}
.darkBox01 P.mapBoxImage {
	float: right;
	padding-right: 10px;
	margin-bottom: 5px;
}
.darkBox01 P.giftcertificateBoxImage {
	float: left;
}
/* text in the boxes */
.darkBox01 DIV.employmentBoxText, .darkBox01 DIV.giftcertificateBoxText {
	width: 320px;
	margin-left: 10px;
	/* border: 1px solid red; */
}
.darkBox01 DIV.giftcertificateBoxText {
	margin-left: 145px;
}
.darkBox01 DIV.mapBoxText { /* used on accommodations rates page */
	width: 200px;
	margin-left: 10px;
	/* border: 1px solid red; */
}
.darkBox01 DIV.large {
	padding-top: 10px;
	font-size: 16px;
	line-height: 24px;
	letter-spacing: -1px;
}
.darkBox01 DIV.employmentBoxText P {
	padding-bottom: 10px;
}
/* hover state of text in dark boxes when they are A tags */
A.darkBox01:hover {
	color: #FFFFFF;
}
/* titles in darkBoxes */
.darkBox01 H3 {
	margin-top: 10px;
	width: 276px;
	height: 25px;
}
A.darkBox01 H3 {
	margin-left: 10px;
}
A.darkBox01:hover H3 {
	background-position: 0 -25px; /* there's a rollover state to the h3 titles in darkBox01 when the whole box is an A tag */
}
A.darkBox01 H3.contactSubtitleEmployment {
	background: url(../graphics/subtitles/booknowSubtitleEmployment.gif) no-repeat 0 0;
}
A.darkBox01 H3.accommodationsRatesSubtitleMap {
	background: url(../graphics/subtitles/accommodationsRatesSubtitleMap.gif) no-repeat 0 0;
	width: 180px;
}
DIV.darkBox01 H3.giftcertificateSubtitleSharelove {
	margin-left: 145px;
	background: url(../graphics/subtitles/giftcertificateSubtitleSharelove.gif) no-repeat 0 0;
}
.darkBox01 H3 SPAN {
	display: none;
}



/* //////// content ends //////////////////////////////////////////////////////////////// */



/* //////// icons, that user can't access, begin //////////////////////////////////////////////////////////////// */
.iconOnline01 {
	background: url(../graphics/icons/iconOnline01.gif) no-repeat 0 0;
	padding: 0px 0px 2px 24px;
	font-size: 9px;
}
.iconPhone01 {
	background: url(../graphics/icons/iconPhone01.gif) no-repeat 0 0;
	padding: 3px 0px 2px 14px;
	font-size: 9px;
}
.iconFax01 {
	background: url(../graphics/icons/iconFax01.gif) no-repeat 0 0;
	padding: 0px 0px 2px 23px;
	font-size: 9px;
}
.iconEmail01 {
	background: url(../graphics/icons/iconEmail01.gif) no-repeat 0 0;
	padding: 0px 0px 2px 30px;
	font-size: 9px;
}
.iconMail01 {
	background: url(../graphics/icons/iconMail01.gif) no-repeat 0 0;
	padding: 0px 0px 2px 24px;
	font-size: 9px;
}

/* print icon 01, to be used in normal text areas, on light bg */
.iconPrint01 {
	background: url(../graphics/icons/iconPrint01.gif) no-repeat 0px 0px;
	padding: 3px 0px 0px 20px;
	font-size: 9px;
	line-height: 27px;
}
/* print icon 02, to be used on Press Releases, beside the back link, left justified in dark subtitle bg */
.iconPrint02 {
	background: url(../graphics/icons/iconPrint02.gif) no-repeat 0px 0px;
	padding: 3px 0px 0px 20px;
	font-size: 9px;
	line-height: 27px;
}
/* iconDownload02 has a slightly darker drop shadow, to be used on darker backgrounds. iconDownload01 is in the userCSS file */
.iconDownload02 {
	background: url(../graphics/icons/iconDownload02.gif) no-repeat 0 0;
	padding: 9px 0px 0px 20px;
	font-size: 9px;
	line-height: 27px;
}

/* used on 1st item in line, on tertiary nav. */
.bulletDropArrow01 {
	background: url(../graphics/misc/bulletDropArrow01.gif) no-repeat 0px 3px;
	padding: 0px 0px 0px 11px;
	font-size: 9px;
}



/* //////// icons ends //////////////////////////////////////////////////////////////// */





/* //////// misc begins //////////////////////////////////////////////////////////////// */

/* staff photos on the contact page */

img.staffPhoto, img.staffPhotoSm {
	width:100px;
	height:67px;
	float:left;
	background-color:#fff;
	padding:1px;
	border:solid 1px #ccc;
	margin:0 10px 10px 0;
}

img.staffPhotoSm {
	width:74px;
	height:50px;
}

div.staffWrap {
	width:240px;
	height:90px;
}


/* separator01 is applied to DIVs, to make a sort of horizontal rule. the graphic is 4px high, so this one has 4px of blank space above it. used on at least the NEWS page, TREATMENTS, PACKAGES */
.separator01 {
	/* was height: 12px, pos: 0,8 */
 	height: 12px;
	background: url(../graphics/misc/separator01.gif) no-repeat 0px 8px;
	clear: left;
}
/* separator02 is applied to DIVs, to make a sort of horizontal rule. This one is only 756px wide. has 20px of blank space below it. the graphic is 4px high, so this one has 4px of blank space above it. used on at least the EVENTS CALENDAR page */
.separator02 {
 	height: 12px;
	margin: 20px 0px 20px 0px;
	width: 756px;
	background: url(../graphics/misc/separator01.gif) no-repeat 0px 8px;
	clear: left;
}

/*used for left justifying images, without the white background: */
IMG.imageLeftJustifyPlain {
	float: left;
	margin: 0px 20px 20px 0px;
}
/* used for no justification, with border, on at least the lexus page */
IMG.imageNoJustify {
	padding: 4px;
	border: 1px solid #999999;
	background-color: #ffffff;
}

/* used on the pets can stay logo on promotions page */
DIV#petscanstay01 {
	float: right;
	margin: 0px 0px 20px 20px;
	font-size: 9px;
	line-height: 14px;
	width:130px;
	color: 3333333;
	text-align: center;
}

/* puts a red border around a block element. can be used on DIVs, Ps. used at least on Book Now page, employment page */
.redbox {
	padding: 10px 10px 0px 10px;
	margin: 10px 0 20px 0;
	border: 1px solid #C12D00;
}
/* puts a dark grey border around a block element. can be used on DIVs, Ps. rates page */
.greybox {
	padding: 10px 10px 0px 10px;
	margin: 10px 0 20px 0;
	border: 1px solid #333;
}


/* //////// misc ends //////////////////////////////////////////////////////////////// */



/* //////// booking form, res request form, spa treatment, contact form, writers+readers form, BEGINS ///////////////////////////////////////// */

/* this H3 is for a subtitle outside of the form box, on the book now page */
H3#booknowSubtitleIntro {
	height: 22px;
	margin: 30px 0px 10px 0px;
	background: url(../graphics/subtitles/booknowSubtitleIntro.gif) no-repeat 0 0;
}
H3#booknowSubtitleIntro SPAN{
	display: none;
}

/* form01 has less padding and a darker BG img, because it's designed to start on the left side of page = spa form, book now pt1 and pt2. form02 has more padding and lighter bg, and is designed to sit closer to middle of page = contact form, writers+readers form, unique lives form, Gift Cert form. */
.form01 {
	background: url(../graphics/misc/formBG02.gif) repeat-y 0 0;
	border: 1px solid #6B8FAD;
	padding: 20px 20px 0px 20px;
	margin-bottom: 10px;
}
.form02 {
	background: url(../graphics/misc/formBG01.gif) repeat-y 0 0;
	border: 1px solid #6B8FAD;
	padding: 25px 30px 15px 30px;
}
.form01 form, .form02 form {
	padding-top: 10px;
	/* border: solid 1px red; */
}

.form01 H3, .form02 H3 {
	height: 22px;
	margin-bottom: 10px;
}
.form01 H3 SPAN, .form02 H3 SPAN {
	display: none;
}
.form01 H3#booknowSubtitleOnline {
	background: url(../graphics/subtitles/booknowSubtitleOnline.gif) no-repeat 0 0;
}
.form01 H3#booknowSubtitleReservation {
	background: url(../graphics/subtitles/booknowSubtitleReservation.gif) no-repeat 0 0;
}
.form01 H3#spaSubtitleTreatmentRequest {
	background: url(../graphics/subtitles/spaSubtitleTreatmentRequest.gif) no-repeat 0 0;
}
.form01 H3#tipsSubtitleSendTip {
	background: url(../graphics/subtitles/tipsSubtitleSendTip.gif) no-repeat 0 0;
}
.form01 H3#mediaGallerySubtitleForm {
	background: url(../graphics/subtitles/mediaGallerySubtitleForm.gif) no-repeat 0 0;
}

.form01 H3#weddingSubtitleForm {
	background: url(../graphics/subtitles/weddingSubtitleForm.gif) no-repeat 0 0;
}
.form01 H3#weddingSubtitleContact {
	background: url(../graphics/subtitles/weddingSubtitleContact.gif) no-repeat 0 0;
}
.form01 H3#weddingSubtitleGeneral {
	background: url(../graphics/subtitles/weddingSubtitleGeneral.gif) no-repeat 0 0;
}
.form01 H3#weddingSubtitleGuestroom {
	background: url(../graphics/subtitles/weddingSubtitleGuestroom.gif) no-repeat 0 0;
}
.form01 H3#weddingSubtitleOther {
	background: url(../graphics/subtitles/weddingSubtitleOther.gif) no-repeat 0 0;
}

.form02 H3#contactSubtitleSignup {
	background: url(../graphics/subtitles/contactSubtitleSignup.gif) no-repeat 0 0;
}
.form02 H3#writersSubtitleForm {
	background: url(../graphics/subtitles/writersSubtitleForm.gif) no-repeat 0 0;
}
.form02 H3#uniqueSubtitleForm {
	background: url(../graphics/subtitles/uniqueSubtitleForm.gif) no-repeat 0 0;
}
.form02 H3#giftcertificateSubtitlePurchase {
	background: url(../graphics/subtitles/giftcertificateSubtitlePurchase.gif) no-repeat 0 0;
}

.form01 P, .form02 P {
	margin-bottom: 10px;
}
.form01 TABLE, .form02 TABLE {
	font-size: 9px;
	margin-bottom: 15px;
	line-height: 16px;
}
/* form 01 has a bit more space between TDs, than form02 */
.form01 TABLE TD {
	padding-bottom: 5px;
	padding-right: 5px;
}
.form02 TABLE TD {
	padding-bottom: 3px;
	padding-right: 3px;
}
.form01 TABLE TD.formSpacerTR, .form02 TABLE TD.formSpacerTR {
	padding-bottom: 15px;
}
.form01 INPUT, .form02 INPUT {
	font-family: Arial, Helvetica, sans-serif;
	background-color: #CDDEEA;
	font-size: 12px;
	font-weight: normal;
	padding: 2px 2px 2px 5px;
	border: 1px solid #95acbb;
	height:16px;
}
.form01 INPUT.formLargerText, .form02 INPUT.formLargerText { /* used on big input field on Gift Cert form */
	font-size: 18px;
	padding: 5px 2px 2px 5px;
	height: 23px;
}

.form01 INPUT.formInputNoBG, .form02 INPUT.formInputNoBG { /* used on checkboxes (lots of places) and radio buttons (at least on spaform.php) */
	background-color: transparent;
	padding: 0;
	border: none;
}
.form01 INPUT.registerSubmit, .form02 INPUT.registerSubmit {
	border: 1px solid #25455A;
	font-weight : bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9px;
	width: 100px;
	height: 25px;
	color: #E1F1FF;
	text-transform: uppercase;
	background-color: #3F729E;
}
.form01 SELECT, .form02 SELECT {
	border: 1px solid #95acbb;
	font-size: 12px;
	font-family:Arial, Helvetica, sans-serif;
	font-weight: normal;
	padding: 2px 2px 2px 1px;
	background-color: #CDDEEA;
}
.form01 SELECT.selectSmallText, .form02 SELECT.selectSmallText{
	font-size: 10px;
}
.form01 TEXTAREA, .form02 TEXTAREA {
	border: 1px solid #bbbbbb;
	font-size: 12px;
	font-family:Arial, Helvetica, sans-serif;
	font-weight: normal;
	padding: 2px 2px 2px 5px;
	background-color: #CDDEEA;
}
.form01 .formLargeText, .form02 .formLargeText {
	font-size: 11px;
	line-height: 18px;
}
.form01 .formLargerText, .form02 .formLargerText {
	font-size: 14px;
}
.form01 .formSmallText, .form02 .formSmallText {
	font-size: 9px;
	line-height: 16px;
}

.form01 label.error, form02 label.error { /* the error messages, used at least on newest forms: wedding request, images and logos form */
	color: red;
	display: block;
	font-weight: bold;
}

.form01 #recaptcha_image, .form02 #recaptcha_image  {
	border: solid 1px #95acbb; /* puts border around the newest recaptcha images (not all forms use REcaptcha, some use an older captcha */
}


/* //////// booking form ENDS //////////////////////////////////////////////////////////////// */










/* //////// footer begins //////////////////////////////////////////////////////////////// */

#footer {
	height: 22px;
	background-image:url(../graphics/misc/footerBG01.jpg);
	background-position: 0px 0px;
	background-repeat: no-repeat;
	font-size: 9px;
	line-height: 22px;
	/* padding gets the ULs (footer nav) in from the sides */
	padding: 0px 10px 0px 10px;
	margin-top: 15px;
	margin-bottom: 20px;
}
#footer UL {
	
}
#footer UL A {
	color: #686868;
	text-decoration: none;
	font-weight: normal;
}
#footer UL A:hover {
	color: #111111;
}
#footer UL LI {
	display: inline;
	list-style: none;
}
#footer UL#footerLeft {
	float: left;
	text-transform: uppercase;
	color: #686868;
}
#footer UL#footerLeft LI {
	padding-right: 5px;
}
#footer UL#footerLeft LI A {
	font-weight: bold;
}
#footer UL#footerRight {
	float: right;
}
#footer UL#footerRight LI {
	
}
#footer UL#footerRight LI A {

}
#footer UL#footerRight LI A#footerBooknow {
	/* font-weight: bold;
	text-transform: uppercase;
	color: #1A6000; */
}
#footer UL#footerRight LI A#footerBooknow:hover {
	/* color: #111111; */
}
#footer UL#footerRight LI#footerPhone {
	padding-left: 15px;
}



#bottomInfo { /* used on non-homepage pages */
	clear: both;
	margin: 20px 5px 20px 5px;
}
#bottomInfoHome {
	clear: both;
	margin: 0px 5px 0px 5px;
}

#bottomInfo A#facebook, #bottomInfoHome A#facebook {
	float: right;
	font-size: 9px;
}

#bottomInfo A#sitebywallop, #bottomInfoHome A#sitebywallop {
	height: 20px;
	width: 68px;
	display: block;
	background: url(../graphics/misc/siteByWallop01.gif) no-repeat 0 0;
}
#bottomInfo A#sitebywallop:hover, #bottomInfoHome A#sitebywallop:hover {
	background-position: 0px -20px;
}
#bottomInfo A#sitebywallop SPAN, #bottomInfoHome A#sitebywallop SPAN {
	display: none;
}

/* //////// footer ends //////////////////////////////////////////////////////////////// */