/* =====================================================================================================================
 * All elements
 ==================================================================================================================== */
html, body{
	height:100%;
}
body{
	padding:0;
	margin:0;
	height:100vh;
}
figure,
p,
pre{
	margin:0;
}
a{
	cursor:pointer;
}

/* =====================================================================================================================
 * All contents
 ==================================================================================================================== */
.block > div{
	position:relative;
}
.flex .imgzoom img,
.flex .galleryslider img{
	cursor:pointer;
}
.notification .ui-dialog-titlebar{
	display:none;
}
.notification{
	position:fixed;
}
.height10max{
	max-height:10vh !important;
}
.height20max{
	max-height:20vh !important;
}
.height30max{
	max-height:30vh !important;
}
.height40max{
	max-height:40vh !important;
}
.height50max{
	max-height:50vh !important;
}
.height60max{
	max-height:60vh !important;
}
.height70max{
	max-height:70vh !important;
}
.height80max{
	max-height:80vh !important;
}
.height90max{
	max-height:90vh !important;
}
.height100max{
	max-height:100vh !important;
}
.height10abs{
	height:10vh !important;
}
.height20abs{
	height:20vh !important;
}
.height30abs{
	height:30vh !important;
}
.height40abs{
	height:40vh !important;
}
.height50abs{
	height:50vh !important;
}
.height60abs{
	height:60vh !important;
}
.height70abs{
	height:70vh !important;
}
.height80abs{
	height:80vh !important;
}
.height90abs{
	height:90vh !important;
}
.height100abs{
	height:100vh !important;
}

/* =====================================================================================================================
 * Checkboxes and radio buttons
 ==================================================================================================================== */
input.mycheckbox-origin{
	/*display:none;*/
	position:absolute;
	opacity:0;
	pointer-events:none;
}

input.mycheckbox-origin + label{
	display:inline-flex;
}

.mycheckbox-checkbox{
	border:0;
	padding:0.1em;
	background-color:#eee;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:16px;
	height:16px;
	cursor:pointer;
	margin-right:0.3em;
}

.mycheckbox-icon,
.mycheckbox-iconempty,
.mycheckbox-icondisabled{
	width:16px;
	height:16px;
	display:none;
}

input.mycheckbox-origin:checked + label .mycheckbox-checkbox .mycheckbox-icon{
	display:block;
}
input.mycheckbox-origin:not(:checked):not(:disabled) + label .mycheckbox-checkbox .mycheckbox-iconempty{
	display:block;
}
input.mycheckbox-origin:not(:checked):disabled + label .mycheckbox-checkbox .mycheckbox-icondisabled{
	display:block;
}

/* =====================================================================================================================
 * Radio buttons
 ==================================================================================================================== */
.myradio-fieldset .mycheckbox-checkbox{
	border-radius:50%;
}

.myradio-fieldset label{
	margin-right:1em;
}

/* =====================================================================================================================
 * Header
 ==================================================================================================================== */
.header{
	max-width:none;
	width:100%;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	padding-left:0;
	padding-right:0;
	z-index:0;
	display:flex;
	margin-bottom:1em;
}
.header h1{
	position:absolute;
	left:0;
	padding:0.5em 3em 0.5em;
	width:calc(100% - 6em);
	margin:0;
}
.header h1 a{
	text-decoration:none;
}
.header .headline{
	width:100%;
	position:absolute;
	bottom:0;
	background:rgba(0, 0, 0, .5);
}
.header figure.background{
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	margin:0;
	display:block;
	z-index:-1;
}
.header figure.background img,
.header figure.background video{
	width:100%;
	max-width:100%;
	display:block;
	margin:0 auto;
	border-style:none;
	overflow-clip-margin:content-box;
	overflow:clip;
	object-fit:cover;
}
.header figure.profile{
	display:none;
}

@media screen and (max-width:48em){
	.header h1{
		padding:0.5em 1em 0.5em;
		width:calc(100% - 2em);
		font-size:150%;
		white-space:nowrap;
	}
}

@media screen and (max-width:1024px){
	.ui-dialog .inputblock.inputempty{
		display:none;
	}
}

/* =====================================================================================================================
 * Content
 ==================================================================================================================== */
