/* ----------------------------------- ELEMENTOS SEM A SUA PRÓPRIA PÁGINA DE ESTILO */

body, textarea, input {
   font-family: Georgia, Cambria, "Times New Roman", serif;
   font-size: medium;
   color: white;
}

body {
   background-color: rgb(68, 82,135);
}

@media print /* , screen */ {

/* inclua 'screen' temporariamente para poder tirar fotografias do ecrã */

   body {
      background-color: white;
      margin: 0px;
   }

   body, textarea, input {
      color: rgb(42, 60,110);
   }

}/* ------------------------------------------------------------- CLASSES DE ESTILOS */

.título {
   font-size: x-large;
   font-variant: small-caps;
}

.nome {
   /* white-space: nowrap; */
}

.conteúdo {
   text-align: justify;
}

.foraDoEcrã {
   border-top: 3px solid rgb(173, 185,246);
   border-left: 3px solid rgb(93, 107,162);
   border-right: 3px solid rgb(42, 60,110);
   border-bottom: 3px solid rgb(42, 60,110);
}

.dentroNoEcrã { /* <!-- o conteúdo mexe para direita e baixo para dar a impressão que após um clique efetivamente "entra" no ecrã --> */
   border-bottom: 2px solid rgb(173, 185,246);
   border-right: 2px solid rgb(93, 107,162);
   border-left: 4px solid rgb(42, 60,110);
   border-top: 4px solid rgb(42, 60,110);
}

.noEcrã { /* <!-- não para botões, antes para imagens e div's --> */
   border-bottom: 4px solid rgb(173, 185,246);
   border-right: 4px solid rgb(93, 107,162);
   border-left: 4px solid rgb(42, 60,110);
   border-top: 4px solid rgb(42, 60,110);
}

/* ---------------------------------------------------------------- PARÁGRAFOS <p/> */

p.info, .info p, .descontados p {
   font-size: x-small;
   color: rgb(173, 185,246);
   margin: 0px;
   padding: 0px;
}

p.promoção {
   height:60px;
   background: url('/img/cupão.png') no-repeat center; /* a altura da imagem é 60px */
   margin-bottom: 5px;
}

.descrições p.info, .imagens p.info, .descontados p.info  { /* descontados p.info desde 20111230 */
   text-align: right;
}

p#ampliar {
   display: none; /* ativado quando imagens foram carregadas */
   padding: 0px 25px;
}

div.mais_informações p { /* div.promoção p  */
   text-align: center;
}

div.mais_informações p:first-child {
   padding-top: 5px;
   border-top: 2px groove rgb(93, 107,162);
}

div.reação p {
   padding: 10px 25px;
   color: rgb(42, 60,110);
   background-color: white;
}

.navegação p {
   padding: 3px 0px;
}

.navegar p {
   padding: 0px;
   /* background-color: green; */
}

.publicidade p {
   font-size: smaller;
   color: rgb(173, 185,246);
}

p.coroa {
   margin-top: 5px;
   margin-bottom: 0px;
}

.ligações-externas p {
   margin: 0px;
   padding-bottom: 10px;
}

/* ---------------------------------------------------------------- <span/> */

span.slôgane {
   font-size: large;
   font-variant: small-caps;
}

span.promoção {
   color: orange;
}

/* ------------------------------------------------------------- HIPERLIGAÇÕES <a/> */

a {
   color: white;
}

.promoção a.cupão {
   color: rgb(42, 60,110);
   position: relative; /* em relação ao seu contentor */
   top: 33%; /* ver p.css; este p tem uma imagem como fundo de 60px de altura */
}

.ligações a {
   font-size: small;
}

.navegação .passeios a {
   text-decoration: none;
   background-color: white;
   color: rgb(68, 82,135);
   font-size: small;
}

@media print /* , screen */ {

/* inclua 'screen' temporariamente para poder tirar fotografias do ecrã */

   a {
      color: rgb(42, 60,110);
   }

}

/* ----------------------------------------------------------------- IMAGENS <img/> */

.fotografias-grandes img {
   width: 315px;
   height: 210px;
   border: 10px solid rgb(93, 107,162);
}

.fotografias-médias img {
   width: 233px;
   height: 155px;
   border: 7px solid rgb(93, 107,162);
}

.fotografias-pequenas img {
   width: 150px;
   height: 100px;
   border: 5px solid rgb(93, 107,162);
}

.fotografias-mínimas img {
   width: 100px;
   height: 67px;
   border: 5px solid rgb(93, 107,162);
}

.sem-quadro img {
   border: none;
}

