├── .gitignore
├── 404.html
├── Gruntfile.js
├── LICENSE
├── README.md
├── css
└── material.css
├── demo-files
├── avatar.jpg
├── card-hero.jpg
├── demo.css
├── demo.js
└── sidemenu-hero.jpg
├── dist
├── material.min.css
└── material.min.js
├── fonts
├── material-design-icons.eot
├── material-design-icons.svg
├── material-design-icons.ttf
└── material-design-icons.woff
├── img
├── avatar.jpg
└── sidemenu-hero.jpg
├── index.html
├── js
└── material.js
└── package.json
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules
2 | .DS_Store
3 |
--------------------------------------------------------------------------------
/404.html:
--------------------------------------------------------------------------------
1 | ---
2 | layout: base
3 | title: "404 - File Not Found"
4 | permalink: /404.html
5 | ---
6 |
7 |
8 |
We could not find that page
9 |
10 | Please check that the link you used is correct.
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/Gruntfile.js:
--------------------------------------------------------------------------------
1 | module.exports = function(grunt) {
2 | grunt.initConfig({
3 | pkg: grunt.file.readJSON("package.json"),
4 | clean: {
5 | dist: ["dist"]
6 | },
7 | copy: {
8 | js: {
9 | files: [
10 | {
11 | expand: true,
12 | cwd: "js/",
13 | src: "**.js",
14 | dest: "dist/",
15 | flatten: true,
16 | filter: "isFile"
17 | }
18 | ]
19 | },
20 | css: {
21 | files: [
22 | {
23 | expand: true,
24 | cwd: "css/",
25 | src: "**.css",
26 | dest: "dist/",
27 | flatten: true,
28 | filter: "isFile"
29 | }
30 | ]
31 | }
32 | },
33 | autoprefixer: {
34 | main: {
35 | expand: true,
36 | cwd: "dist/",
37 | src: "**/*.css",
38 | dest: "dist/",
39 | options: {
40 | browsers: [
41 | "Chrome > 21",
42 | "Firefox > 29",
43 | "IE > 9",
44 | "Safari > 6"
45 | ],
46 | cascade: false
47 | }
48 | },
49 | uncompressed: {
50 | expand: true,
51 | cwd: "css/",
52 | src: "**/*.css",
53 | dest: "css/",
54 | options: {
55 | browsers: [
56 | "Chrome > 21",
57 | "Firefox > 29",
58 | "IE > 9",
59 | "Safari > 6"
60 | ],
61 | cascade: false
62 | }
63 | }
64 | },
65 | uglify: {
66 | main: {
67 | options: {
68 | banner: "/******* Material Framework by Tim Nguyen ********/" +
69 | "\n" +
70 | "/** https://github.com/nt1m/material-framework/ **/\n"
71 | },
72 | files: [
73 | {
74 | expand: true,
75 | cwd: "dist/",
76 | src: "**.js",
77 | dest: "dist/",
78 | }
79 | ]
80 | }
81 | },
82 | cssmin: {
83 | main: {
84 | options: {
85 | banner: "/******* Material Framework by Tim Nguyen ********/" +
86 | "\n" +
87 | "/** https://github.com/nt1m/material-framework/ **/"
88 | },
89 | files: [
90 | {
91 | expand: true,
92 | cwd: "dist/",
93 | src: "**.css",
94 | dest: "dist/",
95 | }
96 | ]
97 | }
98 | },
99 | rename: {
100 | main: {
101 | files: [
102 | {src: ["dist/material.css"], dest: "dist/material.min.css"},
103 | {src: ["dist/material.js"], dest: "dist/material.min.js"}
104 | ]
105 | }
106 | }
107 | });
108 | var npmTasksToLoad = [
109 | "grunt-autoprefixer",
110 | "grunt-contrib-cssmin",
111 | "grunt-contrib-clean",
112 | "grunt-contrib-copy",
113 | "grunt-contrib-uglify",
114 | "grunt-contrib-rename"
115 | ];
116 | npmTasksToLoad.forEach(function(taskName) {
117 | grunt.loadNpmTasks(taskName);
118 | });
119 | grunt.registerTask("autoprefix", ["autoprefixer:uncompressed"]);
120 | grunt.registerTask("dist", ["clean:dist", "copy:js", "copy:css", "uglify:main", "autoprefixer:main", "cssmin:main", "rename:main"]);
121 | };
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | Copyright 2016 Tim Nguyen
2 |
3 | Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
4 |
5 | The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
6 |
7 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
8 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | Material framework
2 | ==================
3 |
4 | This is a CSS only Material design based framework.
5 |
6 | Demo : http://nt1m.github.io/material-framework
7 |
8 | # Usage
9 | Just include material.css on any web page/ web app.
10 | You can also get a minified version by running `grunt dist`, the minified code will appear in the `dist` folder.
11 |
12 | # Resources used
13 | - [Material Colors](https://github.com/shuhei/material-colors/)
14 | - [Material design icons](https://github.com/google/material-design-icons/)
15 | - [Fontello](http://fontello.com) (to generate icon font)
16 |
17 | # Contributing
18 | Pull requests :) or Issues if you can't :)
19 |
20 | ## Guidelines
21 | - Tab indenting
22 | - Space after "," (rgba(0, 0, 0, 0.2) for example)
23 | - Lowercase hex colors or rgba for alpha transparency
24 |
--------------------------------------------------------------------------------
/demo-files/avatar.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/nt1m/material-framework/c68b0a4d60b812a761ade21b744756e546e2c6ae/demo-files/avatar.jpg
--------------------------------------------------------------------------------
/demo-files/card-hero.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/nt1m/material-framework/c68b0a4d60b812a761ade21b744756e546e2c6ae/demo-files/card-hero.jpg
--------------------------------------------------------------------------------
/demo-files/demo.css:
--------------------------------------------------------------------------------
1 | #navigation-sidemenu {
2 | max-width: 22em;
3 | }
4 | #navigation-sidemenu .sidemenu-hero h1 {
5 | font-size: 25px;
6 | margin-top: 10px;
7 | }
8 | #navigation-sidemenu .sidemenu-hero {
9 | height: 70px;
10 | }
11 | #navigation-sidemenu .sidemenu-hero-image {
12 | margin-top: -100px;
13 | }
14 | /* Sections */
15 | .navigation-section {
16 | background-color: inherit;
17 | }
18 | .navigation-section:not(:target) {
19 | display: none;
20 | }
21 | p > code {
22 | padding: 0 0.5em;
23 | color: #E91E63;
24 | }
25 |
26 | /* Header positioning */
27 | .header {
28 | margin: 0;
29 | height: auto;
30 | position: -webkit-sticky;
31 | position: sticky;
32 | top: 0;
33 | z-index: 998;
34 | }
35 |
36 | /* Header toolbar tweaks */
37 | #switch-container {
38 | margin-top: 14px;
39 | margin-right: 100px;
40 | }
41 | .phone #switch-container {
42 | margin-top: 8px;
43 | }
44 | #external-fab-container {
45 | position: absolute;
46 | right: 20px;
47 | top: 25px;
48 | }
49 | .phone .header #switch-container {
50 | position: absolute;
51 | right: -50px;
52 | top: 10px;
53 | background-color: #2196F3;
54 | padding-left: 20px;
55 | padding-right: 50px;
56 | border-left: 1px solid rgba(255,255,255,0.2)
57 | }
58 |
59 | /* Color palette */
60 | .color-palette {
61 | color: rgba(255, 255, 255, 0.87);
62 | font-size: 14px;
63 | font-weight: 500;
64 | text-align: center;
65 | }
66 | .color-group {
67 | display: inline-block;
68 | width: 24%;
69 | min-width: 140px;
70 | vertical-align: top;
71 | text-align: left;
72 | }
73 | .phone .color-group {
74 | width: 100%;
75 | }
76 | .color-group ul {
77 | list-style: none;
78 | padding: 0;
79 | margin-right: 3%;
80 | }
81 | .color-palette .dark {
82 | color: rgba(0, 0, 0, 0.87);
83 | }
84 | .color-palette .color-group li.color, .color-palette .color-group:last-child li.color {
85 | padding: 15px;
86 | }
87 | .color-palette .color-group li.main-color, .color-palette .color-group:last-child li.main-color {
88 | border-bottom: 4px solid #F9F9F9;
89 | }
90 | .color-palette .color-group li.main-color .name, .color-palette .color-group:last-child li.main-color .name {
91 | display: block;
92 | margin-bottom: 60px;
93 | }
94 | .color-palette .color-group li.color .hex, .color-palette .color-group:last-child li.color .hex {
95 | float: right;
96 | text-transform: uppercase;
97 | }
98 |
99 | /* Code demos */
100 | code {
101 | white-space: pre-wrap;
102 | -moz-tab-size: 4;
103 | tab-size: 4;
104 | }
105 | code .tag {
106 | color: #E91E63; /* Pink - 500 */
107 | }
108 | code .atn {
109 | color: #FF9800; /* Orange - 500 */
110 | }
111 | code .pun {
112 | color: #9E9E9E; /* Gray - 500 */
113 | }
114 | code .atv {
115 | color: #03A9F4; /* Light Blue - 500 */
116 | }
117 | code .kwd,
118 | code .pln {
119 | color: inherit;
120 | }
121 | code .str {
122 | color: #4CAF50; /* Green - 500 */
123 | }
124 | code .typ,
125 | code .lit {
126 | color: #26A69A; /* Teal - 400 */
127 | }
128 |
129 | code .com {
130 | color: #607d8b /* Blue Gray - 500 */
131 | }
132 | /* Specific demo rules */
133 |
134 | .card-demo {
135 | padding: 1rem;
136 | }
137 | .card-demo .card {
138 | margin-bottom: 50px;
139 | height: 100px;
140 | }
141 |
142 | /* Add spacing around items */
143 | .section > .checkbox, .section > .radio, .section > .button, .section > .switch, .section > .fab {
144 | margin: 10px;
145 | }
146 | .toolbar-group {
147 | margin: 10px 0;
148 | }
149 |
150 | /* Icon font display */
151 | #icons-demo {
152 | text-align: center;
153 | }
154 | .row {
155 | display: inline-block;
156 | width: 20%;
157 | margin-right: 2%;
158 | margin-left: 2%;
159 | min-width: 275px;
160 | text-align: left;
161 | }
162 | .row .i-code {
163 | float: right;
164 | color: gray;
165 | }
166 | .row i[class^="icon-"] {
167 | font-size: 1.5em;
168 | }
169 |
--------------------------------------------------------------------------------
/demo-files/demo.js:
--------------------------------------------------------------------------------
1 | "use strict";
2 | function init() {
3 | var sm = document.getElementById("navigation-sidemenu"),
4 | smitems = sm.querySelectorAll(".menu > li:not(.divider) > a");
5 |
6 | function clickHandler() {
7 | return function() {
8 | if (Responsive.device != "desktop") {
9 | SideMenu.hide(sm);
10 | }
11 | for (var ind = 0; ind < smitems.length; ind++) {
12 | smitems[ind].parentNode.className = "";
13 | }
14 | this.parentNode.className = "selected color-blue-500";
15 | document.querySelector(".main-content").scrollTop = 0;
16 | };
17 | }
18 |
19 | for (var i = 0, len = smitems.length; i < len; i++) {
20 | smitems[i].addEventListener("click", clickHandler());
21 | }
22 | }
23 |
24 | function DialogDemoCallback(button) {
25 | var ourButton = (button.className.indexOf("dialog-confirm") > -1) ? "Accept" : "Decline";
26 | alert(ourButton + " was pressed!");
27 | }
28 |
29 | window.addEventListener("DOMContentLoaded", function() {
30 | var md = new Material();
31 | if ((window.location.hash === "") || (document.querySelector(".navigation-section" + window.location.hash) === null)) {
32 | window.location.hash = "#introduction";
33 | }
34 | document.querySelector("#navigation-sidemenu a[href='" + window.location.hash + "']").parentNode.className = "selected color-blue-500";
35 | init();
36 | });
37 |
--------------------------------------------------------------------------------
/demo-files/sidemenu-hero.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/nt1m/material-framework/c68b0a4d60b812a761ade21b744756e546e2c6ae/demo-files/sidemenu-hero.jpg
--------------------------------------------------------------------------------
/dist/material.min.css:
--------------------------------------------------------------------------------
1 | /******* Material Framework by Tim Nguyen ********/
2 | /** https://github.com/nt1m/material-framework/ **/
3 | @import url(//fonts.googleapis.com/css?family=RobotoDraft:400,500,300,300italic,400italic,500italic|Roboto+Slab:400,700&subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic);body{margin:0;padding:0;font-family:RobotoDraft,Roboto,Arial,sans-serif;background-color:#fff;color:rgba(0,0,0,.87)}.dark-theme{background-color:#333;color:rgba(255,255,255,.87)}:focus{outline:0}::-moz-focus-inner{border:none;padding:0}*{-webkit-overflow-scrolling:touch;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent}.float-left{float:left}.float-right{float:right}.flex{-webkit-flex:1;-ms-flex:1;flex:1}.button,.checkbox,.fab,.radio,.switch,.text-input{display:inline-block;vertical-align:top;border:0}.main-content{overflow:auto;height:100vh;background-color:inherit}.section{padding:1.25rem;background-color:inherit;border-bottom:1px solid rgba(0,0,0,.12)}.section>.subheading,.section>h2{top:-1.25rem}.section>.divider{margin-top:1.5rem}.subheading,h2{padding:0 0 0 1em;margin:0;font-size:1em;line-height:3em;top:0;font-weight:400}.secondary-text,.subheading,h2{color:rgba(0,0,0,.54)}h3{font-size:.93em;line-height:1.5em;color:rgba(0,0,0,.7);margin-top:1.5em;margin-bottom:1.5em;padding-left:2em}p{font-size:.8125em}.phone p{font-size:.875em}.caption,.display-1,.display-2,.display-3,.display-4,.headline,.title,h1,h2,h3,p{-webkit-transition-property:color,font-size;transition-property:color,font-size;-webkit-transition-duration:.25s;transition-duration:.25s;-webkit-transition-timing-function:cubic-bezier(.55,0,.1,1);transition-timing-function:cubic-bezier(.55,0,.1,1);font-weight:400}.display-4{font-size:7em;font-weight:300}.display-3{font-size:3.5em}.display-2{font-size:2.8125em}.display-1,h1{font-size:2.125em}.headline{font-size:1.5em}.title{font-size:1.25em;font-weight:500}.caption{font-size:.75em}blockquote,blockquote+cite,blockquote::after,blockquote::before{color:rgba(0,0,0,.87)}.dark-theme .secondary-text,.dark-theme .subheading,.dark-theme h2,.dark-theme h3{color:rgba(255,255,255,.54)}.dark-theme blockquote,.dark-theme blockquote+cite,.dark-theme blockquote::after,.dark-theme blockquote::before{color:rgba(255,2550,255,.87)}a{color:#2196f3;text-decoration:none;cursor:pointer}a:focus,a:hover{text-decoration:underline}p{line-height:1.5em;text-align:justify}blockquote{float:right;width:50%;min-width:320px;font-weight:500;font-size:1.5em;line-height:2em}blockquote::after,blockquote::before{font-size:1.5em;line-height:1em;font-weight:300;font-family:inherit}blockquote::before{content:open-quote}blockquote::after{content:close-quote}blockquote+cite{float:right;width:50%;min-width:320px;padding:.5em;margin-left:4em}.bold{font-weight:500}.transparent{background:0 0;box-shadow:none}.serif{font-family:"Roboto Slab",Cambria,serif}code{font-family:Consolas,Menlo,monospace;display:inline-block;padding:1em;font-size:.875em;line-height:1.5em;font-weight:400}.ripple,[ripple]{position:relative;display:inline-block;overflow:hidden}.button::after,.fab::after,.ripple::after,[ripple]::after{content:"";position:absolute;top:0;left:44%;background-color:currentColor;height:100%;width:12%;border-radius:.75em/2em;-webkit-transition:width .2s,height .2s,border-radius .2s,left .2s,top .2s,opacity .1s;transition:width .2s,height .2s,border-radius .2s,left .2s,top .2s,opacity .1s;text-align:center;pointer-events:none;opacity:0}.fab::after,.ripple.circle::after,[ripple=circle]::after{width:10%;height:10%;top:50%;border-radius:100%!important}.button:active::after,.fab:active::after,.ripple:active::after,.sidemenu .menu li.selected::after,[ripple]:active::after{width:100%!important;left:0;top:0!important;height:100%!important;opacity:.12;border-radius:0!important}.sidemenu .menu li.selected::after{color:rgba(0,0,0,.87)}.dark-theme .sidemenu .menu li.selected::after{color:#fff}.no-ripple::after,[ripple=false]::after,[ripple=none]::after{all:unset;display:none}.button,.checkbox,.fab,.icon-button,.radio,.switch{cursor:pointer;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}.checkbox label,.radio label,.switch label{vertical-align:middle}.checkbox .form-control-label,.radio .form-control-label,.switch .form-control-label{margin-left:.5em}.checkbox input[type=checkbox],.radio input[type=radio],.switch input{display:none}.checkbox input[type=checkbox]+label,.radio input[type=radio]+label{border-radius:100%;width:1em;height:1em;display:inline-block;background:0 0;-webkit-transition:all .2s;transition:all .2s;position:relative;box-shadow:0 0 0 transparent;color:#4caf50}.radio input[type=radio]+label:active{box-shadow:0 0 0 .55em rgba(204,204,204,.29);background:rgba(204,204,204,.29)}.radio input[type=radio]:checked+label:active,.switch input:checked+label:active::after{box-shadow:0 0 0 .55em rgba(15,157,88,.29);background:rgba(15,157,88,.29)}.checkbox input[type=checkbox]+label{border-radius:.1em;border-style:solid;border-width:.15em;border-color:#5a5a5a;cursor:pointer;display:inline-block;height:1em;margin-left:0;margin-top:0;visibility:visible;width:1em}.dark-theme input[type=checkbox]+label{border-color:rgba(255,255,255,.87)}.checkbox input[type=checkbox]+label::before{content:"";margin-left:-.15em;margin-top:-.15em;position:absolute;top:0;left:0;width:-webkit-calc(100% + 0.3em);width:calc(100% + 0.3em);height:-webkit-calc(100% + 0.3em);height:calc(100% + 0.3em);border-radius:.1em;-webkit-transition:-webkit-transform .2s,background .1s;transition:transform .2s,background .1s;-webkit-transform:scale(0.1);transform:scale(0.1)}.checkbox input[type=checkbox]:checked+label::before{background-color:currentColor;opacity:1;-webkit-transform:none;transform:none}.checkbox input[type=checkbox]+label::after{content:" ";border-style:solid;border-width:0 0 .15em .15em;border-color:transparent;cursor:pointer;height:.4em;left:50%;margin-left:-.4em;margin-top:-.4em;position:absolute;top:50%;width:.7em;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.checkbox input[type=checkbox]:checked+label::after{border-color:rgba(255,255,255,.87)}.checkbox input[type=checkbox]:disabled+label{color:#999}.radio input[type=radio]+label::after,.radio input[type=radio]+label::before{content:"";border:.125em solid #5a5a5a;width:1em;height:1em;margin-left:-.12em;margin-top:-.12em;display:inline-block;position:relative}.dark-theme input[type=radio]+label::after{border-color:rgba(255,255,255,.87)}.radio input[type=radio]+label::after{border-radius:100%;width:1em;height:1em}.radio input[type=radio]+label::before{position:absolute;top:.3em;left:.3em;border-radius:100%;width:.65em;height:.65em;border:none;background:#0f9d58;-webkit-transform:scale(0);transform:scale(0);-webkit-transition:all .2s;transition:all .2s}.radio input[type=radio]:checked+label::before{-webkit-transform:none;transform:none}.radio input[type=radio]:checked+label::after{border-color:#0f9d58}.switch input+label{position:relative}.switch input+label::before{content:"";height:.7em;width:1.8em;border-radius:1.2em;background-color:#b0afaf;display:inline-block;position:relative;top:.28em;vertical-align:top}.switch input:checked+label::before{background-color:#b9e3cf}.switch input+label::after{content:"";position:absolute;display:inline-block;width:1em;height:1em;border-radius:50%;box-shadow:0 2px 5px 0 rgba(0,0,0,.26),0 2px 10px 0 rgba(0,0,0,.16);box-sizing:border-box;left:-.2em;top:.05em;background-color:#f1f1f1;-webkit-transition:box-shadow .2s ease,-webkit-transform .08s linear;transition:box-shadow .2s ease,transform .08s linear;vertical-align:top}.switch input:checked+label::after{background-color:#0f9d58!important;border:none;-webkit-transform:translateX(1.3125em);transform:translateX(1.3125em);width:1.125em;height:1.125em;margin-top:-1px}.switch input+label:active::after{box-shadow:0 0 0 .55em rgba(204,204,204,.8)}.dark-theme .switch input:checked+label::after{-webkit-filter:brightness(110%);filter:brightness(110%)}.dropdown-menu,.text-input{padding:1em 0 .5em;height:1em;box-sizing:content-box;border:none;border-radius:0;border-bottom:1px solid #2196f3;background-color:inherit;-webkit-transition:border-color .3s;transition:border-color .3s;color:inherit;font-family:inherit;font-size:1em;font-weight:400}.dropdown-menu{padding:.5em 2em .5em 0;height:1.45em;background-image:url('data:image/svg+xml,');background-repeat:no-repeat;background-size:.5em .25em;background-position:right .25em center;-moz-appearance:none;-webkit-appearance:none}.dark-theme .dropdown-menu{background-image:url('data:image/svg+xml,')}.dropdown-menu.active,.dropdown-menu:focus{border-bottom-width:2px;padding-bottom:-webkit-calc(0.5em - 1px);padding-bottom:calc(0.5em - 1px)}.dropdown{position:relative}.dropdown .dropdown-menu:not(.active):not(:focus)+.menu{padding:0!important;visibility:hidden;-webkit-transform:translate(-50%,-50%) scale(0);transform:translate(-50%,-50%) scale(0)}.dropdown .dropdown-menu:not(.active):not(:focus)+.menu li{max-height:0;opacity:0}.dropdown .dropdown-menu:not(.active):not(:focus)+.menu li a{padding-top:0;padding-bottom:0}.dropdown .menu{position:absolute;left:0;top:0}.dropdown-menu:not(:focus):not(.active),.text-input:not(:focus){border-bottom-color:rgba(0,0,0,.12)!important}.dark-theme .dropdown-menu:not(:focus):not(.active),.dark-theme .text-input:not(:focus){border-bottom-color:rgba(255,255,255,.12)!important}.text-input:focus{border-bottom-width:2px;padding-bottom:-webkit-calc(0.5em - 1px);padding-bottom:calc(0.5em - 1px)}.text-input-container.card{border-radius:2px;overflow:hidden}.text-input-container.card .text-input-icon{padding-top:.5em}.text-input-container.card .text-input{border:none;padding-top:.875rem!important;padding-bottom:.875rem!important;font-size:1.25rem}.text-input-container{display:inline-block}.text-input-container *{vertical-align:middle;float:left}.text-input-icon{display:inline-block;font-size:1.5em;padding:.5em;margin-right:.667em}.text-input-container:not([focused]) .text-input-icon{opacity:.63}.button,.fab{position:relative;border:none;text-transform:uppercase;text-decoration:none!important;padding:.5em .75em;font-size:.875em;font-weight:500;font-family:inherit;border-radius:2px;overflow:hidden;-webkit-transition:all .1s;transition:all .1s;text-align:center}.button:not(.raised){background:none!important}.button:not(.raised):not([class^=color-]):not([class*=" color-"]){color:inherit}.button.raised,.fab{box-shadow:0 2px 5px 0 rgba(0,0,0,.26),0 2px 10px 0 rgba(0,0,0,.16)}.button.raised:not([class*=bg-]),.fab{background-color:#dfdfdf}.button.raised:active,.fab:active{box-shadow:0 8px 17px 0 rgba(0,0,0,.2),0 6px 20px 0 rgba(0,0,0,.19)}.button:disabled{background:#eaeaea!important;color:#a8a8a8!important;box-shadow:none!important;pointer-events:none}.button i{font-size:1.5em;height:1em;margin-right:.5em;vertical-align:middle}.fab{background-color:#fff;width:2.33em;height:2.33em;border-radius:100%;font-size:1.5em;font-family:inherit;font-weight:400;text-transform:none;box-sizing:border-box;color:#000;padding:.5em .417em}.fab.small{width:1.67em;height:1.67em;line-height:23px;padding:.33em}.fab [class*=" icon-"]:not(.icon-button)::before,.fab [class^=icon-]:not(.icon-button)::before{vertical-align:top}.slider{-webkit-appearance:none;-moz-appearance:none;color:#5677fc}.slider::-moz-range-track{-moz-appearance:none;height:2px;background-color:#c8c8c8;border:none}.slider::-webkit-slider-runnable-track{height:2px;background-color:#c8c8c8;border:none}.slider::-moz-range-progress{background-color:currentColor;height:2px}.slider::-moz-range-thumb{width:12px;height:12px;box-sizing:border-box;border-radius:50%;border:none;background-image:none;background-color:currentColor;transition:all .2s ease}.slider:active::-moz-range-thumb{transform:scale(2.66)}.slider::-webkit-slider-thumb{-webkit-appearance:none;width:.75em;height:.75em;box-sizing:border-box;border-radius:50%;border:none;background-image:none;background-color:currentColor;-webkit-transition:all .2s ease;transition:all .2s ease;margin-top:-.375em}.slider:active::-webkit-slider-thumb{-webkit-transform:scale(2.66);transform:scale(2.66);margin-top:-.65em}.slider::-ms-fill-lower,.slider::-ms-fill-upper{background:0 0}.slider::-ms-track{width:.75em;height:.75em;box-sizing:border-box;border-radius:50%;border:none;background-image:none;background-color:currentColor;transition:all .2s ease}.slider::-ms-thumb{width:.75em;height:.75em;box-sizing:border-box;border-radius:50%;border:none;background-image:none;background-color:currentColor;transition:all .2s ease}.icon-button{width:2em;height:2em;border-radius:100%;border:none;background-color:transparent;-webkit-transition:background .3s ease;transition:background .3s ease;padding:.025em;color:inherit;font:inherit;font-size:1.5em}.icon-button:active{background-color:rgba(210,210,210,.3)}.toolbar-group{box-shadow:0 2px 5px 0 rgba(0,0,0,.26),0 2px 10px 0 rgba(0,0,0,.16)}.toolbar-group .toolbar{box-shadow:none}.toolbar{display:block;padding:.5rem .75rem;box-shadow:0 2px 5px 0 rgba(0,0,0,.26),0 2px 10px 0 rgba(0,0,0,.16);background-color:#fff;-webkit-transition:all .2s;transition:all .2s}.phone .toolbar:not(.tabs){padding:.25rem}.toolbar>:not(sub):not(sup){vertical-align:middle}.toolbar-label{margin:0 1rem;font-size:1.25rem;font-weight:400}.toolbar-group.hide,.toolbar.hide{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}.navbar{display:block;margin:0;padding:0;list-style:none;line-height:3.125em;height:3.125em;text-transform:uppercase}.navbar li{margin:0;padding:0}.navbar a{display:inline-block;height:100%;color:inherit;text-decoration:none;line-height:3.125em;padding:0 1em}.navbar .fab{margin:.66em}.tabs{display:-webkit-flex;display:-ms-flexbox;display:flex;padding:0;height:3rem;margin:0}.tabs>li{-webkit-flex:1;-ms-flex:1;flex:1;line-height:3rem;display:inline-block;box-sizing:border-box;margin:0;padding:0;white-space:nowrap;font-size:.875em;font-weight:500;text-transform:uppercase;text-align:center}.tabs>li:not(.selected){opacity:.6}.tabs>li.selected{border-bottom:2px solid currentColor}.tabs>li>a{display:block;width:100%;color:inherit;text-decoration:none}.tabs i{font-size:1.5rem}.toast{-webkit-transition-property:opacity,bottom,left,right,width,margin,border-radius;transition-property:opacity,bottom,left,right,width,margin,border-radius;-webkit-transition-duration:.5s;transition-duration:.5s;-webkit-transition-timing-function:ease;transition-timing-function:ease;font-size:.875em;min-height:.875em;background-color:#323232;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-ms-flex-align:center;align-items:center;color:#f1f1f1;box-shadow:0 2px 5px 0 rgba(0,0,0,.26);line-height:1.57em;border-radius:2px;overflow:hidden}.toast.rounded{border-radius:1.5em}.toast-label{-webkit-flex:1;-ms-flex:1;flex:1;padding:.75em 1.5em}.toast .button{margin:0;-ms-flex-item-align:stretch;-webkit-align-self:stretch;align-self:stretch;font-size:inherit}.list{margin:0;padding:0;list-style:none}.grid-list>.tile>.tile-footer,.list>li{margin:0;padding:.2em .4em;display:-webkit-flex;display:-ms-flexbox;display:flex}.list>li.divider{background-color:rgba(0,0,0,.12);height:1px;padding:0;box-sizing:border-box}.list>li .item-icon{border-radius:100%;height:2.5em;width:2.5em;vertical-align:top;margin-right:1em;position:relative}.list>li .item-icon>i{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);font-size:1.5em}.grid-list>.tile>.tile-footer>.item-text,.list>li .item-text{font-size:1em;display:inline-block;vertical-align:top;-webkit-flex:1;-ms-flex:1;flex:1;-ms-flex-item-align:center;-webkit-align-self:center;align-self:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.grid-list >.tile>.tile-footer .secondary-text,.list>li .secondary-text{font-size:.875em;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.list>li .item-action{height:2.5em;width:2.5em;font-size:1.5em;line-height:2.5em;display:inline-block;text-align:center;margin-left:1em}.list>li .item-action:first-child{margin-left:0}.grid-list>.tile>.tile-footer i::before,.list>li i::before{line-height:inherit!important}.grid-list>.tile{width:11em;margin:.25em;display:inline-block}.grid-list>.tile>.tile-image{height:11em;width:100%;display:inline-block}.grid-list>.tile>.tile-footer,.grid-list>.tile>.tile-footer>.item-text{padding:.5em}.grid-list>.tile>.tile-footer .item-action{font-size:1.5em;padding:.5em}.divider{margin:0;padding:0;display:block;width:100%;height:1px!important;border-top:1px solid rgba(0,0,0,.12)}.dark-theme .divider{border-top-color:rgba(255,255,255,.12)}.menu{display:inline-block;list-style:none;background-color:#fff;color:rgba(0,0,0,.87);box-shadow:0 2px 5px 0 rgba(0,0,0,.26),0 2px 10px 0 rgba(0,0,0,.16);margin:0;padding:0;border-radius:2px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;min-width:100px;-webkit-transition:all .2s;transition:all .2s}.dark-theme .menu{background-color:#444;color:rgba(255,255,255,.87)}.menu li{height:2em;line-height:2em;width:100%;box-sizing:border-box;vertical-align:top;-webkit-transition:all .2s;transition:all .2s;max-height:3em;display:list-item}.menu li>a{display:block;padding:0 1.5em;text-decoration:none;color:inherit;-webkit-transform:all .2s;transform:all .2s}.dialog-overlay,.overlay{display:block;position:fixed;top:0;bottom:0;left:0;right:0;background-color:rgba(0,0,0,.5);z-index:1;-webkit-transition:background .2s;transition:background .2s}.dialog-overlay{z-index:1000}.dialog-overlay[hidden],.overlay[hidden]{display:block;z-index:-1;opacity:0;visibility:hidden}.dialog:not(.inline)[hidden]{display:block;opacity:0;pointer-events:none;z-index:-1;-webkit-transform:translate(-50%,-100%);transform:translate(-50%,-100%);-webkit-transition:opacity .3s,-webkit-transform .5s,z-index 0s .4s;transition:opacity .3s,transform .5s,z-index 0s .4s}.dialog{padding:1.5em 1.5em .5em;z-index:1001;overflow:auto;-webkit-transition:opacity .3s,-webkit-transform .5s;transition:opacity .3s,transform .5s;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.dialog:not(.inline){position:fixed;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);max-height:80%}.phone .dialog:not(.inline),.tablet .dialog:not(.inline){min-width:80%}.dialog-title{font-size:1.4em;font-weight:500;margin-top:0}.dialog-content{display:block;-webkit-flex:1;-ms-flex:1;flex:1;padding-bottom:1em;overflow:auto;color:rgba(0,0,0,.54)}.dark-theme .dialog-content{color:rgba(255,255,255,.54)}.dialog-content p{color:inherit}.dialog-footer{height:3em}.sidemenu{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;position:fixed;top:0;left:0;height:100vh;width:80%;max-width:25em;background:#fff;box-shadow:0 2px 5px 0 rgba(0,0,0,.26),0 2px 10px 0 rgba(0,0,0,.16);-webkit-transition:.75s margin-left,.2s box-shadow;transition:.75s margin-left,.2s box-shadow;overflow:auto;z-index:999}.desktop .sidemenu.sidebar{position:relative;display:inline-block;float:left;z-index:998}.dark-theme .sidemenu{background:#444}.sidemenu[hidden]{margin-left:-100%;box-shadow:none;display:-webkit-flex;display:-ms-flexbox;display:flex}.sidemenu .sidemenu-hero{width:100%;position:relative;padding:1em 0;overflow:hidden}.sidemenu .sidemenu-hero .sidemenu-hero-image{position:absolute;top:0;left:0;width:100%;z-index:-1}.sidemenu .sidemenu-hero .avatar{width:6em;height:6em;border-radius:50%;margin:2em 1em .5em;z-index:1;position:relative}.sidemenu .sidemenu-hero .title{display:block;font-size:.875em;font-weight:500;color:#fff;z-index:1;padding:.375em 1em;position:relative}.sidemenu .sidemenu-hero .text{width:-webkit-calc(100% - 2em);width:calc(100% - 2em);color:#fff;z-index:1;display:block;padding:0 1em;position:relative}.sidemenu-hero.fade::before{content:"";height:100%;width:100%;position:absolute;top:0;background:-webkit-linear-gradient(transparent 70%,rgba(0,0,0,.25) 90%,rgba(0,0,0,.4));background:linear-gradient(transparent 70%,rgba(0,0,0,.25) 90%,rgba(0,0,0,.4));z-index:0}.sidemenu .menu i{padding:0 2rem 0 0;font-size:1.5em}.sidemenu .menu li:not(.selected) i{opacity:.63}.sidemenu .menu .subheading,.sidemenu .menu h2{padding-left:1em}.sidemenu .menu{box-shadow:none;width:100%;display:block;overflow:visible;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.sidemenu .menu li{line-height:3em;height:auto;vertical-align:top}.sidemenu .menu li>a{padding:0 1em}.card-container{background-color:#e5e5e5}.dark-theme .card-container{background-color:#222}.card,.dialog{background-color:#fff}.dark-theme .card,.dark-theme .dialog{background-color:#444}.card{box-shadow:0 2px 5px 0 rgba(0,0,0,.26),0 2px 10px 0 rgba(0,0,0,.16)}.card[z="2"]{box-shadow:0 8px 17px 0 rgba(0,0,0,.2),0 6px 20px 0 rgba(0,0,0,.19)}.card[z="3"],.dialog{box-shadow:0 12px 15px 0 rgba(0,0,0,.24),0 17px 50px 0 rgba(0,0,0,.19)}.card[z="4"]{box-shadow:0 16px 28px 0 rgba(0,0,0,.22),0 25px 55px 0 rgba(0,0,0,.21)}.card[z="5"]{box-shadow:0 27px 24px 0 rgba(0,0,0,.2),0 40px 77px 0 rgba(0,0,0,.22)}.rich-card{display:inline-block}.card-hero{background-position:center;color:rgba(255,255,255,.87);position:relative}.card-hero h1{font-family:"Roboto Slab",Cambria,serif;font-size:1.5em;position:absolute;bottom:.5rem;left:.5rem}.card-hero:not(.side){height:10em;width:100%;background-size:100% auto}.card-hero.side{height:100%;background-size:auto 100%}.card-content,.card-footer{padding:.5em}.card-footer .icon-button{margin-top:-.5em}@font-face{font-family:material-design-icons;src:url(../fonts/material-design-icons.eot?43132195);src:url(../fonts/material-design-icons.eot?43132195#iefix) format('embedded-opentype'),url(../fonts/material-design-icons.woff?43132195) format('woff'),url(../fonts/material-design-icons.ttf?43132195) format('truetype'),url(../fonts/material-design-icons.svg?43132195#material-design-icons) format('svg');font-weight:400;font-style:normal}[class*=" icon-"]:not(.icon-button),[class^=icon-]:not(.icon-button){height:1em;display:inline-block;vertical-align:middle}[class*=" icon-"]:not(.icon-button)::before,[class^=icon-]:not(.icon-button)::before{font-family:material-design-icons;font-style:normal;font-weight:400;speak:none;display:inline-block;text-decoration:inherit;width:1em;height:1em;text-align:center;font-variant:normal;text-transform:none;line-height:1em;vertical-align:top}.icon-access-alarms:before{content:'\e800'}.icon-access-time:before{content:'\e801'}.icon-accessibility:before{content:'\e802'}.icon-account-box:before{content:'\e803'}.icon-account-circle:before{content:'\e804'}.icon-adb:before{content:'\e805'}.icon-add:before{content:'\e806'}.icon-add-alarm:before{content:'\e807'}.icon-add-box:before{content:'\e808'}.icon-add-circle:before{content:'\e809'}.icon-add-circle-outline:before{content:'\e80a'}.icon-airplane-mode-off:before{content:'\e80b'}.icon-airplane-mode:before{content:'\e80c'}.icon-android:before{content:'\e80d'}.icon-apps:before{content:'\e80e'}.icon-archive:before{content:'\e80f'}.icon-arrow-back:before{content:'\e810'}.icon-arrow-drop-down:before{content:'\e811'}.icon-arrow-drop-down-circle:before{content:'\e812'}.icon-arrow-drop-up:before{content:'\e813'}.icon-arrow-forward:before{content:'\e814'}.icon-auto-fix:before{content:'\e815'}.icon-backspace:before{content:'\e816'}.icon-backup:before{content:'\e817'}.icon-beenhere:before{content:'\e818'}.icon-block:before{content:'\e819'}.icon-bluetooth:before{content:'\e81a'}.icon-bluetooth-audio:before{content:'\e81b'}.icon-bluetooth-connected:before{content:'\e81c'}.icon-bluetooth-disabled:before{content:'\e81d'}.icon-bluetooth-searching:before{content:'\e81e'}.icon-bold:before{content:'\e81f'}.icon-book:before{content:'\e820'}.icon-bookmark:before{content:'\e821'}.icon-bookmark-outline:before{content:'\e822'}.icon-brightness-auto:before{content:'\e823'}.icon-brightness-high:before{content:'\e824'}.icon-brightness-low:before{content:'\e825'}.icon-brightness-medium:before{content:'\e826'}.icon-bug-report:before{content:'\e827'}.icon-cake:before{content:'\e828'}.icon-call:before{content:'\e829'}.icon-call-end:before{content:'\e82a'}.icon-call-made:before{content:'\e82b'}.icon-call-merge:before{content:'\e82c'}.icon-call-missed:before{content:'\e82d'}.icon-call-received:before{content:'\e82e'}.icon-call-split:before{content:'\e82f'}.icon-camera:before{content:'\e830'}.icon-camera-alt:before{content:'\e831'}.icon-camera-roll:before{content:'\e832'}.icon-cancel:before{content:'\e833'}.icon-cast:before{content:'\e834'}.icon-cast-connected:before{content:'\e835'}.icon-chat:before{content:'\e836'}.icon-check:before{content:'\e837'}.icon-checkbox:before{content:'\e838'}.icon-checkbox-blank:before{content:'\e839'}.icon-checkbox-outline:before{content:'\e83a'}.icon-checkbox-outline-blank:before{content:'\e83b'}.icon-check-circle:before{content:'\e83c'}.icon-check-circle-blank:before{content:'\e83d'}.icon-check-circle-outline:before{content:'\e83e'}.icon-check-circle-outline-blank:before{content:'\e83f'}.icon-chevron-left:before{content:'\e840'}.icon-chevron-right:before{content:'\e841'}.icon-chromecast:before{content:'\e842'}.icon-circles:before{content:'\e843'}.icon-circles-add:before{content:'\e844'}.icon-circles-extended:before{content:'\e845'}.icon-close:before{content:'\e846'}.icon-close-caption:before{content:'\e847'}.icon-cloud:before{content:'\e848'}.icon-cloud-drive:before{content:'\e849'}.icon-cloud-done:before{content:'\e84a'}.icon-cloud-download:before{content:'\e84b'}.icon-cloud-off:before{content:'\e84c'}.icon-cloud-queue:before{content:'\e84d'}.icon-cloud-upload:before{content:'\e84e'}.icon-communities:before{content:'\e84f'}.icon-content-copy:before{content:'\e850'}.icon-content-cut:before{content:'\e851'}.icon-content-paste:before{content:'\e852'}.icon-create:before{content:'\e853'}.icon-credit-card:before{content:'\e854'}.icon-crop:before{content:'\e855'}.icon-crop-free:before{content:'\e856'}.icon-crop-landscape:before{content:'\e857'}.icon-crop-portrait:before{content:'\e858'}.icon-crop-square:before{content:'\e859'}.icon-data-usage:before{content:'\e85a'}.icon-delete:before{content:'\e85b'}.icon-developer-mode:before{content:'\e85c'}.icon-dialpad:before{content:'\e85d'}.icon-directions:before{content:'\e85e'}.icon-directions-bike:before{content:'\e85f'}.icon-directions-bus:before{content:'\e860'}.icon-directions-car:before{content:'\e861'}.icon-directions-subway:before{content:'\e862'}.icon-directions-train:before{content:'\e863'}.icon-directions-walk:before{content:'\e864'}.icon-disc-full:before{content:'\e865'}.icon-do-not-disturb:before{content:'\e866'}.icon-dock:before{content:'\e867'}.icon-domain:before{content:'\e868'}.icon-done:before{content:'\e869'}.icon-done-all:before{content:'\e86a'}.icon-drafts:before{content:'\e86b'}.icon-drive:before{content:'\e86c'}.icon-drive-apk:before{content:'\e86d'}.icon-drive-audio:before{content:'\e86e'}.icon-drive-code:before{content:'\e86f'}.icon-drive-document:before{content:'\e870'}.icon-drive-drawing:before{content:'\e871'}.icon-drive-eta:before{content:'\e872'}.icon-drive-font:before{content:'\e873'}.icon-drive-form:before{content:'\e874'}.icon-drive-fusiontable:before{content:'\e875'}.icon-drive-image:before{content:'\e876'}.icon-drive-ms-excel:before{content:'\e877'}.icon-drive-ms-powerpoint:before{content:'\e878'}.icon-drive-ms-word:before{content:'\e879'}.icon-drive-pdf:before{content:'\e87a'}.icon-drive-presentation:before{content:'\e87b'}.icon-drive-script:before{content:'\e87c'}.icon-drive-site:before{content:'\e87d'}.icon-drive-spreadsheet:before{content:'\e87e'}.icon-drive-video:before{content:'\e87f'}.icon-drive-zip:before{content:'\e880'}.icon-earth:before{content:'\e881'}.icon-email:before{content:'\e882'}.icon-error:before{content:'\e883'}.icon-event:before{content:'\e884'}.icon-exit-to-app:before{content:'\e885'}.icon-expand-less:before{content:'\e886'}.icon-expand-more:before{content:'\e887'}.icon-explore:before{content:'\e888'}.icon-extensions:before{content:'\e889'}.icon-fast-forward:before{content:'\e88a'}.icon-fast-rewind:before{content:'\e88b'}.icon-favorite:before{content:'\e88c'}.icon-favorite-outline:before{content:'\e88d'}.icon-file-download:before{content:'\e88e'}.icon-file-upload:before{content:'\e88f'}.icon-filter:before{content:'\e890'}.icon-flag:before{content:'\e891'}.icon-flash-auto:before{content:'\e892'}.icon-flash-off:before{content:'\e893'}.icon-flash-on:before{content:'\e894'}.icon-flights:before{content:'\e895'}.icon-flip-to-back:before{content:'\e896'}.icon-flip-to-front:before{content:'\e897'}.icon-folder:before{content:'\e898'}.icon-folder-mydrive:before{content:'\e899'}.icon-folder-shared:before{content:'\e89a'}.icon-forum:before{content:'\e89b'}.icon-forward:before{content:'\e89c'}.icon-fullscreen:before{content:'\e89d'}.icon-fullscreen-exit:before{content:'\e89e'}.icon-games:before{content:'\e89f'}.icon-gesture:before{content:'\e8a0'}.icon-glass:before{content:'\e8a1'}.icon-gmail:before{content:'\e8a2'}.icon-google:before{content:'\e8a3'}.icon-google-plus:before{content:'\e8a4'}.icon-gps-fixed:before{content:'\e8a5'}.icon-gps-not-fixed:before{content:'\e8a6'}.icon-gps-off:before{content:'\e8a7'}.icon-group:before{content:'\e8a8'}.icon-group-add:before{content:'\e8a9'}.icon-hangout:before{content:'\e8aa'}.icon-hangout-video:before{content:'\e8ab'}.icon-hangout-video-off:before{content:'\e8ac'}.icon-headset:before{content:'\e8ad'}.icon-headset-mic:before{content:'\e8ae'}.icon-help:before{content:'\e8af'}.icon-high-quality:before{content:'\e8b0'}.icon-history:before{content:'\e8b1'}.icon-home:before{content:'\e8b2'}.icon-hotel:before{content:'\e8b3'}.icon-https:before{content:'\e8b4'}.icon-image:before{content:'\e8b5'}.icon-import-export:before{content:'\e8b6'}.icon-inbox:before{content:'\e8b7'}.icon-info:before{content:'\e8b8'}.icon-info-outline:before{content:'\e8b9'}.icon-invert-colors:before{content:'\e8ba'}.icon-italics:before{content:'\e8bb'}.icon-keep:before{content:'\e8bc'}.icon-keyboard:before{content:'\e8bd'}.icon-keyboard-alt:before{content:'\e8be'}.icon-keyboard-arrow-down:before{content:'\e8bf'}.icon-keyboard-arrow-left:before{content:'\e8c0'}.icon-keyboard-arrow-right:before{content:'\e8c1'}.icon-keyboard-arrow-up:before{content:'\e8c2'}.icon-keyboard-backspace:before{content:'\e8c3'}.icon-keyboard-capslock:before{content:'\e8c4'}.icon-keyboard-control:before{content:'\e8c5'}.icon-keyboard-hide:before{content:'\e8c6'}.icon-keyboard-return:before{content:'\e8c7'}.icon-keyboard-tab:before{content:'\e8c8'}.icon-keyboard-voice:before{content:'\e8c9'}.icon-label:before{content:'\e8ca'}.icon-label-outline:before{content:'\e8cb'}.icon-landscape:before{content:'\e8cc'}.icon-language:before{content:'\e8cd'}.icon-laptop:before{content:'\e8ce'}.icon-launch:before{content:'\e8cf'}.icon-link:before{content:'\e8d0'}.icon-list:before{content:'\e8d1'}.icon-live-help:before{content:'\e8d2'}.icon-location:before{content:'\e8d3'}.icon-location-city:before{content:'\e8d4'}.icon-location-disabled:before{content:'\e8d5'}.icon-location-searching:before{content:'\e8d6'}.icon-lock:before{content:'\e8d7'}.icon-lock-open:before{content:'\e8d8'}.icon-lock-outline:before{content:'\e8d9'}.icon-loop:before{content:'\e8da'}.icon-mail:before{content:'\e8db'}.icon-map:before{content:'\e8dc'}.icon-mark-unread:before{content:'\e8dd'}.icon-memory:before{content:'\e8de'}.icon-menu:before{content:'\e8df'}.icon-message:before{content:'\e8e0'}.icon-messenger:before{content:'\e8e1'}.icon-mic:before{content:'\e8e2'}.icon-mic-outline:before{content:'\e8e3'}.icon-mic-off:before{content:'\e8e4'}.icon-mms:before{content:'\e8e5'}.icon-mood:before{content:'\e8e6'}.icon-more:before{content:'\e8e7'}.icon-more-horizontal:before{content:'\e8e8'}.icon-more-vertical:before{content:'\e8e9'}.icon-mouse:before{content:'\e8ea'}.icon-movie:before{content:'\e8eb'}.icon-nest-protect:before{content:'\e8ec'}.icon-nest-thermostat:before{content:'\e8ed'}.icon-network-cell:before{content:'\e8ee'}.icon-network-wifi:before{content:'\e8ef'}.icon-news:before{content:'\e8f0'}.icon-nfc:before{content:'\e8f1'}.icon-notifications:before{content:'\e8f2'}.icon-notifications-none:before{content:'\e8f3'}.icon-notifications-off:before{content:'\e8f4'}.icon-notifications-on:before{content:'\e8f5'}.icon-notifications-paused:before{content:'\e8f6'}.icon-pages:before{content:'\e8f7'}.icon-palette:before{content:'\e8f8'}.icon-panorama:before{content:'\e8f9'}.icon-party-mode:before{content:'\e8fa'}.icon-pause:before{content:'\e8fb'}.icon-pause-circle-fill:before{content:'\e8fc'}.icon-pause-circle-outline:before{content:'\e8fd'}.icon-people:before{content:'\e8fe'}.icon-person:before{content:'\e8ff'}.icon-person-add:before{content:'\e900'}.icon-person-location:before{content:'\e901'}.icon-person-outline:before{content:'\e902'}.icon-phone:before{content:'\e903'}.icon-phone-alt:before{content:'\e904'}.icon-phone-bluetooth-speaker:before{content:'\e905'}.icon-phone-forwarded:before{content:'\e906'}.icon-phone-in-talk:before{content:'\e907'}.icon-phone-locked:before{content:'\e908'}.icon-phone-missed:before{content:'\e909'}.icon-phone-paused:before{content:'\e90a'}.icon-photo:before{content:'\e90b'}.icon-photo-album:before{content:'\e90c'}.icon-photo-library:before{content:'\e90d'}.icon-place:before{content:'\e90e'}.icon-play:before{content:'\e90f'}.icon-play-circle-fill:before{content:'\e910'}.icon-play-circle-outline:before{content:'\e911'}.icon-play-download:before{content:'\e912'}.icon-play-install:before{content:'\e913'}.icon-plus-one:before{content:'\e914'}.icon-poll:before{content:'\e915'}.icon-polymer:before{content:'\e916'}.icon-portrait:before{content:'\e917'}.icon-post-blogger:before{content:'\e918'}.icon-post-facebook:before{content:'\e919'}.icon-post-gplus:before{content:'\e91a'}.icon-post-instagram:before{content:'\e91b'}.icon-post-linkedin:before{content:'\e91c'}.icon-post-pinterest:before{content:'\e91d'}.icon-post-tumblr:before{content:'\e91e'}.icon-post-twitter:before{content:'\e91f'}.icon-print:before{content:'\e920'}.icon-public:before{content:'\e921'}.icon-queue:before{content:'\e922'}.icon-radio-button-off:before{content:'\e923'}.icon-radio-button-on:before{content:'\e924'}.icon-receipt:before{content:'\e925'}.icon-refresh:before{content:'\e926'}.icon-reminder:before{content:'\e927'}.icon-remove:before{content:'\e928'}.icon-remove-circle:before{content:'\e929'}.icon-remove-circle-outline:before{content:'\e92a'}.icon-replay:before{content:'\e92b'}.icon-reply:before{content:'\e92c'}.icon-reply-all:before{content:'\e92d'}.icon-report:before{content:'\e92e'}.icon-ring-volume:before{content:'\e92f'}.icon-rotate-left:before{content:'\e930'}.icon-rotate-right:before{content:'\e931'}.icon-satellite-alt:before{content:'\e932'}.icon-save:before{content:'\e933'}.icon-schedule:before{content:'\e934'}.icon-school:before{content:'\e935'}.icon-screen-lock-landscape:before{content:'\e936'}.icon-screen-lock-portrait:before{content:'\e937'}.icon-screen-lock-rotation:before{content:'\e938'}.icon-screen-rotation:before{content:'\e939'}.icon-sd-card:before{content:'\e93a'}.icon-search:before{content:'\e93b'}.icon-select-all:before{content:'\e93c'}.icon-send:before{content:'\e93d'}.icon-settings:before{content:'\e93e'}.icon-settings-application:before{content:'\e93f'}.icon-settings-bluetooth:before{content:'\e940'}.icon-settings-cell:before{content:'\e941'}.icon-settings-phone:before{content:'\e942'}.icon-settings-power:before{content:'\e943'}.icon-settings-voice:before{content:'\e944'}.icon-share:before{content:'\e945'}.icon-share-alt:before{content:'\e946'}.icon-shopping-basket:before{content:'\e947'}.icon-shopping-cart:before{content:'\e948'}.icon-shuffle:before{content:'\e949'}.icon-signal-cellular-1-bar:before{content:'\e94a'}.icon-signal-cellular-2-bar:before{content:'\e94b'}.icon-signal-cellular-3-bar:before{content:'\e94c'}.icon-signal-cellular-4-bar:before{content:'\e94d'}.icon-signal-wifi-1-bar:before{content:'\e94e'}.icon-signal-wifi-2-bar:before{content:'\e94f'}.icon-signal-wifi-3-bar:before{content:'\e950'}.icon-signal-wifi-4-bar:before{content:'\e951'}.icon-sim-card-alert:before{content:'\e952'}.icon-skip-next:before{content:'\e953'}.icon-skip-previous:before{content:'\e954'}.icon-slideshow:before{content:'\e955'}.icon-sms:before{content:'\e956'}.icon-sms-failed:before{content:'\e957'}.icon-sort:before{content:'\e958'}.icon-speaker:before{content:'\e959'}.icon-star:before{content:'\e95a'}.icon-star-half:before{content:'\e95b'}.icon-star-outline:before{content:'\e95c'}.icon-star-rate:before{content:'\e95d'}.icon-stop:before{content:'\e95e'}.icon-storage:before{content:'\e95f'}.icon-store:before{content:'\e960'}.icon-swap-driving-apps:before{content:'\e961'}.icon-swap-vertical:before{content:'\e962'}.icon-swap-vertical-circle:before{content:'\e963'}.icon-switch-camera:before{content:'\e964'}.icon-switch-video:before{content:'\e965'}.icon-sync:before{content:'\e966'}.icon-sync-disabled:before{content:'\e967'}.icon-sync-green:before{content:'\e968'}.icon-sync-problem:before{content:'\e969'}.icon-system-update:before{content:'\e96a'}.icon-tab:before{content:'\e96b'}.icon-tab-unselected:before{content:'\e96c'}.icon-tablet:before{content:'\e96d'}.icon-tag-faces:before{content:'\e96e'}.icon-tap-and-play:before{content:'\e96f'}.icon-terrain:before{content:'\e970'}.icon-text-format:before{content:'\e971'}.icon-text-sms:before{content:'\e972'}.icon-theaters:before{content:'\e973'}.icon-thumbs-down:before{content:'\e974'}.icon-thumbs-up:before{content:'\e975'}.icon-time-to-leave:before{content:'\e976'}.icon-timelapse:before{content:'\e977'}.icon-timer:before{content:'\e978'}.icon-today:before{content:'\e979'}.icon-traffic:before{content:'\e97a'}.icon-translate-alt:before{content:'\e97b'}.icon-tv:before{content:'\e97c'}.icon-underline:before{content:'\e97d'}.icon-undo:before{content:'\e97e'}.icon-unfold-less:before{content:'\e97f'}.icon-unfold-more:before{content:'\e980'}.icon-exposure:before{content:'\e981'}.icon-control-point:before{content:'\e982'}.icon-image-aspect-ratio:before{content:'\e983'}.icon-glyph-399:before{content:'\e984'}.icon-glyph-400:before{content:'\e985'}.icon-usb:before{content:'\e986'}.icon-vibration:before{content:'\e987'}.icon-video-youtube:before{content:'\e988'}.icon-videocam:before{content:'\e989'}.icon-videocam-off:before{content:'\e98a'}.icon-view-array:before{content:'\e98b'}.icon-view-column:before{content:'\e98c'}.icon-view-headline:before{content:'\e98d'}.icon-view-list:before{content:'\e98e'}.icon-view-module:before{content:'\e98f'}.icon-view-quilt:before{content:'\e990'}.icon-view-stream:before{content:'\e991'}.icon-visibility:before{content:'\e992'}.icon-visibility-off:before{content:'\e993'}.icon-voice:before{content:'\e994'}.icon-voicemail:before{content:'\e995'}.icon-volume-down:before{content:'\e996'}.icon-volume-mute:before{content:'\e997'}.icon-volume-off:before{content:'\e998'}.icon-volume-up:before{content:'\e999'}.icon-vpn:before{content:'\e99a'}.icon-warning:before{content:'\e99b'}.icon-watch:before{content:'\e99c'}.icon-wb-auto:before{content:'\e99d'}.icon-wb-cloudy:before{content:'\e99e'}.icon-wb-incandescent:before{content:'\e99f'}.icon-wb-irradescent:before{content:'\e9a0'}.icon-wb-sunny:before{content:'\e9a1'}.icon-web:before{content:'\e9a2'}.icon-whatshot:before{content:'\e9a3'}.icon-wifi-tethering:before{content:'\e9a4'}.icon-work:before{content:'\e9a5'}.icon-attachment:before{content:'\e9a6'}.icon-money:before{content:'\e9a7'}.icon-border-all:before{content:'\e9a8'}.icon-border-bottom:before{content:'\e9a9'}.icon-border-clear:before{content:'\e9aa'}.icon-border-color:before{content:'\e9ab'}.icon-border-horizontal:before{content:'\e9ac'}.icon-border-inner:before{content:'\e9ad'}.icon-border-left:before{content:'\e9ae'}.icon-border-outer:before{content:'\e9af'}.icon-border-right:before{content:'\e9b0'}.icon-border-style:before{content:'\e9b1'}.icon-border-top:before{content:'\e9b2'}.icon-border-vertical:before{content:'\e9b3'}.icon-align-center:before{content:'\e9b4'}.icon-align-justify:before{content:'\e9b5'}.icon-align-left:before{content:'\e9b6'}.icon-align-right:before{content:'\e9b7'}.icon-format-clear:before{content:'\e9b8'}.icon-format-color-fill:before{content:'\e9b9'}.icon-format-color-reset:before{content:'\e9ba'}.icon-format-color-text:before{content:'\e9bb'}.icon-format-indent-decrease:before{content:'\e9bc'}.icon-format-indent-increase:before{content:'\e9bd'}.icon-format-line-spacing:before{content:'\e9be'}.icon-format-list-bullet:before{content:'\e9bf'}.icon-format-list-number:before{content:'\e9c0'}.icon-format-paint:before{content:'\e9c1'}.icon-quote:before{content:'\e9c2'}.icon-format-size:before{content:'\e9c3'}.icon-strikethrough:before{content:'\e9c4'}.icon-format-text-direction-ltr:before{content:'\e9c5'}.icon-format-text-direction-rtl:before{content:'\e9c6'}.icon-functions:before{content:'\e9c7'}.icon-chart:before{content:'\e9c8'}.icon-comment:before{content:'\e9c9'}.icon-drive-file:before{content:'\e9ca'}.icon-emoticon:before{content:'\e9cb'}.icon-insert-photo:before{content:'\e9cc'}.icon-mode-comment:before{content:'\e9cd'}.icon-mode-edit:before{content:'\e9ce'}.icon-publish:before{content:'\e9cf'}.icon-vertical-align-bottom:before{content:'\e9d0'}.icon-vertical-align-center:before{content:'\e9d1'}.icon-vertical-align-top:before{content:'\e9d2'}.icon-wrap-text:before{content:'\e9d3'}.icon-eyedropper:before{content:'\e9d4'}.icon-compare:before{content:'\e9d5'}.icon-control-point-double:before{content:'\e9d6'}.icon-dehaze:before{content:'\e9d7'}.icon-details:before{content:'\e9d8'}.icon-exposure-minus-2:before{content:'\e9d9'}.icon-exposure-minus-1:before{content:'\e9da'}.icon-exposure-plus-2:before{content:'\e9db'}.icon-exposure-plus-1:before{content:'\e9dc'}.icon-exposure-zero:before{content:'\e9dd'}.icon-filter-2:before{content:'\e9de'}.icon-filter-1:before{content:'\e9df'}.icon-filter-9-plus:before{content:'\e9e0'}.icon-filter-3:before{content:'\e9e1'}.icon-filter-4:before{content:'\e9e2'}.icon-filter-5:before{content:'\e9e3'}.icon-filter-6:before{content:'\e9e4'}.icon-filter-7:before{content:'\e9e5'}.icon-filter-8:before{content:'\e9e6'}.icon-filter-9:before{content:'\e9e7'}.icon-filter-default:before{content:'\e9e8'}.icon-filter-b-w:before{content:'\e9e9'}.icon-filter-drama:before{content:'\e9ea'}.icon-filter-frames:before{content:'\e9eb'}.icon-filter-hdr:before{content:'\e9ec'}.icon-filter-none:before{content:'\e9ed'}.icon-filter-tilt-shift:before{content:'\e9ee'}.icon-filter-vintage:before{content:'\e9ef'}.icon-flare:before{content:'\e9f0'}.icon-flip:before{content:'\e9f1'}.icon-gradient:before{content:'\e9f2'}.icon-grain:before{content:'\e9f3'}.icon-grid-off:before{content:'\e9f4'}.icon-grid:before{content:'\e9f5'}.icon-hdr-off:before{content:'\e9f6'}.icon-hdr:before{content:'\e9f7'}.icon-hdr-strong:before{content:'\e9f8'}.icon-hdr-weak:before{content:'\e9f9'}.icon-healing:before{content:'\e9fa'}.icon-leak-add:before{content:'\e9fb'}.icon-leak-remove:before{content:'\e9fc'}.icon-brightness-1:before{content:'\e9fd'}.icon-loupe:before{content:'\e9fe'}.icon-nature:before{content:'\e9ff'}.icon-nature-people:before{content:'\ea00'}.icon-straighten:before{content:'\ea01'}.icon-texture:before{content:'\ea02'}.icon-tonality:before{content:'\ea03'}.icon-timer-off:before{content:'\ea04'}.icon-transform:before{content:'\ea05'}.icon-tune:before{content:'\ea06'}.icon-cafe:before{content:'\ea07'}.icon-bar:before{content:'\ea08'}.icon-rate-review:before{content:'\ea09'}.icon-restaurant:before{content:'\ea0a'}.icon-satellite:before{content:'\ea0b'}.icon-blur-off:before{content:'\ea0c'}.icon-store-mall-directory:before{content:'\ea0d'}.icon-navigation:before{content:'\ea0e'}.icon-pin-drop:before{content:'\ea0f'}.icon-pizza:before{content:'\ea10'}.icon-local-play:before{content:'\ea11'}.icon-pharmacy:before{content:'\ea12'}.icon-parking:before{content:'\ea13'}.icon-offer:before{content:'\ea14'}.icon-blur-on:before{content:'\ea15'}.icon-mall:before{content:'\ea16'}.icon-library:before{content:'\ea17'}.icon-laundry-service:before{content:'\ea18'}.icon-hotel-alt:before{content:'\ea19'}.icon-hospital:before{content:'\ea1a'}.icon-gas-station:before{content:'\ea1b'}.icon-florist:before{content:'\ea1c'}.icon-drink:before{content:'\ea1d'}.icon-atm:before{content:'\ea1e'}.icon-airport:before{content:'\ea1f'}.icon-layers-clear:before{content:'\ea20'}.icon-layers:before{content:'\ea21'}.icon-directions-ferry:before{content:'\ea22'}.icon-redeem:before{content:'\ea23'}.icon-wallet-membership:before{content:'\ea24'}.icon-wallet-travel:before{content:'\ea25'}.icon-view-carousel:before{content:'\ea26'}.icon-verified-user:before{content:'\ea27'}.icon-trending-down:before{content:'\ea28'}.icon-trending-neutral:before{content:'\ea29'}.icon-trending-up:before{content:'\ea2a'}.icon-add-to-photos:before{content:'\ea2b'}.icon-translate:before{content:'\ea2c'}.icon-track-changes:before{content:'\ea2d'}.icon-toc:before{content:'\ea2e'}.icon-system-update-tv:before{content:'\ea2f'}.icon-subject:before{content:'\ea30'}.icon-supervisor-account:before{content:'\ea31'}.icon-spellcheck:before{content:'\ea32'}.icon-speaker-notes:before{content:'\ea33'}.icon-shop-double:before{content:'\ea34'}.icon-question-answer:before{content:'\ea35'}.icon-picture-in-picture:before{content:'\ea36'}.icon-scan-wifi:before{content:'\ea37'}.icon-perm-phone-message:before{content:'\ea38'}.icon-perm-media:before{content:'\ea39'}.icon-device-info:before{content:'\ea3a'}.icon-adjust:before{content:'\ea3b'}.icon-data-settings:before{content:'\ea3c'}.icon-contact-calendar:before{content:'\ea3d'}.icon-camera-mic:before{content:'\ea3e'}.icon-payment:before{content:'\ea3f'}.icon-pageview:before{content:'\ea40'}.icon-open-with:before{content:'\ea41'}.icon-open-in-browser:before{content:'\ea42'}.icon-note-add:before{content:'\ea43'}.icon-mark-unread-email:before{content:'\ea44'}.icon-loyalty:before{content:'\ea45'}.icon-input:before{content:'\ea46'}.icon-highlight-remove:before{content:'\ea47'}.icon-assignment-ind:before{content:'\ea48'}.icon-assignment:before{content:'\ea49'}.icon-assignment-late:before{content:'\ea4a'}.icon-assignment-return:before{content:'\ea4b'}.icon-assignment-returned:before{content:'\ea4c'}.icon-assignment-turned-in:before{content:'\ea4d'}.icon-account-balance:before{content:'\ea4e'}.icon-account-balance-wallet:before{content:'\ea4f'}.icon-3d-rotation:before{content:'\ea50'}.icon-brightness-4:before{content:'\ea51'}.icon-brightness-5:before{content:'\ea52'}.icon-brightness-6:before{content:'\ea53'}.icon-brightness-7:before{content:'\ea54'}.icon-camera-front:before{content:'\ea55'}.icon-camera-rear:before{content:'\ea56'}.icon-center-focus-strong:before{content:'\ea57'}.icon-center-focus-weak:before{content:'\ea58'}.icon-assistant-photo:before{content:'\ea59'}.icon-audiotrack:before{content:'\ea5a'}.icon-blur-circular:before{content:'\ea5b'}.icon-blur-linear:before{content:'\ea5c'}.icon-brush:before{content:'\ea5d'}.icon-brightness-2:before{content:'\ea5e'}.icon-brightness-3:before{content:'\ea5f'}.color-red-50{color:#ffebee}.bg-red-50{background-color:#ffebee}.border-red-50{border-color:#ffebee}.fill-red-50{fill:#ffebee}.stroke-red-50{stroke:#ffebee}.color-red-100{color:#ffcdd2}.bg-red-100{background-color:#ffcdd2}.border-red-100{border-color:#ffcdd2}.fill-red-100{fill:#ffcdd2}.stroke-red-100{stroke:#ffcdd2}.color-red-200{color:#ef9a9a}.bg-red-200{background-color:#ef9a9a}.border-red-200{border-color:#ef9a9a}.fill-red-200{fill:#ef9a9a}.stroke-red-200{stroke:#ef9a9a}.color-red-300{color:#e57373}.bg-red-300{background-color:#e57373}.border-red-300{border-color:#e57373}.fill-red-300{fill:#e57373}.stroke-red-300{stroke:#e57373}.color-red-400{color:#ef5350}.bg-red-400{background-color:#ef5350}.border-red-400{border-color:#ef5350}.fill-red-400{fill:#ef5350}.stroke-red-400{stroke:#ef5350}.color-red-500{color:#f44336}.bg-red-500{background-color:#f44336}.border-red-500{border-color:#f44336}.fill-red-500{fill:#f44336}.stroke-red-500{stroke:#f44336}.color-red-600{color:#e53935}.bg-red-600{background-color:#e53935}.border-red-600{border-color:#e53935}.fill-red-600{fill:#e53935}.stroke-red-600{stroke:#e53935}.color-red-700{color:#d32f2f}.bg-red-700{background-color:#d32f2f}.border-red-700{border-color:#d32f2f}.fill-red-700{fill:#d32f2f}.stroke-red-700{stroke:#d32f2f}.color-red-800{color:#c62828}.bg-red-800{background-color:#c62828}.border-red-800{border-color:#c62828}.fill-red-800{fill:#c62828}.stroke-red-800{stroke:#c62828}.color-red-900{color:#b71c1c}.bg-red-900{background-color:#b71c1c}.border-red-900{border-color:#b71c1c}.fill-red-900{fill:#b71c1c}.stroke-red-900{stroke:#b71c1c}.color-red-a100{color:#ff8a80}.bg-red-a100{background-color:#ff8a80}.border-red-a100{border-color:#ff8a80}.fill-red-a100{fill:#ff8a80}.stroke-red-a100{stroke:#ff8a80}.color-red-a200{color:#ff5252}.bg-red-a200{background-color:#ff5252}.border-red-a200{border-color:#ff5252}.fill-red-a200{fill:#ff5252}.stroke-red-a200{stroke:#ff5252}.color-red-a400{color:#ff1744}.bg-red-a400{background-color:#ff1744}.border-red-a400{border-color:#ff1744}.fill-red-a400{fill:#ff1744}.stroke-red-a400{stroke:#ff1744}.color-red-a700{color:#d50000}.bg-red-a700{background-color:#d50000}.border-red-a700{border-color:#d50000}.fill-red-a700{fill:#d50000}.stroke-red-a700{stroke:#d50000}.color-pink-50{color:#fce4ec}.bg-pink-50{background-color:#fce4ec}.border-pink-50{border-color:#fce4ec}.fill-pink-50{fill:#fce4ec}.stroke-pink-50{stroke:#fce4ec}.color-pink-100{color:#f8bbd0}.bg-pink-100{background-color:#f8bbd0}.border-pink-100{border-color:#f8bbd0}.fill-pink-100{fill:#f8bbd0}.stroke-pink-100{stroke:#f8bbd0}.color-pink-200{color:#f48fb1}.bg-pink-200{background-color:#f48fb1}.border-pink-200{border-color:#f48fb1}.fill-pink-200{fill:#f48fb1}.stroke-pink-200{stroke:#f48fb1}.color-pink-300{color:#f06292}.bg-pink-300{background-color:#f06292}.border-pink-300{border-color:#f06292}.fill-pink-300{fill:#f06292}.stroke-pink-300{stroke:#f06292}.color-pink-400{color:#ec407a}.bg-pink-400{background-color:#ec407a}.border-pink-400{border-color:#ec407a}.fill-pink-400{fill:#ec407a}.stroke-pink-400{stroke:#ec407a}.color-pink-500{color:#e91e63}.bg-pink-500{background-color:#e91e63}.border-pink-500{border-color:#e91e63}.fill-pink-500{fill:#e91e63}.stroke-pink-500{stroke:#e91e63}.color-pink-600{color:#d81b60}.bg-pink-600{background-color:#d81b60}.border-pink-600{border-color:#d81b60}.fill-pink-600{fill:#d81b60}.stroke-pink-600{stroke:#d81b60}.color-pink-700{color:#c2185b}.bg-pink-700{background-color:#c2185b}.border-pink-700{border-color:#c2185b}.fill-pink-700{fill:#c2185b}.stroke-pink-700{stroke:#c2185b}.color-pink-800{color:#ad1457}.bg-pink-800{background-color:#ad1457}.border-pink-800{border-color:#ad1457}.fill-pink-800{fill:#ad1457}.stroke-pink-800{stroke:#ad1457}.color-pink-900{color:#880e4f}.bg-pink-900{background-color:#880e4f}.border-pink-900{border-color:#880e4f}.fill-pink-900{fill:#880e4f}.stroke-pink-900{stroke:#880e4f}.color-pink-a100{color:#ff80ab}.bg-pink-a100{background-color:#ff80ab}.border-pink-a100{border-color:#ff80ab}.fill-pink-a100{fill:#ff80ab}.stroke-pink-a100{stroke:#ff80ab}.color-pink-a200{color:#ff4081}.bg-pink-a200{background-color:#ff4081}.border-pink-a200{border-color:#ff4081}.fill-pink-a200{fill:#ff4081}.stroke-pink-a200{stroke:#ff4081}.color-pink-a400{color:#f50057}.bg-pink-a400{background-color:#f50057}.border-pink-a400{border-color:#f50057}.fill-pink-a400{fill:#f50057}.stroke-pink-a400{stroke:#f50057}.color-pink-a700{color:#c51162}.bg-pink-a700{background-color:#c51162}.border-pink-a700{border-color:#c51162}.fill-pink-a700{fill:#c51162}.stroke-pink-a700{stroke:#c51162}.color-purple-50{color:#f3e5f5}.bg-purple-50{background-color:#f3e5f5}.border-purple-50{border-color:#f3e5f5}.fill-purple-50{fill:#f3e5f5}.stroke-purple-50{stroke:#f3e5f5}.color-purple-100{color:#e1bee7}.bg-purple-100{background-color:#e1bee7}.border-purple-100{border-color:#e1bee7}.fill-purple-100{fill:#e1bee7}.stroke-purple-100{stroke:#e1bee7}.color-purple-200{color:#ce93d8}.bg-purple-200{background-color:#ce93d8}.border-purple-200{border-color:#ce93d8}.fill-purple-200{fill:#ce93d8}.stroke-purple-200{stroke:#ce93d8}.color-purple-300{color:#ba68c8}.bg-purple-300{background-color:#ba68c8}.border-purple-300{border-color:#ba68c8}.fill-purple-300{fill:#ba68c8}.stroke-purple-300{stroke:#ba68c8}.color-purple-400{color:#ab47bc}.bg-purple-400{background-color:#ab47bc}.border-purple-400{border-color:#ab47bc}.fill-purple-400{fill:#ab47bc}.stroke-purple-400{stroke:#ab47bc}.color-purple-500{color:#9c27b0}.bg-purple-500{background-color:#9c27b0}.border-purple-500{border-color:#9c27b0}.fill-purple-500{fill:#9c27b0}.stroke-purple-500{stroke:#9c27b0}.color-purple-600{color:#8e24aa}.bg-purple-600{background-color:#8e24aa}.border-purple-600{border-color:#8e24aa}.fill-purple-600{fill:#8e24aa}.stroke-purple-600{stroke:#8e24aa}.color-purple-700{color:#7b1fa2}.bg-purple-700{background-color:#7b1fa2}.border-purple-700{border-color:#7b1fa2}.fill-purple-700{fill:#7b1fa2}.stroke-purple-700{stroke:#7b1fa2}.color-purple-800{color:#6a1b9a}.bg-purple-800{background-color:#6a1b9a}.border-purple-800{border-color:#6a1b9a}.fill-purple-800{fill:#6a1b9a}.stroke-purple-800{stroke:#6a1b9a}.color-purple-900{color:#4a148c}.bg-purple-900{background-color:#4a148c}.border-purple-900{border-color:#4a148c}.fill-purple-900{fill:#4a148c}.stroke-purple-900{stroke:#4a148c}.color-purple-a100{color:#ea80fc}.bg-purple-a100{background-color:#ea80fc}.border-purple-a100{border-color:#ea80fc}.fill-purple-a100{fill:#ea80fc}.stroke-purple-a100{stroke:#ea80fc}.color-purple-a200{color:#e040fb}.bg-purple-a200{background-color:#e040fb}.border-purple-a200{border-color:#e040fb}.fill-purple-a200{fill:#e040fb}.stroke-purple-a200{stroke:#e040fb}.color-purple-a400{color:#d500f9}.bg-purple-a400{background-color:#d500f9}.border-purple-a400{border-color:#d500f9}.fill-purple-a400{fill:#d500f9}.stroke-purple-a400{stroke:#d500f9}.color-purple-a700{color:#a0f}.bg-purple-a700{background-color:#a0f}.border-purple-a700{border-color:#a0f}.fill-purple-a700{fill:#a0f}.stroke-purple-a700{stroke:#a0f}.color-deep-purple-50{color:#ede7f6}.bg-deep-purple-50{background-color:#ede7f6}.border-deep-purple-50{border-color:#ede7f6}.fill-deep-purple-50{fill:#ede7f6}.stroke-deep-purple-50{stroke:#ede7f6}.color-deep-purple-100{color:#d1c4e9}.bg-deep-purple-100{background-color:#d1c4e9}.border-deep-purple-100{border-color:#d1c4e9}.fill-deep-purple-100{fill:#d1c4e9}.stroke-deep-purple-100{stroke:#d1c4e9}.color-deep-purple-200{color:#b39ddb}.bg-deep-purple-200{background-color:#b39ddb}.border-deep-purple-200{border-color:#b39ddb}.fill-deep-purple-200{fill:#b39ddb}.stroke-deep-purple-200{stroke:#b39ddb}.color-deep-purple-300{color:#9575cd}.bg-deep-purple-300{background-color:#9575cd}.border-deep-purple-300{border-color:#9575cd}.fill-deep-purple-300{fill:#9575cd}.stroke-deep-purple-300{stroke:#9575cd}.color-deep-purple-400{color:#7e57c2}.bg-deep-purple-400{background-color:#7e57c2}.border-deep-purple-400{border-color:#7e57c2}.fill-deep-purple-400{fill:#7e57c2}.stroke-deep-purple-400{stroke:#7e57c2}.color-deep-purple-500{color:#673ab7}.bg-deep-purple-500{background-color:#673ab7}.border-deep-purple-500{border-color:#673ab7}.fill-deep-purple-500{fill:#673ab7}.stroke-deep-purple-500{stroke:#673ab7}.color-deep-purple-600{color:#5e35b1}.bg-deep-purple-600{background-color:#5e35b1}.border-deep-purple-600{border-color:#5e35b1}.fill-deep-purple-600{fill:#5e35b1}.stroke-deep-purple-600{stroke:#5e35b1}.color-deep-purple-700{color:#512da8}.bg-deep-purple-700{background-color:#512da8}.border-deep-purple-700{border-color:#512da8}.fill-deep-purple-700{fill:#512da8}.stroke-deep-purple-700{stroke:#512da8}.color-deep-purple-800{color:#4527a0}.bg-deep-purple-800{background-color:#4527a0}.border-deep-purple-800{border-color:#4527a0}.fill-deep-purple-800{fill:#4527a0}.stroke-deep-purple-800{stroke:#4527a0}.color-deep-purple-900{color:#311b92}.bg-deep-purple-900{background-color:#311b92}.border-deep-purple-900{border-color:#311b92}.fill-deep-purple-900{fill:#311b92}.stroke-deep-purple-900{stroke:#311b92}.color-deep-purple-a100{color:#b388ff}.bg-deep-purple-a100{background-color:#b388ff}.border-deep-purple-a100{border-color:#b388ff}.fill-deep-purple-a100{fill:#b388ff}.stroke-deep-purple-a100{stroke:#b388ff}.color-deep-purple-a200{color:#7c4dff}.bg-deep-purple-a200{background-color:#7c4dff}.border-deep-purple-a200{border-color:#7c4dff}.fill-deep-purple-a200{fill:#7c4dff}.stroke-deep-purple-a200{stroke:#7c4dff}.color-deep-purple-a400{color:#651fff}.bg-deep-purple-a400{background-color:#651fff}.border-deep-purple-a400{border-color:#651fff}.fill-deep-purple-a400{fill:#651fff}.stroke-deep-purple-a400{stroke:#651fff}.color-deep-purple-a700{color:#6200ea}.bg-deep-purple-a700{background-color:#6200ea}.border-deep-purple-a700{border-color:#6200ea}.fill-deep-purple-a700{fill:#6200ea}.stroke-deep-purple-a700{stroke:#6200ea}.color-indigo-50{color:#e8eaf6}.bg-indigo-50{background-color:#e8eaf6}.border-indigo-50{border-color:#e8eaf6}.fill-indigo-50{fill:#e8eaf6}.stroke-indigo-50{stroke:#e8eaf6}.color-indigo-100{color:#c5cae9}.bg-indigo-100{background-color:#c5cae9}.border-indigo-100{border-color:#c5cae9}.fill-indigo-100{fill:#c5cae9}.stroke-indigo-100{stroke:#c5cae9}.color-indigo-200{color:#9fa8da}.bg-indigo-200{background-color:#9fa8da}.border-indigo-200{border-color:#9fa8da}.fill-indigo-200{fill:#9fa8da}.stroke-indigo-200{stroke:#9fa8da}.color-indigo-300{color:#7986cb}.bg-indigo-300{background-color:#7986cb}.border-indigo-300{border-color:#7986cb}.fill-indigo-300{fill:#7986cb}.stroke-indigo-300{stroke:#7986cb}.color-indigo-400{color:#5c6bc0}.bg-indigo-400{background-color:#5c6bc0}.border-indigo-400{border-color:#5c6bc0}.fill-indigo-400{fill:#5c6bc0}.stroke-indigo-400{stroke:#5c6bc0}.color-indigo-500{color:#3f51b5}.bg-indigo-500{background-color:#3f51b5}.border-indigo-500{border-color:#3f51b5}.fill-indigo-500{fill:#3f51b5}.stroke-indigo-500{stroke:#3f51b5}.color-indigo-600{color:#3949ab}.bg-indigo-600{background-color:#3949ab}.border-indigo-600{border-color:#3949ab}.fill-indigo-600{fill:#3949ab}.stroke-indigo-600{stroke:#3949ab}.color-indigo-700{color:#303f9f}.bg-indigo-700{background-color:#303f9f}.border-indigo-700{border-color:#303f9f}.fill-indigo-700{fill:#303f9f}.stroke-indigo-700{stroke:#303f9f}.color-indigo-800{color:#283593}.bg-indigo-800{background-color:#283593}.border-indigo-800{border-color:#283593}.fill-indigo-800{fill:#283593}.stroke-indigo-800{stroke:#283593}.color-indigo-900{color:#1a237e}.bg-indigo-900{background-color:#1a237e}.border-indigo-900{border-color:#1a237e}.fill-indigo-900{fill:#1a237e}.stroke-indigo-900{stroke:#1a237e}.color-indigo-a100{color:#8c9eff}.bg-indigo-a100{background-color:#8c9eff}.border-indigo-a100{border-color:#8c9eff}.fill-indigo-a100{fill:#8c9eff}.stroke-indigo-a100{stroke:#8c9eff}.color-indigo-a200{color:#536dfe}.bg-indigo-a200{background-color:#536dfe}.border-indigo-a200{border-color:#536dfe}.fill-indigo-a200{fill:#536dfe}.stroke-indigo-a200{stroke:#536dfe}.color-indigo-a400{color:#3d5afe}.bg-indigo-a400{background-color:#3d5afe}.border-indigo-a400{border-color:#3d5afe}.fill-indigo-a400{fill:#3d5afe}.stroke-indigo-a400{stroke:#3d5afe}.color-indigo-a700{color:#304ffe}.bg-indigo-a700{background-color:#304ffe}.border-indigo-a700{border-color:#304ffe}.fill-indigo-a700{fill:#304ffe}.stroke-indigo-a700{stroke:#304ffe}.color-blue-50{color:#e3f2fd}.bg-blue-50{background-color:#e3f2fd}.border-blue-50{border-color:#e3f2fd}.fill-blue-50{fill:#e3f2fd}.stroke-blue-50{stroke:#e3f2fd}.color-blue-100{color:#bbdefb}.bg-blue-100{background-color:#bbdefb}.border-blue-100{border-color:#bbdefb}.fill-blue-100{fill:#bbdefb}.stroke-blue-100{stroke:#bbdefb}.color-blue-200{color:#90caf9}.bg-blue-200{background-color:#90caf9}.border-blue-200{border-color:#90caf9}.fill-blue-200{fill:#90caf9}.stroke-blue-200{stroke:#90caf9}.color-blue-300{color:#64b5f6}.bg-blue-300{background-color:#64b5f6}.border-blue-300{border-color:#64b5f6}.fill-blue-300{fill:#64b5f6}.stroke-blue-300{stroke:#64b5f6}.color-blue-400{color:#42a5f5}.bg-blue-400{background-color:#42a5f5}.border-blue-400{border-color:#42a5f5}.fill-blue-400{fill:#42a5f5}.stroke-blue-400{stroke:#42a5f5}.color-blue-500{color:#2196f3}.bg-blue-500{background-color:#2196f3}.border-blue-500{border-color:#2196f3}.fill-blue-500{fill:#2196f3}.stroke-blue-500{stroke:#2196f3}.color-blue-600{color:#1e88e5}.bg-blue-600{background-color:#1e88e5}.border-blue-600{border-color:#1e88e5}.fill-blue-600{fill:#1e88e5}.stroke-blue-600{stroke:#1e88e5}.color-blue-700{color:#1976d2}.bg-blue-700{background-color:#1976d2}.border-blue-700{border-color:#1976d2}.fill-blue-700{fill:#1976d2}.stroke-blue-700{stroke:#1976d2}.color-blue-800{color:#1565c0}.bg-blue-800{background-color:#1565c0}.border-blue-800{border-color:#1565c0}.fill-blue-800{fill:#1565c0}.stroke-blue-800{stroke:#1565c0}.color-blue-900{color:#0d47a1}.bg-blue-900{background-color:#0d47a1}.border-blue-900{border-color:#0d47a1}.fill-blue-900{fill:#0d47a1}.stroke-blue-900{stroke:#0d47a1}.color-blue-a100{color:#82b1ff}.bg-blue-a100{background-color:#82b1ff}.border-blue-a100{border-color:#82b1ff}.fill-blue-a100{fill:#82b1ff}.stroke-blue-a100{stroke:#82b1ff}.color-blue-a200{color:#448aff}.bg-blue-a200{background-color:#448aff}.border-blue-a200{border-color:#448aff}.fill-blue-a200{fill:#448aff}.stroke-blue-a200{stroke:#448aff}.color-blue-a400{color:#2979ff}.bg-blue-a400{background-color:#2979ff}.border-blue-a400{border-color:#2979ff}.fill-blue-a400{fill:#2979ff}.stroke-blue-a400{stroke:#2979ff}.color-blue-a700{color:#2962ff}.bg-blue-a700{background-color:#2962ff}.border-blue-a700{border-color:#2962ff}.fill-blue-a700{fill:#2962ff}.stroke-blue-a700{stroke:#2962ff}.color-light-blue-50{color:#e1f5fe}.bg-light-blue-50{background-color:#e1f5fe}.border-light-blue-50{border-color:#e1f5fe}.fill-light-blue-50{fill:#e1f5fe}.stroke-light-blue-50{stroke:#e1f5fe}.color-light-blue-100{color:#b3e5fc}.bg-light-blue-100{background-color:#b3e5fc}.border-light-blue-100{border-color:#b3e5fc}.fill-light-blue-100{fill:#b3e5fc}.stroke-light-blue-100{stroke:#b3e5fc}.color-light-blue-200{color:#81d4fa}.bg-light-blue-200{background-color:#81d4fa}.border-light-blue-200{border-color:#81d4fa}.fill-light-blue-200{fill:#81d4fa}.stroke-light-blue-200{stroke:#81d4fa}.color-light-blue-300{color:#4fc3f7}.bg-light-blue-300{background-color:#4fc3f7}.border-light-blue-300{border-color:#4fc3f7}.fill-light-blue-300{fill:#4fc3f7}.stroke-light-blue-300{stroke:#4fc3f7}.color-light-blue-400{color:#29b6f6}.bg-light-blue-400{background-color:#29b6f6}.border-light-blue-400{border-color:#29b6f6}.fill-light-blue-400{fill:#29b6f6}.stroke-light-blue-400{stroke:#29b6f6}.color-light-blue-500{color:#03a9f4}.bg-light-blue-500{background-color:#03a9f4}.border-light-blue-500{border-color:#03a9f4}.fill-light-blue-500{fill:#03a9f4}.stroke-light-blue-500{stroke:#03a9f4}.color-light-blue-600{color:#039be5}.bg-light-blue-600{background-color:#039be5}.border-light-blue-600{border-color:#039be5}.fill-light-blue-600{fill:#039be5}.stroke-light-blue-600{stroke:#039be5}.color-light-blue-700{color:#0288d1}.bg-light-blue-700{background-color:#0288d1}.border-light-blue-700{border-color:#0288d1}.fill-light-blue-700{fill:#0288d1}.stroke-light-blue-700{stroke:#0288d1}.color-light-blue-800{color:#0277bd}.bg-light-blue-800{background-color:#0277bd}.border-light-blue-800{border-color:#0277bd}.fill-light-blue-800{fill:#0277bd}.stroke-light-blue-800{stroke:#0277bd}.color-light-blue-900{color:#01579b}.bg-light-blue-900{background-color:#01579b}.border-light-blue-900{border-color:#01579b}.fill-light-blue-900{fill:#01579b}.stroke-light-blue-900{stroke:#01579b}.color-light-blue-a100{color:#80d8ff}.bg-light-blue-a100{background-color:#80d8ff}.border-light-blue-a100{border-color:#80d8ff}.fill-light-blue-a100{fill:#80d8ff}.stroke-light-blue-a100{stroke:#80d8ff}.color-light-blue-a200{color:#40c4ff}.bg-light-blue-a200{background-color:#40c4ff}.border-light-blue-a200{border-color:#40c4ff}.fill-light-blue-a200{fill:#40c4ff}.stroke-light-blue-a200{stroke:#40c4ff}.color-light-blue-a400{color:#00b0ff}.bg-light-blue-a400{background-color:#00b0ff}.border-light-blue-a400{border-color:#00b0ff}.fill-light-blue-a400{fill:#00b0ff}.stroke-light-blue-a400{stroke:#00b0ff}.color-light-blue-a700{color:#0091ea}.bg-light-blue-a700{background-color:#0091ea}.border-light-blue-a700{border-color:#0091ea}.fill-light-blue-a700{fill:#0091ea}.stroke-light-blue-a700{stroke:#0091ea}.color-cyan-50{color:#e0f7fa}.bg-cyan-50{background-color:#e0f7fa}.border-cyan-50{border-color:#e0f7fa}.fill-cyan-50{fill:#e0f7fa}.stroke-cyan-50{stroke:#e0f7fa}.color-cyan-100{color:#b2ebf2}.bg-cyan-100{background-color:#b2ebf2}.border-cyan-100{border-color:#b2ebf2}.fill-cyan-100{fill:#b2ebf2}.stroke-cyan-100{stroke:#b2ebf2}.color-cyan-200{color:#80deea}.bg-cyan-200{background-color:#80deea}.border-cyan-200{border-color:#80deea}.fill-cyan-200{fill:#80deea}.stroke-cyan-200{stroke:#80deea}.color-cyan-300{color:#4dd0e1}.bg-cyan-300{background-color:#4dd0e1}.border-cyan-300{border-color:#4dd0e1}.fill-cyan-300{fill:#4dd0e1}.stroke-cyan-300{stroke:#4dd0e1}.color-cyan-400{color:#26c6da}.bg-cyan-400{background-color:#26c6da}.border-cyan-400{border-color:#26c6da}.fill-cyan-400{fill:#26c6da}.stroke-cyan-400{stroke:#26c6da}.color-cyan-500{color:#00bcd4}.bg-cyan-500{background-color:#00bcd4}.border-cyan-500{border-color:#00bcd4}.fill-cyan-500{fill:#00bcd4}.stroke-cyan-500{stroke:#00bcd4}.color-cyan-600{color:#00acc1}.bg-cyan-600{background-color:#00acc1}.border-cyan-600{border-color:#00acc1}.fill-cyan-600{fill:#00acc1}.stroke-cyan-600{stroke:#00acc1}.color-cyan-700{color:#0097a7}.bg-cyan-700{background-color:#0097a7}.border-cyan-700{border-color:#0097a7}.fill-cyan-700{fill:#0097a7}.stroke-cyan-700{stroke:#0097a7}.color-cyan-800{color:#00838f}.bg-cyan-800{background-color:#00838f}.border-cyan-800{border-color:#00838f}.fill-cyan-800{fill:#00838f}.stroke-cyan-800{stroke:#00838f}.color-cyan-900{color:#006064}.bg-cyan-900{background-color:#006064}.border-cyan-900{border-color:#006064}.fill-cyan-900{fill:#006064}.stroke-cyan-900{stroke:#006064}.color-cyan-a100{color:#84ffff}.bg-cyan-a100{background-color:#84ffff}.border-cyan-a100{border-color:#84ffff}.fill-cyan-a100{fill:#84ffff}.stroke-cyan-a100{stroke:#84ffff}.color-cyan-a200{color:#18ffff}.bg-cyan-a200{background-color:#18ffff}.border-cyan-a200{border-color:#18ffff}.fill-cyan-a200{fill:#18ffff}.stroke-cyan-a200{stroke:#18ffff}.color-cyan-a400{color:#00e5ff}.bg-cyan-a400{background-color:#00e5ff}.border-cyan-a400{border-color:#00e5ff}.fill-cyan-a400{fill:#00e5ff}.stroke-cyan-a400{stroke:#00e5ff}.color-cyan-a700{color:#00b8d4}.bg-cyan-a700{background-color:#00b8d4}.border-cyan-a700{border-color:#00b8d4}.fill-cyan-a700{fill:#00b8d4}.stroke-cyan-a700{stroke:#00b8d4}.color-teal-50{color:#e0f2f1}.bg-teal-50{background-color:#e0f2f1}.border-teal-50{border-color:#e0f2f1}.fill-teal-50{fill:#e0f2f1}.stroke-teal-50{stroke:#e0f2f1}.color-teal-100{color:#b2dfdb}.bg-teal-100{background-color:#b2dfdb}.border-teal-100{border-color:#b2dfdb}.fill-teal-100{fill:#b2dfdb}.stroke-teal-100{stroke:#b2dfdb}.color-teal-200{color:#80cbc4}.bg-teal-200{background-color:#80cbc4}.border-teal-200{border-color:#80cbc4}.fill-teal-200{fill:#80cbc4}.stroke-teal-200{stroke:#80cbc4}.color-teal-300{color:#4db6ac}.bg-teal-300{background-color:#4db6ac}.border-teal-300{border-color:#4db6ac}.fill-teal-300{fill:#4db6ac}.stroke-teal-300{stroke:#4db6ac}.color-teal-400{color:#26a69a}.bg-teal-400{background-color:#26a69a}.border-teal-400{border-color:#26a69a}.fill-teal-400{fill:#26a69a}.stroke-teal-400{stroke:#26a69a}.color-teal-500{color:#009688}.bg-teal-500{background-color:#009688}.border-teal-500{border-color:#009688}.fill-teal-500{fill:#009688}.stroke-teal-500{stroke:#009688}.color-teal-600{color:#00897b}.bg-teal-600{background-color:#00897b}.border-teal-600{border-color:#00897b}.fill-teal-600{fill:#00897b}.stroke-teal-600{stroke:#00897b}.color-teal-700{color:#00796b}.bg-teal-700{background-color:#00796b}.border-teal-700{border-color:#00796b}.fill-teal-700{fill:#00796b}.stroke-teal-700{stroke:#00796b}.color-teal-800{color:#00695c}.bg-teal-800{background-color:#00695c}.border-teal-800{border-color:#00695c}.fill-teal-800{fill:#00695c}.stroke-teal-800{stroke:#00695c}.color-teal-900{color:#004d40}.bg-teal-900{background-color:#004d40}.border-teal-900{border-color:#004d40}.fill-teal-900{fill:#004d40}.stroke-teal-900{stroke:#004d40}.color-teal-a100{color:#a7ffeb}.bg-teal-a100{background-color:#a7ffeb}.border-teal-a100{border-color:#a7ffeb}.fill-teal-a100{fill:#a7ffeb}.stroke-teal-a100{stroke:#a7ffeb}.color-teal-a200{color:#64ffda}.bg-teal-a200{background-color:#64ffda}.border-teal-a200{border-color:#64ffda}.fill-teal-a200{fill:#64ffda}.stroke-teal-a200{stroke:#64ffda}.color-teal-a400{color:#1de9b6}.bg-teal-a400{background-color:#1de9b6}.border-teal-a400{border-color:#1de9b6}.fill-teal-a400{fill:#1de9b6}.stroke-teal-a400{stroke:#1de9b6}.color-teal-a700{color:#00bfa5}.bg-teal-a700{background-color:#00bfa5}.border-teal-a700{border-color:#00bfa5}.fill-teal-a700{fill:#00bfa5}.stroke-teal-a700{stroke:#00bfa5}.color-green-50{color:#e8f5e9}.bg-green-50{background-color:#e8f5e9}.border-green-50{border-color:#e8f5e9}.fill-green-50{fill:#e8f5e9}.stroke-green-50{stroke:#e8f5e9}.color-green-100{color:#c8e6c9}.bg-green-100{background-color:#c8e6c9}.border-green-100{border-color:#c8e6c9}.fill-green-100{fill:#c8e6c9}.stroke-green-100{stroke:#c8e6c9}.color-green-200{color:#a5d6a7}.bg-green-200{background-color:#a5d6a7}.border-green-200{border-color:#a5d6a7}.fill-green-200{fill:#a5d6a7}.stroke-green-200{stroke:#a5d6a7}.color-green-300{color:#81c784}.bg-green-300{background-color:#81c784}.border-green-300{border-color:#81c784}.fill-green-300{fill:#81c784}.stroke-green-300{stroke:#81c784}.color-green-400{color:#66bb6a}.bg-green-400{background-color:#66bb6a}.border-green-400{border-color:#66bb6a}.fill-green-400{fill:#66bb6a}.stroke-green-400{stroke:#66bb6a}.color-green-500{color:#4caf50}.bg-green-500{background-color:#4caf50}.border-green-500{border-color:#4caf50}.fill-green-500{fill:#4caf50}.stroke-green-500{stroke:#4caf50}.color-green-600{color:#43a047}.bg-green-600{background-color:#43a047}.border-green-600{border-color:#43a047}.fill-green-600{fill:#43a047}.stroke-green-600{stroke:#43a047}.color-green-700{color:#388e3c}.bg-green-700{background-color:#388e3c}.border-green-700{border-color:#388e3c}.fill-green-700{fill:#388e3c}.stroke-green-700{stroke:#388e3c}.color-green-800{color:#2e7d32}.bg-green-800{background-color:#2e7d32}.border-green-800{border-color:#2e7d32}.fill-green-800{fill:#2e7d32}.stroke-green-800{stroke:#2e7d32}.color-green-900{color:#1b5e20}.bg-green-900{background-color:#1b5e20}.border-green-900{border-color:#1b5e20}.fill-green-900{fill:#1b5e20}.stroke-green-900{stroke:#1b5e20}.color-green-a100{color:#b9f6ca}.bg-green-a100{background-color:#b9f6ca}.border-green-a100{border-color:#b9f6ca}.fill-green-a100{fill:#b9f6ca}.stroke-green-a100{stroke:#b9f6ca}.color-green-a200{color:#69f0ae}.bg-green-a200{background-color:#69f0ae}.border-green-a200{border-color:#69f0ae}.fill-green-a200{fill:#69f0ae}.stroke-green-a200{stroke:#69f0ae}.color-green-a400{color:#00e676}.bg-green-a400{background-color:#00e676}.border-green-a400{border-color:#00e676}.fill-green-a400{fill:#00e676}.stroke-green-a400{stroke:#00e676}.color-green-a700{color:#00c853}.bg-green-a700{background-color:#00c853}.border-green-a700{border-color:#00c853}.fill-green-a700{fill:#00c853}.stroke-green-a700{stroke:#00c853}.color-light-green-50{color:#f1f8e9}.bg-light-green-50{background-color:#f1f8e9}.border-light-green-50{border-color:#f1f8e9}.fill-light-green-50{fill:#f1f8e9}.stroke-light-green-50{stroke:#f1f8e9}.color-light-green-100{color:#dcedc8}.bg-light-green-100{background-color:#dcedc8}.border-light-green-100{border-color:#dcedc8}.fill-light-green-100{fill:#dcedc8}.stroke-light-green-100{stroke:#dcedc8}.color-light-green-200{color:#c5e1a5}.bg-light-green-200{background-color:#c5e1a5}.border-light-green-200{border-color:#c5e1a5}.fill-light-green-200{fill:#c5e1a5}.stroke-light-green-200{stroke:#c5e1a5}.color-light-green-300{color:#aed581}.bg-light-green-300{background-color:#aed581}.border-light-green-300{border-color:#aed581}.fill-light-green-300{fill:#aed581}.stroke-light-green-300{stroke:#aed581}.color-light-green-400{color:#9ccc65}.bg-light-green-400{background-color:#9ccc65}.border-light-green-400{border-color:#9ccc65}.fill-light-green-400{fill:#9ccc65}.stroke-light-green-400{stroke:#9ccc65}.color-light-green-500{color:#8bc34a}.bg-light-green-500{background-color:#8bc34a}.border-light-green-500{border-color:#8bc34a}.fill-light-green-500{fill:#8bc34a}.stroke-light-green-500{stroke:#8bc34a}.color-light-green-600{color:#7cb342}.bg-light-green-600{background-color:#7cb342}.border-light-green-600{border-color:#7cb342}.fill-light-green-600{fill:#7cb342}.stroke-light-green-600{stroke:#7cb342}.color-light-green-700{color:#689f38}.bg-light-green-700{background-color:#689f38}.border-light-green-700{border-color:#689f38}.fill-light-green-700{fill:#689f38}.stroke-light-green-700{stroke:#689f38}.color-light-green-800{color:#558b2f}.bg-light-green-800{background-color:#558b2f}.border-light-green-800{border-color:#558b2f}.fill-light-green-800{fill:#558b2f}.stroke-light-green-800{stroke:#558b2f}.color-light-green-900{color:#33691e}.bg-light-green-900{background-color:#33691e}.border-light-green-900{border-color:#33691e}.fill-light-green-900{fill:#33691e}.stroke-light-green-900{stroke:#33691e}.color-light-green-a100{color:#ccff90}.bg-light-green-a100{background-color:#ccff90}.border-light-green-a100{border-color:#ccff90}.fill-light-green-a100{fill:#ccff90}.stroke-light-green-a100{stroke:#ccff90}.color-light-green-a200{color:#b2ff59}.bg-light-green-a200{background-color:#b2ff59}.border-light-green-a200{border-color:#b2ff59}.fill-light-green-a200{fill:#b2ff59}.stroke-light-green-a200{stroke:#b2ff59}.color-light-green-a400{color:#76ff03}.bg-light-green-a400{background-color:#76ff03}.border-light-green-a400{border-color:#76ff03}.fill-light-green-a400{fill:#76ff03}.stroke-light-green-a400{stroke:#76ff03}.color-light-green-a700{color:#64dd17}.bg-light-green-a700{background-color:#64dd17}.border-light-green-a700{border-color:#64dd17}.fill-light-green-a700{fill:#64dd17}.stroke-light-green-a700{stroke:#64dd17}.color-lime-50{color:#f9fbe7}.bg-lime-50{background-color:#f9fbe7}.border-lime-50{border-color:#f9fbe7}.fill-lime-50{fill:#f9fbe7}.stroke-lime-50{stroke:#f9fbe7}.color-lime-100{color:#f0f4c3}.bg-lime-100{background-color:#f0f4c3}.border-lime-100{border-color:#f0f4c3}.fill-lime-100{fill:#f0f4c3}.stroke-lime-100{stroke:#f0f4c3}.color-lime-200{color:#e6ee9c}.bg-lime-200{background-color:#e6ee9c}.border-lime-200{border-color:#e6ee9c}.fill-lime-200{fill:#e6ee9c}.stroke-lime-200{stroke:#e6ee9c}.color-lime-300{color:#dce775}.bg-lime-300{background-color:#dce775}.border-lime-300{border-color:#dce775}.fill-lime-300{fill:#dce775}.stroke-lime-300{stroke:#dce775}.color-lime-400{color:#d4e157}.bg-lime-400{background-color:#d4e157}.border-lime-400{border-color:#d4e157}.fill-lime-400{fill:#d4e157}.stroke-lime-400{stroke:#d4e157}.color-lime-500{color:#cddc39}.bg-lime-500{background-color:#cddc39}.border-lime-500{border-color:#cddc39}.fill-lime-500{fill:#cddc39}.stroke-lime-500{stroke:#cddc39}.color-lime-600{color:#c0ca33}.bg-lime-600{background-color:#c0ca33}.border-lime-600{border-color:#c0ca33}.fill-lime-600{fill:#c0ca33}.stroke-lime-600{stroke:#c0ca33}.color-lime-700{color:#afb42b}.bg-lime-700{background-color:#afb42b}.border-lime-700{border-color:#afb42b}.fill-lime-700{fill:#afb42b}.stroke-lime-700{stroke:#afb42b}.color-lime-800{color:#9e9d24}.bg-lime-800{background-color:#9e9d24}.border-lime-800{border-color:#9e9d24}.fill-lime-800{fill:#9e9d24}.stroke-lime-800{stroke:#9e9d24}.color-lime-900{color:#827717}.bg-lime-900{background-color:#827717}.border-lime-900{border-color:#827717}.fill-lime-900{fill:#827717}.stroke-lime-900{stroke:#827717}.color-lime-a100{color:#f4ff81}.bg-lime-a100{background-color:#f4ff81}.border-lime-a100{border-color:#f4ff81}.fill-lime-a100{fill:#f4ff81}.stroke-lime-a100{stroke:#f4ff81}.color-lime-a200{color:#eeff41}.bg-lime-a200{background-color:#eeff41}.border-lime-a200{border-color:#eeff41}.fill-lime-a200{fill:#eeff41}.stroke-lime-a200{stroke:#eeff41}.color-lime-a400{color:#c6ff00}.bg-lime-a400{background-color:#c6ff00}.border-lime-a400{border-color:#c6ff00}.fill-lime-a400{fill:#c6ff00}.stroke-lime-a400{stroke:#c6ff00}.color-lime-a700{color:#aeea00}.bg-lime-a700{background-color:#aeea00}.border-lime-a700{border-color:#aeea00}.fill-lime-a700{fill:#aeea00}.stroke-lime-a700{stroke:#aeea00}.color-yellow-50{color:#fffde7}.bg-yellow-50{background-color:#fffde7}.border-yellow-50{border-color:#fffde7}.fill-yellow-50{fill:#fffde7}.stroke-yellow-50{stroke:#fffde7}.color-yellow-100{color:#fff9c4}.bg-yellow-100{background-color:#fff9c4}.border-yellow-100{border-color:#fff9c4}.fill-yellow-100{fill:#fff9c4}.stroke-yellow-100{stroke:#fff9c4}.color-yellow-200{color:#fff59d}.bg-yellow-200{background-color:#fff59d}.border-yellow-200{border-color:#fff59d}.fill-yellow-200{fill:#fff59d}.stroke-yellow-200{stroke:#fff59d}.color-yellow-300{color:#fff176}.bg-yellow-300{background-color:#fff176}.border-yellow-300{border-color:#fff176}.fill-yellow-300{fill:#fff176}.stroke-yellow-300{stroke:#fff176}.color-yellow-400{color:#ffee58}.bg-yellow-400{background-color:#ffee58}.border-yellow-400{border-color:#ffee58}.fill-yellow-400{fill:#ffee58}.stroke-yellow-400{stroke:#ffee58}.color-yellow-500{color:#ffeb3b}.bg-yellow-500{background-color:#ffeb3b}.border-yellow-500{border-color:#ffeb3b}.fill-yellow-500{fill:#ffeb3b}.stroke-yellow-500{stroke:#ffeb3b}.color-yellow-600{color:#fdd835}.bg-yellow-600{background-color:#fdd835}.border-yellow-600{border-color:#fdd835}.fill-yellow-600{fill:#fdd835}.stroke-yellow-600{stroke:#fdd835}.color-yellow-700{color:#fbc02d}.bg-yellow-700{background-color:#fbc02d}.border-yellow-700{border-color:#fbc02d}.fill-yellow-700{fill:#fbc02d}.stroke-yellow-700{stroke:#fbc02d}.color-yellow-800{color:#f9a825}.bg-yellow-800{background-color:#f9a825}.border-yellow-800{border-color:#f9a825}.fill-yellow-800{fill:#f9a825}.stroke-yellow-800{stroke:#f9a825}.color-yellow-900{color:#f57f17}.bg-yellow-900{background-color:#f57f17}.border-yellow-900{border-color:#f57f17}.fill-yellow-900{fill:#f57f17}.stroke-yellow-900{stroke:#f57f17}.color-yellow-a100{color:#ffff8d}.bg-yellow-a100{background-color:#ffff8d}.border-yellow-a100{border-color:#ffff8d}.fill-yellow-a100{fill:#ffff8d}.stroke-yellow-a100{stroke:#ffff8d}.color-yellow-a200{color:#ff0}.bg-yellow-a200{background-color:#ff0}.border-yellow-a200{border-color:#ff0}.fill-yellow-a200{fill:#ff0}.stroke-yellow-a200{stroke:#ff0}.color-yellow-a400{color:#ffea00}.bg-yellow-a400{background-color:#ffea00}.border-yellow-a400{border-color:#ffea00}.fill-yellow-a400{fill:#ffea00}.stroke-yellow-a400{stroke:#ffea00}.color-yellow-a700{color:#ffd600}.bg-yellow-a700{background-color:#ffd600}.border-yellow-a700{border-color:#ffd600}.fill-yellow-a700{fill:#ffd600}.stroke-yellow-a700{stroke:#ffd600}.color-amber-50{color:#fff8e1}.bg-amber-50{background-color:#fff8e1}.border-amber-50{border-color:#fff8e1}.fill-amber-50{fill:#fff8e1}.stroke-amber-50{stroke:#fff8e1}.color-amber-100{color:#ffecb3}.bg-amber-100{background-color:#ffecb3}.border-amber-100{border-color:#ffecb3}.fill-amber-100{fill:#ffecb3}.stroke-amber-100{stroke:#ffecb3}.color-amber-200{color:#ffe082}.bg-amber-200{background-color:#ffe082}.border-amber-200{border-color:#ffe082}.fill-amber-200{fill:#ffe082}.stroke-amber-200{stroke:#ffe082}.color-amber-300{color:#ffd54f}.bg-amber-300{background-color:#ffd54f}.border-amber-300{border-color:#ffd54f}.fill-amber-300{fill:#ffd54f}.stroke-amber-300{stroke:#ffd54f}.color-amber-400{color:#ffca28}.bg-amber-400{background-color:#ffca28}.border-amber-400{border-color:#ffca28}.fill-amber-400{fill:#ffca28}.stroke-amber-400{stroke:#ffca28}.color-amber-500{color:#ffc107}.bg-amber-500{background-color:#ffc107}.border-amber-500{border-color:#ffc107}.fill-amber-500{fill:#ffc107}.stroke-amber-500{stroke:#ffc107}.color-amber-600{color:#ffb300}.bg-amber-600{background-color:#ffb300}.border-amber-600{border-color:#ffb300}.fill-amber-600{fill:#ffb300}.stroke-amber-600{stroke:#ffb300}.color-amber-700{color:#ffa000}.bg-amber-700{background-color:#ffa000}.border-amber-700{border-color:#ffa000}.fill-amber-700{fill:#ffa000}.stroke-amber-700{stroke:#ffa000}.color-amber-800{color:#ff8f00}.bg-amber-800{background-color:#ff8f00}.border-amber-800{border-color:#ff8f00}.fill-amber-800{fill:#ff8f00}.stroke-amber-800{stroke:#ff8f00}.color-amber-900{color:#ff6f00}.bg-amber-900{background-color:#ff6f00}.border-amber-900{border-color:#ff6f00}.fill-amber-900{fill:#ff6f00}.stroke-amber-900{stroke:#ff6f00}.color-amber-a100{color:#ffe57f}.bg-amber-a100{background-color:#ffe57f}.border-amber-a100{border-color:#ffe57f}.fill-amber-a100{fill:#ffe57f}.stroke-amber-a100{stroke:#ffe57f}.color-amber-a200{color:#ffd740}.bg-amber-a200{background-color:#ffd740}.border-amber-a200{border-color:#ffd740}.fill-amber-a200{fill:#ffd740}.stroke-amber-a200{stroke:#ffd740}.color-amber-a400{color:#ffc400}.bg-amber-a400{background-color:#ffc400}.border-amber-a400{border-color:#ffc400}.fill-amber-a400{fill:#ffc400}.stroke-amber-a400{stroke:#ffc400}.color-amber-a700{color:#ffab00}.bg-amber-a700{background-color:#ffab00}.border-amber-a700{border-color:#ffab00}.fill-amber-a700{fill:#ffab00}.stroke-amber-a700{stroke:#ffab00}.color-orange-50{color:#fff3e0}.bg-orange-50{background-color:#fff3e0}.border-orange-50{border-color:#fff3e0}.fill-orange-50{fill:#fff3e0}.stroke-orange-50{stroke:#fff3e0}.color-orange-100{color:#ffe0b2}.bg-orange-100{background-color:#ffe0b2}.border-orange-100{border-color:#ffe0b2}.fill-orange-100{fill:#ffe0b2}.stroke-orange-100{stroke:#ffe0b2}.color-orange-200{color:#ffcc80}.bg-orange-200{background-color:#ffcc80}.border-orange-200{border-color:#ffcc80}.fill-orange-200{fill:#ffcc80}.stroke-orange-200{stroke:#ffcc80}.color-orange-300{color:#ffb74d}.bg-orange-300{background-color:#ffb74d}.border-orange-300{border-color:#ffb74d}.fill-orange-300{fill:#ffb74d}.stroke-orange-300{stroke:#ffb74d}.color-orange-400{color:#ffa726}.bg-orange-400{background-color:#ffa726}.border-orange-400{border-color:#ffa726}.fill-orange-400{fill:#ffa726}.stroke-orange-400{stroke:#ffa726}.color-orange-500{color:#ff9800}.bg-orange-500{background-color:#ff9800}.border-orange-500{border-color:#ff9800}.fill-orange-500{fill:#ff9800}.stroke-orange-500{stroke:#ff9800}.color-orange-600{color:#fb8c00}.bg-orange-600{background-color:#fb8c00}.border-orange-600{border-color:#fb8c00}.fill-orange-600{fill:#fb8c00}.stroke-orange-600{stroke:#fb8c00}.color-orange-700{color:#f57c00}.bg-orange-700{background-color:#f57c00}.border-orange-700{border-color:#f57c00}.fill-orange-700{fill:#f57c00}.stroke-orange-700{stroke:#f57c00}.color-orange-800{color:#ef6c00}.bg-orange-800{background-color:#ef6c00}.border-orange-800{border-color:#ef6c00}.fill-orange-800{fill:#ef6c00}.stroke-orange-800{stroke:#ef6c00}.color-orange-900{color:#e65100}.bg-orange-900{background-color:#e65100}.border-orange-900{border-color:#e65100}.fill-orange-900{fill:#e65100}.stroke-orange-900{stroke:#e65100}.color-orange-a100{color:#ffd180}.bg-orange-a100{background-color:#ffd180}.border-orange-a100{border-color:#ffd180}.fill-orange-a100{fill:#ffd180}.stroke-orange-a100{stroke:#ffd180}.color-orange-a200{color:#ffab40}.bg-orange-a200{background-color:#ffab40}.border-orange-a200{border-color:#ffab40}.fill-orange-a200{fill:#ffab40}.stroke-orange-a200{stroke:#ffab40}.color-orange-a400{color:#ff9100}.bg-orange-a400{background-color:#ff9100}.border-orange-a400{border-color:#ff9100}.fill-orange-a400{fill:#ff9100}.stroke-orange-a400{stroke:#ff9100}.color-orange-a700{color:#ff6d00}.bg-orange-a700{background-color:#ff6d00}.border-orange-a700{border-color:#ff6d00}.fill-orange-a700{fill:#ff6d00}.stroke-orange-a700{stroke:#ff6d00}.color-deep-orange-50{color:#fbe9e7}.bg-deep-orange-50{background-color:#fbe9e7}.border-deep-orange-50{border-color:#fbe9e7}.fill-deep-orange-50{fill:#fbe9e7}.stroke-deep-orange-50{stroke:#fbe9e7}.color-deep-orange-100{color:#ffccbc}.bg-deep-orange-100{background-color:#ffccbc}.border-deep-orange-100{border-color:#ffccbc}.fill-deep-orange-100{fill:#ffccbc}.stroke-deep-orange-100{stroke:#ffccbc}.color-deep-orange-200{color:#ffab91}.bg-deep-orange-200{background-color:#ffab91}.border-deep-orange-200{border-color:#ffab91}.fill-deep-orange-200{fill:#ffab91}.stroke-deep-orange-200{stroke:#ffab91}.color-deep-orange-300{color:#ff8a65}.bg-deep-orange-300{background-color:#ff8a65}.border-deep-orange-300{border-color:#ff8a65}.fill-deep-orange-300{fill:#ff8a65}.stroke-deep-orange-300{stroke:#ff8a65}.color-deep-orange-400{color:#ff7043}.bg-deep-orange-400{background-color:#ff7043}.border-deep-orange-400{border-color:#ff7043}.fill-deep-orange-400{fill:#ff7043}.stroke-deep-orange-400{stroke:#ff7043}.color-deep-orange-500{color:#ff5722}.bg-deep-orange-500{background-color:#ff5722}.border-deep-orange-500{border-color:#ff5722}.fill-deep-orange-500{fill:#ff5722}.stroke-deep-orange-500{stroke:#ff5722}.color-deep-orange-600{color:#f4511e}.bg-deep-orange-600{background-color:#f4511e}.border-deep-orange-600{border-color:#f4511e}.fill-deep-orange-600{fill:#f4511e}.stroke-deep-orange-600{stroke:#f4511e}.color-deep-orange-700{color:#e64a19}.bg-deep-orange-700{background-color:#e64a19}.border-deep-orange-700{border-color:#e64a19}.fill-deep-orange-700{fill:#e64a19}.stroke-deep-orange-700{stroke:#e64a19}.color-deep-orange-800{color:#d84315}.bg-deep-orange-800{background-color:#d84315}.border-deep-orange-800{border-color:#d84315}.fill-deep-orange-800{fill:#d84315}.stroke-deep-orange-800{stroke:#d84315}.color-deep-orange-900{color:#bf360c}.bg-deep-orange-900{background-color:#bf360c}.border-deep-orange-900{border-color:#bf360c}.fill-deep-orange-900{fill:#bf360c}.stroke-deep-orange-900{stroke:#bf360c}.color-deep-orange-a100{color:#ff9e80}.bg-deep-orange-a100{background-color:#ff9e80}.border-deep-orange-a100{border-color:#ff9e80}.fill-deep-orange-a100{fill:#ff9e80}.stroke-deep-orange-a100{stroke:#ff9e80}.color-deep-orange-a200{color:#ff6e40}.bg-deep-orange-a200{background-color:#ff6e40}.border-deep-orange-a200{border-color:#ff6e40}.fill-deep-orange-a200{fill:#ff6e40}.stroke-deep-orange-a200{stroke:#ff6e40}.color-deep-orange-a400{color:#ff3d00}.bg-deep-orange-a400{background-color:#ff3d00}.border-deep-orange-a400{border-color:#ff3d00}.fill-deep-orange-a400{fill:#ff3d00}.stroke-deep-orange-a400{stroke:#ff3d00}.color-deep-orange-a700{color:#dd2c00}.bg-deep-orange-a700{background-color:#dd2c00}.border-deep-orange-a700{border-color:#dd2c00}.fill-deep-orange-a700{fill:#dd2c00}.stroke-deep-orange-a700{stroke:#dd2c00}.color-brown-50{color:#efebe9}.bg-brown-50{background-color:#efebe9}.border-brown-50{border-color:#efebe9}.fill-brown-50{fill:#efebe9}.stroke-brown-50{stroke:#efebe9}.color-brown-100{color:#d7ccc8}.bg-brown-100{background-color:#d7ccc8}.border-brown-100{border-color:#d7ccc8}.fill-brown-100{fill:#d7ccc8}.stroke-brown-100{stroke:#d7ccc8}.color-brown-200{color:#bcaaa4}.bg-brown-200{background-color:#bcaaa4}.border-brown-200{border-color:#bcaaa4}.fill-brown-200{fill:#bcaaa4}.stroke-brown-200{stroke:#bcaaa4}.color-brown-300{color:#a1887f}.bg-brown-300{background-color:#a1887f}.border-brown-300{border-color:#a1887f}.fill-brown-300{fill:#a1887f}.stroke-brown-300{stroke:#a1887f}.color-brown-400{color:#8d6e63}.bg-brown-400{background-color:#8d6e63}.border-brown-400{border-color:#8d6e63}.fill-brown-400{fill:#8d6e63}.stroke-brown-400{stroke:#8d6e63}.color-brown-500{color:#795548}.bg-brown-500{background-color:#795548}.border-brown-500{border-color:#795548}.fill-brown-500{fill:#795548}.stroke-brown-500{stroke:#795548}.color-brown-600{color:#6d4c41}.bg-brown-600{background-color:#6d4c41}.border-brown-600{border-color:#6d4c41}.fill-brown-600{fill:#6d4c41}.stroke-brown-600{stroke:#6d4c41}.color-brown-700{color:#5d4037}.bg-brown-700{background-color:#5d4037}.border-brown-700{border-color:#5d4037}.fill-brown-700{fill:#5d4037}.stroke-brown-700{stroke:#5d4037}.color-brown-800{color:#4e342e}.bg-brown-800{background-color:#4e342e}.border-brown-800{border-color:#4e342e}.fill-brown-800{fill:#4e342e}.stroke-brown-800{stroke:#4e342e}.color-brown-900{color:#3e2723}.bg-brown-900{background-color:#3e2723}.border-brown-900{border-color:#3e2723}.fill-brown-900{fill:#3e2723}.stroke-brown-900{stroke:#3e2723}.color-grey-50{color:#fafafa}.bg-grey-50{background-color:#fafafa}.border-grey-50{border-color:#fafafa}.fill-grey-50{fill:#fafafa}.stroke-grey-50{stroke:#fafafa}.color-grey-100{color:#f5f5f5}.bg-grey-100{background-color:#f5f5f5}.border-grey-100{border-color:#f5f5f5}.fill-grey-100{fill:#f5f5f5}.stroke-grey-100{stroke:#f5f5f5}.color-grey-200{color:#eee}.bg-grey-200{background-color:#eee}.border-grey-200{border-color:#eee}.fill-grey-200{fill:#eee}.stroke-grey-200{stroke:#eee}.color-grey-300{color:#e0e0e0}.bg-grey-300{background-color:#e0e0e0}.border-grey-300{border-color:#e0e0e0}.fill-grey-300{fill:#e0e0e0}.stroke-grey-300{stroke:#e0e0e0}.color-grey-400{color:#bdbdbd}.bg-grey-400{background-color:#bdbdbd}.border-grey-400{border-color:#bdbdbd}.fill-grey-400{fill:#bdbdbd}.stroke-grey-400{stroke:#bdbdbd}.color-grey-500{color:#9e9e9e}.bg-grey-500{background-color:#9e9e9e}.border-grey-500{border-color:#9e9e9e}.fill-grey-500{fill:#9e9e9e}.stroke-grey-500{stroke:#9e9e9e}.color-grey-600{color:#757575}.bg-grey-600{background-color:#757575}.border-grey-600{border-color:#757575}.fill-grey-600{fill:#757575}.stroke-grey-600{stroke:#757575}.color-grey-700{color:#616161}.bg-grey-700{background-color:#616161}.border-grey-700{border-color:#616161}.fill-grey-700{fill:#616161}.stroke-grey-700{stroke:#616161}.color-grey-800{color:#424242}.bg-grey-800{background-color:#424242}.border-grey-800{border-color:#424242}.fill-grey-800{fill:#424242}.stroke-grey-800{stroke:#424242}.color-grey-900{color:#212121}.bg-grey-900{background-color:#212121}.border-grey-900{border-color:#212121}.fill-grey-900{fill:#212121}.stroke-grey-900{stroke:#212121}.color-blue-grey-50{color:#eceff1}.bg-blue-grey-50{background-color:#eceff1}.border-blue-grey-50{border-color:#eceff1}.fill-blue-grey-50{fill:#eceff1}.stroke-blue-grey-50{stroke:#eceff1}.color-blue-grey-100{color:#cfd8dc}.bg-blue-grey-100{background-color:#cfd8dc}.border-blue-grey-100{border-color:#cfd8dc}.fill-blue-grey-100{fill:#cfd8dc}.stroke-blue-grey-100{stroke:#cfd8dc}.color-blue-grey-200{color:#b0bec5}.bg-blue-grey-200{background-color:#b0bec5}.border-blue-grey-200{border-color:#b0bec5}.fill-blue-grey-200{fill:#b0bec5}.stroke-blue-grey-200{stroke:#b0bec5}.color-blue-grey-300{color:#90a4ae}.bg-blue-grey-300{background-color:#90a4ae}.border-blue-grey-300{border-color:#90a4ae}.fill-blue-grey-300{fill:#90a4ae}.stroke-blue-grey-300{stroke:#90a4ae}.color-blue-grey-400{color:#78909c}.bg-blue-grey-400{background-color:#78909c}.border-blue-grey-400{border-color:#78909c}.fill-blue-grey-400{fill:#78909c}.stroke-blue-grey-400{stroke:#78909c}.color-blue-grey-500{color:#607d8b}.bg-blue-grey-500{background-color:#607d8b}.border-blue-grey-500{border-color:#607d8b}.fill-blue-grey-500{fill:#607d8b}.stroke-blue-grey-500{stroke:#607d8b}.color-blue-grey-600{color:#546e7a}.bg-blue-grey-600{background-color:#546e7a}.border-blue-grey-600{border-color:#546e7a}.fill-blue-grey-600{fill:#546e7a}.stroke-blue-grey-600{stroke:#546e7a}.color-blue-grey-700{color:#455a64}.bg-blue-grey-700{background-color:#455a64}.border-blue-grey-700{border-color:#455a64}.fill-blue-grey-700{fill:#455a64}.stroke-blue-grey-700{stroke:#455a64}.color-blue-grey-800{color:#37474f}.bg-blue-grey-800{background-color:#37474f}.border-blue-grey-800{border-color:#37474f}.fill-blue-grey-800{fill:#37474f}.stroke-blue-grey-800{stroke:#37474f}.color-blue-grey-900{color:#263238}.bg-blue-grey-900{background-color:#263238}.border-blue-grey-900{border-color:#263238}.fill-blue-grey-900{fill:#263238}.stroke-blue-grey-900{stroke:#263238}.color-white{color:#fff}.bg-white{background-color:#fff}.border-white{border-color:#fff}.fill-white{fill:#fff}.stroke-white{stroke:#fff}.color-black{color:#000}.bg-black{background-color:#000}.border-black{border-color:#000}.fill-black{fill:#000}.stroke-black{stroke:#000}
--------------------------------------------------------------------------------
/dist/material.min.js:
--------------------------------------------------------------------------------
1 | /******* Material Framework by Tim Nguyen ********/
2 | /** https://github.com/nt1m/material-framework/ **/
3 | "use strict";function Material(a){this.initialised=!1;var b=a&&a.hasOwnProperty("modules")?a.modules:null,c=a&&a.hasOwnProperty("options")?a.options:null;this.init(b,c)}var console=window.console=window.console||{};Material.prototype.init=function(a,b){if(!this.initialised){if(!a)var a=["Dialog","Responsive","SideMenu","Ripple","DropdownMenu","FancyHeader"];for(var c=0,d=a.length;d>c;c++){var e=a[c];if(!window.hasOwnProperty(e)||!window[e].hasOwnProperty("init")||!window[e].isMaterialModule)return void console.warn("[material.init] Module not found : "+e);b&&b[e]?window[e].init(b[e]):window[e].init()}this.initialised=!0}};var Responsive={initialised:!1,isMaterialModule:!0,constructor:Responsive,init:function(){this.initialised||(this.onResize(),window.addEventListener("resize",this.onResize.bind(this)),this.initialised=!0)},onResize:function(){var a=window.innerWidth,b=this.device;a>1e3?this.device="desktop":a>450?this.device="tablet":this.device="phone",document.body.classList.remove(b),document.body.classList.add(this.device)},addResizeHandler:function(a){window.addEventListener("resize",a)},removeResizeHandler:function(a){window.removeEventListener("resize",a)}},Theme={isMaterialModule:!0,toggle:function(a){var b=a||document.body;b.classList.contains("dark-theme")?b.classList.remove("dark-theme"):b.classList.add("dark-theme")},setTheme:function(a,b){var c=b||document.body;switch(a){case"light":c.classList.remove("dark-theme");break;case"dark":c.classList.add("dark-theme");break;default:console.log("[Theme.setTheme] Unknown theme : "+a)}}},SideMenu={initialised:!1,isMaterialModule:!0,constructor:SideMenu,init:function(a){this.initialised||(this.createOverlay(),a&&a.overlay&&this.setOverlay(a.overlay),this.overlay.addEventListener("click",function(){for(var a=document.querySelectorAll(".sidemenu"),b=0,c=a.length;c>b;b++){var d=a[b];d.hidden||d.classList.contains("sidebar")&&"undefined"!=typeof Responsive&&"desktop"===Responsive.device||this.hide(d)}}.bind(this)),"undefined"!=typeof Responsive&&Responsive.addResizeHandler(this.onResize.bind(this)),this.onResize(),this.initialised=!0)},createOverlay:function(){if(document.querySelector(".sidemenu-overlay"))return void(this.overlay=document.querySelectorAll(".sidemenu-overlay")[0]);var a=document.createElement("div");a.className="overlay sidemenu-overlay",a.hidden=!0,a.setAttribute("id","mf_overlay_"+Math.floor(1e5*Math.random())),document.body.appendChild(a),this.overlay=a},toggle:function(a){a.classList.contains("sidebar")&&"undefined"!=typeof Responsive&&"desktop"===Responsive.device||(this.overlay.hidden=!a.hidden),a.hidden=!a.hidden},show:function(a){a.classList.contains("sidebar")&&"undefined"!=typeof Responsive&&"desktop"===Responsive.device||(this.overlay.hidden=!1),a.hidden=!1},hide:function(a){this.overlay.hidden=!0,a.hidden=!0},onResize:function(){for(var a=document.querySelectorAll(".sidebar"),b=0,c=a.length;c>b;b++)"desktop"==Responsive.device?this.show(a[b]):this.hide(a[b])}},Dialog={initialised:!1,isMaterialModule:!0,callback:null,constructor:Dialog,init:function(){if(!this.initialised){this.createOverlay();for(var a=document.querySelectorAll(".dialog-confirm, .dialog-close"),b=0,c=a.length;c>b;b++)a[b].addEventListener("click",this.hideCurrentDialog.bind(this));this.initialised=!0}},createOverlay:function(){if(document.querySelector(".dialog-overlay"))return void(this.overlay=document.querySelectorAll(".dialog-overlay")[0]);var a=document.createElement("div");a.className="overlay dialog-overlay",a.hidden=!0,a.setAttribute("id","mf_overlay_"+Math.floor(1e5*Math.random())),document.body.appendChild(a),this.overlay=a},show:function(a,b){this.overlay.hidden=!1,a.hidden=!1,b&&(this.callback=b)},hide:function(a){this.overlay.hidden=!0,a.hidden=!0},toggle:function(a){this.overlay.hidden=!a.hidden,a.hidden=!a.hidden},getCurrentDialog:function(){return document.querySelector(".dialog:not([hidden])")},hideCurrentDialog:function(a){this.hide(this.getCurrentDialog()),this.callback&&(this.callback(a.target),this.callback=null)}},Ripple={isMaterialModule:!0,initialised:!1,constructor:Ripple,init:function(){this.initialised||(document.addEventListener("touchstart",function(){},!1),this.initialised=!0)},onClick:function(a){var b=a.pageX-this.offsetLeft-this.clientWidth/2,c=a.pageY-this.offsetTop-this.clientHeight/2,d=document.createElement("style"),e="data-mf-ripple_"+Math.floor(1e6*Math.random()),f=Math.floor(1e6*Math.random());this.setAttribute(e,f),d.innerHTML="["+e+"='"+f+"']::after {\nleft: "+b+"px;\ntop: "+c+"px;}",document.body.appendChild(d),setTimeout(function(){d.remove(),this.removeAttribute(e)}.bind(this),2e3)}},DropdownMenu={initialised:!1,isMaterialModule:!0,init:function(){if(!this.initialised){var a=[].slice.call(document.querySelectorAll(".dropdown .dropdown-menu"));a.forEach(function(a){a.addEventListener("click",function(a){this.classList.add("active"),a.stopPropagation()})});var b=[].slice.call(document.querySelectorAll(".dropdown .menu li"));b.forEach(function(a){a.addEventListener("click",function(a){this.parentNode.parentNode.querySelector(".dropdown-menu").innerHTML=this.childNodes[0].innerHTML,this.value&&(this.parentNode.parentNode.querySelector(".dropdown-menu").value=this.value);var b=new CustomEvent("change",{});this.parentNode.parentNode.querySelector(".dropdown-menu").dispatchEvent(b)})}),document.body.addEventListener("click",function(){var a=[].slice.call(document.querySelectorAll(".dropdown .dropdown-menu"));a.forEach(function(a){a.classList.remove("active")})})}}},FancyHeader={header:null,scrollTarget:null,state:"show",initialised:!1,isMaterialModule:!0,constructor:FancyHeader,init:function(a){if(!this.initialised){if(!a||null===a.header||null===a.scrollTarget)return void console.warn("[FancyHeader.init] You need to Setup a Header and Scroll-Target (window or obj) at least!");this.header=a.header,this.scrollTarget=a.scrollTarget,this.lastY=this.scrollTarget.scrollY,this.scrollTarget.addEventListener("scroll",this.update.bind(this),!1),this.initialised=!0}},hide:function(){"hide"!=this.state&&(this.header.classList.toggle("hide"),this.state="hide")},show:function(){"show"!=this.state&&(this.header.classList.toggle("hide"),this.state="show")},getY:function(a){a(void 0!==this.scrollTarget.pageYOffset?this.scrollTarget.pageYOffset:void 0!==this.scrollTarget.scrollTop?this.scrollTarget.scrollTop:(document.documentElement||document.body.parentNode||document.body).scrollTop)},update:function(){this.getY(function(a){var b=a>this.lastY?"down":"up";"down"==b?this.hide():"up"==b&&this.show(),this.lastY=a}.bind(this))}};
--------------------------------------------------------------------------------
/fonts/material-design-icons.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/nt1m/material-framework/c68b0a4d60b812a761ade21b744756e546e2c6ae/fonts/material-design-icons.eot
--------------------------------------------------------------------------------
/fonts/material-design-icons.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/nt1m/material-framework/c68b0a4d60b812a761ade21b744756e546e2c6ae/fonts/material-design-icons.ttf
--------------------------------------------------------------------------------
/fonts/material-design-icons.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/nt1m/material-framework/c68b0a4d60b812a761ade21b744756e546e2c6ae/fonts/material-design-icons.woff
--------------------------------------------------------------------------------
/img/avatar.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/nt1m/material-framework/c68b0a4d60b812a761ade21b744756e546e2c6ae/img/avatar.jpg
--------------------------------------------------------------------------------
/img/sidemenu-hero.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/nt1m/material-framework/c68b0a4d60b812a761ade21b744756e546e2c6ae/img/sidemenu-hero.jpg
--------------------------------------------------------------------------------
/js/material.js:
--------------------------------------------------------------------------------
1 | "use strict";
2 | /* Util */
3 | var console = (window.console = window.console || {});
4 |
5 | function Material(params) {
6 | this.initialised = false;
7 | var modules = params && params.hasOwnProperty("modules") ? params.modules : null;
8 | var options = params && params.hasOwnProperty("options") ? params.options : null;
9 | this.init(modules, options);
10 | }
11 | Material.prototype.init = function(modules, options) {
12 | if (this.initialised) return;
13 | if (!modules) {
14 | var modules = ["Dialog", "Responsive", "SideMenu", "Ripple", "DropdownMenu", "FancyHeader"]
15 | }
16 | for (var i = 0, len = modules.length; i < len; i++) {
17 | var module = modules[i];
18 | if (!window.hasOwnProperty(module) || !window[module].hasOwnProperty("init") || !window[module].isMaterialModule) {
19 | console.warn("[material.init] Module not found : " + module);
20 | return;
21 | }
22 | if (options && options[module]) {
23 | window[module].init(options[module]);
24 | }
25 | else {
26 | window[module].init();
27 | }
28 | }
29 | this.initialised = true;
30 | };
31 |
32 | /* Responsive code */
33 | var Responsive = {
34 | initialised: false,
35 | isMaterialModule: true,
36 | constructor: Responsive,
37 | init: function() {
38 | if (this.initialised) return;
39 | this.onResize();
40 | window.addEventListener("resize", this.onResize.bind(this));
41 | this.initialised = true;
42 | },
43 | onResize: function() {
44 | var width = window.innerWidth,
45 | oldDevice = this.device;
46 | if (width > 1000) {
47 | this.device = "desktop";
48 | }
49 | else if (width > 450) {
50 | this.device = "tablet";
51 | }
52 | else {
53 | this.device = "phone";
54 | }
55 | document.body.classList.remove(oldDevice);
56 | document.body.classList.add(this.device);
57 | },
58 | addResizeHandler: function(handler) {
59 | window.addEventListener("resize", handler);
60 | },
61 | removeResizeHandler: function(handler) {
62 | window.removeEventListener("resize", handler);
63 | }
64 | };
65 |
66 | /* Theme code */
67 | var Theme = {
68 | isMaterialModule: true,
69 | toggle: function(element) {
70 | var el = element || document.body;
71 | if (el.classList.contains("dark-theme")) {
72 | el.classList.remove("dark-theme");
73 | }
74 | else {
75 | el.classList.add("dark-theme");
76 | }
77 | },
78 | setTheme: function(theme, element) {
79 | var el = element || document.body;
80 | switch (theme) {
81 | case "light":
82 | el.classList.remove("dark-theme");
83 | break;
84 | case "dark":
85 | el.classList.add("dark-theme");
86 | break;
87 | default:
88 | console.log("[Theme.setTheme] Unknown theme : " + theme);
89 | break;
90 | }
91 | }
92 | };
93 |
94 | /* SideMenu code */
95 | var SideMenu = {
96 | initialised: false,
97 | isMaterialModule: true,
98 | constructor: SideMenu,
99 | init: function(params) {
100 | if (this.initialised) return;
101 | this.createOverlay();
102 | if (params && params.overlay) {
103 | this.setOverlay(params.overlay);
104 | }
105 | this.overlay.addEventListener("click", function() {
106 | var sidemenus = document.querySelectorAll(".sidemenu");
107 | for (var i = 0, len = sidemenus.length; i < len; i++) {
108 | var sidemenu = sidemenus[i];
109 | if (!sidemenu.hidden && (!sidemenu.classList.contains("sidebar") || (typeof Responsive == "undefined" || Responsive.device !== "desktop"))) {
110 | this.hide(sidemenu);
111 | }
112 | }
113 | }.bind(this));
114 | if (typeof Responsive != "undefined") {
115 | Responsive.addResizeHandler(this.onResize.bind(this));
116 | }
117 | this.onResize();
118 | this.initialised = true;
119 | },
120 | createOverlay: function() {
121 | if (document.querySelector(".sidemenu-overlay")) {
122 | this.overlay = document.querySelectorAll(".sidemenu-overlay")[0];
123 | return;
124 | }
125 | var overlay = document.createElement("div");
126 | overlay.className = "overlay sidemenu-overlay";
127 | overlay.hidden = true;
128 | overlay.setAttribute("id", "mf_overlay_" + Math.floor(Math.random() * 100000));
129 | document.body.appendChild(overlay);
130 | this.overlay = overlay;
131 | },
132 | toggle: function(sm) {
133 | if (!sm.classList.contains("sidebar") || (typeof Responsive == "undefined" || Responsive.device !== "desktop")) {
134 | this.overlay.hidden = !sm.hidden;
135 | }
136 | sm.hidden = !sm.hidden;
137 | },
138 | show: function(sm) {
139 | if (!sm.classList.contains("sidebar") || (typeof Responsive == "undefined" || Responsive.device !== "desktop")) {
140 | this.overlay.hidden = false;
141 | }
142 | sm.hidden = false;
143 | },
144 | hide: function(sm) {
145 | this.overlay.hidden = true;
146 | sm.hidden = true;
147 | },
148 | onResize: function() {
149 | var sidebars = document.querySelectorAll(".sidebar");
150 | for (var i = 0, len = sidebars.length; i < len; i++) {
151 | if (Responsive.device == "desktop") {
152 | this.show(sidebars[i]);
153 | }
154 | else {
155 | this.hide(sidebars[i]);
156 | }
157 | }
158 | }
159 | };
160 |
161 | /* Dialog code */
162 | var Dialog = {
163 | initialised: false,
164 | isMaterialModule: true,
165 | callback: null,
166 | constructor: Dialog,
167 | init: function() {
168 | if (this.initialised) return;
169 | this.createOverlay();
170 | var buttons = document.querySelectorAll(".dialog-confirm, .dialog-close");
171 | for (var i = 0, len = buttons.length; i < len; i++) {
172 | buttons[i].addEventListener("click", this.hideCurrentDialog.bind(this));
173 | }
174 | this.initialised = true;
175 | },
176 | createOverlay: function() {
177 | if (document.querySelector(".dialog-overlay")) {
178 | this.overlay = document.querySelectorAll(".dialog-overlay")[0];
179 | return;
180 | }
181 | var overlay = document.createElement("div");
182 | overlay.className = "overlay dialog-overlay";
183 | overlay.hidden = true;
184 | overlay.setAttribute("id", "mf_overlay_" + Math.floor(Math.random() * 100000));
185 | document.body.appendChild(overlay);
186 | this.overlay = overlay;
187 | },
188 | show: function(dialog, callback) {
189 | this.overlay.hidden = false;
190 | dialog.hidden = false;
191 | if (callback) this.callback = callback;
192 | },
193 | hide: function(dialog) {
194 | this.overlay.hidden = true;
195 | dialog.hidden = true;
196 | },
197 | toggle: function(dialog) {
198 | this.overlay.hidden = !dialog.hidden;
199 | dialog.hidden = !dialog.hidden;
200 | },
201 | getCurrentDialog: function() {
202 | return document.querySelector(".dialog:not([hidden])");
203 | },
204 | hideCurrentDialog: function(e) {
205 | this.hide(this.getCurrentDialog());
206 | if (this.callback) {
207 | this.callback(e.target);
208 | this.callback = null;
209 | }
210 | }
211 | };
212 |
213 | /* Ripple code */
214 | var Ripple = {
215 | isMaterialModule: true,
216 | initialised: false,
217 | constructor : Ripple,
218 | init: function() {
219 | if(this.initialised) return;
220 | // var rippleitems = document.querySelectorAll(".button:not(.no-ripple):not([ripple='none']), .fab:not(.no-ripple):not([ripple='none']), [ripple]:not([ripple='none']), .ripple");
221 | // for (var i = 0; i < rippleitems.length; i++) {
222 | // rippleitems[i].addEventListener("mousedown", this.onClick, false);
223 | // rippleitems[i].addEventListener("touchstart", this.onClick, false);
224 | // }
225 | // Hack to enable :active state on iOS
226 | document.addEventListener("touchstart", function() {}, false);
227 | this.initialised = true;
228 | },
229 | onClick: function(event) {
230 | /* FIXME : This needs fixing */
231 | var x = event.pageX - this.offsetLeft - (this.clientWidth / 2),
232 | y = event.pageY - this.offsetTop - (this.clientHeight / 2),
233 | style = document.createElement("style"),
234 | id = "data-mf-ripple_" + Math.floor(Math.random() * 1000000),
235 | value = Math.floor(Math.random() * 1000000);
236 | this.setAttribute(id, value);
237 | style.innerHTML = "[" + id + "='" + value + "']::after {\n"+
238 | "left: " + x + "px;\n"+
239 | "top: " + y + "px;}";
240 | document.body.appendChild(style);
241 | setTimeout(function() {
242 | style.remove();
243 | this.removeAttribute(id);
244 | }.bind(this), 2000);
245 | }
246 | };
247 |
248 | var DropdownMenu = {
249 | initialised: false,
250 | isMaterialModule: true,
251 | init: function() {
252 | if (this.initialised) return;
253 | var dropdowns = [].slice.call(document.querySelectorAll(".dropdown .dropdown-menu"));
254 | dropdowns.forEach(function (dropdown) {
255 | dropdown.addEventListener("click", function(ev) {
256 | this.classList.add("active");
257 | ev.stopPropagation();
258 | });
259 | });
260 | var dropdownmenus = [].slice.call(document.querySelectorAll(".dropdown .menu li"));
261 | dropdownmenus.forEach(function (menu) {
262 | menu.addEventListener("click", function(ev) {
263 | this.parentNode.parentNode.querySelector(".dropdown-menu").innerHTML = this.childNodes[0].innerHTML;
264 | if (this.value) {
265 | this.parentNode.parentNode.querySelector(".dropdown-menu").value = this.value;
266 | }
267 | var customevent = new CustomEvent("change", {});
268 | this.parentNode.parentNode.querySelector(".dropdown-menu").dispatchEvent(customevent);
269 | });
270 | });
271 | document.body.addEventListener("click", function() {
272 | var dropdowns = [].slice.call(document.querySelectorAll(".dropdown .dropdown-menu"));
273 | dropdowns.forEach(function (dropdown) {
274 | dropdown.classList.remove("active");
275 | });
276 | });
277 | }
278 | }
279 |
280 | /* FancyHeader Experimental
281 | Example usage - demo.js:
282 | FancyHeader.init({
283 | header: document.querySelector(".toolbar"),
284 | scrollTarget: document.querySelector(".main-content")
285 | });
286 | */
287 | var FancyHeader = {
288 | header: null,
289 | scrollTarget: null,
290 | state: "show",
291 | initialised: false,
292 | isMaterialModule: true,
293 | constructor: FancyHeader,
294 | init: function(options) {
295 | if (this.initialised) return;
296 | // Little Setup ?
297 | if (!options || options.header === null || options.scrollTarget === null) {
298 | console.warn("[FancyHeader.init] You need to Setup a Header and Scroll-Target (window or obj) at least!");
299 | return;
300 | }
301 | this.header = options.header;
302 | this.scrollTarget = options.scrollTarget;
303 | // Fix for Paddings
304 | // var headerHeight = Math.max(this.header.scrollHeight, this.header.offsetHeight, this.header.clientHeight);
305 | // var sections = document.querySelectorAll(".navigation-section");
306 | // for (var i = 0, len = sections.length; i < len; i++) {
307 | // sections[i].style.paddingTop = headerHeight + "px";
308 | // }
309 | this.lastY = this.scrollTarget.scrollY;
310 | this.scrollTarget.addEventListener("scroll", this.update.bind(this), false);
311 | this.initialised = true;
312 | },
313 | hide: function() {
314 | if (this.state == "hide") return;
315 | this.header.classList.toggle("hide");
316 | this.state = "hide";
317 | },
318 | show: function() {
319 | if (this.state == "show") return;
320 | this.header.classList.toggle("hide");
321 | this.state = "show";
322 | },
323 | getY: function(cb) {
324 | cb((this.scrollTarget.pageYOffset !== undefined) ? this.scrollTarget.pageYOffset
325 | : (this.scrollTarget.scrollTop !== undefined) ? this.scrollTarget.scrollTop
326 | : (document.documentElement || document.body.parentNode || document.body).scrollTop);
327 | },
328 | update: function() {
329 | this.getY(function(y) {
330 | var direction = y > this.lastY ? "down" : "up";
331 | if (direction == "down") {
332 | this.hide();
333 | }
334 | else if (direction == "up") {
335 | this.show();
336 | }
337 | this.lastY = y;
338 | }.bind(this));
339 | }
340 | };
341 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "material-framework",
3 | "description": "An easy to use Material Design Framework for the web.",
4 | "author": {
5 | "name": "Tim Nguyen",
6 | "email": "ntim.bugs@gmail.com",
7 | "url": "http://nt1m.github.io"
8 | },
9 | "contributors": [
10 | {
11 | "name": "PalmerAL",
12 | "url": "http://github.com/PalmerAL"
13 | }
14 | ],
15 | "version": "2.1.0",
16 | "homepage": "http://nt1m.github.io/material-framework",
17 | "repository" : {
18 | "type": "git",
19 | "url": "https://github.com/nt1m/material-framework.git"
20 | },
21 | "license" : "Apache 2.0",
22 | "devDependencies": {
23 | "grunt": "~0.4.5",
24 | "grunt-autoprefixer": "~1.0.1",
25 | "grunt-contrib-clean": "~0.5.0",
26 | "grunt-contrib-copy": "~0.5.0",
27 | "grunt-contrib-jshint": "~0.10.0",
28 | "grunt-contrib-rename": "0.0.3",
29 | "grunt-contrib-uglify": "~0.5.0",
30 | "grunt-contrib-cssmin": "~0.10.0",
31 | "grunt-contrib-sass": "~0.7.3"
32 | }
33 | }
34 |
--------------------------------------------------------------------------------