*{
box-sizing: border-box;
}

html, body {
width: 100%;
height: 100%;
padding: 0;
margin: 0;
font-size: 17px;
overflow: auto;
}


/*HOME*/
body#home aside#background {
position: fixed;
top: 0;
right: 0;
width: 100%;
height: 100%;
z-index: -1000;
}
body#home header {
float: left;
margin-top: 6em;
}
body#home header h1 {
font-size: 1em;
margin-bottom: 1em;
clear: both;
margin-left: 17.8em;
}
body#home header h1 img {
width: 36em;
float: left;
}
body#home header menu {
clear: both;
float: left;
padding: 0;
margin: 0;
}
body#home header menu section {
float: left;
margin-top: 2em;
clear: both;
}

body#home header menu section.works {
margin-left: 19.8em;
}
body#home header menu section.exhibitions {
margin-left: 14.4em;
}
body#home header menu section.biography {
margin-left: 25.3em;
margin-left: 22.75em;
margin-left: 15.9em;
}
body#home header menu section.artists-books {
margin-left: 18.7em;
}
body#home header menu section.artists-books {
margin-left: 17.6em;
}

body#home header menu section a {
padding: 0.25em 0.5em;
margin: 0;
float: left;
font-size: 1.5em;
}



/*Gallery*/
body#gallery menu{
position: fixed;
right: 9.2em;
bottom: 0;
font-size: 1em;
margin: 0;
}
body#gallery menu section{
float: left;
}
body#gallery menu section a {
padding: 1em 0.5em;
margin: 0;
float: left;
}
body#gallery menu section a img {
height: 0.9em;
}
body#gallery menu section a span.exhibitions, 
body#gallery menu section a.menu-separator {
display: none;
}

body#gallery h1 {
z-index: 1000;
font-size: 1em;
position: fixed;
right: 8.5em;
bottom: 3em;
}
body#gallery h1 img.pires-vieira {
float: left;
height: 5em;
margin-bottom: 1em;
}
body#gallery h1 img.works-heading {
float: left;
clear: left;
height: 2em;
}
body#gallery h1 img.recent-heading {
float: left;
clear: left;
height: 1.8em;
}
body#gallery h1 img.exhibitions-heading {
float: left;
height: 1.8em;
}
body#gallery.works-on-paper h1 img.exhibitions-heading {
float: left;
height: 1.8em;
clear: left;
}
body#gallery h1 img.artistsbooks-heading {
clear: left;
float: left;
height: 1.8em;
}
body#gallery article section {
position: fixed;
width: calc(90% - 20em);
right: 20em;
margin: 0;
padding: 1em;
top: 0;
height: calc(100% - 10em);
overflow: hidden;
flex-direction: column;
align-items: center;
justify-content: center;
}
body#gallery article section figure {

margin: 0 auto;
padding: 0;
width: 100%;
height: 100%;
overflow: hidden;
display: flex;
flex-direction: column;
align-items: center;
/*justify-content: center;*/
}
body#gallery article section figure img,
body#gallery article section figure video {
height: calc(100% - 2em);
height: calc(100% - 5em);
}
body#gallery article section figure figcaption {
margin: 0.5em 0 0 0;


padding: 0;

}
body#gallery article section figure figcaption p {
font-size: 0.75em;
margin: 0;
height: 9em;
}

body#gallery nav {
z-index: 10000;
}
body#gallery nav a.previous {
position: fixed;
right: 90%;
top: calc(50% - 7em);
}
body#gallery nav a.next {
z-index: 10000;
position: fixed;
right: 19em;
top: calc(50% - 7em);
}
body#gallery nav section#arrows a.previous img, body#gallery nav section#arrows a.next img {
width: 1em;
}

body#gallery nav section#quicklinks {
position: fixed;
top: 4em;
right: 7em;
width: 10em;
height: calc(100% - 19em);
}
body#gallery nav section#quicklinks a {

}

body#gallery nav section#quicklinks a img {
float: left;
clear: none;
height: 2em;
height: 1.5em;
width: calc(20% - 0.4em);
margin:0.2em;
object-fit: cover;
}

body#gallery nav section#links-list {
position: fixed;
top: 4em;
right: 1em;
width: 17em;
height: calc(100% - 19em);
}
body#gallery nav section#links-list a.exhibition-link {
font-size: 0.65em;
float: left;
clear: left;
}
body#gallery nav section#links-list aside#quicklinks {
width: 100%;
float: left;
clear: left;
}
body#gallery nav section#links-list aside#quicklinks a img {
float: left;
clear: none;
height: 2em;
width: calc(25% - 0.4em);
margin:0.2em;
object-fit: cover;
}


