/* =============================================================================
 * mod_pageimage
 * ========================================================================== */

.mod_pageimage .inside {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	line-height: normal;
}

.mod_pageimage .container {
	display: flex;
	align-items: center;
	position: relative;
	z-index: 20;
}

.mod_pageimage .inside .content {
	padding: 20px 0;
}

.mod_pageimage .headline {
	color: rgb(255,255,255);
	font-size: 3rem;
}

.mod_pageimage .subheadline {
	color: rgb(255,255,255);
	font-size: 1.3rem;
}

.mod_pageimage .mod_breadcrumb {
	display: none;
}

.mod_pageimage .inside > .container {
	height: 300px;
}

/* styles */
.mod_pageimage .style2 > .container {
	height: 380px;
}

.mod_pageimage .style2 > .container .content {
	width: 100%;
	text-align: center;
}

.mod_pageimage .style3 > .container {
	height: 380px;
}

.mod_pageimage .style3 > .container .content {
	width: 100%;
	text-align: center;
}

.mod_pageimage .style3 .mod_breadcrumb {
	display: inline-block!important;
	border: 1px solid rgba(255,255,255,0.4);
	padding: 5px 10px;
	border-radius: 3px;
	line-height: normal;
	margin-top: 20px;
}

.mod_pageimage .style3 .mod_breadcrumb ul {
	padding: 0;
}

.mod_pageimage .style3 .mod_breadcrumb .container {
	padding: 0;
	max-width: none;
	display: block;
}

.mod_pageimage .style3 .mod_breadcrumb,
.mod_pageimage .style3 .mod_breadcrumb a {
	color: rgb(255,255,255);
}

.mod_pageimage .style3 .mod_breadcrumb a:hover {
	text-decoration: underline;
}

.mod_pageimage .style3 .headline {
	font-size: 4rem;
}

/* option height */
.mod_pageimage .inside.height-xxl > .container {
	height: 800px;
}

.mod_pageimage .inside.height-xl > .container {
	height: 700px;
}

.mod_pageimage .inside.height-l > .container {
	height: 600px;
}

.mod_pageimage .inside.height-m > .container {
	height: 500px;
}

.mod_pageimage .inside.height-s > .container {
	height: 400px;
}

.mod_pageimage .inside.height-xs > .container {
	height: 300px;
}

.mod_pageimage .inside.height-xxs > .container {
	height: 160px;
}

/* =============================================================================
* smart phones  (s / small screens)
* ========================================================================== */
@media only screen and (max-width: 767px) {

	.mod_pageimage .headline {
		font-size: 1.3rem;
	}

	.mod_pageimage .inside .content {
		padding: 10px 0;
	}

	.mod_pageimage .subheadline {
		font-size: 1rem;
	}

	.mod_pageimage .style1 > .container {
		height: 150px;
	}

	.mod_pageimage .style2 > .container {
		height: 150px;
	}

	.mod_pageimage .style3 > .container {
		height: auto;
	}

	.mod_pageimage .style3 .headline {
		font-size: 2rem;
	}

	.mod_pageimage .inside.height-xxl > .container {
		height: 400px;
	}

	.mod_pageimage .inside.height-xl > .container {
		height: 300px;
	}

	.mod_pageimage .inside.height-l > .container {
		height: 200px;
	}

	.mod_pageimage .inside.height-m > .container {
		height: 200px;
	}

	.mod_pageimage .inside.height-s > .container {
		height: 200px;
	}

	.mod_pageimage .inside.height-xs > .container {
		height: 150px;
	}

	.mod_pageimage .inside.height-xxs > .container {
		height: 0;
	}
}
.mod_privacy_optin_medium p.privacy,p.privacy{color:#fff;background:red;font-weight:700;padding:20px;text-align:center;margin:20px}.mod_privacy_optin h1,.mod_privacy_optin h2,.mod_privacy_optin h3,.mod_privacy_optin h4,.mod_privacy_optin h5,.mod_privacy_optin h6,.mod_privacy_optin_medium h1,.mod_privacy_optin_medium h2,.mod_privacy_optin_medium h3,.mod_privacy_optin_medium h4,.mod_privacy_optin_medium h5,.mod_privacy_optin_medium h6{background-repeat:no-repeat;background-position:left center;background-image:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkViZW5lXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMjkuNzZweCIgaGVpZ2h0PSIzNC4yNTlweCIgdmlld0JveD0iMCAwIDI5Ljc2IDM0LjI1OSIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjkuNzYgMzQuMjU5IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzNCM0M0MSIgc3Ryb2tlLXdpZHRoPSIxLjQ0IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIyMi45MjU2IiBkPSINCglNMTQuODgxLDMzLjU0QzYuNDI3LDI5Ljg4LDAuNzIsMjEuOTM4LDAuNzIsMTMuOTc1YzAtNC4wODEsMC4wNDktOS4xNywwLjA0OS0xMy4yNTVDMi4wMzYsMi4yMTEsNC41ODgsNC4yMzEsNy41Myw0LjIzMQ0KCWMzLjUxOSwwLDYuNDgtMS40NTgsNy4zNTEtMy40MzljMC44NzIsMS45ODEsMy44MzIsMy40MzksNy4zNTEsMy40MzljMi45NDIsMCw1LjQ5NC0yLjAyLDYuNzYxLTMuNTExDQoJYzAsNC4wODUsMC4wNDgsOS4xNzQsMC4wNDgsMTMuMjU1QzI5LjA0MSwyMS45MzgsMjMuMzMzLDI5Ljg4LDE0Ljg4MSwzMy41NEwxNC44ODEsMzMuNTR6Ii8+DQo8cG9seWxpbmUgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjM0IzQzQxIiBzdHJva2Utd2lkdGg9IjEuNDQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjIyLjkyNTYiIHBvaW50cz0iDQoJOC45MjgsMTYuNzk0IDE0LjQxMSwyMy4xNDYgMjMuMTM3LDkuNzggIi8+DQo8L3N2Zz4NCg==");font-family:Arial,Verdana,sans-serif}.mod_privacy_optin *{font-family:Arial,Verdana,sans-serif;line-height:20px;font-size:13px;margin:0;padding:0;border:0;outline:0;box-sizing:border-box}.mod_privacy_optin,.mod_privacy_optin .privacy.hidden,.mod_privacy_optin .privacy_help,.mod_privacy_optin .view_help .privacy_settings,.mod_privacy_optin_medium,.mod_privacy_optin_medium .privacy.hidden,.mod_privacy_optin_medium .privacy_help,.mod_privacy_optin_medium .view_help .privacy_settings,.privacy.hidden{display:none}.mod_privacy_optin .privacy_label input:checked~.privacy_checkmark:after,.mod_privacy_optin .view_help .privacy_help,.mod_privacy_optin.open,.mod_privacy_optin_medium .privacy_label input:checked~.privacy_checkmark:after,.mod_privacy_optin_medium .view_help .privacy_help,.mod_privacy_optin_medium.open,.mod_privacy_optin_slim.open{display:block}.mod_privacy_optin h1,.mod_privacy_optin h2,.mod_privacy_optin h3,.mod_privacy_optin h4,.mod_privacy_optin h5,.mod_privacy_optin h6{margin:0 0 10px;padding:10px 0 10px 45px}.mod_privacy_optin h1,.mod_privacy_optin_medium h1{font-size:26px}.mod_privacy_optin h2,.mod_privacy_optin_medium h2{font-size:24px}.mod_privacy_optin h3,.mod_privacy_optin_medium h3{font-size:22px}.mod_privacy_optin h4,.mod_privacy_optin_medium h4{font-size:20px}.mod_privacy_optin h5,.mod_privacy_optin_medium h5{font-size:18px}.mod_privacy_optin h6,.mod_privacy_optin_medium h6{font-size:16px}.mod_privacy_optin .privacy_buttons input,.mod_privacy_optin_medium .privacy_buttons input{background:green;padding:0 15px;line-height:35px;color:#fff;border-radius:5px;width:100%;cursor:pointer;display:block;border:0}.mod_privacy_optin .privacy_overlay,.mod_privacy_optin_medium .privacy_overlay{z-index:10000000;position:fixed;left:0;top:0;right:0;bottom:0;width:100%;background:rgba(0,0,0,.6)}.mod_privacy_optin .privacy_popup{position:fixed;top:0;left:50%;transform:translateX(-50%);-webkit-transform:translateX(-50%);z-index:20000000;width:90%;max-width:475px;max-height:100vh;overflow:auto}.mod_privacy_optin.optin_bottom .privacy_popup,.mod_privacy_optin_medium.optin_bottom .privacy_popup{bottom:10px;top:auto}.mod_privacy_optin .privacy_content{padding:20px 20px 15px;background:#f8f8f8}.mod_privacy_optin .privacy_popup.view_help,.mod_privacy_optin_medium .privacy_popup.view_help{position:absolute}.mod_privacy_optin .privacy_option_info{font-size:12px;color:rgba(0,0,0,.6);line-height:1.4;margin-bottom:0;cursor:pointer;display:block}.mod_privacy_optin .privacy_text p{line-height:19px;font-size:12px;margin-bottom:15px}.mod_privacy_optin .privacy_help p,.mod_privacy_optin .privacy_item{margin-bottom:15px}.mod_privacy_optin .privacy_label,.mod_privacy_optin_medium .privacy_label{display:block;position:relative;padding-left:28px;font-size:14px;line-height:18px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.mod_privacy_optin .privacy_label input,.mod_privacy_optin_medium .privacy_label input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.mod_privacy_optin .privacy_label .privacy_checkmark{position:absolute;top:0;left:0;height:18px;width:18px;background-color:#eee;border:1px solid rgba(0,0,0,.1);transition:background .3s;-webkit-transition:background .3s}.mod_privacy_optin .privacy_label:hover input~.privacy_checkmark,.mod_privacy_optin_medium .privacy_label:hover input~.privacy_checkmark{background-color:#ccc}.mod_privacy_optin .privacy_label input:checked~.privacy_checkmark,.mod_privacy_optin_medium .privacy_label input:checked~.privacy_checkmark{background-color:#2196f3}.mod_privacy_optin .privacy_label .privacy_checkmark:after{content:"";position:absolute;display:none;left:4px;top:0;width:5px;height:10px;border:solid #fff;border-width:0 3px 3px 0;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}.mod_privacy_optin .privacy_buttons{margin-top:20px}.mod_privacy_optin .submit{margin-bottom:10px}.mod_privacy_optin .submit:active,.mod_privacy_optin_medium .submit:active{opacity:.8}.mod_privacy_optin .submit.readonly,.mod_privacy_optin .submit.readonly:focus,.mod_privacy_optin .submit.readonly:hover,.mod_privacy_optin_medium .submit.readonly,.mod_privacy_optin_medium .submit.readonly:focus,.mod_privacy_optin_medium .submit.readonly:hover{background:#ddd;color:#9a9a9a}.mod_privacy_optin .headline,.mod_privacy_optin_medium .headline{font-size:1.3rem;margin-bottom:10px}.mod_privacy_optin .privacy_help_close,.mod_privacy_optin .privacy_help_link,.mod_privacy_optin_medium .privacy_help_close,.mod_privacy_optin_medium .privacy_help_link{font-size:.85rem;text-align:center;color:rgba(0,0,0,.5);margin-top:5px;cursor:pointer;text-decoration:underline}.mod_privacy_optin .ajax_info,.mod_privacy_optin_medium .ajax_info{background:#107e10;border-radius:3px;margin:10px 0;padding:3px 15px;color:#fff;font-size:.9rem;display:none}.mod_privacy_optin .privacy_help *,.mod_privacy_optin_medium .privacy_help,.mod_privacy_optin_medium .privacy_help *,.mod_privacy_optin_medium .privacy_help p{font-size:11px}.mod_privacy_optin .privacy_help a{text-decoration:underline}.mod_privacy_optin p.privacy a,.mod_privacy_optin_medium p.privacy a{text-decoration:underline;color:rgba(255,255,255)!important}.mod_privacy_optin .privacy_links{text-align:center;margin-top:10px}.mod_privacy_optin .privacy_links a,.mod_privacy_optin_medium .privacy_links a{font-size:12px;text-align:center;color:rgba(0,0,0,.5);margin-top:5px;cursor:pointer;text-decoration:underline;display:inline-block;margin-left:3px;margin-right:3px}.mod_privacy_optin table,.mod_privacy_optin_medium table{width:100%;margin-bottom:25px}.mod_privacy_optin table td,.mod_privacy_optin_medium table td{padding:5px;vertical-align:top;border-bottom:1px solid #ddd;font-size:11px}.mod_privacy_optin table td:first-of-type,.mod_privacy_optin_medium table td:first-of-type{width:30%!important}.mod_privacy_optin table td:last-of-type,.mod_privacy_optin_medium table td:last-of-type{width:70%!important}.mod_privacy_optin_medium *{font-family:Arial,Verdana,sans-serif;line-height:19px;font-size:13px;box-sizing:border-box}.mod_privacy_optin_medium h1,.mod_privacy_optin_medium h2,.mod_privacy_optin_medium h3,.mod_privacy_optin_medium h4,.mod_privacy_optin_medium h5,.mod_privacy_optin_medium h6{margin:0 0 10px;padding:5px 0 5px 35px;background-size:25px}.mod_privacy_optin_medium .privacy_buttons{margin:25px 0 15px}.mod_privacy_optin_medium .privacy_popup{position:fixed;top:10px;left:50%;transform:translateX(-50%);-webkit-transform:translateX(-50%);z-index:20000000;width:90%;max-width:420px;max-height:100vh;overflow:auto}.mod_privacy_optin_medium .privacy_content{padding:15px 15px 10px;background:#f8f8f8;border-radius:5px}.mod_privacy_optin_medium .privacy_option_info{font-size:12px;color:rgba(0,0,0,.6);line-height:1.4;margin-bottom:0;cursor:pointer}.mod_privacy_optin_medium .privacy_text{line-height:1.2;font-size:.9rem}.mod_privacy_optin_medium .privacy_checkboxes{display:flex;justify-content:center;margin-bottom:10px}.mod_privacy_optin_medium .privacy_item{display:inline-block;margin:0 10px}.mod_privacy_optin_medium .privacy_label .privacy_checkmark{position:absolute;top:0;left:0;height:18px;width:18px;border:1px solid rgba(0,0,0,.4);background-color:#eee;transition:background .3s;-webkit-transition:background .3s}.mod_privacy_optin_medium .privacy_label .privacy_checkmark:after{content:"";position:absolute;display:none;left:4px;top:1px;width:5px;height:8px;border:solid #fff;border-width:0 3px 3px 0;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}.mod_privacy_optin_medium .submit{margin-top:10px;padding:12px;width:100%}.mod_privacy_optin_medium .privacy_links{text-align:center}.mod_privacy_optin_slim *{font-family:Arial,Verdana,sans-serif;line-height:20px;font-size:13px;box-sizing:border-box}.mod_privacy_optin_slim{display:none;position:fixed;top:0;left:0;width:100%;height:100%;z-index:100000000000}.mod_privacy_optin_slim .privacy_inside{color:#fff;background:#000;box-shadow:0 0 2px 2px rgba(0,0,0,.1);position:absolute;bottom:0;left:0;width:100%;z-index:100;overflow:hidden;padding:15px}.mod_privacy_optin_slim .privacy_overlay{z-index:10;width:inherit;height:inherit;position:inherit;background-color:rgba(0,0,0,.4)}.mod_privacy_optin_slim .privacy_buttons{float:right;width:40%;text-align:right}.mod_privacy_optin_slim .privacy_button{display:inline-block}.mod_privacy_optin_slim .privacy_button a{margin:5px 0}.mod_privacy_optin_slim .privacy_content{float:left;width:60%;line-height:1.5}.mod_privacy_optin_slim .privacy_content a{color:#fff;text-decoration:underline}.mod_privacy_optin_slim .privacy_content p{margin-bottom:0}.mod_privacy_optin_slim .privacy_button a{background:green;color:#fff;text-decoration:none;padding:0 15px;line-height:35px;display:inline-block;text-align:center;min-width:140px}a.privacy_optout_click{cursor:pointer}.hide_optin .mod_privacy_optin,.hide_optin .mod_privacy_optin_medium,.hide_optin .mod_privacy_optin_slim{display:none!important}@media only screen and (max-width:767px){.mod_privacy_optin_slim .privacy_buttons,.mod_privacy_optin_slim .privacy_content{float:none;width:100%;text-align:left}.mod_privacy_optin_slim .privacy_content{margin-bottom:10px}.mod_privacy_optin_slim .privacy_button,.mod_privacy_optin_slim .privacy_button a{display:block}}
/* =============================================================================
 * offcanvas-top
 * ========================================================================== */

.offcanvas-trigger {
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 10;
	cursor: pointer;
	height: 36px;
	width: 36px;
}

.offcanvas-trigger:after {
	position: absolute;
	right: -25px;
	top:-25px;
	width: 50px;
	content:'';
	height: 50px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	background: rgba(255,255,255,0.8);
	box-shadow: 0 0 2px 2px rgba(0,0,0,0.1);
}

.offcanvas-trigger .line1,
.offcanvas-trigger .line2 {
	position: absolute;
	top: 50%;
	background: rgba(0,0,0,0.9);
	height: 1px;
	width: 10px;
	z-index: 10;
	right: 5px;
	margin-top: -7px;
}

.offcanvas-trigger .line2 {
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
	transition: All 0.3s ease;
	-webkit-transition: All 0.3s ease;
}

#offcanvas-top {
	max-height: 0;
	transition: All 0.5s ease;
	-webkit-transition: All 0.5s ease;
	overflow: hidden;
	font-size: 0.95rem;
	line-height: 1.6;
}

