/*
 * developed by ricardo r. recchia
 * officina digital
 */

@import url("reset.css");

@font-face {
  font-family: "Calligraphic";
  src: url("../fonts/calligraphic.eot");
  src: local("Calligraph810 BT"), url("../fonts/calligraphic.ttf");
}

html { background-color: #71624d; }

body {
  width: 1000px; 
  height: auto;
  background-color: #ebd79a;
  margin: 0 auto 0 auto;
  font: 12px Georgia, serif; 
  color: #71624d;
}

/* geral
******************************************************************/
h1 { 
  font-family: Calligraphic, Georgia, serif;
  font-size: 42px; 
  text-transform: uppercase; 
  margin: -10px 0 10px 0;
}

h2 { 
  font-size: 16px; 
  margin-bottom: 10px; 
}

input, textarea, select { 
  font: 12px Georgia, serif; 
  color: #695339; 
}

a { 
  text-decoration: none; 
  color: #71624d; 
}

a:hover { text-decoration: underline; }

#main {
  width: 758px;
  background: url(../images/main_bg.png) top right no-repeat;
  padding: 53px 23px 30px 0;
  float: right;
}

#main p { margin-bottom: 20px; }

#aside {
  width: 152px;
  padding: 30px 33px 0 33px;  
  float: left;
}

#aside h2 { margin-top: 22px; }
#aside img { margin-bottom: 26px; }
#aside li { margin-bottom: 20px; } 

.clear { clear: both; }

#main form label.error { 
  width: auto; 
  margin-left: 4px;  
  font-style: italic; 
  font-weight: bold; 
  color: red;
}

/* header / subheader / footer
******************************************************************/
#header { 
  width: 1000px; 
  height: 212px; 
  background: #fff url(../images/header_bg.png) top left no-repeat;
  position: relative;
}

#header h1 { 
  width: 131px; 
  height: 170px;
  background: url(../images/logo.png);
  position: absolute;
  margin: 25px 0 0 45px;
  text-indent: -5000px;
}

ul#lang {
  height: 18px;
  position: absolute; 
  top: 20px; 
  right: 23px;
  font: 11px Calligraphic, Georgia, serif;
  text-transform: uppercase;
}

#lang li { 
  float: left; 
  margin-left: 12px; 
}

#lang a { display: block; }

#lang a:hover {
  text-decoration: none;
}

#lang .home {
  width: 14px;
  height: 10px;
  background: url(../images/icons.png);
  text-indent: -5000px;
}

#lang .contato {
  width: 11px;
  height: 9px;
  background: url(../images/icons.png) 0 -11px;
  text-indent: -5000px;
  margin-top: 1px;
  padding-right: 12px;
  border-right: 1px solid #71624d; 
}

#lang .pt {
  height: 11px;
  padding-left: 20px;
  background: url(../images/icons.png) 0 -21px no-repeat;
}

#lang .en {
  height: 11px;
  padding-left: 20px;
  background: url(../images/icons.png) 0 -33px no-repeat;
}

ul#nav {
  width: 790px;
  position: absolute; 
  left: 226px; 
  bottom: 45px;
  font-family: Calligraphic, Georgia, serif;
  font-size: 10px; 
  text-transform: uppercase;
}

#nav li { display: inline; margin-right: 15px; }
#nav li a:hover { color: #000; text-decoration: none; }

#subheader {
  width: 1000px; height: 243px;
  background: #fff url(../images/subheader_bg.jpg) no-repeat;
  position: relative;
}

#subheader .slideshow { 
  width: 746px; height: 304px;
  background: white;
  border: 5px solid #fff;
  position: absolute; top: -39px; right: 23px;
}

#subheader .slideshow img { position: absolute; }

#footer {
  height: 35px;
  padding: 23px 33px 0 33px;
  background-color: #0a4763;
  color: #b9b39b;
}

#footer p { float: left; }
#footer img { float: right; }

/* home
******************************************************************/
#main.home p { width: 518px; float: left; }
#main.home img { margin-top: -100px; float: right; }

#main.home .footer {
  height: 88px;
  background: transparent url(../images/main_home_footer.png) left no-repeat;
  border-top: 1px solid #C6B483;
  margin-top: 26px;
  position: relative;
}

.home .footer a { text-indent: -5000px; position: absolute; display: block; }
.home .footer a.fotos { width: 88px; height: 88px; left: 0;}
.home .footer a.smiles { width: 158px; height: 88px; left: 175px; }
.home .footer a.twitter { width: 125px; height: 88px; left: 352px; }

form#newsletter {
  width: 250px;
  position: absolute; top: 12px; right: -10px;
}