/*Catalogue*/
body#catalogue menu{
position: fixed;
right: 9.2em;
bottom: 0;
font-size: 1em;
margin: 0;
}
body#catalogue menu section{
float: left;
}
body#catalogue menu section a {
padding: 1em 0.5em;
margin: 0;
float: left;
}
body#catalogue menu section a img {
height: 0.9em;
}
body#catalogue menu section a span.exhibitions, body#catalogue menu section a.menu-separator {
display: none;
}

body#catalogue h1 {
z-index: 1000;
font-size: 1em;
position: fixed;
right: 8.5em;
bottom: 3em;
}
body#catalogue h1 img.pires-vieira {
float: left;
height: 5em;
margin-bottom: 1em;
}
body#catalogue h1 img.works-heading {
float: left;
clear: left;
height: 2em;
}
body#catalogue h1 img.recent-heading {
float: left;
clear: left;
height: 1.8em;
}
body#catalogue h1 img.exhibitions-heading {
float: left;
height: 1.8em;
}
body#catalogue h1 img.artistsbooks-heading {
clear: left;
float: left;
height: 1.8em;
}
body#catalogue iframe {
position: fixed;
width: calc(90% - 30em);
right: 30em;
margin: 0;
padding: 1em;
top: 0;
height: calc(100% - 10em);
border: none;
}

body#catalogue nav section#links-list {
position: fixed;
top: 4em;
right: 1em;
width: 17em;
height: calc(100% - 19em);
}
body#catalogue nav section#links-list a.catalogue-link {
font-size: 0.65em;
float: left;
clear: left;
}

/*Upcoming*/
body#upcoming menu{
position: fixed;
right: 9.2em;
bottom: 0;
font-size: 1em;
margin: 0;
}
body#upcoming menu section{
float: left;
}
body#upcoming menu section a {
padding: 1em 0.5em;
margin: 0;
float: left;
}
body#upcoming menu section a img {
height: 0.9em;
}
body#upcoming menu section a span.exhibitions, body#upcoming menu section a.menu-separator {
display: none;
}

body#upcoming h1 {
z-index: 1000;
font-size: 1em;
position: fixed;
right: 8.5em;
bottom: 3em;
}
body#upcoming h1 img.pires-vieira {
float: left;
height: 5em;
margin-bottom: 1em;
}
body#upcoming h1 img.upcoming-heading {
float: left;
clear: left;
height: 1.8em;
}
body#upcoming h1 img.exhibitions-heading {
float: left;
height: 1.8em;
}


/*Biography*/

body#biography menu{
position: fixed;
right: 9.2em;
bottom: 0;
font-size: 1em;
margin: 0;
}
body#biography menu section{
float: left;
}
body#biography menu section a {
padding: 1em 0.5em;
margin: 0;
float: left;
}
body#biography menu section a img {
height: 0.9em;
}
body#biography menu section a .exhibitions, body#biography menu section a.menu-separator {
display: none;
}

body#biography h1 {
z-index: 1000;
font-size: 1em;
position: fixed;
right: 8.5em;
bottom: 3em;
}
body#biography h1 img.pires-vieira {
float: left;
height: 5em;
margin-bottom: 1em;
}
body#biography h1 img.biography {
float: left;
clear: left;
height: 2em;
}

body#biography article {
position: fixed;
width: 40%;
bottom: 3em;
left: 3em;
font-size: 0.9em;
padding: 0.5em 1em;
}
body#biography article p {
page-break-inside: avoid;
}

/*SOCIAL*/
aside#social {
position: fixed;
top: 1em;
right: 1em;
}
aside#social a {
padding: 0.5em;
margin: 0 -0.25em;
float: left;
}
aside#social a img {
height: 1em;
}


/*CONTACT*/
aside#contact-screen{
font-size: 1em;
z-index: 1000;
position: fixed;
top:0;
left: 0;
width: 100%;
height: 100%;
backdrop-filter: blur(0rem);
pointer-events: none;
opacity: 0;
transition: all 1s ease;
}
aside#contact-screen[data-status="active"] {
    
pointer-events: all;
backdrop-filter: blur(1rem);
opacity: 1;
}

form#contact-form{
font-size: 1em;
z-index: 1000;
position: fixed;
width: 25%;
top:50%;
left: 50%;
padding: 1em;
transform: translate(-50%, -50%);
}