.wrapper{
	display:flex;
	flex-direction:column;
	min-height:100vh;
}
.content{
	padding:0;
	margin: 0 auto;
	flex: 1;
	width:100%;
}
.flex{
	position:relative;
	max-width:1024px;
	margin:auto;
	display:flex;
	flex-wrap:wrap;
	padding-top:0;
	clear:both;
}
.flex > div,
.flex > figure{
	width:100%;
}
figure.fleximg{
	text-align:center;
}
.flex > div.back,
.flex > div.archive{
	border-radius:inherit;
	background-color:inherit;
	box-shadow:inherit;
	width:100%;
}
.flex p,
.flex h2,
.flex h3,
.flex h4,
.flex h5,
.flex h6{
	margin:0;
	padding:1em;
}
.flex h2{
	font-size:1.3em;
}
> .flex h3{
	font-size:1.2em;
}
.flex h4{
	font-size:1.1em;
}
.flex h5,
.flex h6{
	font-size:1em;
}
.flex p{
	padding:0.5em 1em;
}
.flex .element{
	display:flex;
	flex-direction:column;
}
.flex .element:has( > .fulltextbtn){
	padding-bottom:2em;
}
.flex.event div:has(.fulltextbtn){
	padding-bottom:1.2em;
}
.flex .element.sliderelement .fulltextbtn{
	display:none;
}
.flex .element .fulltextbb{
	display:none;
}
.flex .sliderelement .fulltextbb{
	display:inline-block;
	padding:0.5em;
}
.flex .sliderelement .fulltextbb:hover{
	text-decoration:none;
}
figcaption .fulltextbtn{
	padding:1em;
}
figcaption div + .fulltextbtn{
	padding-top:0;
}
figcaption .fulltextbtn span + span{
	display:none;
}
.element .fulltextbtn .fulltextbtnurl span:last-child,
.event .fulltextbtn .fulltextbtnurl span:last-child{
	position:absolute;
	right:1em;
}
.element .fulltextbtn,
.event .fulltextbtn{
	position:absolute;
	bottom:0;
	display:inline-block;
	width:100%;
}
.element .fulltextbtn a,
.event .fulltextbtn a{
	padding:0.5em 1em;
	display:block;
	width:calc(100% - 2em);
}
.element .fulltextbtn a:hover,
.event .fulltextbtn a:hover{
	text-decoration:none;
}
.flex p:first-child{
	margin-top:0.5em;
}
.flex .audio + div p:first-child{
	margin-top:0;
}
.flex p:last-child{
	padding-bottom:1em;
}
.flex > div{
	width:calc(100%);
}

.flex > div.img img{
	max-width:100%;
	max-height:90vh;
	overflow:auto;
}
.flex figure.fleximg{
	position:relative;
	bottom:0;
}
.flex.block{
	min-height:3em;
	margin-bottom:1em;
}

@media screen and (min-width:1024px){
	
	.flex.flex2 .flex2cols,
	.flex.flex2 .flex3cols,
	.flex.flex2 .flex4cols,
	.flex.flex2 .flex5cols,
	.flex.flex2 .flex6cols,
	.ui-dialog fieldset.flex.flex2 .flex2cols,
	.ui-dialog fieldset.flex.flex2 .flex3cols,
	.ui-dialog fieldset.flex.flex2 .flex4cols,
	.ui-dialog fieldset.flex.flex2 .flex5cols,
	.ui-dialog fieldset.flex.flex2 .flex6cols{
		width:100%;
	}
	
	.flex.flex3 .flex2cols{
		width:calc(66.66% - 0.40em);
	}
	
	.flex.flex3 .flex3cols,
	.flex.flex3 .flex4cols,
	.flex.flex3 .flex5cols,
	.flex.flex3 .flex6cols,
	.ui-dialog fieldset.flex.flex3 .flex3cols,
	.ui-dialog fieldset.flex.flex3 .flex4cols,
	.ui-dialog fieldset.flex.flex3 .flex5cols,
	.ui-dialog fieldset.flex.flex3 .flex6cols{
		width:calc(100%);
	}
	
	.flex.flex4 .flex2cols{
		width:calc(50% - 0.5em);
	}
	
	.flex.flex4 .flex3cols{
		width:calc(75% - 0.3em);
	}
	
	.flex.flex4 .flex4cols,
	.flex.flex4 .flex5cols,
	.flex.flex4 .flex6cols,
	.ui-dialog fieldset.flex.flex4 .flex4cols,
	.ui-dialog fieldset.flex.flex4 .flex5cols,
	.ui-dialog fieldset.flex.flex4 .flex6cols{
		width:calc(100%);
	}
	
	.flex2 > div,
	.flex2 > figure,
	.content:not(.archive) .flex .flex2,
	.ui-dialog fieldset.flex2 > div,
	.ui-dialog fieldset.flex .flex2{
		width:calc(50% - 0.5em);
	}
	
	.flex3 > div,
	.flex3 > figure,
	.content:not(.archive) .flex .flex3,
	.ui-dialog fieldset.flex3 > div,
	.ui-dialog fieldset.flex .flex3{
		width:calc(33.33% - 0.67em);
	}
	
	.flex4 > div,
	.flex4 > figure,
	.content:not(.archive) .flex .flex4,
	.ui-dialog fieldset.flex4 > div,
	.ui-dialog fieldset.flex .flex4{
		width:calc(25% - 0.75em);
	}
	
	.flex5 > div,
	.flex5 > figure,
	.content:not(.archive) .flex .flex5{
		width:calc(20% - 0.8em);
	}
	
	.flex.flex5 .flex2cols{
		width:calc(40% - 0.6em);
	}
	
	.flex.flex5 .flex3cols{
		width:calc(60% - 0.4em);
	}
	
	.flex.flex5 .flex4cols{
		width:calc(80% - 0.2em);
	}
	
	.flex.flex5 .flex5cols,
	.flex.flex5 .flex6cols{
		width:100%;
	}
	
	.flex6 > div,
	.flex6 > figure,
	.content:not(.archive) .flex .flex6{
		width:calc(16% - 0.41em);
	}
	
	.flex6 .flex2cols{
		width:calc(33% - 0.44em);
	}
	
	.flex6 .flex3cols{
		width:calc(50% - 0.5em);
	}
	
	.flex6 .flex4cols{
		width:calc(67% - 0.54em);
	}
	
	.flex6 .flex5cols{
		width:calc(84% - 0.59em);
	}
	
	.flex.flex6 .flex6cols{
		width:100%;
	}
}

