/*---------------------------------------------------------------------------------

Theme Name: LVU-Theme
Text Domain: lvu
Version: 1.6.2
Description: Theme für die LVU Rheinland-Pfalz
Tags: 
Author: Visualtech GmbH
Author URI: https://visualtech.de
License: 
License URI: 
Theme URI: 
	
---------------------------------------------------------------------------------*/

/* FONTS */

@font-face {
  font-family: "DIN Regular";
  src: url("assets/fonts/DINPro-Regular.otf") format("opentype");
}

@font-face {
  font-family: "DIN Light";
  src: url("assets/fonts/DINPro-Light.otf") format("opentype");
}

@font-face {
  font-family: "DIN Medium";
  src: url("assets/fonts/DINPro-Medium.otf") format("opentype");
}


/* VARIABLES */

:root {
/* colors	*/
  --primary-color: #009fe3;
  --secondary-color: #005578;
	--tertiary-color: #d4a129;
	--quarternary-color: #006daf;
  --color: #000;
  --body-background-color: #fff;
	--error-red: #b94a48;
	--error-background-red: #ffdfdf;
	
	--primary-color-rgba: rgba(0, 159, 227, 1);
	--secondary-color-rgba: rgba(0, 85, 120, 1);
	--ios-transparent-primary: rgba(0, 159, 227, 0);
	--ios-transparent-secondary: rgba(0, 85, 120, 0);
	
/* fonts */
	--light-font: 300 1em/normal Bahnschrift, "DIN Regular", sans-serif;
  --regular-font: 400 1em/normal Bahnschrift, "DIN Regular", sans-serif;
	--bold-font: 700 1em/normal Bahnschrift, "DIN Medium", sans-serif;
	
/* headline font-sizes */
	--h1-font-size: 50px;
	--h1-front-font-size: 90px;
	--h2-font-size: 35px;
	--h2-front-font-size: 70px;
	--h2-archive-font-size: 25px;
	--h3-font-size: 25px;
	--h4-font-size: 20px;
	
/* golden lines */
	--golden-line-factor: .128;
	
/* header */
	--top-menu-height: 50px;
	--top-menu-color: #fff;
/*	--top-menu-background-color: var(--quarternary-color);*/
	--top-menu-background-color: var(--secondary-color);
	
	--top-menu-hover-color: var(--tertiary-color);
	
	--top-menu-font-size: 20px;
	
  --main-menu-height: 200px;
	--main-menu-content-width: 1640px;
  --main-menu-color: #fff;
  --main-menu-background-color: var(--primary-color);

  --main-menu-hover-color: var(--tertiary-color);
  
  --main-menu-logo: url('../images/LVU_Logo_2020_rgb.png');
  
  --main-menu-font-size: 30px;
	
	--sub-menu-background-color: var(--secondary-color);
	--sub-menu-color: #fff;
	
  --logo-width: 300px;
	--logo-height: var(--logo-width);

/* main */
  --content-width: 1040px;
	
  --button-color: #fff;
  --button-background-color: var(--primary-color);
  --button-background-hover-color: var(--secondary-color);
  
  --copyright-font-size: 12px;
	
/* square-layout (front-page) */
	--square-width: 960px;
	--square-height: var(--square-width);
	
	--square-padding: calc(var(--square-width) * .13);
	
	--square-image-width: calc(var(--content-width) / 2 + var(--square-padding) / 2);
	--square-image-height: var(--square-image-width);
	
	--square-font-size: calc(var(--square-width) * .0422);
	
	
/* news */
	--square-news-font-size: calc(var(--square-width) * .0322);
	--square-news-headline-font-size: calc(var(--square-width) * .0442);
	--square-news-button-font-size: calc(var(--square-width) * .03125);
	
	--square-news-button-height: calc(var(--square-news-button-font-size) * 2.2);
	
/* newsletter */
	--newsletter-registration-box-width: var(--content-width);
	
	--newsletter-registration-box-padding: calc(var(--newsletter-registration-box-width) * .0838);
	
	--newsletter-font-size: calc(var(--newsletter-registration-box-width) * .024);
	
	--newsletter-form-elements-height: calc(var(--newsletter-registration-box-width) * .3692 * .1302);
	--newsletter-form-inputs-font-size: calc(var(--newsletter-registration-box-width) * .0173);
	--newsletter-register-button-font-size: calc(var(--newsletter-registration-box-width) * .0288);

/* twitter-feed */
	--tweet-width: 354px;
	--tweet-height: var(--tweet-width);
	--tweet-gap: 36px;
	
	--tweet-header-footer-font-size: calc(var(--tweet-width) * .0508);
/*	--tweet-content-font-size: calc(var(--tweet-width) * .0678); */
  --tweet-content-font-size: calc(var(--tweet-width) * .05);
		
	--twitter-icon-width: 686px;
	--twitter-icon-height: calc(var(--twitter-icon-width) * .8128);
	
/* page and single */
	--page-single-font-size: 20px;
	
	--single-person-text-width-factor: .6;
	--single-person-ifcs-width-factor: .35;
	--single-person-ifcs-solo-width-factor: .5;
	--single-person-image-width-factor: 1;
	--single-person-image-width: calc(var(--content-width) * var(--single-person-ifcs-width-factor) * var(--single-person-image-width-factor));
	--single-person-image-height: var(--single-person-image-width);
	--single-person-image-solo-width: calc(var(--content-width) * var(--single-person-ifcs-solo-width-factor) * var(--single-person-image-width-factor));
	--single-person-image-solo-height: var(--single-person-image-solo-width);
	
/* archive */
	
	--archive-post-font-size: 18px;
	
/* shortcode - person */
	--scp-image-width: 200px;
	--scp-image-height: var(--scp-image-width);
	
	--scp-general-font-size: 16px;
	--scp-name-function-font-size: 18px;
	--scp-contact-icon-font-size: var(--scp-name-function-font-size);
	
	--scp-social-icon-width: 25px;
	--scp-social-icon-height: var(--scp-social-icon-width);
	
/* footer */
	--footer-content-width: var(--main-menu-content-width);
  --footer-background-color: var(--secondary-color);
	--footer-menu-font-size: var(--main-menu-font-size);
	
	--social-media-icon-width: 50px;
	--social-media-icon-height: var(--social-media-icon-width);
	
	--logo-area-width: 325px;
	--logo-area-height: var(--logo-area-width);

/* scroll */
	--scroll-logo-width: 150px;
	--scroll-logo-height: var(--scroll-logo-width);
  
	font: var(--regular-font);
  font-size: 16px;
	line-height: 1.2;
  color: var(--color);
}


/* CF7 */

input[type="checkbox"],
input[type="radio"] {
  width: 20px !important ;
  height: 20px !important;
  border: 5px solid solid var(--secondary-color);
    -webkit-appearance: checkbox !important;
}

input.wpcf7-submit {
	padding: .65em 1em;
	background-color: var(--secondary-color);
	font: var(--bold-font);
	text-transform: uppercase;
	text-decoration: none;
	color: #fff;
}

input.wpcf7-text {
  border: 2px solid var(--secondary-color);  
  max-width: 80vW;
	min-width: 50%;   
}

textarea.wpcf7-textarea {
  border: 2px solid var(--secondary-color);  
  max-width: 80vW;
	min-width: 50%;   
}

.wpcf7 form.sent .wpcf7-response-output {
  border-color: var(--secondary-color);
  background-color: var(--secondary-color);
  color: #fff;
}

