/* stylesheet: #555, #fff, #4b4b4b, #1aa3ff */
@font-face {
	font-family: "TrebuchetMS-WOFF";
	font-style: normal;
	font-weight: 100;
	src: url(../media/TrebuchetMS.woff);
}

body {
	width: 100%;
	height: 100%;
	margin: 0;
	font-family: TrebuchetMS,TrebuchetMS-WOFF;
}

.bodybg {
	background-image: url(../media/bg.png);
	width: 100%;
	height: 100%;
	opacity: .4;
	position: fixed;
	z-index: -1;
	background-attachment: fixed;
	overflow: hidden;
	margin: 0;
}

header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 50px;
	background-color: #555;
	color: #fff;
	z-index: 2;
	box-shadow: 0 2px 12px rgba(0,0,0,.35);
	font-family: Calibri;
}

header a {
	color: #fff;
	text-decoration: none;
	display: inline-block;
	float: left;
	text-align: center;
	transition-duration: .3s;
}

header a:hover {
	color: #5dbcf2;
}

#homebtn {
	float: left;
	z-index: 3;
	width: 270px;
	border-right: 2px solid #4b4b4b;
	border-left: none;
}

header h1 {
	font-size: 37px;
	display: inline-block;
	margin: 0;
	font-weight: normal;
	width: 100%;
	height: 100%;
}

.nava {
	height: 50px;
	float: left;
	background-color: #555;
	transition-duration: .4s;
	overflow: hidden;
	border-left: 2px solid #4b4b4b;
	border-right: 2px solid #4b4b4b;
}

.nava:hover {
	background-color: #4b4b4b;
}

.nava:nth-last-child(2) {
	border-right: 4px solid #4b4b4b;
}

#navaphoto {
	width: 180px;
	left: 285px;
	z-index: 4;
}

#navagraphic {
	width: 210px;
	left: 460px;
	z-index: 5;
}

#navaweb {
	width: 190px;
	left: 670px;
	z-index: 6;
}

#navaphoto:hover {
	height: 162px;
}

#navagraphic:hover {
	height: 126px;
}

#navaweb:hover {
	height: 126px;
}

.topnav {
	font-size: 37px;
	height: 50px;
	width: 100%;
}

.subnav {
	font-size: 24px;
	height: 30px;
	border-top: 2px solid #989898;
	width: calc(100% - 30px);
	margin: 4px 15px 0 15px;
}

header .navcurrent {
	background-color: #2283c3;
}

header .navcurrent:hover {
	background-color: #006bb3;
	color: #fff;
}

#slideshow {
	margin-top: 50px;
	width: 100%;
}

#slideshow img {
	width: 100%;
}

.popup {
	top: calc(50% - 200px);
	left: calc(50% - 400px);
	width: 800px;
	height: 400px;
	background-color: #fff;
	position: fixed;
	z-index: 4;
	box-shadow: 0 0 15px #999;
}

.popupinside {
	width: calc(100% - 20px);
	height: calc(100% - 20px);
	margin: 10px;
}

.popupleft {
	width: calc(50% - 3px);
	height: 100%;
	border-right: 6px solid #555;
	display: inline-block;
	float: left;
}

.popupright {
	width: calc(50% - 3px);
	display: inline-block;
	float: left;
}

.popup p {
	font-size: 26px;
	color: #4b4b4b;
	text-align: center;
	margin: 40px 30px 0 30px;
}

.popup img {
	margin-left: 99px;
	margin-top: 50px;
}

