/***GLOBAL VARIABLES
*****************************************************/
:root {

	/***TEXT***/
	--smallFont: 1rem;
	--mediumFont: 1.25rem;
	--largeFont: 1.5rem;
	--fontWeight: 400;
	--letterSpacing: .02em;
	--wordSpacing: 0em;
	--lineHeightDefault: 1.225;
	--lineHeightLow: 1;
	--favoritMono: Arial, sans-serif;

	/***COLOR***/
	--paletteWhite: #FFFFFF;
	--paletteGray: #CCCCCC;
	--paletteBlack: #000000; 
	--paletteViolet: #D0CBDA;
	--backColor: var(--paletteViolet);
	--textColor: var(--paletteBlack);
	--linkColor: var(--paletteBlack);
	--hoverColor: var(--paletteGray);

	/***DECORATION***/
	--linkDeco: underline;
	--borderWidth: 0.1rem;
	--borderLine: var(--borderWidth) solid var(--textColor);
	--borderRadius: 0.15rem;
	--borderUnderline: 1px solid var(--paletteBlack);
	
	/***SPACES***/
	--rowGutterSmall: calc(var(--smallFont) * var(--lineHeightDefault));
	--rowGutterMedium: calc(var(--mediumFont) * var(--lineHeightDefault));
	--rowGutterLarge: calc(var(--largeFont) * var(--lineHeightLow));
	--colGutter: calc(var(--mediumFont)*0.66);
	--bodyMargin: var(--rowGutterMedium);
	--headerTop: var(--rowGutterMedium);
	--itemPadding: 0.5rem 0.5rem 0.375rem;
	--siteNamePadding: 0.5rem 0.5rem 0.25rem;
	--contentMarginTop: calc(var(--rowGutterMedium)*1);
	--contentMarginBottom: calc(var(--rowGutterMedium)*9);
	--footerMarginTop: calc(var(--rowGutterMedium)*3);

	/***SIZES***/
	--headerHeight: calc(var(--rowGutterMedium)*2);
	--contentWidth: 100%;
	--contentMinHeight: calc(100vh - var(--headerHeight) - var(--contentMarginTop) - var(--footerHeight) - var(--footerMarginTop) - calc(var(--rowGutterMedium)*2));
	--srcWidth: calc(50vw - (var(--colGutter)*2));
	--srcHeight: calc(100vh - (var(--rowGutterMedium)*6));
	--footerHeight: calc(var(--rowGutterMedium)*2);

	/***GRIDS***/
	--oneColGrid: repeat(1, 1fr);
	--twoColsGrid: repeat(2, 1fr);
	--threeColsGrid: repeat(3, 1fr);
	--fourColsGrid: repeat(4, 1fr);
	--fiveColsGrid: repeat(5, 1fr);
	--sixColsGrid: repeat(6, 1fr);
	--twelveColsGrid: repeat(12, 1fr);
	--gridGap: 0 var(--colGutter);

	/***BLUR***/
	--txtBlur: blur(1.5rem);
	--srcBlur: blur(calc(var(--bodyMargin)*0.75));
	
	/***SHADOW***/
	--srcShadow: drop-shadow(.25vw .75vw .75vw rgba(0,0,0,0.33));
	--textShadow: .33vw .33vw .66vw rgba(0,0,0,0.5);

	/***TRANSITION***/
	--transitionProperty: color;
	--transitionDuration: 0.15s;
	--transitionDurationSlow: 0.3s;
	--transitionNull: 0;
}
	
/***RESET
*****************************************************/
::-webkit-scrollbar {
	display: none;
}
::selection {
	color: var(--backColor);
	background-color: var(--textColor);
}
::-moz-selection {
	color: var(--backColor);
	background-color: var(--textColor);
}
html {
	scroll-behavior: smooth;
}
body {
	position: relative;
	margin: var(--bodyMargin);
	color: var(--textColor);
	background: var(--backColor);
	font-family: "Favorit Regular", sans-serif;
	font-size: var(--mediumFont);
	letter-spacing: var(--letterSpacing);
	line-height: var(--lineHeightDefault);
	overflow-x: hidden !important;
}
body.index .content > header {
	display: none;
}
ul {
	display: block;
	list-style-type: none;
	margin-block-start: 0;
	margin-block-end: 0;
	margin-inline-start: 0;
	margin-inline-end: 0;
	padding-inline-start: 0;
}
li {
	display: inherit;
}
a {	
	color: var(--linkColor);
	text-decoration: none;
}
a:hover {	
	text-decoration: none;
	border-bottom: var(--borderLine);
}
u {
	text-decoration: none;
	border-bottom: var(--borderLine);
}
h1, h2, h3 {
	margin: 0;
	margin-block-start: 0;
	margin-block-end: 0;
	margin-inline-start: 0px;
	margin-inline-end: 0px;
	padding: 0;
	font-size: var(--mediumFont);
	font-style: normal;
	font-weight: 400;
}
p {
	display: block;
	margin-block-start: 0;
	margin-block-end: 0;
	margin-inline-start: 0px;
	margin-inline-end: 0px;
	padding-inline-start: 0;
	font-size: var(--mediumFont);
}
span {
	display: inline;
}
img {
	vertical-align: middle;
}
form, input, submit
iframe, embed, audio {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
}

