
:root {
	--header-height: 380px;
	--site-padding: 30px;
	--site-width-max: 1600px;
	--outer-padding: 100px;
	--inner-padding: 55px;
	--inner-top-padding: 70px;
	--box-padding: 42px;
	
	--blog-gap: 25px;
	--side-column-width: 265px;
	--side-column-gap: 100px;
	--side-column-gap-small: 30px;	
	--row-gap: 40px;
	--row-gap-small: 20px;	
	--p-gap: 0.4em;
	
	--body-color: #1d1d1b;
	--body-bg: #dedede;	
	--link: #008cd2;
	--grey: #6c757e;
	--grey-hover: #57636e;
	--light-grey: #999999;
	--very-light-grey: #f9f9f9;	
	--green: #75b73c;
	--maientag-blue: #327898;
	/* Farbe des Scheins um Text ueber Bilder */
    --halo: 255,255,255;		
	
	--strandleben: #fcc600;
	--kulturmomente: #2e3956;
	--kultursommer: #ea5031;
	--maientag: #276585;
	--stadtfuehrungen: #844e31;
	--markt: #40b0d2;
	--ferienprogramm: #d1973e;	
}

h1 {
	font-size: 2em;
	font-weight: 700;
	text-transform: uppercase;
	margin-bottom: 1.5em;
}
h2,
main ~ .main-bottom h2 {
	margin-bottom: 1em;
	margin-top: 2em;
}
h2:first-child {
	margin-top: 0px;
}

/* Bisher nur in Events-Blog */
h3 {
	font-size: 1em;
	font-weight: 700;	
	margin-top: 1.5em;
}
h3:first-child {
	margin-top: 0px;
}
h4 {
	font-size: 1em;
	font-weight: bold;
}
p {
	margin-top: 0px;
	margin-bottom: 0.7em;
}
a {
	color: var(--link);
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
.btn {
	background-color: var(--grey);
	color: #ffffff;
}
.btn:hover {
	background-color: var(--grey-hover);
	color: #ffffff;	
}
.btn-primary{
	--bs-btn-color: #fff;
	--bs-btn-bg: var(--green);
	--bs-btn-border-color: #75b73c;
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: #66a133;
	--bs-btn-hover-border-color: #6daf33;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: #6daf33;
	--bs-btn-active-border-color: #6daf33;
	--bs-btn-focus-shadow-rgb: 49,132,253;
	background-color: var(--bs-btn-bg);
}
.btn-primary:hover {
	background-color: var(--bs-btn-hover-bg);
}
.btn-reservix {
	background-color: #de9800;
	border-color: #de9800;	
}
.btn-reservix:hover {
	background-color: #bf8300;
}
*[class*="ka_evtcol_"] a {
	padding-left: 5px;
	padding-right: 5px;
}
.icon-valuecheck1::before {
	content: "\f00c";
}
ul {
	margin-top: 0px;
	margin-bottom: 0.7em;	
	padding: 0px;
}

.visually-hidden {
	display: none;
}
.form-group {
	margin-bottom: 0.6em;
}

/* Felder allgemein */

.com-content-article__body label {
	font-weight: 700;
	margin-bottom: 0px;
	display: block;
}
.com-content-article__body input + label {
	display: inline;
}
.com-content-article__body input ~ input {
	margin-left: 3em;
}
.cck_value_upload_image {
	font-size: 0px;
}

input[type="text"],
input[type="password"] {
	line-height: 1.5em;
	padding: 0.5em;
	width: var(--side-column-width);
}
fieldset.checkboxes.vertical {
	display: grid;
	grid-template-columns: auto 1fr;
	row-gap: 0.4em;
	align-items: center;
}
.cck_form.cck_form_link .cck_forms {
	display: block;
}
.com-content-article__body .cck_content .cck_value ul {
	margin: 0px;
}

.content {
	padding-left: var(--outer-padding);
	padding-right: var(--outer-padding);	
}
.header:has(.container-banner) ~ .content {
	margin-top: -50px;
}
.content-inner {
	position: relative;
	background-color: #ffffff;
	box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.5);
}
.columncontainer {
	display: grid;
}
.columncontainer.hascol-l {
	grid-template-columns: var(--side-column-width) 1fr;
	column-gap: var(--side-column-gap);
}
.columncontainer.hascol-r {
	grid-template-columns: 1fr var(--side-column-width);
	column-gap: var(--side-column-gap);	
}
.columncontainer.hascol-l.hascol-r {
	grid-template-columns: var(--side-column-width) 1fr var(--side-column-width);
	column-gap: var(--side-column-gap-small);	
}

/* Spezielle Felder */

.cck_forms.cck_user_groups {
	grid-template-columns: var(--label-width) 1fr;
}
.cck_form.cck_form_jform_usergroups label {
	font-weight: normal;
	width: auto;
}
.dupli_vals {
	display: none;
}
.cck_link_back_meine_events {
	display: flex;
	align-items: center;
}
.cck_link_back_meine_events p {
	margin: 0px;
}

/* Header */

.header .container-banner .mod-custom {
	background-position: center 25%;
}
.header .container-banner .mod-custom.aligntop {
	background-position: center top;
}
.header_inner > div {
	position: relative;
	z-index: 15;
}
.header_inner > .sub-brand {
	position: absolute;
	top: 65px;
	right: var(--site-padding);
	z-index: 10;
}
.sub-brand a {
	display: block;
	position: relative;
	z-index: 20;
}
.itemid-151 .sub-brand::before,
.itemid-542 .sub-brand::before,
.itemid-544 .sub-brand::before {
	content: "";
	position: absolute;
	z-index: 15;
	left: 0em;
	right: 0em;
	top: 0.3em;
    bottom: 0em;
	background: rgba(var(--halo), 0.7);
	filter: blur(0.7em);
	border-radius: 999px;
}

