/* 
    Document   : estilos
    Created on : 31/Jan/2013, 11:27:52
    Author     : Nuno
    Description:
        Purpose of the stylesheet follows.
*/

root { 
    display: block;
}

body
{
    margin: 0;
    padding: 0;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 1rem;
}
strong, b { font-weight: bold; }

/* fonts */

.font_berkshire
{
    font: 400 100px/1.3 'Berkshire Swash', Helvetica, sans-serif;
    color: #2b2b2b;
    text-shadow: 1px 1px 0px #ededed, 4px 4px 0px rgba(0,0,0,0.15);
    font-size: 12pt;
}

.font_pacifico
{
    font: 400 100px/1.5 'Pacifico', Helvetica, sans-serif;
    color: #2b2b2b;
    text-shadow: 3px 3px 0px rgba(0,0,0,0.1), 7px 7px 0px rgba(0,0,0,0.05);
    font-size: 12pt;
}

.font_century
{
    font-family: Century Gothic, sans-serif;
    line-height: 1.5;
    text-align: justify;
}

.font_facebook
{
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}

.texto_branco
{
    color: #FFFFFF;
}

.texto_erro
{
    color: #ff0000;
    font-weight: bold;
}

.texto_nota
{
    color: #666666;
    font-size: 8pt;
    font-style: italic;
}

.texto_pequeno
{
    font-size: 0.75rem;
    text-align: justify;
}

.texto
{
    font-family: Verdana, Geneva, sans-serif;
    font-size: 1rem;
    text-align: justify;
    line-height: 1.5;
}

.texto_data
{
    font-family: Century Gothic, sans-serif;
    font-size: 9pt;
    color: #666600;
}

.texto_dinheiro
{
    font-family: Century Gothic, sans-serif;
    color: #00aa33;
    font-weight: bold;
}

.texto_gosto
{
    font-family: ‘Arial Narrow’, sans-serif;
    font-size: 9pt;
    color: #333333;
}

.titulo_seccao_homepage
{
    font-family: "Helvetica Neue","HelveticaNeue",Helvetica,Arial,sans-serif;
    font-size: 0.75rem;
    font-weight: bold;
    text-transform: uppercase;
    color: #ec5600;
}

.titulo_artigo_homepage
{
    font-family: Copperplate / Copperplate Gothic Light, sans-serif;
    font-size: 14pt;
    color: #004db3;
}

.titulo_artigo_homepage_claro
{
    font-family: Copperplate / Copperplate Gothic Light, sans-serif;
    font-size: 14pt;
    color: #ffcc00;
}

.titulo_top_destinos
{
    font-family: Copperplate, sans-serif;
    font-size: 1.125rem;
    color: #ffcc00;
}

.ano_cronologia
{
    font-family: Copperplate / Copperplate Gothic Light, sans-serif;
    font-size: 10pt;
    font-weight: bold;
    color: #333333;
}

.descricao_artigo_homepage, .descricao_artigo
{
    font-family: Century Gothic, sans-serif;
    font-size: 1rem;
    font-weight: bold;
}

.titulo
{
    font-size: 20pt;
    color: #666600;
    text-shadow: 1px 1px 3px #999900;
}

.titulo_pagina
{
    font-size: 20pt;
    color: #666600;
    text-shadow: 1px 1px 3px #999900;
    letter-spacing: 5px;
}

.uppercase
{
    text-transform: uppercase;
}

.subtitulo
{
    font-size: 1.125rem;
    color: #666600;
    text-shadow: 1px 1px 3px #999900;
}

.but_ver_mapa
{
    display: block;
    color: #666666;
    font-weight: bold;
    font-family: ‘Arial Narrow’, sans-serif;
    -moz-border-radius: 0px 0px 5px 5px;
    -webkit-border-radius: 0px 0px 5px 5px;
    border-radius: 0px 0px 5px 5px;
}

.but_ver_mapa:hover
{
    cursor: pointer;
    text-decoration: none;
}

