body {
     font: 100.01% Verdana, Arial, Helvetica, sans-serif; /* this sets the overall font size and family overriding an older Opera bug */
     background: #CEB993; /* this creates the overall color. The drop shadowed image is placed in the #holder div */
     margin: 0; /* zeroing the margin and padding allows all browsers to start from the same place since defaults are different. */
     padding: 0;
     text-align: left; /* corrects a bug in early IE browsers allowing the overall design to left. */
}

#holder {
     background:  url(images/background.jpg) repeat-y; /* this creates the two column, drop shadowed background. It will go from top to bottom making both columns appear to be the same length no matter which is longer. */
     margin: 0 auto; /* this lefts the overall design */
     padding: 0 10px; /* the left and right padding keeps the content back from the drop shadows (they are 10px each). */
     width: 720px; /* 20px less than actual width due to padding above */
     text-align: left; /* corrects the above text-align: left; for those browsers that need it */
     position: relative; /* this gives the div positioning so that an absolutely positioned div (AP Div) can be placed within it. Otherwise, the AP Div would be placed relative to the body element (or the last positioned parent element). */
}

/* \*/
* html #holder {
width: 740px;
w\idth: 720px;
}
/* feeds IE 5* PC the correct width due to its non-standard box model */


/* Needed to hold link to main content in compliance with Section 508, rule o. */
#skipnav {
	position: absolute; /* Sets the div to be positioned in a precise spot in relation to its nearest postioned ancestor, or barring that, the body. Also removes it from the flow, so it will not push down the header image. */
	top: 0; /* Places the div at the top of body. */
	left: 0; /* Places the div at the left side of body. */
	margin-left: -1000px; /* Moves the div off the left side of the screen, making it invisible to those using visual browsers but accessible to those using screen readers and other user agents. */
	}

.img {
border:0px;
}
#facebook {
float:left;
	margin: 10px 00px 0px 12px;
}
#facebookbutton {
float:left;
	margin: 10px 10px 10px 12px;
	width:300px;
	
}
#facebook img {
border:0px;
}



#header {
	background: url(images/header.gif) repeat-x; /* creates the vertically repeating background for the top section */
	font-family: "Gill Sans", "Trebuchet MS", Arial, Helvetica, sans-serif; /* sets the font-family for both the links and the header within this div */
	height: 69px; /* the actual height desired is 155px. But height and padding (and borders if they were used) must add up to the final desired number */
	padding-top: 0px; /* this padding keeps the home and contact links away from the top of the browser window */
	padding-right: 20px; /* this padding keeps the home and contact links away from the right side of the browser window */
	margin: 0;
}
#header h1 {
	font-size: 1.4em; /* sets the font size of the heading (tagline) */ 
	color: #ffffff;
	padding: 65px 2px 5px 248px; /* keeps the tagline placed where desired. --- these padding values, if using sIFR, must be mirrored (exactly the same) in the replacement call in the document */
	margin: 0;
	font-weight: normal; /* a styling choice */
}
/* IE Mac wants to place the subheading slightly differently and is fed the values in the selectors above. The following selectors feed the correct padding and height to compliant browsers (as well as the non-standard IE 5* browsers) and are hidden from IE Mac. */
/*hide from IE Mac -   \*/
#header {
	padding-top: 00px;
	height: 69px; hei\ght: 69px;
}
#header h1 {
	padding-top: 75px;
} 
/* end hide from IE Mac -- do not add a comment before the close of this hack */



#header p {
	color: #ffffff;
	text-align: right; /* aligns the home and contact links on the right side */
	font-size: 20px;
	letter-spacing: .06em; /*may need to remove if it causes quirkiness */
	line-height: 145%;
	float: right;
}
#header a:link, #header a:visited { /* sets the styling of the links in the header */
	color: #ffffff;
	text-decoration: none;
}
#header a:hover, #header a:active, #header a:focus { /* sets the hover styling */
	text-decoration: underline;
}
/* header 2! */
#header2 {
	
	clear:both;
	background: url(images/header_pt2.jpg) repeat-x; /* creates the vertically repeating background for the top section */
	font-family: "Gill Sans", "Trebuchet MS", Arial, Helvetica, sans-serif; /* sets the font-family for both the links and the header within this div */
	height: 84px; /* the actual height desired is 155px. But height and padding (and borders if they were used) must add up to the final desired number */
	padding-top: 0px; /* this padding keeps the home and contact links away from the top of the browser window */
	padding-right: 20px; /* this padding keeps the home and contact links away from the right side of the browser window */
	margin: 0;
}
#header2 h1 {
	font-size: 1.4em; /* sets the font size of the heading (tagline) */ 
	color: #ffffff;
	padding: 65px 2px 5px 248px; /* keeps the tagline placed where desired. --- these padding values, if using sIFR, must be mirrored (exactly the same) in the replacement call in the document */
	margin: 0;
	font-weight: normal; /* a styling choice */
}
/* IE Mac wants to place the subheading slightly differently and is fed the values in the selectors above. The following selectors feed the correct padding and height to compliant browsers (as well as the non-standard IE 5* browsers) and are hidden from IE Mac. */
/*hide from IE Mac -   \*/
#header2 {
	padding-top: 00px;
	height: 84px; hei\ght: 84px;
}
#header2 h1 {
	padding-top: 75px;
} 
/* end hide from IE Mac -- do not add a comment before the close of this hack */



