:root { --menu-bg:#000; --menu-bg-desk:transparent; --menu-color: #fff; }

/*typography*/
.red{color:red}
.green{color:rgb(69, 116, 47)}
.orange{color:rgb(255, 123, 0)}
.fucsia{color:rgba(255, 0, 255, 0.664)}
.cyan{color:rgb(0, 132, 255)}

.header-fixed{position: fixed;top:0;left:0;width:100vw;z-index: 10;}
.header-fixed.resized{backdrop-filter: saturate(180%) blur(15px);background-color: rgba(6,6,39,.7);box-shadow: 0 13px 22px -5px rgba(6,6,39,.06);}
.contenitore-menu{display:flex;align-items: center; justify-content: space-between; position: relative;}

.navbar-brand, .nav-link { color: white !important;}

.nav-link:hover {color: #ddd !important;}
.nav-link.show {color:rgb(0, 153, 255) !important;}

.navbar-toggler{position: absolute;right: 0%;top:0;display: block; z-index: 11;}

.icon-hamburger{height: 50px;width: 40px;}
.navbar-toggler.icon-hamburger.icon-hamburger span{height: 2px; width: 30px;background: var(--menu-color);position: relative;display: block;margin-top: 11px;transition: all 0.2s cubic-bezier(.215, .61, .355, 1);}
.navbar-toggler.icon-hamburger span:nth-child(1){margin-top: 0;}


/*toglie l'alncoraggio al link*/
.nav-item.dropdown.megamenu {position: reltive; }
.dropdown-menu { width: max-content; background-color: #f8f9fa;border: none;}
.dropdown-menu.megamenu {width: max-content; background-color: #f8f9fa;border: none;}



.mega-content {padding: 1rem; width:100%;}
.mega-content .row { display: flex;flex-wrap: wrap;}

.mega-content .col {flex: 0 0 25%;min-width: 20px;padding: 1rem;}
.mega-content .col-25{ flex:0 0 25%; padding:0 .5rem}
.mega-content .col-33{ flex:0 0 33%; padding:0 .5rem}
.mega-content .col-50{ flex:0 0 50%; padding:0 .5rem}


.mega-content .col-img {flex: 0 0 50%;min-width: 20px;padding: 1rem;}
.mega-content .col-img-25 {flex: 0 0 25%;min-width: 20px;padding: 1rem;}

.mega-content img {max-width: 100%;border-radius: 30px;}
.col .dropdown-item img{ width: 50px;height:50px; border-radius:10px;}
.mega-content h5 {margin-bottom: 0rem;color:cornflowerblue;}
.mega-content ul {padding: 0;list-style: none;}
.mega-content ul li {margin-bottom: .5rem; display:block;}
.mega-content ul li a {color: #fff;text-decoration: none;padding: 0; padding:.5rem;border-radius: 6px;}
.mega-content ul li a:hover {text-decoration: none; background-color: rgba(0,0,0,.7); color:#fff}
.dropdown-item .menu-img-icon{float:left; width:35px; height: auto;margin:0 10px 0 0;box-shadow:0 5px 15px 0 rgba(254,139,119,.3);}

.dropdown-item span, .dropdown-item b{display:block; width: calc(100% - 40px);margin-left: auto;padding: 0; text-wrap: auto;}
.dropdown-item b{font-weight:500; font-size:16px;display:block;}
.dropdown-item badge{background:#fea04f;padding: 2px 5px;margin-left: 5px;font-size: 11px;border-radius: 3px; color: #fff;}
.dropdown-item span{font-size: .8rem; line-height: 110%;}


@media (max-width: 767px) {
    .mega-content .col-md-4 {
        flex: 100%;
    }
}


@media (max-width:991px){
    .header-fixed.resized{background: none;}
    .contenitore-menu{ max-width: 96%; min-height: 50px;} 
    .navbar-collapse{position: fixed;right: 0;top: 0; width: 360px; height: 100vh; transform: translateX(0%); 
        backdrop-filter: saturate(180%) blur(15px);background-color: rgba(6,6,39,.7);box-shadow: 0 13px 22px -5px rgba(6,6,39,.06);box-shadow: 0 13px 22px -5px rgba(0,0,0,.06); padding:4rem 2rem; transition: all .3s ease-in-out;overflow-y: scroll;}
    .collapse:not(.show) { display: block; height:100vh;transform: translateX(100%);border: 1px solid yellow;transition: all .3s ease-in-out;}

      /*dopdown-menu*/
      .dropdown-menu, .dropdown-menu.megamenu {width:100%;background-color: transparent; margin:0; padding:0;border: none;}
    
      /*megamenu*/
    .mega-content{padding:0;}
    .mega-content ul li a{color:#fff;}
    .mega-content .col {flex: 0 0 50%;min-width: 20px; padding: 1rem; }
    .mega-content, .dropdown-menu{ width:100%;}
    .mega-content ul li a{text-wrap: balance;line-height: 100%;margin:0 0 5px 0}
    .mega-content .col { flex: 0 0 50%; min-width: 20px;padding: 1rem;}
    .mega-content, .dropdown-menu{width:100%;}
    .mega-content .col-img-25{ flex: 0 0 100%;}
    .mega-content ul li a{ text-wrap: balance; line-height: 100%; margin:0 0 5px 0}
    .mega-content .col-25{ flex:0 0 100%; padding:0 .5rem}
    .mega-content .col-33{ flex:0 0 100%; padding:0 .5rem}
    .mega-content .col-50{ flex:0 0 100%; padding:0 .5rem}

}

 @media (min-width: 992px) {
    .navbar-toggler{ visibility: hidden; }
    .navbar-expand-lg .navbar-nav{ margin-left:auto;background-color: transparent;}
    .navbar {background-color:transparent;}
    .navbar-expand-lg .navbar-nav .dropdown-menu.megamenu {position: absolute;left: 0; backdrop-filter: saturate(180%) blur(15px);background-color: rgba(0,0,0,.7);box-shadow: 0 13px 22px -5px rgba(0,0,0,.06);max-width: 600px; }
    .navbar-expand-lg .navbar-nav .dropdown-menu.megamenu.megamenu-right {position: absolute; left: inherit; right:0; backdrop-filter: saturate(180%) blur(15px);background-color: rgba(0,0,0,.7);box-shadow: 0 13px 22px -5px rgba(0,0,0,.06); max-width: 800px;}
    .dropdown-menu{display:block !important; opacity: 0; z-index:0; transition: .3s ease-in-out;transform: translate(100%, 0%); }
    .dropdown-menu.show{transform: translate(0%, 0%); opacity: 1; z-index:10;}
    .dropdown-menu.megamenu::before { content:""; position:absolute; top:-11px; right:50px; width: 0;height: 0;border-left: 10px solid transparent;border-right: 10px solid transparent; border-bottom: 11px solid rgba(2, 2, 2, 0.698);}
    .dropdown-menu::before { content:""; position:absolute; border-color:rgba(2, 2, 2, 0.698); border-width: 7px; margin-left: -7px;right:30px;}


  }