#offcanvas-top,
#offcanvas-top a {
	color: rgba(255,255,255,0.8);
}

#offcanvas-top.offcanvas-top-open {
	display: block;
	max-height: 1000px;
}

.offcanvas-top-open.offcanvas-trigger .line2 {
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
}

#offcanvas-top .offcanvas-top-inside {
	padding-top: 40px;
	padding-bottom: 40px;
	overflow: hidden;
}

#offcanvas-top .mod_login {
	background: none;
	box-shadow: none;
	padding: 0;
	margin: 0;
	border: 0;
}

#offcanvas-top .mod_login input.submit,
#offcanvas-top .mod_login button.submit {
	width: auto;
	background: rgba(0,0,0,0.1);
}

#offcanvas-top .autogrid.block {
	padding-left: 2%;
	padding-right: 2%;
}

#offcanvas-top .autogrid_wrapper {
	margin-left: -2%;
	margin-right: -2%;
}

#offcanvas-top h1,
#offcanvas-top h2,
#offcanvas-top h3,
#offcanvas-top h4,
#offcanvas-top h5,
#offcanvas-top h6 {
	color: rgb(255,255,255);
	font-size: 1.6rem;
}

#offcanvas-top .mod_socials {
	overflow: hidden;
	display: inline-block;
}

#offcanvas-top .mod_socials a i {
	padding: 0.6667rem;
	margin-right: 1px;
	background: rgba(255,255,255,0.05);
	font-size: 1.333rem;
	display: inline-block;
	height: 2.667rem;
	width: 2.667rem;
	text-align: center;
	float: left;
	margin-bottom: 1px;
}

.offcanvas-top-inside .autogrid_wrapper,
.offcanvas-top-inside .autogrid {
	overflow: visible;
}

.offcanvas-top-inside .mod_login {
	border-radius: 0;
}

/* =============================================================================
* smart phones  (s / small screens)
* ========================================================================== */
@media only screen and (max-width: 767px) {
	.offcanvas-trigger {
		display: none;
	}
}



