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

::selection {color:#FFF; background-color:#FFC24A;}
-moz-::selection {color:#FFF; background-color:#FFC24A;}
-webkit-::selection {color:#FFF; background-color:#FFC24A;}
-ms-::selection {color:#FFF; background-color:#FFC24A;}

.clearfix:after {
	content:"";
	display:table;
	clear:both;
}

/* Preloader */

#preloader {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#FFF; /* change if the mask should have another color then white */
    z-index:9999; /* makes sure it stays on top */
	width:100%;
	height:100%;
}

#status {
    width:100px;
    height:175px;
    position:absolute;
    left:50%; /* centers the loading animation horizontally one the screen */
    top:50%; /* centers the loading animation vertically one the screen */
    background-image: url(../imagens/pre-load.gif); /* path to your loading animation */
    background-repeat:no-repeat;
    background-position:center;
		background-size: 100%;
    margin:-50px 0 0 -67px; /* is width and height divided by two */
}


a, a:hover, a:active, a:focus{
	outline: 0;
}

body{
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	background-color: #FFF;
	font-size: 14px;
	height:100%;
	color: #A69681;
	-webkit-font-smoothing:antialiased;
}

img{
  user-drag: none;
  -moz-user-select: none;
  -webkit-user-drag: none;
 }

small{
	font-weight: 900;
}

h2{
	font-weight: 400;
	font-size: 1.3em;
	text-align: center;
	margin-bottom: 0px;
}

h3{
	font-weight: 400;
	font-size: 0.9em;
	margin-bottom: 0px;
	text-transform: uppercase;
	letter-spacing:0.2em;
}



ul, li {
	list-style: none;
}


.bold{
	font-family: 'Lato', sans-serif;
	font-weight: 700;
}

a {
	color: inherit;
	text-decoration:none;
	cursor: pointer;
}

a:visited{
	color: inherit;
}

.preload{
	display:none;
}

figure img{
	max-width: 100%;  display: block;;
}


.coluna1{
	position: relative;
	width: 49%;
	margin-right: 2%;
	float: left
}

.coluna2{
	position: relative;
	width: 49%;
	float: left
}


/*
 * LINGUAS
 */

#linguas{position: absolute; top: 0; left: 0; background: #6BB5B3; z-index: 1000;width: 100%; height: 20px; color: #FFF; font-size: 0.8em; 	font-weight:600;}
#linguas ul{margin: 0; padding: 0; position: absolute; right: 0; height: 18px; width: 200px; z-index: 200;  top:50%; margin-top: -9px;}
#linguas ul li{display: inline-block; margin-right: 20px;}
#linguas ul li a{opacity: 0.3; color: #000;
	-webkit-transition:all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out;
}
#linguas ul li a:hover{opacity: 1; color: #fff;}
#linguas ul li .ativo{opacity: 1; color:#fff}

/*
 * MENU
 */

.mobile{
	display: none;
	width: 90%;
	height: 70px;
	position: relative;
	margin: 0 auto;
}


.drop{
	display:none;
	color: #6BB5B3;
	position: fixed; width: 100%;
	height: 270px;
	top: -250px; background: #FFF; z-index: 900;
}

.drop .menu{
	position: absolute;
	padding: 0;
	margin-top: 40px;
	width: 100%;
	height: auto;
}

.drop .menu li{
	margin-bottom: 10px;
}

.botaomenu{
	display:none;
	width: 60px; height:60px;
	background: #CC3;
	float: right;
	margin-top: 5px;
	cursor: pointer;
}

.botaomenu:active{
	opacity: 0.5;
}

header{
	top: 20px;
	width: 100%;
	height: 70px;
	background: #FFF;
	position: absolute;
	color: #6BB5B3;
	z-index: 1000;
	font-size: 1.1em;
	box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.5);
	-moz-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.5);
	-ms-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.5);
	-webkit-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.5);
	-o-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.5);
}

.desktop{
	width: 95%; height: 70px;margin: 0 auto; min-width: 700px;  max-width: 1150px;  font-size: 1.0em; position: relative;
}

.logo {
	position: absolute;
	width: 130px; height: 50px;
	top: 50%; margin-top: -25px;
	background: url(../imagens/logo-header.svg) no-repeat;
	-webkit-transition:all 0.15s ease-out;
	-moz-transition:all 0.15s ease-out;
	transition:all 0.15s ease-out;}