.popupbg {
	width: 100%;
	height: 100%;
	position: fixed;
	z-index: 3;
	background-color: #fff;
	opacity: .6;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

.popupclose {
	position: absolute;
	right: -20px;
	top: -20px;
	width: 40px;
	height: 40px;
	background-color: #555;
	cursor: pointer;
}

.languages {
	width: 160px;
	height: 38px;
	float: right;
	margin: 6px;
}

.languages img {
	height: 38px;
	width: 76px;
	transition-duration: .3s;
}

.languages img:last-child {
	float: right;
}

.languages img:hover {
	width: 84px;
	height: 42px;
	margin: -2px -4px -2px -4px;
}

.tilewrapper {
	position: relative;
	width: calc(100% - 30px);
	left: 15px;
	top: 150px;
}

.newstile {
	width: calc(100% / 3 - 4px);
	float: left;
	border-right: 6px solid #555;
	position: relative;
}

.newstile img {
	width: 40%;
}

.newstile:last-child {
	border: none;
}

.tilecontent {
	width: calc(100% - 50px);
	position: relative;
	margin: 25px;
	background-color: rgba(255,255,255,.55);
}

.tileheadline {
	text-align: center;
	color: #4b4b4b;
	font-size: 40px;
	font-weight: 100;
	margin: 0;
	width: calc(100% - 50px);
	margin-left: 25px;
	padding-top: 40px;
	padding-bottom: 40px;

}

.tilecontent article {
	margin: 0;
	color: #555;
}

.tilecontent p {
	margin: 0;
	color: #555;
	position: absolute;
	bottom: 5px;
	width: 100%;
	left: 0;
}

a {
	color: #1aa3ff;
	text-decoration: none;
}

.tilecontent h3 {
	margin: 5px 0 5px 8%;
	color: #4b4b4b;
}

.tiletext {
	position: absolute;
	right: 0;
	top: 0;
	width: 55%;
	height: 100%;
}

.welcome {
	width: 1200px;
	height: 375px;
	background-color: rgba(255,255,255,.55);
	position: relative;
	left: calc(50% - 600px);
	margin-top: 100px;
}

.welcome h2 {
	position: absolute;
	top: 15px;
	margin: 0;
	left: 280px;
	font-size: 46px;
	color: #4b4b4b;
	font-weight: 100;
}

.welcome p:first-of-type {
	position: absolute;
	color: #555;
	width: 940px;
	top: 60px;
	left: 260px;
	font-size: 26px;
	font-weight: 100;
}

.welcome p:last-of-type {
	position: absolute;
	color: #555;
	width: 940px;
	top: 90px;
	left: 260px;
	font-size: 26px;
	font-weight: 100;
}

.welcome > ul {
	position: absolute;
	color: #555;
	width: 900px;
	top: 100px;
	left: 300px;
	font-size: 26px;
	font-weight: 100;
}

.welcome > ul > ul {
	position: absolute;
	color: #555;
	width: 850px;
	top: 100px;
	left: 50px;
	font-size: 26px;
	font-weight: 100;
}

.bot01 {
	height: 250em;
	width: 160em;
	position: relative;
	font-size: 1.5px;
	top: 5em;
}

.bot01body {
	width: 80em;
	height: 113.5em;
	position: absolute;
	top: 81em;
	left: 50em;
	perspective: 800px;
	perspective-origin: 0 0;
	transition-duration: .5s;
}

.bot01head {
	width: 0;
	height: 0;
	position: absolute;
	top: 0;
	left: 50%;
	perspective: 800px;
	transition-duration: 2s;
}

.bot01eye {
	width: 15em;
	height: 15em;
	border-radius: 50%;
	border: 5em solid #4b4b4b;
	position: absolute;
}

.bot01headbar {
	width: 5em;
	height: 40em;
	background-color: #4b4b4b;
	position: absolute;
}

.bot01eye1 {
	bottom: 27.5em;
	right: 15em;
}

.bot01eye2 {
	bottom: 27.5em;
	left: 15em;
}

.bot01eyeinside1 {
	background-image: linear-gradient(to bottom, #4b4b4b 50%, rgba(0,0,0,0) 65%);
	position: absolute;
	width: 15em;
	height: 15em;
	transform: rotate(0);
	transition-duration: 2s;
	background-position: 0 -7.5em;
	background-repeat: no-repeat;
}

.bot01eyeinside2 {
	background-image: linear-gradient(to top, #4b4b4b 55%, rgba(0,0,0,0) 65%);
	position: absolute;
	width: 15em;
	height: 15em;
	transform: rotate(0);
	transition-duration: 2s;
	background-position: 0 8.5em;
	background-repeat: no-repeat;
}

.bot01headup1 {
	transform: rotate(45deg);
	bottom: 45em;
	right: 10em;
}

.bot01headup2 {
	transform: rotate(135deg);
	bottom: 45em;
	left: 10em;
}

.bot01headdown1 {
	transform: rotate(135deg);
	bottom: -4.5em;
	right: 10em;
}

.bot01headdown2 {
	transform: rotate(45deg);
	bottom: -4.5em;
	left: 10em;
}

.bot01headcenter {
	position: absolute;
	height: 5em;
	width: 40em;
	background-color: #4b4b4b;
	bottom: 37.5em;
	left: -20em;
}

.bot01bodytop {
	width: 5em;
	height: 56.7em;
	position: absolute;
	background-color: #4b4b4b;
}

.bot01bodytop1 {
	transform: rotate(45deg);
	top: -13.16em;
	left: 19.25em;
}

.bot01bodytop2 {
	transform: rotate(135deg);
	top: -13.16em;
	right: 19.25em;
}

.bot01bodybottom {
	position: absolute;
	width: 70em;
	height: 70em;
	border: 5em solid #4b4b4b;
	top: 33.5em;
}

.bot01foot1 {
	position: absolute;
	width: 0;
	height: 0;
	bottom: 0;
	left: 25em;
	transition-duration: .2s;
}

.bot01foot1quad {
	position: absolute;
	width: 30em;
	height: 30em;
	border-right: 5em solid #4b4b4b;
	border-bottom: 5em solid #4b4b4b;
	border-top: 5em solid rgba(0,0,0,0);
	border-left: 5em solid rgba(0,0,0,0);
	right: 0;
	top: -2em;
}

.bot01foot1bar {
	height: 47em;
	width: 5em;
	transform: rotate(45deg);
	background-color: #4b4b4b;
	position: absolute;
	right: 15.78em;
	top: -3.78em;
}

.bot01foot2 {
	position: absolute;
	width: 0;
	height: 0;
	bottom: 0;
	right: 25em;
	transition-duration: .2s;
}

.bot01foot2quad {
	position: absolute;
	width: 30em;
	height: 30em;
	border-left: 5em solid #4b4b4b;
	border-bottom: 5em solid #4b4b4b;
	border-top: 5em solid rgba(0,0,0,0);
	border-right: 5em solid rgba(0,0,0,0);
	left: 0;
	top: -2em;
}

.bot01foot2bar {
	height: 47em;
	width: 5em;
	transform: rotate(135deg);
	background-color: #4b4b4b;
	position: absolute;
	left: 15.78em;
	top: -3.78em;
}

.bot01arm {
	width: 0;
	height: 0;
	position: absolute;
	bottom: 79em;
}

.bot01armtop {
	position: absolute;
	width: 5em;
	height: 15em;
	background-color: #4b4b4b;
	top: -0.55em;
}

.bot01armtop1 {
	transform: rotate(45deg);
	right: 1.1em;
}

.bot01armtop2 {
	transform: rotate(135deg);
	left: 1.1em;
}

.bot01armcenter {
	position: absolute;
	border: 5em solid #4b4b4b;
	width: 11.5em;
	height: 40em;
	top: 10.7em;
	left: -10.75em;
}

.bot01hand {
	position: absolute;
	border-right: 5em solid #4b4b4b;
	border-bottom: 5em solid #4b4b4b;
	border-left: 5em solid rgba(0,0,0,0);
	border-top: 5em solid rgba(0,0,0,0);
	border-radius: 50%;
	width: 11.5em;
	height: 11.5em;
	top: -10em;
	transform: rotate(45deg);
	left: -10.75em;
	top: 49em;
}

.bot01finger {
	position: absolute;
	border-top: 5em solid #4b4b4b;
	border-right: 5em solid rgba(0,0,0,0);
	border-left: 5em solid rgba(0,0,0,0);
}

.bot01finger1 {
	top: 66.3em;
	right: 2.3em;
	transform: rotate(40deg);
}

.bot01finger2 {
	top: 69em;
	left: -5em;
}

.bot01finger3 {
	top: 66.3em;
	left: 2.3em;
	transform: rotate(320deg);
}

.bot01arm1 {
	left: 1em;
	transform: rotate(10deg);
	transition-duration: 1s;
}

.bot01arm2 {
	right: 1em;
	transform: rotate(350deg);
	transition-duration: 3s;
}

.bot01shadow {
	width: 100em;
	height: 1em;
	border-radius: 50%;
	box-shadow: 0 0 5em 4em rgba(75,75,75,.6), 0 0 2em 2em rgba(75,75,75,.56) inset;
	position: absolute;
	bottom: 16em;
	left: 40em;
	transition-duration: .6s;
}

#slideshows h2 {
	text-align: center;
	font-weight: normal;
	font-size: 30px;
	margin: 80px 0 0 0;
	color: #4b4b4b;
}

.slideshow {
	width: 50%;
	position: relative;
	overflow: hidden;
	font-size: 0;
	margin: auto;
}

.slideshow-images {
	width: 100%;
	padding-bottom: 66.66%;
/*  16:9 = 56.25%
	4:3  = 75%
	height / width!  */
	position: relative;
	height: 0;
}
.slides {
	position: absolute;
	padding: 0px;
	margin: 0px;
	list-style-type: none;
	transition-duration: .5s;
	overflow: hidden;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.slides li p {
	position: absolute;
	bottom: 0;
	text-align: center;
	font-size: 20px;
	padding: 3px 0 3px 0;
	margin: 0;
	width: 100%;
	cursor: default;
	background-color: rgba(255,255,255,.2);
}

.slides li img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.slidepic {
	position: absolute;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 1;
	transition-duration: 0s;
	transform: translatex(100%);
}

.slideshow-otherteaser {
	opacity: .4;
}

.slideshow-teasers {
	height: 100%;
	position: absolute;
	top: 0;
	white-space: nowrap;
	transition-duration: .5s;
}

.slideshow-teaserwrapper {
	position: relative;
	height: 75px;
	margin-top: 10px;
	margin-left: 41px;
	width: calc(100% - 82px);
	bottom: 0;
	overflow: hidden;
}
.slideshow-teaser {
	height: 100%;
	display: inline;
	cursor: pointer;
	margin-left: 6px;
	width: auto;
	transition-duration: .25s;
}
.slideshow-teaser:first-child {
	margin-left: 0;
}
.slideshow-teaserarrowleft {
	position: absolute;
	height: 75px;
	left: 0;
	bottom: 0;
	width: 35px;
	cursor: pointer;
}
.slideshow-teaserarrowright {
	position: absolute;
	height: 75px;
	right: 0;
	bottom: 0;
	width: 35px;
	cursor: pointer;
}