@charset "utf-8";
/* CSS Document 
by Mario Elias 4 2009*/

body {
	font-family:Verdana, Geneva, sans-serif;
	font-size:100%;
	text-align:center;
	margin:0;
	padding:0;
	background-color: #9CF;
}

/* Globals links */
a:link, a:visited{
	color:#666;
	text-decoration:underline;
	}
a:active, a:hover {
	text-decoration:underline;
	}
#main {
	margin: 0 auto;
	text-align:left;
	width: 970px;
	background-color:#F8F8F8;
}
#container {
	margin:0 auto;
	text-align:left;
	width: 970px;
	background-image: url(../imags/bg_inside.png);
	background-repeat: repeat-y;
}

#topBanner {
	width:970px;
	height:100px;
	float:left;
	background:#FFF;
}
#topBanner h1, #topBanner h1 a{
	float:left;
	display:block;
	width:230px;
	height:90px;
	padding:0;
	margin:0;
	background-image: url(../imags/rosyMarInn_logo.png);
	background-repeat: no-repeat;
	background-position: 5px 5px;
	text-indent:-9999px;
	overflow:hidden;
}
#topBanner  ul{
	float:right;
	width:560px;
	height:53px;
	margin:0;
	padding:10px 10px 10px 30px;
	background-image: url(../imags/bg_topMain.png);
	background-repeat: no-repeat;
	background-position: 0px -20px;
	list-style:none;
}
#topBanner  ul li, #topBanner  ul li a {
	display: block;
	position: relative;
	float:left;
	margin:0 5px;
	padding:0;
	font-size:11px;
	color:#333;
	text-decoration:none;
}
#topBanner li ul, #topBanner ul li li ul a { /* second-level lists */
	display: none;
	position: absolute;
	float:none;
	top: 1em;
	left: 0;
	width:110px;
	height:10px;
	padding:0;
	background-image:none;
	line-height:11px,
}
#topBanner  a:hover, #topBanner  li:active {
	color:#FFF;
	text-decoration:underline;
}
#topBanner li:hover ul, #topBanner li.over ul, #topBanner li.over ul a{ /* lists nested under hovered list items */
	display: block;
}
#nav {
	float:left;
	width:970px;
	height:20px;
	background-color:#DFE6FF;
	margin:0 auto;
	padding:0;
}
#nav ul {
	margin:0;
	padding:0;
	list-style:none;
}

#nav li{ /*  cure for IE5.x  */
	float:left;
}
#nav li a {
	margin: 0;
	padding:2px 29px;
	font-size:15px;
	color:#FFF;
	border: 1px solid #FFF;
	background-color: #00A4D1;
	background-image: url(../imags/btn_topLeft.png);
	background-repeat: no-repeat;
	background-position: right top;
	text-decoration:none;
}
#nav li a:hover, #nav li:active {
	text-decoration:underline;
}
#contentArea {
	float:left;
	margin: 0;
	padding-right:10px;
	text-align:left;
	width: 650px;
	background-color: #FFF;
}
	
#contentArea h1 {
	font-size:36px;
	color:#00A4D1;
	padding: 20px 0 20px 20px;
	text-transform: uppercase;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
#contentArea h2 {
	font-size:14px;
	color:#333;
	padding: 0px 0 20px 25px;
	text-transform: none;
}
#contentArea h3 {
	font-size:13px;
	color:#000;
	padding: 20px 0 0 30px;
	text-transform: none;
}
#contentArea p {
	font-size:12px;
	color:#666;
	padding: 0 0 0 30px;
	line-height:25px;
	text-transform: none;
	text-align: justify;
}

#contentArea ul {
	margin:0;
	padding:0;
}
#contentArea ul li {
	font-size:12px;
	color:#666;
	line-height:25px;
	text-transform: none;
	list-style-position:outside;
	list-style-image: url(../imags/list.gif);
	text-indent: 2px;
	margin-left:100px;
}
#contentArea ul li ul li{
	list-style-image:none;
	list-style-type:square;
	text-indent: 1px;
	margin-left:40px;
}

#contentArea ol li {
	font-size:12px;
	color:#666;
	line-height:25px;
	text-transform: none;
	text-indent: 2px;
	margin-left:15px;
}
.rightColumn {
	width: 250px;
	background-color:#F8F8F8;
	float:right;
}
.rightColumn h3 {
	font-size: 14px;
	margin:5px;
	text-decoration: none;
}
blockquote {
	margin: 0px 5px 0 0;
	padding: 50px 0 0 10px;
}
.quote {
	font-size:12px;
	background:transparent url(../imags/quotes.gif) no-repeat scroll left top;
	left:-5px;
	padding:50px 0 0 0;
}