.autogrid_grid{display:grid;margin-left:-15px;margin-right:-15px}.autogrid_grid .column{padding-left:15px;padding-right:15px}.autogrid_grid.gutter_none{margin-left:0;margin-right:0}.autogrid_grid.gutter_none>.column{padding-left:0;padding-right:0}.autogrid_grid.gutter_s{margin-left:-15px;margin-right:-15px}.autogrid_grid.gutter_s>.column{padding-left:15px;padding-right:15px}.autogrid_grid.gutter_m{margin-left:-30px;margin-right:-30px}.autogrid_grid.gutter_m>.column{padding-left:30px;padding-right:30px}.autogrid_grid.gutter_l{margin-left:-40px;margin-right:-40px}.autogrid_grid.gutter_l>.column{padding-left:40px;padding-right:40px}.autogrid_grid.same_height>.column>.attributes{height:100%}.autogrid_grid .column .attributes{background-size:cover}.autogrid_grid .column .attributes.p-xl{padding:200px 40px 200px 40px}.autogrid_grid .column .attributes.p-l{padding:160px 40px 160px 40px}.autogrid_grid .column .attributes.p-m{padding:115px 40px 115px 40px}.autogrid_grid .column .attributes.p-s{padding:80px 40px 80px 40px}.autogrid_grid .column .attributes.p-xs{padding:40px 40px 40px 40px}.autogrid_grid .column.align_left_top{text-align:left}.autogrid_grid .column.align_left_center{text-align:left;align-self:center}.autogrid_grid .column.align_left_bottom{text-align:left;align-self:flex-end}.autogrid_grid .column.align_center_top{text-align:center}.autogrid_grid .column.align_center_center{text-align:center;align-self:center}.autogrid_grid .column.align_center_bottom{text-align:center;align-self:flex-end}.autogrid_grid .column.align_right_top{text-align:right}.autogrid_grid .column.align_right_center{text-align:right;align-self:center}.autogrid_grid .column.align_right_bottom{text-align:right;align-self:flex-end}.autogrid_grid.same_height>.column{align-self:unset}.autogrid_grid.same_height>.column>.attributes{display:flex;flex-wrap:wrap;height:100%}.autogrid_grid.same_height>.column>.attributes>.same-height-wrap{width:100%;flex:0 0 100%}.autogrid_grid.same_height>.column.align_left_center>.attributes{align-items:center}.autogrid_grid.same_height>.column.align_left_bottom>.attributes{align-items:flex-end}.autogrid_grid.same_height>.column.align_center_center>.attributes{align-items:center}.autogrid_grid.same_height>.column.align_center_bottom>.attributes{align-items:flex-end}.autogrid_grid.same_height>.column.align_right_center>.attributes{align-items:center}.autogrid_grid.same_height>.column.align_right_bottom>.attributes{align-items:flex-end}.autogrid_grid .column>.attributes .image_mob{display:none}.autogrid_row,.autogrid_wrapper{margin-left:-15px;margin-right:-15px;display:flex;flex-wrap:wrap;box-sizing:border-box}.autogrid,.autogrid_row>.column{padding-left:15px;padding-right:15px;flex-basis:1;flex-grow:1;width:100%;position:relative;box-sizing:border-box}.autogrid_clear{flex:0 0 100%;height:0}.col_1{flex:0 0 calc((100% / 12) * 1);max-width:calc((100% / 12) * 1)}.col_2{flex:0 0 calc((100% / 12) * 2);max-width:calc((100% / 12) * 2)}.col_3{flex:0 0 calc((100% / 12) * 3);max-width:calc((100% / 12) * 3)}.col_4{flex:0 0 calc((100% / 12) * 4);max-width:calc((100% / 12) * 4)}.col_5{flex:0 0 calc((100% / 12) * 5);max-width:calc((100% / 12) * 5)}.col_6{flex:0 0 calc((100% / 12) * 6);max-width:calc((100% / 12) * 6)}.col_7{flex:0 0 calc((100% / 12) * 7);max-width:calc((100% / 12) * 7)}.col_8{flex:0 0 calc((100% / 12) * 8);max-width:calc((100% / 12) * 8)}.col_9{flex:0 0 calc((100% / 12) * 9);max-width:calc((100% / 12) * 9)}.col_10{flex:0 0 calc((100% / 12) * 10);max-width:calc((100% / 12) * 10)}.col_11{flex:0 0 calc((100% / 12) * 11);max-width:calc((100% / 12) * 11)}.col_12{flex:0 0 calc((100% / 12) * 12);max-width:calc((100% / 12) * 12)}.autogrid_row>.column>.attributes{background-size:cover}.autogrid_row>.column>.attributes.p-xl{padding:200px 40px 200px 40px}.autogrid_row>.column>.attributes.p-l{padding:160px 40px 160px 40px}.autogrid_row>.column>.attributes.p-m{padding:115px 40px 115px 40px}.autogrid_row>.column>.attributes.p-s{padding:80px 40px 80px 40px}.autogrid_row>.column>.attributes.p-xs{padding:40px 40px 40px 40px}.autogrid_row.gutter_none,.autogrid_wrapper.gutter_none{margin-left:0;margin-right:0}.autogrid_row.gutter_none>div,.autogrid_wrapper.gutter_none>div{padding-left:0;padding-right:0}.autogrid_row.gutter_s,.autogrid_wrapper.gutter_s{margin-left:-15px;margin-right:-15px}.autogrid_row.gutter_s>div,.autogrid_wrapper.gutter_s>div{padding-left:15px;padding-right:15px}.autogrid_row.gutter_m,.autogrid_wrapper.gutter_m{margin-left:-30px;margin-right:-30px}.autogrid_row.gutter_m>div,.autogrid_wrapper.gutter_m>div{padding-left:30px;padding-right:30px}.autogrid_row.gutter_l,.autogrid_wrapper.gutter_l{margin-left:-40px;margin-right:-40px}.autogrid_row.gutter_l>div,.autogrid_wrapper.gutter_l>div{padding-left:40px;padding-right:40px}.autogrid_row>.column.align_left_top{text-align:left}.autogrid_row>.column.align_left_center{text-align:left;align-self:center}.autogrid_row>.column.align_left_bottom{text-align:left;align-self:flex-end}.autogrid_row>.column.align_center_top{text-align:center}.autogrid_row>.column.align_center_center{text-align:center;align-self:center}.autogrid_row>.column.align_center_bottom{text-align:center;align-self:flex-end}.autogrid_row>.column.align_right_top{text-align:right}.autogrid_row>.column.align_right_center{text-align:right;align-self:center}.autogrid_row>.column.align_right_bottom{text-align:right;align-self:flex-end}.autogrid_row.same_height>.column{align-self:unset}.autogrid_row.same_height>.column>.attributes{display:flex;flex-wrap:wrap;height:100%}.autogrid_row.same_height>.column>.attributes>.same-height-wrap{width:100%;flex:0 0 100%}.autogrid_row.same_height>.column.align_left_center>.attributes{align-items:center}.autogrid_row.same_height>.column.align_left_bottom>.attributes{align-items:flex-end}.autogrid_row.same_height>.column.align_center_center>.attributes{align-items:center}.autogrid_row.same_height>.column.align_center_bottom>.attributes{align-items:flex-end}.autogrid_row.same_height>.column.align_right_center>.attributes{align-items:center}.autogrid_row.same_height>.column.align_right_bottom>.attributes{align-items:flex-end}.autogrid_row .column>.attributes .image_mob{display:none}.order_1{order:1}.order_2{order:2}.order_3{order:3}.order_4{order:4}.order_5{order:5}.order_6{order:6}.full{flex:0 0 100%}.one_half{flex:0 0 calc(100% / 2)}.one_third{flex:0 0 calc(100% / 3)}.one_fourth{flex:0 0 calc(100% / 4)}.one_fifth{flex:0 0 calc(100% / 5)}.one_sixth{flex:0 0 calc(100% / 6)}.two_third{flex:0 0 calc((100% / 3) * 2)}.two_fourth{flex:0 0 calc((100% / 4) * 2)}.three_fourth{flex:0 0 calc((100% / 4) * 3)}.two_fifth{flex:0 0 calc((100% / 5) * 2)}.three_fifth{flex:0 0 calc((100% / 5) * 3)}.four_fifth{flex:0 0 calc((100% / 5) * 4)}.two_sixth{flex:0 0 calc((100% / 6) * 2)}.three_sixth{flex:0 0 calc((100% / 6) * 3)}.four_sixth{flex:0 0 calc((100% / 6) * 4)}.five_sixth{flex:0 0 calc((100% / 6) * 5)}.offset_col_1{margin-left:calc((100% / 12) * 1)}.offset_col_2{margin-left:calc((100% / 12) * 2)}.offset_col_3{margin-left:calc((100% / 12) * 3)}.offset_col_4{margin-left:calc((100% / 12) * 4)}.offset_col_5{margin-left:calc((100% / 12) * 5)}.offset_col_6{margin-left:calc((100% / 12) * 6)}.offset_col_7{margin-left:calc((100% / 12) * 7)}.offset_col_8{margin-left:calc((100% / 12) * 8)}.offset_col_9{margin-left:calc((100% / 12) * 9)}.offset_col_10{margin-left:calc((100% / 12) * 10)}.offset_col_11{margin-left:calc((100% / 12) * 11)}.autogrid.no_gutter{padding-left:0;padding-right:0}@media only screen and (min-width :768px) and (max-width :1024px){.col_1_t{flex:0 0 calc((100% / 12) * 1);max-width:calc((100% / 12) * 1)}.col_2_t{flex:0 0 calc((100% / 12) * 2);max-width:calc((100% / 12) * 2)}.col_3_t{flex:0 0 calc((100% / 12) * 3);max-width:calc((100% / 12) * 3)}.col_4_t{flex:0 0 calc((100% / 12) * 4);max-width:calc((100% / 12) * 4)}.col_5_t{flex:0 0 calc((100% / 12) * 5);max-width:calc((100% / 12) * 5)}.col_6_t{flex:0 0 calc((100% / 12) * 6);max-width:calc((100% / 12) * 6)}.col_7_t{flex:0 0 calc((100% / 12) * 7);max-width:calc((100% / 12) * 7)}.col_8_t{flex:0 0 calc((100% / 12) * 8);max-width:calc((100% / 12) * 8)}.col_9_t{flex:0 0 calc((100% / 12) * 9);max-width:calc((100% / 12) * 9)}.col_10_t{flex:0 0 calc((100% / 12) * 10);max-width:calc((100% / 12) * 10)}.col_11_t{flex:0 0 calc((100% / 12) * 11);max-width:calc((100% / 12) * 11)}.col_12_t{flex:0 0 calc((100% / 12) * 12);max-width:calc((100% / 12) * 12)}.order_1_t{order:1}.order_2_t{order:2}.order_3_t{order:3}.order_4_t{order:4}.order_5_t{order:5}.order_6_t{order:6}}@media only screen and (max-width:767px){.five_sixth,.four_fifth,.one_fifth,.one_fourth,.one_half,.one_sixth,.one_third,.three_fifth,.three_fourth,.three_sixth .four_sixth,.two_fifth,.two_fourth,.two_sixth,.two_third,[class*=col_]{flex:0 0 100%;max-width:none}.autogrid_grid .column,.column[class*=col_]{padding-left:0!important;padding-right:0!important;margin-bottom:25px}.autogrid[class*=offset_],.autogrid_grid[class*=offset_],.column[class*=offset_]{margin-left:0}.autogrid_grid,.autogrid_row,.autogrid_wrapper{margin-left:0!important;margin-right:0!important}.autogrid_grid>.column>.attributes.has-image.empty>.image_mob,.autogrid_grid>.column>.attributes.has-image.empty>.same-height-wrap>.image_mob,.autogrid_row>.column>.attributes.has-image.empty>.image_mob,.autogrid_row>.column>.attributes.has-image.empty>.same-height-wrap>.image_mob{display:block}.autogrid_grid>.column>.attributes.has-image.empty,.autogrid_row>.column>.attributes.has-image.empty{background:0 0!important}.col_1_m{flex:0 0 calc((100% / 12) * 1);max-width:calc((100% / 12) * 1)}.col_2_m{flex:0 0 calc((100% / 12) * 2);max-width:calc((100% / 12) * 2)}.col_3_m{flex:0 0 calc((100% / 12) * 3);max-width:calc((100% / 12) * 3)}.col_4_m{flex:0 0 calc((100% / 12) * 4);max-width:calc((100% / 12) * 4)}.col_5_m{flex:0 0 calc((100% / 12) * 5);max-width:calc((100% / 12) * 5)}.col_6_m{flex:0 0 calc((100% / 12) * 6);max-width:calc((100% / 12) * 6)}.col_7_m{flex:0 0 calc((100% / 12) * 7);max-width:calc((100% / 12) * 7)}.col_8_m{flex:0 0 calc((100% / 12) * 8);max-width:calc((100% / 12) * 8)}.col_9_m{flex:0 0 calc((100% / 12) * 9);max-width:calc((100% / 12) * 9)}.col_10_m{flex:0 0 calc((100% / 12) * 10);max-width:calc((100% / 12) * 10)}.col_11_m{flex:0 0 calc((100% / 12) * 11);max-width:calc((100% / 12) * 11)}.col_12_m{flex:0 0 calc((100% / 12) * 12);max-width:calc((100% / 12) * 12)}.order_1_m{order:1}.order_2_m{order:2}.order_3_m{order:3}.order_4_m{order:4}.order_5_m{order:5}.order_6_m{order:6}.autogrid_grid>.column>.attributes.p-l,.autogrid_grid>.column>.attributes.p-m,.autogrid_grid>.column>.attributes.p-s,.autogrid_grid>.column>.attributes.p-xl,.autogrid_grid>.column>.attributes.p-xs,.autogrid_row>.column .attributes.p-l,.autogrid_row>.column .attributes.p-m,.autogrid_row>.column .attributes.p-s,.autogrid_row>.column .attributes.p-xl,.autogrid_row>.column .attributes.p-xs{padding:20px}.autogrid_grid .column.m_align_left_top{text-align:left}.autogrid_grid .column.m_align_left_center{text-align:left;align-self:center}.autogrid_grid .column.m_align_left_bottom{text-align:left;align-self:flex-end}.autogrid_grid .column.m_align_center_top{text-align:center}.autogrid_grid .column.m_align_center_center{text-align:center;align-self:center}.autogrid_grid .column.m_align_center_bottom{text-align:center;align-self:flex-end}.autogrid_grid .column.m_align_right_top{text-align:right}.autogrid_grid .column.m_align_right_center{text-align:right;align-self:center}.autogrid_grid .column.m_align_right_bottom{text-align:right;align-self:flex-end}.autogrid_row>.column.m_align_left_top{text-align:left}.autogrid_row>.column.m_align_left_center{text-align:left;align-self:center}.autogrid_row>.column.m_align_left_bottom{text-align:left;align-self:flex-end}.autogrid_row>.column.m_align_center_top{text-align:center}.autogrid_row>.column.m_align_center_center{text-align:center;align-self:center}.autogrid_row>.column.m_align_center_bottom{text-align:center;align-self:flex-end}.autogrid_row>.column.m_align_right_top{text-align:right}.autogrid_row>.column.m_align_right_center{text-align:right;align-self:center}.autogrid_row>.column.m_align_right_bottom{text-align:right;align-self:flex-end}}body.edge column[class*=col_]{flex-basis:1}@media only screen and (max-width:767px){body.edge column[class*=col_]{flex-basis:100%}}
#colorbox,#cboxOverlay,#cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden;-webkit-transform:translate3d(0,0,0)}#cboxWrapper{max-width:none}#cboxOverlay{position:fixed;width:100%;height:100%}#cboxMiddleLeft,#cboxBottomLeft{clear:left}#cboxContent{position:relative}#cboxLoadedContent{overflow:auto;-webkit-overflow-scrolling:touch}#cboxTitle{margin:0}#cboxLoadingOverlay,#cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%;height:100%}#cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{cursor:pointer}.cboxPhoto{float:left;margin:auto;border:0;display:block;max-width:none;-ms-interpolation-mode:bicubic}.cboxIframe{width:100%;height:100%;display:block;border:0;padding:0;margin:0}#colorbox,#cboxContent,#cboxLoadedContent{box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box}#cboxOverlay{background:#000;opacity:.9;filter:alpha(opacity = 90)}#colorbox{outline:0}#cboxContent{margin-top:20px;background:#000}.cboxIframe{background:#fff}#cboxError{padding:50px;border:1px solid #ccc}#cboxLoadedContent{border:5px solid #000;background:#fff}#cboxTitle{position:absolute;top:-20px;left:0;color:#ccc}#cboxCurrent{position:absolute;top:-20px;right:0;color:#ccc}#cboxLoadingGraphic{background:url(../../assets/colorbox/images/loading.gif) no-repeat center center}#cboxPrevious,#cboxNext,#cboxSlideshow,#cboxClose{border:0;padding:0;margin:0;overflow:visible;width:auto;background:0 0}#cboxPrevious:active,#cboxNext:active,#cboxSlideshow:active,#cboxClose:active{outline:0}#cboxSlideshow{position:absolute;top:-20px;right:90px;color:#fff}#cboxPrevious{position:absolute;top:50%;left:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top left;width:28px;height:65px;text-indent:-9999px}#cboxPrevious:hover{background-position:bottom left}#cboxNext{position:absolute;top:50%;right:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top right;width:28px;height:65px;text-indent:-9999px}#cboxNext:hover{background-position:bottom right}#cboxClose{position:absolute;top:5px;right:5px;display:block;background:url(../../assets/colorbox/images/controls.png) no-repeat top center;width:38px;height:19px;text-indent:-9999px}#cboxClose:hover{background-position:bottom center}
.content-slider{overflow:hidden;visibility:hidden;position:relative}.slider-wrapper{overflow:hidden;position:relative}.slider-wrapper>*{float:left;width:100%;position:relative}.slider-control{height:30px;position:relative}.slider-control a,.slider-control .slider-menu{position:absolute;top:9px;display:inline-block}.slider-control .slider-prev{left:0}.slider-control .slider-next{right:0}.slider-control .slider-menu{top:0;width:50%;left:50%;margin-left:-25%;font-size:27px;text-align:center}.slider-control .slider-menu b{color:#bbb;cursor:pointer}.slider-control .slider-menu b.active{color:#666}
/* =============================================================================
 * ce_gallery
 * ========================================================================== */

.ce_gallery .cols_2 li {
	width: calc(100% / 2);
	float: left;
}

.ce_gallery .cols_3 li {
	width: calc(100% / 3);
	float: left;
}

.ce_gallery .cols_4 li {
	width: calc(100% / 4);
	float: left;
}

.ce_gallery .cols_5 li {
	width: calc(100% / 5);
	float: left;
}

.ce_gallery .cols_6 li {
	width: calc(100% / 6);
	float: left;
}

.ce_gallery .cols_7 li {
	width: calc(100% / 7);
	float: left;
}

.ce_gallery .cols_8 li {
	width: calc(100% / 8);
	float: left;
}

.ce_gallery .cols_9 li {
	width: calc(100% / 9);
	float: left;
}

.ce_gallery .cols_10 li {
	width: calc(100% / 10);
	float: left;
}

.ce_gallery .cols_11 li {
	width: calc(100% / 11);
	float: left;
}

.ce_gallery .cols_12 li {
	width: calc(100% / 12);
	float: left;
}

.edge .ce_gallery .cols_2 li {
	width: 49.8%;
	float: left;
}

.edge .ce_gallery .cols_3 li {
	width: 33.20%;
	float: left;
}

.edge .ce_gallery .cols_4 li {
	width: 24.98%;
	float: left;
}

.edge .ce_gallery .cols_5 li {
	width: 19.98%;
	float: left;
}

.edge .ce_gallery .cols_6 li {
	width: 16.65%;
	float: left;
}

.edge .ce_gallery .cols_7 li {
	width: 14.285%;
	float: left;
}

.edge .ce_gallery .cols_8 li {
	width: 12.46%;
	float: left;
}

.edge .ce_gallery .cols_9 li {
	width: 11.11%;
	float: left;
}

.edge .ce_gallery .cols_10 li {
	width: 10%;
	float: left;
}

.edge .ce_gallery .cols_11 li {
	width: 9.09%;
	float: left;
}

.edge .ce_gallery .cols_12 li {
	width: 8.33%;
	float: left;
}

.ce_gallery .gallery-margin {
	margin-left: -10px;
	margin-right: -10px;
}

.ce_gallery .gallery-margin .image_container {
	margin: 0 5px 10px;

}

.ce_gallery .image_container {
	margin: 0;
}

.ce_gallery a {
	width: 100%;
	height: 100%;
	display: block;
}

.ce_gallery .content {
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
	height: 100%;
	background: rgba(152,152,152,0.8);
	opacity: 0;
	transition: All 0.5s ease;
	-webkit-transition: All 0.5s ease;
}

.ce_gallery li:hover .content {
	opacity: 1;
}

.ce_gallery li img {
	transition: All 0.5s ease;
	-webkit-transition: All 0.5s ease;
}

.ce_gallery .image_container {
	overflow: hidden;
}

.ce_gallery .content-outside {
	display: table;
	width: 100%;
	height: 100%;
}

.ce_gallery .content-inside {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	color: rgb(255,255,255);
	line-height: 1.5;
}

.ce_gallery .capt h1,
.ce_gallery .capt h2,
.ce_gallery .capt h3,
.ce_gallery .capt h4,
.ce_gallery .capt h5,
.ce_gallery .capt h6 {
	font-size: 1.067rem;
	font-weight: bold;
	letter-spacing: 1px;
	color: rgb(255,255,255);
	margin: 0;
}

.ce_gallery .capt h1:after,
.ce_gallery .capt h2:after,
.ce_gallery .capt h3:after,
.ce_gallery .capt h4:after,
.ce_gallery .capt h5:after,
.ce_gallery .capt h6:after {
	content: '';
	width: 50px;
	height: 2px;
	display: block;
	margin: 8px auto 15px auto;
	background: rgb(255,255,255);
}

.ce_gallery .capt {
	font-size: 0.8rem;
}

.ce_gallery .borders li {
	border-right: 1px solid rgb(229,229,229);
	border-bottom: 1px solid rgb(229,229,229);
}

.ce_gallery .borders li.row_last {
	border-bottom: 1px solid transparent;
}

.ce_gallery .borders li.col_last {
	border-right-color: transparent;
}

.ce_gallery .borders li:hover img {
	transform: none;
	-webkit-transform: none;
}

.ce_gallery .borders figcaption {
	width: 100% !important; 
	border-radius: 0; 
	text-align: center;
}

.ce_gallery .image_container i.fa.fa-plus-circle {
	position: relative;
	height: 50px;
	width: 50px;
}

.ce_gallery .image_container i.fa.fa-plus-circle:before {
	content: '';
	width: 50px;
	height: 1px;
	background: rgb(255,255,255);
	display: inline-block;
	position: absolute;
	top: 25px;
	left: 0;
	-webkit-transition: all 0.2s;
	transition: all 0.2s;
}

.ce_gallery .image_container i.fa.fa-plus-circle:after {
	content: '';
	width: 50px;
	height: 1px;
	background: rgb(255,255,255);
	display: inline-block;
	position: absolute;
	top: 25px;
	left: 0;
}

.ce_gallery li:hover .image_container i.fa.fa-plus-circle:before {
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
}

.ce_gallery .capt {
	font-size: inherit;
}

/* =============================================================================
 * ce_gallery flex-gallery
 * ========================================================================== */

.ce_gallery ul.flex-gallery {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.ce_gallery ul.flex-gallery li {
	max-width: none;
	line-height: 0;
	text-align: center;
}

.ce_gallery ul.flex-gallery.cols_1 li {
	flex: 0 0 100%;
}

.ce_gallery ul.flex-gallery.cols_2 li {
	flex: 0 0 calc(100% / 2);
}

.ce_gallery ul.flex-gallery.cols_3 li {
	flex: 0 0 calc(100% / 3);
}

.ce_gallery ul.flex-gallery.cols_4 li {
	flex: 0 0 calc(100% / 4);
}

.ce_gallery ul.flex-gallery.cols_5 li {
	flex: 0 0 calc(100% / 5);
}

.ce_gallery ul.flex-gallery.cols_6 li {
	flex: 0 0 calc(100% / 6);
}

.ce_gallery ul.flex-gallery.cols_7 li {
	flex: 0 0 calc(100% / 7);
}

.ce_gallery ul.flex-gallery.cols_8 li {
	flex: 0 0 calc(100% / 8);
}

.ce_gallery ul.flex-gallery.cols_9 li {
	flex: 0 0 calc(100% / 9);
}

.ce_gallery ul.flex-gallery.cols_10 li {
	flex: 0 0 calc(100% / 10);
}

.ce_gallery ul.flex-gallery.cols_11 li {
	flex: 0 0 calc(100% / 11);
}

.ce_gallery ul.flex-gallery.cols_12 li {
	flex: 0 0 calc(100% / 12);
}

.ce_gallery .borders.flex-gallery {
	align-items: inherit;
}
/* =============================================================================
* smart phones  (s / small screens)
* ========================================================================== */
@media only screen and (max-width: 767px) {
	.ce_gallery .gallery-margin .image_container {
		margin-bottom: 10px;
	}
	
	.ce_gallery [class*='cols_'] li {
		width: 49.8%;
	}

	.ce_gallery .borders li,
	.ce_gallery .borders li.col_last {
		border-right: 1px solid transparent;
		width: 50%;
	}

	.ce_gallery .borders li.row_last {
		border-bottom: 1px solid rgb(229,229,229);
	}

	.ce_gallery .borders li:nth-child(odd) {
		border-right: 1px solid rgb(229,229,229);
	}

	.ce_gallery ul.flex-gallery li {
		flex: 0 0 50%!important;
	}
}




/* =============================================================================
 * ce_iconbox default
 * ========================================================================== */

.ce_iconbox {
	text-align: center;
	display: block;
	position: relative;
	overflow: visible;
}

.ce_iconbox.padding:hover {
	z-index: 100;
}

.ce_iconbox.default i {
	font-size: 3rem;
}

.ce_iconbox .ce_iconbox_inside {
	position: relative;
}

.ce_iconbox .ce_iconbox_outside {
	width:100%;
}

.ce_iconbox .ce_iconbox_outside.padding {
	padding: 25px;
	transition: All 0.3s ease;
	-webkit-transition: All 0.3s ease;
}

.ce_iconbox:hover .ce_iconbox_outside.padding {
	opacity: 1;
	box-shadow: 0 40px 70px rgba(0,0,0,.2);
	z-index: 100;
}

.ce_iconbox .ce_iconbox_outside.padding .content {
	opacity: 0.6;
}

.ce_iconbox a.link {
	margin-top: 10px;
	display: inline-block;
}

.ce_iconbox .image_container {
	text-align: center;
	margin-bottom: 0;
}

.ce_iconbox .image_container img {
	width: auto;
	display: inline-block;
}

.ce_iconbox h3 {
	font-size: 1.2rem;
	letter-spacing: 1px;
	position: relative;
	line-height: 1.4;
	margin-bottom: 10px;
}

.ce_iconbox .headline {
	margin-bottom: 0;
}

.ce_iconbox .content {
	margin-top: 10px;
}

.ce_iconbox:not(.version2):not(.version3) .ce_iconbox_cwrapper {
	margin-top: 20px;
}

.ce_iconbox .link:before {
	content: "\f101";
	font-family:FontAwesome;
	font-weight: normal;
	display: inline-block;
	margin-right: 5px;
}

.ce_iconbox.version2 .link:before {
	transition: All 0.3s ease;
	-webkit-transition: All 0.3s ease;
}

.ce_iconbox.version2:hover .link:before {
	margin-right: 10px;
}

.ce_iconbox.same-height {
	display: flex!important;
}

.ce_iconbox.default .image_container,
.ce_iconbox.default i {
	padding-top: 5px;
	transition: All 0.3s ease;
	-webkit-transition: All 0.3s ease;
	position: relative;
	top: 0;
}
.ce_iconbox.default:hover .image_container,
.ce_iconbox.default:hover i {
	top: -5px;
}
.ce_iconbox li {
	list-style-type: circle;
	list-style-position: inside;
}

.ce_iconbox.right-align .ce_iconbox_inside {
	justify-content: right;
}

/* =============================================================================
 * ce_iconbox.version2
 * ========================================================================== */

.ce_iconbox.version2 .ce_iconbox_inside {
	text-align: left;
	display: flex;
	align-items: center;
}

.ce_iconbox.version2 .ce_iconbox_icon  {
	flex: 0 0 80px;
	align-self: flex-start;
}

.ce_iconbox.version2 .headline {
	padding-top: 0;
}

.ce_iconbox.version2 .image_container {
	line-height: 1.4;
}

.ce_iconbox.version2 .image_container img {
	width: 60px;
}

.ce_iconbox.version2 i {
	font-size: 1.733rem;
	border-radius: 100%;
	text-align: center;
	width: 60px;
	max-width: 60px;
	height: 60px;
	line-height: 60px;
	color: rgb(255,255,255);
	background: rgb(229,229,229);
}

.ce_iconbox.version2 .ce_iconbox_inside:after {
	position: absolute;
	left: 30px;
	top: 0;
	width: 1px;
	height: 100%;
	content:'';
	border-right: 1px dashed rgb(229,229,229);
	z-index: 1;
}

.ce_iconbox.version2:last-of-type .ce_iconbox_inside:after {
	display:none;
}

.ce_iconbox.version2 .image_container {
	text-align: left;
}

.ce_iconbox.version2 a.link {
	margin-top: 0;
}

/* =============================================================================
 * ce_iconbox.version2.right
 * ========================================================================== */

.ce_iconbox.version2.right-align .ce_iconbox_inside {
	text-align: right;
	display: flex;
	align-items: center;
}

.ce_iconbox.version2.right-align .ce_iconbox_icon {
	flex: 0 0 80px;
	align-self: flex-start;
	order: 2;
}

.ce_iconbox.version2 .ce_iconbox_cwrapper {
	order: 1;
}

.ce_iconbox.version2.right-align:last-of-type .ce_iconbox_inside:after {
	display:none;
}

.ce_iconbox.version2.right-align .image_container {
	text-align: right;
}

.ce_iconbox.version2 .ce_iconbox_inside:after {
	display: none;
}

/* =============================================================================
 * ce_iconbox.version3
 * ========================================================================== */

 .ce_iconbox.version3 .ce_iconbox_inside {
 	text-align: left;
 	display: flex;
 	align-items: center;
 }

.ce_iconbox.version3 .ce_iconbox_icon {
	flex: 0 0 50px;
	align-self: flex-start;
}

.ce_iconbox.version3 .headline {
	padding-top: 0;
}

.ce_iconbox.version3 .image_container {
	line-height: 1.4;
}

.ce_iconbox.version3 .image_container img {
	width: 30px;
}

.ce_iconbox.version3 i {
	font-size: 2.2rem;
	line-height: 2.2rem;
	text-align: center;
	width: 40px;
}

.ce_iconbox.version3:last-of-type .ce_iconbox_inside:after {
	display:none;
}
 
.ce_iconbox.version3 a.link {	
	margin-top: 0;
}

.ce_iconbox.version3.xsmall i {
	font-size: inherit;
	line-height: inherit;
	text-align: left;
	width: 25px;
}

.ce_iconbox.version3.xsmall p {
	margin-bottom: 0;
	line-height: inherit;
}

.ce_iconbox.version3.xsmall .ce_iconbox_icon {
	flex: 0 0 25px;
}

.ce_iconbox.version3.xsmall .content {
	margin-top: 0;
}

/* =============================================================================
 * ce_iconbox.version4
 * ========================================================================== */

.ce_iconbox.version4 {
	text-align: left;
}

.ce_iconbox.version4 .image_container {
	text-align: left;
}

/* =============================================================================
 * ce_iconbox same-height
 * ========================================================================== */
 
.autogrid_row.same_height .ce_iconbox,
.autogrid_row.same_height .ce_iconbox .ce_iconbox_outside {
	height: 100%;
}

/* =============================================================================
* smart phones  (s / small screens)
* ========================================================================== */
@media only screen and (max-width: 767px) {
	.ce_iconbox:not(.no_gutter):not(.version3.xsmall) {
		margin-bottom: 30px;
	}
	
	.ce_iconbox.version2.right-align .ce_iconbox_inside {
		text-align: left;
	}
	
	.ce_iconbox.version2.right-align .image_container {
		text-align: left;
	}
	
	.ce_iconbox.version2.right-align .ce_iconbox_icon {
		order: 1;
	}
	
	.ce_iconbox.version2 .ce_iconbox_cwrapper {
		order: 2;
	}

	.ce_iconbox.same-height {
		display: block!important;
	}
}
/* ═════════  Schrift: Inter (selbst gehostet, DSGVO-konform)  ═════════
   Die Schriftdateien müssen auf den Server geladen werden. Erwarteter
   Ort: files/spielplan/fonts/  — falls abweichend, die url() unten
   anpassen. Pfade mit führendem / sind absolut ab Server-Root und
   funktionieren unabhängig davon, wo diese CSS-Datei liegt. */


@font-face {
    font-family: 'Inter Variable';
    src: url('../../files/cto_layout/fonts/inter/Inter-VariableFont_opsz,wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter Variable';
    src: url('../../files/cto_layout/fonts/inter/Inter-Italic-VariableFont_opsz,wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: italic;
    font-display: swap;
}


/* ═════════════════════════════════════════════════════════════════
   KÜCHWALDBÜHNE — SPIELPLAN STYLESHEET
   ─────────────────────────────────────────────────────────────────
   Gehört zu: spielplan-vorschau.html
   
   Diese Datei enthält das komplette visuelle Erscheinungsbild des
   Spielplans. Die HTML-Datei beschreibt nur die Struktur und Inhalte.
   Anpassungen am Aussehen (Farben, Abstände, Schriftgrößen, Layouts)
   können hier vorgenommen werden, ohne die HTML zu berühren.
   
   Die wichtigsten Anker zur Orientierung:
   · :root              — alle Farb- und Schrift-Variablen
   · .kb-header         — Menüband oben
   · .kb-hero           — Hero-Foto
   · .kb-pagehead       — "Spielplan"-Überschrift mit Eyebrow
   · .kb-toolbar        — Filter-Chips und Suche
   · .kb-event          — eine einzelne Veranstaltungskarte
   · .kb-event-dates     — <table> mit Datum/Uhrzeit/Aktion
   · .kb-event-date      — <tr> für eine einzelne Aufführung
   · .kb-status         — Premiere und "Zum letzten Mal" Tags
   · .kb-event--out     — Fällt-aus-Effekt für die ganze Karte
   · .kb-footer         — Partner, Sponsoren, Kontakt
   · @media-Blöcke      — Mobile-Anpassungen ab Zeilen-Ende
   ─────────────────────────────────────────────────────────────────  */

/* ═════════  Designtokens  ═════════ */
:root {
  --color-paper:        #F4F1E8;
  --color-card:         #FDFCF5;
  --color-card-hover:   #FFFFFA;

  --color-header:  #D2DEE0;
  /* --color-header: #DDE3D7; */
  /* --color-header: #E1E0D6; */

  --color-text:       #24211D;
  --color-muted:      #6F675E;
  --color-faint:      #B0A89D;

  --color-line:       rgba(36,33,29,0.16);
  --color-line-soft:  rgba(36,33,29,0.08);

  --color-green:      #17483F;
  --color-green-hover:#0E342D;

  --color-burgund:    #8B2E1F;
  --color-gold:       #C9A227;

  --font-body: 'Inter Variable', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --max-width: 1280px;
  --radius:    6px;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--color-paper);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
img { display: block; max-width: 100%; }

/* ─── Schrift: Theme-Font durch Inter ersetzen ─── */
body,
#wrapper,
#main,
#header,
#header a,
.kb-pagehead,
.kb-pagehead h1,
.kb-toolbar,
.kb-list,
.kb-event,
.kb-event h2,
.kb-footer {
  font-family: 'Inter Variable', system-ui, -apple-system, 'Segoe UI', sans-serif !important;
}



/* ═════════  Inhalt  ═════════ */
.kb-content {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 28px 88px 28px;
}

/* ═════════  Spielplan-Kopf (Überschrift-Element)  ═════════ */
.kb-pagehead {
  padding: 0 0 36px 0;
  border-bottom: 1px solid var(--color-line);
}
@media (max-width: 860px) {
  .kb-pagehead { padding: 0 0 30px 0; }
}
.kb-eyebrow {
  color: var(--color-green);
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  margin: 0 0 14px 0;
}
.kb-page-title {
  margin: 0;
  color: var(--color-text);
  font-size: clamp(2.4rem, 5vw, 4.2rem);
  font-weight: 700;
  line-height: 0.98;
  letter-spacing: -0.04em;
}
.kb-lead {
  margin: 22px 0 0 0;
  max-width: 640px;
  font-size: clamp(1rem, 1.3vw, 1.15rem);
  color: #3C3833;
  line-height: 1.55;
}

/* ═════════  Footer  ═════════ */
.kb-footer {
  background: var(--color-paper);
  padding: 64px 28px 32px 28px;
  border-top: 1px solid var(--color-line);
  margin-top: 56px;
}
.kb-footer-inner { max-width: var(--max-width); margin: 0 auto; }
.kb-footer-heading {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  text-align: center;
  margin: 0 0 28px 0;
}
.kb-footer-section { margin-bottom: 56px; }
.kb-partner-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 32px 24px;
  align-items: center;
  justify-items: center;
  max-width: 1100px;
  margin: 0 auto;
}
.kb-partner-logo {
  position: relative;
  width: 100%;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.kb-partner-logo img {
  max-width: 100%; max-height: 100%; object-fit: contain;
  position: relative; z-index: 1;
}
.kb-partner-placeholder {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  padding: 8px; text-align: center;
  font-size: 10px; color: #B0B0AB;
  letter-spacing: 0.05em;
  border: 1px dashed rgba(36,33,29,0.12);
  z-index: 0;
}
.kb-sponsor-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 28px 24px;
  align-items: center;
  justify-items: center;
  background: #EBE7DA;
  padding: 32px 24px;
  max-width: 1100px;
  margin: 0 auto;
  border-radius: var(--radius);
}
@media (min-width: 800px) {
  .kb-sponsor-grid { grid-template-columns: repeat(4, 1fr); }
}
.kb-sponsor-logo {
  position: relative; width: 100%; height: 70px;
  display: flex; align-items: center; justify-content: center;
}
.kb-sponsor-logo img {
  max-width: 100%; max-height: 100%; object-fit: contain;
  position: relative; z-index: 1;
}
.kb-sponsor-placeholder {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  padding: 6px; text-align: center;
  font-size: 10px; color: #A8A89F;
  letter-spacing: 0.04em;
  border: 1px dashed rgba(36,33,29,0.12);
  z-index: 0;
}
.kb-footer-info {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 32px;
  padding: 48px 0 32px 0;
  border-top: 1px solid var(--color-line);
}
.kb-footer-col h3 {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--color-green);
  margin: 0 0 14px 0;
}
.kb-footer-col p { font-size: 13px; line-height: 1.6; margin: 0; }
.kb-footer-col strong { font-weight: 700; }
.kb-footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 24px;
  border-top: 1px solid var(--color-line);
  font-size: 12px;
  color: var(--color-muted);
}
.kb-footer-bottom a { margin-left: 18px; text-decoration: none; }
.kb-footer-bottom a:hover { color: var(--color-green); }
@media (max-width: 600px) {
  .kb-footer-bottom { flex-direction: column; gap: 8px; }
  .kb-footer-bottom a { margin-left: 0; }
}


/* ═══════════════════════════════════════════════════════════════════
   THEME-ÜBERSCHREIBUNGEN
   ───────────────────────────────────────────────────────────────────
   Dieser Abschnitt überschreibt das Contao-Theme-CSS (49_*.css,
   animate/t.css usw.), damit die Spielplan-Seite den Mockup-Look
   bekommt — beigefarbener Seitenhintergrund, Himmelblau-Header.

   Wirkt nur auf der neuen Seite, weil das neue Seitenlayout ein
   eigenes ist und diese Datei nur dort eingebunden wird. Die alte
   öffentliche Seite nutzt ein anderes Layout und bleibt unberührt.

   !important ist hier notwendig, weil das Theme-CSS an mehreren
   Stellen selbst !important verwendet bzw. sehr spezifische
   Selektoren hat.
   ═══════════════════════════════════════════════════════════════════ */

/* ─── Seitenhintergrund ─── */
html,
body {
  background: var(--color-paper) !important;
  background-image: none !important;
}

#contentwrapper,
#fix-wrapper,
#wrapper,
.body {
  background: var(--color-paper) !important;
}

/* ─── Obere Leiste / Header ─── */
#top-wrapper,
#header,
#header.header,
#header.header.original {
  background: var(--color-header) !important;
  border-bottom: 1px solid var(--color-green);
}

