BODY		{background: #ADC382 url("images/rhp-bkg.jpg") fixed; margin: 3px 0px 20px 0px;}

* 	{margin: 0; padding: 0;}

#CONTAINER	{width: 950px; display: table; background: none; position: relative; margin:0 auto;}

/* display: table; should not be used on CONTENT to set an elastic 100% auto-height.
   float: left; is necessary on the CONTENT DIV instead to ensure CENTER & RIGHT columns do not 
   slide to bottom of LEFT column in FF, something that occurs in FF with random page loads. 
   This will also allow the background to fill the entire CONTENT space */


#LOGO		{float: left; height: 164px; width: 660px; background: url("images/rhp-logo.gif"); position: relative;}
#LOGO P		{color: #D5E0CA; font: italic bold 18px Arial; text-align: left; padding: 72px 0px 0px 390px; line-height: 24px;}

#AD		{float: left; height: 136px; width: 240px; background: url("images/rhp-ad-bkg.gif"); padding: 28px 0px 0px 50px; position: relative;}

#MENU		{clear: both; height: 29px;  width: 950px; background: url("images/rhp-menu-bkg.gif"); position: normal;}
#MENU P		{color: #95C538; text-align:center; padding-top: 6px;}
.menu A		{color: #FFF; font: bold 13px Arial; text-align:center; padding: 0px 13px 0px 13px; text-decoration: none;}
.menu A:hover	{color: #CCFF00; text-decoration: none;}

#CONTENT	{float: left; width: 950px; background: url("images/rhp-page-bkg.gif"); margin-bottom: -20px; position: relative;}

#CENTER		{float: left; height: 100%; width: 570px; padding: 15px 60px 60px 60px; position: relative;}

#row		{float: left; height: 100%; position: relative;}
#column		{float: left; height: 100%; width: 170px; padding: 10px; position: relative;}

#SIDE		{float: left; width: 210px; height: 100%; text-align:center; padding: 8px 25px 0; position: relative;}
#SIDE-WELC	{float: left; width: 260px; height: 100%; text-align:center; padding: 0; position: relative;}
#SIDE P		{color: #2D4302; font: 12px Arial; text-align:center; padding-bottom: 3px;}
#SIDE A		{text-decoration: underline;}

#FOOTER		{float: left; height: 82px; width: 700px; background: url("images/rhp-footer-bkg.gif") no-repeat; padding: 24px 125px 0px 125px; position: relative;}
#FOOTER-LR	{float: left; height: 80px; width: 150px; position: relative;}
#FOOTER-C	{float: left; height: 80px; width: 400px; padding: 0px; position: relative;}
#FOOTER H1	{color: #EDF69C; font: 11px Verdana; padding: 0px 0px 6px 0px;}
#FOOTER H2	{color: #EDF69C; font: 11px Arial;   padding: 0px;}


P		{color: #000000; font: 13px Verdana; text-align: justify; padding: 0 0 6px 0;}
P.C		{color: #000000; font: 13px Verdana; text-align: center; padding: 6px 0 6px 0;}
P.show		{color: #000000; font: 12px Verdana; text-align: justify; padding: 9px 9px 0 9px;}
P.rvw		{		 font: 13px Verdana; text-align: center; padding: 3px;}
H1		{color: #111111; font: bold 30px Arial; text-align: center; padding: 14px 0 3px 0;}
H2		{color: #355200; font: bold 20px Arial; text-align: center; padding: 14px 0 3px 0;}
H3		{color: #355200; font: bold 14px Arial; text-align: center; padding: 3px 0 3px 0;}
H4		{color: #355200; font: 13px Verdana; text-align: center; padding: 3px;}
H5		{		 font: 11px Arial; text-align: center; padding: 9px 0 16px 0;}
H6		{		 font: bold 12px Arial; text-align: center; padding: 6px 0 3px 0;}
A		{color: #547802; text-decoration: underline;}
A:hover		{color: #87AB25; text-decoration: underline;}

ul		{color: #000; font: 12px Verdana; text-align: left; margin: 6px 40px 6px 100px;}
img		{border: 0px;}
img.pic		{margin: 1px; border: solid white 4px;}
form 		{margin: 0px;}
TABLE		{border-collapse: collapse; border: 0px;}


/*   i n d e x  p a g e   */

#CENTER-IDX	{float: left; height: 100%; width: 690px; text-align: center; padding-top: 8px; position: relative;}

#show-logo	{float: left; width: 290px; height: 100%; padding: 8px 0px 0px 40px; position: relative;}
#show-info	{float: left; width: 312px; height: 100%; padding: 0px 24PX 0 24PX; position: relative;}

#show-info H1	{padding: 6px 0px 0px 0px;}
#show-info H2	{color: #111111; padding: 0px;}
#show-info H3	{padding: 9px 0px 3px 0px;}
#show-info H4	{color: #111111; font: 12px Arial; padding: 6px 0px 0px 0px;}
#show-info H5	{padding: 6px 0 0 0;}
.year			{font: bold 12px Arial;}

#coming		{float: left; width: 690px; height: 145px; background: #F4FADA url("images/rhp-coming-bkg.gif") repeat-x; position: relative;}
#attr		{float: left; width: 345px; height: 125px; position: relative;}

/*   i n d e x  p a g e   */


/*   s h o w  p a g e   */

#show-hlfL	{float: left; width: 285px; height: 100%; position: relative;}
#show-hlfR	{float: left; width: 285px; height: 100%; position: relative;}

#show-qtrL	{float: left; width: 141px; height: 100%; margin: 0 2px 0 0; position: relative;}
#show-qtrR	{float: left; width: 142px; height: 100%; position: relative;}
#show-qtrL P	{font: 11px Verdana; text-align: left; padding: 0 0 1px 5px;}
#show-qtrR P	{font: italic 11px Verdana; text-align: right; padding: 0 0 1px 0;}
#show-qtrR P.sml {font: italic 10px Verdana; text-align: left; padding: 0 0 1px 5px;}

/*   s h o w  p a g e   */


/*   r e s e r v a t i o n   p a g e   */

TABLE.reserve	{width: 570; background: E2F7B8;}

HR	{color: #cccccc; height: 1px; margin: 6px;}

.td1	{color: #020; width: 90%; font: bold 12px Trebuchet MS; text-align: center; padding-top: 3px;}
.td2	{color: #020; font: bold 14px Trebuchet MS; text-align: center; padding: 0px 0px 3px 0px;}
.td3	{color: #020; font: 12px Trebuchet MS; text-align: center; width: 65px; padding: 0px 0px 0px 0px;}
.td3x	{color: #999999; font: 12px Trebuchet MS; text-align: center; width: 65px; padding: 0px 0px 0px 0px;}
.td4	{color: #020; font: 13px Trebuchet MS; text-align: right; padding: 0px 2px 0px 4px;}
.td5	{color: #020; font: 10px Arial; text-align: left; padding: 0px 0px 0px 0px;}
.fine		{color: #020; font: 10px Arial; text-align: center; margin: -2px;}
.fields	{color: #000; font: 12px Arial; height: 20px; line-height: 20px; text-align: left;}
.button	{font: 12px Verdana; margin: 8px; padding: 2px;}

/*   r e s e r v a t i o n   p a g e   */


/*   l i g h t b o x  */

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }


/*   l i g h t b o x  */

