<!doctype html> <!– @license Copyright © 2015 The Polymer Project Authors. All rights reserved. This code may only be used under the BSD style license found at polymer.github.io/LICENSE.txt The complete set of authors may be found at polymer.github.io/AUTHORS.txt The complete set of contributors may be found at polymer.github.io/CONTRIBUTORS.txt Code distributed by Google as part of the polymer project is also subject to an additional IP rights grant found at polymer.github.io/PATENTS.txt –>

<html> <head>

<title>Expand Card</title>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">

<script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../../../font-roboto/roboto.html">
<link rel="import" href="../../app-toolbar/app-toolbar.html">

<style>

  body {
    font-family: 'Roboto', sans-serif;
    margin: 0;
    background-color: #e5e5e5;
  }

  app-toolbar {
    background-color: white;
    box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.4);
  }

  .content {
    padding: 16px 40px;
  }

  .card {
    background-color: white;
    max-width: 720px;
    height: 500px;
    margin: 16px auto;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.37);
  }

  @media (max-width: 600px) {

    .content {
      padding: 0;
    }

    .card {
      margin: 8px;
    }

  }

</style>

</head> <body>

<app-toolbar></app-toolbar>

<div class="content">
  <div class="card"></div>
</div>

</body> </html>