.logo:hover{
	opacity: 0.8;
}


.desktop  .menu{
	position: absolute;
	padding: 0;
	width: 490px;
	height: 20px;
	left: 50%; margin-left: -190px;
	top: 50%; margin-top: -10px;
}

.desktop .menu li{
	display: inline-block; height: 20px; margin-right: 2px;
}

.desktop .menu li:nth-child(even){
	opacity: 0.5;
}

.desktop .menu li a{
	-webkit-transition:all 0.15s ease-out;
	-moz-transition:all 0.15s ease-out;
	transition:all 0.15s ease-out;
}

.desktop .menu li a:hover{
	color: #FFB440;
}


.atual{
	border-bottom:solid 2px #FFB440 ;
}

.sociais{
	position: absolute; right:0; padding: 0;margin-top: 18px;
}

.sociais ul{
	margin: 0; padding: 0;
}

.sociais li{
	margin-right:5px; float: left;
}

.sociais li a{
	display: block;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: solid 1px #6BB5B3; height: 30px;
	background-repeat: no-repeat;
	background-size: 100%;
}

.face-icon, .twit-icon, .insta-icon{
	-webkit-transition:all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out;
}

.face-icon{
	background: url('../imagens/social/face.svg');
}

.twit-icon{
	background: url('../imagens/social/twitter.svg');
}

.insta-icon{
	background: url('../imagens/social/insta.svg');
}

.face-icon:hover, .twit-icon:hover, .insta-icon:hover{
	background-position: 0 100%;
}


#drop-casas{
	display: none;
	position: absolute;
	width: 100%;
	height: 60px;
	top: 90px; left:0;
	background: #fff;
	z-index: 900;
	border-bottom: solid 1px rgb(231, 231, 231);
}

#drop-casas ul{
	margin: 0 auto;
	padding: 8px 0;
	width: 413px;
}

#drop-casas li{
	float: left;
	list-style: none;
	margin-left: 15px;
}

#drop-casas li a{
	display: block;
	width: 38px; height: 38px;
	position: relative;
	-webkit-transition:all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out;
	padding: 3px;
	opacity: 0.7;
}

#drop-casas li a img{
	width: 38px; height: 38px;
	-webkit-transition:all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out;
}

#drop-casas li a:hover{
	padding-top: 1px;
}

#drop-casas li a:hover{
	opacity: 1;
}

#fechar-drop-casas{
	width: 25; height: 25px;
	position: absolute;
	right: 400px;
	padding: 2px;
	top: 15px;
	border-radius: 50%;
	-webkit-transition:all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out;
	opacity: 0.7;
}

#fechar-drop-casas:hover{
	border: solid 1px #9b9b9b;
	opacity: 1;
}

#fechar-drop-casas:hover img{
	transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
}

#fechar-drop-casas img{
	width: 25px; height: 25px;
	-webkit-transition:all 0.2s ease-out;
	-moz-transition:all 0.2s ease-out;
	transition:all 0.2s ease-out;
}



/*
 * FOOTER
 */

footer a, a:visited{
	border-bottom: solid thin;
}

footer a:hover{
	border-bottom-width: 2px;
}

.designer{
	position: absolute;
	bottom: 0px; right: 100px;
	font-size: 10px;
}

footer{
	position: relative;
	width: 100%;
	top:100%;
	background:  #fff;
	border-top: solid 1px #c9c6c0;
	margin-top: 100px;
	font-size: 0.9em;
	padding: 60px 0;
}

footer h3{
	font-weight: 700;
	margin-bottom: -10px;
}

footer section{
	width: 95%;
	min-width: 360px;
	max-width: 1100px;
	margin: 0 auto;
}

footer .coluna1{
	width: 30%;
	margin:0;
}

footer .coluna2{
	width: 30%;
	text-align: center;
	margin:0 auto;
	float: none;
}

footer .coluna3{
	width: 240px;
	float: right;
	margin:0;
	position: relative;
}


footer .coluna2 h3{
	margin-bottom: 0;
}

footer .sociais{
	position: relative; height: 30px; padding: 0;
	width: 80px;
	margin: 10px auto;
	padding-left:10px;
}