/* Falls der Header beim Scrollen fixiert wird (Body-Klasse
   "fixed-header" / "#top-wrapper.fixed"): Hintergrund konsistent
   halten, nicht das dunkle Theme-Overlay zeigen */
#top-wrapper.fixed {
  background: var(--color-header) !important;
  box-shadow: 0 1px 6px rgba(36, 33, 29, 0.08) !important;
}

/* Header-Innencontainer transparent lassen, damit die
   Hintergrundfarbe vom Header durchscheint */
#header .inside {
  background: transparent !important;
}


/* ─── Nachjustierung Header (Stand: Fehlerbild weiße Schrift,
       schwarze Linie, Hintergrund unverändert) ─────────────────────

   Hinweis: Diese Selektoren sind breit angelegt, weil die exakte
   Farbquelle ohne Browser-Inspektor nicht eindeutig ist. Sobald
   die echten Selektoren bekannt sind, kann das verschlankt werden. */

/* Schwarze Trennlinie am Header entfernen.
   Das Theme setzt diverse Border — wir nehmen sie am Header weg. */
#header,
#header.header,
#header.header.original,
#top-wrapper,
#header .inside {
  border: 0 !important;
  box-shadow: none !important;
}

/* Falls die "schwarze Linie" ein Trennstrich vor den Social-Icons
   ist (.header .mod_socials:before) — den ausblenden */
