
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/roboto-v29-latin-regular.eot');
  src: url('../fonts/roboto-v29-latin-regular.eot?#iefix') format('embedded-opentype'),
       url('../fonts/roboto-v29-latin-regular.woff2') format('woff2'),
       url('../fonts/roboto-v29-latin-regular.woff') format('woff'),
       url('../fonts/roboto-v29-latin-regular.ttf') format('truetype'),
       url('../fonts/roboto-v29-latin-regular.svg#Roboto') format('svg');}

@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/roboto-condensed-v19-latin-regular.eot');
  src: url('../fonts/roboto-condensed-v19-latin-regular.eot?#iefix') format('embedded-opentype'),
       url('../fonts/roboto-condensed-v19-latin-regular.woff2') format('woff2'),
       url('../fonts/roboto-condensed-v19-latin-regular.woff') format('woff'),
       url('../fonts/roboto-condensed-v19-latin-regular.ttf') format('truetype'),
       url('../fonts/roboto-condensed-v19-latin-regular.svg#RobotoCondensed') format('svg');}

*{
	font-family:Roboto,Arial,sans-serif;}

.cnd{
	font-family:"Roboto Condensed",Helvetica,sans-serif;}

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;}

* a{
	color:#101F53;}

html{
 overflow:hidden;}

html,body{
	background-color:#101F53;
	line-height:125%;
	height:100%;
	min-height:100%;
	width:100%;
	overflow:hidden;
	margin:0;
	padding:0;}

div.bgImage{
	z-index:-1;
	pointer-events:none;
	background-color:transparent;
	background-repeat:no-repeat;
	background-position:center top;
	background-size:cover;
	position:absolute;left:0;top:0;
	width:100vw;
	height:100vh;
	opacity:0;}

body{
	background-color:transparent;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;}

body{overflow:auto;}

h1,h2,h3,h4,h5,h6{
	color:#101F53;
	hyphens:auto;
	width:100%;display:block;}

h1{
	line-height:100%;
	font-weight:bold;
	font-size:3rem;
	margin:0 0 1rem 0;
	text-shadow:1px 1px rgba(255,255,255,1);
	margin-top:7vw;}

h2{
	line-height:110%;
	margin:1rem 0 .75rem 0;}

h3{
	margin:0 0 .5rem 0;}

p{
	hyphens:auto;
	margin:.5rem 0 0 0;}

nav{}

header{
	margin-top:10vh;}

@keyframes bgfull{
  0% {background:rgba(16,32,83,.25);}
  100% { background:rgba(16,32,83,1);}}

@keyframes bglight{
  0% {background:rgba(16,32,83,1);}
  100% { background:rgba(16,32,83,.25);}}

@keyframes bgfull2{
  0% {background:rgba(255,255,255,.25);	box-shadow:none;}
  100% { background:rgba(255,255,255,.75);	box-shadow:0px 0px 2px 2px rgba(0,0,0,.3);}}

@keyframes bglight2{
  0% { background:rgba(255,255,255,.75);	box-shadow:0px 0px 2px 2px rgba(0,0,0,.3);}
  100% {background:rgba(255,255,255,.25);	box-shadow:none;}}

@keyframes hide{
  0% {transform: translateY(-1%);}
  80% { transform: translateY(-80%);}
  100% { transform: translateY(-80%);}}

@keyframes show {
  0% {transform: translateY(-80%);}
  80% { transform: translateY(-1%);}
	100% { transform: translateY(-1%);}}

#footer a,.bgwhite a,.bgw a,.bgw2 a,a{
	text-decoration:none;}

#footer .linklike:hover,
#footer a:hover{
	color:#4D6CDF !important;}

#footer:hover{
  animation: show .5s forwards ease-in-out;}

.touched{
	transform: translateY(-1%) !important;}

#footer{
	transform: translateY(-1%);
	cursor:pointer;
  animation: hide 1s forwards ease-in-out;
  animation-delay: .6s;
	line-height:125%;
	font-size:1.3rem;
	z-index:100;
	display:inline-block;
	width:175px !important;
	border:1px solid #DDDFE2;
	border-radius: 0 0 5% 5%;
	position: absolute;
	top: 0px;
	right: 3vw;
	padding:.5rem 20px;
	background-color:rgba(0,0,0,.3);}

.uphandle{
	margin:0 auto;
	float:right;
	display:block;
	color:rgba(255,255,255,.5);
	width:1rem;height:1rem;
	transform: rotate(90deg);}

/*#footer:hover .uphandle{visibility:hidden;}*/

#footer img{
	height:35px;
	min-height:4vh;}

#footer .fnav{
	color:#fff;
	display:block;}

#footer .luecke{
	display:block;
	height:.5rem;}

#content{
	line-height:125%;
	font-size:1.3rem;}

#content a{
	color:#101F53;}

#content a:active{
	color:#101F53;}

#content a:visited{
	color:#101F53;}

#registerform,
#loginform{
	margin:2rem 0;}

