﻿/*CSS versão 11/12.04.16 - correções fluidez mobile*/
/*
@font-face {font-family: 'Arvo'; font-style: normal; font-weight: 400; src: local('Arvo'), url(https://fonts.gstatic.com/s/arvo/v13/tDbD2oWUg0MKqScQ7Q.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face {font-family: 'Arvo'; font-style: normal; font-weight: 700; src: local('Arvo Bold'), local('Arvo-Bold'), url(https://fonts.gstatic.com/s/arvo/v13/tDbM2oWUg0MKoZw1-LPK8w.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
*/
@import url('https://fonts.googleapis.com/css?family=Arvo:400,700&display=swap');
/* ----------------------------------------------------- */
/* ////////////////// BASE / Semântica ///////////////// */
/* ////////////////// BASE / Semântica ///////////////// */
/* ////////////////// BASE / Semântica ///////////////// */
/* ----------------------------------------------------- */

/* */
h1, h2, h3, h4, h5, h6, div, p, ul, table, 
header, section, footer, aside, nav, main, article, figure /*tags HTML5*/ {
    display: block;     
    border: 0;
    outline: 0;
    /*border: 1px solid transparent;*/
}

body, html { /* garantindo ajustamento conteúdos mínimos */
    min-height: 100%;
    margin: 0;
}
body {
    width: 100%;
    color: #626262; /*Cinza definido pelo Designer*/
    margin: 0;
    padding: 0;
    /*font: 100% Arvo, Serif, Times New Roman; /*1em*/
    /* font-weight: normal;*/
    font-family: Arvo, serif;
    font-weight: 400;
    font-size: 1em;
    line-height: 130%;
    /*text-align: center; centra os conteúdos -DIVs- na página*/  
}
h1 {font-size: 125%;}
h2 {font-size: 110%;}
h3 {font-size: 90%;}
h4 {font-size: 80%;}
h5 {font-size: 70%;}
h6 {font-size: 60%;}
img { /*retira o border em todas as imagens - verificar se algum sitio requer border */
   border: 0;
}
p {
	text-align: left;
}
p, span, li {
	font-size: 90%;
}
ul {
	list-style-type: none;
	display: block;
} 
/*a {}*/
a:link, a:visited {
    text-decoration: none;
    color: #626262;
    font-weight: bold;
}
a:hover, a:active, a.activeItem {
    color: silver;
}
a:hover img, a:active img {
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
    filter:alpha(opacity=60);
    opacity:0.6;
}
* {font-family: Arvo !important;} /* força a fonte em todos os itens */



/* Página Inicial Microsites */
/* Página Inicial Microsites */
/* Página Inicial Microsites */

#slideArea { 
    padding: 0;
    margin: 0;
    /*position: absolute;*/
    top: 0;
    left: 0;
    z-index: -1;
    position: fixed;
    min-width: 100%;
    height: 100%;
}

#slideArea img {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    vertical-align: middle;
    min-height: 100%;
    min-width: 100%;
}

#slideArea img.activo {
    z-index: 3;
}

.semSlide { /*???*/
    background-color: #383838;
}

.semMenus { /*???*/
    min-height: 80vh !important;
}

#textoAreaTematica {
    min-height: 100vh;
}
.link_home, .link_menu {
    outline: none;
    display: inline-block;
}
.link_home {
    margin-bottom: 1em;
    margin-top: 2.8em;
}
.link_menu {
    margin-bottom: 2.8em;
    margin-top: 2.8em;
}

#textoAreaTematica div {
    width: 90%;
    max-width: 930px;
    margin-left: auto;
    margin-right: auto;
}
.Entrada_area {
    /*display: inline;*/
    display: block;
    font-size: 3.75rem; 
    line-height: 100%;
    color: #FFFFFF;
    white-space: nowrap;   
    margin: 0 0 0.2em 0;

    /*font-size: 10vm; formatação IE9*/
    /*font-size: 4.6vmax; IE9 nop!!!*/
    /*font-size: 4.6vw; formatação todos excepto grande resolução - new breakpoint - por causa nowrap */
}

