/**
 * Theme Name:     TBG Reilingen 2026
 * Theme URI:      http://tbg-reilingen.de
 * Description:    Theme für den TBG Reilingen.
 * Author:         Florian Turobin
 * Author URI:     http://araxsystems.de
 * Version:        1.0
 */

:root{
  --tbg-red:#D10000;
  --tbg-grey:#333333;
  --content-max:1000px;
  --submenu-border:2px solid var(--tbg-red);
  --overlay:rgba(0,0,0,0.35);
  --t:220ms;
  --header-bottom:0px;
}


body {
	background: white;
	width: 100%;
	height: auto;
	font-family: 'PT Sans', sans-serif;
	text-align: left;
	font-size: 14px;
	padding: 0px;
	margin: 0;
}



/* pt-sans-regular - latin */
@font-face {
  font-display: swap;
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/pt-sans-v18-latin-regular.woff2') format('woff2');
}
/* pt-sans-italic - latin */
@font-face {
  font-display: swap;
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/pt-sans-v18-latin-italic.woff2') format('woff2');
}
/* pt-sans-700 - latin */
@font-face {
  font-display: swap;
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/pt-sans-v18-latin-700.woff2') format('woff2');
}
/* pt-sans-700italic - latin */
@font-face {
  font-display: swap;
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 700;
  src: url('fonts/pt-sans-v18-latin-700italic.woff2') format('woff2');
}
/* protest-strike-regular - latin */
@font-face {
  font-display: swap;
  font-family: 'Protest Strike';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/protest-strike-v2-latin-regular.woff2') format('woff2');
}

/* Allgemeine Formatierung */
h1 {
	padding: 0;
	padding-bottom: 15px;
	font-size: 34px;
	font-weight: 400;
	color: #B80101;
	font-family: 'Protest Strike';
}
h1 a {
	padding: 0;
	font-family: 'Protest Strike';
	text-decoration: none;
	color: #B80101;
	outline: none;
}
h1 a:hover {
	text-decoration: none;
}
h2 {
	padding: 0;
	padding-bottom: 15px;
	font-family: 'PT Sans';
}
a {
	outline: none;
	text-decoration: none;
	color: #B80101;
}
a:hover {
	text-decoration: underline;
}
p {
	font-family: 'PT Sans', sans-serif;
	font-size: 14px;
	line-height: 1.5;
}

::selection {
  color: white;
  background: #D10000;
}
::-moz-selection {
  color: white;
  background: #D10000;
}
.clear {
	clear: both;
}
.n2_clear {
	margin-bottom: 60px;
}
ul li {
	list-style-type: square;
	padding: 0;
}
ul {
	padding-left: 40px;
	padding-top: 0px;
	margin: 0;
}
img.alignnone {
	width: 100%;
	height: auto;
}
img.alignright {
	float: right;
	padding-left: 10px;
	padding-bottom: 10px;
}
img.alignleft {
	float: left;
	padding-right: 10px;
	padding-bottom: 10px;
}
/* Kalender Module, in case no events found */
code {
	font-family: 'PT Sans', sans-serif;
}
/* Header / Content */
#content {
	width: 100%;
	max-width: 1000px;
	height: auto;
	margin: 0 auto;
	padding: 0 0 30px 0;
	background: white;
	box-sizing: border-box;
}
.left_blog_posts {
	float: left;
	width: 65%;
}
.entry {
	font-weight: 400;
	color: #353535;
}
.category {
	text-transform: uppercase;
	font-weight: 600;
	font-size: 10px;
	color: #4a4a4a;
}
.category ul, .category ul li, .category ul li a {
	text-decoration: none;
	color: #4a4a4a;
	margin: 0;
	padding: 0;
	list-style: none;
}
.category ul li a:hover {
	color: #969696;
	text-decoration: none;
}
.date_author {
	font-size: 11px;
	color: #5e5e5e;
}
.weiterlesen a {
	color: #B80101;
	font-size: 11px;
}

#header {
	width: 100%;
	height: 140px;
	background: white;
}