.header_inner > .container-account {
	position: absolute;
	top: 15px;
	right: var(--site-padding);
	z-index: 20;
	padding: 5px;
}
.container-account::before {
	content: "";
	position: absolute;
	z-index: 15;
	left: 0em;
	right: 0em;
	top: 0em;
    bottom: 0em;
	background: rgba(var(--halo), 0.9);
	filter: blur(0.7em);
	border-radius: 999px;
}
.container-account .accountbtn {
	color: var(--body-color);
	cursor: pointer;
	position: relative;
	z-index: 20;
}
.container-banner:has(.darkhead) ~ .header_inner .container-account::before {
	--halo: 0, 0, 0;
}
.container-banner:has(.darkhead) ~ .header_inner .container-account .accountbtn {
	color: #ffffff;
}
.container-account i {
	margin-right: 0.5em;
}
.container-account .mod-login {
	position: fixed;
	right: calc((100% - var(--site-width-max)) / 2);
	top: 0px;
	background-color: #ffffff;
	display: none;
	padding: var(--box-padding);
	z-index: 30;
}
.container-account .mod-login.active {
	display: block;
	box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.2);	
}
.container-account .mod-login .icon-cancel {
	position: absolute;
	top: 15px;
	right: 15px;
	color: var(--light-grey);
	cursor: pointer;
}
.container-account .mod-login .icon-cancel:hover {
	color: var(--grey);
}
.container-account .mod-login .pretext {
	font-weight: bold;
}
.container-account .mod-login .input-group {
	position: relative;
}
.container-account .mod-login .input-password-toggle {
	position: absolute;
	right: -27px;
	top: 0.5em;
	cursor: pointer;
}
.container-account .mod-login .mod-login__submit {
	text-align: right;
}
.container-account .mod-login .mod-login__options {
	margin-top: 2.5em;
}
.container-account ul {
	display: flex;
	flex-direction: row;
	column-gap: var(--blog-gap);
	position: relative;
	z-index: 20;
	margin: 0px;
}
.container-account ul li {
	list-style-type: none;
}
.container-account ul li a {
	color: var(--body-color);
	text-decoration: none;
}
.container-banner:has(.darkhead) ~ .header_inner .container-account ul li a {
	color: #ffffff;
}
.head_tourismus {
	width: var(--site-width-max);
	max-width: 100%;	
	padding-left: var(--site-padding);
	padding-right: var(--site-padding);	
	margin: 0px auto;
	position: relative;	
}
.head_tourismus_inner {
	position: absolute;
	left: 18%;
	top: 26%;
}
.head_tourismus_inner img {
	width: 500px;
	transform: rotate(-4deg);
}
#stranddatum {
	position: absolute;
	top: 238px;
	left: 50%;
	background-color: #ea5b3d;
	color: #ffffff;
	font-size: 2em;
	font-weight: bold;
	padding: 0.5em;
	transform: translateX(-100%);
}
.maientaghead,
.header .container-banner .mod-custom.maientaghead {
	position: relative;
	background: transparent url(../images/maientag_himmel.png) left top repeat-x;
}
.maientaghead::before {
	display: block;
	content: "";
	position: absolute;
	left: 0px;
	top: 0px;
	bottom: 0px;
	width: 40%;
	background: transparent url(../images/maientag_paar.webp) left bottom no-repeat;
}
.maientaghead::after {
	display: block;
	content: "";
	position: absolute;
	right: 0px;
	top: 0px;
	bottom: 0px;
	width: 40%;
	background: transparent url(../images/maientag_stadt.webp) right bottom no-repeat;
}
.maientaghead > div {
	position: absolute;
	top: 35px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	flex-direction: column;
	align-items: center;
}
.maientaghead img {
	width: 300px;
}
.maientaghead h2 {
	background-color: var(--maientag-blue);
	color: #ffffff;
	margin: 0px;
	text-align: center;
	display: inline;
	font-weight: bold;
	font-size: 1.7em;
	padding: 0.2em 0.5em;
}
.ferienhead {
	position: relative;
}
.ferienhead > div {
	position: absolute;
	right: 35px;
	bottom: 60px;
}
.ferienhead img {
	width: 340px;
}

/* Main-Top */

