@charset "UTF-8";
/* CSS Document */

body {
	background-image:url(../images/page-bg.jpg);
	background-position:center top;
	background-repeat:no-repeat;
	background-color:#3b100b;
	margin:0}

#container {
	margin:auto;
	width:940px;}

#header {
	float:left;
	width:940px;
	height:160px;
	background-image:url(../images/header-bg.png);
	background-position:center;
	background-repeat:no-repeat;}

#header .logo {
	float:left;
	background-image:url(../images/logo.png);
	width:420px;
	height:65px;
	margin-top:54px;
	margin-left:35px;}

#header .cta-btn {
	float:left;
	height:115px;
	width:303px;
	margin-top:26px;
	margin-left:80px;}

#header .cta-btn a {
	background-image:url(../images/ctn-btn-bg.png);
	background-repeat:no-repeat;
	background-position:left;
	margin:0 0 0 0;}

#header .cta-btn a:hover {
	background-position:-303px;}

#header .cta-btn img {
	margin-top:20px;
	margin-left:15px;}

#content {
	float:left;
	width:940px;
	height:524px;
	background-image:url(../images/content-bg.png);
	background-position:center;
	background-repeat:no-repeat;}

#content .welcome-text {
	float:left;
	width:380px;
	margin-left:70px;
	margin-top:30px;}

#content .welcome-text h2 {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:14px;
	font-style:italic;
	font-weight:normal;
	color:#8e181b;
	margin-top:0px;
	margin-bottom:20px;}

#content .welcome-text p {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:14px;
	font-weight:normal;
	color:#5f2018;
	line-height:22px;}

#content .main-img {
	float:right;
	width:425px;
	height:310px;
	background-image:url(../images/main-img-bg.png)	;
	background-repeat:no-repeat;
	margin-right:35px;
	margin-top:20px;}

#content .main-img img {
	margin-left:23px;
	margin-top:17px;}

#content .amenities {
	float:left;
	width:900px;
	margin-left:70px;
	margin-top:-25px;}

#content .amenities h2 {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:14px;
	font-style:italic;
	font-weight:normal;
	color:#f4e3c5;
	margin-top:-3px;
	margin-left:10px;
	margin-bottom:20px;}

#content .amenities ul {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:13px;
	font-weight:normal;
	color:#f4e3c5;
	line-height:30px;
	height:80px;
	margin:0 0 0 0} 

#content .amenities ul li {
	float:left;
	width:295px;
	margin-left:-16px;}

#gallery {
	float:left;
	width:940px;
	height:335px;
	background-image:url(../images/gallery-bg.png);
	background-position:center;
	background-repeat:no-repeat;}

#gallery .title {
	float:left;
	margin-left:70px;
	margin-top:30px;}

#gallery .click {
	float:right;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:12px;
	font-style:italic;
	font-weight:normal;
	color:#b5a079;
	margin-top:45px;
	margin-right:80px;}

#gallery .slider {
	float:left;
	margin-left:43px;
	margin-top:25px;}

#gallery .photo {
	background-image:url(../images/gallery-photo-bg.png);
	width:221px;
	height:156px;
	margin-left:13px;
	margin-right:13px;}

#gallery .slider .edge-left {
	float:left;
	background-image:url(../images/gallery-scrollable-bg.gif);
	background-repeat:repeat-y;
	width:2px;
	height:170px;
	margin-top:-8px;}

#gallery .slider .edge-right {
	float:left;
	background-image:url(../images/gallery-scrollable-bg.gif);
	background-position:1px 0;
	background-repeat:repeat-y;
	background-color:#FFF;
	width:2px;
	height:170px;
	margin-top:-8px;}