@media screen and (max-width:1024px){
	.flex{
		margin:0 1em;
	}
}

/* =====================================================================================================================
 * Images
 ==================================================================================================================== */
.flex figure.fleximg figcaption.figcaptionbottomright,
.flex figure.fleximg figcaption.figcaptionbottomleft,
.flex figure.fleximg figcaption.figcaptiontopright,
.flex figure.fleximg figcaption.figcaptiontopleft,
.flex figure.fleximg figcaption.figcaptiontop,
.flex figure.fleximg figcaption.figcaptionright,
.flex figure.fleximg figcaption.figcaptionbottom,
.flex figure.fleximg figcaption.figcaptionleft,
.flex figure.fleximg figcaption.figcaptionmiddle,
.header figure.background figcaption.figcaptionbottomright,
.header figure.background figcaption.figcaptionbottomleft,
.header figure.background figcaption.figcaptiontopright,
.header figure.background figcaption.figcaptiontopleft,
.header figure.background figcaption.figcaptiontop,
.header figure.background figcaption.figcaptionright,
.header figure.background figcaption.figcaptionbottom,
.header figure.background figcaption.figcaptionleft,
.header figure.background figcaption.figcaptionmiddle{
	position:absolute;
	margin:0.5em;
}
.flex figure.fleximg figcaption.figcaptionbottomright,
.header .background figcaption.figcaptionbottomright{
	bottom:0;
	right:0;
}
.flex figure.fleximg figcaption.figcaptionbottomleft,
.header .background figcaption.figcaptionbottomleft{
	bottom:0;
	left:0;
}
.flex figure.fleximg figcaption.figcaptiontopright,
.header .background figcaption.figcaptiontopright{
	top:0;
	right:0;
}
.flex figure.fleximg figcaption.figcaptiontopleft,
.header .background figcaption.figcaptiontopleft{
	top:0;
	left:0;
}
.flex figure.fleximg figcaption.figcaptionbottom,
.header .background figcaption.figcaptionbottom{
	/*text-align:center;*/
	bottom:0;
	left:0;
	right:0;
}
.flex figure.fleximg figcaption.figcaptiontop,
.header .background figcaption.figcaptiontop{
	/*text-align:center;*/
	top:0;
	left:0;
	right:0;
}
.flex figure.fleximg figcaption.figcaptionleft,
.header .background figcaption.figcaptionleft{
	/*text-align:center;*/
	writing-mode:sideways-lr;
	top:0;
	left:0;
	bottom:0;
}
.flex figure.fleximg figcaption.figcaptionmiddle,
.header .background figcaption.figcaptionmiddle{
	/*text-align:center;*/
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
}
.flex figure.fleximg figcaption.figcaptionright,
.header .background figcaption.figcaptionright{
	/*text-align:center;*/
	writing-mode:vertical-rl;
	top:0;
	right:0;
	bottom:0;
}
.flex figcaption,
.header .background figcaption{
	text-align:left;
}
.imgviewer{
	background:#333 !important;
	text-align:center;
}
.imgviewer img{
	max-height:100%;
	max-width:100%;
	cursor:pointer;
}
.flex figure.fleximg img,
.flex figure.fleximg video,
.flex video{
	max-width:100%;
	max-height:90vh;
	
}
.flex figure.fleximg.fullimg a,
.flex figure.fleximg.fullimg picture img,
.flex figure.fleximg.fullimg video,
.flex .fullvideo video{
	height:100%;
	object-fit:cover;
	object-position:center bottom;
}
.flex figure.fleximg.fleximgembedded img,
.flex figure.fleximg.fleximgembedded video{
	border-radius:inherit;
}
.flex figcaption,
.header .background figcaption{
	padding:0.5em 1em;
	font-size:0.9em;
}
.flex .footnote{
	font-size:0.8em;
}
.flex{
	row-gap:1em;
	column-gap:1em;
}

