@charset "utf-8";
/* CSS Document */
	.lampav,
	.lampbv,
	.lampcv,
	.lampdv{fill:#010202;}
	.st1{fill:none;stroke:#00A1DE;stroke-width:16.4089;stroke-miterlimit:10;}
	.st2{fill:#BC9999;}
	.st3{fill:#FFFFFF;stroke:#FFFFFF;stroke-miterlimit:10;}
	.st4{fill:#FFFFFF;}
	.st5{fill:#BC9999;stroke:#332C2D;stroke-width:9.978;stroke-miterlimit:10;}
	.st6{fill:#636363;}
	.st7{fill:#FFFFFF;stroke:#332C2D;stroke-width:9.978;stroke-miterlimit:10;}
	.st8{fill:#9CA3B7;}
	.st9{fill:#00A1DE;stroke:#332C2D;stroke-width:9.978;stroke-miterlimit:10;}
	.st10{fill:#BC9999;stroke:#150221;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
	.kllamp1,
	.kllamp2,
	.kllamp3,
	.kllamp4,
	.kllamp5,
	.kllamp6,
	.kllamp7,
	.kllamp8,
	.kllamp9,
	.kllamp10,
	.kllamp11,
	.kllamp12,
	.kllamp13,
	.kllamp14,
	.kllamp15,
	.kllamp16,
	.kllamp17{fill:#332C2D;}
	.st12{fill:none;stroke:#332C2D;stroke-width:9.978;stroke-miterlimit:10;

	
}
#top .logo,
#header .logo{
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 1;
	/*top: 2%;*/
}
.logo .svg-container{
	height: 100%;
}
#top .logo img,
#header .logo img{	
	width: 100vw;
}
.svg-container{
	width: 100%;
    height: 100vh; /* Pas aan zoals nodig */
    display: flex;
    justify-content: center;
     align-items: center;

}svg#logo-ufosbestaan{
	width: 100%;
	height: 100%;
	
	
}
@media only screen and (max-width: 1200px) { 
#top .logo,
#header .logo{
	width: 100vw;	
	
	
	}
}
@media only screen and (max-width: 767px) { 

svg #achtergrond{
	opacity: 1;

	
	
}
}


/************/



#ufo, #driehoek {
  transform-origin: center center;
}

#driehoek{
	opacity: .8;
 transform: translate3d(0, 0, 0) scale3d(0.8, 0.8, 0.8); 
	
	
}
#ufo{
animation: 
	shake 1s ease-in-out infinite, 
	move1 1.5s ease-in-out 1s, 
	move2 1.2s ease-in-out 2.8s,
	move3 1.2s ease-in-out 5.7s;
transform: translate3d(0, 0, 0) scale3d(0.8, 0.8, 0.8);




}
@keyframes shake {
  0%, 100% {transform: translate3d(-1px, 5px, 3px) scale3d(0.8, 0.8, 0.8);;}  
  20%, 80% {transform: translate3d(2px, -1px, -3px) scale3d(0.8, 0.8, 0.8);;}
  30%, 50%, 70% {transform: translate3d(-4px, 0, 5px) scale3d(0.8, 0.8, 0.8);;}
  40%, 60% {transform: translate3d(4px, 2px, 0) scale3d(0.8, 0.8, 0.8);;}
	 
  }


@keyframes move1 {
	10% {transform: translate3d(0, -500vw, 0) scale3d(0.8, 0.8, 0.8);;}
	45% {transform: translate3d(0, 500px, 0) scale3d(0.8, 0.8, 0.8);;}
	75% {transform: translate3d(0, 15px, 0) scale3d(0.8, 0.8, 0.8);;}
	95% {transform: translate3d(0, 0, 0) scale3d(0.8, 0.8, 0.8);;}
  }


@keyframes move2 {
  10% { transform: translate3d(0, 0, 0) scale3d(0.3, 0.3, 0.3); }
  35% { transform: translate3d(0, 0, 0) scale3d(0.3, 0.3, 0.3);}	
  45% { transform: translateX(-500vw) scale3d(0.8, 0.8, 0.8);}
	65% {transform: translateX(500px) scale3d(0.8, 0.8, 0.8);}
  70% {transform: translateX(500px) scale3d(0.8, 0.8, 0.8);}
	75% {transform: translateX(250px) scale3d(0.8, 0.8, 0.8);}
	80% {transform: translateX(150px) scale3d(0.8, 0.8, 0.8);}
	85% {transform: translateX(100px) scale3d(0.8, 0.8, 0.8);}
	90% {transform: translateX(50px) scale3d(0.8, 0.8, 0.8);}
	95% {transform: translateX(25px) scale3d(0.8, 0.8, 0.8);}
	100% {transform: translateX(0) scale3d(0.8, 0.8, 0.8);}
  }

/*
@keyframes move3 {
  10% { transform: translate3d(0, 0, -500px) scale3d(0.3, 0.3, 0.3); }
	100% { transform: translate3d(0, 0, 0) scale3d(0.3, 0.3, 0.3); }
	

}


#ufo{
animation: ufoAnimation 10s infinite;
  transform: translate3d(0, 0, 0) scale3d(0.8, 0.8, 0.8); /* Startpositie zonder schaling 
}

@keyframes ufoAnimation {
  0% { transform: translate3d(0, 0, 0) scale3d(0.8, 0.8, 0.8); }
  10% { transform: translate3d(100px, -100px, 0) scale3d(1.5, 1.5, 1.5); }
  20% { transform: translate3d(-150px, 50px, 0) scale3d(0.8, 0.8, 0.8); }
  30% { transform: translate3d(200px, 200px, 0) scale3d(1.2, 1.2, 1.2); }
  40% { transform: translate3d(-100px, -200px, 0) scale3d(0.6, 0.6, 0.6); }
  50% { transform: translate3d(50px, -50px, 0) scale3d(1.3, 1.3, 1.3); }
  60% { transform: translate3d(-200px, 150px, 0) scale3d(0.7, 0.7, 0.7); }
  70% { transform: translate3d(100px, 100px, 0) scale3d(1.4, 1.4, 1.4); }
  80% { transform: translate3d(-50px, -150px, 0) scale3d(0.9, 0.9, 0.9); }
  90% { transform: translate3d(150px, -100px, 0) scale3d(1.1, 1.1, 1.1); }
  100% { transform: translate3d(0, 0, 0) scale3d(0.8, 0.8, 0.8); }	
*/

@keyframes ufolights {
  0%        {fill: #000}
  20%       {fill: #fbcb43;}
  40%, 100% {fill: #000}
}

.lampav,
.lampbv,
.lampcv,
.lampdv{
	-moz-animation : ufolights 2.5s ease infinite; 	
	-webkit-animation: ufolights 2.5s ease infinite;
  	animation: ufolights 2.5s ease infinite;
}

.lampav {
	-moz-animation-delay : 0.2s; 	
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
}
.lampbv {
	-moz-animation-delay : 0.4s; 	
	-webkit-animation-delay: 0.4s;
	animation-delay: 0.4s;
}
.lampcv {
	-moz-animation-delay : 0.6s; 	
	-webkit-animation-delay: 0.6s;
	animation-delay: 0.6s;
}
.lampdv {
	-moz-animation-delay : 0.8s; 	
	-webkit-animation-delay: 0.8s;
	animation-delay: 0.8s;
	
	
	
}

@keyframes kleineufolamp {
  0%        {fill: #000}
  20%       {fill: #fbcb43}
  40%, 100% {fill: #000}
 
}

@keyframes kleineufolamplijn {
  20%       {stroke: #fbcb43;stroke-width: 15;stroke-miterlimit: 10;stroke-opacity: .2;}
  40% {fill: #fbcb43}
	100% {fill: #000}
}
	.kllamp1,
	.kllamp2,
	.kllamp3,
	.kllamp4,
	.kllamp5,
	.kllamp6,
	.kllamp7,
	.kllamp8,
	.kllamp9,
	.kllamp10,
	.kllamp11,
	.kllamp12,
	.kllamp13,
	.kllamp14,
	.kllamp15,
	.kllamp16,
	.kllamp17{
	-moz-animation : kleineufolamp 3s ease infinite, kleineufolamplijn 3s ease infinite; 	
	-webkit-animation: kleineufolamp 3s ease infinite, kleineufolamplijn 3s ease infinite;
  	animation: kleineufolamp 3s ease infinite, kleineufolamplijn 3s ease infinite;
}

.kllamp9 {
	-moz-animation-delay : .1s; 	
	-webkit-animation-delay: .1s;
	animation-delay: .1s;
}
.kllamp8,
.kllamp10{
	-moz-animation-delay : .3s; 	
	-webkit-animation-delay: .3s;
	animation-delay: .3;
}
.kllamp7,
.kllamp11 {
	-moz-animation-delay : .5s; 	
	-webkit-animation-delay: .5s;
	animation-delay: .5s;

 
}
.kllamp6,
.kllamp12 {
	-moz-animation-delay : .7s; 	
	-webkit-animation-delay: .7s;
	animation-delay: .7s;

 
}
.kllamp5,
.kllamp13 {
	-moz-animation-delay : .9s; 	
	-webkit-animation-delay: .9s;
	animation-delay: .9;

 
}
.kllamp4,
.kllamp14 {
	-moz-animation-delay : 1.1s; 	
	-webkit-animation-delay: 1.1s;
	animation-delay: 1.1s;

 
}
.kllamp3,
.kllamp15 {
	-moz-animation-delay : 1.3s; 	
	-webkit-animation-delay: 1.3s;
	animation-delay: 1.3s;

 
}
.kllamp2,
.kllamp16 {
	-moz-animation-delay : 1.5s; 	
	-webkit-animation-delay: 1.5s;
	animation-delay: 1.5s;

 
}
.kllamp1,
.kllamp17 {
	-moz-animation-delay : 1.7s; 	
	-webkit-animation-delay: 1.7s;
	animation-delay: 1.7s;


	
}