span.wpcf7-list-item { 
  display: block; 
  margin: 0 0 0 0;
}

div.wpcf7-space {
  margin-bottom: 40px;
}


/* GENERAL SETTINGS & STYLES */

html :where(img) {
	max-width: unset;
}

* {
  scrollbar-width: thin;
  scrollbar-color: var(--tertiary-color) rgba(26, 157, 217, .15);
}

*::-webkit-scrollbar {
  width: 10px;
}

*::-webkit-scrollbar-track {
  background: rgba(26, 157, 217, .15);
}

*::-webkit-scrollbar-thumb {
  background-color: var(--tertiary-color);
}

body {
	width: 100vw;
	height: 100vh;
	max-width: 100vw;
  min-height: 100vh;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
  position: relative;
  margin: 0;
  background-color: var(--body-background-color);
	font: inherit;
  overflow: hidden;
	overflow-y: auto;
}

body *,
body *::before,
body *::after {
  box-sizing: border-box;
	-webkit-text-size-adjust: none;
  text-size-adjust: none;
}

a {
	color: var(--color);
	text-decoration-color: var(--primary-color);
	text-underline-offset: .125em;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0 auto .25em;
  font: var(--bold-font);
	text-transform: uppercase;
  color: var(--primary-color);
	-ms-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
}

h1 {
	margin: 0 auto .75em;
  font-size: var(--h1-font-size);
	text-align: center;
	color: var(--tertiary-color);
	hyphens: initial;
}

h2 {
	position: relative;
  font-size: var(--h2-font-size);
	}

h3 {
	font-size: var(--h3-font-size);
}

h4 {
	font-size: var(--h4-font-size);
}

button,
.button,
input {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	font: var(--regular-font);
	border: none;
}

button,
.button {
	padding: .65em 1em;
	background-color: var(--secondary-color);
	font: var(--bold-font);
	text-transform: uppercase;
	text-decoration: none;
	color: #fff;
}

button:hover,
.button:hover {
	color: var(--tertiary-color);
	transition: all .3s ease-out;
}


/* HEADER */

header {
  width: 100vw;
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: auto auto auto;
  position: fixed;
  top: 0;
  z-index: 10;
}

header a {
	text-decoration: none;
	color: #fff;
}

#wpadminbar ~ header {
  margin-top: 32px;
}


/* MAIN */

main {
	width: 100vw;
/*   min-height: calc(100% - var(--main-menu-height)); */
  margin-top: var(--main-menu-height);
}

body.logged-in > main {
	margin-top: calc(var(--top-menu-height) + var(--main-menu-height));
}

section {
  max-width: 100vw;
	padding: 150px calc((100vw - var(--content-width)) / 2);
}

main ul {
/* 	list-style: none; */
	list-style-type: square;
}

/* main li {
	padding-left: 1em;
	position: relative;
} */

main ul > li:not(:first-child) {
	margin-top: .5em;
}

/* main li::before {
	content: '';
	width: .6em;
	height: .6em;
	display: flex;
	position: absolute;
	top: .2em;
	left: 0;
	margin: 0 .33em .1em 0;
	background-color: var(--primary-color);
} */


/* MAIN - FRONT-PAGE */

body.home h1 {
	font-size: var(--h1-front-font-size);
}

body.home h2 {
	width: min-content;
	font-size: var(--h2-front-font-size);
	text-align: center;
	white-space: nowrap;
}

/* news */

section#front-news {
	overflow: visible;
}

.news.headline {
	margin-top: 0;
	margin-bottom: .75em;
	font-size: var(--h1-front-font-size);
	color: var(--tertiary-color);
}

.news.content {
	display: grid;
	grid-template-columns: auto auto;
}

.news.content > * {
	flex-shrink: 0;
}

.news.post {
	width: var(--square-width);
	height: var(--square-height);
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 1.2em;
	position: relative;
	padding: var(--square-padding);
	background-color: var(--primary-color);
	font-size: var(--square-news-font-size);
	color: #fff;
}

.news.post:only-child {
	grid-column: 1 / 3;
	justify-self: center;
}

.news.post-headline {
	margin-bottom: 0;
	font-size: var(--square-news-headline-font-size);
	color: var(--secondary-color);
}

#front-news .news.post-headline {
	hyphens: manual;
}

.news.post-teaser {
	max-height: 9.7313em;
	position: relative;
	overflow: hidden;
	hyphens: auto;
}

.news.post-teaser > p {
	margin: 0;
}

.news.post-teaser::after {
	content: '';
	width: 10em;
	height: 1.3em;
	position: absolute;
	right: 0;
	bottom: 0;
	background: linear-gradient(to right, transparent, var(--primary-color-rgba));
  background: -webkit-linear-gradient(left, var(--ios-transparent-primary), var(--primary-color-rgba));
}

.news.read-more-container {
	position: absolute;
	right: var(--square-padding);
	bottom: var(--square-padding);
}

.news.read-more {
	width: min-content;
	align-self: flex-end;
	position: relative;
	color: #fff;
	text-decoration: none;
}

.news.read-more:hover {
	color: var(--secondary-color);
	transition: all .3s ease-out;
}

.news.read-more::before {
	content: '';
	width: calc(1em * var(--golden-line-factor));
	height: 4.5em;
	display: block;
	position: absolute;
	top: .36em;
	left: calc(1em * var(--golden-line-factor) * (-3));
	background-color: var(--tertiary-color);
}

.news.further-news {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 2.5em;
	background-color: var(--secondary-color);
	font-size: var(--square-news-button-font-size);
	color: #fff;
	text-decoration: none;
}

.news.further-news:hover {
	color: var(--tertiary-color);
	transition: all .3s ease-out;
}

.news.image-container {
	width: var(--square-image-width);
	height: var(--square-image-height);
  position: relative;
	margin: auto 0 auto calc(var(--square-padding) / 2 * (-1) - 5px);
/* 	object-fit: cover; */
	z-index: 3;
}

.news.image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

p.isc-source-text {
  position: absolute;
  right: 0;
	bottom: 0;
  margin: 0;
	padding: 10px;
	background-color: rgba(0, 0, 0, .25);
	opacity: 1;
	font: var(--light-font);
  font-size: var(--copyright-font-size);
  color: #fff;
	z-index: 9;
}

p.isc-source-text a {
  color: #fff;
}

/* newsletter */

h2.newsletter.headline::before {
	content: '';
	width: calc(1em * var(--golden-line-factor));
	height: 400px;
	display: block;
	position: absolute;
	background-color: var(--tertiary-color);
	left: calc(1em * var(--golden-line-factor) * (-3));
	bottom: .31em;
	z-index: -1;
}

.newsletter.content {
	min-height: 250px;
	display: flex;
	padding: var(--newsletter-registration-box-padding);
	background-color: var(--secondary-color);
	color: #fff;
}

.newsletter.info-text {
	width: 65%;
	height: 100%;
	display: flex;
	flex-direction: column;
/* 	justify-content: space-between; */
	gap: 1.2em;
	font-size: var(--newsletter-font-size);
	padding-right: calc(var(--newsletter-registration-box-padding) / 2);
}

.newsletter.info-text-paragraph {
	
}

.newsletter #mailpoet_form_1 {
	width: 35%;
/* 	display: none; */
}

.newsletter.registration-form,
.newsletter #mailpoet_form_1 form.mailpoet_form {
/*   width: 35%; */
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	margin: 0;
}

