@import url(../css/fontawesome.css);

@charset "UTF-8";

/* VARIABLES */
:root {
	/* COLORS */
	--cgreyscale050: #fbfbfb;
	--cgreyscale100: #e1e2e4;
	--cgreyscale150: color-mix(in srgb, var(--cgreyscale100), var(--cgreyscale200));
	--cgreyscale200: #787c82;
	--cgreyscale300: #484d52;
	--cgreyscale400: #1d1f21;
	--cbgprimary: #fff;
	--cbgalpha: #fffb;
	--cbgsecondary: #f0f1f1;
	--cbgtertiary: #f4f5f5;
	--cbgtertiaryalpha: #eaeaea80;
	--cbluecontrast: #00529e;
	--cbluebase: #0084ff;
	--cbluelight: #e4f3ff;
	--csuccesscontrast: #007a66;
	--csuccessbase: #00997f;
	--csuccesslight: #e4f4f1;
	--cwarningcontrast: #ad5c00;
	--cwarningbase: #d67200;
	--cwarninglight: #feeedc;
	--cdangercontrast: #a61111;
	--cdangerbase: #e92c64;
	--cdangerlight: #fdedec;

	--cbuzzardcontrast: #421a61;
	--cbuzzardbase: #7f4399;
	--cbuzzardsecond: #cfc8d5;
	--cbuzzardlight: #ebe7ef;
	--caccentcontrast: #a99f2e;
	--caccentbase: #fbed4d;
	--caccentlight: #fff8f0;
	--cpastelcontrast: var(--cbuzzardcontrast);
	--cpastelbase: #655274;
	--cpastellight: #e0dce3;

	--background: #fff8;
	--stackshadows: #ccc 5px -5px, #dcdee0a0 10px -10px;
	--deepshadow: 0 30px 90px -20px rgba(0, 0, 0, 0.3), 0 0 1px 1px rgba(0, 0, 0, 0.1);

	/* KLARO */
	--light1: var(--cgreyscale400);
	--light3: var(--cgreyscale200);
	--dark1: var(--cbgprimary);
	--dark2: var(--cgreyscale100);
	--dark3: var(--cgreyscale300);
	--green1: var(--csuccesscontrast);
	--green2: var(--csuccessbase);

	/* TRANSITION */
	--expo-out: linear(
		0 0%, 0.1684 2.66%, 0.3165 5.49%,
		0.446 8.52%, 0.5581 11.78%,
		0.6535 15.29%, 0.7341 19.11%,
		0.8011 23.3%, 0.8557 27.93%,
		0.8962 32.68%, 0.9283 38.01%,
		0.9529 44.08%, 0.9711 51.14%,
		0.9833 59.06%, 0.9915 68.74%, 1 100%
	);
}

@media (prefers-color-scheme: dark) {
	:root {
		--cgreyscale050: #040404;
		--cgreyscale100: #3b3b3b;
		--cgreyscale200: #888;
		--cgreyscale300: #b9b9b9;
		--cgreyscale400: #f1f1f1;
		--cbgprimary: #000;
		--cbgalpha: #0009;
		--cbgsecondary: #262626;
		--cbgtertiary: #131313;
		--cbgtertiaryalpha: #15151580;
		--cbluecontrast: #2e9aff;
		--cbluebase: #1990ff;
		--cbluelight: #093158;
		--csuccesscontrast: #19ae43;
		--csuccessbase: #19ac42;
		--csuccesslight: #083916;
		--cwarningcontrast: #db811a;
		--cwarningbase: #da811a;
		--cwarninglight: #482909;
		--cdangercontrast: #f16f6f;
		--cdangerbase: #eb4141;
		--cdangerlight: #5b1919;

		--cbuzzardcontrast: #ebe7ef;
		--cbuzzardlight: #421a61;
		--caccentcontrast: #fff8f0;
		--caccentlight: #a99f2e;
		--cpastelcontrast: #e0dce3;
		--cpastellight: var(--cbuzzardcontrast);

		--background: #0008;
		--deepshadow: 0 30px 90px -20px rgba(255, 255, 255, 0.4), 0 0 1px 1px rgba(255, 255, 255, 0.2);
	}

	/* KLARO */

	#klaro .cookie-modal .cm-modal.cm-klaro,
	#lightbox .lb-popup div.lb-content {
		box-shadow: 0 4px 6px 0 rgba(255, 255, 255, 0.2), 0 0 10px 10px rgba(255, 255, 255, 0.19);
	}

	.login .button.wp-hide-pw {
		color: #eee;
	}

	body.woocommerce form .show-password-input:before,
	body.woocommerce-page form .show-password-input:before {
		background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M17.3 3.3C16.9 2.9 16.2 2.9 15.7 3.3L13.3 5.7C12.2437 5.3079 11.1267 5.1048 10 5.1C6.2 5.2 2.8 7.2 1 10.5C1.2 10.9 1.5 11.3 1.8 11.7C2.6 12.8 3.6 13.7 4.7 14.4L3 16.1C2.6 16.5 2.5 17.2 3 17.7C3.4 18.1 4.1 18.2 4.6 17.7L17.3 4.9C17.7 4.4 17.7 3.7 17.3 3.3ZM6.7 12.3L5.4 13.6C4.2 12.9 3.1 11.9 2.3 10.7C3.5 9 5.1 7.8 7 7.2C5.7 8.6 5.6 10.8 6.7 12.3ZM10.1 9C9.6 8.5 9.7 7.7 10.2 7.2C10.7 6.8 11.4 6.8 11.9 7.2L10.1 9ZM18.3 9.5C17.8 8.8 17.2 8.1 16.5 7.6L15.5 8.6C16.3 9.2 17 9.9 17.6 10.8C15.9 13.4 13 15 9.9 15H9.1L8.1 16C8.8 15.9 9.4 16 10 16C13.3 16 16.4 14.4 18.3 11.7C18.6 11.3 18.8 10.9 19.1 10.5C18.8 10.2 18.6 9.8 18.3 9.5ZM14 10L10 14C12.2 14 14 12.2 14 10Z" fill="%23eee"/></svg>');
	}

	body.woocommerce form .show-password-input.display-password:before,
	body.woocommerce-page form .show-password-input.display-password:before {
		background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M18.3 9.49999C15 4.89999 8.50002 3.79999 3.90002 7.19999C2.70002 8.09999 1.70002 9.29999 0.900024 10.6C1.10002 11 1.40002 11.4 1.70002 11.8C5.00002 16.4 11.3 17.4 15.9 14.2C16.8 13.5 17.6 12.8 18.3 11.8C18.6 11.4 18.8 11 19.1 10.6C18.8 10.2 18.6 9.79999 18.3 9.49999ZM10.1 7.19999C10.6 6.69999 11.4 6.69999 11.9 7.19999C12.4 7.69999 12.4 8.49999 11.9 8.99999C11.4 9.49999 10.6 9.49999 10.1 8.99999C9.60003 8.49999 9.60003 7.69999 10.1 7.19999ZM10 14.9C6.90002 14.9 4.00002 13.3 2.30002 10.7C3.50002 8.99999 5.10002 7.79999 7.00002 7.19999C6.30002 7.99999 6.00002 8.89999 6.00002 9.89999C6.00002 12.1 7.70002 14 10 14C12.2 14 14.1 12.3 14.1 9.99999V9.89999C14.1 8.89999 13.7 7.89999 13 7.19999C14.9 7.79999 16.5 8.99999 17.7 10.7C16 13.3 13.1 14.9 10 14.9Z" fill="%23eee"/></svg>');
	}
}

/* GENERIC STYLES */

html {
	scroll-behavior: smooth;
/* 	scrollbar-width: thin; */
	scrollbar-gutter: stable;
	scrollbar-color: var(--cgreyscale150) var(--background);
}

body {
	margin: 0;
	font: 400 14px Sohne Buch Custom, sans-serif;
	color: var(--cgreyscale400);
	background-color: var(--cbgprimary);
	display: flex;
	flex-direction: column;
	min-height: 100dvh;
	position: relative;
}

body.admin-bar {
	min-height: calc(100dvh - 32px);
}

h1, h2, h3, h4, h5, h6, h7, h8 {
	font-family: Sohne Dreiviertelfett Custom, sans-serif;
	line-height: 1.274;
}

p,
.popup-tab p + ul li,
.popup-tab p + ol li,
.popup-tab-content ul li,
.popup-tab-content ol li,
post.article p + ul li,
post.article p + ol li,
#glossary p + ul li,
#glossary p + ol li,
body.glossar p + ul li,
body.glossar p + ol li {
	font-family: Charter Regular Custom, serif;
	font-size: 18px;
	line-height: 1.5;
	text-align: justify;
/* 	hyphens: auto; */
	text-wrap: initial;
}

img {
	max-width:100%;
	max-height: 50dvw;
	height: auto;
	vertical-align:bottom;
}

img.qrcode {
	width: unset;
	height: unset;
}

a {
	color: inherit;
	transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
	cursor: pointer;
	text-decoration: underline;
	text-decoration-color: var(--cgreyscale200);
}

a:hover {
	color:var(--cgreyscale300);
}

a:focus {
	outline:0;
}

a:hover,
a:active {
	outline:0;
}

a.anchor {
	display: block;
	position: relative;
	top: -70px;
	visibility: hidden;
}

.button:not(.wp-hide-pw),
body.woocommerce-page a.button,
body.woocommerce-page button.button,
body.woocommerce-page button.button.alt,
body.woocommerce-page input.button {
	color: var(--cbgprimary);
	background: var(--cgreyscale400);
	display: inline-block;
	border: 0;
	border-radius: 30px;
	padding: 14px 25px;
	text-decoration: none;
	cursor: pointer;
	line-height: normal;
	font-weight: normal;
	transition: all 0.3s;
	text-align: center;
}

.button:hover,
.nav a.button:hover,
body.woocommerce-page a.button:hover,
body.woocommerce-page button.button:hover,
body.woocommerce-page button.button.alt:hover,
body.woocommerce-page input.button:hover {
	color: #000;
	background: var(--caccentbase);
}

.button:disabled,
body.woocommerce-page button.button:disabled {
	background: var(--cgreyscale100);
}

.button ~ .button,
body.woocommerce-page .button ~ .button {
	margin-top: 10px;
	margin-left: 5px;
	margin-right: 5px;
}

.button.light,
.lb-content .buttons .button.light,
body.woocommerce-account.konto-group .button.light {
	border: 1px solid var(--cgreyscale100);
	background: transparent;
	color: var(--cgreyscale300);
}

.button.delete {
	background-color: var(--cdangercontrast) !important;
}

.button.delete:hover {
	background-color: var(--cdangerbase) !important;
}

.button.icons {
	font-size: 16px;
	font-weight: bold;
	margin-top: 16px;
}

.button i.fal,
.button i.fas {
	font-size: 16px;
}

.float-right {
	float: right;
}

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

.float-left {
	float: left;
}

.center,
.center p {
	text-align: center;
	align-content: center;
}

.right,
.right p {
	text-align: right;
}

.left,
.left p {
	text-align: left;
}

.nobr {
	white-space: nowrap;
}

.hidden {
	display: none;
}

.detail {
	color: var(--cgreyscale200);
}

.clear {
	clear: both;
}

.inline {
	display: inline-block;
}

/* ANIMATIONEN */

