@charset "UTF-8";
body {
	font-size: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	-webkit-animation: fadein 1s ease-in;
	        animation: fadein 1s ease-in;
	background-color: rgba(31, 92, 161, .2);
}
* {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
} 
main {
	position: absolute;
	left: 50%;
	top: 48px;
	top: 3rem;
	width: 300px;
	width: 18.75rem;
	height: auto;
	margin-left: -150px;
	margin-left: -9.375rem;
	z-index: 1;
}
.gb-logo {
	position: absolute;
	left: 50%;
	top: 10px;
	top: .625rem;
	width: 260px;
	width: 16.25rem;
	margin-left: -130px;
	margin-left: -8.125rem;
	z-index: 2;
}
.gb-seit {
	position: absolute;
	left: 50%;
	top: 34px;
	top: 2.125rem;
	width: 88px;
	width: 5.5rem;
	height: 22px;
	height: 1.375rem;
	margin-left: -44px;
	margin-left: -2.75rem;
	border-radius: 2px;
	border-radius: .125rem;
	font-family: 'Suez One', cursive;
	font-size: 16px;
	text-align: center;
	color: rgb(119, 102, 83);
	background-color: rgba(255, 255, 255, .8);
	-webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, .5);
	        box-shadow: 1px 1px 3px rgba(0, 0, 0, .5);
 	-webkit-animation: fadein 1s ease-in;
	        animation: fadein 1s ease-in;
   	z-index: 20;
}
.gb-ton {
	position: absolute;
	top: 288px;
	top: 18rem;
	left: 16px;
	left: 1rem;
	width: 48px;
	width: 3rem;
	border-radius: 6px;
	border-radius: .375rem;
	cursor: pointer;
	background-color: rgb(31, 92, 161);
}
.gb-ton:hover {
	-webkit-transition: -webkit-transform 0.8s;
			transition: -webkit-transform 0.8s;
			transition: transform 0.8s;
			transition: transform 0.8s, -webkit-transform 0.8s;
	-webkit-transform: scale(1.05, 1.05);
	        transform: scale(1.05, 1.05);
}
.gb-sprache {
	position: absolute;
	top: 4px;
	top: .25rem;
	left: 50%;
	width: 24px;
	width: 1.5rem;
	margin-left: 70px;
	margin-left: 4.375rem;
	z-index: 21;
}
.gb-icon {
	position: relative;
	top: -14px;
	top: -.875rem;
	width: 24px;
	width: 1.875rem;
	margin-right: 2px;
	margin-right: .125rem;
	opacity: .7;
}
nav {
	position: absolute;
	left: 20px;
	left: 1.125rem;
	top: 16px;
	top: 1rem;
	margin: 0;
	opacity: .9;
	z-index: 5;
}
ul {
	list-style: none;
	width: 220px;
	width: 13.75rem;
	margin: 0;
	padding: 0;
}
li {
	border-radius: 2px;
	border-radius: .125rem;
	border-width: 1px;
	border-style: solid;
	border-color: rgb(255, 255, 255) rgb(0, 0, 0) rgb(0, 0, 0) rgb(255, 255, 255);
	padding: 6px 0 6px 10px;
	padding: .375rem 0 .375rem .625rem;
	background-color: rgba(255, 255, 255, .4);
	margin-bottom: 8px;
	margin-bottom: .5rem;
	color: rgb(255, 255, 255);
}
li.farbe {
	background-color: rgba(248, 231, 107, .7);
}
footer {
	position: relative;
	left: 50%;
	width: 300px;
	width: 18.75rem;
	height: auto;
	margin-left: -150px;
	margin-left: -9.375rem;
}
.shadow-1 {
	-webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, .8);
	        box-shadow: 1px 1px 2px rgba(0, 0, 0, .8);
	-webkit-box-shadow: .0625rem .0625rem .125rem rgba(0, 0, 0, .8);
	        box-shadow: .0625rem .0625rem .125rem rgba(0, 0, 0, .8);
}
h1 {
	font-family: 'Roboto', sans-serif;
	margin: 0;	
}
p {
	font-family: 'Roboto Slab', serif;
	font-size: 16px;
	font-size: 1rem;
	font-weight: 400;
	line-height: 120%;
	text-align: center;
	margin: 0;	
}
.fs-1 {
	font-size: 24px;
	font-size: 1.5rem;
	font-weight: 900;
	font-size: 1.5rem;
	text-shadow: 1px 1px 1px rgb(0, 0, 0), 1px -1px 1px rgb(0, 0, 0), -1px  1px 1px rgb(0, 0, 0), -1px -1px 1px rgb(0, 0, 0);
}
.fs-2 {
	font-size: 14px;
	font-size: .875rem;
	font-weight: 400;
	text-align: center;
}