.newsletter.registration-form {
	display: none;
}

.newsletter #mailpoet_form_1 form.mailpoet_form {
	position: relative;
  padding: 0;
}

.newsletter.registration-form > *,
.newsletter #mailpoet_form_1 .mailpoet_paragraph {
	height: var(--newsletter-form-elements-height);
	margin: 0;
}

.newsletter.registration-form input {
	padding: 0 1em;
	font-size: var(--newsletter-form-inputs-font-size);
	color: var(--secondary-color);
}

.newsletter #mailpoet_form_1 input {
	height: 100%;
	padding: 0 1em !important;
	font-size: var(--newsletter-form-inputs-font-size);
	color: var(--secondary-color);
}

.newsletter.register.button {
	padding: 0;
	background-color: var(--tertiary-color);
	font-size: var(--newsletter-register-button-font-size);
	color: #fff;
	cursor: pointer;
}

.newsletter #mailpoet_form_1 input.mailpoet_submit {
	background-color: var(--tertiary-color);
	font: var(--bold-font);
	font-size: var(--newsletter-register-button-font-size);
	text-transform: uppercase;
	color: #fff;
	cursor: pointer;
}

.newsletter #mailpoet_form_1 .mailpoet_message {
	position: absolute;
/* 	bottom: -5em; */
/* 	height: 50px; */
/* 	background-color: greenyellow; */
}

.newsletter #mailpoet_form_1 .parsley-errors-list {
	font-size: .75em;
	line-height: .75em;
	margin-top: 5px;
}

/* twitter-feed */

#front-twitter-feed {
	overflow: hidden;
}

#ctf {
	display: flex;
	flex-direction: column-reverse;
	position: relative;
	overflow: unset;
}

#ctf .ctf-header {
	width: unset;
	position: absolute;
	right: 0;
	bottom: 0;
	margin: 0;
	padding: 0;
	border: none;
	z-index: 4;
}

#ctf .ctf-header .ctf-header-text {
	padding: 0;
	float: unset;
}

#ctf .ctf-header .ctf-header-user {
	display: flex;
	align-items: center;
	margin: 0 !important;
	font-size: var(--tweet-header-footer-font-size);
}

#ctf .ctf-header .ctf-header-name {
	margin: 0;
	padding: .75em 1em .6em;
	background-color: var(--secondary-color);
	color: #fff;
	text-transform: uppercase;
}

#ctf .ctf-header .ctf-header-name:hover {
	color: var(--tertiary-color);
	transition: all .3s ease-out;
}

#ctf .ctf-header .ctf-header-follow,
#ctf .ctf-header .ctf-header-img {
	display: none;
}

#ctf .ctf-tweets {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: flex-start;
	gap: var(--tweet-gap);
	position: relative;
	overflow: visible;
}

#ctf .ctf-item {
	width: var(--tweet-width);
/* 	max-width: 34%; */
	height: var(--tweet-height);
	display: flex;
	flex-direction: column;
/* 	justify-content: space-between; */
	position: relative;
	padding: 25px;
	background-color: var(--primary-color);
	border: none;
	color: #fff;
/* 	overflow: visible; */
}

#ctf .ctf-item > * {
	margin: 0;
	padding: 0;
}

#ctf .ctf-item:last-child {
	width: var(--twitter-icon-width);
	height: calc(var(--twitter-icon-width) - var(--tweet-gap));
	margin-left: calc(var(--tweet-gap) * (-1));
	padding: 0;
	background-color: transparent;
	overflow: visible;
}

#ctf .ctf-item:last-child::before {
	content:'Twitter';
	position: absolute;
	top: calc(var(--tweet-height) - var(--h2-front-font-size));
	left: var(--tweet-gap);
	font: var(--bold-font);
	font-size: var(--h2-front-font-size);
	color: var(--secondary-color);
	text-transform: uppercase;
	line-height: 1.42;
	z-index: 3;
}

#ctf .ctf-item:last-child::after {
	content:'';
	width: 100vw;
	height: calc(var(--h2-front-font-size) *  var(--golden-line-factor));
	position: absolute;
	top: calc(var(--tweet-height) - var(--h2-front-font-size) *  var(--golden-line-factor));
	left: calc(var(--tweet-gap) + var(--h2-front-font-size) * 4.0114 + var(--h2-front-font-size) * var(--golden-line-factor));
	background-color: var(--tertiary-color);
	z-index: 3;
}

#ctf .ctf-item:last-child > *:not(.ctf-author-box),
#ctf .ctf-item:last-child .ctf-author-box-link {
	display: none;
}

#ctf .ctf-item:last-child .ctf-author-box,
#ctf .ctf-item:last-child .ctf-corner-logo,
#ctf .ctf-item:last-child svg.fa-twitter {
	width: 100%;
	height: 100%;
}

#ctf .ctf-item:last-child svg.fa-twitter path {
	transform: scale(1.0554) translate(-2.75%, 4.25%);
}

#ctf .ctf-author-box-link {
	display: inline-flex;
	flex-direction: column;
	font-size: var(--tweet-header-footer-font-size);
}

#ctf .ctf-author-name {
	margin: 0;
	padding-right: 40px;
	font: var(--bold-font);
	color: var(--secondary-color) !important;
}

#ctf.ctf-styles .ctf-author-screenname {
	margin: 0;
	padding-right: 40px;
	font-size: inherit;
	font: var(--light-font);
}

#ctf.ctf-styles .ctf-retweet .ctf-author-screenname::after {
	content: ' (Retweet LVU)';
}

#ctf :is(.ctf-verified, .ctf-screename-sep) {
	display: none;
}

#ctf.ctf-styles .ctf-tweet-meta {
	position: absolute;
	right: 25px;
	bottom: 25px;
	margin: 0;
	font: var(--light-font);
	text-transform: uppercase;
}

#ctf .ctf-corner-logo {
	position: absolute;
	color: var(--primary-color);
	opacity: .15;
}

#ctf .ctf-item:last-child .ctf-corner-logo {
}

#ctf .ctf-tweet-content {
	padding-top: 1.2em !important;
	font-size: var(--tweet-content-font-size);
	z-index: 1;
}

#ctf .ctf-tweet-actions {
	position: absolute;
	bottom: 25px;
}

#ctf .ctf-tweet-content .ctf_more {
	display: none;
}

#ctf .ctf-tweet-content .ctf-tweet-text {
	line-height: inherit;
}

#ctf .ctf-tweet-content .ctf-tweet-text a {
/* 	-ms-word-break: break-all;
	word-break: break-all; */
}

#ctf .ctf-tweet-content .ctf-tweet-text-media-wrap {
	display: flex;
	position: absolute;
	top: 25px;
	right: 25px;
	margin: 0;
	padding: 0;
	border: none;
}

#ctf .ctf-tweet-content .ctf-tweet-text-media-wrap:hover {
	background: unset;
}

#ctf .ctf-tweet-actions .ctf-twitterlink {
	margin: 0;
	padding: 0;
	font: var(--light-font);
	font-size: var(--tweet-header-footer-font-size);
	text-transform: uppercase;
}

/* who we are */

#front-who-we-are {
	overflow: visible;
}

h2.who-we-are.headline {
	margin-left: 50%;
}