#main-top {
	display: grid;
	grid-template-columns: 1fr var(--side-column-width);
	column-gap: var(--side-column-gap);	
}
.hassidebar #main-top {
	display: block;
}
#main-top ul.mod-menu {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	padding: 0px;
	margin-top: 0px;
	margin-bottom: var(--inner-top-padding);
	column-gap: 1.5em;	
}
#main-top ul.mod-menu > li,
.cck_link_back_meine_events a {
	font-size: 1.15em;
}
#main-top ul.mod-menu li,
.cck_link_back_meine_events a {
	text-transform: uppercase;
	list-style: none;
}
#main-top ul.mod-menu li a,
.cck_link_back_meine_events a {
	color: var(--body-color);
	text-decoration: underline;
}
#main-top ul.mod-menu li.current > a {
	text-decoration: none;
	font-weight: bold;
}
#main-top ul.mod-menu > li > ul {
	display: none;
	position: absolute;
	left: 0px;
}
#main-top ul.mod-menu.topreiter {
	column-gap: 0.2em;	
	position: relative;
}
#main-top ul.mod-menu.topreiter::after {
	content: "";
	border-bottom: 1px solid var(--light-grey);
	display: block;
	height: 1px;
	position: absolute;
	left: 0px;
	right: 0px;
	bottom: 0px;
	z-index: 5;
}
#main-top ul.mod-menu.topreiter li {
	cursor: pointer;
}
#main-top ul.mod-menu.topreiter li a {
	padding: 0.5em calc(0.5 * var(--column-gap)) 0.5em;
	display: block;
	min-width: 5em;
	text-align: center;
	border: 1px solid transparent;	
	border-bottom: 2px solid transparent;	
}
#main-top ul.mod-menu.topreiter > li > a {
	padding: 0.6em calc(0.5 * var(--column-gap)) 0.5em;	
}
#main-top ul.mod-menu.topreiter:not(:hover) > li.active > a,
#main-top ul.mod-menu.topreiter > li:hover > a {
	background-color: #ffffff;
	border: 1px solid var(--light-grey);
	border-bottom: 2px solid #ffffff;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	position: relative;
	z-index: 10;
	color: var(--body-color);
	text-decoration: none;
	cursor: default;
}	
#main-top ul.mod-menu.topreiter:not(:hover) > li.active > ul,
#main-top ul.mod-menu.topreiter > li:hover > ul {
	display: flex;
	width: 100%;
}


/* Reiter */

.reiter,
#main-top ul.mod-menu.reiter {
	position: absolute;
	top: -53px;
	left: 0px;
	column-gap: 0px;
	overflow: hidden;
	padding-top: 5px;
}
.reiter li {
	margin-right: -18px;
}
.reiter li:last-child {
	margin-right: 0px;
}
.reiter li:first-child a,
#main-top ul.mod-menu.reiter li:first-child a {
	border-top-left-radius: 0px;		
}
.reiter a,
#main-top ul.mod-menu.reiter li a {
	display: flex;
	height: 48px;
	align-items: center;
	padding-left: 3em;
	padding-right: 3em;	
	padding-top: 10px;
	background-color: var(--very-light-grey);
	border-top-left-radius: 12px;
	border-top-right-radius: 12px;	
	box-shadow: inset 0px -7px 9px -8px rgba(0, 0, 0, 0.3);
	text-decoration: none;
	position: relative;
	transition: all 0.2s ease-in;
}
.reiter a:hover,
#main-top ul.mod-menu.reiter li a:hover,
.reiter li.active a,
#main-top ul.mod-menu.reiter li.active a {
	z-index: 20;
	box-shadow: 0px 7px 9px rgba(0, 0, 0, 0.3);
	background-color: #ffffff;
	margin-top: -5px;
	height: 53px;
}

/* Suche */

.total {
	margin-bottom: 1em;
}

/* List */

.zebra td > span[class*="icon-"]::before,
.table td > span[class*="icon-"]::before {
	line-height: 1.5em;
	padding-top: var(--bs-btn-padding-y);
	padding-bottom: var(--bs-btn-padding-y);	
	display: inline-block;
	margin-top: 0.2em;
}
.kulturorte .blog-body {
	display: grid;
	grid-template-columns: repeat(3, 1fr);	
	padding-top: var(--row-gap);
	row-gap: var(--row-gap);
}
.kulturorte .cck_placeholder_1 {
	background-color: var(--body-color);
	width: 2em;
	height: 2em;
	border-radius: 300px;
	color: #ffffff;	
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
}
.kulturorte .columnmaincontent {
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-rows: repeat(3, 1fr);
	column-gap: var(--column-gap-small);
}
.kulturorte .columnmaincontent > div {
	grid-column: 2;	
}
.kulturorte .columnmaincontent .cck_placeholder_1 {
	grid-column: 1;
	grid-row: 1 / -1;
}
div table.zebra td.rx_status {
	vertical-align: middle;
}

/* Tabs */

.nav-tabs > li > a {
	border: 1px solid transparent;	
	border-bottom: 2px solid transparent;	
}
.nav-tabs > li > a.active {
	background-color: #ffffff;
	border: 1px solid var(--light-grey);
	border-bottom: 2px solid #ffffff;	
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;	
}

/* Content */

.columntop {
	margin-bottom: var(--row-gap);	
}
.item-pagemeine-events .columntop {
	display: flex;
	flex-direction: row;
	column-gap: var(--column-gap-small);	
}
.com-content-article__body .columnbottom {
	padding-top: var(--row-gap);
}
.com-content-article__body .stocherform {
	padding-top: var(--row-gap);
}
main #seblod_form {
	margin-top: var(--row-gap);
}
.kulturortemap {
	margin-top: var(--row-gap);	
	width: 600px !important;
	height: 375px !important;
}
main #highlights-blog_strand_subsite {
	margin-top: var(--row-gap);	
}
.item-pagemaientag table td {
	padding: 1em;
}
.item-pagemaientag table td:first-child {
	vertical-align: top;
	padding-right: 2em;
}
.columnmaincontent .moduletable {
	margin-top: var(--row-gap);
}

/* Event */

.event-time {
	display: flex;
	margin-bottom: 1.3em;
}
.event-time h4 {
	margin-bottom: 0px;
	line-height: var(--body-line-height);
}
.event-time .cck_event_begin_time {
	margin-left: 1em;
}
.event .cck_art_title h1 {
	margin-bottom: 0.65em;
}
.com-content-article .columnmaincontent .cck_event_details {
	margin-bottom: var(--row-gap);
}
.com-content-article .columnmaincontent .cck_ticket_info_checkbox li {
	list-style-type: none;
}