/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable {

	/* required settings */
	position:relative;
	overflow:hidden;
	width: 780px;
	height:177px;
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
.scrollable .items {
	/* this cannot be too large */
	width:40000em;
	position:absolute;
	clear:both;
}

.items div {
	float:left;
	width:780px;
	margin-left:19px;
}

/* single scrollable item */
.scrollable img {
	float:left;
	margin:7px 0 0 9px;
	background-color:#fff;
	border:1px solid #fff;
	width:201px;
	height:136px;
}

/* active item */
.scrollable .active {
	border:2px solid #000;
	position:relative;
	cursor:default;
}

/* this makes it possible to add next button beside scrollable */
.scrollable {
	float:left;	
}

/* prev, next, prevPage and nextPage buttons */
a.browse {
	background:url(../images/slider-tab-btn.png) no-repeat;
	display:block;
	width:34px;
	height:46px;
	float:left;
	margin:52px 0px;
	cursor:pointer;
	font-size:1px;
}

/* right */
a.right 				{ background-position: -102px 0; clear:right; margin-right: 0px;}
a.right:hover 		{ background-position:-68px 0; }
a.right:active 	{ background-position:-68px 0; } 


/* left */
a.left				{ margin-left: 0px; } 
a.left:hover  		{ background-position:-34px 0; }
a.left:active  	{ background-position:0 0; }

/* up and down */
a.up, a.down		{ 
	background:url(../img/scrollable/arrow/vert_large.png) no-repeat; 
	float: none;
	margin: 10px 50px;
}

/* up */
a.up:hover  		{ background-position:-30px 0; }
a.up:active  		{ background-position:-60px 0; }

/* down */
a.down 				{ background-position: 0 -30px; }
a.down:hover  		{ background-position:-30px -30px; }
a.down:active  	{ background-position:-60px -30px; } 


/* disabled navigational button */
a.disabled {
	visibility:visible !important;		
}

/* position and dimensions of the navigator */
.navi {
	margin-left:378px;
	width:200px;
	height:20px;
}


/* items inside navigator */
.navi a {
	width:15px;
	height:15px;
	float:left;
	margin:3px;
	background:url(../images/slider-nav-btn.png) 0 0 no-repeat;
	display:block;
	font-size:1px;
}

/* mouseover state */
.navi a:hover {
	background-position:-30px 0;      
}

/* active state (current page state) */
.navi a.active {
	background-position:-15px 0;     
}

#footer {
	float:left;
	width:940px;
	height:318px;
	background-image:url(../images/footer-bg.png);
	background-position:center top;
	background-repeat:no-repeat;
	padding-bottom:80px;}

#footer .contact {
	float:left;
	width:900px;
	margin-left:70px;
	margin-top:25px;}

#footer .contact .info {
	float:left;}

#footer .contact h2 {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:14px;
	font-style:italic;
	font-weight:normal;
	color:#f4e3c5;
	margin-top:5px;
	margin-left:10px;
	margin-bottom:20px;}
	
#footer .contact p {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:14px;
	font-weight:normal;
	color:#f4e3c5;
	line-height:22px;
	margin-left:10px;}

#footer .contact p strong {
	display:block;
	font-weight:bold;
	font-size:22px;
	margin-top:8px;
	margin-bottom:-10px;
	width:200px;}

#footer .contact p a {
	font-size:18px;
	color:#a62008;
	text-decoration:none;}

#footer .contact p a:hover {
	font-size:18px;
	color:#a62008;
	text-decoration:underline;}

#footer .contact .map {
	float:right;
	width:460px;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:14px;
	font-weight:normal;
	color:#f4e3c5;
	line-height:22px;
	margin-right:95px;
	margin-top:25px;}

#footer .contact .map strong {
	font-weight:bold;
	display:block;
	margin-top:5px;
	margin-bottom:5px;}

#footer .contact .map emphasis {
	font-style:italic;}

#footer .contact .map a {
	color:#a62008;
	text-decoration:none;}

#footer .contact .map a:hover {
	color:#a62008;
	text-decoration:underline;}

#footer .credits {
	float:left;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:12px;
	font-style:italic;
	font-weight:normal;
	color:#b5a079;
	margin-top:70px;
	margin-left:365px;}

#footer .credits a {
	text-decoration:none;
	color:#b5a079;}

#footer .credits a:hover {
	text-decoration:none;
	color:#5f2018;}