/* ! Reset */
body, html{ font-family: 'Space Grotesk', Arial, Helvetica, sans-serif; font-size: 16px; box-sizing: border-box;margin: 0;padding: 0;}*,*:before,*:after{ box-sizing: border-box; }h1,h2,h3,h4,h5,h6, p, ol, ul{margin: 0 0 1rem 0;padding: 0;}ol,ul{list-style-type: none;}img{height: auto;}h1{font-size: 4rem;} h2{font-size: 3rem;} h3{font-size: 2rem;} h4{font-size: 1rem;} h5{font-size: 0.8rem;} h6{font-size: 0.6rem;}a{text-decoration:none}

/* Menu */
:root { 
  --menu-bg: #15161d00; 
  --menu-color: #FCF8F5; 
  --primo-color: #F776E9;
  --secondo-color: #15161D;
  --terzo-color: #FCF8F5;
}

.header{ background-color: var(--menu-bg); position: fixed; bottom:0;  left:0; z-index: 9999; width: 100%; padding: 10px 15px; }
.header__content{max-width: 1200px;width: 100%;margin: 0 auto; display: flex;justify-content: space-between;}

.header__logo,
.header__quick{display: flex; align-items: center;color:var(--menu-color)}

.header__menu{padding: 0;margin: 0;}
.header__menu li{display: inline-block;}
.header__menu li a{color:var(--menu-color); opacity: 0.8;display: block;padding: 16px;font-size: 15px;}

/* Animazione entrata menu */
.header__menu li:nth-child(1){
    position: relative;
    top: -100vh;
    left: -100vw;
    transform: rotate(-180deg);
}
.header__menu li:nth-child(2){
    position: relative;
    top: -100vh;
    left: -50vw;
    transform: rotate(-90deg);
}
.header__menu li:nth-child(3){
    position: relative;
    top: -100vh;
    left: 50vw;
    transform: rotate(90deg);
}
.header__menu li:nth-child(4){
    position: relative;
    top: -100vh;
    left: 100vw;
    transform: rotate(180deg);
}

.animation .header__menu li{
    position: relative;
    top: 0;
    left: 0;
    transform: rotate(0);
    transition: all 2s cubic-bezier(.215, .61, .355, 1);
}

@media (max-width: 768px) {
  .header__menu{   
    position: absolute; top:60px; left:0; background-color: var(--menu-bg); width: 100%; height: 100vh;
    height: 0vh; overflow: hidden;transition: all 1s cubic-bezier(.215, .61, .355, 1);
  }

  .header__menu li{width: 100%;border-bottom: 1px solid #444}
  .menu-open .header__menu{height: 100vh;padding: 3%;}

  .icon-hamburger{height: 50px;width: 40px;margin-left: 20px;padding-top: 5px;}
  .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);}

  .menu-open .icon-hamburger span:nth-child(1){transform: rotate(45deg) translateY(9px);}
  .menu-open .icon-hamburger span:nth-child(2){transform: rotate(-45deg) translateY(-9px);}

  .header__quick{display: flex; justify-content: flex-end; width: 50%;}

  .header{
    top: 0;
    transition: all 1s cubic-bezier(.215, .61, .355, 1);
  }

  .menu-open .header{
    background-color: var(--secondo-color);
  }

}

/* ! Cover */
.cover{ 
  text-align: center; padding:10px; margin:0px; height:100vh; width:100%; 
  display:flex; flex-direction:column; justify-content:center; 
  background-position: center center; background-size:cover;
}
.cover * {color:#fff}
.cover__content img{
    max-height: 50vh;
    max-width: 80vw;
    filter: invert(1);
}
#video_background{
    min-width: 100%;
    min-height: 100%;
    right: 0;
    bottom: 0;
    position: fixed;
    z-index: -1;
    overflow: hidden;
}
@media (max-width: 768px){
    #video_background{
        right: -45vw;
    }
}


.current_page{
  color: var(--primo-color)!important;
}
a{
  position: relative;
  background: none;
  border: none;
  transition: all 1s cubic-bezier(.215, .61, .355, 1);
}
a::after{
  content: "";
  width: 0;
  height: 1px;
  position: absolute;
  transition: all 0.2s linear;
  background: var(--primo-color);
}
a:hover{
  color: var(--primo-color)!important;
}
a:hover::after{
  width: 100%;
}
a::after{
  right: 0;
  bottom: 10px;
  transition-duration: 0.4s;
}

.header__menu li a{
  font-size: 1.5rem;
}

@media (max-width: 768px){
  .header__menu li a{
      font-size: 1.3rem;
  }
  /* Menu in HomePage */
  .menu-homepage-mobile{
    display: block;
    top: auto;
  }
  .menu-homepage-mobile .header__quick{
    display: none;
  }
  .menu-homepage-mobile .header__menu {
    display: flex;
    position: static;
    background-color: none;
    height: auto;
  }
  .menu-homepage-mobile .header__menu li{
    border: none;
    text-align: center;
  }
  .menu-homepage-mobile .header__menu li a{
    font-size: 1rem;
    padding: 5px;
  }
}

img{
  filter: saturate(0.4) brightness(0.7)!important;
}