.rightColumn ul li {
	font-size:12px;
	list-style-image:none;
	list-style-type:none;
	text-indent: 0px;
	font-weight: bold;
}

.rightColumn ul li ul li{
	list-style-type:square;
	font-weight: normal;
}
cite {
	font-size:12px;
background:transparent url(../imags/quotes.gif) no-repeat scroll right bottom;
color:#999999;
display:block;
padding:7px 0 23px;
}
cite span {
	font-size:9px;
	line-height:13px;
	display:block;
}

.addBanner {
	float:left;
	width:542px;
	height:298px;
	margin:5px 10px 0 5px;
	padding:0;
	background-image: url(../imags/addBanner.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}
#homepage form {
	display:block;
	float:right;
	width:403px;
	height:298px;
	padding: 0;
	margin: 5px 5px 0 5px;
	background-color:#F0EDEE;
}
#homepage form h2 {
	width:403px;
	height:25px;
	overflow:hidden;
	padding:0;
	margin:0;
	background-image: url(../imags/bg_formTabTop.png);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	text-indent:-9999px;
}
#homepage form p {
	font-size:12px;
	margin:0 0 10px 0;
}
form div {
	margin: 0 0 6px 0;
}


form label {
	display:block;
	float:left;
	width:150px;
	text-align:right;
	font-size:12px;
	font-weight:bold;
	color:#000;
	margin: 0 5px;
}
.right{
	padding-left:100px;
	color:#C00;
	margin: 0;
}
form div.action {
	margin-left:150px;
	padding-left: 12px;
	
}
form#frmQuestionnaire {
	width:640px;
}

#frmQuestionnaire p{
	text-align:right;
	padding:0;
	margin:0;
	
}

#lowerBox {
	clear:both;
	width:970px;
	height:200px;
	margin:0;
	padding:0;
	background-image: url(../imags/bg_button.png);
	background-repeat: no-repeat;
	background-position: 0 70px;
}
#lowerBox h3 {
	height: 15px;
	font-size:12px;
	color: #FFF;
	background-color: #000;
	padding: 5px;

}
#lowerBox p { /*paragraph will not show for layout purpose*/
	text-indent:-9999px;
}

.restaurant {
	float:left;
	width:256px;
	margin:0 0 0 5px; /* 5 pixel left*/

}
.services {
	float:left;
	width:256px;
	margin:0 0 0 10px; /* 10 pixel left*/
}
.special {
	float:right;
	width:393px;
	margin:0 5px 0 0;  /* 5 pixel right*/
}
.restaurantBanner {
	float:left;
	width:266px;
	height: 152px;
	overflow:hidden;
	padding: 0;
	margin: 0 0 0 5px;
	z-index:1; /*The higher a z-index value is, the more likely it will be on top when the page displays . top-most element*/
	background-image:url(../imags/restaurant.jpg); /*image will replace the p tag*/
	background-position:0 0;
	background-repeat:no-repeat;
}
.servicesBanner {
	float:left;
	width:266px;
	height: 152px;
	overflow:hidden;
	padding: 0;
	margin: 0 0 0 10px;
	z-index:1; 
	background-image:url(../imags/services.jpg); /*image will replace the p tag*/
	background-position:0 0;
	background-repeat:no-repeat;
}

.specialBanner {
	float:right;
	width:403px;
	height: 152px;
	overflow:hidden;
	padding: 0;
	margin: 0 5px;
	z-index:1; 
	background-image:url(../imags/special.jpg); /*image will replace the p tag*/
	background-position:0 0;
	background-repeat:no-repeat;
}
#footer {
	clear:both;
	width:970px;
	height:30px;
	line-height:40px;
	font-size:11px;
	text-align:right;
	padding:0 0 20px 0;
	background-image: url(../imags/bg_footer.png);
	background-repeat: no-repeat;
	background-color: #9CF;
}
#footer p {
	float:left;
	padding:0 0 0 15px;
	margin:0;
	font-size:9px;
	color:#444;
}
#footer ul {
	padding:0;
	margin:0;
	list-style:none;
}
#footer ul li {
	float:right;
	margin-right:10px;
}
#footer ul li a {
	font-size:9px;
	color:#048;
	text-decoration:underline;
}