img.quadro, img.balão {
   position: absolute;
   display: none;
   z-index: 1;
}

img.balão {
   width: 150px;
   height: 102px;
}

img.voo-ida {
   cursor: url("/img/avião-ida.ico"); /*, url('/img/avião.cur');*/
}

img.voo-volta {
   cursor: url("/img/avião-volta.ico"); /*, url('/img/avião.cur');*/
}

.destinatário img {
   margin: 5px;
}

.navegação img {
   width: 150px;
   height: 100px;
}

.bandeiras img {
   width: 39px;
   height: 26px;
   /* border: 2px solid white; */
}

.bandeirinhas img, img.bandeirinhas {
   width: 26px;
   height: 17px;
}

.encontrados .bandeirinhas img {
   border: 1px solid rgb(42, 60,110);
}

.panorama img {
   border: 0px;
}

.publicidade img {
   float: left;
   margin: 0 10px 5px 0;
}

img#coroa {
   width: 80px;
   height: 36px;
   border: 0px;
}

img.miniatura {
   border: none;
   width: auto;
   height: auto; /* similar às fotos mínimas */
}

/* ----------------------------------------------------- DIVISÕES DE PÁGINAS <div/> */

/*
Esta página de estilo contem elementos <div> sem mais especificações.
P.e. uma especificação "div.imagens table" iria em table.css
*/

div {
   /* border: 1px solid green; */
}

div.logótipo, div.imagem, div.cupão, div.promoção, div.título, div.pedidos, div.ligações-externas, div.ligações, div.mapa, div.álbum, div.localização, div.paypal, div.mais_informações {
   text-align: center;
}

div.imagens, div.descontados { /* div.descontados desde 20111230 */
   padding: 0px 10%;
}

/*
div.cupão {
   margin: 0px 30%;
   padding: 2px 5px;
   color: rgb(42, 60,110);
   background-color: rgb(173, 185,246);
   font-size: smaller;
}
*/

div.descrições, div.publicidade, div.promoção {
   padding: 10px 25% 0px;
}

/*
div.ligações {
   padding: 0px 5%;
}
*/ /* desde 20110808 porque temos muitas ligações na página da música pt · ver também table.css*/

div.encontrados {
   padding: 10px 15% 0px;
}

div.pedidos {
}

div.mais_informações {
   padding: 10px 25% 0px 25%;
}

div.logótipo, div.paypal {
   padding-top: 10px;
}

div.acontecimento, div.precário, div.localização {
   /*padding: 10px 30% 10px 30%;*/ /* até 20110720 */
   padding: 10px 25% 10px 25%;
}

/*div.precário {
   padding-bottom: 10px;
}*/

div.reação {
   display: none; /* padrão */
   position: absolute;
   top: 400px;
   z-index: 3;
   width: 33%;
   color: rgb(42, 60,110);
   background-color: white;
   padding: 5px 10px;
   /* margin-left: 20px; */
   font-size: larger;

}

div.cobertor, div.navegação, div.navegar {
   position: absolute;
   top: 0px;
   left: 0px;
}

div.cobertor, div.navegação, div.cupão {
   display: none;
}

div.cobertor {
   /* width: 500%; /* <!-- muito grande para assegurar que cobra tudo -->*/ /* <!-- já não preciso: a dimensão é sempre calculado em JS --> */
   /* height: 100%; /* <!--  --> */
   background-color: rgb(68, 82,135);
   opacity: 0.90;
   filter: alpha(opacity=90); /* para MSIE */
   z-index: 2;
}

div.navegação, div.autenticação, div.cupão {
   padding: 10px;
}

div.navegar { /* utilizado no menu visível*/
   /*padding: 5px; */
   margin: 5px;
   padding: 0px;
}

div.navegação { /* utilizado no menu invisível*/
   z-index: 3;
}

div.menu {
   margin-left: 25px;
   /*border: 1px dotted red;*/
}

div.autenticação , div.mapa, div.álbum, div.cupão {
   display: none;
   position: absolute;
   z-index: 3;
   top: 0px;
   left: 0px;
}

div.autenticação, div.cupão {
   background-color: rgb(68, 82,135); /* <!-- evita que o fundo seja transparente1 --> */
}

div.mapa div.noEcrã { /* <!-- necessário para o texto no InfoWindow em Google Maps --> */
   color: black;
}/* ------------------------------------------------------------ FORMULÁRIOS <form/> */

div.pedidos form {
}

/* ------------------------------------------------------------ FORMULÁRIOS <form/> */

