/*
Theme Name: Delphi by Tino
*/
@font-face {
font-family: 'Frutiger';
src: url('fonts/FrutigerLTStd-Black.eot?#iefix') format('embedded-opentype'),
url('fonts/FrutigerLTStd-Black.otf') format('opentype'),
url('fonts/FrutigerLTStd-Black.woff') format('woff'),
url('fonts/FrutigerLTStd-Black.ttf') format('truetype'),
url('fonts/FrutigerLTStd-Black.svg#FrutigerLTStd-Black') format('svg');
font-weight: 900;
font-style: normal;
}
@font-face {
font-family: 'Frutiger';
src: url('fonts/FrutigerLTStd-LightCn.eot?#iefix') format('embedded-opentype'),
url('fonts/FrutigerLTStd-LightCn.otf') format('opentype'),
url('fonts/FrutigerLTStd-LightCn.woff') format('woff'),
url('fonts/FrutigerLTStd-LightCn.ttf') format('truetype'), url('FrutigerLTStd-LightCn.svg#FrutigerLTStd-LightCn') format('svg');
font-weight: 100;
font-style: normal;
}
@font-face {
font-family: 'Frutiger';
src: url('fonts/FrutigerLTStd-Bold.eot?#iefix') format('embedded-opentype'),
url('fonts/FrutigerLTStd-Bold.otf') format('opentype'),
url('fonts/FrutigerLTStd-Bold.woff') format('woff'),
url('fonts/FrutigerLTStd-Bold.ttf') format('truetype'),
url('fonts/FrutigerLTStd-Bold.svg#FrutigerLTStd-Bold') format('svg');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'Frutiger';
src: url('fonts/FrutigerLTStd-Italic.eot?#iefix') format('embedded-opentype'),
url('fonts/FrutigerLTStd-Italic.otf') format('opentype'),
url('fonts/FrutigerLTStd-Italic.woff') format('woff'),
url('fonts/FrutigerLTStd-Italic.ttf') format('truetype'),
url('fonts/FrutigerLTStd-Italic.svg#FrutigerLTStd-Italic') format('svg');
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: 'Frutiger';
src: url('fonts/FrutigerLTStd-Roman.eot?#iefix') format('embedded-opentype'),
url('fonts/FrutigerLTStd-Roman.otf') format('opentype'),
url('fonts/FrutigerLTStd-Roman.woff') format('woff'),
url('fonts/FrutigerLTStd-Roman.ttf') format('truetype'),
url('fonts/FrutigerLTStd-Roman.svg#FrutigerLTStd-Roman') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Frutiger';
src: url('fonts/FrutigerLTStd-Light.eot?#iefix') format('embedded-opentype'),
url('fonts/FrutigerLTStd-Light.otf') format('opentype'),
url('fonts/FrutigerLTStd-Light.woff') format('woff'),
url('fonts/FrutigerLTStd-Light.ttf') format('truetype'),
url('fonts/FrutigerLTStd-Light.svg#FrutigerLTStd-Light') format('svg');
font-weight: 200;
font-style: normal;
}
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video,
input,
textarea,
button {
-ms-box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.container {
width: 100%;
max-width: 1260px;
margin: 0 auto;
padding: 0px 20px;
}
p {
line-height: 1.5em;
}
b,
strong {
font-weight: bold;
}
a {
text-decoration: underline;
color: #ef8429;
}
a:active,
a:hover,
a:focus {
outline: 0;
text-decoration: none;
color: #ef8429;
}
img {
display: block;
max-width: 100%;
border: 0;
margin-bottom: 20px;
height: auto;
}
ul {
line-height: 25px;
font-weight: normal;
}
h1,
h2,
h3,
h4,
h5,
h6 {
margin-bottom: 20px;
font-weight: 900;
}
h2 {
font-size: 25px;
}
h3 {
font-size: 21px;
}
h4 {
font-size: 18px;
margin-bottom: 10px;
}
button {
overflow: visible;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
opacity: 1;
color: #0e3a44;
}
input:hover,
input:focus,
textarea:hover,
input[type="text"]:hover,
input[type="email"]:hover,
textarea:active,
input[type="text"]:active,
input[type="email"]:active,
textarea:focus input[type="text"]:focus,
input[type="email"]:focus,
button:focus,
button:active,
button:hover {
outline: 0;
box-shadow: none;
}
label {
width: 70px;
}
.login-username label {
width: auto;
}
.login-remember label {
width: auto;
}
input {
width: 100%;
border: none;
background: #e4ebed;
padding: 15px;
}
input[type=checkbox],
input[type=radio] {
width: auto;
}
select:focus,
select:active,
select:hover {
outline: 0;
box-shadow: none;
}
#mc_embed_signup .response {
background: none !important;
padding: 0 !important;
font-size: 12px;
font-weight: 200 !important;
margin-bottom: 10px;
}
#mc_embed_signup div.mce_inline_error {
color: red !important;
background: none !important;
padding: 0 !important;
font-size: 12px;
font-weight: 200 !important;
}
#mc_embed_signup input.mce_inline_error,
#mc_embed_signup input.valid {
margin-bottom: 5px;
}
#mce-success-response {
margin-bottom: 15px !important;
color: green !important;
}
.btn {
background: #0e3a44;
border-radius: 0px;
outline: none;
width: 100%;
color: #fff;
margin-bottom: 20px;
text-decoration: none;
transition: all 300ms;
padding: 15px;
}
.btn:hover {
background: #e4ebed;
color: #0e3a44;
}
.box-wrapper {
width: 100%;
max-width: var(--max-w);
margin: 0 auto;
background: #fff;
padding: 20px;
}
body {
margin: 0px;
font-family: "Frutiger";
font-weight: normal;
line-height: 1em;
background-image: url('images/background_img.jpg');
background-repeat: no-repeat;
position: relative;
background-attachment: fixed;
background-position: top center;
padding-top: 60px;
padding-bottom: 150px;
color: #0e3a44;
font-size: 15px;
}
.align-right {
text-align: right;
}
/*************************header_css***************************/
header {
padding-top: 20px;
}
.custom_logo a {
display: inline-block;
float: left;
margin-bottom: 20px;
}
header .language_opt ul li a {
font-weight: normal;
font-size: 16px;
color: #000;
}
header .language_opt ul li {
list-style-type: none;
display: inline-block;
border-right: 2px solid #0e3a44;
line-height: 15px;
padding-right: 6px;
}
header .language_opt ul li:last-child {
border: none;
padding-right: 0px;
padding-left: 6px;
}
header .language_opt ul li a {
color: #000;
padding: 0px;
text-decoration: none;
}
header .language_opt ul li a.active {
color: #000;
}
header .language_opt ul li a {
color: #0e3a44;
}
header .language_opt ul li a:hover {
color: #ef8429
}
header .language_opt ul.navbar-nav {
display: inline-block;
margin-top: 2px;
}
header .language_opt,
header .social_icon {
text-align: right;
padding-right: 3px;
display: inline-block;
margin-top: 35px;
}
.wpml-ls-legacy-list-vertical {
display: block;
border: none;
}
header .social_icon ul {
display: inline-block;
margin-top: 4px;
margin-bottom: 12px;
}
header .social_icon ul li {
list-style-type: none;
display: inline-block;
margin-right: 6px;
}
header .social_icon ul li:last-child {
margin-right: 0px;
}
.social_icon a[target=_blank]:after {
content: initial;
}
header .social_icon ul li a {
color: #0e3a44;
font-size: 16px;
}
header .social_icon ul li a i:hover {
color: #ef8429;
}
header nav.navbar.navbar-expand-md {
background: transparent !important;
padding: 0px;
width: 100%;
}
.collapse {
display: none;
}
.main-menu-container {
width: 100%;
}
.menu-mobilemenu-container ul,
.menu-mobilemenuen-container ul {
padding: 0px;
}
.menu-mobilemenu-container ul li,
.menu-mobilemenuen-container ul li {
list-style-type: none;
border-bottom: 1px solid #f1f1f1;
padding-bottom: 5px;
margin-bottom: 5px;
}
.menu-mobilemenu-container ul li a,
.menu-mobilemenuen-container ul li a {
color: #0e3a44;
text-decoration: none;
font-weight: 900;
font-size: 19px;
}
.navbar-expand-md .navbar-toggler {
display: none;
}
header nav.navbar li.nav-item a {
color: #0e3a44;
display: block;
font-size: 20px;
font-weight: bold;
padding: 10px 40px;
text-decoration: none;
background: #e4ebed;
}
header nav.navbar ul.navbar-nav li.nav-item {
position: relative;
width: 25%;
text-align: center;
}
header nav.navbar ul.navbar-nav li.nav-item ul li {
width: 100%;
text-align: center;
}
.menu-topmenu-container,
.menu-topmenuen-container {
width: 100%;
text-align: right;
}
.menu-topmenu-container ul,
.menu-topmenuen-container ul {
display: inline-block;
}
.menu-topmenu-container ul li:first-child,
.menu-topmenuen-container ul li:first-child {
border-left: none;
}
.menu-topmenu-container ul li,
.menu-topmenuen-container ul li {
list-style-type: none;
float: left;
margin-left: 10px;
border-left: 1px solid;
line-height: 15px;
padding-left: 10px;
}
.menu-topmenu-container ul li a,
.menu-topmenuen-container ul li a {
color: #0e3a44;
font-size: 16px;
text-decoration: none;
}
.menu-topmenu-container ul li.current-menu-item a,
.menu-topmenuen-container ul li.current-menu-item a {
font-weight: bold;
text-decoration: none;
color: #ef8429;
}
.navbar-expand-md .navbar-nav li.nav-item:hover .dropdown-menu a.dropdown-item {
border: 0px;
}
header nav.navbar .navbar-nav>li.nav-item a {
transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
}
header nav.navbar .navbar-nav>li.nav-item:hover a,
header nav.navbar .navbar-nav>li.nav-item.active a {
background: #0e3a44;
color: #e4ebed;
}
header nav.navbar li.nav-item:last-child {
border-right: 0px;
}
.navbar-toggler-icon {
display: block;
width: 15px;
margin-bottom: 4px;
height: 2px;
background: #fff !important;
}
.navbar-toggler-icon:last-child {
margin-bottom: 0px;
}
button.navbar-toggler {
background: #000;
border-radius: 0px;
height: 30px;
}
.mobile_social_icon {
display: none;
}
.navbar-expand-md .navbar-nav .dropdown-menu {
border-radius: 0px;
border: 0px;
background: #0e3a44;
width: 100%;
top: 102%;
text-align: center;
}
.dropdown-item.active,
.dropdown-item:active {
background-color: #ccc;
}
.navbar-expand-md .navbar-nav .dropdown-menu {
margin: 0px;
}
.navbar-expand-md .navbar-nav .dropdown-menu a.dropdown-item {
font-size: 16px;
color: #ffffff;
padding: 8px 15px 8px !important;
}
.navbar-expand-md .navbar-nav .dropdown-menu a.dropdown-item:hover,
.navbar-expand-md .navbar-nav .dropdown-menu .current_page_item a {
padding-left: 20px !important;
}
.dropdown:hover>.dropdown-menu {
display: block;
}
.dropdown>.dropdown-toggle:active {
pointer-events: none;
}
.dropdown-toggle::after {
display: none;
}
/**********************info_Section_css****************/
section.info_Section {
padding-top: 58px;
}
.info_Section .img-bild h6 {
color: #0e3a44;
font-size: 16px;
font-weight: bold;
position: absolute;
top: -35px;
padding: 11px 0px;
z-index: 9999;
}
.info_Section h6 strong {
font-weight: 900;
color: #fff;
letter-spacing: 0.5px;
}
.info_Section .img-text {
position: absolute;
right: 0px;
bottom: 0px;
color: #fff;
left: 0px;
padding: 10px;
background: rgba(76, 76, 76, 0);
background: -moz-linear-gradient(top, rgba(76, 76, 76, 0) 0%, rgba(0, 0, 0, 1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(76, 76, 76, 0)), color-stop(100%, rgba(0, 0, 0, 1)));
background: -webkit-linear-gradient(top, rgba(76, 76, 76, 0) 0%, rgba(0, 0, 0, 1) 100%);
background: -o-linear-gradient(top, rgba(76, 76, 76, 0) 0%, rgba(0, 0, 0, 1) 100%);
background: -ms-linear-gradient(top, rgba(76, 76, 76, 0) 0%, rgba(0, 0, 0, 1) 100%);
background: linear-gradient(to bottom, rgba(76, 76, 76, 0) 0%, rgba(0, 0, 0, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4c4c4c', endColorstr='#000000', GradientType=0);
}
.info_Section .img_box1,
.info_Section .img_box2 {
position: relative;
}
.info_Section .img_box1 .img-text h3 {
font-size: 24px;
margin-bottom: 3px;
}
.info_Section .img-text h3 {
font-size: 16px;
font-weight: bold;
font-weight: normal;
transition: all 300ms;
}
.info_Section .img-text h3:hover {
padding-left: 5px;
}
.info_Section .img-text h5 {
text-align: right;
font-size: 15px;
}
.info_Section .img_box1 .img-text h5 {
font-size: 17px;
font-weight: 100;
}
.info_Section .img_box2 h3 {
color: #f5f5f5;
margin-bottom: 0px;
}
.info_Section .img_box2 h5 {
color: #b3b3b3;
text-align: left;
margin-top: 6px;
margin-bottom: 12px;
letter-spacing: -0.5px;
}
h2:before {
display: none;
}
.info_Section .box-text h2,
.info_Section .box-text2 h3 {
font-size: 24px;
font-weight: bold;
color: #fff;
line-height: 45px;
}
.info_Section .box-text2 h3 {
color: #000;
font-size: 24px;
line-height: 27px;
}
.info_Section .box-text2 h3 span {
border-bottom: 1px solid #000;
}
.info_Section .box-text {
background: #000;
padding: 20px;
margin-top: 38px;
clear: both;
overflow: hidden;
min-height: 380px;
position: relative;
}
.info_Section .box-text2 a.btn {
bottom: 20px;
position: absolute;
right: 20px;
}
.info_Section .box-text a.btn {
background: #fff;
color: #000;
border-radius: 0px;
font-size: 15px;
letter-spacing: 3px;
text-transform: uppercase;
font-weight: 100;
margin-top: 21px;
padding: 7px 55px;
float: right;
position: relative;
transform: perspective(1px) translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
-webkit-transition-property: color;
transition-property: color;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
position: absolute;
bottom: 20px;
right: 20px;
text-decoration: none;
}
.info_Section .box-text a.btn:hover {
color: #fff;
}
.info_Section .box-text a.btn::before {
position: absolute;
z-index: -1;
content: "";
top: 0;
left: 0;
right: 0;
bottom: 0;
background: #000;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%;
-webkit-transition-property: transform;
transition-property: transform;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
color: #fff;
}
.info_Section .box-text a.btn:hover::before {
transform: scaleX(1);
}
.info_Section .box-text2 {
background: #fff;
border: 2px solid #000;
padding: 20px;
margin-top: 38px;
clear: both;
overflow: hidden;
min-height: 380px;
position: relative;
}
.right_sidebar ul {
list-style-type: none;
}
.right_sidebar .newletter .button input {
padding: 10px 20px;
border-radius: 0px;
background: #000;
letter-spacing: 2.6px;
color: #fff;
font-size: 13px;
font-weight: 100;
transition: all 0.7s ease-in-out;
border: 1px solid #000;
}
.right_sidebar .newletter .button input:hover,
.contact-form .button input:hover {
background: #fff;
color: #000;
box-shadow: 300px 0 0 0 rgba(255, 255, 255, 1) inset;
transition: all 0.7s ease-in-out;
border: 1px solid #000;
}
.contact-form .button input {
padding-bottom: 0px;
border: 1px solid #000;
}
.right_sidebar .ticket_section a.btn {
text-transform: none;
}
.info_Section .box-text2 a.btn::before,
.contact-form .btn::before,
.right_sidebar .approach_section a.btn::before,
.right_sidebar .ticket_section a.btn::before {
position: absolute;
z-index: -1;
content: "";
top: 0;
left: 0;
right: 0;
bottom: 0;
background: #fff;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%;
-webkit-transition-property: transform;
transition-property: transform;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
color: #000 !important;
}
.info_Section a.btn:hover,
.contact_Section a.btn:hover,
.contact-form .btn:hover,
.right_sidebar .newletter .button:hover {
color: #0e3a44;
}
.info_Section .box-text2 a.btn:hover::before,
.contact-form .btn:hover::before,
.right_sidebar .approach_section a.btn:hover::before,
.right_sidebar .ticket_section a.btn:hover::before,
.right_sidebar .newletter .button:hover::before {
transform: scaleX(1);
}
.info_Section .card {
padding: 0px;
border: none;
}
.info_Section .left_info .card h6 {
font-size: 24px;
font-weight: bold;
color: #000;
padding: 0px;
margin-top: 10px;
}
.right_sidebar h2 {
font-size: 24px;
font-weight: 600;
color: #0e3a44;
text-transform: uppercase;
margin-bottom: 20px;
line-height: 1em;
}
.right_sidebar .ticket_section h2 {
margin-bottom: 20px;
line-height: 1em;
}
.right_sidebar p {
margin-bottom: 20px;
line-height: 1.5em;
}
.right_sidebar .ticket_section p {
margin-bottom: 22px;
}
.right_sidebar .newletter input::-webkit-input-placeholder {
color: #0e3a44;
font-size: 14px;
font-style: italic;
font-weight: normal;
}
.right_sidebar .newletter .button,
.contact-form .button {
padding: 0px;
background: transparent;
margin-top: 30px;
}
.contact-form .button {
margin-top: 0px;
max-width: 160px;
}
.right_sidebar .newletter input,
.contact-form .button input,
{
border: none;
border-bottom: 1px solid #000;
padding-bottom: 2px;
width: 100%;
font-weight: 100;
padding-left: 0;
}
.right_sidebar .newletter input:focus {
outline: none;
}
.newletter form input {
width: 100%;
border: none;
text-align: center;
margin-bottom: 20px;
}
.newletter form input[type="submit"],
.approach_section .btn {
margin-bottom: 0px;
}
.right_sidebar .newletter a.btn {
padding: 9px 46px;
margin-top: 30px;
width: 100%;
}
.contact-form .button input {
padding-top: 0px;
line-height: 40px;
border-radius: 0px;
background: #000;
padding-bottom: 0px;
font-weight: 100;
font-size: 13px;
letter-spacing: 3px;
padding-right: 0px;
height: 40px;
transition: all 0.7s ease-in-out;
border: 1px solid #000;
}
.right_sidebar {
float: right;
width: 100%;
margin-top: -7px;
}
.right_sidebar .approach_section h5 {
font-weight: bold;
font-size: 13px;
line-height: 20px;
text-transform: none;
margin-bottom: 5px;
margin-top: 20px;
}
.right_sidebar .approach_section p {
margin-bottom: 10px;
}
.logo_text {
display: inline-block;
padding-left: 22px;
float: left;
margin-top: 9px;
}
.logo_text h3 {
font-size: 34px;
color: #0e3a44;
font-weight: bold;
margin-bottom: 0px;
text-transform: uppercase;
}
.logo_text span {
font-weight: 100;
font-size: 16px;
color: #9d9d9d;
margin-bottom: 0px;
display: block;
}
.logo_text span:last-child {
margin-bottom: 0px;
}
.right_sidebar .approach_second h5 {
text-transform: none;
}
.press_Section a.press-btn {
text-transform: none;
padding: 9px 20px;
margin-top: 46px;
border: 1px solid #000;
display: inline-block;
background: #000;
color: #Fff;
font-size: 13px;
font-weight: 100;
letter-spacing: 2.6px;
position: relative;
transform: perspective(1px) translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
-webkit-transition-property: color;
transition-property: color;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
}
.press_Section a.press-btn::before {
position: absolute;
z-index: -1;
content: "";
top: 0;
left: 0;
right: 0;
bottom: 0;
background: #fff;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: 0 50%;
transform-origin: 0 50%;
-webkit-transition-property: transform;
transition-property: transform;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
color: #000 !important;
}
.press_Section a.press-btn:hover::before {
transform: scaleX(1);
}
.press_Section a.press-btn:hover {
color: #000;
}
.right_sidebar .ticket_section a.btn {
width: 100%;
padding: 9px 40px;
}
.right_sidebar .approach_section img {
display: inline-flex;
}
.right_sidebar .ticket_section,
.right_sidebar .newletter,
.right_sidebar .approach_section {
border-bottom: 1px solid #e4ebed;
padding-bottom: 30px;
margin-bottom: 30px;
}
.approach_first img {
margin-top: 3px;
}
.approach_section img {
margin-bottom: 0px;
}
.right_sidebar .approach_section p span {
display: inline-flex;
}
.right_sidebar .partner-image {
text-align: right;
}
.right_sidebar .partner-image img {
display: inline-block;
width: 150px;
}
.right_sidebar .berlin-image img {
margin-bottom: 0px;
}
.right_sidebar .approach_section img {
margin: -2px 7px 0 0;
}
.row.light-bg {
margin: 0px;
padding: 20px 5px;
background: #f1f1f1;
}
.post-details h6 {
font-size: 17px;
font-weight: bold;
}
.post-details h6 a {
color: #0e3a44;
text-decoration: none;
}
.post-details .news_link_btn {
background: transparent;
color: #ef8429;
border: 1px solid #ef8429;
padding: 10px;
transition: all .5s ease;
}
.post-details .news_link_btn:hover {
background: #ef8429;
color: #fff !important;
}
.image-box br {
display: none;
}
.image-box a {
margin-bottom: 20px;
display: inline-block;
}
.image-box img {
max-width: 200px;
margin-bottom: 5px;
}
.image-box img.logo {
width: 80px;
}
/************contact_Section_css****************/
.contact_Section,
.comman_section {
width: 100%;
padding-top: 60px;
clear: both;
overflow: hidden;
padding-bottom: 99px;
position: relative;
z-index: 999;
}
h2.title {
font-size: 30px;
font-weight: 900;
position: relative;
margin-bottom: 35px;
}
.team-section {
padding-left: 0px;
padding-right: 0px;
}
.contact_Section .contact-detail h3 {
font-size: 20px;
line-height: 18px;
color: #000;
font-weight: 900;
margin-top: 53px;
margin-bottom: 12px;
}
h3.subtitle,
.press_Section h4 {
font-size: 14px;
line-height: 20px;
color: #000;
font-weight: 900;
}
.contact_Section .contact-detail span {
font-weight: 100;
font-size: 16px;
color: #000;
/*text-transform:capitalize;*/
margin-bottom: 5px;
display: block;
}
.contact_Section .contact-detail p {
font-weight: 100;
font-size: 15px;
line-height: 22px;
color: #000;
margin-top: 20px;
margin-bottom: 0px;
width: 100%;
max-width: 426px;
}
.contact_Section .contact-detail p span {
color: #808080;
text-decoration: underline;
text-decoration-color: #808080;
display: inline-block;
}
.contact_Section .contact-detail ul {
padding-left: 0px;
margin-top: 30px;
}
.contact_Section .contact-detail ul li {
list-style-type: none;
line-height: 20px;
}
.contact_Section .contact-detail ul li strong {
font-size: 16px;
line-height: 18px;
color: #000;
font-weight: bold;
}
.contact_Section .contact-detail ul li a {
font-weight: 100;
color: #000;
font-size: 16px;
}
.contact_Section .contact-detail ul li a.mail {
text-decoration: underline;
margin-left: 10px;
}
.contact_Section .team-section h2 {
margin-bottom: 53px;
}
.contact_Section .team-section {
margin-top: 40px;
}
.contact_Section .contact-detail ul li:last-child {
margin-top: 2px;
}
.contact-form {
padding-top: 55px;
padding-left: 20px;
}
.contact-form .form-group .form-control {
border-radius: 0px;
border-color: #888888;
height: 40px;
font-size: 14px;
line-height: 40px;
}
span.wpcf7-not-valid-tip {
font-size: 12px;
}
div.wpcf7-response-output {
font-size: 12px;
border: 0px;
padding: 0;
margin: 0;
margin-top: 20px;
color: #ff0000;
}
div.wpcf7-response-output.wpcf7-mail-sent-ok {
color: #398f14;
}
.contact-form .btn {
border-radius: 0px;
background: #000;
color: #fff;
letter-spacing: 3px;
font-weight: 100;
font-size: 13px;
line-height: 36px;
padding: 0px 36px;
transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
}
.contact-form .form-group {
margin-bottom: 11px;
}
.contact-form .form-group input::placeholder,
.contact-form .form-group textarea::placeholder,
.contact-form .checkbox span {
font-weight: 100;
font-size: 14px;
line-height: 22px;
color: #0e3a44;
}
.contact-form .form-group textarea.form-control {
height: 140px;
resize: none;
}
.contact-form form .checkbox span {
color: #000;
margin-left: 0px;
}
.contact-form .checkbox label input[type=checkbox] {
-webkit-appearance: none;
}
.checkbox label input[type=checkbox]+.wpcf7-list-item-label label {
width: 11px;
height: 11px;
background-color: #fff;
border: 1px solid #888888;
position: relative;
top: 9px;
left: -4px;
}
.contact-form .checkbox p {
margin-top: 0px;
}
.checkbox label input[type=checkbox]:checked+.wpcf7-list-item-label label {
background-image: url("images/tick.png");
background-position: center center;
background-repeat: no-repeat;
background-size: 7px auto;
}
.form-control:focus {
box-shadow: none;
}
header nav.navbar. ul.navbar-nav li.menu-item {
position: relative;
background-color: #fafafa;
border-right: 1px solid #efefef;
transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
}
header nav.navbar. ul.navbar-nav li.menu-item>a {
color: #000;
font-size: 18px;
font-weight: bold;
font-weight: normal;
padding: 3px 47px 4px !important;
border: 2px solid #000;
transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
}
.info_Section .img_box2 {
margin-bottom: 58px;
}
.info_Section .img_box2:last-child {
margin-bottom: 0px;
}
.info_Section .post-info .img_box2 {
margin-bottom: 35px !important;
}
.info_Section .post-info .img_box2 img {
width: 100%;
}
.info_Section .post-info .box-text,
.info_Section .post-info .box-text2 {
margin-top: 0px;
}
.contact_Section .contact-detail ul.impressum li {
font-size: 15px;
line-height: 22px;
color: #888888;
font-weight: bold;
}
.contact_Section .contact-detail ul.impressum li a {
margin-bottom: 20px;
text-decoration: underline;
display: inline-block;
color: #888888;
margin-top: 5px;
}
.info_Section .left_info .col-md-8 {
flex: 0 0 68.666667%;
max-width: 68.666667%;
}
.info_Section .left_info .col-md-4 {
flex: 0 0 31.333333%;
max-width: 33.333333%;
}
/*********************team-page-csss**************/
.team ul li {
list-style-type: none;
line-height: 23px;
}
.team ul {
padding-left: 0px;
}
.team ul li strong {
font-size: 15px;
line-height: 18px;
color: #000;
font-weight: bold;
}
.team ul li a.mail {
text-decoration: underline;
}
.team h3.subtitle {
margin-top: 14px;
margin-bottom: 5px;
}
.team p {
font-size: 15px;
letter-spacing: 2px;
color: #666;
margin-bottom: 10px;
font-weight: 300;
}
.team ul li a {
font-weight: 100;
color: #000;
font-size: 15px;
}
.team h6 {
font-size: 15px;
color: #fff;
letter-spacing: 0.5px;
font-weight: 900;
position: absolute;
top: -18px;
background: #000;
padding: 11px 27px;
z-index: 99999;
}
.team {
position: relative;
margin-bottom: 54px;
}
.team_Section h2.title {
margin-bottom: 85px;
}
/*****************profile-page-css**************/
.Profile_Section.events_section .profile_img img {
width: 50%;
}
.Profile_Section.events_section h1 {
border-bottom: 1px solid #a9a9a9;
padding-bottom: 28px;
margin-bottom: 0px;
margin-top: 22px;
}
.Profile_Section.events_section h3 {
margin-bottom: 18px;
}
.Profile_Section.events_section h4 {
font-size: 20px;
line-height: 22px;
margin-bottom: 5px;
font-weight: normal;
}
.program_Section .form-class h1 {
font-size: 18px;
margin-bottom: 20px;
}
.program_Section .form-class {
padding-left: 27px;
}
.program_Section .form-class p {
margin-top: 0px;
}
.program_Section form select {
min-width: 268px;
height: 38px;
background-color: #fff;
font-size: 16px;
line-height: 38px;
padding-left: 10px;
border: none;
border: 1px solid #e1e1e1;
margin-left: 10px;
-webkit-appearance: none;
background-image: url(images/down_arrow.png);
background-repeat: no-repeat;
background-position: 96%;
}
.program_Section form {
position: relative;
width: 350px;
}
.program_Section form::after {
content: "";
position: absolute;
right: 50px;
top: 0px;
width: 1px;
height: 38px;
background-color: #e1e1e1;
}
.program_Section .calender_box {
max-width: 512px !important;
float: left;
background-color: #000;
padding: 30px;
margin-top: 30px;
}
.program_Section .calender_box .bold {
font-weight: bold;
}
.program_Section .singlebox.calender_box {
max-width: 300px !important;
}
.Profile_Section h2.title {
margin-bottom: 66px;
}
h2.title.two-line {
line-height: 34px;
}
h2.title.two-line::after {
top: 82px;
}
.Profile_Section .row {
margin-bottom: 80px;
}
.Profile_Section .row:last-child {
margin-bottom: 0px;
}
.single_event p {
font-size: 15px;
font-weight: normal;
color: #809ba3;
margin-bottom: 35px;
}
.img-bild {
background-size: cover;
background-repeat: no-repeat;
background-position: center;
transition: transform 300ms;
-moz-transition: transform 300ms;
-ms-transition: transform 300ms;
-o-transition: transform 300ms;
-webkit-transition: transform 300ms;
}
.img-bild:hover {
transform: scale(1.01);
}
.info_Section .post-info .img_box2 {
margin-bottom: 46px !important;
}
/****************geschichte-page-css******************/
.geschichte_Section .geschicht-detail-right {
margin-top: 30px;
}
.geschichte_Section .sliders {
margin-top: 65px;
width: 100%;
max-width: 570px;
}
.geschichte_Section .sliders button.slick-next.slick-arrow,
.geschichte_Section .sliders button.slick-prev.slick-arrow {
position: absolute;
background-color: rgba(0, 0, 0, 0.6);
}
.geschichte_Section .sliders .slick-slide img {
width: 100%;
}
.geschichte_Section .sliders button.slick-next.slick-arrow {
background-image: url("images/right_Arrow.png");
background-repeat: no-repeat;
background-position: 60% center;
text-indent: 30px;
width: 30px;
right: 0px;
padding: 0px;
height: 80px;
z-index: 99999;
top: 50%;
transform: translateY(-50%);
}
.geschichte_Section .sliders button.slick-prev.slick-arrow {
z-index: 99999;
background-image: url("images/left_Arrow.png");
background-repeat: no-repeat;
background-position: 60% center;
text-indent: -130px;
width: 30px;
left: 0px;
padding: 0px;
height: 80px;
top: 50%;
transform: translateY(-50%);
margin-top: -18px;
}
.geschichte_Section .sliders ul.slick-dots li button {
border-radius: 50%;
padding: 4px;
width: 11px;
height: 11px;
margin-right: 8px;
background-color: #a9a9a9;
}
.geschichte_Section .sliders ul.slick-dots li.slick-active button {
background-color: #000000;
}
.geschichte_Section .sliders ul.slick-dots {
text-align: center;
padding-left: 0px;
margin-top: -12px;
margin-bottom: 0px;
}
.geschichte_Section .sliders ul.slick-dots li {
display: inline-block;
}
/*****************eintrittskarten-page-css******/
.eintrittskarten_section .ein_text {
margin-top: 48px;
}
.eintrittskarten_section .ein_info h3 {
font-size: 20px;
line-height: 18px;
color: #000;
font-weight: 900;
margin-bottom: 12px;
}
.eintrittskarten_section .get-info {
margin-top: 30px;
}
.eintrittskarten_section .ein_info {
margin-top: 71px;
margin-bottom: 44px;
}
.eintrittskarten_section .ein_info p {
margin-bottom: 11px;
max-width: 658px;
}
.eintrittskarten_section .get_touchinfo {
max-width: 530px;
}
.eintrittskarten_section .get_touchinfo ul li strong,
.eintrittskarten_section .get-info h5 {
font-size: 15px;
line-height: 22px;
color: #000;
margin-bottom: 0px;
font-weight: bold;
}
.eintrittskarten_section .get-info p {
margin-top: 5px;
}
.eintrittskarten_section .get-info p:last-child {
margin-bottom: 0px;
}
.eintrittskarten_section .get_touchinfo ul {
padding-left: 0px;
list-style-type: none;
margin-bottom: 5px;
}
.eintrittskarten_section .get_touchinfo ul li a {
color: #808080;
font-weight: 100;
font-size: 15px;
}
.eintrittskarten_section .get_touchinfo ul li a.mail {
text-decoration: underline;
text-decoration-color: #808080;
}
.eintrittskarten_section .get_touchinfo ul li {
line-height: 29px;
}
.eintrittskarten_section ul.impressum li {
font-size: 15px;
line-height: 22px;
color: #888888;
font-weight: bold;
}
.eintrittskarten_section ul.impressum li strong {
color: #000;
line-height: 18px;
}
.eintrittskarten_section ul.impressum {
list-style-type: none;
padding-left: 0px;
margin-top: 56px;
margin-bottom: 0px;
}
.eintrittskarten_section ul.impressum li a {
margin-bottom: 20px;
text-decoration: underline;
display: inline-block;
color: #888888;
margin-top: 5px;
font-weight: 100;
}
/***************presse-css*********************/
.press_Section h3 {
font-size: 26px;
font-weight: bold;
font-weight: normal;
color: #000;
line-height: 18px;
text-transform: capitalize;
margin-top: 53px;
margin-bottom: 29px;
}
.press_Section h3.first_heading {
margin-top: 75px;
}
.press_Section p,
.press_Section ul li {
color: #000000;
font-weight: 100;
font-size: 13px;
line-height: 19px;
}
.press_Section h4 {
margin-top: 16px;
word-break: break-word;
}
.press_Section ul {
list-style-type: none;
padding-left: 0px;
}
.press_Section ul li a {
color: #808080;
text-decoration: underline;
}
.press_Section .presse p {
margin-bottom: 10px;
}
.press_Section .presse ul li img {
display: inline-block;
padding-right: 10px;
}
.press_Section .presse ul li {
line-height: 27px;
}
.press_Section .col-md-12 .col-md-4 {
padding: 0px 20px;
}
.press_Section .col-md-12 .row {
margin: 0px -20px;
}
.press_Section .presse>img {
width: 100%;
}
.press_Section .presse-info h3 {
font-size: 24px;
font-weight: 900;
font-weight: normal;
color: #fff;
line-height: 27px;
margin-top: 0px;
margin-bottom: 8px;
line-height: 26px;
}
.press_Section .presse-info {
background-color: #000;
/*margin-top: 53px;*/
padding: 38px 21px;
padding-bottom: 14px;
max-width: 312px;
float: right;
}
.press_Section .presse-info h4 {
font-size: 20px;
line-height: 25px;
color: #fff;
font-weight: bold;
}
.press_Section .presse-info ul {
padding-left: 0px;
}
.press_Section .presse-info ul li {
color: #fff;
font-size: 15px;
}
.press_Section .presse-info ul li a {
color: #fff;
}
/***************program-page-css************/
.prodMerkmal_box {
padding: 15px 0;
color: #ef8429;
font-size: 18px;
font-weight: bold;
}
.kategorie_box {
padding: 0 0 15px 0;
font-size: 18px;
}
.single_event h2.title {
margin-bottom: 5px;
font-size: 29px;
}
.program_Section table.program_table {
margin: 0 0 60px 0;
border-collapse: initial;
width: 100%;
border-spacing: 0px;
}
.program_Section table.program_table tr:nth-child(odd) {
background: #e4ebed;
}
.program_Section table.program_table tr:last-child {
border-bottom: 0px;
}
.program_Section table.program_table tr td h3 {
font-size: 24px;
line-height: 1em;
font-weight: 400;
margin-bottom: 9px;
border-bottom: 1px solid;
padding-bottom: 8px;
}
.program_Section table.program_table tr td h3 big {
font-weight: 900;
font-size: 35px;
}
.program_Section table.program_table tr td p {
margin-bottom: 0px;
}
.program_Section table.program_table tr td h3.eventTitel {
font-weight: 900;
font-size: 25px;
margin-bottom: 0px;
border: none;
}
.program_Section table.program_table td {
border: none;
}
.program_Section table.program_table tr td:nth-child(1) {
width: 20%;
}
.program_Section table.program_table tr td:nth-child(2) {
width: 65%;
}
.program_Section table.program_table tr td {
padding: 15px;
vertical-align: top;
}
.program_Section table.program_table tr td:nth-child(3) {
width: 50%;
}
.program_Section table.program_table tr td p.teaserText {
line-height: 1.5em;
margin-top: 12px;
}
.program_Section h1 {
font-size: 28px;
text-transform: capitalize;
margin-top: 35px;
margin-bottom: 30px;
}
.program_Section table.program_table tr td:last-child {
font-size: 13px;
width: 15%;
text-align: right;
}
.program_Section table.program_table tr td h3.eventTitel a {
color: #0e3a44;
text-decoration: none;
}
.program_Section table.program_table tr td h3.eventTitel a:hover {
color: #ef8429;
}
a.ticket-link {
font-size: 17px;
text-decoration: none;
}
.program_Section h2.month {
font-size: 24px;
margin-bottom: 10px;
font-weight: 400;
}
.program_Section h1::before {
display: none;
}
.program_Section p.aright {
font-size: 18px;
}
.kein-ticket-link {
font-size: 12px;
text-transform: uppercase;
font-weight: 900;
display: block;
}
.program_Section .col-md-12 .container {
padding: 0px;
}
.program_Section img {
display: inline-block;
}
.program_Section table.program_table_schmal {
border: 0px;
margin: 0 0 0 0;
width: 100%;
}
.program_Section table.program_table_schmal tr {
border-bottom: 1px solid #e4ebed;
}
.program_Section table.program_table_schmal tr td {
padding: 15px 0;
vertical-align: bottom;
border: none;
}
.program_Section table.program_table_schmal tr td h3 {
font-size: 22px;
line-height: 1em;
font-weight: 900;
margin-bottom: 0;
}
.program_Section table.program_table_schmal tr td p {
font-size: 15px;
line-height: 24px;
margin-bottom: 0px;
}
.program_Section table.program_table_schmal tr td:nth-child(1) {
width: 50%;
}
.program_Section table.program_table_schmal tr td:last-child {
width: 50%;
text-align: right;
}
.program_Section table.program_table tr td p.eventMerkmalText {
font-size: 14px;
color: #ef8429;
margin-top: 7px;
}
.program_Section table.program_table tr td p.stabText {
font-size: 16px;
font-weight: 200;
}
.program_Section table.program_table tr td p.merkmaleText {
font-size: 14px;
color: #809ba3;
font-weight: 200;
font-style: italic;
}
.top_box,
.info_box,
.akteur_box,
.socialmedia_box,
.prodCredits_box,
.presse_box {
padding: 15px 0;
border-bottom: 1px solid #e4ebed;
}
.info_box {
font-weight: bold;
}
.akteur_box p,
.prodCredits_box p {
padding-bottom: 0px;
margin-bottom: 0px;
}
.preis_box {
font-size: 15px;
margin-bottom: 5px;
}
.classicCard_box {
padding: 15px 0px;
background: #fff;
text-align: center;
}
.classicCard_box img {
width: 60%;
margin-bottom: 0px;
border: none;
}
.mehrBilder {
margin-bottom: 20px;
}
.mehrBilder .zusBild img {
display: inline-block;
margin: 5px 0
}
.pdfText {}
.pdfTitel {}
.videoFeld {}
.videoFrame {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
margin-bottom: 20px;
}
.videoFrame iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.festivalText {
font-size: 18px;
}
.festivalTitel {
font-weight: bold;
}
.preisInfoText {
font-size: 80%;
}
.socialmediaText {
list-style-type: none;
margin: 0px;
padding: 0;
}
.socialmediaText i {
font-size: 25px;
vertical-align: middle;
width: 30px;
}
.socialmediaText li {
margin-bottom: 10px;
}
.socialMediaLink {
margin: 5px 0px;
border-radius: 4px;
font-size: 14px;
}
.presseStimmenFeld {
padding: 20px;
margin-bottom: 20px;
background-color: #eee;
border: 1px solid #ccc;
display: none;
}
.pressePdfFeld {
padding: 20px;
border: 1px dashed #ccc;
}
.pressePdfFeld p {
margin-bottom: 0px;
}
.pressePdfFeld a {
outline: 0;
text-decoration: none;
}
.presseAutor {
margin-top: 20px;
font-weight: bold;
margin-bottom: 5px;
}
.presseBildHinweis {
margin-bottom: 5px;
}
.presseProdFeld h3 {
font-size: 26px;
text-transform: uppercase;
}
.presseProdFeld h3 a {
color: #0e3a44;
text-decoration: none;
}
.presseProdFeld h3 a i {
font-size: 16px;
color: #00a1c5;
}
.presseProdFeld h3 a:hover {
color: #eeb601;
}
.presseEinleitung {
margin-bottom: 60px;
}
.presseProdFeld {
margin-bottom: 60px;
border-bottom: 1px solid #ccc;
padding-bottom: 40px;
}
.presseProdFeld h3 {
margin-bottom: 0px;
}
.presseEnsembleFeld p {
margin-bottom: 0px;
}
.presseBilder:after {
content: " ";
display: block;
clear: both;
}
.presseBildRahmen {
vertical-align: top;
margin-bottom: 20px;
width: 47%;
float: left;
margin-right: 6%;
}
.presseBildRahmen:nth-child(even) {
margin-right: 0%;
}
.presseBild {
background-position: center;
background-size: cover;
overflow: hidden;
margin-bottom: 5px;
}
.contact-box {
border-bottom: 1px solid #ccc;
padding: 0 0 15px 0;
margin-bottom: 20px;
}
.contact-box a {
font-size: 12px;
}
.contact-box ul {
padding: 0px;
margin-bottom: 0;
}
.contact-box i {
padding-right: 5px;
}
.sponsorText {
text-align: left;
padding-top: 30px;
height: 125px;
}
.sponsorText img {
display: inline-block;
margin: 0 20px;
height: 100%;
width: auto;
}
.button,
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
transition: background 150ms ease-in-out;
border: none;
border-radius: 0px;
box-sizing: border-box;
color: #fff;
line-height: 1em;
outline: none;
text-decoration: none;
vertical-align: bottom;
margin-bottom: 12px;
cursor: pointer;
}
.button:hover {
background: #0e3a44;
}
/* Rental page */
.rental-groups {
margin-top: 50px;
}
.rental-group {
margin-bottom: 100px;
}
.rental-group:last-child {
margin-bottom: 0px;
}
.rental-group-title {
font-weight: 900;
font-size: 24px;
color: #0e3a44;
margin: 0px;
}
.rental-group-subtitle {
font-weight: 100;
font-size: 11px;
padding: 5px 15px;
color: #ffffff;
background: #0e3a44;
margin: 10px 0px 0px;
display: inline-block;
letter-spacing: 0.2em;
transition: 0.3s;
cursor: pointer;
}
.rental-group-subtitle.loading span {
position: relative;
}
.rental-group-subtitle.loading span:after {
content: "";
width: 8px;
height: 8px;
top: 2px;
right: -10px;
border-radius: 10px;
border-left: 2px solid #fff;
display: block;
position: absolute;
-webkit-animation: rotateThankLoad 0.25s infinite cubic-bezier(0, 0, 1, 1);
-moz-animation: rotateThankLoad 0.25s infinite cubic-bezier(0, 0, 1, 1);
animation: rotateThankLoad 0.25s infinite cubic-bezier(0, 0, 1, 1);
}
.rental-group-subtitle:hover {
opacity: 0.7;
}
.rental-group-files {
margin-top: 30px;
}
.rental-group-file {
margin-bottom: 25px;
}
.rental-group-file:nth-last-child(1),
.rental-group-file:nth-last-child(2),
.rental-group-file:nth-last-child(3) {
margin-bottom: 0px;
}
.rental-group-file-preview {
height: 170px;
overflow: hidden;
position: relative;
cursor: pointer;
display: block;
}
.rental-group-file-preview:after {
content: "";
background: url(images/rental-zoom.png) no-repeat center rgba(0, 0, 0, 0.8);
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
opacity: 0;
transition: 0.3s;
}
.rental-group-file-preview:hover:after {
opacity: 1;
}
.rental-group-file-preview img {
min-height: 100%;
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
transition: 0.3s;
object-fit: cover;
min-width: 100%;
}
.rental-group-file-title {
font-size: 14px;
font-weight: bold;
line-height: 20px;
margin: 10px 0px 5px;
}
.rental-group-file-download {
position: relative;
display: inline-block;
padding: 0px 0px 0px 20px;
color: #0e3a44;
font-size: 13px;
line-height: 17px;
text-decoration: none;
transition: 0.3s;
}
.rental-group-file-download:before {
content: "";
position: absolute;
display: block;
left: 0px;
top: 0px;
width: 15px;
height: 100%;
}
.image-box a:before,
.downloadBildLink:before {
background: url(images/rental-download-jpeg.png) no-repeat center left;
content: "";
display: inline-block;
width: 15px;
height: 15px;
margin-right: 5px;
margin-top: 5px;
}
.rental-group-file-image .rental-group-file-download:before {
background: url(images/rental-download-jpeg.png) no-repeat center left;
}
.rental-group-file-application .rental-group-file-download:before {
background: url(images/rental-download-pdf.png) no-repeat center left;
}
.rental-download-all {
height: 40px;
width: 100%;
margin: 20px 0px 0px;
background: #0e3a44;
/* text-transform: uppercase; */
letter-spacing: 0;
font-weight: 400;
cursor: pointer;
padding: 0px;
transition: 0.3s;
}
.rental-download-all span {
position: relative;
display: inline-block;
}
.rental-download-all:hover,
.rental-download-all.loading {
opacity: 0.7;
}
.rental-download-all.loading span:after {
content: "";
width: 16px;
height: 16px;
top: -2px;
right: -25px;
border-radius: 10px;
border-left: 2px solid #fff;
display: block;
position: absolute;
-webkit-animation: rotateThankLoad 0.25s infinite cubic-bezier(0, 0, 1, 1);
-moz-animation: rotateThankLoad 0.25s infinite cubic-bezier(0, 0, 1, 1);
animation: rotateThankLoad 0.25s infinite cubic-bezier(0, 0, 1, 1);
}
@-webkit-keyframes rotateThankLoad {
0% {
transform: rotate(360deg);
-moz-transform: rotate(360deg);
}
}
@keyframes rotateThankLoad {
0% {
transform: rotate(360deg);
-webkit-transform: rotate(360deg);
}
}
@media only screen and (min-width:480px) and (max-width: 767px) {
.rental-group-file.col-4 {
max-width: 50%;
flex: 0 0 50%;
}
.rental-group-file:nth-last-child(3) {
margin-bottom: 25px;
}
}
@media only screen and (max-width:480px) {
.rental-group-file.col-4 {
max-width: 100%;
flex: 0 0 100%;
}
.rental-group-file:nth-last-child(2),
.rental-group-file:nth-last-child(3) {
margin-bottom: 25px;
}
}
/* End Rental page */
/*-------*/
/* Lightbox on default pages */
.dszoom {
display: block;
overflow: hidden;
position: relative;
}
.dszoom:after {
content: "";
background: url(images/rental-zoom.png) no-repeat center rgba(0, 0, 0, 0.6);
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
opacity: 0;
transition: 0.3s;
}
.dszoom:hover:after {
opacity: 1;
}
.dszoom img {
margin: 0px;
}
/* End Lightbox on default pages */
/*****************responsive********************/
@media only screen and (max-width:1180px) {
.info_Section .box-text2 h3 {
font-size: 20px;
line-height: 20px;
}
.info_Section .box-text h2 {
font-size: 25px;
}
.info_Section .box-text2 p {
margin-bottom: 6px;
}
.info_Section .img-text h5 {
font-size: 13px;
}
.container {
padding: 0px 15px;
}
.contact-form {
padding-left: 0px;
}
}
@media only screen and (max-width:1024px) {
header .social_icon ul {
margin-top: 6px;
margin-bottom: 0px;
}
header .top-section .row {
padding-bottom: 14px;
display: block;
}
header .custom-logo img {
display: block;
width: 600px;
border: 0;
margin-bottom: 20px;
height: auto;
}
.menu-mobilemenu-container,
#collapsibleNavbar {
width: 100%;
}
.menu-topmenu-container ul,
.menu-topmenuen-container ul,
.main-menu-container {
display: none;
}
.navbar-expand-md .navbar-toggler {
display: block;
}
.navbar {
position: static;
}
section.info_Section {
padding-top: 60px;
}
.info_Section .box-text h2 {
font-size: 20px;
line-height: 30px;
}
.info_Section .box-text {
padding-top: 20px;
padding-left: 30px;
padding-bottom: 12px;
padding-right: 12px;
}
.info_Section .box-text a.btn {
margin-top: 16px;
padding: 7px 34px;
}
.info_Section .box-text2 h3 {
font-size: 16px;
line-height: 18px;
}
.info_Section .box-text2 {
padding: 10px 12px 12px 14px
}
.info_Section .box-text2,
.info_Section .box-text {
margin-top: 29px;
}
.info_Section .card {
margin-top: 32px;
}
.info_Section .left_info .card h6,
.info_Section .left_info .card p {
font-size: 10px;
line-height: 14px;
}
.info_Section .left_info .card h6 {
letter-spacing: -0.2px;
}
.info_Section .left_info {
padding-bottom: 14px;
}
.right_sidebar .approach_section,
.right_sidebar .ticket_section {
padding-top: 0px;
}
.right_sidebar h2 {
font-size: 20px;
margin-bottom: 8px
}
.right_sidebar .newletter input::-webkit-input-placeholder {
font-size: 11px;
}
.right_sidebar .newletter p,
.right_sidebar .ticket_section p {
margin-bottom: 14px;
}
.right_sidebar .newletter a.btn {
margin-bottom: 19px;
margin-top: 20px;
}
.right_sidebar .approach_section h5 {
margin-top: 4px;
}
.right_sidebar .approach_section a.btn {
margin-top: 14px;
padding: 6px 10px;
}
body {
padding: 0px;
background-size: initial !important;
background-attachment: scroll !important;
}
.right_sidebar .approach_section img {
width: 12px;
margin-bottom: 0px;
}
.info_Section .img_box2 {
margin-bottom: 42px;
}
.right_sidebar .newletter input {
width: 100%;
}
.contact_Section .contact-form {
margin-bottom: 40px;
}
.press_Section h4 {
font-size: 28px;
}
.team h3.subtitle {
font-size: 20px;
}
section.info_Section .post-details {
padding-bottom: 40px;
}
header nav.navbar.navbar-expand-md.bg-light {
border: none;
}
.navbar-toggler-icon {
display: block;
width: 25px;
margin-bottom: 3px;
height: 4px;
border-radius: 2px;
background: #0e3a44 !important;
}
button.navbar-toggler {
background: transparent;
position: absolute;
right: 0px;
top: 105px;
}
.custom_logo a {
display: inline-block;
float: left;
margin-bottom: 20px;
}
.mobile_social_icon {
float: right;
}
.mobile_social_icon .language_opt ul.navbar-nav {
display: inline-block;
}
.mobile_social_icon .language_opt ul li {
list-style-type: none;
display: inline-block;
border-right: 2px solid #d4d4d4;
line-height: 14px;
padding-right: 6px;
font-size: 14px;
}
.mobile_social_icon .language_opt ul li a.active,
.mobile_social_icon .language_opt ul li a:hover {
color: #878787;
}
.mobile_social_icon .language_opt ul li a {
color: #0e3a44;
padding-top: 0px;
padding-bottom: 0px;
}
.mobile_social_icon .language_opt,
.mobile_social_icon .social_icon {
text-align: left;
display: inline-block;
}
.mobile_social_icon {
display: block;
padding: 14px 0px 10px 0px;
width: 100%;
text-align: right;
border-bottom: 1px solid #e4ebed;
margin-bottom: 20px;
}
.mobile_social_icon .social_icon ul li {
list-style-type: none;
display: inline-block;
margin-right: 5px;
font-size: 14px;
}
.mobile_social_icon .social_icon ul li:last-child {
margin-right: 0px;
}
.mobile_social_icon .social_icon ul li a {
color: #000;
}
.mobile_social_icon .social_icon ul {
padding-left: 12px;
margin-bottom: 0px;
}
.top-section .language_opt,
.top-section .social_icon {
display: none;
}
.mobile_social_icon .social_icon ul li a i:hover {
color: #878787;
}
.mobile_social_icon .language_opt ul li:last-child {
padding-right: 15px;
}
.mobile_social_icon .social_icon {
line-height: 0px;
}
header {
padding-top: 8px;
position: relative;
border-bottom: 1px solid #e4ebed;
}
section.info_Section {
padding-top: 38px;
}
header nav.navbar li.nav-item a {
font-size: 15px;
padding: 12px 30px !important;
}
.navbar ul.navbar-nav li.nav-item {
border: 2px solid #efefef;
margin-bottom: 6px;
}
.program_Section h2.title {
font-size: 28px;
}
}
@media only screen and (max-width:880px) {
.right_sidebar .approach_section a.btn {
width: 100%;
}
.Profile_Section .col-md-6 {
flex: 0 0 100% !important;
max-width: 100% !important;
}
.eintrittskarten_section .get_touchinfo p,
.eintrittskarten_section .get-info p {
font-size: 13px;
}
.press_Section h4 {
font-size: 25px;
}
.press_Section .presse ul li {
line-height: 22px;
}
.press_Section .presse-info {
padding: 38px 14px;
}
.program_Section .eventHeader p {
font-size:15px !important;
}
.program_Section table.program_table tr td p {
font-size: 15px;
}
.program_Section table.program_table tr td h3 {
margin-top: 10px;
}
.Profile_Section.events_section .profile_img img {
width: 70%;
}
}
@media only screen and (max-width:767px) {
.box-wrapper {
padding: 5px;
}
button.navbar-toggler {
top: 35px;
}
.right_sidebar .partner-image {
padding-left: 0px;
padding-right: 0px;
}
.Profile_Section.events_section .profile_img img {
width: 100%;
}
.info_Section .left_info .col-md-8 {
flex: 0 0 100%;
max-width: 100%;
}
.press_Section h3.first_heading {
margin-top: 60px;
}
.press_Section h4 {
font-size: 21px;
}
.press_Section .presse {
margin-bottom: 30px;
}
.press_Section h3,
.press_Section .presse-info {
margin-top: 25px;
}
.press_Section .presse-info {
margin-bottom: 50px;
}
.press_Section .presse-info {
padding: 38px 21px;
}
.info_Section .img_box2 {
margin-bottom: 58px;
}
.eintrittskarten_section .get_touchinfo {
border-right: 0px;
border-bottom: 1px solid #dddddd;
padding-right: 0px;
padding-bottom: 30px;
max-width: 100%;
}
.eintrittskarten_section ul.impressum {
margin-top: 30px;
margin-bottom: 15px;
}
.right_sidebar form .btn {
width: 212px;
}
.eintrittskarten_section .get_touchinfo p,
.eintrittskarten_section .get-info p {
font-size: 15px;
}
.info_Section img {
width: 100%;
}
.info_Section .left_info .col-sm-4 {
flex: 0 0 100%;
max-width: 100%;
}
.geschichte_Section .geschicht-detail-right {
margin-top: 0px;
margin-bottom: 40px;
}
.geschichte_Section .geschicht-detail-left {
margin-bottom: 0px;
}
.info_Section .img_box2:last-child {
margin-right: 0px;
}
.info_Section .img_box2 h3 {
font-size: 24px;
}
.program_Section .calender_box {
margin-bottom: 50px;
}
.info_Section .img_box2 h5 {
margin-bottom: 2px;
}
.info_Section .box-text h2 {
font-size: 21px;
}
.info_Section .box-text {
padding-top: 26px;
padding-bottom: 14px;
margin-top: -15px;
padding-right: 14px;
}
.info_Section .box-text a.btn {
margin-top: 32px;
}
.info_Section .box-text2 {
margin-top: 28px;
}
.info_Section .box-text2 {
padding: 15px 14px 14px 15px;
margin-bottom: 18px;
}
.info_Section .box-text2 h3 {
line-height: 19px;
}
.info_Section .box-text2 p {
margin-top: 12px;
width: 100%;
font-size: 11px;
}
.info_Section .card {
margin-top: 28px;
}
.info_Section .left_info .card h6 {
font-size: 15px;
line-height: 20px;
margin-bottom: 5px;
}
.info_Section .left_info .card p {
font-size: 12px;
line-height: 16px;
margin-bottom: 0px;
letter-spacing: 0.8px;
}
.right_sidebar .approach_section,
.right_sidebar .newletter,
.right_sidebar .ticket_section {
width: 100%;
display: block;
}
.right_sidebar .newletter a.btn,
.right_sidebar .ticket_section a.btn,
.right_sidebar .approach_section a.btn {
width: auto;
display: inline-block;
}
.info_Section .left_info {
padding-bottom: 38px;
}
.right_sidebar {
padding-top: 38px;
display: block;
margin: 0px 0px;
width: 100%;
}
.right_sidebar .newletter input {
font-size: 14px;
width: 212px;
display: block;
}
.right_sidebar .newletter a.btn {
font-size: 15px;
}
.right_sidebar h2 {
font-size: 26px;
margin-bottom: 4px;
}
.right_sidebar .approach_section h2 {
margin-bottom: 8px;
}
.right_sidebar .approach_section h5,
.right_sidebar .ticket_section p {
font-size: 14px;
}
.right_sidebar .approach_section span,
.right_sidebar .newletter {
margin-left: 0px;
}
.right_sidebar .approach_section p {
font-size: 13px;
line-height: 20px;
}
.right_sidebar .newletter input::-webkit-input-placeholder {
font-size: 14px;
}
.right_sidebar .ticket_section {
padding-top: 28px;
}
.right_sidebar .approach_section img {
width: 18px;
}
.right_sidebar .approach_section a.btn,
.right_sidebar .ticket_section a.btn {
padding: 6px 24px;
}
.right_sidebar .approach_section p span {
padding-left: 6px;
}
.right_sidebar {
padding-bottom: 45px;
}
.right_sidebar .ticket_section h2 {
margin-bottom: 12px;
}
.right_sidebar .ticket_section p {
margin-bottom: 19px;
}
header {
clear: both;
overflow: hidden;
}
header .top-section .row {
padding-bottom: 4px;
}
.navbar ul.navbar-nav li.nav-item.active {
border-color: #000;
border-width: 1px;
}
header nav.navbar li.nav-item a {
border-right: none;
}
header nav.navbar li.nav-item.active:before {
opacity: 1;
border-width: 1px;
}
header nav.navbar li.nav-item:last-child {
border-right: 2px solid #efefef;
}
*:focus {
outline: none;
}
button.navbar-toggler:focus {
outline: none;
}
.navbar-expand-md .navbar-nav .dropdown-menu {
width: 100%;
}
.contact_Section .contact-form {
margin-bottom: -1px;
}
.contact_Section,
.comman_section {
padding-top: 45px;
padding-bottom: 0px;
}
.team_Section .col-sm-4 {
flex: 0 0 100%;
max-width: 100%;
}
.team_Section .col-sm-4 .team img {
width: 100%;
}
/* .info_Section .post-info .box-text2{
margin-top:50px;
}*/
.post-details .img_box1 {
margin-bottom: 38px;
}
.post-details .img_box2.col-sm-6 {
margin-top: 0px;
}
section.info_Section .post-details {
padding-bottom: 14px;
}
.program_Section table.program_table tr td:nth-child(3) p {
max-width: 100%;
}
.program_Section table.program_table tr td {
display: block;
width: 100% !important;
}
.program_Section table.program_table tr:last-child td {
padding-bottom: 15px;
}
.eintrittskarten_section .ein_info p {
max-width: 100%;
}
.team-section .col-sm-4 {
-webkit-box-flex: 0;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.team {
margin-bottom: 0px;
}
.Profile_Section .row {
margin-bottom: 10px;
}
.right_sidebar .ticket_section a.btn {
width: 212px;
}
.right_sidebar .berlin-image img {
width: 212px;
padding-left: 0px;
}
.top-section .col-sm-6.col-xl-6:first-child {
flex: 0 0 80%;
max-width: 80%;
}
.logo_text h3 {
font-size: 16px;
}
.logo_text span {
font-size: 14px;
}
.logo_text {
margin-top: 1px;
}
h2.title.two-line {
font-size: 24px;
line-height: 28px;
}
button.navbar-toggler {
top: 19px;
}
.custom_logo img {
max-width: 80%;
}
div.mobile-text {
display: none;
}
.row.light-bg {
margin: 0px -15px 0 -15px;
padding: 0px;
background: none;
}
.productionText {
border-bottom: 1px solid #ccc;
}
}
@media only screen and (max-width:580px) {
.right_sidebar .approach_section h5 {
font-size: 10px;
}
h2.title.two-line {
font-size: 20px;
line-height: 24px;
}
.geschichte_Section .sliders button.slick-prev.slick-arrow,
.geschichte_Section .sliders button.slick-next.slick-arrow {
height: 42px;
top: 43%;
width: 20px;
transform: translateY(-43%);
}
.info_Section .left_info .col-sm-4 a {
display: block;
width: 100%;
}
.info_Section .left_info .col-sm-6 {
flex: 0 0 100%;
max-width: 100%;
}
.info_Section .post-info .box-text2 {
margin-top: 30px;
}
.press_Section .presse-info {
float: left;
}
.program_Section form {
width: 262px;
}
.program_Section form select {
min-width: 177px;
}
.program_Section .form-class {
padding-left: 0px;
}
}
@media only screen and (max-width:460px) {
.info_Section .img_box2.col-sm-6 {
flex: 0 0 100% !important;
max-width: 100% !important;
margin-bottom: 0px;
}
.program_Section .calender_box {
max-width: 100% !important;
padding: 20px;
word-break: break-word;
}
.Profile_Section.events_section table.program_table tr:last-child td {
min-width: 234px !important;
padding: 15px;
}
.program_Section .calender_box p {
font-size: 17px;
}
.info_Section .img_box2.col-sm-6:last-child {
margin-bottom: 58px;
}
.Profile_Section.events_section table.program_table tr:last-child p {
font-size: 17px;
}
.approach_first,
.approach_second {
width: 100%;
}
button.navbar-toggler {
top: 16px;
}
.Profile_Section .row:last-child {
margin-bottom: 25px;
}
.geschichte_Section .sliders ul.slick-dots li button {
width: 9px;
height: 9px;
}
.info_Section .left-info .img_box2 {
margin-bottom: 30px !important;
}
.contact_Section h2.contact_title,
h2.title {
font-size: 26px;
}
.program_Section h1 {
font-size: 24px;
}
.program_Section h2 {
font-size: 25px;
}
}
@media only screen and (max-width:380px) {
button.navbar-toggler {
top: 15px;
}
h2.title.two-line::after {
top: 107px;
}
.right_sidebar .approach_section h5 {
font-size: 12px;
}
.info_Section .img_box1 .img-text {
position: absolute;
right: 15px;
}
.info_Section .box-text {
padding-left: 13px;
padding-right: 13px;
}
.info_Section .box-text a.btn {
padding: 7px 40px;
}
.info_Section .box-text h2 {
font-size: 19px;
}
.info_Section .box-text2 h3 {
font-size: 13px;
}
.info_Section .box-text2 p {
margin-bottom: 14px;
}
.info_Section .left_info .card h6 {
font-size: 11px;
line-height: 17px;
}
.geschichte_Section .sliders button.slick-prev.slick-arrow,
.geschichte_Section .sliders button.slick-next.slick-arrow {
top: 36%;
}
.press_Section h4 {
font-size: 18px;
}
.press_Section h3 {
font-size: 21px;
}
.press_Section ul li {
font-size: 12px;
}
.team ul li a,
.team ul li strong {
font-size: 14px;
}
.info_Section .post-info .box-text2 {
margin-top: 38px;
}
.info_Section .post-info .img_box2 {
margin-bottom: 38px !important;
}
.info_Section .left_info {
padding-bottom: 22px;
}
.right_sidebar {
padding-top: 22px;
}
.contact_Section h2.contact_title,
h2.title {
font-size: 24px;
}
.logo_text {
padding-left: 6px;
}
.logo_text h3 {
font-size: 14px;
margin-bottom: 2px;
}
.logo_text span {
font-size: 12px;
}
}
@media only screen and (max-width:320px) {
.program_Section form select {
min-width: 172px;
}
}
/* COOKIE OVERWRITES */
body .klaro .cookie-notice:not(.cookie-modal-notice) {
background-color: #fff;
max-width: none;
width: 100%;
left: 0;
right: 0;
bottom: 0;
border-radius: 0;
font-size: 12px;
}
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body {
padding: 15px 1.5vw;
display: flex;
align-items: flex-end;
align-content: start;
line-height: 25px;
}
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body>span {
display: block;
flex: 0 0 70%;
}
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body>.cn-ok {
margin: 0;
flex: 0 0 30%;
}
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cm-link {
color: #0e3a44;
text-decoration: underline;
}
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-buttons .cm-btn {
padding: 0 8px;
display: inline-flex;
border-radius: 0;
min-height: 27px;
align-items: center;
background-color: #e4ebed;
color: #0e3a44;
margin-bottom: 0;
}
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-buttons button.cm-btn {
margin-top:0;
padding:0.5em;
}
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-buttons .cm-btn.cm-btn-success {
background-color: #0e3a44;
color: #ffffff;
}
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body p {
color: #0e3a44;
font-size: 12px;
margin: 0;
}
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body p a {
color: #0e3a44;
text-decoration: underline;
}
body .klaro .cookie-modal {
width: 100%;
height: 100%;
position: fixed;
overflow: hidden;
z-index: 1000;
display: flex;
align-items: center;
justify-content: center;
align-content: space-around;
padding: 0 2.5vw;
}
body .klaro .cookie-modal .cm-modal {
transform: none;
top: auto;
bottom: 0;
left: 0;
margin: 0;
background-color: #fff;
font-size: 12px;
color: #020202;
}
body .klaro .cookie-modal .cm-modal.cm-klaro {
-moz-transform: translateY(0);
transform: translateY(0);
top:0;
}
body .klaro .cookie-modal .cm-bg {
background-color:rgba(0,0,0,0.75);
}
body .klaro .cookie-modal .cm-modal.cm-klaro {
color:#000913;
background-color:#fff;
padding:20px;
}
body .klaro .cookie-modal .cm-modal .hide svg {
stroke: #020202;
}
body .klaro .cookie-modal .cm-modal .cm-header h1 {
font-size: 22px;
color: #020202;
font-weight: 700;
}
body .klaro .cookie-modal .cm-modal p,
body .klaro .cookie-modal .cm-modal li,
body .klaro .cookie-modal .cm-modal a {
color: inherit;
}
body .klaro .cookie-modal .cm-modal .cm-purpose {
color: #020202;
}
body .klaro .cookie-modal .cm-modal .cm-purpose label {
width: 100%;
margin: 0;
}
body .klaro .cookie-modal .cm-modal .cm-purpose .cm-caret {
color: #020202 !important;
}
body .klaro .cookie-modal .cm-modal .cm-purpose .cm-caret a span {
display: none;
}
body .klaro .cookie-modal .cm-modal .cm-purpose .cm-apps .cm-content {
margin-left: -60px !important;
}
body .klaro .cookie-modal .cm-modal .cm-list-input+.cm-list-label .slider {
background-color: #0e3a44;
}
body .klaro .cookie-modal .cm-modal .cm-list-input:checked+.cm-list-label .slider {
background-color: #43b630;
}
body .klaro .cookie-modal .cm-modal .cm-footer-buttons .cm-btn {
padding: 10px;
display: inline-flex;
border-radius: 0;
margin:0;
align-items: center;
background-color: #e4ebed;
color: #0e3a44;
opacity:0.8;
}
body .klaro .cookie-modal .cm-modal .cm-footer-buttons .cm-btn:hover,
body .klaro .cookie-modal .cm-modal .cm-footer-buttons .cm-btn:focus,
body .klaro .cookie-modal .cm-modal .cm-footer-buttons .cm-btn:active{
opacity: 1;
}
body .klaro .cookie-modal p,
body .klaro .cookie-modal strong,
body .klaro .cookie-modal h1,
body .klaro .cookie-modal h2,
body .klaro .cookie-modal ul,
body .klaro .cookie-modal li,
body .klaro .cookie-notice p,
body .klaro .cookie-notice strong,
body .klaro .cookie-notice h1,
body .klaro .cookie-notice h2,
body .klaro .cookie-notice ul,
body .klaro .cookie-notice li{
color: #020202;
}
body .klaro .cookie-modal .cm-modal .cm-footer-buttons .cm-btn.cm-btn-success {
background-color: #0e3a44;
color: #ffffff;
}
body .klaro .cookie-modal .cm-modal .cm-footer {
padding:20px 0 0 0;
}
.klaro .cookie-modal .cm-modal .cm-powered-by {
display: none;
}
@media screen and (max-width: 992px) {
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body>span {
flex: 0 0 60%;
padding-right: 30px;
}
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body>.cn-ok {
flex: 0 0 40%;
}
}
@media screen and (max-width: 767px) {
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body {
flex-wrap: wrap;
}
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body>span {
flex: 0 0 100%;
padding-right: 0px;
padding-bottom: 20px;
}
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body>.cn-ok {
flex: 0 0 100%;
align-items: center;
justify-content: center;
}
}
.imageBox {
width:100%; height:250px; background-position:top center; background-repeat: no-repeat;
background-size:cover; display:block; margin-bottom:30px;
}
.img_box1.img-bild {
margin-bottom:50px;
}
.hideOnMobile {
display:block;
position: relative;
top: 8px;
}
.showOnMobile {
display:none;
}
/* Program changes */
.program_Section table.program_table tr {
border-bottom:1px solid #cbd6da !important;
display:block; padding:20px 0;
}
.program_Section table.program_table tr:nth-child(2n+1) {
background:none !important;
}
.menucontainer.active {
position: fixed;
top: 0px;
background: #fff;
width: 950px;
z-index: 1000;
left: 50%;
padding:0 19px;
margin-left: -475px;
}
.menucontainer.active header {
border-bottom: 1px solid #e4ebed;
}
.menucontainer.active header .social_icon ul {
padding-left:0;
}
.menucontainer.active .menu-topmenu-container ul, .menucontainer.active .menu-topmenuen-container ul { display:none; }
.menucontainer.active .mobile_social_icon { display:block; }
.menucontainer.active .mobile_social_icon .language_opt, .menucontainer.active .mobile_social_icon .social_icon {
text-align: left;
display: inline-block;
}
.menucontainer.active .mobile_social_icon .language_opt ul.navbar-nav {
display: inline-block;
}
.menucontainer.active .wpml-ls-legacy-list-vertical {
display: block;
border: none;
}
.menucontainer.active .mobile_social_icon .language_opt ul li a {
color: #0e3a44;
padding-top: 0px;
padding-bottom: 0px;
}
.menucontainer.active header {
padding-top:10px;
}
.menucontainer.active header .align-right, .menucontainer.active .main-menu-container {
display:none;
}
.menucontainer.active .navbar-expand-md .navbar-toggler {
display:block;
}
.menucontainer.active .mobile_social_icon {
display: block;
padding: 14px 0px 10px 0px;
width: 100%;
text-align: right;
border-bottom: 1px solid #e4ebed;
margin-bottom: 20px;
}
.menucontainer.active .mobile_social_icon .social_icon ul li {
list-style-type: none;
display: inline-block;
margin-right: 5px;
font-size: 14px;
}
.menucontainer.active .mobile_social_icon .social_icon ul {
padding-left: 12px;
margin-bottom: 0px;
}
.menucontainer.active .mobile_social_icon .social_icon ul li a {
color: #000;
}
.menucontainer.active .mobile_social_icon {
display:none;
}
.menucontainer.active button.navbar-toggler {
background: transparent;
position: absolute;
right: 24px;
top: 18px;
}
.menucontainer.active .navbar-toggler-icon {
display: block;
width: 35px;
margin-bottom: 3px;
height: 6px;
border-radius: 2px;
background: #0e3a44 !important;
}
.menucontainer.active .navbar {
position:static;
}
.menucontainer.active .custom_logo a img {
max-width:330px; margin-bottom:0;
}
.menucontainer.active header .social_icon { margin-top:0; }
.menucontainer.active header {
border-bottom:0;
}
.placeholder.active {
width:100%; height:65px; clear:both;
}
.menucontainer.scrolling {
padding-top:12px;
}
.menucontainer.scrolling button.navbar-toggler {
top:37px;
}
.menucontainer.scrolling .mobile_social_icon {
display:none;
}
.placeholder.scrolling {
width:100%; height:90px; clear:both;
}
/* Mobile fixes */
@media screen and (max-width: 950px) {
.menucontainer {
position: fixed;
top: 0px;
background: #fff;
width: 100%;
z-index: 1000;
left: 0%; right:0;
padding:0 19px;
margin-left: 0;
}
.placeholder {
width:100%; height:160px; clear:both;
}
header .social_icon ul {
padding-left:0; padding-bottom:15px;
}
}
@media screen and (max-width: 768px) {
.program_Section table.program_table tr {
padding:0px 0;
}
.menucontainer.scrolling button.navbar-toggler {
top:20px;
}
.productionText.profil_text {
padding-top:20px;
}
.placeholder {
width:100%; height:140px; clear:both;
}
.hideOnMobile {
display:none;
}
.showOnMobile {
display:flex;
flex-direction: column;
flex-wrap: wrap;
}
.info_Section .img_box1 .img-text {
width:100%;
}
.right_sidebar .approach_section a.btn, .right_sidebar .ticket_section a.btn, .right_sidebar .newletter a.btn {
width:100%; text-align:left; padding:15px;
}
.berlin-image a {
width:100%; background:#ef8429; display:block;
}
.info_Section .post-info .img_box2, .info_Section .post-info .img_box1 {
margin-bottom:65px !important;
}
.mobile_social_icon, .box-wrapper header, .right_sidebar .ticket_section, .right_sidebar .newletter, .right_sidebar .approach_section {
border:none;
}
.social_icon.showOnMobile ul {
padding:0;
}
.right_sidebar .partner-image {
margin-top:15px;
}
.social_icon.showOnMobile a {
color:#0e3a44; font-size:22px;
}
.social_icon.showOnMobile li {
display:inline-block; margin-right:8px;
}
.right_sidebar .approach_section, .right_sidebar .newletter {
margin-bottom:0 !important; padding-bottom:20px !important;
}
.right_sidebar .ticket_section {
padding-top:0; padding-bottom:10px;
}
.right_sidebar {
padding-top:5px;
}
.mobile_social_icon {
margin-bottom:0;
}
.mobile_social_icon .social_icon {
display:none;
}
.mobile_social_icon .language_opt {
}
.mobile_social_icon .language_opt ul li {
border:none;
}
.mobile_social_icon .language_opt ul li:last-child {
padding:0;
}
.mobile_social_icon .language_opt ul li a {
margin-right:-10px;
}
.topmenu {
padding:0; float:left;
}
.topmenu ul {
padding:0; margin:0;
}
.topmenu ul li {
display:inline-block; list-style:none; margin-right:4px;
}
.topmenu ul li:first-child a {
border-right:1px solid #0e3a44; padding-right:10px;
}
.topmenu ul li a {
color:#0e3a44; text-decoration:none;
}
section.info_Section {
padding-top:10px;
}
.custom_logo a {
margin-bottom:10px;
}
.row.light-bg {
margin-bottom:20px;
}
.row.light-bg .leftcol {
padding-right:0;
}
.row.light-bg .rightcol {
padding-left:0; background:#f1f1f1;
display: -webkit-box;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center;
}
.info_Section img {
margin-bottom:0;
}
.post-details h6 {
padding:0 5px 0 25px; margin-bottom:0;
}
.contact_Section, .comman_section {
padding-top:0;
}
h2.title {
margin-bottom:15px;
}
.program_Section table.program_table tr td h3.eventTitel {
margin-top:-20px !important;
}
.preis_box {
margin-bottom:0; margin-top:2px;
}
.program_Section table.program_table tr:nth-child(odd) {
background:none;
}
.program_Section table.program_table tr, .program_Section table.program_table tr:last-child, .program_Section h2.month {
border-bottom:1px solid #cbd6da; display:block;
}
.program_Section h2.month {
padding-bottom:20px;
}
.program_Section table.program_table tr td h3 big, .program_Section table.program_table tr td h3.eventTitel a {
font-weight: 400;
}
.program_Section table.program_table tr td h3 {
border:none;
}
.program_Section table.program_table {
margin:0 0 25px 0;
}
.eventHeader {
width:100%; position:relative;
}
.eventHeader .eventLabel {
position:absolute; top:-5px; right:0; text-transform: uppercase;
max-width:130px; text-align:right; line-height:0.9; height:40px;
display: table;
}
.eventHeader .eventLabel span {
display:table-cell; vertical-align:bottom; line-height: 0.9;
}
.eventHeader .eventMerkmalText {
position:absolute; top:36px; right:0; font-size:18px !important;
}
.social_icon.showOnMobile.topsocial {
margin-top:0; margin-bottom:16px;
}
}
@media screen and (max-width: 500px) {
.placeholder {
width:100%; height:130px; clear:both;
}
}
@media screen and (max-width: 420px) {
.placeholder {
width:100%; height:120px; clear:both;
}
}
@media screen and (max-width: 415px) { /* Iphone 6/7/8 */
.menucontainer.scrolling button.navbar-toggler { top:16px; }
button.navbar-toggler { top:15px; }
}
@media screen and (max-width: 375px) { /* iphoneX*/
.menucontainer.scrolling button.navbar-toggler { top:13px; }
button.navbar-toggler { top:13px; }
}
@media screen and (max-width: 340px) {
.menucontainer.scrolling button.navbar-toggler, button.navbar-toggler { top:7px; }
}
#test-para p {
margin-bottom: 0;
line-height: 2em ;
}
@media screen and (max-width: 767px) {
#test-para p {
margin-bottom: 1rem !important;
line-height: 1.5em !important;
}
}
.program_table_schmal .kein-ticket-link {
visibility: hidden !important;
}
/* ==========================================================================
DELPHI β DARK STAGE DESIGN by Tino
Farben, MaΓe und Transitions zentral als Custom Properties
========================================================================== */
:root {
/* Palette */
--gold: #c9a84c;
--gold-light: #e2c87a;
--gold-dim: rgba(201,168,76,.15);
--ink: #0e0e0e;
--paper: #ffffff;
--paper-off: #f7f5f1;
--text: #1a1a1a;
--muted: #5c5c5c;
--subtle: #9a9a9a;
--border: #e0dbd2;
/* Navigation */
--nav-bg: #0e0e0e;
--nav-hover: #1a1a1a;
--nav-text: #c8c8c8;
--nav-border: #2e2e2e;
--nav-deep: #252525;
/* Dark-container text */
--on-dark: #f0ece4;
--on-dark-dim: rgba(232,228,218,.7);
/* Layout */
--card-radius: 6px;
--max-w: 1200px;
/* Motion */
--ease: cubic-bezier(.4,0,.2,1);
--t: 200ms;
}
/* ββ Reset overrides ββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
*, *::before, *::after { box-sizing: border-box; }
/* ββ Body / Page ββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
body {
background-image: url('images/background_img.jpg');
background-attachment: fixed;
background-position: top center;
background-size: cover;
background-color: var(--ink);
background-repeat: no-repeat;
padding-top: 0;
padding-bottom: 100px;
font-size: 16px;
line-height: 1.65;
color: var(--text);
}
/* Dark overlay on the bg image */
body::before {
content: "";
position: fixed;
top: 0; right: 0; bottom: 0; left: 0;
inset: 0; /* modern shorthand */
background: linear-gradient(
180deg,
rgba(10,10,10,.62) 0%,
rgba(10,10,10,.40) 50%,
rgba(10,10,10,.65) 100%
);
pointer-events: none;
z-index: 0;
}
/* ββ Content Card βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.box-wrapper {
position: relative;
z-index: 1;
width: 100%;
max-width: var(--max-w);
margin: 0 auto;
background: var(--paper);
border-radius: 0 0 var(--card-radius) var(--card-radius);
overflow: hidden;
}
/* ββ Typography βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
body, p, li {
color: var(--text);
margin-bottom: .7rem;
font-weight: 400;
}
h1, h2, h3, h4, h5, h6 {
color: var(--ink);
font-weight: 900;
letter-spacing: .01em;
line-height: 1.2;
margin-top: 0;
margin-bottom: .75rem;
}
h2 { font-size: 22px; }
h3 { font-size: 18px; }
a {
color: var(--gold);
text-decoration: none;
transition: color var(--t) var(--ease);
}
a:hover, a:focus { color: var(--gold-light); text-decoration: none; }
/* ββ Menu Container (sticky header wrapper) βββββββββββββββββββββββββββββββββ */
.menucontainer {
position: relative;
z-index: 100;
background: var(--paper);
}
.menucontainer.active {
position: fixed;
top: 0;
left: 50%;
margin-left: calc(var(--max-w) / -2);
width: var(--max-w);
padding: 0 24px;
background: var(--paper);
box-shadow: 0 2px 24px rgba(0,0,0,.18);
border-bottom: 1px solid var(--border);
border-radius: 0 0 var(--card-radius) var(--card-radius);
}
@media screen and (max-width: 980px) {
.menucontainer.active {
left: 0; margin-left: 0; width: 100%;
}
}
.menucontainer.active header { border-bottom: none; }
.menucontainer.active header .align-right,
.menucontainer.active .main-menu-container { display: none; }
.menucontainer.active .navbar-expand-md .navbar-toggler { display: block; }
.menucontainer.active .mobile_social_icon { display: none; }
.menucontainer.active .mobile_social_icon .language_opt,
.menucontainer.active .mobile_social_icon .social_icon { display: inline-block; text-align: left; }
.menucontainer.active .mobile_social_icon .language_opt ul.navbar-nav { display: inline-block; }
.menucontainer.active .wpml-ls-legacy-list-vertical { display: block; border: none; }
.menucontainer.active header { padding-top: 10px; }
.menucontainer.active header .social_icon { margin-top: 0; }
.menucontainer.active .custom_logo a img { max-width: 280px; margin-bottom: 0; }
.menucontainer.active button.navbar-toggler {
background: transparent; position: absolute; right: 20px; top: 14px;
}
.menucontainer.active .navbar-toggler-icon {
display: block; width: 30px; margin-bottom: 4px; height: 3px;
border-radius: 2px; background: var(--ink) !important;
}
.menucontainer.active .navbar { position: static; }
.menucontainer.scrolling { padding-top: 10px; }
.menucontainer.scrolling button.navbar-toggler { top: 30px; }
.menucontainer.scrolling .mobile_social_icon { display: none; }
.placeholder { height: 0 !important; }
.placeholder.active { width: 100%; height: 60px; clear: both; }
.placeholder.scrolling { width: 100%; height: 80px; clear: both; }
/* ββ Header βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
header {
padding: 24px 32px 0;
border-bottom: 1px solid var(--border);
background: var(--paper);
}
.custom_logo a { display: inline-block; float: left; margin-bottom: 16px; }
.custom_logo img { max-height: 72px; height: auto; }
/* Logo text */
.logo_text {
display: inline-block;
padding-left: 18px;
float: left;
margin-top: 6px;
}
.logo_text h3 {
font-size: 28px;
color: var(--ink);
font-weight: 900;
margin-bottom: 0;
text-transform: uppercase;
letter-spacing: .08em;
}
.logo_text span {
font-size: 13px;
font-weight: 400;
color: var(--subtle);
display: block;
letter-spacing: .04em;
}
/* Top-row language + social */
.top-section .row { align-items: center; }
header .language_opt,
header .social_icon {
text-align: right;
display: inline-block;
margin-top: 28px;
padding-right: 4px;
}
header .language_opt ul li a,
header .social_icon ul li a { color: var(--muted); }
header .language_opt ul li a:hover,
header .social_icon ul li a:hover i { color: var(--gold); }
header .language_opt ul li a.active { color: var(--gold); font-weight: 700; }
/* ββ Navigation βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
header nav.navbar.navbar-expand-md {
background: var(--nav-bg) !important;
padding: 0;
border-radius: 0;
border: none;
margin-top: 18px;
}
header nav.navbar ul.navbar-nav li.nav-item {
width: 25%;
text-align: center;
position: relative;
}
header nav.navbar li.nav-item a {
display: block;
background: var(--nav-bg);
color: var(--nav-text);
font-size: 13px;
font-weight: 700;
padding: 16px 20px;
text-transform: uppercase;
letter-spacing: .18em;
border: none;
transition: color var(--t) var(--ease), background var(--t) var(--ease);
position: relative;
}
/* Gold underline on hover/active */
header nav.navbar li.nav-item a::after {
content: "";
position: absolute;
bottom: 0; left: 20%; right: 20%;
height: 2px;
background: var(--gold);
transform: scaleX(0);
transform-origin: center;
transition: transform var(--t) var(--ease);
}
header nav.navbar .navbar-nav > li.nav-item:hover a,
header nav.navbar .navbar-nav > li.nav-item.active a {
background: var(--nav-hover);
color: var(--gold);
}
header nav.navbar .navbar-nav > li.nav-item:hover a::after,
header nav.navbar .navbar-nav > li.nav-item.active a::after {
transform: scaleX(1);
}
/* Dropdown */
.navbar-expand-md .navbar-nav .dropdown-menu {
background: var(--nav-hover);
border: 1px solid var(--nav-border);
border-radius: 0 0 4px 4px;
border-top: 2px solid var(--gold);
margin: 0;
top: 100%;
}
.navbar-expand-md .navbar-nav .dropdown-menu a.dropdown-item {
color: var(--nav-text);
font-size: 13px;
font-weight: 400;
padding: 10px 20px;
letter-spacing: .08em;
transition: color var(--t), background var(--t);
}
.navbar-expand-md .navbar-nav .dropdown-menu a.dropdown-item:hover {
background: var(--nav-deep);
color: var(--gold);
padding-left: 24px;
}
/* Mobile menu */
.menu-mobilemenu-container ul li a,
.menu-mobilemenuen-container ul li a {
color: var(--ink);
font-weight: 700;
font-size: 17px;
}
.mobile_social_icon {
display: none;
padding: 12px 0;
border-bottom: 1px solid var(--border);
margin-bottom: 16px;
}
.navbar-toggler-icon {
display: block; width: 24px;
margin-bottom: 5px; height: 2px;
background: var(--ink) !important;
}
button.navbar-toggler {
background: transparent;
border-radius: 0; height: 30px;
}
/* ββ Main Content Padding βββββββββββββββββββββββββββββββββββββββββββββββββββ */
section.info_Section { padding: 36px 32px 0; }
.contact_Section, .comman_section { padding: 40px 32px 60px; }
/* ββ Info-Section: Bilder βββββββββββββββββββββββββββββββββββββββββββββββββββ */
.info_Section .img_box1,
.info_Section .img_box2 {
position: relative;
overflow: hidden;
}
.info_Section .img_box1:hover .img-bild,
.info_Section .img_box2:hover .img-bild {
transform: scale(1.03);
}
.img-bild {
transition: transform 400ms var(--ease);
}
.info_Section .img-text {
position: absolute;
bottom: 0; left: 0; right: 0;
padding: 20px 16px 14px;
background: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.82) 100%);
color: #fff;
}
.info_Section .img-text h3,
.info_Section .img-text h5 { color: #fff !important; }
.info_Section .img_box1 .img-text h3 { font-size: 22px; }
.info_Section .img-text h3 { font-size: 15px; font-weight: 700; margin-bottom: 2px; transition: padding-left var(--t); }
.info_Section .img-text h3:hover { padding-left: 4px; }
.info_Section .img-text h5 { font-size: 12px; font-weight: 400; opacity: .8; text-align: right; }
.info_Section .img_box2 h5 { color: rgba(255,255,255,.7) !important; }
.info_Section .img_box2 h3 { color: #fff !important; }
/* Gold label over image */
.info_Section .img-bild h6 {
position: absolute;
top: 0; left: 0;
background: var(--gold);
color: var(--ink) !important;
font-size: 11px;
font-weight: 900;
letter-spacing: .15em;
text-transform: uppercase;
padding: 6px 14px;
z-index: 10;
}
/* ββ Info-Section: Text-Boxen βββββββββββββββββββββββββββββββββββββββββββββββ */
.info_Section .box-text {
background: var(--ink);
color: #e0e0e0;
padding: 28px 28px 70px;
min-height: 320px;
position: relative;
border-top: 3px solid var(--gold);
}
.info_Section .box-text h1,
.info_Section .box-text h2,
.info_Section .box-text h3,
.info_Section .box-text h4,
.info_Section .box-text h5,
.info_Section .box-text h6,
.info_Section .box-text span,
.info_Section .box-text strong { color: var(--on-dark) !important; }
.info_Section .box-text h2 { font-size: 24px; line-height: 1.35; color: var(--on-dark) !important; }
.info_Section .box-text p { color: #b0aba3 !important; line-height: 1.6; }
.info_Section .box-text a.btn {
position: absolute !important;
bottom: 24px; right: 24px;
display: inline-block;
background: var(--gold);
color: var(--ink) !important;
border: none;
border-radius: 0;
font-size: 11px;
font-weight: 900;
text-transform: uppercase;
letter-spacing: .22em;
padding: 11px 28px;
transition: background var(--t), transform var(--t);
width: auto;
}
.info_Section .box-text a.btn:hover {
background: var(--gold-light);
transform: translateY(-1px);
color: var(--ink) !important;
}
.info_Section .box-text2 {
background: var(--paper-off);
border: 1px solid var(--border);
border-top: 3px solid var(--ink);
padding: 24px 24px 70px;
min-height: 320px;
position: relative;
}
.info_Section .box-text2 h3 { color: var(--ink) !important; font-size: 20px; line-height: 1.3; }
.info_Section .box-text2 h3 span { border-bottom: 2px solid var(--gold); }
.info_Section .box-text2 p { color: var(--muted) !important; font-size: 14px; line-height: 1.55; }
.info_Section .box-text2 a.btn {
position: absolute !important;
bottom: 20px; right: 20px;
background: var(--ink);
color: #fff !important;
border: none; border-radius: 0;
font-size: 11px; font-weight: 900;
text-transform: uppercase; letter-spacing: .18em;
padding: 10px 24px;
width: auto;
transition: background var(--t);
}
.info_Section .box-text2 a.btn:hover { background: var(--gold); color: var(--ink) !important; }
/* ββ Sidebar ββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.right_sidebar { float: right; width: 100%; margin-top: 0; }
.right_sidebar .ticket_section,
.right_sidebar .newletter,
.right_sidebar .approach_section {
border-bottom: 1px solid var(--border);
padding-bottom: 28px;
margin-bottom: 28px;
}
.right_sidebar h2 {
font-size: 11px;
font-weight: 900;
text-transform: uppercase;
letter-spacing: .22em;
color: var(--subtle);
margin-bottom: 12px;
}
.right_sidebar p { color: var(--muted) !important; font-size: 14px; line-height: 1.55; font-weight: 400; }
.right_sidebar .newletter input {
background: transparent;
border: none;
border-bottom: 1px solid var(--border);
color: var(--ink);
padding: 8px 0;
font-size: 14px;
}
.right_sidebar .newletter input::-webkit-input-placeholder { color: #aaa; font-style: italic; font-size: 13px; }
/* Ticket-Button: gold filled */
.right_sidebar .ticket_section a.btn {
display: block;
background: var(--gold);
color: var(--ink) !important;
border: none; border-radius: 0;
font-size: 11px; font-weight: 900;
text-transform: uppercase; letter-spacing: .2em;
padding: 13px 20px;
text-align: center;
width: 100%;
transition: background var(--t), transform var(--t);
}
.right_sidebar .ticket_section a.btn:hover {
background: var(--gold-light); transform: translateY(-1px);
}
/* Newsletter + Anreise: outline */
.right_sidebar .newletter a.btn,
.right_sidebar .approach_section a.btn {
display: inline-block;
background: transparent;
color: var(--ink) !important;
border: 1.5px solid var(--ink); border-radius: 0;
font-size: 11px; font-weight: 700;
text-transform: uppercase; letter-spacing: .16em;
padding: 10px 20px;
transition: background var(--t), color var(--t);
}
.right_sidebar .newletter a.btn:hover,
.right_sidebar .approach_section a.btn:hover {
background: var(--ink); color: #fff !important;
}
/* ββ ::before reset β neutralisiert Γ€ltere Slide-Animationen auf Buttons ββ */
.btn::before,
.press_Section a.press-btn::before,
.info_Section a.btn::before,
.right_sidebar a.btn::before,
.contact-form .btn::before { display: none; }
/* ββ Buttons allgemein ββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.btn {
border-radius: 0;
background: var(--ink);
color: #fff;
font-size: 11px;
font-weight: 900;
text-transform: uppercase;
letter-spacing: .2em;
transition: background var(--t) var(--ease), color var(--t) var(--ease), transform var(--t);
}
.btn:hover { background: var(--gold); color: var(--ink); }
.button, button, input[type="button"], input[type="reset"], input[type="submit"] {
border-radius: 0;
transition: background var(--t) var(--ease), color var(--t) var(--ease);
}
/* Newsletter submit button */
.right_sidebar .newletter .button input,
.contact-form .button input {
background: var(--ink);
color: #fff;
border: 1px solid var(--ink);
padding: 10px 22px;
font-size: 11px; font-weight: 700;
letter-spacing: .18em; text-transform: uppercase;
cursor: pointer;
transition: background var(--t), color var(--t);
}
.right_sidebar .newletter .button input:hover,
.contact-form .button input:hover {
background: var(--gold); color: var(--ink); border-color: var(--gold);
box-shadow: none;
}
/* Press button */
.press_Section a.press-btn {
display: inline-block;
background: var(--ink);
color: #fff !important;
border: 1px solid var(--ink); border-radius: 0;
font-size: 11px; font-weight: 700;
letter-spacing: .18em; text-transform: uppercase;
padding: 10px 22px;
transition: background var(--t), color var(--t), border-color var(--t);
text-decoration: none;
}
.press_Section a.press-btn:hover { background: var(--gold); border-color: var(--gold); color: var(--ink) !important; }
/* ββ Section Titles βββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
h2.title {
font-size: 28px;
font-weight: 900;
color: var(--ink);
letter-spacing: .03em;
margin-bottom: 32px;
padding-bottom: 14px;
border-bottom: 2px solid var(--border);
position: relative;
}
h2.title::after {
content: "";
position: absolute;
bottom: -2px; left: 0;
width: 40px; height: 2px;
background: var(--gold);
}
h3.subtitle, .press_Section h4 {
font-size: 12px;
color: var(--subtle);
font-weight: 700;
text-transform: uppercase;
letter-spacing: .18em;
}
/* ββ Kontakt-Sektion ββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.contact_Section .contact-detail h3 { color: var(--ink) !important; }
.contact_Section .contact-detail span { color: var(--text) !important; font-weight: 400; font-size: 15px; }
.contact_Section .contact-detail p { color: var(--muted) !important; font-weight: 400; font-size: 14px; line-height: 1.6; }
.contact_Section .contact-detail ul li strong { color: var(--ink); font-size: 14px; }
.contact_Section .contact-detail ul li a { color: var(--muted); font-weight: 400; font-size: 14px; }
.contact_Section .contact-detail ul li a.mail { color: var(--gold); text-decoration: underline; }
.contact_Section .contact-detail ul.impressum li { color: var(--muted); font-size: 13px; font-weight: 400; }
.contact_Section .contact-detail ul.impressum li a { color: var(--muted); text-decoration: underline; }
.contact_Section .contact-detail ul.impressum li a:hover { color: var(--gold); }
/* Formular */
.contact-form .form-group .form-control {
border-radius: 0;
border: 1px solid var(--border);
background: var(--paper-off);
color: var(--text);
height: 42px;
font-size: 14px;
transition: border-color var(--t), box-shadow var(--t);
}
.contact-form .form-group .form-control:focus {
border-color: var(--gold);
box-shadow: 0 0 0 3px var(--gold-dim);
background: var(--paper);
}
.contact-form .form-group textarea.form-control { height: 130px; }
.contact-form .form-group input::placeholder,
.contact-form .form-group textarea::placeholder {
color: #aaa; font-size: 13px; font-weight: 400;
}
.contact-form .btn {
background: var(--ink);
color: #fff !important;
border-radius: 0;
font-size: 11px; font-weight: 900;
text-transform: uppercase; letter-spacing: .2em;
padding: 13px 36px; line-height: 1;
transition: background var(--t), transform var(--t);
}
.contact-form .btn:hover { background: var(--gold); color: var(--ink) !important; transform: translateY(-1px); }
div.wpcf7-response-output { color: #b91c1c; font-size: 13px; font-weight: 400; margin-top: 12px; }
div.wpcf7-response-output.wpcf7-mail-sent-ok { color: #15803d; }
span.wpcf7-not-valid-tip { color: #b91c1c; font-size: 12px; font-weight: 400; }
/* ββ Programm-Sektion βββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.program_Section h1,
.program_Section h2.title,
.program_Section h2.month { color: var(--ink); }
.program-page {
max-width: 1120px;
margin: 0 auto;
}
.program-page-header {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 2rem;
margin-bottom: 2.5rem;
}
.program-page-header .title {
margin-bottom: 0;
}
.program-page-body {
background: #ffffff;
border-radius: 16px;
padding: 24px 24px 8px;
box-shadow: 0 14px 30px rgba(15, 23, 42, 0.12);
}
.program_Section h2.title::after { background: var(--gold); }
.program_Section h2.month {
font-size: 20px;
font-weight: 400;
color: var(--subtle);
border-bottom: 1px solid var(--border);
padding-bottom: 10px;
margin-bottom: 0;
}
.program_Section table.program_table {
width: 100%;
border-collapse: collapse;
margin: 0 0 48px;
}
.program_Section table.program_table tr {
display: block;
padding: 18px 0;
border-bottom: 1px solid var(--border);
background: transparent;
transition: background var(--t);
}
.program_Section table.program_table tr:hover { background: var(--paper-off); }
.program_Section table.program_table tr td {
border: none;
padding: 0 16px 0 0;
vertical-align: top;
}
/* Datum-Spalte */
.program_Section table.program_table tr td:nth-child(1) {
color: var(--subtle);
font-weight: 700;
font-size: 14px;
}
.program_Section table.program_table tr td h3 {
border: none; margin-bottom: 4px;
}
.program_Section table.program_table tr td h3.eventTitel { font-size: 18px; font-weight: 900; margin-bottom: 0; }
.program_Section table.program_table tr td h3.eventTitel a { color: var(--ink) !important; transition: color var(--t); }
.program_Section table.program_table tr td h3.eventTitel a:hover { color: var(--gold) !important; }
.program_Section table.program_table tr td p.teaserText { color: var(--muted); line-height: 1.55; margin-bottom: 0; font-size: 14px; }
.program_Section table.program_table tr td p.eventMerkmalText { color: var(--gold); font-size: 12px; margin-top: 4px; }
.program_Section table.program_table tr td p.merkmaleText { color: var(--subtle); font-style: italic; font-size: 13px; }
.program_Section table.program_table tr td p.stabText { font-size: 14px; font-weight: 400; color: var(--muted); }
.program_Section table.program_table tr td h3 big { font-size: 32px; font-weight: 900; }
a.ticket-link { color: var(--gold); font-weight: 700; font-size: 13px; text-decoration: none; }
a.ticket-link:hover { color: var(--gold-light); }
.kein-ticket-link { color: #bbb; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }
.prodMerkmal_box { color: var(--gold); font-weight: 700; padding: 12px 0; }
/* Schmal-Tabelle */
.program_Section table.program_table_schmal tr { border-bottom: 1px solid var(--border); }
.program_Section table.program_table_schmal tr td { padding: 14px 0; border: none; }
.program_Section table.program_table_schmal tr td h3 { font-size: 18px; font-weight: 900; }
/* ββ Presse-Sektion βββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.press_Section h3 {
font-size: 22px; color: var(--ink) !important;
font-weight: 900; margin-top: 48px; margin-bottom: 24px;
}
.press_Section h3.first_heading { margin-top: 64px; }
.press_Section p, .press_Section ul li {
color: var(--muted) !important; font-size: 14px;
font-weight: 400; line-height: 1.6;
}
.press_Section ul li a { color: var(--gold); text-decoration: underline; }
.press_Section ul li a:hover { color: var(--gold-light); }
.press_Section .presse-info {
background: var(--ink);
padding: 32px 24px 20px;
border-top: 3px solid var(--gold);
float: right; max-width: 300px;
border-radius: 0;
}
.press_Section .presse-info h3,
.press_Section .presse-info h4,
.press_Section .presse-info span,
.press_Section .presse-info strong { color: var(--on-dark) !important; }
.press_Section .presse-info h3 { font-size: 20px; line-height: 1.3; margin-top: 0; }
.press_Section .presse-info h4 { font-size: 15px; font-weight: 700; }
.press_Section .presse-info p,
.press_Section .presse-info ul li { color: var(--on-dark-dim) !important; font-size: 13px; }
.press_Section .presse-info ul li a { color: var(--gold) !important; }
.press_Section .presse-info ul li a:hover { color: var(--gold-light) !important; }
.presseProdFeld { margin-bottom: 48px; border-bottom: 1px solid var(--border); padding-bottom: 32px; }
.presseProdFeld h3 { font-size: 22px; text-transform: uppercase; margin-bottom: 0; }
.presseProdFeld h3 a { color: var(--ink) !important; transition: color var(--t); }
.presseProdFeld h3 a:hover { color: var(--gold) !important; }
.presseProdFeld h3 a i { font-size: 14px; color: var(--gold); }
.presseStimmenFeld { background: var(--paper-off); border: 1px solid var(--border); padding: 20px; margin-bottom: 16px; display: none; }
.pressePdfFeld { border: 1px dashed var(--border); padding: 16px; }
.pressePdfFeld p { margin-bottom: 0; color: var(--muted); }
.presseAutor { color: var(--ink); font-weight: 700; margin: 16px 0 4px; }
.presseBildHinweis { color: var(--muted); font-size: 13px; }
/* ββ Team-Sektion βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.team {
position: relative;
margin-bottom: 48px;
background: var(--paper);
border-top: 3px solid var(--ink);
padding-top: 14px;
}
.team h6 {
position: absolute; top: -3px; left: 0;
background: var(--gold);
color: var(--ink) !important;
font-size: 11px; font-weight: 900;
letter-spacing: .14em; text-transform: uppercase;
padding: 8px 18px; z-index: 1;
}
.team h3.subtitle { color: var(--muted) !important; font-size: 12px; }
.team p { color: var(--muted) !important; font-size: 14px; letter-spacing: 0; }
.team ul li strong { color: var(--ink); font-size: 14px; }
.team ul li a { color: var(--muted); font-size: 14px; font-weight: 400; }
.team ul li a.mail { color: var(--gold); text-decoration: underline; }
.team ul li a:hover { color: var(--gold); }
.team_Section h2.title { margin-bottom: 64px; }
/* ββ Profil-Sektion βββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.Profile_Section.events_section h1 {
border-bottom: 2px solid var(--border);
padding-bottom: 24px; margin-bottom: 0; margin-top: 20px;
}
.Profile_Section.events_section h3 { margin-bottom: 16px; }
.Profile_Section.events_section h4 { font-size: 18px; font-weight: 400; color: var(--muted); }
.single_event h2.title { font-size: 26px; margin-bottom: 6px; }
.single_event p { color: var(--muted) !important; font-size: 14px; }
/* ββ Geschichte-Sektion βββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.geschichte_Section .sliders ul.slick-dots li button { background: var(--border); }
.geschichte_Section .sliders ul.slick-dots li.slick-active button { background: var(--gold); }
/* ββ Eintrittskarten-Sektion ββββββββββββββββββββββββββββββββββββββββββββββββ */
.eintrittskarten_section .ein_info h3 { color: var(--ink) !important; }
.eintrittskarten_section .get-info h5 { color: var(--ink); font-weight: 700; }
.eintrittskarten_section .get_touchinfo ul li strong { color: var(--ink); font-weight: 700; }
.eintrittskarten_section .get_touchinfo ul li a { color: var(--muted); font-weight: 400; }
.eintrittskarten_section .get_touchinfo ul li a.mail { color: var(--gold); text-decoration: underline; }
.eintrittskarten_section ul.impressum li { color: var(--muted); font-weight: 400; }
.eintrittskarten_section ul.impressum li strong { color: var(--ink); }
.eintrittskarten_section ul.impressum li a { color: var(--muted); text-decoration: underline; }
.eintrittskarten_section ul.impressum li a:hover { color: var(--gold); }
/* ββ News-Liste / Post-Details ββββββββββββββββββββββββββββββββββββββββββββββ */
.post-details h6 { font-size: 16px; font-weight: 700; }
.post-details h6 a { color: var(--ink); text-decoration: none; transition: color var(--t); }
.post-details h6 a:hover { color: var(--gold); }
.post-details .news_link_btn {
background: transparent;
color: var(--gold);
border: 1.5px solid var(--gold);
border-radius: 0;
padding: 8px 16px;
font-size: 11px; font-weight: 700;
text-transform: uppercase; letter-spacing: .14em;
transition: background var(--t), color var(--t);
}
.post-details .news_link_btn:hover { background: var(--gold); color: var(--ink) !important; }
.row.light-bg { background: var(--paper-off); padding: 18px 6px; margin: 0; }
/* ββ Sponsor / Image-Box ββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.sponsorText { text-align: left; padding-top: 24px; height: 110px; }
.sponsorText img { display: inline-block; margin: 0 16px; height: 100%; width: auto; }
.image-box a { margin-bottom: 16px; display: inline-block; }
.image-box img { max-width: 180px; margin-bottom: 4px; }
/* ββ Rental-Sektion βββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.rental-group-title { font-weight: 900; font-size: 22px; color: var(--ink); }
.rental-group-subtitle {
background: var(--ink); color: #fff;
font-size: 11px; font-weight: 700; letter-spacing: .2em;
padding: 7px 16px; display: inline-block; margin-top: 8px;
transition: background var(--t);
}
.rental-group-subtitle:hover { background: var(--gold); color: var(--ink); opacity: 1; }
.rental-group-file-title { font-size: 13px; font-weight: 700; color: var(--text); }
.rental-group-file-download { color: var(--muted); font-size: 12px; }
.rental-download-all { background: var(--ink); border-radius: 0; letter-spacing: .1em; font-weight: 700; }
.rental-download-all:hover { background: var(--gold); opacity: 1; }
.rental-group-file-preview:after { background-color: rgba(0,0,0,.75); }
/* ββ Cookie-Hinweis βββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
body .klaro .cookie-notice:not(.cookie-modal-notice) {
background: var(--paper);
border-top: 2px solid var(--gold);
box-shadow: 0 -2px 16px rgba(0,0,0,.12);
}
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-buttons .cm-btn {
border-radius: 0;
background: var(--paper-off);
color: var(--ink);
}
body .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-buttons .cm-btn.cm-btn-success {
background: var(--gold);
color: var(--ink);
}
/* ββ Utility ββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.hideOnMobile { display: block; position: relative; top: 8px; }
.showOnMobile { display: none; }
#test-para p { margin-bottom: 0; line-height: 2em; }
/* ββ Responsive βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
/* Padding auf Inhalts-Bereichen */
@media screen and (max-width: 980px) {
.box-wrapper { border-radius: 0; }
section.info_Section { padding: 28px 20px 0; }
.contact_Section, .comman_section { padding: 32px 20px 40px; }
header { padding: 16px 20px 0; }
}
@media screen and (max-width: 768px) {
section.info_Section { padding: 16px 0; }
.contact_Section, .comman_section { padding: 0 0 32px; }
header { padding: 12px 16px 0; }
.hideOnMobile { display: none; }
.showOnMobile {
display: flex;
flex-direction: column;
flex-wrap: wrap;
}
#test-para p { margin-bottom: 1rem !important; line-height: 1.5em !important; }
.press_Section .presse-info { float: left; }
.right_sidebar .ticket_section a.btn,
.right_sidebar .newletter a.btn,
.right_sidebar .approach_section a.btn {
width: 100%; text-align: center; padding: 13px;
}
.berlin-image a { width: 100%; background: var(--gold); display: block; }
.social_icon.showOnMobile a { color: var(--ink); font-size: 22px; }
.social_icon.showOnMobile li { display: inline-block; margin-right: 8px; }
h2.title { font-size: 22px; margin-bottom: 20px; }
}
@media screen and (max-width: 500px) {
.placeholder { width: 100%; height: 130px; clear: both; }
}
@media screen and (max-width: 420px) {
.placeholder { width: 100%; height: 120px; clear: both; }
}
/* ==========================================================================
PROGRAMM-TABELLE & HEADER β Feinschliff
========================================================================== */
/* ββ Header: Abstand zwischen Logo-Zeile und Nav reduzieren βββββββββββββββ */
header { padding-bottom: 0; }
.top-section { padding-bottom: 0; }
header .language_opt,
header .social_icon { margin-top: 18px; }
header .social_icon ul { margin-bottom: 8px; }
header nav.navbar.navbar-expand-md { margin-top: 10px; }
/* ββ Monat-Γberschrift: Gewicht & Farbe βββββββββββββββββββββββββββββββββββ */
.program_Section h2.month {
font-size: 16px;
font-weight: 700;
color: var(--muted);
text-transform: uppercase;
letter-spacing: .18em;
border-bottom: none;
padding: 28px 0 12px;
margin-bottom: 0;
border-top: 1px solid var(--border);
}
/* Erste Monat-Γberschrift ohne oberen Abstand */
.program_Section h2.month:first-of-type { padding-top: 8px; border-top: none; }
/* ββ Datum-Spalte: groΓe Zahl + Tag visuell stΓ€rken βββββββββββββββββββββββ */
.program_Section table.program_table tr td:nth-child(1) {
min-width: 110px;
padding-right: 20px;
vertical-align: top;
}
.program_Section table.program_table tr td h3 {
font-size: 13px;
font-weight: 400;
color: var(--subtle);
margin-bottom: 2px;
border: none;
}
.program_Section table.program_table tr td h3 big {
font-size: 38px;
font-weight: 900;
color: var(--ink);
line-height: 1;
margin-right: 4px;
}
/* Zeit-Angabe */
.program_Section table.program_table tr td p.stabText {
font-size: 13px;
color: var(--subtle);
font-weight: 400;
margin-bottom: 0;
margin-top: 4px;
}
/* ββ Event-Titel βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.program_Section table.program_table tr td h3.eventTitel {
font-size: 17px;
font-weight: 900;
color: var(--ink);
margin-bottom: 6px;
line-height: 1.25;
}
/* ββ Teaser-Text: auf 2 Zeilen kΓΌrzen βββββββββββββββββββββββββββββββββββββ */
.program_Section table.program_table tr td p.teaserText {
font-size: 14px;
color: var(--muted);
line-height: 1.55;
margin-bottom: 0;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
/* ββ Kategorie: Gold-Badge statt Plaintext ββββββββββββββββββββββββββββββββ */
.program_Section table.program_table tr td p.eventMerkmalText,
.prodMerkmal_box,
.kategorie_box {
display: inline-block;
background: var(--gold-dim);
color: var(--gold);
border: 1px solid rgba(201,168,76,.4);
font-size: 10px;
font-weight: 700;
letter-spacing: .14em;
text-transform: uppercase;
padding: 3px 9px;
margin-top: 8px;
margin-bottom: 0;
}
/* ββ Ticket-Link: echter Button βββββββββββββββββββββββββββββββββββββββββββ */
a.ticket-link {
display: inline-block;
background: var(--gold);
color: var(--ink) !important;
font-size: 11px;
font-weight: 900;
text-transform: uppercase;
letter-spacing: .16em;
padding: 7px 16px;
text-decoration: none;
transition: background var(--t) var(--ease), transform var(--t);
white-space: nowrap;
}
a.ticket-link:hover {
background: var(--gold-light);
color: var(--ink) !important;
transform: translateY(-1px);
}
/* Kein-Ticket: dezenter Hinweis */
.kein-ticket-link {
display: block;
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .1em;
color: var(--border);
margin-top: 4px;
visibility: visible;
}
/* ββ Rechte Spalte (Kategorie + Ticket) ausrichten ββββββββββββββββββββββββ */
.program_Section table.program_table tr td:last-child {
text-align: right;
vertical-align: top;
padding-left: 12px;
min-width: 100px;
}
/* ββ Hover-Zeile: subtiler Hintergrund ββββββββββββββββββββββββββββββββββββ */
.program_Section table.program_table tr {
transition: background var(--t) var(--ease);
}
.program_Section table.program_table tr:hover {
background: #faf8f4;
}
/* ββ Preis-Info βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.preis_box {
font-size: 13px;
color: var(--muted);
margin-bottom: 2px;
}
.preisInfoText {
font-size: 11px;
color: var(--subtle);
}
/* ββ Kalender-Γberschrift Padding βββββββββββββββββββββββββββββββββββββββββ */
section.info_Section,
.program_Section > .container {
padding-left: 32px;
padding-right: 32px;
}
@media screen and (max-width: 980px) {
section.info_Section,
.program_Section > .container { padding-left: 20px; padding-right: 20px; }
}
@media screen and (max-width: 768px) {
.program_Section table.program_table tr td:nth-child(1) { min-width: auto; }
.program_Section table.program_table tr td h3 big { font-size: 28px; }
a.ticket-link { font-size: 10px; padding: 6px 12px; }
}
/* ==========================================================================
NEUER HEADER β Dark Topbar + Logo-Zone + Nav
========================================================================== */
/* ββ β Utility-Bar (hell) βββββββββββββββββββββββββββββββββββββββββββββββββ */
.hdr-topbar {
background: var(--paper);
border-bottom: 1px solid var(--border);
}
.hdr-topbar__inner {
max-width: var(--max-w);
margin: 0 auto;
padding: 0 32px;
height: 40px;
display: flex;
align-items: center;
justify-content: space-between;
}
/* Sprache */
.hdr-topbar__lang { display: flex; align-items: center; }
.hdr-topbar__lang a,
.hdr-topbar__lang li a,
.hdr-topbar__lang .wpml-ls-link {
color: var(--muted) !important;
font-size: 11px !important;
font-weight: 700 !important;
text-transform: uppercase;
letter-spacing: .18em;
text-decoration: none !important;
transition: color var(--t);
padding: 0 8px 0 0 !important;
}
.hdr-topbar__lang a:hover,
.hdr-topbar__lang .wpml-ls-link:hover { color: var(--gold) !important; }
.hdr-topbar__lang .wpml-ls-current-language > a,
.hdr-topbar__lang li.current-menu-item > a { color: var(--gold) !important; }
/* Sprach-Trennlinie zwischen Items */
.hdr-topbar__lang li {
list-style: none;
display: inline-block;
border-right: 1px solid #333;
padding-right: 8px;
margin-right: 8px;
line-height: 1;
}
.hdr-topbar__lang li:last-child { border-right: none; padding-right: 0; margin-right: 0; }
/* Social Icons */
.hdr-topbar__social {
display: flex;
align-items: center;
gap: 18px;
margin: 0;
padding: 0;
list-style: none;
}
.hdr-topbar__social a {
color: var(--muted);
font-size: 14px;
text-decoration: none;
transition: color var(--t);
display: flex;
align-items: center;
}
.hdr-topbar__social a:hover { color: var(--gold); }
/* ββ β‘ Logo-Zone βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.hdr-brand {
background: var(--paper);
border-bottom: 1px solid var(--border);
padding: 0;
}
.hdr-brand__inner {
max-width: var(--max-w);
margin: 0 auto;
padding: 20px 32px 18px;
display: flex;
align-items: center;
justify-content: space-between;
}
.hdr-brand__logo {
display: block;
line-height: 0;
text-decoration: none;
}
.hdr-brand__logo-img {
height: 60px;
width: auto;
display: block;
margin-bottom: 0;
border: none;
transition: opacity var(--t);
}
.hdr-brand__logo:hover .hdr-brand__logo-img { opacity: .85; }
/* Hamburger (nur mobile sichtbar) */
.hdr-brand__toggle {
display: none;
background: transparent;
border: none;
padding: 4px;
cursor: pointer;
}
/* ββ β’ Navigation βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
/* Γberschreibt alten header-Padding fΓΌr KompatibilitΓ€t */
header.hdr-brand { padding: 0; border-bottom: 1px solid var(--border); }
/* Nav-Bar: alte Regeln bleiben, wir fΓΌgen nur .hdr-nav hinzu */
.hdr-nav { width: 100%; }
/* Mobile-Drawer */
.hdr-drawer {
background: var(--paper);
border-bottom: 1px solid var(--border);
}
.hdr-drawer .mobile li { list-style: none; border-bottom: 1px solid var(--border); }
.hdr-drawer .mobile li a {
display: block;
padding: 14px 32px;
color: var(--ink);
font-weight: 700;
font-size: 14px;
text-transform: uppercase;
letter-spacing: .14em;
text-decoration: none;
transition: color var(--t), background var(--t);
}
.hdr-drawer .mobile li a:hover { color: var(--gold); background: var(--paper-off); }
.hdr-drawer .topsocial {
display: flex !important;
flex-direction: row;
gap: 18px;
padding: 16px 32px;
margin: 0;
list-style: none;
border-top: 1px solid var(--border);
}
.hdr-drawer .topsocial a { color: var(--muted); font-size: 18px; }
.hdr-drawer .topsocial a:hover { color: var(--gold); }
/* ββ Sticky-State (.menucontainer.active) ββββββββββββββββββββββββββββββββββ */
.menucontainer.active .hdr-topbar { display: none; } /* im Sticky-Modus Topbar ausblenden */
.menucontainer.active .hdr-brand__inner { padding-top: 12px; padding-bottom: 10px; }
.menucontainer.active .hdr-brand__logo-img { height: 44px; }
/* ββ Responsive ββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
@media screen and (max-width: 1040px) {
.hdr-topbar__inner,
.hdr-brand__inner { max-width: 100%; padding-left: 20px; padding-right: 20px; }
}
@media screen and (max-width: 768px) {
/* Hamburger sichtbar */
.hdr-brand__toggle { display: block; }
.navbar-expand-md .navbar-toggler { display: none; } /* alten Button ausblenden */
/* Topbar kompakter */
.hdr-topbar__inner { height: 34px; padding: 0 16px; }
.hdr-topbar__social { gap: 14px; }
/* Logo-Zone */
.hdr-brand__inner { padding: 14px 16px 12px; }
.hdr-brand__logo-img { height: 48px; }
/* Desktop-Nav ausblenden */
.main-menu-container { display: none; }
}
@media screen and (max-width: 480px) {
.hdr-brand__logo-img { height: 40px; }
.hdr-topbar__lang li { padding-right: 6px; margin-right: 6px; }
}
/* ==========================================================================
HOME PAGE β Modernes Layout
========================================================================== */
/* ββ Zwei-Spalten-Layout βββββββββββββββββββββββββββββββββββββββββββββββββββ */
.home-section { padding: 48px 0 80px; }
.home-layout {
display: grid;
grid-template-columns: 1fr 320px;
gap: 56px;
align-items: start;
}
/* ββ CMS-Inhalt ββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.home-content { margin-bottom: 56px; }
/* ββ Abschnitts-Γberschrift ββββββββββββββββββββββββββββββββββββββββββββββββ */
.home-section-head {
display: flex;
align-items: center;
gap: 20px;
margin-bottom: 32px;
}
.home-section-head h2 {
font-size: 13px;
font-weight: 800;
text-transform: uppercase;
letter-spacing: .22em;
color: var(--muted);
white-space: nowrap;
margin: 0;
}
.home-section-head::after {
content: '';
display: block;
flex: 1;
height: 1px;
background: var(--border);
}
/* ββ News-Grid βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.home-news-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
}
/* ββ News-Card βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.news-card {
background: var(--paper);
border: 1px solid var(--border);
border-radius: 3px;
overflow: hidden;
display: flex;
flex-direction: column;
transition: box-shadow var(--t), transform var(--t);
}
.news-card:hover {
box-shadow: 0 8px 28px rgba(0,0,0,.10);
transform: translateY(-3px);
}
/* Bild */
.news-card-thumb {
display: block;
overflow: hidden;
aspect-ratio: 16 / 9;
background: var(--paper-off);
}
.news-card-thumb img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform .45s ease;
}
.news-card:hover .news-card-thumb img { transform: scale(1.04); }
/* Inhalt */
.news-card-body {
padding: 20px 22px 24px;
display: flex;
flex-direction: column;
flex: 1;
}
.news-card-date {
font-size: 11px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .16em;
color: var(--gold);
margin-bottom: 10px;
display: block;
}
.news-card-title {
font-size: 16px;
font-weight: 800;
line-height: 1.35;
margin: 0 0 10px;
color: var(--ink);
}
.news-card-title a {
color: inherit;
text-decoration: none;
transition: color var(--t);
}
.news-card-title a:hover { color: var(--gold); }
.news-card-excerpt {
font-size: 14px;
line-height: 1.6;
color: var(--muted);
margin: 0 0 16px;
flex: 1;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}
.news-card-link {
font-size: 12px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .16em;
color: var(--gold);
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 6px;
transition: gap var(--t), color var(--t);
margin-top: auto;
}
.news-card-link:hover { color: var(--ink); gap: 10px; }
/* ββ Sidebar βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.home-sidebar { display: flex; flex-direction: column; gap: 0; }
/* Sidebar-Widgets bekommen etwas Abstand untereinander */
.home-sidebar > * + * { margin-top: 0; }
.home-sidebar .right_sidebar { border: none; padding: 0; background: transparent; }
/* Partner-Logo */
.home-sidebar-partner {
margin-top: 28px;
padding-top: 24px;
border-top: 1px solid var(--border);
}
.home-sidebar-partner img {
max-width: 100%;
height: auto;
opacity: .85;
transition: opacity var(--t);
}
.home-sidebar-partner img:hover { opacity: 1; }
/* Mobile Social in Sidebar */
.home-sidebar-social { margin-top: 20px; }
/* ββ Responsive ββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
@media screen and (max-width: 1100px) {
.home-layout { grid-template-columns: 1fr 280px; gap: 40px; }
}
@media screen and (max-width: 900px) {
.home-layout { grid-template-columns: 1fr; gap: 48px; }
.home-news-grid { grid-template-columns: repeat(2, 1fr); }
.home-sidebar { order: -1; } /* Sidebar oben auf Tablet */
}
@media screen and (max-width: 600px) {
.home-section { padding: 28px 0 56px; }
.home-layout { gap: 32px; }
.home-news-grid { grid-template-columns: 1fr; }
.news-card { flex-direction: row; }
.news-card-thumb { width: 120px; flex-shrink: 0; aspect-ratio: unset; }
.news-card-body { padding: 14px 16px; }
.news-card-title { font-size: 14px; }
}
/* ==========================================================================
STICKY HEADER β Overrides fΓΌr neue hdr-* Struktur
========================================================================== */
/* Transitions fΓΌr smooth Shrink */
.hdr-topbar { transition: height var(--t) var(--ease), opacity var(--t) var(--ease), padding var(--t) var(--ease); overflow: hidden; }
.hdr-brand__inner { transition: padding var(--t) var(--ease); }
.hdr-brand__logo-img { transition: height var(--t) var(--ease), transform var(--t) var(--ease); }
/* ββ Im Sticky-Modus (.menucontainer.active) βββββββββββββββββββββββββββββββ */
/* Topbar ausblenden */
.menucontainer.active .hdr-topbar {
height: 0 !important;
opacity: 0;
padding: 0 !important;
pointer-events: none;
}
/* Logo-Zone kompakter */
.menucontainer.active .hdr-brand__inner {
padding-top: 8px !important;
padding-bottom: 6px !important;
}
/* Logo kleiner */
.menucontainer.active .hdr-brand__logo-img {
height: 40px !important;
}
/* Desktop-Nav IMMER zeigen wenn sticky */
.menucontainer.active .main-menu-container { display: block !important; }
/* Alte Regeln neutralisieren die im Weg stehen */
.menucontainer.active header.hdr-brand { border-bottom: none !important; }
.menucontainer.active .hdr-brand__inner .align-right { display: flex !important; }
/* Hamburger-Button im sticky-Modus */
.menucontainer.active .hdr-brand__toggle {
top: 50%;
transform: translateY(-50%);
}
/* Scrolling-State (leichter Schatten-Hint) */
.menucontainer.scrolling {
padding-top: 0 !important;
}
/* Placeholder-HΓΆhe mit neuer Topbar (40px topbar + ~88px brand + ~56px nav = ~184px) */
.placeholder.active { height: 144px !important; }
.placeholder.scrolling { height: 144px !important; }
@media screen and (max-width: 768px) {
.placeholder.active,
.placeholder.scrolling { height: 108px !important; }
}
/* ==========================================================================
EVENT-CARDS β Lesbarkeit & Gradient
========================================================================== */
/* StΓ€rkerer, hΓΆherer Gradient */
.info_Section .img-text {
background: linear-gradient(
to bottom,
transparent 0%,
rgba(0, 0, 0, .35) 20%,
rgba(0, 0, 0, .72) 55%,
rgba(0, 0, 0, .93) 100%
) !important;
padding: 48px 16px 16px !important;
}
/* Titel: scharf & lesbar */
.info_Section .img-text h3 {
color: #fff !important;
font-weight: 800 !important;
text-shadow: 0 1px 8px rgba(0,0,0,.95), 0 2px 16px rgba(0,0,0,.7) !important;
line-height: 1.3 !important;
margin-bottom: 4px !important;
}
/* Datum: Gold mit starkem Schatten */
.info_Section .img-text h5 {
color: var(--gold) !important;
font-size: 11px !important;
font-weight: 700 !important;
letter-spacing: .14em !important;
text-shadow: 0 1px 6px rgba(0,0,0,1), 0 0 12px rgba(0,0,0,.9) !important;
margin-bottom: 8px !important;
text-transform: uppercase;
}
/* img_box1 (groΓes Bild): Title etwas grΓΆΓer */
.info_Section .img_box1 .img-text h3 {
font-size: 24px !important;
}
/* img_box2 (kleine Kacheln): kompakterer Text */
.info_Section .img_box2 .img-text h3 {
font-size: 15px !important;
}
/* Hover: Gradient leicht heller machen damit man das Bild noch genieΓt */
.info_Section .img_box1:hover .img-text,
.info_Section .img_box2:hover .img-text {
background: linear-gradient(
to bottom,
transparent 0%,
rgba(0, 0, 0, .25) 20%,
rgba(0, 0, 0, .60) 55%,
rgba(0, 0, 0, .85) 100%
) !important;
}
/* Bild-Zoom hover (bereits vorhanden, sicherstellen) */
.info_Section .img_box1,
.info_Section .img_box2 {
overflow: hidden !important;
}
.info_Section .img_box1 .img-bild,
.info_Section .img_box2 .img-bild {
display: block;
width: 100%;
transition: transform 500ms var(--ease) !important;
}
.info_Section .img_box1:hover .img-bild,
.info_Section .img_box2:hover .img-bild {
transform: scale(1.05) !important;
}
/* ==========================================================================
HOME-MAIN β Dark Card mit weiΓem Text
========================================================================== */
.home-main {
background: rgba(10, 12, 14, 0.82);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
border-radius: var(--card-radius);
border: 1px solid rgba(255,255,255,.08);
padding: 36px 40px 40px;
color: #f0ece4;
}
/* Alle Texte weiΓ / hell */
.home-main p,
.home-main li,
.home-main td { color: #d4cfc7 !important; }
.home-main h1,
.home-main h2,
.home-main h3,
.home-main h4,
.home-main h5,
.home-main h6 { color: #f0ece4 !important; }
/* Links in Gold */
.home-main a { color: var(--gold) !important; }
.home-main a:hover { color: var(--gold-light) !important; }
/* Section-Head Trennlinie heller */
.home-main .home-section-head h2 { color: rgba(255,255,255,.45) !important; }
.home-main .home-section-head::after { background: rgba(255,255,255,.12); }
/* News-Cards: dunkel bleiben (eigen gestylt), nicht ΓΌberschreiben */
.news-card p,
.news-card h3 { color: unset !important; }
/* ==========================================================================
MOBILE β Optimierungen
========================================================================== */
@media screen and (max-width: 768px) {
/* Box-Wrapper kein seitliches Padding */
.box-wrapper { padding: 0 !important; }
/* Home-Main: weniger Padding */
.home-main {
padding: 24px 20px 28px;
border-radius: 0;
border-left: none;
border-right: none;
}
/* Home News Grid: 1 Spalte */
.home-news-grid { grid-template-columns: 1fr; gap: 16px; }
/* Cards auf Mobile: horizontal */
.news-card {
flex-direction: row;
max-height: 120px;
}
.news-card-thumb {
width: 110px;
min-width: 110px;
aspect-ratio: unset;
max-height: 120px;
}
.news-card-body { padding: 12px 14px; }
.news-card-date { font-size: 10px; margin-bottom: 4px; }
.news-card-title { font-size: 13px; margin-bottom: 6px; }
.news-card-excerpt { display: none; } /* Teaser auf Mobile weglassen */
.news-card-link { font-size: 11px; }
/* Home Sidebar */
.home-sidebar { padding: 0 16px 24px; }
.home-sidebar-partner { margin-top: 20px; padding-top: 20px; }
/* Header: Topbar auf Mobile ausblenden */
.hdr-topbar { display: none; }
/* Nav-Bar HΓΆhe */
.hdr-brand__inner { padding: 12px 16px 10px; }
.hdr-brand__logo-img { height: 44px !important; }
/* Hamburger grΓΆΓer */
.hdr-brand__toggle {
display: flex !important;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
border-radius: 4px;
background: rgba(0,0,0,.06) !important;
}
/* Navbar-Toggler-Icon */
.navbar-toggler-icon {
display: block;
width: 22px;
height: 2px;
background: var(--ink);
border-radius: 2px;
margin-bottom: 5px;
}
.navbar-toggler-icon:last-child { margin-bottom: 0; }
/* Desktop-Nav verstecken β Mobile-Drawer ΓΌbernimmt */
.main-menu-container { display: none !important; }
/* Sticky auf Mobile: kompakter */
.menucontainer.active .hdr-brand__inner {
padding-top: 8px !important;
padding-bottom: 6px !important;
}
.menucontainer.active .hdr-brand__logo-img { height: 36px !important; }
}
@media screen and (max-width: 480px) {
/* Info-Section: kein seitliches Padding */
section.info_Section { padding: 20px 12px 0; }
.contact_Section, .comman_section { padding: 24px 12px 40px; }
/* Event-Karten kleiner */
.info_Section .img-text h3 { font-size: 13px !important; }
.info_Section .img-text h5 { font-size: 10px !important; }
/* Programm-Tabelle: Datum als Block */
.program_Section table.program_table tr td { display: block; width: 100% !important; padding: 4px 0; }
.program_Section table.program_table tr td:first-child { padding-bottom: 0; }
/* News-Cards: kein Bild auf sehr kleinen Screens */
.news-card-thumb { display: none; }
.news-card { max-height: unset; }
.news-card-excerpt { display: block; -webkit-line-clamp: 2; }
.news-card-body { padding: 14px 16px; }
/* Home-Main etwas weniger Padding */
.home-main { padding: 18px 14px 22px; }
}
/* ==========================================================================
HEADER β Logo links, Nav rechts (eine Zeile)
========================================================================== */
/* Brand-Zeile: Flex, Logo links β Nav rechts */
.hdr-brand__inner {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
padding: 0 32px !important;
height: 72px;
}
/* Logo */
.hdr-brand__logo { flex-shrink: 0; line-height: 0; }
.hdr-brand__logo-img { height: 52px !important; width: auto; display: block; }
/* Desktop Nav im Header */
.hdr-brand__nav {
display: flex !important;
align-items: center;
height: 100%;
justify-content: flex-end;
}
/* Nav-Items horizontal in der Brand-Zeile */
.hdr-brand__nav .navbar-nav,
.hdr-brand__nav .menu { display: flex !important; flex-direction: row !important; gap: 0; list-style: none; margin: 0; padding: 0; height: 100%; justify-content: flex-end; }
.hdr-brand__nav .navbar-nav li,
.hdr-brand__nav .menu li { display: flex; align-items: stretch; height: 100%; position: relative; }
.hdr-brand__nav .navbar-nav li a,
.hdr-brand__nav .menu li a {
display: flex;
align-items: center;
padding: 0 20px;
font-size: 12px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .16em;
color: var(--muted) !important;
text-decoration: none !important;
border-bottom: 3px solid transparent;
transition: color var(--t), border-color var(--t);
white-space: nowrap;
}
.hdr-brand__nav .navbar-nav li a:hover,
.hdr-brand__nav .menu li a:hover { color: var(--ink) !important; }
.hdr-brand__nav .navbar-nav li.current-menu-item > a,
.hdr-brand__nav .menu li.current-menu-item > a,
.hdr-brand__nav .navbar-nav li.active > a { color: var(--ink) !important; border-bottom-color: var(--gold) !important; }
/* UntermenΓΌ (Dropdown) */
.hdr-brand__nav .navbar-nav li ul,
.hdr-brand__nav .menu li ul {
position: absolute;
top: 100%;
left: 0;
background: var(--paper);
border: 1px solid var(--border);
border-top: 2px solid var(--gold);
box-shadow: 0 8px 24px rgba(0,0,0,.12);
min-width: 200px;
display: none;
flex-direction: column;
z-index: 200;
padding: 8px 0;
}
.hdr-brand__nav .navbar-nav li:hover > ul,
.hdr-brand__nav .menu li:hover > ul { display: flex; }
.hdr-brand__nav .navbar-nav li ul li,
.hdr-brand__nav .menu li ul li { height: auto; }
.hdr-brand__nav .navbar-nav li ul li a,
.hdr-brand__nav .menu li ul li a {
padding: 10px 18px;
font-size: 12px;
border-bottom: none !important;
width: 100%;
}
/* Alten hdr-nav (separate Bar) verstecken */
.hdr-nav { display: none !important; }
/* Hamburger erst auf Mobile zeigen */
.hdr-brand__toggle { display: none !important; }
/* Sticky: Logo + Nav kompakter */
.menucontainer.active .hdr-brand__inner { height: 56px !important; }
.menucontainer.active .hdr-brand__logo-img { height: 38px !important; }
.menucontainer.active .hdr-brand__nav .navbar-nav li a,
.menucontainer.active .hdr-brand__nav .menu li a { font-size: 11px; padding: 0 16px; }
/* ==========================================================================
EVENT-CARDS β Gradient fix: Text IMMER lesbar
========================================================================== */
/* Overlay deckt gesamte Karte ab β Gradient nur unten */
.info_Section .img_box1 .img-text,
.info_Section .img_box2 .img-text {
position: absolute !important;
top: 0 !important;
bottom: 0 !important;
left: 0 !important;
right: 0 !important;
padding: 0 !important;
display: flex !important;
flex-direction: column !important;
justify-content: flex-end !important;
background: linear-gradient(
to bottom,
transparent 0%,
transparent 45%,
rgba(0,0,0,.55) 70%,
rgba(0,0,0,.90) 100%
) !important;
}
/* Text-Container am unteren Rand */
.info_Section .img-text h3,
.info_Section .img-text h5 {
margin: 0;
padding: 0 14px;
}
.info_Section .img-text h3 {
font-size: 15px !important;
font-weight: 800 !important;
line-height: 1.3 !important;
color: #fff !important;
text-shadow: 0 1px 6px rgba(0,0,0,.9) !important;
padding-bottom: 14px !important;
}
.info_Section .img_box1 .img-text h3 { font-size: 22px !important; padding-bottom: 18px !important; }
/* Datum: kleines Gold-Badge direkt ΓΌber dem Titel */
.info_Section .img-text h5 {
font-size: 10px !important;
font-weight: 700 !important;
letter-spacing: .15em !important;
text-transform: uppercase;
color: var(--gold) !important;
text-shadow: 0 1px 4px rgba(0,0,0,1) !important;
padding-bottom: 5px !important;
}
/* Mobile: etwas mehr Platz */
@media screen and (max-width: 768px) {
/* Header: Nav weg, Hamburger an */
.hdr-brand__nav { display: none !important; }
.hdr-brand__toggle { display: flex !important; }
.hdr-brand__inner { height: 60px !important; padding: 0 16px !important; }
.hdr-brand__logo-img { height: 42px !important; }
/* Mobile-Drawer wieder zeigen */
.hdr-drawer { display: block; }
/* Event-Cards Text */
.info_Section .img-text h3 { font-size: 13px !important; padding-bottom: 10px !important; }
.info_Section .img-text h5 { font-size: 9px !important; }
}
/* ==========================================================================
HEADER β WeiΓes Design (wie Screenshot)
========================================================================== */
/* Topbar: weiΓ statt dunkel */
.hdr-topbar {
background: var(--paper) !important;
border-bottom: 1px solid var(--border) !important;
}
.hdr-topbar__inner {
height: 36px !important;
}
/* "IN ENGLISH" β dunkel auf weiΓ */
.hdr-topbar__lang a,
.hdr-topbar__lang li a,
.hdr-topbar__lang .wpml-ls-link {
color: var(--ink) !important;
font-size: 10px !important;
letter-spacing: .22em !important;
}
.hdr-topbar__lang a:hover,
.hdr-topbar__lang .wpml-ls-link:hover { color: var(--gold) !important; }
.hdr-topbar__lang li { border-right-color: var(--border) !important; }
/* Social Icons: dunkel auf weiΓ */
.hdr-topbar__social a {
color: var(--ink) !important;
font-size: 16px !important;
}
.hdr-topbar__social a:hover { color: var(--gold) !important; }
/* Brand-Zeile: Trennlinie unten */
header.hdr-brand {
border-bottom: 1px solid var(--border) !important;
background: var(--paper) !important;
}
/* Nav-Items: Teal-Farbe des Logos */
.hdr-brand__nav .navbar-nav li a,
.hdr-brand__nav .menu li a {
color: #0e3a44 !important;
font-size: 11px !important;
letter-spacing: .2em !important;
}
.hdr-brand__nav .navbar-nav li a:hover,
.hdr-brand__nav .menu li a:hover { color: var(--gold) !important; }
.hdr-brand__nav .navbar-nav li.current-menu-item > a,
.hdr-brand__nav .menu li.current-menu-item > a { color: #0e3a44 !important; border-bottom-color: var(--gold) !important; }
/* ==========================================================================
HEADER β Smooth Transitions
========================================================================== */
/* Menucontainer: Box-Shadow beim Sticky-Wechsel */
.menucontainer {
transition:
box-shadow 400ms cubic-bezier(.4,0,.2,1),
background 300ms ease;
will-change: box-shadow;
}
.menucontainer.active {
box-shadow: 0 2px 32px rgba(0,0,0,.10), 0 1px 0 rgba(0,0,0,.04) !important;
}
/* Topbar: max-height statt height (animiert korrekt) */
.hdr-topbar {
max-height: 60px;
overflow: hidden !important;
transition:
max-height 380ms cubic-bezier(.4,0,.2,1),
opacity 280ms cubic-bezier(.4,0,.2,1),
border-color 200ms ease !important;
will-change: max-height, opacity;
}
.menucontainer.active .hdr-topbar {
max-height: 0 !important;
opacity: 0 !important;
pointer-events: none;
height: unset !important;
}
/* Logo + Brand-Inner: weiche HΓΆhen/Padding-Γnderung */
header.hdr-brand {
transition: border-color 200ms ease;
}
.hdr-brand__inner {
transition: height 350ms cubic-bezier(.4,0,.2,1),
padding 350ms cubic-bezier(.4,0,.2,1) !important;
will-change: height;
}
/* Logo schrumpft sanft */
.hdr-brand__logo-img {
transition: height 350ms cubic-bezier(.4,0,.2,1) !important;
will-change: height;
}
/* Nav-Links: Hover-Γbergang verfeinern */
.hdr-brand__nav .navbar-nav li a,
.hdr-brand__nav .menu li a {
transition:
color 200ms ease,
border-color 200ms ease,
background 150ms ease !important;
}
/* Dropdown: sanftes Einblenden */
.hdr-brand__nav .navbar-nav li ul,
.hdr-brand__nav .menu li ul {
opacity: 0;
transform: translateY(-6px);
transition:
opacity 180ms ease,
transform 180ms cubic-bezier(.4,0,.2,1);
display: block !important;
pointer-events: none;
visibility: hidden;
}
.hdr-brand__nav .navbar-nav li:hover > ul,
.hdr-brand__nav .menu li:hover > ul {
opacity: 1;
transform: translateY(0);
pointer-events: auto;
visibility: visible;
}
/* ==========================================================================
HOME β Komplettes Redesign
========================================================================== */
/* ββ Wrapper & Layout ββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.home-wrapper {
max-width: var(--max-w);
margin: 0 auto;
padding: 40px 24px 80px;
}
.home-layout {
display: grid;
grid-template-columns: 1fr 300px;
gap: 48px;
align-items: start;
}
/* ββ home-main: dezentes Glas-Panel βββββββββββββββββββββββββββββββββββββββ */
.home-main {
background: rgba(8, 10, 12, 0.72) !important;
backdrop-filter: blur(18px) !important;
-webkit-backdrop-filter: blur(18px) !important;
border-radius: 8px !important;
border: 1px solid rgba(255,255,255,.10) !important;
padding: 0 !important;
overflow: hidden;
}
/* Goldene Akzentlinie oben */
.home-main::before {
content: '';
display: block;
height: 3px;
background: linear-gradient(90deg, var(--gold) 0%, transparent 100%);
}
/* ββ CMS-Content (Event-Showcase) ββββββββββββββββββββββββββββββββββββββββββ */
.home-content {
padding: 32px 36px 0;
}
.home-content p,
.home-content li { color: rgba(220,215,205,.85) !important; line-height: 1.7 !important; }
.home-content h1, .home-content h2,
.home-content h3, .home-content h4 { color: #f0ece4 !important; }
.home-content a { color: var(--gold) !important; }
.home-content a:hover { color: var(--gold-light) !important; }
/* ββ Aktuelles-Label βββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.home-news { padding: 32px 36px 36px; }
.home-news-label {
font-size: 10px;
font-weight: 800;
text-transform: uppercase;
letter-spacing: .28em;
color: var(--gold);
margin-bottom: 20px;
display: flex;
align-items: center;
gap: 14px;
}
.home-news-label::after {
content: '';
flex: 1;
height: 1px;
background: rgba(255,255,255,.10);
}
/* ββ Featured Post βββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.news-featured {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0;
border-radius: 6px;
overflow: hidden;
background: rgba(255,255,255,.04);
border: 1px solid rgba(255,255,255,.08);
margin-bottom: 20px;
transition: box-shadow 300ms ease, border-color 300ms ease;
}
.news-featured:hover {
box-shadow: 0 12px 40px rgba(0,0,0,.4);
border-color: rgba(201,168,76,.25);
}
.news-featured-img {
display: block;
overflow: hidden;
aspect-ratio: 4/3;
}
.news-featured-img img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform 600ms cubic-bezier(.4,0,.2,1);
}
.news-featured:hover .news-featured-img img { transform: scale(1.05); }
.news-featured-body {
padding: 32px 28px;
display: flex;
flex-direction: column;
justify-content: center;
gap: 10px;
}
/* ββ Kleine Cards ββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.news-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
}
.news-card {
border-radius: 6px;
overflow: hidden;
background: rgba(255,255,255,.04);
border: 1px solid rgba(255,255,255,.07);
display: flex;
flex-direction: column;
transition: box-shadow 300ms ease, border-color 300ms ease, transform 300ms ease;
}
.news-card:hover {
box-shadow: 0 8px 28px rgba(0,0,0,.35);
border-color: rgba(201,168,76,.2);
transform: translateY(-2px);
}
.nc-thumb {
display: block;
overflow: hidden;
aspect-ratio: 16/9;
}
.nc-thumb img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform 500ms cubic-bezier(.4,0,.2,1);
}
.news-card:hover .nc-thumb img { transform: scale(1.06); }
.nc-body {
padding: 18px 20px 20px;
display: flex;
flex-direction: column;
flex: 1;
gap: 6px;
}
/* ββ Gemeinsame Typografie (Featured + Cards) ββββββββββββββββββββββββββββββ */
.nc-date {
display: block;
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .18em;
color: var(--gold);
}
.nc-title {
font-size: 15px;
font-weight: 800;
line-height: 1.35;
color: #f0ece4 !important;
margin: 0;
}
.news-featured-body .nc-title { font-size: 20px !important; }
.nc-title a {
color: inherit !important;
text-decoration: none;
transition: color 200ms ease;
}
.nc-title a:hover { color: var(--gold) !important; }
.nc-excerpt {
font-size: 13px;
line-height: 1.65;
color: rgba(210,205,195,.75) !important;
margin: 0;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
flex: 1;
}
.news-featured-body .nc-excerpt {
font-size: 14px;
-webkit-line-clamp: 4;
}
.nc-link {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 11px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .16em;
color: var(--gold) !important;
text-decoration: none;
margin-top: 4px;
transition: gap 200ms ease, color 200ms ease;
}
.nc-link:hover { gap: 10px; color: var(--gold-light) !important; }
/* ββ Sidebar βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
.home-sidebar {
display: flex;
flex-direction: column;
gap: 0;
position: sticky;
top: 100px;
}
.home-sidebar .right_sidebar {
background: rgba(8,10,12,.68);
backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);
border: 1px solid rgba(255,255,255,.09);
border-radius: 8px;
overflow: hidden;
}
.home-sidebar-partner {
margin-top: 20px;
padding: 20px;
background: rgba(255,255,255,.96);
border-radius: 6px;
}
.home-sidebar-partner img { width: 100%; height: auto; display: block; }
/* ββ Responsive ββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ */
@media screen and (max-width: 1100px) {
.home-layout { grid-template-columns: 1fr 260px; gap: 32px; }
}
@media screen and (max-width: 900px) {
.home-layout { grid-template-columns: 1fr; }
.home-sidebar { position: static; order: 2; }
.news-featured { grid-template-columns: 1fr; }
.news-featured-img { aspect-ratio: 16/9; }
.news-featured-body { padding: 22px 22px 24px; }
.news-featured-body .nc-title { font-size: 17px !important; }
}
@media screen and (max-width: 640px) {
.home-wrapper { padding: 20px 0 48px; }
.home-content { padding: 22px 20px 0; }
.home-news { padding: 22px 20px 26px; }
.news-grid { grid-template-columns: 1fr; gap: 12px; }
.news-featured { margin-bottom: 14px; }
.nc-excerpt { -webkit-line-clamp: 2; }
.home-sidebar { padding: 0 12px; }
}
/* ==========================================================================
EVENT-CARDS β CSS Grid Stack Fix + vollstΓ€ndiges Redesign
========================================================================== */
/* Grid-Stack: img-text UND img-bild liegen ΓΌbereinander in derselben Zelle */
.info_Section .img_box1,
.info_Section .img_box2 {
display: grid !important;
grid-template-columns: 1fr !important;
overflow: hidden !important;
border-radius: 4px !important;
position: relative !important;
}
/* Beide Kinder in dieselbe Grid-Zelle */
.info_Section .img_box1 > .img-bild,
.info_Section .img_box1 > .img-text,
.info_Section .img_box2 > .img-bild,
.info_Section .img_box2 > .img-text {
grid-column: 1 !important;
grid-row: 1 !important;
}
/* Bild fΓΌllt den Container */
.info_Section .img_box1 .img-bild,
.info_Section .img_box2 .img-bild {
display: block !important;
width: 100% !important;
z-index: 1 !important;
line-height: 0 !important;
}
.info_Section .img_box1 .img-bild img,
.info_Section .img_box2 .img-bild img,
.info_Section .img_box1 .img-bild a img,
.info_Section .img_box2 .img-bild a img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block !important;
transition: transform 600ms cubic-bezier(.4,0,.2,1) !important;
}
.info_Section .img_box1:hover .img-bild img,
.info_Section .img_box2:hover .img-bild img {
transform: scale(1.06) !important;
}
/* Text-Overlay oben drΓΌber */
.info_Section .img_box1 .img-text,
.info_Section .img_box2 .img-text {
position: relative !important;
z-index: 2 !important;
align-self: stretch !important;
display: flex !important;
flex-direction: column !important;
justify-content: flex-end !important;
padding: 0 !important;
/* Gradient: transparent oben β schwarz unten */
background: linear-gradient(
to bottom,
transparent 0%,
transparent 42%,
rgba(0,0,0,.50) 65%,
rgba(0,0,0,.88) 100%
) !important;
pointer-events: none !important;
}
/* Klick geht trotzdem durch den Text auf das Bild-Link */
.info_Section .img_box1 .img-text a,
.info_Section .img_box2 .img-text a {
pointer-events: auto !important;
}
/* Datum */
.info_Section .img-text h5 {
font-size: 10px !important;
font-weight: 700 !important;
letter-spacing: .18em !important;
text-transform: uppercase !important;
color: var(--gold) !important;
text-shadow: 0 1px 6px rgba(0,0,0,.9) !important;
margin: 0 !important;
padding: 0 16px 6px !important;
line-height: 1.4 !important;
}
/* Titel */
.info_Section .img-text h3 {
font-size: 15px !important;
font-weight: 800 !important;
line-height: 1.3 !important;
color: #fff !important;
text-shadow: 0 1px 8px rgba(0,0,0,.95) !important;
margin: 0 !important;
padding: 0 16px 18px !important;
}
/* GroΓes Bild: Titel grΓΆΓer */
.info_Section .img_box1 .img-text h3 {
font-size: 24px !important;
padding-bottom: 24px !important;
}
.info_Section .img_box1 .img-text h5 {
font-size: 11px !important;
padding-bottom: 8px !important;
}
/* Hover: Gold-Rahmen-Hint */
.info_Section .img_box1,
.info_Section .img_box2 {
transition: box-shadow 300ms ease !important;
}
.info_Section .img_box1:hover,
.info_Section .img_box2:hover {
box-shadow: 0 0 0 2px rgba(201,168,76,.45), 0 12px 36px rgba(0,0,0,.45) !important;
}
/* ==========================================================================
EVENT-CARDS β gleichmΓ€Γige AbstΓ€nde
========================================================================== */
/* Alle alten margin-bottom Werte neutralisieren */
.info_Section .img_box2,
.info_Section .img_box2:last-child,
.info_Section .post-info .img_box2,
.info_Section .post-details .img_box2,
.info_Section .left_info .img_box2,
.info_Section .left-info .img_box2 {
margin-bottom: 16px !important;
}
/* Letztes Element in jeder Spalte: kein extra Abstand */
.info_Section .img_box2:last-child { margin-bottom: 0 !important; }
/* Gleiches gilt fΓΌr img_box1 */
.info_Section .img_box1 { margin-bottom: 16px !important; }
/* Bootstrap Row-Gutters auch anpassen, damit Spalten-Abstand == Karten-Abstand */
.info_Section .post-info .row,
.info_Section .post-details .row {
margin-left: -8px !important;
margin-right: -8px !important;
}
.info_Section .post-info .row > [class*="col-"],
.info_Section .post-details .row > [class*="col-"] {
padding-left: 8px !important;
padding-right: 8px !important;
}
/* ==========================================================================
HOME-MAIN β Hintergrund entfernen + Text lesbarer
========================================================================== */
/* Grauen Hintergrund entfernen */
.home-main,
.home-main::before {
background: transparent !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
border: none !important;
box-shadow: none !important;
}
/* CMS-Text direkt auf Hintergrundbild β weiΓ mit Schatten */
.home-content p,
.home-content li { color: #fff !important; text-shadow: 0 1px 4px rgba(0,0,0,.8) !important; }
.home-content h1, .home-content h2,
.home-content h3, .home-content h4 {
color: #fff !important;
text-shadow: 0 2px 8px rgba(0,0,0,.9) !important;
}
/* News-Label */
.home-news-label { text-shadow: 0 1px 4px rgba(0,0,0,.8); }
.home-news-label::after { background: rgba(255,255,255,.2); }
/* ==========================================================================
EVENT-CARDS β Gradient stΓ€rker, Text deutlich lesbarer
========================================================================== */
.info_Section .img_box1 .img-text,
.info_Section .img_box2 .img-text {
background: linear-gradient(
to bottom,
transparent 0%,
transparent 30%,
rgba(0,0,0,.65) 58%,
rgba(0,0,0,.96) 100%
) !important;
}
/* Datum: eigener halbtransparenter Hintergrund als Pill */
.info_Section .img-text h5 {
display: inline-block !important;
background: rgba(0,0,0,.55) !important;
padding: 3px 10px 3px 16px !important;
font-size: 11px !important;
font-weight: 700 !important;
letter-spacing: .16em !important;
color: var(--gold) !important;
text-shadow: none !important;
margin: 0 !important;
margin-bottom: 6px !important;
width: 100% !important;
box-sizing: border-box !important;
}
/* Titel: groΓ, klar, mit starkem Schatten */
.info_Section .img-text h3 {
font-size: 16px !important;
font-weight: 900 !important;
line-height: 1.25 !important;
color: #fff !important;
text-shadow:
0 1px 0 rgba(0,0,0,1),
0 2px 12px rgba(0,0,0,.9),
0 4px 24px rgba(0,0,0,.7) !important;
padding: 0 16px 20px !important;
margin: 0 !important;
letter-spacing: .01em !important;
}
.info_Section .img_box1 .img-text h3 {
font-size: 26px !important;
padding-bottom: 28px !important;
}
/* ==========================================================================
EVENT-CARDS β Neustart: Text-oben + Bild-unten Design
========================================================================== */
/* Container */
.info_Section .img_box1,
.info_Section .img_box2 {
display: flex !important;
flex-direction: column !important;
overflow: hidden !important;
border-radius: 6px !important;
position: relative !important;
border: 1px solid rgba(255,255,255,.07) !important;
transition: box-shadow 300ms ease, border-color 300ms ease !important;
}
.info_Section .img_box1:hover,
.info_Section .img_box2:hover {
box-shadow: 0 8px 32px rgba(0,0,0,.5) !important;
border-color: rgba(201,168,76,.35) !important;
}
/* ββ Text-Bereich (oben) ββββββββββββββββββββββββββββββββββββββββββββββββββ */
.info_Section .img_box1 .img-text,
.info_Section .img_box2 .img-text {
/* Reset aller vorherigen Overrides */
position: relative !important;
top: auto !important; bottom: auto !important;
left: auto !important; right: auto !important;
/* Eigenes Styling */
order: 1 !important;
display: flex !important;
flex-direction: column !important;
justify-content: flex-start !important;
align-self: auto !important;
padding: 14px 16px 12px !important;
border-bottom: 1px solid rgba(255,255,255,.06) !important;
z-index: auto !important;
}
/* Datum */
.info_Section .img_box1 .img-text h5,
.info_Section .img_box2 .img-text h5 {
display: block !important;
font-size: 10px !important;
font-weight: 700 !important;
letter-spacing: .2em !important;
text-transform: uppercase !important;
color: var(--gold) !important;
text-shadow: none !important;
margin: 0 0 7px !important;
padding: 0 !important;
width: auto !important;
background: none !important;
opacity: .9;
}
/* Titel */
.info_Section .img_box1 .img-text h3,
.info_Section .img_box2 .img-text h3 {
font-size: 14px !important;
font-weight: 700 !important;
line-height: 1.3 !important;
color: #f0ece4 !important;
text-shadow: none !important;
margin: 0 !important;
padding: 0 !important;
letter-spacing: .01em !important;
}
.info_Section .img_box1 .img-text h3 { font-size: 18px !important; }
/* Titel-Link */
.info_Section .img-text h3 a {
color: inherit !important;
text-decoration: none !important;
transition: color 200ms ease !important;
}
.info_Section .img-text h3 a:hover { color: var(--gold) !important; }
/* ββ Bild-Bereich (unten) βββββββββββββββββββββββββββββββββββββββββββββββββ */
.info_Section .img_box1 .img-bild,
.info_Section .img_box2 .img-bild {
order: 2 !important;
display: block !important;
overflow: hidden !important;
flex: 1 !important;
min-height: 0 !important;
line-height: 0 !important;
}
.info_Section .img_box1 .img-bild img,
.info_Section .img_box2 .img-bild img,
.info_Section .img_box1 .img-bild a img,
.info_Section .img_box2 .img-bild a img {
width: 100% !important;
height: 100% !important;
min-height: 160px !important;
object-fit: cover !important;
display: block !important;
transition: transform 600ms cubic-bezier(.4,0,.2,1) !important;
}
.info_Section .img_box1 .img-bild img { min-height: 280px !important; }
.info_Section .img_box1:hover .img-bild img,
.info_Section .img_box2:hover .img-bild img {
transform: scale(1.06) !important;
}
/* Gold-Akzent links (sichtbare Design-Markierung) */
.info_Section .img_box1::before,
.info_Section .img_box2::before {
content: '' !important;
display: block !important;
position: absolute !important;
top: 0 !important; left: 0 !important; bottom: 0 !important;
width: 3px !important;
background: var(--gold) !important;
opacity: 0 !important;
transition: opacity 300ms ease !important;
z-index: 5 !important;
}
.info_Section .img_box1:hover::before,
.info_Section .img_box2:hover::before { opacity: 1 !important; }
/* Datum: gleiche Farbe wie Titel-Text */
.info_Section .img_box1 .img-text h5,
.info_Section .img_box2 .img-text h5 {
color: #f0ece4 !important;
opacity: 1 !important;
letter-spacing: .04em !important;
text-transform: none !important;
font-size: 12px !important;
font-weight: 400 !important;
}
/* 20px Abstand oben */
.info_Section .img_box1 .img-text,
.info_Section .img_box2 .img-text {
padding-top: 20px !important;
}
/* ==========================================================================
EVENT-CARDS β img-bild als background-image div (kein ![]()
Tag)
========================================================================== */
/* Container */
.img_box1,
.img_box2 {
display: flex !important;
flex-direction: column !important;
overflow: hidden !important;
border-radius: 6px !important;
border: 1px solid rgba(255,255,255,.08) !important;
transition: box-shadow 300ms ease, border-color 300ms ease !important;
}
.img_box1:hover,
.img_box2:hover {
box-shadow: 0 8px 32px rgba(0,0,0,.55) !important;
border-color: rgba(201,168,76,.3) !important;
}
/* Text-Panel oben */
.img_box1 .img-text,
.img_box2 .img-text {
order: 1 !important;
position: relative !important;
top: auto !important; bottom: auto !important;
left: auto !important; right: auto !important;
display: block !important;
padding: 20px 18px 14px !important;
border-bottom: 1px solid rgba(255,255,255,.06) !important;
z-index: auto !important;
}
/* Datum */
.img_box1 .img-text h5,
.img_box2 .img-text h5 {
display: block !important;
font-size: 11px !important;
font-weight: 400 !important;
letter-spacing: .03em !important;
text-transform: none !important;
color: #f0ece4 !important;
text-shadow: none !important;
background: none !important;
margin: 0 0 8px !important;
padding: 0 !important;
width: auto !important;
opacity: .7 !important;
}
/* Titel */
.img_box1 .img-text h3,
.img_box2 .img-text h3 {
font-size: 15px !important;
font-weight: 700 !important;
line-height: 1.3 !important;
color: #f0ece4 !important;
text-shadow: none !important;
margin: 0 !important;
padding: 0 !important;
}
.img_box1 .img-text h3 { font-size: 20px !important; }
.img_box1 .img-text h3 a,
.img_box2 .img-text h3 a {
color: inherit !important;
text-decoration: none !important;
transition: color 200ms ease !important;
}
.img_box1 .img-text h3 a:hover,
.img_box2 .img-text h3 a:hover { color: var(--gold) !important; }
/* Bild-Panel: background-image div */
.img_box1 .img-bild,
.img_box2 .img-bild {
order: 2 !important;
display: block !important;
min-height: 160px !important;
flex: 1 !important;
background-size: cover !important;
background-position: center !important;
background-repeat: no-repeat !important;
transition: transform 500ms cubic-bezier(.4,0,.2,1) !important;
transform-origin: center !important;
}
.img_box1 .img-bild { min-height: 260px !important; }
.img_box1:hover .img-bild,
.img_box2:hover .img-bild {
transform: scale(1.04) !important;
}
/* ==========================================================================
EVENT-CARDS β Bilder-Fix (flex-collapse verhindert)
========================================================================== */
.img_box1 .img-bild,
.img_box2 .img-bild {
flex: 0 0 auto !important; /* kein flex-grow/-shrink β inline height bleibt */
min-height: 140px !important;
height: 160px !important; /* Fallback falls kein Inline-Style */
width: 100% !important;
display: block !important;
background-size: cover !important;
background-position: center !important;
background-repeat: no-repeat !important;
}
.img_box1 .img-bild { height: 240px !important; }
.info_Section .img_box1 .img-text,
.info_Section .img_box2 .img-text {
padding-top: 30px !important;
}
/* ==========================================================================
EVENT-CARDS β DEFINITIVER FIX (alle alten Konflikte ΓΌberschreiben)
========================================================================== */
/* 1. Container */
.img_box1,
.img_box2,
.info_Section .img_box1,
.info_Section .img_box2 {
position: relative !important;
display: flex !important;
flex-direction: column !important;
overflow: hidden !important;
border-radius: 6px !important;
border: 1px solid rgba(255,255,255,.08) !important;
}
/* 2. Text-Panel: KEIN absolute mehr, normal im Fluss oben */
.img_box1 .img-text,
.img_box2 .img-text,
.info_Section .img_box1 .img-text,
.info_Section .img_box2 .img-text {
position: static !important; /* absolute-Γberschreibung aufheben */
top: auto !important;
bottom: auto !important;
left: auto !important;
right: auto !important;
order: 1 !important;
flex-shrink: 0 !important;
display: block !important;
padding: 30px 18px 14px !important;
border-bottom: 1px solid rgba(255,255,255,.07) !important;
z-index: auto !important;
}
/* 3. Datum */
.img_box1 .img-text h5,
.img_box2 .img-text h5,
.info_Section .img_box1 .img-text h5,
.info_Section .img_box2 .img-text h5 {
display: block !important;
color: rgba(240,236,228,.65) !important;
font-size: 11px !important;
font-weight: 400 !important;
letter-spacing: .03em !important;
text-transform: none !important;
text-shadow: none !important;
background: none !important;
margin: 0 0 7px !important;
padding: 0 !important;
width: auto !important;
}
/* 4. Titel */
.img_box1 .img-text h3,
.img_box2 .img-text h3,
.info_Section .img_box1 .img-text h3,
.info_Section .img_box2 .img-text h3 {
color: #f0ece4 !important;
font-size: 15px !important;
font-weight: 700 !important;
line-height: 1.3 !important;
text-shadow: none !important;
margin: 0 !important;
padding: 0 !important;
}
.img_box1 .img-text h3 { font-size: 20px !important; }
.img_box1 .img-text h3 a,
.img_box2 .img-text h3 a { color: inherit !important; text-decoration: none !important; }
.img_box1 .img-text h3 a:hover,
.img_box2 .img-text h3 a:hover { color: var(--gold) !important; }
/* 5. Bild-Div (background-image via Inline-Style) */
.img_box1 .img-bild,
.img_box2 .img-bild,
.info_Section .img_box1 .img-bild,
.info_Section .img_box2 .img-bild {
order: 2 !important;
position: static !important;
display: block !important;
flex-shrink: 0 !important;
width: 100% !important;
min-height: 150px !important;
background-size: cover !important;
background-position: center center !important;
background-repeat: no-repeat !important;
transition: transform 500ms cubic-bezier(.4,0,.2,1) !important;
}
.img_box1 .img-bild { min-height: 240px !important; }
/* 6. Hover */
.img_box1:hover,
.img_box2:hover {
box-shadow: 0 8px 32px rgba(0,0,0,.5) !important;
border-color: rgba(201,168,76,.3) !important;
}
.img_box1:hover .img-bild,
.img_box2:hover .img-bild { transform: scale(1.04) !important; }
/* ==========================================================================
IMG-BILD COLLAPSE FIX β hΓΆchste SpezifitΓ€t, ΓΌberschreibt flex:1 + min-height:0
========================================================================== */
.info_Section .img_box1 .img-bild,
.info_Section .img_box2 .img-bild,
.info_Section .img_box1 > .img-bild,
.info_Section .img_box2 > .img-bild {
flex: 0 0 auto !important; /* flex-basis:auto β inline height:140px wirkt wieder */
flex-grow: 0 !important;
flex-shrink: 0 !important;
min-height: 140px !important;
width: 100% !important;
display: block !important;
background-size: cover !important;
background-position: center center !important;
background-repeat: no-repeat !important;
overflow: visible !important;
}
.info_Section .img_box1 > .img-bild {
min-height: 240px !important;
}
/* ==========================================================================
EVENT-CARDS β ECHTER FIX (basierend auf tatsΓ€chlicher HTML-Struktur)
Echte Struktur:
========================================================================== */
/* Container: background-image BLEIBT (von WP inline gesetzt) */
.img_box1.img-bild,
.img_box2.img-bild {
position: relative !important;
display: block !important;
overflow: hidden !important;
/* KEIN background-color β wΓΌrde das Bild ΓΌberdecken! */
background-size: cover !important;
background-position: center center !important;
background-repeat: no-repeat !important;
border-radius: 4px !important;
cursor: pointer;
transition: box-shadow 300ms ease !important;
}
.img_box1.img-bild:hover,
.img_box2.img-bild:hover {
box-shadow: 0 8px 32px rgba(0,0,0,.45) !important;
}
/* Gradient-Overlay via ::after */
.img_box1.img-bild::after,
.img_box2.img-bild::after {
content: '' !important;
position: absolute !important;
inset: 0 !important;
background: linear-gradient(
to bottom,
transparent 0%,
transparent 40%,
rgba(0,0,0,.55) 68%,
rgba(0,0,0,.90) 100%
) !important;
pointer-events: none !important;
z-index: 1 !important;
}
/* Datum (h6) β ΓΌber dem Gradient */
.img_box1.img-bild h6,
.img_box2.img-bild h6 {
position: absolute !important;
bottom: 36px !important;
left: 14px !important;
right: 14px !important;
z-index: 2 !important;
color: rgba(240,236,228,.75) !important;
font-size: 10px !important;
font-weight: 400 !important;
letter-spacing: .04em !important;
text-shadow: 0 1px 4px rgba(0,0,0,.9) !important;
margin: 0 !important;
padding: 0 !important;
top: auto !important;
}
/* img-text: am unteren Rand */
.img_box1.img-bild .img-text,
.img_box2.img-bild .img-text {
position: absolute !important;
bottom: 0 !important;
left: 0 !important;
right: 0 !important;
top: auto !important;
padding: 10px 14px 14px !important;
background: none !important;
z-index: 2 !important;
display: block !important;
}
/* Titel */
.img_box1.img-bild .img-text h3,
.img_box2.img-bild .img-text h3 {
color: #fff !important;
font-size: 15px !important;
font-weight: 700 !important;
line-height: 1.3 !important;
text-shadow: 0 1px 8px rgba(0,0,0,.95) !important;
margin: 0 !important;
padding: 0 !important;
}
.img_box1.img-bild .img-text h3 { font-size: 22px !important; }
.img_box1.img-bild h6 { bottom: 52px !important; font-size: 11px !important; }
/* Hover: Bild-Zoom via transform auf dem Container selbst */
.img_box1.img-bild,
.img_box2.img-bild {
transition: transform 500ms cubic-bezier(.4,0,.2,1), box-shadow 300ms ease !important;
}
/* Zoom nur auf Bild, nicht auf Text β via Wrapper-Scale begrenzt */
.img_box1.img-bild:hover,
.img_box2.img-bild:hover {
transform: scale(1.0) !important; /* Zoom via JS oder kein Zoom am Container */
}
/* Datum immer direkt ΓΌber dem Titel β beide am unteren Rand gestapelt */
.img_box1.img-bild,
.img_box2.img-bild {
display: flex !important;
flex-direction: column !important;
justify-content: flex-end !important;
}
/* h6 (Datum): normal im Fluss, direkt ΓΌber img-text */
.img_box1.img-bild h6,
.img_box2.img-bild h6 {
position: relative !important;
bottom: auto !important;
left: auto !important;
right: auto !important;
top: auto !important;
z-index: 2 !important;
padding: 0 14px 4px !important;
margin: 0 !important;
color: rgba(240,236,228,.75) !important;
font-size: 10px !important;
font-weight: 400 !important;
letter-spacing: .04em !important;
text-shadow: 0 1px 4px rgba(0,0,0,.9) !important;
}
/* img-text (Titel): direkt darunter */
.img_box1.img-bild .img-text,
.img_box2.img-bild .img-text {
position: relative !important;
bottom: auto !important;
top: auto !important;
z-index: 2 !important;
padding: 0 14px 16px !important;
background: none !important;
}