/* =========================================================
   HEADER
   ========================================================= */
#header_container{
	width:100%;
	max-width:1000px;
	margin:0 auto;
	display:flex;
	align-items:center;
	justify-content:space-between;
	position:relative;
	z-index:3000;
	margin-top: 15px;
}

#header_container .clear{
	display:none;
}

#header_brand{
	display:flex;
	align-items:center;
	gap:14px;
	min-width:0;
}

#header_brand > a{
	display:flex;
	align-items:center;
}

#header_titles{
	display:flex;
	flex-direction:column;
	justify-content:center;
	line-height:1.05;
	font-family:"Protest Strike", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

#header_brand > a:hover .site-title,
#header_brand > a:hover .dept-title {
	text-decoration: none !important;
}

.header-titles-link,
.header-titles-link:hover,
.header-titles-link:focus,
.header-titles-link:active,
.header-titles-link:visited{
	text-decoration: none !important;
	color: inherit;
}

.header-titles-link *{
	text-decoration: none !important;
}

#header_titles .site-title{
	font-size:22px;
	color:#000;
	white-space:nowrap;
}

#header_titles .dept-title{
	font-size:18px;
	color:var(--tbg-red);
	white-space:nowrap;
}

#header_titles .dept-title:empty{
	display:none;
}


#wappen {
	background: url(img/tbg_logo.png) no-repeat;
	background-size: 86px 109px;
	width: 86px;
	height: 109px;
	margin-top: 8px;
	float: left;
}

/* =========================================================
   NAV BASE
   ========================================================= */
#navigation{
	flex:1 1 auto;
	min-width:0;
	display:flex;
	align-items:center;
	justify-content:flex-end;
	position:relative;
	z-index:3001;
	float:right;
	font-family:"Protest Strike", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
	background:transparent !important;
}

#navigation,
#navigation *{
	box-sizing:border-box;
}

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

/* remove bullets in navigation */
#navigation ul,
#navigation li {
	list-style: none !important;
	margin: 0;
	padding: 0;
}

#navigation a{
	text-decoration:none;
	color:inherit;
}

#navigation > .menu-hauptnavi-container{
	width:100%;
	max-width:var(--content-max);
	margin:0 auto;
	display:flex;
	align-items:center;
	justify-content:flex-end;
	position:relative;
	background:transparent !important;
}

/* =========================================================
   BACKDROP
   ========================================================= */
#nav-backdrop{
	position:fixed;
	left:0;
	right:0;
	bottom:0;
	top:var(--header-bottom);
	background:var(--overlay);
	opacity:0;
	pointer-events:none;
	transition:opacity var(--t) ease;
	z-index:900;
}

#nav-backdrop.is-visible{
	opacity:1;
	pointer-events:auto;
}

/* =========================================================
   BURGER
   ========================================================= */
#nav-burger{
	display:none;
	align-items:center;
	justify-content:flex-end;
	width:auto;
	margin-left:auto;
	padding:12px 16px 12px 0;
	background:transparent !important;
	border:0;
	cursor:pointer;
	box-shadow:none;
}

#nav-burger .label{
	display:none;
}

#nav-burger .icon{
	width:28px;
	height:20px;
	position:relative;
	display:block;
}

#nav-burger .icon span{
	position:absolute;
	left:0;
	right:0;
	height:3px;
	background:var(--tbg-red);
	border-radius:2px;
	transition:transform var(--t) ease, opacity var(--t) ease, top var(--t) ease;
}

#nav-burger .icon span:nth-child(1){ top:0; }
#nav-burger .icon span:nth-child(2){ top:8px; }
#nav-burger .icon span:nth-child(3){ top:16px; }

#navigation.is-menu-open #nav-burger .icon span:nth-child(1){
	top:8px;
	transform:rotate(45deg);
}
#navigation.is-menu-open #nav-burger .icon span:nth-child(2){
	opacity:0;
}
#navigation.is-menu-open #nav-burger .icon span:nth-child(3){
	top:8px;
	transform:rotate(-45deg);
}

