/* @override
	https://hellograph.de/wp/wp-content/themes/hellograph/style.css */


/*
Theme Name: HELLOGRAPH Designkollektiv
Theme URI:
Description:
Version: 1.0
Author: PD
Author URI:
Tags:
*/




/*	IMPORTS
-------------------------------------------------------------------------------*/


@import url("css/columns.css");
@import url("css/swiper.min.css");



/* @group WEBFONTS */

/*	WEBFONTS
-------------------------------------------------------------------------------*/


/*

via Typekit

NOTE:
museo-sans-rounded 900 = font-weight: 800

*/



/* @end */

/* @group RESET */

/*	RESET
-------------------------------------------------------------------------------*/

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

article, aside, figure, footer, header, hgroup, nav, section {display: block;}
img, object, embed {max-width: 100%;height:auto;}

/* force a vertical scrollbar to prevent a jumpy page */
html {overflow-y: scroll;}

/* we use a lot of ULs that aren't bulleted.
	don't forget to restore the bullets within content. */
ul {list-style: none;}

blockquote, q {quotes: none;}

blockquote:before,
blockquote:after,
q:before,
q:after {content: ''; content: none;}

a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;}
del {text-decoration: line-through;}
abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}

/* tables still need cellspacing="0" in the markup */
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: 800; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

input, select {vertical-align: middle;}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;}
input:focus, textarea:focus, select:focus { outline: none;}

input { /* remove top input shadow */
-webkit-appearance: none;
-moz-appearance: none;
}

table {font-size: inherit; font: 100%;}

a:hover, a:active {outline: none;}
small {font-size: 85%;}
strong, th {font-weight: 800;}
td, td img {vertical-align: top;}

/* standardize any monospaced elements */
pre, code, kbd, samp {font-family: monospace, sans-serif;}

/* hand cursor on clickable elements */
.clickable,
label,
input[type=button],
input[type=submit],
button {cursor: pointer;}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {margin: 0; border-radius: 0; font-family: inherit;}

/* make buttons play nice in IE */
button {width: auto; overflow: visible; outline: none;}

/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clear { clear: both; height: 0px; overflow: hidden;}
.clr:after { content: ""; display: table; clear: both;}
.cf:after {	content: ""; display: table; clear: both; }

/* prevent flickering on touch */
* {
	-webkit-tap-highlight-color:transparent;
}

/* natural box layout model to all elements */
*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
 }

 /* subscript and superscript */
sub { vertical-align: sub; font-size: 70%; line-height: 0; }
sup { vertical-align: super; font-size: 70%; line-height: 0; }

/* @end */



/*	VARS
-------------------------------------------------------------------------------*/


/* Color Info

hello black			#383838		rgba(56, 56, 56, 1)
hello light gray		#f2f2f2
hello text gray		#aaa

*/


 :root {
	--base-font-size: 42px; /*whhhaaat*/
	--base-line-height: 56px; /*56px*/

	--text-color: #383838;
	--link-color: #383838;
	--link-color-hover: #383838;

	--border-color: #383838;

	--primary-color: #383838;
	--primary-bg: #EAF7FC;

	--secondary-color: PLUM;
	--secondary-bg: #FEF4EA;

	--text-gray: #AAA;
	--text-light-gray: #f2f2f2;

	--font-sans: 'museo-sans', sans-serif;
	--font-sans-rounded: 'museo-sans-rounded', sans-serif;

	--text-small: 0.9rem;

	--container-width: 1792px; /*1792px*/
	--container-width: calc(1792px + 2 * var(--container-padding));
	--aligndefault-width: calc(1300px + 2 * var(--container-padding)); /*1460 / px*/
	--alignsemiwide-width: 980px;

	--container-padding: 80px;

	--main-padding-top: 80px;
	--main-padding-bottom: 280px;

	--vspace: 1.35rem; /*stack margin-top */
	--vspace-lg: 2.7rem;
	--vspace-xl: 6rem;
	--vspace-xxl: 8rem;


	--block-vspace: 2.0rem; /*140px*/

	--box-padding: 2rem;

	--header-height: 156px;
 }


 @media screen and (max-width: 1024px) {
	:root {
		--base-font-size: 26px;
		--base-line-height: 35px;

		--header-height: 130px;

		--main-padding-top: var(--vspace);
		--main-padding-bottom: 160px;

	}
}



 @media screen and (max-width: 600px) {
	:root {
		--base-font-size: 18px;
		--base-line-height: 27px;

		--container-padding: 20px;
	}
}




/* @group GENERAL */

/* GENERAL
---------------------------------------------------------------------------------*/


html {
	height: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	 -webkit-text-size-adjust: 100%;
	font-size: var(--base-font-size);
	color: var(--text-color);
}

body {
	height: 100%;
	font-family: var(--font-sans);
	line-height: var(--base-line-height);
	background: #f2f2f2;
}

a {
	position: relative;
	color: var(--link-color);
	text-decoration: none;
	font-weight: 700;
}

a, input {
	transition: all 200ms ease;
}

a:visited {
}

a:active {
}

a:hover {
	color: var(--link-color-hover);
	text-decoration: underline;
}


img {
	display: block;
	max-width: 100%;
    transition: all 300ms ease;
}

a:hover img {
	transition: all 300ms ease;
}


article > * + * { /* the lobotomized owl selector */
	margin-top: var(--vspace);
}

.main > *:first-child,
.stack > *:first-child {
	margin-top: 0;
}

strong, b {
	font-weight: 800;
}


/* TYPOGRAPHY
---------------------------------------------------------------------------------*/


h1 {
	font-size: 70px;
	font-family: var(--font-sans-rounded);
	font-weight: 800;
	line-height: 80px;
	line-height: 1.15;
	margin-top: var(--vspace);
	}

h2 {
	font-size: 42px;
	font-size: inherit; /*same as body text*/
	line-height: 56px;
	line-height: 1.35;
	font-weight: 500;
	margin-top: var(--vspace);
}

h3 {
	font-size: var(--base-font-size);
	margin-top: var(--vspace);
	font-weight: 800;
}

h4 {
	font-size: var(--base-font-size);
	margin-top: var(--vspace);
	font-weight: 500;
}


p {
	margin-top: var(--vspace);
}


hr {
	position: relative;
	display: block;
	height: 1px;
	border: 0;
	background: transparent;
	border-bottom: 1px solid var(--primary-color);
	margin: var(--vspace) 0;
}


h1 + * {
	margin-top: 0;
}

h2 + * {
	margin-top: 0;
}

h3 + * {
	margin-top: 0;
}



@media screen and (max-width: 1024px) {
	h1 {
		font-size: 42px;
	}
}


@media screen and (max-width: 768px) {

}


@media screen and (max-width: 600px) {
	h1 {
		font-size: 33px;
	}

	h2 {
		font-size: 22px;
	}

	h3 {
		font-size: 18px;
	}

}


@media screen and (max-width: 360px) {

}


/* LAYOUT
----------------------------------------------------------------------------------*/


/* # Container */

.page-wrap {
	position: relative;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	AUS_overflow: hidden;
	/*sticky footer*/
	display: flex;
	flex-direction: column;
}


.container,
.container-wide,
.container-fluid {
	position: relative;
	max-width: var(--container-width);
	margin: 0 auto;
	padding: 0 var(--container-padding);
}

.container-wide {
	max-width: 100%;
	padding: 0 50px;
}

.container-fluid {
	max-width: none;
	width: 100%;
	padding: 0;
}


@media screen and (max-width: 1024px) {
	.container-wide {
		padding: 0 var(--container-padding);
	}
}


@media screen and (max-width: 360px) {
html, body {
	--container-padding: 15px;
}

}

/* @end */



/* @group HEADER */

/* HEADER
--------------------------------------------------------------------------------- */


#header {
	position: fixed;
	top: 0;
	width: 100%;
	height: var(--header-height);
	background: transparent;
	display: flex;
	align-items: center;
	z-index: 1;
	border-bottom: 0px solid TAN;
}


#header > .container {
	flex: 1 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border: 0px solid #333;
}



/* Logo */


.logo {
	position: relative;
	flex: 0 0 auto;
	line-height: 1;
	font-size: 42px;
	font-weight: 300;
	z-index: 50;
	transition: 0.5s opacity, 0.5s visibility;
}

.logo span {
	font-family: var(--font-sans-rounded);
	font-weight: 800;
}

.logo a {
	position: relative;
	display: block;
	font-weight: 300;
	text-decoration: none;
	transition: color 250ms ease;
}

.logo__subline {
	position: absolute;
	bottom: 0;
	transform: translateY(100%);
	font-size: 24px;
	font-weight: 500;
	line-height: 1.7;
}


