<?php
include "third_wednesday.php";
$nextDate = nextThirdWednesday();
$followingDates = listNextElevenThirdWendesdays();
?>

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <!-- Title Tag -->
    <title>Open Source Audio Meeting Cologne</title>
    <meta name="application-name" content="Open Source Audio Meeting Cologne" />
    <meta name="author" content="Nils Hilbricht" />
    <meta name="distributor" content="" />
    <meta name="robots" content="All" />
    <meta name="description" content="Für Musiker, Programmierer, Hobbyisten und Profis, Anfänger und Experten! Triff dich einmal im Monat zum Austausch von Neuigkeiten und Informationen, für gegenseitige Hilfe oder zum Diskutieren oder Philosophieren über Musik, Audio, Computer und Software. Der Eintritt ist frei." />
    <meta name="keywords" content="open source audio music composition recording mixing linux freeware meetup social collaboration help support community köln cologne deutschland user group musik aufnehmen komponieren" />
    <meta name="generator" content="META Tag Generator: http://toolswebtop.com/seo/metatag" />
    <meta name="rating" content="General" />
    <meta name="dcterms.title" content="Open Source Audio Meeting Cologne" />
    <meta name="dcterms.contributor" content="Nils Hilbricht" />
    <meta name="dcterms.creator" content="OSAMC" />
    <meta name="dcterms.publisher" content="" />
    <meta name="dcterms.description" content="Für Musiker, Programmierer, Hobbyisten und Profis, Anfänger und Experten! Triff dich einmal im Monat zum Austausch von Neuigkeiten und Informationen, für gegenseitige Hilfe oder zum Diskutieren oder Philosophieren über Musik, Audio, Computer und Software. Der Eintritt ist frei." />
    <meta name="dcterms.rights" content="" />
    <meta property="og:type" content="website" />
    <meta property="og:title" content="Open Source Audio Meeting Cologne" />
    <meta property="og:description" content="Für Musiker, Programmierer, Hobbyisten und Profis, Anfänger und Experten! Triff dich einmal im Monat zum Austausch von Neuigkeiten und Informationen, für gegenseitige Hilfe oder zum Diskutieren oder Philosophieren über Musik, Audio, Computer und Software. Der Eintritt ist frei." />
    <meta property="twitter:title" content="Open Source Audio Meeting Cologne" />
    <meta property="twitter:description" content="Für Musiker, Programmierer, Hobbyisten und Profis, Anfänger und Experten! Triff dich einmal im Monat zum Austausch von Neuigkeiten und Informationen, für gegenseitige Hilfe oder zum Diskutieren oder Philosophieren über Musik, Audio, Computer und Software. Der Eintritt ist frei." />

    <!-- <<Mobile Viewport Code>> -->
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

    <!-- <<Attched Stylesheets>> -->
    <link rel="stylesheet" href="css/theme.css" type="text/css" />
    <link rel="stylesheet" href="css/media.css" type="text/css" />
    <link rel="stylesheet" href="css/font-awesome.min.css" type="text/css" />
    <link href='css/font.css' rel='stylesheet' type='text/css'>

    <!-- <<Attched Javascripts>> -->
    <script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
    <script type="text/javascript" src="js/modernizr.js"></script>

</head>
<body>

<!-- \\ Begin Holder \\ -->
<div class="DesignHolder">

    <!-- \\ Begin Frame \\ -->
    <div class="LayoutFrame">
        <!-- \\ Begin Header \\ -->
        <header class="header">
            <div class="Center">


               <!-- \\ Begin Top Bar \\ -->
                <div class="Top_Bar">

                    <div class="site-logo">

                        <a href="#"><figure><img src="img/logo.png" alt="Open Source Audio Meeting Cologne"></figure></a>

                    </div>

                    <!-- \\ Begin Navigation \\ -->
                    <nav class="Navigation">

                        <ul>
                            <li class="active"><a href="#"><span>Info</span></a></li>
                            <li class="gap"><a href="#About"><span>Termine</span></a></li>
                            <li class="gap gap1"><a href="#Contact"><span>Adresse</span></a></li>
                        </ul>

                        <figure><img src="img/triangle-img.png" alt="Image" class="triangle"></figure>

                    </nav>