#header .mod_socials:before {
  display: none !important;
}

/* Seitenhintergrund — breiter gefasst, falls das Theme die Farbe
   an einem zusätzlichen Container setzt */
#main,
#container,
.mod_article,
.body_top,
.body_bottom {
  background: var(--color-paper) !important;
}

/* Header-Schrift dunkel statt weiß.
   Navigation, Metanavigation, Logo-Text, alle Links im Header. */
#header,
#header a,
#header .mainmenu ul li a,
#header .mainmenu ul li a.active,
#header .mainmenu ul li a.trail,
#header .header_metanavi a,
#header .mod_socials a {
  color: var(--color-text) !important;
}

/* Aktiver / aktueller Menüpunkt im Forest-Green hervorheben */
#header .mainmenu ul li a.active,
#header .mainmenu ul li a.trail {
  color: var(--color-green) !important;
}

/* Social-Media-Icons (Font-Awesome) ebenfalls dunkel */
#header .mod_socials a i,
#header .mod_socials .fa {
  color: var(--color-text) !important;
}

/* ─── Hero-Bild: gleiche Breite wie Spielplan-Modul ───
   Das Hero-Bild soll nicht über den Content-Bereich hinausstehen.
   Falls die Breite nicht exakt stimmt, muss der Selektor an die
   tatsächliche Klasse des Hero-Containers angepasst werden. */