#header2r p {
	color: #ffffff;
	text-align: right; /* aligns the home and contact links on the right side */
	font-size: .8em;
	letter-spacing: .06em; /*may need to remove if it causes quirkiness */
	line-height: 145%;
	float: right;
}
#header2r a:link, #header2r a:visited { /* sets the styling of the links in the header */
	color: #ffffff;
	text-decoration: none;
}
#header2r a:hover, #header a:active, #header a:focus { /* sets the hover styling */
	text-decoration: underline;
}

#logo {
	background: url(images/logo_bott.gif) no-repeat 0px 99px; /*logo placed in as a background image so that sIFR text can be used for the tagline and slightly overlap ... the image, since it is only the bottom half of the logo, is placed 99px from the top of this element. This allows it to match with the top half. */
	width: 265px; /* this is the width of the logo image */
	height: 155px; /* This is the height of the actual logo image from the comp (not sliced in half) */
	position: absolute; /* this keeps the div placed exactly where you want it in the parent element */
	top: 0; /* the top starts at the very top of the parent element */
	left: 10px; /* this starts the logo image 10px from the left of the parent element, creating some visual space */
}

#content {
	margin: 20px 20px 0 250px; /* this carves out the space for the navigation and creates the proper content area */
	padding-bottom: 5px;
	font-weight: normal;
}
/* The following selector will be shown only to IE */
* html #content {
	margin-left: 247px; /* this is neccessary to avoid float drop in IE PC */
	height: 1%; /* this is neccessary if you're using sIFR -- IE drops everything down below the left sidebar from the beginning of the sIFR on ... a dimension is required -- this is the Holly Hack */
}

/* The following selectors are styling for the content div's headings, paragraphs and links. If sIFR is used for the headings, make sure any padded added to these selectors is also added to the sIFR replacement calls in the body. */
#content h2, #content h3, #content h4 {
	font: normal 1.35em "Gill Sans", "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #ff9900;
}
#content h4 {
	font-size: 1.25em;
}
#content p {
	color: #333;
	font: .75em/135% Verdana, Arial, Helvetica, sans-serif;
}
#content .link { /* creates the larger Learn More link at the bottom of the page */
	font: 1.25em "Gill Sans", "Trebuchet MS", Arial, Helvetica, sans-serif;
}
#content a:link, #content a:visited {
	color: #ff9900;
	text-decoration: none;
}
#content a:hover, #content a:active, #content a:focus {
	text-decoration: underline;
}
/* The following selectors control the sidebar/navigational area */
#sidebar {
	clear:both;
	float: left; /* the navigation is floated to the left so that it can be any length. If it were an AP Div, it would be "out of the flow" of the document and could flow off the bottom edge of the page */
	width: 220px; /* must have a width value */
	margin-top: 0px; /* this aligns the beginning of the sidebar content with the main content div */
}
#sidebar h2 {
	font: normal 1.2em "Gill Sans", "Trebuchet MS", Arial, Helvetica, sans-serif; /* sets the weight, font-family and size */
	color: #fff; /* text color of the headings */
	background: #FECF80 url(images/sidehead.jpg) repeat-y; /* This creates the gradient background of the heading */
	padding: 1px 5px 2px; /* this keeps the text away from the inner edges of the box we've created. These values MUST be mirrored in your sIFR replacement calls in the body */
	margin: 0 0 5px 20px; /* this controls the outer edge placement which keeps the heading box away from other elements */
}

#sidebar h3 {
	font: Verdana, Arial, Helvetica, sans-serif;
	color: #333;
	font-weight: bold;
	font-size:.75em;
	font-family: Verdana, Geneva, sans-serif;
	padding: 1px 5px 2px;

}