@media screen and (max-width: 1024px) {

	.logo {
		font-size: 32px;
	}

	.logo__subline {
		font-size: 18px;
	}


}

/* @end */



/* @group MENU */

/* MENU
--------------------------------------------------------------------------------- */


.menu {
	position: fixed;
   	top: 0;
   	left: 0;
   	bottom:0;
   	overflow-y: scroll;
	width: 100%;
	width: 100vw;
	z-index: 1;

	display: flex;
	flex-direction: column;
	min-height: 100vh;

	color: var(--text-light-gray);
	background: var(--primary-color);
	background: rgba(56, 56, 56, .95);
	font-size: 24px;
	padding: 56.5px 0 60px 0; /*mind header height and match logo position*/

	opacity: 0;
	visibility: hidden;
	transition: 0.5s opacity, 0.5s visibility;
}

.menu-open .menu {
	opacity: 1;
	visibility: visible;
	transition: 0.5s opacity, 0 0.5s visibility;
}

body.menu-open {
	AUS_overflow:hidden; /*prevent body scoll … but jumps to TOP :( */

}

.menu-open .logo { /*hide and disable home link*/
	opacity: 0;
	visibility: hidden;

}


.menu .container {
	position: relative;
	width: 100%;
	text-align: left;
	display: flex;
	flex-direction: column;
	flex: 1;
}


.menu-logo {
	position: relative;
	flex: 0 0 auto;
	line-height: 1;
	font-size: 42px;
	font-weight: 300;
	AUS_color: CYAN;
}

.menu-logo span {
	font-family: var(--font-sans-rounded);
	font-weight: 800;
}


.menu nav {
	AUS_margin: 80px 0 0 0;
	max-width: 600px;
	border: 0px solid TAN;
}

.menu nav li {
	line-height: 1;
}

.menu nav > ul > li:first-child {
	margin-top: 75px;
}
.menu nav ul li:first-child.very-top { /*add class to first menu item to put it very close to top logo*/
	background: transparent;
	margin-top: -5px;
	margin-bottom: 30px;
	padding-right: 60px;
}

.menu nav li a {
	display: flex;
	justify-content: space-between;
	font-weight: 700;
	text-decoration: underline;
	color: var(--text-light-gray);
	line-height: 1.6;
	padding:  10px 0;
	padding:  5px 0;

	background: rgba(255, 255, 255, .0); /*helper*/
}

.menu nav li a br {
	display: none;
}

.menu nav li:first-child a {
	border-top: 0;
}

.menu nav li a:hover {
	text-decoration: none;
}

.menu nav li.current-menu-item > a {
}

.menu nav li.menu-item-has-children.active > a {
}

.menu nav li.menu-item-has-children > a::after {

}

.menu nav li.menu-item-has-children.active > a::after {
}

.menu nav li.active > a {
	text-decoration: none;
}

.menu li.page-ancestor a { /* page-ancestor … add CSS class to WP menu item*/
	display: flex;
}

.menu li.page-ancestor.current-menu-item a {
}

.menu li.page-ancestor a::after {

}


.menu nav li ul {
	position: relative;
	padding: 0 0 0 30px;
	margin: 0;
	margin-bottom: 5px;
}

.menu nav li li {
	opacity: 1;
	animation: none;
}

.menu nav li li a {
}

.menu nav li li a:hover {
}


.menu-tags {
	display: flex;
	flex-wrap: wrap;
	margin: 50px 0 0 0;
	max-width: 600px;
}


.menu-tags a {
	display: block;
	margin: 0 10px 0 0;
	line-height: 1.5;
	font-weight: normal;
	color: var(--text-light-gray);
}


.menu-bottom {
	margin-top: auto;
	padding-top: var(--vspace);

	color: var(--text-light-gray);
}

.menu-social {
	margin: var(--vspace) 0 0 0 ;
	display: flex;
}

.menu-social a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	font-size: 30px;
	background: var(--text-light-gray);
	border-radius: 100%;
	margin: 0 22px 0 0;
}

.menu-bottom .menu-imprint {
	display: flex;
	flex-wrap: wrap;
	margin-top: 40px;
}

.menu-bottom .menu-imprint a {
	display: block;
	color: var(--text-light-gray);
	margin: 0 22px 0 0;
	text-decoration: underline;
	line-height: 1.6rem;
	font-weight: normal;
}


.menu-bottom .menu-imprint a:hover {
	text-decoration: none;
}


/* Menu Trigger */

.menu-trigger {
	position: relative;
	border: none;
	width: 64px;
	padding: 0;
	height: 56px;
	margin: -10px -10px;
	z-index: 999;
	text-transform: uppercase;
	background: transparent;
	outline: none;
	transition: all 0ms ease;
}

.menu-trigger.open {
}


/* Hamburger Icon ani*/


.menu-trigger span {
	margin: 0 auto;
	position: relative;
}
.menu-trigger span:before,
.menu-trigger span:after {
	position: absolute;
	content: '';
}
.menu-trigger span,
.menu-trigger span:before,
.menu-trigger span:after {
	width: 44px;
	height: 2px;
	background-color: var(--primary-color);
	display: block;
}

.menu-open .menu-trigger span,
.menu-open .menu-trigger span:before,
.menu-open .menu-trigger span:after {
	background-color: var(--text-light-gray);
}

.menu-trigger span:before {
	margin-top: -10px;
}
.menu-trigger span:after {
	margin-top: 10px;
}

.menu-trigger span {
	transition-duration: 0s;
	transition-delay: 0.15s;
}
.menu-trigger.open span {
	background-color: rgba(0,0,0,0.0);
	transition-delay: 0.15s;
}
.menu-trigger span:before {
	transition-property: margin, transform;
	transition-duration: 0.15s;
	transition-delay: 0.15s, 0s;
}
.menu-trigger.open span:before {
	margin-top: 0;
	transform: rotate(45deg);
	transition-delay: 0s, 0.15s;
}
.menu-trigger span:after {
	transition-property: margin, transform;
	transition-duration: 0.15s;
	transition-delay: 0.15s, 0s;
}
.menu-trigger.open span:after {
	margin-top: 0;
	transform: rotate(-45deg);
	transition-delay: 0s, 0.15s;
}

/* end Hambuger Icon ani*/


/* Menu li Animation */

.menu li {
 AUS_opacity: 0;
 }

.menu-open .menu li {
 AUS_animation: fadeLiIn 200ms ease-in-out 1 forwards;
}

.menu li:nth-child(1) {
  animation-delay: 100ms;
}

.menu li:nth-child(2) {
  animation-delay: 200ms;
}

.menu li:nth-child(3) {
  animation-delay: 300ms;
}

.menu li:nth-child(4) {
  animation-delay: 400ms;
}

.menu li:nth-child(5) {
  animation-delay: 500ms;
}

.menu li:nth-child(6) {
  animation-delay: 600ms;
}

.menu li:nth-child(7) {
  animation-delay: 700ms;
}

.menu li:nth-child(8) {
  animation-delay: 750ms;
}


@keyframes fadeLiIn {
0% {
	opacity: 0.0;
	transform: translate(0px,-10px);
}

100% {
	opacity: 1.0;
	transform: translate(0,0);
	}
}



@media screen and (max-width: 1024px) {

	.menu {
		padding-top: 49px;
		padding-bottom: 80px;
		font-size: 18px;
		line-height: 24px;
	}


	.menu-logo {
		font-size: 32px;
	}

	.menu-logo__subline {
		font-size: 18px;
	}

	.menu-trigger {
		margin-top: -12px;
	}

	.menu-open .menu-trigger {
		AUS_margin-top: -6px;
	}

	.menu-open .menu-trigger span,
	.menu-open .menu-trigger span:before,
	.menu-open .menu-trigger span:after {
			width: 32px;
	}


	.menu nav ul li.very-top {
		margin-top: -11px;
		margin-bottom: 25px;
	}


	.menu-tags {
		margin-top: 35px;
	}

	.menu-social a {
		width: 40px;
		height: 40px;
		font-size: 25px;
}


	.menu-bottom .menu-imprint{
		margin-top: 30px;
	}


}




/* @end */



/* @group CONTENT */

/* CONTENT
--------------------------------------------------------------------------------- */

#content {
	position: relative;
	flex: 1 0 auto; /*sticky footer*/
}


main {
	display: block; /*IE*/
	margin-top: var(--header-height);
	padding-top: 0;
	padding-top: var(--main-padding-top);
	padding-bottom: var(--main-padding-bottom);
}


.aligndefault {
	max-width: var(--aligndefault-width);
	AUS_margin-left: auto;
	AUS_margin-right: auto;
}

.alignsemiwide {
	max-width: var(--alignsemiwide-width);
}

