/*
Theme Name: lehrer
*/



/* CHANGE TELEMENTS IN STYLE.CSS AND GUTENBERG.CSS */
/* ------------------------------------------------*/
/* fullwidth elements */
.alignfull {
	position: relative;
	flex-shrink: 0;
	left: calc(((100vw - 100%)/2)*-1);
	width: 100vw;
}
/* remove column of text+image element on mobile  */
@media (max-width: 768px) {
	.wp-block-media-text {
		display: block;
	}
	.wp-block-media-text__content {
		padding: 1em 0 0 0 !important;
	}
}
/* CHANGE TELEMENTS IN STYLE.CSS AND GUTENBERG.CSS */
/* ------------------------------------------------*/

/* background colors */
.has-primary-background-color {background-color: #036CBD !important; color: #fff;}
.has-secondary-background-color {background-color: #000 !important; color: #fff;}
.has-tertiary-background-color {background-color: #fff !important; color: #000;}
.has-quatenary-background-color {background-color: #FFF003 !important; color: #000;}
.has-quinary-background-color {background-color: #CD2C99 !important; color: #000;}
/* text colors */
.has-primary-color {color: #036CBD !important;}
.has-secondary-color {color: #000 !important;}
.has-tertiary-color {color: #fff !important;}
.has-quatenary-olor {color: #FFF003 !important;}
.has-quinary-color {color: #CD2C99 !important;}

.has-primary-background-color .wp-block-button__link,
.has-secondary-background-color .wp-block-button__link {
	border: 2px solid #fff;
	background: transparent !important;
}

@font-face {
	font-family: 'Work Sans';
	src: url('fonts/WorkSans-VariableFont_wght.ttf') format("truetype");
	font-weight: 1 999;
	font-display: swap;
}


/**  typography
------------------------------------------------------------- **/
html {
	font-variant-ligatures: none;
	text-rendering: optimizeLegibility;
	-moz-osx-font-smoothing: grayscale;
}
body {
	font-family: "Work Sans",Arial,sans-serif;
	font-size: 20px;
	font-weight: 300;
	line-height: 1.5;
	color: #000;
}
b,strong {font-weight: 600;}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
	color: #87C0E8 !important;
}
h1,h2,h3,h4,h5,h6 {
	font-weight: 600;
	font-family: "Work Sans", sans-serif;
	line-height: 1.2em;
}
h1 {
	display: block;
	letter-spacing: 0;
	color: #000;
}
h2 {
	color: #000;
}
.content p,
.content ul {margin-bottom: 0.5em;}
.content > p:first-of-type {
	margin: 0;
}
p:empty {margin: 0;}

ul.wp-block-latest-posts__list li:before {
	content: none;
}
ul.wp-block-latest-posts__list > li > a {
	text-decoration: none !important;
	font-weight: 600;
}

@media (max-width: 768px) {
	body {font-size: 17px;}
}



/*images*/
.alignright {margin-left: 20px;}
.alignleft {margin-right: 20px;}

blockquote {
  /* background: url('img/wirbel.png') no-repeat center right 20px transparent; */
  /* background-size: 60px; */
  margin: 3em 0;
  /* quotes: "\201C""\201D"; */
  border: 2px solid #39546a;
  padding: 1.5em;
}
blockquote p {
	display: inline;
}
hr {
	border: none;
}
figure {
	margin: 0;
}
figure > img {
	display: block;
}
.wp-block-image {
	margin-bottom: 0;
}

/**  base template
------------------------------------------------------------- **/

* {
	box-sizing: border-box;
}

body, html {
	margin: 0;
	padding: 0;
	overflow-x: hidden;
	scroll-behavior: smooth;
}

.content {
	position: relative;
}

/* images */
img {
	max-width: 100%;
	height: auto;
	/* display: block; */
}
.aligncenter, dl.aligncenter, .html5-captions .wp-caption.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

a:link,
a:visited,
a:hover,
a:active {
	/*text-decoration: none;*/
	color: #000;
	/* border-bottom: 1px solid #000; */
}
/* .main a:link,
.main a:visited,
.main a:hover,
.main a:active {
	text-decoration: underline;
} */

.icons a:link,
.icons a:visited,
.icons a:hover,
.icons a:active {
	border-bottom: none;
} 

/* site width */
.max-size {max-width: 1200px; margin: 0 auto; padding: 0 1em; overflow: visible; /*position: relative;*/}
/* footer immer unten */
.site-container {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}
.site-container > .main {
	flex: 1;
}

body.home .site-container > .main .content {
	margin: 0 0;
}

@media all and (-ms-high-contrast:none) {
	.site-container {
		display: block;
	}
}

video::-webkit-media-controls-panel {
   background-image: none !important;
   filter: brightness(0.4);
}
.content-header {
	/* max-height: 500px;
	min-height: 300px; */
	height: 300px;
	overflow: hidden;
	position: relative;
	flex-shrink: 0;
	left: calc(((100vw - 100%)/2)*-1);
	width: 100vw;
	max-width: none;
	z-index: -1;
	background: #ccc no-repeat center center;
	background-size: cover;
}
@media all and (max-width:600px) {
	.content-header {
		height: 250px;
	}
	header.mainheader a.logo img {
		height: 130px;
	}
}	




.attachment-header-image {
	width: 100%;
	height: auto;
	position: relative;
}
.content-inner {
	background: #fff;
	margin-top: -100px;
	padding: 2em 3em;
}
@media (max-width: 768px) {
	.content-inner {
		padding: 0.5em 1em;
	}
}
.home .content .title {
	display: none;
}

/**
------------------------------------------------------------- **/
div[class^="post-"],
.post,
article {
	position: relative;
}

a.post-edit-link {
	opacity: 0.2; padding: 0 5px; text-transform: uppercase; display: inline-block; color: #000; position: absolute; bottom: 0; right: 0;
	font-size: 0; width: 25px; height: 25px; background: url('img/icon-edit.svg') no-repeat center center #ccc;
	background-size: 18px; z-index: 100000;
	border-bottom: none;
}
a.more-link { color: #000; border: none !important; position: relative;}
a.more-link:hover { color: #000 !important;}
a.more-link:before {content: '... ' ; border: none !important;}
hr {clear: both; height: 0; border: 0; border-bottom: 1px solid #405468; margin: 2em 0;}

img.centered {
	margin: 0 auto;
}
.wp-caption {width: 100% !important;}


/**  header
------------------------------------------------------------- **/
header.mainheader {
	/* background: #fff; */
	overflow: visible;
	width: 100%;
	z-index: 1000;
	position: relative;
}
header.mainheader {
	position: absolute;
}
header.mainheader a{
	text-decoration: none;
}
header.mainheader a.logo {
	display: block;
}
header.mainheader a.logo img {
	width: 200px;
	margin-left: -20px;
}
@media (min-width: 900px) {
	header.mainheader {
		/* background: #fff; */
		overflow: visible;
		width: 100%;
		z-index: 1000;
		/* position: relative; */
		/* box-shadow: 0px 0px 12px -2px rgba(0,0,0,0.43); */
		/* min-height: 80px; */
	}
}
header.mainheader a.logo .description {
	color: #000;
	line-height: 1em;
	font-size: 14px;
	display: block;
	letter-spacing: 1px;
}
@keyframes draw {
	0% { clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%); }
	100% { clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); }
}
#strokes #stroke-1,
#strokes #stroke-2,
#strokes #stroke-3,
#strokes #stroke-4,
#strokes #stroke-5,
#strokes #stroke-6 {
	clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
	animation-name: draw;
	animation-duration: 0.5s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}
#strokes #stroke-1 {animation-delay: 0.0s;}
#strokes #stroke-2 {animation-delay: 0.5s;}
#strokes #stroke-3 {animation-delay: 1.0s;}
#strokes #stroke-4 {animation-delay: 1.5s;}
#strokes #stroke-5 {animation-delay: 2.0s;}
#strokes #stroke-6 {animation-delay: 1.5s;}

@keyframes blink {
	0% { opacity: 0; }
	1% { opacity: 1; }
	100% { opacity: 1; }
}
#text #lehrer #a,
#text #lehrer #b,
#text #lehrer #c, 
#text #lehrer #d, 
#text #lehrer #e, 
#text #lehrer #f, 
#text #lehrer #g,
#text #lehrer #h,
#text #lehrer #i {
	opacity: 0;
	animation-name: blink;
	animation-duration: 0.5s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;	
}
#text #lehrer #a {animation-delay: 0.1s}
#text #lehrer #b {animation-delay: 0.2s}
#text #lehrer #c {animation-delay: 0.3s}
#text #lehrer #d {animation-delay: 0.4s}
#text #lehrer #e {animation-delay: 0.5s}
#text #lehrer #f {animation-delay: 0.6s}
#text #lehrer #g {animation-delay: 0.7s}
#text #lehrer #h {animation-delay: 0.8s}
#text #lehrer #i {animation-delay: 0.9s}


#text #werden #j,
#text #werden #k,
#text #werden #l, 
#text #werden #m, 
#text #werden #n, 
#text #werden #o, 
#text #werden #p {
	opacity: 0;
	animation-name: blink;
	animation-duration: 0.5s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;	
}
#text #werden #j {animation-delay: 1.1s}
#text #werden #k {animation-delay: 1.2s}
#text #werden #l {animation-delay: 1.3s}
#text #werden #m {animation-delay: 1.4s}
#text #werden #n {animation-delay: 1.5s}
#text #werden #o {animation-delay: 1.6s}
#text #werden #p {animation-delay: 1.7s}
/**  menu
------------------------------------------------------------- **/
.menu-toggle:after {
	content: '';
	position: absolute;
	z-index: -1;
	top: -8px;
	right: -8px;
	background: #006CB7;
	width: calc(100% + 16px);
	height: calc(100% + 18px);
	border-radius: 100px;
}
.menu-toggle {
	display: block;
	cursor: pointer;
	position: absolute;
	right: 1em;
	top: 20px;
	width: 20px;
	height: 20px;
	z-index: 300;
} 
.menu-container {
	display: none;
}
.menu-container {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 200;
	background: #036CBD;
}
.menu-container ul {
	display: block;
	text-align: center;
	padding: 0;
}
.menu-container ul li {
	display: block;
	margin: 0;
	position: relative;
}
.menu-container ul li a {
	color: #fff;
	border: none;
	line-height: 1.7em;
	text-transform: uppercase;
	font-size: 2em;
}
.menu-container ul.sub-menu li a {
	font-size: 1em;
}
.show-menu {
	overflow: hidden;
}
.show-menu .menu-container {
	display: flex;
	/* align-items: center; */
	justify-content: center;
	overflow-x: hidden;
    overflow-y: auto;
}
/* animated menu icon */
.menu-toggle span, .menu-toggle span:before, .menu-toggle span:after {
	cursor: pointer;
	border-radius: 1px;
	height: 2px;
	width: 100%;
	background: #fff;
	position: absolute;
	display: block;
	content: '';
	transition: all 0.2s ease-in-out;
}
.menu-toggle span {top: 50%;}
.menu-toggle span:before {top: -5px;}
.menu-toggle span:after {bottom: -5px;}
.show-menu .menu-toggle span {background-color: transparent;}
.show-menu .menu-toggle span:before,
.show-menu .menu-toggle span:after {top: 0; background: #fff;}
.show-menu .menu-toggle span:before {transform: rotate(45deg);}
.show-menu .menu-toggle span:after {transform: rotate(-45deg);}

.menu-item.highlighted {
	background: #a40833;
}
.menu-item.highlighted a {
	color: #fff;
}

@media (min-width:1000px) {
/**  big displays
------------------------------------------------------------- **/
	/**  menu
	---------------- **/
	.menu-toggle {
		display: none;
	}
	.menu-container {
		display: block;
		background: transparent;
		margin-top: 1em;
	}
	.menu-container {
		position: static;
		top: auto;
		left: auto;
		background: none !important;
		height: auto;
	}
	.menu-container ul {
		display: flex;
		/* justify-content: flex-end; */
		margin-right: -0.8em;
		width: 100%;
	}
	.menu-container ul li a {
		padding: 0.3em 0.8em;
	}
	.menu-container ul li a {
		color: #000;
		line-height: normal;
		font-size: 1em;
	}
	.menu-container ul.children li {
		background: #fff;
	}
	.menu-container ul li ul {
		display: none;
		text-align: left;
	}
	ul.menu > li {
		margin-left:10px;
	}
	.menu-container ul > li > a {
		display: block;
		white-space: nowrap;
		background: #ffffff;
	}
	.menu-container ul > li.current_page_item > a {
		background: #036CBD;
		color: #fff;
	}

	/*mouse over submenu*/
	.menu-container ul li:hover ul {
		display: block;
	}
	.menu-container ul li ul {
		background: #fff;
		position: absolute;
		left: 0;
		min-width: 200px;
		width: auto;
		font-size: 0.85em;
		line-height: 1.5em;
	}
	.menu-container ul li ul li {display: block;}
	.menu-container ul ul ul {display: none !important;}

	header.mainheader a.logo img {
		width: 250px;
	}
	.menu-item.highlighted {
		position: absolute;
		top: 20px;
		right: 20px;
	}
	.show-menu .menu-container {
		justify-content: flex-start;
	}
	.mainheader > .max-size {
		display: flex;
		flex-direction: row-reverse;
	}


} /** end big displays**/


/**  footer
------------------------------------------------------------- **/

footer {
	padding: 2em 0;
	text-align: center;
	position: relative;
	font-size: 0.85em;
	background-color: #333;
	/*margin-top: 3em;*/
}
footer a {
	color: #fff !important;
	border-color: #fff !important;
	border: none !important;
}
footer * {
	color: #ccc;
}
footer h1,
footer h2,
footer h3,
footer h4,
footer h5 {
	color: #fff;
	font-weight: bold;
}
footer ul {
	list-style: none;
	padding: 0;
}
@media (min-width: 800px) {
	footer .widgets {display: flex;}
	footer .widgets > * {flex: 1 1 0; position: relative;}
	footer .widgets > * {padding-left: 0.5em; padding-right: 0.5em;}
	footer .widgets > *:first-child {padding-left: 0;}
	footer .widgets > *:last-child {padding-right: 0;}
}

.footer1 ul {
	column-count: 4;
}
.footer2 ul {
	column-count: 2;
}

@media (max-width: 1024px) {
	.footer1 ul {
		column-count: 2;
	}
}
footer .scroll {
	font-size: 0.85em;
}
footer .scroll .back-to-top {
	width: 20px;
	height: 20px;
	margin: 0 auto;
	background: url('img/arrow-down-big.svg') no-repeat center center;
	background-size: contain;
	transform: rotate(180deg);
}
/**  forms
------------------------------------------------------------- **/

input[type=text],
input[type=password],
input[type=email],
input[type=submit],
input[type=tel],
input[type=date],
input[type=number],
textarea,
select {
	-webkit-appearance:none;
	-moz-appearance: none;
	appearance: none;
	padding: 10px;
	border: 1px solid #000;
	outline: none;
	vertical-align: middle;
	max-width: 100%;
	width: 100%;
	/* border-radius: 4px; */
	/*box-shadow: inset 1px 1px 5px 0px rgba(50, 50, 50, 0.4);*/
	font-family: inherit;
	background: #FFFFFF;
	font-size: initial; /*prevents ios form zooming to the input field */
}

textarea {resize:vertical;}

input:focus,
textarea:focus,
select:focus {
	border: 1px solid #000;
}

select {
	background: url('img/arrow-down.svg') no-repeat center right 1em;
	background-size: 15px 15px;
	padding-right: 40px;
}

input[type=checkbox],
input[type=radio] {
	-webkit-appearance:none;
	/*-moz-appearance: none; does not work, makes it even uglier */
	appearance: none;
	display: inline-block;
	padding: 10px;
	border: 1px solid #000;
	vertical-align: middle;
	border-radius: 4px;
	background-color: #fff;
}

input[type=radio] {
	border-radius: 100%;
}

input[type=checkbox]:checked,
input[type=radio]:checked {
	background: url('img/icon-check.svg') no-repeat center center #fff;
	background-size: 70%;
}

input[type=checkbox]:focus,
input[type=radio]:focus {
		border: 1px solid #000;
		outline: 0;
}

input[type=search] {
	-webkit-appearance:none;
	-moz-appearance: none;
	appearance: none;
	padding: 8px;
	border: 1px solid #ccc;
	outline: none;
	vertical-align: middle;
	border-radius: 5px;
	font-family: inherit;
	background: none;
}

input.short,
select.short {max-width: 160px;}


/*BUTTONS*/
/* input[type=submit],
a.button,
button,
.wp-block-button__link  {
	background-color: transparent !important;
	display: inline-block;
	padding: 0.5em 1em !important;
	color: #39546a !important;
	line-height: normal !important;
	border: 2px solid #39546a;
	border-radius: 0;
	font-weight: 300 !important;
	font-size: 1em !important;
	cursor: pointer;
	transition: all 0.2s;
	text-decoration: none !important;
	text-align: center;
	text-transform: uppercase;
}
.has-blau-background-color .wp-block-button__link,
.has-braun-background-color .wp-block-button__link {
	border: 1px solid #fff;
} */
.wp-block-button__link {
	transition: 0.2s;
}

.wp-block-button__link:hover {
	text-decoration: none !important;
	transform: scale(1.05);
}

/**  micro grid system
------------------------------------------------------------- **/
@media (min-width: 768px) {
	.flexrow {
		display: flex;
	}
	.flexrow > div {
		padding-left: 1em;
		padding-right: 1em;
		flex-grow: 1;
		flex-shrink: 0;
		flex-basis: 0;
		position: relative;
	}
	.flexrow > div:first-child {padding-left: 0;}
	.flexrow > div:last-child {padding-right: 0;}
}

div.table {display: table;}
div.table-row {display: table-row;}
div.table-cell {display: table-cell;}


/** iframe fix **/
iframe {display: block;} 

.wp-block-table {
	margin-bottom: 2em;
	overflow-x: hidden;
}

.wp-block-table tr td {
	border-bottom: 1px solid #ccc;
}

/**  tables
------------------------------------------------------------- **/
table td {
	padding: 10px;
}

/**  gutenberg overwrites
------------------------------------------------------------- **/
.wp-block-navigation-link__content {
	padding: 0;
}
ul.wp-block-latest-posts li,
ul.wp-block-navigation__container li {
	margin-left: 0 !important;
}
.wp-block-media-text .wp-block-media-text__content {
	padding: 0;
}
.wp-block-media-text__media img {
	padding: 1.5em;
}
.wp-block-media-text__media > a {
	border-bottom: none;
}
.wp-block-navigation-link__label {
	font-family: inherit;
}
.wp-block-cover__inner-container {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 2em 1em;
	overflow: visible;
	position: relative;
}
.wp-block-button.fullwidth,
.wp-block-button.fullwidth a {
	display: block;
}
.wp-block-cover.align-bottom .wp-block-cover__inner-container {
	align-self: end;	
}

.wp-block-latest-posts__featured-image a {
	overflow: hidden;
}
.wp-block-latest-posts__featured-image a img {
	transition: transform .2s;
}
.wp-block-latest-posts__featured-image a:hover img {
	transform: rotate(2deg) scale(1.25);
}

@media (max-width: 600px) {
	/* remove margin right when columns collapse */
	.wp-block-latest-posts.is-grid li {
		margin-right: 0;
	}
}

.wp-block-pullquote {
	padding: 1em 0;
}


/*  lazy blocks : video chat
--------------------------------------------- */

.wp-block-lazyblock-videochat  {
	position: relative;
}
.videocontainer {
	position: relative;
	top: 0;
	left: calc(((100vw - 100%)/2)*-1);
	width: 100vw;
	height: 100vh;
	/* for image background on mobile */
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}
video#vid {
	/* z-index: -1; */
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/* @media (max-width: 768px) {
	video#vid {
		display: none;
	}
}
@media (min-width: 769px) {
	.videocontainer {
		background-image: none !important;
	}
	video#vid {
		display: block;
	}
} 
.chat-fade {
	position: absolute;
	right: 0;
	top:0;
	height: 100%;
	width: 100%;
	mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 80px, rgba(0, 0, 0, 1) 150px);
	-webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 80px, rgba(0, 0, 0, 1) 150px);
}*/
#chat {
	position: absolute;
	right: 0;
	bottom: 100px;
	width: 450px;
}
@media (max-width: 420px) {
	#chat {
		width: 100%;
	}
}
#chat .msg {
	margin-bottom: 10px;
}
#chat .msg .msg-inner {
	display: inline-block;
	max-width: 450px;
	border-radius: 20px;
	padding: 10px;
	font-size: 18px;
	line-height: 18px;
}
#chat .msg:nth-child(even) {
	text-align: left;
}
#chat .msg:nth-child(even) .msg-inner {
	background: #fff;
}
#chat .msg:nth-child(even) .msg-inner a {
	color: #2e67ff;
}
#chat .msg:nth-child(odd) {
	text-align: right;
}
#chat .msg:nth-child(odd) .msg-inner {
	background: #2e67ff;
	color: #fff;
	text-align: left;
}
#chat .msg:nth-child(odd) .msg-inner a {
	color: #fff;
}