form#contact-form input {
font-size: 0.75em;
width: 100%;
padding: 0.25em 0.5em;
margin: 0.25em 0;
}
form#contact-form input[type="checkbox"] {
    width: min-content;
}
#form-rgpd-text,
#contactos-rgpd {
    font-size: 0.9rem;
    margin: 0.25rem 0;
}
form#contact-form a,
form#contact-form a:visited {
    color: #e5e6e7;
    text-decoration: underline;
}
form#contact-form a:focus,
form#contact-form a:hover,
form#contact-form a:active {
    color: #e5e6e7;
    text-decoration: none;
}
#contactos-aviso {
  text-align: center;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 0rem;
  transition: all 0.5s ease;
  overflow: hidden;
}
#contactos-aviso[data-status="active"] {
    
  height: 2rem;
}
#contactos-nome {
  float: left;
  width: calc(100% - 1.25rem) !important;
}
form#contact-form textarea {
font-size: 0.75em;
width: 100%;
max-width: 100%;
min-height: 5em;
padding: 0.25em 0.5em;
margin: 0.25em 0;
}
form#contact-form input.contact-url {
display: none;
}
form#contact-form input.contact-name {
width: calc(100% - 1.5em);

}
form#contact-form input.button {
  font-weight: bold;
  font-size: 0.9rem;
}
form#contact-form a.contact-close {
font-size: 0.75em;
padding: 0.25em 0.5em;
margin: 0.25em 0;
float: right;
width: 1.5em;
}
form#contact-form a.contact-close img {
width: 1em;
}

/*FOOTER*/
footer {
width: 100%;
float:left;
bottom: 0;
left: 0;
padding: 0.5em 5%;
font-size: 0.75em;
}

/*OTHER*/
menu.hide-70 a.menu-70, 
menu.hide-80 .menu-80, 
menu.hide-90 .menu-90, 
menu.hide-00 .menu-00, 
menu.hide-10 .menu-10, 
menu.hide-recent .menu-recent, 
menu.hide-upcoming .menu-upcoming, 
menu.hide-artistsbooks .artists-books .menu-separator, 
menu.hide-artistsbooks .menu-artists-books, 
menu.hide-biography .biography .menu-biography, 
menu.hide-biography .biography .menu-separator, 
menu.hide-catalogue .menu-catalogue, 
menu.hide-works-on-paper .menu-works-on-paper {
display: none;
}

/*CONTRUCTION*/
body.construction {
background-image: url(../images/construction.png);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
body.construction nav, body.construction article {
display: none;
}

#menu-open, #menu-exit {
display: none;
}
#menu-extra {
display: none;
}


#popup-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    backdrop-filter: blur(16px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}
#popup-video-exit {
  position: absolute;
  top: 1rem;
  right: 1rem;
  background: transparent;
  border: 0;
  font-size: 2rem;
  color: #fff;
  cursor: pointer;
}
#popup-video-video {
  height: calc(100vh - 2rem);
  max-width: calc(100vw - 2rem);
}

#cookie-bar {
  background: rgba(35, 31, 32, 0.25);
  position: fixed;
  padding: 0.5rem 1rem;
  bottom: 1rem;
  right: 1rem;
  width: 15rem;
  z-index: 10000;
  color: #fff;
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: center;
  backdrop-filter: blur(1rem);
  animation: 1s cookies-fade both ease 4s;
}
@keyframes cookies-fade {
    0%  {opacity: 0;}
    100%{opacity: 1;}
    
}
body.body-light #cookie-bar {
  background: rgba(255, 255, 255, 0.25);
  color: #231f20;
}
#cookie-bar p {
  font-size: 0.7rem;
  width: 100%;
  margin: 0;
}
#cookie-bar h2 {
  font-size: 0.9rem;
  text-align: left;
  width: 100%;
  margin: 0;
}
.cookie-button {
  padding: 0.5rem 1rem;
  background: #FFFFFF;
  border: 1px solid #FFFFFF;
  color: #231f20;
  cursor: pointer;
  margin-top: auto;
  font-size: 0.7rem;
  min-width: max-content;
  width: calc(50% - 0.25rem);
}
#cookie-refuse {
  background: rgba(35, 31, 32, 0.25);
  border: 1px solid #FFFFFF;
  color: #FFFFFF;
}
body.body-light .cookie-button {
  background: rgba(255, 255, 255, 0.25);
  border: 1px solid rgba(35, 31, 32, 0.25);
  color: #231f20;
}
body.body-light #cookie-refuse {
  background: rgba(255, 255, 255, 0.25);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: #231f20;
}
[hidden] {
    display: none !important;
}
[disabled="true"] {
    pointer-events: none !important;
}