@charset "UTF-8";
/*
Theme Name: HSB
Author: Anonymous
Author URI:
Version: 1
Description: Hsbcom Gutenberg theme for Wordpress
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hsbcom
Tags: one-column, two-columns
Theme URI:
*/


/* do not judge this very ugly fix for the Admin bar search input field. The _form.scss is literally overwriting every input field with !important */

#wpadminbar > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input[type=text]:not(textarea) {
	display                    : inline-block !important;
	float                      : none !important;
	position                   : relative !important;
	z-index                    : 30 !important;
	font-size                  : 13px !important;
	font-family                : -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	line-height                : 1.84615384 !important;
	text-indent                : 0 !important;
	height                     : 24px !important;
	width                      : 24px !important;
	max-width                  : none !important;
	padding                    : 0 3px 0 24px !important;
	margin                     : 0 !important;
	color                      : #C3C4C7 !important;
	background-color           : rgba(255, 255, 255, 0) !important;
	border                     : none !important;
	outline                    : 0 !important;
	cursor                     : pointer !important;
	box-shadow                 : none !important;
	box-sizing                 : border-box !important;
	transition-duration        : .4s !important;
	transition-property        : width, background !important;
	transition-timing-function : ease !important;
}

#wpadminbar > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input[type=text]:not(textarea):focus {
	z-index          : 10 !important;
	color            : #000000 !important;
	width            : 200px !important;
	background-color : rgba(255, 255, 255, .9) !important;
	cursor           : text !important;
	border           : 0 !important;
}

.start-text {
	display               : grid;
	grid-template-columns : repeat(5, 1fr);
	grid-template-rows    : repeat(2, 1fr);
	grid-column-gap       : 25px;
	grid-row-gap          : 0px;
}


@keyframes fadeTextTwo {
	0% {
		opacity : 0;
	}

	100% {
		opacity : 1;
	}
}


.loaded .start-text-holder .start-text .char {
	animation-name          : fadeTextTwo !important;
	animation-delay         : calc(0.1s * var(--char-index)) !important;
	-webkit-animation-name  : fadeTextTwo !important;
	-webkit-animation-delay : calc(0.1s * var(--char-index)) !important;
	-moz-animation-name     : fadeTextTwo !important;
	-moz-animation-delay    : calc(0.1s * var(--char-index)) !important;
	-o-animation-name       : fadeTextTwo !important;
	-o-animation-delay      : calc(0.1s * var(--char-index)) !important;
	-ms-animation-name      : fadeTextTwo !important;
	-ms-animation-delay     : calc(0.1s * var(--char-index)) !important;
}

@media screen and (max-width : 767px) {
	.start-text {
		grid-column-gap : 15px;
	}
}

.start-text .word:nth-of-type(1) {
	grid-area : 1 / 1 / 2 / 4;
}

.start-text .word:nth-of-type(3) {
	grid-area  : 1 / 4 / 2 / 6;
	text-align : right;
}

.start-text .word:nth-of-type(5) {
	grid-area : 2 / 1 / 3 / 6;
}

.splitting .word {
	line-height : 1.15;
}

.grid-item-inner {
	--speed0 : 0.75s;
	--speed1 : 0.85s;
	--speed2 : 0.95s;
	--speed3 : 1.05s;
	--speed4 : 1.15s;
	--delay  : 1.666s;
}

.start-grid .grid-item .grid-item-inner {
	transition : transform var(--speed1) cubic-bezier(0.5, 0.33, 0.21, 1) var(--delay), opacity var(--speed2) cubic-bezier(0.4, 0, 1, 1) var(--delay) !important;
}

.start-grid-col:nth-child(1) .grid-item:nth-child(6n-2) .grid-item-inner {
	transition : transform var(--speed3) cubic-bezier(0.77, 0.85, 0.63, 1) var(--delay), opacity var(--speed3) ease-in-out var(--delay) !important;
}

.start-grid-col:nth-child(1) .grid-item:nth-child(6n-3) .grid-item-inner {
	transition : transform var(--speed1) cubic-bezier(0.66, -0.13, 0.7, 1.06) var(--delay), opacity var(--speed2) ease-in-out var(--delay) !important;
}