/* Fuer Content-Ausgabe - evtl. anpassen, damit es nicht im Formular greift */
#main-top-left .cck_event_logo,
#main-top-right .cck_event_logo {
	margin-bottom: var(--row-gap);
}
#main-top-left .cck_event_organisation,
#main-top-right .cck_event_organisation {
	margin-bottom: var(--row-gap);
}
.cck_content .cck_event_address_plz,
.cck_content .cck_event_address_place,
.cck_content .event_adresse_stadtteil {
	display: inline-block;
	margin-right: 0.3em;
}	
.cck_content .cck_event_address_plz .cck_value,	
.cck_content .cck_event_address_place .cck_value,
.cck_content .event_adresse_stadtteil .cck_value {
	display: inline-block;
}	
.cck_content .cck_event_address_place {
	margin-bottom: var(--row-gap); 
}
#adr_map_canvas {
	display: none;
}
#adr_map_canvas.active {
	display: block;
	padding-bottom: 100%;
	margin-bottom: var(--row-gap); 	
}
.cck_event_map + .cck_btn_maps_enlarge {
	margin-top: calc(-1 * var(--row-gap) + var(--row-gap-small));
}
.cck_btn_maps_enlarge {
	margin-bottom: var(--row-gap); 
}
.columnmain .ka_map,
.columnmain .ka_map + p .btn {
	display: none;
}
.columnmain .ka_map.active {
	display: block;
	padding-bottom: 75%;	
	margin-bottom: var(--row-gap-small);
}
.columnmain .ka_map.active + p .btn {
	display: inline-block;
}
.cck_forms[class*="cck_access_"],
.cck_forms[class*="cck_catv_"] {
	display: block;
}
.cck_forms[class*="cck_access_"] label,
.cck_forms[class*="cck_catv_"] label {
	border: none;
	color: #ffffff;
	transition: opacity 0.2s ease-in-out;	
	background-color: var(--grey);
	min-width: 200px;
}
.cck_forms[class*="cck_access_"] label:hover,
.cck_forms[class*="cck_catv_"] label:hover {
	opacity: 0.8;
}
.cck_forms.cck_access_published label {
	background-color: var(--red);
}
.cck_forms.cck_access_published.active label,
.cck_forms.cck_access_highlight.active label,
.cck_forms.cck_access_post_parking.active label {
	background-color: var(--green);
}
.cck_forms.cck_catv_strandleben.active label,
.sidebody-b .cck_catv_strandleben .btn {
	background-color: var(--strandleben);
}
.cck_forms.cck_catv_kulturmomente.active label,
.sidebody-b .cck_catv_kulturmomente .btn {
	background-color: var(--kulturmomente);
}
.cck_forms.cck_catv_kultursommer.active label,
.sidebody-b .cck_catv_kultursommer .btn {
	background-color: var(--kultursommer);
}
.cck_forms.cck_catv_maientag.active label,
.sidebody-b .cck_catv_maientag .btn {
	background-color: var(--maientag);
}
.cck_forms.cck_catv_stadtfuehrungen.active label,
.sidebody-b .cck_catv_stadtfuehrungen .btn {
	background-color: var(--stadtfuehrungen);
}
.cck_forms.cck_catv_maerkte.active label,
.sidebody-b .cck_catv_maerkte .btn {
	background-color: var(--maerkte);
}
.cck_forms.cck_catv_ferienprogramm.active label,
.sidebody-b .cck_catv_ferienprogramm .btn {
	background-color: var(--ferienprogramm);
}
.cck_forms[class*="cck_access_"] .cck_form,
.cck_forms[class*="cck_catv_"] .cck_form {
	display: none;
}
.details_table {
	display: grid;
	column-gap: var(--column-gap);
	grid-template-columns: var(--small-label-width) 1fr;
	margin-bottom: 2em;	
}

/* Eventblog */

.eventsblog .blog-middle .columnmaincontent {
	display: grid;
	grid-template-columns: 155px 1fr;
	column-gap: var(--blog-gap);
}
.eventsblog .blog-top {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: var(--blog-gap);
	margin-bottom: var(--inner-padding);	
}
.eventsblog .blog-top .columnmaincontent {
	display: block;
}
.eventsblog .blog-top .eventimg_placeholder {
	background-image: url(../images/eventimage_placeholder_2.svg);
	padding-bottom: 66%;	
}
.eventsblog .blog-top .cck_value_upload_image {
	max-width: 300px;
}
.eventsblog .blog-top .cck_value_upload_image a {
	display: block;
	overflow: hidden;
	height: 0px;
	padding-bottom: 67%;
}
.eventsblog .blog-top .cck_value_upload_image a img {
	width: 100%;
}
.eventsblog .blog-top .event_short_details {
	margin-top: 1em;
}
.eventsblog .blog-top .blog-top-item {
	margin-bottom: var(--blog-gap);
}
.eventsblog .blog-body > .blog-middle {
	margin-bottom: var(--blog-gap);
}

