diff --git a/404.html b/404.html new file mode 100644 index 0000000..cd752bd --- /dev/null +++ b/404.html @@ -0,0 +1,120 @@ + + + + + +Page not found - ThePhoenixDivision + + + + + + + + + + + +
+ +
+ +
+

Page not found

+ + +
+

404

+ +

Page not found :(

+

The requested page could not be found.

+
+ + +
+
+ + + + + + diff --git a/assets/css/components/_badges.scss b/assets/css/components/_badges.scss new file mode 100644 index 0000000..ffed87d --- /dev/null +++ b/assets/css/components/_badges.scss @@ -0,0 +1,55 @@ +// Badges +span.badge { + min-width: 3rem; + padding: 0 6px; + margin-left: 14px; + text-align: center; + font-size: 1rem; + line-height: $badge-height; + height: $badge-height; + color: color('grey', 'darken-1'); + float: right; + box-sizing: border-box; + + &.new { + font-weight: 300; + font-size: 0.8rem; + color: #fff; + background-color: $badge-bg-color; + border-radius: 2px; + } + &.new:after { + content: " new"; + } + + &[data-badge-caption]::after { + content: " " attr(data-badge-caption); + } +} + +// Special cases +nav ul a span.badge { + display: inline-block; + float: none; + margin-left: 4px; + line-height: $badge-height; + height: $badge-height; + -webkit-font-smoothing: auto; +} + +// Line height centering +.collection-item span.badge { + margin-top: calc(#{$collection-line-height / 2} - #{$badge-height / 2}); +} +.collapsible span.badge { + margin-left: auto; +} +.sidenav span.badge { + margin-top: calc(#{$sidenav-line-height / 2} - #{$badge-height / 2}); +} + +table span.badge { + display: inline-block; + float: none; + margin-left: auto; +} diff --git a/assets/css/components/_buttons.scss b/assets/css/components/_buttons.scss new file mode 100644 index 0000000..44b80c8 --- /dev/null +++ b/assets/css/components/_buttons.scss @@ -0,0 +1,322 @@ +// shared styles +.btn, +.btn-flat { + border: $button-border; + border-radius: $button-radius; + display: inline-block; + height: $button-height; + line-height: $button-height; + padding: $button-padding; + text-transform: uppercase; + vertical-align: middle; + -webkit-tap-highlight-color: transparent; // Gets rid of tap active state +} + +// Disabled shared style +.btn.disabled, +.btn-floating.disabled, +.btn-large.disabled, +.btn-small.disabled, +.btn-flat.disabled, +.btn:disabled, +.btn-floating:disabled, +.btn-large:disabled, +.btn-small:disabled, +.btn-flat:disabled, +.btn[disabled], +.btn-floating[disabled], +.btn-large[disabled], +.btn-small[disabled], +.btn-flat[disabled] { + pointer-events: none; + background-color: $button-disabled-background !important; + box-shadow: none; + color: $button-disabled-color !important; + cursor: default; + &:hover { + background-color: $button-disabled-background !important; + color: $button-disabled-color !important; + } +} + +// Shared icon styles +.btn, +.btn-floating, +.btn-large, +.btn-small, +.btn-flat { + font-size: $button-font-size; + outline: 0; + i { + font-size: $button-icon-font-size; + line-height: inherit; + } +} + +// Shared focus button style +.btn, +.btn-floating { + &:focus { + background-color: darken($button-raised-background, 10%); + } +} + +// Raised Button +.btn { + text-decoration: none; + color: $button-raised-color; + background-color: $button-raised-background; + text-align: center; + letter-spacing: .5px; + @extend .z-depth-1; + transition: background-color .2s ease-out; + cursor: pointer; + &:hover { + background-color: $button-raised-background-hover; + @extend .z-depth-1-half; + } +} + +// Floating button +.btn-floating { + &:hover { + background-color: $button-floating-background-hover; + @extend .z-depth-1-half; + } + &:before { + border-radius: 0; + } + &.btn-large { + &.halfway-fab { + bottom: -$button-floating-large-size / 2; + } + width: $button-floating-large-size; + height: $button-floating-large-size; + padding: 0; + i { + line-height: $button-floating-large-size; + } + } + + &.btn-small { + &.halfway-fab { + bottom: -$button-floating-small-size / 2; + } + width: $button-floating-small-size; + height: $button-floating-small-size; + i { + line-height: $button-floating-small-size; + } + } + + &.halfway-fab { + &.left { + right: auto; + left: 24px; + } + position: absolute; + right: 24px; + bottom: -$button-floating-size / 2; + } + display: inline-block; + color: $button-floating-color; + position: relative; + overflow: hidden; + z-index: 1; + width: $button-floating-size; + height: $button-floating-size; + line-height: $button-floating-size; + padding: 0; + background-color: $button-floating-background; + border-radius: $button-floating-radius; + @extend .z-depth-1; + transition: background-color .3s; + cursor: pointer; + vertical-align: middle; + i { + width: inherit; + display: inline-block; + text-align: center; + color: $button-floating-color; + font-size: $button-large-icon-font-size; + line-height: $button-floating-size; + } +} + +// button fix +button.btn-floating { + border: $button-border; +} + +// Fixed Action Button +.fixed-action-btn { + &.active { + ul { + visibility: visible; + } + } + + // Directions + &.direction-left, + &.direction-right { + padding: 0 0 0 15px; + ul { + text-align: right; + right: 64px; + top: 50%; + transform: translateY(-50%); + height: 100%; + left: auto; + /*width 100% only goes to width of button container */ + width: 500px; + li { + display: inline-block; + margin: 7.5px 15px 0 0; + } + } + } + &.direction-right { + padding: 0 15px 0 0; + ul { + text-align: left; + direction: rtl; + left: 64px; + right: auto; + li { + margin: 7.5px 0 0 15px; + } + } + } + &.direction-bottom { + padding: 0 0 15px 0; + ul { + top: 64px; + bottom: auto; + display: flex; + flex-direction: column-reverse; + li { + margin: 15px 0 0 0; + } + } + } + &.toolbar { + &.active { + &>a i { + opacity: 0; + } + } + padding: 0; + height: $button-floating-large-size; + ul { + display: flex; + top: 0; + bottom: 0; + z-index: 1; + li { + flex: 1; + display: inline-block; + margin: 0; + height: 100%; + transition: none; + a { + display: block; + overflow: hidden; + position: relative; + width: 100%; + height: 100%; + background-color: transparent; + box-shadow: none; + color: #fff; + line-height: $button-floating-large-size; + z-index: 1; + i { + line-height: inherit; + } + } + } + } + } + position: fixed; + right: 23px; + bottom: 23px; + padding-top: 15px; + margin-bottom: 0; + z-index: 997; + ul { + left: 0; + right: 0; + text-align: center; + position: absolute; + bottom: 64px; + margin: 0; + visibility: hidden; + li { + margin-bottom: 15px; + } + a.btn-floating { + opacity: 0; + } + } + .fab-backdrop { + position: absolute; + top: 0; + left: 0; + z-index: -1; + width: $button-floating-size; + height: $button-floating-size; + background-color: $button-floating-background; + border-radius: $button-floating-radius; + transform: scale(0); + } +} + +// Flat button +.btn-flat { + box-shadow: none; + background-color: transparent; + color: $button-flat-color; + cursor: pointer; + transition: background-color .2s; + &:focus, + &:hover { + box-shadow: none; + } + &:focus { + background-color: rgba(0, 0, 0, .1); + } + &.disabled, + &.btn-flat[disabled] { + background-color: transparent !important; + color: $button-flat-disabled-color !important; + cursor: default; + } +} + +// Large button +.btn-large { + @extend .btn; + height: $button-large-height; + line-height: $button-large-height; + font-size: $button-large-font-size; + padding: 0 28px; + + i { + font-size: $button-large-icon-font-size; + } +} + +// Small button +.btn-small { + @extend .btn; + height: $button-small-height; + line-height: $button-small-height; + font-size: $button-small-font-size; + i { + font-size: $button-small-icon-font-size; + } +} + +// Block button +.btn-block { + display: block; +} diff --git a/assets/css/components/_cards.scss b/assets/css/components/_cards.scss new file mode 100644 index 0000000..fcbf28e --- /dev/null +++ b/assets/css/components/_cards.scss @@ -0,0 +1,195 @@ + + +.card-panel { + transition: box-shadow .25s; + padding: $card-padding; + margin: $element-top-margin 0 $element-bottom-margin 0; + border-radius: 2px; + @extend .z-depth-1; + background-color: $card-bg-color; +} + +.card { + position: relative; + margin: $element-top-margin 0 $element-bottom-margin 0; + background-color: $card-bg-color; + transition: box-shadow .25s; + border-radius: 2px; + @extend .z-depth-1; + + + .card-title { + font-size: 24px; + font-weight: 300; + &.activator { + cursor: pointer; + } + } + + // Card Sizes + &.small, &.medium, &.large { + position: relative; + + .card-image { + max-height: 60%; + overflow: hidden; + } + .card-image + .card-content { + max-height: 40%; + } + .card-content { + max-height: 100%; + overflow: hidden; + } + .card-action { + position: absolute; + bottom: 0; + left: 0; + right: 0; + } + } + + &.small { + height: 300px; + } + + &.medium { + height: 400px; + } + + &.large { + height: 500px; + } + + // Horizontal Cards + &.horizontal { + &.small, &.medium, &.large { + .card-image { + height: 100%; + max-height: none; + overflow: visible; + + img { + height: 100%; + } + } + } + + display: flex; + + .card-image { + max-width: 50%; + img { + border-radius: 2px 0 0 2px; + max-width: 100%; + width: auto; + } + } + + .card-stacked { + display: flex; + flex-direction: column; + flex: 1; + position: relative; + + .card-content { + flex-grow: 1; + } + } + } + + // Sticky Action Section + &.sticky-action { + .card-action { + z-index: 2; + } + + .card-reveal { + z-index: 1; + padding-bottom: 64px; + } + } + + + + + .card-image { + position: relative; + + // Image background for content + img { + display: block; + border-radius: 2px 2px 0 0; + position: relative; + left: 0; + right: 0; + top: 0; + bottom: 0; + width: 100%; + } + + .card-title { + color: $card-bg-color; + position: absolute; + bottom: 0; + left: 0; + max-width: 100%; + padding: $card-padding; + } + } + + .card-content { + padding: $card-padding; + border-radius: 0 0 2px 2px; + + p { + margin: 0; + } + .card-title { + display: block; + line-height: 32px; + margin-bottom: 8px; + + i { + line-height: 32px; + } + } + } + + .card-action { + &:last-child { + border-radius: 0 0 2px 2px; + } + background-color: inherit; // Use inherit to inherit color classes + border-top: 1px solid rgba(160,160,160,.2); + position: relative; + padding: 16px $card-padding; + + a:not(.btn):not(.btn-large):not(.btn-floating) { + color: $card-link-color; + margin-right: $card-padding; + transition: color .3s ease; + text-transform: uppercase; + + &:hover { color: $card-link-color-light; } + } + } + + .card-reveal { + padding: $card-padding; + position: absolute; + background-color: $card-bg-color; + width: 100%; + overflow-y: auto; + left: 0; + top: 100%; + height: 100%; + z-index: 3; + display: none; + + .card-title { + cursor: pointer; + display: block; + } + } +} diff --git a/assets/css/components/_carousel.scss b/assets/css/components/_carousel.scss new file mode 100644 index 0000000..cc36d4b --- /dev/null +++ b/assets/css/components/_carousel.scss @@ -0,0 +1,90 @@ +.carousel { + &.carousel-slider { + top: 0; + left: 0; + + .carousel-fixed-item { + &.with-indicators { + bottom: 68px; + } + + position: absolute; + left: 0; + right: 0; + bottom: 20px; + z-index: 1; + } + + .carousel-item { + width: 100%; + height: 100%; + min-height: $carousel-height; + position: absolute; + top: 0; + left: 0; + + h2 { + font-size: 24px; + font-weight: 500; + line-height: 32px; + } + + p { + font-size: 15px; + } + } + } + + overflow: hidden; + position: relative; + width: 100%; + height: $carousel-height; + perspective: 500px; + transform-style: preserve-3d; + transform-origin: 0% 50%; + + .carousel-item { + visibility: hidden; + width: $carousel-item-width; + height: $carousel-item-height; + position: absolute; + top: 0; + left: 0; + + & > img { + width: 100%; + } + } + + .indicators { + position: absolute; + text-align: center; + left: 0; + right: 0; + bottom: 0; + margin: 0; + + .indicator-item { + &.active { + background-color: #fff; + } + + display: inline-block; + position: relative; + cursor: pointer; + height: 8px; + width: 8px; + margin: 24px 4px; + background-color: rgba(255,255,255,.5); + + transition: background-color .3s; + border-radius: 50%; + } + } + + // Materialbox compatibility + &.scrolling .carousel-item .materialboxed, + .carousel-item:not(.active) .materialboxed { + pointer-events: none; + } +} diff --git a/assets/css/components/_chips.scss b/assets/css/components/_chips.scss new file mode 100644 index 0000000..27744a8 --- /dev/null +++ b/assets/css/components/_chips.scss @@ -0,0 +1,90 @@ +.chip { + &:focus { + outline: none; + background-color: $chip-selected-color; + color: #fff; + } + + display: inline-block; + height: 32px; + font-size: 13px; + font-weight: 500; + color: rgba(0,0,0,.6); + line-height: 32px; + padding: 0 12px; + border-radius: 16px; + background-color: $chip-bg-color; + margin-bottom: $chip-margin; + margin-right: $chip-margin; + + > img { + float: left; + margin: 0 8px 0 -12px; + height: 32px; + width: 32px; + border-radius: 50%; + } + + .close { + cursor: pointer; + float: right; + font-size: 16px; + line-height: 32px; + padding-left: 8px; + } +} + +.chips { + border: none; + border-bottom: 1px solid $chip-border-color; + box-shadow: none; + margin: $input-margin; + min-height: 45px; + outline: none; + transition: all .3s; + + &.focus { + border-bottom: 1px solid $chip-selected-color; + box-shadow: 0 1px 0 0 $chip-selected-color; + } + + &:hover { + cursor: text; + } + + .input { + background: none; + border: 0; + color: rgba(0,0,0,.6); + display: inline-block; + font-size: $input-font-size; + height: $input-height; + line-height: 32px; + outline: 0; + margin: 0; + padding: 0 !important; + width: 120px !important; + } + + .input:focus { + border: 0 !important; + box-shadow: none !important; + } + + // Autocomplete + .autocomplete-content { + margin-top: 0; + margin-bottom: 0; + } +} + +// Form prefix +.prefix ~ .chips { + margin-left: 3rem; + width: 92%; + width: calc(100% - 3rem); +} +.chips:empty ~ label { + font-size: 0.8rem; + transform: translateY(-140%); +} diff --git a/assets/css/components/_collapsible.scss b/assets/css/components/_collapsible.scss new file mode 100644 index 0000000..024324f --- /dev/null +++ b/assets/css/components/_collapsible.scss @@ -0,0 +1,91 @@ +.collapsible { + border-top: 1px solid $collapsible-border-color; + border-right: 1px solid $collapsible-border-color; + border-left: 1px solid $collapsible-border-color; + margin: $element-top-margin 0 $element-bottom-margin 0; + @extend .z-depth-1; +} + +.collapsible-header { + &:focus { + outline: 0 + } + + display: flex; + cursor: pointer; + -webkit-tap-highlight-color: transparent; + line-height: 1.5; + padding: 1rem; + background-color: $collapsible-header-color; + border-bottom: 1px solid $collapsible-border-color; + + i { + width: 2rem; + font-size: 1.6rem; + display: inline-block; + text-align: center; + margin-right: 1rem; + } +} +.keyboard-focused .collapsible-header:focus { + background-color: #eee; +} + +.collapsible-body { + display: none; + border-bottom: 1px solid $collapsible-border-color; + box-sizing: border-box; + padding: 2rem; +} + +// Sidenav collapsible styling +.sidenav, +.sidenav.fixed { + + .collapsible { + border: none; + box-shadow: none; + + li { padding: 0; } + } + + .collapsible-header { + background-color: transparent; + border: none; + line-height: inherit; + height: inherit; + padding: 0 $sidenav-padding; + + &:hover { background-color: rgba(0,0,0,.05); } + i { line-height: inherit; } + } + + .collapsible-body { + border: 0; + background-color: $collapsible-header-color; + + li a { + padding: 0 (7.5px + $sidenav-padding) + 0 (15px + $sidenav-padding); + } + } + +} + +// Popout Collapsible + +.collapsible.popout { + border: none; + box-shadow: none; + > li { + box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); + // transform: scaleX(.92); + margin: 0 24px; + transition: margin .35s cubic-bezier(0.250, 0.460, 0.450, 0.940); + } + > li.active { + box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15); + margin: 16px 0; + // transform: scaleX(1); + } +} diff --git a/assets/css/components/_color-classes.scss b/assets/css/components/_color-classes.scss new file mode 100644 index 0000000..155cecd --- /dev/null +++ b/assets/css/components/_color-classes.scss @@ -0,0 +1,32 @@ +// Color Classes + +@each $color_name, $color in $colors { + @each $color_type, $color_value in $color { + @if $color_type == "base" { + .#{$color_name} { + background-color: $color_value !important; + } + .#{$color_name}-text { + color: $color_value !important; + } + } + @else if $color_name != "shades" { + .#{$color_name}.#{$color_type} { + background-color: $color_value !important; + } + .#{$color_name}-text.text-#{$color_type} { + color: $color_value !important; + } + } + } +} + +// Shade classes +@each $color, $color_value in $shades { + .#{$color} { + background-color: $color_value !important; + } + .#{$color}-text { + color: $color_value !important; + } +} diff --git a/assets/css/components/_color-variables.scss b/assets/css/components/_color-variables.scss new file mode 100644 index 0000000..062f6a5 --- /dev/null +++ b/assets/css/components/_color-variables.scss @@ -0,0 +1,370 @@ +// Google Color Palette defined: http://www.google.com/design/spec/style/color.html + +$materialize-red: ( + "base": #e51c23, + "lighten-5": #fdeaeb, + "lighten-4": #f8c1c3, + "lighten-3": #f3989b, + "lighten-2": #ee6e73, + "lighten-1": #ea454b, + "darken-1": #d0181e, + "darken-2": #b9151b, + "darken-3": #a21318, + "darken-4": #8b1014, +); + +$red: ( + "base": #F44336, + "lighten-5": #FFEBEE, + "lighten-4": #FFCDD2, + "lighten-3": #EF9A9A, + "lighten-2": #E57373, + "lighten-1": #EF5350, + "darken-1": #E53935, + "darken-2": #D32F2F, + "darken-3": #C62828, + "darken-4": #B71C1C, + "accent-1": #FF8A80, + "accent-2": #FF5252, + "accent-3": #FF1744, + "accent-4": #D50000 +); + +$pink: ( + "base": #e91e63, + "lighten-5": #fce4ec, + "lighten-4": #f8bbd0, + "lighten-3": #f48fb1, + "lighten-2": #f06292, + "lighten-1": #ec407a, + "darken-1": #d81b60, + "darken-2": #c2185b, + "darken-3": #ad1457, + "darken-4": #880e4f, + "accent-1": #ff80ab, + "accent-2": #ff4081, + "accent-3": #f50057, + "accent-4": #c51162 +); + +$purple: ( + "base": #9c27b0, + "lighten-5": #f3e5f5, + "lighten-4": #e1bee7, + "lighten-3": #ce93d8, + "lighten-2": #ba68c8, + "lighten-1": #ab47bc, + "darken-1": #8e24aa, + "darken-2": #7b1fa2, + "darken-3": #6a1b9a, + "darken-4": #4a148c, + "accent-1": #ea80fc, + "accent-2": #e040fb, + "accent-3": #d500f9, + "accent-4": #aa00ff +); + +$deep-purple: ( + "base": #673ab7, + "lighten-5": #ede7f6, + "lighten-4": #d1c4e9, + "lighten-3": #b39ddb, + "lighten-2": #9575cd, + "lighten-1": #7e57c2, + "darken-1": #5e35b1, + "darken-2": #512da8, + "darken-3": #4527a0, + "darken-4": #311b92, + "accent-1": #b388ff, + "accent-2": #7c4dff, + "accent-3": #651fff, + "accent-4": #6200ea +); + +$indigo: ( + "base": #3f51b5, + "lighten-5": #e8eaf6, + "lighten-4": #c5cae9, + "lighten-3": #9fa8da, + "lighten-2": #7986cb, + "lighten-1": #5c6bc0, + "darken-1": #3949ab, + "darken-2": #303f9f, + "darken-3": #283593, + "darken-4": #1a237e, + "accent-1": #8c9eff, + "accent-2": #536dfe, + "accent-3": #3d5afe, + "accent-4": #304ffe +); + +$blue: ( + "base": #2196F3, + "lighten-5": #E3F2FD, + "lighten-4": #BBDEFB, + "lighten-3": #90CAF9, + "lighten-2": #64B5F6, + "lighten-1": #42A5F5, + "darken-1": #1E88E5, + "darken-2": #1976D2, + "darken-3": #1565C0, + "darken-4": #0D47A1, + "accent-1": #82B1FF, + "accent-2": #448AFF, + "accent-3": #2979FF, + "accent-4": #2962FF +); + +$light-blue: ( + "base": #03a9f4, + "lighten-5": #e1f5fe, + "lighten-4": #b3e5fc, + "lighten-3": #81d4fa, + "lighten-2": #4fc3f7, + "lighten-1": #29b6f6, + "darken-1": #039be5, + "darken-2": #0288d1, + "darken-3": #0277bd, + "darken-4": #01579b, + "accent-1": #80d8ff, + "accent-2": #40c4ff, + "accent-3": #00b0ff, + "accent-4": #0091ea +); + +$cyan: ( + "base": #00bcd4, + "lighten-5": #e0f7fa, + "lighten-4": #b2ebf2, + "lighten-3": #80deea, + "lighten-2": #4dd0e1, + "lighten-1": #26c6da, + "darken-1": #00acc1, + "darken-2": #0097a7, + "darken-3": #00838f, + "darken-4": #006064, + "accent-1": #84ffff, + "accent-2": #18ffff, + "accent-3": #00e5ff, + "accent-4": #00b8d4 +); + +$teal: ( + "base": #009688, + "lighten-5": #e0f2f1, + "lighten-4": #b2dfdb, + "lighten-3": #80cbc4, + "lighten-2": #4db6ac, + "lighten-1": #26a69a, + "darken-1": #00897b, + "darken-2": #00796b, + "darken-3": #00695c, + "darken-4": #004d40, + "accent-1": #a7ffeb, + "accent-2": #64ffda, + "accent-3": #1de9b6, + "accent-4": #00bfa5 +); + +$green: ( + "base": #4CAF50, + "lighten-5": #E8F5E9, + "lighten-4": #C8E6C9, + "lighten-3": #A5D6A7, + "lighten-2": #81C784, + "lighten-1": #66BB6A, + "darken-1": #43A047, + "darken-2": #388E3C, + "darken-3": #2E7D32, + "darken-4": #1B5E20, + "accent-1": #B9F6CA, + "accent-2": #69F0AE, + "accent-3": #00E676, + "accent-4": #00C853 +); + +$light-green: ( + "base": #8bc34a, + "lighten-5": #f1f8e9, + "lighten-4": #dcedc8, + "lighten-3": #c5e1a5, + "lighten-2": #aed581, + "lighten-1": #9ccc65, + "darken-1": #7cb342, + "darken-2": #689f38, + "darken-3": #558b2f, + "darken-4": #33691e, + "accent-1": #ccff90, + "accent-2": #b2ff59, + "accent-3": #76ff03, + "accent-4": #64dd17 +); + +$lime: ( + "base": #cddc39, + "lighten-5": #f9fbe7, + "lighten-4": #f0f4c3, + "lighten-3": #e6ee9c, + "lighten-2": #dce775, + "lighten-1": #d4e157, + "darken-1": #c0ca33, + "darken-2": #afb42b, + "darken-3": #9e9d24, + "darken-4": #827717, + "accent-1": #f4ff81, + "accent-2": #eeff41, + "accent-3": #c6ff00, + "accent-4": #aeea00 +); + +$yellow: ( + "base": #ffeb3b, + "lighten-5": #fffde7, + "lighten-4": #fff9c4, + "lighten-3": #fff59d, + "lighten-2": #fff176, + "lighten-1": #ffee58, + "darken-1": #fdd835, + "darken-2": #fbc02d, + "darken-3": #f9a825, + "darken-4": #f57f17, + "accent-1": #ffff8d, + "accent-2": #ffff00, + "accent-3": #ffea00, + "accent-4": #ffd600 +); + +$amber: ( + "base": #ffc107, + "lighten-5": #fff8e1, + "lighten-4": #ffecb3, + "lighten-3": #ffe082, + "lighten-2": #ffd54f, + "lighten-1": #ffca28, + "darken-1": #ffb300, + "darken-2": #ffa000, + "darken-3": #ff8f00, + "darken-4": #ff6f00, + "accent-1": #ffe57f, + "accent-2": #ffd740, + "accent-3": #ffc400, + "accent-4": #ffab00 +); + +$orange: ( + "base": #ff9800, + "lighten-5": #fff3e0, + "lighten-4": #ffe0b2, + "lighten-3": #ffcc80, + "lighten-2": #ffb74d, + "lighten-1": #ffa726, + "darken-1": #fb8c00, + "darken-2": #f57c00, + "darken-3": #ef6c00, + "darken-4": #e65100, + "accent-1": #ffd180, + "accent-2": #ffab40, + "accent-3": #ff9100, + "accent-4": #ff6d00 +); + +$deep-orange: ( + "base": #ff5722, + "lighten-5": #fbe9e7, + "lighten-4": #ffccbc, + "lighten-3": #ffab91, + "lighten-2": #ff8a65, + "lighten-1": #ff7043, + "darken-1": #f4511e, + "darken-2": #e64a19, + "darken-3": #d84315, + "darken-4": #bf360c, + "accent-1": #ff9e80, + "accent-2": #ff6e40, + "accent-3": #ff3d00, + "accent-4": #dd2c00 +); + +$brown: ( + "base": #795548, + "lighten-5": #efebe9, + "lighten-4": #d7ccc8, + "lighten-3": #bcaaa4, + "lighten-2": #a1887f, + "lighten-1": #8d6e63, + "darken-1": #6d4c41, + "darken-2": #5d4037, + "darken-3": #4e342e, + "darken-4": #3e2723 +); + +$blue-grey: ( + "base": #607d8b, + "lighten-5": #eceff1, + "lighten-4": #cfd8dc, + "lighten-3": #b0bec5, + "lighten-2": #90a4ae, + "lighten-1": #78909c, + "darken-1": #546e7a, + "darken-2": #455a64, + "darken-3": #37474f, + "darken-4": #263238 +); + +$grey: ( + "base": #9e9e9e, + "lighten-5": #fafafa, + "lighten-4": #f5f5f5, + "lighten-3": #eeeeee, + "lighten-2": #e0e0e0, + "lighten-1": #bdbdbd, + "darken-1": #757575, + "darken-2": #616161, + "darken-3": #424242, + "darken-4": #212121 +); + +$shades: ( + "black": #000000, + "white": #FFFFFF, + "transparent": transparent +); + +$colors: ( + "materialize-red": $materialize-red, + "red": $red, + "pink": $pink, + "purple": $purple, + "deep-purple": $deep-purple, + "indigo": $indigo, + "blue": $blue, + "light-blue": $light-blue, + "cyan": $cyan, + "teal": $teal, + "green": $green, + "light-green": $light-green, + "lime": $lime, + "yellow": $yellow, + "amber": $amber, + "orange": $orange, + "deep-orange": $deep-orange, + "brown": $brown, + "blue-grey": $blue-grey, + "grey": $grey, + "shades": $shades +) !default; + + +// usage: color("name_of_color", "type_of_color") +// to avoid to repeating map-get($colors, ...) + +@function color($color, $type) { + @if map-has-key($colors, $color) { + $curr_color: map-get($colors, $color); + @if map-has-key($curr_color, $type) { + @return map-get($curr_color, $type); + } + } + @warn "Unknown `#{$color}` - `#{$type}` in $colors."; + @return null; +} diff --git a/assets/css/components/_datepicker.scss b/assets/css/components/_datepicker.scss new file mode 100644 index 0000000..d2c920b --- /dev/null +++ b/assets/css/components/_datepicker.scss @@ -0,0 +1,191 @@ +/* Modal */ +.datepicker-modal { + max-width: 325px; + min-width: 300px; + max-height: none; +} + +.datepicker-container.modal-content { + display: flex; + flex-direction: column; + padding: 0; +} + +.datepicker-controls { + display: flex; + justify-content: space-between; + width: 280px; + margin: 0 auto; + + .selects-container { + display: flex; + } + + .select-wrapper { + input { + &:focus { + border-bottom: none; + } + border-bottom: none; + text-align: center; + margin: 0; + } + + .caret { + display: none; + } + } + + .select-year input { + width: 50px; + } + + .select-month input { + width: 70px; + } +} + +.month-prev, .month-next { + margin-top: 4px; + cursor: pointer; + background-color: transparent; + border: none; +} + + +/* Date Display */ +.datepicker-date-display { + flex: 1 auto; + background-color: $secondary-color; + color: #fff; + padding: 20px 22px; + font-weight: 500; + + .year-text { + display: block; + font-size: 1.5rem; + line-height: 25px; + color: $datepicker-year; + } + + .date-text { + display: block; + font-size: 2.8rem; + line-height: 47px; + font-weight: 500; + } +} + + +/* Calendar */ +.datepicker-calendar-container { + flex: 2.5 auto; +} + +.datepicker-table { + width: 280px; + font-size: 1rem; + margin: 0 auto; + + thead { + border-bottom: none; + } + + th { + padding: 10px 5px; + text-align: center; + } + + tr { + border: none; + } + + abbr { + text-decoration: none; + color: $datepicker-calendar-header-color; + } + + td { + &.is-today { + color: $secondary-color; + } + + &.is-selected { + background-color: $secondary-color; + color: #fff; + } + + &.is-outside-current-month, + &.is-disabled { + color: $datepicker-disabled-day-color; + pointer-events: none; + } + + border-radius: 50%; + padding: 0; + } +} + +.datepicker-day-button { + &:focus { + background-color: $datepicker-day-focus; + } + + background-color: transparent; + border: none; + line-height: 38px; + display: block; + width: 100%; + border-radius: 50%; + padding: 0 5px; + cursor: pointer; + color: inherit; +} + + +/* Footer */ +.datepicker-footer { + width: 280px; + margin: 0 auto; + padding-bottom: 5px; + display: flex; + justify-content: space-between; +} + +.datepicker-cancel, +.datepicker-clear, +.datepicker-today, +.datepicker-done { + color: $secondary-color; + padding: 0 1rem; +} + +.datepicker-clear { + color: $error-color; +} + + +/* Media Queries */ +@media #{$medium-and-up} { + .datepicker-modal { + max-width: 625px; + } + + .datepicker-container.modal-content { + flex-direction: row; + } + + .datepicker-date-display { + flex: 0 1 270px; + } + + .datepicker-controls, + .datepicker-table, + .datepicker-footer { + width: 320px; + } + + .datepicker-day-button { + line-height: 44px; + } +} diff --git a/assets/css/components/_dropdown.scss b/assets/css/components/_dropdown.scss new file mode 100644 index 0000000..0caae65 --- /dev/null +++ b/assets/css/components/_dropdown.scss @@ -0,0 +1,85 @@ +.dropdown-content { + &:focus { + outline: 0; + } + + + @extend .z-depth-1; + background-color: $dropdown-bg-color; + margin: 0; + display: none; + min-width: 100px; + overflow-y: auto; + opacity: 0; + position: absolute; + left: 0; + top: 0; + z-index: 9999; // TODO: Check if this doesn't break other things + transform-origin: 0 0; + + + li { + &:hover, &.active { + background-color: $dropdown-hover-bg-color; + } + + &:focus { + outline: none; + } + + &.divider { + min-height: 0; + height: 1px; + } + + & > a, & > span { + font-size: 16px; + color: $dropdown-color; + display: block; + line-height: 22px; + padding: (($dropdown-item-height - 22) / 2) 16px; + } + + & > span > label { + top: 1px; + left: 0; + height: 18px; + } + + // Icon alignment override + & > a > i { + height: inherit; + line-height: inherit; + float: left; + margin: 0 24px 0 0; + width: 24px; + } + + + clear: both; + color: $off-black; + cursor: pointer; + min-height: $dropdown-item-height; + line-height: 1.5rem; + width: 100%; + text-align: left; + } +} + +body.keyboard-focused { + .dropdown-content li:focus { + background-color: darken($dropdown-hover-bg-color, 8%); + } +} + +// Input field specificity bugfix +.input-field.col .dropdown-content [type="checkbox"] + label { + top: 1px; + left: 0; + height: 18px; + transform: none; +} + +.dropdown-trigger { + cursor: pointer; +} \ No newline at end of file diff --git a/assets/css/components/_global.scss b/assets/css/components/_global.scss new file mode 100644 index 0000000..39f33db --- /dev/null +++ b/assets/css/components/_global.scss @@ -0,0 +1,769 @@ +//Default styles + +html { + box-sizing: border-box; +} +*, *:before, *:after { + box-sizing: inherit; +} + +body { + // display: flex; + // min-height: 100vh; + // flex-direction: column; +} + +main { + // flex: 1 0 auto; +} + +button, +input, +optgroup, +select, +textarea { + font-family: $font-stack; +} + +ul { + &:not(.browser-default) { + padding-left: 0; + list-style-type: none; + + & > li { + list-style-type: none; + } + } +} + +a { + color: $link-color; + text-decoration: none; + + // Gets rid of tap active state + -webkit-tap-highlight-color: transparent; +} + + +// Positioning +.valign-wrapper { + display: flex; + align-items: center; +} + + +// classic clearfix +.clearfix { + clear: both; +} + + +// Z-levels +.z-depth-0 { + box-shadow: none !important; +} + +/* 2dp elevation modified*/ +.z-depth-1 { + box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), + 0 3px 1px -2px rgba(0,0,0,0.12), + 0 1px 5px 0 rgba(0,0,0,0.2); +} +.z-depth-1-half { + box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -1px rgba(0, 0, 0, 0.2); +} + +/* 6dp elevation modified*/ +.z-depth-2 { + box-shadow: 0 4px 5px 0 rgba(0,0,0,0.14), + 0 1px 10px 0 rgba(0,0,0,0.12), + 0 2px 4px -1px rgba(0,0,0,0.3); +} + +/* 12dp elevation modified*/ +.z-depth-3 { + box-shadow: 0 8px 17px 2px rgba(0,0,0,0.14), + 0 3px 14px 2px rgba(0,0,0,0.12), + 0 5px 5px -3px rgba(0, 0, 0, 0.2); +} + +/* 16dp elevation */ +.z-depth-4 { + box-shadow: 0 16px 24px 2px rgba(0,0,0,0.14), + 0 6px 30px 5px rgba(0,0,0,0.12), + 0 8px 10px -7px rgba(0,0,0,0.2); +} + +/* 24dp elevation */ +.z-depth-5 { + box-shadow: 0 24px 38px 3px rgba(0,0,0,0.14), + 0 9px 46px 8px rgba(0,0,0,0.12), + 0 11px 15px -7px rgba(0,0,0,0.2); +} + +.hoverable { + transition: box-shadow .25s; + + &:hover { + box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); + } +} + +// Dividers + +.divider { + height: 1px; + overflow: hidden; + background-color: color("grey", "lighten-2"); +} + + +// Blockquote + +blockquote { + margin: 20px 0; + padding-left: 1.5rem; + border-left: 5px solid $primary-color; +} + +// Icon Styles + +i { + line-height: inherit; + + &.left { + float: left; + margin-right: 15px; + } + &.right { + float: right; + margin-left: 15px; + } + &.tiny { + font-size: 1rem; + } + &.small { + font-size: 2rem; + } + &.medium { + font-size: 4rem; + } + &.large { + font-size: 6rem; + } +} + +// Images +img.responsive-img, +video.responsive-video { + max-width: 100%; + height: auto; +} + + +// Pagination + +.pagination { + + li { + display: inline-block; + border-radius: 2px; + text-align: center; + vertical-align: top; + height: 30px; + + a { + color: #444; + display: inline-block; + font-size: 1.2rem; + padding: 0 10px; + line-height: 30px; + } + + &.active a { color: #fff; } + + &.active { background-color: $primary-color; } + + &.disabled a { + cursor: default; + color: #999; + } + + i { + font-size: 2rem; + } + } + + + li.pages ul li { + display: inline-block; + float: none; + } +} +@media #{$medium-and-down} { + .pagination { + width: 100%; + + li.prev, + li.next { + width: 10%; + } + + li.pages { + width: 80%; + overflow: hidden; + white-space: nowrap; + } + } +} + +// Breadcrumbs +.breadcrumb { + font-size: 18px; + color: rgba(255,255,255, .7); + + i, + [class^="mdi-"], [class*="mdi-"], + i.material-icons { + display: inline-block; + float: left; + font-size: 24px; + } + + &:before { + content: '\E5CC'; + color: rgba(255,255,255, .7); + vertical-align: top; + display: inline-block; + font-family: 'Material Icons'; + font-weight: normal; + font-style: normal; + font-size: 25px; + margin: 0 10px 0 8px; + -webkit-font-smoothing: antialiased; + } + + &:first-child:before { + display: none; + } + + &:last-child { + color: #fff; + } +} + +// Parallax +.parallax-container { + position: relative; + overflow: hidden; + height: 500px; + + .parallax { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + z-index: -1; + + img { + opacity: 0; + position: absolute; + left: 50%; + bottom: 0; + min-width: 100%; + min-height: 100%; + transform: translate3d(0,0,0); + transform: translateX(-50%); + } + } +} + +// Pushpin +.pin-top, .pin-bottom { + position: relative; +} +.pinned { + position: fixed !important; +} + +/********************* + Transition Classes +**********************/ + +ul.staggered-list li { + opacity: 0; +} + +.fade-in { + opacity: 0; + transform-origin: 0 50%; +} + + +/********************* + Media Query Classes +**********************/ +.hide-on-small-only, .hide-on-small-and-down { + @media #{$small-and-down} { + display: none !important; + } +} +.hide-on-med-and-down { + @media #{$medium-and-down} { + display: none !important; + } +} +.hide-on-med-and-up { + @media #{$medium-and-up} { + display: none !important; + } +} +.hide-on-med-only { + @media only screen and (min-width: $small-screen) and (max-width: $medium-screen) { + display: none !important; + } +} +.hide-on-large-only { + @media #{$large-and-up} { + display: none !important; + } +} +.hide-on-extra-large-only { + @media #{$extra-large-and-up} { + display: none !important; + } +} +.show-on-extra-large { + @media #{$extra-large-and-up} { + display: block !important; + } +} +.show-on-large { + @media #{$large-and-up} { + display: block !important; + } +} +.show-on-medium { + @media only screen and (min-width: $small-screen) and (max-width: $medium-screen) { + display: block !important; + } +} +.show-on-small { + @media #{$small-and-down} { + display: block !important; + } +} +.show-on-medium-and-up { + @media #{$medium-and-up} { + display: block !important; + } +} +.show-on-medium-and-down { + @media #{$medium-and-down} { + display: block !important; + } +} + + +// Center text on mobile +.center-on-small-only { + @media #{$small-and-down} { + text-align: center; + } +} + +// Footer +.page-footer { + padding-top: 20px; + color: $footer-font-color; + background-color: $footer-bg-color; + + .footer-copyright { + overflow: hidden; + min-height: 50px; + display: flex; + align-items: center; + justify-content: space-between; + padding: 10px 0px; + color: $footer-copyright-font-color; + background-color: $footer-copyright-bg-color; + } +} + +// Tables +table, th, td { + border: none; +} + +table { + width:100%; + display: table; + border-collapse: collapse; + border-spacing: 0; + + &.striped { + tr { + border-bottom: none; + } + + > tbody { + > tr:nth-child(odd) { + background-color: $table-striped-color; + } + + > tr > td { + border-radius: 0; + } + } + } + + &.highlight > tbody > tr { + transition: background-color .25s ease; + &:hover { + background-color: $table-striped-color; + } + } + + &.centered { + thead tr th, tbody tr td { + text-align: center; + } + } +} + +tr { + border-bottom: 1px solid $table-border-color; +} + +td, th{ + padding: 15px 5px; + display: table-cell; + text-align: left; + vertical-align: middle; + border-radius: 2px; +} + +// Responsive Table +@media #{$medium-and-down} { + + table.responsive-table { + width: 100%; + border-collapse: collapse; + border-spacing: 0; + display: block; + position: relative; + + td:empty:before { + content: '\00a0'; + } + + th, + td { + margin: 0; + vertical-align: top; + } + + th { text-align: left; } + thead { + display: block; + float: left; + + tr { + display: block; + padding: 0 10px 0 0; + + th::before { + content: "\00a0"; + } + } + } + tbody { + display: block; + width: auto; + position: relative; + overflow-x: auto; + white-space: nowrap; + + tr { + display: inline-block; + vertical-align: top; + } + } + th { + display: block; + text-align: right; + } + td { + display: block; + min-height: 1.25em; + text-align: left; + } + tr { + border-bottom: none; + padding: 0 10px; + } + + /* sort out borders */ + thead { + border: 0; + border-right: 1px solid $table-border-color; + } + } + +} + + +// Collections +.collection { + margin: $element-top-margin 0 $element-bottom-margin 0; + border: 1px solid $collection-border-color; + border-radius: 2px; + overflow: hidden; + position: relative; + + .collection-item { + background-color: $collection-bg-color; + line-height: $collection-line-height; + padding: 10px 20px; + margin: 0; + border-bottom: 1px solid $collection-border-color; + + // Avatar Collection + &.avatar { + min-height: 84px; + padding-left: 72px; + position: relative; + + // Don't style circles inside preloader classes. + &:not(.circle-clipper) > .circle, + :not(.circle-clipper) > .circle { + position: absolute; + width: 42px; + height: 42px; + overflow: hidden; + left: 15px; + display: inline-block; + vertical-align: middle; + } + i.circle { + font-size: 18px; + line-height: 42px; + color: #fff; + background-color: #999; + text-align: center; + } + + + .title { + font-size: 16px; + } + + p { + margin: 0; + } + + .secondary-content { + position: absolute; + top: 16px; + right: 16px; + } + + } + + + &:last-child { + border-bottom: none; + } + + &.active { + background-color: $collection-active-bg-color; + color: $collection-active-color; + + .secondary-content { + color: #fff; + } + } + } + a.collection-item{ + display: block; + transition: .25s; + color: $collection-link-color; + &:not(.active) { + &:hover { + background-color: $collection-hover-bg-color; + } + } + } + + &.with-header { + .collection-header { + background-color: $collection-bg-color; + border-bottom: 1px solid $collection-border-color; + padding: 10px 20px; + } + .collection-item { + padding-left: 30px; + } + .collection-item.avatar { + padding-left: 72px; + } + } + +} +// Made less specific to allow easier overriding +.secondary-content { + float: right; + color: $secondary-color; +} +.collapsible .collection { + margin: 0; + border: none; +} + + + +// Responsive Videos +.video-container { + position: relative; + padding-bottom: 56.25%; + height: 0; + overflow: hidden; + + iframe, object, embed { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + } +} + +// Progress Bar +.progress { + position: relative; + height: 4px; + display: block; + width: 100%; + background-color: lighten($progress-bar-color, 40%); + border-radius: 2px; + margin: $element-top-margin 0 $element-bottom-margin 0; + overflow: hidden; + .determinate { + position: absolute; + top: 0; + left: 0; + bottom: 0; + background-color: $progress-bar-color; + transition: width .3s linear; + } + .indeterminate { + background-color: $progress-bar-color; + &:before { + content: ''; + position: absolute; + background-color: inherit; + top: 0; + left:0; + bottom: 0; + will-change: left, right; + // Custom bezier + animation: indeterminate 2.1s cubic-bezier(0.650, 0.815, 0.735, 0.395) infinite; + + } + &:after { + content: ''; + position: absolute; + background-color: inherit; + top: 0; + left:0; + bottom: 0; + will-change: left, right; + // Custom bezier + animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.840, 0.440, 1.000) infinite; + animation-delay: 1.15s; + } + } +} +@keyframes indeterminate { + 0% { + left: -35%; + right:100%; + } + 60% { + left: 100%; + right: -90%; + } + 100% { + left: 100%; + right: -90%; + } +} + +@keyframes indeterminate-short { + 0% { + left: -200%; + right: 100%; + } + 60% { + left: 107%; + right: -8%; + } + 100% { + left: 107%; + right: -8%; + } +} + + +/******************* + Utility Classes +*******************/ + +.hide { + display: none !important; +} + +// Text Align +.left-align { + text-align: left; +} +.right-align { + text-align: right +} +.center, .center-align { + text-align: center; +} + +.left { + float: left !important; +} +.right { + float: right !important; +} + +// No Text Select +.no-select { + user-select: none; +} + +.circle { + border-radius: 50%; +} + +.center-block { + display: block; + margin-left: auto; + margin-right: auto; +} + +.truncate { + display: block; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + +.no-padding { + padding: 0 !important; +} diff --git a/assets/css/components/_grid.scss b/assets/css/components/_grid.scss new file mode 100644 index 0000000..8892f05 --- /dev/null +++ b/assets/css/components/_grid.scss @@ -0,0 +1,156 @@ +.container { + margin: 0 auto; + max-width: 1280px; + width: 90%; +} +@media #{$medium-and-up} { + .container { + width: 85%; + } +} +@media #{$large-and-up} { + .container { + width: 70%; + } +} +.col .row { + margin-left: (-1 * $gutter-width / 2); + margin-right: (-1 * $gutter-width / 2); +} + +.section { + padding-top: 1rem; + padding-bottom: 1rem; + + &.no-pad { + padding: 0; + } + &.no-pad-bot { + padding-bottom: 0; + } + &.no-pad-top { + padding-top: 0; + } +} + + +// Mixins to eliminate code repitition +@mixin reset-offset { + margin-left: auto; + left: auto; + right: auto; +} +@mixin grid-classes($size, $i, $perc) { + &.offset-#{$size}#{$i} { + margin-left: $perc; + } + &.pull-#{$size}#{$i} { + right: $perc; + } + &.push-#{$size}#{$i} { + left: $perc; + } +} + + +.row { + margin-left: auto; + margin-right: auto; + margin-bottom: 20px; + + // Clear floating children + &:after { + content: ""; + display: table; + clear: both; + } + + .col { + float: left; + box-sizing: border-box; + padding: 0 $gutter-width / 2; + min-height: 1px; + + &[class*="push-"], + &[class*="pull-"] { + position: relative; + } + + $i: 1; + @while $i <= $num-cols { + $perc: unquote((100 / ($num-cols / $i)) + "%"); + &.s#{$i} { + width: $perc; + @include reset-offset; + } + $i: $i + 1; + } + + $i: 1; + @while $i <= $num-cols { + $perc: unquote((100 / ($num-cols / $i)) + "%"); + @include grid-classes("s", $i, $perc); + $i: $i + 1; + } + + @media #{$medium-and-up} { + + $i: 1; + @while $i <= $num-cols { + $perc: unquote((100 / ($num-cols / $i)) + "%"); + &.m#{$i} { + width: $perc; + @include reset-offset; + } + $i: $i + 1 + } + + $i: 1; + @while $i <= $num-cols { + $perc: unquote((100 / ($num-cols / $i)) + "%"); + @include grid-classes("m", $i, $perc); + $i: $i + 1; + } + } + + @media #{$large-and-up} { + + $i: 1; + @while $i <= $num-cols { + $perc: unquote((100 / ($num-cols / $i)) + "%"); + &.l#{$i} { + width: $perc; + @include reset-offset; + } + $i: $i + 1; + } + + $i: 1; + @while $i <= $num-cols { + $perc: unquote((100 / ($num-cols / $i)) + "%"); + @include grid-classes("l", $i, $perc); + $i: $i + 1; + } + } + + @media #{$extra-large-and-up} { + + $i: 1; + @while $i <= $num-cols { + $perc: unquote((100 / ($num-cols / $i)) + "%"); + &.xl#{$i} { + width: $perc; + @include reset-offset; + } + $i: $i + 1; + } + + $i: 1; + @while $i <= $num-cols { + $perc: unquote((100 / ($num-cols / $i)) + "%"); + @include grid-classes("xl", $i, $perc); + $i: $i + 1; + } + } + } +} diff --git a/assets/css/components/_icons-material-design.scss b/assets/css/components/_icons-material-design.scss new file mode 100644 index 0000000..2aa6a4a --- /dev/null +++ b/assets/css/components/_icons-material-design.scss @@ -0,0 +1,5 @@ +/* This is needed for some mobile phones to display the Google Icon font properly */ +.material-icons { + text-rendering: optimizeLegibility; + font-feature-settings: 'liga'; +} diff --git a/assets/css/components/_materialbox.scss b/assets/css/components/_materialbox.scss new file mode 100644 index 0000000..3027667 --- /dev/null +++ b/assets/css/components/_materialbox.scss @@ -0,0 +1,43 @@ +.materialboxed { + &:hover { + &:not(.active) { + opacity: .8; + } + } + + display: block; + cursor: zoom-in; + position: relative; + transition: opacity .4s; + -webkit-backface-visibility: hidden; + + &.active { + cursor: zoom-out; + } +} + +#materialbox-overlay { + position:fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + background-color: #292929; + z-index: 1000; + will-change: opacity; +} + +.materialbox-caption { + position: fixed; + display: none; + color: #fff; + line-height: 50px; + bottom: 0; + left: 0; + width: 100%; + text-align: center; + padding: 0% 15%; + height: 50px; + z-index: 1000; + -webkit-font-smoothing: antialiased; +} \ No newline at end of file diff --git a/assets/css/components/_modal.scss b/assets/css/components/_modal.scss new file mode 100644 index 0000000..38cf3ce --- /dev/null +++ b/assets/css/components/_modal.scss @@ -0,0 +1,94 @@ +.modal { + &:focus { + outline: none; + } + + @extend .z-depth-5; + + display: none; + position: fixed; + left: 0; + right: 0; + background-color: #fafafa; + padding: 0; + max-height: 70%; + width: 55%; + margin: auto; + overflow-y: auto; + + border-radius: 2px; + will-change: top, opacity; + + @media #{$medium-and-down} { + width: 80%; + } + + h1,h2,h3,h4 { + margin-top: 0; + } + + .modal-content { + padding: 24px; + } + .modal-close { + cursor: pointer; + } + + .modal-footer { + border-radius: 0 0 2px 2px; + background-color: #fafafa; + padding: 4px 6px; + height: 56px; + width: 100%; + text-align: right; + + .btn, .btn-flat { + margin: 6px 0; + } + } +} +.modal-overlay { + position: fixed; + z-index: 999; + top: -25%; + left: 0; + bottom: 0; + right: 0; + height: 125%; + width: 100%; + background: #000; + display: none; + + will-change: opacity; +} + +// Modal with fixed action footer +.modal.modal-fixed-footer { + padding: 0; + height: 70%; + + .modal-content { + position: absolute; + height: calc(100% - 56px); + max-height: 100%; + width: 100%; + overflow-y: auto; + } + + .modal-footer { + border-top: 1px solid rgba(0,0,0,.1); + position: absolute; + bottom: 0; + } +} + +// Modal Bottom Sheet Style +.modal.bottom-sheet { + top: auto; + bottom: -100%; + margin: 0; + width: 100%; + max-height: 45%; + border-radius: 0; + will-change: bottom, opacity; +} diff --git a/assets/css/components/_navbar.scss b/assets/css/components/_navbar.scss new file mode 100644 index 0000000..0317bb2 --- /dev/null +++ b/assets/css/components/_navbar.scss @@ -0,0 +1,208 @@ +nav { + &.nav-extended { + height: auto; + + .nav-wrapper { + min-height: $navbar-height-mobile; + height: auto; + } + + .nav-content { + position: relative; + line-height: normal; + } + } + + color: $navbar-font-color; + @extend .z-depth-1; + background-color: $primary-color; + width: 100%; + height: $navbar-height-mobile; + line-height: $navbar-line-height-mobile; + + a { color: $navbar-font-color; } + + i, + [class^="mdi-"], [class*="mdi-"], + i.material-icons { + display: block; + font-size: 24px; + height: $navbar-height-mobile; + line-height: $navbar-line-height-mobile; + } + + .nav-wrapper { + position: relative; + height: 100%; + } + + @media #{$large-and-up} { + a.sidenav-trigger { display: none; } + } + + + // Collapse button + .sidenav-trigger { + float: left; + position: relative; + z-index: 1; + height: $navbar-height-mobile; + margin: 0 18px; + + i { + height: $navbar-height-mobile; + line-height: $navbar-line-height-mobile; + } + } + + + // Logo + .brand-logo { + position: absolute; + color: $navbar-font-color; + display: inline-block; + font-size: $navbar-brand-font-size; + padding: 0; + + &.center { + left: 50%; + transform: translateX(-50%); + } + + @media #{$medium-and-down} { + left: 50%; + transform: translateX(-50%); + + &.left, &.right { + padding: 0; + transform: none; + } + + &.left { left: 0.5rem; } + &.right { + right: 0.5rem; + left: auto; + } + } + + &.right { + right: 0.5rem; + padding: 0; + } + + i, + [class^="mdi-"], [class*="mdi-"], + i.material-icons { + float: left; + margin-right: 15px; + } + } + + + // Title + .nav-title { + display: inline-block; + font-size: 32px; + padding: 28px 0; + } + + + // Navbar Links + ul { + margin: 0; + + li { + transition: background-color .3s; + float: left; + padding: 0; + + &.active { + background-color: rgba(0,0,0,.1); + } + } + a { + transition: background-color .3s; + font-size: $navbar-font-size; + color: $navbar-font-color; + display: block; + padding: 0 15px; + cursor: pointer; + + &.btn, &.btn-large, &.btn-flat, &.btn-floating { + margin-top: -2px; + margin-left: 15px; + margin-right: 15px; + + & > .material-icons { + height: inherit; + line-height: inherit; + } + } + + &:hover { + background-color: rgba(0,0,0,.1); + } + } + + &.left { + float: left; + } + } + + // Navbar Search Form + form { + height: 100%; + } + + .input-field { + margin: 0; + height: 100%; + + input { + height: 100%; + font-size: 1.2rem; + border: none; + padding-left: 2rem; + + &:focus, &[type=text]:valid, &[type=password]:valid, + &[type=email]:valid, &[type=url]:valid, &[type=date]:valid { + border: none; + box-shadow: none; + } + } + + label { + top: 0; + left: 0; + + i { + color: rgba(255,255,255,.7); + transition: color .3s; + } + &.active i { color: $navbar-font-color; } + } + } +} + +// Fixed Navbar +.navbar-fixed { + position: relative; + height: $navbar-height-mobile; + z-index: 997; + + nav { + position: fixed; + } +} +@media #{$medium-and-up} { + nav.nav-extended .nav-wrapper { + min-height: $navbar-height; + } + nav, nav .nav-wrapper i, nav a.sidenav-trigger, nav a.sidenav-trigger i { + height: $navbar-height; + line-height: $navbar-line-height; + } + .navbar-fixed { + height: $navbar-height; + } +} diff --git a/assets/css/components/_normalize.scss b/assets/css/components/_normalize.scss new file mode 100644 index 0000000..fa4e73d --- /dev/null +++ b/assets/css/components/_normalize.scss @@ -0,0 +1,447 @@ +/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */ + +/* Document + ========================================================================== */ + +/** + * 1. Correct the line height in all browsers. + * 2. Prevent adjustments of font size after orientation changes in + * IE on Windows Phone and in iOS. + */ + +html { + line-height: 1.15; /* 1 */ + -ms-text-size-adjust: 100%; /* 2 */ + -webkit-text-size-adjust: 100%; /* 2 */ +} + +/* Sections + ========================================================================== */ + +/** + * Remove the margin in all browsers (opinionated). + */ + +body { + margin: 0; +} + +/** + * Add the correct display in IE 9-. + */ + +article, +aside, +footer, +header, +nav, +section { + display: block; +} + +/** + * Correct the font size and margin on `h1` elements within `section` and + * `article` contexts in Chrome, Firefox, and Safari. + */ + +h1 { + font-size: 2em; + margin: 0.67em 0; +} + +/* Grouping content + ========================================================================== */ + +/** + * Add the correct display in IE 9-. + * 1. Add the correct display in IE. + */ + +figcaption, +figure, +main { /* 1 */ + display: block; +} + +/** + * Add the correct margin in IE 8. + */ + +figure { + margin: 1em 40px; +} + +/** + * 1. Add the correct box sizing in Firefox. + * 2. Show the overflow in Edge and IE. + */ + +hr { + box-sizing: content-box; /* 1 */ + height: 0; /* 1 */ + overflow: visible; /* 2 */ +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + +pre { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/* Text-level semantics + ========================================================================== */ + +/** + * 1. Remove the gray background on active links in IE 10. + * 2. Remove gaps in links underline in iOS 8+ and Safari 8+. + */ + +a { + background-color: transparent; /* 1 */ + -webkit-text-decoration-skip: objects; /* 2 */ +} + +/** + * 1. Remove the bottom border in Chrome 57- and Firefox 39-. + * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. + */ + +abbr[title] { + border-bottom: none; /* 1 */ + text-decoration: underline; /* 2 */ + text-decoration: underline dotted; /* 2 */ +} + +/** + * Prevent the duplicate application of `bolder` by the next rule in Safari 6. + */ + +b, +strong { + font-weight: inherit; +} + +/** + * Add the correct font weight in Chrome, Edge, and Safari. + */ + +b, +strong { + font-weight: bolder; +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + +code, +kbd, +samp { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/** + * Add the correct font style in Android 4.3-. + */ + +dfn { + font-style: italic; +} + +/** + * Add the correct background and color in IE 9-. + */ + +mark { + background-color: #ff0; + color: #000; +} + +/** + * Add the correct font size in all browsers. + */ + +small { + font-size: 80%; +} + +/** + * Prevent `sub` and `sup` elements from affecting the line height in + * all browsers. + */ + +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sub { + bottom: -0.25em; +} + +sup { + top: -0.5em; +} + +/* Embedded content + ========================================================================== */ + +/** + * Add the correct display in IE 9-. + */ + +audio, +video { + display: inline-block; +} + +/** + * Add the correct display in iOS 4-7. + */ + +audio:not([controls]) { + display: none; + height: 0; +} + +/** + * Remove the border on images inside links in IE 10-. + */ + +img { + border-style: none; +} + +/** + * Hide the overflow in IE. + */ + +svg:not(:root) { + overflow: hidden; +} + +/* Forms + ========================================================================== */ + +/** + * 1. Change the font styles in all browsers (opinionated). + * 2. Remove the margin in Firefox and Safari. + */ + +button, +input, +optgroup, +select, +textarea { + font-family: sans-serif; /* 1 */ + font-size: 100%; /* 1 */ + line-height: 1.15; /* 1 */ + margin: 0; /* 2 */ +} + +/** + * Show the overflow in IE. + * 1. Show the overflow in Edge. + */ + +button, +input { /* 1 */ + overflow: visible; +} + +/** + * Remove the inheritance of text transform in Edge, Firefox, and IE. + * 1. Remove the inheritance of text transform in Firefox. + */ + +button, +select { /* 1 */ + text-transform: none; +} + +/** + * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` + * controls in Android 4. + * 2. Correct the inability to style clickable types in iOS and Safari. + */ + +button, +html [type="button"], /* 1 */ +[type="reset"], +[type="submit"] { + -webkit-appearance: button; /* 2 */ +} + +/** + * Remove the inner border and padding in Firefox. + */ + +button::-moz-focus-inner, +[type="button"]::-moz-focus-inner, +[type="reset"]::-moz-focus-inner, +[type="submit"]::-moz-focus-inner { + border-style: none; + padding: 0; +} + +/** + * Restore the focus styles unset by the previous rule. + */ + +button:-moz-focusring, +[type="button"]:-moz-focusring, +[type="reset"]:-moz-focusring, +[type="submit"]:-moz-focusring { + outline: 1px dotted ButtonText; +} + +/** + * Correct the padding in Firefox. + */ + +fieldset { + padding: 0.35em 0.75em 0.625em; +} + +/** + * 1. Correct the text wrapping in Edge and IE. + * 2. Correct the color inheritance from `fieldset` elements in IE. + * 3. Remove the padding so developers are not caught out when they zero out + * `fieldset` elements in all browsers. + */ + +legend { + box-sizing: border-box; /* 1 */ + color: inherit; /* 2 */ + display: table; /* 1 */ + max-width: 100%; /* 1 */ + padding: 0; /* 3 */ + white-space: normal; /* 1 */ +} + +/** + * 1. Add the correct display in IE 9-. + * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera. + */ + +progress { + display: inline-block; /* 1 */ + vertical-align: baseline; /* 2 */ +} + +/** + * Remove the default vertical scrollbar in IE. + */ + +textarea { + overflow: auto; +} + +/** + * 1. Add the correct box sizing in IE 10-. + * 2. Remove the padding in IE 10-. + */ + +[type="checkbox"], +[type="radio"] { + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ +} + +/** + * Correct the cursor style of increment and decrement buttons in Chrome. + */ + +[type="number"]::-webkit-inner-spin-button, +[type="number"]::-webkit-outer-spin-button { + height: auto; +} + +/** + * 1. Correct the odd appearance in Chrome and Safari. + * 2. Correct the outline style in Safari. + */ + +[type="search"] { + -webkit-appearance: textfield; /* 1 */ + outline-offset: -2px; /* 2 */ +} + +/** + * Remove the inner padding and cancel buttons in Chrome and Safari on macOS. + */ + +[type="search"]::-webkit-search-cancel-button, +[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} + +/** + * 1. Correct the inability to style clickable types in iOS and Safari. + * 2. Change font properties to `inherit` in Safari. + */ + +::-webkit-file-upload-button { + -webkit-appearance: button; /* 1 */ + font: inherit; /* 2 */ +} + +/* Interactive + ========================================================================== */ + +/* + * Add the correct display in IE 9-. + * 1. Add the correct display in Edge, IE, and Firefox. + */ + +details, /* 1 */ +menu { + display: block; +} + +/* + * Add the correct display in all browsers. + */ + +summary { + display: list-item; +} + +/* Scripting + ========================================================================== */ + +/** + * Add the correct display in IE 9-. + */ + +canvas { + display: inline-block; +} + +/** + * Add the correct display in IE. + */ + +template { + display: none; +} + +/* Hidden + ========================================================================== */ + +/** + * Add the correct display in IE 10-. + */ + +[hidden] { + display: none; +} diff --git a/assets/css/components/_preloader.scss b/assets/css/components/_preloader.scss new file mode 100644 index 0000000..cfe2993 --- /dev/null +++ b/assets/css/components/_preloader.scss @@ -0,0 +1,334 @@ +/* + @license + Copyright (c) 2014 The Polymer Project Authors. All rights reserved. + This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt + The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt + The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt + Code distributed by Google as part of the polymer project is also + subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt + */ + +/**************************/ +/* STYLES FOR THE SPINNER */ +/**************************/ + +/* + * Constants: + * STROKEWIDTH = 3px + * ARCSIZE = 270 degrees (amount of circle the arc takes up) + * ARCTIME = 1333ms (time it takes to expand and contract arc) + * ARCSTARTROT = 216 degrees (how much the start location of the arc + * should rotate each time, 216 gives us a + * 5 pointed star shape (it's 360/5 * 3). + * For a 7 pointed star, we might do + * 360/7 * 3 = 154.286) + * CONTAINERWIDTH = 28px + * SHRINK_TIME = 400ms + */ + + +.preloader-wrapper { + display: inline-block; + position: relative; + width: 50px; + height: 50px; + + &.small { + width: 36px; + height: 36px; + } + + &.big { + width: 64px; + height: 64px; + } + + &.active { + /* duration: 360 * ARCTIME / (ARCSTARTROT + (360-ARCSIZE)) */ + -webkit-animation: container-rotate 1568ms linear infinite; + animation: container-rotate 1568ms linear infinite; + } +} + +@-webkit-keyframes container-rotate { + to { -webkit-transform: rotate(360deg) } +} + +@keyframes container-rotate { + to { transform: rotate(360deg) } +} + +.spinner-layer { + position: absolute; + width: 100%; + height: 100%; + opacity: 0; + border-color: $spinner-default-color; +} + +.spinner-blue, +.spinner-blue-only { + border-color: #4285f4; +} + +.spinner-red, +.spinner-red-only { + border-color: #db4437; +} + +.spinner-yellow, +.spinner-yellow-only { + border-color: #f4b400; +} + +.spinner-green, +.spinner-green-only { + border-color: #0f9d58; +} + +/** + * IMPORTANT NOTE ABOUT CSS ANIMATION PROPERTIES (keanulee): + * + * iOS Safari (tested on iOS 8.1) does not handle animation-delay very well - it doesn't + * guarantee that the animation will start _exactly_ after that value. So we avoid using + * animation-delay and instead set custom keyframes for each color (as redundant as it + * seems). + * + * We write out each animation in full (instead of separating animation-name, + * animation-duration, etc.) because under the polyfill, Safari does not recognize those + * specific properties properly, treats them as -webkit-animation, and overrides the + * other animation rules. See https://github.com/Polymer/platform/issues/53. + */ +.active .spinner-layer.spinner-blue { + /* durations: 4 * ARCTIME */ + -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both; + animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both; +} + +.active .spinner-layer.spinner-red { + /* durations: 4 * ARCTIME */ + -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both; + animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both; +} + +.active .spinner-layer.spinner-yellow { + /* durations: 4 * ARCTIME */ + -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both; + animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both; +} + +.active .spinner-layer.spinner-green { + /* durations: 4 * ARCTIME */ + -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both; + animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both; +} + +.active .spinner-layer, +.active .spinner-layer.spinner-blue-only, +.active .spinner-layer.spinner-red-only, +.active .spinner-layer.spinner-yellow-only, +.active .spinner-layer.spinner-green-only { + /* durations: 4 * ARCTIME */ + opacity: 1; + -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both; + animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both; +} + +@-webkit-keyframes fill-unfill-rotate { + 12.5% { -webkit-transform: rotate(135deg); } /* 0.5 * ARCSIZE */ + 25% { -webkit-transform: rotate(270deg); } /* 1 * ARCSIZE */ + 37.5% { -webkit-transform: rotate(405deg); } /* 1.5 * ARCSIZE */ + 50% { -webkit-transform: rotate(540deg); } /* 2 * ARCSIZE */ + 62.5% { -webkit-transform: rotate(675deg); } /* 2.5 * ARCSIZE */ + 75% { -webkit-transform: rotate(810deg); } /* 3 * ARCSIZE */ + 87.5% { -webkit-transform: rotate(945deg); } /* 3.5 * ARCSIZE */ + to { -webkit-transform: rotate(1080deg); } /* 4 * ARCSIZE */ +} + +@keyframes fill-unfill-rotate { + 12.5% { transform: rotate(135deg); } /* 0.5 * ARCSIZE */ + 25% { transform: rotate(270deg); } /* 1 * ARCSIZE */ + 37.5% { transform: rotate(405deg); } /* 1.5 * ARCSIZE */ + 50% { transform: rotate(540deg); } /* 2 * ARCSIZE */ + 62.5% { transform: rotate(675deg); } /* 2.5 * ARCSIZE */ + 75% { transform: rotate(810deg); } /* 3 * ARCSIZE */ + 87.5% { transform: rotate(945deg); } /* 3.5 * ARCSIZE */ + to { transform: rotate(1080deg); } /* 4 * ARCSIZE */ +} + +@-webkit-keyframes blue-fade-in-out { + from { opacity: 1; } + 25% { opacity: 1; } + 26% { opacity: 0; } + 89% { opacity: 0; } + 90% { opacity: 1; } + 100% { opacity: 1; } +} + +@keyframes blue-fade-in-out { + from { opacity: 1; } + 25% { opacity: 1; } + 26% { opacity: 0; } + 89% { opacity: 0; } + 90% { opacity: 1; } + 100% { opacity: 1; } +} + +@-webkit-keyframes red-fade-in-out { + from { opacity: 0; } + 15% { opacity: 0; } + 25% { opacity: 1; } + 50% { opacity: 1; } + 51% { opacity: 0; } +} + +@keyframes red-fade-in-out { + from { opacity: 0; } + 15% { opacity: 0; } + 25% { opacity: 1; } + 50% { opacity: 1; } + 51% { opacity: 0; } +} + +@-webkit-keyframes yellow-fade-in-out { + from { opacity: 0; } + 40% { opacity: 0; } + 50% { opacity: 1; } + 75% { opacity: 1; } + 76% { opacity: 0; } +} + +@keyframes yellow-fade-in-out { + from { opacity: 0; } + 40% { opacity: 0; } + 50% { opacity: 1; } + 75% { opacity: 1; } + 76% { opacity: 0; } +} + +@-webkit-keyframes green-fade-in-out { + from { opacity: 0; } + 65% { opacity: 0; } + 75% { opacity: 1; } + 90% { opacity: 1; } + 100% { opacity: 0; } +} + +@keyframes green-fade-in-out { + from { opacity: 0; } + 65% { opacity: 0; } + 75% { opacity: 1; } + 90% { opacity: 1; } + 100% { opacity: 0; } +} + +/** + * Patch the gap that appear between the two adjacent div.circle-clipper while the + * spinner is rotating (appears on Chrome 38, Safari 7.1, and IE 11). + */ +.gap-patch { + position: absolute; + top: 0; + left: 45%; + width: 10%; + height: 100%; + overflow: hidden; + border-color: inherit; +} + +.gap-patch .circle { + width: 1000%; + left: -450%; +} + +.circle-clipper { + display: inline-block; + position: relative; + width: 50%; + height: 100%; + overflow: hidden; + border-color: inherit; + + .circle { + width: 200%; + height: 100%; + border-width: 3px; /* STROKEWIDTH */ + border-style: solid; + border-color: inherit; + border-bottom-color: transparent !important; + border-radius: 50%; + -webkit-animation: none; + animation: none; + position: absolute; + top: 0; + right: 0; + bottom: 0; + } + + &.left .circle { + left: 0; + border-right-color: transparent !important; + -webkit-transform: rotate(129deg); + transform: rotate(129deg); + } + &.right .circle { + left: -100%; + border-left-color: transparent !important; + -webkit-transform: rotate(-129deg); + transform: rotate(-129deg); + } +} + + + +.active .circle-clipper.left .circle { + /* duration: ARCTIME */ + -webkit-animation: left-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both; + animation: left-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both; +} + +.active .circle-clipper.right .circle { + /* duration: ARCTIME */ + -webkit-animation: right-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both; + animation: right-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both; +} + +@-webkit-keyframes left-spin { + from { -webkit-transform: rotate(130deg); } + 50% { -webkit-transform: rotate(-5deg); } + to { -webkit-transform: rotate(130deg); } +} + +@keyframes left-spin { + from { transform: rotate(130deg); } + 50% { transform: rotate(-5deg); } + to { transform: rotate(130deg); } +} + +@-webkit-keyframes right-spin { + from { -webkit-transform: rotate(-130deg); } + 50% { -webkit-transform: rotate(5deg); } + to { -webkit-transform: rotate(-130deg); } +} + +@keyframes right-spin { + from { transform: rotate(-130deg); } + 50% { transform: rotate(5deg); } + to { transform: rotate(-130deg); } +} + +#spinnerContainer.cooldown { + /* duration: SHRINK_TIME */ + -webkit-animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0.0, 0.2, 1); + animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0.0, 0.2, 1); +} + +@-webkit-keyframes fade-out { + from { opacity: 1; } + to { opacity: 0; } +} + +@keyframes fade-out { + from { opacity: 1; } + to { opacity: 0; } +} diff --git a/assets/css/components/_pulse.scss b/assets/css/components/_pulse.scss new file mode 100644 index 0000000..a690f36 --- /dev/null +++ b/assets/css/components/_pulse.scss @@ -0,0 +1,34 @@ +.pulse { + &::before { + content: ''; + display: block; + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + background-color: inherit; + border-radius: inherit; + transition: opacity .3s, transform .3s; + animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite; + z-index: -1; + } + + overflow: visible; + position: relative; +} + +@keyframes pulse-animation { + 0% { + opacity: 1; + transform: scale(1); + } + 50% { + opacity: 0; + transform: scale(1.5); + } + 100% { + opacity: 0; + transform: scale(1.5); + } +} diff --git a/assets/css/components/_sidenav.scss b/assets/css/components/_sidenav.scss new file mode 100644 index 0000000..98a71d8 --- /dev/null +++ b/assets/css/components/_sidenav.scss @@ -0,0 +1,216 @@ +.sidenav { + position: fixed; + width: $sidenav-width; + left: 0; + top: 0; + margin: 0; + transform: translateX(-100%); + height: 100%; + height: calc(100% + 60px); + height: -moz-calc(100%); //Temporary Firefox Fix + padding-bottom: 60px; + background-color: $sidenav-bg-color; + z-index: 999; + overflow-y: auto; + will-change: transform; + backface-visibility: hidden; + transform: translateX(-105%); + + @extend .z-depth-1; + + // Right Align + &.right-aligned { + right: 0; + transform: translateX(105%); + left: auto; + transform: translateX(100%); + } + + .collapsible { + margin: 0; + } + + + li { + float: none; + line-height: $sidenav-line-height; + + &.active { background-color: rgba(0,0,0,.05); } + } + + li > a { + color: $sidenav-font-color; + display: block; + font-size: $sidenav-font-size; + font-weight: 500; + height: $sidenav-item-height; + line-height: $sidenav-line-height; + padding: 0 ($sidenav-padding * 2); + + &:hover { background-color: rgba(0,0,0,.05);} + + &.btn, &.btn-large, &.btn-flat, &.btn-floating { + margin: 10px 15px; + } + + &.btn, + &.btn-large, + &.btn-floating { color: $button-raised-color; } + &.btn-flat { color: $button-flat-color; } + + &.btn:hover, + &.btn-large:hover { background-color: lighten($button-raised-background, 5%); } + &.btn-floating:hover { background-color: $button-raised-background; } + + & > i, + & > [class^="mdi-"], li > a > [class*="mdi-"], + & > i.material-icons { + float: left; + height: $sidenav-item-height; + line-height: $sidenav-line-height; + margin: 0 ($sidenav-padding * 2) 0 0; + width: $sidenav-item-height / 2; + color: rgba(0,0,0,.54); + } + } + + + .divider { + margin: ($sidenav-padding / 2) 0 0 0; + } + + .subheader { + &:hover { + background-color: transparent; + } + + cursor: initial; + pointer-events: none; + color: rgba(0,0,0,.54); + font-size: $sidenav-font-size; + font-weight: 500; + line-height: $sidenav-line-height; + } + + .user-view { + position: relative; + padding: ($sidenav-padding * 2) ($sidenav-padding * 2) 0; + margin-bottom: $sidenav-padding / 2; + + & > a { + &:hover { background-color: transparent; } + height: auto; + padding: 0; + } + + .background { + overflow: hidden; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: -1; + } + + .circle, .name, .email { + display: block; + } + + .circle { + height: 64px; + width: 64px; + } + + .name, + .email { + font-size: $sidenav-font-size; + line-height: $sidenav-line-height / 2; + } + + .name { + margin-top: 16px; + font-weight: 500; + } + + .email { + padding-bottom: 16px; + font-weight: 400; + } + } +} + + +// Touch interaction +.drag-target { + // Right Align + &.right-aligned { + right: 0; + } + + height: 100%; + width: 10px; + position: fixed; + top: 0; + z-index: 998; +} + + +// Fixed Sidenav shown +.sidenav.sidenav-fixed { + // Right Align + &.right-aligned { + right: 0; + left: auto; + } + + left: 0; + transform: translateX(0); + position: fixed; +} + +// Fixed Sidenav hide on smaller +@media #{$medium-and-down} { + .sidenav { + &.sidenav-fixed { + transform: translateX(-105%); + + &.right-aligned { + transform: translateX(105%); + } + } + + > a { + padding: 0 $sidenav-padding; + } + + .user-view { + padding: $sidenav-padding $sidenav-padding 0; + } + } +} + + +.sidenav .collapsible-body > ul:not(.collapsible) > li.active, +.sidenav.sidenav-fixed .collapsible-body > ul:not(.collapsible) > li.active { + background-color: $primary-color; + a { + color: $sidenav-bg-color; + } +} +.sidenav .collapsible-body { + padding: 0; +} + + +.sidenav-overlay { + position: fixed; + top: 0; + left: 0; + right: 0; + opacity: 0; + height: 120vh; + background-color: rgba(0,0,0,.5); + z-index: 997; + display: none; +} diff --git a/assets/css/components/_slider.scss b/assets/css/components/_slider.scss new file mode 100644 index 0000000..5d7c27e --- /dev/null +++ b/assets/css/components/_slider.scss @@ -0,0 +1,92 @@ +.slider { + position: relative; + height: 400px; + width: 100%; + + // Fullscreen slider + &.fullscreen { + height: 100%; + width: 100%; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + + ul.slides { + height: 100%; + } + + ul.indicators { + z-index: 2; + bottom: 30px; + } + } + + .slides { + background-color: $slider-bg-color; + margin: 0; + height: 400px; + + li { + opacity: 0; + position: absolute; + top: 0; + left: 0; + z-index: 1; + width: 100%; + height: inherit; + overflow: hidden; + + img { + height: 100%; + width: 100%; + background-size: cover; + background-position: center; + } + + .caption { + color: #fff; + position: absolute; + top: 15%; + left: 15%; + width: 70%; + opacity: 0; + + p { color: $slider-bg-color-light; } + } + + &.active { + z-index: 2; + } + } + } + + + .indicators { + position: absolute; + text-align: center; + left: 0; + right: 0; + bottom: 0; + margin: 0; + + .indicator-item { + display: inline-block; + position: relative; + cursor: pointer; + height: 16px; + width: 16px; + margin: 0 12px; + background-color: $slider-bg-color-light; + + transition: background-color .3s; + border-radius: 50%; + + &.active { + background-color: $slider-indicator-color; + } + } + } + +} \ No newline at end of file diff --git a/assets/css/components/_table_of_contents.scss b/assets/css/components/_table_of_contents.scss new file mode 100644 index 0000000..638009d --- /dev/null +++ b/assets/css/components/_table_of_contents.scss @@ -0,0 +1,33 @@ +/*************** + Nav List +***************/ +.table-of-contents { + &.fixed { + position: fixed; + } + + li { + padding: 2px 0; + } + a { + display: inline-block; + font-weight: 300; + color: #757575; + padding-left: 16px; + height: 1.5rem; + line-height: 1.5rem; + letter-spacing: .4; + display: inline-block; + + &:hover { + color: lighten(#757575, 20%); + padding-left: 15px; + border-left: 1px solid $primary-color; + } + &.active { + font-weight: 500; + padding-left: 14px; + border-left: 2px solid $primary-color; + } + } +} diff --git a/assets/css/components/_tabs.scss b/assets/css/components/_tabs.scss new file mode 100644 index 0000000..072d4b6 --- /dev/null +++ b/assets/css/components/_tabs.scss @@ -0,0 +1,99 @@ +.tabs { + &.tabs-transparent { + background-color: transparent; + + .tab a, + .tab.disabled a, + .tab.disabled a:hover { + color: rgba(255,255,255,0.7); + } + + .tab a:hover, + .tab a.active { + color: #fff; + } + + .indicator { + background-color: #fff; + } + } + + &.tabs-fixed-width { + display: flex; + + .tab { + flex-grow: 1; + } + } + + position: relative; + overflow-x: auto; + overflow-y: hidden; + height: 48px; + width: 100%; + background-color: $tabs-bg-color; + margin: 0 auto; + white-space: nowrap; + + .tab { + display: inline-block; + text-align: center; + line-height: 48px; + height: 48px; + padding: 0; + margin: 0; + text-transform: uppercase; + + a { + &:focus, + &:focus.active { + background-color: transparentize($tabs-underline-color, .8); + outline: none; + } + + &:hover, + &.active { + background-color: transparent; + color: $tabs-text-color; + } + + color: rgba($tabs-text-color, .7); + display: block; + width: 100%; + height: 100%; + padding: 0 24px; + font-size: 14px; + text-overflow: ellipsis; + overflow: hidden; + transition: color .28s ease, background-color .28s ease; + } + + &.disabled a, + &.disabled a:hover { + color: rgba($tabs-text-color, .4); + cursor: default; + } + } + .indicator { + position: absolute; + bottom: 0; + height: 2px; + background-color: $tabs-underline-color; + will-change: left, right; + } +} + +// Fixed Sidenav hide on smaller +@media #{$medium-and-down} { + .tabs { + display: flex; + + .tab { + flex-grow: 1; + + a { + padding: 0 12px; + } + } + } +} diff --git a/assets/css/components/_tapTarget.scss b/assets/css/components/_tapTarget.scss new file mode 100644 index 0000000..49aecd5 --- /dev/null +++ b/assets/css/components/_tapTarget.scss @@ -0,0 +1,103 @@ +.tap-target-wrapper { + width: 800px; + height: 800px; + position: fixed; + z-index: 1000; + visibility: hidden; + transition: visibility 0s .3s; +} + +.tap-target-wrapper.open { + visibility: visible; + transition: visibility 0s; + + .tap-target { + transform: scale(1); + opacity: .95; + transition: + transform .3s cubic-bezier(.42,0,.58,1), + opacity .3s cubic-bezier(.42,0,.58,1); + } + + .tap-target-wave::before { + transform: scale(1); + } + .tap-target-wave::after { + visibility: visible; + animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite; + transition: + opacity .3s, + transform .3s, + visibility 0s 1s; + } +} + +.tap-target { + position: absolute; + font-size: 1rem; + border-radius: 50%; + background-color: $primary-color; + box-shadow: 0 20px 20px 0 rgba(0,0,0,0.14), 0 10px 50px 0 rgba(0,0,0,0.12), 0 30px 10px -20px rgba(0,0,0,0.2); + width: 100%; + height: 100%; + opacity: 0; + transform: scale(0); + transition: + transform .3s cubic-bezier(.42,0,.58,1), + opacity .3s cubic-bezier(.42,0,.58,1); +} + +.tap-target-content { + position: relative; + display: table-cell; +} + +.tap-target-wave { + &::before, + &::after { + content: ''; + display: block; + position: absolute; + width: 100%; + height: 100%; + border-radius: 50%; + background-color: #ffffff; + } + &::before { + transform: scale(0); + transition: transform .3s; + } + &::after { + visibility: hidden; + transition: + opacity .3s, + transform .3s, + visibility 0s; + z-index: -1; + } + + position: absolute; + border-radius: 50%; + z-index: 10001; +} + +.tap-target-origin { + &:not(.btn), + &:not(.btn):hover { + background: none; + } + + top: 50%; + left: 50%; + transform: translate(-50%,-50%); + + z-index: 10002; + position: absolute !important; +} + +@media only screen and (max-width: 600px) { + .tap-target, .tap-target-wrapper { + width: 600px; + height: 600px; + } +} diff --git a/assets/css/components/_timepicker.scss b/assets/css/components/_timepicker.scss new file mode 100644 index 0000000..fa602fb --- /dev/null +++ b/assets/css/components/_timepicker.scss @@ -0,0 +1,183 @@ +/* Timepicker Containers */ +.timepicker-modal { + max-width: 325px; + max-height: none; +} + +.timepicker-container.modal-content { + display: flex; + flex-direction: column; + padding: 0; +} + +.text-primary { + color: rgba(255, 255, 255, 1); +} + + +/* Clock Digital Display */ +.timepicker-digital-display { + flex: 1 auto; + background-color: $secondary-color; + padding: 10px; + font-weight: 300; +} + +.timepicker-text-container { + font-size: 4rem; + font-weight: bold; + text-align: center; + color: rgba(255, 255, 255, 0.6); + font-weight: 400; + position: relative; + user-select: none; +} + +.timepicker-span-hours, +.timepicker-span-minutes, +.timepicker-span-am-pm div { + cursor: pointer; +} + +.timepicker-span-hours { + margin-right: 3px; +} + +.timepicker-span-minutes { + margin-left: 3px; +} + +.timepicker-display-am-pm { + font-size: 1.3rem; + position: absolute; + right: 1rem; + bottom: 1rem; + font-weight: 400; +} + + +/* Analog Clock Display */ +.timepicker-analog-display { + flex: 2.5 auto; +} + +.timepicker-plate { + background-color: $timepicker-clock-plate-bg; + border-radius: 50%; + width: 270px; + height: 270px; + overflow: visible; + position: relative; + margin: auto; + margin-top: 25px; + margin-bottom: 5px; + user-select: none; +} + +.timepicker-canvas, +.timepicker-dial { + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; +} +.timepicker-minutes { + visibility: hidden; +} + +.timepicker-tick { + border-radius: 50%; + color: $timepicker-clock-color; + line-height: 40px; + text-align: center; + width: 40px; + height: 40px; + position: absolute; + cursor: pointer; + font-size: 15px; +} + +.timepicker-tick.active, +.timepicker-tick:hover { + background-color: transparentize($secondary-color, .75); +} +.timepicker-dial { + transition: transform 350ms, opacity 350ms; +} +.timepicker-dial-out { + &.timepicker-hours { + transform: scale(1.1, 1.1); + } + + &.timepicker-minutes { + transform: scale(.8, .8); + } + + opacity: 0; +} +.timepicker-canvas { + transition: opacity 175ms; + + line { + stroke: $secondary-color; + stroke-width: 4; + stroke-linecap: round; + } +} +.timepicker-canvas-out { + opacity: 0.25; +} +.timepicker-canvas-bearing { + stroke: none; + fill: $secondary-color; +} +.timepicker-canvas-bg { + stroke: none; + fill: $secondary-color; +} + + +/* Footer */ +.timepicker-footer { + margin: 0 auto; + padding: 5px 1rem; + display: flex; + justify-content: space-between; +} + +.timepicker-clear { + color: $error-color; +} + +.timepicker-close { + color: $secondary-color; +} + +.timepicker-clear, +.timepicker-close { + padding: 0 20px; +} + +/* Media Queries */ +@media #{$medium-and-up} { + .timepicker-modal { + max-width: 600px; + } + + .timepicker-container.modal-content { + flex-direction: row; + } + + .timepicker-text-container { + top: 32%; + } + + .timepicker-display-am-pm { + position: relative; + right: auto; + bottom: auto; + text-align: center; + margin-top: 1.2rem; + } +} diff --git a/assets/css/components/_toast.scss b/assets/css/components/_toast.scss new file mode 100644 index 0000000..412400f --- /dev/null +++ b/assets/css/components/_toast.scss @@ -0,0 +1,58 @@ +#toast-container { + display:block; + position: fixed; + z-index: 10000; + + @media #{$small-and-down} { + min-width: 100%; + bottom: 0%; + } + @media #{$medium-only} { + left: 5%; + bottom: 7%; + max-width: 90%; + } + @media #{$large-and-up} { + top: 10%; + right: 7%; + max-width: 86%; + } +} + +.toast { + @extend .z-depth-1; + border-radius: 2px; + top: 35px; + width: auto; + margin-top: 10px; + position: relative; + max-width:100%; + height: auto; + min-height: $toast-height; + line-height: 1.5em; + background-color: $toast-color; + padding: 10px 25px; + font-size: 1.1rem; + font-weight: 300; + color: $toast-text-color; + display: flex; + align-items: center; + justify-content: space-between; + cursor: default; + + .toast-action { + color: $toast-action-color; + font-weight: 500; + margin-right: -25px; + margin-left: 3rem; + } + + &.rounded{ + border-radius: 24px; + } + + @media #{$small-and-down} { + width: 100%; + border-radius: 0; + } +} diff --git a/assets/css/components/_tooltip.scss b/assets/css/components/_tooltip.scss new file mode 100644 index 0000000..5ec4299 --- /dev/null +++ b/assets/css/components/_tooltip.scss @@ -0,0 +1,32 @@ +.material-tooltip { + padding: 10px 8px; + font-size: 1rem; + z-index: 2000; + background-color: transparent; + border-radius: 2px; + color: #fff; + min-height: 36px; + line-height: 120%; + opacity: 0; + position: absolute; + text-align: center; + max-width: calc(100% - 4px); + overflow: hidden; + left: 0; + top: 0; + pointer-events: none; + visibility: hidden; + background-color: #323232; +} + +.backdrop { + position: absolute; + opacity: 0; + height: 7px; + width: 14px; + border-radius: 0 0 50% 50%; + background-color: #323232; + z-index: -1; + transform-origin: 50% 0%; + visibility: hidden; +} diff --git a/assets/css/components/_transitions.scss b/assets/css/components/_transitions.scss new file mode 100644 index 0000000..cb9f60d --- /dev/null +++ b/assets/css/components/_transitions.scss @@ -0,0 +1,13 @@ +// Scale transition +.scale-transition { + &.scale-out { + transform: scale(0); + transition: transform .2s !important; + } + + &.scale-in { + transform: scale(1); + } + + transition: transform .3s cubic-bezier(0.53, 0.01, 0.36, 1.63) !important; +} \ No newline at end of file diff --git a/assets/css/components/_typography.scss b/assets/css/components/_typography.scss new file mode 100644 index 0000000..b9b93b3 --- /dev/null +++ b/assets/css/components/_typography.scss @@ -0,0 +1,60 @@ + +a { + text-decoration: none; +} + +html{ + line-height: 1.5; + + @media only screen and (min-width: 0) { + font-size: 14px; + } + + @media only screen and (min-width: $medium-screen) { + font-size: 14.5px; + } + + @media only screen and (min-width: $large-screen) { + font-size: 15px; + } + + font-family: $font-stack; + font-weight: normal; + color: $off-black; +} +h1, h2, h3, h4, h5, h6 { + font-weight: 400; + line-height: 1.3; +} + +// Header Styles +h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; } +h1 { font-size: $h1-fontsize; line-height: 110%; margin: ($h1-fontsize / 1.5) 0 ($h1-fontsize / 2.5) 0;} +h2 { font-size: $h2-fontsize; line-height: 110%; margin: ($h2-fontsize / 1.5) 0 ($h2-fontsize / 2.5) 0;} +h3 { font-size: $h3-fontsize; line-height: 110%; margin: ($h3-fontsize / 1.5) 0 ($h3-fontsize / 2.5) 0;} +h4 { font-size: $h4-fontsize; line-height: 110%; margin: ($h4-fontsize / 1.5) 0 ($h4-fontsize / 2.5) 0;} +h5 { font-size: $h5-fontsize; line-height: 110%; margin: ($h5-fontsize / 1.5) 0 ($h5-fontsize / 2.5) 0;} +h6 { font-size: $h6-fontsize; line-height: 110%; margin: ($h6-fontsize / 1.5) 0 ($h6-fontsize / 2.5) 0;} + +// Text Styles +em { font-style: italic; } +strong { font-weight: 500; } +small { font-size: 75%; } +.light { font-weight: 300; } +.thin { font-weight: 200; } + + +.flow-text{ + $i: 0; + @while $i <= $intervals { + @media only screen and (min-width : 360 + ($i * $interval-size)) { + font-size: 1.2rem * (1 + (.02 * $i)); + } + $i: $i + 1; + } + + // Handle below 360px screen + @media only screen and (max-width: 360px) { + font-size: 1.2rem; + } +} diff --git a/assets/css/components/_variables.scss b/assets/css/components/_variables.scss new file mode 100644 index 0000000..681d845 --- /dev/null +++ b/assets/css/components/_variables.scss @@ -0,0 +1,349 @@ +// ========================================================================== +// Materialize variables +// ========================================================================== +// +// Table of Contents: +// +// 1. Colors +// 2. Badges +// 3. Buttons +// 4. Cards +// 5. Carousel +// 6. Collapsible +// 7. Chips +// 8. Date + Time Picker +// 9. Dropdown +// 10. Forms +// 11. Global +// 12. Grid +// 13. Navigation Bar +// 14. Side Navigation +// 15. Photo Slider +// 16. Spinners | Loaders +// 17. Tabs +// 18. Tables +// 19. Toasts +// 20. Typography +// 21. Footer +// 22. Flow Text +// 23. Collections +// 24. Progress Bar + + + +// 1. Colors +// ========================================================================== + +$primary-color: #f8ef02 !default; +$primary-color-light: lighten($primary-color, 15%) !default; +$primary-color-dark: darken($primary-color, 15%) !default; + +$secondary-color: #ff003c !default; +$success-color: #446d44 !default; +$error-color: purple !default; +$link-color: #136377 !default; + + +// 2. Badges +// ========================================================================== + +$badge-bg-color: $secondary-color !default; +$badge-height: 22px !default; + + +// 3. Buttons +// ========================================================================== + +// Shared styles +$button-border: none !default; +$button-background-focus: lighten($secondary-color, 4%) !default; +$button-font-size: 14px !default; +$button-icon-font-size: 1.3rem !default; +$button-height: 36px !default; +$button-padding: 0 16px !default; +$button-radius: 2px !default; + +// Disabled styles +$button-disabled-background: #DFDFDF !default; +$button-disabled-color: #9F9F9F !default; + +// Raised buttons +$button-raised-background: $secondary-color !default; +$button-raised-background-hover: lighten($button-raised-background, 5%) !default; +$button-raised-color: #fff !default; + +// Large buttons +$button-large-font-size: 15px !default; +$button-large-icon-font-size: 1.6rem !default; +$button-large-height: $button-height * 1.5 !default; +$button-floating-large-size: 56px !default; + +// Small buttons +$button-small-font-size: 13px !default; +$button-small-icon-font-size: 1.2rem !default; +$button-small-height: $button-height * .9 !default; +$button-floating-small-size: $button-height * .9 !default; + +// Flat buttons +$button-flat-color: #343434 !default; +$button-flat-disabled-color: lighten(#999, 10%) !default; + +// Floating buttons +$button-floating-background: $secondary-color !default; +$button-floating-background-hover: $button-floating-background !default; +$button-floating-color: #fff !default; +$button-floating-size: 40px !default; +$button-floating-radius: 50% !default; + + +// 4. Cards +// ========================================================================== + +$card-padding: 24px !default; +$card-bg-color: #fff !default; +$card-link-color: color("orange", "accent-2") !default; +$card-link-color-light: lighten($card-link-color, 20%) !default; + + +// 5. Carousel +// ========================================================================== + +$carousel-height: 400px !default; +$carousel-item-height: $carousel-height / 2 !default; +$carousel-item-width: $carousel-item-height !default; + + +// 6. Collapsible +// ========================================================================== + +$collapsible-height: 3rem !default; +$collapsible-line-height: $collapsible-height !default; +$collapsible-header-color: #fff !default; +$collapsible-border-color: #ddd !default; + + +// 7. Chips +// ========================================================================== + +$chip-bg-color: #e4e4e4 !default; +$chip-border-color: #9e9e9e !default; +$chip-selected-color: #26a69a !default; +$chip-margin: 5px !default; + + +// 8. Date + Time Picker +// ========================================================================== + +$datepicker-display-font-size: 2.8rem; +$datepicker-calendar-header-color: #999; +$datepicker-weekday-color: rgba(0, 0, 0, .87) !default; +$datepicker-weekday-bg: darken($secondary-color, 7%) !default; +$datepicker-date-bg: $secondary-color !default; +$datepicker-year: rgba(255, 255, 255, .7) !default; +$datepicker-focus: rgba(0,0,0, .05) !default; +$datepicker-selected: $secondary-color !default; +$datepicker-selected-outfocus: desaturate(lighten($secondary-color, 35%), 15%) !default; +$datepicker-day-focus: transparentize(desaturate($secondary-color, 5%), .75) !default; +$datepicker-disabled-day-color: rgba(0, 0, 0, .3) !default; + +$timepicker-clock-color: rgba(0, 0, 0, .87) !default; +$timepicker-clock-plate-bg: #eee !default; + + +// 9. Dropdown +// ========================================================================== + +$dropdown-bg-color: #fff !default; +$dropdown-hover-bg-color: #eee !default; +$dropdown-color: $secondary-color !default; +$dropdown-item-height: 50px !default; + + +// 10. Forms +// ========================================================================== + +// Text Inputs + Textarea +$input-height: 3rem !default; +$input-border-color: color("grey", "base") !default; +$input-border: 1px solid $input-border-color !default; +$input-background: #fff !default; +$input-error-color: $error-color !default; +$input-success-color: $success-color !default; +$input-focus-color: $secondary-color !default; +$input-font-size: 16px !default; +$input-margin-bottom: 8px; +$input-margin: 0 0 $input-margin-bottom 0 !default; +$input-padding: 0 !default; +$label-font-size: .8rem !default; +$input-disabled-color: rgba(0,0,0, .42) !default; +$input-disabled-solid-color: #949494 !default; +$input-disabled-border: 1px dotted $input-disabled-color !default; +$input-invalid-border: 1px solid $input-error-color !default; +$input-icon-size: 2rem; +$placeholder-text-color: lighten($input-border-color, 20%) !default; + +// Radio Buttons +$radio-fill-color: $secondary-color !default; +$radio-empty-color: #5a5a5a !default; +$radio-border: 2px solid $radio-fill-color !default; + +// Range +$range-height: 14px !default; +$range-width: 14px !default; +$track-height: 3px !default; + +// Select +$select-border: 1px solid #f2f2f2 !default; +$select-background: rgba(255, 255, 255, 0.90) !default; +$select-focus: 1px solid lighten($secondary-color, 47%) !default; +$select-option-hover: rgba(0,0,0,.08) !default; +$select-option-focus: rgba(0,0,0,.08) !default; +$select-option-selected: rgba(0,0,0,.03) !default; +$select-padding: 5px !default; +$select-radius: 2px !default; +$select-disabled-color: rgba(0,0,0,.3) !default; + +// Switches +$switch-bg-color: $secondary-color !default; +$switch-checked-lever-bg: desaturate(lighten($switch-bg-color, 25%), 25%) !default; +$switch-unchecked-bg: #F1F1F1 !default; +$switch-unchecked-lever-bg: rgba(0,0,0,.38) !default; +$switch-radius: 15px !default; + + +// 11. Global +// ========================================================================== + +// Media Query Ranges +$small-screen-up: 601px !default; +$medium-screen-up: 993px !default; +$large-screen-up: 1201px !default; +$small-screen: 600px !default; +$medium-screen: 992px !default; +$large-screen: 1200px !default; + +$medium-and-up: "only screen and (min-width : #{$small-screen-up})" !default; +$large-and-up: "only screen and (min-width : #{$medium-screen-up})" !default; +$extra-large-and-up: "only screen and (min-width : #{$large-screen-up})" !default; +$small-and-down: "only screen and (max-width : #{$small-screen})" !default; +$medium-and-down: "only screen and (max-width : #{$medium-screen})" !default; +$medium-only: "only screen and (min-width : #{$small-screen-up}) and (max-width : #{$medium-screen})" !default; + + +// 12. Grid +// ========================================================================== + +$num-cols: 12 !default; +$gutter-width: 1.5rem !default; +$element-top-margin: $gutter-width/3 !default; +$element-bottom-margin: ($gutter-width*2)/3 !default; + + +// 13. Navigation Bar +// ========================================================================== + +$navbar-height: 64px !default; +$navbar-line-height: $navbar-height !default; +$navbar-height-mobile: 56px !default; +$navbar-line-height-mobile: $navbar-height-mobile !default; +$navbar-font-size: 1rem !default; +$navbar-font-color: #fff !default; +$navbar-brand-font-size: 2.1rem !default; + +// 14. Side Navigation +// ========================================================================== + +$sidenav-width: 300px !default; +$sidenav-font-size: 14px !default; +$sidenav-font-color: rgba(0,0,0,.87) !default; +$sidenav-bg-color: #fff !default; +$sidenav-padding: 16px !default; +$sidenav-item-height: 48px !default; +$sidenav-line-height: $sidenav-item-height !default; + + +// 15. Photo Slider +// ========================================================================== + +$slider-bg-color: color('grey', 'base') !default; +$slider-bg-color-light: color('grey', 'lighten-2') !default; +$slider-indicator-color: color('green', 'base') !default; + + +// 16. Spinners | Loaders +// ========================================================================== + +$spinner-default-color: $secondary-color !default; + + +// 17. Tabs +// ========================================================================== + +$tabs-underline-color: $primary-color-light !default; +$tabs-text-color: $primary-color !default; +$tabs-bg-color: #fff !default; + + +// 18. Tables +// ========================================================================== + +$table-border-color: rgba(0,0,0,.12) !default; +$table-striped-color: rgba(242, 242, 242, 0.5) !default; + + +// 19. Toasts +// ========================================================================== + +$toast-height: 48px !default; +$toast-color: #323232 !default; +$toast-text-color: #fff !default; +$toast-action-color: #eeff41; + + +// 20. Typography +// ========================================================================== + +$font-stack: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !default; +$off-black: rgba(0, 0, 0, 0.87) !default; +// Header Styles +$h1-fontsize: 4.2rem !default; +$h2-fontsize: 3.56rem !default; +$h3-fontsize: 2.92rem !default; +$h4-fontsize: 2.28rem !default; +$h5-fontsize: 1.64rem !default; +$h6-fontsize: 1.15rem !default; + + +// 21. Footer +// ========================================================================== + +$footer-font-color: #fff !default; +$footer-bg-color: $primary-color !default; +$footer-copyright-font-color: rgba(255,255,255,.8) !default; +$footer-copyright-bg-color: rgba(51,51,51,.08) !default; + + +// 22. Flow Text +// ========================================================================== + +$range : $large-screen - $small-screen !default; +$intervals: 20 !default; +$interval-size: $range / $intervals !default; + + +// 23. Collections +// ========================================================================== + +$collection-border-color: #e0e0e0 !default; +$collection-bg-color: #fff !default; +$collection-active-bg-color: $secondary-color !default; +$collection-active-color: lighten($secondary-color, 55%) !default; +$collection-hover-bg-color: #ddd !default; +$collection-link-color: $secondary-color !default; +$collection-line-height: 1.5rem !default; + + +// 24. Progress Bar +// ========================================================================== + +$progress-bar-color: $secondary-color !default; diff --git a/assets/css/components/_waves.scss b/assets/css/components/_waves.scss new file mode 100644 index 0000000..b36c718 --- /dev/null +++ b/assets/css/components/_waves.scss @@ -0,0 +1,114 @@ + +/*! + * Waves v0.6.0 + * http://fian.my.id/Waves + * + * Copyright 2014 Alfiana E. Sibuea and other contributors + * Released under the MIT license + * https://github.com/fians/Waves/blob/master/LICENSE + */ + + +.waves-effect { + position: relative; + cursor: pointer; + display: inline-block; + overflow: hidden; + user-select: none; + -webkit-tap-highlight-color: transparent; + vertical-align: middle; + z-index: 1; + transition: .3s ease-out; + + .waves-ripple { + position: absolute; + border-radius: 50%; + width: 20px; + height: 20px; + margin-top:-10px; + margin-left:-10px; + opacity: 0; + + background: rgba(0,0,0,0.2); + transition: all 0.7s ease-out; + transition-property: transform, opacity; + transform: scale(0); + pointer-events: none; + } + + // Waves Colors + &.waves-light .waves-ripple { + background-color: rgba(255, 255, 255, 0.45); + } + &.waves-red .waves-ripple { + background-color: rgba(244, 67, 54, .70); + } + &.waves-yellow .waves-ripple { + background-color: rgba(255, 235, 59, .70); + } + &.waves-orange .waves-ripple { + background-color: rgba(255, 152, 0, .70); + } + &.waves-purple .waves-ripple { + background-color: rgba(156, 39, 176, 0.70); + } + &.waves-green .waves-ripple { + background-color: rgba(76, 175, 80, 0.70); + } + &.waves-teal .waves-ripple { + background-color: rgba(0, 150, 136, 0.70); + } + + // Style input button bug. + input[type="button"], input[type="reset"], input[type="submit"] { + border: 0; + font-style: normal; + font-size: inherit; + text-transform: inherit; + background: none; + } + + img { + position: relative; + z-index: -1; + } +} + +.waves-notransition { + transition: none #{"!important"}; +} + +.waves-circle { + transform: translateZ(0); + -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%); +} + +.waves-input-wrapper { + border-radius: 0.2em; + vertical-align: bottom; + + .waves-button-input { + position: relative; + top: 0; + left: 0; + z-index: 1; + } +} + +.waves-circle { + text-align: center; + width: 2.5em; + height: 2.5em; + line-height: 2.5em; + border-radius: 50%; + -webkit-mask-image: none; +} + +.waves-block { + display: block; +} + +/* Firefox Bug: link not triggered */ +.waves-effect .waves-ripple { + z-index: -1; +} \ No newline at end of file diff --git a/assets/css/components/forms/_checkboxes.scss b/assets/css/components/forms/_checkboxes.scss new file mode 100644 index 0000000..ddc7d96 --- /dev/null +++ b/assets/css/components/forms/_checkboxes.scss @@ -0,0 +1,200 @@ +/* Checkboxes + ========================================================================== */ + +/* Remove default checkbox */ +[type="checkbox"]:not(:checked), +[type="checkbox"]:checked { + position: absolute; + opacity: 0; + pointer-events: none; +} + +// Checkbox Styles +[type="checkbox"] { + // Text Label Style + + span:not(.lever) { + position: relative; + padding-left: 35px; + cursor: pointer; + display: inline-block; + height: 25px; + line-height: 25px; + font-size: 1rem; + user-select: none; + } + + /* checkbox aspect */ + + span:not(.lever):before, + &:not(.filled-in) + span:not(.lever):after { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 18px; + height: 18px; + z-index: 0; + border: 2px solid $radio-empty-color; + border-radius: 1px; + margin-top: 3px; + transition: .2s; + } + + &:not(.filled-in) + span:not(.lever):after { + border: 0; + transform: scale(0); + } + + &:not(:checked):disabled + span:not(.lever):before { + border: none; + background-color: $input-disabled-color; + } + + // Focused styles + &.tabbed:focus + span:not(.lever):after { + transform: scale(1); + border: 0; + border-radius: 50%; + box-shadow: 0 0 0 10px rgba(0,0,0,.1); + background-color: rgba(0,0,0,.1); + } +} + +[type="checkbox"]:checked { + + span:not(.lever):before { + top: -4px; + left: -5px; + width: 12px; + height: 22px; + border-top: 2px solid transparent; + border-left: 2px solid transparent; + border-right: $radio-border; + border-bottom: $radio-border; + transform: rotate(40deg); + backface-visibility: hidden; + transform-origin: 100% 100%; + } + + &:disabled + span:before { + border-right: 2px solid $input-disabled-color; + border-bottom: 2px solid $input-disabled-color; + } +} + +/* Indeterminate checkbox */ +[type="checkbox"]:indeterminate { + + span:not(.lever):before { + top: -11px; + left: -12px; + width: 10px; + height: 22px; + border-top: none; + border-left: none; + border-right: $radio-border; + border-bottom: none; + transform: rotate(90deg); + backface-visibility: hidden; + transform-origin: 100% 100%; + } + + // Disabled indeterminate + &:disabled + span:not(.lever):before { + border-right: 2px solid $input-disabled-color; + background-color: transparent; + } +} + +// Filled in Style +[type="checkbox"].filled-in { + // General + + span:not(.lever):after { + border-radius: 2px; + } + + + span:not(.lever):before, + + span:not(.lever):after { + content: ''; + left: 0; + position: absolute; + /* .1s delay is for check animation */ + transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s; + z-index: 1; + } + + // Unchecked style + &:not(:checked) + span:not(.lever):before { + width: 0; + height: 0; + border: 3px solid transparent; + left: 6px; + top: 10px; + transform: rotateZ(37deg); + transform-origin: 100% 100%; + } + + &:not(:checked) + span:not(.lever):after { + height: 20px; + width: 20px; + background-color: transparent; + border: 2px solid $radio-empty-color; + top: 0px; + z-index: 0; + } + + // Checked style + &:checked { + + span:not(.lever):before { + top: 0; + left: 1px; + width: 8px; + height: 13px; + border-top: 2px solid transparent; + border-left: 2px solid transparent; + border-right: 2px solid $input-background; + border-bottom: 2px solid $input-background; + transform: rotateZ(37deg); + transform-origin: 100% 100%; + } + + + span:not(.lever):after { + top: 0; + width: 20px; + height: 20px; + border: 2px solid $secondary-color; + background-color: $secondary-color; + z-index: 0; + } + } + + // Focused styles + &.tabbed:focus + span:not(.lever):after { + border-radius: 2px; + border-color: $radio-empty-color; + background-color: rgba(0,0,0,.1); + } + + &.tabbed:checked:focus + span:not(.lever):after { + border-radius: 2px; + background-color: $secondary-color; + border-color: $secondary-color; + } + + // Disabled style + &:disabled:not(:checked) + span:not(.lever):before { + background-color: transparent; + border: 2px solid transparent; + } + + &:disabled:not(:checked) + span:not(.lever):after { + border-color: transparent; + background-color: $input-disabled-solid-color; + } + + &:disabled:checked + span:not(.lever):before { + background-color: transparent; + } + + &:disabled:checked + span:not(.lever):after { + background-color: $input-disabled-solid-color; + border-color: $input-disabled-solid-color; + } +} diff --git a/assets/css/components/forms/_file-input.scss b/assets/css/components/forms/_file-input.scss new file mode 100644 index 0000000..e0f7ef7 --- /dev/null +++ b/assets/css/components/forms/_file-input.scss @@ -0,0 +1,44 @@ +/* File Input + ========================================================================== */ + +.file-field { + position: relative; + + .file-path-wrapper { + overflow: hidden; + padding-left: 10px; + } + + input.file-path { width: 100%; } + + .btn { + float: left; + height: $input-height; + line-height: $input-height; + } + + span { + cursor: pointer; + } + + input[type=file] { + + // Needed to override webkit button + &::-webkit-file-upload-button { + display: none; + } + + position: absolute; + top: 0; + right: 0; + left: 0; + bottom: 0; + width: 100%; + margin: 0; + padding: 0; + font-size: 20px; + cursor: pointer; + opacity: 0; + filter: alpha(opacity=0); + } +} diff --git a/assets/css/components/forms/_forms.scss b/assets/css/components/forms/_forms.scss new file mode 100644 index 0000000..4c19f4c --- /dev/null +++ b/assets/css/components/forms/_forms.scss @@ -0,0 +1,22 @@ +// Remove Focus Boxes +select:focus { + outline: $select-focus; +} + +button:focus { + outline: none; + background-color: $button-background-focus; +} + +label { + font-size: $label-font-size; + color: $input-border-color; +} + +@import 'input-fields'; +@import 'radio-buttons'; +@import 'checkboxes'; +@import 'switches'; +@import 'select'; +@import 'file-input'; +@import 'range'; diff --git a/assets/css/components/forms/_input-fields.scss b/assets/css/components/forms/_input-fields.scss new file mode 100644 index 0000000..f18c2f8 --- /dev/null +++ b/assets/css/components/forms/_input-fields.scss @@ -0,0 +1,354 @@ +/* Text Inputs + Textarea + ========================================================================== */ + +/* Style Placeholders */ + +::placeholder { + color: $placeholder-text-color; +} + +/* Text inputs */ + +input:not([type]), +input[type=text]:not(.browser-default), +input[type=password]:not(.browser-default), +input[type=email]:not(.browser-default), +input[type=url]:not(.browser-default), +input[type=time]:not(.browser-default), +input[type=date]:not(.browser-default), +input[type=datetime]:not(.browser-default), +input[type=datetime-local]:not(.browser-default), +input[type=tel]:not(.browser-default), +input[type=number]:not(.browser-default), +input[type=search]:not(.browser-default), +textarea.materialize-textarea { + + // General Styles + background-color: transparent; + border: none; + border-bottom: $input-border; + border-radius: 0; + outline: none; + height: $input-height; + width: 100%; + font-size: $input-font-size; + margin: $input-margin; + padding: $input-padding; + box-shadow: none; + box-sizing: content-box; + transition: box-shadow .3s, border .3s; + + // Disabled input style + &:disabled, + &[readonly="readonly"] { + color: $input-disabled-color; + border-bottom: $input-disabled-border; + } + + // Disabled label style + &:disabled+label, + &[readonly="readonly"]+label { + color: $input-disabled-color; + } + + // Focused input style + &:focus:not([readonly]) { + border-bottom: 1px solid $input-focus-color; + box-shadow: 0 1px 0 0 $input-focus-color; + } + + // Focused label style + &:focus:not([readonly])+label { + color: $input-focus-color; + } + + // Hide helper text on data message + &.valid ~ .helper-text[data-success], + &:focus.valid ~ .helper-text[data-success], + &.invalid ~ .helper-text[data-error], + &:focus.invalid ~ .helper-text[data-error] { + @extend %hidden-text; + } + + // Valid Input Style + &.valid, + &:focus.valid { + @extend %valid-input-style; + } + + // Custom Success Message + &.valid ~ .helper-text:after, + &:focus.valid ~ .helper-text:after { + @extend %custom-success-message; + } + &:focus.valid ~ label { + color: $input-success-color; + } + + // Invalid Input Style + &.invalid, + &:focus.invalid { + @extend %invalid-input-style; + } + + // Custom Error message + &.invalid ~ .helper-text:after, + &:focus.invalid ~ .helper-text:after { + @extend %custom-error-message; + } + &:focus.invalid ~ label { + color: $input-error-color; + } + + // Full width label when using validate for error messages + &.validate + label { + width: 100%; + } + + // Form Message Shared Styles + & + label:after { + @extend %input-after-style; + } +} + + +/* Validation Sass Placeholders */ +%valid-input-style { + border-bottom: 1px solid $input-success-color; + box-shadow: 0 1px 0 0 $input-success-color; +} +%invalid-input-style { + border-bottom: $input-invalid-border; + box-shadow: 0 1px 0 0 $input-error-color; +} +%hidden-text { + color: transparent; + user-select: none; + pointer-events: none; +} +%custom-success-message { + content: attr(data-success); + color: $input-success-color; +} +%custom-error-message { + content: attr(data-error); + color: $input-error-color; +} +%input-after-style { + display: block; + content: ""; + position: absolute; + top: 100%; + left: 0; + opacity: 0; + transition: .2s opacity ease-out, .2s color ease-out; +} + + +// Styling for input field wrapper +.input-field { + // Inline styles + &.inline { + display: inline-block; + vertical-align: middle; + margin-left: 5px; + + input, + .select-dropdown { + margin-bottom: 1rem; + } + } + + // Gutter spacing + &.col { + label { + left: $gutter-width / 2; + } + + .prefix ~ label, + .prefix ~ .validate ~ label { + width: calc(100% - 3rem - #{$gutter-width}); + } + } + + position: relative; + margin-top: 1rem; + margin-bottom: 1rem; + + & > label { + color: $input-border-color; + position: absolute; + top: 0; + left: 0; + font-size: 1rem; + cursor: text; + transition: transform .2s ease-out, color .2s ease-out; + transform-origin: 0% 100%; + text-align: initial; + transform: translateY(12px); + + &:not(.label-icon).active { + transform: translateY(-14px) scale(.8); + transform-origin: 0 0; + } + } + + // Autofill + date + time inputs + & > input[type]:-webkit-autofill:not(.browser-default):not([type="search"]) + label, + & > input[type=date]:not(.browser-default) + label, + & > input[type=time]:not(.browser-default) + label { + transform: translateY(-14px) scale(.8); + transform-origin: 0 0; + } + + .helper-text { + &::after { + opacity: 1; + position: absolute; + top: 0; + left: 0; + } + + position: relative; + min-height: 18px; + display: block; + font-size: 12px; + color: rgba(0,0,0,.54); + } + + // Prefix Icons + .prefix { + position: absolute; + width: $input-height; + font-size: $input-icon-size; + transition: color .2s; + top: ($input-height - $input-icon-size) / 2; + + &.active { color: $input-focus-color; } + } + + .prefix ~ input, + .prefix ~ textarea, + .prefix ~ label, + .prefix ~ .validate ~ label, + .prefix ~ .helper-text, + .prefix ~ .autocomplete-content { + margin-left: 3rem; + width: 92%; + width: calc(100% - 3rem); + } + + .prefix ~ label { margin-left: 3rem; } + + @media #{$medium-and-down} { + .prefix ~ input { + width: 86%; + width: calc(100% - 3rem); + } + } + + @media #{$small-and-down} { + .prefix ~ input { + width: 80%; + width: calc(100% - 3rem); + } + } +} + + +/* Search Field */ + +.input-field input[type=search] { + display: block; + line-height: inherit; + transition: .3s background-color; + + .nav-wrapper & { + height: inherit; + padding-left: 4rem; + width: calc(100% - 4rem); + border: 0; + box-shadow: none; + } + + &:focus:not(.browser-default) { + background-color: $input-background; + border: 0; + box-shadow: none; + color: #444; + + & + label i, + & ~ .mdi-navigation-close, + & ~ .material-icons { + color: #444; + } + } + + & + .label-icon { + transform: none; + left: 1rem; + } + + & ~ .mdi-navigation-close, + & ~ .material-icons { + position: absolute; + top: 0; + right: 1rem; + color: transparent; + cursor: pointer; + font-size: $input-icon-size; + transition: .3s color; + } +} + + +/* Textarea */ + +// Default textarea +textarea { + width: 100%; + height: $input-height; + background-color: transparent; + + &.materialize-textarea { + line-height: normal; + overflow-y: hidden; /* prevents scroll bar flash */ + padding: .8rem 0 .8rem 0; /* prevents text jump on Enter keypress */ + resize: none; + min-height: $input-height; + box-sizing: border-box; + } +} + +// For textarea autoresize +.hiddendiv { + visibility: hidden; + white-space: pre-wrap; + word-wrap: break-word; + overflow-wrap: break-word; /* future version of deprecated 'word-wrap' */ + padding-top: 1.2rem; /* prevents text jump on Enter keypress */ + + // Reduces repaints + position: absolute; + top: 0; + z-index: -1; +} + + +/* Autocomplete */ +.autocomplete-content { + li { + .highlight { color: #444; } + + img { + height: $dropdown-item-height - 10; + width: $dropdown-item-height - 10; + margin: 5px 15px; + } + } +} + +/* Character Counter */ +.character-counter { + min-height: 18px; +} diff --git a/assets/css/components/forms/_radio-buttons.scss b/assets/css/components/forms/_radio-buttons.scss new file mode 100644 index 0000000..c9f7296 --- /dev/null +++ b/assets/css/components/forms/_radio-buttons.scss @@ -0,0 +1,115 @@ +/* Radio Buttons + ========================================================================== */ + +// Remove default Radio Buttons +[type="radio"]:not(:checked), +[type="radio"]:checked { + position: absolute; + opacity: 0; + pointer-events: none; +} + +[type="radio"]:not(:checked) + span, +[type="radio"]:checked + span { + position: relative; + padding-left: 35px; + cursor: pointer; + display: inline-block; + height: 25px; + line-height: 25px; + font-size: 1rem; + transition: .28s ease; + user-select: none; +} + +[type="radio"] + span:before, +[type="radio"] + span:after { + content: ''; + position: absolute; + left: 0; + top: 0; + margin: 4px; + width: 16px; + height: 16px; + z-index: 0; + transition: .28s ease; +} + +/* Unchecked styles */ +[type="radio"]:not(:checked) + span:before, +[type="radio"]:not(:checked) + span:after, +[type="radio"]:checked + span:before, +[type="radio"]:checked + span:after, +[type="radio"].with-gap:checked + span:before, +[type="radio"].with-gap:checked + span:after { + border-radius: 50%; +} + +[type="radio"]:not(:checked) + span:before, +[type="radio"]:not(:checked) + span:after { + border: 2px solid $radio-empty-color; +} + +[type="radio"]:not(:checked) + span:after { + transform: scale(0); +} + +/* Checked styles */ +[type="radio"]:checked + span:before { + border: 2px solid transparent; +} + +[type="radio"]:checked + span:after, +[type="radio"].with-gap:checked + span:before, +[type="radio"].with-gap:checked + span:after { + border: $radio-border; +} + +[type="radio"]:checked + span:after, +[type="radio"].with-gap:checked + span:after { + background-color: $radio-fill-color; +} + +[type="radio"]:checked + span:after { + transform: scale(1.02); +} + +/* Radio With gap */ +[type="radio"].with-gap:checked + span:after { + transform: scale(.5); +} + +/* Focused styles */ +[type="radio"].tabbed:focus + span:before { + box-shadow: 0 0 0 10px rgba(0,0,0,.1); +} + +/* Disabled Radio With gap */ +[type="radio"].with-gap:disabled:checked + span:before { + border: 2px solid $input-disabled-color; +} + +[type="radio"].with-gap:disabled:checked + span:after { + border: none; + background-color: $input-disabled-color; +} + +/* Disabled style */ +[type="radio"]:disabled:not(:checked) + span:before, +[type="radio"]:disabled:checked + span:before { + background-color: transparent; + border-color: $input-disabled-color; +} + +[type="radio"]:disabled + span { + color: $input-disabled-color; +} + +[type="radio"]:disabled:not(:checked) + span:before { + border-color: $input-disabled-color; +} + +[type="radio"]:disabled:checked + span:after { + background-color: $input-disabled-color; + border-color: $input-disabled-solid-color; +} diff --git a/assets/css/components/forms/_range.scss b/assets/css/components/forms/_range.scss new file mode 100644 index 0000000..18607f5 --- /dev/null +++ b/assets/css/components/forms/_range.scss @@ -0,0 +1,161 @@ +/* Range + ========================================================================== */ + +.range-field { + position: relative; +} + +input[type=range], +input[type=range] + .thumb { + @extend .no-select; + cursor: pointer; +} + +input[type=range] { + position: relative; + background-color: transparent; + border: none; + outline: none; + width: 100%; + margin: 15px 0; + padding: 0; + + &:focus { + outline: none; + } +} + +input[type=range] + .thumb { + position: absolute; + top: 10px; + left: 0; + border: none; + height: 0; + width: 0; + border-radius: 50%; + background-color: $radio-fill-color; + margin-left: 7px; + + transform-origin: 50% 50%; + transform: rotate(-45deg); + + .value { + display: block; + width: 30px; + text-align: center; + color: $radio-fill-color; + font-size: 0; + transform: rotate(45deg); + } + + &.active { + border-radius: 50% 50% 50% 0; + + .value { + color: $input-background; + margin-left: -1px; + margin-top: 8px; + font-size: 10px; + } + } +} + +// Shared +@mixin range-track { + height: $track-height; + background: #c2c0c2; + border: none; +} + +@mixin range-thumb { + border: none; + height: $range-height; + width: $range-width; + border-radius: 50%; + background: $radio-fill-color; + transition: box-shadow .3s; +} + +// WebKit +input[type=range] { + -webkit-appearance: none; +} + +input[type=range]::-webkit-slider-runnable-track { + @include range-track; +} + +input[type=range]::-webkit-slider-thumb { + @include range-thumb; + -webkit-appearance: none; + background-color: $radio-fill-color; + transform-origin: 50% 50%; + margin: -5px 0 0 0; + +} + +.keyboard-focused input[type=range]:focus:not(.active)::-webkit-slider-thumb { + box-shadow: 0 0 0 10px rgba($radio-fill-color, .26); +} + +// FireFox +input[type=range] { + /* fix for FF unable to apply focus style bug */ + border: 1px solid white; + + /*required for proper track sizing in FF*/ +} + +input[type=range]::-moz-range-track { + @include range-track; +} + +input[type=range]::-moz-focus-inner { + border: 0; +} + +input[type=range]::-moz-range-thumb { + @include range-thumb; + margin-top: -5px; +} + +// hide the outline behind the border +input[type=range]:-moz-focusring { + outline: 1px solid #fff; + outline-offset: -1px; +} + +.keyboard-focused input[type=range]:focus:not(.active)::-moz-range-thumb { + box-shadow: 0 0 0 10px rgba($radio-fill-color, .26); +} + +// IE 10+ +input[type=range]::-ms-track { + height: $track-height; + + // remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead + background: transparent; + + // leave room for the larger thumb to overflow with a transparent border */ + border-color: transparent; + border-width: 6px 0; + + /*remove default tick marks*/ + color: transparent; +} + +input[type=range]::-ms-fill-lower { + background: #777; +} + +input[type=range]::-ms-fill-upper { + background: #ddd; +} + +input[type=range]::-ms-thumb { + @include range-thumb; +} + +.keyboard-focused input[type=range]:focus:not(.active)::-ms-thumb { + box-shadow: 0 0 0 10px rgba($radio-fill-color, .26); +} diff --git a/assets/css/components/forms/_select.scss b/assets/css/components/forms/_select.scss new file mode 100644 index 0000000..2fd04d3 --- /dev/null +++ b/assets/css/components/forms/_select.scss @@ -0,0 +1,180 @@ +/* Select Field + ========================================================================== */ + +select { display: none; } +select.browser-default { display: block; } + +select { + background-color: $select-background; + width: 100%; + padding: $select-padding; + border: $select-border; + border-radius: $select-radius; + height: $input-height; +} + +.select-label { + position: absolute; +} + +.select-wrapper { + &.valid .helper-text[data-success], + &.invalid ~ .helper-text[data-error] { + @extend %hidden-text; + } + + &.valid { + & > input.select-dropdown { + @extend %valid-input-style; + } + + & ~ .helper-text:after { + @extend %custom-success-message; + } + } + + &.invalid { + & > input.select-dropdown, + & > input.select-dropdown:focus { + @extend %invalid-input-style; + } + + & ~ .helper-text:after { + @extend %custom-error-message; + } + } + + &.valid + label, + &.invalid + label { + width: 100%; + pointer-events: none; + } + + & + label:after { + @extend %input-after-style; + } + + position: relative; + + input.select-dropdown { + &:focus { + border-bottom: 1px solid $input-focus-color; + } + position: relative; + cursor: pointer; + background-color: transparent; + border: none; + border-bottom: $input-border; + outline: none; + height: $input-height; + line-height: $input-height; + width: 100%; + font-size: $input-font-size; + margin: $input-margin; + padding: 0; + display: block; + user-select:none; + z-index: 1; + } + + .caret { + position: absolute; + right: 0; + top: 0; + bottom: 0; + margin: auto 0; + z-index: 0; + fill: rgba(0,0,0,.87); + } + + & + label { + position: absolute; + top: -26px; + font-size: $label-font-size; + } +} + +// Disabled styles +select:disabled { + color: $input-disabled-color; +} + +.select-wrapper.disabled { + + label { + color: $input-disabled-color; + } + .caret { + fill: $input-disabled-color; + } +} + +.select-wrapper input.select-dropdown:disabled { + color: $input-disabled-color; + cursor: default; + user-select: none; +} + +.select-wrapper i { + color: $select-disabled-color; +} + +.select-dropdown li.disabled, +.select-dropdown li.disabled > span, +.select-dropdown li.optgroup { + color: $select-disabled-color; + background-color: transparent; +} + +body.keyboard-focused { + .select-dropdown.dropdown-content li:focus { + background-color: $select-option-focus; + } +} + +.select-dropdown.dropdown-content { + li { + &:hover { + background-color: $select-option-hover; + } + + &.selected { + background-color: $select-option-selected; + } + } +} + +// Prefix Icons +.prefix ~ .select-wrapper { + margin-left: 3rem; + width: 92%; + width: calc(100% - 3rem); +} + +.prefix ~ label { margin-left: 3rem; } + +// Icons +.select-dropdown li { + img { + height: $dropdown-item-height - 10; + width: $dropdown-item-height - 10; + margin: 5px 15px; + float: right; + } +} + +// Optgroup styles +.select-dropdown li.optgroup { + border-top: 1px solid $dropdown-hover-bg-color; + + &.selected > span { + color: rgba(0, 0, 0, .7); + } + + & > span { + color: rgba(0, 0, 0, .4); + } + + & ~ li.optgroup-option { + padding-left: 1rem; + } +} diff --git a/assets/css/components/forms/_switches.scss b/assets/css/components/forms/_switches.scss new file mode 100644 index 0000000..3296b12 --- /dev/null +++ b/assets/css/components/forms/_switches.scss @@ -0,0 +1,89 @@ +/* Switch + ========================================================================== */ + +.switch, +.switch * { + -webkit-tap-highlight-color: transparent; + user-select: none; +} + +.switch label { + cursor: pointer; +} + +.switch label input[type=checkbox] { + opacity: 0; + width: 0; + height: 0; + + &:checked + .lever { + background-color: $switch-checked-lever-bg; + + &:before, &:after { + left: 18px; + } + + &:after { + background-color: $switch-bg-color; + } + } +} + +.switch label .lever { + content: ""; + display: inline-block; + position: relative; + width: 36px; + height: 14px; + background-color: $switch-unchecked-lever-bg; + border-radius: $switch-radius; + margin-right: 10px; + transition: background 0.3s ease; + vertical-align: middle; + margin: 0 16px; + + &:before, &:after { + content: ""; + position: absolute; + display: inline-block; + width: 20px; + height: 20px; + border-radius: 50%; + left: 0; + top: -3px; + transition: left 0.3s ease, background .3s ease, box-shadow 0.1s ease, transform .1s ease; + } + + &:before { + background-color: transparentize($switch-bg-color, .85); + } + + &:after { + background-color: $switch-unchecked-bg; + box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); + } +} + +// Switch active style +input[type=checkbox]:checked:not(:disabled) ~ .lever:active::before, +input[type=checkbox]:checked:not(:disabled).tabbed:focus ~ .lever::before { + transform: scale(2.4); + background-color: transparentize($switch-bg-color, .85); +} + +input[type=checkbox]:not(:disabled) ~ .lever:active:before, +input[type=checkbox]:not(:disabled).tabbed:focus ~ .lever::before { + transform: scale(2.4); + background-color: rgba(0,0,0,.08); +} + +// Disabled Styles +.switch input[type=checkbox][disabled] + .lever { + cursor: default; + background-color: rgba(0,0,0,.12); +} + +.switch label input[type=checkbox][disabled] + .lever:after, +.switch label input[type=checkbox][disabled]:checked + .lever:after { + background-color: $input-disabled-solid-color; +} diff --git a/assets/css/cyberpunk.css b/assets/css/cyberpunk.css new file mode 100644 index 0000000..8147c5b --- /dev/null +++ b/assets/css/cyberpunk.css @@ -0,0 +1,1124 @@ +/* + * cyberpunk-css by alddesign: https://github.com/alddesign/cyberpunk-css + * v1.0.0-alpha.3 + * + * Free to use - do whatever the fck you want... + */ + +/*#region fonts*/ +@font-face +{ + font-family:BlenderProBook; + font-style:normal; + font-weight:400; + src:url(../fonts/BlenderProBook.woff2) format("woff2"); +} + +@font-face +{ + font-family: Oxanium; + font-style: normal; + font-weight: 400; + src: url(../fonts/Oxanium.woff2) format('woff2'); +} + +@font-face +{ + font-family: Cyberpunk; + src: url(../fonts/Cyberpunk.otf) format('opentype'); +} +/*#endregion*/ + +/*#region top level elements*/ +:root +{ + --root-font-size: 18px; + + --yellow: #f8ef02; + --cyan: #00ffd2; + --red: #ff003c; + --blue: #136377; + --green: #446d44; + --purple: purple; + --black: #000; + --white: #fff; + --dark: #333; + + --fg: var(--black); + --bg: transparent; + --ac: var(--black); + + --yellow-cyberpunk-font: #feef00; + --cyan-cyberpunk-font1:#46dffb; + --cyan-cyberpunk-font2:#45aefb; + + --banner-color1: var(--purple); + --banner-color2: var(--red); + --banner-color3: var(--yellow); + --banner-color4: var(--cyan); + --banner-gradient-stop: 405px; + + --input-padding-top: 0px; + --input-padding-bot: 0.2rem; + --input-padding-left: 1rem; + --input-padding-right: 2rem; + --input-font-size: 1.2rem; + --input-width: 240px; + + --checkbox-size: 28px; + --checkbox-inner-size: 16px; + + --radio-size: 28px; + --radio-inner-size: 16px; +} + +html +{ + font-size: var(--root-font-size); + font-family: "BlenderProBook"; + padding: 0; + margin: 0; +} + +body +{ + background-color: var(--yellow); + padding: 0; + margin: 0; +} + +/*#endregion*/ + +/*#region cyberpunk font*/ +.oxanium-font +{ + font-family: Oxanium !important; +} + +.cyberpunk-font, +.cyberpunk-font *, +.cyberpunk-font-og, +.cyberpunk-font-og * +{ + font-family: Cyberpunk !important; + text-transform: uppercase !important; + letter-spacing: -.25em; +} + +.cyberpunk-font-og, +.cyberpunk-font-og * +{ + text-shadow: var(--cyan-cyberpunk-font1) 1px 1px, var(--cyan-cyberpunk-font2) 2px 2px; + color: var(--yellow-cyberpunk-font); +} + +.cyberpunk-font .c, +.cyberpunk-font-og .c +{ + font-style: normal; + font-size: 2em; + position: relative; + top: -.2em; +} + +.cyberpunk-font .p, +.cyberpunk-font-og .p +{ + font-style: normal; + font-size: 2em; + letter-spacing: -.45em; + position: relative; + bottom: -.25em; + left: -.15em; +} + +.cyber-att +{ + color: var(--red); + font-size: 1.2rem; + font-weight: bold; + border: 3px solid var(--red); + text-shadow: 0 0 4px var(--red); + padding: 6px; +} + +.cyber-att-2 +{ + background-color: var(--red); + color: var(--yellow); + text-shadow: 0 0 6px var(--yellow); + font-size: 1.2rem; + font-weight: bold; + border: 3px solid var(--red); + padding: 6px; +} + +/*#endregion*/ + +/*#region colors*/ +.fg-yellow { --fg: var(--yellow); color: var(--yellow) !important; } +.bg-yellow { --bg: var(--yellow); background-color: var(--yellow); } +.ac-yellow { --ac: var(--yellow); } + +.fg-cyan { --fg: var(--cyan); color: var(--cyan) !important; } +.bg-cyan { --bg: var(--cyan); background-color: var(--cyan); } +.ac-cyan { --ac: var(--cyan); } + +.fg-red { --fg: var(--red); color: var(--red) !important; } +.bg-red { --bg: var(--red); background-color: var(--red); } +.ac-red { --ac: var(--red); } + +.fg-blue { --fg: var(--blue); color: var(--blue) !important; } +.bg-blue { --bg: var(--blue); background-color: var(--blue); } +.ac-blue { --ac: var(--blue); } + +.fg-green { --fg: var(--green); color: var(--green) !important; } +.bg-green { --bg: var(--green); background-color: var(--green); } +.ac-green { --ac: var(--green); } + +.fg-purple { --fg: var(--purple); color: var(--purple) !important; } +.bg-purple { --bg: var(--purple); background-color: var(--purple); } +.ac-purple { --ac: var(--purple); } + +.fg-black { --fg: var(--black); color: var(--black) !important; } +.bg-black { --bg: var(--black); background-color: var(--black); } +.ac-black { --ac: var(--black); } + +.fg-white { --fg: var(--white); color: var(--white) !important; } +.bg-white { --bg: var(--white); background-color: var(--white); } +.ac-white { --ac: var(--white); } + +.fg-dark { --fg: var(--dark); color: var(--dark) !important; } +.bg-dark { --bg: var(--dark); background-color: var(--dark); } +.ac-dark { --ac: var(--dark); } +/*#endregion*/ + +/*#region razor*/ +.cyber-razor-top +{ + margin-top: 30px; + position: relative; +} + +.cyber-razor-bottom +{ + margin-bottom: 30px; + position: relative; +} + +.cyber-razor-top:before +{ + content: " "; + background-color: var(--bg); + -webkit-mask-image: url('data:image/svg+xml;utf8,'); + -webkit-mask-repeat: repeat-x; + -webkit-mask-position: top; + mask-image: url('data:image/svg+xml;utf8,'); + mask-repeat: repeat-x; + mask-position: top; + position: absolute; + left: 0; + top: -30px; + width: 100%; + height: 30px; + z-index: 1; +} + +.cyber-razor-bottom:after +{ + content: " "; + background-color: var(--bg); + -webkit-mask-image: url('data:image/svg+xml;utf8,'); + -webkit-mask-repeat: repeat-x; + -webkit-mask-position: bottom; + mask-image: url('data:image/svg+xml;utf8,'); + mask-repeat: repeat-x; + mask-position: bottom; + position: absolute; + left: 0; + bottom: -30px; + width: 100%; + height: 30px; + z-index: 1; +} +/*#endregion*/ + +/*#region buttons*/ +.cyber-button, +.cyber-button-small, +.cyber-button-big +{ + --button-border: 4px; + --button-font-size: 1.4rem; + --button-padding-v: 0.9rem; + --button-padding-h: 2.5rem; + + --tag-font-size: 0.55rem; + + --button-cutout: 1.1rem; + + --button-shadow-primary: var(--cyan); + --button-shadow-secondary: var(--yellow); + --button-shimmy-distance: 5; + + --button-clip-1: polygon(0 2%, 100% 2%, 100% 95%, 95% 95%, 95% 90%, 85% 90%, 85% 95%, 8% 95%, 0 70%); + --button-clip-2: polygon(0 78%, 100% 78%, 100% 100%, 95% 100%, 95% 90%, 85% 90%, 85% 100%, 8% 100%, 0 78%); + --button-clip-3: polygon(0 44%, 100% 44%, 100% 54%, 95% 54%, 95% 54%, 85% 54%, 85% 54%, 8% 54%, 0 54%); + --button-clip-4: polygon(0 0, 100% 0, 100% 0, 95% 0, 95% 0, 85% 0, 85% 0, 8% 0, 0 0); + --button-clip-5: polygon(0 0, 100% 0, 100% 0, 95% 0, 95% 0, 85% 0, 85% 0, 8% 0, 0 0); + --button-clip-6: polygon(0 40%, 100% 40%, 100% 85%, 95% 85%, 95% 85%, 85% 85%, 85% 85%, 8% 85%, 0 70%); + --button-clip-7: polygon(0 63%, 100% 63%, 100% 80%, 95% 80%, 95% 80%, 85% 80%, 85% 80%, 8% 80%, 0 70%); + + --button-clip: polygon(0 0, 100% 0, 100% 100%, 95% 100%, 95% 90%, 80% 90%, 80% 100%, var(--button-cutout) 100%, 0 calc(100% - var(--button-cutout))); + + cursor: pointer; + background: transparent !important; + text-transform: uppercase; + font-size: var(--button-font-size); + font-weight: 700; + letter-spacing: 2px; + padding: var(--button-padding-v) var(--button-padding-h); + outline: transparent; + position: relative; + border: 0; + transition: background 0.2s; +} + +/*Overriding*/ +.cyber-button-small +{ + --button-padding-v: 0.6rem; + --button-padding-h: 1.75rem; + --button-font-size: 1.0rem; + --button-cutout: 0.77rem; +} + +.cyber-button-big +{ + --button-padding-v: 1.1rem; + --button-padding-h: 3.0rem; + --button-font-size: 1.75rem; + --button-cutout: 1.44rem; +} + +.cyber-button:hover, +.cyber-button-small:hover, +.cyber-button-big:hover +{ + filter: brightness(90%); +} + +.cyber-button:after, +.cyber-button-small:after, +.cyber-button-big:after, +.cyber-button:before, +.cyber-button-small:before, +.cyber-button-big:before +{ + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + clip-path: var(--button-clip); + z-index: -1; +} + +.cyber-button:before, +.cyber-button-small:before, +.cyber-button-big:before +{ + background: var(--button-shadow-primary); + transform: translate(var(--button-border), 0); +} + +.cyber-button:after, +.cyber-button-small:after, +.cyber-button-big:after +{ + background-color: var(--bg); +} + +.cyber-button .tag, +.cyber-button-small .tag, +.cyber-button-big .tag +{ + position: absolute; + letter-spacing: 1px; + bottom: -5%; + right: 6%; + font-weight: normal; + color: #000; + font-size: var(--tag-font-size); +} + +.cyber-button-small .tag +{ + --tag-font-size: 0.44rem; + bottom: -8%; +} + +.cyber-button-big .tag +{ + --tag-font-size: 0.66rem; + bottom: -5%; +} + +.cyber-button .glitchtext, +.cyber-button-small .glitchtext, +.cyber-button-big .glitchtext +{ + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: var(--button-shadow-primary); + text-shadow: 2px 2px var(--button-shadow-primary), -2px -2px var(--button-shadow-secondary); + clip-path: var(--button-clip); + animation: glitch 4s infinite; + padding: var(--button-padding-v) var(--button-padding-h); + display: none; +} + +.cyber-button:hover .glitchtext, +.cyber-button-small:hover .glitchtext, +.cyber-button-big:hover .glitchtext +{ + display: block; +} + +.cyber-button .glitchtext:before, +.cyber-button-small .glitchtext:before, +.cyber-button-big .glitchtext:before +{ + content: ''; + position: absolute; + top: calc(var(--button-border) * 1); + right: calc(var(--button-border) * 1); + bottom: calc(var(--button-border) * 1); + left: calc(var(--button-border) * 1); + clip-path: var(--button-clip); + background-color: var(--bg); + z-index: -1; +} + +@keyframes glitch +{ + 0% { + clip-path: var(--button-clip-1); + } + 2%, 8% { + clip-path: var(--button-clip-2); + transform: translate(calc(var(--button-shimmy-distance) * -1%), 0); + } + 6% { + clip-path: var(--button-clip-2); + transform: translate(calc(var(--button-shimmy-distance) * 1%), 0); + } + 9% { + clip-path: var(--button-clip-2); + transform: translate(0, 0); + } + 10% { + clip-path: var(--button-clip-3); + transform: translate(calc(var(--button-shimmy-distance) * 1%), 0); + } + 13% { + clip-path: var(--button-clip-3); + transform: translate(0, 0); + } + 14%, 21% { + clip-path: var(--button-clip-4); + transform: translate(calc(var(--button-shimmy-distance) * 1%), 0); + } + 25% { + clip-path: var(--button-clip-5); + transform: translate(calc(var(--button-shimmy-distance) * 1%), 0); + } + 30% { + clip-path: var(--button-clip-5); + transform: translate(calc(var(--button-shimmy-distance) * -1%), 0); + } + 35%, 45% { + clip-path: var(--button-clip-6); + transform: translate(calc(var(--button-shimmy-distance) * -1%)); + } + 40% { + clip-path: var(--button-clip-6); + transform: translate(calc(var(--button-shimmy-distance) * 1%)); + } + 50% { + clip-path: var(--button-clip-6); + transform: translate(0, 0); + } + 55% { + clip-path: var(--button-clip-7); + transform: translate(calc(var(--button-shimmy-distance) * 1%), 0); + } + 60% { + clip-path: var(--button-clip-7); + transform: translate(0, 0); + } + 31%, 61%, 100% { + clip-path: var(--button-clip-4); + } +} +/*#endregion*/ + +/*#region glitches*/ + +/*description: good for images. Effect of a dying flickering screen. Sometimes bright, sometimes dark.*/ +.cyber-glitch-0 +{ + animation: cyber-glitch-0 5s linear infinite; +} + + +@keyframes cyber-glitch-0 +{ + 0% {filter: blur(0) brightness(100%) contrast(100%);} + 2% {filter: blur(.05rem) brightness(120%) contrast(120%);} + 4% {filter: blur(.10rem) brightness(150%) contrast(150%);} + 6% {filter: blur(.20rem) brightness(170%) contrast(170%);} + 8% {filter: blur(0) brightness(100%) contrast(100%);} + 10% {filter: blur(0) brightness(100%) contrast(100%);} + 60% {filter: blur(0) brightness(100%) contrast(100%);} + 62% {filter: blur(.05rem) brightness(60%) contrast(100%);} + 64% {filter: blur(.10rem) brightness(40%) contrast(100%);} + 66% {filter: blur(0) brightness(100%) contrast(100%);} + 68% {filter: blur(.05rem) brightness(60%) contrast(100%);} + 70% {filter: blur(.10rem) brightness(40%) contrast(100%);} + 72% {filter: blur(0) brightness(100%) contrast(100%);} + 100% {filter: blur(0) brightness(100%) contrast(100%);} +} + + +/*description: good for images. nevous little shake first, then distorting/breaking effect by rotating and inverting colors.*/ +.cyber-glitch-1 +{ + animation: cyber-glitch-1 5s linear infinite; +} + +@keyframes cyber-glitch-1 +{ + 0% {transform: translate(0,0) skew(0deg); filter: invert(0);} + 1% {transform: translate(0,0) skew(-3deg); filter: invert(0);} + 2% {transform: translate(0,0) skew(3deg); filter: invert(0);} + 3% {transform: translate(0,0) skew(0deg); filter: invert(0);} + 60% {transform: translate(0,0) skew(0deg); filter: invert(0);} + 61% {transform: translate(0,0) skew(-3deg); filter: invert(0.2);} + 62% {transform: translate(0,0) skew(0deg); filter: invert(0.2);} + 63% {transform: translate(0,0) skew(3deg); filter: invert(0.8);} + 64% {transform: translate(0,0) skew(0deg); filter: invert(0.2);} + 65% {transform: translate(0,0) skew(0deg); filter: invert(0);} +} + +/*description: good for text and containers with text. squeeze effect by removing top an bottom of the element, shake left to right, apply glitchy text-shadow, back to normal*/ +.cyber-glitch-2 +{ + animation: cyber-glitch-2 4s linear infinite; +} + +@keyframes cyber-glitch-2 +{ + 0% {clip-path: var(--og-clip-path); transform: translateX(0); text-shadow: none;} + 2% {clip-path: polygon(0 40%, 0 100%, 100% 100%, 100% 40%); transform: translateX(0); text-shadow: var(--cyan) 1px 1px, var(--yellow) -1px -1px;} + 4% {clip-path: polygon(0 40%, 0 100%, 100% 100%, 100% 40%); transform: translateX(-1rem); text-shadow: var(--cyan) 1px 1px, var(--yellow) -1px -1px;} + 6% {clip-path: polygon(0 40%, 0 100%, 100% 100%, 100% 40%); transform: translateX(1rem); text-shadow: var(--cyan) 1px 1px, var(--yellow) -1px -1px;} + 8% {clip-path: polygon(0 40%, 0 100%, 100% 100%, 100% 40%); transform: translateX(0); text-shadow: var(--cyan) 1px 1px, var(--yellow) -1px -1px;} + 12% {clip-path: polygon(0 10%, 0 40%, 100% 40%, 100% 10%); transform: translateX(0); text-shadow: var(--cyan) 1px 1px, var(--yellow) -1px -1px;} + 14% {clip-path: var(--og-clip-path); transform: translateX(0); text-shadow: none;} + 100% {clip-path: var(--og-clip-path); transform: translateX(0); text-shadow: none;} +} + +/*description: good for text, especially underlines. Steady blinking*/ +.cyber-glitch-3 +{ + animation: cyber-glitch-3 1s linear infinite; +} + +@keyframes cyber-glitch-3 +{ + 0% {visibility: visible;} + 49% {visibility: visible;} + 50% {visibility: hidden;} + 100% {visibility: hidden;} +} + +/*description: good for text, especially underlines. Blinking with different pauses in between.*/ +.cyber-glitch-4 +{ + animation: cyber-glitch-4 5s linear infinite; +} + +@keyframes cyber-glitch-4 +{ + 0% {visibility: visible;} + 1% {visibility: hidden;} + 2% {visibility: hidden;} + 3% {visibility: visible;} + + 20% {visibility: visible;} + 21% {visibility: hidden;} + 24% {visibility: hidden;} + 25% {visibility: visible;} + + 40% {visibility: visible;} + 41% {visibility: hidden;} + 42% {visibility: hidden;} + 43% {visibility: visible;} + + 44% {visibility: visible;} + 45% {visibility: hidden;} + 46% {visibility: hidden;} + 47% {visibility: visible;} + + 60% {visibility: visible;} + 61% {visibility: hidden;} + 64% {visibility: hidden;} + 65% {visibility: visible;} + + 70% {visibility: visible;} + 71% {visibility: hidden;} + 72% {visibility: hidden;} + 73% {visibility: visible;} + + 100% {visibility: visible;} +} +/*#endregion*/ + +/*#region tiles*/ +.cyber-tile, +.cyber-tile-small, +.cyber-tile-big +{ + --tile-width: 360px; + --tile-padding: 4px; + --tile-edges: 20px; + --label-margins: calc(var(--tile-edges) - var(--tile-padding)); + --og-clip-path: polygon(0 0, 0 calc(100% - var(--tile-edges)), var(--tile-edges) 100%, 100% 100%, 100% var(--tile-edges), calc(100% - var(--tile-edges)) 0); + width: var(--tile-width); + min-height: 60px; + clip-path: var(--og-clip-path); + padding: var(--tile-padding); + padding-bottom: var(--tile-edges); +} + +.cyber-tile img, +.cyber-tile-small img, +.cyber-tile-big img +{ + width: 100%; + height: auto; + clip-path: polygon(0 0, 0 100%, 100% 100%, 100% var(--tile-edges), calc(100% - var(--tile-edges)) 0); +} + +.cyber-tile label, +.cyber-tile-small label, +.cyber-tile-big label +{ + display: block; + margin: var(--label-margins) var(--label-margins) 0 var(--label-margins); +} + +.cyber-tile img ~ label , +.cyber-tile-small img ~ label, +.cyber-tile-big img ~ label +{ + margin-top: 0; +} + +/*Overriding the values*/ +.cyber-tile-small +{ + --tile-width: 240px; + --tile-edges: 14px; +} + +/*Overriding the values*/ +.cyber-tile-big +{ + --tile-width: 480px; + --tile-edges: 26px; +} + +/*#endregion*/ + +/*#region code*/ +.code, +code, +.code-block +{ + background-color: var(--dark); + color: var(--cyan); + padding: .3rem .4rem .2rem .4rem; + font-family: Oxanium !important; + font-size: .75rem; +} + +.code-block +{ + clip-path: polygon(0 0, 0 100%, calc(100% - 20px) 100%, 100% calc(100% - 20px), 100% 0); + display: block; + padding: .5rem .6rem .4rem .6rem; +} +.code-block::before +{ + content: attr(data-title); + display: block; + color: var(--yellow); + text-shadow: var(--cyan) 1px 1px; +} +/*#endregion*/ + +/*#region tables*/ +table.cyber-table +{ + padding: 0 !important; + border: none !important; + display: inline-block; + border-collapse: collapse; +} + +table.cyber-table th, +table.cyber-table td +{ + border: 1px solid; + padding: .2rem .5rem; +} + +table.cyber-table thead th +{ + border-bottom-width: 2px ; +} + +table.cyber-table::before, +table.cyber-table::after +{ + content: ' '; + width: 100%; + display: block; + background-color: var(--ac); + position: relative; + height: 6px; +} + +table.cyber-table::before, +table.cyber-table.cyber-style-0::before +{ + clip-path: polygon(0 100%, 100% 100%, 100% 0, 80% 0, calc(80% - 6px) 100%, 30% 100%, calc(30% - 6px) 0, 6px 0); +} + +table.cyber-table::after, +table.cyber-table.cyber-style-0::after +{ + clip-path: polygon(60% 0, calc(60% + 6px) 100%, 100% 100%, 100% 0); +} + +table.cyber-table.cyber-style-1::before +{ + clip-path: polygon(0 100%, 6px 0, 10% 0, 10% 100%, 80% 100%, + calc(80% + 6px) 0, 95% 0, 95% 100%, calc(95% + 6px) 100%, calc(95% + 6px) 0, calc(95% + 2 * 6px) 0, calc(95% + 2 * 6px) 100%, + calc(95% + 3 * 6px) 100%, calc(95% + 3 * 6px) 0, 100% 0, 100% 100%); +} + +table.cyber-table.cyber-style-1::after +{ + clip-path: polygon(100% 0, 100% 100%, calc(100% - 6px) 100%, calc(100% - 6px) 0, + calc(100% - 2 * 6px) 0, calc(100% - 2 * 6px) 100%, 90% 100%, 90% 0, 75% 0, 75% 100%, 60% 100%, calc(60% - 6px) 0); +} + +table.cyber-table.cyber-style-2::before +{ + + clip-path: polygon(0 100%, 6px 0, calc(2 * 6px) 100%, calc(3 * 6px) 0, calc(4 * 6px + 10%) 0,calc(4 * 6px + 10%) 50%, + 35% 50%, 35% 100%, 70% 100%, 70% 50%, 80% 50%, 80% 100%); +} + +table.cyber-table.cyber-style-2::after +{ + + clip-path: polygon(0 0, 0 50%, 10% 50%, 10% 0, 30% 0, 30% 100%, 40% 100%, 40% 0, + 70% 0, 70% 50%, 80% 50%, 80% 100%, 90% 100%, calc(100% - 6px) 100%, 100% 0); +} + +/*#endregion*/ + +/*#region headings*/ +.cyber-h +{ + display: block; + width: 60%; +} + +.cyber-h::after +{ + content: ' '; + width: 100%; + height: 6px; + display: block; + background-color: var(--ac); + clip-path: polygon(0 0, 0 100%, 10% 100%, calc(10% + 4px) 2px, 100% 2px, 100% 0); +} + +h1.cyber-h +{ + font-size: 3.0rem; + margin: 2.0rem 0; + width: 100%; +} + +h2.cyber-h +{ + font-size: 2.5rem; + margin: 1.6rem 0; + width: 90%; +} + +h3.cyber-h +{ + font-size: 2rem; + margin: 1.4rem 0; + width: 80%; +} + +h4.cyber-h +{ + font-size: 1.5rem; + margin: 1.2rem 0; + width: 70%; +} + +h5.cyber-h +{ + font-size: 1.0rem; + margin: 1.0rem 0; + width: 60%; +} + +h6.cyber-h +{ + font-size: 1.0rem; + margin: 1.0rem 0; + font-weight: 400; + width: 60%; +} +/*#endregion*/ + +/*#region banners*/ +.cyber-banner, +.cyber-banner-short +{ + width: 100%; + height: 50px; + background-repeat: no-repeat; + font-size: 1.5rem; + font-weight: 700; + text-align: center; + line-height: 50px; + overflow: hidden; + clip-path: polygon(0 0, 0 100%, calc(100% - 20px) 100%, 100% calc(100% - 20px), 100% 0); + + /*default: --purple --red --yellow --cyan*/ + background: linear-gradient(90deg, var(--banner-color1), var(--banner-color2), var(--banner-color3), var(--banner-color4) var(--banner-gradient-stop)); +} + +.cyber-banner-short +{ + --banner-gradient-stop: 220px; +} + +.cyber-banner.bg-yellow, +.cyber-banner-short.bg-yellow +{ + --banner-color1: var(--cyan); + --banner-color2: var(--purple); + --banner-color3: var(--red); + --banner-color4: var(--yellow); +} + +.cyber-banner.bg-purple, +.cyber-banner-short.bg-purple +{ + --banner-color1: var(--red); + --banner-color2: var(--yellow); + --banner-color3: var(--cyan); + --banner-color4: var(--purple); +} + +.cyber-banner.bg-red, +.cyber-banner-short.bg-red +{ + --banner-color1: var(--yellow); + --banner-color2: var(--cyan); + --banner-color3: var(--purple); + --banner-color4: var(--red); +} + + +.cyber-banner::before, +.cyber-banner-short::before +{ + content: " "; + height: inherit; + display: block; + float: left; + background-position: top left; + background-repeat: no-repeat; + background-size: cover; +} + +/* +Note: Inline svg shit doesnt work sometimes. Make sure to optimize it with https://jakearchibald.github.io/svgomg/ (import and download) +*/ +.cyber-banner::before +{ + width: 405px; + background-image: url('data:image/svg+xml;utf8,'); +} + +.cyber-banner-short::before +{ + width: 220px; + background-image: url('data:image/svg+xml;utf8,') +} +/*#endregion*/ + +/*#region inputs*/ +.cyber-input, +.cyber-input-long, +.cyber-input-full, +.cyber-select, +.cyber-select-long, +.cyber-select-full +{ + font-size: var(--input-font-size); +} + +.cyber-select, +.cyber-select-long, +.cyber-select-full +{ + background-color: transparent !important; +} + +.cyber-input input, +.cyber-input-long input, +.cyber-input-full input, +.cyber-select select, +.cyber-select-long select, +.cyber-select-full select +{ + width: var(--input-width); + color: inherit; + font-family: inherit; + font-size: inherit; + background-color: transparent; + padding: var(--input-padding-top) var(--input-padding-right) var(--input-padding-bot) var(--input-padding-left); + border: none; + text-decoration: none; + outline: none; +} + +.cyber-input-long input, +.cyber-select-long select +{ + --input-width: 320px; +} + +.cyber-input-full input, +.cyber-select-full select +{ + --input-width: 100%; +} + + +.cyber-select select, +.cyber-select-long select, +.cyber-select-full select +{ + width: calc(var(--input-width) + var(--input-padding-left) + var(--input-padding-right)); + font-family: BlenderProBook; + appearance: none; + background-color: transparent; + cursor: pointer; +} + +.cyber-select select option, +.cyber-select-long select option, +.cyber-select-full select option +{ + font-family: "Courier New"; + font-size: .85rem; +} + +.cyber-input::before, +.cyber-input-long::before, +.cyber-input-full::before, +.cyber-select::before, +.cyber-select-long::before, +.cyber-select-full::before +{ + content: 'X'; + color: transparent; + position: absolute; + display: block; + width: var(--input-width); + padding: var(--input-padding-top) var(--input-padding-right) var(--input-padding-bot) var(--input-padding-left); + clip-path: polygon(0 calc(100% - 10px), 10px 100%, 100% 100%, 100% calc(100% - 8px), calc(100% - 20px) calc(100% - 8px), calc(100% - 20px - 8px) calc(100% - 2px), 11px calc(100% - 2px), 0 calc(100% - 13px)); + background-color: var(--ac); +} + +.cyber-select::before, +.cyber-select-long::before, +.cyber-select-full::before +{ + clip-path: polygon(0 calc(100% - 12px), 0 100%, calc(100% - 30px) 100%, calc(100% - 30px) 110%, calc(100% - 20px) 110%, calc(100% - 20px) calc(100% - 8px), calc(100% - 30px) calc(100% - 18px), calc(100% - 10px) calc(100% - 18px), calc(100% - 20px) calc(100% - 8px), calc(100% - 20px) 110%, calc(100% - 30px) 110%, calc(100% - 30px) calc(100% - 2px), 10px calc(100% - 2px)); + z-index: -1; +} + +.cyber-check, +.cyber-radio +{ + width: var(--checkbox-size); + height: var(--checkbox-size); + border: 2px solid var(--black); + border-radius: 3px; + -webkit-appearance: none; + appearance: none; + outline: none; + vertical-align: middle; + margin: 0; + cursor: pointer; +} + +.cyber-check::before, +.cyber-radio::before +{ + content: ""; + width: var(--checkbox-inner-size); + height: var(--checkbox-inner-size); + background-color: var(--ac); + position: relative; + top: calc((var(--checkbox-size) - var(--checkbox-inner-size)) / 2 - 2px); + left: calc((var(--checkbox-size) - var(--checkbox-inner-size)) / 2 - 2px); + display: block; + -webkit-transform: scale(0); + transform: scale(0); + -webkit-transition: 120ms transform ease-in-out; + transition: 120ms transform ease-in-out; + +} + +.cyber-check:checked:before, +.cyber-radio:checked:before +{ + -webkit-transform: scale(1); + transform: scale(1); +} + +.cyber-radio +{ + border-radius: 50%; +} + +.cyber-radio::before +{ + border-radius: 50%; +} + +label +{ + vertical-align: middle; +} + +/*#endregion*/ + +/*#region lists*/ +.cyber-ul, +.cyber-ul-1, +.cyber-ul-2 +{ + list-style: none; + margin: 0; + padding: 0; +} + +.cyber-ul li, +.cyber-ul-1 li, +.cyber-ul-2 li +{ + margin-bottom: .25rem; +} + +.cyber-ul-1, +.cyber-ul-2 +{ + padding-left: 1.5rem; +} + + +.cyber-ul li::before, +.cyber-ul-1 li::before, +.cyber-ul-2 li::before +{ + content: " "; + width: 1rem; + height: 1rem; + -webkit-mask-image: url('data:image/svg+xml;utf8,'); + -webkit-mask-position: top left; + -webkit-mask-repeat: no-repeat; + -webkit-mask-size: 1rem 1rem; + mask-image: url('data:image/svg+xml;utf8,'); + mask-position: top left; + mask-repeat: no-repeat; + mask-size: 1rem 1rem; + background-color: var(--ac); + display: inline-block; + margin-right: .5rem; + vertical-align: middle; +} + +.cyber-ul-1 li::before +{ + -webkit-mask-image: url('data:image/svg+xml;utf8,'); + mask-image: url('data:image/svg+xml;utf8,'); +} + +.cyber-ul-2 li::before +{ + -webkit-mask-image: url('data:image/svg+xml;utf8,'); + mask-image: url('data:image/svg+xml;utf8,'); +} +/*#endregion*/ + +/*#region a*/ +.cyber-a +{ + color: var(--blue); +} +.cyber-a:hover +{ + text-shadow: var(--cyan) 0px 0px 1px; +} +/*#endregion*/ + +@media screen and (max-width: 768px) +{ + :root + { + --root-font-size: 14px; + } + + .cyber-tile + { + max-width: 100%; + } + + .cyber-tile-big + { + max-width: 100%; + } +} \ No newline at end of file diff --git a/assets/css/main.css b/assets/css/main.css new file mode 100644 index 0000000..a2412b0 --- /dev/null +++ b/assets/css/main.css @@ -0,0 +1,8062 @@ +@charset "UTF-8"; +.materialize-red { + background-color: #e51c23 !important; +} + +.materialize-red-text { + color: #e51c23 !important; +} + +.materialize-red.lighten-5 { + background-color: #fdeaeb !important; +} + +.materialize-red-text.text-lighten-5 { + color: #fdeaeb !important; +} + +.materialize-red.lighten-4 { + background-color: #f8c1c3 !important; +} + +.materialize-red-text.text-lighten-4 { + color: #f8c1c3 !important; +} + +.materialize-red.lighten-3 { + background-color: #f3989b !important; +} + +.materialize-red-text.text-lighten-3 { + color: #f3989b !important; +} + +.materialize-red.lighten-2 { + background-color: #ee6e73 !important; +} + +.materialize-red-text.text-lighten-2 { + color: #ee6e73 !important; +} + +.materialize-red.lighten-1 { + background-color: #ea454b !important; +} + +.materialize-red-text.text-lighten-1 { + color: #ea454b !important; +} + +.materialize-red.darken-1 { + background-color: #d0181e !important; +} + +.materialize-red-text.text-darken-1 { + color: #d0181e !important; +} + +.materialize-red.darken-2 { + background-color: #b9151b !important; +} + +.materialize-red-text.text-darken-2 { + color: #b9151b !important; +} + +.materialize-red.darken-3 { + background-color: #a21318 !important; +} + +.materialize-red-text.text-darken-3 { + color: #a21318 !important; +} + +.materialize-red.darken-4 { + background-color: #8b1014 !important; +} + +.materialize-red-text.text-darken-4 { + color: #8b1014 !important; +} + +.red { + background-color: #F44336 !important; +} + +.red-text { + color: #F44336 !important; +} + +.red.lighten-5 { + background-color: #FFEBEE !important; +} + +.red-text.text-lighten-5 { + color: #FFEBEE !important; +} + +.red.lighten-4 { + background-color: #FFCDD2 !important; +} + +.red-text.text-lighten-4 { + color: #FFCDD2 !important; +} + +.red.lighten-3 { + background-color: #EF9A9A !important; +} + +.red-text.text-lighten-3 { + color: #EF9A9A !important; +} + +.red.lighten-2 { + background-color: #E57373 !important; +} + +.red-text.text-lighten-2 { + color: #E57373 !important; +} + +.red.lighten-1 { + background-color: #EF5350 !important; +} + +.red-text.text-lighten-1 { + color: #EF5350 !important; +} + +.red.darken-1 { + background-color: #E53935 !important; +} + +.red-text.text-darken-1 { + color: #E53935 !important; +} + +.red.darken-2 { + background-color: #D32F2F !important; +} + +.red-text.text-darken-2 { + color: #D32F2F !important; +} + +.red.darken-3 { + background-color: #C62828 !important; +} + +.red-text.text-darken-3 { + color: #C62828 !important; +} + +.red.darken-4 { + background-color: #B71C1C !important; +} + +.red-text.text-darken-4 { + color: #B71C1C !important; +} + +.red.accent-1 { + background-color: #FF8A80 !important; +} + +.red-text.text-accent-1 { + color: #FF8A80 !important; +} + +.red.accent-2 { + background-color: #FF5252 !important; +} + +.red-text.text-accent-2 { + color: #FF5252 !important; +} + +.red.accent-3 { + background-color: #FF1744 !important; +} + +.red-text.text-accent-3 { + color: #FF1744 !important; +} + +.red.accent-4 { + background-color: #D50000 !important; +} + +.red-text.text-accent-4 { + color: #D50000 !important; +} + +.pink { + background-color: #e91e63 !important; +} + +.pink-text { + color: #e91e63 !important; +} + +.pink.lighten-5 { + background-color: #fce4ec !important; +} + +.pink-text.text-lighten-5 { + color: #fce4ec !important; +} + +.pink.lighten-4 { + background-color: #f8bbd0 !important; +} + +.pink-text.text-lighten-4 { + color: #f8bbd0 !important; +} + +.pink.lighten-3 { + background-color: #f48fb1 !important; +} + +.pink-text.text-lighten-3 { + color: #f48fb1 !important; +} + +.pink.lighten-2 { + background-color: #f06292 !important; +} + +.pink-text.text-lighten-2 { + color: #f06292 !important; +} + +.pink.lighten-1 { + background-color: #ec407a !important; +} + +.pink-text.text-lighten-1 { + color: #ec407a !important; +} + +.pink.darken-1 { + background-color: #d81b60 !important; +} + +.pink-text.text-darken-1 { + color: #d81b60 !important; +} + +.pink.darken-2 { + background-color: #c2185b !important; +} + +.pink-text.text-darken-2 { + color: #c2185b !important; +} + +.pink.darken-3 { + background-color: #ad1457 !important; +} + +.pink-text.text-darken-3 { + color: #ad1457 !important; +} + +.pink.darken-4 { + background-color: #880e4f !important; +} + +.pink-text.text-darken-4 { + color: #880e4f !important; +} + +.pink.accent-1 { + background-color: #ff80ab !important; +} + +.pink-text.text-accent-1 { + color: #ff80ab !important; +} + +.pink.accent-2 { + background-color: #ff4081 !important; +} + +.pink-text.text-accent-2 { + color: #ff4081 !important; +} + +.pink.accent-3 { + background-color: #f50057 !important; +} + +.pink-text.text-accent-3 { + color: #f50057 !important; +} + +.pink.accent-4 { + background-color: #c51162 !important; +} + +.pink-text.text-accent-4 { + color: #c51162 !important; +} + +.purple { + background-color: #9c27b0 !important; +} + +.purple-text { + color: #9c27b0 !important; +} + +.purple.lighten-5 { + background-color: #f3e5f5 !important; +} + +.purple-text.text-lighten-5 { + color: #f3e5f5 !important; +} + +.purple.lighten-4 { + background-color: #e1bee7 !important; +} + +.purple-text.text-lighten-4 { + color: #e1bee7 !important; +} + +.purple.lighten-3 { + background-color: #ce93d8 !important; +} + +.purple-text.text-lighten-3 { + color: #ce93d8 !important; +} + +.purple.lighten-2 { + background-color: #ba68c8 !important; +} + +.purple-text.text-lighten-2 { + color: #ba68c8 !important; +} + +.purple.lighten-1 { + background-color: #ab47bc !important; +} + +.purple-text.text-lighten-1 { + color: #ab47bc !important; +} + +.purple.darken-1 { + background-color: #8e24aa !important; +} + +.purple-text.text-darken-1 { + color: #8e24aa !important; +} + +.purple.darken-2 { + background-color: #7b1fa2 !important; +} + +.purple-text.text-darken-2 { + color: #7b1fa2 !important; +} + +.purple.darken-3 { + background-color: #6a1b9a !important; +} + +.purple-text.text-darken-3 { + color: #6a1b9a !important; +} + +.purple.darken-4 { + background-color: #4a148c !important; +} + +.purple-text.text-darken-4 { + color: #4a148c !important; +} + +.purple.accent-1 { + background-color: #ea80fc !important; +} + +.purple-text.text-accent-1 { + color: #ea80fc !important; +} + +.purple.accent-2 { + background-color: #e040fb !important; +} + +.purple-text.text-accent-2 { + color: #e040fb !important; +} + +.purple.accent-3 { + background-color: #d500f9 !important; +} + +.purple-text.text-accent-3 { + color: #d500f9 !important; +} + +.purple.accent-4 { + background-color: #aa00ff !important; +} + +.purple-text.text-accent-4 { + color: #aa00ff !important; +} + +.deep-purple { + background-color: #673ab7 !important; +} + +.deep-purple-text { + color: #673ab7 !important; +} + +.deep-purple.lighten-5 { + background-color: #ede7f6 !important; +} + +.deep-purple-text.text-lighten-5 { + color: #ede7f6 !important; +} + +.deep-purple.lighten-4 { + background-color: #d1c4e9 !important; +} + +.deep-purple-text.text-lighten-4 { + color: #d1c4e9 !important; +} + +.deep-purple.lighten-3 { + background-color: #b39ddb !important; +} + +.deep-purple-text.text-lighten-3 { + color: #b39ddb !important; +} + +.deep-purple.lighten-2 { + background-color: #9575cd !important; +} + +.deep-purple-text.text-lighten-2 { + color: #9575cd !important; +} + +.deep-purple.lighten-1 { + background-color: #7e57c2 !important; +} + +.deep-purple-text.text-lighten-1 { + color: #7e57c2 !important; +} + +.deep-purple.darken-1 { + background-color: #5e35b1 !important; +} + +.deep-purple-text.text-darken-1 { + color: #5e35b1 !important; +} + +.deep-purple.darken-2 { + background-color: #512da8 !important; +} + +.deep-purple-text.text-darken-2 { + color: #512da8 !important; +} + +.deep-purple.darken-3 { + background-color: #4527a0 !important; +} + +.deep-purple-text.text-darken-3 { + color: #4527a0 !important; +} + +.deep-purple.darken-4 { + background-color: #311b92 !important; +} + +.deep-purple-text.text-darken-4 { + color: #311b92 !important; +} + +.deep-purple.accent-1 { + background-color: #b388ff !important; +} + +.deep-purple-text.text-accent-1 { + color: #b388ff !important; +} + +.deep-purple.accent-2 { + background-color: #7c4dff !important; +} + +.deep-purple-text.text-accent-2 { + color: #7c4dff !important; +} + +.deep-purple.accent-3 { + background-color: #651fff !important; +} + +.deep-purple-text.text-accent-3 { + color: #651fff !important; +} + +.deep-purple.accent-4 { + background-color: #6200ea !important; +} + +.deep-purple-text.text-accent-4 { + color: #6200ea !important; +} + +.indigo { + background-color: #3f51b5 !important; +} + +.indigo-text { + color: #3f51b5 !important; +} + +.indigo.lighten-5 { + background-color: #e8eaf6 !important; +} + +.indigo-text.text-lighten-5 { + color: #e8eaf6 !important; +} + +.indigo.lighten-4 { + background-color: #c5cae9 !important; +} + +.indigo-text.text-lighten-4 { + color: #c5cae9 !important; +} + +.indigo.lighten-3 { + background-color: #9fa8da !important; +} + +.indigo-text.text-lighten-3 { + color: #9fa8da !important; +} + +.indigo.lighten-2 { + background-color: #7986cb !important; +} + +.indigo-text.text-lighten-2 { + color: #7986cb !important; +} + +.indigo.lighten-1 { + background-color: #5c6bc0 !important; +} + +.indigo-text.text-lighten-1 { + color: #5c6bc0 !important; +} + +.indigo.darken-1 { + background-color: #3949ab !important; +} + +.indigo-text.text-darken-1 { + color: #3949ab !important; +} + +.indigo.darken-2 { + background-color: #303f9f !important; +} + +.indigo-text.text-darken-2 { + color: #303f9f !important; +} + +.indigo.darken-3 { + background-color: #283593 !important; +} + +.indigo-text.text-darken-3 { + color: #283593 !important; +} + +.indigo.darken-4 { + background-color: #1a237e !important; +} + +.indigo-text.text-darken-4 { + color: #1a237e !important; +} + +.indigo.accent-1 { + background-color: #8c9eff !important; +} + +.indigo-text.text-accent-1 { + color: #8c9eff !important; +} + +.indigo.accent-2 { + background-color: #536dfe !important; +} + +.indigo-text.text-accent-2 { + color: #536dfe !important; +} + +.indigo.accent-3 { + background-color: #3d5afe !important; +} + +.indigo-text.text-accent-3 { + color: #3d5afe !important; +} + +.indigo.accent-4 { + background-color: #304ffe !important; +} + +.indigo-text.text-accent-4 { + color: #304ffe !important; +} + +.blue { + background-color: #2196F3 !important; +} + +.blue-text { + color: #2196F3 !important; +} + +.blue.lighten-5 { + background-color: #E3F2FD !important; +} + +.blue-text.text-lighten-5 { + color: #E3F2FD !important; +} + +.blue.lighten-4 { + background-color: #BBDEFB !important; +} + +.blue-text.text-lighten-4 { + color: #BBDEFB !important; +} + +.blue.lighten-3 { + background-color: #90CAF9 !important; +} + +.blue-text.text-lighten-3 { + color: #90CAF9 !important; +} + +.blue.lighten-2 { + background-color: #64B5F6 !important; +} + +.blue-text.text-lighten-2 { + color: #64B5F6 !important; +} + +.blue.lighten-1 { + background-color: #42A5F5 !important; +} + +.blue-text.text-lighten-1 { + color: #42A5F5 !important; +} + +.blue.darken-1 { + background-color: #1E88E5 !important; +} + +.blue-text.text-darken-1 { + color: #1E88E5 !important; +} + +.blue.darken-2 { + background-color: #1976D2 !important; +} + +.blue-text.text-darken-2 { + color: #1976D2 !important; +} + +.blue.darken-3 { + background-color: #1565C0 !important; +} + +.blue-text.text-darken-3 { + color: #1565C0 !important; +} + +.blue.darken-4 { + background-color: #0D47A1 !important; +} + +.blue-text.text-darken-4 { + color: #0D47A1 !important; +} + +.blue.accent-1 { + background-color: #82B1FF !important; +} + +.blue-text.text-accent-1 { + color: #82B1FF !important; +} + +.blue.accent-2 { + background-color: #448AFF !important; +} + +.blue-text.text-accent-2 { + color: #448AFF !important; +} + +.blue.accent-3 { + background-color: #2979FF !important; +} + +.blue-text.text-accent-3 { + color: #2979FF !important; +} + +.blue.accent-4 { + background-color: #2962FF !important; +} + +.blue-text.text-accent-4 { + color: #2962FF !important; +} + +.light-blue { + background-color: #03a9f4 !important; +} + +.light-blue-text { + color: #03a9f4 !important; +} + +.light-blue.lighten-5 { + background-color: #e1f5fe !important; +} + +.light-blue-text.text-lighten-5 { + color: #e1f5fe !important; +} + +.light-blue.lighten-4 { + background-color: #b3e5fc !important; +} + +.light-blue-text.text-lighten-4 { + color: #b3e5fc !important; +} + +.light-blue.lighten-3 { + background-color: #81d4fa !important; +} + +.light-blue-text.text-lighten-3 { + color: #81d4fa !important; +} + +.light-blue.lighten-2 { + background-color: #4fc3f7 !important; +} + +.light-blue-text.text-lighten-2 { + color: #4fc3f7 !important; +} + +.light-blue.lighten-1 { + background-color: #29b6f6 !important; +} + +.light-blue-text.text-lighten-1 { + color: #29b6f6 !important; +} + +.light-blue.darken-1 { + background-color: #039be5 !important; +} + +.light-blue-text.text-darken-1 { + color: #039be5 !important; +} + +.light-blue.darken-2 { + background-color: #0288d1 !important; +} + +.light-blue-text.text-darken-2 { + color: #0288d1 !important; +} + +.light-blue.darken-3 { + background-color: #0277bd !important; +} + +.light-blue-text.text-darken-3 { + color: #0277bd !important; +} + +.light-blue.darken-4 { + background-color: #01579b !important; +} + +.light-blue-text.text-darken-4 { + color: #01579b !important; +} + +.light-blue.accent-1 { + background-color: #80d8ff !important; +} + +.light-blue-text.text-accent-1 { + color: #80d8ff !important; +} + +.light-blue.accent-2 { + background-color: #40c4ff !important; +} + +.light-blue-text.text-accent-2 { + color: #40c4ff !important; +} + +.light-blue.accent-3 { + background-color: #00b0ff !important; +} + +.light-blue-text.text-accent-3 { + color: #00b0ff !important; +} + +.light-blue.accent-4 { + background-color: #0091ea !important; +} + +.light-blue-text.text-accent-4 { + color: #0091ea !important; +} + +.cyan { + background-color: #00bcd4 !important; +} + +.cyan-text { + color: #00bcd4 !important; +} + +.cyan.lighten-5 { + background-color: #e0f7fa !important; +} + +.cyan-text.text-lighten-5 { + color: #e0f7fa !important; +} + +.cyan.lighten-4 { + background-color: #b2ebf2 !important; +} + +.cyan-text.text-lighten-4 { + color: #b2ebf2 !important; +} + +.cyan.lighten-3 { + background-color: #80deea !important; +} + +.cyan-text.text-lighten-3 { + color: #80deea !important; +} + +.cyan.lighten-2 { + background-color: #4dd0e1 !important; +} + +.cyan-text.text-lighten-2 { + color: #4dd0e1 !important; +} + +.cyan.lighten-1 { + background-color: #26c6da !important; +} + +.cyan-text.text-lighten-1 { + color: #26c6da !important; +} + +.cyan.darken-1 { + background-color: #00acc1 !important; +} + +.cyan-text.text-darken-1 { + color: #00acc1 !important; +} + +.cyan.darken-2 { + background-color: #0097a7 !important; +} + +.cyan-text.text-darken-2 { + color: #0097a7 !important; +} + +.cyan.darken-3 { + background-color: #00838f !important; +} + +.cyan-text.text-darken-3 { + color: #00838f !important; +} + +.cyan.darken-4 { + background-color: #006064 !important; +} + +.cyan-text.text-darken-4 { + color: #006064 !important; +} + +.cyan.accent-1 { + background-color: #84ffff !important; +} + +.cyan-text.text-accent-1 { + color: #84ffff !important; +} + +.cyan.accent-2 { + background-color: #18ffff !important; +} + +.cyan-text.text-accent-2 { + color: #18ffff !important; +} + +.cyan.accent-3 { + background-color: #00e5ff !important; +} + +.cyan-text.text-accent-3 { + color: #00e5ff !important; +} + +.cyan.accent-4 { + background-color: #00b8d4 !important; +} + +.cyan-text.text-accent-4 { + color: #00b8d4 !important; +} + +.teal { + background-color: #009688 !important; +} + +.teal-text { + color: #009688 !important; +} + +.teal.lighten-5 { + background-color: #e0f2f1 !important; +} + +.teal-text.text-lighten-5 { + color: #e0f2f1 !important; +} + +.teal.lighten-4 { + background-color: #b2dfdb !important; +} + +.teal-text.text-lighten-4 { + color: #b2dfdb !important; +} + +.teal.lighten-3 { + background-color: #80cbc4 !important; +} + +.teal-text.text-lighten-3 { + color: #80cbc4 !important; +} + +.teal.lighten-2 { + background-color: #4db6ac !important; +} + +.teal-text.text-lighten-2 { + color: #4db6ac !important; +} + +.teal.lighten-1 { + background-color: #26a69a !important; +} + +.teal-text.text-lighten-1 { + color: #26a69a !important; +} + +.teal.darken-1 { + background-color: #00897b !important; +} + +.teal-text.text-darken-1 { + color: #00897b !important; +} + +.teal.darken-2 { + background-color: #00796b !important; +} + +.teal-text.text-darken-2 { + color: #00796b !important; +} + +.teal.darken-3 { + background-color: #00695c !important; +} + +.teal-text.text-darken-3 { + color: #00695c !important; +} + +.teal.darken-4 { + background-color: #004d40 !important; +} + +.teal-text.text-darken-4 { + color: #004d40 !important; +} + +.teal.accent-1 { + background-color: #a7ffeb !important; +} + +.teal-text.text-accent-1 { + color: #a7ffeb !important; +} + +.teal.accent-2 { + background-color: #64ffda !important; +} + +.teal-text.text-accent-2 { + color: #64ffda !important; +} + +.teal.accent-3 { + background-color: #1de9b6 !important; +} + +.teal-text.text-accent-3 { + color: #1de9b6 !important; +} + +.teal.accent-4 { + background-color: #00bfa5 !important; +} + +.teal-text.text-accent-4 { + color: #00bfa5 !important; +} + +.green { + background-color: #4CAF50 !important; +} + +.green-text { + color: #4CAF50 !important; +} + +.green.lighten-5 { + background-color: #E8F5E9 !important; +} + +.green-text.text-lighten-5 { + color: #E8F5E9 !important; +} + +.green.lighten-4 { + background-color: #C8E6C9 !important; +} + +.green-text.text-lighten-4 { + color: #C8E6C9 !important; +} + +.green.lighten-3 { + background-color: #A5D6A7 !important; +} + +.green-text.text-lighten-3 { + color: #A5D6A7 !important; +} + +.green.lighten-2 { + background-color: #81C784 !important; +} + +.green-text.text-lighten-2 { + color: #81C784 !important; +} + +.green.lighten-1 { + background-color: #66BB6A !important; +} + +.green-text.text-lighten-1 { + color: #66BB6A !important; +} + +.green.darken-1 { + background-color: #43A047 !important; +} + +.green-text.text-darken-1 { + color: #43A047 !important; +} + +.green.darken-2 { + background-color: #388E3C !important; +} + +.green-text.text-darken-2 { + color: #388E3C !important; +} + +.green.darken-3 { + background-color: #2E7D32 !important; +} + +.green-text.text-darken-3 { + color: #2E7D32 !important; +} + +.green.darken-4 { + background-color: #1B5E20 !important; +} + +.green-text.text-darken-4 { + color: #1B5E20 !important; +} + +.green.accent-1 { + background-color: #B9F6CA !important; +} + +.green-text.text-accent-1 { + color: #B9F6CA !important; +} + +.green.accent-2 { + background-color: #69F0AE !important; +} + +.green-text.text-accent-2 { + color: #69F0AE !important; +} + +.green.accent-3 { + background-color: #00E676 !important; +} + +.green-text.text-accent-3 { + color: #00E676 !important; +} + +.green.accent-4 { + background-color: #00C853 !important; +} + +.green-text.text-accent-4 { + color: #00C853 !important; +} + +.light-green { + background-color: #8bc34a !important; +} + +.light-green-text { + color: #8bc34a !important; +} + +.light-green.lighten-5 { + background-color: #f1f8e9 !important; +} + +.light-green-text.text-lighten-5 { + color: #f1f8e9 !important; +} + +.light-green.lighten-4 { + background-color: #dcedc8 !important; +} + +.light-green-text.text-lighten-4 { + color: #dcedc8 !important; +} + +.light-green.lighten-3 { + background-color: #c5e1a5 !important; +} + +.light-green-text.text-lighten-3 { + color: #c5e1a5 !important; +} + +.light-green.lighten-2 { + background-color: #aed581 !important; +} + +.light-green-text.text-lighten-2 { + color: #aed581 !important; +} + +.light-green.lighten-1 { + background-color: #9ccc65 !important; +} + +.light-green-text.text-lighten-1 { + color: #9ccc65 !important; +} + +.light-green.darken-1 { + background-color: #7cb342 !important; +} + +.light-green-text.text-darken-1 { + color: #7cb342 !important; +} + +.light-green.darken-2 { + background-color: #689f38 !important; +} + +.light-green-text.text-darken-2 { + color: #689f38 !important; +} + +.light-green.darken-3 { + background-color: #558b2f !important; +} + +.light-green-text.text-darken-3 { + color: #558b2f !important; +} + +.light-green.darken-4 { + background-color: #33691e !important; +} + +.light-green-text.text-darken-4 { + color: #33691e !important; +} + +.light-green.accent-1 { + background-color: #ccff90 !important; +} + +.light-green-text.text-accent-1 { + color: #ccff90 !important; +} + +.light-green.accent-2 { + background-color: #b2ff59 !important; +} + +.light-green-text.text-accent-2 { + color: #b2ff59 !important; +} + +.light-green.accent-3 { + background-color: #76ff03 !important; +} + +.light-green-text.text-accent-3 { + color: #76ff03 !important; +} + +.light-green.accent-4 { + background-color: #64dd17 !important; +} + +.light-green-text.text-accent-4 { + color: #64dd17 !important; +} + +.lime { + background-color: #cddc39 !important; +} + +.lime-text { + color: #cddc39 !important; +} + +.lime.lighten-5 { + background-color: #f9fbe7 !important; +} + +.lime-text.text-lighten-5 { + color: #f9fbe7 !important; +} + +.lime.lighten-4 { + background-color: #f0f4c3 !important; +} + +.lime-text.text-lighten-4 { + color: #f0f4c3 !important; +} + +.lime.lighten-3 { + background-color: #e6ee9c !important; +} + +.lime-text.text-lighten-3 { + color: #e6ee9c !important; +} + +.lime.lighten-2 { + background-color: #dce775 !important; +} + +.lime-text.text-lighten-2 { + color: #dce775 !important; +} + +.lime.lighten-1 { + background-color: #d4e157 !important; +} + +.lime-text.text-lighten-1 { + color: #d4e157 !important; +} + +.lime.darken-1 { + background-color: #c0ca33 !important; +} + +.lime-text.text-darken-1 { + color: #c0ca33 !important; +} + +.lime.darken-2 { + background-color: #afb42b !important; +} + +.lime-text.text-darken-2 { + color: #afb42b !important; +} + +.lime.darken-3 { + background-color: #9e9d24 !important; +} + +.lime-text.text-darken-3 { + color: #9e9d24 !important; +} + +.lime.darken-4 { + background-color: #827717 !important; +} + +.lime-text.text-darken-4 { + color: #827717 !important; +} + +.lime.accent-1 { + background-color: #f4ff81 !important; +} + +.lime-text.text-accent-1 { + color: #f4ff81 !important; +} + +.lime.accent-2 { + background-color: #eeff41 !important; +} + +.lime-text.text-accent-2 { + color: #eeff41 !important; +} + +.lime.accent-3 { + background-color: #c6ff00 !important; +} + +.lime-text.text-accent-3 { + color: #c6ff00 !important; +} + +.lime.accent-4 { + background-color: #aeea00 !important; +} + +.lime-text.text-accent-4 { + color: #aeea00 !important; +} + +.yellow { + background-color: #ffeb3b !important; +} + +.yellow-text { + color: #ffeb3b !important; +} + +.yellow.lighten-5 { + background-color: #fffde7 !important; +} + +.yellow-text.text-lighten-5 { + color: #fffde7 !important; +} + +.yellow.lighten-4 { + background-color: #fff9c4 !important; +} + +.yellow-text.text-lighten-4 { + color: #fff9c4 !important; +} + +.yellow.lighten-3 { + background-color: #fff59d !important; +} + +.yellow-text.text-lighten-3 { + color: #fff59d !important; +} + +.yellow.lighten-2 { + background-color: #fff176 !important; +} + +.yellow-text.text-lighten-2 { + color: #fff176 !important; +} + +.yellow.lighten-1 { + background-color: #ffee58 !important; +} + +.yellow-text.text-lighten-1 { + color: #ffee58 !important; +} + +.yellow.darken-1 { + background-color: #fdd835 !important; +} + +.yellow-text.text-darken-1 { + color: #fdd835 !important; +} + +.yellow.darken-2 { + background-color: #fbc02d !important; +} + +.yellow-text.text-darken-2 { + color: #fbc02d !important; +} + +.yellow.darken-3 { + background-color: #f9a825 !important; +} + +.yellow-text.text-darken-3 { + color: #f9a825 !important; +} + +.yellow.darken-4 { + background-color: #f57f17 !important; +} + +.yellow-text.text-darken-4 { + color: #f57f17 !important; +} + +.yellow.accent-1 { + background-color: #ffff8d !important; +} + +.yellow-text.text-accent-1 { + color: #ffff8d !important; +} + +.yellow.accent-2 { + background-color: #ffff00 !important; +} + +.yellow-text.text-accent-2 { + color: #ffff00 !important; +} + +.yellow.accent-3 { + background-color: #ffea00 !important; +} + +.yellow-text.text-accent-3 { + color: #ffea00 !important; +} + +.yellow.accent-4 { + background-color: #ffd600 !important; +} + +.yellow-text.text-accent-4 { + color: #ffd600 !important; +} + +.amber { + background-color: #ffc107 !important; +} + +.amber-text { + color: #ffc107 !important; +} + +.amber.lighten-5 { + background-color: #fff8e1 !important; +} + +.amber-text.text-lighten-5 { + color: #fff8e1 !important; +} + +.amber.lighten-4 { + background-color: #ffecb3 !important; +} + +.amber-text.text-lighten-4 { + color: #ffecb3 !important; +} + +.amber.lighten-3 { + background-color: #ffe082 !important; +} + +.amber-text.text-lighten-3 { + color: #ffe082 !important; +} + +.amber.lighten-2 { + background-color: #ffd54f !important; +} + +.amber-text.text-lighten-2 { + color: #ffd54f !important; +} + +.amber.lighten-1 { + background-color: #ffca28 !important; +} + +.amber-text.text-lighten-1 { + color: #ffca28 !important; +} + +.amber.darken-1 { + background-color: #ffb300 !important; +} + +.amber-text.text-darken-1 { + color: #ffb300 !important; +} + +.amber.darken-2 { + background-color: #ffa000 !important; +} + +.amber-text.text-darken-2 { + color: #ffa000 !important; +} + +.amber.darken-3 { + background-color: #ff8f00 !important; +} + +.amber-text.text-darken-3 { + color: #ff8f00 !important; +} + +.amber.darken-4 { + background-color: #ff6f00 !important; +} + +.amber-text.text-darken-4 { + color: #ff6f00 !important; +} + +.amber.accent-1 { + background-color: #ffe57f !important; +} + +.amber-text.text-accent-1 { + color: #ffe57f !important; +} + +.amber.accent-2 { + background-color: #ffd740 !important; +} + +.amber-text.text-accent-2 { + color: #ffd740 !important; +} + +.amber.accent-3 { + background-color: #ffc400 !important; +} + +.amber-text.text-accent-3 { + color: #ffc400 !important; +} + +.amber.accent-4 { + background-color: #ffab00 !important; +} + +.amber-text.text-accent-4 { + color: #ffab00 !important; +} + +.orange { + background-color: #ff9800 !important; +} + +.orange-text { + color: #ff9800 !important; +} + +.orange.lighten-5 { + background-color: #fff3e0 !important; +} + +.orange-text.text-lighten-5 { + color: #fff3e0 !important; +} + +.orange.lighten-4 { + background-color: #ffe0b2 !important; +} + +.orange-text.text-lighten-4 { + color: #ffe0b2 !important; +} + +.orange.lighten-3 { + background-color: #ffcc80 !important; +} + +.orange-text.text-lighten-3 { + color: #ffcc80 !important; +} + +.orange.lighten-2 { + background-color: #ffb74d !important; +} + +.orange-text.text-lighten-2 { + color: #ffb74d !important; +} + +.orange.lighten-1 { + background-color: #ffa726 !important; +} + +.orange-text.text-lighten-1 { + color: #ffa726 !important; +} + +.orange.darken-1 { + background-color: #fb8c00 !important; +} + +.orange-text.text-darken-1 { + color: #fb8c00 !important; +} + +.orange.darken-2 { + background-color: #f57c00 !important; +} + +.orange-text.text-darken-2 { + color: #f57c00 !important; +} + +.orange.darken-3 { + background-color: #ef6c00 !important; +} + +.orange-text.text-darken-3 { + color: #ef6c00 !important; +} + +.orange.darken-4 { + background-color: #e65100 !important; +} + +.orange-text.text-darken-4 { + color: #e65100 !important; +} + +.orange.accent-1 { + background-color: #ffd180 !important; +} + +.orange-text.text-accent-1 { + color: #ffd180 !important; +} + +.orange.accent-2 { + background-color: #ffab40 !important; +} + +.orange-text.text-accent-2 { + color: #ffab40 !important; +} + +.orange.accent-3 { + background-color: #ff9100 !important; +} + +.orange-text.text-accent-3 { + color: #ff9100 !important; +} + +.orange.accent-4 { + background-color: #ff6d00 !important; +} + +.orange-text.text-accent-4 { + color: #ff6d00 !important; +} + +.deep-orange { + background-color: #ff5722 !important; +} + +.deep-orange-text { + color: #ff5722 !important; +} + +.deep-orange.lighten-5 { + background-color: #fbe9e7 !important; +} + +.deep-orange-text.text-lighten-5 { + color: #fbe9e7 !important; +} + +.deep-orange.lighten-4 { + background-color: #ffccbc !important; +} + +.deep-orange-text.text-lighten-4 { + color: #ffccbc !important; +} + +.deep-orange.lighten-3 { + background-color: #ffab91 !important; +} + +.deep-orange-text.text-lighten-3 { + color: #ffab91 !important; +} + +.deep-orange.lighten-2 { + background-color: #ff8a65 !important; +} + +.deep-orange-text.text-lighten-2 { + color: #ff8a65 !important; +} + +.deep-orange.lighten-1 { + background-color: #ff7043 !important; +} + +.deep-orange-text.text-lighten-1 { + color: #ff7043 !important; +} + +.deep-orange.darken-1 { + background-color: #f4511e !important; +} + +.deep-orange-text.text-darken-1 { + color: #f4511e !important; +} + +.deep-orange.darken-2 { + background-color: #e64a19 !important; +} + +.deep-orange-text.text-darken-2 { + color: #e64a19 !important; +} + +.deep-orange.darken-3 { + background-color: #d84315 !important; +} + +.deep-orange-text.text-darken-3 { + color: #d84315 !important; +} + +.deep-orange.darken-4 { + background-color: #bf360c !important; +} + +.deep-orange-text.text-darken-4 { + color: #bf360c !important; +} + +.deep-orange.accent-1 { + background-color: #ff9e80 !important; +} + +.deep-orange-text.text-accent-1 { + color: #ff9e80 !important; +} + +.deep-orange.accent-2 { + background-color: #ff6e40 !important; +} + +.deep-orange-text.text-accent-2 { + color: #ff6e40 !important; +} + +.deep-orange.accent-3 { + background-color: #ff3d00 !important; +} + +.deep-orange-text.text-accent-3 { + color: #ff3d00 !important; +} + +.deep-orange.accent-4 { + background-color: #dd2c00 !important; +} + +.deep-orange-text.text-accent-4 { + color: #dd2c00 !important; +} + +.brown { + background-color: #795548 !important; +} + +.brown-text { + color: #795548 !important; +} + +.brown.lighten-5 { + background-color: #efebe9 !important; +} + +.brown-text.text-lighten-5 { + color: #efebe9 !important; +} + +.brown.lighten-4 { + background-color: #d7ccc8 !important; +} + +.brown-text.text-lighten-4 { + color: #d7ccc8 !important; +} + +.brown.lighten-3 { + background-color: #bcaaa4 !important; +} + +.brown-text.text-lighten-3 { + color: #bcaaa4 !important; +} + +.brown.lighten-2 { + background-color: #a1887f !important; +} + +.brown-text.text-lighten-2 { + color: #a1887f !important; +} + +.brown.lighten-1 { + background-color: #8d6e63 !important; +} + +.brown-text.text-lighten-1 { + color: #8d6e63 !important; +} + +.brown.darken-1 { + background-color: #6d4c41 !important; +} + +.brown-text.text-darken-1 { + color: #6d4c41 !important; +} + +.brown.darken-2 { + background-color: #5d4037 !important; +} + +.brown-text.text-darken-2 { + color: #5d4037 !important; +} + +.brown.darken-3 { + background-color: #4e342e !important; +} + +.brown-text.text-darken-3 { + color: #4e342e !important; +} + +.brown.darken-4 { + background-color: #3e2723 !important; +} + +.brown-text.text-darken-4 { + color: #3e2723 !important; +} + +.blue-grey { + background-color: #607d8b !important; +} + +.blue-grey-text { + color: #607d8b !important; +} + +.blue-grey.lighten-5 { + background-color: #eceff1 !important; +} + +.blue-grey-text.text-lighten-5 { + color: #eceff1 !important; +} + +.blue-grey.lighten-4 { + background-color: #cfd8dc !important; +} + +.blue-grey-text.text-lighten-4 { + color: #cfd8dc !important; +} + +.blue-grey.lighten-3 { + background-color: #b0bec5 !important; +} + +.blue-grey-text.text-lighten-3 { + color: #b0bec5 !important; +} + +.blue-grey.lighten-2 { + background-color: #90a4ae !important; +} + +.blue-grey-text.text-lighten-2 { + color: #90a4ae !important; +} + +.blue-grey.lighten-1 { + background-color: #78909c !important; +} + +.blue-grey-text.text-lighten-1 { + color: #78909c !important; +} + +.blue-grey.darken-1 { + background-color: #546e7a !important; +} + +.blue-grey-text.text-darken-1 { + color: #546e7a !important; +} + +.blue-grey.darken-2 { + background-color: #455a64 !important; +} + +.blue-grey-text.text-darken-2 { + color: #455a64 !important; +} + +.blue-grey.darken-3 { + background-color: #37474f !important; +} + +.blue-grey-text.text-darken-3 { + color: #37474f !important; +} + +.blue-grey.darken-4 { + background-color: #263238 !important; +} + +.blue-grey-text.text-darken-4 { + color: #263238 !important; +} + +.grey { + background-color: #9e9e9e !important; +} + +.grey-text { + color: #9e9e9e !important; +} + +.grey.lighten-5 { + background-color: #fafafa !important; +} + +.grey-text.text-lighten-5 { + color: #fafafa !important; +} + +.grey.lighten-4 { + background-color: #f5f5f5 !important; +} + +.grey-text.text-lighten-4 { + color: #f5f5f5 !important; +} + +.grey.lighten-3 { + background-color: #eeeeee !important; +} + +.grey-text.text-lighten-3 { + color: #eeeeee !important; +} + +.grey.lighten-2 { + background-color: #e0e0e0 !important; +} + +.grey-text.text-lighten-2 { + color: #e0e0e0 !important; +} + +.grey.lighten-1 { + background-color: #bdbdbd !important; +} + +.grey-text.text-lighten-1 { + color: #bdbdbd !important; +} + +.grey.darken-1 { + background-color: #757575 !important; +} + +.grey-text.text-darken-1 { + color: #757575 !important; +} + +.grey.darken-2 { + background-color: #616161 !important; +} + +.grey-text.text-darken-2 { + color: #616161 !important; +} + +.grey.darken-3 { + background-color: #424242 !important; +} + +.grey-text.text-darken-3 { + color: #424242 !important; +} + +.grey.darken-4 { + background-color: #212121 !important; +} + +.grey-text.text-darken-4 { + color: #212121 !important; +} + +.black { + background-color: #000000 !important; +} + +.black-text { + color: #000000 !important; +} + +.white { + background-color: #FFFFFF !important; +} + +.white-text { + color: #FFFFFF !important; +} + +.transparent { + background-color: transparent !important; +} + +.transparent-text { + color: transparent !important; +} + +/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */ +/* Document + ========================================================================== */ +/** + * 1. Correct the line height in all browsers. + * 2. Prevent adjustments of font size after orientation changes in + * IE on Windows Phone and in iOS. + */ +html { + line-height: 1.15; /* 1 */ + -ms-text-size-adjust: 100%; /* 2 */ + -webkit-text-size-adjust: 100%; /* 2 */ +} + +/* Sections + ========================================================================== */ +/** + * Remove the margin in all browsers (opinionated). + */ +body { + margin: 0; +} + +/** + * Add the correct display in IE 9-. + */ +article, +aside, +footer, +header, +nav, +section { + display: block; +} + +/** + * Correct the font size and margin on `h1` elements within `section` and + * `article` contexts in Chrome, Firefox, and Safari. + */ +h1 { + font-size: 2em; + margin: 0.67em 0; +} + +/* Grouping content + ========================================================================== */ +/** + * Add the correct display in IE 9-. + * 1. Add the correct display in IE. + */ +figcaption, +figure, +main { /* 1 */ + display: block; +} + +/** + * Add the correct margin in IE 8. + */ +figure { + margin: 1em 40px; +} + +/** + * 1. Add the correct box sizing in Firefox. + * 2. Show the overflow in Edge and IE. + */ +hr { + box-sizing: content-box; /* 1 */ + height: 0; /* 1 */ + overflow: visible; /* 2 */ +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ +pre { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/* Text-level semantics + ========================================================================== */ +/** + * 1. Remove the gray background on active links in IE 10. + * 2. Remove gaps in links underline in iOS 8+ and Safari 8+. + */ +a { + background-color: transparent; /* 1 */ + -webkit-text-decoration-skip: objects; /* 2 */ +} + +/** + * 1. Remove the bottom border in Chrome 57- and Firefox 39-. + * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. + */ +abbr[title] { + border-bottom: none; /* 1 */ + text-decoration: underline; /* 2 */ + text-decoration: underline dotted; /* 2 */ +} + +/** + * Prevent the duplicate application of `bolder` by the next rule in Safari 6. + */ +b, +strong { + font-weight: inherit; +} + +/** + * Add the correct font weight in Chrome, Edge, and Safari. + */ +b, +strong { + font-weight: bolder; +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ +code, +kbd, +samp { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/** + * Add the correct font style in Android 4.3-. + */ +dfn { + font-style: italic; +} + +/** + * Add the correct background and color in IE 9-. + */ +mark { + background-color: #ff0; + color: #000; +} + +/** + * Add the correct font size in all browsers. + */ +small { + font-size: 80%; +} + +/** + * Prevent `sub` and `sup` elements from affecting the line height in + * all browsers. + */ +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sub { + bottom: -0.25em; +} + +sup { + top: -0.5em; +} + +/* Embedded content + ========================================================================== */ +/** + * Add the correct display in IE 9-. + */ +audio, +video { + display: inline-block; +} + +/** + * Add the correct display in iOS 4-7. + */ +audio:not([controls]) { + display: none; + height: 0; +} + +/** + * Remove the border on images inside links in IE 10-. + */ +img { + border-style: none; +} + +/** + * Hide the overflow in IE. + */ +svg:not(:root) { + overflow: hidden; +} + +/* Forms + ========================================================================== */ +/** + * 1. Change the font styles in all browsers (opinionated). + * 2. Remove the margin in Firefox and Safari. + */ +button, +input, +optgroup, +select, +textarea { + font-family: sans-serif; /* 1 */ + font-size: 100%; /* 1 */ + line-height: 1.15; /* 1 */ + margin: 0; /* 2 */ +} + +/** + * Show the overflow in IE. + * 1. Show the overflow in Edge. + */ +button, +input { /* 1 */ + overflow: visible; +} + +/** + * Remove the inheritance of text transform in Edge, Firefox, and IE. + * 1. Remove the inheritance of text transform in Firefox. + */ +button, +select { /* 1 */ + text-transform: none; +} + +/** + * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` + * controls in Android 4. + * 2. Correct the inability to style clickable types in iOS and Safari. + */ +button, +html [type=button], +[type=reset], +[type=submit] { + -webkit-appearance: button; /* 2 */ +} + +/** + * Remove the inner border and padding in Firefox. + */ +button::-moz-focus-inner, +[type=button]::-moz-focus-inner, +[type=reset]::-moz-focus-inner, +[type=submit]::-moz-focus-inner { + border-style: none; + padding: 0; +} + +/** + * Restore the focus styles unset by the previous rule. + */ +button:-moz-focusring, +[type=button]:-moz-focusring, +[type=reset]:-moz-focusring, +[type=submit]:-moz-focusring { + outline: 1px dotted ButtonText; +} + +/** + * Correct the padding in Firefox. + */ +fieldset { + padding: 0.35em 0.75em 0.625em; +} + +/** + * 1. Correct the text wrapping in Edge and IE. + * 2. Correct the color inheritance from `fieldset` elements in IE. + * 3. Remove the padding so developers are not caught out when they zero out + * `fieldset` elements in all browsers. + */ +legend { + box-sizing: border-box; /* 1 */ + color: inherit; /* 2 */ + display: table; /* 1 */ + max-width: 100%; /* 1 */ + padding: 0; /* 3 */ + white-space: normal; /* 1 */ +} + +/** + * 1. Add the correct display in IE 9-. + * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera. + */ +progress { + display: inline-block; /* 1 */ + vertical-align: baseline; /* 2 */ +} + +/** + * Remove the default vertical scrollbar in IE. + */ +textarea { + overflow: auto; +} + +/** + * 1. Add the correct box sizing in IE 10-. + * 2. Remove the padding in IE 10-. + */ +[type=checkbox], +[type=radio] { + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ +} + +/** + * Correct the cursor style of increment and decrement buttons in Chrome. + */ +[type=number]::-webkit-inner-spin-button, +[type=number]::-webkit-outer-spin-button { + height: auto; +} + +/** + * 1. Correct the odd appearance in Chrome and Safari. + * 2. Correct the outline style in Safari. + */ +[type=search] { + -webkit-appearance: textfield; /* 1 */ + outline-offset: -2px; /* 2 */ +} + +/** + * Remove the inner padding and cancel buttons in Chrome and Safari on macOS. + */ +[type=search]::-webkit-search-cancel-button, +[type=search]::-webkit-search-decoration { + -webkit-appearance: none; +} + +/** + * 1. Correct the inability to style clickable types in iOS and Safari. + * 2. Change font properties to `inherit` in Safari. + */ +::-webkit-file-upload-button { + -webkit-appearance: button; /* 1 */ + font: inherit; /* 2 */ +} + +/* Interactive + ========================================================================== */ +/* + * Add the correct display in IE 9-. + * 1. Add the correct display in Edge, IE, and Firefox. + */ +details, +menu { + display: block; +} + +/* + * Add the correct display in all browsers. + */ +summary { + display: list-item; +} + +/* Scripting + ========================================================================== */ +/** + * Add the correct display in IE 9-. + */ +canvas { + display: inline-block; +} + +/** + * Add the correct display in IE. + */ +template { + display: none; +} + +/* Hidden + ========================================================================== */ +/** + * Add the correct display in IE 10-. + */ +[hidden] { + display: none; +} + +html { + box-sizing: border-box; +} + +*, *:before, *:after { + box-sizing: inherit; +} + +button, +input, +optgroup, +select, +textarea { + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; +} + +ul:not(.browser-default) { + padding-left: 0; + list-style-type: none; +} +ul:not(.browser-default) > li { + list-style-type: none; +} + +a { + color: #136377; + text-decoration: none; + -webkit-tap-highlight-color: transparent; +} + +.valign-wrapper { + display: flex; + align-items: center; +} + +.clearfix { + clear: both; +} + +.z-depth-0 { + box-shadow: none !important; +} + +/* 2dp elevation modified*/ +.z-depth-1, .sidenav, .collapsible, .dropdown-content, .btn-floating, .btn, .btn-small, .btn-large, .toast, .card, .card-panel, nav { + box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2); +} + +.z-depth-1-half, .btn-floating:hover, .btn:hover, .btn-small:hover, .btn-large:hover { + box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -1px rgba(0, 0, 0, 0.2); +} + +/* 6dp elevation modified*/ +.z-depth-2 { + box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.3); +} + +/* 12dp elevation modified*/ +.z-depth-3 { + box-shadow: 0 8px 17px 2px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); +} + +/* 16dp elevation */ +.z-depth-4 { + box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -7px rgba(0, 0, 0, 0.2); +} + +/* 24dp elevation */ +.z-depth-5, .modal { + box-shadow: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2); +} + +.hoverable { + transition: box-shadow 0.25s; +} +.hoverable:hover { + box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); +} + +.divider { + height: 1px; + overflow: hidden; + background-color: #e0e0e0; +} + +blockquote { + margin: 20px 0; + padding-left: 1.5rem; + border-left: 5px solid #f8ef02; +} + +i { + line-height: inherit; +} +i.left { + float: left; + margin-right: 15px; +} +i.right { + float: right; + margin-left: 15px; +} +i.tiny { + font-size: 1rem; +} +i.small { + font-size: 2rem; +} +i.medium { + font-size: 4rem; +} +i.large { + font-size: 6rem; +} + +img.responsive-img, +video.responsive-video { + max-width: 100%; + height: auto; +} + +.pagination li { + display: inline-block; + border-radius: 2px; + text-align: center; + vertical-align: top; + height: 30px; +} +.pagination li a { + color: #444; + display: inline-block; + font-size: 1.2rem; + padding: 0 10px; + line-height: 30px; +} +.pagination li.active a { + color: #fff; +} +.pagination li.active { + background-color: #f8ef02; +} +.pagination li.disabled a { + cursor: default; + color: #999; +} +.pagination li i { + font-size: 2rem; +} +.pagination li.pages ul li { + display: inline-block; + float: none; +} + +@media only screen and (max-width : 992px) { + .pagination { + width: 100%; + } + .pagination li.prev, + .pagination li.next { + width: 10%; + } + .pagination li.pages { + width: 80%; + overflow: hidden; + white-space: nowrap; + } +} +.breadcrumb { + font-size: 18px; + color: rgba(255, 255, 255, 0.7); +} +.breadcrumb i, +.breadcrumb [class^=mdi-], .breadcrumb [class*=mdi-], +.breadcrumb i.material-icons { + display: inline-block; + float: left; + font-size: 24px; +} +.breadcrumb:before { + content: "\e5cc"; + color: rgba(255, 255, 255, 0.7); + vertical-align: top; + display: inline-block; + font-family: "Material Icons"; + font-weight: normal; + font-style: normal; + font-size: 25px; + margin: 0 10px 0 8px; + -webkit-font-smoothing: antialiased; +} +.breadcrumb:first-child:before { + display: none; +} +.breadcrumb:last-child { + color: #fff; +} + +.parallax-container { + position: relative; + overflow: hidden; + height: 500px; +} +.parallax-container .parallax { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + z-index: -1; +} +.parallax-container .parallax img { + opacity: 0; + position: absolute; + left: 50%; + bottom: 0; + min-width: 100%; + min-height: 100%; + transform: translate3d(0, 0, 0); + transform: translateX(-50%); +} + +.pin-top, .pin-bottom { + position: relative; +} + +.pinned { + position: fixed !important; +} + +/********************* + Transition Classes +**********************/ +ul.staggered-list li { + opacity: 0; +} + +.fade-in { + opacity: 0; + transform-origin: 0 50%; +} + +/********************* + Media Query Classes +**********************/ +@media only screen and (max-width : 600px) { + .hide-on-small-only, .hide-on-small-and-down { + display: none !important; + } +} + +@media only screen and (max-width : 992px) { + .hide-on-med-and-down { + display: none !important; + } +} + +@media only screen and (min-width : 601px) { + .hide-on-med-and-up { + display: none !important; + } +} + +@media only screen and (min-width: 600px) and (max-width: 992px) { + .hide-on-med-only { + display: none !important; + } +} + +@media only screen and (min-width : 993px) { + .hide-on-large-only { + display: none !important; + } +} + +@media only screen and (min-width : 1201px) { + .hide-on-extra-large-only { + display: none !important; + } +} + +@media only screen and (min-width : 1201px) { + .show-on-extra-large { + display: block !important; + } +} + +@media only screen and (min-width : 993px) { + .show-on-large { + display: block !important; + } +} + +@media only screen and (min-width: 600px) and (max-width: 992px) { + .show-on-medium { + display: block !important; + } +} + +@media only screen and (max-width : 600px) { + .show-on-small { + display: block !important; + } +} + +@media only screen and (min-width : 601px) { + .show-on-medium-and-up { + display: block !important; + } +} + +@media only screen and (max-width : 992px) { + .show-on-medium-and-down { + display: block !important; + } +} + +@media only screen and (max-width : 600px) { + .center-on-small-only { + text-align: center; + } +} + +.page-footer { + padding-top: 20px; + color: #fff; + background-color: #f8ef02; +} +.page-footer .footer-copyright { + overflow: hidden; + min-height: 50px; + display: flex; + align-items: center; + justify-content: space-between; + padding: 10px 0px; + color: rgba(255, 255, 255, 0.8); + background-color: rgba(51, 51, 51, 0.08); +} + +table, th, td { + border: none; +} + +table { + width: 100%; + display: table; + border-collapse: collapse; + border-spacing: 0; +} +table.striped tr { + border-bottom: none; +} +table.striped > tbody > tr:nth-child(odd) { + background-color: rgba(242, 242, 242, 0.5); +} +table.striped > tbody > tr > td { + border-radius: 0; +} +table.highlight > tbody > tr { + transition: background-color 0.25s ease; +} +table.highlight > tbody > tr:hover { + background-color: rgba(242, 242, 242, 0.5); +} +table.centered thead tr th, table.centered tbody tr td { + text-align: center; +} + +tr { + border-bottom: 1px solid rgba(0, 0, 0, 0.12); +} + +td, th { + padding: 15px 5px; + display: table-cell; + text-align: left; + vertical-align: middle; + border-radius: 2px; +} + +@media only screen and (max-width : 992px) { + table.responsive-table { + width: 100%; + border-collapse: collapse; + border-spacing: 0; + display: block; + position: relative; + /* sort out borders */ + } + table.responsive-table td:empty:before { + content: " "; + } + table.responsive-table th, + table.responsive-table td { + margin: 0; + vertical-align: top; + } + table.responsive-table th { + text-align: left; + } + table.responsive-table thead { + display: block; + float: left; + } + table.responsive-table thead tr { + display: block; + padding: 0 10px 0 0; + } + table.responsive-table thead tr th::before { + content: " "; + } + table.responsive-table tbody { + display: block; + width: auto; + position: relative; + overflow-x: auto; + white-space: nowrap; + } + table.responsive-table tbody tr { + display: inline-block; + vertical-align: top; + } + table.responsive-table th { + display: block; + text-align: right; + } + table.responsive-table td { + display: block; + min-height: 1.25em; + text-align: left; + } + table.responsive-table tr { + border-bottom: none; + padding: 0 10px; + } + table.responsive-table thead { + border: 0; + border-right: 1px solid rgba(0, 0, 0, 0.12); + } +} +.collection { + margin: 0.5rem 0 1rem 0; + border: 1px solid #e0e0e0; + border-radius: 2px; + overflow: hidden; + position: relative; +} +.collection .collection-item { + background-color: #fff; + line-height: 1.5rem; + padding: 10px 20px; + margin: 0; + border-bottom: 1px solid #e0e0e0; +} +.collection .collection-item.avatar { + min-height: 84px; + padding-left: 72px; + position: relative; +} +.collection .collection-item.avatar:not(.circle-clipper) > .circle, +.collection .collection-item.avatar :not(.circle-clipper) > .circle { + position: absolute; + width: 42px; + height: 42px; + overflow: hidden; + left: 15px; + display: inline-block; + vertical-align: middle; +} +.collection .collection-item.avatar i.circle { + font-size: 18px; + line-height: 42px; + color: #fff; + background-color: #999; + text-align: center; +} +.collection .collection-item.avatar .title { + font-size: 16px; +} +.collection .collection-item.avatar p { + margin: 0; +} +.collection .collection-item.avatar .secondary-content { + position: absolute; + top: 16px; + right: 16px; +} +.collection .collection-item:last-child { + border-bottom: none; +} +.collection .collection-item.active { + background-color: #ff003c; + color: white; +} +.collection .collection-item.active .secondary-content { + color: #fff; +} +.collection a.collection-item { + display: block; + transition: 0.25s; + color: #ff003c; +} +.collection a.collection-item:not(.active):hover { + background-color: #ddd; +} +.collection.with-header .collection-header { + background-color: #fff; + border-bottom: 1px solid #e0e0e0; + padding: 10px 20px; +} +.collection.with-header .collection-item { + padding-left: 30px; +} +.collection.with-header .collection-item.avatar { + padding-left: 72px; +} + +.secondary-content { + float: right; + color: #ff003c; +} + +.collapsible .collection { + margin: 0; + border: none; +} + +.video-container { + position: relative; + padding-bottom: 56.25%; + height: 0; + overflow: hidden; +} +.video-container iframe, .video-container object, .video-container embed { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; +} + +.progress { + position: relative; + height: 4px; + display: block; + width: 100%; + background-color: #ffccd8; + border-radius: 2px; + margin: 0.5rem 0 1rem 0; + overflow: hidden; +} +.progress .determinate { + position: absolute; + top: 0; + left: 0; + bottom: 0; + background-color: #ff003c; + transition: width 0.3s linear; +} +.progress .indeterminate { + background-color: #ff003c; +} +.progress .indeterminate:before { + content: ""; + position: absolute; + background-color: inherit; + top: 0; + left: 0; + bottom: 0; + will-change: left, right; + animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite; +} +.progress .indeterminate:after { + content: ""; + position: absolute; + background-color: inherit; + top: 0; + left: 0; + bottom: 0; + will-change: left, right; + animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite; + animation-delay: 1.15s; +} + +@keyframes indeterminate { + 0% { + left: -35%; + right: 100%; + } + 60% { + left: 100%; + right: -90%; + } + 100% { + left: 100%; + right: -90%; + } +} +@keyframes indeterminate-short { + 0% { + left: -200%; + right: 100%; + } + 60% { + left: 107%; + right: -8%; + } + 100% { + left: 107%; + right: -8%; + } +} +/******************* + Utility Classes +*******************/ +.hide { + display: none !important; +} + +.left-align { + text-align: left; +} + +.right-align { + text-align: right; +} + +.center, .center-align { + text-align: center; +} + +.left { + float: left !important; +} + +.right { + float: right !important; +} + +.no-select, input[type=range], +input[type=range] + .thumb { + user-select: none; +} + +.circle { + border-radius: 50%; +} + +.center-block { + display: block; + margin-left: auto; + margin-right: auto; +} + +.truncate { + display: block; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + +.no-padding { + padding: 0 !important; +} + +span.badge { + min-width: 3rem; + padding: 0 6px; + margin-left: 14px; + text-align: center; + font-size: 1rem; + line-height: 22px; + height: 22px; + color: #757575; + float: right; + box-sizing: border-box; +} +span.badge.new { + font-weight: 300; + font-size: 0.8rem; + color: #fff; + background-color: #ff003c; + border-radius: 2px; +} +span.badge.new:after { + content: " new"; +} +span.badge[data-badge-caption]::after { + content: " " attr(data-badge-caption); +} + +nav ul a span.badge { + display: inline-block; + float: none; + margin-left: 4px; + line-height: 22px; + height: 22px; + -webkit-font-smoothing: auto; +} + +.collection-item span.badge { + margin-top: calc(0.75rem - 11px); +} + +.collapsible span.badge { + margin-left: auto; +} + +.sidenav span.badge { + margin-top: calc(24px - 11px); +} + +table span.badge { + display: inline-block; + float: none; + margin-left: auto; +} + +/* This is needed for some mobile phones to display the Google Icon font properly */ +.material-icons { + text-rendering: optimizeLegibility; + font-feature-settings: "liga"; +} + +.container { + margin: 0 auto; + max-width: 1280px; + width: 90%; +} + +@media only screen and (min-width : 601px) { + .container { + width: 85%; + } +} +@media only screen and (min-width : 993px) { + .container { + width: 70%; + } +} +.col .row { + margin-left: -0.75rem; + margin-right: -0.75rem; +} + +.section { + padding-top: 1rem; + padding-bottom: 1rem; +} +.section.no-pad { + padding: 0; +} +.section.no-pad-bot { + padding-bottom: 0; +} +.section.no-pad-top { + padding-top: 0; +} + +.row { + margin-left: auto; + margin-right: auto; + margin-bottom: 20px; +} +.row:after { + content: ""; + display: table; + clear: both; +} +.row .col { + float: left; + box-sizing: border-box; + padding: 0 0.75rem; + min-height: 1px; +} +.row .col[class*=push-], .row .col[class*=pull-] { + position: relative; +} +.row .col.s1 { + width: 8.3333333333%; + margin-left: auto; + left: auto; + right: auto; +} +.row .col.s2 { + width: 16.6666666667%; + margin-left: auto; + left: auto; + right: auto; +} +.row .col.s3 { + width: 25%; + margin-left: auto; + left: auto; + right: auto; +} +.row .col.s4 { + width: 33.3333333333%; + margin-left: auto; + left: auto; + right: auto; +} +.row .col.s5 { + width: 41.6666666667%; + margin-left: auto; + left: auto; + right: auto; +} +.row .col.s6 { + width: 50%; + margin-left: auto; + left: auto; + right: auto; +} +.row .col.s7 { + width: 58.3333333333%; + margin-left: auto; + left: auto; + right: auto; +} +.row .col.s8 { + width: 66.6666666667%; + margin-left: auto; + left: auto; + right: auto; +} +.row .col.s9 { + width: 75%; + margin-left: auto; + left: auto; + right: auto; +} +.row .col.s10 { + width: 83.3333333333%; + margin-left: auto; + left: auto; + right: auto; +} +.row .col.s11 { + width: 91.6666666667%; + margin-left: auto; + left: auto; + right: auto; +} +.row .col.s12 { + width: 100%; + margin-left: auto; + left: auto; + right: auto; +} +.row .col.offset-s1 { + margin-left: 8.3333333333%; +} +.row .col.pull-s1 { + right: 8.3333333333%; +} +.row .col.push-s1 { + left: 8.3333333333%; +} +.row .col.offset-s2 { + margin-left: 16.6666666667%; +} +.row .col.pull-s2 { + right: 16.6666666667%; +} +.row .col.push-s2 { + left: 16.6666666667%; +} +.row .col.offset-s3 { + margin-left: 25%; +} +.row .col.pull-s3 { + right: 25%; +} +.row .col.push-s3 { + left: 25%; +} +.row .col.offset-s4 { + margin-left: 33.3333333333%; +} +.row .col.pull-s4 { + right: 33.3333333333%; +} +.row .col.push-s4 { + left: 33.3333333333%; +} +.row .col.offset-s5 { + margin-left: 41.6666666667%; +} +.row .col.pull-s5 { + right: 41.6666666667%; +} +.row .col.push-s5 { + left: 41.6666666667%; +} +.row .col.offset-s6 { + margin-left: 50%; +} +.row .col.pull-s6 { + right: 50%; +} +.row .col.push-s6 { + left: 50%; +} +.row .col.offset-s7 { + margin-left: 58.3333333333%; +} +.row .col.pull-s7 { + right: 58.3333333333%; +} +.row .col.push-s7 { + left: 58.3333333333%; +} +.row .col.offset-s8 { + margin-left: 66.6666666667%; +} +.row .col.pull-s8 { + right: 66.6666666667%; +} +.row .col.push-s8 { + left: 66.6666666667%; +} +.row .col.offset-s9 { + margin-left: 75%; +} +.row .col.pull-s9 { + right: 75%; +} +.row .col.push-s9 { + left: 75%; +} +.row .col.offset-s10 { + margin-left: 83.3333333333%; +} +.row .col.pull-s10 { + right: 83.3333333333%; +} +.row .col.push-s10 { + left: 83.3333333333%; +} +.row .col.offset-s11 { + margin-left: 91.6666666667%; +} +.row .col.pull-s11 { + right: 91.6666666667%; +} +.row .col.push-s11 { + left: 91.6666666667%; +} +.row .col.offset-s12 { + margin-left: 100%; +} +.row .col.pull-s12 { + right: 100%; +} +.row .col.push-s12 { + left: 100%; +} +@media only screen and (min-width : 601px) { + .row .col.m1 { + width: 8.3333333333%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.m2 { + width: 16.6666666667%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.m3 { + width: 25%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.m4 { + width: 33.3333333333%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.m5 { + width: 41.6666666667%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.m6 { + width: 50%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.m7 { + width: 58.3333333333%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.m8 { + width: 66.6666666667%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.m9 { + width: 75%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.m10 { + width: 83.3333333333%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.m11 { + width: 91.6666666667%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.m12 { + width: 100%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.offset-m1 { + margin-left: 8.3333333333%; + } + .row .col.pull-m1 { + right: 8.3333333333%; + } + .row .col.push-m1 { + left: 8.3333333333%; + } + .row .col.offset-m2 { + margin-left: 16.6666666667%; + } + .row .col.pull-m2 { + right: 16.6666666667%; + } + .row .col.push-m2 { + left: 16.6666666667%; + } + .row .col.offset-m3 { + margin-left: 25%; + } + .row .col.pull-m3 { + right: 25%; + } + .row .col.push-m3 { + left: 25%; + } + .row .col.offset-m4 { + margin-left: 33.3333333333%; + } + .row .col.pull-m4 { + right: 33.3333333333%; + } + .row .col.push-m4 { + left: 33.3333333333%; + } + .row .col.offset-m5 { + margin-left: 41.6666666667%; + } + .row .col.pull-m5 { + right: 41.6666666667%; + } + .row .col.push-m5 { + left: 41.6666666667%; + } + .row .col.offset-m6 { + margin-left: 50%; + } + .row .col.pull-m6 { + right: 50%; + } + .row .col.push-m6 { + left: 50%; + } + .row .col.offset-m7 { + margin-left: 58.3333333333%; + } + .row .col.pull-m7 { + right: 58.3333333333%; + } + .row .col.push-m7 { + left: 58.3333333333%; + } + .row .col.offset-m8 { + margin-left: 66.6666666667%; + } + .row .col.pull-m8 { + right: 66.6666666667%; + } + .row .col.push-m8 { + left: 66.6666666667%; + } + .row .col.offset-m9 { + margin-left: 75%; + } + .row .col.pull-m9 { + right: 75%; + } + .row .col.push-m9 { + left: 75%; + } + .row .col.offset-m10 { + margin-left: 83.3333333333%; + } + .row .col.pull-m10 { + right: 83.3333333333%; + } + .row .col.push-m10 { + left: 83.3333333333%; + } + .row .col.offset-m11 { + margin-left: 91.6666666667%; + } + .row .col.pull-m11 { + right: 91.6666666667%; + } + .row .col.push-m11 { + left: 91.6666666667%; + } + .row .col.offset-m12 { + margin-left: 100%; + } + .row .col.pull-m12 { + right: 100%; + } + .row .col.push-m12 { + left: 100%; + } +} +@media only screen and (min-width : 993px) { + .row .col.l1 { + width: 8.3333333333%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.l2 { + width: 16.6666666667%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.l3 { + width: 25%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.l4 { + width: 33.3333333333%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.l5 { + width: 41.6666666667%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.l6 { + width: 50%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.l7 { + width: 58.3333333333%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.l8 { + width: 66.6666666667%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.l9 { + width: 75%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.l10 { + width: 83.3333333333%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.l11 { + width: 91.6666666667%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.l12 { + width: 100%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.offset-l1 { + margin-left: 8.3333333333%; + } + .row .col.pull-l1 { + right: 8.3333333333%; + } + .row .col.push-l1 { + left: 8.3333333333%; + } + .row .col.offset-l2 { + margin-left: 16.6666666667%; + } + .row .col.pull-l2 { + right: 16.6666666667%; + } + .row .col.push-l2 { + left: 16.6666666667%; + } + .row .col.offset-l3 { + margin-left: 25%; + } + .row .col.pull-l3 { + right: 25%; + } + .row .col.push-l3 { + left: 25%; + } + .row .col.offset-l4 { + margin-left: 33.3333333333%; + } + .row .col.pull-l4 { + right: 33.3333333333%; + } + .row .col.push-l4 { + left: 33.3333333333%; + } + .row .col.offset-l5 { + margin-left: 41.6666666667%; + } + .row .col.pull-l5 { + right: 41.6666666667%; + } + .row .col.push-l5 { + left: 41.6666666667%; + } + .row .col.offset-l6 { + margin-left: 50%; + } + .row .col.pull-l6 { + right: 50%; + } + .row .col.push-l6 { + left: 50%; + } + .row .col.offset-l7 { + margin-left: 58.3333333333%; + } + .row .col.pull-l7 { + right: 58.3333333333%; + } + .row .col.push-l7 { + left: 58.3333333333%; + } + .row .col.offset-l8 { + margin-left: 66.6666666667%; + } + .row .col.pull-l8 { + right: 66.6666666667%; + } + .row .col.push-l8 { + left: 66.6666666667%; + } + .row .col.offset-l9 { + margin-left: 75%; + } + .row .col.pull-l9 { + right: 75%; + } + .row .col.push-l9 { + left: 75%; + } + .row .col.offset-l10 { + margin-left: 83.3333333333%; + } + .row .col.pull-l10 { + right: 83.3333333333%; + } + .row .col.push-l10 { + left: 83.3333333333%; + } + .row .col.offset-l11 { + margin-left: 91.6666666667%; + } + .row .col.pull-l11 { + right: 91.6666666667%; + } + .row .col.push-l11 { + left: 91.6666666667%; + } + .row .col.offset-l12 { + margin-left: 100%; + } + .row .col.pull-l12 { + right: 100%; + } + .row .col.push-l12 { + left: 100%; + } +} +@media only screen and (min-width : 1201px) { + .row .col.xl1 { + width: 8.3333333333%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.xl2 { + width: 16.6666666667%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.xl3 { + width: 25%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.xl4 { + width: 33.3333333333%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.xl5 { + width: 41.6666666667%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.xl6 { + width: 50%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.xl7 { + width: 58.3333333333%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.xl8 { + width: 66.6666666667%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.xl9 { + width: 75%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.xl10 { + width: 83.3333333333%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.xl11 { + width: 91.6666666667%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.xl12 { + width: 100%; + margin-left: auto; + left: auto; + right: auto; + } + .row .col.offset-xl1 { + margin-left: 8.3333333333%; + } + .row .col.pull-xl1 { + right: 8.3333333333%; + } + .row .col.push-xl1 { + left: 8.3333333333%; + } + .row .col.offset-xl2 { + margin-left: 16.6666666667%; + } + .row .col.pull-xl2 { + right: 16.6666666667%; + } + .row .col.push-xl2 { + left: 16.6666666667%; + } + .row .col.offset-xl3 { + margin-left: 25%; + } + .row .col.pull-xl3 { + right: 25%; + } + .row .col.push-xl3 { + left: 25%; + } + .row .col.offset-xl4 { + margin-left: 33.3333333333%; + } + .row .col.pull-xl4 { + right: 33.3333333333%; + } + .row .col.push-xl4 { + left: 33.3333333333%; + } + .row .col.offset-xl5 { + margin-left: 41.6666666667%; + } + .row .col.pull-xl5 { + right: 41.6666666667%; + } + .row .col.push-xl5 { + left: 41.6666666667%; + } + .row .col.offset-xl6 { + margin-left: 50%; + } + .row .col.pull-xl6 { + right: 50%; + } + .row .col.push-xl6 { + left: 50%; + } + .row .col.offset-xl7 { + margin-left: 58.3333333333%; + } + .row .col.pull-xl7 { + right: 58.3333333333%; + } + .row .col.push-xl7 { + left: 58.3333333333%; + } + .row .col.offset-xl8 { + margin-left: 66.6666666667%; + } + .row .col.pull-xl8 { + right: 66.6666666667%; + } + .row .col.push-xl8 { + left: 66.6666666667%; + } + .row .col.offset-xl9 { + margin-left: 75%; + } + .row .col.pull-xl9 { + right: 75%; + } + .row .col.push-xl9 { + left: 75%; + } + .row .col.offset-xl10 { + margin-left: 83.3333333333%; + } + .row .col.pull-xl10 { + right: 83.3333333333%; + } + .row .col.push-xl10 { + left: 83.3333333333%; + } + .row .col.offset-xl11 { + margin-left: 91.6666666667%; + } + .row .col.pull-xl11 { + right: 91.6666666667%; + } + .row .col.push-xl11 { + left: 91.6666666667%; + } + .row .col.offset-xl12 { + margin-left: 100%; + } + .row .col.pull-xl12 { + right: 100%; + } + .row .col.push-xl12 { + left: 100%; + } +} + +nav { + color: #fff; + background-color: #f8ef02; + width: 100%; + height: 56px; + line-height: 56px; +} +nav.nav-extended { + height: auto; +} +nav.nav-extended .nav-wrapper { + min-height: 56px; + height: auto; +} +nav.nav-extended .nav-content { + position: relative; + line-height: normal; +} +nav a { + color: #fff; +} +nav i, +nav [class^=mdi-], nav [class*=mdi-], +nav i.material-icons { + display: block; + font-size: 24px; + height: 56px; + line-height: 56px; +} +nav .nav-wrapper { + position: relative; + height: 100%; +} +@media only screen and (min-width : 993px) { + nav a.sidenav-trigger { + display: none; + } +} +nav .sidenav-trigger { + float: left; + position: relative; + z-index: 1; + height: 56px; + margin: 0 18px; +} +nav .sidenav-trigger i { + height: 56px; + line-height: 56px; +} +nav .brand-logo { + position: absolute; + color: #fff; + display: inline-block; + font-size: 2.1rem; + padding: 0; +} +nav .brand-logo.center { + left: 50%; + transform: translateX(-50%); +} +@media only screen and (max-width : 992px) { + nav .brand-logo { + left: 50%; + transform: translateX(-50%); + } + nav .brand-logo.left, nav .brand-logo.right { + padding: 0; + transform: none; + } + nav .brand-logo.left { + left: 0.5rem; + } + nav .brand-logo.right { + right: 0.5rem; + left: auto; + } +} +nav .brand-logo.right { + right: 0.5rem; + padding: 0; +} +nav .brand-logo i, +nav .brand-logo [class^=mdi-], nav .brand-logo [class*=mdi-], +nav .brand-logo i.material-icons { + float: left; + margin-right: 15px; +} +nav .nav-title { + display: inline-block; + font-size: 32px; + padding: 28px 0; +} +nav ul { + margin: 0; +} +nav ul li { + transition: background-color 0.3s; + float: left; + padding: 0; +} +nav ul li.active { + background-color: rgba(0, 0, 0, 0.1); +} +nav ul a { + transition: background-color 0.3s; + font-size: 1rem; + color: #fff; + display: block; + padding: 0 15px; + cursor: pointer; +} +nav ul a.btn, nav ul a.btn-small, nav ul a.btn-large, nav ul a.btn-flat, nav ul a.btn-floating { + margin-top: -2px; + margin-left: 15px; + margin-right: 15px; +} +nav ul a.btn > .material-icons, nav ul a.btn-small > .material-icons, nav ul a.btn-large > .material-icons, nav ul a.btn-flat > .material-icons, nav ul a.btn-floating > .material-icons { + height: inherit; + line-height: inherit; +} +nav ul a:hover { + background-color: rgba(0, 0, 0, 0.1); +} +nav ul.left { + float: left; +} +nav form { + height: 100%; +} +nav .input-field { + margin: 0; + height: 100%; +} +nav .input-field input { + height: 100%; + font-size: 1.2rem; + border: none; + padding-left: 2rem; +} +nav .input-field input:focus, nav .input-field input[type=text]:valid, nav .input-field input[type=password]:valid, nav .input-field input[type=email]:valid, nav .input-field input[type=url]:valid, nav .input-field input[type=date]:valid { + border: none; + box-shadow: none; +} +nav .input-field label { + top: 0; + left: 0; +} +nav .input-field label i { + color: rgba(255, 255, 255, 0.7); + transition: color 0.3s; +} +nav .input-field label.active i { + color: #fff; +} + +.navbar-fixed { + position: relative; + height: 56px; + z-index: 997; +} +.navbar-fixed nav { + position: fixed; +} + +@media only screen and (min-width : 601px) { + nav.nav-extended .nav-wrapper { + min-height: 64px; + } + nav, nav .nav-wrapper i, nav a.sidenav-trigger, nav a.sidenav-trigger i { + height: 64px; + line-height: 64px; + } + .navbar-fixed { + height: 64px; + } +} +a { + text-decoration: none; +} + +html { + line-height: 1.5; + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; + font-weight: normal; + color: rgba(0, 0, 0, 0.87); +} +@media only screen and (min-width: 0) { + html { + font-size: 14px; + } +} +@media only screen and (min-width: 992px) { + html { + font-size: 14.5px; + } +} +@media only screen and (min-width: 1200px) { + html { + font-size: 15px; + } +} + +h1, h2, h3, h4, h5, h6 { + font-weight: 400; + line-height: 1.3; +} + +h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { + font-weight: inherit; +} + +h1 { + font-size: 4.2rem; + line-height: 110%; + margin: 2.8rem 0 1.68rem 0; +} + +h2 { + font-size: 3.56rem; + line-height: 110%; + margin: 2.3733333333rem 0 1.424rem 0; +} + +h3 { + font-size: 2.92rem; + line-height: 110%; + margin: 1.9466666667rem 0 1.168rem 0; +} + +h4 { + font-size: 2.28rem; + line-height: 110%; + margin: 1.52rem 0 0.912rem 0; +} + +h5 { + font-size: 1.64rem; + line-height: 110%; + margin: 1.0933333333rem 0 0.656rem 0; +} + +h6 { + font-size: 1.15rem; + line-height: 110%; + margin: 0.7666666667rem 0 0.46rem 0; +} + +em { + font-style: italic; +} + +strong { + font-weight: 500; +} + +small { + font-size: 75%; +} + +.light { + font-weight: 300; +} + +.thin { + font-weight: 200; +} + +@media only screen and (min-width: 360px) { + .flow-text { + font-size: 1.2rem; + } +} +@media only screen and (min-width: 390px) { + .flow-text { + font-size: 1.224rem; + } +} +@media only screen and (min-width: 420px) { + .flow-text { + font-size: 1.248rem; + } +} +@media only screen and (min-width: 450px) { + .flow-text { + font-size: 1.272rem; + } +} +@media only screen and (min-width: 480px) { + .flow-text { + font-size: 1.296rem; + } +} +@media only screen and (min-width: 510px) { + .flow-text { + font-size: 1.32rem; + } +} +@media only screen and (min-width: 540px) { + .flow-text { + font-size: 1.344rem; + } +} +@media only screen and (min-width: 570px) { + .flow-text { + font-size: 1.368rem; + } +} +@media only screen and (min-width: 600px) { + .flow-text { + font-size: 1.392rem; + } +} +@media only screen and (min-width: 630px) { + .flow-text { + font-size: 1.416rem; + } +} +@media only screen and (min-width: 660px) { + .flow-text { + font-size: 1.44rem; + } +} +@media only screen and (min-width: 690px) { + .flow-text { + font-size: 1.464rem; + } +} +@media only screen and (min-width: 720px) { + .flow-text { + font-size: 1.488rem; + } +} +@media only screen and (min-width: 750px) { + .flow-text { + font-size: 1.512rem; + } +} +@media only screen and (min-width: 780px) { + .flow-text { + font-size: 1.536rem; + } +} +@media only screen and (min-width: 810px) { + .flow-text { + font-size: 1.56rem; + } +} +@media only screen and (min-width: 840px) { + .flow-text { + font-size: 1.584rem; + } +} +@media only screen and (min-width: 870px) { + .flow-text { + font-size: 1.608rem; + } +} +@media only screen and (min-width: 900px) { + .flow-text { + font-size: 1.632rem; + } +} +@media only screen and (min-width: 930px) { + .flow-text { + font-size: 1.656rem; + } +} +@media only screen and (min-width: 960px) { + .flow-text { + font-size: 1.68rem; + } +} +@media only screen and (max-width: 360px) { + .flow-text { + font-size: 1.2rem; + } +} + +.scale-transition { + transition: transform 0.3s cubic-bezier(0.53, 0.01, 0.36, 1.63) !important; +} +.scale-transition.scale-out { + transform: scale(0); + transition: transform 0.2s !important; +} +.scale-transition.scale-in { + transform: scale(1); +} + +.card-panel { + transition: box-shadow 0.25s; + padding: 24px; + margin: 0.5rem 0 1rem 0; + border-radius: 2px; + background-color: #fff; +} + +.card { + position: relative; + margin: 0.5rem 0 1rem 0; + background-color: #fff; + transition: box-shadow 0.25s; + border-radius: 2px; +} +.card .card-title { + font-size: 24px; + font-weight: 300; +} +.card .card-title.activator { + cursor: pointer; +} +.card.small, .card.medium, .card.large { + position: relative; +} +.card.small .card-image, .card.medium .card-image, .card.large .card-image { + max-height: 60%; + overflow: hidden; +} +.card.small .card-image + .card-content, .card.medium .card-image + .card-content, .card.large .card-image + .card-content { + max-height: 40%; +} +.card.small .card-content, .card.medium .card-content, .card.large .card-content { + max-height: 100%; + overflow: hidden; +} +.card.small .card-action, .card.medium .card-action, .card.large .card-action { + position: absolute; + bottom: 0; + left: 0; + right: 0; +} +.card.small { + height: 300px; +} +.card.medium { + height: 400px; +} +.card.large { + height: 500px; +} +.card.horizontal { + display: flex; +} +.card.horizontal.small .card-image, .card.horizontal.medium .card-image, .card.horizontal.large .card-image { + height: 100%; + max-height: none; + overflow: visible; +} +.card.horizontal.small .card-image img, .card.horizontal.medium .card-image img, .card.horizontal.large .card-image img { + height: 100%; +} +.card.horizontal .card-image { + max-width: 50%; +} +.card.horizontal .card-image img { + border-radius: 2px 0 0 2px; + max-width: 100%; + width: auto; +} +.card.horizontal .card-stacked { + display: flex; + flex-direction: column; + flex: 1; + position: relative; +} +.card.horizontal .card-stacked .card-content { + flex-grow: 1; +} +.card.sticky-action .card-action { + z-index: 2; +} +.card.sticky-action .card-reveal { + z-index: 1; + padding-bottom: 64px; +} +.card .card-image { + position: relative; +} +.card .card-image img { + display: block; + border-radius: 2px 2px 0 0; + position: relative; + left: 0; + right: 0; + top: 0; + bottom: 0; + width: 100%; +} +.card .card-image .card-title { + color: #fff; + position: absolute; + bottom: 0; + left: 0; + max-width: 100%; + padding: 24px; +} +.card .card-content { + padding: 24px; + border-radius: 0 0 2px 2px; +} +.card .card-content p { + margin: 0; +} +.card .card-content .card-title { + display: block; + line-height: 32px; + margin-bottom: 8px; +} +.card .card-content .card-title i { + line-height: 32px; +} +.card .card-action { + background-color: inherit; + border-top: 1px solid rgba(160, 160, 160, 0.2); + position: relative; + padding: 16px 24px; +} +.card .card-action:last-child { + border-radius: 0 0 2px 2px; +} +.card .card-action a:not(.btn):not(.btn-small):not(.btn-large):not(.btn-large):not(.btn-floating) { + color: #ffab40; + margin-right: 24px; + transition: color 0.3s ease; + text-transform: uppercase; +} +.card .card-action a:not(.btn):not(.btn-small):not(.btn-large):not(.btn-large):not(.btn-floating):hover { + color: rgb(255, 215.8586387435, 166); +} +.card .card-reveal { + padding: 24px; + position: absolute; + background-color: #fff; + width: 100%; + overflow-y: auto; + left: 0; + top: 100%; + height: 100%; + z-index: 3; + display: none; +} +.card .card-reveal .card-title { + cursor: pointer; + display: block; +} + +#toast-container { + display: block; + position: fixed; + z-index: 10000; +} +@media only screen and (max-width : 600px) { + #toast-container { + min-width: 100%; + bottom: 0%; + } +} +@media only screen and (min-width : 601px) and (max-width : 992px) { + #toast-container { + left: 5%; + bottom: 7%; + max-width: 90%; + } +} +@media only screen and (min-width : 993px) { + #toast-container { + top: 10%; + right: 7%; + max-width: 86%; + } +} + +.toast { + border-radius: 2px; + top: 35px; + width: auto; + margin-top: 10px; + position: relative; + max-width: 100%; + height: auto; + min-height: 48px; + line-height: 1.5em; + background-color: #323232; + padding: 10px 25px; + font-size: 1.1rem; + font-weight: 300; + color: #fff; + display: flex; + align-items: center; + justify-content: space-between; + cursor: default; +} +.toast .toast-action { + color: #eeff41; + font-weight: 500; + margin-right: -25px; + margin-left: 3rem; +} +.toast.rounded { + border-radius: 24px; +} +@media only screen and (max-width : 600px) { + .toast { + width: 100%; + border-radius: 0; + } +} + +.tabs { + position: relative; + overflow-x: auto; + overflow-y: hidden; + height: 48px; + width: 100%; + background-color: #fff; + margin: 0 auto; + white-space: nowrap; +} +.tabs.tabs-transparent { + background-color: transparent; +} +.tabs.tabs-transparent .tab a, +.tabs.tabs-transparent .tab.disabled a, +.tabs.tabs-transparent .tab.disabled a:hover { + color: rgba(255, 255, 255, 0.7); +} +.tabs.tabs-transparent .tab a:hover, +.tabs.tabs-transparent .tab a.active { + color: #fff; +} +.tabs.tabs-transparent .indicator { + background-color: #fff; +} +.tabs.tabs-fixed-width { + display: flex; +} +.tabs.tabs-fixed-width .tab { + flex-grow: 1; +} +.tabs .tab { + display: inline-block; + text-align: center; + line-height: 48px; + height: 48px; + padding: 0; + margin: 0; + text-transform: uppercase; +} +.tabs .tab a { + color: rgba(248, 239, 2, 0.7); + display: block; + width: 100%; + height: 100%; + padding: 0 24px; + font-size: 14px; + text-overflow: ellipsis; + overflow: hidden; + transition: color 0.28s ease, background-color 0.28s ease; +} +.tabs .tab a:focus, .tabs .tab a:focus.active { + background-color: rgba(253.532, 246.926, 72.968, 0.2); + outline: none; +} +.tabs .tab a:hover, .tabs .tab a.active { + background-color: transparent; + color: #f8ef02; +} +.tabs .tab.disabled a, .tabs .tab.disabled a:hover { + color: rgba(248, 239, 2, 0.4); + cursor: default; +} +.tabs .indicator { + position: absolute; + bottom: 0; + height: 2px; + background-color: rgb(253.532, 246.926, 72.968); + will-change: left, right; +} + +@media only screen and (max-width : 992px) { + .tabs { + display: flex; + } + .tabs .tab { + flex-grow: 1; + } + .tabs .tab a { + padding: 0 12px; + } +} +.material-tooltip { + padding: 10px 8px; + font-size: 1rem; + z-index: 2000; + background-color: transparent; + border-radius: 2px; + color: #fff; + min-height: 36px; + line-height: 120%; + opacity: 0; + position: absolute; + text-align: center; + max-width: calc(100% - 4px); + overflow: hidden; + left: 0; + top: 0; + pointer-events: none; + visibility: hidden; + background-color: #323232; +} + +.backdrop { + position: absolute; + opacity: 0; + height: 7px; + width: 14px; + border-radius: 0 0 50% 50%; + background-color: #323232; + z-index: -1; + transform-origin: 50% 0%; + visibility: hidden; +} + +.btn, .btn-small, .btn-large, +.btn-flat { + border: none; + border-radius: 2px; + display: inline-block; + height: 36px; + line-height: 36px; + padding: 0 16px; + text-transform: uppercase; + vertical-align: middle; + -webkit-tap-highlight-color: transparent; +} + +.btn.disabled, +.btn-floating.disabled, +.btn-large.disabled, +.btn-small.disabled, +.btn-flat.disabled, +.btn:disabled, +.btn-floating:disabled, +.btn-large:disabled, +.btn-small:disabled, +.btn-flat:disabled, +.btn[disabled], +.btn-floating[disabled], +.btn-large[disabled], +.btn-small[disabled], +.btn-flat[disabled] { + pointer-events: none; + background-color: #DFDFDF !important; + box-shadow: none; + color: #9F9F9F !important; + cursor: default; +} +.btn.disabled:hover, +.btn-floating.disabled:hover, +.btn-large.disabled:hover, +.btn-small.disabled:hover, +.btn-flat.disabled:hover, +.btn:disabled:hover, +.btn-floating:disabled:hover, +.btn-large:disabled:hover, +.btn-small:disabled:hover, +.btn-flat:disabled:hover, +.btn[disabled]:hover, +.btn-floating[disabled]:hover, +.btn-large[disabled]:hover, +.btn-small[disabled]:hover, +.btn-flat[disabled]:hover { + background-color: #DFDFDF !important; + color: #9F9F9F !important; +} + +.btn, +.btn-small, +.btn-large, +.btn-floating, +.btn-flat { + font-size: 14px; + outline: 0; +} +.btn i, +.btn-floating i, +.btn-large i, +.btn-small i, +.btn-flat i { + font-size: 1.3rem; + line-height: inherit; +} + +.btn:focus, .btn-small:focus, .btn-large:focus, +.btn-floating:focus { + background-color: #cc0030; +} + +.btn, .btn-small, .btn-large { + text-decoration: none; + color: #fff; + background-color: #ff003c; + text-align: center; + letter-spacing: 0.5px; + transition: background-color 0.2s ease-out; + cursor: pointer; +} +.btn:hover, .btn-small:hover, .btn-large:hover { + background-color: rgb(255, 25.5, 79.5); +} + +.btn-floating { + display: inline-block; + color: #fff; + position: relative; + overflow: hidden; + z-index: 1; + width: 40px; + height: 40px; + line-height: 40px; + padding: 0; + background-color: #ff003c; + border-radius: 50%; + transition: background-color 0.3s; + cursor: pointer; + vertical-align: middle; +} +.btn-floating:hover { + background-color: #ff003c; +} +.btn-floating:before { + border-radius: 0; +} +.btn-floating.btn-large { + width: 56px; + height: 56px; + padding: 0; +} +.btn-floating.btn-large.halfway-fab { + bottom: -28px; +} +.btn-floating.btn-large i { + line-height: 56px; +} +.btn-floating.btn-small { + width: 32.4px; + height: 32.4px; +} +.btn-floating.btn-small.halfway-fab { + bottom: -16.2px; +} +.btn-floating.btn-small i { + line-height: 32.4px; +} +.btn-floating.halfway-fab { + position: absolute; + right: 24px; + bottom: -20px; +} +.btn-floating.halfway-fab.left { + right: auto; + left: 24px; +} +.btn-floating i { + width: inherit; + display: inline-block; + text-align: center; + color: #fff; + font-size: 1.6rem; + line-height: 40px; +} + +button.btn-floating { + border: none; +} + +.fixed-action-btn { + position: fixed; + right: 23px; + bottom: 23px; + padding-top: 15px; + margin-bottom: 0; + z-index: 997; +} +.fixed-action-btn.active ul { + visibility: visible; +} +.fixed-action-btn.direction-left, .fixed-action-btn.direction-right { + padding: 0 0 0 15px; +} +.fixed-action-btn.direction-left ul, .fixed-action-btn.direction-right ul { + text-align: right; + right: 64px; + top: 50%; + transform: translateY(-50%); + height: 100%; + left: auto; + /*width 100% only goes to width of button container */ + width: 500px; +} +.fixed-action-btn.direction-left ul li, .fixed-action-btn.direction-right ul li { + display: inline-block; + margin: 7.5px 15px 0 0; +} +.fixed-action-btn.direction-right { + padding: 0 15px 0 0; +} +.fixed-action-btn.direction-right ul { + text-align: left; + direction: rtl; + left: 64px; + right: auto; +} +.fixed-action-btn.direction-right ul li { + margin: 7.5px 0 0 15px; +} +.fixed-action-btn.direction-bottom { + padding: 0 0 15px 0; +} +.fixed-action-btn.direction-bottom ul { + top: 64px; + bottom: auto; + display: flex; + flex-direction: column-reverse; +} +.fixed-action-btn.direction-bottom ul li { + margin: 15px 0 0 0; +} +.fixed-action-btn.toolbar { + padding: 0; + height: 56px; +} +.fixed-action-btn.toolbar.active > a i { + opacity: 0; +} +.fixed-action-btn.toolbar ul { + display: flex; + top: 0; + bottom: 0; + z-index: 1; +} +.fixed-action-btn.toolbar ul li { + flex: 1; + display: inline-block; + margin: 0; + height: 100%; + transition: none; +} +.fixed-action-btn.toolbar ul li a { + display: block; + overflow: hidden; + position: relative; + width: 100%; + height: 100%; + background-color: transparent; + box-shadow: none; + color: #fff; + line-height: 56px; + z-index: 1; +} +.fixed-action-btn.toolbar ul li a i { + line-height: inherit; +} +.fixed-action-btn ul { + left: 0; + right: 0; + text-align: center; + position: absolute; + bottom: 64px; + margin: 0; + visibility: hidden; +} +.fixed-action-btn ul li { + margin-bottom: 15px; +} +.fixed-action-btn ul a.btn-floating { + opacity: 0; +} +.fixed-action-btn .fab-backdrop { + position: absolute; + top: 0; + left: 0; + z-index: -1; + width: 40px; + height: 40px; + background-color: #ff003c; + border-radius: 50%; + transform: scale(0); +} + +.btn-flat { + box-shadow: none; + background-color: transparent; + color: #343434; + cursor: pointer; + transition: background-color 0.2s; +} +.btn-flat:focus, .btn-flat:hover { + box-shadow: none; +} +.btn-flat:focus { + background-color: rgba(0, 0, 0, 0.1); +} +.btn-flat.disabled, .btn-flat.btn-flat[disabled] { + background-color: transparent !important; + color: rgb(178.5, 178.5, 178.5) !important; + cursor: default; +} + +.btn-large { + height: 54px; + line-height: 54px; + font-size: 15px; + padding: 0 28px; +} +.btn-large i { + font-size: 1.6rem; +} + +.btn-small { + height: 32.4px; + line-height: 32.4px; + font-size: 13px; +} +.btn-small i { + font-size: 1.2rem; +} + +.btn-block { + display: block; +} + +.dropdown-content { + background-color: #fff; + margin: 0; + display: none; + min-width: 100px; + overflow-y: auto; + opacity: 0; + position: absolute; + left: 0; + top: 0; + z-index: 9999; + transform-origin: 0 0; +} +.dropdown-content:focus { + outline: 0; +} +.dropdown-content li { + clear: both; + color: rgba(0, 0, 0, 0.87); + cursor: pointer; + min-height: 50px; + line-height: 1.5rem; + width: 100%; + text-align: left; +} +.dropdown-content li:hover, .dropdown-content li.active { + background-color: #eee; +} +.dropdown-content li:focus { + outline: none; +} +.dropdown-content li.divider { + min-height: 0; + height: 1px; +} +.dropdown-content li > a, .dropdown-content li > span { + font-size: 16px; + color: #ff003c; + display: block; + line-height: 22px; + padding: 14px 16px; +} +.dropdown-content li > span > label { + top: 1px; + left: 0; + height: 18px; +} +.dropdown-content li > a > i { + height: inherit; + line-height: inherit; + float: left; + margin: 0 24px 0 0; + width: 24px; +} + +body.keyboard-focused .dropdown-content li:focus { + background-color: rgb(217.6, 217.6, 217.6); +} + +.input-field.col .dropdown-content [type=checkbox] + label { + top: 1px; + left: 0; + height: 18px; + transform: none; +} + +.dropdown-trigger { + cursor: pointer; +} + +/*! + * Waves v0.6.0 + * http://fian.my.id/Waves + * + * Copyright 2014 Alfiana E. Sibuea and other contributors + * Released under the MIT license + * https://github.com/fians/Waves/blob/master/LICENSE + */ +.waves-effect { + position: relative; + cursor: pointer; + display: inline-block; + overflow: hidden; + user-select: none; + -webkit-tap-highlight-color: transparent; + vertical-align: middle; + z-index: 1; + transition: 0.3s ease-out; +} +.waves-effect .waves-ripple { + position: absolute; + border-radius: 50%; + width: 20px; + height: 20px; + margin-top: -10px; + margin-left: -10px; + opacity: 0; + background: rgba(0, 0, 0, 0.2); + transition: all 0.7s ease-out; + transition-property: transform, opacity; + transform: scale(0); + pointer-events: none; +} +.waves-effect.waves-light .waves-ripple { + background-color: rgba(255, 255, 255, 0.45); +} +.waves-effect.waves-red .waves-ripple { + background-color: rgba(244, 67, 54, 0.7); +} +.waves-effect.waves-yellow .waves-ripple { + background-color: rgba(255, 235, 59, 0.7); +} +.waves-effect.waves-orange .waves-ripple { + background-color: rgba(255, 152, 0, 0.7); +} +.waves-effect.waves-purple .waves-ripple { + background-color: rgba(156, 39, 176, 0.7); +} +.waves-effect.waves-green .waves-ripple { + background-color: rgba(76, 175, 80, 0.7); +} +.waves-effect.waves-teal .waves-ripple { + background-color: rgba(0, 150, 136, 0.7); +} +.waves-effect input[type=button], .waves-effect input[type=reset], .waves-effect input[type=submit] { + border: 0; + font-style: normal; + font-size: inherit; + text-transform: inherit; + background: none; +} +.waves-effect img { + position: relative; + z-index: -1; +} + +.waves-notransition { + transition: none !important; +} + +.waves-circle { + transform: translateZ(0); + -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%); +} + +.waves-input-wrapper { + border-radius: 0.2em; + vertical-align: bottom; +} +.waves-input-wrapper .waves-button-input { + position: relative; + top: 0; + left: 0; + z-index: 1; +} + +.waves-circle { + text-align: center; + width: 2.5em; + height: 2.5em; + line-height: 2.5em; + border-radius: 50%; + -webkit-mask-image: none; +} + +.waves-block { + display: block; +} + +/* Firefox Bug: link not triggered */ +.waves-effect .waves-ripple { + z-index: -1; +} + +.modal { + display: none; + position: fixed; + left: 0; + right: 0; + background-color: #fafafa; + padding: 0; + max-height: 70%; + width: 55%; + margin: auto; + overflow-y: auto; + border-radius: 2px; + will-change: top, opacity; +} +.modal:focus { + outline: none; +} +@media only screen and (max-width : 992px) { + .modal { + width: 80%; + } +} +.modal h1, .modal h2, .modal h3, .modal h4 { + margin-top: 0; +} +.modal .modal-content { + padding: 24px; +} +.modal .modal-close { + cursor: pointer; +} +.modal .modal-footer { + border-radius: 0 0 2px 2px; + background-color: #fafafa; + padding: 4px 6px; + height: 56px; + width: 100%; + text-align: right; +} +.modal .modal-footer .btn, .modal .modal-footer .btn-large, .modal .modal-footer .btn-small, .modal .modal-footer .btn-flat { + margin: 6px 0; +} + +.modal-overlay { + position: fixed; + z-index: 999; + top: -25%; + left: 0; + bottom: 0; + right: 0; + height: 125%; + width: 100%; + background: #000; + display: none; + will-change: opacity; +} + +.modal.modal-fixed-footer { + padding: 0; + height: 70%; +} +.modal.modal-fixed-footer .modal-content { + position: absolute; + height: calc(100% - 56px); + max-height: 100%; + width: 100%; + overflow-y: auto; +} +.modal.modal-fixed-footer .modal-footer { + border-top: 1px solid rgba(0, 0, 0, 0.1); + position: absolute; + bottom: 0; +} + +.modal.bottom-sheet { + top: auto; + bottom: -100%; + margin: 0; + width: 100%; + max-height: 45%; + border-radius: 0; + will-change: bottom, opacity; +} + +.collapsible { + border-top: 1px solid #ddd; + border-right: 1px solid #ddd; + border-left: 1px solid #ddd; + margin: 0.5rem 0 1rem 0; +} + +.collapsible-header { + display: flex; + cursor: pointer; + -webkit-tap-highlight-color: transparent; + line-height: 1.5; + padding: 1rem; + background-color: #fff; + border-bottom: 1px solid #ddd; +} +.collapsible-header:focus { + outline: 0; +} +.collapsible-header i { + width: 2rem; + font-size: 1.6rem; + display: inline-block; + text-align: center; + margin-right: 1rem; +} + +.keyboard-focused .collapsible-header:focus { + background-color: #eee; +} + +.collapsible-body { + display: none; + border-bottom: 1px solid #ddd; + box-sizing: border-box; + padding: 2rem; +} + +.sidenav .collapsible, +.sidenav.fixed .collapsible { + border: none; + box-shadow: none; +} +.sidenav .collapsible li, +.sidenav.fixed .collapsible li { + padding: 0; +} +.sidenav .collapsible-header, +.sidenav.fixed .collapsible-header { + background-color: transparent; + border: none; + line-height: inherit; + height: inherit; + padding: 0 16px; +} +.sidenav .collapsible-header:hover, +.sidenav.fixed .collapsible-header:hover { + background-color: rgba(0, 0, 0, 0.05); +} +.sidenav .collapsible-header i, +.sidenav.fixed .collapsible-header i { + line-height: inherit; +} +.sidenav .collapsible-body, +.sidenav.fixed .collapsible-body { + border: 0; + background-color: #fff; +} +.sidenav .collapsible-body li a, +.sidenav.fixed .collapsible-body li a { + padding: 0 23.5px 0 31px; +} + +.collapsible.popout { + border: none; + box-shadow: none; +} +.collapsible.popout > li { + box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); + margin: 0 24px; + transition: margin 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); +} +.collapsible.popout > li.active { + box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15); + margin: 16px 0; +} + +.chip { + display: inline-block; + height: 32px; + font-size: 13px; + font-weight: 500; + color: rgba(0, 0, 0, 0.6); + line-height: 32px; + padding: 0 12px; + border-radius: 16px; + background-color: #e4e4e4; + margin-bottom: 5px; + margin-right: 5px; +} +.chip:focus { + outline: none; + background-color: #26a69a; + color: #fff; +} +.chip > img { + float: left; + margin: 0 8px 0 -12px; + height: 32px; + width: 32px; + border-radius: 50%; +} +.chip .close { + cursor: pointer; + float: right; + font-size: 16px; + line-height: 32px; + padding-left: 8px; +} + +.chips { + border: none; + border-bottom: 1px solid #9e9e9e; + box-shadow: none; + margin: 0 0 8px 0; + min-height: 45px; + outline: none; + transition: all 0.3s; +} +.chips.focus { + border-bottom: 1px solid #26a69a; + box-shadow: 0 1px 0 0 #26a69a; +} +.chips:hover { + cursor: text; +} +.chips .input { + background: none; + border: 0; + color: rgba(0, 0, 0, 0.6); + display: inline-block; + font-size: 16px; + height: 3rem; + line-height: 32px; + outline: 0; + margin: 0; + padding: 0 !important; + width: 120px !important; +} +.chips .input:focus { + border: 0 !important; + box-shadow: none !important; +} +.chips .autocomplete-content { + margin-top: 0; + margin-bottom: 0; +} + +.prefix ~ .chips { + margin-left: 3rem; + width: 92%; + width: calc(100% - 3rem); +} + +.chips:empty ~ label { + font-size: 0.8rem; + transform: translateY(-140%); +} + +.materialboxed { + display: block; + cursor: zoom-in; + position: relative; + transition: opacity 0.4s; + -webkit-backface-visibility: hidden; +} +.materialboxed:hover:not(.active) { + opacity: 0.8; +} +.materialboxed.active { + cursor: zoom-out; +} + +#materialbox-overlay { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + background-color: #292929; + z-index: 1000; + will-change: opacity; +} + +.materialbox-caption { + position: fixed; + display: none; + color: #fff; + line-height: 50px; + bottom: 0; + left: 0; + width: 100%; + text-align: center; + padding: 0% 15%; + height: 50px; + z-index: 1000; + -webkit-font-smoothing: antialiased; +} + +select:focus { + outline: 1px solid rgb(255, 239.7, 243.3); +} + +button:focus { + outline: none; + background-color: rgb(255, 20.4, 75.6); +} + +label { + font-size: 0.8rem; + color: #9e9e9e; +} + +/* Text Inputs + Textarea + ========================================================================== */ +/* Style Placeholders */ +::placeholder { + color: #d1d1d1; +} + +/* Text inputs */ +input:not([type]), +input[type=text]:not(.browser-default), +input[type=password]:not(.browser-default), +input[type=email]:not(.browser-default), +input[type=url]:not(.browser-default), +input[type=time]:not(.browser-default), +input[type=date]:not(.browser-default), +input[type=datetime]:not(.browser-default), +input[type=datetime-local]:not(.browser-default), +input[type=tel]:not(.browser-default), +input[type=number]:not(.browser-default), +input[type=search]:not(.browser-default), +textarea.materialize-textarea { + background-color: transparent; + border: none; + border-bottom: 1px solid #9e9e9e; + border-radius: 0; + outline: none; + height: 3rem; + width: 100%; + font-size: 16px; + margin: 0 0 8px 0; + padding: 0; + box-shadow: none; + box-sizing: content-box; + transition: box-shadow 0.3s, border 0.3s; +} +input:not([type]):disabled, input:not([type])[readonly=readonly], +input[type=text]:not(.browser-default):disabled, +input[type=text]:not(.browser-default)[readonly=readonly], +input[type=password]:not(.browser-default):disabled, +input[type=password]:not(.browser-default)[readonly=readonly], +input[type=email]:not(.browser-default):disabled, +input[type=email]:not(.browser-default)[readonly=readonly], +input[type=url]:not(.browser-default):disabled, +input[type=url]:not(.browser-default)[readonly=readonly], +input[type=time]:not(.browser-default):disabled, +input[type=time]:not(.browser-default)[readonly=readonly], +input[type=date]:not(.browser-default):disabled, +input[type=date]:not(.browser-default)[readonly=readonly], +input[type=datetime]:not(.browser-default):disabled, +input[type=datetime]:not(.browser-default)[readonly=readonly], +input[type=datetime-local]:not(.browser-default):disabled, +input[type=datetime-local]:not(.browser-default)[readonly=readonly], +input[type=tel]:not(.browser-default):disabled, +input[type=tel]:not(.browser-default)[readonly=readonly], +input[type=number]:not(.browser-default):disabled, +input[type=number]:not(.browser-default)[readonly=readonly], +input[type=search]:not(.browser-default):disabled, +input[type=search]:not(.browser-default)[readonly=readonly], +textarea.materialize-textarea:disabled, +textarea.materialize-textarea[readonly=readonly] { + color: rgba(0, 0, 0, 0.42); + border-bottom: 1px dotted rgba(0, 0, 0, 0.42); +} +input:not([type]):disabled + label, input:not([type])[readonly=readonly] + label, +input[type=text]:not(.browser-default):disabled + label, +input[type=text]:not(.browser-default)[readonly=readonly] + label, +input[type=password]:not(.browser-default):disabled + label, +input[type=password]:not(.browser-default)[readonly=readonly] + label, +input[type=email]:not(.browser-default):disabled + label, +input[type=email]:not(.browser-default)[readonly=readonly] + label, +input[type=url]:not(.browser-default):disabled + label, +input[type=url]:not(.browser-default)[readonly=readonly] + label, +input[type=time]:not(.browser-default):disabled + label, +input[type=time]:not(.browser-default)[readonly=readonly] + label, +input[type=date]:not(.browser-default):disabled + label, +input[type=date]:not(.browser-default)[readonly=readonly] + label, +input[type=datetime]:not(.browser-default):disabled + label, +input[type=datetime]:not(.browser-default)[readonly=readonly] + label, +input[type=datetime-local]:not(.browser-default):disabled + label, +input[type=datetime-local]:not(.browser-default)[readonly=readonly] + label, +input[type=tel]:not(.browser-default):disabled + label, +input[type=tel]:not(.browser-default)[readonly=readonly] + label, +input[type=number]:not(.browser-default):disabled + label, +input[type=number]:not(.browser-default)[readonly=readonly] + label, +input[type=search]:not(.browser-default):disabled + label, +input[type=search]:not(.browser-default)[readonly=readonly] + label, +textarea.materialize-textarea:disabled + label, +textarea.materialize-textarea[readonly=readonly] + label { + color: rgba(0, 0, 0, 0.42); +} +input:not([type]):focus:not([readonly]), +input[type=text]:not(.browser-default):focus:not([readonly]), +input[type=password]:not(.browser-default):focus:not([readonly]), +input[type=email]:not(.browser-default):focus:not([readonly]), +input[type=url]:not(.browser-default):focus:not([readonly]), +input[type=time]:not(.browser-default):focus:not([readonly]), +input[type=date]:not(.browser-default):focus:not([readonly]), +input[type=datetime]:not(.browser-default):focus:not([readonly]), +input[type=datetime-local]:not(.browser-default):focus:not([readonly]), +input[type=tel]:not(.browser-default):focus:not([readonly]), +input[type=number]:not(.browser-default):focus:not([readonly]), +input[type=search]:not(.browser-default):focus:not([readonly]), +textarea.materialize-textarea:focus:not([readonly]) { + border-bottom: 1px solid #ff003c; + box-shadow: 0 1px 0 0 #ff003c; +} +input:not([type]):focus:not([readonly]) + label, +input[type=text]:not(.browser-default):focus:not([readonly]) + label, +input[type=password]:not(.browser-default):focus:not([readonly]) + label, +input[type=email]:not(.browser-default):focus:not([readonly]) + label, +input[type=url]:not(.browser-default):focus:not([readonly]) + label, +input[type=time]:not(.browser-default):focus:not([readonly]) + label, +input[type=date]:not(.browser-default):focus:not([readonly]) + label, +input[type=datetime]:not(.browser-default):focus:not([readonly]) + label, +input[type=datetime-local]:not(.browser-default):focus:not([readonly]) + label, +input[type=tel]:not(.browser-default):focus:not([readonly]) + label, +input[type=number]:not(.browser-default):focus:not([readonly]) + label, +input[type=search]:not(.browser-default):focus:not([readonly]) + label, +textarea.materialize-textarea:focus:not([readonly]) + label { + color: #ff003c; +} +input:not([type]):focus.valid ~ label, +input[type=text]:not(.browser-default):focus.valid ~ label, +input[type=password]:not(.browser-default):focus.valid ~ label, +input[type=email]:not(.browser-default):focus.valid ~ label, +input[type=url]:not(.browser-default):focus.valid ~ label, +input[type=time]:not(.browser-default):focus.valid ~ label, +input[type=date]:not(.browser-default):focus.valid ~ label, +input[type=datetime]:not(.browser-default):focus.valid ~ label, +input[type=datetime-local]:not(.browser-default):focus.valid ~ label, +input[type=tel]:not(.browser-default):focus.valid ~ label, +input[type=number]:not(.browser-default):focus.valid ~ label, +input[type=search]:not(.browser-default):focus.valid ~ label, +textarea.materialize-textarea:focus.valid ~ label { + color: #446d44; +} +input:not([type]):focus.invalid ~ label, +input[type=text]:not(.browser-default):focus.invalid ~ label, +input[type=password]:not(.browser-default):focus.invalid ~ label, +input[type=email]:not(.browser-default):focus.invalid ~ label, +input[type=url]:not(.browser-default):focus.invalid ~ label, +input[type=time]:not(.browser-default):focus.invalid ~ label, +input[type=date]:not(.browser-default):focus.invalid ~ label, +input[type=datetime]:not(.browser-default):focus.invalid ~ label, +input[type=datetime-local]:not(.browser-default):focus.invalid ~ label, +input[type=tel]:not(.browser-default):focus.invalid ~ label, +input[type=number]:not(.browser-default):focus.invalid ~ label, +input[type=search]:not(.browser-default):focus.invalid ~ label, +textarea.materialize-textarea:focus.invalid ~ label { + color: purple; +} +input:not([type]).validate + label, +input[type=text]:not(.browser-default).validate + label, +input[type=password]:not(.browser-default).validate + label, +input[type=email]:not(.browser-default).validate + label, +input[type=url]:not(.browser-default).validate + label, +input[type=time]:not(.browser-default).validate + label, +input[type=date]:not(.browser-default).validate + label, +input[type=datetime]:not(.browser-default).validate + label, +input[type=datetime-local]:not(.browser-default).validate + label, +input[type=tel]:not(.browser-default).validate + label, +input[type=number]:not(.browser-default).validate + label, +input[type=search]:not(.browser-default).validate + label, +textarea.materialize-textarea.validate + label { + width: 100%; +} +/* Validation Sass Placeholders */ +.select-wrapper.valid > input.select-dropdown, input:not([type]).valid, input:not([type]):focus.valid, +input[type=text]:not(.browser-default).valid, +input[type=text]:not(.browser-default):focus.valid, +input[type=password]:not(.browser-default).valid, +input[type=password]:not(.browser-default):focus.valid, +input[type=email]:not(.browser-default).valid, +input[type=email]:not(.browser-default):focus.valid, +input[type=url]:not(.browser-default).valid, +input[type=url]:not(.browser-default):focus.valid, +input[type=time]:not(.browser-default).valid, +input[type=time]:not(.browser-default):focus.valid, +input[type=date]:not(.browser-default).valid, +input[type=date]:not(.browser-default):focus.valid, +input[type=datetime]:not(.browser-default).valid, +input[type=datetime]:not(.browser-default):focus.valid, +input[type=datetime-local]:not(.browser-default).valid, +input[type=datetime-local]:not(.browser-default):focus.valid, +input[type=tel]:not(.browser-default).valid, +input[type=tel]:not(.browser-default):focus.valid, +input[type=number]:not(.browser-default).valid, +input[type=number]:not(.browser-default):focus.valid, +input[type=search]:not(.browser-default).valid, +input[type=search]:not(.browser-default):focus.valid, +textarea.materialize-textarea.valid, +textarea.materialize-textarea:focus.valid { + border-bottom: 1px solid #446d44; + box-shadow: 0 1px 0 0 #446d44; +} + +.select-wrapper.invalid > input.select-dropdown, .select-wrapper.invalid > input.select-dropdown:focus, input:not([type]).invalid, input:not([type]):focus.invalid, +input[type=text]:not(.browser-default).invalid, +input[type=text]:not(.browser-default):focus.invalid, +input[type=password]:not(.browser-default).invalid, +input[type=password]:not(.browser-default):focus.invalid, +input[type=email]:not(.browser-default).invalid, +input[type=email]:not(.browser-default):focus.invalid, +input[type=url]:not(.browser-default).invalid, +input[type=url]:not(.browser-default):focus.invalid, +input[type=time]:not(.browser-default).invalid, +input[type=time]:not(.browser-default):focus.invalid, +input[type=date]:not(.browser-default).invalid, +input[type=date]:not(.browser-default):focus.invalid, +input[type=datetime]:not(.browser-default).invalid, +input[type=datetime]:not(.browser-default):focus.invalid, +input[type=datetime-local]:not(.browser-default).invalid, +input[type=datetime-local]:not(.browser-default):focus.invalid, +input[type=tel]:not(.browser-default).invalid, +input[type=tel]:not(.browser-default):focus.invalid, +input[type=number]:not(.browser-default).invalid, +input[type=number]:not(.browser-default):focus.invalid, +input[type=search]:not(.browser-default).invalid, +input[type=search]:not(.browser-default):focus.invalid, +textarea.materialize-textarea.invalid, +textarea.materialize-textarea:focus.invalid { + border-bottom: 1px solid purple; + box-shadow: 0 1px 0 0 purple; +} + +.select-wrapper.valid .helper-text[data-success], .select-wrapper.invalid ~ .helper-text[data-error], input:not([type]).valid ~ .helper-text[data-success], input:not([type]):focus.valid ~ .helper-text[data-success], input:not([type]).invalid ~ .helper-text[data-error], input:not([type]):focus.invalid ~ .helper-text[data-error], +input[type=text]:not(.browser-default).valid ~ .helper-text[data-success], +input[type=text]:not(.browser-default):focus.valid ~ .helper-text[data-success], +input[type=text]:not(.browser-default).invalid ~ .helper-text[data-error], +input[type=text]:not(.browser-default):focus.invalid ~ .helper-text[data-error], +input[type=password]:not(.browser-default).valid ~ .helper-text[data-success], +input[type=password]:not(.browser-default):focus.valid ~ .helper-text[data-success], +input[type=password]:not(.browser-default).invalid ~ .helper-text[data-error], +input[type=password]:not(.browser-default):focus.invalid ~ .helper-text[data-error], +input[type=email]:not(.browser-default).valid ~ .helper-text[data-success], +input[type=email]:not(.browser-default):focus.valid ~ .helper-text[data-success], +input[type=email]:not(.browser-default).invalid ~ .helper-text[data-error], +input[type=email]:not(.browser-default):focus.invalid ~ .helper-text[data-error], +input[type=url]:not(.browser-default).valid ~ .helper-text[data-success], +input[type=url]:not(.browser-default):focus.valid ~ .helper-text[data-success], +input[type=url]:not(.browser-default).invalid ~ .helper-text[data-error], +input[type=url]:not(.browser-default):focus.invalid ~ .helper-text[data-error], +input[type=time]:not(.browser-default).valid ~ .helper-text[data-success], +input[type=time]:not(.browser-default):focus.valid ~ .helper-text[data-success], +input[type=time]:not(.browser-default).invalid ~ .helper-text[data-error], +input[type=time]:not(.browser-default):focus.invalid ~ .helper-text[data-error], +input[type=date]:not(.browser-default).valid ~ .helper-text[data-success], +input[type=date]:not(.browser-default):focus.valid ~ .helper-text[data-success], +input[type=date]:not(.browser-default).invalid ~ .helper-text[data-error], +input[type=date]:not(.browser-default):focus.invalid ~ .helper-text[data-error], +input[type=datetime]:not(.browser-default).valid ~ .helper-text[data-success], +input[type=datetime]:not(.browser-default):focus.valid ~ .helper-text[data-success], +input[type=datetime]:not(.browser-default).invalid ~ .helper-text[data-error], +input[type=datetime]:not(.browser-default):focus.invalid ~ .helper-text[data-error], +input[type=datetime-local]:not(.browser-default).valid ~ .helper-text[data-success], +input[type=datetime-local]:not(.browser-default):focus.valid ~ .helper-text[data-success], +input[type=datetime-local]:not(.browser-default).invalid ~ .helper-text[data-error], +input[type=datetime-local]:not(.browser-default):focus.invalid ~ .helper-text[data-error], +input[type=tel]:not(.browser-default).valid ~ .helper-text[data-success], +input[type=tel]:not(.browser-default):focus.valid ~ .helper-text[data-success], +input[type=tel]:not(.browser-default).invalid ~ .helper-text[data-error], +input[type=tel]:not(.browser-default):focus.invalid ~ .helper-text[data-error], +input[type=number]:not(.browser-default).valid ~ .helper-text[data-success], +input[type=number]:not(.browser-default):focus.valid ~ .helper-text[data-success], +input[type=number]:not(.browser-default).invalid ~ .helper-text[data-error], +input[type=number]:not(.browser-default):focus.invalid ~ .helper-text[data-error], +input[type=search]:not(.browser-default).valid ~ .helper-text[data-success], +input[type=search]:not(.browser-default):focus.valid ~ .helper-text[data-success], +input[type=search]:not(.browser-default).invalid ~ .helper-text[data-error], +input[type=search]:not(.browser-default):focus.invalid ~ .helper-text[data-error], +textarea.materialize-textarea.valid ~ .helper-text[data-success], +textarea.materialize-textarea:focus.valid ~ .helper-text[data-success], +textarea.materialize-textarea.invalid ~ .helper-text[data-error], +textarea.materialize-textarea:focus.invalid ~ .helper-text[data-error] { + color: transparent; + user-select: none; + pointer-events: none; +} + +.select-wrapper.valid ~ .helper-text:after, input:not([type]).valid ~ .helper-text:after, input:not([type]):focus.valid ~ .helper-text:after, +input[type=text]:not(.browser-default).valid ~ .helper-text:after, +input[type=text]:not(.browser-default):focus.valid ~ .helper-text:after, +input[type=password]:not(.browser-default).valid ~ .helper-text:after, +input[type=password]:not(.browser-default):focus.valid ~ .helper-text:after, +input[type=email]:not(.browser-default).valid ~ .helper-text:after, +input[type=email]:not(.browser-default):focus.valid ~ .helper-text:after, +input[type=url]:not(.browser-default).valid ~ .helper-text:after, +input[type=url]:not(.browser-default):focus.valid ~ .helper-text:after, +input[type=time]:not(.browser-default).valid ~ .helper-text:after, +input[type=time]:not(.browser-default):focus.valid ~ .helper-text:after, +input[type=date]:not(.browser-default).valid ~ .helper-text:after, +input[type=date]:not(.browser-default):focus.valid ~ .helper-text:after, +input[type=datetime]:not(.browser-default).valid ~ .helper-text:after, +input[type=datetime]:not(.browser-default):focus.valid ~ .helper-text:after, +input[type=datetime-local]:not(.browser-default).valid ~ .helper-text:after, +input[type=datetime-local]:not(.browser-default):focus.valid ~ .helper-text:after, +input[type=tel]:not(.browser-default).valid ~ .helper-text:after, +input[type=tel]:not(.browser-default):focus.valid ~ .helper-text:after, +input[type=number]:not(.browser-default).valid ~ .helper-text:after, +input[type=number]:not(.browser-default):focus.valid ~ .helper-text:after, +input[type=search]:not(.browser-default).valid ~ .helper-text:after, +input[type=search]:not(.browser-default):focus.valid ~ .helper-text:after, +textarea.materialize-textarea.valid ~ .helper-text:after, +textarea.materialize-textarea:focus.valid ~ .helper-text:after { + content: attr(data-success); + color: #446d44; +} + +.select-wrapper.invalid ~ .helper-text:after, input:not([type]).invalid ~ .helper-text:after, input:not([type]):focus.invalid ~ .helper-text:after, +input[type=text]:not(.browser-default).invalid ~ .helper-text:after, +input[type=text]:not(.browser-default):focus.invalid ~ .helper-text:after, +input[type=password]:not(.browser-default).invalid ~ .helper-text:after, +input[type=password]:not(.browser-default):focus.invalid ~ .helper-text:after, +input[type=email]:not(.browser-default).invalid ~ .helper-text:after, +input[type=email]:not(.browser-default):focus.invalid ~ .helper-text:after, +input[type=url]:not(.browser-default).invalid ~ .helper-text:after, +input[type=url]:not(.browser-default):focus.invalid ~ .helper-text:after, +input[type=time]:not(.browser-default).invalid ~ .helper-text:after, +input[type=time]:not(.browser-default):focus.invalid ~ .helper-text:after, +input[type=date]:not(.browser-default).invalid ~ .helper-text:after, +input[type=date]:not(.browser-default):focus.invalid ~ .helper-text:after, +input[type=datetime]:not(.browser-default).invalid ~ .helper-text:after, +input[type=datetime]:not(.browser-default):focus.invalid ~ .helper-text:after, +input[type=datetime-local]:not(.browser-default).invalid ~ .helper-text:after, +input[type=datetime-local]:not(.browser-default):focus.invalid ~ .helper-text:after, +input[type=tel]:not(.browser-default).invalid ~ .helper-text:after, +input[type=tel]:not(.browser-default):focus.invalid ~ .helper-text:after, +input[type=number]:not(.browser-default).invalid ~ .helper-text:after, +input[type=number]:not(.browser-default):focus.invalid ~ .helper-text:after, +input[type=search]:not(.browser-default).invalid ~ .helper-text:after, +input[type=search]:not(.browser-default):focus.invalid ~ .helper-text:after, +textarea.materialize-textarea.invalid ~ .helper-text:after, +textarea.materialize-textarea:focus.invalid ~ .helper-text:after { + content: attr(data-error); + color: purple; +} + +.select-wrapper + label:after, input:not([type]) + label:after, +input[type=text]:not(.browser-default) + label:after, +input[type=password]:not(.browser-default) + label:after, +input[type=email]:not(.browser-default) + label:after, +input[type=url]:not(.browser-default) + label:after, +input[type=time]:not(.browser-default) + label:after, +input[type=date]:not(.browser-default) + label:after, +input[type=datetime]:not(.browser-default) + label:after, +input[type=datetime-local]:not(.browser-default) + label:after, +input[type=tel]:not(.browser-default) + label:after, +input[type=number]:not(.browser-default) + label:after, +input[type=search]:not(.browser-default) + label:after, +textarea.materialize-textarea + label:after { + display: block; + content: ""; + position: absolute; + top: 100%; + left: 0; + opacity: 0; + transition: 0.2s opacity ease-out, 0.2s color ease-out; +} + +.input-field { + position: relative; + margin-top: 1rem; + margin-bottom: 1rem; +} +.input-field.inline { + display: inline-block; + vertical-align: middle; + margin-left: 5px; +} +.input-field.inline input, +.input-field.inline .select-dropdown { + margin-bottom: 1rem; +} +.input-field.col label { + left: 0.75rem; +} +.input-field.col .prefix ~ label, +.input-field.col .prefix ~ .validate ~ label { + width: calc(100% - 3rem - 1.5rem); +} +.input-field > label { + color: #9e9e9e; + position: absolute; + top: 0; + left: 0; + font-size: 1rem; + cursor: text; + transition: transform 0.2s ease-out, color 0.2s ease-out; + transform-origin: 0% 100%; + text-align: initial; + transform: translateY(12px); +} +.input-field > label:not(.label-icon).active { + transform: translateY(-14px) scale(0.8); + transform-origin: 0 0; +} +.input-field > input[type]:-webkit-autofill:not(.browser-default):not([type=search]) + label, .input-field > input[type=date]:not(.browser-default) + label, .input-field > input[type=time]:not(.browser-default) + label { + transform: translateY(-14px) scale(0.8); + transform-origin: 0 0; +} +.input-field .helper-text { + position: relative; + min-height: 18px; + display: block; + font-size: 12px; + color: rgba(0, 0, 0, 0.54); +} +.input-field .helper-text::after { + opacity: 1; + position: absolute; + top: 0; + left: 0; +} +.input-field .prefix { + position: absolute; + width: 3rem; + font-size: 2rem; + transition: color 0.2s; + top: 0.5rem; +} +.input-field .prefix.active { + color: #ff003c; +} +.input-field .prefix ~ input, +.input-field .prefix ~ textarea, +.input-field .prefix ~ label, +.input-field .prefix ~ .validate ~ label, +.input-field .prefix ~ .helper-text, +.input-field .prefix ~ .autocomplete-content { + margin-left: 3rem; + width: 92%; + width: calc(100% - 3rem); +} +.input-field .prefix ~ label { + margin-left: 3rem; +} +@media only screen and (max-width : 992px) { + .input-field .prefix ~ input { + width: 86%; + width: calc(100% - 3rem); + } +} +@media only screen and (max-width : 600px) { + .input-field .prefix ~ input { + width: 80%; + width: calc(100% - 3rem); + } +} + +/* Search Field */ +.input-field input[type=search] { + display: block; + line-height: inherit; + transition: 0.3s background-color; +} +.nav-wrapper .input-field input[type=search] { + height: inherit; + padding-left: 4rem; + width: calc(100% - 4rem); + border: 0; + box-shadow: none; +} +.input-field input[type=search]:focus:not(.browser-default) { + background-color: #fff; + border: 0; + box-shadow: none; + color: #444; +} +.input-field input[type=search]:focus:not(.browser-default) + label i, .input-field input[type=search]:focus:not(.browser-default) ~ .mdi-navigation-close, .input-field input[type=search]:focus:not(.browser-default) ~ .material-icons { + color: #444; +} +.input-field input[type=search] + .label-icon { + transform: none; + left: 1rem; +} +.input-field input[type=search] ~ .mdi-navigation-close, .input-field input[type=search] ~ .material-icons { + position: absolute; + top: 0; + right: 1rem; + color: transparent; + cursor: pointer; + font-size: 2rem; + transition: 0.3s color; +} + +/* Textarea */ +textarea { + width: 100%; + height: 3rem; + background-color: transparent; +} +textarea.materialize-textarea { + line-height: normal; + overflow-y: hidden; /* prevents scroll bar flash */ + padding: 0.8rem 0 0.8rem 0; /* prevents text jump on Enter keypress */ + resize: none; + min-height: 3rem; + box-sizing: border-box; +} + +.hiddendiv { + visibility: hidden; + white-space: pre-wrap; + word-wrap: break-word; + overflow-wrap: break-word; /* future version of deprecated 'word-wrap' */ + padding-top: 1.2rem; /* prevents text jump on Enter keypress */ + position: absolute; + top: 0; + z-index: -1; +} + +/* Autocomplete */ +.autocomplete-content li .highlight { + color: #444; +} +.autocomplete-content li img { + height: 40px; + width: 40px; + margin: 5px 15px; +} + +/* Character Counter */ +.character-counter { + min-height: 18px; +} + +/* Radio Buttons + ========================================================================== */ +[type=radio]:not(:checked), +[type=radio]:checked { + position: absolute; + opacity: 0; + pointer-events: none; +} + +[type=radio]:not(:checked) + span, +[type=radio]:checked + span { + position: relative; + padding-left: 35px; + cursor: pointer; + display: inline-block; + height: 25px; + line-height: 25px; + font-size: 1rem; + transition: 0.28s ease; + user-select: none; +} + +[type=radio] + span:before, +[type=radio] + span:after { + content: ""; + position: absolute; + left: 0; + top: 0; + margin: 4px; + width: 16px; + height: 16px; + z-index: 0; + transition: 0.28s ease; +} + +/* Unchecked styles */ +[type=radio]:not(:checked) + span:before, +[type=radio]:not(:checked) + span:after, +[type=radio]:checked + span:before, +[type=radio]:checked + span:after, +[type=radio].with-gap:checked + span:before, +[type=radio].with-gap:checked + span:after { + border-radius: 50%; +} + +[type=radio]:not(:checked) + span:before, +[type=radio]:not(:checked) + span:after { + border: 2px solid #5a5a5a; +} + +[type=radio]:not(:checked) + span:after { + transform: scale(0); +} + +/* Checked styles */ +[type=radio]:checked + span:before { + border: 2px solid transparent; +} + +[type=radio]:checked + span:after, +[type=radio].with-gap:checked + span:before, +[type=radio].with-gap:checked + span:after { + border: 2px solid #ff003c; +} + +[type=radio]:checked + span:after, +[type=radio].with-gap:checked + span:after { + background-color: #ff003c; +} + +[type=radio]:checked + span:after { + transform: scale(1.02); +} + +/* Radio With gap */ +[type=radio].with-gap:checked + span:after { + transform: scale(0.5); +} + +/* Focused styles */ +[type=radio].tabbed:focus + span:before { + box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1); +} + +/* Disabled Radio With gap */ +[type=radio].with-gap:disabled:checked + span:before { + border: 2px solid rgba(0, 0, 0, 0.42); +} + +[type=radio].with-gap:disabled:checked + span:after { + border: none; + background-color: rgba(0, 0, 0, 0.42); +} + +/* Disabled style */ +[type=radio]:disabled:not(:checked) + span:before, +[type=radio]:disabled:checked + span:before { + background-color: transparent; + border-color: rgba(0, 0, 0, 0.42); +} + +[type=radio]:disabled + span { + color: rgba(0, 0, 0, 0.42); +} + +[type=radio]:disabled:not(:checked) + span:before { + border-color: rgba(0, 0, 0, 0.42); +} + +[type=radio]:disabled:checked + span:after { + background-color: rgba(0, 0, 0, 0.42); + border-color: #949494; +} + +/* Checkboxes + ========================================================================== */ +/* Remove default checkbox */ +[type=checkbox]:not(:checked), +[type=checkbox]:checked { + position: absolute; + opacity: 0; + pointer-events: none; +} + +[type=checkbox] { + /* checkbox aspect */ +} +[type=checkbox] + span:not(.lever) { + position: relative; + padding-left: 35px; + cursor: pointer; + display: inline-block; + height: 25px; + line-height: 25px; + font-size: 1rem; + user-select: none; +} +[type=checkbox] + span:not(.lever):before, [type=checkbox]:not(.filled-in) + span:not(.lever):after { + content: ""; + position: absolute; + top: 0; + left: 0; + width: 18px; + height: 18px; + z-index: 0; + border: 2px solid #5a5a5a; + border-radius: 1px; + margin-top: 3px; + transition: 0.2s; +} +[type=checkbox]:not(.filled-in) + span:not(.lever):after { + border: 0; + transform: scale(0); +} +[type=checkbox]:not(:checked):disabled + span:not(.lever):before { + border: none; + background-color: rgba(0, 0, 0, 0.42); +} +[type=checkbox].tabbed:focus + span:not(.lever):after { + transform: scale(1); + border: 0; + border-radius: 50%; + box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1); + background-color: rgba(0, 0, 0, 0.1); +} + +[type=checkbox]:checked + span:not(.lever):before { + top: -4px; + left: -5px; + width: 12px; + height: 22px; + border-top: 2px solid transparent; + border-left: 2px solid transparent; + border-right: 2px solid #ff003c; + border-bottom: 2px solid #ff003c; + transform: rotate(40deg); + backface-visibility: hidden; + transform-origin: 100% 100%; +} +[type=checkbox]:checked:disabled + span:before { + border-right: 2px solid rgba(0, 0, 0, 0.42); + border-bottom: 2px solid rgba(0, 0, 0, 0.42); +} + +/* Indeterminate checkbox */ +[type=checkbox]:indeterminate + span:not(.lever):before { + top: -11px; + left: -12px; + width: 10px; + height: 22px; + border-top: none; + border-left: none; + border-right: 2px solid #ff003c; + border-bottom: none; + transform: rotate(90deg); + backface-visibility: hidden; + transform-origin: 100% 100%; +} +[type=checkbox]:indeterminate:disabled + span:not(.lever):before { + border-right: 2px solid rgba(0, 0, 0, 0.42); + background-color: transparent; +} + +[type=checkbox].filled-in + span:not(.lever):after { + border-radius: 2px; +} +[type=checkbox].filled-in + span:not(.lever):before, +[type=checkbox].filled-in + span:not(.lever):after { + content: ""; + left: 0; + position: absolute; + /* .1s delay is for check animation */ + transition: border 0.25s, background-color 0.25s, width 0.2s 0.1s, height 0.2s 0.1s, top 0.2s 0.1s, left 0.2s 0.1s; + z-index: 1; +} +[type=checkbox].filled-in:not(:checked) + span:not(.lever):before { + width: 0; + height: 0; + border: 3px solid transparent; + left: 6px; + top: 10px; + transform: rotateZ(37deg); + transform-origin: 100% 100%; +} +[type=checkbox].filled-in:not(:checked) + span:not(.lever):after { + height: 20px; + width: 20px; + background-color: transparent; + border: 2px solid #5a5a5a; + top: 0px; + z-index: 0; +} +[type=checkbox].filled-in:checked + span:not(.lever):before { + top: 0; + left: 1px; + width: 8px; + height: 13px; + border-top: 2px solid transparent; + border-left: 2px solid transparent; + border-right: 2px solid #fff; + border-bottom: 2px solid #fff; + transform: rotateZ(37deg); + transform-origin: 100% 100%; +} +[type=checkbox].filled-in:checked + span:not(.lever):after { + top: 0; + width: 20px; + height: 20px; + border: 2px solid #ff003c; + background-color: #ff003c; + z-index: 0; +} +[type=checkbox].filled-in.tabbed:focus + span:not(.lever):after { + border-radius: 2px; + border-color: #5a5a5a; + background-color: rgba(0, 0, 0, 0.1); +} +[type=checkbox].filled-in.tabbed:checked:focus + span:not(.lever):after { + border-radius: 2px; + background-color: #ff003c; + border-color: #ff003c; +} +[type=checkbox].filled-in:disabled:not(:checked) + span:not(.lever):before { + background-color: transparent; + border: 2px solid transparent; +} +[type=checkbox].filled-in:disabled:not(:checked) + span:not(.lever):after { + border-color: transparent; + background-color: #949494; +} +[type=checkbox].filled-in:disabled:checked + span:not(.lever):before { + background-color: transparent; +} +[type=checkbox].filled-in:disabled:checked + span:not(.lever):after { + background-color: #949494; + border-color: #949494; +} + +/* Switch + ========================================================================== */ +.switch, +.switch * { + -webkit-tap-highlight-color: transparent; + user-select: none; +} + +.switch label { + cursor: pointer; +} + +.switch label input[type=checkbox] { + opacity: 0; + width: 0; + height: 0; +} +.switch label input[type=checkbox]:checked + .lever { + background-color: rgb(239.0625, 143.4375, 165.9375); +} +.switch label input[type=checkbox]:checked + .lever:before, .switch label input[type=checkbox]:checked + .lever:after { + left: 18px; +} +.switch label input[type=checkbox]:checked + .lever:after { + background-color: #ff003c; +} + +.switch label .lever { + content: ""; + display: inline-block; + position: relative; + width: 36px; + height: 14px; + background-color: rgba(0, 0, 0, 0.38); + border-radius: 15px; + margin-right: 10px; + transition: background 0.3s ease; + vertical-align: middle; + margin: 0 16px; +} +.switch label .lever:before, .switch label .lever:after { + content: ""; + position: absolute; + display: inline-block; + width: 20px; + height: 20px; + border-radius: 50%; + left: 0; + top: -3px; + transition: left 0.3s ease, background 0.3s ease, box-shadow 0.1s ease, transform 0.1s ease; +} +.switch label .lever:before { + background-color: rgba(255, 0, 60, 0.15); +} +.switch label .lever:after { + background-color: #F1F1F1; + box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); +} + +input[type=checkbox]:checked:not(:disabled) ~ .lever:active::before, +input[type=checkbox]:checked:not(:disabled).tabbed:focus ~ .lever::before { + transform: scale(2.4); + background-color: rgba(255, 0, 60, 0.15); +} + +input[type=checkbox]:not(:disabled) ~ .lever:active:before, +input[type=checkbox]:not(:disabled).tabbed:focus ~ .lever::before { + transform: scale(2.4); + background-color: rgba(0, 0, 0, 0.08); +} + +.switch input[type=checkbox][disabled] + .lever { + cursor: default; + background-color: rgba(0, 0, 0, 0.12); +} + +.switch label input[type=checkbox][disabled] + .lever:after, +.switch label input[type=checkbox][disabled]:checked + .lever:after { + background-color: #949494; +} + +/* Select Field + ========================================================================== */ +select { + display: none; +} + +select.browser-default { + display: block; +} + +select { + background-color: rgba(255, 255, 255, 0.9); + width: 100%; + padding: 5px; + border: 1px solid #f2f2f2; + border-radius: 2px; + height: 3rem; +} + +.select-label { + position: absolute; +} + +.select-wrapper { + position: relative; +} +.select-wrapper.valid + label, .select-wrapper.invalid + label { + width: 100%; + pointer-events: none; +} +.select-wrapper input.select-dropdown { + position: relative; + cursor: pointer; + background-color: transparent; + border: none; + border-bottom: 1px solid #9e9e9e; + outline: none; + height: 3rem; + line-height: 3rem; + width: 100%; + font-size: 16px; + margin: 0 0 8px 0; + padding: 0; + display: block; + user-select: none; + z-index: 1; +} +.select-wrapper input.select-dropdown:focus { + border-bottom: 1px solid #ff003c; +} +.select-wrapper .caret { + position: absolute; + right: 0; + top: 0; + bottom: 0; + margin: auto 0; + z-index: 0; + fill: rgba(0, 0, 0, 0.87); +} +.select-wrapper + label { + position: absolute; + top: -26px; + font-size: 0.8rem; +} + +select:disabled { + color: rgba(0, 0, 0, 0.42); +} + +.select-wrapper.disabled + label { + color: rgba(0, 0, 0, 0.42); +} +.select-wrapper.disabled .caret { + fill: rgba(0, 0, 0, 0.42); +} + +.select-wrapper input.select-dropdown:disabled { + color: rgba(0, 0, 0, 0.42); + cursor: default; + user-select: none; +} + +.select-wrapper i { + color: rgba(0, 0, 0, 0.3); +} + +.select-dropdown li.disabled, +.select-dropdown li.disabled > span, +.select-dropdown li.optgroup { + color: rgba(0, 0, 0, 0.3); + background-color: transparent; +} + +body.keyboard-focused .select-dropdown.dropdown-content li:focus { + background-color: rgba(0, 0, 0, 0.08); +} + +.select-dropdown.dropdown-content li:hover { + background-color: rgba(0, 0, 0, 0.08); +} +.select-dropdown.dropdown-content li.selected { + background-color: rgba(0, 0, 0, 0.03); +} + +.prefix ~ .select-wrapper { + margin-left: 3rem; + width: 92%; + width: calc(100% - 3rem); +} + +.prefix ~ label { + margin-left: 3rem; +} + +.select-dropdown li img { + height: 40px; + width: 40px; + margin: 5px 15px; + float: right; +} + +.select-dropdown li.optgroup { + border-top: 1px solid #eee; +} +.select-dropdown li.optgroup.selected > span { + color: rgba(0, 0, 0, 0.7); +} +.select-dropdown li.optgroup > span { + color: rgba(0, 0, 0, 0.4); +} +.select-dropdown li.optgroup ~ li.optgroup-option { + padding-left: 1rem; +} + +/* File Input + ========================================================================== */ +.file-field { + position: relative; +} +.file-field .file-path-wrapper { + overflow: hidden; + padding-left: 10px; +} +.file-field input.file-path { + width: 100%; +} +.file-field .btn, .file-field .btn-large, .file-field .btn-small { + float: left; + height: 3rem; + line-height: 3rem; +} +.file-field span { + cursor: pointer; +} +.file-field input[type=file] { + position: absolute; + top: 0; + right: 0; + left: 0; + bottom: 0; + width: 100%; + margin: 0; + padding: 0; + font-size: 20px; + cursor: pointer; + opacity: 0; + filter: alpha(opacity=0); +} +.file-field input[type=file]::-webkit-file-upload-button { + display: none; +} + +/* Range + ========================================================================== */ +.range-field { + position: relative; +} + +input[type=range], +input[type=range] + .thumb { + cursor: pointer; +} + +input[type=range] { + position: relative; + background-color: transparent; + border: none; + outline: none; + width: 100%; + margin: 15px 0; + padding: 0; +} +input[type=range]:focus { + outline: none; +} + +input[type=range] + .thumb { + position: absolute; + top: 10px; + left: 0; + border: none; + height: 0; + width: 0; + border-radius: 50%; + background-color: #ff003c; + margin-left: 7px; + transform-origin: 50% 50%; + transform: rotate(-45deg); +} +input[type=range] + .thumb .value { + display: block; + width: 30px; + text-align: center; + color: #ff003c; + font-size: 0; + transform: rotate(45deg); +} +input[type=range] + .thumb.active { + border-radius: 50% 50% 50% 0; +} +input[type=range] + .thumb.active .value { + color: #fff; + margin-left: -1px; + margin-top: 8px; + font-size: 10px; +} + +input[type=range] { + -webkit-appearance: none; +} + +input[type=range]::-webkit-slider-runnable-track { + height: 3px; + background: #c2c0c2; + border: none; +} + +input[type=range]::-webkit-slider-thumb { + border: none; + height: 14px; + width: 14px; + border-radius: 50%; + background: #ff003c; + transition: box-shadow 0.3s; + -webkit-appearance: none; + background-color: #ff003c; + transform-origin: 50% 50%; + margin: -5px 0 0 0; +} + +.keyboard-focused input[type=range]:focus:not(.active)::-webkit-slider-thumb { + box-shadow: 0 0 0 10px rgba(255, 0, 60, 0.26); +} + +input[type=range] { + /* fix for FF unable to apply focus style bug */ + border: 1px solid white; + /*required for proper track sizing in FF*/ +} + +input[type=range]::-moz-range-track { + height: 3px; + background: #c2c0c2; + border: none; +} + +input[type=range]::-moz-focus-inner { + border: 0; +} + +input[type=range]::-moz-range-thumb { + border: none; + height: 14px; + width: 14px; + border-radius: 50%; + background: #ff003c; + transition: box-shadow 0.3s; + margin-top: -5px; +} + +input[type=range]:-moz-focusring { + outline: 1px solid #fff; + outline-offset: -1px; +} + +.keyboard-focused input[type=range]:focus:not(.active)::-moz-range-thumb { + box-shadow: 0 0 0 10px rgba(255, 0, 60, 0.26); +} + +input[type=range]::-ms-track { + height: 3px; + background: transparent; + border-color: transparent; + border-width: 6px 0; + /*remove default tick marks*/ + color: transparent; +} + +input[type=range]::-ms-fill-lower { + background: #777; +} + +input[type=range]::-ms-fill-upper { + background: #ddd; +} + +input[type=range]::-ms-thumb { + border: none; + height: 14px; + width: 14px; + border-radius: 50%; + background: #ff003c; + transition: box-shadow 0.3s; +} + +.keyboard-focused input[type=range]:focus:not(.active)::-ms-thumb { + box-shadow: 0 0 0 10px rgba(255, 0, 60, 0.26); +} + +/*************** + Nav List +***************/ +.table-of-contents.fixed { + position: fixed; +} +.table-of-contents li { + padding: 2px 0; +} +.table-of-contents a { + display: inline-block; + font-weight: 300; + color: #757575; + padding-left: 16px; + height: 1.5rem; + line-height: 1.5rem; + letter-spacing: 0.4; + display: inline-block; +} +.table-of-contents a:hover { + color: #a8a8a8; + padding-left: 15px; + border-left: 1px solid #f8ef02; +} +.table-of-contents a.active { + font-weight: 500; + padding-left: 14px; + border-left: 2px solid #f8ef02; +} + +.sidenav { + position: fixed; + width: 300px; + left: 0; + top: 0; + margin: 0; + transform: translateX(-100%); + height: 100%; + height: calc(100% + 60px); + height: -moz-calc(100%); + padding-bottom: 60px; + background-color: #fff; + z-index: 999; + overflow-y: auto; + will-change: transform; + backface-visibility: hidden; + transform: translateX(-105%); +} +.sidenav.right-aligned { + right: 0; + transform: translateX(105%); + left: auto; + transform: translateX(100%); +} +.sidenav .collapsible { + margin: 0; +} +.sidenav li { + float: none; + line-height: 48px; +} +.sidenav li.active { + background-color: rgba(0, 0, 0, 0.05); +} +.sidenav li > a { + color: rgba(0, 0, 0, 0.87); + display: block; + font-size: 14px; + font-weight: 500; + height: 48px; + line-height: 48px; + padding: 0 32px; +} +.sidenav li > a:hover { + background-color: rgba(0, 0, 0, 0.05); +} +.sidenav li > a.btn, .sidenav li > a.btn-small, .sidenav li > a.btn-large, .sidenav li > a.btn-flat, .sidenav li > a.btn-floating { + margin: 10px 15px; +} +.sidenav li > a.btn, .sidenav li > a.btn-small, .sidenav li > a.btn-large, .sidenav li > a.btn-floating { + color: #fff; +} +.sidenav li > a.btn-flat { + color: #343434; +} +.sidenav li > a.btn:hover, .sidenav li > a.btn-small:hover, .sidenav li > a.btn-large:hover { + background-color: rgb(255, 25.5, 79.5); +} +.sidenav li > a.btn-floating:hover { + background-color: #ff003c; +} +.sidenav li > a > i, .sidenav li > a > [class^=mdi-], .sidenav li > a li > a > [class*=mdi-], .sidenav li > a > i.material-icons { + float: left; + height: 48px; + line-height: 48px; + margin: 0 32px 0 0; + width: 24px; + color: rgba(0, 0, 0, 0.54); +} +.sidenav .divider { + margin: 8px 0 0 0; +} +.sidenav .subheader { + cursor: initial; + pointer-events: none; + color: rgba(0, 0, 0, 0.54); + font-size: 14px; + font-weight: 500; + line-height: 48px; +} +.sidenav .subheader:hover { + background-color: transparent; +} +.sidenav .user-view { + position: relative; + padding: 32px 32px 0; + margin-bottom: 8px; +} +.sidenav .user-view > a { + height: auto; + padding: 0; +} +.sidenav .user-view > a:hover { + background-color: transparent; +} +.sidenav .user-view .background { + overflow: hidden; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: -1; +} +.sidenav .user-view .circle, .sidenav .user-view .name, .sidenav .user-view .email { + display: block; +} +.sidenav .user-view .circle { + height: 64px; + width: 64px; +} +.sidenav .user-view .name, +.sidenav .user-view .email { + font-size: 14px; + line-height: 24px; +} +.sidenav .user-view .name { + margin-top: 16px; + font-weight: 500; +} +.sidenav .user-view .email { + padding-bottom: 16px; + font-weight: 400; +} + +.drag-target { + height: 100%; + width: 10px; + position: fixed; + top: 0; + z-index: 998; +} +.drag-target.right-aligned { + right: 0; +} + +.sidenav.sidenav-fixed { + left: 0; + transform: translateX(0); + position: fixed; +} +.sidenav.sidenav-fixed.right-aligned { + right: 0; + left: auto; +} + +@media only screen and (max-width : 992px) { + .sidenav.sidenav-fixed { + transform: translateX(-105%); + } + .sidenav.sidenav-fixed.right-aligned { + transform: translateX(105%); + } + .sidenav > a { + padding: 0 16px; + } + .sidenav .user-view { + padding: 16px 16px 0; + } +} +.sidenav .collapsible-body > ul:not(.collapsible) > li.active, +.sidenav.sidenav-fixed .collapsible-body > ul:not(.collapsible) > li.active { + background-color: #f8ef02; +} +.sidenav .collapsible-body > ul:not(.collapsible) > li.active a, +.sidenav.sidenav-fixed .collapsible-body > ul:not(.collapsible) > li.active a { + color: #fff; +} + +.sidenav .collapsible-body { + padding: 0; +} + +.sidenav-overlay { + position: fixed; + top: 0; + left: 0; + right: 0; + opacity: 0; + height: 120vh; + background-color: rgba(0, 0, 0, 0.5); + z-index: 997; + display: none; +} + +/* + @license + Copyright (c) 2014 The Polymer Project Authors. All rights reserved. + This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt + The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt + The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt + Code distributed by Google as part of the polymer project is also + subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt + */ +/**************************/ +/* STYLES FOR THE SPINNER */ +/**************************/ +/* + * Constants: + * STROKEWIDTH = 3px + * ARCSIZE = 270 degrees (amount of circle the arc takes up) + * ARCTIME = 1333ms (time it takes to expand and contract arc) + * ARCSTARTROT = 216 degrees (how much the start location of the arc + * should rotate each time, 216 gives us a + * 5 pointed star shape (it's 360/5 * 3). + * For a 7 pointed star, we might do + * 360/7 * 3 = 154.286) + * CONTAINERWIDTH = 28px + * SHRINK_TIME = 400ms + */ +.preloader-wrapper { + display: inline-block; + position: relative; + width: 50px; + height: 50px; +} +.preloader-wrapper.small { + width: 36px; + height: 36px; +} +.preloader-wrapper.big { + width: 64px; + height: 64px; +} +.preloader-wrapper.active { + /* duration: 360 * ARCTIME / (ARCSTARTROT + (360-ARCSIZE)) */ + -webkit-animation: container-rotate 1568ms linear infinite; + animation: container-rotate 1568ms linear infinite; +} + +@-webkit-keyframes container-rotate { + to { + -webkit-transform: rotate(360deg); + } +} +@keyframes container-rotate { + to { + transform: rotate(360deg); + } +} +.spinner-layer { + position: absolute; + width: 100%; + height: 100%; + opacity: 0; + border-color: #ff003c; +} + +.spinner-blue, +.spinner-blue-only { + border-color: #4285f4; +} + +.spinner-red, +.spinner-red-only { + border-color: #db4437; +} + +.spinner-yellow, +.spinner-yellow-only { + border-color: #f4b400; +} + +.spinner-green, +.spinner-green-only { + border-color: #0f9d58; +} + +/** + * IMPORTANT NOTE ABOUT CSS ANIMATION PROPERTIES (keanulee): + * + * iOS Safari (tested on iOS 8.1) does not handle animation-delay very well - it doesn't + * guarantee that the animation will start _exactly_ after that value. So we avoid using + * animation-delay and instead set custom keyframes for each color (as redundant as it + * seems). + * + * We write out each animation in full (instead of separating animation-name, + * animation-duration, etc.) because under the polyfill, Safari does not recognize those + * specific properties properly, treats them as -webkit-animation, and overrides the + * other animation rules. See https://github.com/Polymer/platform/issues/53. + */ +.active .spinner-layer.spinner-blue { + /* durations: 4 * ARCTIME */ + -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; + animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; +} + +.active .spinner-layer.spinner-red { + /* durations: 4 * ARCTIME */ + -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; + animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; +} + +.active .spinner-layer.spinner-yellow { + /* durations: 4 * ARCTIME */ + -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; + animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; +} + +.active .spinner-layer.spinner-green { + /* durations: 4 * ARCTIME */ + -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; + animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; +} + +.active .spinner-layer, +.active .spinner-layer.spinner-blue-only, +.active .spinner-layer.spinner-red-only, +.active .spinner-layer.spinner-yellow-only, +.active .spinner-layer.spinner-green-only { + /* durations: 4 * ARCTIME */ + opacity: 1; + -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; + animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; +} + +@-webkit-keyframes fill-unfill-rotate { + 12.5% { + -webkit-transform: rotate(135deg); + } /* 0.5 * ARCSIZE */ + 25% { + -webkit-transform: rotate(270deg); + } /* 1 * ARCSIZE */ + 37.5% { + -webkit-transform: rotate(405deg); + } /* 1.5 * ARCSIZE */ + 50% { + -webkit-transform: rotate(540deg); + } /* 2 * ARCSIZE */ + 62.5% { + -webkit-transform: rotate(675deg); + } /* 2.5 * ARCSIZE */ + 75% { + -webkit-transform: rotate(810deg); + } /* 3 * ARCSIZE */ + 87.5% { + -webkit-transform: rotate(945deg); + } /* 3.5 * ARCSIZE */ + to { + -webkit-transform: rotate(1080deg); + } /* 4 * ARCSIZE */ +} +@keyframes fill-unfill-rotate { + 12.5% { + transform: rotate(135deg); + } /* 0.5 * ARCSIZE */ + 25% { + transform: rotate(270deg); + } /* 1 * ARCSIZE */ + 37.5% { + transform: rotate(405deg); + } /* 1.5 * ARCSIZE */ + 50% { + transform: rotate(540deg); + } /* 2 * ARCSIZE */ + 62.5% { + transform: rotate(675deg); + } /* 2.5 * ARCSIZE */ + 75% { + transform: rotate(810deg); + } /* 3 * ARCSIZE */ + 87.5% { + transform: rotate(945deg); + } /* 3.5 * ARCSIZE */ + to { + transform: rotate(1080deg); + } /* 4 * ARCSIZE */ +} +@-webkit-keyframes blue-fade-in-out { + from { + opacity: 1; + } + 25% { + opacity: 1; + } + 26% { + opacity: 0; + } + 89% { + opacity: 0; + } + 90% { + opacity: 1; + } + 100% { + opacity: 1; + } +} +@keyframes blue-fade-in-out { + from { + opacity: 1; + } + 25% { + opacity: 1; + } + 26% { + opacity: 0; + } + 89% { + opacity: 0; + } + 90% { + opacity: 1; + } + 100% { + opacity: 1; + } +} +@-webkit-keyframes red-fade-in-out { + from { + opacity: 0; + } + 15% { + opacity: 0; + } + 25% { + opacity: 1; + } + 50% { + opacity: 1; + } + 51% { + opacity: 0; + } +} +@keyframes red-fade-in-out { + from { + opacity: 0; + } + 15% { + opacity: 0; + } + 25% { + opacity: 1; + } + 50% { + opacity: 1; + } + 51% { + opacity: 0; + } +} +@-webkit-keyframes yellow-fade-in-out { + from { + opacity: 0; + } + 40% { + opacity: 0; + } + 50% { + opacity: 1; + } + 75% { + opacity: 1; + } + 76% { + opacity: 0; + } +} +@keyframes yellow-fade-in-out { + from { + opacity: 0; + } + 40% { + opacity: 0; + } + 50% { + opacity: 1; + } + 75% { + opacity: 1; + } + 76% { + opacity: 0; + } +} +@-webkit-keyframes green-fade-in-out { + from { + opacity: 0; + } + 65% { + opacity: 0; + } + 75% { + opacity: 1; + } + 90% { + opacity: 1; + } + 100% { + opacity: 0; + } +} +@keyframes green-fade-in-out { + from { + opacity: 0; + } + 65% { + opacity: 0; + } + 75% { + opacity: 1; + } + 90% { + opacity: 1; + } + 100% { + opacity: 0; + } +} +/** + * Patch the gap that appear between the two adjacent div.circle-clipper while the + * spinner is rotating (appears on Chrome 38, Safari 7.1, and IE 11). + */ +.gap-patch { + position: absolute; + top: 0; + left: 45%; + width: 10%; + height: 100%; + overflow: hidden; + border-color: inherit; +} + +.gap-patch .circle { + width: 1000%; + left: -450%; +} + +.circle-clipper { + display: inline-block; + position: relative; + width: 50%; + height: 100%; + overflow: hidden; + border-color: inherit; +} +.circle-clipper .circle { + width: 200%; + height: 100%; + border-width: 3px; /* STROKEWIDTH */ + border-style: solid; + border-color: inherit; + border-bottom-color: transparent !important; + border-radius: 50%; + -webkit-animation: none; + animation: none; + position: absolute; + top: 0; + right: 0; + bottom: 0; +} +.circle-clipper.left .circle { + left: 0; + border-right-color: transparent !important; + -webkit-transform: rotate(129deg); + transform: rotate(129deg); +} +.circle-clipper.right .circle { + left: -100%; + border-left-color: transparent !important; + -webkit-transform: rotate(-129deg); + transform: rotate(-129deg); +} + +.active .circle-clipper.left .circle { + /* duration: ARCTIME */ + -webkit-animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; + animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; +} + +.active .circle-clipper.right .circle { + /* duration: ARCTIME */ + -webkit-animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; + animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; +} + +@-webkit-keyframes left-spin { + from { + -webkit-transform: rotate(130deg); + } + 50% { + -webkit-transform: rotate(-5deg); + } + to { + -webkit-transform: rotate(130deg); + } +} +@keyframes left-spin { + from { + transform: rotate(130deg); + } + 50% { + transform: rotate(-5deg); + } + to { + transform: rotate(130deg); + } +} +@-webkit-keyframes right-spin { + from { + -webkit-transform: rotate(-130deg); + } + 50% { + -webkit-transform: rotate(5deg); + } + to { + -webkit-transform: rotate(-130deg); + } +} +@keyframes right-spin { + from { + transform: rotate(-130deg); + } + 50% { + transform: rotate(5deg); + } + to { + transform: rotate(-130deg); + } +} +#spinnerContainer.cooldown { + /* duration: SHRINK_TIME */ + -webkit-animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0, 0.2, 1); + animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0, 0.2, 1); +} + +@-webkit-keyframes fade-out { + from { + opacity: 1; + } + to { + opacity: 0; + } +} +@keyframes fade-out { + from { + opacity: 1; + } + to { + opacity: 0; + } +} +.slider { + position: relative; + height: 400px; + width: 100%; +} +.slider.fullscreen { + height: 100%; + width: 100%; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; +} +.slider.fullscreen ul.slides { + height: 100%; +} +.slider.fullscreen ul.indicators { + z-index: 2; + bottom: 30px; +} +.slider .slides { + background-color: #9e9e9e; + margin: 0; + height: 400px; +} +.slider .slides li { + opacity: 0; + position: absolute; + top: 0; + left: 0; + z-index: 1; + width: 100%; + height: inherit; + overflow: hidden; +} +.slider .slides li img { + height: 100%; + width: 100%; + background-size: cover; + background-position: center; +} +.slider .slides li .caption { + color: #fff; + position: absolute; + top: 15%; + left: 15%; + width: 70%; + opacity: 0; +} +.slider .slides li .caption p { + color: #e0e0e0; +} +.slider .slides li.active { + z-index: 2; +} +.slider .indicators { + position: absolute; + text-align: center; + left: 0; + right: 0; + bottom: 0; + margin: 0; +} +.slider .indicators .indicator-item { + display: inline-block; + position: relative; + cursor: pointer; + height: 16px; + width: 16px; + margin: 0 12px; + background-color: #e0e0e0; + transition: background-color 0.3s; + border-radius: 50%; +} +.slider .indicators .indicator-item.active { + background-color: #4CAF50; +} + +.carousel { + overflow: hidden; + position: relative; + width: 100%; + height: 400px; + perspective: 500px; + transform-style: preserve-3d; + transform-origin: 0% 50%; +} +.carousel.carousel-slider { + top: 0; + left: 0; +} +.carousel.carousel-slider .carousel-fixed-item { + position: absolute; + left: 0; + right: 0; + bottom: 20px; + z-index: 1; +} +.carousel.carousel-slider .carousel-fixed-item.with-indicators { + bottom: 68px; +} +.carousel.carousel-slider .carousel-item { + width: 100%; + height: 100%; + min-height: 400px; + position: absolute; + top: 0; + left: 0; +} +.carousel.carousel-slider .carousel-item h2 { + font-size: 24px; + font-weight: 500; + line-height: 32px; +} +.carousel.carousel-slider .carousel-item p { + font-size: 15px; +} +.carousel .carousel-item { + visibility: hidden; + width: 200px; + height: 200px; + position: absolute; + top: 0; + left: 0; +} +.carousel .carousel-item > img { + width: 100%; +} +.carousel .indicators { + position: absolute; + text-align: center; + left: 0; + right: 0; + bottom: 0; + margin: 0; +} +.carousel .indicators .indicator-item { + display: inline-block; + position: relative; + cursor: pointer; + height: 8px; + width: 8px; + margin: 24px 4px; + background-color: rgba(255, 255, 255, 0.5); + transition: background-color 0.3s; + border-radius: 50%; +} +.carousel .indicators .indicator-item.active { + background-color: #fff; +} +.carousel.scrolling .carousel-item .materialboxed, +.carousel .carousel-item:not(.active) .materialboxed { + pointer-events: none; +} + +.tap-target-wrapper { + width: 800px; + height: 800px; + position: fixed; + z-index: 1000; + visibility: hidden; + transition: visibility 0s 0.3s; +} + +.tap-target-wrapper.open { + visibility: visible; + transition: visibility 0s; +} +.tap-target-wrapper.open .tap-target { + transform: scale(1); + opacity: 0.95; + transition: transform 0.3s cubic-bezier(0.42, 0, 0.58, 1), opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1); +} +.tap-target-wrapper.open .tap-target-wave::before { + transform: scale(1); +} +.tap-target-wrapper.open .tap-target-wave::after { + visibility: visible; + animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite; + transition: opacity 0.3s, transform 0.3s, visibility 0s 1s; +} + +.tap-target { + position: absolute; + font-size: 1rem; + border-radius: 50%; + background-color: #f8ef02; + box-shadow: 0 20px 20px 0 rgba(0, 0, 0, 0.14), 0 10px 50px 0 rgba(0, 0, 0, 0.12), 0 30px 10px -20px rgba(0, 0, 0, 0.2); + width: 100%; + height: 100%; + opacity: 0; + transform: scale(0); + transition: transform 0.3s cubic-bezier(0.42, 0, 0.58, 1), opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1); +} + +.tap-target-content { + position: relative; + display: table-cell; +} + +.tap-target-wave { + position: absolute; + border-radius: 50%; + z-index: 10001; +} +.tap-target-wave::before, .tap-target-wave::after { + content: ""; + display: block; + position: absolute; + width: 100%; + height: 100%; + border-radius: 50%; + background-color: #ffffff; +} +.tap-target-wave::before { + transform: scale(0); + transition: transform 0.3s; +} +.tap-target-wave::after { + visibility: hidden; + transition: opacity 0.3s, transform 0.3s, visibility 0s; + z-index: -1; +} + +.tap-target-origin { + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + z-index: 10002; + position: absolute !important; +} +.tap-target-origin:not(.btn):not(.btn-large):not(.btn-small), .tap-target-origin:not(.btn):not(.btn-large):not(.btn-small):hover { + background: none; +} + +@media only screen and (max-width: 600px) { + .tap-target, .tap-target-wrapper { + width: 600px; + height: 600px; + } +} +.pulse { + overflow: visible; + position: relative; +} +.pulse::before { + content: ""; + display: block; + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + background-color: inherit; + border-radius: inherit; + transition: opacity 0.3s, transform 0.3s; + animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite; + z-index: -1; +} + +@keyframes pulse-animation { + 0% { + opacity: 1; + transform: scale(1); + } + 50% { + opacity: 0; + transform: scale(1.5); + } + 100% { + opacity: 0; + transform: scale(1.5); + } +} +/* Modal */ +.datepicker-modal { + max-width: 325px; + min-width: 300px; + max-height: none; +} + +.datepicker-container.modal-content { + display: flex; + flex-direction: column; + padding: 0; +} + +.datepicker-controls { + display: flex; + justify-content: space-between; + width: 280px; + margin: 0 auto; +} +.datepicker-controls .selects-container { + display: flex; +} +.datepicker-controls .select-wrapper input { + border-bottom: none; + text-align: center; + margin: 0; +} +.datepicker-controls .select-wrapper input:focus { + border-bottom: none; +} +.datepicker-controls .select-wrapper .caret { + display: none; +} +.datepicker-controls .select-year input { + width: 50px; +} +.datepicker-controls .select-month input { + width: 70px; +} + +.month-prev, .month-next { + margin-top: 4px; + cursor: pointer; + background-color: transparent; + border: none; +} + +/* Date Display */ +.datepicker-date-display { + flex: 1 auto; + background-color: #ff003c; + color: #fff; + padding: 20px 22px; + font-weight: 500; +} +.datepicker-date-display .year-text { + display: block; + font-size: 1.5rem; + line-height: 25px; + color: rgba(255, 255, 255, 0.7); +} +.datepicker-date-display .date-text { + display: block; + font-size: 2.8rem; + line-height: 47px; + font-weight: 500; +} + +/* Calendar */ +.datepicker-calendar-container { + flex: 2.5 auto; +} + +.datepicker-table { + width: 280px; + font-size: 1rem; + margin: 0 auto; +} +.datepicker-table thead { + border-bottom: none; +} +.datepicker-table th { + padding: 10px 5px; + text-align: center; +} +.datepicker-table tr { + border: none; +} +.datepicker-table abbr { + text-decoration: none; + color: #999; +} +.datepicker-table td { + border-radius: 50%; + padding: 0; +} +.datepicker-table td.is-today { + color: #ff003c; +} +.datepicker-table td.is-selected { + background-color: #ff003c; + color: #fff; +} +.datepicker-table td.is-outside-current-month, .datepicker-table td.is-disabled { + color: rgba(0, 0, 0, 0.3); + pointer-events: none; +} + +.datepicker-day-button { + background-color: transparent; + border: none; + line-height: 38px; + display: block; + width: 100%; + border-radius: 50%; + padding: 0 5px; + cursor: pointer; + color: inherit; +} +.datepicker-day-button:focus { + background-color: rgba(248.625, 6.375, 63.375, 0.25); +} + +/* Footer */ +.datepicker-footer { + width: 280px; + margin: 0 auto; + padding-bottom: 5px; + display: flex; + justify-content: space-between; +} + +.datepicker-cancel, +.datepicker-clear, +.datepicker-today, +.datepicker-done { + color: #ff003c; + padding: 0 1rem; +} + +.datepicker-clear { + color: purple; +} + +/* Media Queries */ +@media only screen and (min-width : 601px) { + .datepicker-modal { + max-width: 625px; + } + .datepicker-container.modal-content { + flex-direction: row; + } + .datepicker-date-display { + flex: 0 1 270px; + } + .datepicker-controls, + .datepicker-table, + .datepicker-footer { + width: 320px; + } + .datepicker-day-button { + line-height: 44px; + } +} +/* Timepicker Containers */ +.timepicker-modal { + max-width: 325px; + max-height: none; +} + +.timepicker-container.modal-content { + display: flex; + flex-direction: column; + padding: 0; +} + +.text-primary { + color: rgb(255, 255, 255); +} + +/* Clock Digital Display */ +.timepicker-digital-display { + flex: 1 auto; + background-color: #ff003c; + padding: 10px; + font-weight: 300; +} + +.timepicker-text-container { + font-size: 4rem; + font-weight: bold; + text-align: center; + color: rgba(255, 255, 255, 0.6); + font-weight: 400; + position: relative; + user-select: none; +} + +.timepicker-span-hours, +.timepicker-span-minutes, +.timepicker-span-am-pm div { + cursor: pointer; +} + +.timepicker-span-hours { + margin-right: 3px; +} + +.timepicker-span-minutes { + margin-left: 3px; +} + +.timepicker-display-am-pm { + font-size: 1.3rem; + position: absolute; + right: 1rem; + bottom: 1rem; + font-weight: 400; +} + +/* Analog Clock Display */ +.timepicker-analog-display { + flex: 2.5 auto; +} + +.timepicker-plate { + background-color: #eee; + border-radius: 50%; + width: 270px; + height: 270px; + overflow: visible; + position: relative; + margin: auto; + margin-top: 25px; + margin-bottom: 5px; + user-select: none; +} + +.timepicker-canvas, +.timepicker-dial { + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; +} + +.timepicker-minutes { + visibility: hidden; +} + +.timepicker-tick { + border-radius: 50%; + color: rgba(0, 0, 0, 0.87); + line-height: 40px; + text-align: center; + width: 40px; + height: 40px; + position: absolute; + cursor: pointer; + font-size: 15px; +} + +.timepicker-tick.active, +.timepicker-tick:hover { + background-color: rgba(255, 0, 60, 0.25); +} + +.timepicker-dial { + transition: transform 350ms, opacity 350ms; +} + +.timepicker-dial-out { + opacity: 0; +} +.timepicker-dial-out.timepicker-hours { + transform: scale(1.1, 1.1); +} +.timepicker-dial-out.timepicker-minutes { + transform: scale(0.8, 0.8); +} + +.timepicker-canvas { + transition: opacity 175ms; +} +.timepicker-canvas line { + stroke: #ff003c; + stroke-width: 4; + stroke-linecap: round; +} + +.timepicker-canvas-out { + opacity: 0.25; +} + +.timepicker-canvas-bearing { + stroke: none; + fill: #ff003c; +} + +.timepicker-canvas-bg { + stroke: none; + fill: #ff003c; +} + +/* Footer */ +.timepicker-footer { + margin: 0 auto; + padding: 5px 1rem; + display: flex; + justify-content: space-between; +} + +.timepicker-clear { + color: purple; +} + +.timepicker-close { + color: #ff003c; +} + +.timepicker-clear, +.timepicker-close { + padding: 0 20px; +} + +/* Media Queries */ +@media only screen and (min-width : 601px) { + .timepicker-modal { + max-width: 600px; + } + .timepicker-container.modal-content { + flex-direction: row; + } + .timepicker-text-container { + top: 32%; + } + .timepicker-display-am-pm { + position: relative; + right: auto; + bottom: auto; + text-align: center; + margin-top: 1.2rem; + } +} +body { + max-height: 100vh; + overflow-y: scroll; +} + +main { + height: calc(100vh - 124px); + overflow-y: scroll; + display: flex; + flex-direction: column; + align-items: center; +} + +/*# sourceMappingURL=main.css.map */ \ No newline at end of file diff --git a/assets/css/main.css.map b/assets/css/main.css.map new file mode 100644 index 0000000..8c51c1a --- /dev/null +++ b/assets/css/main.css.map @@ -0,0 +1 @@ +{"version":3,"sourceRoot":"","sources":["components/_color-classes.scss","components/_normalize.scss","components/_global.scss","components/_variables.scss","components/_badges.scss","components/_icons-material-design.scss","components/_grid.scss","components/_navbar.scss","components/_typography.scss","components/_transitions.scss","components/_cards.scss","components/_toast.scss","components/_tabs.scss","components/_tooltip.scss","components/_buttons.scss","components/_dropdown.scss","components/_waves.scss","components/_modal.scss","components/_collapsible.scss","components/_chips.scss","components/_materialbox.scss","components/forms/_forms.scss","components/forms/_input-fields.scss","components/forms/_radio-buttons.scss","components/forms/_checkboxes.scss","components/forms/_switches.scss","components/forms/_select.scss","components/forms/_file-input.scss","components/forms/_range.scss","components/_table_of_contents.scss","components/_sidenav.scss","components/_preloader.scss","components/_slider.scss","components/_carousel.scss","components/_tapTarget.scss","components/_pulse.scss","components/_datepicker.scss","components/_timepicker.scss","../../_sass/_layout.scss"],"names":[],"mappings":";AAKM;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAZF;EACE;;;AAEF;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAQN;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AAJF;EACE;;;AAEF;EACE;;;AC7BJ;AAEA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AAMA;EACE;EACA;EACA;;;AAGF;AAAA;AAGA;AAAA;AAAA;AAIA;EACE;;;AAGF;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;;;AAGF;AAAA;AAAA;AAAA;AAKA;EACE;EACA;;;AAGF;AAAA;AAGA;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA,OAEO;EACL;;;AAGF;AAAA;AAAA;AAIA;EACE;;;AAGF;AAAA;AAAA;AAAA;AAKA;EACE;EACA;EACA;;;AAGF;AAAA;AAAA;AAAA;AAKA;EACE;EACA;;;AAGF;AAAA;AAGA;AAAA;AAAA;AAAA;AAKA;EACE;EACA;;;AAGF;AAAA;AAAA;AAAA;AAKA;EACE;EACA;EACA;;;AAGF;AAAA;AAAA;AAIA;AAAA;EAEE;;;AAGF;AAAA;AAAA;AAIA;AAAA;EAEE;;;AAGF;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;EAGE;EACA;;;AAGF;AAAA;AAAA;AAIA;EACE;;;AAGF;AAAA;AAAA;AAIA;EACE;EACA;;;AAGF;AAAA;AAAA;AAIA;EACE;;;AAGF;AAAA;AAAA;AAAA;AAKA;AAAA;EAEE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;AAGA;AAAA;AAAA;AAIA;AAAA;EAEE;;;AAGF;AAAA;AAAA;AAIA;EACE;EACA;;;AAGF;AAAA;AAAA;AAIA;EACE;;;AAGF;AAAA;AAAA;AAIA;EACE;;;AAGF;AAAA;AAGA;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAAA;AAAA;EAKE;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;AAAA;AAKA;AAAA,QACQ;EACN;;;AAGF;AAAA;AAAA;AAAA;AAKA;AAAA,SACS;EACP;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAMA;AAAA;AAAA;AAAA;EAIE;;;AAGF;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;EAIE;EACA;;;AAGF;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;EAIE;;;AAGF;AAAA;AAAA;AAIA;EACE;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;AAAA;AAKA;EACE;EACA;;;AAGF;AAAA;AAAA;AAIA;EACE;;;AAGF;AAAA;AAAA;AAAA;AAKA;AAAA;EAEE;EACA;;;AAGF;AAAA;AAAA;AAIA;AAAA;EAEE;;;AAGF;AAAA;AAAA;AAAA;AAKA;EACE;EACA;;;AAGF;AAAA;AAAA;AAIA;AAAA;EAEE;;;AAGF;AAAA;AAAA;AAAA;AAKA;EACE;EACA;;;AAGF;AAAA;AAGA;AAAA;AAAA;AAAA;AAKA;AAAA;EAEE;;;AAGF;AAAA;AAAA;AAIA;EACE;;;AAGF;AAAA;AAGA;AAAA;AAAA;AAIA;EACE;;;AAGF;AAAA;AAAA;AAIA;EACE;;;AAGF;AAAA;AAGA;AAAA;AAAA;AAIA;EACE;;;AC3bF;EACC;;;AAED;EACC;;;AAaD;AAAA;AAAA;AAAA;AAAA;EAKE,aCyRW;;;ADrRX;EACE;EACA;;AAEA;EACE;;;AAKN;EACC,OCIY;EDHZ;EAGC;;;AAKF;EACE;EACA;;;AAKF;EACE;;;AAKF;EACE;;;AAGF;AACA;EACE;;;AAIF;EACE;;;AAGF;AACA;EACE;;;AAKF;AACA;EACE;;;AAKF;AACA;EACE;;;AAKF;AACA;EACE;;;AAKF;EACE;;AAEA;EACE;;;AAMJ;EACE;EACA;EACA;;;AAMF;EACE;EACA;EACA;;;AAKF;EACE;;AAEA;EACE;EACA;;AAEF;EACE;EACA;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;;AAKJ;AAAA;EAEE;EACA;;;AAQA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EAAa;;AAEb;EAAW,kBCpJC;;ADsJZ;EACE;EACA;;AAGF;EACE;;AAKJ;EACE;EACA;;;AAGJ;EACE;IACE;;EAEA;AAAA;IAEE;;EAGF;IACE;IACA;IACA;;;AAMN;EACE;EACA;;AAEA;AAAA;AAAA;EAGE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;;AAKJ;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMN;EACE;;;AAEF;EACE;;;AAGF;AAAA;AAAA;AAIA;EACE;;;AAGF;EACE;EACA;;;AAIF;AAAA;AAAA;AAIE;EADF;IAEI;;;;AAIF;EADF;IAEI;;;;AAIF;EADF;IAEI;;;;AAIF;EADF;IAEI;;;;AAIF;EADF;IAEI;;;;AAIF;EADF;IAEI;;;;AAIF;EADF;IAEI;;;;AAIF;EADF;IAEI;;;;AAIF;EADF;IAEI;;;;AAIF;EADF;IAEI;;;;AAIF;EADF;IAEI;;;;AAIF;EADF;IAEI;;;;AAOF;EADF;IAEI;;;;AAKJ;EACE;EACA,OC3DkB;ED4DlB,kBCvVc;;ADyVd;EACE;EACA;EACA;EACA;EACA;EACA;EACA,OCnE0B;EDoE1B,kBCnEwB;;;ADwE5B;EACG;;;AAGH;EACE;EACA;EACA;EACA;;AAGE;EACE;;AAIA;EACE,kBCzHc;;AD4HhB;EACE;;AAKN;EACE;;AACA;EACE,kBCrIgB;;AD0IlB;EACE;;;AAKN;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAIF;EAEE;IACE;IACA;IACA;IACA;IACA;AAoDA;;EAlDA;IACE;;EAGF;AAAA;IAEE;IACA;;EAGF;IAAK;;EACL;IACE;IACA;;EAEA;IACE;IACA;;EAEA;IACE;;EAIN;IACE;IACA;IACA;IACA;IACA;;EAEA;IACE;IACA;;EAGJ;IACE;IACA;;EAEF;IACE;IACA;IACA;;EAEF;IACE;IACA;;EAIF;IACE;IACA;;;AAQN;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE,kBC5LkB;ED6LlB,aCxLqB;EDyLrB;EACA;EACA;;AAGA;EACE;EACA;EACA;;AAGA;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAIF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;;AAMJ;EACE;;AAGF;EACE,kBC3hBY;ED4hBZ,OCjPoB;;ADmPpB;EACE;;AAIN;EACE;EACA;EACA,OCtiBc;;ADwiBZ;EACE,kBC7PoB;;ADmQxB;EACE,kBCvQgB;EDwQhB;EACA;;AAEF;EACE;;AAEF;EACE;;;AAMN;EACE;EACA,OChkBgB;;;ADkkBlB;EACE;EACA;;;AAMF;EACI;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;;AAKN;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;EACA;EACA,kBCxmBc;EDymBd;;AAEF;EACE,kBC5mBc;;AD6mBd;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;;;AAIN;EACI;IACE;IACA;;EAEF;IACE;IACA;;EAEF;IACE;IACA;;;AAIN;EACI;IACE;IACA;;EAEF;IACE;IACA;;EAEF;IACE;IACA;;;AAKN;AAAA;AAAA;AAIA;EACE;;;AAIF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;;;AAEF;EACE;;;AAIF;AAAA;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AE9vBF;EACE;EACA;EACA;EACA;EACA;EACA,aD2Ca;EC1Cb,QD0Ca;ECzCb;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA,kBDuBc;ECtBd;;AAEF;EACE;;AAGF;EACE;;;AAKJ;EACE;EACA;EACA;EACA,aDgBa;ECfb,QDea;ECdb;;;AAIF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;EACA;EACA;;;ACrDF;AACA;EACE;EACA;;;ACHF;EACE;EACA;EACA;;;AAEF;EACE;IACE;;;AAGJ;EACE;IACE;;;AAGJ;EACE;EACA;;;AAGF;EACE;EACA;;AAEA;EACE;;AAEF;EACE;;AAEF;EACE;;;AAwBJ;EACE;EACA;EACA;;AAGA;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EAEE;;AAMA;EACE,OAFK;EA1CX;EACA;EACA;;AAyCI;EACE,OAFK;EA1CX;EACA;EACA;;AAyCI;EACE,OAFK;EA1CX;EACA;EACA;;AAyCI;EACE,OAFK;EA1CX;EACA;EACA;;AAyCI;EACE,OAFK;EA1CX;EACA;EACA;;AAyCI;EACE,OAFK;EA1CX;EACA;EACA;;AAyCI;EACE,OAFK;EA1CX;EACA;EACA;;AAyCI;EACE,OAFK;EA1CX;EACA;EACA;;AAyCI;EACE,OAFK;EA1CX;EACA;EACA;;AAyCI;EACE,OAFK;EA1CX;EACA;EACA;;AAyCI;EACE,OAFK;EA1CX;EACA;EACA;;AAyCI;EACE,OAFK;EA1CX;EACA;EACA;;AAGA;EACE,aA8CS;;AA5CX;EACE,OA2CS;;AAzCX;EACE,MAwCS;;AA/CX;EACE,aA8CS;;AA5CX;EACE,OA2CS;;AAzCX;EACE,MAwCS;;AA/CX;EACE,aA8CS;;AA5CX;EACE,OA2CS;;AAzCX;EACE,MAwCS;;AA/CX;EACE,aA8CS;;AA5CX;EACE,OA2CS;;AAzCX;EACE,MAwCS;;AA/CX;EACE,aA8CS;;AA5CX;EACE,OA2CS;;AAzCX;EACE,MAwCS;;AA/CX;EACE,aA8CS;;AA5CX;EACE,OA2CS;;AAzCX;EACE,MAwCS;;AA/CX;EACE,aA8CS;;AA5CX;EACE,OA2CS;;AAzCX;EACE,MAwCS;;AA/CX;EACE,aA8CS;;AA5CX;EACE,OA2CS;;AAzCX;EACE,MAwCS;;AA/CX;EACE,aA8CS;;AA5CX;EACE,OA2CS;;AAzCX;EACE,MAwCS;;AA/CX;EACE,aA8CS;;AA5CX;EACE,OA2CS;;AAzCX;EACE,MAwCS;;AA/CX;EACE,aA8CS;;AA5CX;EACE,OA2CS;;AAzCX;EACE,MAwCS;;AA/CX;EACE,aA8CS;;AA5CX;EACE,OA2CS;;AAzCX;EACE,MAwCS;;AAKT;EAKI;IACE,OAFK;IA7Db;IACA;IACA;;EA4DM;IACE,OAFK;IA7Db;IACA;IACA;;EA4DM;IACE,OAFK;IA7Db;IACA;IACA;;EA4DM;IACE,OAFK;IA7Db;IACA;IACA;;EA4DM;IACE,OAFK;IA7Db;IACA;IACA;;EA4DM;IACE,OAFK;IA7Db;IACA;IACA;;EA4DM;IACE,OAFK;IA7Db;IACA;IACA;;EA4DM;IACE,OAFK;IA7Db;IACA;IACA;;EA4DM;IACE,OAFK;IA7Db;IACA;IACA;;EA4DM;IACE,OAFK;IA7Db;IACA;IACA;;EA4DM;IACE,OAFK;IA7Db;IACA;IACA;;EA4DM;IACE,OAFK;IA7Db;IACA;IACA;;EAGA;IACE,aAiEW;;EA/Db;IACE,OA8DW;;EA5Db;IACE,MA2DW;;EAlEb;IACE,aAiEW;;EA/Db;IACE,OA8DW;;EA5Db;IACE,MA2DW;;EAlEb;IACE,aAiEW;;EA/Db;IACE,OA8DW;;EA5Db;IACE,MA2DW;;EAlEb;IACE,aAiEW;;EA/Db;IACE,OA8DW;;EA5Db;IACE,MA2DW;;EAlEb;IACE,aAiEW;;EA/Db;IACE,OA8DW;;EA5Db;IACE,MA2DW;;EAlEb;IACE,aAiEW;;EA/Db;IACE,OA8DW;;EA5Db;IACE,MA2DW;;EAlEb;IACE,aAiEW;;EA/Db;IACE,OA8DW;;EA5Db;IACE,MA2DW;;EAlEb;IACE,aAiEW;;EA/Db;IACE,OA8DW;;EA5Db;IACE,MA2DW;;EAlEb;IACE,aAiEW;;EA/Db;IACE,OA8DW;;EA5Db;IACE,MA2DW;;EAlEb;IACE,aAiEW;;EA/Db;IACE,OA8DW;;EA5Db;IACE,MA2DW;;EAlEb;IACE,aAiEW;;EA/Db;IACE,OA8DW;;EA5Db;IACE,MA2DW;;EAlEb;IACE,aAiEW;;EA/Db;IACE,OA8DW;;EA5Db;IACE,MA2DW;;;AAMX;EAKI;IACE,OAFK;IAjFb;IACA;IACA;;EAgFM;IACE,OAFK;IAjFb;IACA;IACA;;EAgFM;IACE,OAFK;IAjFb;IACA;IACA;;EAgFM;IACE,OAFK;IAjFb;IACA;IACA;;EAgFM;IACE,OAFK;IAjFb;IACA;IACA;;EAgFM;IACE,OAFK;IAjFb;IACA;IACA;;EAgFM;IACE,OAFK;IAjFb;IACA;IACA;;EAgFM;IACE,OAFK;IAjFb;IACA;IACA;;EAgFM;IACE,OAFK;IAjFb;IACA;IACA;;EAgFM;IACE,OAFK;IAjFb;IACA;IACA;;EAgFM;IACE,OAFK;IAjFb;IACA;IACA;;EAgFM;IACE,OAFK;IAjFb;IACA;IACA;;EAGA;IACE,aAqFW;;EAnFb;IACE,OAkFW;;EAhFb;IACE,MA+EW;;EAtFb;IACE,aAqFW;;EAnFb;IACE,OAkFW;;EAhFb;IACE,MA+EW;;EAtFb;IACE,aAqFW;;EAnFb;IACE,OAkFW;;EAhFb;IACE,MA+EW;;EAtFb;IACE,aAqFW;;EAnFb;IACE,OAkFW;;EAhFb;IACE,MA+EW;;EAtFb;IACE,aAqFW;;EAnFb;IACE,OAkFW;;EAhFb;IACE,MA+EW;;EAtFb;IACE,aAqFW;;EAnFb;IACE,OAkFW;;EAhFb;IACE,MA+EW;;EAtFb;IACE,aAqFW;;EAnFb;IACE,OAkFW;;EAhFb;IACE,MA+EW;;EAtFb;IACE,aAqFW;;EAnFb;IACE,OAkFW;;EAhFb;IACE,MA+EW;;EAtFb;IACE,aAqFW;;EAnFb;IACE,OAkFW;;EAhFb;IACE,MA+EW;;EAtFb;IACE,aAqFW;;EAnFb;IACE,OAkFW;;EAhFb;IACE,MA+EW;;EAtFb;IACE,aAqFW;;EAnFb;IACE,OAkFW;;EAhFb;IACE,MA+EW;;EAtFb;IACE,aAqFW;;EAnFb;IACE,OAkFW;;EAhFb;IACE,MA+EW;;;AAMX;EAKI;IACE,OAFK;IArGb;IACA;IACA;;EAoGM;IACE,OAFK;IArGb;IACA;IACA;;EAoGM;IACE,OAFK;IArGb;IACA;IACA;;EAoGM;IACE,OAFK;IArGb;IACA;IACA;;EAoGM;IACE,OAFK;IArGb;IACA;IACA;;EAoGM;IACE,OAFK;IArGb;IACA;IACA;;EAoGM;IACE,OAFK;IArGb;IACA;IACA;;EAoGM;IACE,OAFK;IArGb;IACA;IACA;;EAoGM;IACE,OAFK;IArGb;IACA;IACA;;EAoGM;IACE,OAFK;IArGb;IACA;IACA;;EAoGM;IACE,OAFK;IArGb;IACA;IACA;;EAoGM;IACE,OAFK;IArGb;IACA;IACA;;EAGA;IACE,aAyGW;;EAvGb;IACE,OAsGW;;EApGb;IACE,MAmGW;;EA1Gb;IACE,aAyGW;;EAvGb;IACE,OAsGW;;EApGb;IACE,MAmGW;;EA1Gb;IACE,aAyGW;;EAvGb;IACE,OAsGW;;EApGb;IACE,MAmGW;;EA1Gb;IACE,aAyGW;;EAvGb;IACE,OAsGW;;EApGb;IACE,MAmGW;;EA1Gb;IACE,aAyGW;;EAvGb;IACE,OAsGW;;EApGb;IACE,MAmGW;;EA1Gb;IACE,aAyGW;;EAvGb;IACE,OAsGW;;EApGb;IACE,MAmGW;;EA1Gb;IACE,aAyGW;;EAvGb;IACE,OAsGW;;EApGb;IACE,MAmGW;;EA1Gb;IACE,aAyGW;;EAvGb;IACE,OAsGW;;EApGb;IACE,MAmGW;;EA1Gb;IACE,aAyGW;;EAvGb;IACE,OAsGW;;EApGb;IACE,MAmGW;;EA1Gb;IACE,aAyGW;;EAvGb;IACE,OAsGW;;EApGb;IACE,MAmGW;;EA1Gb;IACE,aAyGW;;EAvGb;IACE,OAsGW;;EApGb;IACE,MAmGW;;EA1Gb;IACE,aAyGW;;EAvGb;IACE,OAsGW;;EApGb;IACE,MAmGW;;;;ACrJf;EAeE,OJ0OkB;EIxOlB,kBJmBc;EIlBd;EACA,QJmOqB;EIlOrB,aJkOqB;;AIrPrB;EACE;;AAEA;EACE,YJiPiB;EIhPjB;;AAGF;EACE;EACA;;AAWJ;EAAI,OJmOc;;AIjOlB;AAAA;AAAA;EAGE;EACA;EACA,QJyNmB;EIxNnB,aJwNmB;;AIrNrB;EACE;EACA;;AAGF;EACE;IAAoB;;;AAKtB;EACE;EACA;EACA;EACA,QJsMmB;EIrMnB;;AAEA;EACE,QJkMiB;EIjMjB,aJiMiB;;AI3LrB;EACE;EACA,OJ4LgB;EI3LhB;EACA,WJ2LqB;EI1LrB;;AAEA;EACE;EACA;;AAGF;EAZF;IAaI;IACA;;EAEA;IACE;IACA;;EAGF;IAAS;;EACT;IACE;IACA;;;AAIJ;EACE;EACA;;AAGF;AAAA;AAAA;EAGE;EACA;;AAMJ;EACE;EACA;EACA;;AAKF;EACE;;AAEA;EACE;EACA;EACA;;AAEA;EACE;;AAGJ;EACE;EACA,WJ4Ha;EI3Hb,OJ4Hc;EI3Hd;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;;AAIJ;EACE;;AAKJ;EACE;;AAGF;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EAEE;EACA;;AAIJ;EACE;EACA;;AAEA;EACE;EACA;;AAEF;EAAa,OJoEC;;;AI9DpB;EACE;EACA,QJyDqB;EIxDrB;;AAEA;EACE;;;AAGJ;EACE;IACE,YJ8CY;;EI5Cd;IACE,QJ2CY;II1CZ,aJ0CY;;EIxCd;IACE,QJuCY;;;AKnPhB;EACE;;;AAGF;EACE;EAcA,aL6RW;EK5RX;EACA,OL4RU;;AK1SV;EAHF;IAII;;;AAGF;EAPF;IAQI;;;AAGF;EAXF;IAYI;;;;AAOJ;EACC;EACA;;;AAID;EAAqC;;;AACrC;EAAK,WLqRS;EKrRgB;EAAmB;;;AACjD;EAAK,WLqRS;EKrRgB;EAAmB;;;AACjD;EAAK,WLqRS;EKrRgB;EAAmB;;;AACjD;EAAK,WLqRS;EKrRgB;EAAmB;;;AACjD;EAAK,WLqRS;EKrRgB;EAAmB;;;AACjD;EAAK,WLqRS;EKrRgB;EAAmB;;;AAGjD;EAAK;;;AACL;EAAS;;;AACT;EAAQ;;;AACR;EAAS;;;AACT;EAAQ;;;AAMJ;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AADF;EAHJ;IAIM;;;AAMJ;EAVF;IAWI;;;;ACxDJ;EAUE;;AATA;EACE;EACA;;AAGF;EACE;;;ACNJ;EACE;EACA,SPiGa;EOhGb;EACA;EAEA,kBP8Fc;;;AO3FhB;EACE;EACA;EACA,kBPwFc;EOvFd;EACA;;AAIA;EACE;EACA;;AACA;EACE;;AAKJ;EACE;;AAEA;EACE;EACA;;AAEF;EACE;;AAEF;EACE;EACA;;AAEF;EACE;EACA;EACA;EACA;;AAIJ;EACE;;AAGF;EACE;;AAGF;EACE;;AAIF;EAaE;;AAXE;EACE;EACA;EACA;;AAEA;EACE;;AAON;EACE;;AACA;EACE;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAOJ;EACE;;AAGF;EACE;EACA;;AAOJ;EACE;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE,OP7BU;EO8BV;EACA;EACA;EACA;EACA,SPnCS;;AOuCb;EACE,SPxCW;EOyCX;;AAEA;EACE;;AAEF;EACE;EACA;EACA;;AAEA;EACE;;AAKN;EAIE;EACA;EACA;EACA;;AANA;EACE;;AAOF;EACE,OPjEY;EOkEZ,cPpES;EOqET;EACA;;AAEA;EAAU,OPrEQ;;AOyEtB;EACE,SP7EW;EO8EX;EACA,kBP9EY;EO+EZ;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;;AC/LN;EACE;EACA;EACA;;AAEA;EALF;IAMI;IACA;;;AAEF;EATF;IAUI;IACA;IACA;;;AAEF;EAdF;IAeI;IACA;IACA;;;;AAIJ;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YR0Qa;EQzQb;EACA,kBRyQY;EQxQZ;EACA;EACA;EACA,ORsQiB;EQrQjB;EACA;EACA;EACA;;AAEA;EACE,ORgQiB;EQ/PjB;EACA;EACA;;AAGF;EACE;;AAGF;EAhCF;IAiCI;IACA;;;;ACvDJ;EA4BE;EACA;EACA;EACA;EACA;EACA,kBT0Pc;ESzPd;EACA;;AAlCA;EACE;;AAEA;AAAA;AAAA;EAGE;;AAGF;AAAA;EAEE;;AAGF;EACE;;AAIJ;EACE;;AAEA;EACE;;AAaJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAaE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AApBA;EAEE;EACA;;AAGF;EAEE;EACA,OTpBQ;;ASkCZ;EAEE;EACA;;AAGJ;EACE;EACA;EACA;EACA,kBT3CkB;ES4ClB;;;AAKJ;EACE;IACE;;EAEA;IACE;;EAEA;IACE;;;AC9FR;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AC7BF;AAAA;EAEE,QXsDc;EWrDd,eX2Dc;EW1Dd;EACA,QXuDc;EWtDd,aXsDc;EWrDd,SXsDe;EWrDf;EACA;EACA;;;AAIF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAeE;EACA;EACA;EACA;EACA;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;EACA;;;AAKJ;AAAA;AAAA;AAAA;AAAA;EAKE,WXYiB;EWXjB;;AACA;AAAA;AAAA;AAAA;AAAA;EACE,WXUoB;EWTpB;;;AAOF;AAAA;EACE;;;AAKJ;EACE;EACA,OXMoB;EWLpB,kBX3BgB;EW4BhB;EACA;EAEA;EACA;;AACA;EACE,kBXH6B;;;AWSjC;EAwCE;EACA,OX5BsB;EW6BtB;EACA;EACA;EACA,OX/BqB;EWgCrB,QXhCqB;EWiCrB,aXjCqB;EWkCrB;EACA,kBXzFgB;EW0FhB,eXnCuB;EWqCvB;EACA;EACA;;AArDA;EACE,kBX1Cc;;AW6ChB;EACE;;AAEF;EAIE,OXdyB;EWezB,QXfyB;EWgBzB;;AALA;EACE;;AAKF;EACE,aXlBuB;;AWsB3B;EAIE,OXpByB;EWqBzB,QXrByB;;AWiBzB;EACE;;AAIF;EACE,aXvBuB;;AW2B3B;EAKE;EACA;EACA;;AANA;EACE;EACA;;AAqBJ;EACE;EACA;EACA;EACA,OX9CoB;EW+CpB,WXhE0B;EWiE1B,aX/CmB;;;AWoDvB;EACE,QX1Fc;;;AW8FhB;EAuFE;EACA;EACA;EACA;EACA;EACA;;AA1FE;EACE;;AAKJ;EAEE;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;AACA;EACA;;AACA;EACE;EACA;;AAIN;EACE;;AACA;EACE;EACA;EACA;EACA;;AACA;EACE;;AAIN;EACE;;AACA;EACE;EACA;EACA;EACA;;AACA;EACE;;AAIN;EAME;EACA,QXlIyB;;AW6HvB;EACE;;AAKJ;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,aXvJmB;EWwJnB;;AACA;EACE;;AAYV;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAEF;EACE;;AAGJ;EACE;EACA;EACA;EACA;EACA,OX1KmB;EW2KnB,QX3KmB;EW4KnB,kBXlOc;EWmOd,eX5KqB;EW6KrB;;;AAKJ;EACE;EACA;EACA,OX7LkB;EW8LlB;EACA;;AACA;EAEE;;AAEF;EACE;;AAEF;EAEE;EACA;EACA;;;AAKJ;EAEE,QX5NoB;EW6NpB,aX7NoB;EW8NpB,WXhOuB;EWiOvB;;AAEA;EACE,WXnO0B;;;AWwO9B;EAEE,QXnOoB;EWoOpB,aXpOoB;EWqOpB,WXvOuB;;AWwOvB;EACE,WXxO0B;;;AW6O9B;EACE;;;AChUF;EAOE,kBZoJkB;EYnJlB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAhBA;EACE;;AAkBF;EAsCE;EACA,OZuPQ;EYtPR;EACA,YZiGmB;EYhGnB;EACA;EACA;;AA3CA;EACE,kBZsIoB;;AYnItB;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA,OZIY;EYHZ;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;;AAeJ;EACE;;;AAKJ;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AClFF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;;AAIF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;;AAIJ;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;AACA;EACE;;;AChHF;EAOE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;;AAlBA;EACE;;AAmBF;EArBF;IAsBG;;;AAGD;EACE;;AAGF;EACE;;AAEF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAIN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;;;AAIF;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AC5FF;EACE;EACA;EACA;EACA;;;AAIF;EAKE;EACA;EACA;EACA;EACA;EACA,kBfsGyB;EerGzB;;AAVA;EACE;;AAWF;EACE;EACA;EACA;EACA;EACA;;;AAGJ;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAOA;AAAA;EACE;EACA;;AAEA;AAAA;EAAK;;AAGP;AAAA;EACE;EACA;EACA;EACA;EACA;;AAEA;AAAA;EAAU;;AACV;AAAA;EAAI;;AAGN;AAAA;EACE;EACA,kBfwDuB;;AetDvB;AAAA;EACE;;;AASN;EACE;EACA;;AACA;EACE;EAEA;EACA;;AAEF;EACE;EACA;;;ACvFJ;EAOE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,kBhBgHc;EgB/Gd,ehBkHY;EgBjHZ,chBiHY;;AgBjIZ;EACE;EACA,kBhB8HkB;EgB7HlB;;AAeF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA,QhBsIa;EgBrIb;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA,WhBiHc;EgBhHd,QhByGW;EgBxGX;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAIF;EACE;EACA;;;AAKJ;EACE;EACA;EACA;;;AAEF;EACE;EACA;;;ACxFF;EAOE;EACA;EACA;EACA;EACA;;AATE;EACE;;AAUJ;EACE;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACxCF;EACE,SlBmMa;;;AkBhMf;EACE;EACA,kBlBmDwB;;;AkBhD1B;EACE,WlBqKgB;EkBpKhB,OlB0JmB;;;AmBtKrB;AAAA;AAGA;AAEA;EACE,OnBgLuB;;;AmB7KzB;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAeE;EACA;EACA,enB2Ia;EmB1Ib;EACA;EACA,QnBsIa;EmBrIb;EACA,WnB2IgB;EmB1IhB,QnB4Ia;EmB3Ib,SnB4Ic;EmB3Id;EACA;EACA;;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEE,OnBsImB;EmBrInB,enBuIoB;;AmBnItB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEE,OnB+HmB;;AmB3HrB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;EACA;;AAIF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE,OnBrBc;;AmB2ChB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE,OnB3CY;;AmByDd;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE,OnBzDU;;AmB6DZ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;;AAUJ;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;EACA;;;AAEF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE,enB4DqB;EmB3DrB;;;AAEF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;EACA;EACA;;;AAEF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;EACA,OnBzFc;;;AmB2FhB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;EACA,OnB5FY;;;AmB8Fd;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAKF;EAyBE;EACA;EACA;;AAzBA;EACE;EACA;EACA;;AAEA;AAAA;EAEE;;AAMF;EACE;;AAGF;AAAA;EAEE;;AAQJ;EACE,OnBZiB;EmBajB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAKJ;EAGE;EACA;;AAGF;EAQE;EACA;EACA;EACA;EACA;;AAXA;EACE;EACA;EACA;EACA;;AAWJ;EACE;EACA,OnBxDW;EmByDX,WnBzCc;EmB0Cd;EACA;;AAEA;EAAW,OnB1LG;;AmB6LhB;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;EACA;EACA;;AAGF;EAAkB;;AAElB;EACE;IACE;IACA;;;AAIJ;EACE;IACE;IACA;;;;AAMN;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE,kBnB1Ge;EmB2Gf;EACA;EACA;;AAEA;EAGE;;AAIJ;EACE;EACA;;AAGF;EAEE;EACA;EACA;EACA;EACA;EACA,WnBrHc;EmBsHd;;;AAKJ;AAGA;EACE;EACA,QnBhJa;EmBiJb;;AAEA;EACE;EACA;EACA;EACA;EACA,YnBxJW;EmByJX;;;AAKJ;EACE;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;;;AAIF;AAGI;EAAa;;AAEb;EACE;EACA;EACA;;;AAKN;AACA;EACE;;;AChWF;AAAA;AAIA;AAAA;EAEE;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;;;AAGF;AAAA;EAEE;;;AAGF;EACE;;;AAGF;AACA;EACE;;;AAGF;AAAA;AAAA;EAGE,QpB2Ha;;;AoBxHf;AAAA;EAEE,kBpB7BgB;;;AoBgClB;EACE;;;AAGF;AACA;EACE;;;AAGF;AACA;EACE;;;AAGF;AACA;EACE;;;AAGF;EACE;EACA,kBpBoFqB;;;AoBjFvB;AACA;AAAA;EAEE;EACA,cpB6EqB;;;AoB1EvB;EACE,OpByEqB;;;AoBtEvB;EACE,cpBqEqB;;;AoBlEvB;EACE,kBpBiEqB;EoBhErB,cpBiE2B;;;AqBlL7B;AAAA;AAGA;AACA;AAAA;EAEE;EACA;EACA;;;AAIF;AAaE;;AAXA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA,kBrBiImB;;AqB7HrB;EACE;EACA;EACA;EACA;EACA;;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA,crBsHW;EqBrHX,erBqHW;EqBpHX;EACA;EACA;;AAGF;EACE;EACA;;;AAIJ;AAEE;EACE;EACA;EACA;EACA;EACA;EACA;EACA,crBgGW;EqB/FX;EACA;EACA;EACA;;AAIF;EACE;EACA;;;AAOF;EACE;;AAGF;AAAA;EAEE;EACA;EACA;AACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAKA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA,kBrB1HY;EqB2HZ;;AAKJ;EACE;EACA,crBgBgB;EqBfhB;;AAGF;EACE;EACA,kBrBxIc;EqById,crBzIc;;AqB6IhB;EACE;EACA;;AAGF;EACE;EACA,kBrBVyB;;AqBa3B;EACE;;AAGF;EACE,kBrBlByB;EqBmBzB,crBnByB;;;AsBlL7B;AAAA;AAGA;AAAA;EAEE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;AAEA;EACE,kBtB4LsB;;AsB1LtB;EACE;;AAGF;EACE,kBtBcY;;;AsBTlB;EACE;EACA;EACA;EACA;EACA;EACA,kBtB4K0B;EsB3K1B,etB4Kc;EsB3Kd;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE,kBtBmJkB;EsBlJlB;;;AAKJ;AAAA;EAEE;EACA;;;AAGF;AAAA;EAEE;EACA;;;AAIF;EACE;EACA;;;AAGF;AAAA;EAEE,kBtB2F2B;;;AuBlL7B;AAAA;AAGA;EAAS;;;AACT;EAAyB;;;AAEzB;EACE,kBvB6LkB;EuB5LlB;EACA,SvBgMe;EuB/Lf,QvByLc;EuBxLd,evB+Lc;EuB9Ld,QvByJa;;;AuBtJf;EACE;;;AAGF;EAqCE;;AAVA;EAEE;EACA;;AASF;EAIE;EACA;EACA;EACA;EACA,evBqGW;EuBpGX;EACA,QvBiGW;EuBhGX,avBgGW;EuB/FX;EACA,WvBqGc;EuBpGd,QvBsGW;EuBrGX;EACA;EACA;EACA;;AAjBA;EACE;;AAmBJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA,WvBoFc;;;AuB/ElB;EACE,OvB+EqB;;;AuB3ErB;EACE,OvB0EmB;;AuBxErB;EACE,MvBuEmB;;;AuBnEvB;EACE,OvBkEqB;EuBjErB;EACA;;;AAGF;EACE,OvBsFsB;;;AuBnFxB;AAAA;AAAA;EAGE,OvBgFsB;EuB/EtB;;;AAIA;EACE,kBvBsEkB;;;AuBhElB;EACE,kBvB8DgB;;AuB3DlB;EACE,kBvB4DmB;;;AuBtDzB;EACE;EACA;EACA;;;AAGF;EAAkB;;;AAIhB;EACE;EACA;EACA;EACA;;;AAKJ;EACE;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;;ACjLJ;AAAA;AAGA;EACE;;AAEA;EACE;EACA;;AAGF;EAAkB;;AAElB;EACE;EACA,QxBsJW;EwBrJX,axBqJW;;AwBlJb;EACE;;AAGF;EAOE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAfA;EACE;;;AC3BN;AAAA;AAGA;EACE;;;AAGF;AAAA;EAGE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,kBzBKgB;EyBJhB;EAEA;EACA;;AAEA;EACE;EACA;EACA;EACA,OzBLc;EyBMd;EACA;;AAGF;EACE;;AAEA;EACE,OzBkHa;EyBjHb;EACA;EACA;;;AAsBN;EACE;;;AAGF;EAnBE,QzBgIa;EyB/Hb;EACA;;;AAqBF;EAjBE;EACA,QzBuHa;EyBtHb,OzBuHY;EyBtHZ;EACA,YzBlCgB;EyBmChB;EAcA;EACA,kBzBlDgB;EyBmDhB;EACA;;;AAIF;EACE;;;AAIF;AACE;EACA;AAEA;;;AAGF;EA5CE,QzBgIa;EyB/Hb;EACA;;;AA8CF;EACE;;;AAGF;EA9CE;EACA,QzBuHa;EyBtHb,OzBuHY;EyBtHZ;EACA,YzBlCgB;EyBmChB;EA2CA;;;AAIF;EACE;EACA;;;AAGF;EACE;;;AAIF;EACE,QzB2Da;EyBxDb;EAGA;EACA;AAEA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EApFE;EACA,QzBuHa;EyBtHb,OzBuHY;EyBtHZ;EACA,YzBlCgB;EyBmChB;;;AAmFF;EACE;;;AC/JF;AAAA;AAAA;AAIE;EACI;;AAGJ;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEF;EACE;EACA;EACA;;;AC7BN;EACE;EACA,O3B6Pc;E2B5Pd;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,kB3BuPiB;E2BtPjB;EACA;EACA;EACA;EACA;;AAKA;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAIF;EACE;EACA,a3BiOkB;;A2B/NlB;EAAW;;AAGb;EACE,O3BwNiB;E2BvNjB;EACA,W3BqNgB;E2BpNhB;EACA,Q3BuNkB;E2BtNlB,a3BsNkB;E2BrNlB;;AAEA;EAAU;;AAEV;EACE;;AAGF;EAEiB,O3BeC;;A2BdlB;EAAa,O3B6BG;;A2B3BhB;EACoB;;AACpB;EAAuB,kB3BtBT;;A2BwBd;EAGE;EACA,Q3BgMgB;E2B/LhB,a3B+LgB;E2B9LhB;EACA;EACA;;AAKJ;EACE;;AAGF;EAKE;EACA;EACA;EACA,W3BuKgB;E2BtKhB;EACA,a3ByKkB;;A2BlLlB;EACE;;AAWJ;EACE;EACA;EACA;;AAEA;EAEE;EACA;;AAFA;EAAU;;AAKZ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;AAAA;EAEE,W3BkIc;E2BjId;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;;AAON;EAME;EACA;EACA;EACA;EACA;;AARA;EACE;;;AAYJ;EAOE;EACA;EACA;;AAPA;EACE;EACA;;;AASJ;EAEI;IACE;;EAEA;IACE;;EAIJ;IACE;;EAGF;IACE;;;AAMN;AAAA;EAEE,kB3B/Jc;;A2BgKd;AAAA;EACE,O3B6De;;;A2B1DnB;EACE;;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACtNF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAeA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;AAGF;AACE;EACA;EACA;;;AAIJ;EACE;IAAK;;;AAGP;EACE;IAAK;;;AAGP;EACE;EACA;EACA;EACA;EACA,c5BzBgB;;;A4B4BlB;AAAA;EAEE;;;AAGF;AAAA;EAEE;;;AAGF;AAAA;EAEE;;;AAGF;AAAA;EAEE;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAaA;AACE;EACA;EACA;;;AAGF;AACE;EACA;EACA;;;AAGF;AACE;EACA;EACA;;;AAGF;AACE;EACA;EACA;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAKE;EACA;EACA;EACA;;;AAGF;EACE;IAAQ;IAAsC;EAC9C;IAAQ;IAAsC;EAC9C;IAAQ;IAAsC;EAC9C;IAAQ;IAAsC;EAC9C;IAAQ;IAAsC;EAC9C;IAAQ;IAAsC;EAC9C;IAAQ;IAAsC;EAC9C;IAAQ;IAAsC;;AAGhD;EACE;IAAQ;IAA8B;EACtC;IAAQ;IAA8B;EACtC;IAAQ;IAA8B;EACtC;IAAQ;IAA8B;EACtC;IAAQ;IAA8B;EACtC;IAAQ;IAA8B;EACtC;IAAQ;IAA8B;EACtC;IAAQ;IAA8B;;AAGxC;EACE;IAAO;;EACP;IAAM;;EACN;IAAM;;EACN;IAAM;;EACN;IAAM;;EACN;IAAO;;;AAGT;EACE;IAAO;;EACP;IAAM;;EACN;IAAM;;EACN;IAAM;;EACN;IAAM;;EACN;IAAO;;;AAGT;EACE;IAAO;;EACP;IAAM;;EACN;IAAM;;EACN;IAAM;;EACN;IAAM;;;AAGR;EACE;IAAO;;EACP;IAAM;;EACN;IAAM;;EACN;IAAM;;EACN;IAAM;;;AAGR;EACE;IAAO;;EACP;IAAM;;EACN;IAAM;;EACN;IAAM;;EACN;IAAM;;;AAGR;EACE;IAAO;;EACP;IAAM;;EACN;IAAM;;EACN;IAAM;;EACN;IAAM;;;AAGR;EACE;IAAO;;EACP;IAAM;;EACN;IAAM;;EACN;IAAM;;EACN;IAAO;;;AAGT;EACE;IAAO;;EACP;IAAM;;EACN;IAAM;;EACN;IAAM;;EACN;IAAO;;;AAGT;AAAA;AAAA;AAAA;AAIA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;;AAMJ;AACE;EACA;EACA;;;AAGF;AACE;EACA;EACA;;;AAGF;EACE;IAAO;;EACP;IAAM;;EACN;IAAK;;;AAGP;EACE;IAAO;;EACP;IAAM;;EACN;IAAK;;;AAGP;EACE;IAAO;;EACP;IAAM;;EACN;IAAK;;;AAGP;EACE;IAAO;;EACP;IAAM;;EACN;IAAK;;;AAGP;AACE;EACA;EACA;;;AAGF;EACE;IAAO;;EACP;IAAK;;;AAGP;EACE;IAAO;;EACP;IAAK;;;AC5UP;EACE;EACA;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAIJ;EACE,kB7BiPc;E6BhPd;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EAAI,O7BqNY;;A6BlNlB;EACE;;AAMN;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kB7B4LkB;E6B1LlB;EACA;;AAEA;EACE,kB7BuLiB;;;A8B7QzB;EAqCE;EACA;EACA;EACA,Q9BsEgB;E8BrEhB;EACA;EACA;;AA1CA;EACE;EACA;;AAEA;EAKE;EACA;EACA;EACA;EACA;;AARA;EACE;;AAUJ;EACE;EACA;EACA,Y9B0FY;E8BzFZ;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;;AAaN;EACE;EACA,O9BgEmB;E8B/DnB,Q9B+DmB;E8B9DnB;EACA;EACA;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EAKE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;;AAbA;EACE;;AAiBN;AAAA;EAEE;;;ACvFJ;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;AAEA;EACE;EACA;EACA,YACE;;AAIJ;EACE;;AAEF;EACE;EACA;EACA,YACE;;;AAMN;EACE;EACA;EACA;EACA,kB/BFc;E+BGd;EACA;EACA;EACA;EACA;EACA,YACE;;;AAIJ;EACE;EACA;;;AAGF;EAwBE;EACA;EACA;;AAzBA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;;AAEF;EACE;EACA,YACE;EAGF;;;AAQJ;EAME;EACA;EACA;EAEA;EACA;;AAVA;EAEE;;;AAWJ;EACE;IACE;IACA;;;ACpGJ;EAgBE;EACA;;AAhBA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAOJ;EACE;IACE;IACA;;EAEF;IACE;IACA;;EAEF;IACE;IACA;;;AC/BJ;AACA;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAIA;EAIE;EACA;EACA;;AALA;EACE;;AAOJ;EACE;;AAIJ;EACE;;AAGF;EACE;;;AAIJ;EACE;EACA;EACA;EACA;;;AAIF;AACA;EACE;EACA,kBjClBgB;EiCmBhB;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA,OjC0Ec;;AiCvEhB;EACE;EACA;EACA;EACA;;;AAKJ;AACA;EACE;;;AAGF;EACE;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;AAGF;EACE;EACA,OjCiC+B;;AiC9BjC;EAgBE;EACA;;AAhBA;EACE,OjCrEY;;AiCwEd;EACE,kBjCzEY;EiC0EZ;;AAGF;EAEE,OjC2B0B;EiC1B1B;;;AAQN;EAKE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAZA;EACE,kBjCemB;;;AiCAvB;AACA;EACE;EACA;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;AAAA;EAIE,OjCtHgB;EiCuHhB;;;AAGF;EACE,OjCzHY;;;AiC6Hd;AACA;EACE;IACE;;EAGF;IACE;;EAGF;IACE;;EAGF;AAAA;AAAA;IAGE;;EAGF;IACE;;;AC5LJ;AACA;EACE;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACC;;;AAID;AACA;EACE;EACA,kBlCoBgB;EkCnBhB;EACA;;;AAGF;EACC;EACA;EACA;EACA;EACC;EACD;EACC;;;AAGF;AAAA;AAAA;EAGC;;;AAGD;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAIF;AACA;EACE;;;AAGF;EACC,kBlCqF2B;EkCpF3B;EACA;EACA;EACA;EACA;EACC;EACA;EACA;EACD;;;AAGD;AAAA;EAEC;EACA;EACC;EACA;EACA;;;AAEF;EACC;;;AAGD;EACC;EACA,OlC0DwB;EkCzDxB;EACA;EACA;EACA;EACA;EACA;EACC;;;AAGF;AAAA;EAEC;;;AAED;EACC;;;AAED;EASC;;AARC;EACC;;AAGD;EACC;;;AAKH;EACC;;AAEC;EACC,QlClFe;EkCmFf;EACA;;;AAGH;EACC;;;AAED;EACC;EACA,MlC5FiB;;;AkC8FlB;EACC;EACA,MlChGiB;;;AkCoGlB;AACA;EACE;EACA;EACA;EACA;;;AAGF;EACE,OlC3GY;;;AkC8Gd;EACE,OlCjHgB;;;AkCoHlB;AAAA;EAEE;;;AAGF;AACA;EACE;IACE;;EAGF;IACE;;EAGF;IACA;;EAGD;IACE;IACA;IACA;IACA;IACA;;;ACpLH;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA","sourcesContent":["// Color Classes\n\n@each $color_name, $color in $colors {\n @each $color_type, $color_value in $color {\n @if $color_type == \"base\" {\n .#{$color_name} {\n background-color: $color_value !important;\n }\n .#{$color_name}-text {\n color: $color_value !important;\n }\n }\n @else if $color_name != \"shades\" {\n .#{$color_name}.#{$color_type} {\n background-color: $color_value !important;\n }\n .#{$color_name}-text.text-#{$color_type} {\n color: $color_value !important;\n }\n }\n }\n}\n\n// Shade classes\n@each $color, $color_value in $shades {\n .#{$color} {\n background-color: $color_value !important;\n }\n .#{$color}-text {\n color: $color_value !important;\n }\n}\n","/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in\n * IE on Windows Phone and in iOS.\n */\n\nhtml {\n line-height: 1.15; /* 1 */\n -ms-text-size-adjust: 100%; /* 2 */\n -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n ========================================================================== */\n\n/**\n * Remove the margin in all browsers (opinionated).\n */\n\nbody {\n margin: 0;\n}\n\n/**\n * Add the correct display in IE 9-.\n */\n\narticle,\naside,\nfooter,\nheader,\nnav,\nsection {\n display: block;\n}\n\n/**\n * Correct the font size and margin on `h1` elements within `section` and\n * `article` contexts in Chrome, Firefox, and Safari.\n */\n\nh1 {\n font-size: 2em;\n margin: 0.67em 0;\n}\n\n/* Grouping content\n ========================================================================== */\n\n/**\n * Add the correct display in IE 9-.\n * 1. Add the correct display in IE.\n */\n\nfigcaption,\nfigure,\nmain { /* 1 */\n display: block;\n}\n\n/**\n * Add the correct margin in IE 8.\n */\n\nfigure {\n margin: 1em 40px;\n}\n\n/**\n * 1. Add the correct box sizing in Firefox.\n * 2. Show the overflow in Edge and IE.\n */\n\nhr {\n box-sizing: content-box; /* 1 */\n height: 0; /* 1 */\n overflow: visible; /* 2 */\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\npre {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n ========================================================================== */\n\n/**\n * 1. Remove the gray background on active links in IE 10.\n * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.\n */\n\na {\n background-color: transparent; /* 1 */\n -webkit-text-decoration-skip: objects; /* 2 */\n}\n\n/**\n * 1. Remove the bottom border in Chrome 57- and Firefox 39-.\n * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n */\n\nabbr[title] {\n border-bottom: none; /* 1 */\n text-decoration: underline; /* 2 */\n text-decoration: underline dotted; /* 2 */\n}\n\n/**\n * Prevent the duplicate application of `bolder` by the next rule in Safari 6.\n */\n\nb,\nstrong {\n font-weight: inherit;\n}\n\n/**\n * Add the correct font weight in Chrome, Edge, and Safari.\n */\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\ncode,\nkbd,\nsamp {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/**\n * Add the correct font style in Android 4.3-.\n */\n\ndfn {\n font-style: italic;\n}\n\n/**\n * Add the correct background and color in IE 9-.\n */\n\nmark {\n background-color: #ff0;\n color: #000;\n}\n\n/**\n * Add the correct font size in all browsers.\n */\n\nsmall {\n font-size: 80%;\n}\n\n/**\n * Prevent `sub` and `sup` elements from affecting the line height in\n * all browsers.\n */\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/* Embedded content\n ========================================================================== */\n\n/**\n * Add the correct display in IE 9-.\n */\n\naudio,\nvideo {\n display: inline-block;\n}\n\n/**\n * Add the correct display in iOS 4-7.\n */\n\naudio:not([controls]) {\n display: none;\n height: 0;\n}\n\n/**\n * Remove the border on images inside links in IE 10-.\n */\n\nimg {\n border-style: none;\n}\n\n/**\n * Hide the overflow in IE.\n */\n\nsvg:not(:root) {\n overflow: hidden;\n}\n\n/* Forms\n ========================================================================== */\n\n/**\n * 1. Change the font styles in all browsers (opinionated).\n * 2. Remove the margin in Firefox and Safari.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: sans-serif; /* 1 */\n font-size: 100%; /* 1 */\n line-height: 1.15; /* 1 */\n margin: 0; /* 2 */\n}\n\n/**\n * Show the overflow in IE.\n * 1. Show the overflow in Edge.\n */\n\nbutton,\ninput { /* 1 */\n overflow: visible;\n}\n\n/**\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\n * 1. Remove the inheritance of text transform in Firefox.\n */\n\nbutton,\nselect { /* 1 */\n text-transform: none;\n}\n\n/**\n * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`\n * controls in Android 4.\n * 2. Correct the inability to style clickable types in iOS and Safari.\n */\n\nbutton,\nhtml [type=\"button\"], /* 1 */\n[type=\"reset\"],\n[type=\"submit\"] {\n -webkit-appearance: button; /* 2 */\n}\n\n/**\n * Remove the inner border and padding in Firefox.\n */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n border-style: none;\n padding: 0;\n}\n\n/**\n * Restore the focus styles unset by the previous rule.\n */\n\nbutton:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring {\n outline: 1px dotted ButtonText;\n}\n\n/**\n * Correct the padding in Firefox.\n */\n\nfieldset {\n padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n * 1. Correct the text wrapping in Edge and IE.\n * 2. Correct the color inheritance from `fieldset` elements in IE.\n * 3. Remove the padding so developers are not caught out when they zero out\n * `fieldset` elements in all browsers.\n */\n\nlegend {\n box-sizing: border-box; /* 1 */\n color: inherit; /* 2 */\n display: table; /* 1 */\n max-width: 100%; /* 1 */\n padding: 0; /* 3 */\n white-space: normal; /* 1 */\n}\n\n/**\n * 1. Add the correct display in IE 9-.\n * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.\n */\n\nprogress {\n display: inline-block; /* 1 */\n vertical-align: baseline; /* 2 */\n}\n\n/**\n * Remove the default vertical scrollbar in IE.\n */\n\ntextarea {\n overflow: auto;\n}\n\n/**\n * 1. Add the correct box sizing in IE 10-.\n * 2. Remove the padding in IE 10-.\n */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n box-sizing: border-box; /* 1 */\n padding: 0; /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Chrome.\n */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n height: auto;\n}\n\n/**\n * 1. Correct the odd appearance in Chrome and Safari.\n * 2. Correct the outline style in Safari.\n */\n\n[type=\"search\"] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/**\n * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.\n */\n\n[type=\"search\"]::-webkit-search-cancel-button,\n[type=\"search\"]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style clickable types in iOS and Safari.\n * 2. Change font properties to `inherit` in Safari.\n */\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/* Interactive\n ========================================================================== */\n\n/*\n * Add the correct display in IE 9-.\n * 1. Add the correct display in Edge, IE, and Firefox.\n */\n\ndetails, /* 1 */\nmenu {\n display: block;\n}\n\n/*\n * Add the correct display in all browsers.\n */\n\nsummary {\n display: list-item;\n}\n\n/* Scripting\n ========================================================================== */\n\n/**\n * Add the correct display in IE 9-.\n */\n\ncanvas {\n display: inline-block;\n}\n\n/**\n * Add the correct display in IE.\n */\n\ntemplate {\n display: none;\n}\n\n/* Hidden\n ========================================================================== */\n\n/**\n * Add the correct display in IE 10-.\n */\n\n[hidden] {\n display: none;\n}\n","//Default styles\n\nhtml {\n box-sizing: border-box;\n}\n*, *:before, *:after {\n box-sizing: inherit;\n}\n\nbody {\n // display: flex;\n // min-height: 100vh;\n // flex-direction: column;\n}\n\nmain {\n // flex: 1 0 auto;\n}\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: $font-stack;\n}\n\nul {\n &:not(.browser-default) {\n padding-left: 0;\n list-style-type: none;\n\n & > li {\n list-style-type: none;\n }\n }\n}\n\na {\n\tcolor: $link-color;\n\ttext-decoration: none;\n\n // Gets rid of tap active state\n -webkit-tap-highlight-color: transparent;\n}\n\n\n// Positioning\n.valign-wrapper {\n display: flex;\n align-items: center;\n}\n\n\n// classic clearfix\n.clearfix {\n clear: both;\n}\n\n\n// Z-levels\n.z-depth-0 {\n box-shadow: none !important;\n}\n\n/* 2dp elevation modified*/\n.z-depth-1 {\n box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),\n 0 3px 1px -2px rgba(0,0,0,0.12),\n 0 1px 5px 0 rgba(0,0,0,0.2);\n}\n.z-depth-1-half {\n box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -1px rgba(0, 0, 0, 0.2);\n}\n\n/* 6dp elevation modified*/\n.z-depth-2 {\n box-shadow: 0 4px 5px 0 rgba(0,0,0,0.14),\n 0 1px 10px 0 rgba(0,0,0,0.12),\n 0 2px 4px -1px rgba(0,0,0,0.3);\n}\n\n/* 12dp elevation modified*/\n.z-depth-3 {\n box-shadow: 0 8px 17px 2px rgba(0,0,0,0.14),\n 0 3px 14px 2px rgba(0,0,0,0.12),\n 0 5px 5px -3px rgba(0, 0, 0, 0.2);\n}\n\n/* 16dp elevation */\n.z-depth-4 {\n box-shadow: 0 16px 24px 2px rgba(0,0,0,0.14),\n 0 6px 30px 5px rgba(0,0,0,0.12),\n 0 8px 10px -7px rgba(0,0,0,0.2);\n}\n\n/* 24dp elevation */\n.z-depth-5 {\n box-shadow: 0 24px 38px 3px rgba(0,0,0,0.14),\n 0 9px 46px 8px rgba(0,0,0,0.12),\n 0 11px 15px -7px rgba(0,0,0,0.2);\n}\n\n.hoverable {\n transition: box-shadow .25s;\n\n &:hover {\n box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);\n }\n}\n\n// Dividers\n\n.divider {\n height: 1px;\n overflow: hidden;\n background-color: color(\"grey\", \"lighten-2\");\n}\n\n\n// Blockquote\n\nblockquote {\n margin: 20px 0;\n padding-left: 1.5rem;\n border-left: 5px solid $primary-color;\n}\n\n// Icon Styles\n\ni {\n line-height: inherit;\n\n &.left {\n float: left;\n margin-right: 15px;\n }\n &.right {\n float: right;\n margin-left: 15px;\n }\n &.tiny {\n font-size: 1rem;\n }\n &.small {\n font-size: 2rem;\n }\n &.medium {\n font-size: 4rem;\n }\n &.large {\n font-size: 6rem;\n }\n}\n\n// Images\nimg.responsive-img,\nvideo.responsive-video {\n max-width: 100%;\n height: auto;\n}\n\n\n// Pagination\n\n.pagination {\n\n li {\n display: inline-block;\n border-radius: 2px;\n text-align: center;\n vertical-align: top;\n height: 30px;\n\n a {\n color: #444;\n display: inline-block;\n font-size: 1.2rem;\n padding: 0 10px;\n line-height: 30px;\n }\n\n &.active a { color: #fff; }\n\n &.active { background-color: $primary-color; }\n\n &.disabled a {\n cursor: default;\n color: #999;\n }\n\n i {\n font-size: 2rem;\n }\n }\n\n\n li.pages ul li {\n display: inline-block;\n float: none;\n }\n}\n@media #{$medium-and-down} {\n .pagination {\n width: 100%;\n\n li.prev,\n li.next {\n width: 10%;\n }\n\n li.pages {\n width: 80%;\n overflow: hidden;\n white-space: nowrap;\n }\n }\n}\n\n// Breadcrumbs\n.breadcrumb {\n font-size: 18px;\n color: rgba(255,255,255, .7);\n\n i,\n [class^=\"mdi-\"], [class*=\"mdi-\"],\n i.material-icons {\n display: inline-block;\n float: left;\n font-size: 24px;\n }\n\n &:before {\n content: '\\E5CC';\n color: rgba(255,255,255, .7);\n vertical-align: top;\n display: inline-block;\n font-family: 'Material Icons';\n font-weight: normal;\n font-style: normal;\n font-size: 25px;\n margin: 0 10px 0 8px;\n -webkit-font-smoothing: antialiased;\n }\n\n &:first-child:before {\n display: none;\n }\n\n &:last-child {\n color: #fff;\n }\n}\n\n// Parallax\n.parallax-container {\n position: relative;\n overflow: hidden;\n height: 500px;\n\n .parallax {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: -1;\n\n img {\n opacity: 0;\n position: absolute;\n left: 50%;\n bottom: 0;\n min-width: 100%;\n min-height: 100%;\n transform: translate3d(0,0,0);\n transform: translateX(-50%);\n }\n }\n}\n\n// Pushpin\n.pin-top, .pin-bottom {\n position: relative;\n}\n.pinned {\n position: fixed !important;\n}\n\n/*********************\n Transition Classes\n**********************/\n\nul.staggered-list li {\n opacity: 0;\n}\n\n.fade-in {\n opacity: 0;\n transform-origin: 0 50%;\n}\n\n\n/*********************\n Media Query Classes\n**********************/\n.hide-on-small-only, .hide-on-small-and-down {\n @media #{$small-and-down} {\n display: none !important;\n }\n}\n.hide-on-med-and-down {\n @media #{$medium-and-down} {\n display: none !important;\n }\n}\n.hide-on-med-and-up {\n @media #{$medium-and-up} {\n display: none !important;\n }\n}\n.hide-on-med-only {\n @media only screen and (min-width: $small-screen) and (max-width: $medium-screen) {\n display: none !important;\n }\n}\n.hide-on-large-only {\n @media #{$large-and-up} {\n display: none !important;\n }\n}\n.hide-on-extra-large-only {\n @media #{$extra-large-and-up} {\n display: none !important;\n }\n}\n.show-on-extra-large {\n @media #{$extra-large-and-up} {\n display: block !important;\n }\n}\n.show-on-large {\n @media #{$large-and-up} {\n display: block !important;\n }\n}\n.show-on-medium {\n @media only screen and (min-width: $small-screen) and (max-width: $medium-screen) {\n display: block !important;\n }\n}\n.show-on-small {\n @media #{$small-and-down} {\n display: block !important;\n }\n}\n.show-on-medium-and-up {\n @media #{$medium-and-up} {\n display: block !important;\n }\n}\n.show-on-medium-and-down {\n @media #{$medium-and-down} {\n display: block !important;\n }\n}\n\n\n// Center text on mobile\n.center-on-small-only {\n @media #{$small-and-down} {\n text-align: center;\n }\n}\n\n// Footer\n.page-footer {\n padding-top: 20px;\n color: $footer-font-color;\n background-color: $footer-bg-color;\n\n .footer-copyright {\n overflow: hidden;\n min-height: 50px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 10px 0px;\n color: $footer-copyright-font-color;\n background-color: $footer-copyright-bg-color;\n }\n}\n\n// Tables\ntable, th, td {\n border: none;\n}\n\ntable {\n width:100%;\n display: table;\n border-collapse: collapse;\n border-spacing: 0;\n\n &.striped {\n tr {\n border-bottom: none;\n }\n\n > tbody {\n > tr:nth-child(odd) {\n background-color: $table-striped-color;\n }\n\n > tr > td {\n border-radius: 0;\n }\n }\n }\n\n &.highlight > tbody > tr {\n transition: background-color .25s ease;\n &:hover {\n background-color: $table-striped-color;\n }\n }\n\n &.centered {\n thead tr th, tbody tr td {\n text-align: center;\n }\n }\n}\n\ntr {\n border-bottom: 1px solid $table-border-color;\n}\n\ntd, th{\n padding: 15px 5px;\n display: table-cell;\n text-align: left;\n vertical-align: middle;\n border-radius: 2px;\n}\n\n// Responsive Table\n@media #{$medium-and-down} {\n\n table.responsive-table {\n width: 100%;\n border-collapse: collapse;\n border-spacing: 0;\n display: block;\n position: relative;\n\n td:empty:before {\n content: '\\00a0';\n }\n\n th,\n td {\n margin: 0;\n vertical-align: top;\n }\n\n th { text-align: left; }\n thead {\n display: block;\n float: left;\n\n tr {\n display: block;\n padding: 0 10px 0 0;\n\n th::before {\n content: \"\\00a0\";\n }\n }\n }\n tbody {\n display: block;\n width: auto;\n position: relative;\n overflow-x: auto;\n white-space: nowrap;\n\n tr {\n display: inline-block;\n vertical-align: top;\n }\n }\n th {\n display: block;\n text-align: right;\n }\n td {\n display: block;\n min-height: 1.25em;\n text-align: left;\n }\n tr {\n border-bottom: none;\n padding: 0 10px;\n }\n\n /* sort out borders */\n thead {\n border: 0;\n border-right: 1px solid $table-border-color;\n }\n }\n\n}\n\n\n// Collections\n.collection {\n margin: $element-top-margin 0 $element-bottom-margin 0;\n border: 1px solid $collection-border-color;\n border-radius: 2px;\n overflow: hidden;\n position: relative;\n\n .collection-item {\n background-color: $collection-bg-color;\n line-height: $collection-line-height;\n padding: 10px 20px;\n margin: 0;\n border-bottom: 1px solid $collection-border-color;\n\n // Avatar Collection\n &.avatar {\n min-height: 84px;\n padding-left: 72px;\n position: relative;\n\n // Don't style circles inside preloader classes.\n &:not(.circle-clipper) > .circle,\n :not(.circle-clipper) > .circle {\n position: absolute;\n width: 42px;\n height: 42px;\n overflow: hidden;\n left: 15px;\n display: inline-block;\n vertical-align: middle;\n }\n i.circle {\n font-size: 18px;\n line-height: 42px;\n color: #fff;\n background-color: #999;\n text-align: center;\n }\n\n\n .title {\n font-size: 16px;\n }\n\n p {\n margin: 0;\n }\n\n .secondary-content {\n position: absolute;\n top: 16px;\n right: 16px;\n }\n\n }\n\n\n &:last-child {\n border-bottom: none;\n }\n\n &.active {\n background-color: $collection-active-bg-color;\n color: $collection-active-color;\n\n .secondary-content {\n color: #fff;\n }\n }\n }\n a.collection-item{\n display: block;\n transition: .25s;\n color: $collection-link-color;\n &:not(.active) {\n &:hover {\n background-color: $collection-hover-bg-color;\n }\n }\n }\n\n &.with-header {\n .collection-header {\n background-color: $collection-bg-color;\n border-bottom: 1px solid $collection-border-color;\n padding: 10px 20px;\n }\n .collection-item {\n padding-left: 30px;\n }\n .collection-item.avatar {\n padding-left: 72px;\n }\n }\n\n}\n// Made less specific to allow easier overriding\n.secondary-content {\n float: right;\n color: $secondary-color;\n}\n.collapsible .collection {\n margin: 0;\n border: none;\n}\n\n\n\n// Responsive Videos\n.video-container {\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n overflow: hidden;\n\n iframe, object, embed {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n}\n\n// Progress Bar\n.progress {\n position: relative;\n height: 4px;\n display: block;\n width: 100%;\n background-color: lighten($progress-bar-color, 40%);\n border-radius: 2px;\n margin: $element-top-margin 0 $element-bottom-margin 0;\n overflow: hidden;\n .determinate {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n background-color: $progress-bar-color;\n transition: width .3s linear;\n }\n .indeterminate {\n background-color: $progress-bar-color;\n &:before {\n content: '';\n position: absolute;\n background-color: inherit;\n top: 0;\n left:0;\n bottom: 0;\n will-change: left, right;\n // Custom bezier\n animation: indeterminate 2.1s cubic-bezier(0.650, 0.815, 0.735, 0.395) infinite;\n\n }\n &:after {\n content: '';\n position: absolute;\n background-color: inherit;\n top: 0;\n left:0;\n bottom: 0;\n will-change: left, right;\n // Custom bezier\n animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.840, 0.440, 1.000) infinite;\n animation-delay: 1.15s;\n }\n }\n}\n@keyframes indeterminate {\n 0% {\n left: -35%;\n right:100%;\n }\n 60% {\n left: 100%;\n right: -90%;\n }\n 100% {\n left: 100%;\n right: -90%;\n }\n}\n\n@keyframes indeterminate-short {\n 0% {\n left: -200%;\n right: 100%;\n }\n 60% {\n left: 107%;\n right: -8%;\n }\n 100% {\n left: 107%;\n right: -8%;\n }\n}\n\n\n/*******************\n Utility Classes\n*******************/\n\n.hide {\n display: none !important;\n}\n\n// Text Align\n.left-align {\n text-align: left;\n}\n.right-align {\n text-align: right\n}\n.center, .center-align {\n text-align: center;\n}\n\n.left {\n float: left !important;\n}\n.right {\n float: right !important;\n}\n\n// No Text Select\n.no-select {\n user-select: none;\n}\n\n.circle {\n border-radius: 50%;\n}\n\n.center-block {\n display: block;\n margin-left: auto;\n margin-right: auto;\n}\n\n.truncate {\n display: block;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.no-padding {\n padding: 0 !important;\n}\n","// ==========================================================================\n// Materialize variables\n// ==========================================================================\n//\n// Table of Contents:\n//\n// 1. Colors\n// 2. Badges\n// 3. Buttons\n// 4. Cards\n// 5. Carousel\n// 6. Collapsible\n// 7. Chips\n// 8. Date + Time Picker\n// 9. Dropdown\n// 10. Forms\n// 11. Global\n// 12. Grid\n// 13. Navigation Bar\n// 14. Side Navigation\n// 15. Photo Slider\n// 16. Spinners | Loaders\n// 17. Tabs\n// 18. Tables\n// 19. Toasts\n// 20. Typography\n// 21. Footer\n// 22. Flow Text\n// 23. Collections\n// 24. Progress Bar\n\n\n\n// 1. Colors\n// ==========================================================================\n\n$primary-color: #f8ef02 !default;\n$primary-color-light: lighten($primary-color, 15%) !default;\n$primary-color-dark: darken($primary-color, 15%) !default;\n\n$secondary-color: #ff003c !default;\n$success-color: #446d44 !default;\n$error-color: purple !default;\n$link-color: #136377 !default;\n\n\n// 2. Badges\n// ==========================================================================\n\n$badge-bg-color: $secondary-color !default;\n$badge-height: 22px !default;\n\n\n// 3. Buttons\n// ==========================================================================\n\n// Shared styles\n$button-border: none !default;\n$button-background-focus: lighten($secondary-color, 4%) !default;\n$button-font-size: 14px !default;\n$button-icon-font-size: 1.3rem !default;\n$button-height: 36px !default;\n$button-padding: 0 16px !default;\n$button-radius: 2px !default;\n\n// Disabled styles\n$button-disabled-background: #DFDFDF !default;\n$button-disabled-color: #9F9F9F !default;\n\n// Raised buttons\n$button-raised-background: $secondary-color !default;\n$button-raised-background-hover: lighten($button-raised-background, 5%) !default;\n$button-raised-color: #fff !default;\n\n// Large buttons\n$button-large-font-size: 15px !default;\n$button-large-icon-font-size: 1.6rem !default;\n$button-large-height: $button-height * 1.5 !default;\n$button-floating-large-size: 56px !default;\n\n// Small buttons\n$button-small-font-size: 13px !default;\n$button-small-icon-font-size: 1.2rem !default;\n$button-small-height: $button-height * .9 !default;\n$button-floating-small-size: $button-height * .9 !default;\n\n// Flat buttons\n$button-flat-color: #343434 !default;\n$button-flat-disabled-color: lighten(#999, 10%) !default;\n\n// Floating buttons\n$button-floating-background: $secondary-color !default;\n$button-floating-background-hover: $button-floating-background !default;\n$button-floating-color: #fff !default;\n$button-floating-size: 40px !default;\n$button-floating-radius: 50% !default;\n\n\n// 4. Cards\n// ==========================================================================\n\n$card-padding: 24px !default;\n$card-bg-color: #fff !default;\n$card-link-color: color(\"orange\", \"accent-2\") !default;\n$card-link-color-light: lighten($card-link-color, 20%) !default;\n\n\n// 5. Carousel\n// ==========================================================================\n\n$carousel-height: 400px !default;\n$carousel-item-height: $carousel-height / 2 !default;\n$carousel-item-width: $carousel-item-height !default;\n\n\n// 6. Collapsible\n// ==========================================================================\n\n$collapsible-height: 3rem !default;\n$collapsible-line-height: $collapsible-height !default;\n$collapsible-header-color: #fff !default;\n$collapsible-border-color: #ddd !default;\n\n\n// 7. Chips\n// ==========================================================================\n\n$chip-bg-color: #e4e4e4 !default;\n$chip-border-color: #9e9e9e !default;\n$chip-selected-color: #26a69a !default;\n$chip-margin: 5px !default;\n\n\n// 8. Date + Time Picker\n// ==========================================================================\n\n$datepicker-display-font-size: 2.8rem;\n$datepicker-calendar-header-color: #999;\n$datepicker-weekday-color: rgba(0, 0, 0, .87) !default;\n$datepicker-weekday-bg: darken($secondary-color, 7%) !default;\n$datepicker-date-bg: $secondary-color !default;\n$datepicker-year: rgba(255, 255, 255, .7) !default;\n$datepicker-focus: rgba(0,0,0, .05) !default;\n$datepicker-selected: $secondary-color !default;\n$datepicker-selected-outfocus: desaturate(lighten($secondary-color, 35%), 15%) !default;\n$datepicker-day-focus: transparentize(desaturate($secondary-color, 5%), .75) !default;\n$datepicker-disabled-day-color: rgba(0, 0, 0, .3) !default;\n\n$timepicker-clock-color: rgba(0, 0, 0, .87) !default;\n$timepicker-clock-plate-bg: #eee !default;\n\n\n// 9. Dropdown\n// ==========================================================================\n\n$dropdown-bg-color: #fff !default;\n$dropdown-hover-bg-color: #eee !default;\n$dropdown-color: $secondary-color !default;\n$dropdown-item-height: 50px !default;\n\n\n// 10. Forms\n// ==========================================================================\n\n// Text Inputs + Textarea\n$input-height: 3rem !default;\n$input-border-color: color(\"grey\", \"base\") !default;\n$input-border: 1px solid $input-border-color !default;\n$input-background: #fff !default;\n$input-error-color: $error-color !default;\n$input-success-color: $success-color !default;\n$input-focus-color: $secondary-color !default;\n$input-font-size: 16px !default;\n$input-margin-bottom: 8px;\n$input-margin: 0 0 $input-margin-bottom 0 !default;\n$input-padding: 0 !default;\n$label-font-size: .8rem !default;\n$input-disabled-color: rgba(0,0,0, .42) !default;\n$input-disabled-solid-color: #949494 !default;\n$input-disabled-border: 1px dotted $input-disabled-color !default;\n$input-invalid-border: 1px solid $input-error-color !default;\n$input-icon-size: 2rem;\n$placeholder-text-color: lighten($input-border-color, 20%) !default;\n\n// Radio Buttons\n$radio-fill-color: $secondary-color !default;\n$radio-empty-color: #5a5a5a !default;\n$radio-border: 2px solid $radio-fill-color !default;\n\n// Range\n$range-height: 14px !default;\n$range-width: 14px !default;\n$track-height: 3px !default;\n\n// Select\n$select-border: 1px solid #f2f2f2 !default;\n$select-background: rgba(255, 255, 255, 0.90) !default;\n$select-focus: 1px solid lighten($secondary-color, 47%) !default;\n$select-option-hover: rgba(0,0,0,.08) !default;\n$select-option-focus: rgba(0,0,0,.08) !default;\n$select-option-selected: rgba(0,0,0,.03) !default;\n$select-padding: 5px !default;\n$select-radius: 2px !default;\n$select-disabled-color: rgba(0,0,0,.3) !default;\n\n// Switches\n$switch-bg-color: $secondary-color !default;\n$switch-checked-lever-bg: desaturate(lighten($switch-bg-color, 25%), 25%) !default;\n$switch-unchecked-bg: #F1F1F1 !default;\n$switch-unchecked-lever-bg: rgba(0,0,0,.38) !default;\n$switch-radius: 15px !default;\n\n\n// 11. Global\n// ==========================================================================\n\n// Media Query Ranges\n$small-screen-up: 601px !default;\n$medium-screen-up: 993px !default;\n$large-screen-up: 1201px !default;\n$small-screen: 600px !default;\n$medium-screen: 992px !default;\n$large-screen: 1200px !default;\n\n$medium-and-up: \"only screen and (min-width : #{$small-screen-up})\" !default;\n$large-and-up: \"only screen and (min-width : #{$medium-screen-up})\" !default;\n$extra-large-and-up: \"only screen and (min-width : #{$large-screen-up})\" !default;\n$small-and-down: \"only screen and (max-width : #{$small-screen})\" !default;\n$medium-and-down: \"only screen and (max-width : #{$medium-screen})\" !default;\n$medium-only: \"only screen and (min-width : #{$small-screen-up}) and (max-width : #{$medium-screen})\" !default;\n\n\n// 12. Grid\n// ==========================================================================\n\n$num-cols: 12 !default;\n$gutter-width: 1.5rem !default;\n$element-top-margin: $gutter-width/3 !default;\n$element-bottom-margin: ($gutter-width*2)/3 !default;\n\n\n// 13. Navigation Bar\n// ==========================================================================\n\n$navbar-height: 64px !default;\n$navbar-line-height: $navbar-height !default;\n$navbar-height-mobile: 56px !default;\n$navbar-line-height-mobile: $navbar-height-mobile !default;\n$navbar-font-size: 1rem !default;\n$navbar-font-color: #fff !default;\n$navbar-brand-font-size: 2.1rem !default;\n\n// 14. Side Navigation\n// ==========================================================================\n\n$sidenav-width: 300px !default;\n$sidenav-font-size: 14px !default;\n$sidenav-font-color: rgba(0,0,0,.87) !default;\n$sidenav-bg-color: #fff !default;\n$sidenav-padding: 16px !default;\n$sidenav-item-height: 48px !default;\n$sidenav-line-height: $sidenav-item-height !default;\n\n\n// 15. Photo Slider\n// ==========================================================================\n\n$slider-bg-color: color('grey', 'base') !default;\n$slider-bg-color-light: color('grey', 'lighten-2') !default;\n$slider-indicator-color: color('green', 'base') !default;\n\n\n// 16. Spinners | Loaders\n// ==========================================================================\n\n$spinner-default-color: $secondary-color !default;\n\n\n// 17. Tabs\n// ==========================================================================\n\n$tabs-underline-color: $primary-color-light !default;\n$tabs-text-color: $primary-color !default;\n$tabs-bg-color: #fff !default;\n\n\n// 18. Tables\n// ==========================================================================\n\n$table-border-color: rgba(0,0,0,.12) !default;\n$table-striped-color: rgba(242, 242, 242, 0.5) !default;\n\n\n// 19. Toasts\n// ==========================================================================\n\n$toast-height: 48px !default;\n$toast-color: #323232 !default;\n$toast-text-color: #fff !default;\n$toast-action-color: #eeff41;\n\n\n// 20. Typography\n// ==========================================================================\n\n$font-stack: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Oxygen-Sans, Ubuntu, Cantarell, \"Helvetica Neue\", sans-serif !default;\n$off-black: rgba(0, 0, 0, 0.87) !default;\n// Header Styles\n$h1-fontsize: 4.2rem !default;\n$h2-fontsize: 3.56rem !default;\n$h3-fontsize: 2.92rem !default;\n$h4-fontsize: 2.28rem !default;\n$h5-fontsize: 1.64rem !default;\n$h6-fontsize: 1.15rem !default;\n\n\n// 21. Footer\n// ==========================================================================\n\n$footer-font-color: #fff !default;\n$footer-bg-color: $primary-color !default;\n$footer-copyright-font-color: rgba(255,255,255,.8) !default;\n$footer-copyright-bg-color: rgba(51,51,51,.08) !default;\n\n\n// 22. Flow Text\n// ==========================================================================\n\n$range : $large-screen - $small-screen !default;\n$intervals: 20 !default;\n$interval-size: $range / $intervals !default;\n\n\n// 23. Collections\n// ==========================================================================\n\n$collection-border-color: #e0e0e0 !default;\n$collection-bg-color: #fff !default;\n$collection-active-bg-color: $secondary-color !default;\n$collection-active-color: lighten($secondary-color, 55%) !default;\n$collection-hover-bg-color: #ddd !default;\n$collection-link-color: $secondary-color !default;\n$collection-line-height: 1.5rem !default;\n\n\n// 24. Progress Bar\n// ==========================================================================\n\n$progress-bar-color: $secondary-color !default;\n","// Badges\nspan.badge {\n min-width: 3rem;\n padding: 0 6px;\n margin-left: 14px;\n text-align: center;\n font-size: 1rem;\n line-height: $badge-height;\n height: $badge-height;\n color: color('grey', 'darken-1');\n float: right;\n box-sizing: border-box;\n\n &.new {\n font-weight: 300;\n font-size: 0.8rem;\n color: #fff;\n background-color: $badge-bg-color;\n border-radius: 2px;\n }\n &.new:after {\n content: \" new\";\n }\n\n &[data-badge-caption]::after {\n content: \" \" attr(data-badge-caption);\n }\n}\n\n// Special cases\nnav ul a span.badge {\n display: inline-block;\n float: none;\n margin-left: 4px;\n line-height: $badge-height;\n height: $badge-height;\n -webkit-font-smoothing: auto;\n}\n\n// Line height centering\n.collection-item span.badge {\n margin-top: calc(#{$collection-line-height / 2} - #{$badge-height / 2});\n}\n.collapsible span.badge {\n margin-left: auto;\n}\n.sidenav span.badge {\n margin-top: calc(#{$sidenav-line-height / 2} - #{$badge-height / 2});\n}\n\ntable span.badge {\n display: inline-block;\n float: none;\n margin-left: auto;\n}\n","/* This is needed for some mobile phones to display the Google Icon font properly */\r\n.material-icons {\r\n text-rendering: optimizeLegibility;\r\n font-feature-settings: 'liga';\r\n}\r\n",".container {\n margin: 0 auto;\n max-width: 1280px;\n width: 90%;\n}\n@media #{$medium-and-up} {\n .container {\n width: 85%;\n }\n}\n@media #{$large-and-up} {\n .container {\n width: 70%;\n }\n}\n.col .row {\n margin-left: (-1 * $gutter-width / 2);\n margin-right: (-1 * $gutter-width / 2);\n}\n\n.section {\n padding-top: 1rem;\n padding-bottom: 1rem;\n\n &.no-pad {\n padding: 0;\n }\n &.no-pad-bot {\n padding-bottom: 0;\n }\n &.no-pad-top {\n padding-top: 0;\n }\n}\n\n\n// Mixins to eliminate code repitition\n@mixin reset-offset {\n margin-left: auto;\n left: auto;\n right: auto;\n}\n@mixin grid-classes($size, $i, $perc) {\n &.offset-#{$size}#{$i} {\n margin-left: $perc;\n }\n &.pull-#{$size}#{$i} {\n right: $perc;\n }\n &.push-#{$size}#{$i} {\n left: $perc;\n }\n}\n\n\n.row {\n margin-left: auto;\n margin-right: auto;\n margin-bottom: 20px;\n\n // Clear floating children\n &:after {\n content: \"\";\n display: table;\n clear: both;\n }\n\n .col {\n float: left;\n box-sizing: border-box;\n padding: 0 $gutter-width / 2;\n min-height: 1px;\n\n &[class*=\"push-\"],\n &[class*=\"pull-\"] {\n position: relative;\n }\n\n $i: 1;\n @while $i <= $num-cols {\n $perc: unquote((100 / ($num-cols / $i)) + \"%\");\n &.s#{$i} {\n width: $perc;\n @include reset-offset;\n }\n $i: $i + 1;\n }\n\n $i: 1;\n @while $i <= $num-cols {\n $perc: unquote((100 / ($num-cols / $i)) + \"%\");\n @include grid-classes(\"s\", $i, $perc);\n $i: $i + 1;\n }\n\n @media #{$medium-and-up} {\n\n $i: 1;\n @while $i <= $num-cols {\n $perc: unquote((100 / ($num-cols / $i)) + \"%\");\n &.m#{$i} {\n width: $perc;\n @include reset-offset;\n }\n $i: $i + 1\n }\n\n $i: 1;\n @while $i <= $num-cols {\n $perc: unquote((100 / ($num-cols / $i)) + \"%\");\n @include grid-classes(\"m\", $i, $perc);\n $i: $i + 1;\n }\n }\n\n @media #{$large-and-up} {\n\n $i: 1;\n @while $i <= $num-cols {\n $perc: unquote((100 / ($num-cols / $i)) + \"%\");\n &.l#{$i} {\n width: $perc;\n @include reset-offset;\n }\n $i: $i + 1;\n }\n\n $i: 1;\n @while $i <= $num-cols {\n $perc: unquote((100 / ($num-cols / $i)) + \"%\");\n @include grid-classes(\"l\", $i, $perc);\n $i: $i + 1;\n }\n }\n\n @media #{$extra-large-and-up} {\n\n $i: 1;\n @while $i <= $num-cols {\n $perc: unquote((100 / ($num-cols / $i)) + \"%\");\n &.xl#{$i} {\n width: $perc;\n @include reset-offset;\n }\n $i: $i + 1;\n }\n\n $i: 1;\n @while $i <= $num-cols {\n $perc: unquote((100 / ($num-cols / $i)) + \"%\");\n @include grid-classes(\"xl\", $i, $perc);\n $i: $i + 1;\n }\n }\n }\n}\n","nav {\n &.nav-extended {\n height: auto;\n\n .nav-wrapper {\n min-height: $navbar-height-mobile;\n height: auto;\n }\n\n .nav-content {\n position: relative;\n line-height: normal;\n }\n }\n\n color: $navbar-font-color;\n @extend .z-depth-1;\n background-color: $primary-color;\n width: 100%;\n height: $navbar-height-mobile;\n line-height: $navbar-line-height-mobile;\n\n a { color: $navbar-font-color; }\n\n i,\n [class^=\"mdi-\"], [class*=\"mdi-\"],\n i.material-icons {\n display: block;\n font-size: 24px;\n height: $navbar-height-mobile;\n line-height: $navbar-line-height-mobile;\n }\n\n .nav-wrapper {\n position: relative;\n height: 100%;\n }\n\n @media #{$large-and-up} {\n a.sidenav-trigger { display: none; }\n }\n\n\n // Collapse button\n .sidenav-trigger {\n float: left;\n position: relative;\n z-index: 1;\n height: $navbar-height-mobile;\n margin: 0 18px;\n\n i {\n height: $navbar-height-mobile;\n line-height: $navbar-line-height-mobile;\n }\n }\n\n\n // Logo\n .brand-logo {\n position: absolute;\n color: $navbar-font-color;\n display: inline-block;\n font-size: $navbar-brand-font-size;\n padding: 0;\n\n &.center {\n left: 50%;\n transform: translateX(-50%);\n }\n\n @media #{$medium-and-down} {\n left: 50%;\n transform: translateX(-50%);\n\n &.left, &.right {\n padding: 0;\n transform: none;\n }\n\n &.left { left: 0.5rem; }\n &.right {\n right: 0.5rem;\n left: auto;\n }\n }\n\n &.right {\n right: 0.5rem;\n padding: 0;\n }\n\n i,\n [class^=\"mdi-\"], [class*=\"mdi-\"],\n i.material-icons {\n float: left;\n margin-right: 15px;\n }\n }\n\n\n // Title\n .nav-title {\n display: inline-block;\n font-size: 32px;\n padding: 28px 0;\n }\n\n\n // Navbar Links\n ul {\n margin: 0;\n\n li {\n transition: background-color .3s;\n float: left;\n padding: 0;\n\n &.active {\n background-color: rgba(0,0,0,.1);\n }\n }\n a {\n transition: background-color .3s;\n font-size: $navbar-font-size;\n color: $navbar-font-color;\n display: block;\n padding: 0 15px;\n cursor: pointer;\n\n &.btn, &.btn-large, &.btn-flat, &.btn-floating {\n margin-top: -2px;\n margin-left: 15px;\n margin-right: 15px;\n\n & > .material-icons {\n height: inherit;\n line-height: inherit;\n }\n }\n\n &:hover {\n background-color: rgba(0,0,0,.1);\n }\n }\n\n &.left {\n float: left;\n }\n }\n\n // Navbar Search Form\n form {\n height: 100%;\n }\n\n .input-field {\n margin: 0;\n height: 100%;\n\n input {\n height: 100%;\n font-size: 1.2rem;\n border: none;\n padding-left: 2rem;\n\n &:focus, &[type=text]:valid, &[type=password]:valid,\n &[type=email]:valid, &[type=url]:valid, &[type=date]:valid {\n border: none;\n box-shadow: none;\n }\n }\n\n label {\n top: 0;\n left: 0;\n\n i {\n color: rgba(255,255,255,.7);\n transition: color .3s;\n }\n &.active i { color: $navbar-font-color; }\n }\n }\n}\n\n// Fixed Navbar\n.navbar-fixed {\n position: relative;\n height: $navbar-height-mobile;\n z-index: 997;\n\n nav {\n position: fixed;\n }\n}\n@media #{$medium-and-up} {\n nav.nav-extended .nav-wrapper {\n min-height: $navbar-height;\n }\n nav, nav .nav-wrapper i, nav a.sidenav-trigger, nav a.sidenav-trigger i {\n height: $navbar-height;\n line-height: $navbar-line-height;\n }\n .navbar-fixed {\n height: $navbar-height;\n }\n}\n","\na {\n text-decoration: none;\n}\n\nhtml{\n line-height: 1.5;\n\n @media only screen and (min-width: 0) {\n font-size: 14px;\n }\n\n @media only screen and (min-width: $medium-screen) {\n font-size: 14.5px;\n }\n\n @media only screen and (min-width: $large-screen) {\n font-size: 15px;\n }\n\n font-family: $font-stack;\n font-weight: normal;\n color: $off-black;\n}\nh1, h2, h3, h4, h5, h6 {\n\tfont-weight: 400;\n\tline-height: 1.3;\n}\n\n// Header Styles\nh1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; }\nh1 { font-size: $h1-fontsize; line-height: 110%; margin: ($h1-fontsize / 1.5) 0 ($h1-fontsize / 2.5) 0;}\nh2 { font-size: $h2-fontsize; line-height: 110%; margin: ($h2-fontsize / 1.5) 0 ($h2-fontsize / 2.5) 0;}\nh3 { font-size: $h3-fontsize; line-height: 110%; margin: ($h3-fontsize / 1.5) 0 ($h3-fontsize / 2.5) 0;}\nh4 { font-size: $h4-fontsize; line-height: 110%; margin: ($h4-fontsize / 1.5) 0 ($h4-fontsize / 2.5) 0;}\nh5 { font-size: $h5-fontsize; line-height: 110%; margin: ($h5-fontsize / 1.5) 0 ($h5-fontsize / 2.5) 0;}\nh6 { font-size: $h6-fontsize; line-height: 110%; margin: ($h6-fontsize / 1.5) 0 ($h6-fontsize / 2.5) 0;}\n\n// Text Styles\nem { font-style: italic; }\nstrong { font-weight: 500; }\nsmall { font-size: 75%; }\n.light { font-weight: 300; }\n.thin { font-weight: 200; }\n\n\n.flow-text{\n $i: 0;\n @while $i <= $intervals {\n @media only screen and (min-width : 360 + ($i * $interval-size)) {\n font-size: 1.2rem * (1 + (.02 * $i));\n }\n $i: $i + 1;\n }\n\n // Handle below 360px screen\n @media only screen and (max-width: 360px) {\n font-size: 1.2rem;\n }\n}\n","// Scale transition\r\n.scale-transition {\r\n &.scale-out {\r\n transform: scale(0);\r\n transition: transform .2s !important;\r\n }\r\n\r\n &.scale-in {\r\n transform: scale(1);\r\n }\r\n\r\n transition: transform .3s cubic-bezier(0.53, 0.01, 0.36, 1.63) !important;\r\n}","\n\n.card-panel {\n transition: box-shadow .25s;\n padding: $card-padding;\n margin: $element-top-margin 0 $element-bottom-margin 0;\n border-radius: 2px;\n @extend .z-depth-1;\n background-color: $card-bg-color;\n}\n\n.card {\n position: relative;\n margin: $element-top-margin 0 $element-bottom-margin 0;\n background-color: $card-bg-color;\n transition: box-shadow .25s;\n border-radius: 2px;\n @extend .z-depth-1;\n\n\n .card-title {\n font-size: 24px;\n font-weight: 300;\n &.activator {\n cursor: pointer;\n }\n }\n\n // Card Sizes\n &.small, &.medium, &.large {\n position: relative;\n\n .card-image {\n max-height: 60%;\n overflow: hidden;\n }\n .card-image + .card-content {\n max-height: 40%;\n }\n .card-content {\n max-height: 100%;\n overflow: hidden;\n }\n .card-action {\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n }\n }\n\n &.small {\n height: 300px;\n }\n\n &.medium {\n height: 400px;\n }\n\n &.large {\n height: 500px;\n }\n\n // Horizontal Cards\n &.horizontal {\n &.small, &.medium, &.large {\n .card-image {\n height: 100%;\n max-height: none;\n overflow: visible;\n\n img {\n height: 100%;\n }\n }\n }\n\n display: flex;\n\n .card-image {\n max-width: 50%;\n img {\n border-radius: 2px 0 0 2px;\n max-width: 100%;\n width: auto;\n }\n }\n\n .card-stacked {\n display: flex;\n flex-direction: column;\n flex: 1;\n position: relative;\n\n .card-content {\n flex-grow: 1;\n }\n }\n }\n\n // Sticky Action Section\n &.sticky-action {\n .card-action {\n z-index: 2;\n }\n\n .card-reveal {\n z-index: 1;\n padding-bottom: 64px;\n }\n }\n\n\n\n\n .card-image {\n position: relative;\n\n // Image background for content\n img {\n display: block;\n border-radius: 2px 2px 0 0;\n position: relative;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n width: 100%;\n }\n\n .card-title {\n color: $card-bg-color;\n position: absolute;\n bottom: 0;\n left: 0;\n max-width: 100%;\n padding: $card-padding;\n }\n }\n\n .card-content {\n padding: $card-padding;\n border-radius: 0 0 2px 2px;\n\n p {\n margin: 0;\n }\n .card-title {\n display: block;\n line-height: 32px;\n margin-bottom: 8px;\n\n i {\n line-height: 32px;\n }\n }\n }\n\n .card-action {\n &:last-child {\n border-radius: 0 0 2px 2px;\n }\n background-color: inherit; // Use inherit to inherit color classes\n border-top: 1px solid rgba(160,160,160,.2);\n position: relative;\n padding: 16px $card-padding;\n\n a:not(.btn):not(.btn-large):not(.btn-floating) {\n color: $card-link-color;\n margin-right: $card-padding;\n transition: color .3s ease;\n text-transform: uppercase;\n\n &:hover { color: $card-link-color-light; }\n }\n }\n\n .card-reveal {\n padding: $card-padding;\n position: absolute;\n background-color: $card-bg-color;\n width: 100%;\n overflow-y: auto;\n left: 0;\n top: 100%;\n height: 100%;\n z-index: 3;\n display: none;\n\n .card-title {\n cursor: pointer;\n display: block;\n }\n }\n}\n","#toast-container {\n display:block;\n position: fixed;\n z-index: 10000;\n\n @media #{$small-and-down} {\n min-width: 100%;\n bottom: 0%;\n }\n @media #{$medium-only} {\n left: 5%;\n bottom: 7%;\n max-width: 90%;\n }\n @media #{$large-and-up} {\n top: 10%;\n right: 7%;\n max-width: 86%;\n }\n}\n\n.toast {\n @extend .z-depth-1;\n border-radius: 2px;\n top: 35px;\n width: auto;\n margin-top: 10px;\n position: relative;\n max-width:100%;\n height: auto;\n min-height: $toast-height;\n line-height: 1.5em;\n background-color: $toast-color;\n padding: 10px 25px;\n font-size: 1.1rem;\n font-weight: 300;\n color: $toast-text-color;\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: default;\n\n .toast-action {\n color: $toast-action-color;\n font-weight: 500;\n margin-right: -25px;\n margin-left: 3rem;\n }\n\n &.rounded{\n border-radius: 24px;\n }\n\n @media #{$small-and-down} {\n width: 100%;\n border-radius: 0;\n }\n}\n",".tabs {\n &.tabs-transparent {\n background-color: transparent;\n\n .tab a,\n .tab.disabled a,\n .tab.disabled a:hover {\n color: rgba(255,255,255,0.7);\n }\n\n .tab a:hover,\n .tab a.active {\n color: #fff;\n }\n\n .indicator {\n background-color: #fff;\n }\n }\n\n &.tabs-fixed-width {\n display: flex;\n\n .tab {\n flex-grow: 1;\n }\n }\n\n position: relative;\n overflow-x: auto;\n overflow-y: hidden;\n height: 48px;\n width: 100%;\n background-color: $tabs-bg-color;\n margin: 0 auto;\n white-space: nowrap;\n\n .tab {\n display: inline-block;\n text-align: center;\n line-height: 48px;\n height: 48px;\n padding: 0;\n margin: 0;\n text-transform: uppercase;\n\n a {\n &:focus,\n &:focus.active {\n background-color: transparentize($tabs-underline-color, .8);\n outline: none;\n }\n\n &:hover,\n &.active {\n background-color: transparent;\n color: $tabs-text-color;\n }\n\n color: rgba($tabs-text-color, .7);\n display: block;\n width: 100%;\n height: 100%;\n padding: 0 24px;\n font-size: 14px;\n text-overflow: ellipsis;\n overflow: hidden;\n transition: color .28s ease, background-color .28s ease;\n }\n\n &.disabled a,\n &.disabled a:hover {\n color: rgba($tabs-text-color, .4);\n cursor: default;\n }\n }\n .indicator {\n position: absolute;\n bottom: 0;\n height: 2px;\n background-color: $tabs-underline-color;\n will-change: left, right;\n }\n}\n\n// Fixed Sidenav hide on smaller\n@media #{$medium-and-down} {\n .tabs {\n display: flex;\n\n .tab {\n flex-grow: 1;\n\n a {\n padding: 0 12px;\n }\n }\n }\n}\n",".material-tooltip {\n padding: 10px 8px;\n font-size: 1rem;\n z-index: 2000;\n background-color: transparent;\n border-radius: 2px;\n color: #fff;\n min-height: 36px;\n line-height: 120%;\n opacity: 0;\n position: absolute;\n text-align: center;\n max-width: calc(100% - 4px);\n overflow: hidden;\n left: 0;\n top: 0;\n pointer-events: none;\n visibility: hidden;\n background-color: #323232;\n}\n\n.backdrop {\n position: absolute;\n opacity: 0;\n height: 7px;\n width: 14px;\n border-radius: 0 0 50% 50%;\n background-color: #323232;\n z-index: -1;\n transform-origin: 50% 0%;\n visibility: hidden;\n}\n","// shared styles\n.btn,\n.btn-flat {\n border: $button-border;\n border-radius: $button-radius;\n display: inline-block;\n height: $button-height;\n line-height: $button-height;\n padding: $button-padding;\n text-transform: uppercase;\n vertical-align: middle;\n -webkit-tap-highlight-color: transparent; // Gets rid of tap active state\n}\n\n// Disabled shared style\n.btn.disabled,\n.btn-floating.disabled,\n.btn-large.disabled,\n.btn-small.disabled,\n.btn-flat.disabled,\n.btn:disabled,\n.btn-floating:disabled,\n.btn-large:disabled,\n.btn-small:disabled,\n.btn-flat:disabled,\n.btn[disabled],\n.btn-floating[disabled],\n.btn-large[disabled],\n.btn-small[disabled],\n.btn-flat[disabled] {\n pointer-events: none;\n background-color: $button-disabled-background !important;\n box-shadow: none;\n color: $button-disabled-color !important;\n cursor: default;\n &:hover {\n background-color: $button-disabled-background !important;\n color: $button-disabled-color !important;\n }\n}\n\n// Shared icon styles\n.btn,\n.btn-floating,\n.btn-large,\n.btn-small,\n.btn-flat {\n font-size: $button-font-size;\n outline: 0;\n i {\n font-size: $button-icon-font-size;\n line-height: inherit;\n }\n}\n\n// Shared focus button style\n.btn,\n.btn-floating {\n &:focus {\n background-color: darken($button-raised-background, 10%);\n }\n}\n\n// Raised Button\n.btn {\n text-decoration: none;\n color: $button-raised-color;\n background-color: $button-raised-background;\n text-align: center;\n letter-spacing: .5px;\n @extend .z-depth-1;\n transition: background-color .2s ease-out;\n cursor: pointer;\n &:hover {\n background-color: $button-raised-background-hover;\n @extend .z-depth-1-half;\n }\n}\n\n// Floating button\n.btn-floating {\n &:hover {\n background-color: $button-floating-background-hover;\n @extend .z-depth-1-half;\n }\n &:before {\n border-radius: 0;\n }\n &.btn-large {\n &.halfway-fab {\n bottom: -$button-floating-large-size / 2;\n }\n width: $button-floating-large-size;\n height: $button-floating-large-size;\n padding: 0;\n i {\n line-height: $button-floating-large-size;\n }\n }\n\n &.btn-small {\n &.halfway-fab {\n bottom: -$button-floating-small-size / 2;\n }\n width: $button-floating-small-size;\n height: $button-floating-small-size;\n i {\n line-height: $button-floating-small-size;\n }\n }\n\n &.halfway-fab {\n &.left {\n right: auto;\n left: 24px;\n }\n position: absolute;\n right: 24px;\n bottom: -$button-floating-size / 2;\n }\n display: inline-block;\n color: $button-floating-color;\n position: relative;\n overflow: hidden;\n z-index: 1;\n width: $button-floating-size;\n height: $button-floating-size;\n line-height: $button-floating-size;\n padding: 0;\n background-color: $button-floating-background;\n border-radius: $button-floating-radius;\n @extend .z-depth-1;\n transition: background-color .3s;\n cursor: pointer;\n vertical-align: middle;\n i {\n width: inherit;\n display: inline-block;\n text-align: center;\n color: $button-floating-color;\n font-size: $button-large-icon-font-size;\n line-height: $button-floating-size;\n }\n}\n\n// button fix\nbutton.btn-floating {\n border: $button-border;\n}\n\n// Fixed Action Button\n.fixed-action-btn {\n &.active {\n ul {\n visibility: visible;\n }\n }\n\n // Directions\n &.direction-left,\n &.direction-right {\n padding: 0 0 0 15px;\n ul {\n text-align: right;\n right: 64px;\n top: 50%;\n transform: translateY(-50%);\n height: 100%;\n left: auto;\n /*width 100% only goes to width of button container */\n width: 500px;\n li {\n display: inline-block;\n margin: 7.5px 15px 0 0;\n }\n }\n }\n &.direction-right {\n padding: 0 15px 0 0;\n ul {\n text-align: left;\n direction: rtl;\n left: 64px;\n right: auto;\n li {\n margin: 7.5px 0 0 15px;\n }\n }\n }\n &.direction-bottom {\n padding: 0 0 15px 0;\n ul {\n top: 64px;\n bottom: auto;\n display: flex;\n flex-direction: column-reverse;\n li {\n margin: 15px 0 0 0;\n }\n }\n }\n &.toolbar {\n &.active {\n &>a i {\n opacity: 0;\n }\n }\n padding: 0;\n height: $button-floating-large-size;\n ul {\n display: flex;\n top: 0;\n bottom: 0;\n z-index: 1;\n li {\n flex: 1;\n display: inline-block;\n margin: 0;\n height: 100%;\n transition: none;\n a {\n display: block;\n overflow: hidden;\n position: relative;\n width: 100%;\n height: 100%;\n background-color: transparent;\n box-shadow: none;\n color: #fff;\n line-height: $button-floating-large-size;\n z-index: 1;\n i {\n line-height: inherit;\n }\n }\n }\n }\n }\n position: fixed;\n right: 23px;\n bottom: 23px;\n padding-top: 15px;\n margin-bottom: 0;\n z-index: 997;\n ul {\n left: 0;\n right: 0;\n text-align: center;\n position: absolute;\n bottom: 64px;\n margin: 0;\n visibility: hidden;\n li {\n margin-bottom: 15px;\n }\n a.btn-floating {\n opacity: 0;\n }\n }\n .fab-backdrop {\n position: absolute;\n top: 0;\n left: 0;\n z-index: -1;\n width: $button-floating-size;\n height: $button-floating-size;\n background-color: $button-floating-background;\n border-radius: $button-floating-radius;\n transform: scale(0);\n }\n}\n\n// Flat button\n.btn-flat {\n box-shadow: none;\n background-color: transparent;\n color: $button-flat-color;\n cursor: pointer;\n transition: background-color .2s;\n &:focus,\n &:hover {\n box-shadow: none;\n }\n &:focus {\n background-color: rgba(0, 0, 0, .1);\n }\n &.disabled,\n &.btn-flat[disabled] {\n background-color: transparent !important;\n color: $button-flat-disabled-color !important;\n cursor: default;\n }\n}\n\n// Large button\n.btn-large {\n @extend .btn;\n height: $button-large-height;\n line-height: $button-large-height;\n font-size: $button-large-font-size;\n padding: 0 28px;\n\n i {\n font-size: $button-large-icon-font-size;\n }\n}\n\n// Small button\n.btn-small {\n @extend .btn;\n height: $button-small-height;\n line-height: $button-small-height;\n font-size: $button-small-font-size;\n i {\n font-size: $button-small-icon-font-size;\n }\n}\n\n// Block button\n.btn-block {\n display: block;\n}\n",".dropdown-content {\n &:focus {\n outline: 0;\n }\n\n\n @extend .z-depth-1;\n background-color: $dropdown-bg-color;\n margin: 0;\n display: none;\n min-width: 100px;\n overflow-y: auto;\n opacity: 0;\n position: absolute;\n left: 0;\n top: 0;\n z-index: 9999; // TODO: Check if this doesn't break other things\n transform-origin: 0 0;\n\n\n li {\n &:hover, &.active {\n background-color: $dropdown-hover-bg-color;\n }\n\n &:focus {\n outline: none;\n }\n\n &.divider {\n min-height: 0;\n height: 1px;\n }\n\n & > a, & > span {\n font-size: 16px;\n color: $dropdown-color;\n display: block;\n line-height: 22px;\n padding: (($dropdown-item-height - 22) / 2) 16px;\n }\n\n & > span > label {\n top: 1px;\n left: 0;\n height: 18px;\n }\n\n // Icon alignment override\n & > a > i {\n height: inherit;\n line-height: inherit;\n float: left;\n margin: 0 24px 0 0;\n width: 24px;\n }\n\n\n clear: both;\n color: $off-black;\n cursor: pointer;\n min-height: $dropdown-item-height;\n line-height: 1.5rem;\n width: 100%;\n text-align: left;\n }\n}\n\nbody.keyboard-focused {\n .dropdown-content li:focus {\n background-color: darken($dropdown-hover-bg-color, 8%);\n }\n}\n\n// Input field specificity bugfix\n.input-field.col .dropdown-content [type=\"checkbox\"] + label {\n top: 1px;\n left: 0;\n height: 18px;\n transform: none;\n}\n\n.dropdown-trigger {\n cursor: pointer;\n}","\r\n/*!\r\n * Waves v0.6.0\r\n * http://fian.my.id/Waves\r\n *\r\n * Copyright 2014 Alfiana E. Sibuea and other contributors\r\n * Released under the MIT license\r\n * https://github.com/fians/Waves/blob/master/LICENSE\r\n */\r\n\r\n\r\n.waves-effect {\r\n position: relative;\r\n cursor: pointer;\r\n display: inline-block;\r\n overflow: hidden;\r\n user-select: none;\r\n -webkit-tap-highlight-color: transparent;\r\n vertical-align: middle;\r\n z-index: 1;\r\n transition: .3s ease-out;\r\n\r\n .waves-ripple {\r\n position: absolute;\r\n border-radius: 50%;\r\n width: 20px;\r\n height: 20px;\r\n margin-top:-10px;\r\n margin-left:-10px;\r\n opacity: 0;\r\n\r\n background: rgba(0,0,0,0.2);\r\n transition: all 0.7s ease-out;\r\n transition-property: transform, opacity;\r\n transform: scale(0);\r\n pointer-events: none;\r\n }\r\n\r\n // Waves Colors\r\n &.waves-light .waves-ripple {\r\n background-color: rgba(255, 255, 255, 0.45);\r\n }\r\n &.waves-red .waves-ripple {\r\n background-color: rgba(244, 67, 54, .70);\r\n }\r\n &.waves-yellow .waves-ripple {\r\n background-color: rgba(255, 235, 59, .70);\r\n }\r\n &.waves-orange .waves-ripple {\r\n background-color: rgba(255, 152, 0, .70);\r\n }\r\n &.waves-purple .waves-ripple {\r\n background-color: rgba(156, 39, 176, 0.70);\r\n }\r\n &.waves-green .waves-ripple {\r\n background-color: rgba(76, 175, 80, 0.70);\r\n }\r\n &.waves-teal .waves-ripple {\r\n background-color: rgba(0, 150, 136, 0.70);\r\n }\r\n\r\n // Style input button bug.\r\n input[type=\"button\"], input[type=\"reset\"], input[type=\"submit\"] {\r\n border: 0;\r\n font-style: normal;\r\n font-size: inherit;\r\n text-transform: inherit;\r\n background: none;\r\n }\r\n\r\n img {\r\n position: relative;\r\n z-index: -1;\r\n }\r\n}\r\n\r\n.waves-notransition {\r\n transition: none #{\"!important\"};\r\n}\r\n\r\n.waves-circle {\r\n transform: translateZ(0);\r\n -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);\r\n}\r\n\r\n.waves-input-wrapper {\r\n border-radius: 0.2em;\r\n vertical-align: bottom;\r\n\r\n .waves-button-input {\r\n position: relative;\r\n top: 0;\r\n left: 0;\r\n z-index: 1;\r\n }\r\n}\r\n\r\n.waves-circle {\r\n text-align: center;\r\n width: 2.5em;\r\n height: 2.5em;\r\n line-height: 2.5em;\r\n border-radius: 50%;\r\n -webkit-mask-image: none;\r\n}\r\n\r\n.waves-block {\r\n display: block;\r\n}\r\n\r\n/* Firefox Bug: link not triggered */\r\n.waves-effect .waves-ripple {\r\n z-index: -1;\r\n}",".modal {\n &:focus {\n outline: none;\n }\n\n @extend .z-depth-5;\n\n display: none;\n position: fixed;\n left: 0;\n right: 0;\n background-color: #fafafa;\n padding: 0;\n max-height: 70%;\n width: 55%;\n margin: auto;\n overflow-y: auto;\n\n border-radius: 2px;\n will-change: top, opacity;\n\n @media #{$medium-and-down} {\n width: 80%;\n }\n\n h1,h2,h3,h4 {\n margin-top: 0;\n }\n\n .modal-content {\n padding: 24px;\n }\n .modal-close {\n cursor: pointer;\n }\n\n .modal-footer {\n border-radius: 0 0 2px 2px;\n background-color: #fafafa;\n padding: 4px 6px;\n height: 56px;\n width: 100%;\n text-align: right;\n\n .btn, .btn-flat {\n margin: 6px 0;\n }\n }\n}\n.modal-overlay {\n position: fixed;\n z-index: 999;\n top: -25%;\n left: 0;\n bottom: 0;\n right: 0;\n height: 125%;\n width: 100%;\n background: #000;\n display: none;\n\n will-change: opacity;\n}\n\n// Modal with fixed action footer\n.modal.modal-fixed-footer {\n padding: 0;\n height: 70%;\n\n .modal-content {\n position: absolute;\n height: calc(100% - 56px);\n max-height: 100%;\n width: 100%;\n overflow-y: auto;\n }\n\n .modal-footer {\n border-top: 1px solid rgba(0,0,0,.1);\n position: absolute;\n bottom: 0;\n }\n}\n\n// Modal Bottom Sheet Style\n.modal.bottom-sheet {\n top: auto;\n bottom: -100%;\n margin: 0;\n width: 100%;\n max-height: 45%;\n border-radius: 0;\n will-change: bottom, opacity;\n}\n",".collapsible {\n border-top: 1px solid $collapsible-border-color;\n border-right: 1px solid $collapsible-border-color;\n border-left: 1px solid $collapsible-border-color;\n margin: $element-top-margin 0 $element-bottom-margin 0;\n @extend .z-depth-1;\n}\n\n.collapsible-header {\n &:focus {\n outline: 0\n }\n\n display: flex;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n line-height: 1.5;\n padding: 1rem;\n background-color: $collapsible-header-color;\n border-bottom: 1px solid $collapsible-border-color;\n\n i {\n width: 2rem;\n font-size: 1.6rem;\n display: inline-block;\n text-align: center;\n margin-right: 1rem;\n }\n}\n.keyboard-focused .collapsible-header:focus {\n background-color: #eee;\n}\n\n.collapsible-body {\n display: none;\n border-bottom: 1px solid $collapsible-border-color;\n box-sizing: border-box;\n padding: 2rem;\n}\n\n// Sidenav collapsible styling\n.sidenav,\n.sidenav.fixed {\n\n .collapsible {\n border: none;\n box-shadow: none;\n\n li { padding: 0; }\n }\n\n .collapsible-header {\n background-color: transparent;\n border: none;\n line-height: inherit;\n height: inherit;\n padding: 0 $sidenav-padding;\n\n &:hover { background-color: rgba(0,0,0,.05); }\n i { line-height: inherit; }\n }\n\n .collapsible-body {\n border: 0;\n background-color: $collapsible-header-color;\n\n li a {\n padding: 0 (7.5px + $sidenav-padding)\n 0 (15px + $sidenav-padding);\n }\n }\n\n}\n\n// Popout Collapsible\n\n.collapsible.popout {\n border: none;\n box-shadow: none;\n > li {\n box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);\n // transform: scaleX(.92);\n margin: 0 24px;\n transition: margin .35s cubic-bezier(0.250, 0.460, 0.450, 0.940);\n }\n > li.active {\n box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);\n margin: 16px 0;\n // transform: scaleX(1);\n }\n}\n",".chip {\n &:focus {\n outline: none;\n background-color: $chip-selected-color;\n color: #fff;\n }\n\n display: inline-block;\n height: 32px;\n font-size: 13px;\n font-weight: 500;\n color: rgba(0,0,0,.6);\n line-height: 32px;\n padding: 0 12px;\n border-radius: 16px;\n background-color: $chip-bg-color;\n margin-bottom: $chip-margin;\n margin-right: $chip-margin;\n\n > img {\n float: left;\n margin: 0 8px 0 -12px;\n height: 32px;\n width: 32px;\n border-radius: 50%;\n }\n\n .close {\n cursor: pointer;\n float: right;\n font-size: 16px;\n line-height: 32px;\n padding-left: 8px;\n }\n}\n\n.chips {\n border: none;\n border-bottom: 1px solid $chip-border-color;\n box-shadow: none;\n margin: $input-margin;\n min-height: 45px;\n outline: none;\n transition: all .3s;\n\n &.focus {\n border-bottom: 1px solid $chip-selected-color;\n box-shadow: 0 1px 0 0 $chip-selected-color;\n }\n\n &:hover {\n cursor: text;\n }\n\n .input {\n background: none;\n border: 0;\n color: rgba(0,0,0,.6);\n display: inline-block;\n font-size: $input-font-size;\n height: $input-height;\n line-height: 32px;\n outline: 0;\n margin: 0;\n padding: 0 !important;\n width: 120px !important;\n }\n\n .input:focus {\n border: 0 !important;\n box-shadow: none !important;\n }\n\n // Autocomplete\n .autocomplete-content {\n margin-top: 0;\n margin-bottom: 0;\n }\n}\n\n// Form prefix\n.prefix ~ .chips {\n margin-left: 3rem;\n width: 92%;\n width: calc(100% - 3rem);\n}\n.chips:empty ~ label {\n font-size: 0.8rem;\n transform: translateY(-140%);\n}\n",".materialboxed {\r\n &:hover {\r\n &:not(.active) {\r\n opacity: .8;\r\n }\r\n }\r\n\r\n display: block;\r\n cursor: zoom-in;\r\n position: relative;\r\n transition: opacity .4s;\r\n -webkit-backface-visibility: hidden;\r\n\r\n &.active {\r\n cursor: zoom-out;\r\n }\r\n}\r\n\r\n#materialbox-overlay {\r\n position:fixed;\r\n top: 0;\r\n right: 0;\r\n bottom: 0;\r\n left: 0;\r\n background-color: #292929;\r\n z-index: 1000;\r\n will-change: opacity;\r\n}\r\n\r\n.materialbox-caption {\r\n position: fixed;\r\n display: none;\r\n color: #fff;\r\n line-height: 50px;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n text-align: center;\r\n padding: 0% 15%;\r\n height: 50px;\r\n z-index: 1000;\r\n -webkit-font-smoothing: antialiased;\r\n}","// Remove Focus Boxes\r\nselect:focus {\r\n outline: $select-focus;\r\n}\r\n\r\nbutton:focus {\r\n outline: none;\r\n background-color: $button-background-focus;\r\n}\r\n\r\nlabel {\r\n font-size: $label-font-size;\r\n color: $input-border-color;\r\n}\r\n\r\n@import 'input-fields';\r\n@import 'radio-buttons';\r\n@import 'checkboxes';\r\n@import 'switches';\r\n@import 'select';\r\n@import 'file-input';\r\n@import 'range';\r\n","/* Text Inputs + Textarea\n ========================================================================== */\n\n/* Style Placeholders */\n\n::placeholder {\n color: $placeholder-text-color;\n}\n\n/* Text inputs */\n\ninput:not([type]),\ninput[type=text]:not(.browser-default),\ninput[type=password]:not(.browser-default),\ninput[type=email]:not(.browser-default),\ninput[type=url]:not(.browser-default),\ninput[type=time]:not(.browser-default),\ninput[type=date]:not(.browser-default),\ninput[type=datetime]:not(.browser-default),\ninput[type=datetime-local]:not(.browser-default),\ninput[type=tel]:not(.browser-default),\ninput[type=number]:not(.browser-default),\ninput[type=search]:not(.browser-default),\ntextarea.materialize-textarea {\n\n // General Styles\n background-color: transparent;\n border: none;\n border-bottom: $input-border;\n border-radius: 0;\n outline: none;\n height: $input-height;\n width: 100%;\n font-size: $input-font-size;\n margin: $input-margin;\n padding: $input-padding;\n box-shadow: none;\n box-sizing: content-box;\n transition: box-shadow .3s, border .3s;\n\n // Disabled input style\n &:disabled,\n &[readonly=\"readonly\"] {\n color: $input-disabled-color;\n border-bottom: $input-disabled-border;\n }\n\n // Disabled label style\n &:disabled+label,\n &[readonly=\"readonly\"]+label {\n color: $input-disabled-color;\n }\n\n // Focused input style\n &:focus:not([readonly]) {\n border-bottom: 1px solid $input-focus-color;\n box-shadow: 0 1px 0 0 $input-focus-color;\n }\n\n // Focused label style\n &:focus:not([readonly])+label {\n color: $input-focus-color;\n }\n\n // Hide helper text on data message\n &.valid ~ .helper-text[data-success],\n &:focus.valid ~ .helper-text[data-success],\n &.invalid ~ .helper-text[data-error],\n &:focus.invalid ~ .helper-text[data-error] {\n @extend %hidden-text;\n }\n\n // Valid Input Style\n &.valid,\n &:focus.valid {\n @extend %valid-input-style;\n }\n\n // Custom Success Message\n &.valid ~ .helper-text:after,\n &:focus.valid ~ .helper-text:after {\n @extend %custom-success-message;\n }\n &:focus.valid ~ label {\n color: $input-success-color;\n }\n\n // Invalid Input Style\n &.invalid,\n &:focus.invalid {\n @extend %invalid-input-style;\n }\n\n // Custom Error message\n &.invalid ~ .helper-text:after,\n &:focus.invalid ~ .helper-text:after {\n @extend %custom-error-message;\n }\n &:focus.invalid ~ label {\n color: $input-error-color;\n }\n\n // Full width label when using validate for error messages\n &.validate + label {\n width: 100%;\n }\n\n // Form Message Shared Styles\n & + label:after {\n @extend %input-after-style;\n }\n}\n\n\n/* Validation Sass Placeholders */\n%valid-input-style {\n border-bottom: 1px solid $input-success-color;\n box-shadow: 0 1px 0 0 $input-success-color;\n}\n%invalid-input-style {\n border-bottom: $input-invalid-border;\n box-shadow: 0 1px 0 0 $input-error-color;\n}\n%hidden-text {\n color: transparent;\n user-select: none;\n pointer-events: none;\n}\n%custom-success-message {\n content: attr(data-success);\n color: $input-success-color;\n}\n%custom-error-message {\n content: attr(data-error);\n color: $input-error-color;\n}\n%input-after-style {\n display: block;\n content: \"\";\n position: absolute;\n top: 100%;\n left: 0;\n opacity: 0;\n transition: .2s opacity ease-out, .2s color ease-out;\n}\n\n\n// Styling for input field wrapper\n.input-field {\n // Inline styles\n &.inline {\n display: inline-block;\n vertical-align: middle;\n margin-left: 5px;\n\n input,\n .select-dropdown {\n margin-bottom: 1rem;\n }\n }\n\n // Gutter spacing\n &.col {\n label {\n left: $gutter-width / 2;\n }\n\n .prefix ~ label,\n .prefix ~ .validate ~ label {\n width: calc(100% - 3rem - #{$gutter-width});\n }\n }\n\n position: relative;\n margin-top: 1rem;\n margin-bottom: 1rem;\n\n & > label {\n color: $input-border-color;\n position: absolute;\n top: 0;\n left: 0;\n font-size: 1rem;\n cursor: text;\n transition: transform .2s ease-out, color .2s ease-out;\n transform-origin: 0% 100%;\n text-align: initial;\n transform: translateY(12px);\n\n &:not(.label-icon).active {\n transform: translateY(-14px) scale(.8);\n transform-origin: 0 0;\n }\n }\n\n // Autofill + date + time inputs\n & > input[type]:-webkit-autofill:not(.browser-default):not([type=\"search\"]) + label,\n & > input[type=date]:not(.browser-default) + label,\n & > input[type=time]:not(.browser-default) + label {\n transform: translateY(-14px) scale(.8);\n transform-origin: 0 0;\n }\n\n .helper-text {\n &::after {\n opacity: 1;\n position: absolute;\n top: 0;\n left: 0;\n }\n\n position: relative;\n min-height: 18px;\n display: block;\n font-size: 12px;\n color: rgba(0,0,0,.54);\n }\n\n // Prefix Icons\n .prefix {\n position: absolute;\n width: $input-height;\n font-size: $input-icon-size;\n transition: color .2s;\n top: ($input-height - $input-icon-size) / 2;\n\n &.active { color: $input-focus-color; }\n }\n\n .prefix ~ input,\n .prefix ~ textarea,\n .prefix ~ label,\n .prefix ~ .validate ~ label,\n .prefix ~ .helper-text,\n .prefix ~ .autocomplete-content {\n margin-left: 3rem;\n width: 92%;\n width: calc(100% - 3rem);\n }\n\n .prefix ~ label { margin-left: 3rem; }\n\n @media #{$medium-and-down} {\n .prefix ~ input {\n width: 86%;\n width: calc(100% - 3rem);\n }\n }\n\n @media #{$small-and-down} {\n .prefix ~ input {\n width: 80%;\n width: calc(100% - 3rem);\n }\n }\n}\n\n\n/* Search Field */\n\n.input-field input[type=search] {\n display: block;\n line-height: inherit;\n transition: .3s background-color;\n\n .nav-wrapper & {\n height: inherit;\n padding-left: 4rem;\n width: calc(100% - 4rem);\n border: 0;\n box-shadow: none;\n }\n\n &:focus:not(.browser-default) {\n background-color: $input-background;\n border: 0;\n box-shadow: none;\n color: #444;\n\n & + label i,\n & ~ .mdi-navigation-close,\n & ~ .material-icons {\n color: #444;\n }\n }\n\n & + .label-icon {\n transform: none;\n left: 1rem;\n }\n\n & ~ .mdi-navigation-close,\n & ~ .material-icons {\n position: absolute;\n top: 0;\n right: 1rem;\n color: transparent;\n cursor: pointer;\n font-size: $input-icon-size;\n transition: .3s color;\n }\n}\n\n\n/* Textarea */\n\n// Default textarea\ntextarea {\n width: 100%;\n height: $input-height;\n background-color: transparent;\n\n &.materialize-textarea {\n line-height: normal;\n overflow-y: hidden; /* prevents scroll bar flash */\n padding: .8rem 0 .8rem 0; /* prevents text jump on Enter keypress */\n resize: none;\n min-height: $input-height;\n box-sizing: border-box;\n }\n}\n\n// For textarea autoresize\n.hiddendiv {\n visibility: hidden;\n white-space: pre-wrap;\n word-wrap: break-word;\n overflow-wrap: break-word; /* future version of deprecated 'word-wrap' */\n padding-top: 1.2rem; /* prevents text jump on Enter keypress */\n\n // Reduces repaints\n position: absolute;\n top: 0;\n z-index: -1;\n}\n\n\n/* Autocomplete */\n.autocomplete-content {\n li {\n .highlight { color: #444; }\n\n img {\n height: $dropdown-item-height - 10;\n width: $dropdown-item-height - 10;\n margin: 5px 15px;\n }\n }\n}\n\n/* Character Counter */\n.character-counter {\n min-height: 18px;\n}\n","/* Radio Buttons\n ========================================================================== */\n\n// Remove default Radio Buttons\n[type=\"radio\"]:not(:checked),\n[type=\"radio\"]:checked {\n position: absolute;\n opacity: 0;\n pointer-events: none;\n}\n\n[type=\"radio\"]:not(:checked) + span,\n[type=\"radio\"]:checked + span {\n position: relative;\n padding-left: 35px;\n cursor: pointer;\n display: inline-block;\n height: 25px;\n line-height: 25px;\n font-size: 1rem;\n transition: .28s ease;\n user-select: none;\n}\n\n[type=\"radio\"] + span:before,\n[type=\"radio\"] + span:after {\n content: '';\n position: absolute;\n left: 0;\n top: 0;\n margin: 4px;\n width: 16px;\n height: 16px;\n z-index: 0;\n transition: .28s ease;\n}\n\n/* Unchecked styles */\n[type=\"radio\"]:not(:checked) + span:before,\n[type=\"radio\"]:not(:checked) + span:after,\n[type=\"radio\"]:checked + span:before,\n[type=\"radio\"]:checked + span:after,\n[type=\"radio\"].with-gap:checked + span:before,\n[type=\"radio\"].with-gap:checked + span:after {\n border-radius: 50%;\n}\n\n[type=\"radio\"]:not(:checked) + span:before,\n[type=\"radio\"]:not(:checked) + span:after {\n border: 2px solid $radio-empty-color;\n}\n\n[type=\"radio\"]:not(:checked) + span:after {\n transform: scale(0);\n}\n\n/* Checked styles */\n[type=\"radio\"]:checked + span:before {\n border: 2px solid transparent;\n}\n\n[type=\"radio\"]:checked + span:after,\n[type=\"radio\"].with-gap:checked + span:before,\n[type=\"radio\"].with-gap:checked + span:after {\n border: $radio-border;\n}\n\n[type=\"radio\"]:checked + span:after,\n[type=\"radio\"].with-gap:checked + span:after {\n background-color: $radio-fill-color;\n}\n\n[type=\"radio\"]:checked + span:after {\n transform: scale(1.02);\n}\n\n/* Radio With gap */\n[type=\"radio\"].with-gap:checked + span:after {\n transform: scale(.5);\n}\n\n/* Focused styles */\n[type=\"radio\"].tabbed:focus + span:before {\n box-shadow: 0 0 0 10px rgba(0,0,0,.1);\n}\n\n/* Disabled Radio With gap */\n[type=\"radio\"].with-gap:disabled:checked + span:before {\n border: 2px solid $input-disabled-color;\n}\n\n[type=\"radio\"].with-gap:disabled:checked + span:after {\n border: none;\n background-color: $input-disabled-color;\n}\n\n/* Disabled style */\n[type=\"radio\"]:disabled:not(:checked) + span:before,\n[type=\"radio\"]:disabled:checked + span:before {\n background-color: transparent;\n border-color: $input-disabled-color;\n}\n\n[type=\"radio\"]:disabled + span {\n color: $input-disabled-color;\n}\n\n[type=\"radio\"]:disabled:not(:checked) + span:before {\n border-color: $input-disabled-color;\n}\n\n[type=\"radio\"]:disabled:checked + span:after {\n background-color: $input-disabled-color;\n border-color: $input-disabled-solid-color;\n}\n","/* Checkboxes\n ========================================================================== */\n\n/* Remove default checkbox */\n[type=\"checkbox\"]:not(:checked),\n[type=\"checkbox\"]:checked {\n position: absolute;\n opacity: 0;\n pointer-events: none;\n}\n\n// Checkbox Styles\n[type=\"checkbox\"] {\n // Text Label Style\n + span:not(.lever) {\n position: relative;\n padding-left: 35px;\n cursor: pointer;\n display: inline-block;\n height: 25px;\n line-height: 25px;\n font-size: 1rem;\n user-select: none;\n }\n\n /* checkbox aspect */\n + span:not(.lever):before,\n &:not(.filled-in) + span:not(.lever):after {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n width: 18px;\n height: 18px;\n z-index: 0;\n border: 2px solid $radio-empty-color;\n border-radius: 1px;\n margin-top: 3px;\n transition: .2s;\n }\n\n &:not(.filled-in) + span:not(.lever):after {\n border: 0;\n transform: scale(0);\n }\n\n &:not(:checked):disabled + span:not(.lever):before {\n border: none;\n background-color: $input-disabled-color;\n }\n\n // Focused styles\n &.tabbed:focus + span:not(.lever):after {\n transform: scale(1);\n border: 0;\n border-radius: 50%;\n box-shadow: 0 0 0 10px rgba(0,0,0,.1);\n background-color: rgba(0,0,0,.1);\n }\n}\n\n[type=\"checkbox\"]:checked {\n + span:not(.lever):before {\n top: -4px;\n left: -5px;\n width: 12px;\n height: 22px;\n border-top: 2px solid transparent;\n border-left: 2px solid transparent;\n border-right: $radio-border;\n border-bottom: $radio-border;\n transform: rotate(40deg);\n backface-visibility: hidden;\n transform-origin: 100% 100%;\n }\n\n &:disabled + span:before {\n border-right: 2px solid $input-disabled-color;\n border-bottom: 2px solid $input-disabled-color;\n }\n}\n\n/* Indeterminate checkbox */\n[type=\"checkbox\"]:indeterminate {\n + span:not(.lever):before {\n top: -11px;\n left: -12px;\n width: 10px;\n height: 22px;\n border-top: none;\n border-left: none;\n border-right: $radio-border;\n border-bottom: none;\n transform: rotate(90deg);\n backface-visibility: hidden;\n transform-origin: 100% 100%;\n }\n\n // Disabled indeterminate\n &:disabled + span:not(.lever):before {\n border-right: 2px solid $input-disabled-color;\n background-color: transparent;\n }\n}\n\n// Filled in Style\n[type=\"checkbox\"].filled-in {\n // General\n + span:not(.lever):after {\n border-radius: 2px;\n }\n\n + span:not(.lever):before,\n + span:not(.lever):after {\n content: '';\n left: 0;\n position: absolute;\n /* .1s delay is for check animation */\n transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;\n z-index: 1;\n }\n\n // Unchecked style\n &:not(:checked) + span:not(.lever):before {\n width: 0;\n height: 0;\n border: 3px solid transparent;\n left: 6px;\n top: 10px;\n transform: rotateZ(37deg);\n transform-origin: 100% 100%;\n }\n\n &:not(:checked) + span:not(.lever):after {\n height: 20px;\n width: 20px;\n background-color: transparent;\n border: 2px solid $radio-empty-color;\n top: 0px;\n z-index: 0;\n }\n\n // Checked style\n &:checked {\n + span:not(.lever):before {\n top: 0;\n left: 1px;\n width: 8px;\n height: 13px;\n border-top: 2px solid transparent;\n border-left: 2px solid transparent;\n border-right: 2px solid $input-background;\n border-bottom: 2px solid $input-background;\n transform: rotateZ(37deg);\n transform-origin: 100% 100%;\n }\n\n + span:not(.lever):after {\n top: 0;\n width: 20px;\n height: 20px;\n border: 2px solid $secondary-color;\n background-color: $secondary-color;\n z-index: 0;\n }\n }\n\n // Focused styles\n &.tabbed:focus + span:not(.lever):after {\n border-radius: 2px;\n border-color: $radio-empty-color;\n background-color: rgba(0,0,0,.1);\n }\n\n &.tabbed:checked:focus + span:not(.lever):after {\n border-radius: 2px;\n background-color: $secondary-color;\n border-color: $secondary-color;\n }\n\n // Disabled style\n &:disabled:not(:checked) + span:not(.lever):before {\n background-color: transparent;\n border: 2px solid transparent;\n }\n\n &:disabled:not(:checked) + span:not(.lever):after {\n border-color: transparent;\n background-color: $input-disabled-solid-color;\n }\n\n &:disabled:checked + span:not(.lever):before {\n background-color: transparent;\n }\n\n &:disabled:checked + span:not(.lever):after {\n background-color: $input-disabled-solid-color;\n border-color: $input-disabled-solid-color;\n }\n}\n","/* Switch\r\n ========================================================================== */\r\n\r\n.switch,\r\n.switch * {\r\n -webkit-tap-highlight-color: transparent;\r\n user-select: none;\r\n}\r\n\r\n.switch label {\r\n cursor: pointer;\r\n}\r\n\r\n.switch label input[type=checkbox] {\r\n opacity: 0;\r\n width: 0;\r\n height: 0;\r\n\r\n &:checked + .lever {\r\n background-color: $switch-checked-lever-bg;\r\n\r\n &:before, &:after {\r\n left: 18px;\r\n }\r\n\r\n &:after {\r\n background-color: $switch-bg-color;\r\n }\r\n }\r\n}\r\n\r\n.switch label .lever {\r\n content: \"\";\r\n display: inline-block;\r\n position: relative;\r\n width: 36px;\r\n height: 14px;\r\n background-color: $switch-unchecked-lever-bg;\r\n border-radius: $switch-radius;\r\n margin-right: 10px;\r\n transition: background 0.3s ease;\r\n vertical-align: middle;\r\n margin: 0 16px;\r\n\r\n &:before, &:after {\r\n content: \"\";\r\n position: absolute;\r\n display: inline-block;\r\n width: 20px;\r\n height: 20px;\r\n border-radius: 50%;\r\n left: 0;\r\n top: -3px;\r\n transition: left 0.3s ease, background .3s ease, box-shadow 0.1s ease, transform .1s ease;\r\n }\r\n\r\n &:before {\r\n background-color: transparentize($switch-bg-color, .85);\r\n }\r\n\r\n &:after {\r\n background-color: $switch-unchecked-bg;\r\n box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);\r\n }\r\n}\r\n\r\n// Switch active style\r\ninput[type=checkbox]:checked:not(:disabled) ~ .lever:active::before,\r\ninput[type=checkbox]:checked:not(:disabled).tabbed:focus ~ .lever::before {\r\n transform: scale(2.4);\r\n background-color: transparentize($switch-bg-color, .85);\r\n}\r\n\r\ninput[type=checkbox]:not(:disabled) ~ .lever:active:before,\r\ninput[type=checkbox]:not(:disabled).tabbed:focus ~ .lever::before {\r\n transform: scale(2.4);\r\n background-color: rgba(0,0,0,.08);\r\n}\r\n\r\n// Disabled Styles\r\n.switch input[type=checkbox][disabled] + .lever {\r\n cursor: default;\r\n background-color: rgba(0,0,0,.12);\r\n}\r\n\r\n.switch label input[type=checkbox][disabled] + .lever:after,\r\n.switch label input[type=checkbox][disabled]:checked + .lever:after {\r\n background-color: $input-disabled-solid-color;\r\n}\r\n","/* Select Field\n ========================================================================== */\n\nselect { display: none; }\nselect.browser-default { display: block; }\n\nselect {\n background-color: $select-background;\n width: 100%;\n padding: $select-padding;\n border: $select-border;\n border-radius: $select-radius;\n height: $input-height;\n}\n\n.select-label {\n position: absolute;\n}\n\n.select-wrapper {\n &.valid .helper-text[data-success],\n &.invalid ~ .helper-text[data-error] {\n @extend %hidden-text;\n }\n\n &.valid {\n & > input.select-dropdown {\n @extend %valid-input-style;\n }\n\n & ~ .helper-text:after {\n @extend %custom-success-message;\n }\n }\n\n &.invalid {\n & > input.select-dropdown,\n & > input.select-dropdown:focus {\n @extend %invalid-input-style;\n }\n\n & ~ .helper-text:after {\n @extend %custom-error-message;\n }\n }\n\n &.valid + label,\n &.invalid + label {\n width: 100%;\n pointer-events: none;\n }\n\n & + label:after {\n @extend %input-after-style;\n }\n\n position: relative;\n\n input.select-dropdown {\n &:focus {\n border-bottom: 1px solid $input-focus-color;\n }\n position: relative;\n cursor: pointer;\n background-color: transparent;\n border: none;\n border-bottom: $input-border;\n outline: none;\n height: $input-height;\n line-height: $input-height;\n width: 100%;\n font-size: $input-font-size;\n margin: $input-margin;\n padding: 0;\n display: block;\n user-select:none;\n z-index: 1;\n }\n\n .caret {\n position: absolute;\n right: 0;\n top: 0;\n bottom: 0;\n margin: auto 0;\n z-index: 0;\n fill: rgba(0,0,0,.87);\n }\n\n & + label {\n position: absolute;\n top: -26px;\n font-size: $label-font-size;\n }\n}\n\n// Disabled styles\nselect:disabled {\n color: $input-disabled-color;\n}\n\n.select-wrapper.disabled {\n + label {\n color: $input-disabled-color;\n }\n .caret {\n fill: $input-disabled-color;\n }\n}\n\n.select-wrapper input.select-dropdown:disabled {\n color: $input-disabled-color;\n cursor: default;\n user-select: none;\n}\n\n.select-wrapper i {\n color: $select-disabled-color;\n}\n\n.select-dropdown li.disabled,\n.select-dropdown li.disabled > span,\n.select-dropdown li.optgroup {\n color: $select-disabled-color;\n background-color: transparent;\n}\n\nbody.keyboard-focused {\n .select-dropdown.dropdown-content li:focus {\n background-color: $select-option-focus;\n }\n}\n\n.select-dropdown.dropdown-content {\n li {\n &:hover {\n background-color: $select-option-hover;\n }\n\n &.selected {\n background-color: $select-option-selected;\n }\n }\n}\n\n// Prefix Icons\n.prefix ~ .select-wrapper {\n margin-left: 3rem;\n width: 92%;\n width: calc(100% - 3rem);\n}\n\n.prefix ~ label { margin-left: 3rem; }\n\n// Icons\n.select-dropdown li {\n img {\n height: $dropdown-item-height - 10;\n width: $dropdown-item-height - 10;\n margin: 5px 15px;\n float: right;\n }\n}\n\n// Optgroup styles\n.select-dropdown li.optgroup {\n border-top: 1px solid $dropdown-hover-bg-color;\n\n &.selected > span {\n color: rgba(0, 0, 0, .7);\n }\n\n & > span {\n color: rgba(0, 0, 0, .4);\n }\n\n & ~ li.optgroup-option {\n padding-left: 1rem;\n }\n}\n","/* File Input\r\n ========================================================================== */\r\n\r\n.file-field {\r\n position: relative;\r\n\r\n .file-path-wrapper {\r\n overflow: hidden;\r\n padding-left: 10px;\r\n }\r\n\r\n input.file-path { width: 100%; }\r\n\r\n .btn {\r\n float: left;\r\n height: $input-height;\r\n line-height: $input-height;\r\n }\r\n\r\n span {\r\n cursor: pointer;\r\n }\r\n\r\n input[type=file] {\r\n\r\n // Needed to override webkit button\r\n &::-webkit-file-upload-button {\r\n display: none;\r\n }\r\n\r\n position: absolute;\r\n top: 0;\r\n right: 0;\r\n left: 0;\r\n bottom: 0;\r\n width: 100%;\r\n margin: 0;\r\n padding: 0;\r\n font-size: 20px;\r\n cursor: pointer;\r\n opacity: 0;\r\n filter: alpha(opacity=0);\r\n }\r\n}\r\n","/* Range\n ========================================================================== */\n\n.range-field {\n position: relative;\n}\n\ninput[type=range],\ninput[type=range] + .thumb {\n @extend .no-select;\n cursor: pointer;\n}\n\ninput[type=range] {\n position: relative;\n background-color: transparent;\n border: none;\n outline: none;\n width: 100%;\n margin: 15px 0;\n padding: 0;\n\n &:focus {\n outline: none;\n }\n}\n\ninput[type=range] + .thumb {\n position: absolute;\n top: 10px;\n left: 0;\n border: none;\n height: 0;\n width: 0;\n border-radius: 50%;\n background-color: $radio-fill-color;\n margin-left: 7px;\n\n transform-origin: 50% 50%;\n transform: rotate(-45deg);\n\n .value {\n display: block;\n width: 30px;\n text-align: center;\n color: $radio-fill-color;\n font-size: 0;\n transform: rotate(45deg);\n }\n\n &.active {\n border-radius: 50% 50% 50% 0;\n\n .value {\n color: $input-background;\n margin-left: -1px;\n margin-top: 8px;\n font-size: 10px;\n }\n }\n}\n\n// Shared\n@mixin range-track {\n height: $track-height;\n background: #c2c0c2;\n border: none;\n}\n\n@mixin range-thumb {\n border: none;\n height: $range-height;\n width: $range-width;\n border-radius: 50%;\n background: $radio-fill-color;\n transition: box-shadow .3s;\n}\n\n// WebKit\ninput[type=range] {\n -webkit-appearance: none;\n}\n\ninput[type=range]::-webkit-slider-runnable-track {\n @include range-track;\n}\n\ninput[type=range]::-webkit-slider-thumb {\n @include range-thumb;\n -webkit-appearance: none;\n background-color: $radio-fill-color;\n transform-origin: 50% 50%;\n margin: -5px 0 0 0;\n\n}\n\n.keyboard-focused input[type=range]:focus:not(.active)::-webkit-slider-thumb {\n box-shadow: 0 0 0 10px rgba($radio-fill-color, .26);\n}\n\n// FireFox\ninput[type=range] {\n /* fix for FF unable to apply focus style bug */\n border: 1px solid white;\n\n /*required for proper track sizing in FF*/\n}\n\ninput[type=range]::-moz-range-track {\n @include range-track;\n}\n\ninput[type=range]::-moz-focus-inner {\n border: 0;\n}\n\ninput[type=range]::-moz-range-thumb {\n @include range-thumb;\n margin-top: -5px;\n}\n\n// hide the outline behind the border\ninput[type=range]:-moz-focusring {\n outline: 1px solid #fff;\n outline-offset: -1px;\n}\n\n.keyboard-focused input[type=range]:focus:not(.active)::-moz-range-thumb {\n box-shadow: 0 0 0 10px rgba($radio-fill-color, .26);\n}\n\n// IE 10+\ninput[type=range]::-ms-track {\n height: $track-height;\n\n // remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead\n background: transparent;\n\n // leave room for the larger thumb to overflow with a transparent border */\n border-color: transparent;\n border-width: 6px 0;\n\n /*remove default tick marks*/\n color: transparent;\n}\n\ninput[type=range]::-ms-fill-lower {\n background: #777;\n}\n\ninput[type=range]::-ms-fill-upper {\n background: #ddd;\n}\n\ninput[type=range]::-ms-thumb {\n @include range-thumb;\n}\n\n.keyboard-focused input[type=range]:focus:not(.active)::-ms-thumb {\n box-shadow: 0 0 0 10px rgba($radio-fill-color, .26);\n}\n","/***************\n Nav List\n***************/\n.table-of-contents {\n &.fixed {\n position: fixed;\n }\n\n li {\n padding: 2px 0;\n }\n a {\n display: inline-block;\n font-weight: 300;\n color: #757575;\n padding-left: 16px;\n height: 1.5rem;\n line-height: 1.5rem;\n letter-spacing: .4;\n display: inline-block;\n\n &:hover {\n color: lighten(#757575, 20%);\n padding-left: 15px;\n border-left: 1px solid $primary-color;\n }\n &.active {\n font-weight: 500;\n padding-left: 14px;\n border-left: 2px solid $primary-color;\n }\n }\n}\n",".sidenav {\n position: fixed;\n width: $sidenav-width;\n left: 0;\n top: 0;\n margin: 0;\n transform: translateX(-100%);\n height: 100%;\n height: calc(100% + 60px);\n height: -moz-calc(100%); //Temporary Firefox Fix\n padding-bottom: 60px;\n background-color: $sidenav-bg-color;\n z-index: 999;\n overflow-y: auto;\n will-change: transform;\n backface-visibility: hidden;\n transform: translateX(-105%);\n\n @extend .z-depth-1;\n\n // Right Align\n &.right-aligned {\n right: 0;\n transform: translateX(105%);\n left: auto;\n transform: translateX(100%);\n }\n\n .collapsible {\n margin: 0;\n }\n\n\n li {\n float: none;\n line-height: $sidenav-line-height;\n\n &.active { background-color: rgba(0,0,0,.05); }\n }\n\n li > a {\n color: $sidenav-font-color;\n display: block;\n font-size: $sidenav-font-size;\n font-weight: 500;\n height: $sidenav-item-height;\n line-height: $sidenav-line-height;\n padding: 0 ($sidenav-padding * 2);\n\n &:hover { background-color: rgba(0,0,0,.05);}\n\n &.btn, &.btn-large, &.btn-flat, &.btn-floating {\n margin: 10px 15px;\n }\n\n &.btn,\n &.btn-large,\n &.btn-floating { color: $button-raised-color; }\n &.btn-flat { color: $button-flat-color; }\n\n &.btn:hover,\n &.btn-large:hover { background-color: lighten($button-raised-background, 5%); }\n &.btn-floating:hover { background-color: $button-raised-background; }\n\n & > i,\n & > [class^=\"mdi-\"], li > a > [class*=\"mdi-\"],\n & > i.material-icons {\n float: left;\n height: $sidenav-item-height;\n line-height: $sidenav-line-height;\n margin: 0 ($sidenav-padding * 2) 0 0;\n width: $sidenav-item-height / 2;\n color: rgba(0,0,0,.54);\n }\n }\n\n\n .divider {\n margin: ($sidenav-padding / 2) 0 0 0;\n }\n\n .subheader {\n &:hover {\n background-color: transparent;\n }\n\n cursor: initial;\n pointer-events: none;\n color: rgba(0,0,0,.54);\n font-size: $sidenav-font-size;\n font-weight: 500;\n line-height: $sidenav-line-height;\n }\n\n .user-view {\n position: relative;\n padding: ($sidenav-padding * 2) ($sidenav-padding * 2) 0;\n margin-bottom: $sidenav-padding / 2;\n\n & > a {\n &:hover { background-color: transparent; }\n height: auto;\n padding: 0;\n }\n\n .background {\n overflow: hidden;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: -1;\n }\n\n .circle, .name, .email {\n display: block;\n }\n\n .circle {\n height: 64px;\n width: 64px;\n }\n\n .name,\n .email {\n font-size: $sidenav-font-size;\n line-height: $sidenav-line-height / 2;\n }\n\n .name {\n margin-top: 16px;\n font-weight: 500;\n }\n\n .email {\n padding-bottom: 16px;\n font-weight: 400;\n }\n }\n}\n\n\n// Touch interaction\n.drag-target {\n // Right Align\n &.right-aligned {\n right: 0;\n }\n\n height: 100%;\n width: 10px;\n position: fixed;\n top: 0;\n z-index: 998;\n}\n\n\n// Fixed Sidenav shown\n.sidenav.sidenav-fixed {\n // Right Align\n &.right-aligned {\n right: 0;\n left: auto;\n }\n\n left: 0;\n transform: translateX(0);\n position: fixed;\n}\n\n// Fixed Sidenav hide on smaller\n@media #{$medium-and-down} {\n .sidenav {\n &.sidenav-fixed {\n transform: translateX(-105%);\n\n &.right-aligned {\n transform: translateX(105%);\n }\n }\n\n > a {\n padding: 0 $sidenav-padding;\n }\n\n .user-view {\n padding: $sidenav-padding $sidenav-padding 0;\n }\n }\n}\n\n\n.sidenav .collapsible-body > ul:not(.collapsible) > li.active,\n.sidenav.sidenav-fixed .collapsible-body > ul:not(.collapsible) > li.active {\n background-color: $primary-color;\n a {\n color: $sidenav-bg-color;\n }\n}\n.sidenav .collapsible-body {\n padding: 0;\n}\n\n\n.sidenav-overlay {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n opacity: 0;\n height: 120vh;\n background-color: rgba(0,0,0,.5);\n z-index: 997;\n display: none;\n}\n","/*\r\n @license\r\n Copyright (c) 2014 The Polymer Project Authors. All rights reserved.\r\n This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt\r\n The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt\r\n The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt\r\n Code distributed by Google as part of the polymer project is also\r\n subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt\r\n */\r\n\r\n/**************************/\r\n/* STYLES FOR THE SPINNER */\r\n/**************************/\r\n\r\n/*\r\n * Constants:\r\n * STROKEWIDTH = 3px\r\n * ARCSIZE = 270 degrees (amount of circle the arc takes up)\r\n * ARCTIME = 1333ms (time it takes to expand and contract arc)\r\n * ARCSTARTROT = 216 degrees (how much the start location of the arc\r\n * should rotate each time, 216 gives us a\r\n * 5 pointed star shape (it's 360/5 * 3).\r\n * For a 7 pointed star, we might do\r\n * 360/7 * 3 = 154.286)\r\n * CONTAINERWIDTH = 28px\r\n * SHRINK_TIME = 400ms\r\n */\r\n\r\n\r\n.preloader-wrapper {\r\n display: inline-block;\r\n position: relative;\r\n width: 50px;\r\n height: 50px;\r\n\r\n &.small {\r\n width: 36px;\r\n height: 36px;\r\n }\r\n\r\n &.big {\r\n width: 64px;\r\n height: 64px;\r\n }\r\n\r\n &.active {\r\n /* duration: 360 * ARCTIME / (ARCSTARTROT + (360-ARCSIZE)) */\r\n -webkit-animation: container-rotate 1568ms linear infinite;\r\n animation: container-rotate 1568ms linear infinite;\r\n }\r\n}\r\n\r\n@-webkit-keyframes container-rotate {\r\n to { -webkit-transform: rotate(360deg) }\r\n}\r\n\r\n@keyframes container-rotate {\r\n to { transform: rotate(360deg) }\r\n}\r\n\r\n.spinner-layer {\r\n position: absolute;\r\n width: 100%;\r\n height: 100%;\r\n opacity: 0;\r\n border-color: $spinner-default-color;\r\n}\r\n\r\n.spinner-blue,\r\n.spinner-blue-only {\r\n border-color: #4285f4;\r\n}\r\n\r\n.spinner-red,\r\n.spinner-red-only {\r\n border-color: #db4437;\r\n}\r\n\r\n.spinner-yellow,\r\n.spinner-yellow-only {\r\n border-color: #f4b400;\r\n}\r\n\r\n.spinner-green,\r\n.spinner-green-only {\r\n border-color: #0f9d58;\r\n}\r\n\r\n/**\r\n * IMPORTANT NOTE ABOUT CSS ANIMATION PROPERTIES (keanulee):\r\n *\r\n * iOS Safari (tested on iOS 8.1) does not handle animation-delay very well - it doesn't\r\n * guarantee that the animation will start _exactly_ after that value. So we avoid using\r\n * animation-delay and instead set custom keyframes for each color (as redundant as it\r\n * seems).\r\n *\r\n * We write out each animation in full (instead of separating animation-name,\r\n * animation-duration, etc.) because under the polyfill, Safari does not recognize those\r\n * specific properties properly, treats them as -webkit-animation, and overrides the\r\n * other animation rules. See https://github.com/Polymer/platform/issues/53.\r\n */\r\n.active .spinner-layer.spinner-blue {\r\n /* durations: 4 * ARCTIME */\r\n -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;\r\n animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;\r\n}\r\n\r\n.active .spinner-layer.spinner-red {\r\n /* durations: 4 * ARCTIME */\r\n -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;\r\n animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;\r\n}\r\n\r\n.active .spinner-layer.spinner-yellow {\r\n /* durations: 4 * ARCTIME */\r\n -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;\r\n animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;\r\n}\r\n\r\n.active .spinner-layer.spinner-green {\r\n /* durations: 4 * ARCTIME */\r\n -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;\r\n animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;\r\n}\r\n\r\n.active .spinner-layer,\r\n.active .spinner-layer.spinner-blue-only,\r\n.active .spinner-layer.spinner-red-only,\r\n.active .spinner-layer.spinner-yellow-only,\r\n.active .spinner-layer.spinner-green-only {\r\n /* durations: 4 * ARCTIME */\r\n opacity: 1;\r\n -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;\r\n animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;\r\n}\r\n\r\n@-webkit-keyframes fill-unfill-rotate {\r\n 12.5% { -webkit-transform: rotate(135deg); } /* 0.5 * ARCSIZE */\r\n 25% { -webkit-transform: rotate(270deg); } /* 1 * ARCSIZE */\r\n 37.5% { -webkit-transform: rotate(405deg); } /* 1.5 * ARCSIZE */\r\n 50% { -webkit-transform: rotate(540deg); } /* 2 * ARCSIZE */\r\n 62.5% { -webkit-transform: rotate(675deg); } /* 2.5 * ARCSIZE */\r\n 75% { -webkit-transform: rotate(810deg); } /* 3 * ARCSIZE */\r\n 87.5% { -webkit-transform: rotate(945deg); } /* 3.5 * ARCSIZE */\r\n to { -webkit-transform: rotate(1080deg); } /* 4 * ARCSIZE */\r\n}\r\n\r\n@keyframes fill-unfill-rotate {\r\n 12.5% { transform: rotate(135deg); } /* 0.5 * ARCSIZE */\r\n 25% { transform: rotate(270deg); } /* 1 * ARCSIZE */\r\n 37.5% { transform: rotate(405deg); } /* 1.5 * ARCSIZE */\r\n 50% { transform: rotate(540deg); } /* 2 * ARCSIZE */\r\n 62.5% { transform: rotate(675deg); } /* 2.5 * ARCSIZE */\r\n 75% { transform: rotate(810deg); } /* 3 * ARCSIZE */\r\n 87.5% { transform: rotate(945deg); } /* 3.5 * ARCSIZE */\r\n to { transform: rotate(1080deg); } /* 4 * ARCSIZE */\r\n}\r\n\r\n@-webkit-keyframes blue-fade-in-out {\r\n from { opacity: 1; }\r\n 25% { opacity: 1; }\r\n 26% { opacity: 0; }\r\n 89% { opacity: 0; }\r\n 90% { opacity: 1; }\r\n 100% { opacity: 1; }\r\n}\r\n\r\n@keyframes blue-fade-in-out {\r\n from { opacity: 1; }\r\n 25% { opacity: 1; }\r\n 26% { opacity: 0; }\r\n 89% { opacity: 0; }\r\n 90% { opacity: 1; }\r\n 100% { opacity: 1; }\r\n}\r\n\r\n@-webkit-keyframes red-fade-in-out {\r\n from { opacity: 0; }\r\n 15% { opacity: 0; }\r\n 25% { opacity: 1; }\r\n 50% { opacity: 1; }\r\n 51% { opacity: 0; }\r\n}\r\n\r\n@keyframes red-fade-in-out {\r\n from { opacity: 0; }\r\n 15% { opacity: 0; }\r\n 25% { opacity: 1; }\r\n 50% { opacity: 1; }\r\n 51% { opacity: 0; }\r\n}\r\n\r\n@-webkit-keyframes yellow-fade-in-out {\r\n from { opacity: 0; }\r\n 40% { opacity: 0; }\r\n 50% { opacity: 1; }\r\n 75% { opacity: 1; }\r\n 76% { opacity: 0; }\r\n}\r\n\r\n@keyframes yellow-fade-in-out {\r\n from { opacity: 0; }\r\n 40% { opacity: 0; }\r\n 50% { opacity: 1; }\r\n 75% { opacity: 1; }\r\n 76% { opacity: 0; }\r\n}\r\n\r\n@-webkit-keyframes green-fade-in-out {\r\n from { opacity: 0; }\r\n 65% { opacity: 0; }\r\n 75% { opacity: 1; }\r\n 90% { opacity: 1; }\r\n 100% { opacity: 0; }\r\n}\r\n\r\n@keyframes green-fade-in-out {\r\n from { opacity: 0; }\r\n 65% { opacity: 0; }\r\n 75% { opacity: 1; }\r\n 90% { opacity: 1; }\r\n 100% { opacity: 0; }\r\n}\r\n\r\n/**\r\n * Patch the gap that appear between the two adjacent div.circle-clipper while the\r\n * spinner is rotating (appears on Chrome 38, Safari 7.1, and IE 11).\r\n */\r\n.gap-patch {\r\n position: absolute;\r\n top: 0;\r\n left: 45%;\r\n width: 10%;\r\n height: 100%;\r\n overflow: hidden;\r\n border-color: inherit;\r\n}\r\n\r\n.gap-patch .circle {\r\n width: 1000%;\r\n left: -450%;\r\n}\r\n\r\n.circle-clipper {\r\n display: inline-block;\r\n position: relative;\r\n width: 50%;\r\n height: 100%;\r\n overflow: hidden;\r\n border-color: inherit;\r\n\r\n .circle {\r\n width: 200%;\r\n height: 100%;\r\n border-width: 3px; /* STROKEWIDTH */\r\n border-style: solid;\r\n border-color: inherit;\r\n border-bottom-color: transparent !important;\r\n border-radius: 50%;\r\n -webkit-animation: none;\r\n animation: none;\r\n position: absolute;\r\n top: 0;\r\n right: 0;\r\n bottom: 0;\r\n }\r\n\r\n &.left .circle {\r\n left: 0;\r\n border-right-color: transparent !important;\r\n -webkit-transform: rotate(129deg);\r\n transform: rotate(129deg);\r\n }\r\n &.right .circle {\r\n left: -100%;\r\n border-left-color: transparent !important;\r\n -webkit-transform: rotate(-129deg);\r\n transform: rotate(-129deg);\r\n }\r\n}\r\n\r\n\r\n\r\n.active .circle-clipper.left .circle {\r\n /* duration: ARCTIME */\r\n -webkit-animation: left-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;\r\n animation: left-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;\r\n}\r\n\r\n.active .circle-clipper.right .circle {\r\n /* duration: ARCTIME */\r\n -webkit-animation: right-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;\r\n animation: right-spin 1333ms cubic-bezier(0.4, 0.0, 0.2, 1) infinite both;\r\n}\r\n\r\n@-webkit-keyframes left-spin {\r\n from { -webkit-transform: rotate(130deg); }\r\n 50% { -webkit-transform: rotate(-5deg); }\r\n to { -webkit-transform: rotate(130deg); }\r\n}\r\n\r\n@keyframes left-spin {\r\n from { transform: rotate(130deg); }\r\n 50% { transform: rotate(-5deg); }\r\n to { transform: rotate(130deg); }\r\n}\r\n\r\n@-webkit-keyframes right-spin {\r\n from { -webkit-transform: rotate(-130deg); }\r\n 50% { -webkit-transform: rotate(5deg); }\r\n to { -webkit-transform: rotate(-130deg); }\r\n}\r\n\r\n@keyframes right-spin {\r\n from { transform: rotate(-130deg); }\r\n 50% { transform: rotate(5deg); }\r\n to { transform: rotate(-130deg); }\r\n}\r\n\r\n#spinnerContainer.cooldown {\r\n /* duration: SHRINK_TIME */\r\n -webkit-animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0.0, 0.2, 1);\r\n animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0.0, 0.2, 1);\r\n}\r\n\r\n@-webkit-keyframes fade-out {\r\n from { opacity: 1; }\r\n to { opacity: 0; }\r\n}\r\n\r\n@keyframes fade-out {\r\n from { opacity: 1; }\r\n to { opacity: 0; }\r\n}\r\n",".slider {\r\n position: relative;\r\n height: 400px;\r\n width: 100%;\r\n\r\n // Fullscreen slider\r\n &.fullscreen {\r\n height: 100%;\r\n width: 100%;\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n\r\n ul.slides {\r\n height: 100%;\r\n }\r\n\r\n ul.indicators {\r\n z-index: 2;\r\n bottom: 30px;\r\n }\r\n }\r\n\r\n .slides {\r\n background-color: $slider-bg-color;\r\n margin: 0;\r\n height: 400px;\r\n\r\n li {\r\n opacity: 0;\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n z-index: 1;\r\n width: 100%;\r\n height: inherit;\r\n overflow: hidden;\r\n\r\n img {\r\n height: 100%;\r\n width: 100%;\r\n background-size: cover;\r\n background-position: center;\r\n }\r\n\r\n .caption {\r\n color: #fff;\r\n position: absolute;\r\n top: 15%;\r\n left: 15%;\r\n width: 70%;\r\n opacity: 0;\r\n\r\n p { color: $slider-bg-color-light; }\r\n }\r\n\r\n &.active {\r\n z-index: 2;\r\n }\r\n }\r\n }\r\n\r\n\r\n .indicators {\r\n position: absolute;\r\n text-align: center;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n margin: 0;\r\n\r\n .indicator-item {\r\n display: inline-block;\r\n position: relative;\r\n cursor: pointer;\r\n height: 16px;\r\n width: 16px;\r\n margin: 0 12px;\r\n background-color: $slider-bg-color-light;\r\n\r\n transition: background-color .3s;\r\n border-radius: 50%;\r\n\r\n &.active {\r\n background-color: $slider-indicator-color;\r\n }\r\n }\r\n }\r\n\r\n}",".carousel {\n &.carousel-slider {\n top: 0;\n left: 0;\n\n .carousel-fixed-item {\n &.with-indicators {\n bottom: 68px;\n }\n\n position: absolute;\n left: 0;\n right: 0;\n bottom: 20px;\n z-index: 1;\n }\n\n .carousel-item {\n width: 100%;\n height: 100%;\n min-height: $carousel-height;\n position: absolute;\n top: 0;\n left: 0;\n\n h2 {\n font-size: 24px;\n font-weight: 500;\n line-height: 32px;\n }\n\n p {\n font-size: 15px;\n }\n }\n }\n\n overflow: hidden;\n position: relative;\n width: 100%;\n height: $carousel-height;\n perspective: 500px;\n transform-style: preserve-3d;\n transform-origin: 0% 50%;\n\n .carousel-item {\n visibility: hidden;\n width: $carousel-item-width;\n height: $carousel-item-height;\n position: absolute;\n top: 0;\n left: 0;\n\n & > img {\n width: 100%;\n }\n }\n\n .indicators {\n position: absolute;\n text-align: center;\n left: 0;\n right: 0;\n bottom: 0;\n margin: 0;\n\n .indicator-item {\n &.active {\n background-color: #fff;\n }\n\n display: inline-block;\n position: relative;\n cursor: pointer;\n height: 8px;\n width: 8px;\n margin: 24px 4px;\n background-color: rgba(255,255,255,.5);\n\n transition: background-color .3s;\n border-radius: 50%;\n }\n }\n\n // Materialbox compatibility\n &.scrolling .carousel-item .materialboxed,\n .carousel-item:not(.active) .materialboxed {\n pointer-events: none;\n }\n}\n",".tap-target-wrapper {\r\n width: 800px;\r\n height: 800px;\r\n position: fixed;\r\n z-index: 1000;\r\n visibility: hidden;\r\n transition: visibility 0s .3s;\r\n}\r\n\r\n.tap-target-wrapper.open {\r\n visibility: visible;\r\n transition: visibility 0s;\r\n\r\n .tap-target {\r\n transform: scale(1);\r\n opacity: .95;\r\n transition:\r\n transform .3s cubic-bezier(.42,0,.58,1),\r\n opacity .3s cubic-bezier(.42,0,.58,1);\r\n }\r\n\r\n .tap-target-wave::before {\r\n transform: scale(1);\r\n }\r\n .tap-target-wave::after {\r\n visibility: visible;\r\n animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;\r\n transition:\r\n opacity .3s,\r\n transform .3s,\r\n visibility 0s 1s;\r\n }\r\n}\r\n\r\n.tap-target {\r\n position: absolute;\r\n font-size: 1rem;\r\n border-radius: 50%;\r\n background-color: $primary-color;\r\n box-shadow: 0 20px 20px 0 rgba(0,0,0,0.14), 0 10px 50px 0 rgba(0,0,0,0.12), 0 30px 10px -20px rgba(0,0,0,0.2);\r\n width: 100%;\r\n height: 100%;\r\n opacity: 0;\r\n transform: scale(0);\r\n transition:\r\n transform .3s cubic-bezier(.42,0,.58,1),\r\n opacity .3s cubic-bezier(.42,0,.58,1);\r\n}\r\n\r\n.tap-target-content {\r\n position: relative;\r\n display: table-cell;\r\n}\r\n\r\n.tap-target-wave {\r\n &::before,\r\n &::after {\r\n content: '';\r\n display: block;\r\n position: absolute;\r\n width: 100%;\r\n height: 100%;\r\n border-radius: 50%;\r\n background-color: #ffffff;\r\n }\r\n &::before {\r\n transform: scale(0);\r\n transition: transform .3s;\r\n }\r\n &::after {\r\n visibility: hidden;\r\n transition:\r\n opacity .3s,\r\n transform .3s,\r\n visibility 0s;\r\n z-index: -1;\r\n }\r\n\r\n position: absolute;\r\n border-radius: 50%;\r\n z-index: 10001;\r\n}\r\n\r\n.tap-target-origin {\r\n &:not(.btn),\r\n &:not(.btn):hover {\r\n background: none;\r\n }\r\n\r\n top: 50%;\r\n left: 50%;\r\n transform: translate(-50%,-50%);\r\n\r\n z-index: 10002;\r\n position: absolute !important;\r\n}\r\n\r\n@media only screen and (max-width: 600px) {\r\n .tap-target, .tap-target-wrapper {\r\n width: 600px;\r\n height: 600px;\r\n }\r\n}\r\n",".pulse {\n &::before {\n content: '';\n display: block;\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n background-color: inherit;\n border-radius: inherit;\n transition: opacity .3s, transform .3s;\n animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;\n z-index: -1;\n }\n\n overflow: visible;\n position: relative;\n}\n\n@keyframes pulse-animation {\n 0% {\n opacity: 1;\n transform: scale(1);\n }\n 50% {\n opacity: 0;\n transform: scale(1.5);\n }\n 100% {\n opacity: 0;\n transform: scale(1.5);\n }\n}\n","/* Modal */\n.datepicker-modal {\n max-width: 325px;\n min-width: 300px;\n max-height: none;\n}\n\n.datepicker-container.modal-content {\n display: flex;\n flex-direction: column;\n padding: 0;\n}\n\n.datepicker-controls {\n display: flex;\n justify-content: space-between;\n width: 280px;\n margin: 0 auto;\n\n .selects-container {\n display: flex;\n }\n\n .select-wrapper {\n input {\n &:focus {\n border-bottom: none;\n }\n border-bottom: none;\n text-align: center;\n margin: 0;\n }\n\n .caret {\n display: none;\n }\n }\n\n .select-year input {\n width: 50px;\n }\n\n .select-month input {\n width: 70px;\n }\n}\n\n.month-prev, .month-next {\n margin-top: 4px;\n cursor: pointer;\n background-color: transparent;\n border: none;\n}\n\n\n/* Date Display */\n.datepicker-date-display {\n flex: 1 auto;\n background-color: $secondary-color;\n color: #fff;\n padding: 20px 22px;\n font-weight: 500;\n\n .year-text {\n display: block;\n font-size: 1.5rem;\n line-height: 25px;\n color: $datepicker-year;\n }\n\n .date-text {\n display: block;\n font-size: 2.8rem;\n line-height: 47px;\n font-weight: 500;\n }\n}\n\n\n/* Calendar */\n.datepicker-calendar-container {\n flex: 2.5 auto;\n}\n\n.datepicker-table {\n width: 280px;\n font-size: 1rem;\n margin: 0 auto;\n\n thead {\n border-bottom: none;\n }\n\n th {\n padding: 10px 5px;\n text-align: center;\n }\n\n tr {\n border: none;\n }\n\n abbr {\n text-decoration: none;\n color: $datepicker-calendar-header-color;\n }\n\n td {\n &.is-today {\n color: $secondary-color;\n }\n\n &.is-selected {\n background-color: $secondary-color;\n color: #fff;\n }\n\n &.is-outside-current-month,\n &.is-disabled {\n color: $datepicker-disabled-day-color;\n pointer-events: none;\n }\n\n border-radius: 50%;\n padding: 0;\n }\n}\n\n.datepicker-day-button {\n &:focus {\n background-color: $datepicker-day-focus;\n }\n\n background-color: transparent;\n border: none;\n line-height: 38px;\n display: block;\n width: 100%;\n border-radius: 50%;\n padding: 0 5px;\n cursor: pointer;\n color: inherit;\n}\n\n\n/* Footer */\n.datepicker-footer {\n width: 280px;\n margin: 0 auto;\n padding-bottom: 5px;\n display: flex;\n justify-content: space-between;\n}\n\n.datepicker-cancel,\n.datepicker-clear,\n.datepicker-today,\n.datepicker-done {\n color: $secondary-color;\n padding: 0 1rem;\n}\n\n.datepicker-clear {\n color: $error-color;\n}\n\n\n/* Media Queries */\n@media #{$medium-and-up} {\n .datepicker-modal {\n max-width: 625px;\n }\n\n .datepicker-container.modal-content {\n flex-direction: row;\n }\n\n .datepicker-date-display {\n flex: 0 1 270px;\n }\n\n .datepicker-controls,\n .datepicker-table,\n .datepicker-footer {\n width: 320px;\n }\n\n .datepicker-day-button {\n line-height: 44px;\n }\n}\n","/* Timepicker Containers */\n.timepicker-modal {\n max-width: 325px;\n max-height: none;\n}\n\n.timepicker-container.modal-content {\n display: flex;\n flex-direction: column;\n padding: 0;\n}\n\n.text-primary {\n\tcolor: rgba(255, 255, 255, 1);\n}\n\n\n/* Clock Digital Display */\n.timepicker-digital-display {\n flex: 1 auto;\n background-color: $secondary-color;\n padding: 10px;\n font-weight: 300;\n}\n\n.timepicker-text-container {\n\tfont-size: 4rem;\n\tfont-weight: bold;\n\ttext-align: center;\n\tcolor: rgba(255, 255, 255, 0.6);\n font-weight: 400;\n\tposition: relative;\n user-select: none;\n}\n\n.timepicker-span-hours,\n.timepicker-span-minutes,\n.timepicker-span-am-pm div {\n\tcursor: pointer;\n}\n\n.timepicker-span-hours {\n margin-right: 3px;\n}\n\n.timepicker-span-minutes {\n margin-left: 3px;\n}\n\n.timepicker-display-am-pm {\n font-size: 1.3rem;\n position: absolute;\n right: 1rem;\n bottom: 1rem;\n font-weight: 400;\n}\n\n\n/* Analog Clock Display */\n.timepicker-analog-display {\n flex: 2.5 auto;\n}\n\n.timepicker-plate {\n\tbackground-color: $timepicker-clock-plate-bg;\n\tborder-radius: 50%;\n\twidth: 270px;\n\theight: 270px;\n\toverflow: visible;\n\tposition: relative;\n margin: auto;\n margin-top: 25px;\n margin-bottom: 5px;\n\tuser-select: none;\n}\n\n.timepicker-canvas,\n.timepicker-dial {\n\tposition: absolute;\n\tleft: 0;\n right: 0;\n top: 0;\n bottom: 0;\n}\n.timepicker-minutes {\n\tvisibility: hidden;\n}\n\n.timepicker-tick {\n\tborder-radius: 50%;\n\tcolor: $timepicker-clock-color;\n\tline-height: 40px;\n\ttext-align: center;\n\twidth: 40px;\n\theight: 40px;\n\tposition: absolute;\n\tcursor: pointer;\n font-size: 15px;\n}\n\n.timepicker-tick.active,\n.timepicker-tick:hover {\n\tbackground-color: transparentize($secondary-color, .75);\n}\n.timepicker-dial {\n\ttransition: transform 350ms, opacity 350ms;\n}\n.timepicker-dial-out {\n &.timepicker-hours {\n\t transform: scale(1.1, 1.1);\n }\n\n &.timepicker-minutes {\n\t transform: scale(.8, .8);\n }\n\n\topacity: 0;\n}\n.timepicker-canvas {\n\ttransition: opacity 175ms;\n\n line {\n\t stroke: $secondary-color;\n\t stroke-width: 4;\n\t stroke-linecap: round;\n }\n}\n.timepicker-canvas-out {\n\topacity: 0.25;\n}\n.timepicker-canvas-bearing {\n\tstroke: none;\n\tfill: $secondary-color;\n}\n.timepicker-canvas-bg {\n\tstroke: none;\n\tfill: $secondary-color;\n}\n\n\n/* Footer */\n.timepicker-footer {\n margin: 0 auto;\n padding: 5px 1rem;\n display: flex;\n justify-content: space-between;\n}\n\n.timepicker-clear {\n color: $error-color;\n}\n\n.timepicker-close {\n color: $secondary-color;\n}\n\n.timepicker-clear,\n.timepicker-close {\n padding: 0 20px;\n}\n\n/* Media Queries */\n@media #{$medium-and-up} {\n .timepicker-modal {\n max-width: 600px;\n }\n\n .timepicker-container.modal-content {\n flex-direction: row;\n }\n\n .timepicker-text-container {\n\t\ttop: 32%;\n\t}\n\n\t.timepicker-display-am-pm {\n\t position: relative;\n\t right: auto;\n\t bottom: auto;\n\t text-align: center;\n\t margin-top: 1.2rem;\n\t}\n}\n","body {\n max-height: 100vh;\n overflow-y: scroll;\n}\n\nmain {\n height: calc(100vh - 124px);\n overflow-y: scroll;\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n"],"file":"main.css"} \ No newline at end of file diff --git a/assets/css/materialize.scss b/assets/css/materialize.scss new file mode 100644 index 0000000..6a51657 --- /dev/null +++ b/assets/css/materialize.scss @@ -0,0 +1,41 @@ +@charset "UTF-8"; + +// Color +@import "components/color-variables"; +@import "components/color-classes"; + +// Variables; +@import "components/variables"; + +// Reset +@import "components/normalize"; + +// components +@import "components/global"; +@import "components/badges"; +@import "components/icons-material-design"; +@import "components/grid"; +@import "components/navbar"; +@import "components/typography"; +@import "components/transitions"; +@import "components/cards"; +@import "components/toast"; +@import "components/tabs"; +@import "components/tooltip"; +@import "components/buttons"; +@import "components/dropdown"; +@import "components/waves"; +@import "components/modal"; +@import "components/collapsible"; +@import "components/chips"; +@import "components/materialbox"; +@import "components/forms/forms"; +@import "components/table_of_contents"; +@import "components/sidenav"; +@import "components/preloader"; +@import "components/slider"; +@import "components/carousel"; +@import "components/tapTarget"; +@import "components/pulse"; +@import "components/datepicker"; +@import "components/timepicker"; diff --git a/assets/css/normalize.css b/assets/css/normalize.css new file mode 100644 index 0000000..192eb9c --- /dev/null +++ b/assets/css/normalize.css @@ -0,0 +1,349 @@ +/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ + +/* Document + ========================================================================== */ + +/** + * 1. Correct the line height in all browsers. + * 2. Prevent adjustments of font size after orientation changes in iOS. + */ + +html { + line-height: 1.15; /* 1 */ + -webkit-text-size-adjust: 100%; /* 2 */ +} + +/* Sections + ========================================================================== */ + +/** + * Remove the margin in all browsers. + */ + +body { + margin: 0; +} + +/** + * Render the `main` element consistently in IE. + */ + +main { + display: block; +} + +/** + * Correct the font size and margin on `h1` elements within `section` and + * `article` contexts in Chrome, Firefox, and Safari. + */ + +h1 { + font-size: 2em; + margin: 0.67em 0; +} + +/* Grouping content + ========================================================================== */ + +/** + * 1. Add the correct box sizing in Firefox. + * 2. Show the overflow in Edge and IE. + */ + +hr { + box-sizing: content-box; /* 1 */ + height: 0; /* 1 */ + overflow: visible; /* 2 */ +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + +pre { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/* Text-level semantics + ========================================================================== */ + +/** + * Remove the gray background on active links in IE 10. + */ + +a { + background-color: transparent; +} + +/** + * 1. Remove the bottom border in Chrome 57- + * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. + */ + +abbr[title] { + border-bottom: none; /* 1 */ + text-decoration: underline; /* 2 */ + text-decoration: underline dotted; /* 2 */ +} + +/** + * Add the correct font weight in Chrome, Edge, and Safari. + */ + +b, +strong { + font-weight: bolder; +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ + +code, +kbd, +samp { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} + +/** + * Add the correct font size in all browsers. + */ + +small { + font-size: 80%; +} + +/** + * Prevent `sub` and `sup` elements from affecting the line height in + * all browsers. + */ + +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sub { + bottom: -0.25em; +} + +sup { + top: -0.5em; +} + +/* Embedded content + ========================================================================== */ + +/** + * Remove the border on images inside links in IE 10. + */ + +img { + border-style: none; +} + +/* Forms + ========================================================================== */ + +/** + * 1. Change the font styles in all browsers. + * 2. Remove the margin in Firefox and Safari. + */ + +button, +input, +optgroup, +select, +textarea { + font-family: inherit; /* 1 */ + font-size: 100%; /* 1 */ + line-height: 1.15; /* 1 */ + margin: 0; /* 2 */ +} + +/** + * Show the overflow in IE. + * 1. Show the overflow in Edge. + */ + +button, +input { /* 1 */ + overflow: visible; +} + +/** + * Remove the inheritance of text transform in Edge, Firefox, and IE. + * 1. Remove the inheritance of text transform in Firefox. + */ + +button, +select { /* 1 */ + text-transform: none; +} + +/** + * Correct the inability to style clickable types in iOS and Safari. + */ + +button, +[type="button"], +[type="reset"], +[type="submit"] { + -webkit-appearance: button; +} + +/** + * Remove the inner border and padding in Firefox. + */ + +button::-moz-focus-inner, +[type="button"]::-moz-focus-inner, +[type="reset"]::-moz-focus-inner, +[type="submit"]::-moz-focus-inner { + border-style: none; + padding: 0; +} + +/** + * Restore the focus styles unset by the previous rule. + */ + +button:-moz-focusring, +[type="button"]:-moz-focusring, +[type="reset"]:-moz-focusring, +[type="submit"]:-moz-focusring { + outline: 1px dotted ButtonText; +} + +/** + * Correct the padding in Firefox. + */ + +fieldset { + padding: 0.35em 0.75em 0.625em; +} + +/** + * 1. Correct the text wrapping in Edge and IE. + * 2. Correct the color inheritance from `fieldset` elements in IE. + * 3. Remove the padding so developers are not caught out when they zero out + * `fieldset` elements in all browsers. + */ + +legend { + box-sizing: border-box; /* 1 */ + color: inherit; /* 2 */ + display: table; /* 1 */ + max-width: 100%; /* 1 */ + padding: 0; /* 3 */ + white-space: normal; /* 1 */ +} + +/** + * Add the correct vertical alignment in Chrome, Firefox, and Opera. + */ + +progress { + vertical-align: baseline; +} + +/** + * Remove the default vertical scrollbar in IE 10+. + */ + +textarea { + overflow: auto; +} + +/** + * 1. Add the correct box sizing in IE 10. + * 2. Remove the padding in IE 10. + */ + +[type="checkbox"], +[type="radio"] { + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ +} + +/** + * Correct the cursor style of increment and decrement buttons in Chrome. + */ + +[type="number"]::-webkit-inner-spin-button, +[type="number"]::-webkit-outer-spin-button { + height: auto; +} + +/** + * 1. Correct the odd appearance in Chrome and Safari. + * 2. Correct the outline style in Safari. + */ + +[type="search"] { + -webkit-appearance: textfield; /* 1 */ + outline-offset: -2px; /* 2 */ +} + +/** + * Remove the inner padding in Chrome and Safari on macOS. + */ + +[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} + +/** + * 1. Correct the inability to style clickable types in iOS and Safari. + * 2. Change font properties to `inherit` in Safari. + */ + +::-webkit-file-upload-button { + -webkit-appearance: button; /* 1 */ + font: inherit; /* 2 */ +} + +/* Interactive + ========================================================================== */ + +/* + * Add the correct display in Edge, IE 10+, and Firefox. + */ + +details { + display: block; +} + +/* + * Add the correct display in all browsers. + */ + +summary { + display: list-item; +} + +/* Misc + ========================================================================== */ + +/** + * Add the correct display in IE 10+. + */ + +template { + display: none; +} + +/** + * Add the correct display in IE 10. + */ + +[hidden] { + display: none; +} diff --git a/assets/fonts/BlenderProBook.woff2 b/assets/fonts/BlenderProBook.woff2 new file mode 100644 index 0000000..452b36d Binary files /dev/null and b/assets/fonts/BlenderProBook.woff2 differ diff --git a/assets/fonts/Cyberpunk.otf b/assets/fonts/Cyberpunk.otf new file mode 100644 index 0000000..38032d6 Binary files /dev/null and b/assets/fonts/Cyberpunk.otf differ diff --git a/assets/fonts/Oxanium.woff2 b/assets/fonts/Oxanium.woff2 new file mode 100644 index 0000000..23b5e94 Binary files /dev/null and b/assets/fonts/Oxanium.woff2 differ diff --git a/assets/js/materialize.min.js b/assets/js/materialize.min.js new file mode 100644 index 0000000..4ff077d --- /dev/null +++ b/assets/js/materialize.min.js @@ -0,0 +1,6 @@ +/*! + * Materialize v1.0.0 (http://materializecss.com) + * Copyright 2014-2017 Materialize + * MIT License (https://raw.githubusercontent.com/Dogfalo/materialize/master/LICENSE) + */ +var _get=function t(e,i,n){null===e&&(e=Function.prototype);var s=Object.getOwnPropertyDescriptor(e,i);if(void 0===s){var o=Object.getPrototypeOf(e);return null===o?void 0:t(o,i,n)}if("value"in s)return s.value;var a=s.get;return void 0!==a?a.call(n):void 0},_createClass=function(){function n(t,e){for(var i=0;i/,p=/^\w+$/;function v(t,e){e=e||o;var i=u.test(t)?e.getElementsByClassName(t.slice(1)):p.test(t)?e.getElementsByTagName(t):e.querySelectorAll(t);return i}function f(t){if(!i){var e=(i=o.implementation.createHTMLDocument(null)).createElement("base");e.href=o.location.href,i.head.appendChild(e)}return i.body.innerHTML=t,i.body.childNodes}function m(t){"loading"!==o.readyState?t():o.addEventListener("DOMContentLoaded",t)}function g(t,e){if(!t)return this;if(t.cash&&t!==a)return t;var i,n=t,s=0;if(d(t))n=l.test(t)?o.getElementById(t.slice(1)):c.test(t)?f(t):v(t,e);else if(h(t))return m(t),this;if(!n)return this;if(n.nodeType||n===a)this[0]=n,this.length=1;else for(i=this.length=n.length;ss.right-i||l+e.width>window.innerWidth-i)&&(n.right=!0),(ho-i||h+e.height>window.innerHeight-i)&&(n.bottom=!0),n},M.checkPossibleAlignments=function(t,e,i,n){var s={top:!0,right:!0,bottom:!0,left:!0,spaceOnTop:null,spaceOnRight:null,spaceOnBottom:null,spaceOnLeft:null},o="visible"===getComputedStyle(e).overflow,a=e.getBoundingClientRect(),r=Math.min(a.height,window.innerHeight),l=Math.min(a.width,window.innerWidth),h=t.getBoundingClientRect(),d=e.scrollLeft,u=e.scrollTop,c=i.left-d,p=i.top-u,v=i.top+h.height-u;return s.spaceOnRight=o?window.innerWidth-(h.left+i.width):l-(c+i.width),s.spaceOnRight<0&&(s.left=!1),s.spaceOnLeft=o?h.right-i.width:c-i.width+h.width,s.spaceOnLeft<0&&(s.right=!1),s.spaceOnBottom=o?window.innerHeight-(h.top+i.height+n):r-(p+i.height+n),s.spaceOnBottom<0&&(s.top=!1),s.spaceOnTop=o?h.bottom-(i.height+n):v-(i.height-n),s.spaceOnTop<0&&(s.bottom=!1),s},M.getOverflowParent=function(t){return null==t?null:t===document.body||"visible"!==getComputedStyle(t).overflow?t:M.getOverflowParent(t.parentElement)},M.getIdFromTrigger=function(t){var e=t.getAttribute("data-target");return e||(e=(e=t.getAttribute("href"))?e.slice(1):""),e},M.getDocumentScrollTop=function(){return window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0},M.getDocumentScrollLeft=function(){return window.pageXOffset||document.documentElement.scrollLeft||document.body.scrollLeft||0};var getTime=Date.now||function(){return(new Date).getTime()};M.throttle=function(i,n,s){var o=void 0,a=void 0,r=void 0,l=null,h=0;s||(s={});var d=function(){h=!1===s.leading?0:getTime(),l=null,r=i.apply(o,a),o=a=null};return function(){var t=getTime();h||!1!==s.leading||(h=t);var e=n-(t-h);return o=this,a=arguments,e<=0?(clearTimeout(l),l=null,h=t,r=i.apply(o,a),o=a=null):l||!1===s.trailing||(l=setTimeout(d,e)),r}};var $jscomp={scope:{}};$jscomp.defineProperty="function"==typeof Object.defineProperties?Object.defineProperty:function(t,e,i){if(i.get||i.set)throw new TypeError("ES3 does not support getters and setters.");t!=Array.prototype&&t!=Object.prototype&&(t[e]=i.value)},$jscomp.getGlobal=function(t){return"undefined"!=typeof window&&window===t?t:"undefined"!=typeof global&&null!=global?global:t},$jscomp.global=$jscomp.getGlobal(this),$jscomp.SYMBOL_PREFIX="jscomp_symbol_",$jscomp.initSymbol=function(){$jscomp.initSymbol=function(){},$jscomp.global.Symbol||($jscomp.global.Symbol=$jscomp.Symbol)},$jscomp.symbolCounter_=0,$jscomp.Symbol=function(t){return $jscomp.SYMBOL_PREFIX+(t||"")+$jscomp.symbolCounter_++},$jscomp.initSymbolIterator=function(){$jscomp.initSymbol();var t=$jscomp.global.Symbol.iterator;t||(t=$jscomp.global.Symbol.iterator=$jscomp.global.Symbol("iterator")),"function"!=typeof Array.prototype[t]&&$jscomp.defineProperty(Array.prototype,t,{configurable:!0,writable:!0,value:function(){return $jscomp.arrayIterator(this)}}),$jscomp.initSymbolIterator=function(){}},$jscomp.arrayIterator=function(t){var e=0;return $jscomp.iteratorPrototype(function(){return e=k.currentTime)for(var h=0;ht&&(s.duration=e.duration),s.children.push(e)}),s.seek(0),s.reset(),s.autoplay&&s.restart(),s},s},O.random=function(t,e){return Math.floor(Math.random()*(e-t+1))+t},O}(),function(r,l){"use strict";var e={accordion:!0,onOpenStart:void 0,onOpenEnd:void 0,onCloseStart:void 0,onCloseEnd:void 0,inDuration:300,outDuration:300},t=function(t){function s(t,e){_classCallCheck(this,s);var i=_possibleConstructorReturn(this,(s.__proto__||Object.getPrototypeOf(s)).call(this,s,t,e));(i.el.M_Collapsible=i).options=r.extend({},s.defaults,e),i.$headers=i.$el.children("li").children(".collapsible-header"),i.$headers.attr("tabindex",0),i._setupEventHandlers();var n=i.$el.children("li.active").children(".collapsible-body");return i.options.accordion?n.first().css("display","block"):n.css("display","block"),i}return _inherits(s,Component),_createClass(s,[{key:"destroy",value:function(){this._removeEventHandlers(),this.el.M_Collapsible=void 0}},{key:"_setupEventHandlers",value:function(){var e=this;this._handleCollapsibleClickBound=this._handleCollapsibleClick.bind(this),this._handleCollapsibleKeydownBound=this._handleCollapsibleKeydown.bind(this),this.el.addEventListener("click",this._handleCollapsibleClickBound),this.$headers.each(function(t){t.addEventListener("keydown",e._handleCollapsibleKeydownBound)})}},{key:"_removeEventHandlers",value:function(){var e=this;this.el.removeEventListener("click",this._handleCollapsibleClickBound),this.$headers.each(function(t){t.removeEventListener("keydown",e._handleCollapsibleKeydownBound)})}},{key:"_handleCollapsibleClick",value:function(t){var e=r(t.target).closest(".collapsible-header");if(t.target&&e.length){var i=e.closest(".collapsible");if(i[0]===this.el){var n=e.closest("li"),s=i.children("li"),o=n[0].classList.contains("active"),a=s.index(n);o?this.close(a):this.open(a)}}}},{key:"_handleCollapsibleKeydown",value:function(t){13===t.keyCode&&this._handleCollapsibleClickBound(t)}},{key:"_animateIn",value:function(t){var e=this,i=this.$el.children("li").eq(t);if(i.length){var n=i.children(".collapsible-body");l.remove(n[0]),n.css({display:"block",overflow:"hidden",height:0,paddingTop:"",paddingBottom:""});var s=n.css("padding-top"),o=n.css("padding-bottom"),a=n[0].scrollHeight;n.css({paddingTop:0,paddingBottom:0}),l({targets:n[0],height:a,paddingTop:s,paddingBottom:o,duration:this.options.inDuration,easing:"easeInOutCubic",complete:function(t){n.css({overflow:"",paddingTop:"",paddingBottom:"",height:""}),"function"==typeof e.options.onOpenEnd&&e.options.onOpenEnd.call(e,i[0])}})}}},{key:"_animateOut",value:function(t){var e=this,i=this.$el.children("li").eq(t);if(i.length){var n=i.children(".collapsible-body");l.remove(n[0]),n.css("overflow","hidden"),l({targets:n[0],height:0,paddingTop:0,paddingBottom:0,duration:this.options.outDuration,easing:"easeInOutCubic",complete:function(){n.css({height:"",overflow:"",padding:"",display:""}),"function"==typeof e.options.onCloseEnd&&e.options.onCloseEnd.call(e,i[0])}})}}},{key:"open",value:function(t){var i=this,e=this.$el.children("li").eq(t);if(e.length&&!e[0].classList.contains("active")){if("function"==typeof this.options.onOpenStart&&this.options.onOpenStart.call(this,e[0]),this.options.accordion){var n=this.$el.children("li");this.$el.children("li.active").each(function(t){var e=n.index(r(t));i.close(e)})}e[0].classList.add("active"),this._animateIn(t)}}},{key:"close",value:function(t){var e=this.$el.children("li").eq(t);e.length&&e[0].classList.contains("active")&&("function"==typeof this.options.onCloseStart&&this.options.onCloseStart.call(this,e[0]),e[0].classList.remove("active"),this._animateOut(t))}}],[{key:"init",value:function(t,e){return _get(s.__proto__||Object.getPrototypeOf(s),"init",this).call(this,this,t,e)}},{key:"getInstance",value:function(t){return(t.jquery?t[0]:t).M_Collapsible}},{key:"defaults",get:function(){return e}}]),s}();M.Collapsible=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"collapsible","M_Collapsible")}(cash,M.anime),function(h,i){"use strict";var e={alignment:"left",autoFocus:!0,constrainWidth:!0,container:null,coverTrigger:!0,closeOnClick:!0,hover:!1,inDuration:150,outDuration:250,onOpenStart:null,onOpenEnd:null,onCloseStart:null,onCloseEnd:null,onItemClick:null},t=function(t){function n(t,e){_classCallCheck(this,n);var i=_possibleConstructorReturn(this,(n.__proto__||Object.getPrototypeOf(n)).call(this,n,t,e));return i.el.M_Dropdown=i,n._dropdowns.push(i),i.id=M.getIdFromTrigger(t),i.dropdownEl=document.getElementById(i.id),i.$dropdownEl=h(i.dropdownEl),i.options=h.extend({},n.defaults,e),i.isOpen=!1,i.isScrollable=!1,i.isTouchMoving=!1,i.focusedIndex=-1,i.filterQuery=[],i.options.container?h(i.options.container).append(i.dropdownEl):i.$el.after(i.dropdownEl),i._makeDropdownFocusable(),i._resetFilterQueryBound=i._resetFilterQuery.bind(i),i._handleDocumentClickBound=i._handleDocumentClick.bind(i),i._handleDocumentTouchmoveBound=i._handleDocumentTouchmove.bind(i),i._handleDropdownClickBound=i._handleDropdownClick.bind(i),i._handleDropdownKeydownBound=i._handleDropdownKeydown.bind(i),i._handleTriggerKeydownBound=i._handleTriggerKeydown.bind(i),i._setupEventHandlers(),i}return _inherits(n,Component),_createClass(n,[{key:"destroy",value:function(){this._resetDropdownStyles(),this._removeEventHandlers(),n._dropdowns.splice(n._dropdowns.indexOf(this),1),this.el.M_Dropdown=void 0}},{key:"_setupEventHandlers",value:function(){this.el.addEventListener("keydown",this._handleTriggerKeydownBound),this.dropdownEl.addEventListener("click",this._handleDropdownClickBound),this.options.hover?(this._handleMouseEnterBound=this._handleMouseEnter.bind(this),this.el.addEventListener("mouseenter",this._handleMouseEnterBound),this._handleMouseLeaveBound=this._handleMouseLeave.bind(this),this.el.addEventListener("mouseleave",this._handleMouseLeaveBound),this.dropdownEl.addEventListener("mouseleave",this._handleMouseLeaveBound)):(this._handleClickBound=this._handleClick.bind(this),this.el.addEventListener("click",this._handleClickBound))}},{key:"_removeEventHandlers",value:function(){this.el.removeEventListener("keydown",this._handleTriggerKeydownBound),this.dropdownEl.removeEventListener("click",this._handleDropdownClickBound),this.options.hover?(this.el.removeEventListener("mouseenter",this._handleMouseEnterBound),this.el.removeEventListener("mouseleave",this._handleMouseLeaveBound),this.dropdownEl.removeEventListener("mouseleave",this._handleMouseLeaveBound)):this.el.removeEventListener("click",this._handleClickBound)}},{key:"_setupTemporaryEventHandlers",value:function(){document.body.addEventListener("click",this._handleDocumentClickBound,!0),document.body.addEventListener("touchend",this._handleDocumentClickBound),document.body.addEventListener("touchmove",this._handleDocumentTouchmoveBound),this.dropdownEl.addEventListener("keydown",this._handleDropdownKeydownBound)}},{key:"_removeTemporaryEventHandlers",value:function(){document.body.removeEventListener("click",this._handleDocumentClickBound,!0),document.body.removeEventListener("touchend",this._handleDocumentClickBound),document.body.removeEventListener("touchmove",this._handleDocumentTouchmoveBound),this.dropdownEl.removeEventListener("keydown",this._handleDropdownKeydownBound)}},{key:"_handleClick",value:function(t){t.preventDefault(),this.open()}},{key:"_handleMouseEnter",value:function(){this.open()}},{key:"_handleMouseLeave",value:function(t){var e=t.toElement||t.relatedTarget,i=!!h(e).closest(".dropdown-content").length,n=!1,s=h(e).closest(".dropdown-trigger");s.length&&s[0].M_Dropdown&&s[0].M_Dropdown.isOpen&&(n=!0),n||i||this.close()}},{key:"_handleDocumentClick",value:function(t){var e=this,i=h(t.target);this.options.closeOnClick&&i.closest(".dropdown-content").length&&!this.isTouchMoving?setTimeout(function(){e.close()},0):!i.closest(".dropdown-trigger").length&&i.closest(".dropdown-content").length||setTimeout(function(){e.close()},0),this.isTouchMoving=!1}},{key:"_handleTriggerKeydown",value:function(t){t.which!==M.keys.ARROW_DOWN&&t.which!==M.keys.ENTER||this.isOpen||(t.preventDefault(),this.open())}},{key:"_handleDocumentTouchmove",value:function(t){h(t.target).closest(".dropdown-content").length&&(this.isTouchMoving=!0)}},{key:"_handleDropdownClick",value:function(t){if("function"==typeof this.options.onItemClick){var e=h(t.target).closest("li")[0];this.options.onItemClick.call(this,e)}}},{key:"_handleDropdownKeydown",value:function(t){if(t.which===M.keys.TAB)t.preventDefault(),this.close();else if(t.which!==M.keys.ARROW_DOWN&&t.which!==M.keys.ARROW_UP||!this.isOpen)if(t.which===M.keys.ENTER&&this.isOpen){var e=this.dropdownEl.children[this.focusedIndex],i=h(e).find("a, button").first();i.length?i[0].click():e&&e.click()}else t.which===M.keys.ESC&&this.isOpen&&(t.preventDefault(),this.close());else{t.preventDefault();var n=t.which===M.keys.ARROW_DOWN?1:-1,s=this.focusedIndex,o=!1;do{if(s+=n,this.dropdownEl.children[s]&&-1!==this.dropdownEl.children[s].tabIndex){o=!0;break}}while(sl.spaceOnBottom?(h="bottom",i+=l.spaceOnTop,o-=l.spaceOnTop):i+=l.spaceOnBottom)),!l[d]){var u="left"===d?"right":"left";l[u]?d=u:l.spaceOnLeft>l.spaceOnRight?(d="right",n+=l.spaceOnLeft,s-=l.spaceOnLeft):(d="left",n+=l.spaceOnRight)}return"bottom"===h&&(o=o-e.height+(this.options.coverTrigger?t.height:0)),"right"===d&&(s=s-e.width+t.width),{x:s,y:o,verticalAlignment:h,horizontalAlignment:d,height:i,width:n}}},{key:"_animateIn",value:function(){var e=this;i.remove(this.dropdownEl),i({targets:this.dropdownEl,opacity:{value:[0,1],easing:"easeOutQuad"},scaleX:[.3,1],scaleY:[.3,1],duration:this.options.inDuration,easing:"easeOutQuint",complete:function(t){e.options.autoFocus&&e.dropdownEl.focus(),"function"==typeof e.options.onOpenEnd&&e.options.onOpenEnd.call(e,e.el)}})}},{key:"_animateOut",value:function(){var e=this;i.remove(this.dropdownEl),i({targets:this.dropdownEl,opacity:{value:0,easing:"easeOutQuint"},scaleX:.3,scaleY:.3,duration:this.options.outDuration,easing:"easeOutQuint",complete:function(t){e._resetDropdownStyles(),"function"==typeof e.options.onCloseEnd&&e.options.onCloseEnd.call(e,e.el)}})}},{key:"_placeDropdown",value:function(){var t=this.options.constrainWidth?this.el.getBoundingClientRect().width:this.dropdownEl.getBoundingClientRect().width;this.dropdownEl.style.width=t+"px";var e=this._getDropdownPosition();this.dropdownEl.style.left=e.x+"px",this.dropdownEl.style.top=e.y+"px",this.dropdownEl.style.height=e.height+"px",this.dropdownEl.style.width=e.width+"px",this.dropdownEl.style.transformOrigin=("left"===e.horizontalAlignment?"0":"100%")+" "+("top"===e.verticalAlignment?"0":"100%")}},{key:"open",value:function(){this.isOpen||(this.isOpen=!0,"function"==typeof this.options.onOpenStart&&this.options.onOpenStart.call(this,this.el),this._resetDropdownStyles(),this.dropdownEl.style.display="block",this._placeDropdown(),this._animateIn(),this._setupTemporaryEventHandlers())}},{key:"close",value:function(){this.isOpen&&(this.isOpen=!1,this.focusedIndex=-1,"function"==typeof this.options.onCloseStart&&this.options.onCloseStart.call(this,this.el),this._animateOut(),this._removeTemporaryEventHandlers(),this.options.autoFocus&&this.el.focus())}},{key:"recalculateDimensions",value:function(){this.isOpen&&(this.$dropdownEl.css({width:"",height:"",left:"",top:"","transform-origin":""}),this._placeDropdown())}}],[{key:"init",value:function(t,e){return _get(n.__proto__||Object.getPrototypeOf(n),"init",this).call(this,this,t,e)}},{key:"getInstance",value:function(t){return(t.jquery?t[0]:t).M_Dropdown}},{key:"defaults",get:function(){return e}}]),n}();t._dropdowns=[],M.Dropdown=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"dropdown","M_Dropdown")}(cash,M.anime),function(s,i){"use strict";var e={opacity:.5,inDuration:250,outDuration:250,onOpenStart:null,onOpenEnd:null,onCloseStart:null,onCloseEnd:null,preventScrolling:!0,dismissible:!0,startingTop:"4%",endingTop:"10%"},t=function(t){function n(t,e){_classCallCheck(this,n);var i=_possibleConstructorReturn(this,(n.__proto__||Object.getPrototypeOf(n)).call(this,n,t,e));return(i.el.M_Modal=i).options=s.extend({},n.defaults,e),i.isOpen=!1,i.id=i.$el.attr("id"),i._openingTrigger=void 0,i.$overlay=s(''),i.el.tabIndex=0,i._nthModalOpened=0,n._count++,i._setupEventHandlers(),i}return _inherits(n,Component),_createClass(n,[{key:"destroy",value:function(){n._count--,this._removeEventHandlers(),this.el.removeAttribute("style"),this.$overlay.remove(),this.el.M_Modal=void 0}},{key:"_setupEventHandlers",value:function(){this._handleOverlayClickBound=this._handleOverlayClick.bind(this),this._handleModalCloseClickBound=this._handleModalCloseClick.bind(this),1===n._count&&document.body.addEventListener("click",this._handleTriggerClick),this.$overlay[0].addEventListener("click",this._handleOverlayClickBound),this.el.addEventListener("click",this._handleModalCloseClickBound)}},{key:"_removeEventHandlers",value:function(){0===n._count&&document.body.removeEventListener("click",this._handleTriggerClick),this.$overlay[0].removeEventListener("click",this._handleOverlayClickBound),this.el.removeEventListener("click",this._handleModalCloseClickBound)}},{key:"_handleTriggerClick",value:function(t){var e=s(t.target).closest(".modal-trigger");if(e.length){var i=M.getIdFromTrigger(e[0]),n=document.getElementById(i).M_Modal;n&&n.open(e),t.preventDefault()}}},{key:"_handleOverlayClick",value:function(){this.options.dismissible&&this.close()}},{key:"_handleModalCloseClick",value:function(t){s(t.target).closest(".modal-close").length&&this.close()}},{key:"_handleKeydown",value:function(t){27===t.keyCode&&this.options.dismissible&&this.close()}},{key:"_handleFocus",value:function(t){this.el.contains(t.target)||this._nthModalOpened!==n._modalsOpen||this.el.focus()}},{key:"_animateIn",value:function(){var t=this;s.extend(this.el.style,{display:"block",opacity:0}),s.extend(this.$overlay[0].style,{display:"block",opacity:0}),i({targets:this.$overlay[0],opacity:this.options.opacity,duration:this.options.inDuration,easing:"easeOutQuad"});var e={targets:this.el,duration:this.options.inDuration,easing:"easeOutCubic",complete:function(){"function"==typeof t.options.onOpenEnd&&t.options.onOpenEnd.call(t,t.el,t._openingTrigger)}};this.el.classList.contains("bottom-sheet")?s.extend(e,{bottom:0,opacity:1}):s.extend(e,{top:[this.options.startingTop,this.options.endingTop],opacity:1,scaleX:[.8,1],scaleY:[.8,1]}),i(e)}},{key:"_animateOut",value:function(){var t=this;i({targets:this.$overlay[0],opacity:0,duration:this.options.outDuration,easing:"easeOutQuart"});var e={targets:this.el,duration:this.options.outDuration,easing:"easeOutCubic",complete:function(){t.el.style.display="none",t.$overlay.remove(),"function"==typeof t.options.onCloseEnd&&t.options.onCloseEnd.call(t,t.el)}};this.el.classList.contains("bottom-sheet")?s.extend(e,{bottom:"-100%",opacity:0}):s.extend(e,{top:[this.options.endingTop,this.options.startingTop],opacity:0,scaleX:.8,scaleY:.8}),i(e)}},{key:"open",value:function(t){if(!this.isOpen)return this.isOpen=!0,n._modalsOpen++,this._nthModalOpened=n._modalsOpen,this.$overlay[0].style.zIndex=1e3+2*n._modalsOpen,this.el.style.zIndex=1e3+2*n._modalsOpen+1,this._openingTrigger=t?t[0]:void 0,"function"==typeof this.options.onOpenStart&&this.options.onOpenStart.call(this,this.el,this._openingTrigger),this.options.preventScrolling&&(document.body.style.overflow="hidden"),this.el.classList.add("open"),this.el.insertAdjacentElement("afterend",this.$overlay[0]),this.options.dismissible&&(this._handleKeydownBound=this._handleKeydown.bind(this),this._handleFocusBound=this._handleFocus.bind(this),document.addEventListener("keydown",this._handleKeydownBound),document.addEventListener("focus",this._handleFocusBound,!0)),i.remove(this.el),i.remove(this.$overlay[0]),this._animateIn(),this.el.focus(),this}},{key:"close",value:function(){if(this.isOpen)return this.isOpen=!1,n._modalsOpen--,this._nthModalOpened=0,"function"==typeof this.options.onCloseStart&&this.options.onCloseStart.call(this,this.el),this.el.classList.remove("open"),0===n._modalsOpen&&(document.body.style.overflow=""),this.options.dismissible&&(document.removeEventListener("keydown",this._handleKeydownBound),document.removeEventListener("focus",this._handleFocusBound,!0)),i.remove(this.el),i.remove(this.$overlay[0]),this._animateOut(),this}}],[{key:"init",value:function(t,e){return _get(n.__proto__||Object.getPrototypeOf(n),"init",this).call(this,this,t,e)}},{key:"getInstance",value:function(t){return(t.jquery?t[0]:t).M_Modal}},{key:"defaults",get:function(){return e}}]),n}();t._modalsOpen=0,t._count=0,M.Modal=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"modal","M_Modal")}(cash,M.anime),function(o,a){"use strict";var e={inDuration:275,outDuration:200,onOpenStart:null,onOpenEnd:null,onCloseStart:null,onCloseEnd:null},t=function(t){function n(t,e){_classCallCheck(this,n);var i=_possibleConstructorReturn(this,(n.__proto__||Object.getPrototypeOf(n)).call(this,n,t,e));return(i.el.M_Materialbox=i).options=o.extend({},n.defaults,e),i.overlayActive=!1,i.doneAnimating=!0,i.placeholder=o("
").addClass("material-placeholder"),i.originalWidth=0,i.originalHeight=0,i.originInlineStyles=i.$el.attr("style"),i.caption=i.el.getAttribute("data-caption")||"",i.$el.before(i.placeholder),i.placeholder.append(i.$el),i._setupEventHandlers(),i}return _inherits(n,Component),_createClass(n,[{key:"destroy",value:function(){this._removeEventHandlers(),this.el.M_Materialbox=void 0,o(this.placeholder).after(this.el).remove(),this.$el.removeAttr("style")}},{key:"_setupEventHandlers",value:function(){this._handleMaterialboxClickBound=this._handleMaterialboxClick.bind(this),this.el.addEventListener("click",this._handleMaterialboxClickBound)}},{key:"_removeEventHandlers",value:function(){this.el.removeEventListener("click",this._handleMaterialboxClickBound)}},{key:"_handleMaterialboxClick",value:function(t){!1===this.doneAnimating||this.overlayActive&&this.doneAnimating?this.close():this.open()}},{key:"_handleWindowScroll",value:function(){this.overlayActive&&this.close()}},{key:"_handleWindowResize",value:function(){this.overlayActive&&this.close()}},{key:"_handleWindowEscape",value:function(t){27===t.keyCode&&this.doneAnimating&&this.overlayActive&&this.close()}},{key:"_makeAncestorsOverflowVisible",value:function(){this.ancestorsChanged=o();for(var t=this.placeholder[0].parentNode;null!==t&&!o(t).is(document);){var e=o(t);"visible"!==e.css("overflow")&&(e.css("overflow","visible"),void 0===this.ancestorsChanged?this.ancestorsChanged=e:this.ancestorsChanged=this.ancestorsChanged.add(e)),t=t.parentNode}}},{key:"_animateImageIn",value:function(){var t=this,e={targets:this.el,height:[this.originalHeight,this.newHeight],width:[this.originalWidth,this.newWidth],left:M.getDocumentScrollLeft()+this.windowWidth/2-this.placeholder.offset().left-this.newWidth/2,top:M.getDocumentScrollTop()+this.windowHeight/2-this.placeholder.offset().top-this.newHeight/2,duration:this.options.inDuration,easing:"easeOutQuad",complete:function(){t.doneAnimating=!0,"function"==typeof t.options.onOpenEnd&&t.options.onOpenEnd.call(t,t.el)}};this.maxWidth=this.$el.css("max-width"),this.maxHeight=this.$el.css("max-height"),"none"!==this.maxWidth&&(e.maxWidth=this.newWidth),"none"!==this.maxHeight&&(e.maxHeight=this.newHeight),a(e)}},{key:"_animateImageOut",value:function(){var t=this,e={targets:this.el,width:this.originalWidth,height:this.originalHeight,left:0,top:0,duration:this.options.outDuration,easing:"easeOutQuad",complete:function(){t.placeholder.css({height:"",width:"",position:"",top:"",left:""}),t.attrWidth&&t.$el.attr("width",t.attrWidth),t.attrHeight&&t.$el.attr("height",t.attrHeight),t.$el.removeAttr("style"),t.originInlineStyles&&t.$el.attr("style",t.originInlineStyles),t.$el.removeClass("active"),t.doneAnimating=!0,t.ancestorsChanged.length&&t.ancestorsChanged.css("overflow",""),"function"==typeof t.options.onCloseEnd&&t.options.onCloseEnd.call(t,t.el)}};a(e)}},{key:"_updateVars",value:function(){this.windowWidth=window.innerWidth,this.windowHeight=window.innerHeight,this.caption=this.el.getAttribute("data-caption")||""}},{key:"open",value:function(){var t=this;this._updateVars(),this.originalWidth=this.el.getBoundingClientRect().width,this.originalHeight=this.el.getBoundingClientRect().height,this.doneAnimating=!1,this.$el.addClass("active"),this.overlayActive=!0,"function"==typeof this.options.onOpenStart&&this.options.onOpenStart.call(this,this.el),this.placeholder.css({width:this.placeholder[0].getBoundingClientRect().width+"px",height:this.placeholder[0].getBoundingClientRect().height+"px",position:"relative",top:0,left:0}),this._makeAncestorsOverflowVisible(),this.$el.css({position:"absolute","z-index":1e3,"will-change":"left, top, width, height"}),this.attrWidth=this.$el.attr("width"),this.attrHeight=this.$el.attr("height"),this.attrWidth&&(this.$el.css("width",this.attrWidth+"px"),this.$el.removeAttr("width")),this.attrHeight&&(this.$el.css("width",this.attrHeight+"px"),this.$el.removeAttr("height")),this.$overlay=o('
').css({opacity:0}).one("click",function(){t.doneAnimating&&t.close()}),this.$el.before(this.$overlay);var e=this.$overlay[0].getBoundingClientRect();this.$overlay.css({width:this.windowWidth+"px",height:this.windowHeight+"px",left:-1*e.left+"px",top:-1*e.top+"px"}),a.remove(this.el),a.remove(this.$overlay[0]),a({targets:this.$overlay[0],opacity:1,duration:this.options.inDuration,easing:"easeOutQuad"}),""!==this.caption&&(this.$photocaption&&a.remove(this.$photoCaption[0]),this.$photoCaption=o('
'),this.$photoCaption.text(this.caption),o("body").append(this.$photoCaption),this.$photoCaption.css({display:"inline"}),a({targets:this.$photoCaption[0],opacity:1,duration:this.options.inDuration,easing:"easeOutQuad"}));var i=0,n=this.originalWidth/this.windowWidth,s=this.originalHeight/this.windowHeight;this.newWidth=0,this.newHeight=0,si.options.responsiveThreshold,i.$img=i.$el.find("img").first(),i.$img.each(function(){this.complete&&s(this).trigger("load")}),i._updateParallax(),i._setupEventHandlers(),i._setupStyles(),n._parallaxes.push(i),i}return _inherits(n,Component),_createClass(n,[{key:"destroy",value:function(){n._parallaxes.splice(n._parallaxes.indexOf(this),1),this.$img[0].style.transform="",this._removeEventHandlers(),this.$el[0].M_Parallax=void 0}},{key:"_setupEventHandlers",value:function(){this._handleImageLoadBound=this._handleImageLoad.bind(this),this.$img[0].addEventListener("load",this._handleImageLoadBound),0===n._parallaxes.length&&(n._handleScrollThrottled=M.throttle(n._handleScroll,5),window.addEventListener("scroll",n._handleScrollThrottled),n._handleWindowResizeThrottled=M.throttle(n._handleWindowResize,5),window.addEventListener("resize",n._handleWindowResizeThrottled))}},{key:"_removeEventHandlers",value:function(){this.$img[0].removeEventListener("load",this._handleImageLoadBound),0===n._parallaxes.length&&(window.removeEventListener("scroll",n._handleScrollThrottled),window.removeEventListener("resize",n._handleWindowResizeThrottled))}},{key:"_setupStyles",value:function(){this.$img[0].style.opacity=1}},{key:"_handleImageLoad",value:function(){this._updateParallax()}},{key:"_updateParallax",value:function(){var t=0e.options.responsiveThreshold}}},{key:"defaults",get:function(){return e}}]),n}();t._parallaxes=[],M.Parallax=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"parallax","M_Parallax")}(cash),function(a,s){"use strict";var e={duration:300,onShow:null,swipeable:!1,responsiveThreshold:1/0},t=function(t){function n(t,e){_classCallCheck(this,n);var i=_possibleConstructorReturn(this,(n.__proto__||Object.getPrototypeOf(n)).call(this,n,t,e));return(i.el.M_Tabs=i).options=a.extend({},n.defaults,e),i.$tabLinks=i.$el.children("li.tab").children("a"),i.index=0,i._setupActiveTabLink(),i.options.swipeable?i._setupSwipeableTabs():i._setupNormalTabs(),i._setTabsAndTabWidth(),i._createIndicator(),i._setupEventHandlers(),i}return _inherits(n,Component),_createClass(n,[{key:"destroy",value:function(){this._removeEventHandlers(),this._indicator.parentNode.removeChild(this._indicator),this.options.swipeable?this._teardownSwipeableTabs():this._teardownNormalTabs(),this.$el[0].M_Tabs=void 0}},{key:"_setupEventHandlers",value:function(){this._handleWindowResizeBound=this._handleWindowResize.bind(this),window.addEventListener("resize",this._handleWindowResizeBound),this._handleTabClickBound=this._handleTabClick.bind(this),this.el.addEventListener("click",this._handleTabClickBound)}},{key:"_removeEventHandlers",value:function(){window.removeEventListener("resize",this._handleWindowResizeBound),this.el.removeEventListener("click",this._handleTabClickBound)}},{key:"_handleWindowResize",value:function(){this._setTabsAndTabWidth(),0!==this.tabWidth&&0!==this.tabsWidth&&(this._indicator.style.left=this._calcLeftPos(this.$activeTabLink)+"px",this._indicator.style.right=this._calcRightPos(this.$activeTabLink)+"px")}},{key:"_handleTabClick",value:function(t){var e=this,i=a(t.target).closest("li.tab"),n=a(t.target).closest("a");if(n.length&&n.parent().hasClass("tab"))if(i.hasClass("disabled"))t.preventDefault();else if(!n.attr("target")){this.$activeTabLink.removeClass("active");var s=this.$content;this.$activeTabLink=n,this.$content=a(M.escapeHash(n[0].hash)),this.$tabLinks=this.$el.children("li.tab").children("a"),this.$activeTabLink.addClass("active");var o=this.index;this.index=Math.max(this.$tabLinks.index(n),0),this.options.swipeable?this._tabsCarousel&&this._tabsCarousel.set(this.index,function(){"function"==typeof e.options.onShow&&e.options.onShow.call(e,e.$content[0])}):this.$content.length&&(this.$content[0].style.display="block",this.$content.addClass("active"),"function"==typeof this.options.onShow&&this.options.onShow.call(this,this.$content[0]),s.length&&!s.is(this.$content)&&(s[0].style.display="none",s.removeClass("active"))),this._setTabsAndTabWidth(),this._animateIndicator(o),t.preventDefault()}}},{key:"_createIndicator",value:function(){var t=this,e=document.createElement("li");e.classList.add("indicator"),this.el.appendChild(e),this._indicator=e,setTimeout(function(){t._indicator.style.left=t._calcLeftPos(t.$activeTabLink)+"px",t._indicator.style.right=t._calcRightPos(t.$activeTabLink)+"px"},0)}},{key:"_setupActiveTabLink",value:function(){this.$activeTabLink=a(this.$tabLinks.filter('[href="'+location.hash+'"]')),0===this.$activeTabLink.length&&(this.$activeTabLink=this.$el.children("li.tab").children("a.active").first()),0===this.$activeTabLink.length&&(this.$activeTabLink=this.$el.children("li.tab").children("a").first()),this.$tabLinks.removeClass("active"),this.$activeTabLink[0].classList.add("active"),this.index=Math.max(this.$tabLinks.index(this.$activeTabLink),0),this.$activeTabLink.length&&(this.$content=a(M.escapeHash(this.$activeTabLink[0].hash)),this.$content.addClass("active"))}},{key:"_setupSwipeableTabs",value:function(){var i=this;window.innerWidth>this.options.responsiveThreshold&&(this.options.swipeable=!1);var n=a();this.$tabLinks.each(function(t){var e=a(M.escapeHash(t.hash));e.addClass("carousel-item"),n=n.add(e)});var t=a('');n.first().before(t),t.append(n),n[0].style.display="";var e=this.$activeTabLink.closest(".tab").index();this._tabsCarousel=M.Carousel.init(t[0],{fullWidth:!0,noWrap:!0,onCycleTo:function(t){var e=i.index;i.index=a(t).index(),i.$activeTabLink.removeClass("active"),i.$activeTabLink=i.$tabLinks.eq(i.index),i.$activeTabLink.addClass("active"),i._animateIndicator(e),"function"==typeof i.options.onShow&&i.options.onShow.call(i,i.$content[0])}}),this._tabsCarousel.set(e)}},{key:"_teardownSwipeableTabs",value:function(){var t=this._tabsCarousel.$el;this._tabsCarousel.destroy(),t.after(t.children()),t.remove()}},{key:"_setupNormalTabs",value:function(){this.$tabLinks.not(this.$activeTabLink).each(function(t){if(t.hash){var e=a(M.escapeHash(t.hash));e.length&&(e[0].style.display="none")}})}},{key:"_teardownNormalTabs",value:function(){this.$tabLinks.each(function(t){if(t.hash){var e=a(M.escapeHash(t.hash));e.length&&(e[0].style.display="")}})}},{key:"_setTabsAndTabWidth",value:function(){this.tabsWidth=this.$el.width(),this.tabWidth=Math.max(this.tabsWidth,this.el.scrollWidth)/this.$tabLinks.length}},{key:"_calcRightPos",value:function(t){return Math.ceil(this.tabsWidth-t.position().left-t[0].getBoundingClientRect().width)}},{key:"_calcLeftPos",value:function(t){return Math.floor(t.position().left)}},{key:"updateTabIndicator",value:function(){this._setTabsAndTabWidth(),this._animateIndicator(this.index)}},{key:"_animateIndicator",value:function(t){var e=0,i=0;0<=this.index-t?e=90:i=90;var n={targets:this._indicator,left:{value:this._calcLeftPos(this.$activeTabLink),delay:e},right:{value:this._calcRightPos(this.$activeTabLink),delay:i},duration:this.options.duration,easing:"easeOutQuad"};s.remove(this._indicator),s(n)}},{key:"select",value:function(t){var e=this.$tabLinks.filter('[href="#'+t+'"]');e.length&&e.trigger("click")}}],[{key:"init",value:function(t,e){return _get(n.__proto__||Object.getPrototypeOf(n),"init",this).call(this,this,t,e)}},{key:"getInstance",value:function(t){return(t.jquery?t[0]:t).M_Tabs}},{key:"defaults",get:function(){return e}}]),n}();M.Tabs=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"tabs","M_Tabs")}(cash,M.anime),function(d,e){"use strict";var i={exitDelay:200,enterDelay:0,html:null,margin:5,inDuration:250,outDuration:200,position:"bottom",transitionMovement:10},t=function(t){function n(t,e){_classCallCheck(this,n);var i=_possibleConstructorReturn(this,(n.__proto__||Object.getPrototypeOf(n)).call(this,n,t,e));return(i.el.M_Tooltip=i).options=d.extend({},n.defaults,e),i.isOpen=!1,i.isHovered=!1,i.isFocused=!1,i._appendTooltipEl(),i._setupEventHandlers(),i}return _inherits(n,Component),_createClass(n,[{key:"destroy",value:function(){d(this.tooltipEl).remove(),this._removeEventHandlers(),this.el.M_Tooltip=void 0}},{key:"_appendTooltipEl",value:function(){var t=document.createElement("div");t.classList.add("material-tooltip"),this.tooltipEl=t;var e=document.createElement("div");e.classList.add("tooltip-content"),e.innerHTML=this.options.html,t.appendChild(e),document.body.appendChild(t)}},{key:"_updateTooltipContent",value:function(){this.tooltipEl.querySelector(".tooltip-content").innerHTML=this.options.html}},{key:"_setupEventHandlers",value:function(){this._handleMouseEnterBound=this._handleMouseEnter.bind(this),this._handleMouseLeaveBound=this._handleMouseLeave.bind(this),this._handleFocusBound=this._handleFocus.bind(this),this._handleBlurBound=this._handleBlur.bind(this),this.el.addEventListener("mouseenter",this._handleMouseEnterBound),this.el.addEventListener("mouseleave",this._handleMouseLeaveBound),this.el.addEventListener("focus",this._handleFocusBound,!0),this.el.addEventListener("blur",this._handleBlurBound,!0)}},{key:"_removeEventHandlers",value:function(){this.el.removeEventListener("mouseenter",this._handleMouseEnterBound),this.el.removeEventListener("mouseleave",this._handleMouseLeaveBound),this.el.removeEventListener("focus",this._handleFocusBound,!0),this.el.removeEventListener("blur",this._handleBlurBound,!0)}},{key:"open",value:function(t){this.isOpen||(t=void 0===t||void 0,this.isOpen=!0,this.options=d.extend({},this.options,this._getAttributeOptions()),this._updateTooltipContent(),this._setEnterDelayTimeout(t))}},{key:"close",value:function(){this.isOpen&&(this.isHovered=!1,this.isFocused=!1,this.isOpen=!1,this._setExitDelayTimeout())}},{key:"_setExitDelayTimeout",value:function(){var t=this;clearTimeout(this._exitDelayTimeout),this._exitDelayTimeout=setTimeout(function(){t.isHovered||t.isFocused||t._animateOut()},this.options.exitDelay)}},{key:"_setEnterDelayTimeout",value:function(t){var e=this;clearTimeout(this._enterDelayTimeout),this._enterDelayTimeout=setTimeout(function(){(e.isHovered||e.isFocused||t)&&e._animateIn()},this.options.enterDelay)}},{key:"_positionTooltip",value:function(){var t,e=this.el,i=this.tooltipEl,n=e.offsetHeight,s=e.offsetWidth,o=i.offsetHeight,a=i.offsetWidth,r=this.options.margin,l=void 0,h=void 0;this.xMovement=0,this.yMovement=0,l=e.getBoundingClientRect().top+M.getDocumentScrollTop(),h=e.getBoundingClientRect().left+M.getDocumentScrollLeft(),"top"===this.options.position?(l+=-o-r,h+=s/2-a/2,this.yMovement=-this.options.transitionMovement):"right"===this.options.position?(l+=n/2-o/2,h+=s+r,this.xMovement=this.options.transitionMovement):"left"===this.options.position?(l+=n/2-o/2,h+=-a-r,this.xMovement=-this.options.transitionMovement):(l+=n+r,h+=s/2-a/2,this.yMovement=this.options.transitionMovement),t=this._repositionWithinScreen(h,l,a,o),d(i).css({top:t.y+"px",left:t.x+"px"})}},{key:"_repositionWithinScreen",value:function(t,e,i,n){var s=M.getDocumentScrollLeft(),o=M.getDocumentScrollTop(),a=t-s,r=e-o,l={left:a,top:r,width:i,height:n},h=this.options.margin+this.options.transitionMovement,d=M.checkWithinContainer(document.body,l,h);return d.left?a=h:d.right&&(a-=a+i-window.innerWidth),d.top?r=h:d.bottom&&(r-=r+n-window.innerHeight),{x:a+s,y:r+o}}},{key:"_animateIn",value:function(){this._positionTooltip(),this.tooltipEl.style.visibility="visible",e.remove(this.tooltipEl),e({targets:this.tooltipEl,opacity:1,translateX:this.xMovement,translateY:this.yMovement,duration:this.options.inDuration,easing:"easeOutCubic"})}},{key:"_animateOut",value:function(){e.remove(this.tooltipEl),e({targets:this.tooltipEl,opacity:0,translateX:0,translateY:0,duration:this.options.outDuration,easing:"easeOutCubic"})}},{key:"_handleMouseEnter",value:function(){this.isHovered=!0,this.isFocused=!1,this.open(!1)}},{key:"_handleMouseLeave",value:function(){this.isHovered=!1,this.isFocused=!1,this.close()}},{key:"_handleFocus",value:function(){M.tabPressed&&(this.isFocused=!0,this.open(!1))}},{key:"_handleBlur",value:function(){this.isFocused=!1,this.close()}},{key:"_getAttributeOptions",value:function(){var t={},e=this.el.getAttribute("data-tooltip"),i=this.el.getAttribute("data-position");return e&&(t.html=e),i&&(t.position=i),t}}],[{key:"init",value:function(t,e){return _get(n.__proto__||Object.getPrototypeOf(n),"init",this).call(this,this,t,e)}},{key:"getInstance",value:function(t){return(t.jquery?t[0]:t).M_Tooltip}},{key:"defaults",get:function(){return i}}]),n}();M.Tooltip=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"tooltip","M_Tooltip")}(cash,M.anime),function(i){"use strict";var t=t||{},e=document.querySelectorAll.bind(document);function m(t){var e="";for(var i in t)t.hasOwnProperty(i)&&(e+=i+":"+t[i]+";");return e}var g={duration:750,show:function(t,e){if(2===t.button)return!1;var i=e||this,n=document.createElement("div");n.className="waves-ripple",i.appendChild(n);var s,o,a,r,l,h,d,u=(h={top:0,left:0},d=(s=i)&&s.ownerDocument,o=d.documentElement,void 0!==s.getBoundingClientRect&&(h=s.getBoundingClientRect()),a=null!==(l=r=d)&&l===l.window?r:9===r.nodeType&&r.defaultView,{top:h.top+a.pageYOffset-o.clientTop,left:h.left+a.pageXOffset-o.clientLeft}),c=t.pageY-u.top,p=t.pageX-u.left,v="scale("+i.clientWidth/100*10+")";"touches"in t&&(c=t.touches[0].pageY-u.top,p=t.touches[0].pageX-u.left),n.setAttribute("data-hold",Date.now()),n.setAttribute("data-scale",v),n.setAttribute("data-x",p),n.setAttribute("data-y",c);var f={top:c+"px",left:p+"px"};n.className=n.className+" waves-notransition",n.setAttribute("style",m(f)),n.className=n.className.replace("waves-notransition",""),f["-webkit-transform"]=v,f["-moz-transform"]=v,f["-ms-transform"]=v,f["-o-transform"]=v,f.transform=v,f.opacity="1",f["-webkit-transition-duration"]=g.duration+"ms",f["-moz-transition-duration"]=g.duration+"ms",f["-o-transition-duration"]=g.duration+"ms",f["transition-duration"]=g.duration+"ms",f["-webkit-transition-timing-function"]="cubic-bezier(0.250, 0.460, 0.450, 0.940)",f["-moz-transition-timing-function"]="cubic-bezier(0.250, 0.460, 0.450, 0.940)",f["-o-transition-timing-function"]="cubic-bezier(0.250, 0.460, 0.450, 0.940)",f["transition-timing-function"]="cubic-bezier(0.250, 0.460, 0.450, 0.940)",n.setAttribute("style",m(f))},hide:function(t){l.touchup(t);var e=this,i=(e.clientWidth,null),n=e.getElementsByClassName("waves-ripple");if(!(0i||1"+o+""+a+""+r+""),i.length&&e.prepend(i)}},{key:"_resetCurrentElement",value:function(){this.activeIndex=-1,this.$active.removeClass("active")}},{key:"_resetAutocomplete",value:function(){h(this.container).empty(),this._resetCurrentElement(),this.oldVal=null,this.isOpen=!1,this._mousedown=!1}},{key:"selectOption",value:function(t){var e=t.text().trim();this.el.value=e,this.$el.trigger("change"),this._resetAutocomplete(),this.close(),"function"==typeof this.options.onAutocomplete&&this.options.onAutocomplete.call(this,e)}},{key:"_renderDropdown",value:function(t,i){var n=this;this._resetAutocomplete();var e=[];for(var s in t)if(t.hasOwnProperty(s)&&-1!==s.toLowerCase().indexOf(i)){if(this.count>=this.options.limit)break;var o={data:t[s],key:s};e.push(o),this.count++}if(this.options.sortFunction){e.sort(function(t,e){return n.options.sortFunction(t.key.toLowerCase(),e.key.toLowerCase(),i.toLowerCase())})}for(var a=0;a");r.data?l.append(''+r.key+""):l.append(""+r.key+""),h(this.container).append(l),this._highlight(i,l)}}},{key:"open",value:function(){var t=this.el.value.toLowerCase();this._resetAutocomplete(),t.length>=this.options.minLength&&(this.isOpen=!0,this._renderDropdown(this.options.data,t)),this.dropdown.isOpen?this.dropdown.recalculateDimensions():this.dropdown.open()}},{key:"close",value:function(){this.dropdown.close()}},{key:"updateData",value:function(t){var e=this.el.value.toLowerCase();this.options.data=t,this.isOpen&&this._renderDropdown(t,e)}}],[{key:"init",value:function(t,e){return _get(s.__proto__||Object.getPrototypeOf(s),"init",this).call(this,this,t,e)}},{key:"getInstance",value:function(t){return(t.jquery?t[0]:t).M_Autocomplete}},{key:"defaults",get:function(){return e}}]),s}();t._keydown=!1,M.Autocomplete=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"autocomplete","M_Autocomplete")}(cash),function(d){M.updateTextFields=function(){d("input[type=text], input[type=password], input[type=email], input[type=url], input[type=tel], input[type=number], input[type=search], input[type=date], input[type=time], textarea").each(function(t,e){var i=d(this);0'),d("body").append(e));var i=t.css("font-family"),n=t.css("font-size"),s=t.css("line-height"),o=t.css("padding-top"),a=t.css("padding-right"),r=t.css("padding-bottom"),l=t.css("padding-left");n&&e.css("font-size",n),i&&e.css("font-family",i),s&&e.css("line-height",s),o&&e.css("padding-top",o),a&&e.css("padding-right",a),r&&e.css("padding-bottom",r),l&&e.css("padding-left",l),t.data("original-height")||t.data("original-height",t.height()),"off"===t.attr("wrap")&&e.css("overflow-wrap","normal").css("white-space","pre"),e.text(t[0].value+"\n");var h=e.html().replace(/\n/g,"
");e.html(h),0'),this.$slides.each(function(t,e){var i=s('
  • ');n.$indicators.append(i[0])}),this.$el.append(this.$indicators[0]),this.$indicators=this.$indicators.children("li.indicator-item"))}},{key:"_removeIndicators",value:function(){this.$el.find("ul.indicators").remove()}},{key:"set",value:function(t){var e=this;if(t>=this.$slides.length?t=0:t<0&&(t=this.$slides.length-1),this.activeIndex!=t){this.$active=this.$slides.eq(this.activeIndex);var i=this.$active.find(".caption");this.$active.removeClass("active"),o({targets:this.$active[0],opacity:0,duration:this.options.duration,easing:"easeOutQuad",complete:function(){e.$slides.not(".active").each(function(t){o({targets:t,opacity:0,translateX:0,translateY:0,duration:0,easing:"easeOutQuad"})})}}),this._animateCaptionIn(i[0],this.options.duration),this.options.indicators&&(this.$indicators.eq(this.activeIndex).removeClass("active"),this.$indicators.eq(t).addClass("active")),o({targets:this.$slides.eq(t)[0],opacity:1,duration:this.options.duration,easing:"easeOutQuad"}),o({targets:this.$slides.eq(t).find(".caption")[0],opacity:1,translateX:0,translateY:0,duration:this.options.duration,delay:this.options.duration,easing:"easeOutQuad"}),this.$slides.eq(t).addClass("active"),this.activeIndex=t,this.start()}}},{key:"pause",value:function(){clearInterval(this.interval)}},{key:"start",value:function(){clearInterval(this.interval),this.interval=setInterval(this._handleIntervalBound,this.options.duration+this.options.interval)}},{key:"next",value:function(){var t=this.activeIndex+1;t>=this.$slides.length?t=0:t<0&&(t=this.$slides.length-1),this.set(t)}},{key:"prev",value:function(){var t=this.activeIndex-1;t>=this.$slides.length?t=0:t<0&&(t=this.$slides.length-1),this.set(t)}}],[{key:"init",value:function(t,e){return _get(n.__proto__||Object.getPrototypeOf(n),"init",this).call(this,this,t,e)}},{key:"getInstance",value:function(t){return(t.jquery?t[0]:t).M_Slider}},{key:"defaults",get:function(){return e}}]),n}();M.Slider=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"slider","M_Slider")}(cash,M.anime),function(n,s){n(document).on("click",".card",function(t){if(n(this).children(".card-reveal").length){var i=n(t.target).closest(".card");void 0===i.data("initialOverflow")&&i.data("initialOverflow",void 0===i.css("overflow")?"":i.css("overflow"));var e=n(this).find(".card-reveal");n(t.target).is(n(".card-reveal .card-title"))||n(t.target).is(n(".card-reveal .card-title i"))?s({targets:e[0],translateY:0,duration:225,easing:"easeInOutQuad",complete:function(t){var e=t.animatables[0].target;n(e).css({display:"none"}),i.css("overflow",i.data("initialOverflow"))}}):(n(t.target).is(n(".card .activator"))||n(t.target).is(n(".card .activator i")))&&(i.css("overflow","hidden"),e.css({display:"block"}),s({targets:e[0],translateY:"-100%",duration:300,easing:"easeInOutQuad"}))}})}(cash,M.anime),function(h){"use strict";var e={data:[],placeholder:"",secondaryPlaceholder:"",autocompleteOptions:{},limit:1/0,onChipAdd:null,onChipSelect:null,onChipDelete:null},t=function(t){function l(t,e){_classCallCheck(this,l);var i=_possibleConstructorReturn(this,(l.__proto__||Object.getPrototypeOf(l)).call(this,l,t,e));return(i.el.M_Chips=i).options=h.extend({},l.defaults,e),i.$el.addClass("chips input-field"),i.chipsData=[],i.$chips=h(),i._setupInput(),i.hasAutocomplete=0"),this.$el.append(this.$input)),this.$input.addClass("input")}},{key:"_setupLabel",value:function(){this.$label=this.$el.find("label"),this.$label.length&&this.$label.setAttribute("for",this.$input.attr("id"))}},{key:"_setPlaceholder",value:function(){void 0!==this.chipsData&&!this.chipsData.length&&this.options.placeholder?h(this.$input).prop("placeholder",this.options.placeholder):(void 0===this.chipsData||this.chipsData.length)&&this.options.secondaryPlaceholder&&h(this.$input).prop("placeholder",this.options.secondaryPlaceholder)}},{key:"_isValid",value:function(t){if(t.hasOwnProperty("tag")&&""!==t.tag){for(var e=!1,i=0;i=this.options.limit)){var e=this._renderChip(t);this.$chips.add(e),this.chipsData.push(t),h(this.$input).before(e),this._setPlaceholder(),"function"==typeof this.options.onChipAdd&&this.options.onChipAdd.call(this,this.$el,e)}}},{key:"deleteChip",value:function(t){var e=this.$chips.eq(t);this.$chips.eq(t).remove(),this.$chips=this.$chips.filter(function(t){return 0<=h(t).index()}),this.chipsData.splice(t,1),this._setPlaceholder(),"function"==typeof this.options.onChipDelete&&this.options.onChipDelete.call(this,this.$el,e[0])}},{key:"selectChip",value:function(t){var e=this.$chips.eq(t);(this._selectedChip=e)[0].focus(),"function"==typeof this.options.onChipSelect&&this.options.onChipSelect.call(this,this.$el,e[0])}}],[{key:"init",value:function(t,e){return _get(l.__proto__||Object.getPrototypeOf(l),"init",this).call(this,this,t,e)}},{key:"getInstance",value:function(t){return(t.jquery?t[0]:t).M_Chips}},{key:"_handleChipsKeydown",value:function(t){l._keydown=!0;var e=h(t.target).closest(".chips"),i=t.target&&e.length;if(!h(t.target).is("input, textarea")&&i){var n=e[0].M_Chips;if(8===t.keyCode||46===t.keyCode){t.preventDefault();var s=n.chipsData.length;if(n._selectedChip){var o=n._selectedChip.index();n.deleteChip(o),n._selectedChip=null,s=Math.max(o-1,0)}n.chipsData.length&&n.selectChip(s)}else if(37===t.keyCode){if(n._selectedChip){var a=n._selectedChip.index()-1;if(a<0)return;n.selectChip(a)}}else if(39===t.keyCode&&n._selectedChip){var r=n._selectedChip.index()+1;r>=n.chipsData.length?n.$input[0].focus():n.selectChip(r)}}}},{key:"_handleChipsKeyup",value:function(t){l._keydown=!1}},{key:"_handleChipsBlur",value:function(t){l._keydown||(h(t.target).closest(".chips")[0].M_Chips._selectedChip=null)}},{key:"defaults",get:function(){return e}}]),l}();t._keydown=!1,M.Chips=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"chips","M_Chips"),h(document).ready(function(){h(document.body).on("click",".chip .close",function(){var t=h(this).closest(".chips");t.length&&t[0].M_Chips||h(this).closest(".chip").remove()})})}(cash),function(s){"use strict";var e={top:0,bottom:1/0,offset:0,onPositionChange:null},t=function(t){function n(t,e){_classCallCheck(this,n);var i=_possibleConstructorReturn(this,(n.__proto__||Object.getPrototypeOf(n)).call(this,n,t,e));return(i.el.M_Pushpin=i).options=s.extend({},n.defaults,e),i.originalOffset=i.el.offsetTop,n._pushpins.push(i),i._setupEventHandlers(),i._updatePosition(),i}return _inherits(n,Component),_createClass(n,[{key:"destroy",value:function(){this.el.style.top=null,this._removePinClasses(),this._removeEventHandlers();var t=n._pushpins.indexOf(this);n._pushpins.splice(t,1)}},{key:"_setupEventHandlers",value:function(){document.addEventListener("scroll",n._updateElements)}},{key:"_removeEventHandlers",value:function(){document.removeEventListener("scroll",n._updateElements)}},{key:"_updatePosition",value:function(){var t=M.getDocumentScrollTop()+this.options.offset;this.options.top<=t&&this.options.bottom>=t&&!this.el.classList.contains("pinned")&&(this._removePinClasses(),this.el.style.top=this.options.offset+"px",this.el.classList.add("pinned"),"function"==typeof this.options.onPositionChange&&this.options.onPositionChange.call(this,"pinned")),tthis.options.bottom&&!this.el.classList.contains("pin-bottom")&&(this._removePinClasses(),this.el.classList.add("pin-bottom"),this.el.style.top=this.options.bottom-this.originalOffset+"px","function"==typeof this.options.onPositionChange&&this.options.onPositionChange.call(this,"pin-bottom"))}},{key:"_removePinClasses",value:function(){this.el.classList.remove("pin-top"),this.el.classList.remove("pinned"),this.el.classList.remove("pin-bottom")}}],[{key:"init",value:function(t,e){return _get(n.__proto__||Object.getPrototypeOf(n),"init",this).call(this,this,t,e)}},{key:"getInstance",value:function(t){return(t.jquery?t[0]:t).M_Pushpin}},{key:"_updateElements",value:function(){for(var t in n._pushpins){n._pushpins[t]._updatePosition()}}},{key:"defaults",get:function(){return e}}]),n}();t._pushpins=[],M.Pushpin=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"pushpin","M_Pushpin")}(cash),function(r,s){"use strict";var e={direction:"top",hoverEnabled:!0,toolbarEnabled:!1};r.fn.reverse=[].reverse;var t=function(t){function n(t,e){_classCallCheck(this,n);var i=_possibleConstructorReturn(this,(n.__proto__||Object.getPrototypeOf(n)).call(this,n,t,e));return(i.el.M_FloatingActionButton=i).options=r.extend({},n.defaults,e),i.isOpen=!1,i.$anchor=i.$el.children("a").first(),i.$menu=i.$el.children("ul").first(),i.$floatingBtns=i.$el.find("ul .btn-floating"),i.$floatingBtnsReverse=i.$el.find("ul .btn-floating").reverse(),i.offsetY=0,i.offsetX=0,i.$el.addClass("direction-"+i.options.direction),"top"===i.options.direction?i.offsetY=40:"right"===i.options.direction?i.offsetX=-40:"bottom"===i.options.direction?i.offsetY=-40:i.offsetX=40,i._setupEventHandlers(),i}return _inherits(n,Component),_createClass(n,[{key:"destroy",value:function(){this._removeEventHandlers(),this.el.M_FloatingActionButton=void 0}},{key:"_setupEventHandlers",value:function(){this._handleFABClickBound=this._handleFABClick.bind(this),this._handleOpenBound=this.open.bind(this),this._handleCloseBound=this.close.bind(this),this.options.hoverEnabled&&!this.options.toolbarEnabled?(this.el.addEventListener("mouseenter",this._handleOpenBound),this.el.addEventListener("mouseleave",this._handleCloseBound)):this.el.addEventListener("click",this._handleFABClickBound)}},{key:"_removeEventHandlers",value:function(){this.options.hoverEnabled&&!this.options.toolbarEnabled?(this.el.removeEventListener("mouseenter",this._handleOpenBound),this.el.removeEventListener("mouseleave",this._handleCloseBound)):this.el.removeEventListener("click",this._handleFABClickBound)}},{key:"_handleFABClick",value:function(){this.isOpen?this.close():this.open()}},{key:"_handleDocumentClick",value:function(t){r(t.target).closest(this.$menu).length||this.close()}},{key:"open",value:function(){this.isOpen||(this.options.toolbarEnabled?this._animateInToolbar():this._animateInFAB(),this.isOpen=!0)}},{key:"close",value:function(){this.isOpen&&(this.options.toolbarEnabled?(window.removeEventListener("scroll",this._handleCloseBound,!0),document.body.removeEventListener("click",this._handleDocumentClickBound,!0),this._animateOutToolbar()):this._animateOutFAB(),this.isOpen=!1)}},{key:"_animateInFAB",value:function(){var e=this;this.$el.addClass("active");var i=0;this.$floatingBtnsReverse.each(function(t){s({targets:t,opacity:1,scale:[.4,1],translateY:[e.offsetY,0],translateX:[e.offsetX,0],duration:275,delay:i,easing:"easeInOutQuad"}),i+=40})}},{key:"_animateOutFAB",value:function(){var e=this;this.$floatingBtnsReverse.each(function(t){s.remove(t),s({targets:t,opacity:0,scale:.4,translateY:e.offsetY,translateX:e.offsetX,duration:175,easing:"easeOutQuad",complete:function(){e.$el.removeClass("active")}})})}},{key:"_animateInToolbar",value:function(){var t,e=this,i=window.innerWidth,n=window.innerHeight,s=this.el.getBoundingClientRect(),o=r('
    '),a=this.$anchor.css("background-color");this.$anchor.append(o),this.offsetX=s.left-i/2+s.width/2,this.offsetY=n-s.bottom,t=i/o[0].clientWidth,this.btnBottom=s.bottom,this.btnLeft=s.left,this.btnWidth=s.width,this.$el.addClass("active"),this.$el.css({"text-align":"center",width:"100%",bottom:0,left:0,transform:"translateX("+this.offsetX+"px)",transition:"none"}),this.$anchor.css({transform:"translateY("+-this.offsetY+"px)",transition:"none"}),o.css({"background-color":a}),setTimeout(function(){e.$el.css({transform:"",transition:"transform .2s cubic-bezier(0.550, 0.085, 0.680, 0.530), background-color 0s linear .2s"}),e.$anchor.css({overflow:"visible",transform:"",transition:"transform .2s"}),setTimeout(function(){e.$el.css({overflow:"hidden","background-color":a}),o.css({transform:"scale("+t+")",transition:"transform .2s cubic-bezier(0.550, 0.055, 0.675, 0.190)"}),e.$menu.children("li").children("a").css({opacity:1}),e._handleDocumentClickBound=e._handleDocumentClick.bind(e),window.addEventListener("scroll",e._handleCloseBound,!0),document.body.addEventListener("click",e._handleDocumentClickBound,!0)},100)},0)}},{key:"_animateOutToolbar",value:function(){var t=this,e=window.innerWidth,i=window.innerHeight,n=this.$el.find(".fab-backdrop"),s=this.$anchor.css("background-color");this.offsetX=this.btnLeft-e/2+this.btnWidth/2,this.offsetY=i-this.btnBottom,this.$el.removeClass("active"),this.$el.css({"background-color":"transparent",transition:"none"}),this.$anchor.css({transition:"none"}),n.css({transform:"scale(0)","background-color":s}),this.$menu.children("li").children("a").css({opacity:""}),setTimeout(function(){n.remove(),t.$el.css({"text-align":"",width:"",bottom:"",left:"",overflow:"","background-color":"",transform:"translate3d("+-t.offsetX+"px,0,0)"}),t.$anchor.css({overflow:"",transform:"translate3d(0,"+t.offsetY+"px,0)"}),setTimeout(function(){t.$el.css({transform:"translate3d(0,0,0)",transition:"transform .2s"}),t.$anchor.css({transform:"translate3d(0,0,0)",transition:"transform .2s cubic-bezier(0.550, 0.055, 0.675, 0.190)"})},20)},200)}}],[{key:"init",value:function(t,e){return _get(n.__proto__||Object.getPrototypeOf(n),"init",this).call(this,this,t,e)}},{key:"getInstance",value:function(t){return(t.jquery?t[0]:t).M_FloatingActionButton}},{key:"defaults",get:function(){return e}}]),n}();M.FloatingActionButton=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"floatingActionButton","M_FloatingActionButton")}(cash,M.anime),function(g){"use strict";var e={autoClose:!1,format:"mmm dd, yyyy",parse:null,defaultDate:null,setDefaultDate:!1,disableWeekends:!1,disableDayFn:null,firstDay:0,minDate:null,maxDate:null,yearRange:10,minYear:0,maxYear:9999,minMonth:void 0,maxMonth:void 0,startRange:null,endRange:null,isRTL:!1,showMonthAfterYear:!1,showDaysInNextAndPreviousMonths:!1,container:null,showClearBtn:!1,i18n:{cancel:"Cancel",clear:"Clear",done:"Ok",previousMonth:"‹",nextMonth:"›",months:["January","February","March","April","May","June","July","August","September","October","November","December"],monthsShort:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],weekdays:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],weekdaysShort:["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],weekdaysAbbrev:["S","M","T","W","T","F","S"]},events:[],onSelect:null,onOpen:null,onClose:null,onDraw:null},t=function(t){function B(t,e){_classCallCheck(this,B);var i=_possibleConstructorReturn(this,(B.__proto__||Object.getPrototypeOf(B)).call(this,B,t,e));(i.el.M_Datepicker=i).options=g.extend({},B.defaults,e),e&&e.hasOwnProperty("i18n")&&"object"==typeof e.i18n&&(i.options.i18n=g.extend({},B.defaults.i18n,e.i18n)),i.options.minDate&&i.options.minDate.setHours(0,0,0,0),i.options.maxDate&&i.options.maxDate.setHours(0,0,0,0),i.id=M.guid(),i._setupVariables(),i._insertHTMLIntoDOM(),i._setupModal(),i._setupEventHandlers(),i.options.defaultDate||(i.options.defaultDate=new Date(Date.parse(i.el.value)));var n=i.options.defaultDate;return B._isDate(n)?i.options.setDefaultDate?(i.setDate(n,!0),i.setInputValue()):i.gotoDate(n):i.gotoDate(new Date),i.isOpen=!1,i}return _inherits(B,Component),_createClass(B,[{key:"destroy",value:function(){this._removeEventHandlers(),this.modal.destroy(),g(this.modalEl).remove(),this.destroySelects(),this.el.M_Datepicker=void 0}},{key:"destroySelects",value:function(){var t=this.calendarEl.querySelector(".orig-select-year");t&&M.FormSelect.getInstance(t).destroy();var e=this.calendarEl.querySelector(".orig-select-month");e&&M.FormSelect.getInstance(e).destroy()}},{key:"_insertHTMLIntoDOM",value:function(){this.options.showClearBtn&&(g(this.clearBtn).css({visibility:""}),this.clearBtn.innerHTML=this.options.i18n.clear),this.doneBtn.innerHTML=this.options.i18n.done,this.cancelBtn.innerHTML=this.options.i18n.cancel,this.options.container?this.$modalEl.appendTo(this.options.container):this.$modalEl.insertBefore(this.el)}},{key:"_setupModal",value:function(){var t=this;this.modalEl.id="modal-"+this.id,this.modal=M.Modal.init(this.modalEl,{onCloseEnd:function(){t.isOpen=!1}})}},{key:"toString",value:function(t){var e=this;return t=t||this.options.format,B._isDate(this.date)?t.split(/(d{1,4}|m{1,4}|y{4}|yy|!.)/g).map(function(t){return e.formats[t]?e.formats[t]():t}).join(""):""}},{key:"setDate",value:function(t,e){if(!t)return this.date=null,this._renderDateDisplay(),this.draw();if("string"==typeof t&&(t=new Date(Date.parse(t))),B._isDate(t)){var i=this.options.minDate,n=this.options.maxDate;B._isDate(i)&&tn.maxDate||n.disableWeekends&&B._isWeekend(y)||n.disableDayFn&&n.disableDayFn(y),isEmpty:C,isStartRange:x,isEndRange:L,isInRange:T,showDaysInNextAndPreviousMonths:n.showDaysInNextAndPreviousMonths};l.push(this.renderDay($)),7==++_&&(r.push(this.renderRow(l,n.isRTL,m)),_=0,m=!(l=[]))}return this.renderTable(n,r,i)}},{key:"renderDay",value:function(t){var e=[],i="false";if(t.isEmpty){if(!t.showDaysInNextAndPreviousMonths)return'';e.push("is-outside-current-month"),e.push("is-selection-disabled")}return t.isDisabled&&e.push("is-disabled"),t.isToday&&e.push("is-today"),t.isSelected&&(e.push("is-selected"),i="true"),t.hasEvent&&e.push("has-event"),t.isInRange&&e.push("is-inrange"),t.isStartRange&&e.push("is-startrange"),t.isEndRange&&e.push("is-endrange"),'"}},{key:"renderRow",value:function(t,e,i){return''+(e?t.reverse():t).join("")+""}},{key:"renderTable",value:function(t,e,i){return'
    '+this.renderHead(t)+this.renderBody(e)+"
    "}},{key:"renderHead",value:function(t){var e=void 0,i=[];for(e=0;e<7;e++)i.push(''+this.renderDayName(t,e,!0)+"");return""+(t.isRTL?i.reverse():i).join("")+""}},{key:"renderBody",value:function(t){return""+t.join("")+""}},{key:"renderTitle",value:function(t,e,i,n,s,o){var a,r,l=void 0,h=void 0,d=void 0,u=this.options,c=i===u.minYear,p=i===u.maxYear,v='
    ',f=!0,m=!0;for(d=[],l=0;l<12;l++)d.push('");for(a='",g.isArray(u.yearRange)?(l=u.yearRange[0],h=u.yearRange[1]+1):(l=i-u.yearRange,h=1+i+u.yearRange),d=[];l=u.minYear&&d.push('");r='";v+='',v+='
    ',u.showMonthAfterYear?v+=r+a:v+=a+r,v+="
    ",c&&(0===n||u.minMonth>=n)&&(f=!1),p&&(11===n||u.maxMonth<=n)&&(m=!1);return(v+='')+"
    "}},{key:"draw",value:function(t){if(this.isOpen||t){var e,i=this.options,n=i.minYear,s=i.maxYear,o=i.minMonth,a=i.maxMonth,r="";this._y<=n&&(this._y=n,!isNaN(o)&&this._m=s&&(this._y=s,!isNaN(a)&&this._m>a&&(this._m=a)),e="datepicker-title-"+Math.random().toString(36).replace(/[^a-z]+/g,"").substr(0,2);for(var l=0;l<1;l++)this._renderDateDisplay(),r+=this.renderTitle(this,l,this.calendars[l].year,this.calendars[l].month,this.calendars[0].year,e)+this.render(this.calendars[l].year,this.calendars[l].month,e);this.destroySelects(),this.calendarEl.innerHTML=r;var h=this.calendarEl.querySelector(".orig-select-year"),d=this.calendarEl.querySelector(".orig-select-month");M.FormSelect.init(h,{classes:"select-year",dropdownOptions:{container:document.body,constrainWidth:!1}}),M.FormSelect.init(d,{classes:"select-month",dropdownOptions:{container:document.body,constrainWidth:!1}}),h.addEventListener("change",this._handleYearChange.bind(this)),d.addEventListener("change",this._handleMonthChange.bind(this)),"function"==typeof this.options.onDraw&&this.options.onDraw(this)}}},{key:"_setupEventHandlers",value:function(){this._handleInputKeydownBound=this._handleInputKeydown.bind(this),this._handleInputClickBound=this._handleInputClick.bind(this),this._handleInputChangeBound=this._handleInputChange.bind(this),this._handleCalendarClickBound=this._handleCalendarClick.bind(this),this._finishSelectionBound=this._finishSelection.bind(this),this._handleMonthChange=this._handleMonthChange.bind(this),this._closeBound=this.close.bind(this),this.el.addEventListener("click",this._handleInputClickBound),this.el.addEventListener("keydown",this._handleInputKeydownBound),this.el.addEventListener("change",this._handleInputChangeBound),this.calendarEl.addEventListener("click",this._handleCalendarClickBound),this.doneBtn.addEventListener("click",this._finishSelectionBound),this.cancelBtn.addEventListener("click",this._closeBound),this.options.showClearBtn&&(this._handleClearClickBound=this._handleClearClick.bind(this),this.clearBtn.addEventListener("click",this._handleClearClickBound))}},{key:"_setupVariables",value:function(){var e=this;this.$modalEl=g(B._template),this.modalEl=this.$modalEl[0],this.calendarEl=this.modalEl.querySelector(".datepicker-calendar"),this.yearTextEl=this.modalEl.querySelector(".year-text"),this.dateTextEl=this.modalEl.querySelector(".date-text"),this.options.showClearBtn&&(this.clearBtn=this.modalEl.querySelector(".datepicker-clear")),this.doneBtn=this.modalEl.querySelector(".datepicker-done"),this.cancelBtn=this.modalEl.querySelector(".datepicker-cancel"),this.formats={d:function(){return e.date.getDate()},dd:function(){var t=e.date.getDate();return(t<10?"0":"")+t},ddd:function(){return e.options.i18n.weekdaysShort[e.date.getDay()]},dddd:function(){return e.options.i18n.weekdays[e.date.getDay()]},m:function(){return e.date.getMonth()+1},mm:function(){var t=e.date.getMonth()+1;return(t<10?"0":"")+t},mmm:function(){return e.options.i18n.monthsShort[e.date.getMonth()]},mmmm:function(){return e.options.i18n.months[e.date.getMonth()]},yy:function(){return(""+e.date.getFullYear()).slice(2)},yyyy:function(){return e.date.getFullYear()}}}},{key:"_removeEventHandlers",value:function(){this.el.removeEventListener("click",this._handleInputClickBound),this.el.removeEventListener("keydown",this._handleInputKeydownBound),this.el.removeEventListener("change",this._handleInputChangeBound),this.calendarEl.removeEventListener("click",this._handleCalendarClickBound)}},{key:"_handleInputClick",value:function(){this.open()}},{key:"_handleInputKeydown",value:function(t){t.which===M.keys.ENTER&&(t.preventDefault(),this.open())}},{key:"_handleCalendarClick",value:function(t){if(this.isOpen){var e=g(t.target);e.hasClass("is-disabled")||(!e.hasClass("datepicker-day-button")||e.hasClass("is-empty")||e.parent().hasClass("is-disabled")?e.closest(".month-prev").length?this.prevMonth():e.closest(".month-next").length&&this.nextMonth():(this.setDate(new Date(t.target.getAttribute("data-year"),t.target.getAttribute("data-month"),t.target.getAttribute("data-day"))),this.options.autoClose&&this._finishSelection()))}}},{key:"_handleClearClick",value:function(){this.date=null,this.setInputValue(),this.close()}},{key:"_handleMonthChange",value:function(t){this.gotoMonth(t.target.value)}},{key:"_handleYearChange",value:function(t){this.gotoYear(t.target.value)}},{key:"gotoMonth",value:function(t){isNaN(t)||(this.calendars[0].month=parseInt(t,10),this.adjustCalendars())}},{key:"gotoYear",value:function(t){isNaN(t)||(this.calendars[0].year=parseInt(t,10),this.adjustCalendars())}},{key:"_handleInputChange",value:function(t){var e=void 0;t.firedBy!==this&&(e=this.options.parse?this.options.parse(this.el.value,this.options.format):new Date(Date.parse(this.el.value)),B._isDate(e)&&this.setDate(e))}},{key:"renderDayName",value:function(t,e,i){for(e+=t.firstDay;7<=e;)e-=7;return i?t.i18n.weekdaysAbbrev[e]:t.i18n.weekdays[e]}},{key:"_finishSelection",value:function(){this.setInputValue(),this.close()}},{key:"open",value:function(){if(!this.isOpen)return this.isOpen=!0,"function"==typeof this.options.onOpen&&this.options.onOpen.call(this),this.draw(),this.modal.open(),this}},{key:"close",value:function(){if(this.isOpen)return this.isOpen=!1,"function"==typeof this.options.onClose&&this.options.onClose.call(this),this.modal.close(),this}}],[{key:"init",value:function(t,e){return _get(B.__proto__||Object.getPrototypeOf(B),"init",this).call(this,this,t,e)}},{key:"_isDate",value:function(t){return/Date/.test(Object.prototype.toString.call(t))&&!isNaN(t.getTime())}},{key:"_isWeekend",value:function(t){var e=t.getDay();return 0===e||6===e}},{key:"_setToStartOfDay",value:function(t){B._isDate(t)&&t.setHours(0,0,0,0)}},{key:"_getDaysInMonth",value:function(t,e){return[31,B._isLeapYear(t)?29:28,31,30,31,30,31,31,30,31,30,31][e]}},{key:"_isLeapYear",value:function(t){return t%4==0&&t%100!=0||t%400==0}},{key:"_compareDates",value:function(t,e){return t.getTime()===e.getTime()}},{key:"_setToStartOfDay",value:function(t){B._isDate(t)&&t.setHours(0,0,0,0)}},{key:"getInstance",value:function(t){return(t.jquery?t[0]:t).M_Datepicker}},{key:"defaults",get:function(){return e}}]),B}();t._template=['"].join(""),M.Datepicker=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"datepicker","M_Datepicker")}(cash),function(h){"use strict";var e={dialRadius:135,outerRadius:105,innerRadius:70,tickRadius:20,duration:350,container:null,defaultTime:"now",fromNow:0,showClearBtn:!1,i18n:{cancel:"Cancel",clear:"Clear",done:"Ok"},autoClose:!1,twelveHour:!0,vibrate:!0,onOpenStart:null,onOpenEnd:null,onCloseStart:null,onCloseEnd:null,onSelect:null},t=function(t){function f(t,e){_classCallCheck(this,f);var i=_possibleConstructorReturn(this,(f.__proto__||Object.getPrototypeOf(f)).call(this,f,t,e));return(i.el.M_Timepicker=i).options=h.extend({},f.defaults,e),i.id=M.guid(),i._insertHTMLIntoDOM(),i._setupModal(),i._setupVariables(),i._setupEventHandlers(),i._clockSetup(),i._pickerSetup(),i}return _inherits(f,Component),_createClass(f,[{key:"destroy",value:function(){this._removeEventHandlers(),this.modal.destroy(),h(this.modalEl).remove(),this.el.M_Timepicker=void 0}},{key:"_setupEventHandlers",value:function(){this._handleInputKeydownBound=this._handleInputKeydown.bind(this),this._handleInputClickBound=this._handleInputClick.bind(this),this._handleClockClickStartBound=this._handleClockClickStart.bind(this),this._handleDocumentClickMoveBound=this._handleDocumentClickMove.bind(this),this._handleDocumentClickEndBound=this._handleDocumentClickEnd.bind(this),this.el.addEventListener("click",this._handleInputClickBound),this.el.addEventListener("keydown",this._handleInputKeydownBound),this.plate.addEventListener("mousedown",this._handleClockClickStartBound),this.plate.addEventListener("touchstart",this._handleClockClickStartBound),h(this.spanHours).on("click",this.showView.bind(this,"hours")),h(this.spanMinutes).on("click",this.showView.bind(this,"minutes"))}},{key:"_removeEventHandlers",value:function(){this.el.removeEventListener("click",this._handleInputClickBound),this.el.removeEventListener("keydown",this._handleInputKeydownBound)}},{key:"_handleInputClick",value:function(){this.open()}},{key:"_handleInputKeydown",value:function(t){t.which===M.keys.ENTER&&(t.preventDefault(),this.open())}},{key:"_handleClockClickStart",value:function(t){t.preventDefault();var e=this.plate.getBoundingClientRect(),i=e.left,n=e.top;this.x0=i+this.options.dialRadius,this.y0=n+this.options.dialRadius,this.moved=!1;var s=f._Pos(t);this.dx=s.x-this.x0,this.dy=s.y-this.y0,this.setHand(this.dx,this.dy,!1),document.addEventListener("mousemove",this._handleDocumentClickMoveBound),document.addEventListener("touchmove",this._handleDocumentClickMoveBound),document.addEventListener("mouseup",this._handleDocumentClickEndBound),document.addEventListener("touchend",this._handleDocumentClickEndBound)}},{key:"_handleDocumentClickMove",value:function(t){t.preventDefault();var e=f._Pos(t),i=e.x-this.x0,n=e.y-this.y0;this.moved=!0,this.setHand(i,n,!1,!0)}},{key:"_handleDocumentClickEnd",value:function(t){var e=this;t.preventDefault(),document.removeEventListener("mouseup",this._handleDocumentClickEndBound),document.removeEventListener("touchend",this._handleDocumentClickEndBound);var i=f._Pos(t),n=i.x-this.x0,s=i.y-this.y0;this.moved&&n===this.dx&&s===this.dy&&this.setHand(n,s),"hours"===this.currentView?this.showView("minutes",this.options.duration/2):this.options.autoClose&&(h(this.minutesView).addClass("timepicker-dial-out"),setTimeout(function(){e.done()},this.options.duration/2)),"function"==typeof this.options.onSelect&&this.options.onSelect.call(this,this.hours,this.minutes),document.removeEventListener("mousemove",this._handleDocumentClickMoveBound),document.removeEventListener("touchmove",this._handleDocumentClickMoveBound)}},{key:"_insertHTMLIntoDOM",value:function(){this.$modalEl=h(f._template),this.modalEl=this.$modalEl[0],this.modalEl.id="modal-"+this.id;var t=document.querySelector(this.options.container);this.options.container&&t?this.$modalEl.appendTo(t):this.$modalEl.insertBefore(this.el)}},{key:"_setupModal",value:function(){var t=this;this.modal=M.Modal.init(this.modalEl,{onOpenStart:this.options.onOpenStart,onOpenEnd:this.options.onOpenEnd,onCloseStart:this.options.onCloseStart,onCloseEnd:function(){"function"==typeof t.options.onCloseEnd&&t.options.onCloseEnd.call(t),t.isOpen=!1}})}},{key:"_setupVariables",value:function(){this.currentView="hours",this.vibrate=navigator.vibrate?"vibrate":navigator.webkitVibrate?"webkitVibrate":null,this._canvas=this.modalEl.querySelector(".timepicker-canvas"),this.plate=this.modalEl.querySelector(".timepicker-plate"),this.hoursView=this.modalEl.querySelector(".timepicker-hours"),this.minutesView=this.modalEl.querySelector(".timepicker-minutes"),this.spanHours=this.modalEl.querySelector(".timepicker-span-hours"),this.spanMinutes=this.modalEl.querySelector(".timepicker-span-minutes"),this.spanAmPm=this.modalEl.querySelector(".timepicker-span-am-pm"),this.footer=this.modalEl.querySelector(".timepicker-footer"),this.amOrPm="PM"}},{key:"_pickerSetup",value:function(){var t=h('").appendTo(this.footer).on("click",this.clear.bind(this));this.options.showClearBtn&&t.css({visibility:""});var e=h('
    ');h('").appendTo(e).on("click",this.close.bind(this)),h('").appendTo(e).on("click",this.done.bind(this)),e.appendTo(this.footer)}},{key:"_clockSetup",value:function(){this.options.twelveHour&&(this.$amBtn=h('
    AM
    '),this.$pmBtn=h('
    PM
    '),this.$amBtn.on("click",this._handleAmPmClick.bind(this)).appendTo(this.spanAmPm),this.$pmBtn.on("click",this._handleAmPmClick.bind(this)).appendTo(this.spanAmPm)),this._buildHoursView(),this._buildMinutesView(),this._buildSVGClock()}},{key:"_buildSVGClock",value:function(){var t=this.options.dialRadius,e=this.options.tickRadius,i=2*t,n=f._createSVGEl("svg");n.setAttribute("class","timepicker-svg"),n.setAttribute("width",i),n.setAttribute("height",i);var s=f._createSVGEl("g");s.setAttribute("transform","translate("+t+","+t+")");var o=f._createSVGEl("circle");o.setAttribute("class","timepicker-canvas-bearing"),o.setAttribute("cx",0),o.setAttribute("cy",0),o.setAttribute("r",4);var a=f._createSVGEl("line");a.setAttribute("x1",0),a.setAttribute("y1",0);var r=f._createSVGEl("circle");r.setAttribute("class","timepicker-canvas-bg"),r.setAttribute("r",e),s.appendChild(a),s.appendChild(r),s.appendChild(o),n.appendChild(s),this._canvas.appendChild(n),this.hand=a,this.bg=r,this.bearing=o,this.g=s}},{key:"_buildHoursView",value:function(){var t=h('
    ');if(this.options.twelveHour)for(var e=1;e<13;e+=1){var i=t.clone(),n=e/6*Math.PI,s=this.options.outerRadius;i.css({left:this.options.dialRadius+Math.sin(n)*s-this.options.tickRadius+"px",top:this.options.dialRadius-Math.cos(n)*s-this.options.tickRadius+"px"}),i.html(0===e?"00":e),this.hoursView.appendChild(i[0])}else for(var o=0;o<24;o+=1){var a=t.clone(),r=o/6*Math.PI,l=0'),e=0;e<60;e+=5){var i=t.clone(),n=e/30*Math.PI;i.css({left:this.options.dialRadius+Math.sin(n)*this.options.outerRadius-this.options.tickRadius+"px",top:this.options.dialRadius-Math.cos(n)*this.options.outerRadius-this.options.tickRadius+"px"}),i.html(f._addLeadingZero(e)),this.minutesView.appendChild(i[0])}}},{key:"_handleAmPmClick",value:function(t){var e=h(t.target);this.amOrPm=e.hasClass("am-btn")?"AM":"PM",this._updateAmPmView()}},{key:"_updateAmPmView",value:function(){this.options.twelveHour&&(this.$amBtn.toggleClass("text-primary","AM"===this.amOrPm),this.$pmBtn.toggleClass("text-primary","PM"===this.amOrPm))}},{key:"_updateTimeFromInput",value:function(){var t=((this.el.value||this.options.defaultTime||"")+"").split(":");if(this.options.twelveHour&&void 0!==t[1]&&(0','",""].join(""),M.Timepicker=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"timepicker","M_Timepicker")}(cash),function(s){"use strict";var e={},t=function(t){function n(t,e){_classCallCheck(this,n);var i=_possibleConstructorReturn(this,(n.__proto__||Object.getPrototypeOf(n)).call(this,n,t,e));return(i.el.M_CharacterCounter=i).options=s.extend({},n.defaults,e),i.isInvalid=!1,i.isValidLength=!1,i._setupCounter(),i._setupEventHandlers(),i}return _inherits(n,Component),_createClass(n,[{key:"destroy",value:function(){this._removeEventHandlers(),this.el.CharacterCounter=void 0,this._removeCounter()}},{key:"_setupEventHandlers",value:function(){this._handleUpdateCounterBound=this.updateCounter.bind(this),this.el.addEventListener("focus",this._handleUpdateCounterBound,!0),this.el.addEventListener("input",this._handleUpdateCounterBound,!0)}},{key:"_removeEventHandlers",value:function(){this.el.removeEventListener("focus",this._handleUpdateCounterBound,!0),this.el.removeEventListener("input",this._handleUpdateCounterBound,!0)}},{key:"_setupCounter",value:function(){this.counterEl=document.createElement("span"),s(this.counterEl).addClass("character-counter").css({float:"right","font-size":"12px",height:1}),this.$el.parent().append(this.counterEl)}},{key:"_removeCounter",value:function(){s(this.counterEl).remove()}},{key:"updateCounter",value:function(){var t=+this.$el.attr("data-length"),e=this.el.value.length;this.isValidLength=e<=t;var i=e;t&&(i+="/"+t,this._validateInput()),s(this.counterEl).html(i)}},{key:"_validateInput",value:function(){this.isValidLength&&this.isInvalid?(this.isInvalid=!1,this.$el.removeClass("invalid")):this.isValidLength||this.isInvalid||(this.isInvalid=!0,this.$el.removeClass("valid"),this.$el.addClass("invalid"))}}],[{key:"init",value:function(t,e){return _get(n.__proto__||Object.getPrototypeOf(n),"init",this).call(this,this,t,e)}},{key:"getInstance",value:function(t){return(t.jquery?t[0]:t).M_CharacterCounter}},{key:"defaults",get:function(){return e}}]),n}();M.CharacterCounter=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"characterCounter","M_CharacterCounter")}(cash),function(b){"use strict";var e={duration:200,dist:-100,shift:0,padding:0,numVisible:5,fullWidth:!1,indicators:!1,noWrap:!1,onCycleTo:null},t=function(t){function i(t,e){_classCallCheck(this,i);var n=_possibleConstructorReturn(this,(i.__proto__||Object.getPrototypeOf(i)).call(this,i,t,e));return(n.el.M_Carousel=n).options=b.extend({},i.defaults,e),n.hasMultipleSlides=1'),n.$el.find(".carousel-item").each(function(t,e){if(n.images.push(t),n.showIndicators){var i=b('
  • ');0===e&&i[0].classList.add("active"),n.$indicators.append(i)}}),n.showIndicators&&n.$el.append(n.$indicators),n.count=n.images.length,n.options.numVisible=Math.min(n.count,n.options.numVisible),n.xform="transform",["webkit","Moz","O","ms"].every(function(t){var e=t+"Transform";return void 0===document.body.style[e]||(n.xform=e,!1)}),n._setupEventHandlers(),n._scroll(n.offset),n}return _inherits(i,Component),_createClass(i,[{key:"destroy",value:function(){this._removeEventHandlers(),this.el.M_Carousel=void 0}},{key:"_setupEventHandlers",value:function(){var i=this;this._handleCarouselTapBound=this._handleCarouselTap.bind(this),this._handleCarouselDragBound=this._handleCarouselDrag.bind(this),this._handleCarouselReleaseBound=this._handleCarouselRelease.bind(this),this._handleCarouselClickBound=this._handleCarouselClick.bind(this),void 0!==window.ontouchstart&&(this.el.addEventListener("touchstart",this._handleCarouselTapBound),this.el.addEventListener("touchmove",this._handleCarouselDragBound),this.el.addEventListener("touchend",this._handleCarouselReleaseBound)),this.el.addEventListener("mousedown",this._handleCarouselTapBound),this.el.addEventListener("mousemove",this._handleCarouselDragBound),this.el.addEventListener("mouseup",this._handleCarouselReleaseBound),this.el.addEventListener("mouseleave",this._handleCarouselReleaseBound),this.el.addEventListener("click",this._handleCarouselClickBound),this.showIndicators&&this.$indicators&&(this._handleIndicatorClickBound=this._handleIndicatorClick.bind(this),this.$indicators.find(".indicator-item").each(function(t,e){t.addEventListener("click",i._handleIndicatorClickBound)}));var t=M.throttle(this._handleResize,200);this._handleThrottledResizeBound=t.bind(this),window.addEventListener("resize",this._handleThrottledResizeBound)}},{key:"_removeEventHandlers",value:function(){var i=this;void 0!==window.ontouchstart&&(this.el.removeEventListener("touchstart",this._handleCarouselTapBound),this.el.removeEventListener("touchmove",this._handleCarouselDragBound),this.el.removeEventListener("touchend",this._handleCarouselReleaseBound)),this.el.removeEventListener("mousedown",this._handleCarouselTapBound),this.el.removeEventListener("mousemove",this._handleCarouselDragBound),this.el.removeEventListener("mouseup",this._handleCarouselReleaseBound),this.el.removeEventListener("mouseleave",this._handleCarouselReleaseBound),this.el.removeEventListener("click",this._handleCarouselClickBound),this.showIndicators&&this.$indicators&&this.$indicators.find(".indicator-item").each(function(t,e){t.removeEventListener("click",i._handleIndicatorClickBound)}),window.removeEventListener("resize",this._handleThrottledResizeBound)}},{key:"_handleCarouselTap",value:function(t){"mousedown"===t.type&&b(t.target).is("img")&&t.preventDefault(),this.pressed=!0,this.dragged=!1,this.verticalDragged=!1,this.reference=this._xpos(t),this.referenceY=this._ypos(t),this.velocity=this.amplitude=0,this.frame=this.offset,this.timestamp=Date.now(),clearInterval(this.ticker),this.ticker=setInterval(this._trackBound,100)}},{key:"_handleCarouselDrag",value:function(t){var e=void 0,i=void 0,n=void 0;if(this.pressed)if(e=this._xpos(t),i=this._ypos(t),n=this.reference-e,Math.abs(this.referenceY-i)<30&&!this.verticalDragged)(2=this.dim*(this.count-1)?this.target=this.dim*(this.count-1):this.target<0&&(this.target=0)),this.amplitude=this.target-this.offset,this.timestamp=Date.now(),requestAnimationFrame(this._autoScrollBound),this.dragged&&(t.preventDefault(),t.stopPropagation()),!1}},{key:"_handleCarouselClick",value:function(t){if(this.dragged)return t.preventDefault(),t.stopPropagation(),!1;if(!this.options.fullWidth){var e=b(t.target).closest(".carousel-item").index();0!==this._wrap(this.center)-e&&(t.preventDefault(),t.stopPropagation()),this._cycleTo(e)}}},{key:"_handleIndicatorClick",value:function(t){t.stopPropagation();var e=b(t.target).closest(".indicator-item");e.length&&this._cycleTo(e.index())}},{key:"_handleResize",value:function(t){this.options.fullWidth?(this.itemWidth=this.$el.find(".carousel-item").first().innerWidth(),this.imageHeight=this.$el.find(".carousel-item.active").height(),this.dim=2*this.itemWidth+this.options.padding,this.offset=2*this.center*this.itemWidth,this.target=this.offset,this._setCarouselHeight(!0)):this._scroll()}},{key:"_setCarouselHeight",value:function(t){var i=this,e=this.$el.find(".carousel-item.active").length?this.$el.find(".carousel-item.active").first():this.$el.find(".carousel-item").first(),n=e.find("img").first();if(n.length)if(n[0].complete){var s=n.height();if(0=this.count?t%this.count:t<0?this._wrap(this.count+t%this.count):t}},{key:"_track",value:function(){var t,e,i,n;e=(t=Date.now())-this.timestamp,this.timestamp=t,i=this.offset-this.frame,this.frame=this.offset,n=1e3*i/(1+e),this.velocity=.8*n+.2*this.velocity}},{key:"_autoScroll",value:function(){var t=void 0,e=void 0;this.amplitude&&(t=Date.now()-this.timestamp,2<(e=this.amplitude*Math.exp(-t/this.options.duration))||e<-2?(this._scroll(this.target-e),requestAnimationFrame(this._autoScrollBound)):this._scroll(this.target))}},{key:"_scroll",value:function(t){var e=this;this.$el.hasClass("scrolling")||this.el.classList.add("scrolling"),null!=this.scrollingTimeout&&window.clearTimeout(this.scrollingTimeout),this.scrollingTimeout=window.setTimeout(function(){e.$el.removeClass("scrolling")},this.options.duration);var i,n,s,o,a=void 0,r=void 0,l=void 0,h=void 0,d=void 0,u=void 0,c=this.center,p=1/this.options.numVisible;if(this.offset="number"==typeof t?t:this.offset,this.center=Math.floor((this.offset+this.dim/2)/this.dim),o=-(s=(n=this.offset-this.center*this.dim)<0?1:-1)*n*2/this.dim,i=this.count>>1,this.options.fullWidth?(l="translateX(0)",u=1):(l="translateX("+(this.el.clientWidth-this.itemWidth)/2+"px) ",l+="translateY("+(this.el.clientHeight-this.itemHeight)/2+"px)",u=1-p*o),this.showIndicators){var v=this.center%this.count,f=this.$indicators.find(".indicator-item.active");f.index()!==v&&(f.removeClass("active"),this.$indicators.find(".indicator-item").eq(v)[0].classList.add("active"))}if(!this.noWrap||0<=this.center&&this.center=this.count||e<0){if(this.noWrap)return;e=this._wrap(e)}this._cycleTo(e)}},{key:"prev",value:function(t){(void 0===t||isNaN(t))&&(t=1);var e=this.center-t;if(e>=this.count||e<0){if(this.noWrap)return;e=this._wrap(e)}this._cycleTo(e)}},{key:"set",value:function(t,e){if((void 0===t||isNaN(t))&&(t=0),t>this.count||t<0){if(this.noWrap)return;t=this._wrap(t)}this._cycleTo(t,e)}}],[{key:"init",value:function(t,e){return _get(i.__proto__||Object.getPrototypeOf(i),"init",this).call(this,this,t,e)}},{key:"getInstance",value:function(t){return(t.jquery?t[0]:t).M_Carousel}},{key:"defaults",get:function(){return e}}]),i}();M.Carousel=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"carousel","M_Carousel")}(cash),function(S){"use strict";var e={onOpen:void 0,onClose:void 0},t=function(t){function n(t,e){_classCallCheck(this,n);var i=_possibleConstructorReturn(this,(n.__proto__||Object.getPrototypeOf(n)).call(this,n,t,e));return(i.el.M_TapTarget=i).options=S.extend({},n.defaults,e),i.isOpen=!1,i.$origin=S("#"+i.$el.attr("data-target")),i._setup(),i._calculatePositioning(),i._setupEventHandlers(),i}return _inherits(n,Component),_createClass(n,[{key:"destroy",value:function(){this._removeEventHandlers(),this.el.TapTarget=void 0}},{key:"_setupEventHandlers",value:function(){this._handleDocumentClickBound=this._handleDocumentClick.bind(this),this._handleTargetClickBound=this._handleTargetClick.bind(this),this._handleOriginClickBound=this._handleOriginClick.bind(this),this.el.addEventListener("click",this._handleTargetClickBound),this.originEl.addEventListener("click",this._handleOriginClickBound);var t=M.throttle(this._handleResize,200);this._handleThrottledResizeBound=t.bind(this),window.addEventListener("resize",this._handleThrottledResizeBound)}},{key:"_removeEventHandlers",value:function(){this.el.removeEventListener("click",this._handleTargetClickBound),this.originEl.removeEventListener("click",this._handleOriginClickBound),window.removeEventListener("resize",this._handleThrottledResizeBound)}},{key:"_handleTargetClick",value:function(t){this.open()}},{key:"_handleOriginClick",value:function(t){this.close()}},{key:"_handleResize",value:function(t){this._calculatePositioning()}},{key:"_handleDocumentClick",value:function(t){S(t.target).closest(".tap-target-wrapper").length||(this.close(),t.preventDefault(),t.stopPropagation())}},{key:"_setup",value:function(){this.wrapper=this.$el.parent()[0],this.waveEl=S(this.wrapper).find(".tap-target-wave")[0],this.originEl=S(this.wrapper).find(".tap-target-origin")[0],this.contentEl=this.$el.find(".tap-target-content")[0],S(this.wrapper).hasClass(".tap-target-wrapper")||(this.wrapper=document.createElement("div"),this.wrapper.classList.add("tap-target-wrapper"),this.$el.before(S(this.wrapper)),this.wrapper.append(this.el)),this.contentEl||(this.contentEl=document.createElement("div"),this.contentEl.classList.add("tap-target-content"),this.$el.append(this.contentEl)),this.waveEl||(this.waveEl=document.createElement("div"),this.waveEl.classList.add("tap-target-wave"),this.originEl||(this.originEl=this.$origin.clone(!0,!0),this.originEl.addClass("tap-target-origin"),this.originEl.removeAttr("id"),this.originEl.removeAttr("style"),this.originEl=this.originEl[0],this.waveEl.append(this.originEl)),this.wrapper.append(this.waveEl))}},{key:"_calculatePositioning",value:function(){var t="fixed"===this.$origin.css("position");if(!t)for(var e=this.$origin.parents(),i=0;i'+t.getAttribute("label")+"")[0]),i.each(function(t){var e=n._appendOptionWithIcon(n.$el,t,"optgroup-option");n._addOptionToValueDict(t,e)})}}),this.$el.after(this.dropdownOptions),this.input=document.createElement("input"),d(this.input).addClass("select-dropdown dropdown-trigger"),this.input.setAttribute("type","text"),this.input.setAttribute("readonly","true"),this.input.setAttribute("data-target",this.dropdownOptions.id),this.el.disabled&&d(this.input).prop("disabled","true"),this.$el.before(this.input),this._setValueToInput();var t=d('');if(this.$el.before(t[0]),!this.el.disabled){var e=d.extend({},this.options.dropdownOptions);e.onOpenEnd=function(t){var e=d(n.dropdownOptions).find(".selected").first();if(e.length&&(M.keyDown=!0,n.dropdown.focusedIndex=e.index(),n.dropdown._focusFocusedItem(),M.keyDown=!1,n.dropdown.isScrollable)){var i=e[0].getBoundingClientRect().top-n.dropdownOptions.getBoundingClientRect().top;i-=n.dropdownOptions.clientHeight/2,n.dropdownOptions.scrollTop=i}},this.isMultiple&&(e.closeOnClick=!1),this.dropdown=M.Dropdown.init(this.input,e)}this._setSelectedStates()}},{key:"_addOptionToValueDict",value:function(t,e){var i=Object.keys(this._valueDict).length,n=this.dropdownOptions.id+i,s={};e.id=n,s.el=t,s.optionEl=e,this._valueDict[n]=s}},{key:"_removeDropdown",value:function(){d(this.wrapper).find(".caret").remove(),d(this.input).remove(),d(this.dropdownOptions).remove(),d(this.wrapper).before(this.$el),d(this.wrapper).remove()}},{key:"_appendOptionWithIcon",value:function(t,e,i){var n=e.disabled?"disabled ":"",s="optgroup-option"===i?"optgroup-option ":"",o=this.isMultiple?'":e.innerHTML,a=d("
  • "),r=d("");r.html(o),a.addClass(n+" "+s),a.append(r);var l=e.getAttribute("data-icon");if(l){var h=d('');a.prepend(h)}return d(this.dropdownOptions).append(a[0]),a[0]}},{key:"_toggleEntryFromArray",value:function(t){var e=!this._keysSelected.hasOwnProperty(t),i=d(this._valueDict[t].optionEl);return e?this._keysSelected[t]=!0:delete this._keysSelected[t],i.toggleClass("selected",e),i.find('input[type="checkbox"]').prop("checked",e),i.prop("selected",e),e}},{key:"_setValueToInput",value:function(){var i=[];if(this.$el.find("option").each(function(t){if(d(t).prop("selected")){var e=d(t).text();i.push(e)}}),!i.length){var t=this.$el.find("option:disabled").eq(0);t.length&&""===t[0].value&&i.push(t.text())}this.input.value=i.join(", ")}},{key:"_setSelectedStates",value:function(){for(var t in this._keysSelected={},this._valueDict){var e=this._valueDict[t],i=d(e.el).prop("selected");d(e.optionEl).find('input[type="checkbox"]').prop("checked",i),i?(this._activateOption(d(this.dropdownOptions),d(e.optionEl)),this._keysSelected[t]=!0):d(e.optionEl).removeClass("selected")}}},{key:"_activateOption",value:function(t,e){e&&(this.isMultiple||t.find("li.selected").removeClass("selected"),d(e).addClass("selected"))}},{key:"getSelectedValues",value:function(){var t=[];for(var e in this._keysSelected)t.push(this._valueDict[e].el.value);return t}}],[{key:"init",value:function(t,e){return _get(n.__proto__||Object.getPrototypeOf(n),"init",this).call(this,this,t,e)}},{key:"getInstance",value:function(t){return(t.jquery?t[0]:t).M_FormSelect}},{key:"defaults",get:function(){return e}}]),n}();M.FormSelect=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"formSelect","M_FormSelect")}(cash),function(s,e){"use strict";var i={},t=function(t){function n(t,e){_classCallCheck(this,n);var i=_possibleConstructorReturn(this,(n.__proto__||Object.getPrototypeOf(n)).call(this,n,t,e));return(i.el.M_Range=i).options=s.extend({},n.defaults,e),i._mousedown=!1,i._setupThumb(),i._setupEventHandlers(),i}return _inherits(n,Component),_createClass(n,[{key:"destroy",value:function(){this._removeEventHandlers(),this._removeThumb(),this.el.M_Range=void 0}},{key:"_setupEventHandlers",value:function(){this._handleRangeChangeBound=this._handleRangeChange.bind(this),this._handleRangeMousedownTouchstartBound=this._handleRangeMousedownTouchstart.bind(this),this._handleRangeInputMousemoveTouchmoveBound=this._handleRangeInputMousemoveTouchmove.bind(this),this._handleRangeMouseupTouchendBound=this._handleRangeMouseupTouchend.bind(this),this._handleRangeBlurMouseoutTouchleaveBound=this._handleRangeBlurMouseoutTouchleave.bind(this),this.el.addEventListener("change",this._handleRangeChangeBound),this.el.addEventListener("mousedown",this._handleRangeMousedownTouchstartBound),this.el.addEventListener("touchstart",this._handleRangeMousedownTouchstartBound),this.el.addEventListener("input",this._handleRangeInputMousemoveTouchmoveBound),this.el.addEventListener("mousemove",this._handleRangeInputMousemoveTouchmoveBound),this.el.addEventListener("touchmove",this._handleRangeInputMousemoveTouchmoveBound),this.el.addEventListener("mouseup",this._handleRangeMouseupTouchendBound),this.el.addEventListener("touchend",this._handleRangeMouseupTouchendBound),this.el.addEventListener("blur",this._handleRangeBlurMouseoutTouchleaveBound),this.el.addEventListener("mouseout",this._handleRangeBlurMouseoutTouchleaveBound),this.el.addEventListener("touchleave",this._handleRangeBlurMouseoutTouchleaveBound)}},{key:"_removeEventHandlers",value:function(){this.el.removeEventListener("change",this._handleRangeChangeBound),this.el.removeEventListener("mousedown",this._handleRangeMousedownTouchstartBound),this.el.removeEventListener("touchstart",this._handleRangeMousedownTouchstartBound),this.el.removeEventListener("input",this._handleRangeInputMousemoveTouchmoveBound),this.el.removeEventListener("mousemove",this._handleRangeInputMousemoveTouchmoveBound),this.el.removeEventListener("touchmove",this._handleRangeInputMousemoveTouchmoveBound),this.el.removeEventListener("mouseup",this._handleRangeMouseupTouchendBound),this.el.removeEventListener("touchend",this._handleRangeMouseupTouchendBound),this.el.removeEventListener("blur",this._handleRangeBlurMouseoutTouchleaveBound),this.el.removeEventListener("mouseout",this._handleRangeBlurMouseoutTouchleaveBound),this.el.removeEventListener("touchleave",this._handleRangeBlurMouseoutTouchleaveBound)}},{key:"_handleRangeChange",value:function(){s(this.value).html(this.$el.val()),s(this.thumb).hasClass("active")||this._showRangeBubble();var t=this._calcRangeOffset();s(this.thumb).addClass("active").css("left",t+"px")}},{key:"_handleRangeMousedownTouchstart",value:function(t){if(s(this.value).html(this.$el.val()),this._mousedown=!0,this.$el.addClass("active"),s(this.thumb).hasClass("active")||this._showRangeBubble(),"input"!==t.type){var e=this._calcRangeOffset();s(this.thumb).addClass("active").css("left",e+"px")}}},{key:"_handleRangeInputMousemoveTouchmove",value:function(){if(this._mousedown){s(this.thumb).hasClass("active")||this._showRangeBubble();var t=this._calcRangeOffset();s(this.thumb).addClass("active").css("left",t+"px"),s(this.value).html(this.$el.val())}}},{key:"_handleRangeMouseupTouchend",value:function(){this._mousedown=!1,this.$el.removeClass("active")}},{key:"_handleRangeBlurMouseoutTouchleave",value:function(){if(!this._mousedown){var t=7+parseInt(this.$el.css("padding-left"))+"px";s(this.thumb).hasClass("active")&&(e.remove(this.thumb),e({targets:this.thumb,height:0,width:0,top:10,easing:"easeOutQuad",marginLeft:t,duration:100})),s(this.thumb).removeClass("active")}}},{key:"_setupThumb",value:function(){this.thumb=document.createElement("span"),this.value=document.createElement("span"),s(this.thumb).addClass("thumb"),s(this.value).addClass("value"),s(this.thumb).append(this.value),this.$el.after(this.thumb)}},{key:"_removeThumb",value:function(){s(this.thumb).remove()}},{key:"_showRangeBubble",value:function(){var t=-7+parseInt(s(this.thumb).parent().css("padding-left"))+"px";e.remove(this.thumb),e({targets:this.thumb,height:30,width:30,top:-30,marginLeft:t,duration:300,easing:"easeOutQuint"})}},{key:"_calcRangeOffset",value:function(){var t=this.$el.width()-15,e=parseFloat(this.$el.attr("max"))||100,i=parseFloat(this.$el.attr("min"))||0;return(parseFloat(this.$el.val())-i)/(e-i)*t}}],[{key:"init",value:function(t,e){return _get(n.__proto__||Object.getPrototypeOf(n),"init",this).call(this,this,t,e)}},{key:"getInstance",value:function(t){return(t.jquery?t[0]:t).M_Range}},{key:"defaults",get:function(){return i}}]),n}();M.Range=t,M.jQueryLoaded&&M.initializeJqueryWrapper(t,"range","M_Range"),t.init(s("input[type=range]"))}(cash,M.anime); \ No newline at end of file diff --git a/characters/index.html b/characters/index.html new file mode 100644 index 0000000..3510188 --- /dev/null +++ b/characters/index.html @@ -0,0 +1,101 @@ + + + + + +Charaktere - ThePhoenixDivision + + + + + + + + + + + +
    + +
    + +
    +

    Charaktere

    +

    TBD

    + + +
    +
    + + + + + + diff --git a/feed.xml b/feed.xml new file mode 100644 index 0000000..7bc9c38 --- /dev/null +++ b/feed.xml @@ -0,0 +1,17 @@ +Jekyll2025-03-16T23:29:06+00:00https://phoenixdivision.morlana.space/cpred/feed.xmlThePhoenixDivisionWe will share our adventures in Cyberpunk Red here.Welcome to Jekyll!2025-03-16T19:11:55+00:002025-03-16T19:11:55+00:00https://phoenixdivision.morlana.space/cpred/jekyll/update/2025/03/16/welcome-to-jekyllYou’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.

    + +

    Jekyll requires blog post files to be named according to the following format:

    + +

    YEAR-MONTH-DAY-title.MARKUP

    + +

    Where YEAR is a four-digit number, MONTH and DAY are both two-digit numbers, and MARKUP is the file extension representing the format used in the file. After that, include the necessary front matter. Take a look at the source for this post to get an idea about how it works.

    + +

    Jekyll also offers powerful support for code snippets:

    + +
    def print_hi(name)
    +  puts "Hi, #{name}"
    +end
    +print_hi('Tom')
    +#=> prints 'Hi, Tom' to STDOUT.
    + +

    Check out the Jekyll docs for more info on how to get the most out of Jekyll. File all bugs/feature requests at Jekyll’s GitHub repo. If you have questions, you can ask them on Jekyll Talk.

    ]]>
    \ No newline at end of file diff --git a/index.html b/index.html index 194122a..43752a5 100644 --- a/index.html +++ b/index.html @@ -1,2 +1,108 @@ - \ No newline at end of file + + + + +Die Rote Ära - ThePhoenixDivision + + + + + + + + + + + +
    + +
    + +
    + +
    +

    Welcome to Jekyll!

    +

    16.03.2025

    +

    You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.

    +

    + Weiterlesen... +
    +
    + + +
    +
    + + + + + + diff --git a/jekyll-theme-cyberpunk-0.1.0.gem b/jekyll-theme-cyberpunk-0.1.0.gem new file mode 100644 index 0000000..3c63a41 Binary files /dev/null and b/jekyll-theme-cyberpunk-0.1.0.gem differ diff --git a/jekyll-theme-cyberpunk.gemspec b/jekyll-theme-cyberpunk.gemspec new file mode 100644 index 0000000..c98f8d1 --- /dev/null +++ b/jekyll-theme-cyberpunk.gemspec @@ -0,0 +1,15 @@ +Gem::Specification.new do |spec| + spec.name = "jekyll-theme-cyberpunk" + spec.version = "0.1.0" + spec.authors = ["Florian Weber"] + spec.email = ["florian@thephoenixdi.vision"] + + spec.summary = "Ein Cyberpunk-Theme für Jekyll" + spec.homepage = "https://git.morlana.online/phoenixdivision/cpred" + spec.license = "MIT" + + spec.files = Dir["_layouts/*", "_includes/*", "_sass/*", "assets/css/*", "assets/js/*", "LICENSE.txt", "README.md"] + spec.require_paths = ["lib"] + + spec.add_runtime_dependency "jekyll", ">= 4.4.1" +end diff --git a/jekyll/update/2025/03/16/welcome-to-jekyll.html b/jekyll/update/2025/03/16/welcome-to-jekyll.html new file mode 100644 index 0000000..73c497e --- /dev/null +++ b/jekyll/update/2025/03/16/welcome-to-jekyll.html @@ -0,0 +1,121 @@ + + + + + +Welcome to Jekyll! - ThePhoenixDivision + + + + + + + + + + + +
    + +
    + +
    +
    +

    Welcome to Jekyll!

    +

    Datum: 16.03.2025

    +

    You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run jekyll serve, which launches a web server and auto-regenerates your site when a file is updated.

    + +

    Jekyll requires blog post files to be named according to the following format:

    + +

    YEAR-MONTH-DAY-title.MARKUP

    + +

    Where YEAR is a four-digit number, MONTH and DAY are both two-digit numbers, and MARKUP is the file extension representing the format used in the file. After that, include the necessary front matter. Take a look at the source for this post to get an idea about how it works.

    + +

    Jekyll also offers powerful support for code snippets:

    + +
    def print_hi(name)
    +  puts "Hi, #{name}"
    +end
    +print_hi('Tom')
    +#=> prints 'Hi, Tom' to STDOUT.
    + +

    Check out the Jekyll docs for more info on how to get the most out of Jekyll. File all bugs/feature requests at Jekyll’s GitHub repo. If you have questions, you can ask them on Jekyll Talk.

    + + +
    + +
    +
    + + + + + + diff --git a/lifepaths/index.html b/lifepaths/index.html new file mode 100644 index 0000000..944bdb3 --- /dev/null +++ b/lifepaths/index.html @@ -0,0 +1,357 @@ + + + + + +Lebensweg - ThePhoenixDivision + + + + + + + + + + + +
    + +
    + +
    +

    Lebensweg

    +

    Kulturelle Herkunft

    + +

    Wirf 1W10 oder wähle eine aus.

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    WurfDeine (allgemeine) KulturregionSprachen, die du vielleicht kennst (Wähle eine aus deiner Gruppe aus)
    1NordamerikansichChinsesisch, Cree, Englisch, Französisch, Kreol, Navajo, Spanisch
    2Süd-/MittelamerikanischDeutsch, Englisch, Guarani, Kreol, Maya, Portugiesisch, Quechua, Spanisch
    3WesteuropäischDeutsch, Englisch, Französisch, Holländisch, Italienisch, Norwegisch, Portugiesisch, Spanisch
    4OsteuropäischEnglisch, Finnisch, Polnisch, Rumänisch, Russisch, Ukrainisch
    5Nahöstlich/NordafrikanischArabisch, Berberisch, Englisch, Farsi, Französisch, Hebräisch, Türkisch
    6SchwarzafrikansichArabisch, Englisch, Französisch, Hausa, Lingala, Oromo, Portugiesisch, Swahili, Twi, Yoruba
    7SüdasiatischBengali, Dari, Englisch, Hindi, Nepalisch, Singhalesisch, Tamil, Urdu
    8SüdostasiatischArabisch, Burnesisch, Englisch, Filipino, Hindi, Indonesisch, Khmer, Malaysisch, Vietnamesisch
    9OstasiatischEnglisch, Japanisch, Kantonesisch, Koreanisch, Mandarin, Mongolisch
    10Ozeanisch/PazifikinsulanerEnglisch, Französisch, Hawaiianisch, Maori, Pama-Nyunga, Tahitisch
    + +

    Deine Persönlichkeit

    + +

    Wirf 1W10 oder wähle eine aus.

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    WurfWie bist du?
    1Zurückhaltend und geheimnisvoll
    2Rebellisch, antisozial und gewalttätig
    3Arrogant, stolz und unnahbar
    4Launisch, impulsiv und eigenwillig
    5Pingelig, zimperlich und nervös
    6Gefestigt und ernst
    7Albern und unverdrossen
    8Raffiniert und tückisch
    9Intelektuell und abgeklärt
    10Freundlich und offen
    + +

    Kleidung und persönlicher Stil

    + +

    Wirf 1W10 für jede Spalte oder wähle eine aus jeder Spalte.

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    WurfKleidungsstilFrisur
    1Generisch-Modän (Standard, Farbenfroh, Modular)Mohawk
    2Freizeit (Bequem, Beweglich, Athletisch)Lang und verlottert
    3Stadtprotz (Protzig, Technologisch, Straßenkleidung)Kurz und stachelig
    4Geschäftlich (Führung, Präsenz, Autorität)Wild und wuschelig
    5Topmodisch (Exklusiv, Designer, Couture)Kahl
    6Ausgefallen (Volkstümlich, Retro, Freigeistig)Gestreift
    7Stadtstreicher-Chic (Obdachlos, Abgerissen, Unstet)Wilde Farben
    8Gangfarben (Gefährlich, Gewalttätig, Rebellisch)Sauber und kurz
    9Nomaden-Lederkluft (Western, Wild, Stammestracht)Kurz und lockig
    10Asia Pop (Grell, Kostümartig, Jugendlich)Lang und gerade
    + +

    Wirf 1W10 oder wähle eine aus.

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    WurfVorlieben, ohne die man dich niemals sieht
    1Tätowierungen
    2Verspiegelte Sonnenbrille
    3Rituelle Narben
    4Nagelhandschuhe
    5Nasenringe
    6Piercing in der Zunge oder anderswo
    7Seltsame Fingernagelimplantate
    8Stiefel oder Stöckelschuhe mit Nägeln
    9Fingerlose Handschuhe
    10Komische Kontaktlinsen
    + +

    Deine Motivation und Beziehungen

    + +

    Was du am meisten schätzt

    + +

    Deine Familiäre Herkunft

    + +

    Dein Umfeld

    + +

    Deine Familienkrise

    + +

    Süße Rache

    + +

    Deine Lebensziele

    + +

    Deine Freunde, Deine Feinde, Deine tragische(n) Liebschaft(en)

    + +

    Diese Dinge werden per Zufall ausgewürfelt und müssen Vorort geklärt werden.

    + + +
    +
    + + + + + + diff --git a/roles/index.html b/roles/index.html new file mode 100644 index 0000000..786b52e --- /dev/null +++ b/roles/index.html @@ -0,0 +1,101 @@ + + + + + +Rollen - ThePhoenixDivision + + + + + + + + + + + +
    + +
    + +
    +

    Rollen

    +

    TBD

    + + +
    +
    + + + + + +