/* --------------------------------------------------------------------------------
   CSS : Apartaments Unio 2008
   -
   by Kings of Mambo / www.kingsofmambo.com
-------------------------------------------------------------------------------- */



/* -----------------------------------*/
/* ---------->>> GLOBAL <<<-----------*/
/* -----------------------------------*/

body {
	font-size: 62.5%; /* Resets 1em to 10px */
	font-family: Helvetica, Arial, 'Lucida Grande', Verdana, Sans-Serif;
	text-align: center;
	margin: 0;
	background: #fff url('../images/floor_bg.jpg') 0 0 repeat;
}

h1 {
	font-size: 36px;
	margin: 0 0 15px 0;
	height: 36px;
}
	
h2 {
	clear: both;
	font-size: 28px;
	margin: 20px 0 10px 0;
	height: 28px;
}

h3 {
	color: #000;
	font-size: 22px;
	height: 22px;
	margin: 15px 0 10px 0;
}

h4 {
	font-size: 14px;
	margin: 30px 0 0 0;
	color: #666;
}

strong {
	font-weight: bold;
}

.left {
	float: left;
}

.right {
	float: right;
}

p {
	color: #333;
	margin: 0 0 5px 0;
	font-size: 1.2em;
	line-height: 1.4em;
}

sup {
	font-size: 7px;
	font-weight: bold;
	margin: 0 0 0 1px;
	vertical-align: super;
}

/* ----------------------------------------*/
/* ---------->>> Link Styles <<<-----------*/
/* ----------------------------------------*/

a {
	color: #333;	
}

a:focus, a:hover, a:active {
	text-decoration: underline;
}

/* ---------------------------------------------*/
/* ---------->>> Structure Styles <<<-----------*/
/* ---------------------------------------------*/

#wrapper {
	background: #fff;
	margin: 0 auto;
	width: 720px;
	padding: 0;
	overflow: auto;
	text-align: left;
}

#main_col {
	clear: both;
	width: 455px;
	margin: 0 0 15px 15px;
	display: inline;
	overflow: hidden;
}

#right_col {
	width: 220px;
	margin: 0 0 15px 15px;
	float: left;
	overflow: hidden;
}

/* ---------->>> Form Styles <<<-----------*/

.txt_input {
	border: 1px solid #dedede;
	background: #f3f3f3;
	padding: 3px;
	color: #444;
}

div.row {
	clear: both;
	width: 455px;
	overflow: auto;
	margin: 0 0 3px 0;
}

div.label {
	float: left;
	text-align: right;
	width: 140px;
	font-weight: bold;
	overflow: hidden;
	height: 20px;
	margin: 0 10px 0 0;
}

div.label p {
	line-height: 22px;
}

div.user_info {
	float: left;
	width: 303px;
	margin: 0;
}

/* ---------->>> Header Styles <<<-----------*/

#header {
	padding: 15px;
	width: 690px;
	height: 220px;
	overflow: hidden;
}

.square_box {
	float: left;
	width: 220px;
	height: 220px;
	margin: 0 15px 0 0;
}

#logo_box {
	background: #c48fc4;
	padding: 0;
}

#logo_box a {
	display: block;
	width: 172px;
	height: 81px;
	background: url('../images/apartaments_logo.gif') 0 0 no-repeat;
	text-indent: -9999px;
	margin: 120px 0 0 15px;
}


/* ---------->>> Navigation Styles <<<-----------*/

#nav {
	background: #cdf372;
}

#lang {
	margin: 0;
	background: #a2d2ed;
}

#header ul {
	margin: 80px 10px 0 10px;
}

#header ul li {
	display: block;
	height: 18px;
}

#header ul li a {
	display: block;
	height: 18px;
	font-size: 11px;
	line-height: 18px;
	font-weight: bold;
	padding: 0 0 0 15px;
}

#header #nav ul li a {
	color: #748844;
	background: url('../images/green_arrow.gif') 5px 5px no-repeat;
}

#header #lang ul li a {
	color: #496b7e;
	background: url('../images/blue_arrow.gif') 5px 5px no-repeat;
}

#header #nav ul li a:hover,
#header #lang ul li a:hover {
	text-decoration: none;
}

