﻿.cover	{	-webkit-backdrop-filter: blur(8px);  backdrop-filter: blur(8px); }

/* --- Nav --- */

body.navi nav, nav					
	{	transition: height 600ms ease-in-out 0ms; }
	
	nav .flex > div > a,
	nav .flex > div > a:hover		{	transition: background-position 240ms ease-in-out 0ms; }

header div:nth-child(1), header.sticky div:nth-child(1)	
	{	transition: top 420ms ease-in-out 0ms; }

/* --- Header --- */

header, header.sticky 					
	{	transition: height 300ms ease-in-out 0ms; }

header div:nth-child(1), header.sticky div:nth-child(1)	
	{	transition: top 420ms ease-in-out 0ms; }
	
/* --- Intro --- */

#motiv > div	{	animation-duration: 		60s;
					animation-iteration-count: 	infinite;
					animation-timing-function: 	ease-in-out; }
	
	#motiv-2	{	animation-name:	motiv-1; }
	#motiv-2	{	animation-name:	motiv-2; }
	#motiv-3	{	animation-name: motiv-3; }
							
		@keyframes motiv-1 {
			00.00% 	{	opacity: 1.0; }
			28.33% 	{	opacity: 1.0; }
			33.33% 	{	opacity: 0.0; }
			61.66% 	{	opacity: 0.0; }
			66.66% 	{	opacity: 0.0; }
			95.00% 	{	opacity: 0.0; }
			100.0% 	{	opacity: 1.0; }}
			
		@keyframes motiv-2 {
			00.00% 	{	opacity: 0.0; }
			28.33% 	{	opacity: 0.0; }
			33.33% 	{	opacity: 1.0; }
			61.66% 	{	opacity: 1.0; }
			66.66% 	{	opacity: 1.0; }
			95.00% 	{	opacity: 0.0; }
			100.0% 	{	opacity: 0.0; }}
			
		@keyframes motiv-3 {
			00.00% 	{	opacity: 0.0; }
			28.33% 	{	opacity: 0.0; }
			33.33% 	{	opacity: 0.0; }
			61.66% 	{	opacity: 0.0; }
			66.66% 	{	opacity: 1.0; }
			95.00% 	{	opacity: 1.0; }
			100.0% 	{	opacity: 0.0; }}

/* --- Teaser --- */

a.teaser:hover	{	transform: scale(1.15); transition: transform 300ms ease-in-out 0ms;  }
a.teaser		{	transform: scale(1.00); transition: transform 300ms ease-in-out 100ms;  }

/* --- Buttons und Links --- */

.ico, .btn, input[type=submit]			
	{	transition: all 240ms ease-in-out 0ms; }
		
.ico:hover, .btn:hover, input[type=submit]:hover	
	{	transition: all 240ms ease-in-out 0ms;  }
	
/* --- Buttons und Links --- */

.section > div > .flap.flap-off, .section > div > .flap			
	{	transition: max-height 600ms ease-in-out 100ms; }
	
/* --- Popup-NL --- */

#popup-nl, #popup-nl:target		{	transition: bottom 300ms ease-in-out 100ms; }

#popup-nl	{	animation-name:				popup-nl; 
				animation-duration: 		60s;
				animation-iteration-count: 	1;
				animation-timing-function: 	ease-in-out; }

				@keyframes popup-nl {
				00.00% 	{	opacity: 0.0; }
				65.66% 	{	opacity: 0.0; }
				66.66% 	{	opacity: 1.0; }
				100.0% 	{	opacity: 1.0; }}

/* --- Blur --- */

#cookies
	{	-webkit-backdrop-filter:	blur(8px);
		-moz-backdrop-filter:		blur(8px);
		-o-backdrop-filter:			blur(8px);
		-ms-backdrop-filter:		blur(8px);
		backdrop-filter:			blur(8px); }