h2.who-we-are.headline::before {
	content: '';
	width: 100vw;
	height: calc(var(--h2-front-font-size) * var(--golden-line-factor));
	display: block;
	position: absolute;
	bottom: .32em;
	left: calc(-100vw - .2em);
	background-color: var(--tertiary-color);
}

.who-we-are.content {
	display: grid;
	grid-template-columns: auto auto;
}

.who-we-are.image {
	width: var(--square-image-width);
	height: var(--square-image-height);
	margin: auto 0;
	object-fit: cover;
	z-index: 3;
}

.who-we-are.text {
	width: var(--square-width);
	height: var(--square-height);
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-left: calc(var(--square-padding) / 2 * (-1));
	padding: var(--square-padding);
	background-color: var(--secondary-color);
	text-align: right;
	font-size: var(--square-font-size);
	color: #fff;
}

.who-we-are.text span {
	margin-top: 1.2em;
}

/* what we do */

#front-what-we-do {
	overflow: visible;
}

h2.what-we-do.headline {
	margin-right: calc(var(--content-width) - var(--square-width));
	color: var(--secondary-color);
}

h2.what-we-do.headline::after {
	content: '';
	width: calc(var(--h2-front-font-size) * var(--golden-line-factor));
	height: calc(2em + var(--square-height) + 300px);
	display: block;
	position: absolute;
	top: .18em;
	right: calc(1em * var(--golden-line-factor) * (-3));
	background-color: var(--tertiary-color);
	z-index: -1;
}

.what-we-do.content {
	display: grid;
	grid-template-columns: auto auto;
}

.what-we-do.text {
	width: var(--square-width);
	height: var(--square-height);
	display: flex;
	align-items: center;
	padding: var(--square-padding);
	background-color: var(--primary-color);
	font-size: var(--square-font-size);
	color: #fff;
}


/* MAIN - PAGE (NOT FRONT-PAGE)  */

body:not(.home) {
	font-size: var(--page-single-font-size);
}

body:not(.home) > main > section:first-child {
	padding-top: 50px;
}

body:not(.home) h2,
body:not(.home) h3,
body:not(.home) h4,
body:not(.home) h5,
body:not(.home) h6 {
	margin-top: 1.5em;
}

/* failed login */

body.page-anmeldung-fehlgeschlagen main #wppb-login-wrap {
  height: 17em;
  width: 100%;
	max-width: 550px;
	padding: 2em;
	background-color: var(--secondary-color);
}

body.page-anmeldung-fehlgeschlagen main #wppb-login-wrap form#wppb-loginform > p {
  height: 2.5em;  
}

body.page-anmeldung-fehlgeschlagen main #wppb-login-wrap form#wppb-loginform > p > input#rememberme {
	min-width: 20px;
	min-height: 20px;
}

body.page-anmeldung-fehlgeschlagen main #wppb-login-wrap form#wppb-loginform > p.login-remember > label {
  color: #fff;  
}

body.page-anmeldung-fehlgeschlagen main .wp-block-button {
	width: 100%;
	max-width: 550px;
}

body.page-anmeldung-fehlgeschlagen main .wp-block-button > a {
	width: 100%;
}

/* account-settings */

.admin-bar p#wppb_form_general_message {
	padding-top: 6px;
}

form#select_user_to_edit_form {
	display: none;
}

form#wppb-edit-user {
	max-width: 550px;
	display: flex;
	flex-direction: column;
	gap: 2.25rem;
	padding: 2em;
	background-color: var(--secondary-color);
}

form#wppb-edit-user > ul:nth-child(1) {
	margin: 0;
}

form#wppb-edit-user > ul:nth-child(2) {
	display: none;
}

form#wppb-edit-user > ul > li.wppb-form-field {
	padding: 0;
}

form#wppb-edit-user > ul > li.wppb-form-field:not(:nth-child(1)) {
	margin-top: 1.25rem;
}

form#wppb-edit-user > ul > li.wppb-field-error {
	margin-bottom: 0 !important;
	padding: 0 !important;
	background-color: initial;
	border: none;
}

form#wppb-edit-user > ul > li.wppb-form-field label {
	width: unset;
	position: static;
	margin-bottom: .25em;
	text-indent: 0;
	color: #fff;
}

form#wppb-edit-user > ul > li.wppb-form-field label span.wppb-required {
	color: inherit;
}

form#wppb-edit-user > ul > li.wppb-form-field input.text-input {
	height: 2.5em;
	padding: 0 .5em;
	border: none;
	border-radius: unset;
}

form#wppb-edit-user > ul > li.wppb-field-error input.text-input {
	background-color: var(--error-background-red);
}

form#wppb-edit-user > ul > li.wppb-field-error span.wppb-form-error {
	font-size: .8em;
	color: var(--error-red);
}

form#wppb-edit-user > p.form-submit {
	margin: 0;
}

form#wppb-edit-user > p.form-submit > input#edit_profile {
	width: 100%;
	height: 2.5em;
	background-color: var(--primary-color);
	color: #fff;
	cursor: pointer;
}

form#wppb-edit-user > p.form-submit > input#edit_profile:hover {
	color: var(--tertiary-color);
	transition: all .3s ease-out;
}

/* reset password */

form#wppb-recover-password ul {
	max-width: 550px;
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
	margin-bottom: 0;
	padding: 2em 2em 1.25rem;
	background-color: var(--secondary-color);
}

form#wppb-recover-password ul li {
	height: 2.5em;
	margin: 0;
	padding: 0;
}

form#wppb-recover-password ul li input {
	height: 100%;
	padding: 0 .5em;
	border: none;
	border-radius: unset;
}

form#wppb-recover-password p.form-submit {
	max-width: 550px;
	margin: 0;
	padding: 0 2em 2em;
	background-color: var(--secondary-color);
}

form#wppb-recover-password p.form-submit input.submit.button {
	width: 100%;
	height: 2.5em;
	padding: 0 .5em;
	background-color: var(--primary-color);
	color: #fff;
	cursor: pointer;
}

form#wppb-recover-password p.form-submit input.submit.button:hover {
	color: var(--tertiary-color);
	transition: all .3s ease-out;
}


/* MAIN - SINGLE */

.single.featured-image-container {
	width: 100vw;
  position: relative;
	margin: -50px 0 var(--h1-font-size) calc((100vw - var(--content-width)) / (-2));
}

.single.featured-image {
  width: 100%;
	height: 400px;
	object-fit: cover;
}

.single.post-info-container {
	display: flex;
/*	flex-direction: column; */
	margin-bottom: 1.5em;
/* 	font-size: 20px; */
}

.single.appointment.post-info-container,
.single.job.post-info-container,
.single.event.post-info-container {
	flex-direction: column;
}

.single.post-info {
	display: flex;
	margin: 0 1.5em .5em 0;
}

.single.post-icon {
	color: var(--secondary-color);
  padding-top: .75px;
	margin-top: -2px;
  margin-right: .5em;
}

section.single:not(.member-organisation, .person) .single.post-icon + * {
	font: var(--bold-font);
}

.single.post-category a {
	color: #000;
  text-decoration: none;
}

.single.post-category a:hover {
  text-decoration: underline;
}

.single.post-date {
	margin-right: 1.5em;
}


/* MAIN - SINGLE-APPOINTMENT */

.single.appointment.date,
.single.appointment.location {
	margin-right: 1.5em;
}

.single.appointment.link {
	text-decoration: none;
}


/* MAIN - SINGLE-PERSON */

.single.person.container {
	display: flex;
	justify-content: space-between;
}