/* =========================================================
   LEVEL 0 DESKTOP
   ========================================================= */
#navigation > .menu-hauptnavi-container > ul.menu{
	display:flex;
	align-items:center;
	justify-content:flex-end;
	gap:34px;
	width:100%;
	margin:0;
	padding:14px 0;
	letter-spacing:0.5px;
	text-transform:uppercase;
	background:transparent !important;
}

#navigation > .menu-hauptnavi-container > ul.menu > li{
	position:relative;
	background:transparent !important;
}

#navigation > .menu-hauptnavi-container > ul.menu > li > a{
	color:var(--tbg-red);
	font-size:22px;
	line-height:1;
	display:inline-flex;
	align-items:center;
	gap:8px;
	padding:6px 0;
	background:transparent !important;
}

#navigation li.menu-item-has-children > a::after{
	content:"";
	display:inline-block;
	width:0;
	height:0;
	border-left:5px solid transparent;
	border-right:5px solid transparent;
	border-top:6px solid var(--tbg-red);
	flex:0 0 auto;
	transform:translateY(1px);
	transition:transform 180ms ease;
}

#navigation li.is-open > a::after,
#navigation li.is-sub-open > a::after{
	transform:translateY(1px) rotate(180deg);
}

/* =========================================================
   HIDE SUBMENUS DEFAULT
   ========================================================= */
#navigation ul.sub-menu{
	display:none;
	visibility:hidden;
	opacity:0;
	pointer-events:none;
	overflow:hidden;
	transition:opacity var(--t) ease, max-height 260ms ease;
}

/* =========================================================
   DESKTOP / TABLET >=800
   ========================================================= */
@media (min-width:800px){
	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu{
		position:fixed;
		left:0;
		right:0;
		width:100vw;
		top:var(--header-bottom);
		z-index:1100;
		background:#fff;
		border-bottom:var(--submenu-border);
		padding-top:28px;
		padding-bottom:28px;
		padding-left:max(0px, calc((100vw - var(--content-max)) / 2));
		padding-right:max(0px, calc((100vw - var(--content-max)) / 2));
		grid-template-columns:repeat(3, minmax(0, 1fr));
		gap:22px 50px;
		max-height:none !important;
		overflow:visible !important;
	}

	@media (max-width:1040px){
		#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu{
			padding-left:18px;
			padding-right:18px;
		}
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li.is-open > ul.sub-menu{
		display:grid;
		visibility:visible;
		opacity:1;
		pointer-events:auto;
	}

	/* Level 2 desktop */
	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li > a{
		color:var(--tbg-red);
		font-size:26px;
		line-height:1.05;
		display:inline-flex;
		align-items:center;
		gap:8px;
		margin-bottom:6px;
		text-transform:none;
		letter-spacing:0;
		vertical-align:middle;
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li.menu-item-has-children > a::after{
		position:relative;
		right:auto;
		top:auto;
		display:inline-block;
		transform:translateY(1px);
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li.is-open > a::after,
	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li.is-sub-open > a::after{
		transform:translateY(1px) rotate(180deg);
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li > ul.sub-menu{
		display:block !important;
		visibility:visible !important;
		opacity:1 !important;
		pointer-events:auto !important;
		max-height:none !important;
		overflow:visible !important;
		transition:none;
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li > ul.sub-menu > li > a{
		color:var(--tbg-grey);
		font-size:20px;
		line-height:1.05;
		display:block;
		padding:3px 0 3px 12px;
		text-transform:none;
		letter-spacing:0;
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li > ul.sub-menu > li.current-menu-item > a,
	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li > ul.sub-menu > li.current-menu-ancestor > a{
		color:var(--tbg-red);
	}
}

/* =========================================================
   DESKTOP TWEAK 800-999
   ========================================================= */
@media (min-width:800px) and (max-width:999px){
	#navigation,
	#navigation > .menu-hauptnavi-container,
	#navigation > .menu-hauptnavi-container > ul.menu,
	#navigation > .menu-hauptnavi-container > ul.menu > li,
	#navigation > .menu-hauptnavi-container > ul.menu > li > a{
		background:transparent !important;
	}

	#navigation > .menu-hauptnavi-container > ul.menu{
		gap:8px;
		padding:12px 0;
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li > a{
		font-size:19px;
		gap:6px;
		padding:5px 0;
	}

	#navigation li.menu-item-has-children > a::after{
		border-left-width:4px;
		border-right-width:4px;
		border-top-width:5px;
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu{
		grid-template-columns:repeat(2, minmax(0, 1fr));
		gap:16px 28px;
		padding-top:20px;
		padding-bottom:20px;
	}
}

/* Topnavi */
#topnavi_container {
	width: 100%;
	max-width: 1000px;
	margin: 10px auto;
}
#topnavi {
	float: right;
}
#topnavi ul {
	padding: 0;
	margin: 0;
}
#topnavi ul li {
	list-style: none;
	display: inline;
	padding-left: 20px;
	text-align: right;
}
#topnavi ul li a {
	font-size: 16px;
	font-weight: 100;
	text-transform: none;
	text-decoration: none;
	color: white;
}
#topnavi ul li a:hover {
	color: #ccc;
}
#topnavi ul li.current_page_item a,
#topnavi ul li.current_page_ancestor a {
	font-weight: bold;
}

