Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- start [2023/07/31 15:59] – dfrey
+++ start [2026/06/19 19:23] (aktuell) – dfrey
@@ Zeile 1: / Zeile 1: @@
-{{img:huette:huette4.jpg?nolink|}}
+{{img:huette:avh1.png?nolink|}}
+<html>
+<!-- ------------------------------------------------------------------------------------------------------------------------ -->
+<div id="av-grillfest-2026">
+  <section class="av-grillfest-card" aria-labelledby="av-grillfest-title">
+    <div class="av-grillfest-card-fire" aria-hidden="true">🔥</div>
+    <div>
+      <div class="av-grillfest-card-date">8. &amp; 9. August 2026</div>
+      <h2 id="av-grillfest-title">
+        Grillfest auf dem Theresienberg
+      </h2>
+      <p>
+        Wir laden herzlich zum Grillfest an unserer AV-Hütte ein:
+        <strong>Samstagabend und Sonntag.</strong>
+      </p>
+      <p class="av-grillfest-card-promise">
+        🎵 Für Musik und das leibliche Wohl ist bestens gesorgt!
+      </p>
+      <button type="button" class="av-grillfest-replay">
+        🔥 Ankündigung noch einmal ansehen
+      </button>
+    </div>
+  </section>
+</div>
+<style>
+  #av-grillfest-2026 {
+    --av-green: #176b36;
+    --av-dark-green: #0d4724;
+    --av-cream: #fff8e6;
+    --av-gold: #ffc44d;
+    max-width: 900px;
+    margin: 28px auto;
+    font-family: Arial, Helvetica, sans-serif;
+  }
+  /* Statischer Hinweis */
+  .av-grillfest-card {
+    display: flex;
+    align-items: center;
+    gap: 22px;
+    box-sizing: border-box;
+    padding: 25px 28px;
+    color: #183221;
+    background:
+      linear-gradient(120deg, rgba(255,255,255,.94), rgba(255,248,220,.96)),
+      var(--av-cream);
+    border: 3px solid var(--av-green);
+    border-radius: 15px;
+    box-shadow: 0 10px 28px rgba(16,66,34,.18);
+  }
+  .av-grillfest-card-fire {
+    flex: 0 0 auto;
+    font-size: clamp(55px, 9vw, 90px);
+    filter: drop-shadow(0 8px 8px rgba(160,50,10,.2));
+  }
+  .av-grillfest-card-date {
+    display: inline-block;
+    padding: 5px 12px;
+    color: #fff;
+    background: var(--av-green);
+    border-radius: 999px;
+    font-size: 15px;
+    font-weight: bold;
+    letter-spacing: .04em;
+  }
+  .av-grillfest-card h2 {
+    margin: 9px 0 8px;
+    color: var(--av-dark-green);
+    font-family: Georgia, "Times New Roman", serif;
+    font-size: clamp(25px, 4vw, 38px);
+    line-height: 1.1;
+  }
+  .av-grillfest-card p {
+    margin: 7px 0;
+    font-size: 17px;
+    line-height: 1.55;
+  }
+  .av-grillfest-card-promise {
+    color: var(--av-dark-green);
+    font-weight: bold;
+  }
+  .av-grillfest-replay,
+  .av-grillfest-sound,
+  .av-grillfest-close {
+    border: 0;
+    cursor: pointer;
+    font: inherit;
+  }
+  .av-grillfest-replay {
+    margin-top: 12px;
+    padding: 9px 14px;
+    color: #fff;
+    background: var(--av-green);
+    border-radius: 7px;
+    font-weight: bold;
+  }
+  .av-grillfest-replay:hover,
+  .av-grillfest-replay:focus {
+    background: var(--av-dark-green);
+  }
+  /* Vollbild-Ankündigung */
+  .av-grillfest-overlay {
+    position: fixed;
+    z-index: 2147483000;
+    inset: 0;
+    display: grid;
+    place-items: center;
+    overflow: hidden;
+    box-sizing: border-box;
+    padding: 22px;
+    color: #fff;
+    background:
+      radial-gradient(
+        circle at 50% 85%,
+        rgba(197,45,20,.55),
+        transparent 42%
+      ),
+      rgba(4,10,6,.94);
+    backdrop-filter: blur(4px);
+    animation: av-overlay-in .6s ease both;
+  }
+  .av-grillfest-overlay.av-grillfest-leaving {
+    animation: av-overlay-out .7s ease both;
+  }
+  .av-grillfest-stage {
+    position: relative;
+    z-index: 5;
+    width: min(760px, 94vw);
+    box-sizing: border-box;
+    padding: clamp(30px, 5vw, 48px);
+    text-align: center;
+    background: rgba(14,37,21,.86);
+    border: 2px solid rgba(255,196,77,.82);
+    border-radius: 22px;
+    box-shadow:
+0 80px rgba(243,107,33,.3),
+      inset 0 0 35px rgba(255,196,77,.08);
+    animation:
+      av-stage-in .8s .15s cubic-bezier(.2,.8,.2,1) both,
+      av-stage-glow 2s 1s ease-in-out infinite alternate;
+  }
+  .av-grillfest-kicker {
+    color: var(--av-gold);
+    font-size: clamp(15px, 3vw, 21px);
+    font-weight: bold;
+    letter-spacing: .18em;
+    text-transform: uppercase;
+  }
+  .av-grillfest-stage h2 {
+    margin: 12px 0;
+    color: #fff6d6;
+    font-family: Georgia, "Times New Roman", serif;
+    font-size: clamp(36px, 8vw, 76px);
+    line-height: .98;
+    text-shadow:
+2px 0 #8e2b13,
+0 24px rgba(255,137,32,.55);
+  }
+  .av-grillfest-overlay-date {
+    margin: 10px 0 17px;
+    color: var(--av-gold);
+    font-family: Georgia, "Times New Roman", serif;
+    font-size: clamp(25px, 5vw, 43px);
+    font-weight: bold;
+  }
+  .av-grillfest-stage p {
+    max-width: 650px;
+    margin: 8px auto;
+    font-size: clamp(17px, 3vw, 23px);
+    line-height: 1.45;
+  }
+  .av-grillfest-music-line {
+    color: #ffe7a3;
+    font-weight: bold;
+  }
+  .av-grillfest-sound {
+    margin-top: 20px;
+    padding: 10px 18px;
+    color: #322008;
+    background: var(--av-gold);
+    border-radius: 999px;
+    font-weight: bold;
+    box-shadow: 0 5px 18px rgba(0,0,0,.28);
+  }
+  .av-grillfest-sound:hover,
+  .av-grillfest-sound:focus {
+    background: #ffe18a;
+  }
+  .av-grillfest-sound:disabled {
+    cursor: default;
+    opacity: .82;
+  }
+  .av-grillfest-close {
+    position: absolute;
+    top: 13px;
+    right: 13px;
+    width: 42px;
+    height: 42px;
+    padding: 0;
+    color: #fff;
+    background: rgba(0,0,0,.38);
+    border: 1px solid rgba(255,255,255,.45);
+    border-radius: 50%;
+    font-size: 25px;
+    line-height: 38px;
+  }
+  .av-grillfest-close:hover,
+  .av-grillfest-close:focus {
+    background: rgba(180,40,15,.72);
+  }
+  /* Realistischere Flammen */
+  .av-grillfest-flames {
+    position: absolute;
+    z-index: 2;
+    right: -4%;
+    bottom: -35px;
+    left: -4%;
+    display: flex;
+    align-items: flex-end;
+    justify-content: center;
+    height: 38vh;
+    overflow: visible;
+    pointer-events: none;
+    filter: contrast(1.12) saturate(1.25);
+  }
+  .av-grillfest-flames::before {
+    content: "";
+    position: absolute;
+    right: 5%;
+    bottom: 0;
+    left: 5%;
+    height: 55%;
+    background: radial-gradient(
+      ellipse at center bottom,
+      rgba(255,210,65,.75) 0%,
+      rgba(255,91,20,.45) 32%,
+      rgba(190,24,10,.18) 58%,
+      transparent 75%
+    );
+    filter: blur(28px);
+    animation: av-fire-glow 1.4s ease-in-out infinite alternate;
+  }
+  .av-grillfest-flame {
+    position: relative;
+    width: clamp(48px, 8vw, 105px);
+    height: clamp(145px, 31vh, 330px);
+    margin: 0 clamp(-18px, -1.5vw, -7px);
+    background: radial-gradient(
+      ellipse at 50% 88%,
+      #fffbd0 0%,
+      #ffe26a 10%,
+      #ff9b20 30%,
+      #f04416 57%,
+      #a90f0b 76%,
+      transparent 78%
+    );
+    clip-path: polygon(
+% 0%,
+% 18%,
+% 34%,
+% 58%,
+% 81%,
+% 96%,
+% 100%,
+% 96%,
+% 78%,
+% 54%,
+% 31%
+    );
+    opacity: .92;
+    transform-origin: 50% 100%;
+    filter:
+      blur(.4px)
+      drop-shadow(0 0 8px rgba(255,91,20,.9))
+      drop-shadow(0 0 20px rgba(255,45,10,.55));
+    animation: av-real-flame 1.05s ease-in-out infinite alternate;
+  }
+  .av-grillfest-flame::before {
+    content: "";
+    position: absolute;
+    right: 25%;
+    bottom: 0;
+    left: 25%;
+    height: 70%;
+    background: linear-gradient(
+      to top,
+      #fffde3 0%,
+      #ffe96f 28%,
+      #ffad24 63%,
+      rgba(255,96,20,.2) 100%
+    );
+    clip-path: polygon(
+% 0%,
+% 35%,
+% 68%,
+% 94%,
+% 100%,
+% 92%,
+% 65%,
+% 33%
+    );
+    filter: blur(1px);
+    animation: av-inner-flame .72s ease-in-out infinite alternate;
+  }
+  .av-grillfest-flame::after {
+    content: "";
+    position: absolute;
+    right: 38%;
+    bottom: 1%;
+    left: 38%;
+    height: 35%;
+    background: linear-gradient(
+      to top,
+      #fff,
+      #fff8b0 48%,
+      rgba(255,210,50,0)
+    );
+    border-radius: 50% 50% 30% 30%;
+    filter: blur(2px);
+    opacity: .9;
+  }
+  .av-grillfest-flame:nth-child(2n) {
+    height: clamp(105px, 22vh, 235px);
+    animation-duration: .78s;
+    animation-delay: -.45s;
+  }
+  .av-grillfest-flame:nth-child(3n) {
+    height: clamp(170px, 35vh, 365px);
+    animation-duration: 1.28s;
+    animation-delay: -.85s;
+  }
+  .av-grillfest-flame:nth-child(4n) {
+    width: clamp(35px, 6vw, 78px);
+    height: clamp(85px, 19vh, 205px);
+    animation-duration: .66s;
+    animation-delay: -.25s;
+  }
+  .av-grillfest-flame:nth-child(5n) {
+    opacity: .75;
+    filter:
+      blur(1.4px)
+      drop-shadow(0 0 16px rgba(255,65,10,.8));
+  }
+  /* Aufsteigende Glut */
+  .av-grillfest-embers {
+    position: absolute;
+    z-index: 3;
+    inset: 0;
+    overflow: hidden;
+    pointer-events: none;
+  }
+  .av-grillfest-ember {
+    position: absolute;
+    bottom: 2%;
+    width: 4px;
+    height: 4px;
+    background: #ffd45c;
+    border-radius: 50%;
+    box-shadow:
+0 5px #fff4a5,
+0 12px #ff6a16;
+    opacity: 0;
+    animation: av-ember-rise 3.4s linear infinite;
+  }
+  .av-grillfest-ember:nth-child(1)  { left: 8%;  animation-delay: -.3s; }
+  .av-grillfest-ember:nth-child(2)  { left: 15%; animation-delay: -1.8s; }
+  .av-grillfest-ember:nth-child(3)  { left: 22%; animation-delay: -.9s; }
+  .av-grillfest-ember:nth-child(4)  { left: 29%; animation-delay: -2.5s; }
+  .av-grillfest-ember:nth-child(5)  { left: 36%; animation-delay: -1.2s; }
+  .av-grillfest-ember:nth-child(6)  { left: 43%; animation-delay: -2.9s; }
+  .av-grillfest-ember:nth-child(7)  { left: 50%; animation-delay: -.5s; }
+  .av-grillfest-ember:nth-child(8)  { left: 57%; animation-delay: -2.1s; }
+  .av-grillfest-ember:nth-child(9)  { left: 64%; animation-delay: -1.4s; }
+  .av-grillfest-ember:nth-child(10) { left: 71%; animation-delay: -3.1s; }
+  .av-grillfest-ember:nth-child(11) { left: 78%; animation-delay: -.8s; }
+  .av-grillfest-ember:nth-child(12) { left: 85%; animation-delay: -2.3s; }
+  .av-grillfest-ember:nth-child(3n) {
+    width: 7px;
+    height: 7px;
+  }
+  /* Musiknoten */
+  .av-grillfest-notes {
+    position: absolute;
+    z-index: 4;
+    inset: 0;
+    overflow: hidden;
+    pointer-events: none;
+  }
+  .av-grillfest-note {
+    position: absolute;
+    bottom: 10%;
+    color: #ffe27a;
+    font-size: clamp(25px, 5vw, 52px);
+    opacity: 0;
+    animation: av-note-rise 4s linear infinite;
+  }
+  .av-grillfest-note:nth-child(1) {
+    left: 8%;
+    animation-delay: 0s;
+  }
+  .av-grillfest-note:nth-child(2) {
+    left: 23%;
+    animation-delay: 1.4s;
+  }
+  .av-grillfest-note:nth-child(3) {
+    right: 22%;
+    animation-delay: .7s;
+  }
+  .av-grillfest-note:nth-child(4) {
+    right: 7%;
+    animation-delay: 2.1s;
+  }
+  /* Animationen */
+  @keyframes av-overlay-in {
+    from { opacity: 0; }
+    to   { opacity: 1; }
+  }
+  @keyframes av-overlay-out {
+    from { opacity: 1; }
+    to   { opacity: 0; }
+  }
+  @keyframes av-stage-in {
+    from {
+      opacity: 0;
+      transform: scale(.72) translateY(35px);
+    }
+    to {
+      opacity: 1;
+      transform: scale(1) translateY(0);
+    }
+  }
+  @keyframes av-stage-glow {
+    from {
+      box-shadow:
+0 55px rgba(243,107,33,.22),
+        inset 0 0 35px rgba(255,196,77,.08);
+    }
+    to {
+      box-shadow:
+0 95px rgba(243,107,33,.42),
+        inset 0 0 50px rgba(255,196,77,.13);
+    }
+  }
+  @keyframes av-real-flame {
+% {
+      transform: scaleX(.78) scaleY(1.03) rotate(-4deg);
+    }
+% {
+      transform: scaleX(1.04) scaleY(.91) rotate(3deg);
+    }
+% {
+      transform: scaleX(.89) scaleY(1.08) rotate(-2deg);
+    }
+% {
+      transform: scaleX(1.12) scaleY(.87) rotate(5deg);
+    }
+  }
+  @keyframes av-inner-flame {
+    from {
+      transform: translateX(-5%) scaleX(.78) scaleY(1.08);
+    }
+    to {
+      transform: translateX(6%) scaleX(1.15) scaleY(.84);
+    }
+  }
+  @keyframes av-fire-glow {
+    from {
+      opacity: .62;
+      transform: scaleX(.92);
+    }
+    to {
+      opacity: 1;
+      transform: scaleX(1.08);
+    }
+  }
+  @keyframes av-ember-rise {
+% {
+      opacity: 0;
+      transform: translate(0,0) scale(.5);
+    }
+% {
+      opacity: 1;
+    }
+% {
+      opacity: .75;
+    }
+% {
+      opacity: 0;
+      transform: translate(35px,-70vh) scale(.15);
+    }
+  }
+  @keyframes av-note-rise {
+% {
+      opacity: 0;
+      transform: translateY(0) rotate(-12deg);
+    }
+% {
+      opacity: .9;
+    }
+% {
+      opacity: .6;
+    }
+% {
+      opacity: 0;
+      transform: translateY(-75vh) rotate(18deg);
+    }
+  }
+  @media (max-width: 620px) {
+    .av-grillfest-card {
+      display: block;
+      padding: 20px;
+      text-align: center;
+    }
+    .av-grillfest-card-fire {
+      margin-bottom: 5px;
+    }
+    .av-grillfest-stage {
+      padding: 45px 18px 28px;
+    }
+    .av-grillfest-flames {
+      bottom: -45px;
+      height: 30vh;
+    }
+  }
+  @media (prefers-reduced-motion: reduce) {
+    .av-grillfest-overlay,
+    .av-grillfest-stage,
+    .av-grillfest-flame,
+    .av-grillfest-flame::before,
+    .av-grillfest-ember,
+    .av-grillfest-note,
+    .av-grillfest-flames::before {
+      animation: none !important;
+    }
+    .av-grillfest-ember,
+    .av-grillfest-note {
+      display: none;
+    }
+  }
+</style>
+<script>
+(function () {
+  "use strict";
+  var root = document.getElementById("av-grillfest-2026");
+  if (!root || root.getAttribute("data-initialized") === "true") {
+    return;
+  }
+  root.setAttribute("data-initialized", "true");
+  var closeTimer = null;
+  var previousOverflow = "";
+  var audioContext = null;
+  var escapeHandler = null;
+  function playMusic(button) {
+    var AudioContextClass =
+      window.AudioContext || window.webkitAudioContext;
+    if (!AudioContextClass) {
+      button.textContent = "Musik wird nicht unterstützt";
+      return;
+    }
+    audioContext = audioContext || new AudioContextClass();
+    audioContext.resume();
+    var notes = [
+      [392.00, 0.00],
+      [440.00, 0.28],
+      [493.88, 0.56],
+      [523.25, 0.84],
+      [493.88, 1.20],
+      [440.00, 1.48],
+      [392.00, 1.76],
+      [523.25, 2.12],
+      [587.33, 2.48],
+      [523.25, 2.84]
+    ];
+    notes.forEach(function (note) {
+      var oscillator = audioContext.createOscillator();
+      var gain = audioContext.createGain();
+      var start = audioContext.currentTime + note[1];
+      oscillator.type = "triangle";
+      oscillator.frequency.value = note[0];
+      gain.gain.setValueAtTime(0.0001, start);
+      gain.gain.exponentialRampToValueAtTime(
+.12,
+        start + 0.04
+      );
+      gain.gain.exponentialRampToValueAtTime(
+.0001,
+        start + 0.25
+      );
+      oscillator.connect(gain);
+      gain.connect(audioContext.destination);
+      oscillator.start(start);
+      oscillator.stop(start + 0.27);
+    });
+    button.textContent = "♫ Musik läuft";
+    button.disabled = true;
+  }
+  function hideOverlay() {
+    var overlay =
+      document.querySelector(".av-grillfest-overlay");
+    if (
+      !overlay ||
+      overlay.classList.contains("av-grillfest-leaving")
+    ) {
+      return;
+    }
+    window.clearTimeout(closeTimer);
+    overlay.classList.add("av-grillfest-leaving");
+    if (escapeHandler) {
+      document.removeEventListener("keydown", escapeHandler);
+      escapeHandler = null;
+    }
+    window.setTimeout(function () {
+      overlay.remove();
+      document.body.style.overflow = previousOverflow;
+    }, 700);
+  }
+  function createRepeatedElement(className, amount) {
+    var result = "";
+    for (var i = 0; i < amount; i++) {
+      result += '<span class="' + className + '"></span>';
+    }
+    return result;
+  }
+  function showOverlay() {
+    if (document.querySelector(".av-grillfest-overlay")) {
+      return;
+    }
+    previousOverflow = document.body.style.overflow;
+    document.body.style.overflow = "hidden";
+    var overlay = document.createElement("div");
+    overlay.className = "av-grillfest-overlay";
+    overlay.setAttribute("role", "dialog");
+    overlay.setAttribute("aria-modal", "true");
+    overlay.setAttribute(
+      "aria-labelledby",
+      "av-grillfest-overlay-title"
+    );
+    overlay.innerHTML =
+      '<div class="av-grillfest-notes" aria-hidden="true">' +
+        '<span class="av-grillfest-note">♪</span>' +
+        '<span class="av-grillfest-note">♫</span>' +
+        '<span class="av-grillfest-note">♪</span>' +
+        '<span class="av-grillfest-note">♬</span>' +
+      '</div>' +
+      '<div class="av-grillfest-stage">' +
+        '<button class="av-grillfest-close" ' +
+          'type="button" ' +
+          'aria-label="Ankündigung schließen">×</button>' +
+        '<div class="av-grillfest-kicker">' +
+          'Herzliche Einladung' +
+        '</div>' +
+        '<h2 id="av-grillfest-overlay-title">' +
+          'Grillfest' +
+        '</h2>' +
+        '<div class="av-grillfest-overlay-date">' +
+          '8. &amp; 9. August 2026' +
+        '</div>' +
+        '<p>' +
+          'an der AV-Hütte auf dem ' +
+          '<strong>Theresienberg</strong>' +
+        '</p>' +
+        '<p><strong>Samstagabend und Sonntag</strong></p>' +
+        '<p class="av-grillfest-music-line">' +
+          'Für Musik und das leibliche Wohl ist gesorgt!' +
+        '</p>' +
+        '<button class="av-grillfest-sound" type="button">' +
+          '♫ Musik starten' +
+        '</button>' +
+      '</div>' +
+      '<div class="av-grillfest-flames" aria-hidden="true">' +
+        createRepeatedElement("av-grillfest-flame", 15) +
+      '</div>' +
+      '<div class="av-grillfest-embers" aria-hidden="true">' +
+        createRepeatedElement("av-grillfest-ember", 12) +
+      '</div>';
+    document.body.appendChild(overlay);
+    overlay
+      .querySelector(".av-grillfest-close")
+      .addEventListener("click", hideOverlay);
+    overlay
+      .querySelector(".av-grillfest-sound")
+      .addEventListener("click", function () {
+        playMusic(this);
+      });
+    overlay.addEventListener("click", function (event) {
+      if (event.target === overlay) {
+        hideOverlay();
+      }
+    });
+    escapeHandler = function (event) {
+      if (event.key === "Escape") {
+        hideOverlay();
+      }
+    };
+    document.addEventListener("keydown", escapeHandler);
+    overlay
+      .querySelector(".av-grillfest-close")
+      .focus();
+    /* Automatisch nach 8,5 Sekunden ausblenden */
+    closeTimer = window.setTimeout(hideOverlay, 8500);
+  }
+  root
+    .querySelector(".av-grillfest-replay")
+    .addEventListener("click", showOverlay);
+  /* Animation kurz nach dem Laden starten */
+  window.setTimeout(showOverlay, 500);
+})();
+</script>
+<!-- ------------------------------------------------------------------------------------------------------------------------ -->
+</html>
 <WRAP centeralign>