.ingRight {
	float:right;
	margin:10px;
	border:0;
	padding-left:10px;
}

.ingLeft{
	float:left;
	margin:10px;
	border:0;
	padding-right:10px
}

/* ajax */
#thank_you {
	display:none;
	float:right;
	width:403px;
	height:298px;
	padding: 0;
	margin: 5px 5px 0 5px;
	background-color:#F0EDEE;
	}
#thank_you h2 {
	font-size:18px;
	padding-left:70px;
}
#thank_you p {
	font-size:12px;
	padding:5px;
}
#thank_you p.wpadding {
	display:block;
	padding:0 10px 10px 80px;
}

/* jquery tabs css starts here! Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .tabs-nav {
        display: none;
    }
}

/* Skin */
.tabs-nav {
    list-style: none;
    margin: 0;
    padding: 0 0 0 4px;
}
.tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
#contentArea .tabs-nav li {
    float: left;
    margin: 0 0 0 1px;
    min-width: 84px; /* be nice to Opera */
	list-style-image:none;

}

.tabs-nav a, .tabs-nav a span {
    display: block;
    padding: 0 10px;
    background: url(../imags/tab.png) no-repeat;
	font-size:12px;
	color:#666;
	line-height:10px;
	text-indent: 5px;
	margin-left:5px;
}
.tabs-nav a {
    position: relative;
    top: 1px;
    z-index: 2;
    padding-left: 0;
    color: #27537a;
    font-size: 12px;
    font-weight: bold;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    white-space: nowrap; /* required in IE 6 */    
}
.tabs-nav .tabs-selected a {
    color: #000;
}
.tabs-nav .tabs-selected a, .tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active {
    background-position: 100% -150px;
    outline: 0; /* prevent dotted border in Firefox */
}
.tabs-nav a, .tabs-nav .tabs-disabled a:hover, .tabs-nav .tabs-disabled a:focus, .tabs-nav .tabs-disabled a:active {
    background-position: 100% -100px;
}
.tabs-nav a span {
    width: 64px; /* IE 6 treats width as min-width */
    min-width: 64px;
    height: 18px; /* IE 6 treats height as min-height */
    min-height: 18px;
    padding-top: 6px;
    padding-right: 0;
}
*>.tabs-nav a span { /* hide from IE 6 */
    width: auto;
    height: auto;
}
.tabs-nav .tabs-selected a span {
    padding-top: 7px;
}
.tabs-nav .tabs-selected a span, .tabs-nav a:hover span, .tabs-nav a:focus span, .tabs-nav a:active span {
    background-position: 0 -50px;
}
.tabs-nav a span, .tabs-nav .tabs-disabled a:hover span, .tabs-nav .tabs-disabled a:focus span, .tabs-nav .tabs-disabled a:active span {
    background-position: 0 0;
}
.tabs-nav .tabs-selected a:link, .tabs-nav .tabs-selected a:visited, .tabs-nav .tabs-disabled a:link, .tabs-nav .tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
.tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
.tabs-nav .tabs-disabled {
    opacity: .4;
}
.tabs-container {
    border-top: 1px solid #97a5b0;
    padding: 1em 8px;
    background: #fff; /* declare background color for container to avoid distorted fonts in IE while fading */
}
.tabs-loading em {
    padding: 0 0 0 20px;
    background: url(loading.gif) no-repeat 0 50%;
}
.googleMap {
	margin: 0 15px;
	padding:0;
	border:none;
}
/*
Photo of Praia and Surrounding
*/
div.pitureBox{
	display:block;
	float:left;
	width:200px;
	margin: 2px, 5px;
	padding: 2px;
}

#contentArea #container-1 div.pitureBox p.caption{
	font-size:9px;
	text-align:left;
	line-height:12px;
	display:block;
	width:190px;
}
#contentArea #container-1 #fragment-2 BR {
	clear: left;

}
/*
Tabs - additional IE specific bug fixes

Recommended usage (Conditional Comments):
<!--[if lte IE 7]>
<link rel="stylesheet" href="tabs_ie.css" type="text/css" media="projection, screen" />
<![endif]-->

*/
.tabs-nav { /* auto clear */
    display: inline-block;
}
.tabs-nav .tabs-disabled {
    position: relative; /* fixes opacity */
}
.tabs-nav .tabs-disabled a span {
    _height: 19px; /* for some reason the height is 1px to less with opacity... */
    min-height: 19px; /* ...in both IE 6 and 7 */
}