/* Sidebar */
#right_sidebar {
	width: 25%;
	padding: 0 20px;
	float: right;
}
#right_sidebar h2 {
	padding-top: 30px;
	padding-bottom: 10px;
}
.sidebar_widget ul li.current_page_item a {
	font-weight: bold;
}

/* sidebar_ */
#sidebar_ {
	width: 200px;
	height: auto;
	background: #fff;
	box-shadow: 2px 0px 11px #404040;
	float: right;
	margin-right: 25px;
	overflow: hidden;
}
#sidebar_ ul {
	margin: 0;
	padding: 0;
	border-left: 6px solid #00baff;
}
#sidebar_ ul li {
	list-style: none;
	background: -webkit-linear-gradient(#fcfcfc 0%, #f3f3f3 100%);
	height:32px;
	margin: 0;
	padding: 10px 0 0 20px;
}
#sidebar_ ul li a {
	color: #4a4a4a;
	font-size: 15px;
	font-weight: 600;
	text-transform: uppercase;
	text-decoration: none;
	padding: 4px 0 0 10px;
}
#sidebar_ ul li.active {
	list-style: none;
	background: #00baff;
	height: 32px;
	width: 168px;
	margin: 0;
	border-right: 6px solid #5ad2ff;
	padding: 10px 0 0 20px;
}
#sidebar_ ul li.current_page_item {
	list-style: none;
	background: #00baff;
	height: 32px;
	width: 168px;
	margin: 0;
	border-right: 6px solid #5ad2ff;
	padding: 10px 0 0 20px;
	color: white;
}
#sidebar_ ul li.current_page_item a {
	color: white;
}
#sidebar_ ul li.active a {
	color: white;
}
/* sidebar_ Submenu */
#sidebar_ ul.children {
	border: none;
	padding: 0;
	margin: 0;
	border-bottom: 3px solid #e8e8e8;
	padding-bottom: 14px;
	margin-left: -20px;
	margin-top: 10px;
}
#sidebar_ ul.children li {
	background: white;
	height: 12px;
	padding-bottom: 5px;
	border: none;
}
#sidebar_ ul.children li.active {
	background: white url(img/current_right.png) no-repeat left bottom;
	height: 12px;
}
#sidebar_ ul.children li a {
	font-size: 12px;
	color: #00baff;
	font-weight: 400;
	text-transform: none;
	padding-left: 12px;
	line-height: normal;
}
#sidebar_ ul.children li a:hover {
	text-decoration: underline;
}
.landing_news {
	width: 404px;
	padding: 10px;
	background: white;
	opacity: 0.87;
	font-size: 8pt;
	position: relative;
	top: 200px;
}