/*animation*/
#chat .msg {
	animation-name: plop;
	animation-duration: 0.5s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
	opacity: 0;
	transform: scale(0);
	max-height: 0;
}
#chat .msg:nth-child(1) {animation-delay:  1s;}
#chat .msg:nth-child(2) {animation-delay:  3s;}
#chat .msg:nth-child(3) {animation-delay:  5s;}
#chat .msg:nth-child(4) {animation-delay:  7s;}
#chat .msg:nth-child(5) {animation-delay:  9s;}
#chat .msg:nth-child(6) {animation-delay:  11s;}
#chat .msg:nth-child(7) {animation-delay:  13s;}
#chat .msg:nth-child(8) {animation-delay:  15s;}
#chat .msg:nth-child(9) {animation-delay:  17s;}
#chat .msg:nth-child(10) {animation-delay: 19s;}
/* max 10 chat-elements allowed */

@keyframes plop {
	0% {
		opacity: 0;
		transform: scale(0);
		max-height: 0;
	}
	100% {
		opacity: 1;
		transform: scale(1);
		max-height: 1000px;
	}
}

.arrow-down {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 60px;
	height: 60px;
	background: url('img/arrow-down-big.svg') no-repeat center center rgba(0, 0, 0, 0.4);
	background-size: 30px;
	border-radius: 100%;
	animation: bounce 0.8s infinite alternate;
}
@keyframes bounce {
	0% { transform: translateY(0); }
	100% { transform: translateY(-30px); }
}
#demo { animation: bounce 0.8s infinite alternate; } 

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