#textoAreaTematica div p {
    font-size: 1.25rem;
    /*font-size: 2vw;*/
    text-align: center;
    line-height: 125%;
    color: #FFFFFF;
    margin: 0 0 1em 0;
}

p.assinaturaArea {font-size: 0.95em !important;}

.link_menu svg circle {
    fill: #AB84A2;
    cursor: pointer;
}

.link_menu:hover {
    opacity: 0.7;
}

.link_home:hover, #menuMicrosite ul a:hover {
    opacity: 0.6;
}

#menuAreaTematica {
    background-color: #75556D;
    opacity: 0.92;
    min-height: 100vh;
    border: 1px solid transparent;
}

#menuAreaTematica ul {
    list-style: none;
    width: auto;
    max-width: 930px;
    margin-left: auto;
    margin-right: auto; 
    padding: 0 0 5em 0;
    min-height: 100%;
    margin-top: 1.8em;
    
}

#menuAreaTematica ul a {
    text-decoration: none;
    color: #FFFFFF;
    font-weight: 700;
    display: inline-block;
    width: 100%;
    font-size: 1.7em;
    line-height: 120%;
    outline: none;
    margin: 0 0 0.5em 0;
}

#menuAreaTematica ul a:hover {
    opacity: 0.7;
}

#pnRedesSociais {
    background-color: #383838;
    overflow: hidden;
    min-height: 20vh;
    margin:0;
}

#pnRedesSociais {
    display: flex; /* IE9 nop!!! */
    justify-content: center;
    padding-top: 2%; /*compromisso com IE9*/
    padding-bottom: 2%; /*compromisso com IE9*/
}

.fb-like {
    align-self: center;
}


/* Página Inicial Microsites */
/* Página Inicial Microsites */


/* ----------------------------------------------------- */
/* ///////////////// Genéricos Paginação /////////////// */
/* ///////////////// Genéricos Paginação /////////////// */
/* ///////////////// Genéricos Paginação /////////////// */
/* ----------------------------------------------------- */
.hide {
	display: none; /*!!! Não se aplica às DIVs de informação ao utilizadores com TEcnol.Apoio pois não é lida */
	}
.infoApoio { /* para passar informação aos utilizadores com TEcnol.Apoio sem estar visivel na página */
	left: 0;
	top: -10em;	
	width: 0;
	height: 0;
	position: absolute; 
	overflow: hidden;
	}
.alignRight {	
    float: right;
    }
.alignLeft {	
    float: left;
}
.PAGE { /* definindo margens da página / mancha de conteúdos */
    margin: auto;
    padding: 0;
    border: 0;
    width: 90%;
    max-width: 60em; /*960px - ajustado com sitio cm*/
    max-width: 58em; /*max-width: 930px; ajustando com layout definido*/
    min-width: 330px; /*indo com leitura acessível até Mobile S(mall) zoom:100%*/
    height: auto; 
}
.margem_topo {
    /*clear: both;*/
    margin-top: 9em; /*7.6*/
    height: auto;
}
.espacamento {
    margin-top: 1.3em; 
    margin-bottom: 1.3em;
}
/* ----------------------------------------------------- */
/* //////////////////       TOPO       ///////////////// */
/* //////////////////       TOPO       ///////////////// */
/* //////////////////       TOPO       ///////////////// */
/* ----------------------------------------------------- */
a.absoluteTop { /* Obrigatório - para fixar as ancoras por causa do topo FIXO */
	top: 0;
	position: absolute; 
}   
header {
	width: 100%;
    background-color: #272a2c; /*Cor base - VARIÁVEL conforme ID body [área selecionada]*/
	color: white;
	top:0;
    margin: 0;
    height: auto; 
    padding-top: 1.6em; 
    padding-bottom: 1.6em; 
    position: fixed;/*fixa o topo*/
    z-index: 90001 !important; /*fundamental para passar por cima das div em posição "absolute"*/
    display: block;
}   
header img {
    vertical-align: middle;
} 
header div.alignRight {
    padding-top: 1em; 
    padding-bottom: 0.8em; 
}
header div.alignRight a {
    color: White;
    font-size: 75%;
    font-weight: normal;
    white-space: nowrap;
    display: inline-block;
}
header .alignRight img {
    margin-left: 1em;
    margin-bottom: 0.2em;
    width: 35px;
    height: 35px;
}


