path[id], g[id] {
    opacity: 0;
    scale: 0.75;
    animation: fadeIn 0.1s forwards;
    transform-origin: bottom;
}
#it-deskt {
	opacity: 1;
	scale: 1;
	animation: none !important;
}
#el-8 {
    opacity: 1;
    scale: 1;
    transform: translate(3000px,-3000px);
    animation: flyIn .25s forwards; 
}
#it-desktop #el-4 {
	animation-delay: 0.90;
}
#it-desktop #el-4,
#el-5 {
	transform: translateY(-200px);
	animation-name: fadeInD !important;
	transform-origin: top !important;
}
#el-7 {
	transform: translateX(30px);
	animation-name: fadeInR !important;
	transform-origin: right !important;
}
@media (min-width: 992px){
	#el-5 {
		transform: translateX(-30px);
		animation-name: fadeInR !important;
		transform-origin: left !important;
	}
	#el-7 {
		transform: translateY(-200px);
		animation-name: fadeInD !important;
		transform-origin: top !important;
	}
}
#el-1 {
/*     animation-delay: 0.30s;  */
	opacity: 1;
	scale: 1;
}
#el-2 {
/*     animation-delay: 0.60s;  */
	opacity: 1;
	scale: 1;
}
#el-3 {
/*     animation-delay: 0.90s;  */
	opacity: 1;
	scale: 1;
}
#el-4 {
/*     animation-delay: 1.20s;  */
		opacity: 1;
		scale: 1;
}
#el-5 {
/*     animation-delay: 1.50s; */
	animation-delay: 0.30s
}
#el-6 {
/*     animation-delay: 1.80s;   */
	animation-delay: 0.60s
}
#el-7 {
/*     animation-delay: 2.10s;  */
	animation-delay: 0.90s
}
#el-8 {
/*     animation-delay: 2.40s; */
	animation-delay: 1.20s
}
#el-9 {
/*     animation-delay: 2.70s;  */
	animation-delay: 1.50s
}
#el-10 {
/*     animation-delay: 3.00s;  */
	animation-delay: 1.80s
}
#el-11 {
/*     animation-delay: 3.30s;  */
	 animation-delay: 2.10s
}
#el-12 {
/*     animation-delay: 3.60s;  */
	animation-delay: 2.40s
}
#el-13 {
/*     animation-delay: 3.90s;  */
	 animation-delay: 2.70s
}
#el-14 {
/*     animation-delay: 4.20s; */
	animation-delay: 3.00s
}
#fr-mobile #el-5{
	opacity: 1;
	scale: 1;
	transform: translateX(0px);
}
#de-svg #el-15,
#fr-svg #el-15,
#de-svg-mobile #el-15,
#it-svg-mobile #el-15 {
/*     animation-delay: 4.50s; */
	animation-delay: 3.30s;
}
#el-16 {
/*     animation-delay: 4.80s; */
	animation-delay: 3.60s;
}
#it-svg #el-17,
#it-svg-mobile #el-17 {
	animation-delay: 3.90s;
/*     animation-delay: 5.10s; */
}

@keyframes fadeIn {
    to {
        opacity: 1;
        scale: 1;
    }
}
@keyframes fadeInR {
    to {
        opacity: 1;
        scale: 1;
        transform: translateX(0);
    }
}
@keyframes fadeInD {
    to {
        opacity: 1;
        scale: 1;
        transform: translateY(0);
    }
}
@keyframes flyIn {
    to {
        transform: translate(0,0);
    }
}

/* .cookie-banner.animate {
    transition: fadeUp 0.6s ease-in-out;
    animation: fadeUp 0.6s forwards;
    animation-delay: 1s;
    transform: translateY(100%);
}
@keyframes fadeUp {
    from {
        transform: translateY(100%);
    }
    to {
        transform: translateY(0);
    }
} */


@keyframes rotating {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }
  
  #spin-img {
    -webkit-animation: rotating 2s linear infinite;
    -moz-animation: rotating 2s linear infinite;
    -ms-animation: rotating 2s linear infinite;
    -o-animation: rotating 2s linear infinite;
    animation: rotating 2s linear infinite;
    transform-origin: center;
  }
  
.animation-4 {
    opacity: 0;
    filter: blur(0);
    transform: translateY(50%);
    transition: all 0.8s ease-in-out;
}

.animation-4[animation="true"] {
    opacity: 1;
    transform: translateX(0);
}
.navigation path[id], .navigation g[id] {
    opacity: 0;
    transform-origin: center;
    pointer-events: none;
    transition: none;
}


.navigation.active path[id],
.navigation.active g[id] {
    animation: navigationShow 0.015s forwards;
    scale: 1;
}
.navigation.active {
	animation: backgroundAni 0.015s forwards;
}
.navigation.inactive path[id],
.navigation.inactive g[id] {
    animation: navigationHide 0.015s forwards;
    opacity: 1;
    scale: 0.75;
}
.navigation.inactive {
	animation: backgroundAniHide 0.015s forwards;
}
/* Individual delays - active */
.navigation.active #nav-1 { animation-delay: 0.015s; }
.navigation.active #nav-2 { animation-delay: 0.03s; }
.navigation.active #nav-3 { animation-delay: 0.045s; }
.navigation.active #nav-4 { animation-delay: 0.06s; }
.navigation.active #nav-5 { animation-delay: 0.075s; }
.navigation.active #nav-6 { animation-delay: 0.09s; }
.navigation.active #nav-7 { animation-delay: 0.105s; }
.navigation.active #nav-8 { animation-delay: 0.12s; }
.navigation.active #nav-9 { animation-delay: 0.135s; }
.navigation.active #nav-10 { animation-delay: 0.15s; }
.navigation.active #nav-11 { animation-delay: 0.165s; }


/* Individual delays - inactive */
.navigation.inactive #nav-11 { animation-delay: 0.015s; }
.navigation.inactive #nav-10 { animation-delay: 0.03s; }
.navigation.inactive #nav-9  { animation-delay: 0.045s; }
.navigation.inactive #nav-8  { animation-delay: 0.06s; }
.navigation.inactive #nav-7  { animation-delay: 0.075s; }
.navigation.inactive #nav-6  { animation-delay: 0.09s; }
.navigation.inactive #nav-5  { animation-delay: 0.105s; }
.navigation.inactive #nav-4  { animation-delay: 0.12s; }
.navigation.inactive #nav-3  { animation-delay: 0.135s; }
.navigation.inactive #nav-2  { animation-delay: 0.15s; }
.navigation.inactive #nav-1  { animation-delay: 0.165s; }



@keyframes navigationShow {
    from { opacity: 0;scale: 0.75; }
    to { opacity: 1;scale: 1; }
}
@keyframes backgroundAni {
    from { background: transparent; }
    to { background: #000; }
}
@keyframes show {
    from {opacity: 0;}
    to { opacity: 1;}
}
@keyframes navigationHide {
    to { opacity: 0;scale: 0.75; }
}
@keyframes backgroundAni {
    to { background: transparent; }
}
.navigation-menu {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.navigation-menu.visible {
    opacity: 1;
    pointer-events: auto;
}

.animation-5 {
    opacity: 0;
    filter: blur(0);
    transform: translate(-55%, -30%) rotate(11deg);
    transition: all 0.8s ease-in-out;
}

.animation-5[animation="true"] {
    opacity: 1;
    transform: translate(-50%, -50%) rotate(11deg);
}