.alignwide {
	max-width: 100%;
}

.alignfull {
    margin-left  : calc( -100vw / 2 + 100% / 2 );
    margin-right : calc( -100vw / 2 + 100% / 2 );
    max-width    : 100vw;
}


/* @end */

/* @group EDITOR STYLES */


/* WP core styles
--------------------------------------------------------------------------------- */


/* Alignment */

.aligncenter,div.aligncenter {
	display: block;
	margin: 5px auto 5px auto;
}

.alignright {
	float: right;
	margin: 5px 0 20px 20px;
}

.alignleft {
	float: left;
	margin: 5px 20px 20px 0;
	margin: 5px 1.4rem 1.4rem 0;
}

.aligncenter {
	display: block;
	margin: 5px auto 5px auto;
}

a img.alignright {
	float: right;
	margin: 5px 0 1.4rem 1.4rem;
}

img.alignnone,
a img.alignnone {
	margin: 0;
	padding: 0;
}

a img.alignleft {
	float: left;
	margin: 5px 1.4rem 1.4rem 0;
}

a img.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}


@media screen and (max-width: 600px) {
.alignleft,
.alignright,
a img.alignleft,
a img.alignright {
	float: none;
	margin-left: 0;
	margin-right: 0;
}

}

/* Caption */

.wp-caption-text {
	font-size: 16px;
	line-height: 24px;
	color: var(--text-color);
	padding: 8px 0 0 10px;
}

figure.wp-caption  {
	display: table;
	max-width: 100%;
	margin-top: 2rem;
}

figure.wp-caption figcaption {
	display: table-caption;
	caption-side: bottom ;
}

figure.wp-caption img {
	display: block;
}


@media screen and (max-width: 1024px) {

	.wp-caption-text {
		font-size: 14px;
		line-height: 22px;
	}

}


@media screen and (max-width: 600px) {

	.wp-caption-text {
		font-size: 10px;
		line-height: 16px;
	}

}




/* Edit Link */

a.post-edit-link {
	position: relative;
	display: inline-block;
	font-size: 10px;
	line-height: 11px;
	padding: 8px 12px;
	text-transform: uppercase;
	text-decoration: none;
	background: #0073AA;
	color: #FFF;
	border-radius: 0px;

	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 100;
}


/* editor elements */


/* === Lists */

ul,
ol {
	margin-top: var(--vspace);
	margin-top: calc(var(--vspace) - 10px);

}

ul {
	padding-left: 1.0rem;
	list-style-type: none;
}

li {
	position: relative;
	margin: 0 0 5px 0;
}

ul li::before {
	position: absolute;
	content: "•";
	margin: 0.0rem 0 0 -1.0rem;
	font-weight: 700;
}

ol {
	padding-left: 1.5rem;
}


.list-unstyled,
.list-unstyled li {
	padding: 0;
	margin: 0;
	list-style: none;
}

.list-unstyled li:before {
	display: none;
}

/* list styles */


.list-style.line ul li:before {
	display: none;
}

.list-style.line ul,
.list-style.line ul li {
	padding-left: 0;
}

list-style.line ul li {
	padding: 0.5rem 0;
	margin-bottom: 0.2rem;
	border-bottom: 1px solid rgba(67, 0, 43, 0.3);
}

.list-style.line ul li:last-child {
	border-bottom: none;
}



/* === Icons */


i { /* IE */
	font-family: 'icons';
    -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}



/* === Embeds, iFrames  */


iframe {
  margin-top: 2rem;
}

iframe.googlemap {
	width: 100%!important;
	height: 400px;
}


iframe.googlemap.size-1 { height: 300px;}
iframe.googlemap.size-2 { height: 400px;}
iframe.googlemap.size-3 { height: 600px;}


.embed-responsive {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
  margin-top: 2rem;
}

.embed-responsive iframe,
.embed-responsive object,
.embed-responsive embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
}


/* === Shortcodes / Quicktags  */

.text-large {
	font-size: 120%;
}

.text-small {
	font-size: 11px;
	font-size: 0.8em;
	line-height: 150%;
	margin-bottom: 2rem;
}

.text-quote {
	position: relative;
	margin: 3rem auto;
	max-width: 550px;
	font-style: normal;
	font-size: 140%;
	font-weight: bold;
	color: var(--primary-color);
}


.text-quote strong {
	font-weight: normal;
}

.text-quote p:last-of-type {
	margin-bottom: 0;
}

.text-quote .cite {
	font-size: 0.8rem;
	font-style: normal;
	font-weight: bold;
	display: block;
	margin: 0.5rem 0 0 0;
	font-family: var(--font-sans);
	font-weight: 700;
	color: var(--text-gray);
}


.box {
	font-size: 0.95rem;
	padding: 1.5rem;
	margin-top: var(--vspace);
	border-radius: 0;
	background: #FFF;

}

.box > * {
	--vspace: 1.0rem;
}

.box > *:first-child {
	margin-top: 0;
}

.box p:empty {
	display: none;
}

.box-important {
	background: transparent;
	border: 1px solid RED;
}

i.icon {
	font-weight: normal!important;
}

.icon.download {
	font-size: 1.9rem;
	color: var(--link-color);
	margin: 0 5px 5px 0;
	vertical-align: middle;
	display: inline-block;
}

.icon.download:before {
	margin: 0;
}

.icon.bullet {
	font-size: 85%;
}



/* === Tables */

.table-container {
	margin-top: var(--vspace);
	position: relative;
	width: 100%;
	overflow: scroll;
	width: calc(100% + 30px); /*enable overflow on right side */
	padding-right: 30px;
}


table {
	width: 100% !important; /*override inline td width*/
	max-width: 100%;
}

table thead {
	border-bottom: 3px solid var(--border-color);
}

table thead td {
	font-weight: bold;
}

table tr {
	background: transparent;
	border-bottom: 1px solid var(--border-color);
}

table tr:last-child {
	border-bottom: none;
}

table tr th {
}

table tr td {
	padding: 0.9rem 0.0rem 0.7rem 0.0rem;
	padding-right: 1rem;
}

table tr td:last-child {
}


table p {
	margin: 0;
}



/* === Buttons */


.btn {
	text-transform: uppercase;
	padding: 0.8rem 1.8rem;
	font-weight: bold;
	font-size: 13px;
	font-size: .9rem;
	display: inline-flex;
	color: #FFF;
	letter-spacing: .3px;
	background: var(--primary-color);
	border: none;
}

.btn:hover {
	color: #FFF;
	background: var(--link-color-hover);
}

/* @end */

/* @group CONTENTBLOCKS */

/* CONTENTBLOCKS - FLEX CONTENT
--------------------------------------------------------------------------------- */


/* General */

main .contentblock:first-child {
	margin-top: 0;
}

.contentblock > *:first-child {
	margin-top: 0;
}

.contentblock > *:last-child {
	margin-bottom: 0;
}

.contentblock {
	margin-top: var(--block-vspace);

	max-width: var(--aligndefault-width); /*default width*/
	AUS_margin-left: auto;
	AUS_margin-right: auto;

	border: 0px dashed #ddd; /*helper*/
}

.contentblock.alignsemiwide {
	max-width: var(--alignsemiwide-width);
}

.contentblock.alignwide {
	max-width: 100%;
}

.contentblock.alignfull {
    margin-left  : calc( -100vw / 2 + 100% / 2 );
    margin-right : calc( -100vw / 2 + 100% / 2 );
    max-width    : 100vw;
}


.pagebanner + .contentblock {
	margin-top: 0;
}



/* Text
--------------------------------------------------------------------------------- */


.contentblock-text {
	AUS_margin-top: calc(var(--block-vspace) - 1rem);
}


/* Text-Columns
--------------------------------------------------------------------------------- */


.contentblock-text-columns {
}

@media screen and (max-width: 768px) {

.contentblock-text-columns [class*="col-"]:last-child  {
	margin-top: var(--vspace);
}


}




/* Image
--------------------------------------------------------------------------------- */


.contentblock-image {
}

.contentblock-image + .contentblock-image {
	margin-top: var(--vspace);
}

.contentblock-image img.size-large {
	display: block;
	width: 100%;
}


.contentblock-image figure {
	margin: 0;
}

.contentblock-image figure.alignright {
	float: right;
	text-align: right;
}

.contentblock-image figure.alignright img {
	display: block;
	float: right;
}

.contentblock-image figure.alignright a {
	float: right;
}

.contentblock-image figure.alignright figcaption {
	clear: both;
}

.contentblock-image figure.aligncenter {
	text-align: center;
}

.contentblock-image figure.aligncenter img {
	margin: 0 auto;
}



/* Image-Text
--------------------------------------------------------------------------------- */