.ce_headerimage,
.ce_pageimage,
.mod_pageimage {
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  overflow: hidden;
}
@font-face {
    font-family: 'FontAwesome';
    src: url('../../files/cto_layout/fonts/fontawesome/fontawesome-webfont.eot');
    src: url('../../files/cto_layout/fonts/fontawesome/fontawesome-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../files/cto_layout/fonts/fontawesome/fontawesome-webfont.woff2') format('woff2'),
         url('../../files/cto_layout/fonts/fontawesome/fontawesome-webfont.woff') format('woff'),
         url('../../files/cto_layout/fonts/fontawesome/fontawesome-webfont.ttf') format('truetype'),
         url('../../files/cto_layout/fonts/fontawesome/fontawesome-webfont.svg#fontawesomeregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'noway_roundicons';
    src: url('../../files/cto_layout/fonts/nowayround/nowayround-icons-webfont.eot');
    src: url('../../files/cto_layout/fonts/nowayround/nowayround-icons-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../files/cto_layout/fonts/nowayround/nowayround-icons-webfont.woff2') format('woff2'),
         url('../../files/cto_layout/fonts/nowayround/nowayround-icons-webfont.woff') format('woff'),
         url('../../files/cto_layout/fonts/nowayround/nowayround-icons-webfont.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}


[class^="ni-"], [class*=" ni-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'noway_roundicons' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: annialiased;
  -moz-osx-font-smoothing: grayscale;
}

.ni::before {
  font-size: x-large;
}

.ni-top {
	font-size: xxx-large;
}

.ni-icon0:before { content:"0"; }
.ni-icon1:before { content:"1"; }
.ni-icon2:before { content:"2"; }
.ni-icon3:before { content:"3"; }
.ni-icon4:before { content:"4"; }
.ni-icon5:before { content:"5"; }
.ni-icon6:before { content:"6"; }
.ni-icon7:before { content:"7"; }
.ni-icon8:before { content:"8"; }
.ni-icon9:before { content:"9"; }

.ni-icona:before { content:"a"; }
.ni-iconb:before { content:"b"; }
.ni-iconc:before { content:"c"; }
.ni-icond:before { content:"d"; }
.ni-icone:before { content:"e"; }
.ni-iconf:before { content:"f"; }
.ni-icong:before { content:"g"; }
.ni-iconh:before { content:"h"; }
.ni-iconi:before { content:"i"; }
.ni-iconj:before { content:"j"; }
.ni-iconk:before { content:"k"; }
.ni-iconl:before { content:"l"; }
.ni-iconm:before { content:"m"; }
.ni-iconn:before { content:"n"; }
.ni-icono:before { content:"o"; }
.ni-iconp:before { content:"p"; }
.ni-iconq:before { content:"q"; }
.ni-iconr:before { content:"r"; }
.ni-icons:before { content:"s"; }
.ni-icont:before { content:"t"; }
.ni-iconu:before { content:"u"; }
.ni-iconv:before { content:"v"; }
.ni-iconw:before { content:"w"; }
.ni-iconx:before { content:"x"; }
.ni-icony:before { content:"y"; }
.ni-iconz:before { content:"z"; }

.ni-iconA:before { content:"A"; }
.ni-iconB:before { content:"B"; }
.ni-iconC:before { content:"C"; }
.ni-iconD:before { content:"D"; }
.ni-iconE:before { content:"E"; }
.ni-iconF:before { content:"F"; }
.ni-iconG:before { content:"G"; }
.ni-iconH:before { content:"H"; }
.ni-iconI:before { content:"I"; }
.ni-iconJ:before { content:"J"; }
.ni-iconK:before { content:"K"; }
.ni-iconL:before { content:"L"; }
.ni-iconM:before { content:"M"; }
.ni-iconN:before { content:"N"; }
.ni-iconO:before { content:"O"; }
.ni-iconP:before { content:"P"; }
.ni-iconQ:before { content:"Q"; }
.ni-iconR:before { content:"R"; }
.ni-iconS:before { content:"S"; }
.ni-iconT:before { content:"T"; }
.ni-iconU:before { content:"U"; }
.ni-iconV:before { content:"V"; }
.ni-iconW:before { content:"w"; }
.ni-iconX:before { content:"X"; }
.ni-iconY:before { content:"Y"; }
.ni-iconZ:before { content:"Z"; }

.ni-icon01:before { content:"!"; }
.ni-icon03:before { content:"#"; }
.ni-icon04:before { content:"$"; }
.ni-icon05:before { content:"%"; }
.ni-icon07:before { content:"'"; }
.ni-icon08:before { content:"("; }
.ni-icon09:before { content:")"; }
.ni-icon10:before { content:"*"; }
.ni-icon11:before { content:"+"; }
.ni-icon12:before { content:","; }
.ni-icon13:before { content:"-"; }
.ni-icon14:before { content:"."; }
.ni-icon15:before { content:"/"; }
.ni-icon16:before { content:":"; }
.ni-icon17:before { content:";"; }
.ni-icon19:before { content:"="; }
.ni-icon21:before { content:"?"; }
.ni-icon22:before { content:"@"; }
.ni-icon23:before { content:"["; }
.ni-icon25:before { content:"]"; }
.ni-icon26:before { content:"^"; }
.ni-icon27:before { content:"_"; }
.ni-icon28:before { content:"{"; }
.ni-icon29:before { content:"|"; }
.ni-icon30:before { content:"}"; }
.ni-icon31:before { content:"¡"; }
.ni-icon32:before { content:"¢"; }
.ni-icon33:before { content:"£"; }
.ni-icon34:before { content:"¦"; }
.ni-icon35:before { content:"§"; }
.ni-icon36:before { content:"©"; }
.ni-icon37:before { content:"ª"; }
.ni-icon38:before { content:"«"; }
.ni-icon39:before { content:"¬"; }
.ni-icon40:before { content:"®"; }
.ni-icon41:before { content:"°"; }
.ni-icon42:before { content:"²"; }
.ni-icon43:before { content:"³"; }
.ni-icon44:before { content:"¶"; }
.ni-icon45:before { content:"·"; }
.ni-icon46:before { content:"¹"; }
.ni-icon47:before { content:"º"; }
.ni-icon48:before { content:"»"; }
.ni-icon49:before { content:"¼"; }
.ni-icon50:before { content:"½"; }
.ni-icon51:before { content:"¾"; }
.ni-icon52:before { content:"¿"; }
.ni-icon53:before { content:"ß"; }
.ni-icon54:before { content:"à"; }
.ni-icon55:before { content:"á"; }
.ni-icon56:before { content:"â"; }
.ni-icon57:before { content:"ã"; }
.ni-icon58:before { content:"ä"; }
.ni-icon59:before { content:"å"; }
.ni-icon60:before { content:"è"; }
.ni-icon61:before { content:"é"; }
.ni-icon62:before { content:"ê"; }
.ni-icon63:before { content:"ë"; }
.ni-icon64:before { content:"ì"; }
.ni-icon65:before { content:"í"; }
.ni-icon66:before { content:"î"; }
.ni-icon67:before { content:"ï"; }
.ni-icon68:before { content:"ñ"; }
.ni-icon69:before { content:"ò"; }
.ni-icon70:before { content:"ó"; }
.ni-icon71:before { content:"ô"; }
.ni-icon72:before { content:"õ"; }
.ni-icon73:before { content:"ö"; }
.ni-icon74:before { content:"÷"; }
.ni-icon75:before { content:"ù"; }
.ni-icon76:before { content:"ú"; }
.ni-icon77:before { content:"û"; }
.ni-icon78:before { content:"ü"; }
.ni-icon79:before { content:"ƒ"; }
.ni-icon80:before { content:"‐"; }
.ni-icon81:before { content:"‑"; }
.ni-icon82:before { content:"‒"; }
.ni-icon83:before { content:"–"; }
.ni-icon84:before { content:"—"; }
.ni-icon85:before { content:"‘"; }
.ni-icon86:before { content:"’"; }
.ni-icon87:before { content:"‚"; }
.ni-icon88:before { content:"“"; }
.ni-icon89:before { content:"”"; }
.ni-icon90:before { content:"„"; }
.ni-icon91:before { content:"•"; }
.ni-icon92:before { content:"…"; }
.ni-icon93:before { content:"‰"; }
.ni-icon94:before { content:"‹"; }
.ni-icon95:before { content:"›"; }
.ni-icon96:before { content:"⁄"; }
.ni-icon97:before { content:"€"; }
.ni-icon98:before { content:"™"; }
.ni-icon99:before { content:"−"; }
.ni-icon100:before { content:"≠"; }
.ni-icon101:before { content:"◼"; }

/* ═════════  Toolbar  ═════════ */
.kb-toolbar {
  padding: 28px 0 24px 0;
  display: grid;
  grid-template-columns: 1fr minmax(220px, 320px);
  gap: 24px;
  align-items: center;
}
@media (max-width: 860px) { .kb-toolbar { grid-template-columns: 1fr; } }
.kb-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.kb-chip {
  appearance: none;
  border: 1px solid var(--color-line);
  background: transparent;
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  padding: 9px 14px;
  cursor: pointer;
  border-radius: var(--radius);
  transition: border-color 0.15s, background 0.15s, color 0.15s;
}
.kb-chip:hover,
.kb-chip.active {
  border-color: var(--color-green);
  background: var(--color-green);
  color: var(--color-card);
}
.kb-search { position: relative; }
.kb-search input {
  width: 100%;
  padding: 10px 14px 10px 38px;
  border: 0;
  /*border-bottom: 1px solid var(--color-line);*/
  background: transparent;
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 14px;
  outline: none;
  border-radius: 0;
  transition: border-color 0.15s;
}
.kb-search input::placeholder { color: var(--color-faint); }
.kb-search input:hover,
.kb-search input:focus {
  border-bottom-color: var(--color-green);
  border: 0 !important;
  background-color: transparent;
}
.kb-search svg {
  position: absolute;
  left: 13px;
  top: 50%;
  transform: translateY(-50%);
  width: 14px; height: 14px;
  color: var(--color-muted);
  pointer-events: none;
}

/* ═════════  Liste  ═════════ */
.kb-list { display: flex; flex-direction: column; gap: 18px; }
.kb-empty {
  text-align: center;
  padding: 64px 24px;
  color: var(--color-muted);
  font-style: italic;
  display: none;
}

/* ═════════  Veranstaltungs-Karte  ═════════ */
.kb-event {
  position: relative;
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr);
  gap: 32px;
  background: var(--color-card);
  border: 0.5px solid var(--color-line-soft);
  border-radius: var(--radius);
  padding: 28px;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.kb-event:hover {
  background: var(--color-card-hover);
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(36,33,29,0.05);
}
@media (max-width: 720px) {
  .kb-event {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 22px;
  }
}

/* Stretched-Link — die ganze Karte ist klickbar (Ziel: event_url).
   Liegt als unsichtbares <a> über der Karte. */
.kb-event-cardlink {
  position: absolute;
  inset: 0;
  z-index: 1;
}
.kb-event:hover .kb-event-title {
  color: var(--color-green);
}

/* Innen liegende, eigenständig klickbare Elemente müssen ÜBER
   dem Stretched-Link liegen, damit sie eigene Ziele behalten.
   Der Termin-Zeilen-Link (.kb-event-rowlink) bekommt z-index: 3
   weiter unten — er muss auch über diesen Elementen liegen. */
.kb-event-org,
.kb-event-expand {
  position: relative;
  z-index: 2;
}

/* ─── Plakat ─── */
.kb-event-poster {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1.414;
  background: #FFFFFF;
  border: 1px solid var(--color-line-soft);
  overflow: hidden;
  border-radius: 3px;
}
/* Tablet-Bereich (bis 720px): Plakat zentriert begrenzen,
   damit es auf breiteren Schirmen nicht zu groß wird */
@media (max-width: 720px) {
  .kb-event-poster {
    max-width: 240px;
    margin: 0 auto;
  }
}
/* Echtes Handyformat (bis 480px): Plakat auf 66% Breite,
   linksbündig. A4-Verhältnis bleibt durch aspect-ratio erhalten. */
@media (max-width: 480px) {
  .kb-event-poster {
    max-width: 66%;
    margin: 0;
  }
}
.kb-event-poster img {
  position: absolute; inset: 0; z-index: 2;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center;
}
.kb-event-poster .placeholder {
  position: absolute; inset: 0; z-index: 1;
  display: flex; align-items: center; justify-content: center;
  padding: 12px; text-align: center;
  font-size: 10px; color: #B0B0AB;
  letter-spacing: 0.10em; text-transform: uppercase;
}
.kb-event-poster .placeholder code {
  font-family: ui-monospace, monospace;
  font-size: 10px; color: #8A8A85;
  text-transform: none; letter-spacing: 0;
}

/* ─── Status-Tags ───
   Premiere und "Zum letzten Mal" sind <span>-Tags in der Title-Row.
   "Fällt aus" wird durch die Klasse kb-event--out auf dem <article>
   gesteuert — kein Tag im HTML nötig, alle Effekte (Banner, Graustufen,
   Hover-Sperre, Datums-Durchstreichung) leiten sich von der Klasse ab. */
.kb-status {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 5px 11px;
  color: var(--color-card);
  background: var(--color-burgund);
  border-radius: 3px;
  white-space: nowrap;
}
.kb-status--premiere { background: var(--color-burgund); }
.kb-status--last     { background: var(--color-gold); }

/* Komplett ausgefallen: alles über die Klasse am Article steuern */
.kb-event--out { pointer-events: none; }

/* Banner "Fällt aus" als Pseudo-Element auf dem Plakat */
.kb-event--out .kb-event-poster::after {
  content: 'Fällt aus';
  position: absolute;
  top: 38%;
  left: -8%;
  right: -8%;
  z-index: 4;
  background: var(--color-muted);
  color: var(--color-card);
  font-family: var(--font-body);
  font-size: clamp(15px, 2.2vw, 17px);
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  text-align: center;
  padding: 10px 0;
  transform: rotate(-7deg);
  box-shadow: 0 2px 8px rgba(0,0,0,0.18);
  pointer-events: none;
}

/* Graustufen für alle Sichtebenen */
.kb-event--out .kb-event-poster img,
.kb-event--out .kb-event-poster .placeholder,
.kb-event--out .kb-event-cat,
.kb-event--out .kb-event-title,
.kb-event--out .kb-event-sub,
.kb-event--out .kb-event-location,
.kb-event--out .kb-event-org {
  filter: grayscale(1);
  opacity: 0.55;
}

/* Bei kompletter Absage: nur die Texte durchstreichen, nicht die
   per ::before erzeugten Trennpunkte. */
.kb-event--out .kb-event-dates {
  color: var(--color-muted);
}
.kb-event--out .kb-event-date-day span,
.kb-event--out .kb-event-date-celltext {
  text-decoration: line-through;
}

/* Hover-Effekte deaktivieren */
.kb-event--out:hover {
  background: var(--color-card);
  transform: none;
  box-shadow: none;
}
.kb-event--out:hover .kb-event-title { color: var(--color-text); }

/* ─── Body ─── */
.kb-event-body { display: flex; flex-direction: column; min-width: 0; }

/* Der Fuß-Bereich (Hinweis-Zeile, Termin-Tabelle, Aufklapp-Schalter).
   Per margin-top: auto nach unten gedrückt — bei kurzem Text schließt
   das unterste Element bündig mit der Plakat-Unterkante ab. Beim
   Aufklappen wachsen neue Zeilen nach unten, die erste bleibt an
   Ort und Stelle, die Karte wird einfach höher.
   position: relative + z-index: 2 sorgt dafür, dass der Fuß-Bereich
   über dem Stretched-Cardlink (z-index: 1) liegt — damit funktioniert
   der Hover über den Termin-Zeilen. */
.kb-event-foot {
  display: flex;
  flex-direction: column;
  margin-top: auto;
  padding-top: 18px;
  position: relative;
  z-index: 2;
}

/* ─── Kicker (Kategorie + Veranstalter) ─── */
.kb-event-kicker {
  margin: 0 0 14px 0;
  font-size: 13px;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
}
.kb-event-cat {
  color: var(--color-green);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  font-size: 11px;
}
.kb-event-sep {
  color: var(--color-faint);
  margin: 0 10px;
}
.kb-event-org {
  color: var(--color-muted);
  text-decoration: none;
  font-weight: 500;
  transition: color 0.15s;
}
.kb-event-org:hover {
  color: var(--color-green);
}

/* ─── Titel + optionales Status-Tag ─── */
.kb-event-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 14px;
  margin: 0 0 12px 0;
}
.kb-event-title {
  margin: 0;
  color: var(--color-text);
  font-size: clamp(1.7rem, 3vw, 2.2rem);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.025em;
  /* Wörter NIE intern trennen — Umbruch nur an Leerzeichen bzw.
     an der per | gesetzten <wbr>-Stelle. Überschreibt evtl.
     vom Theme gesetzte break-word/hyphens-Regeln. */
  overflow-wrap: normal;
  word-break: normal;
  word-wrap: normal;
  hyphens: none;
}

/* ─── Untertitel ─── */
.kb-event-sub {
  margin: 0;
  font-size: 15px;
  color: var(--color-muted);
  line-height: 1.5;
  max-width: 600px;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}

/* ─── Optionale Ortsangabe (nur wenn != Küchwaldbühne) ─── */
.kb-event-location {
  margin: 14px 0 0 0;
  font-size: 13px;
  color: var(--color-muted);
}
.kb-event-location strong {
  font-weight: 700;
  color: var(--color-text);
}

/* ═════════  Termin-Bereich  ═════════
   Konzept: Jede Veranstaltung hat ein <table class="kb-event-dates">,
   in dem jeder Termin eine eigene <tr class="kb-event-date"> ist.
   Einzeltermine sind eine Tabelle mit einer Zeile, Mehrtermine sind
   dieselbe Tabelle mit mehreren Zeilen. Die Spalten-Ausrichtung
   (Uhrzeiten und Aktionen untereinander) erledigt der Browser
   automatisch via Tabellen-Layout.

   Spalten:
   ·  .kb-event-date-day     Datum (Wochentag, Datum)
   ·  .kb-event-date-time    Uhrzeit
   ·  .kb-event-date-place   (optional) Spielstätte falls != Küchwald
   ·  .kb-event-date-action  Tickets-Link / Anmelden / Abendkasse /
                             "fällt aus" bei einzeln ausgefallenem Termin

   Die Trennpunkte (·) werden via CSS-::before generiert, brauchen
   also keine eigenen Zellen im HTML. */

/* ─── Kontext-Hinweis über dem Datum (Termin / Premiere / Letzte /
       Heute) — wird vom JavaScript befüllt ─── */
.kb-event-dates-hint {
  margin: 0 0 1px 0;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--color-faint);
}
.kb-event-dates-hint--premiere { color: var(--color-burgund); }
.kb-event-dates-hint--letzte   { color: var(--color-gold); }
.kb-event-dates-hint--heute    { color: var(--color-green); }

/* ─── Aufklapp-Schalter für weitere Termine ─── */
.kb-event-expand {
  appearance: none;
  align-self: flex-start;
  margin: 14px 0 0 0;
  padding: 0;
  border: 0 !important;
  background: transparent;
  color: var(--color-muted);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: color 0.15s;
}
.kb-event-expand::after {
  content: ' ▾';
  font-size: 10px;
}
.kb-event-expand.is-open::after {
  content: ' ▴';
}
/* Hover — deutlicher Wechsel von gedämpft zu kräftigem Grün */
.kb-event-expand:hover {
  color: var(--color-green);
}

.kb-event-dates {
  margin: 0;
  align-self: start;
  border-collapse: collapse;
  font-size: 16px;
  color: var(--color-text);
  font-weight: 600;
  letter-spacing: -0.003em;
}

.kb-event-date td {
  vertical-align: baseline;
  padding: 5px 0;
  white-space: nowrap;
}
/* Erste sichtbare Zeile schließt direkt an den Hinweis an */
.kb-event-date:first-child td {
  padding-top: 0;
}

/* Wochentag-Abkürzung — auf Desktop versteckt, auf Mobile sichtbar.
   Wenn die Termin-Zeile aber eine Spielstätte enthält, wird der
   Wochentag automatisch weggelassen, damit der Inhalt schmaler bleibt. */
.kb-event-date-weekday { display: none; }

/* Trennpunkt vor jeder Spalte außer der ersten */
.kb-event-date-time::before,
.kb-event-date-place::before,
.kb-event-date-action::before {
  content: '·';
  color: var(--color-faint);
  margin: 0 12px;
}

/* Spielstätte: gleicher Textstil wie Datum/Uhrzeit */
.kb-event-date-place {
  color: var(--color-text);
  font-weight: 600;
}

/* "Abendkasse", "Eintritt frei", "Bald verfügbar" — Inline-Info.
   Bewusst nah am übrigen Zeilentext gehalten, nur leicht gedämpft. */
.kb-event-date-info {
  color: var(--color-muted);
  font-weight: 600;
}
/* "fällt aus" als Aktions-Text eines einzelnen Termins */
.kb-event-date-out {
  color: var(--color-burgund);
  font-style: italic;
  font-weight: 600;
}

/* Tickets / Anmelden — kein Unterstrich. Der Text liegt als
   <span> in der Aktions-Spalte; klickbar ist die GANZE Zeile
   über .kb-event-rowlink. */
.kb-event-tlink {
  color: var(--color-green);
  font-weight: 700;
  white-space: nowrap;
  transition: color 0.15s;
}
/* Beim Hover über die verlinkte Zeile wechselt auch der
   Tickets-Text auf die kräftigere Hover-Farbe */
.kb-event-date--link:hover .kb-event-tlink {
  color: var(--color-green-hover);
}

/* Pfeil: Linie und Spitze werden absolut auf derselben Mittelachse ausgerichtet */
.kb-event-tlink-arrow {
  --arrow-line: 1.1em;
  --arrow-line-hover: 1.8em;
  --arrow-head: 0.38em;
  --arrow-thickness: 1.5px;
  --arrow-overlap: 0.48em;

  position: relative;
  display: inline-block;
  width: calc(var(--arrow-line-hover) + var(--arrow-head));
  height: 1em;
  margin-left: 0.4em;
  vertical-align: middle;
  overflow: visible;
}

/* Linie */
.kb-event-tlink-arrow::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: var(--arrow-line);
  height: var(--arrow-thickness);
  background: currentColor;
  transform: translateY(-50%);
  transition: width 0.25s ease;
}