/*  lazy blocks : collapsible
--------------------------------------------- */
.collapsible {	
	margin-bottom: 1em;
}
	
.collapsible-header {
	background: #036CBD;
	/* border-radius: 10px; */
	color: #fff;
	padding: 10px 40px 10px 15px;
	display: inline-block;
	position: relative;
	cursor: pointer;
	font-weight: 600;
}

.collapsible-content {
	transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);
	overflow: hidden;
	max-height: 0;
	text-align: left;
}
.collapsible-txt {
	background: #fff;
	border-radius: 5px;
	color: #000;
	padding: 20px 1em;
}
.collapsible-txt ul:first-of-type,
.collapsible-txt p:first-of-type {
	margin-top: 0;
}


	.collapsible > div {
		width: 100%;
	}

.collapsible-header:after {
	content:'';
	position: absolute;
	right: 15px;
	top: 0;
	width: 20px;
	height: 100%;
	background: url('img/icon-arrow-circled.svg') no-repeat center center;
	background-size: contain;
}
.collapsible.open .collapsible-header:after {
	transform: scaleY(-1);
}
.collapsible.open .collapsible-content {
	max-height: 9000px;
	transition: max-height 1s ease-in-out;

}
/* .wp-block-lazyblock-collapsible:nth-of-type(2) .collapsible {
	text-align: right;
} */