/* =====================================================================================================================
 * Headline element
 ==================================================================================================================== */
> div.headline{
	position:relative;
	height:100%;
	max-width:100%;
	display:block;
	margin:0 auto;
	border-style:none;
	overflow-clip-margin:content-box;
	overflow:clip;
	object-fit:cover;
}
.header,
div.headline{
	margin-bottom:1em;
	position:relative;
}
div.headline > div > div{
	display:flex;
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
}
div.headline > div > div > p,
div.headline > div > div > h2{
	position:relative;
	width:1024px;
	max-width:1024px;
	margin:auto;
	padding:1em;
	font-size:1.4em;
	font-weight:bold;
}
div.headline img,
div.headline video{
	width:100%;
}
img.imgfocustopleft,
video.imgfocustopleft{
	object-fit:cover;
	object-position:0 0;
}
img.imgfocustopcenter,
video.imgfocustopcenter{
	object-fit:cover;
	object-position:50% 0;
}
img.imgfocustopright,
video.imgfocustopright{
	object-fit:cover;
	object-position:100% 0;
}
img.imgfocusmiddleleft,
video.imgfocusmiddleleft{
	object-fit:cover;
	object-position:0 50%;
}
img.imgfocusmiddlecenter,
video.imgfocusmiddlecenter{
	object-fit:cover;
	object-position:50% 50%;
}
img.imgfocusmiddleright,
video.imgfocusmiddleright{
	object-fit:cover;
	object-position:100% 50%;
}
img.imgfocusbottomleft,
video.imgfocusbottomleft{
	object-fit:cover;
	object-position:0 100%;
}
img.imgfocusbottomcenter,
video.imgfocusbottomcenter{
	object-fit:cover;
	object-position:50% 100%;
}
img.imgfocusbottomright,
video.imgfocusbottomright{
	object-fit:cover;
	object-position:100% 100%;
}

/* =====================================================================================================================
 * History back element
 ==================================================================================================================== */
p.back{
	text-align:center;
}

/* =====================================================================================================================
 * Footer
 ==================================================================================================================== */
.footer{
	position:relative;
}
.footer .footer1{
	position:relative;
	text-align:center;
	padding:1em;
}

/* =====================================================================================================================
 * Countdown
 ==================================================================================================================== */
.countdown{
	margin-bottom:0.5em;
}
.countdown .countdown_inner{
	padding:0 1em;
	white-space:nowrap;
}
.countdown .countdown_inner > div{
	padding:0.6em;
	margin:0.1em;
	vertical-align:middle;
	text-align:center;
	border-radius:0.5em;
	float:left;
	width:30px;
}
.countdown .countdown_inner .meta{
	font-size:50%;
}
.countdown .clear{
	clear:both;
}

/* =====================================================================================================================
 * Audio player
 ==================================================================================================================== */
audio{
	width:calc(100% - 1em);
	margin:0.5em;
}

/* =====================================================================================================================
 * Calendar list
 ==================================================================================================================== */
.event .title{
	font-weight:bold;
}
.event .time{
	display:none;
}
.eventgroup{
	font-weight:bold;
}

/* =====================================================================================================================
 * Slider gallery
 ==================================================================================================================== */
.slidergallery figure{
	display:inline-block;
	text-align:center;
	margin:0 auto;
}
.flex .element.hidden,
.slidergallery .hidden{
	display:none;
}
.slidergallery .btn{
	z-index:1000;
	position:absolute;
	top:50%;
}
.slidergallery button.nav{
	font-size:2em;
	padding:0.2em 0.5em;
	border:none;
	background-color:rgba(255, 255, 255, 0.5);
	cursor:pointer;
}
.slidergallery button.nav:hover{
	background-color:rgba(255, 255, 255, 0.9);
}
.slidergallery .prev{
	left:0;
}
.slidergallery .next{
	right:0;
}
.slidergallery .imgcnt{
	position:absolute;
	top:0;
	right:0.2em;
	background-color:rgba(255, 255, 255, 0.8);
	padding:0.5em;
}
.slidergallery .img > div{
	position:relative;
}
.slidergallery:not(.slidergallerycontent) .img,
.slidergallerycontent .img .sliderelement:has(.fullimg){
	text-align:center;
}
.slidergallerycontent .img .sliderelement:not(:has(.fullimg)){
	text-align:inherit;
}
.flex .element.sliderelementactive{
	display:flex;
	flex-direction:row;
}
.slidergallerycontent .img .navbar{
	text-align:center;
}
.slidergallery .navbar{
	padding-top:0.5em;
	padding-bottom:0.5em;
}
.slidergallery .navbar span{
	width:0.6em;
	height:0.6em;
	border-radius:0.5em;
	display:inline-block;
	margin:0.2em;
	cursor:pointer;
}
.slidergallery .navbar span.active{
	width:2em;
	height:0.6em;
}
.slidergallery .timeoutbar{
	height:0.4em;
}
.slidergallery .timeoutbar div.timeout{
	width:0;
	height:100%;
}