.contentblock-imagetext {
}

.imagetext {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 80px;
}


.imagetext.image-w33 {
	grid-template-columns: 1fr 2fr;
}

.imagetext.image-w25 {
	grid-template-columns: 1fr 3fr;
}


.imagetext__image {
	width: 100%;
}

.imagetext__image img {
	display: block;
	width: 100%;
}

.imagetext__text {
}

.imagetext__text > *:first-child {
	margin-top: 0;
}

.imagetext.image-alignright {
}

.imagetext.image-alignright .imagetext__image {
	order: 2;
}

/* image widths */
.imagetext.image-w100 {
	grid-template-columns: 1fr;
}

.imagetext.image-w50 .imagetext__image {

}

.imagetext.image-w33 .imagetext__image {
}

.imagetext.image-w25 .imagetext__image {
}


/* has custom aspect ratio */
.imagetext__image.has-ratio figure {
	position: relative;
}

.imagetext__image .ratio-wrap {
	position: relative;
}

.imagetext__image.ratio-1-1 .ratio-wrap { padding-top: 100%; }
.imagetext__image.ratio-4-3 .ratio-wrap { padding-top: 75%; }
.imagetext__image.ratio-3-2 .ratio-wrap { padding-top: 66.66%; }
.imagetext__image.ratio-16-9 .ratio-wrap { padding-top: 56.25%; }

.imagetext__image.has-ratio .image-wrap {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

.imagetext__image.has-ratio img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	margin: 0 auto;
}


@media screen and (max-width: 1024px) {
	.imagetext {
		gap: 40px
	}

	/*alignwide image that stacks*/
	.alignwide .imagetext.image-w50 {
		grid-template-columns: 1fr;
		gap: var(--vspace);
	}

}


@media screen and (max-width: 600px) {
	.imagetext {
		gap: var(--vspace) 0;
	}

	/* image goes full width*/
	.imagetext.image-w50 {
		grid-template-columns: 1fr;
	}

	/* image stacks */
	.imagetext.image-w33,
	.imagetext.image-w25  {
		grid-template-columns: 1fr;
	}

	.imagetext.image-w33 .imagetext__image {
		max-width: 50%;
	}

	.imagetext.image-w25 .imagetext__image {
		max-width: 40%;
	}

	/* image bottom */
	.imagetext.image-valignbottom .imagetext__image {
		order: 2;
	}

}




/* Gallery
--------------------------------------------------------------------------------- */


.contentblock-gallery {
}

.gallery {
	--gallery-gap: 30px;
	display: flex;
	flex-wrap: wrap;
	margin-left: -30px; /*offset gap*/
	margin-left: calc(var(--gallery-gap) * -1); /*  offset gap */
	margin-bottom: calc(var(--gallery-gap) * -1)!important; /*  minus the gap */;
}

.gallery__item {
	position: relative;
	flex: 0 0 auto;
	width: calc(100% / 3); /*default 3 colums*/
	overflow: hidden;
	display: flex;
	flex-direction: column;
	padding: 0px 0 var(--gallery-gap) var(--gallery-gap) ; /*gap*/
}

.gallery.columns-1 .gallery__item { width: calc(100% / 1); }
.gallery.columns-2 .gallery__item { width: calc(100% / 2); }
.gallery.columns-3 .gallery__item { width: calc(100% / 3); }
.gallery.columns-4 .gallery__item { width: calc(100% / 4); }
.gallery.columns-5 .gallery__item { width: calc(100% / 5); }
.gallery.columns-6 .gallery__item { width: calc(100% / 6); }


@media screen and (max-width: 1024px) {

.gallery.columns-2 .gallery__item { width: calc(100% / 1); }
.gallery.columns-3 .gallery__item { width: calc(100% / 2); }
.gallery.columns-4 .gallery__item { width: calc(100% / 2); }
.gallery.columns-5 .gallery__item { width: calc(100% / 3); }
.gallery.columns-6 .gallery__item { width: calc(100% / 3); }

}

@media screen and (max-width: 600px) {

.gallery.columns-3 .gallery__item { width: calc(100% / 1); }
.gallery.columns-4 .gallery__item { width: calc(100% / 1); }
.gallery.columns-5 .gallery__item { width: calc(100% / 2); }
.gallery.columns-6 .gallery__item { width: calc(100% / 2); }

}


.gallery.gap-zero {
	--gallery-gap: 0;
}

.gallery__item .ratio-wrap {
	flex: 0; /*1*/
	display: flex;
}

.gallery__item .image-wrap {
	flex: 1;
}

.gallery__item a {
	display: block;
	height: 100%;
}

.gallery__item  img {
	display: block;
	margin: 0;
	width: 100%;
}


/* gallery cropped */
.gallery__item.is-cropped  {
	flex: 1 0 auto; /* images in last row take remaining space*/
}

.gallery__item.is-cropped  img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	margin: 0 auto;
}

/* gallery has custom aspect ratio */
.gallery__item.has-ratio .ratio-wrap {
	position: relative;
}

.gallery__item.ratio-1-1 .ratio-wrap { padding-top: 100%; }
.gallery__item.ratio-4-3 .ratio-wrap { padding-top: 75%; }
.gallery__item.ratio-3-2 .ratio-wrap { padding-top: 66.66%; }
.gallery__item.ratio-16-9 .ratio-wrap { padding-top: 56.25%; }


.gallery__item.has-ratio .image-wrap {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

.gallery__item.has-ratio img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	margin: 0 auto;
}

.gallery__item figcaption {
}

@media screen and (max-width: 1024px) {

	.gallery {
		--gallery-gap: 16px;
	}

}


/* -- Gallery Masonry */


.gallery-masonry {
	display: block;
	background: lightblue;
}

.gallery-masonry:after {
	content: '';
	display: block;
	clear: both;
}

.gallery-masonry__item {
	display: block;
	float: left;
}

.gallery-masonry__item a {
	display: block;
}





/* Video
--------------------------------------------------------------------------------- */


.contentblock-video {
}


/* Google-Map
--------------------------------------------------------------------------------- */

.contentblock-google-map {
}



/* Accordion
--------------------------------------------------------------------------------- */


.contentblock-accordion {
}

.accordion {
	border-bottom: 1px solid #000;
}

.accordion-item {
	position: relative;
	overflow: hidden;
	border: none;
	margin-bottom: -1px
}

.accordion-item:last-child {
	margin-bottom: 0;
}

.accordion-item:first-of-type {
	margin-top: 0;
}

.accordion-heading {
	margin: 0;
	padding: 0;
	border: none;
	text-transform: none;
}

.accordion-trigger {
	display: block;
	position: relative;
	border: none;
	text-align: left;
	width: 100%;
	padding: 1rem 0;
	padding-right: 3.0rem;
	font-size: 1rem;
	color: var(--link-color);
	background: transparent;
	border-top: 1px solid var(--text-color);
	font-weight: bold;
    outline-offset: -5px;
	transition: all 300ms ease;
}

.accordion-trigger:hover {
	text-decoration: none;
}

.accordion-trigger.active {
}

.accordion-trigger:hover,
.accordion-trigger:hover i {
}

.accordion-trigger:hover i {
	text-decoration: none;
}

.accordion-trigger i:after {
	position: absolute;
	top: 1.0rem;
	right: 0;
	margin: 0;
	content: "+";
	display: block;
	line-height: 1;
	border-radius:0;
	font-size: 1.0rem;
	font-weight: normal;
	font-style: normal;
	color: var(--link-color);
	text-decoration: none;
	transition: all 250ms ease-in-out;
}

 .accordion-trigger.active i:after {
	transform: rotate(180deg);
}

.accordion-content {
	position: relative;
	padding: 0 0 2.5rem 0;
}

.accordion-content > *:first-child {
	margin-top: 0;
}




/* Slider
--------------------------------------------------------------------------------- */


.contentblock-slider .swiper-container {
	padding-bottom: 40px; /*space for pagination-bullets*/
}

.contentblock-slider .swiper-wrapper {
     height:auto!important;
}

.contentblock-slider .swiper-slide {
	display: flex;
	justify-content: center;
	width: auto;
}

.contentblock-slider img {
	display: block;
	width: auto;
	height: 800px; /*the height*/
	height:  clamp(300px, 60vw, 800px);
	min-height: 50vh;
}



/* @end */

/* @group BANNER */


/* BANNER
--------------------------------------------------------------------------------- */


.banner {
	position: relative;
	max-height: 1000px; /*the height*/
	display: flex;
	justify-content: center;
	margin-top: calc(var(--main-padding-top) * -1); /*  minus the main top padding*/
	margin-bottom: var(--main-padding-top);
}

.banner__bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	z-index: 0;
}

