/* CSS Document */
/* 

##     ##    ###    #### ##    ##    ##     ## ######## ##    ## ##     ## 
###   ###   ## ##    ##  ###   ##    ###   ### ##       ###   ## ##     ## 
#### ####  ##   ##   ##  ####  ##    #### #### ##       ####  ## ##     ## 
## ### ## ##     ##  ##  ## ## ##    ## ### ## ######   ## ## ## ##     ## 
##     ## #########  ##  ##  ####    ##     ## ##       ##  #### ##     ## 
##     ## ##     ##  ##  ##   ###    ##     ## ##       ##   ### ##     ## 
##     ## ##     ## #### ##    ##    ##     ## ######## ##    ##  #######  

*/

.mainmenu-bar { opacity: 0; position: fixed; top: 35px; right: 15px; width: 70vw; height: 60px; border: 0px solid #f90; z-index: 11; transition: width 1s ease, opacity .6s linear, top .3s linear; }
/*body.scroll-page .mainmenu-bar { overflow: hidden; width: 55px;}*/
 

body.scroll-page .mainmenu-bar {top: 10px;}
.mainmenu-bar.mmb-show {opacity: 1;}

#main-menu {opacity: 1;  transition: opacity .9s; margin-right: 55px;}
/*body.scroll-page #main-menu {opacity: 0;  transition: opacity .9s;}*/

.wrapper-mm { /*position: absolute; right: 0; width: 100vw;*/}
  
/* TRANSFORM TOGGLE ICON */ 
.main-menu-toggler{opacity:0; position:fixed;top:35px;right:15px;width:60px; height:60px; background-color: rgba(0,169,143,1);cursor:pointer;overflow:hidden;-webkit-appearance:none;border-color:transparent; border-radius: 20px; transition: opacity .3s ease 0s; z-index: 2;transition: all .2s ease; }
/*body.scroll-page .main-menu-toggler {opacity: 1; transition: opacity .5s ease .1s;}*/
 
/*open menu after click*/
.mainmenu-bar.mmb-open { width: 70vw!important; overflow: inherit!important;}
.mainmenu-bar.mmb-open #main-menu {opacity: 1!important; background-color: rgba(0,169,143,1); transition: opacity .5s ease .1s;}
.mainmenu-bar.mmb-open #main-menu a { color: #fff;}
.mainmenu-bar.mmb-open .main-menu-toggler{ opacity: 1;  background-color:  rgba(0,169,143,1);}


.mainmenu-bar.mmb-close { width: 55px!important; overflow: inherit!important;transition: opacity .5s ease .1s;}
.mainmenu-bar.mmb-close #main-menu {opacity: 0!important;background-color: transparent; transition: background-color .5s ease 1s,opacity .5s ease .1s;}
.mainmenu-bar.mmb-close .main-menu-toggler {opacity: 1;}

.mainmenu-bar.mmb-overflow-hidden { overflow: hidden!important;}
.mainmenu-bar.mmb-overflow-inherit { overflow: inherit!important;}

/* Tablet in modalità verticale */
@media all and (min-width: 481px) and (max-width: 768px) { 
	.main-menu-toggler {opacity: 1!important;}
	.mainmenu-bar {top: 0; right: 0; overflow: inherit!important; height: auto!important;}
	#main-menu {opacity: 0!important; transform:translateX(-100%); position: fixed; top: 0; left: 0; right: 0; bottom: 0; margin-right: 0; padding: 40px 20px; overflow-y: scroll; }
	.mainmenu-bar.mmb-open #main-menu {transform:translateX(0); padding-top: 85px;}
	.mainmenu-bar.mmb-close #main-menu {transform:translateX(-100%);}
}


@media all and (max-width: 480px) { 
	.mainmenu-bar  .main-menu-toggler {top: 40px;}
	body.scroll-page .mainmenu-bar  .main-menu-toggler {top: 13px;}	
	.main-menu-toggler {opacity: 1!important;}
	.mainmenu-bar {top: 0; right: 0; overflow: inherit!important; height: auto!important;}
	#main-menu {position: fixed; top: 0; left: 0; right: 0; bottom: 0; margin-right: 0; padding: 40px 20px; overflow-y: scroll; }
	.mainmenu-bar.mmb-open #main-menu {transform:translateX(0); padding-top: 100px;}
	.mainmenu-bar.mmb-close #main-menu {transform:translateX(-100%);}
}


.main-menu-toggler{}
.main-menu-toggler:hover > a span, .main-menu-toggler:hover > a span:after, .main-menu-toggler:hover > a span:before{background:#fff !important}
.main-menu-toggler:hover span:after{transform:translateY(0em) translateX(-0.3em) rotate(45deg) scaleX(.6); }
.main-menu-toggler:hover span:before{transform:translateY(0em) translateX(-0.3em) rotate(-45deg) scaleX(.6); }

.main-menu-toggler.open span{background-color:transparent}
.main-menu-toggler.open span:after, .main-menu-toggler.open span:before{top:0}
.main-menu-toggler.open span:before{transform:rotate(45deg)}
.main-menu-toggler.open span:after{transform:rotate(-45deg)}

.main-menu-toggler:focus{outline:0}
.main-menu-toggler span, .main-menu-toggler span:after, .main-menu-toggler span:before{content:'';position:absolute;top:48%;right:29%;height:2px;width:24px;background:#fff; cursor:pointer;transition:all .3s ease-in-out}
.main-menu-toggler span:before{top:-6px;right:0%;width:24px}
.main-menu-toggler span:after{top:6px;right:0%;width:24px}
.main-menu-toggler.left{transform:rotate(180deg) !important}

.header.small .main-menu-toggler{width:60px;height:60px; background-color:  rgba(0,169,143,1);}
.header.small .main-menu-toggler span, .header.small .main-menu-toggler span:after, .header.small .main-menu-toggler span:before{ }
.header.small .main-menu-toggler span:before{right:0%;}
.header.small .main-menu-toggler span:after{right:0%;}
/*
.main-menu-toggler.open{opacity: 1; background-color:  rgba(0,169,143,1);}
.main-menu-toggler.close{ background-color:  rgba(0,169,143,1);}
*/
/* Tablet in modalità verticale */
@media all and (min-width: 481px) and (max-width: 768px) { 
	
}
	
@media all and (max-width: 736px) { 	
	.main-menu-toggler{ width: 55px; height: 55px; }	
	.main-menu-toggler span, .main-menu-toggler span:after, .main-menu-toggler span:before{ right: 30%; }
	.main-menu-toggler span:before{right:0%;}
	.main-menu-toggler span:after{right:0%;}
 	
	.header.small .main-menu-toggler{ width: 55px; height: 55px; }	
	.header.small .main-menu-toggler span, .header.small .main-menu-toggler span:after, .header.small .main-menu-toggler span:before{right:30%; }
	.header.small .main-menu-toggler span:before{right:0%;}
	.header.small .main-menu-toggler span:after{right:0%;}
}


/*MAIN MENU*/
.sm-clean { background-color: transparent; float: right; z-index: 1}
.sm-clean a, .sm-clean a:hover, .sm-clean a:focus, .sm-clean a:active { padding: 25px 20px 24px 20px!important; margin: 0 5px; font-size: 20px; font-weight: 400; color: #2d2a26; text-transform: uppercase; text-decoration: none;border-radius: 16px!important;  }
.sm-clean a > i { font-weight:300;}
.sm-clean a:hover, .sm-clean a:focus, .sm-clean a:active, .sm-clean a.active, .sm-clean a.highlighted {background-color: rgba(0,169,143,1)!important; border-radius: 16px!important; color: #fff !important; }
.sm-clean a.lightgrey {background-color: rgba(248,248,248,1);   }
 
.sm-clean a:hover > i.fa { transform: rotate(180deg); }
.sm-clean a.current { }
.sm-clean a.disabled { }
.sm-clean li.lingua:before {content: ''; position: absolute; top: 50%; transform: translateY(-50%);left: 0; width: 1px; height: 20%; background-color: #fff; z-index: 9999}
.sm-clean li.logo {display: none;}
 

/* Tablet in modalità orizzontale */
@media all and (min-width: 769px) and (max-width: 1024px) { 
	.sm-clean a, .sm-clean a:hover, .sm-clean a:focus, .sm-clean a:active { padding: 21px 10px 22px 10px!important;}
}
	
/* Tablet in modalità verticale */
@media all and (min-width: 481px) and (max-width: 768px) { 
	.sm-clean li { float: none;}
	.sm-clean li.logo img { width: 30%;}
}


/*SOTTOMENU*/
@media (min-width: 481px) {
.sm-clean li ul { border-radius: 16px !important; -webkit-animation: fadeIn 0.7s; background-color: rgba(0,169,143,1); margin-top: 30px!important; padding: 20px 0!important;  }
.sm-clean ul a:hover, .sm-clean ul a:focus, .sm-clean ul a:active, .sm-clean ul a.highlighted { background-color: rgba(122,129,140,1);}

.sm-clean li ul li a { color:#fff; padding: 10px 20px!important; border-bottom:none!important;}
.sm-clean li ul li a:hover { padding: 10px 20px!important;border-bottom:none!important;}
}

.sm-clean li ul li a.has-submenu { color:#fff !important;  }
.sm-clean li ul li a.has-submenu.highlighted i { transform: rotate(-90deg); transition: transform ease .3s;  }

@media (min-width: 768px) {
.sm-clean a span.sub-arrow { display: none !important; }
.sm-clean a >i { display: inline-block !important; transition: all 500ms ease-in-out;}
}

@media (max-width: 768px) {

.sm-clean a span.sub-arrow { right:10px; background-color: transparent; border-color: transparent !important; margin-top: -17px; margin-right: 0 !important; width: 100%; text-align: right}
.sm-clean a span.sub-arrow:before { font-family: "Font Awesome 5 Free", "Font Awesome 5 Brands";    content: '\f067';    font-size: 14px;	font-weight:300;    }
.sm-clean a span.sub-arrow {border-radius: 0; width: 30px;text-align: center;}
	
.sm-clean a.highlighted span.sub-arrow:before { content: '\f068'; }
.sm-clean a, .sm-clean a:hover, .sm-clean a:focus, .sm-clean a:active { padding: 21px 40px 22px 20px!important; font-size: 24px;}

.sm-clean a.lightgrey { background-color: rgba(255,255,255,.5);}		
.sm-clean li {text-align: center}
.sm-clean li.lingua:before { display: none;}
.sm-clean li.logo { display: block; padding:50px 0; background-color: #fff;}

	
/*SOTTOMENU*/
.sm-clean ul { padding: 0; border-radius: 0 !important; background-color: rgba(122,129,140,1); border-color: transparent; box-shadow: 0 5px 9px rgba(0, 0, 0, 0.1); }
.sm-clean > li > ul::before, .sm-clean > li > ul::after { display: none; }
.sm-clean > li > ul { margin-left: 0 !important; }
.sm-clean ul a span.sub-arrow { right:0;}
.sm-clean ul a, .sm-clean ul a:hover, .sm-clean ul a:focus, .sm-clean ul a:active, .sm-clean ul a.highlighted { background-color: transparent !important;   font-size: 18px; font-weight: 300; }
.sm-clean ul a:hover, .sm-clean ul a.highlighted { background-color: rgba(255,255,255,0.1) !important; color: #fff !important; }
.sm-clean ul a.active { background-color: rgba(255,255,255,0.1) !important; color: #fff !important; }
.sm-clean ul ul { top: -1px !important; left: -2px !important; margin-top: 0 !important; }
.sm-clean ul li a { padding-left: 10px !important; }
.sm-clean ul li a i { position: absolute; right: 13px; }
.sm-clean ul ul li:last-child a { border-bottom: 1px solid rgba(210,210,210,0) !important; }
}
/* RESPONSIVE MOBILE iphone 6+ */

@media screen and (max-width: 736px) {
.sm-clean ul { border-color: transparent !important; }

.sm-clean a, .sm-clean a:hover, .sm-clean a:focus, .sm-clean a:active, .sm-clean a.highlighted { }
.navbar-nav.sm-collapsible .dropdown-menu .dropdown-menu { margin: 0; }
}