.single.person.content {
	width: calc(var(--content-width) * var(--single-person-text-width-factor));
}

.single.person.content > p:first-child {
	margin-top: 0;
}

.single.person.image-functions-contact-social {
	width: calc(var(--content-width) * var(--single-person-ifcs-width-factor));
	display: flex;
	flex-direction: column;
}

.single.person.image-functions-contact-social:only-child {
	width: calc(var(--content-width) * var(--single-person-ifcs-solo-width-factor));
	align-items: center;
	margin: 0 auto;
}

.single.person.image {
	width: var(--single-person-image-width);
	height: var(--single-person-image-height);
}

.single.person.functions-contact-social {
	width: var(--single-person-image-width);
}

.single.person.functions {
	padding-top: 1em;
	font: var(--bold-font);
	color: var(--secondary-color);
}

.single.person.function {
	font-size: var(--h3-font-size);
	text-transform: uppercase;
}

.single.person.additional-function {
	padding-top: 5px;
	font-size: var(--h4-font-size);
}

.single.person.contact-item {
	display: flex;
	margin: 15px 0;
}

.single.person.contact-icon {
	width: 1.5em;
	flex-shrink: 0;
	color: var(--secondary-color);
}

.single.person.contact-text {
	text-decoration: none;
}

.single.person.social {
	display: flex;
	flex-wrap: wrap;
	margin-top: 25px;
}

.single.person.social-item {
	display: flex;
	justify-content: center;
	align-items: center;
	width: calc(var(--content-width) * var(--single-person-ifcs-width-factor) * var(--single-person-image-width-factor) * 1/5);
	height: calc(var(--content-width) * var(--single-person-ifcs-width-factor) * var(--single-person-image-width-factor) * 1/5);
	background-color: var(--primary-color);
	font-size: calc(var(--content-width) * var(--single-person-ifcs-width-factor) * var(--single-person-image-width-factor) * 1/5 * .5);
	color: #fff;
	text-decoration: none;
}

.single.person.press-image {
	display: flex;
	margin-top: 25px;
}

.single.person.image-functions-contact-social:only-child .single.person.social-item {
	width: calc(var(--content-width) * var(--single-person-ifcs-solo-width-factor) * var(--single-person-image-width-factor) * 1/5);
	height: calc(var(--content-width) * var(--single-person-ifcs-solo-width-factor) * var(--single-person-image-width-factor) * 1/5);
	font-size: calc(var(--content-width) * var(--single-person-ifcs-solo-width-factor) * var(--single-person-image-width-factor) * 1/5 * .5);
}

.single.person.social-item:nth-of-type(even) {
	background-color: var(--secondary-color);
}

.single.person.social-item:hover {
	color: var(--tertiary-color);
	transition: all .3s ease-out;
}


/* MAIN - SINGLE-MEMBER-ORGANISATION */

.single.member-organisation.container {
	display: flex;
	flex-direction: column;
}

.single.member-organisation.meta {
	display: flex;
	justify-content: space-between;
}

.single.member-organisation.address-contact {
	width: 55%;
	display: flex;
	flex-direction: column;
}

.single.member-organisation.contact {
	margin-top: 1.2em;
}

.single.member-organisation.address-item,
.single.member-organisation.contact-item {
	display: flex;
	gap: 7.5px;
}

.single.member-organisation.address-item.postal {
	margin-top: 1.2em;
}

.single.member-organisation.address-icon,
.single.member-organisation.contact-icon {
	color: var(--secondary-color);
}

.single.member-organisation.contact-text {
	text-decoration: none;
}

.single.member-organisation.logo-container {
	width: 40%;
}

img.single.member-organisation.logo {
	width: 100%;
/* 	height: 100%; */
	object-fit: contain;
}


/* MAIN - ARCHIVE */

/* general */

body:not(.home) .archive h2,
body:not(.home) .archive h3,
body:not(.home) .archive h4,
body:not(.home) .archive h5,
body:not(.home) .archive h6 {
	width: 100%;
	text-align: left;
}

.archive.categories {
  display: flex;
  gap: .75em;
  flex-wrap: wrap;
}

.archive.category-button.active {
  text-decoration: none;
  color: var(--primary-color);
}

.archive.posts-container a {
	text-decoration: none;
}

.archive.post {
  width: 100%;
  min-height: 250px;
  display: flex;
/* 	justify-content: flex-end; */
  position: relative;
  background-color: var(--primary-color);
	font-size: var(--archive-post-font-size);
	color: #fff;
}

.archive.post:nth-of-type(2n) {
  flex-direction: row-reverse;
  margin: 50px 0;
}

.archive.post:last-of-type {
  margin-bottom: 50px;
}

.archive.post-image-link {
	width: 250px;
	height: 100%;
	display: flex;
	position: relative;
}

.archive.post > .post-image-link {
	height: unset;
}

.archive.post-image {
  width: 100%;
  height: 100%;
  flex-shrink: 0;
  object-fit: cover;
  position: absolute;
}

.archive.post-body {
  width: 100%;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  padding: 20px;
	overflow: hidden;
}

.archive.post-image-link + .archive.post-body {
  width: calc(100% - 250px);
}

.archive.post:nth-of-type(2n) .archive.post-image {
  right: 0;
}

.archive.post:nth-of-type(2n+1) .archive.post-image {
  left: 0;
}

h2.archive.post-headline {
/*   max-height: calc(1.3em * 3 + 2px); */
	margin-top: 0;
  overflow: hidden;
	font-size: var(--h2-archive-font-size);
}

h2.archive.post-headline a {
  color: var(--secondary-color);
}

.archive.post-info-container {
  display: flex;
  margin-bottom: .5em;
	font-size: 16px;
}

.archive.post-info {
	display: flex;
}

.archive.post-icon {
  padding-top: .75px;
	margin-top: -1px;
  margin-right: .5em;
}

.archive.post-info:not(:last-child) > *:last-child {
	margin-right: 1.5em;
}

.archive.post-category a {
	color: #fff;
}

.archive.post-teaser {
  height: calc(1.2em * 2);
  position: relative;
/*   text-align: justify; */
  overflow: hidden;
	hyphens: auto;
}

.archive.post-teaser::after {
  content: "";
  text-align: right;
  position: absolute;
  bottom: 0;
  right: 0;
  width: 150px;
  height: 1.2em;
	background: linear-gradient(to right, transparent, var(--primary-color-rgba));
  background: -webkit-linear-gradient(left, var(--ios-transparent-primary), var(--primary-color-rgba));
}

.archive.post-teaser > p {
	margin: 0;
}

.archive.read-more-container {
  margin-top: .5em;
}

.archive.read-more {
	position: relative;
	color: #fff;
}

.archive.post-category a:hover,
.archive.read-more:hover {
	color: var(--secondary-color);
	transition: all .3s ease-out;
}

.archive.read-more::after {
	content: '';
	width: calc(1em * var(--golden-line-factor));
	height: 3em;
	display: block;
	position: absolute;
	top: .22em;
	right: calc(1em * var(--golden-line-factor) * (-3));
	background-color: var(--tertiary-color);
}

/* appointment */

.archive.appointment.post {
	background-color: var(--secondary-color);
}

h2.archive.appointment.post-headline a {
	color: var(--primary-color);
}

.archive.appointment.post-teaser::after {
	background: linear-gradient(to right, transparent, var(--secondary-color-rgba));
	background: -webkit-linear-gradient(left, var(--ios-transparent-secondary), var(--secondary-color-rgba));
}