@keyframes fadein {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@keyframes movein {
	from {
		top: 90px;
	}
	to {
		top: 60px;
	}
}

/* ICONS */

a.fal,
a.fas {
	text-decoration: none;
}

.scroll-button:before,
.icons:before,
.icons:after {
	content: '';
	vertical-align: middle;
	display: inline-block;
	background-color: currentColor;
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center right;
}

.nav .icons:before {
	width: 28px;
	height: 28px;
	margin-right: 6px;
}

.icons.logo:before {
	mask-image: url(../img/svg/logo.svg);
	width: 79px;
	height: 27px;
	color: var(--cgreyscale400);
}

.icons.logo-short:before {
	mask-image: url(../img/svg/logo-short.svg);
	width: 19px;
	height: 27px;
	margin-right: 10px;
	vertical-align: -8px;
	color: var(--cgreyscale400);
}

.icons.menu:before {
	mask-image: url(../img/svg/menu.svg);
	vertical-align: -6px;
}

.icons.menu.close:before {
	mask-image: url(../img/svg/close.svg);
	vertical-align: -6px;
}

.icons.edition:before {
	mask-image: url(../img/svg/edition.svg);
}

.nav .current .icons.edition:before {
	mask-image: url(../img/svg/edition-fill.svg);
}

.icons.topic:before {
	mask-image: url(../img/svg/topic.svg);
}

.nav .current .icons.topic:before {
	mask-image: url(../img/svg/topic-fill.svg);
}

.icons.debate:before {
	mask-image: url(../img/svg/debate.svg);
}

.nav .current .icons.debate:before {
	mask-image: url(../img/svg/debate-fill.svg);
}

.icons.explore:before {
	mask-image: url(../img/svg/explore.svg);
}

.nav .current .icons.explore:before {
	mask-image: url(../img/svg/explore-fill.svg);
}

.icons.about:before {
	mask-image: url(../img/svg/about.svg);
}

.nav .current .icons.about:before {
	mask-image: url(../img/svg/about-fill.svg);
}

.icons.teacher:before {
	mask-image: url(../img/svg/teacher.svg);
	width: 28px;
	height: 28px;
}

.icons.teacher2:before {
	mask-image: url(../img/svg/teacher2.svg);
}

.nav .icons.teacher:before,
.nav .icons.teacher2:before {
	color: var(--cbuzzardbase);
}

.nav .current.icons.teacher:before {
	mask-image: url(../img/svg/teacher-fill.svg);
}

.nav .current.icons.teacher2:before {
	mask-image: url(../img/svg/teacher2-fill.svg);
}

.icons.search:before {
	mask-image: url(../img/svg/search.svg);
	width: 20px;
	height: 20px;
	vertical-align: -4px;
	cursor: pointer;
}

.nav .icons.search:before {
	vertical-align: -8px;
}

.nav .current.icons.search:before {
	mask-image: url(../img/svg/search-fill.svg);
}

.icons.settings:before {
	mask-image: url(../img/svg/settings.svg);
	width: 20px;
	height: 20px;
}

.icons.pdf:before {
	mask-image: url(../img/svg/pdf.svg);
	width: 20px;
	height: 20px;
}

.icons.qrcode:before {
	mask-image: url(../img/svg/qrcode.svg);
	width: 28px;
	height: 28px;
}

.icons.bookmark:before {
	mask-image: url(../img/svg/bookmark.svg);
	width: 28px;
	height: 28px;
}

.icons.bookmark.fill:before,
.nav .current.icons.bookmark:before {
	mask-image: url(../img/svg/bookmark-fill.svg);
}

.icons.user:before {
	mask-image: url(../img/svg/user.svg);
}

.nav .current.icons.user:before {
	mask-image: url(../img/svg/user-fill.svg);
}

.scroll-button.left:before,
.icons.back:before {
	mask-image: url(../img/svg/back.svg);
	width: 6px;
	height: 11px;
	margin: 0 5px;
	vertical-align: baseline;
}

.scroll-button.right:before,
.icons.next:after {
	mask-image: url(../img/svg/next.svg);
	width: 6px;
	height: 11px;
	margin: 0 10px;
	vertical-align: baseline;
}

.icons.down:after {
	mask-image: url(../img/svg/down.svg);
	width: 9px;
	height: 6px;
	margin: 0 7px 0 10px;
	vertical-align: 2px;
}

.icons.outlink:after {
	mask-image: url(../img/svg/outlink.svg);
	width: 16px;
	height: 17px;
	margin-left: 5px;
	vertical-align: top;
}

.icons.file:before {
	mask-image: url(../img/svg/file.svg);
	width: 15px;
	height: 19px;
	margin-right: 10px;
	vertical-align: top;
}

.icons.print:before {
	mask-image: url(../img/svg/print.svg);
	width: 23px;
	height: 23px;
	margin-right: 10px;
	vertical-align: top;
}

.icons.edit:before {
	mask-image: url(../img/svg/edit.svg);
	width: 24px;
	height: 24px;
}

footer .icons.edit:before {
	width: 17px;
	height: 17px;
}

.icons.info:before {
	mask-image: url(../img/svg/info.svg);
	width: 32px;
	height: 32px;
	float: left;
	margin: 16px 16px 16px 8px;
}

.icons.copy:before {
	mask-image: url(../img/svg/copy.svg);
	width: 18px;
	height: 19px;
	margin-right: 8px;
	vertical-align: top;
}

.icons.user-add:before {
	mask-image: url(../img/svg/user-add.svg);
}

.icons.play:before {
	mask-image: url(../img/svg/play.svg);
}

.icons.contacts:before {
	mask-image: url(../img/svg/contacts.svg);
}

.icons.question:before {
	mask-image: url(../img/svg/question.svg);
}

.icons.gear:before {
	mask-image: url(../img/svg/gear.svg);
}

.icons.checkmark:before {
	mask-image: url(../img/svg/checkmark.svg);
	color: #007A66;
	width: 21px;
	height: 21px;
}

.icons.warning:before {
	mask-image: url(../img/svg/warning.svg);
	color: #E92C64;
	width: 21px;
	height: 21px;
}

.icons.support:before {
	mask-image: url(../img/svg/support.svg);
}

.icons.timeline:before {
	mask-image: url(../img/svg/timeline.svg);
}

.icons.user-gear:before {
	mask-image: url(../img/svg/user-gear.svg);
}

.icons.user-key:before {
	mask-image: url(../img/svg/user-key.svg);
}

.icons.list:before {
	mask-image: url(../img/svg/list.svg);
}

.icons.trash:after {
	mask-image: url(../img/svg/trash.svg);
	width: 16px;
	height: 18px;
	margin-left: 5px;
	vertical-align: bottom;
}

.icons.spinner:before {
	mask-image: url(../img/svg/spinner.svg);
	width: 32px;
	height: 32px;
	margin-right: 10px;
	animation: anim-rotate 1s infinite steps(8);
}

.fa-spinner-scale {
	font-size: 32px;
	animation: anim-rotate 1s infinite steps(8);
}

@keyframes anim-rotate {
	0% { transform: rotate(0); }
	100% { transform: rotate(360deg); }
}

.icons.mini::before {
	width: 18px;
	height: 18px;
	vertical-align: text-bottom;
}

.icons.sun:before {
	mask-image: url(../img/svg/sun.svg);
	width: 20px;
	height: 20px;
}

.icons.moon:before {
	mask-image: url(../img/svg/moon.svg);
	width: 20px;
	height: 20px;
}

.icons.glossary:after {
	mask-image: url(../img/svg/book.svg);
	width: 20px;
	height: 20px;
	vertical-align: text-bottom;
}

.icons.memo:before {
	mask-image: url(../img/svg/memo.svg);
	width: 28px;
	height: 28px;
}

.icons.toggle:before {
	width: 28px;
	height: 24px;
	vertical-align: -6px;
	margin-right: 5px;
	color: var(--cgreyscale400);
}

.icons.toggle.off:before {
	mask-image: url(../img/svg/toggle-off.svg);
}

.icons.toggle.on:before {
	mask-image: url(../img/svg/toggle-on.svg);
}

/* HEADER */

.header {
	background-color: var(--cbgalpha);
	backdrop-filter: blur(14px);
	z-index: 2;
	position: sticky;
	top: 0;
	left: 0;
	right: 0;
	height: 88px;
	padding: 0 20px;
	margin: 0 0 40px;
}

.header-container {
	height: 100%;
}

.nav {
	width: 100%;
	height: 100%;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.nav a {
	text-decoration: none;
	color: var(--cgreyscale200);
}

.nav a i {
	font-size: 22px;
	margin-right: 5px;

	--fa-family:var(--fa-family-classic);
	--fa-style:300;
	--_fa-family:var(--fa-family,var(--fa-style-family,"Font Awesome 7 Pro"));
	display:var(--fa-display,inline-block);
	font-family:var(--_fa-family);
	font-feature-settings:normal;
	font-style:normal;
	font-synthesis:none;
	font-variant:normal;
	font-weight:var(--fa-style,900);
	line-height:1;
	text-align:center;
	text-rendering:auto;
	width:var(--fa-width,1.25em);
}

.nav a i:before{
	content:var(--fa)/"";
}
@supports not (content:""/""){
	.nav a i:before{
		content:var(--fa);
	}
}

.nav a.current i {
	--fa-family:var(--fa-family-classic);
	--fa-style:900;
}

.nav a:hover {
	color: var(--cgreyscale400);
}

.nav a.current {
	color: var(--cgreyscale400);
}

.nav a.current:hover {
	color: var(--cgreyscale200);
}

.nav a.highlight {
	color: var(--cbuzzardbase);
}

.nav a.highlight:hover {
	color: var(--cbuzzardcontrast);
}

.nav ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: inline-flex;
}

.nav-right ul li a {
	display: inline-block;
}

.nav-right > ul > li > a {
	padding: 20px 0 20px 10px;
	margin: 13px 0 13px 30px;
	white-space: nowrap;
}

.nav ul li ul {
	position: absolute;
	left: initial;
	opacity: 0;
	visibility: hidden;
	display: none;
	background-color: var(--cbgprimary);
	z-index: 99;
	text-align: initial;
}

.nav li:hover > ul {
	top: 60px;
	left: auto;
	padding: 10px 0;
	border: 1px solid var(--cgreyscale100);
	opacity: 1;
	visibility: visible;
	display: block;
	animation: fadein .3s, movein .3s;
}

.nav li:hover > ul a {
	visibility: visible;
	transition: visibility 0ms .3s;
}

.nav li > ul a {
	visibility: hidden;
}

.nav .nav-right ul li ul {
	width: auto;
	right: 0;
}

.nav ul li ul li {
	padding: 0;
}

.nav ul li ul li.sponsor {
	padding: 0 10px;
}

.nav ul li ul li b,
.nav ul li ul li a {
	display: inline-block;
	padding: 8px 26px;
	width: calc(100% - 52px);
	white-space: nowrap;
}

.nav ul li ul li:not(:first-child) b {
	border-top: 1px solid var(--cgreyscale100);
	padding-top: 16px;
	margin-top: 8px;
}

a.warning,
.nav a.warning {
	color: var(--cdangerbase);
}

.nav a.warning:hover {
	color: var(--cdangercontrast);
}

.nav .menutext {
	margin-top: 4px;
}

nav.nav a.button {
	margin: 28px 0 0;
	padding: 8px 14px;
}

.nav form.search {
	height: 24px;
	padding: 12px 10px;
	width: 30vw;
	max-width: 500px;
	background: var(--cbgtertiaryalpha);
}

.nav form.search i {
	font-size: 22px;
	margin-right: 6px;
}

/* SEARCH */

form.search,
div.search {
	background: var(--cbgtertiary);
	padding: 8px 12px;
	border-radius: 8px;
	position: relative;
	flex: 1;
}

form.search.hidden input.search-input {
	width: 0;
}

form.search input.search-input,
div.search input.search-input,
form.search input.search-input:focus-visible,
div.search input.search-input:focus-visible {
	opacity: 1;
	width: calc(100% - 37px);
	padding: 0;
	border: 0;
	outline: 0;
	background: transparent;
	color: var(--cgreyscale400);
	transition: width 0.2s ease-in-out;
	font-size: inherit;
}

#search .icons.search:before {
	margin-right: 6px;
}

div.button.settings {
	padding: 7px;
	font-size: 16px;
	display: inline-block;
	cursor: pointer;
	color: var(--cgreyscale200);
}

div.button.settings:hover {
	color: var(--cgreyscale400);
}

#menusearch  {
	margin: 18px 18px -18px;
}

#menusearch input.search-input {
	width: calc(100% - 29px);
}

#menusearch .icons.search:before {
	margin-right: 6px;
}

.enter-button {
	position: absolute;
	right: 40px;
	margin-top: -21px;
	background: var(--cgreyscale100);
	padding: 0 2px 1px 3px;
	cursor: pointer;
}

#menusearch .enter-button {
	right: 34px;
}

/* CONTENT VIEW */

.wrapper {
	flex-grow: 1;
	width: -webkit-fill-available;
	width: -moz-available;
	width: stretch;
}

main,
.top-banner {
	max-width: 1024px;
	margin: 0 auto;
}

.float-left.back {
	color: var(--cgreyscale200);
	text-decoration: none;
	margin-top: 4px;
}

.float-left.back:hover {
	color: inherit;
}

h1 {
	font-size: 35px;
	margin: 10px 0 18px;
}

h2 {
	font-size: 24px;
	margin: 20px 0 10px;
}

h3 {
	font-size: 18px;
}

h4 {
	font-size: 16px;
}

h3.post-type {
	text-align: right;
	margin: 21px 0 9px;
}

fieldset {
	background-color: var(--cbgprimary);
	border: 1px solid var(--cgreyscale100);
/* 	border-radius: 8px; */
	margin: 30px 0 0;
/* 	padding: 16px 20px; */
	padding: 24px;
	text-wrap: balance;
}

fieldset legend {
	color: var(--cgreyscale200);
}

fieldset h2 {
	margin: 0 0 10px;
}

fieldset.explore a {
	font-size: 16px;
	font-weight: bold;
	text-decoration: none;
	padding: 4px 0;
	display: inline-block;
	margin-right: 10px;
	white-space: nowrap;
}

fieldset.explore a:before {
	margin: 0;
}

article img {
	border-radius: 8px;
	width: 100%;
	max-height: min(50dvw, 480px);
	object-fit: cover;
}

.license {
	text-align: right;
	font-size: 10px;
	color: var(--cgreyscale200);
	float: right;
}

post.listing,
div.listing,
div.top-headline,
div.headline {
	cursor: pointer;
}

post.listing:hover a:not(.source-button),
div.listing:hover a:not(.source-button),
div.top-headline:hover a,
div.headline:hover a {
	text-decoration: underline;
}

post.listing:hover img.thumb,
div.listing:hover img.thumb,
div.top-headline:hover img.thumb,
div.headline:hover img.thumb {
	filter: brightness(90%);
}

post.article,
body.audio section,
body.bibliothek section,
body.gemerkt .posts-container,
body.woocommerce-checkout section,
body.debatten-des-monats section,
body.vertrag-kuendigen section,
body.fuer-lehrer section,
body.fuer-schueler section,
body.single-article_publisher section,
body.single-article_author section {
	display: block;
	max-width: 726px;
	margin: 0 auto;
}

.posts-container post.listing {
	margin-top: 20px;
}

post.info h1 {
	margin: 20px 0 6px;
}

post.info img {
	width: 70px;
	height: 70px;
	margin-right: 20px;
}

post.info img.flag {
	border-radius: 40px;
	object-fit: cover;
}

post img.brand {
	background-color: #fff;
	object-fit: contain;
}

a.source-button {
	color: var(--cgreyscale200);
	margin-right: 12px;
}

a.source-button img.brand,
a.source-button img.flag {
	width: 14px;
	height: 14px;
	margin-right: 6px;
	vertical-align: -2px;
}

a.source-button img.brand {
	border-radius: 2px;
	background: #fff;
}

.subtitle,
.content {
	color: var(--cgreyscale200);
}

.subtitle a,
.home-edition .headline .subtitle a,
.home-topics .headline .subtitle a {
	text-decoration: underline;
	text-decoration-color: var(--cgreyscale100);
}

.content {
	margin-top: 12px;
}

/* SCROLL CONTAINER */

.container-window {
	position: relative;
	overflow: hidden;
/*    height: 55rem;
	margin-bottom: -8rem;*/
}

.container-content {
	white-space: nowrap;
	overflow: scroll hidden;
	height: calc(100% + 50px);
	user-select: none;
}

/* RUBRICS BAR */

.catbar-container {
	margin: 20px 0 -30px;
	height: 70px;
}

body.search .catbar-container {
	margin-top: 0;
}

.catbar {
	font-size: 16px;
	font-weight: bold;
	list-style: none;
	padding: 0;
	margin: 0;
	text-align: center;
	white-space: nowrap;
	user-select: none;
	width: 100%;
	height: 100px;
}

.catbar li {
	display: inline;
}

.catbar a {
	text-decoration: none;
	display: inline-block;
	padding: 6px 12px;
	margin-right: 15px;
	border-radius: 20px;
	background-color: var(--cbgprimary);
	border: 1px solid var(--cgreyscale100);
}

.catbar a:hover,
.catbar a:active {
	background-color: var(--cbgsecondary);
}

.catbar a.selected {
	background-color: var(--cgreyscale400);
	border-color: var(--cgreyscale400);
	color: var(--cbgprimary);
}

/* CONTENT BOX LISTINGS */

post.type-post,
post.type-debate,
post.type-school_material,
post.type-teaching_plan,
post.type-school_quiz,
post.type-daily_topics,
post.type-daily_edition {
	display: block;
}

post.type-post,
post.type-school_material,
post.type-teaching_plan,
post.type-school_quiz,
post.type-daily_edition {
	margin-top: 12px;
	background: var(--cbgtertiary);
	border-radius: 12px;
	padding: 16px;
	min-height: 100px;
}

post.type-daily_edition {
	background: var(--cbuzzardlight);
	padding: 0;
	min-height: 140px;
	display: flex;
	align-items: center;
}

post.type-debate,
post.type-daily_topics {
	margin-top: 22px;
	min-height: 140px;
	position: relative;
	background-color: var(--cbgprimary);
}

post.type-post h4,
post.type-school_quiz h4,
post.type-teaching_plan h4,
post.type-school_material h4 {
	line-height: 1.2;
	margin: 6px 0 10px;
}