/***FONTS
*****************************************************/
* {
	-webkit-font-smoothing: smooth;
	-moz-osx-font-smoothing: smooth;
	text-rendering: geometricPrecision;
}
@font-face {
	font-family: Favorit Mono Light;
	src: url("fonts/Favorit-Mono-Light.woff");
}
@font-face {
	font-family: Favorit Mono Regular;
	src: url("fonts/Favorit-Mono-Regular.woff");
}
@font-face {
	font-family: Favorit Light;
	src: url("fonts/Favorit-Light.woff");
}
@font-face {
	font-family: Favorit Light Italic;
	src: url("fonts/Favorit-Light-Italic.woff");
}
@font-face {
	font-family: Favorit Regular;
	src: url("fonts/Favorit-Regular.woff");
}
@font-face {
	font-family: Favorit Regular Italic;
	src: url("fonts/Favorit-Regular-Italic.woff");
}
@font-face {
	font-family: Favorit Bold;
	src: url("fonts/Favorit-Bold.woff");
}
.small_font {
	font-size: var(--smallFont);
	line-height: var(--lineHeightDefault);
}
.medium_font {
	font-size: var(--mediumFont);
	line-height: var(--lineHeightDefault);
}
.large_font {
	font-size: var(--largeFont);
	line-height: var(--lineHeightLow);
}
.mono {
	font-family: "Favorit Mono Regular";
	letter-spacing: 0;
}
.mono_light {
	font-family: "Favorit Mono Light";
	letter-spacing: 0;
}
.light {
	font-family: "Favorit Light";
}
.regular {
	font-family: "Favorit Regular";
}
.bold {
	font-family: "Favorit Bold";
}
.uppercase {
	text-transform: uppercase;
}
.lowercase {
	text-transform: lowercase;
}
.text, .caption {
	font-family: "Favorit Light", sans-serif;
}
	