/* the following selectors create the button look using an unordered list */
ul#nav {
	padding: 0; /* begins with the usual zeroing of padding and margin to create a level playing field */
	margin: 0;
	list-style: none; /* removes the list marker from the navigation */
}
#nav li {
	padding-left: 23px; /* width of the little icons */
	margin-left: 20px; /* clears the left side evenly all the way down */
	font: .8em/110% Arial, Helvetica, sans-serif;
}
/* each list item has a unique ID to place its own icon into the button */
#nav li#flight {
	background: url(images/bubbles1.gif) no-repeat left left;
}
#nav li#room {
	background: url(images/bubbles3.gif) no-repeat left left;
}
#nav li#car {
	background: url(images/bubbles4.gif) no-repeat left left;
}
#nav li#table {
	background: url(images/bubbles2.gif) no-repeat left left;
}
#nav li#show {
	background: url(images/bubbles5.gif) no-repeat left left;
}
/* the below styles the button area next to the icon */
#nav li a:link, #nav li a:visited {
	display: block; /* this makes the A element clickable all the way across (not just on the words) */
	background: #fff; /* the overall background color of the button area */
	color: #000; /* this is the text color */
	font-weight: bold; /* makes the links appear bolded */
	text-decoration: none; /* this gets rid of the underlines */
	margin: 3px 0 2px 0; /* this creates the space OUTSIDE each button */
	/*height: 1.2em;  15px; the icons are 23px tall. We want these buttons to match that. So add the height, plus the top and bottom padding, PLUS the top and bottom border. The final amount should total 23px */
	padding: 3px 2px 3px 20px; /* the padding creates the area WITHIN the button and keeps the text away from the borders */
	border-top: 1px solid #ccc; /* since the light in the logo appears to be coming from the top left, we've used a light top color and a darker bottom and right color */
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
}
/* hide holly hack from IE Mac \*/
* html #nav li a { 
	height: 1%;
	vertical-align: bottom;
} /* Holly Hack to get around a lovely IE issue with list items and a elements set to block */

#nav li a:hover, #nav li a:active, #nav li a:focus {
	background: #ccc; /* the button background changes on hover and focus to the page background color */
	 /*color: #fff; for contrast, the text color changes to white */
	border-top: 1px solid #999; /* Since the light is coming from the top left, when the button is depressed, the light would hit the right and bottom borders. They've been changed to the light color. The top border has been darkened as if shadowed */
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}

/* the following selectors create the photo/info teaser area below the navigation */
#features {
	background: #fff url(images/sidehead.jpg) no-repeat left bottom; /* this uses the same slice as the h2 headings but is set not to repeat */
	margin: 0px 0 5px 10px; /* this keeps the div away from the UL above (space as you like) and the same distance from the left side as well */
	padding-bottom: 10px; /* this creates a little space before the decorative border */
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: bold;
	color: #666;
	text-align: left;
	font-style: normal;
}

#quote {
	margin: 10px 0 5px 10px; /* this keeps the div away from the UL above (space as you like) and the same distance from the left side as well */
	padding-bottom: 0px; /* this creates a little space before the decorative border */
	font-family: Georgia, times New Roman, Times, serif;
	font-weight: bold;
	font-size: 0.85em;
	color: #312056;
	text-align: left;
	font-style: Italic;
}

#quote2{
	margin: 30px 0 5px 10px; /* this keeps the div away from the UL above (space as you like) and the same distance from the left side as well */
	padding-bottom: 0px; /* this creates a little space before the decorative border */
	font-family: Georgia, times New Roman, Times, serif;
	font-weight: bold;
	font-size: 0.85em;
	color: #F90;
	text-align: left;
	font-style: Italic;
}

#quote_tag {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 0.75em;
	color: #312056;
	text-align: left;
	font-style: Normal;
}


/* Don't show to IE Mac \*/
* html #features {height: 1%;}
/* Close the show only to IE PC Holly Hack (Place no comments inside the hack or it will close) */

#features h2 {
	margin-left: 0; /*this overrides the left margin if an h2 element is within the features div -- features is already over 20px from the left margin and we don't want space within that div. We want the h2 element to go all the way across */
}

#features p {
	font: .75em/135% Verdana, Arial, Helvetica, sans-serif; /* font size/line height and font-family */
	color: #666;
	font-weight: normal;
	margin: 5px 2px 5px 5px; /* this created extra space between each paragraph element (with floated image) */
	font-style: normal;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-align: left;
	padding: 0px 2px 10px 2px;
}

