/* style.css */
body {font-family: Arial, sans-serif;line-height: 1.6;margin: 0;padding: 0;background-color: #f4f4f4;min-height: 100%;}
header { position: fixed;width: 100%;height:3vh;background: #f4f4f4;color: #3333;padding:0.3rem;text-align: center;border-bottom:#555555 solid 1px ;}
nav {clear: both; background-color:transparent;color:#555555;padding: 0 0 0;z-index: 99; font-size: 132%;}
nav a, nav a:link, nav a:visited {color: #555555;cursor: pointer;text-decoration: none;}
nav>ul {list-style: none;text-align: center; margin: 0 auto; padding: 0;}
nav>ul>li {display: inline-block;padding: 0 1em;font-weight:bold;}
nav>figure {display:none}

footer { clear: both; position:fixed;bottom:2px;width: 100%; display: block;overflow: none;height:2vh;background: #f4f4f4;color: #555555;text-align: center;padding:0;}
footer div {clear: both; margin:0;}
footer  p {width:50%;text-align: center;float: left; margin:0;padding:0px;font-size:80%;}
main { padding:0;z-index:69}


main>section {height:100vh;width:100%;}
main article {padding: 6vh 16% 4vh;height:90vh;overflow: auto;}

main figure {margin:0;padding:0;}
main figure>img {width:100%;}

main article>figure.entrada {  display: flex; justify-content: center; align-items: center; height:90vh; }
main article>figure.entrada img {max-height:85vh;max-width:85vh;}

main article.sala>figure{width:100%;height:100%;background-size: cover;background-repeat:no-repeat;}
main article.sala figcaption {line-height:1.2; padding:80vh 0 0 16px;color:#fff}
main article.sala figcaption>b {font-size:150%;}

main article.raons {padding: 0vh 16% 0vh;height:100vh;}
main article.raons>div {padding:2vh 0px 0 160px;height:96vh;display: flex; justify-content: center; align-items: center;}
main article.raons>div>div {font-size:100%; padding: 4px 16px; background:#eeeeeeff}

main article.artista {font-size:90%;}
main article.artista>figure2 {width:100%;height:500px; display: flex; justify-content: center; align-items: center; overflow: hidden;}
main article.artista>figure>img2 {max-height: 100%;width:100%;object-fit: cover;}

main article.artista>div h2 {margin-bottom:0px;}
main article.artista>div p {margin:0px;}
.blocArt {display:flex; gap:32px;padding:16px 0}
.art {width: 50%;}
.none {display: none;}
/* Estils per aside */
aside {display:none;z-index:90;position:fixed;left:0px;top:0em;width:100vw;height:100vh;background-color:#ffffffee;color:#666;font-size:175%;line-height: 1.1;}
aside article {overflow: hidden;}
article.navImg {position: absolute;top:5vh;width: 100%; height: 90vh; overflow: hidden;background-color: transparent;z-index: 95;}
article.navImg>div {width: 30%; height: 100%; display: inline-block;  padding: 80vh 32px 0;cursor: pointer;}
#carousel {position: absolute;top: 4%;height: 90%;left: 10%;width: 80%;/*background-color:#900;*/display:block;}


#imgView {width: 100%; height: 85vh; display: flex; justify-content: center; align-items: center; overflow: hidden;}
#imgView>img {max-width: 100%; max-height: 70%; object-fit: contain;width: 100%; height: 100%; }
#imgTitle {position: absolute;bottom:2vh;width:100%;  text-align: left;}
#imgTitle>small {font-size:70%; display:block;}
#imgNext, #imgPlay, #imgPrev {position:absolute; width:40%;height:60%;font-size: 200%;cursor: pointer; /*background-color: #900;*/}
#imgPrev {left:0;}
#imgNext {right: 0em;text-align: right;}
/* */

@media (orientation : landscape) and (max-width:1499px) {
main    article {padding: 6vh 4% 4vh;height:90vh;}
main    article.raons {padding: 0vh 4% 0vh;height:100vh;}
}
@media (orientation : landscape) and (max-width:1025px) {
header { height:6vh;padding:0.1rem;line-height: 1.1;}
nav>ul>li {display:inline-block;font-size: 80%;}
footer { bottom:8px;height:2vh;}
main article.sala figcaption {line-height:1.1; padding:70vh 0 0 16px;}
main article.sala figcaption>b {font-size:120%;}
main article.raons>div {padding:33vh 0px 0 0px;}
}
@media (orientation : portrait) {
header {font-size: 85%;}
nav>ul>li {padding: 0 0.5em;}
main article {padding: 6vh 4% 4vh;height:90vh;}
main  article.raons {padding: 0vh 4% 0vh;height:100vh;}
}
@media (orientation : portrait) and (max-width:750px) {
header {font-size: 50%;}
#menuIcon {margin:0;padding:4px 8px 0 8px;display:block}
nav>ul {text-align: left; background-color: #f4f4f4;}
nav>ul>li {display:block;}
#menuList {display:none;}
header:hover #menuList {display:block;}
/*footer p:nth-child(2) {display:none;}*/
footer {font-size: small;}
main article.raons>div {padding:16vh 0px 0 0px;font-size:80%}
.art {width:100%}
.blocArt {display:block; font-size:80%}
aside {font-size:120%}
}

@media print {
header, footer, section#contentLeft, section#contentRight {display:none;}

.notPrint {display: none;}
}