@import "https://fonts.googleapis.com/css?family=Roboto+Slab:300,400,700";
@import "https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,300italic,400italic";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    -moz-font-feature-settings: inherit;
    -moz-font-language-override: inherit;
    border: 0 none;
    font-family: inherit;
    font-size: 100%;
    font-size-adjust: inherit;
    font-stretch: inherit;
    font-style: inherit;
    font-variant: inherit;
    font-weight: inherit;
    line-height: inherit;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
}
html {
    line-height: 1;
}
ol, ul {
    list-style: none outside none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
caption, th, td {
    font-weight: normal;
    text-align: left;
    vertical-align: middle;
}
q, blockquote {
    quotes: none;
}
q:before, q:after, blockquote:before, blockquote:after {
    content: none;
}
a img {
    border: medium none;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
    display: block;
}
html > body {
    background-color: white;
    background-image: url("../layout/bg-home.jpg");
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: 1920px 1080px;
    color: #333333;
    font-family: "Open Sans",sans-serif;
    font-size: 1em;
    font-weight: 400;
    height: 1080px;
    line-height: 1.3em;
    margin: 0;
    overflow: hidden;
    position: relative;
    width: 1920px;
}
html > body * {
    -moz-user-select: none;
    resize: none;
}
html > body.tesori {
    background-image: url("../layout/ajax-loader-large.gif");
    background-position: center center;
}
html > body.piano-terra {
    background-image: url("../layout/piano-terra.jpg");
    background-position: 0 0;
}
html > body.piano-primo {
    background-image: url("../layout/piano-1.jpg");
    background-position: 0 0;
}
html > body.piano-primo-mezzanino {
    background-image: url("../layout/piano-1.jpg");
    background-position: 0 0;
}
html > body.piano-secondo {
    background-image: url("../layout/piano-2.jpg");
    background-position: 0 0;
}
html > body.piano-secondo-mezzanino {
    background-image: url("../layout/piano-2.jpg");
    background-position: 0 0;
}
html > body.piano-terzo-mm1 {
    background-image: url("../layout/piano-3.jpg");
    background-position: 0 0;
}
html > body.piano-terzo-mm2 {
    background-image: url("../layout/piano-3.jpg");
    background-position: 0 0;
}
html > body.piano-terzo-mm3 {
    background-image: url("../layout/piano-3.jpg");
    background-position: 0 0;
}
html > body.piano-terzo-mm4 {
    background-image: url("../layout/piano-3.jpg");
    background-position: 0 0;
}
/* pagine nuove */
html > body.origini-1351 {
    background-image: url("../layout/bg-home_MM1.jpg");
    background-position: 0 0;
}
html > body.dal-1351-al-1500 {
    background-image: url("../layout/bg-home_MM2.jpg");
    background-position: 0 0;
}
html > body.dal-1500-al-1800 {
    background-image: url("../layout/bg-home_MM3.jpg");
    background-position: 0 0;
}
html > body.dal-1800-a-2000,
html > body.dal-1800-a-2000-b,
html > body.dal-1800-a-2000-f,
html > body.dal-1800-a-2000-l
 {
    background-image: url("../layout/bg-home_MM4.jpg");
    background-position: 0 0;
}
/* pulsanti associati ai piani */
html > body.origini-1351 > .navigazione > ul > li.bottone-1 > a {
	background-color: #8e2c1e;
	color: #fff;
	font-weight: 600;
}

html > body.dal-1351-al-1500 > .navigazione > ul > li.bottone-2 > a {
	background-color: #8e2c1e;
	color: #fff;
	font-weight: 600;
}

html > body.dal-1500-al-1800 > .navigazione > ul > li.bottone-3 > a {
	background-color: #8e2c1e;
	color: #fff;
	font-weight: 600;
}

html > body.dal-1800-a-2000   > .navigazione > ul > li.bottone-4 > a,
html > body.dal-1800-a-2000-b > .navigazione > ul > li.bottone-4 > a,
html > body.dal-1800-a-2000-f > .navigazione > ul > li.bottone-4 > a,
html > body.dal-1800-a-2000-l > .navigazione > ul > li.bottone-4 > a
 {
	background-color: #8e2c1e;
	color: #fff;
	font-weight: 600;
}

html > body sup {
    font-size: 0.7em;
    line-height: 1em;
    vertical-align: top;
}
html > body strong {
    font-weight: 600;
}
html > body strong em {
    font-style: italic;
}
html > body em {
    font-style: italic;
}
html > body em strong {
    font-weight: 600;
}
html > body > iframe {
    background-color: white;
    border: 0 none;
    height: 1080px;
    margin-left: 296px;
    width: 1624px;
}
html > body > .logo {
    background-color: #e6432e;
    height: 683px;
    left: 0;
    padding-left: 90px;
    padding-top: 397px;
    position: absolute;
    top: 0;
    width: 1830px;
    z-index: 999;
}
html > body > .logo.interna > .home-button {
    background-color: #d63b27;
    background-image: url("../layout/button-home.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: auto auto;
    border: 1px solid #eb6958;
    height: 84px;
    left: 105px;
    opacity: 0;
    position: absolute;
    top: 186px;
    transition: opacity 500ms ease 0s;
    width: 84px;
}
html > body > .logo.interna > .home-button.show {
    opacity: 1;
    transition: opacity 500ms ease 0s;
}
html > body > .logo.interna > header {
    left: 0;
    opacity: 0;
    position: absolute;
    text-align: center;
    top: 327px;
    transition: opacity 500ms ease 0s;
    width: 296px;
}
html > body > .logo.interna > header > h1 {
    color: white;
    font-size: 1.25em;
    font-weight: 700;
    line-height: 1.2em;
    margin-left: 5%;
    width: 90%;
}
html > body > .logo.interna > header.show {
    opacity: 1;
    transition: opacity 500ms ease 0s;
}
html > body > .logo.load {
    transition: width 500ms ease 0s;
    width: 206px;
}
html > body > .logo.iframe {
    transition: width 500ms ease 0s;
    width: 206px;
}
html > body > .logo.home {
    transition: width 500ms ease 0s;
    width: 1830px;
}
html > body > .logo.load-home {
    height: 354px;
    left: 1807px;
    padding-left: 0;
    padding-top: 0;
    top: 397px;
    transition: width 750ms ease 0s, left 750ms ease 0s, padding-left 750ms ease 0s, top 500ms ease 750ms, padding-top 500ms ease 750ms, height 500ms ease 750ms;
    width: 113px;
}
html > body > .logo.change {
    height: 683px;
    left: 0;
    padding-left: 90px;
    padding-top: 397px;
    top: 0;
    transition: top 500ms ease 0s, padding-top 500ms ease 0s, height 500ms ease 0s, left 750ms ease 500ms, width 750ms ease 500ms, padding-left 750ms ease 500ms;
    width: 1830px;
}
html > body > .logo-lingua {
    background-color: #e6432e;
    height: 1080px;
    left: 0;
    position: absolute;
    top: 0;
    transition: background-color 500ms ease 0s;
    width: 1920px;
    z-index: 999;
}
html > body > .logo-lingua > figure > img {
    height: 354px;
    left: 90px;
    position: absolute;
    top: 397px;
    width: 113px;
}
html > body > .logo-lingua > figure > img.load {
    height: 750px;
    left: 835px;
    top: 57px;
    transition: width 750ms ease 500ms, height 750ms ease 500ms, top 750ms ease 500ms, left 750ms ease 500ms;
    width: 250px;
}
html > body > .logo-lingua > figure > img.clicked {
    height: 354px;
    left: 90px;
    top: 397px;
    transition: width 750ms ease 500ms, height 750ms ease 500ms, top 750ms ease 500ms, left 750ms ease 500ms;
    width: 113px;
}

html > body > .logo-lingua > .lingue {
    opacity: 0;
    position: absolute;
    transition: opacity 500ms ease 0s;
    width: 100%;
    background-color: rgba(0,0,0,0.5);
    bottom: -160px;
    z-index:5;
}

html > body > .logo-lingua > .lingue.show {
    opacity: 1;
    transition: opacity 500ms ease 0s;
}
html > body > .logo-lingua > .lingue > ul {
    width: 100%;
}

html > body > .logo-lingua > .lingue > ul > li {
    background-color: white;
    margin-bottom: 42px;
   /* padding: 15px 0;*/
    text-align: center;
    transition: background-color 500ms ease 0s;
    width: 250px;
    margin: 20px auto;
}

html > body > .logo-lingua > .lingue > ul > li > a {
    color: #e6432e;
    display: block;
    font-size: 1.313em;
    font-weight: 600;
    padding: 15px 0;
    text-decoration: none;
    text-transform: uppercase;
    transition: color 500ms ease 0s;
}
html > body > .logo-lingua.bianco {
    background-color: white;
    transition: background-color 500ms ease 0s;
}
html > body > .logo-lingua.bianco > .lingue > ul > li {
    background-color: #e6432e;
    transition: background-color 500ms ease 0s;
}
html > body > .logo-lingua.bianco > .lingue > ul > li > a {
    color: white;
    transition: color 500ms ease 0s;
}
html > body > .languages {
    left: 90px;
    position: absolute;
    top: 120px;
    width: 473px;
}
html > body > .languages > ul {
    opacity: 1;
    transition: opacity 500ms ease 0s;
    width: 100%;
}
html > body > .languages > ul.hide {
    opacity: 0;
}
html > body > .languages > ul > li {
    background-color: #efefef;
    display: block;
    float: left;
    font-size: 1.25em;
    font-weight: 600;
    position: relative;
    width: 50%;
}
html > body > .languages > ul > li > a {
    color: black;
    display: block;
    opacity: 0.4;
    padding: 14px 22px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
}
html > body > .languages > ul > li.select {
    background-color: #e6432e;
    box-shadow: 0 0 6px #333333;
    z-index: 1;
}
html > body > .languages > ul > li.select > a {
    color: white;
    opacity: 1;
}
html > body > .navigazione {
    left: 35px;
    position: absolute;
    top: 397px;
    width: 473px;
}
html > body > .navigazione > ul {
    opacity: 1;
    transition: opacity 500ms ease 0s;
    width: 100%;
}
html > body > .navigazione > ul.hide {
    opacity: 0;
}
html > body > .navigazione > ul > li {
    background-color: transparent;
    background-image: url("../layout/bg-button.png");
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: auto auto;
    display: block;
    font-size: 1.313em;
    margin-bottom: 46px;
    overflow: hidden;
    padding-left: 55px;
    width: 100%;
}
html > body > .navigazione > ul > li.bottone-1 {
    background-position: 0 0;
}
html > body > .navigazione > ul > li.bottone-2 {
    background-position: 0 -55px;
}
html > body > .navigazione > ul > li.bottone-3 {
    background-position: 0 -110px;
}
html > body > .navigazione > ul > li.bottone-4 {
    background-position: 0 -165px;
}
html > body > .navigazione > ul > li > a {
    background-color: #e6432e;
    color: white;
    display: block;
    padding: 17px 22px;
    text-decoration: none;
}
html > body > .sito {
    background-color: white;
    height: 1080px;
    left: 296px;
    position: absolute;
    top: 0;
    width: 1624px;
}
html > body > .sito > iframe {
    height: 1080px;
    left: 302px;
    position: absolute;
    top: 0;
    width: 1020px;
}
html > body > div > .intro {
    background-color: white;
    height: 1080px;
    left: 0;
    position: absolute;
    top: 0;
    width: 716px;
}
html > body > div > .intro > .testo {
    left: 105px;
    position: absolute;
    top: 245px;
    width: 542px;
}
html > body > div > .intro > .testo > header > h1 {
    font-family: "Roboto Slab";
    font-size: 2.125em;
    font-weight: 700;
    margin-bottom: 55px;
}
html > body > div > .intro > .testo > p {
    font-size: 1.125em;
    font-weight: 300;
    line-height: 1.4em;
    margin-bottom: 45px;
}
html > body > div > .intro > .vista {
    bottom: 55px;
    left: 105px;
    position: absolute;
    width: 542px;
}
html > body > div > .intro > .vista > ul {
    width: 100%;
}
html > body > div > .intro > .vista > ul > li {
    background-color: #efefef;
    float: left;
    font-family: "Roboto Slab";
    font-size: 1.25em;
    font-weight: 700;
    padding: 15px 0;
    text-align: center;
    width: 50%;
}
html > body > div > .intro > .vista > ul > li.select {
    background-color: #e6432e;
    color: white;
}
html > body > div > .intro > .filtri {
    bottom: 228px;
    left: 105px;
    position: absolute;
    width: 542px;
}
html > body > div > .intro > .filtri > header > h1 {
    font-family: "Roboto Slab";
    font-size: 1.25em;
    font-weight: 700;
    margin-bottom: 40px;
}
html > body > div > .intro > .filtri > ul {
    overflow: auto;
    width: 100%;
}
html > body > div > .intro > .filtri > ul > li {
    float: left;
    margin-bottom: 17px;
    width: 50%;
}
html > body > div > .intro > .filtri > ul > li > span {
    display: inline-block;
    vertical-align: middle;
}
html > body > div > .intro > .filtri > ul > li > span.square {
    background-color: #efefef;
    height: 40px;
    transition: background-color 300ms ease 0s;
    width: 40px;
}
html > body > div > .intro > .filtri > ul > li > span.label {
    font-size: 1.125em;
    margin-left: 14px;
    max-width: 200px;
}
html > body > div > .intro > .filtri > ul > li.select > span.square {
    background-color: #e6432e;
    transition: background-color 300ms ease 0s;
}
html > body > div > .intro > .filtri > ul > li.select > span.label {
    font-weight: 700;
}
html > body > div > .poi {
    background-color: #efefef;
    height: 1080px;
    left: 716px;
    overflow: hidden;
    position: absolute;
    top: 0;
    transition: left 500ms ease 0ms, width 500ms ease 0ms;
    width: 908px;
}
html > body > div > .poi > div {
    height: 1080px;
    left: 0;
    position: absolute;
    top: 0;
    transition: left 500ms ease 0s;
    width: 1816px;
}
html > body > div > .poi > div.right {
    left: -908px;
    transition: left 500ms ease 0s;
}
html > body > div > .poi > div > .mappa {
    float: left;
    height: 1080px;
    position: relative;
    transition: width 500ms ease 500ms;
    width: 908px;
}
html > body > div > .poi > div > .mappa.open {
    transition: width 500ms ease 500ms;
    width: 0;
}
html > body > div > .poi > div > .mappa > #map {
    height: 1080px;
    transition: width 500ms ease 500ms;
    width: 908px;
}
html > body > div > .poi > div > .mappa > #map.open {
    transition: width 500ms ease 500ms;
    width: 0;
}
html > body > div > .poi > div > .elenco {
    float: left;
    height: 1080px;
    opacity: 1;
    position: relative;
    transition: opacity 500ms ease 500ms, width 500ms ease 500ms;
    width: 908px;
}
html > body > div > .poi > div > .elenco > .button {
    background-color: transparent;
    background-image: url("../layout/slide.png");
    background-position: center 0;
    background-repeat: no-repeat;
    display: block;
    height: 123px;
    opacity: 0.5;
    overflow: hidden;
}
html > body > div > .poi > div > .elenco > .button.down {
    background-position: center -123px;
}
html > body > div > .poi > div > .elenco > .button.active {
    opacity: 1;
}
html > body > div > .poi > div > .elenco > .slide {
    height: 834px;
    overflow: hidden;
    position: relative;
}
html > body > div > .poi > div > .elenco > .slide > ul {
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
html > body > div > .poi > div > .elenco > .slide > ul > li {
    float: left;
    margin-bottom: 11px;
    width: 25%;
}
html > body > div > .poi > div > .elenco > .slide > ul > li > a {
    color: #333333;
    display: block;
    font-size: 1em;
    font-weight: 300;
    text-decoration: none;
}
html > body > div > .poi > div > .elenco > .slide > ul > li > a > figure > img {
    display: block;
    margin: 0 auto 13px;
}
html > body > div > .poi > div > .elenco > .slide > ul > li > a > figure > figcaption {
    text-align: center;
}
html > body > div > .poi > div > .elenco > .poi-info {
    left: 37px;
    opacity: 0;
    position: absolute;
    top: 84px;
    transition: opacity 500ms ease 0ms, visibility 500ms ease 0ms;
    visibility: hidden;
    width: 1425px;
}
html > body > div > .poi > div > .elenco > .poi-info.open {
    opacity: 1;
    transition: opacity 500ms ease 1200ms;
    visibility: visible;
}
html > body > div > .poi > div > .elenco > .poi-info > .close {
    background-color: #333333;
    background-image: url("../layout/close.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: auto auto;
    height: 48px;
    margin-bottom: 110px;
    width: 52px;
}
html > body > div > .poi > div > .elenco > .poi-info > .testo {
    width: 560px;
}
html > body > div > .poi > div > .elenco > .poi-info > .testo > header {
    margin-bottom: 55px;
}
html > body > div > .poi > div > .elenco > .poi-info > .testo > header > h1 {
    font-family: "Roboto Slab";
    font-size: 2.125em;
    font-weight: 700;
    line-height: 1.2em;
}
html > body > div > .poi > div > .elenco > .poi-info > .testo > .scroll-text {
    height: 565px;
    overflow: hidden;
    position: relative;
}
html > body > div > .poi > div > .elenco > .poi-info > .testo > .scroll-text > div {
    left: 0;
    position: absolute;
    top: 0;
    transition: top 300ms ease 0s;
    width: 100%;
}
html > body > div > .poi > div > .elenco > .poi-info > .testo > .scroll-text > div > p {
    font-size: 1.125em;
    font-weight: 300;
    line-height: 1.5em;
}
html > body > div > .poi > div > .elenco > .poi-info > .testo > .scroll-text > div.more {
    top: -565px;
    transition: top 300ms ease 0s;
}
html > body > div > .poi > div > .elenco > .poi-info > .testo > .more {
    background-color: transparent;
    background-image: url("../layout/more.png");
    background-position: right center;
    background-repeat: no-repeat;
    background-size: auto auto;
    color: #333333;
    display: block;
    font-size: 1.125em;
    font-weight: 700;
    margin-top: 45px;
    max-width: 115px;
    padding: 12px 56px 11px 0;
    text-decoration: none;
}
html > body > div > .poi > div > .elenco > .poi-info > .testo > #more {
    display: none;
}
html > body > div > .poi > div > .elenco > .poi-info > .testo > .nav-text {
    height: 80px;
    margin-top: 31px;
    opacity: 0;
    position: relative;
    width: 100%;
}
html > body > div > .poi > div > .elenco > .poi-info > .testo > .nav-text.active {
    opacity: 1;
}
html > body > div > .poi > div > .elenco > .poi-info > .testo > .nav-text > div {
    background-color: transparent;
    background-image: url("../layout/slide.png");
    background-position: center -25px;
    background-repeat: no-repeat;
    background-size: auto auto;
    float: left;
    height: 80px;
    opacity: 0.5;
    transition: opacity 300ms ease 0s;
    width: 50%;
}
html > body > div > .poi > div > .elenco > .poi-info > .testo > .nav-text > div.next {
    background-position: center -150px;
}
html > body > div > .poi > div > .elenco > .poi-info > .testo > .nav-text > div.active {
    opacity: 1;
    transition: opacity 300ms ease 0s;
}
html > body > div > .poi > div > .elenco > .poi-info > .gallery {
    position: absolute;
    right: 0;
    top: 158px;
    width: 810px;
}
html > body > div > .poi > div > .elenco > .poi-info > .gallery > .immagine {
    float: left;
}
html > body > div > .poi > div > .elenco > .poi-info > .gallery > .immagine.immagine-1 {
    margin-bottom: 26px;
}
html > body > div > .poi > div > .elenco > .poi-info > .gallery > .immagine.immagine-2 {
    margin-right: 30px;
}
html > body > div > .poi > div > .elenco > .poi-info > .gallery > .immagine > a > figure > img {
    display: block;
    line-height: 1em;
}
html > body > div > .poi > div > .elenco.open {
    width: 1556px;
}
html > body > div > .poi > div > .elenco.open > div {
    opacity: 0;
    transition: opacity 500ms ease 0s;
}
html > body > div > .poi > div > .elenco.open > div.active {
    opacity: 0;
    transition: opacity 500ms ease 0s;
}
html > body > div > .poi > div > .elenco > div {
    opacity: 1;
    transition: opacity 500ms ease 1000ms;
}
html > body > div > .poi > div > .elenco.load {
    background-image: url("../layout/ajax-loader-large.gif");
    background-position: center center;
    background-repeat: no-repeat;
}
html > body > div > .poi.open {
    left: 68px;
    transition: left 500ms ease 500ms;
    width: 1556px;
}
html > body > div > .poi.open > div {
    transition: width 500ms ease 500ms;
    width: 2464px;
}
html > body > div > .opera {
    background-color: #efefef;
    height: 918px;
    left: 499px;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 1125px;
}
html > body > div > .opera > .immagine {
    margin: 139px auto 0;
    max-height: 878px;
    max-width: 980px;
}
html > body > div > .opera > .immagine > figure {
    height: 100%;
    width: 100%;
}
html > body > div > .opera > .immagine > figure > img {
    display: block;
    height: auto;
    margin: 0 auto;
    max-height: 840px;
    max-width: 980px;
    opacity: 1;
    transition: opacity 300ms ease 0s;
    width: auto;
}
html > body > div > .opera > .immagine > figure > img.hide {
    opacity: 0;
    transition: opacity 200ms ease 0s;
}
html > body > div > .opera > .immagine > figure > figcaption {
    display: block;
    font-size: 1.125em;
    font-weight: 300;
    height: auto;
    line-height: 1.4em;
    margin: 20px auto 0;
    opacity: 1;
    text-align: center;
    transition: opacity 300ms ease 0s;
    width: auto;
}
html > body > div > .opera > .immagine > figure > figcaption.hide {
    opacity: 0;
    transition: opacity 200ms ease 0s;
}
html > body > div > .descrizione {
    background-color: white;
    height: 918px;
    left: 0;
    position: absolute;
    top: 0;
    width: 499px;
}
html > body > div > .descrizione > .testo {
    left: 105px;
    position: absolute;
    top: 245px;
    width: 314px;
}
html > body > div > .descrizione > .testo > header > h1 {
    font-family: "Roboto Slab";
    font-size: 2.125em;
    font-weight: 700;
    line-height: 1.2em;
    margin-bottom: 55px;
}
html > body > div > .descrizione > .testo > p {
    font-size: 1.125em;
    font-weight: 300;
    line-height: 1.4em;
    margin-bottom: 45px;
}
html > body > div > .descrizione > .testo > p.didascalia {
    margin-top: 45px;
}
html > body > div > .descrizione > .testo > p.didascalia > strong {
    display: block;
    opacity: 1;
    transition: opacity 300ms ease 0s;
}
html > body > div > .descrizione > .testo > p.didascalia > strong.hide {
    opacity: 0;
    transition: opacity 200ms ease 0s;
}
html > body > div > .descrizione > .testo > p.didascalia > span {
    display: block;
    opacity: 1;
    transition: opacity 300ms ease 0s;
}
html > body > div > .descrizione > .testo > p.didascalia > span.data {
    margin-top: 45px;
}
html > body > div > .descrizione > .testo > p.didascalia > span.hide {
    opacity: 0;
    transition: opacity 200ms ease 0s;
}
html > body > div > .opere {
    background-color: #dedede;
    height: 162px;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 918px;
    width: 1624px;
}
html > body > div > .opere > .button {
    background-color: transparent;
    background-image: url("../layout/slide-gallery.png");
    background-position: center 0;
    background-repeat: no-repeat;
    display: block;
    height: 162px;
    opacity: 0.5;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 76px;
}
html > body > div > .opere > .button.prev {
    background-position: 0 20px;
    left: 0;
}
html > body > div > .opere > .button.next {
    background-position: 0 -104px;
    right: 0;
}
html > body > div > .opere > .button.active {
    opacity: 1;
}
html > body > div > .opere > .slide {
    height: 162px;
    left: 76px;
    overflow: hidden;
    position: relative;
    width: 1472px;
}
html > body > div > .opere > .slide > ul {
    left: 0;
    padding-top: 26px;
    position: absolute;
    top: 0;
    transition: left 500ms ease 0s;
    width: 100%;
}
html > body > div > .opere > .slide > ul > li {
    border: 4px solid #dedede;
    float: left;
    height: 106px;
    margin: 0 8px;
    overflow: hidden;
    transition: border-color 200ms ease 0s;
    width: 160px;
}
html > body > div > .opere > .slide > ul > li.select {
    border: 4px solid #8a8787;
    transition: border-color 500ms ease 0s;
}
html > body > div > .opere > .slide > ul > li > a {
    display: block;
    line-height: 1em;
}
html > body > div > .opere > .slide > ul > li > a > figure {
    display: block;
    height: 100%;
    line-height: 1em;
    position: relative;
    width: 100%;
}
html > body > div > .opere > .slide > ul > li > a > figure > img {
    display: block;
    height: 180px;
    left: -10px;
    position: absolute;
    top: -10px;
    width: 180px;
}
html > body > div > .opere > .slide > ul > li > a > figure > figcaption {
    height: 100%;
    width: 100%;
}
html > body > div > .protection {
    background-color: black;
    display: none;
    height: 1080px;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 1920px;
    z-index: 999;
}
html > body > div > .protection.active {
    display: block;
}
html > body > .protection {
    background-color: black;
    display: none;
    height: 1080px;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 1920px;
    z-index: 999;
}
html > body > .protection.active {
    display: block;
}

 .bottone-visita-il-sito-del-museo {

    left: 752px;

    background-image: none !important;

    position: fixed;

    top: 954px;

    width: 473px !important;

}


.bottone-visita-il-sito-di-pratomusei {

    position: fixed;

    left: 1280px;

    background-image: none !important;

    top: 954px;

    width: 473px !important;

}


.bottone-visita-il-sito-di-pratomusei a {

    background-color: white !important;

    color: #000 !important;

}


.bottone-visita-il-sito-del-museo a {

    background-color: #FFF !important;

    color: #000 !important;

}


/* animazione screensaver */

@keyframes FadeInOut {

0% {

opacity:1;

}

45% {

opacity:1;

}

55% {

opacity:0;

}

100% {

opacity:0;

}

}



.immagine-screensaver img:nth-child(2) {

animation-name: FadeInOut;

animation-timing-function: ease-in-out;

animation-iteration-count: infinite;

animation-duration: 10s;

animation-direction: alternate;

}



.immagine-screensaver img:nth-child(1) {

position:absolute;

top:0;

left:0;

width:100%;

height:100%;

z-index:1;

}



.immagine-screensaver img:nth-child(2) {

position:absolute;

top:0;

left:0;

width:100%;

height:100%;

z-index:3;

}

.credits {
	position: absolute;
	top:120px;
	left: 1800px;
}
.credits a {
	color: white;
	text-transform: capitalize;
	font-weight: bold;
}