@media screen and (min-width:1025px){
	.slidergallerycontent .sliderelement{
		clear:both;
	}
	
	.slidergallerycontent .sliderelement figure:not(.fullimg){
		max-width:33%;
		margin-right:1em;
	}
	
	.slidergallerycontent .navbar,
	.slidergallerycontent .timeoutbar{
		clear:both;
	}
}

/* =====================================================================================================================
 * Image / Calendar download
 ==================================================================================================================== */
.event > div{
	position:relative;
}
.event .icaldownload,
figure .imgdownloadcontainer{
	position:absolute;
	top:0.2em;
	right:0.2em;
}
figure .imgdownload,
.event .icaldownload,
.imgdownloadcontainer .mycheckbox-checkbox{
	background:rgba(255, 255, 255, 0.4);
	padding:0.2em;
	cursor:pointer;
}
figure .imgdownload:hover,
.event .icaldownload:hover,
.imgdownloadcontainer .mycheckbox-checkbox:hover{
	background:rgba(255, 255, 255, 0.8);
}
figure .imgdownloadcontainer{
	display:flex;
}
.imgdownloadcontainer > span,
.imgdownloadcontainer > label{
	margin-left:0.2em;
}
.imgdownloadcontainer .mycheckbox-checkbox{
	width:24px;
	height:24px;
	margin-right:0;
}

.gallery:has(.imgdownloadmultiple:checked) .imgdownloadsinglebtn{
	display:none;
}
.gallery .imgdownloadmultiplebtn{
	display:none;
}
.gallery:has(.imgdownloadmultiple:checked) .imgdownloadmultiplebtn{
	display:inherit;
}

/* =====================================================================================================================
 * Code
 ==================================================================================================================== */
.flex pre{
	position:relative;
	padding:0.5em 0;
}

/* =====================================================================================================================
 * Index
 ==================================================================================================================== */
div.myindex ul{
	list-style-type:none;
	margin:0;
	padding:0 0 0 1em;
}
div.myindex li{
}

/* =====================================================================================================================
 * Charts
 ==================================================================================================================== */
.chartjs{
	position:relative;
	width:100%;
}
.chart canvas{
	background-color:white;
}

/* =====================================================================================================================
 * Emojis
 ==================================================================================================================== */
.emoji{
	width:16px;
}
.emoji2{
	width:32px;
}

/* =====================================================================================================================
 * Image options
 ==================================================================================================================== */
video.imgrot90,
img.imgrot90{
	transform:rotate(90deg);
}
img.imgrot180,
video.imgrot180{
	transform:rotate(180deg);
}
img.imgrot270,
video.imgrot270{
	transform:rotate(270deg);
}
img.imgrotreflectx,
video.imgrotreflectx{
	transform:scaleX(-1);
}
img.imgrotreflecty,
video.imgrotreflecty{
	transform:scaleY(-1);
}
img.imgrotreflectxy,
video.imgrotreflectxy{
	transform:scale(-1, -1);
}

/* =====================================================================================================================
 * Open Street Map
 ==================================================================================================================== */
.osmmap{
	height:300px;
}
.osmmap a:before,
.osmmap a:after,
.osmmap a:hover{
	text-decoration:inherit;
	content:inherit;
}
.editbar_element,
.editbar_block{
	z-index:1000;
}
.editbar_submenu{
	z-index:1001;
}
.map .leaflet-control svg{
	display:none !important;
}
.map .mapmarker img.mapmarker-icon{
	width:25px;
	height:41px;
}
.map .mapmarker img.mapmarker-overlay{
	position:absolute;
	left:3px;
	top:3px;
	background-color:white;
	padding:1px;
	border-radius:100%;
	width:17px;
	height:17px;
}
/* =====================================================================================================================
 * Default layout
 ==================================================================================================================== */