footer .sociais li a{
	display: block;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: solid 1px #6BB5B3;
	background-repeat: no-repeat;
	background-size: 100%;
}

footer .face-icon, footer .twit-icon, footer .insta-icon{
	-webkit-transition:all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out;
}

.face-icon:hover, .twit-icon:hover, .insta-icon:hover{
	background-position: 0 100%;
}

.trip{
	position: relative;
	width: 150px;
	margin: 20px auto;
}

.trip #CDSWIDCOE{
	width: Auto;
}


/*
 * CAPA
 */

.gallery {
	position: absolute;
	width: 100%; height:100%;
	background:#040404;
	top:0; left: 0;
 }

.botao{
	width: 80px; height: 80px;
	position: absolute;
	top: 50%;
	margin-top: -40px;
	z-index:50;
	cursor: pointer;
}

.direita{
	background: url(../imagens/botao_direita.png) no-repeat;
	right: 3%;
	-webkit-transition:all 0.15s ease-out;
	-moz-transition:all 0.15s ease-out;
	transition:all 0.15s ease-out;
}

.direita:hover{
	background: url(../imagens/botao_direita_hover.png) no-repeat;
}

.esquerda{
	background: url(../imagens/botao_esquerda.png) no-repeat;
	left: 3%;
	-webkit-transition:all 0.15s ease-out;
	-moz-transition:all 0.15s ease-out;
	transition:all 0.15s ease-out;
}

.esquerda:hover{
	background: url(../imagens/botao_esquerda_hover.png) no-repeat;
}

.janela{
	width:100%;
	height:100%;
	position: absolute;
	overflow: hidden;
}

.janela div {
	width: 100%; height: 100%;
	position: absolute;
	top:0;
	left:0;
}

 .bolinhas{
	position: absolute;
	width: 152px;
	bottom:-13px; left: 50%;
	margin-left: -76px;
	z-index:50;
	font-size: 1.8em;
	font-weight:700;
	color: #FFF;
	text-align: center;
	padding: 0;
 }

.bolinhas li{
	cursor: pointer;
	opacity: 0.5;
	float: left;
	margin-right: 10px;
}

.bolinhas li:hover{
	opacity: 0.8;
}