/* Pfeilspitze */
.kb-event-tlink-arrow::after {
  content: '';
  position: absolute;
  left: calc(var(--arrow-line) - var(--arrow-overlap));
  top: 50%;
  width: var(--arrow-head);
  height: var(--arrow-head);
  border-top: var(--arrow-thickness) solid currentColor;
  border-right: var(--arrow-thickness) solid currentColor;
  transform: translateY(-50%) rotate(45deg);
  transition: left 0.25s ease;
}

/* Beim Hover wächst die Linie, und die Spitze wandert mit */
.kb-event-date--link:hover .kb-event-tlink-arrow {
  --arrow-line: var(--arrow-line-hover);
}
/* Ausgefallener Einzeltermin: nur der Text wird durchgestrichen,
   NICHT der Trennpunkt (·), der per ::before erzeugt wird und
   außerhalb der Text-Spans liegt. */
.kb-event-date--aus .kb-event-date-day span,
.kb-event-date--aus .kb-event-date-celltext {
  text-decoration: line-through;
  color: var(--color-muted);
}

/* Termin-Zeile als Link — der zeilenfüllende <a> liegt in der
   ersten Zelle und deckt per absoluter Positionierung die ganze
   Zeile ab. Er liegt über dem Karten-Link (z-index). */
.kb-event-date--link {
  position: relative;
  cursor: pointer;
}
.kb-event-rowlink {
  position: absolute;
  inset: 0;
  z-index: 3;
}

