/* Overlay style */

.menu-overlay::-webkit-scrollbar-track{background-color: transparent;border-radius: 0px;}
.menu-overlay::-webkit-scrollbar{width: 5px; height: 5px; background-color: transparent;}
.menu-overlay::-webkit-scrollbar-thumb{ border-radius: 0px;	background-color:#333; }

.menu-overlay { position: fixed; width: 100%; height: 100%; top: 0; left: 0; background: rgba(46,53,25,.97); overflow: hidden; z-index: 3; color: #fff; }
.menu-overlay:before{content: ''; position: absolute; bottom: -40px; right: -30px; width: 380px; height: 230px;  background-image: url('../../../../public/finder/layout/immagini/villa-rizzo-VR-lettere-trasp.png'); background-repeat: no-repeat; background-position: bottom right; opacity: .1;}
.menu-overlay .vr-letter{ position: fixed; bottom: -40px; right: -30px;}
.menu-overlay .vr-letter img {opacity: .2;}

@media (max-width: 667px) {
	/*.menu-overlay:before{ bottom: inherit; top:  125vH;}*/
}

/* APERTURA*/
/*.menu-overlay-btn-open { position: relative; width: 45px; height: 45px; cursor: pointer; border-color: transparent; background-color:rgba(202,175,98,1); -webkit-transition: all .2s linear; -moz-transition: all .2s linear; transition: all .2s linear; }
.menu-overlay-btn-open:hover > a span, .menu-overlay-btn-open:hover > a span:before, .menu-overlay-btn-open:hover > a span:after { background: #fff !important; }
.menu-overlay-btn-open:hover span:before { transform: translateY(0.15em) translateX(0.4em) rotate(45deg) scaleX(0.6); -webkit-transform: translateY(0.15em) translateX(0.4em) rotate(45deg) scaleX(0.6); }
.menu-overlay-btn-open:hover span:after { transform: translateY(-0.15em) translateX(0.4em) rotate(-45deg) scaleX(0.6); -webkit-transform: translateY(-0.15em) translateX(0.4em) rotate(-45deg) scaleX(0.6); }
.menu-overlay-btn-open.active span { background-color: transparent; }
.menu-overlay-btn-open.active span:before, .menu-overlay-btn-open.active span:after { top: 0; }
.menu-overlay-btn-open.active span:before { transform: rotate(45deg); }
.menu-overlay-btn-open.active span:after { transform: rotate(-45deg); }
.menu-overlay-btn-open:focus { outline: none; }
.menu-overlay-btn-open span, .menu-overlay-btn-open span:before, .menu-overlay-btn-open span:after { position: absolute; left: 0; cursor: pointer;  height: 2px; width: 25px; background: #fff; display: block; content: ''; transition: all 500ms ease-in-out; }
.menu-overlay-btn-open span:before { top: -8px; }
.menu-overlay-btn-open span:after { bottom: -8px; }
*/
#menuprincipale { padding: 0 14px;}
 
.menu-overlay-btn-open{position:fixed;display:flex;outline:0;height:45px;width:45px;top: 55px; right: 100px; border:0;border-radius:50%;padding:0;background-color:rgba(202,175,98,1);transition:all 250ms ease-out;cursor:pointer}
.menu-overlay-btn-open:after,.menu-overlay-btn-open:before{content:'';width:50%;height:2px;left:25%;position:absolute;background:#fff;transition:all 250ms ease-out;will-change:transform}
.menu-overlay-btn-open:before{top:39%}
.menu-overlay-btn-open:after{top:55%}
.menu-overlay-btn-open:hover{transform: rotate(180deg) scale(1.1);}
.menu-overlay-btn-open:hover:before{transform:translateY(0) rotate(45deg);width:26%;left:40%}
.menu-overlay-btn-open:hover:after{transform:translateY(0) rotate(-45deg);width:26%;left:40%}
.menu-overlay-btn-open.left { transform:rotate(180deg) !important}

@media (max-width: 736px) {
	.menu-overlay-btn-open { position: absolute; top: 20px; right:20px;}
	body.scroll-page .menu-overlay-btn-close {  }
} 

/* CHIUSURA */
.menu-overlay-btn-close { position: absolute; right: 20px; top: 60px; height:45px; width:45px; right: 100px; border:0;border-radius:50%;padding:0;background-color:rgba(202,175,98,1); cursor: pointer; border-color: transparent;z-index: 99999;  -webkit-transition: all .2s linear; -moz-transition: all .2s linear; transition: all .2s linear; }
.menu-overlay-btn-close:focus { outline: none; }
.menu-overlay-btn-close span, .menu-overlay-btn-close span:before, .menu-overlay-btn-close span:after { position: absolute; top: 21px; left: 10px; cursor: pointer;  height: 2px; width: 25px; background: none; display: block; content: ''; transition: all 300ms ease-in-out; }
.menu-overlay-btn-close span:before, .menu-overlay-btn-close span:after { background: #fff; }
.menu-overlay-btn-close span:before { top: 0px; left: 0px; transform:  rotate(45deg); }
.menu-overlay-btn-close span:after {top: 0; left: 0px; transform: rotate(-45deg); }
.menu-overlay-btn-close:hover {transform: scale(1.1);}
.menu-overlay-btn-close:hover span:before {transform:translateY(0) rotate(45deg); width: 51%; left: 6px;top: -4px; transition: all 300ms ease-in-out; }
.menu-overlay-btn-close:hover span:after { transform:translateY(0) rotate(-45deg);width: 51%; left: 6px;top: 4px; transition: all 300ms ease-in-out; }

@media (max-width: 736px) {
	.menu-overlay-btn-close { right: 20px; top: 20px;}
}

/* Effectti */
/*scale*/
.overlay-scale { visibility: hidden; opacity: 0; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: -webkit-transform 0.2s, opacity 0.2s, visibility 0s 0.2s; transition: transform 0.2s, opacity 0.2s, visibility 0s 0.2s; }
.overlay-scale.open { visibility: visible; opacity: 1; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: -webkit-transform 0.4s, opacity 0.4s; transition: transform 0.4s, opacity 0.4s; }
/*contentpush*/
.overlay-slidelateral { visibility: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: -webkit-transform 0.5s, visibility 0s 0.5s; transition: transform 0.5s, visibility 0s 0.5s; }
.overlay-slidelateral.open { visibility: visible; -webkit-transform: translateX(0%); transform: translateX(0%); -webkit-transition: -webkit-transform 0.5s; transition: transform 0.5s; }
/*slidedown*/
.overlay-slidedown { visibility: hidden; -webkit-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition: -webkit-transform 0.4s ease-in-out, visibility 0s 0.4s; transition: transform 0.4s ease-in-out, visibility 0s 0.4s; }
.overlay-slidedown.open { visibility: visible; -webkit-transform: translateY(0%); transform: translateY(0%); -webkit-transition: -webkit-transform 0.4s ease-in-out; transition: transform 0.4s ease-in-out; }
/*slideup*/
.overlay-slideup { visibility: hidden; -webkit-transform: translateY(100%); transform: translateY(100%); -webkit-transition: -webkit-transform 0.4s ease-in-out, visibility 0s 0.4s; transition: transform 0.4s ease-in-out, visibility 0s 0.4s; }
.overlay-slideup.open { visibility: visible; -webkit-transform: translateY(0%); transform: translateY(0%); -webkit-transition: -webkit-transform 0.4s ease-in-out; transition: transform 0.4s ease-in-out; }
/*hugeinc*/
.overlay-hugeinc { opacity: 0; visibility: hidden; -webkit-transition: opacity 0.5s, visibility 0s 0.5s; transition: opacity 0.5s, visibility 0s 0.5s; }
.overlay-hugeinc.open { opacity: 1; visibility: visible; -webkit-transition: opacity 0.5s; transition: opacity 0.5s; }
.overlay-hugeinc .mainmenu { -webkit-perspective: 1200px; perspective: 1200px; }
.overlay-hugeinc .mainmenu ul { opacity: 0.4; -webkit-transform: translateY(-25%) rotateX(35deg); transform: translateY(-25%) rotateX(35deg); -webkit-transition: -webkit-transform 0.5s, opacity 0.5s; transition: transform 0.5s, opacity 0.5s; }
.overlay-hugeinc.open .mainmenu ul { opacity: 1; -webkit-transform: rotateX(0deg); transform: rotateX(0deg); }
.overlay-hugeinc.close .mainmenu ul { -webkit-transform: translateY(25%) rotateX(-35deg); transform: translateY(25%) rotateX(-35deg); }
/* Menu */
#main-menu:after {content: ''; width: 1px; height:calc(100% - -400px); position: absolute; top: -40px; right: 20px; border-right: 1px dashed rgba(255,255,255,.2);}
.menu-overlay .mainmenu { text-align: center; position: relative; top: 50%; width: 50%; margin: 0 auto; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.menu-overlay .mainmenu .logo { display: inline-block; width: 202px; height: 50px; margin-left: 0px; background-position: center left; background-size: contain; background-repeat: no-repeat; cursor: pointer; -webkit-transition: all .2s linear; -moz-transition: all .2s linear; transition: all .2s linear; }
.menu-overlay .mainmenu .logo:hover { opacity: 0.65; }
.menu-overlay .mainmenu .navbar { margin-bottom: 50px !important; padding: 0 }
.menu-overlay .mainmenu .sm-superclean-overlay { box-shadow: none; }
.menu-overlay .mainmenu .sm-superclean-overlay a { color: #fff; font-weight: 200; font-size: 16px; }
.menu-overlay .mainmenu .sm-superclean-overlay a > i.fa { display:none !important;}
.menu-overlay .mainmenu .sm-superclean-overlay a.active { opacity:.5}
.menu-overlay .mainmenu .sm-superclean-overlay a:hover { opacity: .7 }
.menu-overlay .mainmenu .sm-superclean-overlay > li.menu-transform { opacity: 0; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all .5s ease; transition: all .5s ease; }
.menu-overlay .mainmenu .sm-superclean-overlay > li.menu-transform-active { opacity: 1; border-color: transparent; }
.menu-overlay .mainmenu .sm-superclean-overlay > li > a > i.fa { display: inline-block !important; }
.menu-overlay .mainmenu .sm-superclean-overlay > li > a span.sub-arrow { font-family: 'Source Sans Pro' !important; /* text-align: center; right: 6px; width: 30px;*/}

.menu-overlay .mainmenu .sm-superclean-overlay a span.sub-arrow { font-family: 'Source Sans Pro' !important; }
.menu-overlay .mainmenu .sm-superclean-overlay a span.sub-arrow:before { margin-top: -3px; font-size: 33px; }
.menu-overlay .mainmenu .sm-superclean-overlay > li > a.highlighted span.sub-arrow:before { margin-top: -3px; font-size: 33px; }

/*sottomenu*/
.menu-overlay .mainmenu .sm-superclean-overlay > li ul {
	padding-bottom: 30px;
	/*border-bottom: 1px solid rgba(255,255,255,.4);*/
}


/* LANG */
.mainmenu .lang { text-align: left; padding: 5px 10px}
.mainmenu .lang a { padding: 0px 10px; font-size: 16px; font-weight: 300; color: #fff; opacity: .5; border-right:1px solid rgba(255,255,255,1); }
.mainmenu .lang a:last-child { padding-right: 0 !important; border: none; }
.mainmenu .lang a:hover, .mainmenu .lang a.active { opacity: 1 }
.mainmenu .lang a.disabled { pointer-events: none; cursor: default;}

.mainmenu .lang.start { top: 20px}

 @media screen and (max-width: 736px) {
.mainmenu .lang { text-align: center;}
.mainmenu .lang a { }
 }



@media (max-width: 736px) {
.menu-overlay .mainmenu { width: 90%;  padding: 0 0 50px 0; }
#main-menu:after { right: 40px;}
	.menu-overlay .mainmenu .sm-superclean-overlay a span.sub-arrow{    right: 34px;}
}

@media screen and (max-height: 30.5em) {
.menu-overlay .mainmenu { height: 70%; font-size: 34px; }
.menu-overlay ul li { min-height: 34px; }
}
.menu-overlay.top .mainmenu .logo, .menu-overlay.bottom .mainmenu .logo, .menu-overlay.left .mainmenu .logo, .menu-overlay.right .mainmenu .logo { display: none; }
.menu-overlay a:hover { opacity: .8; }
/*posizione top*/
.menu-overlay.top { top: 0 !important; bottom: inherit; height: 300px; }
.menu-overlay.top .mainmenu { top: 30px; width: 80%; transform: none; }
.menu-overlay.top .menu-overlay-btn-close { transform: rotate(-90deg); }
/*posizione bottom*/
.menu-overlay.bottom { top: inherit; bottom: 0 !important; height: 300px; }
.menu-overlay.bottom .mainmenu { top: 30px; width: 80%; transform: none; }
.menu-overlay.bottom .menu-overlay-btn-close { transform: rotate(90deg); }
/*posizione sinistra*/
.menu-overlay.left { width: 300px; }
.menu-overlay.left .mainmenu { top: 50px; width: 80%; transform: none; }
/*posizione destra*/
.menu-overlay.right { width: 550px; left: inherit; right: 0; }
/*.menu-overlay.right .mainmenu { top: 50px; width: 67%; margin-left: 80px;    margin-bottom: 200px; transform: none; }*/
.menu-overlay.right .mainmenu { top: 0;   width: 100%; height: 100%; padding-top: 50px; padding-left: 80px; padding-right: 102px; padding-bottom: 200px; transform: none; overflow-x: hidden; overflow-y: scroll; }


.menu-overlay.right.overlay-slidelateral { visibility: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateX(100%); transform: translateX(100%); -webkit-transition: -webkit-transform 0.5s, visibility 0s 0.5s; transition: transform 0.5s, visibility 0s 0.5s; }
.menu-overlay.right.overlay-slidelateral.open { visibility: visible; -webkit-transform: translateX(0%); transform: translateX(0%); -webkit-transition: -webkit-transform 0.5s; transition: transform 0.5s; }

@media (max-width: 667px) {
.menu-overlay.left { width: 100%; }
.menu-overlay.right { width: 100%; }
.menu-overlay.right .mainmenu { width: 100%; padding-left: inherit; padding-right: inherit; margin-left: inherit;}
.menu-overlay .mainmenu .sm-superclean-overlay a {padding: 10px 0; font-size: 20px; text-align: center;}
.menu-overlay .mainmenu .sm-superclean-overlay > li > a > i.fa { display: none !important; }
}


.info-box { position: relative; display: inline-block; width: 100%; margin: 50px 0 10px 0; padding: 0 20px; color: #fff; font-size: 16px;  font-weight: 200; text-align: left; line-height: 150%;}
.info-box > .titolo { font-size: 20px; }
.info-box a { color: #fff;}

@media (max-width: 667px) {
	.info-box { text-align: center;}
	#menuprincipale { padding: 0 16px;}
}