.start-grid-col:nth-child(1) .grid-item:nth-child(6n-4) .grid-item-inner {
	transition : transform var(--speed3) cubic-bezier(0.49, 0.65, 0.73, 0.85) var(--delay), opacity var(--speed1) ease-out var(--delay) !important;
}

.start-grid-col:nth-child(1) .grid-item:nth-child(6n-5) .grid-item-inner {
	transition : transform var(--speed1) cubic-bezier(0.49, 0.15, 0.73, 0.92) var(--delay), opacity var(--speed1) ease-out var(--delay) !important;
}

.start-grid-col:nth-child(2) .grid-item:nth-child(6n-2) .grid-item-inner {
	transition : transform var(--speed4) cubic-bezier(0.66, -0.13, 0.7, 1.06) var(--delay), opacity var(--speed2) ease-in-out var(--delay) !important;
}

.start-grid-col:nth-child(2) .grid-item:nth-child(6n-3) .grid-item-inner {
	transition : transform var(--speed1) cubic-bezier(0.49, 0.65, 0.73, 0.85) var(--delay), opacity var(--speed1) ease-out var(--delay) !important;
}

.start-grid-col:nth-child(2) .grid-item:nth-child(6n-4) .grid-item-inner {
	transition : transform var(--speed3) cubic-bezier(0.15, 0.13, 0.7, 0.92) var(--delay), opacity var(--speed0) ease-out var(--delay) !important;
}

.start-grid-col:nth-child(2) .grid-item:nth-child(6n-5) .grid-item-inner {
	transition : transform var(--speed1) cubic-bezier(0.77, 0.85, 0.63, 1) var(--delay), opacity var(--speed3) ease-in-out var(--delay) !important;
}

.start-grid-col:nth-child(4) .grid-item:nth-child(6n-2) .grid-item-inner {
	transition : transform var(--speed3) cubic-bezier(0.49, 0.65, 0.73, 0.85) var(--delay), opacity var(--speed1) ease-out var(--delay) !important;
}

.start-grid-col:nth-child(4) .grid-item:nth-child(6n-3) .grid-item-inner {
	transition : transform var(--speed1) cubic-bezier(0.66, -0.13, 0.7, 1.06) var(--delay), opacity var(--speed2) ease-in-out var(--delay) !important;
}

.start-grid-col:nth-child(4) .grid-item:nth-child(6n-4) .grid-item-inner {
	transition : transform var(--speed3) cubic-bezier(0.77, 0.85, 0.63, 1) var(--delay), opacity var(--speed3) ease-in-out var(--delay) !important;
}

.start-grid-col:nth-child(4) .grid-item:nth-child(6n-5) .grid-item-inner {
	transition : transform var(--speed1) cubic-bezier(0.15, 0.13, 0.7, 0.92) var(--delay), opacity var(--speed0) ease-out var(--delay) !important;
}


.start-grid .grid-item-img-link {
	position                    : absolute;
	inset                       : 5px;
	display                     : block;
	text-decoration             : none;
	text-transform              : uppercase;
	font-weight                 : 300;
	font-size                   : 22px;
	line-height                 : 1.125;
	-webkit-tap-highlight-color : rgba(0, 0, 0, 0);
	transition                  : opacity 0.5s cubic-bezier(0.08, 0.5, 0.64, 1.13);
	overflow                    : hidden;
	z-index                     : 10;
	opacity                     : 0;
}

.nav-opener.nav-close {
	opacity : 0;
	left    : calc(-1 * max(35px, 2.2vw)) !important;
}

.nav-homepage {
	width           : max(35px, 2.2vw);
	pointer-events  : auto;
	cursor          : pointer;
	transform       : translateX(100%);
	display         : flex;
	justify-content : center;
	align-items     : center;
	margin-bottom   : 10px;
}

header#header.nav-active .nav-opener.nav-close {
	opacity : 1;
}

.nav-opener svg {
	vertical-align : middle;
}

