/*
Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://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 http://polymer.github.io/PATENTS.txt
*/

#drawerPanel {
  background-color: #fafafa;
}

[drawer] {
  background-color: #fff;
  box-shadow: 1px 0 1px rgba(0, 0, 0, 0.1);
}

[main] {
  height: 100%;
}

[drawer] core-toolbar {
  background-color: #4F7DC9;
  color: #fff;
}

[main] core-toolbar {
  background-color: #526E9C;
  color: #fff;
}

/* adjust drawerPanel drawer's width instead of using the default from core-drawer-panel */
#drawerPanel::shadow #drawer {
  width: 260px;
}

#drawerPanel::shadow #main {
  left: 260px;
}

/* card */
#card {
  display: block;
  margin: 128px 100px 60px;
  background-color: #fff;
  box-shadow: rgba(0, 0, 0, 0.14902) 0px 2px 4px, rgba(0, 0, 0, 0.14902) 0px 0px 3px;
  overflow: hidden;
}

#card[hidden] {
  display: none;
}

#card.move-up {
  transition: -webkit-transform 0.38s ease-out;
  transition: transform 0.38s ease-out;
}

.action-button {
  z-index: 1;
}

#drawerPanel:not([narrow]) #menuButton {
  display: none;
}

.toolbar-label {
  letter-spacing: 0.05em;
}

#frame {
  display: block;
  width: 100%;
  min-height: 500px;
  border: none;
}

/* narrow layout */
#drawerPanel[narrow] [main] {
  background-color: #fff;
}

#drawerPanel[narrow] #card {
  margin: 0;
  box-shadow: none;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

#drawerPanel[narrow] #frame {
  min-height: 100%;
}

#drawerPanel[narrow] #frameContainer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: auto;
}