.bolinhas li.ativo{
	opacity: 1;
}

 .cover{
	 overflow:hidden;
	-webkit-background-size: cover;
	-moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.chamada{
	width: 200px;
	position: absolute;
	top: 35%;
	left: 50%; margin-left: -100px;
	z-index:500;
}

/*
 * SOBRE
 */

.pagina{
	width: 100%;
	position: relative;
	overflow: hidden;
}

.conceito{
	margin-bottom:-300px;
}

.header1{
	width: 100%;
	height: 550px;
	position: relative;
	top:0px;
}

.header1 h1{
	width: 100%;
	text-align:center;
	height: 80px;
	position: absolute;
	top: 40%;
	color: #FFF;
	font-weight: 100;
	font-size: 6em;
	font-family: 'Lobster', cursive;
	line-height:5.5vw;
	-webkit-transform:rotate(-5deg);
	-moz-transform:rotate(-5deg);
	-ms-transform:rotate(-5deg);
	text-shadow: 1px 1px 1px #666666;

}

.header1 div{
	width: 110%;
	hegiht: auto;
	position: absolute;;
	background:#FFB440;
	right: -8%;
	float:right;
	font-weight:100;
	font-size: 1.6em;
	color: #FFF;
	text-align:left;
	-webkit-transform:rotate(-5deg);
	-moz-transform:rotate(-5deg);
	-ms-transform:rotate(-5deg);
	bottom:0;
	padding: 10px;
}

.header1 div p{
	width: 70%;
	margin: 0 auto;
}

.pagina section{
	width: 80%;
	min-width: 600px;
	max-width: 950px;
	margin: 0 auto;
	height: 500px;
}

.pagina section h1{
	margin-top: 100px;
	margin-bottom: 0px;
	width: 100%;
	text-align:center;
	font-weight:300;
	font-size:3em;
}

.pagina section p{
	line-height: 2em;
	font-weight: 400;
}

.conceito section p{
	margin-top: 80px;
	-webkit-column-count: 3;
  -webkit-column-gap:   20px;
  -moz-column-count:    3;
	-moz-column-gap:      20px;
	column-count:         3;
	column-gap:           20px;

}

.infra{
	/*background:#6BB5B3;*/
}

.infra section{
	margin-top: 0px;
	height:auto;
	padding: 50px 0;
}


.infra h1{
	margin-top: 0px;
	text-align:center;
	font-weight:300;
	font-size:4em;
}

.infra .titulo{
	width: 100%;
	position: absolute;
	top:300px; left: 0;
	text-align:center;
	color:#fff;
}

.legenda{
	width: 60%;
	height: auto;
	line-height: 2.4em;
	margin: 0 auto;
	text-align: center;
	font-size: 1.3em;
	min-width: 400px;
	max-width: 600px;
	padding:50px 0;
}

.icone {
	position: absolute;
	z-index: 9;
	width: 110px; height:110px;
	left: 50%; margin-left: -55px;
	top: 200px;
}


.header2,.header3, .header4, .header5, .header6, .header7, .header8, .header9{
	width: 100%;
	height: 600px;
	position: relative;
	top:0px;
}

.header1{
	background: url(../imagens/sobre/slice_07.png) bottom right no-repeat, url(../imagens/sobre/header-conceito.jpg) no-repeat fixed;
	background-size: contain, cover;
}

.header2{
	background: url(../imagens/sobre/slice_01.png) top left no-repeat, url(../imagens/sobre/slice_07.png) bottom right no-repeat, url(../imagens/sobre/vila.jpg) no-repeat fixed;
	background-size: contain, contain, cover;
}

.header3{
	background: url(../imagens/sobre/slice_01.png) top left no-repeat, url(../imagens/sobre/slice_07.png) bottom right no-repeat, url(../imagens/sobre/restaurante.jpg) no-repeat fixed;
	background-size: contain, contain, cover;
}

.header4{
	background: url(../imagens/sobre/slice_01.png) top left no-repeat, url(../imagens/sobre/slice_07.png) bottom right no-repeat, url(../imagens/sobre/deck.jpg) no-repeat fixed;
	background-size: contain, contain, cover;
}

.header5{
	background: url(../imagens/sobre/slice_01.png) top left no-repeat, url(../imagens/sobre/slice_07.png) bottom right no-repeat, url(../imagens/sobre/academia.jpg) no-repeat fixed;
	background-size: contain, contain, cover;
}

.header6{
	background: url(../imagens/sobre/slice_01.png) top left no-repeat, url(../imagens/sobre/slice_07.png) bottom right no-repeat, url(../imagens/sobre/lojinha.jpg) no-repeat fixed;
	background-size: contain, contain, cover;
}


.header7{
	background: url(../imagens/sobre/slice_03.png) top left no-repeat;
	height: 200px;
	margin-top: -80px;
}

		@media only screen and (min-width: 1290px) {
		  .header7{
			  margin-top: 0px;
		  }
		}


		@media only screen and (max-width: 1024px) {
			.header1{
				background: url(../imagens/sobre/slice_07.png) bottom right no-repeat, url(../imagens/sobre/header-conceito.jpg) no-repeat scroll;
				background-size: contain, 150%;
			}

			.header2{
				background: url(../imagens/sobre/slice_01.png) top left no-repeat, url(../imagens/sobre/slice_02.png) bottom right no-repeat, url(../imagens/sobre/vila.jpg) no-repeat scroll;
				background-size: contain, contain, 150%;
			}

			.header3{
				background: url(../imagens/sobre/slice_03.png) top left no-repeat, url(../imagens/sobre/slice_05.png) bottom right no-repeat, url(../imagens/sobre/restaurante.jpg) no-repeat scroll;
				background-size: contain, contain, 150%;
			}

			.header4{
				background: url(../imagens/sobre/slice_04.png) top left no-repeat, url(../imagens/sobre/slice_02.png) bottom right no-repeat, url(../imagens/sobre/deck.jpg) no-repeat scroll;
				background-size: contain, contain, 150%;
			}

			.header5{
				background: url(../imagens/sobre/slice_03.png) top left no-repeat, url(../imagens/sobre/slice_05.png) bottom right no-repeat, url(../imagens/sobre/academia.jpg) no-repeat scroll;
				background-size: contain, contain, 150%;
			}

			.header6{
				background: url(../imagens/sobre/slice_04.png) top left no-repeat, url(../imagens/sobre/slice_02.png) bottom right no-repeat, url(../imagens/sobre/lojinha.jpg) no-repeat scroll;
				background-size: contain, contain, 150%;
			}

		}


.pagina .tabela h1{
	margin-top: 0;
}

.tabela ul{
	margin:0; padding: 0;
	line-height:2em;
}

.tabela ul li{
	text-align: center;
	border-bottom: solid thin;
	width: 220px;
	margin: 0 auto;
}

.servicos{
	background: #fff;
	height: auto;
}

.servicos h1{
	text-align:center;
	font-weight:300;
	font-size:4em;
}

.conteudo-servicos{
	width: 900px;
	height: 400px;
	margin: 0 auto;
	margin-bottom: 50px;
}

.icone-servicos{
	width: 250px;
	height: 250px;
	border-radius:50%;
	-webkit-border-radius: 50%;
	float:left;
	margin:25px;
	position: relative;
	cursor:pointer;
	overflow:hidden;
}

.compras {
	background: #DA6528;
}

.praia {
	background: #FFB440;
}

.personal {
	background: #6BB5B3;
}


.icone-servicos img{
	position: absolute;
}

.icone-servicos h2{
	position: absolute;
	color: #FFF;
	font-size: 1.5em;
	width: 100%;
	top: 140px;;
	text-align:center;
	line-height:1em;
}

.info-servicos{
	width: 100%; height: 100%;
	background: inherit;
	opacity: 0;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	position: absolute;
	color: #FFF;
	text-align: center;
	-webkit-transition:all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out;
}

.info-servicos p{
	width: 80%; margin: 0 auto;
	font-size: 1.2em;
	margin-top: 50px
}


.info-servicos ul{
	margin: 0;
	width: 200px;
	top: 80px; left: -17px;
	position: absolute;
	font-size:1.4em;
}

.icone-servicos:hover .info-servicos{
	opacity: 1;
}

.servicos .tabela{
	min-width: 0;
	height: auto;
}

/*
 * CASAS
 */



.casas{
	position: relative;
}

.interna{
	height: auto;
	margin-bottom: 50px;
}

.galeriacasas{
	position: relative;
	left:0; top: 70px;
	width: 100%; height: 450px;
}

.capa-casas{
	position:relative;
	width: 100%;
	height: 400px;
	margin-bottom: 50px
}

.casas p{
	font-weight: 400;
	font-size: 1.2em;
	line-height: 2.6em;
}

.headercasas{
	position: relative;
	width: 100%;
	height: 100%;
	background: url(../imagens/casas/headercasas.jpg) no-repeat;
	background-position: bottom;
	background-size:cover;
	-moz-background-size:cover;
	-ms-background-size:cover;
	-webkit-background-size:cover;
	-o-background-size:cover;
}

		@media only screen and (min-width: 1290px) {
			.headercasas{
				background-position:0px -120px;
			}

			.capa-casas{
				height: 500px;
			}

			.galeriacasas{
				height: 650px;
			}

		}

.headercasas div{
	position: absolute;
	background: url(../imagens/casas/detalhe.png)  repeat-x;
	width: 100%; height: 120px;
	bottom: 0px;
}

.casas section{
	height: auto;
	width: 80%;
	max-width: 900px;
	margin:0 auto;
	margin-top: 10px;
	margin-bottom: 35px;
}

.casas h3{
	width: 100%;
	text-align:center;
	margin-bottom: 5px;
	margin-top: 20px;
	letter-spacing: normal;
	font-weight: 700;
}
.casas section .coluna1{
	height: 100%;
	width: 70%;
}

.casas section .coluna2{
	height: 100%;
	width:28%;
	color: #9C872F;
}


.casas section .coluna2 div:hover{
	box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.5);
	-webkit-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.5);
	-moz-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.5);
	-ms-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.5);
	-o-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.5);
}

