@charset "UTF-8"; /*© Christof Grusdat*/

@import "../_tag_v1.css";


@font-face
{
   font-family: montserrat;
   src: url("montserrat.woff2") format('woff2')
       ,url("montserrat.woff") format('woff');
   font-display: block;
   unicode-range: U+0020-00FF, U+02B0-03FF, U+2000-2BFF, U+1D100-1D1FF;
}

@font-face
{
   font-family: cartoonist_hand;
   src: url("cartoonist_hand.woff2") format('woff2')
       ,url("cartoonist_hand.woff") format('woff');
   font-display: block;
   unicode-range: U+0020-00FF;
}


html   * {
   font-family: montserrat, sans-serif;
}

body {
   background-color: #f5f7fc;
}

#top {
   box-sizing: border-box;
   width: 100%;
   margin: 0 auto;
}


h2 {
   font-size: 20px;
}

#top > input {
   display: none;
}

div > table,
article > table {
   border: 1px solid #ff4646;
}

div > table   tr + tr:nth-child(odd),
article > table   tr + tr:nth-child(odd) {
   background-color: #fff5f5;
}

div > table   td + td,
article > table   td + td {
   border-left: 1px solid lightgray;
}

div > table   th + th,
article > table   th + th {
   border-left: 1px solid gray;
}

div > table   th,
article > table   th,
.button {
   color: #5f44a3;
   border-color: #5f44a3;
   opacity: 1;
}

.button {
   border-style: solid !important;
}
.button:hover {
   opacity: .95;
}
.button:active {
   opacity: 1;
}

.raus::after {
   content: "";
   width: 0.8em;
   height: 0.8em;
   margin-left: 0.2em;
   vertical-align: -1px;
   background-image: url("css/externer_link_v1.svg");
}


.werbung:empty {
   display: none !important;
}

.werbung > * {
   display: inline-block;
}
.werbung::after {
   content: "Werbung";
   font-size: x-small;
   display: block;
   text-align: right;
   font-style: italic;
   color: dimgray;
}


/* #Kopfbereich */
header,
footer {
   z-index: 2;
   box-sizing: border-box;
}

#kopfleiste {
   background-color: white;
   background-clip: border-box;
}

#logo {
   font-family: cartoonist_hand, Helvetica, sans-serif;
   color: black;
}

#suche {
   background-clip: border-box;
}

#suche > input:first-child {
   font-size: 18px;
   font-weight: bold;
   height: 32px;
   padding: 1px 7px 0;
   border: 0 none transparent;
   box-shadow: none;
}

#suche > input.button {
   border: 0 none transparent;
   outline-offset: -1px;
   background-image: url("css/suche_v1.svg");
   background-color: white;
}

nav {
   background-color: white;
}

nav > ul {
   padding: 5px;
   text-align: center;
   text-transform: uppercase;
   font-weight: bold;
}
nav > ul + ul {
   margin-top: 0;
   border-top: 1px solid black;
}

nav   li,
footer   li {
   display: inline-block;
   margin-left: 0;
}
nav   li + li,
footer   li + li > a {
   border-left: 1px solid black;
}
nav   li {
   padding: 0 .5em;
   font-weight: bold;
}

nav   a {
   font-size: 15px;
   color: black;
}
nav   a:hover {
   color: #ff4646;
}
nav   a:active {
   color: #ffd700;
}

header + div {
   font-size: 0;
   border-top: 10px solid #f5f7fc;
}


/* Inhaltsbereich */
main {
   text-align: center;
   background-color: #f5f7fc;
}

main > * {
   padding: 6px 10px;
   background-color: white;
}
main > * + *,
main + aside > div > * + * {
   margin-top: 10px;
}


/* Inhaltsbereich: Randbereich */
main + aside > div > * {
   padding: 5px 0;
   background-color: white;
}

main + aside   li + li {
   padding-top: .2em;
}

main + aside   ul.grob > li {
   margin-left: 7%;
}