#header #nav ul li a:hover {
	background: #bfe36a url('../images/green_arrow.gif') 6px 5px no-repeat;
}

#header #lang ul li a:hover {
	background: #8ebad2 url('../images/blue_arrow.gif') 6px 5px no-repeat;
}

/* ---------->>> END Navigation Styles <<<-----------*/

/* ---------->>> END Header Styles <<<-----------*/

#right_col img {
	margin: 0 0 15px 0;
}

#right_col img.last_box {
	margin: 0;
}

#book {
	background: #ededed;
	width: 455px;
	overflow: hidden;
	margin: 10px 0 0 0;
}

#book li {
	display: block;
	overflow: auto;
	width: 100%;
	padding: 10px;
}

#book li.first {
	border-bottom: 1px solid #c6c6c6;
}

#book li p {
	width: 300px;
	padding: 0 20px 0 0;
	float: left;
}

#book li a {
	display: block;
	color: #fff;
	float: left;
	width: 117px;
	height: 23px;
	line-height: 23px;
	background: url('../images/blue_btn.gif') 0 0 no-repeat;
	text-align: center;
	font-weight: bold;
}

#book li a:hover {
	text-decoration: none;
	background: url('../images/blue_btn.gif') 0 -23px no-repeat;
}

ul.services {
	background: #ededed;
	float: left;
	display: block;
	width: 223px;
	padding: 15px 0;
	margin: 0 0 10px 0;
}

ul.services li {
	background: url('../images/gray_arrow.gif') 0 6px no-repeat;
	padding: 0 0 0 10px;
	margin: 0 0 0 10px;
	line-height: 18px;
}

.home_img {
	margin: 20px 10px 0 0;
	clear: both;
}

.last_box {
	margin: 0;
}


/* ----------------------------------------------*/
/* ---------->>> Apartments Styles <<<-----------*/
/* ----------------------------------------------*/

table {
	width: 100%;
	text-align: center;
	font-size: 10px;
	background: #f3f3f3;
	line-height: 13px;
	color: #535353;
	margin: 15px 0 0 0;
}

table th {
	background: #a6a5a5;
	text-align: center;
	vertical-align: middle;
	padding: 5px 0;
	font-size: 11px;
	color: #fff;
	font-weight: bold;
}

table tr {
	
}

table td {
	text-align: center;
	vertical-align: middle;
	padding: 5px 0;
	font-size: 10px;
	border-bottom: 1px solid #c6c6c6;
}

table .first {
	width: 50px;
	text-align: right;
	font-size: 11px;
}

table .first a {
	font-weight: bold;
}

table tr.last td {
	border-bottom: none;
}

#right_col h2.first {
	margin: 5px 0 5px 0;
}

#right_col ul.services {
	float: none;
	background: none;
	margin: 0;
	width: auto;
}

#right_col ul.services li {
	margin: 0;
}

ul.subnav {
	margin: 10px 0;
}

ul.subnav li {
	display: inline;
	margin: 0;
}

ul.subnav li a {
	font-weight: bold;
	font-size: 12px;
}

ul.subnav li a:hover {
	text-decoration: none;
}
ul.subnav li.active a{
		border-bottom: 2px solid #c48fc4;
}

ul.subnav li a.active {
	border-bottom: 2px solid #c48fc4;
}

#gallery_container {
	overflow: auto;
}

#gallery_container a {
	float: left;
	display: block;
	margin: 0 10px 10px 0;
}

#gallery_container a.last {
	margin: 0 0 10px 0;
}


#book_online {
	background: #ededed;
	padding: 10px;
}

#right_col #book_online {
	margin-bottom: 10px;
}

.book_online_btn {
	display: block;
	color: #fff;
	width: 117px;
	height: 23px;
	line-height: 23px;
	background: url('../images/blue_btn.gif') 0 0 no-repeat;
	text-align: center;
	font-weight: bold;
	margin: 10px 0 0 310px;
}

.book_online_btn {
	margin: 10px 0 0 0;
}



/* -----------------------------------------------*/
/* ---------->>> Reservation Styles <<<-----------*/
/* -----------------------------------------------*/