form#newsletter input { 
  width: 180px; 
  border: 0; 
  margin-bottom: 5px; 
}

form#newsletter input.submit { 
  width: auto; 
  display: inline; 
  vertical-align: top;
  margin: -8px 0 0 4px;
}

form#newsletter legend { font-size: 13px; text-transform: uppercase; margin-bottom: 8px; font-family: Calligraphic, Georgia, serif; }

/* hotel
*****************************************************************/
#main.hotel div {
  width: 300px; height: 94px;
  background: url(../images/portal.png) center left no-repeat;
  margin-top: 120px; padding: 12px 0 0 90px;
}

#main.hotel h2 {
  font-family: Calligraphic, Georgia, serif;
  font-size: 26px; 
  text-transform: uppercase;
  margin-bottom: 30px;
}

/* acomodações
****************************************************************/
#main.acomodacoes ul { margin: 4px 0 16px 8px; }
#main.acomodacoes a:hover { text-decoration: underline; }

div#acomodacoes { 
  width: 400px; height: 208px;
  border-left: 1px solid #C6B483;
  padding-left: 22px;
  text-align: justify;
  float: right;
  display: none;
}

/* eventos
******************************************************************/
#main.eventos ul { 
  height: 22px; 
  background: transparent url(../images/picasso.png) no-repeat;
  margin: 6px 30px 0 0; padding-top: 5px;
}

#main.eventos li { width: 82px; float: left; padding-left: 24px; }

form#eventos label { width: 130px; }
form#eventos input.submit { width: auto; border: 0; margin-left: 135px; }
form#eventos legend { font-weight: bold; margin-bottom: 8px; }

#main.eventos a.galeria {
  height: 17px;
  background: url(../images/camera_icon.png) center left no-repeat;
  padding: 1px 0 0 28px;
}

/* localização
******************************************************************/
#main.localizacao ul { margin-bottom: 16px; }
#main.localizacao li { width: 233px; height: 194px; display: inline; position: relative; }
#main.localizacao li strong { position: absolute; left: 6px; bottom: 10px; }

form#rota input { width: 500px; }
form#rota input.submit { width: auto; border: 0; margin: 0 0 -8px 8px; }

form#rota span { font-size: 11px; }

/* fotos
******************************************************************/
#main.fotos li {
  width: 167px; height: 157px;
  float: left;
  position: relative;
  margin: 0 22px 22px 0;
}

#main.fotos li strong {
  position: absolute; bottom: 0; left: 4px;
}

#main.fotos div { display: none; } 

/* reservas
******************************************************************/
ul.contato li.email { height: 20px; background: url(../images/mail.gif) center left no-repeat; padding-left: 33px; }
ul.contato li.skype { height: 27px; background: url(../images/skype.png) center left no-repeat; padding-left: 33px; }

form label { 
  display: inline-block;
  text-align: right;
  vertical-align: top;
  margin-right: 2px;
}

form#reservas label { width: 80px; }

form input, textarea, select { 
  width: 420px;
  border: 1px solid #867F69;
  margin-bottom: 8px;
}

form #ddd { width: 30px; }
form #tel { width: 119px; }
form #estado { width: 160px }

form#reservas input.submit { width: auto; border: 0; margin-left: 85px; }

form a img { margin: 0 0 9px 12px; }

/* tarifário
*****************************************************************/
ul#tarifas li {
  height: 50px;
  background-color: #F2E4BA;
  margin-bottom: 10px;
  text-transform: uppercase;
}

#tarifas img { 
  vertical-align: middle;
  margin-right: 15px;
}

#main.tarifario h2 {
  width: 696px; 
  background-color: #F2E4BA;
  font-size: 25px; font-style: italic; font-weight: normal;
  margin-top: 20px; padding: 10px 30px 10px 30px; 
}

#main.tarifario table { 
  width: 100%;
  margin-bottom: 20px;
  border-spacing: 3px;
  border-collapse: separate;
}

#main.tarifario td, #main.tarifario th { 
  height: 30px; 
  vertical-align: middle;
  padding: 3px;
}

#main.tarifario th {
  font-weight: normal;
  color: #F2E4BA;
  background-color: #71624D;
}

#main.tarifario td { background-color: #F2E4BA; }

table.valores, #t2 { text-align: center; }

#t2 td { width: 377px; }

table.servicos td {
  padding: 10px !important;
  vertical-align: top !important; 
}

#main.tarifario .obs { color: #2F83AA; }

ul#outros li { 
  border-bottom: 1px solid #C6B483; 
  margin: 0; 
  padding: 6px 0; 
}

/* câmera ao vivo
****************************************************************/
#aside iframe { margin-top: 33px; }