.banner__bg img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top center;
	margin: 0 auto;
	opacity: 1;
	transform: scale(1.2);
	filter: blur(50px);
}

.banner__image {
	position: relative;
}

.banner__image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	margin: 0 auto;
	opacity: 1;
}


.lazy-img {
	transition: all 400ms ease;
	opacity: 0;
}

.lazy-img--loaded {
	opacity: 1;
}

@media screen and (max-width: 1024px) {

	.banner {
		max-height: 500px; /*the height*/
	}

}


@media screen and (max-width: 600px) {

	.banner {
		max-height: 100vw; /*the height*/
	}

}

/* @end */


/* @group PROJECT */

/* PROJECT
--------------------------------------------------------------------------------- */


/* --- Entries */

.entry-grid { /*via ALM masonry*/
}


.grid-item {
}

.entry {
}

.entry a {
	display: block;
}

.entry__image {
	margin-bottom: 30px;
}

.entry__image img {
	display: block;
	width: 100%;
}


.entry__content {
	padding-bottom: 95px;
}

.entry__title {
	margin: 0;
	font-size: 24px;
	font-weight: 700;
	line-height: 30px;
}

.entry__subtitle {
	font-size: 24px;
	line-height: 30px;
}

.entry__client {
	margin: 3px 0 3px 0;
	font-style: italic;
	font-size: 16px;
	line-height: 1.5;
}

.entry__tags {
	display: flex;
	flex-wrap: wrap;
	font-size: 16px;
	line-height: 22px;
}

.entry__tags a {
	color: var(--text-gray);
	text-decoration: underline;
	margin: 0 10px 0 0;
	font-weight: normal;
}

.entry__tags a:hover {
	color: var(--text-color);
}


/* Masonry (Ajax Load More plugin)*/


.ajax-load-more-wrap {
	margin-top: 20px;
	padding: 0 var(--container-padding);
	border: 0px solid #333;
}

.ajax-load-more-wrap .alm-listing {
	margin-left: -30px; /*offset horizontal gap*/
}

.ajax-load-more-wrap .alm-listing .grid-item {
	width: calc(100%/3 - 30px); /*3 oder 4*/
	margin: 0;
	margin-left: 30px; /*horizontal gap*/
	border: 0px solid BLUE;
}

.alm-btn-wrap {
	text-align: center;
}

.alm-btn-wrap button {
	margin: 0;
	AUS_margin-top: var(--vspace);
	position: relative;
	border: none;
	font-size: 1rem;
	padding: 0;
	outline: none;
	line-height: 1;
	overflow: hidden;
	width: 56px;
	height: 56px;
	border-radius: 100%;
	text-indent: -500px;
	background: #FFF;
	AUS_transition: all 200ms ease;
	box-shadow: 10px 10px 0px 0px rgba(0,0,0, .2);
}

.alm-btn-wrap button:active {
	box-shadow: 10px 10px 0px 0px rgba(0,0,0, 0);
	transform: translate(10px, 10px);
}


.alm-btn-wrap button i { /*icon*/
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	transition: all 300ms ease;
	transform: rotate(0deg);
	background: transparent url(images/icon-load-more.svg) no-repeat center;
}

.alm-btn-wrap button:hover i {
	AUS_transform: rotate(90deg);
}

.alm-btn-wrap button.loading {
	opacity: 0;
}

.alm-btn-wrap button.done {
	display: none;
}



@media screen and (max-width: 1280px) {

	.ajax-load-more-wrap .alm-listing .grid-item {
		width: calc(100%/3 - 16px);
		margin-left: 16px; /*horizontal gap*/
	}

}

@media screen and (max-width: 1024px) {

	.entry__image {
		margin-bottom: 20px;
	}

	.entry__content {
		padding-bottom: 70px;
	}

	.entry__title,
	.entry__subtitle {
		font-size: 16px;
		line-height: 22px;
	}

	.entry__client,
	.entry__tags {
		font-size: 12px;
		line-height: 1.5;
	}

}


@media screen and (max-width: 900px) {

	.ajax-load-more-wrap .alm-listing {
		margin-left: 0;
	}

	.ajax-load-more-wrap .alm-listing .grid-item {
		width: 100%;
		margin: 0;
	}
}



/* --- Entry Single */


.entry-post__header {
	padding: 5px 0;
}


.entry-post__client {
	font-style: italic;
	font-size: 20px;
	line-height: 40px;
}

.entry-post__tags {
	display: flex;
	flex-wrap: wrap;
	font-size: 20px;
	line-height: 1.5;
	margin: 5px 0 0 0;
}

.entry-post__tags a {
	color: var(--text-gray);
	text-decoration: underline;
	margin: 0px 10px 0 0;
	font-weight: normal;
}

.entry-post__tags a:hover {
	color: var(--text-color);
}


@media screen and (max-width: 1024px) {

	.entry-post__client,
	.entry-post__tags {
		font-size: 16px;
		line-height: 28px; /*24*/
	}

}


@media screen and (max-width: 600px) {

	.entry-post__client,
	.entry-post__tags {
		font-size: 12px;
		line-height: 22px;
	}

}



/* --- Related Entries */


.related-entries {
	margin-top: var(--vspace-xl);
	AUS_margin-bottom: calc(var(--main-padding-bottom) * -1); /*  minus the main top padding*/
	margin-bottom: -90px;
	max-width: var(--aligndefault-width); /*default width*/
}

.related-entries__grid {
	margin-top: 20px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 30px;
}

.related-entries .entry__content {
}


@media screen and (max-width: 1024px) {

	.related-entries__grid {
		gap: 0 16px;
	}

}


@media screen and (max-width: 600px) {

	.related-entries__grid {
		margin-top: 20px;
		grid-template-columns: 1fr;
		gap: 0 30px;
	}

}


/* @end */



/* @group 404 */


/* 404
--------------------------------------------------------------------------------- */


.error404 {

}

.error404 .logo {
	filter: blur(5px);
}

.error404 #content {
	height: 100vh;
}


/* @end */




/* @group PW protected */

/* PW Protected
--------------------------------------------------------------------------------- */


.post-password-form {
	text-align: center;
	padding: 30px;
	background: var(--primary-bg);
}

.post-password-form p {
	display: none;
}

.post-password-form p + p {
	display: block;
	margin: 0;
}

.post-password-form input {
	font-size: 1rem;
	padding: 10px;
	max-width: 100%;
	border: 1px solid var(--border-color);
}

.post-password-form input[type="submit"] {
	display: none;
}

/* @end */


/* @group FORMS */

/* FORMS (contact form 7)
--------------------------------------------------------------------------------- */


.wpcf7 {
	position: relative;
}

.wpcf7-form {
	position: relative;
	margin: 0 auto;
	overflow: visible;
	display: flex;
	justify-content: center;
	max-width: 1000px;
}

.wpcf7-form .form-wrap {
	max-width: 760px; /*main width*/
	margin: 0 auto;
	overflow: hidden;
}

.wpcf7-form .main {
	margin: 0 auto;
}


.wpcf7 hr {
	margin: 1.0rem 0 1.5rem 0;
	border-color: rgba(0,0,0, .2);
}

.wpcf7 br {
	display: none;
}

.wpcf7 .fieldset {
	overflow: hidden;
}

.wpcf7 .form-field {
	margin-bottom: 0.8rem;
	z-index: 1;
}


.wpcf7 .form-field:focus-within label,
.wpcf7 .form-field.select-focus label {
}

.wpcf7 label {
	padding: 0 0;
	width: auto;
	text-transform: none;
	font-weight: 300;
	font-size: 0.9rem;
	padding-right: 10px;
	margin: 0 0 0.3rem 0;
	display: inline-block;
	text-align: left;
	line-height: 140%;
	cursor: default;
	transition: all 350ms ease;
	color: var(--text-color);
}

.wpcf7 label span {
	display: inline;
	font-size: 0.8rem;
	padding-left: 5px;
	text-transform: none;
}


.wpcf7 .row {
	margin-left: -10px;
	margin-right: -10px;
}

.wpcf7 .row-pflichtangaben {
	margin-bottom: 0.5rem;
	font-size: 0.6rem;
	text-align: right;
	text-transform: uppercase;
	color: #999;
}

.wpcf7 .row-submit {
}

.wpcf7 .row.response {
	margin-bottom: 0;
}

.wpcf7 [class*=col-] {
	padding: 0 10px;
}


.wpcf7 .form-field-desc {
	font-size: 0.8rem;
	line-height: 150%;
	color: #666;
	margin: -0.1rem 0 0.3rem 0;
}


.wpcf7 span {
	position: relative;
	display: block;
	width: 100%;
	font-size: 0.9rem;
	flex: 0;
}