.archive.appointment.former-appointments {
	display: flex;
	justify-content: center;
	margin-top: 2.5em;
}

/* job */

.archive.job.post-info {
	display: flex;
}

/* member-information */

.archive.member-information.categories {
  margin-bottom: 2em;
}

.archive.member-information.category-description {
  margin-bottom: 2em;
	padding: 2em;
	background-color: var(--secondary-color);
	color: #fff;
}

.archive.member-information.category-description h3 {
  margin-top: 0;
  margin-bottom: 1em;
}

.archive.member-information.category-description p {
  margin: 0;
}

.archive.member-information.category-description a {
  color: #fff;
	text-decoration-color: #fff;
}

.archive.member-information.category-description a:hover {
  color: var(--tertiary-color);
	text-decoration-color: var(--tertiary-color);
}

/* search-results */

section#search-results h1 + h2 {
	margin-bottom: 1em;
}

/* pagination */

.pagination {
	width: 100%;
	display: flex;
	justify-content: center;
}

.pagination > * {
	display: flex;
	padding-top: 1px;
	text-decoration: none;
}

.page-numbers:not(.prev, .next) {
	width: 25px;
	height: 25px;
	justify-content: center;
	align-items: center;
	margin: 0 2.5px;
	background-color: var(--primary-color);
	color: #fff;
}

.page-numbers.prev,
.page-numbers.next {
	margin: 0 10px;
}

.page-numbers.current {
	background-color: var(--tertiary-color);
}

.page-numbers:not(.prev, .current, .next):hover {
	background-color: var(--secondary-color);
	transition: all .3s ease-out;
}

.page-numbers.prev:hover,
.page-numbers.next:hover {
	color: var(--secondary-color);
	transition: all .3s ease-out;
}


/* MAIN - SHORTCODES */

/* person */

.person-shortcode {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 1em;
}

.person-shortcode + .person-shortcode {
	margin: 2em 0;
}

h2 + .person-shortcode,
h3 + .person-shortcode,
h4 + .person-shortcode,
h5 + .person-shortcode,
h6 + .person-shortcode {
	margin-top: .5em;
}

section.page .person-shortcode + h2 {
	margin-top: 2.5em;
}

.person-shortcode a {
	display: flex;
	text-decoration: none;
}

.person-shortcode-image {
	width: var(--scp-image-width);
	height: var(--scp-image-height);
}

.person-shortcode-info > * {
	margin: 5px 0;
}

.person-shortcode-info *:not(.person-shortcode-name, .person-shortcode-function, .person-shortcode-contact-icon) {
	font-size: var(--scp-general-font-size);
}

.person-shortcode-name {
	font: var(--bold-font);
	color: var(--primary-color);
	text-transform: uppercase;
}

.person-shortcode-function {
	font: var(--bold-font);
	color: var(--secondary-color);
}

.person-shortcode-contact {
	display: flex;
	gap: .5em;
}

.person-shortcode-contact-icon {
	font-size: var(--scp-contact-font-size);
	color: var(--secondary-color);
}

.person-shortcode-contact-text {
	display: flex;
	align-items: center;
}

.person-shortcode-social {
	display: flex;
}

.person-shortcode-social-icon {
	width: var(--scp-social-icon-width);
	height: var(--scp-social-icon-height);
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--primary-color);
	color: #fff;
}

.person-shortcode-social .person-shortcode-social-icon:nth-of-type(even) {
	background-color: var(--secondary-color);
}

.person-shortcode-social-icon:hover {
	color: var(--tertiary-color);
	transition: all .3s ease-out;
}

/* member-organisation */

body.page-mitgliedsverbaende .wp-block-group__inner-container {
	display: flex;
	gap: 25px;
	flex-wrap: wrap;
}

a.member-organisation-shortcode {
  width: 200px;
  height: 200px;
  display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	padding: 5px;
	background-color: #fff;
	text-align: center;
  border: 1px solid var(--primary-color);
}

a.member-organisation-shortcode::before {
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-color: var(--primary-color);
	opacity: 0;
}

a.member-organisation-shortcode:hover::before {
	opacity: .15;
	transition: all .3s ease-out;
}

img.scmo-logo {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
/*   object-position: center top; */
}


/* MAIN - OTHER */

/* copyright (images) */

body:not(.page-bilder-und-logos, .page-vorstand, .page-geschaeftsstelle) span.isc-source {
/*	width: 250px; */
	display: inline-flex;
	flex-grow: 0;
}

span.isc-source-text {
	top: unset !important;
	right: 0;
	bottom: 0;
	left: unset !important;
	padding: 5px !important;
	background-color: rgba(0, 0, 0, .25) !important;
	font: var(--light-font);
	font-size: var(--copyright-font-size) !important;
	opacity: 1 !important;
	z-index: 9 !important;
}

span.isc-source-text a {
	color: inherit;
}



/* FOOTER */

footer {
  width: 100vw;
	position: relative;
  background-color: var(--footer-background-color); 
  color: #fff;
	font: var(--light-font);
}

footer a {
  color: #fff;
  text-decoration: none;
}

footer a:hover {
	color: var(--tertiary-color);
	transition: all .3s ease-out;
}

.footer-container {
	width: 100%;
	display: grid;
	grid-template-columns: auto min-content;
	padding: 50px calc((100vw - var(--footer-content-width)) / 2 + var(--logo-area-width) + 50px) 50px calc((100vw - var(--footer-content-width)) / 2);
}

.grid-column-left {
	grid-column: 1 / 2;
}

nav#footer-menu {
	width: 100%;
	display: flex;
	font-size: var(--footer-menu-font-size);
	text-transform: uppercase;
	transition: all .3s ease-out;
}

nav#footer-menu .menu-item {
	margin-bottom: 50px;
}

.copyright {
	grid-column: 1 / 2;
	grid-row: 1 / 2;
}

.grid-column-right {
	grid-column: 2 / 3; 
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
}

footer .social-media-icon {
	font-size: var(--social-media-icon-width);
	line-height: 1;
}

.footer-logo-area {
	width: var(--logo-area-width);
	height: var(--logo-area-height);
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	right: calc((100vw - var(--footer-content-width)) / 2);
	bottom: 0;
	background-color: #fff;
}

.footer-logo-container {
	width: 50%;
	height: 65%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
}

footer .footer-logo-area a {
	display: flex;
	justify-content: center;
	color: #000;
}

img#logo-bdi {
	width: 100%;
	height: auto;
}

img#logo-bda {
	width: 80%;
	height: auto;
}


/* OTHER */

#overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.5);
  visibility: hidden;
  opacity: 0;
  transition: all .3s ease-out;
}

#overlay.open {
  visibility: visible;
  opacity: 1;
}


/* WORDPRESS ALTERATIONS */

.wp-block-file {
	display: flex;
	flex-direction: column;
}

.wp-block-file * + .wp-block-file__button {
	margin-left: 0;
	margin-top: 1em;
}

.wp-block-button__link,
.wp-block-file .wp-block-file__button {
	width: fit-content;
	padding: .65em 1em;
  border-radius: unset;
  background-color: var(--secondary-color) !important;
	font: var(--bold-font);
	text-transform: uppercase;
  color: #fff;
}

.wp-block-button__link:hover,
.wp-block-file a.wp-block-file__button:hover {
	opacity: 1;
	color: var(--tertiary-color);
	transition: all .3s ease-out;
}

