<!DOCTYPE html>
<html lang="fr">

<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="Site de la musique de Meyenheim">
    <meta name="author" content="Paul TREHIOU">

    <title>Musique fraternité - École de Musique</title>

    <!-- Bootstrap Core CSS -->
    <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">

    <!-- Custom Fonts -->
    <link href="vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
    <link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
    <link href='https://fonts.googleapis.com/css?family=Merriweather:400,300,300italic,400italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>

    <!-- Plugin CSS -->
    <link href="vendor/magnific-popup/magnific-popup.css" rel="stylesheet">

    <!-- Theme CSS -->
    <link href="css/creative.min.css" rel="stylesheet">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
        <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    
    <link rel="icon" type="image/jpg" href="img/favicon.jpg" />
    
    <!-- Piwik -->
    <script type="text/javascript">
    var _paq = _paq || [];
    _paq.push(['trackPageView']);
    _paq.push(['enableLinkTracking']);
    (function() {
    var u="//musique-meyenheim.fr/analytics/";
    _paq.push(['setTrackerUrl', u+'piwik.php']);
    _paq.push(['setSiteId', '1']);
    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
    g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
    })();
    </script>
    <noscript><p><img src="//musique-meyenheim.fr/analytics/piwik.php?idsite=1" style="border:0;" alt="" /></p></noscript>
    <!-- End Piwik Code -->

</head>