.eventsblog .cck_event_gallery_upload_x a {
	display: none;
}
.eventsblog .cck_event_gallery_upload_x a:first-child {
	display: block;
}
.eventsblog .cck_event_gallery_upload_x a img {
	display: block;
}
.eventsblog .eventimg_placeholder {
	display: block;
	padding-bottom: 100%;
	background: transparent url(../images/eventimage_placeholder.svg) center center/cover no-repeat;
}
.eventsblog .event_short_details {
	display: flex;
	flex-direction: column;
	justify-content: center;
	font-size: 1.15em;
}
.eventsblog .event_short_details .cck_event_begin_date,
.eventsblog .event_short_details .cck_teaser_date {
	margin-bottom: var(--p-gap);	
}
.eventsblog .event_short_details h3 {
	margin-bottom: var(--p-gap);
}
.eventsblog .event_short_details a,
.eventsblog .blog-top a {
	text-decoration: none;
	color: var(--body-color);	
}
.eventsblog .event_short_details .cck_event_organisation a {
	color: var(--grey);
	font-weight: bold;
}

/* Event-List */
div table.table td.ka_evtcol_eng, 
div table.zebra td.ka_evtcol_eng {
	padding-right: var(--column-gap-btn);
}
*[class*="ka_evtcol_"] .icon-click {
	background: none;
	padding: 0px;
	border: none;
}
*[class*="ka_evtcol_"] .green {
	background: none;
}
*[class*="ka_evtcol_"] .green .btn {
	background-color: var(--pink);
	border-color: var(--pink);	
}
*[class*="ka_evtcol_"] .green .btn.active {
	background-color: var(--green);
	border-color: var(--green);
}
*[class*="ka_evtcol_"] div[class*="icon-"]::before {
	content: none;
	display: none;
}
*[class*="ka_evtcol_"] *[class*="icon-"] .btn::before {
	font-weight: 900;
	color: #ffffff;
}
*[class*="ka_evtcol_"] .icon-ok .btn::before {
	content: "\F00C";
}
*[class*="ka_evtcol_"] .icon-home .btn::before {
	content: "\F015";
}
*[class*="ka_evtcol_"] .icon-star .btn::before {
	content: "\F005";
}

/* Orga-List */

.orgalist .ka_evtcol_events,
.orgalist .ka_evtcol_ausbmess,
.orgalist .ka_evtcol_beruvde {
	text-align: center;
}

/* Event Formular */

#meine-events #seblod_form .cck_forms .cck_form {
	grid-column: 1 / -1;
}
#meine-events #seblod_form .cck_forms .cck_label + .cck_form {
	grid-column: 2;
}
#meine-events #seblod_form .cck_forms .cck_form.fullwidth {
	grid-column: 2 / -1;	
}
#meine-events #seblod_form .cck_forms .cck_form.fullwidth:first-child {
	grid-column: 1 / -1;	
}
#meine-events #seblod_form .cck_event_end_time .cck_form::after,
#meine-events #seblod_form .cck_event_begin_time .cck_form::after,
.stocherform .cck_module_form .cck_anfrage_uhrzeit .cck_form::after {
	content: "Uhr";
	position: absolute;
	right: 0px;
	transform: translateX(100%);
	padding: 0.5em;
}
#meine-events #seblod_form .cck_event_end_time .cck_desc_text,
#meine-events #seblod_form .cck_event_begin_time .cck_desc_text {
	padding-left: 2em;
}
.cck_event_sub_date_x .cck_form aside {
	display: none;
}
.cck_forms.cck_event_every_day {
	margin-top: 3em;
}
#my-calendar_help {
	margin-bottom: 3em;		
}
.cck_forms.cck_event_sub_date_x .cck_form_group_x {
	margin-bottom: 3em;
}
#meine-events #seblod_form .cck_forms.cck_event_gallery_upload_x div.collection-group-wrap {
	grid-template-columns: 380px 1fr;
	column-gap: var(--column-gap-btn);
	padding-top: 1em;
}


/* Formulare */

.orgaform .cck_forms.cck_orga_details {
	grid-template-columns: var(--label-width) 1fr;
}
.cck_forms.cck_landing_page_item {
	display: block;
}
.cck_forms.cck_landing_page_item > .cck_label > label {
	margin-bottom: 1em;
	margin-top: 2em;
	font-size: 1.5em;	
	display: block;
}
main .cck_module_form {
	margin-top: var(--row-gap);
}

/* Formular unten */

#seblod_form .columnbottom {
	margin-top: 3em;
}


/* Spalte rechts */


.container-component:has(.page-header) ~ .container-sidebar-right,
.container-component:has(h1:first-child) ~ .container-sidebar-right,
#main-top-left:has(h1:first-child) ~ #main-top-right {
	padding-top: 5.4em;
}
.container-component:has(#main-top ~ main h1:first-child) ~ .container-sidebar-right {
	padding-top: 11.4em;
}
.container-sidebar-right .timetable {
	margin-bottom: var(--row-gap);
}

.sidebody-b .btn {
	min-width: 8em;
}

.sidebody-b > div {
	margin-bottom: var(--row-gap);
}