#reservation .user_info .txt_input {
	width: 270px;
}

#reservation .user_info .calendar {
	width: 160px;
}

#reservation .form_alert p {
	margin: 10px 0;
	color: red;
}

#nights {
	border: 1px solid red;
}

#reservation .submit {
	display: block;
	color: #fff;
	width: 117px;
	height: 23px;
	background: url('../images/blue_btn.gif') 0 0 no-repeat;
	text-align: center;
	font-weight: bold;
	margin: 10px 0 0 310px;
	border: 0;
	cursor: pointer;
}

#reservation .submit:hover {
	text-decoration: none;
	background: url('../images/blue_btn.gif') 0 -23px no-repeat;
}

#nights {
	float: left;
	width: 160px;
	margin: 0;
	border: 1px solid #dedede;
	font-weight: bold;
	background: #f3f3f3;
	padding: 3px;
	color: #6B0000;
}

#comments {
	height: 140px;
}

.margin_top {
  padding-top: 10px;
}

#nights {
  height: 14px;
}

div.special_high {
  height: auto;
}

div.special_high p {
  line-height: 1;
  padding: 3px 0 0 0;
}


/* -------------------------------------------*/
/* ---------->>> Contact Styles <<<-----------*/
/* -------------------------------------------*/

.green {
	background: #2db457;
	color: #fff;
	padding: 2px;
	font-weight: bold;
	font-size: 10px;
}

.red {
	background: #e92734;
	color: #fff;
	padding: 2px;
	font-weight: bold;
	font-size: 10px;
}

#map {

	height: 300px;
}

#contact {
	overflow: hidden;
	width: 220px;
}

#contact .txt_input {
	width: 212px;
	margin: 0 0 5px 0;
}

#contact .submit {
	display: block;
	color: #fff;
	float: right;
	width: 117px;
	height: 23px;
	line-height: 23px;
	background: url('../images/blue_btn.gif') 0 0 no-repeat;
	text-align: center;
	font-weight: bold;
	xmargin: 10px 0 0 100px;
}

#contact .submit:hover {
	text-decoration: none;
	background: url('../images/blue_btn.gif') 0 -23px no-repeat;
}

ul.links {
	list-style-type: disc;
}

ul.links li {
	padding: 3px 10px;
	list-style-type: disc;
	list-style-position: inside;
}

ul.links li a {
	font-size: 12px;
}


/* Success, notice and error boxes
-------------------------------------------------------------- */

.reserve_error,
.notice, 
.success    { padding: .8em; margin-bottom: 1em; border: 2px solid #ddd; margin: 10px 0; }

.reserve_error { background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4; }
.reserve_error p {color: #8a1f11; font-weight: bold; font-size: 14px;}

.reserve_error ul {
  margin: 0 0 0 20px;
}

.reserve_error ul li {
  padding: 5px 0 5px 0px;
  font-size: 12px;
  list-style: disc;
}




/* ------------------------------------------*/
/* ---------->>> Footer Styles <<<-----------*/
/* ------------------------------------------*/

#footer {
	clear: both;
	width: 690px;
	padding: 15px;
	overflow: hidden;
	margin: 0;
}

#footer .square_box {
	background: #cccccc url('../images/fuchsia_bg.gif') 0 bottom repeat-x;
	height: 75px;
}

#footer .middle_box {
	background: #999 url('../images/lime_bg.gif') 0 bottom repeat-x;
}

#footer .last_box {
	background: #666 url('../images/blue_bg.gif') 0 bottom repeat-x;
}

#footer .last_box p {
	color: #99ccff;
	font-size: 10px;
	margin: 10px 0 0 10px;
}

#footer .last_box p a {
	color: #99ccff;
	text-decoration: underline;
}



/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h1 {
	visibility: hidden;
}

.sIFR-hasFlash h2 {
	visibility: hidden;
	letter-spacing: -9px;
}

.sIFR-hasFlash h3 {
	visibility: hidden;
	letter-spacing: -9px;
}

.sIFR-hasFlash h5#pullquote {
	letter-spacing: -4px;
	visibility: hidden;
	font-size: 24px;
}

/* Lightbox styles */

#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; }