/* =========================================================
   NEWS PAGE
   ========================================================= */
.primary-btn {
	background: #B80101;
	border-radius: 17px;
	padding: 14px 35px;
	font-size: 14px;
	color: white;
	font-weight: bold;
	transition: all 0.2s;
}
.primary-btn:hover {
	text-decoration: none;
	background: #8D0000;
}

/* Grid */
.news-grid{
	display:grid;
	grid-template-columns:repeat(3, 1fr);
	gap:24px;
	margin-bottom: 50px;
}

/* Card */
.news-card{
	position:relative;
	border:2px solid #E1E8EF;
	border-radius:28px;
	overflow:hidden;
	background:#fff;
	display:flex;
	flex-direction:column;
	height:100%;
}

/* Category badge (top right) */
.news-cat{
	position: absolute;
	top: 0;
	right: 0;
	background: #B80101;
	color: #fff;
	font-size: 15px;
	font-weight: 400;
	padding: 13px 28px;
	border-radius: 0 28px 0 28px;
	z-index: 2;
	line-height: 1.2;
}

/* Thumbnail */
.news-thumb{
	display:block;
	width:100%;
}
.news-thumb-img{
	width:100%;
	height:auto;
	display:block;
}
.news-thumb-placeholder{
	width:100%;
	aspect-ratio: 16 / 9;
	background:#E1E8EF;
}

/* Body */
.news-body{
	padding:25px;
	display:flex;
	flex-direction:column;
	gap:12px;
	flex:1;
}

.news-title{
	margin:0;
	font-size:18px;
	font-weight:700;
	line-height:1.3;
}
.news-title a{
	color:#000;
	text-decoration:none;
}
.news-title a:hover{
	text-decoration:underline;
}

.news-excerpt{
	font-size:13px;
	font-weight:400;
	color:#000;
	line-height: 1.2;
}
.news-excerpt p{
	margin:0;
}

/* Footer row: Weiterlesen left, date right */
.news-footer{
	margin-top:auto;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:16px;
}
.news-readmore{
	font-size:13px;
	font-weight:700;
	color:#B80101;
	text-decoration:none;
}
.news-readmore:hover{
	text-decoration:underline;
}
.news-date{
	font-size:13px;
	font-weight:400;
	color:#676767;
	white-space:nowrap;
}

/* Pagination */
.news-pagination{
	margin: 10px 0 0 0;
}

.news-pagination ul{
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.news-pagination li{
	list-style: none;
	padding: 0;
	margin: 0;
}

.news-pagination a,
.news-pagination span{
	display: inline-block;
	padding: 12px 18px;
	border-radius: 17px;
	font-size: 14px;
	font-weight: bold;
	text-decoration: none;
	border: 2px solid #B80101;
	line-height: 1;
}

.news-pagination a{
	color: #B80101;
	background: #fff;
}

.news-pagination a:hover{
	background: #B80101;
	color: #fff;
	text-decoration: none;
}

.news-pagination .current{
	background: #B80101;
	color: #fff;
}

.news-pagination .dots{
	border-color: #E1E8EF;
	color: #676767;
	font-weight: 400;
}

/* Responsive */
@media (max-width: 1024px){
	.news-grid{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width: 640px){
	.news-grid{ grid-template-columns:1fr; }
	.news-cat{ font-size:18px; }

	.news-pagination ul{
		gap: 8px;
	}

	.news-pagination a,
	.news-pagination span{
		padding: 10px 14px;
		font-size: 13px;
	}
}

/* =========================================================
   Footer
   ========================================================= */
#footer_container {
	width: 100%;
	background: white;
	height: auto;
	border-top: 65px solid #B80101;
	font-size: 13px;
	line-height: 1.5;
}
#footer {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 40px 0;
}
#footer ul {
	float: left;
}
#footer ul li:first-child {
	font-weight: bold;
}
#footer ul li:first-child a:hover {
	text-decoration: none;
}
#footer ul, #footer ul li, #footer ul li a {
	margin: 0;
	padding: 0;
	color: black;
	display: block;
	list-style: none;
	padding-left: 0;
}
#footer ul {
	margin-right: 30px;
}
.footer_block {
	float: left;
	margin-right: 30px;
}
.footer_block p {
	padding: 0;
	margin: 0;
	font-size: 13px;
	line-height: 1.5;
}

