index.html

---
layout: home
title: Home
slug: home
lead: Define and deploy applications with easy. Any application, any stack, and cloud provider. Colaborate with others and manager your cloud resrouces on one platform.
base_url: "./"
---

<main id="content" role="main">
  <div class="jumbotron hero" id="home">
    <div class="container">
      <div class="col-lg-12 text-center">
        <h2 class="home-lead">Develop, Deploy and Manage Apps on any Cloud.</h2>
        <h3 class="home-sub">Designed And Built For Developers. Try The Free Edition.</h3>
        <div class="sign-up-container">
          <button type="button" class="btn btn-primary btn-block btn-lg btn-home hidden-xs" href=""><span class="fa fa-github"></span>   SIGN UP WITH GITHUB</button>
          <span class="divider hidden-xs">Or</span>
          <input class="form-control input-lg input-home" placeholder="Enter Email Address"></input>
          <button class="btn btn-danger btn-lg btn-home">TRY FOR FREE</button>
          <h5 class="sub text-center">No credit card required • No commitment</h5>
        </div>
      </div>
    </div>
  </div>

  <div id="animation-wrapper">
    <section id="pick-your-boxes">
      <div class="inner">
        <div class="copy">
          <h2>Pick Your Boxes</h2>
          <p>Choose your application components from our service catalogue of boxes. Create your own boxes and isolated application components.</p>
        </div>

        <div class="static-illustration"></div>

        <div class="boxes hidey">
          <div class="box ruby"></div>
          <div class="box mongo"></div>
          <div class="box mysql"></div>
          <div class="box newrelic"></div>
          <div class="box jenkins"></div>
          <div class="box node"></div>
          <div class="box angular"></div>
          <div class="box linux"></div>
          <div class="box postgres"></div>
          <div class="box rabbitmq"></div>
          <div class="box chef"></div>
          <div class="box apache"></div>
        </div>
      </div>
    </section>

    <section id="stack-your-boxes">
      <div class="inner">
        <div class="copy">
          <h2>Stack Your Boxes</h2>
          <p>Stack boxes to create complex multi-tier application architecture using modular, isolated components.</p>
        </div>

        <div class="static-illustration"></div>
      </div>
    </section>

    <section id="deploy-applications">
      <div class="inner">
        <div class="copy">
          <h2>Deploy Applications</h2>
          <p>Get your applications running in no time on the provider of your choice. Keep your applications cloud agnostic and your options open.</p>
        </div>

        <div class="static-illustration"></div>

        <div class="cloud c1"></div>
        <div class="cloud c2"></div>
        <div class="cloud c3"></div>
        <div class="cloud c4"></div>
        <div class="cloud c5"></div>
        <div class="cloud c6 front"></div>
        <div class="cloud c7 front"></div>
        <div class="cloud c8 front"></div>
        <div class="cloud c9 front"></div>

        <div id="shuttle">
          <div class="nose"></div>
        </div>
      </div>
    </section>
  </div>

  <div class="jumbotron not-convinced-block">
    <div class="container text-center">
      <h2 class="jumbo-not-convinced">Boom. Application Deployed.</h2>
      <h3 class="home-sub hidden-xs">DevOps At Your Fingertips.</h3>
      <button type="button" class="btn btn-danger btn-lg btn-convinced" href="#sign-up-modal" data-toggle="modal" data-target="#sign-up-modal">TRY FOR YOURSELF</button>
      <div class="not-convinced-more">
        <h5 class="sub hidden-xs">Still not convinced?</h5>
        <h5 class="sub hidden-xs">Learn More Bellow.</h5>
        <span class="glyphicon glyphicon-chevron-down not-convinced-down"></span>
      </div>
    </div>
  </div>

  <div class="jumbotron jumbotron-home-special">
    <div class="container elasticbox-special padding-4x">
      <h2 class="text-center">What makes ElasticBox special?</h2>
      <h3 class="col-md-8 col-md-offset-2 lead text-center">A central platform built for enterprise developers. Everything you need in one place to manage your cloud applications and infrastructure.</h3>

      <div class="row padding-4x">
        <div class="col-lg-4 col-lg-offset-1 col-sm-6 feature-highlight padding-2x text-center">
          <img class="img-responsive" src="https://dl.dropboxusercontent.com/u/11221717/Screenshot%202014-02-06%2018.33.52.png"></img>
          <h4 class="">Developer Focused</h4>
          <p class="lead">Purpose built to manage all your app configurations, variables and dependencies. Use ElasticBox to maintain your CM tools (Chef, Docker, Puppet) or standard scripting language scripts (bash, PowerShell).</p>
          <a class="more" href="{{ page.base_url }}features/#life-cycle-editor">LEARN MORE</a>
        </div>
        <div style="margin-top:40px;" class="col-lg-4 col-lg-offset-2 col-sm-6 feature-highlight padding-2x text-center">
          <img class="img-responsive" src="https://dl.dropboxusercontent.com/u/11221717/Screenshot%202014-02-06%2018.34.00.png"></img>
          <h4>Collaborate With Ease</h4>
          <p class="lead">Work with teams or individual developers by adding users to your workspaces or sharing applications and components as boxes. Detailed collaboration and permission options means you can work together, securely.</p>
          <a class="more" href="{{ page.base_url }}about">LEARN MORE</a>
        </div>
      </div>
    </div>
  </div>
</main>