header#header {
	position : fixed !important;
}

.nav-active {
	position : unset !important;
	overflow : unset !important;
}

@media all and (max-width : 1023px) {
	.nav-homepage {
		transform : translateX(0);
	}
}

.home a.nav-homepage {
	display : none;
}


.open-close.active .opener-holder a svg {
	transform : scale(-1);
}

html {
	scroll-behavior : smooth;
}

.section-places .swiper-images, .section-gallery .swiper-images {
	position : relative;
	margin   : 0 0 17px;
}

.section-places .swiper-main .text-holder, .section-gallery .swiper-main .text-holder {
	width : 100%;
}

.section-places .swiper-main .text-holder h3, .section-gallery .swiper-main .text-holder h3 {
	font-size   : 44px;
	line-height : 48px;
	margin      : 0 0 15px;
}

.section-places .swiper-main .text-holder p, .section-gallery .swiper-main .text-holder p {
	font-size   : max(22px, 1.56vw);
	line-height : max(26px, 1.60vw);
	margin      : 0 0 30px;
}

.section-places table, .section-gallery table {
	font-size   : max(22px, 1.56vw);
	line-height : max(26px, 1.60vw);
	margin      : 0 0 15px;
}

@media screen and (max-width : 991px) {
	.section-places .swiper-main .text-holder h3, .section-gallery .swiper-main .text-holder h3 {
		font-size   : 37px;
		line-height : 38px;
		margin      : 0 0 15px;
	}

	.section-places .swiper-main .text-holder p, .section-gallery .swiper-main .text-holder p {
		margin : 0 0 15px;
	}
}

#HIMPRESSUM, #HDatenschutzerklE4rung {
	display : none;
}

.cc-animate.cc-revoke.cc-bottom {
	font-size : 22px;
}


.desc-text {
	margin      : 0 !important;
	line-height : 1.425;
	width       : calc(100% - max(30px, 13vw));
}

.section-desc h2, .section-contact h2, .section-places h2 {
	margin-left : unset !important;
}

@media (min-width : 768px) {
	.section-desc h2 {
		margin-left   : max(30px, 13vw) !important;
		margin-bottom : max(50px, 8.44vw);
	}

	.section-contact h2 {
		margin : 0 0 0.6em max(30px, 8vw) !important;
	}

	.section-places h2 {
		margin : 0 0 max(25px, 4.15vw) max(30px, 12.5vw) !important;
	}


	.desc-text {
		margin : 0 0 0 auto !important;
	}
}


@media (max-width : 768px) {
	.swiper-slide table, .swiper-slide thead, .swiper-slide tbody, .swiper-slide th, .swiper-slide td, .swiper-slide tr {
		display : block;
		width   : 100%;
	}

	.swiper-slide thead {
		display : none; /* Hide table header */
	}

	.swiper-slide tr {
		margin-bottom : 10px;
		border        : none;
		padding       : 10px 10px 10px 0;
	}

	.swiper-slide td {
		display         : flex;
		justify-content : space-between;
		align-items     : center;
		position        : relative;
		width           : auto !important;
		flex-wrap       : wrap;
		padding         : 10px 10px 10px 0 !important;
		border-bottom   : 1px solid #CCCCCC;
	}

	.swiper-slide td:last-child {
		border-bottom : none;
	}

	/* Show labels using before pseudo-element */
	.swiper-slide td:before {
		content      : attr(data-label);
		font-weight  : 350;
		font-family  : "Cardo", "Times New Roman", "Georgia", "Garamond", serif;
		border-width : 0 0 1px;
		border-color : #707070;
		line-height  : 1;
		margin-right : 10px;
		width        : 100%;
	}
}

.socialicons {
	margin-top      : 25px;
	display         : flex;
	justify-content : start;
	align-items     : center;
	gap             : 20px;
}

.socialicons .socialicon {
	max-width : 50px;
	width     : 100%;
	height    : auto;
}

@media (min-width : 1280px) {
	.menu {
		margin-inline : -3vw 40px !important;
	}

	.menu li {
		margin-inline : 3vw !important;
	}
}