/***TITLE AND MENU
*****************************************************/
/***HEADER***/
header {
	width: calc(100vw - var(--bodyMargin) * 2);
	position: fixed;
  	top: var(--bodyMargin);
  	/*left: var(--bodyMargin);*/
	display: flex;
	justify-content: space-between;
	z-index: 99;
}
header .header_block {
	height: 87px;
	position: absolute;
}
/***SITE NAME***/
header .header_block:nth-child(1) {
}
.site_name {
	position: inherit;
	padding: var(--siteNamePadding);
	border: var(--borderLine);
	border-radius: var(--borderRadius);
	background-color: var(--paletteWhite);
	transition-property: background, background-color, color;
	transition-duration: var(--transitionDuration);
	z-index: 99;
}
.site_name:hover {
	background: var(--paletteBlack);
	text-decoration: none;
}
.site_name p {
	transition-property: color;
	transition-duration: var(--transitionDuration);
}
.site_name:hover p {
	color: var(--paletteWhite);
}
.lang_switch {
	position: absolute;
    bottom: calc(var(--rowGutterMedium) * -1);
	left: var(--borderWidth);
    display: flex;
    gap: 7px;
}
.lang_switch button,
.lang_switch .switch_button {
	border: none;
	background:none;
	padding: 0;
	cursor: pointer;
	/*text-decoration: line-through;*/
}
.lang_switch button:hover,
.lang_switch .switch_button:hover {
	text-decoration: none;
	border-bottom: var(--borderLine);
}
.lang_switch button.active,
.lang_switch .switch_button.active {
	text-decoration: none;
	border-bottom: var(--borderLine);
}
.en, .de, .es {
	display: none;
}	
.en.active, .de.active, .es.active {
	display: block;
}
/***BATTERY***/
header .header_block:nth-child(2) {
	width: 53px;
	right: 0;
}
.battery {
    width: 100%;
	height: 100%;
    position: inherit;
	/*
    top: var(--rowGutterMedium);
    right: var(--colGutter);
	*/
    display: flex;
    justify-content: center;
    z-index: 99;
}
.battery .piece_1,
.battery .piece_2 {
	position: absolute;
	border: var(--borderLine);
    background: var(--paletteWhite);
}
.battery .piece_1 {
    height: 77px;
    width: 100%;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
	border-radius: var(--borderRadius);
}
.battery .piece_2 {
	width: 23px;
    height: 7px;
	border-bottom: 0;
	border-radius: var(--borderRadius) var(--borderRadius) 0 0;
}
/*
.battery .piece_1 span {
	margin-bottom: var(--rowGutterSmall);
}
*/
.imprint_button {
    display: inline;
    position: absolute;
    bottom: calc(var(--rowGutterMedium) * -1);
	letter-spacing: 0;
}
.imprint_button.active {
	text-decoration: none;
	border-bottom: var(--borderLine);
}
/***MENU***/
nav.menu {
	width: calc(100vw - var(--rowGutterMedium)*2);
	position: fixed;
	bottom: var(--rowGutterMedium);
	text-align: center;
	line-height: var(--lineHeightLow);
	z-index: 99;
}
nav.menu ul {
	display: flex;
	gap: var(--colGutter);
}
nav.menu li.menu_item {
	flex: 1;
	width: 100%;
}
nav.menu li.menu_item a {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: var(--itemPadding);
	box-sizing: border-box;
	border: var(--borderLine);
	border-radius: var(--borderRadius);
	background-color: var(--paletteWhite);
	transition-property: background, background-color, color;
	transition-duration: var(--transitionDuration);
}
nav.menu li.menu_item a .title {
	transition-property: background, background-color, color;
	transition-duration: var(--transitionTime);
}
nav.menu li.menu_item a:hover {
	background: var(--paletteBlack);
	text-decoration: none;
}
nav.menu li.menu_item a:hover p {
	color: var(--paletteWhite);
}
nav.menu li.menu_item a.current {
	background: var(--paletteBlack);
}
nav.menu li.menu_item a.current p {
	color: var(--paletteWhite);
}
/***HOME
*****************************************************/
.cross_img {
	width: 18vw;
	top: -75vh;
	position: fixed;
	display: flex;
    justify-content: center;
    align-items: center;
}
.cross_img, .cross_img.medium {
	height: 15.5vw;
}
.cross_img.small {
	height: 11.5vw;
}
.cross_img.large {
	height: 19.5vw;
}
.cross_img img {
	max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
	-webkit-filter: var(--srcShadow);
    filter: var(--srcShadow);
}
#more_button_en, #more_button_de, #more_button_es {
	border: none;
	border-bottom: var(--borderLine);
	background:none;
	padding: 0;
	cursor: pointer;
	font-family: "Favorit Light", sans-serif;
}
#dots_en, #dots_de, #dots_es {
}
#more_en, #more_de, #more_es {
	display: none;
}
p.contributors {
	line-height: 1;
}

/***CONTENT
*****************************************************/
.content {
	/*min-height: var(--contentMinHeight);*/
	position: relative;
	display: grid;
	grid-template-columns: var(--fiveColsGrid);
	grid-gap: var(--gridGap);
	margin-top: calc(var(--contentMarginTop) + var(--borderWidth) + 0.5rem);
	margin-bottom: var(--contentMarginBottom);
	box-sizing: border-box;
}
.content_col {
	grid-column: 2/5;
}
.section_header {
	margin-bottom: calc(var(--rowGutterMedium)*2.25);
}
.entry_content {
	margin-bottom: calc(var(--rowGutterMedium)*2);
}
/*
.entry_content:not(:last-child) {
	margin-bottom: calc(var(--rowGutterMedium)*5);
}
*/
.entry_content .entry_header {
	/*padding-top: var(--rowGutterMedium);*/
	margin-bottom: calc(var(--rowGutterMedium)*1);
}
.entry_content .title {
}
.entry_content .headline {
	margin-top: calc(var(--rowGutterMedium)*1);
}
.entry_content .text {
	/*display: inline-block;*/
}
.entry_content .text .paragraph {
	position: relative;
	margin-top: calc(var(--rowGutterMedium)*1);
}
.entry_content .text .paragraph.simple {
	margin-top: var(--rowGutterMedium);
}
.entry_content .text .paragraph.double {
	margin-top: calc(var(--rowGutterMedium)*2);
}
.entry_content .text .paragraph.none {
	display:inline;
	margin-top: 0;
}
.entry_content .impulse {
	margin-top: var(--rowGutterMedium);
}
.entry_content .impulse a:not(:last-child):after {
	content: ",";
}
/***CROSS-READINGS***/
.cross_reading {
	position: absolute;
	display: inline;
	opacity: 0;
	z-index: 99;
	transition: opacity var(--transitionDuration);
}
.cross_reading span.cross_category {
	color: var(--paletteWhite);
	text-shadow: var(--textShadow);
	white-space: nowrap;
  	/*overflow: hidden;*/
  	/*text-overflow: ellipsis;*/
	padding-bottom: var(--rowMargin);
	cursor: pointer;
}
a.cross_reading:hover,
.cross_reading span.cross_category:hover {
	text-decoration: none;
}
.cross_reading .cross_reading_title {
	width: 20vw;
	position: absolute;
	top: calc(var(--rowGutterMedium)*1.25);
	left: 0;
	padding: var(--itemPadding);
	border: var(--borderWidth) solid var(--textColor);
	border-radius: var(--borderRadius);
	background-color: var(--paletteWhite);
	opacity: 0;
	pointer-events: none;
	transition-property: background, background-color, color;
	transition-duration: var(--transitionTime);
}
.cross_reading:hover span {
	opacity: 1;
	pointer-events: auto !important;
}
/*
.text .cross_reading a:hover {
	color: var(--paletteWhite);
	background-color: var(--paletteBlack);
	text-decoration: none;
}
*/