<!-- <h2>Open Source Audio Meeting Cologne</h2> -->
                    <!-- // End Navigation // -->

                  <div class="clear"></div>
                </div>
                <!-- // End Top Bar // -->



                <!-- \\ Begin Product Section \\ -->
                <div class="Product_sec">

                    <ul>
                        <li>
                            <div class="right">

                                <div class="img">

                                    <figure><img src="img/icon01.png" alt="Image"></figure>

                                </div>

                                <div class="Details">
                                    <h3>Wer und Warum<span>Wir freuen uns auf dich!</span></h3>

                                    <p>Für Musikerinnen und Musiker, Programmierer, Hobbyisten und Profis, Anfänger und Experten, Lehrer und Schüler! Triff dich einmal im Monat zum Austausch von Neuigkeiten und Informationen, für gegenseitige Hilfe oder zum Diskutieren oder Philosophieren über Musik, Audio, Computer und Software.</p>

                                    <!-- <a href="#" class="button">Zur Planung</a> -->

                                </div>

                            </div>
                        </li>

                        <li>
                            <div class="left">

                                <div class="img">

                                    <figure><img src="img/icon02.png" alt="Image"></figure>

                                </div>

                                <div class="Details">

                                    <h3>Programm und Inhalt</h3>

                                    <p>Wir gestalten unser Programm gemeinschaftlich. Jedes mal finden Demonstrationen, Vorführungen, Tutorials oder Workshops rund um die Themen <b>"Musik gestalten mit Open Source und freier Software"</b> statt.</p>
                                    <a href="https://plan.osamc.de" class="button">Planung</a>
                                </div>

                            </div>
                        </li>
                    </ul>

                </div>
                <!-- // End Product Section // -->

                <a href="#About"><figure><img src="img/arrow-img.png" alt="Arrow" class="arrow"></figure></a>

            </div>
        </header>
        <!-- // End Header // -->

        <!-- \\ Begin Container \\ -->
        <div id="Container">

            <!-- \\ Begin Middle Section \\ -->
            <div class="Middle_sec" id="About">
                <div class="Center">

                    <div id="Leftside">

                        <div class="Client">
                            <figure>
                              <a href="https://www.meetup.com/Open-Source-Audio-Meeting-Cologne"><img src="img/pic-img3.png" alt="Meetup Logo" class="img-rounded"></a>
                            </figure>
                            <h3><a style="color:inherit;" href="https://www.meetup.com/Open-Source-Audio-Meeting-Cologne">Meetup</a></h3>
                        </div>

                        <div class="Client1">
                            <figure><a href="mailto:nils@hilbricht.net"><img src="img/pic-img2.png" alt="Nils Foto"></a></figure>
                            <p>Für alle weiteren Fragen<br> schreib Nils eine E-Mail</p>
                            <h3><a style="color:inherit;" href="mailto:nils@hilbricht.net">nils@hilbricht.net</a></h3>
                        </div>

                        <div class="Client2">
                            <figure><a href=""><img src="img/pic-chat.png" alt="Matrix Chat Link Icon" class="img-rounded"></a></figure>
                            <h3><a style="color:inherit;" href="https://chat.sonoj.org">Chat / Messenger</a></h3>
                        </div>
                    </div>

                    <div id="Rightside">

                        <ul>
                            <li>
                                <div class="Industrial">

                                    <figure><img src="img/icon03.png" alt="Image"></figure>

                                </div>

                                <div class="Information">

                                    <h4>Termine<span><a href="https://plan.osamc.de"><?php echo $nextDate; ?></a> 19:00 Uhr </span></h4>

                                    <p>Jeder Dritte Mittwoch im Monat (außer Dezember):<br>
                                    <?php echo $followingDates; ?>
                                    </p>

                                </div>
                            </li>
                            <li>
                                <div class="Industrial">

                                    <figure><img src="img/icon04.png" alt="Image"></figure>

                                </div>

                                <div class="Information">

                                    <h4>Was bisher geschah…<span>Protokolle</span></h4>

                                    <p>Vergangene Treffen werden protokolliert, damit Entscheidungen, Empfehlungen, Weblinks etc. erhalten bleiben.</p>
                                    <a href="protokolle" class="button">Zu den Protokollen</a>
                                    <br>
                                    <a href="slides" class="button">Zum Archiv</a>

                                </div>
                            </li>
                        </ul>

                    </div>

                </div>
            </div>
            <!-- // End Middle Section // -->


            <!-- \\ Begin Contact Section \\ -->
            <div class="Contact_sec" id="Contact">

                <!-- \\ Begin Contact Side \\ -->
                <div class="Contactside">

                    <div class="Center">

                        <div class="Form">

                            <h3>Nächstes Treffen: <span><?php echo $nextDate; ?></span></h3>
                            <form method="post" action="#">
                                <fieldset disabled>

                                    <p><input name="name" type="text" class="field" id="name" maxlength="50" placeholder="Chaos Computer Club Cologne"></p>

                                    <p><input name="email" type="email" class="field1" id="email" placeholder="Heliosstraße 6a, 50825 Köln, Erdgeschoss"></p>

                                    <p><textarea name="message" id="message" placeholder="Der Hauseingang ist seitlich. Die nächste Bahn und U-Bahn Haltestelle sind Bahnhof Ehrenfeld und Venloer Straße/Gürtel "></textarea> </p>

                                    <p><input name="submit" type="submit" class="Button" id="submit" value="Eintritt Frei - Keine Anmeldung" disabled></p>


<!-- Online Treffen
                                    <p><input name="name" type="text" class="field" id="name" maxlength="50" placeholder="Online Treffen"></p>

                                    <p><input name="email" type="email" class="field1" id="email" placeholder="https://bbb.daten.reisen/b/uaa-ytu-gqc"></p>

                                    <p><textarea name="message" id="message" placeholder="Bitte die Planung lesen: https://plan.osamc.de/ "></textarea> </p>

                                    <p><input name="submit" type="submit" class="Button" id="submit" value="Eintritt Frei - Keine Anmeldung" disabled></p>
-->
                                </fieldset>
                            </form>

                        </div>
                    </div>


                </div>
                <!-- // End Contact Side // -->

            </div>
            <!-- // End Contact Section // -->


        </div>
        <!-- // End Container // -->

        <!-- \\ Begin Footer \\-->
        <footer>
            <div class="Center">

                <p>Verantwortlich für den Inhalt:
                <br>Nils Hilbricht, c/o RA Matutis, Berliner Straße 57, 14467 Potsdam, nils@hilbricht.net, Tel: 0221 98657450
                <br>Design: <a rel="nofollow" href="http://www.templatemo.com/tm-471-zigzag" target="_parent">ZigZag</a> - Waveforms designed by <a href="http://www.freepik.com">Freepik</a>


                </p>

            </div>
        </footer>
        <!-- // End Footer // -->

    </div>
    <!-- // End Layout Frame // -->

</div>
<!-- // End Design Holder // -->

</body>

</html>