table {
	font-size: 14px;
}
table#vorstand tr td {
	padding-bottom: 10px;
}

#runny {
	background-image: url('img/menu/runny_menu.png');
	width: 98.7px;
	height: 114.1px;
	background-size: 98.7px 114.1px;
	background-repeat: no-repeat;
	float: right;
}

/* =========================================================
   Veranstaltungen
   ========================================================= */
li.tribe-events-nav-previous, li.tribe-events-nav-next {
	display: none !important;
}

/*
body.single-tribe_events .tribe-events-cal-links a.tribe-events-gcal {
    display: none !important;
}

body.single-tribe_events .tribe-events-cal-links a.tribe-events-ical {
    display: none !important;
}
*/

.fc-day-grid-event.fc-h-event.fc-event.fc-start.fc-end.damen-1_ecs_calendar_category {
	background-color: green !important;
}
.fc-day-grid-event.fc-h-event.fc-event.fc-start.fc-end.damen-2_ecs_calendar_category {
	background-color: blue !important;
}
.fc-day-grid-event.fc-h-event.fc-event.fc-start.fc-end.damen-3_ecs_calendar_category {
	background-color: red !important;
}
.fc-day-grid-event.fc-h-event.fc-event.fc-start.fc-end.herren-1_ecs_calendar_category {
	background-color: gray !important;
}
.fc-day-grid-event.fc-h-event.fc-event.fc-start.fc-end.herren-2_ecs_calendar_category {
	background-color: pink !important;
}
.fc-day-grid-event.fc-h-event.fc-event.fc-start.fc-end.herren-3_ecs_calendar_category {
	background-color: aqua !important;
}

/* =========================================================
   Cookie Notice
   ========================================================= */

#cookie-notice{
	position:fixed;
	left:0;
	right:0;
	bottom:0;
	width:100%;
	z-index:100000;
	background:#000 !important;
	color:#fff !important;
	font-family:"Protest Strike", sans-serif;
	font-size:14px;
	line-height:1.45;
	border-top:none;
	box-shadow:none;
}

/* Only show border when visible */
#cookie-notice.cookie-notice-visible{
	border-top:2px solid #D10000;
	box-shadow:0 -10px 30px rgba(0,0,0,0.35);
}

/* CONTAINER */
#cookie-notice .cookie-notice-container{
	width:100%;
	max-width:1000px;
	margin:0 auto;
	padding:16px 18px;
	position:relative;
	display:flex;
	align-items:center;
	gap:20px;
}

/* TEXT LEFT */
#cookie-notice #cn-notice-text{
	flex:1 1 auto;
	min-width:0;
	color:#fff;
	font-family:"Protest Strike", sans-serif;
}

/* BUTTONS RIGHT (DESKTOP) */
#cookie-notice #cn-notice-buttons{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	margin-left:auto;
	white-space:nowrap;
}

/* BUTTONS */
#cookie-notice .cn-button{
	appearance:none;
	border-radius:999px;
	padding:10px 16px;
	border:2px solid transparent;
	cursor:pointer;
	font-family:"Protest Strike", sans-serif;
	font-size:14px;
	text-transform:uppercase;
	line-height:1;
	transition:
		transform 120ms ease,
		background-color 160ms ease,
		border-color 160ms ease,
		opacity 160ms ease;
}

/* OK */
#cookie-notice #cn-accept-cookie{
	background:#D10000;
	color:#fff;
}
#cookie-notice #cn-accept-cookie:hover{
	transform:translateY(-1px);
}

/* Datenschutzerklärung */
#cookie-notice #cn-more-info{
	background:transparent;
	color:#fff;
	border-color:rgba(255,255,255,0.4);
}
#cookie-notice #cn-more-info:hover{
	border-color:#fff;
}

