@charset "utf-8";

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('../webfonts/montserrat-v25-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
       url('../webfonts/montserrat-v25-latin-regular.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 400;
  src: url('../webfonts/montserrat-v25-latin-italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
       url('../webfonts/montserrat-v25-latin-italic.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  src: url('../webfonts/montserrat-v25-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
       url('../webfonts/montserrat-v25-latin-500.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: url('../webfonts/montserrat-v25-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
       url('../webfonts/montserrat-v25-latin-600.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 600;
  src: url('../webfonts/montserrat-v25-latin-600italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
       url('../webfonts/montserrat-v25-latin-600italic.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url('../webfonts/montserrat-v25-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
       url('../webfonts/montserrat-v25-latin-700.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

html { 
	margin: 0px;
	min-height: 100%;
}
 
:focus {
	 outline:0; 
	 -moz-outline:0; 
} 

img {
	vertical-align: baseline;
}

span,div {
	zoom: 1;
}			   

input::-webkit-outer-spin-button, 
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
  -moz-appearance: textfield;
}

img {
	display: block;
}

a {
	zoom: 1;
	color: inherit;
	text-decoration: none;
}
	
a img {
	border-width: 0px;
}	   

a:hover  {
	color: inherit;
}

form {
	margin: 0px;
	padding: 0px;
}
	
sup { 
	vertical-align: baseline;
	position: relative;
	top: -0.5em;
	font-size: 70%;
}

ul {
	padding-left: 1.5em;
}

body {	 
	background-color: black;
	color: white;
	position: relative;
	margin: 0;
	padding: 60px 119px;
	-webkit-text-size-adjust: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-family: 'Montserrat',sans-serif;
	font-size: 32px;
	line-height: 1.2;
	letter-spacing: 0.02em;
	height: 100%;
	overflow-x: hidden;
}	 

.show-on-mobile { display: none !important; }

.smalltext { font-size: 80%; }

.bigtext { font-size: 125%; } 

p { margin-top: 0; margin-bottom: 1em; }

.logo { text-decoration: none; }

.accordion-head { font-weight: bold; cursor: pointer; }

.accordion-body { display: none; max-width: 900px; padding-bottom: 1em; }

.link { cursor: pointer; text-decoration: none; display: inline-block; padding-left: 6px; margin-left: -6px; padding-right: 6px; }

.link:hover, .accordion-head.active .link { color: white; background-color: #da0301; }

.accordion-body a { cursor: pointer; text-decoration: none; display: inline-block; padding-left: 6px; margin-left: -6px; padding-right: 6px; }
.accordion-body a:hover { color: black; background-color: white; }

.homelink { text-decoration: none; }

.sprachauswahl { position:absolute; right:119px; top:60px; font-weight:bold; }
.sprachauswahl a { text-decoration: none; padding-left: 4px; padding-right: 4px; }
.sprachauswahl a.sel { color: white; background-color: #da0301; }
.sprachauswahl a:hover { color: black; background-color: white; }

.player-container {
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.player-container .inner {
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: left;
	align-items: center;
	background-color: rgba(0,0,0,0.9);
	padding: 60px 119px;
}

.player {
	max-width: 900px;
	/* max-width: 90%; */
}

.player-close-container {
	text-align: right;
}

.player-close {
	font-weight: bold;
	cursor: pointer;
}

.player .entry { display: none; }
.player .entry.sel { display: block; }

.player video { 
	max-width: 100%;
	max-height: 70vh;
}

.player .credits {
	font-size: 80%;
	padding-top: 1em;
	/* max-width: 920px; */
}

.grid {
	font-size: 0;
	letter-spacing: 0;
	max-width: 620px;
	margin-right: -6px;
}

.grid .entry {
	display: none;
	width: calc(20% - 6px);
	margin-right: 6px;
	margin-bottom: 6px;
	overflow: hidden;
}

.grid .entry.sel {
	display: inline-block;
}
	
.entry img {
	transition: transform 0.6s;
}

.grid .entry:hover img {
	transform: scale(110%);
}

.icon { margin-bottom: 10px; cursor: pointer; }

.impressum { display: none; max-width: 900px; }

body.white { background-color: white; color: #004d81; }
body.white .sprachauswahl a:hover { color: white; background-color: #004d81; }
body.white .accordion-body a:hover { color: white; background-color: #004d81; }
body.white .player-container .inner { background-color: rgba(255,255,255,0.9); }


@media only screen and (max-width: 800px) {
	body { padding: 30px 20px; font-size: 24px; }
	.sprachauswahl { right: 20px; top: 30px; }
	.player-container .inner { padding: 30px 20px; }
}	

@media only screen and (max-width: 560px) {
	.grid .entry { width: calc(25% - 6px);

}

@media only screen and (max-width: 430px) {
	body { font-size: 22px; }
	.grid .entry { width: calc(33.333% - 6px);

}