% title $self->l('WELCOME');
%= include 'header'
%= include 'public_toolbar'

<div class="container-fluid">

  <div class="well" id="createRoomContainer">
    <form id="createRoom" class="form-inline" action="<%=url_for('/create')%>" method="post">
      <fieldset>
        <legend><center><%=l 'CREATE_ROOM' %></center></legend>
        <div class="control-group">
          <div class="input-group">
            <input id="roomName" name="roomName" type="text" placeholder="<%=l 'ROOM_NAME' %>" class="form-control help" data-toggle="tooltip" data-placement="bottom" title="<%=l 'RANDOM_IF_EMPTY' %>" autofocus>
            <span class="input-group-btn">
              <button type="submit" class="btn btn-default"><span class="glyphicon glyphicon-log-in"></span></button>
            </span>
          </div>
        </div>
      </fieldset>
    </form>
  </div>
  <br/><br/>
  <div class="row">
    <div class="col-sm-12 col-md-4">
      <div class="thumbnail">
        <div>
          <center>
            <img src="/img/lock.png" alt="Secure">
          </center>
        </div>
        <div class="caption">
          <h3><center><%=l 'SECURE' %></center></h3>
          <p><%=l "P2P_COMMUNICATION" %></p>
        </div>
      </div>
    </div>
    <div class="col-sm-12 col-md-4">
      <div class="thumbnail">
        <div>
          <center>
            <img src="/img/firefox.png" alt="Firefox">
            <img src="/img/chrome.png" alt="Chrome">
            <img src="/img/opera.png" alt="Opera">
          </center>
        </div>
        <div class="caption">
          <h3><center><%=l 'WORKS_EVERYWHERE' %></center></h3>
          <p><%=l "MODERN_BROWSERS" %></p>
        </div>
      </div>
    </div>
    <div class="col-sm-12 col-md-4">
      <div class="thumbnail">
        <div>
          <center>
            <img src="/img/share.png" alt="Peer to peer">
          </center>
        </div>
        <div class="caption">
          <h3><center><%=l 'MULTI_USER' %></center></h3>
          <p><%=l "THE_LIMIT_IS_YOUR_PIPE" %></p>
        </div>
      </div>
    </div>
  </div>
</div>
%= include 'js_include'
%= include 'footer'