/*body {
    opacity: 0;
    transition: opacity 0.6s ease;
}
body main {
    opacity: 1;
    transition: opacity 0.6s ease;
}*/

:root {
    --anim_translateX: 0vw;
    --anim_translateY: 0vh;
    --anim_endX: 0vw;
    --anim_endY: 0vh;
    --anim_max_zoom: 11;
}

fader {
    display: none;
    position: fixed;
    top:  0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 100;
    user-select: none;
  }
  fader .blob {
    position: relative;
    z-index: 100;
    width: 100%;
    height: 100%;
  }
  fader .blob path {
   transform: scale(1) translate(calc(var(--anim_translateX) * 1.0), calc(var(--anim_translateY) * 1.0));
   -o-transform: scale(1) translate(calc(var(--anim_translateX) * 1.0), calc(var(--anim_translateY) * 1.0));
   -webkit-transform: scale(1) translate(calc(var(--anim_translateX) * 1.0), calc(var(--anim_translateY) * 1.0));
   -ms-transform: scale(1) translate(calc(var(--anim_translateX) * 1.0), calc(var(--anim_translateY) * 1.0));
   -moz-transform: scale(1) translate(calc(var(--anim_translateX) * 1.0), calc(var(--anim_translateY) * 1.0));
  }
  
fader h1.testo_del_fade {
    position: absolute;
    top: 0;
    z-index: 101;
    max-width: 100%;
    text-align: center;
    width: 100%;
    opacity: 0.0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    padding: 0 5%;
    line-height: 1.5;
     box-sizing: border-box;
  }
  
  @keyframes testo_fader {
    0% {    
      opacity: 0.0;
    }
    37% {    
      opacity: 0.0;
    }
    38% {    
      opacity: 1.0;
    }
    50% {    
      opacity: 1.0;
    }
    56% {    
  
      opacity: 1.0;
    }
    57% {    
      opacity: 0.0;
    }
    100% {    
      opacity: 0.0;
    }
  }

  @keyframes testo_fader_MOBILE {
    0% {    
      opacity: 0.0;
    }
    32% {    
      opacity: 0.0;
    }
    33% {    
      opacity: 1.0;
    }
    50% {    
      opacity: 1.0;
    }
    59% {    
  
      opacity: 1.0;
    }
    60% {    
      opacity: 0.0;
    }
    100% {    
      opacity: 0.0;
    }
  }

  /* ANIMAZIONE 1 */
  
  @keyframes blob {
    0% {    
      opacity: 0.0;
      d:path("M120,-157.6C152.7,-141.5,174.3,-102.6,194.8,-58.8C215.3,-14.9,234.6,33.8,228.4,80.8C222.2,127.8,190.4,173.1,148.1,184C105.8,195,52.9,171.5,-2.4,174.8C-57.8,178.2,-115.6,208.4,-137.5,190.9C-159.3,173.3,-145.3,108,-153,56.3C-160.7,4.6,-190.2,-33.4,-178.3,-54.2C-166.4,-75.1,-113.2,-78.8,-76.6,-93.6C-40,-108.3,-20,-134.2,11.9,-150.5C43.7,-166.8,87.4,-173.6,120,-157.6Z");
 
      transform: scale(1.3) translate(calc(var(--anim_translateX) * 1.3), calc(var(--anim_translateY) * 1));
      -o-transform: scale(1.3) translate(calc(var(--anim_translateX) * 1.3), calc(var(--anim_translateY) * 1));
      -ms-transform: scale(1.3) translate(calc(var(--anim_translateX) * 1.3), calc(var(--anim_translateY) * 1));
      -webkit-transform: scale(1.3) translate(calc(var(--anim_translateX) * 1.3), calc(var(--anim_translateY) * 1));
      -moz-transform: scale(1.3) translate(calc(var(--anim_translateX) * 1.3), calc(var(--anim_translateY) * 1));
    }
    2% {
       opacity: 0.0;
    }
    
    2.8% {
        opacity: 1.0;
    }
    2.9% {
        d:path("67.8,-97.1C87.8,-78.8,103.8,-58.9,117.4,-34.1C130.9,-9.4,142,20.2,139.5,50.7C137,81.2,120.8,112.6,95.3,150.1C69.8,187.7,34.9,231.3,3.3,226.8C-28.2,222.2,-56.4,169.3,-91.6,134.9C-126.8,100.5,-169,84.6,-179.6,57.1C-190.2,29.7,-169.3,-9.3,-155.2,-49.7C-141,-90.1,-133.7,-132,-109,-148.8C-84.2,-165.6,-42.1,-157.3,-9.1,-144.8C23.9,-132.2,47.8,-115.5,67.8,-97.1Z");
    
    }
    10% {
        /*//transform: scale(calc(var(--anim_max_zoom) * 0.77)) translate(calc(var(--anim_translateX) * 0.49), calc(var(--anim_translateY) * 0.49));
        */}
    12% {
        transform: scale(calc(var(--anim_max_zoom) * 0.30)) translate(calc(var(--anim_translateX) * 0.55), calc(var(--anim_translateY) * 0.55));/**/
        -o-transform: scale(calc(var(--anim_max_zoom) * 0.30)) translate(calc(var(--anim_translateX) * 0.55), calc(var(--anim_translateY) * 0.55));/**/
        -webkit-transform: scale(calc(var(--anim_max_zoom) * 0.30)) translate(calc(var(--anim_translateX) * 0.55), calc(var(--anim_translateY) * 0.55));/**/
        -ms-transform: scale(calc(var(--anim_max_zoom) * 0.30)) translate(calc(var(--anim_translateX) * 0.55), calc(var(--anim_translateY) * 0.55));/**/
        -moz-transform: scale(calc(var(--anim_max_zoom) * 0.30)) translate(calc(var(--anim_translateX) * 0.55), calc(var(--anim_translateY) * 0.55));/**/
        d:path("M123.7,-157.1C162.4,-142.2,197.2,-108.8,202.8,-70.8C208.3,-32.9,184.5,9.7,169,54.2C153.6,98.7,146.4,145.2,119.7,162.7C92.9,180.2,46.4,168.6,-1.9,171.1C-50.2,173.7,-100.3,190.4,-122.2,171.3C-144.1,152.3,-137.7,97.5,-144.1,52.7C-150.6,7.9,-169.9,-26.8,-170.5,-64.8C-171,-102.8,-152.8,-144,-121.3,-161.3C-89.7,-178.5,-44.9,-171.8,-1.2,-170.1C42.5,-168.5,85,-172,123.7,-157.1Z");    
    
        /*transform: scale(calc(var(--anim_max_zoom) * 0.85)) translate(calc(var(--anim_translateX) * 0.21), calc(var(--anim_translateY) * 0.21));*/
    }
    40% {    
        d:path("MM137.1,-191.3C172,-163.4,190.6,-115.7,197.2,-70.1C203.8,-24.4,198.5,19.2,178.9,51.5C159.3,83.9,125.5,105,93.3,129.6C61.1,154.1,30.6,182.1,1.1,180.6C-28.4,179.1,-56.8,148.2,-81.2,121.1C-105.6,94.1,-126.1,70.8,-141.6,41.6C-157.2,12.4,-168,-22.9,-153.9,-45C-139.8,-67,-100.7,-76,-70.9,-105.5C-41.1,-135,-20.6,-185,15.3,-206C51.1,-227.1,102.3,-219.1,137.1,-191.3Z");
        transform: scale(var(--anim_max_zoom)) translate(calc(var(--anim_translateX) * 0.0), calc(var(--anim_translateY) * 0.0));
         -o-transform: scale(var(--anim_max_zoom)) translate(calc(var(--anim_translateX) * 0.0), calc(var(--anim_translateY) * 0.0));
          -moz-transform: scale(var(--anim_max_zoom)) translate(calc(var(--anim_translateX) * 0.0), calc(var(--anim_translateY) * 0.0));
           -webkit-transform: scale(var(--anim_max_zoom)) translate(calc(var(--anim_translateX) * 0.0), calc(var(--anim_translateY) * 0.0));
            -ms-transform: scale(var(--anim_max_zoom)) translate(calc(var(--anim_translateX) * 0.0), calc(var(--anim_translateY) * 0.0));
    }
    50% { 
        opacity: 1.0;
    }
    62% {    
        d:path("M137.1,-191.3C172,-163.4,190.6,-115.7,197.2,-70.1C203.8,-24.4,198.5,19.2,178.9,51.5C159.3,83.9,125.5,105,93.3,129.6C61.1,154.1,30.6,182.1,1.1,180.6C-28.4,179.1,-56.8,148.2,-81.2,121.1C-105.6,94.1,-126.1,70.8,-141.6,41.6C-157.2,12.4,-168,-22.9,-153.9,-45C-139.8,-67,-100.7,-76,-70.9,-105.5C-41.1,-135,-20.6,-185,15.3,-206C51.1,-227.1,102.3,-219.1,137.1,-191.3Z");
        transform: scale(var(--anim_max_zoom)) translate(calc(var(--anim_endY) * 0.0), calc(var(--anim_endY) * 0.0));
        -o-transform: scale(var(--anim_max_zoom)) translate(calc(var(--anim_endY) * 0.0), calc(var(--anim_endY) * 0.0));
        -ms-transform: scale(var(--anim_max_zoom)) translate(calc(var(--anim_endY) * 0.0), calc(var(--anim_endY) * 0.0));
        -moz-transform: scale(var(--anim_max_zoom)) translate(calc(var(--anim_endY) * 0.0), calc(var(--anim_endY) * 0.0));
        -webkit-transform: scale(var(--anim_max_zoom)) translate(calc(var(--anim_endY) * 0.0), calc(var(--anim_endY) * 0.0));
    }
    88% {
        transform: scale(calc(var(--anim_max_zoom) * 0.30)) translate(calc(var(--anim_endX) * 0.61), calc(var(--anim_endY) * 0.64));/**/
        -o-transform: scale(calc(var(--anim_max_zoom) * 0.30)) translate(calc(var(--anim_endX) * 0.61), calc(var(--anim_endY) * 0.64));/**/
        -moz-transform: scale(calc(var(--anim_max_zoom) * 0.30)) translate(calc(var(--anim_endX) * 0.61), calc(var(--anim_endY) * 0.64));/**/
        -ms-transform: scale(calc(var(--anim_max_zoom) * 0.30)) translate(calc(var(--anim_endX) * 0.61), calc(var(--anim_endY) * 0.64));/**/
        -webkit-transform: scale(calc(var(--anim_max_zoom) * 0.30)) translate(calc(var(--anim_endX) * 0.61), calc(var(--anim_endY) * 0.64));/**/
        d:path("M123.7,-157.1C162.4,-142.2,197.2,-108.8,202.8,-70.8C208.3,-32.9,184.5,9.7,169,54.2C153.6,98.7,146.4,145.2,119.7,162.7C92.9,180.2,46.4,168.6,-1.9,171.1C-50.2,173.7,-100.3,190.4,-122.2,171.3C-144.1,152.3,-137.7,97.5,-144.1,52.7C-150.6,7.9,-169.9,-26.8,-170.5,-64.8C-171,-102.8,-152.8,-144,-121.3,-161.3C-89.7,-178.5,-44.9,-171.8,-1.2,-170.1C42.5,-168.5,85,-172,123.7,-157.1Z");
    
        /*transform: scale(calc(var(--anim_max_zoom) * 0.45)) translate(calc(var(--anim_endX) * 0.61), calc(var(--anim_endY) * 0.61));*/
    }
    90% {
        /*transform: scale(calc(var(--anim_max_zoom) * 0.34)) translate(calc(var(--anim_endX) * 0.79), calc(var(--anim_endY) * 0.79));*/
       }
    95% {
        d:path("M120,-157.6C152.7,-141.5,174.3,-102.6,194.8,-58.8C215.3,-14.9,234.6,33.8,228.4,80.8C222.2,127.8,190.4,173.1,148.1,184C105.8,195,52.9,171.5,-2.4,174.8C-57.8,178.2,-115.6,208.4,-137.5,190.9C-159.3,173.3,-145.3,108,-153,56.3C-160.7,4.6,-190.2,-33.4,-178.3,-54.2C-166.4,-75.1,-113.2,-78.8,-76.6,-93.6C-40,-108.3,-20,-134.2,11.9,-150.5C43.7,-166.8,87.4,-173.6,120,-157.6Z");
    
    } 
    96% {    
        opacity: 1.0;
    }
    97% {    
      opacity: 0.0;
    }
    100% {    
      opacity: 0.0;
      transform: scale(0.5) translate(calc(var(--anim_endX) * 1.6), calc(var(--anim_endY) * 1.6));
       -o-transform: scale(0.5) translate(calc(var(--anim_endX) * 1.6), calc(var(--anim_endY) * 1.6));
        -moz-ransform: scale(0.5) translate(calc(var(--anim_endX) * 1.6), calc(var(--anim_endY) * 1.6));
         -ms-transform: scale(0.5) translate(calc(var(--anim_endX) * 1.6), calc(var(--anim_endY) * 1.6));
          -webkit-transform: scale(0.5) translate(calc(var(--anim_endX) * 1.6), calc(var(--anim_endY) * 1.6));
      d:path("M87.8,-97.1C87.8,-78.8,103.8,-58.9,117.4,-34.1C130.9,-9.4,142,20.2,139.5,50.7C137,81.2,120.8,112.6,95.3,150.1C69.8,187.7,34.9,231.3,3.3,226.8C-28.2,222.2,-56.4,169.3,-91.6,134.9C-126.8,100.5,-169,84.6,-179.6,57.1C-190.2,29.7,-169.3,-9.3,-155.2,-49.7C-141,-90.1,-133.7,-132,-109,-148.8C-84.2,-165.6,-42.1,-157.3,-9.1,-144.8C23.9,-132.2,47.8,-115.5,67.8,-97.1Z");
    }
  }