/*main + aside   ul > li.ober::before {
   content: "\1F783";
   font-size: 10px;
   margin-left: -11px;
   width: 11px;
   vertical-align: 2px;
   font-weight: bold;
   color: gray;
}*/
main + aside   ul > li.ober ~ li {
   margin-left: 10%;
}
main + aside   ul > li.ober ~ li.ober ~ li {

   margin-left: 13%;
}

main + aside   ul > li.grp {
   margin-top: .5em;
}

main + aside   ul.grob > li > a {
   display: inline-block;
   padding: 2px 0;
}


#anbieter,
.anbieter {
   padding: 5px 0 0;
}

#anbieter > h4,
.anbieter > h4 {
   font-size: large;
   display: block;
   padding: 7px 0;
   font-weight: bold;
   text-align: center;
   color: white;
   text-shadow: 0 0 3px black;
   background-origin: border-box;
   background-size: 100% 100%;
   background-image: url("css/partner_v1.svg");
}

.anbieter   ul,
#anbieter   ul,
main > div > article,
#kein_eintrag,
#empfehlungen  > div   div,
footer > ul {
   text-align: center;
}

.anbieter   li ,
#anbieter   li {
   display: inline-block;
}

.anbieter   li > a,
#anbieter   li > a {
   line-height: 42px;
   margin-top: 3px;
   text-align: center;
   outline-offset: -1px;
}

.anbieter   li > a > *,
#anbieter   li > a > * {
   display: inline-block;
   max-width: 88%;
   line-height: 1.1;
   vertical-align: middle;
}

.anbieter > a.button,
#anbieter > a.button {
   font-size: small;
   display: block;
   padding: 5px 10px;
   border-color: gold;
   color: black;
   background-color: gold;
   opacity: .9;
   outline-offset: -1px;
}

.anbieter > a.button:hover,
#anbieter > a.button:hover {
   background-color: #ffd000;
   opacity: 1;
}


/* Hauptbereich: init */
main > div > article > h3 {
   margin-top: .6em;
   text-align: center;
}

main > div > article > p {
   font-size: 13px;
   text-align: justify;
}

#h1 {
   min-height: 45px;
   padding: 0 88px 0 1px;
   background-color: transparent;
}
#h1::after {
   content: "";
   position: absolute;
   top: 50%;
   width: 92px;
   height: 45px;
   margin: -22.5px 0 0 -6px;
   background-image: url("css/fliegerbiene_v2.svg");
}

#h1 > h1 {
   width: auto;
   line-height: 29px;
   margin-top: 6px;
   padding: 4px 10px 4px 8px;
   border-radius: 5px;
   text-align: left;
   color: white;
   background-color: #ff4646;
}

main > article:last-child {
   margin-top: 15px;
   padding: 10px;
}

main > article:last-child > h4 {
   font-weight: bold;
}

main > article:last-child   * {
   font-size: small;
}

#ergebnislos {
   font-size: larger;
   width: 320px;
   text-align: center;
   font-weight: bold;
}

#ergebnislos > img {
   margin: 0 -30px;
   vertical-align: text-bottom;
}

#banner {
   display: block;
   text-align: center;
}

/* Hauptbereich: Angebotsliste (Iframe) - h2 + a(#) + a(zeigen) + label + label + iframe */
#liste {
   display: block;
   position: relative;
   margin-top: 15px;
   padding: 0;
   background-color: transparent;
}

#liste > h2 {
   position: absolute;
   top: -1.6em;
}

#liste > a {
   background-color: goldenrod;
}

#liste > h2 + a {
   z-index: 1;
   position: fixed;
   top: 0;
   left: 1px;
}

#liste > label {
   z-index: 2;
   margin-bottom: -1.6em;
}

#liste > h2,
#liste > h2 + a,
#liste:target > a + a,
#m-liste:checked ~ header + div   #liste > a + a,
#liste > label,
#m-liste:checked ~ header + div   #liste > a + label,
#liste > iframe,
#m-liste:checked ~ header,
#m-liste:checked ~ header + div > main > *,
#m-liste:checked ~ header + div > aside,
#m-liste:checked ~ footer {
   display: none;
}