post.type-post h4 a,
post.type-school_material h4 a,
post.type-teaching_plan h4 a,
post.type-school_quiz h4 a,
post.type-debate h4 a,
post.type-daily_topics h4 a,
post.type-article_author h4 a,
post.type-article_publisher h4 a,
post.type-daily_edition h4 a {
	text-decoration: none;
	color: var(--cgreyscale400);
	word-break: break-word;
}

post.type-debate h4,
post.type-daily_topics h4,
post.type-daily_edition h4 {
	font-size: 18px;
	margin: 10px 0;
}

post.type-daily_edition h4 {
	margin: 10px 16px 0 0;
}

post img.thumb {
	border-radius: 8px;
	object-fit: cover;
}

post.type-daily_edition img.thumb {
	background: var(--cpastelbase);
	width: 140px;
	height: 140px;
	float: left;
	margin-right: 16px;
}

post.type-post img.thumb,
post.type-school_quiz img.thumb,
post.type-teaching_plan img.thumb,
post.type-school_material img.thumb {
	width: 100px;
	height: 100px;
	float: right;
	margin-left: 16px;
}

post.type-school_quiz img.thumb,
post.type-teaching_plan img.thumb,
post.type-school_material img.thumb,
body.home post.type-school_material img.thumb {
	width: auto;
	height: 115px;
	border-radius: 0;
	object-fit: unset;
	box-shadow: var(--cgreyscale150) -10px 10px 5px;
	margin: 0 0 15px 35px;
}

post.type-debate img.thumb,
post.type-daily_topics img.thumb {
	width: 240px;
	height: 130px;
	float: left;
	margin: 10px 26px 0 0;
	box-shadow: var(--stackshadows);
}

post.type-debate .subtitle,
post.type-daily_topics .subtitle {
	position: absolute;
	bottom: 0;
	left: 266px;
}

post.type-school_quiz .subtitle,
post.type-teaching_plan .subtitle,
post.type-school_material .subtitle {
	height: 40px;
}

post.type-school_quiz .subtitle,
post.type-teaching_plan .subtitle,
post.type-school_material .subtitle {
	height: 47px;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

post.type-school_quiz .subtitle p,
post.type-teaching_plan .subtitle p,
post.type-school_material .subtitle p {
	margin: 0;
	font-size: 16px;
}

post.type-article_author,
post.type-article_publisher {
	margin-top: 28px;
	position: relative;
	display: block;
	min-height: 60px;
}

post.type-article_author .text,
post.type-article_publisher .text {
	position: absolute;
	top: 0;
	left: 80px;
}

post.type-article_author .text .kicker,
post.type-article_publisher .text .kicker {
	margin: 0;
}

post.type-article_author img.thumb,
post.type-article_publisher img.thumb {
	width: 60px;
	height: 60px;
}

post.type-article_author img.thumb {
	border-radius: 35px;
}

post.type-article_publisher img.thumb {
	border-radius: 4px;
}

post.type-article_author h4,
post.type-article_publisher h4 {
	font-size: 18px;
	margin: 0;
}

/* KICKER */

post.type-post .kicker,
post.type-school_quiz .kicker,
post.type-teaching_plan .kicker,
post.type-school_material .kicker {
	margin: 0;
}

post.type-school_quiz .kicker,
post.type-teaching_plan .kicker,
post.type-school_material .kicker {
	color: var(--cbluebase);
}

.kicker {
	color: var(--cgreyscale200);
	font-weight: bold;
	margin-top: 28px;
}

fieldset post.type-debate .kicker,
fieldset post.type-daily_topics .kicker {
	margin-top: 0px;
}

h3.post-type.debate,
.kicker.debate,
post.type-debate .kicker {
	color: var(--cdangerbase);
}

.kicker.debate:after,
post.type-debate .kicker:after {
	content: ' 💥';
}

h3.post-type.daily_topic,
.kicker.daily_topic,
post.type-daily_topics .kicker,
post.type-daily_edition .kicker {
	color: var(--cbuzzardbase);
}

post.type-daily_edition .kicker {
	margin: 0;
}

/* BUTTON TOOLBAR */

.button-toolbar {
	text-align: right;
	margin: 38px 0 40px;
	border-bottom: 1px solid var(--cgreyscale100);
}

.button-toolbar div.switch-language {
	float: left;
	margin: -2px 0 0 -16px;
}

.button-toolbar .fal,
.button-toolbar .fas {
	font-size: 22px;
}

body:not(.single-daily_edition) a.parent + .button-toolbar {
	margin: 25px -5px 0 0;
}

.button-toolbar div,
.button-toolbar a {
	display: inline-block;
	cursor: pointer;
	margin: 0 0 10px 16px;
	color: var(--cgreyscale200);
	transition: color .3s ease-in-out;
}

.button-toolbar div.icons.print:before {
	margin: 0;
}

.button-toolbar div:hover,
.button-toolbar a:hover {
	color: var(--cgreyscale400);
}

.button-toolbar .fal.cta {
	background: var(--cgreyscale400);
	color: var(--cgreyscale050);
	box-sizing: border-box;
	width: 44px;
	height: 44px;
	border-radius: 22px;
	vertical-align: 1px;
	padding-top: 11px;
}

/* DAILY EDITION */

article.daily_edition a.float-left.back,
article.daily_edition a.parent {
	display: none;
}

hr {
	margin: 44px 0;
	border: 0;
	border-bottom: 1px solid var(--cgreyscale100);
}

.subtitle ul {
	list-style: none;
}

.subtitle li {
	line-height: 2.5;
}

.subtitle li:before {
	content: '– ';
}

/* ORIGINAL ARTICLE PARENT- AND SOURCE-BOX */

a.parent,
.sourcebox {
	display: block;
	background-color: var(--cbgtertiary);
	border-radius: 8px;
	padding: 16px;
	text-decoration: none;
	min-height: 46px;
}

a.parent img {
	height: 46px;
	width: 46px;
	border-radius: 4px;
	margin-right: 16px;
	float: left;
}

a.parent b {
	font-size: 16px;
}

.sourcebox {
	margin-top: 40px;
}

.sourcebox .lead,
.sourcebox .title {
	font-weight: bold;
}

.sourcebox .lead,
.sourcebox .info {
	color: var(--cgreyscale300);
}

.sourcebox .title {
	font-size: 16px;
	margin: 12px 0 10px;
}

.sourcebox .info {
	margin: 10px 0;
}

.sourcebox .info,
.sourcebox .note {
	font-size: 12px;
}

.sourcebox .note {
	color: var(--cgreyscale200);
}

.sourcebox a.button {
	width: -webkit-fill-available;
	width: -moz-available;
	width: stretch;
	text-align: center;
}

.sourcebox .info.note {
	margin-top: 16px;
}

.sourcebox .fa-circle-info {
	font-size: 32px;
	float: left;
	margin: 16px 16px 16px 8px;
}

/* PAGINATION */

.pagination {
	text-align: center;
	margin-top: 36px;
}

.pagination .page-numbers {
	padding: 8px 4px;
	font-weight: bold;
}

.pagination .page-numbers.current {
	background-color: var(--cgreyscale400);
	color: var(--cbgprimary);
	padding: 4px 8px;
	border-radius: 2px;
}

/* FOOTER */

.footer {
	text-align: center;
	color: var(--cgreyscale200);
	padding: 21px;
	border-top: 1px solid var(--cgreyscale100);
	margin-top: 36px;
	z-index: 1;
	background: var(--cbgprimary);
}

.footer a {
	color: var(--cgreyscale200);
	margin: 0px 9px;
	text-decoration-color: var(--cgreyscale100);
}

.footer .logo-short {
	text-decoration: none;
}

.footer .nav-center {
	margin-top: 4px;
	text-wrap: balance;
}

footer .menu-footer-container,
footer ul {
	display: inline;
}

footer ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

footer li {
	display: inline-block;
}

/* HOME */

body.home h1,
body.editionen h1 {
	font-size: 24px;
	text-align: center;
}

body.home fieldset,
body.editionen fieldset {
	padding: 24px;
}

body.home fieldset post img.thumb,
body.editionen fieldset post img.thumb {
	height: 130px;
	width: 130px;
}

body.home fieldset post.type-debate .subtitle,
body.home fieldset post.type-daily_topics .subtitle,
body.editionen fieldset post.type-debate .subtitle,
body.editionen fieldset post.type-daily_topics .subtitle {
	left: 156px;
}

/* HOME DEBATE */

.home-debate {
	background-color: var(--cbuzzardlight);
	padding: 24px;
	margin: 44px 0;
}

.home-debate h1 + span {
	text-align: center;
	display: block;
}

.home-debate hr {
	border-bottom-color: var(--cbuzzardsecond);
	margin: 24px 0 2px;
}

.home-debate .container-window {
	height: 345px;
}

.home-debate post {
	white-space: initial;
	display: inline-block;
	vertical-align: top;
	width: 240px;
	margin: 18px;
	background-color: transparent;
}

.home-debate post img.thumb {
	height: 160px;
	float: none;
	box-shadow: var(--stackshadows);
}

.home-debate post .kicker {
	margin-top: 8px;
}

.home-debate post h4 {
	font-size: 16px;
	line-height: 1.2;
}

.home-debate post .subtitle {
	position: unset;
}

.home-debate .button.light {
	font-size: 16px;
	display: block;
	width: 320px;
	text-align: center;
	margin: 16px auto 0;
	border-color: var(--cbuzzardsecond);
}

/* SINGLE DAILY EDITION */

body.single-daily_edition h2,
body.single-daily_edition h3.post-type {
	margin: 0 0 20px;
}

body.single-daily_edition .subtitle + h2 {
	margin: 20px 0;
}

body.single-daily_edition .license + .button-toolbar {
	margin-top: 12px;
	clear: both;
}

body.single-daily_edition .license + post.article {
	margin-top: 45px;
}

body.single-daily_edition .grid {
	grid-gap: 20px;
	margin-bottom: 40px;
}

body.single-daily_edition .grid div {
	border: 1px solid var(--cgreyscale100);
	border-radius: 8px;
	min-height: 155px;
	padding: 10px;
	position: relative;
}

body.single-daily_edition .grid div .fa-chevron-right.float-right {
	height: 100%;
	align-content: center;
}

body.single-daily_edition .grid div h3 a {
	text-decoration: none;
}

body.single-daily_edition .grid div .subtitle {
	position: absolute;
	bottom: 10px;
}

/* PAYWALL */

.paywall {
	border: 1px solid var(--cgreyscale100);
	border-radius: 8px;
	padding: 30px;
	box-sizing: border-box;
	max-width: 566px;
	margin: 30px auto;
}

.lb-content .paywall {
	border: 0;
	padding: 0;
	margin: 0;
}

.lb-content hr + .paywall {
	margin-top: 20px;
}

.paywall .paywall-content {
	border-bottom: 1px solid var(--cgreyscale100);
	padding-bottom: 20px;
	margin-bottom: 20px;
}

.lb-content .paywall .paywall-content {
	border: 1px solid var(--cgreyscale100);
	border-radius: 8px;
	padding: 30px;
}

.paywall .paywall-content h3 {
	margin-top: 0;
}

.paywall .paywall-content p {
	font-size: 16px;
}

.paywall .paywall-content .steps {
	display: inline-block;
	text-align: left;
	font-weight: bold;
	line-height: 34px;
	margin: 0;
}

.paywall .paywall-content .steps .spot {
	box-sizing: border-box;
	height: 20px;
	width: 20px;
	font-size: 12px;
}

.paywall .button:not(.light) {
	background-color: var(--cbuzzardbase);
	color: #fff;
}

.button span.icons.logo-short:before {
	color: inherit;
	height: 18px;
	width: 13px;
	vertical-align: bottom;
}

/* MAILCHIMP SIGN UP */

#mc_embed_shell {
	margin-top: 4rem;
	padding: 0;
}

#mc_embed_signup_scroll .list,
#mc_embed_signup_scroll ul {
	list-style: none;
	margin-top: 0;
}

#mc_embed_signup_scroll ul li:before {
	content: '✓';
	vertical-align: bottom;
}

/* KLARO & LIGHTBOX */

#klaro .cookie-modal,
.lb-popup {
	width: 100%;
	height: 100%;
	position: fixed;
	overflow: hidden;
	left: 0;
	top: 0;
	z-index: 1000;
}

#klaro .cookie-modal .cm-bg,
.lb-popup .lb-bg {
	background: var(--background);
	height: 100%;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	backdrop-filter: blur(2px);
}

.lb-popup .lb-content {
	width: fit-content;
	max-width: min(748px, 100dvw);
	max-height: 100dvh;
	box-sizing: border-box;
	margin: 0 auto;
	padding: 30px;
	position: relative;
	overflow-x: hidden;
	overflow-y: auto;
	top: 50%;
	transform: translateY(-50%);
	z-index: 1001;
	color: var(--cgreyscale400);
	background-color: var(--cbgprimary);
	border-radius: 12px;
	box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.2), 5px 5px 10px 0 rgba(0, 0, 0, 0.19);
}

iframe#print-pdf {
	width: min(688px, calc(100dvw - 320px));
	min-width: 100%;
	height: calc(100dvh - 190px);
	box-sizing: border-box;
	border: 1px solid var(--cgreyscale100);
	margin-top: 10px;
}

#klaro .cookie-modal .cm-btn {
	background-color: var(--cgreyscale400);
	color: var(--cbgprimary);
	font-weight: bold;
	border-radius: 20px;
}

#klaro h1.title {
	font-family: Sohne Dreiviertelfett Custom, sans-serif;
}

/* LOADER POPUP */

#loader .lb-content {
	box-sizing: border-box;
	border-radius: 16px;
	height: 155px;
	width: 240px;
	padding-top: 16px;
	font-size: 18px;
	text-align: center;
}

.lb-content .fal.fa-gear-complex,
#glossary .fal.fa-gear-complex {
	font-size: 40px;
	color: var(--cbuzzardbase);
	margin: 21px;
	animation: anim-rotate 3s infinite;
}

/* POPUP */

.lb-content .back-popup,
.lb-content .close-popup,
#glossary .close-popup {
	padding: 0;
	position: absolute;
	color: var(--cgreyscale150);
	text-decoration: none;
	z-index: 1;
}

.lb-content .back-popup {
	top: 15px;
	left: 12px;
}

.lb-content .close-popup,
#glossary .close-popup {
	top: 6px;
	right: 18px;
	font-size: 28px;
}

.lb-content .lb-post {
	margin-top: 10px;
}

.lb-content .lb-post post {
	margin-top: unset;
	background: unset;
	padding: unset;
	min-height: 165px;
	pointer-events: none;
}

.lb-content .lb-post post.type-debate img.thumb,
.lb-content .lb-post post.type-daily_topics img.thumb {
	height: 155px;
	float: right;
	margin: 10px 10px 0 26px;
}

