:root{
--hauptbreite: 840px;
--gesamtbreite_schmal: 1230px;
--gesamtbreite: 1325px;
}
/* */
/* */
/* */
#main_bg {
/* background: right 0% no-repeat url("../images/main_bg.png"), linear-gradient( #FFFFFF 260px, var(--hellesMint) 5%); */
background: linear-gradient( #FFFFFF 290px, var(--hellesMint) 5%);
/* display: flex; */
/* justify-content: center; */
/* border: 2px solid aqua; */
}
/* ============ desktop view ============ */
@media (min-width: 1230px) {
#main_bg { display: flex; justify-content: center;} }
/* */
/* ============ desktop view ============ */
@media all and (min-width: 442px) {
#main_bg {
background: linear-gradient( #FFFFFF 270px, var(--hellesMint) 5%);
}
}
/* ============ desktop view ============ */
@media all and (min-width: 815px) {
#main_bg {
background: linear-gradient( #FFFFFF 260px, var(--hellesMint) 5%);
}
}
/* ============ desktop view ============ */
@media all and (min-width: 992px) {
#main_bg_baum {
background: right 0% no-repeat url("../Images/main_baum_bg_halb.png");
background-size: 265px;
max-width: var(--gesamtbreite_schmal);
/* border: 2px solid deep pink; */
}
}
@media (min-width: 1230px) {
#main_bg_baum {
background: right 0% no-repeat url("../Images/main_baum_bg.png");
background-size: 415px;
width: 100%;
max-width: var(--gesamtbreite);
/* border: 2px solid orange; */
}
}
/* */
#header {
display: flex;
align-items: center;
justify-content: center;
max-width: 100%;
min-height: 260px;
/* border: 2px solid indigo; */
}
@media all and (min-width: 992px) {
#header {
justify-content: left;
max-width: 1100px;
}
}
/* */
#logo {
/* padding: 0px ; */
margin: 0px 10px 0px 10px;
}
#logo img {
width:190px;
height: auto;
}
/* */
/* */
#teaser {
padding-left: 0px;
width: 100%;
/* overflow: hidden; */
}
/* @media all and (min-width: 992px) { #teaser{ padding-left: 0px; } } */
@media all and (min-width: 1230px) { #teaser{ padding-left: 15px; } }
/* */
/* */ /******* Sekundäres LOGO *******/
#logo_baum_krone { display: none; }
#logo_baum_ecke { display: none; }
/* ============ desktop view ============ */
@media all and (min-width: 992px) {
#logo_baum_krone { display: none; }
#logo_baum_ecke {
display: flex;
align-items: center;
justify-content: flex-end;
position: absolute; left: 0px;
width: 100%;
/* max-width: 1230px; */
height: 1px;
z-index: 1;
margin-top: 12px;
}
#logo_baum_ecke img {
height: 272px;
width: auto;
}
}
@media all and (min-width: 1230px) {
#logo_baum_krone {
position: absolute;
display: flex;
align-items: center;
justify-content: flex-end;
width: 100%;
max-width: var(--gesamtbreite);
height: 1px;
z-index: 1;
margin-top: 12px;
}
#logo_baum_krone img {
height: 272px;
width: auto;
}
#logo_baum_ecke { display: none; }
}
/* */
/* */
/* */
#horiz_linie {
position: absolute;
left: 0px;
width: 100%;
height: 5px;
border-top: 2px solid var(--akzent);
}
/* */
/* */
main {
display: flex;
justify-content: left;
border-top: 2px solid var(--akzent);
max-width: 1100px;
/* border: 2px solid red; */
}
main.forum {
display: flex;
justify-content: left;
border-top: 2px solid var(--akzent);
max-width: none;
/* border: 2px solid red; */
}
/* */
#left {
position:relative;
margin-top: -30px;
border-right: 2px solid var(--akzent);
}
/* */
/* */
/* */
/* */
/* */
/* */
/* */
/* */
/******* NAVIGATION *******/
#mynavbarcontainer {
display: flex;
/* align-items: center; */
justify-content: center;
/* width: var(--gesamtbreite); */
}
#navbar_mobil {
padding: 10px;
}
#navbar_mobil img {
width: 190px;
height: auto;
}
.navbar-toggler-icon {
height: 2em;
}
#navbar_mobil {
.mysubnav_dropdown {
padding: 0px 0px 0px 10px;
background-color: var(--dunklesMint);
}
.dropdown-item {
background-color: var(--dunklesMint);
padding: 0px 0px 0px 10px;
}
}
.navbar .active .nav-link:hover, .navbar .active .nav-link:focus,
.nav-link:hover, .nav-link:focus {
/* color: var(--linkaktiv); */
/* background-color: var(--submenu_bg); */
}
.navbar-nav .show > .nav-link, .navbar-nav .nav-link.active {
/* color: var(--linkfarbe); */
}
.navbar .active {
/* color: var(--linkaktiv); */
/* background-color: var(--akzent); */
/* background-color: var(--hellesMint); */
}
.navbar .active:hover, .navbar .active:focus {
/* background-color: none; */
}
/* ============ desktop view ============ */
@media all and (min-width: 992px) {
/* .navbar .active:hover, .navbar .active:focus { */
}
.navbar .active .nav-link {
/* color: var(--linkaktiv); */
/* background-color: var(--linkhintergrund); */
}
.navbar_onmobil { display: flex; }
.navbar_ondesktop { display: none; }
/* ============ desktop view ============ */
@media all and (min-width: 992px) {
.navbar_onmobil { display: none; }
.navbar_ondesktop { display: flex; }
}
/******* TEASER *******/
#teaser img {
/* height: 210px; */
/* width: 840px; */
/* height: auto; */
}
/******* Sub-Navigation *******/
#submenu {
padding: 10px 0px 0px 0px;
}
/* .stay-open {display:block !important;} */
.dropdown-toggle::after {
margin-left: 3.5em;
border-top: 0.4em solid;
border-right: 0.4em solid transparent;
border-left: 0.4em solid transparent;
color: var(--akzent);
}
#submenu .navbar-nav { margin-left: 0px; }
#submenu .nav-item { margin-left: 0px; padding-bottom: 3px; }
#submenu .nav-link { padding: 10px 10px 10px 10px; }
#submenu_teaser img {
width: 225px;
height: auto;
}
.dropdown-menu {
margin: 0px 0px 0px 0px;
text-decoration: none;
/* background-color: var(--linkfarbe); */
background-color: var(--hellesMint);
border: 0px solid var(--linkfarbe);
-webkit-border-radius:0 0px 7px 7px;
-moz-border-radius:0 0px 7px 7px;
border-radius:0 0px 7px 7px;
}
/* ============ desktop view ============ */
@media all and (min-width: 992px) {
.dropdown-menu { margin: 0px 0px 0px 20px; }
}
.dropdown-menu .nav-link {
/* color: var(--akzent); */
/* background-color: var(--linkfarbe2); */
padding: 10px;
}
.dropdown-menu .nav-item.active .nav-link {
/* color: var(--linkaktiv); */
}
/* @media (min-width: 576px) */
/* @media (min-width: 768px) */
/* @media (min-width: 992px) */
/* @media (min-width: 1200px) */
/* @media (min-width: 1400px) */
/******* Linke Spalte - SubNavigation *******/
#abstand { height: 17px;}
.collapse_onmobile { display: none; }
.collapse_ondesktop { display: block; }
/* ============ desktop view ============ */
@media all and (min-width: 992px) {
.collapse_onmobile { display: block; }
.collapse_ondesktop { display: none; }
}
/******* CENTER CONTENT *******/
.container {
/* border: 2px solid blue; */
/* margin-right: auto !important; */
/* margin-left: auto !important; */
}
#center_content {
/* margin: oben rechts unten links */
/* margin-left: 0px; */
padding: 0px 0px 0px 0px;
/* margin-left: 10px; */
margin-left: 10px;
margin-right: 10px;
width: 100%;
/* background: var(--center_bg); */
/* border: 2px solid blue; */
}
.accordion-body {
display: flex;
flex-direction: column;
}
.accordion-header {
margin-top: 0;
}
.accordion-item {
background: transparent;
border: 0px solid var(--akzent);
}
.accordion-button {
font-size: inherit;
color: var(--dunklesGruen);
/* background-color: var(--blasserAkzent); */
background-color: transparent;
/* border-bottom: 2px solid var(--akzent); */
/* box-shadow: inset 0 calc(-1 * 1px) 0 var(--akzent); */
padding: 1rem 1rem 1rem 1rem;
}
.accordion-button:not(.collapsed), .accordion-button:hover {
color: var(--BlauGrau);
background-color: var(--dunklesMint);
box-shadow: inset 0 calc(-1 * 2px) 0 var(--akzent);
}
.accordion-button:focus {
z-index: 3;
border-color: var(--akzent);
outline: 0;
box-shadow: inset 0 calc(-1 * 2px) 0 var(--akzent);
/* box-shadow: var(--akzent); */
}
.accordion-item:first-of-type .accordion-button {
border-top-left-radius: var(--bs-accordion-inner-border-radius);
border-top-right-radius: var(--bs-accordion-inner-border-radius);
}
.accordion-button::after {
/* background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fe3094'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); */
background-image: url('../Icons/chevron-down.svg');
width: 25px;
height: 25px;
background-size: 25px 25px;
filter: invert(38%) sepia(72%) saturate(4864%) hue-rotate(312deg) brightness(101%) contrast(99%);
}
.accordion-button:not(.collapsed)::after {
/* background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fe3094'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); */
background-image: url('../Icons/chevron-down.svg');
/* background-size: 50px 50px; */
}
/* ============ desktop view ============ */
@media all and (min-width: 992px) {
.accordion-body {
flex-direction: row;
}
.accordion-right { padding-left: 25px; padding-right: 25px; width: 38%; }
}
/*** *** Anmeldung Formulare *** ***/
.form-group {
margin-top: 13px;
margin-bottom: 13px;
border: solid 1px var(--akzent);
border-radius: .375rem;
padding: 4px;
transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
background-color: var(--blasserAkzent);
}
.form-group .input.checkbox {
margin-top: 15px;
border: solid 1px var(--akzent);
border-radius: .375rem;
padding: 4px;
background-color: var(--bs-form-control-bg);
transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
/** *** Slick Carousel *** **/
/* .slick-container { */
/* width: 100%; */
/* margin: 30px 0px 30px 0px; */
/* padding: 0px 0px 20px 0px; */
/* border: 2px solid var(--BlaetterGruen); */
/* } */
/* .slick-container [ID*="loader-slick-"] { */
/* bottom: 40px; */
/* } */
/* .slick-container .slick-slide{ */
/* height: auto!important; */
/* display: flex !important; */
/* justify-content: center; */
/* align-items: center; */
/* } */
/* .slick-track { display: flex !important; } */
#center_content a img:hover {
border: 4px solid var(--akzent);
}
.slick-container {
/* display: none; */
}
.slick-item {
/* margin: 0 5px; */
/* background-color: transparent; */
/* aspect-ratio: 1.2/1; */
/* max-width: 280px; */
}
.slick-slide figure {
margin: 0 5px;
}
.slick-slider .slick-img {
height: 200px;
width: auto;
min-width: auto;
}
html.eovzizy.idc0_350 body div#main_bg div#main_bg_baum main div#center_content div.frame-default div#slickid-6537.slickdefault.slick-initialized.slick-slider.slick-dotted button.slick-next.slick-arrow
.slick-prev:before { content: url('../Icons/chevron-back-outline.svg'); }
.slick-next:before { content: url('../Icons/chevron-forward-outline.svg'); }
.slick-prev:before, .slick-next::before {
display: inline-block;
width: 1em;
height: 1em;
filter: invert(38%) sepia(72%) saturate(4864%) hue-rotate(312deg) brightness(101%) contrast(99%);
}
.slick-container [ID*="loader-slick-"] {
display: none;
}
.slick-dots {
bottom: 0px;
}
.slick-slider .slick-dots li {
margin: 0 13px;
}
.slick-slider .slick-dots li button::before {
height: 3em;
width: 3em;
}
.slick-dots li button::before {
content: "";
background: url('../Icons/remove-outline.svg');
background-size: contain !important;
/* filter: invert(38%) sepia(72%) saturate(4864%) hue-rotate(312deg) brightness(101%) contrast(99%); */
filter: brightness(0) saturate(100%) invert(36%) sepia(68%) saturate(4650%) hue-rotate(312deg) brightness(101%) contrast(99%);
}
.slick-dotted.slick-slider {
margin-bottom: 40px;
padding-bottom: 4px;
}
.lb-nav a.lb-next {
width: 38%;
background: url('../Icons/chevron-forward-outline.svg') right 48% no-repeat;
background-size: 3em 3em;
/* filter: invert(38%) sepia(72%) saturate(4864%) hue-rotate(312deg) brightness(101%) contrast(99%); */
filter: brightness(0) saturate(100%) invert(36%) sepia(68%) saturate(4650%) hue-rotate(312deg) brightness(101%) contrast(99%);
}
.lb-nav a.lb-prev {
width: 62%;
background: url('../Icons/chevron-back-outline.svg') left 48% no-repeat;
background-size: 3em 3em;
/* filter: invert(38%) sepia(72%) saturate(4864%) hue-rotate(312deg) brightness(101%) contrast(99%); */
filter: brightness(0) saturate(100%) invert(36%) sepia(68%) saturate(4650%) hue-rotate(312deg) brightness(101%) contrast(99%);
}
.lb-data .lb-close {
filter: brightness(0) saturate(100%) invert(36%) sepia(68%) saturate(4650%) hue-rotate(312deg) brightness(101%) contrast(99%);
/* filter: invert(38%) sepia(72%) saturate(4864%) hue-rotate(312deg) brightness(101%) contrast(99%); */
}
/******* CENTER_CONTENT --> Überschriften *******/
#center_content img {
/* align: center; */
/* max-width: 98%; */
/* height: auto; */
border: 2px solid var(--linkfarbe);
}
#center_content div.slick-track figure.image img {
box-sizing:content-box;
}
#center_content a img {
/* align: center; */
/* max-width: 98%; */
/* height: auto; */
border: 4px solid var(--linkfarbe);
}
hr {
border-top: 2px solid;
width: 80%;
opacity: 1;
color: var(--akzent);
text-align: center;
margin-left: 10%;
margin-bottom: 2.5rem;
}
/** ** Fluid-Grid 2Spalten ** **/
/* .clearfix::after { */
/* content: ""; */
/* clear: both; */
/* display: table; */
/* } */
.float { float: left; }
/* .clear { clear: both; } */
.center_content_inner { width: 100%; }
.center_content_left { width: 100%; }
.center_content_right { padding-left: 0px; text-align: center; width: 100%; }
/*** *** Textelemente mit Bildern *** ***/
/*** Layout 01 ***/
/* ============ desktop view ============ */
@media all and (max-width: 442px) {
.frame-type-textpic.frame-layout-1 .ce-textpic.ce-right .ce-bodytext {
clear: both;
}
.ce-intext.ce-right .ce-gallery {
margin-right: 20%;
}
}
@media all and (min-width: 815px) {
}
@media all and (min-width: 992px) {
}
@media (min-width: 1230px) {
}
/*** *** Tabellen responsive Anpassungen *** ***/
.frame-type-text, .frame-type-table {
container: card / inline-size;
/* width: 35em; */
/* Nur zum Testen: Verringern Sie den Wert auf <30em! */
}
.frame-type-text, .frame-type-table {
table {
width: 100%;
}
table.ce-table {
/* width: auto; */
/* table-layout: auto; */
}
table td:first-child {
text-align: right;
width: 200px;
}
table.ce-table td {
border-top: none;
/* width: 50%; */
}
table.ce-table td:first-child {
min-width: 50%;
text-align: left;
color: var(--dunklesGruen);
font-weight: 700 !important;
}
table.ce-table td:nth-child(2) {
/* width: 60%; */
}
table tr {
/* border-top: solid 1px var(--dunklesGruen); */
/* border-top: solid 1px var(--akzent); */
}
table tr:first-child {
border-top: none;
}
table tr:nth-child(even),
table.ce-table tr:nth-child(even) {
background-color: var(--blasserAkzent);
border-bottom: solid 1px var(--dunklesGruen);
border-top: solid 1px var(--akzent);
}
table h3 { font-weight: 300 !important; }
table tr td {
padding: 0px 7px 0px 0px;
vertical-align: initial;
}
}
/*** *** Newletter Tabellen Layout *** ***/
div.frame-layout-1 table.contenttable tr:nth-child(2n) {
font-size: 18px;
background-color: #fefcfd;
border-bottom: solid 1px #008e16;
border-top: solid 1px #fe3094;
}
div.frame-layout-1 table.contenttable tr td {
font-size: 18px;
padding: 4px 7px 7px 7px;
}
div.frame-layout-1 table.contenttable td:first-child {
text-align: right;
width: 200px;
}
div.frame-layout-1 .gruen, .gruen strong, strong {
color: #008e16;
}
/*** *** *** *** ***/
@container (max-width: 25em) {
.frame-type-text, .frame-type-table {
table {
text-align: center;
/* display: block; */
border-collapse: collapse;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
table td:first-child {
text-align: left;
}
table tr, table th, table td {
display: block;
}
table tr {
/* padding: 1em; */
/* border-top: 0 none; */
}
table th {
padding: 0;
}
table td {
padding: 1em 0 0;
}
}
}
/* ============ desktop view ============ */
@media all and (min-width: 992px) {
#center_content {
/* margin: oben rechts unten links */
/* margin-left: 450px; */
width: var(--hauptbreite);
margin-left: 10px;
}
#center_content .accordion-item h3 {
margin: 0px 0px 0em 0px;
padding: 0px 0px 0.4em 0px;
}
#center_content ul p {
/* margin: 0px 0px 0px 0px; */
padding: 0px 0px 0em 10px;
}
#center_content img { max-width: var(--hauptbreite); }
.center_content_left { width: 62%; }
.center_content_right { padding-left: 25px; width: 38%; }
}
@media all and (min-width: 1230px) { #center_content { margin-left: 30px; } }
#center_forum {
/* width: 1100px; */
width: 1325px;
margin-left: 0px;
margin-right: 0px;
}
#center_forum div {
/* margin-left: 10px; */
/* margin-right: 10px; */
padding: 0px 0px 0px 10px;
}
#forum_TT {
width: 100%;
height: 1300px;
}
/******* EXT Map2 - OpenStreetMap *******/
/** Kategorien, in denen die Marker eingeteilt sind, werden nicht zur Auswahl (via checkbox) angezeigt **/
form.txMaps2Form { display: none; }
.leaflet-popup-content-wrapper {
padding: 0.3px;
text-align: left;
border-radius: 12px;
}
.leaflet-popup-content {
font-size: 0.8rem;
margin: 10px 20px 10px 10px;
/* line-height: 0.9; */
}
.leaflet-popup-content .infoWindowContent p,
.leaflet-popup-content .titleWrapper {
padding: 0px 0px 0.4em 0px;
}
.leaflet-popup-content p {
margin: 0px 0px 0px 0px;
}
.leaflet-popup-content .titleWrapper strong {
color: #fe3094;
}
.leaflet-container a {
color: var(--dunklesGruen);
}
.leaflet-container a.leaflet-popup-close-button {
color: #fe3094;
}
#center_content .tx-osm {
display: flex;
justify-content: end;
}
#center_content .osm-map,
#center_content .tx-maps2 {
border: 2px solid var(--linkfarbe);
width: 100%;
}
#center_content .osm-map img,
#center_content .tx-maps2 img,
#center_content .tx-odsosm-pi1 img {
border: none;
}
.tx-odsosm-pi1 {
border: 2px solid var(--linkfarbe);
}
/* .leaflet-bar a { */
/* background: rgba(255, 255, 255, 0.8); */
/* } */
.leaflet-touch .leaflet-bar {
border: 2px solid var(--akzent);
background: rgba(255, 255, 255, 0.8);
}
.leaflet-control-zoom-in span,
.leaflet-control-zoom-out span {
color: var(--akzent);
}
.fullscreen-icon button {
background-color: var(--akzent);
}
.leaflet-right {
background-color: var(--akzent);
}
.leaflet-right a {
color: var(--akzent);
font-size: 1rem;
}
/* .leaflet-control-scale div { */
/* background-color: var(--blasserAkzent); */
/* } */
.leaflet-control-scale-line {
color: var(--akzent);
border-color: var(--akzent);
}
.leaflet-control-scale-line:not(:first-child) {
border-top-color: var(--akzent);
display: none;
}
.leaflet-bar a,
.leaflet-bar a:hover,
.leaflet-bar a:focus,
.leaflet-bar a.leaflet-disabled {
background-color: transparent;
}
.fullscreen-icon {
/* background-image: url(icon-fullscreen.svg); */
/* background-size: 26px 52px; */
/* background-color: rgba(0, 0, 0, 0); */
filter: brightness(0) saturate(100%) invert(36%) sepia(68%) saturate(4650%) hue-rotate(312deg) brightness(101%) contrast(99%);
}
/******* FOOTER *******/
#footer .center { text-align: center; width: 100%;}