#m-liste:checked ~ header + div   #liste,
#liste:target > h2,
#m-liste:checked ~ header + div   #liste > h2,
#liste:target > h2 + a,
#liste:target > a + label,
#m-liste:checked ~ header + div   #liste > label + label,
#liste:target > iframe,
#m-liste:checked ~ header + div   #liste > iframe {
   display: block !important;
}

#m-liste:checked ~ header + div   #liste > h2 + a {
   display: none !important;
}

#m-liste:checked ~ header + div   #liste {
   position: fixed;
   top: 0;
   max-width: 1200px;
   width: 100%;
   margin-top: 0;
}

/* Hauptbereich: Angebotdetail */
#angebot {
   padding: 8px .305%
}

#angebot > h1 {
   font-size: 22px;
}

#angebot > div > div:first-child {
   min-width: 220px;
   text-align: center;
}

#angebot   #bild {
   max-height: 270px;
}

#angebot   #nebeninfo {
   margin-top: .8em;
}

#angebot   #nebeninfo > i {
   font-size: .9em;
}

#angebot   form > input + input {
   margin-right: 5px;
}

#angebot   #details > div:last-child {
   margin-top: 15px;
   padding-bottom: 2px;
}

#angebot   #gutschein {
   min-width: 0 !important;
   max-width: none !important;
   margin-bottom: .4em !important;
}

#angebot > div + div {
   margin-top: 2em;
}

#angebot > aside {
   font-size: small;
   margin-top: 1.5em;
   font-style: italic;
}

#angebot > #melden {
   margin-top: 0.6em;
   border-top: 1px solid dimgray;
   height: 1.8em;
}

#empfehlungen {
   padding: 0;
   background-color: transparent;
}

#empfehlungen > h3 {
   font-size: 18px;
   box-sizing: border-box;
   padding: 0 1.158%;
}

#empfehlungen > div {
   font-size: 0;
   display: flex;
   flex-flow: row wrap;
}

#empfehlungen > div > div {
   font-size: small;
   font-size: .9rem;
   box-sizing: border-box;
   width: 22.684%;
   margin: .5em 1.158%;
   padding: 5px 5px 5.2em 5px;
   background-color: white;
}

#empfehlungen > div > div > a:first-child {
   display: block;
   margin-bottom: .5em;
}

#empfehlungen   img {
   max-width: 100%;
   max-height: 140px;
}

#empfehlungen   h4 {
   margin-top: .5em;
   line-height: 1.2;
   text-align: center;
   font-weight: bold;
}

#empfehlungen > div > div > div {
   position: absolute;
   bottom: .5em;
   left: 0;
   right: 0;
   margin-top: .8em;
   overflow: visible;
   text-align: center;
   color: #ff4646;
}

#empfehlungen > div > div > div > * {
   min-width: 152px;
   max-width: 300px;
   width: 88%;
}

#empfehlungen   input {
   margin-bottom: 1px !important;
   border: 2px dashed dimgray;
   text-align: center;
   cursor: copy;
}

#empfehlungen > div > div > div > span {
   padding: 3px 0;
   text-align: center;
   white-space: nowrap;
   text-overflow: ellipsis;
   font-weight: bold;
   background-color: #ffd700;
}

#empfehlungen   a.button {
   box-sizing: border-box;
   padding: 2px 0 3px;
   background-size: .9em;
   background-position: right 20% top 44%;

   background-color: #ff4646;
}
#empfehlungen   a.button:active {
   background-color: #ffd700;
}
#empfehlungen   a.button:after {
   content: "";
   width: .9em;
   height: .9em;
   margin-left: .6em;
   vertical-align: -.1em;
   background-image: url("css/externer_link_button_v1.svg")
}

/* Hauptbereich: Übersicht */
#vz   main {
   text-align: left;
}

#vz   main > ul {
   padding: 0;
   background-color: transparent;
}

#vz   main   li {
   display: inline-block;
   margin-left: 0;
}

#vz   main > ul > li {
   min-width: 9em;
   vertical-align: bottom;
}

#vz   main > ul > li > * {
   display: block;
   padding: 0 5px;
   line-height: 27px;
   border: 1px solid dimgray;
   border-top-width: 2px;
   border-bottom: 0 none transparent;
   border-top-left-radius: 5px;
   border-top-right-radius: 5px;
}

