@charset "UTF-8";
/* CSS Document */

body, td, p, h1, h2, input, option, textarea, div {
	font-family: Arial, Helvetica, sans-serif;
	
	/* set default text size which affects <p>, <h1>, etc etc */
	font-size: 11pt;
}
		/* moved your style things here from main page. */
        .style1
        {
            color: #FFFFFF;
        }
        .style2
        {
            font-size: large;
        }
        


p, h1, h2 {
	margin:0
}
a {
	color: #330000;
	font-weight: bold;
}
img {
	border:0;
	margin: 0;
	padding: 0;
}
.clear {
	clear : both;
	padding: 0;
	margin: 0;
}
body {
	background: #ab906c;
	margin : 0px;
	padding: 0px;
	font-size:100%;
	line-height : normal;
}
#header {
	width: 700px;
	margin: 0 auto;
	height: 100px;
	background-image: url(../images/spanish-bay-header.jpg);
	background-repeat: no-repeat;
	background-position: top left;
}

#logo {
	float:left;
	width: 211px;
	height: 100px;
	background-image: url(../images/upper-left-spanish.gif);
}

#logo h1 {
	display:none;
}


/* Top Navigation */
#navi {
	width: 489px;
	float: left;
	height: 28px;
	left: 300px;
	padding: 72px 0 0 0; 
	
}

.gift {
	position: absolute;
	top: 24px;
	/* left: 750px; */
	left: 45%;
    height: 39px;
    width: 193px;
    right: 228px;
}

#navi ul {
	margin : 0px;
	padding : 0px;
	height : 28px;
	vertical-align : top;
}
#navi li {
	margin : 0px;
	padding : 0px;
	display : block;
	height : 28px;
	list-style-type : none;
	vertical-align : top;
	float : left;
}
#navi li a {
	border-style: none;
    border-color: inherit;
    border-width: 0;
    padding: 0px;
    height : 28px;
	    display : block;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
}
#navi li a:focus {
	outline: none;
}
#navi li a strong {
	display : none;
}
#navi li.rooms {
	width : 74px;
}
#navi li.rates {
	width : 118px;
}
#navi li.reservations {
	width : 97px;
}
#navi li.home {
	width : 48px;
	margin-left: 53px;
}
#navi li.contact {
	width : 99px;
}
#banner {
	margin: 0 auto;
	width: 700px;
	height: 245px;
}
#container {
	background:url(../images/bg.png);
	margin: 0 auto;
	width: 700px;
}
#container #leftCol {
	width: 265px;
	float:left;
	background: url(../images/left-arrow.png) no-repeat top left;
	z-index: 80;
}
#container #leftCol .left {
	float:left;
	margin: 48px 0px 0px 26px;
}
#container #leftCol .right {
	float:left;
	margin: 48px 0px 0px 25px;
}
#container .rightCol {
	width: 368px;
	float:left;
	padding: 16px 50px 0px 17px;
}
#container .rightCol p {
-	font-size:0.775em;
	color:#330000;
	padding: 0px 0px 10px 0px;
	line-height: 1.2em;
}
#container .rightCol p.left {
	font-size:0.7em;
	color:#330000;
	padding: 0px 0px 20px 0px;
	line-height: 1.2em;
	display: block;
	width:204px;
	float: left;
}
#container .rightCol p.right {
	font-size:0.7em;
	color:#330000;
	padding: 0px 0px 10px 0px;
	line-height: 1.2em;
	display: block;
	width:164px;
	float: left;
}
#container .rightCol h1 {
	display : block;
	height: 33px;
	margin : 0;
	padding: 0;
}
#container .rightCol h1 strong {
	display : none;
}
#container .rightCol h1.home {
	background : url(../images/titles/welcome.png) top left no-repeat;
}
#container .rightCol h1.rooms {
	background : url(../images/titles/rooms.png) top left no-repeat;
}
#container .rightCol h1.services {
	background : url(../images/titles/services.png) top left no-repeat;
}
#container .rightCol h1.rates {
	background : url(../images/titles/rates.png) top left no-repeat;
}
#container .rightCol h1.reservations {
	background : url(../images/titles/reservations.png) top left no-repeat;
}
#container .rightCol #message {
	width: 380px;
	padding: 0;
	clear: both;
	float: left;
}
#container .rightCol .roomTitle {
	float: left;
	width: 408px;
	background: #390000;
}
#container .rightCol .roomTitle p.title {
	display:block;
	float: left;
	color: #ffffff;
	width: 296px;
	padding: 10px 0 10px 10px;
}
#container .rightCol .roomTitle p strong {
	font-size: 1.1em;
	padding-right: 10px;
}
#container .rightCol .roomTitle p.rate {
	display:block;
	float: left;
	color: #ffffff;
	margin: 12px 0 8px 0;
	padding: 0 0 0 5px;
	font-size: 10px;
	border-left: 1px solid #ffffff;
}
#container .rightCol .roomTitle p.rate a {
	color: #ffffff;
	font-weight:normal;
	text-decoration: none;
}
#container .rightCol .roomTitle p.rate a:hover {
	text-decoration: underline;
}
#container .rightCol .roomTitle p {
	font-size: .775em;
}
#container .rightCol .roomPhotos {
	float: left;
	width: 388px;
	background: #c7b397;
	margin-bottom: 20px;
	padding: 15px 10px 0 10px;
}
#container .rightCol .roomPhotos p {
	clear: both;
	color: #5a4c3a;
	font-size: 0.675em;
}
#container .rightCol .roomPhotos img {
	float: left;
	display: block;
	padding: 0 6px 10px 0;
}
#footer {
	background:url(../images/footer.png) no-repeat;
	margin: 0 auto;
	width: 700px;
	height: 94px;
}
#footer p {
	display:none;
}