<body id="page-top">

    <?php include('navbar.html'); ?>

    <header style="background-image: url('img/ecole.jpg')">
        <div class="header-content">
            <div class="header-content-inner">
                <h1 id="homeHeading" style="text-shadow: 0px 0px 7px #000; margin-bottom: 400px;">École de Musique</br>«Les notes de l’Ill»</h1>
                <a href="#about" class="btn btn-primary btn-xl page-scroll">Plus d'informations</a>
            </div>
        </div>
    </header>

    <section class="bg-primary" id="about">
        <div class="container">
            <div class="row">
                <div class="col-lg-8 col-lg-offset-2 text-center">
                    <h2 class="section-heading">Présentation</h2>
                    <hr class="light">
                    <p class="text-faded">L’école de musique "Les notes de l'Ill" a été créée par la Société de Musique Fraternité dont elle dépend exclusivement et est dirigée par Nathalie ROHRBACH. Les enseignements musicaux, notamment en groupe, tout en développant les techniques musicales et d’écoute mutuelle, permettent à chacun de s’exprimer poétiquement. L'école de musique contribue ainsi à un développement artistique personnel mais aussi au recrutement de futurs musiciens de l'Harmonie intercommunale Centre Haut-Rhin. L’école de Musique est subventionnée par la Commune de Meyenheim, la Communauté de Communes Centre Haut-Rhin et par le Conseil Départemental du Haut-Rhin.</p>
                    <hr>
                    <h2 class="section-heading">Fonctionnement</h2>
                    <hr class="light">
                    <p class="text-faded">Les cours sont dispensés tout au long de l'année scolaire par des professeurs qualifiés, reconnus au niveau départemental.</p>
                    <a href="#services" class="page-scroll btn btn-default btn-xl sr-button">Découvrez nos prestations</a>
                </div>
            </div>
        </div>
    </section>
    
    <section id="services">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <h2 class="section-heading">L'école de musique propose</h2>
                    <hr class="primary">
                </div>
            </div>
        </div>
        <div class="container">
            <div class="row">
                <div class="col-lg-4 col-md-6 text-center">
                    <div class="service-box">
                        <i class="fa fa-4x fa-music text-primary sr-icons"></i>
                        <h3>Ateliers d’éveil musical et d’initiation musicale</h3>
                        <h4>Pour les enfants de la Grande section de Maternelle au CE1</h4>
                        <p class="text-muted">L’élève intègre un des groupes proposés par le professeur Nathalie ROHRBACH. Ces ateliers ont pour but de sensibiliser l’enfant aux sons, aux rythmes, aux couleurs musicales, de façon ludique et amusante. Ils offrent aux élèves la possibilité de découvrir leur voix comme outil musical et l’aideront à faire le choix d’un instrument pour la poursuite de l’apprentissage</p>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 text-center">
                    <div class="service-box">
                        <i class="fa fa-4x fa-user text-primary sr-icons"></i>
                        <h3>Pratique instrumentale ou vocale individualisée</h3>
                        <h4>À partir du CE1 et pour les adultes</h4>
                        <p class="text-muted">Cours d’instrument ou de chant seul avec l’enseignant (30' à 45’ suivant le cas). L’élève et l’enseignant établissent ensemble en début d’année scolaire le projet et le programme musical</p>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 text-center">
                    <div class="service-box">
                        <i class="fa fa-4x fa-users text-primary sr-icons"></i>
                        <h3>Classe de formation musicale avec instrument (Chant compris)</h3>
                        <h4>À partir du CE1 et pour les adultes</h4>
                        <p class="text-muted">L’élève intègre un des groupes proposés par le responsable pédagogique et son équipe. L’objectif est d’analyser et comprendre les éléments fondamentaux de la formation musicale par les partitions proposés et apprendre à jouer ensemble. Certains groupes interviennent en public lors de différentes manifestations</p>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 text-center">
                    <div class="service-box">
                        <img src="img/trombone.gif" alt="icone trombone">
                        <h3>Les instruments enseignés sont</h4>
                        <ul class="list-group">
                            <li class="list-group-item track" data-toggle="popover" data-content="Nathalie ROHRBACH" data-title="Enseignant">Le chant
                            <li class="list-group-item" data-toggle="popover" data-content="Robert SCHMIDT" data-title="Enseignant">La flûte traversière et la flûte à bec
                            <li class="list-group-item" data-toggle="popover" data-content="Régis MAERKY" data-title="Enseignant">La clarinette
                            <li class="list-group-item" data-toggle="popover" data-content="Régis MAERKY" data-title="Enseignant">Les saxophones
                            <li class="list-group-item" data-toggle="popover" data-content="Mimo ILIEV" data-title="Enseignant">La trompette
                            <li class="list-group-item" data-toggle="popover" data-content="Mimo ILIEV" data-title="Enseignant">L'euphonium / baryton
                            <li class="list-group-item" data-toggle="popover" data-content="Mimo ILIEV" data-title="Enseignant">Le trombone
                            <li class="list-group-item" data-toggle="popover" data-content="Stephane AFFHOLDER" data-title="Enseignant">La batterie
                            <li class="list-group-item" data-toggle="popover" data-content="Gilbert AMANN" data-title="Enseignant">La guitare acoustique
                            <li class="list-group-item" data-toggle="popover" data-content="Gilbert AMANN" data-title="Enseignant">La guitare électrique
                            <li class="list-group-item" data-toggle="popover" data-content="Sur demande">Le piano
                            <li class="list-group-item" data-toggle="popover" data-content="Sur demande">L'orgue d'église
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section id="contact">
        <div class="container">
            <div class="row">
                <div class="col-lg-8 col-lg-offset-2 text-center">
                    <h2 class="section-heading">Contact</h2>
                    <hr class="primary">
                    <p>Nathalie ROHRBACH, Directrice</p>
                </div>
                <div class="col-lg-4 col-lg-offset-2 text-center">
                    <i class="fa fa-phone fa-3x sr-contact"></i>
                    <p>07 68 40 11 38</p>
                </div>
                <div class="col-lg-4 text-center">
                    <i class="fa fa-at fa-3x sr-contact"></i>
                    <p><a href="mailto:contact@musique-meyenheim.fr">ecole@musique-meyenheim.fr</a></p>
                </div>
                <div class="col-lg-8 col-lg-offset-2 text-center">
                    <i class="fa fa-envelope fa-3x sr-contact"></i>
                    <p>Société de Musique Fraternité</br>10 rue de l’Ill</br>68890 MEYENHEIM</p>
                </div>
            </div>
        </div>
    </section>

    <?php include('footer.html'); ?>

    <!-- jQuery -->
    <script src="vendor/jquery/jquery.min.js"></script>

    <!-- Bootstrap Core JavaScript -->
    <script src="vendor/bootstrap/js/bootstrap.min.js"></script>
    <script src="vendor/appear/appear.min.js"></script>
    
    <script type="text/javascript">
        $(function () {
            $('[data-toggle="popover"]').popover({trigger: "hover"})
        })
        
        appear({
            elements: function elements(){
                // work with all elements with the class "track"
                return document.getElementsByClassName('track');
            },
            appear: function appear(el){
                console.log('visible', el);
                $(el).popover('show');
            },
        });
    </script>

    <!-- Plugin JavaScript -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
    <script src="vendor/scrollreveal/scrollreveal.min.js"></script>
    <script src="vendor/magnific-popup/jquery.magnific-popup.min.js"></script>

    <!-- Theme JavaScript -->
    <script src="js/creative.min.js"></script>

</body>

</html>
