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

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
	font-family: 'Droid Sans', sans-serif;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
.lista {
	margin-left: 20px;
}
.lista li {
	color: #fff;
	font-size: 16px;
	line-height: 20px;
	margin-bottom: 20px;
	list-style: decimal;
}
/* INICIO ********************************************** */

html, body {
	background: url(images/bg-master.jpg) top center #5bc5bf;
	height: 100%;
	min-height: auto;
}
.master {
	position: relative;
	width: 100%;
	height: 950px;
	min-height: auto;
}

.nav {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 5;
	width: 100%;
	height: 190px;
	background: url(images/bg-nav.png) 0 138px repeat-x;
}
.nav .title { 
	width: 990px;
	padding: 50px 0 25px 0;
	text-align: right;
	margin: 0 auto;
	position: relative;
	z-index: 1; 
}
.nav ul {
	width: 990px;
	height: 50px;
	margin: 0 auto;
	background: url(images/bg-nav.png) repeat-x;
}
.nav ul li { float: left; position: relative; }

.nav ul li a { 
	padding: 19px 10px 9px 10px;
	height: 22px;
	font-family: 'bignoodletitlingregular';
	font-size: 22px;
	text-decoration: none;
	color: #5bc5bf;
	display: block;
	border-right: 1px solid #8fa8cc;
}
.nav ul li a:hover,
.nav ul li a.active { color: #fff; } 

.nav ul li span { display: none; }
.nav ul li:hover span {
	position: absolute;
	top: -43px;
	left: 0; 
	z-index: 7;
	display: block;
	padding: 10px;
	border: 1px solid #1f3e6a; 
	background: #fff;
	color: #1f3e6a;
}
.nav ul li span a { 
	border: 0; 
	display: inline-block;
	vertical-align: middle; 
	color: #1f3e6a;  
	padding: 0;
}
.nav ul li span a:hover { color: #5bc5bf; } 
.nav ul li span img {
	position: absolute;
	bottom: -17px;
	left: 40px;
}

.top-banner {
	position: absolute;
	top: 10px;
	left: 220px;
	z-index: 7;
}


.logo {
	display: block;
	width: 152px;
	height: 112px;
	background: url(images/logo.png) no-repeat;
	position: absolute;
	top: 15px;
	left: 10px;
	z-index: 7;
}
.family {
	position: absolute;
	top: 121px;
	left: 0;
	z-index: 3;
	width: 100%;
	min-width: 990px;
	height: 588px;
	background: url(images/bg-familia.png) bottom center no-repeat;
}
.main {
	position: relative;
	z-index: 4;
	min-width: 990px;
	max-width: 1073px;
	height: 950px;
	margin: 0 auto;
}

.dark { 
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: auto;
	min-height: 100%;
	z-index: 7;
	background: url(images/opacity.png);
	display: none;
}
.layer {
	position: absolute;
	top: 10%;
	left: 50%;
	z-index: 8;
	background: #fff;
	padding: 0;
	width: 70%;
	margin: 0 0 0 -35%;
	border: 6px solid #2c5ca1;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	display: none;
}

a.bt-close,
a.bt-close2 {
	display: block;
	width: 57px;
	height: 57px;
	background: url(images/bt-close.png) no-repeat;
	position: absolute;
	top: -20px;
	right: -6px;
}
.layer h2 {
	font-family: 'bignoodletitlingregular';
	font-size: 50px;
	font-weight: normal;
	background: #2c5ca1;
	color: #fff;
	padding: 2px 25px 5px 25px;
}
.layer .text-layer { padding: 20px; overflow: hidden; }


.layer .text-layer h3 {
	font-family: 'bignoodletitlingregular';
	font-size: 57px;
	font-weight: normal;
	color: #2c5ca1;
	padding: 2px 20px 20px 0;
}
.layer .text-layer img {
	float: left;
	border: 6px solid #fff;
	margin-right: 40px;
	-webkit-box-shadow:  0px 0px 20px 5px #ccc;
	box-shadow:  0px 0px 20px 5px #ccc;
}
.layer .text-layer p {
	font-size: 21px;
	line-height: 26px;
	color: #58595b;
}
.layer h2.clear { height: 30px; }
.layer .foto-painel { display: none; }
.layer .foto-layer img,
.layer .foto-painel img {
	border: 0;
	width: 100%;
	display: block;
	-webkit-border-bottom-right-radius: 12px;
	-webkit-border-bottom-left-radius: 12px;
	-moz-border-radius-bottomright: 12px;
	-moz-border-radius-bottomleft: 12px;
	border-bottom-right-radius: 12px;
	border-bottom-left-radius: 12px;
}

a.arrow {
	display: block;
	width: 40%;
	height: 90%;
	position: absolute;
	top: 50px;
}
a.arrow span {
	display: block;
	background-image: url(images/sprite-arrow-nav.png);
	background-repeat: no-repeat;
	width: 40px;
	height: 40px;
	text-indent: -5555px;
	position: absolute;
	top: 45%;
	outline:none;
}
a.arrow.prev,
a.arrow.prev span { left: 0; background-position: 0 -80px; }
a.arrow.prev span { left: 20px; }

a.arrow.next,
a.arrow.next span { right: 0; background-position: 0 -120px; }  
a.arrow.next span { right: 20px; }

.master.orange { background: url(images/orange.gif) repeat-y top center; }
.master.acqua { background: url(images/acqua.gif) repeat-y top center; }
.master.green { background: url(images/green.gif) repeat-y top center; }
.master.blue { background: url(images/azul.gif) repeat-y top center; }
.master.green-light { background: url(images/green-light.gif) repeat-y top center; }

.content {
	width: 410px;
	height: 480px;
	position: absolute;
	top: 210px;
	left: 56px;
	overflow: auto;
	z-index: 6;
}
.thumb {
	border: 2px solid #766e5f;
	margin-right: 5px;
	margin-bottom: 5px;
}
.thumb:hover {
	border: 2px solid #fff;
}
.tooltip { position: relative; text-decoration: none; }
.tooltip:hover:after{
	color: #123048;
	background: #fff;
	content: attr(title);
	left: 0px;
	bottom: 10px;
	padding: 5px 10px;
	position: absolute;
	font-size: 10px;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	z-index: 98;
	width: 99px;
}


h1 {
	color: #fff;
	font-size: 24px;
	line-height: 26px;
	margin-bottom: 20px;
}
p {
	color: #fff;
	font-size: 16px;
	line-height: 20px;
	margin-bottom: 20px;
}
p b { color: #2c5ca1; }

p a { color: #cfd43a; text-decoration: none; }

.bco {
	font-size: 20px;
	color: #cfd43a;
	display: block; 
	margin-bottom: 20px;
	line-height: 24px;
}

.acomodacoes li{
	background: url(images/bullet.png) 0 3px no-repeat;
	padding: 0 10px 0 18px;
	font-size: 14px;
	line-height: 18px;
	color: #fff;
	margin-bottom: 15px;
}
.acomodacoes li strong {
	display: block;
	font-size: 20px;
}
.acomodacoes li a {
	display: block;
	font-size: 14px;
	color: #cfd43a;
	text-decoration: none;
}


.footer {
	position: absolute;
	top: 705px;
	left: 0;
	padding: 15px 0 20px 0;
	z-index: 5;
	width: 100%;
	min-width: 990px;
	background: #fff;
}
.footer .wrap {
	width: 990px;
	margin: 0 auto;
}
.footer span {
	position: relative;
	z-index: 2;
	display: inline-block;
	#display: inline; 
	#zoom: 1;
	padding: 20px 0 0 0;
	font-size: 16px; 
	font-weight: bold; 
	color: #2c5ca1; 
}
.footer .wrap img { 
	position: relative;
	z-index: 1;
	vertical-align: top; 
	margin-left: 5px;
	margin-right: 5px;
	height: 50px; 
}


/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-width : 481px) and (max-width : 1070px) {
	.logo {	left: 43px; }
	.content { left: 26px; }
	.family { background: url(images/bg-familia.png) 65% 0 no-repeat; }
	.layer { width: 90%; margin: 0 0 0 -45%;}
}
/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-width : 320px) and (max-width : 480px) {
	.main,
	.footer,
	.nav ul,
	.footer .wrap,
	.family,
	.title { 
		min-width: inherit;
		max-width: inherit;
		width: 100% !important; 
	}
	p {
		font-size: 14px;
	}
	.family { 
		top: 20px;
		height: 184px;
		background-size: 130%;
		background-position: 120% 0;
	}
	.logo {
		width: 78px;
		height: 59px;
		background-size: 100%;
		top: 10px;
		left: 15px;
	}
	.main {
		height: auto;
		position: relative !important;	
	}
	.nav { top: 188px; }
	.content {
		position: relative;
		width: 95%;
		height: auto;
		padding-top: 235px;
		padding-bottom: 30px;
		top: 0;
		left: 10px;
		overflow: inherit;
	}
	.thumb { width: 90px; margin: 2px; }
	.content .banner { width: 100%; }
	.nav,
	.nav ul { height: 31px; }
	.nav ul li a {
		padding: 9px 1px 0px 1px;
		height: 22px;
		font-size: 13px;
	}
	.nav .title { display: none; }
	
	.layer { width: 95%; margin: 0 0 0 -49%; }
	.layer h2 { font-size: 40px; }
	.layer img { width: 95%; display: block; margin: 0 0 20px 0; float: inherit; }
	.layer .text-layer h3 { display: block; font-size: 40px; }
	.layer .text-layer p { font-size: 16px; }
	
	.footer { 
		position: relative !important; 
		top: 0; 
		left: 0;
		text-align: center;
		height: auto;
	}
	.footer span { display: block; margin: 0; text-align: left; padding: 20px 20px 0 20px; }
	.footer img { margin-left: 0; }
}