.popuplayout .flex.block{
	margin-bottom:0;
}
.popuplayout .flex > div,
.popuplayout .flex > figure,
.popuplayout .flex > div.img img,
.popuplayout .flex figure.fleximg img,
.popuplayout .flex figure.fleximg video,
.popuplayout .flex video,
.popuplayout .flex figure.fleximg.fullimg a,
.popuplayout .flex figure.fleximg.fullimg img,
.popuplayout .flex figure.fleximg.fullimg video,
.popuplayout .flex .fullvideo video,
.popuplayout .chart canvas,
.popuplayout .chart canvas.withhtml,
.editor .popuplayout .block:hover,
.half .flex > div,
.half .flex > figure,
.half .flex > div.img img,
.half .flex figure.fleximg img,
.half .flex figure.fleximg video,
.half .flex video,
.half .flex figure.fleximg.fullimg a,
.half .flex figure.fleximg.fullimg img,
.half .flex figure.fleximg.fullimg video,
.half .flex .fullvideo video,
.half .chart canvas,
.half .chart canvas.withhtml,
.error .flex > div,
.error .flex > figure,
.error .flex > div.img img,
.error .flex figure.fleximg img,
.error .flex figure.fleximg video,
.error .flex video,
.error .flex figure.fleximg.fullimg a,
.error .flex figure.fleximg.fullimg img,
.error .flex figure.fleximg.fullimg video,
.error .flex .fullvideo video,
.error .chart canvas,
.error .chart canvas.withhtml,
.editor .fulltext .block:hover,
.archive .flex > div,
.archive .flex > figure,
.archive .flex > div.img img,
.archive .flex figure.fleximg img,
.archive .flex figure.fleximg video,
.archive .flex video,
.archive .flex figure.fleximg.fullimg a,
.archive .flex figure.fleximg.fullimg img,
.archive .flex figure.fleximg.fullimg video,
.archive .flex .fullvideo video,
.archive .chart canvas,
.archive .chart canvas.withhtml,
.editor .archive .block:hover{
	border-radius:inherit;
	box-shadow:inherit;
}

.youtubevideo{
	width:100%;
	height:80vh;
}

/* =====================================================================================================================
 * Tables
 ==================================================================================================================== */
table{
	width:100%;
	border-collapse:collapse;
}
table th,
table td{
	padding:0.8em;
}
table th{
	font-weight:bold;
}
table td{
	text-align:center;
}

.table-container{
	overflow:auto;
	width:100%;
	max-height:90vh;
}
.table-sticky-head thead tr:first-child{
	position:sticky;
	top:0;
	z-index:2;
}

.table-sticky-body thead tr th:first-child,
.table-sticky-body tbody td:first-child,
.table-sticky-body tbody tr th:first-child{
	position:sticky;
	left:0;
	z-index:1;
}

/* =====================================================================================================================
 * Moving text
 ==================================================================================================================== */
.marquee{
	white-space:nowrap;
	overflow:hidden;
}
.marquee > span{
	margin:0;
	padding:0 0 0 100%;
	display:inline-block;
	animation-name:animation_marquee;
	animation-timing-function:linear;
	animation-duration:10s;
	animation-iteration-count:infinite;
}
@keyframes animation_marquee{
	0%{ transform:translate(0, 0); }
	100%{ transform:translate(-100%, 0); }
}

/* =====================================================================================================================
 * Blinking text
 ==================================================================================================================== */
.blink{
	animation-name:animation_blink;
	animation-timing-function:ease-in;
	animation-duration:1s;
	animation-iteration-count:infinite;
}

@keyframes animation_blink{
	0%{ opacity:1; }
	60%{ opacity:1; }
	70%{ opacity:0; }
	90%{ opacity:0; }
	100%{ opacity:1; }
}

/* =====================================================================================================================
 * Dialogs
 ==================================================================================================================== */
.ui-dialog{
	box-shadow:0.1em 0.1em 0.5em #333;
}
.ui-widget-content{
	padding:0;
}
.ui-dialog-titlebar{
	border-radius:0;
}
.ui-dialog-disabled{
	opacity:0.5;
	pointer-events:none;
}
.ui-dialog input,
.ui-dialog select,
.ui-dialog textarea{
	width:99%;
	border:0;
	padding:0.4em;
	background-color:#eee;
}
.ui-dialog input[type=checkbox]{
	width:inherit;
}
.ui-dialog fieldset > div,
.ui-dialog-content > div.inputblock{
	margin-bottom:0.5em;
	width:100%;
}
.ui-dialog .inputblock.inputplocknowrap{
	white-space:inherit;
}
.ui-dialog-content fieldset.scrollable{
	overflow:auto;
	height:calc(100% - 1em);
}
.ui-dialog fieldset.flex{
	position:relative;
	display:flex;
	flex-wrap:wrap;
}
.ui-dialog fieldset.flex{
	row-gap:1em;
	column-gap:1em;
}
body.noscroll{
	overflow:hidden;
}
.inputform form > div{
	margin-bottom:0.5em;
	padding:0 0.5em;
}

/* =====================================================================================================================
 * Dashboard layout
 ==================================================================================================================== */
.dashboard .header{
	min-height:100vh;
}
.dashboard .header figure.background img,
.dashboard .header figure.background video{
	height:100vh;
}
.header figure.profile{
	margin-top:6em;
	margin-left:2em;
	display:flex;
	/*width:100%;*/
}
.header figure.profile img{
	border-radius:100%;
}

/* =====================================================================================================================
 * Default layout
 ==================================================================================================================== */
