index.html

---
layout: default
section_id: home
slides:
- title: 3, 4 et 5 mars 2017
  text:  Accélérez des <span>projets numériques citoyens</span>
  bg_color: "#3185FC"
  image: assets/images/EventNCC_square.jpg
- title: Porteur / participant / organisateur
  text: A <span>vous</span> de jouer !
  button:
    text: Participer
    url: https://codecitoyen.github.io/participer/participant.html
  bg_color: "#F9DC5C"
  image: assets/images/hackathon.jpg
- title: 3 pays en simultané
  text: Un événement <span>global</span>
  button:
    text: Rejoindre une ville
    url: https://codecitoyen.github.io/participer/participant.html
  bg_color: "#E84855"
  image: assets/images/city.png

milestones:
- title: Heures
  from: 0
  to: 36
- title: Villes
  from: 0
  to: 8
- title: Pays
  from: 0
  to: 3
- title: Projets
  from: 0
  to: 26

testimonials_left:
- theme: La démocratie numérique
  content: 
  avatar: assets/images/themes/democratie.jpg
- theme: Les données du citoyen
  content: 
  avatar: assets/images/themes/donnees.jpg
- theme: La ville accessible
  content: 
  avatar: assets/images/themes/accessible.jpg  
- theme: Nouveaux médias
  content: 
  avatar: assets/images/themes/democratie.jpg  
testimonials_right:
- theme: Les outils du collectif
  content: 
  avatar: assets/images/themes/collaboratif.jpg
- theme: L’éducation au numérique
  content: 
  avatar: assets/images/themes/education.jpg
- theme: L'air de nos campagnes
  content: 
  avatar: assets/images/themes/environnement.jpg

principles_one:
- title: Engagement
  desc: Travailler sur des projets pertinents et des défis technologiques
  icon: icon-basic-heart
- title: Rencontres
  desc: Relier passionnés de technologie, designers, acteurs engagés et institutions
  icon: icon-basic-flag2
- title: Glocal
  desc: Un événement global pensé au niveau local
  icon: icon-basic-paperplane
principles_two:
- title: Accompagnement
  desc: Assurer la continuité et le suivi des projets sur le long terme
  icon: icon-basic-accelerator
- title: Ludique
  desc: Un événement ludique et professionnel pour les participants
  icon: icon-basic-hammer
- title: Ouverture
  desc: Ouverture et diffusion auprès du public notamment à toutes les générations
  icon: icon-basic-share

partenaires:
- image: /assets/images/partenaires/ticket.png
- image: /assets/images/partenaires/odn.png
- image: /assets/images/partenaires/epitech.jpg
- image: /assets/images/partenaires/gamecampus.png
- image: /assets/images/partenaires/ticket.png
- image: /assets/images/partenaires/odn.png
- image: /assets/images/partenaires/epitech.jpg
- image: /assets/images/partenaires/gamecampus.png
---

<div class="full no-padding" style="height: 100vh;">
  <div id="slides">
    <div class="slides-container">
      {% for slide in page.slides %}
        <div class="slide">
          <div class="slide-info">
            <p>{{ slide.title }}</p>
            <h1>{{ slide.text }}</h1>
            <div class="three spacing"></div>
            {% if slide.button %}
              <a href="{{ slide.button.url }}" class="button boxed black">{{ slide.button.text }}</a>
              {% endif %}
          </div>
          <div class="slide-left" style="background-color: {{ slide.bg_color }};">
          </div>
          <div class="slide-right" style="background: url({{ slide.image }}) center center no-repeat;background-size: cover;">
          </div>
        </div>
      {% endfor %}
    </div>
    <nav class="slides-navigation">
      <a href="#" class="next"><i class="icon-arrows-slim-right"></i></a>
      <a href="#" class="prev"><i class="icon-arrows-slim-left"></i></a>
    </nav>
  </div>
</div>






<div class="full centered-text light-grey">
  <div class="section-title small">
    <div class="row">
      <div class="medium-10 medium-centered columns">

        <div class="spacing"></div>
        <h2>Un marathon d'innovation</h2>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="large-10 large-centered columns">
      <p class="big-text">
        La Nuit du Code Citoyen est un marathon d'innovation les 4 et 5 mars 2017 associant thématiques citoyennes et technologies avancées en simultané dans plusieurs villes de pays francophones. L’événement est suivi d’un programme d’accompagnement sur la durée.
      </p>
    </div>
  </div>
</div>

{% include _milestones.html %}

<div class="full">
  <div class="section-title">
    <div class="row">
      <div class="medium-10 medium-centered columns">
        <h2>Thématiques</h2>
        <p></p>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="large-6 columns">
      {% for testimonial in page.testimonials_left %}
        <div class="quote wow slideInLeft" data-wow-delay="{{ 0.2 | times:forloop.index0 }}s">
          <div class="row">
            <div class="small-3 columns">
              <img src="{{testimonial.avatar}}" alt="Theme">
            </div>
            <div class="small-9 columns">
              <p class="theme">{{testimonial.theme}}</p>
              <p>{{testimonial.content}}</p>
            </div>
          </div>
        </div>
      {% endfor %}
    </div>
    <div class="large-6 columns">
      {% for testimonial in page.testimonials_right %}
        <div class="quote reverse wow slideInRight" class="wow" data-wow-delay="{{ 0.2 | times:forloop.index0 }}s">
          <div class="row">
            <div class="small-3 columns">
              <img src="{{testimonial.avatar}}" alt="Theme">
            </div>
            <div class="small-9 columns">
              <p class="theme">{{testimonial.theme}}</p>
              <p>{{testimonial.content}}</p>
            </div>
          </div>
        </div>
      {% endfor %}
    </div>
  </div>
</div>

<div class="full light-grey centered-text">
  <div class="section-title">
    <div class="row">
      <div class="medium-10 medium-centered columns">
        <h2>Nos valeurs</h2>
        <!-- <p>We have principles to do things</p> -->
      </div>
    </div>
  </div>
  {% include _values_row.html principles=page.principles_one %}
  {% include _values_row.html principles=page.principles_two %}
</div>


<div class="full centered-text">
  <div class="two spacing"></div>
  <div class="row">
    <div class="large-12 columns">
      <h2>Intéressé ?</h2>
      <div class="two spacing"></div>
      <a href="{{site.baseurl}}/participer/organisateur.html" class="button brown  boxed">Organisateur</a>
      <a href="{{site.baseurl}}/participer/proposer-un-projet.html" class="button black boxed">Porteur de projet</a>
      <a href="{{site.baseurl}}/participer/participant.html" class="button dark boxed">Participant</a>
    </div>
  </div>
  <div class="two spacing"></div>
</div>

<div class="full light-grey no-padding">
  <div class="two spacing"></div>
  <div class='row'>
    <div class='large-12 columns text-center'>
      <div class='clients '>
        {% for partenaire in page.partenaires %}
        <div class="partenaire">
          <div class="logopartenaire"><a href="{{partenaire.url}}"><img alt="" src="{{site.url}}/{{partenaire.image}}"></a></div>
        </div>

        {% endfor %}
      </div>
    </div>
  </div>
  <div class="two spacing"></div>
</div>