/***FOOT-NOTES***/
.footnotes {
    font-family: "Favorit Light", sans-serif;
    margin-top: calc(var(--rowGutterMedium)*3);
    column-count: 3;
    column-gap: var(--gridMargin);
    overflow-wrap: break-word;
    word-wrap: break-word;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
}
.footnotes span {
	display: inline;
}
.contributors {
    font-family: "Favorit Light", sans-serif;
    margin-top: calc(var(--rowGutterMedium)*3);
}

/***SOURCES***/
.src {
	width: 100%;
	margin-top: calc(var(--rowGutterMedium) * 1);
	padding-bottom: calc(var(--rowGutterMedium) * 1);
	display: grid;
	grid-template-columns: var(--threeColsGrid);
	grid-gap: var(--gridGap);
	box-sizing: border-box;
}
.src img,
.src .slider,
.src .embed_video,
.src iframe,
.src embed,
.src object {
	grid-column: 1/4;
	width: 100%;
	height: 33vw;
	border: 0;
}
/*
.src:not(:first-child) img,
.src:not(:first-child) .embed_video {
	margin-top: calc(var(--rowGutterMedium) * 2);
}
*/
.src img {
	object-fit: contain;
}
.src.small img {
	grid-column: 2/3 !important;
	height: auto !important;
	max-height: 33vw;
}
.src .embed_video {
    --videoWidth: 1920;
    --videoHeight: 1000;
    position: relative;
    /*padding-bottom: calc(var(--videoHeight) / var(--videoWidth) * 100%);*/
    overflow: hidden;
    max-width: 100%;
    background: black;
}
.src .embed_video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.src .caption {
	display: inline-block;
	grid-column: 1/4;
	margin-top: var(--rowGutterSmall);
	margin-bottom: var(--rowGutterMedium);
}
.src.small img,
.src.small caption {
	grid-column: 2/3 !important;
}
.src img,
.src .embed_video,
.src iframe,
.src embed,
.src object {
	-webkit-filter: var(--srcShadow);
    filter: var(--srcShadow);
}

/***SLIDER***/
.slider {
	width: 100%;
  	height: 40vw;
  	position: relative;
	/*
  	display: flex;
  	justify-content: center;
  	align-items: center;
	*/
}
.slide {
	width: 100%;
  	height: 100%;
  	position: absolute;
  	display: none;
}
.slide img,
.slide video {
  	max-width: 100%;
  	max-height: 100%;
  	margin-left: 50%;
  	transform: translateX(-50%);
	object-fit: contain;
}
.prev_button, .next_button {
	width: 50%;
	height: 100%;
	position: absolute;
  	cursor: pointer;
}
.prev_button {
	top: 0;
	left: 0;
  	justify-content: start;
  	padding-left: 10px;
  	box-sizing: border-box;
}
.next_button {
	top: 0;
	right: 0;
  	justify-content: end;
  	padding-right: 10px;
  	box-sizing: border-box;
}
.prev_button:hover, .next_button:hover {
  	color: red;
}
.pagination {
	position: absolute;
  	bottom: calc(var(--rowGutterMedium)* -1);
  	left: 0;
	display: none;
}
/*
.caption {
	position: absolute;
  	bottom: 10px;
  	left: 10px;
}
.pagination {
	position: absolute;
  	bottom: 10px;
  	right: 10px;
}
*/

/***FOOTER
*****************************************************/
footer {
	grid-column: 1 / 2;
	height: var(--footerHeight);
	margin-top: var(--footerMarginTop);
	display: flex;
	justify-content: space-between;
	align-items: end;
	border-top: var(--borderLine);
}