@font-face {
    font-family: 'Roboto';
    font-weight: 400;
    src: url(../fonts/Roboto-Regular.ttf);
}
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    src: url(../fonts/Roboto-Italic.ttf);
}
@font-face {
    font-family: 'Roboto';
    font-weight: 500;
    src: url(../fonts/Roboto-Medium.ttf);
}
@font-face {
    font-family: 'Roboto';
    font-weight: 700;
    src: url(../fonts/Roboto-Bold.ttf);
}
@font-face {
    font-family: 'Roboto';
    font-weight: 900;
    src: url(../fonts/Roboto-Black.ttf);
}

:root {
	--zm-fx1-border-width:	2px;
	--zm-main-padding: 24px;
}
	

body {
    font-family: 'Roboto', sans-serif;
    margin: 40px auto;
}

/* wp-defaults */
.alignnone { margin: 5px 20px 20px 0; }
.aligncenter, div.aligncenter { display: block; margin: 0 auto 5px auto; }
.alignright { float:right; margin: 5px 0 20px 20px; }
.alignleft { float: left; margin: 5px 20px 20px 0; }

a img.alignright { float: right; margin: 5px 0 20px 20px; }
a img.alignnone { margin: 5px 20px 20px 0; }
a img.alignleft { float: left; margin: 5px 20px 20px 0; }
a img.aligncenter { display: block; margin-left: auto; margin-right: auto; }