#containermenu{
	width: 702px;

	margin: 0 auto;
	height: 60px;
	position: relative;
	margin-bottom: 50px;
	clear: both;
}

.menucasas{
	position: relative;
	width: 310px;
	float: left;
	margin-right: 10px;
	margin-bottom: 100px;
}


.chales{
	width: 372px;
}

.chales ul{
	width: 280px !important;
}


.menucasas h1{
	float: left;
	width: 85px;
	font-weight: 300;
	font-size: 1.8em;
	margin: 0;
	text-align: right;
	margin-top: 10px;
}

.menucasas ul{
	margin:0; padding: 0;
	width: 210px;
	float: left;
	margin-left: 7px;
}

.menucasas ul li{
	width: 60px; height: 60px;
	float: left;
	margin-right: 10px;
	border-radius:50%;
	-webkit-transition:all 0.15s ease-out;
	-moz-transition:all 0.15s ease-out;
	transition:all 0.15s ease-out;

}

.menucasas ul li:hover{
	box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.8);
	-webkit-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.8);
	-moz-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.8);
	-ms-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.8);
	-o-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.8);
}

#mapa{
	width: 100%;  position: relative; height: auto; overflow:hidden;color: #FFF;
}

#mapa #tour-360{ position: absolute; right: 15%; top:0; background: #6e6700; opacity: 0.8; width: 150px; max-width:200px; height: auto; padding: 60px 20px 20px 20px;
	-webkit-transition:all 0.2s ease-out;
	-moz-transition:all 0.2s ease-out;
	transition:all 0.2s ease-out;