#main-top-right .cck_module_search .events_v2 {
	position: relative;
}
#main-top-right .cck_module_search .events_v2 .cck_search_event {
	margin-bottom: 0px;
}
.cck_suchoptionen_einblenden a {
	font-size: 0.8em;
}
#main-top-right .cck_module_search .events_v2 .columnmaincontent {
	position: relative;
}
#main-top-right .cck_module_search .events_v2 .cck_search_event input {
	max-width: 100%;
	transition: max-width 0.1s ease-in-out;
}
#main-top-right .textinput .cck_module_search .events_v2 .cck_search_event input {
	max-width: 210px;
}
#main-top-right .cck_module_search .events_v2 .cck_suchoptionen_einblenden {
	text-align: right;
	cursor: pointer;
	margin: 0px;
}
.search_staticopen #main-top-right {
	margin-bottom: 2em;
}
.search_staticopen #main-top-right .cck_module_search .events_v2 .cck_suchoptionen_einblenden {
	display: none;
}
#main-top-right .cck_module_search .events_v2 .cck_suchoptionen_einblenden .searchopts_hide {
	display: none;
}
#main-top-right .open .cck_module_search .events_v2 .cck_suchoptionen_einblenden .searchopts_show {
	display: none;
}
#main-top-right .open .cck_module_search .events_v2 .cck_suchoptionen_einblenden .searchopts_hide {
	display: block;
}
#main-top-right .cck_module_search .events_v2 .search_switchbox {
	overflow: hidden;
	max-height: 0px;
	transition: max-height 0.3s ease-in-out;
	padding-top: 1em;
	position: absolute;
	left: 0px;
	right: 0px;
	top: 4.5em;
}
.search_staticopen #main-top-right .cck_module_search .events_v2 .search_switchbox {
	max-height: none;
	position: relative;
	left: auto;
	right: auto;
	top: auto;
}
.search_staticopen #main-top-right .cck_module_search .events_v2 .search_switchbox,
#main-top-right .open .cck_module_search .events_v2 .search_switchbox {
	overflow: visible;
}
#main-top-right .cck_module_search .events_v2::before {
	content: "";
	display: block;
	position: absolute;
	top: -2em;
	left: -2em;
	right: -2em;
	height: 300px;
	background-color: #ffffff;
	max-height: 3em;
	transition: all 0.3s ease-in-out;
	opacity: 0;
	z-index: 15;
}
.search_staticopen #main-top-right .cck_module_search .events_v2::before {
	content: "";
	display: block;
	position: absolute;
	top: -2em;
	left: -2em;
	right: -2em;
	bottom: -2em;
	background-color: #ffffff;
	max-height: none;
	transition: all 0.3s ease-in-out;
	opacity: 0;	
	z-index: 10;
}
#main-top-right .open .cck_module_search .events_v2::before {
	box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.3);
	max-height: 300px;	
	opacity: 1;	
}
.search_staticopen #main-top-right .cck_module_search .events_v2 > div {
	position: relative;
	z-index: 20;
}
#main-top-right .open .cck_module_search .events_v2 .search_switchbox {
	max-height: 300px;
}
#main-top-right .open .cck_module_search .events_v2 > div {
	position: relative;
	z-index: 20;
}
#main-top-right .cck_module_search .events_v2 .search_switchbox > *:first-child {
	margin-top: 1em;
}
#main-top-right .cck_module_search .events_v2 .cck_fakebutton {
	position: absolute;
	right: 0px;
	top: 0px;
	opacity: 0;
	transition: opacity 0.2s ease-in-out;
}
#main-top-right .textinput .cck_module_search .events_v2 .cck_fakebutton {
	opacity: 1;
}
#main-top-right .cck_module_search .events_v2 .cck_forms {
	display: block;
}
#main-top-right .cck_module_search .events_v2 .search_switchbox .cck_forms {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	grid-template-columns: none;
}
.columnb .innerright_top > div {
	margin-bottom: var(--row-gap);;
}
.download_brosch_cont {
	display: grid;
	grid-template-columns: 1fr 1fr;
}
/***** Kalender rechte Spalte *****/

div div.zabuto_calendar {
	border-radius: 5px;
	box-shadow: none;
	overflow: hidden;
	padding: 10px 10px 0px 10px;
	background-color: #fafafa;	
	box-sizing: border-box;	
}
#jsn-pos-right div.zabuto_calendar {
	box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);	
	padding: 30px 30px 20px 30px;
}
/*
.jsn-view-form div.zabuto_calendar {
	width: 220px;

	font-size: 0.75em;
	height: 290px;
}*/
.jsn-view-form .cck_event_every_day + .cck_joomla_module.cck_event_input_calendar {
	overflow: hidden;
	transition: max-height 0.2s ease-in;
	max-height: 0px;
	padding-bottom: 0px;	
	margin-bottom: 10px;
}
.jsn-view-form .cck_event_every_day.visib + .cck_joomla_module.cck_event_input_calendar {
	max-height: 500px;
}
.jsn-view-form div.zabuto_calendar {
	width: 360px;
	margin-left: 180px;
	height: 290px;
}
.jsn-view-form div.zabuto_calendar .table tr td {
	padding-top: 0px;
	padding-bottom: 0px;	
}
div div.zabuto_calendar .table tr.calendar-month-header td {
	font-weight: normal;
}
div div.zabuto_calendar .table th,
div div.zabuto_calendar .table td {
	border: none;
}
div div.zabuto_calendar .table tr th, 
div div.zabuto_calendar .table tr td {
	background: none;
}
div div.zabuto_calendar .table tr.calendar-month-header td {
	padding-top: 0px;
}
div div.zabuto_calendar div.calendar-month-navigation {
	padding-top: 0px;
}
div div.zabuto_calendar div.calendar-month-navigation .glyphicon-chevron-left::before,
div div.zabuto_calendar div.calendar-month-navigation .glyphicon-chevron-right::before {
	display: none;
}
div div.zabuto_calendar .glyphicon-chevron-left,
div div.zabuto_calendar .glyphicon-chevron-right {
	content: "";
	width: 10px;
	height: 10px;
	display: block;
}
div div.zabuto_calendar .glyphicon-chevron-left {
	background: transparent url(../images/pfeil_grau_l_r.png) left center no-repeat;
}
div div.zabuto_calendar .glyphicon-chevron-right {
	background: transparent url(../images/pfeil_grau_l_r.png) right center no-repeat;
}
div div.zabuto_calendar .table tr.calendar-month-header td {
	padding-bottom: 18px;
}
div div.zabuto_calendar .table tr.calendar-month-header td span,
div div.zabuto_calendar .table tr.calendar-dow td span {
	padding-bottom: 0px;
}
div div.zabuto_calendar .table tr.calendar-dow-header th {
	background: none;
	font-weight: normal;
	padding-bottom: 10px;
}
div div.zabuto_calendar .table tr:last-child {
	border-bottom: none;
}
div div.zabuto_calendar .table tr:last-child td {
	padding-bottom: 0px;
}
div div.zabuto_calendar .table tr td div.day {
	position: relative;
	z-index: 10;
}
div div.zabuto_calendar .eventday {
	cursor: pointer;
}
div div.zabuto_calendar .day::before {
	position: absolute;
	display: block;
	width: 10px;
	height: 10px;
	content: "";
	top: 4px;
	left: 50%;
	z-index: -1;
	margin-left: -14px;
	opacity: 0;
	transition: opacity 0.3s linear, color 0.3s linear;
	box-sizing: content-box;
}
div.zab_event_input div.zabuto_calendar .day::before {

}
div div.zabuto_calendar .eventday.day::before {
	background-color: #2a67ce;
	border: 9px solid #2a67ce;
	border-radius: 20px;
	color: #666666;
	opacity: 0.2;
	cursor: pointer;	
}
#my-calendar_help {
	margin-top: 2em;
}

