index.html

<!doctype html>
<html class="no-js" lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Open summer of code 2018</title>
    <link rel="stylesheet" href="css/app.css">
    <link href="https://fonts.googleapis.com/css?family=Montserrat:400,500,600,700|Open+Sans:300,400" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">

    <meta name="description" content="Innovative open source projects, made by incredibly motivated students, coaches and organisations.">
    <meta name="keywords" content="oSoc18, open, summer, code, Belgium">
    <meta name="author" content="oSoc18 team, Open Knowledge Belgium">
    <meta name="viewport" content="width=device-width">
    <meta property="og:title" content="open summer of code 2018" />
    <meta property="og:type" content="website" />
    <meta property="og:url" content="http://2018.summerofcode.be" />
    <meta property="og:image" content="http://2018.summerofcode.be/img/socialmedia/socialmedia.png?4362984378" />
    <meta property="og:description" content="Innovative open source projects, made by incredibly motivated students, coaches and organisations." />
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:site" content="@osocode">
    <meta name="twitter:title" content="open summer of code 2018">
    <meta name="twitter:description" content="Innovative open source projects, made by incredibly motivated students, coaches and organisations.">
    <meta name="twitter:image" content="http://2018.summerofcode.be/img/socialmedia/socialmedia.png?4362984378" />
    <meta name="twitter:url" content="http://2018.summerofcode.be/" />

    <!-- FAVICONS -->
    <link rel="apple-touch-icon" sizes="57x57" href="img/favicons/apple-touch-icon-57x57.png">
    <link rel="apple-touch-icon" sizes="60x60" href="img/favicons/apple-touch-icon-60x60.png">
    <link rel="apple-touch-icon" sizes="72x72" href="img/favicons/apple-touch-icon-72x72.png">
    <link rel="apple-touch-icon" sizes="76x76" href="img/favicons/apple-touch-icon-76x76.png">
    <link rel="apple-touch-icon" sizes="114x114" href="img/favicons/apple-touch-icon-114x114.png">
    <link rel="apple-touch-icon" sizes="120x120" href="img/favicons/apple-touch-icon-120x120.png">
    <link rel="apple-touch-icon" sizes="144x144" href="img/favicons/apple-touch-icon-144x144.png">
    <link rel="apple-touch-icon" sizes="152x152" href="img/favicons/apple-touch-icon-152x152.png">
    <link rel="apple-touch-icon" sizes="180x180" href="img/favicons/apple-touch-icon-180x180.png">
    <link rel="icon" type="image/png" href="img/favicons/favicon-32x32.png" sizes="32x32">
    <link rel="icon" type="image/png" href="img/favicons/favicon-194x194.png" sizes="194x194">
    <link rel="icon" type="image/png" href="img/favicons/favicon-96x96.png" sizes="96x96">
    <link rel="icon" type="image/png" href="img/favicons/android-chrome-192x192.png" sizes="192x192">
    <link rel="icon" type="image/png" href="img/favicons/favicon-16x16.png" sizes="16x16">
    <link rel="manifest" href="img/favicons/manifest.json">
    <meta name="msapplication-TileColor" content="‪#FFFFFF">
    <meta name="msapplication-TileImage" content="mstile-144x144.png">
    <meta name="theme-color" content="‪#FFFFFF">
  </head>

  <body>
    <!-- topbar -->
    <div class="title-bar hide-for-large" data-responsive-toggle="nav-menu" data-hide-for="large">
      <div data-toggle="nav-menu">
        <button class="menu-icon" type="button"></button>
        <div class="logo logo--animated title-bar-title"><span class="c-yellow">open</span> <span class="c-yellow">summer</span> <span class="c-yellow">of</span> <span class="c-yellow">code</span></div>
      </div>
    </div>

    <div data-sticky-container>
      <div class="top-bar bs--darken-light" id="nav-menu" data-sticky data-options="marginTop:0;" style="width:100%">
        <div class="top-bar-left show-for-large">
          <a class="logo" href="index.html" data-hide-for="medium">
            <img src="img/logo/logo-osoc-color.svg" alt="open summer of code logo, very abstract, fun, but professional">
          </a>
        </div>
        <div class="top-bar-right">
          <ul class="menu vertical large-horizontal">
            <li><a href="index.html" class="button link lowercase u-margin--right">Home</a></li>
            <li><a href="practical.html" class="button link lowercase u-margin--right">Practical</a></li>
            <li><a href="students.html" class="button link lowercase u-margin--right">Students</a></li>
            <li><a href="companies.html" class="button link lowercase u-margin--right">Companies</a></li>
            <li><a href="coaches.html" class="button link lowercase u-margin--right">Coaches</a></li>
                    <!--<li><a href="2018.html" class="button link lowercase u-margin--right">2018</a></li>-->
                    <li>
                      <!-- <a href="2018.summerofcode.be" target="_blank" class="button">View 2018 showcase</a> -->
                      <a href="2018.html" target="_blank" class="button">Discover all oSoc18 projects<span class="button__info"></span></a>
                    </li>
          </ul>
        </div>
      </div>
    </div>

    <!-- hero -->
    <div class="hero-intro">
      <div class="grid-x grid-padding-x">
        <div class="medium-8 large-7 cell">
          <h2 class="hero-head">Innovative open source projects, made by incredibly motivated students, coaches &amp; organisations.</h2>
        </div>
         <div class="medium-10 large-5 cell large-offset-1">
          <div class="osoc-float-element-o"></div>
          <div class="osoc-float-element-s"></div>
          <div class="osoc-float-element-o-small"></div>
          <div class="osoc-float-element-c"></div>
        </div>
      </div>
    </div>

    <!-- links -->
    <div class="hero-themes">
      <div class="grid-x grid-padding-x grid-x--equal-height">
        <div class="small-12 medium-4 large-4 cell">
          <h2 class="h3"><a href="students.html">students</a></h2>
        </div>
        <div class="small-12 medium-4 large-4 cell">
          <h2 class="h3"><a href="companies.html">companies</a></h2>
        </div>
        <div class="small-12 medium-4 large-4 cell">
          <h2 class="h3"><a href="coaches.html">coaches</a></h2>
        </div>
      </div>
    </div>

    <!-- what is it -->
    <div class="grid-x align-middle c-what">
      <div class="small-12 large-5 cell">
        <div class="u-margin">
          <p class="intro-text">A 4-week summer programme in July, that provides Belgian based students the <strong>training</strong>, <strong>network</strong> and <strong>support</strong> necessary to transform <strong>open innovation projects</strong> into powerful real-world services.</p>
        </div>
      </div>
      <div class="small-12 large-7 cell">
        <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://player.vimeo.com/video/188284459?title=0&byline=0&portrait=0" style="position:absolute;top:0;left:0;right:0;width:100%;height:100%;" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div><script src="https://player.vimeo.com/api/player.js"></script>
        <!-- <a class="button fancy u-margin-large--t" href="projects.html">View last year's projects</a> -->
      </div>
    </div>

    <!-- bragging -->
    <div class="grid-x c-brag">
      <div class="small-6 medium-4 large-auto cell">
        <div class="grid-x c-brag__component">
          <div class="small-12 medium-12 cell c-brag__component__label">For over</div>
          <div class="small-12 medium-12 cell c-brag__component__number">8</div>
          <div class="small-12 medium-12 cell c-brag__component__counter">editions</div>
        </div>
      </div>
      <div class="small-6 medium-4 large-auto cell">
        <div class="grid-x c-brag__component">
          <div class="small-12 medium-12 cell c-brag__component__label">more than</div>
          <div class="small-12 medium-12 cell c-brag__component__number">237</div>
          <div class="small-12 medium-12 cell c-brag__component__counter">students</div>
        </div>
      </div>
      <div class="small-6 medium-4 large-auto cell">
        <div class="grid-x c-brag__component">
          <div class="small-12 medium-12 cell c-brag__component__label">built</div>
          <div class="small-12 medium-12 cell c-brag__component__number">62</div>
          <div class="small-12 medium-12 cell c-brag__component__counter">projects</div>
        </div>
      </div>
      <div class="small-6 medium-4 large-auto cell">
        <div class="grid-x c-brag__component">
          <div class="small-12 medium-12 cell c-brag__component__label">with</div>
          <div class="small-12 medium-12 cell c-brag__component__number">105</div>
          <div class="small-12 medium-12 cell c-brag__component__counter">partners</div>
        </div>
      </div>
      <div class="small-6 medium-4 large-auto cell">
        <div class="grid-x c-brag__component">
          <div class="small-12 medium-12 cell c-brag__component__label">and</div>
          <div class="small-12 medium-12 cell c-brag__component__number">54</div>
          <div class="small-12 medium-12 cell c-brag__component__counter">universities</div>
        </div>
      </div>
      <div class="small-6 medium-4 large-auto cell">
        <div class="grid-x c-brag__component">
          <div class="small-12 medium-12 cell c-brag__component__label">coached by</div>
          <div class="small-12 medium-12 cell c-brag__component__number">48</div>
          <div class="small-12 medium-12 cell c-brag__component__counter">coaches</div>
        </div>
      </div>
    </div>

    <!-- partners -->
    <div class="grid-x align-center c-partners">
		<div class="small-12 cell">
			<div class="grid-x">
				<div class="small-3 medium-auto cell">
					<a href="https://www.arteveldehogeschool.be/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/artevelde-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="https://www.becentral.org/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/becentral-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="http://www.stib-mivb.be/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/brussels-mivb-stib-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="https://mobilite-mobiliteit.brussels/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/brussels-mobility-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="http://www.compasbreda.nl/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/compas-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="https://cronos-groep.be/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/cronos-groep-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="https://www.government.nl/ministries/ministry-of-infrastructure-and-water-management" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/ministry-infrastructure-water-management-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="https://www.belgiantrain.be/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/nmbs-logo.svg">
					</a>
				</div>
			</div>

			<div class="grid-x">
				<div class="small-3 medium-auto cell">
					<a href="https://oasis.team/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/oasis-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="https://www.openknowledge.be/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/okbe-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="https://openthebox.be/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/openthebox-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="https://packed.be/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/packed-vzw.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="https://www.poolstok.be/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/poolstok-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="https://prisma.care/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/prisma-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="https://www.sciensano.be/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/sciensano-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="http://www.emodnet.eu/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/emodnet-logo.svg">
					</a>
				</div>
			</div>

			<div class="grid-x">
				<div class="small-3 medium-auto cell">
					<a href="http://www.thelearninghub.be/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/thelearninghub-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="https://www.vdab.be/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/vdab-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="https://www.cogni.zone/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/cognizone-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="https://www.vlaanderen.be/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/vlaanderen-logo.svg">
					</a>
				</div>

				<div class="small-3 medium-auto cell">
					<a href="http://www.vliz.be/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/vliz-logo.svg">
					</a>
				</div>

				<div class="small-2 medium-auto cell">
					<a href="https://www.west-vlaanderen.be/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/west-vlaanderen.svg">
					</a>
				</div>

				<div class="small-2 medium-auto cell">
					<a href="https://www.imec-int.com/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/imec-logo.svg">
					</a>
				</div>

				<div class="small-2 medium-auto cell">
					<a href="https://ec.europa.eu/commission/" target="_blank" class="vertical-align-container">
						<img src="img/partners-svg/european-commission-logo.svg">
					</a>
				</div>
			</div>
		</div>
    </div>

    <!-- footer -->
    <footer>
      <div class="grid-x grid-padding-x">
        <div class="small-12 medium-6 large-5 cell">
          <label for="mce-EMAIL" class="h6">Subscribe to our mailing list</label>
          <!-- mailchimp -->
          <div id="mc_embed_signup" class="u-margin-large--b">
            <form action="//okfn.us8.list-manage.com/subscribe/post?u=16c22b5f724fd6ef8c78c79fc&amp;id=4ec3a3c20a" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate="novalidate">
              <div id="mc_embed_signup_scroll">
                  <div class="button-group">
                    <input type="email" class="form-control u-margin-none" id="mce-EMAIL" name="EMAIL" placeholder="E-mail Address" required="" aria-required="true">
                    <input type="submit" class="button dark" value="Mail" name="subscribe" id="mc-embedded-subscribe">
                  </div>
                  <div id="mce-responses" class="clear">
                    <div class="response" id="mce-error-response" style="display:none"></div>
                    <div class="response" id="mce-success-response" style="display:none"></div>
                  </div>    <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
                  <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_16c22b5f724fd6ef8c78c79fc_4ec3a3c20a" tabindex="-1" value=""></div>
                </div>
            </form>
          </div>
        </div>

        <div class="small-12 medium-6 large-5 large-offset-2 cell">
          <div class="grid-x grid-padding-x">
            <!-- links -->
            <div class="small-4 medium-4 cell">
              <ul class="inline-list">
                <li>
                  <a href="students.html">Students</a>
                </li>
                <li>
                  <a href="companies.html">Companies</a>
                </li>
                <li>
                  <a href="coaches.html">Coaches</a>
                </li>
              </ul>
            </div>
            <div class="small-4 medium-4 cell">
              <ul class="inline-list">
                <li>
                  <a href="https://www.eventbrite.co.uk/e/demo-day-osoc18-registration-46709558547?ref=estw" target="_blank">Demo&nbsp;day</a>
                </li>
                <li>
                  <a href="practical.html">Practical</a>
                </li>
                <li>
                  <a href="2018.html">2018</a>
                </li>
              </ul>
            </div>
            <!-- contact -->
            <div class="small-4 medium-4 cell">
              <ul class="inline-list">
                <li>
                  <a href="mailto:dries@openknowledge.be">Contact</a>
                </li>
                <li>
                   <a href="https://twitter.com/osocode" target="_blank">Twitter</a>
                </li>
              </ul>
            </div>
          </div>
        </div>

        <div class="small-12 medium-12 large-6 cell">
          <!-- previous edition -->
          <div class="grid-x c-previous-editions">
            <div class="small-3 medium-auto cell">
              <a href="http://2011.summerofcode.be">
                <img src="img/previous-editions/2011W.svg">
              </a>
            </div>
            <div class="small-3 medium-auto cell">
              <a href="http://2012.summerofcode.be">
                <img src="img/previous-editions/2012W.svg">
              </a>
            </div>
            <div class="small-3 medium-auto cell">
              <a href="http://2013.summerofcode.be">
                <img src="img/previous-editions/2013W.svg">
              </a>
            </div>
            <div class="small-3 medium-auto cell">
              <a href="http://2014.summerofcode.be">
                <img src="img/previous-editions/2014W.svg">
              </a>
            </div>
            <div class="small-3 medium-auto cell">
              <a href="http://2015.summerofcode.be">
                <img src="img/previous-editions/2015W.svg">
              </a>
            </div>
            <div class="small-3 medium-auto cell">
              <a href="http://2016.summerofcode.be">
                <img src="img/previous-editions/2016W.svg">
              </a>
            </div>
            <div class="small-3 medium-auto cell">
              <a href="http://2017.summerofcode.be">
                <img src="img/previous-editions/2017W.svg">
              </a>
            </div>
          </div>
        </div>
        <div class="small-12 large-5 large-offset-1 cell">
          <p>Powered by <a href="https://www.openknowledge.be/" target="_blank">Open Knowledge Belgium</a> | <a href="https://github.com/oSoc18/website" target="_blank">Source code freely available on GitHub</a> | <a href="https://github.com/oSoc18/website/blob/master/CONTRIBUTORS.md" target="_blank">Contributors</a></p>
        </div>
      </div>
    </footer>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.4.3/js/foundation.js"></script>
    <script src="js/app.js"></script>

<!--    <script>
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
      m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

      ga('create', 'UA-86358919-4', 'auto');
      ga('send', 'pageview');

    </script> -->
  </body>
</html>