border-radius: 0 0 3px 3px;
	box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.3);
	-webkit-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.3);
	-moz-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.3);
	-ms-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.3);
	-o-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.3);
}


#mapa #tour-360:hover{padding-top: 70px; opacity: 1;}


#mapa #tour-360 h2{ color: #fff; font-size: 2em; width: 100%; text-align:center; margin-bottom: -15px;
	-webkit-transition:all 0.2s ease-out;
	-moz-transition:all 0.2s ease-out;
	transition:all 0.2s ease-out;
}

#mapa #tour-360 p{ width: 100%; text-align:center; line-height:1em;
	-webkit-transition:all 0.2s ease-out;
	-moz-transition:all 0.2s ease-out;
	transition:all 0.2s ease-out;
	}


#mapa img{
	max-width: 100%; margin: 0 auto; height: auto; margin-bottom: -10%;
}


.link-casa{
	width: 120px; height:120px; border-radius:50%;	position: absolute; cursor: pointer; overflow: hidden;
	-webkit-transition:all 0.1s ease-out;
	-moz-transition:all 0.1s ease-out;
	transition:all 0.1s ease-out;
}

.mais-info{
	width: 100%; height: 100%; background: inherit; position: absolute; top: 0; left: 0;opacity: 0;
	-webkit-border-radius:50%; border-radius: 50%;
	-webkit-transition:all 0.15s ease-out;
	-moz-transition:all 0.15s ease-out;
	transition:all 0.15s ease-out;
}

.mais-info h2 span{
	font-size: 3.5em;
}

.mais-info h2{
	top: 0;
	width: 100%;
	line-height: 1em;
	font-size: 1em;
	margin-top: 40px;
}

.link-casa:hover{
	box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.8);
	-webkit-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.8);
	-moz-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.8);
	-ms-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.8);
	-o-box-shadow: 0px 2px 4px rgba(90, 90, 90, 0.8);
}


.link-casa:hover .mais-info{
	opacity: 1;
}

