index.html

<html>
 <head>
  <title>Startseite</title>
  <meta name="save_as" content="index.html" />
 </head>

 <body>
   <div class="carousel slide" data-bs-ride="carousel" id="index-carousel">
     <ol class="carousel-indicators">
       <li data-bs-target="#index-carousel" data-bs-slide-to="0" class="active"></li>
       <li data-bs-target="#index-carousel" data-bs-slide-to="1"></li>
       <li data-bs-target="#index-carousel" data-bs-slide-to="2"></li>
       <li data-bs-target="#index-carousel" data-bs-slide-to="3"></li>
       <li data-bs-target="#index-carousel" data-bs-slide-to="4"></li>
     </ol>
     <div class="carousel-inner">
       <div class="carousel-item active">
         <img class="d-block w-100" src="/images/carousel/tom-erklärt-veripeditus.jpg" />
             <div class="carousel-caption d-none d-md-block">
               <h5>Von Kindern, für Kinder</h5>
               <p>Unsere jungen Tutoren zwischen 9 und 16 Jahren arbeiten regelmäßig gemeinsam an ihren Workshops, die sie dann für gleichaltrige Kinder und Jugendliche leiten.</p>
         </div>
       </div>
       <div class="carousel-item">
         <img class="d-block w-100" src="/images/carousel/gruppenbild.jpeg" />
             <div class="carousel-caption d-none d-md-block">
               <h5>Kinder bei Freie-Software-Konferenzen</h5>
               <p>Unsere 100 Teilnehmer der FrogLabs bei der FrOSCon in Sankt Augustin im Jahr 2017</p>
         </div>
       </div> 
       <div class="carousel-item">
         <img class="d-block w-100" src="/images/carousel/kinder-elektronik.jpg" />
             <div class="carousel-caption d-none d-md-block">
               <h5>Mehr als Informatik</h5>
               <p>In unseren Projekten kombinieren wir Informatik mit vielen anderen Elementen, wie Elektronik, Grafik, uvm.</p>
         </div>
       </div>
       <div class="carousel-item">
         <img class="d-block w-100" src="/images/carousel/mädchen-mit-tux.jpg" />
             <div class="carousel-caption d-none d-md-block">
               <h5>Freie Software für jeden</h5>
               <p>Bei Teckids werden alle Kinder und Jugendlichen Teil der Freie-Software-Gemeinschaft — als Benutzer und als Kontributoren.</p>
         </div>
       </div>
       <div class="carousel-item">
         <img class="d-block w-100" src="/images/carousel/kinder-kreatives.jpg" />
             <div class="carousel-caption d-none d-md-block">
               <h5>Klein anfangen — oder groß</h5>
               <p>Für jeden das richtige Einstiegslevel — mit Programmierung, Elektronik oder zum Einstieg mit Hörspielen und Trickfilmen.</p>
         </div>
       </div>
       <a class="carousel-control-prev" data-bs-target="#index-carousel" type="button" data-bs-slide="prev">
         <span class="carousel-control-prev-icon" aria-hidden="true"></span>
         <span class="visually-hidden">Previous</span>
       </a>
       <a class="carousel-control-next" data-bs-target="#index-carousel" type="button" data-bs-slide="next">
         <span class="carousel-control-next-icon" aria-hidden="true"></span>
         <span class="visually-hidden">Next</span>
       </a>
     </div>
   </div>

  <div class="container" id="project-columns">
    <div class="row">
      <div class="d-flex flex-column col-lg-4 border-right">
        <a href="https://schul-frei.dev/">
          <img src="/theme/artwork/logo-schul-frei.svg" alt="Logo Projekt schul-frei" class="projektlogo" />
        </a>
        <p>
          <b>Freie Software und Bildung Hand in Hand</b>
        </p>
        <p>
          Das Projekt schul-frei ist ein Kuratorium für Freie Software in der Bildung.
        </p>
        <p class="mt-auto">
          Die im Projekt engagierten Softwareentwicklerinnen, Lehrkräfte, Schulen, Schüler und IT-Unternehmen
          bieten gemeinsam eine breite, übersichtliches und qualitativ hochwertige Sammlung von Softwarelösungen
          für Jugend und Bildung an — als Gemeinschaft und als Dienstleistung für Schulen und Entscheidungsträger.
	  Außerdem hilft das Projekt jungen Kontributorinnen und Kontributoren, ihren Weg in die Welt der
	  Freien Software zu finden.  
        </p>
        <a class="btn btn-dark mt-auto" href="https://schul-frei.dev/">Mehr auf schul-frei.dev</a>
      </div>
      <div class="d-flex flex-column col-lg-4 border-right">
        <a href="https://hacknfun.camp">
          <img src="/theme/artwork/logo-hacknfun.svg" alt="Logo Projekt Hack’n’Fun" class="projektlogo" />
        </a>
        <p>
          <b>Gemeinsames Lernen und Ausprobieren von technischen Themen</b>
        </p>
        <p>
Im Projekt Hack’n’Fun experimentieren Kinder, Jugendliche und Erwachsene gemeinsam, um technische Themen kennenzulernen. Jede*r kann Themen vorschlagen und damit ankündigen, etwas zeigen zu wollen, darum bitten, etwas gezeigt zu bekommen, oder dazu aufrufen, etwas gemeinsam auszuprobieren und herauszufinden.
        </p>
        <p class="mt-auto">
Die aktiven Projektmitglieder gestalten aus den Ergebnissen dann Wochenend- und Ferienfreizeiten für Einsteiger*innen.
        </p>
        <a class="btn btn-dark mt-auto" href="https://hacknfun.camp/">Mehr auf hacknfun.camp</a>
      </div>
      <div class="d-flex flex-column col-lg-4">
        <a href="https://leopard.institute">
          <img src="/theme/artwork/logo-leopard.svg" alt="Logo Projekt LEOPARD" class="projektlogo" />
        </a>
        <p>
          <b>Partizipatives Lernen</b>
        </p>
        <p>
	  Lernen und zusammenarbeiten nach Fähigkeiten und Zielen
        </p>
        <p class="mt-auto">
	    Die Konzepte, die das Projekt LEOPARD erarbeitet und erprobt, ermöglichen dezentrales
	    und asynchrones, gemeinsames oder selbstständiges, Lernen für jung und alt.
	    Kern des Konzepte ist die Befähigung von Menschen dazu, sich ihre Lernziele und
	    Aufgaben nach Fähigkeiten und Interessen auszusuchen. Begleitet durch Online- und
	    Offline-Barcamps stellt LEOPARD den Rahmen für die Partizipation in allen Vereinsprojekten
	    und darüber hinaus.
        </p>
        <a class="btn btn-dark mt-auto" href="https://leopard.institute/">Mehr auf leopard.institute</a>
      </div>
    </div>
  </div>
</body>
</html>