---
layout: default
---
        <!-- Header -->
        <header id="header" class="alt">
            <span class="logo"><img src="images/logo.png" alt="mobilespace" /></span>
            <span class="typedheader typed"></span> <!-- filled by main.js using typed.js -->
        </header>
        <div id="main">
            <section id="intro" class="main">
                <div class="spotlight">
                    <div class="content">
                        <header class="major">
                            <h2>What is MobileSpace?</h2>
                        </header>
                        <p><strong>MobileSpace</strong> is a weekly meetup in San Francisco to enable developers to build and publish their own mobile apps with
                            an excellent in-person community to teach and help accelerate your project to completion.</p>
                    </div>
                    <span class="image"><img src="images/section1.gif" alt="what is mobilespace" /></span>
                </div>
            </section>
            <section id="subteams" class="main special">
                <header class="major">
                    <h2>How?</h2>
                </header>
                <ul class="features">
                    {% for item in site.subteam %}
                    <li>
                        <span class="icon major {{ item.iconstyle }} {{ item.icon }}"></span>
                        <h3>{{ item.title }}</h3>
                        <p>{{ item.description }}</p>
                    </li>
                    {% endfor %}
                </ul>
            </section>
            <section id="second" class="main special">
                <header class="major">
                    <h2>Why join?</h2>
                </header>
                    {% for item in site.competition %}
                    <p style="clear: both;">
                    <span class="image {% cycle 'left', 'right' %}"><img src="{{ item.image }}" alt="" /></span>
                    <h3> {{ item.title }} </h3>
                    {{ item.description }}
                    </p>
                    <br /><br /><br />
                    {% endfor %}
                    Join the community today and let MobileSpace help you become a successful software engineer. <br /><br />
                    <ul class="actions">
                        <li><a href="/applications/on-demand.html" class="button big special">Apply Now!</a></li>
                    </ul>
            </section>
            <section id="third" class="main special">
                <header class="major">
                    <h2>Community Updates</h2>
                </header>
                {% for post in site.tags["milestone"] %}
                <p>
                    <h2>{{ post.date | date: "%B %-d, %Y" }}</h2><b>
                </p>
                <p><a href="{{ post.url | prepend: site.baseurl }}" style="text-decoration: underline">
                {{ post.title }}</b>
                </p>
                <br /><br />
                </a>
                {% endfor %}
            </section>
            <section id="fourth" class="main special">
                <header class="major">
                    <h2>Community Members</h2>
                </header>
                <div class="members">
                  {% for item in site.research %}
                  <a href="{{ item.link }}" target="_blank">
                    <div class="image">
                      <img src="{{ item.image }}" style= "height: 100px; width: 100px" alt="" />
                      <center style="text-decoration: underline">{{ item.name }}</center>
                    </div>
                  </a>
                  {% endfor %}
                </div>
            </section>
        </div>