div.zab_event_input div.zabuto_calendar .day {
	cursor: pointer;		
}
div.zab_event_input div.zabuto_calendar .day.off_day {
	cursor: default;	
	color: #bbbbbb;		
}
div.zab_event_input div.zabuto_calendar .day::before {
	border: none;
	color: #666666;
	width: 28px;
	height: 28px;
	opacity: 0;
	background-color: #2a67ce;	
	transition: opacity 0.1s linear, color 0.1s linear;	
}
div.zab_event_input div.zabuto_calendar .day:hover::before {	
	opacity: 0.1;
}
div.zab_event_input div.zabuto_calendar .day.off_day:hover::before {	
	opacity: 0;
}
div.zab_event_input div.zabuto_calendar .eventday.day::before,
div.zab_event_input div.zabuto_calendar .eventday.day.off_day::before {
	border-radius: 2px;
	opacity: 0.2;
}
div div.zabuto_calendar .today {
	border-bottom: 1px solid #2a67ce;
}
div div.zabuto_calendar .badge-today {
	font-size: inherit;
	background: none;
	text-shadow: none;
	border-radius: none;
	color: inherit;
	padding: 0px;
	font-weight: inherit;
}
.calendar_toggle {
	display: none;
}
/* Menue rechts */

.columnb ul.mod-menu {
	list-style: none;
	padding: 0px;
	margin: 0px;
}
.columnb ul.mod-menu li a {
	display: flex;
	flex-direction: row;
	align-items: center;
}

/* Sonstiges rechts */

.gutschein p:first-child {
	margin-bottom: 0px;
}
.gutschein img {
	width: 190px;
}

/* Footer */

.footer-inner {
	padding-left: 130px;
	padding-right: 130px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: var(--column-gap);
}
footer a {
	color: var(--grey);
}
footer .logo-kachur a {
	display: block;
}
footer .logo-kachur a span {
	display: block;
}
footer .logo-kachur a img {
	margin-top: 1.3em;
	opacity: 0.5;
}
footer .mod-menu {
	float: right
}
footer .mod-menu li {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}

.longblog footer {
	position: fixed;
	top: 100%;
	left: 0px;
	right: 0px;
	transition: transform 0.4s ease-in-out;
	background-color: var(--body-bg);
	z-index: 30;
}
.longblog .footer-inner {
	margin-top: 0px;
	margin-bottom: 0px;
	padding-top: 0.5em;
}
.longblog.scrollup footer {
	transform: translateY(-100%);
}
.longblog footer .logo-kachur a {
	display: flex;
	font-size: 0.8em;
	column-gap: 20px;
	align-items: flex-end;
}
.longblog footer .logo-kachur a img {
	width: 80px;
	margin: 0px;
}
.longblog footer .mod-menu {
	display: flex;
	column-gap: 20px;
}

/* Benutzerkonto */

.account-view .cck_item {
	display: grid;
	grid-template-columns: var(--label-width) 1fr;
}

/**** Administration ****/

.status_icon {
	text-align: center;
	padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
	line-height: 1.5em;
}
.status_icon span {
	line-height: 1.5em;
}

@media (max-width: 1600px){
	.container-account .mod-login {
		right: var(--site-padding);
	}
}

@media (max-width: 1200px) {
	
	:root {
		--outer-padding: 30px;		
	}
	
}

@media (max-width: 1000px) {
	
	:root {
		--side-column-gap: 55px;
		--header-height: 300px;
	}

	#main-top {
		display: block;
	}
	.innerright_top .cck_module_search .events_v2 {
		margin-top: 0px;
	}

}

