/**
* Layout padrão para: Nome do Site
*
* Esse estilo irá definir a estrutura, e componentes gerais do site.
*
* @project Nome do Site
* @version 1.0
* @package layout
* @author Camila Tigre
* @copyright Camila Tigre
* @fontdef font-family:"Trebuchet MS", Helvetica, sans-serif;
* 
*/

/*------------------
* @section RESET 
-------------------*/
/*Arial, Helvetica, sans-serif*/
html, body, form, fieldset {margin:0;padding:0;font:100%/120%  "Trebuchet MS", Helvetica, sans-serif;}
h1, h2, h3, h4, h5, h6, p, pre, blockquote, ul, ol, dl, address {margin:0;padding:0;word-spacing:0;}
table {border-collapse:collapse;}
li, dd, blockquote {margin-left:0;}
form label {cursor:pointer;}
fieldset {border:none;}
input, select, textarea {font-size:100%;font-family:inherit;}
img{border:0;}
a{font-size:14px;color:#fff;text-decoration:none;line-height:1.3em;text-align:justify;}
a:hover{text-decoration:underline;}
header,nav,section,article,aside,footer,hgroup {display:block;}
@font-face {
font-family:'tikalsans-light';
src: url('../font/tikalsans-light/tikalsans-light.eot'); /* IE9 Compat Modes */
src: url('../font/tikalsans-light/tikalsans-light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
     url('../font/tikalsans-light/tikalsans-light.woff') format('woff'), /* Modern Browsers */
     url('../font/tikalsans-light/tikalsans-light.ttf')  format('truetype'), /* Safari, Android, iOS */
     url('../font/tikalsans-light/tikalsans-light.svg#svgBebasNeue') format('svg'); /* Legacy iOS */
}
@font-face {
font-family:'tikalsans-black';
src: url('../font/tikalsans-black/tikalsans-black.eot'); /* IE9 Compat Modes */
src: url('../font/tikalsans-black/tikalsans-black.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
     url('../font/tikalsans-black/tikalsans-black.woff') format('woff'), /* Modern Browsers */
     url('../font/tikalsans-black/tikalsans-black.ttf')  format('truetype'), /* Safari, Android, iOS */
     url('../font/tikalsans-black/tikalsans-black.svg#svgBebasNeue') format('svg'); /* Legacy iOS */
}

/*------------------
* @section LAYOUT 
-------------------*/
/*--------------------------------------------
* @subsection GERAL:REGRAS DE FORMATAÇÃO
----------------------------------------------*/
body,html {width:100%;font-family:'tikalsans-light';font-smooth:12em;background-color:#000;overflow-x:hidden;background-image:url(../img/bg.jpg);background-repeat:no-repeat;background-position:center top;/*background-attachment:fixed;*/}
@media screen and (-webkit-min-device-pixel-ratio:0) {body{overflow:hidden;}}
input, textarea {font-size:12px;color:#fff;border:0;background-repeat:no-repeat;}
label {font-size:12px;color:#fff;}
p{font-size:14px;color:#fff;line-height:1.3em;text-align:justify;margin-bottom:15px;}
li{font-size:14px;color:#fff;line-height:1.3em;text-align:justify;list-style-position:inside;}
h1 {font-size:30px;color:#fff;}
h2 {font-size:25px;color:#930202;font-family:'tikalsans-light';}
h3 {font-size:18px;color:#930202;line-height:1.1em;text-align:justify;font-family:'tikalsans-light';}
img {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.fade {transition:All 1s ease;-webkit-transition:All 1s ease;-moz-transition:All 1s ease;-o-transition:All 1s ease;}
.btn {float:left;cursor:pointer;text-transform:uppercase;font-weight:bold;background:none;color:#930202;border:0;text-align:center;padding:5px 10px;padding:5px\9 10px\9;transition:All 1s ease;-webkit-transition:All 1s ease;-moz-transition:All 1s ease;-o-transition:All 1s ease;border:1px solid #930202;}
.btn:hover {background:#930202;color:#000;text-decoration:none;}
.flow {overflow:hidden;} 
@media screen and (-webkit-min-device-pixel-ratio:0) {.flow {overflow-x:hidden;} }
/*--------------------------------------------
* @subsection GRID
----------------------------------------------*/
@media screen and (-webkit-min-device-pixel-ratio:0) {}
*[class*=row-] {float:left;}
.row-auto {width:980px;height:auto;margin:0 auto;padding:0;position:relative;float:none;}
	/* GRID 100% */
.row-980 {width:980px;margin:0 0 20px 0;}
.row-940 {width:940px;margin:0 0 20px 0;}
.row-940 {width:940px;margin:0 0 20px 0;}
.row-900 {width:900px;margin:0 0 20px 0;}
	/* MARGIN */
.esp-0  {margin:0 0px 0px 0;}
.esp-20 {margin:0 20px 20px 0;}
.esp-25 {margin:0 25px 25px 0;}
.esp-30 {margin:0 30px 30px 0;}
.esp-35 {margin:0 35px 35px 0;}
.esp-40 {margin:0 40px 40px 0;}
	/* GRID */
.row-700 {width:700px;}
.row-645 {width:645px;}	
.row-640 {width:640px;}
.row-635 {width:635px;}	
.row-630 {width:630px;}
.row-625 {width:625px;}
.row-620 {width:620px;}
.row-615 {width:615px;}
.row-610 {width:610px;}
.row-605 {width:605px;}
.row-600 {width:600px;}
.row-500 {width:500px;}
.row-550 {width:550px;}
.row-480 {width:480px;}
.row-470 {width:470px;}
.row-460 {width:460px;}
.row-450 {width:450px;}
.row-440 {width:440px;}
.row-430 {width:430px;}
.row-420 {width:420px;}
.row-410 {width:410px;}
.row-400 {width:400px;}
/**/
.row-340 {width:340px;}
.row-335 {width:335px;}	
.row-330 {width:330px;}
.row-325 {width:325px;}
.row-320 {width:320px;}
.row-315 {width:315px;}
.row-310 {width:310px;}
.row-305 {width:305px;}
.row-300 {width:300px;}
.row-250 {width:250px;}
.row-230 {width:230px;}
.row-200 {width:200px;}

/*--------------------------------------------
* @subsection GERAL:REGRAS DE ESTRUTURA
----------------------------------------------*/
#bg-header {width:100%;float:left;}
#header    {position:relative;}
#header .logo {float:left;margin:20px 0 0 0;}
#header .widgets {position:absolute;right:0;top:75px;}
#header .widgets li {list-style:none;float:left;}
#header .widgets li:first-child {margin:0 5px 0 0;}
#header .widgets li a {width:34px;height:34px;float:left;transition:All 1s ease;-webkit-transition:All 1s ease;-moz-transition:All 1s ease;-o-transition:All 1s ease;}
#header .widgets li:nth-child(1) a {background:url(../img/1.png) no-repeat;}
#header .widgets li:nth-child(1) a:hover {background:url(../img/1.png) no-repeat 0 -34px;}
#header .widgets li:nth-child(2) a {background:url(../img/2.png) no-repeat;}
#header .widgets li:nth-child(2) a:hover {background:url(../img/2.png) no-repeat 0 -34px;}

#header .menu {position:absolute;right:0;top:120px;}
#header .menu:before {height:45px;background:rgba(0,0,0,0.7);width:980px;position:absolute;right:-350px;content:"";border-bottom:#9e999b 1px solid;z-index:1;}
#header .menu a {color:#fff;position:relative;z-index:2;font-size:22px;float:left;padding:10px 35px 0 0;text-decoration:none;text-transform:uppercase;transition:All 0.5s ease;-webkit-transition:All 0.5s ease;-moz-transition:All 0.5s ease;-o-transition:All 0.5s ease;}
#header .menu a.last {padding:10px 0 0 0;}
#header .menu a:hover {color:#b10303;}

#header .menu span { width:auto;height: 1px;position: absolute;background:#930202;top: 45px;display:block;transition:All 0.5s ease;-webkit-transition:All 0.5s ease;-moz-transition:All 0.5s ease;-o-transition:All 0.5s ease;z-index:2;}
#header .menu a:nth-child(1):hover ~ span {width:59px;left:0px;display:block;}
#header .menu a:nth-child(2):hover ~ span {width:71px;left:96px;display:block;}
#header .menu a:nth-child(3):hover ~ span {width:160px;left:205px;display:block;}
#header .menu a:nth-child(4):hover ~ span {width:70px;left:397px;display:block;}
#header .menu a:nth-child(5):hover ~ span {width:98px;left:504px;display:block;}

#bg-banner {width:100%;float:left;height:350px;display:table;border-bottom:1px solid #930202;background:rgba(0,0,0,0.7);padding:0px 0;}
#banner {position:relative;}
#banner .mask {position:absolute;width:980px;height:350px;background:url(../img/banner_mascara.png) no-repeat;left:0;top:0;z-index:9998;}
#banner .reserva {width:266px;height:50px;background:url(../img/btn-reserva.png) no-repeat;display:block;position:absolute;transition:background 1s ease;-webkit-transition:background 1s ease;-moz-transition:background 1s ease;-o-transition:background 1s ease;z-index:9999;top:325px;left:357px;}
#banner .reserva:hover {background:url(../img/btn-reserva-h.png) no-repeat;}


#bg-footer {width:100%;float:left;padding:20px 0 60px 0;}
@media screen and (-webkit-min-device-pixel-ratio:0) {#bg-footer {margin:0 0 -20px 0;}}
#footer   {position:relative;}
#footer p {text-align:center;margin:0;}
#footer .rs {width:977px;height:38px;background:url(../img/recifesites.png) no-repeat;display:block;}

/*-------------------------------
* @subsection PAGINA INICIAL 
---------------------------------*/
/*
*
* @deletar
* Aqui toda a estrutura e formatação especifica da primeira página.
* este comentario pode ser deletado
*
*/

#bg-conteudo {width:100%;float:left;}
#conteudo    {}
#conteudo h2 {text-align:left;margin:0 0 20px 0;font-weight:normal;position:relative;padding:0 20px 0 0;text-transform:uppercase;color:#930202;font-size:30px;}
#conteudo h2:after {position:absolute;bottom:0px;width:100%;margin:0 0 0 20px;border-bottom:#930202 solid 1px;content:'';}

#bg-section {width:100%;float:left;background:#930202;padding:20px 0 35px 0;height:170px;margin:0px 0 20px 0;}
#section   {position:relative;}
#section .img {width:977px;height:53px;position:absolute;top:-50px;background:url(../img/aspas.png) no-repeat center;}
#section h2 {text-align:center;margin:50px 0 30px 0;font-weight:normal;position:relative;padding:0 20px;color:#fff;font-size:17px;}
#section h2:after {width:220px;position:absolute;height:1px;background:#fff;bottom:-18px;left:380px;content:""}
#section h3 {text-align:center;font-weight:normal;color:#fff;font-size:14px;text-transform:none;}
#section .coments {width:977px;height:47px;background:url(../img/coments.png) no-repeat;display:block;}

#conteudo .chegar {position:relative;}
#conteudo .chegar form {position:absolute;left:0;bottom:10px;z-index:2;}
#conteudo .chegar form .input {width:508px;margin:0 19px 0 0;height:30px;background:rgba(103,1,1,0.8);color:#fff;border:0;}
#conteudo .chegar form [input="submit"] {margin:0;}
#conteudo .chegar #map_content {position:relative;left:0;top:0;z-index:1;}
#conteudo .chegar form input[type="submit"] {background:#000;color:#fff;border:0;height:30px;}

#conteudo .curtiu iframe {background:#fff;}

/*-------------------------------
* @subsection PAGINAS INTERNAS
---------------------------------*/
/*
*
* @deletar
* Aqui toda a estrutura e formatação especifica em comum com todas 
* as paginas internas.
*
*/
#bg-conteudo-interno {width:100%;float:left;margin:50px 0 20px 0;}
#conteudo-interno   {width:940px;padding:20px;background:rgba(0,0,0,0.7);min-height:400px;}
#conteudo-interno h2 {text-align:left;margin:0 0 20px 0;font-weight:normal;position:relative;padding:0 20px 0 0;text-transform:uppercase;color:#930202;font-size:30px;}
#conteudo-interno h2:after {position:absolute;bottom:0px;width:100%;margin:0 0 0 20px;border-bottom:#930202 solid 1px;content:'';}

/**/
.paginacao  {width:auto;height:auto;float:left;}
.paginacao li {list-style:none;float:left;margin:0 5px 0 0;}
.paginacao li a {text-decoration:none;display:block;text-align:center;padding:5px 3px;}
.paginacao li .pag-on  {background:#000;color:#fff;}
.paginacao li .pag-off {background:#fff;color:#000;}

/*-----------------------------
* @subsection  MURAL  
-------------------------------*/
#conteudo-interno .mural {position:relative;}
#conteudo-interno .mural form {position:absolute;left:0;}
#conteudo-interno .depoimentos {width:940px;float:left;}
#conteudo-interno .depoimentos li {list-style:none;width:940px;float:left;margin:0 0 15px 0;padding:0;border-bottom:1px dashed #930202;}
#conteudo-interno .depoimentos li h3 {margin:0 0 5px 0;color:#930202;text-transform:capitalize;}
#conteudo-interno .depoimentos li h3 span {text-transform:none;text-transform:uppercase;}
#conteudo-interno .depoimentos li p {font-size:17px;}
/*-----------------------------
* @subsection  A CASA  
-------------------------------*/
#conteudo-interno .casa li {list-style:none;float:left;width:468px;height:351px;margin:0 2px 2px 0;}
#conteudo-interno .casa li.last {margin:0 0 2px 0;}
#conteudo-interno .casa li a {width:468px;height:351px;overflow:hidden;position:relative;padding:0;display:block;}
#conteudo-interno .casa li a img {position:relative;top:0;left:0;transform:scale(1.1,1.1);-moz-transform:scale(1.1,1.1);-o-transform:scale(1.1,1.1);-webkit-transform:scale(1.1,1.1);-ms-transform:scale(1.1,1.1);transition:All 1s ease;-webkit-transition:All 1s ease;-moz-transition:All 1s ease;-o-transition:All 1s ease;width:468px;height:351px;} 
#conteudo-interno .casa li a div {width:428px;background:url(../img/mask.png) no-repeat;position:absolute;bottom:0px;left:0;display:block;height:231px;padding:0px 20px 0 20px;}
#conteudo-interno .casa li a div h3 {margin:180px 0 20px 0;padding:0 0 5px 0;border-bottom:1px solid #ccc;text-transform:uppercase;font-size:30px;transition:All 1s ease;-webkit-transition:All 1s ease;-moz-transition:All 1s ease;-o-transition:All 1s ease;}
#conteudo-interno .casa li a:hover div > h3 {margin-top:90px;}
#conteudo-interno .casa li a:hover img {transform:scale(1,1);-moz-transform:scale(1,1);-o-transform:scale(1,1);-webkit-transform:scale(1,1);-ms-transform:scale(1,1);}

/*-----------------------------
* @subsection  PROGRAMAÇÃO
-------------------------------*/
#conteudo-interno .programacao li {list-style:none;float:left;width:468px;height:600px;margin:0 2px 2px 0;}
#conteudo-interno .programacao li.last {margin:0 0 2px 0;}
#conteudo-interno .programacao li a {width:468px;height:600px;overflow:hidden;position:relative;padding:0;display:block;}
#conteudo-interno .programacao li a img {position:relative;top:0;left:0;-o-transition:All 1s ease;width:468px;height:600px;-webkit-transition: 0.3s all ease;-o-transition: 0.3s all ease;-moz-transition: 0.3s all ease;transition: 0.3s all ease;-webkit-backface-visibility: hidden;-webkit-filter: grayscale(0%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);filter: gray; /* IE 6-9 */filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'saturate\' values=\'1.0\'/></filter></svg>#grayscale");filter: gray alpha(opacity=100);}
#conteudo-interno .programacao li a:hover img {-webkit-filter: grayscale(100%);-moz-filter: grayscale(0%);-ms-filter: grayscale(0%);-o-filter: grayscale(0%);filter: grayscale(0%);filter: gray; /* IE 6-9 */filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'saturate\' values=\'0.0\'/></filter></svg>#grayscale");filter: gray alpha(opacity=0);}
#conteudo-interno .programacao li a span {opacity:0;width:105px;height:106px;display:table;position:absolute;left:calc(50% - 52px);top:calc(50% - 52px);background:url(../img/lupa.png) no-repeat;transition:All 1s ease;-webkit-transition:All 1s ease;-moz-transition:All 1s ease;-o-transition:All 1s ease;}
#conteudo-interno .programacao li a:hover span {opacity:1;}
/*-------------------------------
* @subsection FORMULARIOS 
---------------------------------*/
label {width:100%;float:left;color:#fff;cursor:text;margin-bottom:5px;text-transform:uppercase;font-weight:bold;}
.input {width:940px;height:25px;float:left;margin:0;padding:0 5px\9;color:#fff;font-size:12px;margin:0 0 10px 0;padding:0px 5px;background:none;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;border:1px solid #555;}
.input:focus {border-color:#930202;}
.input2 {width:460px;}
.input3 {width:191px;}

.msg {width:460px;height:145px;float:left;margin:0 0 10px 0;padding:5px;padding:5px\9;color:#fff;font-size:12px;resize:none;overflow:hidden;display:block;border:1px solid #fff;}
.msg2 {width:940px;}
input[type="submit"] {float:left;cursor:pointer;text-transform:uppercase;font-weight:bold;background:none;color:#930202;border:0;text-align:center;padding:5px 10px;padding:5px\9 10px\9;transition:All 1s ease;-webkit-transition:All 1s ease;-moz-transition:All 1s ease;-o-transition:All 1s ease;border:1px solid #930202;}
input[type="submit"]:hover {background:#930202;color:#000;}

::-moz-placeholder  {color:#fff;opacity:1;}
::-webkit-input-placeholder {color:#fff;opacity:1;}
:-ms-input-placeholder {color:#fff;opacity:1;}

/* select */
select {width:460px;margin:0;background:#fff;height:25px;color:#fff;display: inline-block;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;border:0;}
/* Targetting Webkit browsers only. FF will show the dropdown arrow with so much padding. */
/*@media screen and (-webkit-min-device-pixel-ratio:0) {select {padding-right:18px;}}*/
.label {height:26px;position:relative;}
.label:after {content:'>';color:#000;-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);right:0px;top:28px;padding:0;position:absolute;pointer-events:none;}
.label:before { content:'';right:0px; top:24px;width:20px;height:25px;position:absolute;pointer-events:none;display:block;background:#fff;}

/* checkbox */
input[type=checkbox].css-checkbox {display:none;}
input[type=checkbox].css-checkbox + label.css-label {padding-left:25px;height:22px;display:inline-block;line-height:22px;background-repeat:no-repeat;background-position: 0 0;font-size:22px;vertical-align:middle;cursor:pointer;}
input[type=checkbox].css-checkbox:checked + label.css-label {background-position: 0 -22px;}
label.css-label {background-image:url(../img/checkbox.png);-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}

#form .checkbox {width:980px;float:left;}
#form .checkbox div {width:auto;float:left;margin:0 30px 0 0;}
#form .checkbox div label {font-size:10px;padding:3px 0 0 30px;}

#form .anexo  {width:980px;height:auto;float:left;margin-bottom:15px;position:relative;}
#form .file_1 {width:826px;height:40px;background:url(../img/bgcoisas.png);padding:0 5px;}

#map_content {height: 238px;margin:10px 0;}


/*---------------------------------------
* @subpackage CSS PARA JS: caroulFredSel
----------------------------------------*/
/*
*
* @css-for para SERVIÇOS
*
*/
.list_carousel {width:1020px;height:auto;float:left;position:relative;margin:60px 0 0px 0;}
.list_carousel ul {margin: 0;padding: 0;list-style: none;display: block;margin:0px 0 0 0;}
.list_carousel li {width:273px;border-left:1px #000 solid;padding:20px;background:rgba(0,0,0,0.7);float:left;display:block;margin:0 17px 0 0;transition:All 0.5s ease;-webkit-transition:All 0.5s ease;-moz-transition:All 0.5s ease;-o-transition:All 0.5s ease;}
@media screen and (-webkit-min-device-pixel-ratio:0) {.list_carousel li {height:405px;} .list_carousel li img {margin:-18px 0 0 0;}}
.list_carousel li img {width:273px;float:left;}
.list_carousel li div {width:273px;float:left;overflow:hidden;}
.list_carousel li h3  {color:#930202;margin:20px 0 10px 0;padding:0 0px 5px 0px;border-bottom:1px solid #930202;text-transform:uppercase;font-weight:normal;font-family:'tikalsans-black';display:inline-block;position:relative;z-index:2;}
.list_carousel li h3:after {width:273px;border-bottom:1px solid #fff;position:absolute;content:'';bottom:-1px;z-index:1;}
.list_carousel li a {margin:0 10px 15px 0;}
.list_carousel.responsive {width: auto;	margin-left: 0;}
.next, .prev {color:#d7d7d7;font-size:30px;position:absolute;top:-40px;z-index:3;background:rgba(0,0,0,0.8);padding:0 10px;transition:All 0.5s ease;-webkit-transition:All 0.5s ease;-moz-transition:All 0.5s ease;-o-transition:All 0.5s ease;}
.next {right:44px;}
.prev {right:84px;}
.next:hover, .prev:hover {color:#930202;text-decoration:none;}
.clearfix {float: none;clear: both;}
.list_carousel li:hover {border-left-color:#930202;}
.list_carousel li:hover .btn {background:#930202;color:#000;}
/*---------------------------------------
* @subpackage CSS PARA JS: PAGINATION
----------------------------------------*/
/*
*
* @css-for para PÁGINAÇÃO
*
*/
.holder{margin: 15px 0;}
.holder a{font-size: 15px;cursor: pointer;margin: 0 5px;color: #fff;background:none;padding:5px 10px;}
.holder a:hover{background-color: #5e0101;color: #fff;}
.holder a.jp-previous{margin-right: 0px;}
.holder a.jp-next{margin-left: 0px;}
.holder a.jp-current, a.jp-current:hover{background-color: #930202;color: #FFF;font-weight: bold;padding:5px 10px;}
.holder a.jp-disabled, a.jp-disabled:hover{ color: #5e0101;display:none;}
.holder a.jp-current, a.jp-current:hover, .holder a.jp-disabled, a.jp-disabled:hover{cursor: default;}
.holder span{ margin: 0 5px;}