/**  custom element: iconlist
------------------------------------------------------------- **/

/* iconlist */
.wp-block-lazyblock-iconlist {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.wp-block-lazyblock-iconlist > div {
	width: 22%;
	margin-bottom: 5%;
}
.wp-block-lazyblock-iconlist > div > .inner {
	background: #036CBD;
	padding: 1.5em;
	text-align: center;
	line-height: 1.3em;
	min-height: 200px;
	/* put text to bottom: */
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	/* make animation smooth */
	transition: all 0.2s;
	text-decoration: none;
	border-radius: 20px;
}
.wp-block-lazyblock-iconlist > div > .inner:hover {
	transform: scale(1.1);
}
.inner .icon-container {
	flex-grow: 2;
	/*image to center: */
	display: flex;
	align-items: center;
	justify-content: center;
}
.wp-block-lazyblock-iconlist img {
	max-height: 100px;
	width: auto;
	margin: 0 auto;
}
@media (max-width: 1023px) {
	.wp-block-lazyblock-iconlist > div {
		width: 47%;
	}
}
@media (max-width: 768px) {
	.wp-block-lazyblock-iconlist > div {
		width: 47%;
	}
}

@media (max-width: 782px) {
	.custom-columns {
		row-gap: 0;
	}
	.reversed {
		flex-direction: column-reverse;
	}
}