/* Hover über eine Termin-Zeile — deutliche Verfärbung plus
   ein ganz leichter Hintergrund-Hinweis. */
.kb-event-date {
  transition: color 0.15s, background 0.15s;
}
.kb-event-date:hover {
  color: var(--color-green);
  background: rgba(23, 72, 63, 0.04);
}
.kb-event-date--link:hover {
  color: var(--color-green-hover);
  background: rgba(23, 72, 63, 0.06);
}

/* Sanftes Aufklappen — die aufgeklappten Zeilen gleiten kurz ein */
@keyframes kb-reveal {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.kb-event-date--reveal {
  animation: kb-reveal 0.25s ease forwards;
}

/* Utility: Inhalt auf schmalen Bildschirmen ein- oder ausblenden */
.show-on-mobile { display: none; }
@media (max-width: 540px) {
  .hide-on-mobile { display: none !important; }
  .show-on-mobile { display: inline; }
}

/* Mobile Termin-Anpassungen — größere Schrift für Lesbarkeit und
   bessere Antippbarkeit, symmetrischer Abstand. */
@media (max-width: 540px) {
  /* Auf Mobile gibt es keine Plakat-Spalte — der Fuß-Bereich
     braucht kein Nach-unten-Drücken, nur normalen Abstand. */
  .kb-event-foot {
    margin-top: 0;
    padding-top: 16px;
  }
  .kb-event-dates {
    font-size: 16px;
  }
  .kb-event-date td {
    padding: 6px 0;
  }
  /* Erste Zeile oben ohne zusätzliches Zell-Padding */
  .kb-event-date:first-child td {
    padding-top: 0;
  }
  .kb-event-date-time::before,
  .kb-event-date-place::before,
  .kb-event-date-action::before {
    margin: 0 10px;
  }
  /* Wochentag-Abkürzung erscheint */
  .kb-event-date-weekday { display: inline; }
  /* Außer wenn die Zeile eine Spielstätte enthält — dann reicht der
     Platz nicht mehr und der Wochentag wird weggelassen */
  .kb-event-date:has(.kb-event-date-place) .kb-event-date-weekday {
    display: none;
  }
  /* Aufklapp-Schalter in der mobilen Ansicht zentriert */
  .kb-event-expand {
    align-self: center;
  }
}

/* Sehr schmale Geräte — wenn die Terminzeile sonst rechts
   herausläuft: Abstände und Schrift etwas enger. Wochentag
   bleibt abgekürzt erhalten. */
@media (max-width: 400px) {
  .kb-event-date-time::before,
  .kb-event-date-place::before,
  .kb-event-date-action::before {
    margin: 0 6px;
  }
  .kb-event-dates {
    font-size: 14px;
  }
}
/* ═════════  Menüband  ═════════ */
.kb-header {
  background: var(--color-header);
  border-bottom: 1px solid var(--color-green);
}
.kb-header-inner {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 18px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
.kb-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
  text-decoration: none;
}
.kb-logo-img { height: 48px; width: auto; display: block; }
.kb-logo-text {
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -0.005em;
  line-height: 1.1;
}
.kb-logo-place {
  display: block;
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.02em;
  margin-top: 2px;
}
.kb-nav { display: flex; gap: 26px; align-items: center; }
.kb-nav a {
  font-size: 14px;
  font-weight: 500;
  color: var(--color-muted);
  text-decoration: none;
  transition: color 0.15s;
}
.kb-nav a:hover { color: var(--color-text); }
.kb-nav a.active { color: var(--color-text); font-weight: 700; }

.kb-hero-frame {
  max-width: 1560px;
  margin: 0 auto;
}

.kb-hero {
  position: relative;
  width: 100%;
  aspect-ratio: 21 / 9;
  max-height: 690px;
  height: var(--kb-hero-height, auto);
  background: #C8D5D8;
  overflow: hidden;
}

.kb-hero-picture,
.kb-hero-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.kb-hero-picture {
  display: block;
}

.kb-hero-img {
  object-fit: cover;
  object-position: center;
}

@media (max-width: 767px) {
  .kb-hero-frame {
    max-width: none;
  }

  .kb-hero {
    aspect-ratio: 4 / 3;
  }
}
/* ═══════════════════════════════════════════════════════════════════
   NEUIGKEITEN — Timeline-Darstellung
   ───────────────────────────────────────────────────────────────────
   Stilfamilie wie der Spielplan (Inter, Paper-Hintergrund, Forest-
   Green), aber als durchgehende Zeitleiste statt Kacheln.

   Layout über CSS-Grid mit benannten Bereichen (grid-template-areas):
     Desktop — zwei Spalten: Text links, Bild rechts über die volle
               Höhe.
     Mobile  — eine Spalte, Reihenfolge: Datum, Titel, Bild, Teaser,
               Weiter.

   Erwartet, dass die Schrift Inter global eingebunden ist.
   ═══════════════════════════════════════════════════════════════════ */

:root {
  --kb-paper:       #F4F1E8;
  --kb-text:        #24211D;
  --kb-muted:       #6F675E;
  --kb-faint:       #B0A89D;
  --kb-line:        rgba(36, 33, 29, 0.16);
  --kb-green:       #17483F;
  --kb-green-hover: #0E342D;
  --kb-font:        'Inter Variable', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* ─── Liste: die durchgehende Zeitleiste ───
   Die vertikale Linie wird als ::before des Listen-Containers
   gezeichnet. Jeder Eintrag hängt mit seinem Marker daran. */
.kb-news-list {
  position: relative;
  max-width: 760px;
  margin: 0 auto;
  padding-left: 30px;
  /* Absicherung: manche Themes setzen dem News-Wrapper eine feste
     Höhe — das würde die Liste abschneiden. Hier zurücksetzen. */
  height: auto !important;
}
.kb-news-list::before {
  content: '';
  position: absolute;
  left: 5px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: var(--kb-line);
}

/* ─── Einzelner Eintrag ─── */
.kb-news {
  position: relative;
  padding: 0 0 38px 0;
  font-family: var(--kb-font);
}
.kb-news:last-child {
  padding-bottom: 0;
}

/* Marker — Punkt auf der Linie */
.kb-news-marker {
  position: absolute;
  left: -30px;
  top: 5px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--kb-green);
  border: 3px solid var(--kb-paper);
}

/* Datum */
.kb-news-date {
  margin: 0 0 10px 0;
  font-size: 13px;
  font-weight: 700;
  color: var(--kb-green);
}

/* ─── Desktop-Layout: Grid mit benannten Bereichen ───
   Linke Spalte = Text (sub, title, teaser, more),
   rechte Spalte = Bild über die volle Höhe. */
.kb-news-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 200px;
  grid-template-areas:
    "sub    image"
    "title  image"
    "teaser image"
    "more   image";
  grid-template-rows: auto auto 1fr auto;
  gap: 4px 22px;
  align-items: start;
}
/* Eintrag ohne Bild: Text über volle Breite */
.kb-news--ohne-bild .kb-news-row {
  grid-template-columns: 1fr;
  grid-template-areas:
    "sub"
    "title"
    "teaser"
    "more";
}

.kb-news-sub    { grid-area: sub; }
.kb-news-title  { grid-area: title; }
.kb-news-teaser { grid-area: teaser; }
.kb-news-more   { grid-area: more; }
.kb-news-image  { grid-area: image; }

/* Optionale Unter-Überschrift */
.kb-news-sub {
  margin: 0 0 4px 0;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--kb-faint);
}

/* Titel */
.kb-news-title {
  margin: 0 0 8px 0;
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.12;
  color: var(--kb-text);
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}

/* Teaser */
.kb-news-teaser {
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--kb-muted);
}
.kb-news-teaser p {
  margin: 0 0 8px 0;
}
.kb-news-teaser p:last-child {
  margin-bottom: 0;
}
.kb-news-teaser a {
  color: var(--kb-green);
  text-decoration: none;
}
.kb-news-teaser a:hover {
  color: var(--kb-green-hover);
}

/* "Weiter"-Link mit wachsendem Pfeil */
.kb-news-more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  font-size: 13px;
  font-weight: 700;
  color: var(--kb-green);
  text-decoration: none;
  transition: color 0.15s;
  justify-self: start;   /* nur so breit wie nötig */
}
.kb-news-more:hover {
  color: var(--kb-green-hover);
}
.kb-news-more-arrow {
  display: inline-flex;
  align-items: center;
  width: 1.6em;
  height: 1em;
  overflow: visible;
}
.kb-news-more-arrow::before {
  content: '';
  display: block;
  width: 0.9em;
  height: 1.5px;
  background: currentColor;
  flex-shrink: 0;
  transition: width 0.25s ease;
}
.kb-news-more-arrow::after {
  content: '';
  display: block;
  width: 0.35em;
  height: 0.35em;
  border-top: 1.5px solid currentColor;
  border-right: 1.5px solid currentColor;
  transform: rotate(45deg);
  margin-left: -0.18em;
  flex-shrink: 0;
}
.kb-news-more:hover .kb-news-more-arrow::before {
  width: 1.4em;
}

/* Bild — Querformat A4, cover-Zuschnitt */
.kb-news-image {
  aspect-ratio: 1.414 / 1;
  border-radius: 5px;
  overflow: hidden;
  background: #ECE8DC;
}
.kb-news-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* ─── Mobile ───
   Eine Spalte. Reihenfolge über grid-template-areas neu gesetzt:
   Datum (außerhalb des Grids) · Titel · Bild · Teaser · Weiter. */
@media (max-width: 600px) {
  .kb-news-list {
    padding-left: 26px;
  }
  .kb-news {
    padding-bottom: 32px;
  }
  .kb-news-marker {
    left: -26px;
  }
  .kb-news-row,
  .kb-news--ohne-bild .kb-news-row {
    grid-template-columns: 1fr;
    grid-template-areas:
      "sub"
      "title"
      "image"
      "teaser"
      "more";
    grid-template-rows: auto auto auto auto auto;
    gap: 0;
  }
  .kb-news-image {
    margin: 4px 0 13px 0;
  }
  .kb-news-title {
    font-size: 1.45rem;
    line-height: 1.14;
  }
  .kb-news-teaser {
    font-size: 15px;
  }
  .kb-news-more {
    font-size: 14px;
  }
}