#vz   main > ul   h1 {
   font-size: large;
   font-size: 1.2em;
   border-color: white;
   background-color: white;
}

#vz   main > ul   a {
   text-align: center;
   text-decoration: none;
   color: white;
   background-color: #ff4646;
   outline: 0 none transparent;
}
#vz   main > ul   a:hover {
   background-color: indianred;
}
#vz   main > ul   a:focus {
   font-weight: bold;
}

#vz   main > ul > li:first-child > * {
   border-left: 0 none transparent;
}

#vz   main > div {
   margin-top: 0;
}

#vz   main   dfn,
#kontakt {
   display: block;
}

#vz   main   fieldset {
   margin-top: .5em;
   border-top: 1px solid darkgray;
}

#vz   main   legend {
   margin: 0 auto;
   padding: 0 .5em;
}

#vz   main   fieldset   li {
   width: 260px;
   margin-bottom: .1em;
}

#vz   main   fieldset   a + a {
   display: inline-block;
   width: .9em;
   height: .9em;
   margin-left: .2em;
   padding: .1em;
   vertical-align: -.2em;
   background-image: url("css/onlineshop_link_v1.svg");
}

#vz   .produkt {
   font-style: italic;
}

#vz   aside   ul {
   display: block;
   max-width: 705px;
   margin: 0 auto;
}

#vz   aside   li {
   font-size: large;
   display: inline-block;
   width: 1.5em;
   text-align: center;
}


/* Kontakt */
#kontakt   table {
   width: 100%;
}

#kontakt   col:first-child {
   width: 1px;
}

#kontakt   tr > * {
   padding: .5em 0;
}

#kontakt   th {
   vertical-align: top;
   white-space: nowrap;
}

#kontakt   th:first-child {
   text-align: right;
}

#kontakt   tr:first-child + tr > th:first-child {
   vertical-align: top;
}

#kontakt   td,
#kontakt   th + th {
   overflow: visible;
   text-align: left;
}

#kontakt   textarea {
   resize: vertical;
   min-height: 1.5em;
}

#kontakt   table   div {
   margin-top: .5em;
}

#kontakt   span {
   color: dimgray;
}

#kontakt   .button {
   min-width: 150px;
   padding: 3px 0;
}

#spenden   table {
   margin-top: 1em;
   width: 100%;
}

#spenden   caption {
   padding-bottom: .5em;
   text-align: left;
}
#spenden   caption::after {
   content: ":";
}

#spenden   tr > *:first-child,
#spenden   tr > *:first-child + * {
   width: 1px;
}

#spenden   td {
   padding: 2px 4px;
}
#spenden   td:nth-child(2) {
   min-width: 3.3em;
   padding-right: 1em;
   text-align: right;
}
#spenden   td:last-child {
   min-width: 0;
   padding-right: initial;
   text-align: left;
}

/* Datenschutz und Impressum */
#recht   h2 {
   font-size: large;
}

#recht   h3 {
   text-decoration: underline;
}

#recht   p + h3 {
   margin-top: 1em;
}

#recht   aside > div > div > pre {
   margin-bottom: .5em;
}

#recht   aside   pre > a::before {
   content: "";
   display: inline-block;
   width: 16px;
   height: 16px;
   margin-right: 4px;
   vertical-align: top;
   background-size: 100% 100%;
   /*background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAQAAAD8x0bcAAABU0lEQVQoz3XSPUjUcRzH8df1P0upFMMjwQzNhyGaEgNR2kTQwKHFQVCihsTBwU3kNsUpggwuGirIUUGwJZFCRLFBsSAHH+rIbitwKRUfhrv7ewf63j4fPt+nH78ARBTbl6XJtAI7/jkKPSWeWRQPdaDDC6teKcpaRWZNqDRnQi4x7yRVpsVDnwUotu4tuC+uWgSjkuluy9oytVd91Y5641JGXMJ7CVE2tIYjNsOCaxaMiLjumwpm9YFCX8zk7FRqR7WIhKeBY22mHOnW4V5O6L9b6nwS1U/MdxUo8zdnMNzRgqhmGPMa9PjjtnOISXkMhvzWknEfhEeEjffcxQXDDnRizoo14/mxJ7bVgC67kj6i1LaX+bEBPzWCmx6JgjJLBvJjXQ4zu51Sa97lfKvBLx/cEIT/YUZcKNOkJFR5rtEVFzV4Y9egg7OepFyvST9s6VMAJ1WWTzBmZZEPAAAAAElFTkSuQmCC");*/
}

