11459 lines
300 KiB
CSS
11459 lines
300 KiB
CSS
/**
|
|
* material-design-lite - Material Design Components in CSS, JS and HTML
|
|
* @version v1.0.0
|
|
* @link https://github.com/google/material-design-lite
|
|
* @license Apache-2
|
|
*/
|
|
@charset "UTF-8";
|
|
/**
|
|
* 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.
|
|
*/
|
|
/* Material Design Lite */
|
|
/**
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
/**
|
|
* 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.
|
|
*/
|
|
/* Typography */
|
|
/* Shadows */
|
|
/* Animations */
|
|
/**
|
|
* 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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
/*
|
|
* 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: h5bp.com/i
|
|
* These selection rule sets have to be separate.
|
|
* Customize the background color to match your design.
|
|
*/
|
|
::-moz-selection {
|
|
background: #b3d4fc;
|
|
text-shadow: none; }
|
|
|
|
::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 images, videos, audio and canvas and the bottom of
|
|
* their containers: h5bp.com/i/440
|
|
*/
|
|
audio, canvas, 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; }
|
|
|
|
/* ==========================================================================
|
|
Browse Happy prompt
|
|
========================================================================== */
|
|
.browsehappy {
|
|
margin: 0.2em 0;
|
|
background: #ccc;
|
|
color: #000;
|
|
padding: 0.2em 0; }
|
|
|
|
/* ==========================================================================
|
|
Author's custom styles
|
|
========================================================================== */
|
|
/* ==========================================================================
|
|
Helper classes
|
|
========================================================================== */
|
|
/*
|
|
* Hide visually and from screen readers: h5bp.com/u
|
|
*/
|
|
.hidden {
|
|
display: none !important;
|
|
visibility: hidden; }
|
|
|
|
/*
|
|
* Hide only visually, but have it available for screen readers: h5bp.com/v
|
|
*/
|
|
.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: h5bp.com/p
|
|
*/
|
|
.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.
|
|
========================================================================== */
|
|
/* ==========================================================================
|
|
Print styles.
|
|
Inlined to avoid the additional HTTP request: h5bp.com/r
|
|
========================================================================== */
|
|
@media print {
|
|
*, *:before, *:after {
|
|
background: transparent !important;
|
|
color: #000 !important;
|
|
/* Black prints faster: h5bp.com/s */
|
|
box-shadow: none !important;
|
|
text-shadow: none !important; }
|
|
a, a:visited {
|
|
text-decoration: underline; }
|
|
a[href]:after {
|
|
content: " (" attr(href) ")"; }
|
|
abbr[title]:after {
|
|
content: " (" attr(title) ")"; }
|
|
/*
|
|
* Don't show links that are fragment identifiers,
|
|
* or use the `javascript:` pseudo protocol
|
|
*/
|
|
a[href^="#"]:after, a[href^="javascript:"]:after {
|
|
content: ""; }
|
|
pre, blockquote {
|
|
border: 1px solid #999;
|
|
page-break-inside: avoid; }
|
|
thead {
|
|
display: table-header-group;
|
|
/* h5bp.com/t */ }
|
|
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); }
|
|
|
|
/*
|
|
* 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; }
|
|
|
|
/**
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
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(0,172,193);
|
|
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; }
|
|
|
|
/**
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
@font-face {
|
|
font-family: 'Material-Design-Iconic-Font';
|
|
src: url('../fonts/Material-Design-Iconic-Font.eot?v=1.1.1');
|
|
src: url('../fonts/Material-Design-Iconic-Font.eot?#iefix&v=1.1.1') format('embedded-opentype'), url('../fonts/Material-Design-Iconic-Font.woff?v=1.1.1') format('woff'), url('../fonts/Material-Design-Iconic-Font.ttf?v=1.1.1') format('truetype');
|
|
font-weight: normal;
|
|
font-style: normal; }
|
|
|
|
.mdl-icon {
|
|
font-family: 'Material-Design-Iconic-Font';
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale; }
|
|
|
|
.mdl-icon--3d-rotation:before {
|
|
content: "\f000"; }
|
|
|
|
.mdl-icon--accessibility:before {
|
|
content: "\f001"; }
|
|
|
|
.mdl-icon--account-balance:before {
|
|
content: "\f002"; }
|
|
|
|
.mdl-icon--account-balance-wallet:before {
|
|
content: "\f003"; }
|
|
|
|
.mdl-icon--account-box:before {
|
|
content: "\f004"; }
|
|
|
|
.mdl-icon--account-child:before {
|
|
content: "\f005"; }
|
|
|
|
.mdl-icon--account-circle:before {
|
|
content: "\f006"; }
|
|
|
|
.mdl-icon--add-shopping-cart:before {
|
|
content: "\f007"; }
|
|
|
|
.mdl-icon--alarm:before {
|
|
content: "\f008"; }
|
|
|
|
.mdl-icon--alarm-add:before {
|
|
content: "\f009"; }
|
|
|
|
.mdl-icon--alarm-off:before {
|
|
content: "\f00a"; }
|
|
|
|
.mdl-icon--alarm-on:before {
|
|
content: "\f00b"; }
|
|
|
|
.mdl-icon--android:before {
|
|
content: "\f00c"; }
|
|
|
|
.mdl-icon--announcement:before {
|
|
content: "\f00d"; }
|
|
|
|
.mdl-icon--aspect-ratio:before {
|
|
content: "\f00e"; }
|
|
|
|
.mdl-icon--assessment:before {
|
|
content: "\f00f"; }
|
|
|
|
.mdl-icon--assignment:before {
|
|
content: "\f010"; }
|
|
|
|
.mdl-icon--assignment-ind:before {
|
|
content: "\f011"; }
|
|
|
|
.mdl-icon--assignment-late:before {
|
|
content: "\f012"; }
|
|
|
|
.mdl-icon--assignment-return:before {
|
|
content: "\f013"; }
|
|
|
|
.mdl-icon--assignment-returned:before {
|
|
content: "\f014"; }
|
|
|
|
.mdl-icon--assignment-turned-in:before {
|
|
content: "\f015"; }
|
|
|
|
.mdl-icon--autorenew:before {
|
|
content: "\f016"; }
|
|
|
|
.mdl-icon--backup:before {
|
|
content: "\f017"; }
|
|
|
|
.mdl-icon--book:before {
|
|
content: "\f018"; }
|
|
|
|
.mdl-icon--bookmark:before {
|
|
content: "\f019"; }
|
|
|
|
.mdl-icon--bookmark-outline:before {
|
|
content: "\f01a"; }
|
|
|
|
.mdl-icon--bug-report:before {
|
|
content: "\f01b"; }
|
|
|
|
.mdl-icon--cached:before {
|
|
content: "\f01c"; }
|
|
|
|
.mdl-icon--class:before {
|
|
content: "\f01d"; }
|
|
|
|
.mdl-icon--credit-card:before {
|
|
content: "\f01e"; }
|
|
|
|
.mdl-icon--dashboard:before {
|
|
content: "\f01f"; }
|
|
|
|
.mdl-icon--delete:before {
|
|
content: "\f020"; }
|
|
|
|
.mdl-icon--description:before {
|
|
content: "\f021"; }
|
|
|
|
.mdl-icon--dns:before {
|
|
content: "\f022"; }
|
|
|
|
.mdl-icon--done:before {
|
|
content: "\f023"; }
|
|
|
|
.mdl-icon--done-all:before {
|
|
content: "\f024"; }
|
|
|
|
.mdl-icon--event:before {
|
|
content: "\f025"; }
|
|
|
|
.mdl-icon--exit-to-app:before {
|
|
content: "\f026"; }
|
|
|
|
.mdl-icon--explore:before {
|
|
content: "\f027"; }
|
|
|
|
.mdl-icon--extension:before {
|
|
content: "\f028"; }
|
|
|
|
.mdl-icon--face-unlock:before {
|
|
content: "\f029"; }
|
|
|
|
.mdl-icon--favorite:before {
|
|
content: "\f02a"; }
|
|
|
|
.mdl-icon--favorite-outline:before {
|
|
content: "\f02b"; }
|
|
|
|
.mdl-icon--find-in-page:before {
|
|
content: "\f02c"; }
|
|
|
|
.mdl-icon--find-replace:before {
|
|
content: "\f02d"; }
|
|
|
|
.mdl-icon--flip-to-back:before {
|
|
content: "\f02e"; }
|
|
|
|
.mdl-icon--flip-to-front:before {
|
|
content: "\f02f"; }
|
|
|
|
.mdl-icon--get-app:before {
|
|
content: "\f030"; }
|
|
|
|
.mdl-icon--grade:before {
|
|
content: "\f031"; }
|
|
|
|
.mdl-icon--group-work:before {
|
|
content: "\f032"; }
|
|
|
|
.mdl-icon--help:before {
|
|
content: "\f033"; }
|
|
|
|
.mdl-icon--highlight-remove:before {
|
|
content: "\f034"; }
|
|
|
|
.mdl-icon--history:before {
|
|
content: "\f035"; }
|
|
|
|
.mdl-icon--home:before {
|
|
content: "\f036"; }
|
|
|
|
.mdl-icon--https:before {
|
|
content: "\f037"; }
|
|
|
|
.mdl-icon--info:before {
|
|
content: "\f038"; }
|
|
|
|
.mdl-icon--info-outline:before {
|
|
content: "\f039"; }
|
|
|
|
.mdl-icon--input:before {
|
|
content: "\f03a"; }
|
|
|
|
.mdl-icon--invert-colors:before {
|
|
content: "\f03b"; }
|
|
|
|
.mdl-icon--label:before {
|
|
content: "\f03c"; }
|
|
|
|
.mdl-icon--label-outline:before {
|
|
content: "\f03d"; }
|
|
|
|
.mdl-icon--language:before {
|
|
content: "\f03e"; }
|
|
|
|
.mdl-icon--launch:before {
|
|
content: "\f03f"; }
|
|
|
|
.mdl-icon--list:before {
|
|
content: "\f040"; }
|
|
|
|
.mdl-icon--lock:before {
|
|
content: "\f041"; }
|
|
|
|
.mdl-icon--lock-open:before {
|
|
content: "\f042"; }
|
|
|
|
.mdl-icon--lock-outline:before {
|
|
content: "\f043"; }
|
|
|
|
.mdl-icon--loyalty:before {
|
|
content: "\f044"; }
|
|
|
|
.mdl-icon--markunread-mailbox:before {
|
|
content: "\f045"; }
|
|
|
|
.mdl-icon--note-add:before {
|
|
content: "\f046"; }
|
|
|
|
.mdl-icon--open-in-browser:before {
|
|
content: "\f047"; }
|
|
|
|
.mdl-icon--open-in-new:before {
|
|
content: "\f048"; }
|
|
|
|
.mdl-icon--open-with:before {
|
|
content: "\f049"; }
|
|
|
|
.mdl-icon--pageview:before {
|
|
content: "\f04a"; }
|
|
|
|
.mdl-icon--payment:before {
|
|
content: "\f04b"; }
|
|
|
|
.mdl-icon--perm-camera-mic:before {
|
|
content: "\f04c"; }
|
|
|
|
.mdl-icon--perm-contact-cal:before {
|
|
content: "\f04d"; }
|
|
|
|
.mdl-icon--perm-data-setting:before {
|
|
content: "\f04e"; }
|
|
|
|
.mdl-icon--perm-device-info:before {
|
|
content: "\f04f"; }
|
|
|
|
.mdl-icon--perm-identity:before {
|
|
content: "\f050"; }
|
|
|
|
.mdl-icon--perm-media:before {
|
|
content: "\f051"; }
|
|
|
|
.mdl-icon--perm-phone-msg:before {
|
|
content: "\f052"; }
|
|
|
|
.mdl-icon--perm-scan-wifi:before {
|
|
content: "\f053"; }
|
|
|
|
.mdl-icon--picture-in-picture:before {
|
|
content: "\f054"; }
|
|
|
|
.mdl-icon--polymer:before {
|
|
content: "\f055"; }
|
|
|
|
.mdl-icon--print:before {
|
|
content: "\f056"; }
|
|
|
|
.mdl-icon--query-builder:before {
|
|
content: "\f057"; }
|
|
|
|
.mdl-icon--question-answer:before {
|
|
content: "\f058"; }
|
|
|
|
.mdl-icon--receipt:before {
|
|
content: "\f059"; }
|
|
|
|
.mdl-icon--redeem:before {
|
|
content: "\f05a"; }
|
|
|
|
.mdl-icon--reorder:before {
|
|
content: "\f094"; }
|
|
|
|
.mdl-icon--report-problem:before {
|
|
content: "\f05b"; }
|
|
|
|
.mdl-icon--restore:before {
|
|
content: "\f05c"; }
|
|
|
|
.mdl-icon--room:before {
|
|
content: "\f05d"; }
|
|
|
|
.mdl-icon--schedule:before {
|
|
content: "\f05e"; }
|
|
|
|
.mdl-icon--search:before {
|
|
content: "\f05f"; }
|
|
|
|
.mdl-icon--settings:before {
|
|
content: "\f060"; }
|
|
|
|
.mdl-icon--settings-applications:before {
|
|
content: "\f061"; }
|
|
|
|
.mdl-icon--settings-backup-restore:before {
|
|
content: "\f062"; }
|
|
|
|
.mdl-icon--settings-bluetooth:before {
|
|
content: "\f063"; }
|
|
|
|
.mdl-icon--settings-cell:before {
|
|
content: "\f064"; }
|
|
|
|
.mdl-icon--settings-display:before {
|
|
content: "\f065"; }
|
|
|
|
.mdl-icon--settings-ethernet:before {
|
|
content: "\f066"; }
|
|
|
|
.mdl-icon--settings-input-antenna:before {
|
|
content: "\f067"; }
|
|
|
|
.mdl-icon--settings-input-component:before {
|
|
content: "\f068"; }
|
|
|
|
.mdl-icon--settings-input-composite:before {
|
|
content: "\f069"; }
|
|
|
|
.mdl-icon--settings-input-hdmi:before {
|
|
content: "\f06a"; }
|
|
|
|
.mdl-icon--settings-input-svideo:before {
|
|
content: "\f06b"; }
|
|
|
|
.mdl-icon--settings-overscan:before {
|
|
content: "\f06c"; }
|
|
|
|
.mdl-icon--settings-phone:before {
|
|
content: "\f06d"; }
|
|
|
|
.mdl-icon--settings-power:before {
|
|
content: "\f06e"; }
|
|
|
|
.mdl-icon--settings-remote:before {
|
|
content: "\f06f"; }
|
|
|
|
.mdl-icon--settings-voice:before {
|
|
content: "\f070"; }
|
|
|
|
.mdl-icon--shop:before {
|
|
content: "\f071"; }
|
|
|
|
.mdl-icon--shopping-basket:before {
|
|
content: "\f072"; }
|
|
|
|
.mdl-icon--shopping-cart:before {
|
|
content: "\f073"; }
|
|
|
|
.mdl-icon--shop-two:before {
|
|
content: "\f074"; }
|
|
|
|
.mdl-icon--speaker-notes:before {
|
|
content: "\f075"; }
|
|
|
|
.mdl-icon--spellcheck:before {
|
|
content: "\f076"; }
|
|
|
|
.mdl-icon--star-rate:before {
|
|
content: "\f077"; }
|
|
|
|
.mdl-icon--stars:before {
|
|
content: "\f078"; }
|
|
|
|
.mdl-icon--store:before {
|
|
content: "\f079"; }
|
|
|
|
.mdl-icon--subject:before {
|
|
content: "\f07a"; }
|
|
|
|
.mdl-icon--supervisor-account:before {
|
|
content: ""; }
|
|
|
|
.mdl-icon--swap-horiz:before {
|
|
content: "\f07b"; }
|
|
|
|
.mdl-icon--swap-vert:before {
|
|
content: "\f07c"; }
|
|
|
|
.mdl-icon--swap-vert-circle:before {
|
|
content: "\f07d"; }
|
|
|
|
.mdl-icon--system-update-tv:before {
|
|
content: "\f07e"; }
|
|
|
|
.mdl-icon--tab:before {
|
|
content: "\f07f"; }
|
|
|
|
.mdl-icon--tab-unselected:before {
|
|
content: "\f080"; }
|
|
|
|
.mdl-icon--theaters:before {
|
|
content: "\f081"; }
|
|
|
|
.mdl-icon--thumb-down:before {
|
|
content: "\f082"; }
|
|
|
|
.mdl-icon--thumbs-up-down:before {
|
|
content: "\f083"; }
|
|
|
|
.mdl-icon--thumb-up:before {
|
|
content: "\f084"; }
|
|
|
|
.mdl-icon--toc:before {
|
|
content: "\f085"; }
|
|
|
|
.mdl-icon--today:before {
|
|
content: "\f086"; }
|
|
|
|
.mdl-icon--track-changes:before {
|
|
content: "\f087"; }
|
|
|
|
.mdl-icon--translate:before {
|
|
content: "\f088"; }
|
|
|
|
.mdl-icon--trending-down:before {
|
|
content: "\f089"; }
|
|
|
|
.mdl-icon--trending-neutral:before {
|
|
content: "\f08a"; }
|
|
|
|
.mdl-icon--trending-up:before {
|
|
content: "\f08b"; }
|
|
|
|
.mdl-icon--turned-in:before {
|
|
content: "\f08c"; }
|
|
|
|
.mdl-icon--turned-in-not:before {
|
|
content: "\f08d"; }
|
|
|
|
.mdl-icon--verified-user:before {
|
|
content: "\f08e"; }
|
|
|
|
.mdl-icon--view-agenda:before {
|
|
content: "\f08f"; }
|
|
|
|
.mdl-icon--view-array:before {
|
|
content: "\f090"; }
|
|
|
|
.mdl-icon--view-carousel:before {
|
|
content: "\f091"; }
|
|
|
|
.mdl-icon--view-column:before {
|
|
content: "\f092"; }
|
|
|
|
.mdl-icon--view-day:before {
|
|
content: "\f093"; }
|
|
|
|
.mdl-icon--view-headline:before {
|
|
content: "\f094"; }
|
|
|
|
.mdl-icon--view-list:before {
|
|
content: "\f095"; }
|
|
|
|
.mdl-icon--view-module:before {
|
|
content: "\f096"; }
|
|
|
|
.mdl-icon--view-quilt:before {
|
|
content: "\f097"; }
|
|
|
|
.mdl-icon--view-stream:before {
|
|
content: "\f098"; }
|
|
|
|
.mdl-icon--view-week:before {
|
|
content: "\f099"; }
|
|
|
|
.mdl-icon--visibility:before {
|
|
content: "\f09a"; }
|
|
|
|
.mdl-icon--visibility-off:before {
|
|
content: "\f09b"; }
|
|
|
|
.mdl-icon--wallet-giftcard:before {
|
|
content: "\f09c"; }
|
|
|
|
.mdl-icon--wallet-membership:before {
|
|
content: "\f09d"; }
|
|
|
|
.mdl-icon--wallet-travel:before {
|
|
content: "\f09e"; }
|
|
|
|
.mdl-icon--work:before {
|
|
content: "\f09f"; }
|
|
|
|
.mdl-icon--error:before {
|
|
content: "\f0a0"; }
|
|
|
|
.mdl-icon--warning:before {
|
|
content: "\f0a1"; }
|
|
|
|
.mdl-icon--album:before {
|
|
content: "\f0a2"; }
|
|
|
|
.mdl-icon--av-timer:before {
|
|
content: "\f0a3"; }
|
|
|
|
.mdl-icon--closed-caption:before {
|
|
content: "\f0a4"; }
|
|
|
|
.mdl-icon--equalizer:before {
|
|
content: "\f0a5"; }
|
|
|
|
.mdl-icon--explicit:before {
|
|
content: "\f0a6"; }
|
|
|
|
.mdl-icon--fast-forward:before {
|
|
content: "\f0a7"; }
|
|
|
|
.mdl-icon--fast-rewind:before {
|
|
content: "\f0a8"; }
|
|
|
|
.mdl-icon--games:before {
|
|
content: "\f0a9"; }
|
|
|
|
.mdl-icon--hearing:before {
|
|
content: "\f0aa"; }
|
|
|
|
.mdl-icon--high-quality:before {
|
|
content: "\f0ab"; }
|
|
|
|
.mdl-icon--loop:before {
|
|
content: "\f0ac"; }
|
|
|
|
.mdl-icon--mic:before {
|
|
content: "\f0ad"; }
|
|
|
|
.mdl-icon--mic-none:before {
|
|
content: "\f0ae"; }
|
|
|
|
.mdl-icon--mic-off:before {
|
|
content: "\f0af"; }
|
|
|
|
.mdl-icon--movie:before {
|
|
content: "\f0b0"; }
|
|
|
|
.mdl-icon--my-library-add:before {
|
|
content: "\f0b1"; }
|
|
|
|
.mdl-icon--my-library-books:before {
|
|
content: "\f0b2"; }
|
|
|
|
.mdl-icon--my-library-music:before {
|
|
content: "\f0b3"; }
|
|
|
|
.mdl-icon--new-releases:before {
|
|
content: "\f0b4"; }
|
|
|
|
.mdl-icon--not-interested:before {
|
|
content: "\f0b5"; }
|
|
|
|
.mdl-icon--pause:before {
|
|
content: "\f0b6"; }
|
|
|
|
.mdl-icon--pause-circle-fill:before {
|
|
content: "\f0b7"; }
|
|
|
|
.mdl-icon--pause-circle-outline:before {
|
|
content: "\f0b8"; }
|
|
|
|
.mdl-icon--play-arrow:before {
|
|
content: "\f0b9"; }
|
|
|
|
.mdl-icon--play-circle-fill:before {
|
|
content: "\f0ba"; }
|
|
|
|
.mdl-icon--play-circle-outline:before {
|
|
content: "\f0bb"; }
|
|
|
|
.mdl-icon--playlist-add:before {
|
|
content: "\f0bc"; }
|
|
|
|
.mdl-icon--play-shopping-bag:before {
|
|
content: "\f0bd"; }
|
|
|
|
.mdl-icon--queue:before {
|
|
content: "\f0be"; }
|
|
|
|
.mdl-icon--queue-music:before {
|
|
content: "\f0bf"; }
|
|
|
|
.mdl-icon--radio:before {
|
|
content: "\f0c0"; }
|
|
|
|
.mdl-icon--recent-actors:before {
|
|
content: "\f0c1"; }
|
|
|
|
.mdl-icon--repeat:before {
|
|
content: "\f0c2"; }
|
|
|
|
.mdl-icon--repeat-one:before {
|
|
content: "\f0c3"; }
|
|
|
|
.mdl-icon--replay:before {
|
|
content: "\f0c4"; }
|
|
|
|
.mdl-icon--shuffle:before {
|
|
content: "\f0c5"; }
|
|
|
|
.mdl-icon--skip-next:before {
|
|
content: "\f0c6"; }
|
|
|
|
.mdl-icon--skip-previous:before {
|
|
content: "\f0c7"; }
|
|
|
|
.mdl-icon--snooze:before {
|
|
content: "\f0c8"; }
|
|
|
|
.mdl-icon--stop:before {
|
|
content: "\f0c9"; }
|
|
|
|
.mdl-icon--subtitles:before {
|
|
content: "\f0ca"; }
|
|
|
|
.mdl-icon--surround-sound:before {
|
|
content: "\f0cb"; }
|
|
|
|
.mdl-icon--videocam:before {
|
|
content: "\f0cc"; }
|
|
|
|
.mdl-icon--videocam-off:before {
|
|
content: "\f0cd"; }
|
|
|
|
.mdl-icon--video-collection:before {
|
|
content: "\f0ce"; }
|
|
|
|
.mdl-icon--volume-down:before {
|
|
content: "\f0cf"; }
|
|
|
|
.mdl-icon--volume-mute:before {
|
|
content: "\f0d0"; }
|
|
|
|
.mdl-icon--volume-off:before {
|
|
content: "\f0d1"; }
|
|
|
|
.mdl-icon--volume-up:before {
|
|
content: "\f0d2"; }
|
|
|
|
.mdl-icon--web:before {
|
|
content: "\f0d3"; }
|
|
|
|
.mdl-icon--business:before {
|
|
content: "\f0d4"; }
|
|
|
|
.mdl-icon--call:before {
|
|
content: "\f0d5"; }
|
|
|
|
.mdl-icon--call-end:before {
|
|
content: "\f0d6"; }
|
|
|
|
.mdl-icon--call-made:before {
|
|
content: "\f0d7"; }
|
|
|
|
.mdl-icon--call-merge:before {
|
|
content: "\f0d8"; }
|
|
|
|
.mdl-icon--call-missed:before {
|
|
content: "\f0d9"; }
|
|
|
|
.mdl-icon--call-received:before {
|
|
content: "\f0da"; }
|
|
|
|
.mdl-icon--call-split:before {
|
|
content: "\f0db"; }
|
|
|
|
.mdl-icon--chat:before {
|
|
content: "\f0dc"; }
|
|
|
|
.mdl-icon--clear-all:before {
|
|
content: "\f0dd"; }
|
|
|
|
.mdl-icon--comment:before {
|
|
content: "\f0de"; }
|
|
|
|
.mdl-icon--contacts:before {
|
|
content: "\f0df"; }
|
|
|
|
.mdl-icon--dialer-sip:before {
|
|
content: "\f0e0"; }
|
|
|
|
.mdl-icon--dialpad:before {
|
|
content: "\f0e1"; }
|
|
|
|
.mdl-icon--dnd-on:before {
|
|
content: "\f0e2"; }
|
|
|
|
.mdl-icon--email:before {
|
|
content: "\f0e3"; }
|
|
|
|
.mdl-icon--forum:before {
|
|
content: "\f0e4"; }
|
|
|
|
.mdl-icon--import-export:before {
|
|
content: "\f0e5"; }
|
|
|
|
.mdl-icon--invert-colors-off:before {
|
|
content: "\f0e6"; }
|
|
|
|
.mdl-icon--invert-colors-on:before {
|
|
content: "\f0e7"; }
|
|
|
|
.mdl-icon--live-help:before {
|
|
content: "\f0e8"; }
|
|
|
|
.mdl-icon--location-off:before {
|
|
content: "\f0e9"; }
|
|
|
|
.mdl-icon--location-on:before {
|
|
content: "\f0ea"; }
|
|
|
|
.mdl-icon--message:before {
|
|
content: "\f0eb"; }
|
|
|
|
.mdl-icon--messenger:before {
|
|
content: "\f0ec"; }
|
|
|
|
.mdl-icon--no-sim:before {
|
|
content: "\f0ed"; }
|
|
|
|
.mdl-icon--phone:before {
|
|
content: "\f0ee"; }
|
|
|
|
.mdl-icon--portable-wifi-off:before {
|
|
content: "\f0ef"; }
|
|
|
|
.mdl-icon--quick-contacts-dialer:before {
|
|
content: "\f0f0"; }
|
|
|
|
.mdl-icon--quick-contacts-mail:before {
|
|
content: "\f0f1"; }
|
|
|
|
.mdl-icon--ring-volume:before {
|
|
content: "\f0f2"; }
|
|
|
|
.mdl-icon--stay-current-landscape:before {
|
|
content: "\f0f3"; }
|
|
|
|
.mdl-icon--stay-current-portrait:before {
|
|
content: "\f0f4"; }
|
|
|
|
.mdl-icon--stay-primary-landscape:before {
|
|
content: "\f0f5"; }
|
|
|
|
.mdl-icon--stay-primary-portrait:before {
|
|
content: "\f0f6"; }
|
|
|
|
.mdl-icon--swap-calls:before {
|
|
content: "\f0f7"; }
|
|
|
|
.mdl-icon--textsms:before {
|
|
content: "\f0f8"; }
|
|
|
|
.mdl-icon--voicemail:before {
|
|
content: "\f0f9"; }
|
|
|
|
.mdl-icon--vpn-key:before {
|
|
content: "\f0fa"; }
|
|
|
|
.mdl-icon--add:before {
|
|
content: "\f0fb"; }
|
|
|
|
.mdl-icon--add-box:before {
|
|
content: "\f0fc"; }
|
|
|
|
.mdl-icon--add-circle:before {
|
|
content: "\f0fd"; }
|
|
|
|
.mdl-icon--add-circle-outline:before {
|
|
content: "\f0fe"; }
|
|
|
|
.mdl-icon--archive:before {
|
|
content: "\f0ff"; }
|
|
|
|
.mdl-icon--backspace:before {
|
|
content: "\f100"; }
|
|
|
|
.mdl-icon--block:before {
|
|
content: "\f101"; }
|
|
|
|
.mdl-icon--clear:before {
|
|
content: "\f102"; }
|
|
|
|
.mdl-icon--content-copy:before {
|
|
content: "\f103"; }
|
|
|
|
.mdl-icon--content-cut:before {
|
|
content: "\f104"; }
|
|
|
|
.mdl-icon--content-paste:before {
|
|
content: "\f105"; }
|
|
|
|
.mdl-icon--create:before {
|
|
content: "\f106"; }
|
|
|
|
.mdl-icon--drafts:before {
|
|
content: "\f107"; }
|
|
|
|
.mdl-icon--filter-list:before {
|
|
content: "\f108"; }
|
|
|
|
.mdl-icon--flag:before {
|
|
content: "\f109"; }
|
|
|
|
.mdl-icon--forward:before {
|
|
content: "\f10a"; }
|
|
|
|
.mdl-icon--gesture:before {
|
|
content: "\f10b"; }
|
|
|
|
.mdl-icon--inbox:before {
|
|
content: "\f10c"; }
|
|
|
|
.mdl-icon--link:before {
|
|
content: "\f10d"; }
|
|
|
|
.mdl-icon--mail:before {
|
|
content: "\f10e"; }
|
|
|
|
.mdl-icon--markunread:before {
|
|
content: "\f10f"; }
|
|
|
|
.mdl-icon--redo:before {
|
|
content: "\f110"; }
|
|
|
|
.mdl-icon--remove:before {
|
|
content: "\f111"; }
|
|
|
|
.mdl-icon--remove-circle:before {
|
|
content: "\f112"; }
|
|
|
|
.mdl-icon--remove-circle-outline:before {
|
|
content: "\f113"; }
|
|
|
|
.mdl-icon--reply:before {
|
|
content: "\f114"; }
|
|
|
|
.mdl-icon--reply-all:before {
|
|
content: "\f115"; }
|
|
|
|
.mdl-icon--report:before {
|
|
content: "\f116"; }
|
|
|
|
.mdl-icon--save:before {
|
|
content: "\f117"; }
|
|
|
|
.mdl-icon--select-all:before {
|
|
content: "\f118"; }
|
|
|
|
.mdl-icon--send:before {
|
|
content: "\f119"; }
|
|
|
|
.mdl-icon--sort:before {
|
|
content: "\f11a"; }
|
|
|
|
.mdl-icon--text-format:before {
|
|
content: "\f11b"; }
|
|
|
|
.mdl-icon--undo:before {
|
|
content: "\f11c"; }
|
|
|
|
.mdl-icon--access-alarm:before {
|
|
content: "\f11d"; }
|
|
|
|
.mdl-icon--access-alarms:before {
|
|
content: "\f11e"; }
|
|
|
|
.mdl-icon--access-time:before {
|
|
content: "\f11f"; }
|
|
|
|
.mdl-icon--add-alarm:before {
|
|
content: "\f120"; }
|
|
|
|
.mdl-icon--airplanemode-off:before {
|
|
content: "\f121"; }
|
|
|
|
.mdl-icon--airplanemode-on:before {
|
|
content: "\f122"; }
|
|
|
|
.mdl-icon--battery-20:before {
|
|
content: "\f123"; }
|
|
|
|
.mdl-icon--battery-30:before {
|
|
content: "\f124"; }
|
|
|
|
.mdl-icon--battery-50:before {
|
|
content: "\f125"; }
|
|
|
|
.mdl-icon--battery-60:before {
|
|
content: "\f126"; }
|
|
|
|
.mdl-icon--battery-80:before {
|
|
content: "\f127"; }
|
|
|
|
.mdl-icon--battery-90:before {
|
|
content: "\f128"; }
|
|
|
|
.mdl-icon--battery-alert:before {
|
|
content: "\f129"; }
|
|
|
|
.mdl-icon--battery-charging-20:before {
|
|
content: "\f12a"; }
|
|
|
|
.mdl-icon--battery-charging-30:before {
|
|
content: "\f12b"; }
|
|
|
|
.mdl-icon--battery-charging-50:before {
|
|
content: "\f12c"; }
|
|
|
|
.mdl-icon--battery-charging-60:before {
|
|
content: "\f12d"; }
|
|
|
|
.mdl-icon--battery-charging-80:before {
|
|
content: "\f12e"; }
|
|
|
|
.mdl-icon--battery-charging-90:before {
|
|
content: "\f12f"; }
|
|
|
|
.mdl-icon--battery-charging-full:before {
|
|
content: "\f130"; }
|
|
|
|
.mdl-icon--battery-full:before {
|
|
content: "\f131"; }
|
|
|
|
.mdl-icon--battery-std:before {
|
|
content: "\f132"; }
|
|
|
|
.mdl-icon--battery-unknown:before {
|
|
content: "\f133"; }
|
|
|
|
.mdl-icon--bluetooth:before {
|
|
content: "\f134"; }
|
|
|
|
.mdl-icon--bluetooth-connected:before {
|
|
content: "\f135"; }
|
|
|
|
.mdl-icon--bluetooth-disabled:before {
|
|
content: "\f136"; }
|
|
|
|
.mdl-icon--bluetooth-searching:before {
|
|
content: "\f137"; }
|
|
|
|
.mdl-icon--brightness-auto:before {
|
|
content: "\f138"; }
|
|
|
|
.mdl-icon--brightness-high:before {
|
|
content: "\f139"; }
|
|
|
|
.mdl-icon--brightness-low:before {
|
|
content: "\f13a"; }
|
|
|
|
.mdl-icon--brightness-medium:before {
|
|
content: "\f13b"; }
|
|
|
|
.mdl-icon--data-usage:before {
|
|
content: "\f13c"; }
|
|
|
|
.mdl-icon--developer-mode:before {
|
|
content: "\f13d"; }
|
|
|
|
.mdl-icon--devices:before {
|
|
content: "\f13e"; }
|
|
|
|
.mdl-icon--dvr:before {
|
|
content: "\f13f"; }
|
|
|
|
.mdl-icon--gps-fixed:before {
|
|
content: "\f140"; }
|
|
|
|
.mdl-icon--gps-not-fixed:before {
|
|
content: "\f141"; }
|
|
|
|
.mdl-icon--gps-off:before {
|
|
content: "\f142"; }
|
|
|
|
.mdl-icon--location-disabled:before {
|
|
content: "\f143"; }
|
|
|
|
.mdl-icon--location-searching:before {
|
|
content: "\f144"; }
|
|
|
|
.mdl-icon--multitrack-audio:before {
|
|
content: "\f145"; }
|
|
|
|
.mdl-icon--network-cell:before {
|
|
content: "\f146"; }
|
|
|
|
.mdl-icon--network-wifi:before {
|
|
content: "\f147"; }
|
|
|
|
.mdl-icon--nfc:before {
|
|
content: "\f148"; }
|
|
|
|
.mdl-icon--now-wallpaper:before {
|
|
content: "\f149"; }
|
|
|
|
.mdl-icon--now-widgets:before {
|
|
content: "\f14a"; }
|
|
|
|
.mdl-icon--screen-lock-landscape:before {
|
|
content: "\f14b"; }
|
|
|
|
.mdl-icon--screen-lock-portrait:before {
|
|
content: "\f14c"; }
|
|
|
|
.mdl-icon--screen-lock-rotation:before {
|
|
content: "\f14d"; }
|
|
|
|
.mdl-icon--screen-rotation:before {
|
|
content: "\f14e"; }
|
|
|
|
.mdl-icon--sd-storage:before {
|
|
content: "\f14f"; }
|
|
|
|
.mdl-icon--settings-system-daydream:before {
|
|
content: "\f150"; }
|
|
|
|
.mdl-icon--signal-cellular-0-bar:before {
|
|
content: "\f151"; }
|
|
|
|
.mdl-icon--signal-cellular-1-bar:before {
|
|
content: "\f152"; }
|
|
|
|
.mdl-icon--signal-cellular-2-bar:before {
|
|
content: "\f153"; }
|
|
|
|
.mdl-icon--signal-cellular-3-bar:before {
|
|
content: "\f154"; }
|
|
|
|
.mdl-icon--signal-cellular-4-bar:before {
|
|
content: "\f155"; }
|
|
|
|
.mdl-icon--signal-cellular-connected-no-internet-0-bar:before {
|
|
content: "\f156"; }
|
|
|
|
.mdl-icon--signal-cellular-connected-no-internet-1-bar:before {
|
|
content: "\f157"; }
|
|
|
|
.mdl-icon--signal-cellular-connected-no-internet-2-bar:before {
|
|
content: "\f158"; }
|
|
|
|
.mdl-icon--signal-cellular-connected-no-internet-3-bar:before {
|
|
content: "\f159"; }
|
|
|
|
.mdl-icon--signal-cellular-connected-no-internet-4-bar:before {
|
|
content: "\f15a"; }
|
|
|
|
.mdl-icon--signal-cellular-no-sim:before {
|
|
content: "\f15b"; }
|
|
|
|
.mdl-icon--signal-cellular-null:before {
|
|
content: "\f15c"; }
|
|
|
|
.mdl-icon--signal-cellular-off:before {
|
|
content: "\f15d"; }
|
|
|
|
.mdl-icon--signal-wifi-0-bar:before {
|
|
content: "\f15e"; }
|
|
|
|
.mdl-icon--signal-wifi-1-bar:before {
|
|
content: "\f15f"; }
|
|
|
|
.mdl-icon--signal-wifi-2-bar:before {
|
|
content: "\f160"; }
|
|
|
|
.mdl-icon--signal-wifi-3-bar:before {
|
|
content: "\f161"; }
|
|
|
|
.mdl-icon--signal-wifi-4-bar:before {
|
|
content: "\f162"; }
|
|
|
|
.mdl-icon--signal-wifi-off:before {
|
|
content: "\f163"; }
|
|
|
|
.mdl-icon--signal-wifi-statusbar-1-bar:before {
|
|
content: "\f15f"; }
|
|
|
|
.mdl-icon--signal-wifi-statusbar-2-bar:before {
|
|
content: "\f160"; }
|
|
|
|
.mdl-icon--signal-wifi-statusbar-3-bar:before {
|
|
content: "\f161"; }
|
|
|
|
.mdl-icon--signal-wifi-statusbar-4-bar:before {
|
|
content: "\f162"; }
|
|
|
|
.mdl-icon--signal-wifi-statusbar-connected-no-internet:before {
|
|
content: ""; }
|
|
|
|
.mdl-icon--signal-wifi-statusbar-connected-no-internet-1:before {
|
|
content: ""; }
|
|
|
|
.mdl-icon--signal-wifi-statusbar-connected-no-internet-2:before {
|
|
content: ""; }
|
|
|
|
.mdl-icon--signal-wifi-statusbar-connected-no-internet-3:before {
|
|
content: ""; }
|
|
|
|
.mdl-icon--signal-wifi-statusbar-connected-no-internet-4:before {
|
|
content: ""; }
|
|
|
|
.mdl-icon--signal-wifi-statusbar-not-connected:before {
|
|
content: ""; }
|
|
|
|
.mdl-icon--signal-wifi-statusbar-null:before {
|
|
content: ""; }
|
|
|
|
.mdl-icon--storage:before {
|
|
content: "\f164"; }
|
|
|
|
.mdl-icon--usb:before {
|
|
content: "\f165"; }
|
|
|
|
.mdl-icon--wifi-lock:before {
|
|
content: "\f166"; }
|
|
|
|
.mdl-icon--wifi-tethering:before {
|
|
content: "\f167"; }
|
|
|
|
.mdl-icon--attach-file:before {
|
|
content: "\f168"; }
|
|
|
|
.mdl-icon--attach-money:before {
|
|
content: "\f169"; }
|
|
|
|
.mdl-icon--border-all:before {
|
|
content: "\f16a"; }
|
|
|
|
.mdl-icon--border-bottom:before {
|
|
content: "\f16b"; }
|
|
|
|
.mdl-icon--border-clear:before {
|
|
content: "\f16c"; }
|
|
|
|
.mdl-icon--border-color:before {
|
|
content: "\f16d"; }
|
|
|
|
.mdl-icon--border-horizontal:before {
|
|
content: "\f16e"; }
|
|
|
|
.mdl-icon--border-inner:before {
|
|
content: "\f16f"; }
|
|
|
|
.mdl-icon--border-left:before {
|
|
content: "\f170"; }
|
|
|
|
.mdl-icon--border-outer:before {
|
|
content: "\f171"; }
|
|
|
|
.mdl-icon--border-right:before {
|
|
content: "\f172"; }
|
|
|
|
.mdl-icon--border-style:before {
|
|
content: "\f173"; }
|
|
|
|
.mdl-icon--border-top:before {
|
|
content: "\f174"; }
|
|
|
|
.mdl-icon--border-vertical:before {
|
|
content: "\f175"; }
|
|
|
|
.mdl-icon--format-align-center:before {
|
|
content: "\f176"; }
|
|
|
|
.mdl-icon--format-align-justify:before {
|
|
content: "\f177"; }
|
|
|
|
.mdl-icon--format-align-left:before {
|
|
content: "\f178"; }
|
|
|
|
.mdl-icon--format-align-right:before {
|
|
content: "\f179"; }
|
|
|
|
.mdl-icon--format-bold:before {
|
|
content: "\f17a"; }
|
|
|
|
.mdl-icon--format-clear:before {
|
|
content: "\f17b"; }
|
|
|
|
.mdl-icon--format-color-fill:before {
|
|
content: "\f17c"; }
|
|
|
|
.mdl-icon--format-color-reset:before {
|
|
content: "\f17d"; }
|
|
|
|
.mdl-icon--format-color-text:before {
|
|
content: "\f17e"; }
|
|
|
|
.mdl-icon--format-indent-decrease:before {
|
|
content: "\f17f"; }
|
|
|
|
.mdl-icon--format-indent-increase:before {
|
|
content: "\f180"; }
|
|
|
|
.mdl-icon--format-italic:before {
|
|
content: "\f181"; }
|
|
|
|
.mdl-icon--format-line-spacing:before {
|
|
content: "\f182"; }
|
|
|
|
.mdl-icon--format-list-bulleted:before {
|
|
content: "\f183"; }
|
|
|
|
.mdl-icon--format-list-numbered:before {
|
|
content: "\f184"; }
|
|
|
|
.mdl-icon--format-paint:before {
|
|
content: "\f185"; }
|
|
|
|
.mdl-icon--format-quote:before {
|
|
content: "\f186"; }
|
|
|
|
.mdl-icon--format-size:before {
|
|
content: "\f187"; }
|
|
|
|
.mdl-icon--format-strikethrough:before {
|
|
content: "\f188"; }
|
|
|
|
.mdl-icon--format-textdirection-l-to-r:before {
|
|
content: "\f189"; }
|
|
|
|
.mdl-icon--format-textdirection-r-to-l:before {
|
|
content: "\f18a"; }
|
|
|
|
.mdl-icon--format-underline:before {
|
|
content: "\f18b"; }
|
|
|
|
.mdl-icon--functions:before {
|
|
content: "\f18c"; }
|
|
|
|
.mdl-icon--insert-chart:before {
|
|
content: "\f18d"; }
|
|
|
|
.mdl-icon--insert-comment:before {
|
|
content: "\f18e"; }
|
|
|
|
.mdl-icon--insert-drive-file:before {
|
|
content: "\f18f"; }
|
|
|
|
.mdl-icon--insert-emoticon:before {
|
|
content: "\f190"; }
|
|
|
|
.mdl-icon--insert-invitation:before {
|
|
content: "\f191"; }
|
|
|
|
.mdl-icon--insert-link:before {
|
|
content: "\f192"; }
|
|
|
|
.mdl-icon--insert-photo:before {
|
|
content: "\f193"; }
|
|
|
|
.mdl-icon--merge-type:before {
|
|
content: "\f194"; }
|
|
|
|
.mdl-icon--mode-comment:before {
|
|
content: "\f195"; }
|
|
|
|
.mdl-icon--mode-edit:before {
|
|
content: "\f196"; }
|
|
|
|
.mdl-icon--publish:before {
|
|
content: "\f197"; }
|
|
|
|
.mdl-icon--vertical-align-bottom:before {
|
|
content: "\f198"; }
|
|
|
|
.mdl-icon--vertical-align-center:before {
|
|
content: "\f199"; }
|
|
|
|
.mdl-icon--vertical-align-top:before {
|
|
content: "\f19a"; }
|
|
|
|
.mdl-icon--wrap-text:before {
|
|
content: "\f19b"; }
|
|
|
|
.mdl-icon--attachment:before {
|
|
content: "\f19c"; }
|
|
|
|
.mdl-icon--cloud:before {
|
|
content: "\f19d"; }
|
|
|
|
.mdl-icon--cloud-circle:before {
|
|
content: "\f19e"; }
|
|
|
|
.mdl-icon--cloud-done:before {
|
|
content: "\f19f"; }
|
|
|
|
.mdl-icon--cloud-download:before {
|
|
content: "\f1a0"; }
|
|
|
|
.mdl-icon--cloud-off:before {
|
|
content: "\f1a1"; }
|
|
|
|
.mdl-icon--cloud-queue:before {
|
|
content: "\f1a2"; }
|
|
|
|
.mdl-icon--cloud-upload:before {
|
|
content: "\f1a3"; }
|
|
|
|
.mdl-icon--file-download:before {
|
|
content: "\f1a4"; }
|
|
|
|
.mdl-icon--file-upload:before {
|
|
content: "\f1a5"; }
|
|
|
|
.mdl-icon--folder:before {
|
|
content: "\f1a6"; }
|
|
|
|
.mdl-icon--folder-open:before {
|
|
content: "\f1a7"; }
|
|
|
|
.mdl-icon--folder-shared:before {
|
|
content: "\f1a8"; }
|
|
|
|
.mdl-icon--cast:before {
|
|
content: "\f1a9"; }
|
|
|
|
.mdl-icon--cast-connected:before {
|
|
content: "\f1aa"; }
|
|
|
|
.mdl-icon--computer:before {
|
|
content: "\f1ab"; }
|
|
|
|
.mdl-icon--desktop-mac:before {
|
|
content: "\f1ac"; }
|
|
|
|
.mdl-icon--desktop-windows:before {
|
|
content: "\f1ad"; }
|
|
|
|
.mdl-icon--dock:before {
|
|
content: "\f1ae"; }
|
|
|
|
.mdl-icon--gamepad:before {
|
|
content: "\f1af"; }
|
|
|
|
.mdl-icon--headset:before {
|
|
content: "\f1b0"; }
|
|
|
|
.mdl-icon--headset-mic:before {
|
|
content: "\f1b1"; }
|
|
|
|
.mdl-icon--keyboard:before {
|
|
content: "\f1b2"; }
|
|
|
|
.mdl-icon--keyboard-alt:before {
|
|
content: "\f1b3"; }
|
|
|
|
.mdl-icon--keyboard-arrow-down:before {
|
|
content: "\f1b4"; }
|
|
|
|
.mdl-icon--keyboard-arrow-left:before {
|
|
content: "\f1b5"; }
|
|
|
|
.mdl-icon--keyboard-arrow-right:before {
|
|
content: "\f1b6"; }
|
|
|
|
.mdl-icon--keyboard-arrow-up:before {
|
|
content: "\f1b7"; }
|
|
|
|
.mdl-icon--keyboard-backspace:before {
|
|
content: "\f1b8"; }
|
|
|
|
.mdl-icon--keyboard-capslock:before {
|
|
content: "\f1b9"; }
|
|
|
|
.mdl-icon--keyboard-control:before {
|
|
content: "\f1ba"; }
|
|
|
|
.mdl-icon--keyboard-hide:before {
|
|
content: "\f1bb"; }
|
|
|
|
.mdl-icon--keyboard-return:before {
|
|
content: "\f1bc"; }
|
|
|
|
.mdl-icon--keyboard-tab:before {
|
|
content: "\f1bd"; }
|
|
|
|
.mdl-icon--keyboard-voice:before {
|
|
content: "\f1be"; }
|
|
|
|
.mdl-icon--laptop:before {
|
|
content: "\f1bf"; }
|
|
|
|
.mdl-icon--laptop-chromebook:before {
|
|
content: "\f1c0"; }
|
|
|
|
.mdl-icon--laptop-mac:before {
|
|
content: "\f1c1"; }
|
|
|
|
.mdl-icon--laptop-windows:before {
|
|
content: "\f1c2"; }
|
|
|
|
.mdl-icon--memory:before {
|
|
content: "\f1c3"; }
|
|
|
|
.mdl-icon--mouse:before {
|
|
content: "\f1c4"; }
|
|
|
|
.mdl-icon--phone-android:before {
|
|
content: "\f1c5"; }
|
|
|
|
.mdl-icon--phone-iphone:before {
|
|
content: "\f1c6"; }
|
|
|
|
.mdl-icon--phonelink:before {
|
|
content: "\f1c7"; }
|
|
|
|
.mdl-icon--phonelink-off:before {
|
|
content: "\f1c8"; }
|
|
|
|
.mdl-icon--security:before {
|
|
content: "\f1c9"; }
|
|
|
|
.mdl-icon--sim-card:before {
|
|
content: "\f1ca"; }
|
|
|
|
.mdl-icon--smartphone:before {
|
|
content: "\f1cb"; }
|
|
|
|
.mdl-icon--speaker:before {
|
|
content: "\f1cc"; }
|
|
|
|
.mdl-icon--tablet:before {
|
|
content: "\f1cd"; }
|
|
|
|
.mdl-icon--tablet-android:before {
|
|
content: "\f1ce"; }
|
|
|
|
.mdl-icon--tablet-mac:before {
|
|
content: "\f1cf"; }
|
|
|
|
.mdl-icon--tv:before {
|
|
content: "\f1d0"; }
|
|
|
|
.mdl-icon--watch:before {
|
|
content: "\f1d1"; }
|
|
|
|
.mdl-icon--add-to-photos:before {
|
|
content: "\f1d2"; }
|
|
|
|
.mdl-icon--adjust:before {
|
|
content: "\f1d3"; }
|
|
|
|
.mdl-icon--assistant-photo:before {
|
|
content: "\f1d4"; }
|
|
|
|
.mdl-icon--audiotrack:before {
|
|
content: "\f1d5"; }
|
|
|
|
.mdl-icon--blur-circular:before {
|
|
content: "\f1d6"; }
|
|
|
|
.mdl-icon--blur-linear:before {
|
|
content: "\f1d7"; }
|
|
|
|
.mdl-icon--blur-off:before {
|
|
content: "\f1d8"; }
|
|
|
|
.mdl-icon--blur-on:before {
|
|
content: "\f1d9"; }
|
|
|
|
.mdl-icon--brightness-1:before {
|
|
content: "\f1da"; }
|
|
|
|
.mdl-icon--brightness-2:before {
|
|
content: "\f1db"; }
|
|
|
|
.mdl-icon--brightness-3:before {
|
|
content: "\f1dc"; }
|
|
|
|
.mdl-icon--brightness-4:before {
|
|
content: "\f1dd"; }
|
|
|
|
.mdl-icon--brightness-5:before {
|
|
content: "\f1de"; }
|
|
|
|
.mdl-icon--brightness-6:before {
|
|
content: "\f1df"; }
|
|
|
|
.mdl-icon--brightness-7:before {
|
|
content: "\f1e0"; }
|
|
|
|
.mdl-icon--brush:before {
|
|
content: "\f1e1"; }
|
|
|
|
.mdl-icon--camera:before {
|
|
content: "\f1e2"; }
|
|
|
|
.mdl-icon--camera-alt:before {
|
|
content: "\f1e3"; }
|
|
|
|
.mdl-icon--camera-front:before {
|
|
content: "\f1e4"; }
|
|
|
|
.mdl-icon--camera-rear:before {
|
|
content: "\f1e5"; }
|
|
|
|
.mdl-icon--camera-roll:before {
|
|
content: "\f1e6"; }
|
|
|
|
.mdl-icon--center-focus-strong:before {
|
|
content: "\f1e7"; }
|
|
|
|
.mdl-icon--center-focus-weak:before {
|
|
content: "\f1e8"; }
|
|
|
|
.mdl-icon--collections:before {
|
|
content: "\f1e9"; }
|
|
|
|
.mdl-icon--colorize:before {
|
|
content: "\f1ea"; }
|
|
|
|
.mdl-icon--color-lens:before {
|
|
content: "\f1eb"; }
|
|
|
|
.mdl-icon--compare:before {
|
|
content: "\f1ec"; }
|
|
|
|
.mdl-icon--control-point:before {
|
|
content: "\f1ed"; }
|
|
|
|
.mdl-icon--control-point-duplicate:before {
|
|
content: "\f1ee"; }
|
|
|
|
.mdl-icon--crop:before {
|
|
content: "\f1ef"; }
|
|
|
|
.mdl-icon--crop-3-2:before {
|
|
content: "\f1f0"; }
|
|
|
|
.mdl-icon--crop-5-4:before {
|
|
content: "\f1f1"; }
|
|
|
|
.mdl-icon--crop-7-5:before {
|
|
content: "\f1f2"; }
|
|
|
|
.mdl-icon--crop-16-9:before {
|
|
content: "\f1f3"; }
|
|
|
|
.mdl-icon--crop-din:before {
|
|
content: "\f1f4"; }
|
|
|
|
.mdl-icon--crop-free:before {
|
|
content: "\f1f5"; }
|
|
|
|
.mdl-icon--crop-landscape:before {
|
|
content: "\f1f6"; }
|
|
|
|
.mdl-icon--crop-original:before {
|
|
content: "\f1f7"; }
|
|
|
|
.mdl-icon--crop-portrait:before {
|
|
content: "\f1f8"; }
|
|
|
|
.mdl-icon--crop-square:before {
|
|
content: "\f1f9"; }
|
|
|
|
.mdl-icon--dehaze:before {
|
|
content: "\f1fa"; }
|
|
|
|
.mdl-icon--details:before {
|
|
content: "\f1fb"; }
|
|
|
|
.mdl-icon--edit:before {
|
|
content: "\f1fc"; }
|
|
|
|
.mdl-icon--exposure:before {
|
|
content: "\f1fd"; }
|
|
|
|
.mdl-icon--exposure-minus-1:before {
|
|
content: "\f1fe"; }
|
|
|
|
.mdl-icon--exposure-minus-2:before {
|
|
content: "\f1ff"; }
|
|
|
|
.mdl-icon--exposure-zero:before {
|
|
content: "\f200"; }
|
|
|
|
.mdl-icon--exposure-plus-1:before {
|
|
content: "\f201"; }
|
|
|
|
.mdl-icon--exposure-plus-2:before {
|
|
content: "\f202"; }
|
|
|
|
.mdl-icon--filter:before {
|
|
content: "\f203"; }
|
|
|
|
.mdl-icon--filter-1:before {
|
|
content: "\f204"; }
|
|
|
|
.mdl-icon--filter-2:before {
|
|
content: "\f205"; }
|
|
|
|
.mdl-icon--filter-3:before {
|
|
content: "\f206"; }
|
|
|
|
.mdl-icon--filter-4:before {
|
|
content: "\f207"; }
|
|
|
|
.mdl-icon--filter-5:before {
|
|
content: "\f208"; }
|
|
|
|
.mdl-icon--filter-6:before {
|
|
content: "\f209"; }
|
|
|
|
.mdl-icon--filter-7:before {
|
|
content: "\f20a"; }
|
|
|
|
.mdl-icon--filter-8:before {
|
|
content: "\f20b"; }
|
|
|
|
.mdl-icon--filter-9:before {
|
|
content: "\f20c"; }
|
|
|
|
.mdl-icon--filter-9-plus:before {
|
|
content: "\f20d"; }
|
|
|
|
.mdl-icon--filter-b-and-w:before {
|
|
content: "\f20e"; }
|
|
|
|
.mdl-icon--filter-center-focus:before {
|
|
content: "\f20f"; }
|
|
|
|
.mdl-icon--filter-drama:before {
|
|
content: "\f210"; }
|
|
|
|
.mdl-icon--filter-frames:before {
|
|
content: "\f211"; }
|
|
|
|
.mdl-icon--filter-hdr:before {
|
|
content: "\f212"; }
|
|
|
|
.mdl-icon--filter-none:before {
|
|
content: "\f213"; }
|
|
|
|
.mdl-icon--filter-tilt-shift:before {
|
|
content: "\f214"; }
|
|
|
|
.mdl-icon--filter-vintage:before {
|
|
content: "\f215"; }
|
|
|
|
.mdl-icon--flare:before {
|
|
content: "\f216"; }
|
|
|
|
.mdl-icon--flash-auto:before {
|
|
content: "\f217"; }
|
|
|
|
.mdl-icon--flash-off:before {
|
|
content: "\f218"; }
|
|
|
|
.mdl-icon--flash-on:before {
|
|
content: "\f219"; }
|
|
|
|
.mdl-icon--flip:before {
|
|
content: "\f21a"; }
|
|
|
|
.mdl-icon--gradient:before {
|
|
content: "\f21b"; }
|
|
|
|
.mdl-icon--grain:before {
|
|
content: "\f21c"; }
|
|
|
|
.mdl-icon--grid-off:before {
|
|
content: "\f21d"; }
|
|
|
|
.mdl-icon--grid-on:before {
|
|
content: "\f21e"; }
|
|
|
|
.mdl-icon--hdr-off:before {
|
|
content: "\f21f"; }
|
|
|
|
.mdl-icon--hdr-on:before {
|
|
content: "\f220"; }
|
|
|
|
.mdl-icon--hdr-strong:before {
|
|
content: "\f221"; }
|
|
|
|
.mdl-icon--hdr-weak:before {
|
|
content: "\f222"; }
|
|
|
|
.mdl-icon--healing:before {
|
|
content: "\f223"; }
|
|
|
|
.mdl-icon--image:before {
|
|
content: "\f224"; }
|
|
|
|
.mdl-icon--image-aspect-ratio:before {
|
|
content: "\f225"; }
|
|
|
|
.mdl-icon--iso:before {
|
|
content: "\f226"; }
|
|
|
|
.mdl-icon--landscape:before {
|
|
content: "\f227"; }
|
|
|
|
.mdl-icon--leak-add:before {
|
|
content: "\f228"; }
|
|
|
|
.mdl-icon--leak-remove:before {
|
|
content: "\f229"; }
|
|
|
|
.mdl-icon--lens:before {
|
|
content: "\f22a"; }
|
|
|
|
.mdl-icon--looks:before {
|
|
content: "\f22b"; }
|
|
|
|
.mdl-icon--looks-1:before {
|
|
content: "\f22c"; }
|
|
|
|
.mdl-icon--looks-2:before {
|
|
content: "\f22d"; }
|
|
|
|
.mdl-icon--looks-3:before {
|
|
content: "\f22e"; }
|
|
|
|
.mdl-icon--looks-4:before {
|
|
content: "\f22f"; }
|
|
|
|
.mdl-icon--looks-5:before {
|
|
content: "\f230"; }
|
|
|
|
.mdl-icon--looks-6:before {
|
|
content: "\f231"; }
|
|
|
|
.mdl-icon--looks-one:before {
|
|
content: "\f22c"; }
|
|
|
|
.mdl-icon--looks-two:before {
|
|
content: "\f22d"; }
|
|
|
|
.mdl-icon--loupe:before {
|
|
content: "\f232"; }
|
|
|
|
.mdl-icon--movie-creation:before {
|
|
content: "\f233"; }
|
|
|
|
.mdl-icon--nature:before {
|
|
content: "\f234"; }
|
|
|
|
.mdl-icon--nature-people:before {
|
|
content: "\f235"; }
|
|
|
|
.mdl-icon--navigate-before:before {
|
|
content: "\f236"; }
|
|
|
|
.mdl-icon--navigate-next:before {
|
|
content: "\f237"; }
|
|
|
|
.mdl-icon--palette:before {
|
|
content: "\f238"; }
|
|
|
|
.mdl-icon--panorama:before {
|
|
content: "\f239"; }
|
|
|
|
.mdl-icon--panorama-fisheye:before {
|
|
content: "\f23a"; }
|
|
|
|
.mdl-icon--panorama-horizontal:before {
|
|
content: "\f23b"; }
|
|
|
|
.mdl-icon--panorama-vertical:before {
|
|
content: "\f23c"; }
|
|
|
|
.mdl-icon--panorama-wide-angle:before {
|
|
content: "\f23d"; }
|
|
|
|
.mdl-icon--photo:before {
|
|
content: "\f23e"; }
|
|
|
|
.mdl-icon--photo-album:before {
|
|
content: "\f23f"; }
|
|
|
|
.mdl-icon--photo-camera:before {
|
|
content: "\f240"; }
|
|
|
|
.mdl-icon--photo-library:before {
|
|
content: "\f241"; }
|
|
|
|
.mdl-icon--portrait:before {
|
|
content: "\f242"; }
|
|
|
|
.mdl-icon--remove-red-eye:before {
|
|
content: "\f243"; }
|
|
|
|
.mdl-icon--rotate-left:before {
|
|
content: "\f244"; }
|
|
|
|
.mdl-icon--rotate-right:before {
|
|
content: "\f245"; }
|
|
|
|
.mdl-icon--slideshow:before {
|
|
content: "\f246"; }
|
|
|
|
.mdl-icon--straighten:before {
|
|
content: "\f247"; }
|
|
|
|
.mdl-icon--style:before {
|
|
content: "\f248"; }
|
|
|
|
.mdl-icon--switch-camera:before {
|
|
content: "\f249"; }
|
|
|
|
.mdl-icon--switch-video:before {
|
|
content: "\f24a"; }
|
|
|
|
.mdl-icon--tag-faces:before {
|
|
content: "\f24b"; }
|
|
|
|
.mdl-icon--texture:before {
|
|
content: "\f24c"; }
|
|
|
|
.mdl-icon--timelapse:before {
|
|
content: "\f24d"; }
|
|
|
|
.mdl-icon--timer:before {
|
|
content: "\f24e"; }
|
|
|
|
.mdl-icon--timer-3:before {
|
|
content: "\f24f"; }
|
|
|
|
.mdl-icon--timer-10:before {
|
|
content: "\f250"; }
|
|
|
|
.mdl-icon--timer-auto:before {
|
|
content: "\f251"; }
|
|
|
|
.mdl-icon--timer-off:before {
|
|
content: "\f252"; }
|
|
|
|
.mdl-icon--tonality:before {
|
|
content: "\f253"; }
|
|
|
|
.mdl-icon--transform:before {
|
|
content: "\f254"; }
|
|
|
|
.mdl-icon--tune:before {
|
|
content: "\f255"; }
|
|
|
|
.mdl-icon--wb-auto:before {
|
|
content: "\f256"; }
|
|
|
|
.mdl-icon--wb-cloudy:before {
|
|
content: "\f257"; }
|
|
|
|
.mdl-icon--wb-incandescent:before {
|
|
content: "\f258"; }
|
|
|
|
.mdl-icon--wb-irradescent:before {
|
|
content: "\f259"; }
|
|
|
|
.mdl-icon--wb-sunny:before {
|
|
content: "\f25a"; }
|
|
|
|
.mdl-icon--beenhere:before {
|
|
content: "\f25b"; }
|
|
|
|
.mdl-icon--directions:before {
|
|
content: "\f25c"; }
|
|
|
|
.mdl-icon--directions-bike:before {
|
|
content: "\f25d"; }
|
|
|
|
.mdl-icon--directions-bus:before {
|
|
content: "\f25e"; }
|
|
|
|
.mdl-icon--directions-car:before {
|
|
content: "\f25f"; }
|
|
|
|
.mdl-icon--directions-ferry:before {
|
|
content: "\f260"; }
|
|
|
|
.mdl-icon--directions-subway:before {
|
|
content: "\f261"; }
|
|
|
|
.mdl-icon--directions-train:before {
|
|
content: "\f262"; }
|
|
|
|
.mdl-icon--directions-transit:before {
|
|
content: "\f263"; }
|
|
|
|
.mdl-icon--directions-walk:before {
|
|
content: "\f264"; }
|
|
|
|
.mdl-icon--flight:before {
|
|
content: "\f265"; }
|
|
|
|
.mdl-icon--hotel:before {
|
|
content: "\f266"; }
|
|
|
|
.mdl-icon--layers:before {
|
|
content: "\f267"; }
|
|
|
|
.mdl-icon--layers-clear:before {
|
|
content: "\f268"; }
|
|
|
|
.mdl-icon--local-airport:before {
|
|
content: "\f269"; }
|
|
|
|
.mdl-icon--local-atm:before {
|
|
content: "\f26a"; }
|
|
|
|
.mdl-icon--local-attraction:before {
|
|
content: "\f26b"; }
|
|
|
|
.mdl-icon--local-bar:before {
|
|
content: "\f26c"; }
|
|
|
|
.mdl-icon--local-cafe:before {
|
|
content: "\f26d"; }
|
|
|
|
.mdl-icon--local-car-wash:before {
|
|
content: "\f26e"; }
|
|
|
|
.mdl-icon--local-convenience-store:before {
|
|
content: "\f26f"; }
|
|
|
|
.mdl-icon--local-drink:before {
|
|
content: "\f270"; }
|
|
|
|
.mdl-icon--local-florist:before {
|
|
content: "\f271"; }
|
|
|
|
.mdl-icon--local-gas-station:before {
|
|
content: "\f272"; }
|
|
|
|
.mdl-icon--local-grocery-store:before {
|
|
content: "\f273"; }
|
|
|
|
.mdl-icon--local-hospital:before {
|
|
content: "\f274"; }
|
|
|
|
.mdl-icon--local-hotel:before {
|
|
content: "\f275"; }
|
|
|
|
.mdl-icon--local-laundry-service:before {
|
|
content: "\f276"; }
|
|
|
|
.mdl-icon--local-library:before {
|
|
content: "\f277"; }
|
|
|
|
.mdl-icon--local-mall:before {
|
|
content: "\f278"; }
|
|
|
|
.mdl-icon--local-movies:before {
|
|
content: "\f279"; }
|
|
|
|
.mdl-icon--local-offer:before {
|
|
content: "\f27a"; }
|
|
|
|
.mdl-icon--local-parking:before {
|
|
content: "\f27b"; }
|
|
|
|
.mdl-icon--local-pharmacy:before {
|
|
content: "\f27c"; }
|
|
|
|
.mdl-icon--local-phone:before {
|
|
content: "\f27d"; }
|
|
|
|
.mdl-icon--local-pizza:before {
|
|
content: "\f27e"; }
|
|
|
|
.mdl-icon--local-play:before {
|
|
content: "\f27f"; }
|
|
|
|
.mdl-icon--local-post-office:before {
|
|
content: "\f280"; }
|
|
|
|
.mdl-icon--local-print-shop:before {
|
|
content: "\f281"; }
|
|
|
|
.mdl-icon--local-restaurant:before {
|
|
content: "\f282"; }
|
|
|
|
.mdl-icon--local-see:before {
|
|
content: "\f283"; }
|
|
|
|
.mdl-icon--local-shipping:before {
|
|
content: "\f284"; }
|
|
|
|
.mdl-icon--local-taxi:before {
|
|
content: "\f285"; }
|
|
|
|
.mdl-icon--location-history:before {
|
|
content: "\f286"; }
|
|
|
|
.mdl-icon--map:before {
|
|
content: "\f287"; }
|
|
|
|
.mdl-icon--my-location:before {
|
|
content: "\f288"; }
|
|
|
|
.mdl-icon--navigation:before {
|
|
content: "\f289"; }
|
|
|
|
.mdl-icon--pin-drop:before {
|
|
content: "\f28a"; }
|
|
|
|
.mdl-icon--place:before {
|
|
content: "\f28b"; }
|
|
|
|
.mdl-icon--rate-review:before {
|
|
content: "\f28c"; }
|
|
|
|
.mdl-icon--restaurant-menu:before {
|
|
content: "\f28d"; }
|
|
|
|
.mdl-icon--satellite:before {
|
|
content: "\f28e"; }
|
|
|
|
.mdl-icon--store-mall-directory:before {
|
|
content: "\f28f"; }
|
|
|
|
.mdl-icon--terrain:before {
|
|
content: "\f290"; }
|
|
|
|
.mdl-icon--traffic:before {
|
|
content: "\f291"; }
|
|
|
|
.mdl-icon--apps:before {
|
|
content: "\f292"; }
|
|
|
|
.mdl-icon--cancel:before {
|
|
content: "\f293"; }
|
|
|
|
.mdl-icon--arrow-drop-down-circle:before {
|
|
content: "\f294"; }
|
|
|
|
.mdl-icon--arrow-drop-down:before {
|
|
content: "\f295"; }
|
|
|
|
.mdl-icon--arrow-drop-up:before {
|
|
content: "\f296"; }
|
|
|
|
.mdl-icon--arrow-back:before {
|
|
content: "\f297"; }
|
|
|
|
.mdl-icon--arrow-forward:before {
|
|
content: "\f298"; }
|
|
|
|
.mdl-icon--check:before {
|
|
content: "\f299"; }
|
|
|
|
.mdl-icon--close:before {
|
|
content: "\f29a"; }
|
|
|
|
.mdl-icon--chevron-left:before {
|
|
content: "\f29b"; }
|
|
|
|
.mdl-icon--chevron-right:before {
|
|
content: "\f29c"; }
|
|
|
|
.mdl-icon--expand-less:before {
|
|
content: "\f29d"; }
|
|
|
|
.mdl-icon--expand-more:before {
|
|
content: "\f29e"; }
|
|
|
|
.mdl-icon--fullscreen:before {
|
|
content: "\f29f"; }
|
|
|
|
.mdl-icon--fullscreen-exit:before {
|
|
content: "\f2a0"; }
|
|
|
|
.mdl-icon--menu:before {
|
|
content: "\f2a1"; }
|
|
|
|
.mdl-icon--more-horiz:before {
|
|
content: "\f2a2"; }
|
|
|
|
.mdl-icon--more-vert:before {
|
|
content: "\f2a3"; }
|
|
|
|
.mdl-icon--refresh:before {
|
|
content: "\f2a4"; }
|
|
|
|
.mdl-icon--unfold-less:before {
|
|
content: "\f2a5"; }
|
|
|
|
.mdl-icon--unfold-more:before {
|
|
content: "\f2a6"; }
|
|
|
|
.mdl-icon--adb:before {
|
|
content: "\f2a7"; }
|
|
|
|
.mdl-icon--bluetooth-audio:before {
|
|
content: "\f2a8"; }
|
|
|
|
.mdl-icon--disc-full:before {
|
|
content: "\f2a9"; }
|
|
|
|
.mdl-icon--dnd-forwardslash:before {
|
|
content: "\f2aa"; }
|
|
|
|
.mdl-icon--do-not-disturb:before {
|
|
content: "\f2ab"; }
|
|
|
|
.mdl-icon--drive-eta:before {
|
|
content: "\f2ac"; }
|
|
|
|
.mdl-icon--event-available:before {
|
|
content: "\f2ad"; }
|
|
|
|
.mdl-icon--event-busy:before {
|
|
content: "\f2ae"; }
|
|
|
|
.mdl-icon--event-note:before {
|
|
content: "\f2af"; }
|
|
|
|
.mdl-icon--folder-special:before {
|
|
content: "\f2b0"; }
|
|
|
|
.mdl-icon--mms:before {
|
|
content: "\f2b1"; }
|
|
|
|
.mdl-icon--more:before {
|
|
content: "\f2b2"; }
|
|
|
|
.mdl-icon--network-locked:before {
|
|
content: "\f2b3"; }
|
|
|
|
.mdl-icon--phone-bluetooth-speaker:before {
|
|
content: "\f2b4"; }
|
|
|
|
.mdl-icon--phone-forwarded:before {
|
|
content: "\f2b5"; }
|
|
|
|
.mdl-icon--phone-in-talk:before {
|
|
content: "\f2b6"; }
|
|
|
|
.mdl-icon--phone-locked:before {
|
|
content: "\f2b7"; }
|
|
|
|
.mdl-icon--phone-missed:before {
|
|
content: "\f2b8"; }
|
|
|
|
.mdl-icon--phone-paused:before {
|
|
content: "\f2b9"; }
|
|
|
|
.mdl-icon--play-download:before {
|
|
content: "\f2ba"; }
|
|
|
|
.mdl-icon--play-install:before {
|
|
content: "\f2bb"; }
|
|
|
|
.mdl-icon--sd-card:before {
|
|
content: "\f2bc"; }
|
|
|
|
.mdl-icon--sim-card-alert:before {
|
|
content: "\f2bd"; }
|
|
|
|
.mdl-icon--sms:before {
|
|
content: "\f2be"; }
|
|
|
|
.mdl-icon--sms-failed:before {
|
|
content: "\f2bf"; }
|
|
|
|
.mdl-icon--sync:before {
|
|
content: "\f2c0"; }
|
|
|
|
.mdl-icon--sync-disabled:before {
|
|
content: "\f2c1"; }
|
|
|
|
.mdl-icon--sync-problem:before {
|
|
content: "\f2c2"; }
|
|
|
|
.mdl-icon--system-update:before {
|
|
content: "\f2c3"; }
|
|
|
|
.mdl-icon--tap-and-play:before {
|
|
content: "\f2c4"; }
|
|
|
|
.mdl-icon--time-to-leave:before {
|
|
content: "\f2c5"; }
|
|
|
|
.mdl-icon--vibration:before {
|
|
content: "\f2c6"; }
|
|
|
|
.mdl-icon--voice-chat:before {
|
|
content: "\f2c7"; }
|
|
|
|
.mdl-icon--vpn-lock:before {
|
|
content: "\f2c8"; }
|
|
|
|
.mdl-icon--cake:before {
|
|
content: "\f2c9"; }
|
|
|
|
.mdl-icon--domain:before {
|
|
content: "\f2ca"; }
|
|
|
|
.mdl-icon--location-city:before {
|
|
content: "\f2cb"; }
|
|
|
|
.mdl-icon--mood:before {
|
|
content: "\f2cc"; }
|
|
|
|
.mdl-icon--notifications-none:before {
|
|
content: "\f2cd"; }
|
|
|
|
.mdl-icon--notifications:before {
|
|
content: "\f2ce"; }
|
|
|
|
.mdl-icon--notifications-off:before {
|
|
content: "\f2cf"; }
|
|
|
|
.mdl-icon--notifications-on:before {
|
|
content: "\f2d0"; }
|
|
|
|
.mdl-icon--notifications-paused:before {
|
|
content: "\f2d1"; }
|
|
|
|
.mdl-icon--pages:before {
|
|
content: "\f2d2"; }
|
|
|
|
.mdl-icon--party-mode:before {
|
|
content: "\f2d3"; }
|
|
|
|
.mdl-icon--group:before {
|
|
content: "\f2d4"; }
|
|
|
|
.mdl-icon--group-add:before {
|
|
content: "\f2d5"; }
|
|
|
|
.mdl-icon--people:before {
|
|
content: "\f2d6"; }
|
|
|
|
.mdl-icon--people-outline:before {
|
|
content: "\f2d7"; }
|
|
|
|
.mdl-icon--person:before {
|
|
content: "\f2d8"; }
|
|
|
|
.mdl-icon--person-add:before {
|
|
content: "\f2d9"; }
|
|
|
|
.mdl-icon--person-outline:before {
|
|
content: "\f2da"; }
|
|
|
|
.mdl-icon--plus-one:before {
|
|
content: "\f2db"; }
|
|
|
|
.mdl-icon--poll:before {
|
|
content: "\f2dc"; }
|
|
|
|
.mdl-icon--public:before {
|
|
content: "\f2dd"; }
|
|
|
|
.mdl-icon--school:before {
|
|
content: "\f2de"; }
|
|
|
|
.mdl-icon--share:before {
|
|
content: "\f2df"; }
|
|
|
|
.mdl-icon--whatshot:before {
|
|
content: "\f2e0"; }
|
|
|
|
.mdl-icon--check-box:before {
|
|
content: "\f2e1"; }
|
|
|
|
.mdl-icon--check-box-outline-blank:before {
|
|
content: "\f2e2"; }
|
|
|
|
.mdl-icon--radio-button-off:before {
|
|
content: "\f2e3"; }
|
|
|
|
.mdl-icon--radio-button-on:before {
|
|
content: "\f2e4"; }
|
|
|
|
.mdl-icon--star:before {
|
|
content: "\f2e5"; }
|
|
|
|
.mdl-icon--star-half:before {
|
|
content: "\f2e6"; }
|
|
|
|
.mdl-icon--star-outline:before {
|
|
content: "\f2e7"; }
|
|
|
|
/**
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.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(55,71,79) !important; }
|
|
|
|
.mdl-color--primary-contrast {
|
|
background-color: rgb(255,255,255) !important; }
|
|
|
|
.mdl-color--primary-dark {
|
|
background-color: rgb(38,50,56) !important; }
|
|
|
|
.mdl-color--accent {
|
|
background-color: rgb(0,172,193) !important; }
|
|
|
|
.mdl-color--accent-contrast {
|
|
background-color: rgb(255,255,255) !important; }
|
|
|
|
.mdl-color-text--primary {
|
|
color: rgb(55,71,79) !important; }
|
|
|
|
.mdl-color-text--primary-contrast {
|
|
color: rgb(255,255,255) !important; }
|
|
|
|
.mdl-color-text--primary-dark {
|
|
color: rgb(38,50,56) !important; }
|
|
|
|
.mdl-color-text--accent {
|
|
color: rgb(0,172,193) !important; }
|
|
|
|
.mdl-color-text--accent-contrast {
|
|
color: rgb(255,255,255) !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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.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); }
|
|
|
|
/**
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-ripple {
|
|
background: rgb(0,0,0);
|
|
border-radius: 50%;
|
|
height: 50px;
|
|
left: 0;
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
position: absolute;
|
|
top: 0;
|
|
-webkit-transform: translate(-50%, -50%);
|
|
-ms-transform: translate(-50%, -50%);
|
|
transform: translate(-50%, -50%);
|
|
width: 50px;
|
|
overflow: hidden; }
|
|
.mdl-ripple.is-animating {
|
|
-webkit-transition: -webkit-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);
|
|
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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-animation--default {
|
|
-webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
|
|
|
|
.mdl-animation--fast-out-slow-in {
|
|
-webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
|
|
|
|
.mdl-animation--linear-out-slow-in {
|
|
-webkit-transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
|
|
transition-timing-function: cubic-bezier(0, 0, 0.2, 1); }
|
|
|
|
.mdl-animation--fast-out-linear-in {
|
|
-webkit-transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
|
|
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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-badge {
|
|
position: relative;
|
|
white-space: nowrap;
|
|
margin-right: 22px; }
|
|
.mdl-badge:not([data-badge]) {
|
|
margin-right: auto; }
|
|
.mdl-badge[data-badge]:after {
|
|
content: attr(data-badge);
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-webkit-flex-direction: row;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
-webkit-flex-wrap: wrap;
|
|
-ms-flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
-webkit-box-pack: center;
|
|
-webkit-justify-content: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
-webkit-align-content: space-between;
|
|
-ms-flex-line-pack: justify;
|
|
align-content: space-between;
|
|
-webkit-box-align: center;
|
|
-webkit-align-items: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
position: absolute;
|
|
top: -10px;
|
|
right: -22px;
|
|
font-size: 10px;
|
|
width: 20px;
|
|
height: 20px;
|
|
border-radius: 50%;
|
|
background: rgb(0,172,193);
|
|
color: rgb(255,255,255); }
|
|
.mdl-button .mdl-badge[data-badge]:after {
|
|
top: -10px;
|
|
right: -5px; }
|
|
.mdl-badge.mdl-badge--no-background[data-badge]:after {
|
|
color: rgb(0,172,193);
|
|
background: rgba(255,255,255,0.2);
|
|
box-shadow: 0 0 1px gray; }
|
|
|
|
/**
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-button {
|
|
background: transparent;
|
|
border: none;
|
|
border-radius: 2px;
|
|
color: rgb(0,0,0);
|
|
display: block;
|
|
position: relative;
|
|
height: 36px;
|
|
min-width: 64px;
|
|
padding: 0 8px;
|
|
margin: 0 4px;
|
|
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, transform;
|
|
-webkit-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);
|
|
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[disabled][disabled] {
|
|
color: rgba(0,0,0, 0.26);
|
|
cursor: auto;
|
|
background-color: transparent; }
|
|
.mdl-button.mdl-button--colored {
|
|
color: rgb(55,71,79); }
|
|
.mdl-button.mdl-button--colored:focus:not(:active) {
|
|
background-color: rgba(0,0,0, 0.12); }
|
|
|
|
.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(55,71,79);
|
|
color: rgb(255,255,255); }
|
|
.mdl-button--raised.mdl-button--colored:hover {
|
|
background-color: rgb(55,71,79); }
|
|
.mdl-button--raised.mdl-button--colored:active {
|
|
background-color: rgb(55,71,79); }
|
|
.mdl-button--raised.mdl-button--colored:focus:not(:active) {
|
|
background-color: rgb(55,71,79); }
|
|
.mdl-button--raised.mdl-button--colored .mdl-ripple {
|
|
background: rgb(255,255,255); }
|
|
.mdl-button--raised[disabled][disabled] {
|
|
background-color: rgba(0,0,0, 0.12);
|
|
color: rgba(0,0,0, 0.26);
|
|
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--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 .mdl-icon {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
-webkit-transform: translate(-12px, -12px);
|
|
-ms-transform: translate(-12px, -12px);
|
|
transform: translate(-12px, -12px);
|
|
/*top: ($button-fab-size - $button-fab-font-size) / 2;
|
|
left: ($button-fab-size - $button-fab-font-size) / 2;*/
|
|
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(0,172,193);
|
|
color: rgb(255,255,255); }
|
|
.mdl-button--fab.mdl-button--colored:hover {
|
|
background-color: rgb(0,172,193); }
|
|
.mdl-button--fab.mdl-button--colored:focus:not(:active) {
|
|
background-color: rgb(0,172,193); }
|
|
.mdl-button--fab.mdl-button--colored:active {
|
|
background-color: rgb(0,172,193); }
|
|
.mdl-button--fab.mdl-button--colored .mdl-ripple {
|
|
background: rgb(255,255,255); }
|
|
.mdl-button--fab[disabled][disabled] {
|
|
background-color: rgba(0,0,0, 0.12);
|
|
color: rgba(0,0,0, 0.26);
|
|
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--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 .mdl-icon {
|
|
position: absolute;
|
|
top: 4px;
|
|
left: 4px; }
|
|
.mdl-button--icon.mdl-button--mini-icon {
|
|
height: 24px;
|
|
min-width: 24px;
|
|
width: 24px; }
|
|
.mdl-button--icon.mdl-button--mini-icon .mdl-icon {
|
|
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 {
|
|
background-color: transparent; }
|
|
|
|
.mdl-button--primary.mdl-button--primary {
|
|
background-color: rgb(55,71,79);
|
|
color: rgb(255,255,255); }
|
|
.mdl-button--primary.mdl-button--primary .mdl-ripple {
|
|
background: rgb(255,255,255); }
|
|
|
|
.mdl-button--accent.mdl-button--accent {
|
|
background-color: rgb(0,172,193);
|
|
color: rgb(255,255,255); }
|
|
.mdl-button--accent.mdl-button--accent .mdl-ripple {
|
|
background: rgb(255,255,255); }
|
|
|
|
/**
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-card {
|
|
font-size: 16px;
|
|
min-height: 200px;
|
|
overflow: hidden;
|
|
width: 330px;
|
|
z-index: 1;
|
|
position: relative;
|
|
background: rgb(255,255,255);
|
|
border-radius: 2px; }
|
|
|
|
.mdl-card__img-container {
|
|
background-color: rgb(0,172,193);
|
|
background-repeat: repeat;
|
|
background-position: 50% 50%;
|
|
background-size: cover;
|
|
background-origin: padding-box;
|
|
background-attachment: scroll;
|
|
height: 186px; }
|
|
|
|
.mdl-card__heading {
|
|
-webkit-box-align: center;
|
|
-webkit-align-items: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
background: rgb(38,50,56) none repeat scroll 0 0/auto padding-box border-box;
|
|
border: 0 none rgb(255,255,255);
|
|
color: rgb(255,255,255);
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
font-size: 24px;
|
|
height: 96px;
|
|
justify-items: stretch;
|
|
line-height: normal;
|
|
padding: 8px 16px;
|
|
-webkit-perspective-origin: 165px 56px;
|
|
perspective-origin: 165px 56px;
|
|
-webkit-transform-origin: 165px 56px;
|
|
-ms-transform-origin: 165px 56px;
|
|
transform-origin: 165px 56px;
|
|
width: 100%; }
|
|
|
|
.mdl-card__heading-text {
|
|
-webkit-align-self: center;
|
|
-ms-flex-item-align: center;
|
|
align-self: center;
|
|
color: rgb(255,255,255);
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
font-size: inherit;
|
|
font-weight: 300;
|
|
height: 96px;
|
|
justify-self: stretch;
|
|
line-height: normal;
|
|
overflow: hidden;
|
|
-webkit-transform-origin: 149px 48px;
|
|
-ms-transform-origin: 149px 48px;
|
|
transform-origin: 149px 48px;
|
|
width: 90%; }
|
|
|
|
.mdl-card__caption {
|
|
background: rgb(38,50,56) none repeat scroll 0 0/auto padding-box border-box;
|
|
color: rgb(255,255,255);
|
|
font-size: 12px;
|
|
height: 16px;
|
|
line-height: normal;
|
|
padding: 8px 16px;
|
|
-webkit-perspective-origin: 165px 16px;
|
|
perspective-origin: 165px 16px;
|
|
width: 100%; }
|
|
|
|
.mdl-card__lower {
|
|
color: rgb(55,71,79);
|
|
font-size: 13px;
|
|
height: 108px;
|
|
line-height: 18px;
|
|
margin: 10px 0;
|
|
overflow: hidden;
|
|
padding: 0 16px;
|
|
width: 90%; }
|
|
|
|
.mdl-card__bottom {
|
|
font-size: 16px;
|
|
height: 50px;
|
|
line-height: normal;
|
|
width: 100%;
|
|
border-top: 1px solid rgba(0, 0, 0, 0.16); }
|
|
|
|
.mdl-card__bottom a {
|
|
box-sizing: border-box;
|
|
color: rgb(38,50,56);
|
|
cursor: pointer;
|
|
display: inline-block;
|
|
font-size: 13px;
|
|
font-weight: normal;
|
|
height: 50px;
|
|
line-height: 50px;
|
|
padding: 0 16px;
|
|
-webkit-perspective-origin: 165px 25px;
|
|
perspective-origin: 165px 25px;
|
|
text-transform: uppercase;
|
|
-webkit-transform-origin: 165px 25px;
|
|
-ms-transform-origin: 165px 25px;
|
|
transform-origin: 165px 25px;
|
|
width: 100%;
|
|
text-decoration: none; }
|
|
|
|
.mdl-card__menu {
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
color: rgb(255,255,255); }
|
|
|
|
/**
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-checkbox {
|
|
position: relative;
|
|
z-index: 1;
|
|
vertical-align: middle;
|
|
display: inline-block;
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
height: 24px;
|
|
margin: 12px 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(55,71,79); }
|
|
.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(55,71,79, 0.26);
|
|
background-color: rgba(55,71,79, 0.26); }
|
|
|
|
.mdl-checkbox__tick-outline {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
height: 100%;
|
|
width: 100%;
|
|
-webkit-mask: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcCI+CiAgICAgIDxwYXRoCiAgICAgICAgIGQ9Ik0gMCwwIDAsMSAxLDEgMSwwIDAsMCB6IE0gMC44NTM0Mzc1LDAuMTY3MTg3NSAwLjk1OTY4NzUsMC4yNzMxMjUgMC40MjkzNzUsMC44MDM0Mzc1IDAuMzIzMTI1LDAuOTA5Njg3NSAwLjIxNzE4NzUsMC44MDM0Mzc1IDAuMDQwMzEyNSwwLjYyNjg3NSAwLjE0NjU2MjUsMC41MjA2MjUgMC4zMjMxMjUsMC42OTc1IDAuODUzNDM3NSwwLjE2NzE4NzUgeiIKICAgICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KICAgIDwvY2xpcFBhdGg+CiAgICA8bWFzayBpZD0ibWFzayIgbWFza1VuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgbWFza0NvbnRlbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giPgogICAgICA8cGF0aAogICAgICAgICBkPSJNIDAsMCAwLDEgMSwxIDEsMCAwLDAgeiBNIDAuODUzNDM3NSwwLjE2NzE4NzUgMC45NTk2ODc1LDAuMjczMTI1IDAuNDI5Mzc1LDAuODAzNDM3NSAwLjMyMzEyNSwwLjkwOTY4NzUgMC4yMTcxODc1LDAuODAzNDM3NSAwLjA0MDMxMjUsMC42MjY4NzUgMC4xNDY1NjI1LDAuNTIwNjI1IDAuMzIzMTI1LDAuNjk3NSAwLjg1MzQzNzUsMC4xNjcxODc1IHoiCiAgICAgICAgIHN0eWxlPSJmaWxsOiNmZmZmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmUiIC8+CiAgICA8L21hc2s+CiAgPC9kZWZzPgogIDxyZWN0CiAgICAgd2lkdGg9IjEiCiAgICAgaGVpZ2h0PSIxIgogICAgIHg9IjAiCiAgICAgeT0iMCIKICAgICBjbGlwLXBhdGg9InVybCgjY2xpcCkiCiAgICAgc3R5bGU9ImZpbGw6IzAwMDAwMDtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KPC9zdmc+Cg==);
|
|
mask: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcCI+CiAgICAgIDxwYXRoCiAgICAgICAgIGQ9Ik0gMCwwIDAsMSAxLDEgMSwwIDAsMCB6IE0gMC44NTM0Mzc1LDAuMTY3MTg3NSAwLjk1OTY4NzUsMC4yNzMxMjUgMC40MjkzNzUsMC44MDM0Mzc1IDAuMzIzMTI1LDAuOTA5Njg3NSAwLjIxNzE4NzUsMC44MDM0Mzc1IDAuMDQwMzEyNSwwLjYyNjg3NSAwLjE0NjU2MjUsMC41MjA2MjUgMC4zMjMxMjUsMC42OTc1IDAuODUzNDM3NSwwLjE2NzE4NzUgeiIKICAgICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KICAgIDwvY2xpcFBhdGg+CiAgICA8bWFzayBpZD0ibWFzayIgbWFza1VuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgbWFza0NvbnRlbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giPgogICAgICA8cGF0aAogICAgICAgICBkPSJNIDAsMCAwLDEgMSwxIDEsMCAwLDAgeiBNIDAuODUzNDM3NSwwLjE2NzE4NzUgMC45NTk2ODc1LDAuMjczMTI1IDAuNDI5Mzc1LDAuODAzNDM3NSAwLjMyMzEyNSwwLjkwOTY4NzUgMC4yMTcxODc1LDAuODAzNDM3NSAwLjA0MDMxMjUsMC42MjY4NzUgMC4xNDY1NjI1LDAuNTIwNjI1IDAuMzIzMTI1LDAuNjk3NSAwLjg1MzQzNzUsMC4xNjcxODc1IHoiCiAgICAgICAgIHN0eWxlPSJmaWxsOiNmZmZmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmUiIC8+CiAgICA8L21hc2s+CiAgPC9kZWZzPgogIDxyZWN0CiAgICAgd2lkdGg9IjEiCiAgICAgaGVpZ2h0PSIxIgogICAgIHg9IjAiCiAgICAgeT0iMCIKICAgICBjbGlwLXBhdGg9InVybCgjY2xpcCkiCiAgICAgc3R5bGU9ImZpbGw6IzAwMDAwMDtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KPC9zdmc+Cg==);
|
|
background: transparent;
|
|
-webkit-transition-duration: 0.28s;
|
|
transition-duration: 0.28s;
|
|
-webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
-webkit-transition-property: background;
|
|
transition-property: background; }
|
|
.mdl-checkbox.is-checked .mdl-checkbox__tick-outline {
|
|
background: rgb(55,71,79) url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8cGF0aAogICAgIGQ9Ik0gMC4wNDAzODA1OSwwLjYyNjc3NjcgMC4xNDY0NDY2MSwwLjUyMDcxMDY4IDAuNDI5Mjg5MzIsMC44MDM1NTMzOSAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IE0gMC4yMTcxNTcyOSwwLjgwMzU1MzM5IDAuODUzNTUzMzksMC4xNjcxNTcyOSAwLjk1OTYxOTQxLDAuMjczMjIzMyAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IgogICAgIGlkPSJyZWN0Mzc4MCIKICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPgo8L3N2Zz4K); }
|
|
.mdl-checkbox.is-checked.is-disabled .mdl-checkbox__tick-outline {
|
|
background: rgba(0,0,0, 0.26) url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8cGF0aAogICAgIGQ9Ik0gMC4wNDAzODA1OSwwLjYyNjc3NjcgMC4xNDY0NDY2MSwwLjUyMDcxMDY4IDAuNDI5Mjg5MzIsMC44MDM1NTMzOSAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IE0gMC4yMTcxNTcyOSwwLjgwMzU1MzM5IDAuODUzNTUzMzksMC4xNjcxNTcyOSAwLjk1OTYxOTQxLDAuMjczMjIzMyAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IgogICAgIGlkPSJyZWN0Mzc4MCIKICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPgo8L3N2Zz4K); }
|
|
|
|
.mdl-checkbox__label {
|
|
position: relative;
|
|
cursor: pointer;
|
|
font-size: 16px;
|
|
line-height: 24px;
|
|
margin: 0; }
|
|
.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(55,71,79); }
|
|
.mdl-checkbox.is-disabled .mdl-checkbox__ripple-container {
|
|
cursor: auto; }
|
|
.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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-mega-footer {
|
|
padding: 16px;
|
|
color: rgb(158,158,158);
|
|
background-color: rgb(66,66,66); }
|
|
|
|
.mdl-mega-footer--top-section:after, .mdl-mega-footer--middle-section:after {
|
|
content: '';
|
|
display: block;
|
|
clear: both; }
|
|
|
|
.mdl-mega-footer--left-section {
|
|
margin-bottom: 16px; }
|
|
|
|
.mdl-mega-footer--right-section {
|
|
margin-bottom: 16px; }
|
|
|
|
.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 {
|
|
float: left; }
|
|
.mdl-mega-footer--right-section {
|
|
float: right; }
|
|
.mdl-mega-footer--right-section a {
|
|
display: inline-block;
|
|
margin-left: 16px;
|
|
line-height: 36px;
|
|
vertical-align: middle; } }
|
|
|
|
.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 {
|
|
display: block;
|
|
position: relative; }
|
|
|
|
@media screen and (min-width: 760px) {
|
|
.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) {
|
|
float: left; }
|
|
.mdl-mega-footer--drop-down-section:nth-child(3) {
|
|
float: right; }
|
|
.mdl-mega-footer--drop-down-section:nth-child(3):after {
|
|
clear: right; }
|
|
.mdl-mega-footer--drop-down-section:nth-child(4) {
|
|
float: right; }
|
|
.mdl-mega-footer--middle-section:after {
|
|
content: '';
|
|
display: block;
|
|
clear: both; } }
|
|
|
|
@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) {
|
|
width: 24%;
|
|
float: left; } }
|
|
|
|
.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 {
|
|
font-family: 'Material-Design-Iconic-Font';
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
content: "\f29d"; }
|
|
|
|
.mdl-mega-footer--heading-checkbox:checked ~ ul {
|
|
display: none; }
|
|
.mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer--heading:after {
|
|
font-family: 'Material-Design-Iconic-Font';
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
content: "\f29e"; }
|
|
|
|
.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 {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
display: block;
|
|
width: 23.8px;
|
|
height: 23.8px;
|
|
background-size: cover; }
|
|
|
|
.mdl-mega-footer--link-list {
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
margin-bottom: 32px; }
|
|
|
|
.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 {
|
|
color: inherit;
|
|
text-decoration: none; }
|
|
|
|
@media screen and (min-width: 760px) {
|
|
.mdl-mega-footer--heading-checkbox {
|
|
display: none; }
|
|
.mdl-mega-footer--heading-checkbox ~ .mdl-mega-footer--heading:after {
|
|
background-image: none; }
|
|
.mdl-mega-footer--heading-checkbox:checked ~ ul {
|
|
display: block; }
|
|
.mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer--heading:after {
|
|
content: ''; } }
|
|
|
|
.mdl-mega-footer--bottom-section {
|
|
margin-bottom: 16px; }
|
|
|
|
.mdl-mega-footer--bottom-section:after {
|
|
content: '';
|
|
display: block;
|
|
clear: both; }
|
|
|
|
.mdl-logo {
|
|
line-height: 20px;
|
|
margin-bottom: 16px; }
|
|
|
|
.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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-mini-footer {
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-flex-flow: row wrap;
|
|
-ms-flex-flow: row wrap;
|
|
flex-flow: row wrap;
|
|
-webkit-box-pack: justify;
|
|
-webkit-justify-content: space-between;
|
|
-ms-flex-pack: justify;
|
|
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 {
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-flex-flow: row nowrap;
|
|
-ms-flex-flow: row nowrap;
|
|
flex-flow: row nowrap;
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0; }
|
|
.mdl-mini-footer--link-list li {
|
|
margin-bottom: 0;
|
|
margin-right: 16px; }
|
|
@media screen and (min-width: 760px) {
|
|
.mdl-mini-footer--link-list li {
|
|
line-height: 36px; } }
|
|
.mdl-mini-footer--link-list a {
|
|
color: inherit;
|
|
text-decoration: none; }
|
|
|
|
.mdl-mini-footer--left-section {
|
|
display: inline-block;
|
|
-webkit-box-ordinal-group: 1;
|
|
-webkit-order: 0;
|
|
-ms-flex-order: 0;
|
|
order: 0; }
|
|
|
|
.mdl-mini-footer--right-section {
|
|
display: inline-block;
|
|
-webkit-box-ordinal-group: 2;
|
|
-webkit-order: 1;
|
|
-ms-flex-order: 1;
|
|
order: 1; }
|
|
|
|
.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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-grid {
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-flex-flow: row wrap;
|
|
-ms-flex-flow: row wrap;
|
|
flex-flow: row wrap;
|
|
margin: 0 auto 0 auto;
|
|
-webkit-box-align: stretch;
|
|
-webkit-align-items: stretch;
|
|
-ms-flex-align: stretch;
|
|
align-items: stretch; }
|
|
.mdl-grid.mdl-grid--no-spacing {
|
|
padding: 0; }
|
|
|
|
.mdl-cell {
|
|
box-sizing: border-box; }
|
|
|
|
.mdl-cell--top {
|
|
-webkit-align-self: flex-start;
|
|
-ms-flex-item-align: start;
|
|
align-self: flex-start; }
|
|
|
|
.mdl-cell--middle {
|
|
-webkit-align-self: center;
|
|
-ms-flex-item-align: center;
|
|
align-self: center; }
|
|
|
|
.mdl-cell--bottom {
|
|
-webkit-align-self: flex-end;
|
|
-ms-flex-item-align: end;
|
|
align-self: flex-end; }
|
|
|
|
.mdl-cell--stretch {
|
|
-webkit-align-self: stretch;
|
|
-ms-flex-item-align: stretch;
|
|
align-self: stretch; }
|
|
|
|
.mdl-grid.mdl-grid--no-spacing > .mdl-cell {
|
|
margin: 0; }
|
|
|
|
@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--1-col {
|
|
width: calc(25% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--1-col {
|
|
width: 25%; }
|
|
.mdl-cell--1-col-phone.mdl-cell--1-col-phone {
|
|
width: calc(25% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--1-col-phone.mdl-cell--1-col-phone {
|
|
width: 25%; }
|
|
.mdl-cell--2-col {
|
|
width: calc(50% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--2-col {
|
|
width: 50%; }
|
|
.mdl-cell--2-col-phone.mdl-cell--2-col-phone {
|
|
width: calc(50% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--2-col-phone.mdl-cell--2-col-phone {
|
|
width: 50%; }
|
|
.mdl-cell--3-col {
|
|
width: calc(75% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--3-col {
|
|
width: 75%; }
|
|
.mdl-cell--3-col-phone.mdl-cell--3-col-phone {
|
|
width: calc(75% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--3-col-phone.mdl-cell--3-col-phone {
|
|
width: 75%; }
|
|
.mdl-cell--4-col {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--4-col {
|
|
width: 100%; }
|
|
.mdl-cell--4-col-phone.mdl-cell--4-col-phone {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--4-col-phone.mdl-cell--4-col-phone {
|
|
width: 100%; }
|
|
.mdl-cell--5-col {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--5-col {
|
|
width: 100%; }
|
|
.mdl-cell--5-col-phone.mdl-cell--5-col-phone {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--5-col-phone.mdl-cell--5-col-phone {
|
|
width: 100%; }
|
|
.mdl-cell--6-col {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--6-col {
|
|
width: 100%; }
|
|
.mdl-cell--6-col-phone.mdl-cell--6-col-phone {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--6-col-phone.mdl-cell--6-col-phone {
|
|
width: 100%; }
|
|
.mdl-cell--7-col {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--7-col {
|
|
width: 100%; }
|
|
.mdl-cell--7-col-phone.mdl-cell--7-col-phone {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--7-col-phone.mdl-cell--7-col-phone {
|
|
width: 100%; }
|
|
.mdl-cell--8-col {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--8-col {
|
|
width: 100%; }
|
|
.mdl-cell--8-col-phone.mdl-cell--8-col-phone {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--8-col-phone.mdl-cell--8-col-phone {
|
|
width: 100%; }
|
|
.mdl-cell--9-col {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--9-col {
|
|
width: 100%; }
|
|
.mdl-cell--9-col-phone.mdl-cell--9-col-phone {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--9-col-phone.mdl-cell--9-col-phone {
|
|
width: 100%; }
|
|
.mdl-cell--10-col {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--10-col {
|
|
width: 100%; }
|
|
.mdl-cell--10-col-phone.mdl-cell--10-col-phone {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--10-col-phone.mdl-cell--10-col-phone {
|
|
width: 100%; }
|
|
.mdl-cell--11-col {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--11-col {
|
|
width: 100%; }
|
|
.mdl-cell--11-col-phone.mdl-cell--11-col-phone {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--11-col-phone.mdl-cell--11-col-phone {
|
|
width: 100%; }
|
|
.mdl-cell--12-col {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--12-col {
|
|
width: 100%; }
|
|
.mdl-cell--12-col-phone.mdl-cell--12-col-phone {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--12-col-phone.mdl-cell--12-col-phone {
|
|
width: 100%; } }
|
|
|
|
@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--1-col {
|
|
width: calc(12.5% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--1-col {
|
|
width: 12.5%; }
|
|
.mdl-cell--1-col-tablet.mdl-cell--1-col-tablet {
|
|
width: calc(12.5% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--1-col-tablet.mdl-cell--1-col-tablet {
|
|
width: 12.5%; }
|
|
.mdl-cell--2-col {
|
|
width: calc(25% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--2-col {
|
|
width: 25%; }
|
|
.mdl-cell--2-col-tablet.mdl-cell--2-col-tablet {
|
|
width: calc(25% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--2-col-tablet.mdl-cell--2-col-tablet {
|
|
width: 25%; }
|
|
.mdl-cell--3-col {
|
|
width: calc(37.5% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--3-col {
|
|
width: 37.5%; }
|
|
.mdl-cell--3-col-tablet.mdl-cell--3-col-tablet {
|
|
width: calc(37.5% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--3-col-tablet.mdl-cell--3-col-tablet {
|
|
width: 37.5%; }
|
|
.mdl-cell--4-col {
|
|
width: calc(50% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--4-col {
|
|
width: 50%; }
|
|
.mdl-cell--4-col-tablet.mdl-cell--4-col-tablet {
|
|
width: calc(50% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--4-col-tablet.mdl-cell--4-col-tablet {
|
|
width: 50%; }
|
|
.mdl-cell--5-col {
|
|
width: calc(62.5% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--5-col {
|
|
width: 62.5%; }
|
|
.mdl-cell--5-col-tablet.mdl-cell--5-col-tablet {
|
|
width: calc(62.5% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--5-col-tablet.mdl-cell--5-col-tablet {
|
|
width: 62.5%; }
|
|
.mdl-cell--6-col {
|
|
width: calc(75% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--6-col {
|
|
width: 75%; }
|
|
.mdl-cell--6-col-tablet.mdl-cell--6-col-tablet {
|
|
width: calc(75% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--6-col-tablet.mdl-cell--6-col-tablet {
|
|
width: 75%; }
|
|
.mdl-cell--7-col {
|
|
width: calc(87.5% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--7-col {
|
|
width: 87.5%; }
|
|
.mdl-cell--7-col-tablet.mdl-cell--7-col-tablet {
|
|
width: calc(87.5% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--7-col-tablet.mdl-cell--7-col-tablet {
|
|
width: 87.5%; }
|
|
.mdl-cell--8-col {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--8-col {
|
|
width: 100%; }
|
|
.mdl-cell--8-col-tablet.mdl-cell--8-col-tablet {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--8-col-tablet.mdl-cell--8-col-tablet {
|
|
width: 100%; }
|
|
.mdl-cell--9-col {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--9-col {
|
|
width: 100%; }
|
|
.mdl-cell--9-col-tablet.mdl-cell--9-col-tablet {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--9-col-tablet.mdl-cell--9-col-tablet {
|
|
width: 100%; }
|
|
.mdl-cell--10-col {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--10-col {
|
|
width: 100%; }
|
|
.mdl-cell--10-col-tablet.mdl-cell--10-col-tablet {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--10-col-tablet.mdl-cell--10-col-tablet {
|
|
width: 100%; }
|
|
.mdl-cell--11-col {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--11-col {
|
|
width: 100%; }
|
|
.mdl-cell--11-col-tablet.mdl-cell--11-col-tablet {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--11-col-tablet.mdl-cell--11-col-tablet {
|
|
width: 100%; }
|
|
.mdl-cell--12-col {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--12-col {
|
|
width: 100%; }
|
|
.mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
|
|
width: 100%; } }
|
|
|
|
@media (min-width: 840px) {
|
|
.mdl-grid {
|
|
padding: 8px; }
|
|
.mdl-cell {
|
|
margin: 8px;
|
|
width: calc(33.33333% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell {
|
|
width: 33.33333%; }
|
|
.mdl-cell--hide-desktop {
|
|
display: none !important; }
|
|
.mdl-cell--1-col {
|
|
width: calc(8.33333% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--1-col {
|
|
width: 8.33333%; }
|
|
.mdl-cell--1-col-desktop.mdl-cell--1-col-desktop {
|
|
width: calc(8.33333% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--1-col-desktop.mdl-cell--1-col-desktop {
|
|
width: 8.33333%; }
|
|
.mdl-cell--2-col {
|
|
width: calc(16.66667% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--2-col {
|
|
width: 16.66667%; }
|
|
.mdl-cell--2-col-desktop.mdl-cell--2-col-desktop {
|
|
width: calc(16.66667% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--2-col-desktop.mdl-cell--2-col-desktop {
|
|
width: 16.66667%; }
|
|
.mdl-cell--3-col {
|
|
width: calc(25% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--3-col {
|
|
width: 25%; }
|
|
.mdl-cell--3-col-desktop.mdl-cell--3-col-desktop {
|
|
width: calc(25% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--3-col-desktop.mdl-cell--3-col-desktop {
|
|
width: 25%; }
|
|
.mdl-cell--4-col {
|
|
width: calc(33.33333% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--4-col {
|
|
width: 33.33333%; }
|
|
.mdl-cell--4-col-desktop.mdl-cell--4-col-desktop {
|
|
width: calc(33.33333% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--4-col-desktop.mdl-cell--4-col-desktop {
|
|
width: 33.33333%; }
|
|
.mdl-cell--5-col {
|
|
width: calc(41.66667% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--5-col {
|
|
width: 41.66667%; }
|
|
.mdl-cell--5-col-desktop.mdl-cell--5-col-desktop {
|
|
width: calc(41.66667% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--5-col-desktop.mdl-cell--5-col-desktop {
|
|
width: 41.66667%; }
|
|
.mdl-cell--6-col {
|
|
width: calc(50% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--6-col {
|
|
width: 50%; }
|
|
.mdl-cell--6-col-desktop.mdl-cell--6-col-desktop {
|
|
width: calc(50% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--6-col-desktop.mdl-cell--6-col-desktop {
|
|
width: 50%; }
|
|
.mdl-cell--7-col {
|
|
width: calc(58.33333% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--7-col {
|
|
width: 58.33333%; }
|
|
.mdl-cell--7-col-desktop.mdl-cell--7-col-desktop {
|
|
width: calc(58.33333% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--7-col-desktop.mdl-cell--7-col-desktop {
|
|
width: 58.33333%; }
|
|
.mdl-cell--8-col {
|
|
width: calc(66.66667% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--8-col {
|
|
width: 66.66667%; }
|
|
.mdl-cell--8-col-desktop.mdl-cell--8-col-desktop {
|
|
width: calc(66.66667% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--8-col-desktop.mdl-cell--8-col-desktop {
|
|
width: 66.66667%; }
|
|
.mdl-cell--9-col {
|
|
width: calc(75% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--9-col {
|
|
width: 75%; }
|
|
.mdl-cell--9-col-desktop.mdl-cell--9-col-desktop {
|
|
width: calc(75% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--9-col-desktop.mdl-cell--9-col-desktop {
|
|
width: 75%; }
|
|
.mdl-cell--10-col {
|
|
width: calc(83.33333% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--10-col {
|
|
width: 83.33333%; }
|
|
.mdl-cell--10-col-desktop.mdl-cell--10-col-desktop {
|
|
width: calc(83.33333% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--10-col-desktop.mdl-cell--10-col-desktop {
|
|
width: 83.33333%; }
|
|
.mdl-cell--11-col {
|
|
width: calc(91.66667% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--11-col {
|
|
width: 91.66667%; }
|
|
.mdl-cell--11-col-desktop.mdl-cell--11-col-desktop {
|
|
width: calc(91.66667% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--11-col-desktop.mdl-cell--11-col-desktop {
|
|
width: 91.66667%; }
|
|
.mdl-cell--12-col {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--12-col {
|
|
width: 100%; }
|
|
.mdl-cell--12-col-desktop.mdl-cell--12-col-desktop {
|
|
width: calc(100% - 16px); }
|
|
.mdl-grid--no-spacing > .mdl-cell--12-col-desktop.mdl-cell--12-col-desktop {
|
|
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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.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;
|
|
line-height: 32px;
|
|
color: rgb(97,97,97);
|
|
border-radius: 50%;
|
|
font-size: 24px;
|
|
padding: 0;
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
text-align: center;
|
|
background-color: transparent;
|
|
will-change: background-color;
|
|
-webkit-transition: background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
|
|
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.is-checked .mdl-icon-toggle__label {
|
|
color: rgb(55,71,79); }
|
|
.mdl-icon-toggle.is-disabled .mdl-icon-toggle__label {
|
|
color: rgba(0,0,0, 0.26);
|
|
cursor: auto;
|
|
-webkit-transition: none;
|
|
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(55,71,79, 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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-menu__container {
|
|
display: block;
|
|
margin: 0;
|
|
padding: 0;
|
|
border: none;
|
|
position: absolute;
|
|
overflow: visible;
|
|
height: 0;
|
|
width: 0; }
|
|
|
|
.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;
|
|
-webkit-transform: scale(0);
|
|
-ms-transform: scale(0);
|
|
transform: scale(0);
|
|
-webkit-transform-origin: 0 0;
|
|
-ms-transform-origin: 0 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;
|
|
-webkit-transition: -webkit-transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
|
|
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
|
|
.mdl-menu__container.is-visible .mdl-menu__outline {
|
|
opacity: 1;
|
|
-webkit-transform: scale(1);
|
|
-ms-transform: scale(1);
|
|
transform: scale(1); }
|
|
.mdl-menu__outline.mdl-menu--bottom-right {
|
|
-webkit-transform-origin: 100% 0;
|
|
-ms-transform-origin: 100% 0;
|
|
transform-origin: 100% 0; }
|
|
.mdl-menu__outline.mdl-menu--top-left {
|
|
-webkit-transform-origin: 0 100%;
|
|
-ms-transform-origin: 0 100%;
|
|
transform-origin: 0 100%; }
|
|
.mdl-menu__outline.mdl-menu--top-right {
|
|
-webkit-transform-origin: 100% 100%;
|
|
-ms-transform-origin: 100% 100%;
|
|
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); }
|
|
.mdl-menu__container.is-visible .mdl-menu {
|
|
opacity: 1; }
|
|
.mdl-menu.is-animating {
|
|
-webkit-transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), clip 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
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;
|
|
width: 100%;
|
|
line-height: 48px;
|
|
white-space: nowrap;
|
|
opacity: 0;
|
|
-webkit-transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
|
|
transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none; }
|
|
.mdl-menu__container.is-visible .mdl-menu__item {
|
|
opacity: 1; }
|
|
.mdl-menu__item::-moz-focus-inner {
|
|
border: 0; }
|
|
.mdl-menu__item[disabled] {
|
|
color: rgb(189,189,189);
|
|
background-color: transparent;
|
|
cursor: auto; }
|
|
.mdl-menu__item[disabled]:hover {
|
|
background-color: transparent; }
|
|
.mdl-menu__item[disabled]:focus {
|
|
background-color: transparent; }
|
|
.mdl-menu__item[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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-js-progress {
|
|
display: block;
|
|
position: relative;
|
|
height: 4px; }
|
|
|
|
.mdl-js-progress > .bar {
|
|
display: block;
|
|
position: absolute;
|
|
top: 0;
|
|
bottom: 0;
|
|
width: 0%;
|
|
-webkit-transition: width 0.2s cubic-bezier(0.4, 0, 0.2, 1);
|
|
transition: width 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
|
|
|
|
.mdl-js-progress > .progressbar {
|
|
background-color: rgb(55,71,79);
|
|
z-index: 1;
|
|
left: 0; }
|
|
|
|
.mdl-js-progress > .bufferbar {
|
|
background-image: -webkit-linear-gradient(left, rgba(255,255,255, 0.7), rgba(255,255,255, 0.7)), -webkit-linear-gradient(left, rgb(55,71,79), rgb(55,71,79));
|
|
background-image: linear-gradient(to right, rgba(255,255,255, 0.7), rgba(255,255,255, 0.7)), linear-gradient(to right, rgb(55,71,79), rgb(55,71,79));
|
|
z-index: 0;
|
|
left: 0; }
|
|
|
|
.mdl-js-progress > .auxbar {
|
|
right: 0; }
|
|
|
|
@supports (-webkit-appearance: none) {
|
|
.mdl-js-progress:not(.mdl-progress__indeterminate) > .auxbar {
|
|
background-image: -webkit-linear-gradient(left, rgba(255,255,255, 0.7), rgba(255,255,255, 0.7)), -webkit-linear-gradient(left, rgb(55,71,79), rgb(55,71,79));
|
|
background-image: linear-gradient(to right, rgba(255,255,255, 0.7), rgba(255,255,255, 0.7)), linear-gradient(to right, rgb(55,71,79), rgb(55,71,79));
|
|
-webkit-mask: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+Cjxzdmcgd2lkdGg9IjEyIiBoZWlnaHQ9IjQiIHZpZXdQb3J0PSIwIDAgMTIgNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxlbGxpcHNlIGN4PSIyIiBjeT0iMiIgcng9IjIiIHJ5PSIyIj4KICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImN4IiBmcm9tPSIyIiB0bz0iLTEwIiBkdXI9IjAuNnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogIDwvZWxsaXBzZT4KICA8ZWxsaXBzZSBjeD0iMTQiIGN5PSIyIiByeD0iMiIgcnk9IjIiIGNsYXNzPSJsb2FkZXIiPgogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3giIGZyb209IjE0IiB0bz0iMiIgZHVyPSIwLjZzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L2VsbGlwc2U+Cjwvc3ZnPgo=);
|
|
mask: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+Cjxzdmcgd2lkdGg9IjEyIiBoZWlnaHQ9IjQiIHZpZXdQb3J0PSIwIDAgMTIgNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxlbGxpcHNlIGN4PSIyIiBjeT0iMiIgcng9IjIiIHJ5PSIyIj4KICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImN4IiBmcm9tPSIyIiB0bz0iLTEwIiBkdXI9IjAuNnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogIDwvZWxsaXBzZT4KICA8ZWxsaXBzZSBjeD0iMTQiIGN5PSIyIiByeD0iMiIgcnk9IjIiIGNsYXNzPSJsb2FkZXIiPgogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3giIGZyb209IjE0IiB0bz0iMiIgZHVyPSIwLjZzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L2VsbGlwc2U+Cjwvc3ZnPgo=); } }
|
|
|
|
.mdl-js-progress:not(.mdl-progress__indeterminate) > .auxbar {
|
|
background-color: rgba(0,0,0, 0.26); }
|
|
|
|
.mdl-js-progress.mdl-progress__indeterminate > .bar1 {
|
|
background-color: rgb(55,71,79);
|
|
-webkit-animation-name: indeterminate1;
|
|
animation-name: indeterminate1;
|
|
-webkit-animation-duration: 2s;
|
|
animation-duration: 2s;
|
|
-webkit-animation-iteration-count: infinite;
|
|
animation-iteration-count: infinite;
|
|
-webkit-animation-timing-function: linear;
|
|
animation-timing-function: linear; }
|
|
|
|
.mdl-js-progress.mdl-progress__indeterminate > .bar3 {
|
|
background-image: none;
|
|
background-color: rgb(55,71,79);
|
|
-webkit-animation-name: indeterminate2;
|
|
animation-name: indeterminate2;
|
|
-webkit-animation-duration: 2s;
|
|
animation-duration: 2s;
|
|
-webkit-animation-iteration-count: infinite;
|
|
animation-iteration-count: infinite;
|
|
-webkit-animation-timing-function: linear;
|
|
animation-timing-function: linear; }
|
|
|
|
@-webkit-keyframes indeterminate1 {
|
|
0% {
|
|
left: 0%;
|
|
width: 0%; }
|
|
|
|
50% {
|
|
left: 25%;
|
|
width: 75%; }
|
|
|
|
75% {
|
|
left: 100%;
|
|
width: 0%; } }
|
|
|
|
@keyframes indeterminate1 {
|
|
0% {
|
|
left: 0%;
|
|
width: 0%; }
|
|
|
|
50% {
|
|
left: 25%;
|
|
width: 75%; }
|
|
|
|
75% {
|
|
left: 100%;
|
|
width: 0%; } }
|
|
|
|
@-webkit-keyframes indeterminate2 {
|
|
0% {
|
|
left: 0%;
|
|
width: 0%; }
|
|
|
|
50% {
|
|
left: 0%;
|
|
width: 0%; }
|
|
|
|
75% {
|
|
left: 0%;
|
|
width: 25%; }
|
|
|
|
100% {
|
|
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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-navigation {
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-flex-wrap: nowrap;
|
|
-ms-flex-wrap: nowrap;
|
|
flex-wrap: nowrap; }
|
|
|
|
.mdl-navigation__link {
|
|
color: rgb(66,66,66);
|
|
text-decoration: none;
|
|
font-weight: 700;
|
|
font-size: 14px;
|
|
margin: 0; }
|
|
|
|
.mdl-navigation__link:hover {
|
|
background-color: rgb(224,224,224); }
|
|
|
|
.mdl-layout {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-webkit-flex-direction: column;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
position: relative; }
|
|
|
|
.mdl-layout__container {
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%; }
|
|
|
|
.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;
|
|
box-sizing: border-box; }
|
|
|
|
.mdl-layout-spacer {
|
|
-webkit-box-flex: 1;
|
|
-webkit-flex-grow: 1;
|
|
-ms-flex-positive: 1;
|
|
flex-grow: 1; }
|
|
|
|
.mdl-layout__drawer {
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-webkit-flex-direction: column;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
-webkit-flex-wrap: nowrap;
|
|
-ms-flex-wrap: nowrap;
|
|
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);
|
|
-webkit-transform: translateX(-250px);
|
|
-ms-transform: translateX(-250px);
|
|
transform: translateX(-250px);
|
|
-webkit-transform-style: preserve-3d;
|
|
transform-style: preserve-3d;
|
|
will-change: transform;
|
|
-webkit-transition-duration: 0.2s;
|
|
transition-duration: 0.2s;
|
|
-webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
-webkit-transition-property: -webkit-transform;
|
|
transition-property: transform;
|
|
color: rgb(66,66,66);
|
|
overflow: visible;
|
|
z-index: 5; }
|
|
.mdl-layout__drawer.is-visible {
|
|
-webkit-transform: translateX(0);
|
|
-ms-transform: translateX(0);
|
|
transform: translateX(0); }
|
|
.mdl-layout__drawer > * {
|
|
-webkit-flex-shrink: 0;
|
|
-ms-flex-negative: 0;
|
|
flex-shrink: 0; }
|
|
.mdl-layout__drawer > .mdl-layout-title {
|
|
line-height: 64px;
|
|
padding-left: 24px; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__drawer > .mdl-layout-title {
|
|
line-height: 56px;
|
|
padding-left: 16px; } }
|
|
.mdl-layout__drawer .mdl-navigation {
|
|
width: 100%;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-webkit-flex-direction: column;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column; }
|
|
.mdl-layout__drawer .mdl-navigation__link {
|
|
padding: 16px 24px;
|
|
margin: 0; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__drawer .mdl-navigation__link {
|
|
padding: 16px 16px; } }
|
|
@media screen and (min-width: 851px) {
|
|
.mdl-layout--fixed-drawer > .mdl-layout__drawer {
|
|
-webkit-transform: translateX(0);
|
|
-ms-transform: translateX(0);
|
|
transform: translateX(0);
|
|
z-index: 3; } }
|
|
|
|
.mdl-layout__drawer-button {
|
|
display: block;
|
|
position: absolute;
|
|
height: 48px;
|
|
width: 48px;
|
|
border: 0;
|
|
-webkit-flex-shrink: 0;
|
|
-ms-flex-negative: 0;
|
|
flex-shrink: 0;
|
|
overflow: hidden;
|
|
text-align: center;
|
|
cursor: pointer;
|
|
font-size: 26px;
|
|
line-height: 50px;
|
|
font-family: Helvetica, Arial, sans-serif;
|
|
margin: 8px 12px;
|
|
top: 0;
|
|
left: 0;
|
|
color: rgb(255,255,255);
|
|
z-index: 4; }
|
|
.mdl-layout__drawer-button::after {
|
|
font-family: 'Material-Design-Iconic-Font';
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
content: "\f2a1"; }
|
|
.mdl-layout__header .mdl-layout__drawer-button {
|
|
position: absolute;
|
|
color: rgb(255,255,255);
|
|
background-color: inherit; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__header .mdl-layout__drawer-button {
|
|
margin: 4px; } }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__drawer-button {
|
|
margin: 4px;
|
|
color: rgba(0, 0, 0, 0.5); } }
|
|
@media screen and (min-width: 851px) {
|
|
.mdl-layout--fixed-drawer > .mdl-layout__drawer-button {
|
|
display: none; } }
|
|
|
|
.mdl-layout__header {
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-webkit-flex-direction: row;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
-webkit-flex-wrap: nowrap;
|
|
-ms-flex-wrap: nowrap;
|
|
flex-wrap: nowrap;
|
|
-webkit-box-align: center;
|
|
-webkit-align-items: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
margin: 0;
|
|
border: none;
|
|
height: 64px;
|
|
min-height: 64px;
|
|
background-color: rgb(55,71,79);
|
|
color: rgb(255,255,255);
|
|
z-index: 3;
|
|
-webkit-transition-duration: 0.2s;
|
|
transition-duration: 0.2s;
|
|
-webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
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);
|
|
-webkit-transition-property: min-height, box-shadow;
|
|
transition-property: min-height, box-shadow;
|
|
padding-left: 24px;
|
|
overflow: visible; }
|
|
.mdl-layout.has-drawer .mdl-layout__header {
|
|
padding-left: 72px; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__header {
|
|
height: 56px;
|
|
min-height: 56px;
|
|
padding-left: 16px; }
|
|
.mdl-layout.has-drawer .mdl-layout__header {
|
|
padding-left: 56px; } }
|
|
.mdl-layout--fixed-drawer:not(.is-small-screen) > .mdl-layout__header {
|
|
padding-left: 24px; }
|
|
.mdl-layout__header > .mdl-layout-icon {
|
|
margin-right: 24px;
|
|
left: 24px;
|
|
top: 16px;
|
|
height: 32px;
|
|
width: 32px;
|
|
overflow: hidden;
|
|
z-index: 3;
|
|
display: block; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__header > .mdl-layout-icon {
|
|
margin-right: 16px;
|
|
left: 16px;
|
|
top: 12px; } }
|
|
.mdl-layout.has-drawer .mdl-layout__header > .mdl-layout-icon {
|
|
display: none; }
|
|
.mdl-layout__header.is-compact {
|
|
min-height: 64px; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__header.is-compact {
|
|
min-height: 56px; } }
|
|
.mdl-layout__header > * {
|
|
-webkit-flex-shrink: 0;
|
|
-ms-flex-negative: 0;
|
|
flex-shrink: 0; }
|
|
.mdl-layout__header > *:last-child {
|
|
margin-right: 24px; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__header > *:last-child {
|
|
margin-right: 16px; } }
|
|
.mdl-layout__header > .mdl-navigation:last-child {
|
|
margin-right: 0; }
|
|
.mdl-layout__header .mdl-layout-title {
|
|
display: block; }
|
|
.mdl-layout__header .mdl-navigation {
|
|
margin: 0;
|
|
padding: 0;
|
|
height: 64px;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-webkit-flex-direction: row;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
-webkit-box-align: center;
|
|
-webkit-align-items: center;
|
|
-ms-flex-align: center;
|
|
align-items: center; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__header .mdl-navigation {
|
|
height: 56px; } }
|
|
.mdl-layout__header .mdl-navigation__link {
|
|
color: rgb(255,255,255);
|
|
line-height: 64px;
|
|
padding: 0 24px; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__header .mdl-navigation__link {
|
|
line-height: 56px;
|
|
padding: 0 16px; } }
|
|
.mdl-layout__header .mdl-navigation__link:hover {
|
|
background-color: rgba(97,97,97, 0.6); }
|
|
@media screen and (min-width: 851px) {
|
|
.mdl-layout--fixed-drawer > .mdl-layout__header {
|
|
margin-left: 240px; } }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__header {
|
|
display: none; }
|
|
.mdl-layout--fixed-header > .mdl-layout__header {
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex; } }
|
|
|
|
.mdl-layout__header--multi-row {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-webkit-flex-direction: column;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column; }
|
|
|
|
.mdl-layout__header--medium-tall {
|
|
min-height: 128px; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__header--medium-tall {
|
|
min-height: 112px; } }
|
|
|
|
.mdl-layout__header--tall {
|
|
min-height: 192px; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__header--tall {
|
|
min-height: 168px; } }
|
|
|
|
.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; }
|
|
.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-row.mdl-layout__header-row {
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-webkit-flex-direction: row;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
-webkit-flex-wrap: nowrap;
|
|
-ms-flex-wrap: nowrap;
|
|
flex-wrap: nowrap;
|
|
-webkit-flex-shrink: 0;
|
|
-ms-flex-negative: 0;
|
|
flex-shrink: 0;
|
|
-webkit-box-align: center;
|
|
-webkit-align-items: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
min-height: 64px;
|
|
width: 100%;
|
|
margin-right: 0; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__header-row.mdl-layout__header-row {
|
|
min-height: 56px; } }
|
|
.mdl-layout__header-row.mdl-layout__header-row > .mdl-layout-icon {
|
|
margin-right: 24px;
|
|
height: 32px;
|
|
width: 32px;
|
|
overflow: hidden;
|
|
display: block; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__header-row.mdl-layout__header-row > .mdl-layout-icon {
|
|
left: 16px;
|
|
top: 12px; } }
|
|
.mdl-layout.has-drawer .mdl-layout__header-row.mdl-layout__header-row > .mdl-layout-icon {
|
|
display: none; }
|
|
.mdl-layout__header-row.mdl-layout__header-row > * {
|
|
-webkit-flex-shrink: 0;
|
|
-ms-flex-negative: 0;
|
|
flex-shrink: 0; }
|
|
.mdl-layout__header-row.mdl-layout__header-row > *:last-child {
|
|
margin-right: 24px; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__header-row.mdl-layout__header-row > *:last-child {
|
|
margin-right: 16px; } }
|
|
.mdl-layout__header-row.mdl-layout__header-row > .mdl-navigation:last-child {
|
|
margin-right: 0; }
|
|
|
|
.mdl-layout__obfuscator {
|
|
background-color: transparent;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
height: 100%;
|
|
width: 100%;
|
|
z-index: 4;
|
|
visibility: hidden;
|
|
-webkit-transition-property: background-color;
|
|
transition-property: background-color;
|
|
-webkit-transition-duration: 0.2s;
|
|
transition-duration: 0.2s;
|
|
-webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
|
|
.mdl-layout__drawer.is-visible ~ .mdl-layout__obfuscator {
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|
visibility: visible; }
|
|
|
|
.mdl-layout__content {
|
|
-ms-flex: 0 1 auto;
|
|
display: inline-block;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
-webkit-box-flex: 1;
|
|
-webkit-flex-grow: 1;
|
|
-ms-flex-positive: 1;
|
|
flex-grow: 1;
|
|
z-index: 1; }
|
|
.mdl-layout--fixed-drawer > .mdl-layout__content {
|
|
margin-left: 240px; }
|
|
.mdl-layout__header--scroll ~ .mdl-layout__content {
|
|
overflow: visible; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout--fixed-drawer > .mdl-layout__content {
|
|
margin-left: 0; }
|
|
.mdl-layout__header--scroll ~ .mdl-layout__content {
|
|
overflow-y: auto;
|
|
overflow-x: hidden; } }
|
|
|
|
.mdl-layout__tab-bar {
|
|
position: absolute;
|
|
top: 0;
|
|
height: 96px;
|
|
width: calc(100% -
|
|
96px);
|
|
padding: 0 0 0 72px;
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
background-color: rgb(55,71,79);
|
|
overflow-y: hidden;
|
|
overflow-x: scroll; }
|
|
.mdl-layout__tab-bar::-webkit-scrollbar {
|
|
display: none; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__tab-bar {
|
|
width: calc(100% -
|
|
44px);
|
|
padding: 0 0 0 56px; } }
|
|
.mdl-layout--fixed-tabs .mdl-layout__tab-bar {
|
|
padding: 0;
|
|
overflow: hidden;
|
|
width: 100%; }
|
|
.mdl-layout__tab-bar.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__tab-bar-container {
|
|
position: relative;
|
|
overflow: hidden;
|
|
height: 48px;
|
|
width: 100%;
|
|
border: none;
|
|
margin: 0;
|
|
z-index: 3;
|
|
-webkit-box-flex: 0;
|
|
-webkit-flex-grow: 0;
|
|
-ms-flex-positive: 0;
|
|
flex-grow: 0;
|
|
-webkit-flex-shrink: 0;
|
|
-ms-flex-negative: 0;
|
|
flex-shrink: 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-layout__container > .mdl-layout__tab-bar-container {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0; }
|
|
|
|
.mdl-layout__tab-bar-button {
|
|
display: inline-block;
|
|
position: absolute;
|
|
height: 48px;
|
|
line-height: 48px;
|
|
width: 72px;
|
|
z-index: 4;
|
|
text-align: center;
|
|
background-color: rgb(55,71,79);
|
|
color: transparent;
|
|
cursor: pointer;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__tab-bar-button {
|
|
display: none;
|
|
width: 44px; } }
|
|
.mdl-layout--fixed-tabs .mdl-layout__tab-bar-button {
|
|
display: none; }
|
|
.mdl-layout__tab-bar-button.is-active {
|
|
color: rgb(255,255,255); }
|
|
|
|
.mdl-layout__tab-bar-left-button {
|
|
left: 0; }
|
|
.mdl-layout__tab-bar-left-button::after {
|
|
font-size: 26px;
|
|
font-family: 'Material-Design-Iconic-Font';
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
content: "\f29b"; }
|
|
|
|
.mdl-layout__tab-bar-right-button {
|
|
right: 0; }
|
|
.mdl-layout__tab-bar-right-button::after {
|
|
font-size: 26px;
|
|
font-family: 'Material-Design-Iconic-Font';
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
content: "\f29c"; }
|
|
|
|
.mdl-layout__tab {
|
|
margin: 0;
|
|
border: none;
|
|
padding: 0 24px 0 24px;
|
|
float: left;
|
|
position: relative;
|
|
display: block;
|
|
-webkit-box-flex: 0;
|
|
-webkit-flex-grow: 0;
|
|
-ms-flex-positive: 0;
|
|
flex-grow: 0;
|
|
-webkit-flex-shrink: 0;
|
|
-ms-flex-negative: 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(255,255,255, 0.6);
|
|
overflow: hidden; }
|
|
@media screen and (max-width: 850px) {
|
|
.mdl-layout__tab {
|
|
padding: 0 12px 0 12px; } }
|
|
.mdl-layout--fixed-tabs .mdl-layout__tab {
|
|
float: none;
|
|
-webkit-box-flex: 1;
|
|
-webkit-flex-grow: 1;
|
|
-ms-flex-positive: 1;
|
|
flex-grow: 1;
|
|
padding: 0; }
|
|
.mdl-layout.is-upgraded .mdl-layout__tab.is-active {
|
|
color: rgb(255,255,255); }
|
|
.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(0,172,193);
|
|
-webkit-animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) 0s alternate forwards;
|
|
-moz-animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) 0s alternate forwards;
|
|
-webkit-transition: all 1s cubic-bezier(0.4, 0, 1, 1);
|
|
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-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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-list {
|
|
display: block;
|
|
height: 500px;
|
|
overflow: scroll;
|
|
width: 400px; }
|
|
|
|
.mdl-list--styled-view {
|
|
background: rgb(255,255,255);
|
|
-webkit-transition: background 0.3s 0.1s;
|
|
transition: background 0.3s 0.1s;
|
|
z-index: 1; }
|
|
|
|
.mdl-list--styled-view ul {
|
|
display: inline;
|
|
list-style-type: none; }
|
|
|
|
.mdl-list--styled-view li {
|
|
border-bottom: 1px solid rgb(224,224,224);
|
|
height: 70px;
|
|
left: 0;
|
|
right: 0; }
|
|
|
|
.mdl-list--styled-view li:hover {
|
|
background: #efefef; }
|
|
|
|
.mdl-list-view--name {
|
|
-webkit-font-smoothing: antialiased;
|
|
font-smoothing: antialiased; }
|
|
|
|
.mdl-list-view--avatar {
|
|
background: rgb(224,224,224);
|
|
border-radius: 50%;
|
|
content: '';
|
|
display: inline-block;
|
|
height: 50px;
|
|
margin: 10px 15px;
|
|
vertical-align: middle;
|
|
width: 50px; }
|
|
|
|
.mdl-list--inline {
|
|
list-style: none;
|
|
margin-left: -5px;
|
|
padding-left: 0; }
|
|
|
|
.mdl-list--inline > li {
|
|
display: inline-block;
|
|
padding-left: 5px;
|
|
padding-right: 5px; }
|
|
|
|
/**
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-radio {
|
|
position: relative;
|
|
font-size: 16px;
|
|
line-height: 24px;
|
|
display: inline-block;
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
margin: 12px 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: 2px;
|
|
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(55,71,79); }
|
|
.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: 6px;
|
|
left: 4px;
|
|
box-sizing: border-box;
|
|
width: 8px;
|
|
height: 8px;
|
|
cursor: pointer;
|
|
-webkit-transition-duration: 0.28s;
|
|
transition-duration: 0.28s;
|
|
-webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
-webkit-transition-property: -webkit-transform;
|
|
transition-property: transform;
|
|
-webkit-transform: scale3d(0, 0, 0);
|
|
transform: scale3d(0, 0, 0);
|
|
border-radius: 50%;
|
|
background: rgb(55,71,79); }
|
|
.mdl-radio.is-checked .mdl-radio__inner-circle {
|
|
-webkit-transform: scale3d(1, 1, 1);
|
|
transform: scale3d(1, 1, 1); }
|
|
.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; }
|
|
.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(55,71,79); }
|
|
.mdl-radio.is-disabled .mdl-radio__ripple-container {
|
|
cursor: auto; }
|
|
.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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
_:-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;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
outline: 0;
|
|
padding: 0;
|
|
color: rgb(55,71,79);
|
|
-webkit-align-self: center;
|
|
-ms-flex-item-align: center;
|
|
align-self: center;
|
|
/**************************** 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(55,71,79) 16px, rgb(55,71,79) 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(55,71,79);
|
|
border: none;
|
|
-webkit-transition: -webkit-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);
|
|
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(55,71,79);
|
|
border: none; }
|
|
.mdl-slider.is-upgraded:focus:not(:active)::-webkit-slider-thumb {
|
|
box-shadow: 0 0 0 10px rgba(55,71,79, 0.26); }
|
|
.mdl-slider.is-upgraded:focus:not(:active)::-moz-range-thumb {
|
|
box-shadow: 0 0 0 10px rgba(55,71,79, 0.26); }
|
|
.mdl-slider.is-upgraded:active::-webkit-slider-thumb {
|
|
background-image: none;
|
|
background: rgb(55,71,79);
|
|
-webkit-transform: scale(1.5);
|
|
transform: scale(1.5); }
|
|
.mdl-slider.is-upgraded:active::-moz-range-thumb {
|
|
background-image: none;
|
|
background: rgb(55,71,79);
|
|
transform: scale(1.5); }
|
|
.mdl-slider.is-upgraded::-ms-thumb {
|
|
width: 32px;
|
|
height: 32px;
|
|
border: none;
|
|
border-radius: 50%;
|
|
background: rgb(55,71,79);
|
|
-ms-transform: scale(0.375);
|
|
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(55,71,79) 0%, rgb(55,71,79) 37.5%, rgba(55,71,79, 0.26) 37.5%, rgba(55,71,79, 0.26) 100%);
|
|
-ms-transform: scale(1);
|
|
transform: scale(1); }
|
|
.mdl-slider.is-upgraded:active::-ms-thumb {
|
|
background: rgb(55,71,79);
|
|
-ms-transform: scale(0.5625);
|
|
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 {
|
|
border: 1.8px solid rgba(0,0,0, 0.26);
|
|
-webkit-transform: scale(1.33);
|
|
transform: scale(1.33);
|
|
box-shadow: none; }
|
|
.mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-moz-range-thumb {
|
|
border: 1.8px solid rgba(0,0,0, 0.26);
|
|
transform: scale(1.33);
|
|
box-shadow: none; }
|
|
.mdl-slider.is-upgraded.is-lowest-value:focus:not(:active) ~ .mdl-slider__background-flex > .mdl-slider__background-upper {
|
|
left: 8px; }
|
|
.mdl-slider.is-upgraded.is-lowest-value:active::-webkit-slider-thumb {
|
|
border: 1.5px solid rgba(0,0,0, 0.26);
|
|
-webkit-transform: scale(1.5);
|
|
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 {
|
|
-ms-transform: scale(0.5);
|
|
transform: scale(0.5);
|
|
background: radial-gradient(circle closest-side, transparent 0%, transparent 75%, rgba(0,0,0, 0.26) 75%, rgba(0,0,0, 0.26) 100%); }
|
|
.mdl-slider.is-upgraded.is-lowest-value:active::-ms-thumb {
|
|
-ms-transform: scale(0.5625);
|
|
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:focus:not(:active)::-ms-fill-upper {
|
|
margin-left: 8px; }
|
|
.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 {
|
|
-webkit-transform: scale(0.667);
|
|
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;
|
|
-webkit-transform: scale(0.667);
|
|
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 {
|
|
-ms-transform: scale(0.25);
|
|
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 {
|
|
-ms-transform: scale(0.25);
|
|
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: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-webkit-flex-direction: row;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row; }
|
|
|
|
.mdl-slider__background-flex {
|
|
background: transparent;
|
|
position: absolute;
|
|
height: 2px;
|
|
width: calc(100% - 52px);
|
|
top: 50%;
|
|
left: 0;
|
|
margin: 0 26px;
|
|
z-index: -1;
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
overflow: hidden;
|
|
border: 0;
|
|
padding: 0;
|
|
-webkit-transform: translate(0, -1px);
|
|
-ms-transform: translate(0, -1px);
|
|
transform: translate(0, -1px); }
|
|
|
|
.mdl-slider__background-lower {
|
|
background: rgb(55,71,79);
|
|
-webkit-box-flex: 0;
|
|
-webkit-flex: 0;
|
|
-ms-flex: 0;
|
|
flex: 0;
|
|
position: relative;
|
|
border: 0;
|
|
padding: 0; }
|
|
|
|
.mdl-slider__background-upper {
|
|
background: rgba(0,0,0, 0.26);
|
|
-webkit-box-flex: 0;
|
|
-webkit-flex: 0;
|
|
-ms-flex: 0;
|
|
flex: 0;
|
|
position: relative;
|
|
border: 0;
|
|
padding: 0;
|
|
-webkit-transition: left 0.18s cubic-bezier(0.4, 0, 0.2, 1);
|
|
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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-spinner {
|
|
display: inline-block;
|
|
position: relative;
|
|
width: 28px;
|
|
height: 28px; }
|
|
.mdl-spinner:not(.is-upgraded):after {
|
|
content: "Loading..."; }
|
|
.mdl-spinner.is-upgraded.is-active {
|
|
-webkit-animation: mdl-spinner__container-rotate 1568.2352941176ms linear infinite;
|
|
animation: mdl-spinner__container-rotate 1568.2352941176ms linear infinite; }
|
|
|
|
@-webkit-keyframes mdl-spinner__container-rotate {
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg); } }
|
|
|
|
@keyframes mdl-spinner__container-rotate {
|
|
to {
|
|
-webkit-transform: rotate(360deg);
|
|
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(55,71,79); }
|
|
.mdl-spinner.is-active .mdl-spinner__layer-1 {
|
|
-webkit-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;
|
|
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(55,71,79); }
|
|
.mdl-spinner.is-active .mdl-spinner__layer-2 {
|
|
-webkit-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;
|
|
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(55,71,79); }
|
|
.mdl-spinner.is-active .mdl-spinner__layer-3 {
|
|
-webkit-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;
|
|
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(55,71,79); }
|
|
.mdl-spinner.is-active .mdl-spinner__layer-4 {
|
|
-webkit-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;
|
|
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; }
|
|
|
|
@-webkit-keyframes mdl-spinner__fill-unfill-rotate {
|
|
12.5% {
|
|
-webkit-transform: rotate(135deg);
|
|
transform: rotate(135deg); }
|
|
|
|
25% {
|
|
-webkit-transform: rotate(270deg);
|
|
transform: rotate(270deg); }
|
|
|
|
37.5% {
|
|
-webkit-transform: rotate(405deg);
|
|
transform: rotate(405deg); }
|
|
|
|
50% {
|
|
-webkit-transform: rotate(540deg);
|
|
transform: rotate(540deg); }
|
|
|
|
62.5% {
|
|
-webkit-transform: rotate(675deg);
|
|
transform: rotate(675deg); }
|
|
|
|
75% {
|
|
-webkit-transform: rotate(810deg);
|
|
transform: rotate(810deg); }
|
|
|
|
87.5% {
|
|
-webkit-transform: rotate(945deg);
|
|
transform: rotate(945deg); }
|
|
|
|
to {
|
|
-webkit-transform: rotate(1080deg);
|
|
transform: rotate(1080deg); } }
|
|
|
|
@keyframes mdl-spinner__fill-unfill-rotate {
|
|
12.5% {
|
|
-webkit-transform: rotate(135deg);
|
|
transform: rotate(135deg); }
|
|
|
|
25% {
|
|
-webkit-transform: rotate(270deg);
|
|
transform: rotate(270deg); }
|
|
|
|
37.5% {
|
|
-webkit-transform: rotate(405deg);
|
|
transform: rotate(405deg); }
|
|
|
|
50% {
|
|
-webkit-transform: rotate(540deg);
|
|
transform: rotate(540deg); }
|
|
|
|
62.5% {
|
|
-webkit-transform: rotate(675deg);
|
|
transform: rotate(675deg); }
|
|
|
|
75% {
|
|
-webkit-transform: rotate(810deg);
|
|
transform: rotate(810deg); }
|
|
|
|
87.5% {
|
|
-webkit-transform: rotate(945deg);
|
|
transform: rotate(945deg); }
|
|
|
|
to {
|
|
-webkit-transform: rotate(1080deg);
|
|
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
|
|
*/
|
|
@-webkit-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-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; } }
|
|
|
|
@-webkit-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-2-fade-in-out {
|
|
from {
|
|
opacity: 0; }
|
|
|
|
15% {
|
|
opacity: 0; }
|
|
|
|
25% {
|
|
opacity: 0.99; }
|
|
|
|
50% {
|
|
opacity: 0.99; }
|
|
|
|
51% {
|
|
opacity: 0; } }
|
|
|
|
@-webkit-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-3-fade-in-out {
|
|
from {
|
|
opacity: 0; }
|
|
|
|
40% {
|
|
opacity: 0; }
|
|
|
|
50% {
|
|
opacity: 0.99; }
|
|
|
|
75% {
|
|
opacity: 0.99; }
|
|
|
|
76% {
|
|
opacity: 0; } }
|
|
|
|
@-webkit-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; } }
|
|
|
|
@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__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%;
|
|
-webkit-animation: none;
|
|
animation: none;
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0; }
|
|
.mdl-spinner__left .mdl-spinner__circle {
|
|
border-right-color: transparent !important;
|
|
-webkit-transform: rotate(129deg);
|
|
-ms-transform: rotate(129deg);
|
|
transform: rotate(129deg); }
|
|
.mdl-spinner.is-active .mdl-spinner__left .mdl-spinner__circle {
|
|
-webkit-animation: mdl-spinner__left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
|
|
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;
|
|
-webkit-transform: rotate(-129deg);
|
|
-ms-transform: rotate(-129deg);
|
|
transform: rotate(-129deg); }
|
|
.mdl-spinner.is-active .mdl-spinner__right .mdl-spinner__circle {
|
|
-webkit-animation: mdl-spinner__right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
|
|
animation: mdl-spinner__right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; }
|
|
|
|
@-webkit-keyframes mdl-spinner__left-spin {
|
|
from {
|
|
-webkit-transform: rotate(130deg);
|
|
transform: rotate(130deg); }
|
|
|
|
50% {
|
|
-webkit-transform: rotate(-5deg);
|
|
transform: rotate(-5deg); }
|
|
|
|
to {
|
|
-webkit-transform: rotate(130deg);
|
|
transform: rotate(130deg); } }
|
|
|
|
@keyframes mdl-spinner__left-spin {
|
|
from {
|
|
-webkit-transform: rotate(130deg);
|
|
transform: rotate(130deg); }
|
|
|
|
50% {
|
|
-webkit-transform: rotate(-5deg);
|
|
transform: rotate(-5deg); }
|
|
|
|
to {
|
|
-webkit-transform: rotate(130deg);
|
|
transform: rotate(130deg); } }
|
|
|
|
@-webkit-keyframes mdl-spinner__right-spin {
|
|
from {
|
|
-webkit-transform: rotate(-130deg);
|
|
transform: rotate(-130deg); }
|
|
|
|
50% {
|
|
-webkit-transform: rotate(5deg);
|
|
transform: rotate(5deg); }
|
|
|
|
to {
|
|
-webkit-transform: rotate(-130deg);
|
|
transform: rotate(-130deg); } }
|
|
|
|
@keyframes mdl-spinner__right-spin {
|
|
from {
|
|
-webkit-transform: rotate(-130deg);
|
|
transform: rotate(-130deg); }
|
|
|
|
50% {
|
|
-webkit-transform: rotate(5deg);
|
|
transform: rotate(5deg); }
|
|
|
|
to {
|
|
-webkit-transform: rotate(-130deg);
|
|
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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-switch {
|
|
position: relative;
|
|
z-index: 1;
|
|
vertical-align: middle;
|
|
display: inline-block;
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
height: 24px;
|
|
margin: 12px 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(55,71,79, 0.5); }
|
|
.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);
|
|
-webkit-transition-duration: 0.28s;
|
|
transition-duration: 0.28s;
|
|
-webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
-webkit-transition-property: left;
|
|
transition-property: left; }
|
|
.mdl-switch.is-checked .mdl-switch__thumb {
|
|
background: rgb(55,71,79);
|
|
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.is-disabled .mdl-switch__thumb {
|
|
background: rgb(189,189,189);
|
|
cursor: auto; }
|
|
|
|
.mdl-switch__focus-helper {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
-webkit-transform: translate(-4px, -4px);
|
|
-ms-transform: translate(-4px, -4px);
|
|
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(55,71,79, 0.26);
|
|
background-color: rgba(55,71,79, 0.26); }
|
|
|
|
.mdl-switch__label {
|
|
position: relative;
|
|
cursor: pointer;
|
|
font-size: 16px;
|
|
line-height: 24px;
|
|
margin: 0;
|
|
left: 24px; }
|
|
.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);
|
|
-webkit-transition-duration: 0.4s;
|
|
transition-duration: 0.4s;
|
|
-webkit-transition-timing-function: step-end;
|
|
transition-timing-function: step-end;
|
|
-webkit-transition-property: left;
|
|
transition-property: left; }
|
|
.mdl-switch__ripple-container .mdl-ripple {
|
|
background: rgb(55,71,79); }
|
|
.mdl-switch.is-disabled .mdl-switch__ripple-container {
|
|
cursor: auto; }
|
|
.mdl-switch.is-disabled .mdl-switch__ripple-container .mdl-ripple {
|
|
background: transparent; }
|
|
.mdl-switch.is-checked .mdl-switch__ripple-container {
|
|
cursor: auto;
|
|
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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-tabs {
|
|
display: block;
|
|
width: 100%; }
|
|
|
|
.mdl-tabs__tab-bar {
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-orient: horizontal;
|
|
-webkit-box-direction: normal;
|
|
-webkit-flex-direction: row;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
-webkit-box-pack: center;
|
|
-webkit-justify-content: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
-webkit-align-content: space-between;
|
|
-ms-flex-line-pack: justify;
|
|
align-content: space-between;
|
|
-webkit-box-align: start;
|
|
-webkit-align-items: flex-start;
|
|
-ms-flex-align: start;
|
|
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;
|
|
color: red;
|
|
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(55,71,79);
|
|
-webkit-animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) 0s alternate forwards;
|
|
-moz-animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) 0s alternate forwards;
|
|
-webkit-transition: all 1s cubic-bezier(0.4, 0, 1, 1);
|
|
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(55,71,79); }
|
|
|
|
.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; }
|
|
|
|
@-webkit-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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-textfield {
|
|
position: relative;
|
|
font-size: 16px;
|
|
display: inline-block;
|
|
box-sizing: border-box;
|
|
width: 300px;
|
|
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__input {
|
|
border: none;
|
|
border-bottom: 1px solid rgba(0,0,0, 0.12);
|
|
display: block;
|
|
font-size: 16px;
|
|
margin: 0;
|
|
padding: 4px 0;
|
|
width: 100%;
|
|
background: 16px;
|
|
text-align: left;
|
|
color: inherit; }
|
|
.mdl-textfield.is-focused .mdl-textfield__input {
|
|
outline: none; }
|
|
.mdl-textfield.is-invalid .mdl-textfield__input {
|
|
border-color: rgb(229,57,53);
|
|
box-shadow: none; }
|
|
.mdl-textfield.is-disabled .mdl-textfield__input {
|
|
background-color: transparent;
|
|
border-bottom: 1px dotted rgba(0,0,0, 0.12); }
|
|
|
|
.mdl-textfield__label {
|
|
bottom: 0;
|
|
color: rgba(0,0,0, 0.26);
|
|
font-size: 16px;
|
|
left: 0;
|
|
right: 0;
|
|
pointer-events: none;
|
|
position: absolute;
|
|
top: 24px;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-align: left; }
|
|
.mdl-textfield.is-dirty .mdl-textfield__label {
|
|
visibility: hidden; }
|
|
.mdl-textfield--floating-label .mdl-textfield__label {
|
|
-webkit-transition-duration: 0.2s;
|
|
transition-duration: 0.2s;
|
|
-webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
|
|
.mdl-textfield--floating-label.is-focused .mdl-textfield__label, .mdl-textfield--floating-label.is-dirty .mdl-textfield__label {
|
|
color: rgb(55,71,79);
|
|
font-size: 12px;
|
|
top: 4px;
|
|
visibility: visible; }
|
|
.mdl-textfield--floating-label.is-invalid .mdl-textfield__label {
|
|
color: rgb(229,57,53);
|
|
font-size: 12px; }
|
|
.mdl-textfield__label:after {
|
|
background-color: rgb(55,71,79);
|
|
bottom: 20px;
|
|
content: '';
|
|
height: 2px;
|
|
left: 45%;
|
|
position: absolute;
|
|
-webkit-transition-duration: 0.2s;
|
|
transition-duration: 0.2s;
|
|
-webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
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(229,57,53); }
|
|
|
|
.mdl-textfield__error {
|
|
color: rgb(229,57,53);
|
|
position: absolute;
|
|
font-size: 12px;
|
|
margin-top: 3px;
|
|
visibility: hidden; }
|
|
.mdl-textfield.is-invalid .mdl-textfield__error {
|
|
visibility: visible; }
|
|
|
|
.mdl-textfield__expandable-holder {
|
|
display: inline-block;
|
|
position: relative;
|
|
margin-left: 32px;
|
|
-webkit-transition-duration: 0.2s;
|
|
transition-duration: 0.2s;
|
|
-webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
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.
|
|
*
|
|
* 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.
|
|
*/
|
|
/*------------------------------------*\
|
|
$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
|
|
*/
|
|
/* ========== 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
|
|
*
|
|
**/
|
|
/* ========== Color Palettes ========== */
|
|
/* colors.scss */
|
|
/* ========== Color & Themes ========== */
|
|
/* ========== Typography ========== */
|
|
/* ========== Components ========== */
|
|
/* ========== Standard Buttons ========== */
|
|
/* ========== Icon Toggles ========== */
|
|
/* ========== Radio Buttons ========== */
|
|
/* ========== Ripple effect ========== */
|
|
/* ========== Layout ========== */
|
|
/* ========== Content Tabs ========== */
|
|
/* ========== Checkboxes ========== */
|
|
/* ========== Switches ========== */
|
|
/* ========== Spinner ========== */
|
|
/* ========== Text fields ========== */
|
|
/* ========== Card ========== */
|
|
/* Heading back */
|
|
/* ========== Sliders ========== */
|
|
/* ========== Progress ========== */
|
|
/* ========== List ========== */
|
|
/* ========== Item ========== */
|
|
/* ========== Dropdown menu ========== */
|
|
/* ========== Tooltips ========== */
|
|
/* ========== Footer ========== */
|
|
/* TEXTFIELD */
|
|
/* SWITCH */
|
|
/* SPINNER */
|
|
/* RADIO */
|
|
/* MENU */
|
|
/* LIST */
|
|
/* ICONS */
|
|
/* ICON TOGGLE */
|
|
/* FOOTER */
|
|
/*mega-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/*mini-footer*/
|
|
/**************
|
|
*
|
|
* Sizes
|
|
*
|
|
*************/
|
|
/* COLUMN LAYOUT */
|
|
/* CHECKBOX */
|
|
/* CARD */
|
|
/* Card dimensions */
|
|
/* Cover image */
|
|
/* BUTTON */
|
|
/**
|
|
*
|
|
* Dimensions
|
|
*
|
|
*/
|
|
/* ANIMATION */
|
|
/* PROGRESS */
|
|
/* BADGE */
|
|
/* SHADOWS */
|
|
/* GRID */
|
|
.mdl-tooltip {
|
|
-webkit-transform: scale(0);
|
|
-ms-transform: scale(0);
|
|
transform: scale(0);
|
|
-webkit-transform-origin: top center;
|
|
-ms-transform-origin: top center;
|
|
transform-origin: top center;
|
|
background: rgba(0,0,0, 0.9);
|
|
border-radius: 2px;
|
|
color: rgb(255,255,255);
|
|
display: none;
|
|
font-size: 10px;
|
|
line-height: 14px;
|
|
max-width: 170px;
|
|
padding: 4px 8px;
|
|
position: absolute;
|
|
text-align: center; }
|
|
|
|
.mdl-tooltip.is-active {
|
|
display: inline-block;
|
|
-webkit-animation: pulse 200ms cubic-bezier(0, 0, 0.2, 1) forwards;
|
|
animation: pulse 200ms cubic-bezier(0, 0, 0.2, 1) forwards; }
|
|
|
|
.mdl-tooltip--large {
|
|
line-height: 14px;
|
|
font-size: 14px;
|
|
padding: 15px 16px; }
|
|
|
|
@-webkit-keyframes pulse {
|
|
0% {
|
|
-webkit-transform: scale(0);
|
|
transform: scale(0);
|
|
opacity: 0; }
|
|
|
|
50% {
|
|
-webkit-transform: scale(0.99);
|
|
transform: scale(0.99); }
|
|
|
|
100% {
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1);
|
|
opacity: 1;
|
|
visibility: visible; } }
|
|
|
|
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;
|
|
-webkit-transition: opacity 0.6s ease;
|
|
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); }
|
|
|