@@ Zeile 9: / Zeile 835: @@
 Aktuelle Wanderungen und Veranstaltungen finden Sie hier: [[termine|Veranstaltungen]]
 \\ \\
+<html>
+<!--
 ----
+<WRAP centeralign>
+{{veranstaltungen:2024-08-03_av_fest:av_fest_2024.jpg?800&nolink}}
+{{veranstaltungen:2024-08-03_av_fest:av_fest_2024_programm.jpg?800&nolink}}
 <WRAP box centeralign>
@@ Zeile 15: / Zeile 851: @@
 </WRAP>
+-->
+</html>
 ----
@@ Zeile 23: / Zeile 861: @@
 ** Hier finden Sie die Beitrittserklärung:** {{mitglieder:dokumente:oeffentlich:beitrittserklaerung-neu.pdf|Beitrittserklärung}}
+++++ Informationen zum Mitgliedsbeitrag |
+^ Art der Mitgliedschaft ^ Grundbeitrag ab 2026 + Ortsgruppenzuschlag ^
+| Einzelmitglied | Euro 50,- |
+| Einzelne Jugendliche ab 14 Jahren bis zur Vollendung des 27. Lebensjahres | Euro 28,- |
+| Einzelne Kinder unter 14 Jahren | Euro 15,- |
+| Familien/(Ehe)Paare (einschl. aller Kinder und Jugendliche bis zur Vollendung des 27. Lebensjahres) | Euro 64,- |
+| Alleinerziehende (einschl. aller Kinder und Jugendliche bis zur Vollendung des 27. Lebensjahres) | Euro 40,- |
+ ++++
-**Unsere aktuellen Mitgliederbeiträge:**  {{mitglieder:dokumente:oeffentlich:mitgliederbeitraege-ortsgruppe-sav-waldenburg-neu.pdf|Mitgliederbeiträge}}
+<html>
+<meta property="og:image" content="https://www.xn--avhtte-5ya.de/lib/exe/fetch.php?media=img:huette:avh1.png" />
+</html>