.rbmf {
--rbmf-rot: #d41217;
--rbmf-rot-hell: rgba(212, 18, 23, 0.08);
--rbmf-dunkel: #2d2b2a;
--rbmf-text: #333;
--rbmf-grau: #666;
--rbmf-linie: rgba(51, 51, 51, 0.25);
--rbmf-linie-stark: rgba(51, 51, 51, 0.5);
--rbmf-flaeche: rgba(255, 255, 255, 0.6);
clear: both;
width: 100%;
margin: 0 auto;
color: var(--rbmf-text);
font-size: 18px;
line-height: 1.4;
text-align: left;
}
.rbmf p {
margin: 0;
color: var(--rbmf-text);
font-size: inherit;
}
.rbmf ul,
.rbmf li {
margin: 0;
padding: 0;
list-style: none;
} .rbmf [hidden] {
display: none !important;
} .rbmf .rbmf-sr {
position: absolute !important;
width: 1px;
height: 1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
} .rbmf :focus-visible {
outline: 3px solid var(--rbmf-dunkel);
outline-offset: 3px;
}
.rbmf .btn:focus-visible {
outline: 3px solid var(--rbmf-dunkel);
outline-offset: 3px;
opacity: 1;
} .rbmf .rbmf-status {
padding: 15px 0;
color: var(--rbmf-grau);
font-style: italic;
}
.rbmf .rbmf-hinweis {
margin: 20px 0;
padding: 15px 20px;
border-left: 4px solid var(--rbmf-rot);
background-color: var(--rbmf-flaeche);
}
.rbmf .rbmf-hinweis .btn {
margin-top: 15px;
}  .rbmf .rbmf-link {
display: inline;
width: auto;
margin: 0;
padding: 0;
border: 0;
background: none;
color: var(--rbmf-rot);
font-size: 14px;
font-weight: 700;
line-height: 1.4;
text-transform: uppercase;
letter-spacing: 1px;
cursor: pointer;
}
.rbmf .rbmf-link:hover,
.rbmf .rbmf-link:focus {
background: none;
color: #000;
} .rbmf summary {
display: block;
list-style: none;
cursor: pointer;
}
.rbmf summary::-webkit-details-marker {
display: none;
}
.rbmf summary::before {
content: "";
display: inline-block;
width: 0;
height: 0;
margin-right: 10px;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
border-left: 8px solid currentColor;
vertical-align: 1px;
}
.rbmf details[open] > summary::before {
transform: rotate(90deg);
}  .rbmf .rbmf-suche:empty {
display: none;
}
.rbmf .rbmf-suchform {
margin: 0 0 20px;
}
.rbmf .rbmf-feld {
margin: 0 0 15px;
} .rbmf .rbmf-feld > label {
display: block;
margin: 0 0 6px;
color: var(--rbmf-dunkel);
font-size: 16px;
font-weight: 700;
line-height: 1.3;
text-transform: uppercase;
letter-spacing: 1px;
} .rbmf .rbmf-eingabe {
display: flex;
gap: 10px;
} .rbmf .rbmf-suchform input[type="search"],
.rbmf .rbmf-suchform select {
box-sizing: border-box;
width: 100%;
min-height: 44px;
margin: 0;
padding: 8px 12px;
border: 1px solid var(--rbmf-linie-stark);
border-radius: 0;
background-color: var(--rbmf-flaeche);
color: var(--rbmf-text);
font-family: inherit;
font-size: 16px;
line-height: 1.3;
}
.rbmf .rbmf-suchform input[type="search"] {
flex: 1 1 auto;
min-width: 0;
}
.rbmf .rbmf-suchform input[type="search"]:focus,
.rbmf .rbmf-suchform select:focus {
border: 1px solid var(--rbmf-rot);
} .rbmf .rbmf-eingabe .btn {
flex: 0 0 auto;
width: auto;
margin: 0;
padding-right: 20px;
padding-left: 20px;
}
.rbmf .rbmf-eingabe .btn[disabled] {
opacity: 0.6;
cursor: wait;
}
.rbmf .rbmf-nahe-zeile {
margin: 0 0 15px;
} .rbmf .rbmf-nahe::before {
content: "";
display: inline-block;
width: 8px;
height: 8px;
margin-right: 8px;
border: 2px solid currentColor;
border-radius: 50%;
vertical-align: 1px;
}
.rbmf .rbmf-link[disabled] {
opacity: 0.6;
cursor: wait;
} .rbmf .rbmf-auswahlen {
display: grid;
grid-template-columns: minmax(0, 1fr);
column-gap: 20px;
}
.rbmf .rbmf-suchhinweis {
margin: 0 0 10px;
color: var(--rbmf-text);
font-size: 16px;
}
.rbmf .rbmf-suchhinweis:empty {
display: none;
}
.rbmf .rbmf-suchhinweis.rbmf-fehler {
padding: 10px 15px;
border-left: 4px solid var(--rbmf-rot);
background-color: var(--rbmf-flaeche);
} .rbmf .rbmf-ortsauswahl {
margin: 0 0 15px;
}
.rbmf .rbmf-orte {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.rbmf .rbmf-ort {
width: auto;
margin: 0;
padding: 8px 14px;
border: 1px solid var(--rbmf-linie-stark);
border-radius: 0;
background-color: var(--rbmf-flaeche);
color: var(--rbmf-text);
font-family: inherit;
font-size: 16px;
font-weight: 400;
line-height: 1.3;
text-align: left;
text-transform: none;
letter-spacing: 0;
cursor: pointer;
}
.rbmf .rbmf-ort:hover,
.rbmf .rbmf-ort:focus {
border-color: var(--rbmf-rot);
background-color: var(--rbmf-rot-hell);
color: var(--rbmf-text);
} .rbmf .rbmf-quelle {
margin: 0;
color: var(--rbmf-grau);
font-size: 13px;
}
.rbmf .rbmf-quelle a {
color: var(--rbmf-grau);
text-decoration: underline;
}
.rbmf .rbmf-quelle a:hover,
.rbmf .rbmf-quelle a:focus {
color: var(--rbmf-rot);
}
.rbmf .rbmf-filter {
margin: 0 0 20px;
border-top: 1px solid var(--rbmf-linie);
border-bottom: 1px solid var(--rbmf-linie);
}
.rbmf .rbmf-filter > summary {
padding: 15px 0;
color: var(--rbmf-rot);
font-size: 18px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 1px;
}
.rbmf .rbmf-filter-inhalt {
padding: 5px 0 20px;
}
.rbmf .rbmf-kategorie {
min-width: 0;
margin: 0 0 20px;
padding: 0;
border: 0;
}
.rbmf .rbmf-kategorie > legend {
display: block;
width: 100%;
margin: 0 0 10px;
padding: 0;
color: var(--rbmf-dunkel);
font-size: 16px;
font-weight: 700;
line-height: 1.3;
text-transform: uppercase;
letter-spacing: 1px;
}
.rbmf .rbmf-sorten-auswahl {
display: flex;
flex-wrap: wrap;
gap: 10px;
} .rbmf .rbmf-sorte {
display: inline-flex;
align-items: center;
gap: 8px;
margin: 0;
padding: 8px 14px;
border: 1px solid var(--rbmf-linie-stark);
background-color: var(--rbmf-flaeche);
color: var(--rbmf-text);
font-size: 16px;
line-height: 1.3;
cursor: pointer;
}
.rbmf .rbmf-sorte:hover {
border-color: var(--rbmf-rot);
}
.rbmf .rbmf-sorte.rbmf-aktiv {
border-color: var(--rbmf-rot);
background-color: var(--rbmf-rot-hell);
font-weight: 700;
}
.rbmf .rbmf-sorte:focus-within {
outline: 3px solid var(--rbmf-dunkel);
outline-offset: 2px;
} .rbmf .rbmf-sorte input[type="checkbox"] {
flex: 0 0 auto;
width: 18px;
height: 18px;
margin: 0;
padding: 0;
border: 0;
accent-color: var(--rbmf-rot);
cursor: pointer;
}
.rbmf .rbmf-sorte input[type="checkbox"]:focus {
border: 0;
outline: none;
}
.rbmf .rbmf-saisonal {
color: var(--rbmf-grau);
font-size: 14px;
font-weight: 400;
}
.rbmf .rbmf-filter-aktionen {
margin-top: 5px;
} .rbmf .rbmf-treffer {
margin: 0 0 10px;
font-weight: 700;
} .rbmf .rbmf-ohne {
margin: -5px 0 10px;
color: var(--rbmf-grau);
font-size: 15px;
} .rbmf .rbmf-such-aktionen {
display: flex;
flex-wrap: wrap;
gap: 10px 25px;
margin: 0 0 15px;
}
.rbmf .rbmf-liste {
border-top: 1px solid var(--rbmf-linie);
}
.rbmf .rbmf-markt {
padding: 20px 0;
border-bottom: 1px solid var(--rbmf-linie);
} .rbmf .rbmf-name {
margin: 0 0 4px;
color: var(--rbmf-text);
font-family: inherit;
font-size: 20px;
font-weight: 700;
line-height: 1.25;
text-align: left;
text-transform: none;
}
.rbmf .rbmf-typ {
margin: 0 0 6px;
color: var(--rbmf-grau);
font-size: 14px;
text-transform: uppercase;
letter-spacing: 1px;
}
.rbmf .rbmf-adresse {
margin: 0 0 10px;
} .rbmf .rbmf-entfernung {
margin: -5px 0 10px;
color: var(--rbmf-rot);
font-size: 15px;
font-weight: 700;
} .rbmf .rbmf-zeigen-zeile {
display: none;
margin: 0 0 10px;
}
.rbmf.rbmf-karte-aktiv .rbmf-zeigen-zeile {
display: block;
} .rbmf .rbmf-sorten > summary {
color: var(--rbmf-rot);
font-size: 14px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 1px;
}
.rbmf .rbmf-sorten-inhalt {
padding-top: 10px;
}
.rbmf .rbmf-sorten-gruppe + .rbmf-sorten-gruppe {
margin-top: 10px;
}
.rbmf .rbmf-sorten-kategorie {
margin: 0 0 5px;
color: var(--rbmf-dunkel);
font-size: 14px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 1px;
}
.rbmf .rbmf-sorten-liste {
display: flex;
flex-wrap: wrap;
gap: 6px;
}
.rbmf .rbmf-sorten-liste > li {
padding: 3px 10px;
background-color: rgba(51, 51, 51, 0.06);
font-size: 15px;
line-height: 1.4;
}
.rbmf .rbmf-sorten-liste > li.rbmf-gewaehlt {
background-color: var(--rbmf-rot);
color: #fff;
font-weight: 700;
} .rbmf .rbmf-mehr {
margin: 30px 0 0;
text-align: center;
}
.rbmf .rbmf-stand {
margin: 30px 0 0;
color: var(--rbmf-grau);
font-size: 14px;
}  @media (max-width: 574px) {
.rbmf {
font-size: 16px;
}
.rbmf .rbmf-name {
font-size: 18px;
}
.rbmf .rbmf-sorte {
font-size: 15px;
}
} @media (min-width: 574px) {
.rbmf .rbmf-auswahlen {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
} @media (min-width: 768px) {
.rbmf .rbmf-liste {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
column-gap: 30px;
align-items: start;
}
} @media (prefers-reduced-motion: reduce) {
.rbmf,
.rbmf *,
.rbmf *::before,
.rbmf *::after {
transition: none !important;
}
} .rbmf .rbmf-karte-bereich {
margin: 0 0 20px;
}
.rbmf .rbmf-karte-bereich:empty {
display: none;
} .rbmf .rbmf-karte-hinweis {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
gap: 15px;
box-sizing: border-box;
min-height: 200px;
padding: 20px;
border: 1px solid var(--rbmf-linie-stark);
background-color: var(--rbmf-flaeche);
}
.rbmf .rbmf-karte-hinweis p {
font-size: 16px;
}
.rbmf .rbmf-karte-hinweis a {
color: var(--rbmf-rot);
text-decoration: underline;
}
.rbmf .rbmf-karte-hinweis a:hover,
.rbmf .rbmf-karte-hinweis a:focus {
color: #000;
}
.rbmf .rbmf-karte-hinweis .btn {
margin: 0;
}
.rbmf .rbmf-karte-hinweis .btn[disabled] {
opacity: 0.6;
cursor: wait;
}
.rbmf .rbmf-karte-hinweis.rbmf-fehler {
border-left: 4px solid var(--rbmf-rot);
} .rbmf .rbmf-karte {
position: relative;
isolation: isolate;
z-index: 0;
box-sizing: border-box;
width: 100%;
height: 360px;
border: 1px solid var(--rbmf-linie-stark);
background-color: #e9e6df;
} .rbmf .leaflet-container {
font-family: inherit;
font-size: 14px;
line-height: 1.4;
text-align: left;
}
.rbmf .leaflet-container a {
color: var(--rbmf-rot);
}
.rbmf .leaflet-container.rbmf-karte:focus-visible {
outline-offset: -3px;
} .rbmf .leaflet-bar a,
.rbmf .leaflet-bar a:hover,
.rbmf .leaflet-bar a:focus {
color: var(--rbmf-dunkel);
font-family: inherit;
text-transform: none;
letter-spacing: 0;
} .rbmf .leaflet-control-attribution {
font-size: 12px;
line-height: 1.4;
}
.rbmf .leaflet-control-attribution a {
color: var(--rbmf-dunkel);
text-decoration: underline;
} .rbmf .rbmf-cluster {
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background-color: rgba(212, 18, 23, 0.25);
}
.rbmf .rbmf-cluster-zahl {
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
border-radius: 50%;
background-color: var(--rbmf-rot);
color: #fff;
font-size: 14px;
font-weight: 700;
line-height: 1;
} .rbmf .rbmf-bezugspunkt {
box-sizing: border-box;
border: 3px solid #fff;
border-radius: 50%;
background-color: var(--rbmf-dunkel);
box-shadow: 0 0 0 2px var(--rbmf-dunkel);
} .rbmf .leaflet-popup-content {
margin: 12px 16px;
font-size: 15px;
line-height: 1.4;
}
.rbmf .rbmf-popup-name {
margin: 0 0 4px;
color: var(--rbmf-text);
font-size: 17px;
font-weight: 700;
line-height: 1.25;
}
.rbmf .rbmf-popup-typ {
margin: 0 0 6px;
color: var(--rbmf-grau);
font-size: 13px;
text-transform: uppercase;
letter-spacing: 1px;
}
.rbmf .rbmf-popup-adresse {
margin: 0;
}
.rbmf .rbmf-popup-entfernung {
margin: 6px 0 0;
color: var(--rbmf-rot);
font-size: 14px;
font-weight: 700;
}
.rbmf .leaflet-container a.leaflet-popup-close-button {
color: var(--rbmf-grau);
} @media (min-width: 768px) {
.rbmf .rbmf-karte {
height: 440px;
}
} @media (min-width: 992px) {
.rbmf .rbmf-ergebnis {
display: flex;
align-items: flex-start;
gap: 30px;
}
.rbmf .rbmf-listenbereich {
flex: 1 1 0;
order: 1;
min-width: 0;
}
.rbmf .rbmf-karte-bereich {
position: sticky;
top: 20px;
flex: 1 1 0;
order: 2;
min-width: 0;
margin: 0;
}
.rbmf .rbmf-karte-bereich ~ .rbmf-listenbereich .rbmf-liste {
display: block;
}
.rbmf .rbmf-karte {
height: 600px;
max-height: calc(100vh - 40px);
}
}