.lb-content .lb-post post.type-school_quiz img.thumb,
.lb-content .lb-post post.type-teaching_plan img.thumb,
.lb-content .lb-post post.type-school_material img.thumb {
	height: 155px;
}

.lb-content .lb-post post.type-post img.thumb {
	width: 165px;
	height: 165px;
}

.lb-content  .lb-post post .kicker {
	margin-top: unset;
}


.lb-content .lb-post post h4 {
	font-size: 22px;
	margin: 10px 0 20px;
}

.lb-content .lb-post post.type-debate .subtitle,
.lb-content .lb-post post.type-daily_topics .subtitle {
	left: 0;
}

.lb-post + .boldlink {
	margin-top: 20px;
}

.lb-content hr {
	margin: 12px 0 4px;
}

.lb-content .buttons {
	text-align: right;
	margin-top: 10px;
}

.lb-content .buttons .button {
	padding: 13px 25px;
	margin: 10px 5px 0;
}

.lb-content .buttons .button small {
	font-weight: normal;
}

.lb-content .buttons .button.inactive {
	cursor: not-allowed;
}

.lb-content .buttons .button.light {
	padding: 12px 24px;
}

.button.icons.bookmark:before,
.button.icons.qrcode:before {
	width: 21px;
	height: 21px;
	margin-right: 10px;
	vertical-align: bottom;
}

.lb-content .bookmark-button .fal + span:after {
	content: 'Merken';
}

.lb-content .bookmark-button .fas + span:after {
	content: 'Gemerkt';
}

.popup-tab-buttons {
	margin-top: 16px;
}

.popup-tab-button {
	border: 1px solid var(--cgreyscale100);
	margin: 0 -1px -1px 0;
	padding: 14px 25px;
	display: inline-block;
	border-radius: 8px 8px 0 0;
	font-size: 16px;
	font-weight: bold;
	cursor: pointer;
}

.popup-tab-button.active {
	border-bottom-color: var(--cbgprimary);
	cursor: unset;
}

.lb-content .popup-tab {
	border: 1px solid var(--cgreyscale100);
	border-radius: 0 8px 8px;
	padding: 30px 20px 20px;
	display: none;
	overflow-x: auto;
	overflow-y: hidden;
}

.popup-tab > p {
	margin-top: 0;
}

.lb-content .popup-tab.one {
	display: block;
}

.lb-content .popup-tab .grid {
	grid-auto-flow: row;
	grid-template-columns: 1fr 1fr;
	grid-gap: 20px;
}

.lb-content .popup-tab .grid post {
	margin: 0;
}

.popup-tab .flex.inactive {
	position: relative;
}

.popup-tab .flex.inactive .button {
	position: absolute;
	top: 40%;
}

.popup-tab .flex.inactive .sidebar,
.popup-tab .flex.inactive .popup-tab-content {
	filter: blur(5px);
	pointer-events: none;
}

.popup-tab .sidebar a {
	display: block;
	margin-bottom: 20px;
	line-height: 24px;
	width: max-content;
	text-decoration: none;
	color: var(--cgreyscale200);
}

.popup-tab .sidebar a:hover {
	color: var(--cgreyscale300);
}

.popup-tab .sidebar a.active {
	color: var(--cgreyscale400);
	cursor: auto;
}

.popup-tab .flex .vline {
	padding: 0 0 0 10px;
	margin: 0 20px 0 0;
	border-right: 1px solid var(--cgreyscale100);
}

.lb-content .select-competency .kicker {
	margin-top: 0;
}

.lb-content .select-competency h2 {
	margin: 6px 0;
	font-size: 22px;
}

.lb-content .select-competency .grid {
	margin-top: 40px;
}

/* FORMS */

input,
#login form input,
body.woocommerce-page form .form-row .input-text,
select[multiple],
#create-account select,
.standalone-body form select,
#cancelcontract select,
body.woocommerce-account fieldset select,
.lb-content form select,
form.school select {
	background: var(--cbgtertiary);
	border-radius: 8px;
	border: 1px solid var(--cgreyscale100);
	font-size: 16px;
	padding: 9px 12px;
	font-family: inherit;
	color: var(--cgreyscale400);
	box-shadow: none;
	outline: 0;
}

input:focus,
#login form input:focus,
body.woocommerce-page form .form-row .input-text:focus,
select[multiple]:focus,
.standalone-body form select:focus,
#cancelcontract select:focus,
form.school select:focus {
	border-color: var(--cgreyscale200);
}

select[multiple] {
	overflow: hidden;
	margin-bottom: 20px;
	padding: 8px;
	font-size: inherit;
	font-family: inherit;
}

select[multiple] option {
	padding: 4px 8px;
	border-radius: 6px;
}

/* LOGIN PAGE */

#login {
	width: 350px;
}

#login p {
	font-family: inherit;
	font-size: initial;
}

#login h1 a {
	background: unset;
	mask-image: url(../img/svg/logo.svg);
	background-color: currentColor;
	width: 170px;
	height: 58px;
	color: var(--cgreyscale400);
}

#login .notice {
	color: #000;
}

#login .openid-connect-login-button {
	display: none;
}

#login form {
	color: var(--cgreyscale400);
	background-color: var(--cbgprimary);
	border: 0;
	padding: 0;
	margin-top: 60px;
}

#login form input[type=text],
#login form input[type=password] {
	margin-bottom: 16px;
}

#login form .forgetmenot {
	margin-top: 16px;
}

#login form input[type=submit] {
	color: var(--cbgprimary);
	background: var(--cgreyscale400);
	display: inline-block;
	border-radius: 30px;
	padding: 8px 18px;
	text-decoration: none;
	cursor: pointer;
	width: 100%;
	margin-top: 32px;
	font-size: 16px;
	font-weight: bold;
/*	cursor: not-allowed;
	pointer-events: none;*/
}

#login form input[type=submit]:hover {
	color: #000;
	background: var(--caccentbase);
}

#login #nav {
	padding: 0;
	text-align: center;
}

a.bold,
#login #nav a {
	font-size: 16px;
	font-weight: bold;
	text-decoration: underline;
	color: var(--cgreyscale400);
}

#login #nav a {
	display: inline-block;
	margin: 0 4px 16px;
}

/* MENU */

aside.sidebar {
	position: fixed;
	z-index: 2;
	background: var(--cbgprimary);
	border: 1px solid var(--cgreyscale100);
	top: 60px;
	left: 0;
	overflow: hidden auto;
	max-height: 90%;
	transition: all .3s ease-in-out;
	opacity: 1;
	box-shadow: 4px 4px 4px 0px rgba(0,0,0,0.05);
}

aside.sidebar.hide {
	transform: translateX(-103%);
	opacity: 0;
}

aside.sidebar ul.menu li {
	color: var(--cgreyscale400);
}

ul.faq li:has(div.hidden):after,
aside ul.menu li:has(ul):after {
	mask-image: url(../img/svg/down.svg);
	width: 12px;
	height: 6px;
	top: 24px;
}

aside ul.menu li:has(ul.show):after {
	mask-image: url(../img/svg/up.svg);
}

aside.sidebar ul.menu li ul.sub-menu {
	list-style: none;
	padding: 0;
	margin: 0;
	font-weight: normal;
}

aside.sidebar ul.menu li ul.sub-menu li {
	border: 0;
}

aside.sidebar ul.menu li ul.sub-menu li:after {
	content: none;
}

aside.sidebar ul.menu li ul.sub-menu li a {
	height: 0;
	padding: 0;
	opacity: 0;
	overflow: hidden;
	transition: all .3s ease-in-out;
}

aside.sidebar ul.menu li ul.sub-menu.show li a {
	height: 21px;
	padding: 2px 48px 18px 16px;
	opacity: 1;
}

#menu-item-338593 {
	display: none;
}

body.user-administrator #menu-item-338593,
body.user-sponsor-admin #menu-item-338593,
body.premium-user.user-school-admin #menu-item-338593,
body.premium-user.user-teacher #menu-item-338593 {
	display: list-item;
}

/* ACCOUNT */

body.woocommerce-account section {
	max-width: none;
}

body.woocommerce-account .woocommerce {
	display: flex;
}

body.woocommerce-account:not(.konto-onboarding) .woocommerce :not(.inside) > p,
body.woocommerce-account .woocommerce input,
body.woocommerce-account .woocommerce table {
	font-family: inherit;
	font-size: inherit;
}

body.woocommerce-account .woocommerce table {
	border-color: var(--cgreyscale100);
}

body.woocommerce-account .woocommerce-MyAccount-navigation {
	float: none;
	width: auto;
	height: fit-content;
	margin: 40px 40px 0 0;
	border: 1px solid var(--cgreyscale100);
	border-radius: 12px;
	vertical-align: top;
}

aside ul.menu,
ul.quicklinks,
ul.faq,
body.woocommerce-account .woocommerce-MyAccount-navigation ul {
	list-style: none;
	padding: 18px;
	margin: 0;
	font-size: 16px;
	font-weight: bold;
}

aside ul.menu {
	padding-bottom: 4px;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul {
	padding: 4px 18px;
}

aside ul.menu li,
body.woocommerce-account .woocommerce-MyAccount-navigation li {
	position: relative;
	color: var(--cgreyscale200);
	border-bottom: 1px solid var(--cgreyscale100);
}

aside ul.menu li:last-of-type,
body.woocommerce-account .woocommerce-MyAccount-navigation li:last-of-type {
	border-bottom: 0;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active {
	color: var(--cgreyscale400);
}

aside ul.menu li:after,
ul.quicklinks li:after,
ul.faq li:after,
body.woocommerce-account .woocommerce-MyAccount-navigation li:after {
	content: '';
	display: inline-block;
	background-color: currentColor;
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center right;
	mask-image: url(../img/svg/next.svg);
	width: 6px;
	height: 12px;
	position: absolute;
	top: 20px;
	right: 6px;
	cursor: pointer;
	pointer-events: none;
}

aside ul.menu a,
body.woocommerce-account .woocommerce-MyAccount-navigation a {
	display: block;
	white-space: nowrap;
	padding: 16px 48px 16px 6px;
	text-decoration: none;
}

body.woocommerce-account li.woocommerce-MyAccount-navigation-link--customer-logout {
	color: var(--cdangercontrast);
}

body.woocommerce-account li.woocommerce-MyAccount-navigation-link--customer-logout:after {
	mask-image: none;
	background-color: transparent;
}

body.woocommerce-account .woocommerce-MyAccount-content {
	float: none;
	width: -webkit-fill-available;
	width: -moz-available;
	width: stretch;
	margin: 40px 0 0 0;
}

div.woocommerce-notices-wrapper + fieldset {
	margin-top: -9px;
}

body.woocommerce-account .woocommerce-MyAccount-content li {
	line-height: 2;
	margin-bottom: 20px;
}

body.woocommerce-account table.my_account_orders td,
body.woocommerce-account table.my_account_orders th {
	height: 42px;
	overflow: hidden;
	text-overflow: ellipsis;
	border-color: var(--cgreyscale100);
}

body.woocommerce-account fieldset .button,
body.woocommerce-account table.my_account_orders .button {
	padding: 6px 14px;
}

body.woocommerce-account fieldset select.simplified_grades {
	float: right;
	margin-bottom: 16px;
}

li h3 {
	margin: 0;
}

/* CONTRACT */

#lightbox #contract iframe {
	border: 1px solid var(--cgreyscale100);
	height: calc(100dvh - 150px);
	width: calc(100dvw - 100px);
	max-width: 850px;
	margin-bottom: 20px;
}

#lightbox .sign-contract,
#lightbox .signature,
#signature64 {
	display: none;
	text-align: center;
}

#lightbox .kbw-signature {
	width: 846px;
	height: 300px;
	display: inline-block;
}

#lightbox .kbw-signature-disabled {
	opacity: 0.35;
}

#lightbox #sig canvas {
	width: 100%;
	height: auto;
	border: 1px solid var(--cgreyscale100);
}

/* HIDDEN */

#user_switching_switch_on,
body.login #login #backtoblog,
body.login #login .privacy-policy-page-link,
body.woocommerce-checkout .woocommerce-form-coupon-toggle,
body.woocommerce-checkout #customer_details.col2-set .col-2,
body.woocommerce-checkout #billing_company_field,
body.woocommerce-checkout #billing_address_1_field,
body.woocommerce-checkout #billing_city_field,
body.woocommerce-checkout #billing_postcode_field,
body.woocommerce-checkout #billing_country_field,
body.woocommerce-checkout .about_paypal,
body.woocommerce-checkout .payment_method_invoice,
body.woocommerce-checkout #payment div.payment_box::before,
body.woocommerce-checkout table.shop_table th.product-name,
body.woocommerce-checkout table.shop_table th.product-total,
body.woocommerce-checkout table.shop_table tr.cart-subtotal,
body.woocommerce-checkout table.shop_table tr.recurring-totals,
body.woocommerce-checkout .woocommerce-thankyou-order-details ~ p,
body.woocommerce-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--members-area,
body.woocommerce-page input.button:disabled {
	display: none;
}

body.woocommerce-checkout #customer_details.col2-set .col-1 {
	float: none;
	width: 100%;
}

/* CHECKOUT */

body.woocommerce-checkout .woocommerce,
body.woocommerce-checkout .woocommerce label,
body.woocommerce-checkout .woocommerce .button {
	font-family: 'Sohne Buch Custom';
	font-size: 16px;
}

body.woocommerce-checkout .woocommerce h3 {
	font-size: 22px;
}

body.woocommerce-checkout #payment {
	background: transparent;
}

body.woocommerce-checkout #payment ul.payment_methods {
	border: 0;
	padding: 0;
}

body.woocommerce-checkout #payment ul.payment_methods li {
	line-height: 3.5;
}

body.woocommerce-checkout #payment .payment_method_paypal img {
	max-width: 51px;
	border-radius: 0;
}

body.woocommerce-checkout #payment div.payment_box {
	background: transparent;
	color: var(--cgreyscale200);
	padding: 0 0 0 32px;
	margin-top: -24px;
}

body.woocommerce-checkout #payment div.payment_box p {
	font-family: inherit;
	font-size: inherit;
}

body.woocommerce-checkout #payment div.form-row {
	padding: 0;
}

body.woocommerce-checkout .checkbox-legal label span {
	display: inline-block;
	line-height: 1.27375;
	width: calc(100% - 40px);
	vertical-align: text-top;
}

body.woocommerce-checkout table.shop_table {
	background: transparent;
	padding: 16px;
	border-radius: 8px;
}

body.woocommerce-checkout table.shop_table td,
body.woocommerce-checkout table.shop_table tfoot th,
body.woocommerce-checkout table.shop_table tfoot td {
	border-top: 0;
}

body.woocommerce-checkout table.shop_table th,
body.woocommerce-checkout table.shop_table tfoot th {
	font-weight: normal;
}

