/* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- VARIABLEN ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ :root { /* Farben Hex */ /* Bootstrap */ --white: #fff; --gray: #666666; --gray-dark: #343a40; --primary: #40d2ee; /*--primary-hell: #d9f6fc;*/ --primary-hell: #d5e8f2; /*--primary-hover: #ffa600;*/ --secondary: #004a7a; /*--secondary-hover: #d3dbde;*/ --success: #3dd02e; /*--success-hover: #8cd390;*/ --info: #17a2b8; --warning: #902347; --danger: #d5053a; --light: #f0f0f0; --medium: #32759d; --dark: #072b46; --breakpoint-xs: 0; --breakpoint-sm: 576px; --breakpoint-md: 768px; --breakpoint-lg: 992px; --breakpoint-xl: 1200px; /* Eigene*/ /*--bs-body-color:#002a55;*/ --bs-body-color:#000000; --lines-light:#d3d3d3; --lines-dark:#000000; /* Links */ --link: #000000; --linkhover: #40d2ee; /* Hauptnavigation */ --mainnavlightlink: #000000; --mainnavdarklink: #ffffff; --mainnavactivelink: #40d2ee; --mainnavstickycolor: 255,255,255; /* Footer */ --footercontent:#ffffff; --footerbackground:#072b46; --footerlink: #ffffff; --footerlinkhover: #40d2ee; /* Farben RGB */ /* Bootstrap */ --white-rgb: 255,255,255; /*--primary-rgb: 255,171,77;*/ --primary-rgb: 64,210,238; --secondary-rgb: 0,74,122; --light-rgb: 240,240,240; --medium-rgb: 50,117,157; --dark-rgb: 7,43,70; --gray-dark: 52,58,64; /* Swiper Card Elemente */ --swiper-theme-color:#40d2ee; --swiper-pagination-color:#40d2ee; --swiper-navigation-color:#ffffff; --swiper-navigation-size:25px; /* Carousel Colors */ --carousel-pagination-color:#40d2ee; --carousel-navigation-color:#ffffff; /* Abstände */ --abstand-ganzklein:10px; --abstand-klein:15px; --abstand-normal:30px; --abstand-mittel:40px; --abstand-gross:60px; --abstand-ganzgross:80px; --card-padding:25px; --card-padding-gross:40px; --section-bigdesktop-padding:80px; --section-desktop-padding:80px; --section-tablet-padding:50px; --section-phone-padding:50px; --container-fluid-left-right-big:7%; --container-fluid-left-right-small:5%; /* Border Radius Elemente wie Card, Accordeon */ --border-radius:0px; --border-radius-button:0px; /* Transparenzen */ --overlay-standard:0.6; /* Icons */ /*--link-intern-icon:"\f178";*/ --link-more-icon:"\f178"; --link-back-icon:"\f177"; --link-extern-icon:"\f08e"; --link-mail-icon: "\f0e0"; --link-download-icon:"\f1c1"; --close-button:"\f057"; --home-button:"\f015"; --plus-button:"\f055"; --accordion-icon-normal:"\2b"; --accordion-icon-active:"\f068"; --link-youtube-icon:"\f167"; --link-audio-icon:"\f6a8"; --link-video-icon:"\f03d"; --link-meldungen-icon:"\f4a6"; --link-dokumentationen-icon:"\f31c"; --link-programm-icon:"\f0ca"; --link-publikationen-icon:"\f5da"; --link-arrowup-icon:"\f062"; --link-arrowdown-icon:"\f063"; --link-plus-icon:"\2b"; --link-fax-icon:"\f1ac"; --link-phone-icon:"\f095"; --link-ort-icon:"\f3c5"; --link-datum-icon:"\f073"; --link-uhrzeit-icon:"\f017"; --link-information-icon:"\f05a"; --link-vcard-icon:"\f2bb"; --link-tag-icon:"\f02b"; /* Schriften und Schriftgrössen */ --font-size-extrasmall:0.6em; --font-size-small:0.825em; --font-size-middle:0.9em; --font-size-link:1em; --bs-font-sans-serif:'Fira Sans'; --bs-font-serif:'Bitter'; --font-awesome-regular:'Font Awesome 5 Pro Regular'; --font-awesome-brands:'Font Awesome 5 Pro Brands'; --bs-body-font-size:1.1em; --bs-body-font-size-plus:1.2em; --bs-body-line-height: 1.25em; /* Höhen und Breiten verschiedener Elemente */ --jumbotronheight-desktop:500px; --jumbotronheight-tablet:350px; --jumbotronheight-phone:230px; --navigationheight-desktop:150px; --navigationheight-tablet:100px; --navigationheight-phone:100px; --navigationheight-sticky-desktop:150px; --navigationheight-sticky-tablet:100px; --navigationheight-sticky-phone:100px; --meta-nav-height:30px; --nav-abstand-phone:20px; --nav-abstand-tablet:20px; --nav-abstand-desktop:40px; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- SCHRIFTEN LADEN ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ /* ------------------------ Serifenlose Schrift ------------------------ */ @font-face { font-family: 'Fira Sans'; src: url('../fonts/FiraSans/FiraSans-Bold.eot'); src: url('../fonts/FiraSans/FiraSans-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/FiraSans/FiraSans-Bold.woff2') format('woff2'), url('../fonts/FiraSans/FiraSans-Bold.woff') format('woff'), url('../fonts/FiraSans/FiraSans-Bold.ttf') format('truetype'), url('../fonts/FiraSans/FiraSans-Bold.svg#FiraSans-Bold') format('svg'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Fira Sans'; src: url('../fonts/FiraSans/FiraSans-BoldItalic.eot'); src: url('../fonts/FiraSans/FiraSans-BoldItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/FiraSans/FiraSans-BoldItalic.woff2') format('woff2'), url('../fonts/FiraSans/FiraSans-BoldItalic.woff') format('woff'), url('../fonts/FiraSans/FiraSans-BoldItalic.ttf') format('truetype'), url('../fonts/FiraSans/FiraSans-BoldItalic.svg#FiraSans-BoldItalic') format('svg'); font-weight: bold; font-style: italic; font-display: swap; } @font-face { font-family: 'Fira Sans'; src: url('../fonts/FiraSans/FiraSans-Italic.eot'); src: url('../fonts/FiraSans/FiraSans-Italic.eot?#iefix') format('embedded-opentype'), url('../fonts/FiraSans/FiraSans-Italic.woff2') format('woff2'), url('../fonts/FiraSans/FiraSans-Italic.woff') format('woff'), url('../fonts/FiraSans/FiraSans-Italic.ttf') format('truetype'), url('../fonts/FiraSans/FiraSans-Italic.svg#FiraSans-Italic') format('svg'); font-weight: normal; font-style: italic; font-display: swap; } @font-face { font-family: 'Fira Sans'; src: url('../fonts/FiraSans/FiraSans-Regular.woff2') format('woff2'), url('../fonts/FiraSans/FiraSans-Regular.woff') format('woff'), url('../fonts/FiraSans/FiraSans-Regular.ttf') format('truetype'), url('../fonts/FiraSans/FiraSans-Regular.svg#FiraSans-Regular') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Fira Sans'; src: url('../fonts/FiraSans/FiraSans-MediumItalic.eot'); src: url('../fonts/FiraSans/FiraSans-MediumItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/FiraSans/FiraSans-MediumItalic.woff2') format('woff2'), url('../fonts/FiraSans/FiraSans-MediumItalic.woff') format('woff'), url('../fonts/FiraSans/FiraSans-MediumItalic.ttf') format('truetype'), url('../fonts/FiraSans/FiraSans-MediumItalic.svg#FiraSans-Italic') format('svg'); font-weight: 500; font-style: italic; font-display: swap; } @font-face { font-family: 'Fira Sans'; src: url('../fonts/FiraSans/FiraSans-Medium.woff2') format('woff2'), url('../fonts/FiraSans/FiraSans-Medium.woff') format('woff'), url('../fonts/FiraSans/FiraSans-Medium.ttf') format('truetype'), url('../fonts/FiraSans/FiraSans-Medium.svg#FiraSans-Regular') format('svg'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Fira Sans'; src: url('../fonts/FiraSans/FiraSans-BlackItalic.eot'); src: url('../fonts/FiraSans/FiraSans-BlackItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/FiraSans/FiraSans-BlackItalic.woff2') format('woff2'), url('../fonts/FiraSans/FiraSans-BlackItalic.woff') format('woff'), url('../fonts/FiraSans/FiraSans-BlackItalic.ttf') format('truetype'), url('../fonts/FiraSans/FiraSans-BlackItalic.svg#FiraSans-BlackItalic') format('svg'); font-weight: 900; font-style: italic; font-display: swap; } @font-face { font-family: 'Fira Sans'; src: url('../fonts/FiraSans/FiraSans-BlackItalic.eot'); src: url('../fonts/FiraSans/FiraSans-BlackItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/FiraSans/FiraSans-BlackItalic.woff2') format('woff2'), url('../fonts/FiraSans/FiraSans-BlackItalic.woff') format('woff'), url('../fonts/FiraSans/FiraSans-BlackItalic.ttf') format('truetype'), url('../fonts/FiraSans/FiraSans-BlackItalic.svg#FiraSans-BlackItalic') format('svg'); font-weight: 900; font-style: italic; font-display: swap; } /* ------------------------ Serifen Schrift ------------------------ */ @font-face { font-family: 'Bitter'; src: url('../fonts/Bitter/Bitter-SemiBold.eot'); src: url('../fonts/Bitter/Bitter-SemiBold.eot?#iefix') format('embedded-opentype'), url('../fonts/Bitter/Bitter-SemiBold.woff2') format('woff2'), url('../fonts/Bitter/Bitter-SemiBold.woff') format('woff'), url('../fonts/Bitter/Bitter-SemiBold.ttf') format('truetype'), url('../fonts/Bitter/Bitter-SemiBold.svg#Bitter-SemiBold') format('svg'); font-weight: 600; font-style: normal; font-display: swap; } @font-face { font-family: 'Bitter'; src: url('../fonts/Bitter/Bitter-SemiBoldItalic.eot'); src: url('../fonts/Bitter/Bitter-SemiBoldItalic.eot?#iefix') format('embedded-opentype'), url('../fonts/Bitter/Bitter-SemiBoldItalic.woff2') format('woff2'), url('../fonts/Bitter/Bitter-SemiBoldItalic.woff') format('woff'), url('../fonts/Bitter/Bitter-SemiBoldItalic.ttf') format('truetype'), url('../fonts/Bitter/Bitter-SemiBoldItalic.svg#Bitter-SemiBoldItalic') format('svg'); font-weight: 600; font-style: italic; font-display: swap; } /* ------------------------ Font Awesome - Icons ------------------------ */ @font-face { font-family: 'Font Awesome 5 Pro Regular'; font-style: normal; font-weight: 400; font-display: block; src: url("../fonts/Font_Awesome/fa-regular-400.eot"); src: url("../fonts/Font_Awesome/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("../fonts/Font_Awesome/fa-regular-400.woff2") format("woff2"), url("../fonts/Font_Awesome/fa-regular-400.woff") format("woff"), url("../fonts/Font_Awesome/fa-regular-400.ttf") format("truetype"), url("../fonts/Font_Awesome/fa-regular-400.svg#fontawesome") format("svg"); } @font-face { font-family: 'Font Awesome 5 Pro Brands'; font-style: normal; font-weight: 400; font-display: block; src: url("../fonts/Font_Awesome/fa-brands-400.eot"); src: url("../fonts/Font_Awesome/fa-brands-400.eot?#iefix") format("embedded-opentype"), url("../fonts/Font_Awesome/fa-brands-400.woff2") format("woff2"), url("../fonts/Font_Awesome/fa-brands-400.woff") format("woff"), url("../fonts/Font_Awesome/fa-brands-400.ttf") format("truetype"), url("../fonts/Font_Awesome/fa-brands-400.svg#fontawesome") format("svg"); } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- SCHRIFTARTEN ZUWEISEN ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ /* ------------------------ Serifenlose regular ------------------------ */ body, h6, .sans-serif, footer .toolbar a, footer .toolbar .cookie-set, /*h1 + h2.subheader, h2 + h3.subheader,*/ .subheader, input, optgroup, select, textarea, .badge.tag{ font-family: var(--bs-font-sans-serif); font-weight: normal; font-style: normal; font-display: swap; } .tx-kesearch-pi1, .tx-indexedsearch-stand{ font-family: var(--bs-font-sans-serif) !important; font-weight: normal; font-style: normal; font-display: swap; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-style: normal; } footer .toolbar .cookie-set {font-style:italic;} /* ------------------------ Serifenlose medium ------------------------ */ .btn, .btn-lg, .btn-small, .nav-tabs a.nav-link { font-family: var(--bs-font-sans-serif); font-weight: 500; font-style: normal; font-display: swap; } .frame-type-menu_section ul li a { font-weight: 500 !important; font-style: normal !important; } /* ------------------------ Serifenlose bold ------------------------ */ b, h5, .tx-indexedsearch-res.result-list-item .kategorie, .aufriss, .badge:not(.tag), .quelle, .mainnavigation .navbar-nav > .nav-item > .dropdown-menu a, h6, .news-slider-item .card.newstext .ce-body:before{ font-family: var(--bs-font-sans-serif); font-weight: bold; font-style: normal; font-display: swap; } /* ------------------------ Serifenlose black ------------------------ */ .owl-stage .owl-item .news-slider-item .date { font-family: var(--bs-font-sans-serif); font-weight: 900; font-style: normal; font-display: swap; } /* ------------------------ Serifenlose italic ------------------------ */ i, .zitat, blockquote, main a:not(.btn):not(.btn-lg):not(.btn-small):not(.nav-link):not(.card-link):not(.badge), footer a:not(.btn):not(.btn-lg):not(.btn-small), .more:not(.btn):not(.btn-lg), a.back:not(.btn):not(.btn-lg):not(.btn-small){ font-family: var(--bs-font-sans-serif); font-weight: normal; font-style: italic; font-display: swap; } /* ------------------------ Serifenlose bold italic ------------------------ */ .frame-type-menu_section ul li a { font-family: var(--bs-font-sans-serif); font-weight: bold; font-style: italic; font-display: swap; } /* ------------------------ Serifen semibold ------------------------ */ h1, h2, h3, h4, .h1, .h2, .h3, .h4, .serif, .startseite #hero .grid-slider .owl-item .ce-bodytext .lead, h1 a:not(.btn):not(.btn-lg):not(.btn-small), h2 a:not(.btn):not(.btn-lg):not(.btn-small), h3 a:not(.btn):not(.btn-lg):not(.btn-small), h4 a:not(.btn):not(.btn-lg):not(.btn-small), h5 a:not(.btn):not(.btn-lg):not(.btn-small), #kesearch_results .result-list-item .result-title a{ font-family: var(--bs-font-serif); font-weight: 600; font-style: normal; font-display: swap; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-family: var(--bs-font-serif) !important; font-weight: 600 !important; font-style: normal !important; font-display: swap; } /* normal */ main h1 a, main h2 a, main h3 a, main h4 a, main h5 a, main h6 a, footer h1 a, footer h2 a, footer h3 a, footer h4 a, footer h5 a, footer h6 a { font-style:normal; } /* bold */ .accordion .card-link, strong { font-weight: bold; font-style:normal; } /* ------------------------ Serifen semibold italic ------------------------ */ /* .zitat, blockquote{ font-family: var(--bs-font-serif); font-weight: 600; font-style: italic; font-display: swap; } */ /* ------------------------ Font Awesome Pro regular ------------------------ */ .more:after, .badge.tag:before{ font-family: 'Font Awesome 5 Pro Regular'; font-style: normal; font-weight: 400; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- STILVORLAGEN ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ body { color:var(--bs-body-color); font-size:var(--bs-body-font-size); line-height:var(--bs-body-line-height); min-height:480px; } /* Body nicht scrollbar wenn Navi aufgeklappt */ body.overflow-hidden { overflow:hidden; } body, html { height: 100%; margin: 0px auto; padding: 0px auto; } #wrapper { height: auto; min-height: 100%; margin: 0px auto; padding: 0px auto; position:relative; } .border { border: 1px solid var(--lines-light) !important; } .border-bottom { border-bottom: 1px solid var(--bs-body-color); padding-bottom: var(--abstand-normal); } .border-top { border-top: 1px solid var(--bs-body-color); padding-top: var(--abstand-normal); } p { margin-bottom:var(--abstand-klein); } .card p { margin-bottom:var(--abstand-ganzklein); } p:last-child, .ce-body ul:last-child, .ce-body ul:last-child li:last-child { margin-bottom:0em; } .small, small { font-size: var(--font-size-small); font-weight: 400; line-height:1.2em; } .fussnote { font-size: var(--font-size-small); margin-bottom:10px; line-height:1.2em; } .text-center { width:100%; } h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover { text-decoration:none; color:var(--bs-body-color); } .aufrisscenter {text-align:center;background-color:#f8f8f8;font-weight:bold;} .aufriss, .badge:not(.tag), .quelle, .tx-indexedsearch-res.result-list-item .kategorie, .news-slider-item .card.newstext .ce-body:before { text-transform:uppercase; letter-spacing:0.5px; line-height:1.15em; font-size:var(--font-size-small); } .aufriss, .badge:not(.tag):not(.badge-secondary):not(.badge-success):not(.badge-danger):not(.badge-info), .quelle, .tx-indexedsearch-res.result-list-item .kategorie, .news-slider-item .card.newstext .ce-body:before { color:var(--bs-body-color); } .aufriss, .quelle, .tx-indexedsearch-res.result-list-item .kategorie, .news-slider-item .card.newstext .ce-body:before { margin-bottom:var(--abstand-ganzklein) !important; } .aufriss, .badge:not(.tag), .tx-indexedsearch-res.result-list-item .kategorie, .news-slider-item .card.newstext .ce-body:before{ padding:2px 4px 2px 4px; display:inline-block; border-radius:0px; } .badge { margin-right:5px; border-radius:0px; white-space: normal; text-align:left; } .badge.tag { font-size:1em; margin-bottom:5px; } .badge.tag:before { content:var(--link-tag-icon); } .badge.tag:hover { background-color:var(--primary) !important; color:white !important; } .aufriss, .container-fluid:not(.bg-white):not(.style-1)[class*="bg-"] .card.bg-light .aufriss{ background-color:var(--light); } .bg-primary .aufriss, .bg-secondary .aufriss, .bg-light .aufriss, .bg-medium .aufriss, .bg-dark .aufriss, .bg-primary-hell .aufriss, .owl-stage .owl-item .news-slider-item .aufriss, .tx-indexedsearch-res.result-list-item .kategorie, .news-slider-item .card.newstext .ce-body:before { background-color:var(--white); } @media (min-width: 768px) and (max-width:991px) { .aufriss, .quelle { font-size:calc(var(--font-size-middle)*0.875); } } .quelle { color:var(--bs-body-color); } .highlight { background-color:yellow; } .border-bottom, .border-top { border-color:var(--bs-body-color) !important; } div:not(.card):not(.facts).border-bottom { padding-bottom:var(--abstand-normal); } div:not(.card):not(.facts).border-top { padding-top:var(--abstand-normal); } /* Aufzählungen */ ul { padding-left:1em; } dl li, ol li, ul li { margin-bottom:5px; } /* ------------ Subheader ------------ */ .subheader:after, .veranstaltungen_list_entry .event-header > :last-child:after, .news-list-item .title:last-child:after, .angaben-person.line-after-small:after, .publikation-list-item .header h4:last-child:after, .publikation-list-item .header .h4:last-child:after{ content:""; background-color:var(--lines-light); display:block; } .text-center .subheader:after, .angaben-person.line-after-small:after { margin-left:auto; margin-right:auto; } .ce-headline-right.subheader:after { margin-right:0; margin-left:auto; } h2.subheader:after, .h2.subheader:after{ margin-top:calc(var(--abstand-normal)*0.5); margin-bottom:calc(var(--abstand-normal)*0.5); width:120px; height:3px; } h3.subheader:after, .h3.subheader:after{ margin-top:calc(var(--abstand-normal)*0.5); margin-bottom:calc(var(--abstand-normal)*0.5); width:120px; height:3px; } h4.subheader:after, .h4.subheader:after{ margin-top:calc(var(--abstand-normal)*0.5); margin-bottom:calc(var(--abstand-normal)*0.5); width:120px; height:3px; } h5.subheader:after, .h5.subheader:after, .veranstaltungen_list_entry .event-header > :last-child:after, .news-list-item .title:last-child:after, .publikation-list-item .header h4:last-child:after, .publikation-list-item .header .h4:last-child:after, /* vielleicht wieder unten einkommentieren */ .veranstaltungen_list_entry h5.subheader:after, .veranstaltungen_list_entry .h5.subheader:after, .news-list-view h5.subheader:after, .news-list-view .h5.subheader:after, .veranstaltungen_list_entry .event-header > :last-child:after, .news-list-item .title:last-child:after/*, .veranstaltungen_list_entry h4:last-child:after*/{ margin-top:calc(var(--abstand-normal)*0.5); margin-bottom:calc(var(--abstand-normal)*0.5); width:45px; height:3px; } /* h5 Subheader */ /* Eventuell wieder einkommentieren .veranstaltungen_list_entry h5.subheader:after, .news-list-view h5.subheader:after, .veranstaltungen_list_entry .event-header :last-child:after, .news-list-item .title:last-child:after, .veranstaltungen_list_entry h4:last-child:after{ margin-top:calc(var(--abstand-normal)*0.35); margin-bottom:calc(var(--abstand-normal)*0.35); } */ /* Subheader-Linie bei zentrierter Headline */ .subheader.ce-headline-center:after { margin-left:auto; margin-right:auto; } h6.subheader:after, .h6.subheader:after, p.subheader:after, .angaben-person.line-after-small:after{ margin-top:calc(var(--abstand-normal)*0.5); margin-bottom:calc(var(--abstand-normal)*0.5); width:45px; height:3px; } /* Letzte Headline in Card Header kein Abstand */ /* .card header h1:last-child, .card header h2:last-child, .card header h3:last-child, .card header h4:last-child, .card header h5:last-child, .card header h6:last-child { margin-bottom:0em; } */ /* ------------ H1 ------------ */ .h1, h1{ letter-spacing: -0.015em; line-height:1.1em; display:block; } /* ---------------- H1 in Hero und Startseite ---------------- */ /* Phone */ @media (min-width: 0px) and (max-width:767px) { #hero h1 { hyphens:auto; } #hero .h1, #hero h1, .startseite h1, .startseite .h1{ font-size:2.25em; margin-bottom:16px; } } /* Tablet klein */ @media (min-width: 768px) and (max-width:991px) { #hero .h1, #hero h1, .startseite h1, .startseite .h1{ font-size:2.5em; margin-bottom:20px; } } /* Desktop klein */ @media (min-width: 992px) and (max-width:1199px) { #hero .h1, #hero h1, .startseite h1, .startseite .h1{ font-size:3.6em; margin-bottom:27px; } } /* Desktop gross */ @media (min-width: 1200px) { #hero .h1, #hero h1, .startseite h1, .startseite .h1{ font-size:3.6em; margin-bottom:27px; } } /* ---------------- H1 in Main Div Content ---------------- */ /* Phone */ @media (min-width: 0px) and (max-width:767px) { main h1 { hyphens:auto; } main .h1, main h1{ font-size:2em; margin-bottom:8px; } } /* Tablet klein */ @media (min-width: 768px) and (max-width:991px) { main .h1, main h1{ font-size:2.5em; margin-bottom:10px; } } /* Desktop klein */ @media (min-width: 992px) and (max-width:1199px) { main .h1, main h1{ font-size:3.15em; margin-bottom:17px; } } /* Desktop gross */ @media (min-width: 1200px) { main .h1, main h1{ font-size:3.15em; margin-bottom:20px; } } /* ---------------- H1 in der Veranstaltung ---------------- */ /* Phone */ @media (min-width: 0px) and (max-width:767px) { .event #hero .h1, .event #hero h1 { font-size:1.8em; hyphens:auto; } } /* Tablet klein */ @media (min-width: 768px) and (max-width:991px) { .event #hero h1, .event #hero h1 { font-size:2.25em; hyphens:auto; } } /* Desktop klein */ @media (min-width: 992px) and (max-width:1199px) { .event #hero .h1, .event #hero h1 { font-size:2.5em; hyphens:auto; } } /* Desktop gross */ @media (min-width: 1200px) { .event #hero .h1, .event #hero h1 { font-size:2.5em; hyphens:auto; } } /* ------------ H2 ------------ */ .h2, h2, .zahlen { line-height:1.1em; } .ce-bodytext h2:last-child { margin-bottom:0em; } .card h2 { margin-bottom:15px; } /* ---------------- H2 in Hero und Startseite ---------------- */ /* Phone */ @media (min-width: 0px) and (max-width:767px) { #hero .h2, #hero h2, .startseite h2, .startseite .h2, .zahlen { font-size:1.75em; } body.startseite.tagungshaus #hero h1, body.startseite.tagungshaus #hero h2{ font-size:2.25em; } #hero .h2, #hero h2, .startseite h2 { margin-bottom:10px; } /* Abstand wenn h2 direkt auf h1 folgt */ #hero h1 + h2, #hero .h1 + .h2, #hero h1 + h2.subheader, #hero .h1 + .h2.subheader, .startseite h1 + h2, .startseite .h1 + .h2, .startseite h1 + h2.subheader, .startseite .h1 + .h2.subheader{ margin-top:-10px !important; } } /* Tablet klein */ @media (min-width: 768px) and (max-width:991px) { #hero .h2, #hero h2, .startseite h2, .startseite .h2, .zahlen { font-size:2em; } body.startseite.tagungshaus #hero h1, body.startseite.tagungshaus #hero h2{ font-size:2.5em; } #hero .h2, #hero h2, .startseite h2{ margin-bottom:13px; } /* Abstand wenn h2 direkt auf h1 folgt */ #hero h1 + h2, #hero .h1 + .h2, #hero h1 + h2.subheader, #hero .h1 + .h2.subheader, .startseite h1 + h2, .startseite .h1 + .h2, .startseite h1 + h2.subheader, .startseite .h1 + .h2.subheader { margin-top:-15px !important; } } /* Desktop klein */ @media (min-width: 992px) and (max-width:1199px) { #hero .h2, #hero h2, .startseite h2, .startseite .h2, .zahlen { font-size:2.5em; } body.startseite.tagungshaus #hero h1, body.startseite.tagungshaus #hero h2{ font-size:3em; } #hero .h2, #hero h2, .startseite h2 { margin-bottom:17px; } /* Abstand wenn h2 direkt auf h1 folgt */ #hero h1 + h2, #hero .h1 + .h2, #hero h1 + h2.subheader, #hero .h1 + .h2.subheader, .startseite h1 + h2, .startseite .h1 + .h2, .startseite h1 + h2.subheader, .startseite .h1 + .h2.subheader { margin-top:-20px !important; } } /* Desktop gross */ @media (min-width: 1200px) { #hero .h2, #hero h2, .startseite h2, .startseite .h2, .zahlen { font-size:2.5em; } body.startseite.tagungshaus #hero h1, body.startseite.tagungshaus #hero h2{ font-size:3em; } #hero .h2, #hero h2, .startseite h2 { margin-bottom:17px; } /* Abstand wenn h2 direkt auf h1 folgt */ #hero h1 + h2, #hero .h1 + .h2, #hero h1 + h2.subheader, #hero .h1 + .h2.subheader, .startseite h1 + h2, .startseite .h1 + .h2, .startseite h1 + h2.subheader, .startseite .h1 + .h2.subheader { margin-top:-20px !important; } } /* ---------------- H2 in der Veranstaltung ---------------- */ /* Phone */ @media (min-width: 0px) and (max-width:767px) { .event #hero .h2, .event #hero h2 { font-size:1em; hyphens:auto; } } /* Tablet klein */ @media (min-width: 768px) and (max-width:991px) { .event #hero .h2, .event #hero h2 { font-size:1em; hyphens:auto; } } /* Desktop klein */ @media (min-width: 992px) and (max-width:1199px) { .event #hero .h2, .event #hero h2 { font-size:1.5em; } } /* Desktop gross */ @media (min-width: 1200px) { .event #hero .h2, .event #hero h2 { font-size:1.65em; } } /* ---------------- H2 in Main Div Content ---------------- */ /* Phone */ @media (min-width: 0px) and (max-width:767px) { main.h2, main h2 { font-size:1.5em; } main .h2, main h2 { margin-bottom:11px; } /* Abstand wenn h2 direkt auf h1 folgt */ main h1 + h2, main .h1 + .h2, main h1 + h2.subheader, main .h1 + .h2.subheader{ margin-top:-5px !important; } } /* Tablet klein */ @media (min-width: 768px) and (max-width:991px) { main.h2, main h2 { font-size:1.85em; } main.h2, main h2{ margin-bottom:14px; } /* Abstand wenn h2 direkt auf h1 folgt */ main h1 + h2, main .h1 + .h2, main h1 + h2.subheader, main .h1 + .h2.subheader { margin-top:-8px !important; } } /* Desktop klein */ @media (min-width: 992px) and (max-width:1199px) { main.h2, main h2 { font-size:2.35em; } main.h2, main h2 { margin-bottom:17px; } /* Abstand wenn h2 direkt auf h1 folgt */ main h1 + h2, main .h1 + .h2, main h1 + h2.subheader, main .h1 + .h2.subheader { margin-top:-13px !important; } } /* Desktop gross */ @media (min-width: 1200px) { main.h2, main h2 { font-size:2.35em; } main.h2, main h2 { margin-bottom:14px; } /* Abstand wenn h2 direkt auf h1 folgt */ main h1 + h2, main .h1 + .h2, main h1 + h2.subheader, main .h1 + .h2.subheader { margin-top:-13px !important; } } /* ---------------- H2 in der Veranstaltung ---------------- */ /* Phone */ @media (min-width: 0px) and (max-width:767px) { .event .h2, .event h2 { font-size:1.2em; } } /* Tablet klein */ @media (min-width: 768px) and (max-width:991px) { .event .h2, .event h2 { font-size:1.55em; } } /* Desktop klein */ @media (min-width: 992px) and (max-width:1199px) { .event .h2, .event h2 { font-size:1.75em; } } /* Desktop gross */ @media (min-width: 1200px) { .event .h2, .event h2 { font-size:1.75em; } } /* ------------ H3 ------------ */ .h3, h3 { line-height:1.1em; } .card h3 { margin-bottom:10px; } p + h3 { margin-top:var(--abstand-normal); } /* Phone */ @media (min-width: 0px) and (max-width:767px) { .h3, h3, .startseite .h3, .startseite h3{ font-size:1.2em; } .h3, h3, .startseite .h3, .startseite h3 { margin-bottom:12px; } /* Abstand wenn h2 direkt auf h1 folgt */ h2 + h3, .h2 + .h3, h2 + h3.subheader, .h2 + .h3.subheader{ margin-top:-8px !important; } .content > .container-fluid > .container-header:first-child h3, .content > .container-fluid .container-fluid > .container-header:first-child h3, .news-related.news-related-files h3{ margin-bottom:30px; } } /* Tablet klein */ @media (min-width: 768px) and (max-width:991px) { .h3, h3, .startseite .h3, .startseite h3{ font-size:1.5em; } .h3, h3, .startseite .h3, .startseite h3{ margin-bottom:13px; } /* Abstand wenn h2 direkt auf h1 folgt */ h2 + h3, .h2 + .h3, h2 + h3.subheader, .h2 + .h3.subheader{ margin-top:-10px !important; } .content > .container-fluid > .container-header:first-child h3, .content > .container-fluid .container-fluid > .container-header:first-child h3, .news-related.news-related-files h3{ margin-bottom:50px; } } /* Desktop klein */ @media (min-width: 992px) and (max-width:1199px) { .h3, h3, .startseite .h3, .startseite h3{ font-size:1.85em; } .h3, h3, .startseite .h3, .startseite h3{ margin-bottom:15px; } /* Abstand wenn h2 direkt auf h1 folgt */ h2 + h3, .h2 + .h3, h2 + h3.subheader, .h2 + .h3.subheader{ margin-top:-13px !important; } .content > .container-fluid > .container-header:first-child h3, .content > .container-fluid .container-fluid > .container-header:first-child h3, .news-related.news-related-files h3{ margin-bottom:50px; } } /* Desktop gross */ @media (min-width: 1200px) { .h3, h3, .startseite .h3, .startseite h3{ font-size:1.85em; } .h3, h3, .startseite .h3, .startseite h3{ margin-bottom:15px; } /* Abstand wenn h2 direkt auf h1 folgt */ h2 + h3, .h2 + .h3, h2 + h3.subheader, .h2 + .h3.subheader{ margin-top:-13px !important; } .content > .container-fluid > .container-header:first-child h3, .content > .container-fluid .container-fluid > .container-header:first-child h3, .news-related.news-related-files h3{ margin-bottom:50px; } } /* Einleitende h3 mit Linie in einem Container */ .content > .container-fluid > .container-header:first-child h3, .content > .container-fluid .container-fluid > .container-header:first-child h3, .news-related.news-related-files h3{ padding-bottom:15px; border-bottom:3px solid var(--lines-light); } /* ---------------- H3 in der Veranstaltung ---------------- */ /* Listenansicht */ /* Phone */ @media (min-width: 0px) and (max-width:767px) { .veranstaltungen_list_entry .h3, .veranstaltungen_list_entry h3 { font-size:1em; } .veranstaltungen_list_entry h3.subheader { margin-top:-5px; } } /* Tablet klein */ @media (min-width: 768px) and (max-width:991px) { .veranstaltungen_list_entry .h3, .veranstaltungen_list_entry h3 { font-size:1em; } .veranstaltungen_list_entry h3.subheader { margin-top:-7px; } } /* Desktop klein */ @media (min-width: 992px) and (max-width:1199px) { .veranstaltungen_list_entry .h3, .veranstaltungen_list_entry h3 { font-size:1em; } .veranstaltungen_list_entry h3.subheader { margin-top:-10px; } } /* Desktop gross */ @media (min-width: 1200px) { .veranstaltungen_list_entry .h3, .veranstaltungen_list_entry h3 { font-size:1em; } .veranstaltungen_list_entry h3.subheader { margin-top:-10px; } } /* ------------ H4 ------------ */ .h4, h4, .startseite .h4, .startseite h4 { line-height:1.1em; margin-bottom:10px; } p + h4 { margin-top:30px; } .card h4 { margin-bottom:10px; } /* Phone */ @media (min-width: 0px) and (max-width:767px) { .h4, h4, .startseite .h4, .startseite h4{ font-size:1.3em; } .h4, h4, .startseite .h4, .startseite h4 { margin-bottom:10px; } /* Abstand wenn h2 direkt auf h1 folgt */ h3 + h4, .h3 + .h4, h3 + h4.subheader, .h3 + .h4.subheader{ margin-top:-7px !important; } } /* Tablet klein */ @media (min-width: 768px) and (max-width:991px) { .news-list-item.veranstaltung .date, .news-list-item.veranstaltung .ort{ font-size:0.85em; } .h4, h4, .startseite .h4, .startseite h4{ font-size:1.3em; } .h4, h4, .startseite .h4, .startseite h4 { hyphens:auto; } .h4, h4, .startseite .h4, .startseite h4 { margin-bottom:12px; } /* Abstand wenn h2 direkt auf h1 folgt */ h3 + h4, .h3 + .h4, h3 + h4.subheader, .h3 + .h4.subheader { margin-top:-8px !important; } } /* Desktop klein */ @media (min-width: 992px) and (max-width:1199px) { .h4, h4, .startseite .h4, .startseite h4 { font-size:1.35em; } .h4, h4, .startseite .h4, .startseite h4 { margin-bottom:15px; } /* Abstand wenn h2 direkt auf h1 folgt */ h3 + h4, .h3 + .h4, h3 + h4.subheader, .h3 + .h4.subheader { margin-top:-10p !important; } } /* Desktop gross */ @media (min-width: 1200px) { .h4, h4, .startseite .h4, .startseite h4 { font-size: 1.5rem; } .h4, h4, .startseite .h4, .startseite h4{ margin-bottom:15px; } /* Abstand wenn h2 direkt auf h1 folgt */ h3 + h4, .h3 + .h4, h3 + h4.subheader, .h3 + .h4.subheader { margin-top:-10px !important; } } /* ---------------- H4 in Box Startseite Slider ---------------- */ .startseite .newsslider h4 { hyphens:auto; } /* ------------ H5 ------------ */ .h5, h5 { line-height:1.1em; } /* Phone */ @media (min-width: 0px) and (max-width:767px) { .h5, h5 { font-size:1em; } .h5, h5 { margin-bottom:7px; } /* Abstand wenn h2 direkt auf h1 folgt */ h4 + h5, .h4 + .h5, h4 + h5.subheader, .h4 + .h5.subheader, .veranstaltungen_list_entry .event-header a + h5 { margin-top:-6px !important; } } /* Tablet klein */ @media (min-width: 768px) and (max-width:991px) { .h5, h5 { font-size:1em; } .h5, h5 { margin-bottom:8px; } /* Abstand wenn h2 direkt auf h1 folgt */ h4 + h5, .h4 + .h5, h4 + h5.subheader, .h4 + .h5.subheader, .veranstaltungen_list_entry .event-header a + h5 { margin-top:-8px !important; } } /* Desktop klein */ @media (min-width: 992px) and (max-width:1199px) { .h5, h5 { font-size:1em; } .h5, h5 { margin-bottom:15px; } /* Abstand wenn h2 direkt auf h1 folgt */ h4 + h5, .h4 + .h5, h4 + h5.subheader, .h4 + .h5.subheader, .veranstaltungen_list_entry .event-header a + h5 { margin-top:-10px !important; } } /* Desktop gross */ @media (min-width: 1200px) { .h5, h5 { font-size:1em; } .h5, h5 { margin-bottom:15px; } /* Abstand wenn h2 direkt auf h1 folgt */ h4 + h5, .h4 + .h5, h4 + h5.subheader, .h4 + .h5.subheader, .veranstaltungen_list_entry .event-header a + h5 { margin-top:-10px !important; } } /* ------------ H6 ------------ */ .h6, h6 { line-height:1.1em; text-transform:uppercase; } /* Phone */ @media (min-width: 0px) and (max-width:767px) { .h6, h6 { font-size:1em; } .h6, h6 { margin-bottom:6px; } .ansprechpartner .h6, .ansprechpartner h6 { margin-bottom:0px; } /* Abstand wenn h2 direkt auf h1 folgt */ h5 + h6, .h5 + .h6, h5 + h6.subheader, .h5 + .h6.subheader{ margin-top:-6px !important; } } /* Tablet klein */ @media (min-width: 768px) and (max-width:991px) { .h6, h6 { font-size:1em; } .h6, h6 { margin-bottom:8px; } .ansprechpartner .h6, .ansprechpartner h6 { margin-bottom:0px; } /* Abstand wenn h2 direkt auf h1 folgt */ h5 + h6, .h5 + .h6, h5 + h6.subheader, .h5 + .h6.subheader { margin-top:-8px !important; } } /* Desktop klein */ @media (min-width: 992px) and (max-width:1199px) { .h6, h6 { font-size:1em; } .h6, h6 { margin-bottom:15px; } .ansprechpartner .h6, .ansprechpartner h6 { margin-bottom:0px; } /* Abstand wenn h2 direkt auf h1 folgt */ h5 + h6, .h5 + .h6, h5 + h6.subheader, .h5 + .h6.subheader { margin-top:-10px !important; } } /* Desktop gross */ @media (min-width: 1200px) { .h6, h6 { font-size:1em; } .h6, h6 { margin-bottom:15px; } .ansprechpartner .h6, .ansprechpartner h6 { margin-bottom:0px; } /* Abstand wenn h2 direkt auf h1 folgt */ h5 + h6, .h5 + .h6, h5 + h6.subheader, .h5 + .h6.subheader { margin-top:-10px !important; } } /* h5 Subheader */ .veranstaltungen_list_entry h5.subheader, .news-list-view h5.subheader{ font-size:1em; } /* ------------ LEAD ------------ */ .lead, .zitat, blockquote, .job.facts h5{ line-height:1.25em; } .lead.serif.head { text-transform:uppercase; line-height:1em; } .job.facts h5 { margin-bottom:0em; } /* Phone */ @media (min-width: 0px) and (max-width:767px) { .lead, .job.facts h5{ font-size:calc(var(--bs-body-font-size-plus)*0.85); } .lead.head { font-size:calc(var(--bs-body-font-size-plus)*1.35); } } /* Tablet klein */ @media (min-width: 768px) and (max-width:991px) { .lead, .job.facts h5{ font-size:calc(var(--bs-body-font-size-plus)*0.95); } .lead.head { font-size:calc(var(--bs-body-font-size-plus)*1.85); } } /* Desktop klein */ @media (min-width: 992px) and (max-width:1199px) { .lead, .job.facts h5{ font-size:calc(var(--bs-body-font-size-plus)*0.95); } .lead.head { font-size:calc(var(--bs-body-font-size-plus)*2.5); } p.lead:not(:last-child) { margin-bottom:20px; } } /* Desktop gross */ @media (min-width: 1200px) { .lead, .job.facts h5{ font-size:calc(var(--bs-body-font-size-plus)*0.95); } .lead.head { font-size:calc(var(--bs-body-font-size-plus)*2.75); } p.lead:not(:last-child) { margin-bottom:20px; } } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- LINKS ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ /* Text Deoration none */ .more.circle:hover { text-decoration:none; } a { color:var(--link); } a:hover { color:var(--linkhover); } /* ------------------------ TEXTLINKS ------------------------ */ main a:not(.btn):not(.btn-lg):not(.btn-small), header a:not(.btn):not(.btn-lg):not(.btn-small), .sprachauswahl a:not(.btn):not(.btn-lg):not(.btn-small){ color:var(--link); } main a:not(.btn):not(.btn-lg):not(.btn-small):not(.card-link):hover, header a:not(.btn):not(.btn-lg):not(.btn-small):hover, .sprachauswahl a:not(.btn):not(.btn-lg):not(.btn-small):hover{ color:var(--linkhover); text-decoration:none; } .card.bg-primary a:not(.btn):not(.btn-lg):not(.btn-small):not(.card-link):hover { color:white; } :focus-visible { outline-color: none; outline-style: none; outline-width: 0px; } main .flipper .back-side a, main .flipper .back-side a{ color:var(--bs-body-color) !important; } .bg-primary a:not(.btn) { color:var(--bs-body-color); } .bg-primary a:hover { color:var(--bs-body-color); } .bg-dark a:not(.btn), .bg-dark a:not(.btn):hover, .scrollToTop:hover{ color:var(--white) !important; } .bg-primary .bg-white a:hover, .bg-primary .bg-light a:hover, .bg-primary .bg-secondary a:hover { color:var(--linkhover); text-decoration:none; } .gradient-bg-primary-to-bg-secondary a, .gradient-bg-secondary-to-bg-dark a{ color:var(--white); } .gradient-bg-primary-to-bg-secondary a:hover, .gradient-bg-secondary-to-bg-dark a:hover{ color:var(--primary) !important; } /* ------------------------ normaler Link ------------------------ */ /* auf hellem Grund */ p a.intern, main p a:not(.btn):not(.btn-lg):not(.btn-small):not(.page-link):not(.nav-link):not(.more):not(.back):not(.extern):not([href*="http"]):not(.a.download):not(.pdf):not([class*="pdf"]):not([class*="PDF"]):not(.bio):not(.video):not(.youtube):not([href*="www.youtube"]):not(.mail):not(.email):not([href*="mailto"]):not(.tel):not(.phone):not(.telefon):not([href*="+49"]):not(.file_result) { border-bottom:1px dotted #999999; } /* auf dunklem Grund */ .bg-dark p a.intern, .bg-secondary p a.intern, main .bg-dark p a:not(.btn):not(.btn-lg):not(.btn-small):not(.page-link):not(.nav-link):not(.more):not(.back):not(.extern):not([href*="http"]):not(.a.download):not(.pdf):not([class*="pdf"]):not([class*="PDF"]):not(.bio):not(.video):not(.youtube):not([href*="www.youtube"]):not(.mail):not(.email):not([href*="mailto"]):not(.tel):not(.phone):not(.telefon):not([href*="+49"]):not(.file_result), main .bg-secondary a:not(.btn):not(.btn-lg):not(.btn-small):not(.page-link):not(.nav-link):not(.more):not(.back):not(.extern):not([href*="http"]):not(.a.download):not(.pdf):not([class*="pdf"]):not([class*="PDF"]):not(.bio):not(.video):not(.youtube):not([href*="www.youtube"]):not(.mail):not(.email):not([href*="mailto"]):not(.tel):not(.phone):not(.telefon):not([href*="+49"]):not(.file_result){ border-bottom:1px dotted var(--white); } .ansprechpartner a, .accordion .card-link, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { border-bottom:0px solid black !important; } h1 a:before, h2 a:before, h3 a:before, h4 a:before, h5 a:before, h6 a:before { content:none !important; } .newsbild a:before { content:none !important; } /* ------------------------ mit Icons ------------------------ */ /* Ohne Unterstreichung */ /* .more, .more:hover, .back, .back:hover, .extern, .extern:hover, a[href*="http"], a[href*="http"]:hover, a.download, a.download:hover, a.pdf:only-child, a.pdf:only-child:hover, a[href*=".pdf"]:only-child, a[href*=".pdf"]:only-child:hover, .bio, .bio:hover, .video, .video:hover, .youtube, .youtube:hover, a[href*="www.youtube"], a[href*="www.youtube"]:hover, .mail, .mail:hover, .email, .email:hover, a[href*="mailto"], a[href*="mailto"]:hover, .mail, .mail:hover, a.tel, a.tel:hover, a.phone, a.phone:hover, a.telefon, a.telefon:hover, a[href*="+49"], a[href*="+49"]:hover, .file_result a, .file_result a:hover { text-decoration:none; display:inline-block; border-bottom:0px solid black !important; } */ /* ------------------------ KEIN ICON ------------------------ */ .event-header a:before { content:none !important; } /* ------------------------ MORE ------------------------ */ a.more:not([href*="http"]):not([href*=".pdf"]):not([href*=".PDF"]):after, a.more:not([href*="http"]):not([href*=".pdf"]):not([href*=".PDF"]):hover:after, .more:not([href*="http"]):not([href*=".pdf"]):not([href*=".PDF"]):after, .more:not([href*="http"]):not([href*=".pdf"]):not([href*=".PDF"]):hover:after{ content:var(--link-more-icon); font-family:var(--font-awesome-regular); font-style:normal; margin-left:5px; } a.more:not([href*="http"]):not([href*=".pdf"]):not([href*=".PDF"]):before, a.more:not([href*="http"]):not([href*=".pdf"]):not([href*=".PDF"]):hover:before, .more:not([href*="http"]):not([href*=".pdf"]):not([href*=".PDF"]):before, .more:not([href*="http"]):not([href*=".pdf"]):not([href*=".PDF"]):hover:before{ display:none; } a.ohne:before {content:"" !important;} a.bluesky {font-family:arial !important;font-weight:normal;color:white !important;font-size:12px;display:inline-block;background-color:rgb(16, 131, 254);width:110px;min-width: 110px;max-width: 160px;height:30px;color:white} .soc-links {display:flex;flex-direction:row;} .soc-links .shariff, .soc-links .shariff > ul {border-width:0px;margin-top:0;min-width:350px;padding-top:0;display:inline-block !important;float:left;} @media (min-width:0px) and (max-width:767px) { .soc-links .shariff, .soc-links .shariff > ul {max-width:111px;min-width:111px;} .shariff li a, #bluesky-share-link {height: 35px;} .shariff .orientation-horizontal.button-style-standard li, #bluesky-share-link {width:35px !important;min-width:35px !important;max-width:35px !important;overflow:hidden;} #bluesky-share-link img{margin-left:1px;margin-top:px;} .soc-links .share_text { display: block !important; text-indent: -9999px !important; padding-left: 3px !important; } } @media (min-width:768px) and (max-width:1023px) { .shariff li a, #bluesky-share-link {height:35px;} main a.bluesky img {max-width:35px;} } @media (min-width:1024px) { main a.bluesky img {max-width:30px;} } #social-link-container {float:left;display:inline-block;} /* ------------------------ BACK ------------------------ */ .back:before, .back:hover:before { content:var(--link-back-icon); font-family:var(--font-awesome-regular); font-style:normal; margin-right:5px; } .back:after, .back:hover:after { display:none; } a.back:after, a.back:hover:after{ display:none; } /* ------------------------ EXTERN ------------------------ */ .extern:not(.btn):not(.btn-lg):not(.btn-small):not(.btn[href*="http"]):not(.btn-lg[href*="http"]):not(.btn-small[href*="http"]):before, .extern:not(.btn):not(.btn-lg):not(.btn-small):hover:before, a[href*="http"]:not(.btn):not(.btn-lg):not(.btn[href*="http"]):not(.btn-lg[href*="http"]):not(.btn-small[href*="http"]):not([href*="https://www.youtube.com"]):not([href*="https://www.facebook.com"]):not([href*="https://www.instagram.com"]):not([href*="https://de.linkedin.com"]):not([href*="https://twitter.com"]):not([href*="pdf"]):not([href*="PDF"]):before{ content:var(--link-extern-icon); font-family:var(--font-awesome-regular); font-style:normal; margin-right:5px; } .extern:not(.btn):not(.btn-lg):not(.btn-small):not(.btn[href*="http"]):not(.btn-lg[href*="http"]):not(.btn-small[href*="http"]):after, .extern:not(.btn):not(.btn-lg):not(.btn-small):hover:after, a[href*="http"]:not(.btn):not(.btn-lg):not(.btn[href*="http"]):not(.btn-lg[href*="http"]):not(.btn-small[href*="http"]):not([href*="https://www.youtube.com"]):not([href*="https://www.facebook.com"]):not([href*="https://www.instagram.com"]):not([href*="https://de.linkedin.com"]):not([href*="https://twitter.com"]):not([href*="pdf"]):not([href*="PDF"]):after, .ohne:after, .ohne:before { display:none; } .shariff a:before { content:""; display:none; } /* ------------------------ PDF ------------------------ */ a.download:before, a.pdf:before, a[href*=".pdf"]:before, a[href*=".PDF"]:before{ content:var(--link-download-icon); font-family:var(--font-awesome-regular); font-weight: 400; font-style:normal; display:inline-block; margin-right:8px; } a.download:after, a.pdf:after, a[href*=".pdf"]:after, a[href*=".PDF"]:after{ display:none; } a[href*=".pdf"]:after, a[href*=".pdf"]:hover:after, a[href*=".PDF"]:hover:after{ display:none; } /* ------------------------ Biografie ------------------------ */ .bio, .bio:hover { text-decoration:none; } .bio:before, .bio:hover:before { content:var(--link-vcard-icon); font-family:var(--font-awesome-regular); font-style:normal; margin-right:5px; } /* ------------------------ Video ------------------------ */ main a.video:before, main a.youtube:before, main a[href*="www.youtube"]:before { content:var(--link-youtube-icon); font-family: 'Font Awesome 5 Pro Brands'; font-weight: 400; font-style:normal; display:inline-block; margin-right:5px; color:red; } /* ------------------------ E-Mail ------------------------ */ a.mail:before, a.email:before, a[href*="mailto"]:before, span.mail:before, a[data-mailto-vector="1"]:before{ content:var(--link-mail-icon); font-family:var(--font-awesome-regular); font-weight: 400; font-style:normal; display:inline-block; margin-right:5px; } p.email { margin-bottom:0em; } /* ------------------------ Telefon ------------------------ */ .content a.tel:before, .content a.phone:before, .content a.telefon:before, .content a[href*="+49"]:before { content:var(--link-phone-icon); font-family:var(--font-awesome-regular); font-weight: 400; font-style:normal; display:inline-block; margin-right:5px; } p.phone { margin-bottom:0em; } /* andere Spans mit Icon */ span.orttext {padding-left: 8px;} span.uhrzeittext {padding-left: 3px;} .telefon:before, .fax:before, .ort:before, .datum:before, .uhrzeit:before, .information:before{ margin-right:5px; font-family:var(--font-awesome-regular); font-weight: 400; font-style:normal; display:inline-block; margin-right:5px; } .telefon:before { content:var(--link-phone-icon); } .fax:before { content:var(--link-fax-icon); } .ort:before { content:var(--link-ort-icon); } .datum:before { content:var(--link-datum-icon); } .uhrzeit:before { content:var(--link-uhrzeit-icon); } .information:before { content:var(--link-information-icon); } figure.image a:before { content:none !important; } /* ------------------------ BUTTONS ------------------------ */ .btn, .btn-lg { font-size:1rem; } .btn, .btn-lg, .btn-small{ border-radius: 0rem; position:relative; text-transform: uppercase; letter-spacing:0.025em; } .btn:hover, .btn.hover, .btn-lg:hover, .btn-lg.hover, .btn-small:hover, .btn-small.hover, .btn:focus, .btn.focus, .btn-lg:focus, .btn-lg.focus, .btn-small:focus, .btn-small.focus{ text-decoration:none !important; box-shadow:none !important; } .btn { padding: .375rem .75rem; display:inline-block; } .btn-lg { padding: 0.75rem 1.25rem; display:inline-block; } .btn-small { padding: 2px 4px 2px 4px; font-size:calc(var(--font-size-small) *0.9); line-height:1em; } .btn:not([href*="http"]):not([href*=".pdf"]):not([href*=".PDF"]):after, .btn:not([href*="http"]):not([href*=".pdf"]):not([href*=".PDF"]):hover:after, .btn-lg:not([href*="http"]):not([href*=".pdf"]):not([href*=".PDF"]):after, .btn-lg:not([href*="http"]):not([href*=".pdf"]):not([href*=".PDF"]):hover:after{ content:var(--link-more-icon); font-family:var(--font-awesome-regular); margin-left:5px; } /* Pfeil als Hintergrundbild */ .bg-primary input.btn-primary { background-image:url(../images/icons/pfeil-next-white.svg); } input.btn:not([type="submit"]):not(.tx-indexedsearch-searchbox-button) { background-image:url(../images/icons/pfeil-next-black.svg); background-position-x: calc(100% - 10px); background-position-y:center; background-repeat:no-repeat; background-size:16px; } input.btn:not([type="submit"]):not(.tx-indexedsearch-searchbox-button):hover { background-image:url(../images/icons/pfeil-next-white.svg); background-position-x: calc(100% - 10px); background-position-y:center; background-repeat:no-repeat; background-size:16px; } .btn-default{ color: var(--bs-body-color); background-color: var(--light); border-color: var(--light); } .bg-default .btn-default { color: var(--bs-body-color); background-color: var(--white); border-color: var(--white); } .btn-default:hover, .bg-default .btn-default:hover, .bg-default .btn-default:focus { color: var(--white); background-color: var(--bs-body-color); border-color: var(--bs-body-color); } .btn-primary{ color: var(--bs-body-color); background-color: var(--primary); border-color: var(--primary); } .bg-primary .btn-primary { color: var(--bs-body-color); background-color: var(--white); border-color: var(--white); } .bg-dark .btn-primary:hover, .bg-dark .btn-primary:focus, .bg-dark .btn-primary:focus, .bg-dark .btn-primary.focus{ color: var(--bs-body-color); background-color: var(--white); border-color: var(--white); } .btn-primary:hover, .bg-primary .btn-primary:hover, .bg-primary .btn-primary:focus { color: var(--white); background-color: var(--bs-body-color); border-color: var(--bs-body-color); } .btn-primary.focus, .btn-primary:focus { color: var(--white); background-color: var(--bs-body-color); border-color: var(--bs-body-color); box-shadow: 0 0 0 .2rem rgba(38, 143, 255, .5) } .btn-primary.disabled, .btn-primary:disabled { color: var(--white); background-color: var(--bs-body-color); border-color: var(--bs-body-color); } .btn-secondary { color: var(--white); background-color: var(--secondary); border-color: var(--secondary) } .btn-secondary:hover { color: var(--white); background-color: var(--bs-body-color); border-color: var(--bs-body-color); } .btn-secondary.focus, .btn-secondary:focus { color: var(--white); background-color: var(--bs-body-color); border-color: var(--bs-body-color); box-shadow: 0 0 0 .2rem rgba(130, 138, 145, .5) } .btn-secondary.disabled, .btn-secondary:disabled { color: var(--white); background-color: var(--bs-body-color); border-color: var(--bs-body-color); } .btn-success { color: #fff; background-color: var(--success); border-color: var(--success) } .btn-success:hover { color: #fff; background-color: var(--success-hover); border-color: var(--success-hover); } .btn-success.focus, .btn-success:focus { color: #fff; background-color: var(--success-hover); border-color: var(--success-hover); box-shadow: 0 0 0 .2rem rgba(72, 180, 97, .5) } .btn-success.disabled, .btn-success:disabled { color: #fff; background-color: var(--success); border-color: var(--success); } .btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active, .show > .btn-success.dropdown-toggle { color: #fff; background-color: #1e7e34; border-color: #1c7430 } .btn-success:not(:disabled):not(.disabled).active:focus, .btn-success:not(:disabled):not(.disabled):active:focus, .show > .btn-success.dropdown-toggle:focus { box-shadow: 0 0 0 .2rem rgba(72, 180, 97, .5) } .btn-outline-primary { border:1px solid var(--primary); color:var(--bs-body-color); } .btn-outline-primary:hover { border:1px solid var(--primary); background-color:var(--primary); color:var(--bs-body-color); } .btn-outline-dark { border:1px solid var(--dark); } .btn-outline-dark:hover { border:1px solid var(--primary); background-color:var(--primary); color:var(--bs-body-color); } span.weiss .btn-outline-dark, span.weiss .btn-outline-primary{ border:1px solid var(--white); color:var(--white); } /* Button mit einem Plus */ .btn.plus:after, .btn.plus:hover:after{ content:var(--link-plus-icon) !important; font-family:var(--font-awesome-regular) !; margin-left:5px !important; } /* Buttons im Footer und in Mobile-Nav */ footer .btn-outline-primary, .navbar-collapse .btn-outline-primary { border:1px solid var(--primary); -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; } footer .btn-outline-primary{ color:white; } footer .btn-outline-primary:after, footer .btn-outline-primary:hover:after, .navbar-collapse .btn-outline-primary:after{ display:none; } footer .btn, .navbar-collapse .btn{ margin-right:10px; } .footer-top a.btn, .navbar-collapse a.btn{ padding: .375rem .75rem; } .footer-top a.btn, .footer-bottom a.btn, .navbar-collapse a.btn{ font-size:calc(var(--font-size-small) *0.9); padding:2px 10px 2px 10px; } .footer-top a.btn { margin-bottom:5px; } /* Abstand Buttons Tagungshäuser im Footer */ footer .tagungshaueser .btn + .btn { margin-top:10px; } /* ------------------------ Datei-Uploads-Liste ------------------------ */ @media (min-width:992px) { .ce-uploads { width:100%; column-count: 2; column-gap: 30px; } } .ce-uploads li { margin: 0em 0em var(--abstand-ganzklein) 0em; } .ce-uploads li a:before { position:absolute; } .ce-uploads span, .news-related-files-link span{ display: inline-block; margin-left: 25px; } .ce-uploads .ce-uploads-filesize, .news-related-files-size{ font-size:var(--font-size-small); display:block; margin-top:2px; color:var(--gray); } .ce-uploads .ce-uploads-filesize:before, .news-related-files-size:before{ content:"Dateigröße: "; } .news-related ul { list-style: none; padding-left: 0; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- FARBEN ZUWEISEN ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ .bg-primary, .badge-primary { background-color:var(--primary) !important; color:var(--bs-body-color); } .text-primary { color:var(--primary) !important; } .badge-primary-outline { border:1px solid var(--primary); background-color:transparent; } .bg-primary-hell, .badge-primary-hell { background-color:var(--primary-hell) !important; color:var(--bs-body-color); } .text-primary-hell { color:var(--primary-hell) !important; } .bg-secondary, .badge-secondary{ background-color:var(--secondary) !important; color:var(--white); } .bg-secondary a { color:var(--white); } .text-secondary { color:var(--secondary) !important; } .bg-light, .badge-light { background-color:var(--light) !important; color:var(--bs-body-color); } /* wenn auf grau dann nicht grau */ .container-fluid:not(.bg-white):not(.style-1)[class*="bg-"] .card.bg-light{ background-color:var(--white) !important; color:var(--bs-body-color); } .text-light { color:var(--light) !important; } .bg-medium, .badge-medium { background-color:var(--medium); } .text-medium { color:var(--medium); } .bg-dark:not(.style-1):not(.style-2), .badge-dark{ background-color:var(--dark) !important; color:var(--white); } .text-dark { color:var(--dark) !important; } .gradient-bg-primary-to-bg-secondary { background: linear-gradient(0deg, rgba(var(--secondary-rgb),1) 30%, rgba(var(--primary-rgb),1) 100%); } .gradient-bg-primary-to-bg-secondary, .gradient-bg-primary-to-bg-secondary a { color:var(--white) !important; } .gradient-bg-secondary-to-bg-dark { background: linear-gradient(0deg, rgba(var(--dark-rgb),1) 30%, rgba(var(--secondary-rgb),1) 100%); } .gradient-bg-secondary-to-bg-dark, .gradient-bg-secondary-to-bg-dark a{ color:var(--white) !important; } .bg-gray, .badge-gray{ background-color:var(--gray) !important; color:var(--white); } .text-gray { color:var(--gray) !important; } .bg-gray-dark, .badge-gray-dark{ background-color:var(--gray-dark) !important; color:var(--white); } .text-gray-dark { color:var(--gray-dark) !important; } .bg-white, .badge-white{ background-color:var(--white) !important; color:var(--bs-body-color); } .text-white{ color:var(--white) !important; } body.standard #hero, body.linktree #hero{ color:var(--white); } .text-danger { color:var(--danger) !important; } .text-success { color:var(--success) !important; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- ABSTÄNDE ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ /* Small devices (landscape phones, 576px and up) */ @media (min-width: 0px) and (max-width:767px) { main .content > .container-fluid, main .content > .frame-type-shortcut > .ce-body > .container-fluid, .event main .content .crieventsingle > .container-fluid, main .container-fluid[class*="backgroundimage"], main .content > .meta > .container-fluid { padding-top:var(--section-phone-padding); padding-bottom:var(--section-phone-padding); } main .content > .container-fluid:not([class*="bg"]) + .container-fluid[class*="bg"][class*="style-1"], main .content > .container-fluid[class*="bg"][class*="style-1"] + .container-fluid:not([class*="bg"]){ margin-top:-40px; } main .news-related.news-related-files { margin-top:var(--section-phone-padding) !important; margin-bottom:var(--section-phone-padding) !important; } main .news-list-view.templatelayout-20 .news-list-item, main .news-list-view.templatelayout-30 .news-list-item, main .news-list-view.templatelayout-40 .news-list-item, main .frame-type-menu_abstract .flip-container, main .frame-type-menu_section { margin-bottom:var(--abstand-normal); } main div[class*="col-"] + div[class*="col-"]:not(.newstext):not(.button-erweitert), main .col-md-4 + .col-md-4, main .news.news-single .col-md-8 + .col-md-4, main .content > .container-fluid > .container > div + div, main .container > div + div { margin-top:var(--abstand-klein); } main .no-gutters > .row > div + div, .col-lg-3.col-6:nth-child(2) { margin-top:0em !important; } main .templatelayout-30 .newstext .col-md-10, .veranstaltungen_list_entry div[class*="col-"] + div[class*="col-"] { margin-top:0em !important; } main .news-search-result.templatelayout-30 .news-list-item, main div[class*="col-"]:not(.flex-row) > div:not(:last-child), main .news-list-view.templatelayout- .news-list-item { margin-bottom:var(--abstand-klein); } } /* Medium devices (tablets, 768px and up) */ @media (min-width: 768px) and (max-width: 991px){ main .content > .container-fluid, main .content > .frame-type-shortcut > .ce-body > .container-fluid, .event main .content .crieventsingle > .container-fluid, main .container-fluid[class*="backgroundimage"], main .content > .meta > .container-fluid { padding-top:var(--section-tablet-padding); padding-bottom:var(--section-tablet-padding); } main .content > .container-fluid:not([class*="bg"]) + .container-fluid[class*="bg"][class*="style-1"], main .content > .container-fluid[class*="bg"][class*="style-1"] + .container-fluid:not([class*="bg"]){ margin-top:-60px; } main .no-gutters > .row > div + div { margin-top:0em !important; } main .news-related.news-related-files { margin-top:var(--section-tablet-padding) !important; margin-bottom:var(--section-tablet-padding) !important; } /*.col-md-6 > div + div,*/ main .content > .container-fluid > .container > div + div, main .container > div + div, main .col-md-12:not(.vcard) + .col-md-12:not(.vcard), /*main div[class*="grid-"]:not([class*="backgroundimage-"]):not([class*="bg-"]) + div[class*="grid-"]:not([class*="backgroundimage-"]):not([class*="bg-"]),*/ .col-lg-3.col-md-6:nth-child(3), .col-lg-3.col-md-6:nth-child(4), .col-lg-4.col-md-12:not(:first-child), .col-md-6 > div + div, .col-md-12 > div + div, main .col-lg-4:not([class*="-md-"]) { margin-top:var(--abstand-normal); } main .news-list-view.templatelayout-40 .news-list-item, main .news-search-result.templatelayout-30 .news-list-item, main .frame-type-menu_abstract .flip-container, main .col-lg-4.d-md-none, main .news-list-view.templatelayout- .news-list-item, main div[class*="col-"] > .card:not(:last-child) main .col-lg-4:not([class*="-md-"]){ margin-bottom:var(--abstand-normal); } main .news-list-view.templatelayout-20 .news-list-item, main .news-list-view.templatelayout-30 .news-list-item { margin-bottom:var(--abstand-gross); } } /* Medium devices (tablets, 768px and up) */ @media (min-width: 992px) and (max-width: 1199px){ main .content > .container-fluid, main .content > .frame-type-shortcut > .ce-body > .container-fluid, .event main .content .crieventsingle > .container-fluid, main .container-fluid[class*="backgroundimage"], main .content > .meta > .container-fluid { padding-top:var(--section-tablet-padding); padding-bottom:var(--section-tablet-padding); } main .content > .container-fluid:not([class*="bg"]) + .container-fluid[class*="bg"][class*="style-1"], main .content > .container-fluid[class*="bg"][class*="style-1"] + .container-fluid:not([class*="bg"]){ margin-top:-60px; } main .no-gutters > .row > div + div { margin-top:0em !important; } main .news-related.news-related-files { margin-top:var(--section-tablet-padding) !important; margin-bottom:var(--section-tablet-padding) !important; } /*.col-md-6 > div + div,*/ main .content > .container-fluid > .container > div + div, main .container > div + div, main .col-lg-12:not(.vcard) + .col-md-lg:not(.vcard), /*main div[class*="grid-"]:not([class*="backgroundimage-"]):not([class*="bg-"]) + div[class*="grid-"]:not([class*="backgroundimage-"]):not([class*="bg-"]),*/ .col-lg-3.col-lg-6:nth-child(3), .col-lg-3.col-lg-6:nth-child(4), .col-lg-4.col-lg-12:not(:first-child):not([id*="teaser-"]), .col-lg-6 > div + div, .col-lg-12 > div + div, main .col-lg-4:not([class*="-md-"]) { margin-top:var(--abstand-normal); } main .news-list-view.templatelayout-40 .news-list-item, main .news-search-result.templatelayout-30 .news-list-item, main .frame-type-menu_abstract .flip-container, main .col-lg-4.d-md-none, main .news-list-view.templatelayout- .news-list-item, main div[class*="col-"] > .card:not(:last-child) main .col-lg-4:not([class*="-lg-"]){ margin-bottom:var(--abstand-normal); } main .news-list-view.templatelayout-20 .news-list-item, main .news-list-view.templatelayout-30 .news-list-item { margin-bottom:var(--abstand-gross); } } @media (min-width: 0px) { .frame-space-before-extra-small { margin-top:var(--abstand-ganzklein); } .frame-space-after-extra-small { margin-bottom:var(--abstand-ganzklein); } .frame-space-before-small { margin-top:var(--abstand-klein); } .frame-space-after-small { margin-bottom:var(--abstand-klein); } .frame-space-before-medium { margin-top:var(--abstand-mittel); } .frame-space-after-medium { margin-bottom:var(--abstand-mittel); } .frame-space-before-large { margin-top:var(--abstand-gross); } .frame-space-after-large { margin-bottom:var(--abstand-gross); } .frame-space-before-extra-large { margin-top:var(--abstand-ganzgross); } .frame-space-after-extra-large { margin-bottom:var(--abstand-ganzgross); } main .content > .container-fluid > .container > div + div, main .container > div + div, main .col-lg-12:not([id*="teaser"]) + .col-lg-12:not([id*="teaser"]) { margin-top:var(--abstand-normal); } main .news-list-view.templatelayout-20 .news-list-item, main .news-list-view.templatelayout-30 .news-list-item, main .news-list-view.templatelayout-40 .news-list-item, main .news-search-result.templatelayout-30 .news-list-item{ margin-bottom:var(--abstand-gross); } main .news-list-view.templatelayout- .news-list-item, main div[class*="col-"]:not(.flex-row) > .card:not(:last-child), main div[class*="col-"]:not(.flex-row) > div:not(:last-child), main .frame-type-menu_abstract .card, main .frame-type-menu_abstract .flip-container{ margin-bottom:var(--abstand-normal); } main .content > .container-fluid:not([class*="bg"]) + .container-fluid[class*="bg"][class*="style-1"], main .content > .container-fluid[class*="bg"][class*="style-1"] + .container-fluid:not([class*="bg"]){ margin-top:-90px; } main .news-related.news-related-files { margin-top:var(--section-desktop-padding) !important; margin-bottom:var(--section-desktop-padding) !important; } } /* X-Large devices (large desktops, 1200px and up) */ @media (min-width: 1200px) { main .content > .container-fluid, main .content > .frame-type-shortcut > .ce-body > .container-fluid, .event main .content .crieventsingle > .container-fluid, main .container-fluid[class*="backgroundimage"], main .content > .meta > .container-fluid { padding-top:var(--section-bigdesktop-padding); padding-bottom:var(--section-bigdesktop-padding); } main .content > .container-fluid:not([class*="bg"]) + .container-fluid[class*="bg"][class*="style-1"], main .content > .container-fluid[class*="bg"][class*="style-1"] + .container-fluid:not([class*="bg"]){ margin-top:-90px; } main .no-gutters > .row > div + div { margin-top:0em !important; } main .news-related.news-related-files { margin-top:var(--section-bigdesktop-padding) !important; margin-bottom:var(--section-bigdesktop-padding) !important; } main .news-list-view.templatelayout-20 .news-list-item, main .news-list-view.templatelayout-30 .news-list-item, main .news-list-view.templatelayout-40 .news-list-item, main .news-search-result.templatelayout-30 .news-list-item { margin-bottom:var(--abstand-ganzgross); } } /* Wenn zwei transparente Container aufeinander folgen */ main .content > .container-fluid:not([class*="bg"]) + .container-fluid:not([class*="bg"]), .crieventsingle > .container-fluid:not([class*="bg"]) + .container-fluid:not([class*="bg"]), main .content > .meta > .container-fluid[class*="bg-white"]:first-child{ padding-top:0em; } /* Wenn zwei Container mit Style-Angabe aufeinander folgen */ @media (min-width:0px) and (max-width:991px) { main .content > .container-fluid[class*="bg-"].style-1 + .container-fluid[class*="bg-"].style-1 { padding-top:0em; } } main .content > .container-fluid .container-fluid > .container-header:first-child { padding-left:0em !important; padding-right:0em !important; } /* Kiribati Klassen formatiert */ .details_tninfo + .details_tninfo { margin-top:var(--abstand-normal); } .tninfo_titel, .absatz.titel{ font-family: var(--bs-font-sans-serif); font-weight: bold; font-style: normal; font-display: swap; } .tninfo_titel, .absatz.titel { display:block; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- FLEX LAYOUT ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ div[class*="col-"].d-flex, div[class*="col-"].d-flex[class*="justify-"] > div, div[class*="col-"].d-flex[class*="align-"] > div, div[class*="col-"].d-flex[class*="ms-flex-"] > div{ /* Iris hat hier important bei ausgeblendet */ display: -ms-flexbox; display: flex; flex-direction:column; } @media (min-width:0px) and (max-width:575px) { .d-flex.d-none.d-sm-block, .d-flex.d-none.d-md-block, .d-flex.d-none.d-lg-block, .d-flex.d-none.d-xl-block, .d-flex.d-none.d-xxl-block{ display:none !important; } } @media (min-width:576px) and (max-width:767px) { div[class*="col-"].d-flex[class*="justify-"][class*="d-none-"][class*="sm-block"] > div, div[class*="col-"].d-flex[class*="align-"][class*="d-none-"][class*="sm-block"] > div, div[class*="col-"].d-flex[class*="ms-flex-"][class*="d-none-"][class*="sm-block"] > div{ display:flex !important; } } @media (min-width:768px) and (max-width:991px) { div[class*="col-"].d-flex[class*="justify-"][class*="d-none-"][class*="sm-block"] > div, div[class*="col-"].d-flex[class*="align-"][class*="d-none-"][class*="sm-block"] > div, div[class*="col-"].d-flex[class*="ms-flex-"][class*="d-none-"][class*="sm-block"] > div, div[class*="col-"].d-flex[class*="justify-"][class*="d-none-"][class*="md-block"] > div, div[class*="col-"].d-flex[class*="align-"][class*="d-none-"][class*="md-block"] > div, div[class*="col-"].d-flex[class*="ms-flex-"][class*="d-none-"][class*="md-block"] > div{ display:flex !important; } } @media (min-width:992px) and (max-width:1199px) { div[class*="col-"].d-flex[class*="justify-"][class*="d-none-"][class*="sm-block"] > div, div[class*="col-"].d-flex[class*="align-"][class*="d-none-"][class*="sm-block"] > div, div[class*="col-"].d-flex[class*="ms-flex-"][class*="d-none-"][class*="sm-block"] > div, div[class*="col-"].d-flex[class*="justify-"][class*="d-none-"][class*="md-block"] > div, div[class*="col-"].d-flex[class*="align-"][class*="d-none-"][class*="md-block"] > div, div[class*="col-"].d-flex[class*="ms-flex-"][class*="d-none-"][class*="md-block"] > div, div[class*="col-"].d-flex[class*="justify-"][class*="d-none-"][class*="lg-block"] > div, div[class*="col-"].d-flex[class*="align-"][class*="d-none-"][class*="lg-block"] > div, div[class*="col-"].d-flex[class*="ms-flex-"][class*="d-none-"][class*="lg-block"] > div{ display:flex !important; } } @media (min-width:1200px){ div[class*="col-"].d-flex[class*="justify-"][class*="d-none-"][class*="sm-block"] > div, div[class*="col-"].d-flex[class*="align-"][class*="d-none-"][class*="sm-block"] > div, div[class*="col-"].d-flex[class*="ms-flex-"][class*="d-none-"][class*="sm-block"] > div, div[class*="col-"].d-flex[class*="justify-"][class*="d-none-"][class*="md-block"] > div, div[class*="col-"].d-flex[class*="align-"][class*="d-none-"][class*="md-block"] > div, div[class*="col-"].d-flex[class*="ms-flex-"][class*="d-none-"][class*="md-block"] > div, div[class*="col-"].d-flex[class*="justify-"][class*="d-none-"][class*="lg-block"] > div, div[class*="col-"].d-flex[class*="align-"][class*="d-none-"][class*="lg-block"] > div, div[class*="col-"].d-flex[class*="ms-flex-"][class*="d-none-"][class*="lg-block"] > div, div[class*="col-"].d-flex[class*="justify-"][class*="d-none-"][class*="xl-block"] > div, div[class*="col-"].d-flex[class*="align-"][class*="d-none-"][class*="xl-block"] > div, div[class*="col-"].d-flex[class*="ms-flex-"][class*="d-none-"][class*="xl-block"] > div{ display:flex !important; } } div[class*="col-"].d-flex[class*="justify-"] > div:last-child, div[class*="col-"].d-flex[class*="align-"] > div:last-child, div[class*="col-"].d-flex[class*="ms-flex-"] > div:last-child { flex-direction:row; flex-wrap:wrap; } div[class*="col-"].d-flex[class*="justify-"] > .frame-type-image:last-child, div[class*="col-"].d-flex[class*="align-"] > .frame-type-image:last-child, div[class*="col-"].d-flex[class*="ms-flex-"] > .frame-type-image:last-child{ flex-direction:column; flex-wrap:wrap; } /* div[class*="col-"].d-flex { align-content: flex-start; } */ /* :not(.align-content-center) hinzugefügt bei allen punkten */ div[class*="col-"].d-flex:not(.align-content-center) > div:only-child:not(.flip-container):not(.quadrat), main div[class*="col-"].d-flex:not(.align-content-center) .frame-type-list, div[class*="col-"].d-flex:not(.align-content-center) .frame-type-list .ce-body, div[class*="col-"].d-flex:not(.align-content-center) .frame-type-list .ce-body .tx-ttaddress, div[class*="col-"].d-flex:not(.align-content-center) .frame-type-list .ce-body .tx-ttaddress .tt_address_list, div[class*="col-"].d-flex:not(.align-content-center) .frame-type-list .ce-body .tx-ttaddress .tt_address_list .row, div[class*="col-"].d-flex:not(.align-content-center) > .frame-type-html > .ce-body, div[class*="col-"].d-flex:not(.align-content-center) > .frame-type-html > .ce-body > .card, div[class*="col-"].d-flex:not(.align-content-center) > .frame-type-shortcut > .ce-body, div[class*="col-"].d-flex:not(.align-content-center) > .frame-type-shortcut > .ce-body > .card, div[class*="col-"].d-flex:not(.align-content-center) > .news-list-item.veranstaltung .card .ce-body, div[class*="col-"].d-flex > .grid-2col, div[class*="col-"].d-flex > .grid-2col .content-item, div[class*="col-"].d-flex > .grid-2col .content-item .row { height:100%; } /* Iris 13. Juni 2023 ganz neu */ /* Infoboxen alle gleich hoch und Inhalte ausgerichtet - Link ganz unten */ /* div[class*="col-"].d-flex > .card.imgorient-7, div[class*="col-"].d-flex > .card.imgorient-7 .ce-body, div[class*="col-"].d-flex > .card.imgorient-7 .ce-body .ce-textpic .ce-textcontent, div[class*="col-"].d-flex > .frame-type-shortcut > .ce-body > .card.imgorient-7, div[class*="col-"].d-flex > .frame-type-shortcut > .ce-body > .card.imgorient-7 .ce-body, div[class*="col-"].d-flex > .frame-type-shortcut > .ce-body > .card.imgorient-7 .ce-body .ce-textpic .ce-textcontent{ height: 100%; display: flex; } div[class*="col-"].d-flex > .card.imgorient-7 .ce-body .ce-textpic, div[class*="col-"].d-flex > .card.imgorient-7 .ce-body .ce-textpic .ce-textcontent, div[class*="col-"].d-flex > .frame-type-shortcut > .ce-body > .card.imgorient-7 .ce-body .ce-textpic, div[class*="col-"].d-flex > .frame-type-shortcut > .ce-body > .card.imgorient-7 .ce-body .ce-textpic .ce-textcontent{ display: flex; flex-direction: column; } div[class*="col-"].d-flex > .card.imgorient-7 .ce-body .ce-textpic .ce-textcontent, div[class*="col-"].d-flex > .card.imgorient-7 .ce-body .ce-textpic .ce-textcontent .ce-bodytext, div[class*="col-"].d-flex > .frame-type-shortcut > .ce-body > .card.imgorient-7 .ce-body .ce-textpic .ce-textcontent, div[class*="col-"].d-flex > .frame-type-shortcut > .ce-body > .card.imgorient-7 .ce-body .ce-textpic .ce-textcontent .ce-bodytext{ height:100%; } div[class*="col-"].d-flex > .card.imgorient-7 .ce-body .ce-textpic, div[class*="col-"].d-flex > .card.imgorient-7 .ce-body .ce-textpic .ce-gallery, div[class*="col-"].d-flex > .card.imgorient-7 .ce-body .ce-textpic .ce-textpic, div[class*="col-"].d-flex > .frame-type-shortcut > .ce-body > .card.imgorient-7 .ce-body .ce-textpic, div[class*="col-"].d-flex > .frame-type-shortcut > .ce-body > .card.imgorient-7 .ce-body .ce-textpic .ce-gallery, div[class*="col-"].d-flex > .frame-type-shortcut > .ce-body > .card.imgorient-7 .ce-body .ce-textpic .ce-textpic{ overflow: inherit; } */ /* Card Content gestreckt auf 100% und Inhalt Space between */ .menu-item-abstract.card.bg-light .ce-body, /* div[class*="col-"].d-flex > .card.imgorient-7 .ce-body .ce-textpic .ce-textcontent .ce-bodytext, */ div[class*="col-"].d-flex > .news-list-item.veranstaltung .card .ce-body, div[class*="col-"].d-flex > .frame-type-shortcut > .ce-body > .card.imgorient-7 .ce-body .ce-textpic .ce-textcontent .ce-bodytext{ height: 100%; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; } /* .d-flex:not([class*="justify-"]) > div{ width:100%; } */ div[class*="col-"].d-flex.align-items-start > div, div[class*="col-"].d-flex.align-items-start > .frame-type-image .ce-body { -ms-flex-align: flex-start !important; align-items: flex-start !important; } div[class*="col-"].d-flex.align-items-center > div, div[class*="col-"].d-flex.align-items-center > .frame-type-image .ce-body { -ms-flex-align: center !important; align-items: center !important; } div[class*="col-"].d-flex.align-items-end > div, div[class*="col-"].d-flex.align-items-end > .frame-type-image .ce-body { -ms-flex-align: flex-end !important; align-items: flex-end !important; } div[class*="col-"].d-flex.align-content-start > div, div[class*="col-"].d-flex.align-content-start > .frame-type-image .ce-body { -ms-flex-line-pack: flex-start !important; align-content: flex-start !important; } div[class*="col-"].d-flex.align-content-center > div, div[class*="col-"].d-flex.align-content-center > .frame-type-image .ce-body { -ms-flex-line-pack: center !important; align-content: center !important; } div[class*="col-"].d-flex.align-content-end > div, div[class*="col-"].d-flex.align-content-end > .frame-type-image .ce-body { -ms-flex-line-pack: flex-end !important; align-content: flex-end !important; } div[class*="col-"].d-flex.justify-items-start > div, div[class*="col-"].d-flex.justify-items-start > .frame-type-image .ce-body { -ms-flex-justify: flex-start !important; justify-items: flex-start !important; } div[class*="col-"].d-flex.justify-items-center > div, div[class*="col-"].d-flex.justify-items-center > .frame-type-image .ce-body { -ms-flex-justify: center !important; justify-items: center !important; } div[class*="col-"].d-flex.justify-items-end > div, div[class*="col-"].d-flex.justify-items-end > .frame-type-image .ce-body { -ms-flex-justify: flex-end !important; justify-items: flex-end !important; } div[class*="col-"].d-flex.justify-content-start > div, div[class*="col-"].d-flex.justify-content-start > .frame-type-image .ce-body { -ms-flex-pack: flex-start !important; justify-content: flex-start !important; } div[class*="col-"].d-flex.justify-content-center > div, div[class*="col-"].d-flex.justify-content-center > .frame-type-image .ce-body { -ms-flex-pack: center !important; justify-content: center !important; } div[class*="col-"].d-flex.justify-content-end > div, div[class*="col-"].d-flex.justify-content-end > .frame-type-image .ce-body { -ms-flex-pack: flex-end !important; justify-content: flex-end !important; } /* Wenn etwas rechtsbündig angeordnet ist wird es bei 100% Breite linksbündig */ @media (min-width:0px) and (max-width:991px) { div[class*="col-md-12"].d-flex.justify-content-end > div, div[class*="col-md-12"].d-flex.justify-content-end > .frame-type-image .ce-body { -ms-flex-pack: flex-start !important; justify-content: flex-start !important; } } /* ------------------------ Spalten ausblenden ------------------------ */ @media (min-width:0px) and (max-width:575px) { .d-flex.d-none.d-sm-block, .d-flex.d-none.d-md-block, .d-flex.d-none.d-lg-block, .d-flex.d-none.d-xl-block, .d-flex.d-none.d-xxl-block{ display:none !important; } } @media (min-width:576px) and (max-width:767px) { .d-flex.d-none.d-md-block, .d-flex.d-none.d-lg-block, .d-flex.d-none.d-xl-block, .d-flex.d-none.d-xxl-block{ display:none !important; } .d-flex.d-none.d-sm-block { display:flex !important; } } @media (min-width:768px) and (max-width:991px) { .d-flex.d-none.d-lg-block, .d-flex.d-none.d-xl-block, .d-flex.d-none.d-xxl-block{ display:none !important; } .d-flex.d-none.d-sm-block, .d-flex.d-none.d-md-block{ display:flex !important; } } @media (min-width:992px) and (max-width:1199px) { .d-flex.d-none.d-xl-block, .d-flex.d-none.d-xxl-block{ display:none !important; } .d-flex.d-none.d-sm-block, .d-flex.d-none.d-md-block, .d-flex.d-none.d-lg-block { display:flex !important; } } @media (min-width:1200px){ .d-flex.d-none.d-xxl-block { display:none !important; } .d-flex.d-none.d-sm-block, .d-flex.d-none.d-md-block, .d-flex.d-none.d-lg-block, .d-flex.d-none.d-xl-block { display:flex !important; } } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- LAYOUT ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ /* ------------------------ Header ------------------------ */ .header .container-fluid, .header .container-fluid .container, .header .container-fluid .container .headercontent { height:100%; } header.sticky { -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.15); box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.15); } /* Small devices (landscape phones, 576px and up) */ @media (min-width: 0px) { header.header { height:var(--navigationheight-phone); padding-top:var(--nav-abstand-phone); padding-bottom:var(--nav-abstand-phone); display: flex; justify-content: center; flex-direction: column; } header.header.sticky { height:var(--navigationheight-sticky-phone); background-color:var(--dark); } } /* Medium devices (tablets, 768px and up) */ @media (min-width: 768px) { header.header { height:var(--navigationheight-tablet); padding-top:var(--nav-abstand-tablet); padding-bottom:var(--nav-abstand-tablet); } header.header.sticky { height:var(--navigationheight-sticky-tablet); } } /* Large devices (desktops, 992px and up) */ @media (min-width: 992px) { header.header { height:var(--navigationheight-desktop); padding-top:var(--nav-abstand-desktop); padding-bottom:var(--nav-abstand-desktop); } header.header.sticky { height:var(--navigationheight-sticky-desktop); } } /* ------------------------ Logo ------------------------ */ header.header .signet { display:none; } header.header .logo { display:block; } header.header.sticky .signet { display:block; } header.header.sticky .logo { display:none; } /* Ein ganz kleiner Ausgleich damit Navi und Logo auf einer Linie */ header.header .logo-content { padding-bottom:1px; } @media (min-width: 0px) { header.header .logo-content img { height:calc(var(--navigationheight-phone) - (2* var(--nav-abstand-phone))); width:auto; } header.header.sticky .logo-content img { height:calc(var(--navigationheight-phone) - (2* var(--nav-abstand-phone))); width:auto; } header.header .signet { display:none; } } @media (min-width: 768px) { header.header .logo-content img { height:calc(var(--navigationheight-tablet) - (2* var(--nav-abstand-tablet))); /*height:calc(var(--navigationheight-tablet-jubi) - 70px); */ } header.header.sticky .logo-content img { height:calc(var(--navigationheight-tablet) - (2* var(--nav-abstand-tablet))); } } @media (min-width: 992px) { header.header .logo-content img { height:calc(var(--navigationheight-desktop) - (2* var(--nav-abstand-desktop))); /*height:calc(var(--navigationheight-desktop-jubi) - 70px);*/ } header.header.sticky .logo-content img { height:calc(var(--navigationheight-desktop) - (2* var(--nav-abstand-desktop))); } } /* ------------------------ Header sticky ------------------------ */ header.header { position:absolute; top:0; left:0; width:100%; z-index:999; } /* The sticky class is added to the header with JS when it reaches its scroll position */ header.header.sticky { position: fixed; top: 0; width: 100%; z-index:5; } /* ------------------------ Header ohne Banner ------------------------ */ .header.ohne-banner { background-color: var(--dark); } /* ------------------------ Hero ------------------------ */ #hero { background-image:url(../../../akademie/bilder/hintergrundbilder/verlauf-blau-hero.jpg); background-repeat: no-repeat; background-size:cover; position:relative; position:relative; display: flex; flex-direction: column; width:100%; justify-content: center; } @media (min-width:0px) and (max-width:767px) { body.startseite #hero { /*min-height: 630px;*/ height:calc(100vh - 50px); min-height:600px; } } @media (min-width:768px){ body.startseite #hero { /*min-height: 630px;*/ height:100vh; min-height:768px; } } @media (min-width:992px){ body.standard #hero { min-height:430px; } } @media (min-width:0px) and (max-width:767px) { #hero { padding-top:var(--navigationheight-phone); padding-bottom:var(--abstand-normal); } body.standard #hero { padding-top:calc(var(--abstand-normal) + var(--navigationheight-phone)); padding-bottom:80px; } body.event main #hero { padding-top:var(--abstand-normal); padding-bottom:80px; } } @media (min-width:768px) and (max-width:991px) { #hero { padding-top:var(--navigationheight-tablet); } body.standard #hero { padding-top:calc(var(--abstand-normal) + var(--navigationheight-tablet)); padding-bottom:80px; } body.event main #hero { padding-top:var(--abstand-normal); padding-bottom:80px; } } @media (min-width:992px) { #hero { padding-top:var(--navigationheight-desktop); } body.standard #hero { padding-top:calc(var(--abstand-normal) + var(--navigationheight-desktop)); padding-bottom:80px; } body.event main #hero { padding-top:var(--abstand-normal); padding-bottom:80px; } } #hero > div { z-index:2; } body.standard #hero { color:white; } /* Verlaufsfläche von oben dunkel */ @media (min-width:0px) and (max-width:575px) { #hero:before { height:300px; } } @media (min-width:576px) and (max-width:767px) { #hero:before { height:325px; } } @media (min-width:768px) { #hero:before { height:420px; } } #hero:before { content:""; width:100%; background: linear-gradient(180deg, rgba(var(--dark-rgb),1) 25%, rgba(var(--dark-rgb),0) 100%); position:absolute; display:block; left:0; top:0; z-index:1; } /* Grosse Ecke türkis links im Hero-banner */ #hero:after { content:""; width: calc(((100% - 1140px) /2) + ((1140px /12) *7)); -webkit-clip-path: polygon(0 0, 0% 100%, 100% 100%); clip-path: polygon(0 0, 0% 100%, 100% 100%); background: linear-gradient(0deg, rgba(var(--primary-rgb),1) 0%, rgba(var(--primary-rgb),0) 90%); display: block; position: absolute; z-index: 0; object-fit: cover; left: 0; bottom:0; opacity:0.6; } /* ------------------------ Main ------------------------ */ main { min-height:450px; } @media (min-width:0px) and (max-width:767px) { header + main { padding-top: var(--navigationheight-phone); } } @media (min-width:768px) and (max-width:991px) { header + main { padding-top: var(--navigationheight-tablet); } } @media (min-width:992px){ header + main { padding-top: var(--navigationheight-desktop); } } /* ------------------------ Footer ------------------------ */ footer { color:var(--footercontent); background-color:var(--footerbackground); } footer a{ color:var(--footernavlink); } footer a:hover{ color:var(--footerlinkhover); text-decoration:none; } footer { width:100%; bottom:0; } /* Small devices (landscape phones, 576px and up) */ @media (min-width: 0px) { footer > .container-fluid { padding-top:var(--section-phone-padding); padding-bottom:55px; } .footer-bottom .border-top { padding-top:var(--abstand-klein) !important; padding-bottom:var(--abstand-klein); margin-top:var(--abstand-klein); } .footer-bottom .border-top > .row + .row { margin-top:var(--abstand-ganzklein); } } /* Medium devices (tablets, 768px and up) */ @media (min-width: 768px) { footer > .container-fluid { padding-top:var(--section-tablet-padding); padding-bottom:55px; } footer .footer-top .toolbar { align-items: flex-end; } .footer-bottom .border-top { padding-top:var(--abstand-mittel); padding-bottom:var(--abstand-klein); margin-top:var(--abstand-mittel); } .footer-bottom .border-top > .row + .row { margin-top:var(--abstand-ganzklein); } } /* Large devices (desktops, 992px and up) */ @media (min-width: 992px) { footer > .container-fluid { padding-top:var(--section-bigdesktop-padding); padding-bottom: var(--abstand-klein); } } /* X-Large devices (large desktops, 1200px and up) */ @media (min-width: 1200px) { footer > .container-fluid { padding-top:var(--section-desktop-padding); padding-bottom: var(--abstand-klein); } } /* XX-Large devices (larger desktops, 1400px and up) */ @media (min-width: 1400px) { footer > .container-fluid { padding-top:var(--section-bigdesktop-padding); padding-bottom: var(--abstand-klein); } } /* Footer Top */ .footer-top .toolbar-content ul li { display:inline-block; } .footer-top .toolbar-content ul li a:before, .footer-top .cookie-set:before{ content:var(--link-more-icon) !important; font-family:var(--font-awesome-regular); margin-right:5px; } .footer-top .cookie-set:hover, .footer-top .cookie-set:hover:before{ color:var(--primary); } .footer-top .toolbar-content ul li a.nav-link { display:inline-block; } @media (min-width:0px) and (max-width:767px) { .footer-top .logo-aksb { transform: scale(0.8); } .footer-top { font-size:var(--font-size-small); } } @media (min-width:0px) and (max-width:991px) { .footer-top .logo-aksb { align-items: flex-end; transform-origin: top right; } } /* Footer Bottom */ .footer-bottom .border-top { border-top:1px solid var(--white) !important; } .footer-bottom .flex-row div + div{ margin-left:var(--abstand-normal); } .footer-bottom .flex-row .socialmedia-icon + .socialmedia-icon { margin-left:var(--abstand-klein); } @media (min-width:0px) and (max-width:991px) { .footer-bottom .col-md-12:first-child { -ms-flex-align: flex-start !important; align-items: flex-start !important; } .footer-bottom .col-md-12 > div + div{ margin-top:0em; } .footer-bottom .flex-row .socialmedia-icon img { height:25px; } } @media (min-width:0px) and (max-width:767px) { .footer-bottom .flex-row div + div{ margin-left:0px; } .footer-bottom .col-md-12:nth-child(2).justify-content-end { justify-content: space-between !important; } } @media (min-width:768px) and (max-width:991px) { .footer-bottom .col-md-12:nth-child(2).justify-content-end { margin-top:var(--abstand-klein); } } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- SUCHE - SUCHERGEBNISSE ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ /* --------------------------------------------- Liste Suchvorschläge ergänzen ----------------------------------------------- */ .tx-indexedsearch-form + ul#vorschlaege{ /*height:0;*/ margin-bottom:0em !important; } .tx-indexedsearch-form.show + ul#vorschlaege { height:auto; } .tx-indexedsearch-searchbox { position:relative; } .tx-indexedsearch-searchbox ul#vorschlaege{ position:absolute; list-style-type: none; -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.15); box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.15); background-color:transparent; border-radius: 15px; } .tx-indexedsearch-searchbox ul#vorschlaege { width:100%; padding:0px 0px 0px 0px !important; } header .tx-indexedsearch-searchbox ul#vorschlaege { top:30px; } main .tx-indexedsearch-searchbox ul#vorschlaege { top:40px; } .tx-indexedsearch-searchbox ul#vorschlaege li{ padding:4px 4px 4px 10px; /*border-bottom:1px solid var(--white);*/ display:flex; align-content: center; flex-wrap:wrap; font-style: italic; cursor:pointer; margin-bottom:0px; } header .tx-indexedsearch-searchbox ul#vorschlaege li{ background-color:rgba(255,255,255,0.85); } main .tx-indexedsearch-searchbox ul#vorschlaege li{ background-color:var(--light); } .tx-indexedsearch-searchbox ul#vorschlaege li { font-size:var(--font-size-small); } .tx-indexedsearch-searchbox ul#vorschlaege li:first-child{ border-top-left-radius: 15px; border-top-right-radius: 15px; } .tx-indexedsearch-searchbox ul#vorschlaege li:last-child{ border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; } .tx-indexedsearch-searchbox ul#vorschlaege li:hover, .tx-indexedsearch-searchbox ul#vorschlaege li:focus{ background-color:var(--primary); } /* -------------------------------------------------- Suche oben (Desktop) und unten (Mobile) in den Tools --------------------------------------------------- */ /* Tools in Navigation */ /* Suche und Sprachauswahl */ header .tools { display: flex; flex-direction: row; } @media (min-width:768px) { header .tools { margin-left:10px; } } @media (min-width:768px) and (max-width:1199px) { header .tools { margin-bottom:var(--abstand-klein); } } /* Normales Suchformular + Projektsuche */ /* Suchformular */ .tx-indexedsearch-form { position:relative; z-index:555; z-index:555; } /* -------------------------------------------------------- SUCHFELD abgerundete Ecken Input mit Linie --------------------------------------------------------- */ header .tx-indexedsearch-searchbox-sword, .suchbereich.mobil .tx-indexedsearch-searchbox-sword, .tx-filelist .tx-indexedsearch-searchbox-sword, .kesearchbox .tx-indexedsearch-searchbox-sword, .tx-kesearch-pi1 input[type="search"]{ border:1px solid var(--primary) !important; border-radius:20px !important; font-size:var(--font-size-small) !important; opacity:1 !important; padding-left:10px !important; padding-right:10px !important; position:relative; } header .tx-indexedsearch-searchbox-sword { padding-right:40px !important; } .suchbereich.mobil .tx-indexedsearch-searchbox-sword, .tx-filelist .tx-indexedsearch-searchbox-sword, .kesearchbox .tx-indexedsearch-searchbox-sword, .tx-kesearch-pi1 input[type="search"] { background-color:transparent !important; } header .tx-indexedsearch-searchbox-sword { background-color:transparent; } /* Input Feld - klein */ header .tx-indexedsearch-searchbox-sword { height:25px !important; } @media (min-width:0px) and (max-width:767px) { header .tx-indexedsearch-searchbox-sword, .tx-filelist .tx-indexedsearch-searchbox-sword{ height:35px; } } /* Input Feld - gross */ .tx-filelist .tx-indexedsearch-searchbox-sword, .kesearchbox .tx-indexedsearch-searchbox-sword, .tx-kesearch-pi1 input[type="search"], .suchbereich.mobil .tx-indexedsearch-searchbox-sword{ height:35px !important; } /* Farbe Placeholder Text */ header input.tx-indexedsearch-searchbox-sword::placeholder, header input.tx-indexedsearch-searchbox-sword:-ms-input-placeholder, header input.tx-indexedsearch-searchbox-sword::-ms-input-placeholder, .suchbereich.mobil input.tx-indexedsearch-searchbox-sword::placeholder, .suchbereich.mobil input.tx-indexedsearch-searchbox-sword:-ms-input-placeholder, .suchbereich.mobil input.tx-indexedsearch-searchbox-sword::-ms-input-placeholder { color:white !important; opacity:1; } header input.tx-indexedsearch-searchbox-sword::placeholder, .suchbereich.mobil input.tx-indexedsearch-searchbox-sword::placeholder { color:white !important; } header .tx-indexedsearch-searchbox-sword, .suchbereich.mobil .tx-indexedsearch-searchbox-sword{ color:white; } main .tx-indexedsearch-searchbox-sword { color:var(--bs-body-color); } /* Breite Suchfelder */ header .tx-indexedsearch-searchbox-sword { width:190px; } .suchbereich.mobil .tx-indexedsearch-searchbox-sword { border:1px solid white !important; width:100% !important; } .tx-filelist .tx-indexedsearch-searchbox-sword { width:100% !important; } main .tx-indexedsearch-searchbox-sword, main .kesearchbox, main .suchbereich .tx-indexedsearch-searchbox-sword{ width:100% !important; } /* -------------------------------------------------------- SUCHBUTTON mit Lupe --------------------------------------------------------- */ header input.tx-indexedsearch-searchbox-button, header input.tx-indexedsearch-searchbox-button:hover, .suchbereich.mobil input.tx-indexedsearch-searchbox-button, .suchbereich.mobil input.tx-indexedsearch-searchbox-button:hover, .kesearchbox .input.tx-indexedsearch-searchbox-button, .tx-kesearch-pi1 input.tx-indexedsearch-searchbox-button, .tx-filelist .tx-indexedsearch-searchbox-button{ background-repeat: no-repeat; background-size: 20px; background-position: center right; position: absolute; right: 0; color: transparent; padding: 0em; } /* Suchbutton - klein */ header input.tx-indexedsearch-searchbox-button, header input.tx-indexedsearch-searchbox-button:hover{ height:25px !important; padding:3px 10px 3px 0px; } @media (min-width:0px) and (max-width:767px) { header input.tx-indexedsearch-searchbox-button, header input.tx-indexedsearch-searchbox-button:hover, .tx-filelist .input.tx-indexedsearch-searchbox-button { height:35px; padding:8px 10px 8px 0px; } } /* Suchbutton - gross */ .suchbereich.mobil input.tx-indexedsearch-searchbox-button, .suchbereich.mobil input.tx-indexedsearch-searchbox-button:hover, .tx-filelist input.tx-indexedsearch-searchbox-button, .kesearchbox input.tx-indexedsearch-searchbox-button, .tx-kesearch-pi1 input[type="search"]{ height:35px !important; padding:8px 10px 8px 0px; } /* Ohne Cursor Pointer */ .tx-filelist input.tx-indexedsearch-searchbox-button { cursor:default !important; } /* Suchbutton weiss */ /* header input.tx-indexedsearch-searchbox-button, header input.tx-indexedsearch-searchbox-button:hover, .suchbereich.mobil input.tx-indexedsearch-searchbox-button, .suchbereich.mobil input.tx-indexedsearch-searchbox-button:hover{ background-image: url(../images/icons/icon-lupe-weiss.svg); } */ /* Suchbutton schwarz */ /* .tx-filelist .input.tx-indexedsearch-searchbox-button, .kesearchbox .input.tx-indexedsearch-searchbox-button, .tx-kesearch-pi1 input.tx-indexedsearch-searchbox-button { background-image: url(../images/icons/icon-lupe-schwarz.svg); } */ /* Suchbutton schwarz in Input Feld als Hintergrundbild */ /* .tx-filelist .tx-indexedsearch-searchbox-sword, .kesearchbox .tx-indexedsearch-searchbox-sword { background-image: url(../images/icons/icon-lupe-schwarz.svg); background-repeat: no-repeat; background-size: 20px; background-position: 99% 50%; padding-right:30px; } */ /* -------------------------------------------------------- Suchbereich unter Mobil-Phone --------------------------------------------------------- */ .suche-navi { display:flex; flex-direction:row; } /* Suchbutton neben Navi */ .search-open { width:30px; height:22px; background-image: url(/fileadmin/templates/akademie_v1/images/icons/icon-lupe-weiss.svg); background-color: transparent; background-repeat: no-repeat; background-size:contain; border: 0px; background-color:tranpsarent; border:0px; margin-right:10px; } /* Suchbereich unter Navi */ @media (min-width:0px) and (max-width:991px) { .suchbox { background-color:var(--primary); position:fixed; /*bottom:0;*/ left:0; top: var(--navigationheight-phone); width:100%; padding-top:var(--abstand-ganzklein); padding-bottom:var(--abstand-ganzklein); min-height:25px; z-index:4; opacity:0; padding-left: 30px; padding-right: 30px; transition: opacity ease-in 1; } .suchbox.show { opacity:1; } } @media (min-width:0px) and (max-width:991px) { header .tx-indexedsearch-searchbox-sword { border: 1px solid var(--white) !important; width:100%; height:35px !important; } header input.tx-indexedsearch-searchbox-button, header input.tx-indexedsearch-searchbox-button:hover { padding: 8px 10px 8px 0px; height:35px !important; } header .suchbox .suche { left:0; right:0; margin-left:auto; margin-right:auto; } } @media (min-width:0px) and (max-width:575px) { header .suchbox .suche { max-width: 100%; width:100%; } } @media (min-width:576px) and (max-width:767px) { header .suchbox .suche { max-width: 540px; width:540px; } } @media (min-width:768px) and (max-width:991px) { header .suchbox .suche { max-width: 720px; width:720px; } } /* -------------------------------------------------------- Suche im Inhaltsbereich mit Filterung - Veranstaltungen etc --------------------------------------------------------- */ /* Suchbutton bei ausführlicher Suche Veranstaltungen im Inhalt */ .suchbereich.inhalt > .row { margin-bottom:var(--abstand-klein); } .suchbereich.inhalt { margin-bottom:var(--abstand-normal); } /* .suchbereich.inhalt .field.searchbox-button button[type="submit"] { background-color: var(--primary) !important; background-image: url('../images/icons/icon-lupe-schwarz.svg'); } .suchbereich.inhalt .field.searchbox-button button[type="submit"]:hover { background-color: var(--bs-body-color) !important; background-image: url('../images/icons/icon-lupe-weiss.svg'); } .suchbereich.inhalt .field.searchbox-button button[type="submit"] { background-repeat: no-repeat; background-position: center center; border: 0 solid black !important; color:var(--white); display: flex; flex-direction: column; align-items: center; justify-content: center; height: 39px; width: 39px; float: left; } .suchbereich.inhalt .search-field.search-button > div { margin-bottom:0px; } .suchbereich.inhalt .search-field.search-button { display:flex; } .suchbereich.inhalt .search-field.search-button .powermail_fieldwrap_type_input { width:100%; } */ /* Button erweiterte Suche nach rechts schieben */ .suchbereich.inhalt .button-erweitert button { float:right; } /* Button erweiterte Suche nach links schieben */ @media (min-width:0px) and (max-width:767px) { .suchbereich.inhalt .col-sm-12.justify-content-between { justify-content:space-between !important; } } @media (min-width:768px) { .suchbereich.inhalt .col-sm-12.justify-content-between { justify-content: end !important; } #aerweitert.d-none { display:flex !important; } } /* -------------------------------------------------------- Search Results --------------------------------------------------------- */ /* Anzahl Ergebnisse */ .tx-kesearch-pi1 #kesearch_num_results { color: var(--bs-body-color) !important; font-size:var(--font-size-small) !important; margin-bottom: var(--abstand-ganzklein) !important; } /* Result Box */ .tx-kesearch-pi1 .tx-indexedsearch-res { background-color:var(--light) !important; padding:var(--card-padding) !important; margin-bottom: var(--abstand-ganzklein) !important; } /* Result Number */ #kesearch_results .result-list-item .result-number, #kesearch_results .result-list-item .result-title { font-size:1em !important; } /* Result Titel */ #kesearch_results .result-list-item .result-number, #kesearch_results .result-list-item .result-title { font-size: 1.5rem !important; line-height: 1.1em !important; margin-bottom: 10px !important; display:block; } /* Link in Title nicht kursiv */ #kesearch_results .result-list-item .result-number a, #kesearch_results .result-list-item .result-title a { font-style:normal !important; } /* gesuchtes Wort hervorheben */ .tx-kesearch-pi1 #kesearch_results .result-title .hit, .tx-kesearch-pi1 #kesearch_results .result-teaser .hit{ border-bottom:1px solid var(--primary); color: var(--bs-body-color) !important; } /* gesuchtes Wort hervorheben */ .tx-kesearch-pi1 #kesearch_results .result-title a:hover .hit, .tx-kesearch-pi1 #kesearch_results .result-teaser a:hover .hit{ color: var(--primary) !important; } .tx-kesearch-pi1 #kesearch_results .result-title .hit { font-weight: bold !important; } .tx-kesearch-pi1 #kesearch_results .result-teaser .hit { font-weight:normal !important; } /* Fließtext in Result */ .tx-kesearch-pi1 #kesearch_results .result-teaser { color: var(--bs-body-color) !important; font-size:1em !important; font-weight:normal !important; } .tx-kesearch-pi1 .tx-indexedsearch-stand, .tx-kesearch-pi1 .tx-indexedsearch-info { font-size:var(--font-size-small) !important; } .tx-kesearch-pi1 .tx-indexedsearch-info { margin-bottom: var(--abstand-ganzklein) !important; } #kesearch_pagebrowser_bottom .pages_total { border-top: 1px solid var(--bs-body-color) !important; margin-top: var(--abstand-mittel) !important; } .tx-kesearch-pi1 .result_txt { font-size:var(--font-size-small) !important; width:50%; float:left; color: var(--bs-body-color) !important; text-align:left; margin-top: 50px; } .kesearch_pagebrowser { width:50%; float:right; text-align:right; } .kesearch_pagebrowser ul { display:flex !important; flex-direction:row; justify-content: flex-end } .kesearch_pagebrowser ul li + li { margin-left:5px; } .kesearch_pagebrowser ul li { display:flex !important; align-items: center; text-align:center; background-color:var(--light) !important; font-size:var(--font-size-small) !important; } #kesearch_pagebrowser_top a, #kesearch_pagebrowser_bottom a { padding: 0px !important; background-color:var(--light) !important; padding:2px 8px 2px 8px !important; font-style:normal; color:var(--bs-body-color); } #kesearch_pagebrowser_top a:hover, #kesearch_pagebrowser_bottom a:hover { background-color:var(--primary) !important; color: #ffffff !important; } #kesearch_pagebrowser_top a.current, #kesearch_pagebrowser_bottom a.current{ background-color:var(--primary) !important; font-weight: normal !important; color: #ffffff !important; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- SPRACHAUSWAHL ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ /* ------------------------ Sprache in Toolbar ------------------------ */ .sprache { display: flex; flex-direction: row; align-items: center; position: relative; cursor:pointer; } .sprache .current { font-size:0.7em; display: block; text-align: center; margin-left:5px; } .sprache .sprachauswahl { position: absolute; right:0px; width: 200px; height:0px; -webkit-transition: height 0.5s ease 0s,width 0.5s ease 0s; -moz-transition: height 0.5s ease 0s,width 0.5s ease 0s; -o-transition: height 0.5s ease 0s,width 0.5s ease 0s; transition: height 0.5s ease 0s,width 0.5s ease 0s; float:left; overflow:hidden; display:flex; justify-content: flex-end; } .sprache .sprachauswahl.show { height:30px; } .sprachauswahl { line-height:1em; } .sprache .sprachen-content { float:left; padding:0em 0px 0em 0px; height:100%; } .sprache .sprachauswahl ul.list { padding-left:0em; float:left; margin-bottom:0em; height:100%; width:100%; } .sprache .sprachauswahl ul li { list-style-type: none; float:left; font-size:var(--font-size-small); margin-bottom:0em; background-color:transparent; border:1px solid var(--primary); background-color:transparent; color:var(--white); border-radius: 20px; height: 25px; } .sprache .sprachauswahl ul li.option, .sprache .sprachauswahl ul li.option a { width:45px; display:flex; align-items: center; justify-content: center; } .sprache .sprachauswahl ul li:hover, .sprache .sprachauswahl ul li:hover a{ border-radius: 20px; } .sprache .sprachauswahl ul li.option + li.option { margin-left:5px; } @media (min-width:0px) and (max-width:991px) { .sprache { margin-left:0px; margin-bottom:10px; margin-bottom:10px; justify-content: flex-start; } .sprache:before { content:url(/fileadmin/templates/akademie_v1/images/icons/icon-weltkugel-schwarz.svg); } .sprache .current { color:var(--bs-body-color); } .sprache .sprachauswahl { top:0px; } .sprache .sprachauswahl ul li.option, .sprache .sprachauswahl ul li.option a { color:var(--bs-body-color); } .sprache .sprachauswahl ul li:hover, .sprache .sprachauswahl ul li:hover a { border:1px solid var(--primary); background-color:var(--primary); color:var(--bs-body-color) !important; } } @media (min-width:992px) { .sprache { margin-left:10px; justify-content: center; } .sprache:before { content:url(/fileadmin/templates/akademie_v1/images/icons/icon-weltkugel-weiss.svg); } .sprachauswahl:hover .sprache:before, .sprachauswahl.show .sprache:before{ content:url(/fileadmin/templates/akademie_v1/images/icons/icon-weltkugel-primary.svg); } .sprache .current { color:var(--white); } .sprachauswahl:hover .sprache .current, .sprachauswahl.show .sprache .current{ color:var(--primary); } .sprache .sprachauswahl { top:-35px; } .sprache .sprachauswahl ul li.option, .sprache .sprachauswahl ul li.option a { color:var(--white) !important; } .sprache .sprachauswahl ul li:hover, .sprache .sprachauswahl ul li:hover a { border:1px solid var(--primary); background-color:var(--primary); color:var(--bs-body-color) !important; } } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- SLIDER ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ /* ------------------------------------------------ ALLGEMEINE SLIDERANGABEN - ContentSlider ------------------------------------------------ */ .grid-slider .ce-textpic, .grid-slider .ce-image, .grid-slider .ce-nowrap .ce-bodytext, .grid-slider .ce-gallery, .ce-row, .grid-slider .ce-uploads li, .grid-slider .ce-uploads div{ /*overflow:visible;*/ } /* Pfeil Nav */ .grid-slider .owl-nav { position: absolute; top: 0; bottom: 0; left:0; right:0; margin: auto; width:98%; height:90px; display: flex; justify-content: space-between; flex-direction: row; } /* Allgmeine Angaben Startseiten Slider */ .grid-slider .owl-dots { display:flex; flex-direction:row; align-content:center; justify-content: center; margin-top:var(--abstand-normal); } .grid-slider .owl-dot span { background-color:rgba(255,255,255,0.5); } .grid-slider .owl-dot.active span { background-color:var(--primary); } .grid-slider .owl-dot + .owl-dot { margin-left:var(--abstand-klein); } .grid-slider .owl-dot span { /* display:block;*/ width:15px; height:15px; border-radius:15px; } /* ------------------------------------------------ SLIDER Hero ------------------------------------------------ */ /* Owl-Dots gestalten Slider Startseite */ #hero .owl-carousel .owl-dots { display:flex; flex-direction:row; align-content:center; justify-content: center; } /* Phone */ @media (min-width:0px) and (max-width:767px) { #hero .owl-carousel .owl-dots { margin-top:0em; } } /* Desktop */ @media (min-width:768px) { #hero .owl-carousel .owl-dots { margin-top:var(--abstand-normal); } } #hero .owl-carousel .owl-dot span { background-color:transparent; border:1px solid white; } #hero .owl-carousel .owl-dot.active span { background-color:rgba(255,255,255,0.5); } #hero .owl-carousel .owl-dot span { display:block; } /* Phone */ @media (min-width:0px) and (max-width:767px) { /* Punktgröße Nav */ #hero .owl-carousel .owl-dot span { width:15px; height:15px; border-radius:15px; } #hero .owl-carousel .owl-dot + .owl-dot { margin-left:var(--abstand-ganzklein); } } /* Desktop */ @media (min-width:768px) { /* Punktgröße Nav */ #hero .owl-carousel .owl-dot span { width:25px; height:25px; border-radius:25px; } #hero .owl-carousel .owl-dot + .owl-dot { margin-left:var(--abstand-klein); } } /* Pfeile prev und next Slider Startseite */ #hero .owl-prev { background-image:url(../images/icons/slider-nav-pfeil-prev-weiss-gross.svg); } #hero .owl-next { background-image:url(../images/icons/slider-nav-pfeil-next-weiss-gross.svg); } #hero .owl-prev, #hero .owl-next { width:30px; height:75px; background-repeat:no-repeat; position:absolute; z-index:777; } #hero .owl-prev { left:0; } #hero .owl-next { right:0; } #hero .owl-prev span, #hero .owl-next span { color:transparent; } /* Pfeile Nav */ #hero .owl-nav { position: absolute; top: 0; bottom: 0; left:0; right:0; height:90px; display: flex; justify-content: space-between; flex-direction: row; } /* Phone */ @media (min-width:0px) and (max-width:767px) { /* Pfeil Nav */ #hero .owl-nav { margin: auto -15px; width: calc(100% + 30px); } } /* Desktop */ @media (min-width:768px) { /* Pfeil Nav */ #hero .owl-nav { margin: auto -40px; width: calc(100% + 80px); } } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- NAVIGATION ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ .navbar { align-items: end; } .navbar-ebene { display:flex; } /* Desktop klein Suche über Navigation switchen */ @media (min-width:992px) and (max-width:1199px) { .navbar-ebene { flex-direction:column; align-items: flex-end; } .navbar-ebene .navbar { order:2; } } @media (min-width:992px) { .navbar-nav > li { margin-bottom:0em; } } /* ------------------------ Ausrichtung Navi Mobile ------------------------ */ @media screen and (max-width: 991px) { header .headercontent { display:flex; align-items: center; justify-content: space-between; } header .navbar-collapse { flex-direction:column; } header .navbar-collapse > * { width:100%; } header .navbar-collapse { width:100%; position: fixed; top: 0px; left: 0; z-index: 777; background-color: var(--white); display: -webkit-box; display: flex; opacity: 0; transition: all 0.25s; height: 0px; overflow-y: scroll; } header .navbar-collapse.show { opacity: 100; height: 100%; } header ul.navbar-nav li { margin-bottom:0em; } } /* Mobile Phone */ @media screen and (min-width: 0px) and (max-width:767px){ header:not(.sticky) .navbar-collapse { padding-top:90px; } header.sticky .navbar-collapse { padding-top:90px; } } /* Mobile Tablet */ @media screen and (min-width: 768px) and (max-width:991px){ header:not(.sticky) .navbar-collapse { padding-top:150px; } header.sticky .navbar-collapse { padding-top:105px; } } /* ------------------------ Ausrichtung Desktop ------------------------ */ @media screen and (min-width: 992px) { header .nav-link { padding-top:0em; padding-bottom:0em; } header .headercontent { display:flex; align-items: flex-end; justify-content: space-between; } } /* Pfeil Toggle ausblenden */ header .dropdown-toggle::after { display:none; } header .navbar { padding:0em; } /* ------------------------ 1. STUFE Mobile ------------------------ */ @media screen and (max-width: 991px) { header .navbar-nav a.level1 { color:var(--bs-body-color); } .level1-ifsub a:before, .level1-actifsub a:before { content:var(--link-plus-icon); font-family:var(--font-awesome-regular); font-style:normal; margin-left:5px; position:absolute; right:0; padding-top:10px; padding-bottom:10px; top:0; } header .navbar-nav .nav-item { border-bottom:1px solid var(--bs-body-color); } header .navbar-nav .nav-item > a { font-family: var(--bs-font-sans-serif); font-weight: bold; font-style: normal; font-display: swap; padding-top:10px; padding-bottom:10px; } header .navbar-nav .nav-item:first-child { border-top:1px solid var(--bs-body-color); } } /* ------------------------ 1. STUFE Desktop ------------------------ */ @media screen and (min-width: 992px) { header .navbar-nav a.level1 { color:var(--white) !important; } header .navbar-nav a.level1:not(.btn):hover, header .navbar-nav .active a.level1:not(.btn), header .nav-item.dropdown.ifsub.show > a { color:var(--primary) !important; } } /* ------------------------ 2. STUFE Allgemein ------------------------ */ /* ------------------------ DROOPDOWN ------------------------ */ @media (min-width:0px) { header .navbar-collapse { padding-right: 30px; padding-left: 30px; } } @media (min-width:576px) { header .navbar-collapse { padding-left:calc((100% - 510px)/2); padding-right:calc((100% - 510px)/2); } } @media (min-width:768px) { header .navbar-collapse { padding-left:calc((100% - 690px)/2); padding-right:calc((100% - 690px)/2); } } @media (min-width:992px) { header .navbar-collapse { padding-left:0px; padding-right:0px; } } header .navbar-nav > .nav-item > .dropdown-menu .dropdown-item { white-space: normal; } /* Pfeile an die Dropdown Navipunkte */ header .navbar-nav > .nav-item > .dropdown-menu .dropdown-item a:before { content:var(--link-more-icon) !important; font-family:var(--font-awesome-regular); font-style:normal; position:absolute; } /* Dropdown Navigationspunkte */ header .navbar-nav > .nav-item > .dropdown-menu .dropdown-item { border-top:1px solid var(--bs-body-color); position:relative; } /* ------------------------ 2. STUFE Dropdown Mobile ------------------------ */ @media screen and (max-width: 991px) { header .navbar-nav .nav-item.dropdown.ifsub.show { padding-bottom:0px; } header .navbar-nav .nav-item.dropdown > a:focus { border:0px !important; box-shadaw:0px; } .dropdown-menu { padding: 0em !important; margin: 0px 0px 0px 0px !important; background-color: transparent !important; border: 0px solid rgba(0,0,0,.15) !important; border-radius: 0rem !important; } header .dropdown-menu > .container .row { width: calc(100% + 30px); } header .dropdown-menu > .container { max-width: 100%; width: 100%; padding:0em; } header .navbar-nav > .nav-item > .dropdown-menu .dropdown-item:first-child { border-top:1px solid var(--bs-body-color); } header .navbar-nav > .nav-item > .dropdown-menu .dropdown-item:last-child { border-bottom:0px solid var(--bs-body-color); } header .navbar-nav > .nav-item > .dropdown-menu/*, .container > div + div*/ { margin-top:0px; } /* Aussehen Links Dropdown */ header .dropdown-item[class*="level2"] { padding-top:0em; padding-bottom:0em; padding-left:0em; padding-right:0em; } header .dropdown-item[class*="level2"] a{ padding-top:10px; padding-bottom:10px; } header .dropdown-item[class*="level2"]:before { content:none !important; } header .dropdown-item[class*="level2"]:hover, header .dropdown-item[class*="level2"]:focus{ background-color:transparent; color:var(--primary); } header .dropdown-item[class*="level2"]:hover a, header .dropdown-item[class*="level2"]:focus a{ color:var(--primary); } /* Pfeile an die Dropdown Navipunkte */ header .navbar-nav > .nav-item > .dropdown-menu .dropdown-item a:before { right:0; left:auto; margin-left:5px; } } /* ------------------------ 2. STUFE Dropdown Desktop ------------------------ */ @media screen and (min-width: 992px) { /* Dropdown */ header .navbar-nav > .nav-item > .dropdown-menu { position: fixed !important; left: 0; width: 100% !important; background-color:var(--light) !important; top: calc(var(--navigationheight-desktop) - 2px); padding-top: 40px; padding-bottom: 40px; z-index: 999; -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25); -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25); box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.25); border-radius: 0px; border:0px solid black; color: var(--bs-body-color); font-size:1em !important; } header.sticky .navbar-nav > .nav-item > .dropdown-menu { top: calc(var(--navigationheight-sticky-desktop) - 2px); } header .navbar-nav > .nav-item.dropdown { position: static; } header .navbar-nav > .nav-item > .dropdown-menu .container .row { width:calc(100% + 30px); } /* Zweispaltige Aufteilung */ header .navbar-nav > .nav-item > .dropdown-menu .col-lg-8 { width: 100%; column-count: 2; column-gap: 30px; } /* Aussehen Links Dropdown */ header .navbar-nav > .nav-item > .dropdown-menu .dropdown-item { padding-top:10px; padding-bottom:10px; padding-left:0em; padding-right:0em; } header .dropdown-item[class*="level2"]:hover, header .dropdown-item[class*="level2"]:focus{ background-color:var(--primary); color:var(--bs-body-color); } header .dropdown-item[class*="level2"]:hover a, header .dropdown-item[class*="level2"]:focus a{ color:var(--bs-body-color) !important; } header .navbar-nav > .nav-item > .dropdown-menu .dropdown-item a { padding-left:25px; } /* Pfeile an die Dropdown Navipunkte */ header .navbar-nav > .nav-item > .dropdown-menu .dropdown-item a:before { left:0px; right:auto; margin-right:5px; } } /* ------------------------ TOOLBAR in Navi Mobile ------------------------ */ @media screen and (max-width: 991px) { header .navbar-collapse .toolbar .nav-link { color:var(--bs-body-color); } header .navbar.toolbar { margin-top:10px; margin-bottom:10px; font-size:var(--font-size-small); line-height:1.1em; } header .navbar.toolbar ul li a { padding:0em; } header .navbar.toolbar .nav.flex-column{ flex-direction: row !important; justify-content: flex-start; align-items: flex-start; width:100%; } header .navbar.toolbar .nav.flex-column li { margin-right:15px; } } footer .toolbar .nav-link { padding:0em; } @media screen and (max-width: 575px) { footer .toolbar { margin-top:20px; } } /* Restliche Icons und Buttons in Navbar */ .restliche-icons-buttons .btn { /*display:block;*/ margin-bottom:8px; } .restliche-icons-buttons p { margin-bottom:0px; } .restliche-icons-buttons .frame-space-before-small { margin-top: var(--abstand-ganzklein); } @media (min-width:0px) and (max-width:767px) { .headercontent .restliche-icons-buttons .btn { font-size:0.75em; letter-spacing:0; } } /* ------------------------ BURGER ------------------------ */ /* Phone und Tablet Variante */ @media screen and (max-width: 991px) { button.navbar-toggler { padding: 0px; font-size: 0px; border-radius: 0pc; transition: none; z-index: 999; } header button.navbar-toggler { /* top: 0; position: absolute; right: 0; */ } header.sticky button.navbar-toggler { /* top: -10px; position: absolute; right: 0; */ } .navbar-light .navbar-toggler { color: rgba(0, 0, 0, 0); border-color: rgba(0, 0, 0, 0); } /* Navbar Toggle Farbe Startseite */ button.navbar-toggler .animated-icon span { background-color: var(--bs-body-color); } /* Navbar Toggle Farbe Wenn Navbar sticky */ button.navbar-toggler.collapsed .animated-icon span { background-color: var(--white); } .animated-icon { width: 30px; height: 20px; position: relative; margin: 0px; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; } .animated-icon span { display: block; position: absolute; height: 1px; width: 100%; border-radius: 9px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; padding: 0px; } .animated-icon span:nth-child(1) { top: 0px; } .animated-icon span:nth-child(2), .animated-icon span:nth-child(3) { top: 10px; } .animated-icon span:nth-child(4) { top: 20px; } button.navbar-toggler:not(.collapsed) .animated-icon span:nth-child(1) { top: 11px; width: 0%; left: 50%; } button.navbar-toggler:not(.collapsed) .animated-icon span:nth-child(2) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } button.navbar-toggler:not(.collapsed) .animated-icon span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } button.navbar-toggler:not(.collapsed) .animated-icon span:nth-child(4) { top: 11px; width: 0%; left: 50%; } } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- CONTAINER ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ .container-fluid > .container-header { width: 100%; } .container-fluid > .container-header, #hero .banner-highlight-slogan { padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } #hero .banner-highlight-slogan { left:0; right:0; } .container .container { padding-left:0em; padding-right:0em; } @media (min-width: 576px) { .container-header{ max-width: 540px; } #hero .banner-highlight-slogan{ width: 540px; } } @media (min-width: 768px) { .container-header{ max-width: 720px; } #hero .banner-highlight-slogan{ width: 720px; } } @media (min-width: 992px) { .container-header{ max-width: 960px; } #hero .banner-highlight-slogan{ width: 960px; } } @media (min-width: 1200px) { .container-header{ max-width: 1140px; } #hero .banner-highlight-slogan{ width: 1140px; } } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- CARDS ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ /* ------------------------ Normale Card ------------------------ */ /* Allgemeines Aussehen von Normale Card */ .card { background-color: #fff; border: 0px solid rgba(0,0,0,.125); border-radius: 0rem; width:100%; } .card-body { padding:var(--card-padding); } /* Weisse Card auf Weissem Grund bekommt Border */ .bg-white .card.bg-white, div:not([class*="bg-"]):not(.border) .card.bg-white{ border:1px solid var(--light); } /* Bei Tablet 3Spalter hat Text Trennungen */ @media (min-width: 768px) and (max-width:991px) { .col-lg-4.col-md-4 .card header, .col-lg-4.col-md-4 .card .ce-bodytext{ hyphens:auto } } /* Abstände in Normale Card */ /* mit Hintergrundfarbe */ div:not(.accordion) > .card > header, div:not(.accordion) > .card > .aufriss:first-child{ padding-top:var(--card-padding); padding-left:var(--card-padding); padding-right:var(--card-padding); } /* Small devices (landscape phones, 576px and up) */ @media (min-width: 0px) and (max-width:767px) { /* mit Hintergrundfarbe */ div:not(.accordion) > .card > header, div:not(.accordion) > .card > .aufriss:first-child{ padding-top:var(--card-padding); } } div:not(.accordion) > .card > header + .ce-body { padding-bottom:var(--card-padding); padding-left:var(--card-padding); padding-right:var(--card-padding); } /* Small devices (landscape phones, 576px and up) */ @media (min-width: 0px) and (max-width:767px) { div:not(.accordion) > .card > header + .ce-body { padding-bottom:var(--card-padding); } } div:not(.accordion) > .card > .aufriss + header { padding-top:0em; } div:not(.accordion) > .card > .ce-body:only-child, /* Card verlinkt */ div:not(.accordion) > a > .card > .ce-body:only-child, .grid-container.card, div[class*="col"].card{ padding-top:var(--card-padding); padding-bottom:var(--card-padding); padding-left:var(--card-padding); padding-right:var(--card-padding); } /* Small devices (landscape phones, 576px and up) */ @media (min-width: 0px) and (max-width:767px) { div:not(.accordion) > .card > .ce-body:only-child, /* Card verlinkt */ div:not(.accordion) > > .card > .ce-body:only-child, .grid-container.card, div[class*="col"].card{ padding-top:var(--card-padding); padding-bottom:var(--card-padding); } } /* Bild-Überschift-Text */ div:not(.accordion) > .card.imgorient-7 > .ce-body:only-child { padding:0em; } div:not(.accordion) > .card.imgorient-7 > .ce-body:only-child .ce-textcontent{ padding-top:var(--card-padding); padding-bottom:var(--card-padding); padding-left:var(--card-padding); padding-right:var(--card-padding); } /* Small devices (landscape phones, 576px and up) */ @media (min-width: 0px) and (max-width:767px) { div:not(.accordion) > .card.imgorient-7 > .ce-body:only-child .ce-textcontent{ padding-top:var(--card-padding); padding-bottom:var(--card-padding); } } .imgorient-7 .ce-column { width:100%; } .imgorient-7 figure { margin:auto auto; } main .imgorient-7:not(.card) .ce-gallery { padding-bottom:var(--card-padding); } main .no-gutters .imgorient-7:not(.card) .ce-gallery { padding-bottom:0em; } /* Ansicht auf Tablet quer */ /* Infobox querformatig Bild neben Text */ /* @media (min-width: 768px) and (max-width:991px) { .col-lg-4.d-md-none .card.imgorient-7 .ce-textpic, .col-md-12 .card.imgorient-7 .ce-textpic, .col-lg-4.d-md-none .tt_address_list .vcard .card, .col-md-12 .tt_address_list .vcard.col-12.d-flex .card, .vcard.col-md-12 .card { display:flex; flex-direction:row-reverse !important; } .col-lg-4.d-md-none .card.imgorient-7 .ce-textpic .ce-gallery, .col-lg-4.d-md-none .card.imgorient-7 .ce-textpic .ce-textcontent, .col-md-12 .card.imgorient-7 .ce-textpic .ce-gallery, .col-md-12 .card.imgorient-7 .ce-textpic .ce-textcontent, .col-lg-4.d-md-none .tt_address_list .vcard .card .xaddressImage, .col-lg-4.d-md-none .tt_address_list .vcard .card .card-body, .col-md-12 .tt_address_list .vcard.col-12.d-flex .card .xaddressImage, .col-md-12 .tt_address_list .vcard.col-12.d-flex .card .card-body, .vcard.col-md-12 .card .xaddressImage, .vcard.col-md-12 .card .card-body{ -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-lg-4.d-md-none .card.imgorient-7 .ce-textpic .ce-textcontent:only-child, .col-lg-4.d-md-12 .card.imgorient-7 .ce-textpic .ce-textcontent:only-child, .col-lg-6.col-md-12 .card.imgorient-7 .ce-textpic .ce-textcontent:only-child{ -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .col-lg-4.d-md-none .card.imgorient-7 .ce-textpic .ce-gallery .ce-row, .col-lg-4.d-md-none .card.imgorient-7 .ce-textpic .ce-gallery .ce-row .ce-column, .col-lg-4.d-md-none .card.imgorient-7 .ce-textpic .ce-gallery .ce-row .ce-column .image, .col-lg-4.d-md-none .card.imgorient-7 .ce-textpic .ce-gallery .ce-row .ce-column .image img, .col-lg-4.d-md-none .card.imgorient-7 .ce-textpic .ce-gallery .ce-row .ce-column .image a, .col-md-12 .card.imgorient-7 .ce-textpic .ce-gallery .ce-row, .col-md-12 .card.imgorient-7 .ce-textpic .ce-gallery .ce-row .ce-column, .col-md-12 .card.imgorient-7 .ce-textpic .ce-gallery .ce-row .ce-column .image, .col-md-12 .card.imgorient-7 .ce-textpic .ce-gallery .ce-row .ce-column .image img, .col-md-12 .card.imgorient-7 .ce-textpic .ce-gallery .ce-row .ce-column .image a, .col-md-12 .card.bg-light .xaddressImage a, .col-md-12 .card.bg-light .xaddressImage a img, .col-md-12 .tt_address_list .vcard.col-12.d-flex .card .xaddressImage a, .col-md-12 .tt_address_list .vcard.col-12.d-flex .card .xaddressImage a img, .vcard.col-md-12 .card .xaddressImage a, .vcard.col-md-12 .card .xaddressImage a img { height:100%; display:block; } .col-lg-4.d-md-none .card.imgorient-7 .ce-textpic .ce-gallery .ce-row .ce-column .image img, .col-lg-4.d-md-none .card.imgorient-7 .ce-textpic .ce-gallery .ce-row .ce-column .image a img, .col-md-12 .card.imgorient-7 .ce-textpic .ce-gallery .ce-row .ce-column .image img, .col-md-12 .card.imgorient-7 .ce-textpic .ce-gallery .ce-row .ce-column .image a img, .col-lg-4.d-md-none .card.bg-light .xaddressImage a img, .col-md-12 .tt_address_list .vcard.col-12.d-flex .card .xaddressImage a img, .vcard.col-md-12 .card .xaddressImage a img{ object-fit: cover; height:100% !important; } } */ /* ------------------------ Card Linie oben und unten ------------------------ */ .card.border-bottom {border-bottom: 0px solid black !important;} .card.border-top {border-top: 0px solid black !important;} .card.border-bottom:before { border-bottom: 0px solid black; content:""; width:100%; height:1px; background-color:var(--bs-body-color); position:absolute; left:0; top:0; } .card.border-top:after { border-top: 0px solid black; content:""; width:100%; height:1px; background-color:var(--bs-body-color); position:absolute; left:0; bottom:0; } .card.border-bottom.border-top:not([class*="bg-"]) > header, .card.border-bottom.border-top:not([class*="bg-"]) > header + .ce-body, .card.border-bottom.border-top:not([class*="bg-"]) > .ce-body:only-child { padding-left:0em; padding-right:0em; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- Quadratische Card ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ /* Small devices (landscape phones, 576px and up) */ @media (min-width: 0px) and (max-width:767px) { /* Auf Phone nicht quadratisch */ .col-lg-2 .card.quadrat, .col-lg-3 .card.quadrat, .col-lg-4 .card.quadrat, .col-lg-8 .col-lg-6 .card.quadrat, .col-lg-6 .card.quadrat, .col-lg-8 .card.quadrat, .col-lg-9 .card.quadrat, .col-lg-10 .card.quadrat{ height:auto; } } /* Small devices (landscape phones, 576px and up) */ /* @media (min-width: 576px) { .col-2 .card.quadrat { height:60px; } .col-3 .card.quadrat { height:105px; } .col-4 .card.quadrat, .col-8 .col-lg-6 .card.quadrat{ height:150px; } .col-6 .card.quadrat { height:240px; } .col-8 .card.quadrat { height:330px; } .col-9 .card.quadrat { height:375px; } .col-10 .card.quadrat { height:420px; } } */ /* Medium devices (tablets, 768px and up) */ @media (min-width: 768px) { .col-md-2 .card.quadrat { height:90px; } .col-md-3 .card.quadrat, .col-md-6 .col-md-6 .card.quadrat { height:150px; } .col-md-4 .card.quadrat, .col-md-8 .col-lg-6 .card.quadrat{ height:210px; } .col-md-6 .card.quadrat{ height:330px; } .col-md-8 .card.quadrat { height:450px; } .col-md-9 .card.quadrat { height:510px; } .col-md-10 .card.quadrat { height:570px; } } /* Large devices (desktops, 992px and up) */ @media (min-width: 992px) { .col-lg-2 .card.quadrat { height:130px; } .col-lg-3 .card.quadrat, .col-lg-8 .col-lg-4 .card.quadrat{ height:210px; } .col-lg-4 .card.quadrat, .col-lg-8 .col-lg-6 .card.quadrat{ height:290px; } .col-lg-6 .card.quadrat { height:450px; } .col-lg-8 .card.quadrat { height:610px; } .col-lg-9 .card.quadrat { height:690px; } .col-lg-10 .card.quadrat { height:770px; } } /* Large devices (desktops, 1200px and up) */ @media (min-width: 1200px) { .col-lg-2 .card.quadrat { height:160px; } .col-lg-3 .card.quadrat { height:255px; } .col-lg-4 .card.quadrat, .col-lg-8 .col-lg-6 .card.quadrat{ height:350px; } .col-lg-6 .card.quadrat { height:490px; } .col-lg-8 .card.quadrat { height:730px; } .col-lg-9 .card.quadrat { height:825px; } .col-lg-10 .card.quadrat { height:870px; } } /* ------------------------ Menü Abstract / Flip-Card ------------------------ */ /* entire container, keeps perspective */ .flip-container { perspective: 1000px; -moz-transform: perspective(1000px); -moz-transform-style: preserve-3d; -webkit-perspective: 1000; -moz-perspective: 1000; -o-perspective: 1000; } /* flip the pane when hove */ .flip-container:hover .flipper, .flip-container.hover .flipper { transform: rotateY(180deg); } .flip-container, .front-side, .back-side { width: 100%; height: 200px; } /* flip speed goes here */ .flipper { transition: 0.6s; transform-style: preserve-3d; position: relative; } /* hide back of pane during swap */ .front-side, .back-side { backface-visibility: hidden; position: absolute; top: 0; left: 0; padding: 0px; } /* front pane, placed above back */ .front-side { z-index: 2; /* for firefox 31 */ transform: rotateY(0deg); -webkit-transform: rotateY(0deg); } .front-side::after { content: url(../images/icons/icon-pfeil-weiter-kreis-primary.svg); bottom: -17px; right:0; left:0; margin:auto; position: absolute; width: 27px; } /* back, initially hidden pane */ .back-side { transform: rotateY(180deg); -webkit-transform: rotateY(180deg); } .front-side .card, .back-side .card { height:100%; } .flipper .front-side.card, .flipper .back-side.card{ padding:25px; } .flipper .card header, .flipper .card .ce-body { } /* ------------------------ Menü Abstract / Normale Darstellung ------------------------ */ .menu-abstract > .row > div[class*="col-"]:not([class*="-lg-12"]){ margin-bottom:var(--abstand-normal); } /* -------------------------------------------------------------- Menü RecentlyUpdated / Liste anstatt normaler Darstellung ---------------------------------------------------------------- */ .frame-type-menu_recently_updated.menu-list .menu-item-abstract.card.bg-light{ background-color:transparent !important; } .frame-type-menu_recently_updated.menu-list .menu-item-abstract.card.bg-light > header, .frame-type-menu_recently_updated.menu-list .menu-item-abstract.card.bg-light > .ce-body { padding:0em !important; } .gradient-bg-secondary-to-bg-dark .frame-type-menu_recently_updated.menu-list .menu-item-abstract.card.bg-light > header, .gradient-bg-secondary-to-bg-dark .frame-type-menu_recently_updated.menu-list .menu-item-abstract.card.bg-light > .ce-body, .gradient-bg-secondary-to-bg-dark .frame-type-menu_recently_updated.menu-list .menu-item-abstract.card.bg-light a{ color:#ffffff !important; } .frame-type-menu_recently_updated.menu-list div[class*="col"] { /* -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; */ } .frame-type-menu_recently_updated.menu-list div[id*="teaser"]:not(:last-child) { margin-bottom:var(--abstand-normal); } /* -------------------------------------------------------------- Menü Categorized_pages / Slider ---------------------------------------------------------------- */ .frame-type-menu_categorized_pages .owl-carousel .owl-item > div { width:100%; } /* ------------------------ Acccordeon und Summary ------------------------ */ summary { position:relative; } .accordion .card-header button, summary {background-color:transparent;width:100%;text-align:left;border:0} .accordion .card-header button, summary { display:block; padding: calc(var(--card-padding)/1.5); } .accordion .card-header button.card-link.collapsed:after, .accordion .card-header button.card-link:after, summary:after, details[open] summary::after{ font-family:var(--font-awesome-regular); position:absolute; right:calc(var(--card-padding)/1.5); } .accordion .card-header button.card-link.collapsed:after, summary:after{ content:var(--accordion-icon-normal); } .accordion .card-header button.card-link:after, details[open] summary::after { content:var(--accordion-icon-active); } .accordion .card-header { padding:0em; border-bottom:0px solid black; } .accordion .card-header, summary{ background-color:var(--light); } .accordion .card-header:hover, summary:hover{ background-color:var(--primary); } .accordion .card-header:hover, .accordion .card-header:hover button, summary:hover { color:var(--bs-body-color) !important; } .accordion > .card + .card, details + details { margin-top:var(--abstand-ganzklein); } .card-body.accordion-body { padding: var(--card-padding) 0em var(--card-padding) 0em; } details .ce-body {padding-bottom: var(--card-padding)} /* Headline im Body Bereich ausblenden */ .accordion .card-body.accordion-body > div > header { display:none; } /* DETAILS ANIMATION CRI 14.06.*/ @keyframes animate { from {grid-template-rows: 0fr;} to {grid-template-rows: 1fr;} } details > div { display: grid; grid-template-rows: 0fr; transition: all ease-in-out 0.5s; } details > div > div { overflow: hidden; } details[open] > div { animation: animate 0.25s 0s 1 normal forwards; } /* ------------------------ Acccordeon und Summary ------------------------ */ .aufklapp-container { position:relative; } .aufklapp-container:not(.hidden){ max-height:100%; -webkit-transition: all .25s ease-in; -moz-transition: all .25s ease-in; transition: all .25s ease-in; } .aufklapp-container.hidden { max-height:300px; -webkit-transition: all .25s ease-out; -moz-transition: all .25s ease-out; transition: all .25s ease-out; overflow:hidden; } .aufklapp-container:before { content:""; display:block; width:100%; position:absolute; bottom:0; z-index:1; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0+1,1+100 */ background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 1%, rgba(255,255,255,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 1%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 1%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */ } .aufklapp-container.hidden:before { height:100%; -webkit-transition: all .15s ease-in; -moz-transition: all .15s ease-in; transition: all .15s ease-in; } .aufklapp-container:not(.hidden):before { height:0%; -webkit-transition: all .15s ease-out; -moz-transition: all .15s ease-out; transition: all .15s ease-out; } .aufklapp-container button { position:absolute; right:0; z-index:2; } .aufklapp-container.hidden button { bottom:0px; } .aufklapp-container:not(.hidden) button { bottom:-50px; } .aufklapp-container.hidden .detailsanzeigen.btn:after, aufklapp-container.hidden .detailsanzeigen.btn.hover{ content:var(--accordion-icon-normal) !important; } .aufklapp-container:not(.hidden) .detailsanzeigen.btn:after, .aufklapp-container:not(.hidden) .detailsanzeigen.btn:hover:after{ content:var(--accordion-icon-active) !important; } .aufklapp-container .btn-primary, .aufklapp-container .btn-primary:focus, .aufklapp-container .btn-primary.focus{ background-color:var(--primary); border:var(--primary); color:var(--bs-body-color); } .aufklapp-container .btn-primary:hover, .aufklapp-container .btn-primary.hover { background-color:var(--bs-body-color); color:var(--white); } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- Tabs ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ .nav.mb-3 { margin-bottom:0em; } .nav-tabs { border-bottom: 1px solid var(--bs-body-color); } ul.nav-tabs li, ul.nav-tabs{ margin-bottom:0px !important; } ul.nav-tabs li + li { margin-left:5px; } /* Tabcontent */ .tab-pane > header { display:none; } .tab-pane { padding-top:var(--abstand-normal); padding-bottom:var(--abstand-normal); } /* Tabs allgemein */ .nav-tabs .nav-link { margin-bottom: -1px; background-color: transparent; border: 1px solid transparent; border-top-color: transparent; border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; border-top-left-radius: 5px; border-top-right-radius: 5px; } /* Tab normal */ .nav-tabs .nav-item .nav-link, .nav-tabs .nav-link{ color:var(--bs-body-color); border-color: var(--bs-body-color); } /* Tab normal hover */ .nav-tabs .nav-item .nav-link:hover, .nav-tabs .nav-link:hover{ background-color:var(--primary); color:var(--bs-body-color) !important; border-color: var(--bs-body-color); } /* Tab active */ .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link:hover, .nav-tabs .nav-link.active:hover{ /*background-color:rgba(var(--primary-rgb),0.2);*/ background-color:var(--bs-body-color); color:var(--white) !important; border-color: var(--bs-body-color); } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- Weitere Element ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ /* ------------------------ Tabellen ------------------------ */ .ce-table th, .ce-table td { padding: calc(var(--card-padding)/1.5); background-color:var(--light); } .ce-table th, .ce-table td { border-top: 1px solid var(--white); } .ce-table thead th { border-bottom: 1px solid var(--bs-body-color); } /* CE-Table transparent */ .ce-table.transparent th { padding: 0px 0px calc(var(--card-padding)/1.5) 0px ; } .ce-table.transparent th, .ce-table.transparent td { padding: calc(var(--card-padding)/1.5); } .ce-table.transparent th:first-child, .ce-table.transparent td:first-child { padding: calc(var(--card-padding)/1.5) calc(var(--card-padding)/1.5) calc(var(--card-padding)/1.5) 0px; } .ce-table.transparent th:last-child, .ce-table.transparent td:last-child { padding: calc(var(--card-padding)/1.5) 0px calc(var(--card-padding)/1.5) calc(var(--card-padding)/1.5); } .ce-table.transparent th, .ce-table.transparent td { background-color:transparent; } .ce-table.transparent td { border-bottom:1px solid var(--light); } .bg-light .ce-table.transparent td { border-bottom:1px solid rgba(0,0,0,0.5); } /* Result-Table transparent */ .ce-table.transparent th { padding: 0px 0px calc(var(--card-padding)/2.5) 0px ; } .ce-table.transparent th, .ce-table.transparent td { padding: calc(var(--card-padding)/2.5); } .ce-table.transparent th:first-child, .ce-table.transparent td:first-child { padding: calc(var(--card-padding)/2.5) calc(var(--card-padding)/2.5) calc(var(--card-padding)/2.5) 0px; } .ce-table.transparent th:last-child, .ce-table.transparent td:last-child { padding: calc(var(--card-padding)/2.5) 0px calc(var(--card-padding)/2.5) calc(var(--card-padding)/2.5); } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- BILDER ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ figure a { height:100%; } main img:not([src*=".svg"]), #hero img:not([src*=".svg"]) { max-width:100%; width:100%; height:auto; } main li img { width:auto; } .image, .news .thumbnail{ position:relative; } .ce-gallery figcaption, .news .thumbnail .caption, .image .copyright{ position: absolute; padding: 2px; bottom: 0; left: 0; background-color: rgba(0,0,0,0.35); color: #ffffff; margin: 5px; max-width: calc(100% - 10px); } .event .crieventsingle #hero .copyright, .event .crieventsingle #hero .caption, .event .crieventsingle #hero figcaption { right:0; left:auto; } .caption, .ce-gallery figcaption, .image .copyright { font-size: calc(var(--font-size-small)/1.25); line-height: 1.1em; } .caption { margin-top:10px; } .no-gutters div[class*="col-"] .frame-type-image figure { display:flex; } .news-list-view .newsbild img, .no-gutters div[class*="col-"] .frame-type-image img { height:100% !important; width:auto; object-fit: cover; max-width:100%; } .ce-gallery .ce-outer, .ce-gallery .ce-outer .ce-inner, .ce-gallery .ce-outer .ce-inner .ce-row, .ce-gallery .ce-outer .ce-inner .ce-row .ce-column, .ce-gallery .ce-outer .ce-inner .ce-row .ce-column .image, .card.imgorient-7 .image{ width:100%; } .ce-textpic.ce-center.ce-above .ce-gallery .ce-outer, .ce-gallery .ce-outer .ce-inner, .ce-textpic.ce-center.ce-above .ce-gallery .ce-outer .ce-inner .ce-row, .ce-textpic.ce-center.ce-above .ce-gallery .ce-outer .ce-inner .ce-row .ce-column, .ce-textpic.ce-center.ce-above .ce-gallery .ce-outer .ce-inner .ce-row .ce-column .image:not(.ansprechpartner-bild), .ce-textpic.ce-center.ce-above .card.imgorient-7 .image{ width:auto !important; } #hero figcaption { display:none; } .card.imgorient-7 img[src*=".svg"] { margin:var(--card-padding) auto 0px auto; } .card.imgorient-7 img:not([src*=".svg"]) { margin:0 auto; } @media (min-width:0px) and (max-width:767px) { .ce-intext .ce-gallery { /*margin:0em 0em var(--abstand-klein) 0em !important;*/ /* width:100%;*/ } .ce-intext .ce-gallery .ce-column, .ce-intext .ce-gallery .ce-column .image{ width:100%; } } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- GRID ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ .layout-2col.col-lines > .row > div[class*="col-"] + div[class*="col-"], .layout-3col.col-lines > .row > div[class*="col-"]:nth-child(2), .layout-3col.col-lines > .row > div[class*="col-"]:nth-child(3), .layout-4col.col-lines > .row > div[class*="col-"]:nth-child(2), .layout-4col.col-lines > .row > div[class*="col-"]:nth-child(3), .layout-4col.col-lines > .row > div[class*="col-"]:nth-child(4){ border-left:1px solid var(--bs-body-color); } /* Col Lines auf Phone ausblenden */ @media (min-width: 0px) and (max-width:575px) { .layout-3col.col-lines > .row > div[class*="col-"]:nth-child(2), .layout-3col.col-lines > .row > div[class*="col-"]:nth-child(3), .layout-2col.col-lines > .row > div[class*="col-"] + div[class*="col-"], .layout-4col.col-lines > .row > div[class*="col-"]:nth-child(2), .layout-4col.col-lines > .row > div[class*="col-"]:nth-child(3), .layout-4col.col-lines > .row > div[class*="col-"]:nth-child(4){ border-left:0px solid var(--bs-body-color); } } /* Bei Dunkelblau Linie weiss */ .container-fluid.bg-dark > .container > .grid-2col > .layout-2col.col-lines > .row > div[class*="col-"] + div[class*="col-"], .container-fluid.bg-dark > .layout-3col.col-lines > .row > div[class*="col-"]:nth-child(2), .container-fluid.bg-dark > .layout-3col.col-lines > .row > div[class*="col-"]:nth-child(3), .container-fluid.bg-dark > .layout-4col.col-lines > .row > div[class*="col-"]:nth-child(2), .container-fluid.bg-dark > .layout-4col.col-lines > .row > div[class*="col-"]:nth-child(3), .container-fluid.bg-dark > .layout-4col.col-lines > .row > div[class*="col-"]:nth-child(4){ border-color: #ffffff; } div[class*="layout-"].col-lines > .row { margin-left:-30px; margin-right:-30px; } .col-lines > .row > div[class*="col-"] { padding-left:30px; padding-right:30px; } div[class*="col-"].d-flex .frame-type-image:not(.justify-content-center), div[class*="col-"].d-flex .frame-type-image:not(.justify-content-center) .ce-body, div[class*="col-"].d-flex .frame-type-image:not(.justify-content-center) .ce-body *:not(.image-caption):not(.copyright):not(.stoerer) { height: 100%; margin: 0 auto; width: 100%; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- BILDER-GALERIE ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ .ce-image .ce-gallery { width:100%; } .ce-image .ce-gallery[data-ce-columns="2"] .ce-row, .ce-image .ce-gallery[data-ce-columns="3"] .ce-row, .ce-image .ce-gallery[data-ce-columns="4"] .ce-row, .ce-image .ce-gallery[data-ce-columns="6"] .ce-row, .ce-image .ce-gallery[data-ce-columns="8"] .ce-row { margin-left:-15px !important; margin-right:-15px !important; } .ce-image .ce-gallery .ce-row .ce-column{ padding-right:15px; padding-left:15px; margin-right:0px; display: -ms-flexbox; display: flex; } .ce-image .ce-gallery[data-ce-columns="1"] .ce-column { padding-right:0em; padding-left:0em; } main .ce-image .ce-gallery .ce-row .ce-column .image, main .ce-image .ce-gallery .ce-row .ce-column .image img:not([src*=".svg"]){ width:100%; height:auto; } .ce-image .ce-gallery[data-ce-columns="1"] .ce-column { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; width:100%; } .ce-image .ce-gallery[data-ce-columns="2"] .ce-column { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; width:50%; } .ce-image .ce-gallery[data-ce-columns="3"] .ce-column { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; width: 33.333333%; } .ce-image .ce-gallery[data-ce-columns="4"] .ce-column { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; width: 25%; } .ce-image .ce-gallery[data-ce-columns="6"] .ce-column { -ms-flex: 0 0 16.666666%; flex: 0 0 16.666666%; max-width: 16.666666%; width: 16.666666%; } .ce-image .ce-gallery[data-ce-columns="8"] .ce-column { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; width: 12.5%; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- SECTION-MENÜ INNERHALB EINER SEITE ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ .frame-type-menu_section ul { display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; list-style-type: none; padding-left:0em; } .frame-type-menu_section ul li { padding-left:15px; padding-right:15px; } /* Phone - Menü über die ganze Breite */ @media (min-width: 0px) and (max-width: 767px) { .frame-type-menu_section ul li { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; margin-bottom:5px; } } /* Tablet - 50% */ @media (min-width: 768px) and (max-width: 991px) { .frame-type-menu_section ul li { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; margin-bottom:10px; } } /* Desktop - 33% */ @media (min-width: 992px) { .frame-type-menu_section ul li { -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; margin-bottom:15px; } } /* Phone - Höhe Element */ @media (min-width: 0px) { .frame-type-menu_section ul li a { min-height:auto; } } /* Ipad - Höhe Element */ @media (min-width: 768px) { .frame-type-menu_section ul li a { min-height:45px; } } /* Desktop - Höhe Element */ @media (min-width: 992px) { .frame-type-menu_section ul li a { min-height:45px; } } .frame-type-menu_section ul li a { background-color:var(--primary); padding: .375rem .75rem; display:block; position:relative; padding-right:35px; line-height:1em; display:flex; align-items:center; } .frame-type-menu_section ul li a, .frame-type-menu_section ul li a span { color:var(--bs-body-color); } .frame-type-menu_section ul li a:hover, .frame-type-menu_section ul li a:hover span{ background-color:var(--bs-body-color); color:white !important; } .frame-type-menu_section ul li a:after { content:url(../images/icons/pfeil-klein-down-black.svg); position:absolute; right:15px; display:block; width:12px; } .frame-type-menu_section ul li a:hover:after { content:url(../images/icons/pfeil-klein-down-white.svg); } /* Wie Buttons formatiert */ .frame-type-menu_section ul li a { font-size:1rem; } .frame-type-menu_section ul li a{ border-radius: 0rem; position:relative; text-transform: uppercase; letter-spacing:0.025em; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- SCROLL TO TOP ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ .scrollToTop { height: 45px; width: 45px; background-color: rgba(0,0,0,.25); bottom: 60px; color: #fff; cursor: pointer; opacity: 1; position: fixed; display:none; right: 25px; text-align: center; transition: all 0.2s ease-in-out 0s; z-index: 2; border-radius: 50%; } .scrollToTop:hover { text-decoration:none; background-color: rgba(0,0,0,.5); } .scrollToTop .icon { width:100%; height:100%; display:flex !important; justify-content: center; align-items: center; } .scrollToTop .icon:before { content:var(--link-arrowup-icon); font-family:var(--font-awesome-regular); font-weight: 400; font-style:normal; display:inline-block; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- Background-Image kombiniert mit Background-Color ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ div[class*="backgroundimage"].bg-dark, div[class*="backgroundimage"].bg-light, div[class*="backgroundimage"].bg-secondary, div[class*="backgroundimage"].bg-primary, div[class*="backgroundimage"].bg-white{ position:relative; flex-wrap:wrap; display:flex; justify-content:center; } div[class*="backgroundimage"].bg-dark > div, div[class*="backgroundimage"].bg-light > div, div[class*="backgroundimage"].bg-secondary > div, div[class*="backgroundimage"].bg-primary > div, div[class*="backgroundimage"].bg-white > div{ z-index:4; position:relative; } div[class*="backgroundimage"].bg-dark:before, div[class*="backgroundimage"].bg-light:before, div[class*="backgroundimage"].bg-secondary:before, div[class*="backgroundimage"].bg-primary:before, div[class*="backgroundimage"].bg-primary-hell:before, div[class*="backgroundimage"].bg-white:before{ content:""; width:100%; height:100%; opacity:0.65; position:absolute; z-index:4; top:0; left:0; } div[class*="backgroundimage"].bg-dark:before { background-color:var(--dark); } div[class*="backgroundimage"].bg-dark, div[class*="backgroundimage"].bg-dark .quelle{ color:var(--white); } div[class*="backgroundimage"].bg-light:before { background-color:var(--light); } div[class*="backgroundimage"].bg-light, div[class*="backgroundimage"].bg-light .quelle { color:var(--bs-body-color); } div[class*="backgroundimage"].bg-secondary:before { background-color:var(--secondary); } div[class*="backgroundimage"].bg-secondary, div[class*="backgroundimage"].bg-secondary .quelle { color:var(--white); } div[class*="backgroundimage"].bg-primary:before { background-color:var(--primary); } div[class*="backgroundimage"].bg-secondary, div[class*="backgroundimage"].bg-secondary .quelle { color:var(--bs-body-color); } div[class*="backgroundimage"].bg-white:before { background-color:var(--white); } div[class*="backgroundimage"].bg-white, div[class*="backgroundimage"].bg-white .quelle { color:var(--bs-body-color); } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- Cookie-Management ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ #CookieBox{ padding: 30px; display:flex; flex-direction:column; justify-content:center; } @media (max-width: 767px) { #CookieBox { left: 2%; width: 96%; top: 5%; max-height: 90%; min-height: 90%; } } @media (min-width: 768px) { #CookieBox { top: 10%; left: 20%; width: 60%; max-width: 100%; min-height:auto; max-height: 80%; } } #CookieBox .cookie-btn, #CookieBox .cookie-management, #CookieBox .cookie-refuse{ margin: 0px auto; } #CookieBox a.cookie-accept, #CookieBox .cookie-management, #CookieBox .cookie-refuse { padding: 10px 15px; } #CookieBox a.cookie-accept { margin-top:10px; } #CookieBox .intro .cookie-legal, #CookieBox2 .intro .cookie-legal { margin-top: 25px; margin-bottom:0px; font-size:var(--font-size-small); } #CookieBox p, #CookieBox h1, #CookieBox h2, #CookieBox h3, #CookieBox a, #CookieBox .cookie-btn, #CookieBox .cookie-btn:hover{ color:var(--bs-body-color); } .intro h2 + p, .box-cookie-management-in h2 + p{ text-align:center; } #CookieBox .cookie-management, #CookieBox .cookie-refuse, #CookieBox .cookie-btn, #CookieBox, #CookieBox .cookie-management, #CookieBox .cookie-refuse, #CookieBox .cookie-fix .cookieback, #CookieBox .cookie-fix .cookie-refuse{ border-radius: 0px !important; } #CookieBox .cookie-management, #CookieBox .cookie-refuse{ cursor: pointer; background-color: transparent; } #CookieBox .cookie-accept a, a.cursor, .cookieback, .cookie-refuse{ padding:10px 15px 7px 15px; } #CookieBox .cookie-accept a, #CookieBox .cookie-btn{ background-color:var(--primary) !important; } a.cursor, #CookieBox .cookie-fix .cookieback, #CookieBox .cookie-fix .cookie-refuse{ background-color:var(--light) !important; } a.cursor { display:inline-block; } #CookieBox .intro p { /*width:100%;*/ margin:0 auto 10px auto; } #CookieBox .intro p { width: 100%; text-align:center !important; } .cookiemanagement a:hover { text-decoration:none; } #CookieBox h2 { margin-bottom:20px !important; } #CookieBox .cookie-legal a { color:var(--bs-body-color); } .cookie-legal a:hover { text-decoration:none !important; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- Container Gestaltung ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ .container-fluid.bg-light.style-1, .container-fluid.bg-light.style-2{ background-color:transparent !important; position:relative; } @media (min-width: 992px) { .container-fluid[class*="bg-"].style-1, .container-fluid[class*="bg-"].style-2{ background: rgb(2,0,36); /*background-size:50% 50%;*/ } .container-fluid.bg-light.style-1, .container-fluid.bg-light.style-2 { background: linear-gradient(0deg, rgba(var(--light-rgb),0) 0%, rgba(var(--light-rgb),1) 80%, rgba(var(--light-rgb),0) 100%) !important; } .container-fluid.bg-secondary.style-1, .container-fluid.bg-secondary.style-2 { background: linear-gradient(0deg, rgba(var(--secondary-rgb),0) 0%, rgba(var(--secondary-rgb),1) 80%, rgba(var(--secondary-rgb),0) 100%) !important; } .container-fluid.bg-primary.style-1, .container-fluid.bg-primary.style-2 { background: linear-gradient(0deg, rgba(var(--primary-rgb),0) 0%, rgba(var(--primary-rgb),1) 80%, rgba(var(--primary-rgb),0) 100%) !important; } .container-fluid.bg-dark.style-1, .container-fluid.bg-dark.style-2 { background: linear-gradient(0deg, rgba(var(--dark-rgb),0) 0%, rgba(var(--dark-rgb),1) 80%, rgba(var(--dark-rgb),0) 100%) !important; } } @media (min-width: 1200px) { .container-fluid[class*="bg-"].style-1, .container-fluid[class*="bg-"].style-2{ background-size:calc((((100% - 1140px) / 2) + (1140px / 3)) - 15px) 60% !important; background-repeat:no-repeat !important; } } @media (min-width: 992px) and (max-width:1199px) { .container-fluid[class*="bg-"].style-1, .container-fluid[class*="bg-"].style-2{ background-size:calc((((100% - 960px) / 2) + (960px / 3)) - 15px) 60% !important; background-repeat:no-repeat !important; } } /* Tablet klein */ @media (min-width: 0px) and (max-width:991px) { .container-fluid[class*="bg-"].style-1, .container-fluid[class*="bg-"].style-2{ background:none !important; } } /* Tablet klein */ @media (min-width: 768px) and (max-width:991px) { .container-fluid[class*="bg-"].style-1, .container-fluid[class*="bg-"].style-2{ /*background-size:70% 50%;*/ } } .container-fluid[class*="bg-"].style-1 { background-position:top left; } .container-fluid[class*="bg-"].style-2 { background-position:top right; } .container-fluid .container-fluid:not(.card) { padding-left:0em; padding-right:0em; } .container-fluid .container-fluid .container { padding-left:0em; padding-right:0em; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- Formulare ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ /* Browsergestaltung ausschalten */ select { /* Disable default styling on ff */ /*-moz-appearance: none;*/ /* Disable default styling on webkit browsers */ /*-webkit-appearance: none; */ } .powermail_create {font-size:120%;font-weight:bold;color:var(--warning);} .powermail_fieldwrap { position: relative; } fieldset + fieldset { margin-top:2em; } .tab-container fieldset + fieldset { margin-top:0em; } input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0px; margin-right:7px; } legend { margin-bottom: 1em; } /* manche Labels bold darstellen */ .powermail_fieldwrap_type_radio .control-label, .powermail_fieldwrap_type_check .control-label { font-weight:bold; } /***** Labels werden klein auf Focus *****/ .form-control { display: block; width: 100%; height: 39px; padding: 8px 8px 5px 8px; color: var(--gray); background-color: #fff; background-clip: padding-box; border: 1px solid #ced4da; border-radius: 0rem; transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out; font-weight:normal; line-height:1em !important; } .powermail_fieldwrap.focus .form-control, /* Bei Select gleich nach oben schieben */ .powermail_fieldwrap.powermail_fieldwrap_type_select .form-control, .powermail_fieldwrap_type_country .form-control, .powermail_fieldwrap.powermail_fieldwrap_type_select:focus .form-control{ padding-top:1em; } .form-control::placeholder, .form-control:-ms-input-placeholder, .form-control::-ms-input-placeholder{ border:0px solid black; } .form-control::placeholder { border:0px solid black !important; } .powermail_fieldwrap_type_input label, .powermail_fieldwrap_type_select label, .powermail_fieldwrap_type_date label, .powermail_fieldwrap_type_textarea label, .powermail_fieldwrap_type_country label{ position: absolute !important; z-index:4 !important; pointer-events: none; -webkit-transition: top .15s,color .15s,font-size .15s; transition: top .15s,color .15s,font-size .15s; color: #999999; margin: 0; } /* Placeholder normal */ .powermail_fieldwrap:not(.focus).powermail_fieldwrap_type_input label, .powermail_fieldwrap:not(.focus).powermail_fieldwrap_type_textarea label{ top: 8px; left:8px; font-size: var(--font-size-small); } /* Placeholder klein */ .powermail_fieldwrap.focus.powermail_fieldwrap_type_input label, .powermail_fieldwrap.focus.powermail_fieldwrap_type_textarea label{ left: 8px; top: 0px; font-size: 10px; } .powermail_fieldwrap.powermail_fieldwrap_type_select label, .powermail_fieldwrap.powermail_fieldwrap_type_select:focus label, .powermail_fieldwrap.powermail_fieldwrap_type_country label{ left:8px; top: 0px; font-size: 10px; } .suchbereich .powermail_fieldwrap.powermail_fieldwrap_type_select label, .suchbereich .powermail_fieldwrap.powermail_fieldwrap_type_select:focus label, .suchbereich .powermail_fieldwrap.powermail_fieldwrap_type_country label { top: 2px; font-size: 14px; } /* Wenn Fieldwrap mit Col ist */ /* Placeholder normal */ .powermail_fieldwrap[class*="col-"]:not(.focus).powermail_fieldwrap_type_input label, .powermail_fieldwrap[class*="col-"]:not(.focus).powermail_fieldwrap_type_textarea label{ left:25px; } /* Placeholder klein */ .powermail_fieldwrap[class*="col-"].focus.powermail_fieldwrap_type_input label, .powermail_fieldwrap[class*="col-"].focus.powermail_fieldwrap_type_textarea label { left: 25px; } /* Wenn Textarea einen Platzhalter hat */ .powermail_fieldwrap:not(.focus) textarea { padding-top:2em; } /* Required Felder auf Focus Rot */ :focus:required { box-shadow:0 0 0 0.2rem rgba(var(--primary-rgb),.25); border-color:var(--primary); } /* ErrorMeldung */ .tx-powermail .powermail_fieldset .parsley-errors-list { background-color:transparent; border:0px solid black; } .tx-powermail .powermail_fieldset .powermail_field_error, .tx-powermail .powermail_fieldset .parsley-error, .tx-powermail .powermail_fieldset .powermail_form .parsley-error:focus, .tx-powermail .powermail_fieldset div.error{ background-color: rgba(var(--primary-rgb),0.25); color:var(--bs-body-color); } /* Error Meldung, dieses Feld muss ausgefüllt werden */ .tx-powermail .powermail_fieldset .powermail-errors-list { background-color:transparent; color:var(--bs-body-color); border:0px solid black; padding:0em; margin:0em; position:absolute; font-size:10px; top:7px; right:0px; width:auto; } .tx-powermail .powermail_fieldset .powermail-errors-list > li { color:var(--bs-body-color); padding: 5px 15px; } .tx-powermail .powermail_fieldset .powermail-errors-list li:before { top:-1px !important; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- Eigene CSS Klassen ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ @media (min-width:768px) { .text-two-columns{ column-count: 2; column-gap: 30px; } } .no-gutters > .row { margin-right: 0; margin-left: 0; } .no-gutters > .row > div[class*="col-"] { padding-left:0em; padding-right:0em; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- Video embed ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ .video-embed{ position: relative; overflow: hidden; width: 100%; padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */ } .video-embed > iframe { position: absolute ; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; } /* Video-Bild-Unterschrift */ .video .video-caption { margin-top:var(--abstand-mittel); } /* Videos in der Veranstaltung */ .video-container, .video-container iframe, .video-container object, .video-container embed { width: 100%; } .video-container.onlyone { width: calc(100% - 15px); } .youtube-video { aspect-ratio: 16 / 9; width: 100%; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- Lightbox ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ .layout_lightbox .overlayer { width:100%; height:100%; background-color:rgba(0,0,0,0.85); position:absolute; top:0; left:0em; z-index:999; } .layout_lightbox main { position: relative; z-index: 999; margin-right: auto; margin-left: auto; left: 0; right: 0; background-color: #fff; padding-top:0em; top:-100px; } @media (min-width: 0px) and (max-width: 575px) { .layout_lightbox main { width: 100%; } } @media (min-width: 576px) and (max-width: 767px) { .layout_lightbox main { width: calc(520px - 30px); } } @media (min-width: 768px) and (max-width: 991px) { .layout_lightbox main { width: calc(720px - 30px); } } @media (min-width: 992px) and (max-width: 1199px) { .layout_lightbox main { width: calc(960px - 30px); } } @media (min-width: 1200px) { .layout_lightbox main { width: calc(1140px - 30px); } } .layout_lightbox header.sticky + main, .layout_lightbox header.sticky + #hero { padding-top: 0px; } .layout_lightbox .button-close { width:20px; height:20px; position:absolute; top:25px; right:25px; z-index:999 !important; } .layout_lightbox #Header.sticky { position: relative; top: 0; width: 100%; z-index: 888; } .layout_lightbox header.header { position: relative; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- Container mit Dreieckbild ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ main .content > .frame-type-shortcut .container-fluid.style-big-left, main .content > .frame-type-shortcut .container-fluid.style-big-right, main .content > .frame-type-shortcut .container-fluid.style-small-left, main .content > .frame-type-shortcut .container-fluid.style-small-right, main .content > .container-fluid.style-big-left, main .content > .container-fluid.style-big-right, main .content > .container-fluid.style-small-left, main .content > .container-fluid.style-small-right{ display: flex; } main .content > .frame-type-shortcut:not(:first-child) .container-fluid.style-big-left, main .content > .frame-type-shortcut:not(:first-child) .container-fluid.style-big-right, main .content > .frame-type-shortcut:not(:first-child) .container-fluid.style-small-left, main .content > .frame-type-shortcut:not(:first-child) .container-fluid.style-small-right, main .content > .container-fluid.style-big-left:not(:first-child), main .content > .container-fluid.style-big-right:not(:first-child), main .content > .container-fluid.style-small-left:not(:first-child), main .content > .container-fluid.style-small-right:not(:first-child){ align-items: center; } @media (min-width:0px) and (max-width:767px) { main .content > .container-fluid.style-big-left > .container, main .content > .container-fluid.style-big-right > .container, main .content > .container-fluid.style-small-left > .container, main .content > .container-fluid.style-small-right > .container { /*display:flex; align-items: center;*/ } main .content > .container-fluid.style-big-right > .container, main .content > .container-fluid.style-small-right > .container, main .content > .frame-type-shortcut > .ce-body > .container-fluid.style-big-right > .container, main .content > .frame-type-shortcut > .ce-body > .container-fluid.style-small-right > .container{ /* Padding anders, da Dreiecke direkt über und unter dem Content stehen */ padding-top: 45px; } main .content > .container-fluid.style-big-left > .container, main .content > .container-fluid.style-small-left > .container, main .content > .frame-type-shortcut > .ce-body > .container-fluid.style-big-left > .container, main .content > .frame-type-shortcut > .ce-body > .container-fluid.style-small-left > .container { /* Padding anders, da Dreiecke direkt über und unter dem Content stehen */ padding-bottom: 55px; } } @media (min-width:768px) { main .content > .container-fluid.style-big-left > .container, main .content > .container-fluid.style-big-right > .container, main .content > .container-fluid.style-small-left > .container, main .content > .container-fluid.style-small-right > .container { /*padding-top: var(--section-tablet-padding); padding-bottom: var(--section-tablet-padding);*/ /*display:flex; align-items: center;*/ } } @media (min-width:992px) { main .content > .container-fluid.style-big-left > .container, main .content > .container-fluid.style-big-right > .container, main .content > .container-fluid.style-small-left > .container, main .content > .container-fluid.style-small-right > .container { /*padding-top: var(--section-desktop-padding); padding-bottom: var(--section-desktop-padding);*/ /*display:flex; align-items: center;*/ } } @media (min-width:1200px) { main .content > .container-fluid.style-big-left > .container, main .content > .container-fluid.style-big-right > .container, main .content > .container-fluid.style-small-left > .container, main .content > .container-fluid.style-small-right > .container { /*padding-top: var(--section-desktop-padding); padding-bottom: var(--section-ddesktop-padding);*/ /*display:flex; align-items: center;*/ } } /* Höhen festlegen */ @media (min-width:0px) { .container-fluid.style-small-left, .container-fluid.style-small-right{ min-height: 100px; } .container-fluid.style-small-left > .layoutbild > img, .container-fluid.style-small-right > .layoutbild > img{ height: 100px; } .container-fluid.style-big-left, .container-fluid.style-big-right{ min-height: 100px; } .container-fluid.style-big-left > .layoutbild > img, .container-fluid.style-big-right > .layoutbild > img, body:not(.tagungshaus.startseite) #hero:after, body.tagungshaus.startseite #hero .grid-slider .owl-stage-outer:after/*, body.tagungshaus.startseite #hero .grid-container[class*="backgroundimage"]:after*/{ height: 100px; } } @media (min-width:576px) { .container-fluid.style-small-left, .container-fluid.style-small-right{ min-height: 250px; } .container-fluid.style-small-left > .layoutbild > img, .container-fluid.style-small-right > .layoutbild > img { height: 250px; } .container-fluid.style-big-left, .container-fluid.style-big-right{ min-height: 400px; } .container-fluid.style-big-left > .layoutbild > img, .container-fluid.style-big-right > .layoutbild > img, body:not(.tagungshaus.startseite) #hero:after, body.tagungshaus.startseite #hero .grid-slider .owl-stage-outer:after/*, body.tagungshaus.startseite #hero .grid-container[class*="backgroundimage"]:after*/{ height: 400px; } } @media (min-width:768px) { .container-fluid.style-small-left, .container-fluid.style-small-right{ min-height: 300px; } .container-fluid.style-small-left > .layoutbild > img, .container-fluid.style-small-right > .layoutbild > img { height: 300px; } .container-fluid.style-big-left, .container-fluid.style-big-right{ min-height: 450px; } .container-fluid.style-big-left > .layoutbild > img, .container-fluid.style-big-right > .layoutbild > img, body:not(.tagungshaus.startseite) #hero:after, body.tagungshaus.startseite #hero .grid-slider .owl-stage-outer:after/*, body.tagungshaus.startseite #hero .grid-container[class*="backgroundimage"]:after*/{ height: 450px; } } @media (min-width:992px) { .container-fluid.style-small-left, .container-fluid.style-small-right{ min-height: 380px; } .container-fluid.style-small-left > .layoutbild > img, .container-fluid.style-small-right > .layoutbild > img { height: 380px; } .container-fluid.style-big-left, .container-fluid.style-big-right{ min-height: 520px; } .container-fluid.style-big-left > .layoutbild > img, .container-fluid.style-big-right > .layoutbild > img, body:not(.tagungshaus.startseite) #hero:after, body.tagungshaus.startseite #hero .grid-slider .owl-stage-outer:after/*, body.tagungshaus.startseite #hero .grid-container[class*="backgroundimage"]:after*/{ height: 520px; } } @media (min-width:1200px) { .container-fluid.style-small-left, .container-fluid.style-small-right{ min-height: 380px; } .container-fluid.style-small-left > .layoutbild > img, .container-fluid.style-small-right > .layoutbild > img { height: 380px; } .container-fluid.style-big-left, .container-fluid.style-big-right{ min-height: 520px; } .container-fluid.style-big-left > .layoutbild > img, .container-fluid.style-big-right > .layoutbild > img, body:not(.tagungshaus.startseite) #hero:after, body.tagungshaus.startseite #hero .grid-slider .owl-stage-outer:after/*, body.tagungshaus.startseite #hero .grid-container[class*="backgroundimage"]:after*/{ height: 520px; } } @media (min-width:1400px) { .container-fluid.style-small-left, .container-fluid.style-small-right{ min-height: 500px; } .container-fluid.style-small-left > .layoutbild > img, .container-fluid.style-small-right > .layoutbild > img { height: 500px; } .container-fluid.style-big-left, .container-fluid.style-big-right{ min-height: 600px; } .container-fluid.style-big-left > .layoutbild > img, .container-fluid.style-big-right > .layoutbild > img, body:not(.tagungshaus.startseite) #hero:after, body.tagungshaus.startseite #hero .grid-slider .owl-stage-outer:after/*, body.tagungshaus.startseite #hero .grid-container[class*="backgroundimage"]:after*/{ height: 600px; } } /* Breiten festlegen */ .container-fluid.style-small-left, .container-fluid.style-small-right { width: 100%; position:relative; } .container-fluid.style-big-left, .container-fluid.style-big-right { width: 100%; position: relative; } /* Dreiecke */ /* Grosse Ecke links */ .container-fluid.style-big-left > .layoutbild > img, body.tagungshaus.startseite #hero .grid-slider .owl-stage-outer:after, body.tagungshaus.startseite #hero .grid-container[class*="backgroundimage"]:after { width: calc(((100% - 1140px) /2) + ((1140px /12) *7)); -webkit-clip-path: polygon(0 0, 0% 100%, 100% 100%); clip-path: polygon(0 0, 0% 100%, 100% 100%); display: block; position: absolute; z-index: 0; object-fit: cover; left: 0; bottom:0; } /* Grosse Ecke rechts */ .container-fluid.style-big-right > .layoutbild > img { width: calc(((100% - 1140px) /2) + ((1140px /12) *7)); -webkit-clip-path: polygon(0 0, 100% 0%, 100% 100%); clip-path: polygon(0 0, 100% 0%, 100% 100%); display: block; position: absolute; z-index: 0; object-fit: cover; right: 0; bottom:0; } @media (min-width:0px) and (max-width:575px) { .container-fluid.style-big-left > .layoutbild > img, .container-fluid.style-big-left > .layoutbild > img, #hero:after, body.tagungshaus.startseite #hero .grid-slider .owl-stage-outer:after, body.tagungshaus.startseite #hero .grid-container[class*="backgroundimage"]:after { width: calc(((100% - 1140px) /2) + ((1140px /12) *6)); } } /* Kleine Ecke rechts */ .container-fluid.style-small-left > .layoutbild > img { width: calc(((100% - 1140px) /2) + ((1140px /12) *5)); -webkit-clip-path: polygon(0% 0, 0% 100%, 100% 0); clip-path: polygon(0% 0, 0% 100%, 100% 0); display: block; position: absolute; z-index: 0; object-fit: cover; left: 0; top:0; } /* Kleine Ecke rechts */ .container-fluid.style-small-right > .layoutbild > img { width: calc(((100% - 1140px) /2) + ((1140px /12) *5)); -webkit-clip-path: polygon(0% 0, 100% 100%, 100% 0); clip-path: polygon(0% 0, 100% 100%, 100% 0); display: block; position: absolute; z-index: 0; object-fit: cover; right: 0; top:0; } @media (min-width:0px) and (max-width:575px) { .container-fluid.style-small-left > .layoutbild > img, .container-fluid.style-small-right > .layoutbild > img { width: calc(((100% - 1140px) /2) + ((1140px /12) *6)); } } /* Textausrichtung in den Dreieckscontainern */ .container-fluid.style-small-right .container > div, .container-fluid.style-big-right .container > div { text-align:left; } .container-fluid.style-small-left .container > div, .container-fluid.style-big-left .container > div { text-align:right; } @media (min-width:0px) and (max-width:575px) { .container-fluid.style-small-right .container > div, .container-fluid.style-big-right .container > div, .container-fluid.style-small-left .container > div, .container-fluid.style-big-left .container > div{ text-align:left; } } @media (min-width:0px) and (max-width:575px) { /* Padding für die Texte in den Dreieckscontainer */ .container-fluid.style-big-right .container { padding-right:15px; } .container-fluid.style-big-left .container { padding-left:15px; } .container-fluid.style-small-right .container { padding-right:15px; } .container-fluid.style-small-left .container { padding-left:15px; } /* Dreiecksbild im Hintergrund */ .container-fluid.style-small-right.pr-0 { padding-right:15px; } .container-fluid.style-big-right.pr-0{ padding-right:15px; } } @media (min-width:576px) and (max-width:767px) { /* Padding für die Texte in den Dreieckscontainer */ .container-fluid.style-big-right > .container { padding-right:calc(((540px /4) *2) + 15px); } .container-fluid.style-big-left > .container { padding-left:calc(((540px /4) *2) + 15px); } .container-fluid.style-small-right > .container { padding-right:calc((540px /3) + 15px); } .container-fluid.style-small-left > .container { padding-left:calc((540px /3) + 15px); } /* Dreiecksbild im Hintergrund */ .container-fluid.style-small-right.pr-0 > .container { padding-right:15px !important; } .container-fluid.style-small-right.pr-0 > .container > .row > .col-md-12:first-child{ padding-right:calc((540px /3) + 15px) !important; } .container-fluid.style-big-right.pr-0 > .container { padding-right:15px !important; } .container-fluid.style-big-right.pr-0 > .container > .row > .col-md-12:first-child{ padding-right:calc(((540px /4) *2) + 15px) !important; } .container-fluid.style-small-left.pr-0 > .container { padding-left:15px !important; } .container-fluid.style-small-left.pr-0 > .container > .row > .col-md-12:first-child{ padding-left:calc((540px /3) + 15px) !important; } .container-fluid.style-big-left.pr-0 > .container { padding-left:15px !important; } .container-fluid.style-big-left.pr-0 > .container > .row > .col-md-12:first-child{ padding-left:calc(((540px /4) *2) + 15px) !important; } } @media (min-width:768px) and (max-width:991px) { /* Padding für die Texte in den Dreieckscontainer */ .container-fluid.style-big-right > .container { padding-right:calc(((720px /4) *2) + 15px); } .container-fluid.style-big-left > .container { padding-left:calc(((720px /4) *2) + 15px); } .container-fluid.style-small-right > .container { padding-right:calc((720px /3) + 15px); } .container-fluid.style-small-left > .container { padding-left:calc((720px /3) + 15px); } /* Dreiecksbild im Hintergrund */ .container-fluid.style-small-right.pr-0 > .container { padding-right:15px !important; } .container-fluid.style-small-right.pr-0 > .container > .row > .col-md-12:first-child, .container-fluid.style-small-right.pr-0 > .container > div[class*="grid"] > .content-item > .row > .col-md-12:first-child{ padding-right:calc((720px /3) + 15px) !important; } .container-fluid.style-big-right.pr-0 > .container { padding-right:15px !important; } .container-fluid.style-big-right.pr-0 > .container > .row > .col-md-12:first-child, .container-fluid.style-big-right.pr-0 > .container > div[class*="grid"] > .content-item > .row > .col-md-12:first-child{ padding-right:calc(((720px /4) *2) + 15px) !important; } .container-fluid.style-small-left.pr-0 > .container { padding-left:15px !important; } .container-fluid.style-small-left.pr-0 > .container > .row > .col-md-12:first-child, .container-fluid.style-small-left.pr-0 > .container > div[class*="grid"] > .content-item > .row > .col-md-12:first-child{ padding-left:calc((720px /3) + 15px) !important; } .container-fluid.style-big-left.pr-0 > .container { padding-left:15px !important; } .container-fluid.style-big-left.pr-0 > .container > .row > .col-md-12:first-child, .container-fluid.style-big-left.pr-0 > .container > div[class*="grid"] > .content-item > .row > .col-md-12:first-child{ padding-left:calc(((720px /4) *2) + 15px) !important; } } @media (min-width:992px) and (max-width:1199px) { /* Padding für die Texte in den Dreieckscontainer */ .container-fluid.style-big-right > .container { padding-right:calc(((960px /4) *2) + 15px); } .container-fluid.style-big-left > .container { padding-left:calc(((960px /4) *2) + 15px); } .container-fluid.style-small-right > .container { padding-right:calc((960px /3) + 15px); } .container-fluid.style-small-right.pr-0 > .container, .container-fluid.style-big-right.pr-0 > .container{ padding-right:15px; } .container-fluid.style-small-left.pr-0 > .container, .container-fluid.style-big-left.pr-0 > .container{ padding-left:15px; } .container-fluid.style-small-left > .container { padding-left:calc((960px /3) + 15px); } /* Dreiecksbild im Hintergrund */ .container-fluid.style-small-right.pr-0, .container-fluid.style-big-right.pr-0, .container-fluid.style-small-right.pr-0 > .container, .container-fluid.style-big-right.pr-0 > .container{ padding-right:15px !important; } } @media (min-width:1200px) { /* Padding für die Texte in den Dreieckscontainer */ .container-fluid.style-big-right > .container { padding-right:calc(((1140px /4) *2) + 15px); } .container-fluid.style-big-left > .container { padding-left:calc(((1140px /4) *2) + 15px); } .container-fluid.style-small-right > .container { padding-right:calc((1140px /3) + 15px); } .container-fluid.style-small-right.pr-0 > .container, .container-fluid.style-big-right.pr-0 > .container{ padding-right:15px; } .container-fluid.style-small-left.pr-0 > .container, .container-fluid.style-big-left.pr-0 > .container{ padding-left:15px; } .container-fluid.style-small-left > .container { padding-left:calc((1140px /3) + 15px); } /* Dreiecksbild im Hintergrund */ .container-fluid.style-small-right.pr-0, .container-fluid.style-big-right.pr-0, .container-fluid.style-small-right.pr-0 > .container, .container-fluid.style-big-right.pr-0 > .container{ padding-right:15px !important; } } /* ------------------------------------------------------------- ---------------------------------------------------------------- CONTENT - Slider ---------------------------------------------------------------- ------------------------------------------------------------- */ /* ------------------------ Listenansicht ------------------------ */ main .owl-carousel{ padding-bottom:50px; } /* Buttons next und prev */ main .owl-carousel.content-item .owl-nav{ display:flex; flex-direction: row; justify-content: space-between; position:absolute; width:100%; bottom:0; } /* Auf kleinen Devices Pfeilchen vor und zurück ausblenden */ @media (min-width: 0px) and (max-width:575px) { main .owl-carousel.content-item .owl-nav { display:none; } } main .owl-carousel.content-item .owl-nav { top: auto; bottom: 0; left: auto; right: auto; margin: auto; width: 100%; height: auto; } main .owl-carousel.content-item .owl-nav button.owl-prev{ padding:10px 10px 10px 0px !important; } main .owl-carousel.content-item .owl-nav button.owl-next{ padding:10px 0px 10px 10px !important; } main .owl-carousel.content-item .owl-nav button.owl-prev:before, main .owl-carousel.content-item .owl-nav button.owl-next:before{ width:auto; } main .owl-carousel.content-item .owl-nav button.owl-prev:before{ content:url(../images/icons/icon-slider-klein-prev-black.svg); } main .owl-carousel.content-item .owl-nav button.owl-next:before{ content:url(../images/icons/icon-slider-klein-next-black.svg); } main .owl-carousel.content-item .owl-nav button span{ display:none; } /* Zähler Dots */ main .owl-carousel.content-item .owl-dots{ display:flex; flex-direction:row; justify-content: center; align-items: center; height:45px; left:0; right:0; margin:0 auto; width:80%; position:absolute; bottom:0; } main .owl-carousel.content-item .owl-dot{ background-color:var(--secondary); width:12px; height:12px; border-radius:12px; } main .owl-carousel.content-item .owl-dot.active{ background-color:var(--primary); } main .container-fluid.bg-primary .owl-carousel.content-item .owl-dot.active{ background-color:var(--dark); } main .owl-carousel.content-item .owl-dot + .owl-dot{ margin-left:15px; } @media (min-width:0px) and (max-width:575px) { main .owl-carousel.content-item .owl-dot + .owl-dot{ margin-left:5px; } } /* Inhalte */ main .owl-carousel .owl-item .card { height:100%; } main .owl-carousel .owl-stage, main .owl-carousel .owl-item{ display:flex; flex-direction:row; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- NEWS - VERANSTALTUNGEN ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- Newsslider Startseite - Highlights ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ @media (min-width:0px) and (max-width:575px) { .owl-stage .owl-item .news-slider-item, .owl-stage .owl-item .news-slider-item a { max-height:425px; height:425px; } } @media (min-width:576px) and (max-width:767px) { .owl-stage .owl-item .news-slider-item, .owl-stage .owl-item .news-slider-item a { max-height:425px; height:425px; } } @media (min-width:768px) and (max-width:991px) { .owl-stage .owl-item .news-slider-item, .owl-stage .owl-item .news-slider-item a{ max-height:437px; height:437px; } } @media (min-width:992px) and (max-width:1199px) { .owl-stage .owl-item .news-slider-item, .owl-stage .owl-item .news-slider-item a{ max-height:407px; height:407px; } } @media (min-width:1200px) and (max-width:1399px) { .owl-stage .owl-item .news-slider-item, .owl-stage .owl-item .news-slider-item a{ max-height:452px; height:452px; } } @media (min-width:1400px) { .owl-stage .owl-item .news-slider-item, .owl-stage .owl-item .news-slider-item a{ max-height:452px; height:452px; } } .owl-stage { display:flex; } .owl-stage .owl-item .news-slider-item { /*max-height:425px; */ } .owl-stage .owl-item .news-slider-item { -webkit-box-shadow: 2px 2px 5px 2px rgba(0,0,0,0.5); box-shadow: 2px 2px 5px 2px rgba(0,0,0,0.5); } .owl-stage .owl-item .news-slider-item, .owl-stage .owl-item .news-slider-item a{ /*height:425px;*/ display: flex; flex-direction: column; } .owl-stage .owl-item .news-slider-item .card.newstext, .owl-stage .owl-item .news-slider-item .card.newstext .ce-body, .owl-stage .owl-item .news-slider-item a .card.newstext .ce-body{ height:100%; } .owl-stage .owl-item .news-slider-item .card { border:0px solid black !important; } .owl-stage .owl-item .news-slider-item .title, .owl-stage .owl-item .news-slider-item .teaser { margin-bottom:10px; } .owl-stage .owl-item .news-slider-item .card.newstext .ce-body, .owl-stage .owl-item .news-slider-item a .card.newstext .ce-body{ display:flex; justify-content: flex-end; flex-direction:column; } .owl-stage .owl-item .news-slider-item .date .big { font-size:1.75em; margin-bottom:5px; } .startseite #hero .owl-carousel .owl-stage-outer { overflow: visible; overflow:hidden; width:calc(100% + 30px); margin: 0 auto; margin-left:-15px; padding-left:15px; z-index:555; } /* Phone */ @media (min-width:0px) and (max-width:767px) { .startseite #hero .owl-carousel .owl-stage-outer { padding-top:calc(var(--section-phone-padding) / 3); padding-bottom:calc(var(--section-phone-padding) / 3); } } /* Tablet */ @media (min-width:768px) and (max-width:991px) { .startseite #hero .owl-carousel .owl-stage-outer { padding-top:var(--section-tablet-padding); padding-bottom:var(--section-tablet-padding); } } /* Desktop */ @media (min-width:992px) and (max-width:1199px) { .startseite #hero .owl-carousel .owl-stage-outer { padding-top:var(--section-desktop-padding); padding-bottom:var(--section-desktop-padding); } } /* Desktop */ @media (min-width:1200px) { .startseite #hero .owl-carousel .owl-stage-outer { padding-top:var(--section-bigdesktop-padding); padding-bottom:var(--section-desktop-padding); } } @media (min-width:0px) { /* Das mittlere Icon immer größer darstellen */ .startseite #hero .owl-item { transform-origin: center; } /* links */ .startseite #hero .owl-item:not(.active) + .owl-item.active{ animation: up-down-small 2s 0.5s ease-in-out infinite alternate-reverse both; z-index:555; } /* rechts */ .startseite #hero .owl-item.active + .owl-item.active{ animation: up-down-small 2s 1s ease-in-out infinite alternate-reverse both; z-index:555; } @keyframes up-down-small { 0% { transform: scale(1) translateY(10px); } 100% { transform: scale(1) translateY(-10px); } } @media (min-width:992px) { /* Das mittlere Icon immer größer darstellen */ .startseite #hero .owl-item { transform-origin: center; } /* links */ .startseite #hero .owl-item:not(.active) + .owl-item.active{ animation: up-down-small 2s 0.5s ease-in-out infinite alternate-reverse both; z-index:222; } /* mitte */ .startseite #hero .owl-item.active + .owl-item.active { animation: up-down-big 2s 1s ease-in-out infinite alternate-reverse both; z-index:555; } /* rechts */ .startseite #hero .owl-item.active + .owl-item.active + .owl-item.active { animation: up-down-small 2s 1.5s ease-in-out infinite alternate-reverse both; z-index:222; } @-webkit-keyframes up-down-big { 0% { transform: scale(1.175) translateY(10px); } 100% { transform: scale(1.175) translateY(-10px); } } @keyframes up-down-big { 0% { transform: scale(1.175) translateY(10px); } 100% { transform: scale(1.175) translateY(-10px); } } @-webkit-keyframes up-down-small { 0% { transform: scale(1) translateY(10px); } 100% { transform: scale(1) translateY(-10px); } } @keyframes up-down-small { 0% { transform: scale(1) translateY(10px); } 100% { transform: scale(1) translateY(-10px); } } } /* ------------------------ 627 - Veranstalung ------------------------ */ .news-slider-item.type-627 .card.newstext { background-color:var(--primary); height:auto !important; /*position:absolute; bottom:0;*/ } .news-slider-item.type-627 .card.newstext .ce-body{ padding-top:0em; min-height:190px; } .news-slider-item.type-627 .card.newstext:after { content:""; width:100%; height:90px; display:block; background: linear-gradient(0deg, rgba(var(--primary-rgb),1) 0%, rgba(var(--primary-rgb),0.7) 100%); clip-path: polygon(0 0%, 0% 100%, 100% 100%); position:absolute; top:-89px; } .news-slider-item.type-627 .date { background-color:#ffffff; padding:10px; width:90px; height:90px; border-radius:90px; position:absolute; right:30px; top:-90px; transform: rotate(-7deg); z-index:3; display:flex; justify-content: center; align-items: center; flex-direction:column; -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75); box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75); font-size:0.95em; line-height:1.15em; text-align:center; } .news-slider-item.type-627 .date .crossmonth, .news-slider-item.type-627 .date .crossyears { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; text-align:center; line-height: 1.05em; } .news-slider-item.type-627 .date .crossmonth { font-size:1em; } .news-slider-item.type-627 .date .crossyears { font-size:0.95em; } .news-slider-item.type-627 .card.newstext .ce-body a.more:hover{ color:var(--white); } .news-slider-item.type-627 .card.newstext .ce-body a.more:hover:after { content: url(../images/icons/pfeil-next-white.svg); } @media (min-width:0px) and (max-width:767px) { .news-slider-item.type-627 .card.newstext { position:absolute; bottom:0; } } /* Für Phone Trennungen zulassen */ @media (min-width:0px) and (max-width:575px) { .news-slider-text h4{ hyphens:auto; } } /* ------------------------ 627 - Ausstellung --> nur vorübergehend ------------------------ */ /* .owl-item:nth-child(6) .news-slider-item.type-627 .card.newstext , .owl-item:nth-child(16) .news-slider-item.type-627 .card.newstext { background-color:rgba(215,195,140,1); } .owl-item:nth-child(6) .news-slider-item.type-627 .card.newstext:after, .owl-item:nth-child(16) .news-slider-item.type-627 .card.newstext:after { background: linear-gradient(0deg, rgba(215,195,140,1) 0%, rgba(215,195,140,0.7) 100%); } .owl-item:nth-child(7) .news-slider-item.type-627 .card.newstext, .owl-item:nth-child(17) .news-slider-item.type-627 .card.newstext { background-color:rgba(136,177,206,1); } .owl-item:nth-child(7) .news-slider-item.type-627 .card.newstext:after, .owl-item:nth-child(17) .news-slider-item.type-627 .card.newstext:after { background: linear-gradient(0deg, rgba(136,177,206,1) 0%, rgba(136,177,206,0.7) 100%); } .owl-item:nth-child(12) .news-slider-item.type-627 .card.newstext, .owl-item:nth-child(15) .news-slider-item.type-627 .card.newstext { background-color:rgba(170,200,185,1); } .owl-item:nth-child(12) .news-slider-item.type-627 .card.newstext:after, .owl-item:nth-child(15) .news-slider-item.type-627 .card.newstext:after { background: linear-gradient(0deg, rgba(170,200,185,1) 0%, rgba(170,200,185,0.7) 100%); } */ /* ------------------------ 630 - Stellenanzeigen ------------------------ */ .news-slider-item.type-630 { background-color:var(--primary); } .news-slider-item.type-630 .newsbild img[src*=".svg"] { width:70%; margin:0 auto; padding-top:var(--card-padding); height:auto !important; } .news-slider-item.type-630 .card.newstext { background-color:transparent; } /* ---------------------------------- 628, 703, 786 - allgemein + Newsletter -------------------------------------- */ .news-slider-item.type-628, .news-slider-item.type-703, .news-slider-item.type-786{ position:relative; } .news-slider-item.type-628 .newsbild, .news-slider-item.type-703 .newsbild, .news-slider-item.type-786 .newsbild{ position:absolute; z-index:0; } .news-slider-item.type-628 .newsbild:after, .news-slider-item.type-703 .newsbild:after, .news-slider-item.type-786 .newsbild:after{ content:""; width:100%; height:100%; background: linear-gradient(0deg, rgba(0,0,0,0.75) 20%, rgba(0,0,0,0) 60%); position:absolute; z-index:1; top:0; left:0; } .news-slider-item.type-628 .newsbild, .news-slider-item.type-628 .newsbild a, .news-slider-item.type-703 .newsbild, .news-slider-item.type-703 .newsbild a, .news-slider-item.type-786 .newsbild, .news-slider-item.type-786 .newsbild a{ width:100%; height:100%; } .news-slider-item.type-628 .newsbild img, .news-slider-item.type-703 .newsbild img, .news-slider-item.type-786 .newsbild img{ object-fit: cover !important; height:100% !important; width:auto !important; } /* Wenn Bild im Querformat gezeigt wird */ .news-slider-item.type-628 .newsbild.anzeige-1:after, .news-slider-item.type-703 .newsbild.anzeige-1:after, .news-slider-item.type-786 .newsbild.anzeige-1:after{ content:""; width:100%; height:100%; background: linear-gradient(to bottom, rgba(22,30,35,0) 0%,rgba(22,30,35,0) 20%,rgba(22,30,35,1) 59%,rgba(22,30,35,1) 100%); z-index:1; top:0; left:0; } .news-slider-item.type-628 .newsbild.anzeige-1 img, .news-slider-item.type-703 .newsbild.anzeige-1 img, .news-slider-item.type-786 .newsbild.anzeige-1 img{ object-fit: none; height:auto !important; width:auto !important; display:inherit !important; } .news-slider-item.type-628 .card.newstext, .news-slider-item.type-703 .card.newstext, .news-slider-item.type-786 .card.newstext{ background-color:transparent; } .news-slider-item.type-628 .card.newstext .ce-body, .news-slider-item.type-703 .card.newstext .ce-body, .news-slider-item.type-786 .card.newstext .ce-body{ display:flex; justify-content: flex-end; flex-direction:column; } .news-slider-item.type-628 .card.newstext .ce-body, .news-slider-item.type-703 .card.newstext .ce-body, .news-slider-item.type-786 .card.newstext .ce-body{ color:#ffffff; } .news-slider-item.type-628 .card.newstext .ce-body a.more:after, .news-slider-item.type-703 .card.newstext .ce-body a.more:after, .news-slider-item.type-786 .card.newstext .ce-body a.more:after{ content: url(../images/icons/pfeil-next-white.svg); } .news-slider-item.type-628 .card.newstext .ce-body a.more:hover, .news-slider-item.type-703 .card.newstext .ce-body a.more:hover, .news-slider-item.type-786 .card.newstext .ce-body a.more:hover{ color:var(--primary); } .news-slider-item.type-628 .card.newstext .ce-body a.more:hover:after, .news-slider-item.type-703 .card.newstext .ce-body a.more:hover:after, .news-slider-item.type-786 .card.newstext .ce-body a.more:hover:after{ content: url(../images/icons/pfeil-next-primary.svg); } .news-slider-item.type-626 a, .news-slider-item.type-814 a, .news-slider-item.type-628 a, .news-slider-item.type-703 a, .news-slider-item.type-786 a{ color:var(--white); } /* ---------------------------------- 786 - allgemein + Newsletter -------------------------------------- */ .news-slider-item.type-786 .card.newstext .ce-body:before { content:"Newsletter"; margin: 0 auto 0 0; } /* ------------------------ 626 - Podcast & Video ------------------------ */ /* Podcast Text */ .news-slider-item.type-626 .card.newstext .ce-body:before, .news-slider-item.mp3 .card.newstext .ce-body:before{ content:"Podcast"; margin:0 auto; } /* Video Text */ .news-slider-item.type-814 .card.newstext .ce-body:before, .news-slider-item.youtube .card.newstext .ce-body:before { content:"Video"; margin:0 auto; } .news-slider-item.type-626, .news-slider-item.mp3, .news-slider-item.type-814, .news-slider-item.youtube{ background: linear-gradient(0deg, rgba(var(--secondary-rgb),1) 50%, rgba(var(--primary-rgb),1) 100%); } .news-slider-item.type-626 .card.newstext .ce-body, .news-slider-item.mp3 .card.newstext .ce-body, .news-slider-item.type-814 .card.newstext .ce-body, .news-slider-item.youtube .card.newstext .ce-body{ text-align:center; } .news-slider-item.type-626 .newsbild, .news-slider-item.mp3 .newsbild, .news-slider-item.type-814 .newsbild, .news-slider-item.video .newsbild{ position:relative; padding-top:var(--card-padding); align-items: center; display:flex; } .news-slider-item.type-626 .newsbild a, .news-slider-item.mp3 .newsbild a, .news-slider-item.type-814 .newsbild a, .news-slider-item.youtube .newsbild a{ width:100%; } .news-slider-item.type-626 .card.newstext, .news-slider-item.mp3 .card.newstext, .news-slider-item.type-814 .card.newstext, .news-slider-item.youtube .card.newstext{ background-color:transparent; } .news-slider-item.type-626 .card.newstext .ce-body, .news-slider-item.mp3 .card.newstext .ce-body, .news-slider-item.type-814 .card.newstext .ce-body, .news-slider-item.youtube .card.newstext .ce-body{ color:#ffffff; } .news-slider-item.type-626 .card.newstext .ce-body a.more:after, .news-slider-item.mp3 .card.newstext .ce-body a.more:after, .news-slider-item.type-814 .card.newstext .ce-body a.more:after, .news-slider-item.youtube .card.newstext .ce-body a.more:after{ content: url(../images/icons/pfeil-next-white.svg); } .news-slider-item.type-626 .card.newstext .ce-body a.more:hover, .news-slider-item.mp3 .card.newstext .ce-body a.more:hover, .news-slider-item.type-814 .card.newstext .ce-body a.more:hover, .news-slider-item.youtube .card.newstext .ce-body a.more:hover{ color:var(--primary); } .news-slider-item.type-626 .card.newstext .ce-body a.more:hover:after, .news-slider-item.mp3 .card.newstext .ce-body a.more:hover:after, .news-slider-item.type-814 .card.newstext .ce-body a.more:hover:after, .news-slider-item.youtube .card.newstext .ce-body a.more:hover:after{ content: url(../images/icons/pfeil-next-primary.svg); } .news-slider-item.type-626 .ce-body, .news-slider-item.mp3 .ce-body, .news-slider-item.type-814 .ce-body, .news-slider-item.youtube .ce-body{ display:flex; justify-content: flex-end; flex-direction:column; } /* Vorschau-Bilder in der Slider-Ansicht ausblenden, werden nur in der Listenansicht gezeigt */ .startseite .news-slider-item.type-626 .news-slider-image, .startseite .news-slider-item.mp3 .news-slider-image, .startseite .news-slider-item.type-814 .news-slider-image, .startseite .news-slider-item.youtube .news-slider-image{ display:none; } /* Podcast Icon */ .news-slider-item.type-626:before, .news-slider-item.mp3:before { margin-top:25px; background-image: url('/fileadmin/akademie/bilder/icons/icon-podcast-weiss.svg'); background-size: 30%; background-position:center; display: inline-block; width: 100%; content: ""; height: 200px; background-repeat: no-repeat; } /* Video Icon */ .news-slider-item.type-814:before, .news-slider-item.youtube:before { margin-top:25px; background-image:url("/fileadmin/akademie/bilder/icons/icon-youtube-farbig.svg"); background-size: 25%; background-position:center; display: inline-block; width: 100%; content: ""; height: 200px; background-repeat: no-repeat; } .news-slider-item.type-626 .newsbild img[src*=".svg"], .news-slider-item.mp3 .newsbild img[src*=".svg"], .news-slider-item.type-814 .newsbild img[src*=".svg"], .news-slider-item.youtube .newsbild img[src*=".svg"]{ margin:auto auto; padding-top:0; height:auto !important; } .news-slider-item.type-626 .newsbild img[src*=".svg"], .news-slider-item.mpe .newsbild img[src*=".svg"]{ width:40%; } .news-slider-item.type-814 .newsbild img[src*=".svg"], .news-slider-item.youtube .newsbild img[src*=".svg"]{ width:30%; } /* ------------------------ Links um Slideritems ------------------------ */ .ohne.boxlink:hover { text-decoration:none; color:inherit; } .ohne.boxlink:hover span.more { color:var(--white) !important; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- News und Veranstaltungen ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ /* ------------------------------------------------------------------------------------------------------ Listenansichten ------------------------------------------------------------------------------------------------------ */ /* News und Veranstaltungen */ .veranstaltungen_list_entry .teaser, /*.veranstaltungen_list_entry .datum,*/ .veranstaltungen_list_entry .ort, .veranstaltungen_list_entry .cri_event_list_ausfall, .news-list-item .teaser, .news-list-item .datum { margin-bottom: var(--abstand-ganzklein); } .veranstaltungen_list_entry .datum { margin-bottom:calc(var(--abstand-ganzklein) /2); } /* ------------------------ Veranstaltungen Liste ------------------------ */ .veranstaltungen_list_entry:not(:last-child) { margin-bottom:var(--abstand-normal); } .veranstaltungen_list_entry .event-bild .event_image_normal, .veranstaltungen_list_entry .event-bild .event_image_normal .img-center-inner, .veranstaltungen_list_entry .event-bild .event_image_normal .img-center-inner .image{ height:100%; } .veranstaltungen_list_entry .event-bild .event_image_normal .img-center-inner .image img { object-fit:cover; min-height:100%; min-width:100%; } /* Für Phone Trennungen zulassen */ @media (min-width:0px) and (max-width:575px) { .event-header .cri_event_list_titel, .event-header .cri_event_list_aufriss{ hyphens:auto; } } /* ------------------------ Meldungen Liste ------------------------ */ .news-list-view .newsbild, .news-list-view .card, .news-list-view .card .ce-body, .newsbild { height:100%; } .news-list-view .newsbild img, .newsbild img { object-fit: cover; height: 100% !important; } .news-slider-image.newsbild { height:auto; } /* Text der Meldung vertikal zentriert */ .news-list-view .news-list-item .card { /*justify-content:center;*/ } /* ------------------------ Paginierung ------------------------ */ /* Paginierung */ .pagination { justify-content: flex-end; } /* Paginierung oben */ .tx-cri-eventmodule > .pagination:first-child, .news-list-view > .pagination:first-child { margin-bottom: var(--abstand-normal); } /* Paginierung unten */ .tx-cri-eventmodule > .pagination:last-child, .news-list-view > .pagination:last-child { margin-top: var(--abstand-normal); } ul.f3-widget-paginator { display: -ms-flexbox; display: flex; padding-left: 0; list-style: none; border-radius: .25rem; } ul.f3-widget-paginator li { padding:0em; } ul.f3-widget-paginator li + li { margin-left:5px; } ul.f3-widget-paginator li .page-link { padding: 7px 10px 7px 10px; font-size:var(--font-size-small); background-color:var(--light); border:0px solid black; } /* Active */ .page-item.current.active .page-link, .page-item .page-link:hover, .next .page-link:hover{ color: #fff; background-color:var(--dark); } .page-item.current.active .page-link, .page-item .page-link:hover, .page-item.current.active .page-link a, .page-item .page-link:hover a, .next .page-link:hover, .next .page-link:hover a { color:var(--white) !important; text-decoration:none; } ul.f3-widget-paginator li.page-item:first-child .page-link { border-radius:0px; } .pagination ul.f3-widget-paginator li + li { margin-left:5px; } /* ------------------------------------------------------------------------------------------------------ Einzelansichten ------------------------------------------------------------------------------------------------------ */ /* ------------------------ Veranstaltungen Einzel ------------------------ */ /* Hintergrundfarbe falls Bild ein transparentes PNG */ .event .crieventsingle #hero figure.image { background-color:var(--light); } @media (min-width:768px) { /* Bannerbildhöhe */ .event .crieventsingle #hero .col-lg-6:nth-child(2) img { height:440px; } /* Weisses Dreieck mit Verlauf */ .event .crieventsingle #hero .grid-col-2.no-gutters.dreieck-header-event .card.bg-white:before { content:""; display:block; clip-path: polygon(0 0, 0% 100%, 100% 0); background: -moz-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */ height:100%; width:170px; position:absolute; top:-1px; right:-170px; z-index:888; height:calc(100% + 3px); } } .event .crieventsingle .event-facts div[class*="col-"]:first-child .card, .event .crieventsingle .event-facts div[class*="col-"]:first-child .card .container, .event .crieventsingle .event-facts div[class*="col-"]:first-child .card .container > div{ height:100%; } .event .crieventsingle .event-facts div[class*="col-"]:first-child .card .container, .event .crieventsingle .event-facts div[class*="col-"]:first-child .card .container > div { display: -ms-flexbox; display: flex; flex-direction:column; justify-content: space-between; } .event .crieventsingle .event-facts div[class*="col-"]:first-child .card p:not(:last-child) { margin-bottom:5px; } .event .crieventsingle .event-facts div[class*="col-"]:first-child .card .container > div + div { margin-top:var(--abstand-klein); } .event .crieventsingle .h6, .crieventsingle h6 { margin-bottom:0em; } .event .crieventsingle .kontakt-infos p { margin-bottom:3px; } .event .crieventsingle .buttons .btn { margin-right:5px; margin-top:5px; } .event .crieventsingle #hero .buttons.links { margin-top:10px; } .event .crieventsingle .anmelden .buttons.links *:first-child + * { margin-left:0px !important; } .event .crieventsingle .warteliste { display:inline; } /* Infomartionsbutton nach Warteliste-Button */ .event .crieventsingle .warteliste > *:last-child{ margin-right:5px; } /* Keine graue Linie nach Subheader */ .event .crieventsingle .subheader:after { display:none } .event .crieventsingle .logobereich figure.image , .event .crieventsingle .logobereich img { margin-bottom:0em; } /* Datumsanzeige zweizeilig */ /* zweite Zeile eingezogen */ p.datum { text-indent: -0.725em; } p.datum { margin-left: 1.5em; } @media (max-width:991px) { .dende { display:block; margin-left: 13px; } } /* PDF Faltblatt unten einblenden */ .event .crieventsingle .anmelden.unten .btn.pdf, .event .crieventsingle .anmelden.unten a.pdf, .event .crieventsingle .anmelden.unten a[href*="pdf"], .event .crieventsingle .anmelden.unten a[href*="PDF"]{ display:inline-block; } /* Links zum Thema */ .links-zum-thema .btn-small{ margin-bottom:3px; margin-right:5px; display:inline-block; } /* Shariff */ .shariff { border-top:1px solid var(--bs-body-color); padding-top:var(--abstand-normal); margin-top: var(--abstand-normal); } /* ------------------------------------------------------------------------------------------------------ Badges für Meldungen und Veranstaltungen ------------------------------------------------------------------------------------------------------ */ /* Badges Audio und Video rechts unten */ .news-list-view .news-list-item .media-div, .veranstaltungen_list_entry .media-div{ text-align:right; margin-top:10px; line-height:1.5em; } .news-list-view .news-list-item .media-div > span + span { margin-left:10px; } .media-div .badge { font-weight:400 !important; } .media-audio:before, .media-video:before, .media-meldungen:before, .media-dokumentationen:before, .media-programm:before, .media-publikationen:before{ font-family:var(--font-awesome-regular); margin-right:5px; } .media-audio:before { content:var(--link-audio-icon); } .media-video:before { content:var(--link-video-icon); } .media-meldungen:before { content:var(--link-meldungen-icon); } .media-dokumentationen:before { content:var(--link-dokumentationen-icon); } .media-programm:before { content:var(--link-programm-icon); } .media-publikationen:before { content:var(--link-publikationen-icon); } .media-div .badge { background-color:rgba(0,0,0,0.075); } /* ------------------------ Ansprechpartner Darstellung ------------------------ */ /* Rundes Bild Ansprechpartner */ .card.ansprechpartner { overflow:visible; } .ansprechpartner .ce-textpic, .ansprechpartner .ce-textpic .ce-gallery, .ansprechpartner .ce-textpic .ce-gallery .ce-row { overflow:visible; } .ansprechpartner .ce-textpic { display:flex; justify-content: center; align-items: center; flex-direction:column; } .ansprechpartner .ansprechpartner-bild { -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5); -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5); box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5); border-radius:100%; width:150px !important; height:150px !important; border-radius:100%; overflow:hidden; display:block !important; margin-bottom:0em; } .ansprechpartner .ce-gallery { margin-bottom:0px; } .ansprechpartner .ansprechpartner-bild img { object-fit:cover; height:100%; } .ansprechpartner .ce-gallery, .ansprechpartner .ce-textcontent { float:left; } .ansprechpartner a, .ansprechpartner .mail, .ansprechpartner .bio, .ansprechpartner .tel, .ansprechpartner .fax{ display:block; } /* Container Card */ /* Ansprechpartner Card */ .card.ansprechpartner .card-body { padding:0em; } .card.ansprechpartner .ce-gallery + .ce-textcontent { padding:var(--card-padding) 0em 0em 0em; } .tt_address_list .row > .vcard > .card.ansprechpartner { margin-bottom:var(--abstand-normal); } div[class*="col-"] .frame-type-list:last-child .tt_address_list .row > .vcard > .card.ansprechpartner { margin-bottom:0em; } /* Ansprechpartner aufklappbar in Veranstaltungen */ .crieventsingle .col-lg-4 .card-body.accordion-body { padding: 0em; } /* .crieventsingle .col-lg-4 .accordion .card-header { background-color: var(--primary); } */ /* Ansprechpartner in schmaler Spalte über ganze Breite */ .col-lg-4 .tt_address_list .col-lg-4 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } /* ------------------------ Eigene Klassen durch Faltblatt importiert ------------------------ */ .schattiert {background-color:var(--primary-hell);padding:2px 4px 2px 4px;display: inline-block;} /* Programm */ .details_agenda_tag_titel {margin-bottom:10px;background-color:var(--secondary);color:white;padding:2px 4px 2px 4px;display:inline-block;} .details_agenda_tag_text {margin-bottom:7px;} .agenda_tag_programmpunkt {} .programmpunkt_uhrzeit {text-align:right;} .programmpunkt_inhalt {} .programmpunkt_referent {font-style:italic;} /* Referenten */ .details_referent {float:left;margin-bottom:7px;} .details_referent span {float:left;} .referent_supertitel {font-weight:bold;} .referent_titel {font-weight:bold;} .referent_text {} /* Tagungsleitung */ /* Gelöscht 01.12.2025 .details_tagungsleitung {float:left;} .details_tagungsleitung span {float:left;} .tagungsleitung_titel {font-weight:bold;} .tagungsleitung_text {} */ .details_tagungsleitung {} .details_tagungsleitung span {} .tagungsleitung_titel {font-weight:bold;} .tagungsleitung_text {display:block;margin-bottom:10px;} .sonstigesbilder img { width:49%; margin-right:2%; } /* Zur Teilnahme */ .details_tninfo {float:left;} .details_tninfo span {float:left;} .tninfo_titel {font-weight:bold;} .tninfo_text {} .programmpunkt_inhalt > div[class*="programmpunkt_"] { margin-bottom:0em !important; } #details-agenda hr { margin-top: 10px; margin-bottom: 10px; } /* ------------------------ Meldungen Liste ------------------------ */ .news-single .news-footer { margin-top:var(--abstand-normal); } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- PUBLIKATIONEN - TT PRODUCTS ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ /* --------------------------------------------------- Listenansicht --------------------------------------------------- */ .publikation-list-item + .publikation-list-item { margin-top:var(--abstand-normal); } .publikation-image { position:relative; } .publikation-image .image { margin-bottom:0em !important; } .publikation-image img { border:1px solid var(--light); } .publikation-image { position:relative; } .publikation-list-item .header{ margin-bottom:0em !important; } .publikation-list-item .tt_products_list_item_daten { margin-bottom: var(--abstand-ganzklein) !important; } .publikation-list-item .isbn13, .publikation-single-item .isbn13 { margin-bottom:0em; } .publikation-list-item .tt_products_list_item_daten, .publikation-single-item .tt_products_list_item_daten, .publikation-list-item .preis, .publikation-single-item .preis, .publikation-list-item .nichtlieferbar.lieferung, .publikation-single-item .nichtlieferbar.lieferung{ margin-bottom:var(--abstand-klein) !important; } /* Auf Handy ausblenden */ @media (min-width:0px) and (max-width:767px) { .publikation-list-item .isbn13, .publikation-list-item .preis, .publikation-list-item .lieferung, .publikation-list-item .nichtlieferbar, .publikation-list-item .bestellen, .publikation-list-item .anfragen, .publikation-list-item .zusatzlink, .publikation-list-item .weitere-angaben{ display:none; } } /* --------------------------------------------------- Einzelansicht --------------------------------------------------- */ @media (min-width:0px) and (max-width:575px) { .publikation-single-item .publikation-image { margin-top:var(--abstand-gross) !important; } } /* Störer rund Footer */ .button { position:absolute; padding:25px; display:flex; align-items: center; transform: rotate(-7deg); -webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.35); -moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.35); box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.35); } .button img { max-width:75%; width:75%; height:auto; margin:0 auto; } .rund { border-radius:100%; } footer .button { width:200px !important; height:200px !important; background-color:var(--white); color:var(--bs-body-color); } footer .button p { line-height:1em; } /* Störer allgemein */ .stoerer { background-color:var(--danger); color:var(--white); padding:5px; transform: rotate(-7deg); /*text-transform:uppercase;*/ /*font-size:var(--font-size-small);*/ font-weight:500; position:absolute; line-height:1em; box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.25) } /* Störer Liste Publikationen */ .publikation-list-item .neuerscheinung.stoerer, .publikation-list-item .vorankuendigung.stoerer, .publikation-list-item .stoerer { top:-10px; left:0px; z-index:4; } /* Störer Einzelansicht Publikationen */ .publikation-single-item .vorankuendigung.stoerer, .publikation-single-item .stoerer { transform:scale(1.25) rotate(-7deg); transform-origin: left top; top:-10px; left:0px; z-index:4; } /* Störer Liste Veranstaltungen */ .veranstaltungen_list_entry .cri_event_list_ausfall.stoerer, .veranstaltungen_list_entry .cri_event_list_verschoben.stoerer, .veranstaltungen_list_entry .stoerer{ top:-10px; left:10px; z-index:4; } /* Störer Einzelansicht Veranstaltungen */ .crieventsingle .cri_event_list_ausfall.stoerer, .crieventsingle .cri_event_list_verschoben.stoerer, .crieventsingle .stoerer{ top:-5px; right:45px; transform:scale(1.25) rotate(-7deg); transform-origin: left top; z-index:999; } /* ------------------------ EXTENSIONS (CR 06.03.2023) ------------------------ */ .shariff-button .fab , .shariff-button .share_text { color:white; } .weiss { color:white !important; } .f3-widget-paginator li { list-style:none; display:inline; padding:0px 10px 0px 10px; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- LINKTREE ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ body.linktree { font-size:1em; } .linktree header.header, .linktree footer, .linktree .suchbereich{ display:none; } .linktree main { padding-top: 0px; } .linktree h1 { font-size:1.25em; font-family: var(--bs-font-sans-serif); font-weight: 900; font-style: normal; font-display: swap; } .linktree header + main h2 { font-size: 1em; } .linktree .grid-container.thumbnails > .container { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .linktree .grid-container.thumbnails > .container > .frame { display:flex; flex-direction:column; -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%; } .linktree .grid-container.thumbnails > .container > div { margin-top: 0px; border:1px solid white; } .linktree .container, .linktree .container-fluid, .linktree .container-lg, .linktree .container-md, .linktree .container-sm, .linktree .container-xl { max-width:767px; width: 100%; padding-right: 4px; padding-left: 4px; margin-right: auto; margin-left: auto; } .linktree main .content > .container-fluid { padding-top:25px; padding-bottom:25px; } /* ---------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- ANPASSUNGEN TAGUNGSHAUS ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------------------------------- */ body.tagungshaus { --primary: #fbb600; --mainnavactivelink: #fbb600; --linkhover: #fbb600; --footerlinkhover: #fbb600; --swiper-theme-color:#fbb600; --swiper-pagination-color:#fbb600; /* Carousel Colors */ --carousel-pagination-color:#fbb600; --primary-rgb: 251, 182, 0; } @media (min-width: 992px) { body.tagungshaus .navbar-ebene { flex-direction: column; align-items: flex-end; } body.tagungshaus .navbar-ebene .navbar { order: 2; } body.tagungshaus header .tools { margin-bottom: var(--abstand-klein); } } } /* Header durchscheinend */ body.tagungshaus header.mit-banner:not(.sticky) { background-color:transparent; } body.startseite.tagungshaus #hero { padding-top:0; padding-bottom:0; } body.startseite.tagungshaus #hero > div { z-index: 0; } /* h2 im Hero weiß hinterlegt */ body.startseite.tagungshaus #hero .highlight { line-height:1em; background-color:rgba(255,255,255,0.75); padding:3px 8px 3px 8px; } /* --------------------------------------------------- Hero Slider Bereich --------------------------------------------------- */ /* Hero Slider */ /* 70% der Browserhöhe */ body.tagungshaus.startseite #hero, body.tagungshaus.startseite #hero .grid-slider, body.tagungshaus.startseite #hero .grid-slider .owl-carousel, body.tagungshaus.startseite #hero .grid-slider .owl-carousel .owl-stage-outer *:not(h2):not(.ce-body):not(p):not(a), body.tagungshaus.startseite #hero > .grid-container, body.tagungshaus.startseite #hero > .grid-container .container-fluid, body.tagungshaus.startseite #hero > .grid-container .container-fluid .frame/*, body.tagungshaus.startseite #hero > .grid-container .container-fluid .frame .ce-body*/{ height:70vh; min-height:600px; } /* Hero Dreiecke */ body.tagungshaus.startseite #hero:after, body.tagungshaus.startseite #hero::before { content: none; } /* Dreiecke Blau - Primary Gelb ist auskommentiert */ body.tagungshaus.startseite #hero .grid-slider .owl-stage-outer:after, body.tagungshaus.startseite #hero .grid-container[class*="backgroundimage"]:after { content: ""; background: linear-gradient(0deg, rgba(var(--secondary-rgb),1) 0%, rgba(var(--secondary-rgb),0) 90%); /*background: linear-gradient(0deg, rgba(var(--primary-rgb),1) 0%, rgba(var(--primary-rgb),0) 90%);*/ z-index: 1; opacity: 0.6; } #hero::after { background: linear-gradient(0deg, rgba(var(--secondary-rgb),1) 0%, rgba(var(--secondary-rgb),0) 90%); /*background: linear-gradient(0deg, rgba(var(--primary-rgb),1) 0%, rgba(var(--primary-rgb),0) 90%);*/ } /* Verlauf Grau */ body.tagungshaus #hero .grid-container[class*="backgroundimage"]:before { content: ""; width: 100%; height: 450px; background: linear-gradient(180deg, rgba(34,34,34,0.8) 25%, rgba(34,34,34,0) 100%); /*background: linear-gradient(180deg, rgba(var(--dark-rgb),1) 25%, rgba(var(--dark-rgb),0) 100%);*/ position: absolute; display: block; left: 0; top: 0; z-index: 1; } /* --------------------------------------------------- Logo --------------------------------------------------- */ @media (min-width: 0px) { body.tagungshaus header.header .logo-content img { height:calc(var(--navigationheight-phone) - (2.75* var(--nav-abstand-phone))); width:auto; } body.tagungshaus header.header.sticky .logo-content img { height:calc(var(--navigationheight-phone) - (2.75* var(--nav-abstand-phone))); width:auto; } } @media (min-width: 768px) { body.tagungshaus header.header .logo-content img { height:calc(var(--navigationheight-phone) - (2* var(--nav-abstand-phone))); width:auto; } body.tagungshaus header.header.sticky .logo-content img { height:calc(var(--navigationheight-phone) - (2* var(--nav-abstand-phone))); width:auto; } } /* --------------------------------------------------- Animation --------------------------------------------------- */ body.tagungshaus.startseite #hero .grid-slider .owl-item:not(.active) + .owl-item.active{ transform:none; animation:none; } /* --------------------------------------------------- Text Hero ausrichten --------------------------------------------------- */ /* Text vertikal zentriert, optisch etwas nach oben verschoben */ body.tagungshaus #hero .frame.banner-highlight-slogan { position:absolute; z-index:2; } body.tagungshaus #hero .grid-slider .frame.banner-highlight-slogan, body.tagungshaus #hero > .grid-container .container-fluid .frame.banner-highlight-slogan{ display:flex; justify-content: center; flex-direction:column; } /* Oben ausrichten */ body.tagungshaus #hero .grid-slider .frame.banner-highlight-slogan.justify-content-start, body.tagungshaus #hero > .grid-container .container-fluid .frame.banner-highlight-slogan.justify-content-start{ justify-content: start !important; padding-top:250px; } body.tagungshaus #hero .grid-slider .owl-carousel .owl-stage-outer{ padding-top:0em; padding-bottom:0em; } /* --------------------------------------------------- Hero Slider Dots Slider --------------------------------------------------- */ body.tagungshaus #hero .grid-slider .owl-dots { position: absolute; z-index: 888; width: 100%; height: 50px; bottom: 50px; } /* --------------------------------------------------- Hero Slider Navi-Pfeile Slider --------------------------------------------------- */ /* Stand der Pfeile */ @media (min-width: 0px) { body.tagungshaus #hero .grid-slider .owl-nav { margin: auto auto; width: calc(100% - 30px); } } @media (min-width: 576px) { body.tagungshaus #hero .grid-slider .owl-nav { width: calc(540px + 80px); } } @media (min-width: 768px) { body.tagungshaus #hero .grid-slider .owl-nav { width: calc(720px + 80px); } } @media (min-width: 992px) { body.tagungshaus #hero .grid-slider .owl-nav { width: calc(960px + 80px); } } @media (min-width: 1200px) { body.tagungshaus #hero .grid-slider .owl-nav { width: calc(1140px + 80px); } } /* Aussehen mit Schatten */ body.tagungshaus #hero .grid-slider .owl-nav .owl-next { filter: drop-shadow(0px 0px 7px rgba(0, 0, 0, 1)); } body.tagungshaus #hero .grid-slider .owl-nav .owl-prev { filter: drop-shadow(0px 0px 7px rgba(0, 0, 0, 1)); } @media (min-width: 992px) { div[class*="col-"] > div[class*="col-lg-12"] { padding-left:0em; padding-right:0em; } .toolbar-content a[href='/barrierefreiheit']{margin-top:1em !important} } .weiss { color:white !important; } .news-single iframe {max-width:100%;height:auto;} .news-single .anzeige-2 iframe {height:revert-layer} .tx-cri-eventmodule a[disabled='disabled'] {background-color:#f0f0f0 !important;pointer-events:none;} .tx-cri-eventmodule a.valid {background-color:#3dd02e !important;} .tx-cri-eventmodule a.invalid {background-color:#d5053a !important;pointer-events:none;} .powermail-errors-list {color:#d5053a !important} select, option { font-family: 'Fira Sans', Verdana, Arial,sans-serif; font-size:90%; } .mediarv a:before {content:"" !important} .event-buttons p, .anmelden.unten p {display:inline-block;} @media (min-width: 576px) { .event .crieventsingle .anmelden.unten .btn.pdf, .event .crieventsingle .anmelden.unten a.pdf, .event .crieventsingle .anmelden.unten a[href*="pdf"], .event .crieventsingle .anmelden.unten a[href*="PDF"] { display: inline-block; } } /* VORÜBERGEHEND RAUS ANFORDERUNG BAS 26.06.2024 */ .tagungshaus .sprachauswahl .sprache {display:none !important;} main .newsbild figure {margin:0em} header a.level1:before {content:"" !important} a:focus {outline: 2px dotted #999999} a:focus img {border: 2px dotted #999999} input:focus {outline: 2px dotted #999999}