/* GENERALI */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;300;400;600;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400;700&display=swap');
* { margin: 0; padding: 0; box-sizing: border-box; }

:root {
  --white: #ffffff;
  --red: #EE0034;
  --black: #000000;
  --gray: #1F1F1F;
  --fucsia: #FF00E5; 
  --rosa: #ffd7ff; 
}

html {scroll-behavior: smooth; }
body { font-family: 'Montserrat', sans-serif; background-color: #222222; color: #fff; font-size: 14px; position: relative;}
.body { max-width: 1920px; margin: 0 auto; /*overflow: hidden;*/ }
.body1 {  margin: 0 auto; overflow: hidden; width: 100%; }
footer {position: relative; overflow: hidden;}
ul, li, h1, h2, h3, h4, h5, p { list-style: none; }
a { text-decoration: none; color: var(--white); outline: none!important; }
p { line-height: 1.8; font-size: 14px; font-weight: 300; }
.container { max-width: 1400px; margin: 0 auto; position: relative; padding: 0 20px; }
.container100 {width: 100%; position: relative;}
button { background-color: transparent; border: none; }
.center { text-align: center; }
.clear { clear: both; }
.clearfix::after { content:""; display: table; clear: both; }
.upper { text-transform: uppercase; }
.fff {color: var(--white)}
.black {color: var(--black)!important;}
.flex { display: flex; flex-wrap: wrap;}
.menu_responsive {display: none;}
.overflow {overflow: hidden;}
header {position: relative; overflow: hidden;}
footer {position: relative; overflow: hidden;}
.container.hidden-gal {display: none;}


.narratori{background-color: rgba(0, 0, 0, 0.9); position: fixed; top: 0; left: 0; width: 100%; height: 100vh; z-index: 100; display: flex; align-items: center; justify-content: center;}
.narratori__box{position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;background-color: var(--black); padding: 2rem; padding-top: 3rem; text-align: center;}
.narratori__box button{position: absolute; top: 1rem; right: 1rem; font-weight: 600; color: var(--white); cursor: pointer !important;}
.narratori__box video{margin-bottom: 2rem; width: 100%;}



/*TOP BUTTON*/
.back-to-top {position: fixed; z-index: 200;bottom: 42; right: 0; display: inline-block; padding: 10px 12px; margin: 1em; background-color: #000000a1; font-size: 0.8rem; text-align: center; color: var(--white);  /*border-radius: 50%;*/}
.back-to-top i { margin: 3px 0; color: var(--white)}
.back-to-top:hover {cursor: pointer; transition: all 0.3s ease-in-out;}

#dipinto1 {width: 50px!important;}

/* HOME MENU */
main {position: relative;}
main.bghomedecor {background-image: url('../images/picture1.jpg'); background-size: cover; background-position: center center; width: 100%; height: 100vh;}
.home-container { width: 100%; max-width: 600px; position: absolute; z-index: 2; left: 0; right: 0; margin: 0 auto; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); }

.quadrato {position: relative; margin: 0 auto; max-width: 1000px; color: var(--white);}
.quadrato.flex {flex-direction: column;}
.menu-container.flex {justify-content: center; margin-top: 27px;}
.txt-home {font-family: 'Caveat'; font-size: 3rem; margin-bottom: 15px; line-height: 1;}
.menu-container .menu li a {font-size: 1rem; color: var(--white); padding: 10px; transition: ease-in-out 0.5s; font-weight: 400; transition: 0.5s all; background-color: var(--black); margin: 0 5px;}
.menu-container .menu li a:hover {color:var(--fucsia); transition: 0.5s all;}
.social img {width: 26px; margin-left: 10px;}
.logo-animation .animation {position: absolute; width: 100vw; height: 100vh; top: 100%; left: 50%; z-index: -2; transform: translate(-50%, -100%); margin: 0 auto;}
.logo-animation-bg .animation {position: absolute; width: 10000px; height: 100vh; top: 100%; left: 50%; z-index: 0; transform: translate(-50%, -100%); margin: 0 auto;}

.bghead { background-size: cover; background-position: center center; width: 100%; height: auto;}

section.gradient {position: relative;}
section.gradient::before { content: ""; width: 100%; height: 100%; background-image: linear-gradient(120deg, #eaee44, #33d0ff); position: absolute; top: 0; left: 0; ; opacity: 0.8;}
footer .credits p {font-size: 0.8rem;}
.l-m{margin-left: 10px;}
.active-link {color:var(--fucsia)!important;}
.social-bar {padding: 20px 0;}
.social-bar.flex {justify-content: space-between; flex-direction: row; align-items: center;}
.social-bar img.lang-img {width: 26px; height: 26px; margin-right: 10px;}
.social-bar p:hover {color: var(--black); transition: 0.5s all;}
.lingue.flex {justify-content: space-between; align-items: center;}
.lingue {padding: 5px 10px}
.lingue .lingue {padding: inherit;}
.lingue img {width: 26px; height: 26px;}
.lingue .lingue img {margin-right: 10px;}
.lingue .lingue p {color: var(--white)}

.decor-home {position: absolute; bottom: -66px; left: 0; right: 0; margin: 0 auto;}
.decor-home img.decorh {width: 100%;}
.entra {margin: 0 auto;}
.entra p.txt-entra {padding: 5px 28px; max-width: 200px; font-family: 'Caveat'; font-weight: 400; color: var(--white); font-size: 3rem; background-color: var(--black); line-height: 1; transition: 0.5s all;}
.entra p.txt-entra:hover {color: var(--fucsia); transition: 0.5s all;}

/* DECOR BG */
.contdecor {width: 100%; position: relative;}
img.decor1 {position: absolute; top: -480px; right: -250px; z-index: -4; width: 500px;   transform: translatey(0px); -webkit-animation: float 6s ease-in-out infinite; animation: float 6s ease-in-out infinite; }
img.decor2 {position: absolute; top: 160px; left: -144px; z-index: -4; width: 500px;   transform: translatey(0px); -webkit-animation: float 10s ease-in-out infinite; animation: float 10s ease-in-out infinite; }
img.decor3 {position: absolute; bottom: -116px; right: 266px; z-index: -4; width: 300px;   transform: translatey(0px); -webkit-animation: float 10s ease-in-out infinite; animation: float 10s ease-in-out infinite; }
img.decor4 {position: absolute; bottom: -263px; left: 96px; z-index: -4; width: 450px;   transform: translatey(0px); -webkit-animation: float 6s ease-in-out infinite; animation: float 6s ease-in-out infinite; }


/* LINGUE */
.dropdown { position: relative; display:flex; align-items: center;}
.dropdown-content { display: none; position: absolute; background-color: var(--fucsia); min-width: 80px; overflow: auto; box-shadow: 0px 8px 8px 0px rgba(0, 0, 0, 0.063); z-index: 1; border-radius: 5px; top: 37px; left: 5px; }
.dropdown-content:hover {background-color: #df00c9;}
p.lang {text-align: center; font-weight: 400; font-family: 'Montserrat'; font-size: 1.1rem; color: var(--white);}
.dropdown-content a { color: black; padding: 8px 5px; text-decoration: none; display: block; }
.show {display: block;}
.dropdown .lang-img {margin-right: 8px;}
.dropdown button {font-size: 1.1rem; font-family: 'Montserrat'; color: var(--white); cursor:pointer; }
.dropdown button:focus {outline: inherit;}

.dropdown-r { position: relative; display:flex; align-items: center; border-top: 1px solid var(--white); margin-top: 10px;}
.dropdown-content { display: none; position: absolute; background-color: var(--fucsia); min-width: 80px; overflow: auto; box-shadow: 0px 8px 8px 0px rgba(0, 0, 0, 0.063); z-index: 1; border-radius: 5px; top: 37px; left: 5px; }
.dropdown-content:hover {background-color: #df00c9;}
.dropdown-r p.lang {text-align: center; font-weight: 400; font-family: 'Montserrat'; font-size: 1.1rem; color: var(--white); padding: 10px 15px; padding: 0 10px;}
.dropdown-content a { color: black; padding: 8px 5px; text-decoration: none; display: block; }
.show {display: block;}
.dropdown-r .lang-img {margin-right: 8px;}
.dropdown-r button {font-size: 1.1rem; font-family: 'Montserrat'; color: var(--white); cursor:pointer; }
.dropdown-r button:focus {outline: inherit;}


/* MENU GENERALE */
.menu-container-generale {margin-top: 20px;}
.menu-container-generale .menu a {color: var(--white); font-size: 1.2rem; transition: 0.5s all;}
.menu-container-generale .menu a:hover {color:var(--fucsia); font-size: 1.2rem; transition: 0.5s all;}
.menu-container-generale .menu li {margin: 0 2%;}
.menu-container-generale .menu nav ul.flex {flex-direction: row; align-items: center; justify-content: center;}
.menu-container-generale .logo-container {flex-direction: column; justify-content: space-between;}
.menu-container-generale .logo-container .img-social img {width: 26px;}

.logohome {position: relative;}

.logohome img.bgdecor-logo {position: absolute; z-index: -1; top: 5px; left: -36px; transform: translatey(0px); -webkit-animation: float-logo 10s ease-in-out infinite; animation: float-logo 10s ease-in-out infinite; }

.social-ico img {width: 30px; height: 30px; margin-top: 3px;}

.bgheader {background-image: url('../images/fascia1.jpg'); background-size: cover; background-position: center center; width: 100%; height: auto; position: relative;}
.bgheader::before {content: ""; background-color: rgba(0, 0, 0, 0.5); position: absolute; top: 0; right: 0; left: 0; height: 100%; width: 100%;}

/* BREADCRUMB + INFO PAGINA */
.info-pagina {margin: 20px auto; padding: 0 20px;}
.info-pagina.flex {justify-content: space-between; align-items: center;}
.info-pagina .pagina-nome h1.tit-p {font-family: 'Caveat'; font-size: 3.5rem; color: var(--fucsia); }
.pagina-nome {position: relative;}
.info-pagina .pagina-nome img {position: absolute; top: -45px; z-index: -1; left: -27px;}
.breadcrumb {position: relative;}
.breadcrumb img {position: absolute; right: 0px; top: -43px; z-index: -1;}
.breadcrumb a {font-weight: 600; transition: 0.5s all;}
.breadcrumb a:hover {color: var(--fucsia); transition: 0.5s all}
.breadcrumb a:last-of-type { color: var(--fucsia)}

/*FILTRO*/
.imgbg {background-color: var(--black); height: auto; width: 100%; position: relative; overflow: hidden;border: 6px solid var(--black); }
.imgbg img{transition: transform .5s;}
.imgbg img:hover{transform: scale(1.1);}
.corner {z-index: 100;}
.piu-info {background-color: var(--black);}
/*.imgbg:hover .operaimg{ background-color: var(--black); opacity: 0.5; width: 100%; height: auto; transition: .5s all;} */
/*.imgbg:hover .piu-info {opacity: 1; transition: .5s all;} */
.piu-info .det-txt {color: var(--white); font-weight: 600; font-size: 0.8rem; transition: 0.5s all;}
.piu-info .det-txt:hover {color: var(--fucsia); transition: 0.5s all;}
.piu-info img.paint-decor {opacity: 0.5; position: absolute; z-index: -1;}
span.vertline {border-left: 1px solid var(--white); height: 40px; margin: 0 20px;}
span.vertline-black {border-left: 1px solid var(--black); height: 20px; margin: 0 20px;}
.piu-info.flex {align-items: center; justify-content: center; padding: 0 0 8px 0;}
.filterDiv {max-width: 362px; width: 100%; height: auto;  text-align: center; margin: 20px; display: none; position: relative; transition: .5s ease-in-out; overflow: hidden;}
.filterDiv .label-opera {color: var(--fucsia); font-size: 1.1rem; margin-bottom: 10px; font-weight: 600; }
.filterDiv img.operaimg {width: 100%;}
.show { display: block; }
.filtro .container-filtro { margin-top: 20px; overflow: hidden; }
.container-filtro {justify-content: center;}
.filterDiv.privato span.vertline, .filterDiv.privato .contact {display: none;}

/* Style the buttons */ 
#myBtnContainer .flex {justify-content: center; align-items: center; width: 100%;}
#myBtnContainer .filtro-1 {align-items: center;}
#myBtnContainer .hline {border-bottom: 1px solid var(--fucsia); height: 1px; width: 40%; margin: 20px auto; display: block;}
#myBtnContainer {text-align: center;}
#myBtnContainer .btn { outline: none; padding: 12px 16px;  cursor: pointer; font-family: 'Montserrat'; font-weight: 400; font-size: 1rem; transition: all .3s; border: 6px solid var(--white); margin: 0 10px;background: #ffd7ff;  font-weight: 600;}
#myBtnContainer .btn.brd {border: 6px solid #ffd7ff;}
#myBtnContainer .btn:hover {background: var(--white); border: 6px solid #ffd7ff; color: var(--black);}
#myBtnContainer .btn.active { background: var(--white); border: 6px solid #ffd7ff; }
img.all {width: 26px; height: 26px;}

/* OPERA DETTAGLIO */

.opera-preview {padding: 0 20px; align-self: flex-start;}
.opera-preview img.frame-abs {position: absolute; bottom: -20px; left: 0; z-index: -1;}
.opera-preview img.frame-abs1 {position: absolute; top: -23px; right: 0; z-index: -1; }
.opera-dettaglio {width: 100%; margin: 80px 0; position: relative;}
.opera-dettaglio.flex { align-items: flex-start;}
.opera-dettaglio .opera-preview {width: 50%; height: auto;}
.opera-dettaglio .opera-preview img.opera-view {width: 100%; border: 6px solid var(--black); -webkit-box-shadow: 1px 7px 15px 7px rgba(0,0,0,0.29); 
  box-shadow: 1px 7px 15px 7px rgba(0,0,0,0.29);}
.opera-dettaglio .opera-info {width: 50%; padding: 0 20px;}
.opera-info h2 {font-size: 3rem; color: var(--fucsia); font-weight: 600; font-family: 'Caveat';}
.opera-info .critica p {font-size: 1.5rem; font-family: 'Caveat'; margin-top: 20px; color: var(--rosa);}
.opera-info .specifiche-opera.flex { justify-content: center; margin: 0 auto; max-width: 200px; padding: 25px 0 20px 0; flex-direction: column;}
.opera-info .specifiche-opera p.commento {padding-right: 10px; font-weight: 600; color: var(--white); }
.opera-info .specifiche-opera p.autore-c{font-weight: 600; color: var(--white); margin: 0 0 10px 0; font-size: 1.3rem; }
.opera-info p.disponibilita {color: var(--gray); font-size: 1.1rem; font-weight: 600; color: var(--gray); margin-bottom: 20px;}
.opera-info .info-cta {width: 50%; margin: 0 auto; padding: 15px 15px; background-color: var(--fucsia); border-radius: 10px; color: var(--white); font-weight: 600; transition: 0.5s all}
.opera-info .info-cta:hover {background-color: var(--black); transition: 0.5s all;}
.gallery-module {margin: 40px 0;}
.sticky {position: -webkit-sticky; position: sticky; top: 40px;}


/* MOMY */
h2.sotto-tit {font-size: 2.5rem; color: var(--white); font-family: 'Caveat';}
.momy-info {width: 100%; padding: 0 20px;}
.momy-info.flex {align-items: center;}
.momy-info video {padding-left: 4rem;width: 100%;}
.momy-info .momy {width: 50%;}
.momy-info .momy-txt {width: 50%; }
.momy-info .momy-txt .txt-generale {font-size: 1.1rem; position: relative; font-weight: 400;}
.momy-info .momy-txt .txt-generale span.detail-img {background-image: url("../images/color-detail.jpg"); position: absolute; height: 100%; width: 100%; background-repeat: no-repeat; z-index: -1; opacity: 0.8;}
.momy-info.reverse.flex {align-items: center; flex-direction: row-reverse;}
.d-btn.flex {flex-direction: row; justify-content: center; flex-wrap: wrap; margin: 20px 0;}
.d-btn a .d-btns {background-color: var(--fucsia); padding: 10px 15px; margin: 0 10px; transition: 0.5s ease-in-out;}
.d-btn a .d-btns:hover {background-color: #aa00aa; transition: 0.5s ease-in-out;}
.d-btn a .d-btns p {color: var(--white); font-weight: 400;}


/* ESPOSIZIONI */
.esposizione-singola {padding: 0 20px; margin-top: 50px;}
.esposizione-singola h2.e-tit {font-size: 1.5rem; font-weight: 600; color: var(--fucsia);}
.esposizione-singola p.s-tit {font-size: 1.2rem; font-weight: 400; color: var(--white); margin-bottom: 20px;}
.esposizione-singola .e-gal.flex {align-items: center;}
.esposizione-singola .e-gal .cc-gal {width: 50%; max-height: 500px; overflow: hidden;}
.esposizione-singola .e-gal img.e-copertina {width: 100%;}
.esposizione-singola .e-gal .sub-gal-c {width: 50%; }
.esposizione-singola .e-gal .sub-gal-c.flex {align-items: center; justify-content: center; align-self: center;}
.esposizione-singola .e-gal .s-cont img.e-copertina-s {width: 100%;}
.esposizione-singola .e-gal .s-cont {width: 30%; padding: 1%;}


/* PAGINAZIONE */

.paginazione {margin-top: 30px;}
.paginazione a { color: var(--white); padding: 8px 16px; text-decoration: none; transition: background-color .3s; }
.paginazione a.active { background-color: var(--fucsia); color: var(--white); }
.paginazione.flex {align-items: center; justify-content: center; cursor: pointer;}
.paginazione a:hover:not(.active) {background-color: #ccc;}



/* FOOTER */
footer a:hover {color: var(--fucsia);}
.footer-content {flex-direction: column; align-items: center; justify-content: center; position: relative; margin-top: 100px;}
.footer-content .footer-links {align-items: center; }
.footer-content .footer-links img.logo-footer {width: 100px; margin: 0 20px;}
.footer-content .credits-general p a {color: var(--white);}
.footer-content .credits-general a:hover {color: var(--fucsia);}
.footer-content .footer-data {margin-bottom: 15px;}
.footer-content .footer-data a:last-child{margin-left: 20px;}
.footer-content .footer-links a:first-child {margin-left: 20px;}
.footer-content img.footer-img {position: absolute; z-index: -1; top: -41px }
footer {position: relative;}
footer .credits.home-f {background-color: var(--black); padding: 20px 0;}


/*SITEMAP*/
.sitemap-txt {margin: 20px auto; font-size: 1.5rem;}
.sitemap-txt:hover {color: var(--fucsia);}
.sitemap-txt p.s-txt {font-size: 25px; transition: all 0.3s ease-in-out;}



/* PRIVACY */
#privacy {padding: 0 2%;}
#privacy hr {margin: 20px 0;}
#privacy h4 {font-size: 1.5rem; color: var(--gray); margin: 10px 0; font-weight: 600;}
#privacy b {font-weight: 600;}
#privacy .accetta {margin-top:30px; padding: 15px 30px; background-color: black; max-width: 150px; text-align: center; cursor: pointer; border-radius: 5px;}
#privacy .accetta button {color: white; text-align: center; font-size: 16px; cursor: pointer}


/* CREDITS */
h2.credits {position: absolute; bottom: 0; left: 0; right: 0; z-index: 1;}


/* ERRORI */
h2.errori {font-size: 3.5rem; font-weight: 600; color: var(--fucsia); margin-top: 40px;}
p.txt-error {font-size: 2rem; font-weight: 400; color: var(--gray); margin-bottom: 80px;}
.btn-error {max-width: 300px; background-color: var(--fucsia); margin: 40px auto; }
.btn-error p.btn-txt-e {font-size: 1.5rem; color: var(--white); font-weight: 400; padding: 15px 20px;}

/* CONTACT FORM */

.contact-form label { font-size: 1.1rem; font-family: 'Montserrat'; font-weight: 400;}
.contact-form input, textarea {font-size: 0.8rem; font-family: 'Montserrat';}

input[type=text], select { width: 400px; padding: 12px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; margin: 6px 0 16px 10px;  resize: vertical;}

input[type=text], textarea { width: 400px; padding: 12px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; margin: 6px 0 16px 10px;  resize: vertical;}

input[type=tel], select{ width: 400px; padding: 12px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; margin: 6px 0 16px 10px;  resize: vertical;}

input[type=email], select{ width: 400px; padding: 12px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; margin: 6px 0 16px 10px;  resize: vertical;}

input[type=altezza], textarea { width: 400px; padding: 12px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; margin: 6px 0 16px 10px;  resize: vertical;}

input[type=larghezza], textarea { width: 400px; padding: 12px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; margin: 6px 0 16px 10px;  resize: vertical;}

input[type=oggetto], select{  padding: 12px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; margin: 6px 0 16px;  resize: vertical;}

input[type=submit] {background-color: var(--black);  color: white;  padding: 12px 20px;  border: none;  border-radius: 4px;  cursor: pointer; transition: 0.5s ease-in-out;}

input[type=submit]:hover { background-color:var(--fucsia); transition: 0.5s ease-in-out; }

label {margin: 0 0 0 10px;}

#checkbox input { display: inline-block; width: auto; margin-right: 8px;}
#checkbox {margin: 10px auto;}

.sublabel {display: flex; flex-direction: column;}
.campi {text-align: left; justify-content: center;}
.contact-form {margin: 50px auto;}
.campi-full {  text-align: left; justify-content: center; flex-direction: column; width: 800px; margin: 0 auto;}

.oggetto {width: 810px; height:100%; margin: 6px 0 20px;}

.messaggio {width: 810px; height:200px; margin: 6px 0 20px;}
.m-tit {margin: 0;}

.contact-form {padding: 0 20px; position: relative;}

.contact-form img.frame-abs2 {position: absolute; top: -97px; right: 189px; z-index: -1; opacity: 0.1;}
.contact-form img.frame-abs3 {position: absolute; bottom: -35px; left: 228px; z-index: -1; opacity: 0.1;}

/* ANIMATIONS */

.slide-in-left { -webkit-animation: slide-in-left 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both; animation: slide-in-left 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both; }

@-webkit-keyframes slide-in-left { 0% { -webkit-transform: translateX(-1000px); transform: translateX(-1000px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @keyframes slide-in-left { 0% { -webkit-transform: translateX(-1000px); transform: translateX(-1000px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } }

.puff-in-center { -webkit-animation: puff-in-center 0.7s cubic-bezier(0.470, 0.000, 0.745, 0.715) both; animation: puff-in-center 0.7s cubic-bezier(0.470, 0.000, 0.745, 0.715) both; }

@-webkit-keyframes puff-in-center { 0% { -webkit-transform: scale(2); transform: scale(2); -webkit-filter: blur(4px); filter: blur(4px); opacity: 0; } 100% { -webkit-transform: scale(1); transform: scale(1); -webkit-filter: blur(0px); filter: blur(0px); opacity: 1; } } @keyframes puff-in-center { 0% { -webkit-transform: scale(2); transform: scale(2); -webkit-filter: blur(4px); filter: blur(4px); opacity: 0; } 100% { -webkit-transform: scale(1); transform: scale(1); -webkit-filter: blur(0px); filter: blur(0px); opacity: 1; } }


.slide-in-top { -webkit-animation: slide-in-top 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both; animation: slide-in-top 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both; }

@-webkit-keyframes slide-in-top { 0% { -webkit-transform: translateY(-1000px); transform: translateY(-1000px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes slide-in-top { 0% { -webkit-transform: translateY(-1000px); transform: translateY(-1000px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } }

.fade-in-left { -webkit-animation: fade-in-left 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-left 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; }

 @-webkit-keyframes fade-in-left { 0% { -webkit-transform: translateX(-50px); transform: translateX(-50px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @keyframes fade-in-left { 0% { -webkit-transform: translateX(-50px); transform: translateX(-50px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } }

 .slide-in-bottom { -webkit-animation: slide-in-bottom 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both; animation: slide-in-bottom 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both; }

 @-webkit-keyframes slide-in-bottom { 0% { -webkit-transform: translateY(1000px); transform: translateY(1000px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes slide-in-bottom { 0% { -webkit-transform: translateY(1000px); transform: translateY(1000px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } }

 .fade-in-top { -webkit-animation: fade-in-top 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-top 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; }

@-webkit-keyframes fade-in-top { 0% { -webkit-transform: translateY(-50px); transform: translateY(-50px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes fade-in-top { 0% { -webkit-transform: translateY(-50px); transform: translateY(-50px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } }

.fade-in-bottom { -webkit-animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; animation: fade-in-bottom 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both; }

 @-webkit-keyframes fade-in-bottom { 0% { -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes fade-in-bottom { 0% { -webkit-transform: translateY(50px); transform: translateY(50px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } }

 @-webkit-keyframes float { 0% { transform: translatey(0px); } 50% { transform: translatey(-20px); } 100% { transform: translatey(0px); } } @keyframes float { 0% { transform: translatey(0px); } 50% { transform: translatey(-20px); } 100% { transform: translatey(0px); }}

 @-webkit-keyframes float-logo { 0% { transform: translatey(0px); } 50% { transform: translatey(-10px); } 100% { transform: translatey(0px); } } @keyframes float-logo { 0% { transform: translatey(0px); } 50% { transform: translatey(-10px); } 100% { transform: translatey(0px); }}

 #element{ -webkit-animation: 3s ease 0s normal forwards 1 fadein; animation: 3s ease 0s normal forwards 1 fadein; }
@keyframes fadein{ 0% { opacity:0; } 66% { opacity:0; } 100% { opacity:1; } }

@-webkit-keyframes fadein{ 0% { opacity:0; } 66% { opacity:0; } 100% { opacity:1; } }


#hideMe {
  -moz-animation: cssAnimation 0s ease-in 5s forwards; /* Firefox */ -webkit-animation: cssAnimation 0s ease-in 5s forwards; /* Safari and Chrome */ -o-animation: cssAnimation 0s ease-in 5s forwards; /* Opera */ animation: cssAnimation 0s ease-in 5s forwards; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; }
@keyframes cssAnimation {
  to { width:0; height:0; overflow:hidden; } }
@-webkit-keyframes cssAnimation {
  to { width:0; height:0; visibility:hidden; } }

/*********************RESPONSIVE START********************/

@media screen and (max-width: 1600px) {
}

@media screen and (max-width: 1440px) {

}


@media screen and (max-width: 1280px) {


}


@media screen and (max-width: 1024px) {
  

}

@media screen and (max-width: 876px) {
  .messaggio {width: 100%;}
  .campi-full {width: 100%; margin: 15px 0;}
  input[type=text], select { width: 100%; margin: 6px 0 16px 0;}
  input[type=text], textarea { width: 100%; margin: 6px 0 16px 0;}
  input[type=tel], select{ width: 100%; margin: 6px 0 16px 0;}
  input[type=email], select{ width: 100%; margin: 6px 0 16px 0;}
  input[type=file], select{ width: 100%; margin: 6px 0 16px 0;}
  .oggetto {width: 100%;}
  .campi.flex {display: block;} 
  label {margin: 0;}
  
  
}


@media screen and (max-width: 860px) {

  .menu-container-generale .menu a{font-size: 1rem;}
  .menu-container-generale .menu li {margin: 0 1%;}
  .momy-info.flex {flex-direction: column;}
  .momy-info video {padding-left: 0; width: 100%;}
  .momy-info .momy-txt {width: 100%;}
  .momy-info .momy {width: 100%;}
  .opera-dettaglio .opera-preview {width: 100%; position: inherit;}
  .opera-dettaglio {margin: 10px 0;}
  .opera-dettaglio.flex {flex-direction: column-reverse;}
  .opera-dettaglio .opera-info {width: 100%;}
  .container.hidden-gal {display: block; padding-top: 40px;}
  .opera-gallery.tohide {display: none;}

}

@media screen and (max-width: 720px){

 .menu_responsive {display: flex; justify-content: center; align-items: center; }
 .cont-menu-r { text-align: center; margin-bottom: 4px;}
 .menu {display: none;}
 .icon-menu-img {width: 50px;}
 .txt-menu-bt {font-size: 1.2rem; color: var(--white); padding-left: 10px;}
 #trigger-overlay.flex {align-items: center;}
 header.menu-h-r {text-align: center; margin: 0 auto;}
 header.black {background-color: var(--black);}
 .logo-r-m {margin-top: 20px;} 
 .info-pagina .pagina-nome h1.tit-p {font-size: 3rem;}
 #myBtnContainer .filtro-1 {justify-content: center;} 
 img.decor2 {left: -300px;}
 .social-bar.hide {display: none;}
 .menu_responsive .logo-m img {width:100px;}
 .esposizione-singola .e-gal.flex {flex-direction: column;}
 .esposizione-singola .e-gal .cc-gal {width: 100%;}
 .esposizione-singola .e-gal .sub-gal-c {width: 100%;}
 .esposizione-singola .e-gal .sub-gal-c.flex {justify-content: space-between;}
 .overlay ul.flex {align-items: center;}
 .social-bar.flex {flex-direction: column;}
  header {background-image: url('../images/fascia1.jpg'); background-size: cover; background-position: center center; width: 100%; height: auto; position: relative;}
  header::before {content: ""; position: absolute; width: 100%; height: 100%; top: 0 ; right: 0; left: 0; background-color: rgba(0, 0, 0, 0.9);}
  .menu-container-generale {margin: 10px auto;}
  .info-pagina .pagina-nome img {display: none;}
  .breadcrumb img {display: none;}
  .opera-preview img.frame-abs {display: none;}
  .opera-preview img.frame-abs1 {display: none;}

}


@media screen and (max-width: 680px) {


}


@media screen and (max-width: 580px) {

}

@media screen and (max-width: 528px) {

  .txt-home {font-size: 2.3rem;}
  img.decor2 {left: -400px;}
  #myBtnContainer .filtro-2.flex {flex-direction: column;}
}

@media screen and (max-width: 540px) {

}
@media screen and (max-width: 430px) {
   

  .txt-home {font-size: 2.3rem;}
  .info-pagina .pagina-nome h1.tit-p {font-size: 2.5rem;}
  .txt-menu-bt {font-size: 1rem;}
  .piu-info img.paint-decor {display: none;}
  span.vertline { margin: 15px 20px; }
 

}

@media screen and (max-width: 411px) {

}

@media screen and (max-width: 380px) {
  .social-ico img {width: 27px; height: 27px;}
  .social-bar img.lang-img {width: 23px; height: 23px;}
  .icon-menu-img {width: 30px;}
  .menu-container-generale {top: 23px; left: -12px;}
  .footer-content .footer-links {flex-direction: column; margin-bottom: 20px;}
  .footer-content .footer-links a:first-child {margin: 20px auto;}
  .opera-info .info-cta {width: 100%;}
}

@media screen and (max-width: 375px) {

}

@media screen and (max-width: 360px) {

}

@media screen and (max-width: 320px) {

}


@media screen and (max-width: 280px){

  .txt-home {font-size: 1.2rem;}
  .piu-info.flex {flex-direction: column; }
  span.vertline {display: none;}
  .piu-info .dett {margin-bottom: 10px;}


}


/* RESPONSIVE HEIGHT */

@media (max-height: 785px) {
  .animation-logo { width: 300px; height: 300px; margin: 0 auto; }
  .txt-home {margin-top: -50px;}
}


@media (max-height: 522px) {
  .txt-home {margin-top: -78px;}
  
  .entra p.txt-entra {font-size: 2rem;}
}

@media (max-height: 456px) {
  .animation-logo { width: 180px; height: 180px; margin: 0 auto; }
  .txt-home {margin-top: -45px;}
  .menu-container .menu li a {font-size: 0.8rem; padding: 6px 10px;}
  .menu-container.flex { margin-top: 15px;}
  footer .credits.home-f {padding: 7px 0;}
  .txt-home {font-size:2.5rem ;}
  .entra p.txt-entra {font-size: 1.8rem;}
}