├── .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 | --------------------------------------------------------------------------------