.wpcf7 input.wpcf7-text,
.wpcf7 input.wpcf7-quiz,
.wpcf7-text,
.wpcf7 textarea,
.wpcf7 select,
.wpcf7 .select-styled,
.wpcf7-date,
.wpcf7-number,
.wpcf7-captchar,
.wpcf7-file,
.wpcf7-email {
	padding: 1.0rem;
	font-size: 1.0rem;
	line-height: 1.3;
	color: var(--text-color);
	background: #FFF;
	width: 100%;
	box-sizing: border-box;
	border: none;
	border-radius: 0;
	-webkit-appearance: none;
	font-family: var(--sans);
	font-weight: normal;
	border: none;
	border: 1px solid var(--border-color);

	transition: all 300ms ease;
}


.wpcf7-text { /*safari - get same height as select-styled */
	max-height: 3.6rem;
}


.wpcf7 select,
.wpcf7 .select-styled {
}



.wpcf7 input:focus,
.wpcf7 textarea:focus {
	border-color: rgba(0,0,0, .5);

}

input::-webkit-input-placeholder,
input::-moz-placeholder,
input::-ms-input-placeholder,
input::-moz-placeholder {
}


.wpcf7 textarea {
	max-height: 250px;
	line-height: 150%;
	width: 100%;
}


.wpcf7 select {
  -webkit-appearance: none;
}

.wpcf7-recaptcha {
	 overflow: hidden;
	 margin-bottom: 0.5rem;
}


.wpcf7 .label-desc {
	margin-top: -2px;
	padding-bottom: 5px;
	font-size: 0.8rem;
	line-height: 140%;
	color: #888;
}



.wpcf7 .form-field-info {
	font-size: .85rem;
	line-height: 140%;
	margin:  0.3rem 0 1rem 0;
}


.wpcf7 .form-field--submit {
	margin: 0;
}


.wpcf7 .submit {
	clear: both;
}


.wpcf7 .submit-btn-wrap {
	position: relative;
	display: block;
}


.wpcf7 input.wpcf7-submit {

}

.wpcf7 input.wpcf7-submit:hover {
}

.wpcf7 input.wpcf7-submit:active {
}


.wpcf7 .ajax-loader {
	transform: translateX(45%);
	display: block;
	background: transparent;
	margin-right: -30px!important;
	AUS_visibility: visible!important;

}

.wpcf7 .response {
	position: relative;
}

.wpcf7 .invalid .wpcf7-response-output {
	display: block;
	font-size: 0.9rem;
	padding: 1rem;
	margin: 1rem 0 0 0;
	clear: both;
	position: relative;
	text-align: left;
	background: #FFF;
}

.wpcf7 .wpcf7-response-output.wpcf7-validation-errors {
	border-color: transparent;
	color: RED;
	text-align: center;
}

.wpcf7 .wpcf7-form.sent {
	background: transparent;
}


.wpcf7 .sent .wpcf7-response-output {
	padding: 4rem 2rem;
	margin: 1rem 1rem;
	text-align: center;
	background: transparent;
	color: var(--primary-color);
	font-size: 1.0rem;
	font-weight: bold;
	border: none;
	background: #FFF;
	box-shadow: 0px 5px 30px -10px rgba(0,0,0, .2);
}



.wpcf7 span.wpcf7-not-valid-tip {
	background: red;
	color: #FFF;
	display: none;
}


.not-valid label {
	color: RED;
}

.wpcf7 input.wpcf7-not-valid,
.wpcf7 textarea.wpcf7-not-valid,
.wpcf7 select.wpcf7-not-valid {
	border-color: RED;
}


.wpcf7 .field-note {
	font-size: 0.7rem;
}


.wpcf7 .pflichtfeld-hinweis {
	text-align: right;
	font-size: 0.7rem;
	color: #666;
	text-transform: uppercase;
	display: none;
}

/* Checkbox & Radiobuttons */

.wpcf7 .wpcf7-radio {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
    justify-content: left;
    align-content: flex-start;
}

.wpcf7 input[type="radio"] {
	-webkit-appearance: radio;
	-moz-appearance: radio;
}

.wpcf7 input[type="checkbox"] {
	-webkit-appearance: checkbox;
	-moz-appearance: checkbox;
}

.wpcf7-radio .wpcf7-list-item,
.wpcf7-checkbox .wpcf7-list-item,
.wpcf7-acceptance .wpcf7-list-item  {
  	margin: 0 0 0 0;
  	width: auto;
}

.wpcf7-radio input,
.wpcf7-checkbox input,
.wpcf7-acceptance input {
	display: none; /*custom*/
}

.wpcf7-radio label,
.wpcf7-checkbox label,
.wpcf7-acceptance label {
	color: #333;
	margin: 0;
	padding: 0;
	display: block;
	cursor: pointer;
}

.wpcf7-radio .wpcf7-list-item-label,
.wpcf7-checkbox .wpcf7-list-item-label {
	display: block;
	line-height: 130%;
	font-size: 1rem;
	text-transform: none;
	font-weight: bold;
	padding: 5px 0;
	padding-right: 30px;
	color: #333;
	transition: all 300ms ease;
	display: flex;
	align-items: center;
}

.wpcf7-radio .wpcf7-list-item-label:hover,
.wpcf7-checkbox .wpcf7-list-item-label:hover,
.wpcf7-acceptance .wpcf7-list-item-label:hover {
}

.wpcf7-radio .wpcf7-list-item-label:before,
.wpcf7-checkbox .wpcf7-list-item-label:before {
	content: "";
	width: 26px;
	height: 26px;
	background: #FFF;
	border: 1px solid var(--border-color);
	opacity: 1;

	position: relative;
	display: block;
	margin: 0 10px 0 0;
}


.wpcf7-radio .wpcf7-list-item-label:before {
	border-radius: 50%;
}



.wpcf7-radio .wpcf7-list-item-label:after,
.wpcf7-checkbox .wpcf7-list-item-label:after {
	content: "";
	position: absolute;
	top: 11px;
	left: 6px;
	width: 14px;
	height: 14px;
	background: var(--primary-color); /*the point*/
	opacity: 0;
	transition: all 300ms ease;
}

.wpcf7-radio .wpcf7-list-item-label:after {
	border-radius: 50%;
}

.wpcf7-radio input:checked + .wpcf7-list-item-label,
.wpcf7-checkbox input:checked + .wpcf7-list-item-label,
.wpcf7-acceptance input:checked + .wpcf7-list-item-label {
}

.wpcf7-radio input:checked + .wpcf7-list-item-label:before,
.wpcf7-checkbox input:checked + .wpcf7-list-item-label:before
.wpcf7-acceptance input:checked + .wpcf7-list-item-label:before {
	border-color: #999;
}

.wpcf7-radio input:checked + .wpcf7-list-item-label:after,
.wpcf7-checkbox input:checked + .wpcf7-list-item-label:after,
.wpcf7-acceptance input:checked + .wpcf7-list-item-label:after {
	opacity: 1;

}


.wpcf7-radio.wpcf7-not-valid .wpcf7-list-item-label:before,
.wpcf7-checkbox.wpcf7-not-valid .wpcf7-list-item-label:before,
.wpcf7-acceptance.wpcf7-not-valid .wpcf7-list-item-label:before {
	border-color: RED;
}


/* Checkbox Acceptance (Datenschutz) */

.wpcf7-acceptance .wpcf7-list-item-label:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 26px;
	height: 26px;
	border-radius: 0;
	background: #FFF;
	border: 1px solid #DDD;
	opacity: 1;
}


.wpcf7-acceptance .wpcf7-list-item-label:after {
	content: "";
	position: absolute;
	top: 4px;
	left: 4px;
	width: 18px;
	height: 18px;
	border-radius: 0;
	background: var(--primary-color); /*the point*/
	opacity: 0;
	transition: all 300ms ease;
}


.wpcf7-acceptance .wpcf7-list-item-label {
	position: relative;
	display: block;
	padding: 0 0 0 40px;
	font-weight: normal;
	font-size: 0.8rem;
	line-height: 150%;
	letter-spacing: 0;
	color: var(--text-color);
}


.wpcf7 .form-field--datenschutz {
	margin: 0 0 2rem 0;
}

.wpcf7 .form-field--datenschutz > label {
  display: none;
}

.wpcf7-acceptance span a {
	font-weight: bold;
}

.wpcf7-acceptance span a:hover {
	color: #999;
}


/* https://codepen.io/chriscoyier/pen/zYYZaGP */

