@charset "UTF-8";
/***************************************************
* OUR DEFAULT LAYOUT SETTINGS (Vertical Null/Default) as a base definition for all verticals.
* Do NOT edit this file! Changes will affect all other verticals, so be careful!
* If you want to add a new vertical, see: ./howto_add_new_vertical
*/
/*!
* Berlin.de Masterlayout
* BerlinOnline GmbH
* Author: Tobias Marciniak
*/
/* We can use a wrapperclass to make unique rules and
* avoid conflicts with existing older css classes.
*
*
*/
/*
*
* COLORS (dont change colors here!)
*
*/
/*
*
* DIMENSIONS
*
*/
/*
*
* BREAKPOINTS
*
*/
/*
*
* FONT
*
*/
/*
* More icons (bicon) from svg file (images/icons/bicons) (classname == filename)
* (generates css class (.bicon-iconname) for each icon)
*/
/***************************************************
* PAGE SETTINGS: VERTICAL MARKETING (Overwrite default)
*/
/***************************************************
*
* px to rem functions
*
*/
/**
* get any css-rule with rem and px from px
*/
/***************************************************
* Calculate the Percentage Width of Flex Items When Using Gap
* width: (100% / n) - (((n -1) / n) * g);
* (n is the amount of items and g is the gap size)
*/
/***************************************************
* Micro clearfix, as per: css-101.org/articles/clearfix/latest-new-clearfix-so-far.php
* Extend the clearfix class with Sass to avoid the `.clearfix` class appearing
* over and over in your markup.
*/
.clearfix:before, .clearfix:after {
content: " ";
display: table;
clear: both;
}
/***************************************************
*
* Headings
*
*/
/* LINKS */
/* LIST STYLES */
/*
BUTTON STYLES
We need some !important rules here, so we can mix all different button variations.
*/
/* Helper for Styleguide */
/* FOOTER: Basic Layout for Content AND! Portalfooter to basic arrange links and logo */
/* FOOTER Linklist: */
/* FOOTER: Basic brand/logo layout */
/* FOOTER: Basic claim layout */
/*
* MASTER PAGE GRID DEFINITION
*/
/***************************************************
*
* Fullwidth main elements in main grid
*
*/
/***************************************************
*
* Panel Layout (used in blocks, boards and everywhere else)
*
*/
/* A fake auto-placement grid (logogalerie, azlistletter) with flex */
/* Fullwidth homepage herounit image settings (for multiple verticles) with centered content overlay */
/***************************************************
*
* Media Query
*
*/
.aural {
height: 1px !important;
overflow: hidden !important;
position: absolute !important;
display: block !important;
left: -10000px !important;
width: 1px !important;
margin: 0 !important;
padding: 0 !important;
}
body {
margin: 0;
width: 100%;
font-size: 1rem;
line-height: 1.5;
background-color: #ffffff;
overflow: hidden;
min-height: 100vh;
}
body.lock-from-scroll {
overflow: hidden;
position: fixed;
}
/*
This will hide the focus indicator if the element receives focus via the mouse,
but it will still show up on keyboard focus.
https://github.com/WICG/focus-visible
*/
/*
:focus {
outline: 3px solid $color-tabfocus;
outline-offset: 0px;
}
[data-js-focus-visible] :focus:not([data-focus-visible-added]) {
outline: none;
}
*/
:focus {
outline: none;
}
:focus-visible {
outline: 3px solid #0076dd;
outline-offset: 0px;
box-shadow: 0px 0px 0 5px #ffffff;
}
/***************************************************
*
* BOOTSTRAP LIKE GRID
*
*/
.row,
.row-fluid {
list-style: none;
padding: 0;
list-style: none !important;
}
.row > li,
.row-fluid > li {
margin-left: 0;
}
.row > li:before,
.row-fluid > li:before {
content: unset;
display: none;
}
.row > li::marker,
.row-fluid > li::marker {
display: none;
content: unset;
}
.row + *,
.row-fluid + * {
margin-top: 0;
}
@media print, (min-width: 37.501rem ) {
.row,
.row-fluid {
gap: 0 20px;
padding: 0 !important;
display: flex !important;
display: -ms-flexbox !important;
flex-wrap: wrap !important;
align-items: flex-start !important;
width: auto !important;
}
.row > *,
.row-fluid > * {
width: 100%;
margin-top: 0;
}
.row > .auto,
.row-fluid > .auto {
-webkit-flex: 1;
flex: 1;
}
.row > .span1,
.row-fluid > .span1 {
width: calc(8.3333333333% - 18.3333333333px);
}
.row > .span2,
.row-fluid > .span2 {
width: calc(16.6666666667% - 16.6666666667px);
}
.row > .span3,
.row-fluid > .span3 {
width: calc(25% - 15px);
}
.row > .span4,
.row-fluid > .span4 {
width: calc(33.3333333333% - 13.3333333333px);
}
.row > .span5,
.row-fluid > .span5 {
width: calc(40% - 12px);
}
.row > .span6,
.row-fluid > .span6 {
width: calc(50% - 10px);
}
.row > .span7,
.row-fluid > .span7 {
width: calc(55.5555555556% - 8.8888888889px);
}
.row > .span8,
.row-fluid > .span8 {
width: calc(66.6666666667% - 6.6666666667px);
}
.row > .span9,
.row-fluid > .span9 {
width: calc(71.4285714286% - 5.7142857143px);
}
.row > .span10,
.row-fluid > .span10 {
width: calc(83.3333333333% - 3.3333333333px);
}
.row > .span11,
.row-fluid > .span11 {
width: calc(90.9090909091% - 1.8181818182px);
}
.row > .span12,
.row-fluid > .span12 {
width: 100%;
}
.row.leftandright,
.row-fluid.leftandright {
justify-content: space-between;
flex-wrap: nowrap !important;
}
.row.leftandright.center,
.row-fluid.leftandright.center {
align-items: center !important;
}
.row.leftandright > *,
.row-fluid.leftandright > * {
width: auto;
}
}
/* TEXT ################### */
.float--left,
.pull-left {
float: left;
}
.float--right,
.pull-right {
float: right;
}
.align--left {
text-align: left;
}
.align--right {
text-align: right;
}
@media print, (min-width: 73.8135rem ) {
.align--right-desk {
text-align: right;
}
}
.align--center {
text-align: center;
}
.text--disabled {
color: #737373;
}
.font--size2 {
font-size: 1em;
}
.font--size2 {
font-size: 2em;
}
.font--size3 {
font-size: 3em;
}
.font--size4 {
font-size: 4em;
}
.flexbox {
display: flex;
}
.justify--left {
justify-content: flex-start;
}
.justify--center {
justify-content: center;
}
.justify--right {
justify-content: flex-end;
}
.flex--center {
align-items: center;
}
.text--nowrap {
white-space: nowrap;
}
.text--small {
font-size: 14px;
}
.text--smallest {
font-size: 11px;
}
.text--light {
color: #454545;
}
.text--color-primary {
color: #000000;
}
.text--strong {
font-weight: bold;
}
.text--clean {
border: 0 none;
padding: 0;
}
.add-text-background {
background: #000000;
color: #ffffff;
padding: 10px 12px;
text-shadow: none;
}
/* BACKGROUND ################### */
.add-bg-stripes--small {
background-image: linear-gradient(135deg, #000000 4.55%, transparent 4.55%, transparent 50%, #000000 50%, #000000 54.55%, transparent 54.55%, transparent 100%);
background-size: 11px 11px;
}
/* SPACING ################### */
.p-0 {
padding: 0 !important;
}
.p-1 {
padding: 0.5em !important;
}
.p-2 {
padding: 1em !important;
}
.py-0 {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.my-0 {
margin-top: 0 !important;
margin-bottom: 0 !important;
}
.my-1 {
margin-top: 25px !important;
margin-bottom: 25px !important;
}
.my-2 {
margin-top: 50px !important;
margin-bottom: 50px !important;
}
.block--nogap {
margin-bottom: 0 !important;
}
.block--nogap + * {
margin-top: 0 !important;
}
.block--doublegap {
margin-bottom: 100px !important;
}
.block--halfgap {
margin-bottom: 25px !important;
}
/* Text color ################### */
.color--primary {
color: #000000;
}
.color--secondary {
color: #000000;
}
.text--colored {
color: #000000;
}
/**
* High-, page-level styling.
*
* 1. Set the default `font-size` and `line-height` for the entire project,
* sourced from our default variables. The `font-size` is calculated to exist
* in ems, the `line-height` is calculated to exist unitlessly.
* 2. Force scrollbars to always be visible to prevent awkward ‘jumps’ when
* navigating between pages that do/do not have enough content to produce
* scrollbars naturally.
* 3. Ensure the page always fills at least the entire height of the viewport.
* 4. Prevent certain mobile browsers from automatically zooming fonts.
* 5. Fonts on OSX will look more consistent with other systems that do not
* render text using sub-pixel anti-aliasing.
* 6. Set default font family to sans-serif.
* 7. Prevent iOS text size adjust after orientation change, without disabling
* user zoom.
*/
* {
box-sizing: border-box;
}
html {
color: #000000;
overflow-y: scroll; /* [2] */
min-height: 100%; /* [3] */
-webkit-text-size-adjust: 100%; /* [4] */
-ms-text-size-adjust: 100%; /* [4] */
-moz-osx-font-smoothing: grayscale; /* [5] */
-webkit-font-smoothing: antialiased; /* [5] */
font-family: Arial, sans-serif; /* 6 */
-ms-text-size-adjust: 100%; /* 7 */
-webkit-text-size-adjust: 100%; /* 7 */
}
@media print {
html {
background-color: #ffffff;
}
}
/**
* Set the global `box-sizing` state to `border-box`.
*
* css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice
* paulirish.com/2012/box-sizing-border-box-ftw
*/
html,
html {
box-sizing: border-box;
}
* {
/*
&,
&:before,
&:after {
box-sizing: inherit;
}
*/
}
@media print {
* {
page-break-inside: always;
}
}
@media screen and (max-width: 37.5rem) {
#js-is_palm {
display: none !important;
}
}
@media print, (max-width: 73.8125rem) {
#js-is_tablet {
display: none !important;
}
}
/*
* THE GLOABL PAGE LAYOUT GRID
* place our page areas (hero, mainbar, marginal, footer,...)
* CSS Grid for global page element positioning
*/
.layout-grid,
#layout-grid {
grid-auto-flow: row;
grid-auto-rows: auto;
grid-auto-columns: auto;
position: relative;
display: -ms-grid;
display: grid;
grid-template-areas: "contentheader contentheader contentheader contentheader contentheader contentheader contentheader" "herounit herounit herounit herounit herounit herounit herounit" "firstcolumn leftcolumn . mainbar . marginal lastcolumn" "contentfooter contentfooter contentfooter contentfooter contentfooter contentfooter contentfooter";
position: relative;
z-index: auto;
/*
* CONTENT HEADER
*/
/*
* dldb metainfo for d115
*
*/
/*
* CONTENT FOOTER
*
*/
/*
* SIDEBAR LEFT (should not be used)
*/
/*
* MAINBAR MIDDLE / MAIN CONTENT AREA
*
*/
/*
* SIDEBAR RIGHT / MARGINAL
*
*/
}
@media print, (min-width: 73.8135rem ) {
.layout-grid,
#layout-grid {
-ms-grid-columns: minmax(0, auto) minmax(0, auto) 40px minmax(50vw, 980px) 40px minmax(0, auto) minmax(0, auto);
grid-template-columns: [first fullWidth-start] minmax(0, auto) [leftcolumn-start] minmax(0, auto) [leftcolumn-end leftgap-start] 40px [leftgap-end mainbar-start] minmax(50vw, 980px) [mainbar-end rightgap-start] 40px [rightgap-end marginal-start] minmax(0, auto) [marginal-end] minmax(0, auto) [last fullWidth-end];
grid-gap: 0;
justify-content: stretch;
}
}
@media print, (max-width: 73.8125rem) {
.layout-grid,
#layout-grid {
display: block;
}
}
@media print, (min-width: 92.501rem ) {
.layout-grid,
#layout-grid {
-ms-grid-columns: minmax(0, 1fr) minmax(0, 250px) 40px 980px 40px minmax(0, 250px) minmax(0, 1fr);
grid-template-columns: [first fullWidth-start] minmax(0, 1fr) [leftcolumn-start] minmax(0, 250px) [leftcolumn-end leftgap-start] 40px [leftgap-end mainbar-start] 980px [mainbar-end rightgap-start] 40px [rightgap-end marginal-start] minmax(0, 250px) [marginal-end] minmax(0, 1fr) [last fullWidth-end];
grid-gap: 0;
justify-content: center;
}
}
@media print, (max-width: 73.8125rem) {
.layout-grid,
#layout-grid {
padding-left: 12px;
padding-right: 12px;
}
}
.layout-grid > *,
#layout-grid > * {
-ms-grid-row: 3;
-ms-grid-column: 4;
-ms-grid-column-span: 1;
grid-column: mainbar;
grid-row: auto;
width: 100%;
}
.layout-grid > *.fullwidth,
#layout-grid > *.fullwidth {
-ms-grid-column: 1;
-ms-grid-column-span: 7;
grid-column-start: first;
grid-column-end: last;
grid-column: fullWidth !important;
padding-left: 0;
padding-right: 0;
}
.layout-grid > *.fullwidth > .fullwidth__inner:not(.keep-fullwidth),
#layout-grid > *.fullwidth > .fullwidth__inner:not(.keep-fullwidth) {
width: 980px;
max-width: 100%;
margin: 0 auto;
}
.layout-grid > *.row-breadcrumb,
#layout-grid > *.row-breadcrumb {
margin-top: 1em;
}
.layout-grid > #layout-grid__area--contentheader,
#layout-grid > #layout-grid__area--contentheader {
-ms-grid-row: 1;
-ms-grid-column: 4;
-ms-grid-column-span: 1;
grid-area: contentheader;
grid-column: mainbar;
display: flex;
flex-direction: column;
position: relative;
z-index: 1;
background-color: #f5f5f5;
}
.layout-grid > #layout-grid__area--contentheader:before,
#layout-grid > #layout-grid__area--contentheader:before {
position: absolute;
background-color: #f5f5f5;
top: 0;
bottom: 0;
left: -9999px;
right: 0;
display: block;
content: "";
z-index: -1;
box-shadow: 9999px 0 0 #f5f5f5;
border-left: 9999px solid #f5f5f5;
}
@media print, (max-width: 73.8125rem) {
.layout-grid > #layout-grid__area--contentheader,
#layout-grid > #layout-grid__area--contentheader {
margin-left: -12px;
margin-right: -12px;
width: auto;
padding-left: 12px;
padding-right: 12px;
}
}
.layout-grid > #d115-metainfo,
#layout-grid > #d115-metainfo {
display: none;
}
.layout-grid > #layout-grid__area--contentfooter,
#layout-grid > #layout-grid__area--contentfooter {
-ms-grid-row: 4;
-ms-grid-column: 1;
-ms-grid-column-span: 7;
grid-area: contentfooter;
grid-column: fullWidth;
}
@media print, (max-width: 73.8125rem) {
.layout-grid > #layout-grid__area--contentfooter,
#layout-grid > #layout-grid__area--contentfooter {
margin-left: -12px;
margin-right: -12px;
width: auto;
}
}
.layout-grid #layout-grid__area--contentfooter,
#layout-grid #layout-grid__area--contentfooter {
background-color: #f5f5f5;
color: #000000;
}
.layout-grid #layout-grid__area--herounit,
#layout-grid #layout-grid__area--herounit {
min-height: 40px;
-ms-grid-row: 2;
-ms-grid-column: 4;
-ms-grid-column-span: 1;
grid-area: herounit;
grid-column: mainbar;
position: relative;
}
.layout-grid #layout-grid__area--herounit.fullwidth,
#layout-grid #layout-grid__area--herounit.fullwidth {
-ms-grid-column: 1;
-ms-grid-column-span: 7;
grid-column: fullWidth;
}
.layout-grid #layout-grid__area--leftcolumn,
#layout-grid #layout-grid__area--leftcolumn {
-ms-grid-row: 3;
-ms-grid-column: 2;
-ms-grid-column-span: 1;
grid-area: leftcolumn;
grid-column: leftcolumn;
justify-items: end;
}
.layout-grid #layout-grid__area--leftcolumn > *:first-child,
#layout-grid #layout-grid__area--leftcolumn > *:first-child {
margin-top: 0;
}
@media print, (min-width: 73.8135rem ) {
.layout-grid #layout-grid__area--leftcolumn,
#layout-grid #layout-grid__area--leftcolumn {
justify-items: flex-start;
align-items: flex-end;
display: flex;
flex-direction: column;
}
}
.layout-grid #layout-grid__area--maincontent,
#layout-grid #layout-grid__area--maincontent {
-ms-grid-row: 3;
-ms-grid-column: 4;
-ms-grid-column-span: 1;
grid-area: mainbar;
grid-column: mainbar;
/* see at the end: make this rule more global
@include media-query("tablet-landscape-and-up") {
> .fullwidth {
@include layout-grid--fullwidth__outer();
> .fullwidth__inner:not(.keep-fullwidth) {
@include layout-grid--fullwidth__inner();
}
}
}
*/
/* conflict on palm
> .fullwidth.panel--heavy {
// Grey fullwidth areas has no white border on palm
@include removePagePaddingPalm();
}
*/
}
@media print, (min-width: 57.501rem ) {
.layout-grid #layout-grid__area--maincontent,
#layout-grid #layout-grid__area--maincontent {
min-height: 450px;
}
}
.layout-grid #layout-grid__area--maincontent > *:first-child,
#layout-grid #layout-grid__area--maincontent > *:first-child {
margin-top: 0;
}
.layout-grid #layout-grid__area--maincontent > .container-wrapper,
#layout-grid #layout-grid__area--maincontent > .container-wrapper {
position: relative;
background-color: #ffffff;
padding-top: 24px;
padding-bottom: 24px;
margin-bottom: 0;
}
@media print, (min-width: 57.501rem ) {
.layout-grid #layout-grid__area--maincontent > .container-wrapper,
#layout-grid #layout-grid__area--maincontent > .container-wrapper {
min-height: 450px;
}
}
.layout-grid #layout-grid__area--maincontent h1,
#layout-grid #layout-grid__area--maincontent h1 {
margin-top: 0;
}
.layout-grid #layout-grid__area--marginal,
#layout-grid #layout-grid__area--marginal {
-ms-grid-row: 3;
-ms-grid-column: 6;
-ms-grid-column-span: 1;
grid-area: marginal;
}
@media print, (min-width: 73.8135rem ) {
.layout-grid #layout-grid__area--marginal,
#layout-grid #layout-grid__area--marginal {
/*
> *:not(.is--sticky) {
max-width: $pageRightColumnWidth; // dont fit with stickybuttton ".is-sticky"
}
*/
}
}
.layout-grid #layout-grid__area--marginal > *,
#layout-grid #layout-grid__area--marginal > * {
word-break: break-word;
}
#layout-grid__area--maincontent {
margin-top: 40px;
}
#layout-grid__area--herounit + #layout-grid__area--maincontent,
#layout-grid__area--herounit + #layout-grid__area--leftcolumn + #layout-grid__area--maincontent {
margin-top: 0;
}
#layout-grid__area--marginal {
margin-top: 40px;
}
#layout-grid__area--herounit + #layout-grid__area--maincontent + #layout-grid__area--marginal {
margin-top: 0;
}
#layout-grid__area--maincontent {
margin-bottom: 50px;
}
#layout-grid > [id*=layout-grid__area--] > .fullwidth {
position: relative;
z-index: 0;
left: 50%;
right: auto;
width: 100vw;
min-width: 100vw;
margin-left: -50vw;
margin-right: auto;
overflow: hidden;
}
#layout-grid > [id*=layout-grid__area--] > .fullwidth > .fullwidth__inner:not(.keep-fullwidth) {
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
@media (min-width: 980px) {
#layout-grid > [id*=layout-grid__area--] > .fullwidth > .fullwidth__inner:not(.keep-fullwidth) {
width: 980px;
}
}
/*
Leichte Sprache Seiten (wirkt nur auf den Contentbereich)
Body Triggerklassen: locale_de-plain, locale-plain, locale_en-plain, ...
*/
[class*=locale][class*=-plain] #layout-grid__area--maincontent {
font-size: 21px;
line-height: 1.5em;
}
[class*=locale][class*=-plain] #layout-grid__area--maincontent h1 {
font-size: 1.4em;
}
[class*=locale][class*=-plain] #layout-grid__area--maincontent h2 {
font-size: 1.2em;
}
[class*=locale][class*=-plain] #layout-grid__area--maincontent h3 {
font-size: 1.1em;
}
[class*=locale][class*=-plain] #layout-grid__area--maincontent .image__copyright,
[class*=locale][class*=-plain] #layout-grid__area--maincontent .image__caption {
font-size: 0.8em;
}
[class*=locale][class*=-plain] #layout-grid__area--maincontent [class*=modul-] {
margin-bottom: 80px;
}
/* TEST A/B mit 24px remove?*/
[class*=locale][class*=-bigplain] #layout-grid__area--maincontent {
font-size: 24px;
line-height: 1.5em;
}
[class*=locale][class*=-bigplain] #layout-grid__area--maincontent h1 {
font-size: 1.4em;
}
[class*=locale][class*=-bigplain] #layout-grid__area--maincontent h2 {
font-size: 1.3em;
}
[class*=locale][class*=-bigplain] #layout-grid__area--maincontent h3 {
font-size: 1.1em;
}
[class*=locale][class*=-bigplain] #layout-grid__area--maincontent .image__copyright,
[class*=locale][class*=-bigplain] #layout-grid__area--maincontent .image__caption {
font-size: 0.8em;
}
[class*=locale][class*=-bigplain] #layout-grid__area--maincontent [class*=modul-] {
margin-bottom: 80px;
}
@media print, (min-width: 37.501rem ) {
[class*=locale][class*=-bigplain] #layout-grid__area--maincontent .modul-text_bild.leichte-sprache .title {
flex: 0 0 100%;
}
[class*=locale][class*=-bigplain] #layout-grid__area--maincontent .modul-text_bild.leichte-sprache .text {
flex: 1 0 60%;
}
}
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
button {
cursor: pointer;
}
a {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
#page-wrapper {
border: 0px solid;
position: relative;
box-shadow: none;
}
#page-wrapper:before, #page-wrapper:after {
content: " ";
display: table;
clear: both;
}
@media print, (min-width: 37.501rem ) {
#page-wrapper {
width: 100%;
min-width: auto;
max-width: 100%;
margin: 0 auto;
}
}
@media print, (max-width: 73.8125rem) {
#page-wrapper.container-content {
padding: 0 !important;
}
}
@page {
margin: 1.5cm 1cm 1cm 1cm;
}
@media print {
* {
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
}
#footer,
#footer,
#content-footer,
.pageheader__services,
.shariff,
.modul-stickybutton,
#content-header {
display: none !important;
}
.is--sticky,
.is--sticky {
position: relative !important;
}
.is--sticky .header__row-portalbrand,
.is--sticky .header__row-portalbrand {
height: 44px !important;
}
body {
padding-top: 0px !important;
}
.container a.print-showlink[href]:after {
width: auto;
background: none;
}
.modul-teaser_buehne .teaser_buehne__left {
max-width: 50vw;
}
.buhne__list--teaser .modul-teaser_buehne .image::before,
.buhne__list--teaser .modul-teaser_buehne .image::after {
max-width: 160px;
max-height: 160px;
}
.modul-testimonial .textbox .text {
font-size: 16px !important;
}
}
@media print, (min-width: 37.501rem ) {
.desk-hide {
display: none !important;
}
.palm-show {
display: none !important;
}
}
@media print, (min-width: 37.501rem ) {
.palm-show {
display: none !important;
}
}
@media screen and (max-width: 37.5rem) {
.palm-hide {
display: none !important;
}
.palm-show {
display: inline-block !important;
}
}
@media print, (max-width: 57.5rem) {
.tablet-hide {
display: none !important;
}
.tablet-show {
display: inline-block !important;
}
}
/*
* Note:
* If .svg file masks dosnt work on local filesystem: The reason is, that css "mask-image" is restricted to CORS policy.
* It’s a security measure for modern browsers to not allow any webpage to access your filesystem
*/
.bicon {
line-height: 0;
}
.bicon:before {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 1em;
height: 1em;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-);
mask-image: var(--bicon-);
}
/*
* url encodes svg files:
*/
:root {
/* Accessability */
--bicon-universal-access: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3C%21--%21Font%20Awesome%20Free%206.5.2%20by%20%40fontawesome%20-%20https%3A%2F%2Ffontawesome.com%20License%20-%20https%3A%2F%2Ffontawesome.com%2Flicense%2Ffree%20Copyright%202024%20Fonticons%2C%20Inc.--%3E%3Cpath%20d%3D%22M256%2048c115%200%20208%2093%20208%20208%200%20115-93%20208-208%20208-115%200-208-93-208-208%200-115%2093-208%20208-208m0-40C119%208%208%20119%208%20256s111%20248%20248%20248%20248-111%20248-248S393%208%20256%208zm0%2056C150%2064%2064%20150%2064%20256s86%20192%20192%20192%20192-86%20192-192S362%2064%20256%2064zm0%2044c19.9%200%2036%2016.1%2036%2036s-16.1%2036-36%2036-36-16.1-36-36%2016.1-36%2036-36zm117.7%2098c-28.7%206.8-55.5%2012.7-82.1%2015.8%20.9%20101%2012.3%20123.1%2025%20155.6%203.6%209.3-1%2019.7-10.2%2023.3-9.3%203.6-19.7-1-23.3-10.2-8.7-22.3-17.1-40.6-22.3-78.5h-9.7c-5.2%2037.9-13.5%2056.2-22.3%2078.5-3.6%209.3-14.1%2013.8-23.3%2010.2-9.3-3.6-13.8-14.1-10.2-23.3%2012.7-32.5%2024.2-54.5%2025-155.6-26.6-3.1-53.4-9-82.1-15.8-8.6-2-13.9-10.6-11.9-19.2s10.6-13.9%2019.2-11.9c96.7%2022.8%20124.3%2022.8%20220.8%200%208.6-2%2017.2%203.3%2019.2%2011.9%202%208.6-3.3%2017.2-11.9%2019.2z%22%2F%3E%3C%2Fsvg%3E");
--bicon-dgs: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20576%20512%22%3E%3C%21--%21Font%20Awesome%20Free%206.5.2%20by%20%40fontawesome%20-%20https%3A%2F%2Ffontawesome.com%20License%20-%20https%3A%2F%2Ffontawesome.com%2Flicense%2Ffree%20Copyright%202024%20Fonticons%2C%20Inc.--%3E%3Cpath%20d%3D%22M544%20160l-.1%2072.6c-.1%2052.2-24%20101-64%20133.1c.1-1.9%20.1-3.8%20.1-5.7v-8c0-71.8-37-138.6-97.9-176.7l-60.2-37.6c-8.6-5.4-17.9-8.4-27.3-9.4L248.7%2048.8c-6.6-11.5-2.7-26.2%208.8-32.8s26.2-2.7%2032.8%208.8l78%20135.1c3.3%205.7%2010.7%207.7%2016.4%204.4s7.7-10.7%204.4-16.4l-62-107.4c-6.6-11.5-2.7-26.2%208.8-32.8S362%205%20368.6%2016.5l68%20117.8%200%200%200%200%2043.3%2075L480%20160c0-17.7%2014.4-32%2032-32s32%2014.4%2032%2032zM243.9%2088.5L268.5%20131c-13.9%204.5-26.4%2013.7-34.7%2027c-.9%201.4-1.7%202.9-2.5%204.4l-28.9-50c-6.6-11.5-2.7-26.2%208.8-32.8s26.2-2.7%2032.8%208.8zm-46.4%2063.7l26.8%2046.4c.6%206%202.1%2011.8%204.3%2017.4H224%20210.7l0%200H179l-23-39.8c-6.6-11.5-2.7-26.2%208.8-32.8s26.2-2.7%2032.8%208.8zM260.9%20175c9.4-15%2029.1-19.5%2044.1-10.2l60.2%2037.6C416.7%20234.7%20448%20291.2%20448%20352v8c0%2083.9-68.1%20152-152%20152H120c-13.3%200-24-10.7-24-24s10.7-24%2024-24h92c6.6%200%2012-5.4%2012-12s-5.4-12-12-12H88c-13.3%200-24-10.7-24-24s10.7-24%2024-24H212c6.6%200%2012-5.4%2012-12s-5.4-12-12-12H56c-13.3%200-24-10.7-24-24s10.7-24%2024-24H212c6.6%200%2012-5.4%2012-12s-5.4-12-12-12H88c-13.3%200-24-10.7-24-24s10.7-24%2024-24H224l0%200%200%200h93.2L271%20219.1c-15-9.4-19.5-29.1-10.2-44.1z%22%2F%3E%3C%2Fsvg%3E");
--bicon-leichte-sprache: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3C%21--%21Font%20Awesome%20Free%206.5.2%20by%20%40fontawesome%20-%20https%3A%2F%2Ffontawesome.com%20License%20-%20https%3A%2F%2Ffontawesome.com%2Flicense%2Ffree%20Copyright%202024%20Fonticons%2C%20Inc.--%3E%3Cpath%20d%3D%22M160%2096a96%2096%200%201%201%20192%200A96%2096%200%201%201%20160%2096zm80%20152V512l-48.4-24.2c-20.9-10.4-43.5-17-66.8-19.3l-96-9.6C12.5%20457.2%200%20443.5%200%20427V224c0-17.7%2014.3-32%2032-32H62.3c63.6%200%20125.6%2019.6%20177.7%2056zm32%20264V248c52.1-36.4%20114.1-56%20177.7-56H480c17.7%200%2032%2014.3%2032%2032V427c0%2016.4-12.5%2030.2-28.8%2031.8l-96%209.6c-23.2%202.3-45.9%208.9-66.8%2019.3L272%20512z%22%2F%3E%3C%2Fsvg%3E");
/* Hamburger */
--bicon-bars: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20448%20512%22%3E%3C%21--%21Font%20Awesome%20Free%206.5.2%20by%20%40fontawesome%20-%20https%3A%2F%2Ffontawesome.com%20License%20-%20https%3A%2F%2Ffontawesome.com%2Flicense%2Ffree%20Copyright%202024%20Fonticons%2C%20Inc.--%3E%3Cpath%20d%3D%22M16%20132h416c8.8%200%2016-7.2%2016-16V76c0-8.8-7.2-16-16-16H16C7.2%2060%200%2067.2%200%2076v40c0%208.8%207.2%2016%2016%2016zm0%20160h416c8.8%200%2016-7.2%2016-16v-40c0-8.8-7.2-16-16-16H16c-8.8%200-16%207.2-16%2016v40c0%208.8%207.2%2016%2016%2016zm0%20160h416c8.8%200%2016-7.2%2016-16v-40c0-8.8-7.2-16-16-16H16c-8.8%200-16%207.2-16%2016v40c0%208.8%207.2%2016%2016%2016z%22%2F%3E%3C%2Fsvg%3E");
/* Searchlens */
--bicon-search: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3C%21--%21Font%20Awesome%20Free%206.5.2%20by%20%40fontawesome%20-%20https%3A%2F%2Ffontawesome.com%20License%20-%20https%3A%2F%2Ffontawesome.com%2Flicense%2Ffree%20Copyright%202024%20Fonticons%2C%20Inc.--%3E%3Cpath%20d%3D%22M505%20442.7L405.3%20343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3%2044-79.7%2044-128C416%2093.1%20322.9%200%20208%200S0%2093.1%200%20208s93.1%20208%20208%20208c48.3%200%2092.7-16.4%20128-44v16.3c0%206.4%202.5%2012.5%207%2017l99.7%2099.7c9.4%209.4%2024.6%209.4%2033.9%200l28.3-28.3c9.4-9.4%209.4-24.6%20.1-34zM208%20336c-70.7%200-128-57.2-128-128%200-70.7%2057.2-128%20128-128%2070.7%200%20128%2057.2%20128%20128%200%2070.7-57.2%20128-128%20128z%22%2F%3E%3C%2Fsvg%3E");
/* Close */
--bicon-times: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20352%20512%22%3E%3C%21--%21Font%20Awesome%20Free%206.5.2%20by%20%40fontawesome%20-%20https%3A%2F%2Ffontawesome.com%20License%20-%20https%3A%2F%2Ffontawesome.com%2Flicense%2Ffree%20Copyright%202024%20Fonticons%2C%20Inc.--%3E%3Cpath%20d%3D%22M242.7%20256l100.1-100.1c12.3-12.3%2012.3-32.2%200-44.5l-22.2-22.2c-12.3-12.3-32.2-12.3-44.5%200L176%20189.3%2075.9%2089.2c-12.3-12.3-32.2-12.3-44.5%200L9.2%20111.5c-12.3%2012.3-12.3%2032.2%200%2044.5L109.3%20256%209.2%20356.1c-12.3%2012.3-12.3%2032.2%200%2044.5l22.2%2022.2c12.3%2012.3%2032.2%2012.3%2044.5%200L176%20322.7l100.1%20100.1c12.3%2012.3%2032.2%2012.3%2044.5%200l22.2-22.2c12.3-12.3%2012.3-32.2%200-44.5L242.7%20256z%22%2F%3E%3C%2Fsvg%3E");
/* Arrow (right) */
--bicon-arrow-right: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20448%20512%22%3E%3C%21--%21Font%20Awesome%20Free%206.5.2%20by%20%40fontawesome%20-%20https%3A%2F%2Ffontawesome.com%20License%20-%20https%3A%2F%2Ffontawesome.com%2Flicense%2Ffree%20Copyright%202024%20Fonticons%2C%20Inc.--%3E%3Cpath%20d%3D%22M190.5%2066.9l22.2-22.2c9.4-9.4%2024.6-9.4%2033.9%200L441%20239c9.4%209.4%209.4%2024.6%200%2033.9L246.6%20467.3c-9.4%209.4-24.6%209.4-33.9%200l-22.2-22.2c-9.5-9.5-9.3-25%20.4-34.3L311.4%20296H24c-13.3%200-24-10.7-24-24v-32c0-13.3%2010.7-24%2024-24h287.4L190.9%20101.2c-9.8-9.3-10-24.8-.4-34.3z%22%2F%3E%3C%2Fsvg%3E");
/* Chevron (right) */
--bicon-chevron-right: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20320%20512%22%3E%3C%21--%21Font%20Awesome%20Free%206.5.2%20by%20%40fontawesome%20-%20https%3A%2F%2Ffontawesome.com%20License%20-%20https%3A%2F%2Ffontawesome.com%2Flicense%2Ffree%20Copyright%202024%20Fonticons%2C%20Inc.--%3E%3Cpath%20d%3D%22M285.5%20273L91.1%20467.3c-9.4%209.4-24.6%209.4-33.9%200l-22.7-22.7c-9.4-9.4-9.4-24.5%200-33.9L188.5%20256%2034.5%20101.3c-9.3-9.4-9.3-24.5%200-33.9l22.7-22.7c9.4-9.4%2024.6-9.4%2033.9%200L285.5%20239c9.4%209.4%209.4%2024.6%200%2033.9z%22%2F%3E%3C%2Fsvg%3E");
}
.bicon-universal-access:before {
-webkit-mask-image: var(--bicon-universal-access);
mask-image: var(--bicon-universal-access);
}
.bicon-dgs:before {
-webkit-mask-image: var(--bicon-dgs);
mask-image: var(--bicon-dgs);
transform: scaleX(-1);
font-size: 1.32em;
vertical-align: -0.1em;
}
.bicon-leichte-sprache:before {
-webkit-mask-image: var(--bicon-leichte-sprache);
mask-image: var(--bicon-leichte-sprache);
font-size: 1.2em;
vertical-align: -0.1em;
}
.bicon-bars:before {
-webkit-mask-image: var(--bicon-bars);
mask-image: var(--bicon-bars);
}
.bicon-search:before {
-webkit-mask-image: var(--bicon-search);
mask-image: var(--bicon-search);
}
.bicon-times:before {
-webkit-mask-image: var(--bicon-times);
mask-image: var(--bicon-times);
}
[class*=bicon-arrow-]:before {
-webkit-mask-image: var(--bicon-arrow-right);
mask-image: var(--bicon-arrow-right);
}
.bicon-arrow-right:before {
transform: rotate(0deg);
}
.bicon-arrow-left:before {
transform: rotate(180deg);
}
.bicon-arrow-up:before {
transform: rotate(-90deg);
}
.bicon-arrow-down:before {
transform: rotate(90deg);
}
[class*=bicon-chevron-]:before {
-webkit-mask-image: var(--bicon-chevron-right);
mask-image: var(--bicon-chevron-right);
}
.bicon-chevron-right:before {
transform: rotate(0deg);
}
.bicon-chevron-left:before {
transform: rotate(180deg);
}
.bicon-chevron-up:before {
transform: rotate(-90deg);
}
.bicon-chevron-down:before {
transform: rotate(90deg);
}
:root {
--bicon-square-caret-left: url(./e5cd104ff59d14e01a8e.svg);
--bicon-square-caret-right: url(./96f328857def6cf315a4.svg);
--bicon-square-caret-up: url(./b16407e0b2caab873c9c.svg);
--bicon-square-caret-down: url(./ddeb6405d90b5f0e0551.svg);
--bicon-caret-left: url(./3878a9f5796d1b43cf8c.svg);
--bicon-caret-right: url(./17e21db418f62aa7f403.svg);
--bicon-caret-up: url(./5a4e2ed7750327ef2c6c.svg);
--bicon-caret-down: url(./bd1e0aee830b4cf6f61c.svg);
--bicon-external-link: url(./074333a7dd2f49feac2b.svg);
--bicon-twitter: url(./ff51b2e2c80bbaa38ece.svg);
--bicon-x-twitter: url(./1d1af57de05b5af04be6.svg);
--bicon-square-x-twitter: url(./d9d0f6180d3be15f194b.svg);
--bicon-facebook: url(./a67116019d3be6e37c85.svg);
--bicon-square-facebook: url(./50ea39574504b899988e.svg);
--bicon-instagram: url(./85159f0aa30425cba5c5.svg);
--bicon-square-instagram: url(./45a23558bb34616201c6.svg);
--bicon-snapchat: url(./89dbcdf25f86cd473fa9.svg);
--bicon-square-snapchat: url(./e8f4e33418139c42b4aa.svg);
--bicon-whatsapp: url(./babb55e5a879775c6ad3.svg);
--bicon-square-whatsapp: url(./4a7b8a0d53880c8593aa.svg);
--bicon-xing: url(./4b31d06a2ea65fe7756c.svg);
--bicon-square-xing: url(./a6aace306ea7f2807237.svg);
--bicon-square-flickr: url(./f801fdcc964ebea543fb.svg);
--bicon-youtube: url(./47c5e8fabf53724d4305.svg);
--bicon-square-youtube: url(./ddbcd29c2bbca8b91f45.svg);
--bicon-printerest: url(./db04c872c5c70b97903d.svg);
--bicon-threads: url(./054ab270e2106eab12d1.svg);
--bicon-square-threads: url(./14534455330c87330fbb.svg);
--bicon-square-printerest: url(./8ae4656632befdcfc893.svg);
--bicon-linkedin: url(./7420143e54b58cf14982.svg);
--bicon-square-linkedin: url(./5a26eea71b866e043827.svg);
--bicon-bluesky: url(./bb724a1cc44676491342.svg);
--bicon-square-bluesky: url(./c7d0593e030bd21a63d1.svg);
--bicon-flickr: url(./d1e06034ff1be860509b.svg);
--bicon-mastodon: url(./9fba30cc32fd3a342a81.svg);
--bicon-download: url(./b968a092d0f57c913b81.svg);
--bicon-play: url(./cf0b2458874fe4df59a6.svg);
--bicon-pause: url(./03b5e940a0673a29a2d1.svg);
--bicon-cart: url(./3583215fe99af26b6c9e.svg);
--bicon-sliders: url(./1d7ede2d752776da8910.svg);
--bicon-desktop: url(./a6da65197400b6acf980.svg);
--bicon-phone: url(./88b9d81d6be3703b7186.svg);
--bicon-mobile: url(./7798f5adec3dd6403fc7.svg);
--bicon-fax: url(./b550caa92fe46c2c8e4e.svg);
--bicon-envelope: url(./0d62483196704ba4c326.svg);
--bicon-map: url(./6ff7d119d7b13fa655ed.svg);
--bicon-map-marker: url(./b10ac18e9dbc648f3883.svg);
--bicon-calendar: url(./8d7e4d41d09e69e1e328.svg);
--bicon-info: url(./da856135c97ca8adef2f.svg);
--bicon-home: url(./cb5efede18b66e48f22b.svg);
--bicon-plus: url(./7655e4cf3016b929f890.svg);
--bicon-rss: url(./1421c3e916945bcbf551.svg);
--bicon-id-card: url(./80aeb2aa3b8f0a9e79f2.svg);
--bicon-lock: url(./ae4fc006308721f44c85.svg);
--bicon-lock-open: url(./b23e5830d2ea7a29ebfb.svg);
--bicon-print: url(./056fec3b4337d0dee263.svg);
--bicon-user: url(./34279d51e32dd4203f5b.svg);
--bicon-user-check: url(./44c26a0d8c3f489b7c40.svg);
--bicon-login: url(./490cf97502ccc4eece82.svg);
--bicon-logout: url(./37e41bd9638a017bd33d.svg);
--bicon-edit: url(./473734913994af3f2a16.svg);
--bicon-trash: url(./7718ad0a5173c4a89e40.svg);
--bicon-heart: url(./c112aebb4f34b6e5a69e.svg);
--bicon-plane: url(./794f85fecb704a25af5a.svg);
--bicon-train: url(./16f47bbba7fdc5a7727e.svg);
--bicon-building: url(./842b7f5db69a85db9b97.svg);
--bicon-file: url(./81f54534d94891928d03.svg);
--bicon-lightbulb: url(./e0b6a190b30f5fb7ebd4.svg);
--bicon-gear: url(./0d170579c1e397e19e20.svg);
--bicon-wrench: url(./6494dbf32c9534022566.svg);
--bicon-triangle-exclamation: url(./95a7389fb485c535d811.svg);
--bicon-clock: url(./0b96e6b3c52cd962f94b.svg);
--bicon-rocket: url(./2fca1f0cec8993b8d3a3.svg);
--bicon-landmark: url(./c67d256edd9a51b0f4ce.svg);
--bicon-check: url(./4263d2ee1ce98641113e.svg);
--bicon-circle: url(./092462fc01d37ae8b7a8.svg);
--bicon-check-circle: url(./0484fea39009a008ab64.svg);
--bicon-times-circle: url(./d7bd0703e89d720c5b26.svg);
--bicon-info-circle: url(./b2de0fdcf984edb73049.svg);
--bicon-clock-circle: url(./6bc02dc423ca8fdcb263.svg);
--bicon-maximize: url(./3c9a553b657e0343a988.svg);
--bicon-quote-left: url(./34e9aa38da23dd0d0f0a.svg);
--bicon-circle-down: url(./171e534516ad588ab4e2.svg);
--bicon-star-half-stroke: url(./4efca39cc9e9535cf8ab.svg);
--bicon-star-solid: url(./8743019f37bfd7e54a55.svg);
--bicon-star: url(./89dfeb5f04427b1a507c.svg);
--bicon-ticket: url(./55992f95f869bac3aa3c.svg);
--bicon-euro-sign: url(./eac586e9befc85bc50b9.svg);
--bicon-hourglass: url(./44aeca4f9062b27b5baa.svg);
--bicon-seeding: url(./3ef27c54c5e3bc54466c.svg);
--bicon-tablet: url(./7c5c4fa4546d581aaf39.svg);
--bicon-comment: url(./1439dd1a2c706f556f07.svg);
--bicon-comments: url(./6c65cd5ff319dad35605.svg);
--bicon-comment-dots: url(./ac452052e284b3aef4e4.svg);
}
/*
* More icons from svg file (images/icons/bicons) (classname == filename) (see setting_default for list of iconnames)
* (generates css class (.bicon-iconname) for each icon)
*/
.bicon-square-caret-left:before {
-webkit-mask-image: url(./e5cd104ff59d14e01a8e.svg);
mask-image: url(./e5cd104ff59d14e01a8e.svg);
}
.bicon-square-caret-right:before {
-webkit-mask-image: url(./96f328857def6cf315a4.svg);
mask-image: url(./96f328857def6cf315a4.svg);
}
.bicon-square-caret-up:before {
-webkit-mask-image: url(./b16407e0b2caab873c9c.svg);
mask-image: url(./b16407e0b2caab873c9c.svg);
}
.bicon-square-caret-down:before {
-webkit-mask-image: url(./ddeb6405d90b5f0e0551.svg);
mask-image: url(./ddeb6405d90b5f0e0551.svg);
}
.bicon-caret-left:before {
-webkit-mask-image: url(./3878a9f5796d1b43cf8c.svg);
mask-image: url(./3878a9f5796d1b43cf8c.svg);
}
.bicon-caret-right:before {
-webkit-mask-image: url(./17e21db418f62aa7f403.svg);
mask-image: url(./17e21db418f62aa7f403.svg);
}
.bicon-caret-up:before {
-webkit-mask-image: url(./5a4e2ed7750327ef2c6c.svg);
mask-image: url(./5a4e2ed7750327ef2c6c.svg);
}
.bicon-caret-down:before {
-webkit-mask-image: url(./bd1e0aee830b4cf6f61c.svg);
mask-image: url(./bd1e0aee830b4cf6f61c.svg);
}
.bicon-external-link:before {
-webkit-mask-image: url(./074333a7dd2f49feac2b.svg);
mask-image: url(./074333a7dd2f49feac2b.svg);
}
.bicon-twitter:before {
-webkit-mask-image: url(./ff51b2e2c80bbaa38ece.svg);
mask-image: url(./ff51b2e2c80bbaa38ece.svg);
}
.bicon-x-twitter:before {
-webkit-mask-image: url(./1d1af57de05b5af04be6.svg);
mask-image: url(./1d1af57de05b5af04be6.svg);
}
.bicon-square-x-twitter:before {
-webkit-mask-image: url(./d9d0f6180d3be15f194b.svg);
mask-image: url(./d9d0f6180d3be15f194b.svg);
}
.bicon-facebook:before {
-webkit-mask-image: url(./a67116019d3be6e37c85.svg);
mask-image: url(./a67116019d3be6e37c85.svg);
}
.bicon-square-facebook:before {
-webkit-mask-image: url(./50ea39574504b899988e.svg);
mask-image: url(./50ea39574504b899988e.svg);
}
.bicon-instagram:before {
-webkit-mask-image: url(./85159f0aa30425cba5c5.svg);
mask-image: url(./85159f0aa30425cba5c5.svg);
}
.bicon-square-instagram:before {
-webkit-mask-image: url(./45a23558bb34616201c6.svg);
mask-image: url(./45a23558bb34616201c6.svg);
}
.bicon-snapchat:before {
-webkit-mask-image: url(./89dbcdf25f86cd473fa9.svg);
mask-image: url(./89dbcdf25f86cd473fa9.svg);
}
.bicon-square-snapchat:before {
-webkit-mask-image: url(./e8f4e33418139c42b4aa.svg);
mask-image: url(./e8f4e33418139c42b4aa.svg);
}
.bicon-whatsapp:before {
-webkit-mask-image: url(./babb55e5a879775c6ad3.svg);
mask-image: url(./babb55e5a879775c6ad3.svg);
}
.bicon-square-whatsapp:before {
-webkit-mask-image: url(./4a7b8a0d53880c8593aa.svg);
mask-image: url(./4a7b8a0d53880c8593aa.svg);
}
.bicon-xing:before {
-webkit-mask-image: url(./4b31d06a2ea65fe7756c.svg);
mask-image: url(./4b31d06a2ea65fe7756c.svg);
}
.bicon-square-xing:before {
-webkit-mask-image: url(./a6aace306ea7f2807237.svg);
mask-image: url(./a6aace306ea7f2807237.svg);
}
.bicon-square-flickr:before {
-webkit-mask-image: url(./f801fdcc964ebea543fb.svg);
mask-image: url(./f801fdcc964ebea543fb.svg);
}
.bicon-youtube:before {
-webkit-mask-image: url(./47c5e8fabf53724d4305.svg);
mask-image: url(./47c5e8fabf53724d4305.svg);
}
.bicon-square-youtube:before {
-webkit-mask-image: url(./ddbcd29c2bbca8b91f45.svg);
mask-image: url(./ddbcd29c2bbca8b91f45.svg);
}
.bicon-printerest:before {
-webkit-mask-image: url(./db04c872c5c70b97903d.svg);
mask-image: url(./db04c872c5c70b97903d.svg);
}
.bicon-threads:before {
-webkit-mask-image: url(./054ab270e2106eab12d1.svg);
mask-image: url(./054ab270e2106eab12d1.svg);
}
.bicon-square-threads:before {
-webkit-mask-image: url(./14534455330c87330fbb.svg);
mask-image: url(./14534455330c87330fbb.svg);
}
.bicon-square-printerest:before {
-webkit-mask-image: url(./8ae4656632befdcfc893.svg);
mask-image: url(./8ae4656632befdcfc893.svg);
}
.bicon-linkedin:before {
-webkit-mask-image: url(./7420143e54b58cf14982.svg);
mask-image: url(./7420143e54b58cf14982.svg);
}
.bicon-square-linkedin:before {
-webkit-mask-image: url(./5a26eea71b866e043827.svg);
mask-image: url(./5a26eea71b866e043827.svg);
}
.bicon-bluesky:before {
-webkit-mask-image: url(./bb724a1cc44676491342.svg);
mask-image: url(./bb724a1cc44676491342.svg);
}
.bicon-square-bluesky:before {
-webkit-mask-image: url(./c7d0593e030bd21a63d1.svg);
mask-image: url(./c7d0593e030bd21a63d1.svg);
}
.bicon-flickr:before {
-webkit-mask-image: url(./d1e06034ff1be860509b.svg);
mask-image: url(./d1e06034ff1be860509b.svg);
}
.bicon-mastodon:before {
-webkit-mask-image: url(./9fba30cc32fd3a342a81.svg);
mask-image: url(./9fba30cc32fd3a342a81.svg);
}
.bicon-download:before {
-webkit-mask-image: url(./b968a092d0f57c913b81.svg);
mask-image: url(./b968a092d0f57c913b81.svg);
}
.bicon-play:before {
-webkit-mask-image: url(./cf0b2458874fe4df59a6.svg);
mask-image: url(./cf0b2458874fe4df59a6.svg);
}
.bicon-pause:before {
-webkit-mask-image: url(./03b5e940a0673a29a2d1.svg);
mask-image: url(./03b5e940a0673a29a2d1.svg);
}
.bicon-cart:before {
-webkit-mask-image: url(./3583215fe99af26b6c9e.svg);
mask-image: url(./3583215fe99af26b6c9e.svg);
}
.bicon-sliders:before {
-webkit-mask-image: url(./1d7ede2d752776da8910.svg);
mask-image: url(./1d7ede2d752776da8910.svg);
}
.bicon-desktop:before {
-webkit-mask-image: url(./a6da65197400b6acf980.svg);
mask-image: url(./a6da65197400b6acf980.svg);
}
.bicon-phone:before {
-webkit-mask-image: url(./88b9d81d6be3703b7186.svg);
mask-image: url(./88b9d81d6be3703b7186.svg);
}
.bicon-mobile:before {
-webkit-mask-image: url(./7798f5adec3dd6403fc7.svg);
mask-image: url(./7798f5adec3dd6403fc7.svg);
}
.bicon-fax:before {
-webkit-mask-image: url(./b550caa92fe46c2c8e4e.svg);
mask-image: url(./b550caa92fe46c2c8e4e.svg);
}
.bicon-envelope:before {
-webkit-mask-image: url(./0d62483196704ba4c326.svg);
mask-image: url(./0d62483196704ba4c326.svg);
}
.bicon-map:before {
-webkit-mask-image: url(./6ff7d119d7b13fa655ed.svg);
mask-image: url(./6ff7d119d7b13fa655ed.svg);
}
.bicon-map-marker:before {
-webkit-mask-image: url(./b10ac18e9dbc648f3883.svg);
mask-image: url(./b10ac18e9dbc648f3883.svg);
}
.bicon-calendar:before {
-webkit-mask-image: url(./8d7e4d41d09e69e1e328.svg);
mask-image: url(./8d7e4d41d09e69e1e328.svg);
}
.bicon-info:before {
-webkit-mask-image: url(./da856135c97ca8adef2f.svg);
mask-image: url(./da856135c97ca8adef2f.svg);
}
.bicon-home:before {
-webkit-mask-image: url(./cb5efede18b66e48f22b.svg);
mask-image: url(./cb5efede18b66e48f22b.svg);
}
.bicon-plus:before {
-webkit-mask-image: url(./7655e4cf3016b929f890.svg);
mask-image: url(./7655e4cf3016b929f890.svg);
}
.bicon-rss:before {
-webkit-mask-image: url(./1421c3e916945bcbf551.svg);
mask-image: url(./1421c3e916945bcbf551.svg);
}
.bicon-id-card:before {
-webkit-mask-image: url(./80aeb2aa3b8f0a9e79f2.svg);
mask-image: url(./80aeb2aa3b8f0a9e79f2.svg);
}
.bicon-lock:before {
-webkit-mask-image: url(./ae4fc006308721f44c85.svg);
mask-image: url(./ae4fc006308721f44c85.svg);
}
.bicon-lock-open:before {
-webkit-mask-image: url(./b23e5830d2ea7a29ebfb.svg);
mask-image: url(./b23e5830d2ea7a29ebfb.svg);
}
.bicon-print:before {
-webkit-mask-image: url(./056fec3b4337d0dee263.svg);
mask-image: url(./056fec3b4337d0dee263.svg);
}
.bicon-user:before {
-webkit-mask-image: url(./34279d51e32dd4203f5b.svg);
mask-image: url(./34279d51e32dd4203f5b.svg);
}
.bicon-user-check:before {
-webkit-mask-image: url(./44c26a0d8c3f489b7c40.svg);
mask-image: url(./44c26a0d8c3f489b7c40.svg);
}
.bicon-login:before {
-webkit-mask-image: url(./490cf97502ccc4eece82.svg);
mask-image: url(./490cf97502ccc4eece82.svg);
}
.bicon-logout:before {
-webkit-mask-image: url(./37e41bd9638a017bd33d.svg);
mask-image: url(./37e41bd9638a017bd33d.svg);
}
.bicon-edit:before {
-webkit-mask-image: url(./473734913994af3f2a16.svg);
mask-image: url(./473734913994af3f2a16.svg);
}
.bicon-trash:before {
-webkit-mask-image: url(./7718ad0a5173c4a89e40.svg);
mask-image: url(./7718ad0a5173c4a89e40.svg);
}
.bicon-heart:before {
-webkit-mask-image: url(./c112aebb4f34b6e5a69e.svg);
mask-image: url(./c112aebb4f34b6e5a69e.svg);
}
.bicon-plane:before {
-webkit-mask-image: url(./794f85fecb704a25af5a.svg);
mask-image: url(./794f85fecb704a25af5a.svg);
}
.bicon-train:before {
-webkit-mask-image: url(./16f47bbba7fdc5a7727e.svg);
mask-image: url(./16f47bbba7fdc5a7727e.svg);
}
.bicon-building:before {
-webkit-mask-image: url(./842b7f5db69a85db9b97.svg);
mask-image: url(./842b7f5db69a85db9b97.svg);
}
.bicon-file:before {
-webkit-mask-image: url(./81f54534d94891928d03.svg);
mask-image: url(./81f54534d94891928d03.svg);
}
.bicon-lightbulb:before {
-webkit-mask-image: url(./e0b6a190b30f5fb7ebd4.svg);
mask-image: url(./e0b6a190b30f5fb7ebd4.svg);
}
.bicon-gear:before {
-webkit-mask-image: url(./0d170579c1e397e19e20.svg);
mask-image: url(./0d170579c1e397e19e20.svg);
}
.bicon-wrench:before {
-webkit-mask-image: url(./6494dbf32c9534022566.svg);
mask-image: url(./6494dbf32c9534022566.svg);
}
.bicon-triangle-exclamation:before {
-webkit-mask-image: url(./95a7389fb485c535d811.svg);
mask-image: url(./95a7389fb485c535d811.svg);
}
.bicon-clock:before {
-webkit-mask-image: url(./0b96e6b3c52cd962f94b.svg);
mask-image: url(./0b96e6b3c52cd962f94b.svg);
}
.bicon-rocket:before {
-webkit-mask-image: url(./2fca1f0cec8993b8d3a3.svg);
mask-image: url(./2fca1f0cec8993b8d3a3.svg);
}
.bicon-landmark:before {
-webkit-mask-image: url(./c67d256edd9a51b0f4ce.svg);
mask-image: url(./c67d256edd9a51b0f4ce.svg);
}
.bicon-check:before {
-webkit-mask-image: url(./4263d2ee1ce98641113e.svg);
mask-image: url(./4263d2ee1ce98641113e.svg);
}
.bicon-circle:before {
-webkit-mask-image: url(./092462fc01d37ae8b7a8.svg);
mask-image: url(./092462fc01d37ae8b7a8.svg);
}
.bicon-check-circle:before {
-webkit-mask-image: url(./0484fea39009a008ab64.svg);
mask-image: url(./0484fea39009a008ab64.svg);
}
.bicon-times-circle:before {
-webkit-mask-image: url(./d7bd0703e89d720c5b26.svg);
mask-image: url(./d7bd0703e89d720c5b26.svg);
}
.bicon-info-circle:before {
-webkit-mask-image: url(./b2de0fdcf984edb73049.svg);
mask-image: url(./b2de0fdcf984edb73049.svg);
}
.bicon-clock-circle:before {
-webkit-mask-image: url(./6bc02dc423ca8fdcb263.svg);
mask-image: url(./6bc02dc423ca8fdcb263.svg);
}
.bicon-maximize:before {
-webkit-mask-image: url(./3c9a553b657e0343a988.svg);
mask-image: url(./3c9a553b657e0343a988.svg);
}
.bicon-quote-left:before {
-webkit-mask-image: url(./34e9aa38da23dd0d0f0a.svg);
mask-image: url(./34e9aa38da23dd0d0f0a.svg);
}
.bicon-circle-down:before {
-webkit-mask-image: url(./171e534516ad588ab4e2.svg);
mask-image: url(./171e534516ad588ab4e2.svg);
}
.bicon-star-half-stroke:before {
-webkit-mask-image: url(./4efca39cc9e9535cf8ab.svg);
mask-image: url(./4efca39cc9e9535cf8ab.svg);
}
.bicon-star-solid:before {
-webkit-mask-image: url(./8743019f37bfd7e54a55.svg);
mask-image: url(./8743019f37bfd7e54a55.svg);
}
.bicon-star:before {
-webkit-mask-image: url(./89dfeb5f04427b1a507c.svg);
mask-image: url(./89dfeb5f04427b1a507c.svg);
}
.bicon-ticket:before {
-webkit-mask-image: url(./55992f95f869bac3aa3c.svg);
mask-image: url(./55992f95f869bac3aa3c.svg);
}
.bicon-euro-sign:before {
-webkit-mask-image: url(./eac586e9befc85bc50b9.svg);
mask-image: url(./eac586e9befc85bc50b9.svg);
}
.bicon-hourglass:before {
-webkit-mask-image: url(./44aeca4f9062b27b5baa.svg);
mask-image: url(./44aeca4f9062b27b5baa.svg);
}
.bicon-seeding:before {
-webkit-mask-image: url(./3ef27c54c5e3bc54466c.svg);
mask-image: url(./3ef27c54c5e3bc54466c.svg);
}
.bicon-tablet:before {
-webkit-mask-image: url(./7c5c4fa4546d581aaf39.svg);
mask-image: url(./7c5c4fa4546d581aaf39.svg);
}
.bicon-comment:before {
-webkit-mask-image: url(./1439dd1a2c706f556f07.svg);
mask-image: url(./1439dd1a2c706f556f07.svg);
}
.bicon-comments:before {
-webkit-mask-image: url(./6c65cd5ff319dad35605.svg);
mask-image: url(./6c65cd5ff319dad35605.svg);
}
.bicon-comment-dots:before {
-webkit-mask-image: url(./ac452052e284b3aef4e4.svg);
mask-image: url(./ac452052e284b3aef4e4.svg);
}
.bicon-2x {
font-size: 2em;
}
.bicon-3x {
font-size: 3em;
}
.bicon-4x {
font-size: 4em;
}
.bicon-5x {
font-size: 5em;
}
.bicon-6x {
font-size: 6em;
}
*[role=button] {
cursor: pointer;
}
button {
font-family: Arial, sans-serif;
font-size: 1em;
cursor: pointer;
/*&:focus {
// We use a better focus management for accessability (focus-visible)
outline-offset: -3px;
}*/
}
/* DEFAULT BUTTON */
.button {
min-height: 43px;
width: auto;
border-radius: 0px;
/* margin: $buttonMargin; // not here */
text-decoration: none;
padding: 10px 16px;
font-size: 1em;
line-height: 1.2;
display: inline-block;
text-align: center;
justify-content: center;
cursor: pointer;
overflow: visible;
background-color: #ffffff;
color: #000000;
border: 2px solid #000000;
transition: background-color 0.2s ease-out;
position: relative;
padding-right: 59px;
}
.button:not(:disabled):hover {
text-decoration: none;
background-color: rgb(242.25, 242.25, 242.25);
}
.button:not(:disabled):focus {
text-decoration: none;
background-color: rgb(242.25, 242.25, 242.25);
}
.button:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 18px;
height: 18px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-arrow-right);
mask-image: var(--bicon-arrow-right);
color: #ffffff;
}
.button:after {
pointer-events: none;
margin: 10.5px;
}
.button:before {
content: "";
background: #000000;
border-left: 2px solid #000000;
width: 39px;
height: 100%;
}
.button:before, .button:after {
position: absolute;
right: 0;
top: 0;
display: inline-flex;
line-height: 2em;
justify-content: center;
align-items: center;
}
.button.button--clean, .button.button--light, .button.button--white, .button.input {
padding-right: 16px;
}
.button.button--clean:after, .button.button--clean:before, .button.button--light:after, .button.button--light:before, .button.button--white:after, .button.button--white:before, .button.input:after, .button.input:before {
display: none !important;
}
a:visited.button,
a:link.button {
color: #000000;
}
button.link {
background: transparent;
border: 0 none;
color: #165BE0;
padding: 0;
margin: 0;
text-align: left;
height: auto;
cursor: pointer;
font-size: 1em;
}
button.link:hover {
text-decoration: underline;
}
a.button.button--disabled,
button.disabled,
button.button[disabled],
.button:disabled {
opacity: 0.5 !important;
background-color: #ffffff;
border-color: #aaaaaa;
color: #000000;
cursor: not-allowed !important;
}
a.button.button--disabled:before,
button.disabled:before,
button.button[disabled]:before,
.button:disabled:before {
background: rgb(195.5, 195.5, 195.5);
border-color: #aaaaaa;
}
.button.button--fullwidth {
width: 100%;
}
@media screen and (max-width: 37.5rem) {
.button.button--fullwidth-palm {
width: 100%;
}
}
.button.button--clean {
background: transparent;
border: 1px solid transparent;
padding-right: 16px;
/*
&:hover,
&:focus {
// background-color: transparent !important; // No, we want hover effect
}
*/
}
.button.button--clean:before {
background: transparent;
border-width: 0px;
}
.button.button--light {
background: #ffffff;
border: 2px solid #000000;
color: #000000;
padding-right: 16px !important;
}
.button.button--light:after {
display: none;
}
.button.button--light:not(:disabled):hover {
background-color: rgb(242.25, 242.25, 242.25);
}
.button.button--light:not(:disabled):focus {
background-color: rgb(242.25, 242.25, 242.25);
}
.button.button--light:disabled {
border-color: #aaaaaa;
background: #ffffff;
}
.button.button--white {
background-color: #ffffff;
border-width: 0;
border-color: #ffffff;
color: #000000;
}
.button.button--white:not(:disabled):hover {
background-color: rgb(242.25, 242.25, 242.25);
}
.button.button--white:not(:disabled):focus {
background-color: rgb(242.25, 242.25, 242.25);
}
.button.button--fulltone {
background: #000000;
border-width: 0px;
color: #ffffff;
padding-right: 16px;
}
.button.button--fulltone:not(:disabled):hover {
background: rgb(25.5, 25.5, 25.5);
}
.button.button--fulltone:not(:disabled):focus {
background: rgb(25.5, 25.5, 25.5);
}
.button.button--fulltone:disabled {
background: #aaaaaa;
color: #ffffff;
}
.button.button--fulltone:before {
display: none;
}
.button.button--fulltone:after {
position: relative;
color: #ffffff;
background: #ffffff;
margin: 0 0 0 8px;
line-height: normal;
}
.button.button--negative {
background-color: transparent !important;
border: 2px solid #ffffff !important;
color: #ffffff !important;
}
.button.button--negative:hover, .button.button--negative:focus {
background-color: transparent !important;
}
.button.button--negative:before {
background: transparent !important;
border-width: 2px;
border-color: #ffffff !important;
}
.button.button--negative:after {
background: #ffffff !important;
}
.button.button--colored {
border-color: #000000;
}
.button.button--colored:disabled {
border-color: #aaaaaa;
}
/* SPECIAL */
.button.button--play:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 18px;
height: 18px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: url(./cf0b2458874fe4df59a6.svg);
mask-image: url(./cf0b2458874fe4df59a6.svg);
}
.button.button--play:after {
margin-left: 0.6em;
}
.button.button--download:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 18px;
height: 18px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: url(./b968a092d0f57c913b81.svg);
mask-image: url(./b968a092d0f57c913b81.svg);
}
.button.button--download:after {
margin-left: 0.6em;
}
.button.button--search:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 18px;
height: 18px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-search);
mask-image: var(--bicon-search);
}
.button.button--search:after {
margin-left: 0.6em;
}
.button.button--filter:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 18px;
height: 18px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: url(./1d7ede2d752776da8910.svg);
mask-image: url(./1d7ede2d752776da8910.svg);
}
.button.button--filter:after {
margin-left: 0.6em;
}
.button.button--addtocart {
display: flex;
}
.button.button--addtocart:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 18px;
height: 18px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: url(./3583215fe99af26b6c9e.svg);
mask-image: url(./3583215fe99af26b6c9e.svg);
}
.button.button--addtocart:after {
margin-left: 0.6em;
}
.button.button--close {
background: transparent;
border: 1px solid transparent;
padding-right: 16px;
/*
&:hover,
&:focus {
// background-color: transparent !important; // No, we want hover effect
}
*/
padding: 0;
}
.button.button--close:before {
background: transparent;
border-width: 0px;
}
.button.button--close:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 2em;
height: 2em;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-times);
mask-image: var(--bicon-times);
color: #000000;
}
.button.button--close:after {
border: 0 none;
position: static;
margin: 0;
}
.button.button--booking {
display: flex;
}
.button.button--booking .price {
border-right: 1px solid rgba(0, 0, 0, 0.6);
margin-right: 0.7em;
padding-right: 0.7em;
}
.button.button--extern:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 18px;
height: 18px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: url(./074333a7dd2f49feac2b.svg);
mask-image: url(./074333a7dd2f49feac2b.svg);
}
.button.button--extern:after {
margin-left: 0.6em;
}
h1,
h2,
h3,
h4,
h5 {
font-weight: bold;
color: #000000;
border: 0 none;
padding-top: 0;
padding-bottom: 0;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a {
font-weight: inherit;
color: inherit;
}
h1 {
font-size: 1.6875em;
color: #000000;
margin-top: 1.5em;
margin-bottom: 1.3em;
line-height: 1.148em;
font-weight: 700;
}
@media print {
h1 {
page-break-after: avoid !important;
}
}
h2 {
font-size: 1.375em;
color: #000000;
margin: 50px 0 0.75em 0;
line-height: 1.182em;
font-weight: 700;
}
@media print {
h2 {
page-break-before: auto;
page-break-after: avoid !important;
}
}
h3 {
font-size: 1.0625em;
margin-top: 1em;
margin-bottom: 0.4em;
line-height: 1.353em;
color: #000000;
font-weight: 700;
}
h3 a {
color: #165BE0;
}
@media print {
h3 {
page-break-before: auto;
page-break-after: avoid !important;
}
}
h4 {
font-size: 1em;
margin-top: 1em;
margin-bottom: 0.4em;
color: #000000;
font-weight: 700;
line-height: 24px;
}
h4 a {
color: #165BE0;
}
@media print {
h4 {
page-break-after: avoid;
}
}
hr {
height: 0px;
background: transparent;
border-color: #dddddd;
border-width: 0 0 1px 0;
margin: 50px 0;
}
hr.colored {
border-color: #000000;
border-width: 0 0 1px 0;
}
hr.strong {
border-color: #000000;
border-width: 0 0 2px 0;
}
hr.medium-space {
margin: 20px 0;
}
/* Pre 2021 */
/******************************************
* Miscicon (land pre 2021 markup)
******************************************/
.misc-icon {
width: auto;
height: auto;
vertical-align: middle;
display: inline-block !important;
}
.misc-icon.d3x2 {
width: 1.8465em;
}
.misc-icon.d2x1 {
width: 2.462em;
}
.misc-icon[src*=logo_berlin_m] {
/* neue marke berlin */
width: 4em;
}
[class*=misc-icon-] {
background-size: contain;
background-position: 50%;
background-repeat: no-repeat;
position: relative;
display: inline-block;
width: auto;
line-height: 1.231em;
height: 1.231em;
border: 0 none;
min-width: 1.231em;
min-height: 19px;
max-height: 36px;
vertical-align: middle;
}
.misc-icon-email_signiert {
background-image: url(./dafc887bc2ed306cc06a.svg);
}
.misc-icon-land_logo {
background-image: url(./179b0e3c90d772ae1f73.svg);
}
.misc-icon-beberlin_logo {
background-image: url(./1287b2151c71cdb44a4b.svg);
}
.misc-icon-pikt_ticket {
background-image: url(./ae1712373ccf4b4f77a3.svg);
}
.misc-icon-audit {
background-image: url(./fc92509e330afeba3ad1.svg);
}
.misc-icon-appstore_icon {
background-image: url(./98518096d7cd05113c45.svg);
}
.misc-icon-ec_pin_pad {
background-image: url(./5c8900c47ce4413c1dd3.svg);
}
.misc-icon-dgs {
background-image: url(./dbbf9b68e3b334929f48.svg);
}
.misc-icon-leichtesprache {
background-image: url(./a25659cf6956182598c9.svg);
}
/********************************************************/
/* Traffic icons (land pre 2021 markup) */
/********************************************************/
.traffic-icon {
background-size: contain;
background-position: 50%;
background-repeat: no-repeat;
display: inline-block !important;
height: 16px;
width: 16px;
border: 0 none;
vertical-align: text-bottom;
}
.traffic-icon:before {
content: " ";
}
.traffic-icon-bahn {
background-image: url(./5c0317a0cbf953c763cb.svg);
}
.traffic-icon-bus {
background-image: url(./e1b7dc3265c260f4e655.svg);
}
.traffic-icon-bvg {
background-image: url(./40cbbc20a3207857f1bd.svg);
}
.traffic-icon-faehre {
background-image: url(./95f27c2a3d4f20e723f8.svg);
}
.traffic-icon-metrobus {
background-image: url(./69543f74c5472c47699a.svg);
}
.traffic-icon-sbahn {
background-image: url(./114e388096f67f2fe7d1.svg);
}
.traffic-icon-tram {
background-image: url(./569b8c82728f72653363.svg);
}
.traffic-icon-ubahn {
background-image: url(./9caa17489e2b1454d3d8.svg);
}
/********************************************************
FontAwesome icons in BO textile iconsysntax
*********************************************************/
[class*=ic-fa-]:before {
font-family: "Font Awesome 5 Free", "Font Awesome 5 Brands", FontAwesome;
font-weight: 700;
display: inline-block;
color: #000000;
font-style: normal;
font-variant: normal;
}
[class*=ic-fa-].small {
font-size: 0.9em;
}
[class*=ic-fa-].large {
font-size: 1.7em;
}
[class*=ic-fa-].xlarge {
font-size: 2.2em;
}
[class*=ic-fa-].xxlarge {
font-size: 2.8em;
}
.ic-fa-facebook:before {
content: "\f082";
}
.ic-fa-twitter:before {
content: "\f081";
}
.ic-fa-flickr:before {
content: "\f16e";
}
.ic-fa-googleplus:before {
content: "\f0d4";
}
.ic-fa-instagram:before {
content: "\f16d";
}
.ic-fa-linkedin:before {
content: "\f08c";
}
.ic-fa-pinterest:before {
content: "\f0d3";
}
.ic-fa-xing:before {
content: "\f169";
}
.ic-fa-rss:before {
content: "\f143";
}
.ic-fa-snapchat:before {
content: "\f2ad";
}
.ic-fa-youtube:before {
content: "\f167";
}
.ic-fa-extern:before {
content: "\f35d";
}
.ic-fa-form:before {
content: "\f044";
}
.ic-fa-https:before {
content: "\f023";
}
.ic-fa-mapmarker:before {
content: "\f3c5";
}
.ic-fa-user:before,
.ic-fa-login:before {
content: "\f007";
}
.ic-fa-impressum:before {
content: "\f15c";
}
.ic-fa-lock:before {
content: "\f023";
}
.ic-fa-access:before {
content: "\f29a";
}
.ic-fa-info:before {
content: "\f129";
}
.ic-fa-print:before {
content: "\f02f";
}
.ic-fa-mail:before {
content: "\f0e0";
}
.ic-fa-phone:before {
content: "\f095";
}
.ic-fa-fax:before {
content: "\f1ac";
}
a[class*=ic-fa-]:before {
margin-right: 0.3em;
}
/*********************************************************
* Eigene Icons: Nur Text
*********************************************************/
/* Icon-Intranet */
.ic-intern:after {
font-size: 0.7em;
font-weight: bold;
font-family: Arial;
font-style: normal;
width: auto;
background-color: #b5050e;
padding: 0.05em 0.4em 0.1em 0.3em;
border-left: 0.6em solid #253276;
content: "intern";
color: #ffffff;
margin: 0 0 0 0.3em;
}
/* Icon-Internet bde */
.ic-linkde:after {
font-size: 0.7em;
font-weight: bold;
font-family: Arial;
font-style: normal;
width: auto;
background-color: #253276;
padding: 0.05em 0.4em 0.1em 0.3em;
border-right: 0.6em solid #b5050e;
content: ".de";
color: #ffffff;
margin: 0 0 0 0.3em;
}
/* Icon-PDF */
.ic-pdf:after {
font-size: 0.6em;
font-weight: bold;
font-family: Arial;
font-style: normal;
width: auto;
background-color: #da251c;
padding: 0.1em 0.4em 0.1em;
content: "PDF";
color: #ffffff;
margin: 0 0 0 0.3em;
}
.flag-icon {
width: 1.5em;
min-height: 0.8em;
line-height: 1;
position: relative;
border: 1px solid #e3e3e3;
display: inline-block;
}
.icon-required {
font-weight: bold;
font-size: 1.75em;
vertical-align: -0.1em;
line-height: 0;
color: #000000;
}
.icon--big {
font-size: 18px;
}
iframe {
width: 100%;
border: 0 none;
}
figure {
margin: 0;
}
img {
max-width: 100%;
border: 0;
display: inline-block;
}
.language-icon {
background: #000000;
color: #ffffff;
border: 0 none;
font-weight: bold;
font-size: 0.7rem;
padding: 0.15em 0.4em;
margin-right: 7px;
min-width: 2em;
display: inline-block;
text-align: center;
font-style: normal;
}
a {
text-decoration: none;
/*
&.btn:link {
// fix for zwischenlayout
color: #ffffff;
}
*/
}
a:link {
color: #165BE0;
}
a:hover, a:focus {
text-decoration: underline;
}
a::after {
text-decoration: underline;
}
a:after, a:hover:after {
text-decoration: none;
}
a.extern {
display: initial;
position: unset;
}
a.extern:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 12px;
height: 12px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: url(./074333a7dd2f49feac2b.svg);
mask-image: url(./074333a7dd2f49feac2b.svg);
}
a.extern:after {
background-image: none;
vertical-align: text-top;
margin-left: 4px;
}
a.link--showcart {
white-space: nowrap;
position: relative;
}
a.link--showcart:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 1.15em;
height: 1.15em;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: url(./3583215fe99af26b6c9e.svg);
mask-image: url(./3583215fe99af26b6c9e.svg);
color: #000000;
}
a.link--showcart:after {
position: relative;
z-index: 1;
margin-left: 0.3em;
vertical-align: top;
}
a.link--showcart .inner {
background: #e40422;
border: 1px solid #e40422;
border-radius: 50%;
font-weight: bold;
text-align: center;
line-height: 1;
font-size: 12px;
padding: 3px;
min-width: 20px;
min-height: 20px;
color: white;
position: absolute;
top: -13px;
right: -14px;
}
a.link--showcart .inner:empty {
background: transparent;
}
a .fa,
a .fas,
a .far,
a .bicon {
color: #000000;
margin-right: 0.4em;
}
a.more {
text-decoration: none;
display: inline-block;
}
a.more:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 0.8em;
height: 0.8em;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-arrow-right);
mask-image: var(--bicon-arrow-right);
}
a.more:after {
margin-left: 0.3em;
vertical-align: -1px;
}
a.more:link {
color: #165BE0;
}
a.more:hover, a.more:focus {
text-decoration: underline;
}
a.more i {
font-size: 0.8em;
display: none;
}
[class*=link--] i.fa {
display: none;
}
[class*=link--]:before {
margin-right: 0.3em;
}
.link--back,
.link--add,
.link--delete,
.link--mapmarker,
.link--download,
.link--homepage,
.link--email {
white-space: nowrap;
}
.link--back:before,
.link--add:before,
.link--delete:before,
.link--mapmarker:before,
.link--download:before,
.link--homepage:before,
.link--email:before {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 1em;
height: 1em;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: url(./2fca1f0cec8993b8d3a3.svg);
mask-image: url(./2fca1f0cec8993b8d3a3.svg);
color: #000000;
}
.link--download:before {
-webkit-mask-image: var(--bicon-download);
mask-image: var(--bicon-download);
}
.link--add:before {
-webkit-mask-image: var(--bicon-plus);
mask-image: var(--bicon-plus);
}
.link--back:before {
-webkit-mask-image: var(--bicon-arrow-right);
mask-image: var(--bicon-arrow-right);
transform: rotate(180deg);
}
.link--delete:before {
-webkit-mask-image: var(--bicon-trash);
mask-image: var(--bicon-trash);
}
.link--mapmarker:before {
-webkit-mask-image: var(--bicon-map-marker);
mask-image: var(--bicon-map-marker);
}
.link--homepage:before {
-webkit-mask-image: var(--bicon-desktop);
mask-image: var(--bicon-desktop);
}
.link--email:before {
-webkit-mask-image: var(--bicon-envelope);
mask-image: var(--bicon-envelope);
}
[class*=link--].linkicon--colored:before {
color: #000000;
}
.link--visible-on-focus:not(:focus) {
position: absolute;
height: 1px;
width: 1px;
overflow: hidden;
clip: rect(0 0 0 0);
clip-path: inset(100%);
white-space: nowrap;
}
ul.list--skip-links {
list-style-type: none;
display: inline;
overflow: hidden;
margin: 0;
padding: 0;
}
dl {
margin-bottom: 25px;
}
dl dt {
margin-bottom: 0.25em;
font-weight: bold;
}
dl dd {
margin-bottom: 0.5em;
word-break: break-word;
margin-left: 0;
}
dl pre {
margin: 0;
}
@media print, (min-width: 37.501rem ) {
dl.list--horizontal {
display: grid;
grid-template-columns: auto minmax(60%, 1fr);
grid-template-rows: auto;
grid-template-areas: "left right";
grid-auto-flow: row;
grid-auto-rows: auto;
grid-auto-columns: auto;
justify-content: left;
}
dl.list--horizontal dt {
grid-row: auto;
grid-column: left;
grid-row: auto;
padding-right: 1em;
word-break: keep-all;
overflow: hidden;
}
dl.list--horizontal dd {
grid-row: auto;
grid-column: right;
}
}
ul {
padding-left: 1.1em;
margin-bottom: 25px;
margin-top: 0;
list-style-type: disc;
}
ul > li {
margin-bottom: 0.5em;
word-break: break-word;
}
ul > li::marker {
color: #000000;
font-size: 17px;
line-height: 0;
}
ul > li > ul,
ul > li > ol {
margin-top: 0.5em;
margin-bottom: 0.5em;
}
ol {
padding-left: 10px;
margin-bottom: 25px;
list-style-position: outside;
}
ol > li {
margin-left: 0.7em;
word-break: break-word;
}
ol > li > ol,
ol > li > ul {
margin-top: 0.5em;
margin-bottom: 0.5em;
}
ol > li {
margin-bottom: 0.5em;
/*
&::before {
//content: counter(itemcount) ".";
//display: table-cell;
text-align: right;
padding-right: 0.3em;
word-break: keep-all; // important if inside textile
white-space: nowrap;
}
*/
}
.list--clean {
list-style: none;
padding: 0;
}
.list--clean > li {
margin-left: 0;
}
.list--clean > li:before {
content: unset;
display: none;
}
.list--clean > li::marker {
display: none;
content: unset;
}
.list--ruler:not(.list--oddeven) {
list-style: none;
padding: 0;
}
.list--ruler:not(.list--oddeven) > li {
margin-left: 0;
}
.list--ruler:not(.list--oddeven) > li:before {
content: unset;
display: none;
}
.list--ruler:not(.list--oddeven) > li::marker {
display: none;
content: unset;
}
.list--ruler:not(.list--oddeven) > li + li {
margin-top: 10px;
padding-top: 10px;
border-top: 1px solid #dddddd;
}
.list--oddeven {
list-style: none;
padding: 0;
}
.list--oddeven > li {
margin-left: 0;
}
.list--oddeven > li:before {
content: unset;
display: none;
}
.list--oddeven > li::marker {
display: none;
content: unset;
}
.list--oddeven > li {
padding: 10px 1em;
margin: 0;
margin-bottom: 0 !important;
background-color: #fcfcfc;
border: 0 none;
}
.list--oddeven > li:nth-child(odd) {
background-color: #f5f5f5;
}
.list--iconlist {
list-style: none;
padding: 0;
}
.list--iconlist > li {
margin-left: 0;
}
.list--iconlist > li:before {
content: unset;
display: none;
}
.list--iconlist > li::marker {
display: none;
content: unset;
}
.list--iconlist > li {
display: flex;
align-items: flex-start;
}
.list--iconlist > li .icon {
margin-right: 10px;
min-width: 1.2em;
line-height: inherit;
}
.list--blockiconlinks {
list-style: none;
padding: 0;
}
.list--blockiconlinks > li {
margin-left: 0;
}
.list--blockiconlinks > li:before {
content: unset;
display: none;
}
.list--blockiconlinks > li::marker {
display: none;
content: unset;
}
.list--blockiconlinks > li {
display: flex;
align-items: center;
background-color: #f5f5f5;
}
.list--blockiconlinks > li a {
font-size: 1.2em;
font-weight: bold;
color: #000000;
}
.list--blockiconlinks > li .text {
padding: 5px 12px;
}
.list--blockiconlinks > li .icon {
padding: 5px 12px;
font-size: 1.5em;
color: #ffffff;
background-color: #000000;
}
/* A basic horizontal list. Dont use margins here! */
ul.list--horizontal {
list-style: none;
padding: 0;
display: flex;
flex: 0 1 auto;
flex-wrap: wrap;
align-items: center;
justify-content: flex-start;
gap: 0;
}
ul.list--horizontal > li {
margin-left: 0;
}
ul.list--horizontal > li:before {
content: unset;
display: none;
}
ul.list--horizontal > li::marker {
display: none;
content: unset;
}
ul.list--horizontal > li {
margin: 0 0.75em 0 0;
}
ul.list--horizontal.bordered > li {
border-right: 1px solid;
border-color: inherit;
padding-right: 0.75em;
margin-right: 0.75em;
}
ul.list--horizontal.bordered > li:last-child {
border-right: 0;
padding-right: 0;
}
/* (z.B.: Serviceportal Diensleistungen mit Checkboxen) */
ul.list--functionlist {
list-style: none;
padding: 0;
}
ul.list--functionlist > li {
margin-left: 0;
}
ul.list--functionlist > li:before {
content: unset;
display: none;
}
ul.list--functionlist > li::marker {
display: none;
content: unset;
}
ul.list--functionlist .listitem {
margin-left: 0;
background-color: #f5f5f5;
border: 1px solid #dddddd;
display: flex;
flex-wrap: wrap;
}
ul.list--functionlist .listitem .listitem__main {
padding: 8px 8px 6px;
flex-grow: 1;
flex-basis: 80%;
}
ul.list--functionlist .listitem .listitem__main label.form-check-label {
width: 100%;
}
ul.list--functionlist .listitem .listitem__marginal {
flex-grow: 0;
}
ul.list--functionlist .listitem .listitem__marginal i {
color: #000000;
}
ul.list--functionlist .listitem .listitem__footer {
flex-grow: 1;
width: 100%;
padding: 8px 8px 6px;
background-color: rgb(237.35, 237.35, 237.35);
}
ul.list--functionlist .listitem > * > *:last-child {
margin-bottom: 0;
}
ul.list--linkcloud {
list-style: none;
padding: 0;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
}
ul.list--linkcloud > li {
margin-left: 0;
}
ul.list--linkcloud > li:before {
content: unset;
display: none;
}
ul.list--linkcloud > li::marker {
display: none;
content: unset;
}
ul.list--linkcloud > li a {
border: 2px solid #000000;
border-radius: 0px;
margin: 0 15px 15px 0;
padding: 10px 15px;
font-weight: bold;
color: #000000;
background: rgba(200, 200, 200, 0);
display: inline-block;
}
ul.list--linkcloud > li a:hover {
background: rgba(200, 200, 200, 0.1);
}
ul.list--newslist {
list-style: none;
padding: 0;
}
ul.list--newslist > li {
margin-left: 0;
}
ul.list--newslist > li:before {
content: unset;
display: none;
}
ul.list--newslist > li::marker {
display: none;
content: unset;
}
ul.list--newslist > li {
display: flex;
align-items: flex-start;
border-left: 2px solid red;
background-color: #ffffff;
padding-bottom: 5px;
margin-top: 10px;
}
ul.list--newslist .date {
font-weight: bold;
display: flex;
flex-direction: column;
flex-shrink: 0;
margin: 0 15px 0 -2px;
padding-bottom: 5px;
background-color: #ffffff;
}
ul.list--newslist .date .day {
font-size: 33px;
line-height: 1;
}
ul.list--newslist .date .month {
line-height: 1;
}
@media print, (min-width: 37.501rem ) {
.list--split.split--2 {
column-count: 2;
}
.list--split.split--3 {
column-count: 3;
}
}
@media print, (min-width: 37.501rem ) {
.list--flexsplit {
display: flex;
flex-wrap: wrap;
}
.list--flexsplit > li {
vertical-align: top;
}
.list--flexsplit.split--2 > li {
width: 50%;
}
.list--flexsplit.split--3 > li {
width: 33.33%;
}
}
.list--fullwidth {
display: block;
width: 100%;
}
.list--fullwidth > li {
display: block;
}
.list--quicksearch-links {
list-style: none;
padding: 0;
margin: 5px 0;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
gap: 13px;
}
.list--quicksearch-links > li {
margin-left: 0;
}
.list--quicksearch-links > li:before {
content: unset;
display: none;
}
.list--quicksearch-links > li::marker {
display: none;
content: unset;
}
.list--quicksearch-links li {
margin: 0;
}
.list--quicksearch-links a {
padding: 6px 8px;
color: #ffffff;
background-color: #000000;
font-size: 14px;
}
.link--quicksearch,
.link--quicksearch:link {
padding: 6px 8px;
color: #ffffff;
background-color: #000000;
font-size: 14px;
}
li h3.title {
margin-top: 0;
}
p {
margin-top: 0;
}
p a {
text-decoration: underline;
}
p a:hover, p a:focus {
text-decoration: none;
}
.nomargin {
margin: 0;
}
small {
display: inline-block;
line-height: 1.3;
}
code {
white-space: pre;
}
ins {
background-color: #ccffcc !important;
text-decoration: none;
border-bottom: 1px dashed;
}
del {
background-color: #ffcccc !important;
text-decoration: line-through;
}
abbr[data-original-title],
abbr[title] {
cursor: help;
}
blockquote {
/* (remember modul-testimonial is also is a blockquote!) */
background: #f5f5f5;
border-left: 5px solid #dddddd;
padding: 15px 30px;
margin: 1em 0;
}
blockquote > *:last-child {
margin-bottom: 0;
}
pre {
white-space: pre-wrap;
background-color: #f5f5f5;
border: 1px solid #dddddd;
padding: 0.5em 1em;
}
/*
old spinner with svg tag and stroke
*/
.spinner {
position: relative;
}
.spinner,
.swiper-container .swiper-lazy-preloader {
display: inline-flex;
justify-content: center;
align-items: center;
animation: rotate 2s linear infinite !important;
width: 50px;
height: 50px;
border: 0 none;
}
.spinner::before,
.swiper-container .swiper-lazy-preloader::before {
content: "";
background: #000000;
width: 50px;
height: 50px;
position: absolute;
left: 0;
top: 0;
border-radius: 50%;
}
.spinner::after,
.swiper-container .swiper-lazy-preloader::after {
content: "";
width: 30px;
height: 30px;
border: 5px solid rgba(255, 255, 255, 0.8);
border-top-color: transparent;
border-radius: 50%;
animation: loading 1s ease infinite;
}
@keyframes loading {
to {
transform: rotate(1turn);
}
}
@keyframes rotate {
100% {
transform: rotate(360deg);
}
}
.spinner-container {
text-align: center;
}
.spinner-overlay {
width: 100%;
height: 100%;
position: absolute;
z-index: 1;
top: 0;
left: 0;
background-color: rgba(252, 251, 251, 0.9);
display: flex;
align-items: center;
justify-content: center;
}
.spinner-overlay.overlay--fullscreen {
position: fixed;
}
.text--spinner {
color: #000000;
font-size: 20px;
font-weight: 700;
margin: 1em 0;
}
/*
* Sprungmarken brauchen eine negative position, um die Höhe des Sticky Headers auszugleichen.
* Sonst würde der angesprungene Content von Header verdeckt werden.
*/
:target {
scroll-margin-top: 150px;
/*
// dont work correctly:
&:before {
content: "";
display: block;
scroll-margin-top: 80px;
height: 80px; // same as your fixed header height
margin: -80px 0 0; // negative fixed header height
}
*/
}
table {
border-collapse: collapse;
border-spacing: 0;
background-color: #ffffff;
width: 100%;
margin-bottom: 50px;
}
table td,
table th {
text-align: left;
padding: 1em 0.65em;
border: 1px solid #dddddd;
vertical-align: top;
}
@media print, (min-width: 37.501rem ) {
table td.limit-width,
table th.limit-width {
overflow: auto;
max-width: 15rem;
}
}
table td > *:first-child,
table th > *:first-child {
margin-top: 0;
}
table td > *:last-child,
table th > *:last-child {
margin-bottom: 0;
}
table th {
background-color: #f5f5f5;
color: #000000;
font-weight: bold;
}
table th a {
color: #000000;
}
table .table__colgroup {
color: #000000;
background-color: #dddddd;
padding-top: 0.3em;
padding-bottom: 0.3em;
font-weight: bold;
}
table.table--list tr > th {
font-weight: bold;
background-color: #ffffff;
color: #000000;
border-width: 0 0 0 0;
vertical-align: bottom;
}
table.table--list tr > th a {
color: #000000;
}
table.table--list tr > td {
background-color: #ffffff;
}
table.table--list tr > td:last-child {
padding-right: 0;
}
table.table--list td,
table.table--list th {
padding-right: 2em;
padding-left: 0;
border: 2px solid #000000;
border-width: 0 0 2px 0;
}
table.table--list tfoot tr td {
border: 0 none;
background: transparent;
}
.table--clean td,
.table--clean th {
border: 0 none;
}
.table--clean th {
background-color: #ffffff;
color: #000000;
}
.table--compact {
width: auto;
}
.table--compact td,
.table--compact th {
padding: 3px 10px;
}
@media screen and (max-width: 37.5rem) {
.table-responsive-wrapper {
margin-bottom: 3.125em;
overflow-x: visible;
border: 0px solid #dddddd;
overflow-y: hidden;
width: 100%;
min-height: 0.01%;
}
.table-responsive-wrapper table {
width: 100%;
margin-bottom: 0;
}
}
.zeiten table,
.vitatable table {
margin-bottom: 0;
width: auto;
}
.zeiten table td,
.zeiten table th,
.vitatable table td,
.vitatable table th {
border-color: transparent;
padding: 0 1.5em 0.5em 0;
}
.zeiten table tr td:last-child,
.vitatable table tr td:last-child {
padding-right: 0;
width: 100%;
}
.zeiten table tr td:first-child,
.vitatable table tr td:first-child {
font-weight: bold;
}
/* Tabellenlisten sind Listen, keine Tabellen! */
ul.list--tablelist {
list-style: none;
padding: 0;
padding-left: 0;
position: relative;
width: 100%;
/*
&.ruler,
&.oddeven,
&.bordered {
> li .cell {
padding: 0 1em 1em 0;
}
}
*/
/*
&.add-bullets {
// dont work with table-cell!
// list-style: initial; // dont work with table-cell!
padding-left: 1em;
> li {
&:before {
display: inline-block; // Reactivate our own bullets
}
&:last-child .cell:last-child {
padding-bottom: 0;
}
}
.cell {
border: 0 none;
padding: 0em 1em 1em 0;
&:last-child {
padding-right: 0;
}
}
}
*/
}
ul.list--tablelist > li {
margin-left: 0;
}
ul.list--tablelist > li:before {
content: unset;
display: none;
}
ul.list--tablelist > li::marker {
display: none;
content: unset;
}
ul.list--tablelist .cell:last-child {
padding-bottom: 0.4em;
}
@media print, (min-width: 37.501rem ) {
ul.list--tablelist {
display: table;
}
ul.list--tablelist > li {
display: table-row;
}
ul.list--tablelist > li.row-fluid {
display: table-row !important;
}
ul.list--tablelist > li > *,
ul.list--tablelist > li .cell {
padding: 0 1em 0.2em 0;
display: table-cell;
vertical-align: top;
word-break: initial;
}
ul.list--tablelist > li > *.nowrap,
ul.list--tablelist > li .cell.nowrap {
white-space: nowrap;
}
ul.list--tablelist > li > *:last-child,
ul.list--tablelist > li .cell:last-child {
width: 100%;
}
ul.list--tablelist > li > * img,
ul.list--tablelist > li .cell img {
max-width: none;
}
ul.list--tablelist.span--1 .cell:first-child {
width: 8.333%;
}
ul.list--tablelist.span--2 .cell:first-child {
width: 16.666%;
}
ul.list--tablelist.span--3 .cell:first-child {
width: 25%;
}
ul.list--tablelist.span--4 .cell:first-child {
width: 33.333%;
}
ul.list--tablelist.span--5 .cell:first-child {
width: 41.666%;
}
ul.list--tablelist.span--6 .cell:first-child {
width: 50%;
}
ul.list--tablelist.span--7 .cell:first-child {
width: 58.333%;
}
ul.list--tablelist.span--8 .cell:first-child {
width: 66.666%;
}
ul.list--tablelist.span--9 .cell:first-child {
width: 75%;
}
ul.list--tablelist.span--10 .cell:first-child {
width: 83.333%;
}
ul.list--tablelist.span--11 .cell:first-child {
width: 91.666%;
}
}
ul.list--tablelist > li {
margin-bottom: 0;
}
ul.list--tablelist > li .cell > *:first-child {
margin-top: 0;
}
ul.list--tablelist > li .cell > *:last-child {
margin-bottom: 0;
padding-right: 0;
}
ul.list--tablelist > li.thead {
font-weight: 700;
}
ul.list--tablelist.ruler > li + li .cell:first-child, ul.list--tablelist.bordered > li + li .cell:first-child {
border-top: 1px solid #7d7d7d;
}
ul.list--tablelist.ruler > li + li .cell, ul.list--tablelist.bordered > li + li .cell {
padding-top: 1em;
}
@media print, (min-width: 37.501rem ) {
ul.list--tablelist.ruler > li + li .cell, ul.list--tablelist.bordered > li + li .cell {
border-top: 1px solid #7d7d7d;
}
}
@media screen and (max-width: 37.5rem) {
ul.list--tablelist.ruler .cell + .cell, ul.list--tablelist.bordered .cell + .cell {
padding-top: 0;
}
}
ul.list--tablelist.ruler .cell {
padding: 0 1em 1em 0;
}
ul.list--tablelist.ruler > li + li .cell:first-child {
border-width: 1px;
border-color: #dddddd;
}
ul.list--tablelist.ruler > li + li .cell {
border-width: 1px;
border-color: #dddddd;
}
ul.list--tablelist.ruler > li:last-child .cell {
padding-bottom: 0;
}
ul.list--tablelist.bordered {
border: 1px solid #7d7d7d;
}
ul.list--tablelist.bordered .cell {
padding: 1em;
}
@media print, (min-width: 37.501rem ) {
ul.list--tablelist.bordered .cell + .cell {
border-left: 1px solid #7d7d7d;
}
}
ul.list--tablelist.oddeven:not(.bordered) > li .cell {
border-width: 0 !important;
}
ul.list--tablelist.oddeven > li .cell {
padding: 1em;
padding-bottom: 1em !important;
}
ul.list--tablelist.oddeven > li:nth-child(2n+0) .cell {
background-color: #fcfcfc;
}
ul.list--tablelist.oddeven > li:nth-child(2n+1) .cell {
background-color: #f5f5f5;
}
ul.list--tablelist .category {
font-size: 14px;
display: block;
}
.textile {
word-break: break-word;
}
.textile > *:first-child {
margin-top: 0;
}
.textile table {
word-break: normal;
}
.textile img {
display: inline-block;
}
.textile a {
text-decoration: underline;
}
.textalignleft {
text-align: left;
}
.textalignright {
text-align: right;
}
.textaligncenter {
text-align: center;
}
.text--meta {
word-break: break-word;
color: #454545;
font-weight: normal;
font-size: 14px;
}
.newline {
display: block;
}
.toggle-switch {
display: inline-flex;
align-items: center;
flex-wrap: wrap;
position: relative;
gap: 1ch;
padding-left: 0;
/**
* When the input is focused, provide the display the default outline
* styles from the browser to mimic a native control. This can be
* customised to have a custom focus outline.
*/
/**
* When the toggle is interacted with with a mouse click (and therefore
* the focus does not have to be ‘visible’ as per browsers heuristics),
* remove the focus outline. This is the native checkbox’s behaviour where
* the focus is not visible when clicking it.
*/
/**
* When the input is checked, change the display background color to a
* pale green instead.
*/
/**
* When the input is checked, slide the handle to the right so it covers
* the cross icon instead of the checkmark one.
*/
/**
* When the input is disabled, tweak the toggle styles so it looks dimmed
* with less sharp colors, softer opacity and a relevant cursor.
*/
/**
* Flip the original position of the unchecked toggle in RTL.
*/
/**
* Move the handle in the correct direction in RTL.
*/
}
.toggle-switch.form-check {
padding-left: 0;
}
.toggle-switch__display {
display: inline-flex;
align-items: center;
justify-content: space-around;
width: 4.1em;
height: 2.3em;
box-sizing: content-box;
border: 2px solid #000000;
position: relative;
z-index: 0;
border-radius: 100vw;
background-color: var(--color-message-error);
transition: 250ms;
cursor: pointer;
}
@media (prefers-reduced-motion: reduce) {
.toggle-switch__display {
transition-duration: 0ms;
}
}
.toggle-switch__display::before {
content: "";
width: 1.8em;
height: 1.8em;
border-radius: 50%;
box-sizing: border-box;
border: 2px solid #000000;
position: absolute;
z-index: 2;
top: 50%;
left: 0.25em;
transform: translate(0, -50%);
background-color: #fff;
transition: inherit;
}
.toggle-switch__input {
position: absolute;
opacity: 0;
width: 5.9em;
height: 100%;
cursor: pointer;
z-index: 1;
}
.toggle-switch__input:focus + .toggle-switch__display {
outline: 3px solid #0076dd;
outline-offset: -2px;
box-shadow: 0px 0px 0 3px #ffffff;
}
.toggle-switch__input:focus:not(:focus-visible) + .toggle-switch__display {
outline: 0;
}
.toggle-switch__input:checked + .toggle-switch__display {
background-color: var(--color-message-success);
}
.toggle-switch__input:checked + .toggle-switch__display::before {
transform: translate(100%, -50%);
}
.toggle-switch__input:disabled, .toggle-switch__input:disabled + .toggle-switch__display {
cursor: not-allowed;
}
.toggle-switch__input:disabled + .toggle-switch__display {
border-color: #aaaaaa;
background-color: #ffffff;
opacity: 0.5;
}
.toggle-switch__input:disabled + .toggle-switch__display::before {
border-color: #aaaaaa;
}
.toggle-switch__input:disabled + .toggle-switch__display .toggle-switch__icon {
color: #aaaaaa;
}
.toggle-switch__input:disabled ~ .toggle-switch__label {
color: #aaaaaa;
}
[dir=rtl] .toggle-switch__display::before {
left: auto;
right: 0.25em;
}
[dir=rtl] .toggle-switch__input:checked + .toggle-switch__display::before {
transform: translate(-100%, -50%);
}
.toggle-switch__icon--on {
color: rgb(26.623255814, 185.376744186, 121.8753488372);
}
.toggle-switch__icon--off {
color: hsl(352.9411764706, 120.9523809524%, 45.8823529412%);
font-size: 1.1em;
}
/* add base colors as css variables */
:root {
--breakpoint-smallest: 430px;
--breakpoint-palm: 600px;
--breakpoint-tablet: 920px;
--breakpoint-tabletlandscape: 1181px;
--breakpoint-desktop: 1480px;
}
/* add base colors as css variables */
:root {
--color-white: #ffffff;
--color-black: #000000;
--color-red: #b5050e;
--color-blue: #0e428c;
--color-errorRed: #000000;
--color-blue-light: #049fe1;
--color-green: #15846e;
--color-grey: #f5f5f5;
--color-grey-dark: #dddddd;
--color-grey-darkest: #454545;
--color-tabfocus: #0076dd;
--color-border: #dddddd;
--color-hr: #dddddd;
--color-decorative-primary: #000000;
--color-decorative-secondary: #000000;
--color-decorative-tertiary: #000000;
--color-decorative-light: #ffffff;
--color-decorative-positive: #15846e;
--color-decorative-destructive: #d52f2e;
--color-text-base: #000000;
--color-text-negative: #ffffff;
--color-text-lightest: #454545;
--color-text-link: #165BE0;
--color-text-disabled: #737373;
--color-text-error: #9b0000;
--color-text-success: #3f6b25;
--bgcolor-block-light: #ffffff;
--bgcolor-block-heavy: #f5f5f5;
--bgcolor-block-dark: #000000;
--bgcolor-block-colored: #f5f5f5;
--color-block-footer: #f5f5f5;
--color-object-panel: #e8edf2;
--color-message-default: #f9f4e4;
--color-message-success: #e2f1eb;
--color-message-info: #ebf1f7;
--color-message-error: #fdecee;
--color-block-seperationheading: #f5f5f5;
--color-block-seperationheading-dark: #dddddd;
--button--default-bgcolor: #ffffff;
--color-zebra-odd: #f5f5f5;
--color-zebra-even: #fcfcfc;
}
/* used in: modul-faq, modul-publictransport,... */
.js-accordion {
list-style: none;
padding: 0;
overflow: visible;
border: 1px solid #dddddd;
border-width: 0 0 1px 0;
}
.js-accordion > li {
margin-left: 0;
}
.js-accordion > li:before {
content: unset;
display: none;
}
.js-accordion > li::marker {
display: none;
content: unset;
}
.js-accordion > *:last-child {
margin-bottom: 0;
}
.js-accordion .js-accordion__heading,
.js-accordion > li {
border-top: 1px solid #dddddd;
margin: 0;
}
.js-accordion .js-accordion__heading {
flex-grow: 0;
margin-bottom: 0;
padding: 10px 0;
margin: 0;
position: relative;
width: 100%;
text-align: left;
background-color: transparent;
display: flex;
justify-content: space-between;
align-items: center;
}
.js-accordion .js-accordion__heading:first-child, .js-accordion .js-accordion__heading.title {
border-top: 0 none;
}
.js-accordion .js-accordion__heading:hover > * {
outline: 0;
}
.js-accordion .js-accordion__heading:focus, .js-accordion .js-accordion__heading:hover {
outline-offset: 0px;
}
.js-accordion .js-accordion__heading:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 1.3em;
height: 1.3em;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-chevron-right);
mask-image: var(--bicon-chevron-right);
color: #000000;
}
.js-accordion .js-accordion__heading:after {
transition: transform 0.2s;
transform: rotate(90deg);
flex-grow: 0;
text-align: right;
line-height: 1;
flex-shrink: 0;
}
.js-accordion .js-accordion__heading[aria-expanded=true]:after {
transform: rotate(-90deg);
}
.js-accordion .js-accordion__heading.title--right {
justify-content: flex-end;
}
.js-accordion .js-accordion__heading.title--right:after {
flex-grow: 0;
}
.js-accordion .js-accordion__panel + .js-accordion__heading {
margin-top: 0;
}
.js-accordion .title {
margin: 0;
}
.js-accordion .js-accordion__panel {
padding: 7px 0 15px 0;
margin: 0;
border: 0px none;
background-color: transparent;
-webkit-transition: opacity 0.2s ease-out;
transition: opacity 0.2s ease-out;
opacity: 0;
overflow: hidden;
display: none;
}
.js-accordion .js-accordion__panel.opened {
opacity: 1;
}
.js-accordion .js-accordion__panel > *:first-child {
margin-top: 0;
}
.js-accordion .js-accordion__panel > *:last-child {
margin-bottom: 0;
}
.js-accordion .js-accordion__panel > *:last-child > *:last-child {
margin-bottom: 0;
border-bottom: 0 none;
}
.js-accordion .js-accordion__panel:focus, .js-accordion .js-accordion__panel:active {
outline: 1px dotted #000000;
outline-offset: -1px;
}
.js-accordion:not(.initialized) > li[data-initial-open=true] .js-accordion__panel {
display: block;
opacity: 1;
}
.js-accordion.accordion--oddeven {
border-width: 0 0 0 0;
}
.js-accordion.accordion--oddeven > * {
background-color: #fcfcfc;
padding-left: 1em;
padding-right: 1em;
border-width: 0 0 0 0;
}
.js-accordion.accordion--oddeven > h3:nth-child(4n-2),
.js-accordion.accordion--oddeven > h3:nth-child(4n-3) {
background-color: #f5f5f5;
}
.js-accordion.accordion--oddeven > li:nth-child(odd) {
background-color: #f5f5f5;
}
.accordion-actions {
display: flex;
justify-content: flex-end;
}
.accordion-actions button {
font-size: 14px;
margin: 0 0.3em 0.4em 1em;
}
.anker-jumptocontact {
display: none;
margin: 0 0 50px 0;
text-align: center;
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
padding: 0.5em 0;
}
@media print, (max-width: 73.8125rem) {
.anker-jumptocontact {
display: block;
}
}
.anker-jumptocontact a .fas,
.anker-jumptocontact a.bicon {
color: #000000;
}
.block {
margin: 0 0 50px 0;
/*
> h2,
> h3 {
margin-top: 0;
}
*/
}
.block:before, .block:after {
content: " ";
display: table;
clear: both;
}
.block > .title {
margin-top: 0;
}
.block > .title a {
color: inherit;
}
.block:not(.flexgrid) > *:last-child {
margin-bottom: 0 !important;
}
.block:not(.flexgrid) > *:last-child > *:last-child {
margin-bottom: 0;
}
.block.halfspace {
margin-bottom: 25px;
}
.bo-nahverkehr {
margin: 0 0 50px 0;
}
.bo-nahverkehr ul {
list-style: none;
padding-left: 0;
margin-bottom: 0;
}
.bo-nahverkehr ul li:before {
display: none;
}
.bo-nahverkehr .bo-nahverkehr-type {
padding: 8px 9px 7px 9px;
border: 1px solid #dddddd;
margin: 0;
font-weight: normal;
}
.bo-nahverkehr .bo-nahverkehr-type:before {
display: inline-block;
max-width: 20px;
max-height: 20px;
margin-right: 0.3em;
line-height: 0.7;
vertical-align: text-top;
}
.bo-nahverkehr .bo-nahverkehr-type.bo-nahverkehr-type-bahn:before {
content: url(./5c0317a0cbf953c763cb.svg);
}
.bo-nahverkehr .bo-nahverkehr-type.bo-nahverkehr-type-ubahn:before {
content: url(./9caa17489e2b1454d3d8.svg);
}
.bo-nahverkehr .bo-nahverkehr-type.bo-nahverkehr-type-sbahn:before {
content: url(./114e388096f67f2fe7d1.svg);
}
.bo-nahverkehr .bo-nahverkehr-type.bo-nahverkehr-type-tram:before {
content: url(./569b8c82728f72653363.svg);
}
.bo-nahverkehr .bo-nahverkehr-type.bo-nahverkehr-type-bus:before {
content: url(./e1b7dc3265c260f4e655.svg);
}
.bo-nahverkehr .bo-nahverkehr-type.bo-nahverkehr-type-ferry:before {
content: url(./95f27c2a3d4f20e723f8.svg);
}
.bo-nahverkehr .bo-nahverkehr-stops {
background-color: #f5f5f5;
margin: 0;
margin-bottom: 0.3em;
padding: 9px;
}
.bo-nahverkehr .bo-nahverkehr-stop-item .bo-nahverkehr-distance {
float: right;
}
.bo-nahverkehr .bo-nahverkehr-stop-item .bo-nahverkehr-icon {
display: none;
}
.bo-nahverkehr .bo-nahverkehr-stop-item + .bo-nahverkehr-stop-item {
border-top: 1px solid #dddddd;
padding-top: 0.5em;
}
.bo-nahverkehr .bo-nahverkehr-route-list {
display: flex;
flex-wrap: wrap;
}
.bo-nahverkehr .bo-nahverkehr-route-list .bo-nahverkehr-route-item {
border: 1px solid #000000;
padding: 3px 6px 2px 6px;
background-color: #ffffff;
margin-right: 0.2em;
white-space: nowrap;
}
.block .bo-nahverkehr,
.block .bo-nahverkehr-tsr {
margin-bottom: 0;
}
.anbindung .bahn:before,
.anbindung .ubahn:before,
.anbindung .sbahn:before,
.anbindung .tram:before,
.anbindung .bus:before,
.anbindung .faehre:before {
margin-right: 6px;
margin-top: 2px;
float: left;
}
.anbindung .bahn > p,
.anbindung .ubahn > p,
.anbindung .sbahn > p,
.anbindung .tram > p,
.anbindung .bus > p,
.anbindung .faehre > p {
display: table;
}
.anbindung .bahn:before {
content: url(./5c0317a0cbf953c763cb.svg);
}
.anbindung .ubahn:before {
content: url(./9caa17489e2b1454d3d8.svg);
}
.anbindung .sbahn:before {
content: url(./114e388096f67f2fe7d1.svg);
}
.anbindung .tram:before {
content: url(./569b8c82728f72653363.svg);
}
.anbindung .bus:before {
content: url(./e1b7dc3265c260f4e655.svg);
}
.anbindung .faehre:before {
content: url(./95f27c2a3d4f20e723f8.svg);
}
.cartitem {
margin-bottom: 50px;
/*
ul {
//display: table; // NO!
}
*/
}
.cartitem:before, .cartitem:after {
content: " ";
display: table;
clear: both;
}
.cartitem .title {
margin-top: 0;
}
.cartitem .subtitle {
margin-top: 0;
}
.cartitem .image {
float: none;
}
.cartitem .image .image__image {
background-color: #f5f5f5;
border: 1px solid #f5f5f5;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
}
.cartitem .image .image__image img {
max-height: 240px;
width: auto;
margin: 0 auto;
}
@media print, (min-width: 37.501rem ) {
.cartitem .image {
float: left;
margin: 0;
margin-right: 20px;
width: 33%;
}
}
.cartitem li.alert-success {
background-color: #e2f1eb;
}
.cartitem li.alert-success a {
color: #3f6b25;
}
.cartitem ul.additional li > * {
display: table;
}
.cartitem .text-maxitems {
font-weight: normal;
font-size: 11px;
line-height: 1.2;
display: inline-block;
}
.cartitem .inner > *:last-child {
margin-bottom: 0;
}
.cartitem + .cartitem {
border-top: 1px solid #dddddd;
padding-top: 50px;
margin-top: 50px;
}
/*
Colorbox Core Style:
The following CSS is consistent between example themes and should not be altered.
*/
#colorbox,
#cboxOverlay,
#cboxWrapper {
position: absolute;
top: 0;
left: 0;
z-index: 9999;
overflow: hidden;
-webkit-transform: translate3d(0, 0, 0);
}
#cboxWrapper {
max-width: none;
}
#cboxOverlay {
position: fixed;
width: 100%;
height: 100%;
}
#cboxMiddleLeft,
#cboxBottomLeft {
clear: left;
}
#cboxContent {
position: relative;
}
#cboxLoadedContent {
overflow: auto;
-webkit-overflow-scrolling: touch;
}
#cboxTitle {
margin: 0;
}
#cboxLoadingOverlay,
#cboxLoadingGraphic {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#cboxPrevious,
#cboxNext,
#cboxClose,
#cboxSlideshow {
cursor: pointer;
}
.cboxPhoto {
float: left;
margin: auto;
border: 0;
display: block;
max-width: none;
-ms-interpolation-mode: bicubic;
}
.cboxIframe {
width: 100%;
height: 100%;
display: block;
border: 0;
padding: 0;
margin: 0;
}
#colorbox,
#cboxContent,
#cboxLoadedContent {
box-sizing: content-box;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
}
/*
User Style:
Change the following styles to modify the appearance of Colorbox. They are
ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#colorbox {
outline: 0;
}
/*
BO Style: Erweitert das default colorbox.css (siehe oben)
*/
#cboxOverlay {
background: rgba(0, 0, 0, 0.9);
}
#cboxTopLeft,
#cboxTopRight,
#cboxBottomLeft,
#cboxBottomRight,
#cboxMiddleLeft,
#cboxMiddleRight,
#cboxTopCenter,
#cboxBottomCenter {
display: none;
}
.cboxElement {
position: relative;
display: block;
margin-bottom: 0px;
z-index: 0;
}
.cboxElement:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 22px;
height: 22px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: url(./3c9a553b657e0343a988.svg);
mask-image: url(./3c9a553b657e0343a988.svg);
color: #000000;
}
.cboxElement:after {
margin: 4px;
}
.cboxElement:before {
content: "";
background: #ffffff;
width: 30px;
height: 30px;
}
.cboxElement:before, .cboxElement:after {
position: absolute;
bottom: 5px;
right: 5px;
display: inline-flex;
}
.cboxElement img {
display: block;
}
#cboxContent {
background-color: #ffffff;
position: relative;
overflow-y: auto;
}
#cboxContent #cboxClose {
text-indent: -99999px;
position: absolute;
top: 0px;
right: 0px;
bottom: auto;
left: auto;
border: none;
padding: 0;
margin: 0;
height: 35px;
width: 35px;
overflow: hidden;
line-height: 1em;
background: #ffffff;
}
#cboxContent #cboxClose:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 22px;
height: 22px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-times);
mask-image: var(--bicon-times);
color: #000000;
}
#cboxContent #cboxClose:after {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: auto;
text-indent: 0;
margin-left: 0;
margin-top: 0;
margin: 6.5px;
}
#cboxContent #cboxTitle {
opacity: 1;
color: #000000;
padding: 1px 4px;
position: absolute;
bottom: 0;
font-size: 14px;
}
.emergency-box {
margin: 25px auto;
border: 2px solid red;
padding: 1em;
width: 100%;
color: #000000;
background: transparent;
}
.emergency-box .title {
/* No h2 here */
margin-bottom: 0.2em;
font-size: 1.25em;
color: #000000;
}
.emergency-box.emergency--hot {
background-color: rgba(255, 0, 0, 0.1);
}
.emergency-box > *:first-child {
margin-top: 0;
}
.emergency-box > *:last-child {
margin-bottom: 0;
}
.flatpickr-months .flatpickr-current-month {
display: flex;
align-items: center;
flex-wrap: nowrap;
}
.flatpickr-months .flatpickr-current-month .flatpickr-monthDropdown-months {
margin-right: 1em;
}
/***************************************************
*
* OUR FLEXGRID, A VERY LIGHT VERSION OF GRID (for Multiteaser rows)
*
*/
.flexgrid {
padding: 0;
}
.flexgrid > *:first-child {
margin-top: 0;
}
@media print, (min-width: 37.501rem ) {
.flexgrid {
gap: 20px;
display: flex !important;
display: -ms-flexbox !important;
flex-wrap: wrap !important;
align-items: flex-start;
width: auto !important;
}
.flexgrid.grid--stretch {
align-items: stretch;
}
.flexgrid.grid--stretch > * > * {
height: 100%;
margin-bottom: 0;
}
.flexgrid > li {
margin-bottom: 0;
}
.flexgrid > * {
width: 100%;
}
.flexgrid > * > :first-child {
margin-top: 0;
}
.flexgrid > * .stretch {
height: 100%;
margin-bottom: 0;
}
.flexgrid.gap--5 {
margin-left: -100px !important;
}
.flexgrid.gap--5 > * {
padding-left: 100px;
}
.flexgrid.grid--auto > * {
width: auto;
flex: 1 1 0px;
}
.flexgrid.grid--1 > * {
width: calc(100% - 0px);
}
.flexgrid.grid--2 > * {
width: calc(50% - 10px);
}
.flexgrid.grid--3 > *, .flexgrid.grid--4 > *, .flexgrid.grid--5 > * {
width: calc(50% - 10px);
}
.flexgrid.grid--3 > *.span2, .flexgrid.grid--4 > *.span2, .flexgrid.grid--5 > *.span2 {
width: calc(100% - 0px);
}
.flexgrid *[class*=teaser] .image__image {
margin-left: 0 !important;
margin-right: 0 !important;
}
.flexgrid > .nogrid,
.flexgrid > hr,
.flexgrid > p,
.flexgrid > h2,
.flexgrid > h3 {
width: 100% !important;
}
}
@media print, (min-width: 57.501rem ) {
.flexgrid.grid--3 > * {
width: calc(33.3333333333% - 13.3333333333px);
}
.flexgrid.grid--3 > *.span2 {
width: calc(66.6666666667% - 6.6666666667px);
}
.flexgrid.grid--4 > * {
width: calc(25% - 15px);
}
.flexgrid.grid--4 > *.span2 {
width: calc(33.3333333333% - 13.3333333333px);
}
.flexgrid.grid--5 > * {
width: calc(20% - 16px);
}
.flexgrid.grid--5 > *.span2 {
width: calc(33.3333333333% - 13.3333333333px);
}
}
ul.flexgrid {
list-style: none;
padding: 0;
list-style: none !important;
}
ul.flexgrid > li {
margin-left: 0;
}
ul.flexgrid > li:before {
content: unset;
display: none;
}
ul.flexgrid > li::marker {
display: none;
content: unset;
}
ul.flexgrid:not(.block) {
margin-bottom: 0;
}
.flexgrid + * {
margin-top: 0;
}
#layout-grid__area--contentfooter .feedback-form {
margin-bottom: 0;
border-top: 1px solid #dddddd;
border-bottom: 1px solid #dddddd;
}
#layout-grid__area--contentfooter .feedback-form .title {
text-align: right;
padding-right: 24px;
font-size: 1em;
}
#layout-grid__area--contentfooter .feedback-form .inner {
max-width: 900px;
margin: 0 auto;
padding: 24px;
}
form {
margin: 0 0 50px 0;
position: relative;
}
form:before, form:after {
content: " ";
display: table;
clear: both;
}
form .form-description {
display: block;
position: absolute;
bottom: -25.2px;
left: 0;
font-size: 14px;
margin: 0;
}
form .legend {
margin-top: 0;
}
form .hidden {
display: none;
}
fieldset {
border: 0 none;
padding: 0;
margin-bottom: 1.5em;
margin-inline: 0px;
/*
> *:last-child {
//margin-bottom: 0; // don't works with inline form group fieldsets on palm
}
*/
}
.fieldset {
margin-bottom: 1.5em;
}
.fieldset > *:last-child {
margin-bottom: 0;
}
legend {
font-weight: bold;
font-size: 16px;
padding: 0;
margin: 0 0 8px 0;
}
.form-group,
.control-group {
margin-bottom: 1.5em;
max-width: none;
display: block;
}
.form-group + .message, .form-group + .message--info, .form-group + .message--success, .form-group + .message--error,
.control-group + .message,
.control-group + .message--info,
.control-group + .message--success,
.control-group + .message--error {
margin-top: -1.5625em;
}
.form-group.hidden,
.control-group.hidden {
margin: 0;
height: 0;
overflow: hidden;
}
@media print, (min-width: 37.501rem ) {
.form-group--inline {
display: flex;
flex-wrap: nowrap;
align-items: center;
}
.form-group--inline.align-bottom {
align-items: flex-end;
}
.form-group--inline.fullspace {
justify-content: space-between;
}
.form-group--inline.fullspace .form-group {
flex-grow: 1;
}
.form-group--inline.fullspace .form-group .form-control {
width: 100%;
}
.form-group--inline .controls {
margin-right: 20px;
}
.form-group--inline .controls:last-child {
margin-right: 0;
}
.form-group--inline > label {
display: flex;
align-items: center;
}
.form-group--inline > label > span {
margin-right: 0.4em;
}
.form-group--inline > * {
margin-right: 1em;
margin-bottom: 0;
}
.form-group--inline .form-control {
width: auto;
float: none;
display: block;
vertical-align: middle;
margin-bottom: 0;
white-space: nowrap;
}
.form-group--inline > span,
.form-group--inline .controls > span {
margin-right: 0.5em;
}
.form-group--inline .form-check {
margin-bottom: 0;
}
.form-group--inline .form-check label,
.form-group--inline .form-check-label {
display: inline-block;
}
.form-group--inline .delimiter {
margin-left: 5px;
margin-right: 5px;
}
.form-group--inline > .formgroup__help {
display: block;
width: 100%;
}
}
.form-group--inline.stretch .controls {
flex-grow: 1;
}
.form-group--inline.stretch .controls input,
.form-group--inline.stretch .controls select,
.form-group--inline.stretch .controls textarea {
width: 100%;
}
.form-group--inline.stretch input,
.form-group--inline.stretch select,
.form-group--inline.stretch textarea {
flex-grow: 1;
}
.form-group--inline.stretch button,
.form-group--inline.stretch a {
flex-grow: 0;
}
@media screen and (max-width: 37.5rem) {
.form-group--inline > * {
margin-bottom: 1.5em;
}
}
.form-actions,
.teaser-actions {
margin-top: 25px;
display: flex;
justify-content: flex-end;
align-items: center;
}
.form-actions > *,
.form-actions .button,
.form-actions a,
.teaser-actions > *,
.teaser-actions .button,
.teaser-actions a {
margin: 0 0 0 1.5em;
}
.form-actions > *:first-child,
.form-actions .button:first-child,
.form-actions a:first-child,
.teaser-actions > *:first-child,
.teaser-actions .button:first-child,
.teaser-actions a:first-child {
margin-left: 0;
}
.form-actions .button,
.form-actions button,
.form-actions a,
.teaser-actions .button,
.teaser-actions button,
.teaser-actions a {
margin-bottom: 0;
}
@media screen and (max-width: 37.5rem) {
.form-actions,
.teaser-actions {
flex-direction: column;
justify-content: flex-start;
align-items: stretch;
}
.form-actions > *,
.form-actions .button,
.form-actions a,
.teaser-actions > *,
.teaser-actions .button,
.teaser-actions a {
margin: 0.5em 0 0.5em 0;
width: 100%;
}
}
.form-actions__left,
.teaser-actions__left {
flex-grow: 1;
display: flex;
flex-direction: row;
}
@media screen and (max-width: 37.5rem) {
.form-actions__left,
.teaser-actions__left {
flex-grow: 1;
display: flex;
flex-direction: column;
}
}
.form-actions__right,
.teaser-actions__right {
flex-grow: 0;
display: flex;
flex-direction: row;
}
@media screen and (max-width: 37.5rem) {
.form-actions__right,
.teaser-actions__right {
flex-grow: 0;
display: flex;
flex-direction: column;
}
}
label,
.label {
display: inline-block;
font-size: 1em;
font-weight: bold;
line-height: 1.2;
margin-bottom: 0.4em;
margin-top: 0;
}
label.light,
.label.light {
font-weight: normal;
}
input[type=text],
input[type=date],
input[type=password],
input[type=file],
input[type=email],
input[type=number],
input[type=tel],
input[type=time],
input[type=url],
select,
textarea,
.form-control,
button.ui-multiselect {
display: block;
border-radius: 0px;
font-size: 1em;
width: 100%;
min-height: 43px;
font-family: Arial, sans-serif;
background-color: #ffffff;
background-image: none;
border: 1px solid #737373;
color: #000000;
padding: 10px;
transition: border-color 0.16s ease-in-out 0s, box-shadow 0.16s ease-in-out 0s;
max-width: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
}
input[type=text]:focus,
input[type=date]:focus,
input[type=password]:focus,
input[type=file]:focus,
input[type=email]:focus,
input[type=number]:focus,
input[type=tel]:focus,
input[type=time]:focus,
input[type=url]:focus,
select:focus,
textarea:focus,
.form-control:focus,
button.ui-multiselect:focus {
border: 2px solid #0076dd;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0px 8px 0px rgba(102, 175, 233, 0.8);
outline: 2px solid white;
outline-offset: 0px;
}
form .qmark-icon {
border-radius: 50%;
color: #ffffff;
background-color: #000000;
font-size: 13px;
font-weight: bold;
text-decoration: none;
display: inline-flex;
align-items: center;
justify-content: center;
width: 1.2em;
height: 1.2em;
vertical-align: text-top;
}
input[type=checkbox].form-control {
-webkit-appearance: checkbox; /* 1 */
-moz-appearance: checkbox; /* 1 */
}
input[type=radio].form-control {
-webkit-appearance: radio; /* 1 */
-moz-appearance: radio; /* 1 */
}
.form-control::-webkit-search-results-button,
.form-control::-webkit-search-results-decoration,
.form-control::-webkit-search-cancel-button,
.form-control::-webkit-search-decoration {
display: none;
}
.form-control::-webkit-date-and-time-value {
text-align: left;
}
select:not([multiple]).form-control {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
select.form-control:not([multiple]) {
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBkPSJNMjMzLjQgNDA2LjZjMTIuNSAxMi41IDMyLjggMTIuNSA0NS4zIDBsMTkyLTE5MmMxMi41LTEyLjUgMTIuNS0zMi44IDAtNDUuM3MtMzIuOC0xMi41LTQ1LjMgMEwyNTYgMzM4LjcgODYuNiAxNjkuNGMtMTIuNS0xMi41LTMyLjgtMTIuNS00NS4zIDBzLTEyLjUgMzIuOCAwIDQ1LjNsMTkyIDE5MnoiLz48L3N2Zz4=) !important;
background-repeat: no-repeat;
background-position: right 0.5em center;
background-size: 1em;
padding-right: 2em;
}
/*
// Disabled. Dont works in firefox > 109 anymore, so we use the native icon
input[type=time].form-control {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-image: url(~images/bicons/clock.svg);
background-repeat: no-repeat;
background-position: right 0.5em center;
background-size: 1em;
min-width: 7em; // safari
}
*/
.form-control::-webkit-calendar-picker-indicator {
cursor: pointer;
}
input.datepicker {
background-image: url(./8d7e4d41d09e69e1e328.svg);
background-repeat: no-repeat;
background-position: right 0.5em center;
background-size: 1em;
}
input.datepicker[readonly] {
background-color: #ffffff !important;
cursor: pointer;
}
.form-control.autowidth {
width: auto;
}
select > option {
padding: 0.3em;
}
textarea.maxchars {
display: block;
}
textarea.maxchars + .formcharquota-status {
color: #ffffff !important;
background-color: #454545 !important;
}
input[type=checkbox],
input[type=radio] {
box-sizing: border-box;
padding: 0;
min-height: auto;
margin: 0 0.5em 0 0;
}
.form-check {
position: relative;
display: block;
margin-bottom: 0.5em;
padding-left: 1.5em;
}
.form-check label,
.form-check .form-check-label {
margin-bottom: 0;
font-weight: normal;
display: inline-block;
cursor: pointer;
}
.form-check .form-check-input {
float: left;
margin-left: -1.5em;
width: 1em;
height: 1em;
margin-top: 0.2em;
vertical-align: top;
font-size: inherit;
cursor: pointer;
}
.form-check-inline {
display: inline-block;
margin-right: 1em;
}
.form-control:disabled,
.form-control[readonly] {
cursor: not-allowed;
background-color: #e0e0e0;
opacity: 1;
color: #444444;
}
.form-check-input:disabled {
cursor: not-allowed;
}
.form-check-input:disabled ~ .form-check-label {
color: #737373;
cursor: not-allowed;
}
.form-group .form-control-plaintext {
display: block;
width: 100%;
padding-left: 0;
padding-top: 0.375rem;
padding-bottom: 0.375rem;
margin-bottom: 0;
color: #000000;
background-color: transparent;
border: solid transparent;
border-width: 1px 0;
}
.formgroup__help,
.help-block:not(.form_help) {
font-size: 0.875rem;
display: block;
color: #454545;
margin-bottom: 0;
margin-top: 0.2em;
}
.form-control.is-invalid,
.form-check-input.is-invalid,
.was-validated .form-control:invalid,
.was-validated .form-check-input:invalid,
.control-group.error input,
.control-group.error select,
.control-group.error textarea {
border-color: #d52f2e;
border-width: 2px 2px 2px 6px;
}
.form-control.is-invalid ~ .form-check-label,
.form-check-input.is-invalid ~ .form-check-label,
.was-validated .form-control:invalid ~ .form-check-label,
.was-validated .form-check-input:invalid ~ .form-check-label,
.control-group.error input ~ .form-check-label,
.control-group.error select ~ .form-check-label,
.control-group.error textarea ~ .form-check-label {
color: #9b0000;
}
.form-control.is-valid,
.form-check-input.is-valid,
.was-validated .form-control:valid,
.was-validated .form-check-input:valid {
background-color: #ffffff;
}
.form-control.is-valid ~ .form-check-label,
.form-check-input.is-valid ~ .form-check-label,
.was-validated .form-control:valid ~ .form-check-label,
.was-validated .form-check-input:valid ~ .form-check-label {
color: #000000;
}
.control-group.error .form-check-label {
color: #9b0000;
}
label small {
display: block;
font-weight: normal;
font-style: italic;
}
.formerrormessage {
color: #9b0000;
}
.controls.form-check .form-check-label input {
float: left;
margin-left: -1.5em;
width: 1em;
height: 1em;
margin-top: 0.2em;
vertical-align: top;
font-size: inherit;
}
.controls.form-check .form-check-label + .form-check-label {
display: block;
}
.controls.form-check .form-check-label.inline {
display: inline-block;
width: auto;
margin-right: 2.5em;
}
.controls.form-check .form-check-label.inline > input {
display: inline-block;
}
.geomap-popup-teaser .image__image img {
max-width: 80px;
max-height: 80px;
min-width: unset;
width: unset;
}
.geomap-popup-teaser a.more:focus-visible {
outline-width: thin;
outline-offset: -1px;
}
/*
Global nutzbares, einfaches Volltextsuchfeld mit Input und Button in einer Zeile
- Am Kopf von Suchseiten, z.B.: Karriereportal, Serviceportal, 404, externe Seiten ...
- Am Kopf von Herounits, z.B.: Karriereportal, Serviceportal, Assetservice, externe Seiten ...
- Auf der Suchseite
- Im Portalheader Suchoverlay
*/
.searchform-slot {
text-align: left;
}
.searchform-slot .form-group,
.searchform-slot fieldset {
margin-bottom: 0;
}
.searchform-slot .searchterm {
position: relative;
width: 100%;
z-index: 0;
display: inline-flex;
margin-bottom: 0.8em;
background-color: #ffffff;
}
.searchform-slot .searchterm .input-wrapper {
border: 1px solid #737373;
width: 100%;
display: inline-flex;
}
.searchform-slot .searchterm .input-wrapper:focus-within {
border: 2px solid #0076dd;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0px 8px 0px rgba(102, 175, 233, 0.8);
outline: 2px solid white;
outline-offset: 0px;
}
.searchform-slot .searchterm * {
align-self: center;
}
.searchform-slot .searchterm i.lens {
position: absolute;
left: 0;
top: auto;
color: #454545;
padding: 6px 3px 6px 12px;
}
.searchform-slot .searchterm .search {
width: 100%;
max-width: none;
outline: 0;
border: 0 none;
box-shadow: none;
background-color: transparent;
color: #000000;
padding: 0 50px 0 40px;
z-index: 1;
/*&:focus {
box-shadow: none; //no, double focus border
}*/
}
.searchform-slot .searchterm .submit {
position: absolute;
right: 0;
top: auto;
z-index: 1;
display: flex;
padding: 6px 12px;
background-color: transparent;
color: #000000;
border-width: 0 0 0 0;
}
.searchform-slot .searchterm .submit i.icon {
font-size: 30px;
}
.searchform-slot .searchterm .submit:after {
display: none;
}
.searchform-slot .searchform__footer {
text-align: right;
}
.searchform-fulltext,
.form--searchform-simple {
text-align: left;
}
.searchform-fulltext .form-group,
.searchform-fulltext fieldset,
.form--searchform-simple .form-group,
.form--searchform-simple fieldset {
margin-bottom: 0;
}
.searchform-fulltext .searchterm,
.form--searchform-simple .searchterm {
position: relative;
display: flex;
justify-content: space-between;
align-items: stretch;
margin-bottom: 0.8em;
border: 1px solid #737373;
}
.searchform-fulltext .searchterm > *,
.form--searchform-simple .searchterm > * {
white-space: nowrap;
height: auto;
}
.searchform-fulltext .searchterm button.submit,
.form--searchform-simple .searchterm button.submit {
border-width: 0 0 0 0;
display: flex;
align-items: center;
}
.searchform-fulltext .searchterm .search,
.form--searchform-simple .searchterm .search {
width: 100%;
outline: inherit;
border: 0 none;
background-color: #ffffff;
color: #000000;
}
.searchform-fulltext .searchterm .search.focus-visible,
.form--searchform-simple .searchterm .search.focus-visible {
box-shadow: 0px 0px 2px 2px #0076dd;
}
/* copy from masterlayout gmap.less and modified */
/* gmap infowindow */
/* ToDo: aufräumen */
/* EXTENDED CONTROLS: Liste von Overlay von Mapoverlays an/ausschalten */
.gmap-container {
position: relative;
}
.gmap-container img {
max-width: none;
}
.gmap-container .extended-controls {
position: absolute;
bottom: 1.5em;
right: 0px;
background-color: #ffffff;
overflow: hidden;
max-height: 75%;
width: 235px;
max-width: 70%;
z-index: 1;
border: 1px solid #888;
box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.3);
margin: 1em;
}
.gmap-container .extended-controls .gmap-options-head {
text-align: center;
height: 12px;
position: relative;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
border-bottom: 1px solid #666;
}
.gmap-container .extended-controls .gmap-options-head:after {
content: "";
display: block;
height: 25px;
bottom: -25px;
background: transparent;
background: linear-gradient(0deg, rgb(255, 255, 255) 12%, rgba(255, 255, 255, 0) 45%);
position: absolute;
width: 100%;
}
.gmap-container .extended-controls .input {
max-height: 25px;
transition: max-height 0.25s ease;
border-top: 0px solid #666;
padding: 0;
overflow: hidden;
}
.gmap-container .extended-controls .input ul {
list-style: none;
padding: 0;
margin: 0;
padding: 0.2em 0.5em 0.5em 0.5em;
}
.gmap-container .extended-controls .input ul > li {
margin-left: 0;
}
.gmap-container .extended-controls .input ul > li:before {
content: unset;
display: none;
}
.gmap-container .extended-controls .input ul > li::marker {
display: none;
content: unset;
}
.gmap-container .extended-controls .input li div.gmap-options-checkbox {
background-position: 0px -27px;
background-repeat: no-repeat;
padding-left: 25px;
word-wrap: break-word;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
cursor: pointer;
}
.gmap-container .extended-controls .input li.gmap-options-selected div.gmap-options-checkbox {
background-position: top left;
}
.gmap-container .extended-controls.show .gmap-options-head {
margin-bottom: 0;
height: 32px;
}
.gmap-container .extended-controls.show .gmap-options-head:after {
display: none;
}
.gmap-container .extended-controls.show .gmap-options-head img {
transform: rotate(180deg);
}
.gmap-container .extended-controls.show .input {
max-height: 255px;
overflow-y: auto;
}
.gmap-container .extended-controls.show .input ul {
padding-top: 0.5em;
}
.inline-legend .title img {
max-height: 20px;
margin-right: 5px;
}
.image {
display: block;
margin-bottom: 0.75em;
position: relative;
z-index: 0;
}
.image > *:last-child {
margin-bottom: 0;
}
.image--noresize img {
width: auto;
}
.image__overlay {
background: transparent;
position: absolute;
left: 0;
bottom: 0;
padding: 1.5em;
height: 100%;
width: 100%;
}
.image__overlay h1,
.image__overlay h2,
.image__overlay h3,
.image__overlay p,
.image__overlay a:not(.button) {
color: #ffffff;
text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.4);
}
.image__overlay .image__copyright {
position: absolute;
bottom: 0.3em;
right: 0.5em;
color: rgba(255, 255, 255, 0.4);
}
.image__overlay .title {
font-size: 18px;
font-weight: bold;
line-height: 1.2;
}
@media print, (min-width: 73.8135rem ) {
.image__overlay .title {
font-size: 24px;
}
}
.image__overlay .image__copyright {
position: absolute;
bottom: 0.3em;
right: 0.5em;
}
.image__overlay.align--bottom {
display: flex;
justify-content: flex-end;
flex-direction: column;
}
.image__overlay.align--bottom .image__copyright {
top: 0.3em;
left: auto;
right: 0.5em;
bottom: auto;
}
.image--darken .image__image {
filter: brightness(0.6);
}
.image__image {
margin-bottom: 0.2em;
}
.image__image img {
width: 100%;
display: block;
}
.image__image > a {
display: block;
}
@media screen and (max-width: 37.5rem) {
*[class*=modul-teaser] .image__image,
*[class*=modul-text_bild] .image__image,
*[class*=hero] .image__image,
*[class*=modul-rss_list] .image__image {
margin-left: -12px;
margin-right: -12px;
width: auto !important;
max-width: 100vw !important;
}
}
.image__copyright {
font-size: 11px;
color: #454545;
display: block;
margin-bottom: 0.25em;
line-height: 1.2;
word-break: break-word;
}
.image__caption {
color: #000000;
margin-bottom: 0.25em;
display: block;
font-weight: 400;
font-size: 14px;
line-height: 1.2;
word-break: break-word;
}
/* Display article images allways inside a ratio 2:1 container */
.image--force-2x1 .image__image {
aspect-ratio: 2/1;
background-color: #f5f5f5;
display: flex;
align-items: center;
justify-content: center;
}
.image--force-2x1 .image__image img {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
}
.image__image.simple-image img {
width: unset;
min-width: 80px;
}
.image__image.simple-image.withlink {
position: relative;
}
.image__image.simple-image.withlink:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 18px;
height: 18px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-arrow-right);
mask-image: var(--bicon-arrow-right);
color: #ffffff;
}
.image__image.simple-image.withlink:after {
pointer-events: none;
margin: 9px;
}
.image__image.simple-image.withlink:before {
content: "";
background: #000000;
width: 36px;
height: 36px;
}
.image__image.simple-image.withlink:before, .image__image.simple-image.withlink:after {
position: absolute;
right: 0;
top: 0;
display: inline-flex;
}
.message, .message--info, .message--success, .message--error {
padding: 18px;
margin-bottom: 25px;
color: #000000;
background-color: #f9f4e4;
border: 1px solid #f9f4e4;
display: block;
width: fit-content;
min-width: 100%;
}
.message .title, .message--info .title, .message--success .title, .message--error .title,
.message > *:first-child,
.message--info > *:first-child,
.message--success > *:first-child,
.message--error > *:first-child {
margin-top: 0;
}
.message > *:last-child, .message--info > *:last-child, .message--success > *:last-child, .message--error > *:last-child {
margin-bottom: 0;
}
.message--error {
background-color: #fdecee;
border-color: #fdecee;
color: #9b0000;
}
.message--error .title {
color: #9b0000;
}
.message--success {
background-color: #e2f1eb;
border-color: #e2f1eb;
color: #000000;
}
.message--success .title {
color: #000000;
}
.message--info {
background-color: #ebf1f7;
border-color: #ebf1f7;
}
[class*=modul-] {
margin-bottom: 50px;
overflow: visible;
/*&:after {
// Do not use clearfix on all modules, because sometimes (article toc) we dont want to clear it
clear: both;
content: " ";
display: table;
}*/
}
[class*=modul-].halfspace {
margin-bottom: 25px;
}
[class*=modul-].nospace {
margin-bottom: 0;
}
[class*=modul-]:not(.modul-headline) {
/* // too global
> *:last-child {
margin-bottom: 0;
}
*/
}
[class*=modul-]:not(.modul-headline) > .title {
margin-top: 0;
}
[class*=modul-]:not(.modul-headline) > .title a {
color: inherit;
}
/*
.modul-iconlist {
// see atom iconlist
}
*/
.modul-arrowtiles ul {
list-style: none;
padding: 0;
}
.modul-arrowtiles ul > li {
margin-left: 0;
}
.modul-arrowtiles ul > li:before {
content: unset;
display: none;
}
.modul-arrowtiles ul > li::marker {
display: none;
content: unset;
}
.modul-arrowtiles ul > li {
margin-bottom: 20px;
}
@media print, (min-width: 37.501rem ) {
.modul-arrowtiles ul {
gap: 20px;
display: flex !important;
display: -ms-flexbox !important;
flex-wrap: wrap !important;
align-items: stretch;
width: auto !important;
}
.modul-arrowtiles ul > li {
width: calc(50% - 10px);
margin-bottom: 0;
}
}
@media print, (min-width: 92.501rem ) {
.modul-arrowtiles ul > li {
width: calc(25% - 15px);
}
}
.arrowtile {
background-color: #f5f5f5;
color: #000000;
position: relative;
min-height: 36px;
padding: 18px;
height: 100%;
width: 100%;
}
.arrowtile .title {
display: block;
word-break: break-word;
font-size: 16px;
line-height: 1.353em;
margin-bottom: 0.75em;
padding-right: 20px;
font-weight: bold;
color: #000000;
}
.arrowtile .category {
font-size: 14px;
background-color: #efefef;
display: inline-flex;
align-items: center;
gap: 5px;
border-radius: 1em;
padding: 1px 8px 1px 6px;
color: #000000;
}
.arrowtile:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 16px;
height: 16px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-arrow-right);
mask-image: var(--bicon-arrow-right);
color: inherit;
}
.arrowtile:before, .arrowtile:after {
position: absolute;
right: 0;
top: 0;
display: inline-flex;
content: "";
}
.arrowtile:after {
color: #ffffff;
pointer-events: none;
margin: 10px;
}
.arrowtile:before {
display: inline-block;
background: #000000;
height: 36px;
width: 36px;
}
/* Imperia Modul! */
.modul-autoteaser {
overflow: visible;
}
@media print, (min-width: 37.501rem ) {
.modul-autoteaser > .image {
width: 49%;
float: right;
margin-right: 0;
margin-left: 20px;
}
.modul-autoteaser > .image + .list--tablelist {
width: auto;
}
}
.marginal .modul-autoteaser > .image,
.clearteaserfloat .modul-autoteaser > .image,
.flexgrid:not(.grid--1) .modul-autoteaser > .image {
float: none !important;
margin-left: 0;
margin-right: 0;
max-width: none;
width: 100%;
margin-bottom: 0.5em;
}
.azmap ul,
div > ul.azlist-pager {
list-style: none;
padding: 0;
display: flex;
flex-wrap: wrap;
padding: 8px 0 0 8px;
margin: -8px !important;
align-items: center;
justify-content: flex-start;
overflow: hidden;
}
.azmap ul > li,
div > ul.azlist-pager > li {
margin-left: 0;
}
.azmap ul > li:before,
div > ul.azlist-pager > li:before {
content: unset;
display: none;
}
.azmap ul > li::marker,
div > ul.azlist-pager > li::marker {
display: none;
content: unset;
}
.azmap ul > *,
div > ul.azlist-pager > * {
margin: 0;
display: flex;
position: relative;
align-items: stretch;
width: auto;
box-sizing: content-box;
height: auto;
border: 0 solid transparent;
border-width: 0 8px 8px 0;
}
.azmap ul > * img,
div > ul.azlist-pager > * img {
width: auto;
height: auto;
max-height: 100%;
object-fit: contain;
}
.azmap ul li a,
div > ul.azlist-pager li a {
padding: 8px 12px;
line-height: 1;
color: #000000;
font-size: 1em;
min-height: 42px;
min-width: 42px;
border: 2px solid #000000;
border-radius: 0px;
background-color: #ffffff;
color: #000000;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.azmap ul li a:hover,
div > ul.azlist-pager li a:hover {
background-color: rgb(242.25, 242.25, 242.25);
color: #000000;
}
.azmap ul .active,
div > ul.azlist-pager .active {
position: relative;
}
.azmap ul .active:after,
div > ul.azlist-pager .active:after {
position: absolute;
top: 0;
content: "";
border-top: 5px solid #000000;
width: 100%;
}
.azmap {
padding: 18px;
background-color: #f5f5f5;
border: 1px solid;
border-color: #f5f5f5;
margin-bottom: 30px;
}
.azmap > *:last-child {
margin-bottom: 0;
}
div > ul.azlist-pager {
padding: 18px;
background-color: #f5f5f5;
border: 1px solid;
border-color: #f5f5f5;
margin-bottom: 30px !important;
}
div > ul.azlist-pager > *:last-child {
margin-bottom: 0;
}
.modul-azlist .block {
margin-bottom: 0;
}
.azlist-letter {
display: flex;
align-items: flex-start;
}
.azlist-letter .letter {
margin-top: 0;
flex-grow: 1;
font-size: 22px;
padding-left: 0;
border-left: 0 none;
}
.azlist-letter .to-top {
justify-self: flex-end;
font-size: 14px;
line-height: 1.2;
color: #165BE0;
font-weight: normal;
order: 2;
position: relative;
padding-right: 22px;
}
.azlist-letter .to-top:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 12px;
height: 12px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-arrow-right);
mask-image: var(--bicon-arrow-right);
color: #ffffff;
}
.azlist-letter .to-top:after {
transform: rotate(-90deg);
margin: 2px;
position: absolute;
right: 0;
}
.azlist-letter .to-top:before {
content: "";
background: #000000;
width: 16px;
height: 16px;
border-radius: 50%;
position: absolute;
right: 0;
}
.azlist-letter:after {
content: "";
flex-grow: 1;
}
.modul-bildergalerie {
overflow: visible;
/* IMAGE */
}
.modul-bildergalerie .swiper-slide {
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
height: auto;
background-color: #f5f5f5;
}
.modul-bildergalerie .swiper-slide:before, .modul-bildergalerie .swiper-slide:after {
content: "";
display: inline-block !important;
flex-grow: 1;
}
.modul-bildergalerie .swiper-container {
background-color: #ffffff;
}
@media print, (max-width: 73.8125rem) {
.modul-bildergalerie .swiper-container {
margin-left: -12px !important;
margin-right: -12px !important;
width: auto !important;
max-width: 100vw !important;
}
}
.modul-bildergalerie .swiper-container > .swiper-pagination {
position: relative;
bottom: 0;
}
.modul-bildergalerie .image {
display: -ms-grid;
display: grid;
position: relative;
grid-template-areas: "image" "caption" "copyright";
-ms-grid-rows: 1fr auto auto;
grid-template-rows: 1fr auto auto;
height: 100%;
width: 100%;
margin-bottom: 0;
}
.modul-bildergalerie .image .image__image {
position: relative;
-ms-grid-row: 1;
grid-area: image;
justify-self: auto;
align-self: center;
margin-bottom: 0;
display: flex;
align-items: center;
aspect-ratio: 2/1;
}
.modul-bildergalerie .image .image__image img {
width: auto;
margin: 0 auto;
max-height: 490px;
}
@media print, (max-width: 73.8125rem) {
.modul-bildergalerie .image .image__image {
margin-left: 0 !important;
margin-right: 0 !important;
}
}
.modul-bildergalerie .image .image__copyright {
-ms-grid-row: 2;
grid-area: copyright;
background-color: #ffffff;
padding: 0.2em 0em;
margin: 0;
z-index: 0;
}
@media print, (max-width: 73.8125rem) {
.modul-bildergalerie .image .image__copyright {
padding-left: 12px;
}
}
.modul-bildergalerie .image .image__caption {
-ms-grid-row: 3;
grid-area: caption;
position: static;
z-index: 1;
padding: 0.5em 1em;
margin-bottom: 0;
line-height: 18px;
}
@media print, (max-width: 73.8125rem) {
.modul-bildergalerie .image .image__caption {
background-color: #ffffff;
}
}
@media print, (min-width: 73.8135rem ) {
.modul-bildergalerie .image .image__caption {
-ms-grid-row: 1;
grid-area: image;
position: absolute;
background-color: rgba(255, 255, 255, 0.9);
bottom: 0;
left: 0;
width: 100%;
}
}
.modul-bildergalerie .swiper-container.swiper-container--fullscreen {
display: block;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 10000;
inset: 0px;
background-color: rgba(0, 0, 0, 0.85);
margin-left: 0 !important;
margin-right: 0 !important;
aspect-ratio: unset;
}
.modul-bildergalerie .swiper-container.swiper-container--fullscreen .swiper-slide {
background-color: transparent;
height: 100vh;
overflow-y: auto;
}
.modul-bildergalerie .swiper-container.swiper-container--fullscreen .image__image {
flex-grow: 0;
aspect-ratio: unset;
}
.modul-bildergalerie .swiper-container.swiper-container--fullscreen .image__image img {
max-height: 100vh;
}
.modul-bildergalerie .swiper-container.swiper-container--fullscreen .swiper-button-fullscreen-close {
position: absolute;
top: 0;
right: 0;
z-index: 100;
background-color: #000000;
color: #ffffff;
border: 2px solid #000000;
padding: 10px 16px;
}
.modul-bildergalerie .swiper-container.swiper-container--fullscreen .image__caption {
-ms-grid-row: 1;
grid-area: image;
position: absolute;
background-color: rgba(255, 255, 255, 0.9);
bottom: 0;
left: 0;
width: 100%;
}
@media screen and (max-width: 37.5rem) {
.modul-buehne {
margin-left: -12px;
margin-right: -12px;
width: auto !important;
max-width: 100vw !important;
}
}
.modul-buehne .modul-teaser_buehne {
height: 100%;
}
@media print, (max-width: 73.8125rem) {
.modul-buehne .modul-teaser_buehne {
height: auto;
}
.modul-buehne .teaser_buehne__right {
padding-left: 18px;
padding-right: 18px;
}
.modul-buehne .teaser_buehne__left .image__image {
margin-left: 0;
margin-right: 0;
}
}
.modul-buehne .title {
margin-top: 0;
}
.modul-buehne .swiper-container .swiper-pagination,
.modul-buehne .swiper-container .swiper-button-next,
.modul-buehne .swiper-container .swiper-button-prev {
position: static;
width: auto;
height: auto;
margin: 0;
display: inline-block;
line-height: 0;
}
.modul-buehne .swiper-container .swiper-button-next,
.modul-buehne .swiper-container .swiper-button-prev {
background: transparent;
padding: 0.2em 0.2em;
}
.modul-buehne .swiper-container .swiper-button-next:after,
.modul-buehne .swiper-container .swiper-button-prev:after {
width: 21px;
height: 21px;
color: #000000;
text-shadow: none;
display: inline-block;
vertical-align: middle;
}
.modul-buehne .swiper-container .swiper-button-prev:after, .modul-buehne .swiper-container.swiper-container-rtl .swiper-button-next:after {
-webkit-mask-image: var(--bicon-chevron-right);
mask-image: var(--bicon-chevron-right);
transform: rotate(180deg);
}
.modul-buehne .swiper-container .swiper-button-next:after, .modul-buehne .swiper-container.swiper-container-rtl .swiper-button-prev:after {
-webkit-mask-image: var(--bicon-chevron-right);
mask-image: var(--bicon-chevron-right);
}
.modul-buehne .swiper-container .swiper-pagination {
margin-left: 8px;
}
.modul-buehne .swiper-container .modul-teaser_buehne .image__image {
margin-left: 0 !important;
margin-right: 0 !important;
}
.modul-buehne .swiper-container .image a {
display: block;
}
.modul-buehne .swiper-container .swiper-pagination .swiper-pagination-bullet-active {
background: #000000;
}
.modul-buehne .swiper-controls {
display: flex;
align-items: center;
justify-content: flex-start;
margin: 2px 0 5px 0;
}
@media print, (min-width: 37.501rem ) {
.modul-buehne .swiper-controls {
padding-left: 12px;
margin-left: 66%;
}
}
.modul-buehne .modul-teaser_buehne {
margin-bottom: 0;
}
.modul-buehne.buehne--tileslayout .buhne__list--teaser {
margin-bottom: 50px;
list-style: none;
padding: 0;
}
.modul-buehne.buehne--tileslayout .buhne__list--teaser > li {
margin-left: 0;
}
.modul-buehne.buehne--tileslayout .buhne__list--teaser > li:before {
content: unset;
display: none;
}
.modul-buehne.buehne--tileslayout .buhne__list--teaser > li::marker {
display: none;
content: unset;
}
@media screen and (max-width: 37.5rem) {
.modul-buehne.buehne--tileslayout .buhne__list--teaser > li,
.modul-buehne.buehne--tileslayout .buhne__list--teaser > .item {
margin-bottom: 25px;
}
}
@media print, (min-width: 37.501rem ) {
.modul-buehne.buehne--tileslayout .buhne__list--teaser {
display: flex;
flex-wrap: wrap;
gap: 20px;
}
.modul-buehne.buehne--tileslayout .buhne__list--teaser > li,
.modul-buehne.buehne--tileslayout .buhne__list--teaser > .item {
margin: 0;
}
.modul-buehne.buehne--tileslayout .buhne__list--teaser > li:not(:first-child),
.modul-buehne.buehne--tileslayout .buhne__list--teaser > .item:not(:first-child) {
width: calc(33.3333333333% - 13.3333333333px);
}
.modul-buehne.buehne--tileslayout .buhne__list--teaser > li:first-child,
.modul-buehne.buehne--tileslayout .buhne__list--teaser > .item:first-child {
width: 100%;
}
.modul-buehne.buehne--tileslayout .buhne__list--teaser > li > *,
.modul-buehne.buehne--tileslayout .buhne__list--teaser > .item > * {
height: 100%;
}
}
.fullwidth > .modul-buehne {
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
@media (min-width: 980px) {
.fullwidth > .modul-buehne {
width: 980px;
}
}
.modul-calenderinclude {
max-width: 392px;
}
.modul-calenderinclude a.more {
margin: 0.7em 0;
}
.modul-calendar {
width: 392px;
max-width: 100%;
display: inline-block;
}
.modul-calendar a.more {
margin: 0.7em 0;
}
.calendar-table {
position: relative;
}
.calendar-table .controll {
height: 36px;
}
.calendar-table .controll .month {
position: absolute;
left: 0px;
top: 0px;
}
.calendar-table .controll .prev,
.calendar-table .controll .next {
position: absolute;
top: 0px;
}
.calendar-table .controll .prev a,
.calendar-table .controll .next a {
position: relative;
position: relative;
margin: auto;
overflow: hidden;
display: block;
height: 30px;
text-indent: -99999px;
width: 30px;
}
.calendar-table .controll .prev a:before,
.calendar-table .controll .next a:before {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 21px;
height: 21px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-chevron-right);
mask-image: var(--bicon-chevron-right);
color: #000000;
}
.calendar-table .controll .prev a:before,
.calendar-table .controll .next a:before {
text-indent: 0px;
position: absolute;
top: 0;
right: 0;
}
.calendar-table .controll .prev a:not([href]):before,
.calendar-table .controll .next a:not([href]):before {
color: #737373;
}
.calendar-table .controll .prev {
right: 30px;
}
.calendar-table .controll .prev a:before {
transform: rotate(180deg);
}
.calendar-table .controll .next {
right: 0px;
height: 30px;
}
.calendar-table .year,
.calendar-table .month {
font-weight: bold;
margin: 0;
line-height: 1.3;
display: block;
}
.calendar-table .year {
font-size: 21px;
}
.calendar-table .month {
font-size: 26px;
color: #000000;
}
.calendar-table .calendar-head {
display: flex;
justify-content: space-between;
margin-bottom: 0.5em;
}
.calendar-table .calendar-head .controls {
font-size: 24px;
}
.calendar-table .calendar-head .title {
margin: 0;
}
.calendar-table .calendar-head .prev,
.calendar-table .calendar-head .next {
border: 0 none;
background-color: transparent;
}
.calendar-table .calendar-head .prev:before,
.calendar-table .calendar-head .next:before {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 24px;
height: 24px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-chevron-right);
mask-image: var(--bicon-chevron-right);
color: #000000;
}
.calendar-table .calendar-head .prev:before,
.calendar-table .calendar-head .next:before {
margin: 0;
}
.calendar-table .calendar-head .prev.disabled:before,
.calendar-table .calendar-head .next.disabled:before {
color: #737373;
}
.calendar-table .calendar-head .prev:before {
transform: rotate(180deg);
}
.calendar-table table {
border-collapse: unset;
margin-bottom: 0;
}
.calendar-table table td,
.calendar-table table th {
padding: 0;
height: 35px;
background-color: #ffffff;
border: 0 none;
text-align: center;
vertical-align: middle;
}
.calendar-table table .dayname > th {
border-bottom: 1px solid #000000;
font-weight: bold;
}
.calendar-table table td {
border: 1px solid #ffffff;
height: 42px;
width: 42px;
}
.calendar-table table tbody .sonnfeiertag {
color: #737373;
}
.calendar-table table tbody .buchbar,
.calendar-table table tbody a .sonnfeiertag {
font-weight: bold;
color: #165BE0;
}
.calendar-table table .nichtbuchbar {
background-color: #f5f5f5;
color: #737373;
}
.calendar-table table .buchbar {
background-color: inherit;
}
.calendar-table table .buchbar a {
padding: 12px;
color: inherit;
color: inherit;
}
.calendar-table table .buchbar,
.calendar-table table .nichtbuchbar,
.calendar-table table .heutemarkierung {
border-radius: 0;
}
.calendar-table table .heutemarkierung {
border: 1px solid #000000;
}
.calendar-table .popover-container .event-popover {
position: relative;
z-index: auto;
}
.calendar-table .popover-container .event-popover .popover {
position: absolute;
z-index: 2;
background: #ffffff;
border: 1px solid #dddddd;
font-weight: normal;
width: 400px;
max-width: 90vw;
padding: 0 18px;
text-align: left;
color: #000000;
}
.modul-card {
position: relative;
padding: 0;
border: 0px solid #dddddd;
background-color: #f5f5f5;
padding: 9px 18px;
margin-bottom: 25px;
}
.modul-card > * > *:first-child {
margin-top: 0;
}
.modul-card > * > *:last-child {
margin-bottom: 0;
}
.modul-card .title {
margin-top: 0;
color: #000000;
font-size: 22px;
margin-bottom: 8px;
}
.modul-card .title a {
color: #000000;
}
.modul-card .card__header {
display: flex;
flex-wrap: wrap;
flex-direction: column;
}
.modul-card .card__header .title {
order: 2;
width: fit-content;
}
.modul-card .card__header .status {
order: 3;
margin-bottom: 5px;
}
.modul-card .card__header .subtitle {
order: 4;
margin-bottom: 0.75em;
}
.modul-card .card__header .subtitle > * {
margin-bottom: 0;
}
.modul-card .card__header .functions {
display: flex;
order: 1;
align-self: flex-end;
margin-top: -9px;
margin-right: -18px;
margin-bottom: 8px;
}
.modul-card .card__header [class*=cardbutton] {
margin: 0 0 -8px 4px;
}
.modul-card .card__footer {
position: relative;
bottom: -9px;
padding: 9px 18px;
margin: 6px -18px 0 -18px;
background-color: #dddddd;
}
[class*=cardbutton] {
border: 0 none;
position: relative;
background-image: linear-gradient(135deg, rgba(160, 160, 160, 0.5) 10%, transparent 10%, transparent 50%, rgba(160, 160, 160, 0.5) 50%, rgba(160, 160, 160, 0.5) 60%, transparent 60%, transparent 100%);
background-size: 7.07px 7.07px;
font-size: 18px;
width: 44px;
height: 44px;
display: flex;
align-items: center;
justify-content: center;
z-index: 0;
/*
&:after {
margin: 0;
position: relative;
}
*/
}
[class*=cardbutton] > * {
z-index: 2;
}
[class*=cardbutton]:before {
content: "";
border-radius: 50%;
background: #ffffff;
display: inline-block;
position: absolute;
z-index: 1;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: 5px;
}
[class*=cardbutton].active {
color: #e40422;
}
[class*=cardbutton].inactive {
color: #aaaaaa;
}
.cardbutton--wishlist:after {
content: "\f004";
font-weight: 400;
}
.cardbutton--wishlist.active:after {
font-weight: 700;
color: #e40422;
}
[class*=panel--] .modul-card {
background-color: #ffffff;
}
.modul-carousel .swiper-container {
padding-bottom: 65px;
}
.modul-carousel .swiper-controls {
position: absolute;
bottom: 0;
top: auto;
width: 100%;
padding: 3px;
display: flex;
flex-wrap: nowrap;
justify-content: center;
align-items: center;
gap: 50px;
}
.modul-carousel .swiper-controls .swiper-button-prev,
.modul-carousel .swiper-controls .swiper-button-next,
.modul-carousel .swiper-controls .swiper-pagination {
position: static;
width: auto;
height: auto;
flex-grow: 0;
margin: 0;
background: none;
}
.modul-carousel .swiper-controls .swiper-button-prev,
.modul-carousel .swiper-controls .swiper-button-next {
width: auto;
height: auto;
padding: 0;
}
.modul-carousel .swiper-controls .swiper-button-prev:after,
.modul-carousel .swiper-controls .swiper-button-next:after {
-webkit-mask-image: var(--bicon-chevron-right);
mask-image: var(--bicon-chevron-right);
color: #000000;
}
.modul-carousel .swiper-controls .swiper-button-prev {
order: 1;
}
.modul-carousel .swiper-controls .swiper-button-next {
order: 3;
}
.modul-carousel .swiper-controls .swiper-pagination {
order: 2;
}
.modul-carousel .swiper-controls .swiper-pagination .swiper-pagination-bullet-active {
background: #000000;
}
.modul-carousel .swiper-slide > * {
margin-bottom: 0;
}
.modul-carousel .image__image {
margin-left: initial;
margin-right: initial;
}
address {
font-style: normal;
}
.modul-contact {
min-width: 10em;
}
.modul-contact .accessibility .symbol-description {
font-size: 14px;
margin-bottom: 1em;
}
.modul-contact .accessibility ul + .symbol-description {
margin-top: -25px;
display: block;
width: fit-content;
}
.modul-contact .accessibility img {
max-width: 36px;
max-height: 36px;
max-width: auto;
}
.modul-contact.highlight {
padding: 1.125em;
background-color: #ffffff;
border: 1px solid #dddddd;
}
.modul-contact.highlight > *:last-child {
margin-bottom: 0;
}
.list--contact,
.html5-section.contact {
list-style: none;
padding: 0;
/*> li:before {
margin-left: 0; // overwrite our own list style
}*/
}
.list--contact > li,
.html5-section.contact > li {
margin-left: 0;
}
.list--contact > li:before,
.html5-section.contact > li:before {
content: unset;
display: none;
}
.list--contact > li::marker,
.html5-section.contact > li::marker {
display: none;
content: unset;
}
.list--contact .loc,
.list--contact .tel,
.list--contact .mobile,
.list--contact .fax,
.list--contact .email,
.list--contact .homepage,
.html5-section.contact .loc,
.html5-section.contact .tel,
.html5-section.contact .mobile,
.html5-section.contact .fax,
.html5-section.contact .email,
.html5-section.contact .homepage {
display: flex;
flex-wrap: wrap;
align-items: center;
}
.list--contact .loc:before,
.list--contact .tel:before,
.list--contact .mobile:before,
.list--contact .fax:before,
.list--contact .email:before,
.list--contact .homepage:before,
.html5-section.contact .loc:before,
.html5-section.contact .tel:before,
.html5-section.contact .mobile:before,
.html5-section.contact .fax:before,
.html5-section.contact .email:before,
.html5-section.contact .homepage:before {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 1em;
height: 1em;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-arrow-right);
mask-image: var(--bicon-arrow-right);
color: #000000;
}
.list--contact .loc:before,
.list--contact .tel:before,
.list--contact .mobile:before,
.list--contact .fax:before,
.list--contact .email:before,
.list--contact .homepage:before,
.html5-section.contact .loc:before,
.html5-section.contact .tel:before,
.html5-section.contact .mobile:before,
.html5-section.contact .fax:before,
.html5-section.contact .email:before,
.html5-section.contact .homepage:before {
min-width: 1em;
text-align: center;
margin-right: 0.5em;
}
.list--contact .loc:before,
.html5-section.contact .loc:before {
-webkit-mask-image: url(./b10ac18e9dbc648f3883.svg);
mask-image: url(./b10ac18e9dbc648f3883.svg);
}
.list--contact .fax:before,
.html5-section.contact .fax:before {
-webkit-mask-image: url(./b550caa92fe46c2c8e4e.svg);
mask-image: url(./b550caa92fe46c2c8e4e.svg);
}
.list--contact .email:before,
.html5-section.contact .email:before {
-webkit-mask-image: url(./0d62483196704ba4c326.svg);
mask-image: url(./0d62483196704ba4c326.svg);
}
.list--contact .homepage:before,
.html5-section.contact .homepage:before {
-webkit-mask-image: url(./a6da65197400b6acf980.svg);
mask-image: url(./a6da65197400b6acf980.svg);
}
.list--contact .signedmail > a:after,
.html5-section.contact .signedmail > a:after {
content: url(./dafc887bc2ed306cc06a.svg);
margin-left: 0.2em;
}
.list--contact .tel:before,
.html5-section.contact .tel:before {
-webkit-mask-image: url(./88b9d81d6be3703b7186.svg);
mask-image: url(./88b9d81d6be3703b7186.svg);
}
.list--contact .tel.is115,
.html5-section.contact .tel.is115 {
position: relative;
margin-top: 100px;
}
.list--contact .tel.is115:after,
.html5-section.contact .tel.is115:after {
position: absolute;
top: -100px;
content: url(./4a4ff519f7ea465bbc14.svg);
margin-left: 0.2em;
width: 135px;
display: block;
margin: 20px 0;
}
.list--contact .mobile:before,
.html5-section.contact .mobile:before {
-webkit-mask-image: url(./7798f5adec3dd6403fc7.svg);
mask-image: url(./7798f5adec3dd6403fc7.svg);
}
.list--contact .note,
.html5-section.contact .note {
font-size: 14px;
width: 100%;
}
.html5-section.contact p,
.html5-section.contact .loc,
.html5-section.contact .textile,
.html5-section.contact .contact-info {
margin-bottom: 6px;
}
.html5-section.contact .loc:before {
float: left;
}
.html5-section.contact .loc a {
display: table;
}
.modul-download-multi .title + .modul-download {
padding-top: 0;
}
.modul-download-multi .modul-download {
border-top: 0 none;
margin: 0;
}
.modul-download-multi .modul-download:first-child {
padding-top: 0;
}
.modul-download-multi.js-accordion .modul-download:last-child {
border-bottom: 0;
}
.modul-download-multi > ul {
list-style: none;
padding: 0;
}
.modul-download-multi > ul > li {
margin-left: 0;
}
.modul-download-multi > ul > li:before {
content: unset;
display: none;
}
.modul-download-multi > ul > li::marker {
display: none;
content: unset;
}
.modul-download {
border-top: 1px solid #dddddd;
border-bottom: 1px solid #dddddd;
padding: 20px 0;
}
@media print, (min-width: 37.501rem ) {
.modul-download {
display: flex;
justify-content: space-between;
align-items: center;
}
.modul-download > * > *:first-child {
margin-top: 0;
}
.modul-download > * > *:last-child {
margin-bottom: 0;
}
.modul-download > *:first-child {
flex-grow: 1;
padding-right: 18px;
border-right: 1px solid #dddddd;
}
.modul-download > *:last-child {
flex-grow: 0;
flex-shrink: 0;
padding-left: 18px;
align-items: center;
}
}
.modul-download + .modul-download {
border-top: 0 none;
}
.modul-download .text,
.modul-download .title {
word-break: break-word;
margin: 0 0.5em 0.5em 0;
}
.modul-download .title {
font-size: 17px;
line-height: 1.353em;
color: #000000;
margin-bottom: 0.4em;
}
.modul-download .textile > *:last-child {
margin-bottom: 0;
}
.modul-download .caption {
word-break: break-word;
margin: 0;
font-size: 14px;
color: #454545;
}
@media screen and (max-width: 37.5rem) {
.modul-download .caption {
margin-bottom: 1em;
}
}
.modul-download .caption > li {
margin-bottom: 0;
}
.modul-download .link--download {
min-height: 43px;
width: auto;
border-radius: 0px;
/* margin: $buttonMargin; // not here */
text-decoration: none;
padding: 10px 16px;
font-size: 1em;
line-height: 1.2;
display: inline-block;
text-align: center;
justify-content: center;
cursor: pointer;
overflow: visible;
background-color: #ffffff;
color: #000000;
border: 2px solid #000000;
transition: background-color 0.2s ease-out;
position: relative;
padding-right: 59px;
}
.modul-download .link--download:not(:disabled):hover {
text-decoration: none;
background-color: rgb(242.25, 242.25, 242.25);
}
.modul-download .link--download:not(:disabled):focus {
text-decoration: none;
background-color: rgb(242.25, 242.25, 242.25);
}
.modul-download .link--download:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 18px;
height: 18px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: url(./b968a092d0f57c913b81.svg);
mask-image: url(./b968a092d0f57c913b81.svg);
color: #ffffff;
}
.modul-download .link--download:after {
pointer-events: none;
margin: 10.5px;
}
.modul-download .link--download:before {
content: "";
background: #000000;
border-left: 2px solid #000000;
width: 39px;
height: 100%;
}
.modul-download .link--download:before, .modul-download .link--download:after {
position: absolute;
right: 0;
top: 0;
display: inline-flex;
line-height: 2em;
justify-content: center;
align-items: center;
}
.modul-download .link--download:before {
-webkit-mask-image: none;
mask-image: none;
margin: 0;
}
.modul-download [class*=modul] {
margin-bottom: 0;
}
.emperorlist__list:not(.list--oddeven) {
list-style: none;
padding: 0;
}
.emperorlist__list:not(.list--oddeven) > li {
margin-left: 0;
}
.emperorlist__list:not(.list--oddeven) > li:before {
content: unset;
display: none;
}
.emperorlist__list:not(.list--oddeven) > li::marker {
display: none;
content: unset;
}
.emperorlist__list:not(.list--oddeven) > li + li {
margin-top: 10px;
padding-top: 10px;
border-top: 1px solid #dddddd;
}
@media print, (min-width: 57.501rem ) {
.emperorlist__list {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
}
.emperorlist__list > * {
grid-column: 3;
grid-row: auto;
}
.emperorlist__list > *:first-child {
grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 1;
grid-row-end: 100;
margin-right: 20px;
}
}
.emperorlist__list .emperorlist__element a.more {
color: #000000;
font-weight: bold;
}
.emperorlist__list > li:before {
content: unset;
display: none;
}
.emperorlist__list > *:first-child {
border-width: 0 !important;
padding: 0 !important;
}
.emperorlist__list > *:first-child .emperorlist__element .text {
border: 1px solid black;
border-width: 1px 1px 0 1px;
padding: 1em;
margin-bottom: 0;
position: relative;
}
.emperorlist__list > *:first-child .emperorlist__element .text a.more {
font-size: 23px;
}
.emperorlist__list > *:first-child .emperorlist__element .text:after {
background-image: linear-gradient(135deg, rgba(0, 0, 0, 0.7) 4.55%, transparent 4.55%, transparent 50%, rgba(0, 0, 0, 0.7) 50%, rgba(0, 0, 0, 0.7) 54.55%, transparent 54.55%, transparent 100%);
background-size: 11px 11px;
position: absolute;
content: "";
top: 0;
right: 0;
width: 40px;
height: 40px;
}
.emperorlist__list > *:first-child .emperorlist__element .image__image {
margin-top: 0;
border: 1px solid black;
border-width: 0px 1px 1px 1px;
}
.emperorlist__list > *:nth-child(2) {
margin-top: 0 !important;
border-top: 0 none !important;
padding-top: 0 !important;
}
.emperorlist__list > *:last-child {
border-bottom: 0 none !important;
}
.emperorlist__list .morelink {
text-align: right;
margin-top: 10px;
background-color: transparent !important;
}
.modul-facetingform .facetingform__container {
background-color: #f5f5f5;
padding: 18px;
position: static;
}
.modul-facetingform .facetingform__container .container__head {
display: flex;
justify-content: space-between;
align-items: baseline;
margin-bottom: 12px;
}
.modul-facetingform .facetingform__container .title {
margin: 0;
font-size: 22px;
font-weight: bold;
}
.modul-facetingform .facetingform__container fieldset,
.modul-facetingform .facetingform__container legend {
margin: 0;
}
.modul-facetingform .facetingform__container .facets {
margin: 0;
}
.modul-facetingform .facetingform__container .facets .facet {
border-bottom: 1px solid #dddddd;
}
.modul-facetingform .facetingform__container .facet-title {
display: inline-block;
color: #000000;
text-decoration: none;
margin: 0;
padding: 12px 0;
font-size: 16px;
font-weight: bold;
border: 0 none;
background: transparent;
text-align: left;
}
.modul-facetingform .facetingform__container .facet-title .text {
margin-right: 3px;
display: inline-block;
}
.modul-facetingform .facetingform__container .facet-title[data-collapsible-trigger] {
width: 100%;
display: block;
position: relative;
}
.modul-facetingform .facetingform__container .facet-title[data-collapsible-trigger].closed:after, .modul-facetingform .facetingform__container .facet-title[data-collapsible-trigger].opened:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 1em;
height: 1em;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-chevron-right);
mask-image: var(--bicon-chevron-right);
}
.modul-facetingform .facetingform__container .facet-title[data-collapsible-trigger].closed:after, .modul-facetingform .facetingform__container .facet-title[data-collapsible-trigger].opened:after {
position: absolute;
right: 0;
top: 13px;
transform: rotate(90deg);
}
.modul-facetingform .facetingform__container .facet-title[data-collapsible-trigger].opened:after {
transform: rotate(-90deg);
}
.modul-facetingform .facetingform__container .facet__head {
display: block;
width: 100%;
}
.modul-facetingform .facetingform__container .facet__body {
width: 100%;
display: block;
margin: 0;
padding-bottom: 12px;
}
.modul-facetingform .facetingform__container .facet__body > *:last-child {
margin-bottom: 0;
}
.modul-facetingform .facetingform__container .facets__actions {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 24px;
flex-wrap: wrap;
row-gap: 25px;
}
.modul-facetingform .facet-entries-toggler {
color: #000000;
border: 0 none;
background: transparent;
padding: 0;
}
.modul-facetingform .facet-entries-toggler:before {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 1em;
height: 1em;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-chevron-right);
mask-image: var(--bicon-chevron-right);
color: #000000;
}
.modul-facetingform .facet-entries-toggler:before {
transform: rotate(90deg);
margin-right: 0.3em;
}
.modul-facetingform .facet-entries-toggler.opened:before {
transform: rotate(-90deg);
}
.modul-facetingform .active-entries-counter:after {
content: ")";
display: inline-block;
}
.modul-facetingform .active-entries-counter:before {
content: "(";
display: inline-block;
}
[class*=panel--] .modul-facetingform .facetingform__container {
background-color: #ffffff;
}
@media print, (min-width: 37.501rem ) {
.js-facetingform-toggler {
display: none;
}
}
@media screen and (max-width: 37.5rem) {
.js-facetingform-toggler {
display: inline-block;
}
}
@media print, (min-width: 37.501rem ) {
.js-facetingform {
display: block !important;
position: relative;
z-index: auto;
}
.js-facetingform .facetingform__background,
.js-facetingform .close {
display: none !important;
}
}
@media screen and (max-width: 37.5rem) {
.js-facetingform.isOverlayPalm {
display: none;
}
.js-facetingform.isOverlayPalm.isHidden {
display: none;
}
.js-facetingform.isOverlayPalm.isVisible {
display: block;
position: fixed;
z-index: 1000;
left: 0;
top: 0;
height: 100vh;
width: 100vw;
}
.js-facetingform.isOverlayPalm .close {
display: inline-block;
}
.js-facetingform.isOverlayPalm .facetingform__container {
display: flex;
flex-direction: column;
width: 90vw;
max-width: 500px;
position: absolute;
right: 0;
top: 0;
height: 100vh;
}
.js-facetingform.isOverlayPalm .facetingform__container .container__body {
padding-bottom: 60px;
overflow-y: auto;
}
}
.modul-faq {
/* we use accordion as base and modify it. see js-accordion.scss */
}
.modul-faq .js-accordion__heading {
font-size: 1em;
}
.modul-faq.js-accordion + .js-accordion.modul-faq {
margin-top: -50px;
}
.modul-faq .panel:before, .modul-faq .panel:after {
content: " ";
display: table;
clear: both;
}
@media print, (min-width: 37.501rem ) {
.modul-faq .panel .image {
float: left;
width: 40%;
margin-left: 0;
margin-right: 20px;
}
.modul-faq .panel.imagealignright .image {
float: right;
margin-left: 20px;
margin-right: 0;
}
}
.layer-menu-control {
overflow: auto;
display: inline-flex;
flex-direction: column;
border: 1px solid #dddddd;
background: #ffffff;
box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
border-radius: 4px;
}
.layer-menu-control .layer-menu-control_toggle {
display: flex;
align-items: center;
justify-content: flex-end;
width: 100%;
height: 32px;
border: 0;
background: #ffffff;
padding-right: 10px;
}
.layer-menu-control .layer-menu-control_toggle .icon {
min-width: 23px;
text-align: center;
display: inline-block;
}
.layer-menu-control .layer-menu-control_toggle:hover {
background-color: #f5f5f5;
}
.layer-menu-control .layer-menu-inner {
max-height: 160px;
min-width: 150px;
overflow: auto;
margin: 0;
width: 100%;
border-top: 1px solid #dddddd;
}
.layer-menu-control ul {
margin: 0;
}
.layer-menu-control ul.list--ruler > li {
margin: 0;
padding: 0;
}
.layer-menu-control .layer-menu-control_item {
padding: 5px 10px;
background-color: transparent;
width: 100%;
cursor: pointer;
border: 0 none;
background-color: #ffffff;
text-align: left;
overflow: hidden;
}
.layer-menu-control .layer-menu-control_item:not(:disabled):hover {
background-color: #f5f5f5;
}
.layer-menu-control .layer-menu-control_item .item {
min-width: 1em;
min-height: 1em;
display: inline-block;
vertical-align: text-bottom;
float: right;
}
.layer-menu-control .layer-menu-control_item::before {
content: " ";
width: 1em;
display: inline-block;
}
.layer-menu-control .layer-menu-control_item.layer-menu-control_item--active::before {
content: "✔︎";
}
.layer-menu-control.layer-menu-control--collapsed .layer-menu-control_toggle {
min-width: 32px;
overflow: hidden;
justify-content: center;
padding: 0;
}
.layer-menu-control.layer-menu-control--collapsed .layer-menu-inner,
.layer-menu-control.layer-menu-control--collapsed .layer-menu-control_item {
display: none;
}
.modul-geomap {
position: relative;
z-index: 0;
overflow: visible;
}
.modul-geomap .geomap-map {
background-color: #f5f5f5;
overflow: hidden;
}
.modul-geomap .mapmarker {
margin-top: 20px;
}
.modul-geomap .mapmarker .title {
margin-top: 0;
}
.skipmap {
margin: 0;
}
.skipmap a {
height: 0;
overflow: hidden;
display: block;
}
.skipmap a:focus, .skipmap a:focus-visible {
height: auto;
margin-bottom: 5px;
}
.geomap__addressblock {
display: flex;
align-items: start;
flex-wrap: nowrap;
margin: 0.3em 0;
}
.geomap__addressblock .address {
flex-grow: 1;
margin: 0;
}
.geomap__addressblock .showonmap {
justify-self: flex-end;
}
.accept_map {
padding: 18px;
background-color: #f5f5f5;
border: 1px solid;
border-color: #f5f5f5;
min-height: 200px;
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
text-align: center;
}
.accept_map > *:last-child {
margin-bottom: 0;
}
.accept_map_padding {
max-width: 700px;
}
.modul-headline {
margin-bottom: 0;
}
.modul-headline + * {
margin-top: 0 !important;
}
/*
* Single icontile config:
*/
/*
* Wrapper (modul-icontiles) config:
*/
.modul-icontiles {
overflow: visible;
}
.modul-icontiles .icontile,
.modul-icontiles .modul-icontile {
margin-bottom: 0;
}
.modul-icontiles .icontiles__inner {
background-color: transparent;
}
.modul-icontiles ul {
list-style: none;
padding: 0;
}
.modul-icontiles ul > li {
margin-left: 0;
}
.modul-icontiles ul > li:before {
content: unset;
display: none;
}
.modul-icontiles ul > li::marker {
display: none;
content: unset;
}
@media print, (min-width: 37.501rem ) {
.modul-icontiles ul {
gap: 20px;
display: flex !important;
display: -ms-flexbox !important;
flex-wrap: wrap !important;
align-items: stretch;
width: auto !important;
}
.modul-icontiles ul > li {
width: calc(50% - 10px);
}
}
@media print, (min-width: 57.501rem ) {
.modul-icontiles ul > li {
width: calc(33.3333333333% - 13.3333333333px);
}
}
@media print, (min-width: 92.501rem ) {
.modul-icontiles ul > li {
width: calc(25% - 15px);
}
.modul-icontiles ul.grid--3 > li {
width: calc(33.3333333333% - 13.3333333333px);
}
}
.modul-icontiles.icontiles--simple .icontiles__inner {
background-color: transparent;
}
.modul-icontiles.icontiles--simple .icontile {
background-color: #f5f5f5;
align-items: flex-start;
padding-top: 18px;
}
.modul-icontiles.icontiles--simple .icontile .inner::after,
.modul-icontiles.icontiles--simple .icontile .inner::before {
display: none;
}
.modul-icontiles.icontiles--simple .icontile .decoration {
color: #000000;
}
.icontile,
.modul-icontile {
align-items: flex-end;
display: flex;
min-height: 0px;
background-color: #f5f5f5;
padding: 18px;
position: relative;
height: 100%;
width: 100%;
padding-top: 40px;
}
.icontile .title,
.modul-icontile .title {
word-break: break-word;
font-size: 16px;
font-weight: bold;
position: relative;
margin-bottom: 0;
color: #000000;
}
@media print, (min-width: 73.8135rem ) {
.icontile,
.modul-icontile {
min-height: 130px;
}
}
.icontile .inner,
.modul-icontile .inner {
width: 100%;
}
.icontile .decoration,
.modul-icontile .decoration {
max-width: 30%;
margin-right: 14px;
margin-left: -6px;
font-size: 40px;
line-height: 1;
font-weight: bold;
color: #cccccc;
}
.icontile .action a.more:after,
.icontile .inner:after,
.modul-icontile .action a.more:after,
.modul-icontile .inner:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 16px;
height: 16px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-arrow-right);
mask-image: var(--bicon-arrow-right);
color: inherit;
}
.icontile .action a.more:before, .icontile .action a.more:after,
.icontile .inner:before,
.icontile .inner:after,
.modul-icontile .action a.more:before,
.modul-icontile .action a.more:after,
.modul-icontile .inner:before,
.modul-icontile .inner:after {
position: absolute;
right: 0;
top: 0;
display: inline-flex;
content: "";
}
.icontile .action a.more:after,
.icontile .inner:after,
.modul-icontile .action a.more:after,
.modul-icontile .inner:after {
color: #ffffff;
pointer-events: none;
margin: 10px;
}
.icontile .action a.more:before,
.icontile .inner:before,
.modul-icontile .action a.more:before,
.modul-icontile .inner:before {
display: inline-block;
background: #000000;
height: 36px;
width: 36px;
}
.modul-iframe iframe {
margin: 0;
overflow: auto;
display: block;
}
.modul-imagemap .image img {
width: auto;
}
.modul-infofigures {
overflow: visible;
}
.modul-infofigures .infofigure,
.modul-infofigures .modul-infofigure {
margin-bottom: 0;
}
.modul-infofigures ul {
list-style: none;
padding: 0;
}
.modul-infofigures ul > li {
margin-left: 0;
}
.modul-infofigures ul > li:before {
content: unset;
display: none;
}
.modul-infofigures ul > li::marker {
display: none;
content: unset;
}
@media print, (min-width: 37.501rem ) {
.modul-infofigures ul {
gap: 20px;
display: flex !important;
display: -ms-flexbox !important;
flex-wrap: wrap !important;
align-items: stretch;
width: auto !important;
}
.modul-infofigures ul > li {
width: calc(50% - 10px);
}
}
@media print, (min-width: 73.8135rem ) {
.modul-infofigures ul > li {
width: calc(25% - 15px);
}
}
.infofigure {
height: 100%;
width: 100%;
}
.infofigure .title {
color: #000000;
margin-top: 0;
}
.infofigure .title .textfigure {
color: #000000;
display: block;
font-size: 55px;
font-weight: bold;
text-align: center;
padding: 15px 0;
line-height: 1;
margin-left: -20px;
}
.infofigure .text {
color: #000000;
}
.modul-linklist .image {
float: none;
}
@media print, (min-width: 37.501rem ) {
.modul-linklist .image {
float: left;
margin-left: 0;
margin-right: 20px;
width: 40%;
margin-bottom: 0;
}
}
.modul-linklist .image ~ ul {
display: table;
}
@media print, (min-width: 37.501rem ) {
.modul-linklist:after {
content: " ";
display: table;
clear: both;
}
}
.marginal .modul-linklist .image,
.flexgrid:not(.grid--1) .modul-linklist .image,
.row > [class*=span] > .modul-linklist .image {
float: none !important;
margin-left: 0;
margin-right: 0;
max-width: none;
width: 100%;
margin-bottom: 0.5em;
}
.modul-linkup {
margin: 50px 0;
display: flex;
justify-content: flex-end;
border: 0 none;
padding: 0.3em 0;
border-bottom: 4px solid #000000;
}
.modul-linkup a.to-top {
font-size: 14px;
color: #165BE0;
line-height: 1.2;
padding-right: 22px;
position: relative;
}
.modul-linkup a.to-top:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 12px;
height: 12px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-arrow-right);
mask-image: var(--bicon-arrow-right);
color: #ffffff;
}
.modul-linkup a.to-top:after {
transform: rotate(-90deg);
margin: 2px;
}
.modul-linkup a.to-top:before {
content: "";
background: #000000;
width: 16px;
height: 16px;
border-radius: 50%;
}
.modul-linkup a.to-top:before, .modul-linkup a.to-top:after {
position: absolute;
right: 0;
top: 0;
display: inline-flex;
}
.modul-locationaccessibility .list--iconlist .icon {
width: 36px;
height: auto;
}
/* 1) Display a grid of partner logos below the content */
/* 2) Display a grid of partner logos above h1 (hero landingpage) */
.modul-logogalerie {
margin: 50px 0;
overflow: hidden;
}
.modul-logogalerie .logogalerie__logos:not(.hero) {
list-style: none;
padding: 0;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
overflow: hidden;
gap: 5%;
}
.modul-logogalerie .logogalerie__logos:not(.hero) > .logo {
width: 20%;
justify-content: center;
}
@media screen and (max-width: 37.5rem) {
.modul-logogalerie .logogalerie__logos:not(.hero) > .logo {
width: 40%;
}
}
.modul-logogalerie .logogalerie__logos.hero {
display: flex;
flex-wrap: wrap;
list-style: none;
align-items: center;
justify-content: flex-end;
margin: -20px -20px 0 0;
}
.modul-logogalerie .logogalerie__logos.hero > .logo {
/*&:before {
display: none; // Remove our own bullets
}*/
margin: 20px 20px 0 20px;
flex-grow: 0;
flex-shrink: 1;
}
.modul-logogalerie .logogalerie__logos.hero > .logo img {
max-height: 30px;
width: auto;
max-width: 300px;
}
@media print, (min-width: 37.501rem ) {
.modul-mehrspaltig .flexgrid > * > *:last-child {
margin-bottom: 0;
}
}
.modul-mosaic .list--mosaicgrid {
list-style: none;
padding: 0;
display: flex;
flex-wrap: wrap;
margin: 0;
padding: 0;
}
@media screen and (max-width: 37.5rem) {
.modul-mosaic .list--mosaicgrid {
margin-left: -12px;
margin-right: -12px;
width: auto !important;
max-width: 100vw !important;
}
}
.modul-mosaic .list--mosaicgrid > li {
margin-left: 0;
}
.modul-mosaic .list--mosaicgrid > li:before {
content: unset;
display: none;
}
.modul-mosaic .list--mosaicgrid > li::marker {
display: none;
content: unset;
}
.modul-mosaic .list--mosaicgrid * {
margin: 0;
}
.modul-mosaic .list--mosaicgrid > * {
padding: 0;
width: 50%;
}
@media print, (min-width: 37.501rem ) {
.modul-mosaic .list--mosaicgrid > * {
width: 33.333%;
}
}
.modul-mosaic .list--mosaicgrid .image,
.modul-mosaic .list--mosaicgrid .image__image {
height: 100%;
}
.modul-mosaic .list--mosaicgrid .image__overlay {
padding: 1.5em;
}
.mosaic--colortheme1 li:nth-child(2n+1) .image__image,
.mosaic--colortheme1 li:nth-child(2n+1) .image__copyright {
display: none;
}
.mosaic--colortheme1 li:nth-child(1) {
background-color: #0e428c;
}
.mosaic--colortheme1 li:nth-child(3) {
background-color: #9380cc;
}
.mosaic--colortheme1 li:nth-child(5) {
background-color: #67b18d;
}
@media screen and (max-width: 37.5rem) {
.mosaic--colortheme1 li:nth-child(3) .image__image,
.mosaic--colortheme1 li:nth-child(3) .image__copyright {
display: block;
}
.mosaic--colortheme1 li:nth-child(4) {
background-color: #9380cc;
}
.mosaic--colortheme1 li:nth-child(4) .image__image,
.mosaic--colortheme1 li:nth-child(4) .image__copyright {
display: none;
}
}
.modul-multiteaser {
margin-bottom: 0;
overflow: visible;
/*
ul.flexgrid {
> li {
margin-bottom: 0;
}
}
*/
}
.modul-newslist .list--newslist {
margin-bottom: 5px;
}
.modul-openings ul {
list-style: none;
padding: 0;
}
.modul-openings ul > li {
margin-left: 0;
}
.modul-openings ul > li:before {
content: unset;
display: none;
}
.modul-openings ul > li::marker {
display: none;
content: unset;
}
.modul-openings ul .title {
margin-top: 0;
margin-bottom: 2px;
word-break: keep-all;
}
.modul-openings ul ul {
margin-bottom: 0;
}
.modul-openings ul ul li {
margin-bottom: 3px;
}
@media print, (min-width: 37.501rem ) {
.modul-openings > ul {
display: table;
}
.modul-openings > ul > li {
display: table-row;
}
.modul-openings > ul > li .cell {
display: table-cell;
padding-bottom: 0.3em;
}
.modul-openings > ul > li .cell:first-child {
padding-right: 2em;
}
}
.marginal .modul-openings > ul > li {
display: block;
}
.marginal .modul-openings > ul > li .cell {
display: block;
padding-right: 0;
padding-bottom: 6px;
}
@media print, (min-width: 73.8135rem ) {
#layout-grid__area--maincontent .modul-panel-crossvertical {
position: relative;
left: 50%;
right: auto;
margin-left: -50vw;
margin-right: auto;
width: 100vw;
}
}
.modul-panel-crossvertical {
padding: 18px;
background-color: #000000;
z-index: 0;
width: 100%;
}
.modul-panel-crossvertical .middle {
width: 100%;
max-width: 980px;
}
.modul-panel-crossvertical .middle > * {
color: #ffffff;
}
.modul-panel-crossvertical .middle > .title {
text-align: center;
margin-top: 25px;
margin-bottom: 50px;
border: 0 none;
padding-left: 0;
}
@media print, (min-width: 73.8135rem ) {
.modul-panel-crossvertical {
display: flex;
}
.modul-panel-crossvertical > * {
flex-grow: 1;
}
.modul-panel-crossvertical.add-dots > * {
position: relative;
}
.modul-panel-crossvertical.add-dots > *::before {
background-image: radial-gradient(#ffffff 3px, transparent 4px);
background-size: 25px 25px;
position: absolute;
z-index: -1;
content: "";
width: 141px;
height: 141px;
}
.modul-panel-crossvertical.add-dots .left::before {
top: 45px;
right: -60px;
}
.modul-panel-crossvertical.add-dots .middle::before {
bottom: 7px;
left: 53%;
}
.modul-panel-crossvertical.add-dots .right::before {
top: 45px;
left: -70px;
}
}
.modul-publictransport ul {
list-style: none;
padding: 0;
border: 0 none;
}
.modul-publictransport ul > li {
margin-left: 0;
}
.modul-publictransport ul > li:before {
content: unset;
display: none;
}
.modul-publictransport ul > li::marker {
display: none;
content: unset;
}
.modul-publictransport ul li {
border: 0 none;
}
.modul-publictransport .lines {
display: flex;
flex-wrap: wrap;
margin-bottom: 0;
}
.modul-publictransport .line {
border: 1px solid #000000;
padding: 3px 6px 2px 6px;
background-color: #ffffff;
margin-right: 0.2em;
}
.modul-publictransport .distance {
float: right;
}
.modul-publictransport .stop {
padding: 0px 9px 9px 9px;
margin-bottom: 0;
}
.modul-publictransport .stop + .stop {
border-top: 1px solid #dddddd;
padding-top: 0.5em;
}
.modul-publictransport .stop:last-child {
padding-bottom: 0;
}
.modul-publictransport .stops {
background-color: #f5f5f5;
margin: 0;
border: 1px solid #f5f5f5;
border-width: 0 1px 1px 1px;
}
.modul-publictransport .type__name {
padding: 9px;
border: 1px solid #dddddd !important;
margin: -1px 0 0 0;
}
.modul-publictransport .type__name:before {
display: inline-block;
max-width: 20px;
max-height: 20px;
margin-right: 0.3em;
line-height: 0.7;
}
.modul-publictransport .type__name.bahn:before {
content: url(./5c0317a0cbf953c763cb.svg);
}
.modul-publictransport .type__name.ubahn:before {
content: url(./9caa17489e2b1454d3d8.svg);
}
.modul-publictransport .type__name.sbahn:before {
content: url(./114e388096f67f2fe7d1.svg);
}
.modul-publictransport .type__name.tram:before {
content: url(./569b8c82728f72653363.svg);
}
.modul-publictransport .type__name.bus:before {
content: url(./e1b7dc3265c260f4e655.svg);
}
.modul-publictransport .type__name.ferry:before {
content: url(./95f27c2a3d4f20e723f8.svg);
}
.modul-publictransport .title {
flex-grow: 1;
}
@media print, (min-width: 37.501rem ) {
.modul-rss_list:before, .modul-rss_list:after {
content: " ";
display: table;
clear: both;
}
.modul-rss_list .image {
float: right;
margin-right: 0;
margin-left: 20px;
}
.modul-rss_list .image {
width: 49%;
}
.modul-rss_list .image + .list--tablelist {
width: auto;
}
.modul-rss_list.float .list--tablelist {
width: auto;
}
}
.modul-rss_list .category {
margin-top: 0.25em;
display: block;
font-size: 14px;
}
.modul-rss_list.blockdate .date {
display: block;
margin-bottom: 0.1em;
}
.marginal .modul-rss_list .image,
.clearteaserfloat .modul-rss_list .image,
.flexgrid:not(.grid--1) .modul-rss_list .image {
float: none !important;
margin-left: 0;
margin-right: 0;
max-width: none;
width: 100%;
margin-bottom: 0.5em;
}
.modul-servicepanel {
padding: 18px;
background-color: #f5f5f5;
border: 1px solid;
border-color: #f5f5f5;
display: block;
}
.modul-servicepanel > *:last-child {
margin-bottom: 0;
}
@media print, (min-width: 73.8135rem ) {
.modul-servicepanel {
display: flex;
align-items: center;
justify-content: space-between;
}
.modul-servicepanel > * > *:last-child:not([class^=modul-]) {
margin-bottom: 0;
}
.modul-servicepanel .inner {
display: flex;
align-items: center;
justify-content: space-between;
gap: 50px;
}
.modul-servicepanel [class*=inner__] > *:last-child {
margin-bottom: 0;
}
.modul-servicepanel .inner__right .button {
width: auto;
min-width: 150px;
}
.modul-servicepanel.fullwidth .servicepanel__left {
align-self: center;
justify-self: flex-end;
margin-right: 0;
}
}
.modul-servicepanel .servicepanel__left {
margin-right: 20px;
}
.modul-servicepanel .servicepanel__left i {
color: #000000;
}
.modul-servicepanel .servicepanel__main {
flex-grow: 1;
margin-right: 20px;
}
.modul-servicepanel .servicepanel__main .title {
margin-top: 0;
}
.modul-servicepanel .servicepanel__right {
display: flex;
gap: 15px;
}
.modul-servicepanel .servicepanel__right .button {
min-width: 150px;
}
.modul-servicepanel .servicepanel__right .fa,
.modul-servicepanel .servicepanel__right .far,
.modul-servicepanel .servicepanel__right .fas,
.modul-servicepanel .servicepanel__right .bicon {
color: #000000;
}
.modul-servicepanel .inner__left {
width: 100%;
}
@media screen and (max-width: 37.5rem) {
.modul-servicepanel .servicepanel__left {
margin: 0 0 10px 0;
}
.modul-servicepanel .servicepanel__main {
margin: 0 0 20px 0;
}
.modul-servicepanel .servicepanel__right {
flex-direction: column;
}
.modul-servicepanel .servicepanel__right .button {
width: 100%;
}
.modul-servicepanel .inner__right .button {
width: 100%;
}
}
.modul-servicepanel.fullwidth {
grid-auto-flow: row;
grid-auto-rows: auto;
grid-auto-columns: auto;
position: relative;
display: -ms-grid;
display: grid;
max-width: 100vw !important;
}
@media print, (min-width: 73.8135rem ) {
.modul-servicepanel.fullwidth {
-ms-grid-columns: minmax(0, auto) minmax(0, auto) 40px minmax(50vw, 980px) 40px minmax(0, auto) minmax(0, auto);
grid-template-columns: [first fullWidth-start] minmax(0, auto) [leftcolumn-start] minmax(0, auto) [leftcolumn-end leftgap-start] 40px [leftgap-end mainbar-start] minmax(50vw, 980px) [mainbar-end rightgap-start] 40px [rightgap-end marginal-start] minmax(0, auto) [marginal-end] minmax(0, auto) [last fullWidth-end];
grid-gap: 0;
justify-content: stretch;
}
}
@media print, (max-width: 73.8125rem) {
.modul-servicepanel.fullwidth {
display: block;
}
}
@media print, (min-width: 92.501rem ) {
.modul-servicepanel.fullwidth {
-ms-grid-columns: minmax(0, 1fr) minmax(0, 250px) 40px 980px 40px minmax(0, 250px) minmax(0, 1fr);
grid-template-columns: [first fullWidth-start] minmax(0, 1fr) [leftcolumn-start] minmax(0, 250px) [leftcolumn-end leftgap-start] 40px [leftgap-end mainbar-start] 980px [mainbar-end rightgap-start] 40px [rightgap-end marginal-start] minmax(0, 250px) [marginal-end] minmax(0, 1fr) [last fullWidth-end];
grid-gap: 0;
justify-content: center;
}
}
.modul-servicepanel.fullwidth .servicepanel__left {
-ms-grid-row: 1;
-ms-grid-column: 2;
-ms-grid-column-span: 1;
grid-row: row1;
grid-column: leftcolumn;
}
.modul-servicepanel.fullwidth .servicepanel__main {
-ms-grid-row: 1;
-ms-grid-column: 4;
-ms-grid-column-span: 1;
grid-row: row1;
grid-column: mainbar;
}
.modul-servicepanel.fullwidth .servicepanel__right {
-ms-grid-row: 1;
-ms-grid-column: 6;
-ms-grid-column-span: 7;
grid-row: row1;
grid-column: marginal;
}
@media print, (max-width: 73.8125rem) {
.modul-servicepanel.fullwidth {
margin-left: -12px;
margin-right: -12px;
}
}
.marginal .modul-stickybutton .button {
width: 100%;
}
.modul-stickybutton {
margin-bottom: 25px;
}
@media screen and (max-width: 73.8125rem) and (min-height: 30em) {
.modul-stickybutton {
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 1;
background-color: #ffffff;
color: #000000;
padding: 12px;
margin: 0 !important;
border-top: 1px solid #dddddd;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
display: flex;
justify-content: flex-end;
align-items: center;
gap: 0;
/*
&.disabled {
background-color: $stickybutton-overlay-disabled-bgcolor;
color: $stickybutton-overlay-disabled-textcolor;
}
*/
}
.modul-stickybutton p a:not(.button) {
color: #000000;
text-decoration: underline;
}
}
@media screen and (max-width: 73.8125rem) and (min-height: 30em) and (max-width: 37.5rem) {
.modul-stickybutton {
display: flex;
flex-wrap: wrap;
}
}
@media screen and (max-width: 73.8125rem) and (min-height: 30em) {
.modul-stickybutton .button {
width: 100%;
margin: 0.5em 0.5em 0.5em 20px;
}
.modul-stickybutton:before {
content: "";
flex-grow: 1;
}
.modul-stickybutton .text {
flex-grow: 0;
}
.modul-stickybutton .text + .button {
width: auto;
white-space: nowrap;
}
.modul-stickybutton .text > *:last-child {
margin-bottom: 0;
}
}
@media screen and (min-height: 30em) {
.modul-stickybutton.permanent-sticky {
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 1;
background-color: #ffffff;
color: #000000;
padding: 12px;
margin: 0 !important;
border-top: 1px solid #dddddd;
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
display: flex;
justify-content: flex-end;
align-items: center;
gap: 0;
/*
&.disabled {
background-color: $stickybutton-overlay-disabled-bgcolor;
color: $stickybutton-overlay-disabled-textcolor;
}
*/
}
.modul-stickybutton.permanent-sticky p a:not(.button) {
color: #000000;
text-decoration: underline;
}
}
@media screen and (min-height: 30em) and (max-width: 37.5rem) {
.modul-stickybutton.permanent-sticky {
display: flex;
flex-wrap: wrap;
}
}
@media screen and (min-height: 30em) {
.modul-stickybutton.permanent-sticky .button {
width: 100%;
margin: 0.5em 0.5em 0.5em 20px;
}
.modul-stickybutton.permanent-sticky:before {
content: "";
flex-grow: 1;
}
.modul-stickybutton.permanent-sticky .text {
flex-grow: 0;
}
.modul-stickybutton.permanent-sticky .text + .button {
width: auto;
white-space: nowrap;
}
.modul-stickybutton.permanent-sticky .text > *:last-child {
margin-bottom: 0;
}
}
@media print, (min-width: 73.8135rem ) {
.modul-stickybutton.permanent-sticky .button {
width: auto;
}
}
/* sticky button is inverted in some verticals, so we have to use negative buttons */
/*
(see https://www.barrierefreies-webdesign.de/knowhow/tablist/tabpanel-links-tabindex.html)
Our Base tabs has no fancy layout, only basic styling
*/
/*
* Basic tabs rules
*/
.js-tabs [role=tablist] {
display: block;
width: 100%;
list-style: none;
padding: 0;
}
.js-tabs .tab {
cursor: pointer;
float: left;
}
.js-tabs .tab[aria-selected=true]:hover {
text-decoration: none;
}
.js-tabs .tab[aria-selected=true] {
cursor: default;
}
.js-tabs .tabpanel[aria-hidden=true] {
display: none;
}
.js-tabs .tabpanel {
clear: left;
}
/*
Tabs Module layout
*/
.modul-tabs .tablist {
display: flex;
list-style: none;
padding: 0;
margin: 0 0 30px 0px;
box-shadow: 0px -1px 0px #dddddd inset;
}
.modul-tabs .tab {
margin-bottom: 0;
margin-right: 20px;
padding: 4px;
display: inline-block;
color: #454545;
}
.modul-tabs .tab:last-child {
margin-right: 0;
}
.modul-tabs .tab[aria-selected=true] {
border-bottom: 4px solid #000000;
font-weight: bold;
color: #000000;
text-decoration: none;
}
.modul-teaser_buehne {
position: relative;
overflow: visible;
background-color: #ffffff;
}
.modul-teaser_buehne .image .image__image {
margin-bottom: 0;
aspect-ratio: 2/1;
background-color: transparent;
}
.modul-teaser_buehne .image .image__copyright,
.modul-teaser_buehne .image .image__caption {
display: none;
}
@media print, (min-width: 57.501rem ) {
.modul-teaser_buehne {
display: flex;
}
.modul-teaser_buehne .image {
margin: 0;
}
.modul-teaser_buehne .teaser_buehne__left {
width: 66.666%;
flex-shrink: 0;
}
.modul-teaser_buehne .teaser_buehne__right {
position: relative;
flex-grow: 1;
}
.modul-teaser_buehne .teaser_buehne__left + .teaser_buehne__right {
padding-left: 20px;
}
}
.modul-teaser_buehne > *:last-child() {
margin-bottom: 0;
}
.modul-teaser_buehne .title {
color: #000000;
}
.modul-teaser_buehne .title a {
color: #000000;
}
.modul-teaser_buehne .text {
display: inline;
}
.modul-teaser_buehne .action {
display: inline;
}
.modul-teaser_buehne .image__copyright {
margin-top: 1em;
}
.buhne__list--teaser .modul-teaser_buehne {
background-color: #f5f5f5;
}
.buhne__list--teaser .modul-teaser_buehne * {
color: #000000;
}
.buhne__list--teaser .modul-teaser_buehne .teaser_buehne__right {
padding: 18px;
}
.buhne__list--teaser .modul-teaser_buehne .teaser_buehne__right {
position: relative;
padding: 18px;
}
.buhne__list--teaser .modul-teaser_buehne .teaser_buehne__right .inner {
padding-bottom: 50px;
}
.buhne__list--teaser .modul-teaser_buehne .teaser_buehne__right .action {
position: absolute;
inset: auto 0 0 0;
background-image: linear-gradient(135deg, rgba(160, 160, 160, 0.5) 5.88%, transparent 5.88%, transparent 50%, rgba(160, 160, 160, 0.5) 50%, rgba(160, 160, 160, 0.5) 55.88%, transparent 55.88%, transparent 100%);
background-size: 17px 17px;
display: block;
padding: 0.5em 18px;
}
.buhne__list--teaser .modul-teaser_buehne .teaser_buehne__right .action a.more {
min-height: 43px;
width: auto;
border-radius: 0px;
/* margin: $buttonMargin; // not here */
text-decoration: none;
padding: 10px 16px;
font-size: 1em;
line-height: 1.2;
display: inline-block;
text-align: center;
justify-content: center;
cursor: pointer;
overflow: visible;
background-color: #ffffff;
color: #000000;
border: 2px solid #000000;
transition: background-color 0.2s ease-out;
position: relative;
padding-right: 59px;
text-decoration: none !important;
}
.buhne__list--teaser .modul-teaser_buehne .teaser_buehne__right .action a.more:not(:disabled):hover {
text-decoration: none;
background-color: rgb(242.25, 242.25, 242.25);
}
.buhne__list--teaser .modul-teaser_buehne .teaser_buehne__right .action a.more:not(:disabled):focus {
text-decoration: none;
background-color: rgb(242.25, 242.25, 242.25);
}
.buhne__list--teaser .modul-teaser_buehne .teaser_buehne__right .action a.more:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 18px;
height: 18px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-arrow-right);
mask-image: var(--bicon-arrow-right);
color: #ffffff;
}
.buhne__list--teaser .modul-teaser_buehne .teaser_buehne__right .action a.more:after {
pointer-events: none;
margin: 10.5px;
}
.buhne__list--teaser .modul-teaser_buehne .teaser_buehne__right .action a.more:before {
content: "";
background: #000000;
border-left: 2px solid #000000;
width: 39px;
height: 100%;
}
.buhne__list--teaser .modul-teaser_buehne .teaser_buehne__right .action a.more:before, .buhne__list--teaser .modul-teaser_buehne .teaser_buehne__right .action a.more:after {
position: absolute;
right: 0;
top: 0;
display: inline-flex;
line-height: 2em;
justify-content: center;
align-items: center;
}
.modul-teaser-marketing {
position: relative;
}
.modul-teaser-marketing .title {
margin-top: 0;
}
.modul-teaser-marketing .button {
margin-bottom: 0;
}
@media screen and (max-width: 37.5rem) {
.modul-teaser-marketing .button {
width: 100%;
}
}
.modul-teaser-marketing.bordered {
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
padding: 1em 0;
}
.modul-teaser-marketing.bordered .title {
font-size: 1em;
}
.modul-teaser-marketing.bordered .image,
.modul-teaser-marketing.bordered .background-image {
display: none;
}
.modul-teaser-marketing.bordered + .bordered {
margin-top: -51px;
}
@media print, (min-width: 37.501rem ) {
.modul-teaser-marketing.bordered {
padding: 0.7em 0;
}
.modul-teaser-marketing.bordered .content-container {
display: flex;
justify-content: space-between;
align-items: center;
}
.modul-teaser-marketing.bordered .content-container .title {
margin-bottom: 0;
}
.modul-teaser-marketing.bordered .content-container .text {
flex-grow: 1;
}
.modul-teaser-marketing.bordered .content-container .controls {
flex-grow: 0;
flex-shrink: 1;
}
}
.modul-teaser-marketing.boxed {
background-color: #f5f5f5;
padding: 20px 24px 20px 24px;
margin-left: -12px;
margin-right: -12px;
border: 0px solid transparent;
position: relative;
z-index: 0;
overflow: hidden;
}
@media print, (max-width: 73.8125rem) {
.modul-teaser-marketing.boxed {
padding: 20px 12px 20px 12px;
}
}
.modul-teaser-marketing.boxed .image {
display: none;
}
.modul-teaser-marketing.boxed .content-container {
position: relative;
z-index: 1;
text-align: center;
}
.modul-teaser-marketing.boxed .background-image::before {
background: #FFFFFF;
opacity: 0.5;
}
.modul-teaser-marketing.imageteaser {
background-color: #000000;
position: relative;
z-index: 0;
overflow: visible !important;
padding: 2em;
}
@media print, (max-width: 73.8125rem) {
.modul-teaser-marketing.imageteaser {
margin-left: -12px;
margin-right: -12px;
padding-left: 12px;
padding-right: 12px;
}
.modul-teaser-marketing.imageteaser .image {
margin-bottom: 0.5em;
}
}
.modul-teaser-marketing.imageteaser * {
color: #ffffff;
}
.modul-teaser-marketing.imageteaser .content-container {
z-index: 2;
position: relative;
}
.modul-teaser-marketing.imageteaser .content-container:before, .modul-teaser-marketing.imageteaser .content-container:after {
content: " ";
display: table;
clear: both;
}
.modul-teaser-marketing.imageteaser .button {
background-color: transparent !important;
border: 1px solid #ffffff !important;
color: #ffffff !important;
}
.modul-teaser-marketing.imageteaser .button:hover, .modul-teaser-marketing.imageteaser .button:focus {
background-color: transparent !important;
}
.modul-teaser-marketing.imageteaser .button:before {
background: transparent !important;
border-width: 1px;
border-color: #ffffff !important;
}
.modul-teaser-marketing.imageteaser .button:after {
background: #ffffff !important;
}
.modul-teaser-marketing.imageteaser .controls {
margin: 20px;
margin-top: 0;
z-index: 2;
position: relative;
}
.modul-teaser-marketing.imageteaser .image__copyright {
z-index: 2;
position: absolute;
bottom: auto;
padding-top: 2px;
}
.modul-teaser-marketing.imageteaser .image {
z-index: 2;
position: relative;
width: 49%;
float: left;
margin-right: 20px;
margin-bottom: 0;
}
.modul-teaser-marketing.imageteaser .image .image__image {
aspect-ratio: 4/3;
background-color: transparent;
margin-bottom: 0px;
}
@media screen and (max-width: 37.5rem) {
.modul-teaser-marketing.imageteaser .image {
width: 100%;
float: none;
margin: -56px 0 20px 0 !important;
}
}
.modul-teaser-marketing.imageteaser .background-image::before {
background: #000000;
opacity: 0.5;
}
.modul-teaser-marketing .background-image {
display: block;
position: absolute;
inset: 0;
z-index: 0;
}
.modul-teaser-marketing .background-image::before {
content: "";
position: absolute;
inset: 0;
z-index: 1;
}
.modul-teaser-marketing .background-image .image__image {
aspect-ratio: unset;
display: flex;
margin: 0;
position: absolute;
inset: 0;
overflow: hidden;
}
.modul-teaser-marketing .background-image .image__image img {
object-fit: cover;
}
@media screen and (max-width: 37.5rem) {
.modul-teaser-marketing .background-image .image__image img {
width: auto;
min-width: auto;
height: 100%;
}
}
@media print, (max-width: 73.8125rem) {
.modul-teaser-marketing .image__image {
margin: 0 !important;
}
}
.modul-teaser-poster {
position: relative;
max-width: none;
width: 100%;
max-width: none;
overflow: visible;
}
.modul-teaser-poster ul {
list-style: none;
padding: 0;
}
.modul-teaser-poster ul > li {
margin-left: 0;
}
.modul-teaser-poster ul > li:before {
content: unset;
display: none;
}
.modul-teaser-poster ul > li::marker {
display: none;
content: unset;
}
.modul-teaser-poster .title {
font-size: 1.0625em;
margin-top: 1em;
margin-bottom: 0.4em;
line-height: 1.353em;
color: #000000;
font-weight: 700;
color: #ffffff;
font-size: 1.375em;
margin: 0;
margin-bottom: 10px;
word-break: break-word;
}
.modul-teaser-poster .title a {
color: #165BE0;
}
@media print {
.modul-teaser-poster .title {
page-break-before: auto;
page-break-after: avoid !important;
}
}
.modul-teaser-poster a.more {
display: block;
}
.modul-teaser-poster a.more:after {
color: #ffffff;
}
.modul-teaser-poster .more-link {
border-top: 1px solid rgba(255, 255, 255, 0.3);
width: 100%;
padding-top: 21px;
}
.modul-teaser-poster .more-link a,
.modul-teaser-poster .more-link span {
text-decoration: none;
}
.modul-teaser-poster .more-link a:hover, .modul-teaser-poster .more-link a:focus,
.modul-teaser-poster .more-link span:hover,
.modul-teaser-poster .more-link span:focus {
text-decoration: underline;
}
.modul-teaser-poster .more-link i {
margin-left: 0.2em;
}
.modul-teaser-poster .image {
position: relative;
height: 100%;
}
.modul-teaser-poster .image .image__copyright {
position: absolute;
bottom: -1.5em;
}
.modul-teaser-poster .image .image__caption {
display: none;
/*position: absolute;
bottom: -3em;*/
}
.modul-teaser-poster .image .image__image {
position: relative;
height: 100%;
z-index: 0;
aspect-ratio: 4/5;
background-color: transparent;
}
.modul-teaser-poster .image .image__image:before {
display: block;
content: " ";
position: absolute;
z-index: 1;
inset: 0;
background-color: transparent;
background-image: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.1) 25%, rgba(0, 0, 0, 0.95));
}
.modul-teaser-poster .image .image__overlay {
position: absolute;
bottom: 0;
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-end;
z-index: 1;
padding: 1.5em 1.5em;
text-align: center;
}
.modul-teaser-poster .image .image__overlay > * {
width: 100%;
}
.modul-teaser {
position: relative;
overflow: visible;
}
.modul-teaser .title {
color: #000000;
}
.modul-teaser .title a {
color: #000000;
}
.modul-teaser .date {
font-weight: normal;
font-size: 16px;
margin-bottom: 0.2em;
}
.modul-teaser .image__image {
aspect-ratio: 4/3;
background-color: transparent;
}
.modul-teaser .image {
float: none;
}
@media print, (min-width: 37.501rem ) {
.modul-teaser .image {
float: left;
margin-left: 0;
margin-right: 20px;
width: 40%;
margin-bottom: 0;
}
}
.modul-teaser .inner {
display: block;
}
.modul-teaser .inner > *:last-child {
margin-bottom: 0;
}
@media print, (min-width: 37.501rem ) {
.modul-teaser:after {
content: " ";
display: table;
clear: both;
}
}
@media screen and (max-width: 37.5rem) {
.modul-teaser dl.list--horizontal {
display: block;
}
}
.modul-teaser .image__image {
position: relative;
}
.modul-teaser .image__image:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 18px;
height: 18px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-arrow-right);
mask-image: var(--bicon-arrow-right);
color: #ffffff;
}
.modul-teaser .image__image:after {
pointer-events: none;
margin: 9px;
}
.modul-teaser .image__image:before {
content: "";
background: #000000;
width: 36px;
height: 36px;
}
.modul-teaser .image__image:before, .modul-teaser .image__image:after {
position: absolute;
right: 0;
top: 0;
display: inline-flex;
}
.modul-teaser ul {
overflow: hidden;
}
/*
.teaser-actions {
// optional buttons or other teaser actions (EMS)
// -> see form-actions
}
*/
.teaser--special {
border: 1px solid #dddddd;
border-width: 1px 0 1px 0;
margin: 25px 0;
padding: 25px 0;
}
.teaser--special + .teaser--special {
border-top: 0 none;
margin-top: 0;
padding-top: 0;
}
.teaser__meta {
margin: 0em 0 0.5em 0;
display: block;
}
.teaser__meta > *:last-child {
margin-bottom: 0;
}
@media print, (min-width: 37.501rem ) {
.portal-image-fifty .modul-teaser .image {
width: 49%;
}
}
ul.list--ruler > li > .modul-teaser {
margin-bottom: 25px;
margin-top: 25px;
}
.marginal .modul-teaser .image,
.clearteaserfloat .modul-teaser .image,
.modul-carousel .modul-teaser .image,
.modul-teaser.clearteaserfloat .image,
.flexgrid:not(.grid--1) .modul-teaser .image,
.row > [class*=span] > .modul-teaser .image {
float: none !important;
margin-left: 0;
margin-right: 0;
max-width: none;
width: 100%;
margin-bottom: 0.5em;
}
.marginal .modul-teaser:after,
.clearteaserfloat .modul-teaser:after,
.modul-carousel .modul-teaser:after,
.modul-teaser.clearteaserfloat:after,
.flexgrid:not(.grid--1) .modul-teaser:after,
.row > [class*=span] > .modul-teaser:after {
clear: none;
}
/* used in:
- herounit hompage identity
- buehne v2 (kachel-opener)
*/
.modul-teasertile_buehne {
padding: 18px;
background-color: #f5f5f5;
border: 0 none;
margin-bottom: 0;
}
.modul-teasertile_buehne:before, .modul-teasertile_buehne:after {
content: " ";
display: table;
clear: both;
}
.modul-teasertile_buehne > *:last-child {
margin-bottom: 0;
}
/*
* Single teasertile config:
*/
/*
* Wrapper (modul-teasertiles) config:
*/
.modul-teasertiles {
overflow: visible;
}
.modul-teasertiles .teasertile,
.modul-teasertiles .modul-teasertile {
margin-bottom: 0;
}
.modul-teasertiles ul {
list-style: none;
padding: 0;
}
.modul-teasertiles ul > li {
margin-left: 0;
}
.modul-teasertiles ul > li:before {
content: unset;
display: none;
}
.modul-teasertiles ul > li::marker {
display: none;
content: unset;
}
@media print, (min-width: 37.501rem ) {
.modul-teasertiles ul {
gap: 20px;
display: flex !important;
display: -ms-flexbox !important;
flex-wrap: wrap !important;
align-items: stretch;
width: auto !important;
}
.modul-teasertiles ul > li {
width: calc(50% - 10px);
}
}
@media print, (min-width: 73.8135rem ) {
.modul-teasertiles ul > li {
width: calc(25% - 15px);
}
.modul-teasertiles ul.grid--3 > li {
width: calc(33.3333333333% - 13.3333333333px);
}
}
.teasertile,
.modul-teasertile {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
position: relative;
border-width: 0;
background-color: #f5f5f5;
padding: 18px;
padding-bottom: 40px;
min-height: 87px;
height: 100%;
width: 100%;
}
@media print, (min-width: 73.8135rem ) {
.teasertile,
.modul-teasertile {
min-height: 130px;
}
}
.teasertile .decoration,
.modul-teasertile .decoration {
margin-right: 0;
margin-top: -0.1em;
margin-left: -2px;
font-size: 66px;
line-height: 1;
font-weight: bold;
color: #cccccc;
max-width: 30%;
width: 55px;
overflow: hidden;
flex-shrink: 0;
}
.teasertile .inner,
.modul-teasertile .inner {
width: 100%;
max-width: 70%;
}
.teasertile .text,
.modul-teasertile .text {
margin-bottom: 0;
}
.teasertile .text > *:last-child,
.modul-teasertile .text > *:last-child {
margin-bottom: 0;
}
.teasertile .title,
.modul-teasertile .title {
margin-top: 0;
word-break: break-word;
font-size: 16px;
font-weight: bold;
position: relative;
margin-bottom: 0.4em;
}
.teasertile .action,
.modul-teasertile .action {
position: absolute;
right: 0;
bottom: 0;
background: #ffffff;
width: auto;
}
.teasertile .action .more,
.modul-teasertile .action .more {
padding: 0.5em 0.4em 0.4em 0.7em;
color: #165BE0;
}
.teasertile .action .more:after,
.modul-teasertile .action .more:after {
color: inherit;
}
.modul-testimonial {
overflow: visible;
border: 0 none;
background-color: transparent;
padding: 0;
}
@media screen and (max-width: 37.5rem) {
.modul-testimonial .image {
margin-left: -12px;
margin-right: -12px;
width: auto !important;
max-width: 100vw !important;
}
}
.modul-testimonial .textbox,
.modul-testimonial p {
color: #000000;
text-shadow: none;
}
.modul-testimonial .textbox {
margin-top: 50px;
margin-bottom: 50px;
text-align: center;
background-color: #ffffff;
width: 100%;
border: 0px solid transparent;
padding: 1em;
}
.modul-testimonial .textbox .quote {
font-size: 2em;
margin-bottom: 0.5em;
color: #000000;
}
.modul-testimonial .textbox .text {
padding-top: 0.5em;
padding-bottom: 0.5em;
font-size: 1em;
font-weight: bold;
font-style: italic;
border: 0px solid transparent;
border-width: 0 0 0 0;
}
@media print, (min-width: 37.501rem ) {
.modul-testimonial .textbox .text {
font-size: 18px;
}
}
@media print, (min-width: 73.8135rem ) {
.modul-testimonial .textbox .text {
font-size: 22px;
}
}
@media print, (min-width: 92.501rem ) {
.modul-testimonial .textbox {
padding: 2em 2em;
}
.modul-testimonial .textbox .text {
font-size: 24px;
}
}
.modul-testimonial .textbox .caption {
font-size: 0.875em;
font-weight: bold;
margin-top: 1em;
display: flex;
flex-direction: column;
align-items: center;
}
.modul-testimonial .textbox .text + .caption:before {
content: "";
width: 147px;
height: 1px;
display: block;
background: #000000;
margin-bottom: 1.5em;
}
.modul-testimonial .image__image {
aspect-ratio: 4/3;
background-color: transparent;
}
.modul-testimonial .image__copyright {
position: absolute;
top: auto;
bottom: auto;
margin-left: 0;
}
.modul-testimonial .image .image__overlay {
position: static;
padding: 0;
margin-top: 1em;
}
@media print, (max-width: 73.8125rem) {
.modul-testimonial .image .image__copyright {
margin-left: 5px;
}
}
@media print, (min-width: 37.501rem ) {
.modul-testimonial .image {
position: relative;
width: 100%;
}
.modul-testimonial .image .image__overlay {
position: absolute;
width: 49%;
right: 0;
left: auto;
bottom: 0;
top: auto;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-top: 0;
}
.modul-testimonial .image .image__overlay > * {
width: 100%;
}
.modul-testimonial .image .image__image {
width: 75%;
}
.modul-testimonial .image .image__image img {
display: block;
}
.modul-testimonial .image .textbox {
margin-bottom: 0;
}
}
.modul-testimonial .image .textbox {
margin-top: 0;
}
.modul-text_bild {
overflow: visible;
}
.modul-text_bild:before, .modul-text_bild:after {
content: " ";
display: table;
clear: both;
}
.modul-text_bild .textile > *:last-child {
margin-bottom: 0;
}
.modul-text_bild .date {
font-weight: 400;
font-size: 16px;
margin-bottom: 0.2em;
}
.modul-text_bild ul,
.modul-text_bild ol {
overflow: auto;
}
@media print, (min-width: 37.501rem ) {
.modul-text_bild .title {
margin-top: 0;
}
.modul-text_bild .image {
width: 40%;
}
.modul-text_bild.imagealignleft .image {
float: left;
margin-left: 0;
margin-right: 20px;
}
.modul-text_bild.imagealignleft .text {
display: block;
}
.modul-text_bild.imagealignleft .text ul,
.modul-text_bild.imagealignleft .text ol {
display: table;
}
.modul-text_bild.imagealignleft .textile table ul {
display: inline-block;
}
.modul-text_bild.imagealignright .image {
float: right;
margin-left: 20px;
margin-right: 0;
}
.modul-text_bild.fifty .image {
width: 49%;
}
.modul-text_bild.nowrap .text {
display: table;
}
}
@media screen and (max-width: 37.5rem) {
.modul-text_bild.imagealignright {
display: flex;
flex-direction: column;
}
.modul-text_bild.imagealignright > .title {
order: 1;
}
.modul-text_bild.imagealignright > .text {
order: 2;
}
.modul-text_bild.imagealignright > .image {
order: 3;
margin-top: 1em;
}
}
.modul-text_bild.textbildbreit {
display: flex;
flex-direction: column;
overflow: visible !important;
}
.modul-text_bild.textbildbreit .title {
order: -1;
}
.modul-text_bild.textbildbreit .image {
width: 100%;
flex-basis: 100%;
margin-left: 0;
margin-right: 0;
height: 100%;
float: none;
}
.modul-text_bild.textbildbreit .image img {
width: auto;
}
.modul-text_bild.highlight {
width: 100%;
display: table;
position: relative;
border: 1px solid #000000;
padding: 21.3333333333px 32px 32px 32px;
background: transparent;
text-align: left;
}
@media print, (min-width: 37.501rem ) {
[class*=locale][class*=-plain] .modul-text_bild {
display: block;
}
[class*=locale][class*=-plain] .modul-text_bild .title {
max-width: 620px;
display: table;
}
[class*=locale][class*=-plain] .modul-text_bild .text {
max-width: 690px;
display: table;
}
}
@media print, (min-width: 37.501rem ) {
.portal-image-fifty .modul-text_bild.imagealignleft .image, .portal-image-fifty .modul-text_bild.imagealignright .image {
width: 49%;
}
}
.marginal .modul-text_bild .image,
.clearteaserfloat .modul-text_bild .image,
.flexgrid:not(.grid--1) .modul-text_bild .image {
float: none !important;
margin-left: 0;
margin-right: 0;
max-width: none;
width: 100%;
margin-bottom: 0.5em;
}
.marginal .modul-text_bild {
display: flex;
flex-direction: column;
}
.marginal .modul-text_bild .title {
order: -1;
}
.modul-text_wichtig {
border: 1px solid #f9f4e4;
padding: 18px;
background-color: #f9f4e4;
}
.modul-text_wichtig .title {
margin-top: 0;
}
.modul-text_wichtig .textile > *:last-child {
margin-bottom: 0;
}
.modul-topbox_contact:before, .modul-topbox_contact:after {
content: " ";
display: table;
clear: both;
}
.modul-topbox_contact .title .subtitle {
font-size: 0.9em;
display: block;
}
.modul-topbox_contact .image {
float: none;
}
@media print, (min-width: 37.501rem ) {
.modul-topbox_contact .image {
float: left;
margin-left: 0;
margin-right: 20px;
width: 40%;
}
}
.modul-topbox_contact ul {
display: table;
}
/* Nur im Karriereportal! */
.modul-topbox_jobs {
margin-top: 50px;
}
.modul-topbox_jobs .box-wrapper {
list-style: none;
padding: 0;
display: block;
}
.modul-topbox_jobs .box-wrapper > li {
margin-left: 0;
}
.modul-topbox_jobs .box-wrapper > li:before {
content: unset;
display: none;
}
.modul-topbox_jobs .box-wrapper > li::marker {
display: none;
content: unset;
}
.modul-topbox_jobs .box-wrapper .box {
margin: 0 0 50px 0;
}
.modul-topbox_jobs .box-wrapper .box * {
text-align: center;
display: block;
}
.modul-topbox_jobs .box-wrapper .box .icon {
font-size: 5em;
}
.modul-topbox_jobs .box-wrapper .box .title {
font-size: 1em;
text-align: center;
margin: 0.5em 0 1.75em 0;
}
.modul-topbox_jobs .box-wrapper .box .title .strong {
display: block;
font-size: 2.2em;
font-weight: bold;
line-height: 1.2;
}
.modul-topbox_jobs .box-wrapper .box .title .normal {
display: block;
font-size: 1.563em;
font-weight: normal;
line-height: 1.2;
}
.modul-topbox_jobs .box-wrapper .box .button {
min-width: 12em;
}
@media print, (min-width: 37.501rem ) {
.modul-topbox_jobs .box-wrapper {
display: flex;
justify-content: space-between;
}
.modul-topbox_jobs .box-wrapper .box {
margin-right: 20px;
}
.modul-topbox_jobs .box-wrapper .box:last-child {
margin-right: 0;
}
}
.modul-video {
margin-left: auto;
margin-right: auto;
width: auto;
overflow: visible;
max-width: 100%;
}
.modul-video .video-container {
z-index: 0;
position: relative;
/*
.html5video-video-vimeo .mejs__container .mejs__controls,
.mejs__container .mejs__overlay-play {
// remove doubled controlpanel
//display: none;
}
*/
}
@media print, (max-width: 73.8125rem) {
.modul-video .video-container {
height: auto !important;
width: 100% !important;
}
.modul-video .video-container .item_video iframe,
.modul-video .video-container .item_html5video .mejs__video,
.modul-video .video-container .item_html5video .mejs__layer,
.modul-video .video-container .item_html5video video,
.modul-video .video-container .movingimage [mi24-video-player],
.modul-video .video-container .accept_video {
height: auto !important;
width: 100% !important;
min-height: 100% !important;
}
.modul-video .video-container .item_video iframe,
.modul-video .video-container .item_html5video .mejs__video,
.modul-video .video-container .item_html5video video {
aspect-ratio: 16/9;
}
}
.modul-video .video-container .caption {
word-break: break-word;
}
.modul-video .video-container .player-formats {
font-size: 14px;
color: #454545;
}
.modul-video .video-container .mejs__audio {
max-height: 48px;
aspect-ratio: unset !important;
}
@media print, (max-width: 73.8125rem) {
.modul-video .video-container .mejs__audio {
max-width: 100%;
width: 100% !important;
}
}
.modul-video .video-container .mejs__container.mejs__video:not(.mejs__container-fullscreen) {
margin-bottom: 40px;
position: relative;
}
.modul-video .video-container .mejs__container.mejs__video:not(.mejs__container-fullscreen) .mejs__controls {
background-color: #000000;
position: absolute;
height: 40px;
bottom: -39px;
}
/* (see searchresult page) */
.teaser-boxedbutton {
margin: 0 0 50px 0;
position: relative;
background-color: #ffffff;
position: relative;
z-index: 0;
padding: 20px 0;
}
@media print, (min-width: 37.501rem ) {
.teaser-boxedbutton {
padding: 1em 0;
}
.teaser-boxedbutton .content-container {
display: flex;
justify-content: space-between;
align-items: center;
}
.teaser-boxedbutton .content-container .title {
margin-bottom: 0;
flex-grow: 1;
}
.teaser-boxedbutton .content-container .controls {
flex-grow: 0;
flex-shrink: 1;
}
}
.teaser-boxedbutton .content-container {
position: relative;
z-index: 1;
}
.teaser-boxedbutton .content-container .title {
margin-top: 0;
}
.teaser-boxedbutton .content-container .button {
margin-bottom: 0;
}
@media screen and (max-width: 37.5rem) {
.teaser-boxedbutton .content-container .button {
width: 100%;
}
}
.teaser-boxedbutton .background-image {
opacity: 0.5;
display: block;
position: absolute;
top: 0;
left: auto;
right: auto;
z-index: 1;
width: 100%;
height: 100%;
}
.teaser-boxedbutton .background-image .image__image {
display: flex;
align-items: center;
justify-content: center;
position: relative;
width: auto;
height: auto;
max-width: none;
max-height: 100%;
overflow: hidden;
}
.teaser-boxedbutton .background-image .image__image img {
max-width: none;
max-height: 100%;
width: auto;
height: auto;
min-width: 100%;
min-height: 100%;
width: 100%;
height: auto;
}
@media screen and (max-width: 37.5rem) {
.teaser-boxedbutton .background-image .image__image {
height: 100%;
}
.teaser-boxedbutton .background-image .image__image img {
width: auto;
height: 100%;
}
}
.breadcrumb {
font-size: 14px;
margin: 0;
}
.breadcrumb ol {
display: flex;
align-items: baseline;
flex-wrap: wrap;
list-style: none;
padding: 0;
margin: 0;
}
.breadcrumb ol > li {
display: inline-flex;
align-items: baseline;
margin: 0 0.5em 0 0;
padding: 0;
color: #454545;
}
.breadcrumb ol > li a {
color: #454545;
}
.breadcrumb ol > li:before {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 10px;
height: 10px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-chevron-right);
mask-image: var(--bicon-chevron-right);
color: "inherit";
}
.breadcrumb ol > li:before {
vertical-align: text-bottom;
margin-right: 3px;
padding: 0;
}
.breadcrumb ol > li:first-child::before {
display: none;
}
.breadcrumb ol > li:last-child {
color: #000000;
margin-right: 0;
}
.breadcrumb ol > li:last-child a {
color: #000000;
}
#content-header .breadcrumb ol > li a,
#content-header .breadcrumb ol > li:last-child,
#content-header .breadcrumb ol > li:last-child a {
color: #000000;
}
.content-language-select {
flex-grow: 0;
flex-shrink: 1;
position: relative;
z-index: auto;
display: flex;
justify-content: flex-end;
/* old?
.fa-language {
font-size: 2.25em;
margin-right: 7px;
line-height: 1.1rem;
height: 1rem;
}
*/
}
.content-language-select:before {
content: "";
display: inline-block;
flex-grow: 1;
flex-shrink: 0;
}
.content-language-select a {
color: #000000;
white-space: nowrap;
cursor: pointer;
}
.content-language-select ul {
margin: 0;
padding: 0;
list-style: none;
}
.content-language-select ul li {
margin-bottom: 0.3em;
}
.content-language-select .trigger {
display: inline-flex;
align-items: center;
}
.content-language-select .trigger .arrow {
transition: transform 0.2s;
color: #000000;
display: flex;
}
.content-language-select.is-open .trigger .arrow {
transform: rotate(180deg);
}
.content-language-select .dropdown {
background: #ffffff;
padding: 1em;
display: none;
position: absolute;
z-index: 1;
top: 90%;
right: auto;
box-shadow: 0px 0px 5px rgba(100, 100, 100, 0.5);
border: 1px solid #dddddd;
}
.content-language-select .dropdown a {
white-space: nowrap;
}
.content-language-select .dropdown a .lang-img {
display: inline-block;
margin-right: 7px;
}
#content-header .content-language-select .trigger .arrow {
color: #000000;
}
.metalinks {
margin: 0;
}
.metalinks ul {
list-style: none;
padding: 0;
display: flex;
flex-wrap: wrap;
margin: 0;
}
.metalinks ul > li {
margin-left: 0;
}
.metalinks ul > li:before {
content: unset;
display: none;
}
.metalinks ul > li::marker {
display: none;
content: unset;
}
.metalinks ul > li {
margin: 0 0.7em 0 0;
}
.navigation-meta li > a,
.navigation-meta li > span,
.navigation-meta .heading {
padding: 1em 0 1em 12px;
margin: 3px;
display: block;
}
@media print, (min-width: 73.8135rem ) {
.navigation-meta li > a,
.navigation-meta li > span,
.navigation-meta .heading {
padding: 1em 24px;
}
}
.navigation-meta .heading {
padding-top: 2em;
background-color: #f5f5f5;
color: #000000;
text-decoration: none;
font-size: 1em;
font-weight: bold;
}
.navigation-meta .heading i {
font-size: 1.3em;
vertical-align: middle;
}
.navigation-meta ul {
list-style: none;
padding: 0;
background-color: #ffffff;
}
.navigation-meta ul > li {
margin-left: 0;
}
.navigation-meta ul > li:before {
content: unset;
display: none;
}
.navigation-meta ul > li::marker {
display: none;
content: unset;
}
.navigation-meta ul li {
border: 0 none;
margin: 0;
}
.navigation-meta ul .active > a,
.navigation-meta ul .active > span {
font-weight: bold;
}
ul.navigation-tree {
list-style: none;
padding: 0;
margin: 0;
background-color: #ffffff;
}
ul.navigation-tree > li {
margin-left: 0;
}
ul.navigation-tree > li:before {
content: unset;
display: none;
}
ul.navigation-tree > li::marker {
display: none;
content: unset;
}
ul.navigation-tree ul {
list-style: none;
padding: 0;
background: #f2f2f2;
padding-left: 1em;
}
ul.navigation-tree ul > li {
margin-left: 0;
}
ul.navigation-tree ul > li:before {
content: unset;
display: none;
}
ul.navigation-tree ul > li::marker {
display: none;
content: unset;
}
ul.navigation-tree ul ul {
background: #e5e5e5;
}
ul.navigation-tree ul ul ul {
background: #dddddd;
}
ul.navigation-tree li {
border-top: 1px solid #eaeaea;
margin: 0;
}
ul.navigation-tree .active > a,
ul.navigation-tree .active > span,
ul.navigation-tree a.active {
font-weight: bold;
}
ul.navigation-tree a,
ul.navigation-tree span {
color: #000000 !important;
font-weight: normal;
font-size: 1em;
padding: 13px 0 13px 12px;
flex-grow: 1;
margin: 3px;
display: block;
}
@media print, (min-width: 73.8135rem ) {
ul.navigation-tree a,
ul.navigation-tree span {
padding: 1em 24px;
}
}
ul.navigation-tree li > .subtree__header {
display: flex;
justify-content: space-between;
align-items: center;
}
ul.navigation-tree li > .subtree__header .subtree__toggler {
border: 1px solid inherit;
border-width: 0 0 0 1px;
background: transparent;
padding: 0.3em 0.7em 0.4em 0.7em;
margin: 0.5em 3px;
height: 2em;
width: 3em;
font-size: 16px;
color: #000000;
}
ul.navigation-tree li > .subtree__header .subtree__toggler > * {
display: inline-flex;
}
ul.navigation-tree li > .subtree__header .subtree__toggler[aria-expanded=true] > * {
transform: rotate(180deg);
}
ul.navigation-tree li.has--subtree ul.tree__subtree {
box-shadow: inset 0 7px 7px rgba(150, 150, 150, 0.1);
overflow: hidden;
height: auto;
max-height: auto;
margin: 0;
}
.pagination {
margin: 24px 0;
}
.pagination ul {
list-style: none;
padding: 0;
display: inline-flex;
flex-wrap: wrap;
background-color: #ffffff;
}
.pagination ul > li {
margin-left: 0;
}
.pagination ul > li:before {
content: unset;
display: none;
}
.pagination ul > li::marker {
display: none;
content: unset;
}
.pagination ul li {
border: 1px solid #555555;
margin: 0 -1px 0 0;
text-align: center;
min-height: 2.5em;
min-width: 2.8em;
}
.pagination ul li > * {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
height: 100%;
color: #000000;
padding: 0.4em 0.75em 0.3em 0.75em;
line-height: 1;
background-color: transparent;
}
.pagination ul li > * > * {
margin: 0;
}
.pagination ul li a:hover:not(.active),
.pagination ul li a:focus:not(.active) {
background-color: rgb(242.25, 242.25, 242.25);
text-decoration: underline;
color: #000000;
}
.pagination ul .disabled > *,
.pagination ul a[aria-disabled=true] > * {
opacity: 0.35;
}
.pagination ul a[aria-disabled=true] {
pointer-events: none;
}
.pagination ul a[aria-disabled=true]:focus, .pagination ul a[aria-disabled=true]:hover {
background-color: #ffffff;
}
.pagination ul .active {
font-weight: bold;
color: #000000;
background: transparent;
text-decoration: none;
position: relative;
border-top: 0;
}
.pagination ul .active:after {
position: absolute;
top: 0;
left: 0;
content: "";
width: 100%;
height: 6px;
background: #000000;
}
.pagination ul .active > a,
.pagination ul .active span {
margin-top: 1px;
border-bottom: 1px solid #555555;
}
.pagination .mobile-counter {
display: none;
}
@media print, (max-width: 26.875rem) {
.pagination li:not(.pager-item-next):not(.pager-item-previous):not(.mobile-counter) {
display: none;
}
.pagination .mobile-counter,
.pagination .pager-item-next,
.pagination .pager-item-previous {
display: block !important;
}
}
[class*=panel--] > *:first-child {
margin-top: 0;
}
[class*=panel--] > *:last-child {
margin-bottom: 0;
}
.panel--heavy {
padding: 18px;
background-color: #f5f5f5;
border: 1px solid;
border-color: #f5f5f5;
}
.panel--heavy > *:last-child {
margin-bottom: 0;
}
.panel--heavy .panel--heavy {
background: rgba(160, 160, 160, 0.1);
border-color: rgba(160, 160, 160, 0.1);
}
.panel--heavy.panel--remove-inner-panels .panel--heavy {
background: transparent;
border: 0 none;
}
.panel--heavy.panel--remove-inner-panels .panel--heavy:not(.panel__footer) {
padding: 0;
}
.panel__footer {
margin: 0 -18px 0 -18px;
border-width: 1px 0 0 0;
position: relative;
bottom: -18px;
}
.panel--dark {
padding: 18px;
background-color: #000000;
border: 0 none;
color: #ffffff;
}
.panel--dark > *:last-child {
margin-bottom: 0;
}
.panel--dark p,
.panel--dark h2,
.panel--dark h3,
.panel--dark a,
.panel--dark li::marker,
.panel--dark .more:after {
color: #ffffff;
}
.panel--dark a.button {
color: initial;
}
.panel--dark .button {
background-color: transparent !important;
border: 2px solid #ffffff !important;
color: #ffffff !important;
}
.panel--dark .button:hover, .panel--dark .button:focus {
background-color: transparent !important;
}
.panel--dark .button:before {
background: transparent !important;
border-width: 2px;
border-color: #ffffff !important;
}
.panel--dark .button:after {
background: #ffffff !important;
}
.panel--dark .servicepanel__left i {
color: #ffffff !important;
}
.panel--light {
padding: 1.125em;
background-color: #ffffff;
border: 1px solid #dddddd;
}
.panel--light > *:last-child {
margin-bottom: 0;
}
.panel--clean {
padding: 1.125em;
padding-left: 0;
padding-right: 0;
background-color: transparent;
border: 1px solid transparent;
}
.panel--bordered {
padding-top: 1.125em;
padding-bottom: 1.125em;
padding-left: 0;
padding-right: 0;
border: 1px solid #dddddd;
border-width: 1px 0 1px 0;
background-color: transparent;
}
.panel--colored {
padding: 18px;
background-color: #f5f5f5;
border: 1px solid;
color: #000000;
border-color: #f5f5f5;
}
.panel--colored h2,
.panel--colored h3,
.panel--colored h4,
.panel--colored p {
color: #000000;
}
.panel--colored .servicepanel__left i {
color: #000000 !important;
}
.panel--colored > *:last-child {
margin-bottom: 0;
}
.panel--colored2 {
padding: 18px;
background-color: #f5f5f5;
border: 1px solid;
color: #000000;
border-color: #f5f5f5;
}
.panel--colored2 h2,
.panel--colored2 h3,
.panel--colored2 h4,
.panel--colored2 p {
color: #000000;
}
.panel--colored2 .servicepanel__left i {
color: #000000 !important;
}
.panel--colored2 > *:last-child {
margin-bottom: 0;
}
.panel--boxed {
padding: 1.125em;
background-color: #ffffff;
border: 1px solid #000000;
}
.panel--boxed > *:last-child {
margin-bottom: 0;
}
.panel--white {
padding: 1.125em;
background-color: #ffffff;
border: 1px solid #ffffff;
}
.panel--white > *:last-child {
margin-bottom: 0;
}
.panel--hint {
margin-top: 1em;
margin-bottom: 1em;
margin-left: 18px;
padding-left: 12px;
position: relative;
}
.panel--hint > *:first-child {
margin-top: 0;
}
.panel--hint > *:last-child {
margin-bottom: 0;
}
.panel--hint:before {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 22px;
height: 22px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-arrow-right);
mask-image: var(--bicon-arrow-right);
color: #000000;
}
.panel--hint:before {
position: absolute;
left: -18px;
top: 0;
line-height: 23px;
}
/* PILLS */
.pill {
background-color: #000000;
color: #ffffff;
display: inline-flex;
align-items: center;
gap: 0.4em;
width: auto;
min-width: unset;
padding: 1px 7px 1px 7px;
font-size: 14px;
font-weight: bold;
border-radius: 10px;
line-height: 1.2;
border: 1px solid transparent;
}
.pill button,
.pill a {
background: none;
color: inherit;
border: 0 none;
padding: 0;
display: inline-block;
font-size: 1em;
}
.pill i[class^=fa] {
color: inherit;
margin: 0;
}
.pill.pill--inverted {
background-color: #000000;
color: #ffffff;
}
/* Pill variations */
.pill--error {
background-color: #fdecee;
color: #9b0000;
}
.pill--error.pill--inverted {
background-color: #9b0000;
}
.pill--success {
background-color: #e2f1eb;
color: #3f6b25;
}
.pill--success.pill--inverted {
background-color: #3f6b25;
}
.pill--info {
background-color: #ebf1f7;
color: #13245b;
}
.pill--info.pill--inverted {
background-color: #13245b;
}
.pill--message {
background-color: #f9f4e4;
color: #776118;
}
.pill--message.pill--inverted {
background-color: #776118;
}
.pill--big {
padding: 6px 14px;
font-weight: normal;
font-size: 1em;
border-radius: 16px;
}
.pill--filter {
background-color: #dddddd;
color: #000000;
}
.pill--filter:hover, .pill--filter.focus {
background-color: rgb(233.75, 233.75, 233.75);
}
.pill--filter.active, .pill--filter.focus {
background-color: #000000;
color: #ffffff;
}
.pill--filter.active:hover, .pill--filter.focus:hover {
background-color: rgb(25.5, 25.5, 25.5);
}
/* Pill behaviour */
/*
button.pill,
a.pill {
&:hover {
filter: brightness(1.05) opacity(0.9);
}
}
*/
.searchresult-item {
margin-bottom: 25px;
}
.searchresult-item .title a {
color: #000000;
}
.searchresult-item .text {
margin-bottom: 0.4em;
}
.searchresult-item .url {
display: block;
font-size: 11px;
}
/* We modify the original shariff styles here */
.shariff {
margin: 50px 0;
}
.shariff:before, .shariff:after {
content: " ";
display: table;
clear: both;
}
.shariff ul {
list-style: none;
padding: 0;
}
.shariff ul > li {
margin-left: 0;
}
.shariff ul > li:before {
content: unset;
display: none;
}
.shariff ul > li::marker {
display: none;
content: unset;
}
.shariff ul.orientation-horizontal {
justify-content: flex-start;
}
.shariff ul.orientation-horizontal li.shariff-button {
flex: 0 0 auto !important;
display: flex;
align-items: center;
height: auto;
}
@media screen and (max-width: 37.5rem) {
.shariff ul.orientation-horizontal li.shariff-button {
min-width: 50px;
justify-content: center;
}
}
@media print, (min-width: 37.501rem ) {
.shariff ul.orientation-horizontal li.shariff-button {
padding: 0.2em 0.5em;
}
}
.shariff li.shariff-button {
color: #000000;
background-color: #ffffff;
border: 2px solid #000000 !important;
}
.shariff li.shariff-button a {
background-color: transparent;
}
.shariff li.shariff-button a:hover {
background-color: transparent;
}
.shariff li.shariff-button * {
color: #000000;
}
.shariff li.shariff-button .share_text {
font-size: 0.9em;
}
.shariff li.shariff-button .fab,
.shariff li.shariff-button .fas,
.shariff li.shariff-button .bicon {
color: #000000;
}
.twoclick,
.accept_iframe,
.accept_video {
background-color: #f5f5f5;
padding: 18px;
border: 1px solid #f5f5f5;
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
text-align: center;
position: relative;
z-index: auto;
overflow: hidden;
}
@media print, (min-width: 37.501rem ) {
.twoclick,
.accept_iframe,
.accept_video {
min-height: 305px;
}
}
.twoclick *,
.accept_iframe *,
.accept_video * {
z-index: 1;
position: relative;
}
.twoclick .preview_image,
.accept_iframe .preview_image,
.accept_video .preview_image {
position: absolute;
z-index: 0;
width: 100%;
opacity: 0.15;
overflow: hidden;
}
.well {
padding: 18px;
background-color: #f5f5f5;
border: 1px solid;
border-color: #f5f5f5;
}
.well > *:last-child {
margin-bottom: 0;
}
h1 + .article__meta {
margin: -20px 0 20px 0;
}
.article__introtext {
font-weight: bold;
}
.article-mainimage {
margin-bottom: 50px;
}
#content-footer,
#content-footer {
max-width: 100vw;
width: 100%;
margin: 0;
z-index: auto;
padding: 1em 24px;
position: relative;
grid-column: fullWidth !important;
background-color: #f5f5f5;
}
@media print, (max-width: 73.8125rem) {
#content-footer,
#content-footer {
padding: 0.5em 12px;
display: block;
}
}
#content-footer ul,
#content-footer ul {
list-style: none;
padding: 0;
display: block;
}
#content-footer ul > li,
#content-footer ul > li {
margin-left: 0;
}
#content-footer ul > li:before,
#content-footer ul > li:before {
content: unset;
display: none;
}
#content-footer ul > li::marker,
#content-footer ul > li::marker {
display: none;
content: unset;
}
@media print, (min-width: 73.8135rem ) {
#content-footer ul,
#content-footer ul {
max-height: none !important;
}
}
@media print, (max-width: 73.8125rem) {
#content-footer,
#content-footer {
padding-bottom: 0;
}
}
#content-footer a,
#content-footer a {
color: #000000;
text-decoration: none;
}
#content-footer a:hover,
#content-footer a:hover {
text-decoration: underline;
}
#content-footer .content-footer__brand,
#content-footer .content-footer__brand {
min-height: 30px;
max-width: 180px;
}
@media print, (max-width: 73.8125rem) {
#content-footer .content-footer__brand,
#content-footer .content-footer__brand {
padding-top: 1em;
padding-bottom: 1.5em;
}
}
#content-footer .content-footer__brand img,
#content-footer .content-footer__brand img {
max-height: 2.5em;
}
@media print, (min-width: 73.8135rem ) {
#content-footer .content-footer__links > ul,
#content-footer .content-footer__links > ul {
display: inline-flex;
padding-left: 5%;
width: 100%;
}
#content-footer .content-footer__links > ul > li,
#content-footer .content-footer__links > ul > li {
width: 15%;
margin-left: 3%;
max-width: 210px;
}
}
@media print, (max-width: 73.8125rem) {
#content-footer .content-footer__links,
#content-footer .content-footer__links {
margin-left: -12px;
margin-right: -12px;
}
#content-footer .content-footer__links li,
#content-footer .content-footer__links li {
margin: 0 !important;
}
#content-footer .content-footer__links li > a,
#content-footer .content-footer__links li > span,
#content-footer .content-footer__links li > .heading,
#content-footer .content-footer__links li > a,
#content-footer .content-footer__links li > span,
#content-footer .content-footer__links li > .heading {
padding: 1em 12px;
margin: 0;
display: block;
}
#content-footer .content-footer__links li > .heading,
#content-footer .content-footer__links li > .heading {
cursor: pointer;
display: flex;
justify-content: space-between;
}
#content-footer .content-footer__links li > .heading:after,
#content-footer .content-footer__links li > .heading:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 1.2em;
height: 1.2em;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-chevron-right);
mask-image: var(--bicon-chevron-right);
color: inherit;
}
#content-footer .content-footer__links li > .heading:after,
#content-footer .content-footer__links li > .heading:after {
transition: transform 0.2s;
transform: rotate(90deg);
flex-grow: 0;
text-align: right;
line-height: 1;
flex-shrink: 0;
}
#content-footer .content-footer__links li > .heading[aria-expanded=true]:after,
#content-footer .content-footer__links li > .heading[aria-expanded=true]:after {
transform: rotate(-90deg);
}
#content-footer .content-footer__links > ul,
#content-footer .content-footer__links > ul {
display: block;
border-bottom: 1px solid;
}
#content-footer .content-footer__links > ul > li,
#content-footer .content-footer__links > ul > li {
border-top: 1px solid;
}
#content-footer .content-footer__links > ul > li > ul,
#content-footer .content-footer__links > ul > li > ul {
transition: max-height 0.2s;
overflow: hidden;
}
#content-footer .content-footer__links > ul > li > ul > li,
#content-footer .content-footer__links > ul > li > ul > li {
padding-left: 1em;
}
}
@media print, (max-width: 73.8125rem) {
#content-footer .content-footer__links > ul,
#content-footer .content-footer__links > ul {
background-color: #f5f5f5;
border-color: rgb(206.75, 206.75, 206.75);
}
#content-footer .content-footer__links > ul > li,
#content-footer .content-footer__links > ul > li {
border-color: rgb(206.75, 206.75, 206.75);
}
#content-footer .content-footer__links > ul > li > .heading,
#content-footer .content-footer__links > ul > li > .heading {
background-color: #eeeeee;
box-shadow: 0 4px 4px rgba(144, 144, 144, 0.5);
}
#content-footer .content-footer__links > ul > li > ul,
#content-footer .content-footer__links > ul > li > ul {
background-color: transparent;
margin: 0;
}
}
#content-footer a.to-top,
#content-footer a.to-top {
color: #000000;
position: absolute;
right: 24px;
top: 1em;
padding-right: 30px;
}
@media print, (max-width: 73.8125rem) {
#content-footer a.to-top,
#content-footer a.to-top {
right: 12px;
top: 0.5em;
}
}
#content-footer a.to-top:after,
#content-footer a.to-top:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 16px;
height: 16px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-arrow-right);
mask-image: var(--bicon-arrow-right);
color: #ffffff;
}
#content-footer a.to-top:after,
#content-footer a.to-top:after {
transform: rotate(-90deg);
margin: 4px;
}
#content-footer a.to-top:before,
#content-footer a.to-top:before {
content: "";
background: #000000;
width: 24px;
height: 24px;
}
#content-footer a.to-top:before, #content-footer a.to-top:after,
#content-footer a.to-top:before,
#content-footer a.to-top:after {
position: absolute;
right: 0;
top: 0;
display: inline-flex;
}
/* CONTENT HEADER BAR (Breadcrumb, Language, ...) */
#content-header,
#content-header {
background-color: #f5f5f5;
color: #000000;
padding: 0;
font-size: 14px;
width: 100%;
margin: 0 auto;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: flex-start;
}
#content-header a,
#content-header a {
text-decoration: none;
}
#content-header a:hover,
#content-header a:hover {
text-decoration: underline;
}
#content-header > *,
#content-header > * {
padding: 0.5em 0;
flex-grow: 1;
flex-shrink: 1;
}
/*
* JS FLYIN OVERLAY (SAME JS AS FLYIN OVERLAY)
* This is our base css for all overlay flyins in rebrush project
* Do NOT style your buttons, headings,... here!
* We removed namespace here because the container markup is generetet via JS
*/
.flyin-overlay {
display: none;
}
.flyin-overlay .fio-container {
position: fixed;
top: 0;
right: 0;
height: 100vh;
background: #ffffff;
display: flex;
flex-direction: column;
margin: 0;
transition: transform 150ms ease-in-out;
-webkit-transform: translateX(100%);
-ms-transform: translateX(100%);
transform: translateX(100%);
width: 90vw;
}
@media print, (min-width: 37.501rem ) {
.flyin-overlay .fio-container {
width: 35em;
}
}
.flyin-overlay.is-visible {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.flyin-overlay.is-visible .fio-container {
visibility: visible;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
.flyin-overlay .fio-background {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.5);
}
.flyin-overlay .fio-container__head {
position: relative;
z-index: auto;
display: flex;
justify-content: space-between;
align-items: flex-start;
padding: 3px 3px 3px 12px;
border-bottom: 1px solid #dddddd;
background-color: #f5f5f5;
}
@media print, (min-width: 73.8135rem ) {
.flyin-overlay .fio-container__head {
padding: 3px 3px 3px 24px;
}
}
.flyin-overlay .fio-container__head .fio-title {
flex-grow: 1;
margin-top: 15px;
}
.flyin-overlay .fio-container__head .fio-title .heading {
margin: 0;
}
.flyin-overlay .fio-container__head .fio-close {
flex-grow: 0;
padding: 5px 11px;
}
.flyin-overlay .fio-container__body {
overflow-y: auto;
background-color: #ffffff;
height: 100vh;
z-index: auto;
position: relative;
right: 0;
top: 0;
width: 100vw;
max-width: 100%;
padding: 0.5em 12px 80px 12px;
}
.flyin-overlay .fio-container__body a {
color: #165BE0;
}
@media print, (min-width: 73.8135rem ) {
.flyin-overlay .fio-container__body {
padding: 1em 24px 60px 24px;
}
}
.flyin-overlay .fio-container__body > *:first-child {
margin-top: 0;
}
.flyin-overlay .fio-container__body > div:first-child > *:first-child {
margin-top: 0;
}
#footer,
#footer {
max-width: 100vw;
width: 100%;
margin: 0;
z-index: auto;
padding: 1em 24px;
position: relative;
background-color: #545454;
color: #ffffff;
border-top: 1px solid rgba(0, 0, 0, 0.1);
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.3);
padding-bottom: 70px !important;
font-family: Arial, sans-serif;
font-size: 1rem;
box-sizing: border-box;
}
@media print, (max-width: 73.8125rem) {
#footer,
#footer {
padding: 0.5em 12px;
display: block;
}
}
#footer ul,
#footer ul {
list-style: none;
padding: 0;
display: block;
}
#footer ul > li,
#footer ul > li {
margin-left: 0;
}
#footer ul > li:before,
#footer ul > li:before {
content: unset;
display: none;
}
#footer ul > li::marker,
#footer ul > li::marker {
display: none;
content: unset;
}
@media print, (min-width: 73.8135rem ) {
#footer ul,
#footer ul {
max-height: none !important;
}
}
#footer *,
#footer * {
box-sizing: border-box;
}
#footer a,
#footer a {
color: #ffffff;
}
#footer h2,
#footer h3,
#footer h4,
#footer h2,
#footer h3,
#footer h4 {
color: #ffffff;
}
#footer .footer__brand,
#footer .footer__brand {
max-width: 120px;
}
@media print, (max-width: 73.8125rem) {
#footer .footer__brand,
#footer .footer__brand {
padding-top: 1em;
padding-bottom: 1.5em;
}
}
@media print, (min-width: 73.8135rem ) {
#footer .footer__links > ul,
#footer .footer__links > ul {
display: inline-flex;
padding-left: 5%;
width: 100%;
}
#footer .footer__links > ul > li,
#footer .footer__links > ul > li {
width: 15%;
margin-left: 3%;
max-width: 210px;
}
}
@media print, (max-width: 73.8125rem) {
#footer .footer__links,
#footer .footer__links {
margin-left: -12px;
margin-right: -12px;
}
#footer .footer__links li,
#footer .footer__links li {
margin: 0 !important;
}
#footer .footer__links li > a,
#footer .footer__links li > span,
#footer .footer__links li > .heading,
#footer .footer__links li > a,
#footer .footer__links li > span,
#footer .footer__links li > .heading {
padding: 1em 12px;
margin: 0;
display: block;
}
#footer .footer__links li > .heading,
#footer .footer__links li > .heading {
cursor: pointer;
display: flex;
justify-content: space-between;
}
#footer .footer__links li > .heading:after,
#footer .footer__links li > .heading:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 1.2em;
height: 1.2em;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-chevron-right);
mask-image: var(--bicon-chevron-right);
color: inherit;
}
#footer .footer__links li > .heading:after,
#footer .footer__links li > .heading:after {
transition: transform 0.2s;
transform: rotate(90deg);
flex-grow: 0;
text-align: right;
line-height: 1;
flex-shrink: 0;
}
#footer .footer__links li > .heading[aria-expanded=true]:after,
#footer .footer__links li > .heading[aria-expanded=true]:after {
transform: rotate(-90deg);
}
#footer .footer__links > ul,
#footer .footer__links > ul {
display: block;
border-bottom: 1px solid;
}
#footer .footer__links > ul > li,
#footer .footer__links > ul > li {
border-top: 1px solid;
}
#footer .footer__links > ul > li > ul,
#footer .footer__links > ul > li > ul {
transition: max-height 0.2s;
overflow: hidden;
}
#footer .footer__links > ul > li > ul > li,
#footer .footer__links > ul > li > ul > li {
padding-left: 1em;
}
}
@media print, (max-width: 73.8125rem) {
#footer .footer__links > ul,
#footer .footer__links > ul {
border-color: rgb(122.25, 122.25, 122.25);
background-color: #000000;
}
#footer .footer__links > ul > li,
#footer .footer__links > ul > li {
border-color: rgb(122.25, 122.25, 122.25);
}
#footer .footer__links > ul > li > .heading,
#footer .footer__links > ul > li > .heading {
background-color: #545454;
box-shadow: none;
}
#footer .footer__links > ul > li > ul,
#footer .footer__links > ul > li > ul {
background-color: transparent;
margin: 0;
}
}
#footer .footer__claim,
#footer .footer__claim {
margin-top: 20px;
}
@media print, (min-width: 73.8135rem ) {
#footer .footer__claim,
#footer .footer__claim {
padding-left: 8%;
}
}
#footer a.to-top,
#footer a.to-top {
color: #ffffff;
position: absolute;
right: 24px;
top: 1em;
}
@media print, (max-width: 73.8125rem) {
#footer a.to-top,
#footer a.to-top {
right: 12px;
top: 0.5em;
}
}
#footer a.to-top:after,
#footer a.to-top:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 16px;
height: 16px;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-arrow-right);
mask-image: var(--bicon-arrow-right);
color: #ffffff;
}
#footer a.to-top:after,
#footer a.to-top:after {
transform: rotate(-90deg);
margin-left: 0.5em;
}
#header,
#header {
position: relative;
z-index: 50;
background-color: #ffffff;
color: #000000;
min-height: 45px;
max-width: 100vw;
margin: 0 0 0px 0;
padding: 0;
width: 100%;
direction: ltr;
/*
a {
//color: $color-black; // not here, rule is too heavy
}
*/
/* PORTAL BRANDING BAR */
/* MAIN SITE HEADER (Sitelogo, quicklinks, hamburger, searchlens) */
}
#header > *,
#header > * {
flex-grow: 0;
flex-shrink: 0;
}
#header ul,
#header ul {
margin: 0;
}
#header .header__row-portalbrand,
#header .header__row-portalbrand {
display: flex;
align-items: center;
justify-content: flex-start;
height: 44px;
-webkit-transition: height 0.2s ease-in-out, background-color 0.2s ease-in-out;
transition: height 0.2s ease-in-out, background-color 0.2s ease-in-out;
background-color: #ffffff;
border-bottom: 1px solid #dddddd;
padding: 0.25em 12px;
}
@media print, (min-width: 73.8135rem ) {
#header .header__row-portalbrand,
#header .header__row-portalbrand {
padding: 0.25em 24px;
}
}
#header .header__row-portalbrand > *,
#header .header__row-portalbrand > * {
opacity: 1;
-webkit-transform: translateZ(0);
transform: translateZ(0);
-webkit-transition: opacity 0.2s ease-in-out;
transition: opacity 0.2s ease-in-out;
}
#header .header__row-portalbrand .logo,
#header .header__row-portalbrand .logo {
border: 0;
width: auto;
width: 100px;
display: block;
color: #e40422;
}
#header .header__row-portalbrand .logo a,
#header .header__row-portalbrand .logo a {
display: block;
}
#header .header__row-pageheader,
#header .header__row-pageheader {
display: flex;
align-items: center;
justify-content: space-between;
box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
border-bottom: 0px solid rgba(0, 0, 0, 0.1);
padding: 6px 12px;
min-height: 65px;
}
@media print, (min-width: 73.8135rem ) {
#header .header__row-pageheader,
#header .header__row-pageheader {
min-height: 86px;
padding: 12px 24px;
}
}
#header .header__row-pageheader .logo .image,
#header .header__row-pageheader .logo .image {
margin: 0;
display: block;
}
#header .site-header__logo,
#header .pageheader__logo,
#header .site-header__logo,
#header .pageheader__logo {
flex-grow: 1;
flex-shrink: 1000;
flex-basis: auto;
display: flex;
align-items: center;
overflow: hidden;
}
@media print, (min-width: 73.8135rem ) {
#header .site-header__logo,
#header .pageheader__logo,
#header .site-header__logo,
#header .pageheader__logo {
min-width: 300px;
max-width: 60vw;
flex-basis: 24vw;
overflow: visible;
}
}
#header .site-header__logo a,
#header .pageheader__logo a,
#header .site-header__logo a,
#header .pageheader__logo a {
display: block;
color: #000000;
text-decoration: none;
}
@media print, (max-width: 73.8125rem) {
#header .site-header__logo a:focus,
#header .pageheader__logo a:focus,
#header .site-header__logo a:focus,
#header .pageheader__logo a:focus {
outline-offset: -2px;
}
}
#header .site-header__logo .logo img,
#header .site-header__logo .logo svg,
#header .site-header__logo .logo img.svg,
#header .pageheader__logo .logo img,
#header .pageheader__logo .logo svg,
#header .pageheader__logo .logo img.svg,
#header .site-header__logo .logo img,
#header .site-header__logo .logo svg,
#header .site-header__logo .logo img.svg,
#header .pageheader__logo .logo img,
#header .pageheader__logo .logo svg,
#header .pageheader__logo .logo img.svg {
display: block;
max-width: 50vw;
height: 46px;
width: auto;
}
@media print, (min-width: 73.8135rem ) {
#header .site-header__logo .logo img,
#header .site-header__logo .logo svg,
#header .site-header__logo .logo img.svg,
#header .pageheader__logo .logo img,
#header .pageheader__logo .logo svg,
#header .pageheader__logo .logo img.svg,
#header .site-header__logo .logo img,
#header .site-header__logo .logo svg,
#header .site-header__logo .logo img.svg,
#header .pageheader__logo .logo img,
#header .pageheader__logo .logo svg,
#header .pageheader__logo .logo img.svg {
max-width: 280px;
height: 56px;
}
}
#header .site-header__logo .textlogo,
#header .pageheader__logo .textlogo,
#header .site-header__logo .textlogo,
#header .pageheader__logo .textlogo {
font-size: 20px;
margin-right: 12px;
line-height: 1.2em;
margin: 0;
max-height: 6.2em;
line-height: 1.2;
overflow: hidden;
word-break: break-word;
overflow: hidden;
padding: 3px;
}
@media print, (max-width: 73.8125rem) {
#header .site-header__logo .textlogo,
#header .pageheader__logo .textlogo,
#header .site-header__logo .textlogo,
#header .pageheader__logo .textlogo {
font-size: 16px;
}
}
@media screen and (max-width: 37.5rem) {
#header .site-header__logo .textlogo,
#header .pageheader__logo .textlogo,
#header .site-header__logo .textlogo,
#header .pageheader__logo .textlogo {
font-size: 15px;
margin-right: 6px;
}
#header .site-header__logo .textlogo .palm-show,
#header .pageheader__logo .textlogo .palm-show,
#header .site-header__logo .textlogo .palm-show,
#header .pageheader__logo .textlogo .palm-show {
display: block !important;
}
}
#header .site-header__logo .textlogo .institution,
#header .site-header__logo .textlogo .title,
#header .pageheader__logo .textlogo .institution,
#header .pageheader__logo .textlogo .title,
#header .site-header__logo .textlogo .institution,
#header .site-header__logo .textlogo .title,
#header .pageheader__logo .textlogo .institution,
#header .pageheader__logo .textlogo .title {
overflow: hidden;
display: block;
}
#header .site-header__logo .textlogo .institution,
#header .pageheader__logo .textlogo .institution,
#header .site-header__logo .textlogo .institution,
#header .pageheader__logo .textlogo .institution {
font-weight: normal;
}
#header .site-header__logo .textlogo .title,
#header .pageheader__logo .textlogo .title,
#header .site-header__logo .textlogo .title,
#header .pageheader__logo .textlogo .title {
font-weight: bold;
}
#header .site-header__logo .logo + .textlogo,
#header .pageheader__logo .logo + .textlogo,
#header .site-header__logo .logo + .textlogo,
#header .pageheader__logo .logo + .textlogo {
margin-left: 12px;
}
@media screen and (max-width: 37.5rem) {
#header .site-header__logo .logo + .textlogo,
#header .pageheader__logo .logo + .textlogo,
#header .site-header__logo .logo + .textlogo,
#header .pageheader__logo .logo + .textlogo {
margin-left: 8px;
}
}
#header .site-header__title,
#header .pageheader__title,
#header .site-header__title,
#header .pageheader__title {
flex-grow: 1;
margin-right: 1em;
color: #e40422;
}
#header .site-header__title a,
#header .pageheader__title a,
#header .site-header__title a,
#header .pageheader__title a {
color: #e40422;
text-decoration: none;
}
#header .site-header__title .institution,
#header .pageheader__title .institution,
#header .site-header__title .institution,
#header .pageheader__title .institution {
line-height: 1.2;
display: block;
}
@media print, (max-width: 57.5rem) {
#header .site-header__title .institution,
#header .pageheader__title .institution,
#header .site-header__title .institution,
#header .pageheader__title .institution {
font-size: 16px;
}
}
#header .site-header__title .institution,
#header .pageheader__title .institution,
#header .site-header__title .institution,
#header .pageheader__title .institution {
font-size: 18px;
font-weight: bold;
}
#header .site-header__title .title,
#header .pageheader__title .title,
#header .site-header__title .title,
#header .pageheader__title .title {
font-size: 14px;
font-weight: normal;
}
#header .site-header__quicklinks,
#header .pageheader__quicklinks,
#header .site-header__quicklinks,
#header .pageheader__quicklinks {
font-size: 1.1em;
display: inline-block;
overflow: hidden;
flex-grow: 1;
flex-shrink: 1;
flex-basis: 50%;
}
@media print, (max-width: 73.8125rem) {
#header .site-header__quicklinks,
#header .pageheader__quicklinks,
#header .site-header__quicklinks,
#header .pageheader__quicklinks {
display: none;
}
}
#header .site-header__quicklinks a,
#header .pageheader__quicklinks a,
#header .site-header__quicklinks a,
#header .pageheader__quicklinks a {
color: #000000;
text-decoration: none;
}
#header .site-header__quicklinks a:hover,
#header .pageheader__quicklinks a:hover,
#header .site-header__quicklinks a:hover,
#header .pageheader__quicklinks a:hover {
text-decoration: underline;
}
#header .site-header__quicklinks ul,
#header .pageheader__quicklinks ul,
#header .site-header__quicklinks ul,
#header .pageheader__quicklinks ul {
list-style: none;
padding: 0;
padding-right: 3px;
display: flex;
justify-content: flex-end;
overflow: hidden;
flex-wrap: wrap;
max-height: 1.8em;
}
#header .site-header__quicklinks ul > li,
#header .pageheader__quicklinks ul > li,
#header .site-header__quicklinks ul > li,
#header .pageheader__quicklinks ul > li {
margin-left: 0;
}
#header .site-header__quicklinks ul > li:before,
#header .pageheader__quicklinks ul > li:before,
#header .site-header__quicklinks ul > li:before,
#header .pageheader__quicklinks ul > li:before {
content: unset;
display: none;
}
#header .site-header__quicklinks ul > li::marker,
#header .pageheader__quicklinks ul > li::marker,
#header .site-header__quicklinks ul > li::marker,
#header .pageheader__quicklinks ul > li::marker {
display: none;
content: unset;
}
#header .site-header__quicklinks ul li,
#header .pageheader__quicklinks ul li,
#header .site-header__quicklinks ul li,
#header .pageheader__quicklinks ul li {
margin: 3px 0vw 3px 3vw;
white-space: nowrap;
}
#header .site-header__quicklinks ul:before,
#header .pageheader__quicklinks ul:before,
#header .site-header__quicklinks ul:before,
#header .pageheader__quicklinks ul:before {
content: "";
width: 100%;
display: inline-block;
}
#header .site-header__quicklinks .active,
#header .pageheader__quicklinks .active,
#header .site-header__quicklinks .active,
#header .pageheader__quicklinks .active {
font-weight: bold;
}
#header .site-header__services,
#header .pageheader__services,
#header .site-header__services,
#header .pageheader__services {
order: 10;
flex-grow: 0;
display: flex;
height: 100%;
align-items: flex-end;
margin-left: 2vw;
}
@media screen {
#header.is--sticky,
#header.is--sticky {
position: fixed;
top: 0;
left: 0;
width: 100%;
}
#header.is--sticky .header__row-portalbrand,
#header.is--sticky .header__row-portalbrand {
height: 3px;
padding-top: 0;
padding-bottom: 0;
background-color: #545454;
border-bottom: 0 none;
}
#header.is--sticky .header__row-portalbrand > *,
#header.is--sticky .header__row-portalbrand > * {
opacity: 0;
}
#header.is--sticky .header__row-pageheader,
#header.is--sticky .header__row-pageheader {
padding-top: 6px;
padding-bottom: 6px;
min-height: 45px;
}
#header.is--sticky .header__row-pageheader .site-header__logo .logo img,
#header.is--sticky .header__row-pageheader .site-header__logo .logo svg,
#header.is--sticky .header__row-pageheader .pageheader__logo .logo img,
#header.is--sticky .header__row-pageheader .pageheader__logo .logo svg,
#header.is--sticky .header__row-pageheader .site-header__logo .logo img,
#header.is--sticky .header__row-pageheader .site-header__logo .logo svg,
#header.is--sticky .header__row-pageheader .pageheader__logo .logo img,
#header.is--sticky .header__row-pageheader .pageheader__logo .logo svg {
max-height: 50px;
}
}
.herounit-404--default {
text-align: center;
}
.herounit-404--default .title {
font-size: 64px;
color: #dddddd;
margin: 20px 0;
}
.herounit-404--default .subtitle {
font-size: 26px;
color: #000000;
border: 0 none;
margin: 20px 0;
}
.herounit-404--default .image {
width: 338px;
max-width: 50vw;
margin: 0 auto;
}
.herounit-article--default {
margin-bottom: 50px;
}
.herounit-article--default.noimage {
margin-bottom: 0;
}
.herounit-homepage {
margin-bottom: 50px;
}
@media screen and (max-width: 37.5rem) {
.herounit-homepage {
margin-left: -12px;
margin-right: -12px;
width: auto !important;
max-width: 100vw !important;
}
}
.herounit-homepage > h1 {
color: #000000;
}
.herounit-homepage.fullwidth > h1.title {
max-width: 100%;
margin-left: auto;
margin-right: auto;
display: block;
}
@media (min-width: 980px) {
.herounit-homepage.fullwidth > h1.title {
width: 980px;
}
}
@media print, (max-width: 57.5rem) {
.herounit-homepage.fullwidth > h1.title {
margin-left: 18px;
margin-right: 18px;
}
}
.herounit-homepage > [class*=modul-]:last-child {
margin-bottom: 0;
}
.herounit-homepage .form--searchform-simple .searchterm,
.herounit-homepage .searchform-slot .input-wrapper {
border-width: 1px;
}
/* Berlin.de theme startpage herounit */
/* Left 66%: 2:1 image (cropped when neccessary) with overlayed page title */
/* Right 33%: A form by default */
.herounit-image-with-aside {
margin-bottom: 50px;
}
@media screen and (max-width: 37.5rem) {
.herounit-image-with-aside {
margin-left: -12px;
margin-right: -12px;
width: auto !important;
max-width: 100vw !important;
}
}
.herounit-image-with-aside .image,
.herounit-image-with-aside .image__image,
.herounit-image-with-aside form,
.herounit-image-with-aside [class*=modul-] {
margin: 0;
}
.herounit-image-with-aside .image__image {
filter: brightness(0.76);
}
@media print, (min-width: 57.501rem ) {
.herounit-image-with-aside .image {
height: 100%;
width: 100%;
}
.herounit-image-with-aside .image .image__image {
height: 100%;
width: 100%;
}
.herounit-image-with-aside .image .image__image img {
position: absolute;
object-fit: cover;
width: 100%;
height: 100%;
}
}
.herounit-image-with-aside .image__copyright {
position: absolute;
bottom: 0.3em;
right: 0.5em;
color: rgba(255, 255, 255, 0.4);
}
.herounit-image-with-aside .image__overlay {
display: flex;
justify-content: flex-end;
flex-direction: column;
}
.herounit-image-with-aside .image__overlay .title {
font-size: 40px;
margin: 0 0 30px 0;
}
.herounit-image-with-aside .mainbar__left {
background-color: #333333;
}
@media screen and (max-width: 37.5rem) {
.herounit-image-with-aside .mainbar__left {
display: flex;
flex-direction: column;
justify-content: center;
}
.herounit-image-with-aside .image__overlay .title {
font-size: 7vw;
}
}
@media print, (min-width: 57.501rem ) {
.herounit-image-with-aside .mainbar {
width: 100%;
max-width: 1920px;
min-height: 450px;
margin: 0 auto;
display: flex;
flex-wrap: nowrap;
background-color: #f5f5f5;
}
.herounit-image-with-aside .mainbar__left {
flex-grow: 1;
flex-basis: 66.666%;
min-width: none;
display: flex;
flex-direction: column;
justify-content: center;
overflow: hidden;
}
.herounit-image-with-aside .mainbar__right {
flex-grow: 0;
flex-basis: 33.333%;
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.herounit-image-with-aside .image__overlay {
padding-left: 9.2vw;
}
}
.flex--stretch-inner {
display: flex;
width: 100%;
height: 100%;
flex-direction: column;
}
.flex--stretch-inner > *:last-child {
width: 100%;
height: 100%;
margin: 0;
}
/* used in a lot of "herounit-homepage" elements */
.herounit-image-with-overlay {
overflow: hidden;
}
.image--herounit-coverall-with-overlay {
background-color: #333333;
position: relative;
margin-bottom: 0;
}
.image--herounit-coverall-with-overlay + .tiles {
margin-top: 50px;
position: relative;
padding: 0;
}
.image--herounit-coverall-with-overlay + .tiles .flexgrid {
align-items: stretch;
}
.image--herounit-coverall-with-overlay + .tiles .flexgrid .modul-teasertile_buehne {
height: 100%;
}
@media screen and (max-width: 37.5rem) {
.image--herounit-coverall-with-overlay + .tiles .flexgrid .modul-teasertile_buehne {
margin-bottom: 25px;
}
}
@media print, (min-width: 73.8135rem ) {
.image--herounit-coverall-with-overlay + .tiles {
margin: 0 auto;
max-width: 980px;
margin-top: -36px;
}
}
.image--herounit-coverall-with-overlay .image {
display: block;
}
.image--herounit-coverall-with-overlay .image__image {
min-width: 100%;
overflow: hidden;
width: 100%;
display: flex;
align-items: center;
flex-direction: column;
max-width: 100%;
height: 500px;
max-height: 70vh;
justify-content: center;
margin: 0;
}
.image--herounit-coverall-with-overlay .image__image img {
left: auto;
right: auto;
margin: 0 auto;
max-width: none;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
position: absolute;
object-fit: unset;
}
@media all and (-ms-high-contrast: none) {
.image--herounit-coverall-with-overlay .image__image img {
top: 50%;
transform: translateY(-50%) translateX(-50%);
}
}
.image--herounit-coverall-with-overlay .image__copyright {
position: absolute;
bottom: 0.2em;
left: 1em;
margin: 0;
color: #ffffff;
}
.image--herounit-coverall-with-overlay .image__caption {
display: none;
}
.image--herounit-coverall-with-overlay .image__overlay {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
z-index: unset;
text-align: center;
width: 100%;
height: 100%;
top: 0%;
bottom: 0;
}
.image--herounit-coverall-with-overlay .image__overlay .inner {
max-width: 980px;
width: 100%;
}
@media print, (max-width: 73.8125rem) {
.image--herounit-coverall-with-overlay .image__overlay {
padding-left: 12px;
padding-right: 12px;
}
}
.image--herounit-coverall-with-overlay .image__image {
z-index: 0;
position: relative;
}
.image--herounit-coverall-with-overlay:not(.no-darken) .image__image {
filter: brightness(0.76);
}
.image--herounit-coverall-with-overlay .title {
font-size: 24px;
display: inline-block;
}
@media print, (min-width: 37.501rem ) {
.image--herounit-coverall-with-overlay .title {
font-size: 54px;
}
}
.image--herounit-coverall-with-overlay .title {
border: 0 none;
font-size: 7vw;
color: #ffffff;
text-shadow: 0 0 5px rgba(0, 0, 0, 0.74);
margin: 0em 0 0.5em 0;
}
@media print, (min-width: 37.501rem ) {
.image--herounit-coverall-with-overlay .title {
font-size: 35px;
}
}
.image--herounit-coverall-with-overlay .text,
.image--herounit-coverall-with-overlay .textile {
color: #ffffff;
text-shadow: 0 0 5px rgba(0, 0, 0, 0.74);
}
.image--herounit-coverall-with-overlay a {
color: #ffffff;
}
.textbox[class*=textbox--color-] {
margin-bottom: 1em;
padding: 30px 40px 14px 40px;
display: inline-block;
}
.textbox[class*=textbox--color-] * {
text-shadow: none !important;
}
.textbox.textbox--color-white {
background: #ffffff !important;
}
.textbox.textbox--color-white * {
color: #000000 !important;
}
.textbox.textbox--color-dark {
background: #000000 !important;
}
.textbox.textbox--color-dark * {
color: #ffffff !important;
position: relative;
}
.herounit-landingpage--default {
margin-bottom: 0;
}
.herounit-landingpage--default .title {
font-size: 2.2em;
margin-top: 0.5em;
margin-bottom: 0.9em;
}
.herounit-landingpage--default .text {
font-weight: bold;
}
.herounit-landingpage--default > .image {
grid-auto-flow: row;
grid-auto-rows: auto;
grid-auto-columns: auto;
position: relative;
display: -ms-grid;
display: grid;
grid-template-rows: [row1-start] auto [row1-end row2-start] auto [row2-end row3-start] 1fr [row3-end];
position: relative;
margin-bottom: 0;
}
@media print, (min-width: 73.8135rem ) {
.herounit-landingpage--default > .image {
-ms-grid-columns: minmax(0, auto) minmax(0, auto) 40px minmax(50vw, 980px) 40px minmax(0, auto) minmax(0, auto);
grid-template-columns: [first fullWidth-start] minmax(0, auto) [leftcolumn-start] minmax(0, auto) [leftcolumn-end leftgap-start] 40px [leftgap-end mainbar-start] minmax(50vw, 980px) [mainbar-end rightgap-start] 40px [rightgap-end marginal-start] minmax(0, auto) [marginal-end] minmax(0, auto) [last fullWidth-end];
grid-gap: 0;
justify-content: stretch;
}
}
@media print, (max-width: 73.8125rem) {
.herounit-landingpage--default > .image {
display: block;
}
}
@media print, (min-width: 92.501rem ) {
.herounit-landingpage--default > .image {
-ms-grid-columns: minmax(0, 1fr) minmax(0, 250px) 40px 980px 40px minmax(0, 250px) minmax(0, 1fr);
grid-template-columns: [first fullWidth-start] minmax(0, 1fr) [leftcolumn-start] minmax(0, 250px) [leftcolumn-end leftgap-start] 40px [leftgap-end mainbar-start] 980px [mainbar-end rightgap-start] 40px [rightgap-end marginal-start] minmax(0, 250px) [marginal-end] minmax(0, 1fr) [last fullWidth-end];
grid-gap: 0;
justify-content: center;
}
}
.herounit-landingpage--default > .image > .image__image {
-ms-grid-row: 1;
-ms-grid-column: 1;
-ms-grid-column-span: 7;
grid-row: row1;
grid-column: fullWidth;
min-width: 100%;
overflow: hidden;
width: 100%;
display: flex;
align-items: center;
flex-direction: column;
max-width: 100%;
max-height: 70vh;
justify-content: center;
}
.herounit-landingpage--default > .image > .image__image img {
object-fit: unset;
}
.herounit-landingpage--default > .image > .image__copyright,
.herounit-landingpage--default > .image > .image__caption {
margin: 0;
}
@media print, (min-width: 73.8135rem ) {
.herounit-landingpage--default > .image > .image__copyright,
.herounit-landingpage--default > .image > .image__caption {
padding-left: 24px;
}
}
.herounit-landingpage--default > .image > .image__copyright {
-ms-grid-row: 2;
grid-row: row2;
grid-column-start: first;
grid-column-end: leftcolumn-end;
width: 100vw;
max-width: 100%;
}
@media print, (min-width: 73.8135rem ) {
.herounit-landingpage--default > .image > .image__copyright {
position: absolute;
}
}
.herounit-landingpage--default > .image > .image__caption {
display: none;
}
@media print, (min-width: 73.8135rem ) {
.herounit-landingpage--default > .image.noimage .image__overlay {
margin-top: 0;
}
}
.herounit-landingpage--default > .image .image__overlay {
background: #ffffff;
-ms-grid-row: 2;
-ms-grid-row-span: 2;
-ms-grid-column: 4;
-ms-grid-column-span: 1;
grid-row-start: row2-start;
grid-row-end: row3-end;
grid-column: mainbar;
position: relative;
width: 100%;
height: auto;
padding-top: 1em;
}
.herounit-landingpage--default > .image .image__overlay h1,
.herounit-landingpage--default > .image .image__overlay h2,
.herounit-landingpage--default > .image .image__overlay h3,
.herounit-landingpage--default > .image .image__overlay p,
.herounit-landingpage--default > .image .image__overlay a:not(.button) {
color: #000000;
text-shadow: none;
}
@media print, (min-width: 73.8135rem ) {
.herounit-landingpage--default > .image .image__overlay {
margin-top: -7em;
width: 100%;
box-sizing: content-box;
padding-bottom: 0;
padding-left: 40px;
padding-right: 40px;
margin-left: -40px;
margin-right: -40px;
}
.herounit-landingpage--default > .image .image__overlay.has-logos {
margin-top: -10em;
}
}
.herounit-landingpage--default > .image .image__overlay .modul-logogalerie {
margin: 0;
}
.herounit-lebenslauf {
margin-bottom: 50px;
}
.herounit-lebenslauf:before, .herounit-lebenslauf:after {
content: " ";
display: table;
clear: both;
}
.herounit-lebenslauf:before, .herounit-lebenslauf:after {
content: " ";
display: table;
clear: both;
}
@media print, (min-width: 37.501rem ) {
.herounit-lebenslauf .image {
float: left;
margin-right: 20px;
max-width: 250px;
width: 25%;
max-height: none;
}
}
.herounit-lebenslauf .title {
margin-top: 0;
}
.herounit-lebenslauf .inner {
overflow: auto;
}
.herounit-lebenslauf .inner > *:last-child {
margin-bottom: 0;
}
.herounit-lebenslauf .icon-social {
color: #000000;
font-size: 22px;
line-height: 1.2;
}
.herounit-lebenslauf dl ul {
margin-bottom: 0;
}
/* Berlin.de portal frontpage herounit */
/* Left: Icon and global searchform */
/* Right: Fourth tiles grid */
/*
* Moved to Corporate Masterlayout!
*/
/*
*/
/*
.herounit-portalstart .animation-stop {
position: absolute;
bottom: 1.9em;
left: 1em;
font-size: 14px;
border: 0 none;
background: none;
i {
margin-right: 0.3em;
}
}
*/
/*
.herounit-portalstart {
@include removePagePaddingPalm();
margin-bottom: $blockBottomMarginPx; // remember berlinmail link when change this
// Four tiles grid (in right mainbar area)
.tilesgrid {
@include remove-list-bullet();
display: flex;
flex-wrap: wrap;
margin: 0;
* {
// remove all margins from elements like images
margin: 0;
}
> * {
// tiles grid via width
width: 50%; // palm
@include media-query ('palm-and-up') {
width: 25%; // tablet
}
@include media-query ('tablet-and-up') {
width: 50%; // desktop
}
}
}
// Icon, Title and Searchbar (in left mainbar area)
.welcome {
position: relative;
width: 100%;
height: 100%;
display: flex;
align-items: flex-start;
justify-content: center;
.berlin-bear {
width: 75px;
margin-bottom: 30px;
}
h1,h2,h3,p {
color: $color-white;
}
.title {
margin-bottom: 0.6em;
color: $color-white;
background-color: black;
padding: 0.2em 0.5em 0.3em;
}
.berlin-bear {
height: 80px;
}
}
.welcome__foreground {
z-index: 1;
position: relative; // not absolute, see mobile view
padding: 5% 30px 0px 30px;
display: flex;
flex-direction: column;
align-items: center;
max-width: 710px;
}
.welcome__background {
// SVG ANIMATION LAYER
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 0;
overflow: hidden;
> * {
position: absolute;
z-index: auto;
bottom: 0;
left: 0;
}
.background_stretched {
height: 100%;
width: 100%;
}
.background_fixed.bottom.left {
max-height: 100%;
max-width: 100%;
}
}
@include media-query('palm') {
// palm
.welcome {
.title {
font-size: 4.5vw;
}
.berlin-bear {
height: 60px;
}
}
}
// Basic mainbar settings
.mainbar {
background-color: $color-blue;
position: relative;
z-index: 0;
}
// Main Grid
@include media-query('tablet-and-up') {
.mainbar {
min-height: auto;
width: 100%;
max-width: 1920px;
margin: 0 auto;
display: flex;
flex-wrap: nowrap;
}
.mainbar__left {
flex-basis: 66.666%;
}
.mainbar__right {
flex-basis: 33.333%;
min-width: 460px;
background-color: black;
}
.welcome {
.title {
font-size: 2vw;
}
}
}
// DESKTOP:
@include media-query('tablet-landscape-and-up') {
.mainbar {
min-height: 380px;
}
.mainbar__right {
min-width: 510px;
}
.welcome {
.title {
font-size: 28px;
}
}
}
}
*/
/*
* JS MODAL OVERLAY (SAME JS AS FLYIN OVERLAY)
* This is our base css for all modal overlays in rebrush project
* Do NOT style your buttons, headings,... here!
* We removed namespace here because the container markup is generetet via JS
*/
.modal-overlay {
display: none;
}
.modal-overlay .fio-container {
position: static;
height: auto;
width: auto;
max-width: 90vw;
max-height: 90vh;
min-width: 90vw;
background: #ffffff;
display: flex;
flex-direction: column;
margin: 0;
}
@media print, (min-width: 37.501rem ) {
.modal-overlay .fio-container {
min-width: 400px;
}
}
.modal-overlay.is-visible {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
display: flex !important;
align-items: center;
justify-content: center;
}
.modal-overlay .fio-background {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.5);
}
.modal-overlay .fio-container__head {
position: relative;
z-index: auto;
display: flex;
justify-content: space-between;
align-items: flex-start;
padding: 3px 3px 3px 12px;
border-bottom: 1px solid #dddddd;
background-color: #f5f5f5;
}
@media print, (min-width: 73.8135rem ) {
.modal-overlay .fio-container__head {
padding: 3px 3px 3px 24px;
}
}
.modal-overlay .fio-container__head .fio-title {
flex-grow: 1;
margin-top: 15px;
}
.modal-overlay .fio-container__head .fio-title .heading {
margin: 0;
}
.modal-overlay .fio-container__head .fio-close {
flex-grow: 0;
padding: 10px 16px;
}
.modal-overlay .fio-container__body {
overflow-y: auto;
background-color: #ffffff;
z-index: auto;
position: relative;
padding: 0.5em 12px 80px 12px;
}
.modal-overlay .fio-container__body a {
color: #165BE0;
}
@media print, (min-width: 73.8135rem ) {
.modal-overlay .fio-container__body {
padding: 1em 24px 60px 24px;
}
}
.modal-overlay .fio-container__body > *:first-child {
margin-top: 0;
}
.modal-overlay .fio-container__body > div:first-child > *:first-child {
margin-top: 0;
}
/*
* header servicebuttons with overlay (wcag, search, hamburger) in header
*/
.service-button-overlay {
margin-bottom: 0;
}
.service-button-overlay .icon-button {
display: flex;
flex-direction: column;
height: 100%;
justify-content: flex-end;
align-items: center;
color: #000000;
background: transparent;
padding: 0.1em 0.5em;
font-size: 1em;
border: 0 none;
width: auto;
}
@media screen and (max-width: 37.5rem) {
.service-button-overlay .icon-button {
padding: 0.1em 0.3em;
}
}
.service-button-overlay .icon-button .icon {
font-size: 2em;
line-height: 1;
margin-bottom: 0.1em;
display: inline-block;
padding: 0;
background: none;
}
.service-button-overlay .icon-button .icon:before {
vertical-align: middle;
}
.service-button-overlay .icon-button .text {
font-size: 11px;
word-break: initial;
}
.service-button-overlay .overlay {
position: fixed;
top: 0;
right: 0;
height: 100vh;
background: #ffffff;
visibility: hidden;
z-index: 100;
display: flex;
flex-direction: column;
-webkit-transform: translateX(100%);
-ms-transform: translateX(100%);
transform: translateX(100%);
}
.service-button-overlay .overlay.is-visible {
visibility: visible;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
.service-button-overlay .overlay .overlay__header {
position: relative;
z-index: 2;
display: flex;
justify-content: space-between;
align-items: center;
background-color: #ffffff;
padding: 0.5em 0 0 12px;
}
@media print, (min-width: 73.8135rem ) {
.service-button-overlay .overlay .overlay__header {
padding: 1em 0 0 24px;
}
}
.service-button-overlay .overlay .overlay__header .heading {
font-size: 1.375em;
color: #000000;
margin: 50px 0 0.75em 0;
line-height: 1.182em;
font-weight: 700;
margin: 0;
}
@media print {
.service-button-overlay .overlay .overlay__header .heading {
page-break-before: auto;
page-break-after: avoid !important;
}
}
.service-button-overlay .overlay .overlay__body {
overflow-y: auto;
background-color: #ffffff;
height: 100vh;
z-index: 1;
right: 0;
top: 0;
width: 100vw;
max-width: 100%;
/* a {
//color: $color-text-link; // NO! Rule is to strong
}*/
padding: 0.5em 12px;
}
@media print, (min-width: 73.8135rem ) {
.service-button-overlay .overlay .overlay__body {
padding: 1em 24px;
}
}
.service-button-overlay .overlay .overlay__body > *:first-child(),
.service-button-overlay .overlay .overlay__body .inner > *:first-child() {
margin-top: 0;
}
.service-button-overlay .overlay .close-button {
font-size: 2em;
color: #000000;
background: #ffffff;
padding: 0 0.5em;
border: 0 none;
width: auto;
margin-left: auto;
}
.service-button-overlay .overlay {
width: 90vw;
}
@media print, (min-width: 37.501rem ) {
.service-button-overlay .overlay {
width: 35em;
}
.service-button-overlay.fullwidth .overlay {
width: 90vw;
}
}
.service-button-overlay .compliance-level {
font-size: 5em;
line-height: 1;
margin: 0;
font-weight: bold;
}
.service-button-overlay .overlay__body .js-navigation-primary {
margin-left: -12px;
margin-right: -12px;
padding-bottom: 80px;
}
@media print, (min-width: 73.8135rem ) {
.service-button-overlay .overlay__body .js-navigation-primary {
margin-left: -24px;
margin-right: -24px;
}
}
.service-button-overlay #overlay-background {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 99;
}
.service-button-overlay.search {
/*
// Disabled: Old searchslot rules breaks new searchslot layout
label {
font-weight: bold;
display: block;
margin-bottom: 0.4em;
}
*/
}
.service-button-overlay.search .overlay__body {
display: flex;
justify-content: center;
align-items: center;
}
.service-button-overlay.search .search-container {
display: flex;
justify-content: space-between;
width: 980px;
max-width: 90%;
margin-bottom: 30vh;
}
.service-button-overlay.search form {
flex-grow: 1;
}
.service-button-overlay.search .search-form {
flex-grow: 1;
}
.service-button-overlay.search .search-form .form-group {
display: flex;
}
.service-button-overlay.search .search-form .form-control {
flex-grow: 1;
width: 100%;
flex-shrink: 1;
margin-bottom: 0;
border-radius: 0px;
font-size: 1em;
min-height: 43px;
background-color: #ffffff;
border: 2px solid #000000;
padding: 10px;
}
.service-button-overlay.search .search-form .form-control:focus {
border-color: #0076dd;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6);
outline: 0 none;
}
.service-button-overlay.search .search-form button {
white-space: nowrap;
border-radius: 0px;
padding: 10px 16px;
font-size: 1em;
background-color: #000000;
color: #ffffff;
border: 2px solid #000000;
transition: background-color 0.2s ease-out;
}
.service-button-overlay.search .search-form button:hover, .service-button-overlay.search .search-form button:focus {
background-color: #333333;
}
.service-button-overlay.search .search-form button:after, .service-button-overlay.search .search-form button:before {
display: none;
}
.service-button-overlay.accessibility ul.wcag-linklist {
list-style: none;
padding: 0;
}
.service-button-overlay.accessibility ul.wcag-linklist > li {
margin-left: 0;
}
.service-button-overlay.accessibility ul.wcag-linklist > li:before {
content: unset;
display: none;
}
.service-button-overlay.accessibility ul.wcag-linklist > li::marker {
display: none;
content: unset;
}
.service-button-overlay.accessibility ul.wcag-linklist li {
min-height: 40px;
margin: 0;
display: flex;
align-items: center;
}
.service-button-overlay.accessibility ul.wcag-linklist a {
padding: 5px 0;
display: block;
}
.service-button-overlay.accessibility ul.wcag-linklist img {
display: inline-block;
}
.service-button-overlay p {
margin-top: 0;
}
.collapsible-group .collapsible-heading {
margin-bottom: 20px;
}
.collapsible-group .collapsible-toggle {
display: flex;
justify-content: flex-start;
flex-wrap: nowrap;
align-items: stretch;
margin-bottom: 8px;
}
.collapsible-group .collapsible-toggle .collapsible-counter {
background-color: #000000;
color: #ffffff;
font-weight: bold;
font-size: 22px;
padding: 9px 10px 8px 10px;
}
.collapsible-group .collapsible-toggle .collapsible-title {
background-color: #f5f5f5;
color: #000000;
font-weight: bold;
font-size: 17px;
flex-grow: 1;
padding: 12px 15px 11px 15px;
}
.collapsible-group.closed .collapsible-heading {
margin-bottom: 0px;
}
.shop-items {
margin: 12px 0;
}
.shop-items > * {
margin-left: 0 !important;
}
.shop-items > .shop-items-header {
font-weight: bold;
border-bottom: 1px solid #000000;
margin-bottom: 12px;
}
.shop-items > .shop-items-header > * {
padding-bottom: 4px;
}
.shop-items > .shop-items-body {
border-bottom: 1px solid #000000;
padding-bottom: 12px !important;
margin-bottom: 12px;
}
.shop-items > .shop-items-body .image__image {
max-width: 200px;
max-height: 150px;
}
.shop-items > .shop-items-body .title {
margin-top: 0;
}
.shop-items .align-right {
text-align: right;
}
.shop-items .shop-items-amount {
padding-left: 0;
}
.shop-items .shop-items-amount .control-group {
margin-bottom: 5px;
}
.shop-items .shop-items-amount select {
width: auto !important;
}
.shop-items .shop-items-sum {
white-space: nowrap;
}
#Shop .buttonleiste {
text-align: right;
margin: 1em 0;
display: flex;
align-items: center;
}
#Shop .buttonleiste button {
order: 2;
}
#Shop .buttonleiste .abbrechen {
order: 0;
margin: 0;
}
#Shop .buttonleiste:before {
flex-grow: 1;
content: "";
order: 1;
}
#Shop .formfooter {
margin-bottom: 2em;
}
#Shop .shop-npa {
width: 300px;
margin: 0 auto;
}
#Shop .shop-npa button {
display: flex;
align-items: center;
text-align: left;
}
#Shop .shop-npa img {
margin-right: 1em;
}
@media print, (min-width: 57.501rem ) {
.simplesearch-head {
display: flex;
justify-content: space-between;
align-items: baseline;
}
}
.simplesearch-head .block-tocart {
margin-bottom: 1em;
}
.swiper-slide {
user-select: none;
}
.swiper-slide img,
.swiper-slide a {
-webkit-user-drag: none;
}
.swiper-container {
overflow: hidden;
/* We cant do this, because carousel has more than one swipe visible,
but only one of them is set to active, so visible links are hidden.
// Accessability: Tabfocus fix for known swiper.js issue
.swiper-slide a {
visibility: hidden;
}
.swiper-slide.swiper-slide-active a {
visibility: visible;
}
*/
}
.swiper-container .swiper-container {
width: 100%;
background-color: #ffffff;
}
.swiper-container ul.swiper-wrapper {
list-style: none;
padding: 0;
margin: 0;
display: flex;
}
.swiper-container ul.swiper-wrapper > li {
margin-left: 0;
}
.swiper-container ul.swiper-wrapper > li:before {
content: unset;
display: none;
}
.swiper-container ul.swiper-wrapper > li::marker {
display: none;
content: unset;
}
.swiper-container ul.swiper-wrapper > li {
width: 100%;
height: auto;
flex-shrink: 0;
margin: 0;
}
.swiper-container .swiper-button-next,
.swiper-container .swiper-button-prev {
padding: 1em 0.05em;
width: auto;
height: 67px;
position: absolute;
background: #000000;
}
.swiper-container .swiper-button-next:after,
.swiper-container .swiper-button-prev:after {
line-height: 1;
vertical-align: text-top;
content: "";
background-color: currentColor;
display: inline-block;
overflow: hidden;
width: 3rem;
height: 3rem;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position-x: center;
-webkit-mask-position-y: bottom;
mask-position: bottom center;
-webkit-mask-image: var(--bicon-chevron-right);
mask-image: var(--bicon-chevron-right);
color: #ffffff;
}
.swiper-container .swiper-button-next:after,
.swiper-container .swiper-button-prev:after {
margin: 0;
mask-position: center center;
z-index: 6;
}
.swiper-container .swiper-button-prev, .swiper-container.swiper-container-rtl .swiper-button-next {
left: 0px;
}
.swiper-container .swiper-button-prev:after, .swiper-container.swiper-container-rtl .swiper-button-next:after {
-webkit-mask-image: var(chevron-right);
mask-image: var(chevron-right);
transform: rotate(180deg);
}
.swiper-container .swiper-button-next, .swiper-container.swiper-container-rtl .swiper-button-prev {
right: 0px;
}
.swiper-container .swiper-button-next:after, .swiper-container.swiper-container-rtl .swiper-button-prev:after {
-webkit-mask-image: var(chevron-right);
mask-image: var(chevron-right);
}
.swiper-container .swiper-pagination {
background: #ffffff;
}
.swiper-container .swiper-pagination .swiper-pagination-bullet {
margin-right: 8px;
width: 8px;
height: 8px;
border-radius: 50%;
background: #CCCCCC;
opacity: 1;
}
.swiper-container .swiper-pagination .swiper-pagination-bullet-active {
background: #000000;
opacity: 1;
}
.swiper-container .swiper-button-fullscreen {
position: absolute;
bottom: 0;
right: 0;
z-index: 30;
padding: 0em 0.2em;
color: #000000;
border: none;
background: transparent;
}
body .swiper {
position: relative;
z-index: 0;
}
/*
Here we can put cross vertical css for branding single modules in other verticals
*/
.crossvertical--citizenservice.modul-panel-crossvertical {
background-color: #001c3e;
border-bottom: 11px solid #ff4f4f;
}
@media print, (min-width: 73.8135rem ) {
.crossvertical--citizenservice.modul-panel-crossvertical.add-dots > *::before {
background-image: radial-gradient(#ff4f4f 3px, transparent 4px);
}
}
.crossvertical--citizenservice .modul-arrowtiles {
background-color: transparent;
}
.crossvertical--citizenservice .arrowtile {
background-color: #ffffff;
color: #000000;
}
.crossvertical--citizenservice .arrowtile:after {
color: #ffffff;
}
.crossvertical--citizenservice .arrowtile:before {
background: #ff4f4f;
}
.modul-linklist.cross-vertical--citizenservice .title {
background-color: #001c3e;
border-bottom: 4px solid #ff4f4f;
color: #ffffff;
padding: 3px 0;
}
.modul-linklist.cross-vertical--citizenservice .title:before {
content: "\f061";
color: #ff4f4f;
font-family: "Font Awesome 5 Free", "Font Awesome 5 Brands", FontAwesome;
display: inline-block;
font-weight: 700;
margin-right: 8px;
}
.herounit-article--marketing {
margin-bottom: 0;
}
.herounit-article--marketing .image {
position: relative;
margin-bottom: 25px;
}
@media print, (min-width: 37.501rem ) {
.herounit-article--marketing .image {
display: -ms-grid;
-ms-grid-columns: minmax(0, 1fr);
-ms-grid-rows: 1fr auto auto;
display: grid;
grid-template-areas: "image" "caption" "copyright";
}
}
.herounit-article--marketing .image .image__image {
-ms-grid-row: 1;
-ms-grid-column: 1;
grid-area: image;
position: relative;
max-width: none;
}
@media print, (min-width: 37.501rem ) {
.herounit-article--marketing .image .image__image {
min-height: 400px;
}
}
.herounit-article--marketing .image .image__image img {
width: 100%;
display: block;
}
.herounit-article--marketing .image .image__overlay {
-ms-grid-row: 1;
-ms-grid-column: 1;
grid-area: image;
position: absolute;
bottom: 0;
right: 0;
width: 100%;
height: 100%;
background: transparent;
overflow: hidden;
}
.herounit-article--marketing .image .image__overlay .inner {
background: #ffffff;
/*
background: #FFFFFF;
> * {
color: $color-text-base; // important because of white background
}
*/
}
.herounit-article--marketing .image .image__overlay .inner h1,
.herounit-article--marketing .image .image__overlay .inner h2,
.herounit-article--marketing .image .image__overlay .inner h3,
.herounit-article--marketing .image .image__overlay .inner p,
.herounit-article--marketing .image .image__overlay .inner a:not(.button) {
color: #000000;
text-shadow: none;
}
@media print, (min-width: 37.501rem ) {
.herounit-article--marketing .image .image__overlay .inner {
max-width: 49%;
min-width: 28em;
position: absolute;
right: 0;
bottom: 0;
padding: 20px 0em 20px 20px;
}
}
@media print, (min-width: 37.501rem ) {
.herounit-article--marketing .image .image__overlay.add-kp-angle {
max-height: 514px;
}
.herounit-article--marketing .image .image__overlay.add-kp-angle .inner:before {
background-image: url("data:image/svg+xml, %3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 100 514%27 fill=%27white%27 preserveAspectRatio=%27none%27%3E%3Cpolygon points=%27100,0 100,514 0,514%27 /%3E%3C/svg%3E");
background-position: center center;
background-repeat: no-repeat;
background-size: 100% 100%;
content: "";
height: 514px;
width: 100px;
position: absolute;
top: 0;
left: -100px;
}
.herounit-article--marketing .image .image__overlay.add-kp-angle .text {
max-height: 356px;
overflow: hidden;
}
}
@media screen and (max-width: 37.5rem) {
.herounit-article--marketing .image .image__overlay {
position: static;
max-width: none;
padding: 0;
min-width: auto;
}
}
.herounit-article--marketing .image .image__overlay .title {
margin: 1em 0 0.5em 0;
}
@media print, (min-width: 37.501rem ) {
.herounit-article--marketing .image .image__overlay .title {
margin: 0 0 0.5em 0;
}
}
.herounit-article--marketing .image .image__overlay .text {
margin-bottom: 0;
}
.herounit-article--marketing .image .image__caption {
-ms-grid-row: 3;
-ms-grid-column: 1;
}
.herounit-article--marketing .image .image__caption p {
margin: 0;
}
.herounit-article--marketing .image .image__copyright {
-ms-grid-row: 2;
-ms-grid-column: 1;
}
.herounit-homepage .image--herounit-coverall-with-overlay .title {
margin: 1em 0 0.5em 0;
font-size: 30px;
}
@media print, (min-width: 37.501rem ) {
.herounit-homepage .image--herounit-coverall-with-overlay .title {
font-size: 35px;
margin: 0 0 0.5em 0;
}
}