.casa-vermelha{		background: #D60014; left: 57%; top: 11%;}
.casa-laranja{		background: #DA6528; left: 70%; top: 23%;}
.casa-amarela{ 		background: #FFB440; left: 85%; top: 35%;}
.casa-violeta{		background: #72559A; left:12%;  top: 53%;}
.casa-turquesa{		background: #6BB5B3; left:75%;  top: 45%;}
.chale-indigo{		background: #3341A1; left:17%;  top: 40%;}
.casa-verde{			background: #779a36; left:20%;  top: 28%;}
.restaurante{ 		background: #D60014; left:12%;  top: 10%;}
.biblioteca{			background: #9c872f; left:21%;  top: 22%;}
.lojinha{					background: #75003c; left:28%;  top: 3%;}
.bar{							background: #6BB5B3; left:15%;  top: 60%;}
.lounge{					background: #FFB440; left:15%;  top: 68%;}
.redario{					background: #DA6528; left:2%;   top: 78%;}
.deck{						background: #4e291d; left:52%;  top: 80%;}
.cabana{					background: #DA6528; left:72%;  top: 73%;}

.fotos-casa{
	height: 500px;
	top: 70px;
}

  @media only screen and (min-width: 1281px) {
	  .fotos-casa{
		  height: 550px;
	  }
  }

.janela img{
	max-width: 100%;
	min-width: 900px;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}


#sobre-casas{
	width: 80% ;
	margin: 0 auto;
	position: relative;
	margin-top: 120px;
}

#infocasa{
	width: 20%;
	text-align: right;
	padding: 20px 20px 20px 0 ;
	float: left;
	position: relative;
	margin-right: 10%;
	margin-bottom: 80px;
	border-right: solid 1px rgb(212, 210, 199);
	min-width: 100px;
}


#infocasa ul{
	color:  inherit;
	margin: 0 auto; padding: 0;
}

#infocasa ul li{
	padding: 5px 10px;
	font-size: 1em;
}

#infocasa img{
	width: 16px; height: 19px;
	padding: 0 2px;
}

#descricao{
	float: left;
	width: 65%;
	max-width: 960px;
	margin: 0 auto;
	margin-bottom: 80px;
	height: auto;
	font-weight: 500;
	clear: right;
}

#descricao p{
	font-size: 1.2em;
	line-height:2.6em;
	margin-top: 20px;
}

#descricao .asterisco{
	font-size: 0.9em;
	font-weight: 600;
}



/*botao mapa*/
#mapa-d{
	width: 110px;
	position: relative;
	text-align: center; padding: 15px 25px; cursor: pointer;
	color: #6BB5B3;
	font-size: 14px;
	font-weight: 600;
	background: #fff;
	border:solid 2px #6BB5B3;
	border-radius: 30px;
	margin: 0 auto;
	margin-bottom: 45px; margin-top: 80px;
	-webkit-transition:all 0.2s ease-out;
	-moz-transition:all 0.2s ease-out;
	transition:all 0.2s ease-out;
}

#mapa-d:hover{
	background: #6BB5B3;
	color: #fff;
}

/*localização*/

#capa{
	width: 100%;
	height: 700px;
	background: url(../imagens/localizacao/capa-b.jpg) center center no-repeat;
	background-size:cover;
	background-attachment:fixed;
	position: relative;
}

#capa .inclinado{width: 100%; height: 200px; position: absolute; background: url(../imagens/sobre/slice_07.png) center center no-repeat; bottom: 0;}

#capa p{
	margin: 0 auto;
	text-align: center;
	width: 40%;
	position: relative;
	top: 200px;
	font-size: 1.5em;
	line-height:1.5em;
	font-weight:300;
	color: #FFF;
}

#como-chegar{
	margin: 0 auto;
	top: 250px;
	position: relative;
	width: 100px; height: 100px;
	border-radius:50%;
	background: url(../imagens/localizacao/icone.png) center center no-repeat, #6BB5B3;
	background-size: 80%;
	cursor:pointer;
	-webkit-transition:all 0.2s ease-out;
	-moz-transition:all 0.2s ease-out;
	transition:all 0.2s ease-out;
}

#como-chegar:hover{
	background: url(../imagens/localizacao/icone.png) center center no-repeat, #5B9998;
	background-size: 80%;
}

#como-chegar h2{
	position: absolute;
	line-height:1em;
	right: -120%;
	top: 25px;
	color: #FFF;
}

#localizacao{
	height: auto;
}


#localizacao a{color:#FFB440 }
#localizacao a:hover{ text-decoration:underline; }

.direcoes{
	width: 80%;
	margin: 50px auto;
	margin-bottom: 0;
	height: auto;
	min-width: 750px;
	max-width: 1000px;
}

.direcoes h1{
	width: 100%;
	text-align: center;
	font-weight:100;
	font-size: 4em;
	clear:both;
}

.direcoes h2{
	text-align: left;
	font-weight: 800;
	font-size: 1.4em;
	color: #6BB5B3;
	width: 100%;
	margin-top: 0;
}

.direcoes p{
	font-size: 1em;
	line-height: 2.5em;
	margin-bottom: 3em;
}

.direcoes img{
	width: 100%;
}


.direcoes div{
	margin-bottom: 100px;
}