body.woocommerce-checkout table.shop_table td.product-name,
body.woocommerce-checkout table.shop_table td.product-total {
	font-weight: bold;
}

body.woocommerce-checkout table.shop_table td small {
	font-weight: bold;
	font-size: inherit;
}

body.woocommerce-checkout .place-order {
	text-align: center;
}

body.woocommerce-checkout .wdgk_donation_content a {
	width: calc(100% / 3 - 53px);
	border-radius: 50px !important;
}

body.woocommerce-checkout .wdgk_donation_content a sub {
	display: block;
}

body.woocommerce-checkout .wdgk_donation_content a span {
	font-size: small;
}

/* STANDALONE HEADER */

body.woocommerce-checkout header,
body.fuer-lehrer header,
body.fuer-schueler header,
body.angebot-schulen header,
body.angebot-schultraeger header,
body.angebot-medienzentren header,
body.angebot-bayern header,
body.angebot-thueringen header,
body.angebot-thueringen-einzelaccounts header,
body.schullizenz-bestellen header,
body.registrieren header {
	display: none;
}

.standalone-header,
.standalone-header p {
	text-align: center;
	hyphens: none;
}

.standalone-header .icons.logo:before {
	width: 170px;
	height: 58px;
	margin: 80px 0 20px;
}

/* STANDALONE BODY */

.standalone-body {
	margin-top: 40px;
}

.standalone-body form input[type=submit] {
	display: block;
	margin: 60px auto 0;
}

/* WOOCOMMERCE */

.woocommerce-message {
	outline: 0;
}

/* REGISTRIEREN */

div#ca-background {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 70px;
	right: 50%;
	z-index: 0;
	background-image: url(../img/customer.jpeg);
	background-position: top center;
	background-size: cover;
	transition: background-image .4s ease-in-out;
}

div#create-account {
	min-height: calc(100dvh - 166px);
	align-content: center;
	position: relative;
	left: 50%;
	width: 50dvw;
}

div#create-account .button {
	padding: 8px 14px;
	min-width: 60%;
	margin-top: 0;
}

div#ca-container {
	margin: 60px auto 0;
	max-width: 365px;
}

#ca-container a.back {
	position: absolute;
	top: 14px;
	left: 14px;
}

#create-account h1 a.icons.logo {
	display: block;
	margin-bottom: 20px;
}

#create-account h4.sub {
	display: none;
}

#create-account fieldset.notice.error {
	padding: 0;
	margin: 0 0 20px;
	border-color: var(--cdangerbase);
}

#create-account fieldset.notice.error legend {
	color: var(--cdangerbase);
}

div.selection {
	height: 272px;
}

div.selection.custom {
	height: 330px;
}

div.selection h1 {
	margin-top: 30px;
}

form.verification {
	height: 240px;
}

label.sequence {
	height: 72px;
	margin-bottom: 8px;
}

div.selection,
form.verification,
label.sequence {
	display: block;
	opacity: 1;
	overflow: hidden;
	transition: all .4s ease-in-out;
}

div.selection.hide,
form.verification.hide,
label.sequence.hide,
#create-account progress.hide,
#create-account #counter.hide {
	height: 0;
	margin: 0;
	opacity: 0;
}

#create-account .skip {
	display: none;
}

label.sequence input:not([type=checkbox]),
label.sequence select {
	display: block;
	width: -webkit-fill-available;
	width: -moz-available;
	width: stretch;
}

#create-account .select2.select2-container--default .select2-selection--multiple,
#create-account .select2.select2-container--focus .select2-selection--multiple {
	height: 41px;
}

#create-account .select2.select2-container--default .select2-selection--multiple .select2-selection__choice {
	padding: 9px;
	margin: 0;
	border: 0;
}

#create-account .select2-selection__choice__remove {
	margin-right: 8px;
}

#create-account .select2-search__field {
	font-size: 16px;
	padding: 4px 12px;
}

/* PROGRESS */

#create-account progress {
	width: 90%;
	border-radius: 16px;
	height: 16px;
	opacity: 1;
}

progress::-webkit-progress-bar {
	background-color: var(--cgreyscale100);
	border-radius: 16px;
}

progress::-webkit-progress-value {
	background-color: var(--cbuzzardbase);
	border-radius: 16px;
	transition: all 1s ease-in-out;
}

#create-account #counter {
	height: 1em;
	opacity: 1;
}

/* SELECT2 */

body .select2-container {
	width: auto;
	max-width: calc(100dvw - 24px);
}

.select2 .select2-dropdown,
.select2 .select2-selection {
	background-color: var(--cbgtertiary);
	border: 1px solid var(--cgreyscale100);
	border-radius: 0;
}

.select2.select2-container--default .select2-selection--multiple,
.select2.select2-container--default .select2-selection--multiple .select2-selection__choice {
	background-color: var(--cbgtertiary);
	border-color: var(--cgreyscale100);
	border-radius: 8px;
	outline: 0;
}

.select2.select2-container--focus .select2-selection--multiple,
.select2.select2-container--focus .select2-selection--multiple .select2-selection__choice {
	border-color: var(--cgreyscale200);
}

/* HAMBURGER MENU ANIMATION */

#hamburger svg {
	stroke: currentColor;
	width: 30px;
	height: 30px;
	vertical-align: -7px;
}

#hamburger svg path {
	transform-origin: 50% 8px;
	transition: stroke .3s ease-in-out;
}
#hamburger svg path:nth-of-type(1) {
	animation: hamburgerTopReset .3s ease-in-out forwards;
}
#hamburger svg path:nth-of-type(2) {
	transform-origin: 50% 15px;
	animation: hamburgerMiddleReset .3s ease-in-out forwards;
}
#hamburger svg path:nth-of-type(3) {
	transform-origin: 50% 22px;
	animation: hamburgerBottomReset .3s ease-in-out forwards;
}

#hamburger.is-open svg path:nth-of-type(1) {
	animation: hamburgerTopDeform .3s ease-in-out forwards;
}
#hamburger.is-open svg path:nth-of-type(2) {
	animation: hamburgerMiddleDeform .3s ease-in-out forwards;
}
#hamburger.is-open svg path:nth-of-type(3) {
	animation: hamburgerBottomDeform .3s ease-in-out forwards;
}

@keyframes hamburgerTopReset {
	0% {
		transform: translateY(7px) rotate(45deg);
	}
	50% {
		transform: translateY(7px) rotate(0deg);
	}
	100% {
		transform: translateY(0) rotate(0deg);
	}
}

@keyframes hamburgerMiddleReset {
	0% {
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		opacity: 1;
	}
}

@keyframes hamburgerBottomReset {
	0% {
		transform: translateY(-7px) rotate(-45deg);
	}
	50% {
		transform: translateY(-7px) rotate(0deg);
	}
	100% {
		transform: translateY(0) rotate(0deg);
	}
}

@keyframes hamburgerTopDeform {
	0% {
		transform: translateY(0) rotate(0deg);
	}
	50% {
		transform: translateY(7px) rotate(0deg);
	}
	100% {
		transform: translateY(7px) rotate(45deg);
	}
}

@keyframes hamburgerMiddleDeform {
	0% {
		opacity: 1;
	}
	50% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

@keyframes hamburgerBottomDeform {
	0% {
		transform: translateY(0) rotate(0deg);
	}
	50% {
		transform: translateY(-7px) rotate(0deg);
	}
	100% {
		transform: translateY(-7px) rotate(-45deg);
	}
}

/* GRID */

.grid {
	display: grid;
}

.grid.col-2 {
	grid-template-columns: 1fr 1fr;
}

.grid.col-3 {
	grid-template-columns: 1fr 1fr 1fr;
}

.colspan-2 {
	grid-column: span 2;
}

.colspan-2 h2 {
	margin: -10px 0 -20px;
}

.home-edition hr,
.home-perspectives hr,
.home-topics hr,
.home-mostread hr {
	margin: 0;
}

.home-teacher hr {
	margin: 24px 0 20px;
}

.home-teacher h1 + span {
	text-align: center;
	display: block;
}

.home-edition .grid {
	grid-gap: 38px;
	padding: 0;
}

.home-topics .grid,
.grid.perspectives {
	grid-gap: 38px;
	padding: 40px 0 20px;
}

.home-edition .top-headline,
.home-edition .headline,
.home-topics .headline {
	grid-column: span 2;
}

.home-edition .top-headline > .kicker {
	margin-top: 0;
}

.home-edition .top-headline h4 {
	font-size: 28px;
	margin: 10px 0 20px;
}

.home-edition .top-headline .subtitle {
	margin-top: 30px;
}

.home-edition .top-headline .content {
	color: var(--cgreyscale400);
	height: 7em;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	margin-bottom: 22px;
}

.home-edition .headline .text,
.home-topics .headline .text {
	width: calc(50% - 19px);
	margin-right: 19px;
}

.home-edition .headline .kicker,
.home-topics .headline .kicker {
	margin-top: 0;
}

.home-edition .headline h4,
.home-topics .headline h4 {
	font-size: 24px;
	margin: 10px 0 18px;
}

.home-topics .title h1 {
	text-align: left;
}

.home-edition .top-headline a,
.home-edition .headline a,
.home-topics .headline a {
	text-decoration: none;
}

.home-edition .headline .content,
.home-topics .headline .content {
	color: var(--cgreyscale400);
	height: 11em;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 5;
	-webkit-box-orient: vertical;
}

.home-edition .headline img.thumb,
.home-topics .headline img.thumb {
	height: 312px;
	float: right;
	width: calc(50% - 19px);
}

.home-perspectives .title + div {
	grid-column: span 2;
}

.home-perspectives .grid:last-of-type,
.home-mostread .grid:last-of-type {
	padding-bottom: 0;
}

.home-edition h1 + hr + .grid,
.home-perspectives h1 + hr + .grid,
.home-topics h1 + hr + .grid,
.home-mostread h1 + hr + .grid {
	padding-top: 20px;
}

.home-edition .button,
.home-topics .button {
	min-width: 250px;
	margin-left: 5px;
	margin-right: 5px;
	font-size: 16px;
}

.home-perspectives .grid div:nth-of-type(6) {
	display: none;
}

.grid.perspectives div img.thumb {
	height: 177px;
}

.grid.perspectives div .kicker {
	margin-top: 12px;
}

.grid.perspectives div h4 {
	margin: 10px 0 20px;
}

.grid.perspectives a {
	text-decoration: none;
}

.grid.perspectives .license {
	display: none;
}

.home-perspectives .title + div .license {
	display: block;
}

.home-perspectives .title + div img.thumb {
	height: 290px;
}

.home-perspectives .title + div .kicker {
	margin-top: 30px;
}

.home-perspectives .title {
	background: var(--cbuzzardlight);
	padding: 40px;
	align-content: center;
}

.home-perspectives .title + div h4 {
	font-size: 24px;
}

.home-perspectives .title .button.light {
	margin-top: 60px;
	width: -webkit-fill-available;
	width: -moz-available;
	width: stretch;
	font-size: 16px;
	position: relative;
	border-color: var(--cbuzzardsecond);
}

.home-perspectives .title .button.light span {
	display: inline-block;
}

.home-perspectives .title .button.light span.icons {
	position: absolute;
	top: 0;
	bottom: 0;
	align-content: center;
}

.home-topics .title {
	background: var(--cbuzzardlight);
	grid-column: span 2;
	padding: 20px;
}

.home-topics div.center + hr {
	margin-top: 20px;
}

.home-topics div.center + hr + .grid {
	padding-top: 20px;
}

/* UNTERRICHTSMATERIAL */

form.school {
	text-align: center;
	margin: 20px 0 40px;
}

form.school label {
	display: inline-block;
	text-align: left;
	margin: 0 10px;
}

form.school select {
	margin-top: 8px;
}

div.school.heading {
	position: relative;
	padding: 30px 40px 20px;
}

div.school.heading:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: url(../img/class.jpeg) center;
	background-size: cover;
	filter: brightness(0.35);
	border-radius: 8px;
}

div.school.material.heading:before {
	background-image: url(../img/material.jpeg);
}

div.school.library.heading:before {
	background-image: url(../img/library.jpeg);
}

div.school.groups.heading:before {
	background-image: url(../img/group.jpeg);
}

div.school.exercises.heading:before {
	background-image: url(../img/exercises.jpeg);
}

div.school.heading .inside {
	position: relative;
	color: #fff;
}

div.school.heading .inside,
div.school.heading .inside p {
	text-align: center;
}

body.schule fieldset {
	padding: 30px;
}

post.school.article {
	max-width: none;
}

post.school.article .kicker {
	margin: 0 0 20px;
}

post.school.article h1 {
	clear: both;
	font-size: 28px;
	margin: 20px 0 40px;
}

post.school.article .grid div {
	position: relative;
}

post.school.article .grid div:nth-of-type(odd) {
	padding: 0 60px 0 0;
	border-right: 1px solid var(--cgreyscale100);
}

post.school.article .grid div:nth-of-type(2) {
	padding-left: 60px;
	grid-row: span 2;
}

post.school.article .grid div:nth-of-type(3) {
	align-content: end;
}

post.school.article h3,
post.school.article .grid p:nth-of-type(1) {
	margin-top: 0;
}

post.school.article .details {
	border-top: 1px solid var(--cgreyscale100);
	margin-top: 20px;
	font-size: 16px;
	font-family: Charter Regular Custom;
}

post.school.article .details p {
	font-size: inherit;
}

/* SCROLL BUTTON */

.scroll-button {
	position: absolute;
	z-index: 1;
	padding: 8px 9px;
	background: var(--cbgprimary);
	border-radius: 20px;
	cursor: pointer;
	text-decoration: none;
	border: 1px solid var(--cgreyscale100);
}

.scroll-button.right {
	top: 0;
	right: 0;
}

.scroll-button.right:before {
	margin: 0 5px;
}

.scroll-button:hover ,
.scroll-button:active {
	background: var(--cgreyscale100);
}

.home-debate .scroll-button {
	background-color: var(--cbuzzardlight);
	top: 152px;
}

/* ACCESS VERSION */

.access-version {
	color: var(--cbuzzardbase);
	margin-top: 36px;
	opacity: 1;
	transition: all .3s ease-in-out;
}

nav.small .access-version {
	margin-top: 0;
	opacity: 0;
}

img.size-medium {
	border-radius: 0;
	width: auto;
}

img.align-left {
	float: left;
	margin-right: 40px;
}

/* LEGACY REGISTIERUNG */

body.fuer-lehrer .standalone-body form select,
body.fuer-schueler .standalone-body form select,
body.fuer-lehrer .standalone-body form input:not([type=checkbox]),
body.fuer-schueler .standalone-body form input:not([type=checkbox]) {
	width: calc(50% - 85px);
}

.standalone-body select#state + .select2-container {
	max-width: calc(50% - 60px);
}

.standalone-body #school-container .select2 {
	width: 100% !important;
}