/* CLOSE BUTTON (TOP RIGHT) */
#cookie-notice #cn-close-notice{
	position:absolute;
	right:12px;
	top:16px;
	width:34px;
	height:34px;
	background:transparent;
	border:2px solid rgba(255,255,255,0.25);
	border-radius:50%;
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	transition:
		background-color 160ms ease,
		border-color 160ms ease,
		transform 120ms ease;
}

#cookie-notice #cn-close-notice:hover{
	background:#D10000;
	border-color:#D10000;
	transform:translateY(-1px);
}

/* X ICON */
#cookie-notice #cn-close-notice::before,
#cookie-notice #cn-close-notice::after{
	content:"";
	position:absolute;
	left:50%;
	top:50%;
	width:14px;
	height:2px;
	background:#fff;
	border-radius:2px;
	transform-origin:center;
}
#cookie-notice #cn-close-notice::before{
	transform:translate(-50%,-50%) rotate(45deg);
}
#cookie-notice #cn-close-notice::after{
	transform:translate(-50%,-50%) rotate(-45deg);
}

/* ACCESSIBILITY */
#cookie-notice .cn-button:focus-visible,
#cookie-notice #cn-close-notice:focus-visible{
	outline:3px solid rgba(209,0,0,0.6);
	outline-offset:3px;
}

/* =========================================================
   GLOBAL RESPONSIVE
   ========================================================= */
@media only screen and (max-width: 1000px) {

	#header_container,
	#content,
	#footer,
	#topnavi_container {
		padding-left: 16px;
		padding-right: 16px;
		box-sizing: border-box;
	}

	#menu_icons {
		display: none;
	}

	#topnavi {
		float: left;
		padding: 0 20px;
	}
	#topnavi ul li {
		padding-left: 0;
		padding-right: 20px;
		line-height: 2;
	}
	.left_blog_posts,
	.entry,
	#right_sidebar {
		width: 100%;
		padding: 0;
	}

	#wappen {
		display: block;
		float: left;
	}
	#header {
		height: auto;
	}
	#header_container {
		padding-top: 0;
		margin-top: 0;
		padding-bottom: 10px;
	}
	#navigation {
		float: none;
		margin-top: 0;
	}
	.entry:first-child {
		margin-top: 0;
	}
	.entry {
		margin-top: 25px;
	}
}

/* cookie mobile */
@media (max-width:720px){
	#cookie-notice .cookie-notice-container{
		flex-direction:column;
		align-items:center;
		text-align:center;
		gap:14px;
		padding-right:52px;
	}

	#cookie-notice #cn-notice-text{
		text-align:center;
	}

	#cookie-notice #cn-notice-buttons{
		margin-left:0;
		width:100%;
		flex-wrap:wrap;
		justify-content:center;
		white-space:normal;
	}

	#cookie-notice #cn-close-notice{
		right:10px;
		top:16px;
	}
}

/* =========================================================
   MOBILE <800
   ========================================================= */