input.botão {
   background-color: rgb(68, 82,135);
   color: rgb(204, 204,204);
   padding: 1px 6px;
   font-size: smaller;
   margin: 2px;
}

input.campo {
   background-color: rgb(173, 185,246);
   color: rgb(42, 60,110);
   border-top: 2px solid rgb(42, 60,110);
   border-left: 2px solid rgb(42, 60,110);
   border-right: 2px solid rgb(93, 107,162);
   border-bottom: 2px solid rgb(173, 185,246);
}

input.desativo {
   /* border: 2px solid rgb(42, 60,110); */
}/* ----------------------------------------------------- ÁREAS DE TEXTO <textarea/> */

textarea {
   background-color: rgb(173, 185,246);
   color: rgb(42, 60,110);
}

div.pedidos textarea {
/* border: 7px solid rgb(93, 107,162); */
   border-top: 5px solid rgb(42, 60,110);
   border-left: 5px solid rgb(42, 60,110);
   border-right: 5px solid rgb(93, 107,162);
   border-bottom: 5px solid rgb(173, 185,246);
   padding: 10px;
   margin: 5px;
}

/* --------------------------------------------------------------- TABELAS <table/> */

table {
   /* border: 1px solid red; */
}

table.página {
   height: 100%;
   width: 100%;
}

div.imagens table, div.descrições table {
   text-align: center;
}

div.navegação table.passeios {
   width: 50%; /* se a tabela tiver conteúdo maior a 50% adaptar-se-á automaticamente */
}

.passos table, .álbum table {
   width: 100%;
}

table.bandeiras {
   width: 10%; /* adaptar-se-á ao seu conteúdo */
}

.mais_informações table, .acontecimento table, .precário table, .paypal table, .autenticação table, .cupão table {
   /* atenção: comportamento diferente em MSIE e todos os outros; grrr */
   /* width: 100%; em MSIE é erradamente interpretado como 100% da janela; grrrr; segundo a especificação tem de ser 100% do bloco contentor */
   
      
      
         width: 50%;
      
   
}

.ligações table {
   margin-left: auto;
   margin-right: auto;
}

@media print { /* pode adicionar ', screen' para testes de impressão */

   table.página {
      border: 25px solid rgb(68, 82,135);
   }

}/* -------------------------------------------------------- LINHAS DE TABELAS <tr/> */

tr.panorama, tr.visitante, tr.legal, tr.google-conversion { /*, .visitante tr*/
   text-align: center;
   font-size: xx-small;
   color: rgb(172, 172,172);
   height: 1px; /* adaptar-se-á à dimensão da imagem */
}

tr.google-adsense {
   height: 66px; /* isto evita que este tr seja redimensionada quando enchido pela google */
   text-align: center;
   font-size: xx-small;
}



/* ------------------------------------------------------- CÉLULAS DE TABELAS <td/> */

td {
   /* border: 1px solid orange; */
}

td.seta {
   padding: 0px;
   margin: 0px;
   font-size: large;
}

div.imagens td {
   padding: 5px;
}

div.ligações td {
/* padding: 20px 20px 0px 20px; */
   padding: 20px 10px 0px 10px;
   text-align: center;
   vertical-align: top;
}

div.encontrados td, div.descontados td { /* div.descontados desde 20111230 */
   padding: 4px 8px;
   text-align: center; /* <!--desde 20100903; dá-se melhor com a coroa do patrocínio--> */
}

div.pedidos td {
   vertical-align: bottom;
}

.navegação .passos td, .navegação .categorias td  {
   width: 33.333333333333336%;
   text-align: center;
}

.navegação .passos td {
   vertical-align: top;
}

.navegação .categorias td  {
   vertical-align: bottom;
   text-transform: capitalize;
}

table.passeios td {
   background-color: white;
   color: rgb(68, 82,135);
   font-size: small;
}

div.mais_informações td {
   padding: 0px 10px;
   vertical-align: top;
}

.acontecimento td, .precário td, .cupão td {
   padding: 0px 10px;
   font-size: smaller;
   border: 1px solid rgb(42, 60,110);
}

.acontecimento td, .precário td {
   text-align: center;
}

.acontecimento td:first-child, .precário td:first-child {
   width: 75%;
   text-align: right;
}

.autenticação td:first-child, .cupão td:first-child {
   width: 33%;
   text-align: right;
}

/* ------------------------------------------------------------- LISTAS <li/> ----- */

.menu li {
   margin: 0px 0px 10px -25px; /* para que o 'bullet' fique a mesma distância da esquerda que os outros menus */
}