.standalone-body #school-container .select2 .select2-selection {
	height: 70px;
	margin-bottom: 16px;
}

.standalone-body #school-container .select2 li {
	width: -webkit-fill-available;
	width: -moz-available;
	width: stretch;
	text-align: center;
}

.standalone-body select#grade {
	position: relative;
	z-index: 2;
}

/* INTRO */

.intro {
	max-width: 640px;
	margin: 0 auto;
}

.intro.yellow {
	background: var(--caccentbase);
	color: #000;
	padding: 2px 24px;
}

.intro.yellow .button:hover {
	background: var(--cbgprimary);
	color: var(--cgreyscale400);
}

.intro.yellow center:last-child {
	margin-bottom: 18px;
}

.intro td {
	padding: 0 20px;
}

.intro img {
	height: 132px;
	max-width: unset;
}

.intro img.qrcode {
	image-rendering: pixelated;
}

.circle {
	background: var(--cbuzzardbase);
	color: #fff;
	padding: 7px 12px;
	border-radius: 20px;
}

/* TOP BANNER */

.top-banner {
	text-align: center;
	border: 1px solid var(--cgreyscale100);
	margin-top: 20px;
	padding: 20px;
	max-width: 984px;
}

.top-banner h3 {
	margin: 0;
}

.top-banner span {
	vertical-align: text-top;
	display: inline-block;
}

.top-banner img {
	max-height: 60px;
	margin: 5px 10px;
}

/* WOOCOMMERCE NOTIFICATION MESSAGE */

body .woocommerce-error, body .woocommerce-info, body .woocommerce-message {
	z-index: 1;
	width: fit-content;
	margin: auto;
}

/* STRIPE */

fieldset#wc-stripe-upe-form {
	border: 0;
	padding: 0;
}

/* ACCOUNT SUBMENU */

.nav-tab-wrapper {
	border-bottom: 1px solid var(--cgreyscale100);
	margin: 0 0 30px;
	padding-top: 9px;
	padding-bottom: 0;
	line-height: 2;
	text-align: center;
	text-wrap: balance;
}

.nav-tab {
	border: 1px solid var(--cgreyscale100);
	margin: 0 3px -1px;
	padding: 5px 10px;
	color: var(--cgreyscale200);
	text-decoration: none;
	display: inline-block;
}

.nav-tab:hover {
	color: var(--cgreyscale300);
}

.nav-tab.current {
	color: var(--cgreyscale400);
	border-bottom: 1px solid var(--cbgprimary);
}

/* FONTS */

@font-face {
	font-family:'Sohne Buch Custom';
	src:url('../img/fonts/Sohne_Buch.ttf') format('truetype');
	font-weight:400;
	font-style:normal;
	font-display:block;
}

@font-face {
	font-family:'Sohne Dreiviertelfett Custom';
	src:url('../img/fonts/Sohne_Dreiviertelfett.ttf') format('truetype');
	font-weight:700;
	font-style:normal;
	font-display:block;
}

@font-face {
	font-family:'Charter Regular Custom';
	src:url('../img/fonts/Charter_Regular.ttf') format('truetype');
	font-weight:400;
	font-style:normal;
	font-display:block;
}

/* CANCEL CONTRACT FORM */

.standalone-body form,
form#cancelcontract {
	line-height: 4;
}

.standalone-body form label,
form#cancelcontract label {
	display: inline-block;
	width: 50%;
	text-align: right;
	margin-right: 12px;
}

.standalone-body form label:has(input) {
	width: auto;
	line-height: 1.5;
}

form#cancelcontract .cancelreason,
form#cancelcontract #canceldate {
	visibility: hidden;
}

/* SWITCH BUTTON */

.switch-button {
	width: 255px;
	vertical-align: middle;
	margin-top: -1px;
}

body.woocommerce-account .switch-button {
	float: right;
	margin-bottom: 16px;
}

.button-toolbar .switch-button {
	transform: scale(0.8);
	margin: -5px -25px;
}

.switch-button > label.switch-button-inner {
	height: 30px;
	background: #fff;
	color: #888;
	border-radius: 26px;
	border: 1px #e0dce3 solid;
	overflow: hidden;
	position: relative;
	display: block;
}

.switch-button > label.switch-button-inner:before {
	content: attr(data-on);
	position: absolute;
	top: 6px;
	right: 0;
	cursor: pointer;
	width: 50%;
	text-align: center;
}

.switch-button > label.switch-button-inner:after {
	content: attr(data-off);
	width: calc(50% - 18px);
	text-align: center;
	background: #000;
	color: #fff;
	border-radius: 26px;
	position: absolute;
	left: 0;
	top: 0;
	transition: all 0.3s ease;
	padding: 5px 9px;
	cursor: pointer;
	min-height: 20px;
}

.switch-button > label.switch-button-inner:hover:after {
	background: #fbed4d;
	color: #000;
}

.switch-button input[type="checkbox"] {
	opacity: 0;
	position: absolute;
}

.switch-button input[type="checkbox"]:checked + label.switch-button-inner:after {
	content: attr(data-on);
	left: 50%;
}

.switch-button input[type="checkbox"]:checked + label.switch-button-inner:before {
	content: attr(data-off);
	right: auto;
	left: 0;
	width: 50%;
	text-align: center;
}

/* ONBOARDING */

body.konto-onboarding .woocommerce {
	display: block;
}

body.konto-onboarding .woocommerce-MyAccount-navigation {
	margin: 40px 0 0;
	text-wrap: balance;
	text-align: center;
	border: 0;
	border-radius: 0;
	margin: 0;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--cgreyscale100);
}

body.konto-onboarding .woocommerce-MyAccount-navigation ul {
	padding: 0;
}

body.konto-onboarding .woocommerce-MyAccount-navigation li {
	display: inline-block;
	margin-right: 16px;
	border: 0;
}

body.konto-onboarding .woocommerce-MyAccount-navigation li a {
	padding: 14px 18px 0 0;
}

div.school.heading .inside p {
	font-size: 20px;
}

div.school.heading.teacher:before {
	background: url(../img/teachers.jpeg) center;
}

div.school.heading.admin:before {
	background: url(../img/admin.jpeg) center;
}

div.school.heading.region:before {
	background: url(../img/region.jpeg) center;
}

div.group {
	border: 1px solid var(--cgreyscale100);
	border-radius: 12px;
	padding: 40px;
	margin-top: 40px;
	text-align: center;
	background-color: var(--background);
}

div.group .fa-circle-exclamation {
	color: #E92C64;
	font-size: 20px;
}

div.group .fa-circle-check {
	color: #007A66;
	font-size: 20px;
}

div.group.grey {
	background-color: var(--cgreyscale050);
}

div.group.grey div.fal {
	font-size: 30px;
	color: var(--cgreyscale200);
}

div.group.side {
	padding: 24px;
	text-align: left;
	font-size: 16px;
}

div.group.side h1 {
	font-size: 28px;
}

.group.side p {
	margin-top: 0;
}

div.group div.icons:before {
	width: 32px;
	height: 30px;
	color: var(--cgreyscale200);
}

div.group a:has(.fa-arrow-up-right) {
	text-decoration: none;
}

div.group.small,
div.group.task {
	display: inline-block;
	margin: 20px;
	vertical-align: top;
}

div.group.task {
	max-width: 190px;
}

div.group.task div.icons:before {
	width: 50px;
	height: 50px;
	color: var(--cgreyscale400);
}

div.group.task div.fal {
	font-size: 50px;
	color: var(--cgreyscale400);
}

div.group.task p {
	color: var(--cgreyscale200);
}

div.group.task p b {
	color: var(--cgreyscale400);
}

div.group.task a:has(.fa-arrow-up-right) {
	font-size: 16px;
	font-weight: bold;
}

div.group.guide {
	margin: 0;
	padding: 20px;
}

h3:has(+ div.group.guide) {
	margin: 44px 0 10px;
	text-align: left;
}

div.group.guide .left,
div.group.guide .left p {
	text-align: left;
}

div.group.guide h2 {
	margin-top: 0;
}

div.group.guide li {
	font-family: Charter Regular Custom, serif;
	font-size: initial;
	line-height: initial;
	margin-bottom: 10px;
}

div.group.guide img.border {
	border: 1px solid var(--cgreyscale100);
}

div.group p {
	font-size: 16px;
	text-align: center;
}

body.konto-onboarding fieldset.school {
	border-radius: 12px;
	padding: 40px;
	margin-top: 40px;
}

body.konto-onboarding fieldset.school h2 {
	text-align: center;
}

/* VIDEOS */

.grid.col-3.videos {
	grid-gap: 20px;
	margin-top: 40px;
}

.group.small.video {
	margin: 0;
	padding: 0;
	text-align: left;
	cursor: pointer;
}

.group.small.video .thumb {
	position: relative;
}

.group.small.video img {
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}

.group.small.video:hover img {
	filter: brightness(96%);
}

.group.small.video .playfull {
	background: url(../img/svg/playfull.svg);
	display: inline-block;
	height: 48px;
	width: 48px;
	position: absolute;
	top: calc( 50% - 24px );
	left: calc( 50% - 24px );
	transition: all .1s ease-in-out;
	z-index: 1;
}

.group.small.video:hover .playfull {
	transform: scale(1.2);
}

.group.small.video .title {
	font-size: 16px;
	font-weight: bold;
	margin: 20px 10px 10px;
}

.steps .spot,
.group.small.video .title .spot,
.lb-content .video h2 .spot {
	color: var(--cbgprimary);
	background: var(--cgreyscale400);
	border-radius: 1em;
	text-align: center;
	margin-right: 10px;
	display: inline-block;
	width: 26px;
	height: 24px;
	padding-top: 2px;
	font-size: 16px;
	vertical-align: text-bottom;
}

.group.small.video .title .text {
	display: inline-flex;
	width: calc(100% - 36px);
	white-space: initial;
}

.group.small.video:hover .title .text {
	text-decoration: underline;
}

.group.small.video p {
	margin: 10px;
	text-align: left;
}

.lb-content .video h2 {
	margin-top: 0;
	text-align: center;
}

.lb-content .video video {
	margin: 0 -30px;
	width: calc(100% + 60px);
}

.lb-content .video p {
	margin-bottom: 0;
}

/* FILE THUMBNAIL */

.file-thumb {
	display: inline-block;
	height: 200px;
	width: 200px;
	background-color: var(--cgreyscale100);
	align-content: center;
}

.file-thumb img {
	height: auto;
	width: auto;
	border-radius: 0;
	box-shadow: var(--cgreyscale150) -20px 20px 10px;
}

/* TOGGLE FAQ */

div.group.faq {
	padding: 4px 20px;
}

ul.faq {
	text-align: left;
	cursor: pointer;
	width: 100%;
	padding: 0;
}

ul.faq li {
	position: relative;
}

ul.faq > li {
	border-bottom: 1px solid var(--cgreyscale100);
	padding: 12px 48px 12px 6px;
	margin: 0 !important;
}

ul.faq li:last-of-type {
	border-bottom: 0;
}

ul.faq li:has(div.show):after {
	mask-image: url(../img/svg/up.svg);
	width: 12px;
	height: 6px;
	top: 24px;
}

ul.faq li:hover span {
	color: var(--cgreyscale300);
}

ul.faq li > div {
	margin-right: -42px;
}

div.group ul.faq li div p {
	text-align: left;
	font-weight: normal;
}

ul.faq.round-box {
	background: var(--cbuzzardlight);
	padding: 0 20px;
	border-radius: 12px;
	margin: 40px 0;
	box-sizing: border-box;
}

ul.faq.round-box li {
	font-family: unset;
}

ul.faq.round-box li span {
	font-family: "Sohne Dreiviertelfett Custom", sans-serif;
}

ul.faq.round-box li ol {
	margin-bottom: 20px;
}

ul.faq.round-box li li {
	margin-bottom: 8px;
	font-size: 16px;
}

ul.faq.round-box li li:after {
	mask-image: none;
	width: 0;
}

ul.faq.round-box p {
	font-weight: normal;
	font-size: 14px;
}

ul.faq.round-box .button {
	font-weight: bold;
	font-size: 14px;
	margin-bottom: 8px;
}

/* QUICK LINKS */

div.group.quicklinks {
	padding: 4px 24px 12px;
	text-align: left;
}

ul.quicklinks {
	list-style: none;
	padding: 0;
	margin: 0;
	font-size: 14px;
	font-weight: bold;
}

ul.quicklinks li {
	position: relative;
}

body.woocommerce-account .woocommerce-MyAccount-content ul.quicklinks li {
	margin-bottom: 0;
}

ul.quicklinks li a {
	display: block;
	border-bottom: 1px solid var(--cgreyscale100);
	padding: 14px 48px 14px 0;
	margin: 0 !important;
	text-decoration: none;
	line-height: 1.43;
}

ul.quicklinks li:last-of-type a {
	border-bottom: 0;
}

ul.quicklinks li a div.fal {
	margin: 4px 17px 0 0;
	float: left;
	height: 44px;
	color: var(--cgreyscale200);
	font-size: 18px;
}

ul.quicklinks li a div.icons {
	margin-right: 20px;
	padding: 0;
	float: left;
	height: 48px;
}

ul.quicklinks li a div.icons:before {
	height: 20px;
	width: 19px;
	margin: 0;
}

/* NEW SEARCH */

section.search {
	display: flex;
	justify-content: space-between;
	gap: 40px;
}

section.search div.side {
	flex: 1;
	min-width: 225px;
}

section.search div.main {
	flex: 4;
}

section.search div.filter a.float-right {
	color: var(--cgreyscale150);
	text-decoration: none;
	font-size: 28px;
	margin: 7px -2px 0 0;
}

section.search div.filter h2 {
	font-size: 20px;
	margin-bottom: 20px;
}

section.search div.filter a.float-right,
section.search div.filter h2,
section.search div.filter form#filtersearch {
	display: none;
}

section.search div.filter label {
	font-size: 16px;
	cursor: pointer;
	display: block;
	margin-bottom: 14px;
	white-space: nowrap;
}

section.search div.filter label:hover div {
	text-decoration: underline;
}

section.search div.filter input[type=radio] {
	cursor: pointer;
	padding: 0;
	margin: 0 15px 0 3px;
	transform: scale(1.5);
	height: 13px;
	width: 13px;
}

section.search div.filter label div {
	display: inline-flex;
	width: calc(100% - 32px);
	align-items: center;
	white-space: initial;
}

section.search div.filter-group {
	padding-bottom: 20px;
	border-bottom: 1px solid var(--cgreyscale100);
}

section.search .filter-group.closed {
	height: 37px;
	overflow: hidden;
	position: relative;
}

section.search .filter-group.closed.top5 {
	height: 247px;
}

section.search .filter-group.closed:before {
	content: 'Mehr . . .';
	color: var(--cgreyscale200);
	position: absolute;
	padding: 21px 0 18px 10px;
	right: 0;
	bottom: 0;
	cursor: pointer;
}

