Angular Material Layout

HTML

<link rel="stylesheet" href="https://rawgit.com/angular/bower-material/master/angular-material.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular-animate.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular-aria.js"></script>
<script src="https://rawgit.com/angular/bower-material/master/angular-material.js"></script>
<div ng-app="sandbox">
  <div layout-gt-sm="row" layout="column" layout-margin>

    <md-calendar ng-model="date"></md-calendar>

    <md-input-container flex>
      <input ng-model="input" tabindex="0" required>
    </md-input-container>

    <md-input-container flex>
      <input ng-model="input" tabindex="0" required>
    </md-input-container>

  </div>
</div>

CSS

main {
  background: ivory;
}

img {
  max-width: 100%;
  width: 100%;
}

JavaScript

angular.module('sandbox', ['ngMaterial']);