.wp-block-media-text__content > *:first-child {
	margin-top: 0;
}

.wp-block-image figure:is(.aligncenter, .alignleft, .alignright) {
	margin-top: 0;
}

.wp-block-image figure:is(.aligncenter, .alignleft, .alignright) span {
	margin-top: 0;
	margin-bottom: 0;
}

.wp-block-image img {
	width: 100%;
	height: auto;
}

.wp-block-image figure:is(.aligncenter, .alignleft, .alignright) figcaption {
	margin-right: 1.25em;
	font-size: 16px;
	text-align: center;
}


/* PLUGINS */

/* PDF Generator For WP Pro */

.wps-pgfw-pdf-generate-icon__wrapper-frontend {
  margin-top: 3em;
}

a.pgfw-single-pdf-download-button {
  flex-direction: row;
  gap: 9px;
}





/* MEDIA QUERIES */

@media (max-width: 1920px) {
	:root {
		--logo-area-width: 305px;
		--square-width: calc(100vw / 2);
/* 		--square-font-size: calc(var(--square-width) * .0292); */
/* 	--square-news-headline-font-size: calc(var(--square-width) * .0412); */
/* 	--square-news-button-font-size: calc(var(--square-width) * .03125); */
	}
}

@media (max-width: 1740px) {
	:root {
		--logo-area-width: 275px;
	}
	nav#footer-menu .menu-item {
		margin-bottom: 40px;
	}
}

@media (max-width: 1640px) {
	.footer-container{
		padding: 50px calc(50px + var(--logo-area-width) + 50px) 50px 50px;
	}
	.footer-logo-area {
		right: 50px;
	}
}

@media (max-width: 1540px) {
	section {
		padding: 100px calc((100vw - var(--content-width)) / 2);
	}
}

@media (max-width: 1440px) {
  :root {
		--social-media-icon-width: 45px;
    --logo-area-width: 215px;
		--square-image-width: calc(var(--content-width) - var(--square-width) + var(--square-padding) / 2);
  }
	h2.who-we-are.headline {
    margin-left: calc(var(--content-width) - var(--square-width));
	}
	nav#footer-menu .menu-item {
		margin-bottom: 25px;
	}
}


/* Scroll to top button */

#scroll-top {
  position: fixed;
  right: 30px;
  bottom: 30px;
  z-index: 100;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background-color: #fff;
  width: 60px;
  height: 60px;
  box-shadow: 0 3px 24px rgb(0 0 0 / 16%);
  font-size: 2rem;
  color: #aaa;
}


@media (max-width: 1140px) {
	:root {
		--content-width: calc(100vw - 100px);
		--h1-front-font-size: 70px;
		--h2-front-font-size: 50px;
		--square-width: 570px;
/* 		--square-max-width: 570px; */
		--square-image-width: calc(var(--square-width) - var(--square-padding) * 2);
		--tweet-width: calc(var(--content-width) * .3404);
		--tweet-gap: calc(var(--content-width) * .0346);
		--twitter-icon-width: calc(var(--content-width) * .6596);
		--footer-menu-font-size: 20px;
	}
	section {
		padding: 75px 50px;
	}
	.news.post {
		grid-area: 2 / 1 / 3 / 3;
		justify-self: center;
		margin-top: calc(var(--square-padding) / 2 * (-1));
	}
	.news.image-container {
		grid-area: 1 / 1 / 2 / 3;
		justify-self: center;
		margin: 0;
	}
	h2.who-we-are.headline {
		margin-left: calc((100vw - 100px - var(--square-width)) / 2);
	}
	.who-we-are.text {
		grid-area: 1 / 1 / 2 / 3;
		justify-self: center;
		margin-left: 0;
	}
	.who-we-are.image {
		grid-area: 2 / 1 / 3 / 3;
		justify-self: center;
		margin-top: calc(var(--square-padding) / 2 * (-1));
	}
	h2.what-we-do.headline {
		margin-right: calc((100vw - 100px - var(--square-width)) / 2);
	}
	.what-we-do.text {
		grid-area: 1 / 1 / 2 / 3;
		justify-self: center;
/* 		margin-right: 0; */
	}
	.single.featured-image-container {
		margin-top: calc((100vw - var(--content-width)) / (-2));
	}
}

@media (max-width: 1040px) {
	:root {
		--newsletter-registration-box-width: calc(100vw - 100px);
		--newsletter-registration-box-padding: calc(var(--newsletter-registration-box-width) * .0419);
		--newsletter-font-size: 20px;
		--newsletter-form-elements-height: 40px;
		--newsletter-form-inputs-font-size: 14px;
		--newsletter-register-button-font-size: 24px;
		--single-person-text-width-factor: 1;
		--single-person-ifcs-width-factor: 1;
		--single-person-ifcs-solo-width-factor: 1;
		--single-person-image-width-factor: .475;
	}
	.newsletter.info-text {
    padding-right: var(--newsletter-registration-box-padding);
	}
	.single.person.container {
		flex-direction: column-reverse;
	}
	.single.person.image-functions-contact-social {
		flex-direction: row;
		justify-content: space-between;
		margin-bottom: 2em;
	}
	.single.person.image-functions-contact-social:only-child {
		margin: 0;
	}
	.footer-container {
    width: 100%;
    display: flex;
		flex-direction: column;
		align-items: flex-end;
		padding: 50px;
	}
	.grid-column-left {
		width: 100%;
		margin-bottom: 50px;
	}
	nav#footer-menu,
	ul#menu-footer-menue,
	.copyright {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		text-align: center;
	}
	.grid-column-right {
		width: 100%;
		flex-direction: row;
		align-items: flex-start;
		padding: 0 calc((100% - var(--logo-area-width)) / 2) calc(var(--logo-area-height));
	}
	.footer-logo-area {
    right: calc((100% - var(--logo-area-width)) / 2);
	}
}

@media (max-width: 940px) {
	:root {
		--tweet-width: 390px;
		--tweet-gap: 25px;
/* 		--scp-image-width: 175px;
		--scp-general-font-size: 14px;
		--scp-name-function-font-size: 16px;
		--scp-social-icon-width: 20px; */
	}
	#front-twitter-feed {
		padding: 25px calc((100vw - var(--tweet-width)) / 2) 75px;
	}
	.ctf-tweets {
		padding-top: var(--tweet-height);
		padding-bottom: calc(var(--tweet-header-footer-font-size) * 2.35 + 25px);
	}
	#ctf .ctf-item:last-child {
		width: var(--tweet-width);
		height: calc(var(--tweet-width) - var(--tweet-gap));
		position: absolute;
		top: 0;
		margin-left: 0;
	}
	#ctf .ctf-item:last-child::before {
		width: 100%;
		top: calc(var(--tweet-height) * .75 - var(--h2-front-font-size));
		left: 0;
		text-align: center;
	}
	#ctf .ctf-item:last-child::after {
		top: calc(var(--tweet-height) * .75 - var(--h2-front-font-size) * var(--golden-line-factor));
		left: calc((var(--tweet-width) + var(--h2-front-font-size) * 4) / 2 + var(--h2-front-font-size) * var(--golden-line-factor));
	}
}