select {
	display: block;
	font-size: 16px;
	font-family: var(--font-sans);
	font-weight: normal;
	color: var(--text-color);
	line-height: 1;
	padding: 0 1.8em 0 1em;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	margin: 0;
	border: 1px solid var(--border-color);
	box-shadow: 0 3px 10px -5px rgba(0,0,0, .1);
	border-radius: 5px;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	transition: all 200ms ease;
	background-color: #fff;

	height: 2.5rem; /*global input height*/

	/* for the icon, if you want to change the color, be sure to use `%23` instead of `#`, since it's a url. You can also swap in a different svg icon or an external image reference
	*/
	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23333333%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E');
	background-repeat: no-repeat, repeat;
	/* arrow icon position (1em from the right, 50% vertical) , then gradient position*/
	background-position: right .7em top 50%, 0 0;
	/* icon size, then gradient */
	background-size: 0.6em auto, 100%;
}
select::-ms-expand {
	display: none;
}
select:hover {
	border-color: #888;
}
.select-css:focus {
	border-color: #aaa;
	/* It'd be nice to use -webkit-focus-ring-color here but it doesn't work on box-shadow */
	box-shadow: 0 0 0 3px -moz-mac-focusring;
	color: #333;
	outline: none;
}

select option {
	font-weight: normal;
}

/* Disabled styles */
select:disabled, select[aria-disabled=true] {
	opacity: .5;
}

/* @end */

/* @group SWIPEBOX LIGHTBOX */

/* Swipebox Lightbox
--------------------------------------------------------------------------------- */


#swipebox-slider {
	cursor: auto!important;
}


#swipebox-overlay {
	transition: background 500ms ease;
	AUS_background: BROWN!important;
	AUS_background: transparent!important;

}

#swipebox-container #swipebox-top-bar {
	top: auto;
	bottom: -50px!important;
	transform: translate3d(0,-50px,0)!important;
	opacity: 1;
	height: auto;
	line-height: 1.6;
	padding: 20px 60px;
	background: transparent;
	background: rgba(0,0,0, 0);
	border:0px solid RED;
}

#swipebox-container #swipebox-title {
	font-family: var(--font-sans);
	text-shadow: none;
	font-weight: normal;
	font-size: 0.8rem;
	max-width: 100%;
	color: #FFF;
}

#swipebox-container #swipebox-bottom-bar {
	top: 50%;
	background: transparent;
    pointer-events:none;
}

#swipebox-container #swipebox-bottom-bar.visible-bars {
	transform: none!important;
}

#swipebox-container #swipebox-arrows {
	max-width: 100%;
	width: 100vw;
	margin: 0;
    pointer-events: auto;
	background: TAN;
	height: 0;
}

#swipebox-arrows a {
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: none!important;
	background: transparent;
    pointer-events: auto;
}

#swipebox-arrows a#swipebox-prev {
}

#swipebox-arrows a#swipebox-next {
}

#swipebox-arrows a:after {
	font-family: 'icons';
	font-size: 1.7rem;
	text-shadow: none;
	color: #FFF;
}

#swipebox-arrows a#swipebox-prev:after {
	content: "\ebcf";
}

#swipebox-arrows a#swipebox-next:after {
	content: "\ebd0";
}


#swipebox-close {
	display: flex;
	justify-content: center;
	align-content: center;
	top: 30px!important;
	right: calc(var(--container-padding) - 10px)!important;
	background: transparent!important;
}

#swipebox-close::after {
	content: "\ebe3";
	font-family: 'icons';
	font-size: 1.5rem;
	text-shadow: none;
	color: #FFF;
	line-height: 2.5;
}

#swipebox-overlay img {
	max-height: 90vh!important;
	max-height: calc(90vh - 60px)!important; /*space for caption*/
	max-width: 80vw!important;
    filter: drop-shadow(0px 0px 10px rgba(0,0,0,.2));
}

#swipebox-slider .slide-loading {
	background: transparent!important; /*remove gif ani*/
}

#swipebox-slider .slide {
	position: relative;
}

#swipebox-slider .slide:after { /*loading ani*/
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%);
	width: 40px;
	height: 40px;
	background: var(--secondary-color);
	AUS_background: RED;
	border-radius: 100%;
	z-index: -1;
	animation: swipeboxLoadingAni 1.0s infinite ease-in-out;
}

@keyframes swipeboxLoadingAni {
  0% {
    transform: scale(0);
  } 100% {
    transform: scale(1.0);
    opacity: 0;
  }
}


#swipebox-arrows a:after,
#swipebox-close::after {
	color: #FFF;
}



@media screen and (max-width: 600px) {
	#swipebox-close {
		top: 28px!important;
		right: calc(var(--container-padding) - 14px)!important;
	}

	#swipebox-close::after {
		font-size: 1.3rem;
	}


	#swipebox-arrows a:after {
		font-size: 1.5rem;
	}
}

/* @end */


/* @group FOOTER */

/* FOOTER
--------------------------------------------------------------------------------- */



#footer {
	position: sticky;
	top: 0;
	height: 100vh;
	overflow-y: scroll;

	width: 100%;
	padding: 60px 0 60px 0;
	color: var(--text-light-gray);
	background: rgba(44, 25, 25, .5); /*test*/
	background: var(--primary-color);
	font-size: 24px;
	line-height: 30px;
	--vspace: 0.9rem;
	z-index: 10;
	display: flex;
	flex-direction: column;
}


.menu-open #footer {
	z-index: 0;
}

.footer-top {

}


.footer-logo {
	font-weight: 300;
	font-size: 42px;
	margin-bottom: 1.5rem;
}

.footer-logo span {
	font-family: var(--font-sans-rounded);
	font-weight: 800;
}

.footer-logo__subline {
	font-size: 24px;
	font-weight: 500;
	line-height: 1.7;
}


.footer-contact a,
.footer-menu a {
	color: var(--text-light-gray);
	text-decoration: underline;
	font-weight: normal;
}

.footer-contact a:hover,
.footer-menu a:hover {
	text-decoration: none;
}

.footer-bottom {
	margin-top: auto;
	padding-top: var(--vspace);
}

.footer-social {
	margin: var(--vspace) 0 0 0 ;
	display: flex;
}

.footer-social a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	font-size: 30px;
	background: var(--text-light-gray);
	border-radius: 100%;
	margin: 0 22px 0 0;
}

.footer-menu {
	display: flex;
	flex-wrap: wrap;
	margin-top: 50px;
}

.footer-menu li a {
	display: block;
	color: var(--text-light-gray);
	margin: 0 22px 0 0;
	line-height: 1.3rem;

}

@media screen and (max-width: 1024px) {

	#footer {
		font-size: 18px;
		line-height: 24px;
	}

	.footer-logo {
		font-size: 32px;
	}

	.footer-logo__subline {
		font-size: 18px;
	}


	.footer-bottom {
	}

.footer-social a {
	width: 40px;
	height: 40px;
	font-size: 25px;
}


	.footer-menu {
		margin-top: 30px;
		margin-bottom: 30px;
	}

}


@media screen and (max-width: 600px) {

}

/* @end */



/* @group BORLABS COOKIE */

/* Borlabs Cookie Banner
--------------------------------------------------------------------------------- */




#BorlabsCookieBox.BorlabsCookie ._brlbs-block-content {
}


#BorlabsCookieBox.BorlabsCookie ._brlbs-box-wrap {
    max-width: 100%!important;
    width: 100%;
}

#BorlabsCookieBox ._brlbs-box {

}

#BorlabsCookieBox ._brlbs-flex-center {
	display: block!important;
}


#BorlabsCookieBox.BorlabsCookie ._brlbs-bar,
#BorlabsCookieBox.BorlabsCookie ._brlbs-box {
	AUS_background: #FF0000;
	AUSbackground: rgba(255,0,0, .81); /*BG helper*/

	padding: 0;
	padding-bottom: 50px;
	height: 100vh;
	width: 100%;
	font-size: 24px; /*base size*/
	border-radius: 0;

	AUS_overflow-y: scroll;
	max-height: 100vh;
	border: 0px solid LIME;

}


@media screen and (max-width: 1024px) {
	#BorlabsCookieBox.BorlabsCookie ._brlbs-bar,
	#BorlabsCookieBox.BorlabsCookie ._brlbs-box {
			font-size: 18px; /*base size*/
	}
}


#BorlabsCookieBox.BorlabsCookie .cookie-box {
	max-width: 800px;
	border: 0px solid YELLOW;
}



#BorlabsCookieBox.BorlabsCookie ._brlbs-box .container {
	max-width: 100%;
	max-height: auto;
	margin: 0;
	padding: 0 var(--container-padding);
	border: 0px solid #333;
}


#BorlabsCookieBox.BorlabsCookie .cookie-box .container {
}