@media (max-width: 800px) {
	
	:root {
		--header-height: 250px;
	}
	
	.brand-logo img {
		width: 85px;
	}
	.container-account {
		top: 10px;
	}
	.sub-brand {
		width: 200px;
		top: 45px;
	}
	#main-top {
		display: grid;
		grid-template-columns: 1fr auto;
		position: relative;
		z-index: 20;
	}
	#main-top-left {
		position: relative;
		display: flex;
		column-gap: var(--blog-gap);
	}
	.mobile_toggle {
		width: 2.5em;
		height: 2.5em;
		cursor: pointer;
		transition: opacity o.2s ease-in-out;
		opacity: 0.65;
	}
	.mobile_toggle:hover,
	.mobile_toggle:active {
		opacity: 1;
	}
	.menu_toggle {
		background: transparent url(../images/icon_menu.svg) center center/95% no-repeat;
	}
	.calendar_toggle {
		display: block;
	}
	.cal_toggle {
		background: transparent url(../images/icon_calendar.svg) center center/contain no-repeat;
	}	
	#main-top-left .mod-menu-cont,
	#main-top-left .zab_calendar {
		position: absolute;
		background: #ffffff;
		top: 2.5em;
		left: 0px;
		max-height: 0px;
		transition: max-height 0.4s ease-in-out;
		overflow: hidden;
	}
	#main-top-left .mobile_toggle.active + .mod-menu-cont {
		max-height: 2000px;
		z-index: 20;
	}	
	#main-top-left ul.mod-menu {
		display: block;
		width: max-content;
		padding: 3em 3em 1em 1em;
		margin-left: -1em;
		margin-bottom: 0px;
	}
	#main-top-left ul.mod-menu > li {
		margin-bottom: 1em;
	}
	#main-top-left ul.mod-menu > li > a {
		display: block;
	}
	#main-top-left ul.mod-menu img {
		display: none;
	}
	#main-top-left ul.mod-menu:nth-child(2) > li {
		font-size: 1em;		
	}
	#main-top-left ul.mod-menu:nth-child(2) > li > a {
		text-decoration: none;
		color: var(--link);
		text-transform: none;
	}
	#main-top-left .zab_calendar {
		margin-top: 1em;
		width: 100%;
	}
	#main-top-left .mobile_toggle.active + .zab_calendar {
		max-height: 2000px;
		z-index: 20;		
	}
	#main-top-right > form {
		position: absolute;
		top: 0px;
		right: 0px;
	}
	#main-top-right .cck_module_search .cck_forms {
		display: block;
	}
	#main-top-right .cck_module_search .cck_forms.cck_search_event,
	#main-top-right .cck_module_search .cck_forms.cck_fakebutton {
		display: inline-block;
		margin-bottom: 0.5em;
	}
	#main-top-right .cck_module_search .cck_forms.cck_search_event {
		padding-top: 0.1em;
		margin-right: 8px;
	}
	#main-top-right .cck_module_search .columnmaincontent {
		position: relative;
	}
	#main-top-right .cck_module_search #fakebutton {
		margin-top: -0.2em;
	}
	#main-top-right .cck_module_search .searchopts_show,
	#main-top-right .cck_module_search .searchopts_hide {
		cursor: pointer;
	}	
	#main-top-right .open .cck_module_search .searchopts_show,
	#main-top-right .cck_module_search .searchopts_hide,
	.search_staticopen #main-top-right .cck_module_search .searchopts_show,
	.search_staticopen #main-top-right .cck_module_search .searchopts_hide {
		display: none;
	}
	#main-top-right .cck_module_search .searchopts_show,
	#main-top-right .open .cck_module_search .searchopts_hide {
		display: block;
	}
	#main-top-right .cck_module_search .events_v2 .search_switchbox {
		position: absolute;
		left: -1em;
		right: -1em;
		background-color: #ffffff;
		max-height: 0px;
		overflow: hidden;
		transition: max-height 0.4s ease-in-out;
	}
	#main-top-right .open .cck_module_search .events_v2 .search_switchbox {
		max-height: 2000px;
		transition: none;
		overflow: visible;
	}
	#main-top-right .cck_module_search .events_v2 .search_switchbox > div {
		padding: 1em;
	}
	#main-top-right .cck_module_search .events_v2 .search_switchbox .cck_forms {
		display: flex;
		flex-direction: row;
		grid-template-columns: none;
		margin: 0px;
	}
	#main-top-right .cck_module_search .events_v2 .search_switchbox .cck_forms .cck_label {
		width: 60px;	
	}		
	.search_staticopen #main-top-right .cck_module_search .events_v2 .search_switchbox {
		position: relative;
		max-height: none;
	}
	.blog-top {
		padding-top: var(--inner-padding);
	}
	.gutschein {
		display: flex;
		align-items: center;
		column-gap: var(--blog-gap);
		grid-column: 1 / -1;	
		margin-top: calc(var(--inner-padding) - var(--blog-gap));		
	}
	.gutschein p:first-child {
		width: calc((100% - var(--blog-gap)) / 2);
	}
	.gutschein img {
		width: 100%;
	}
	.eventsblog .gutschein a {
		white-space: nowrap;
		color: var(--link);
	}
}
@media (max-width: 700px) {
	:root {
		--inner-padding: 30px;
	}
	.blog-top {
		padding-top: 60px;
	}
}

@media (max-width: 550px) {
	:root {
		--header-height: 205px;
		--site-padding: 20px;
		--inner-padding: 20px;
		--blog-gap: 18px;
		--side-column-width: 200px;
	}
	.content {
		padding-left: 0px;
		padding-right: 0px;
		margin-top: 0px;
	}
	.content-inner {
		box-shadow: none;
	}
	.sub-brand {
		width: 165px;
	}
	#main-top {
		display: block;
	}
	#main-top-left {
		height: 2.5em;
		align-items: center;
	}
	.mobile_toggle {
		width: 1.75em;
		height: 1.75em;
	}

	.eventsblog .blog-middle .columnmaincontent {
		grid-template-columns: 135px 1fr;
	}
}