/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Material Design Lite */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Material Design Lite */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */
/* ==========================================================================
 Base styles: opinionated defaults
 ========================================================================== */
html {
  color: rgba(0,0,0, 0.87);
  font-size: 1em;
  line-height: 1.4; }
/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */
::selection {
  background: #b3d4fc;
  text-shadow: none; }
/*
 * A better looking default horizontal rule
 */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0; }
/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */
audio, canvas, iframe, img, svg, video {
  vertical-align: middle; }
/*
 * Remove default fieldset styles.
 */
fieldset {
  border: 0;
  margin: 0;
  padding: 0; }
/*
 * Allow only vertical resizing of textareas.
 */
textarea {
  resize: vertical; }
/* ==========================================================================
 Browser Upgrade Prompt
 ========================================================================== */
.browserupgrade {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0; }
/* ==========================================================================
 Author's custom styles
 ========================================================================== */
/* ==========================================================================
 Helper classes
 ========================================================================== */
/*
 * Hide visually and from screen readers:
 */
.hidden {
  display: none !important; }
/*
 * Hide only visually, but have it available for screen readers:
 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */
.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px; }
/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto; }
/*
 * Hide visually and from screen readers, but maintain layout
 */
.invisible {
  visibility: hidden; }
/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.clearfix:before, .clearfix:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */ }

.clearfix:after {
  clear: both; }
/* ==========================================================================
 EXAMPLE Media Queries for Responsive Design.
 These examples override the primary ('mobile first') styles.
 Modify as content requires.
 ========================================================================== */
@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */ }

@media print, (min-resolution: 1.25dppx), (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */ }
/* ==========================================================================
 Print styles.
 Inlined to avoid the additional HTTP request:
 http://www.phpied.com/delay-loading-your-print-css/
 ========================================================================== */
@media print {
  /*
   * Don't show links that are fragment identifiers,
   * or use the `javascript:` pseudo protocol
   */
  /*
   * Printing Tables:
   * http://css-discuss.incutio.com/wiki/Printing_Tables
   */
    *, *:before, *:after, *:first-letter {
      background: transparent !important;
      color: #000 !important;
      /* Black prints faster: http://www.sanbeiji.com/archives/953 */
      box-shadow: none !important; }
    a, a:visited {
      text-decoration: underline; }
    a[href]:after {
      content: " (" attr(href) ")"; }
    abbr[title]:after {
      content: " (" attr(title) ")"; }
    a[href^="#"]:after, a[href^="javascript:"]:after {
      content: ""; }
    pre, blockquote {
      border: 1px solid #999;
      page-break-inside: avoid; }
    thead {
      display: table-header-group; }
    tr, img {
      page-break-inside: avoid; }
    img {
      max-width: 100% !important; }
    p, h2, h3 {
      orphans: 3;
      widows: 3; }
    h2, h3 {
      page-break-after: avoid; } }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/* Remove the unwanted box around FAB buttons */
/* More info: http://goo.gl/IPwKi */
a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu, .mdl-icon-toggle, .mdl-item, .mdl-radio, .mdl-slider, .mdl-switch, .mdl-tabs__tab {
  -webkit-tap-highlight-color: transparent;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0); }
/*
 * Make html take up the entire screen
 * Then set touch-action to avoid touch delay on mobile IE
 */
html {
  width: 100%;
  height: 100%;
  -ms-touch-action: manipulation;
  touch-action: manipulation; }
/*
 * Make body take up the entire screen
 * Remove body margin so layout containers don't cause extra overflow.
 */
body {
  width: 100%;
  min-height: 100%;
  margin: 0; }
/*
 * Main display reset for IE support.
 * Source: http://weblog.west-wind.com/posts/2015/Jan/12/main-HTML5-Tag-not-working-in-Internet-Explorer-91011
 */
main {
  display: block; }
/*
 * Apply no display to elements with the hidden attribute.
 * IE 9 and 10 support.
 */
*[hidden] {
  display: none !important; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
html, body {
  font-family: 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px; }

h1, h2, h3, h4, h5, h6, p {
  margin: 0;
  padding: 0; }
/**
 * Styles for HTML elements
 */
h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 56px;
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: -0.02em;
  opacity: 0.54;
  font-size: 0.6em; }

h1 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 56px;
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: -0.02em;
  margin-top: 24px;
  margin-bottom: 24px; }

h2 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 45px;
  font-weight: 400;
  line-height: 48px;
  margin-top: 24px;
  margin-bottom: 24px; }

h3 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 34px;
  font-weight: 400;
  line-height: 40px;
  margin-top: 24px;
  margin-bottom: 24px; }

h4 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 32px;
  -moz-osx-font-smoothing: grayscale;
  margin-top: 24px;
  margin-bottom: 16px; }

h5 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.02em;
  margin-top: 24px;
  margin-bottom: 16px; }

h6 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0.04em;
  margin-top: 24px;
  margin-bottom: 16px; }

p {
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0;
  margin-bottom: 16px; }

a {
  color: rgb($color-accent);
  font-weight: 500; }

blockquote {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  position: relative;
  font-size: 24px;
  font-weight: 300;
  font-style: italic;
  line-height: 1.35;
  letter-spacing: 0.08em; }
  blockquote:before {
    position: absolute;
    left: -0.5em;
    content: '“'; }
  blockquote:after {
    content: '”';
    margin-left: -0.05em; }

mark {
  background-color: #f4ff81; }

dt {
  font-weight: 700; }

address {
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  font-style: normal; }

ul, ol {
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0; }
/**
 * Class Name Styles
 */
.mdl-typography--display-4 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 112px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.04em; }

.mdl-typography--display-4-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 112px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.04em;
  opacity: 0.54; }

.mdl-typography--display-3 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 56px;
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: -0.02em; }

.mdl-typography--display-3-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 56px;
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: -0.02em;
  opacity: 0.54; }

.mdl-typography--display-2 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 45px;
  font-weight: 400;
  line-height: 48px; }

.mdl-typography--display-2-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 45px;
  font-weight: 400;
  line-height: 48px;
  opacity: 0.54; }

.mdl-typography--display-1 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 34px;
  font-weight: 400;
  line-height: 40px; }

.mdl-typography--display-1-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 34px;
  font-weight: 400;
  line-height: 40px;
  opacity: 0.54; }

.mdl-typography--headline {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 32px;
  -moz-osx-font-smoothing: grayscale; }

.mdl-typography--headline-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 32px;
  -moz-osx-font-smoothing: grayscale;
  opacity: 0.87; }

.mdl-typography--title {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.02em; }

.mdl-typography--title-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.02em;
  opacity: 0.87; }

.mdl-typography--subhead {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0.04em; }

.mdl-typography--subhead-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0.04em;
  opacity: 0.87; }

.mdl-typography--body-2 {
  font-size: 14px;
  font-weight: bold;
  line-height: 24px;
  letter-spacing: 0; }

.mdl-typography--body-2-color-contrast {
  font-size: 14px;
  font-weight: bold;
  line-height: 24px;
  letter-spacing: 0;
  opacity: 0.87; }

.mdl-typography--body-1 {
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0; }

.mdl-typography--body-1-color-contrast {
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0;
  opacity: 0.87; }

.mdl-typography--body-2-force-preferred-font {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: 0; }

.mdl-typography--body-2-force-preferred-font-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: 0;
  opacity: 0.87; }

.mdl-typography--body-1-force-preferred-font {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0; }

.mdl-typography--body-1-force-preferred-font-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0;
  opacity: 0.87; }

.mdl-typography--caption {
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0; }

.mdl-typography--caption-force-preferred-font {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0; }

.mdl-typography--caption-color-contrast {
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  opacity: 0.54; }

.mdl-typography--caption-force-preferred-font-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  opacity: 0.54; }

.mdl-typography--menu {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0; }

.mdl-typography--menu-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0;
  opacity: 0.87; }

.mdl-typography--button {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  line-height: 1;
  letter-spacing: 0; }

.mdl-typography--button-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  line-height: 1;
  letter-spacing: 0;
  opacity: 0.87; }

.mdl-typography--text-left {
  text-align: left; }

.mdl-typography--text-right {
  text-align: right; }

.mdl-typography--text-center {
  text-align: center; }

.mdl-typography--text-justify {
  text-align: justify; }

.mdl-typography--text-nowrap {
  white-space: nowrap; }

.mdl-typography--text-lowercase {
  text-transform: lowercase; }

.mdl-typography--text-uppercase {
  text-transform: uppercase; }

.mdl-typography--text-capitalize {
  text-transform: capitalize; }

.mdl-typography--font-thin {
  font-weight: 200 !important; }

.mdl-typography--font-light {
  font-weight: 300 !important; }

.mdl-typography--font-regular {
  font-weight: 400 !important; }

.mdl-typography--font-medium {
  font-weight: 500 !important; }

.mdl-typography--font-bold {
  font-weight: 700 !important; }

.mdl-typography--font-black {
  font-weight: 900 !important; }

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  word-wrap: normal;
  font-feature-settings: 'liga';
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-color-text--red {
  color: rgb(244,67,54) !important; }

.mdl-color--red {
  background-color: rgb(244,67,54) !important; }

.mdl-color-text--red-50 {
  color: rgb(255,235,238) !important; }

.mdl-color--red-50 {
  background-color: rgb(255,235,238) !important; }

.mdl-color-text--red-100 {
  color: rgb(255,205,210) !important; }

.mdl-color--red-100 {
  background-color: rgb(255,205,210) !important; }

.mdl-color-text--red-200 {
  color: rgb(239,154,154) !important; }

.mdl-color--red-200 {
  background-color: rgb(239,154,154) !important; }

.mdl-color-text--red-300 {
  color: rgb(229,115,115) !important; }

.mdl-color--red-300 {
  background-color: rgb(229,115,115) !important; }

.mdl-color-text--red-400 {
  color: rgb(239,83,80) !important; }

.mdl-color--red-400 {
  background-color: rgb(239,83,80) !important; }

.mdl-color-text--red-500 {
  color: rgb(244,67,54) !important; }

.mdl-color--red-500 {
  background-color: rgb(244,67,54) !important; }

.mdl-color-text--red-600 {
  color: rgb(229,57,53) !important; }

.mdl-color--red-600 {
  background-color: rgb(229,57,53) !important; }

.mdl-color-text--red-700 {
  color: rgb(211,47,47) !important; }

.mdl-color--red-700 {
  background-color: rgb(211,47,47) !important; }

.mdl-color-text--red-800 {
  color: rgb(198,40,40) !important; }

.mdl-color--red-800 {
  background-color: rgb(198,40,40) !important; }

.mdl-color-text--red-900 {
  color: rgb(183,28,28) !important; }

.mdl-color--red-900 {
  background-color: rgb(183,28,28) !important; }

.mdl-color-text--red-A100 {
  color: rgb(255,138,128) !important; }

.mdl-color--red-A100 {
  background-color: rgb(255,138,128) !important; }

.mdl-color-text--red-A200 {
  color: rgb(255,82,82) !important; }

.mdl-color--red-A200 {
  background-color: rgb(255,82,82) !important; }

.mdl-color-text--red-A400 {
  color: rgb(255,23,68) !important; }

.mdl-color--red-A400 {
  background-color: rgb(255,23,68) !important; }

.mdl-color-text--red-A700 {
  color: rgb(213,0,0) !important; }

.mdl-color--red-A700 {
  background-color: rgb(213,0,0) !important; }

.mdl-color-text--pink {
  color: rgb(233,30,99) !important; }

.mdl-color--pink {
  background-color: rgb(233,30,99) !important; }

.mdl-color-text--pink-50 {
  color: rgb(252,228,236) !important; }

.mdl-color--pink-50 {
  background-color: rgb(252,228,236) !important; }

.mdl-color-text--pink-100 {
  color: rgb(248,187,208) !important; }

.mdl-color--pink-100 {
  background-color: rgb(248,187,208) !important; }

.mdl-color-text--pink-200 {
  color: rgb(244,143,177) !important; }

.mdl-color--pink-200 {
  background-color: rgb(244,143,177) !important; }

.mdl-color-text--pink-300 {
  color: rgb(240,98,146) !important; }

.mdl-color--pink-300 {
  background-color: rgb(240,98,146) !important; }

.mdl-color-text--pink-400 {
  color: rgb(236,64,122) !important; }

.mdl-color--pink-400 {
  background-color: rgb(236,64,122) !important; }

.mdl-color-text--pink-500 {
  color: rgb(233,30,99) !important; }

.mdl-color--pink-500 {
  background-color: rgb(233,30,99) !important; }

.mdl-color-text--pink-600 {
  color: rgb(216,27,96) !important; }

.mdl-color--pink-600 {
  background-color: rgb(216,27,96) !important; }

.mdl-color-text--pink-700 {
  color: rgb(194,24,91) !important; }

.mdl-color--pink-700 {
  background-color: rgb(194,24,91) !important; }

.mdl-color-text--pink-800 {
  color: rgb(173,20,87) !important; }

.mdl-color--pink-800 {
  background-color: rgb(173,20,87) !important; }

.mdl-color-text--pink-900 {
  color: rgb(136,14,79) !important; }

.mdl-color--pink-900 {
  background-color: rgb(136,14,79) !important; }

.mdl-color-text--pink-A100 {
  color: rgb(255,128,171) !important; }

.mdl-color--pink-A100 {
  background-color: rgb(255,128,171) !important; }

.mdl-color-text--pink-A200 {
  color: rgb(255,64,129) !important; }

.mdl-color--pink-A200 {
  background-color: rgb(255,64,129) !important; }

.mdl-color-text--pink-A400 {
  color: rgb(245,0,87) !important; }

.mdl-color--pink-A400 {
  background-color: rgb(245,0,87) !important; }

.mdl-color-text--pink-A700 {
  color: rgb(197,17,98) !important; }

.mdl-color--pink-A700 {
  background-color: rgb(197,17,98) !important; }

.mdl-color-text--purple {
  color: rgb(156,39,176) !important; }

.mdl-color--purple {
  background-color: rgb(156,39,176) !important; }

.mdl-color-text--purple-50 {
  color: rgb(243,229,245) !important; }

.mdl-color--purple-50 {
  background-color: rgb(243,229,245) !important; }

.mdl-color-text--purple-100 {
  color: rgb(225,190,231) !important; }

.mdl-color--purple-100 {
  background-color: rgb(225,190,231) !important; }

.mdl-color-text--purple-200 {
  color: rgb(206,147,216) !important; }

.mdl-color--purple-200 {
  background-color: rgb(206,147,216) !important; }

.mdl-color-text--purple-300 {
  color: rgb(186,104,200) !important; }

.mdl-color--purple-300 {
  background-color: rgb(186,104,200) !important; }

.mdl-color-text--purple-400 {
  color: rgb(171,71,188) !important; }

.mdl-color--purple-400 {
  background-color: rgb(171,71,188) !important; }

.mdl-color-text--purple-500 {
  color: rgb(156,39,176) !important; }

.mdl-color--purple-500 {
  background-color: rgb(156,39,176) !important; }

.mdl-color-text--purple-600 {
  color: rgb(142,36,170) !important; }

.mdl-color--purple-600 {
  background-color: rgb(142,36,170) !important; }

.mdl-color-text--purple-700 {
  color: rgb(123,31,162) !important; }

.mdl-color--purple-700 {
  background-color: rgb(123,31,162) !important; }

.mdl-color-text--purple-800 {
  color: rgb(106,27,154) !important; }

.mdl-color--purple-800 {
  background-color: rgb(106,27,154) !important; }

.mdl-color-text--purple-900 {
  color: rgb(74,20,140) !important; }

.mdl-color--purple-900 {
  background-color: rgb(74,20,140) !important; }

.mdl-color-text--purple-A100 {
  color: rgb(234,128,252) !important; }

.mdl-color--purple-A100 {
  background-color: rgb(234,128,252) !important; }

.mdl-color-text--purple-A200 {
  color: rgb(224,64,251) !important; }

.mdl-color--purple-A200 {
  background-color: rgb(224,64,251) !important; }

.mdl-color-text--purple-A400 {
  color: rgb(213,0,249) !important; }

.mdl-color--purple-A400 {
  background-color: rgb(213,0,249) !important; }

.mdl-color-text--purple-A700 {
  color: rgb(170,0,255) !important; }

.mdl-color--purple-A700 {
  background-color: rgb(170,0,255) !important; }

.mdl-color-text--deep-purple {
  color: rgb(103,58,183) !important; }

.mdl-color--deep-purple {
  background-color: rgb(103,58,183) !important; }

.mdl-color-text--deep-purple-50 {
  color: rgb(237,231,246) !important; }

.mdl-color--deep-purple-50 {
  background-color: rgb(237,231,246) !important; }

.mdl-color-text--deep-purple-100 {
  color: rgb(209,196,233) !important; }

.mdl-color--deep-purple-100 {
  background-color: rgb(209,196,233) !important; }

.mdl-color-text--deep-purple-200 {
  color: rgb(179,157,219) !important; }

.mdl-color--deep-purple-200 {
  background-color: rgb(179,157,219) !important; }

.mdl-color-text--deep-purple-300 {
  color: rgb(149,117,205) !important; }

.mdl-color--deep-purple-300 {
  background-color: rgb(149,117,205) !important; }

.mdl-color-text--deep-purple-400 {
  color: rgb(126,87,194) !important; }

.mdl-color--deep-purple-400 {
  background-color: rgb(126,87,194) !important; }

.mdl-color-text--deep-purple-500 {
  color: rgb(103,58,183) !important; }

.mdl-color--deep-purple-500 {
  background-color: rgb(103,58,183) !important; }

.mdl-color-text--deep-purple-600 {
  color: rgb(94,53,177) !important; }

.mdl-color--deep-purple-600 {
  background-color: rgb(94,53,177) !important; }

.mdl-color-text--deep-purple-700 {
  color: rgb(81,45,168) !important; }

.mdl-color--deep-purple-700 {
  background-color: rgb(81,45,168) !important; }

.mdl-color-text--deep-purple-800 {
  color: rgb(69,39,160) !important; }

.mdl-color--deep-purple-800 {
  background-color: rgb(69,39,160) !important; }

.mdl-color-text--deep-purple-900 {
  color: rgb(49,27,146) !important; }

.mdl-color--deep-purple-900 {
  background-color: rgb(49,27,146) !important; }

.mdl-color-text--deep-purple-A100 {
  color: rgb(179,136,255) !important; }

.mdl-color--deep-purple-A100 {
  background-color: rgb(179,136,255) !important; }

.mdl-color-text--deep-purple-A200 {
  color: rgb(124,77,255) !important; }

.mdl-color--deep-purple-A200 {
  background-color: rgb(124,77,255) !important; }

.mdl-color-text--deep-purple-A400 {
  color: rgb(101,31,255) !important; }

.mdl-color--deep-purple-A400 {
  background-color: rgb(101,31,255) !important; }

.mdl-color-text--deep-purple-A700 {
  color: rgb(98,0,234) !important; }

.mdl-color--deep-purple-A700 {
  background-color: rgb(98,0,234) !important; }

.mdl-color-text--indigo {
  color: rgb(63,81,181) !important; }

.mdl-color--indigo {
  background-color: rgb(63,81,181) !important; }

.mdl-color-text--indigo-50 {
  color: rgb(232,234,246) !important; }

.mdl-color--indigo-50 {
  background-color: rgb(232,234,246) !important; }

.mdl-color-text--indigo-100 {
  color: rgb(197,202,233) !important; }

.mdl-color--indigo-100 {
  background-color: rgb(197,202,233) !important; }

.mdl-color-text--indigo-200 {
  color: rgb(159,168,218) !important; }

.mdl-color--indigo-200 {
  background-color: rgb(159,168,218) !important; }

.mdl-color-text--indigo-300 {
  color: rgb(121,134,203) !important; }

.mdl-color--indigo-300 {
  background-color: rgb(121,134,203) !important; }

.mdl-color-text--indigo-400 {
  color: rgb(92,107,192) !important; }

.mdl-color--indigo-400 {
  background-color: rgb(92,107,192) !important; }

.mdl-color-text--indigo-500 {
  color: rgb(63,81,181) !important; }

.mdl-color--indigo-500 {
  background-color: rgb(63,81,181) !important; }

.mdl-color-text--indigo-600 {
  color: rgb(57,73,171) !important; }

.mdl-color--indigo-600 {
  background-color: rgb(57,73,171) !important; }

.mdl-color-text--indigo-700 {
  color: rgb(48,63,159) !important; }

.mdl-color--indigo-700 {
  background-color: rgb(48,63,159) !important; }

.mdl-color-text--indigo-800 {
  color: rgb(40,53,147) !important; }

.mdl-color--indigo-800 {
  background-color: rgb(40,53,147) !important; }

.mdl-color-text--indigo-900 {
  color: rgb(26,35,126) !important; }

.mdl-color--indigo-900 {
  background-color: rgb(26,35,126) !important; }

.mdl-color-text--indigo-A100 {
  color: rgb(140,158,255) !important; }

.mdl-color--indigo-A100 {
  background-color: rgb(140,158,255) !important; }

.mdl-color-text--indigo-A200 {
  color: rgb(83,109,254) !important; }

.mdl-color--indigo-A200 {
  background-color: rgb(83,109,254) !important; }

.mdl-color-text--indigo-A400 {
  color: rgb(61,90,254) !important; }

.mdl-color--indigo-A400 {
  background-color: rgb(61,90,254) !important; }

.mdl-color-text--indigo-A700 {
  color: rgb(48,79,254) !important; }

.mdl-color--indigo-A700 {
  background-color: rgb(48,79,254) !important; }

.mdl-color-text--blue {
  color: rgb(33,150,243) !important; }

.mdl-color--blue {
  background-color: rgb(33,150,243) !important; }

.mdl-color-text--blue-50 {
  color: rgb(227,242,253) !important; }

.mdl-color--blue-50 {
  background-color: rgb(227,242,253) !important; }

.mdl-color-text--blue-100 {
  color: rgb(187,222,251) !important; }

.mdl-color--blue-100 {
  background-color: rgb(187,222,251) !important; }

.mdl-color-text--blue-200 {
  color: rgb(144,202,249) !important; }

.mdl-color--blue-200 {
  background-color: rgb(144,202,249) !important; }

.mdl-color-text--blue-300 {
  color: rgb(100,181,246) !important; }

.mdl-color--blue-300 {
  background-color: rgb(100,181,246) !important; }

.mdl-color-text--blue-400 {
  color: rgb(66,165,245) !important; }

.mdl-color--blue-400 {
  background-color: rgb(66,165,245) !important; }

.mdl-color-text--blue-500 {
  color: rgb(33,150,243) !important; }

.mdl-color--blue-500 {
  background-color: rgb(33,150,243) !important; }

.mdl-color-text--blue-600 {
  color: rgb(30,136,229) !important; }

.mdl-color--blue-600 {
  background-color: rgb(30,136,229) !important; }

.mdl-color-text--blue-700 {
  color: rgb(25,118,210) !important; }

.mdl-color--blue-700 {
  background-color: rgb(25,118,210) !important; }

.mdl-color-text--blue-800 {
  color: rgb(21,101,192) !important; }

.mdl-color--blue-800 {
  background-color: rgb(21,101,192) !important; }

.mdl-color-text--blue-900 {
  color: rgb(13,71,161) !important; }

.mdl-color--blue-900 {
  background-color: rgb(13,71,161) !important; }

.mdl-color-text--blue-A100 {
  color: rgb(130,177,255) !important; }

.mdl-color--blue-A100 {
  background-color: rgb(130,177,255) !important; }

.mdl-color-text--blue-A200 {
  color: rgb(68,138,255) !important; }

.mdl-color--blue-A200 {
  background-color: rgb(68,138,255) !important; }

.mdl-color-text--blue-A400 {
  color: rgb(41,121,255) !important; }

.mdl-color--blue-A400 {
  background-color: rgb(41,121,255) !important; }

.mdl-color-text--blue-A700 {
  color: rgb(41,98,255) !important; }

.mdl-color--blue-A700 {
  background-color: rgb(41,98,255) !important; }

.mdl-color-text--light-blue {
  color: rgb(3,169,244) !important; }

.mdl-color--light-blue {
  background-color: rgb(3,169,244) !important; }

.mdl-color-text--light-blue-50 {
  color: rgb(225,245,254) !important; }

.mdl-color--light-blue-50 {
  background-color: rgb(225,245,254) !important; }

.mdl-color-text--light-blue-100 {
  color: rgb(179,229,252) !important; }

.mdl-color--light-blue-100 {
  background-color: rgb(179,229,252) !important; }

.mdl-color-text--light-blue-200 {
  color: rgb(129,212,250) !important; }

.mdl-color--light-blue-200 {
  background-color: rgb(129,212,250) !important; }

.mdl-color-text--light-blue-300 {
  color: rgb(79,195,247) !important; }

.mdl-color--light-blue-300 {
  background-color: rgb(79,195,247) !important; }

.mdl-color-text--light-blue-400 {
  color: rgb(41,182,246) !important; }

.mdl-color--light-blue-400 {
  background-color: rgb(41,182,246) !important; }

.mdl-color-text--light-blue-500 {
  color: rgb(3,169,244) !important; }

.mdl-color--light-blue-500 {
  background-color: rgb(3,169,244) !important; }

.mdl-color-text--light-blue-600 {
  color: rgb(3,155,229) !important; }

.mdl-color--light-blue-600 {
  background-color: rgb(3,155,229) !important; }

.mdl-color-text--light-blue-700 {
  color: rgb(2,136,209) !important; }

.mdl-color--light-blue-700 {
  background-color: rgb(2,136,209) !important; }

.mdl-color-text--light-blue-800 {
  color: rgb(2,119,189) !important; }

.mdl-color--light-blue-800 {
  background-color: rgb(2,119,189) !important; }

.mdl-color-text--light-blue-900 {
  color: rgb(1,87,155) !important; }

.mdl-color--light-blue-900 {
  background-color: rgb(1,87,155) !important; }

.mdl-color-text--light-blue-A100 {
  color: rgb(128,216,255) !important; }

.mdl-color--light-blue-A100 {
  background-color: rgb(128,216,255) !important; }

.mdl-color-text--light-blue-A200 {
  color: rgb(64,196,255) !important; }

.mdl-color--light-blue-A200 {
  background-color: rgb(64,196,255) !important; }

.mdl-color-text--light-blue-A400 {
  color: rgb(0,176,255) !important; }

.mdl-color--light-blue-A400 {
  background-color: rgb(0,176,255) !important; }

.mdl-color-text--light-blue-A700 {
  color: rgb(0,145,234) !important; }

.mdl-color--light-blue-A700 {
  background-color: rgb(0,145,234) !important; }

.mdl-color-text--cyan {
  color: rgb(0,188,212) !important; }

.mdl-color--cyan {
  background-color: rgb(0,188,212) !important; }

.mdl-color-text--cyan-50 {
  color: rgb(224,247,250) !important; }

.mdl-color--cyan-50 {
  background-color: rgb(224,247,250) !important; }

.mdl-color-text--cyan-100 {
  color: rgb(178,235,242) !important; }

.mdl-color--cyan-100 {
  background-color: rgb(178,235,242) !important; }

.mdl-color-text--cyan-200 {
  color: rgb(128,222,234) !important; }

.mdl-color--cyan-200 {
  background-color: rgb(128,222,234) !important; }

.mdl-color-text--cyan-300 {
  color: rgb(77,208,225) !important; }

.mdl-color--cyan-300 {
  background-color: rgb(77,208,225) !important; }

.mdl-color-text--cyan-400 {
  color: rgb(38,198,218) !important; }

.mdl-color--cyan-400 {
  background-color: rgb(38,198,218) !important; }

.mdl-color-text--cyan-500 {
  color: rgb(0,188,212) !important; }

.mdl-color--cyan-500 {
  background-color: rgb(0,188,212) !important; }

.mdl-color-text--cyan-600 {
  color: rgb(0,172,193) !important; }

.mdl-color--cyan-600 {
  background-color: rgb(0,172,193) !important; }

.mdl-color-text--cyan-700 {
  color: rgb(0,151,167) !important; }

.mdl-color--cyan-700 {
  background-color: rgb(0,151,167) !important; }

.mdl-color-text--cyan-800 {
  color: rgb(0,131,143) !important; }

.mdl-color--cyan-800 {
  background-color: rgb(0,131,143) !important; }

.mdl-color-text--cyan-900 {
  color: rgb(0,96,100) !important; }

.mdl-color--cyan-900 {
  background-color: rgb(0,96,100) !important; }

.mdl-color-text--cyan-A100 {
  color: rgb(132,255,255) !important; }

.mdl-color--cyan-A100 {
  background-color: rgb(132,255,255) !important; }

.mdl-color-text--cyan-A200 {
  color: rgb(24,255,255) !important; }

.mdl-color--cyan-A200 {
  background-color: rgb(24,255,255) !important; }

.mdl-color-text--cyan-A400 {
  color: rgb(0,229,255) !important; }

.mdl-color--cyan-A400 {
  background-color: rgb(0,229,255) !important; }

.mdl-color-text--cyan-A700 {
  color: rgb(0,184,212) !important; }

.mdl-color--cyan-A700 {
  background-color: rgb(0,184,212) !important; }

.mdl-color-text--teal {
  color: rgb(0,150,136) !important; }

.mdl-color--teal {
  background-color: rgb(0,150,136) !important; }

.mdl-color-text--teal-50 {
  color: rgb(224,242,241) !important; }

.mdl-color--teal-50 {
  background-color: rgb(224,242,241) !important; }

.mdl-color-text--teal-100 {
  color: rgb(178,223,219) !important; }

.mdl-color--teal-100 {
  background-color: rgb(178,223,219) !important; }

.mdl-color-text--teal-200 {
  color: rgb(128,203,196) !important; }

.mdl-color--teal-200 {
  background-color: rgb(128,203,196) !important; }

.mdl-color-text--teal-300 {
  color: rgb(77,182,172) !important; }

.mdl-color--teal-300 {
  background-color: rgb(77,182,172) !important; }

.mdl-color-text--teal-400 {
  color: rgb(38,166,154) !important; }

.mdl-color--teal-400 {
  background-color: rgb(38,166,154) !important; }

.mdl-color-text--teal-500 {
  color: rgb(0,150,136) !important; }

.mdl-color--teal-500 {
  background-color: rgb(0,150,136) !important; }

.mdl-color-text--teal-600 {
  color: rgb(0,137,123) !important; }

.mdl-color--teal-600 {
  background-color: rgb(0,137,123) !important; }

.mdl-color-text--teal-700 {
  color: rgb(0,121,107) !important; }

.mdl-color--teal-700 {
  background-color: rgb(0,121,107) !important; }

.mdl-color-text--teal-800 {
  color: rgb(0,105,92) !important; }

.mdl-color--teal-800 {
  background-color: rgb(0,105,92) !important; }

.mdl-color-text--teal-900 {
  color: rgb(0,77,64) !important; }

.mdl-color--teal-900 {
  background-color: rgb(0,77,64) !important; }

.mdl-color-text--teal-A100 {
  color: rgb(167,255,235) !important; }

.mdl-color--teal-A100 {
  background-color: rgb(167,255,235) !important; }

.mdl-color-text--teal-A200 {
  color: rgb(100,255,218) !important; }

.mdl-color--teal-A200 {
  background-color: rgb(100,255,218) !important; }

.mdl-color-text--teal-A400 {
  color: rgb(29,233,182) !important; }

.mdl-color--teal-A400 {
  background-color: rgb(29,233,182) !important; }

.mdl-color-text--teal-A700 {
  color: rgb(0,191,165) !important; }

.mdl-color--teal-A700 {
  background-color: rgb(0,191,165) !important; }

.mdl-color-text--green {
  color: rgb(76,175,80) !important; }

.mdl-color--green {
  background-color: rgb(76,175,80) !important; }

.mdl-color-text--green-50 {
  color: rgb(232,245,233) !important; }

.mdl-color--green-50 {
  background-color: rgb(232,245,233) !important; }

.mdl-color-text--green-100 {
  color: rgb(200,230,201) !important; }

.mdl-color--green-100 {
  background-color: rgb(200,230,201) !important; }

.mdl-color-text--green-200 {
  color: rgb(165,214,167) !important; }

.mdl-color--green-200 {
  background-color: rgb(165,214,167) !important; }

.mdl-color-text--green-300 {
  color: rgb(129,199,132) !important; }

.mdl-color--green-300 {
  background-color: rgb(129,199,132) !important; }

.mdl-color-text--green-400 {
  color: rgb(102,187,106) !important; }

.mdl-color--green-400 {
  background-color: rgb(102,187,106) !important; }

.mdl-color-text--green-500 {
  color: rgb(76,175,80) !important; }

.mdl-color--green-500 {
  background-color: rgb(76,175,80) !important; }

.mdl-color-text--green-600 {
  color: rgb(67,160,71) !important; }

.mdl-color--green-600 {
  background-color: rgb(67,160,71) !important; }

.mdl-color-text--green-700 {
  color: rgb(56,142,60) !important; }

.mdl-color--green-700 {
  background-color: rgb(56,142,60) !important; }

.mdl-color-text--green-800 {
  color: rgb(46,125,50) !important; }

.mdl-color--green-800 {
  background-color: rgb(46,125,50) !important; }

.mdl-color-text--green-900 {
  color: rgb(27,94,32) !important; }

.mdl-color--green-900 {
  background-color: rgb(27,94,32) !important; }

.mdl-color-text--green-A100 {
  color: rgb(185,246,202) !important; }

.mdl-color--green-A100 {
  background-color: rgb(185,246,202) !important; }

.mdl-color-text--green-A200 {
  color: rgb(105,240,174) !important; }

.mdl-color--green-A200 {
  background-color: rgb(105,240,174) !important; }

.mdl-color-text--green-A400 {
  color: rgb(0,230,118) !important; }

.mdl-color--green-A400 {
  background-color: rgb(0,230,118) !important; }

.mdl-color-text--green-A700 {
  color: rgb(0,200,83) !important; }

.mdl-color--green-A700 {
  background-color: rgb(0,200,83) !important; }

.mdl-color-text--light-green {
  color: rgb(139,195,74) !important; }

.mdl-color--light-green {
  background-color: rgb(139,195,74) !important; }

.mdl-color-text--light-green-50 {
  color: rgb(241,248,233) !important; }

.mdl-color--light-green-50 {
  background-color: rgb(241,248,233) !important; }

.mdl-color-text--light-green-100 {
  color: rgb(220,237,200) !important; }

.mdl-color--light-green-100 {
  background-color: rgb(220,237,200) !important; }

.mdl-color-text--light-green-200 {
  color: rgb(197,225,165) !important; }

.mdl-color--light-green-200 {
  background-color: rgb(197,225,165) !important; }

.mdl-color-text--light-green-300 {
  color: rgb(174,213,129) !important; }

.mdl-color--light-green-300 {
  background-color: rgb(174,213,129) !important; }

.mdl-color-text--light-green-400 {
  color: rgb(156,204,101) !important; }

.mdl-color--light-green-400 {
  background-color: rgb(156,204,101) !important; }

.mdl-color-text--light-green-500 {
  color: rgb(139,195,74) !important; }

.mdl-color--light-green-500 {
  background-color: rgb(139,195,74) !important; }

.mdl-color-text--light-green-600 {
  color: rgb(124,179,66) !important; }

.mdl-color--light-green-600 {
  background-color: rgb(124,179,66) !important; }

.mdl-color-text--light-green-700 {
  color: rgb(104,159,56) !important; }

.mdl-color--light-green-700 {
  background-color: rgb(104,159,56) !important; }

.mdl-color-text--light-green-800 {
  color: rgb(85,139,47) !important; }

.mdl-color--light-green-800 {
  background-color: rgb(85,139,47) !important; }

.mdl-color-text--light-green-900 {
  color: rgb(51,105,30) !important; }

.mdl-color--light-green-900 {
  background-color: rgb(51,105,30) !important; }

.mdl-color-text--light-green-A100 {
  color: rgb(204,255,144) !important; }

.mdl-color--light-green-A100 {
  background-color: rgb(204,255,144) !important; }

.mdl-color-text--light-green-A200 {
  color: rgb(178,255,89) !important; }

.mdl-color--light-green-A200 {
  background-color: rgb(178,255,89) !important; }

.mdl-color-text--light-green-A400 {
  color: rgb(118,255,3) !important; }

.mdl-color--light-green-A400 {
  background-color: rgb(118,255,3) !important; }

.mdl-color-text--light-green-A700 {
  color: rgb(100,221,23) !important; }

.mdl-color--light-green-A700 {
  background-color: rgb(100,221,23) !important; }

.mdl-color-text--lime {
  color: rgb(205,220,57) !important; }

.mdl-color--lime {
  background-color: rgb(205,220,57) !important; }

.mdl-color-text--lime-50 {
  color: rgb(249,251,231) !important; }

.mdl-color--lime-50 {
  background-color: rgb(249,251,231) !important; }

.mdl-color-text--lime-100 {
  color: rgb(240,244,195) !important; }

.mdl-color--lime-100 {
  background-color: rgb(240,244,195) !important; }

.mdl-color-text--lime-200 {
  color: rgb(230,238,156) !important; }

.mdl-color--lime-200 {
  background-color: rgb(230,238,156) !important; }

.mdl-color-text--lime-300 {
  color: rgb(220,231,117) !important; }

.mdl-color--lime-300 {
  background-color: rgb(220,231,117) !important; }

.mdl-color-text--lime-400 {
  color: rgb(212,225,87) !important; }

.mdl-color--lime-400 {
  background-color: rgb(212,225,87) !important; }

.mdl-color-text--lime-500 {
  color: rgb(205,220,57) !important; }

.mdl-color--lime-500 {
  background-color: rgb(205,220,57) !important; }

.mdl-color-text--lime-600 {
  color: rgb(192,202,51) !important; }

.mdl-color--lime-600 {
  background-color: rgb(192,202,51) !important; }

.mdl-color-text--lime-700 {
  color: rgb(175,180,43) !important; }

.mdl-color--lime-700 {
  background-color: rgb(175,180,43) !important; }

.mdl-color-text--lime-800 {
  color: rgb(158,157,36) !important; }

.mdl-color--lime-800 {
  background-color: rgb(158,157,36) !important; }

.mdl-color-text--lime-900 {
  color: rgb(130,119,23) !important; }

.mdl-color--lime-900 {
  background-color: rgb(130,119,23) !important; }

.mdl-color-text--lime-A100 {
  color: rgb(244,255,129) !important; }

.mdl-color--lime-A100 {
  background-color: rgb(244,255,129) !important; }

.mdl-color-text--lime-A200 {
  color: rgb(238,255,65) !important; }

.mdl-color--lime-A200 {
  background-color: rgb(238,255,65) !important; }

.mdl-color-text--lime-A400 {
  color: rgb(198,255,0) !important; }

.mdl-color--lime-A400 {
  background-color: rgb(198,255,0) !important; }

.mdl-color-text--lime-A700 {
  color: rgb(174,234,0) !important; }

.mdl-color--lime-A700 {
  background-color: rgb(174,234,0) !important; }

.mdl-color-text--yellow {
  color: rgb(255,235,59) !important; }

.mdl-color--yellow {
  background-color: rgb(255,235,59) !important; }

.mdl-color-text--yellow-50 {
  color: rgb(255,253,231) !important; }

.mdl-color--yellow-50 {
  background-color: rgb(255,253,231) !important; }

.mdl-color-text--yellow-100 {
  color: rgb(255,249,196) !important; }

.mdl-color--yellow-100 {
  background-color: rgb(255,249,196) !important; }

.mdl-color-text--yellow-200 {
  color: rgb(255,245,157) !important; }

.mdl-color--yellow-200 {
  background-color: rgb(255,245,157) !important; }

.mdl-color-text--yellow-300 {
  color: rgb(255,241,118) !important; }

.mdl-color--yellow-300 {
  background-color: rgb(255,241,118) !important; }

.mdl-color-text--yellow-400 {
  color: rgb(255,238,88) !important; }

.mdl-color--yellow-400 {
  background-color: rgb(255,238,88) !important; }

.mdl-color-text--yellow-500 {
  color: rgb(255,235,59) !important; }

.mdl-color--yellow-500 {
  background-color: rgb(255,235,59) !important; }

.mdl-color-text--yellow-600 {
  color: rgb(253,216,53) !important; }

.mdl-color--yellow-600 {
  background-color: rgb(253,216,53) !important; }

.mdl-color-text--yellow-700 {
  color: rgb(251,192,45) !important; }

.mdl-color--yellow-700 {
  background-color: rgb(251,192,45) !important; }

.mdl-color-text--yellow-800 {
  color: rgb(249,168,37) !important; }

.mdl-color--yellow-800 {
  background-color: rgb(249,168,37) !important; }

.mdl-color-text--yellow-900 {
  color: rgb(245,127,23) !important; }

.mdl-color--yellow-900 {
  background-color: rgb(245,127,23) !important; }

.mdl-color-text--yellow-A100 {
  color: rgb(255,255,141) !important; }

.mdl-color--yellow-A100 {
  background-color: rgb(255,255,141) !important; }

.mdl-color-text--yellow-A200 {
  color: rgb(255,255,0) !important; }

.mdl-color--yellow-A200 {
  background-color: rgb(255,255,0) !important; }

.mdl-color-text--yellow-A400 {
  color: rgb(255,234,0) !important; }

.mdl-color--yellow-A400 {
  background-color: rgb(255,234,0) !important; }

.mdl-color-text--yellow-A700 {
  color: rgb(255,214,0) !important; }

.mdl-color--yellow-A700 {
  background-color: rgb(255,214,0) !important; }

.mdl-color-text--amber {
  color: rgb(255,193,7) !important; }

.mdl-color--amber {
  background-color: rgb(255,193,7) !important; }

.mdl-color-text--amber-50 {
  color: rgb(255,248,225) !important; }

.mdl-color--amber-50 {
  background-color: rgb(255,248,225) !important; }

.mdl-color-text--amber-100 {
  color: rgb(255,236,179) !important; }

.mdl-color--amber-100 {
  background-color: rgb(255,236,179) !important; }

.mdl-color-text--amber-200 {
  color: rgb(255,224,130) !important; }

.mdl-color--amber-200 {
  background-color: rgb(255,224,130) !important; }

.mdl-color-text--amber-300 {
  color: rgb(255,213,79) !important; }

.mdl-color--amber-300 {
  background-color: rgb(255,213,79) !important; }

.mdl-color-text--amber-400 {
  color: rgb(255,202,40) !important; }

.mdl-color--amber-400 {
  background-color: rgb(255,202,40) !important; }

.mdl-color-text--amber-500 {
  color: rgb(255,193,7) !important; }

.mdl-color--amber-500 {
  background-color: rgb(255,193,7) !important; }

.mdl-color-text--amber-600 {
  color: rgb(255,179,0) !important; }

.mdl-color--amber-600 {
  background-color: rgb(255,179,0) !important; }

.mdl-color-text--amber-700 {
  color: rgb(255,160,0) !important; }

.mdl-color--amber-700 {
  background-color: rgb(255,160,0) !important; }

.mdl-color-text--amber-800 {
  color: rgb(255,143,0) !important; }

.mdl-color--amber-800 {
  background-color: rgb(255,143,0) !important; }

.mdl-color-text--amber-900 {
  color: rgb(255,111,0) !important; }

.mdl-color--amber-900 {
  background-color: rgb(255,111,0) !important; }

.mdl-color-text--amber-A100 {
  color: rgb(255,229,127) !important; }

.mdl-color--amber-A100 {
  background-color: rgb(255,229,127) !important; }

.mdl-color-text--amber-A200 {
  color: rgb(255,215,64) !important; }

.mdl-color--amber-A200 {
  background-color: rgb(255,215,64) !important; }

.mdl-color-text--amber-A400 {
  color: rgb(255,196,0) !important; }

.mdl-color--amber-A400 {
  background-color: rgb(255,196,0) !important; }

.mdl-color-text--amber-A700 {
  color: rgb(255,171,0) !important; }

.mdl-color--amber-A700 {
  background-color: rgb(255,171,0) !important; }

.mdl-color-text--orange {
  color: rgb(255,152,0) !important; }

.mdl-color--orange {
  background-color: rgb(255,152,0) !important; }

.mdl-color-text--orange-50 {
  color: rgb(255,243,224) !important; }

.mdl-color--orange-50 {
  background-color: rgb(255,243,224) !important; }

.mdl-color-text--orange-100 {
  color: rgb(255,224,178) !important; }

.mdl-color--orange-100 {
  background-color: rgb(255,224,178) !important; }

.mdl-color-text--orange-200 {
  color: rgb(255,204,128) !important; }

.mdl-color--orange-200 {
  background-color: rgb(255,204,128) !important; }

.mdl-color-text--orange-300 {
  color: rgb(255,183,77) !important; }

.mdl-color--orange-300 {
  background-color: rgb(255,183,77) !important; }

.mdl-color-text--orange-400 {
  color: rgb(255,167,38) !important; }

.mdl-color--orange-400 {
  background-color: rgb(255,167,38) !important; }

.mdl-color-text--orange-500 {
  color: rgb(255,152,0) !important; }

.mdl-color--orange-500 {
  background-color: rgb(255,152,0) !important; }

.mdl-color-text--orange-600 {
  color: rgb(251,140,0) !important; }

.mdl-color--orange-600 {
  background-color: rgb(251,140,0) !important; }

.mdl-color-text--orange-700 {
  color: rgb(245,124,0) !important; }

.mdl-color--orange-700 {
  background-color: rgb(245,124,0) !important; }

.mdl-color-text--orange-800 {
  color: rgb(239,108,0) !important; }

.mdl-color--orange-800 {
  background-color: rgb(239,108,0) !important; }

.mdl-color-text--orange-900 {
  color: rgb(230,81,0) !important; }

.mdl-color--orange-900 {
  background-color: rgb(230,81,0) !important; }

.mdl-color-text--orange-A100 {
  color: rgb(255,209,128) !important; }

.mdl-color--orange-A100 {
  background-color: rgb(255,209,128) !important; }

.mdl-color-text--orange-A200 {
  color: rgb(255,171,64) !important; }

.mdl-color--orange-A200 {
  background-color: rgb(255,171,64) !important; }

.mdl-color-text--orange-A400 {
  color: rgb(255,145,0) !important; }

.mdl-color--orange-A400 {
  background-color: rgb(255,145,0) !important; }

.mdl-color-text--orange-A700 {
  color: rgb(255,109,0) !important; }

.mdl-color--orange-A700 {
  background-color: rgb(255,109,0) !important; }

.mdl-color-text--deep-orange {
  color: rgb(255,87,34) !important; }

.mdl-color--deep-orange {
  background-color: rgb(255,87,34) !important; }

.mdl-color-text--deep-orange-50 {
  color: rgb(251,233,231) !important; }

.mdl-color--deep-orange-50 {
  background-color: rgb(251,233,231) !important; }

.mdl-color-text--deep-orange-100 {
  color: rgb(255,204,188) !important; }

.mdl-color--deep-orange-100 {
  background-color: rgb(255,204,188) !important; }

.mdl-color-text--deep-orange-200 {
  color: rgb(255,171,145) !important; }

.mdl-color--deep-orange-200 {
  background-color: rgb(255,171,145) !important; }

.mdl-color-text--deep-orange-300 {
  color: rgb(255,138,101) !important; }

.mdl-color--deep-orange-300 {
  background-color: rgb(255,138,101) !important; }

.mdl-color-text--deep-orange-400 {
  color: rgb(255,112,67) !important; }

.mdl-color--deep-orange-400 {
  background-color: rgb(255,112,67) !important; }

.mdl-color-text--deep-orange-500 {
  color: rgb(255,87,34) !important; }

.mdl-color--deep-orange-500 {
  background-color: rgb(255,87,34) !important; }

.mdl-color-text--deep-orange-600 {
  color: rgb(244,81,30) !important; }

.mdl-color--deep-orange-600 {
  background-color: rgb(244,81,30) !important; }

.mdl-color-text--deep-orange-700 {
  color: rgb(230,74,25) !important; }

.mdl-color--deep-orange-700 {
  background-color: rgb(230,74,25) !important; }

.mdl-color-text--deep-orange-800 {
  color: rgb(216,67,21) !important; }

.mdl-color--deep-orange-800 {
  background-color: rgb(216,67,21) !important; }

.mdl-color-text--deep-orange-900 {
  color: rgb(191,54,12) !important; }

.mdl-color--deep-orange-900 {
  background-color: rgb(191,54,12) !important; }

.mdl-color-text--deep-orange-A100 {
  color: rgb(255,158,128) !important; }

.mdl-color--deep-orange-A100 {
  background-color: rgb(255,158,128) !important; }

.mdl-color-text--deep-orange-A200 {
  color: rgb(255,110,64) !important; }

.mdl-color--deep-orange-A200 {
  background-color: rgb(255,110,64) !important; }

.mdl-color-text--deep-orange-A400 {
  color: rgb(255,61,0) !important; }

.mdl-color--deep-orange-A400 {
  background-color: rgb(255,61,0) !important; }

.mdl-color-text--deep-orange-A700 {
  color: rgb(221,44,0) !important; }

.mdl-color--deep-orange-A700 {
  background-color: rgb(221,44,0) !important; }

.mdl-color-text--brown {
  color: rgb(121,85,72) !important; }

.mdl-color--brown {
  background-color: rgb(121,85,72) !important; }

.mdl-color-text--brown-50 {
  color: rgb(239,235,233) !important; }

.mdl-color--brown-50 {
  background-color: rgb(239,235,233) !important; }

.mdl-color-text--brown-100 {
  color: rgb(215,204,200) !important; }

.mdl-color--brown-100 {
  background-color: rgb(215,204,200) !important; }

.mdl-color-text--brown-200 {
  color: rgb(188,170,164) !important; }

.mdl-color--brown-200 {
  background-color: rgb(188,170,164) !important; }

.mdl-color-text--brown-300 {
  color: rgb(161,136,127) !important; }

.mdl-color--brown-300 {
  background-color: rgb(161,136,127) !important; }

.mdl-color-text--brown-400 {
  color: rgb(141,110,99) !important; }

.mdl-color--brown-400 {
  background-color: rgb(141,110,99) !important; }

.mdl-color-text--brown-500 {
  color: rgb(121,85,72) !important; }

.mdl-color--brown-500 {
  background-color: rgb(121,85,72) !important; }

.mdl-color-text--brown-600 {
  color: rgb(109,76,65) !important; }

.mdl-color--brown-600 {
  background-color: rgb(109,76,65) !important; }

.mdl-color-text--brown-700 {
  color: rgb(93,64,55) !important; }

.mdl-color--brown-700 {
  background-color: rgb(93,64,55) !important; }

.mdl-color-text--brown-800 {
  color: rgb(78,52,46) !important; }

.mdl-color--brown-800 {
  background-color: rgb(78,52,46) !important; }

.mdl-color-text--brown-900 {
  color: rgb(62,39,35) !important; }

.mdl-color--brown-900 {
  background-color: rgb(62,39,35) !important; }

.mdl-color-text--grey {
  color: rgb(158,158,158) !important; }

.mdl-color--grey {
  background-color: rgb(158,158,158) !important; }

.mdl-color-text--grey-50 {
  color: rgb(250,250,250) !important; }

.mdl-color--grey-50 {
  background-color: rgb(250,250,250) !important; }

.mdl-color-text--grey-100 {
  color: rgb(245,245,245) !important; }

.mdl-color--grey-100 {
  background-color: rgb(245,245,245) !important; }

.mdl-color-text--grey-200 {
  color: rgb(238,238,238) !important; }

.mdl-color--grey-200 {
  background-color: rgb(238,238,238) !important; }

.mdl-color-text--grey-300 {
  color: rgb(224,224,224) !important; }

.mdl-color--grey-300 {
  background-color: rgb(224,224,224) !important; }

.mdl-color-text--grey-400 {
  color: rgb(189,189,189) !important; }

.mdl-color--grey-400 {
  background-color: rgb(189,189,189) !important; }

.mdl-color-text--grey-500 {
  color: rgb(158,158,158) !important; }

.mdl-color--grey-500 {
  background-color: rgb(158,158,158) !important; }

.mdl-color-text--grey-600 {
  color: rgb(117,117,117) !important; }

.mdl-color--grey-600 {
  background-color: rgb(117,117,117) !important; }

.mdl-color-text--grey-700 {
  color: rgb(97,97,97) !important; }

.mdl-color--grey-700 {
  background-color: rgb(97,97,97) !important; }

.mdl-color-text--grey-800 {
  color: rgb(66,66,66) !important; }

.mdl-color--grey-800 {
  background-color: rgb(66,66,66) !important; }

.mdl-color-text--grey-900 {
  color: rgb(33,33,33) !important; }

.mdl-color--grey-900 {
  background-color: rgb(33,33,33) !important; }

.mdl-color-text--blue-grey {
  color: rgb(96,125,139) !important; }

.mdl-color--blue-grey {
  background-color: rgb(96,125,139) !important; }

.mdl-color-text--blue-grey-50 {
  color: rgb(236,239,241) !important; }

.mdl-color--blue-grey-50 {
  background-color: rgb(236,239,241) !important; }

.mdl-color-text--blue-grey-100 {
  color: rgb(207,216,220) !important; }

.mdl-color--blue-grey-100 {
  background-color: rgb(207,216,220) !important; }

.mdl-color-text--blue-grey-200 {
  color: rgb(176,190,197) !important; }

.mdl-color--blue-grey-200 {
  background-color: rgb(176,190,197) !important; }

.mdl-color-text--blue-grey-300 {
  color: rgb(144,164,174) !important; }

.mdl-color--blue-grey-300 {
  background-color: rgb(144,164,174) !important; }

.mdl-color-text--blue-grey-400 {
  color: rgb(120,144,156) !important; }

.mdl-color--blue-grey-400 {
  background-color: rgb(120,144,156) !important; }

.mdl-color-text--blue-grey-500 {
  color: rgb(96,125,139) !important; }

.mdl-color--blue-grey-500 {
  background-color: rgb(96,125,139) !important; }

.mdl-color-text--blue-grey-600 {
  color: rgb(84,110,122) !important; }

.mdl-color--blue-grey-600 {
  background-color: rgb(84,110,122) !important; }

.mdl-color-text--blue-grey-700 {
  color: rgb(69,90,100) !important; }

.mdl-color--blue-grey-700 {
  background-color: rgb(69,90,100) !important; }

.mdl-color-text--blue-grey-800 {
  color: rgb(55,71,79) !important; }

.mdl-color--blue-grey-800 {
  background-color: rgb(55,71,79) !important; }

.mdl-color-text--blue-grey-900 {
  color: rgb(38,50,56) !important; }

.mdl-color--blue-grey-900 {
  background-color: rgb(38,50,56) !important; }

.mdl-color--black {
  background-color: rgb(0,0,0) !important; }

.mdl-color-text--black {
  color: rgb(0,0,0) !important; }

.mdl-color--white {
  background-color: rgb(255,255,255) !important; }

.mdl-color-text--white {
  color: rgb(255,255,255) !important; }

.mdl-color--primary {
  background-color: rgb($color-primary) !important; }

.mdl-color--primary-contrast {
  background-color: rgb($color-primary-contrast) !important; }

.mdl-color--primary-dark {
  background-color: rgb($color-primary-dark) !important; }

.mdl-color--accent {
  background-color: rgb($color-accent) !important; }

.mdl-color--accent-contrast {
  background-color: rgb($color-accent-contrast) !important; }

.mdl-color-text--primary {
  color: rgb($color-primary) !important; }

.mdl-color-text--primary-contrast {
  color: rgb($color-primary-contrast) !important; }

.mdl-color-text--primary-dark {
  color: rgb($color-primary-dark) !important; }

.mdl-color-text--accent {
  color: rgb($color-accent) !important; }

.mdl-color-text--accent-contrast {
  color: rgb($color-accent-contrast) !important; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-ripple {
  background: rgb(0,0,0);
  border-radius: 50%;
  height: 50px;
  left: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  transform: translate(-50%, -50%);
  width: 50px;
  overflow: hidden; }
  .mdl-ripple.is-animating {
    transition: transform 0.3s cubic-bezier(0, 0, 0.2, 1), width 0.3s cubic-bezier(0, 0, 0.2, 1), height 0.3s cubic-bezier(0, 0, 0.2, 1), opacity 0.6s cubic-bezier(0, 0, 0.2, 1); }
  .mdl-ripple.is-visible {
    opacity: 0.3; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-animation--default {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }

.mdl-animation--fast-out-slow-in {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }

.mdl-animation--linear-out-slow-in {
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1); }

.mdl-animation--fast-out-linear-in {
  transition-timing-function: cubic-bezier(0.4, 0, 1, 1); }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-badge {
  position: relative;
  white-space: nowrap;
  margin-right: 24px; }
  .mdl-badge:not([data-badge]) {
    margin-right: auto; }
  .mdl-badge[data-badge]:after {
    content: attr(data-badge);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    align-items: center;
    position: absolute;
    top: -11px;
    right: -24px;
    font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
    font-weight: 600;
    font-size: 12px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: rgb($color-accent);
    color: rgb($color-accent-contrast); }
    .mdl-button .mdl-badge[data-badge]:after {
      top: -10px;
      right: -5px; }
  .mdl-badge.mdl-badge--no-background[data-badge]:after {
    color: rgb($color-accent);
    background: rgba($color-accent-contrast,0.2);
    box-shadow: 0 0 1px gray; }
  .mdl-badge.mdl-badge--overlap {
    margin-right: 10px; }
    .mdl-badge.mdl-badge--overlap:after {
      right: -10px; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-button {
  background: transparent;
  border: none;
  border-radius: 2px;
  color: rgb(0,0,0);
  position: relative;
  height: 36px;
  margin: 0;
  min-width: 64px;
  padding: 0 16px;
  display: inline-block;
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  line-height: 1;
  letter-spacing: 0;
  overflow: hidden;
  will-change: box-shadow;
  transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  outline: none;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  line-height: 36px;
  vertical-align: middle; }
  .mdl-button::-moz-focus-inner {
    border: 0; }
  .mdl-button:hover {
    background-color: rgba(158,158,158, 0.20); }
  .mdl-button:focus:not(:active) {
    background-color: rgba(0,0,0, 0.12); }
  .mdl-button:active {
    background-color: rgba(158,158,158, 0.40); }
  .mdl-button.mdl-button--colored {
    color: rgb($color-primary); }
    .mdl-button.mdl-button--colored:focus:not(:active) {
      background-color: rgba(0,0,0, 0.12); }

input.mdl-button[type="submit"] {
  -webkit-appearance: none; }

.mdl-button--raised {
  background: rgba(158,158,158, 0.20);
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }
  .mdl-button--raised:active {
    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
    background-color: rgba(158,158,158, 0.40); }
  .mdl-button--raised:focus:not(:active) {
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.36);
    background-color: rgba(158,158,158, 0.40); }
  .mdl-button--raised.mdl-button--colored {
    background: rgb($color-primary);
    color: rgb($color-primary-contrast); }
    .mdl-button--raised.mdl-button--colored:hover {
      background-color: rgb($color-primary); }
    .mdl-button--raised.mdl-button--colored:active {
      background-color: rgb($color-primary); }
    .mdl-button--raised.mdl-button--colored:focus:not(:active) {
      background-color: rgb($color-primary); }
    .mdl-button--raised.mdl-button--colored .mdl-ripple {
      background: rgb($color-primary-contrast); }

.mdl-button--fab {
  border-radius: 50%;
  font-size: 24px;
  height: 56px;
  margin: auto;
  min-width: 56px;
  width: 56px;
  padding: 0;
  overflow: hidden;
  background: rgba(158,158,158, 0.20);
  box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24);
  position: relative;
  line-height: normal; }
  .mdl-button--fab .material-icons {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(- 12px, - 12px);
    line-height: 24px;
    width: 24px; }
  .mdl-button--fab.mdl-button--mini-fab {
    height: 40px;
    min-width: 40px;
    width: 40px; }
  .mdl-button--fab .mdl-button__ripple-container {
    border-radius: 50%;
    -webkit-mask-image: -webkit-radial-gradient(circle, white, black); }
  .mdl-button--fab:active {
    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
    background-color: rgba(158,158,158, 0.40); }
  .mdl-button--fab:focus:not(:active) {
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.36);
    background-color: rgba(158,158,158, 0.40); }
  .mdl-button--fab.mdl-button--colored {
    background: rgb($color-accent);
    color: rgb($color-accent-contrast); }
    .mdl-button--fab.mdl-button--colored:hover {
      background-color: rgb($color-accent); }
    .mdl-button--fab.mdl-button--colored:focus:not(:active) {
      background-color: rgb($color-accent); }
    .mdl-button--fab.mdl-button--colored:active {
      background-color: rgb($color-accent); }
    .mdl-button--fab.mdl-button--colored .mdl-ripple {
      background: rgb($color-accent-contrast); }

.mdl-button--icon {
  border-radius: 50%;
  font-size: 24px;
  height: 32px;
  margin-left: 0;
  margin-right: 0;
  min-width: 32px;
  width: 32px;
  padding: 0;
  overflow: hidden;
  color: inherit;
  line-height: normal; }
  .mdl-button--icon .material-icons {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(- 12px, - 12px);
    line-height: 24px;
    width: 24px; }
  .mdl-button--icon.mdl-button--mini-icon {
    height: 24px;
    min-width: 24px;
    width: 24px; }
    .mdl-button--icon.mdl-button--mini-icon .material-icons {
      top: 0px;
      left: 0px; }
  .mdl-button--icon .mdl-button__ripple-container {
    border-radius: 50%;
    -webkit-mask-image: -webkit-radial-gradient(circle, white, black); }

.mdl-button__ripple-container {
  display: block;
  height: 100%;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100%;
  z-index: 0;
  overflow: hidden; }
  .mdl-button[disabled] .mdl-button__ripple-container .mdl-ripple, .mdl-button.mdl-button--disabled .mdl-button__ripple-container .mdl-ripple {
    background-color: transparent; }

.mdl-button--primary.mdl-button--primary {
  color: rgb($color-primary); }
  .mdl-button--primary.mdl-button--primary .mdl-ripple {
    background: rgb($color-primary-contrast); }
  .mdl-button--primary.mdl-button--primary.mdl-button--raised, .mdl-button--primary.mdl-button--primary.mdl-button--fab {
    color: rgb($color-primary-contrast);
    background-color: rgb($color-primary); }

.mdl-button--accent.mdl-button--accent {
  color: rgb($color-accent); }
  .mdl-button--accent.mdl-button--accent .mdl-ripple {
    background: rgb($color-accent-contrast); }
  .mdl-button--accent.mdl-button--accent.mdl-button--raised, .mdl-button--accent.mdl-button--accent.mdl-button--fab {
    color: rgb($color-accent-contrast);
    background-color: rgb($color-accent); }

.mdl-button[disabled][disabled], .mdl-button.mdl-button--disabled.mdl-button--disabled {
  color: rgba(0,0,0, 0.26);
  cursor: default;
  background-color: transparent; }
  .mdl-button--fab[disabled][disabled], .mdl-button--fab.mdl-button--disabled.mdl-button--disabled {
    background-color: rgba(0,0,0, 0.12);
    color: rgba(0,0,0, 0.26); }
  .mdl-button--raised[disabled][disabled], .mdl-button--raised.mdl-button--disabled.mdl-button--disabled {
    background-color: rgba(0,0,0, 0.12);
    color: rgba(0,0,0, 0.26);
    box-shadow: none; }
  .mdl-button--colored[disabled][disabled], .mdl-button--colored.mdl-button--disabled.mdl-button--disabled {
    color: rgba(0,0,0, 0.26); }

.mdl-button .material-icons {
  vertical-align: middle; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-card {
  display: flex;
  flex-direction: column;
  font-size: 16px;
  font-weight: 400;
  min-height: 200px;
  overflow: hidden;
  width: 330px;
  z-index: 1;
  position: relative;
  background: rgb(255,255,255);
  border-radius: 2px;
  box-sizing: border-box; }

.mdl-card__media {
  background-color: rgb($color-accent);
  background-repeat: repeat;
  background-position: 50% 50%;
  background-size: cover;
  background-origin: padding-box;
  background-attachment: scroll;
  box-sizing: border-box; }

.mdl-card__title {
  align-items: center;
  color: rgb(0,0,0);
  display: block;
  display: flex;
  line-height: normal;
  padding: 16px 16px;
  perspective-origin: 165px 56px;
  transform-origin: 165px 56px;
  box-sizing: border-box; }
  .mdl-card__title.mdl-card--border {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }

.mdl-card__title-text {
  align-self: flex-end;
  color: inherit;
  display: block;
  display: flex;
  font-size: 24px;
  font-weight: 300;
  line-height: normal;
  overflow: hidden;
  transform-origin: 149px 48px;
  margin: 0; }

.mdl-card__subtitle-text {
  font-size: 14px;
  color: rgba(0,0,0, 0.54);
  margin: 0; }

.mdl-card__supporting-text {
  color: rgba(0,0,0, 0.54);
  font-size: 1rem;
  line-height: 18px;
  overflow: hidden;
  padding: 16px 16px;
  width: 90%; }
  .mdl-card__supporting-text.mdl-card--border {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }

.mdl-card__actions {
  font-size: 16px;
  line-height: normal;
  width: 100%;
  background-color: rgba(0, 0, 0, 0);
  padding: 8px;
  box-sizing: border-box; }
  .mdl-card__actions.mdl-card--border {
    border-top: 1px solid rgba(0, 0, 0, 0.1); }

.mdl-card--expand {
  flex-grow: 1; }

.mdl-card__menu {
  position: absolute;
  right: 16px;
  top: 16px; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-checkbox {
  position: relative;
  z-index: 1;
  vertical-align: middle;
  display: inline-block;
  box-sizing: border-box;
  width: 100%;
  height: 24px;
  margin: 0;
  padding: 0; }
  .mdl-checkbox.is-upgraded {
    padding-left: 24px; }

.mdl-checkbox__input {
  line-height: 24px; }
  .mdl-checkbox.is-upgraded .mdl-checkbox__input {
    position: absolute;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    opacity: 0;
    -ms-appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: none; }

.mdl-checkbox__box-outline {
  position: absolute;
  top: 3px;
  left: 0;
  display: inline-block;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  margin: 0;
  cursor: pointer;
  overflow: hidden;
  border: 2px solid rgba(0,0,0, 0.54);
  border-radius: 2px;
  z-index: 2; }
  .mdl-checkbox.is-checked .mdl-checkbox__box-outline {
    border: 2px solid rgb($color-primary); }
  fieldset[disabled] .mdl-checkbox .mdl-checkbox__box-outline, .mdl-checkbox.is-disabled .mdl-checkbox__box-outline {
    border: 2px solid rgba(0,0,0, 0.26);
    cursor: auto; }

.mdl-checkbox__focus-helper {
  position: absolute;
  top: 3px;
  left: 0;
  display: inline-block;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: transparent; }
  .mdl-checkbox.is-focused .mdl-checkbox__focus-helper {
    box-shadow: 0 0 0px 8px rgba(0, 0, 0, 0.1);
    background-color: rgba(0, 0, 0, 0.1); }
  .mdl-checkbox.is-focused.is-checked .mdl-checkbox__focus-helper {
    box-shadow: 0 0 0px 8px rgba($color-primary, 0.26);
    background-color: rgba($color-primary, 0.26); }

.mdl-checkbox__tick-outline {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  mask: url("../themes/ngg-material/assets/scss/images/tick-mask.svg?embed");
  background: transparent;
  transition-duration: 0.28s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: background-image; }
  .mdl-checkbox.is-checked .mdl-checkbox__tick-outline {
    background-color: rgb($color-primary);
    background-image: url("../themes/ngg-material/assets/scss/images/tick.svg?embed"); }
  fieldset[disabled] .mdl-checkbox.is-checked .mdl-checkbox__tick-outline, .mdl-checkbox.is-checked.is-disabled .mdl-checkbox__tick-outline {
    background-color: rgba(0,0,0, 0.26); }

.mdl-checkbox__label {
  position: relative;
  cursor: pointer;
  font-size: 16px;
  line-height: 24px;
  margin: 0; }
  fieldset[disabled] .mdl-checkbox .mdl-checkbox__label, .mdl-checkbox.is-disabled .mdl-checkbox__label {
    color: rgba(0,0,0, 0.26);
    cursor: auto; }

.mdl-checkbox__ripple-container {
  position: absolute;
  z-index: 2;
  top: -6px;
  left: -10px;
  box-sizing: border-box;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  cursor: pointer;
  overflow: hidden;
  -webkit-mask-image: -webkit-radial-gradient(circle, white, black); }
  .mdl-checkbox__ripple-container .mdl-ripple {
    background: rgb($color-primary); }
  fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container, .mdl-checkbox.is-disabled .mdl-checkbox__ripple-container {
    cursor: auto; }
  fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container .mdl-ripple, .mdl-checkbox.is-disabled .mdl-checkbox__ripple-container .mdl-ripple {
    background: transparent; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-chip {
  height: 32px;
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  line-height: 32px;
  padding: 0 12px;
  border: 0;
  border-radius: 16px;
  background-color: #dedede;
  display: inline-block;
  color: rgba(0,0,0, 0.87);
  margin: 2px 0;
  font-size: 0;
  white-space: nowrap; }
  .mdl-chip__text {
    font-size: 13px;
    vertical-align: middle;
    display: inline-block; }
  .mdl-chip__action {
    height: 24px;
    width: 24px;
    background: transparent;
    opacity: 0.54;
    display: inline-block;
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    padding: 0;
    margin: 0 0 0 4px;
    font-size: 13px;
    text-decoration: none;
    color: rgba(0,0,0, 0.87);
    border: none;
    outline: none;
    overflow: hidden; }
  .mdl-chip__contact {
    height: 32px;
    width: 32px;
    border-radius: 16px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 8px;
    overflow: hidden;
    text-align: center;
    font-size: 18px;
    line-height: 32px; }
  .mdl-chip:focus {
    outline: 0;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }
  .mdl-chip:active {
    background-color: #d6d6d6; }
  .mdl-chip--deletable {
    padding-right: 4px; }
  .mdl-chip--contact {
    padding-left: 0; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-data-table {
  position: relative;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-collapse: collapse;
  white-space: nowrap;
  font-size: 13px;
  background-color: rgb(255,255,255); }
  .mdl-data-table thead {
    padding-bottom: 3px; }
    .mdl-data-table thead .mdl-data-table__select {
      margin-top: 0; }
  .mdl-data-table tbody tr {
    position: relative;
    height: 48px;
    transition-duration: 0.28s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-property: background-color; }
    .mdl-data-table tbody tr.is-selected {
      background-color: #e0e0e0; }
    .mdl-data-table tbody tr:hover {
      background-color: #eee; }
  .mdl-data-table td, .mdl-data-table th {
    padding: 0 18px 12px 18px;
    text-align: right; }
    .mdl-data-table td:first-of-type, .mdl-data-table th:first-of-type {
      padding-left: 24px; }
    .mdl-data-table td:last-of-type, .mdl-data-table th:last-of-type {
      padding-right: 24px; }
  .mdl-data-table td {
    position: relative;
    vertical-align: middle;
    height: 48px;
    border-top: 1px solid rgba(0, 0, 0, 0.12);
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    padding-top: 12px;
    box-sizing: border-box; }
    .mdl-data-table td .mdl-data-table__select {
      vertical-align: middle; }
  .mdl-data-table th {
    position: relative;
    vertical-align: bottom;
    text-overflow: ellipsis;
    font-size: 14px;
    font-weight: bold;
    line-height: 24px;
    letter-spacing: 0;
    height: 48px;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.54);
    padding-bottom: 8px;
    box-sizing: border-box; }
    .mdl-data-table th.mdl-data-table__header--sorted-ascending, .mdl-data-table th.mdl-data-table__header--sorted-descending {
      color: rgba(0, 0, 0, 0.87); }
    .mdl-data-table th.mdl-data-table__header--sorted-ascending:before, .mdl-data-table th.mdl-data-table__header--sorted-descending:before {
      font-family: 'Material Icons';
      font-weight: normal;
      font-style: normal;
      font-size: 24px;
      line-height: 1;
      letter-spacing: normal;
      text-transform: none;
      display: inline-block;
      word-wrap: normal;
      font-feature-settings: 'liga';
      -webkit-font-feature-settings: 'liga';
      -webkit-font-smoothing: antialiased;
      font-size: 16px;
      content: "\e5d8";
      margin-right: 5px;
      vertical-align: sub; }
    .mdl-data-table th.mdl-data-table__header--sorted-ascending:hover, .mdl-data-table th.mdl-data-table__header--sorted-descending:hover {
      cursor: pointer; }
      .mdl-data-table th.mdl-data-table__header--sorted-ascending:hover:before, .mdl-data-table th.mdl-data-table__header--sorted-descending:hover:before {
        color: rgba(0, 0, 0, 0.26); }
    .mdl-data-table th.mdl-data-table__header--sorted-descending:before {
      content: "\e5db"; }

.mdl-data-table__select {
  width: 16px; }

.mdl-data-table__cell--non-numeric.mdl-data-table__cell--non-numeric {
  text-align: left; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-dialog {
  border: none;
  box-shadow: 0 9px 46px 8px rgba(0, 0, 0, 0.14), 0 11px 15px -7px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.2);
  width: 280px; }
  .mdl-dialog__title {
    padding: 24px 24px 0;
    margin: 0;
    font-size: 2.5rem; }
  .mdl-dialog__actions {
    padding: 8px 8px 8px 24px;
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: wrap; }
    .mdl-dialog__actions > * {
      margin-right: 8px;
      height: 36px; }
    .mdl-dialog__actions > *:first-child {
      margin-right: 0; }
    .mdl-dialog__actions--full-width {
      padding: 0 0 8px 0; }
    .mdl-dialog__actions--full-width > * {
      height: 48px;
      flex: 0 0 auto;
      width: 100%;
      padding-right: 16px;
      margin-right: 0;
      text-align: right; }
  .mdl-dialog__content {
    padding: 20px 24px 24px 24px;
    color: rgba(0,0,0, 0.54); }
/**
 * Copyright 2016 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-expansion {
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  box-sizing: border-box; }
  .mdl-expansion__summary {
    font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
    padding-left: 24px;
    padding-right: 24px;
    height: 48px;
    display: flex;
    outline: none; }
    .mdl-expansion__summary::-webkit-details-marker {
      display: none; }
    .mdl-expansion__summary::after {
      font-family: 'Material Icons';
      font-weight: normal;
      font-style: normal;
      font-size: 24px;
      line-height: 1;
      letter-spacing: normal;
      text-transform: none;
      display: inline-block;
      word-wrap: normal;
      font-feature-settings: 'liga';
      -webkit-font-feature-settings: 'liga';
      -webkit-font-smoothing: antialiased;
      content: '\e313';
      display: inline-flex;
      flex-direction: column;
      user-select: none;
      justify-content: center;
      transition: transform 200ms, color 200ms;
      margin-left: auto;
      color: rgba(0, 0, 0, 0.38); }
    .mdl-expansion__summary:focus {
      background-color: rgba(238,238,238, 1); }
    .mdl-expansion__summary:focus::after {
      color: rgba(0, 0, 0, 0.54); }
  .mdl-expansion__header {
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 0.9375rem;
    font-weight: 500;
    flex-basis: 30%;
    margin-right: 16px; }
  .mdl-expansion__subheader {
    font-size: 0.75rem;
    color: rgba(0, 0, 0, 0.54); }
  .mdl-expansion__secondary-header {
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 0.9375rem;
    font-weight: 500;
    flex-basis: 30%;
    color: rgba(0, 0, 0, 0.87);
    margin-right: 16px; }
  .mdl-expansion__content {
    font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
    padding-left: 24px;
    padding-right: 24px;
    padding-top: 16px;
    padding-bottom: 16px; }
    .mdl-expansion__content + .mdl-expansion__actions {
      border-top: 1px solid rgba(0, 0, 0, 0.12); }
  .mdl-expansion__actions {
    display: flex;
    flex-direction: row-reverse;
    padding-top: 16px;
    padding-bottom: 16px; }
  .mdl-expansion__action {
    margin-right: 8px; }
  .mdl-expansion[open] .mdl-expansion__summary::after {
    transform: rotate(180deg); }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-mega-footer {
  padding: 16px 40px;
  color: rgb(158,158,158);
  background-color: rgb(66,66,66); }

.mdl-mega-footer--top-section:after, .mdl-mega-footer--middle-section:after, .mdl-mega-footer--bottom-section:after, .mdl-mega-footer__top-section:after, .mdl-mega-footer__middle-section:after, .mdl-mega-footer__bottom-section:after {
  content: '';
  display: block;
  clear: both; }

.mdl-mega-footer--left-section, .mdl-mega-footer__left-section {
  margin-bottom: 16px; }

.mdl-mega-footer--right-section, .mdl-mega-footer__right-section {
  margin-bottom: 16px; }

.mdl-mega-footer--right-section a, .mdl-mega-footer__right-section a {
  display: block;
  margin-bottom: 16px;
  color: inherit;
  text-decoration: none; }

@media screen and (min-width: 760px) {
  .mdl-mega-footer--left-section, .mdl-mega-footer__left-section {
    float: left; }

  .mdl-mega-footer--right-section, .mdl-mega-footer__right-section {
    float: right; }

  .mdl-mega-footer--right-section a, .mdl-mega-footer__right-section a {
    display: inline-block;
    margin-left: 16px;
    line-height: 36px;
    vertical-align: middle; } }

.mdl-mega-footer--social-btn, .mdl-mega-footer__social-btn {
  width: 36px;
  height: 36px;
  padding: 0;
  margin: 0;
  background-color: rgb(158,158,158);
  border: none; }

.mdl-mega-footer--drop-down-section, .mdl-mega-footer__drop-down-section {
  display: block;
  position: relative; }

@media screen and (min-width: 760px) {
  .mdl-mega-footer--drop-down-section, .mdl-mega-footer__drop-down-section {
    width: 33%; }

  .mdl-mega-footer--drop-down-section:nth-child(1), .mdl-mega-footer--drop-down-section:nth-child(2), .mdl-mega-footer__drop-down-section:nth-child(1), .mdl-mega-footer__drop-down-section:nth-child(2) {
    float: left; }

  .mdl-mega-footer--drop-down-section:nth-child(3), .mdl-mega-footer__drop-down-section:nth-child(3) {
    float: right; }
    .mdl-mega-footer--drop-down-section:nth-child(3):after, .mdl-mega-footer__drop-down-section:nth-child(3):after {
      clear: right; }

  .mdl-mega-footer--drop-down-section:nth-child(4), .mdl-mega-footer__drop-down-section:nth-child(4) {
    clear: right;
    float: right; }

  .mdl-mega-footer--middle-section:after, .mdl-mega-footer__middle-section:after {
    content: '';
    display: block;
    clear: both; }

  .mdl-mega-footer--bottom-section, .mdl-mega-footer__bottom-section {
    padding-top: 0; } }

@media screen and (min-width: 1024px) {
  .mdl-mega-footer--drop-down-section, .mdl-mega-footer--drop-down-section:nth-child(3), .mdl-mega-footer--drop-down-section:nth-child(4), .mdl-mega-footer__drop-down-section, .mdl-mega-footer__drop-down-section:nth-child(3), .mdl-mega-footer__drop-down-section:nth-child(4) {
    width: 24%;
    float: left; } }

.mdl-mega-footer--heading-checkbox, .mdl-mega-footer__heading-checkbox {
  position: absolute;
  width: 100%;
  height: 55.8px;
  padding: 32px;
  margin: 0;
  margin-top: -16px;
  cursor: pointer;
  z-index: 1;
  opacity: 0; }
  .mdl-mega-footer--heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer__heading:after {
    font-family: 'Material Icons';
    content: '\E5CE'; }

.mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list {
  display: none; }
  .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading:after {
    font-family: 'Material Icons';
    content: '\E5CF'; }

.mdl-mega-footer--heading, .mdl-mega-footer__heading {
  position: relative;
  width: 100%;
  padding-right: 39.8px;
  margin-bottom: 16px;
  box-sizing: border-box;
  font-size: 14px;
  line-height: 23.8px;
  font-weight: 500;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  color: rgb(224,224,224); }

.mdl-mega-footer--heading:after, .mdl-mega-footer__heading:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 23.8px;
  height: 23.8px;
  background-size: cover; }

.mdl-mega-footer--link-list, .mdl-mega-footer__link-list {
  list-style: none;
  margin: 0;
  padding: 0;
  margin-bottom: 32px; }
  .mdl-mega-footer--link-list:after, .mdl-mega-footer__link-list:after {
    clear: both;
    display: block;
    content: ''; }

.mdl-mega-footer--link-list li, .mdl-mega-footer__link-list li {
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0;
  line-height: 20px; }

.mdl-mega-footer--link-list a, .mdl-mega-footer__link-list a {
  color: inherit;
  text-decoration: none;
  white-space: nowrap; }

@media screen and (min-width: 760px) {
  .mdl-mega-footer--heading-checkbox, .mdl-mega-footer__heading-checkbox {
    display: none; }
    .mdl-mega-footer--heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer__heading:after {
      content: ''; }

  .mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list {
    display: block; }
    .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading:after {
      content: ''; } }

.mdl-mega-footer--bottom-section, .mdl-mega-footer__bottom-section {
  padding-top: 16px;
  margin-bottom: 16px; }

.mdl-logo {
  margin-bottom: 16px;
  color: white; }

.mdl-mega-footer--bottom-section .mdl-mega-footer--link-list li, .mdl-mega-footer__bottom-section .mdl-mega-footer__link-list li {
  float: left;
  margin-bottom: 0;
  margin-right: 16px; }

@media screen and (min-width: 760px) {
  .mdl-logo {
    float: left;
    margin-bottom: 0;
    margin-right: 16px; } }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-mini-footer {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  padding: 32px 16px;
  color: rgb(158,158,158);
  background-color: rgb(66,66,66); }
  .mdl-mini-footer:after {
    content: '';
    display: block; }
  .mdl-mini-footer .mdl-logo {
    line-height: 36px; }

.mdl-mini-footer--link-list, .mdl-mini-footer__link-list {
  display: flex;
  flex-flow: row nowrap;
  list-style: none;
  margin: 0;
  padding: 0; }
  .mdl-mini-footer--link-list li, .mdl-mini-footer__link-list li {
    margin-bottom: 0;
    margin-right: 16px; }
    @media screen and (min-width: 760px) {
  .mdl-mini-footer--link-list li, .mdl-mini-footer__link-list li {
    line-height: 36px; } }
  .mdl-mini-footer--link-list a, .mdl-mini-footer__link-list a {
    color: inherit;
    text-decoration: none;
    white-space: nowrap; }

.mdl-mini-footer--left-section, .mdl-mini-footer__left-section {
  display: inline-block;
  order: 0; }

.mdl-mini-footer--right-section, .mdl-mini-footer__right-section {
  display: inline-block;
  order: 1; }

.mdl-mini-footer--social-btn, .mdl-mini-footer__social-btn {
  width: 36px;
  height: 36px;
  padding: 0;
  margin: 0;
  background-color: rgb(158,158,158);
  border: none; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-icon-toggle {
  position: relative;
  z-index: 1;
  vertical-align: middle;
  display: inline-block;
  height: 32px;
  margin: 0;
  padding: 0; }

.mdl-icon-toggle__input {
  line-height: 32px; }
  .mdl-icon-toggle.is-upgraded .mdl-icon-toggle__input {
    position: absolute;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    opacity: 0;
    -ms-appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: none; }

.mdl-icon-toggle__label {
  display: inline-block;
  position: relative;
  cursor: pointer;
  height: 32px;
  width: 32px;
  min-width: 32px;
  color: rgb(97,97,97);
  border-radius: 50%;
  padding: 0;
  margin-left: 0;
  margin-right: 0;
  text-align: center;
  background-color: transparent;
  will-change: background-color;
  transition: background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
  .mdl-icon-toggle__label.material-icons {
    line-height: 32px;
    font-size: 24px; }
  .mdl-icon-toggle.is-checked .mdl-icon-toggle__label {
    color: rgb($color-primary); }
  .mdl-icon-toggle.is-disabled .mdl-icon-toggle__label {
    color: rgba(0,0,0, 0.26);
    cursor: auto;
    transition: none; }
  .mdl-icon-toggle.is-focused .mdl-icon-toggle__label {
    background-color: rgba(0,0,0, 0.12); }
  .mdl-icon-toggle.is-focused.is-checked .mdl-icon-toggle__label {
    background-color: rgba($color-primary, 0.26); }

.mdl-icon-toggle__ripple-container {
  position: absolute;
  z-index: 2;
  top: -2px;
  left: -2px;
  box-sizing: border-box;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  cursor: pointer;
  overflow: hidden;
  -webkit-mask-image: -webkit-radial-gradient(circle, white, black); }
  .mdl-icon-toggle__ripple-container .mdl-ripple {
    background: rgb(97,97,97); }
  .mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container {
    cursor: auto; }
  .mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container .mdl-ripple {
    background: transparent; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-list {
  display: block;
  padding: 8px 0;
  list-style: none; }

.mdl-list__item {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0.04em;
  line-height: 1;
  display: flex;
  min-height: 48px;
  box-sizing: border-box;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  padding: 16px;
  cursor: default;
  color: rgba(0,0,0, 0.87);
  overflow: hidden; }
  .mdl-list__item .mdl-list__item-primary-content {
    order: 0;
    flex-grow: 2;
    text-decoration: none;
    box-sizing: border-box;
    display: flex;
    align-items: center; }
    .mdl-list__item .mdl-list__item-primary-content .mdl-list__item-icon {
      margin-right: 32px; }
    .mdl-list__item .mdl-list__item-primary-content .mdl-list__item-avatar {
      margin-right: 16px; }
  .mdl-list__item .mdl-list__item-secondary-content {
    display: flex;
    flex-flow: column;
    align-items: flex-end;
    margin-left: 16px; }
    .mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-secondary-action label {
      display: inline; }
    .mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-secondary-info {
      font-size: 12px;
      font-weight: 400;
      line-height: 1;
      letter-spacing: 0;
      color: rgba(0,0,0, 0.54); }
    .mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-sub-header {
      padding: 0 0 0 16px; }

.mdl-list__item-icon, .mdl-list__item-icon.material-icons {
  height: 24px;
  width: 24px;
  font-size: 24px;
  box-sizing: border-box;
  color: rgb(117,117,117); }

.mdl-list__item-avatar, .mdl-list__item-avatar.material-icons {
  height: 40px;
  width: 40px;
  box-sizing: border-box;
  border-radius: 50%;
  background-color: rgb(117,117,117);
  font-size: 40px;
  color: white; }

.mdl-list__item--two-line {
  height: 72px; }
  .mdl-list__item--two-line .mdl-list__item-primary-content {
    height: 36px;
    line-height: 20px;
    display: block; }
    .mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-avatar {
      float: left; }
    .mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-icon {
      float: left;
      margin-top: 6px; }
    .mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-secondary-content {
      height: 36px; }
    .mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-sub-title {
      font-size: 14px;
      font-weight: 400;
      line-height: 24px;
      letter-spacing: 0;
      line-height: 18px;
      color: rgba(0,0,0, 0.54);
      display: block;
      padding: 0; }

.mdl-list__item--three-line {
  height: 88px; }
  .mdl-list__item--three-line .mdl-list__item-primary-content {
    height: 52px;
    line-height: 20px;
    display: block; }
    .mdl-list__item--three-line .mdl-list__item-primary-content .mdl-list__item-avatar, .mdl-list__item--three-line .mdl-list__item-primary-content .mdl-list__item-icon {
      float: left; }
  .mdl-list__item--three-line .mdl-list__item-secondary-content {
    height: 52px; }
  .mdl-list__item--three-line .mdl-list__item-text-body {
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0;
    line-height: 18px;
    height: 52px;
    color: rgba(0,0,0, 0.54);
    display: block;
    padding: 0; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-menu__container {
  display: block;
  margin: 0;
  padding: 0;
  border: none;
  position: absolute;
  overflow: visible;
  height: 0;
  width: 0;
  visibility: hidden;
  z-index: -1; }
  .mdl-menu__container.is-visible, .mdl-menu__container.is-animating {
    z-index: 999;
    visibility: visible; }

.mdl-menu__outline {
  display: block;
  background: rgb(255,255,255);
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 2px;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  opacity: 0;
  transform: scale(0);
  transform-origin: 0 0;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  will-change: transform;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: -1; }
  .mdl-menu__container.is-visible .mdl-menu__outline {
    opacity: 1;
    transform: scale(1);
    z-index: 999; }
  .mdl-menu__outline.mdl-menu--bottom-right {
    transform-origin: 100% 0; }
  .mdl-menu__outline.mdl-menu--top-left {
    transform-origin: 0 100%; }
  .mdl-menu__outline.mdl-menu--top-right {
    transform-origin: 100% 100%; }

.mdl-menu {
  position: absolute;
  list-style: none;
  top: 0;
  left: 0;
  height: auto;
  width: auto;
  min-width: 124px;
  padding: 8px 0;
  margin: 0;
  opacity: 0;
  clip: rect(0 0 0 0);
  z-index: -1; }
  .mdl-menu__container.is-visible .mdl-menu {
    opacity: 1;
    z-index: 999; }
  .mdl-menu.is-animating {
    transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), clip 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
  .mdl-menu.mdl-menu--bottom-right {
    left: auto;
    right: 0; }
  .mdl-menu.mdl-menu--top-left {
    top: auto;
    bottom: 0; }
  .mdl-menu.mdl-menu--top-right {
    top: auto;
    left: auto;
    bottom: 0;
    right: 0; }
  .mdl-menu.mdl-menu--unaligned {
    top: auto;
    left: auto; }

.mdl-menu__item {
  display: block;
  border: none;
  color: rgba(0,0,0, 0.87);
  background-color: transparent;
  text-align: left;
  margin: 0;
  padding: 0 16px;
  outline-color: rgb(189,189,189);
  position: relative;
  overflow: hidden;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0;
  text-decoration: none;
  cursor: pointer;
  height: 48px;
  line-height: 48px;
  white-space: nowrap;
  opacity: 0;
  transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  user-select: none; }
  .mdl-menu__container.is-visible .mdl-menu__item {
    opacity: 1; }
  .mdl-menu__item::-moz-focus-inner {
    border: 0; }
  .mdl-menu__item--full-bleed-divider {
    border-bottom: 1px solid rgba(0,0,0, 0.12); }
  .mdl-menu__item[disabled], .mdl-menu__item[data-mdl-disabled] {
    color: rgb(189,189,189);
    background-color: transparent;
    cursor: auto; }
    .mdl-menu__item[disabled]:hover, .mdl-menu__item[data-mdl-disabled]:hover {
      background-color: transparent; }
    .mdl-menu__item[disabled]:focus, .mdl-menu__item[data-mdl-disabled]:focus {
      background-color: transparent; }
    .mdl-menu__item[disabled] .mdl-ripple, .mdl-menu__item[data-mdl-disabled] .mdl-ripple {
      background: transparent; }
  .mdl-menu__item:hover {
    background-color: rgb(238,238,238); }
  .mdl-menu__item:focus {
    outline: none;
    background-color: rgb(238,238,238); }
  .mdl-menu__item:active {
    background-color: rgb(224,224,224); }

.mdl-menu__item--ripple-container {
  display: block;
  height: 100%;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100%;
  z-index: 0;
  overflow: hidden; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-progress {
  display: block;
  position: relative;
  height: 4px;
  width: 500px;
  max-width: 100%; }

.mdl-progress > .bar {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 0%;
  transition: width 0.2s cubic-bezier(0.4, 0, 0.2, 1); }

.mdl-progress > .progressbar {
  background-color: rgb($color-primary);
  z-index: 1;
  left: 0; }

.mdl-progress > .bufferbar {
  background-image: linear-gradient(to right, rgba($color-primary-contrast, 0.7), rgba($color-primary-contrast, 0.7)), linear-gradient(to right, rgb($color-primary), rgb($color-primary));
  z-index: 0;
  left: 0; }

.mdl-progress > .auxbar {
  right: 0; }

@supports (-webkit-appearance:none) {
  .mdl-progress:not(.mdl-progress--indeterminate):not(.mdl-progress--indeterminate) > .auxbar, .mdl-progress:not(.mdl-progress__indeterminate):not(.mdl-progress__indeterminate) > .auxbar {
    background-image: linear-gradient(to right, rgba($color-primary-contrast, 0.7), rgba($color-primary-contrast, 0.7)), linear-gradient(to right, rgb($color-primary), rgb($color-primary));
    mask: url("../themes/ngg-material/assets/scss/images/buffer.svg?embed"); } }

.mdl-progress:not(.mdl-progress--indeterminate) > .auxbar, .mdl-progress:not(.mdl-progress__indeterminate) > .auxbar {
  background-image: linear-gradient(to right, rgba($color-primary-contrast, 0.9), rgba($color-primary-contrast, 0.9)), linear-gradient(to right, rgb($color-primary), rgb($color-primary)); }

.mdl-progress.mdl-progress--indeterminate > .bar1, .mdl-progress.mdl-progress__indeterminate > .bar1 {
  background-color: rgb($color-primary);
  animation-name: indeterminate1;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: linear; }

.mdl-progress.mdl-progress--indeterminate > .bar3, .mdl-progress.mdl-progress__indeterminate > .bar3 {
  background-image: none;
  background-color: rgb($color-primary);
  animation-name: indeterminate2;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: linear; }

@keyframes indeterminate1 {
  0% {
    left: 0%;
    width: 0%; }

  50% {
    left: 25%;
    width: 75%; }

  75% {
    left: 100%;
    width: 0%; } }

@keyframes indeterminate2 {
  0% {
    left: 0%;
    width: 0%; }

  50% {
    left: 0%;
    width: 0%; }

  75% {
    left: 0%;
    width: 25%; }

  100% {
    left: 100%;
    width: 0%; } }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-navigation {
  display: flex;
  flex-wrap: nowrap;
  box-sizing: border-box; }

.mdl-navigation__link {
  color: rgb(66,66,66);
  text-decoration: none;
  margin: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0;
  opacity: 0.87; }
  .mdl-navigation__link .material-icons {
    vertical-align: middle; }

.mdl-layout {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overflow-x: hidden;
  position: relative;
  -webkit-overflow-scrolling: touch; }

.mdl-layout.is-small-screen .mdl-layout--large-screen-only {
  display: none; }

.mdl-layout:not(.is-small-screen) .mdl-layout--small-screen-only {
  display: none; }

.mdl-layout__container {
  position: absolute;
  width: 100%;
  height: 100%; }

.mdl-layout__title, .mdl-layout-title {
  display: block;
  position: relative;
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.02em;
  font-weight: 400;
  box-sizing: border-box; }

.mdl-layout-spacer {
  flex-grow: 1; }

.mdl-layout__drawer {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  width: 240px;
  height: 100%;
  max-height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  box-sizing: border-box;
  border-right: 1px solid rgb(224,224,224);
  background: rgb(250,250,250);
  transform: translateX(-250px);
  transform-style: preserve-3d;
  will-change: transform;
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: transform;
  color: rgb(66,66,66);
  overflow: visible;
  overflow-y: auto;
  z-index: 5; }
  .mdl-layout__drawer.is-visible {
    transform: translateX(0); }
    .mdl-layout__drawer.is-visible ~ .mdl-layout__content.mdl-layout__content {
      overflow: hidden; }
  .mdl-layout__drawer > * {
    flex-shrink: 0; }
  .mdl-layout__drawer > .mdl-layout__title, .mdl-layout__drawer > .mdl-layout-title {
    line-height: 64px;
    padding-left: 40px; }
    @media screen and (max-width: 1024px) {
  .mdl-layout__drawer > .mdl-layout__title, .mdl-layout__drawer > .mdl-layout-title {
    line-height: 56px;
    padding-left: 16px; } }
  .mdl-layout__drawer .mdl-navigation {
    flex-direction: column;
    align-items: stretch;
    padding-top: 16px; }
    .mdl-layout__drawer .mdl-navigation .mdl-navigation__link {
      display: block;
      flex-shrink: 0;
      padding: 16px 40px;
      margin: 0;
      color: #757575; }
    @media screen and (max-width: 1024px) {
    .mdl-layout__drawer .mdl-navigation .mdl-navigation__link {
      padding: 16px 16px; } }
    .mdl-layout__drawer .mdl-navigation .mdl-navigation__link:hover {
      background-color: rgb(224,224,224); }
    .mdl-layout__drawer .mdl-navigation .mdl-navigation__link--current {
      background-color: rgb(224,224,224);
      color: rgb(0,0,0); }
  @media screen and (min-width: 1025px) {
  .mdl-layout--fixed-drawer > .mdl-layout__drawer {
    transform: translateX(0); } }

.mdl-layout__drawer-button {
  display: block;
  position: absolute;
  height: 48px;
  width: 48px;
  border: 0;
  flex-shrink: 0;
  overflow: hidden;
  text-align: center;
  cursor: pointer;
  font-size: 26px;
  line-height: 56px;
  font-family: Helvetica, Arial, sans-serif;
  margin: 8px 12px;
  top: 0;
  left: 0;
  color: rgb($color-primary-contrast);
  z-index: 4; }
  .mdl-layout__header .mdl-layout__drawer-button {
    position: absolute;
    color: rgb($color-primary-contrast);
    background-color: inherit; }
    @media screen and (max-width: 1024px) {
  .mdl-layout__header .mdl-layout__drawer-button {
    margin: 4px; } }
  @media screen and (max-width: 1024px) {
  .mdl-layout__drawer-button {
    margin: 4px;
    color: rgba(0, 0, 0, 0.5); } }
  @media screen and (min-width: 1025px) {
  .mdl-layout__drawer-button {
    line-height: 54px; }
    .mdl-layout--no-desktop-drawer-button .mdl-layout__drawer-button, .mdl-layout--fixed-drawer > .mdl-layout__drawer-button, .mdl-layout--no-drawer-button .mdl-layout__drawer-button {
      display: none; } }

.mdl-layout__header {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  box-sizing: border-box;
  flex-shrink: 0;
  width: 100%;
  margin: 0;
  padding: 0;
  border: none;
  min-height: 64px;
  max-height: 1000px;
  z-index: 3;
  background-color: rgb($color-primary);
  color: rgb($color-primary-contrast);
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: max-height, box-shadow; }
  @media screen and (max-width: 1024px) {
  .mdl-layout__header {
    min-height: 56px; } }
  .mdl-layout--fixed-drawer.is-upgraded:not(.is-small-screen) > .mdl-layout__header {
    margin-left: 240px;
    width: calc(100% - 240px); }
  @media screen and (min-width: 1025px) {
  .mdl-layout--fixed-drawer > .mdl-layout__header .mdl-layout__header-row {
    padding-left: 40px; } }
  .mdl-layout__header > .mdl-layout-icon {
    position: absolute;
    left: 40px;
    top: 16px;
    height: 32px;
    width: 32px;
    overflow: hidden;
    z-index: 3;
    display: block; }
    @media screen and (max-width: 1024px) {
  .mdl-layout__header > .mdl-layout-icon {
    left: 16px;
    top: 12px; } }
  .mdl-layout.has-drawer .mdl-layout__header > .mdl-layout-icon {
    display: none; }
  .mdl-layout__header.is-compact {
    max-height: 64px; }
    @media screen and (max-width: 1024px) {
  .mdl-layout__header.is-compact {
    max-height: 56px; } }
  .mdl-layout__header.is-compact.has-tabs {
    height: 112px; }
    @media screen and (max-width: 1024px) {
  .mdl-layout__header.is-compact.has-tabs {
    min-height: 104px; } }
  @media screen and (max-width: 1024px) {
  .mdl-layout__header {
    display: none; }
  .mdl-layout--fixed-header > .mdl-layout__header {
    display: flex; } }

.mdl-layout__header--transparent.mdl-layout__header--transparent {
  background-color: transparent;
  box-shadow: none; }

.mdl-layout__header--seamed {
  box-shadow: none; }

.mdl-layout__header--scroll {
  box-shadow: none; }

.mdl-layout__header--waterfall {
  box-shadow: none;
  overflow: hidden; }
  .mdl-layout__header--waterfall.is-casting-shadow {
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }
  .mdl-layout__header--waterfall.mdl-layout__header--waterfall-hide-top {
    justify-content: flex-end; }

.mdl-layout__header-row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  flex-shrink: 0;
  box-sizing: border-box;
  align-self: stretch;
  align-items: center;
  height: 64px;
  margin: 0;
  padding: 0 40px 0 80px; }
  .mdl-layout--no-drawer-button .mdl-layout__header-row {
    padding-left: 40px; }
  @media screen and (min-width: 1025px) {
  .mdl-layout--no-desktop-drawer-button .mdl-layout__header-row {
    padding-left: 40px; } }
  @media screen and (max-width: 1024px) {
  .mdl-layout__header-row {
    height: 56px;
    padding: 0 16px 0 72px; }
    .mdl-layout--no-drawer-button .mdl-layout__header-row {
      padding-left: 16px; } }
  .mdl-layout__header-row > * {
    flex-shrink: 0; }
  .mdl-layout__header--scroll .mdl-layout__header-row {
    width: 100%; }
  .mdl-layout__header-row .mdl-navigation {
    margin: 0;
    padding: 0;
    height: 64px;
    flex-direction: row;
    align-items: center; }
    @media screen and (max-width: 1024px) {
  .mdl-layout__header-row .mdl-navigation {
    height: 56px; } }
  .mdl-layout__header-row .mdl-navigation__link {
    display: block;
    color: rgb($color-primary-contrast);
    line-height: 64px;
    padding: 0 24px; }
    @media screen and (max-width: 1024px) {
  .mdl-layout__header-row .mdl-navigation__link {
    line-height: 56px;
    padding: 0 16px; } }

.mdl-layout__obfuscator {
  background-color: transparent;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 4;
  visibility: hidden;
  transition-property: background-color;
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
  .mdl-layout__obfuscator.is-visible {
    background-color: rgba(0, 0, 0, 0.5);
    visibility: visible; }
  @supports (pointer-events: auto) {
  .mdl-layout__obfuscator {
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition-property: opacity;
    visibility: visible;
    pointer-events: none; }
    .mdl-layout__obfuscator.is-visible {
      pointer-events: auto;
      opacity: 1; } }

.mdl-layout__content {
  -ms-flex: 0 1 auto;
  position: relative;
  display: inline-block;
  overflow-y: auto;
  overflow-x: hidden;
  flex-grow: 1;
  z-index: 1;
  -webkit-overflow-scrolling: touch; }
  .mdl-layout--fixed-drawer > .mdl-layout__content {
    margin-left: 240px; }
  .mdl-layout__container.has-scrolling-header .mdl-layout__content {
    overflow: visible; }
  @media screen and (max-width: 1024px) {
  .mdl-layout--fixed-drawer > .mdl-layout__content {
    margin-left: 0; }
  .mdl-layout__container.has-scrolling-header .mdl-layout__content {
    overflow-y: auto;
    overflow-x: hidden; } }

.mdl-layout__tab-bar {
  height: 96px;
  margin: 0;
  width: calc(100% -
        112px);
  padding: 0 0 0 56px;
  display: flex;
  background-color: rgb($color-primary);
  overflow-y: hidden;
  overflow-x: scroll; }
  .mdl-layout__tab-bar::-webkit-scrollbar {
    display: none; }
  .mdl-layout--no-drawer-button .mdl-layout__tab-bar {
    padding-left: 16px;
    width: calc(100% -
          32px); }
  @media screen and (min-width: 1025px) {
  .mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar {
    padding-left: 16px;
    width: calc(100% -
            32px); } }
  @media screen and (max-width: 1024px) {
  .mdl-layout__tab-bar {
    width: calc(100% -
          60px);
    padding: 0 0 0 60px; }
    .mdl-layout--no-drawer-button .mdl-layout__tab-bar {
      width: calc(100% -
            8px);
      padding-left: 4px; } }
  .mdl-layout--fixed-tabs .mdl-layout__tab-bar {
    padding: 0;
    overflow: hidden;
    width: 100%; }

.mdl-layout__tab-bar-container {
  position: relative;
  height: 48px;
  width: 100%;
  border: none;
  margin: 0;
  z-index: 2;
  flex-grow: 0;
  flex-shrink: 0;
  overflow: hidden; }
  .mdl-layout__container > .mdl-layout__tab-bar-container {
    position: absolute;
    top: 0;
    left: 0; }

.mdl-layout__tab-bar-button {
  display: inline-block;
  position: absolute;
  top: 0;
  height: 48px;
  width: 56px;
  z-index: 4;
  text-align: center;
  background-color: rgb($color-primary);
  color: transparent;
  cursor: pointer;
  user-select: none; }
  .mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button, .mdl-layout--no-drawer-button .mdl-layout__tab-bar-button {
    width: 16px; }
    .mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button .material-icons, .mdl-layout--no-drawer-button .mdl-layout__tab-bar-button .material-icons {
      position: relative;
      left: -4px; }
  @media screen and (max-width: 1024px) {
  .mdl-layout__tab-bar-button {
    width: 60px; } }
  .mdl-layout--fixed-tabs .mdl-layout__tab-bar-button {
    display: none; }
  .mdl-layout__tab-bar-button .material-icons {
    line-height: 48px; }
  .mdl-layout__tab-bar-button.is-active {
    color: rgb($color-primary-contrast); }

.mdl-layout__tab-bar-left-button {
  left: 0; }

.mdl-layout__tab-bar-right-button {
  right: 0; }

.mdl-layout__tab {
  margin: 0;
  border: none;
  padding: 0 24px 0 24px;
  float: left;
  position: relative;
  display: block;
  flex-grow: 0;
  flex-shrink: 0;
  text-decoration: none;
  height: 48px;
  line-height: 48px;
  text-align: center;
  font-weight: 500;
  font-size: 14px;
  text-transform: uppercase;
  color: rgba($color-primary-contrast, 0.6);
  overflow: hidden; }
  @media screen and (max-width: 1024px) {
  .mdl-layout__tab {
    padding: 0 12px 0 12px; } }
  .mdl-layout--fixed-tabs .mdl-layout__tab {
    float: none;
    flex-grow: 1;
    padding: 0; }
  .mdl-layout.is-upgraded .mdl-layout__tab.is-active {
    color: rgb($color-primary-contrast); }
  .mdl-layout.is-upgraded .mdl-layout__tab.is-active::after {
    height: 2px;
    width: 100%;
    display: block;
    content: " ";
    bottom: 0;
    left: 0;
    position: absolute;
    background: rgb($color-accent);
    animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) alternate forwards;
    transition: all 1s cubic-bezier(0.4, 0, 1, 1); }
  .mdl-layout__tab .mdl-layout__tab-ripple-container {
    display: block;
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 1;
    overflow: hidden; }
    .mdl-layout__tab .mdl-layout__tab-ripple-container .mdl-ripple {
      background-color: rgb($color-primary-contrast); }

.mdl-layout__tab-panel {
  display: block; }
  .mdl-layout.is-upgraded .mdl-layout__tab-panel {
    display: none; }
  .mdl-layout.is-upgraded .mdl-layout__tab-panel.is-active {
    display: block; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-radio {
  position: relative;
  font-size: 16px;
  line-height: 24px;
  display: inline-block;
  vertical-align: middle;
  box-sizing: border-box;
  height: 24px;
  margin: 0;
  padding-left: 0; }
  .mdl-radio.is-upgraded {
    padding-left: 24px; }

.mdl-radio__button {
  line-height: 24px; }
  .mdl-radio.is-upgraded .mdl-radio__button {
    position: absolute;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    opacity: 0;
    -ms-appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: none; }

.mdl-radio__outer-circle {
  position: absolute;
  top: 4px;
  left: 0;
  display: inline-block;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  margin: 0;
  cursor: pointer;
  border: 2px solid rgba(0,0,0, 0.54);
  border-radius: 50%;
  z-index: 2; }
  .mdl-radio.is-checked .mdl-radio__outer-circle {
    border: 2px solid rgb($color-primary); }
  .mdl-radio__outer-circle fieldset[disabled] .mdl-radio, .mdl-radio.is-disabled .mdl-radio__outer-circle {
    border: 2px solid rgba(0,0,0, 0.26);
    cursor: auto; }

.mdl-radio__inner-circle {
  position: absolute;
  z-index: 1;
  margin: 0;
  top: 8px;
  left: 4px;
  box-sizing: border-box;
  width: 8px;
  height: 8px;
  cursor: pointer;
  transition-duration: 0.28s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: transform;
  transform: scale(0, 0);
  border-radius: 50%;
  background: rgb($color-primary); }
  .mdl-radio.is-checked .mdl-radio__inner-circle {
    transform: scale(1, 1); }
  fieldset[disabled] .mdl-radio .mdl-radio__inner-circle, .mdl-radio.is-disabled .mdl-radio__inner-circle {
    background: rgba(0,0,0, 0.26);
    cursor: auto; }
  .mdl-radio.is-focused .mdl-radio__inner-circle {
    box-shadow: 0 0 0px 10px rgba(0, 0, 0, 0.1); }

.mdl-radio__label {
  cursor: pointer; }
  fieldset[disabled] .mdl-radio .mdl-radio__label, .mdl-radio.is-disabled .mdl-radio__label {
    color: rgba(0,0,0, 0.26);
    cursor: auto; }

.mdl-radio__ripple-container {
  position: absolute;
  z-index: 2;
  top: -9px;
  left: -13px;
  box-sizing: border-box;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  cursor: pointer;
  overflow: hidden;
  -webkit-mask-image: -webkit-radial-gradient(circle, white, black); }
  .mdl-radio__ripple-container .mdl-ripple {
    background: rgb($color-primary); }
  fieldset[disabled] .mdl-radio .mdl-radio__ripple-container, .mdl-radio.is-disabled .mdl-radio__ripple-container {
    cursor: auto; }
  fieldset[disabled] .mdl-radio .mdl-radio__ripple-container .mdl-ripple, .mdl-radio.is-disabled .mdl-radio__ripple-container .mdl-ripple {
    background: transparent; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
_:-ms-input-placeholder, :root .mdl-slider.mdl-slider.is-upgraded {
  -ms-appearance: none;
  height: 32px;
  margin: 0; }

.mdl-slider {
  width: calc(100% - 40px);
  margin: 0 20px; }
  .mdl-slider.is-upgraded {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 2px;
    background: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    outline: 0;
    padding: 0;
    color: rgb($color-primary);
    align-self: center;
    z-index: 1;
    cursor: pointer;
    /**************************** Tracks ****************************/
    /**************************** Thumbs ****************************/
    /**************************** 0-value ****************************/
    /**************************** Disabled ****************************/ }
    .mdl-slider.is-upgraded::-moz-focus-outer {
      border: 0; }
    .mdl-slider.is-upgraded::-ms-tooltip {
      display: none; }
    .mdl-slider.is-upgraded::-webkit-slider-runnable-track {
      background: transparent; }
    .mdl-slider.is-upgraded::-moz-range-track {
      background: transparent;
      border: none; }
    .mdl-slider.is-upgraded::-ms-track {
      background: none;
      color: transparent;
      height: 2px;
      width: 100%;
      border: none; }
    .mdl-slider.is-upgraded::-ms-fill-lower {
      padding: 0;
      background: linear-gradient(to right, transparent, transparent 16px, rgb($color-primary) 16px, rgb($color-primary) 0); }
    .mdl-slider.is-upgraded::-ms-fill-upper {
      padding: 0;
      background: linear-gradient(to left, transparent, transparent 16px, rgba(0,0,0, 0.26) 16px, rgba(0,0,0, 0.26) 0); }
    .mdl-slider.is-upgraded::-webkit-slider-thumb {
      -webkit-appearance: none;
      width: 12px;
      height: 12px;
      box-sizing: border-box;
      border-radius: 50%;
      background: rgb($color-primary);
      border: none;
      transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), border 0.18s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1); }
    .mdl-slider.is-upgraded::-moz-range-thumb {
      -moz-appearance: none;
      width: 12px;
      height: 12px;
      box-sizing: border-box;
      border-radius: 50%;
      background-image: none;
      background: rgb($color-primary);
      border: none; }
    .mdl-slider.is-upgraded:focus:not(:active)::-webkit-slider-thumb {
      box-shadow: 0 0 0 10px rgba($color-primary, 0.26); }
    .mdl-slider.is-upgraded:focus:not(:active)::-moz-range-thumb {
      box-shadow: 0 0 0 10px rgba($color-primary, 0.26); }
    .mdl-slider.is-upgraded:active::-webkit-slider-thumb {
      background-image: none;
      background: rgb($color-primary);
      transform: scale(1.5); }
    .mdl-slider.is-upgraded:active::-moz-range-thumb {
      background-image: none;
      background: rgb($color-primary);
      transform: scale(1.5); }
    .mdl-slider.is-upgraded::-ms-thumb {
      width: 32px;
      height: 32px;
      border: none;
      border-radius: 50%;
      background: rgb($color-primary);
      transform: scale(0.375);
      transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1); }
    .mdl-slider.is-upgraded:focus:not(:active)::-ms-thumb {
      background: radial-gradient(circle closest-side, rgb($color-primary) 0%, rgb($color-primary) 37.5%, rgba($color-primary, 0.26) 37.5%, rgba($color-primary, 0.26) 100%);
      transform: scale(1); }
    .mdl-slider.is-upgraded:active::-ms-thumb {
      background: rgb($color-primary);
      transform: scale(0.5625); }
    .mdl-slider.is-upgraded.is-lowest-value::-webkit-slider-thumb {
      border: 2px solid rgba(0,0,0, 0.26);
      background: transparent; }
    .mdl-slider.is-upgraded.is-lowest-value::-moz-range-thumb {
      border: 2px solid rgba(0,0,0, 0.26);
      background: transparent; }
    .mdl-slider.is-upgraded.is-lowest-value + .mdl-slider__background-flex > .mdl-slider__background-upper {
      left: 6px; }
    .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-webkit-slider-thumb {
      box-shadow: 0 0 0 10px rgba(0,0,0, 0.12);
      background: rgba(0,0,0, 0.12); }
    .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-moz-range-thumb {
      box-shadow: 0 0 0 10px rgba(0,0,0, 0.12);
      background: rgba(0,0,0, 0.12); }
    .mdl-slider.is-upgraded.is-lowest-value:active::-webkit-slider-thumb {
      border: 1.6px solid rgba(0,0,0, 0.26);
      transform: scale(1.5); }
    .mdl-slider.is-upgraded.is-lowest-value:active + .mdl-slider__background-flex > .mdl-slider__background-upper {
      left: 9px; }
    .mdl-slider.is-upgraded.is-lowest-value:active::-moz-range-thumb {
      border: 1.5px solid rgba(0,0,0, 0.26);
      transform: scale(1.5); }
    .mdl-slider.is-upgraded.is-lowest-value::-ms-thumb {
      background: radial-gradient(circle closest-side, transparent 0%, transparent 66.67%, rgba(0,0,0, 0.26) 66.67%, rgba(0,0,0, 0.26) 100%); }
    .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-ms-thumb {
      background: radial-gradient(circle closest-side, rgba(0,0,0, 0.12) 0%, rgba(0,0,0, 0.12) 25%, rgba(0,0,0, 0.26) 25%, rgba(0,0,0, 0.26) 37.5%, rgba(0,0,0, 0.12) 37.5%, rgba(0,0,0, 0.12) 100%);
      transform: scale(1); }
    .mdl-slider.is-upgraded.is-lowest-value:active::-ms-thumb {
      transform: scale(0.5625);
      background: radial-gradient(circle closest-side, transparent 0%, transparent 77.78%, rgba(0,0,0, 0.26) 77.78%, rgba(0,0,0, 0.26) 100%); }
    .mdl-slider.is-upgraded.is-lowest-value::-ms-fill-lower {
      background: transparent; }
    .mdl-slider.is-upgraded.is-lowest-value::-ms-fill-upper {
      margin-left: 6px; }
    .mdl-slider.is-upgraded.is-lowest-value:active::-ms-fill-upper {
      margin-left: 9px; }
    .mdl-slider.is-upgraded:disabled:focus::-webkit-slider-thumb, .mdl-slider.is-upgraded:disabled:active::-webkit-slider-thumb, .mdl-slider.is-upgraded:disabled::-webkit-slider-thumb {
      transform: scale(0.667);
      background: rgba(0,0,0, 0.26); }
    .mdl-slider.is-upgraded:disabled:focus::-moz-range-thumb, .mdl-slider.is-upgraded:disabled:active::-moz-range-thumb, .mdl-slider.is-upgraded:disabled::-moz-range-thumb {
      transform: scale(0.667);
      background: rgba(0,0,0, 0.26); }
    .mdl-slider.is-upgraded:disabled + .mdl-slider__background-flex > .mdl-slider__background-lower {
      background-color: rgba(0,0,0, 0.26);
      left: -6px; }
    .mdl-slider.is-upgraded:disabled + .mdl-slider__background-flex > .mdl-slider__background-upper {
      left: 6px; }
    .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-webkit-slider-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-webkit-slider-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled::-webkit-slider-thumb {
      border: 3px solid rgba(0,0,0, 0.26);
      background: transparent;
      transform: scale(0.667); }
    .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-moz-range-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-moz-range-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled::-moz-range-thumb {
      border: 3px solid rgba(0,0,0, 0.26);
      background: transparent;
      transform: scale(0.667); }
    .mdl-slider.is-upgraded.is-lowest-value:disabled:active + .mdl-slider__background-flex > .mdl-slider__background-upper {
      left: 6px; }
    .mdl-slider.is-upgraded:disabled:focus::-ms-thumb, .mdl-slider.is-upgraded:disabled:active::-ms-thumb, .mdl-slider.is-upgraded:disabled::-ms-thumb {
      transform: scale(0.25);
      background: rgba(0,0,0, 0.26); }
    .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-ms-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled::-ms-thumb {
      transform: scale(0.25);
      background: radial-gradient(circle closest-side, transparent 0%, transparent 50%, rgba(0,0,0, 0.26) 50%, rgba(0,0,0, 0.26) 100%); }
    .mdl-slider.is-upgraded:disabled::-ms-fill-lower {
      margin-right: 6px;
      background: linear-gradient(to right, transparent, transparent 25px, rgba(0,0,0, 0.26) 25px, rgba(0,0,0, 0.26) 0); }
    .mdl-slider.is-upgraded:disabled::-ms-fill-upper {
      margin-left: 6px; }
    .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-fill-upper {
      margin-left: 6px; }

.mdl-slider__ie-container {
  height: 18px;
  overflow: visible;
  border: none;
  margin: none;
  padding: none; }

.mdl-slider__container {
  height: 18px;
  position: relative;
  background: none;
  display: flex;
  flex-direction: row; }

.mdl-slider__background-flex {
  background: transparent;
  position: absolute;
  height: 2px;
  width: calc(100% - 52px);
  top: 50%;
  left: 0;
  margin: 0 26px;
  display: flex;
  overflow: hidden;
  border: 0;
  padding: 0;
  transform: translate(0, -1px); }

.mdl-slider__background-lower {
  background: rgb($color-primary);
  flex: 0;
  position: relative;
  border: 0;
  padding: 0; }

.mdl-slider__background-upper {
  background: rgba(0,0,0, 0.26);
  flex: 0;
  position: relative;
  border: 0;
  padding: 0;
  transition: left 0.18s cubic-bezier(0.4, 0, 0.2, 1); }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-snackbar {
  position: fixed;
  bottom: 0;
  left: 50%;
  cursor: default;
  background-color: #323232;
  z-index: 3;
  display: block;
  display: flex;
  justify-content: space-between;
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  will-change: transform;
  transform: translate(0, 80px);
  transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1);
  pointer-events: none; }
  @media (max-width: 479px) {
  .mdl-snackbar {
    width: 100%;
    left: 0;
    min-height: 48px;
    max-height: 80px; } }
  @media (min-width: 480px) {
  .mdl-snackbar {
    min-width: 288px;
    max-width: 568px;
    border-radius: 2px;
    transform: translate(-50%, 80px); } }
  .mdl-snackbar--active {
    transform: translate(0, 0);
    pointer-events: auto;
    transition: transform 0.25s cubic-bezier(0, 0, 0.2, 1); }
    @media (min-width: 480px) {
  .mdl-snackbar--active {
    transform: translate(-50%, 0); } }
  .mdl-snackbar__text {
    padding: 14px 12px 14px 24px;
    vertical-align: middle;
    color: white;
    float: left; }
  .mdl-snackbar__action {
    background: transparent;
    border: none;
    color: rgb($color-accent);
    float: right;
    text-transform: uppercase;
    padding: 14px 24px 14px 12px;
    font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    line-height: 1;
    letter-spacing: 0;
    overflow: hidden;
    outline: none;
    opacity: 0;
    pointer-events: none;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    align-self: center; }
    .mdl-snackbar__action::-moz-focus-inner {
      border: 0; }
    .mdl-snackbar__action:not([aria-hidden]) {
      opacity: 1;
      pointer-events: auto; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-spinner {
  display: inline-block;
  position: relative;
  width: 28px;
  height: 28px; }
  .mdl-spinner:not(.is-upgraded).is-active:after {
    content: "Loading..."; }
  .mdl-spinner.is-upgraded.is-active {
    animation: mdl-spinner__container-rotate 1568.2352941177ms linear infinite; }

@keyframes mdl-spinner__container-rotate {
  to {
    transform: rotate(360deg); } }

.mdl-spinner__layer {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0; }

.mdl-spinner__layer-1 {
  border-color: rgb(66,165,245); }
  .mdl-spinner--single-color .mdl-spinner__layer-1 {
    border-color: rgb($color-primary); }
  .mdl-spinner.is-active .mdl-spinner__layer-1 {
    animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-1-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

.mdl-spinner__layer-2 {
  border-color: rgb(244,67,54); }
  .mdl-spinner--single-color .mdl-spinner__layer-2 {
    border-color: rgb($color-primary); }
  .mdl-spinner.is-active .mdl-spinner__layer-2 {
    animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-2-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

.mdl-spinner__layer-3 {
  border-color: rgb(253,216,53); }
  .mdl-spinner--single-color .mdl-spinner__layer-3 {
    border-color: rgb($color-primary); }
  .mdl-spinner.is-active .mdl-spinner__layer-3 {
    animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-3-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

.mdl-spinner__layer-4 {
  border-color: rgb(76,175,80); }
  .mdl-spinner--single-color .mdl-spinner__layer-4 {
    border-color: rgb($color-primary); }
  .mdl-spinner.is-active .mdl-spinner__layer-4 {
    animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-4-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

@keyframes mdl-spinner__fill-unfill-rotate {
  12.5% {
    transform: rotate(135deg); }

  25% {
    transform: rotate(270deg); }

  37.5% {
    transform: rotate(405deg); }

  50% {
    transform: rotate(540deg); }

  62.5% {
    transform: rotate(675deg); }

  75% {
    transform: rotate(810deg); }

  87.5% {
    transform: rotate(945deg); }

  to {
    transform: rotate(1080deg); } }
/**
 * HACK: Even though the intention is to have the current .mdl-spinner__layer-N
 * at `opacity: 1`, we set it to `opacity: 0.99` instead since this forces Chrome
 * to do proper subpixel rendering for the elements being animated. This is
 * especially visible in Chrome 39 on Ubuntu 14.04. See:
 *
 * - https://github.com/Polymer/paper-spinner/issues/9
 * - https://code.google.com/p/chromium/issues/detail?id=436255
 */
@keyframes mdl-spinner__layer-1-fade-in-out {
  from {
    opacity: 0.99; }

  25% {
    opacity: 0.99; }

  26% {
    opacity: 0; }

  89% {
    opacity: 0; }

  90% {
    opacity: 0.99; }

  100% {
    opacity: 0.99; } }

@keyframes mdl-spinner__layer-2-fade-in-out {
  from {
    opacity: 0; }

  15% {
    opacity: 0; }

  25% {
    opacity: 0.99; }

  50% {
    opacity: 0.99; }

  51% {
    opacity: 0; } }

@keyframes mdl-spinner__layer-3-fade-in-out {
  from {
    opacity: 0; }

  40% {
    opacity: 0; }

  50% {
    opacity: 0.99; }

  75% {
    opacity: 0.99; }

  76% {
    opacity: 0; } }

@keyframes mdl-spinner__layer-4-fade-in-out {
  from {
    opacity: 0; }

  65% {
    opacity: 0; }

  75% {
    opacity: 0.99; }

  90% {
    opacity: 0.99; }

  100% {
    opacity: 0; } }
/**
 * Patch the gap that appear between the two adjacent
 * div.mdl-spinner__circle-clipper while the spinner is rotating
 * (appears on Chrome 38, Safari 7.1, and IE 11).
 *
 * Update: the gap no longer appears on Chrome when .mdl-spinner__layer-N's
 * opacity is 0.99, but still does on Safari and IE.
 */
.mdl-spinner__gap-patch {
  position: absolute;
  box-sizing: border-box;
  top: 0;
  left: 45%;
  width: 10%;
  height: 100%;
  overflow: hidden;
  border-color: inherit; }
  .mdl-spinner__gap-patch .mdl-spinner__circle {
    width: 1000%;
    left: -450%; }

.mdl-spinner__circle-clipper {
  display: inline-block;
  position: relative;
  width: 50%;
  height: 100%;
  overflow: hidden;
  border-color: inherit; }
  .mdl-spinner__circle-clipper.mdl-spinner__left {
    float: left; }
  .mdl-spinner__circle-clipper.mdl-spinner__right {
    float: right; }
  .mdl-spinner__circle-clipper .mdl-spinner__circle {
    width: 200%; }

.mdl-spinner__circle {
  box-sizing: border-box;
  height: 100%;
  border-width: 3px;
  border-style: solid;
  border-color: inherit;
  border-bottom-color: transparent !important;
  border-radius: 50%;
  animation: none;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0; }
  .mdl-spinner__left .mdl-spinner__circle {
    border-right-color: transparent !important;
    transform: rotate(129deg); }
    .mdl-spinner.is-active .mdl-spinner__left .mdl-spinner__circle {
      animation: mdl-spinner__left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }
  .mdl-spinner__right .mdl-spinner__circle {
    left: -100%;
    border-left-color: transparent !important;
    transform: rotate(-129deg); }
    .mdl-spinner.is-active .mdl-spinner__right .mdl-spinner__circle {
      animation: mdl-spinner__right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

@keyframes mdl-spinner__left-spin {
  from {
    transform: rotate(130deg); }

  50% {
    transform: rotate(-5deg); }

  to {
    transform: rotate(130deg); } }

@keyframes mdl-spinner__right-spin {
  from {
    transform: rotate(-130deg); }

  50% {
    transform: rotate(5deg); }

  to {
    transform: rotate(-130deg); } }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-switch {
  position: relative;
  z-index: 1;
  vertical-align: middle;
  display: inline-block;
  box-sizing: border-box;
  width: 100%;
  height: 24px;
  margin: 0;
  padding: 0;
  overflow: visible;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }
  .mdl-switch.is-upgraded {
    padding-left: 28px; }

.mdl-switch__input {
  line-height: 24px; }
  .mdl-switch.is-upgraded .mdl-switch__input {
    position: absolute;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    opacity: 0;
    -ms-appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: none; }

.mdl-switch__track {
  background: rgba(0,0,0, 0.26);
  position: absolute;
  left: 0;
  top: 5px;
  height: 14px;
  width: 36px;
  border-radius: 14px;
  cursor: pointer; }
  .mdl-switch.is-checked .mdl-switch__track {
    background: rgba($color-primary, 0.5); }
  .mdl-switch__track fieldset[disabled] .mdl-switch, .mdl-switch.is-disabled .mdl-switch__track {
    background: rgba(0,0,0, 0.12);
    cursor: auto; }

.mdl-switch__thumb {
  background: rgb(250,250,250);
  position: absolute;
  left: 0;
  top: 2px;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  transition-duration: 0.28s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: left; }
  .mdl-switch.is-checked .mdl-switch__thumb {
    background: rgb($color-primary);
    left: 16px;
    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px 8px 0 rgba(0, 0, 0, 0.12); }
  .mdl-switch__thumb fieldset[disabled] .mdl-switch, .mdl-switch.is-disabled .mdl-switch__thumb {
    background: rgb(189,189,189);
    cursor: auto; }

.mdl-switch__focus-helper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-4px, -4px);
  display: inline-block;
  box-sizing: border-box;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: transparent; }
  .mdl-switch.is-focused .mdl-switch__focus-helper {
    box-shadow: 0 0 0px 20px rgba(0, 0, 0, 0.1);
    background-color: rgba(0, 0, 0, 0.1); }
  .mdl-switch.is-focused.is-checked .mdl-switch__focus-helper {
    box-shadow: 0 0 0px 20px rgba($color-primary, 0.26);
    background-color: rgba($color-primary, 0.26); }

.mdl-switch__label {
  position: relative;
  cursor: pointer;
  font-size: 16px;
  line-height: 24px;
  margin: 0;
  left: 24px; }
  .mdl-switch__label fieldset[disabled] .mdl-switch, .mdl-switch.is-disabled .mdl-switch__label {
    color: rgb(189,189,189);
    cursor: auto; }

.mdl-switch__ripple-container {
  position: absolute;
  z-index: 2;
  top: -12px;
  left: -14px;
  box-sizing: border-box;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  cursor: pointer;
  overflow: hidden;
  -webkit-mask-image: -webkit-radial-gradient(circle, white, black);
  transition-duration: 0.4s;
  transition-timing-function: step-end;
  transition-property: left; }
  .mdl-switch__ripple-container .mdl-ripple {
    background: rgb($color-primary); }
  .mdl-switch__ripple-container fieldset[disabled] .mdl-switch, .mdl-switch.is-disabled .mdl-switch__ripple-container {
    cursor: auto; }
  fieldset[disabled] .mdl-switch .mdl-switch__ripple-container .mdl-ripple, .mdl-switch.is-disabled .mdl-switch__ripple-container .mdl-ripple {
    background: transparent; }
  .mdl-switch.is-checked .mdl-switch__ripple-container {
    left: 2px; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-tabs {
  display: block;
  width: 100%; }

.mdl-tabs__tab-bar {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-content: space-between;
  align-items: flex-start;
  height: 48px;
  padding: 0 0 0 0;
  margin: 0;
  border-bottom: 1px solid rgb(224,224,224); }

.mdl-tabs__tab {
  margin: 0;
  border: none;
  padding: 0 24px 0 24px;
  float: left;
  position: relative;
  display: block;
  text-decoration: none;
  height: 48px;
  line-height: 48px;
  text-align: center;
  font-weight: 500;
  font-size: 14px;
  text-transform: uppercase;
  color: rgba(0,0,0, 0.54);
  overflow: hidden; }
  .mdl-tabs.is-upgraded .mdl-tabs__tab.is-active {
    color: rgba(0,0,0, 0.87); }
  .mdl-tabs.is-upgraded .mdl-tabs__tab.is-active:after {
    height: 2px;
    width: 100%;
    display: block;
    content: " ";
    bottom: 0px;
    left: 0px;
    position: absolute;
    background: rgb($color-primary);
    animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) alternate forwards;
    transition: all 1s cubic-bezier(0.4, 0, 1, 1); }
  .mdl-tabs__tab .mdl-tabs__ripple-container {
    display: block;
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0px;
    top: 0px;
    z-index: 1;
    overflow: hidden; }
    .mdl-tabs__tab .mdl-tabs__ripple-container .mdl-ripple {
      background: rgb($color-primary); }

.mdl-tabs__panel {
  display: block; }
  .mdl-tabs.is-upgraded .mdl-tabs__panel {
    display: none; }
  .mdl-tabs.is-upgraded .mdl-tabs__panel.is-active {
    display: block; }

@keyframes border-expand {
  0% {
    opacity: 0;
    width: 0; }

  100% {
    opacity: 1;
    width: 100%; } }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-textfield {
  position: relative;
  font-size: 16px;
  display: inline-block;
  box-sizing: border-box;
  width: 300px;
  max-width: 100%;
  margin: 0;
  padding: 20px 0; }
  .mdl-textfield .mdl-button {
    position: absolute;
    bottom: 20px; }

.mdl-textfield--align-right {
  text-align: right; }

.mdl-textfield--full-width {
  width: 100%; }

.mdl-textfield--expandable {
  min-width: 32px;
  width: auto;
  min-height: 32px; }
  .mdl-textfield--expandable .mdl-button--icon {
    top: 16px; }

.mdl-textfield__input {
  border: none;
  border-bottom: 1px solid rgba(0,0,0, 0.12);
  display: block;
  font-size: 16px;
  font-family: 'Helvetica', 'Arial', sans-serif;
  margin: 0;
  padding: 4px 0;
  width: 100%;
  background: none;
  text-align: left;
  color: inherit; }
  .mdl-textfield__input[type="number"] {
    -moz-appearance: textfield; }
  .mdl-textfield__input[type="number"]::-webkit-inner-spin-button, .mdl-textfield__input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0; }
  .mdl-textfield.is-focused .mdl-textfield__input {
    outline: none; }
  .mdl-textfield.is-invalid .mdl-textfield__input {
    border-color: rgb(213,0,0);
    box-shadow: none; }
  fieldset[disabled] .mdl-textfield .mdl-textfield__input, .mdl-textfield.is-disabled .mdl-textfield__input {
    background-color: transparent;
    border-bottom: 1px dotted rgba(0,0,0, 0.12);
    color: rgba(0,0,0, 0.26); }

.mdl-textfield textarea.mdl-textfield__input {
  display: block; }

.mdl-textfield__label {
  bottom: 0;
  color: rgba(0,0,0, 0.26);
  font-size: 16px;
  left: 0;
  right: 0;
  pointer-events: none;
  position: absolute;
  display: block;
  top: 24px;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-align: left; }
  .mdl-textfield.is-dirty .mdl-textfield__label, .mdl-textfield.has-placeholder .mdl-textfield__label {
    visibility: hidden; }
  .mdl-textfield--floating-label .mdl-textfield__label {
    transition-duration: 0.2s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
  .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
    transition: none; }
  fieldset[disabled] .mdl-textfield .mdl-textfield__label, .mdl-textfield.is-disabled.is-disabled .mdl-textfield__label {
    color: rgba(0,0,0, 0.26); }
  .mdl-textfield--floating-label.is-focused .mdl-textfield__label, .mdl-textfield--floating-label.is-dirty .mdl-textfield__label, .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
    color: rgb($color-primary);
    font-size: 12px;
    top: 4px;
    visibility: visible; }
  .mdl-textfield--floating-label.is-focused .mdl-textfield__expandable-holder .mdl-textfield__label, .mdl-textfield--floating-label.is-dirty .mdl-textfield__expandable-holder .mdl-textfield__label, .mdl-textfield--floating-label.has-placeholder .mdl-textfield__expandable-holder .mdl-textfield__label {
    top: -16px; }
  .mdl-textfield--floating-label.is-invalid .mdl-textfield__label {
    color: rgb(213,0,0);
    font-size: 12px; }
  .mdl-textfield__label:after {
    background-color: rgb($color-primary);
    bottom: 20px;
    content: '';
    height: 2px;
    left: 45%;
    position: absolute;
    transition-duration: 0.2s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    visibility: hidden;
    width: 10px; }
  .mdl-textfield.is-focused .mdl-textfield__label:after {
    left: 0;
    visibility: visible;
    width: 100%; }
  .mdl-textfield.is-invalid .mdl-textfield__label:after {
    background-color: rgb(213,0,0); }

.mdl-textfield__error {
  color: rgb(213,0,0);
  position: absolute;
  font-size: 12px;
  margin-top: 3px;
  visibility: hidden;
  display: block; }
  .mdl-textfield.is-invalid .mdl-textfield__error {
    visibility: visible; }

.mdl-textfield__expandable-holder {
  display: inline-block;
  position: relative;
  margin-left: 32px;
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  display: inline-block;
  max-width: 0.1px; }
  .mdl-textfield.is-focused .mdl-textfield__expandable-holder, .mdl-textfield.is-dirty .mdl-textfield__expandable-holder {
    max-width: 600px; }
  .mdl-textfield__expandable-holder .mdl-textfield__label:after {
    bottom: 0; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-tooltip {
  transform: scale(0);
  transform-origin: top center;
  z-index: 999;
  background: rgba(97,97,97, 0.9);
  border-radius: 2px;
  color: rgb(255,255,255);
  display: inline-block;
  font-size: 10px;
  font-weight: 500;
  line-height: 14px;
  max-width: 170px;
  position: fixed;
  top: -500px;
  left: -500px;
  padding: 8px;
  text-align: center; }

.mdl-tooltip.is-active {
  animation: pulse 200ms cubic-bezier(0, 0, 0.2, 1) forwards; }

.mdl-tooltip--large {
  line-height: 14px;
  font-size: 14px;
  padding: 16px; }

@keyframes pulse {
  0% {
    transform: scale(0);
    opacity: 0; }

  50% {
    transform: scale(0.99); }

  100% {
    transform: scale(1);
    opacity: 1;
    visibility: visible; } }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-shadow--2dp {
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }

.mdl-shadow--3dp {
  box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px 8px 0 rgba(0, 0, 0, 0.12); }

.mdl-shadow--4dp {
  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2); }

.mdl-shadow--6dp {
  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2); }

.mdl-shadow--8dp {
  box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); }

.mdl-shadow--16dp {
  box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2); }

.mdl-shadow--24dp {
  box-shadow: 0 9px 46px 8px rgba(0, 0, 0, 0.14), 0 11px 15px -7px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.2); }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/*
 * NOTE: Some rules here are applied using duplicate selectors.
 * This is on purpose to increase their specificity when applied.
 * For example: `.mdl-cell--1-col-phone.mdl-cell--1-col-phone`
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-grid {
  display: flex;
  flex-flow: row wrap;
  margin: 0 auto 0 auto;
  align-items: stretch; }
  .mdl-grid.mdl-grid--no-spacing {
    padding: 0; }

.mdl-cell {
  box-sizing: border-box; }

.mdl-cell--top {
  align-self: flex-start; }

.mdl-cell--middle {
  align-self: center; }

.mdl-cell--bottom {
  align-self: flex-end; }

.mdl-cell--stretch {
  align-self: stretch; }

.mdl-grid.mdl-grid--no-spacing > .mdl-cell {
  margin: 0; }

.mdl-cell--order-1 {
  order: 1; }

.mdl-cell--order-2 {
  order: 2; }

.mdl-cell--order-3 {
  order: 3; }

.mdl-cell--order-4 {
  order: 4; }

.mdl-cell--order-5 {
  order: 5; }

.mdl-cell--order-6 {
  order: 6; }

.mdl-cell--order-7 {
  order: 7; }

.mdl-cell--order-8 {
  order: 8; }

.mdl-cell--order-9 {
  order: 9; }

.mdl-cell--order-10 {
  order: 10; }

.mdl-cell--order-11 {
  order: 11; }

.mdl-cell--order-12 {
  order: 12; }

@media (max-width: 479px) {
  .mdl-grid {
    padding: 8px; }
    .mdl-cell {
      margin: 8px;
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell {
        width: 100%; }
    .mdl-cell--hide-phone {
      display: none !important; }
    .mdl-cell--order-1-phone.mdl-cell--order-1-phone {
      order: 1; }
    .mdl-cell--order-2-phone.mdl-cell--order-2-phone {
      order: 2; }
    .mdl-cell--order-3-phone.mdl-cell--order-3-phone {
      order: 3; }
    .mdl-cell--order-4-phone.mdl-cell--order-4-phone {
      order: 4; }
    .mdl-cell--order-5-phone.mdl-cell--order-5-phone {
      order: 5; }
    .mdl-cell--order-6-phone.mdl-cell--order-6-phone {
      order: 6; }
    .mdl-cell--order-7-phone.mdl-cell--order-7-phone {
      order: 7; }
    .mdl-cell--order-8-phone.mdl-cell--order-8-phone {
      order: 8; }
    .mdl-cell--order-9-phone.mdl-cell--order-9-phone {
      order: 9; }
    .mdl-cell--order-10-phone.mdl-cell--order-10-phone {
      order: 10; }
    .mdl-cell--order-11-phone.mdl-cell--order-11-phone {
      order: 11; }
    .mdl-cell--order-12-phone.mdl-cell--order-12-phone {
      order: 12; }
    .mdl-cell--1-col, .mdl-cell--1-col-phone.mdl-cell--1-col-phone {
      width: calc(25% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing > .mdl-cell--1-col-phone.mdl-cell--1-col-phone {
        width: 25%; }
    .mdl-cell--2-col, .mdl-cell--2-col-phone.mdl-cell--2-col-phone {
      width: calc(50% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing > .mdl-cell--2-col-phone.mdl-cell--2-col-phone {
        width: 50%; }
    .mdl-cell--3-col, .mdl-cell--3-col-phone.mdl-cell--3-col-phone {
      width: calc(75% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing > .mdl-cell--3-col-phone.mdl-cell--3-col-phone {
        width: 75%; }
    .mdl-cell--4-col, .mdl-cell--4-col-phone.mdl-cell--4-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing > .mdl-cell--4-col-phone.mdl-cell--4-col-phone {
        width: 100%; }
    .mdl-cell--5-col, .mdl-cell--5-col-phone.mdl-cell--5-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing > .mdl-cell--5-col-phone.mdl-cell--5-col-phone {
        width: 100%; }
    .mdl-cell--6-col, .mdl-cell--6-col-phone.mdl-cell--6-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing > .mdl-cell--6-col-phone.mdl-cell--6-col-phone {
        width: 100%; }
    .mdl-cell--7-col, .mdl-cell--7-col-phone.mdl-cell--7-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing > .mdl-cell--7-col-phone.mdl-cell--7-col-phone {
        width: 100%; }
    .mdl-cell--8-col, .mdl-cell--8-col-phone.mdl-cell--8-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing > .mdl-cell--8-col-phone.mdl-cell--8-col-phone {
        width: 100%; }
    .mdl-cell--9-col, .mdl-cell--9-col-phone.mdl-cell--9-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing > .mdl-cell--9-col-phone.mdl-cell--9-col-phone {
        width: 100%; }
    .mdl-cell--10-col, .mdl-cell--10-col-phone.mdl-cell--10-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing > .mdl-cell--10-col-phone.mdl-cell--10-col-phone {
        width: 100%; }
    .mdl-cell--11-col, .mdl-cell--11-col-phone.mdl-cell--11-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing > .mdl-cell--11-col-phone.mdl-cell--11-col-phone {
        width: 100%; }
    .mdl-cell--12-col, .mdl-cell--12-col-phone.mdl-cell--12-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing > .mdl-cell--12-col-phone.mdl-cell--12-col-phone {
        width: 100%; }
    .mdl-cell--1-offset, .mdl-cell--1-offset-phone.mdl-cell--1-offset-phone {
      margin-left: calc(25% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset-phone.mdl-cell--1-offset-phone {
        margin-left: 25%; }
    .mdl-cell--2-offset, .mdl-cell--2-offset-phone.mdl-cell--2-offset-phone {
      margin-left: calc(50% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset-phone.mdl-cell--2-offset-phone {
        margin-left: 50%; }
    .mdl-cell--3-offset, .mdl-cell--3-offset-phone.mdl-cell--3-offset-phone {
      margin-left: calc(75% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset-phone.mdl-cell--3-offset-phone {
        margin-left: 75%; } }

@media (min-width: 480px) and (max-width: 839px) {
  .mdl-grid {
    padding: 8px; }
    .mdl-cell {
      margin: 8px;
      width: calc(50% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell {
        width: 50%; }
    .mdl-cell--hide-tablet {
      display: none !important; }
    .mdl-cell--order-1-tablet.mdl-cell--order-1-tablet {
      order: 1; }
    .mdl-cell--order-2-tablet.mdl-cell--order-2-tablet {
      order: 2; }
    .mdl-cell--order-3-tablet.mdl-cell--order-3-tablet {
      order: 3; }
    .mdl-cell--order-4-tablet.mdl-cell--order-4-tablet {
      order: 4; }
    .mdl-cell--order-5-tablet.mdl-cell--order-5-tablet {
      order: 5; }
    .mdl-cell--order-6-tablet.mdl-cell--order-6-tablet {
      order: 6; }
    .mdl-cell--order-7-tablet.mdl-cell--order-7-tablet {
      order: 7; }
    .mdl-cell--order-8-tablet.mdl-cell--order-8-tablet {
      order: 8; }
    .mdl-cell--order-9-tablet.mdl-cell--order-9-tablet {
      order: 9; }
    .mdl-cell--order-10-tablet.mdl-cell--order-10-tablet {
      order: 10; }
    .mdl-cell--order-11-tablet.mdl-cell--order-11-tablet {
      order: 11; }
    .mdl-cell--order-12-tablet.mdl-cell--order-12-tablet {
      order: 12; }
    .mdl-cell--1-col, .mdl-cell--1-col-tablet.mdl-cell--1-col-tablet {
      width: calc(12.5% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing > .mdl-cell--1-col-tablet.mdl-cell--1-col-tablet {
        width: 12.5%; }
    .mdl-cell--2-col, .mdl-cell--2-col-tablet.mdl-cell--2-col-tablet {
      width: calc(25% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing > .mdl-cell--2-col-tablet.mdl-cell--2-col-tablet {
        width: 25%; }
    .mdl-cell--3-col, .mdl-cell--3-col-tablet.mdl-cell--3-col-tablet {
      width: calc(37.5% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing > .mdl-cell--3-col-tablet.mdl-cell--3-col-tablet {
        width: 37.5%; }
    .mdl-cell--4-col, .mdl-cell--4-col-tablet.mdl-cell--4-col-tablet {
      width: calc(50% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing > .mdl-cell--4-col-tablet.mdl-cell--4-col-tablet {
        width: 50%; }
    .mdl-cell--5-col, .mdl-cell--5-col-tablet.mdl-cell--5-col-tablet {
      width: calc(62.5% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing > .mdl-cell--5-col-tablet.mdl-cell--5-col-tablet {
        width: 62.5%; }
    .mdl-cell--6-col, .mdl-cell--6-col-tablet.mdl-cell--6-col-tablet {
      width: calc(75% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing > .mdl-cell--6-col-tablet.mdl-cell--6-col-tablet {
        width: 75%; }
    .mdl-cell--7-col, .mdl-cell--7-col-tablet.mdl-cell--7-col-tablet {
      width: calc(87.5% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing > .mdl-cell--7-col-tablet.mdl-cell--7-col-tablet {
        width: 87.5%; }
    .mdl-cell--8-col, .mdl-cell--8-col-tablet.mdl-cell--8-col-tablet {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing > .mdl-cell--8-col-tablet.mdl-cell--8-col-tablet {
        width: 100%; }
    .mdl-cell--9-col, .mdl-cell--9-col-tablet.mdl-cell--9-col-tablet {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing > .mdl-cell--9-col-tablet.mdl-cell--9-col-tablet {
        width: 100%; }
    .mdl-cell--10-col, .mdl-cell--10-col-tablet.mdl-cell--10-col-tablet {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing > .mdl-cell--10-col-tablet.mdl-cell--10-col-tablet {
        width: 100%; }
    .mdl-cell--11-col, .mdl-cell--11-col-tablet.mdl-cell--11-col-tablet {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing > .mdl-cell--11-col-tablet.mdl-cell--11-col-tablet {
        width: 100%; }
    .mdl-cell--12-col, .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing > .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
        width: 100%; }
    .mdl-cell--1-offset, .mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet {
      margin-left: calc(12.5% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet {
        margin-left: 12.5%; }
    .mdl-cell--2-offset, .mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet {
      margin-left: calc(25% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet {
        margin-left: 25%; }
    .mdl-cell--3-offset, .mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet {
      margin-left: calc(37.5% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet {
        margin-left: 37.5%; }
    .mdl-cell--4-offset, .mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet {
      margin-left: calc(50% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet {
        margin-left: 50%; }
    .mdl-cell--5-offset, .mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet {
      margin-left: calc(62.5% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet {
        margin-left: 62.5%; }
    .mdl-cell--6-offset, .mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet {
      margin-left: calc(75% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet {
        margin-left: 75%; }
    .mdl-cell--7-offset, .mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet {
      margin-left: calc(87.5% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet {
        margin-left: 87.5%; } }

@media (min-width: 840px) {
  .mdl-grid {
    padding: 8px; }
    .mdl-cell {
      margin: 8px;
      width: calc(33.3333333333% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell {
        width: 33.3333333333%; }
    .mdl-cell--hide-desktop {
      display: none !important; }
    .mdl-cell--order-1-desktop.mdl-cell--order-1-desktop {
      order: 1; }
    .mdl-cell--order-2-desktop.mdl-cell--order-2-desktop {
      order: 2; }
    .mdl-cell--order-3-desktop.mdl-cell--order-3-desktop {
      order: 3; }
    .mdl-cell--order-4-desktop.mdl-cell--order-4-desktop {
      order: 4; }
    .mdl-cell--order-5-desktop.mdl-cell--order-5-desktop {
      order: 5; }
    .mdl-cell--order-6-desktop.mdl-cell--order-6-desktop {
      order: 6; }
    .mdl-cell--order-7-desktop.mdl-cell--order-7-desktop {
      order: 7; }
    .mdl-cell--order-8-desktop.mdl-cell--order-8-desktop {
      order: 8; }
    .mdl-cell--order-9-desktop.mdl-cell--order-9-desktop {
      order: 9; }
    .mdl-cell--order-10-desktop.mdl-cell--order-10-desktop {
      order: 10; }
    .mdl-cell--order-11-desktop.mdl-cell--order-11-desktop {
      order: 11; }
    .mdl-cell--order-12-desktop.mdl-cell--order-12-desktop {
      order: 12; }
    .mdl-cell--1-col, .mdl-cell--1-col-desktop.mdl-cell--1-col-desktop {
      width: calc(8.3333333333% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing > .mdl-cell--1-col-desktop.mdl-cell--1-col-desktop {
        width: 8.3333333333%; }
    .mdl-cell--2-col, .mdl-cell--2-col-desktop.mdl-cell--2-col-desktop {
      width: calc(16.6666666667% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing > .mdl-cell--2-col-desktop.mdl-cell--2-col-desktop {
        width: 16.6666666667%; }
    .mdl-cell--3-col, .mdl-cell--3-col-desktop.mdl-cell--3-col-desktop {
      width: calc(25% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing > .mdl-cell--3-col-desktop.mdl-cell--3-col-desktop {
        width: 25%; }
    .mdl-cell--4-col, .mdl-cell--4-col-desktop.mdl-cell--4-col-desktop {
      width: calc(33.3333333333% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing > .mdl-cell--4-col-desktop.mdl-cell--4-col-desktop {
        width: 33.3333333333%; }
    .mdl-cell--5-col, .mdl-cell--5-col-desktop.mdl-cell--5-col-desktop {
      width: calc(41.6666666667% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing > .mdl-cell--5-col-desktop.mdl-cell--5-col-desktop {
        width: 41.6666666667%; }
    .mdl-cell--6-col, .mdl-cell--6-col-desktop.mdl-cell--6-col-desktop {
      width: calc(50% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing > .mdl-cell--6-col-desktop.mdl-cell--6-col-desktop {
        width: 50%; }
    .mdl-cell--7-col, .mdl-cell--7-col-desktop.mdl-cell--7-col-desktop {
      width: calc(58.3333333333% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing > .mdl-cell--7-col-desktop.mdl-cell--7-col-desktop {
        width: 58.3333333333%; }
    .mdl-cell--8-col, .mdl-cell--8-col-desktop.mdl-cell--8-col-desktop {
      width: calc(66.6666666667% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing > .mdl-cell--8-col-desktop.mdl-cell--8-col-desktop {
        width: 66.6666666667%; }
    .mdl-cell--9-col, .mdl-cell--9-col-desktop.mdl-cell--9-col-desktop {
      width: calc(75% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing > .mdl-cell--9-col-desktop.mdl-cell--9-col-desktop {
        width: 75%; }
    .mdl-cell--10-col, .mdl-cell--10-col-desktop.mdl-cell--10-col-desktop {
      width: calc(83.3333333333% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing > .mdl-cell--10-col-desktop.mdl-cell--10-col-desktop {
        width: 83.3333333333%; }
    .mdl-cell--11-col, .mdl-cell--11-col-desktop.mdl-cell--11-col-desktop {
      width: calc(91.6666666667% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing > .mdl-cell--11-col-desktop.mdl-cell--11-col-desktop {
        width: 91.6666666667%; }
    .mdl-cell--12-col, .mdl-cell--12-col-desktop.mdl-cell--12-col-desktop {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing > .mdl-cell--12-col-desktop.mdl-cell--12-col-desktop {
        width: 100%; }
    .mdl-cell--1-offset, .mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop {
      margin-left: calc(8.3333333333% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop {
        margin-left: 8.3333333333%; }
    .mdl-cell--2-offset, .mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop {
      margin-left: calc(16.6666666667% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop {
        margin-left: 16.6666666667%; }
    .mdl-cell--3-offset, .mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop {
      margin-left: calc(25% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop {
        margin-left: 25%; }
    .mdl-cell--4-offset, .mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop {
      margin-left: calc(33.3333333333% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop {
        margin-left: 33.3333333333%; }
    .mdl-cell--5-offset, .mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop {
      margin-left: calc(41.6666666667% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop {
        margin-left: 41.6666666667%; }
    .mdl-cell--6-offset, .mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop {
      margin-left: calc(50% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop {
        margin-left: 50%; }
    .mdl-cell--7-offset, .mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop {
      margin-left: calc(58.3333333333% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop {
        margin-left: 58.3333333333%; }
    .mdl-cell--8-offset, .mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop {
      margin-left: calc(66.6666666667% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--8-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop {
        margin-left: 66.6666666667%; }
    .mdl-cell--9-offset, .mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop {
      margin-left: calc(75% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--9-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop {
        margin-left: 75%; }
    .mdl-cell--10-offset, .mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop {
      margin-left: calc(83.3333333333% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--10-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop {
        margin-left: 83.3333333333%; }
    .mdl-cell--11-offset, .mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop {
      margin-left: calc(91.6666666667% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--11-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop {
        margin-left: 91.6666666667%; } }

body {
  margin: 0px; }

.styleguide-demo h1 {
  margin: 48px 24px 0 24px; }

.styleguide-demo h1:after {
  content: '';
  display: block;
  width: 100%;
  border-bottom: 1px solid rgba(0, 0, 0, 0.5);
  margin-top: 24px; }

.styleguide-demo {
  opacity: 0;
  transition: opacity 0.6s ease; }

.styleguide-masthead {
  height: 256px;
  background: rgb(33,33,33);
  padding: 115px 16px 0; }

.styleguide-container {
  position: relative;
  max-width: 960px;
  width: 100%; }

.styleguide-title {
  color: #fff;
  bottom: auto;
  position: relative;
  font-size: 56px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.02em; }
  .styleguide-title:after {
    border-bottom: 0px; }
  .styleguide-title span {
    font-weight: 300; }

.mdl-styleguide .mdl-layout__drawer .mdl-navigation__link {
  padding: 10px 24px; }

.demosLoaded .styleguide-demo {
  opacity: 1; }

iframe {
  display: block;
  width: 100%;
  border: none; }

iframe.heightSet {
  overflow: hidden; }

.demo-wrapper {
  margin: 24px; }
  .demo-wrapper iframe {
    border: 1px solid rgba(0, 0, 0, 0.5); }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Material Design Lite */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */
/* ==========================================================================
 Base styles: opinionated defaults
 ========================================================================== */
html {
  color: rgba(0,0,0, 0.87);
  font-size: 1em;
  line-height: 1.4; }
/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */
::selection {
  background: #b3d4fc;
  text-shadow: none; }
/*
 * A better looking default horizontal rule
 */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0; }
/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */
audio, canvas, iframe, img, svg, video {
  vertical-align: middle; }
/*
 * Remove default fieldset styles.
 */
fieldset {
  border: 0;
  margin: 0;
  padding: 0; }
/*
 * Allow only vertical resizing of textareas.
 */
textarea {
  resize: vertical; }
/* ==========================================================================
 Browser Upgrade Prompt
 ========================================================================== */
.browserupgrade {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0; }
/* ==========================================================================
 Author's custom styles
 ========================================================================== */
/* ==========================================================================
 Helper classes
 ========================================================================== */
/*
 * Hide visually and from screen readers:
 */
.hidden {
  display: none !important; }
/*
 * Hide only visually, but have it available for screen readers:
 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */
.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px; }
/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto; }
/*
 * Hide visually and from screen readers, but maintain layout
 */
.invisible {
  visibility: hidden; }
/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.clearfix:before, .clearfix:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */ }

.clearfix:after {
  clear: both; }
/* ==========================================================================
 EXAMPLE Media Queries for Responsive Design.
 These examples override the primary ('mobile first') styles.
 Modify as content requires.
 ========================================================================== */
@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */ }

@media print, (min-resolution: 1.25dppx), (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */ }
/* ==========================================================================
 Print styles.
 Inlined to avoid the additional HTTP request:
 http://www.phpied.com/delay-loading-your-print-css/
 ========================================================================== */
@media print {
  /*
   * Don't show links that are fragment identifiers,
   * or use the `javascript:` pseudo protocol
   */
  /*
   * Printing Tables:
   * http://css-discuss.incutio.com/wiki/Printing_Tables
   */
    *, *:before, *:after, *:first-letter {
      background: transparent !important;
      color: #000 !important;
      /* Black prints faster: http://www.sanbeiji.com/archives/953 */
      box-shadow: none !important; }
    a, a:visited {
      text-decoration: underline; }
    a[href]:after {
      content: " (" attr(href) ")"; }
    abbr[title]:after {
      content: " (" attr(title) ")"; }
    a[href^="#"]:after, a[href^="javascript:"]:after {
      content: ""; }
    pre, blockquote {
      border: 1px solid #999;
      page-break-inside: avoid; }
    thead {
      display: table-header-group; }
    tr, img {
      page-break-inside: avoid; }
    img {
      max-width: 100% !important; }
    p, h2, h3 {
      orphans: 3;
      widows: 3; }
    h2, h3 {
      page-break-after: avoid; } }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/* Remove the unwanted box around FAB buttons */
/* More info: http://goo.gl/IPwKi */
a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu, .mdl-icon-toggle, .mdl-item, .mdl-radio, .mdl-slider, .mdl-switch, .mdl-tabs__tab {
  -webkit-tap-highlight-color: transparent;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0); }
/*
 * Make html take up the entire screen
 * Then set touch-action to avoid touch delay on mobile IE
 */
html {
  width: 100%;
  height: 100%;
  -ms-touch-action: manipulation;
  touch-action: manipulation; }
/*
 * Make body take up the entire screen
 * Remove body margin so layout containers don't cause extra overflow.
 */
body {
  width: 100%;
  min-height: 100%;
  margin: 0; }
/*
 * Main display reset for IE support.
 * Source: http://weblog.west-wind.com/posts/2015/Jan/12/main-HTML5-Tag-not-working-in-Internet-Explorer-91011
 */
main {
  display: block; }
/*
 * Apply no display to elements with the hidden attribute.
 * IE 9 and 10 support.
 */
*[hidden] {
  display: none !important; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
html, body {
  font-family: 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px; }

h1, h2, h3, h4, h5, h6, p {
  margin: 0;
  padding: 0; }
/**
 * Styles for HTML elements
 */
h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 56px;
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: -0.02em;
  opacity: 0.54;
  font-size: 0.6em; }

h1 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 56px;
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: -0.02em;
  margin-top: 24px;
  margin-bottom: 24px; }

h2 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 45px;
  font-weight: 400;
  line-height: 48px;
  margin-top: 24px;
  margin-bottom: 24px; }

h3 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 34px;
  font-weight: 400;
  line-height: 40px;
  margin-top: 24px;
  margin-bottom: 24px; }

h4 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 32px;
  -moz-osx-font-smoothing: grayscale;
  margin-top: 24px;
  margin-bottom: 16px; }

h5 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.02em;
  margin-top: 24px;
  margin-bottom: 16px; }

h6 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0.04em;
  margin-top: 24px;
  margin-bottom: 16px; }

p {
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0;
  margin-bottom: 16px; }

a {
  color: rgb($color-accent);
  font-weight: 500; }

blockquote {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  position: relative;
  font-size: 24px;
  font-weight: 300;
  font-style: italic;
  line-height: 1.35;
  letter-spacing: 0.08em; }
  blockquote:before {
    position: absolute;
    left: -0.5em;
    content: '“'; }
  blockquote:after {
    content: '”';
    margin-left: -0.05em; }

mark {
  background-color: #f4ff81; }

dt {
  font-weight: 700; }

address {
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  font-style: normal; }

ul, ol {
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0; }
/**
 * Class Name Styles
 */
.mdl-typography--display-4 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 112px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.04em; }

.mdl-typography--display-4-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 112px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.04em;
  opacity: 0.54; }

.mdl-typography--display-3 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 56px;
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: -0.02em; }

.mdl-typography--display-3-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 56px;
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: -0.02em;
  opacity: 0.54; }

.mdl-typography--display-2 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 45px;
  font-weight: 400;
  line-height: 48px; }

.mdl-typography--display-2-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 45px;
  font-weight: 400;
  line-height: 48px;
  opacity: 0.54; }

.mdl-typography--display-1 {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 34px;
  font-weight: 400;
  line-height: 40px; }

.mdl-typography--display-1-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 34px;
  font-weight: 400;
  line-height: 40px;
  opacity: 0.54; }

.mdl-typography--headline {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 32px;
  -moz-osx-font-smoothing: grayscale; }

.mdl-typography--headline-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 32px;
  -moz-osx-font-smoothing: grayscale;
  opacity: 0.87; }

.mdl-typography--title {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.02em; }

.mdl-typography--title-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.02em;
  opacity: 0.87; }

.mdl-typography--subhead {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0.04em; }

.mdl-typography--subhead-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0.04em;
  opacity: 0.87; }

.mdl-typography--body-2 {
  font-size: 14px;
  font-weight: bold;
  line-height: 24px;
  letter-spacing: 0; }

.mdl-typography--body-2-color-contrast {
  font-size: 14px;
  font-weight: bold;
  line-height: 24px;
  letter-spacing: 0;
  opacity: 0.87; }

.mdl-typography--body-1 {
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0; }

.mdl-typography--body-1-color-contrast {
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0;
  opacity: 0.87; }

.mdl-typography--body-2-force-preferred-font {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: 0; }

.mdl-typography--body-2-force-preferred-font-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: 0;
  opacity: 0.87; }

.mdl-typography--body-1-force-preferred-font {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0; }

.mdl-typography--body-1-force-preferred-font-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0;
  opacity: 0.87; }

.mdl-typography--caption {
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0; }

.mdl-typography--caption-force-preferred-font {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0; }

.mdl-typography--caption-color-contrast {
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  opacity: 0.54; }

.mdl-typography--caption-force-preferred-font-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  opacity: 0.54; }

.mdl-typography--menu {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0; }

.mdl-typography--menu-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0;
  opacity: 0.87; }

.mdl-typography--button {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  line-height: 1;
  letter-spacing: 0; }

.mdl-typography--button-color-contrast {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  line-height: 1;
  letter-spacing: 0;
  opacity: 0.87; }

.mdl-typography--text-left {
  text-align: left; }

.mdl-typography--text-right {
  text-align: right; }

.mdl-typography--text-center {
  text-align: center; }

.mdl-typography--text-justify {
  text-align: justify; }

.mdl-typography--text-nowrap {
  white-space: nowrap; }

.mdl-typography--text-lowercase {
  text-transform: lowercase; }

.mdl-typography--text-uppercase {
  text-transform: uppercase; }

.mdl-typography--text-capitalize {
  text-transform: capitalize; }

.mdl-typography--font-thin {
  font-weight: 200 !important; }

.mdl-typography--font-light {
  font-weight: 300 !important; }

.mdl-typography--font-regular {
  font-weight: 400 !important; }

.mdl-typography--font-medium {
  font-weight: 500 !important; }

.mdl-typography--font-bold {
  font-weight: 700 !important; }

.mdl-typography--font-black {
  font-weight: 900 !important; }

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  word-wrap: normal;
  font-feature-settings: 'liga';
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-color-text--red {
  color: rgb(244,67,54) !important; }

.mdl-color--red {
  background-color: rgb(244,67,54) !important; }

.mdl-color-text--red-50 {
  color: rgb(255,235,238) !important; }

.mdl-color--red-50 {
  background-color: rgb(255,235,238) !important; }

.mdl-color-text--red-100 {
  color: rgb(255,205,210) !important; }

.mdl-color--red-100 {
  background-color: rgb(255,205,210) !important; }

.mdl-color-text--red-200 {
  color: rgb(239,154,154) !important; }

.mdl-color--red-200 {
  background-color: rgb(239,154,154) !important; }

.mdl-color-text--red-300 {
  color: rgb(229,115,115) !important; }

.mdl-color--red-300 {
  background-color: rgb(229,115,115) !important; }

.mdl-color-text--red-400 {
  color: rgb(239,83,80) !important; }

.mdl-color--red-400 {
  background-color: rgb(239,83,80) !important; }

.mdl-color-text--red-500 {
  color: rgb(244,67,54) !important; }

.mdl-color--red-500 {
  background-color: rgb(244,67,54) !important; }

.mdl-color-text--red-600 {
  color: rgb(229,57,53) !important; }

.mdl-color--red-600 {
  background-color: rgb(229,57,53) !important; }

.mdl-color-text--red-700 {
  color: rgb(211,47,47) !important; }

.mdl-color--red-700 {
  background-color: rgb(211,47,47) !important; }

.mdl-color-text--red-800 {
  color: rgb(198,40,40) !important; }

.mdl-color--red-800 {
  background-color: rgb(198,40,40) !important; }

.mdl-color-text--red-900 {
  color: rgb(183,28,28) !important; }

.mdl-color--red-900 {
  background-color: rgb(183,28,28) !important; }

.mdl-color-text--red-A100 {
  color: rgb(255,138,128) !important; }

.mdl-color--red-A100 {
  background-color: rgb(255,138,128) !important; }

.mdl-color-text--red-A200 {
  color: rgb(255,82,82) !important; }

.mdl-color--red-A200 {
  background-color: rgb(255,82,82) !important; }

.mdl-color-text--red-A400 {
  color: rgb(255,23,68) !important; }

.mdl-color--red-A400 {
  background-color: rgb(255,23,68) !important; }

.mdl-color-text--red-A700 {
  color: rgb(213,0,0) !important; }

.mdl-color--red-A700 {
  background-color: rgb(213,0,0) !important; }

.mdl-color-text--pink {
  color: rgb(233,30,99) !important; }

.mdl-color--pink {
  background-color: rgb(233,30,99) !important; }

.mdl-color-text--pink-50 {
  color: rgb(252,228,236) !important; }

.mdl-color--pink-50 {
  background-color: rgb(252,228,236) !important; }

.mdl-color-text--pink-100 {
  color: rgb(248,187,208) !important; }

.mdl-color--pink-100 {
  background-color: rgb(248,187,208) !important; }

.mdl-color-text--pink-200 {
  color: rgb(244,143,177) !important; }

.mdl-color--pink-200 {
  background-color: rgb(244,143,177) !important; }

.mdl-color-text--pink-300 {
  color: rgb(240,98,146) !important; }

.mdl-color--pink-300 {
  background-color: rgb(240,98,146) !important; }

.mdl-color-text--pink-400 {
  color: rgb(236,64,122) !important; }

.mdl-color--pink-400 {
  background-color: rgb(236,64,122) !important; }

.mdl-color-text--pink-500 {
  color: rgb(233,30,99) !important; }

.mdl-color--pink-500 {
  background-color: rgb(233,30,99) !important; }

.mdl-color-text--pink-600 {
  color: rgb(216,27,96) !important; }

.mdl-color--pink-600 {
  background-color: rgb(216,27,96) !important; }

.mdl-color-text--pink-700 {
  color: rgb(194,24,91) !important; }

.mdl-color--pink-700 {
  background-color: rgb(194,24,91) !important; }

.mdl-color-text--pink-800 {
  color: rgb(173,20,87) !important; }

.mdl-color--pink-800 {
  background-color: rgb(173,20,87) !important; }

.mdl-color-text--pink-900 {
  color: rgb(136,14,79) !important; }

.mdl-color--pink-900 {
  background-color: rgb(136,14,79) !important; }

.mdl-color-text--pink-A100 {
  color: rgb(255,128,171) !important; }

.mdl-color--pink-A100 {
  background-color: rgb(255,128,171) !important; }

.mdl-color-text--pink-A200 {
  color: rgb(255,64,129) !important; }

.mdl-color--pink-A200 {
  background-color: rgb(255,64,129) !important; }

.mdl-color-text--pink-A400 {
  color: rgb(245,0,87) !important; }

.mdl-color--pink-A400 {
  background-color: rgb(245,0,87) !important; }

.mdl-color-text--pink-A700 {
  color: rgb(197,17,98) !important; }

.mdl-color--pink-A700 {
  background-color: rgb(197,17,98) !important; }

.mdl-color-text--purple {
  color: rgb(156,39,176) !important; }

.mdl-color--purple {
  background-color: rgb(156,39,176) !important; }

.mdl-color-text--purple-50 {
  color: rgb(243,229,245) !important; }

.mdl-color--purple-50 {
  background-color: rgb(243,229,245) !important; }

.mdl-color-text--purple-100 {
  color: rgb(225,190,231) !important; }

.mdl-color--purple-100 {
  background-color: rgb(225,190,231) !important; }

.mdl-color-text--purple-200 {
  color: rgb(206,147,216) !important; }

.mdl-color--purple-200 {
  background-color: rgb(206,147,216) !important; }

.mdl-color-text--purple-300 {
  color: rgb(186,104,200) !important; }

.mdl-color--purple-300 {
  background-color: rgb(186,104,200) !important; }

.mdl-color-text--purple-400 {
  color: rgb(171,71,188) !important; }

.mdl-color--purple-400 {
  background-color: rgb(171,71,188) !important; }

.mdl-color-text--purple-500 {
  color: rgb(156,39,176) !important; }

.mdl-color--purple-500 {
  background-color: rgb(156,39,176) !important; }

.mdl-color-text--purple-600 {
  color: rgb(142,36,170) !important; }

.mdl-color--purple-600 {
  background-color: rgb(142,36,170) !important; }

.mdl-color-text--purple-700 {
  color: rgb(123,31,162) !important; }

.mdl-color--purple-700 {
  background-color: rgb(123,31,162) !important; }

.mdl-color-text--purple-800 {
  color: rgb(106,27,154) !important; }

.mdl-color--purple-800 {
  background-color: rgb(106,27,154) !important; }

.mdl-color-text--purple-900 {
  color: rgb(74,20,140) !important; }

.mdl-color--purple-900 {
  background-color: rgb(74,20,140) !important; }

.mdl-color-text--purple-A100 {
  color: rgb(234,128,252) !important; }

.mdl-color--purple-A100 {
  background-color: rgb(234,128,252) !important; }

.mdl-color-text--purple-A200 {
  color: rgb(224,64,251) !important; }

.mdl-color--purple-A200 {
  background-color: rgb(224,64,251) !important; }

.mdl-color-text--purple-A400 {
  color: rgb(213,0,249) !important; }

.mdl-color--purple-A400 {
  background-color: rgb(213,0,249) !important; }

.mdl-color-text--purple-A700 {
  color: rgb(170,0,255) !important; }

.mdl-color--purple-A700 {
  background-color: rgb(170,0,255) !important; }

.mdl-color-text--deep-purple {
  color: rgb(103,58,183) !important; }

.mdl-color--deep-purple {
  background-color: rgb(103,58,183) !important; }

.mdl-color-text--deep-purple-50 {
  color: rgb(237,231,246) !important; }

.mdl-color--deep-purple-50 {
  background-color: rgb(237,231,246) !important; }

.mdl-color-text--deep-purple-100 {
  color: rgb(209,196,233) !important; }

.mdl-color--deep-purple-100 {
  background-color: rgb(209,196,233) !important; }

.mdl-color-text--deep-purple-200 {
  color: rgb(179,157,219) !important; }

.mdl-color--deep-purple-200 {
  background-color: rgb(179,157,219) !important; }

.mdl-color-text--deep-purple-300 {
  color: rgb(149,117,205) !important; }

.mdl-color--deep-purple-300 {
  background-color: rgb(149,117,205) !important; }

.mdl-color-text--deep-purple-400 {
  color: rgb(126,87,194) !important; }

.mdl-color--deep-purple-400 {
  background-color: rgb(126,87,194) !important; }

.mdl-color-text--deep-purple-500 {
  color: rgb(103,58,183) !important; }

.mdl-color--deep-purple-500 {
  background-color: rgb(103,58,183) !important; }

.mdl-color-text--deep-purple-600 {
  color: rgb(94,53,177) !important; }

.mdl-color--deep-purple-600 {
  background-color: rgb(94,53,177) !important; }

.mdl-color-text--deep-purple-700 {
  color: rgb(81,45,168) !important; }

.mdl-color--deep-purple-700 {
  background-color: rgb(81,45,168) !important; }

.mdl-color-text--deep-purple-800 {
  color: rgb(69,39,160) !important; }

.mdl-color--deep-purple-800 {
  background-color: rgb(69,39,160) !important; }

.mdl-color-text--deep-purple-900 {
  color: rgb(49,27,146) !important; }

.mdl-color--deep-purple-900 {
  background-color: rgb(49,27,146) !important; }

.mdl-color-text--deep-purple-A100 {
  color: rgb(179,136,255) !important; }

.mdl-color--deep-purple-A100 {
  background-color: rgb(179,136,255) !important; }

.mdl-color-text--deep-purple-A200 {
  color: rgb(124,77,255) !important; }

.mdl-color--deep-purple-A200 {
  background-color: rgb(124,77,255) !important; }

.mdl-color-text--deep-purple-A400 {
  color: rgb(101,31,255) !important; }

.mdl-color--deep-purple-A400 {
  background-color: rgb(101,31,255) !important; }

.mdl-color-text--deep-purple-A700 {
  color: rgb(98,0,234) !important; }

.mdl-color--deep-purple-A700 {
  background-color: rgb(98,0,234) !important; }

.mdl-color-text--indigo {
  color: rgb(63,81,181) !important; }

.mdl-color--indigo {
  background-color: rgb(63,81,181) !important; }

.mdl-color-text--indigo-50 {
  color: rgb(232,234,246) !important; }

.mdl-color--indigo-50 {
  background-color: rgb(232,234,246) !important; }

.mdl-color-text--indigo-100 {
  color: rgb(197,202,233) !important; }

.mdl-color--indigo-100 {
  background-color: rgb(197,202,233) !important; }

.mdl-color-text--indigo-200 {
  color: rgb(159,168,218) !important; }

.mdl-color--indigo-200 {
  background-color: rgb(159,168,218) !important; }

.mdl-color-text--indigo-300 {
  color: rgb(121,134,203) !important; }

.mdl-color--indigo-300 {
  background-color: rgb(121,134,203) !important; }

.mdl-color-text--indigo-400 {
  color: rgb(92,107,192) !important; }

.mdl-color--indigo-400 {
  background-color: rgb(92,107,192) !important; }

.mdl-color-text--indigo-500 {
  color: rgb(63,81,181) !important; }

.mdl-color--indigo-500 {
  background-color: rgb(63,81,181) !important; }

.mdl-color-text--indigo-600 {
  color: rgb(57,73,171) !important; }

.mdl-color--indigo-600 {
  background-color: rgb(57,73,171) !important; }

.mdl-color-text--indigo-700 {
  color: rgb(48,63,159) !important; }

.mdl-color--indigo-700 {
  background-color: rgb(48,63,159) !important; }

.mdl-color-text--indigo-800 {
  color: rgb(40,53,147) !important; }

.mdl-color--indigo-800 {
  background-color: rgb(40,53,147) !important; }

.mdl-color-text--indigo-900 {
  color: rgb(26,35,126) !important; }

.mdl-color--indigo-900 {
  background-color: rgb(26,35,126) !important; }

.mdl-color-text--indigo-A100 {
  color: rgb(140,158,255) !important; }

.mdl-color--indigo-A100 {
  background-color: rgb(140,158,255) !important; }

.mdl-color-text--indigo-A200 {
  color: rgb(83,109,254) !important; }

.mdl-color--indigo-A200 {
  background-color: rgb(83,109,254) !important; }

.mdl-color-text--indigo-A400 {
  color: rgb(61,90,254) !important; }

.mdl-color--indigo-A400 {
  background-color: rgb(61,90,254) !important; }

.mdl-color-text--indigo-A700 {
  color: rgb(48,79,254) !important; }

.mdl-color--indigo-A700 {
  background-color: rgb(48,79,254) !important; }

.mdl-color-text--blue {
  color: rgb(33,150,243) !important; }

.mdl-color--blue {
  background-color: rgb(33,150,243) !important; }

.mdl-color-text--blue-50 {
  color: rgb(227,242,253) !important; }

.mdl-color--blue-50 {
  background-color: rgb(227,242,253) !important; }

.mdl-color-text--blue-100 {
  color: rgb(187,222,251) !important; }

.mdl-color--blue-100 {
  background-color: rgb(187,222,251) !important; }

.mdl-color-text--blue-200 {
  color: rgb(144,202,249) !important; }

.mdl-color--blue-200 {
  background-color: rgb(144,202,249) !important; }

.mdl-color-text--blue-300 {
  color: rgb(100,181,246) !important; }

.mdl-color--blue-300 {
  background-color: rgb(100,181,246) !important; }

.mdl-color-text--blue-400 {
  color: rgb(66,165,245) !important; }

.mdl-color--blue-400 {
  background-color: rgb(66,165,245) !important; }

.mdl-color-text--blue-500 {
  color: rgb(33,150,243) !important; }

.mdl-color--blue-500 {
  background-color: rgb(33,150,243) !important; }

.mdl-color-text--blue-600 {
  color: rgb(30,136,229) !important; }

.mdl-color--blue-600 {
  background-color: rgb(30,136,229) !important; }

.mdl-color-text--blue-700 {
  color: rgb(25,118,210) !important; }

.mdl-color--blue-700 {
  background-color: rgb(25,118,210) !important; }

.mdl-color-text--blue-800 {
  color: rgb(21,101,192) !important; }

.mdl-color--blue-800 {
  background-color: rgb(21,101,192) !important; }

.mdl-color-text--blue-900 {
  color: rgb(13,71,161) !important; }

.mdl-color--blue-900 {
  background-color: rgb(13,71,161) !important; }

.mdl-color-text--blue-A100 {
  color: rgb(130,177,255) !important; }

.mdl-color--blue-A100 {
  background-color: rgb(130,177,255) !important; }

.mdl-color-text--blue-A200 {
  color: rgb(68,138,255) !important; }

.mdl-color--blue-A200 {
  background-color: rgb(68,138,255) !important; }

.mdl-color-text--blue-A400 {
  color: rgb(41,121,255) !important; }

.mdl-color--blue-A400 {
  background-color: rgb(41,121,255) !important; }

.mdl-color-text--blue-A700 {
  color: rgb(41,98,255) !important; }

.mdl-color--blue-A700 {
  background-color: rgb(41,98,255) !important; }

.mdl-color-text--light-blue {
  color: rgb(3,169,244) !important; }

.mdl-color--light-blue {
  background-color: rgb(3,169,244) !important; }

.mdl-color-text--light-blue-50 {
  color: rgb(225,245,254) !important; }

.mdl-color--light-blue-50 {
  background-color: rgb(225,245,254) !important; }

.mdl-color-text--light-blue-100 {
  color: rgb(179,229,252) !important; }

.mdl-color--light-blue-100 {
  background-color: rgb(179,229,252) !important; }

.mdl-color-text--light-blue-200 {
  color: rgb(129,212,250) !important; }

.mdl-color--light-blue-200 {
  background-color: rgb(129,212,250) !important; }

.mdl-color-text--light-blue-300 {
  color: rgb(79,195,247) !important; }

.mdl-color--light-blue-300 {
  background-color: rgb(79,195,247) !important; }

.mdl-color-text--light-blue-400 {
  color: rgb(41,182,246) !important; }

.mdl-color--light-blue-400 {
  background-color: rgb(41,182,246) !important; }

.mdl-color-text--light-blue-500 {
  color: rgb(3,169,244) !important; }

.mdl-color--light-blue-500 {
  background-color: rgb(3,169,244) !important; }

.mdl-color-text--light-blue-600 {
  color: rgb(3,155,229) !important; }

.mdl-color--light-blue-600 {
  background-color: rgb(3,155,229) !important; }

.mdl-color-text--light-blue-700 {
  color: rgb(2,136,209) !important; }

.mdl-color--light-blue-700 {
  background-color: rgb(2,136,209) !important; }

.mdl-color-text--light-blue-800 {
  color: rgb(2,119,189) !important; }

.mdl-color--light-blue-800 {
  background-color: rgb(2,119,189) !important; }

.mdl-color-text--light-blue-900 {
  color: rgb(1,87,155) !important; }

.mdl-color--light-blue-900 {
  background-color: rgb(1,87,155) !important; }

.mdl-color-text--light-blue-A100 {
  color: rgb(128,216,255) !important; }

.mdl-color--light-blue-A100 {
  background-color: rgb(128,216,255) !important; }

.mdl-color-text--light-blue-A200 {
  color: rgb(64,196,255) !important; }

.mdl-color--light-blue-A200 {
  background-color: rgb(64,196,255) !important; }

.mdl-color-text--light-blue-A400 {
  color: rgb(0,176,255) !important; }

.mdl-color--light-blue-A400 {
  background-color: rgb(0,176,255) !important; }

.mdl-color-text--light-blue-A700 {
  color: rgb(0,145,234) !important; }

.mdl-color--light-blue-A700 {
  background-color: rgb(0,145,234) !important; }

.mdl-color-text--cyan {
  color: rgb(0,188,212) !important; }

.mdl-color--cyan {
  background-color: rgb(0,188,212) !important; }

.mdl-color-text--cyan-50 {
  color: rgb(224,247,250) !important; }

.mdl-color--cyan-50 {
  background-color: rgb(224,247,250) !important; }

.mdl-color-text--cyan-100 {
  color: rgb(178,235,242) !important; }

.mdl-color--cyan-100 {
  background-color: rgb(178,235,242) !important; }

.mdl-color-text--cyan-200 {
  color: rgb(128,222,234) !important; }

.mdl-color--cyan-200 {
  background-color: rgb(128,222,234) !important; }

.mdl-color-text--cyan-300 {
  color: rgb(77,208,225) !important; }

.mdl-color--cyan-300 {
  background-color: rgb(77,208,225) !important; }

.mdl-color-text--cyan-400 {
  color: rgb(38,198,218) !important; }

.mdl-color--cyan-400 {
  background-color: rgb(38,198,218) !important; }

.mdl-color-text--cyan-500 {
  color: rgb(0,188,212) !important; }

.mdl-color--cyan-500 {
  background-color: rgb(0,188,212) !important; }

.mdl-color-text--cyan-600 {
  color: rgb(0,172,193) !important; }

.mdl-color--cyan-600 {
  background-color: rgb(0,172,193) !important; }

.mdl-color-text--cyan-700 {
  color: rgb(0,151,167) !important; }

.mdl-color--cyan-700 {
  background-color: rgb(0,151,167) !important; }

.mdl-color-text--cyan-800 {
  color: rgb(0,131,143) !important; }

.mdl-color--cyan-800 {
  background-color: rgb(0,131,143) !important; }

.mdl-color-text--cyan-900 {
  color: rgb(0,96,100) !important; }

.mdl-color--cyan-900 {
  background-color: rgb(0,96,100) !important; }

.mdl-color-text--cyan-A100 {
  color: rgb(132,255,255) !important; }

.mdl-color--cyan-A100 {
  background-color: rgb(132,255,255) !important; }

.mdl-color-text--cyan-A200 {
  color: rgb(24,255,255) !important; }

.mdl-color--cyan-A200 {
  background-color: rgb(24,255,255) !important; }

.mdl-color-text--cyan-A400 {
  color: rgb(0,229,255) !important; }

.mdl-color--cyan-A400 {
  background-color: rgb(0,229,255) !important; }

.mdl-color-text--cyan-A700 {
  color: rgb(0,184,212) !important; }

.mdl-color--cyan-A700 {
  background-color: rgb(0,184,212) !important; }

.mdl-color-text--teal {
  color: rgb(0,150,136) !important; }

.mdl-color--teal {
  background-color: rgb(0,150,136) !important; }

.mdl-color-text--teal-50 {
  color: rgb(224,242,241) !important; }

.mdl-color--teal-50 {
  background-color: rgb(224,242,241) !important; }

.mdl-color-text--teal-100 {
  color: rgb(178,223,219) !important; }

.mdl-color--teal-100 {
  background-color: rgb(178,223,219) !important; }

.mdl-color-text--teal-200 {
  color: rgb(128,203,196) !important; }

.mdl-color--teal-200 {
  background-color: rgb(128,203,196) !important; }

.mdl-color-text--teal-300 {
  color: rgb(77,182,172) !important; }

.mdl-color--teal-300 {
  background-color: rgb(77,182,172) !important; }

.mdl-color-text--teal-400 {
  color: rgb(38,166,154) !important; }

.mdl-color--teal-400 {
  background-color: rgb(38,166,154) !important; }

.mdl-color-text--teal-500 {
  color: rgb(0,150,136) !important; }

.mdl-color--teal-500 {
  background-color: rgb(0,150,136) !important; }

.mdl-color-text--teal-600 {
  color: rgb(0,137,123) !important; }

.mdl-color--teal-600 {
  background-color: rgb(0,137,123) !important; }

.mdl-color-text--teal-700 {
  color: rgb(0,121,107) !important; }

.mdl-color--teal-700 {
  background-color: rgb(0,121,107) !important; }

.mdl-color-text--teal-800 {
  color: rgb(0,105,92) !important; }

.mdl-color--teal-800 {
  background-color: rgb(0,105,92) !important; }

.mdl-color-text--teal-900 {
  color: rgb(0,77,64) !important; }

.mdl-color--teal-900 {
  background-color: rgb(0,77,64) !important; }

.mdl-color-text--teal-A100 {
  color: rgb(167,255,235) !important; }

.mdl-color--teal-A100 {
  background-color: rgb(167,255,235) !important; }

.mdl-color-text--teal-A200 {
  color: rgb(100,255,218) !important; }

.mdl-color--teal-A200 {
  background-color: rgb(100,255,218) !important; }

.mdl-color-text--teal-A400 {
  color: rgb(29,233,182) !important; }

.mdl-color--teal-A400 {
  background-color: rgb(29,233,182) !important; }

.mdl-color-text--teal-A700 {
  color: rgb(0,191,165) !important; }

.mdl-color--teal-A700 {
  background-color: rgb(0,191,165) !important; }

.mdl-color-text--green {
  color: rgb(76,175,80) !important; }

.mdl-color--green {
  background-color: rgb(76,175,80) !important; }

.mdl-color-text--green-50 {
  color: rgb(232,245,233) !important; }

.mdl-color--green-50 {
  background-color: rgb(232,245,233) !important; }

.mdl-color-text--green-100 {
  color: rgb(200,230,201) !important; }

.mdl-color--green-100 {
  background-color: rgb(200,230,201) !important; }

.mdl-color-text--green-200 {
  color: rgb(165,214,167) !important; }

.mdl-color--green-200 {
  background-color: rgb(165,214,167) !important; }

.mdl-color-text--green-300 {
  color: rgb(129,199,132) !important; }

.mdl-color--green-300 {
  background-color: rgb(129,199,132) !important; }

.mdl-color-text--green-400 {
  color: rgb(102,187,106) !important; }

.mdl-color--green-400 {
  background-color: rgb(102,187,106) !important; }

.mdl-color-text--green-500 {
  color: rgb(76,175,80) !important; }

.mdl-color--green-500 {
  background-color: rgb(76,175,80) !important; }

.mdl-color-text--green-600 {
  color: rgb(67,160,71) !important; }

.mdl-color--green-600 {
  background-color: rgb(67,160,71) !important; }

.mdl-color-text--green-700 {
  color: rgb(56,142,60) !important; }

.mdl-color--green-700 {
  background-color: rgb(56,142,60) !important; }

.mdl-color-text--green-800 {
  color: rgb(46,125,50) !important; }

.mdl-color--green-800 {
  background-color: rgb(46,125,50) !important; }

.mdl-color-text--green-900 {
  color: rgb(27,94,32) !important; }

.mdl-color--green-900 {
  background-color: rgb(27,94,32) !important; }

.mdl-color-text--green-A100 {
  color: rgb(185,246,202) !important; }

.mdl-color--green-A100 {
  background-color: rgb(185,246,202) !important; }

.mdl-color-text--green-A200 {
  color: rgb(105,240,174) !important; }

.mdl-color--green-A200 {
  background-color: rgb(105,240,174) !important; }

.mdl-color-text--green-A400 {
  color: rgb(0,230,118) !important; }

.mdl-color--green-A400 {
  background-color: rgb(0,230,118) !important; }

.mdl-color-text--green-A700 {
  color: rgb(0,200,83) !important; }

.mdl-color--green-A700 {
  background-color: rgb(0,200,83) !important; }

.mdl-color-text--light-green {
  color: rgb(139,195,74) !important; }

.mdl-color--light-green {
  background-color: rgb(139,195,74) !important; }

.mdl-color-text--light-green-50 {
  color: rgb(241,248,233) !important; }

.mdl-color--light-green-50 {
  background-color: rgb(241,248,233) !important; }

.mdl-color-text--light-green-100 {
  color: rgb(220,237,200) !important; }

.mdl-color--light-green-100 {
  background-color: rgb(220,237,200) !important; }

.mdl-color-text--light-green-200 {
  color: rgb(197,225,165) !important; }

.mdl-color--light-green-200 {
  background-color: rgb(197,225,165) !important; }

.mdl-color-text--light-green-300 {
  color: rgb(174,213,129) !important; }

.mdl-color--light-green-300 {
  background-color: rgb(174,213,129) !important; }

.mdl-color-text--light-green-400 {
  color: rgb(156,204,101) !important; }

.mdl-color--light-green-400 {
  background-color: rgb(156,204,101) !important; }

.mdl-color-text--light-green-500 {
  color: rgb(139,195,74) !important; }

.mdl-color--light-green-500 {
  background-color: rgb(139,195,74) !important; }

.mdl-color-text--light-green-600 {
  color: rgb(124,179,66) !important; }

.mdl-color--light-green-600 {
  background-color: rgb(124,179,66) !important; }

.mdl-color-text--light-green-700 {
  color: rgb(104,159,56) !important; }

.mdl-color--light-green-700 {
  background-color: rgb(104,159,56) !important; }

.mdl-color-text--light-green-800 {
  color: rgb(85,139,47) !important; }

.mdl-color--light-green-800 {
  background-color: rgb(85,139,47) !important; }

.mdl-color-text--light-green-900 {
  color: rgb(51,105,30) !important; }

.mdl-color--light-green-900 {
  background-color: rgb(51,105,30) !important; }

.mdl-color-text--light-green-A100 {
  color: rgb(204,255,144) !important; }

.mdl-color--light-green-A100 {
  background-color: rgb(204,255,144) !important; }

.mdl-color-text--light-green-A200 {
  color: rgb(178,255,89) !important; }

.mdl-color--light-green-A200 {
  background-color: rgb(178,255,89) !important; }

.mdl-color-text--light-green-A400 {
  color: rgb(118,255,3) !important; }

.mdl-color--light-green-A400 {
  background-color: rgb(118,255,3) !important; }

.mdl-color-text--light-green-A700 {
  color: rgb(100,221,23) !important; }

.mdl-color--light-green-A700 {
  background-color: rgb(100,221,23) !important; }

.mdl-color-text--lime {
  color: rgb(205,220,57) !important; }

.mdl-color--lime {
  background-color: rgb(205,220,57) !important; }

.mdl-color-text--lime-50 {
  color: rgb(249,251,231) !important; }

.mdl-color--lime-50 {
  background-color: rgb(249,251,231) !important; }

.mdl-color-text--lime-100 {
  color: rgb(240,244,195) !important; }

.mdl-color--lime-100 {
  background-color: rgb(240,244,195) !important; }

.mdl-color-text--lime-200 {
  color: rgb(230,238,156) !important; }

.mdl-color--lime-200 {
  background-color: rgb(230,238,156) !important; }

.mdl-color-text--lime-300 {
  color: rgb(220,231,117) !important; }

.mdl-color--lime-300 {
  background-color: rgb(220,231,117) !important; }

.mdl-color-text--lime-400 {
  color: rgb(212,225,87) !important; }

.mdl-color--lime-400 {
  background-color: rgb(212,225,87) !important; }

.mdl-color-text--lime-500 {
  color: rgb(205,220,57) !important; }

.mdl-color--lime-500 {
  background-color: rgb(205,220,57) !important; }

.mdl-color-text--lime-600 {
  color: rgb(192,202,51) !important; }

.mdl-color--lime-600 {
  background-color: rgb(192,202,51) !important; }

.mdl-color-text--lime-700 {
  color: rgb(175,180,43) !important; }

.mdl-color--lime-700 {
  background-color: rgb(175,180,43) !important; }

.mdl-color-text--lime-800 {
  color: rgb(158,157,36) !important; }

.mdl-color--lime-800 {
  background-color: rgb(158,157,36) !important; }

.mdl-color-text--lime-900 {
  color: rgb(130,119,23) !important; }

.mdl-color--lime-900 {
  background-color: rgb(130,119,23) !important; }

.mdl-color-text--lime-A100 {
  color: rgb(244,255,129) !important; }

.mdl-color--lime-A100 {
  background-color: rgb(244,255,129) !important; }

.mdl-color-text--lime-A200 {
  color: rgb(238,255,65) !important; }

.mdl-color--lime-A200 {
  background-color: rgb(238,255,65) !important; }

.mdl-color-text--lime-A400 {
  color: rgb(198,255,0) !important; }

.mdl-color--lime-A400 {
  background-color: rgb(198,255,0) !important; }

.mdl-color-text--lime-A700 {
  color: rgb(174,234,0) !important; }

.mdl-color--lime-A700 {
  background-color: rgb(174,234,0) !important; }

.mdl-color-text--yellow {
  color: rgb(255,235,59) !important; }

.mdl-color--yellow {
  background-color: rgb(255,235,59) !important; }

.mdl-color-text--yellow-50 {
  color: rgb(255,253,231) !important; }

.mdl-color--yellow-50 {
  background-color: rgb(255,253,231) !important; }

.mdl-color-text--yellow-100 {
  color: rgb(255,249,196) !important; }

.mdl-color--yellow-100 {
  background-color: rgb(255,249,196) !important; }

.mdl-color-text--yellow-200 {
  color: rgb(255,245,157) !important; }

.mdl-color--yellow-200 {
  background-color: rgb(255,245,157) !important; }

.mdl-color-text--yellow-300 {
  color: rgb(255,241,118) !important; }

.mdl-color--yellow-300 {
  background-color: rgb(255,241,118) !important; }

.mdl-color-text--yellow-400 {
  color: rgb(255,238,88) !important; }

.mdl-color--yellow-400 {
  background-color: rgb(255,238,88) !important; }

.mdl-color-text--yellow-500 {
  color: rgb(255,235,59) !important; }

.mdl-color--yellow-500 {
  background-color: rgb(255,235,59) !important; }

.mdl-color-text--yellow-600 {
  color: rgb(253,216,53) !important; }

.mdl-color--yellow-600 {
  background-color: rgb(253,216,53) !important; }

.mdl-color-text--yellow-700 {
  color: rgb(251,192,45) !important; }

.mdl-color--yellow-700 {
  background-color: rgb(251,192,45) !important; }

.mdl-color-text--yellow-800 {
  color: rgb(249,168,37) !important; }

.mdl-color--yellow-800 {
  background-color: rgb(249,168,37) !important; }

.mdl-color-text--yellow-900 {
  color: rgb(245,127,23) !important; }

.mdl-color--yellow-900 {
  background-color: rgb(245,127,23) !important; }

.mdl-color-text--yellow-A100 {
  color: rgb(255,255,141) !important; }

.mdl-color--yellow-A100 {
  background-color: rgb(255,255,141) !important; }

.mdl-color-text--yellow-A200 {
  color: rgb(255,255,0) !important; }

.mdl-color--yellow-A200 {
  background-color: rgb(255,255,0) !important; }

.mdl-color-text--yellow-A400 {
  color: rgb(255,234,0) !important; }

.mdl-color--yellow-A400 {
  background-color: rgb(255,234,0) !important; }

.mdl-color-text--yellow-A700 {
  color: rgb(255,214,0) !important; }

.mdl-color--yellow-A700 {
  background-color: rgb(255,214,0) !important; }

.mdl-color-text--amber {
  color: rgb(255,193,7) !important; }

.mdl-color--amber {
  background-color: rgb(255,193,7) !important; }

.mdl-color-text--amber-50 {
  color: rgb(255,248,225) !important; }

.mdl-color--amber-50 {
  background-color: rgb(255,248,225) !important; }

.mdl-color-text--amber-100 {
  color: rgb(255,236,179) !important; }

.mdl-color--amber-100 {
  background-color: rgb(255,236,179) !important; }

.mdl-color-text--amber-200 {
  color: rgb(255,224,130) !important; }

.mdl-color--amber-200 {
  background-color: rgb(255,224,130) !important; }

.mdl-color-text--amber-300 {
  color: rgb(255,213,79) !important; }

.mdl-color--amber-300 {
  background-color: rgb(255,213,79) !important; }

.mdl-color-text--amber-400 {
  color: rgb(255,202,40) !important; }

.mdl-color--amber-400 {
  background-color: rgb(255,202,40) !important; }

.mdl-color-text--amber-500 {
  color: rgb(255,193,7) !important; }

.mdl-color--amber-500 {
  background-color: rgb(255,193,7) !important; }

.mdl-color-text--amber-600 {
  color: rgb(255,179,0) !important; }

.mdl-color--amber-600 {
  background-color: rgb(255,179,0) !important; }

.mdl-color-text--amber-700 {
  color: rgb(255,160,0) !important; }

.mdl-color--amber-700 {
  background-color: rgb(255,160,0) !important; }

.mdl-color-text--amber-800 {
  color: rgb(255,143,0) !important; }

.mdl-color--amber-800 {
  background-color: rgb(255,143,0) !important; }

.mdl-color-text--amber-900 {
  color: rgb(255,111,0) !important; }

.mdl-color--amber-900 {
  background-color: rgb(255,111,0) !important; }

.mdl-color-text--amber-A100 {
  color: rgb(255,229,127) !important; }

.mdl-color--amber-A100 {
  background-color: rgb(255,229,127) !important; }

.mdl-color-text--amber-A200 {
  color: rgb(255,215,64) !important; }

.mdl-color--amber-A200 {
  background-color: rgb(255,215,64) !important; }

.mdl-color-text--amber-A400 {
  color: rgb(255,196,0) !important; }

.mdl-color--amber-A400 {
  background-color: rgb(255,196,0) !important; }

.mdl-color-text--amber-A700 {
  color: rgb(255,171,0) !important; }

.mdl-color--amber-A700 {
  background-color: rgb(255,171,0) !important; }

.mdl-color-text--orange {
  color: rgb(255,152,0) !important; }

.mdl-color--orange {
  background-color: rgb(255,152,0) !important; }

.mdl-color-text--orange-50 {
  color: rgb(255,243,224) !important; }

.mdl-color--orange-50 {
  background-color: rgb(255,243,224) !important; }

.mdl-color-text--orange-100 {
  color: rgb(255,224,178) !important; }

.mdl-color--orange-100 {
  background-color: rgb(255,224,178) !important; }

.mdl-color-text--orange-200 {
  color: rgb(255,204,128) !important; }

.mdl-color--orange-200 {
  background-color: rgb(255,204,128) !important; }

.mdl-color-text--orange-300 {
  color: rgb(255,183,77) !important; }

.mdl-color--orange-300 {
  background-color: rgb(255,183,77) !important; }

.mdl-color-text--orange-400 {
  color: rgb(255,167,38) !important; }

.mdl-color--orange-400 {
  background-color: rgb(255,167,38) !important; }

.mdl-color-text--orange-500 {
  color: rgb(255,152,0) !important; }

.mdl-color--orange-500 {
  background-color: rgb(255,152,0) !important; }

.mdl-color-text--orange-600 {
  color: rgb(251,140,0) !important; }

.mdl-color--orange-600 {
  background-color: rgb(251,140,0) !important; }

.mdl-color-text--orange-700 {
  color: rgb(245,124,0) !important; }

.mdl-color--orange-700 {
  background-color: rgb(245,124,0) !important; }

.mdl-color-text--orange-800 {
  color: rgb(239,108,0) !important; }

.mdl-color--orange-800 {
  background-color: rgb(239,108,0) !important; }

.mdl-color-text--orange-900 {
  color: rgb(230,81,0) !important; }

.mdl-color--orange-900 {
  background-color: rgb(230,81,0) !important; }

.mdl-color-text--orange-A100 {
  color: rgb(255,209,128) !important; }

.mdl-color--orange-A100 {
  background-color: rgb(255,209,128) !important; }

.mdl-color-text--orange-A200 {
  color: rgb(255,171,64) !important; }

.mdl-color--orange-A200 {
  background-color: rgb(255,171,64) !important; }

.mdl-color-text--orange-A400 {
  color: rgb(255,145,0) !important; }

.mdl-color--orange-A400 {
  background-color: rgb(255,145,0) !important; }

.mdl-color-text--orange-A700 {
  color: rgb(255,109,0) !important; }

.mdl-color--orange-A700 {
  background-color: rgb(255,109,0) !important; }

.mdl-color-text--deep-orange {
  color: rgb(255,87,34) !important; }

.mdl-color--deep-orange {
  background-color: rgb(255,87,34) !important; }

.mdl-color-text--deep-orange-50 {
  color: rgb(251,233,231) !important; }

.mdl-color--deep-orange-50 {
  background-color: rgb(251,233,231) !important; }

.mdl-color-text--deep-orange-100 {
  color: rgb(255,204,188) !important; }

.mdl-color--deep-orange-100 {
  background-color: rgb(255,204,188) !important; }

.mdl-color-text--deep-orange-200 {
  color: rgb(255,171,145) !important; }

.mdl-color--deep-orange-200 {
  background-color: rgb(255,171,145) !important; }

.mdl-color-text--deep-orange-300 {
  color: rgb(255,138,101) !important; }

.mdl-color--deep-orange-300 {
  background-color: rgb(255,138,101) !important; }

.mdl-color-text--deep-orange-400 {
  color: rgb(255,112,67) !important; }

.mdl-color--deep-orange-400 {
  background-color: rgb(255,112,67) !important; }

.mdl-color-text--deep-orange-500 {
  color: rgb(255,87,34) !important; }

.mdl-color--deep-orange-500 {
  background-color: rgb(255,87,34) !important; }

.mdl-color-text--deep-orange-600 {
  color: rgb(244,81,30) !important; }

.mdl-color--deep-orange-600 {
  background-color: rgb(244,81,30) !important; }

.mdl-color-text--deep-orange-700 {
  color: rgb(230,74,25) !important; }

.mdl-color--deep-orange-700 {
  background-color: rgb(230,74,25) !important; }

.mdl-color-text--deep-orange-800 {
  color: rgb(216,67,21) !important; }

.mdl-color--deep-orange-800 {
  background-color: rgb(216,67,21) !important; }

.mdl-color-text--deep-orange-900 {
  color: rgb(191,54,12) !important; }

.mdl-color--deep-orange-900 {
  background-color: rgb(191,54,12) !important; }

.mdl-color-text--deep-orange-A100 {
  color: rgb(255,158,128) !important; }

.mdl-color--deep-orange-A100 {
  background-color: rgb(255,158,128) !important; }

.mdl-color-text--deep-orange-A200 {
  color: rgb(255,110,64) !important; }

.mdl-color--deep-orange-A200 {
  background-color: rgb(255,110,64) !important; }

.mdl-color-text--deep-orange-A400 {
  color: rgb(255,61,0) !important; }

.mdl-color--deep-orange-A400 {
  background-color: rgb(255,61,0) !important; }

.mdl-color-text--deep-orange-A700 {
  color: rgb(221,44,0) !important; }

.mdl-color--deep-orange-A700 {
  background-color: rgb(221,44,0) !important; }

.mdl-color-text--brown {
  color: rgb(121,85,72) !important; }

.mdl-color--brown {
  background-color: rgb(121,85,72) !important; }

.mdl-color-text--brown-50 {
  color: rgb(239,235,233) !important; }

.mdl-color--brown-50 {
  background-color: rgb(239,235,233) !important; }

.mdl-color-text--brown-100 {
  color: rgb(215,204,200) !important; }

.mdl-color--brown-100 {
  background-color: rgb(215,204,200) !important; }

.mdl-color-text--brown-200 {
  color: rgb(188,170,164) !important; }

.mdl-color--brown-200 {
  background-color: rgb(188,170,164) !important; }

.mdl-color-text--brown-300 {
  color: rgb(161,136,127) !important; }

.mdl-color--brown-300 {
  background-color: rgb(161,136,127) !important; }

.mdl-color-text--brown-400 {
  color: rgb(141,110,99) !important; }

.mdl-color--brown-400 {
  background-color: rgb(141,110,99) !important; }

.mdl-color-text--brown-500 {
  color: rgb(121,85,72) !important; }

.mdl-color--brown-500 {
  background-color: rgb(121,85,72) !important; }

.mdl-color-text--brown-600 {
  color: rgb(109,76,65) !important; }

.mdl-color--brown-600 {
  background-color: rgb(109,76,65) !important; }

.mdl-color-text--brown-700 {
  color: rgb(93,64,55) !important; }

.mdl-color--brown-700 {
  background-color: rgb(93,64,55) !important; }

.mdl-color-text--brown-800 {
  color: rgb(78,52,46) !important; }

.mdl-color--brown-800 {
  background-color: rgb(78,52,46) !important; }

.mdl-color-text--brown-900 {
  color: rgb(62,39,35) !important; }

.mdl-color--brown-900 {
  background-color: rgb(62,39,35) !important; }

.mdl-color-text--grey {
  color: rgb(158,158,158) !important; }

.mdl-color--grey {
  background-color: rgb(158,158,158) !important; }

.mdl-color-text--grey-50 {
  color: rgb(250,250,250) !important; }

.mdl-color--grey-50 {
  background-color: rgb(250,250,250) !important; }

.mdl-color-text--grey-100 {
  color: rgb(245,245,245) !important; }

.mdl-color--grey-100 {
  background-color: rgb(245,245,245) !important; }

.mdl-color-text--grey-200 {
  color: rgb(238,238,238) !important; }

.mdl-color--grey-200 {
  background-color: rgb(238,238,238) !important; }

.mdl-color-text--grey-300 {
  color: rgb(224,224,224) !important; }

.mdl-color--grey-300 {
  background-color: rgb(224,224,224) !important; }

.mdl-color-text--grey-400 {
  color: rgb(189,189,189) !important; }

.mdl-color--grey-400 {
  background-color: rgb(189,189,189) !important; }

.mdl-color-text--grey-500 {
  color: rgb(158,158,158) !important; }

.mdl-color--grey-500 {
  background-color: rgb(158,158,158) !important; }

.mdl-color-text--grey-600 {
  color: rgb(117,117,117) !important; }

.mdl-color--grey-600 {
  background-color: rgb(117,117,117) !important; }

.mdl-color-text--grey-700 {
  color: rgb(97,97,97) !important; }

.mdl-color--grey-700 {
  background-color: rgb(97,97,97) !important; }

.mdl-color-text--grey-800 {
  color: rgb(66,66,66) !important; }

.mdl-color--grey-800 {
  background-color: rgb(66,66,66) !important; }

.mdl-color-text--grey-900 {
  color: rgb(33,33,33) !important; }

.mdl-color--grey-900 {
  background-color: rgb(33,33,33) !important; }

.mdl-color-text--blue-grey {
  color: rgb(96,125,139) !important; }

.mdl-color--blue-grey {
  background-color: rgb(96,125,139) !important; }

.mdl-color-text--blue-grey-50 {
  color: rgb(236,239,241) !important; }

.mdl-color--blue-grey-50 {
  background-color: rgb(236,239,241) !important; }

.mdl-color-text--blue-grey-100 {
  color: rgb(207,216,220) !important; }

.mdl-color--blue-grey-100 {
  background-color: rgb(207,216,220) !important; }

.mdl-color-text--blue-grey-200 {
  color: rgb(176,190,197) !important; }

.mdl-color--blue-grey-200 {
  background-color: rgb(176,190,197) !important; }

.mdl-color-text--blue-grey-300 {
  color: rgb(144,164,174) !important; }

.mdl-color--blue-grey-300 {
  background-color: rgb(144,164,174) !important; }

.mdl-color-text--blue-grey-400 {
  color: rgb(120,144,156) !important; }

.mdl-color--blue-grey-400 {
  background-color: rgb(120,144,156) !important; }

.mdl-color-text--blue-grey-500 {
  color: rgb(96,125,139) !important; }

.mdl-color--blue-grey-500 {
  background-color: rgb(96,125,139) !important; }

.mdl-color-text--blue-grey-600 {
  color: rgb(84,110,122) !important; }

.mdl-color--blue-grey-600 {
  background-color: rgb(84,110,122) !important; }

.mdl-color-text--blue-grey-700 {
  color: rgb(69,90,100) !important; }

.mdl-color--blue-grey-700 {
  background-color: rgb(69,90,100) !important; }

.mdl-color-text--blue-grey-800 {
  color: rgb(55,71,79) !important; }

.mdl-color--blue-grey-800 {
  background-color: rgb(55,71,79) !important; }

.mdl-color-text--blue-grey-900 {
  color: rgb(38,50,56) !important; }

.mdl-color--blue-grey-900 {
  background-color: rgb(38,50,56) !important; }

.mdl-color--black {
  background-color: rgb(0,0,0) !important; }

.mdl-color-text--black {
  color: rgb(0,0,0) !important; }

.mdl-color--white {
  background-color: rgb(255,255,255) !important; }

.mdl-color-text--white {
  color: rgb(255,255,255) !important; }

.mdl-color--primary {
  background-color: rgb($color-primary) !important; }

.mdl-color--primary-contrast {
  background-color: rgb($color-primary-contrast) !important; }

.mdl-color--primary-dark {
  background-color: rgb($color-primary-dark) !important; }

.mdl-color--accent {
  background-color: rgb($color-accent) !important; }

.mdl-color--accent-contrast {
  background-color: rgb($color-accent-contrast) !important; }

.mdl-color-text--primary {
  color: rgb($color-primary) !important; }

.mdl-color-text--primary-contrast {
  color: rgb($color-primary-contrast) !important; }

.mdl-color-text--primary-dark {
  color: rgb($color-primary-dark) !important; }

.mdl-color-text--accent {
  color: rgb($color-accent) !important; }

.mdl-color-text--accent-contrast {
  color: rgb($color-accent-contrast) !important; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-ripple {
  background: rgb(0,0,0);
  border-radius: 50%;
  height: 50px;
  left: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  transform: translate(-50%, -50%);
  width: 50px;
  overflow: hidden; }
  .mdl-ripple.is-animating {
    transition: transform 0.3s cubic-bezier(0, 0, 0.2, 1), width 0.3s cubic-bezier(0, 0, 0.2, 1), height 0.3s cubic-bezier(0, 0, 0.2, 1), opacity 0.6s cubic-bezier(0, 0, 0.2, 1); }
  .mdl-ripple.is-visible {
    opacity: 0.3; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-animation--default {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }

.mdl-animation--fast-out-slow-in {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }

.mdl-animation--linear-out-slow-in {
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1); }

.mdl-animation--fast-out-linear-in {
  transition-timing-function: cubic-bezier(0.4, 0, 1, 1); }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-badge {
  position: relative;
  white-space: nowrap;
  margin-right: 24px; }
  .mdl-badge:not([data-badge]) {
    margin-right: auto; }
  .mdl-badge[data-badge]:after {
    content: attr(data-badge);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    align-items: center;
    position: absolute;
    top: -11px;
    right: -24px;
    font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
    font-weight: 600;
    font-size: 12px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: rgb($color-accent);
    color: rgb($color-accent-contrast); }
    .mdl-button .mdl-badge[data-badge]:after {
      top: -10px;
      right: -5px; }
  .mdl-badge.mdl-badge--no-background[data-badge]:after {
    color: rgb($color-accent);
    background: rgba($color-accent-contrast,0.2);
    box-shadow: 0 0 1px gray; }
  .mdl-badge.mdl-badge--overlap {
    margin-right: 10px; }
    .mdl-badge.mdl-badge--overlap:after {
      right: -10px; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-button {
  background: transparent;
  border: none;
  border-radius: 2px;
  color: rgb(0,0,0);
  position: relative;
  height: 36px;
  margin: 0;
  min-width: 64px;
  padding: 0 16px;
  display: inline-block;
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  line-height: 1;
  letter-spacing: 0;
  overflow: hidden;
  will-change: box-shadow;
  transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  outline: none;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  line-height: 36px;
  vertical-align: middle; }
  .mdl-button::-moz-focus-inner {
    border: 0; }
  .mdl-button:hover {
    background-color: rgba(158,158,158, 0.20); }
  .mdl-button:focus:not(:active) {
    background-color: rgba(0,0,0, 0.12); }
  .mdl-button:active {
    background-color: rgba(158,158,158, 0.40); }
  .mdl-button.mdl-button--colored {
    color: rgb($color-primary); }
    .mdl-button.mdl-button--colored:focus:not(:active) {
      background-color: rgba(0,0,0, 0.12); }

input.mdl-button[type="submit"] {
  -webkit-appearance: none; }

.mdl-button--raised {
  background: rgba(158,158,158, 0.20);
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }
  .mdl-button--raised:active {
    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
    background-color: rgba(158,158,158, 0.40); }
  .mdl-button--raised:focus:not(:active) {
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.36);
    background-color: rgba(158,158,158, 0.40); }
  .mdl-button--raised.mdl-button--colored {
    background: rgb($color-primary);
    color: rgb($color-primary-contrast); }
    .mdl-button--raised.mdl-button--colored:hover {
      background-color: rgb($color-primary); }
    .mdl-button--raised.mdl-button--colored:active {
      background-color: rgb($color-primary); }
    .mdl-button--raised.mdl-button--colored:focus:not(:active) {
      background-color: rgb($color-primary); }
    .mdl-button--raised.mdl-button--colored .mdl-ripple {
      background: rgb($color-primary-contrast); }

.mdl-button--fab {
  border-radius: 50%;
  font-size: 24px;
  height: 56px;
  margin: auto;
  min-width: 56px;
  width: 56px;
  padding: 0;
  overflow: hidden;
  background: rgba(158,158,158, 0.20);
  box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24);
  position: relative;
  line-height: normal; }
  .mdl-button--fab .material-icons {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(- 12px, - 12px);
    line-height: 24px;
    width: 24px; }
  .mdl-button--fab.mdl-button--mini-fab {
    height: 40px;
    min-width: 40px;
    width: 40px; }
  .mdl-button--fab .mdl-button__ripple-container {
    border-radius: 50%;
    -webkit-mask-image: -webkit-radial-gradient(circle, white, black); }
  .mdl-button--fab:active {
    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
    background-color: rgba(158,158,158, 0.40); }
  .mdl-button--fab:focus:not(:active) {
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.36);
    background-color: rgba(158,158,158, 0.40); }
  .mdl-button--fab.mdl-button--colored {
    background: rgb($color-accent);
    color: rgb($color-accent-contrast); }
    .mdl-button--fab.mdl-button--colored:hover {
      background-color: rgb($color-accent); }
    .mdl-button--fab.mdl-button--colored:focus:not(:active) {
      background-color: rgb($color-accent); }
    .mdl-button--fab.mdl-button--colored:active {
      background-color: rgb($color-accent); }
    .mdl-button--fab.mdl-button--colored .mdl-ripple {
      background: rgb($color-accent-contrast); }

.mdl-button--icon {
  border-radius: 50%;
  font-size: 24px;
  height: 32px;
  margin-left: 0;
  margin-right: 0;
  min-width: 32px;
  width: 32px;
  padding: 0;
  overflow: hidden;
  color: inherit;
  line-height: normal; }
  .mdl-button--icon .material-icons {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(- 12px, - 12px);
    line-height: 24px;
    width: 24px; }
  .mdl-button--icon.mdl-button--mini-icon {
    height: 24px;
    min-width: 24px;
    width: 24px; }
    .mdl-button--icon.mdl-button--mini-icon .material-icons {
      top: 0px;
      left: 0px; }
  .mdl-button--icon .mdl-button__ripple-container {
    border-radius: 50%;
    -webkit-mask-image: -webkit-radial-gradient(circle, white, black); }

.mdl-button__ripple-container {
  display: block;
  height: 100%;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100%;
  z-index: 0;
  overflow: hidden; }
  .mdl-button[disabled] .mdl-button__ripple-container .mdl-ripple, .mdl-button.mdl-button--disabled .mdl-button__ripple-container .mdl-ripple {
    background-color: transparent; }

.mdl-button--primary.mdl-button--primary {
  color: rgb($color-primary); }
  .mdl-button--primary.mdl-button--primary .mdl-ripple {
    background: rgb($color-primary-contrast); }
  .mdl-button--primary.mdl-button--primary.mdl-button--raised, .mdl-button--primary.mdl-button--primary.mdl-button--fab {
    color: rgb($color-primary-contrast);
    background-color: rgb($color-primary); }

.mdl-button--accent.mdl-button--accent {
  color: rgb($color-accent); }
  .mdl-button--accent.mdl-button--accent .mdl-ripple {
    background: rgb($color-accent-contrast); }
  .mdl-button--accent.mdl-button--accent.mdl-button--raised, .mdl-button--accent.mdl-button--accent.mdl-button--fab {
    color: rgb($color-accent-contrast);
    background-color: rgb($color-accent); }

.mdl-button[disabled][disabled], .mdl-button.mdl-button--disabled.mdl-button--disabled {
  color: rgba(0,0,0, 0.26);
  cursor: default;
  background-color: transparent; }
  .mdl-button--fab[disabled][disabled], .mdl-button--fab.mdl-button--disabled.mdl-button--disabled {
    background-color: rgba(0,0,0, 0.12);
    color: rgba(0,0,0, 0.26); }
  .mdl-button--raised[disabled][disabled], .mdl-button--raised.mdl-button--disabled.mdl-button--disabled {
    background-color: rgba(0,0,0, 0.12);
    color: rgba(0,0,0, 0.26);
    box-shadow: none; }
  .mdl-button--colored[disabled][disabled], .mdl-button--colored.mdl-button--disabled.mdl-button--disabled {
    color: rgba(0,0,0, 0.26); }

.mdl-button .material-icons {
  vertical-align: middle; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-card {
  display: flex;
  flex-direction: column;
  font-size: 16px;
  font-weight: 400;
  min-height: 200px;
  overflow: hidden;
  width: 330px;
  z-index: 1;
  position: relative;
  background: rgb(255,255,255);
  border-radius: 2px;
  box-sizing: border-box; }

.mdl-card__media {
  background-color: rgb($color-accent);
  background-repeat: repeat;
  background-position: 50% 50%;
  background-size: cover;
  background-origin: padding-box;
  background-attachment: scroll;
  box-sizing: border-box; }

.mdl-card__title {
  align-items: center;
  color: rgb(0,0,0);
  display: block;
  display: flex;
  line-height: normal;
  padding: 16px 16px;
  perspective-origin: 165px 56px;
  transform-origin: 165px 56px;
  box-sizing: border-box; }
  .mdl-card__title.mdl-card--border {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }

.mdl-card__title-text {
  align-self: flex-end;
  color: inherit;
  display: block;
  display: flex;
  font-size: 24px;
  font-weight: 300;
  line-height: normal;
  overflow: hidden;
  transform-origin: 149px 48px;
  margin: 0; }

.mdl-card__subtitle-text {
  font-size: 14px;
  color: rgba(0,0,0, 0.54);
  margin: 0; }

.mdl-card__supporting-text {
  color: rgba(0,0,0, 0.54);
  font-size: 1rem;
  line-height: 18px;
  overflow: hidden;
  padding: 16px 16px;
  width: 90%; }
  .mdl-card__supporting-text.mdl-card--border {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }

.mdl-card__actions {
  font-size: 16px;
  line-height: normal;
  width: 100%;
  background-color: rgba(0, 0, 0, 0);
  padding: 8px;
  box-sizing: border-box; }
  .mdl-card__actions.mdl-card--border {
    border-top: 1px solid rgba(0, 0, 0, 0.1); }

.mdl-card--expand {
  flex-grow: 1; }

.mdl-card__menu {
  position: absolute;
  right: 16px;
  top: 16px; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-checkbox {
  position: relative;
  z-index: 1;
  vertical-align: middle;
  display: inline-block;
  box-sizing: border-box;
  width: 100%;
  height: 24px;
  margin: 0;
  padding: 0; }
  .mdl-checkbox.is-upgraded {
    padding-left: 24px; }

.mdl-checkbox__input {
  line-height: 24px; }
  .mdl-checkbox.is-upgraded .mdl-checkbox__input {
    position: absolute;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    opacity: 0;
    -ms-appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: none; }

.mdl-checkbox__box-outline {
  position: absolute;
  top: 3px;
  left: 0;
  display: inline-block;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  margin: 0;
  cursor: pointer;
  overflow: hidden;
  border: 2px solid rgba(0,0,0, 0.54);
  border-radius: 2px;
  z-index: 2; }
  .mdl-checkbox.is-checked .mdl-checkbox__box-outline {
    border: 2px solid rgb($color-primary); }
  fieldset[disabled] .mdl-checkbox .mdl-checkbox__box-outline, .mdl-checkbox.is-disabled .mdl-checkbox__box-outline {
    border: 2px solid rgba(0,0,0, 0.26);
    cursor: auto; }

.mdl-checkbox__focus-helper {
  position: absolute;
  top: 3px;
  left: 0;
  display: inline-block;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: transparent; }
  .mdl-checkbox.is-focused .mdl-checkbox__focus-helper {
    box-shadow: 0 0 0px 8px rgba(0, 0, 0, 0.1);
    background-color: rgba(0, 0, 0, 0.1); }
  .mdl-checkbox.is-focused.is-checked .mdl-checkbox__focus-helper {
    box-shadow: 0 0 0px 8px rgba($color-primary, 0.26);
    background-color: rgba($color-primary, 0.26); }

.mdl-checkbox__tick-outline {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  mask: url("../themes/ngg-material/assets/scss/images/tick-mask.svg?embed");
  background: transparent;
  transition-duration: 0.28s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: background-image; }
  .mdl-checkbox.is-checked .mdl-checkbox__tick-outline {
    background-color: rgb($color-primary);
    background-image: url("../themes/ngg-material/assets/scss/images/tick.svg?embed"); }
  fieldset[disabled] .mdl-checkbox.is-checked .mdl-checkbox__tick-outline, .mdl-checkbox.is-checked.is-disabled .mdl-checkbox__tick-outline {
    background-color: rgba(0,0,0, 0.26); }

.mdl-checkbox__label {
  position: relative;
  cursor: pointer;
  font-size: 16px;
  line-height: 24px;
  margin: 0; }
  fieldset[disabled] .mdl-checkbox .mdl-checkbox__label, .mdl-checkbox.is-disabled .mdl-checkbox__label {
    color: rgba(0,0,0, 0.26);
    cursor: auto; }

.mdl-checkbox__ripple-container {
  position: absolute;
  z-index: 2;
  top: -6px;
  left: -10px;
  box-sizing: border-box;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  cursor: pointer;
  overflow: hidden;
  -webkit-mask-image: -webkit-radial-gradient(circle, white, black); }
  .mdl-checkbox__ripple-container .mdl-ripple {
    background: rgb($color-primary); }
  fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container, .mdl-checkbox.is-disabled .mdl-checkbox__ripple-container {
    cursor: auto; }
  fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container .mdl-ripple, .mdl-checkbox.is-disabled .mdl-checkbox__ripple-container .mdl-ripple {
    background: transparent; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-chip {
  height: 32px;
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  line-height: 32px;
  padding: 0 12px;
  border: 0;
  border-radius: 16px;
  background-color: #dedede;
  display: inline-block;
  color: rgba(0,0,0, 0.87);
  margin: 2px 0;
  font-size: 0;
  white-space: nowrap; }
  .mdl-chip__text {
    font-size: 13px;
    vertical-align: middle;
    display: inline-block; }
  .mdl-chip__action {
    height: 24px;
    width: 24px;
    background: transparent;
    opacity: 0.54;
    display: inline-block;
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    padding: 0;
    margin: 0 0 0 4px;
    font-size: 13px;
    text-decoration: none;
    color: rgba(0,0,0, 0.87);
    border: none;
    outline: none;
    overflow: hidden; }
  .mdl-chip__contact {
    height: 32px;
    width: 32px;
    border-radius: 16px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 8px;
    overflow: hidden;
    text-align: center;
    font-size: 18px;
    line-height: 32px; }
  .mdl-chip:focus {
    outline: 0;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }
  .mdl-chip:active {
    background-color: #d6d6d6; }
  .mdl-chip--deletable {
    padding-right: 4px; }
  .mdl-chip--contact {
    padding-left: 0; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-data-table {
  position: relative;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-collapse: collapse;
  white-space: nowrap;
  font-size: 13px;
  background-color: rgb(255,255,255); }
  .mdl-data-table thead {
    padding-bottom: 3px; }
    .mdl-data-table thead .mdl-data-table__select {
      margin-top: 0; }
  .mdl-data-table tbody tr {
    position: relative;
    height: 48px;
    transition-duration: 0.28s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-property: background-color; }
    .mdl-data-table tbody tr.is-selected {
      background-color: #e0e0e0; }
    .mdl-data-table tbody tr:hover {
      background-color: #eee; }
  .mdl-data-table td, .mdl-data-table th {
    padding: 0 18px 12px 18px;
    text-align: right; }
    .mdl-data-table td:first-of-type, .mdl-data-table th:first-of-type {
      padding-left: 24px; }
    .mdl-data-table td:last-of-type, .mdl-data-table th:last-of-type {
      padding-right: 24px; }
  .mdl-data-table td {
    position: relative;
    vertical-align: middle;
    height: 48px;
    border-top: 1px solid rgba(0, 0, 0, 0.12);
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    padding-top: 12px;
    box-sizing: border-box; }
    .mdl-data-table td .mdl-data-table__select {
      vertical-align: middle; }
  .mdl-data-table th {
    position: relative;
    vertical-align: bottom;
    text-overflow: ellipsis;
    font-size: 14px;
    font-weight: bold;
    line-height: 24px;
    letter-spacing: 0;
    height: 48px;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.54);
    padding-bottom: 8px;
    box-sizing: border-box; }
    .mdl-data-table th.mdl-data-table__header--sorted-ascending, .mdl-data-table th.mdl-data-table__header--sorted-descending {
      color: rgba(0, 0, 0, 0.87); }
    .mdl-data-table th.mdl-data-table__header--sorted-ascending:before, .mdl-data-table th.mdl-data-table__header--sorted-descending:before {
      font-family: 'Material Icons';
      font-weight: normal;
      font-style: normal;
      font-size: 24px;
      line-height: 1;
      letter-spacing: normal;
      text-transform: none;
      display: inline-block;
      word-wrap: normal;
      font-feature-settings: 'liga';
      -webkit-font-feature-settings: 'liga';
      -webkit-font-smoothing: antialiased;
      font-size: 16px;
      content: "\e5d8";
      margin-right: 5px;
      vertical-align: sub; }
    .mdl-data-table th.mdl-data-table__header--sorted-ascending:hover, .mdl-data-table th.mdl-data-table__header--sorted-descending:hover {
      cursor: pointer; }
      .mdl-data-table th.mdl-data-table__header--sorted-ascending:hover:before, .mdl-data-table th.mdl-data-table__header--sorted-descending:hover:before {
        color: rgba(0, 0, 0, 0.26); }
    .mdl-data-table th.mdl-data-table__header--sorted-descending:before {
      content: "\e5db"; }

.mdl-data-table__select {
  width: 16px; }

.mdl-data-table__cell--non-numeric.mdl-data-table__cell--non-numeric {
  text-align: left; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-dialog {
  border: none;
  box-shadow: 0 9px 46px 8px rgba(0, 0, 0, 0.14), 0 11px 15px -7px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.2);
  width: 280px; }
  .mdl-dialog__title {
    padding: 24px 24px 0;
    margin: 0;
    font-size: 2.5rem; }
  .mdl-dialog__actions {
    padding: 8px 8px 8px 24px;
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: wrap; }
    .mdl-dialog__actions > * {
      margin-right: 8px;
      height: 36px; }
    .mdl-dialog__actions > *:first-child {
      margin-right: 0; }
    .mdl-dialog__actions--full-width {
      padding: 0 0 8px 0; }
    .mdl-dialog__actions--full-width > * {
      height: 48px;
      flex: 0 0 auto;
      width: 100%;
      padding-right: 16px;
      margin-right: 0;
      text-align: right; }
  .mdl-dialog__content {
    padding: 20px 24px 24px 24px;
    color: rgba(0,0,0, 0.54); }
/**
 * Copyright 2016 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-expansion {
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  box-sizing: border-box; }
  .mdl-expansion__summary {
    font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
    padding-left: 24px;
    padding-right: 24px;
    height: 48px;
    display: flex;
    outline: none; }
    .mdl-expansion__summary::-webkit-details-marker {
      display: none; }
    .mdl-expansion__summary::after {
      font-family: 'Material Icons';
      font-weight: normal;
      font-style: normal;
      font-size: 24px;
      line-height: 1;
      letter-spacing: normal;
      text-transform: none;
      display: inline-block;
      word-wrap: normal;
      font-feature-settings: 'liga';
      -webkit-font-feature-settings: 'liga';
      -webkit-font-smoothing: antialiased;
      content: '\e313';
      display: inline-flex;
      flex-direction: column;
      user-select: none;
      justify-content: center;
      transition: transform 200ms, color 200ms;
      margin-left: auto;
      color: rgba(0, 0, 0, 0.38); }
    .mdl-expansion__summary:focus {
      background-color: rgba(238,238,238, 1); }
    .mdl-expansion__summary:focus::after {
      color: rgba(0, 0, 0, 0.54); }
  .mdl-expansion__header {
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 0.9375rem;
    font-weight: 500;
    flex-basis: 30%;
    margin-right: 16px; }
  .mdl-expansion__subheader {
    font-size: 0.75rem;
    color: rgba(0, 0, 0, 0.54); }
  .mdl-expansion__secondary-header {
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 0.9375rem;
    font-weight: 500;
    flex-basis: 30%;
    color: rgba(0, 0, 0, 0.87);
    margin-right: 16px; }
  .mdl-expansion__content {
    font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
    padding-left: 24px;
    padding-right: 24px;
    padding-top: 16px;
    padding-bottom: 16px; }
    .mdl-expansion__content + .mdl-expansion__actions {
      border-top: 1px solid rgba(0, 0, 0, 0.12); }
  .mdl-expansion__actions {
    display: flex;
    flex-direction: row-reverse;
    padding-top: 16px;
    padding-bottom: 16px; }
  .mdl-expansion__action {
    margin-right: 8px; }
  .mdl-expansion[open] .mdl-expansion__summary::after {
    transform: rotate(180deg); }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-mega-footer {
  padding: 16px 40px;
  color: rgb(158,158,158);
  background-color: rgb(66,66,66); }

.mdl-mega-footer--top-section:after, .mdl-mega-footer--middle-section:after, .mdl-mega-footer--bottom-section:after, .mdl-mega-footer__top-section:after, .mdl-mega-footer__middle-section:after, .mdl-mega-footer__bottom-section:after {
  content: '';
  display: block;
  clear: both; }

.mdl-mega-footer--left-section, .mdl-mega-footer__left-section {
  margin-bottom: 16px; }

.mdl-mega-footer--right-section, .mdl-mega-footer__right-section {
  margin-bottom: 16px; }

.mdl-mega-footer--right-section a, .mdl-mega-footer__right-section a {
  display: block;
  margin-bottom: 16px;
  color: inherit;
  text-decoration: none; }

@media screen and (min-width: 760px) {
  .mdl-mega-footer--left-section, .mdl-mega-footer__left-section {
    float: left; }

  .mdl-mega-footer--right-section, .mdl-mega-footer__right-section {
    float: right; }

  .mdl-mega-footer--right-section a, .mdl-mega-footer__right-section a {
    display: inline-block;
    margin-left: 16px;
    line-height: 36px;
    vertical-align: middle; } }

.mdl-mega-footer--social-btn, .mdl-mega-footer__social-btn {
  width: 36px;
  height: 36px;
  padding: 0;
  margin: 0;
  background-color: rgb(158,158,158);
  border: none; }

.mdl-mega-footer--drop-down-section, .mdl-mega-footer__drop-down-section {
  display: block;
  position: relative; }

@media screen and (min-width: 760px) {
  .mdl-mega-footer--drop-down-section, .mdl-mega-footer__drop-down-section {
    width: 33%; }

  .mdl-mega-footer--drop-down-section:nth-child(1), .mdl-mega-footer--drop-down-section:nth-child(2), .mdl-mega-footer__drop-down-section:nth-child(1), .mdl-mega-footer__drop-down-section:nth-child(2) {
    float: left; }

  .mdl-mega-footer--drop-down-section:nth-child(3), .mdl-mega-footer__drop-down-section:nth-child(3) {
    float: right; }
    .mdl-mega-footer--drop-down-section:nth-child(3):after, .mdl-mega-footer__drop-down-section:nth-child(3):after {
      clear: right; }

  .mdl-mega-footer--drop-down-section:nth-child(4), .mdl-mega-footer__drop-down-section:nth-child(4) {
    clear: right;
    float: right; }

  .mdl-mega-footer--middle-section:after, .mdl-mega-footer__middle-section:after {
    content: '';
    display: block;
    clear: both; }

  .mdl-mega-footer--bottom-section, .mdl-mega-footer__bottom-section {
    padding-top: 0; } }

@media screen and (min-width: 1024px) {
  .mdl-mega-footer--drop-down-section, .mdl-mega-footer--drop-down-section:nth-child(3), .mdl-mega-footer--drop-down-section:nth-child(4), .mdl-mega-footer__drop-down-section, .mdl-mega-footer__drop-down-section:nth-child(3), .mdl-mega-footer__drop-down-section:nth-child(4) {
    width: 24%;
    float: left; } }

.mdl-mega-footer--heading-checkbox, .mdl-mega-footer__heading-checkbox {
  position: absolute;
  width: 100%;
  height: 55.8px;
  padding: 32px;
  margin: 0;
  margin-top: -16px;
  cursor: pointer;
  z-index: 1;
  opacity: 0; }
  .mdl-mega-footer--heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer__heading:after {
    font-family: 'Material Icons';
    content: '\E5CE'; }

.mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list {
  display: none; }
  .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading:after {
    font-family: 'Material Icons';
    content: '\E5CF'; }

.mdl-mega-footer--heading, .mdl-mega-footer__heading {
  position: relative;
  width: 100%;
  padding-right: 39.8px;
  margin-bottom: 16px;
  box-sizing: border-box;
  font-size: 14px;
  line-height: 23.8px;
  font-weight: 500;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  color: rgb(224,224,224); }

.mdl-mega-footer--heading:after, .mdl-mega-footer__heading:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 23.8px;
  height: 23.8px;
  background-size: cover; }

.mdl-mega-footer--link-list, .mdl-mega-footer__link-list {
  list-style: none;
  margin: 0;
  padding: 0;
  margin-bottom: 32px; }
  .mdl-mega-footer--link-list:after, .mdl-mega-footer__link-list:after {
    clear: both;
    display: block;
    content: ''; }

.mdl-mega-footer--link-list li, .mdl-mega-footer__link-list li {
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0;
  line-height: 20px; }

.mdl-mega-footer--link-list a, .mdl-mega-footer__link-list a {
  color: inherit;
  text-decoration: none;
  white-space: nowrap; }

@media screen and (min-width: 760px) {
  .mdl-mega-footer--heading-checkbox, .mdl-mega-footer__heading-checkbox {
    display: none; }
    .mdl-mega-footer--heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer__heading:after {
      content: ''; }

  .mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list {
    display: block; }
    .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading:after {
      content: ''; } }

.mdl-mega-footer--bottom-section, .mdl-mega-footer__bottom-section {
  padding-top: 16px;
  margin-bottom: 16px; }

.mdl-logo {
  margin-bottom: 16px;
  color: white; }

.mdl-mega-footer--bottom-section .mdl-mega-footer--link-list li, .mdl-mega-footer__bottom-section .mdl-mega-footer__link-list li {
  float: left;
  margin-bottom: 0;
  margin-right: 16px; }

@media screen and (min-width: 760px) {
  .mdl-logo {
    float: left;
    margin-bottom: 0;
    margin-right: 16px; } }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-mini-footer {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  padding: 48px 24px;
  color: rgb(158,158,158);
  background-color: rgb(66,66,66); }
  .mdl-mini-footer:after {
    content: '';
    display: block; }
  .mdl-mini-footer .mdl-logo {
    line-height: 36px; }

.mdl-mini-footer--link-list, .mdl-mini-footer__link-list {
  display: flex;
  flex-flow: row nowrap;
  list-style: none;
  margin: 0;
  padding: 0; }
  .mdl-mini-footer--link-list li, .mdl-mini-footer__link-list li {
    margin-bottom: 0;
    margin-right: 24px; }
    @media screen and (min-width: 760px) {
  .mdl-mini-footer--link-list li, .mdl-mini-footer__link-list li {
    line-height: 36px; } }
  .mdl-mini-footer--link-list a, .mdl-mini-footer__link-list a {
    color: inherit;
    text-decoration: none;
    white-space: nowrap; }

.mdl-mini-footer--left-section, .mdl-mini-footer__left-section {
  display: inline-block;
  order: 0; }

.mdl-mini-footer--right-section, .mdl-mini-footer__right-section {
  display: inline-block;
  order: 1; }

.mdl-mini-footer--social-btn, .mdl-mini-footer__social-btn {
  width: 36px;
  height: 36px;
  padding: 0;
  margin: 0;
  background-color: rgb(158,158,158);
  border: none; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-icon-toggle {
  position: relative;
  z-index: 1;
  vertical-align: middle;
  display: inline-block;
  height: 32px;
  margin: 0;
  padding: 0; }

.mdl-icon-toggle__input {
  line-height: 32px; }
  .mdl-icon-toggle.is-upgraded .mdl-icon-toggle__input {
    position: absolute;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    opacity: 0;
    -ms-appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: none; }

.mdl-icon-toggle__label {
  display: inline-block;
  position: relative;
  cursor: pointer;
  height: 32px;
  width: 32px;
  min-width: 32px;
  color: rgb(97,97,97);
  border-radius: 50%;
  padding: 0;
  margin-left: 0;
  margin-right: 0;
  text-align: center;
  background-color: transparent;
  will-change: background-color;
  transition: background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
  .mdl-icon-toggle__label.material-icons {
    line-height: 32px;
    font-size: 24px; }
  .mdl-icon-toggle.is-checked .mdl-icon-toggle__label {
    color: rgb($color-primary); }
  .mdl-icon-toggle.is-disabled .mdl-icon-toggle__label {
    color: rgba(0,0,0, 0.26);
    cursor: auto;
    transition: none; }
  .mdl-icon-toggle.is-focused .mdl-icon-toggle__label {
    background-color: rgba(0,0,0, 0.12); }
  .mdl-icon-toggle.is-focused.is-checked .mdl-icon-toggle__label {
    background-color: rgba($color-primary, 0.26); }

.mdl-icon-toggle__ripple-container {
  position: absolute;
  z-index: 2;
  top: -2px;
  left: -2px;
  box-sizing: border-box;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  cursor: pointer;
  overflow: hidden;
  -webkit-mask-image: -webkit-radial-gradient(circle, white, black); }
  .mdl-icon-toggle__ripple-container .mdl-ripple {
    background: rgb(97,97,97); }
  .mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container {
    cursor: auto; }
  .mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container .mdl-ripple {
    background: transparent; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-list {
  display: block;
  padding: 8px 0;
  list-style: none; }

.mdl-list__item {
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0.04em;
  line-height: 1;
  display: flex;
  min-height: 48px;
  box-sizing: border-box;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  padding: 16px;
  cursor: default;
  color: rgba(0,0,0, 0.87);
  overflow: hidden; }
  .mdl-list__item .mdl-list__item-primary-content {
    order: 0;
    flex-grow: 2;
    text-decoration: none;
    box-sizing: border-box;
    display: flex;
    align-items: center; }
    .mdl-list__item .mdl-list__item-primary-content .mdl-list__item-icon {
      margin-right: 32px; }
    .mdl-list__item .mdl-list__item-primary-content .mdl-list__item-avatar {
      margin-right: 16px; }
  .mdl-list__item .mdl-list__item-secondary-content {
    display: flex;
    flex-flow: column;
    align-items: flex-end;
    margin-left: 16px; }
    .mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-secondary-action label {
      display: inline; }
    .mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-secondary-info {
      font-size: 12px;
      font-weight: 400;
      line-height: 1;
      letter-spacing: 0;
      color: rgba(0,0,0, 0.54); }
    .mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-sub-header {
      padding: 0 0 0 16px; }

.mdl-list__item-icon, .mdl-list__item-icon.material-icons {
  height: 24px;
  width: 24px;
  font-size: 24px;
  box-sizing: border-box;
  color: rgb(117,117,117); }

.mdl-list__item-avatar, .mdl-list__item-avatar.material-icons {
  height: 40px;
  width: 40px;
  box-sizing: border-box;
  border-radius: 50%;
  background-color: rgb(117,117,117);
  font-size: 40px;
  color: white; }

.mdl-list__item--two-line {
  height: 72px; }
  .mdl-list__item--two-line .mdl-list__item-primary-content {
    height: 36px;
    line-height: 20px;
    display: block; }
    .mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-avatar {
      float: left; }
    .mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-icon {
      float: left;
      margin-top: 6px; }
    .mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-secondary-content {
      height: 36px; }
    .mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-sub-title {
      font-size: 14px;
      font-weight: 400;
      line-height: 24px;
      letter-spacing: 0;
      line-height: 18px;
      color: rgba(0,0,0, 0.54);
      display: block;
      padding: 0; }

.mdl-list__item--three-line {
  height: 88px; }
  .mdl-list__item--three-line .mdl-list__item-primary-content {
    height: 52px;
    line-height: 20px;
    display: block; }
    .mdl-list__item--three-line .mdl-list__item-primary-content .mdl-list__item-avatar, .mdl-list__item--three-line .mdl-list__item-primary-content .mdl-list__item-icon {
      float: left; }
  .mdl-list__item--three-line .mdl-list__item-secondary-content {
    height: 52px; }
  .mdl-list__item--three-line .mdl-list__item-text-body {
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0;
    line-height: 18px;
    height: 52px;
    color: rgba(0,0,0, 0.54);
    display: block;
    padding: 0; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-menu__container {
  display: block;
  margin: 0;
  padding: 0;
  border: none;
  position: absolute;
  overflow: visible;
  height: 0;
  width: 0;
  visibility: hidden;
  z-index: -1; }
  .mdl-menu__container.is-visible, .mdl-menu__container.is-animating {
    z-index: 999;
    visibility: visible; }

.mdl-menu__outline {
  display: block;
  background: rgb(255,255,255);
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 2px;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  opacity: 0;
  transform: scale(0);
  transform-origin: 0 0;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  will-change: transform;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: -1; }
  .mdl-menu__container.is-visible .mdl-menu__outline {
    opacity: 1;
    transform: scale(1);
    z-index: 999; }
  .mdl-menu__outline.mdl-menu--bottom-right {
    transform-origin: 100% 0; }
  .mdl-menu__outline.mdl-menu--top-left {
    transform-origin: 0 100%; }
  .mdl-menu__outline.mdl-menu--top-right {
    transform-origin: 100% 100%; }

.mdl-menu {
  position: absolute;
  list-style: none;
  top: 0;
  left: 0;
  height: auto;
  width: auto;
  min-width: 124px;
  padding: 8px 0;
  margin: 0;
  opacity: 0;
  clip: rect(0 0 0 0);
  z-index: -1; }
  .mdl-menu__container.is-visible .mdl-menu {
    opacity: 1;
    z-index: 999; }
  .mdl-menu.is-animating {
    transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), clip 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
  .mdl-menu.mdl-menu--bottom-right {
    left: auto;
    right: 0; }
  .mdl-menu.mdl-menu--top-left {
    top: auto;
    bottom: 0; }
  .mdl-menu.mdl-menu--top-right {
    top: auto;
    left: auto;
    bottom: 0;
    right: 0; }
  .mdl-menu.mdl-menu--unaligned {
    top: auto;
    left: auto; }

.mdl-menu__item {
  display: block;
  border: none;
  color: rgba(0,0,0, 0.87);
  background-color: transparent;
  text-align: left;
  margin: 0;
  padding: 0 16px;
  outline-color: rgb(189,189,189);
  position: relative;
  overflow: hidden;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0;
  text-decoration: none;
  cursor: pointer;
  height: 48px;
  line-height: 48px;
  white-space: nowrap;
  opacity: 0;
  transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  user-select: none; }
  .mdl-menu__container.is-visible .mdl-menu__item {
    opacity: 1; }
  .mdl-menu__item::-moz-focus-inner {
    border: 0; }
  .mdl-menu__item--full-bleed-divider {
    border-bottom: 1px solid rgba(0,0,0, 0.12); }
  .mdl-menu__item[disabled], .mdl-menu__item[data-mdl-disabled] {
    color: rgb(189,189,189);
    background-color: transparent;
    cursor: auto; }
    .mdl-menu__item[disabled]:hover, .mdl-menu__item[data-mdl-disabled]:hover {
      background-color: transparent; }
    .mdl-menu__item[disabled]:focus, .mdl-menu__item[data-mdl-disabled]:focus {
      background-color: transparent; }
    .mdl-menu__item[disabled] .mdl-ripple, .mdl-menu__item[data-mdl-disabled] .mdl-ripple {
      background: transparent; }
  .mdl-menu__item:hover {
    background-color: rgb(238,238,238); }
  .mdl-menu__item:focus {
    outline: none;
    background-color: rgb(238,238,238); }
  .mdl-menu__item:active {
    background-color: rgb(224,224,224); }

.mdl-menu__item--ripple-container {
  display: block;
  height: 100%;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100%;
  z-index: 0;
  overflow: hidden; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-progress {
  display: block;
  position: relative;
  height: 4px;
  width: 500px;
  max-width: 100%; }

.mdl-progress > .bar {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 0%;
  transition: width 0.2s cubic-bezier(0.4, 0, 0.2, 1); }

.mdl-progress > .progressbar {
  background-color: rgb($color-primary);
  z-index: 1;
  left: 0; }

.mdl-progress > .bufferbar {
  background-image: linear-gradient(to right, rgba($color-primary-contrast, 0.7), rgba($color-primary-contrast, 0.7)), linear-gradient(to right, rgb($color-primary), rgb($color-primary));
  z-index: 0;
  left: 0; }

.mdl-progress > .auxbar {
  right: 0; }

@supports (-webkit-appearance:none) {
  .mdl-progress:not(.mdl-progress--indeterminate):not(.mdl-progress--indeterminate) > .auxbar, .mdl-progress:not(.mdl-progress__indeterminate):not(.mdl-progress__indeterminate) > .auxbar {
    background-image: linear-gradient(to right, rgba($color-primary-contrast, 0.7), rgba($color-primary-contrast, 0.7)), linear-gradient(to right, rgb($color-primary), rgb($color-primary));
    mask: url("../themes/ngg-material/assets/scss/images/buffer.svg?embed"); } }

.mdl-progress:not(.mdl-progress--indeterminate) > .auxbar, .mdl-progress:not(.mdl-progress__indeterminate) > .auxbar {
  background-image: linear-gradient(to right, rgba($color-primary-contrast, 0.9), rgba($color-primary-contrast, 0.9)), linear-gradient(to right, rgb($color-primary), rgb($color-primary)); }

.mdl-progress.mdl-progress--indeterminate > .bar1, .mdl-progress.mdl-progress__indeterminate > .bar1 {
  background-color: rgb($color-primary);
  animation-name: indeterminate1;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: linear; }

.mdl-progress.mdl-progress--indeterminate > .bar3, .mdl-progress.mdl-progress__indeterminate > .bar3 {
  background-image: none;
  background-color: rgb($color-primary);
  animation-name: indeterminate2;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: linear; }

@keyframes indeterminate1 {
  0% {
    left: 0%;
    width: 0%; }

  50% {
    left: 25%;
    width: 75%; }

  75% {
    left: 100%;
    width: 0%; } }

@keyframes indeterminate2 {
  0% {
    left: 0%;
    width: 0%; }

  50% {
    left: 0%;
    width: 0%; }

  75% {
    left: 0%;
    width: 25%; }

  100% {
    left: 100%;
    width: 0%; } }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-navigation {
  display: flex;
  flex-wrap: nowrap;
  box-sizing: border-box; }

.mdl-navigation__link {
  color: rgb(66,66,66);
  text-decoration: none;
  margin: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0;
  opacity: 0.87; }
  .mdl-navigation__link .material-icons {
    vertical-align: middle; }

.mdl-layout {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overflow-x: hidden;
  position: relative;
  -webkit-overflow-scrolling: touch; }

.mdl-layout.is-small-screen .mdl-layout--large-screen-only {
  display: none; }

.mdl-layout:not(.is-small-screen) .mdl-layout--small-screen-only {
  display: none; }

.mdl-layout__container {
  position: absolute;
  width: 100%;
  height: 100%; }

.mdl-layout__title, .mdl-layout-title {
  display: block;
  position: relative;
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.02em;
  font-weight: 400;
  box-sizing: border-box; }

.mdl-layout-spacer {
  flex-grow: 1; }

.mdl-layout__drawer {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  width: 240px;
  height: 100%;
  max-height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  box-sizing: border-box;
  border-right: 1px solid rgb(224,224,224);
  background: rgb(250,250,250);
  transform: translateX(-250px);
  transform-style: preserve-3d;
  will-change: transform;
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: transform;
  color: rgb(66,66,66);
  overflow: visible;
  overflow-y: auto;
  z-index: 5; }
  .mdl-layout__drawer.is-visible {
    transform: translateX(0); }
    .mdl-layout__drawer.is-visible ~ .mdl-layout__content.mdl-layout__content {
      overflow: hidden; }
  .mdl-layout__drawer > * {
    flex-shrink: 0; }
  .mdl-layout__drawer > .mdl-layout__title, .mdl-layout__drawer > .mdl-layout-title {
    line-height: 64px;
    padding-left: 40px; }
    @media screen and (max-width: 1024px) {
  .mdl-layout__drawer > .mdl-layout__title, .mdl-layout__drawer > .mdl-layout-title {
    line-height: 56px;
    padding-left: 16px; } }
  .mdl-layout__drawer .mdl-navigation {
    flex-direction: column;
    align-items: stretch;
    padding-top: 16px; }
    .mdl-layout__drawer .mdl-navigation .mdl-navigation__link {
      display: block;
      flex-shrink: 0;
      padding: 16px 40px;
      margin: 0;
      color: #757575; }
    @media screen and (max-width: 1024px) {
    .mdl-layout__drawer .mdl-navigation .mdl-navigation__link {
      padding: 16px 16px; } }
    .mdl-layout__drawer .mdl-navigation .mdl-navigation__link:hover {
      background-color: rgb(224,224,224); }
    .mdl-layout__drawer .mdl-navigation .mdl-navigation__link--current {
      background-color: rgb(224,224,224);
      color: rgb(0,0,0); }
  @media screen and (min-width: 1025px) {
  .mdl-layout--fixed-drawer > .mdl-layout__drawer {
    transform: translateX(0); } }

.mdl-layout__drawer-button {
  display: block;
  position: absolute;
  height: 48px;
  width: 48px;
  border: 0;
  flex-shrink: 0;
  overflow: hidden;
  text-align: center;
  cursor: pointer;
  font-size: 26px;
  line-height: 56px;
  font-family: Helvetica, Arial, sans-serif;
  margin: 8px 12px;
  top: 0;
  left: 0;
  color: rgb($color-primary-contrast);
  z-index: 4; }
  .mdl-layout__header .mdl-layout__drawer-button {
    position: absolute;
    color: rgb($color-primary-contrast);
    background-color: inherit; }
    @media screen and (max-width: 1024px) {
  .mdl-layout__header .mdl-layout__drawer-button {
    margin: 4px; } }
  @media screen and (max-width: 1024px) {
  .mdl-layout__drawer-button {
    margin: 4px;
    color: rgba(0, 0, 0, 0.5); } }
  @media screen and (min-width: 1025px) {
  .mdl-layout__drawer-button {
    line-height: 54px; }
    .mdl-layout--no-desktop-drawer-button .mdl-layout__drawer-button, .mdl-layout--fixed-drawer > .mdl-layout__drawer-button, .mdl-layout--no-drawer-button .mdl-layout__drawer-button {
      display: none; } }

.mdl-layout__header {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  box-sizing: border-box;
  flex-shrink: 0;
  width: 100%;
  margin: 0;
  padding: 0;
  border: none;
  min-height: 64px;
  max-height: 1000px;
  z-index: 3;
  background-color: rgb($color-primary);
  color: rgb($color-primary-contrast);
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: max-height, box-shadow; }
  @media screen and (max-width: 1024px) {
  .mdl-layout__header {
    min-height: 56px; } }
  .mdl-layout--fixed-drawer.is-upgraded:not(.is-small-screen) > .mdl-layout__header {
    margin-left: 240px;
    width: calc(100% - 240px); }
  @media screen and (min-width: 1025px) {
  .mdl-layout--fixed-drawer > .mdl-layout__header .mdl-layout__header-row {
    padding-left: 40px; } }
  .mdl-layout__header > .mdl-layout-icon {
    position: absolute;
    left: 40px;
    top: 16px;
    height: 32px;
    width: 32px;
    overflow: hidden;
    z-index: 3;
    display: block; }
    @media screen and (max-width: 1024px) {
  .mdl-layout__header > .mdl-layout-icon {
    left: 16px;
    top: 12px; } }
  .mdl-layout.has-drawer .mdl-layout__header > .mdl-layout-icon {
    display: none; }
  .mdl-layout__header.is-compact {
    max-height: 64px; }
    @media screen and (max-width: 1024px) {
  .mdl-layout__header.is-compact {
    max-height: 56px; } }
  .mdl-layout__header.is-compact.has-tabs {
    height: 112px; }
    @media screen and (max-width: 1024px) {
  .mdl-layout__header.is-compact.has-tabs {
    min-height: 104px; } }
  @media screen and (max-width: 1024px) {
  .mdl-layout__header {
    display: none; }
  .mdl-layout--fixed-header > .mdl-layout__header {
    display: flex; } }

.mdl-layout__header--transparent.mdl-layout__header--transparent {
  background-color: transparent;
  box-shadow: none; }

.mdl-layout__header--seamed {
  box-shadow: none; }

.mdl-layout__header--scroll {
  box-shadow: none; }

.mdl-layout__header--waterfall {
  box-shadow: none;
  overflow: hidden; }
  .mdl-layout__header--waterfall.is-casting-shadow {
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }
  .mdl-layout__header--waterfall.mdl-layout__header--waterfall-hide-top {
    justify-content: flex-end; }

.mdl-layout__header-row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  flex-shrink: 0;
  box-sizing: border-box;
  align-self: stretch;
  align-items: center;
  height: 64px;
  margin: 0;
  padding: 0 40px 0 80px; }
  .mdl-layout--no-drawer-button .mdl-layout__header-row {
    padding-left: 40px; }
  @media screen and (min-width: 1025px) {
  .mdl-layout--no-desktop-drawer-button .mdl-layout__header-row {
    padding-left: 40px; } }
  @media screen and (max-width: 1024px) {
  .mdl-layout__header-row {
    height: 56px;
    padding: 0 16px 0 72px; }
    .mdl-layout--no-drawer-button .mdl-layout__header-row {
      padding-left: 16px; } }
  .mdl-layout__header-row > * {
    flex-shrink: 0; }
  .mdl-layout__header--scroll .mdl-layout__header-row {
    width: 100%; }
  .mdl-layout__header-row .mdl-navigation {
    margin: 0;
    padding: 0;
    height: 64px;
    flex-direction: row;
    align-items: center; }
    @media screen and (max-width: 1024px) {
  .mdl-layout__header-row .mdl-navigation {
    height: 56px; } }
  .mdl-layout__header-row .mdl-navigation__link {
    display: block;
    color: rgb($color-primary-contrast);
    line-height: 64px;
    padding: 0 24px; }
    @media screen and (max-width: 1024px) {
  .mdl-layout__header-row .mdl-navigation__link {
    line-height: 56px;
    padding: 0 16px; } }

.mdl-layout__obfuscator {
  background-color: transparent;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 4;
  visibility: hidden;
  transition-property: background-color;
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
  .mdl-layout__obfuscator.is-visible {
    background-color: rgba(0, 0, 0, 0.5);
    visibility: visible; }
  @supports (pointer-events: auto) {
  .mdl-layout__obfuscator {
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition-property: opacity;
    visibility: visible;
    pointer-events: none; }
    .mdl-layout__obfuscator.is-visible {
      pointer-events: auto;
      opacity: 1; } }

.mdl-layout__content {
  -ms-flex: 0 1 auto;
  position: relative;
  display: inline-block;
  overflow-y: auto;
  overflow-x: hidden;
  flex-grow: 1;
  z-index: 1;
  -webkit-overflow-scrolling: touch; }
  .mdl-layout--fixed-drawer > .mdl-layout__content {
    margin-left: 240px; }
  .mdl-layout__container.has-scrolling-header .mdl-layout__content {
    overflow: visible; }
  @media screen and (max-width: 1024px) {
  .mdl-layout--fixed-drawer > .mdl-layout__content {
    margin-left: 0; }
  .mdl-layout__container.has-scrolling-header .mdl-layout__content {
    overflow-y: auto;
    overflow-x: hidden; } }

.mdl-layout__tab-bar {
  height: 96px;
  margin: 0;
  width: calc(100% -
        112px);
  padding: 0 0 0 56px;
  display: flex;
  background-color: rgb($color-primary);
  overflow-y: hidden;
  overflow-x: scroll; }
  .mdl-layout__tab-bar::-webkit-scrollbar {
    display: none; }
  .mdl-layout--no-drawer-button .mdl-layout__tab-bar {
    padding-left: 16px;
    width: calc(100% -
          32px); }
  @media screen and (min-width: 1025px) {
  .mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar {
    padding-left: 16px;
    width: calc(100% -
            32px); } }
  @media screen and (max-width: 1024px) {
  .mdl-layout__tab-bar {
    width: calc(100% -
          60px);
    padding: 0 0 0 60px; }
    .mdl-layout--no-drawer-button .mdl-layout__tab-bar {
      width: calc(100% -
            8px);
      padding-left: 4px; } }
  .mdl-layout--fixed-tabs .mdl-layout__tab-bar {
    padding: 0;
    overflow: hidden;
    width: 100%; }

.mdl-layout__tab-bar-container {
  position: relative;
  height: 48px;
  width: 100%;
  border: none;
  margin: 0;
  z-index: 2;
  flex-grow: 0;
  flex-shrink: 0;
  overflow: hidden; }
  .mdl-layout__container > .mdl-layout__tab-bar-container {
    position: absolute;
    top: 0;
    left: 0; }

.mdl-layout__tab-bar-button {
  display: inline-block;
  position: absolute;
  top: 0;
  height: 48px;
  width: 56px;
  z-index: 4;
  text-align: center;
  background-color: rgb($color-primary);
  color: transparent;
  cursor: pointer;
  user-select: none; }
  .mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button, .mdl-layout--no-drawer-button .mdl-layout__tab-bar-button {
    width: 16px; }
    .mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button .material-icons, .mdl-layout--no-drawer-button .mdl-layout__tab-bar-button .material-icons {
      position: relative;
      left: -4px; }
  @media screen and (max-width: 1024px) {
  .mdl-layout__tab-bar-button {
    width: 60px; } }
  .mdl-layout--fixed-tabs .mdl-layout__tab-bar-button {
    display: none; }
  .mdl-layout__tab-bar-button .material-icons {
    line-height: 48px; }
  .mdl-layout__tab-bar-button.is-active {
    color: rgb($color-primary-contrast); }

.mdl-layout__tab-bar-left-button {
  left: 0; }

.mdl-layout__tab-bar-right-button {
  right: 0; }

.mdl-layout__tab {
  margin: 0;
  border: none;
  padding: 0 24px 0 24px;
  float: left;
  position: relative;
  display: block;
  flex-grow: 0;
  flex-shrink: 0;
  text-decoration: none;
  height: 48px;
  line-height: 48px;
  text-align: center;
  font-weight: 500;
  font-size: 14px;
  text-transform: uppercase;
  color: rgba($color-primary-contrast, 0.6);
  overflow: hidden; }
  @media screen and (max-width: 1024px) {
  .mdl-layout__tab {
    padding: 0 12px 0 12px; } }
  .mdl-layout--fixed-tabs .mdl-layout__tab {
    float: none;
    flex-grow: 1;
    padding: 0; }
  .mdl-layout.is-upgraded .mdl-layout__tab.is-active {
    color: rgb($color-primary-contrast); }
  .mdl-layout.is-upgraded .mdl-layout__tab.is-active::after {
    height: 2px;
    width: 100%;
    display: block;
    content: " ";
    bottom: 0;
    left: 0;
    position: absolute;
    background: rgb($color-accent);
    animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) alternate forwards;
    transition: all 1s cubic-bezier(0.4, 0, 1, 1); }
  .mdl-layout__tab .mdl-layout__tab-ripple-container {
    display: block;
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 1;
    overflow: hidden; }
    .mdl-layout__tab .mdl-layout__tab-ripple-container .mdl-ripple {
      background-color: rgb($color-primary-contrast); }

.mdl-layout__tab-panel {
  display: block; }
  .mdl-layout.is-upgraded .mdl-layout__tab-panel {
    display: none; }
  .mdl-layout.is-upgraded .mdl-layout__tab-panel.is-active {
    display: block; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-radio {
  position: relative;
  font-size: 16px;
  line-height: 24px;
  display: inline-block;
  vertical-align: middle;
  box-sizing: border-box;
  height: 24px;
  margin: 0;
  padding-left: 0; }
  .mdl-radio.is-upgraded {
    padding-left: 24px; }

.mdl-radio__button {
  line-height: 24px; }
  .mdl-radio.is-upgraded .mdl-radio__button {
    position: absolute;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    opacity: 0;
    -ms-appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: none; }

.mdl-radio__outer-circle {
  position: absolute;
  top: 4px;
  left: 0;
  display: inline-block;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  margin: 0;
  cursor: pointer;
  border: 2px solid rgba(0,0,0, 0.54);
  border-radius: 50%;
  z-index: 2; }
  .mdl-radio.is-checked .mdl-radio__outer-circle {
    border: 2px solid rgb($color-primary); }
  .mdl-radio__outer-circle fieldset[disabled] .mdl-radio, .mdl-radio.is-disabled .mdl-radio__outer-circle {
    border: 2px solid rgba(0,0,0, 0.26);
    cursor: auto; }

.mdl-radio__inner-circle {
  position: absolute;
  z-index: 1;
  margin: 0;
  top: 8px;
  left: 4px;
  box-sizing: border-box;
  width: 8px;
  height: 8px;
  cursor: pointer;
  transition-duration: 0.28s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: transform;
  transform: scale(0, 0);
  border-radius: 50%;
  background: rgb($color-primary); }
  .mdl-radio.is-checked .mdl-radio__inner-circle {
    transform: scale(1, 1); }
  fieldset[disabled] .mdl-radio .mdl-radio__inner-circle, .mdl-radio.is-disabled .mdl-radio__inner-circle {
    background: rgba(0,0,0, 0.26);
    cursor: auto; }
  .mdl-radio.is-focused .mdl-radio__inner-circle {
    box-shadow: 0 0 0px 10px rgba(0, 0, 0, 0.1); }

.mdl-radio__label {
  cursor: pointer; }
  fieldset[disabled] .mdl-radio .mdl-radio__label, .mdl-radio.is-disabled .mdl-radio__label {
    color: rgba(0,0,0, 0.26);
    cursor: auto; }

.mdl-radio__ripple-container {
  position: absolute;
  z-index: 2;
  top: -9px;
  left: -13px;
  box-sizing: border-box;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  cursor: pointer;
  overflow: hidden;
  -webkit-mask-image: -webkit-radial-gradient(circle, white, black); }
  .mdl-radio__ripple-container .mdl-ripple {
    background: rgb($color-primary); }
  fieldset[disabled] .mdl-radio .mdl-radio__ripple-container, .mdl-radio.is-disabled .mdl-radio__ripple-container {
    cursor: auto; }
  fieldset[disabled] .mdl-radio .mdl-radio__ripple-container .mdl-ripple, .mdl-radio.is-disabled .mdl-radio__ripple-container .mdl-ripple {
    background: transparent; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
_:-ms-input-placeholder, :root .mdl-slider.mdl-slider.is-upgraded {
  -ms-appearance: none;
  height: 32px;
  margin: 0; }

.mdl-slider {
  width: calc(100% - 40px);
  margin: 0 20px; }
  .mdl-slider.is-upgraded {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 2px;
    background: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    outline: 0;
    padding: 0;
    color: rgb($color-primary);
    align-self: center;
    z-index: 1;
    cursor: pointer;
    /**************************** Tracks ****************************/
    /**************************** Thumbs ****************************/
    /**************************** 0-value ****************************/
    /**************************** Disabled ****************************/ }
    .mdl-slider.is-upgraded::-moz-focus-outer {
      border: 0; }
    .mdl-slider.is-upgraded::-ms-tooltip {
      display: none; }
    .mdl-slider.is-upgraded::-webkit-slider-runnable-track {
      background: transparent; }
    .mdl-slider.is-upgraded::-moz-range-track {
      background: transparent;
      border: none; }
    .mdl-slider.is-upgraded::-ms-track {
      background: none;
      color: transparent;
      height: 2px;
      width: 100%;
      border: none; }
    .mdl-slider.is-upgraded::-ms-fill-lower {
      padding: 0;
      background: linear-gradient(to right, transparent, transparent 16px, rgb($color-primary) 16px, rgb($color-primary) 0); }
    .mdl-slider.is-upgraded::-ms-fill-upper {
      padding: 0;
      background: linear-gradient(to left, transparent, transparent 16px, rgba(0,0,0, 0.26) 16px, rgba(0,0,0, 0.26) 0); }
    .mdl-slider.is-upgraded::-webkit-slider-thumb {
      -webkit-appearance: none;
      width: 12px;
      height: 12px;
      box-sizing: border-box;
      border-radius: 50%;
      background: rgb($color-primary);
      border: none;
      transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), border 0.18s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1); }
    .mdl-slider.is-upgraded::-moz-range-thumb {
      -moz-appearance: none;
      width: 12px;
      height: 12px;
      box-sizing: border-box;
      border-radius: 50%;
      background-image: none;
      background: rgb($color-primary);
      border: none; }
    .mdl-slider.is-upgraded:focus:not(:active)::-webkit-slider-thumb {
      box-shadow: 0 0 0 10px rgba($color-primary, 0.26); }
    .mdl-slider.is-upgraded:focus:not(:active)::-moz-range-thumb {
      box-shadow: 0 0 0 10px rgba($color-primary, 0.26); }
    .mdl-slider.is-upgraded:active::-webkit-slider-thumb {
      background-image: none;
      background: rgb($color-primary);
      transform: scale(1.5); }
    .mdl-slider.is-upgraded:active::-moz-range-thumb {
      background-image: none;
      background: rgb($color-primary);
      transform: scale(1.5); }
    .mdl-slider.is-upgraded::-ms-thumb {
      width: 32px;
      height: 32px;
      border: none;
      border-radius: 50%;
      background: rgb($color-primary);
      transform: scale(0.375);
      transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1); }
    .mdl-slider.is-upgraded:focus:not(:active)::-ms-thumb {
      background: radial-gradient(circle closest-side, rgb($color-primary) 0%, rgb($color-primary) 37.5%, rgba($color-primary, 0.26) 37.5%, rgba($color-primary, 0.26) 100%);
      transform: scale(1); }
    .mdl-slider.is-upgraded:active::-ms-thumb {
      background: rgb($color-primary);
      transform: scale(0.5625); }
    .mdl-slider.is-upgraded.is-lowest-value::-webkit-slider-thumb {
      border: 2px solid rgba(0,0,0, 0.26);
      background: transparent; }
    .mdl-slider.is-upgraded.is-lowest-value::-moz-range-thumb {
      border: 2px solid rgba(0,0,0, 0.26);
      background: transparent; }
    .mdl-slider.is-upgraded.is-lowest-value + .mdl-slider__background-flex > .mdl-slider__background-upper {
      left: 6px; }
    .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-webkit-slider-thumb {
      box-shadow: 0 0 0 10px rgba(0,0,0, 0.12);
      background: rgba(0,0,0, 0.12); }
    .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-moz-range-thumb {
      box-shadow: 0 0 0 10px rgba(0,0,0, 0.12);
      background: rgba(0,0,0, 0.12); }
    .mdl-slider.is-upgraded.is-lowest-value:active::-webkit-slider-thumb {
      border: 1.6px solid rgba(0,0,0, 0.26);
      transform: scale(1.5); }
    .mdl-slider.is-upgraded.is-lowest-value:active + .mdl-slider__background-flex > .mdl-slider__background-upper {
      left: 9px; }
    .mdl-slider.is-upgraded.is-lowest-value:active::-moz-range-thumb {
      border: 1.5px solid rgba(0,0,0, 0.26);
      transform: scale(1.5); }
    .mdl-slider.is-upgraded.is-lowest-value::-ms-thumb {
      background: radial-gradient(circle closest-side, transparent 0%, transparent 66.67%, rgba(0,0,0, 0.26) 66.67%, rgba(0,0,0, 0.26) 100%); }
    .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-ms-thumb {
      background: radial-gradient(circle closest-side, rgba(0,0,0, 0.12) 0%, rgba(0,0,0, 0.12) 25%, rgba(0,0,0, 0.26) 25%, rgba(0,0,0, 0.26) 37.5%, rgba(0,0,0, 0.12) 37.5%, rgba(0,0,0, 0.12) 100%);
      transform: scale(1); }
    .mdl-slider.is-upgraded.is-lowest-value:active::-ms-thumb {
      transform: scale(0.5625);
      background: radial-gradient(circle closest-side, transparent 0%, transparent 77.78%, rgba(0,0,0, 0.26) 77.78%, rgba(0,0,0, 0.26) 100%); }
    .mdl-slider.is-upgraded.is-lowest-value::-ms-fill-lower {
      background: transparent; }
    .mdl-slider.is-upgraded.is-lowest-value::-ms-fill-upper {
      margin-left: 6px; }
    .mdl-slider.is-upgraded.is-lowest-value:active::-ms-fill-upper {
      margin-left: 9px; }
    .mdl-slider.is-upgraded:disabled:focus::-webkit-slider-thumb, .mdl-slider.is-upgraded:disabled:active::-webkit-slider-thumb, .mdl-slider.is-upgraded:disabled::-webkit-slider-thumb {
      transform: scale(0.667);
      background: rgba(0,0,0, 0.26); }
    .mdl-slider.is-upgraded:disabled:focus::-moz-range-thumb, .mdl-slider.is-upgraded:disabled:active::-moz-range-thumb, .mdl-slider.is-upgraded:disabled::-moz-range-thumb {
      transform: scale(0.667);
      background: rgba(0,0,0, 0.26); }
    .mdl-slider.is-upgraded:disabled + .mdl-slider__background-flex > .mdl-slider__background-lower {
      background-color: rgba(0,0,0, 0.26);
      left: -6px; }
    .mdl-slider.is-upgraded:disabled + .mdl-slider__background-flex > .mdl-slider__background-upper {
      left: 6px; }
    .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-webkit-slider-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-webkit-slider-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled::-webkit-slider-thumb {
      border: 3px solid rgba(0,0,0, 0.26);
      background: transparent;
      transform: scale(0.667); }
    .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-moz-range-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-moz-range-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled::-moz-range-thumb {
      border: 3px solid rgba(0,0,0, 0.26);
      background: transparent;
      transform: scale(0.667); }
    .mdl-slider.is-upgraded.is-lowest-value:disabled:active + .mdl-slider__background-flex > .mdl-slider__background-upper {
      left: 6px; }
    .mdl-slider.is-upgraded:disabled:focus::-ms-thumb, .mdl-slider.is-upgraded:disabled:active::-ms-thumb, .mdl-slider.is-upgraded:disabled::-ms-thumb {
      transform: scale(0.25);
      background: rgba(0,0,0, 0.26); }
    .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-ms-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled::-ms-thumb {
      transform: scale(0.25);
      background: radial-gradient(circle closest-side, transparent 0%, transparent 50%, rgba(0,0,0, 0.26) 50%, rgba(0,0,0, 0.26) 100%); }
    .mdl-slider.is-upgraded:disabled::-ms-fill-lower {
      margin-right: 6px;
      background: linear-gradient(to right, transparent, transparent 25px, rgba(0,0,0, 0.26) 25px, rgba(0,0,0, 0.26) 0); }
    .mdl-slider.is-upgraded:disabled::-ms-fill-upper {
      margin-left: 6px; }
    .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-fill-upper {
      margin-left: 6px; }

.mdl-slider__ie-container {
  height: 18px;
  overflow: visible;
  border: none;
  margin: none;
  padding: none; }

.mdl-slider__container {
  height: 18px;
  position: relative;
  background: none;
  display: flex;
  flex-direction: row; }

.mdl-slider__background-flex {
  background: transparent;
  position: absolute;
  height: 2px;
  width: calc(100% - 52px);
  top: 50%;
  left: 0;
  margin: 0 26px;
  display: flex;
  overflow: hidden;
  border: 0;
  padding: 0;
  transform: translate(0, -1px); }

.mdl-slider__background-lower {
  background: rgb($color-primary);
  flex: 0;
  position: relative;
  border: 0;
  padding: 0; }

.mdl-slider__background-upper {
  background: rgba(0,0,0, 0.26);
  flex: 0;
  position: relative;
  border: 0;
  padding: 0;
  transition: left 0.18s cubic-bezier(0.4, 0, 0.2, 1); }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-snackbar {
  position: fixed;
  bottom: 0;
  left: 50%;
  cursor: default;
  background-color: #323232;
  z-index: 3;
  display: block;
  display: flex;
  justify-content: space-between;
  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
  will-change: transform;
  transform: translate(0, 80px);
  transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1);
  pointer-events: none; }
  @media (max-width: 479px) {
  .mdl-snackbar {
    width: 100%;
    left: 0;
    min-height: 48px;
    max-height: 80px; } }
  @media (min-width: 480px) {
  .mdl-snackbar {
    min-width: 288px;
    max-width: 568px;
    border-radius: 2px;
    transform: translate(-50%, 80px); } }
  .mdl-snackbar--active {
    transform: translate(0, 0);
    pointer-events: auto;
    transition: transform 0.25s cubic-bezier(0, 0, 0.2, 1); }
    @media (min-width: 480px) {
  .mdl-snackbar--active {
    transform: translate(-50%, 0); } }
  .mdl-snackbar__text {
    padding: 14px 12px 14px 24px;
    vertical-align: middle;
    color: white;
    float: left; }
  .mdl-snackbar__action {
    background: transparent;
    border: none;
    color: rgb($color-accent);
    float: right;
    text-transform: uppercase;
    padding: 14px 24px 14px 12px;
    font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    line-height: 1;
    letter-spacing: 0;
    overflow: hidden;
    outline: none;
    opacity: 0;
    pointer-events: none;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    align-self: center; }
    .mdl-snackbar__action::-moz-focus-inner {
      border: 0; }
    .mdl-snackbar__action:not([aria-hidden]) {
      opacity: 1;
      pointer-events: auto; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-spinner {
  display: inline-block;
  position: relative;
  width: 28px;
  height: 28px; }
  .mdl-spinner:not(.is-upgraded).is-active:after {
    content: "Loading..."; }
  .mdl-spinner.is-upgraded.is-active {
    animation: mdl-spinner__container-rotate 1568.2352941177ms linear infinite; }

@keyframes mdl-spinner__container-rotate {
  to {
    transform: rotate(360deg); } }

.mdl-spinner__layer {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0; }

.mdl-spinner__layer-1 {
  border-color: rgb(66,165,245); }
  .mdl-spinner--single-color .mdl-spinner__layer-1 {
    border-color: rgb($color-primary); }
  .mdl-spinner.is-active .mdl-spinner__layer-1 {
    animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-1-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

.mdl-spinner__layer-2 {
  border-color: rgb(244,67,54); }
  .mdl-spinner--single-color .mdl-spinner__layer-2 {
    border-color: rgb($color-primary); }
  .mdl-spinner.is-active .mdl-spinner__layer-2 {
    animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-2-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

.mdl-spinner__layer-3 {
  border-color: rgb(253,216,53); }
  .mdl-spinner--single-color .mdl-spinner__layer-3 {
    border-color: rgb($color-primary); }
  .mdl-spinner.is-active .mdl-spinner__layer-3 {
    animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-3-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

.mdl-spinner__layer-4 {
  border-color: rgb(76,175,80); }
  .mdl-spinner--single-color .mdl-spinner__layer-4 {
    border-color: rgb($color-primary); }
  .mdl-spinner.is-active .mdl-spinner__layer-4 {
    animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-4-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

@keyframes mdl-spinner__fill-unfill-rotate {
  12.5% {
    transform: rotate(135deg); }

  25% {
    transform: rotate(270deg); }

  37.5% {
    transform: rotate(405deg); }

  50% {
    transform: rotate(540deg); }

  62.5% {
    transform: rotate(675deg); }

  75% {
    transform: rotate(810deg); }

  87.5% {
    transform: rotate(945deg); }

  to {
    transform: rotate(1080deg); } }
/**
 * HACK: Even though the intention is to have the current .mdl-spinner__layer-N
 * at `opacity: 1`, we set it to `opacity: 0.99` instead since this forces Chrome
 * to do proper subpixel rendering for the elements being animated. This is
 * especially visible in Chrome 39 on Ubuntu 14.04. See:
 *
 * - https://github.com/Polymer/paper-spinner/issues/9
 * - https://code.google.com/p/chromium/issues/detail?id=436255
 */
@keyframes mdl-spinner__layer-1-fade-in-out {
  from {
    opacity: 0.99; }

  25% {
    opacity: 0.99; }

  26% {
    opacity: 0; }

  89% {
    opacity: 0; }

  90% {
    opacity: 0.99; }

  100% {
    opacity: 0.99; } }

@keyframes mdl-spinner__layer-2-fade-in-out {
  from {
    opacity: 0; }

  15% {
    opacity: 0; }

  25% {
    opacity: 0.99; }

  50% {
    opacity: 0.99; }

  51% {
    opacity: 0; } }

@keyframes mdl-spinner__layer-3-fade-in-out {
  from {
    opacity: 0; }

  40% {
    opacity: 0; }

  50% {
    opacity: 0.99; }

  75% {
    opacity: 0.99; }

  76% {
    opacity: 0; } }

@keyframes mdl-spinner__layer-4-fade-in-out {
  from {
    opacity: 0; }

  65% {
    opacity: 0; }

  75% {
    opacity: 0.99; }

  90% {
    opacity: 0.99; }

  100% {
    opacity: 0; } }
/**
 * Patch the gap that appear between the two adjacent
 * div.mdl-spinner__circle-clipper while the spinner is rotating
 * (appears on Chrome 38, Safari 7.1, and IE 11).
 *
 * Update: the gap no longer appears on Chrome when .mdl-spinner__layer-N's
 * opacity is 0.99, but still does on Safari and IE.
 */
.mdl-spinner__gap-patch {
  position: absolute;
  box-sizing: border-box;
  top: 0;
  left: 45%;
  width: 10%;
  height: 100%;
  overflow: hidden;
  border-color: inherit; }
  .mdl-spinner__gap-patch .mdl-spinner__circle {
    width: 1000%;
    left: -450%; }

.mdl-spinner__circle-clipper {
  display: inline-block;
  position: relative;
  width: 50%;
  height: 100%;
  overflow: hidden;
  border-color: inherit; }
  .mdl-spinner__circle-clipper.mdl-spinner__left {
    float: left; }
  .mdl-spinner__circle-clipper.mdl-spinner__right {
    float: right; }
  .mdl-spinner__circle-clipper .mdl-spinner__circle {
    width: 200%; }

.mdl-spinner__circle {
  box-sizing: border-box;
  height: 100%;
  border-width: 3px;
  border-style: solid;
  border-color: inherit;
  border-bottom-color: transparent !important;
  border-radius: 50%;
  animation: none;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0; }
  .mdl-spinner__left .mdl-spinner__circle {
    border-right-color: transparent !important;
    transform: rotate(129deg); }
    .mdl-spinner.is-active .mdl-spinner__left .mdl-spinner__circle {
      animation: mdl-spinner__left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }
  .mdl-spinner__right .mdl-spinner__circle {
    left: -100%;
    border-left-color: transparent !important;
    transform: rotate(-129deg); }
    .mdl-spinner.is-active .mdl-spinner__right .mdl-spinner__circle {
      animation: mdl-spinner__right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }

@keyframes mdl-spinner__left-spin {
  from {
    transform: rotate(130deg); }

  50% {
    transform: rotate(-5deg); }

  to {
    transform: rotate(130deg); } }

@keyframes mdl-spinner__right-spin {
  from {
    transform: rotate(-130deg); }

  50% {
    transform: rotate(5deg); }

  to {
    transform: rotate(-130deg); } }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-switch {
  position: relative;
  z-index: 1;
  vertical-align: middle;
  display: inline-block;
  box-sizing: border-box;
  width: 100%;
  height: 24px;
  margin: 0;
  padding: 0;
  overflow: visible;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }
  .mdl-switch.is-upgraded {
    padding-left: 28px; }

.mdl-switch__input {
  line-height: 24px; }
  .mdl-switch.is-upgraded .mdl-switch__input {
    position: absolute;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    opacity: 0;
    -ms-appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: none; }

.mdl-switch__track {
  background: rgba(0,0,0, 0.26);
  position: absolute;
  left: 0;
  top: 5px;
  height: 14px;
  width: 36px;
  border-radius: 14px;
  cursor: pointer; }
  .mdl-switch.is-checked .mdl-switch__track {
    background: rgba($color-primary, 0.5); }
  .mdl-switch__track fieldset[disabled] .mdl-switch, .mdl-switch.is-disabled .mdl-switch__track {
    background: rgba(0,0,0, 0.12);
    cursor: auto; }

.mdl-switch__thumb {
  background: rgb(250,250,250);
  position: absolute;
  left: 0;
  top: 2px;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  transition-duration: 0.28s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-property: left; }
  .mdl-switch.is-checked .mdl-switch__thumb {
    background: rgb($color-primary);
    left: 16px;
    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px 8px 0 rgba(0, 0, 0, 0.12); }
  .mdl-switch__thumb fieldset[disabled] .mdl-switch, .mdl-switch.is-disabled .mdl-switch__thumb {
    background: rgb(189,189,189);
    cursor: auto; }

.mdl-switch__focus-helper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-4px, -4px);
  display: inline-block;
  box-sizing: border-box;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: transparent; }
  .mdl-switch.is-focused .mdl-switch__focus-helper {
    box-shadow: 0 0 0px 20px rgba(0, 0, 0, 0.1);
    background-color: rgba(0, 0, 0, 0.1); }
  .mdl-switch.is-focused.is-checked .mdl-switch__focus-helper {
    box-shadow: 0 0 0px 20px rgba($color-primary, 0.26);
    background-color: rgba($color-primary, 0.26); }

.mdl-switch__label {
  position: relative;
  cursor: pointer;
  font-size: 16px;
  line-height: 24px;
  margin: 0;
  left: 24px; }
  .mdl-switch__label fieldset[disabled] .mdl-switch, .mdl-switch.is-disabled .mdl-switch__label {
    color: rgb(189,189,189);
    cursor: auto; }

.mdl-switch__ripple-container {
  position: absolute;
  z-index: 2;
  top: -12px;
  left: -14px;
  box-sizing: border-box;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  cursor: pointer;
  overflow: hidden;
  -webkit-mask-image: -webkit-radial-gradient(circle, white, black);
  transition-duration: 0.4s;
  transition-timing-function: step-end;
  transition-property: left; }
  .mdl-switch__ripple-container .mdl-ripple {
    background: rgb($color-primary); }
  .mdl-switch__ripple-container fieldset[disabled] .mdl-switch, .mdl-switch.is-disabled .mdl-switch__ripple-container {
    cursor: auto; }
  fieldset[disabled] .mdl-switch .mdl-switch__ripple-container .mdl-ripple, .mdl-switch.is-disabled .mdl-switch__ripple-container .mdl-ripple {
    background: transparent; }
  .mdl-switch.is-checked .mdl-switch__ripple-container {
    left: 2px; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-tabs {
  display: block;
  width: 100%; }

.mdl-tabs__tab-bar {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-content: space-between;
  align-items: flex-start;
  height: 48px;
  padding: 0 0 0 0;
  margin: 0;
  border-bottom: 1px solid rgb(224,224,224); }

.mdl-tabs__tab {
  margin: 0;
  border: none;
  padding: 0 24px 0 24px;
  float: left;
  position: relative;
  display: block;
  text-decoration: none;
  height: 48px;
  line-height: 48px;
  text-align: center;
  font-weight: 500;
  font-size: 14px;
  text-transform: uppercase;
  color: rgba(0,0,0, 0.54);
  overflow: hidden; }
  .mdl-tabs.is-upgraded .mdl-tabs__tab.is-active {
    color: rgba(0,0,0, 0.87); }
  .mdl-tabs.is-upgraded .mdl-tabs__tab.is-active:after {
    height: 2px;
    width: 100%;
    display: block;
    content: " ";
    bottom: 0px;
    left: 0px;
    position: absolute;
    background: rgb($color-primary);
    animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) alternate forwards;
    transition: all 1s cubic-bezier(0.4, 0, 1, 1); }
  .mdl-tabs__tab .mdl-tabs__ripple-container {
    display: block;
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0px;
    top: 0px;
    z-index: 1;
    overflow: hidden; }
    .mdl-tabs__tab .mdl-tabs__ripple-container .mdl-ripple {
      background: rgb($color-primary); }

.mdl-tabs__panel {
  display: block; }
  .mdl-tabs.is-upgraded .mdl-tabs__panel {
    display: none; }
  .mdl-tabs.is-upgraded .mdl-tabs__panel.is-active {
    display: block; }

@keyframes border-expand {
  0% {
    opacity: 0;
    width: 0; }

  100% {
    opacity: 1;
    width: 100%; } }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-textfield {
  position: relative;
  font-size: 16px;
  display: inline-block;
  box-sizing: border-box;
  width: 300px;
  max-width: 100%;
  margin: 0;
  padding: 20px 0; }
  .mdl-textfield .mdl-button {
    position: absolute;
    bottom: 20px; }

.mdl-textfield--align-right {
  text-align: right; }

.mdl-textfield--full-width {
  width: 100%; }

.mdl-textfield--expandable {
  min-width: 32px;
  width: auto;
  min-height: 32px; }
  .mdl-textfield--expandable .mdl-button--icon {
    top: 16px; }

.mdl-textfield__input {
  border: none;
  border-bottom: 1px solid rgba(0,0,0, 0.12);
  display: block;
  font-size: 16px;
  font-family: 'Helvetica', 'Arial', sans-serif;
  margin: 0;
  padding: 4px 0;
  width: 100%;
  background: none;
  text-align: left;
  color: inherit; }
  .mdl-textfield__input[type="number"] {
    -moz-appearance: textfield; }
  .mdl-textfield__input[type="number"]::-webkit-inner-spin-button, .mdl-textfield__input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0; }
  .mdl-textfield.is-focused .mdl-textfield__input {
    outline: none; }
  .mdl-textfield.is-invalid .mdl-textfield__input {
    border-color: rgb(213,0,0);
    box-shadow: none; }
  fieldset[disabled] .mdl-textfield .mdl-textfield__input, .mdl-textfield.is-disabled .mdl-textfield__input {
    background-color: transparent;
    border-bottom: 1px dotted rgba(0,0,0, 0.12);
    color: rgba(0,0,0, 0.26); }

.mdl-textfield textarea.mdl-textfield__input {
  display: block; }

.mdl-textfield__label {
  bottom: 0;
  color: rgba(0,0,0, 0.26);
  font-size: 16px;
  left: 0;
  right: 0;
  pointer-events: none;
  position: absolute;
  display: block;
  top: 24px;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-align: left; }
  .mdl-textfield.is-dirty .mdl-textfield__label, .mdl-textfield.has-placeholder .mdl-textfield__label {
    visibility: hidden; }
  .mdl-textfield--floating-label .mdl-textfield__label {
    transition-duration: 0.2s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
  .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
    transition: none; }
  fieldset[disabled] .mdl-textfield .mdl-textfield__label, .mdl-textfield.is-disabled.is-disabled .mdl-textfield__label {
    color: rgba(0,0,0, 0.26); }
  .mdl-textfield--floating-label.is-focused .mdl-textfield__label, .mdl-textfield--floating-label.is-dirty .mdl-textfield__label, .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
    color: rgb($color-primary);
    font-size: 12px;
    top: 4px;
    visibility: visible; }
  .mdl-textfield--floating-label.is-focused .mdl-textfield__expandable-holder .mdl-textfield__label, .mdl-textfield--floating-label.is-dirty .mdl-textfield__expandable-holder .mdl-textfield__label, .mdl-textfield--floating-label.has-placeholder .mdl-textfield__expandable-holder .mdl-textfield__label {
    top: -16px; }
  .mdl-textfield--floating-label.is-invalid .mdl-textfield__label {
    color: rgb(213,0,0);
    font-size: 12px; }
  .mdl-textfield__label:after {
    background-color: rgb($color-primary);
    bottom: 20px;
    content: '';
    height: 2px;
    left: 45%;
    position: absolute;
    transition-duration: 0.2s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    visibility: hidden;
    width: 10px; }
  .mdl-textfield.is-focused .mdl-textfield__label:after {
    left: 0;
    visibility: visible;
    width: 100%; }
  .mdl-textfield.is-invalid .mdl-textfield__label:after {
    background-color: rgb(213,0,0); }

.mdl-textfield__error {
  color: rgb(213,0,0);
  position: absolute;
  font-size: 12px;
  margin-top: 3px;
  visibility: hidden;
  display: block; }
  .mdl-textfield.is-invalid .mdl-textfield__error {
    visibility: visible; }

.mdl-textfield__expandable-holder {
  display: inline-block;
  position: relative;
  margin-left: 32px;
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  display: inline-block;
  max-width: 0.1px; }
  .mdl-textfield.is-focused .mdl-textfield__expandable-holder, .mdl-textfield.is-dirty .mdl-textfield__expandable-holder {
    max-width: 600px; }
  .mdl-textfield__expandable-holder .mdl-textfield__label:after {
    bottom: 0; }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-tooltip {
  transform: scale(0);
  transform-origin: top center;
  z-index: 999;
  background: rgba(97,97,97, 0.9);
  border-radius: 2px;
  color: rgb(255,255,255);
  display: inline-block;
  font-size: 10px;
  font-weight: 500;
  line-height: 14px;
  max-width: 170px;
  position: fixed;
  top: -500px;
  left: -500px;
  padding: 8px;
  text-align: center; }

.mdl-tooltip.is-active {
  animation: pulse 200ms cubic-bezier(0, 0, 0.2, 1) forwards; }

.mdl-tooltip--large {
  line-height: 14px;
  font-size: 14px;
  padding: 16px; }

@keyframes pulse {
  0% {
    transform: scale(0);
    opacity: 0; }

  50% {
    transform: scale(0.99); }

  100% {
    transform: scale(1);
    opacity: 1;
    visibility: visible; } }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* Typography */
/* Shadows */
/* Animations */
/* Dialog */
.mdl-shadow--2dp {
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }

.mdl-shadow--3dp {
  box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px 8px 0 rgba(0, 0, 0, 0.12); }

.mdl-shadow--4dp {
  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2); }

.mdl-shadow--6dp {
  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2); }

.mdl-shadow--8dp {
  box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); }

.mdl-shadow--16dp {
  box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2); }

.mdl-shadow--24dp {
  box-shadow: 0 9px 46px 8px rgba(0, 0, 0, 0.14), 0 11px 15px -7px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.2); }
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/*
 * NOTE: Some rules here are applied using duplicate selectors.
 * This is on purpose to increase their specificity when applied.
 * For example: `.mdl-cell--1-col-phone.mdl-cell--1-col-phone`
 */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/*------------------------------------*\
 $CONTENTS
 \*------------------------------------*/
/**
 * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
 * -----Typography
 * -----Colors
 * -----Textfield
 * -----Switch
 * -----Spinner
 * -----Radio
 * -----Menu
 * -----List
 * -----Layout
 * -----Icon toggles
 * -----Footer
 * -----Column
 * -----Checkbox
 * -----Card
 * -----Button
 * -----Animation
 * -----Progress
 * -----Badge
 * -----Shadows
 * -----Grid
 * -----Data table
 * -----Dialog
 * -----Snackbar
 * -----Tooltip
 * -----Chip
 *
 * Even though all variables have the `!default` directive, most of them
 * should not be changed as they are dependent on one another. This can cause
 * visual distortions (like alignment issues) that are hard to track down
 * and fix.
 */
/* ==========  TYPOGRAPHY  ========== */
/* We're splitting fonts into "preferred" and "performance" in order to optimize
 page loading. For important text, such as the body, we want it to load
 immediately and not wait for the web font load, whereas for other sections,
 such as headers and titles, we're OK with things taking a bit longer to load.
 We do have some optional classes and parameters in the mixins, in case you
 definitely want to make sure you're using the preferred font and don't mind
 the performance hit.
 We should be able to improve on this once CSS Font Loading L3 becomes more
 widely available.
 */
/* ==========  COLORS  ========== */
/**
 *
 * Material design color palettes.
 * @see http://www.google.com/design/spec/style/color.html
 *
 **/
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  Color Palettes  ========== */
/* colors.scss */
/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 */
/* ==========  IMAGES  ========== */
/* ==========  Color & Themes  ========== */
/* ==========  Typography  ========== */
/* ==========  Components  ========== */
/* ==========  Standard Buttons  ========== */
/* ==========  Icon Toggles  ========== */
/* ==========  Radio Buttons  ========== */
/* ==========  Ripple effect  ========== */
/* ==========  Layout  ========== */
/* ==========  Content Tabs  ========== */
/* ==========  Checkboxes  ========== */
/* ==========  Switches  ========== */
/* ==========  Spinner  ========== */
/* ==========  Text fields  ========== */
/* ==========  Card  ========== */
/* ==========  Sliders ========== */
/* ========== Progress ========== */
/* ==========  List ========== */
/* ==========  Item ========== */
/* ==========  Dropdown menu ========== */
/* ==========  Tooltips  ========== */
/* ==========  Footer  ========== */
/* TEXTFIELD */
/* SWITCH */
/* SPINNER */
/* RADIO */
/* MENU */
/* LIST */
/* LAYOUT */
/* ICON TOGGLE */
/* FOOTER */
/*mega-footer*/
/*mini-footer*/
/* CHECKBOX */
/* CARD */
/* Card dimensions */
/* Cover image */
/* BUTTON */
/**
 *
 * Dimensions
 *
 */
/* ANIMATION */
/* PROGRESS */
/* BADGE */
/* SHADOWS */
/* GRID */
/* DATA TABLE */
/* DIALOG */
/* SNACKBAR */
/* TOOLTIP */
/* CHIP */
.mdl-grid {
  display: flex;
  flex-flow: row wrap;
  margin: 0 auto 0 auto;
  align-items: stretch; }
  .mdl-grid.mdl-grid--no-spacing {
    padding: 0; }

.mdl-cell {
  box-sizing: border-box; }

.mdl-cell--top {
  align-self: flex-start; }

.mdl-cell--middle {
  align-self: center; }

.mdl-cell--bottom {
  align-self: flex-end; }

.mdl-cell--stretch {
  align-self: stretch; }

.mdl-grid.mdl-grid--no-spacing > .mdl-cell {
  margin: 0; }

.mdl-cell--order-1 {
  order: 1; }

.mdl-cell--order-2 {
  order: 2; }

.mdl-cell--order-3 {
  order: 3; }

.mdl-cell--order-4 {
  order: 4; }

.mdl-cell--order-5 {
  order: 5; }

.mdl-cell--order-6 {
  order: 6; }

.mdl-cell--order-7 {
  order: 7; }

.mdl-cell--order-8 {
  order: 8; }

.mdl-cell--order-9 {
  order: 9; }

.mdl-cell--order-10 {
  order: 10; }

.mdl-cell--order-11 {
  order: 11; }

.mdl-cell--order-12 {
  order: 12; }

@media (max-width: 479px) {
  .mdl-grid {
    padding: 8px; }
    .mdl-cell {
      margin: 8px;
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell {
        width: 100%; }
    .mdl-cell--hide-phone {
      display: none !important; }
    .mdl-cell--order-1-phone.mdl-cell--order-1-phone {
      order: 1; }
    .mdl-cell--order-2-phone.mdl-cell--order-2-phone {
      order: 2; }
    .mdl-cell--order-3-phone.mdl-cell--order-3-phone {
      order: 3; }
    .mdl-cell--order-4-phone.mdl-cell--order-4-phone {
      order: 4; }
    .mdl-cell--order-5-phone.mdl-cell--order-5-phone {
      order: 5; }
    .mdl-cell--order-6-phone.mdl-cell--order-6-phone {
      order: 6; }
    .mdl-cell--order-7-phone.mdl-cell--order-7-phone {
      order: 7; }
    .mdl-cell--order-8-phone.mdl-cell--order-8-phone {
      order: 8; }
    .mdl-cell--order-9-phone.mdl-cell--order-9-phone {
      order: 9; }
    .mdl-cell--order-10-phone.mdl-cell--order-10-phone {
      order: 10; }
    .mdl-cell--order-11-phone.mdl-cell--order-11-phone {
      order: 11; }
    .mdl-cell--order-12-phone.mdl-cell--order-12-phone {
      order: 12; }
    .mdl-cell--1-col, .mdl-cell--1-col-phone.mdl-cell--1-col-phone {
      width: calc(25% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing > .mdl-cell--1-col-phone.mdl-cell--1-col-phone {
        width: 25%; }
    .mdl-cell--2-col, .mdl-cell--2-col-phone.mdl-cell--2-col-phone {
      width: calc(50% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing > .mdl-cell--2-col-phone.mdl-cell--2-col-phone {
        width: 50%; }
    .mdl-cell--3-col, .mdl-cell--3-col-phone.mdl-cell--3-col-phone {
      width: calc(75% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing > .mdl-cell--3-col-phone.mdl-cell--3-col-phone {
        width: 75%; }
    .mdl-cell--4-col, .mdl-cell--4-col-phone.mdl-cell--4-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing > .mdl-cell--4-col-phone.mdl-cell--4-col-phone {
        width: 100%; }
    .mdl-cell--5-col, .mdl-cell--5-col-phone.mdl-cell--5-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing > .mdl-cell--5-col-phone.mdl-cell--5-col-phone {
        width: 100%; }
    .mdl-cell--6-col, .mdl-cell--6-col-phone.mdl-cell--6-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing > .mdl-cell--6-col-phone.mdl-cell--6-col-phone {
        width: 100%; }
    .mdl-cell--7-col, .mdl-cell--7-col-phone.mdl-cell--7-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing > .mdl-cell--7-col-phone.mdl-cell--7-col-phone {
        width: 100%; }
    .mdl-cell--8-col, .mdl-cell--8-col-phone.mdl-cell--8-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing > .mdl-cell--8-col-phone.mdl-cell--8-col-phone {
        width: 100%; }
    .mdl-cell--9-col, .mdl-cell--9-col-phone.mdl-cell--9-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing > .mdl-cell--9-col-phone.mdl-cell--9-col-phone {
        width: 100%; }
    .mdl-cell--10-col, .mdl-cell--10-col-phone.mdl-cell--10-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing > .mdl-cell--10-col-phone.mdl-cell--10-col-phone {
        width: 100%; }
    .mdl-cell--11-col, .mdl-cell--11-col-phone.mdl-cell--11-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing > .mdl-cell--11-col-phone.mdl-cell--11-col-phone {
        width: 100%; }
    .mdl-cell--12-col, .mdl-cell--12-col-phone.mdl-cell--12-col-phone {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing > .mdl-cell--12-col-phone.mdl-cell--12-col-phone {
        width: 100%; }
    .mdl-cell--1-offset, .mdl-cell--1-offset-phone.mdl-cell--1-offset-phone {
      margin-left: calc(25% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset-phone.mdl-cell--1-offset-phone {
        margin-left: 25%; }
    .mdl-cell--2-offset, .mdl-cell--2-offset-phone.mdl-cell--2-offset-phone {
      margin-left: calc(50% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset-phone.mdl-cell--2-offset-phone {
        margin-left: 50%; }
    .mdl-cell--3-offset, .mdl-cell--3-offset-phone.mdl-cell--3-offset-phone {
      margin-left: calc(75% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset-phone.mdl-cell--3-offset-phone {
        margin-left: 75%; } }

@media (min-width: 480px) and (max-width: 839px) {
  .mdl-grid {
    padding: 8px; }
    .mdl-cell {
      margin: 8px;
      width: calc(50% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell {
        width: 50%; }
    .mdl-cell--hide-tablet {
      display: none !important; }
    .mdl-cell--order-1-tablet.mdl-cell--order-1-tablet {
      order: 1; }
    .mdl-cell--order-2-tablet.mdl-cell--order-2-tablet {
      order: 2; }
    .mdl-cell--order-3-tablet.mdl-cell--order-3-tablet {
      order: 3; }
    .mdl-cell--order-4-tablet.mdl-cell--order-4-tablet {
      order: 4; }
    .mdl-cell--order-5-tablet.mdl-cell--order-5-tablet {
      order: 5; }
    .mdl-cell--order-6-tablet.mdl-cell--order-6-tablet {
      order: 6; }
    .mdl-cell--order-7-tablet.mdl-cell--order-7-tablet {
      order: 7; }
    .mdl-cell--order-8-tablet.mdl-cell--order-8-tablet {
      order: 8; }
    .mdl-cell--order-9-tablet.mdl-cell--order-9-tablet {
      order: 9; }
    .mdl-cell--order-10-tablet.mdl-cell--order-10-tablet {
      order: 10; }
    .mdl-cell--order-11-tablet.mdl-cell--order-11-tablet {
      order: 11; }
    .mdl-cell--order-12-tablet.mdl-cell--order-12-tablet {
      order: 12; }
    .mdl-cell--1-col, .mdl-cell--1-col-tablet.mdl-cell--1-col-tablet {
      width: calc(12.5% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing > .mdl-cell--1-col-tablet.mdl-cell--1-col-tablet {
        width: 12.5%; }
    .mdl-cell--2-col, .mdl-cell--2-col-tablet.mdl-cell--2-col-tablet {
      width: calc(25% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing > .mdl-cell--2-col-tablet.mdl-cell--2-col-tablet {
        width: 25%; }
    .mdl-cell--3-col, .mdl-cell--3-col-tablet.mdl-cell--3-col-tablet {
      width: calc(37.5% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing > .mdl-cell--3-col-tablet.mdl-cell--3-col-tablet {
        width: 37.5%; }
    .mdl-cell--4-col, .mdl-cell--4-col-tablet.mdl-cell--4-col-tablet {
      width: calc(50% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing > .mdl-cell--4-col-tablet.mdl-cell--4-col-tablet {
        width: 50%; }
    .mdl-cell--5-col, .mdl-cell--5-col-tablet.mdl-cell--5-col-tablet {
      width: calc(62.5% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing > .mdl-cell--5-col-tablet.mdl-cell--5-col-tablet {
        width: 62.5%; }
    .mdl-cell--6-col, .mdl-cell--6-col-tablet.mdl-cell--6-col-tablet {
      width: calc(75% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing > .mdl-cell--6-col-tablet.mdl-cell--6-col-tablet {
        width: 75%; }
    .mdl-cell--7-col, .mdl-cell--7-col-tablet.mdl-cell--7-col-tablet {
      width: calc(87.5% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing > .mdl-cell--7-col-tablet.mdl-cell--7-col-tablet {
        width: 87.5%; }
    .mdl-cell--8-col, .mdl-cell--8-col-tablet.mdl-cell--8-col-tablet {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing > .mdl-cell--8-col-tablet.mdl-cell--8-col-tablet {
        width: 100%; }
    .mdl-cell--9-col, .mdl-cell--9-col-tablet.mdl-cell--9-col-tablet {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing > .mdl-cell--9-col-tablet.mdl-cell--9-col-tablet {
        width: 100%; }
    .mdl-cell--10-col, .mdl-cell--10-col-tablet.mdl-cell--10-col-tablet {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing > .mdl-cell--10-col-tablet.mdl-cell--10-col-tablet {
        width: 100%; }
    .mdl-cell--11-col, .mdl-cell--11-col-tablet.mdl-cell--11-col-tablet {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing > .mdl-cell--11-col-tablet.mdl-cell--11-col-tablet {
        width: 100%; }
    .mdl-cell--12-col, .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing > .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
        width: 100%; }
    .mdl-cell--1-offset, .mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet {
      margin-left: calc(12.5% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet {
        margin-left: 12.5%; }
    .mdl-cell--2-offset, .mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet {
      margin-left: calc(25% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet {
        margin-left: 25%; }
    .mdl-cell--3-offset, .mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet {
      margin-left: calc(37.5% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet {
        margin-left: 37.5%; }
    .mdl-cell--4-offset, .mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet {
      margin-left: calc(50% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet {
        margin-left: 50%; }
    .mdl-cell--5-offset, .mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet {
      margin-left: calc(62.5% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet {
        margin-left: 62.5%; }
    .mdl-cell--6-offset, .mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet {
      margin-left: calc(75% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet {
        margin-left: 75%; }
    .mdl-cell--7-offset, .mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet {
      margin-left: calc(87.5% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet {
        margin-left: 87.5%; } }

@media (min-width: 840px) {
  .mdl-grid {
    padding: 8px; }
    .mdl-cell {
      margin: 8px;
      width: calc(33.3333333333% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell {
        width: 33.3333333333%; }
    .mdl-cell--hide-desktop {
      display: none !important; }
    .mdl-cell--order-1-desktop.mdl-cell--order-1-desktop {
      order: 1; }
    .mdl-cell--order-2-desktop.mdl-cell--order-2-desktop {
      order: 2; }
    .mdl-cell--order-3-desktop.mdl-cell--order-3-desktop {
      order: 3; }
    .mdl-cell--order-4-desktop.mdl-cell--order-4-desktop {
      order: 4; }
    .mdl-cell--order-5-desktop.mdl-cell--order-5-desktop {
      order: 5; }
    .mdl-cell--order-6-desktop.mdl-cell--order-6-desktop {
      order: 6; }
    .mdl-cell--order-7-desktop.mdl-cell--order-7-desktop {
      order: 7; }
    .mdl-cell--order-8-desktop.mdl-cell--order-8-desktop {
      order: 8; }
    .mdl-cell--order-9-desktop.mdl-cell--order-9-desktop {
      order: 9; }
    .mdl-cell--order-10-desktop.mdl-cell--order-10-desktop {
      order: 10; }
    .mdl-cell--order-11-desktop.mdl-cell--order-11-desktop {
      order: 11; }
    .mdl-cell--order-12-desktop.mdl-cell--order-12-desktop {
      order: 12; }
    .mdl-cell--1-col, .mdl-cell--1-col-desktop.mdl-cell--1-col-desktop {
      width: calc(8.3333333333% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing > .mdl-cell--1-col-desktop.mdl-cell--1-col-desktop {
        width: 8.3333333333%; }
    .mdl-cell--2-col, .mdl-cell--2-col-desktop.mdl-cell--2-col-desktop {
      width: calc(16.6666666667% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing > .mdl-cell--2-col-desktop.mdl-cell--2-col-desktop {
        width: 16.6666666667%; }
    .mdl-cell--3-col, .mdl-cell--3-col-desktop.mdl-cell--3-col-desktop {
      width: calc(25% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing > .mdl-cell--3-col-desktop.mdl-cell--3-col-desktop {
        width: 25%; }
    .mdl-cell--4-col, .mdl-cell--4-col-desktop.mdl-cell--4-col-desktop {
      width: calc(33.3333333333% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing > .mdl-cell--4-col-desktop.mdl-cell--4-col-desktop {
        width: 33.3333333333%; }
    .mdl-cell--5-col, .mdl-cell--5-col-desktop.mdl-cell--5-col-desktop {
      width: calc(41.6666666667% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing > .mdl-cell--5-col-desktop.mdl-cell--5-col-desktop {
        width: 41.6666666667%; }
    .mdl-cell--6-col, .mdl-cell--6-col-desktop.mdl-cell--6-col-desktop {
      width: calc(50% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing > .mdl-cell--6-col-desktop.mdl-cell--6-col-desktop {
        width: 50%; }
    .mdl-cell--7-col, .mdl-cell--7-col-desktop.mdl-cell--7-col-desktop {
      width: calc(58.3333333333% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing > .mdl-cell--7-col-desktop.mdl-cell--7-col-desktop {
        width: 58.3333333333%; }
    .mdl-cell--8-col, .mdl-cell--8-col-desktop.mdl-cell--8-col-desktop {
      width: calc(66.6666666667% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing > .mdl-cell--8-col-desktop.mdl-cell--8-col-desktop {
        width: 66.6666666667%; }
    .mdl-cell--9-col, .mdl-cell--9-col-desktop.mdl-cell--9-col-desktop {
      width: calc(75% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing > .mdl-cell--9-col-desktop.mdl-cell--9-col-desktop {
        width: 75%; }
    .mdl-cell--10-col, .mdl-cell--10-col-desktop.mdl-cell--10-col-desktop {
      width: calc(83.3333333333% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing > .mdl-cell--10-col-desktop.mdl-cell--10-col-desktop {
        width: 83.3333333333%; }
    .mdl-cell--11-col, .mdl-cell--11-col-desktop.mdl-cell--11-col-desktop {
      width: calc(91.6666666667% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing > .mdl-cell--11-col-desktop.mdl-cell--11-col-desktop {
        width: 91.6666666667%; }
    .mdl-cell--12-col, .mdl-cell--12-col-desktop.mdl-cell--12-col-desktop {
      width: calc(100% - 16px); }
      .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing > .mdl-cell--12-col-desktop.mdl-cell--12-col-desktop {
        width: 100%; }
    .mdl-cell--1-offset, .mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop {
      margin-left: calc(8.3333333333% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop {
        margin-left: 8.3333333333%; }
    .mdl-cell--2-offset, .mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop {
      margin-left: calc(16.6666666667% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop {
        margin-left: 16.6666666667%; }
    .mdl-cell--3-offset, .mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop {
      margin-left: calc(25% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop {
        margin-left: 25%; }
    .mdl-cell--4-offset, .mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop {
      margin-left: calc(33.3333333333% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop {
        margin-left: 33.3333333333%; }
    .mdl-cell--5-offset, .mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop {
      margin-left: calc(41.6666666667% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop {
        margin-left: 41.6666666667%; }
    .mdl-cell--6-offset, .mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop {
      margin-left: calc(50% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop {
        margin-left: 50%; }
    .mdl-cell--7-offset, .mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop {
      margin-left: calc(58.3333333333% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop {
        margin-left: 58.3333333333%; }
    .mdl-cell--8-offset, .mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop {
      margin-left: calc(66.6666666667% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--8-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop {
        margin-left: 66.6666666667%; }
    .mdl-cell--9-offset, .mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop {
      margin-left: calc(75% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--9-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop {
        margin-left: 75%; }
    .mdl-cell--10-offset, .mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop {
      margin-left: calc(83.3333333333% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--10-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop {
        margin-left: 83.3333333333%; }
    .mdl-cell--11-offset, .mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop {
      margin-left: calc(91.6666666667% + 8px); }
      .mdl-grid.mdl-grid--no-spacing > .mdl-cell--11-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop {
        margin-left: 91.6666666667%; } }
/*------------------------------------------------------------------
 [Master SASS Stylesheet]
 Project  :  MDL Template
 Version  :  1.2
 Author   :
 Website  :
 Theme Color :
 -------------------------------------------------------------------*/
/**
 * Table of Contents :
 * 1.0 - BASIC CSS START
 * 2.0 -  DEFAULT CSS START
 *        2.1 - OVERRIDING CSS START
 *        2.2 - COMMON CSS START
 *        2.3 - LAYOUT CSS START
 *        2.4 - FONT SIZE CSS START
 *        2.5 - COLOR CSS START
 *        2.6 - BUTTON CSS START
 *        2.7 - THEME BLOCK CSS START
 *        2.8 - THEME ACCORDION CSS START
 *        2.9 - THEME DROPCAP CSS START
 *        2.10 - THEME CATEGORY LIST CSS START
 *        2.11 - THEME MATERIAL CARD CSS START
 *        2.12 - THEME TAG CSS START
 *        2.13 - THEME PAGINATION CSS START
 *        2.14 - THEME FLEXSLIDER CSS START
 *        2.15 - SOCIAL BUTTON CSS START
 *        2.16 - THEME DROPDOWN CSS START
 *        2.17 - THEME TABLE CSS START
 *        2.18 - THEME IMAGE CSS START
 *        2.19 - THEME QUOTE CSS START
 *        2.20 - PAGE TITLE CSS START
 *        2.21 - NOT FOUND PAGE CSS START
 * 3.0 -  HEADER CSS START
 * 4.0 -  HEADER 2 CSS START
 * 5.0 -  HOME PAGE CSS START
 *        5.1 - BANNER CSS START
 *        5.2 - HOME SERVICE CSS START
 *        5.3 - HOME ABOUT CSS START
 *        5.4 - HOME PRODUCT SLIDER CSS START
 *        5.5 - HOME FEATURE CSS START
 *        5.6 - HOME TESTIMONIAL CSS START
 * 6.0 -  SERVICE PAGE CSS START
 *        6.1 - SERVICE CARD CSS START
 *        6.1 - FEATURE CSS START
 * 7.0 -  PRODUCT PAGE CSS START
 *        7.1 - PRODUCT CARD CSS START
 *        7.2 - DEPARTMENT CSS START
 * 8.0 -  ABOUT PAGE CSS START
 * 9.0 -  CONTACT PAGE CSS START
 *        9.1 - CONTACT CSS START
 *        9.2 - MAP CSS START
 * 10.0 - LOGIN PAGE CSS START
 * 11.0 - FORM INPUT CSS START
 * 12.0 - MYAPPOINTMENT PAGE CSS START
 * 13.0 - GALLERY PAGE CSS START
 * 14.0 - BLOGS LIST PAGE CSS START
 * 15.0 - BLOG PAGE CSS START
 * 16.0 - FOOTER CSS START
 *        16.1 - EMERGENCY LAYER CSS START
 *        16.2 - MAIN FOOTER CSS START
 *        16.3 - FOOTER COPYRIGHT CSS START
 * 17.0 - MEDIA QUERIES START
 [Color codes]
 Background: #FAFAFA ( Body Color )
 Content:    #555 ( Light black )
 Content:    #777 ( Lighter black )
 Content:    #DDD ( Lighter White )
 Content:    #EEE ( Light White )
 Header h1:  #333 ( Black )
 Header h2:  #555 ( Light Black )
 Primary Color: $color-primary-0 ( Check 'scss/theme/variable.scss' file )
 a (active): $color-links ( Check 'scss/theme/variable.scss' file)
 Footer:     $color-footer-background ( Check 'scss/theme/variable.scss' file )
 Blue Color = #32C1CE ( Blue Theme Color )
 Green Color = #54C798 ( Green Theme Color )
 Orange Color = #EFA752 ( Orange Theme Color )
 Purple Color = #A675D4 ( Purple Theme Color )
 [Typography]
 Body copy:  14px/ font-family: "Montserrat", sans-serif;
 h1, h2, h3, h4, h5, h6: 36px/ font-family: "lato", sans-serif;
 Sidebar heading:  font-family: "lato", sans-serif;
 Input, textarea:  font-family: "Montserrat", sans-serif;
 -------------------------------------------------------------------*/
/************************************************
 [ 1.0 - BASIC CSS START ] ***********************
 *************************************************/
html {
  height: 100% !important; }

body {
  position: relative;
  width: 100%;
  height: 100%;
  line-height: 1.6;
  padding: 0;
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  background-color: #666;
  text-rendering: optimizeLegibility !important;
  -webkit-font-smoothing: antialiased !important; }

table {
  border-spacing: 0;
  border-collapse: collapse; }

a {
  text-decoration: none !important;
  color: #e3d6a5;
  line-height: 1.6;
  font-weight: 400;
  cursor: pointer; }
  a:hover, a:active {
    outline: 0;
    color: #ffc107; }

p, span {
  line-height: 1.6; }

label {
  line-height: 1.6;
  font-weight: 400;
  margin: 0; }

input, textarea {
  font-family: 'Montserrat', sans-serif;
  -webkit-box-shadow: none;
  box-shadow: none;
  background-color: transparent;
  border: 0; }
  input:focus, textarea:focus {
    border: 0;
    outline: 0; }

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0; }

textarea {
  resize: none; }

button {
  background-color: transparent;
  border: 0; }
  button:active {
    outline: none; }

select {
  border: none;
  outline: none; }
  select:focus {
    border: none;
    outline: none; }

h1, h2, h3, h4, h5, h6 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: normal; }

h1 {
  font-size: 36px; }

h2 {
  font-size: 30px; }

h3 {
  font-size: 24px; }

h4 {
  font-size: 20px; }

h5 {
  font-size: 16px; }

h6 {
  font-size: 14px; }

blockquote {
  font-family: 'Montserrat', sans-serif; }
  blockquote::after {
    display: none; }
  blockquote::before {
    display: none; }
/**************************************************
 [ 2.0 - DEFAULT CSS START ] ***********************
 ***************************************************/
/* [ 2.1 OVERRIDING CSS START ] */
.mdl-button, .mdl-textfield__input {
  font-family: 'Montserrat', sans-serif; }

.mdl-textfield__label::after, .mdl-selectfield__label::after {
  background-color: #ffc107; }

.mdl-textfield--floating-label.is-focused .mdl-textfield__label, .mdl-textfield--floating-label.is-dirty .mdl-textfield__label, .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label, .mdl-selectfield--floating-label.is-focused .mdl-selectfield__label, .mdl-selectfield--floating-label.is-dirty .mdl-selectfield__label {
  color: #ffc107; }

.mdl-card.mdl-shadow--2dp {
  width: 100%; }

.mdl-card__title {
  height: 300px; }

.img-thumbnail, .modal-content {
  border-radius: 2px; }

.fc th {
  background: #ffc107; }

.fc-state-down, .fc-state-active {
  color: #fff;
  background: #ffc107; }

.mdl-data-table {
  width: 100%; }

.alert {
  font-size: 13px;
  letter-spacing: 0.5px;
  text-align: left; }

.card-title {
  margin-top: 0; }

.modal-header h5 {
  font-size: 24px; }

.badge {
  padding: 0.4em 0.8em;
  font-size: 100%;
  letter-spacing: 0.5px;
  vertical-align: baseline;
  font-weight: 500; }

.badge-primary {
  background-color: #ffc107; }

.badge-secondary {
  background-color: #b4980b; }

.badge-success {
  background-color: #0bc36e; }

.badge-warning {
  background-color: #fec107; }

.badge-danger {
  background-color: #fb9678; }

.badge-info {
  background-color: #03a9f3; }

.badge-light {
  background-color: #eee; }

.badge-dark {
  background-color: #555; }

.progress-sm {
  height: 5px;
  border-radius: 2px; }

.progress-md {
  height: 10px;
  border-radius: 4px; }

.progress-lg {
  height: 16px;
  border-radius: 4px; }

.progress-bar-primary {
  background-color: #ffc107; }

.progress-bar-warning {
  background-color: #fec107; }

.progress-bar-success {
  background-color: #0bc36e; }

.progress-bar-danger {
  background-color: #fb9678; }

.progress-bar-info {
  background-color: #03a9f3; }

.bg-primary {
  background-color: rgba(255, 193, 7, 1) !important; }

.bg-success {
  background-color: rgba(11, 195, 110, 1) !important; }

.bg-warning {
  background-color: rgba(254, 193, 7, 1) !important; }

.bg-danger {
  background-color: rgba(251, 150, 120, 1) !important; }

.bg-info {
  background-color: rgba(3, 169, 243, 1) !important; }

.panel {
  border: 1px solid #ddd; }
  .panel.panel-default > .panel-heading {
    color: #333; }
  .panel > .panel-heading {
    color: #fff;
    padding: 10px;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    padding: 16px;
    border-radius: 2px;
    background-color: #666;
    border-color: #ddd; }
  .panel .panel-body {
    padding: 16px;
    font-size: 14px;
    color: #333; }
  .panel .panel-footer {
    font-size: 14px;
    color: #d9d9d9;
    padding: 16px;
    background: #383838;
    border-top: 1px solid #eee;
    border-radius: 2px; }

.panel-body {
  font-size: 12px; }

.panel-footer {
  font-size: 12px; }

.panel-priamry > .panel-heading {
  background-color: #ffc107; }

.panel-success > .panel-heading {
  background-color: #0bc36e; }

.panel-warning > .panel-heading {
  background-color: #fec107; }

.panel-danger > .panel-heading {
  background-color: #fb9678; }

.nav-pills .nav-item.show .nav-link, .nav-pills .nav-link.active {
  cursor: default;
  background-color: #ffc107; }

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  background-color: #ffc107; }

.alert-success {
  color: #0bc36e;
  background-color: rgba(11, 195, 110, 0.1);
  border-color: rgba(11, 195, 110, 0.1); }

.alert-primary {
  color: #ffc107;
  background-color: rgba(255, 193, 7, 0.1);
  border-color: rgba(255, 193, 7, 0.1); }

.alert-warning {
  color: #fec107;
  background-color: rgba(254, 193, 7, 0.1);
  border-color: rgba(254, 193, 7, 0.1); }

.alert-danger {
  color: #fb9678;
  background-color: rgba(251, 150, 120, 0.1);
  border-color: rgba(251, 150, 120, 0.1); }
/* [ 2.2 COMMON CSS START ] */
.layer-wrapper, .button-icon span, .button-icon .fa, .theme-block-hover, .theme-block-picture img, .theme-block-picture::before, .theme-block-hidden, .slider-appointment a, .feature-icon, .feature-icon .fa, .blog-list-picture img, .blog-full-img img, .contact-info-inner, .blog-picture, .hm-service-block .fa, .hm-about-icon .fa, .theme-dropdown li::after, .theme-img img, .theme-img::before, .hm-product, .hm-product h6 {
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

.page-ttl::before, .parallax-background::before {
  color: #fff;
  background: rgba(0, 0, 0, 0.8);
  background: #37474f; }

.theme-block, .form-container, .theme-table-container, .map-address, .hm-feature-block-1 {
  -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1); }

.tbl {
  display: table;
  width: 100%; }

.tbl-row {
  display: table-row; }

.tbl-cell {
  display: table-cell;
  vertical-align: middle; }
/* [ 2.3 LAYOUT CSS START ] */
.layer-stretch {
  position: relative;
  max-width: 1170px;
  padding: 0 15px;
  margin: 0 auto;
  overflow: hidden; }

.layer-tablet {
  width: 992px;
  margin: 0 auto; }

.layer-mobile {
  width: 448px;
  margin: 0 auto; }

.layer-fixed {
  position: relative;
  max-width: 680px;
  width: 100%;
  margin: 0 auto; }

.layer-wrapper {
  position: relative;
  width: 100%;
  padding: 50px 0 50px 0;
  margin: 0; }

.layer-bottom-0 {
  padding: 50px 0 0 0; }

.layer-bottom-10 {
  padding: 50px 0 20px 0; }

.colored-background {
  width: 100%;
  background: linear-gradient(-90deg, rgba(255, 212, 84, 0.9), rgba(186, 139, 0, 0.9)); }

.parallax-background {
  position: relative;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; }
  .parallax-background::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

.parallax-background-1 {
  background-image: url(../themes/ngg-material/assets/uploads/background-1.jpg); }

.parallax-background-2 {
  background-image: url(../themes/ngg-material/assets/uploads/background-2.jpg); }

.parallax-background-3 {
  background-image: url(../themes/ngg-material/assets/uploads/background-3.jpg); }

.layer-ttl {
  text-align: center;
  margin: 0 0 40px 0; }
  .layer-ttl h3 {
    position: relative;
    font-size: 32px;
    font-weight: 500;
    color: #6d5200;
    line-height: 1;
    display: inline-block;
    margin: 0;
    padding: 12px 25px 15px 25px;
    background: #ffe7a0;
    border-bottom: 2px solid #ba8b00;
    border-radius: 4px; }

.layer-ttl-white h3 {
  color: #ffe7a0;
  background: #6d5200;
  border-bottom: 2px solid #ffe7a0; }

.sub-ttl {
  position: relative;
  display: inline-block;
  width: 100%;
  font-family: 'Montserrat', sans-serif;
  font-size: 24px;
  font-weight: 400;
  letter-spacing: 0.5px;
  color: #555;
  text-align: center;
  padding: 0 0 15px 0;
  margin: 0 0 20px 0; }
  .sub-ttl::before {
    content: '';
    position: absolute;
    bottom: 5px;
    left: 0;
    right: 0;
    width: 30px;
    height: 2px;
    margin: 0 auto;
    background: #ffc107; }
  .sub-ttl::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 60px;
    height: 2px;
    margin: 0 auto;
    background: #ffc107; }

.sub-ttl-white {
  color: #fff; }

.layer-container {
  position: relative;
  width: 100%;
  margin: 0; }

.col-inset-0 {
  padding-left: 0;
  padding-right: 0; }

.sidebar {
  padding: 10px;
  margin: 0 0 30px 0;
  border: 1px solid #ccc;
  border-top: 2px solid #ccc; }

.rounded {
  border-radius: 50% !important; }
/* [ 2.4 FONT SIZE CSS START ] */
.font-12 {
  font-size: 12px !important; }

.font-13 {
  font-size: 13px !important; }

.font-14 {
  font-size: 14px !important; }

.font-16 {
  font-size: 16px !important; }

.font-18 {
  font-size: 18px !important; }

.font-20 {
  font-size: 20px !important; }

.font-24 {
  font-size: 24px !important; }

.font-28 {
  font-size: 28px !important; }

.font-30 {
  font-size: 30px !important; }

.font-36 {
  font-size: 36px !important; }

.font-400 {
  font-weight: 400; }

.font-500 {
  font-weight: 500; }
/* [ 2.5 COLOR CSS START ] */
.primary-color {
  color: #ffc107 !important; }

.color-white {
  color: #fff !important; }

.color-blue {
  color: #32c1ce !important; }

.color-green {
  color: #54c798 !important; }

.color-orange {
  color: #efa752 !important; }

.color-red {
  color: #fb9678; }

.color-purple {
  color: #a675d4 !important; }

.color-black {
  color: #333 !important; }

.color-dark-light {
  color: #555 !important; }

.color-light {
  color: #777 !important; }

.paragraph-medium {
  font-size: 16px;
  font-family: 'Montserrat', sans-serif;
  margin: 0 0 10px 0; }

.paragraph-small {
  font-size: 12px;
  font-family: 'Montserrat', sans-serif;
  letter-spacing: 0.5px; }

.paragraph-black {
  color: #777; }

.paragraph-white {
  color: #fff; }
/* [ 2.6 BUTTON CSS START ] */
.button {
  height: auto;
  line-height: normal;
  padding: 12px 30px;
  font-weight: 400;
  color: #fff !important;
  font-family: 'Montserrat', sans-serif;
  border-radius: 2px; }

.button-default {
  color: #333 !important; }

.button-primary {
  background-color: #ffc107 !important; }

.button-success {
  background-color: #0bc36e !important; }

.button-warning {
  background-color: #fec107 !important; }

.button-danger {
  background-color: #fb9678 !important; }

.button-info {
  background-color: #03a9f3 !important; }

.button-blue {
  color: #fff;
  background-color: #32c1ce;
  border: 2px solid #32c1ce; }

.button-orange {
  color: #fff;
  background: #efa752;
  border: 2px solid #efa752; }

.button-purple {
  color: #fff;
  background-color: #a675d4;
  border: 2px solid #a675d4; }

.button-red {
  color: #fff;
  background-color: #cc5151;
  border: 2px solid #cc5151; }

.button-transparent {
  color: #333 !important;
  background: transparent !important; }

.button-hover-transparent:hover {
  color: #333 !important;
  background: transparent !important; }

.button-hover-primary:hover {
  color: #fff !important;
  background: #ffc107 !important; }

.button-hover-success:hover {
  color: #fff !important;
  background: #0bc36e !important; }

.button-hover-warning:hover {
  color: #fff !important;
  background: #fec107 !important; }

.button-hover-danger:hover {
  color: #fff !important;
  background: #fb9678 !important; }

.button-hover-info:hover {
  color: #fff !important;
  background: #03a9f3 !important; }

.button-bordered-primary {
  border: 2px solid #ffc107; }

.button-bordered-success {
  border: 2px solid #0bc36e; }

.button-bordered-warning {
  border: 2px solid #fec107; }

.button-bordered-danger {
  border: 2px solid #fb9678; }

.button-bordered-info {
  border: 2px solid #03a9f3; }

.button-icon {
  position: relative;
  display: inline-block;
  padding: 0;
  font-size: 0;
  border: 1px solid #ffc107;
  border-radius: 2px;
  cursor: pointer; }
  .button-icon:hover span {
    color: #ffc107;
    background: #fff; }
    .button-icon:hover .fa {
      color: #fff;
      background: #ffc107; }
  .button-icon span {
    display: inline-block;
    vertical-align: top;
    height: 42px;
    line-height: 42px;
    font-size: 14px;
    text-transform: uppercase;
    padding: 0 20px;
    color: #fff;
    letter-spacing: 0.5px;
    background: #ffc107; }
  .button-icon .fa {
    display: inline-block;
    vertical-align: top;
    font-size: 16px;
    height: 42px;
    line-height: 42px;
    padding: 0 16px;
    color: #ffc107; }

.button-icon-info {
  border: 1px solid #32c1ce; }
  .button-icon-info:hover span {
    background: #fff; }
    .button-icon-info:hover .fa {
      background: #32c1ce; }
  .button-icon-info span {
    background: #32c1ce; }
  .button-icon-info .fa {
    color: #32c1ce; }

.button-icon-blue {
  border: 1px solid #32c1ce; }
  .button-icon-blue:hover span {
    background: #fff; }
    .button-icon-blue:hover .fa {
      background: #32c1ce; }
  .button-icon-blue span {
    background: #32c1ce; }
  .button-icon-blue .fa {
    color: #32c1ce; }

.button-icon-green {
  border: 1px solid #54c798; }
  .button-icon-green:hover span {
    color: #54c798; }
    .button-icon-green:hover .fa {
      background: #54c798; }
  .button-icon-green span {
    background: #54c798; }
  .button-icon-green .fa {
    color: #54c798; }

.button-icon-orange {
  border: 1px solid #efa752; }
  .button-icon-orange:hover span {
    color: #efa752; }
    .button-icon-orange:hover .fa {
      background: #efa752; }
  .button-icon-orange span {
    background: #efa752; }
  .button-icon-orange .fa {
    color: #efa752; }

.button-icon-purple {
  border: 1px solid #a675d4; }
  .button-icon-purple:hover span {
    color: #a675d4; }
    .button-icon-purple:hover .fa {
      background: #a675d4; }
  .button-icon-purple span {
    background: #a675d4; }
  .button-icon-purple .fa {
    color: #a675d4; }

.button-iconfill:hover span {
  color: #fff;
  background: #ffc107; }
  .button-iconfill:hover .fa {
    color: #ffc107;
    background: #fff; }
  .button-iconfill span {
    color: #ffc107;
    background: #fff; }
  .button-iconfill .fa {
    color: #fff;
    background: #ffc107; }

.button-iconfill-blue, .button-iconfill-green, .button-iconfill-orange, .button-iconfill-purple {
  border: 1px solid #32c1ce; }
  .button-iconfill-blue:hover span, .button-iconfill-green:hover span, .button-iconfill-orange:hover span, .button-iconfill-purple:hover span {
    color: #fff; }
  .button-iconfill-blue:hover .fa, .button-iconfill-green:hover .fa, .button-iconfill-orange:hover .fa, .button-iconfill-purple:hover .fa {
    background: #fff; }
  .button-iconfill-blue span, .button-iconfill-green span, .button-iconfill-orange span, .button-iconfill-purple span {
    background: #fff; }
  .button-iconfill-blue .fa, .button-iconfill-green .fa, .button-iconfill-orange .fa, .button-iconfill-purple .fa {
    color: #fff; }

.button-iconfill-blue {
  border: 1px solid #32c1ce; }
  .button-iconfill-blue:hover span {
    background: #32c1ce; }
  .button-iconfill-blue:hover .fa {
    color: #32c1ce; }
  .button-iconfill-blue span {
    color: #32c1ce; }
  .button-iconfill-blue .fa {
    background: #32c1ce; }

.button-iconfill-green {
  border: 1px solid #54c798; }
  .button-iconfill-green:hover span {
    background: #54c798; }
  .button-iconfill-green:hover .fa {
    color: #54c798; }
  .button-iconfill-green span {
    color: #54c798; }
  .button-iconfill-green .fa {
    background: #54c798; }

.button-iconfill-orange {
  border: 1px solid #efa752; }
  .button-iconfill-orange:hover span {
    background: #efa752; }
  .button-iconfill-orange:hover .fa {
    color: #efa752; }
  .button-iconfill-orange span {
    color: #efa752; }
  .button-iconfill-orange .fa {
    background: #efa752; }

.button-iconfill-purple {
  border: 1px solid #a675d4; }
  .button-iconfill-purple:hover span {
    background: #a675d4; }
  .button-iconfill-purple:hover .fa {
    color: #a675d4; }
  .button-iconfill-purple span {
    color: #a675d4; }
  .button-iconfill-purple .fa {
    background: #a675d4; }

.button-sm {
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 2px; }

.button-lg {
  padding: 12px 30px;
  font-size: 18px;
  line-height: 1.3333333;
  border-radius: 2px; }

.anchor-icon {
  font-size: 14px;
  color: #ffc107; }
  .anchor-icon .fa {
    margin: 0 0 0 5px; }

.btn-primary:not([disabled]):not(.disabled).active, .btn-primary:not([disabled]):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
  border-color: rgba(3, 169, 243, 0.6);
  background: rgba(3, 169, 243, 0.6); }

.btn-success:not([disabled]):not(.disabled).active, .btn-success:not([disabled]):not(.disabled):active, .show > .btn-success.dropdown-toggle {
  border-color: rgba(11, 195, 110, 0.6);
  background: rgba(11, 195, 110, 0.6); }

.btn-warning:not([disabled]):not(.disabled).active, .btn-warning:not([disabled]):not(.disabled):active, .show > .btn-warning.dropdown-toggle {
  border-color: rgba(254, 193, 7, 0.6);
  background: rgba(254, 193, 7, 0.6); }

.btn-danger:not([disabled]):not(.disabled).active, .btn-danger:not([disabled]):not(.disabled):active, .show > .btn-danger.dropdown-toggle {
  border-color: rgba(251, 150, 120, 0.6);
  background: rgba(251, 150, 120, 0.6); }

.btn-info:not([disabled]):not(.disabled).active, .btn-info:not([disabled]):not(.disabled):active, .show > .btn-info.dropdown-toggle {
  border-color: rgba(3, 169, 243, 0.6);
  background: rgba(3, 169, 243, 0.6); }

.btn-primary {
  background: #ffc107;
  border-color: #ffc107; }
  .btn-primary:hover {
    border-color: rgba(3, 169, 243, 0.6); }

.btn-success {
  background: #0bc36e;
  border-color: #0bc36e; }
  .btn-success:hover {
    border-color: rgba(11, 195, 110, 0.6); }

.btn-warning {
  background: #fec107;
  border-color: #fec107; }
  .btn-warning:hover {
    border-color: rgba(254, 193, 7, 0.6); }

.btn-danger {
  background: #fb9678;
  border-color: #fb9678; }
  .btn-danger:hover {
    border-color: rgba(251, 150, 120, 0.6); }

.btn-info {
  background: #03a9f3;
  border-color: #03a9f3; }
  .btn-info:hover {
    border-color: rgba(3, 169, 243, 0.6); }
/* [ 2.7 THEME BLOCK CSS START ] */
.theme-block {
  position: relative;
  width: 100%;
  padding: 4px;
  margin: 0 0 30px 0;
  text-align: center;
  background: #fff;
  border-radius: 2px;
  overflow: hidden; }
  .theme-block:hover .theme-block-hidden {
    opacity: 1;
    z-index: 2;
    bottom: 0; }
  .theme-block:hover .service-block-data a {
    color: #ffc107; }

.theme-block-hover:hover .theme-block-picture img {
  opacity: 0.7;
  -webkit-transform: scale(1.2) rotate(6deg);
  -moz-transform: scale(1.2) rotate(6deg);
  -ms-transform: scale(1.2) rotate(6deg);
  -o-transform: scale(1.2) rotate(6deg);
  transform: scale(1.2) rotate(6deg); }
  .theme-block-hover:hover .theme-block-picture:before {
    background: linear-gradient(-90deg, rgba(255, 212, 84, 0.9), rgba(186, 139, 0, 0.9)); }

.theme-block-picture {
  position: relative;
  width: 100%;
  overflow: hidden; }
  .theme-block-picture img {
    width: 100%;
    height: auto; }

.theme-block-picture::before, .theme-img::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

.theme-block-data {
  position: relative;
  padding: 15px; }
  .theme-block-data h4 {
    font-size: 20px;
    text-align: center;
    margin: 0;
    padding: 10px 0 5px 0; }
  .theme-block-data h4 a {
    color: #555; }
  .theme-block-data p {
    margin: 0; }
  .theme-block-data p a {
    color: #6d5200; }

.theme-block-hidden {
  position: absolute;
  bottom: -100%;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  border: 1px solid #eee;
  opacity: 0;
  z-index: -2; }

.theme-block-padding {
  padding: 10px; }

.theme-owl-dot .owl-dots .owl-dot {
  vertical-align: middle; }
  .theme-owl-dot .owl-dots .owl-dot span {
    margin-bottom: 0;
    background: transparent;
    border: 2px solid #ffc107; }
    .theme-owl-dot .owl-dots .owl-dot span:hover {
      background: #ffc107; }
  .theme-owl-dot .owl-dots .owl-dot.active span {
    width: 15px;
    height: 15px;
    background: #ffc107; }
/* [ 2.8 THEME ACCORDION CSS START ] */
.theme-accordion-container {
  text-align: left; }

.theme-accordion {
  background: #fff;
  border-bottom: 1px solid #f4f4f4; }
  .theme-accordion:nth-last-child(1) {
    border: 0; }

.theme-accordion-hdr {
  position: relative;
  padding: 15px;
  font-size: 16px;
  color: #333;
  cursor: pointer; }
  .theme-accordion-hdr h4 {
    font-size: 16px;
    color: #6d5200;
    margin: 0; }
  .theme-accordion-hdr h4 .fa {
    width: 24px;
    height: 24px;
    line-height: 24px;
    color: #fff;
    text-align: center;
    margin: 0 10px 0 0;
    background: #ffc107;
    border-radius: 2px; }

.theme-accordion-control {
  position: absolute;
  top: 15px;
  right: 15px; }
  .theme-accordion-control .fa {
    font-size: 24px;
    color: #ba8b00; }

.theme-accordion-bdy {
  display: none;
  width: 100%;
  padding: 15px;
  border-top: 1px solid #fafafa; }

.theme-accordian-img {
  padding: 0; }
  .theme-accordian-img img {
    width: 100%; }
/* [ 2.9 THEME DROPCAP CSS START ] */
.theme-dropcap {
  font-size: 60px;
  float: left;
  color: #ffc107;
  line-height: 60px;
  padding: 0 10px;
  margin-right: 10px; }
/* [ 2.10 THEME CATEGORY LIST CSS START ] */
.category-list {
  padding: 0; }
  .category-list li {
    text-align: left;
    list-style: none;
    padding: 10px 0;
    border-bottom: 1px solid #eee; }
  .category-list li a {
    color: #333;
    font-size: 14px; }
  .category-list li a:hover {
    color: #ffc107; }
  .category-list li a .fa {
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    margin: 0 10px 0 0; }
  .category-list li span {
    position: relative;
    top: 2px;
    float: right;
    font-size: 14px;
    color: #6d5200; }
  .category-list li:nth-last-child(1) {
    border-bottom: 0;
    margin: 0;
    padding: 10px 0 0 0; }

.list-primary .active {
  background-color: #ffc107;
  border-color: #ffc107; }

.list-warning .active {
  background-color: #fec107;
  border-color: #fec107; }

.list-danger .active {
  background-color: #fb9678;
  border-color: #fb9678; }

.list-success .active {
  background-color: #0bc36e;
  border-color: #0bc36e; }

.list-info .active {
  background-color: #03a9f3;
  border-color: #03a9f3; }

.list-light .active {
  background-color: #eee;
  border-color: #eee; }
/* [ 2.11 THEME MATERIAL CARD CSS START ] */
.theme-material-card {
  margin: 0 0 30px 0;
  padding: 15px;
  background: #fff;
  border-top: 1px solid #ffc107;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); }
/* [ 2.12 THEME TAG CSS START ] */
.theme-tag {
  display: inline-block;
  margin: 5px;
  position: relative;
  color: #333;
  font-size: 13px;
  letter-spacing: 0.5px;
  text-transform: capitalize;
  padding: 8px 15px 8px 25px;
  background: #ddd;
  border-radius: 2px; }
  .theme-tag::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 5px;
    margin-top: -5px;
    width: 10px;
    height: 10px;
    background: #fff;
    border-radius: 50%;
    z-index: 1; }
  .theme-tag:hover {
    color: #fff;
    background: #ffc107; }

.theme-tag-1 {
  padding-right: 30px;
  padding-left: 25px; }
  .theme-tag-1:hover::after {
    border-left: 20px solid #ffc107; }
  .theme-tag-1::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    background: #fff;
    border-bottom: 18px solid transparent;
    border-left: 20px solid #ddd;
    border-top: 18px solid transparent; }

.theme-tag-2 {
  padding-right: 40px;
  padding-left: 16px; }
  .theme-tag-2:hover::after {
    border-left: 20px solid #ffc107; }
  .theme-tag-2::before {
    left: inherit;
    right: 15px; }
  .theme-tag-2::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    background: #fff;
    border-bottom: 18px solid transparent;
    border-left: 20px solid #ddd;
    border-top: 18px solid transparent; }

.theme-tag-colored {
  color: #fff;
  background: #ffc107; }
  .theme-tag-colored:hover {
    background: #6d5200; }
  .theme-tag-colored:hover::after {
    border-left: 20px solid #6d5200; }
  .theme-tag-colored::after {
    border-left: 20px solid #ffc107; }
/* [ 2.13 THEME PAGINATION CSS START ] */
.theme-pagination {
  padding: 0;
  margin: 0; }
  .theme-pagination li {
    display: inline-block;
    vertical-align: middle;
    margin: 0 5px; }
  .theme-pagination li a {
    display: block;
    padding: 10px 15px;
    font-size: 14px;
    background: #fff;
    border-radius: 2px;
    border: 1px solid #ba8b00; }
  .theme-pagination li a:hover {
    color: #fff;
    background: #ba8b00; }
  .theme-pagination li a.active {
    color: #fff;
    background: #ba8b00; }

.theme-pagination-default li a {
  border: 1px solid #ddd; }
  .theme-pagination-default li a:hover {
    color: #ba8b00;
    background: transparent; }
  .theme-pagination-default li a.active {
    color: #ba8b00;
    background: transparent; }

.theme-pagination-1 li a {
  color: #fff;
  background: #ba8b00; }
  .theme-pagination-1 li a:hover {
    color: #ffc107;
    background: #fff; }
  .theme-pagination-1 li a.active {
    color: #ffc107;
    background: #fff; }
/* [ 2.14 THEME FLEXSLIDER CSS START ] */
.theme-flexslider {
  margin: 0 0 40px 0; }
  .theme-flexslider .flex-control-paging li {
    vertical-align: middle; }
  .theme-flexslider .flex-control-paging li a {
    background: #fff;
    border: 2px solid #ffc107;
    box-shadow: none; }
    .theme-flexslider .flex-control-paging li a:hover {
      background: #ffc107; }
    .theme-flexslider .flex-control-paging li a.flex-active {
      width: 15px;
      height: 15px;
      background: #ffc107; }

.theme-flexslider-container {
  width: 100%;
  position: relative;
  padding: 0 0 10px 0; }
  .theme-flexslider-container h4 {
    color: #333;
    margin: 10px 0 10px 0;
    letter-spacing: 0.5px;
    font-size: 20px;
    font-weight: 400; }
  .theme-flexslider-container p {
    font-size: 14px;
    color: #999;
    letter-spacing: 0.5px;
    margin: 0; }
  .theme-flexslider-container img {
    width: 100%; }
/* [ 2.15 SOCIAL BUTTON CSS START ] */
.social-list {
  margin: 0;
  padding: 0; }
  .social-list li {
    display: inline-block;
    vertical-align: middle;
    list-style: none;
    margin: 5px 0; }
  .social-list li a {
    display: inline-block;
    width: 32px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    margin: 0 5px;
    font-size: 20px;
    color: #777; }

.social-list-sm li a {
  width: 20px;
  height: 20px;
  line-height: 20px;
  margin: 2px;
  font-size: 14px; }

.social-list-lg li a {
  width: 36px;
  height: 36px;
  line-height: 36px;
  font-size: 24px; }

.social-list-colored li a {
  color: #fff !important; }
  .social-list-colored li a.fa-facebook {
    background: #3b5999; }
  .social-list-colored li a.fa-twitter {
    background: #55acee; }
  .social-list-colored li a.fa-google {
    background: #dc4a38; }
  .social-list-colored li a.fa-instagram {
    background: #ae8268; }
  .social-list-colored li a.fa-youtube {
    background: #e42b26; }
  .social-list-colored li a.fa-linkedin {
    background: #0274b3; }
  .social-list-colored li a.fa-flickr {
    background: #ff0175; }
  .social-list-colored li a.fa-rss {
    background: #f8991d; }

.social-list-black li a {
  color: #fff;
  background: #555; }
  .social-list-black li a:hover {
    background: #ffc107; }

.social-list-white li a {
  color: #eee;
  background: transparent;
  border: 1px solid #eee; }
  .social-list-white li a:hover {
    border: 1px solid #ffc107;
    background: #ffc107; }

.social-list-bordered a {
  border: 2px solid #777; }
  .social-list-bordered a:hover {
    color: #fff;
    border: 2px solid #ffc107;
    background: #ffc107; }

.social-list-rounded a {
  border-radius: 50%; }

.timetable {
  padding: 0;
  margin: 0;
  overflow: hidden; }
  .timetable li {
    position: relative;
    display: block;
    clear: both;
    list-style: none;
    margin: 10px 0;
    overflow: hidden; }
  .timetable li:hover::before {
    background: #ffc107; }
  .timetable li:hover a {
    color: #ffc107; }
  .timetable li::before {
    content: '';
    position: absolute;
    top: 21px;
    left: 0;
    width: 100%;
    height: 1px;
    background: #eee; }
  .timetable li a {
    position: relative;
    font-size: 14px;
    color: #555;
    padding: 5px;
    background: #fff; }
  .timetable li a .fa {
    color: #ffc107;
    margin: 0 5px 0 0; }

.width-auto {
  width: auto !important; }
/* [ 2.16 THEME DROPDOWN CSS START ] */
.theme-dropdown {
  position: relative;
  display: inline-block; }
  .theme-dropdown > a {
    font-size: 14px;
    color: #555;
    text-transform: none; }
  .theme-dropdown > a .fa {
    color: #aaa; }
  .theme-dropdown ul li {
    font-size: 13px;
    color: #333;
    padding: 10px; }
  .theme-dropdown ul li a {
    display: block; }
  .theme-dropdown ul li::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 3px;
    background: #ffc107; }
  .theme-dropdown ul li:hover::after {
    width: 100%; }
  .theme-dropdown ul li .fa {
    width: 28px;
    height: 24px;
    line-height: 24px;
    text-align: center; }
/* [ 2.17 THEME TABLE CSS START ] */
.table-container {
  margin: 0 10px 30px 10px;
  padding: 0;
  background: #fff;
  border-top: 1px solid #ffc107; }

.table {
  width: 100%; }
  .table th {
    color: #777;
    padding: 12px 5px;
    font-weight: 500;
    font-size: 14px;
    border-bottom: 2px solid #ddd; }
  .table td {
    padding: 12px 5px;
    color: #777;
    vertical-align: middle;
    font-size: 14px;
    border-bottom: 1px solid #eee; }

.table-hover tbody > tr:hover {
  background-color: #ffe7a0; }

.table-striped tbody tr:nth-of-type(odd) {
  background-color: #ffe7a0; }

.table-bordered th {
  border: 1px solid #ddd;
  border-bottom: 2px solid #ddd; }
  .table-bordered td {
    border: 1px solid #ddd; }

.table-primary-head > th, .table-warning-head > th, .table-success-head > th, .table-danger-head > th {
  color: #fff; }

.table-primary-head > th {
  background-color: #ffc107; }

.table-warning-head > th {
  background-color: #fec107; }

.table-success-head > th {
  background-color: #0bc36e; }

.table-danger-head > th {
  background-color: #fb9678; }

.table-primary, .table-primary > td, .table-primary > th {
  background-color: rgba(255, 193, 7, 0.1); }

.table-warning, .table-warning > td, .table-warning > th {
  background-color: rgba(254, 193, 7, 0.1); }

.table-success, .table-success > td, .table-success > th {
  background-color: rgba(11, 195, 110, 0.1); }

.table-danger, .table-danger > td, .table-danger > th {
  background-color: rgba(251, 150, 120, 0.1); }

.theme-list-basic {
  padding: 0 0 0 30px;
  margin: 0 0 10px 0; }
  .theme-list-basic li {
    font-size: 14px;
    color: #555;
    padding: 3px 0; }
  .theme-list-basic li li {
    list-style: circle; }
  .theme-list-basic li .fa {
    margin: 0 5px 0 0; }

.theme-list {
  padding: 0;
  margin: 0 0 10px 0; }
  .theme-list li {
    list-style: none;
    font-size: 14px;
    line-height: 1.6;
    color: #555;
    padding: 5px 0;
    letter-spacing: 0.5px; }
  .theme-list li .fa {
    margin: 0 5px 0 0; }
/* [ 2.18 THEME IMAGE CSS START ] */
.theme-img {
  position: relative;
  display: inline-block;
  padding: 4px;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 2px;
  overflow: hidden; }
  .theme-img::before {
    opacity: 0.4; }
  .theme-img:hover::before {
    background: linear-gradient(-90deg, rgba(255, 212, 84, 0.9), rgba(186, 139, 0, 0.9));
    z-index: 1; }
  .theme-img img {
    width: 100%; }

.theme-img-scale:hover img {
  -webkit-transform: scale(1.3);
  -moz-transform: scale(1.3);
  -ms-transform: scale(1.3);
  -o-transform: scale(1.3);
  transform: scale(1.3); }

.theme-img-scalerotate:hover img {
  -webkit-transform: scale(1.3) rotate(6deg);
  -moz-transform: scale(1.3) rotate(6deg);
  -ms-transform: scale(1.3) rotate(6deg);
  -o-transform: scale(1.3) rotate(6deg);
  transform: scale(1.3) rotate(6deg); }
/* [ 2.19 THEME QUOTE CSS START ] */
.theme-quote {
  font-size: 15px;
  color: #555;
  padding: 20px;
  letter-spacing: 0.5px;
  margin: 0 0 10px 0;
  text-align: left;
  font-style: italic;
  background: #f4f4f4;
  border-left: 4px solid #aaa;
  border-radius: 2px; }
  .theme-quote .fa {
    color: #ffc107; }

.theme-quote-colored {
  color: #fff;
  background: #ffc107;
  border-color: #333; }
  .theme-quote-colored .fa {
    color: #fff; }

.theme-quote-primary {
  background: #ffc107; }

.theme-quote-success {
  background: #0bc36e; }

.theme-quote-warning {
  color: #333;
  background: #fec107; }

.theme-quote-danger {
  background: #fb9678; }

.theme-quote-info {
  background: #03a9f3; }
/* [ 2.20 PAGE TITLE CSS START ] */
.page-ttl {
  position: relative;
  width: 100%;
  padding: 40px 0 40px 0;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-image: url(../uploads/background-1.jpg);*/ }
  .page-ttl::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

.page-ttl-container {
  text-align: center; }
  .page-ttl-container h1 {
    font-size: 42px;
    font-weight: 500;
    color: #fff;
    margin: 0; }
  .page-ttl-container p {
    font-size: 14px;
    color: #ccc;
    padding: 10px 0 0 0; }
  .page-ttl-container p a {
    display: inline-block;
    color: #eee;
    margin: 0 5px 0 0; }
  .page-ttl-container p a:hover {
    text-decoration: underline !important; }
  .page-ttl-container p span {
    display: inline-block;
    margin: 0 0 0 5px; }

.page-ttl-icon {
  display: inline-block;
  vertical-align: middle;
  display: none; }

/* [ 2.21 NOT FOUND PAGE CSS START ] */

.notfound-wrapper {
  width: 100%;
  height: 100%;
  text-align: center;
  padding: 50px 0 0 0; }

.notfound-ttl {
  font-size: 150px;
  text-transform: uppercase;
  color: #f09e71;
  letter-spacing: 2px;
  font-weight: bold;
  display: block;
  margin: 10px 0; }

.notfound-tag-1 {
  font-size: 48px;
  text-transform: uppercase;
  color: #333;
  margin: 10px 0;
  font-weight: 600; }

.notfound-tag-2 {
  display: block;
  font-size: 28px;
  color: #555;
  margin: 10px 0; }

.notfound-link {
  margin: 30px 0; }

.notfound-link a {
  margin: 30px; }

.notfound-social li {
  margin: 10px; }
  .notfound-social li a {
    font-size: 24px; }

.color {
  position: relative;
  top: 20%;
  z-index: 11; }

.color-handle {
  position: absolute;
  top: 0;
  right: -48px;
  background: #fff; }
  .color-handle .fa {
    width: 48px;
    height: 48px;
    line-height: 48px;
    text-align: center;
    font-size: 24px;
    color: #777;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12);
    cursor: pointer; }

.color-wrapper {
  position: absolute;
  top: 0;
  left: -160px;
  width: 160px;
  background: #fff;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12);
  transition: all 0.7s; }

.color-container {
  text-align: center; }
  .color-container a {
    display: inline-block;
    width: 48px;
    height: 48px;
    margin: 10px; }

.sidecolor-green {
  background-color: #54c798; }

.sidecolor-blue {
  background-color: #32c1ce; }

.sidecolor-orange {
  background-color: #efa752; }

.sidecolor-purple {
  background-color: #a675d4; }
/**************************************************
 [ 3.0 HEADER CSS START ] **************************
 ***************************************************/
#header {
  position: relative;
  z-index: 99; }

#hdr-top-wrapper {
  position: relative;
  padding: 5px 0;
  color: #c9c9c9;
  background-color: #383838;
  border-bottom: 1px solid #eee; }

.hdr-top {
  text-align: right;
  overflow: visible; }

.hdr-top-block {
  display: inline-block;
  vertical-align: middle;
  padding: 0 5px; }

.hdr-number .fa {
  font-size: 20px;
  padding: 0 5px 0 0;
  color: #777; }

#profile-menu {
  font-weight: 400;
  padding: 0 5px; }

.hdr-top-line {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: 1px;
  height: 30px;
  margin: 0 5px;
  background-color: #ddd; }

#hdr-wrapper {
  color: #fff;
  background-color: #3a3a3a;
  -webkit-box-shadow: 0px 2px 5px -1px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0px 2px 5px -1px rgba(0, 0, 0, 0.15);
  box-shadow: 0px 2px 5px -1px rgba(0, 0, 0, 0.15); }

.hdr {
  overflow: visible; }

.hdr-logo a {
  display: inline-block; }
  .hdr-logo a img {
    max-width: 400px;
    height: 40px; }

.menu {
  position: relative;
  text-align: right;
  margin: 0; }
  .menu ul {
    margin: 0;
    padding: 0; }
  .menu li li {
    position: relative;
    margin: 0;
    display: block;
    width: auto; }
  .menu li li a {
    position: relative;
    font-size: 13px;
    color: #333 !important;
    padding: 10px 5px;
    transition: all 0.4s ease-in-out; }
    .menu li li a::before {
      content: '';
      position: absolute;
      top: 20%;
      left: 0;
      width: 0;
      height: 60%;
      background: #ffc107;
      transition: all 0.4s ease-in-out; }
    .menu li li a:hover {
      color: #ffc107 !important;
      padding-left: 10px; }
      .menu li li a:hover::before {
        width: 5px; }
  .menu li li:nth-last-child(1) a {
    border-bottom: 0; }
  .menu li:hover > .menu-dropdown, .menu li:hover > .menu-megamenu {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px); }
  .menu a {
    display: block;
    height: auto;
    font-weight: 400;
    font-family: 'Montserrat', sans-serif;
    text-transform: none; }
  .menu > li {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    padding: 10px 5px; }
  .menu > li > a {
    position: relative;
    line-height: 36px;
    color: #555;
    font-size: 14px;
    padding: 10px; }
  .menu > li > a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 3px;
    background: #ffc107;
    transition: all 0.3s ease-in-out; }
  .menu > li > a .fa {
    font-size: 12px;
    color: #aaa; }
  .menu > li > a.active {
    background: rgba(158, 158, 158, 0.1); }
    .menu > li > a.active::after {
      width: 100%; }
  .menu > li > a:hover::after {
    width: 100%; }
  .menu .mobile-menu-close {
    display: none;
    position: absolute !important;
    top: 10px;
    right: 10px;
    width: 32px;
    height: 32px;
    line-height: 15px;
    text-align: center;
    padding: 8px;
    background-color: #000;
    border-radius: 50%; }
  .menu .mobile-menu-close .fa {
    width: 16px;
    height: 16px;
    line-height: 16px;
    font-size: 18px;
    color: #eee; }

.menu-megamenu, .menu-dropdown {
  position: absolute;
  left: 0%;
  top: 90%;
  background: #fff;
  opacity: 0;
  visibility: hidden;
  z-index: 999;
  text-align: left !important;
  -webkit-transform: translateY(40px);
  -moz-transform: translateY(40px);
  -ms-transform: translateY(40px);
  -o-transform: translateY(40px);
  transform: translateY(40px);
  -webkit-transition: all 0.6s cubic-bezier(0.18, 0.89, 0.32, 1.28);
  -moz-transition: all 0.6s cubic-bezier(0.18, 0.89, 0.32, 1.28);
  -ms-transition: all 0.6s cubic-bezier(0.18, 0.89, 0.32, 1.28);
  -o-transition: all 0.6s cubic-bezier(0.18, 0.89, 0.32, 1.28);
  transition: all 0.6s cubic-bezier(0.18, 0.89, 0.32, 1.28);
  box-shadow: 2px 0 10px 0 rgba(2, 0, 0, 0.1); }
  .menu-megamenu .row, .menu-dropdown .row {
    display: flex !important;
    display: -ms-flexbox !important;
    -ms-flex-wrap: wrap !important; }
  .menu-megamenu li, .menu-dropdown li {
    padding: 0;
    border-bottom: 1px solid #eee; }
  .menu-megamenu li:nth-last-child(1), .menu-dropdown li:nth-last-child(1) {
    border-bottom: 0; }

.menu-megamenu {
  width: 100%;
  padding: 10px; }
  .menu-megamenu > li {
    padding: 15px 10px; }

.menu-dropdown {
  width: 160px; }
  .menu-dropdown li {
    padding: 5px 5px 5px 10px; }
  .menu-dropdown .menu-dropdown {
    top: 0;
    left: 100%;
    margin-left: 3px; }

.menu-megamenu-li {
  position: static !important; }

.megamenu-ttl {
  font-size: 16px;
  font-weight: 500;
  color: #333;
  padding: 10px 5px;
  text-transform: uppercase; }

#menu-bar {
  display: none;
  text-align: right; }
  #menu-bar a {
    display: inline-block; }
  #menu-bar .fa {
    font-size: 28px;
    color: #777;
    height: 60px;
    line-height: 60px;
    padding: 0 5px; }

#appointment-button {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 99;
  animation-delay: 2s; }
  #appointment-button .fa {
    font-size: 20px;
    color: #ffe7a0; }
  #appointment-button .mdl-tooltip {
    font-size: 12px; }
  #appointment-button .mdl-button--fab.mdl-button--colored {
    background: #6d5200; }

.filter-menu {
  display: inline-block;
  margin: 20px 0 10px 0;
  background-color: #f4f4f4; }
  .filter-menu button {
    font-size: 20px;
    line-height: 20px;
    color: #555;
    text-transform: uppercase;
    padding: 20px 30px;
    border: none;
    outline: none;
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-size: 1rem 1rem; }
  .filter-menu button.active {
    color: #fff;
    background-color: #ffc107; }
  /*************************************************
   [ 4.0 HEADER 2 CSS START ] ***********************
   **************************************************/

#header-1 {
  position: absolute;
  top: 10px;
  left: 0;
  width: 100%;
  z-index: 999; }
  #header-1 .menu a {
    color: #fff; }
  #header-1 .menu ul li a {
    color: #333; }
    #header-1 #menu-bar .fa {
      color: #eee; }

#header-3 {
  position: relative; }

.hdr-center {
  padding: 20px 15px; }

.hdr-center-logo img {
  height: 40px; }

.hdr-center-submenu .tbl-cell {
  padding: 5px; }
  .hdr-center-submenu .fa {
    width: 42px;
    height: 42px;
    line-height: 36px;
    font-size: 20px;
    margin: 0 10px 0 0;
    text-align: center;
    color: #ffd454;
    border-radius: 50%;
    border: 2px dotted #ffc107; }

.hdr-center-menu {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  width: 100%;
  padding: 10px 0;
  background-color: rgba(51, 51, 51, 0.3);
  border-top: 1px solid #eee;
  z-index: 11; }
  .hdr-center-menu .menu li a {
    color: #fff; }

.hdr-center-account a:hover .fa {
  color: #fff;
  background-color: #ffc107;
  border: 1px solid #ffc107; }
  .hdr-center-account .fa {
    font-size: 16px;
    color: #777;
    width: 32px;
    height: 32px;
    line-height: 28px;
    margin: 0 10px 0;
    vertical-align: middle;
    text-align: center;
    border: 1px solid #777;
    border-radius: 50%; }

.hdr-apointment {
  color: #fff;
  height: 48px;
  padding: 0 24px;
  background-color: #ffc107 !important;
  border-radius: 30px; }
  .hdr-apointment .fa {
    width: auto;
    height: auto;
    line-height: normal; }
  .hdr-apointment:hover {
    background-color: #ffc107; }

.search-banner {
  display: none;
  width: 100%;
  position: absolute;
  top: 110%;
  left: 0;
  right: 0;
  padding: 10px;
  background: #ffe7a0;
  border-radius: 60px;
  z-index: 11; }
  .search-banner input {
    width: 100%;
    font-size: 24px;
    padding: 10px 30px;
    color: #6d5200; }

#header-transparent {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background-color: rgba(51, 51, 51, 0.3);
  z-index: 11; }
  #header-transparent .menu li a {
    color: #fff; }
  #header-transparent .hdr-center-account a {
    color: #eee; }
  #header-transparent .hdr-center-account .fa {
    color: #eee;
    border: 1px solid #eee; }

.header-transparent-menu {
  width: 100%;
  padding: 10px 0;
  background: rgba(51, 51, 51, 0.3);
  border-top: 1px solid #ffe7a0; }

.hdr-search {
  line-height: 56px;
  background: none;
  box-shadow: none; }
  .hdr-search .fa {
    font-size: 24px; }

.hdr-fixed {
  background-color: rgba(255, 193, 7, 0.8); }
/*************************************************
 [ 5.0 HOME PAGE CSS START ] **********************
 **************************************************/
/* [ 5.1 BANNER CSS START ] */
.slider-wrapper .slides li {
  position: relative; }
  .slider-wrapper .slides li::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    background: linear-gradient(-90deg, rgba(255, 212, 84, 0.9), rgba(186, 139, 0, 0.9)); }
  .slider-wrapper .slides li img {
    width: 100%; }

.slider-1 {
  height: 100%; }
  .slider-1 .slider-wrapper {
    height: 100%; }
  .slider-1 .slides {
    height: 100%; }
  .slider-1 .slides li {
    height: 100%; }
  .slider-1 .slider-info {
    padding: 2% 10%; }

.slider-height {
  height: 100%; }
  .slider-height .slider-wrapper {
    height: 100%; }
  .slider-height .slides {
    height: 100%; }
  .slider-height .slides li {
    height: 100%; }

.slider-wrapper {
  height: 100%;
  border: 0;
  margin: 0;
  overflow: hidden; }

.flex-direction-nav a {
  line-height: 40px; }

.slider-info {
  position: absolute;
  top: 25%;
  left: 0;
  width: 100%;
  padding: 0 10%;
  text-align: center;
  z-index: 9999; }
  .slider-info h1, .slider-info h2 {
    display: inline-block;
    font-size: 54px;
    color: #fff;
    font-weight: 500;
    margin: 0 0 15px 0;
    animation-delay: 0.4s; }
  .slider-info p {
    font-size: 16px;
    color: #fff;
    animation-delay: 0.6s; }

.slider-button {
  position: absolute;
  bottom: 20%;
  left: 0;
  width: 100%;
  text-align: center;
  z-index: 10; }
  .slider-button a {
    display: inline-block;
    font-size: 18px;
    color: #333;
    padding: 20px 30px;
    height: auto;
    letter-spacing: 0.5px;
    text-transform: none;
    line-height: normal;
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    background: #ffe7a0;
    border-radius: 30px;
    animation-delay: 1.4s; }
  .slider-button a .fa {
    margin: 0 0 0 10px; }
  .slider-button a:hover {
    color: #fff;
    background: #ffc107; }

.slider-backgroung-image {
  position: relative;
  width: 100%;
  height: 100%;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; }

.slider-2 .slider-info {
  top: 35%; }
/* [ 5.2 HOME SERVICE CSS START ] */
.hm-service-left {
  position: relative; }
  .hm-service-left img {
    position: relative;
    width: 100%;
    border: 4px solid #ffc107;
    border-radius: 2px;
    z-index: 1; }

.hm-service-right .paragraph-medium {
  color: #6d5200; }

.hm-service {
  text-align: center; }

.hm-service-block {
  display: inline-block;
  vertical-align: top;
  width: 180px;
  padding: 10px 0;
  margin: 20px 0; }
  .hm-service-block .fa {
    position: relative;
    width: 64px;
    height: 64px;
    line-height: 64px;
    font-size: 36px;
    text-align: center;
    color: #fff;
    background: #ffc107;
    border: 2px solid #ffc107;
    border-radius: 2px; }
  .hm-service-block .fa:hover {
    color: #fff; }
  .hm-service-block .fa:hover::after {
    border: 14px solid #ffc107; }
  .hm-service-block .fa::after {
    content: '';
    position: absolute;
    top: -15%;
    left: -15%;
    width: 130%;
    height: 130%;
    border: 2px solid #ffc107;
    border-radius: 2px;
    z-index: 1;
    -webkit-transition: all 0.2s;
    transition: all 0.2s; }
  .hm-service-block span {
    display: block;
    font-size: 14px;
    color: #555;
    padding: 20px 0 0 0;
    letter-spacing: 0.5px; }

.service-card {
  padding: 60px 20px 20px;
  margin: 40px 0 30px 0;
  text-align: center;
  background: #666; }
  .service-card:hover .fa {
    box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.3); }
  .service-card .fa {
    position: absolute;
    left: 50%;
    top: 0;
    font-size: 48px;
    width: 80px;
    color: #ffe7a0;
    height: 80px;
    line-height: 80px;
    text-align: center;
    background: #ffc107;
    margin-left: -40px;
    border-radius: 2px;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.3);
    transition: all 0.4s ease-in-out; }
  .service-card h5 {
    font-size: 16px;
    color: #6d5200;
    text-transform: uppercase; }
  .service-card h5 a {
    font-weight: 500;
    color: #6d5200; }
  /* [ 5.3 HOME ABOUT CSS START ] */

.hm-about-block {
  display: inline-block;
  vertical-align: top;
  min-width: 280px;
  padding: 0 10px;
  margin: 0 0 30px 0; }
  .hm-about-block:hover .fa {
    color: #ffc107;
    -webkit-box-shadow: inset 0 0 0 70px #fff;
    -moz-box-shadow: inset 0 0 0 70px #fff;
    box-shadow: inset 0 0 0 70px #fff; }
  .hm-about-block:hover .fa::after {
    border: 10px solid #fff; }

.hm-about-icon .fa {
  position: relative;
  font-size: 32px;
  color: #fff;
  width: 64px;
  height: 64px;
  line-height: 64px;
  text-align: center;
  border: 2px solid #fff;
  border-radius: 2px; }
  .hm-about-icon .fa::after {
    content: '';
    position: absolute;
    top: -15%;
    left: -15%;
    width: 130%;
    height: 130%;
    border: 2px solid #fff;
    border-radius: 2px;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    z-index: 1; }

.hm-about-number {
  padding: 0 0 0 20px;
  text-align: left; }
  .hm-about-number span {
    display: block;
    font-size: 42px;
    color: #fff;
    font-weight: 500; }
  .hm-about-number p {
    font-size: 14px;
    color: #eee; }

/* [ 5.4 HOME PRODUCT SLIDER CSS START ] */

#hm-product-slider {
  text-align: center; }
  #hm-product-slider.owl-theme .owl-controls .owl-page span {
    background: transparent;
    border: 2px solid #ffc107;
    border-radius: 4px; }
  #hm-product-slider.owl-theme .owl-controls .owl-page.active span {
    background: #ffc107; }
  #hm-product-slider .owl-stage-outer {
    padding: 40px 0; }
  #hm-product-slider .center .hm-product {
    opacity: 1;
    transform: scale(1.2); }
  #hm-product-slider .center .hm-product h6 {
    color: #6d5200; }
  #hm-product-slider .center .hm-product p {
    color: #ffd454; }

.hm-product {
  display: inline-block;
  vertical-align: top;
  text-align: center;
  padding: 4px 4px 20px 4px;
  background: #ffe7a0;
  border-radius: 2px;
  opacity: 0.6; }
  .hm-product img {
    width: 260px !important;
    margin: 0 auto; }
  .hm-product h6 {
    color: #555;
    margin: 15px 0 5px 0;
    letter-spacing: 0.5px;
    font-size: 20px;
    font-weight: 400; }
  .hm-product p {
    font-size: 14px;
    color: #999;
    letter-spacing: 0.5px;
    margin: 0; }
/* [ 5.6 HOME FEATURE CSS START ] */
#hm-feature {
  text-align: center; }

.hm-feature-block {
  display: inline-block;
  vertical-align: top;
  width: 33%;
  padding: 0 40px;
  margin: 10px 0 30px 0; }
  .hm-feature-block:hover .fa {
    color: #fff;
    background: #ffc107;
    -webkit-box-shadow: inset 0 0 0 70px #ffc107;
    -moz-box-shadow: inset 0 0 0 70px #ffc107;
    box-shadow: inset 0 0 0 70px #ffc107; }
  .hm-feature-block .fa {
    width: 80px;
    height: 80px;
    line-height: 80px;
    font-size: 42px;
    color: #ffc107;
    background: #666;
    -webkit-transition: all 0.7s ease-in-out;
    transition: all 0.7s ease-in-out;
    border-radius: 50%; }
  .hm-feature-block span {
    display: block;
    font-size: 18px;
    font-family: 'Montserrat', sans-serif;
    color: #6d5200;
    padding: 20px 5px 10px 5px; }
  .hm-feature-block p {
    text-align: center;
    color: #777;
    margin: 0; }

.hm-feature-icon {
  position: relative;
  width: 100px;
  height: 100px;
  line-height: 122px;
  margin: 0 auto;
  background: #ffc107;
  border-radius: 2px; }

.hm-feature-block-1 {
  padding: 4px 4px 4px 4px;
  margin: 0 0 30px 0;
  background: #fff;
  border-radius: 2px; }
  .hm-feature-block-1 .theme-img {
    padding: 0;
    max-height: 100px;
    border: none; }
  .hm-feature-block-1 span {
    display: block;
    font-size: 18px;
    color: #ffc107;
    padding: 15px 5px 10px 5px; }
  .hm-feature-block-1 p {
    text-align: center;
    color: #777;
    padding: 0 10px; }
/* [ 5.7 HOME TESTIMONIAL CSS START ] */
.testimonial-block {
  max-width: 650px;
  width: 100%;
  margin: 0 auto;
  text-align: center; }
  .testimonial-block img {
    width: 150px !important;
    height: 150px;
    margin: 0 auto;
    border: 3px solid #fff;
    border-radius: 2px; }
  .testimonial-block a {
    display: inline-block;
    font-size: 24px;
    color: #ddd !important;
    text-transform: capitalize; }
  .testimonial-block .paragraph-medium {
    margin: 15px 0; }
  .testimonial-block .paragraph-medium .fa {
    color: #ffe7a0;
    font-size: 32px; }
/*************************************************
 [ 6.0 SERVICE PAGE CSS START ] *******************
 **************************************************/
/* [ 6.1 SERVICE CARD CSS START ] */
.service-block-data h4 {
  padding: 40px 0 10px 0; }

.service-icon {
  position: absolute;
  top: -45px;
  left: 0;
  width: 100%;
  text-align: center; }
  .service-icon .fa {
    display: inline-block;
    width: 90px;
    height: 90px;
    line-height: 80px;
    text-align: center;
    font-size: 36px;
    color: #fff;
    background: #ffc107;
    border: 5px solid #fff;
    border-radius: 50%;
    z-index: 1; }

.service-hidden-block {
  padding: 15px; }
  .service-hidden-block .fa {
    width: 80px;
    height: 80px;
    line-height: 80px;
    text-align: center;
    font-size: 42px;
    color: #fff;
    background: #ffc107;
    border-radius: 4px; }
  .service-hidden-block h4 {
    font-size: 20px;
    color: #555;
    margin: 0;
    padding: 10px 0; }
  .service-hidden-block h4 a {
    color: #ffc107; }
  .service-hidden-block p {
    margin: 0; }
  .service-hidden-block p a {
    color: #6d5200; }

.service-accordian {
  margin: 0; }

.service-post {
  text-align: left;
  padding: 20px 10px 10px 10px; }
/* [ 6.2 FEATURE CSS START ] */
.feature-block {
  display: inline-block;
  vertical-align: top;
  width: 33%;
  padding: 15px 15px 30px 15px;
  text-align: center; }
  .feature-block:hover .feature-icon {
    -webkit-box-shadow: inset 0 0 100px #ffc107;
    -moz-box-shadow: inset 0 0 100px #ffc107;
    box-shadow: inset 0 0 100px #ffc107; }
  .feature-block:hover .feature-icon .fa {
    color: #fff;
    border-radius: 2px;
    -webkit-box-shadow: inset 0 0 140px #ffc107;
    -moz-box-shadow: inset 0 0 140px #ffc107;
    box-shadow: inset 0 0 140px #ffc107; }
  .feature-block span {
    display: block;
    font-size: 18px;
    font-family: 'Montserrat', sans-serif;
    color: #fff;
    padding: 20px 0 10px 0; }
  .feature-block p {
    text-align: center;
    color: #eee;
    margin: 0; }

.feature-icon {
  width: 105px;
  height: 105px;
  line-height: 130px;
  margin: 0 auto;
  border: 2px solid #ffc107;
  border-radius: 4px; }
  .feature-icon .fa {
    position: relative;
    width: 80px;
    height: 80px;
    line-height: 80px;
    font-size: 42px;
    color: #ffe7a0;
    border: 2px solid #ffc107;
    border-radius: 50%; }

.feature-block-dark .feature-icon .fa {
  color: #ffc107; }
  .feature-block-dark span {
    color: #6d5200; }
  .feature-block-dark p {
    color: #777; }
/*************************************************
 [ 7.0 PRODUCT PAGE CSS START ] ********************
 **************************************************/
/* [ 7.1 product CARD CSS START ] */
.product-name h4 {
  font-size: 20px;
  padding: 10px 0;
  margin: 0;
  background: #ffc107; }
  .product-name h4 a {
    color: #fff !important; }

.product-details {
  padding: 10px; }

.product-specility p {
  display: inline-block;
  font-size: 14px;
  letter-spacing: 1px;
  color: #333;
  padding: 0 10px 5px 10px;
  margin: 0 0 10px 0;
  border-bottom: 2px dotted #ddd; }

.product-details-extra {
  text-align: center;
  padding: 0 0 60px 0; }
  .product-details-extra p {
    display: inline-block;
    vertical-align: top;
    width: 150px;
    padding: 10px 0;
    margin: 0;
    font-size: 12px;
    color: #555;
    letter-spacing: 1px; }
  .product-details-extra .fa {
    font-size: 24px;
    text-align: center;
    display: block;
    margin: 5px auto;
    color: #999; }

.product-social {
  position: absolute;
  bottom: 5px;
  right: 0;
  left: 0; }

.product-details-extra-3 {
  text-align: left;
  padding: 0 10px; }
  .product-details-extra-3 p {
    width: auto;
    display: block;
    font-size: 14px;
    padding: 2px 5px; }
  .product-details-extra-3 p .fa {
    display: inline-block;
    vertical-align: middle;
    width: 30px;
    font-size: 16px;
    padding: 0 10px 0 0; }
  .product-details-extra-3 p:nth-child(1) {
    color: #55acee; }
  .product-details-extra-3 p:nth-child(3) {
    color: #dc4a38; }

.productp-name {
  position: relative;
  border-bottom: 2px dotted #ddd; }
  .productp-name h3 {
    font-size: 24px;
    color: #555;
    font-weight: 500;
    margin: 0 0 10px 0; }
  .productp-name p {
    font-size: 14px;
    color: #777;
    margin: 5px 0 10px 5px; }

.productp-social {
  position: absolute;
  bottom: 0;
  right: 0; }
/* [ 7.2 DEPARTMENT CSS START ] */
.department-block {
  margin-bottom: 30px; }

.department-icon {
  vertical-align: top; }
  .department-icon .fa {
    position: relative;
    width: 64px;
    height: 64px;
    line-height: 64px;
    font-size: 32px;
    color: #ffc107;
    text-align: center;
    background: #fff;
    border-radius: 50%; }

.department-detail {
  vertical-align: top;
  padding: 0 0 0 15px; }
  .department-detail h5 {
    font-size: 20px;
    color: #fff;
    text-transform: uppercase; }
  .department-detail p {
    margin: 0; }

.department-card {
  border: 1px solid #eee;
  background: #fcfcfc;
  padding: 15px;
  border-radius: 2px; }
  .department-card:hover .fa {
    color: #fff !important;
    box-shadow: inset 0 0 200px 0 #ffc107; }
  .department-card .department-icon .fa {
    color: #ba8b00;
    border: 1px solid #ddd;
    transition: all 0.4s ease-in-out; }
  .department-card .department-detail h5 {
    color: #333; }
  .department-card .department-detail p {
    color: #777; }
/*************************************************
 [ 8.0 - ABOUT US CSS START ] *********************
 **************************************************/
.about-mission-vission span {
  position: relative;
  display: block;
  padding: 10px 0;
  margin: 0 0 10px 0;
  font-size: 28px;
  color: #fff; }
  .about-mission-vission span::after {
    content: '';
    position: absolute;
    bottom: 5px;
    left: 50%;
    margin-left: -40px;
    width: 80px;
    height: 1px;
    background: #ffc107; }
  .about-mission-vission p {
    text-align: center;
    margin: 0;
    color: #eee; }
/*************************************************
 [ 9.0 CONTACT CSS START ] ************************
 **************************************************/
/* [ 9.1 CONTACT CSS START ] */
.contact-info-inner {
  min-height: 260px;
  padding: 20px;
  border: 1px solid #ccc;
  border-top: 4px solid #ccc;
  border-radius: 2px; }
  .contact-info-inner .fa {
    width: 80px;
    height: 80px;
    line-height: 80px;
    text-align: center;
    font-size: 36px;
    color: #fff;
    background: #aaa;
    border-radius: 4px; }
  .contact-info-inner span {
    position: relative;
    display: block;
    font-size: 20px;
    color: #333;
    padding: 20px 0;
    text-transform: uppercase; }
  .contact-info-inner span::after {
    content: '';
    position: absolute;
    bottom: 15px;
    left: 50%;
    margin-left: -20px;
    width: 40px;
    height: 1px;
    background: #777;
    z-index: 1; }
  .contact-info-inner p {
    text-align: center;
    color: #777; }
  .contact-info-inner:hover {
    border: 1px solid #ffc107;
    border-top: 4px solid #ffc107; }
  .contact-info-inner:hover .fa {
    background: #ffc107; }

.contact-form {
  text-align: center; }
  .contact-form .form-input, .contact-form .form-input-icon {
    margin: 12px 0; }
  .contact-form .form-input textarea, .contact-form .form-input-icon textarea {
    height: 236px; }
/* [ 9.2 MAP CSS START ] */
#map {
  position: relative;
  width: 100%;
  background: #ddd; }

.map-wrapper {
  width: 100%;
  height: 400px; }

.map-address {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 260px;
  padding: 20px;
  text-align: center;
  background: #fff; }
  .map-address .paragraph-medium {
    text-align: center; }

.map-address-ttl {
  position: relative;
  font-size: 24px;
  color: #555;
  padding: 10px 0 20px 0; }
  .map-address-ttl::after {
    content: '';
    position: absolute;
    bottom: 10px;
    left: 50%;
    margin-left: -40px;
    width: 80px;
    height: 1px;
    background: #ffc107; }

.map-icon {
  text-align: center;
  padding: 0 0 10px 0; }
  .map-icon .fa {
    width: 60px;
    height: 60px;
    line-height: 60px;
    font-size: 28px;
    color: #fff;
    text-align: center;
    background: #ffc107;
    border-radius: 2px; }

#map-container {
  width: 100%;
  height: 400px; }
/*************************************************
 [ 10.0 LOGIN CSS START ] *************************
 **************************************************/
.login-condition {
  font-size: 12px;
  color: #aaa;
  padding: 0 30px; }
/*************************************************
 [ 11.0 FORM INPUT CSS START ] ********************
 **************************************************/
.form-container {
  max-width: 400px;
  padding: 20px;
  margin: 0 auto;
  text-align: center;
  background: #fff; }
  .form-container .paragraph-small {
    text-align: center; }
  .form-container label em {
    color: #cc5151; }

.form-input input {
  font-family: 'Montserrat', sans-serif; }
  .form-input label {
    color: #777; }

.search-button {
  position: absolute;
  top: 18px;
  right: 0;
  width: 36px;
  height: 36px;
  line-height: 34px;
  font-size: 20px;
  color: #eee;
  background: #ffc107;
  border-radius: 2px; }
  .search-button:hover {
    color: #fff; }

.form-input-icon {
  width: 100%;
  padding: 20px 0 20px 30px; }
  .form-input-icon .fa {
    position: absolute;
    top: 24px;
    left: 0;
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    color: #fff;
    background: #ba8b00;
    border-radius: 2px; }
  .form-input-icon input {
    font-family: 'Montserrat', sans-serif; }
  .form-input-icon label {
    display: inline-block;
    width: auto;
    left: 30px;
    color: #777; }

.form-input-white input {
  color: #fff;
  border-bottom: 1px solid #eee; }
  .form-input-white textarea {
    color: #fff;
    border-bottom: 1px solid #eee; }
  .form-input-white label {
    color: #eee; }
  .form-input-white.mdl-textfield--floating-label.is-focused .mdl-textfield__label, .form-input-white.mdl-textfield--floating-label.is-dirty .mdl-textfield__label, .form-input-white.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label, .form-input-white.mdl-selectfield--floating-label.is-focused .mdl-selectfield__label, .form-input-white.mdl-selectfield--floating-label.is-dirty .mdl-selectfield__label {
    color: #eee; }

.form-radio {
  text-align: left; }
  .form-radio p {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 14px;
    color: #ffc107; }

.form-submit {
  padding: 10px 0 0 0; }

.or-using {
  position: relative;
  width: 70%;
  height: 1px;
  margin: 30px auto;
  font-size: 0;
  background: #ddd;
  text-align: center; }
  .or-using::before {
    content: 'Or Using';
    position: absolute;
    top: -10px;
    left: 50%;
    display: inline-block;
    margin-left: -55px;
    padding: 0 30px;
    font-size: 12px;
    color: #777;
    background: #fff;
    z-index: 1; }

.social-login a {
  display: inline-block;
  width: 49%;
  padding: 12px 0;
  font-size: 14px;
  color: #fff; }
  .social-login a .fa {
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    margin: 0 10px 0 0;
    background: #fff;
    border-radius: 2px; }
  .social-login a .fa-facebook {
    color: #3b5999; }
  .social-login a .fa-google {
    color: #dc4a38; }

.social-facebook {
  background: #3b5999; }

.social-google {
  background: #dc4a38; }

.login-link {
  padding: 20px 20px 20px 20px;
  overflow: hidden;
  background: #f2f2f2;
  margin: 20px auto 0 auto; }
  .login-link span {
    display: block;
    text-align: center; }
  .login-link a {
    display: inline-block;
    font-size: 14px;
    color: #ffc107;
    letter-spacing: 0.5px;
    margin: 0 0 0 5px;
    cursor: pointer; }

.forgot-pass {
  position: absolute;
  bottom: 0;
  right: 0;
  font-size: 12px;
  color: #ffc107;
  cursor: pointer; }
/*************************************************
 [ 12.0 MYAPPOINTMENT CSS START ] *****************
 **************************************************/
.myappointment-text {
  font-size: 14px;
  color: #333;
  padding: 5px 0; }
  .myappointment-text .fa {
    vertical-align: middle;
    width: 30px;
    height: 20px;
    line-height: 20px;
    font-size: 16px;
    text-align: center;
    color: #777; }
  .myappointment-text span {
    display: inline-block;
    vertical-align: middle;
    max-width: 85%;
    margin: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden; }

.myappointment-container .theme-material-card {
  margin: 0 0 30px 0; }

.myappointment-view, .myfeedback-view {
  overflow: hidden;
  padding: 10px 0 0 0; }

.myappointment-popup-tbl .tbl-cell, .myfeedback-popup-tbl .tbl-cell {
  vertical-align: top;
  padding: 5px 10px; }
  .myappointment-popup-tbl .tbl-cell span, .myfeedback-popup-tbl .tbl-cell span {
    display: inline-block;
    margin: 0; }
  .myappointment-popup-tbl .tbl-cell .fa, .myfeedback-popup-tbl .tbl-cell .fa {
    font-size: 18px;
    color: #999;
    width: 40px;
    height: 30px;
    line-height: 30px;
    text-align: center; }
  .myappointment-popup-tbl .tbl-cell p, .myfeedback-popup-tbl .tbl-cell p {
    text-align: left;
    margin: 0; }
/*************************************************
 [ 13.0 GALLERY PAGE CSS START ] ******************
 **************************************************/
.gallery-container {
  text-align: center; }
  .gallery-container ul {
    position: relative;
    width: 100%;
    font-size: 0;
    padding: 0;
    overflow: hidden; }
  .gallery-container ul li {
    position: relative;
    min-height: 1px;
    width: 25%;
    float: left;
    font-size: 0;
    display: inline-block;
    position: relative;
    overflow: hidden;
    padding: 25% 15px 0 15px;
    cursor: pointer; }
  .gallery-container ul li a {
    display: block;
    width: 100%;
    height: 100%; }
  .gallery-container ul li img {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    -webkit-filter: grayscale(60%);
    filter: grayscale(60%);
    -webkit-transition: filter, transform, 0.4s;
    transition: filter, transform, 0.4s; }
  .gallery-container ul li:hover img {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
    transform: scale(1.15); }

.gallery-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(242, 242, 242, 0.1);
  padding: 20px;
  -webkit-transition: background 0.4s;
  transition: background 0.4s; }

.gallery-layer-dark {
  position: relative;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  top: 50%;
  left: 50%;
  font-size: 14px;
  text-align: center;
  letter-spacing: 1px;
  opacity: 0;
  -webkit-transition: opacity 0.4s;
  transition: opacity 0.4s;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }
  .gallery-layer-dark:hover {
    opacity: 1; }
  .gallery-layer-dark p {
    position: absolute;
    top: 49%;
    left: 0;
    margin-top: -44px;
    right: 0;
    display: table-cell;
    color: #ffc107;
    font-size: 36px;
    z-index: 1; }
  .gallery-layer-dark p .fa {
    width: 80px;
    height: 80px;
    line-height: 80px;
    text-align: center;
    background: rgba(255, 255, 255, 0.9);
    border-radius: 4px; }
/*************************************************
 [ 14.0 BLOG LIST CSS START ] *********************
 **************************************************/
.blog-card-date {
  position: absolute;
  top: 0;
  left: 0;
  width: 75px;
  font-size: 16px;
  color: #6d5200;
  padding: 10px 20px;
  background: #ffe7a0;
  border-bottom-right-radius: 50%;
  z-index: 1; }

.blog-card-ttl {
  padding: 15px; }
  .blog-card-ttl h3 {
    line-height: normal;
    text-align: left;
    height: 48px;
    margin: 0; }
  .blog-card-ttl h3 a {
    display: block;
    height: 48px;
    font-size: 16px;
    line-height: 23px;
    overflow: hidden; }

.blog-card-details {
  padding: 0 15px;
  text-align: center;
  background: #666; }
  .blog-card-details p {
    display: inline-block;
    vertical-align: middle;
    width: 49%;
    padding: 10px 0;
    margin: 0;
    font-size: 14px;
    color: #999;
    letter-spacing: 0.5px;
    border-right: 1px solid #ddd;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis; }
  .blog-card-details p .fa {
    padding: 0 5px 0 0;
    font-size: 18px; }
  .blog-card-details p:nth-last-child(1) {
    border-right: 0; }
  .blog-card-details a {
    display: inline-block;
    font-size: 14px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    color: #ffc107;
    height: auto;
    padding: 8px 15px;
    border: 2px solid transparent;
    line-height: normal; }

.blog-list-block {
  padding: 20px 0;
  text-align: center; }

.blog-list-picture {
  width: 330px;
  margin: 0 auto; }

.blog-list-ttl {
  text-align: center; }
  .blog-list-ttl h3 {
    display: block;
    max-height: 72px;
    font-size: 24px;
    color: #555;
    line-height: 36px;
    margin: 20px 0;
    overflow: hidden; }
  .blog-list-ttl a {
    display: inline-block;
    vertical-align: middle;
    height: 72px; }

.blog-list-meta p {
  font-size: 14px;
  color: #ba8b00;
  margin: 15px 0 0 0;
  font-weight: 500;
  letter-spacing: 0.5px; }

.blog-list-post p {
  padding: 10px 0 0 0; }
  .blog-list-post a {
    color: #6d5200; }

.blog-full-date {
  position: absolute;
  top: 0;
  left: 16px;
  width: 70px;
  padding: 10px;
  font-size: 14px;
  color: #6d5200;
  background: #ffe7a0;
  border-bottom-right-radius: 50%;
  z-index: 2; }

.blog-full-ttl h3 {
  font-size: 20px;
  color: #333;
  line-height: 28px;
  text-align: left;
  margin: 0; }

.blog-full-description {
  text-align: left;
  padding: 5px 0 0 0;
  font-size: 13px;
  color: #777;
  letter-spacing: 0.5px;
  line-height: 21px; }

.blog-full-ftr {
  margin: 10px 0 0 0;
  padding: 10px 0 0 0;
  border-top: 1px solid #eee;
  overflow: hidden; }

.blog-full-author {
  font-size: 14px;
  color: #333;
  letter-spacing: 0.5px; }
  .blog-full-author .fa {
    font-size: 16px;
    color: #ffc107;
    margin: 0 5px 0 0; }
/*************************************************
 [ 15.0 BLOG PAGE CSS START ] *********************
 **************************************************/
.blog-container {
  width: 100%;
  margin: 0 auto; }

.blog-picture {
  width: 60%;
  margin: 0 auto; }
  .blog-picture img {
    width: 100%;
    height: auto; }

.blog-ttl {
  font-size: 24px;
  color: #333;
  font-family: 'Montserrat', sans-serif;
  padding: 20px 0 10px 0;
  margin: 0;
  text-align: center;
  line-height: 46px;
  overflow: hidden; }

.blog-detail {
  padding: 0; }
  .blog-detail li {
    list-style: none;
    display: inline-block;
    margin: 10px;
    font-size: 14px;
    color: #777;
    line-height: 20px; }
  .blog-detail li .fa {
    position: relative;
    top: -1px;
    margin: 0 5px 0 0; }

.blog-meta {
  margin: 15px 0 0 0;
  padding: 15px 10px 0 10px;
  border-top: 1px solid #ddd; }
  .blog-meta > div {
    padding: 0; }

.blog-post {
  padding: 0 10px; }
  .blog-post p {
    text-align: justify; }
  .blog-post ol {
    text-align: left;
    padding: 0 30px; }

.blog-tag {
  text-align: left; }
  .blog-tag p {
    margin: 0;
    display: inline-block;
    vertical-align: middle;
    color: #999; }
  .blog-tag ul {
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    padding: 0; }
  .blog-tag li {
    display: inline-block;
    list-style: none;
    margin: 5px; }
  .blog-tag li a {
    font-size: 14px;
    color: #555; }
  .blog-tag li a:hover {
    color: #ffc107; }

.blog-block-3 {
  padding: 0 20px 40px 20px; }

.blog-recent {
  padding: 0 0 10px 0;
  margin: 0 0 10px 0;
  border-bottom: 1px solid #eee; }
  .blog-recent:nth-last-child(1) {
    border-bottom: 0;
    margin: 0;
    padding: 0; }
  .blog-recent:hover .blog-recent-post h4 {
    color: #6d5200; }

.blog-recent-img {
  padding-left: 0; }

.blog-recent-post {
  text-align: left;
  padding: 0 10px 0 0; }
  .blog-recent-post h4 {
    font-size: 14px;
    color: #333;
    margin: 0; }
  .blog-recent-post p {
    font-size: 12px;
    color: #aaa;
    letter-spacing: 0.5px;
    margin: 5px 0 0 0; }

.blog-author-details {
  text-align: left; }
  .blog-author-details h4 {
    font-size: 20px;
    color: #333;
    margin: 0; }
  .blog-author-details a {
    display: block;
    font-size: 12px;
    margin: 0 0 5px 0;
    color: #ffc107; }
  .blog-author-details p {
    font-size: 13px;
    color: #555;
    line-height: 20px;
    letter-spacing: 0.5px;
    margin: 0; }

.comment-list {
  margin: 0;
  padding: 0; }
  .comment-list > li {
    position: relative;
    list-style: none;
    margin: 0 0 20px 0;
    padding: 0 0 10px 0;
    border-bottom: 1px solid #eee; }
  .comment-list > li:nth-last-child(1) {
    margin: 0;
    padding: 0;
    border-bottom: 0; }

.second-comment {
  margin: 20px 0 0 17%;
  padding: 20px 0 0 0;
  border-top: 1px solid #eee; }

.comment-meta span {
  display: inline-block;
  font-size: 16px;
  font-family: 'Montserrat', sans-serif;
  color: #555;
  margin: 0 14px 0 0; }
  .comment-meta span:nth-last-child(1) {
    padding: 0 0 0 16px;
    font-family: 'Montserrat', sans-serif;
    font-size: 12px;
    color: #ffc107;
    border-left: 1px solid #ddd; }

.comment-post {
  padding: 5px 0 0 0;
  font-size: 13px;
  color: #555;
  line-height: 20px;
  letter-spacing: 0.5px; }

.comment-action {
  padding: 0;
  margin: 0; }
  .comment-action li {
    list-style: none;
    display: inline-block;
    margin: 5px; }
  .comment-action li a {
    font-size: 12px;
    color: #555;
    padding: 5px;
    cursor: pointer; }
  .comment-action li a:hover {
    color: #ffc107; }
  .comment-action li .fa {
    margin: 0 5px 0 0;
    color: #999; }

.comment-form {
  padding: 20px; }
  .comment-form .mdl-textfield {
    width: 100%; }
/*************************************************
 [ 16.0 Footer CSS START ] ************************
 **************************************************/
/* [ 16.1 EMERGENCY LAYER CSS START ] */
#emergency {
  width: 100%;
  text-align: center;
  background: #666; }
  #emergency .paragraph-medium {
    max-width: 700px;
    margin: 0 auto;
    padding: 0 30px;
    text-align: center; }

.emergency-number {
  font-size: 32px;
  color: #555;
  padding: 30px 0 0 0; }

#footer {
  width: 100%;
  color: #d9d9d9;
  background: #383838;
  border-top: 5px solid #6d5200; }

.footer-block {
  padding: 0 20px; }
  .footer-block:nth-child(2) {
    border-left: 1px solid #6d5200;
    border-right: 1px solid #6d5200; }

.footer-ttl {
  padding: 0 0 10px 20px; }
  .footer-ttl p {
    display: inline-block;
    font-size: 16px;
    margin: 0;
    text-transform: uppercase;
    padding: 10px;
    border-radius: 4px; }

.footer-container {
  padding: 20px 30px; }
  .footer-container a {
    display: block;
    font-size: 14px;
    margin: 10px 0; }

.footer-b .tbl-cell {
  padding: 0;
  vertical-align: top; }
  .footer-b .tbl-cell:nth-last-child(1) {
    padding: 0 0 0 10px; }
  .footer-b li {
    list-style-type: none; }
  .footer-b p {
    display: block; }
  .footer-b a {
    position: relative;
    display: inline-block;
    margin: 5px 0;
    padding: 0 0 0 10px;
    letter-spacing: 0.5px; }
  .footer-b a::before {
    content: '';
    position: absolute;
    top: 9px;
    left: 0;
    width: 3px;
    height: 3px;
    background: #aaa;
    border-radius: 50%; }
  .footer-b a:hover {
    color: #ffc107; }

.footer-a .tbl-row:nth-last-child(1) .tbl-cell {
  border-bottom: 0; }
  .footer-a .tbl-cell {
    padding: 10px;
    border-bottom: 1px solid #999; }
  .footer-a .tbl-cell p {
    color: #ffe7a0; }
  .footer-a .tbl-cell .fa {
    font-size: 28px;
    color: #ddd; }
  .footer-a .tbl-cell .fa.fa-phone {
    font-size: 25px; }
  .footer-a .tbl-cell .fa.fa-envelope {
    font-size: 22px; }
  .footer-a .tbl-cell p {
    margin: 0; }

.footer-subscribe input {
  color: #ddd;
  border-bottom: 1px solid #ddd; }
  .footer-subscribe label {
    color: #ddd; }

.footer-subscribe-button {
  padding: 10px 0 0 0; }
  .footer-subscribe-button button:hover {
    color: #fff;
    opacity: 0.8;
    background: #ffc107; }

.footer-social {
  padding: 20px 0 0 0; }
/* [ 16.2 FOOTER COPYRIGHT CSS START ] */
#copyright {
  width: 100%;
  padding: 10px 0;
  color: #ffc107;
  background: #383838; }
  #copyright .paragraph-medium {
    margin: 0;
    text-align: center;
    text-transform: uppercase; }
/*************************************************
 [ 17.0 MEDIA QUERIES START ] *********************
 **************************************************/
/* FROM 1200px TO 1400px */
/* FROM 992px TO 1199PX */

/* FROM 0PX TO 992PX */

@media only screen and (max-width: 992px) {
  .slider-info h1, .slider-info h2 {
    font-size: 34px; }

  .hm-about-block {
    width: auto; }

  .blog-page-container {
    width: 100%; }

  .hm-feature-block {
    width: 33.33%; }

  .gallery-container ul li {
    width: 33.33%;
    padding-top: 33.33%; }

  .feature-block {
    width: 50%; }

  .profile-right .profile-edit, .edit-profile-right .profile-edit {
    padding: 20px 0 0 0; }

  .menu {
    position: fixed;
    top: 0;
    left: -130%;
    width: 100%;
    min-height: 100%;
    padding: 30px 60px 30px 20px !important;
    overflow-y: scroll;
    background: linear-gradient(-90deg, rgba(255, 212, 84, 1), rgba(186, 139, 0, 1));
    z-index: 999999;
    -webkit-transition: all 0.4s;
    transition: all 0.4s; }
    .menu li {
      position: relative !important;
      display: block; }
      .menu li a {
        display: block;
        height: auto;
        font-size: 14px;
        text-align: left;
        color: #fff;
        padding: 5px;
        text-transform: none; }
      .menu li li a {
        color: #333; }

  .menu-dropdown {
    width: 70%;
    left: inherit;
    right: -55px;
    z-index: 9999999; }
    .menu-dropdown li:hover .menu-dropdown {
      display: block; }
    .menu-dropdown .menu-dropdown {
      display: none;
      left: 0;
      width: 100%;
      position: relative;
      box-shadow: none;
      z-index: 9999999; }

  .menu-megamenu {
    width: 70%;
    left: inherit;
    right: -55px; }

  .mobile-menu-close {
    display: block !important; }

  #menu-bar {
    display: block; }

  .hm-feature-block {
    width: 50%; }

  .footer-block:nth-child(2) {
    padding: 20px;
    margin: 0 0 30px 0;
    border: 0;
    border-top: 1px solid #555;
    border-bottom: 1px solid #555; }

  .hm-service-right {
    padding: 20px 0 0 0; } }
/* FROM 768PX TO 979PX */
/* FROM 0PX TO 768PX */

@media only screen and (max-width: 768px) {
  .slider-info {
    padding: 0 5%; }
    .slider-info h1, .slider-info h2 {
      font-size: 24px; }

  .gallery-container ul li {
    width: 50%;
    padding-top: 50%; }

  .service-description {
    min-height: inherit; }

  .blog-list-block {
    width: 100%;
    padding: 10px;
    height: auto; }

  .map-address {
    display: none;
    z-index: 9999; }

  .contact-info-block {
    padding: 10px 15px; }

  .feature-block {
    width: 100%; }

  .productp-social {
    position: relative; }

  .hidden-xs {
    display: none !important; } }
/* FROM 0PX TO 480PX */
@media only screen and (max-width: 480px) {
  .layer-ttl h3 {
    font-size: 28px; }

  .hdr-logo a img {
    height: 30px; }

  .slider-info h1, .slider-info h2 {
    font-size: 20px; }
    .slider-info p {
      display: none; }

  .slider-appointment {
    display: none; }

  .gallery-container ul li {
    width: 100%;
    padding-top: 100%; }

  .blog-list-picture {
    width: 100%;
    height: auto;
    max-height: 280px; }

  .blog-page-picture {
    width: 100%; }

  .blog-page-ttl {
    font-size: 20px; }

  .hm-feature-block {
    width: 100%; }

  .hm-blog-picture {
    height: auto;
    max-height: 280px; }

  .paragraph-medium {
    font-size: 12px; }

  #emergency .paragraph-medium {
    padding: 0; }

  .emergency-number {
    font-size: 24px; }

  .department-icon .fa {
    width: 60px;
    height: 60px;
    line-height: 60px;
    font-size: 28px; }

  .department-detail a {
    font-size: 16px; }

  .blog-list-ttl h4 {
    font-size: 28px; }

  .form-container {
    max-width: 100%; }

  .footer-block {
    padding: 20px 0; }
    .footer-block:nth-child(2) {
      padding: 20px 0; } }