#BorlabsCookieBox.BorlabsCookie .cookie-box ._brlbs-btn {
	font-size: 18px;
	background: transparent;
	padding: 0;
	text-align: left;
	color: #882222;
}

#BorlabsCookieBox.BorlabsCookie .cookie-box ._brlbs-accept {
	text-align: left;
}


#BorlabsCookieBox.BorlabsCookie .cookie-box ._brlbs-btn._brlbs-btn-accept-all,
#BorlabsCookieBox.BorlabsCookie .cookie-box #CookieBoxSaveButton  {
	background: #FFF;
	color: var(--text-color);
	font-weight: 700;
	font-size: 24px;
	padding: 15px 30px;
	line-height: 1;
	width: auto;
	border-radius: 100px;
	display: inline-flex;
	justify-content: center;
	text-decoration: none;
	box-shadow: 10px 10px 0px 0px rgba(0,0,0, .2);
}


#BorlabsCookieBox.BorlabsCookie .cookie-box ._brlbs-btn._brlbs-btn-accept-all:active{
		transform: translate(10px, 10px);
		box-shadow: 10px 10px 0px 0px rgba(0,0,0, .0);
}

#BorlabsCookieBox.BorlabsCookie .cookie-box #CookieBoxSaveButton {

}

@media screen and (max-width: 1024px) {

	#BorlabsCookieBox.BorlabsCookie .cookie-box ._brlbs-btn {
		font-size: 18px;
	}

	#BorlabsCookieBox.BorlabsCookie .cookie-box ._brlbs-accept {
    	text-align: center;
	}

}

#BorlabsCookieBox.BorlabsCookie .cookie-box ul { /*checkboxes*/
	display: flex;
	flex-direction: column;
	margin-bottom: 5vh;
}


#BorlabsCookieBox.BorlabsCookie .cookie-box ul li {
	padding: 10px 0;
	margin: 5px 0;
}

#BorlabsCookieBox.BorlabsCookie .cookie-box ul li label._brlbs-checkbox {
	line-height: 1;
}

#BorlabsCookieBox.BorlabsCookie a {
	text-decoration: underline;
}

#BorlabsCookieBox.BorlabsCookie a:hover {
	text-decoration: none;
}

#BorlabsCookieBox.BorlabsCookie ._brlbs-btn  {
	border-radius: 100px;
	font-size: 24px;
}

#BorlabsCookieBox.BorlabsCookie .cookie-box ._brlbs-manage {
	margin-top: 5vh;
	text-align: left;
}

#BorlabsCookieBox.BorlabsCookie ._brlbs-legal {
	margin: 0 0 50px 0;
	text-align: left;
}


@media screen and (max-width: 1024px) {
	#BorlabsCookieBox.BorlabsCookie .cookie-box ._brlbs-manage {
		text-align: center;
	}

	#BorlabsCookieBox.BorlabsCookie ._brlbs-legal {
		text-align: center;
	}
}





/* - cookie-preference  */

#BorlabsCookieBox.BorlabsCookie .cookie-preference {
	border: 0px solid purple;
	max-width: 800px;
}

#BorlabsCookieBox.BorlabsCookie .cookie-preference .container.not-visible {
	min-height: 100vh;
	opacity: 0;
}

#BorlabsCookieBox.BorlabsCookie .cookie-preference ._brlbs-accept {
	text-align: left;
}

#BorlabsCookieBox.BorlabsCookie .cookie-preference ._brlbs-refuse {
	text-align: right;
	margin: 0 0 10px 0;
}

#BorlabsCookieBox.BorlabsCookie .cookie-preference ._brlbs-btn {
	background: transparent;
	padding: 0;
	box-shadow: none;
	color: #FFF;
	text-decoration: underline;
	font-weight: 700;
	margin: 10px 10px 20px 0;
}


#BorlabsCookieBox.BorlabsCookie .cookie-preference ._brlbs-btn:hover {
	text-decoration: none;
}



#BorlabsCookieBox.BorlabsCookie .cookie-preference .bcac-item {
	background: transparent;
	padding: 10px 0;
	border-top: 1px solid rgba(0,0,0, .2);
}

#BorlabsCookieBox.BorlabsCookie .cookie-preference .bcac-item:last-child {
	margin-bottom: 80px;
}

#BorlabsCookieBox.BorlabsCookie .cookie-preference .bcac-item a {
	text-align: left;
}


#BorlabsCookieBox.BorlabsCookie span#CookieBoxTextHeadline {
	word-break: normal;
	width: 100%;

}

#BorlabsCookieBox.BorlabsCookie .cookie-logo-head {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: var(--header-height);

	/*
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	padding: 0 var(--container-padding);
	border: 1px solid #333;
	*/
}

#BorlabsCookieBox.BorlabsCookie .cookie-logo-wrap {
	position: relative;
}

#BorlabsCookieBox.BorlabsCookie .cookie-logo {
	color: #FFF;
	font-size: 42px;
	font-weight: 300;
	white-space: nowrap;
}

#BorlabsCookieBox.BorlabsCookie .cookie-logo span {
	font-family: var(--font-sans-rounded);
	font-weight: 800;
}

#BorlabsCookieBox.BorlabsCookie .cookie-logo-title {
	position: absolute;
	bottom: 0;
	font-weight: 500;
	font-size: 24px;
	line-height: 1;
	white-space: nowrap;
	transform: translateY(100%);
}


@media screen and (max-width: 1024px) {

	#BorlabsCookieBox.BorlabsCookie .cookie-logo {
		font-size: 32px;
	}

	#BorlabsCookieBox.BorlabsCookie .cookie-logo-title {
		font-size: 18px;
	}

}


#BorlabsCookieBox.BorlabsCookie #CookieBoxTextDescription,
#BorlabsCookieBox.BorlabsCookie #CookiePrefDescription  {
	color: #FFF;
	padding: 0;
	margin: 30px 0 30px 0;
}



.BorlabsCookie ._brlbs-content-blocker {
	display: flex;
	justify-content: center;
	padding: 0;
}

.BorlabsCookie ._brlbs-content-blocker ._brlbs-embed {
	width: 100%;
	margin: 0!important;
}


.BorlabsCookie ._brlbs-content-blocker img {
	width: 100%;
	display: block;
}

.video-embed-wrap .BorlabsCookie {
	margin-bottom: -56.5%; /*minus the ratio*/
}

.BorlabsCookie input[type=checkbox] {
	-webkit-appearance: checkbox;
	-moz-appearance: checkbox;
	appearance: checkbox;
}




/* @end */


/* @group ACCESSIBILITY */

/* ACCESSIBILITY */


.sr-only {
	position: absolute;
	width: .0625rem;
	height: .0625rem;
	padding: 0;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	border: 0;
}

.sr-only-focusable {
	transition: all 0s ease;
}

.sr-only-focusable:focus {
	position: static;
	width: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	clip: auto;
}

/* @end */


/* @group ANIMATIONS */

/* ANIMATIONS
---------------------------------------------------------------------------------*/


/*  https://github.com/daneden/animate.css */


.animated {
	animation-duration: 1s;
	animation-fill-mode: both;
	animation-timing-function: ease-in-out;
}

.animated.infinite {
	animation-iteration-count: infinite;
}


@-webkit-keyframes zoomIn {
  0% {
    opacity: 0;
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}


@-webkit-keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

@keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

.fadeIn {
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }

  100% {
    opacity: 1;
    transform: none;
  }
}



@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }

  100% {
    opacity: 1;
    transform: none;
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
   transform: translate3d(0, -100%, 0);
  }

  100% {
    opacity: 1;
    transform: none;
  }
}

.fadeInDown {
	animation-name: fadeInDown;
}


@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }

  100% {
    opacity: 1;
	transform: none;
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }

  100% {
    opacity: 1;
    transform: none;
  }
}

.fadeInUp {
  animation-name: fadeInUp;
}

/* @end */



/* ------------------------------------------------------------------------------

MEDIA QUERIES

---------------------------------------------------------------------------------*/


@media screen and (max-width: 1280px) {
body:after {
	content: "<1280";
	position: fixed;
	top: 0;
	line-height: 1;
	padding: 5px;
	font-size: 11px;
	background: lawngreen;
	z-index: 1000;
	opacity: .8;

	display: none; /* AN/AUS*/
}

}


@media screen and (max-width: 1024px) {
body:after {
	content: "<1024";
	background: TAN;
}


}


@media screen and (max-width: 768px) {
body:after {
	content: "<768";
	background: PINK;
}

}


@media screen and (max-width: 600px) {
body:after {
	content: "<600";
	background: YELLOW;
}

}


@media screen and (max-width: 360px) {
body:after {
	content: "<360";
	background: MAGENTA;
}


}




/* END
---------------------------------------------------------------------------------*/