.nav-background { /* define painel fundo da navegação principal */
    border-style: none;
    border-color: inherit;
    border-width: 0;
    background-color: black; 
    opacity: 0.9;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 900001;
    text-align: center;
    filter: alpha(opacity=90);
}
a.nav-float { /* area para onclick e fechar painel fundo */
    position: fixed; 
    top: 0; 
    left: 0; 
    border: 0; 
    width: 100%; 
    height: 100%; 
    z-index: 900001;    
padding-bottom: 10%;
}
/*#navMenu .nav-float {position: static; display: inline-flex;} tags Flex IE 9 nao funciona
.nav-background, .nav-float {min-height: 100%;}*/

ul.nav-itens { /* lista itens menu principal 
   max-width: 40%; 
   min-width: 28em; 
   margin: 10% auto;
   padding: 0;
   z-index: 900002 !important;
   position: relative;
   min-height: 100%; */
    position: relative;
    max-width: 600px; 
   width: 90%; 
   margin: 8% auto;
   max-height:90%;
   z-index: 900002 !important;
   padding-left:0;
}

ul.nav-itens li { /**/
    font-size: 150%;
    line-height: 120%;
    font-weight:700;
}
ul.nav-itens a {/**/
    color: white;
    display:inline-block;
    width: 100%;
    height: 100%;
    padding: 0.3em 0;
}
ul.nav-itens a:hover,
ul.nav-itens a.activo {color: #569FE7; background-color: transparent;} 


/* formatação 2 colunas - PAGINAS CONTEUDOS */
/*section {float: left; width: 32%;}*/
section {float: left; width: 30%; clear: left;}
/*article {width: 65%; margin-left: 35%;} ajustado ao sítio*/
article {width: 66%; margin-left: 34.1%;} /*para max 612px ajustado layout definido*/

/* formatacao da section e lista indice conteúdo */
/*section#treeBox {}*/
h1.Titulo_principal {line-height: 120%; margin-top:0.5em;}
            
div.menuConteudo ul.ulBase {display: none;}
div.menuConteudo ul {margin: 0; padding: 0; display: block;}
div.menuConteudo ul {margin-top: 0.5em;}
div.menuConteudo ul li {margin-bottom: 0.5em;}
div.menuConteudo ul ul {display: none; margin-left: 2em;}
div.menuConteudo li li {font-size: 1em;} /* forçando mesmo aspecto nível anterior - não muito correcto */


/* formatação dos conteudos - PAGINAS CONTEUDOS */
/*article * {}*/

article div {font-size: 1rem !important;} /* repor tamanho fonte dentro das divs no artigo 
ATENÇAO: parece não sobrepor-se ao definido BO - VERIFICAR versao dinâmica*/
/*article div:not(.bx-sliderConteudo) {font-size: 14px !important; border: 1px solid red;} 
com os px funciona mas obriga a reformatação individual - rever root? px? -*/

article h2 {padding-top:0.8em;}
/*article p {padding:0; margin:0;}*/
article p {padding:0; margin: 0 0 1em 0;} /* p espaçado (+ correcto) mas colado aos titulos */
article h3, article h4, article h5, article h6 {padding-top: 0.5em; margin-bottom: 0;}
article div, article img, article table, article ul /*, article iframe*/ {margin-top: 1.3em; margin-bottom:1.3em;} /* */
/* article div, article img, article table, article ul, article iframe {margin-bottom:1.3em;} DD */

article * img {width:auto !important; height:auto !important; max-width: 100%;}

/*article div.bx-sliderConteudo {margin-top: 1.3em !important; margin-bottom: 1.3em !important;}*/
article div.bx-sliderConteudo {overflow: auto; height: 3em;}
/*article div.bx-sliderConteudo+h3 {margin-top: 3rem !important;}*/ /*AB 20161123 forçando espaçamento h3 após slider*/
article div.bx-sliderConteudo div {margin-top: 0 !important; margin-bottom: 0 !important;}
.bx-sliderConteudo {max-width: 100% !important; position: relative; /*height: 0 !important;*/ /*padding-bottom:65%;*/}
.bx-sliderConteudo * {margin-top: 0 !important; margin-bottom: 0 !important;}
.bx-sliderConteudo>div {position: absolute !important; width: 100% !important; height: 100% !important;}
.bx-sliderConteudo ul {height: 100% !important; position: absolute !important; width: 100% !important;}
.bx-sliderConteudo ul li {height: 100% !important; width: 100% !important;} /**/
.bx-viewport {min-height: 398px;}
.bx-sliderConteudo img {min-width: 100%;}
/*.bx-sliderConteudo ul li {width: 100% !important;}  DD */

.bx-sliderConteudo * {vertical-align: middle !important; margin: auto !important;} /*tentando forçar imgs centradas altura por causa do enquadramento*/

.bx-sliderConteudo {padding-bottom:58.75%;} /*reajustando para altura máxima 360px ao layout de 930px max larg. page*/
.bx-controls-direction a {top:45% !important;} /*sobrepondo para centrar setas navegação*/


article table * {margin: auto; padding: 0;} /* DD padding auto gera erro */
article ul {padding-left: 0; margin-top: 1.3em; margin-bottom:1.3em; list-style-type: none;}
article li {padding-left: 0;} /* mas é melhor espaçar - melhora leitura!*/
article ul.lista-formatada li:before {content: "›"; padding-right: 4px;} /* Inserindo marca definida no design */

article iframe {width:100% !important;}/*height:100% !important;}*/
.video iframe {z-index: 10 !important;} /*forçando z-index pq IE coloca-o por cima do topo*/
article .video {position: relative; max-width:100%; height:0; padding: 0; padding-bottom:56% /*65%*/;}
article .mapa {position: relative; max-width:100%; height:0; padding-bottom:37%;}
.video iframe, .mapa iframe {position: absolute !important; padding: 0; margin-top:0 !important; margin-bottom:0 !important; width:100% !important; height:100% !important;}

article div.simplebox, article div.simplebox-child {border-top: 1px solid white; border-bottom: 1px solid white; margin-top: 0; margin-bottom: 0; background-color:#eee;}
article div.simplebox * {margin-top: 0; margin-bottom: 0;} /* para o caso de não haver div "class harmonio" antes  */
article div.simplebox .simplebox-title, article div.simplebox-child .simplebox-child-title {color:White; line-height: 125%; padding: 0.8em;}
article div.simplebox-content, article div.simplebox-child-content {padding: 0.8em;}

footer.espacamento {margin-top: 3em; margin-bottom: 1.3em;} 
article footer * {margin-top: 0; margin-bottom: 0;} 
article .fb-like {float: left;}
article .fb-like iframe {height: 20px !important;} /* DD */
article .links_fundo_conteudo {float: left; outline: medium none; padding-right: 4px;}
article .links_fundo_conteudo img {vertical-align: bottom;}
article input.links_fundo_conteudo {border: 1px solid transparent;}
article iframe {border: 0 none currentcolor;}
article div#divLink {font-size: 0.7em; float: right;}
article div#divLink input[type="text"] {border: 0.1em solid #626262; font-size: 1em; width: 19em;}

/* LINKS NA AREA DOS CONTEUDOS - ARTICLE */
article ul a {color: silver; font-weight: normal;}
article a, article a:link, article a:visited {text-decoration: underline; font-weight: normal;}
article a:hover, article a:active {color: black;} /*****!!!*****/
article a img {vertical-align: middle; margin: 0.4em;}
article a.link-formatado, article a.link-formatado:link, article a.link-formatado:visited {text-decoration: none; color: #626262; font-size: 0.8em; font-weight: 700;}/*****!!!*****/
article a.link-formatado:hover, article a.link-formatado:active {color: silver;}
article a.link-cor {text-decoration: none; font-size: 1em; font-weight: 700;}


/*Acrescentando as sugestões Daniel -aplica-se no harmonio (simplebox)- embora possivelmente não vai ser necessário 
dada a reformatação dos conteúdos conforme visto com Hugo - redefinir a partir da root*/
div[contenteditable="false"] {margin-top: 0; margin-bottom: 0;} /* DD */
p + div, div + p {margin-top: 1.3em !important;} /* DD */


/* --------- FINAL -------- */
/* design responsivo - especificidades - ajustável a qq dispositivo - verificar */

/*@media only screen and (orientation: portrait) and (max-width: 720px) */
@media only screen and (orientation: portrait) {
    h1, section, article {width:100%; float:left; margin:auto;}
    #textoAreaTematica div p {font-size: 1rem;} 
    p.assinaturaArea {font-size: 90% !important;}
    h1.Entrada_area {font-size: 6vw;}
    #menuAreaTematica ul {width: 80vw;}
    #menuAreaTematica ul a {font-size: 4vw;}/**/
    h1.Titulo_principal, section {margin-bottom: 1em;}
    article {margin-top: 1em;}
    /*article *, iframe {max-width:100% !important; height:auto !important;}*/
    article *, iframe {max-width:100% !important;} /* DD */
    article table * {width:auto !important; height:auto !important; max-width:100% !important;}
    article * img {width:auto !important; height:auto !important; max-width: 100%;}
/***********ajustando comportamento slider*/
.bx-sliderConteudo div {position: absolute !important; width: 100% !important; height: 100% !important;}
.bx-sliderConteudo ul li {vertical-align: middle !important; margin-top: auto !important; margin-bottom: auto !important;} 
.bx-sliderConteudo ul li img {width: 100% !important; vertical-align: middle !important; } 
.bx-sliderConteudo ul li {width: 100% !important;}
/************/
}

@media only screen and (max-width: 400px) {
    section, article {width:100%; float:left; margin:auto;}
    h1.Entrada_area {font-size: 6vw;}
    #textoAreaTematica div p {font-size: 1.1rem;}/**/
    h1.Titulo_principal, section {margin-bottom: 1em;}
    article {margin-top: 1em;}
    /*article *, iframe {max-width:100% !important; height:auto !important;}*/
    article *, iframe {max-width:100% !important;} /* DD */
    article table * {width:auto !important; height:auto !important; max-width:100% !important;}
    article * img {width:auto !important; height:auto !important; max-width: 100%;}
/***********ajustando comportamento slider*/
.bx-sliderConteudo div {position: absolute !important; width: 100% !important; height: 100% !important;}
.bx-sliderConteudo ul li {vertical-align: middle !important; margin-top: auto !important; margin-bottom: auto !important;} 
.bx-sliderConteudo ul li img {width: 100% !important; vertical-align: middle !important; } 
.bx-sliderConteudo ul li {width: 100% !important;}
/************/
}

/* Consentimento Cookies */
#cookieConsent {background-color: #222222; min-height: 26px; font-size: 14px; color: #ffffff; line-height: 26px; padding: 8px 0 8px 30px; font-family: "Trebuchet MS",Helvetica,sans-serif; position: fixed; bottom: 0; left: 0; right: 0; display: none; z-index: 9999; text-align: left;}
#cookieConsent a {color: #569FE7; text-decoration: none;}
#cookieConsent a.cookieConsentOK {background-color: #f1d600; color: #000000; border-radius: 5px; padding: 0 20px; float: right; margin: 0 30px 0 10px; cursor: pointer;}
#cookieConsent a.cookieConsentOK:hover {background-color: #ffffff;}
/* Consentimento Cookies Fim */    
/* --------- FINAL -------- */