#ilustra-mapa{
	display:none
}

/*reservas*/

#capa-reserva{
	width: 100%; height: 400px;
	padding-top: 250px;
	background: url('../imagens/reservas/capa.jpg') center center no-repeat fixed;
	background-size: cover;
	position: relative;
}



#capa-reserva h2{
	color: #fff;
	width: 60%;
	position: relative;
	font-size: 2.5em;
	font-weight:100;
	margin: 0 auto;
	margin-bottom: 30px;
}

#capa-reserva a{
	background: #FFB440;
	position: relative;
	margin: 0 auto;
	width: 140px;
	height: 50px;
	display: block;
	-webkit-transition:all 0.15s ease-out;
	-moz-transition:all 0.15s ease-out;
	transition:all 0.15s ease-out;
}

#capa-reserva a h4{
	width: 100%;
	text-align: center;
	position: relative;
	color: #fff;
	top: 15px;
}

#capa-reserva a:hover{
	background: #fff;
}

#capa-reserva a:hover h4{
	color: #FFB440;
}


#capa-reserva .inclinado{
	width: 100%; height: 200px; position: absolute; background: url(../imagens/sobre/slice_07.png) center center no-repeat; bottom: 0;}
}

.reserva{
	height: auto;
	margin-bottom: 50px
}

.reserva section{
	margin-top: 150px;
	width: 980px;
	height: auto;
}

.reserva section h2{
	 margin: 0 auto;font-size:1.6em; margin-bottom: 60px; max-width:600px; text-align:center; width: auto;
}

.reserva section a:hover {
	text-decoration: underline;
}

.reserva section div{
	width: 80%;
	height: auto;
	margin:0 auto;
}

.reserva section div .icone-reserva{
	width: 20%; float: left; max-width: 150px;
}

.icone-reserva img{
	width: 100%;
	margin:0 auto;
}

.reserva section .legenda-reserva{
	font-size:1em;
	text-align:center;
	line-height:1em;
	border-top: solid 1px;
	padding-top: 5px;

}

.reserva section div h1{
	float:left;
	width: auto;
	margin: 45px 5px;
	font-size:5em;
}

.reserva #info-reserva{ margin-top: 0; height: auto;}

.reserva section p{
	max-width: 950px;
	width: 100%;
	margin: 20px auto;
}

.reserva .box-inclinado{ width:100%;	min-width: 0; max-width: 100%; margin-top: 150px; height: auto; background-color:#FFB440; position:relative;}

.reserva .box-inclinado .top{background: url(../imagens/reservas/slice_02.png) no-repeat center center; width: 100%; height: 200px; position: absolute; top:-180px; left: 0;}

.reserva .box-inclinado .bottom{background: url(../imagens/reservas/slice_03.png) no-repeat center center; width: 100%; height: 200px; position: absolute; bottom:-180px; left: 0;}


.reserva section .taxa-rolha{
	position: relative;
	color: #FFF;
	height: auto;
	z-index:10;
}

.reserva section .taxa-rolha p{font-size: 1.3em; font-weight:400;}

.reserva .box-inclinado-dark{ width:100%;	min-width: 0; max-width: 100%; margin-top: 150px; height: auto; background: #4e291d; position:relative;}
.reserva .box-inclinado-dark .top{background: url(../imagens/reservas/slice_05.png) no-repeat center center; width: 100%; height: 200px; position: absolute; top:-180px; left: 0;}

.reserva .box-inclinado-dark .bottom{background: url(../imagens/reservas/slice_04.png) no-repeat center center; width: 100%; height: 200px; position: absolute; bottom:-180px; left: 0;}

#box-regras{height: auto;}
.reserva section .regras{ color: inherit; margin-top: 20px;}
.reserva section .regras h2{ text-align:left;  font-size: 2.5em; margin: 0 0 30px 30px; font-weight:100;}

.regras #leis{ height: auto; width: 80%; margin: 0 auto; margin-bottom: 50px;}
.regras #leis li{margin-bottom: 10px; list-style:circle }

.link-blog{ font-size: 1.5em;  margin-top: 100px;	text-align:center; margin-bottom: 80px;}
.link-blog a:hover{text-decoration: underline;}


.TA_tchotel{
	width: 68px;
	margin: 20px auto;
}