@font-face {
    font-family: "Raleway";
    src: url('../fonts/Raleway/Raleway-Regular.ttf');
}

@font-face {
    font-family: "Raleway Medium";
    src: url('../fonts/Raleway/Raleway-Medium.ttf');
}

@font-face {
    font-family: "Raleway Semibold";
    src: url('../fonts/Raleway/Raleway-SemiBold.ttf');
}

@font-face {
    font-family: "Raleway Bold";
    src: url('../fonts/Raleway/Raleway-Bold.ttf');
}

:root {
    --color-primary: #B8293D;
    --color-grey: #B5B5B5;
    --font-regular: "Raleway";
    --font-medium: "Raleway Medium";
    --font-semibold: "Raleway Semibold";
    --font-bold: "Raleway Bold";
}

html { font-size:62.5%; }
body { font-size:1.6rem; font-family:var(--font-regular); }
header { padding-top:2rem; padding-bottom:2rem; }
figure { margin:0; }
img { max-width:100%; }
h1,h2,h3,h4 { color:var(--color-primary); font-family:var(--font-medium); font-weight:normal; }
a { color:#000; }
a:hover { color:var(--color-primary); }

.color-primary { color:var(--color-primary); }
.background-primary { background-color:var(--color-primary); }

.figure-caption figcaption { font-size:1rem; color:#989898; margin-top:0.5rem; }
.figure-caption img { width:auto; }

.logo a { color:#000; font-size:2rem; text-transform:uppercase; font-family:var(--font-medium); text-decoration:none; }
.logo.active a { color:var(--color-primary); }
.navbar { background-color:#fff; }
.navbar ul li a { color:#000; font-family:var(--font-medium); font-size:1.6rem; }
.navbar-nav .show > .nav-link, .navbar-nav .nav-link.active { color:var(--color-primary); }
.link-admin { padding:1rem; font-size:1rem; }

.nav-switch ul { list-style-type:none; margin-left:0; padding-left:0; display:flex; align-items:stretch; justify-content:end; }
.nav-switch ul li a { padding:1rem 2rem; border-radius:0; background-color:var(--color-primary); color:#fff; border:1px solid transparent; border-right:1px solid #fff; height:100%; font-weight:normal; font-size:1.2rem; font-family:var(--font-medium); }
.nav-switch ul li a.active { color:var(--color-primary);  border:1px solid var(--color-primary);  }
.nav-switch ul li:not(:first-child) a.active { margin-left:-1px; }
/* .nav-switch ul li:first-child a { border-right:1px solid transparent; } */

.btn-link { color:var(--color-primary); text-decoration:none; }

.it-carousel-wrapper.it-carousel-landscape-abstract-three-cols-arrow-visible .splide__arrows .splide__arrow { background-color:#fff; background-image:url('../images/svg/arrow-right.svg'); background-repeat:no-repeat; background-position:center; background-size:1.8rem 1.5rem; }
.it-carousel-wrapper.it-carousel-landscape-abstract-three-cols-arrow-visible .splide__arrows .splide__arrow svg { display:none; }
.it-carousel-wrapper.it-carousel-landscape-abstract-three-cols-arrow-visible .splide__pagination { display:block; text-align:center; }
.it-carousel-wrapper .splide__pagination button { width:1rem; height:1rem; }
.it-carousel-wrapper.it-carousel-landscape-abstract-three-cols-arrow-visible .splide__pagination__page { background-color:var(--color-grey); }
.it-carousel-wrapper.it-carousel-landscape-abstract-three-cols-arrow-visible .splide__pagination__page.is-active { background-color:var(--color-primary); }

.modal { background-color:#0004; }

.tobii-zoom__icon { background-color:transparent !important; }
.tobii-zoom__icon svg { stroke:none !important; }
.tobii-zoom__icon svg path { fill:var(--color-grey) !important; }

#main .accordion-button { border-color:var(--color-grey); padding-left:0; padding-right:0; font-size:1.6rem; color:#000; font-family:var(--font-bold); font-weight:normal; }
#main .accordion-button:hover { text-decoration:none; }
#main .accordion-button:focus { border-color:var(--color-grey) !important; }
#main .accordion-button::after { width:1.8rem; height:0.65rem; content:url('../images/svg/chevron-down-grey.svg'); transform:scaleY(1); }
#main .accordion-button:not(.collapsed)::after { transform:scaleY(-1); }
#main .accordion-body { font-size:1.2rem; line-height:150%; padding-left:0; padding-right:0; }
.accordion-body h3 { font-size:1.5rem; }
.accordion-body h4 { font-size:1.3rem; }

#homepage figure { max-width:150rem; margin:0 auto; }

#opere { padding-top:5rem; padding-bottom:5rem; }
#opere h2 { text-transform:uppercase; font-size:2.5rem; }
#opere ul { list-style-type:none; padding-left:0; margin-left:0; margin-top:2rem; }
#opere li { margin-bottom:2rem; }
#opere li a { color:#000; text-decoration:none; font-size:1.4rem; font-family:var(--font-medium); }
#opere .figure-caption figcaption { text-align:center; }

#dettaglio-opere h2 { font-size:1.4rem; }
#dettaglio-opere aside ul { margin-left:0; padding-left:0; list-style-type:none; display:flex; }
#dettaglio-opere aside li a { color:#000; text-decoration:none; font-size:1.5rem; font-family:var(--font-medium); }
#dettaglio-opere aside li { position:relative; }
#dettaglio-opere aside li::before { content:" "; background-color:#686868; border-radius:50%; width:1.6rem; height:1.6rem; left:-0.8rem; position:absolute; top:0; }
#dettaglio-opere aside li.active::before { background-color:var(--color-primary); }
#dettaglio-opere aside li.active a { font-family:var(--font-bold); }
#dettaglio-opere p { font-size:1.2rem; }
#dettaglio-opere .elenco-opere { margin-left:0; padding-left:0; list-style-type:none; }
#dettaglio-opere .elenco-opere img { width:100%; height:auto; border:1px solid var(--color-grey); padding:1rem; aspect-ratio:1/1; object-fit:contain; }
#dettaglio-opere .elenco-opere figcaption { color:#000; margin-top:0.5rem; }
#dettaglio-opere .elenco-opere figcaption h3 { font-size:1.2rem; line-height:normal; margin-bottom:0.25rem; }
#dettaglio-opere .elenco-opere a { text-decoration:none; color:#000; }
#dettaglio-opere .elenco-opere figcaption p { font-size:1rem; }
#dettaglio-opere .nav-switch { margin-bottom:4rem; }

#opera { padding-top:5rem; padding-bottom:5rem; }
#opera nav ul { list-style-type:none; margin-left:0; padding-left:0; }
#opera nav li { display:inline-block; vertical-align:middle; margin-right:1rem; padding-right:1rem; border-right:1px solid #000; }
#opera nav li:last-child { margin-right:0; padding-right:0; border-right:0; }
#opera nav li a { color:var(--color-primary); text-decoration:none; }
#opera h1 { font-size:2rem; color:var(--color-primary); margin-bottom:2rem; }
#opera .dati { margin-top:3rem; }
#opera .dati strong, #opera .dati span { display:block; }
#opera .grid-opera .grid-col:nth-child(1) img { border:1px solid var(--color-grey); padding:1rem; }
#opera #accordion-caratteristiche { margin-top:3rem; }
#opera .opere-connesse ul { list-style-type:none; margin-left:0; padding-left:0; }
#opera .opere-connesse .d-grid { gap:1rem; }
#opera .opere-connesse a { color:#000; text-decoration:none; font-size:1.2rem; display:block; }
#opera .opere-connesse figcaption { margin-top:0.5rem; line-height:normal; }
#opera .accordion-body { padding-left:2rem; padding-right:2rem; }
#opera ul.no-carousel { display:flex; padding-left:0; margin-left:0; list-style-type:none; gap:1rem; }
#opera ul.no-carousel li img { max-width:20rem; }

#esposizioni { padding-top:5rem; }
#esposizioni ul { list-style-type:none; margin-left:0; padding-left:0; }
#esposizioni li { margin-bottom:2rem; }
#esposizioni li a { color:#000; text-decoration:none; font-size:1.4rem; font-family:var(--font-medium); }
#esposizioni .figure-caption { text-align:right; }

#esposizioni-tipo { padding-top:5rem; padding-bottom:5rem; }
#esposizioni-tipo .nav-switch { padding-bottom:3rem; }
#esposizioni-tipo .nav-switch ul { justify-content:start; }
#esposizioni-tipo h2 { color:#000; font-size:1.6rem; padding-bottom:1rem; border-bottom:1px solid var(--color-primary); margin-bottom:4rem; }
#esposizioni-tipo h3 { color:var(--color-primary); font-size:1.4rem; font-family:var(--font-bold); font-weight:normal; }

#biografia { padding-top:5rem; }
#biografia .figure-caption { text-align:center; margin-bottom:5rem; }
#biografia iframe { max-width:100%; height:auto; }
#biografia h3 { margin-top:0; margin-bottom:0; }
#biografia .accordion { border-bottom:0; }
#biografia .accordion-item:last-child button { border-bottom:1px solid var(--color-grey); border-radius:0; }
#biografia .interviste h3 { font-size:1.6rem; }
#biografia .biografia-breve iframe { width:100%; min-height:30rem; }

#bibliografia { padding-top:5rem; }
#bibliografia ul { list-style-type:none; margin-left:0; padding-left:0; }
#bibliografia li { margin-bottom:2rem; }
#bibliografia li a { color:#000; text-decoration:none; font-size:1.4rem; font-family:var(--font-medium); }
#bibliografia .figure-caption { text-align:left; }

#bibliografia-tipo { padding-top:5rem; padding-bottom:5rem; }
#bibliografia-tipo .nav-switch { margin-bottom:4rem; }
#bibliografia-tipo .nav-switch ul { justify-content:start; }
#bibliografia-tipo p, #bibliografia-tipo li { font-size:1.2rem; }
#bibliografia-tipo strong { color:var(--color-primary); font-family:var(--font-bold); font-weight:normal; }
#bibliografia-tipo h4 { font-family:var(--font-bold); font-weight:normal; font-size:1.4rem; }

#archivio-pubblico { padding-top:5rem; padding-bottom:5rem; }

#contatti { padding-top:8rem; padding-bottom:2rem; }
#contatti p { font-size:1.5rem; }
#contatti .credits { font-size:1.25rem; border-top:1px solid var(--color-primary); padding-top:3rem; margin-top:8rem; }

.esposizione-multimedia { display:flex; align-items:center; gap:0; padding-left:0; margin-left:0; list-style-type:none; }
.esposizione-multimedia li a { display:block; border-right:1px solid var(--color-grey); padding:0.2rem 1rem; }
.esposizione-multimedia li:last-child a { border-right:0; }

footer { color:#686868; font-size:1.4rem; margin-top:5rem; }
footer p { font-size:1.4rem; }
footer a { color:#686868; text-decoration:underline; }

@media screen and (max-width:767.98px) {
    #dettaglio-opere .elenco-opere li { margin-bottom:4rem; }
    #dettaglio-opere .elenco-opere figure { border:1px solid var(--color-grey); }
    #dettaglio-opere .elenco-opere figure img { border:0; }
    #dettaglio-opere .elenco-opere figcaption { text-align:center; }

    #biografia .interviste .grid-col { margin-bottom:2rem; }
    #biografia .interviste iframe { min-height:30rem; }

    #opere .figure-caption { display:none; }

    #bibliografia .figure-caption { order:2; margin-top:2rem; }

    #esposizioni .figure-caption { text-align:center; margin-top:2rem; }  
    
    #bibliografia-tipo .nav-switch ul { justify-content:center; }
}

@media screen and (min-width:768px) {
    header > .d-grid { grid-template-columns:18.6rem 1fr; align-items:center; gap:2rem; }
    .navbar ul { gap:1.5rem; }

    #dettaglio-opere .elenco-opere { display:grid; grid-template-columns:repeat(2, 1fr); gap:2rem; }
    #opera .opere-connesse .d-grid { grid-template-columns:repeat(2, 1fr); }

    #esposizioni .d-grid { grid-template-columns:repeat(2, 1fr); gap:1rem; }
    #esposizioni img { width:100%; }

    #biografia .interviste { grid-template-columns:repeat(2, 50%); align-items:start; gap:2rem; }
    #biografia .interviste iframe { min-height:18rem; }

    #bibliografia .d-grid { grid-template-columns:repeat(2, 1fr); gap:1rem; align-items:center; }
    #bibliografia img { width:100%; }

    #archivio-pubblico .d-grid { grid-template-columns:1fr 25rem; gap:2rem; }
}

@media screen and (max-width:991.98px) {
    p, ul, ol, dl { font-size:1.2rem; }

    header > .d-grid { grid-template-columns:1fr 4rem; }
    #navigationbar { position:fixed; top:6rem; left:0; padding-left:1rem; padding-right:1rem; background-color:#fff; width:100%; z-index:1000; }
    #navigationbar a { padding-top:1rem; padding-bottom:1rem; }

    #dettaglio-opere aside { margin-top:2rem; }
    #dettaglio-opere aside ul { justify-content:space-between; }
    #dettaglio-opere aside li { padding-right:1.5rem; border-top:1px solid #686868; padding-top:2rem; width:100%; }
    #dettaglio-opere aside li::before { top:-0.8rem; }
    #dettaglio-opere aside li a { font-size:1.2rem; }

    #opera .grid-opera:nth-child(2) .grid-col:nth-child(1) img { max-width:20rem; }
    #opera .dati div { margin-bottom:1rem; }
}

@media screen and (min-width:992px) {
    header.container { max-width:85rem; }
    main { min-height:70vh; }

    #opere .grid-3-cols { grid-template-columns:1fr 1fr 1fr; gap:1rem; }
    #opere .grid-3-cols .grid-col:last-child { padding-left:20rem; }

    .container { max-width:120rem; }
    .container-smaller { max-width:70rem; }

    #dettaglio-opere > .d-grid { grid-template-columns:3.5fr 6.5fr; gap:15rem; }
    #dettaglio-opere aside { margin-top:3rem; }
    #dettaglio-opere aside ul { display:block; }
    #dettaglio-opere aside li { padding-bottom:5rem; padding-left:2rem; border-left:1px solid #686868; }
    #dettaglio-opere aside li::before { content:" "; left:-0.8rem; }
    #dettaglio-opere aside li:first-child { padding-top:5rem; }
    #dettaglio-opere aside li:first-child::before { top:5rem; }
    #dettaglio-opere .elenco-opere { grid-template-columns:repeat(2, 1fr); }

    /* #opera > .container { max-width:85rem; } */
    #opera .grid-opera { grid-template-columns:25% 75%; }
    #opera .grid-opera:nth-child(1) { align-items:baseline; }
    #opera .grid-opera .grid-col:nth-child(2) { padding-left:8rem; }
    #opera .dati { display:grid; grid-template-columns:repeat(2, 1fr); font-size:1.2rem; row-gap:2rem; }
    #opera .opere-connesse .d-grid { grid-template-columns:repeat(3, 1fr); }

    #esposizioni .d-grid { grid-template-columns:auto 38rem; align-items:center; justify-content:center; gap:3rem; }

    #esposizioni-tipo h2 { max-width:80%; }

    /* #biografia > .container { max-width:85rem; } */
    #biografia h2 { max-width:85rem; margin-left:auto; margin-right:auto; }
    #biografia .figure-caption { margin-bottom:8rem; }
    #biografia .interviste { column-gap:10rem; }
    #biografia .biografia-breve iframe { min-height:50rem; }

    #bibliografia .d-grid { gap:3rem; grid-template-columns:60rem auto; align-items:center; justify-content:center; }

    #bibliografia-tipo .nav-switch { margin-bottom:6rem; }

    #archivio-pubblico .d-grid { grid-template-columns:1fr 45rem; gap:3rem; }
    
}