.tabela_destino, .tabela_pedido_pesquisa
{
    background-color: #ffff66;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #ffcc33;
    padding: 20px 20px;
    
    background-color: #FFFFFF; /* fallback color if gradients are not supported */  

    background-image: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#ffff66));
    background-image: -webkit-linear-gradient(top, #FFFFFF, #ffff66); /* chrome */
    background-image:    -moz-linear-gradient(top, #FFFFFF, #ffff66);
    background-image:     -ms-linear-gradient(top, #FFFFFF, #ffff66);
    background-image:      -o-linear-gradient(top, #FFFFFF, #ffff66);
    background-image:         linear-gradient(to bottom, #FFFFFF, #ffff66); /* current standard, but unimplemented and subject to change */

    font-family: Century Gothic, sans-serif;
    line-height: 1.5;
    text-align: justify;
}

.tabela_preta
{
    background-color: #000000;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #ffcc33;
    padding: 20px;
    
    
    background-color: #000000; /* fallback color if gradients are not supported */  
}

.tabela_pedido_pesquisa
{
    font-family: Verdana, Helvetica,Arial, sans-serif;
    font-size: 9pt;
}

.tabela_pedido_pesquisa input[type=text], input[type=password], textarea
{
    font-family: Verdana, Helvetica,Arial, sans-serif;
    font-size: 9pt;
    color: #666600;
    background-color: #e1fddb; 
    border: 1px solid #669900; 
    padding: 2px;
    margin: 0 0 1px 0;
}

.tabela_pesquisa_pessoas {
    border-collapse: collapse;
    font-size: 10pt;
}
.tabela_pesquisa_pessoas td, .tabela_pesquisa_pessoas th { padding: 5px; }

.tabela_espacada { border-collapse: collapse; }
.tabela_espacada td { padding: 5px; }

.caixa_local[type=text]
{
    font-family: Verdana, Helvetica,Arial, sans-serif;
    font-size: 9pt;
    color: #000000;
    background-color: #FFFFFF;
    border: 1px solid #999999;
    padding: 5px;
    margin: 1px 1px 1px 1px;
}

.select_itinerario, .caixa_itinerario[type=text]
{
    font-family: Verdana, Helvetica,Arial, sans-serif;
    font-size: 9pt;
    color: #000000;
    background-color: #FFFFFF;
    border: 1px solid #999999;
    padding: 2px;
    margin: 1px 1px 1px 1px;
}

.textarea_checkin
{
    color: #000000;
    background-color: #FFFFFF;
    border: 1px solid #999999;
    padding: 2px;
    margin: 1px 1px 1px 1px;
}

.select_verde
{
    font-family: Verdana, Helvetica,Arial, sans-serif;
    font-size: 8pt;
    background-color: #e1fddb; 
}

.select_privacidade
{
    background-repeat: no-repeat;
    background-size: contain;
}

.baloon_text
{
    width: 599px;
    height: 20px;
    outline: none;
    resize: none;
    border-color: #999999;
    background-color: #FFFFFF;
    padding: 5px;
    display: block;
}

.baloon_testemunho
{
    width: 459px;
    height: 40px;
    outline: none;
    resize: none;
    border-color: #999999;
    background-color: #FFFFFF;
    padding: 5px;
    display: block;
}

.baloon_comentario
{
    width: 420px;
    height: 15px;
    outline: none;
    resize: none;
    border-color: #999999;
    background-color: #FFFFFF;
    padding: 5px;
    display: block;
    color: #000000;
    font-size: 8pt;
}

.baloon_mensagem
{
    font-family: 'lucida grande',tahoma,verdana,arial,sans-serif;
    font-size: 10pt;
    color: #000000;
    width: 408px;
    height: 60px;
    outline: none;
    resize: none;
    border-color: #999999;
    background-color: #FFFFFF;
    padding: 5px;
    margin-bottom: 5px;
    display: block;
}

#bloco_butoes
{
    display: none;
    background-color: #e9e9e9;
    height: 35px;
    padding: 5px;
}

/* With this container you can put the textbox anywhere on the page,
 without disturbing the triangles's absolute positioning */
.fbContainer{
  position: relative;
}

/* block element needed to apply :before and :after */
.facebookTriangle{
  height: 30px;
  padding-top: 10px;
}


/* white triangle */
/* collapsing borders (because of the empty content) 
   creates four triangles, three transparents and one coloured, 
   the bottom one */    
.facebookTriangle:before {
  content: '';
  border-style: solid;
  border-width: 7px;
  border-color: rgba(255,255,255,0) rgba(255,255,255,0) 
                white rgba(255,255,255,0);
  top: -3px;
  position: absolute;
  left: 7px;
  z-index: 2; /* stay in front */
}


/* gray triangle */
/* used as border for white triangle */
.facebookTriangle:after {
  content: '';
  border-style: solid;
  border-width: 7px;
  border-color: rgba(255,255,255,0) rgba(255,255,255,0) 
                #888 rgba(255,255,255,0);
  top: -4px;
  position: absolute;
  left: 7px;
  z-index: 1; /* stay behind */
}

/* links */
a {
    color: #ff4800;
    text-decoration: none;
    cursor: pointer;
}
a:hover {
    text-decoration: underline;
    cursor: pointer;
}

.etiqueta
{
    display: inline-block;
    color: #31506a;
    background-color: #d4dee2;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #9cbbcb;
    margin: 1px 3px 7px 3px;
    padding: 1px 3px;
    
    font-size: 10pt;
    font-family: "Helvetica Neue","HelveticaNeue",Helvetica,Arial,sans-serif;
    font-weight: bold;
}

.etiqueta_pequena
{
    display: inline-block;
    color: #31506a;
    background-color: #d4dee2;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #9cbbcb;
    margin: 1px 3px 7px 3px;
    padding: 1px 3px;
    
    font-size: 8pt;
    font-family: "Helvetica Neue","HelveticaNeue",Helvetica,Arial,sans-serif;
    font-weight: bold;
}

.etiqueta:hover
{
    opacity: 0.6;
    text-decoration: none;
}

.etiqueta_pequena:hover
{
    opacity: 0.6;
    text-decoration: none;
}

.link_artigo {
   color: #004db3;
   -moz-transition: all 0.2s linear;
   -webkit-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   transition: all 0.2s linear;
   font-weight: bold;
}

.link_artigo:hover {
   color: #ff4800;
}

.link_find_ppl {
   color: #FFFFFF;
   -moz-transition: all 0.2s linear;
   -webkit-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   transition: all 0.2s linear;
}

.link_find_ppl:hover {
   color: yellow;
}

a.linkclaro
{
	color: #999999;
 	background-color: transparent;
 	text-decoration: none;
 	font-weight: bold;
}
a.linkclaro:visited { color: #999999; } /* visited link */
a.linkclaro:hover { color: #FFFFFF; } /* mouse over link */
a.linkclaro:active { color: #999999; } /* selected link */

.div_sombreado
{
    display: block;
    color: #000000;
    margin: 1px 0px 7px 3px;
    padding: 1px 3px;
    
    font-size: 10pt;
    font-family: "Helvetica Neue","HelveticaNeue",Helvetica,Arial,sans-serif;
}

.div_sombreado:hover
{
    cursor: pointer;
    background-color: #e7f7f3;
    text-decoration: none;
}

.div_sombreado_seleccionado
{
    display: block;
    color: #000000;
    margin: 1px 0px 7px 3px;
    padding: 1px 3px;
    
    font-size: 10pt;
    font-family: "Helvetica Neue","HelveticaNeue",Helvetica,Arial,sans-serif;
    
    background-color: #d8dfea;
    font-weight: bold;
}

.div_sombreado_seleccionado:hover
{
    cursor: pointer;
    text-decoration: none;
}

.div_mensagem
{
    display: block;
    color: #000000;
    border-top: 1px solid #CCCCCC;
    border-left: 1px solid #CCCCCC;

    font-size: 10pt;
    font-family: "Helvetica Neue","HelveticaNeue",Helvetica,Arial,sans-serif;
}

.div_mensagem:hover
{
    cursor: pointer;
    background-color: #eef4f4;
    text-decoration: none;
}

.div_mensagem_nao_lida
{
    display: block;
    color: #000000;
    border-top: 1px solid #CCCCCC;
    border-left: 1px solid #CCCCCC;

    background-color: #f8f9ce;
    font-size: 10pt;
    font-family: "Helvetica Neue","HelveticaNeue",Helvetica,Arial,sans-serif;
}

.div_mensagem_nao_lida:hover
{
    cursor: pointer;
    background-color: #eef4f4;
    text-decoration: none;
}

.div_mensagem_seleccionado
{
    display: block;
    color: #000000;
    border-top: 1px solid #CCCCCC;
    border-left: 1px solid #CCCCCC;
    
    font-size: 10pt;
    font-family: "Helvetica Neue","HelveticaNeue",Helvetica,Arial,sans-serif;
    
    background-color: #d8dfea;
    font-weight: bold;
}

.div_mensagem_seleccionado:hover
{
    cursor: pointer;
    background-color: #eef4f4;
    text-decoration: none;
}

.div_perfil
{
    display: inline;
    color: #003366;
    font-weight: bold;
    padding: 8px 15px 8px 15px;
    margin: 0px;
    border-right: 1px solid #CCCCCC;
    
    font-size: 9pt;
    font-family: Verdana, Helvetica,Arial, sans-serif;
}
.div_perfil_primeiro
{
    border-left: 1px solid #CCCCCC;
}
.div_perfil_seleccionado
{
    color: #333333;
    font-weight: bold;
    border-bottom: 2px solid #FFCC00;
    padding: 8px 15px 6px 15px;
}

.div_perfil:hover
{
    cursor: pointer;
    background-color: #e7f7f3;
    text-decoration: none;
}

/* inputs */
input[type=text], input[type=password]
{
    font-family: monospace;
    color: #666600;
    background-color: #ffff99; 
    border: 2px solid #669900; 
    padding: 2px;
    margin: 0 0 1px 0;
}

.perfil
{
    color: #666600 !important;
    background-color: #f2f8ff !important;
    border: 1px solid #6666ff !important;
}

select
{
    font-family: Verdana, Helvetica,Arial, sans-serif;
    color: #666600;
    background-color: #ffff99; 
    border: 1px solid #669900; 
    padding: 2px;
    margin: 0 0 1px 0;
}

.select_area
{
    font-size: 8pt;
}

.select_hotel
{
    font-size: 9pt;
    font-family: Verdana, Helvetica,Arial, sans-serif;
    color: #666600;
    background-color: #ffff99; 
    border: 1px solid #666600; 
    padding: 2px;
}

.caixa_registo
{
    font-size: 14pt;
    width: 300px;
}

/* sombras para imagens */
.bigshadow {
	background: url("../imagens/sombras2.png") no-repeat scroll -1180px -15px transparent;
	padding-top:1.4em;
	margin-top:0;
}

.mediumshadow {
	background: url("../imagens/sombras2.png") no-repeat scroll -970px -15px transparent;
	padding-top:1.4em;
	margin-top:0;
}

.smallshadow {
	background: url("../imagens/sombras2.png") no-repeat scroll -1650px 88px transparent;
	padding-bottom:2.4em;
        margin-top:0;
}

.minishadow {
	background: url("../imagens/sombras2.png") no-repeat scroll -1786px bottom transparent;
	padding-bottom:1em;
	margin-top:0;
}

/* Gradiente do header */
.gradiente_fundo_header 
{
    background-color: #806600; /* fallback color if gradients are not supported */  

    background-image: -webkit-gradient(linear, left top, left bottom, from(#806600), to(#FFCC00));
    background-image: -webkit-linear-gradient(top, #806600, #FFCC00); /* chrome */
    background-image:    -moz-linear-gradient(top, #806600, #FFCC00);
    background-image:     -ms-linear-gradient(top, #806600, #FFCC00);
    background-image:      -o-linear-gradient(top, #806600, #FFCC00);
    background-image:         linear-gradient(to bottom, #806600, #FFCC00); /* current standard, but unimplemented and subject to change */
  
}

/* CAIXA DE PESQUISA PRINCIPAL */
#searchbox
{
    width:150px;
    height: 20px;
    border:solid 1px #FFFFFF;
    background-color: #FFFFFF;
    outline: none;
    font-family: Verdana, "Helvetica Neue","HelveticaNeue",Helvetica,Arial,sans-serif;
    font-size: 0.75rem;
    color: #000000;
}
#display
{
    width:297px;
    display:none;
    float:right;
    margin-right: 0px;
    overflow:hidden;
    position:absolute;
    z-index:1001;
    border-bottom: 1px solid #003366;
}
.display_box
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    padding:4px;
    border-top: 1px solid #dedede;
    color:#000000;
    height:30px;
    background:#FFFFFF;
    z-index:1001;
}

.display_box:hover
{
    background:#3b5998;
    color:#FFFFFF;
    cursor: pointer;
}

.facebook_button_on
{
    background: url("../imagens/fb_share_on.png") no-repeat transparent;
    width: 24px;
    height: 24px;
    cursor: pointer;
}

.facebook_button_off
{
    background: url("../imagens/fb_share_off.png") no-repeat transparent;
    width: 24px;
    height: 24px;
    cursor: pointer;
}

.photo img, picture
{
    max-width: 100%;
    height: auto;
    display: block;
}

.cabecalho { background-color: #000000; }
.bandeira { width: 22px; border: 0; }

#slideshow_principal { /*display: none;*/ z-index: 1; position: relative; padding-top: 15px; padding-bottom: 15px; }

@media (max-width: 605px) {
    .bandeira {
        width: 15px;
   }
}

.preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, #f7e26b, #e9c949);
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .loader {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.2);
    position: relative;
  }
  
  .loader::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 4px solid #fff;
    border-top: 4px solid #98c949;
    animation: spin 1s linear infinite;
  }

  .no-scroll { overflow: hidden; }
  
  @keyframes spin {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }

.slide { position: relative; }
.slidedivtexto
{
    position: absolute; top: 70%; left: 5%;
    line-height: 1.5;
    text-shadow: 1px 1px 2px black;
    font-weight: bold;
    padding-right: 10px;
}
.slidetitulo
{
    font-family: Verdana, Geneva, sans-serif;
    font-size: 2vw;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
    text-transform: uppercase;
}
.slidedescricao
{
    color: #FFFFFF;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 1vw;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
    text-transform: uppercase;
}
.slide img {
    width: 100%; max-width: 1200px; height: auto; aspect-ratio: 5/3;
}

.coluna_direita { width: 100%; }

@media (max-width: 480px) { /* Mobile devices – 320px — 480px */
    .coluna_direita { width: 100%; padding-left: 0px; }
    #facebook_page_container { width: 300px; }
}
@media (min-width: 481px) { /* iPads, Tablets – 481px — 768px */
    #facebook_page_container { width: 300px; }
}
@media (max-width: 600px) {
    #vmap { width: 300px; height: 225px; }
    #facebook_page_container { width: 300px; }
    .slidedivtexto { top: 60%; }
    .slidetitulo { font-size: 0.8rem;  }
    .slidedescricao { font-size: 0.6rem; }
}
@media (min-width: 601px) {
    #vmap { width: 180px; height: 135px; }
    #facebook_page_container { width: 300px; }
}
@media (min-width: 768px) { /* Small screens, laptops – 769px — 1024px */
    #vmap { width: 240px; height: 180px; }
    #facebook_page_container { width: 300px; }
}
@media (min-width: 1024px) { /* Desktops, large screens – 1025px — 1200px */
    #vmap { width: 320px; height: 240px; }
    #facebook_page_container { width: 500px; }
}
@media (min-width: 1200px) { /* Extra large screens, TV – 1201px, and more */
    #vmap { width: 400px; height: 300px; }
    #facebook_page_container { width: 500px; }
}

.map-container-responsive {
position: relative;
overflow: hidden;
padding-top: 56.25%; /* This is a 16:9 aspect ratio */
}

.map-container-responsive iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 0;
}

.responsive-square-img {
    object-fit: cover;        /* Ensures the image fills the square area without distortion */
    width: 100%;              /* Makes the width responsive */
    max-width: 300px;         /* Sets the maximum width to 300px */
    height: auto;             /* Maintains the aspect ratio */
    aspect-ratio: 1 / 1;      /* Forces the image to stay square in modern browsers */
}
@supports not (aspect-ratio: 1 / 1) { /* Fallback for Older Browsers */
    .responsive-square-img {
        width: 100%;
        max-width: 300px;
        height: 300px; /* Explicit fallback height */
    }
}