/* the next two selectors simply create the black bottom of the page */
#bottom {
	background: #9a0509; /* this created the black color that runs all the way across the page background */
}
#pagebott {
	background: url(images/foot.jpg) repeat-y; /* this creates the dropshadow look */
	width: 740px; /* must equal the same width as your overall #holder div to match exactly -- remember to count padding and/or borders for each as well */
	margin: 0 auto; /* this lefts it like the main holder above it */
}
#pagebott p {
	margin: 0;
	text-align: center; /* left aligns the text */
	font-size: 0.65em; /* choose a font size slightly smaller than your main page for best results */
	color: #ffffff; /* choose a color without as much contrast as your main page so that this doesn't jump out */
	padding: 5px; /* creates a small amount of space */
	letter-spacing: .06em; /* if this causes problems in any browsers, simply remove it */
}
/* creates the link and hover styling for the pagebott area */
#pagebott a:link, #pagebott a:visited {
	color: #ffffff;
	text-decoration: none;
}
#pagebott a:hover, #pagebott a:active, #pagebott a:focus {
	color: #ffffff;
	text-decoration: underline;
}

/* the following selectors are the form styles */
#content form {
	margin: 0; /* zeros the margin for a level playing field */
	padding: 0 0 10px; /* creates 10px of padding at the bottom of the form */
  	width: 450px; /* this is set to avoid float drop (to the same width as the Flash slideshow on the home page) */
  	float: left; /* floating this form element keeps the internal clearing BR's within the form from clearing the external floated side column. */
}	
#content fieldset {
	border: 1px solid #BE9E6F; /* defines a border around each fieldset */
	margin: 0 0 10px; /* keeps the fieldset's bottom border 10px off the next element */
	padding: 5px 0 15px 15px; /* creates padding to keep the elements inside away from the edge of the fieldset */
}
#content legend {
	border: 1px solid #BE9E6F; /* creates a defined box/border around the legend */
	color: #fff; /* contrasting text color */
	background: #FECF7F url(images/sidehead.jpg) repeat-y; /* gives the legend the same background as the feature headings */
	padding: 1px 5px 2px; /* keeps the borders away from the text by these specified amounts */
	margin-bottom: 5px; /* creates 5px of space from the bottom of the legend */
	font: normal 1em "Gill Sans", "Trebuchet MS", Arial, Helvetica, sans-serif;  /* styles the text within */
}
#content label {
	float: left; /* The label elements in the form are floated left, and the text inside is right aligned. */
 	width: 110px; /* All the labels have the same width, so their right edges line up vertically. */
  	clear: both; /* They are all cleared so that they always start a new line below previous form element floats. */
	font-size: .8em;
	text-align: right;
	margin-top: 3px; /* this moves the text/label down away from the top of the input */
	}
#content input, #content textarea {
	color: #000; /* creates the text color */
	border: 1px solid #CEB993; /* gives the input and textarea a border */
	padding: 1px; /* this keeps the text from touching the edges of the input and textarea */
	background: #EAE0D2; /* creates a background color */
	margin: 3px 5px 2px; /* this creates the space around the inputs and textarea so they don't stack on top of each other */
	width: 280px; /* creates a consistent width */
	float: left; /* These inputs and the textarea are floated next to the labels. */ 
}

/*\*/ /*/
#content input, #content textarea {
	float: none;
}
/* End show to IE Mac */
/* IEmac must not see these elements floated or it is buggy. That browser, however, is good without floating. The above hack can be read only by IEmac. Be sure you do not add any comments INSIDE the hack or it will close. */

#content input.sminp {
	width: 110px; /* for shorter input boxes. */
	margin-right: 160px; /* this keeps the shorter boxes aligned on the left with the wider ones. */
}

/* this selector changes the inputs and textareas when the cursor is inside in supported browsers */
#content input:focus, #content input:active, #content textarea:focus, #content textarea:active {
	color: #000;
	background: #BE9E61;
}

/* these float styles can be used to float images with text next to them */
.fltrt {
	float: right;
	margin-left: 8px;
}
.fltlft {
	float: left;
	margin-right: 8px;
}
.brclear { /* Use a break with this class to clear float containers on both sides */ 
clear:both; 
height:0; 
margin:0; 
font-size: 1px; 
line-height: 0; 
} 
.clearrt { /* Use a break with this class to clear float containers only on the right */ 
clear:right; 
height:0; 
margin:0; 
font-size: 1px; 
line-height: 0; 
}