#recht   aside   pre > a:last-of-type::before {
   background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAABlUlEQVR42p2UvUoDQRSFZ2ZBokTIE1hIKqu8QRohhZVBUEvrxML0Cv4gRIhEI6KNTZ5A7SzyDKYQTILYKFYWigpCQL+bncVJmNXEJYedufecs/deZqLUr8+4VkrPhZD1/56EVqYKviyqEhvRY2wKYdsxidCW3DAOht88gq4VvoIHcAOebawrnJDr72QSUs35+hPYBSWtgh2t9CLrWydfE02fRaDMDImW24ZRZh+DMu8KjGWM1ihie6DVlmh7Jmxy4HNwHohpUa+zfsFsE9MK71PP3ESbE6MOuPQQVjHa4H1GJbPh3lx7eKLtiFHDzrk4QLinqgWqOMTwwii9ROyqv2pTtF01HKPeM82+6ZA/MDoHJ3b4Ubwp3EjkM5LRTxCT2bx52niXnHBcRYxRlAzS5B5payWErIO0nxtjxKVK0c4xBvmfmM6HMZUaygiBHIcDBpnxHPyM5ITzh5EpsN9iBsn4WxQkQ44peI0o+wiUhr3WwhWNa3QHynwpG/0JWSRiEOWluqxoxUOc63JOgNyrvRFRttr6N5zfgrUz7AfCAAAAAElFTkSuQmCC");
}

#recht   aside   li {
   font-size: 14.4px;
   font-size: .9rem;
}

#recht   aside   img {
   vertical-align: baseline;
}

#recht   aside   .button {
   display: block;
   font-size: 15px;
}


/* Fußbereich */
footer {
   padding: 10px;
   border-top: 8px solid #ffd700;
   text-align: center;
   background-color: #1c8046;
}

footer   li {
   font-style: italic;
   color: white;
}

footer   li:last-child {
   margin: 0 2em;
}

footer   a {
   padding: 0 .5em;
   border-left-color: white !important;
   font-weight: bold;
   font-style: normal;
   color: inherit;
}
footer   a:hover,
footer   a:active {
   color: #ffd700;
}

#cookie, #cookie:checked + div {
   display: none;
}
#cookie + div {
   z-index: 99;
   position: fixed;
   left: 0;
   right: 0;
   bottom: 0;
}
#cookie + div > div,
#cookie + div > div > a {
   font-size: 17px;
   color: white;
}
#cookie + div > div {
   box-sizing: border-box;
   width: 100%;
   max-width: 1200px;
   margin: 0 auto;
   padding: 5px 2% 1em;
   border: 1px solid black;
   background-color: dimgray;
   background-color: rgba(30, 30, 30, .9);
}

#cookie + div > div > a {
   line-height: 2;
}

#cookie + div   ::before,
#cookie + div   ::after {
   display: inline;
   font: inherit;
   color: inherit;
}

#cookie + div > div::before {
   content: "Cookies erleichtern die Bereitstellung unserer Dienste. Mit der Nutzung unserer Dienste erklären Sie sich damit einverstanden, dass wir Cookies verwenden. ";
   margin-right: 1em;
   vertical-align: top;
}
#cookie + div   a {
   margin: 0 .5em 0 .8em;
   font-weight: bold;
}

#ek_impressum::after {
   content: "Impressum";
}
html[lang=en]   #ek_impressum::after {
   content: "Legal Notice";
}
#ek_infos::after {
   content: "Mehr Infos";
}
html[lang=en]   #ek_infos::after {
   content: "more info";
}
#cookie + div   input {
   width: 5em;
   margin: 2px 0 0 1em;
   padding: 2px 0;
   border-color: #ffd700;
   background-color: goldenrod;
}