section.search .filter-group.closed.top5:before {
	bottom: -5px;
}

section.search div.filter input[type="date"] {
	padding: 4px 8px;
	margin-top: 10px;
	font-size: 14px;
}

section.search div.filter .button {
	border-radius: 8px;
	padding: 4px 8px;
	margin: 10px 0;
	font-size: 14px;
}

section.search form#search {
	margin: 20px 0;
}

form#search a.button.light.settings {
	display: none;
	color: var(--cgreyscale400);
	margin: 0;
	border-radius: 8px;
	padding: 6px 7px;
	font-size: 16px;
}

section.search form#search div.search {
	display: inline-block;
	margin-right: 40px;
	flex-grow: 1;
}

section.search select {
	padding: 8px 6px 8px 20px;
	border-radius: 8px;
	margin-left: 8px;
	background: var(--background);
	border: 1px solid var(--cgreyscale100);
	color: var(--cgreyscale300);
	font-size: 14px;
}

section.search div.filter-tags {
	margin: 20px 0;
	padding: 20px;
	text-align: left;
}

section.search div.filter-tags > div {
	margin-bottom: 20px;
}

section.search div.filter-tags a.trash {
	text-decoration: none;
	color: var(--cgreyscale300);
}

section.search div.filter-tags a.trash:hover {
	color: var(--cdangerbase);
}

/* FLEX BOX */

.flex {
	display: flex;
	justify-content: space-evenly;
	align-items: stretch;
}

.flex.between {
	justify-content: space-between;
}

.flex-fill {
	flex-grow: 1;
}

.flex div.border {
	border-right: 1px solid var(--cgreyscale100);
}

body.konto-onboarding .flex {
	gap: 40px;
}

body.konto-onboarding div.group.quicklinks {
	flex: 4;
}

body.konto-onboarding div.group.side {
	flex: 7;
}

body.konto-onboarding div.group.guide .flex + a.button {
	margin-top: 40px;
}

/* INVISIBLE GREY BOX */

div.group.side .greybox {
	background-color: var(--cgreyscale050);
	padding: 20px;
	margin-top: 18px;
	clear: both;
}

/* GLOSSARY */

body.glossar .switch-language {
	float: right;
	white-space: nowrap;
}

body.glossar .switch-language a.toggle.off {
	margin-right: -144px;
}

.glossary-index {
	column-count: 4;
	column-gap: 20px;
	column-rule: solid 1px var(--cgreyscale100);
	margin: 30px 10px 60px;
}

.glossary-index h2:first-child {
	margin-top: 0;
}

.glossary-index h2 {
	color: var(--cgreyscale150);
}

.glossary-index a {
	display: block;
	margin: 6px 0;
}

glossary {
	text-decoration: underline;
	text-decoration-color: var(--cgreyscale200);
	cursor: pointer;
}

#glossary {
	display: none;
	position: absolute;
	max-width: 686px;
	padding: 10px 30px;
	background: var(--cbgprimary);
	box-shadow: var(--deepshadow);
}

/* TAGS */

span.tag {
	padding: 4px 12px;
	background-color: var(--cbgsecondary);
	margin: 0 2px 5px 0;
	border-radius: 8px;
	white-space: nowrap;
}

span.tag a {
	text-decoration: none;
	font-size: 24px;
	vertical-align: -3px;
	margin-left: 10px;
}

span.tag a:hover {
	color: var(--cwarningbase);
}

/* USER MANAGEMENT */

.user-filter {
	padding-top: 8px;
}

.user-filter input.toggleTableCheckboxes {
	margin: 0 14px;
	display: none;
}

body.woocommerce-account table.user_table .user-actions {
	overflow: initial;
	position: relative;
	cursor: pointer;
}

.user-actions .actions {
	padding: 0 12px;
	font-size: 16px;
	font-weight: 900;
	text-decoration: none;
}

.user-actions ul {
	list-style: none;
	padding: 0;
	margin: 0;
	position: absolute;
	opacity: 0;
	visibility: hidden;
	display: none;
	background-color: var(--cbgprimary);
	z-index: 99;
	text-align: initial;
	width: fit-content;
	right: 0;
}

.user-actions:hover > ul:not(:empty) {
	padding: 4px 0;
	border: 1px solid var(--cgreyscale100);
	opacity: 1;
	visibility: visible;
	display: block;
}

body.woocommerce-account .user-actions ul li {
	margin-bottom: 0;
	padding: 0;
}

.user-actions ul li a {
	display: block;
	padding: 4px 16px;
	white-space: nowrap;
	color: var(--cgreyscale400);
	text-decoration: none;
}

.user-actions ul li a:hover {
	color: #000;
	background: var(--caccentbase);
}

body.woocommerce-account table.user_table th,
body.woocommerce-account table.user_table td {
	height: 28px;
}

table.user_table tr:hover {
	color: #000;
	background: var(--caccentlight);
}

table.user_table td.max {
	width: 100%;
}

select.user,
input.user,
table.sortable th:not(.sorttable_nosort),
input[type=checkbox] {
	cursor: pointer;
}

select.user {
	outline: none;
	border: 1px solid var(--cbgprimary);
	border-bottom: 1px solid var(--cgreyscale200);
	color: inherit;
	background: inherit;
	font-family: inherit;
	font-size: inherit;
}

select.user option {
	color: var(--cgreyscale400);
	background: var(--cbgprimary);
}

select.user + input.user {
	margin-left: 10px;
}

/* AUDIO */

audio {
	width: 100%;
	margin-top: 30px;
	position: sticky;
	bottom: 0;
}

.audioentry {
	padding: 16px;
	border-radius: 8px;
	clear: both;
	min-height: 100px;
}

.audioentry.active {
	background-color: var(--cbuzzardlight);
}

.audioentry:hover {
	background-color: var(--cbuzzardbase);
	color: #fff;
	cursor: pointer;
}

.audioentry img {
	float: left;
	height: 100px;
	width: 100px;
	object-fit: cover;
	margin: 0 16px 9px 0;
}

.audioentry div {
	padding-left: 116px;
}

.audioentry h2 {
	margin: -7px 0 0;
}

.audioentry p {
	margin: 8px 0;
	font-size: 16px;
}

/* ORDER RECEIVED */

body.woocommerce-order-received img {
	height: initial;
	width: initial;
}

body.woocommerce-order-received .aw-referrals-well {
	background: var(--cbgprimary);
}

/* SCHOOL NAVIGATOR */

.school-tab-buttons {
	margin-top: 16px;
}

.school-tab-button {
	border: 1px solid var(--cgreyscale100);
	margin: 0 -4px -1px 0;
	padding: 12px 25px;
	display: inline-block;
	border-radius: 8px 8px 0 0;
	font-size: 16px;
	cursor: pointer;
	text-decoration: none;
	background: var(--cbgtertiary);
}

.school-tab-button.float-right {
	margin-right: 0;
}

.school-tab-button.active {
	border-bottom-color: var(--cbgprimary);
	font-weight: bold;
	background: var(--cbgprimary);
	cursor: unset;
}

.marker:before {
	content: ' ';
	height: 8px;
	width: 8px;
	background: var(--cdangerbase);
	display: inline-block;
	margin-right: 6px;
	border-radius: 4px;
}

.school-tab {
	border: 1px solid var(--cgreyscale100);
	border-radius: 0 0 8px 8px;
	padding: 20px;
	clear: both;
}

.school-tab .grid.col-2,
.select-competency .grid.col-2,
.home-teacher .grid.col-2 {
	grid-gap: 20px;
}

.home-teacher .grid.col-2 {
	margin-bottom: 20px;
}

.school-tab post {
	margin-top: 0;
}

.school-tab post.type-teaching_plan,
.home-teacher post.type-teaching_plan {
	background: var(--cbuzzardlight);
}

.school-tab post.type-teaching_plan .thumb,
.school-tab post.type-teaching_plan .kicker,
.home-teacher post.type-teaching_plan .thumb,
.home-teacher post.type-teaching_plan .kicker {
	display: none;
}

.school-tab post.type-teaching_plan .subtitle,
.home-teacher post.type-teaching_plan .subtitle {
	height: auto;
}

.school-tab post.type-teaching_plan .subtitle p,
.school-tab post.type-teaching_plan .content,
.home-teacher post.type-teaching_plan .subtitle p,
.home-teacher post.type-teaching_plan .content {
	text-align: left;
	color: var(--cgreyscale400);
}

.school-tab post.type-teaching_plan .text:after,
.home-teacher post.type-teaching_plan .text:after {
	content: 'Ablauf anzeigen';
	display: inline-block;
	margin-top: 20px;
	padding: 8px 24px;
	color: var(--cbgprimary);
	background: var(--cgreyscale400);
	border-radius: 24px;
}

.school-tab > p {
	margin-top: 0;
}

.school-tab .subtitle + .grid,
.school-tab .subtitle + .greygroup {
	margin-top: 40px;
}

.school-tab .select {
	display: inline-block;
	width: calc(50% - 2px);
	min-width: 350px;
}

.school-tab .select select {
	width: calc(100% - 20px);
	border: solid 1px var(--cgreyscale100);
	border-radius: 8px;
	background: var(--cbgtertiary);
	color: var(--cgreyscale400);
	font-size: 16px;
	font-weight: bold;
	padding: 16px 20px;
	margin: 8px 0 0;
}

.school-tab post.type-glossary {
	padding: 40px;
	margin-top: 20px;
}

.school-tab embed.maximage {
	background: #f4f5f5;
	padding: 20px;
	width: calc( 100% - 40px );
	border-radius: 8px;
}

.school-tab .steps {
	display: inline-block;
	margin: 0 auto;
	text-align: left;
	font-size: 18px;
	line-height: 42px;
}

.steps .spot {
	background: var(--cbuzzardbase);
	color: #fff;
	line-height: initial;
}

.greygroup {
	margin: 20px 0;
	padding: 24px;
	background-color: var(--cbgtertiary);
}

.greygroup > .greygroup {
	margin: 0;
}

.greygroup h2,
.greygroup h3 {
	margin-top: 0;
}

.greygroup h2 {
	text-align: center;
}

.greygroup > h2:first-child,
.greygroup > h3:first-child {
	border-bottom: 1px solid var(--cgreyscale100);
	padding-bottom: 12px;
}

.greygroup h3 i.fal {
	font-size: 22px;
	margin-right: 8px;
}

.greygroup post {
	background: transparent;
}

.greygroup post.type-school_material,
.greygroup post.type-school_quiz {
	background: var(--cbgprimary);
	margin-bottom: 20px;
}

.greygroup .button {
	font-size: 16px;
	padding: 8px 24px;
	margin-right: 6px;
}

.greygroup .button + .button {
	margin-left: 24px;
}

.greygroup .button.light {
	background: var(--cbgprimary);
	color: var(--cgreyscale400);
}

.greygroup a.topic {
	text-decoration: none;
	font-size: 16px;
	display: inline-block;
	padding: 20px;
	background: var(--cbgprimary);
	border-radius: 8px;
	margin: 0 20px 20px 0;
	color: var(--cbuzzardcontrast);
}

.greygroup a.topic.active {
	background: var(--cgreyscale400);
	color: var(--cbgprimary);
}

.greygroup .center {
	margin-top: 24px;
}

.greygroup .center .button.light {
	background: transparent;
}

.greygroup .img-container {
	width: calc( 50% - 20px );
	float: left;
	margin: 0 40px 0 0;
	text-align: center;
	font-size: xx-small;
}

.greygroup .faq {
	padding-top: 20px;
}

.greygroup .faq ul.faq li p {
	font: 400 16px Sohne Buch Custom, sans-serif;
	line-height: 150%;
}

.competencies {
	columns: 2;
	margin: 40px 0 20px;
}

.competencies label {
	display: block;
	font-size: 16px;
	margin-bottom: 10px;
	cursor: pointer;
}

.competencies label:has(input:checked) {
	color: var(--cbuzzardcontrast);
}

.competencies label input {
	margin-right: 14px;
	transform: scale(1.5);
}

.competencies label input:checked {
	accent-color: var(--cbuzzardcontrast);
}

.type-method {
	background: var(--cbgprimary);
	border: 1px solid var(--cgreyscale100);
	border-radius: 8px;
	padding: 20px 20px 20px 48px;
	margin: 0;
	cursor: pointer;
	text-decoration: none;
}

.type-method .fa-memo-pad {
	height: 0;
	float: left;
	color: var(--cbuzzardbase);
	margin: 20px 0 0 -36px;
	font-size: 22px;
}

.type-method h4 {
	margin: 6px 0;
}

.type-method h4.icons.outlink:after {
	float: right;
}

.type-method .content {
	margin-top: 0;
	color: var(--cgreyscale300);
	letter-spacing: 5%;
}

.normal {
	font: 400 14px Sohne Buch Custom, sans-serif;
}

.greygroup.flex {
	flex-wrap: wrap;
}

.greygroup.flex div:nth-of-type(odd) {
	width: 250px;
}

.greygroup.flex div:nth-of-type(even) {
	width: calc(100% - 250px);
}

/* SWITCH LANGUAGE */

.switch-language input {
	display: none;
}

.switch-language i {
	font-size: 24px !important;
	color: var(--cgreyscale400);
	vertical-align: -3px;
}

.switch-language a {
	text-decoration: none;
	opacity: 0;
	transition: all .1s linear;
	margin-right: 10px;
}

.switch-language a.toggle.off {
	margin-right: -160px;
}

/* CLOSEABLE BANNER */

.home-banner.closeable {
	background-color: var(--cbuzzardlight);
	padding: 12px 12px 12px 24px;
}

.home-banner.closeable h1 {
	margin: 0 0 5px;
	text-align: left;
}

.closeable .close-parent {
	margin-left: 30px;
	color: var(--cgreyscale200);
	cursor: pointer;
}

.home-banner .inline.right {
	float: right;
	margin: 4px 10px 0;
}

/* WHOLE PAGE TRANSITION */

:view-transition-group(root) {
	animation-duration: 0.7s;
	animation-timing-function: var(--expo-out);
}

::view-transition-new(root) {
	animation-name: reveal-light;
	animation-fill-mode: both;
}

::view-transition-old(root),
.dark::view-transition-old(root) {
	animation: none;
	animation-fill-mode: both;
	z-index: -1;
}
.dark::view-transition-new(root) {
	animation-name: reveal-dark;
	animation-fill-mode: both;
}

@keyframes reveal-dark {
	from {
		clip-path: polygon(50% -71%, -50% 71%, -50% 71%, 50% -71%);
	}
	to {
		clip-path: polygon(50% -71%, -50% 71%, 50% 171%, 171% 50%);
	}
}

@keyframes reveal-light {
	from {
		clip-path: polygon(171% 50%, 50% 171%, 50% 171%, 171% 50%);
	}
	to {
		clip-path: polygon(171% 50%, 50% 171%, -50% 71%, 50% -71%);
	}
}