.half .content,
.fulltext .content,
.archive .content,
.error .content{
	max-width:1024px;
	margin:auto;
	min-height:calc(50vh - 2.9em);
}
/*.half .fulltext > div,
.fulltext .fulltext > div,
.archive .archive > div,
.error .fulltext > div{
	max-width:1024px;
	margin:auto;
	background-color:#eee;
	min-height:calc(50vh - 2.9em);
}*/
.half .flex.block,
.fulltext .flex.block,
.archive .flex.block,
.error .flex.block{
	margin-bottom:0;
	padding-bottom:1em;
}
.half .flex.block:last-child,
.fulltext .flex.block:last-child,
.archive .flex.block:last-child,
.error .flex.block:last-child{
	padding-bottom:0;
}
.half .header,
.fulltext .header,
.archive .header,
.error .header{
	min-height:50vh;
	max-height:50vh;
	margin-bottom:0;
}
.half .header figure.background img,
.fulltext .header figure.background img,
.archive .header figure.background img,
.error .header figure.background img,
.half .header figure.background video,
.fulltext .header figure.background video,
.archive .header figure.background video,
.error .header figure.background video{
	height:50vh
}
.half .content,
.error .content,
.fulltext .content,
.archive .content{
	min-height:calc(50vh - 2.9em);
}

/* =====================================================================================================================
 * Tooltip
 ==================================================================================================================== */
.mytooltip{
	background:rgba(51, 51, 51, 0.9);
	padding:0.5em;
	border:none;
	box-shadow:0 0 0.5em #333;
	font-size:0.8em;
	color:#fff;
	z-index:9999;
	max-width:300px;
	display:block;
	position:absolute;
}
.mytooltiphidden{
	display:none;
}
@media screen and (max-width:350px){
	.mytooltip{
		max-width:90%;
	}
}

/* =====================================================================================================================
 * Forms
 ==================================================================================================================== */
form{
	margin-block-end:0;
}
.flex.form,
.flex .form,
.half .flex.block.form{
	margin-bottom:0.5em;
}
.form .url{
	word-break:break-all;
}
.flex .element .form{
	padding:0.5em;
	margin-bottom:0.5em;
}
.flex form{
	margin:0;
	margin-block:0;
}
form.felogout{
	padding:0.5em;
	text-align:right;
}
.flex form input,
.flex form select,
.flex form textarea,
form .passwordcontainer,
.myradio-fieldset .myradio-list{
	margin-bottom:0.3em;
}
.flex .form button,
.flex form input[type='button'],
.flex form input[type='submit'],
form.felogout input[type='submit']{
	padding:0.5em;
	cursor:pointer;
	font-size:1em;
	margin-right:0.5em;
}
.flex form input[type='text'],
.flex form input[type='password'],
.flex form input[type='date'],
.flex form input[type='tel'],
.flex form input[type='email'],
.flex form input[type='number'],
.flex form textarea,
.flex form select{
	width:100%;
	border:0;
	padding:0.4em;
	font-size:1em;
}
.flex .form button,
.flex form input[type='button'],
.flex form input[type='submit'],
form.felogout input[type='submit']{
	border:none;
}

.flex .inputform fieldset.formfield-fieldset{
	padding:0;
	margin:calc(0.5em - 1px);
	border:1px solid;
}
.flex .inputform fieldset.formfield-fieldset > legend{
	font-weight:bold;
	margin:0 1em;
}

.flex .inputform fieldset.myradio-fieldset > legend{
	cursor:default;
}

.flex .inputform fieldset.formfield-fieldset p,
.flex .inputform fieldset.formfield-fieldset fieldset.myradio-fieldset{
	padding:0.5em;
}

.flex .inputform fieldset.myradio-fieldset.formfield-box{
	margin:0.5em 0 0 0;
	border:0;
}
.flex .inputform fieldset p.formfield-radio-list{
	padding:0;
}
.flex .inputform fieldset p.formfield-radio-description{
	padding:0.3em 0 0 0;
}

.formdownloadpw .formfielderror{
	margin:1em;
}
.survey .formerror,
.inputform .formerror,
.inputform .formfielderror,
.formdownloadpw .formfielderror{
	border:2px solid darkred;
	background-color:lightcoral;
	margin-bottom:0.2em;
}

.content > .form .formfielderror fieldset,
.content > section > .form .formfielderror fieldset,
.content div.flex .form .formfielderror fieldset,
.content div.flex .element .form .formfielderror fieldset{
	border-color:darkred;
}

.survey .formsucceed,
.inputform .formsucceed{
	border:2px solid darkgreen;
	background-color:lightgreen;
	margin-bottom:0.2em;
}

.inputform .description,
form .description{
	font-size:0.8em;
}
.inputform .description.error{
	color:darkred;
}
.inputform .captcha-img{
	margin-bottom:0.2em;
}
.inputform .visually-hidden{
	display:none;
}

form .formfield-box{
	padding:0.5em 1em;
}

.flex .inputform fieldset{
	padding-bottom:0.2em;
}

.inputform fieldset > div.formfielderror,
form fieldset > div.formfielderror{
	margin-bottom:0;
}