#registerform>div,
#loginform>div{
	display:inline-block;
	width:auto;
	min-width:350px;	
	padding:50px;
	cursor:default;
	box-shadow:none;
	background:rgba(255,255,255,.25);}
#registerform>div{
	background:rgba(255,255,255,.75);	box-shadow:0px 0px 2px 2px rgba(0,0,0,.3);}
#loginform>div{
  animation: bglight2 .5s backwards ease-in-out;}

#loginform>div:hover{
  animation: bgfull2 .5s forwards ease-in-out;}
	
#registerform,
#registerform select,
#registerform input,
#loginform,
#loginform select,
#loginform input{
	line-height:125%;
	font-size:1.15rem;}

#registerform select,
#registerform input[type="text"],
#registerform input[type="email"],
#registerform input[type="number"],
#registerform input[type="password"],
#loginform select,
#loginform input[type="text"],
#loginform input[type="email"],
#loginform input[type="number"],
#loginform input[type="password"]{
	padding:5px;
	border:1px solid #8F8F9D;
	border-radius:3px;
	background:white;
	min-width:250px;
	width:20vw;
	display:block;	
	margin:.25rem 0 .25rem 0 !important;}

#registerform input[type="submit"],
#loginform input[type="submit"]{
	cursor:pointer;
	margin:.25rem 1rem .25rem 0 !important;
	display:inline-block;
	background:#101F53;
	border:none;
	color:#ffffff;
	padding:5px 50px;border-radius:25px;}

#content a,.linklike{
	cursor:pointer;
	text-decoration:none; color:#101F53;}

#content a:hover,.linklike:hover{
	border-bottom:2px dotted rgba(16,32,83,.6);}

#footer .linklike{
	color:#ffffff;}

#footer .linklike:hover{
	color:#ffffff;}

.afeld{
	margin:.5rem 0;
	min-height:120px;
	width:400px;
	display:block;
	border:2px solid #101F53;}

.afeld .text{
	font-size:1.2rem;
	min-width:230px;
	display:block;
	margin-left:10px;
	padding:10px 0px 10px 0px;}

.afeld .img{
	display:inline-block;
	margin-right:10px;
	float:left;

	width:100px;
	height:100%;
	background-position:center top;
	background-repeat:no-repeat;
	background-size:cover;}

.tleft {
	text-align:center;
	display:inline-block;
	float:left;
	height:100%;
	max-width:25vw;
	width:25vw;
	width:min(300px,25vw);}

.tright,.tright2{
	display:inline-block;
	float:left;
	width:75vw;
	width:max(300px,75vw);}

.tright2{
	margin-left:25vw;
	margin-left:min(300px,25vw);}

#logo img{
	width:60%;}

.frow {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;}

.fcolumn {
  display: flex;
  flex-direction: column;
	min-width:400px;
	margin-right:20px;
  flex-basis: 100%;
  flex: 1;}

.fcolumn:last-child{
	margin-right:0px;}

.c{
	display:inline-block;
	text-align:center;}

.feld{
	margin-left:5vw;
	padding:5px;
  animation: bglight .25s forwards ease-in-out;
	line-height:125%;
	font-weight:normal;
	cursor:default;
	font-size:1.5rem;
	display:block;
	color:white;
	border:1px solid white;
	margin:0 auto;
	width:70vw;
	max-width:800px;}

.feld:hover{
  animation: bgfull .25s forwards ease-in-out;}

#vonunten{
	width:96vw;
	left: 2vw;}

#overlay{
	display:none;
	z-index:10;
	position:absolute;
	top:0;left:0;
	width:100vw;
	height:100vh;
	background:rgba(0,0,0,.6);}

#innerlay{
	border:3px solid #101F53;
	position:relative;
	top:10vh;left:10vw;
	width:80vw;
	height:80vh;
	background:rgba(255,255,255,1);}

#closer{
	cursor:pointer;
	display:inline-block;
	font-size:2rem;
	z-index:999;
	position:absolute;
	top:10vh;left:10vw;
	line-height:28px;
	width:40px;
	height:35px;
	border-radius:0 0 50% 0;
	text-align:center;
	border:3px solid #101F53;
	border-top-color:#101F53;
	border-left-color:#101F53;
	background:#9c0000;;
	color:#fff;}

.si{
	width:auto;}

@media only screen and (max-width: 1260px) {
	.feld{
		text-align:left;
		font-size:1.3rem;
		margin:0 auto;
		width:50vw;	}
}

@media only screen and (max-width: 960px) {
	#innerlay{
		border:3px solid #101F53;
		position:absolute;
		top:0vh;left:0vw;
		width:100vw;
		height:100vh;}
	#closer{
		position:absolute;
		top:0vh;left:0vw;}

	.feld{
		width:auto;max-width:90vw;}
	.tright,
	.tright2{
		margin-left:0;
		margin:0 auto;}
}

@media only screen and (max-width: 720px) {
	.fcolumn{
		margin-left:10vw;
		text-align:left;
		width:100vw;
		flex:none;
		display:block;}
}

@media only screen and (max-height: 560px) {
}