/* TEACHING GROUPS */

.konto-group .violetgroup {
	background-color: var(--cbuzzardlight);
	padding: 4px 24px 24px;
	border-radius: 8px;
}

body.woocommerce-account.konto-group .violetgroup p {
	font-family: Charter Regular Custom, serif;
	font-size: 18px;
	line-height: 1.5;
}

.konto-group .greygroup {
	font-size: 16px;
	border-radius: 8px;
	color: var(--cgreyscale300);
}

.konto-group .greygroup .fal.fa-circle-info {
	font-size: 28px;
	float: left;
	margin-right: 24px;
}

.konto-group .lb-content h2 {
	margin: 0;
}

.konto-group .lb-content .group {
	margin: 20px 0 10px;
	text-align: left;
}

.lb-content form label {
	margin-top: 30px;
	display: block;
	font-weight: bold;
}

.lb-content form input:not([type="submit"]),
.lb-content form select,
.lb-content form textarea {
	margin-top: 10px;
	display: block;
	width: 100%;
	box-sizing: border-box;
}

textarea {
	border: 1px solid var(--cgreyscale100);
	border-radius: 8px;
	padding: 9px 12px;
	font-family: inherit;
	font-size: 16px;
	height: 7em;
}

textarea:focus {
	outline: none;
}

.type-teaching_group {
	border: 1px solid var(--cgreyscale100);
	border-radius: 12px;
	background-color: var(--background);
	padding: 2px 30px 20px;
	margin-top: 20px;
}

.type-teaching_group + div.right {
	margin-top: 20px;
}

body.woocommerce-account .woocommerce label {
	display: block;
}

input.group-code,
body.woocommerce-account .woocommerce input.group-code {
	text-transform: uppercase;
	font-size: 24px;
	font-weight: bold;
	font-family: monospace;
	letter-spacing: 3px;
	width: 8ex;
}

/* RESPONSIVE DESIGN */

@media only screen and (max-width: 1106px) {
	main,
	.top-banner {
		margin: 0 34px;
	}

	header {
		height: 68px;
	}

	header .nav-center {
		display: none;
	}

	header .nav-right > ul > li > a {
		margin: 3px 0 3px 30px;
	}

	nav.nav a.button {
		margin: 17px 0 0 10px;
	}

	footer .logo-short {
		float: none;
		display: inline-block;
		margin-bottom: 30px;
	}
}

@media only screen and (min-width: 960px) {
	.home-edition .headline .license,
	.home-topics .headline .license {
		float: right;
		clear: right;
	}
}

@media only screen and (max-width: 960px) {
	html {
		scrollbar-gutter: unset;
	}

	h1 {
		font-size: 28px;
	}

	body.woocommerce-account .woocommerce {
		display: block;
	}

	body.woocommerce-account .woocommerce-MyAccount-navigation {
		margin: 40px 0 0;
		text-wrap: balance;
		text-align: center;
		border: 0;
		border-radius: 0;
		margin: 0;
		padding-bottom: 18px;
		border-bottom: 1px solid var(--cgreyscale100);
	}

	body.woocommerce-account .woocommerce-MyAccount-navigation ul {
		padding: 0;
	}

	body.woocommerce-account .woocommerce-MyAccount-navigation li {
		display: inline-block;
		margin-right: 16px;
		border: 0;
	}

	body.woocommerce-account .woocommerce-MyAccount-navigation li a {
		padding: 14px 18px 0 0;
	}

	.grid.col-2 {
		grid-template-columns: 1fr;
		grid-gap: 0;
	}

	.grid.col-2 .colspan-2 {
		grid-column: unset;
	}

	.grid.col-2 .colspan-2 h2 {
		margin: 20px 0 10px;
	}

	.grid.col-2.perspectives .license {
		display: block;
	}

	.home-edition .top-headline,
	.home-edition .headline,
	.home-topics .headline,
	.home-topics .title {
		grid-column: unset;
		margin-bottom: 20px;
	}

	.home-edition .headline .text,
	.home-topics .headline .text {
		width: auto;
		margin-right: 0;
	}

	.home-edition .headline .kicker,
	.home-topics .headline .kicker {
		margin-top: 28px;
	}

	.home-edition .headline img.thumb,
	.home-topics .headline img.thumb {
		float: none;
		width: -webkit-fill-available;
		width: -moz-available;
		width: stretch;
	}

	.home-edition .headline .content,
	.home-topics .headline .content {
		height: 7em;
		-webkit-line-clamp: 3;
	}

	.grid.col-3 {
		grid-template-columns: 1fr 1fr;
	}

	.home-perspectives .title,
	.home-perspectives .title + div {
		grid-column: span 2;
	}

	.home-perspectives .grid div:nth-of-type(6) {
		display: block;
	}

	.home-perspectives .title {
		position: relative;
		padding-right: calc(50% + 20px);
	}

	.home-perspectives .title .button.light {
		margin-top: 0;
	}

	.home-perspectives .title .description {
		position: absolute;
		top: 40px;
		right: 40px;
		bottom: 40px;
		width: calc(50% - 120px);
	}

	post.school.article .grid div:nth-of-type(odd) {
		border: 0;
		padding-right: 0;
		margin-bottom: 20px;
	}

	post.school.article .grid div:nth-of-type(2) {
		padding-left: 0;
	}

	div#ca-background {
		right: 100%;
	}

	div#create-account {
		position: unset;
		width: unset;
	}

	body.konto-onboarding .woocommerce-MyAccount-content > .flex {
		display: block;
	}

	div.group.quicklinks ul {
		columns: 2;
		column-gap: 40px;
	}

	div.group.quicklinks li {
		break-inside: avoid-column;
	}

	div.group.task {
		max-width: none;
		display: block;
	}

	.glossary-index {
		column-count: 3;
	}

	section.search div.side.filter {
		transform: translateX(-103%);
		opacity: 0;
		position: fixed;
		z-index: 2;
		top: 60px;
		left: 0px;
		max-height: 90%;
		box-shadow: rgba(0, 0, 0, 0.05) 4px 4px 4px 0px;
		background: var(--cbgprimary);
		border: 1px solid var(--cgreyscale100);
		transition: 0.3s ease-in-out;
		padding: 0 20px;
		overflow: hidden auto;
	}

	section.search div.side.filter.show {
		transform: none;
		opacity: 1;
	}

	section.search div.filter-group:last-child {
		border: 0;
	}

	section.search form#search div.search {
		display: none;
	}

	section.search div.filter a.float-right,
	section.search div.filter h2,
	section.search div.filter form#filtersearch,
	section.search form#search a.button.light.settings {
		display: block;
	}

	#lightbox .lb-popup .lb-content {
		top: 55px;
		bottom: 0;
		transform: none;
	}
}

@media only screen and (max-width: 768px) {
	.woocommerce table.shop_table_responsive tr,
	.woocommerce-page table.shop_table_responsive tr {
		border-bottom: 1px solid var(--cgreyscale100);
		margin-bottom: 20px;
	}

	body.woocommerce-account table.my_account_orders td {
		height: unset;
	}

	.glossary-index {
		column-count: 2;
	}

	.lb-content .flex.buttons,
	.lb-content .flex.buttons div {
		display: inline-block;
		text-align: center;
	}

	.lb-content .popup-tab-buttons {
		text-align: center;
	}

	.lb-content .popup-tab {
		border-radius: 8px;
	}

	.lb-content .popup-tab .grid {
		grid-template-columns: 1fr;
	}

	.user-filter input.toggleTableCheckboxes {
		display: initial;
	}

	.user-actions ul {
		position: relative;
		opacity: 1;
		visibility: visible;
		display: inline-block;
	}

	.user-actions:hover > ul:not(:empty) {
		padding: 0;
		border: 0;
		display: inline-block;
	}

	.user-actions ul li,
	.user-actions ul li a {
		display: inline-block;
	}

	.user-actions a.actions {
		display: none;
	}

	body.woocommerce-account table.user_table th,
	body.woocommerce-account table.user_table td {
		height: auto;
	}

	table.user_table td.max {
		width: unset;
	}

	.greygroup.flex div:nth-of-type(odd),
	.greygroup.flex div:nth-of-type(even) {
		width: 100%;
	}

	header .nav-right li a span {
		display: none;
	}

	header .nav-right > ul > li > a {
		margin: 3px 0 3px 10px;
	}

	.home-banner.closeable {
		padding: 16px;
	}

	.home-banner.closeable,
	.home-banner.closeable h1 {
		text-align: center;
	}

	.home-banner .inline.right {
		float: none;
	}
}

@media only screen and (max-width: 640px) {
	#hamburger span,
	nav.nav .nav-right a.icons:not(.user,.teacher2),
	.access-version {
		display: none;
	}

	nav.nav a.button {
		display: none;
	}

	aside.sidebar,
	section.search div.side.filter {
		right: 0;
	}

	main,
	.top-banner {
		margin: 0 12px;
	}

	.grid.col-3 {
		grid-template-columns: 1fr;
		grid-gap: 20px;
	}

	.grid.col-3 .colspan-2 {
		grid-column: unset;
	}

	.grid.col-3 .colspan-2 h2 {
		margin: 20px 0 10px;
	}

	.home-perspectives .title,
	.home-perspectives .title + div {
		grid-column: unset;
	}

	.home-perspectives .title {
		padding: 20px;
	}

	.home-perspectives .title .description {
		position: unset;
		width: auto;
	}

	.grid.perspectives .license {
		display: block;
	}

	body:not(.home) post.type-debate img.thumb,
	body:not(.home) post.type-daily_topics img.thumb {
		height: 130px;
		width: 130px;
	}

	post.type-debate .subtitle,
	post.type-daily_topics .subtitle {
		left: 156px;
	}

	body.konto-onboarding .flex {
		display: block;
	}

	div.group,
	body.konto-onboarding fieldset.school {
		padding: 24px 12px;
	}

	div.group.quicklinks {
		padding: 0 12px;
		border: 0;
	}

	div.group.quicklinks ul {
		columns: 1;
	}

	div.group.small {
		display: block;
	}

	div.group.small,
	div.group.task {
		margin: 20px 0;
	}

	.lb-content .lb-post post.type-post img.thumb,
	.lb-content .lb-post post.type-school_material img.thumb,
	.lb-content .lb-post post.type-teaching_plan img.thumb,
	.lb-content .lb-post post.type-school_quiz img.thumb,
	.lb-content .lb-post post.type-debate img.thumb,
	.lb-content .lb-post post.type-daily_topics img.thumb {
		float: none;
		margin: 10px auto;
		display: block;
	}

	.lb-content .lb-post post.type-debate .subtitle,
	.lb-content .lb-post post.type-daily_topics .subtitle {
		position: unset;
	}

	.lb-content .popup-tab .flex {
		display: block;
	}

	.lb-content .popup-tab .flex .vline {
		padding: 0;
		margin: 20px 0;
		border-top: 1px solid var(--cgreyscale100);
	}

	.school-tab {
		border: 0;
		border-top: 1px solid var(--cgreyscale100);
		padding: 20px 0;
	}
}

@media only screen and (max-width: 480px) {
	h1 {
		font-size: 24px;
	}

	h2 {
		font-size: 20px;
	}

	.top-banner {
		border-left: 0;
		border-right: 0;
		padding-left: 0;
		padding-right: 0;
	}

	post.type-debate .subtitle,
	post.type-daily_topics .subtitle {
		position: unset;
	}

	fieldset,
	body.home fieldset,
	body.schule fieldset,
	body.konto-onboarding .group,
	body.konto-onboarding fieldset.school {
		border-left: 0;
		border-right: 0;
		border-bottom: 0;
		border-radius: 0;
		padding-left: 0;
		padding-right: 0;
		padding-bottom: 0;
	}

	.home-debate .button.light {
		width: auto;
	}

	.home-edition .button,
	.home-topics .button {
		min-width: unset;
	}

	body.schule label,
	body.schule select {
		width: -webkit-fill-available;
		width: -moz-available;
		width: stretch;
	}

	post.type-daily_edition {
		display: block;
	}

	#login {
		width: unset;
	}

	.standalone-body form label,
	form#cancelcontract label {
		width: auto;
		text-align: left;
	}

	body.fuer-lehrer .standalone-body form select,
	body.fuer-schueler .standalone-body form select,
	body.fuer-lehrer .standalone-body form input:not([type=checkbox]),
	body.fuer-schueler .standalone-body form input:not([type=checkbox]) {
		width: -webkit-fill-available;
		width: -moz-available;
		width: stretch;
	}

	.standalone-body select#state + .select2-container {
		max-width: -webkit-fill-available;
		max-width: -moz-available;
		max-width: stretch;
	}

	div.school.heading {
		padding: 14px 24px 4px;
		margin: 0 -12px;
	}

	div.school.heading:before {
		border-radius: 0;
	}

	div.school.heading .inside p {
		font-size: 16px;
	}

	.glossary-index {
		column-count: 1;
	}

	#lightbox .lb-popup .lb-content {
		padding: 10px;
		max-width: calc(100dvw - 40px);
		max-height: calc(100dvh - 80px);
	}

	.lb-content .video video {
		margin: 0 -10px;
		width: calc(100% + 20px);
	}

	.lb-content .popup-tab {
		border-width: 1px 0 0 0;
		border-radius: 0;
		padding: 10px;
	}

	.school-tab-buttons {
		margin: 16px -12px 0;
	}

	.school-tab-button {
		padding: 6px 12px;
	}

	.greygroup {
		margin: 20px -12px;
		padding: 24px 12px;
	}
}

@media only screen and (max-width: 360px) {
	div.selection.custom:not(.hide) {
		height: auto;
	}

	header .nav-right > ul > li > a {
		margin: 3px 0;
	}
}

@media only screen and (max-width: 330px) {
	.nav-center {
		width: unset;
	}

	header .nav-center .icons.logo:before {
		mask-image: url(../img/svg/logo-short.svg);
		width: 22px;
		height: 31px;
	}

	header .nav-center .subtitle {
		display: none;
	}
}

p.summainote {
	font-family: unset;
	font-size: unset;
}

.woocommerce-password-strength {
	color: #000;
}

.boldlink {
	font: 600 16px Sohne Buch Custom, sans-serif;
	display: inline-block;
	white-space: nowrap;
}

.button + .boldlink,
.boldlink + .boldlink {
	margin-left: 30px;
}

article div.side.filter {
	display: none;
}

#icon-sun,
#icon-moon {
	display: none;
	cursor: pointer;
}

input[type=submit] {
	cursor: pointer;
}

.beta {
	display: inline-block;
	font-size: 12px;
	font-family: "Sohne Buch Custom", sans-serif;
	font-weight: normal;
	padding: 3px 6px;
	background-color: #cfc;
	color: #080;
	border-radius: 5px;
}