/* animationen */
@-webkit-keyframes fadeInDown {
  from {opacity: 0;
    	-webkit-transform: translateY(-200%);
    	        transform: translateY(-200%);}
  to   {opacity: 1;
	    -webkit-transform: none;
	            transform: none;}
}
@keyframes fadeInDown {
  from {opacity: 0;
    	-webkit-transform: translateY(-200%);
    	        transform: translateY(-200%);}
  to   {opacity: 1;
	    -webkit-transform: none;
	            transform: none;}
}
.fadeInDown {
	-webkit-animation-name: fadeInDown;
	        animation-name: fadeInDown;
	-webkit-animation-duration: 0.8s;
	        animation-duration: 0.8s;
	-webkit-animation-timing-function: ease-out;
	        animation-timing-function: ease-out;
}
@-webkit-keyframes fadein {
	from {
		opacity:0;
	}
	to {
		opacity:1;
	}
}
@keyframes fadein {
	from {
		opacity:0;
	}
	to {
		opacity:1;
	}
}
@-webkit-keyframes ticker {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
@keyframes ticker {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
a:link {
	text-decoration: none; 
}

li a:link, li a:visited { 
	color: rgb(255, 255, 255);
}
li a:hover { 
	font-size: 105%;
	color: rgb(230, 230, 230);
}
li a:active, li a:focus {
	outline: none;
}
footer a:link {
	color: rgb(31, 92, 161);
}
footer a:hover {
	color: rgb(128, 128, 128);
}
@media (min-width: 800px) {
	main {
		left: 50%;
		top: 92px;
		top: 5.75rem;
		width: 704px;
		width: 44rem;
		margin-left: -352px;
		margin-left: -22rem;
	}
	.gb-logo {
		left: 50%;
		top: 10px;
		top: .625rem;
		width: 608px;
		width: 38rem;
   		margin-left: -304px;
   		margin-left: -19rem;
	}	
	.gb-seit {
		top: 66px;
		top: 4.125rem;
		width: 208px;
		width: 13rem;
		height: 39px;
		height: 2.375rem;
		margin-left: -104px;
		margin-left: -6.5rem;
		border-radius: 3px;
		border-radius: .1875rem;
		font-size: 28px;
		font-size: 1.75rem;
		background-color: rgba(255, 255, 255, .7);
	}
	.gb-ton {
		left: 576px;
		left: 36rem;
		top: 24px;
		top: 1.5rem;
		width: 80px;
		width: 5rem;
		border-radius: 6px;
		border-radius: .375rem;
	}
	.gb-sprache {
		width: 32px;
		width: 2rem;
		margin-left: 186px;
		margin-left: 11.625rem;
	}
	.gb-icon {
		top: -20px;
		top: -1.25rem;
		width: 32px;
		width: 2rem;
		margin-right: 4px;
		margin-right: .25rem;
	}
	nav {
		left: 32px;
		left: 2rem;
		top: 24px;
		top: 1.5rem;
		font-size: 28px;
		font-size: 1.75rem;
		z-index: 2;
	}
	ul {
		width: 300px;
		width: 18.75rem;
	}
	li {
		border-radius: 3px;
		border-radius: 0.1875rem;
		margin-bottom: 16px;
		margin-bottom: 1rem;
		padding: 6px 0 6px 16px;
		padding: .375rem 0 .375rem 1rem;

	}
	footer {
		margin-top: 4px;
		margin-top: .25rem;
	}
	.fs-1 {
		font-size: 28px;
		font-size: 1.75rem;
	}
	.fs-2 {
		font-size: 16px;
		font-size: 1rem;
	}
	.shadow-1 {
		-webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, .7);
		        box-shadow: 2px 2px 4px rgba(0, 0, 0, .7);
		-webkit-box-shadow: .125rem .125rem .25rem rgba(0, 0, 0, .7);
		        box-shadow: .125rem .125rem .25rem rgba(0, 0, 0, .7);
	}
}
@media (min-width: 1280px) {
	main {
		left: 50%;
		top: 130px;
		top: 8.125rem;
		width: 1024px;
		width: 64rem;
		margin-left: -512px;
		margin-left: -32rem;
	}
	.gb-logo {
		top: 20px;
		left: 50%;
		width: 800px;
		width: 50rem;
   	margin-left: -400px;
   	margin-left: -25rem;
	}	
	.gb-seit {
		top: 96px;
		top: 6rem;
		width: 280px;
		width: 17.5rem;
		height: 48px;
		height: 3rem;
    	margin-left: -140px;
		border-radius: 4px;
		border-radius: .25rem;
		font-size: 36px;
		font-size: 2.25rem;
		background-color: rgba(255, 255, 255, .7);
	}
	.gb-ton {
		top: 36px;
		top: 2.25rem;
		left: 864px;
		left: 54rem;
		width: 96px;
		width: 6rem;
		border-radius: 8px;
		border-radius: .5rem;
	}
	.gb-sprache {
		top: 8px;
		top: .5rem;
		width: 48px;
		width: 3rem;
		margin-left: 240px;
		margin-left: 15rem;
	}
	.gb-icon {
		top: -32px;
		top: -1rem;
		width: 48px;
		width: 3rem;
	}
/* Ticker */	
	.ticker-wrap {
		top: 17rem;
  	height: 3rem;
	}
	.ticker-wrap .ticker {
  	height: 3rem;
  	line-height: 3rem;
	}
	.ticker_item {
		font-size: 2rem;
	}
	nav {
		left: 64px;
		left: 4rem;
		top: 32px;
		top: 2rem;
		font-size: 32px;
		font-size: 2rem;
		z-index: 2;
	}
	ul {
		width: 360px;
		width: 22.5rem;
	}
	li {
		border-radius: 3px;
		border-radius: 0.1875rem;
		color: rgba(255, 255, 255, .5);
		margin-bottom: 16px;
		margin-bottom: 1rem;
		padding: 8px 0 8px 14px;
		padding: .5rem 0 .5rem .875rem;
	}
	footer {
		margin-top: 4px;
		margin-top: .25rem;
	}
	.fs-1 {
		font-size: 32px;
		font-size: 2rem;
	}
	.shadow-1 {
		-webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, .6);
		        box-shadow: 2px 2px 4px rgba(0, 0, 0, .6);
		-webkit-box-shadow: .125rem .125rem .25rem rgba(0, 0, 0, .6);
		        box-shadow: .125rem .125rem .25rem rgba(0, 0, 0, .6);
	}
}