.wp-caption { background: #fff; border: 1px solid #f0f0f0; max-width: 96%; padding: 5px 3px 10px; text-align: center; }
.wp-caption.alignnone { margin: 5px 20px 20px 0; }
.wp-caption.alignleft { margin: 5px 20px 20px 0; }
.wp-caption.alignright { margin: 5px 0 20px 20px; }

/* header */
.logo_main img { width: calc(100vw / 1.5); height: auto; }
header#site-header, #top-navigation-navbar { padding-left: 0; padding-right: 5px; }

/* main */
h1 {
    font-size: 40px;
    font-family: 'Roboto';
    font-weight: bold;
    color: var(--zm-text-colour);
    text-transform: none;
    margin: 0;
}

h1.less_pressure{
    font-size: 56px;
    font-family: 'Roboto';
    font-weight: 900;
    text-transform: uppercase;
    color: var(--zm-text-colour);
}

h2{
    font-size: 40px;
    font-family: 'Roboto';
    font-weight: 500;
    color: var(--zm-text-colour);
    text-align: center;
    margin: 0;
}
h3 {
    font-size: 32px;
    color: var(--zm-text-colour);
    font-family: 'Roboto';
    font-weight: 700;
    margin: 0;
}
h4 {
    font-size: 24px;
    color: var(--zm-ci-dark-colour);
    font-family: 'Roboto';
    font-weight: 700;
    margin: 0;
}
h5 {
    font-size: 20px;
    color: var(--zm-text-colour);
    text-decoration: none;
    font-weight: 400;
    margin: 0;
}
h6 {
    font-size: 16px;
    color: var(--text);
    font-weight: 500;
    margin: 0;
}

.headline {
	margin-bottom: 1.8rem;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.headline::after {
  display: block;
  content: "";
  width: 10rem;
  height: .25rem;
  border-radius: .125rem;
  background-color: var(--zm-ci-dark-colour);
}

a.zm_default_maxwidth, button.zm_default_maxwidth {
	width: 100%;
	max-width: 100%;
	display: inline-block;
}

a.zm_default, button.zm_default {
    border: var(--zm-ci-dark-colour) 2px solid ;
    background-color: transparent;
    border-radius: 8px;
    font-size: 18px;
    font-family: 'Roboto';
    padding: 6px 36px;
    text-decoration: none;
	color: var(--zm-ci-dark-colour);
	position: relative;
}

a.zm_default:hover, button.zm_default:hover {
    background-color: var(--zm-ci-dark-colour);
    color: var(--zm-background-colour);
}

a.zm_default_inverse, button.zm_default_inverse {
    border: var(--zm-ci-dark-colour) 2px solid ;
    background-color: transparent;
    border-radius: 8px;
    font-size: 18px;
    font-family: 'Roboto';
    padding: 6px 36px;
	background-color: var(--zm-ci-dark-colour);
	color: var(--zm-background-colour);
    text-decoration: none;
}

a.zm_default_inverse:hover, button.zm_default_inverse:hover {
    background-color: transparent;
	color: var(--zm-text-colour);
}

a.zm_download, button.zm_download { padding: 6px 18px 6px 40px; text-align: center; }

.zm_download::before { content: ""; display: block; position: absolute; top: calc((100% - 22px)/2); left: 20px; background: url(../assets/download.svg) top left no-repeat; width: 20px; height: calc( 100% - 10px); z-index: 100; fill: #ffff; }
.zm_download:hover::before { fill: #ffffff; color: var(--zm-background-colour); }


input.search-field { border: #6c757d 1px solid; border-right: none;  }

body main#site-content { 
	background-color: var(--zm-background-colour); 
	padding: var(--zm-main-padding) var(--zm-main-padding); 
	border-top: var(--zm-fx1-border-width) solid var(--zm-ci-dark-colour);
	border-bottom: var(--zm-fx1-border-width) solid var(--zm-ci-dark-colour);
    border-radius: var(--zm-fx1-border-width);
}

a { color: var(--zm-ci-colour); }
a:hover { color: var(--zm-ci-colour); }

#header-top-navigation { padding: .5em; }

/* nav */
ul#menu-header-menu { display: flex; }
ul#menu-header-menu li > a { display: inline-block; width: 100%; padding: 8px 24px;  }
ul#menu-header-menu > li.menu-item { border-radius: 2px; }
ul#menu-header-menu > li.current-menu-item,
ul#menu-header-menu > li.current-menu-parent > ul > li.current-menu-item,
.dropdown-item.active, .dropdown-item:active { color: var(--zm-ci-colour); background-color: var(--zm-ci-light-colour); }

ul#menu-header-menu > li.current-menu-parent {  }
ul#menu-header-menu > li.current-menu-parent > a { color: var(--zm-ci-colour); }

ul.navbar-nav { }
.navbar { display: block; }
.nav-link, .nav-link.show, .nav-link:visited, .nav-link:active { font-size: 1.2em; color: var(--zm-text-colour); border-radius: 2px; }
ul#menu-header-menu > li.menu-item > .nav-link:hover { color: var(--zm-ci-colour); background-color: var(--zm-ci-light-colour); }
.navbar-toggler-icon { color: var(--zm-ci-colour);  }
.navbar-toggler:focus { text-decoration: none; outline: 0; box-shadow: none; }


/* article */
article.post-card { padding: 10px; }
article.post-card .entry-content { display: flex; flex-direction: column; gap: 24px; }
article.post-card .entry-content > a { text-decoration: none; color: var(--zm-text-colour); }
article.post-card .entry-content > main > a { text-decoration: none; }
article.post-card .entry-content > footer { color: var(--zm-text-light-colour); }

article.post-card .entry-content header { 
	padding: 0; 
	position: relative; 
	transition: all 0.15s ease-in-out;
	border: var(--zm-fx1-border-width) solid transparent;
}


article.post-card .entry-content:hover { cursor: pointer; }


/* single post */
article.single-post { }
article.single-post .author-content { margin: 2rem 0; color: var(--zm-text-light-colour); }
article.single-post .author-content a, article.post-card .author-content a { color: var(--zm-text-light-colour); text-decoration: none; }
article.single-post .entry-content { margin: 2rem 0; }
article.single-post .entry-content .single-post-headline { margin-bottom: 2rem; }

.client-card > .entry-content { display: flex; flex-direction: column; background: #fff; height: 100%; border: 1px solid var(--zm-ci-light-colour); gap: 24px; padding: 6px;  }
.client-card > .entry-content { text-align: center; box-shadow: 2px 2px var(--zm-ci-light-colour); border-radius: 8px; }
.client-card > .entry-content > header { min-height: 180px;padding: 12px 0;  }
.client-card > .entry-content > main { min-height: 50px; }
.client-card > .entry-content > footer { padding: 12px 0; }

.post-archive h1 { margin: 2rem auto; }
.archive-nav-pagination > a { text-decoration: none; font-size: 3.4em; }


.additional-posts { padding-top: calc( var(--zm-main-padding) * .5); margin-left: calc( var(--zm-main-padding) * -.5); margin-right: calc( var(--zm-main-padding) * -.5); margin-top: 1em; }
.without-padding { margin: calc( var(--zm-main-padding) * -1) calc( var(--zm-main-padding) * -1); }

.nav_btn { display: inline-block; width: 42px; height: 42px; background: url(../assets/pfeil.svg) center center no-repeat; background-size: cover; }
.archive_navigation_prev_btn {  }
.archive_navigation_next_btn { rotate: 180deg; }

.search-description { color: #b8b8b9; }
.search-row {  }
.search-result { cursor: pointer; }
.search-entry { border-bottom: 1px solid #b8b8b9; }
.search-entry::last-child {  border-bottom: none; }
/* navbar toggle */

.navbar-toggler_strike, .navbar-toggler_sidewinder, .navbar-toggler_center, .navbar-toggler_edge {
  width: 40px;
  height: 30px;
  align-self: center;
  padding-left: 0.55rem;
  position: relative;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

.navbar-toggler_strike span, .navbar-toggler_center span, .navbar-toggler_edge span {
  display: block;
  position: absolute;
  height: 6px;
  width: 100%;
/*  margin: 0.35rem 0.35rem;*/
  background: var(--zm-ci-colour);
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

/* strikes */

.navbar-toggler_strike span:nth-child(1) {
  top: 0px;
}

.navbar-toggler_strike span:nth-child(2) {
  top: 10px;
}

.navbar-toggler_strike span:nth-child(3) {
  top: 20px;
}

.navbar-toggler_strike.open span:nth-child(1) {
  top: 18px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}

.navbar-toggler_strike.open span:nth-child(2) {
  opacity: 0;
  left: -60px;
}

.navbar-toggler_strike.open span:nth-child(3) {
  top: 18px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}

/* to the sides */

.navbar-toggler_sidewinder {
}

.navbar-toggler_sidewinder span {
  display: block;
  position: absolute;
  height: 9px;
  width: 50%;
  background: var(--cicolor);
  opacity: 1;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

.navbar-toggler_sidewinder span:nth-child(even) {
  left: 50%;
  border-radius: 0 9px 9px 0;
}

.navbar-toggler_sidewinder span:nth-child(odd) {
  left:0px;
  border-radius: 9px 0 0 9px;
}

.navbar-toggler_sidewinder span:nth-child(1), .navbar-toggler_sidewinder span:nth-child(2) {
  top: 0px;
}

.navbar-toggler_sidewinder span:nth-child(3), .navbar-toggler_sidewinder span:nth-child(4) {
  top: 18px;
}

.navbar-toggler_sidewinder span:nth-child(5), .navbar-toggler_sidewinder span:nth-child(6) {
  top: 36px;
}

.navbar-toggler_sidewinder.open span:nth-child(1),.navbar-toggler_sidewinder.open span:nth-child(6) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

.navbar-toggler_sidewinder.open span:nth-child(2),.navbar-toggler_sidewinder.open span:nth-child(5) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.navbar-toggler_sidewinder.open span:nth-child(1) {
  left: 5px;
  top: 7px;
}

.navbar-toggler_sidewinder.open span:nth-child(2) {
  left: calc(50% - 5px);
  top: 7px;
}

.navbar-toggler_sidewinder.open span:nth-child(3) {
  left: -50%;
  opacity: 0;
}

.navbar-toggler_sidewinder.open span:nth-child(4) {
  left: 100%;
  opacity: 0;
}

.navbar-toggler_sidewinder.open span:nth-child(5) {
  left: 5px;
  top: 29px;
}

.navbar-toggler_sidewinder.open span:nth-child(6) {
  left: calc(50% - 5px);
  top: 29px;
}

/* from the center */

.navbar-toggler_center span:nth-child(1) {
  top: 0px;
}

.navbar-toggler_center span:nth-child(2),.navbar-toggler_center span:nth-child(3) {
  top: 18px;
}

.navbar-toggler_center span:nth-child(4) {
  top: 36px;
}

.navbar-toggler_center.open span:nth-child(1) {
  top: 18px;
  width: 0%;
  left: 50%;
}

.navbar-toggler_center.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

.navbar-toggler_center.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.navbar-toggler_center.open span:nth-child(4) {
  top: 18px;
  width: 0%;
  left: 50%;
}

/* from the edges */

.navbar-toggler_edge {
}

.navbar-toggler_edge span:nth-child(1) {
  top: 0px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

.navbar-toggler_edge span:nth-child(2) {
  top: 18px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

.navbar-toggler_edge span:nth-child(3) {
  top: 36px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

.navbar-toggler_edge.open span:nth-child(1) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  top: -3px;
  left: 8px;
}

.navbar-toggler_edge.open span:nth-child(2) {
  width: 0%;
  opacity: 0;
}

.navbar-toggler_edge.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 39px;
  left: 8px;
}




/* footer */
footer#site-footer {
    display: flex;
    flex-direction: column;
}
.footer-col { display: flex; flex-direction: column; padding: 24px; }

.subfooter-col { text-align: center; color: var(--zm-text-light-colour);  }
.subfooter-col a { text-decoration: none; color: var(--zm-text-light-colour); }

/* media queries */
@media (min-width: 992px) {
	.logo_main img { width: calc(100vw / 4); height: auto; }
	main#site-content { padding: 56px 48px; }
	ul#menu-header-menu { display: flex; gap: 24px; }
	.navbar { display: flex; }
}

/* animation */
@-webkit-keyframes navigationbarslidetop {
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1;
        transform: none;
    }
}
@keyframes navigationbarslidetop {
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
		transform: none;
        opacity: 1;
    }
}


.slideout {
	padding: 0.5em;
	-webkit-animation:navigationbarslidetop 0.2s forwards;;
	animation: navigationbarslidetop 0.2s forwards;;
}

.pace {
	-webkit-pointer-events: none;
	pointer-events: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.pace-inactive {
	display: none;
}

.pace .pace-progress {
	background: var(--cicolor);
	position: fixed;
	z-index: 2000;
	top: 0;
	right: 100%;
	width: 100%;
	height: 2px;
}