/* =====================================================================================================================
 * Input fields with icon.
 ==================================================================================================================== */
.inputiconcontainer,
.flex form .inputiconcontainer{
	width:100%;
	position:relative;
	display:inline-block;
}
.flex form .inputiconcontainer input[type='text'],
.flex form .inputiconcontainer input[type='password']{
	width:100%;
	margin-bottom:0;
}
.inputiconcontainer img{
	position:absolute;
	right:0.5em;
	top:calc(50%);
	transform:translateY(-50%);
	cursor:pointer;
}

/* =====================================================================================================================
 * History back button.
 ==================================================================================================================== */
.element.back a.url,
a.historyback{
	padding:0.5em 1em;
}
.element.back a.url:hover,
a.historyback:hover{
	text-decoration:none;
}
.element.back a.url:before,
.element.back a.url:after,
a.url.historyback:before,
a.url.historyback:after{
	content:"";
}

/* =====================================================================================================================
 * Calendar week view
 ==================================================================================================================== */
.calendar-table table{
	border:1px solid lightgrey;
	border-collapse:collapse;
	position:relative;
}
.calendar-table td.calendar-week-view-cell,
.calendar-table th.calendar-week-view-cell{
	width:14.28%;
}
.calendar-table td{
	height:60px;
}
.calendar-table .singleevent{
	position:absolute;
	overflow:hidden;
	text-overflow:ellipsis;
}
.calendar-table .singleevent > div{
	padding:0.4em;
	max-width:100%;
	max-height:100%;
	text-align:center;
}
.calendar-table .singleevent:hover{
	z-index:9998;
	cursor:pointer;
}

.flex.calendar-table h3{
	padding:0;
	margin:0;
	font-size:1em;
}

.flex.event.calendar-table div:has(.fulltextbtn){
	padding-bottom:0;
}
.event.calendar-table .date,
.event.calendar-table .fulltextbtn,
.event.calendar-table .location{
	display:none;
}
.event.calendar-table .time{
	display:inherit;
	font-size:0.9em;
	white-space:nowrap;
}

.flex.calendar-table p:last-child{
	padding-bottom:0;
}

/* =====================================================================================================================
 * Survey
 ==================================================================================================================== */
.survey tr.choices th{
	white-space:nowrap;
}
.survey .name{
	text-align:center;
}
.survey td:first-child{
	min-width:10em;
}
.mysurvey-origin{
	position:absolute;
	opacity:0;
	pointer-events:none;
}
.survey .mysurvey-buttons,
.survey .mysurvey-description{
	margin:0.5em;
}
.survey .mysurvey-description{
	font-size:0.9em;
}
.mysurvey-checkbox{
	border:0;
	padding:0.1em;
	background-color:#eee;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:16px;
	height:16px;
	margin-right:0.3em;
}
.mysurvey-choice:not(:disabled) + label .mysurvey-checkbox{
	cursor:pointer;
}

.mysurvey-icon,
.mysurvey-iconempty,
.mysurvey-iconmaybe,
.mysurvey-icondisabled{
	width:16px;
	height:16px;
	display:none;
}

.mysurvey-origin[data-val='Y'] + label .mysurvey-checkbox{
	background-color:lightgreen;
}
.mysurvey-origin[data-val='Y'] + label .mysurvey-checkbox .mysurvey-icon{
	display:block;
	stroke:#000;
}
.mysurvey-origin[data-val=''] + label .mysurvey-checkbox .mysurvey-iconempty{
	display:block;
}
.mysurvey-origin[data-val='N'] + label .mysurvey-checkbox{
	background-color:lightcoral;
}
.mysurvey-origin[data-val='N'] + label .mysurvey-checkbox .mysurvey-icondisabled{
	display:block;
	stroke:#000;
}
.mysurvey-origin[data-val='?'] + label .mysurvey-checkbox{
	background-color:yellow;
}
.mysurvey-origin[data-val='?'] + label .mysurvey-checkbox .mysurvey-iconmaybe{
	display:block;
	stroke:#000;
}

.survey .membername{
	min-width:5em;
	max-width:5em;
	width:5em;
}
.survey .mysurvey-origin{
	min-width:0.1em;
	max-width:0.1em;
	width:0.1em;
}

/* =====================================================================================================================
 * Druck
 ==================================================================================================================== */
@media print {
	header,
	footer,
	.element.back,
	.slidergallery .navbar,
	.slidergallery .timeoutbar,
	.slidergallery .btn{
		display: none !important;
	}
	body {
		font-size: 12pt !important;
		line-height: 1.5 !important;
		margin: 2cm !important;
		background: white !important;
		color: black !important;
	}
	a {
		color: black !important;
		text-decoration: underline !important;
	}
	section {
		page-break-before: always;
	}
	a:after {
		content: " (" attr(href) ")" !important;
		font-size: 10pt;
	}
}