@media (max-width: 782px) {
  #wpadminbar ~ header {
    margin-top: 46px;
  }
	:root {
		--h1-font-size: 35px;
		--h2-font-size: 25px;
		--h3-font-size: 20px;
		--h4-font-size: 18px;
		--page-single-font-size: 18px;
		--logo-area-width: 175px;
		--single-person-image-width-factor: 1;
		--scp-image-width: 250px;
	}
	.newsletter.content {
		flex-direction: column;
	}
	.newsletter.info-text {
		width: 100%;
    padding-right: 0;
    padding-bottom: 1.6em;
	}
	.newsletter.registration-form {
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap;
	}
	.newsletter #mailpoet_form_1 {
		width: 100%;
	}
	.newsletter #mailpoet_form_1 form.mailpoet_form {
		flex-direction: row;
		flex-wrap: wrap;
	}
	.newsletter.registration-form input {
		width: calc(50% - 10px);
	}
	.newsletter #mailpoet_form_1 .mailpoet_paragraph.name,
	.newsletter #mailpoet_form_1 .mailpoet_paragraph.e-mail {
		width: calc(50% - 10px);
	}
	.newsletter.register.button {
		width: 100%;
		margin-top: calc(var(--newsletter-form-elements-height) / 2);
	}
	.newsletter #mailpoet_form_1 .mailpoet_paragraph.register.button {
		margin-top: calc(var(--newsletter-form-elements-height) / 2);
	}
	body.page-anmeldung-fehlgeschlagen main form#wppb-loginform > p > input#rememberme + label {
		left: 2em;
	}
	.single.featured-image {
		height: 350px;
	}
	.single.person.image-functions-contact-social {
    flex-direction: column;
	}
	.archive.post,
  .archive.post:nth-of-type(even) {
    flex-direction: column;
  }
	.archive.post-image-link {
		width: 100%;
	}
  .archive.post-image {
    width: 100%;
    height: 250px;
    position: static;
  }
  .archive.post-image-link + .archive.post-body {
    width: unset;
  }
  .archive.post-body {
    min-height: 250px;
  }
	.archive.job.post-body {
		min-height: 300px;
	}
	.person-shortcode {
		flex-direction: column;
		align-items: flex-start;
		gap: .5em;
	}
	body:not(.page-bilder-und-logos) span.isc-source {
		width: unset;
	}
  
  #scroll-top {
    width: 45px;
    height: 45px;
    font-size: 1.7rem;
  }
  
}

@media (max-width: 670px) {
	:root {
		--square-width: var(--content-width);
		--square-padding: calc(var(--square-width) * .065);
	--square-font-size: calc(var(--square-width) * .0496);
	}
	.news.post {
		padding-bottom: calc(var(--square-padding) * 2);
	}
	.news.read-more-container {
		bottom: calc(var(--square-padding) * 2);
	}
	.news.read-more::before {
		height: 3em;
	}
	.archive.post-info-container {
		flex-direction: column;
		gap: .5em;
	}
}

@media (max-width: 600px) {
	:root {
		--h1-front-font-size: 50px;
		--h2-front-font-size: 35px;
		--square-news-font-size: 16px;
		--square-news-headline-font-size: 24px;
		--square-news-button-font-size: 18px;
	}
  #wpadminbar {
    position: fixed;
  }
	.news.post {
    padding-bottom: calc(var(--square-padding) * 2.5);
	}
	.news.post-teaser {
		max-height: 7.2985em;
	}
	.news.read-more-container {
		bottom: calc(var(--square-padding) * 2.5);
	}
	.newsletter.registration-form input {
    width: 100%;
	}
	.newsletter #mailpoet_form_1 .mailpoet_paragraph.name,
	.newsletter #mailpoet_form_1 .mailpoet_paragraph.e-mail {
		width: 100%;
	}
	.newsletter.registration-form input:last-of-type {
    margin-top: calc(var(--newsletter-form-elements-height) / 2);
	}
	.newsletter #mailpoet_form_1 .mailpoet_paragraph.e-mail {
		margin-top: calc(var(--newsletter-form-elements-height) / 2);
	}
	.single.member-organisation.meta {
    flex-direction: column-reverse;
    gap: 1.2em;
	}
	.single.member-organisation.address-contact,
	.single.member-organisation.logo-container {
		width: 100%;
	}
  div#wppb-login-wrap {
    height: 150px;
    width: 100%; 
  }
  div#wppb-recover-password-container ul,
  div#wppb-recover-password-container .form-submit input {
    width: 100%;
  }
/*   div#wppb-recover-password-container ul input,
  div#wppb-recover-password-container .form-submit input#wppb-recover-password-button {
    font-size: 16px;
  } */
  div.wppb_holder .wppb-success,
  div.wppb_holder .wppb-warning,
  div.wppb_holder .wppb-error {  
    width: 100%;  
  }
  
}

@media (max-width: 540px) {
	:root {
		--content-width: calc(100vw - 50px);
		--square-news-headline-font-size: 20px;
	}
	section {
		padding: 75px 25px;
	}
	h2.who-we-are.headline {
    margin-left: calc(var(--content-width) - var(--square-width));
	}
	h2.what-we-do.headline {
    margin-right: calc(var(--content-width) - var(--square-width));
	}
	.single.featured-image {
		margin-top: -50px;
	}
}

@media (max-width: 440px) {
	:root {
		--tweet-width: var(--content-width);
		--social-media-icon-width: 40px;
		--h1-font-size: 30px;
		--h2-font-size: 22px;
		--h2-archive-font-size: 18px;
		--h3-font-size: 18px;
		--h4-font-size: 16px;
		--page-single-font-size: 16px;
		--archive-post-font-size: 16px;
		--square-news-headline-font-size: 18px;
	}
	.news.post {
    padding-bottom: calc(var(--square-padding) * 3);
	}
	.news.post-teaser {
		max-height: 4.8657em;
	}
	.news.read-more-container {
		bottom: calc(var(--square-padding) * 3);
	}
	.newsletter.content {
		width: var(--square-width);
		height: var(--square-height);
		justify-content: space-between;
	}
	.newsletter.info-text {
		font-size: calc(var(--square-width) * .05);
		padding: 0;
	}
	.archive.job.post-body {
		min-height: var(--content-width);
		gap: 10px;
	}
	.footer-container {
		padding: 50px 25px;
	}
}

@media (max-width: 380px) {
	:root {
		--square-font-size: 16px;
		--square-news-headline-font-size: 16px;
		--newsletter-form-elements-height: 30px;
		--newsletter-register-button-font-size: 18px;
	}
	.news.post-teaser {
    max-height: 2.4329em;
	}
	:is(.who-we-are, .what-we-do).text {
		height: unset;
	}
	body.page-anmeldung-fehlgeschlagen main #wppb-login-wrap {
		height: 15em;
		padding: 1em;
	}
	form#wppb-edit-user {
		gap: 1.25rem;
		padding: 1em;
	}
	form#wppb-recover-password ul {
		gap: 1em;
		padding: 1em;
	}
	form#wppb-recover-password p.form-submit {
		padding: 0 1em 1em;
	}
	body.page-anmeldung-fehlgeschlagen main form#wppb-loginform > p:not(.login-submit) > input:not(#wppb-submit),
	body.page-anmeldung-fehlgeschlagen main form#wppb-loginform > p > input#rememberme + label,
	body.page-passwort-zuruecksetzen main form#wppb-recover-password > ul > li > input {
		font-size: 14px;
	}
	.archive.post-image {
    height: var(--content-width);
  }
	.archive.post-body {
		min-height: var(--content-width);
	}
}