@media (max-width:799px){
	#navigation{
		display:flex;
		align-items:center;
		justify-content:flex-end;
		background:transparent !important;
	}

	#navigation > .menu-hauptnavi-container{
		width:100%;
		max-width:none;
		margin:0;
		display:flex;
		align-items:center;
		justify-content:flex-end;
		position:static;
		background:transparent !important;
	}

	#nav-burger{
		display:flex;
		position:relative;
		z-index:1301;
		background:transparent !important;
	}

	#navigation,
	#navigation > .menu-hauptnavi-container,
	#navigation > .menu-hauptnavi-container::before,
	#navigation > .menu-hauptnavi-container::after,
	#navigation > .menu-hauptnavi-container > ul.menu,
	#navigation > .menu-hauptnavi-container > ul.menu > li,
	#navigation > .menu-hauptnavi-container > ul.menu > li > a{
		background-color:transparent !important;
		box-shadow:none !important;
	}

	#navigation > .menu-hauptnavi-container > ul.menu{
		position:fixed;
		top:var(--header-bottom);
		left:0;
		right:0;
		width:100vw;
		max-width:none;
		display:none;
		margin:0;
		padding:0 18px 18px 18px;
		background:#fff !important;
		border-top:0;
		border-bottom:2px solid var(--tbg-red);
		z-index:1200;
		max-height:0;
		overflow-x:hidden;
		overflow-y:auto;
		-webkit-overflow-scrolling:touch;
		opacity:0;
		pointer-events:none;
	}

	#navigation.is-menu-open > .menu-hauptnavi-container > ul.menu{
		display:block;
		opacity:1;
		pointer-events:auto;
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li{
		border-top:1px solid rgba(0,0,0,0.08);
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li:first-child{
		border-top:0;
	}

	/* Level 1 mobile */
	#navigation > .menu-hauptnavi-container > ul.menu > li > a{
		position:relative;
		width:100%;
		display:block;
		font-size:20px;
		padding:14px 28px 14px 0;
		background:transparent !important;
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li.menu-item-has-children > a::after{
		position:absolute;
		right:0;
		top:50%;
		transform:translateY(-50%);
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li.is-open > a::after,
	#navigation > .menu-hauptnavi-container > ul.menu > li.is-sub-open > a::after{
		transform:translateY(-50%) rotate(180deg);
	}

	/* Ebene 2 standardmäßig verstecken */
	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu{
		position:static;
		width:100%;
		display:none;
		background:transparent !important;
		border:0;
		padding:0;
		margin:0;
		visibility:hidden;
		opacity:0;
		pointer-events:none;
		max-height:0;
		overflow:hidden;
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li.is-sub-open > ul.sub-menu{
		display:block;
		visibility:visible;
		opacity:1;
		pointer-events:auto;
		padding:0 0 12px 0;
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li{
		border-top:1px solid rgba(0,0,0,0.05);
	}

	/* Level 2 mobile */
	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li > a{
		color:var(--tbg-red);
		font-size:20px;
		line-height:1.05;
		position:relative;
		display:block;
		width:100%;
		padding:12px 28px 8px 0;
		text-transform:none;
		letter-spacing:0;
		background:transparent !important;
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li.menu-item-has-children > a::after{
		position:absolute;
		right:0;
		top:50%;
		transform:translateY(-50%);
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li.is-open > a::after,
	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li.is-sub-open > a::after{
		transform:translateY(-50%) rotate(180deg);
	}

	/* Ebene 3 standardmäßig verstecken */
	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li > ul.sub-menu{
		display:none;
		padding:0;
		margin:0;
		background:transparent !important;
		visibility:hidden;
		opacity:0;
		pointer-events:none;
		max-height:0;
		overflow:hidden;
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li.is-sub-open > ul.sub-menu{
		display:block;
		visibility:visible;
		opacity:1;
		pointer-events:auto;
		padding:0 0 8px 0;
	}

	#navigation > .menu-hauptnavi-container > ul.menu > li > ul.sub-menu > li > ul.sub-menu > li > a{
		color:var(--tbg-grey);
		font-size:18px;
		line-height:1.05;
		display:block;
		padding:7px 0 7px 12px;
		text-transform:none;
		letter-spacing:0;
		background:transparent !important;
	}

	#footer{
		width: 100%;
		max-width: 1000px;
		margin: 0 auto;
		position: relative;
	}

	#runny {
		background-image: url('img/menu/runny_menu.png');
		width: 98.7px;
		height: 114.1px;
		background-size: 98.7px 114.1px;
		background-repeat: no-repeat;
		position: absolute;
		top: 40px;
		right: 16px;
		float: none;
	}

	#footer .footer_block,
	#footer .menu-footer-block-1-container,
	#footer .menu-footer-block-2-container {
		width:100%;
		float:none;
		margin-right:0;
		margin-bottom: 20px;
	}

	#footer ul{
		float:none;
		margin-right:0;
	}

}

@media (max-width:357px){
	#runny{
		position:static;
		margin-top:20px;
		float:none;
		display:block;
	}
}