/* Contact Styles */
#container .rightCol fieldset {
	width:382px;
	border: 0;
	padding: 0;
	margin: 0;
}
#container .rightCol fieldset p {
	border: 0;
	padding: 0;
	margin: 0;
}
#container .rightCol fieldset legend{	
	margin:0;
}
#container .rightCol label{
	padding : 0;
	margin : 0px 0px 6px 0px;
	display:block;
	text-align:left;
	width: 150px;
}
#container .rightCol .textbox{
	width:150px;
	margin:0px 0px 5px 0px;
	border: 1px solid #5a4c3a;
	padding:1px 2px;
	clear: both;
}
#container .rightCol .select{
	margin:0px 0px 5px 0px;
	border: 1px solid #5a4c3a;
	clear: both;
}
#container .rightCol .textarea{
	width:320px;
	margin:5px 0px 20px 0px;
	border: 1px solid #5a4c3a;
	padding:1px 2px;
	float: left;
	font-size: 1em;
	display: block;
}
#container .rightCol .button {
	border: 1px solid #313131;
	background: #CCCCCC;
	float: left;
}
#container .rightCol #contactAddress {
	position:absolute;
	width:200px;
	padding: 0px 0px 0px 0px;
	text-align: left;
	z-index: auto;
	visibility: visible;
	margin: 50px 0px 0px 180px;
}
#container #rates {
	width: 410px;
	float:left;
	padding: 16px 50px 0px 17px;
	margin: 15px 0 20px -54px;
	padding: 20px 18px 20px 60px;
	z-index: 0;
	background-color: #c7b397;
}
#container #rates table {
	width: 410px;
}
#container #rates td p {
	font-size: 0.7em;
	color: #330000;
}
#container #rates td.header1 {
	width:145px;
	padding: 13px 0 13px 10px;
	background: #390000;
}
#container #rates td.header2 {
	width:125px;
	padding: 13px 0 13px 0;
	background: #390000;
}
#container #rates td.header3 {
	width:120px;
	padding: 13px 0 13px 0;
	background: #390000;
}
#container #rates td.title {
	padding: 8px 0 4px 10px;
	border-bottom: 1px solid #91826e;
	background: url(../images/title-bg.gif) no-repeat bottom left;
}
#container #rates td.title p.title {
	display:block;
	float: left;
	color: #ffffff;
	width: 280px;
	border-right: 1px solid #ffffff;
}
#container #rates td.title p.view {
	display:block;
	float: left;
	color: #ffffff;
	padding: 2px 0 0 5px;
	font-size: 9px;
}
#container #rates td.type {
	width:145px;
	padding: 10px 0 10px 10px;
	border-bottom: 1px solid #91826e;
}
#container #rates td.price1 {
	width:125px;
	padding: 10px 0 10px 10px;
	border-bottom: 1px solid #91826e;
	vertical-align: top;
}
#container #rates td.price2 {
	width:120px;
	padding: 10px 0 10px 10px;
	border-bottom: 1px solid #91826e;
	vertical-align: top;
}
#container #rates .title .view a {
	color: #FFFFFF;
	text-decoration: none;
}
#container #rates .title .view a:hover {
	text-decoration: underline;
}

/* Lightbox Style */

#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;
}

