From c2a2e36cff1b172290a5fe3874758e3f5b2f72d7 Mon Sep 17 00:00:00 2001 From: Mlbiche Date: Tue, 23 Feb 2021 08:46:47 +0100 Subject: [PATCH 1/5] Update project to Dart Sass - Update project to Dart Sass - Replace @import rules with @use --- dist/spectre-exp.css | 837 +++------ dist/spectre-exp.min.css | 2 +- dist/spectre-icons.css | 355 +--- dist/spectre-icons.min.css | 2 +- dist/spectre.css | 2772 ++++++++---------------------- dist/spectre.min.css | 2 +- docs/src/scss/docs.scss | 135 +- docs/src/scss/spectre-rtl.scss | 4 +- gulpfile.js | 6 +- package.json | 2 +- src/_accordions.scss | 6 +- src/_animations.scss | 4 +- src/_asian.scss | 12 +- src/_autocomplete.scss | 17 +- src/_avatars.scss | 37 +- src/_badges.scss | 12 +- src/_bars.scss | 42 +- src/_base.scss | 23 +- src/_breadcrumbs.scss | 18 +- src/_buttons.scss | 103 +- src/_calendars.scss | 110 +- src/_cards.scss | 22 +- src/_carousels.scss | 30 +- src/_chips.scss | 22 +- src/_codes.scss | 22 +- src/_comparison-sliders.scss | 32 +- src/_dropdowns.scss | 6 +- src/_empty.scss | 16 +- src/_filters.scss | 8 +- src/_forms.scss | 258 +-- src/_hero.scss | 4 +- src/_icons.scss | 8 +- src/_labels.scss | 18 +- src/_layout.scss | 36 +- src/_media.scss | 8 +- src/_menus.scss | 39 +- src/_meters.scss | 26 +- src/_mixins.scss | 18 +- src/_modals.scss | 37 +- src/_navbar.scss | 4 +- src/_navs.scss | 19 +- src/_normalize.scss | 4 +- src/_off-canvas.scss | 26 +- src/_pagination.scss | 20 +- src/_panels.scss | 10 +- src/_parallax.scss | 13 +- src/_popovers.scss | 11 +- src/_progress.scss | 22 +- src/_sliders.scss | 53 +- src/_steps.scss | 30 +- src/_tables.scss | 16 +- src/_tabs.scss | 24 +- src/_tiles.scss | 11 +- src/_timelines.scss | 30 +- src/_toasts.scss | 25 +- src/_tooltips.scss | 32 +- src/_typography.scss | 34 +- src/_utilities.scss | 16 +- src/_variables.scss | 33 +- src/_viewer-360.scss | 3 +- src/icons/_icons-action.scss | 77 +- src/icons/_icons-core.scss | 4 +- src/icons/_icons-navigation.scss | 10 +- src/icons/_icons-object.scss | 49 +- src/mixins/_avatar.scss | 4 +- src/mixins/_button.scss | 42 +- src/mixins/_color.scss | 15 +- src/mixins/_label.scss | 6 +- src/mixins/_position.scss | 6 +- src/mixins/_shadow.scss | 6 +- src/mixins/_toast.scss | 4 +- src/spectre-exp.scss | 30 +- src/spectre-icons.scss | 14 +- src/spectre.scss | 76 +- src/utilities/_colors.scss | 33 +- src/utilities/_divider.scss | 30 +- src/utilities/_loading.scss | 26 +- src/utilities/_position.scss | 18 +- src/utilities/_shapes.scss | 4 +- src/utilities/_text.scss | 4 +- 80 files changed, 2186 insertions(+), 3819 deletions(-) diff --git a/dist/spectre-exp.css b/dist/spectre-exp.css index 446b27758..47e307398 100644 --- a/dist/spectre-exp.css +++ b/dist/spectre-exp.css @@ -1,9 +1,6 @@ -/*! Spectre.css Experimentals v0.5.9 | MIT License | github.com/picturepan2/spectre */ .form-autocomplete { position: relative; -} - -.form-autocomplete .form-autocomplete-input { +}.form-autocomplete .form-autocomplete-input { align-content: flex-start; display: -ms-flexbox; display: flex; @@ -13,14 +10,10 @@ height: auto; min-height: 1.6rem; padding: .1rem; -} - -.form-autocomplete .form-autocomplete-input.is-focused { - border-color: #5755d9; - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.form-autocomplete .form-autocomplete-input .form-input { +}.form-autocomplete .form-autocomplete-input.is-focused { + border-color: #5755d9; + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.form-autocomplete .form-autocomplete-input .form-input { border-color: transparent; box-shadow: none; display: inline-block; @@ -30,34 +23,24 @@ line-height: .8rem; margin: .1rem; width: auto; -} - -.form-autocomplete .menu { +}.form-autocomplete .menu { left: 0; position: absolute; top: 100%; width: 100%; -} - -.form-autocomplete.autocomplete-oneline .form-autocomplete-input { +}.form-autocomplete.autocomplete-oneline .form-autocomplete-input { -ms-flex-wrap: nowrap; flex-wrap: nowrap; overflow-x: auto; -} - -.form-autocomplete.autocomplete-oneline .chip { +}.form-autocomplete.autocomplete-oneline .chip { -ms-flex: 1 0 auto; flex: 1 0 auto; -} - -.calendar { +}.calendar { border: .05rem solid #dadee4; border-radius: .1rem; display: block; min-width: 280px; -} - -.calendar .calendar-nav { +}.calendar .calendar-nav { align-items: center; background: #f7f8f9; border-top-left-radius: .1rem; @@ -67,9 +50,7 @@ -ms-flex-align: center; font-size: .9rem; padding: .4rem; -} - -.calendar .calendar-header, +}.calendar .calendar-header, .calendar .calendar-body { display: -ms-flexbox; display: flex; @@ -78,33 +59,23 @@ flex-wrap: wrap; justify-content: center; padding: .4rem 0; -} - -.calendar .calendar-header .calendar-date, +}.calendar .calendar-header .calendar-date, .calendar .calendar-body .calendar-date { -ms-flex: 0 0 14.28%; flex: 0 0 14.28%; max-width: 14.28%; -} - -.calendar .calendar-header { +}.calendar .calendar-header { background: #f7f8f9; border-bottom: .05rem solid #dadee4; color: #bcc3ce; font-size: .7rem; text-align: center; -} - -.calendar .calendar-body { +}.calendar .calendar-body { color: #66758c; -} - -.calendar .calendar-date { +}.calendar .calendar-date { border: 0; padding: .2rem; -} - -.calendar .calendar-date .date-item { +}.calendar .calendar-date .date-item { -webkit-appearance: none; -moz-appearance: none; appearance: none; @@ -121,64 +92,46 @@ position: relative; text-align: center; text-decoration: none; - transition: background .2s, border .2s, box-shadow .2s, color .2s; + transition: background .2s,border .2s,box-shadow .2s,color .2s; vertical-align: middle; white-space: nowrap; width: 1.4rem; -} - -.calendar .calendar-date .date-item.date-today { +}.calendar .calendar-date .date-item.date-today { border-color: #e5e5f9; color: #5755d9; -} - -.calendar .calendar-date .date-item:focus { - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.calendar .calendar-date .date-item:focus, +}.calendar .calendar-date .date-item:focus { + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.calendar .calendar-date .date-item:focus, .calendar .calendar-date .date-item:hover { background: #fefeff; border-color: #e5e5f9; color: #5755d9; text-decoration: none; -} - -.calendar .calendar-date .date-item:active, +}.calendar .calendar-date .date-item:active, .calendar .calendar-date .date-item.active { background: #4b48d6; border-color: #3634d2; color: #fff; -} - -.calendar .calendar-date .date-item.badge::after { +}.calendar .calendar-date .date-item.badge::after { position: absolute; right: 3px; top: 3px; transform: translate(50%, -50%); -} - -.calendar .calendar-date .date-item:disabled, +}.calendar .calendar-date .date-item:disabled, .calendar .calendar-date .date-item.disabled, .calendar .calendar-date .calendar-event:disabled, .calendar .calendar-date .calendar-event.disabled { cursor: default; opacity: .25; pointer-events: none; -} - -.calendar .calendar-date.prev-month .date-item, +}.calendar .calendar-date.prev-month .date-item, .calendar .calendar-date.prev-month .calendar-event, .calendar .calendar-date.next-month .date-item, .calendar .calendar-date.next-month .calendar-event { opacity: .25; -} - -.calendar .calendar-range { +}.calendar .calendar-range { position: relative; -} - -.calendar .calendar-range::before { +}.calendar .calendar-range::before { background: #f1f1fc; content: ""; height: 1.4rem; @@ -187,32 +140,20 @@ right: 0; top: 50%; transform: translateY(-50%); -} - -.calendar .calendar-range.range-start::before { +}.calendar .calendar-range.range-start::before { left: 50%; -} - -.calendar .calendar-range.range-end::before { +}.calendar .calendar-range.range-end::before { right: 50%; -} - -.calendar .calendar-range.range-start .date-item, +}.calendar .calendar-range.range-start .date-item, .calendar .calendar-range.range-end .date-item { background: #4b48d6; border-color: #3634d2; color: #fff; -} - -.calendar .calendar-range .date-item { +}.calendar .calendar-range .date-item { color: #5755d9; -} - -.calendar.calendar-lg .calendar-body { +}.calendar.calendar-lg .calendar-body { padding: 0; -} - -.calendar.calendar-lg .calendar-body .calendar-date { +}.calendar.calendar-lg .calendar-body .calendar-date { border-bottom: .05rem solid #dadee4; border-right: .05rem solid #dadee4; display: -ms-flexbox; @@ -221,46 +162,30 @@ flex-direction: column; height: 5.5rem; padding: 0; -} - -.calendar.calendar-lg .calendar-body .calendar-date:nth-child(7n) { +}.calendar.calendar-lg .calendar-body .calendar-date:nth-child(7n) { border-right: 0; -} - -.calendar.calendar-lg .calendar-body .calendar-date:nth-last-child(-n+7) { +}.calendar.calendar-lg .calendar-body .calendar-date:nth-last-child(-n+7) { border-bottom: 0; -} - -.calendar.calendar-lg .date-item { +}.calendar.calendar-lg .date-item { align-self: flex-end; -ms-flex-item-align: end; height: 1.4rem; margin-right: .2rem; margin-top: .2rem; -} - -.calendar.calendar-lg .calendar-range::before { +}.calendar.calendar-lg .calendar-range::before { top: 19px; -} - -.calendar.calendar-lg .calendar-range.range-start::before { +}.calendar.calendar-lg .calendar-range.range-start::before { left: auto; width: 19px; -} - -.calendar.calendar-lg .calendar-range.range-end::before { +}.calendar.calendar-lg .calendar-range.range-end::before { right: 19px; -} - -.calendar.calendar-lg .calendar-events { +}.calendar.calendar-lg .calendar-events { flex-grow: 1; -ms-flex-positive: 1; line-height: 1; overflow-y: auto; padding: .2rem; -} - -.calendar.calendar-lg .calendar-event { +}.calendar.calendar-lg .calendar-event { border-radius: .1rem; display: block; font-size: .7rem; @@ -269,33 +194,27 @@ padding: 3px 4px; text-overflow: ellipsis; white-space: nowrap; -} - -.carousel .carousel-locator:nth-of-type(1):checked ~ .carousel-container .carousel-item:nth-of-type(1), -.carousel .carousel-locator:nth-of-type(2):checked ~ .carousel-container .carousel-item:nth-of-type(2), -.carousel .carousel-locator:nth-of-type(3):checked ~ .carousel-container .carousel-item:nth-of-type(3), -.carousel .carousel-locator:nth-of-type(4):checked ~ .carousel-container .carousel-item:nth-of-type(4), -.carousel .carousel-locator:nth-of-type(5):checked ~ .carousel-container .carousel-item:nth-of-type(5), -.carousel .carousel-locator:nth-of-type(6):checked ~ .carousel-container .carousel-item:nth-of-type(6), +}.carousel .carousel-locator:nth-of-type(8):checked ~ .carousel-container .carousel-item:nth-of-type(8), .carousel .carousel-locator:nth-of-type(7):checked ~ .carousel-container .carousel-item:nth-of-type(7), -.carousel .carousel-locator:nth-of-type(8):checked ~ .carousel-container .carousel-item:nth-of-type(8) { +.carousel .carousel-locator:nth-of-type(6):checked ~ .carousel-container .carousel-item:nth-of-type(6), +.carousel .carousel-locator:nth-of-type(5):checked ~ .carousel-container .carousel-item:nth-of-type(5), +.carousel .carousel-locator:nth-of-type(4):checked ~ .carousel-container .carousel-item:nth-of-type(4), +.carousel .carousel-locator:nth-of-type(3):checked ~ .carousel-container .carousel-item:nth-of-type(3), +.carousel .carousel-locator:nth-of-type(2):checked ~ .carousel-container .carousel-item:nth-of-type(2), +.carousel .carousel-locator:nth-of-type(1):checked ~ .carousel-container .carousel-item:nth-of-type(1) { animation: carousel-slidein .75s ease-in-out 1; opacity: 1; z-index: 100; -} - -.carousel .carousel-locator:nth-of-type(1):checked ~ .carousel-nav .nav-item:nth-of-type(1), -.carousel .carousel-locator:nth-of-type(2):checked ~ .carousel-nav .nav-item:nth-of-type(2), -.carousel .carousel-locator:nth-of-type(3):checked ~ .carousel-nav .nav-item:nth-of-type(3), -.carousel .carousel-locator:nth-of-type(4):checked ~ .carousel-nav .nav-item:nth-of-type(4), -.carousel .carousel-locator:nth-of-type(5):checked ~ .carousel-nav .nav-item:nth-of-type(5), -.carousel .carousel-locator:nth-of-type(6):checked ~ .carousel-nav .nav-item:nth-of-type(6), +}.carousel .carousel-locator:nth-of-type(8):checked ~ .carousel-nav .nav-item:nth-of-type(8), .carousel .carousel-locator:nth-of-type(7):checked ~ .carousel-nav .nav-item:nth-of-type(7), -.carousel .carousel-locator:nth-of-type(8):checked ~ .carousel-nav .nav-item:nth-of-type(8) { +.carousel .carousel-locator:nth-of-type(6):checked ~ .carousel-nav .nav-item:nth-of-type(6), +.carousel .carousel-locator:nth-of-type(5):checked ~ .carousel-nav .nav-item:nth-of-type(5), +.carousel .carousel-locator:nth-of-type(4):checked ~ .carousel-nav .nav-item:nth-of-type(4), +.carousel .carousel-locator:nth-of-type(3):checked ~ .carousel-nav .nav-item:nth-of-type(3), +.carousel .carousel-locator:nth-of-type(2):checked ~ .carousel-nav .nav-item:nth-of-type(2), +.carousel .carousel-locator:nth-of-type(1):checked ~ .carousel-nav .nav-item:nth-of-type(1) { color: #f7f8f9; -} - -.carousel { +}.carousel { background: #f7f8f9; display: block; overflow: hidden; @@ -303,21 +222,15 @@ position: relative; width: 100%; z-index: 1; -} - -.carousel .carousel-container { +}.carousel .carousel-container { height: 100%; left: 0; position: relative; -} - -.carousel .carousel-container::before { +}.carousel .carousel-container::before { content: ""; display: block; padding-bottom: 56.25%; -} - -.carousel .carousel-container .carousel-item { +}.carousel .carousel-container .carousel-item { animation: carousel-slideout 1s ease-in-out 1; height: 100%; left: 0; @@ -326,17 +239,13 @@ position: absolute; top: 0; width: 100%; -} - -.carousel .carousel-container .carousel-item:hover .item-prev, +}.carousel .carousel-container .carousel-item:hover .item-prev, .carousel .carousel-container .carousel-item:hover .item-next { opacity: 1; -} - -.carousel .carousel-container .item-prev, +}.carousel .carousel-container .item-prev, .carousel .carousel-container .item-next { - background: rgba(247, 248, 249, .25); - border-color: rgba(247, 248, 249, .5); + background: rgba(247,248,249,.25); + border-color: rgba(247,248,249,.5); color: #f7f8f9; opacity: 0; position: absolute; @@ -344,17 +253,11 @@ transform: translateY(-50%); transition: all .4s; z-index: 100; -} - -.carousel .carousel-container .item-prev { +}.carousel .carousel-container .item-prev { left: 1rem; -} - -.carousel .carousel-container .item-next { +}.carousel .carousel-container .item-next { right: 1rem; -} - -.carousel .carousel-nav { +}.carousel .carousel-nav { bottom: .4rem; display: -ms-flexbox; display: flex; @@ -365,10 +268,8 @@ transform: translateX(-50%); width: 10rem; z-index: 100; -} - -.carousel .carousel-nav .nav-item { - color: rgba(247, 248, 249, .5); +}.carousel .carousel-nav .nav-item { + color: rgba(247,248,249,.5); display: block; -ms-flex: 1 0 auto; flex: 1 0 auto; @@ -376,9 +277,7 @@ margin: .2rem; max-width: 2.5rem; position: relative; -} - -.carousel .carousel-nav .nav-item::before { +}.carousel .carousel-nav .nav-item::before { background: currentColor; content: ""; display: block; @@ -386,37 +285,27 @@ position: absolute; top: .5rem; width: 100%; -} - -@keyframes carousel-slidein { +}@keyframes carousel-slidein { 0% { transform: translateX(100%); - } - 100% { + }100% { transform: translateX(0); } -} - -@keyframes carousel-slideout { +}@keyframes carousel-slideout { 0% { opacity: 1; transform: translateX(0); - } - 100% { + }100% { opacity: 1; transform: translateX(-50%); } -} - -.comparison-slider { +}.comparison-slider { height: 50vh; overflow: hidden; - -webkit-overflow-scrolling: touch; + -webkit-overflow-scrolling: touch; position: relative; width: 100%; -} - -.comparison-slider .comparison-before, +}.comparison-slider .comparison-before, .comparison-slider .comparison-after { height: 100%; left: 0; @@ -424,33 +313,23 @@ overflow: hidden; position: absolute; top: 0; -} - -.comparison-slider .comparison-before img, +}.comparison-slider .comparison-before img, .comparison-slider .comparison-after img { height: 100%; object-fit: cover; object-position: left center; position: absolute; width: 100%; -} - -.comparison-slider .comparison-before { +}.comparison-slider .comparison-before { width: 100%; z-index: 1; -} - -.comparison-slider .comparison-before .comparison-label { +}.comparison-slider .comparison-before .comparison-label { right: .8rem; -} - -.comparison-slider .comparison-after { +}.comparison-slider .comparison-after { max-width: 100%; min-width: 0; z-index: 2; -} - -.comparison-slider .comparison-after::before { +}.comparison-slider .comparison-after::before { background: transparent; content: ""; cursor: default; @@ -460,12 +339,10 @@ right: .8rem; top: 0; z-index: 1; -} - -.comparison-slider .comparison-after::after { +}.comparison-slider .comparison-after::after { background: currentColor; border-radius: 50%; - box-shadow: 0 -5px, 0 5px; + box-shadow: 0 -5px,0 5px; color: #fff; content: ""; height: 3px; @@ -475,13 +352,9 @@ top: 50%; transform: translate(50%, -50%); width: 3px; -} - -.comparison-slider .comparison-after .comparison-label { +}.comparison-slider .comparison-after .comparison-label { left: .8rem; -} - -.comparison-slider .comparison-resizer { +}.comparison-slider .comparison-resizer { animation: first-run 1.5s 1 ease-in-out; cursor: ew-resize; height: .8rem; @@ -495,74 +368,55 @@ top: 50%; transform: translateY(-50%) scaleY(30); width: 0; -} - -.comparison-slider .comparison-label { - background: rgba(48, 55, 66, .5); +}.comparison-slider .comparison-label { + background: rgba(48,55,66,.5); bottom: .8rem; color: #fff; padding: .2rem .4rem; position: absolute; -webkit-user-select: none; - -moz-user-select: none; -ms-user-select: none; user-select: none; -} - -@keyframes first-run { +}@keyframes first-run { 0% { width: 0; - } - 25% { + }25% { width: 2.4rem; - } - 50% { + }50% { width: .8rem; - } - 75% { + }75% { width: 1.2rem; - } - 100% { + }100% { width: 0; } -} - -.filter .filter-tag#tag-0:checked ~ .filter-nav .chip[for="tag-0"], -.filter .filter-tag#tag-1:checked ~ .filter-nav .chip[for="tag-1"], -.filter .filter-tag#tag-2:checked ~ .filter-nav .chip[for="tag-2"], -.filter .filter-tag#tag-3:checked ~ .filter-nav .chip[for="tag-3"], -.filter .filter-tag#tag-4:checked ~ .filter-nav .chip[for="tag-4"], -.filter .filter-tag#tag-5:checked ~ .filter-nav .chip[for="tag-5"], -.filter .filter-tag#tag-6:checked ~ .filter-nav .chip[for="tag-6"], -.filter .filter-tag#tag-7:checked ~ .filter-nav .chip[for="tag-7"], -.filter .filter-tag#tag-8:checked ~ .filter-nav .chip[for="tag-8"] { +}.filter .filter-tag#tag-8:checked ~ .filter-nav .chip[for=tag-8], +.filter .filter-tag#tag-7:checked ~ .filter-nav .chip[for=tag-7], +.filter .filter-tag#tag-6:checked ~ .filter-nav .chip[for=tag-6], +.filter .filter-tag#tag-5:checked ~ .filter-nav .chip[for=tag-5], +.filter .filter-tag#tag-4:checked ~ .filter-nav .chip[for=tag-4], +.filter .filter-tag#tag-3:checked ~ .filter-nav .chip[for=tag-3], +.filter .filter-tag#tag-2:checked ~ .filter-nav .chip[for=tag-2], +.filter .filter-tag#tag-1:checked ~ .filter-nav .chip[for=tag-1], +.filter .filter-tag#tag-0:checked ~ .filter-nav .chip[for=tag-0] { background: #5755d9; color: #fff; -} - -.filter .filter-tag#tag-1:checked ~ .filter-body .filter-item:not([data-tag~="tag-1"]), -.filter .filter-tag#tag-2:checked ~ .filter-body .filter-item:not([data-tag~="tag-2"]), -.filter .filter-tag#tag-3:checked ~ .filter-body .filter-item:not([data-tag~="tag-3"]), -.filter .filter-tag#tag-4:checked ~ .filter-body .filter-item:not([data-tag~="tag-4"]), -.filter .filter-tag#tag-5:checked ~ .filter-body .filter-item:not([data-tag~="tag-5"]), -.filter .filter-tag#tag-6:checked ~ .filter-body .filter-item:not([data-tag~="tag-6"]), -.filter .filter-tag#tag-7:checked ~ .filter-body .filter-item:not([data-tag~="tag-7"]), -.filter .filter-tag#tag-8:checked ~ .filter-body .filter-item:not([data-tag~="tag-8"]) { +}.filter .filter-tag#tag-8:checked ~ .filter-body .filter-item:not([data-tag~=tag-8]), +.filter .filter-tag#tag-7:checked ~ .filter-body .filter-item:not([data-tag~=tag-7]), +.filter .filter-tag#tag-6:checked ~ .filter-body .filter-item:not([data-tag~=tag-6]), +.filter .filter-tag#tag-5:checked ~ .filter-body .filter-item:not([data-tag~=tag-5]), +.filter .filter-tag#tag-4:checked ~ .filter-body .filter-item:not([data-tag~=tag-4]), +.filter .filter-tag#tag-3:checked ~ .filter-body .filter-item:not([data-tag~=tag-3]), +.filter .filter-tag#tag-2:checked ~ .filter-body .filter-item:not([data-tag~=tag-2]), +.filter .filter-tag#tag-1:checked ~ .filter-body .filter-item:not([data-tag~=tag-1]) { display: none; -} - -.filter .filter-nav { +}.filter .filter-nav { margin: .4rem 0; -} - -.filter .filter-body { +}.filter .filter-body { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -} - -.meter { +}.meter { -webkit-appearance: none; -moz-appearance: none; appearance: none; @@ -570,57 +424,35 @@ border: 0; border-radius: .1rem; display: block; - height: .8rem; + height: .8rem; width: 100%; -} - -.meter::-webkit-meter-inner-element { +}.meter::-webkit-meter-inner-element { display: block; -} - -.meter::-webkit-meter-bar, +}.meter::-webkit-meter-bar, .meter::-webkit-meter-optimum-value, .meter::-webkit-meter-suboptimum-value, .meter::-webkit-meter-even-less-good-value { border-radius: .1rem; -} - -.meter::-webkit-meter-bar { +}.meter::-webkit-meter-bar { background: #f7f8f9; -} - -.meter::-webkit-meter-optimum-value { +}.meter::-webkit-meter-optimum-value { background: #32b643; -} - -.meter::-webkit-meter-suboptimum-value { +}.meter::-webkit-meter-suboptimum-value { background: #ffb700; -} - -.meter::-webkit-meter-even-less-good-value { +}.meter::-webkit-meter-even-less-good-value { background: #e85600; -} - -.meter::-moz-meter-bar, +}.meter::-moz-meter-bar, .meter:-moz-meter-optimum, .meter:-moz-meter-sub-optimum, .meter:-moz-meter-sub-sub-optimum { border-radius: .1rem; -} - -.meter:-moz-meter-optimum::-moz-meter-bar { +}.meter:-moz-meter-optimum::-moz-meter-bar { background: #32b643; -} - -.meter:-moz-meter-sub-optimum::-moz-meter-bar { +}.meter:-moz-meter-sub-optimum::-moz-meter-bar { background: #ffb700; -} - -.meter:-moz-meter-sub-sub-optimum::-moz-meter-bar { +}.meter:-moz-meter-sub-sub-optimum::-moz-meter-bar { background: #e85600; -} - -.off-canvas { +}.off-canvas { display: -ms-flexbox; display: flex; -ms-flex-flow: nowrap; @@ -628,18 +460,14 @@ height: 100%; position: relative; width: 100%; -} - -.off-canvas .off-canvas-toggle { +}.off-canvas .off-canvas-toggle { display: block; - left: .4rem; + left: .4rem; position: absolute; top: .4rem; transition: none; z-index: 1; -} - -.off-canvas .off-canvas-sidebar { +}.off-canvas .off-canvas-sidebar { background: #f7f8f9; bottom: 0; left: 0; @@ -647,20 +475,16 @@ overflow-y: auto; position: fixed; top: 0; - transform: translateX(-100%); + transform: translateX(-100%); transition: transform .25s; z-index: 200; -} - -.off-canvas .off-canvas-content { +}.off-canvas .off-canvas-content { -ms-flex: 1 1 auto; flex: 1 1 auto; height: 100%; padding: .4rem .4rem .4rem 4rem; -} - -.off-canvas .off-canvas-overlay { - background: rgba(48, 55, 66, .1); +}.off-canvas .off-canvas-overlay { + background: rgba(48,55,66,.1); border-color: transparent; border-radius: 0; bottom: 0; @@ -671,51 +495,37 @@ right: 0; top: 0; width: 100%; -} - -.off-canvas .off-canvas-sidebar:target, +}.off-canvas .off-canvas-sidebar:target, .off-canvas .off-canvas-sidebar.active { transform: translateX(0); -} - -.off-canvas .off-canvas-sidebar:target ~ .off-canvas-overlay, +}.off-canvas .off-canvas-sidebar:target ~ .off-canvas-overlay, .off-canvas .off-canvas-sidebar.active ~ .off-canvas-overlay { display: block; z-index: 100; -} - -@media (min-width: 960px) { +}@media(min-width: 960px) { .off-canvas.off-canvas-sidebar-show .off-canvas-toggle { display: none; - } - .off-canvas.off-canvas-sidebar-show .off-canvas-sidebar { + }.off-canvas.off-canvas-sidebar-show .off-canvas-sidebar { -ms-flex: 0 0 auto; flex: 0 0 auto; position: relative; transform: none; - } - .off-canvas.off-canvas-sidebar-show .off-canvas-overlay { + }.off-canvas.off-canvas-sidebar-show .off-canvas-overlay { display: none !important; } -} - -.parallax { +}.parallax { display: block; height: auto; position: relative; width: auto; -} - -.parallax .parallax-content { - box-shadow: 0 1rem 2.1rem rgba(48, 55, 66, .3); +}.parallax .parallax-content { + box-shadow: 0 1rem 2.1rem rgba(48,55,66,.3); height: auto; transform: perspective(1000px); transform-style: preserve-3d; transition: all .4s ease; width: 100%; -} - -.parallax .parallax-content::before { +}.parallax .parallax-content::before { content: ""; display: block; height: 100%; @@ -723,9 +533,7 @@ position: absolute; top: 0; width: 100%; -} - -.parallax .parallax-front { +}.parallax .parallax-front { align-items: center; color: #fff; display: -ms-flexbox; @@ -737,115 +545,81 @@ left: 0; position: absolute; text-align: center; - text-shadow: 0 0 20px rgba(48, 55, 66, .75); + text-shadow: 0 0 20px rgba(48,55,66,.75); top: 0; transform: translateZ(50px) scale(.95); transition: transform .4s; width: 100%; z-index: 1; -} - -.parallax .parallax-top-left { +}.parallax .parallax-top-left { height: 50%; left: 0; outline: none; position: absolute; - top: 0; + top: 0; width: 50%; z-index: 100; -} - -.parallax .parallax-top-left:focus ~ .parallax-content, +}.parallax .parallax-top-left:focus ~ .parallax-content, .parallax .parallax-top-left:hover ~ .parallax-content { transform: perspective(1000px) rotateX(3deg) rotateY(-3deg); -} - -.parallax .parallax-top-left:focus ~ .parallax-content::before, +}.parallax .parallax-top-left:focus ~ .parallax-content::before, .parallax .parallax-top-left:hover ~ .parallax-content::before { background: linear-gradient(135deg, rgba(255, 255, 255, .35) 0%, transparent 50%); -} - -.parallax .parallax-top-left:focus ~ .parallax-content .parallax-front, +}.parallax .parallax-top-left:focus ~ .parallax-content .parallax-front, .parallax .parallax-top-left:hover ~ .parallax-content .parallax-front { transform: translate3d(4.5px, 4.5px, 50px) scale(.95); -} - -.parallax .parallax-top-right { +}.parallax .parallax-top-right { height: 50%; outline: none; position: absolute; right: 0; - top: 0; + top: 0; width: 50%; z-index: 100; -} - -.parallax .parallax-top-right:focus ~ .parallax-content, +}.parallax .parallax-top-right:focus ~ .parallax-content, .parallax .parallax-top-right:hover ~ .parallax-content { transform: perspective(1000px) rotateX(3deg) rotateY(3deg); -} - -.parallax .parallax-top-right:focus ~ .parallax-content::before, +}.parallax .parallax-top-right:focus ~ .parallax-content::before, .parallax .parallax-top-right:hover ~ .parallax-content::before { background: linear-gradient(-135deg, rgba(255, 255, 255, .35) 0%, transparent 50%); -} - -.parallax .parallax-top-right:focus ~ .parallax-content .parallax-front, +}.parallax .parallax-top-right:focus ~ .parallax-content .parallax-front, .parallax .parallax-top-right:hover ~ .parallax-content .parallax-front { transform: translate3d(-4.5px, 4.5px, 50px) scale(.95); -} - -.parallax .parallax-bottom-left { +}.parallax .parallax-bottom-left { bottom: 0; height: 50%; - left: 0; + left: 0; outline: none; position: absolute; width: 50%; z-index: 100; -} - -.parallax .parallax-bottom-left:focus ~ .parallax-content, +}.parallax .parallax-bottom-left:focus ~ .parallax-content, .parallax .parallax-bottom-left:hover ~ .parallax-content { transform: perspective(1000px) rotateX(-3deg) rotateY(-3deg); -} - -.parallax .parallax-bottom-left:focus ~ .parallax-content::before, +}.parallax .parallax-bottom-left:focus ~ .parallax-content::before, .parallax .parallax-bottom-left:hover ~ .parallax-content::before { background: linear-gradient(45deg, rgba(255, 255, 255, .35) 0%, transparent 50%); -} - -.parallax .parallax-bottom-left:focus ~ .parallax-content .parallax-front, +}.parallax .parallax-bottom-left:focus ~ .parallax-content .parallax-front, .parallax .parallax-bottom-left:hover ~ .parallax-content .parallax-front { transform: translate3d(4.5px, -4.5px, 50px) scale(.95); -} - -.parallax .parallax-bottom-right { +}.parallax .parallax-bottom-right { bottom: 0; height: 50%; outline: none; position: absolute; - right: 0; + right: 0; width: 50%; z-index: 100; -} - -.parallax .parallax-bottom-right:focus ~ .parallax-content, +}.parallax .parallax-bottom-right:focus ~ .parallax-content, .parallax .parallax-bottom-right:hover ~ .parallax-content { transform: perspective(1000px) rotateX(-3deg) rotateY(3deg); -} - -.parallax .parallax-bottom-right:focus ~ .parallax-content::before, +}.parallax .parallax-bottom-right:focus ~ .parallax-content::before, .parallax .parallax-bottom-right:hover ~ .parallax-content::before { background: linear-gradient(-45deg, rgba(255, 255, 255, .35) 0%, transparent 50%); -} - -.parallax .parallax-bottom-right:focus ~ .parallax-content .parallax-front, +}.parallax .parallax-bottom-right:focus ~ .parallax-content .parallax-front, .parallax .parallax-bottom-right:hover ~ .parallax-content .parallax-front { transform: translate3d(-4.5px, -4.5px, 50px) scale(.95); -} - -.progress { +}.progress { -webkit-appearance: none; -moz-appearance: none; appearance: none; @@ -856,61 +630,40 @@ height: .2rem; position: relative; width: 100%; -} - -.progress::-webkit-progress-bar { +}.progress::-webkit-progress-bar { background: transparent; border-radius: .1rem; -} - -.progress::-webkit-progress-value { +}.progress::-webkit-progress-value { background: #5755d9; border-radius: .1rem; -} - -.progress::-moz-progress-bar { +}.progress::-moz-progress-bar { background: #5755d9; border-radius: .1rem; -} - -.progress:indeterminate { +}.progress:indeterminate { animation: progress-indeterminate 1.5s linear infinite; background: #eef0f3 linear-gradient(to right, #5755d9 30%, #eef0f3 30%) top left/150% 150% no-repeat; -} - -.progress:indeterminate::-moz-progress-bar { +}.progress:indeterminate::-moz-progress-bar { background: transparent; -} - -@keyframes progress-indeterminate { +}@keyframes progress-indeterminate { 0% { background-position: 200% 0; - } - 100% { + }100% { background-position: -200% 0; } -} - -.slider { +}.slider { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: transparent; display: block; - height: 1.2rem; + height: 1.2rem; width: 100%; -} - -.slider:focus { - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); +}.slider:focus { + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); outline: none; -} - -.slider.tooltip:not([data-tooltip])::after { +}.slider.tooltip:not([data-tooltip])::after { content: attr(value); -} - -.slider::-webkit-slider-thumb { +}.slider::-webkit-slider-thumb { -webkit-appearance: none; background: #5755d9; border: 0; @@ -920,9 +673,7 @@ -webkit-transition: transform .2s; transition: transform .2s; width: .6rem; -} - -.slider::-moz-range-thumb { +}.slider::-moz-range-thumb { background: #5755d9; border: 0; border-radius: 50%; @@ -930,9 +681,7 @@ -moz-transition: transform .2s; transition: transform .2s; width: .6rem; -} - -.slider::-ms-thumb { +}.slider::-ms-thumb { background: #5755d9; border: 0; border-radius: 50%; @@ -940,71 +689,47 @@ -ms-transition: transform .2s; transition: transform .2s; width: .6rem; -} - -.slider:active::-webkit-slider-thumb { +}.slider:active::-webkit-slider-thumb { transform: scale(1.25); -} - -.slider:active::-moz-range-thumb { +}.slider:active::-moz-range-thumb { transform: scale(1.25); -} - -.slider:active::-ms-thumb { +}.slider:active::-ms-thumb { transform: scale(1.25); -} - -.slider:disabled::-webkit-slider-thumb, +}.slider:disabled::-webkit-slider-thumb, .slider.disabled::-webkit-slider-thumb { background: #f7f8f9; transform: scale(1); -} - -.slider:disabled::-moz-range-thumb, +}.slider:disabled::-moz-range-thumb, .slider.disabled::-moz-range-thumb { background: #f7f8f9; transform: scale(1); -} - -.slider:disabled::-ms-thumb, +}.slider:disabled::-ms-thumb, .slider.disabled::-ms-thumb { background: #f7f8f9; transform: scale(1); -} - -.slider::-webkit-slider-runnable-track { +}.slider::-webkit-slider-runnable-track { background: #eef0f3; border-radius: .1rem; height: .1rem; width: 100%; -} - -.slider::-moz-range-track { +}.slider::-moz-range-track { background: #eef0f3; border-radius: .1rem; height: .1rem; width: 100%; -} - -.slider::-ms-track { +}.slider::-ms-track { background: #eef0f3; border-radius: .1rem; height: .1rem; width: 100%; -} - -.slider::-ms-fill-lower { +}.slider::-ms-fill-lower { background: #5755d9; -} - -.timeline .timeline-item { +}.timeline .timeline-item { display: -ms-flexbox; display: flex; margin-bottom: 1.2rem; position: relative; -} - -.timeline .timeline-item::before { +}.timeline .timeline-item::before { background: #dadee4; content: ""; height: 100%; @@ -1012,20 +737,14 @@ position: absolute; top: 1.2rem; width: 2px; -} - -.timeline .timeline-item .timeline-left { +}.timeline .timeline-item .timeline-left { -ms-flex: 0 0 auto; flex: 0 0 auto; -} - -.timeline .timeline-item .timeline-content { +}.timeline .timeline-item .timeline-content { -ms-flex: 1 1 auto; flex: 1 1 auto; padding: 2px 0 2px .8rem; -} - -.timeline .timeline-item .timeline-icon { +}.timeline .timeline-item .timeline-icon { align-items: center; border-radius: 50%; color: #fff; @@ -1037,9 +756,7 @@ justify-content: center; text-align: center; width: 1.2rem; -} - -.timeline .timeline-item .timeline-icon::before { +}.timeline .timeline-item .timeline-icon::before { border: .1rem solid #5755d9; border-radius: 50%; content: ""; @@ -1049,183 +766,101 @@ position: absolute; top: .4rem; width: .4rem; -} - -.timeline .timeline-item .timeline-icon.icon-lg { +}.timeline .timeline-item .timeline-icon.icon-lg { background: #5755d9; line-height: 1.2rem; -} - -.timeline .timeline-item .timeline-icon.icon-lg::before { +}.timeline .timeline-item .timeline-icon.icon-lg::before { content: none; -} - -.viewer-360 { +}.viewer-360 { align-items: center; display: -ms-flexbox; display: flex; -ms-flex-align: center; -ms-flex-direction: column; flex-direction: column; -} - -.viewer-360 .viewer-slider[max="36"][value="1"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="1"] + .viewer-image { background-position-y: 0; -} - -.viewer-360 .viewer-slider[max="36"][value="2"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="2"] + .viewer-image { background-position-y: 2.8571428571%; -} - -.viewer-360 .viewer-slider[max="36"][value="3"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="3"] + .viewer-image { background-position-y: 5.7142857143%; -} - -.viewer-360 .viewer-slider[max="36"][value="4"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="4"] + .viewer-image { background-position-y: 8.5714285714%; -} - -.viewer-360 .viewer-slider[max="36"][value="5"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="5"] + .viewer-image { background-position-y: 11.4285714286%; -} - -.viewer-360 .viewer-slider[max="36"][value="6"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="6"] + .viewer-image { background-position-y: 14.2857142857%; -} - -.viewer-360 .viewer-slider[max="36"][value="7"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="7"] + .viewer-image { background-position-y: 17.1428571429%; -} - -.viewer-360 .viewer-slider[max="36"][value="8"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="8"] + .viewer-image { background-position-y: 20%; -} - -.viewer-360 .viewer-slider[max="36"][value="9"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="9"] + .viewer-image { background-position-y: 22.8571428571%; -} - -.viewer-360 .viewer-slider[max="36"][value="10"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="10"] + .viewer-image { background-position-y: 25.7142857143%; -} - -.viewer-360 .viewer-slider[max="36"][value="11"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="11"] + .viewer-image { background-position-y: 28.5714285714%; -} - -.viewer-360 .viewer-slider[max="36"][value="12"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="12"] + .viewer-image { background-position-y: 31.4285714286%; -} - -.viewer-360 .viewer-slider[max="36"][value="13"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="13"] + .viewer-image { background-position-y: 34.2857142857%; -} - -.viewer-360 .viewer-slider[max="36"][value="14"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="14"] + .viewer-image { background-position-y: 37.1428571429%; -} - -.viewer-360 .viewer-slider[max="36"][value="15"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="15"] + .viewer-image { background-position-y: 40%; -} - -.viewer-360 .viewer-slider[max="36"][value="16"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="16"] + .viewer-image { background-position-y: 42.8571428571%; -} - -.viewer-360 .viewer-slider[max="36"][value="17"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="17"] + .viewer-image { background-position-y: 45.7142857143%; -} - -.viewer-360 .viewer-slider[max="36"][value="18"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="18"] + .viewer-image { background-position-y: 48.5714285714%; -} - -.viewer-360 .viewer-slider[max="36"][value="19"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="19"] + .viewer-image { background-position-y: 51.4285714286%; -} - -.viewer-360 .viewer-slider[max="36"][value="20"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="20"] + .viewer-image { background-position-y: 54.2857142857%; -} - -.viewer-360 .viewer-slider[max="36"][value="21"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="21"] + .viewer-image { background-position-y: 57.1428571429%; -} - -.viewer-360 .viewer-slider[max="36"][value="22"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="22"] + .viewer-image { background-position-y: 60%; -} - -.viewer-360 .viewer-slider[max="36"][value="23"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="23"] + .viewer-image { background-position-y: 62.8571428571%; -} - -.viewer-360 .viewer-slider[max="36"][value="24"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="24"] + .viewer-image { background-position-y: 65.7142857143%; -} - -.viewer-360 .viewer-slider[max="36"][value="25"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="25"] + .viewer-image { background-position-y: 68.5714285714%; -} - -.viewer-360 .viewer-slider[max="36"][value="26"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="26"] + .viewer-image { background-position-y: 71.4285714286%; -} - -.viewer-360 .viewer-slider[max="36"][value="27"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="27"] + .viewer-image { background-position-y: 74.2857142857%; -} - -.viewer-360 .viewer-slider[max="36"][value="28"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="28"] + .viewer-image { background-position-y: 77.1428571429%; -} - -.viewer-360 .viewer-slider[max="36"][value="29"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="29"] + .viewer-image { background-position-y: 80%; -} - -.viewer-360 .viewer-slider[max="36"][value="30"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="30"] + .viewer-image { background-position-y: 82.8571428571%; -} - -.viewer-360 .viewer-slider[max="36"][value="31"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="31"] + .viewer-image { background-position-y: 85.7142857143%; -} - -.viewer-360 .viewer-slider[max="36"][value="32"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="32"] + .viewer-image { background-position-y: 88.5714285714%; -} - -.viewer-360 .viewer-slider[max="36"][value="33"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="33"] + .viewer-image { background-position-y: 91.4285714286%; -} - -.viewer-360 .viewer-slider[max="36"][value="34"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="34"] + .viewer-image { background-position-y: 94.2857142857%; -} - -.viewer-360 .viewer-slider[max="36"][value="35"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="35"] + .viewer-image { background-position-y: 97.1428571429%; -} - -.viewer-360 .viewer-slider[max="36"][value="36"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="36"] + .viewer-image { background-position-y: 100%; -} - -.viewer-360 .viewer-slider { +}.viewer-360 .viewer-slider { cursor: ew-resize; -ms-flex-order: 2; margin: 1rem; order: 2; width: 60%; -} - -.viewer-360 .viewer-image { +}.viewer-360 .viewer-image { background-position-y: 0; background-repeat: no-repeat; background-size: 100%; -ms-flex-order: 1; max-width: 100%; order: 1; -} \ No newline at end of file +}/*! Spectre.css Experimentals v0.5.9 | MIT License | github.com/picturepan2/spectre */ \ No newline at end of file diff --git a/dist/spectre-exp.min.css b/dist/spectre-exp.min.css index d3137743a..59e0fb45d 100644 --- a/dist/spectre-exp.min.css +++ b/dist/spectre-exp.min.css @@ -1 +1 @@ -/*! Spectre.css Experimentals v0.5.9 | MIT License | github.com/picturepan2/spectre */.form-autocomplete{position:relative}.form-autocomplete .form-autocomplete-input{align-content:flex-start;display:-ms-flexbox;display:flex;-ms-flex-line-pack:start;-ms-flex-wrap:wrap;flex-wrap:wrap;height:auto;min-height:1.6rem;padding:.1rem}.form-autocomplete .form-autocomplete-input.is-focused{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-autocomplete .form-autocomplete-input .form-input{border-color:transparent;box-shadow:none;display:inline-block;-ms-flex:1 0 auto;flex:1 0 auto;height:1.2rem;line-height:.8rem;margin:.1rem;width:auto}.form-autocomplete .menu{left:0;position:absolute;top:100%;width:100%}.form-autocomplete.autocomplete-oneline .form-autocomplete-input{-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto}.form-autocomplete.autocomplete-oneline .chip{-ms-flex:1 0 auto;flex:1 0 auto}.calendar{border:.05rem solid #dadee4;border-radius:.1rem;display:block;min-width:280px}.calendar .calendar-nav{align-items:center;background:#f7f8f9;border-top-left-radius:.1rem;border-top-right-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-align:center;font-size:.9rem;padding:.4rem}.calendar .calendar-body,.calendar .calendar-header{display:-ms-flexbox;display:flex;-ms-flex-pack:center;-ms-flex-wrap:wrap;flex-wrap:wrap;justify-content:center;padding:.4rem 0}.calendar .calendar-body .calendar-date,.calendar .calendar-header .calendar-date{-ms-flex:0 0 14.28%;flex:0 0 14.28%;max-width:14.28%}.calendar .calendar-header{background:#f7f8f9;border-bottom:.05rem solid #dadee4;color:#bcc3ce;font-size:.7rem;text-align:center}.calendar .calendar-body{color:#66758c}.calendar .calendar-date{border:0;padding:.2rem}.calendar .calendar-date .date-item{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:.05rem solid transparent;border-radius:50%;color:#66758c;cursor:pointer;font-size:.7rem;height:1.4rem;line-height:1rem;outline:0;padding:.1rem;position:relative;text-align:center;text-decoration:none;transition:background .2s,border .2s,box-shadow .2s,color .2s;vertical-align:middle;white-space:nowrap;width:1.4rem}.calendar .calendar-date .date-item.date-today{border-color:#e5e5f9;color:#5755d9}.calendar .calendar-date .date-item:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.calendar .calendar-date .date-item:focus,.calendar .calendar-date .date-item:hover{background:#fefeff;border-color:#e5e5f9;color:#5755d9;text-decoration:none}.calendar .calendar-date .date-item.active,.calendar .calendar-date .date-item:active{background:#4b48d6;border-color:#3634d2;color:#fff}.calendar .calendar-date .date-item.badge::after{position:absolute;right:3px;top:3px;transform:translate(50%,-50%)}.calendar .calendar-date .calendar-event.disabled,.calendar .calendar-date .calendar-event:disabled,.calendar .calendar-date .date-item.disabled,.calendar .calendar-date .date-item:disabled{cursor:default;opacity:.25;pointer-events:none}.calendar .calendar-date.next-month .calendar-event,.calendar .calendar-date.next-month .date-item,.calendar .calendar-date.prev-month .calendar-event,.calendar .calendar-date.prev-month .date-item{opacity:.25}.calendar .calendar-range{position:relative}.calendar .calendar-range::before{background:#f1f1fc;content:"";height:1.4rem;left:0;position:absolute;right:0;top:50%;transform:translateY(-50%)}.calendar .calendar-range.range-start::before{left:50%}.calendar .calendar-range.range-end::before{right:50%}.calendar .calendar-range.range-end .date-item,.calendar .calendar-range.range-start .date-item{background:#4b48d6;border-color:#3634d2;color:#fff}.calendar .calendar-range .date-item{color:#5755d9}.calendar.calendar-lg .calendar-body{padding:0}.calendar.calendar-lg .calendar-body .calendar-date{border-bottom:.05rem solid #dadee4;border-right:.05rem solid #dadee4;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:5.5rem;padding:0}.calendar.calendar-lg .calendar-body .calendar-date:nth-child(7n){border-right:0}.calendar.calendar-lg .calendar-body .calendar-date:nth-last-child(-n+7){border-bottom:0}.calendar.calendar-lg .date-item{align-self:flex-end;-ms-flex-item-align:end;height:1.4rem;margin-right:.2rem;margin-top:.2rem}.calendar.calendar-lg .calendar-range::before{top:19px}.calendar.calendar-lg .calendar-range.range-start::before{left:auto;width:19px}.calendar.calendar-lg .calendar-range.range-end::before{right:19px}.calendar.calendar-lg .calendar-events{flex-grow:1;-ms-flex-positive:1;line-height:1;overflow-y:auto;padding:.2rem}.calendar.calendar-lg .calendar-event{border-radius:.1rem;display:block;font-size:.7rem;margin:.1rem auto;overflow:hidden;padding:3px 4px;text-overflow:ellipsis;white-space:nowrap}.carousel .carousel-locator:nth-of-type(1):checked~.carousel-container .carousel-item:nth-of-type(1),.carousel .carousel-locator:nth-of-type(2):checked~.carousel-container .carousel-item:nth-of-type(2),.carousel .carousel-locator:nth-of-type(3):checked~.carousel-container .carousel-item:nth-of-type(3),.carousel .carousel-locator:nth-of-type(4):checked~.carousel-container .carousel-item:nth-of-type(4),.carousel .carousel-locator:nth-of-type(5):checked~.carousel-container .carousel-item:nth-of-type(5),.carousel .carousel-locator:nth-of-type(6):checked~.carousel-container .carousel-item:nth-of-type(6),.carousel .carousel-locator:nth-of-type(7):checked~.carousel-container .carousel-item:nth-of-type(7),.carousel .carousel-locator:nth-of-type(8):checked~.carousel-container .carousel-item:nth-of-type(8){animation:carousel-slidein .75s ease-in-out 1;opacity:1;z-index:100}.carousel .carousel-locator:nth-of-type(1):checked~.carousel-nav .nav-item:nth-of-type(1),.carousel .carousel-locator:nth-of-type(2):checked~.carousel-nav .nav-item:nth-of-type(2),.carousel .carousel-locator:nth-of-type(3):checked~.carousel-nav .nav-item:nth-of-type(3),.carousel .carousel-locator:nth-of-type(4):checked~.carousel-nav .nav-item:nth-of-type(4),.carousel .carousel-locator:nth-of-type(5):checked~.carousel-nav .nav-item:nth-of-type(5),.carousel .carousel-locator:nth-of-type(6):checked~.carousel-nav .nav-item:nth-of-type(6),.carousel .carousel-locator:nth-of-type(7):checked~.carousel-nav .nav-item:nth-of-type(7),.carousel .carousel-locator:nth-of-type(8):checked~.carousel-nav .nav-item:nth-of-type(8){color:#f7f8f9}.carousel{background:#f7f8f9;display:block;overflow:hidden;-webkit-overflow-scrolling:touch;position:relative;width:100%;z-index:1}.carousel .carousel-container{height:100%;left:0;position:relative}.carousel .carousel-container::before{content:"";display:block;padding-bottom:56.25%}.carousel .carousel-container .carousel-item{animation:carousel-slideout 1s ease-in-out 1;height:100%;left:0;margin:0;opacity:0;position:absolute;top:0;width:100%}.carousel .carousel-container .carousel-item:hover .item-next,.carousel .carousel-container .carousel-item:hover .item-prev{opacity:1}.carousel .carousel-container .item-next,.carousel .carousel-container .item-prev{background:rgba(247,248,249,.25);border-color:rgba(247,248,249,.5);color:#f7f8f9;opacity:0;position:absolute;top:50%;transform:translateY(-50%);transition:all .4s;z-index:100}.carousel .carousel-container .item-prev{left:1rem}.carousel .carousel-container .item-next{right:1rem}.carousel .carousel-nav{bottom:.4rem;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;left:50%;position:absolute;transform:translateX(-50%);width:10rem;z-index:100}.carousel .carousel-nav .nav-item{color:rgba(247,248,249,.5);display:block;-ms-flex:1 0 auto;flex:1 0 auto;height:1.6rem;margin:.2rem;max-width:2.5rem;position:relative}.carousel .carousel-nav .nav-item::before{background:currentColor;content:"";display:block;height:.1rem;position:absolute;top:.5rem;width:100%}@keyframes carousel-slidein{0%{transform:translateX(100%)}100%{transform:translateX(0)}}@keyframes carousel-slideout{0%{opacity:1;transform:translateX(0)}100%{opacity:1;transform:translateX(-50%)}}.comparison-slider{height:50vh;overflow:hidden;-webkit-overflow-scrolling:touch;position:relative;width:100%}.comparison-slider .comparison-after,.comparison-slider .comparison-before{height:100%;left:0;margin:0;overflow:hidden;position:absolute;top:0}.comparison-slider .comparison-after img,.comparison-slider .comparison-before img{height:100%;object-fit:cover;object-position:left center;position:absolute;width:100%}.comparison-slider .comparison-before{width:100%;z-index:1}.comparison-slider .comparison-before .comparison-label{right:.8rem}.comparison-slider .comparison-after{max-width:100%;min-width:0;z-index:2}.comparison-slider .comparison-after::before{background:0 0;content:"";cursor:default;height:100%;left:0;position:absolute;right:.8rem;top:0;z-index:1}.comparison-slider .comparison-after::after{background:currentColor;border-radius:50%;box-shadow:0 -5px,0 5px;color:#fff;content:"";height:3px;pointer-events:none;position:absolute;right:.4rem;top:50%;transform:translate(50%,-50%);width:3px}.comparison-slider .comparison-after .comparison-label{left:.8rem}.comparison-slider .comparison-resizer{animation:first-run 1.5s 1 ease-in-out;cursor:ew-resize;height:.8rem;left:0;max-width:100%;min-width:.8rem;opacity:0;outline:0;position:relative;resize:horizontal;top:50%;transform:translateY(-50%) scaleY(30);width:0}.comparison-slider .comparison-label{background:rgba(48,55,66,.5);bottom:.8rem;color:#fff;padding:.2rem .4rem;position:absolute;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}@keyframes first-run{0%{width:0}25%{width:2.4rem}50%{width:.8rem}75%{width:1.2rem}100%{width:0}}.filter .filter-tag#tag-0:checked~.filter-nav .chip[for=tag-0],.filter .filter-tag#tag-1:checked~.filter-nav .chip[for=tag-1],.filter .filter-tag#tag-2:checked~.filter-nav .chip[for=tag-2],.filter .filter-tag#tag-3:checked~.filter-nav .chip[for=tag-3],.filter .filter-tag#tag-4:checked~.filter-nav .chip[for=tag-4],.filter .filter-tag#tag-5:checked~.filter-nav .chip[for=tag-5],.filter .filter-tag#tag-6:checked~.filter-nav .chip[for=tag-6],.filter .filter-tag#tag-7:checked~.filter-nav .chip[for=tag-7],.filter .filter-tag#tag-8:checked~.filter-nav .chip[for=tag-8]{background:#5755d9;color:#fff}.filter .filter-tag#tag-1:checked~.filter-body .filter-item:not([data-tag~=tag-1]),.filter .filter-tag#tag-2:checked~.filter-body .filter-item:not([data-tag~=tag-2]),.filter .filter-tag#tag-3:checked~.filter-body .filter-item:not([data-tag~=tag-3]),.filter .filter-tag#tag-4:checked~.filter-body .filter-item:not([data-tag~=tag-4]),.filter .filter-tag#tag-5:checked~.filter-body .filter-item:not([data-tag~=tag-5]),.filter .filter-tag#tag-6:checked~.filter-body .filter-item:not([data-tag~=tag-6]),.filter .filter-tag#tag-7:checked~.filter-body .filter-item:not([data-tag~=tag-7]),.filter .filter-tag#tag-8:checked~.filter-body .filter-item:not([data-tag~=tag-8]){display:none}.filter .filter-nav{margin:.4rem 0}.filter .filter-body{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.meter{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#f7f8f9;border:0;border-radius:.1rem;display:block;height:.8rem;width:100%}.meter::-webkit-meter-inner-element{display:block}.meter::-webkit-meter-bar,.meter::-webkit-meter-even-less-good-value,.meter::-webkit-meter-optimum-value,.meter::-webkit-meter-suboptimum-value{border-radius:.1rem}.meter::-webkit-meter-bar{background:#f7f8f9}.meter::-webkit-meter-optimum-value{background:#32b643}.meter::-webkit-meter-suboptimum-value{background:#ffb700}.meter::-webkit-meter-even-less-good-value{background:#e85600}.meter:-moz-meter-optimum,.meter:-moz-meter-sub-optimum,.meter:-moz-meter-sub-sub-optimum,.meter::-moz-meter-bar{border-radius:.1rem}.meter:-moz-meter-optimum::-moz-meter-bar{background:#32b643}.meter:-moz-meter-sub-optimum::-moz-meter-bar{background:#ffb700}.meter:-moz-meter-sub-sub-optimum::-moz-meter-bar{background:#e85600}.off-canvas{display:-ms-flexbox;display:flex;-ms-flex-flow:nowrap;flex-flow:nowrap;height:100%;position:relative;width:100%}.off-canvas .off-canvas-toggle{display:block;left:.4rem;position:absolute;top:.4rem;transition:none;z-index:1}.off-canvas .off-canvas-sidebar{background:#f7f8f9;bottom:0;left:0;min-width:10rem;overflow-y:auto;position:fixed;top:0;transform:translateX(-100%);transition:transform .25s;z-index:200}.off-canvas .off-canvas-content{-ms-flex:1 1 auto;flex:1 1 auto;height:100%;padding:.4rem .4rem .4rem 4rem}.off-canvas .off-canvas-overlay{background:rgba(48,55,66,.1);border-color:transparent;border-radius:0;bottom:0;display:none;height:100%;left:0;position:fixed;right:0;top:0;width:100%}.off-canvas .off-canvas-sidebar.active,.off-canvas .off-canvas-sidebar:target{transform:translateX(0)}.off-canvas .off-canvas-sidebar.active~.off-canvas-overlay,.off-canvas .off-canvas-sidebar:target~.off-canvas-overlay{display:block;z-index:100}@media (min-width:960px){.off-canvas.off-canvas-sidebar-show .off-canvas-toggle{display:none}.off-canvas.off-canvas-sidebar-show .off-canvas-sidebar{-ms-flex:0 0 auto;flex:0 0 auto;position:relative;transform:none}.off-canvas.off-canvas-sidebar-show .off-canvas-overlay{display:none!important}}.parallax{display:block;height:auto;position:relative;width:auto}.parallax .parallax-content{box-shadow:0 1rem 2.1rem rgba(48,55,66,.3);height:auto;transform:perspective(1000px);transform-style:preserve-3d;transition:all .4s ease;width:100%}.parallax .parallax-content::before{content:"";display:block;height:100%;left:0;position:absolute;top:0;width:100%}.parallax .parallax-front{align-items:center;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;height:100%;justify-content:center;left:0;position:absolute;text-align:center;text-shadow:0 0 20px rgba(48,55,66,.75);top:0;transform:translateZ(50px) scale(.95);transition:transform .4s;width:100%;z-index:1}.parallax .parallax-top-left{height:50%;left:0;outline:0;position:absolute;top:0;width:50%;z-index:100}.parallax .parallax-top-left:focus~.parallax-content,.parallax .parallax-top-left:hover~.parallax-content{transform:perspective(1000px) rotateX(3deg) rotateY(-3deg)}.parallax .parallax-top-left:focus~.parallax-content::before,.parallax .parallax-top-left:hover~.parallax-content::before{background:linear-gradient(135deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-top-left:focus~.parallax-content .parallax-front,.parallax .parallax-top-left:hover~.parallax-content .parallax-front{transform:translate3d(4.5px,4.5px,50px) scale(.95)}.parallax .parallax-top-right{height:50%;outline:0;position:absolute;right:0;top:0;width:50%;z-index:100}.parallax .parallax-top-right:focus~.parallax-content,.parallax .parallax-top-right:hover~.parallax-content{transform:perspective(1000px) rotateX(3deg) rotateY(3deg)}.parallax .parallax-top-right:focus~.parallax-content::before,.parallax .parallax-top-right:hover~.parallax-content::before{background:linear-gradient(-135deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-top-right:focus~.parallax-content .parallax-front,.parallax .parallax-top-right:hover~.parallax-content .parallax-front{transform:translate3d(-4.5px,4.5px,50px) scale(.95)}.parallax .parallax-bottom-left{bottom:0;height:50%;left:0;outline:0;position:absolute;width:50%;z-index:100}.parallax .parallax-bottom-left:focus~.parallax-content,.parallax .parallax-bottom-left:hover~.parallax-content{transform:perspective(1000px) rotateX(-3deg) rotateY(-3deg)}.parallax .parallax-bottom-left:focus~.parallax-content::before,.parallax .parallax-bottom-left:hover~.parallax-content::before{background:linear-gradient(45deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-bottom-left:focus~.parallax-content .parallax-front,.parallax .parallax-bottom-left:hover~.parallax-content .parallax-front{transform:translate3d(4.5px,-4.5px,50px) scale(.95)}.parallax .parallax-bottom-right{bottom:0;height:50%;outline:0;position:absolute;right:0;width:50%;z-index:100}.parallax .parallax-bottom-right:focus~.parallax-content,.parallax .parallax-bottom-right:hover~.parallax-content{transform:perspective(1000px) rotateX(-3deg) rotateY(3deg)}.parallax .parallax-bottom-right:focus~.parallax-content::before,.parallax .parallax-bottom-right:hover~.parallax-content::before{background:linear-gradient(-45deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-bottom-right:focus~.parallax-content .parallax-front,.parallax .parallax-bottom-right:hover~.parallax-content .parallax-front{transform:translate3d(-4.5px,-4.5px,50px) scale(.95)}.progress{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#eef0f3;border:0;border-radius:.1rem;color:#5755d9;height:.2rem;position:relative;width:100%}.progress::-webkit-progress-bar{background:0 0;border-radius:.1rem}.progress::-webkit-progress-value{background:#5755d9;border-radius:.1rem}.progress::-moz-progress-bar{background:#5755d9;border-radius:.1rem}.progress:indeterminate{animation:progress-indeterminate 1.5s linear infinite;background:#eef0f3 linear-gradient(to right,#5755d9 30%,#eef0f3 30%) top left/150% 150% no-repeat}.progress:indeterminate::-moz-progress-bar{background:0 0}@keyframes progress-indeterminate{0%{background-position:200% 0}100%{background-position:-200% 0}}.slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;display:block;height:1.2rem;width:100%}.slider:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2);outline:0}.slider.tooltip:not([data-tooltip])::after{content:attr(value)}.slider::-webkit-slider-thumb{-webkit-appearance:none;background:#5755d9;border:0;border-radius:50%;height:.6rem;margin-top:-.25rem;-webkit-transition:transform .2s;transition:transform .2s;width:.6rem}.slider::-moz-range-thumb{background:#5755d9;border:0;border-radius:50%;height:.6rem;-moz-transition:transform .2s;transition:transform .2s;width:.6rem}.slider::-ms-thumb{background:#5755d9;border:0;border-radius:50%;height:.6rem;-ms-transition:transform .2s;transition:transform .2s;width:.6rem}.slider:active::-webkit-slider-thumb{transform:scale(1.25)}.slider:active::-moz-range-thumb{transform:scale(1.25)}.slider:active::-ms-thumb{transform:scale(1.25)}.slider.disabled::-webkit-slider-thumb,.slider:disabled::-webkit-slider-thumb{background:#f7f8f9;transform:scale(1)}.slider.disabled::-moz-range-thumb,.slider:disabled::-moz-range-thumb{background:#f7f8f9;transform:scale(1)}.slider.disabled::-ms-thumb,.slider:disabled::-ms-thumb{background:#f7f8f9;transform:scale(1)}.slider::-webkit-slider-runnable-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-moz-range-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-ms-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-ms-fill-lower{background:#5755d9}.timeline .timeline-item{display:-ms-flexbox;display:flex;margin-bottom:1.2rem;position:relative}.timeline .timeline-item::before{background:#dadee4;content:"";height:100%;left:11px;position:absolute;top:1.2rem;width:2px}.timeline .timeline-item .timeline-left{-ms-flex:0 0 auto;flex:0 0 auto}.timeline .timeline-item .timeline-content{-ms-flex:1 1 auto;flex:1 1 auto;padding:2px 0 2px .8rem}.timeline .timeline-item .timeline-icon{align-items:center;border-radius:50%;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;height:1.2rem;justify-content:center;text-align:center;width:1.2rem}.timeline .timeline-item .timeline-icon::before{border:.1rem solid #5755d9;border-radius:50%;content:"";display:block;height:.4rem;left:.4rem;position:absolute;top:.4rem;width:.4rem}.timeline .timeline-item .timeline-icon.icon-lg{background:#5755d9;line-height:1.2rem}.timeline .timeline-item .timeline-icon.icon-lg::before{content:none}.viewer-360{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-direction:column;flex-direction:column}.viewer-360 .viewer-slider[max="36"][value="1"]+.viewer-image{background-position-y:0}.viewer-360 .viewer-slider[max="36"][value="2"]+.viewer-image{background-position-y:2.8571428571%}.viewer-360 .viewer-slider[max="36"][value="3"]+.viewer-image{background-position-y:5.7142857143%}.viewer-360 .viewer-slider[max="36"][value="4"]+.viewer-image{background-position-y:8.5714285714%}.viewer-360 .viewer-slider[max="36"][value="5"]+.viewer-image{background-position-y:11.4285714286%}.viewer-360 .viewer-slider[max="36"][value="6"]+.viewer-image{background-position-y:14.2857142857%}.viewer-360 .viewer-slider[max="36"][value="7"]+.viewer-image{background-position-y:17.1428571429%}.viewer-360 .viewer-slider[max="36"][value="8"]+.viewer-image{background-position-y:20%}.viewer-360 .viewer-slider[max="36"][value="9"]+.viewer-image{background-position-y:22.8571428571%}.viewer-360 .viewer-slider[max="36"][value="10"]+.viewer-image{background-position-y:25.7142857143%}.viewer-360 .viewer-slider[max="36"][value="11"]+.viewer-image{background-position-y:28.5714285714%}.viewer-360 .viewer-slider[max="36"][value="12"]+.viewer-image{background-position-y:31.4285714286%}.viewer-360 .viewer-slider[max="36"][value="13"]+.viewer-image{background-position-y:34.2857142857%}.viewer-360 .viewer-slider[max="36"][value="14"]+.viewer-image{background-position-y:37.1428571429%}.viewer-360 .viewer-slider[max="36"][value="15"]+.viewer-image{background-position-y:40%}.viewer-360 .viewer-slider[max="36"][value="16"]+.viewer-image{background-position-y:42.8571428571%}.viewer-360 .viewer-slider[max="36"][value="17"]+.viewer-image{background-position-y:45.7142857143%}.viewer-360 .viewer-slider[max="36"][value="18"]+.viewer-image{background-position-y:48.5714285714%}.viewer-360 .viewer-slider[max="36"][value="19"]+.viewer-image{background-position-y:51.4285714286%}.viewer-360 .viewer-slider[max="36"][value="20"]+.viewer-image{background-position-y:54.2857142857%}.viewer-360 .viewer-slider[max="36"][value="21"]+.viewer-image{background-position-y:57.1428571429%}.viewer-360 .viewer-slider[max="36"][value="22"]+.viewer-image{background-position-y:60%}.viewer-360 .viewer-slider[max="36"][value="23"]+.viewer-image{background-position-y:62.8571428571%}.viewer-360 .viewer-slider[max="36"][value="24"]+.viewer-image{background-position-y:65.7142857143%}.viewer-360 .viewer-slider[max="36"][value="25"]+.viewer-image{background-position-y:68.5714285714%}.viewer-360 .viewer-slider[max="36"][value="26"]+.viewer-image{background-position-y:71.4285714286%}.viewer-360 .viewer-slider[max="36"][value="27"]+.viewer-image{background-position-y:74.2857142857%}.viewer-360 .viewer-slider[max="36"][value="28"]+.viewer-image{background-position-y:77.1428571429%}.viewer-360 .viewer-slider[max="36"][value="29"]+.viewer-image{background-position-y:80%}.viewer-360 .viewer-slider[max="36"][value="30"]+.viewer-image{background-position-y:82.8571428571%}.viewer-360 .viewer-slider[max="36"][value="31"]+.viewer-image{background-position-y:85.7142857143%}.viewer-360 .viewer-slider[max="36"][value="32"]+.viewer-image{background-position-y:88.5714285714%}.viewer-360 .viewer-slider[max="36"][value="33"]+.viewer-image{background-position-y:91.4285714286%}.viewer-360 .viewer-slider[max="36"][value="34"]+.viewer-image{background-position-y:94.2857142857%}.viewer-360 .viewer-slider[max="36"][value="35"]+.viewer-image{background-position-y:97.1428571429%}.viewer-360 .viewer-slider[max="36"][value="36"]+.viewer-image{background-position-y:100%}.viewer-360 .viewer-slider{cursor:ew-resize;-ms-flex-order:2;margin:1rem;order:2;width:60%}.viewer-360 .viewer-image{background-position-y:0;background-repeat:no-repeat;background-size:100%;-ms-flex-order:1;max-width:100%;order:1} \ No newline at end of file +.form-autocomplete{position:relative}.form-autocomplete .form-autocomplete-input{align-content:flex-start;display:-ms-flexbox;display:flex;-ms-flex-line-pack:start;-ms-flex-wrap:wrap;flex-wrap:wrap;height:auto;min-height:1.6rem;padding:.1rem}.form-autocomplete .form-autocomplete-input.is-focused{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-autocomplete .form-autocomplete-input .form-input{border-color:transparent;box-shadow:none;display:inline-block;-ms-flex:1 0 auto;flex:1 0 auto;height:1.2rem;line-height:.8rem;margin:.1rem;width:auto}.form-autocomplete .menu{left:0;position:absolute;top:100%;width:100%}.form-autocomplete.autocomplete-oneline .form-autocomplete-input{-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto}.form-autocomplete.autocomplete-oneline .chip{-ms-flex:1 0 auto;flex:1 0 auto}.calendar{border:.05rem solid #dadee4;border-radius:.1rem;display:block;min-width:280px}.calendar .calendar-nav{align-items:center;background:#f7f8f9;border-top-left-radius:.1rem;border-top-right-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-align:center;font-size:.9rem;padding:.4rem}.calendar .calendar-body,.calendar .calendar-header{display:-ms-flexbox;display:flex;-ms-flex-pack:center;-ms-flex-wrap:wrap;flex-wrap:wrap;justify-content:center;padding:.4rem 0}.calendar .calendar-body .calendar-date,.calendar .calendar-header .calendar-date{-ms-flex:0 0 14.28%;flex:0 0 14.28%;max-width:14.28%}.calendar .calendar-header{background:#f7f8f9;border-bottom:.05rem solid #dadee4;color:#bcc3ce;font-size:.7rem;text-align:center}.calendar .calendar-body{color:#66758c}.calendar .calendar-date{border:0;padding:.2rem}.calendar .calendar-date .date-item{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:.05rem solid transparent;border-radius:50%;color:#66758c;cursor:pointer;font-size:.7rem;height:1.4rem;line-height:1rem;outline:0;padding:.1rem;position:relative;text-align:center;text-decoration:none;transition:background .2s,border .2s,box-shadow .2s,color .2s;vertical-align:middle;white-space:nowrap;width:1.4rem}.calendar .calendar-date .date-item.date-today{border-color:#e5e5f9;color:#5755d9}.calendar .calendar-date .date-item:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.calendar .calendar-date .date-item:focus,.calendar .calendar-date .date-item:hover{background:#fefeff;border-color:#e5e5f9;color:#5755d9;text-decoration:none}.calendar .calendar-date .date-item.active,.calendar .calendar-date .date-item:active{background:#4b48d6;border-color:#3634d2;color:#fff}.calendar .calendar-date .date-item.badge::after{position:absolute;right:3px;top:3px;transform:translate(50%,-50%)}.calendar .calendar-date .calendar-event.disabled,.calendar .calendar-date .calendar-event:disabled,.calendar .calendar-date .date-item.disabled,.calendar .calendar-date .date-item:disabled{cursor:default;opacity:.25;pointer-events:none}.calendar .calendar-date.next-month .calendar-event,.calendar .calendar-date.next-month .date-item,.calendar .calendar-date.prev-month .calendar-event,.calendar .calendar-date.prev-month .date-item{opacity:.25}.calendar .calendar-range{position:relative}.calendar .calendar-range::before{background:#f1f1fc;content:"";height:1.4rem;left:0;position:absolute;right:0;top:50%;transform:translateY(-50%)}.calendar .calendar-range.range-start::before{left:50%}.calendar .calendar-range.range-end::before{right:50%}.calendar .calendar-range.range-end .date-item,.calendar .calendar-range.range-start .date-item{background:#4b48d6;border-color:#3634d2;color:#fff}.calendar .calendar-range .date-item{color:#5755d9}.calendar.calendar-lg .calendar-body{padding:0}.calendar.calendar-lg .calendar-body .calendar-date{border-bottom:.05rem solid #dadee4;border-right:.05rem solid #dadee4;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:5.5rem;padding:0}.calendar.calendar-lg .calendar-body .calendar-date:nth-child(7n){border-right:0}.calendar.calendar-lg .calendar-body .calendar-date:nth-last-child(-n+7){border-bottom:0}.calendar.calendar-lg .date-item{align-self:flex-end;-ms-flex-item-align:end;height:1.4rem;margin-right:.2rem;margin-top:.2rem}.calendar.calendar-lg .calendar-range::before{top:19px}.calendar.calendar-lg .calendar-range.range-start::before{left:auto;width:19px}.calendar.calendar-lg .calendar-range.range-end::before{right:19px}.calendar.calendar-lg .calendar-events{flex-grow:1;-ms-flex-positive:1;line-height:1;overflow-y:auto;padding:.2rem}.calendar.calendar-lg .calendar-event{border-radius:.1rem;display:block;font-size:.7rem;margin:.1rem auto;overflow:hidden;padding:3px 4px;text-overflow:ellipsis;white-space:nowrap}.carousel .carousel-locator:nth-of-type(1):checked~.carousel-container .carousel-item:nth-of-type(1),.carousel .carousel-locator:nth-of-type(2):checked~.carousel-container .carousel-item:nth-of-type(2),.carousel .carousel-locator:nth-of-type(3):checked~.carousel-container .carousel-item:nth-of-type(3),.carousel .carousel-locator:nth-of-type(4):checked~.carousel-container .carousel-item:nth-of-type(4),.carousel .carousel-locator:nth-of-type(5):checked~.carousel-container .carousel-item:nth-of-type(5),.carousel .carousel-locator:nth-of-type(6):checked~.carousel-container .carousel-item:nth-of-type(6),.carousel .carousel-locator:nth-of-type(7):checked~.carousel-container .carousel-item:nth-of-type(7),.carousel .carousel-locator:nth-of-type(8):checked~.carousel-container .carousel-item:nth-of-type(8){animation:carousel-slidein .75s ease-in-out 1;opacity:1;z-index:100}.carousel .carousel-locator:nth-of-type(1):checked~.carousel-nav .nav-item:nth-of-type(1),.carousel .carousel-locator:nth-of-type(2):checked~.carousel-nav .nav-item:nth-of-type(2),.carousel .carousel-locator:nth-of-type(3):checked~.carousel-nav .nav-item:nth-of-type(3),.carousel .carousel-locator:nth-of-type(4):checked~.carousel-nav .nav-item:nth-of-type(4),.carousel .carousel-locator:nth-of-type(5):checked~.carousel-nav .nav-item:nth-of-type(5),.carousel .carousel-locator:nth-of-type(6):checked~.carousel-nav .nav-item:nth-of-type(6),.carousel .carousel-locator:nth-of-type(7):checked~.carousel-nav .nav-item:nth-of-type(7),.carousel .carousel-locator:nth-of-type(8):checked~.carousel-nav .nav-item:nth-of-type(8){color:#f7f8f9}.carousel{background:#f7f8f9;display:block;overflow:hidden;-webkit-overflow-scrolling:touch;position:relative;width:100%;z-index:1}.carousel .carousel-container{height:100%;left:0;position:relative}.carousel .carousel-container::before{content:"";display:block;padding-bottom:56.25%}.carousel .carousel-container .carousel-item{animation:carousel-slideout 1s ease-in-out 1;height:100%;left:0;margin:0;opacity:0;position:absolute;top:0;width:100%}.carousel .carousel-container .carousel-item:hover .item-next,.carousel .carousel-container .carousel-item:hover .item-prev{opacity:1}.carousel .carousel-container .item-next,.carousel .carousel-container .item-prev{background:rgba(247,248,249,.25);border-color:rgba(247,248,249,.5);color:#f7f8f9;opacity:0;position:absolute;top:50%;transform:translateY(-50%);transition:all .4s;z-index:100}.carousel .carousel-container .item-prev{left:1rem}.carousel .carousel-container .item-next{right:1rem}.carousel .carousel-nav{bottom:.4rem;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;left:50%;position:absolute;transform:translateX(-50%);width:10rem;z-index:100}.carousel .carousel-nav .nav-item{color:rgba(247,248,249,.5);display:block;-ms-flex:1 0 auto;flex:1 0 auto;height:1.6rem;margin:.2rem;max-width:2.5rem;position:relative}.carousel .carousel-nav .nav-item::before{background:currentColor;content:"";display:block;height:.1rem;position:absolute;top:.5rem;width:100%}@keyframes carousel-slidein{0%{transform:translateX(100%)}100%{transform:translateX(0)}}@keyframes carousel-slideout{0%{opacity:1;transform:translateX(0)}100%{opacity:1;transform:translateX(-50%)}}.comparison-slider{height:50vh;overflow:hidden;-webkit-overflow-scrolling:touch;position:relative;width:100%}.comparison-slider .comparison-after,.comparison-slider .comparison-before{height:100%;left:0;margin:0;overflow:hidden;position:absolute;top:0}.comparison-slider .comparison-after img,.comparison-slider .comparison-before img{height:100%;object-fit:cover;object-position:left center;position:absolute;width:100%}.comparison-slider .comparison-before{width:100%;z-index:1}.comparison-slider .comparison-before .comparison-label{right:.8rem}.comparison-slider .comparison-after{max-width:100%;min-width:0;z-index:2}.comparison-slider .comparison-after::before{background:0 0;content:"";cursor:default;height:100%;left:0;position:absolute;right:.8rem;top:0;z-index:1}.comparison-slider .comparison-after::after{background:currentColor;border-radius:50%;box-shadow:0 -5px,0 5px;color:#fff;content:"";height:3px;pointer-events:none;position:absolute;right:.4rem;top:50%;transform:translate(50%,-50%);width:3px}.comparison-slider .comparison-after .comparison-label{left:.8rem}.comparison-slider .comparison-resizer{animation:first-run 1.5s 1 ease-in-out;cursor:ew-resize;height:.8rem;left:0;max-width:100%;min-width:.8rem;opacity:0;outline:0;position:relative;resize:horizontal;top:50%;transform:translateY(-50%) scaleY(30);width:0}.comparison-slider .comparison-label{background:rgba(48,55,66,.5);bottom:.8rem;color:#fff;padding:.2rem .4rem;position:absolute;-webkit-user-select:none;-ms-user-select:none;user-select:none}@keyframes first-run{0%{width:0}25%{width:2.4rem}50%{width:.8rem}75%{width:1.2rem}100%{width:0}}.filter .filter-tag#tag-0:checked~.filter-nav .chip[for=tag-0],.filter .filter-tag#tag-1:checked~.filter-nav .chip[for=tag-1],.filter .filter-tag#tag-2:checked~.filter-nav .chip[for=tag-2],.filter .filter-tag#tag-3:checked~.filter-nav .chip[for=tag-3],.filter .filter-tag#tag-4:checked~.filter-nav .chip[for=tag-4],.filter .filter-tag#tag-5:checked~.filter-nav .chip[for=tag-5],.filter .filter-tag#tag-6:checked~.filter-nav .chip[for=tag-6],.filter .filter-tag#tag-7:checked~.filter-nav .chip[for=tag-7],.filter .filter-tag#tag-8:checked~.filter-nav .chip[for=tag-8]{background:#5755d9;color:#fff}.filter .filter-tag#tag-1:checked~.filter-body .filter-item:not([data-tag~=tag-1]),.filter .filter-tag#tag-2:checked~.filter-body .filter-item:not([data-tag~=tag-2]),.filter .filter-tag#tag-3:checked~.filter-body .filter-item:not([data-tag~=tag-3]),.filter .filter-tag#tag-4:checked~.filter-body .filter-item:not([data-tag~=tag-4]),.filter .filter-tag#tag-5:checked~.filter-body .filter-item:not([data-tag~=tag-5]),.filter .filter-tag#tag-6:checked~.filter-body .filter-item:not([data-tag~=tag-6]),.filter .filter-tag#tag-7:checked~.filter-body .filter-item:not([data-tag~=tag-7]),.filter .filter-tag#tag-8:checked~.filter-body .filter-item:not([data-tag~=tag-8]){display:none}.filter .filter-nav{margin:.4rem 0}.filter .filter-body{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.meter{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#f7f8f9;border:0;border-radius:.1rem;display:block;height:.8rem;width:100%}.meter::-webkit-meter-inner-element{display:block}.meter::-webkit-meter-bar,.meter::-webkit-meter-even-less-good-value,.meter::-webkit-meter-optimum-value,.meter::-webkit-meter-suboptimum-value{border-radius:.1rem}.meter::-webkit-meter-bar{background:#f7f8f9}.meter::-webkit-meter-optimum-value{background:#32b643}.meter::-webkit-meter-suboptimum-value{background:#ffb700}.meter::-webkit-meter-even-less-good-value{background:#e85600}.meter:-moz-meter-optimum,.meter:-moz-meter-sub-optimum,.meter:-moz-meter-sub-sub-optimum,.meter::-moz-meter-bar{border-radius:.1rem}.meter:-moz-meter-optimum::-moz-meter-bar{background:#32b643}.meter:-moz-meter-sub-optimum::-moz-meter-bar{background:#ffb700}.meter:-moz-meter-sub-sub-optimum::-moz-meter-bar{background:#e85600}.off-canvas{display:-ms-flexbox;display:flex;-ms-flex-flow:nowrap;flex-flow:nowrap;height:100%;position:relative;width:100%}.off-canvas .off-canvas-toggle{display:block;left:.4rem;position:absolute;top:.4rem;transition:none;z-index:1}.off-canvas .off-canvas-sidebar{background:#f7f8f9;bottom:0;left:0;min-width:10rem;overflow-y:auto;position:fixed;top:0;transform:translateX(-100%);transition:transform .25s;z-index:200}.off-canvas .off-canvas-content{-ms-flex:1 1 auto;flex:1 1 auto;height:100%;padding:.4rem .4rem .4rem 4rem}.off-canvas .off-canvas-overlay{background:rgba(48,55,66,.1);border-color:transparent;border-radius:0;bottom:0;display:none;height:100%;left:0;position:fixed;right:0;top:0;width:100%}.off-canvas .off-canvas-sidebar.active,.off-canvas .off-canvas-sidebar:target{transform:translateX(0)}.off-canvas .off-canvas-sidebar.active~.off-canvas-overlay,.off-canvas .off-canvas-sidebar:target~.off-canvas-overlay{display:block;z-index:100}@media(min-width:960px){.off-canvas.off-canvas-sidebar-show .off-canvas-toggle{display:none}.off-canvas.off-canvas-sidebar-show .off-canvas-sidebar{-ms-flex:0 0 auto;flex:0 0 auto;position:relative;transform:none}.off-canvas.off-canvas-sidebar-show .off-canvas-overlay{display:none!important}}.parallax{display:block;height:auto;position:relative;width:auto}.parallax .parallax-content{box-shadow:0 1rem 2.1rem rgba(48,55,66,.3);height:auto;transform:perspective(1000px);transform-style:preserve-3d;transition:all .4s ease;width:100%}.parallax .parallax-content::before{content:"";display:block;height:100%;left:0;position:absolute;top:0;width:100%}.parallax .parallax-front{align-items:center;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;height:100%;justify-content:center;left:0;position:absolute;text-align:center;text-shadow:0 0 20px rgba(48,55,66,.75);top:0;transform:translateZ(50px) scale(.95);transition:transform .4s;width:100%;z-index:1}.parallax .parallax-top-left{height:50%;left:0;outline:0;position:absolute;top:0;width:50%;z-index:100}.parallax .parallax-top-left:focus~.parallax-content,.parallax .parallax-top-left:hover~.parallax-content{transform:perspective(1000px) rotateX(3deg) rotateY(-3deg)}.parallax .parallax-top-left:focus~.parallax-content::before,.parallax .parallax-top-left:hover~.parallax-content::before{background:linear-gradient(135deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-top-left:focus~.parallax-content .parallax-front,.parallax .parallax-top-left:hover~.parallax-content .parallax-front{transform:translate3d(4.5px,4.5px,50px) scale(.95)}.parallax .parallax-top-right{height:50%;outline:0;position:absolute;right:0;top:0;width:50%;z-index:100}.parallax .parallax-top-right:focus~.parallax-content,.parallax .parallax-top-right:hover~.parallax-content{transform:perspective(1000px) rotateX(3deg) rotateY(3deg)}.parallax .parallax-top-right:focus~.parallax-content::before,.parallax .parallax-top-right:hover~.parallax-content::before{background:linear-gradient(-135deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-top-right:focus~.parallax-content .parallax-front,.parallax .parallax-top-right:hover~.parallax-content .parallax-front{transform:translate3d(-4.5px,4.5px,50px) scale(.95)}.parallax .parallax-bottom-left{bottom:0;height:50%;left:0;outline:0;position:absolute;width:50%;z-index:100}.parallax .parallax-bottom-left:focus~.parallax-content,.parallax .parallax-bottom-left:hover~.parallax-content{transform:perspective(1000px) rotateX(-3deg) rotateY(-3deg)}.parallax .parallax-bottom-left:focus~.parallax-content::before,.parallax .parallax-bottom-left:hover~.parallax-content::before{background:linear-gradient(45deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-bottom-left:focus~.parallax-content .parallax-front,.parallax .parallax-bottom-left:hover~.parallax-content .parallax-front{transform:translate3d(4.5px,-4.5px,50px) scale(.95)}.parallax .parallax-bottom-right{bottom:0;height:50%;outline:0;position:absolute;right:0;width:50%;z-index:100}.parallax .parallax-bottom-right:focus~.parallax-content,.parallax .parallax-bottom-right:hover~.parallax-content{transform:perspective(1000px) rotateX(-3deg) rotateY(3deg)}.parallax .parallax-bottom-right:focus~.parallax-content::before,.parallax .parallax-bottom-right:hover~.parallax-content::before{background:linear-gradient(-45deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-bottom-right:focus~.parallax-content .parallax-front,.parallax .parallax-bottom-right:hover~.parallax-content .parallax-front{transform:translate3d(-4.5px,-4.5px,50px) scale(.95)}.progress{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#eef0f3;border:0;border-radius:.1rem;color:#5755d9;height:.2rem;position:relative;width:100%}.progress::-webkit-progress-bar{background:0 0;border-radius:.1rem}.progress::-webkit-progress-value{background:#5755d9;border-radius:.1rem}.progress::-moz-progress-bar{background:#5755d9;border-radius:.1rem}.progress:indeterminate{animation:progress-indeterminate 1.5s linear infinite;background:#eef0f3 linear-gradient(to right,#5755d9 30%,#eef0f3 30%) top left/150% 150% no-repeat}.progress:indeterminate::-moz-progress-bar{background:0 0}@keyframes progress-indeterminate{0%{background-position:200% 0}100%{background-position:-200% 0}}.slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;display:block;height:1.2rem;width:100%}.slider:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2);outline:0}.slider.tooltip:not([data-tooltip])::after{content:attr(value)}.slider::-webkit-slider-thumb{-webkit-appearance:none;background:#5755d9;border:0;border-radius:50%;height:.6rem;margin-top:-.25rem;-webkit-transition:transform .2s;transition:transform .2s;width:.6rem}.slider::-moz-range-thumb{background:#5755d9;border:0;border-radius:50%;height:.6rem;-moz-transition:transform .2s;transition:transform .2s;width:.6rem}.slider::-ms-thumb{background:#5755d9;border:0;border-radius:50%;height:.6rem;-ms-transition:transform .2s;transition:transform .2s;width:.6rem}.slider:active::-webkit-slider-thumb{transform:scale(1.25)}.slider:active::-moz-range-thumb{transform:scale(1.25)}.slider:active::-ms-thumb{transform:scale(1.25)}.slider.disabled::-webkit-slider-thumb,.slider:disabled::-webkit-slider-thumb{background:#f7f8f9;transform:scale(1)}.slider.disabled::-moz-range-thumb,.slider:disabled::-moz-range-thumb{background:#f7f8f9;transform:scale(1)}.slider.disabled::-ms-thumb,.slider:disabled::-ms-thumb{background:#f7f8f9;transform:scale(1)}.slider::-webkit-slider-runnable-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-moz-range-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-ms-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-ms-fill-lower{background:#5755d9}.timeline .timeline-item{display:-ms-flexbox;display:flex;margin-bottom:1.2rem;position:relative}.timeline .timeline-item::before{background:#dadee4;content:"";height:100%;left:11px;position:absolute;top:1.2rem;width:2px}.timeline .timeline-item .timeline-left{-ms-flex:0 0 auto;flex:0 0 auto}.timeline .timeline-item .timeline-content{-ms-flex:1 1 auto;flex:1 1 auto;padding:2px 0 2px .8rem}.timeline .timeline-item .timeline-icon{align-items:center;border-radius:50%;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;height:1.2rem;justify-content:center;text-align:center;width:1.2rem}.timeline .timeline-item .timeline-icon::before{border:.1rem solid #5755d9;border-radius:50%;content:"";display:block;height:.4rem;left:.4rem;position:absolute;top:.4rem;width:.4rem}.timeline .timeline-item .timeline-icon.icon-lg{background:#5755d9;line-height:1.2rem}.timeline .timeline-item .timeline-icon.icon-lg::before{content:none}.viewer-360{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-direction:column;flex-direction:column}.viewer-360 .viewer-slider[max="36"][value="1"]+.viewer-image{background-position-y:0}.viewer-360 .viewer-slider[max="36"][value="2"]+.viewer-image{background-position-y:2.8571428571%}.viewer-360 .viewer-slider[max="36"][value="3"]+.viewer-image{background-position-y:5.7142857143%}.viewer-360 .viewer-slider[max="36"][value="4"]+.viewer-image{background-position-y:8.5714285714%}.viewer-360 .viewer-slider[max="36"][value="5"]+.viewer-image{background-position-y:11.4285714286%}.viewer-360 .viewer-slider[max="36"][value="6"]+.viewer-image{background-position-y:14.2857142857%}.viewer-360 .viewer-slider[max="36"][value="7"]+.viewer-image{background-position-y:17.1428571429%}.viewer-360 .viewer-slider[max="36"][value="8"]+.viewer-image{background-position-y:20%}.viewer-360 .viewer-slider[max="36"][value="9"]+.viewer-image{background-position-y:22.8571428571%}.viewer-360 .viewer-slider[max="36"][value="10"]+.viewer-image{background-position-y:25.7142857143%}.viewer-360 .viewer-slider[max="36"][value="11"]+.viewer-image{background-position-y:28.5714285714%}.viewer-360 .viewer-slider[max="36"][value="12"]+.viewer-image{background-position-y:31.4285714286%}.viewer-360 .viewer-slider[max="36"][value="13"]+.viewer-image{background-position-y:34.2857142857%}.viewer-360 .viewer-slider[max="36"][value="14"]+.viewer-image{background-position-y:37.1428571429%}.viewer-360 .viewer-slider[max="36"][value="15"]+.viewer-image{background-position-y:40%}.viewer-360 .viewer-slider[max="36"][value="16"]+.viewer-image{background-position-y:42.8571428571%}.viewer-360 .viewer-slider[max="36"][value="17"]+.viewer-image{background-position-y:45.7142857143%}.viewer-360 .viewer-slider[max="36"][value="18"]+.viewer-image{background-position-y:48.5714285714%}.viewer-360 .viewer-slider[max="36"][value="19"]+.viewer-image{background-position-y:51.4285714286%}.viewer-360 .viewer-slider[max="36"][value="20"]+.viewer-image{background-position-y:54.2857142857%}.viewer-360 .viewer-slider[max="36"][value="21"]+.viewer-image{background-position-y:57.1428571429%}.viewer-360 .viewer-slider[max="36"][value="22"]+.viewer-image{background-position-y:60%}.viewer-360 .viewer-slider[max="36"][value="23"]+.viewer-image{background-position-y:62.8571428571%}.viewer-360 .viewer-slider[max="36"][value="24"]+.viewer-image{background-position-y:65.7142857143%}.viewer-360 .viewer-slider[max="36"][value="25"]+.viewer-image{background-position-y:68.5714285714%}.viewer-360 .viewer-slider[max="36"][value="26"]+.viewer-image{background-position-y:71.4285714286%}.viewer-360 .viewer-slider[max="36"][value="27"]+.viewer-image{background-position-y:74.2857142857%}.viewer-360 .viewer-slider[max="36"][value="28"]+.viewer-image{background-position-y:77.1428571429%}.viewer-360 .viewer-slider[max="36"][value="29"]+.viewer-image{background-position-y:80%}.viewer-360 .viewer-slider[max="36"][value="30"]+.viewer-image{background-position-y:82.8571428571%}.viewer-360 .viewer-slider[max="36"][value="31"]+.viewer-image{background-position-y:85.7142857143%}.viewer-360 .viewer-slider[max="36"][value="32"]+.viewer-image{background-position-y:88.5714285714%}.viewer-360 .viewer-slider[max="36"][value="33"]+.viewer-image{background-position-y:91.4285714286%}.viewer-360 .viewer-slider[max="36"][value="34"]+.viewer-image{background-position-y:94.2857142857%}.viewer-360 .viewer-slider[max="36"][value="35"]+.viewer-image{background-position-y:97.1428571429%}.viewer-360 .viewer-slider[max="36"][value="36"]+.viewer-image{background-position-y:100%}.viewer-360 .viewer-slider{cursor:ew-resize;-ms-flex-order:2;margin:1rem;order:2;width:60%}.viewer-360 .viewer-image{background-position-y:0;background-repeat:no-repeat;background-size:100%;-ms-flex-order:1;max-width:100%;order:1}/*! Spectre.css Experimentals v0.5.9 | MIT License | github.com/picturepan2/spectre */ \ No newline at end of file diff --git a/dist/spectre-icons.css b/dist/spectre-icons.css index fd881f151..d9bb5fd95 100644 --- a/dist/spectre-icons.css +++ b/dist/spectre-icons.css @@ -1,4 +1,3 @@ -/*! Spectre.css Icons v0.5.9 | MIT License | github.com/picturepan2/spectre */ .icon { box-sizing: border-box; display: inline-block; @@ -9,9 +8,7 @@ text-indent: -9999px; vertical-align: middle; width: 1em; -} - -.icon::before, +}.icon::before, .icon::after { content: ""; display: block; @@ -19,32 +16,20 @@ position: absolute; top: 50%; transform: translate(-50%, -50%); -} - -.icon.icon-2x { +}.icon.icon-2x { font-size: 1.6rem; -} - -.icon.icon-3x { +}.icon.icon-3x { font-size: 2.4rem; -} - -.icon.icon-4x { +}.icon.icon-4x { font-size: 3.2rem; -} - -.accordion .icon, +}.accordion .icon, .btn .icon, .toast .icon, .menu .icon { vertical-align: -10%; -} - -.btn-lg .icon { +}.btn-lg .icon { vertical-align: -15%; -} - -.icon-arrow-down::before, +}.icon-arrow-down::before, .icon-arrow-left::before, .icon-arrow-right::before, .icon-arrow-up::before, @@ -57,94 +42,58 @@ border-right: 0; height: .65em; width: .65em; -} - -.icon-arrow-down::before { +}.icon-arrow-down::before { transform: translate(-50%, -75%) rotate(225deg); -} - -.icon-arrow-left::before { +}.icon-arrow-left::before { transform: translate(-25%, -50%) rotate(-45deg); -} - -.icon-arrow-right::before { +}.icon-arrow-right::before { transform: translate(-75%, -50%) rotate(135deg); -} - -.icon-arrow-up::before { +}.icon-arrow-up::before { transform: translate(-50%, -25%) rotate(45deg); -} - -.icon-back::after, +}.icon-back::after, .icon-forward::after { background: currentColor; height: .1rem; width: .8em; -} - -.icon-downward::after, +}.icon-downward::after, .icon-upward::after { background: currentColor; height: .8em; width: .1rem; -} - -.icon-back::after { +}.icon-back::after { left: 55%; -} - -.icon-back::before { +}.icon-back::before { transform: translate(-50%, -50%) rotate(-45deg); -} - -.icon-downward::after { +}.icon-downward::after { top: 45%; -} - -.icon-downward::before { +}.icon-downward::before { transform: translate(-50%, -50%) rotate(-135deg); -} - -.icon-forward::after { +}.icon-forward::after { left: 45%; -} - -.icon-forward::before { +}.icon-forward::before { transform: translate(-50%, -50%) rotate(135deg); -} - -.icon-upward::after { +}.icon-upward::after { top: 55%; -} - -.icon-upward::before { +}.icon-upward::before { transform: translate(-50%, -50%) rotate(45deg); -} - -.icon-caret::before { +}.icon-caret::before { border-left: .3em solid transparent; border-right: .3em solid transparent; border-top: .3em solid currentColor; height: 0; transform: translate(-50%, -25%); width: 0; -} - -.icon-menu::before { +}.icon-menu::before { background: currentColor; - box-shadow: 0 -.35em, 0 .35em; + box-shadow: 0 -.35em,0 .35em; height: .1rem; width: 100%; -} - -.icon-apps::before { +}.icon-apps::before { background: currentColor; - box-shadow: -.35em -.35em, -.35em 0, -.35em .35em, 0 -.35em, 0 .35em, .35em -.35em, .35em 0, .35em .35em; + box-shadow: -.35em -.35em,-.35em 0,-.35em .35em,0 -.35em,0 .35em,.35em -.35em,.35em 0,.35em .35em; height: 3px; width: 3px; -} - -.icon-resize-horiz::before, +}.icon-resize-horiz::before, .icon-resize-horiz::after, .icon-resize-vert::before, .icon-resize-vert::after { @@ -153,111 +102,75 @@ border-right: 0; height: .45em; width: .45em; -} - -.icon-resize-horiz::before, +}.icon-resize-horiz::before, .icon-resize-vert::before { transform: translate(-50%, -90%) rotate(45deg); -} - -.icon-resize-horiz::after, +}.icon-resize-horiz::after, .icon-resize-vert::after { transform: translate(-50%, -10%) rotate(225deg); -} - -.icon-resize-horiz::before { +}.icon-resize-horiz::before { transform: translate(-90%, -50%) rotate(-45deg); -} - -.icon-resize-horiz::after { +}.icon-resize-horiz::after { transform: translate(-10%, -50%) rotate(135deg); -} - -.icon-more-horiz::before, +}.icon-more-horiz::before, .icon-more-vert::before { background: currentColor; border-radius: 50%; - box-shadow: -.4em 0, .4em 0; + box-shadow: -.4em 0,.4em 0; height: 3px; width: 3px; -} - -.icon-more-vert::before { - box-shadow: 0 -.4em, 0 .4em; -} - -.icon-plus::before, +}.icon-more-vert::before { + box-shadow: 0 -.4em,0 .4em; +}.icon-plus::before, .icon-minus::before, .icon-cross::before { background: currentColor; height: .1rem; width: 100%; -} - -.icon-plus::after, +}.icon-plus::after, .icon-cross::after { background: currentColor; height: 100%; width: .1rem; -} - -.icon-cross::before { +}.icon-cross::before { width: 100%; -} - -.icon-cross::after { +}.icon-cross::after { height: 100%; -} - -.icon-cross::before, +}.icon-cross::before, .icon-cross::after { transform: translate(-50%, -50%) rotate(45deg); -} - -.icon-check::before { +}.icon-check::before { border: .1rem solid currentColor; border-right: 0; border-top: 0; height: .5em; - transform: translate(-50%, -75%) rotate(-45deg); + transform: translate(-50%, -75%) rotate(-45deg); width: .9em; -} - -.icon-stop { +}.icon-stop { border: .1rem solid currentColor; border-radius: 50%; -} - -.icon-stop::before { +}.icon-stop::before { background: currentColor; height: .1rem; transform: translate(-50%, -50%) rotate(45deg); width: 1em; -} - -.icon-shutdown { +}.icon-shutdown { border: .1rem solid currentColor; border-radius: 50%; border-top-color: transparent; -} - -.icon-shutdown::before { +}.icon-shutdown::before { background: currentColor; content: ""; height: .5em; top: .1em; width: .1rem; -} - -.icon-refresh::before { +}.icon-refresh::before { border: .1rem solid currentColor; border-radius: 50%; border-right-color: transparent; height: 1em; width: 1em; -} - -.icon-refresh::after { +}.icon-refresh::after { border: .2em solid currentColor; border-left-color: transparent; border-top-color: transparent; @@ -265,9 +178,7 @@ left: 80%; top: 20%; width: 0; -} - -.icon-search::before { +}.icon-search::before { border: .1rem solid currentColor; border-radius: 50%; height: .75em; @@ -275,25 +186,19 @@ top: 5%; transform: translate(0, 0) rotate(45deg); width: .75em; -} - -.icon-search::after { +}.icon-search::after { background: currentColor; height: .1rem; left: 80%; top: 80%; transform: translate(-50%, -50%) rotate(45deg); width: .4em; -} - -.icon-edit::before { +}.icon-edit::before { border: .1rem solid currentColor; height: .4em; transform: translate(-40%, -60%) rotate(-45deg); width: .85em; -} - -.icon-edit::after { +}.icon-edit::after { border: .15em solid currentColor; border-right-color: transparent; border-top-color: transparent; @@ -302,9 +207,7 @@ top: 95%; transform: translate(0, -100%); width: 0; -} - -.icon-delete::before { +}.icon-delete::before { border: .1rem solid currentColor; border-bottom-left-radius: .1rem; border-bottom-right-radius: .1rem; @@ -312,24 +215,18 @@ height: .75em; top: 60%; width: .75em; -} - -.icon-delete::after { +}.icon-delete::after { background: currentColor; - box-shadow: -.25em .2em, .25em .2em; + box-shadow: -.25em .2em,.25em .2em; height: .1rem; top: .05rem; width: .5em; -} - -.icon-share { +}.icon-share { border: .1rem solid currentColor; border-radius: .1rem; border-right: 0; border-top: 0; -} - -.icon-share::before { +}.icon-share::before { border: .1rem solid currentColor; border-left: 0; border-top: 0; @@ -338,25 +235,19 @@ top: .25em; transform: translate(-125%, -50%) rotate(-45deg); width: .4em; -} - -.icon-share::after { +}.icon-share::after { border: .1rem solid currentColor; border-bottom: 0; border-radius: 75% 0; border-right: 0; height: .5em; width: .6em; -} - -.icon-flag::before { +}.icon-flag::before { background: currentColor; height: 1em; left: 15%; width: .1rem; -} - -.icon-flag::after { +}.icon-flag::after { border: .1rem solid currentColor; border-bottom-right-radius: .1rem; border-left: 0; @@ -365,18 +256,14 @@ left: 60%; top: 35%; width: .8em; -} - -.icon-bookmark::before { +}.icon-bookmark::before { border: .1rem solid currentColor; border-bottom: 0; border-top-left-radius: .1rem; border-top-right-radius: .1rem; height: .9em; width: .8em; -} - -.icon-bookmark::after { +}.icon-bookmark::after { border: .1rem solid currentColor; border-bottom: 0; border-left: 0; @@ -384,40 +271,28 @@ height: .5em; transform: translate(-50%, 35%) rotate(-45deg) skew(15deg, 15deg); width: .5em; -} - -.icon-download, +}.icon-download, .icon-upload { border-bottom: .1rem solid currentColor; -} - -.icon-download::before, +}.icon-download::before, .icon-upload::before { border: .1rem solid currentColor; border-bottom: 0; border-right: 0; height: .5em; - transform: translate(-50%, -60%) rotate(-135deg); + transform: translate(-50%, -60%) rotate(-135deg); width: .5em; -} - -.icon-download::after, +}.icon-download::after, .icon-upload::after { background: currentColor; height: .6em; top: 40%; width: .1rem; -} - -.icon-upload::before { +}.icon-upload::before { transform: translate(-50%, -60%) rotate(45deg); -} - -.icon-upload::after { +}.icon-upload::after { top: 50%; -} - -.icon-copy::before { +}.icon-copy::before { border: .1rem solid currentColor; border-bottom: 0; border-radius: .1rem; @@ -426,77 +301,57 @@ left: 40%; top: 35%; width: .8em; -} - -.icon-copy::after { +}.icon-copy::after { border: .1rem solid currentColor; border-radius: .1rem; height: .8em; left: 60%; top: 60%; width: .8em; -} - -.icon-time { +}.icon-time { border: .1rem solid currentColor; border-radius: 50%; -} - -.icon-time::before { +}.icon-time::before { background: currentColor; height: .4em; transform: translate(-50%, -75%); width: .1rem; -} - -.icon-time::after { +}.icon-time::after { background: currentColor; height: .3em; transform: translate(-50%, -75%) rotate(90deg); transform-origin: 50% 90%; width: .1rem; -} - -.icon-mail::before { +}.icon-mail::before { border: .1rem solid currentColor; border-radius: .1rem; height: .8em; width: 1em; -} - -.icon-mail::after { +}.icon-mail::after { border: .1rem solid currentColor; border-right: 0; border-top: 0; height: .5em; transform: translate(-50%, -90%) rotate(-45deg) skew(10deg, 10deg); width: .5em; -} - -.icon-people::before { +}.icon-people::before { border: .1rem solid currentColor; border-radius: 50%; height: .45em; top: 25%; width: .45em; -} - -.icon-people::after { +}.icon-people::after { border: .1rem solid currentColor; border-radius: 50% 50% 0 0; height: .4em; top: 75%; width: .9em; -} - -.icon-message { +}.icon-message { border: .1rem solid currentColor; border-bottom: 0; border-radius: .1rem; border-right: 0; -} - -.icon-message::before { +}.icon-message::before { border: .1rem solid currentColor; border-bottom-right-radius: .1rem; border-left: 0; @@ -505,9 +360,7 @@ left: 65%; top: 40%; width: .7em; -} - -.icon-message::after { +}.icon-message::after { background: currentColor; border-radius: .1rem; height: .3em; @@ -515,23 +368,17 @@ top: 100%; transform: translate(0, -90%) rotate(45deg); width: .1rem; -} - -.icon-photo { +}.icon-photo { border: .1rem solid currentColor; border-radius: .1rem; -} - -.icon-photo::before { +}.icon-photo::before { border: .1rem solid currentColor; border-radius: 50%; height: .25em; left: 35%; top: 35%; width: .25em; -} - -.icon-photo::after { +}.icon-photo::after { border: .1rem solid currentColor; border-bottom: 0; border-left: 0; @@ -539,54 +386,38 @@ left: 60%; transform: translate(-50%, 25%) rotate(-45deg); width: .5em; -} - -.icon-link::before, +}.icon-link::before, .icon-link::after { border: .1rem solid currentColor; border-radius: 5em 0 0 5em; border-right: 0; height: .5em; width: .75em; -} - -.icon-link::before { +}.icon-link::before { transform: translate(-70%, -45%) rotate(-45deg); -} - -.icon-link::after { +}.icon-link::after { transform: translate(-30%, -55%) rotate(135deg); -} - -.icon-location::before { +}.icon-location::before { border: .1rem solid currentColor; border-radius: 50% 50% 50% 0; height: .8em; transform: translate(-50%, -60%) rotate(-45deg); width: .8em; -} - -.icon-location::after { +}.icon-location::after { border: .1rem solid currentColor; border-radius: 50%; height: .2em; transform: translate(-50%, -80%); width: .2em; -} - -.icon-emoji { +}.icon-emoji { border: .1rem solid currentColor; border-radius: 50%; -} - -.icon-emoji::before { +}.icon-emoji::before { border-radius: 50%; - box-shadow: -.17em -.1em, .17em -.1em; + box-shadow: -.17em -.1em,.17em -.1em; height: .15em; width: .15em; -} - -.icon-emoji::after { +}.icon-emoji::after { border: .1rem solid currentColor; border-bottom-color: transparent; border-radius: 50%; @@ -594,4 +425,4 @@ height: .5em; transform: translate(-50%, -40%) rotate(-135deg); width: .5em; -} \ No newline at end of file +}/*! Spectre.css Icons v0.5.9 | MIT License | github.com/picturepan2/spectre */ \ No newline at end of file diff --git a/dist/spectre-icons.min.css b/dist/spectre-icons.min.css index 0276f7b84..c69a975bd 100644 --- a/dist/spectre-icons.min.css +++ b/dist/spectre-icons.min.css @@ -1 +1 @@ -/*! Spectre.css Icons v0.5.9 | MIT License | github.com/picturepan2/spectre */.icon{box-sizing:border-box;display:inline-block;font-size:inherit;font-style:normal;height:1em;position:relative;text-indent:-9999px;vertical-align:middle;width:1em}.icon::after,.icon::before{content:"";display:block;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.icon.icon-2x{font-size:1.6rem}.icon.icon-3x{font-size:2.4rem}.icon.icon-4x{font-size:3.2rem}.accordion .icon,.btn .icon,.menu .icon,.toast .icon{vertical-align:-10%}.btn-lg .icon{vertical-align:-15%}.icon-arrow-down::before,.icon-arrow-left::before,.icon-arrow-right::before,.icon-arrow-up::before,.icon-back::before,.icon-downward::before,.icon-forward::before,.icon-upward::before{border:.1rem solid currentColor;border-bottom:0;border-right:0;height:.65em;width:.65em}.icon-arrow-down::before{transform:translate(-50%,-75%) rotate(225deg)}.icon-arrow-left::before{transform:translate(-25%,-50%) rotate(-45deg)}.icon-arrow-right::before{transform:translate(-75%,-50%) rotate(135deg)}.icon-arrow-up::before{transform:translate(-50%,-25%) rotate(45deg)}.icon-back::after,.icon-forward::after{background:currentColor;height:.1rem;width:.8em}.icon-downward::after,.icon-upward::after{background:currentColor;height:.8em;width:.1rem}.icon-back::after{left:55%}.icon-back::before{transform:translate(-50%,-50%) rotate(-45deg)}.icon-downward::after{top:45%}.icon-downward::before{transform:translate(-50%,-50%) rotate(-135deg)}.icon-forward::after{left:45%}.icon-forward::before{transform:translate(-50%,-50%) rotate(135deg)}.icon-upward::after{top:55%}.icon-upward::before{transform:translate(-50%,-50%) rotate(45deg)}.icon-caret::before{border-left:.3em solid transparent;border-right:.3em solid transparent;border-top:.3em solid currentColor;height:0;transform:translate(-50%,-25%);width:0}.icon-menu::before{background:currentColor;box-shadow:0 -.35em,0 .35em;height:.1rem;width:100%}.icon-apps::before{background:currentColor;box-shadow:-.35em -.35em,-.35em 0,-.35em .35em,0 -.35em,0 .35em,.35em -.35em,.35em 0,.35em .35em;height:3px;width:3px}.icon-resize-horiz::after,.icon-resize-horiz::before,.icon-resize-vert::after,.icon-resize-vert::before{border:.1rem solid currentColor;border-bottom:0;border-right:0;height:.45em;width:.45em}.icon-resize-horiz::before,.icon-resize-vert::before{transform:translate(-50%,-90%) rotate(45deg)}.icon-resize-horiz::after,.icon-resize-vert::after{transform:translate(-50%,-10%) rotate(225deg)}.icon-resize-horiz::before{transform:translate(-90%,-50%) rotate(-45deg)}.icon-resize-horiz::after{transform:translate(-10%,-50%) rotate(135deg)}.icon-more-horiz::before,.icon-more-vert::before{background:currentColor;border-radius:50%;box-shadow:-.4em 0,.4em 0;height:3px;width:3px}.icon-more-vert::before{box-shadow:0 -.4em,0 .4em}.icon-cross::before,.icon-minus::before,.icon-plus::before{background:currentColor;height:.1rem;width:100%}.icon-cross::after,.icon-plus::after{background:currentColor;height:100%;width:.1rem}.icon-cross::before{width:100%}.icon-cross::after{height:100%}.icon-cross::after,.icon-cross::before{transform:translate(-50%,-50%) rotate(45deg)}.icon-check::before{border:.1rem solid currentColor;border-right:0;border-top:0;height:.5em;transform:translate(-50%,-75%) rotate(-45deg);width:.9em}.icon-stop{border:.1rem solid currentColor;border-radius:50%}.icon-stop::before{background:currentColor;height:.1rem;transform:translate(-50%,-50%) rotate(45deg);width:1em}.icon-shutdown{border:.1rem solid currentColor;border-radius:50%;border-top-color:transparent}.icon-shutdown::before{background:currentColor;content:"";height:.5em;top:.1em;width:.1rem}.icon-refresh::before{border:.1rem solid currentColor;border-radius:50%;border-right-color:transparent;height:1em;width:1em}.icon-refresh::after{border:.2em solid currentColor;border-left-color:transparent;border-top-color:transparent;height:0;left:80%;top:20%;width:0}.icon-search::before{border:.1rem solid currentColor;border-radius:50%;height:.75em;left:5%;top:5%;transform:translate(0,0) rotate(45deg);width:.75em}.icon-search::after{background:currentColor;height:.1rem;left:80%;top:80%;transform:translate(-50%,-50%) rotate(45deg);width:.4em}.icon-edit::before{border:.1rem solid currentColor;height:.4em;transform:translate(-40%,-60%) rotate(-45deg);width:.85em}.icon-edit::after{border:.15em solid currentColor;border-right-color:transparent;border-top-color:transparent;height:0;left:5%;top:95%;transform:translate(0,-100%);width:0}.icon-delete::before{border:.1rem solid currentColor;border-bottom-left-radius:.1rem;border-bottom-right-radius:.1rem;border-top:0;height:.75em;top:60%;width:.75em}.icon-delete::after{background:currentColor;box-shadow:-.25em .2em,.25em .2em;height:.1rem;top:.05rem;width:.5em}.icon-share{border:.1rem solid currentColor;border-radius:.1rem;border-right:0;border-top:0}.icon-share::before{border:.1rem solid currentColor;border-left:0;border-top:0;height:.4em;left:100%;top:.25em;transform:translate(-125%,-50%) rotate(-45deg);width:.4em}.icon-share::after{border:.1rem solid currentColor;border-bottom:0;border-radius:75% 0;border-right:0;height:.5em;width:.6em}.icon-flag::before{background:currentColor;height:1em;left:15%;width:.1rem}.icon-flag::after{border:.1rem solid currentColor;border-bottom-right-radius:.1rem;border-left:0;border-top-right-radius:.1rem;height:.65em;left:60%;top:35%;width:.8em}.icon-bookmark::before{border:.1rem solid currentColor;border-bottom:0;border-top-left-radius:.1rem;border-top-right-radius:.1rem;height:.9em;width:.8em}.icon-bookmark::after{border:.1rem solid currentColor;border-bottom:0;border-left:0;border-radius:.1rem;height:.5em;transform:translate(-50%,35%) rotate(-45deg) skew(15deg,15deg);width:.5em}.icon-download,.icon-upload{border-bottom:.1rem solid currentColor}.icon-download::before,.icon-upload::before{border:.1rem solid currentColor;border-bottom:0;border-right:0;height:.5em;transform:translate(-50%,-60%) rotate(-135deg);width:.5em}.icon-download::after,.icon-upload::after{background:currentColor;height:.6em;top:40%;width:.1rem}.icon-upload::before{transform:translate(-50%,-60%) rotate(45deg)}.icon-upload::after{top:50%}.icon-copy::before{border:.1rem solid currentColor;border-bottom:0;border-radius:.1rem;border-right:0;height:.8em;left:40%;top:35%;width:.8em}.icon-copy::after{border:.1rem solid currentColor;border-radius:.1rem;height:.8em;left:60%;top:60%;width:.8em}.icon-time{border:.1rem solid currentColor;border-radius:50%}.icon-time::before{background:currentColor;height:.4em;transform:translate(-50%,-75%);width:.1rem}.icon-time::after{background:currentColor;height:.3em;transform:translate(-50%,-75%) rotate(90deg);transform-origin:50% 90%;width:.1rem}.icon-mail::before{border:.1rem solid currentColor;border-radius:.1rem;height:.8em;width:1em}.icon-mail::after{border:.1rem solid currentColor;border-right:0;border-top:0;height:.5em;transform:translate(-50%,-90%) rotate(-45deg) skew(10deg,10deg);width:.5em}.icon-people::before{border:.1rem solid currentColor;border-radius:50%;height:.45em;top:25%;width:.45em}.icon-people::after{border:.1rem solid currentColor;border-radius:50% 50% 0 0;height:.4em;top:75%;width:.9em}.icon-message{border:.1rem solid currentColor;border-bottom:0;border-radius:.1rem;border-right:0}.icon-message::before{border:.1rem solid currentColor;border-bottom-right-radius:.1rem;border-left:0;border-top:0;height:.8em;left:65%;top:40%;width:.7em}.icon-message::after{background:currentColor;border-radius:.1rem;height:.3em;left:10%;top:100%;transform:translate(0,-90%) rotate(45deg);width:.1rem}.icon-photo{border:.1rem solid currentColor;border-radius:.1rem}.icon-photo::before{border:.1rem solid currentColor;border-radius:50%;height:.25em;left:35%;top:35%;width:.25em}.icon-photo::after{border:.1rem solid currentColor;border-bottom:0;border-left:0;height:.5em;left:60%;transform:translate(-50%,25%) rotate(-45deg);width:.5em}.icon-link::after,.icon-link::before{border:.1rem solid currentColor;border-radius:5em 0 0 5em;border-right:0;height:.5em;width:.75em}.icon-link::before{transform:translate(-70%,-45%) rotate(-45deg)}.icon-link::after{transform:translate(-30%,-55%) rotate(135deg)}.icon-location::before{border:.1rem solid currentColor;border-radius:50% 50% 50% 0;height:.8em;transform:translate(-50%,-60%) rotate(-45deg);width:.8em}.icon-location::after{border:.1rem solid currentColor;border-radius:50%;height:.2em;transform:translate(-50%,-80%);width:.2em}.icon-emoji{border:.1rem solid currentColor;border-radius:50%}.icon-emoji::before{border-radius:50%;box-shadow:-.17em -.1em,.17em -.1em;height:.15em;width:.15em}.icon-emoji::after{border:.1rem solid currentColor;border-bottom-color:transparent;border-radius:50%;border-right-color:transparent;height:.5em;transform:translate(-50%,-40%) rotate(-135deg);width:.5em} \ No newline at end of file +.icon{box-sizing:border-box;display:inline-block;font-size:inherit;font-style:normal;height:1em;position:relative;text-indent:-9999px;vertical-align:middle;width:1em}.icon::after,.icon::before{content:"";display:block;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.icon.icon-2x{font-size:1.6rem}.icon.icon-3x{font-size:2.4rem}.icon.icon-4x{font-size:3.2rem}.accordion .icon,.btn .icon,.menu .icon,.toast .icon{vertical-align:-10%}.btn-lg .icon{vertical-align:-15%}.icon-arrow-down::before,.icon-arrow-left::before,.icon-arrow-right::before,.icon-arrow-up::before,.icon-back::before,.icon-downward::before,.icon-forward::before,.icon-upward::before{border:.1rem solid currentColor;border-bottom:0;border-right:0;height:.65em;width:.65em}.icon-arrow-down::before{transform:translate(-50%,-75%) rotate(225deg)}.icon-arrow-left::before{transform:translate(-25%,-50%) rotate(-45deg)}.icon-arrow-right::before{transform:translate(-75%,-50%) rotate(135deg)}.icon-arrow-up::before{transform:translate(-50%,-25%) rotate(45deg)}.icon-back::after,.icon-forward::after{background:currentColor;height:.1rem;width:.8em}.icon-downward::after,.icon-upward::after{background:currentColor;height:.8em;width:.1rem}.icon-back::after{left:55%}.icon-back::before{transform:translate(-50%,-50%) rotate(-45deg)}.icon-downward::after{top:45%}.icon-downward::before{transform:translate(-50%,-50%) rotate(-135deg)}.icon-forward::after{left:45%}.icon-forward::before{transform:translate(-50%,-50%) rotate(135deg)}.icon-upward::after{top:55%}.icon-upward::before{transform:translate(-50%,-50%) rotate(45deg)}.icon-caret::before{border-left:.3em solid transparent;border-right:.3em solid transparent;border-top:.3em solid currentColor;height:0;transform:translate(-50%,-25%);width:0}.icon-menu::before{background:currentColor;box-shadow:0 -.35em,0 .35em;height:.1rem;width:100%}.icon-apps::before{background:currentColor;box-shadow:-.35em -.35em,-.35em 0,-.35em .35em,0 -.35em,0 .35em,.35em -.35em,.35em 0,.35em .35em;height:3px;width:3px}.icon-resize-horiz::after,.icon-resize-horiz::before,.icon-resize-vert::after,.icon-resize-vert::before{border:.1rem solid currentColor;border-bottom:0;border-right:0;height:.45em;width:.45em}.icon-resize-horiz::before,.icon-resize-vert::before{transform:translate(-50%,-90%) rotate(45deg)}.icon-resize-horiz::after,.icon-resize-vert::after{transform:translate(-50%,-10%) rotate(225deg)}.icon-resize-horiz::before{transform:translate(-90%,-50%) rotate(-45deg)}.icon-resize-horiz::after{transform:translate(-10%,-50%) rotate(135deg)}.icon-more-horiz::before,.icon-more-vert::before{background:currentColor;border-radius:50%;box-shadow:-.4em 0,.4em 0;height:3px;width:3px}.icon-more-vert::before{box-shadow:0 -.4em,0 .4em}.icon-cross::before,.icon-minus::before,.icon-plus::before{background:currentColor;height:.1rem;width:100%}.icon-cross::after,.icon-plus::after{background:currentColor;height:100%;width:.1rem}.icon-cross::before{width:100%}.icon-cross::after{height:100%}.icon-cross::after,.icon-cross::before{transform:translate(-50%,-50%) rotate(45deg)}.icon-check::before{border:.1rem solid currentColor;border-right:0;border-top:0;height:.5em;transform:translate(-50%,-75%) rotate(-45deg);width:.9em}.icon-stop{border:.1rem solid currentColor;border-radius:50%}.icon-stop::before{background:currentColor;height:.1rem;transform:translate(-50%,-50%) rotate(45deg);width:1em}.icon-shutdown{border:.1rem solid currentColor;border-radius:50%;border-top-color:transparent}.icon-shutdown::before{background:currentColor;content:"";height:.5em;top:.1em;width:.1rem}.icon-refresh::before{border:.1rem solid currentColor;border-radius:50%;border-right-color:transparent;height:1em;width:1em}.icon-refresh::after{border:.2em solid currentColor;border-left-color:transparent;border-top-color:transparent;height:0;left:80%;top:20%;width:0}.icon-search::before{border:.1rem solid currentColor;border-radius:50%;height:.75em;left:5%;top:5%;transform:translate(0,0) rotate(45deg);width:.75em}.icon-search::after{background:currentColor;height:.1rem;left:80%;top:80%;transform:translate(-50%,-50%) rotate(45deg);width:.4em}.icon-edit::before{border:.1rem solid currentColor;height:.4em;transform:translate(-40%,-60%) rotate(-45deg);width:.85em}.icon-edit::after{border:.15em solid currentColor;border-right-color:transparent;border-top-color:transparent;height:0;left:5%;top:95%;transform:translate(0,-100%);width:0}.icon-delete::before{border:.1rem solid currentColor;border-bottom-left-radius:.1rem;border-bottom-right-radius:.1rem;border-top:0;height:.75em;top:60%;width:.75em}.icon-delete::after{background:currentColor;box-shadow:-.25em .2em,.25em .2em;height:.1rem;top:.05rem;width:.5em}.icon-share{border:.1rem solid currentColor;border-radius:.1rem;border-right:0;border-top:0}.icon-share::before{border:.1rem solid currentColor;border-left:0;border-top:0;height:.4em;left:100%;top:.25em;transform:translate(-125%,-50%) rotate(-45deg);width:.4em}.icon-share::after{border:.1rem solid currentColor;border-bottom:0;border-radius:75% 0;border-right:0;height:.5em;width:.6em}.icon-flag::before{background:currentColor;height:1em;left:15%;width:.1rem}.icon-flag::after{border:.1rem solid currentColor;border-bottom-right-radius:.1rem;border-left:0;border-top-right-radius:.1rem;height:.65em;left:60%;top:35%;width:.8em}.icon-bookmark::before{border:.1rem solid currentColor;border-bottom:0;border-top-left-radius:.1rem;border-top-right-radius:.1rem;height:.9em;width:.8em}.icon-bookmark::after{border:.1rem solid currentColor;border-bottom:0;border-left:0;border-radius:.1rem;height:.5em;transform:translate(-50%,35%) rotate(-45deg) skew(15deg,15deg);width:.5em}.icon-download,.icon-upload{border-bottom:.1rem solid currentColor}.icon-download::before,.icon-upload::before{border:.1rem solid currentColor;border-bottom:0;border-right:0;height:.5em;transform:translate(-50%,-60%) rotate(-135deg);width:.5em}.icon-download::after,.icon-upload::after{background:currentColor;height:.6em;top:40%;width:.1rem}.icon-upload::before{transform:translate(-50%,-60%) rotate(45deg)}.icon-upload::after{top:50%}.icon-copy::before{border:.1rem solid currentColor;border-bottom:0;border-radius:.1rem;border-right:0;height:.8em;left:40%;top:35%;width:.8em}.icon-copy::after{border:.1rem solid currentColor;border-radius:.1rem;height:.8em;left:60%;top:60%;width:.8em}.icon-time{border:.1rem solid currentColor;border-radius:50%}.icon-time::before{background:currentColor;height:.4em;transform:translate(-50%,-75%);width:.1rem}.icon-time::after{background:currentColor;height:.3em;transform:translate(-50%,-75%) rotate(90deg);transform-origin:50% 90%;width:.1rem}.icon-mail::before{border:.1rem solid currentColor;border-radius:.1rem;height:.8em;width:1em}.icon-mail::after{border:.1rem solid currentColor;border-right:0;border-top:0;height:.5em;transform:translate(-50%,-90%) rotate(-45deg) skew(10deg,10deg);width:.5em}.icon-people::before{border:.1rem solid currentColor;border-radius:50%;height:.45em;top:25%;width:.45em}.icon-people::after{border:.1rem solid currentColor;border-radius:50% 50% 0 0;height:.4em;top:75%;width:.9em}.icon-message{border:.1rem solid currentColor;border-bottom:0;border-radius:.1rem;border-right:0}.icon-message::before{border:.1rem solid currentColor;border-bottom-right-radius:.1rem;border-left:0;border-top:0;height:.8em;left:65%;top:40%;width:.7em}.icon-message::after{background:currentColor;border-radius:.1rem;height:.3em;left:10%;top:100%;transform:translate(0,-90%) rotate(45deg);width:.1rem}.icon-photo{border:.1rem solid currentColor;border-radius:.1rem}.icon-photo::before{border:.1rem solid currentColor;border-radius:50%;height:.25em;left:35%;top:35%;width:.25em}.icon-photo::after{border:.1rem solid currentColor;border-bottom:0;border-left:0;height:.5em;left:60%;transform:translate(-50%,25%) rotate(-45deg);width:.5em}.icon-link::after,.icon-link::before{border:.1rem solid currentColor;border-radius:5em 0 0 5em;border-right:0;height:.5em;width:.75em}.icon-link::before{transform:translate(-70%,-45%) rotate(-45deg)}.icon-link::after{transform:translate(-30%,-55%) rotate(135deg)}.icon-location::before{border:.1rem solid currentColor;border-radius:50% 50% 50% 0;height:.8em;transform:translate(-50%,-60%) rotate(-45deg);width:.8em}.icon-location::after{border:.1rem solid currentColor;border-radius:50%;height:.2em;transform:translate(-50%,-80%);width:.2em}.icon-emoji{border:.1rem solid currentColor;border-radius:50%}.icon-emoji::before{border-radius:50%;box-shadow:-.17em -.1em,.17em -.1em;height:.15em;width:.15em}.icon-emoji::after{border:.1rem solid currentColor;border-bottom-color:transparent;border-radius:50%;border-right-color:transparent;height:.5em;transform:translate(-50%,-40%) rotate(-135deg);width:.5em}/*! Spectre.css Icons v0.5.9 | MIT License | github.com/picturepan2/spectre */ \ No newline at end of file diff --git a/dist/spectre.css b/dist/spectre.css index 1499dcc69..8d1f02b79 100644 --- a/dist/spectre.css +++ b/dist/spectre.css @@ -1,322 +1,173 @@ -/*! Spectre.css v0.5.9 | MIT License | github.com/picturepan2/spectre */ -/* Manually forked from Normalize.css */ -/* normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */ -/** 1. Change the default font family in all browsers (opinionated). 2. Correct the line height in all browsers. 3. Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS. */ -/* Document ========================================================================== */ html { - font-family: sans-serif; /* 1 */ - -webkit-text-size-adjust: 100%; /* 3 */ - -ms-text-size-adjust: 100%; /* 3 */ -} - -/* Sections ========================================================================== */ -/** Remove the margin in all browsers (opinionated). */ -body { + font-family: sans-serif; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; +}body { margin: 0; -} - -/** Add the correct display in IE 9-. */ -article, +}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 { +}h1 { font-size: 2em; margin: .67em 0; -} - -/* Grouping content ========================================================================== */ -/** Add the correct display in IE 9-. 1. Add the correct display in IE. */ -figcaption, +}figcaption, figure, main { - /* 1 */ display: block; -} - -/** Add the correct margin in IE 8 (removed). */ -/** 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. (removed) 2. Correct the odd `em` font sizing in all browsers. */ -/* 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 */ -} - -/** Remove the outline on focused links when they are also active or hovered in all browsers (opinionated). */ -a:active, + display: block; +}hr { + box-sizing: content-box; + height: 0; + overflow: visible; +}a { + background-color: transparent; + -webkit-text-decoration-skip: objects; +}a:active, a:hover { outline-width: 0; -} - -/** Modify default styling of address. */ -address { +}address { font-style: normal; -} - -/** 1. Remove the bottom border in Firefox 39-. 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. (removed) */ -/** Prevent the duplicate application of `bolder` by the next rule in Safari 6. */ -b, +}b, strong { font-weight: inherit; -} - -/** Add the correct font weight in Chrome, Edge, and Safari. */ -b, +}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, +}code, kbd, pre, samp { - font-family: "SF Mono", "Segoe UI Mono", "Roboto Mono", Menlo, Courier, monospace; /* 1 (changed) */ - font-size: 1em; /* 2 */ -} - -/** Add the correct font style in Android 4.3-. */ -dfn { + font-family: "SF Mono","Segoe UI Mono","Roboto Mono",Menlo,Courier,monospace; + font-size: 1em; +}dfn { font-style: italic; -} - -/** Add the correct background and color in IE 9-. (Removed) */ -/** Add the correct font size in all browsers. */ -small { +}small { font-size: 80%; - font-weight: 400; /* (added) */ -} - -/** Prevent `sub` and `sup` elements from affecting the line height in all browsers. */ -sub, + font-weight: 400; +}sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; -} - -sub { +}sub { bottom: -.25em; -} - -sup { +}sup { top: -.5em; -} - -/* Embedded content ========================================================================== */ -/** Add the correct display in IE 9-. */ -audio, +}audio, video { display: inline-block; -} - -/** Add the correct display in iOS 4-7. */ -audio:not([controls]) { +}audio:not([controls]) { display: none; height: 0; -} - -/** Remove the border on images inside links in IE 10-. */ -img { +}img { border-style: none; -} - -/** Hide the overflow in IE. */ -svg:not(:root) { +}svg:not(:root) { overflow: hidden; -} - -/* Forms ========================================================================== */ -/** 1. Change the font styles in all browsers (opinionated). 2. Remove the margin in Firefox and Safari. */ -button, +}button, input, optgroup, select, textarea { - font-family: inherit; /* 1 (changed) */ - font-size: inherit; /* 1 (changed) */ - line-height: inherit; /* 1 (changed) */ - margin: 0; /* 2 */ -} - -/** Show the overflow in IE. 1. Show the overflow in Edge. */ -button, + font-family: inherit; + font-size: inherit; + line-height: inherit; + margin: 0; +}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, + overflow: visible; +}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 { + text-transform: none; +}button, +html [type=button], +[type=reset], +[type=submit] { + -webkit-appearance: button; +}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 (removed). */ -/** Change the border, margin, and padding in all browsers (opinionated) (changed). */ -fieldset { +}fieldset { border: 0; margin: 0; padding: 0; -} - -/** 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 { +}legend { + box-sizing: border-box; + color: inherit; + display: table; + max-width: 100%; + padding: 0; + white-space: normal; +}progress { + display: inline-block; + vertical-align: baseline; +}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 { +}[type=checkbox], +[type=radio] { + box-sizing: border-box; + padding: 0; +}[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 { +}[type=search] { + -webkit-appearance: textfield; + outline-offset: -2px; +}[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, +}::-webkit-file-upload-button { + -webkit-appearance: button; + font: inherit; +}details, menu { display: block; -} - -/* Add the correct display in all browsers. */ -summary { +}summary { display: list-item; outline: none; -} - -/* Scripting ========================================================================== */ -/** Add the correct display in IE 9-. */ -canvas { +}canvas { display: inline-block; -} - -/** Add the correct display in IE. */ -template { +}template { display: none; -} - -/* Hidden ========================================================================== */ -/** Add the correct display in IE 10-. */ -[hidden] { +}[hidden] { display: none; -} - -*, +}*, *::before, *::after { box-sizing: inherit; -} - -html { +}html { box-sizing: border-box; font-size: 20px; line-height: 1.5; -webkit-tap-highlight-color: transparent; -} - -body { +}body { background: #fff; color: #3b4351; - font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif; font-size: .8rem; overflow-x: hidden; text-rendering: optimizeLegibility; -} - -a { +}a { color: #5755d9; outline: none; text-decoration: none; -} - -a:focus { - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -a:focus, +}a:focus { + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}a:focus, a:hover, a:active, a.active { color: #302ecd; text-decoration: underline; -} - -a:visited { +}a:visited { color: #807fe2; -} - -h1, +}h1, h2, h3, h4, @@ -327,156 +178,99 @@ h6 { line-height: 1.2; margin-bottom: .5em; margin-top: 0; -} - -.h1, +}.h1, .h2, .h3, .h4, .h5, .h6 { font-weight: 500; -} - -h1, +}h1, .h1 { font-size: 2rem; -} - -h2, +}h2, .h2 { font-size: 1.6rem; -} - -h3, +}h3, .h3 { font-size: 1.4rem; -} - -h4, +}h4, .h4 { font-size: 1.2rem; -} - -h5, +}h5, .h5 { font-size: 1rem; -} - -h6, +}h6, .h6 { font-size: .8rem; -} - -p { +}p { margin: 0 0 1.2rem; -} - -a, +}a, ins, u { - -webkit-text-decoration-skip: ink edges; text-decoration-skip: ink edges; -} - -abbr[title] { +}abbr[title] { border-bottom: .05rem dotted; cursor: help; text-decoration: none; -} - -kbd { +}kbd { background: #303742; border-radius: .1rem; color: #fff; - font-size: .7rem; + font-size: .7rem; line-height: 1.25; padding: .1rem .2rem; -} - -mark { +}mark { background: #ffe9b3; border-bottom: .05rem solid #ffd367; border-radius: .1rem; color: #3b4351; padding: .05rem .1rem 0; -} - -blockquote { +}blockquote { border-left: .1rem solid #dadee4; margin-left: 0; padding: .4rem .8rem; -} - -blockquote p:last-child { +}blockquote p:last-child { margin-bottom: 0; -} - -ul, +}ul, ol { margin: .8rem 0 .8rem .8rem; padding: 0; -} - -ul ul, +}ul ul, ul ol, ol ul, ol ol { margin: .8rem 0 .8rem .8rem; -} - -ul li, +}ul li, ol li { margin-top: .4rem; -} - -ul { +}ul { list-style: disc inside; -} - -ul ul { +}ul ul { list-style-type: circle; -} - -ol { +}ol { list-style: decimal inside; -} - -ol ol { +}ol ol { list-style-type: lower-alpha; -} - -dl dt { +}dl dt { font-weight: bold; -} - -dl dd { +}dl dd { margin: .4rem 0 .8rem 0; -} - -html:lang(zh), +}html:lang(zh), html:lang(zh-Hans), .lang-zh, .lang-zh-hans { - font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", sans-serif; -} - -html:lang(zh-Hant), + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",sans-serif; +}html:lang(zh-Hant), .lang-zh-hant { - font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang TC", "Hiragino Sans CNS", "Microsoft JhengHei", "Helvetica Neue", sans-serif; -} - -html:lang(ja), + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang TC","Hiragino Sans CNS","Microsoft JhengHei","Helvetica Neue",sans-serif; +}html:lang(ja), .lang-ja { - font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Hiragino Sans", "Hiragino Kaku Gothic Pro", "Yu Gothic", YuGothic, Meiryo, "Helvetica Neue", sans-serif; -} - -html:lang(ko), + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Hiragino Sans","Hiragino Kaku Gothic Pro","Yu Gothic",YuGothic,Meiryo,"Helvetica Neue",sans-serif; +}html:lang(ko), .lang-ko { - font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Malgun Gothic", "Helvetica Neue", sans-serif; -} - -:lang(zh) ins, + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Malgun Gothic","Helvetica Neue",sans-serif; +}:lang(zh) ins, :lang(zh) u, :lang(ja) ins, :lang(ja) u, @@ -484,9 +278,7 @@ html:lang(ko), .lang-cjk u { border-bottom: .05rem solid; text-decoration: none; -} - -:lang(zh) del + del, +}:lang(zh) del + del, :lang(zh) del + s, :lang(zh) ins + ins, :lang(zh) ins + u, @@ -511,46 +303,30 @@ html:lang(ko), .lang-cjk u + ins, .lang-cjk u + u { margin-left: .125em; -} - -.table { +}.table { border-collapse: collapse; border-spacing: 0; - text-align: left; + text-align: left; width: 100%; -} - -.table.table-striped tbody tr:nth-of-type(odd) { +}.table.table-striped tbody tr:nth-of-type(odd) { background: #f7f8f9; -} - -.table tbody tr.active, +}.table tbody tr.active, .table.table-striped tbody tr.active { background: #eef0f3; -} - -.table.table-hover tbody tr:hover { +}.table.table-hover tbody tr:hover { background: #eef0f3; -} - -.table.table-scroll { +}.table.table-scroll { display: block; overflow-x: auto; padding-bottom: .75rem; white-space: nowrap; -} - -.table td, +}.table td, .table th { border-bottom: .05rem solid #dadee4; padding: .6rem .4rem; -} - -.table th { +}.table th { border-bottom-width: .1rem; -} - -.btn { +}.btn { -webkit-appearance: none; -moz-appearance: none; appearance: none; @@ -567,176 +343,119 @@ html:lang(ko), padding: .25rem .4rem; text-align: center; text-decoration: none; - transition: background .2s, border .2s, box-shadow .2s, color .2s; + transition: background .2s,border .2s,box-shadow .2s,color .2s; -webkit-user-select: none; - -moz-user-select: none; -ms-user-select: none; user-select: none; vertical-align: middle; white-space: nowrap; -} - -.btn:focus { - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.btn:focus, +}.btn:focus { + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.btn:focus, .btn:hover { background: #f1f1fc; border-color: #4b48d6; text-decoration: none; -} - -.btn:active, +}.btn:active, .btn.active { background: #4b48d6; border-color: #3634d2; color: #fff; text-decoration: none; -} - -.btn:active.loading::after, +}.btn:active.loading::after, .btn.active.loading::after { border-bottom-color: #fff; border-left-color: #fff; -} - -.btn[disabled], +}.btn[disabled], .btn:disabled, .btn.disabled { cursor: default; opacity: .5; pointer-events: none; -} - -.btn.btn-primary { +}.btn.btn-primary { background: #5755d9; border-color: #4b48d6; color: #fff; -} - -.btn.btn-primary:focus, +}.btn.btn-primary:focus, .btn.btn-primary:hover { background: #4240d4; border-color: #3634d2; color: #fff; -} - -.btn.btn-primary:active, +}.btn.btn-primary:active, .btn.btn-primary.active { background: #3a38d2; border-color: #302ecd; color: #fff; -} - -.btn.btn-primary.loading::after { +}.btn.btn-primary.loading::after { border-bottom-color: #fff; border-left-color: #fff; -} - -.btn.btn-success { +}.btn.btn-success { background: #32b643; border-color: #2faa3f; color: #fff; -} - -.btn.btn-success:focus { - box-shadow: 0 0 0 .1rem rgba(50, 182, 67, .2); -} - -.btn.btn-success:focus, +}.btn.btn-success:focus { + box-shadow: 0 0 0 .1rem rgba(50,182,67,.2); +}.btn.btn-success:focus, .btn.btn-success:hover { background: #30ae40; border-color: #2da23c; color: #fff; -} - -.btn.btn-success:active, +}.btn.btn-success:active, .btn.btn-success.active { background: #2a9a39; border-color: #278e34; color: #fff; -} - -.btn.btn-success.loading::after { +}.btn.btn-success.loading::after { border-bottom-color: #fff; border-left-color: #fff; -} - -.btn.btn-error { +}.btn.btn-error { background: #e85600; border-color: #d95000; color: #fff; -} - -.btn.btn-error:focus { - box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2); -} - -.btn.btn-error:focus, +}.btn.btn-error:focus { + box-shadow: 0 0 0 .1rem rgba(232,86,0,.2); +}.btn.btn-error:focus, .btn.btn-error:hover { background: #de5200; border-color: #cf4d00; color: #fff; -} - -.btn.btn-error:active, +}.btn.btn-error:active, .btn.btn-error.active { background: #c44900; border-color: #b54300; color: #fff; -} - -.btn.btn-error.loading::after { +}.btn.btn-error.loading::after { border-bottom-color: #fff; border-left-color: #fff; -} - -.btn.btn-link { +}.btn.btn-link { background: transparent; border-color: transparent; color: #5755d9; -} - -.btn.btn-link:focus, +}.btn.btn-link:focus, .btn.btn-link:hover, .btn.btn-link:active, .btn.btn-link.active { color: #302ecd; -} - -.btn.btn-sm { +}.btn.btn-sm { font-size: .7rem; height: 1.4rem; padding: .05rem .3rem; -} - -.btn.btn-lg { +}.btn.btn-lg { font-size: .9rem; height: 2rem; padding: .35rem .6rem; -} - -.btn.btn-block { +}.btn.btn-block { display: block; width: 100%; -} - -.btn.btn-action { +}.btn.btn-action { padding-left: 0; - padding-right: 0; + padding-right: 0; width: 1.8rem; -} - -.btn.btn-action.btn-sm { +}.btn.btn-action.btn-sm { width: 1.4rem; -} - -.btn.btn-action.btn-lg { +}.btn.btn-action.btn-lg { width: 2rem; -} - -.btn.btn-clear { +}.btn.btn-clear { background: transparent; border: 0; color: currentColor; @@ -748,94 +467,60 @@ html:lang(ko), padding: .1rem; text-decoration: none; width: 1rem; -} - -.btn.btn-clear:focus, +}.btn.btn-clear:focus, .btn.btn-clear:hover { - background: rgba(247, 248, 249, .5); + background: rgba(247,248,249,.5); opacity: .95; -} - -.btn.btn-clear::before { - content: "\2715"; -} - -.btn-group { +}.btn.btn-clear::before { + content: "✕"; +}.btn-group { display: -ms-inline-flexbox; display: inline-flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -} - -.btn-group .btn { +}.btn-group .btn { -ms-flex: 1 0 auto; flex: 1 0 auto; -} - -.btn-group .btn:first-child:not(:last-child) { +}.btn-group .btn:first-child:not(:last-child) { border-bottom-right-radius: 0; border-top-right-radius: 0; -} - -.btn-group .btn:not(:first-child):not(:last-child) { +}.btn-group .btn:not(:first-child):not(:last-child) { border-radius: 0; margin-left: -.05rem; -} - -.btn-group .btn:last-child:not(:first-child) { +}.btn-group .btn:last-child:not(:first-child) { border-bottom-left-radius: 0; border-top-left-radius: 0; margin-left: -.05rem; -} - -.btn-group .btn:focus, +}.btn-group .btn:focus, .btn-group .btn:hover, .btn-group .btn:active, .btn-group .btn.active { z-index: 1; -} - -.btn-group.btn-group-block { +}.btn-group.btn-group-block { display: -ms-flexbox; display: flex; -} - -.btn-group.btn-group-block .btn { +}.btn-group.btn-group-block .btn { -ms-flex: 1 0 0; flex: 1 0 0; -} - -.form-group:not(:last-child) { +}.form-group:not(:last-child) { margin-bottom: .4rem; -} - -fieldset { +}fieldset { margin-bottom: .8rem; -} - -legend { +}legend { font-size: .9rem; font-weight: 500; margin-bottom: .8rem; -} - -.form-label { +}.form-label { display: block; line-height: 1.2rem; padding: .3rem 0; -} - -.form-label.label-sm { +}.form-label.label-sm { font-size: .7rem; padding: .1rem 0; -} - -.form-label.label-lg { +}.form-label.label-lg { font-size: .9rem; padding: .4rem 0; -} - -.form-input { +}.form-input { -webkit-appearance: none; -moz-appearance: none; appearance: none; @@ -852,76 +537,50 @@ legend { outline: none; padding: .25rem .4rem; position: relative; - transition: background .2s, border .2s, box-shadow .2s, color .2s; + transition: background .2s,border .2s,box-shadow .2s,color .2s; width: 100%; -} - -.form-input:focus { - border-color: #5755d9; - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.form-input:-ms-input-placeholder { +}.form-input:focus { + border-color: #5755d9; + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.form-input:-ms-input-placeholder { color: #bcc3ce; -} - -.form-input::-ms-input-placeholder { +}.form-input::-ms-input-placeholder { color: #bcc3ce; -} - -.form-input::placeholder { +}.form-input::placeholder { color: #bcc3ce; -} - -.form-input.input-sm { +}.form-input.input-sm { font-size: .7rem; height: 1.4rem; padding: .05rem .3rem; -} - -.form-input.input-lg { +}.form-input.input-lg { font-size: .9rem; height: 2rem; padding: .35rem .6rem; -} - -.form-input.input-inline { +}.form-input.input-inline { display: inline-block; vertical-align: middle; width: auto; -} - -.form-input[type="file"] { +}.form-input[type=file] { height: auto; -} - -textarea.form-input, +}textarea.form-input, textarea.form-input.input-lg, textarea.form-input.input-sm { height: auto; -} - -.form-input-hint { +}.form-input-hint { color: #bcc3ce; font-size: .7rem; margin-top: .2rem; -} - -.has-success .form-input-hint, +}.has-success .form-input-hint, .is-success + .form-input-hint { color: #32b643; -} - -.has-error .form-input-hint, +}.has-error .form-input-hint, .is-error + .form-input-hint { color: #e85600; -} - -.form-select { +}.form-select { -webkit-appearance: none; -moz-appearance: none; appearance: none; - background: #fff; + background: #fff; border: .05rem solid #bcc3ce; border-radius: .1rem; color: inherit; @@ -932,51 +591,33 @@ textarea.form-input.input-sm { padding: .25rem .4rem; vertical-align: middle; width: 100%; -} - -.form-select:focus { - border-color: #5755d9; - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.form-select::-ms-expand { +}.form-select:focus { + border-color: #5755d9; + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.form-select::-ms-expand { display: none; -} - -.form-select.select-sm { +}.form-select.select-sm { font-size: .7rem; height: 1.4rem; padding: .05rem 1.1rem .05rem .3rem; -} - -.form-select.select-lg { +}.form-select.select-lg { font-size: .9rem; height: 2rem; padding: .35rem 1.4rem .35rem .6rem; -} - -.form-select[size], +}.form-select[size], .form-select[multiple] { height: auto; padding: .25rem .4rem; -} - -.form-select[size] option, +}.form-select[size] option, .form-select[multiple] option { padding: .1rem .2rem; -} - -.form-select:not([multiple]):not([size]) { +}.form-select:not([multiple]):not([size]) { background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center/.4rem .5rem; padding-right: 1.2rem; -} - -.has-icon-left, +}.has-icon-left, .has-icon-right { position: relative; -} - -.has-icon-left .form-icon, +}.has-icon-left .form-icon, .has-icon-right .form-icon { height: .8rem; margin: 0 .25rem; @@ -985,25 +626,15 @@ textarea.form-input.input-sm { transform: translateY(-50%); width: .8rem; z-index: 2; -} - -.has-icon-left .form-icon { +}.has-icon-left .form-icon { left: .05rem; -} - -.has-icon-left .form-input { +}.has-icon-left .form-input { padding-left: 1.3rem; -} - -.has-icon-right .form-icon { +}.has-icon-right .form-icon { right: .05rem; -} - -.has-icon-right .form-input { +}.has-icon-right .form-input { padding-right: 1.3rem; -} - -.form-checkbox, +}.form-checkbox, .form-radio, .form-switch { display: block; @@ -1012,9 +643,7 @@ textarea.form-input.input-sm { min-height: 1.4rem; padding: .1rem .4rem .1rem 1.2rem; position: relative; -} - -.form-checkbox input, +}.form-checkbox input, .form-radio input, .form-switch input { clip: rect(0, 0, 0, 0); @@ -1023,65 +652,47 @@ textarea.form-input.input-sm { overflow: hidden; position: absolute; width: 1px; -} - -.form-checkbox input:focus + .form-icon, +}.form-checkbox input:focus + .form-icon, .form-radio input:focus + .form-icon, .form-switch input:focus + .form-icon { - border-color: #5755d9; - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.form-checkbox input:checked + .form-icon, + border-color: #5755d9; + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.form-checkbox input:checked + .form-icon, .form-radio input:checked + .form-icon, .form-switch input:checked + .form-icon { background: #5755d9; border-color: #5755d9; -} - -.form-checkbox .form-icon, +}.form-checkbox .form-icon, .form-radio .form-icon, .form-switch .form-icon { border: .05rem solid #bcc3ce; cursor: pointer; display: inline-block; position: absolute; - transition: background .2s, border .2s, box-shadow .2s, color .2s; -} - -.form-checkbox.input-sm, + transition: background .2s,border .2s,box-shadow .2s,color .2s; +}.form-checkbox.input-sm, .form-radio.input-sm, .form-switch.input-sm { font-size: .7rem; margin: 0; -} - -.form-checkbox.input-lg, +}.form-checkbox.input-lg, .form-radio.input-lg, .form-switch.input-lg { font-size: .9rem; margin: .3rem 0; -} - -.form-checkbox .form-icon, +}.form-checkbox .form-icon, .form-radio .form-icon { background: #fff; height: .8rem; left: 0; top: .3rem; width: .8rem; -} - -.form-checkbox input:active + .form-icon, +}.form-checkbox input:active + .form-icon, .form-radio input:active + .form-icon { background: #eef0f3; -} - -.form-checkbox .form-icon { +}.form-checkbox .form-icon { border-radius: .1rem; -} - -.form-checkbox input:checked + .form-icon::before { +}.form-checkbox input:checked + .form-icon::before { background-clip: padding-box; border: .1rem solid #fff; border-left-width: 0; @@ -1095,14 +706,10 @@ textarea.form-input.input-sm { top: 50%; transform: rotate(45deg); width: 6px; -} - -.form-checkbox input:indeterminate + .form-icon { +}.form-checkbox input:indeterminate + .form-icon { background: #5755d9; border-color: #5755d9; -} - -.form-checkbox input:indeterminate + .form-icon::before { +}.form-checkbox input:indeterminate + .form-icon::before { background: #fff; content: ""; height: 2px; @@ -1112,13 +719,9 @@ textarea.form-input.input-sm { position: absolute; top: 50%; width: 10px; -} - -.form-radio .form-icon { +}.form-radio .form-icon { border-radius: 50%; -} - -.form-radio input:checked + .form-icon::before { +}.form-radio input:checked + .form-icon::before { background: #fff; border-radius: 50%; content: ""; @@ -1128,13 +731,9 @@ textarea.form-input.input-sm { top: 50%; transform: translate(-50%, -50%); width: 6px; -} - -.form-switch { +}.form-switch { padding-left: 2rem; -} - -.form-switch .form-icon { +}.form-switch .form-icon { background: #bcc3ce; background-clip: padding-box; border-radius: .45rem; @@ -1142,9 +741,7 @@ textarea.form-input.input-sm { left: 0; top: .25rem; width: 1.6rem; -} - -.form-switch .form-icon::before { +}.form-switch .form-icon::before { background: #fff; border-radius: 50%; content: ""; @@ -1153,134 +750,94 @@ textarea.form-input.input-sm { left: 0; position: absolute; top: 0; - transition: background .2s, border .2s, box-shadow .2s, color .2s, left .2s; + transition: background .2s,border .2s,box-shadow .2s,color .2s,left .2s; width: .8rem; -} - -.form-switch input:checked + .form-icon::before { +}.form-switch input:checked + .form-icon::before { left: 14px; -} - -.form-switch input:active + .form-icon::before { +}.form-switch input:active + .form-icon::before { background: #f7f8f9; -} - -.input-group { +}.input-group { display: -ms-flexbox; display: flex; -} - -.input-group .input-group-addon { +}.input-group .input-group-addon { background: #f7f8f9; border: .05rem solid #bcc3ce; border-radius: .1rem; line-height: 1.2rem; padding: .25rem .4rem; white-space: nowrap; -} - -.input-group .input-group-addon.addon-sm { +}.input-group .input-group-addon.addon-sm { font-size: .7rem; padding: .05rem .3rem; -} - -.input-group .input-group-addon.addon-lg { +}.input-group .input-group-addon.addon-lg { font-size: .9rem; padding: .35rem .6rem; -} - -.input-group .form-input, +}.input-group .form-input, .input-group .form-select { -ms-flex: 1 1 auto; flex: 1 1 auto; width: 1%; -} - -.input-group .input-group-btn { +}.input-group .input-group-btn { z-index: 1; -} - -.input-group .form-input:first-child:not(:last-child), +}.input-group .form-input:first-child:not(:last-child), .input-group .form-select:first-child:not(:last-child), .input-group .input-group-addon:first-child:not(:last-child), .input-group .input-group-btn:first-child:not(:last-child) { border-bottom-right-radius: 0; border-top-right-radius: 0; -} - -.input-group .form-input:not(:first-child):not(:last-child), +}.input-group .form-input:not(:first-child):not(:last-child), .input-group .form-select:not(:first-child):not(:last-child), .input-group .input-group-addon:not(:first-child):not(:last-child), .input-group .input-group-btn:not(:first-child):not(:last-child) { border-radius: 0; margin-left: -.05rem; -} - -.input-group .form-input:last-child:not(:first-child), +}.input-group .form-input:last-child:not(:first-child), .input-group .form-select:last-child:not(:first-child), .input-group .input-group-addon:last-child:not(:first-child), .input-group .input-group-btn:last-child:not(:first-child) { border-bottom-left-radius: 0; border-top-left-radius: 0; margin-left: -.05rem; -} - -.input-group .form-input:focus, +}.input-group .form-input:focus, .input-group .form-select:focus, .input-group .input-group-addon:focus, .input-group .input-group-btn:focus { z-index: 2; -} - -.input-group .form-select { +}.input-group .form-select { width: auto; -} - -.input-group.input-inline { +}.input-group.input-inline { display: -ms-inline-flexbox; display: inline-flex; -} - -.has-success .form-input, +}.has-success .form-input, .form-input.is-success, .has-success .form-select, .form-select.is-success { background: #f9fdfa; border-color: #32b643; -} - -.has-success .form-input:focus, +}.has-success .form-input:focus, .form-input.is-success:focus, .has-success .form-select:focus, .form-select.is-success:focus { - box-shadow: 0 0 0 .1rem rgba(50, 182, 67, .2); -} - -.has-error .form-input, + box-shadow: 0 0 0 .1rem rgba(50,182,67,.2); +}.has-error .form-input, .form-input.is-error, .has-error .form-select, .form-select.is-error { background: #fffaf7; border-color: #e85600; -} - -.has-error .form-input:focus, +}.has-error .form-input:focus, .form-input.is-error:focus, .has-error .form-select:focus, .form-select.is-error:focus { - box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2); -} - -.has-error .form-checkbox .form-icon, + box-shadow: 0 0 0 .1rem rgba(232,86,0,.2); +}.has-error .form-checkbox .form-icon, .form-checkbox.is-error .form-icon, .has-error .form-radio .form-icon, .form-radio.is-error .form-icon, .has-error .form-switch .form-icon, .form-switch.is-error .form-icon { border-color: #e85600; -} - -.has-error .form-checkbox input:checked + .form-icon, +}.has-error .form-checkbox input:checked + .form-icon, .form-checkbox.is-error input:checked + .form-icon, .has-error .form-radio input:checked + .form-icon, .form-radio.is-error input:checked + .form-icon, @@ -1288,155 +845,103 @@ textarea.form-input.input-sm { .form-switch.is-error input:checked + .form-icon { background: #e85600; border-color: #e85600; -} - -.has-error .form-checkbox input:focus + .form-icon, +}.has-error .form-checkbox input:focus + .form-icon, .form-checkbox.is-error input:focus + .form-icon, .has-error .form-radio input:focus + .form-icon, .form-radio.is-error input:focus + .form-icon, .has-error .form-switch input:focus + .form-icon, .form-switch.is-error input:focus + .form-icon { - border-color: #e85600; - box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2); -} - -.has-error .form-checkbox input:indeterminate + .form-icon, + border-color: #e85600; + box-shadow: 0 0 0 .1rem rgba(232,86,0,.2); +}.has-error .form-checkbox input:indeterminate + .form-icon, .form-checkbox.is-error input:indeterminate + .form-icon { background: #e85600; border-color: #e85600; -} - -.form-input:not(:-ms-input-placeholder):invalid { +}.form-input:not(:-ms-input-placeholder):invalid { border-color: #e85600; -} - -.form-input:not(:placeholder-shown):invalid { +}.form-input:not(:placeholder-shown):invalid { border-color: #e85600; -} - -.form-input:not(:-ms-input-placeholder):invalid:focus { - background: #fffaf7; - box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2); -} - -.form-input:not(:placeholder-shown):invalid:focus { - background: #fffaf7; - box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2); -} - -.form-input:not(:-ms-input-placeholder):invalid + .form-input-hint { +}.form-input:not(:-ms-input-placeholder):invalid:focus { + background: #fffaf7; + box-shadow: 0 0 0 .1rem rgba(232,86,0,.2); +}.form-input:not(:placeholder-shown):invalid:focus { + background: #fffaf7; + box-shadow: 0 0 0 .1rem rgba(232,86,0,.2); +}.form-input:not(:-ms-input-placeholder):invalid + .form-input-hint { color: #e85600; -} - -.form-input:not(:placeholder-shown):invalid + .form-input-hint { +}.form-input:not(:placeholder-shown):invalid + .form-input-hint { color: #e85600; -} - -.form-input:disabled, +}.form-input:disabled, .form-input.disabled, .form-select:disabled, .form-select.disabled { background-color: #eef0f3; cursor: not-allowed; opacity: .5; -} - -.form-input[readonly] { +}.form-input[readonly] { background-color: #f7f8f9; -} - -input:disabled + .form-icon, +}input:disabled + .form-icon, input.disabled + .form-icon { background: #eef0f3; cursor: not-allowed; opacity: .5; -} - -.form-switch input:disabled + .form-icon::before, +}.form-switch input:disabled + .form-icon::before, .form-switch input.disabled + .form-icon::before { background: #fff; -} - -.form-horizontal { +}.form-horizontal { padding: .4rem 0; -} - -.form-horizontal .form-group { +}.form-horizontal .form-group { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -} - -.form-inline { +}.form-inline { display: inline-block; -} - -.label { +}.label { background: #eef0f3; border-radius: .1rem; color: #455060; - display: inline-block; + display: inline-block; line-height: 1.25; padding: .1rem .2rem; -} - -.label.label-rounded { +}.label.label-rounded { border-radius: 5rem; padding-left: .4rem; padding-right: .4rem; -} - -.label.label-primary { +}.label.label-primary { background: #5755d9; color: #fff; -} - -.label.label-secondary { +}.label.label-secondary { background: #f1f1fc; color: #5755d9; -} - -.label.label-success { +}.label.label-success { background: #32b643; color: #fff; -} - -.label.label-warning { +}.label.label-warning { background: #ffb700; color: #fff; -} - -.label.label-error { +}.label.label-error { background: #e85600; color: #fff; -} - -code { +}code { background: #fcf2f2; border-radius: .1rem; color: #d73e48; - font-size: 85%; + font-size: 85%; line-height: 1.25; padding: .1rem .2rem; -} - -.code { +}.code { border-radius: .1rem; color: #3b4351; position: relative; -} - -.code::before { +}.code::before { color: #bcc3ce; content: attr(data-lang); font-size: .7rem; position: absolute; right: .4rem; top: .1rem; -} - -.code code { +}.code code { background: #f7f8f9; color: inherit; display: block; @@ -1444,37 +949,25 @@ code { overflow-x: auto; padding: 1rem; width: 100%; -} - -.img-responsive { +}.img-responsive { display: block; height: auto; max-width: 100%; -} - -.img-fit-cover { +}.img-fit-cover { object-fit: cover; -} - -.img-fit-contain { +}.img-fit-contain { object-fit: contain; -} - -.video-responsive { +}.video-responsive { display: block; overflow: hidden; padding: 0; position: relative; width: 100%; -} - -.video-responsive::before { +}.video-responsive::before { content: ""; display: block; padding-bottom: 56.25%; -} - -.video-responsive iframe, +}.video-responsive iframe, .video-responsive object, .video-responsive embed { border: 0; @@ -1485,71 +978,43 @@ code { right: 0; top: 0; width: 100%; -} - -video.video-responsive { +}video.video-responsive { height: auto; max-width: 100%; -} - -video.video-responsive::before { +}video.video-responsive::before { content: none; -} - -.video-responsive-4-3::before { +}.video-responsive-4-3::before { padding-bottom: 75%; -} - -.video-responsive-1-1::before { +}.video-responsive-1-1::before { padding-bottom: 100%; -} - -.figure { +}.figure { margin: 0 0 .4rem 0; -} - -.figure .figure-caption { +}.figure .figure-caption { color: #66758c; margin-top: .4rem; -} - -.container { +}.container { margin-left: auto; margin-right: auto; padding-left: .4rem; padding-right: .4rem; width: 100%; -} - -.container.grid-xl { +}.container.grid-xl { max-width: 1296px; -} - -.container.grid-lg { +}.container.grid-lg { max-width: 976px; -} - -.container.grid-md { +}.container.grid-md { max-width: 856px; -} - -.container.grid-sm { +}.container.grid-sm { max-width: 616px; -} - -.container.grid-xs { +}.container.grid-xs { max-width: 496px; -} - -.show-xs, +}.show-xs, .show-sm, .show-md, .show-lg, .show-xl { display: none !important; -} - -.cols, +}.cols, .columns { display: -ms-flexbox; display: flex; @@ -1557,49 +1022,39 @@ video.video-responsive::before { flex-wrap: wrap; margin-left: -.4rem; margin-right: -.4rem; -} - -.cols.col-gapless, +}.cols.col-gapless, .columns.col-gapless { margin-left: 0; margin-right: 0; -} - -.cols.col-gapless > .column, +}.cols.col-gapless > .column, .columns.col-gapless > .column { padding-left: 0; padding-right: 0; -} - -.cols.col-oneline, +}.cols.col-oneline, .columns.col-oneline { -ms-flex-wrap: nowrap; flex-wrap: nowrap; overflow-x: auto; -} - -[class~="col-"], +}[class~=col-], .column { -ms-flex: 1; flex: 1; max-width: 100%; padding-left: .4rem; padding-right: .4rem; -} - -[class~="col-"].col-12, -[class~="col-"].col-11, -[class~="col-"].col-10, -[class~="col-"].col-9, -[class~="col-"].col-8, -[class~="col-"].col-7, -[class~="col-"].col-6, -[class~="col-"].col-5, -[class~="col-"].col-4, -[class~="col-"].col-3, -[class~="col-"].col-2, -[class~="col-"].col-1, -[class~="col-"].col-auto, +}[class~=col-].col-12, +[class~=col-].col-11, +[class~=col-].col-10, +[class~=col-].col-9, +[class~=col-].col-8, +[class~=col-].col-7, +[class~=col-].col-6, +[class~=col-].col-5, +[class~=col-].col-4, +[class~=col-].col-3, +[class~=col-].col-2, +[class~=col-].col-1, +[class~=col-].col-auto, .column.col-12, .column.col-11, .column.col-10, @@ -1615,77 +1070,43 @@ video.video-responsive::before { .column.col-auto { -ms-flex: none; flex: none; -} - -.col-12 { +}.col-12 { width: 100%; -} - -.col-11 { +}.col-11 { width: 91.66666667%; -} - -.col-10 { +}.col-10 { width: 83.33333333%; -} - -.col-9 { +}.col-9 { width: 75%; -} - -.col-8 { +}.col-8 { width: 66.66666667%; -} - -.col-7 { +}.col-7 { width: 58.33333333%; -} - -.col-6 { +}.col-6 { width: 50%; -} - -.col-5 { +}.col-5 { width: 41.66666667%; -} - -.col-4 { +}.col-4 { width: 33.33333333%; -} - -.col-3 { +}.col-3 { width: 25%; -} - -.col-2 { +}.col-2 { width: 16.66666667%; -} - -.col-1 { +}.col-1 { width: 8.33333333%; -} - -.col-auto { +}.col-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; max-width: none; width: auto; -} - -.col-mx-auto { +}.col-mx-auto { margin-left: auto; margin-right: auto; -} - -.col-ml-auto { +}.col-ml-auto { margin-left: auto; -} - -.col-mr-auto { +}.col-mr-auto { margin-right: auto; -} - -@media (max-width: 1280px) { +}@media(max-width: 1280px) { .col-xl-12, .col-xl-11, .col-xl-10, @@ -1701,55 +1122,38 @@ video.video-responsive::before { .col-xl-auto { -ms-flex: none; flex: none; - } - .col-xl-12 { + }.col-xl-12 { width: 100%; - } - .col-xl-11 { + }.col-xl-11 { width: 91.66666667%; - } - .col-xl-10 { + }.col-xl-10 { width: 83.33333333%; - } - .col-xl-9 { + }.col-xl-9 { width: 75%; - } - .col-xl-8 { + }.col-xl-8 { width: 66.66666667%; - } - .col-xl-7 { + }.col-xl-7 { width: 58.33333333%; - } - .col-xl-6 { + }.col-xl-6 { width: 50%; - } - .col-xl-5 { + }.col-xl-5 { width: 41.66666667%; - } - .col-xl-4 { + }.col-xl-4 { width: 33.33333333%; - } - .col-xl-3 { + }.col-xl-3 { width: 25%; - } - .col-xl-2 { + }.col-xl-2 { width: 16.66666667%; - } - .col-xl-1 { + }.col-xl-1 { width: 8.33333333%; - } - .col-xl-auto { + }.col-xl-auto { width: auto; - } - .hide-xl { + }.hide-xl { display: none !important; - } - .show-xl { + }.show-xl { display: block !important; } -} - -@media (max-width: 960px) { +}@media(max-width: 960px) { .col-lg-12, .col-lg-11, .col-lg-10, @@ -1765,55 +1169,38 @@ video.video-responsive::before { .col-lg-auto { -ms-flex: none; flex: none; - } - .col-lg-12 { + }.col-lg-12 { width: 100%; - } - .col-lg-11 { + }.col-lg-11 { width: 91.66666667%; - } - .col-lg-10 { + }.col-lg-10 { width: 83.33333333%; - } - .col-lg-9 { + }.col-lg-9 { width: 75%; - } - .col-lg-8 { + }.col-lg-8 { width: 66.66666667%; - } - .col-lg-7 { + }.col-lg-7 { width: 58.33333333%; - } - .col-lg-6 { + }.col-lg-6 { width: 50%; - } - .col-lg-5 { + }.col-lg-5 { width: 41.66666667%; - } - .col-lg-4 { + }.col-lg-4 { width: 33.33333333%; - } - .col-lg-3 { + }.col-lg-3 { width: 25%; - } - .col-lg-2 { + }.col-lg-2 { width: 16.66666667%; - } - .col-lg-1 { + }.col-lg-1 { width: 8.33333333%; - } - .col-lg-auto { + }.col-lg-auto { width: auto; - } - .hide-lg { + }.hide-lg { display: none !important; - } - .show-lg { + }.show-lg { display: block !important; } -} - -@media (max-width: 840px) { +}@media(max-width: 840px) { .col-md-12, .col-md-11, .col-md-10, @@ -1829,55 +1216,38 @@ video.video-responsive::before { .col-md-auto { -ms-flex: none; flex: none; - } - .col-md-12 { + }.col-md-12 { width: 100%; - } - .col-md-11 { + }.col-md-11 { width: 91.66666667%; - } - .col-md-10 { + }.col-md-10 { width: 83.33333333%; - } - .col-md-9 { + }.col-md-9 { width: 75%; - } - .col-md-8 { + }.col-md-8 { width: 66.66666667%; - } - .col-md-7 { + }.col-md-7 { width: 58.33333333%; - } - .col-md-6 { + }.col-md-6 { width: 50%; - } - .col-md-5 { + }.col-md-5 { width: 41.66666667%; - } - .col-md-4 { + }.col-md-4 { width: 33.33333333%; - } - .col-md-3 { + }.col-md-3 { width: 25%; - } - .col-md-2 { + }.col-md-2 { width: 16.66666667%; - } - .col-md-1 { + }.col-md-1 { width: 8.33333333%; - } - .col-md-auto { + }.col-md-auto { width: auto; - } - .hide-md { + }.hide-md { display: none !important; - } - .show-md { + }.show-md { display: block !important; } -} - -@media (max-width: 600px) { +}@media(max-width: 600px) { .col-sm-12, .col-sm-11, .col-sm-10, @@ -1893,55 +1263,38 @@ video.video-responsive::before { .col-sm-auto { -ms-flex: none; flex: none; - } - .col-sm-12 { + }.col-sm-12 { width: 100%; - } - .col-sm-11 { + }.col-sm-11 { width: 91.66666667%; - } - .col-sm-10 { + }.col-sm-10 { width: 83.33333333%; - } - .col-sm-9 { + }.col-sm-9 { width: 75%; - } - .col-sm-8 { + }.col-sm-8 { width: 66.66666667%; - } - .col-sm-7 { + }.col-sm-7 { width: 58.33333333%; - } - .col-sm-6 { + }.col-sm-6 { width: 50%; - } - .col-sm-5 { + }.col-sm-5 { width: 41.66666667%; - } - .col-sm-4 { + }.col-sm-4 { width: 33.33333333%; - } - .col-sm-3 { + }.col-sm-3 { width: 25%; - } - .col-sm-2 { + }.col-sm-2 { width: 16.66666667%; - } - .col-sm-1 { + }.col-sm-1 { width: 8.33333333%; - } - .col-sm-auto { + }.col-sm-auto { width: auto; - } - .hide-sm { + }.hide-sm { display: none !important; - } - .show-sm { + }.show-sm { display: block !important; } -} - -@media (max-width: 480px) { +}@media(max-width: 480px) { .col-xs-12, .col-xs-11, .col-xs-10, @@ -1957,55 +1310,38 @@ video.video-responsive::before { .col-xs-auto { -ms-flex: none; flex: none; - } - .col-xs-12 { + }.col-xs-12 { width: 100%; - } - .col-xs-11 { + }.col-xs-11 { width: 91.66666667%; - } - .col-xs-10 { + }.col-xs-10 { width: 83.33333333%; - } - .col-xs-9 { + }.col-xs-9 { width: 75%; - } - .col-xs-8 { + }.col-xs-8 { width: 66.66666667%; - } - .col-xs-7 { + }.col-xs-7 { width: 58.33333333%; - } - .col-xs-6 { + }.col-xs-6 { width: 50%; - } - .col-xs-5 { + }.col-xs-5 { width: 41.66666667%; - } - .col-xs-4 { + }.col-xs-4 { width: 33.33333333%; - } - .col-xs-3 { + }.col-xs-3 { width: 25%; - } - .col-xs-2 { + }.col-xs-2 { width: 16.66666667%; - } - .col-xs-1 { + }.col-xs-1 { width: 8.33333333%; - } - .col-xs-auto { + }.col-xs-auto { width: auto; - } - .hide-xs { + }.hide-xs { display: none !important; - } - .show-xs { + }.show-xs { display: block !important; } -} - -.hero { +}.hero { display: -ms-flexbox; display: flex; -ms-flex-direction: column; @@ -2014,23 +1350,15 @@ video.video-responsive::before { justify-content: space-between; padding-bottom: 4rem; padding-top: 4rem; -} - -.hero.hero-sm { +}.hero.hero-sm { padding-bottom: 2rem; padding-top: 2rem; -} - -.hero.hero-lg { +}.hero.hero-lg { padding-bottom: 8rem; padding-top: 8rem; -} - -.hero .hero-body { +}.hero .hero-body { padding: .4rem; -} - -.navbar { +}.navbar { align-items: stretch; display: -ms-flexbox; display: flex; @@ -2039,70 +1367,48 @@ video.video-responsive::before { -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; -} - -.navbar .navbar-section { +}.navbar .navbar-section { align-items: center; display: -ms-flexbox; display: flex; -ms-flex: 1 0 0; - flex: 1 0 0; + flex: 1 0 0; -ms-flex-align: center; -} - -.navbar .navbar-section:not(:first-child):last-child { +}.navbar .navbar-section:not(:first-child):last-child { -ms-flex-pack: end; justify-content: flex-end; -} - -.navbar .navbar-center { +}.navbar .navbar-center { align-items: center; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; - flex: 0 0 auto; + flex: 0 0 auto; -ms-flex-align: center; -} - -.navbar .navbar-brand { +}.navbar .navbar-brand { font-size: .9rem; text-decoration: none; -} - -.accordion input:checked ~ .accordion-header > .icon:first-child, +}.accordion input:checked ~ .accordion-header > .icon:first-child, .accordion[open] .accordion-header > .icon:first-child { transform: rotate(90deg); -} - -.accordion input:checked ~ .accordion-body, +}.accordion input:checked ~ .accordion-body, .accordion[open] .accordion-body { max-height: 50rem; -} - -.accordion .accordion-header { +}.accordion .accordion-header { display: block; padding: .2rem .4rem; -} - -.accordion .accordion-header .icon { +}.accordion .accordion-header .icon { transition: transform .25s; -} - -.accordion .accordion-body { +}.accordion .accordion-body { margin-bottom: .4rem; max-height: 0; overflow: hidden; transition: max-height .25s; -} - -summary.accordion-header::-webkit-details-marker { +}summary.accordion-header::-webkit-details-marker { display: none; -} - -.avatar { +}.avatar { background: #5755d9; border-radius: 50%; - color: rgba(255, 255, 255, .85); + color: rgba(255,255,255,.85); display: inline-block; font-size: .8rem; font-weight: 300; @@ -2110,43 +1416,31 @@ summary.accordion-header::-webkit-details-marker { line-height: 1.25; margin: 0; position: relative; - vertical-align: middle; + vertical-align: middle; width: 1.6rem; -} - -.avatar.avatar-xs { +}.avatar.avatar-xs { font-size: .4rem; height: .8rem; width: .8rem; -} - -.avatar.avatar-sm { +}.avatar.avatar-sm { font-size: .6rem; height: 1.2rem; width: 1.2rem; -} - -.avatar.avatar-lg { +}.avatar.avatar-lg { font-size: 1.2rem; height: 2.4rem; width: 2.4rem; -} - -.avatar.avatar-xl { +}.avatar.avatar-xl { font-size: 1.6rem; height: 3.2rem; width: 3.2rem; -} - -.avatar img { +}.avatar img { border-radius: 50%; height: 100%; position: relative; width: 100%; z-index: 1; -} - -.avatar .avatar-icon, +}.avatar .avatar-icon, .avatar .avatar-presence { background: #fff; bottom: 14.64%; @@ -2157,29 +1451,19 @@ summary.accordion-header::-webkit-details-marker { transform: translate(50%, 50%); width: 50%; z-index: 2; -} - -.avatar .avatar-presence { +}.avatar .avatar-presence { background: #bcc3ce; border-radius: 50%; box-shadow: 0 0 0 .1rem #fff; height: .5em; width: .5em; -} - -.avatar .avatar-presence.online { +}.avatar .avatar-presence.online { background: #32b643; -} - -.avatar .avatar-presence.busy { +}.avatar .avatar-presence.busy { background: #e85600; -} - -.avatar .avatar-presence.away { +}.avatar .avatar-presence.away { background: #ffb700; -} - -.avatar[data-initial]::before { +}.avatar[data-initial]::before { color: currentColor; content: attr(data-initial); left: 50%; @@ -2187,14 +1471,10 @@ summary.accordion-header::-webkit-details-marker { top: 50%; transform: translate(-50%, -50%); z-index: 1; -} - -.badge { +}.badge { position: relative; white-space: nowrap; -} - -.badge[data-badge]::after, +}.badge[data-badge]::after, .badge:not([data-badge])::after { background: #5755d9; background-clip: padding-box; @@ -2204,9 +1484,7 @@ summary.accordion-header::-webkit-details-marker { content: attr(data-badge); display: inline-block; transform: translate(-.05rem, -.5rem); -} - -.badge[data-badge]::after { +}.badge[data-badge]::after { font-size: .7rem; height: .9rem; line-height: 1; @@ -2214,59 +1492,41 @@ summary.accordion-header::-webkit-details-marker { padding: .1rem .2rem; text-align: center; white-space: nowrap; -} - -.badge:not([data-badge])::after, +}.badge:not([data-badge])::after, .badge[data-badge=""]::after { height: 6px; min-width: 6px; padding: 0; width: 6px; -} - -.badge.btn::after { +}.badge.btn::after { position: absolute; right: 0; top: 0; transform: translate(50%, -50%); -} - -.badge.avatar::after { +}.badge.avatar::after { position: absolute; right: 14.64%; top: 14.64%; transform: translate(50%, -50%); z-index: 100; -} - -.breadcrumb { +}.breadcrumb { list-style: none; margin: .2rem 0; padding: .2rem 0; -} - -.breadcrumb .breadcrumb-item { +}.breadcrumb .breadcrumb-item { color: #66758c; display: inline-block; margin: 0; padding: .2rem 0; -} - -.breadcrumb .breadcrumb-item:not(:last-child) { +}.breadcrumb .breadcrumb-item:not(:last-child) { margin-right: .2rem; -} - -.breadcrumb .breadcrumb-item:not(:last-child) a { +}.breadcrumb .breadcrumb-item:not(:last-child) a { color: #66758c; -} - -.breadcrumb .breadcrumb-item:not(:first-child)::before { +}.breadcrumb .breadcrumb-item:not(:first-child)::before { color: #66758c; content: "/"; padding-right: .4rem; -} - -.bar { +}.bar { background: #eef0f3; border-radius: .1rem; display: -ms-flexbox; @@ -2275,13 +1535,9 @@ summary.accordion-header::-webkit-details-marker { flex-wrap: nowrap; height: .8rem; width: 100%; -} - -.bar.bar-sm { +}.bar.bar-sm { height: .2rem; -} - -.bar .bar-item { +}.bar .bar-item { background: #5755d9; color: #fff; display: block; @@ -2293,38 +1549,26 @@ summary.accordion-header::-webkit-details-marker { position: relative; text-align: center; width: 0; -} - -.bar .bar-item:first-child { +}.bar .bar-item:first-child { border-bottom-left-radius: .1rem; border-top-left-radius: .1rem; -} - -.bar .bar-item:last-child { +}.bar .bar-item:last-child { border-bottom-right-radius: .1rem; border-top-right-radius: .1rem; -ms-flex-negative: 1; flex-shrink: 1; -} - -.bar-slider { +}.bar-slider { height: .1rem; margin: .4rem 0; position: relative; -} - -.bar-slider .bar-item { +}.bar-slider .bar-item { left: 0; padding: 0; position: absolute; -} - -.bar-slider .bar-item:not(:last-child):first-child { +}.bar-slider .bar-item:not(:last-child):first-child { background: #eef0f3; z-index: 1; -} - -.bar-slider .bar-slider-btn { +}.bar-slider .bar-slider-btn { background: #5755d9; border: 0; border-radius: 50%; @@ -2335,13 +1579,9 @@ summary.accordion-header::-webkit-details-marker { top: 50%; transform: translate(50%, -50%); width: .6rem; -} - -.bar-slider .bar-slider-btn:active { +}.bar-slider .bar-slider-btn:active { box-shadow: 0 0 0 .1rem #5755d9; -} - -.card { +}.card { background: #fff; border: .05rem solid #dadee4; border-radius: .1rem; @@ -2349,45 +1589,29 @@ summary.accordion-header::-webkit-details-marker { display: flex; -ms-flex-direction: column; flex-direction: column; -} - -.card .card-header, +}.card .card-header, .card .card-body, .card .card-footer { padding: .8rem; padding-bottom: 0; -} - -.card .card-header:last-child, +}.card .card-header:last-child, .card .card-body:last-child, .card .card-footer:last-child { padding-bottom: .8rem; -} - -.card .card-body { +}.card .card-body { -ms-flex: 1 1 auto; flex: 1 1 auto; -} - -.card .card-image { +}.card .card-image { padding-top: .8rem; -} - -.card .card-image:first-child { +}.card .card-image:first-child { padding-top: 0; -} - -.card .card-image:first-child img { +}.card .card-image:first-child img { border-top-left-radius: .1rem; border-top-right-radius: .1rem; -} - -.card .card-image:last-child img { +}.card .card-image:last-child img { border-bottom-left-radius: .1rem; border-bottom-right-radius: .1rem; -} - -.chip { +}.chip { align-items: center; background: #eef0f3; border-radius: 5rem; @@ -2405,29 +1629,19 @@ summary.accordion-header::-webkit-details-marker { text-overflow: ellipsis; vertical-align: middle; white-space: nowrap; -} - -.chip.active { +}.chip.active { background: #5755d9; color: #fff; -} - -.chip .avatar { +}.chip .avatar { margin-left: -.4rem; margin-right: .2rem; -} - -.chip .btn-clear { +}.chip .btn-clear { border-radius: 50%; transform: scale(.75); -} - -.dropdown { +}.dropdown { display: inline-block; position: relative; -} - -.dropdown .menu { +}.dropdown .menu { animation: slide-down .15s ease 1; display: none; left: 0; @@ -2435,101 +1649,69 @@ summary.accordion-header::-webkit-details-marker { overflow-y: auto; position: absolute; top: 100%; -} - -.dropdown.dropdown-right .menu { +}.dropdown.dropdown-right .menu { left: auto; right: 0; -} - -.dropdown.active .menu, +}.dropdown.active .menu, .dropdown .dropdown-toggle:focus + .menu, .dropdown .menu:hover { display: block; -} - -.dropdown .btn-group .dropdown-toggle:nth-last-child(2) { +}.dropdown .btn-group .dropdown-toggle:nth-last-child(2) { border-bottom-right-radius: .1rem; border-top-right-radius: .1rem; -} - -.empty { +}.empty { background: #f7f8f9; border-radius: .1rem; color: #66758c; - padding: 3.2rem 1.6rem; + padding: 3.2rem 1.6rem; text-align: center; -} - -.empty .empty-icon { +}.empty .empty-icon { margin-bottom: .8rem; -} - -.empty .empty-title, +}.empty .empty-title, .empty .empty-subtitle { margin: .4rem auto; -} - -.empty .empty-action { +}.empty .empty-action { margin-top: .8rem; -} - -.menu { +}.menu { background: #fff; border-radius: .1rem; - box-shadow: 0 .05rem .2rem rgba(48, 55, 66, .3); + box-shadow: 0 .05rem .2rem rgba(48,55,66,.3); list-style: none; margin: 0; min-width: 180px; padding: .4rem; transform: translateY(.2rem); z-index: 300; -} - -.menu.menu-nav { +}.menu.menu-nav { background: transparent; box-shadow: none; -} - -.menu .menu-item { +}.menu .menu-item { margin-top: 0; padding: 0 .4rem; position: relative; text-decoration: none; -} - -.menu .menu-item > a { +}.menu .menu-item > a { border-radius: .1rem; color: inherit; display: block; margin: 0 -.4rem; padding: .2rem .4rem; text-decoration: none; -} - -.menu .menu-item > a:focus, +}.menu .menu-item > a:focus, .menu .menu-item > a:hover { background: #f1f1fc; color: #5755d9; -} - -.menu .menu-item > a:active, +}.menu .menu-item > a:active, .menu .menu-item > a.active { background: #f1f1fc; color: #5755d9; -} - -.menu .menu-item .form-checkbox, +}.menu .menu-item .form-checkbox, .menu .menu-item .form-radio, .menu .menu-item .form-switch { margin: .1rem 0; -} - -.menu .menu-item + .menu-item { +}.menu .menu-item + .menu-item { margin-top: .2rem; -} - -.menu .menu-badge { +}.menu .menu-badge { align-items: center; display: -ms-flexbox; display: flex; @@ -2538,13 +1720,9 @@ summary.accordion-header::-webkit-details-marker { position: absolute; right: 0; top: 0; -} - -.menu .menu-badge .label { +}.menu .menu-badge .label { margin-right: .4rem; -} - -.modal { +}.modal { align-items: center; bottom: 0; display: none; @@ -2558,19 +1736,15 @@ summary.accordion-header::-webkit-details-marker { position: fixed; right: 0; top: 0; -} - -.modal:target, +}.modal:target, .modal.active { display: -ms-flexbox; display: flex; opacity: 1; z-index: 400; -} - -.modal:target .modal-overlay, +}.modal:target .modal-overlay, .modal.active .modal-overlay { - background: rgba(247, 248, 249, .75); + background: rgba(247,248,249,.75); bottom: 0; cursor: default; display: block; @@ -2578,32 +1752,22 @@ summary.accordion-header::-webkit-details-marker { position: absolute; right: 0; top: 0; -} - -.modal:target .modal-container, +}.modal:target .modal-container, .modal.active .modal-container { animation: slide-down .2s ease 1; z-index: 1; -} - -.modal.modal-sm .modal-container { +}.modal.modal-sm .modal-container { max-width: 320px; padding: 0 .4rem; -} - -.modal.modal-lg .modal-overlay { +}.modal.modal-lg .modal-overlay { background: #fff; -} - -.modal.modal-lg .modal-container { +}.modal.modal-lg .modal-container { box-shadow: none; max-width: 960px; -} - -.modal-container { +}.modal-container { background: #fff; border-radius: .1rem; - box-shadow: 0 .2rem .5rem rgba(48, 55, 66, .3); + box-shadow: 0 .2rem .5rem rgba(48,55,66,.3); display: -ms-flexbox; display: flex; -ms-flex-direction: column; @@ -2612,156 +1776,102 @@ summary.accordion-header::-webkit-details-marker { max-width: 640px; padding: 0 .8rem; width: 100%; -} - -.modal-container.modal-fullheight { +}.modal-container.modal-fullheight { max-height: 100vh; -} - -.modal-container .modal-header { +}.modal-container .modal-header { color: #303742; padding: .8rem; -} - -.modal-container .modal-body { +}.modal-container .modal-body { overflow-y: auto; padding: .8rem; position: relative; -} - -.modal-container .modal-footer { +}.modal-container .modal-footer { padding: .8rem; text-align: right; -} - -.nav { +}.nav { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; list-style: none; margin: .2rem 0; -} - -.nav .nav-item a { +}.nav .nav-item a { color: #66758c; padding: .2rem .4rem; text-decoration: none; -} - -.nav .nav-item a:focus, +}.nav .nav-item a:focus, .nav .nav-item a:hover { color: #5755d9; -} - -.nav .nav-item.active > a { +}.nav .nav-item.active > a { color: #505c6e; font-weight: bold; -} - -.nav .nav-item.active > a:focus, +}.nav .nav-item.active > a:focus, .nav .nav-item.active > a:hover { color: #5755d9; -} - -.nav .nav { +}.nav .nav { margin-bottom: .4rem; margin-left: .8rem; -} - -.pagination { +}.pagination { display: -ms-flexbox; display: flex; list-style: none; margin: .2rem 0; padding: .2rem 0; -} - -.pagination .page-item { +}.pagination .page-item { margin: .2rem .05rem; -} - -.pagination .page-item span { +}.pagination .page-item span { display: inline-block; padding: .2rem .2rem; -} - -.pagination .page-item a { +}.pagination .page-item a { border-radius: .1rem; display: inline-block; padding: .2rem .4rem; text-decoration: none; -} - -.pagination .page-item a:focus, +}.pagination .page-item a:focus, .pagination .page-item a:hover { color: #5755d9; -} - -.pagination .page-item.disabled a { +}.pagination .page-item.disabled a { cursor: default; opacity: .5; pointer-events: none; -} - -.pagination .page-item.active a { +}.pagination .page-item.active a { background: #5755d9; color: #fff; -} - -.pagination .page-item.page-prev, +}.pagination .page-item.page-prev, .pagination .page-item.page-next { -ms-flex: 1 0 50%; flex: 1 0 50%; -} - -.pagination .page-item.page-next { +}.pagination .page-item.page-next { text-align: right; -} - -.pagination .page-item .page-item-title { +}.pagination .page-item .page-item-title { margin: 0; -} - -.pagination .page-item .page-item-subtitle { +}.pagination .page-item .page-item-subtitle { margin: 0; opacity: .5; -} - -.panel { +}.panel { border: .05rem solid #dadee4; border-radius: .1rem; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -} - -.panel .panel-header, +}.panel .panel-header, .panel .panel-footer { -ms-flex: 0 0 auto; flex: 0 0 auto; padding: .8rem; -} - -.panel .panel-nav { +}.panel .panel-nav { -ms-flex: 0 0 auto; flex: 0 0 auto; -} - -.panel .panel-body { +}.panel .panel-body { -ms-flex: 1 1 auto; flex: 1 1 auto; overflow-y: auto; padding: 0 .8rem; -} - -.popover { +}.popover { display: inline-block; position: relative; -} - -.popover .popover-container { +}.popover .popover-container { left: 50%; opacity: 0; padding: .4rem; @@ -2771,51 +1881,33 @@ summary.accordion-header::-webkit-details-marker { transition: transform .2s; width: 320px; z-index: 300; -} - -.popover *:focus + .popover-container, +}.popover *:focus + .popover-container, .popover:hover .popover-container { display: block; opacity: 1; transform: translate(-50%, -100%) scale(1); -} - -.popover.popover-right .popover-container { +}.popover.popover-right .popover-container { left: 100%; top: 50%; -} - -.popover.popover-right *:focus + .popover-container, +}.popover.popover-right *:focus + .popover-container, .popover.popover-right:hover .popover-container { transform: translate(0, -50%) scale(1); -} - -.popover.popover-bottom .popover-container { +}.popover.popover-bottom .popover-container { left: 50%; top: 100%; -} - -.popover.popover-bottom *:focus + .popover-container, +}.popover.popover-bottom *:focus + .popover-container, .popover.popover-bottom:hover .popover-container { transform: translate(-50%, 0) scale(1); -} - -.popover.popover-left .popover-container { +}.popover.popover-left .popover-container { left: 0; top: 50%; -} - -.popover.popover-left *:focus + .popover-container, +}.popover.popover-left *:focus + .popover-container, .popover.popover-left:hover .popover-container { transform: translate(-100%, -50%) scale(1); -} - -.popover .card { - border: 0; - box-shadow: 0 .2rem .5rem rgba(48, 55, 66, .3); -} - -.step { +}.popover .card { + border: 0; + box-shadow: 0 .2rem .5rem rgba(48,55,66,.3); +}.step { display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; @@ -2823,18 +1915,14 @@ summary.accordion-header::-webkit-details-marker { list-style: none; margin: .2rem 0; width: 100%; -} - -.step .step-item { +}.step .step-item { -ms-flex: 1 1 0; flex: 1 1 0; margin-top: 0; min-height: 1rem; - position: relative; + position: relative; text-align: center; -} - -.step .step-item:not(:first-child)::before { +}.step .step-item:not(:first-child)::before { background: #5755d9; content: ""; height: 2px; @@ -2842,16 +1930,12 @@ summary.accordion-header::-webkit-details-marker { position: absolute; top: 9px; width: 100%; -} - -.step .step-item a { +}.step .step-item a { color: #5755d9; display: inline-block; padding: 20px 10px 0; text-decoration: none; -} - -.step .step-item a::before { +}.step .step-item a::before { background: #5755d9; border: .1rem solid #fff; border-radius: 50%; @@ -2864,26 +1948,16 @@ summary.accordion-header::-webkit-details-marker { transform: translateX(-50%); width: .6rem; z-index: 1; -} - -.step .step-item.active a::before { +}.step .step-item.active a::before { background: #fff; border: .1rem solid #5755d9; -} - -.step .step-item.active ~ .step-item::before { +}.step .step-item.active ~ .step-item::before { background: #dadee4; -} - -.step .step-item.active ~ .step-item a { +}.step .step-item.active ~ .step-item a { color: #bcc3ce; -} - -.step .step-item.active ~ .step-item a::before { +}.step .step-item.active ~ .step-item a::before { background: #dadee4; -} - -.tab { +}.tab { align-items: center; border-bottom: .05rem solid #dadee4; display: -ms-flexbox; @@ -2893,115 +1967,75 @@ summary.accordion-header::-webkit-details-marker { flex-wrap: wrap; list-style: none; margin: .2rem 0 .15rem 0; -} - -.tab .tab-item { +}.tab .tab-item { margin-top: 0; -} - -.tab .tab-item a { +}.tab .tab-item a { border-bottom: .1rem solid transparent; color: inherit; display: block; margin: 0 .4rem 0 0; padding: .4rem .2rem .3rem .2rem; text-decoration: none; -} - -.tab .tab-item a:focus, +}.tab .tab-item a:focus, .tab .tab-item a:hover { color: #5755d9; -} - -.tab .tab-item.active a, +}.tab .tab-item.active a, .tab .tab-item a.active { border-bottom-color: #5755d9; color: #5755d9; -} - -.tab .tab-item.tab-action { +}.tab .tab-item.tab-action { -ms-flex: 1 0 auto; flex: 1 0 auto; text-align: right; -} - -.tab .tab-item .btn-clear { +}.tab .tab-item .btn-clear { margin-top: -.2rem; -} - -.tab.tab-block .tab-item { +}.tab.tab-block .tab-item { -ms-flex: 1 0 0; flex: 1 0 0; text-align: center; -} - -.tab.tab-block .tab-item a { +}.tab.tab-block .tab-item a { margin: 0; -} - -.tab.tab-block .tab-item .badge[data-badge]::after { +}.tab.tab-block .tab-item .badge[data-badge]::after { position: absolute; right: .1rem; top: .1rem; transform: translate(0, 0); -} - -.tab:not(.tab-block) .badge { +}.tab:not(.tab-block) .badge { padding-right: 0; -} - -.tile { +}.tile { align-content: space-between; align-items: flex-start; display: -ms-flexbox; - display: flex; + display: flex; -ms-flex-align: start; -ms-flex-line-pack: justify; -} - -.tile .tile-icon, +}.tile .tile-icon, .tile .tile-action { -ms-flex: 0 0 auto; flex: 0 0 auto; -} - -.tile .tile-content { +}.tile .tile-content { -ms-flex: 1 1 auto; flex: 1 1 auto; -} - -.tile .tile-content:not(:first-child) { +}.tile .tile-content:not(:first-child) { padding-left: .4rem; -} - -.tile .tile-content:not(:last-child) { +}.tile .tile-content:not(:last-child) { padding-right: .4rem; -} - -.tile .tile-title, +}.tile .tile-title, .tile .tile-subtitle { line-height: 1.2rem; -} - -.tile.tile-centered { - align-items: center; +}.tile.tile-centered { + align-items: center; -ms-flex-align: center; -} - -.tile.tile-centered .tile-content { +}.tile.tile-centered .tile-content { overflow: hidden; -} - -.tile.tile-centered .tile-title, +}.tile.tile-centered .tile-title, .tile.tile-centered .tile-subtitle { - margin-bottom: 0; + margin-bottom: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -} - -.toast { - background: rgba(48, 55, 66, .95); +}.toast { + background: rgba(48,55,66,.95); border: .05rem solid #303742; border-color: #303742; border-radius: .1rem; @@ -3009,54 +2043,34 @@ summary.accordion-header::-webkit-details-marker { display: block; padding: .4rem; width: 100%; -} - -.toast.toast-primary { - background: rgba(87, 85, 217, .95); +}.toast.toast-primary { + background: rgba(87,85,217,.95); border-color: #5755d9; -} - -.toast.toast-success { - background: rgba(50, 182, 67, .95); +}.toast.toast-success { + background: rgba(50,182,67,.95); border-color: #32b643; -} - -.toast.toast-warning { - background: rgba(255, 183, 0, .95); +}.toast.toast-warning { + background: rgba(255,183,0,.95); border-color: #ffb700; -} - -.toast.toast-error { - background: rgba(232, 86, 0, .95); +}.toast.toast-error { + background: rgba(232,86,0,.95); border-color: #e85600; -} - -.toast a { +}.toast a { color: #fff; text-decoration: underline; -} - -.toast a:focus, +}.toast a:focus, .toast a:hover, .toast a:active, .toast a.active { opacity: .75; -} - -.toast .btn-clear { +}.toast .btn-clear { margin: .1rem; -} - -.toast p:last-child { +}.toast p:last-child { margin-bottom: 0; -} - -.tooltip { +}.tooltip { position: relative; -} - -.tooltip::after { - background: rgba(48, 55, 66, .95); +}.tooltip::after { + background: rgba(48,55,66,.95); border-radius: .1rem; bottom: 100%; color: #fff; @@ -3072,282 +2086,166 @@ summary.accordion-header::-webkit-details-marker { position: absolute; text-overflow: ellipsis; transform: translate(-50%, .4rem); - transition: opacity .2s, transform .2s; + transition: opacity .2s,transform .2s; white-space: pre; z-index: 300; -} - -.tooltip:focus::after, +}.tooltip:focus::after, .tooltip:hover::after { opacity: 1; transform: translate(-50%, -.2rem); -} - -.tooltip[disabled], +}.tooltip[disabled], .tooltip.disabled { pointer-events: auto; -} - -.tooltip.tooltip-right::after { +}.tooltip.tooltip-right::after { bottom: 50%; left: 100%; transform: translate(-.2rem, 50%); -} - -.tooltip.tooltip-right:focus::after, +}.tooltip.tooltip-right:focus::after, .tooltip.tooltip-right:hover::after { transform: translate(.2rem, 50%); -} - -.tooltip.tooltip-bottom::after { +}.tooltip.tooltip-bottom::after { bottom: auto; top: 100%; transform: translate(-50%, -.4rem); -} - -.tooltip.tooltip-bottom:focus::after, +}.tooltip.tooltip-bottom:focus::after, .tooltip.tooltip-bottom:hover::after { transform: translate(-50%, .2rem); -} - -.tooltip.tooltip-left::after { +}.tooltip.tooltip-left::after { bottom: 50%; left: auto; right: 100%; transform: translate(.4rem, 50%); -} - -.tooltip.tooltip-left:focus::after, +}.tooltip.tooltip-left:focus::after, .tooltip.tooltip-left:hover::after { transform: translate(-.2rem, 50%); -} - -@keyframes loading { +}@keyframes loading { 0% { transform: rotate(0deg); - } - 100% { + }100% { transform: rotate(360deg); } -} - -@keyframes slide-down { +}@keyframes slide-down { 0% { opacity: 0; transform: translateY(-1.6rem); - } - 100% { + }100% { opacity: 1; transform: translateY(0); } -} - -.text-primary { +}.text-primary { color: #5755d9 !important; -} - -a.text-primary:focus, +}a.text-primary:focus, a.text-primary:hover { color: #4240d4; -} - -a.text-primary:visited { +}a.text-primary:visited { color: #6c6ade; -} - -.text-secondary { +}.text-secondary { color: #e5e5f9 !important; -} - -a.text-secondary:focus, +}a.text-secondary:focus, a.text-secondary:hover { color: #d1d0f4; -} - -a.text-secondary:visited { +}a.text-secondary:visited { color: #fafafe; -} - -.text-gray { +}.text-gray { color: #bcc3ce !important; -} - -a.text-gray:focus, +}a.text-gray:focus, a.text-gray:hover { color: #adb6c4; -} - -a.text-gray:visited { +}a.text-gray:visited { color: #cbd0d9; -} - -.text-light { +}.text-light { color: #fff !important; -} - -a.text-light:focus, +}a.text-light:focus, a.text-light:hover { color: #f2f2f2; -} - -a.text-light:visited { - color: white; -} - -.text-dark { +}a.text-light:visited { + color: #fff; +}.text-dark { color: #3b4351 !important; -} - -a.text-dark:focus, +}a.text-dark:focus, a.text-dark:hover { color: #303742; -} - -a.text-dark:visited { +}a.text-dark:visited { color: #455060; -} - -.text-success { +}.text-success { color: #32b643 !important; -} - -a.text-success:focus, +}a.text-success:focus, a.text-success:hover { color: #2da23c; -} - -a.text-success:visited { +}a.text-success:visited { color: #39c94b; -} - -.text-warning { +}.text-warning { color: #ffb700 !important; -} - -a.text-warning:focus, +}a.text-warning:focus, a.text-warning:hover { color: #e6a500; -} - -a.text-warning:visited { +}a.text-warning:visited { color: #ffbe1a; -} - -.text-error { +}.text-error { color: #e85600 !important; -} - -a.text-error:focus, +}a.text-error:focus, a.text-error:hover { color: #cf4d00; -} - -a.text-error:visited { +}a.text-error:visited { color: #ff6003; -} - -.bg-primary { +}.bg-primary { background: #5755d9 !important; color: #fff; -} - -.bg-secondary { +}.bg-secondary { background: #f1f1fc !important; -} - -.bg-dark { +}.bg-dark { background: #303742 !important; color: #fff; -} - -.bg-gray { +}.bg-gray { background: #f7f8f9 !important; -} - -.bg-success { +}.bg-success { background: #32b643 !important; color: #fff; -} - -.bg-warning { +}.bg-warning { background: #ffb700 !important; color: #fff; -} - -.bg-error { +}.bg-error { background: #e85600 !important; color: #fff; -} - -.c-hand { +}.c-hand { cursor: pointer; -} - -.c-move { +}.c-move { cursor: move; -} - -.c-zoom-in { +}.c-zoom-in { cursor: zoom-in; -} - -.c-zoom-out { +}.c-zoom-out { cursor: zoom-out; -} - -.c-not-allowed { +}.c-not-allowed { cursor: not-allowed; -} - -.c-auto { +}.c-auto { cursor: auto; -} - -.d-block { +}.d-block { display: block; -} - -.d-inline { +}.d-inline { display: inline; -} - -.d-inline-block { +}.d-inline-block { display: inline-block; -} - -.d-flex { +}.d-flex { display: -ms-flexbox; display: flex; -} - -.d-inline-flex { +}.d-inline-flex { display: -ms-inline-flexbox; display: inline-flex; -} - -.d-none, +}.d-none, .d-hide { display: none !important; -} - -.d-visible { +}.d-visible { visibility: visible; -} - -.d-invisible { +}.d-invisible { visibility: hidden; -} - -.text-hide { +}.text-hide { background: transparent; border: 0; color: transparent; font-size: 0; line-height: 0; text-shadow: none; -} - -.text-assistive { +}.text-assistive { border: 0; clip: rect(0, 0, 0, 0); height: 1px; @@ -3356,15 +2254,11 @@ a.text-error:visited { padding: 0; position: absolute; width: 1px; -} - -.divider, +}.divider, .divider-vert { display: block; position: relative; -} - -.divider[data-content]::after, +}.divider[data-content]::after, .divider-vert[data-content]::after { background: #fff; color: #bcc3ce; @@ -3373,24 +2267,16 @@ a.text-error:visited { font-size: .7rem; padding: 0 .4rem; transform: translateY(-.65rem); -} - -.divider { +}.divider { border-top: .05rem solid #f1f3f5; height: .05rem; margin: .4rem 0; -} - -.divider[data-content] { +}.divider[data-content] { margin: .8rem 0; -} - -.divider-vert { +}.divider-vert { display: block; padding: .8rem; -} - -.divider-vert::before { +}.divider-vert::before { border-left: .05rem solid #dadee4; bottom: .4rem; content: ""; @@ -3399,24 +2285,18 @@ a.text-error:visited { position: absolute; top: .4rem; transform: translateX(-50%); -} - -.divider-vert[data-content]::after { +}.divider-vert[data-content]::after { left: 50%; padding: .2rem 0; position: absolute; top: 50%; transform: translate(-50%, -50%); -} - -.loading { +}.loading { color: transparent !important; min-height: .8rem; pointer-events: none; position: relative; -} - -.loading::after { +}.loading::after { animation: loading 500ms infinite linear; background: transparent; border: .1rem solid #5755d9; @@ -3435,326 +2315,182 @@ a.text-error:visited { top: 50%; width: .8rem; z-index: 1; -} - -.loading.loading-lg { +}.loading.loading-lg { min-height: 2rem; -} - -.loading.loading-lg::after { +}.loading.loading-lg::after { height: 1.6rem; margin-left: -.8rem; margin-top: -.8rem; width: 1.6rem; -} - -.clearfix::after { +}.clearfix::after { clear: both; content: ""; display: table; -} - -.float-left { +}.float-left { float: left !important; -} - -.float-right { +}.float-right { float: right !important; -} - -.p-relative { +}.p-relative { position: relative !important; -} - -.p-absolute { +}.p-absolute { position: absolute !important; -} - -.p-fixed { +}.p-fixed { position: fixed !important; -} - -.p-sticky { +}.p-sticky { position: -webkit-sticky !important; position: sticky !important; -} - -.p-centered { +}.p-centered { display: block; float: none; margin-left: auto; margin-right: auto; -} - -.flex-centered { +}.flex-centered { align-items: center; display: -ms-flexbox; display: flex; -ms-flex-align: center; -ms-flex-pack: center; justify-content: center; -} - -.m-0 { +}.m-0 { margin: 0 !important; -} - -.mb-0 { +}.mb-0 { margin-bottom: 0 !important; -} - -.ml-0 { +}.ml-0 { margin-left: 0 !important; -} - -.mr-0 { +}.mr-0 { margin-right: 0 !important; -} - -.mt-0 { +}.mt-0 { margin-top: 0 !important; -} - -.mx-0 { +}.mx-0 { margin-left: 0 !important; margin-right: 0 !important; -} - -.my-0 { +}.my-0 { margin-bottom: 0 !important; margin-top: 0 !important; -} - -.m-1 { +}.m-1 { margin: .2rem !important; -} - -.mb-1 { +}.mb-1 { margin-bottom: .2rem !important; -} - -.ml-1 { +}.ml-1 { margin-left: .2rem !important; -} - -.mr-1 { +}.mr-1 { margin-right: .2rem !important; -} - -.mt-1 { +}.mt-1 { margin-top: .2rem !important; -} - -.mx-1 { +}.mx-1 { margin-left: .2rem !important; margin-right: .2rem !important; -} - -.my-1 { +}.my-1 { margin-bottom: .2rem !important; margin-top: .2rem !important; -} - -.m-2 { +}.m-2 { margin: .4rem !important; -} - -.mb-2 { +}.mb-2 { margin-bottom: .4rem !important; -} - -.ml-2 { +}.ml-2 { margin-left: .4rem !important; -} - -.mr-2 { +}.mr-2 { margin-right: .4rem !important; -} - -.mt-2 { +}.mt-2 { margin-top: .4rem !important; -} - -.mx-2 { +}.mx-2 { margin-left: .4rem !important; margin-right: .4rem !important; -} - -.my-2 { +}.my-2 { margin-bottom: .4rem !important; margin-top: .4rem !important; -} - -.p-0 { +}.p-0 { padding: 0 !important; -} - -.pb-0 { +}.pb-0 { padding-bottom: 0 !important; -} - -.pl-0 { +}.pl-0 { padding-left: 0 !important; -} - -.pr-0 { +}.pr-0 { padding-right: 0 !important; -} - -.pt-0 { +}.pt-0 { padding-top: 0 !important; -} - -.px-0 { +}.px-0 { padding-left: 0 !important; padding-right: 0 !important; -} - -.py-0 { +}.py-0 { padding-bottom: 0 !important; padding-top: 0 !important; -} - -.p-1 { +}.p-1 { padding: .2rem !important; -} - -.pb-1 { +}.pb-1 { padding-bottom: .2rem !important; -} - -.pl-1 { +}.pl-1 { padding-left: .2rem !important; -} - -.pr-1 { +}.pr-1 { padding-right: .2rem !important; -} - -.pt-1 { +}.pt-1 { padding-top: .2rem !important; -} - -.px-1 { +}.px-1 { padding-left: .2rem !important; padding-right: .2rem !important; -} - -.py-1 { +}.py-1 { padding-bottom: .2rem !important; padding-top: .2rem !important; -} - -.p-2 { +}.p-2 { padding: .4rem !important; -} - -.pb-2 { +}.pb-2 { padding-bottom: .4rem !important; -} - -.pl-2 { +}.pl-2 { padding-left: .4rem !important; -} - -.pr-2 { +}.pr-2 { padding-right: .4rem !important; -} - -.pt-2 { +}.pt-2 { padding-top: .4rem !important; -} - -.px-2 { +}.px-2 { padding-left: .4rem !important; padding-right: .4rem !important; -} - -.py-2 { +}.py-2 { padding-bottom: .4rem !important; padding-top: .4rem !important; -} - -.s-rounded { +}.s-rounded { border-radius: .1rem; -} - -.s-circle { +}.s-circle { border-radius: 50%; -} - -.text-left { +}.text-left { text-align: left; -} - -.text-right { +}.text-right { text-align: right; -} - -.text-center { +}.text-center { text-align: center; -} - -.text-justify { +}.text-justify { text-align: justify; -} - -.text-lowercase { +}.text-lowercase { text-transform: lowercase; -} - -.text-uppercase { +}.text-uppercase { text-transform: uppercase; -} - -.text-capitalize { +}.text-capitalize { text-transform: capitalize; -} - -.text-normal { +}.text-normal { font-weight: normal; -} - -.text-bold { +}.text-bold { font-weight: bold; -} - -.text-italic { +}.text-italic { font-style: italic; -} - -.text-large { +}.text-large { font-size: 1.2em; -} - -.text-small { +}.text-small { font-size: .9em; -} - -.text-tiny { +}.text-tiny { font-size: .8em; -} - -.text-muted { +}.text-muted { opacity: .8; -} - -.text-ellipsis { +}.text-ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -} - -.text-clip { +}.text-clip { overflow: hidden; text-overflow: clip; white-space: nowrap; -} - -.text-break { +}.text-break { -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; word-break: break-word; word-wrap: break-word; -} \ No newline at end of file +}/*! Spectre.css v0.5.9 | MIT License | github.com/picturepan2/spectre */ \ No newline at end of file diff --git a/dist/spectre.min.css b/dist/spectre.min.css index 0fe23d9c0..8777fede2 100644 --- a/dist/spectre.min.css +++ b/dist/spectre.min.css @@ -1 +1 @@ -/*! Spectre.css v0.5.9 | MIT License | github.com/picturepan2/spectre */html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}address{font-style:normal}b,strong{font-weight:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:"SF Mono","Segoe UI Mono","Roboto Mono",Menlo,Courier,monospace;font-size:1em}dfn{font-style:italic}small{font-size:80%;font-weight:400}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}fieldset{border:0;margin:0;padding:0}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item;outline:0}canvas{display:inline-block}template{display:none}[hidden]{display:none}*,::after,::before{box-sizing:inherit}html{box-sizing:border-box;font-size:20px;line-height:1.5;-webkit-tap-highlight-color:transparent}body{background:#fff;color:#3b4351;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;font-size:.8rem;overflow-x:hidden;text-rendering:optimizeLegibility}a{color:#5755d9;outline:0;text-decoration:none}a:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}a.active,a:active,a:focus,a:hover{color:#302ecd;text-decoration:underline}a:visited{color:#807fe2}h1,h2,h3,h4,h5,h6{color:inherit;font-weight:500;line-height:1.2;margin-bottom:.5em;margin-top:0}.h1,.h2,.h3,.h4,.h5,.h6{font-weight:500}.h1,h1{font-size:2rem}.h2,h2{font-size:1.6rem}.h3,h3{font-size:1.4rem}.h4,h4{font-size:1.2rem}.h5,h5{font-size:1rem}.h6,h6{font-size:.8rem}p{margin:0 0 1.2rem}a,ins,u{-webkit-text-decoration-skip:ink edges;text-decoration-skip:ink edges}abbr[title]{border-bottom:.05rem dotted;cursor:help;text-decoration:none}kbd{background:#303742;border-radius:.1rem;color:#fff;font-size:.7rem;line-height:1.25;padding:.1rem .2rem}mark{background:#ffe9b3;border-bottom:.05rem solid #ffd367;border-radius:.1rem;color:#3b4351;padding:.05rem .1rem 0}blockquote{border-left:.1rem solid #dadee4;margin-left:0;padding:.4rem .8rem}blockquote p:last-child{margin-bottom:0}ol,ul{margin:.8rem 0 .8rem .8rem;padding:0}ol ol,ol ul,ul ol,ul ul{margin:.8rem 0 .8rem .8rem}ol li,ul li{margin-top:.4rem}ul{list-style:disc inside}ul ul{list-style-type:circle}ol{list-style:decimal inside}ol ol{list-style-type:lower-alpha}dl dt{font-weight:700}dl dd{margin:.4rem 0 .8rem 0}.lang-zh,.lang-zh-hans,html:lang(zh),html:lang(zh-Hans){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",sans-serif}.lang-zh-hant,html:lang(zh-Hant){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang TC","Hiragino Sans CNS","Microsoft JhengHei","Helvetica Neue",sans-serif}.lang-ja,html:lang(ja){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Hiragino Sans","Hiragino Kaku Gothic Pro","Yu Gothic",YuGothic,Meiryo,"Helvetica Neue",sans-serif}.lang-ko,html:lang(ko){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Malgun Gothic","Helvetica Neue",sans-serif}.lang-cjk ins,.lang-cjk u,:lang(ja) ins,:lang(ja) u,:lang(zh) ins,:lang(zh) u{border-bottom:.05rem solid;text-decoration:none}.lang-cjk del+del,.lang-cjk del+s,.lang-cjk ins+ins,.lang-cjk ins+u,.lang-cjk s+del,.lang-cjk s+s,.lang-cjk u+ins,.lang-cjk u+u,:lang(ja) del+del,:lang(ja) del+s,:lang(ja) ins+ins,:lang(ja) ins+u,:lang(ja) s+del,:lang(ja) s+s,:lang(ja) u+ins,:lang(ja) u+u,:lang(zh) del+del,:lang(zh) del+s,:lang(zh) ins+ins,:lang(zh) ins+u,:lang(zh) s+del,:lang(zh) s+s,:lang(zh) u+ins,:lang(zh) u+u{margin-left:.125em}.table{border-collapse:collapse;border-spacing:0;text-align:left;width:100%}.table.table-striped tbody tr:nth-of-type(odd){background:#f7f8f9}.table tbody tr.active,.table.table-striped tbody tr.active{background:#eef0f3}.table.table-hover tbody tr:hover{background:#eef0f3}.table.table-scroll{display:block;overflow-x:auto;padding-bottom:.75rem;white-space:nowrap}.table td,.table th{border-bottom:.05rem solid #dadee4;padding:.6rem .4rem}.table th{border-bottom-width:.1rem}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:.05rem solid #5755d9;border-radius:.1rem;color:#5755d9;cursor:pointer;display:inline-block;font-size:.8rem;height:1.8rem;line-height:1.2rem;outline:0;padding:.25rem .4rem;text-align:center;text-decoration:none;transition:background .2s,border .2s,box-shadow .2s,color .2s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap}.btn:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.btn:focus,.btn:hover{background:#f1f1fc;border-color:#4b48d6;text-decoration:none}.btn.active,.btn:active{background:#4b48d6;border-color:#3634d2;color:#fff;text-decoration:none}.btn.active.loading::after,.btn:active.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.disabled,.btn:disabled,.btn[disabled]{cursor:default;opacity:.5;pointer-events:none}.btn.btn-primary{background:#5755d9;border-color:#4b48d6;color:#fff}.btn.btn-primary:focus,.btn.btn-primary:hover{background:#4240d4;border-color:#3634d2;color:#fff}.btn.btn-primary.active,.btn.btn-primary:active{background:#3a38d2;border-color:#302ecd;color:#fff}.btn.btn-primary.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-success{background:#32b643;border-color:#2faa3f;color:#fff}.btn.btn-success:focus{box-shadow:0 0 0 .1rem rgba(50,182,67,.2)}.btn.btn-success:focus,.btn.btn-success:hover{background:#30ae40;border-color:#2da23c;color:#fff}.btn.btn-success.active,.btn.btn-success:active{background:#2a9a39;border-color:#278e34;color:#fff}.btn.btn-success.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-error{background:#e85600;border-color:#d95000;color:#fff}.btn.btn-error:focus{box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.btn.btn-error:focus,.btn.btn-error:hover{background:#de5200;border-color:#cf4d00;color:#fff}.btn.btn-error.active,.btn.btn-error:active{background:#c44900;border-color:#b54300;color:#fff}.btn.btn-error.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-link{background:0 0;border-color:transparent;color:#5755d9}.btn.btn-link.active,.btn.btn-link:active,.btn.btn-link:focus,.btn.btn-link:hover{color:#302ecd}.btn.btn-sm{font-size:.7rem;height:1.4rem;padding:.05rem .3rem}.btn.btn-lg{font-size:.9rem;height:2rem;padding:.35rem .6rem}.btn.btn-block{display:block;width:100%}.btn.btn-action{padding-left:0;padding-right:0;width:1.8rem}.btn.btn-action.btn-sm{width:1.4rem}.btn.btn-action.btn-lg{width:2rem}.btn.btn-clear{background:0 0;border:0;color:currentColor;height:1rem;line-height:.8rem;margin-left:.2rem;margin-right:-2px;opacity:1;padding:.1rem;text-decoration:none;width:1rem}.btn.btn-clear:focus,.btn.btn-clear:hover{background:rgba(247,248,249,.5);opacity:.95}.btn.btn-clear::before{content:"\2715"}.btn-group{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.btn-group .btn{-ms-flex:1 0 auto;flex:1 0 auto}.btn-group .btn:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.btn-group .btn:not(:first-child):not(:last-child){border-radius:0;margin-left:-.05rem}.btn-group .btn:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-.05rem}.btn-group .btn.active,.btn-group .btn:active,.btn-group .btn:focus,.btn-group .btn:hover{z-index:1}.btn-group.btn-group-block{display:-ms-flexbox;display:flex}.btn-group.btn-group-block .btn{-ms-flex:1 0 0;flex:1 0 0}.form-group:not(:last-child){margin-bottom:.4rem}fieldset{margin-bottom:.8rem}legend{font-size:.9rem;font-weight:500;margin-bottom:.8rem}.form-label{display:block;line-height:1.2rem;padding:.3rem 0}.form-label.label-sm{font-size:.7rem;padding:.1rem 0}.form-label.label-lg{font-size:.9rem;padding:.4rem 0}.form-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;background-image:none;border:.05rem solid #bcc3ce;border-radius:.1rem;color:#3b4351;display:block;font-size:.8rem;height:1.8rem;line-height:1.2rem;max-width:100%;outline:0;padding:.25rem .4rem;position:relative;transition:background .2s,border .2s,box-shadow .2s,color .2s;width:100%}.form-input:focus{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-input:-ms-input-placeholder{color:#bcc3ce}.form-input::-ms-input-placeholder{color:#bcc3ce}.form-input::placeholder{color:#bcc3ce}.form-input.input-sm{font-size:.7rem;height:1.4rem;padding:.05rem .3rem}.form-input.input-lg{font-size:.9rem;height:2rem;padding:.35rem .6rem}.form-input.input-inline{display:inline-block;vertical-align:middle;width:auto}.form-input[type=file]{height:auto}textarea.form-input,textarea.form-input.input-lg,textarea.form-input.input-sm{height:auto}.form-input-hint{color:#bcc3ce;font-size:.7rem;margin-top:.2rem}.has-success .form-input-hint,.is-success+.form-input-hint{color:#32b643}.has-error .form-input-hint,.is-error+.form-input-hint{color:#e85600}.form-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:.05rem solid #bcc3ce;border-radius:.1rem;color:inherit;font-size:.8rem;height:1.8rem;line-height:1.2rem;outline:0;padding:.25rem .4rem;vertical-align:middle;width:100%}.form-select:focus{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-select::-ms-expand{display:none}.form-select.select-sm{font-size:.7rem;height:1.4rem;padding:.05rem 1.1rem .05rem .3rem}.form-select.select-lg{font-size:.9rem;height:2rem;padding:.35rem 1.4rem .35rem .6rem}.form-select[multiple],.form-select[size]{height:auto;padding:.25rem .4rem}.form-select[multiple] option,.form-select[size] option{padding:.1rem .2rem}.form-select:not([multiple]):not([size]){background:#fff url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center/.4rem .5rem;padding-right:1.2rem}.has-icon-left,.has-icon-right{position:relative}.has-icon-left .form-icon,.has-icon-right .form-icon{height:.8rem;margin:0 .25rem;position:absolute;top:50%;transform:translateY(-50%);width:.8rem;z-index:2}.has-icon-left .form-icon{left:.05rem}.has-icon-left .form-input{padding-left:1.3rem}.has-icon-right .form-icon{right:.05rem}.has-icon-right .form-input{padding-right:1.3rem}.form-checkbox,.form-radio,.form-switch{display:block;line-height:1.2rem;margin:.2rem 0;min-height:1.4rem;padding:.1rem .4rem .1rem 1.2rem;position:relative}.form-checkbox input,.form-radio input,.form-switch input{clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;position:absolute;width:1px}.form-checkbox input:focus+.form-icon,.form-radio input:focus+.form-icon,.form-switch input:focus+.form-icon{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-checkbox input:checked+.form-icon,.form-radio input:checked+.form-icon,.form-switch input:checked+.form-icon{background:#5755d9;border-color:#5755d9}.form-checkbox .form-icon,.form-radio .form-icon,.form-switch .form-icon{border:.05rem solid #bcc3ce;cursor:pointer;display:inline-block;position:absolute;transition:background .2s,border .2s,box-shadow .2s,color .2s}.form-checkbox.input-sm,.form-radio.input-sm,.form-switch.input-sm{font-size:.7rem;margin:0}.form-checkbox.input-lg,.form-radio.input-lg,.form-switch.input-lg{font-size:.9rem;margin:.3rem 0}.form-checkbox .form-icon,.form-radio .form-icon{background:#fff;height:.8rem;left:0;top:.3rem;width:.8rem}.form-checkbox input:active+.form-icon,.form-radio input:active+.form-icon{background:#eef0f3}.form-checkbox .form-icon{border-radius:.1rem}.form-checkbox input:checked+.form-icon::before{background-clip:padding-box;border:.1rem solid #fff;border-left-width:0;border-top-width:0;content:"";height:9px;left:50%;margin-left:-3px;margin-top:-6px;position:absolute;top:50%;transform:rotate(45deg);width:6px}.form-checkbox input:indeterminate+.form-icon{background:#5755d9;border-color:#5755d9}.form-checkbox input:indeterminate+.form-icon::before{background:#fff;content:"";height:2px;left:50%;margin-left:-5px;margin-top:-1px;position:absolute;top:50%;width:10px}.form-radio .form-icon{border-radius:50%}.form-radio input:checked+.form-icon::before{background:#fff;border-radius:50%;content:"";height:6px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:6px}.form-switch{padding-left:2rem}.form-switch .form-icon{background:#bcc3ce;background-clip:padding-box;border-radius:.45rem;height:.9rem;left:0;top:.25rem;width:1.6rem}.form-switch .form-icon::before{background:#fff;border-radius:50%;content:"";display:block;height:.8rem;left:0;position:absolute;top:0;transition:background .2s,border .2s,box-shadow .2s,color .2s,left .2s;width:.8rem}.form-switch input:checked+.form-icon::before{left:14px}.form-switch input:active+.form-icon::before{background:#f7f8f9}.input-group{display:-ms-flexbox;display:flex}.input-group .input-group-addon{background:#f7f8f9;border:.05rem solid #bcc3ce;border-radius:.1rem;line-height:1.2rem;padding:.25rem .4rem;white-space:nowrap}.input-group .input-group-addon.addon-sm{font-size:.7rem;padding:.05rem .3rem}.input-group .input-group-addon.addon-lg{font-size:.9rem;padding:.35rem .6rem}.input-group .form-input,.input-group .form-select{-ms-flex:1 1 auto;flex:1 1 auto;width:1%}.input-group .input-group-btn{z-index:1}.input-group .form-input:first-child:not(:last-child),.input-group .form-select:first-child:not(:last-child),.input-group .input-group-addon:first-child:not(:last-child),.input-group .input-group-btn:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.input-group .form-input:not(:first-child):not(:last-child),.input-group .form-select:not(:first-child):not(:last-child),.input-group .input-group-addon:not(:first-child):not(:last-child),.input-group .input-group-btn:not(:first-child):not(:last-child){border-radius:0;margin-left:-.05rem}.input-group .form-input:last-child:not(:first-child),.input-group .form-select:last-child:not(:first-child),.input-group .input-group-addon:last-child:not(:first-child),.input-group .input-group-btn:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-.05rem}.input-group .form-input:focus,.input-group .form-select:focus,.input-group .input-group-addon:focus,.input-group .input-group-btn:focus{z-index:2}.input-group .form-select{width:auto}.input-group.input-inline{display:-ms-inline-flexbox;display:inline-flex}.form-input.is-success,.form-select.is-success,.has-success .form-input,.has-success .form-select{background:#f9fdfa;border-color:#32b643}.form-input.is-success:focus,.form-select.is-success:focus,.has-success .form-input:focus,.has-success .form-select:focus{box-shadow:0 0 0 .1rem rgba(50,182,67,.2)}.form-input.is-error,.form-select.is-error,.has-error .form-input,.has-error .form-select{background:#fffaf7;border-color:#e85600}.form-input.is-error:focus,.form-select.is-error:focus,.has-error .form-input:focus,.has-error .form-select:focus{box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-checkbox.is-error .form-icon,.form-radio.is-error .form-icon,.form-switch.is-error .form-icon,.has-error .form-checkbox .form-icon,.has-error .form-radio .form-icon,.has-error .form-switch .form-icon{border-color:#e85600}.form-checkbox.is-error input:checked+.form-icon,.form-radio.is-error input:checked+.form-icon,.form-switch.is-error input:checked+.form-icon,.has-error .form-checkbox input:checked+.form-icon,.has-error .form-radio input:checked+.form-icon,.has-error .form-switch input:checked+.form-icon{background:#e85600;border-color:#e85600}.form-checkbox.is-error input:focus+.form-icon,.form-radio.is-error input:focus+.form-icon,.form-switch.is-error input:focus+.form-icon,.has-error .form-checkbox input:focus+.form-icon,.has-error .form-radio input:focus+.form-icon,.has-error .form-switch input:focus+.form-icon{border-color:#e85600;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-checkbox.is-error input:indeterminate+.form-icon,.has-error .form-checkbox input:indeterminate+.form-icon{background:#e85600;border-color:#e85600}.form-input:not(:-ms-input-placeholder):invalid{border-color:#e85600}.form-input:not(:placeholder-shown):invalid{border-color:#e85600}.form-input:not(:-ms-input-placeholder):invalid:focus{background:#fffaf7;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-input:not(:placeholder-shown):invalid:focus{background:#fffaf7;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-input:not(:-ms-input-placeholder):invalid+.form-input-hint{color:#e85600}.form-input:not(:placeholder-shown):invalid+.form-input-hint{color:#e85600}.form-input.disabled,.form-input:disabled,.form-select.disabled,.form-select:disabled{background-color:#eef0f3;cursor:not-allowed;opacity:.5}.form-input[readonly]{background-color:#f7f8f9}input.disabled+.form-icon,input:disabled+.form-icon{background:#eef0f3;cursor:not-allowed;opacity:.5}.form-switch input.disabled+.form-icon::before,.form-switch input:disabled+.form-icon::before{background:#fff}.form-horizontal{padding:.4rem 0}.form-horizontal .form-group{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.form-inline{display:inline-block}.label{background:#eef0f3;border-radius:.1rem;color:#455060;display:inline-block;line-height:1.25;padding:.1rem .2rem}.label.label-rounded{border-radius:5rem;padding-left:.4rem;padding-right:.4rem}.label.label-primary{background:#5755d9;color:#fff}.label.label-secondary{background:#f1f1fc;color:#5755d9}.label.label-success{background:#32b643;color:#fff}.label.label-warning{background:#ffb700;color:#fff}.label.label-error{background:#e85600;color:#fff}code{background:#fcf2f2;border-radius:.1rem;color:#d73e48;font-size:85%;line-height:1.25;padding:.1rem .2rem}.code{border-radius:.1rem;color:#3b4351;position:relative}.code::before{color:#bcc3ce;content:attr(data-lang);font-size:.7rem;position:absolute;right:.4rem;top:.1rem}.code code{background:#f7f8f9;color:inherit;display:block;line-height:1.5;overflow-x:auto;padding:1rem;width:100%}.img-responsive{display:block;height:auto;max-width:100%}.img-fit-cover{object-fit:cover}.img-fit-contain{object-fit:contain}.video-responsive{display:block;overflow:hidden;padding:0;position:relative;width:100%}.video-responsive::before{content:"";display:block;padding-bottom:56.25%}.video-responsive embed,.video-responsive iframe,.video-responsive object{border:0;bottom:0;height:100%;left:0;position:absolute;right:0;top:0;width:100%}video.video-responsive{height:auto;max-width:100%}video.video-responsive::before{content:none}.video-responsive-4-3::before{padding-bottom:75%}.video-responsive-1-1::before{padding-bottom:100%}.figure{margin:0 0 .4rem 0}.figure .figure-caption{color:#66758c;margin-top:.4rem}.container{margin-left:auto;margin-right:auto;padding-left:.4rem;padding-right:.4rem;width:100%}.container.grid-xl{max-width:1296px}.container.grid-lg{max-width:976px}.container.grid-md{max-width:856px}.container.grid-sm{max-width:616px}.container.grid-xs{max-width:496px}.show-lg,.show-md,.show-sm,.show-xl,.show-xs{display:none!important}.cols,.columns{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-left:-.4rem;margin-right:-.4rem}.cols.col-gapless,.columns.col-gapless{margin-left:0;margin-right:0}.cols.col-gapless>.column,.columns.col-gapless>.column{padding-left:0;padding-right:0}.cols.col-oneline,.columns.col-oneline{-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto}.column,[class~=col-]{-ms-flex:1;flex:1;max-width:100%;padding-left:.4rem;padding-right:.4rem}.column.col-1,.column.col-10,.column.col-11,.column.col-12,.column.col-2,.column.col-3,.column.col-4,.column.col-5,.column.col-6,.column.col-7,.column.col-8,.column.col-9,.column.col-auto,[class~=col-].col-1,[class~=col-].col-10,[class~=col-].col-11,[class~=col-].col-12,[class~=col-].col-2,[class~=col-].col-3,[class~=col-].col-4,[class~=col-].col-5,[class~=col-].col-6,[class~=col-].col-7,[class~=col-].col-8,[class~=col-].col-9,[class~=col-].col-auto{-ms-flex:none;flex:none}.col-12{width:100%}.col-11{width:91.66666667%}.col-10{width:83.33333333%}.col-9{width:75%}.col-8{width:66.66666667%}.col-7{width:58.33333333%}.col-6{width:50%}.col-5{width:41.66666667%}.col-4{width:33.33333333%}.col-3{width:25%}.col-2{width:16.66666667%}.col-1{width:8.33333333%}.col-auto{-ms-flex:0 0 auto;flex:0 0 auto;max-width:none;width:auto}.col-mx-auto{margin-left:auto;margin-right:auto}.col-ml-auto{margin-left:auto}.col-mr-auto{margin-right:auto}@media (max-width:1280px){.col-xl-1,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-auto{-ms-flex:none;flex:none}.col-xl-12{width:100%}.col-xl-11{width:91.66666667%}.col-xl-10{width:83.33333333%}.col-xl-9{width:75%}.col-xl-8{width:66.66666667%}.col-xl-7{width:58.33333333%}.col-xl-6{width:50%}.col-xl-5{width:41.66666667%}.col-xl-4{width:33.33333333%}.col-xl-3{width:25%}.col-xl-2{width:16.66666667%}.col-xl-1{width:8.33333333%}.col-xl-auto{width:auto}.hide-xl{display:none!important}.show-xl{display:block!important}}@media (max-width:960px){.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-auto{-ms-flex:none;flex:none}.col-lg-12{width:100%}.col-lg-11{width:91.66666667%}.col-lg-10{width:83.33333333%}.col-lg-9{width:75%}.col-lg-8{width:66.66666667%}.col-lg-7{width:58.33333333%}.col-lg-6{width:50%}.col-lg-5{width:41.66666667%}.col-lg-4{width:33.33333333%}.col-lg-3{width:25%}.col-lg-2{width:16.66666667%}.col-lg-1{width:8.33333333%}.col-lg-auto{width:auto}.hide-lg{display:none!important}.show-lg{display:block!important}}@media (max-width:840px){.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-auto{-ms-flex:none;flex:none}.col-md-12{width:100%}.col-md-11{width:91.66666667%}.col-md-10{width:83.33333333%}.col-md-9{width:75%}.col-md-8{width:66.66666667%}.col-md-7{width:58.33333333%}.col-md-6{width:50%}.col-md-5{width:41.66666667%}.col-md-4{width:33.33333333%}.col-md-3{width:25%}.col-md-2{width:16.66666667%}.col-md-1{width:8.33333333%}.col-md-auto{width:auto}.hide-md{display:none!important}.show-md{display:block!important}}@media (max-width:600px){.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-auto{-ms-flex:none;flex:none}.col-sm-12{width:100%}.col-sm-11{width:91.66666667%}.col-sm-10{width:83.33333333%}.col-sm-9{width:75%}.col-sm-8{width:66.66666667%}.col-sm-7{width:58.33333333%}.col-sm-6{width:50%}.col-sm-5{width:41.66666667%}.col-sm-4{width:33.33333333%}.col-sm-3{width:25%}.col-sm-2{width:16.66666667%}.col-sm-1{width:8.33333333%}.col-sm-auto{width:auto}.hide-sm{display:none!important}.show-sm{display:block!important}}@media (max-width:480px){.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-auto{-ms-flex:none;flex:none}.col-xs-12{width:100%}.col-xs-11{width:91.66666667%}.col-xs-10{width:83.33333333%}.col-xs-9{width:75%}.col-xs-8{width:66.66666667%}.col-xs-7{width:58.33333333%}.col-xs-6{width:50%}.col-xs-5{width:41.66666667%}.col-xs-4{width:33.33333333%}.col-xs-3{width:25%}.col-xs-2{width:16.66666667%}.col-xs-1{width:8.33333333%}.col-xs-auto{width:auto}.hide-xs{display:none!important}.show-xs{display:block!important}}.hero{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:4rem;padding-top:4rem}.hero.hero-sm{padding-bottom:2rem;padding-top:2rem}.hero.hero-lg{padding-bottom:8rem;padding-top:8rem}.hero .hero-body{padding:.4rem}.navbar{align-items:stretch;display:-ms-flexbox;display:flex;-ms-flex-align:stretch;-ms-flex-pack:justify;-ms-flex-wrap:wrap;flex-wrap:wrap;justify-content:space-between}.navbar .navbar-section{align-items:center;display:-ms-flexbox;display:flex;-ms-flex:1 0 0;flex:1 0 0;-ms-flex-align:center}.navbar .navbar-section:not(:first-child):last-child{-ms-flex-pack:end;justify-content:flex-end}.navbar .navbar-center{align-items:center;display:-ms-flexbox;display:flex;-ms-flex:0 0 auto;flex:0 0 auto;-ms-flex-align:center}.navbar .navbar-brand{font-size:.9rem;text-decoration:none}.accordion input:checked~.accordion-header>.icon:first-child,.accordion[open] .accordion-header>.icon:first-child{transform:rotate(90deg)}.accordion input:checked~.accordion-body,.accordion[open] .accordion-body{max-height:50rem}.accordion .accordion-header{display:block;padding:.2rem .4rem}.accordion .accordion-header .icon{transition:transform .25s}.accordion .accordion-body{margin-bottom:.4rem;max-height:0;overflow:hidden;transition:max-height .25s}summary.accordion-header::-webkit-details-marker{display:none}.avatar{background:#5755d9;border-radius:50%;color:rgba(255,255,255,.85);display:inline-block;font-size:.8rem;font-weight:300;height:1.6rem;line-height:1.25;margin:0;position:relative;vertical-align:middle;width:1.6rem}.avatar.avatar-xs{font-size:.4rem;height:.8rem;width:.8rem}.avatar.avatar-sm{font-size:.6rem;height:1.2rem;width:1.2rem}.avatar.avatar-lg{font-size:1.2rem;height:2.4rem;width:2.4rem}.avatar.avatar-xl{font-size:1.6rem;height:3.2rem;width:3.2rem}.avatar img{border-radius:50%;height:100%;position:relative;width:100%;z-index:1}.avatar .avatar-icon,.avatar .avatar-presence{background:#fff;bottom:14.64%;height:50%;padding:.1rem;position:absolute;right:14.64%;transform:translate(50%,50%);width:50%;z-index:2}.avatar .avatar-presence{background:#bcc3ce;border-radius:50%;box-shadow:0 0 0 .1rem #fff;height:.5em;width:.5em}.avatar .avatar-presence.online{background:#32b643}.avatar .avatar-presence.busy{background:#e85600}.avatar .avatar-presence.away{background:#ffb700}.avatar[data-initial]::before{color:currentColor;content:attr(data-initial);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:1}.badge{position:relative;white-space:nowrap}.badge:not([data-badge])::after,.badge[data-badge]::after{background:#5755d9;background-clip:padding-box;border-radius:.5rem;box-shadow:0 0 0 .1rem #fff;color:#fff;content:attr(data-badge);display:inline-block;transform:translate(-.05rem,-.5rem)}.badge[data-badge]::after{font-size:.7rem;height:.9rem;line-height:1;min-width:.9rem;padding:.1rem .2rem;text-align:center;white-space:nowrap}.badge:not([data-badge])::after,.badge[data-badge=""]::after{height:6px;min-width:6px;padding:0;width:6px}.badge.btn::after{position:absolute;right:0;top:0;transform:translate(50%,-50%)}.badge.avatar::after{position:absolute;right:14.64%;top:14.64%;transform:translate(50%,-50%);z-index:100}.breadcrumb{list-style:none;margin:.2rem 0;padding:.2rem 0}.breadcrumb .breadcrumb-item{color:#66758c;display:inline-block;margin:0;padding:.2rem 0}.breadcrumb .breadcrumb-item:not(:last-child){margin-right:.2rem}.breadcrumb .breadcrumb-item:not(:last-child) a{color:#66758c}.breadcrumb .breadcrumb-item:not(:first-child)::before{color:#66758c;content:"/";padding-right:.4rem}.bar{background:#eef0f3;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;height:.8rem;width:100%}.bar.bar-sm{height:.2rem}.bar .bar-item{background:#5755d9;color:#fff;display:block;-ms-flex-negative:0;flex-shrink:0;font-size:.7rem;height:100%;line-height:.8rem;position:relative;text-align:center;width:0}.bar .bar-item:first-child{border-bottom-left-radius:.1rem;border-top-left-radius:.1rem}.bar .bar-item:last-child{border-bottom-right-radius:.1rem;border-top-right-radius:.1rem;-ms-flex-negative:1;flex-shrink:1}.bar-slider{height:.1rem;margin:.4rem 0;position:relative}.bar-slider .bar-item{left:0;padding:0;position:absolute}.bar-slider .bar-item:not(:last-child):first-child{background:#eef0f3;z-index:1}.bar-slider .bar-slider-btn{background:#5755d9;border:0;border-radius:50%;height:.6rem;padding:0;position:absolute;right:0;top:50%;transform:translate(50%,-50%);width:.6rem}.bar-slider .bar-slider-btn:active{box-shadow:0 0 0 .1rem #5755d9}.card{background:#fff;border:.05rem solid #dadee4;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.card .card-body,.card .card-footer,.card .card-header{padding:.8rem;padding-bottom:0}.card .card-body:last-child,.card .card-footer:last-child,.card .card-header:last-child{padding-bottom:.8rem}.card .card-body{-ms-flex:1 1 auto;flex:1 1 auto}.card .card-image{padding-top:.8rem}.card .card-image:first-child{padding-top:0}.card .card-image:first-child img{border-top-left-radius:.1rem;border-top-right-radius:.1rem}.card .card-image:last-child img{border-bottom-left-radius:.1rem;border-bottom-right-radius:.1rem}.chip{align-items:center;background:#eef0f3;border-radius:5rem;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;font-size:90%;height:1.2rem;line-height:.8rem;margin:.1rem;max-width:320px;overflow:hidden;padding:.2rem .4rem;text-decoration:none;text-overflow:ellipsis;vertical-align:middle;white-space:nowrap}.chip.active{background:#5755d9;color:#fff}.chip .avatar{margin-left:-.4rem;margin-right:.2rem}.chip .btn-clear{border-radius:50%;transform:scale(.75)}.dropdown{display:inline-block;position:relative}.dropdown .menu{animation:slide-down .15s ease 1;display:none;left:0;max-height:50vh;overflow-y:auto;position:absolute;top:100%}.dropdown.dropdown-right .menu{left:auto;right:0}.dropdown .dropdown-toggle:focus+.menu,.dropdown .menu:hover,.dropdown.active .menu{display:block}.dropdown .btn-group .dropdown-toggle:nth-last-child(2){border-bottom-right-radius:.1rem;border-top-right-radius:.1rem}.empty{background:#f7f8f9;border-radius:.1rem;color:#66758c;padding:3.2rem 1.6rem;text-align:center}.empty .empty-icon{margin-bottom:.8rem}.empty .empty-subtitle,.empty .empty-title{margin:.4rem auto}.empty .empty-action{margin-top:.8rem}.menu{background:#fff;border-radius:.1rem;box-shadow:0 .05rem .2rem rgba(48,55,66,.3);list-style:none;margin:0;min-width:180px;padding:.4rem;transform:translateY(.2rem);z-index:300}.menu.menu-nav{background:0 0;box-shadow:none}.menu .menu-item{margin-top:0;padding:0 .4rem;position:relative;text-decoration:none}.menu .menu-item>a{border-radius:.1rem;color:inherit;display:block;margin:0 -.4rem;padding:.2rem .4rem;text-decoration:none}.menu .menu-item>a:focus,.menu .menu-item>a:hover{background:#f1f1fc;color:#5755d9}.menu .menu-item>a.active,.menu .menu-item>a:active{background:#f1f1fc;color:#5755d9}.menu .menu-item .form-checkbox,.menu .menu-item .form-radio,.menu .menu-item .form-switch{margin:.1rem 0}.menu .menu-item+.menu-item{margin-top:.2rem}.menu .menu-badge{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;height:100%;position:absolute;right:0;top:0}.menu .menu-badge .label{margin-right:.4rem}.modal{align-items:center;bottom:0;display:none;-ms-flex-align:center;-ms-flex-pack:center;justify-content:center;left:0;opacity:0;overflow:hidden;padding:.4rem;position:fixed;right:0;top:0}.modal.active,.modal:target{display:-ms-flexbox;display:flex;opacity:1;z-index:400}.modal.active .modal-overlay,.modal:target .modal-overlay{background:rgba(247,248,249,.75);bottom:0;cursor:default;display:block;left:0;position:absolute;right:0;top:0}.modal.active .modal-container,.modal:target .modal-container{animation:slide-down .2s ease 1;z-index:1}.modal.modal-sm .modal-container{max-width:320px;padding:0 .4rem}.modal.modal-lg .modal-overlay{background:#fff}.modal.modal-lg .modal-container{box-shadow:none;max-width:960px}.modal-container{background:#fff;border-radius:.1rem;box-shadow:0 .2rem .5rem rgba(48,55,66,.3);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;max-height:75vh;max-width:640px;padding:0 .8rem;width:100%}.modal-container.modal-fullheight{max-height:100vh}.modal-container .modal-header{color:#303742;padding:.8rem}.modal-container .modal-body{overflow-y:auto;padding:.8rem;position:relative}.modal-container .modal-footer{padding:.8rem;text-align:right}.nav{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;list-style:none;margin:.2rem 0}.nav .nav-item a{color:#66758c;padding:.2rem .4rem;text-decoration:none}.nav .nav-item a:focus,.nav .nav-item a:hover{color:#5755d9}.nav .nav-item.active>a{color:#505c6e;font-weight:700}.nav .nav-item.active>a:focus,.nav .nav-item.active>a:hover{color:#5755d9}.nav .nav{margin-bottom:.4rem;margin-left:.8rem}.pagination{display:-ms-flexbox;display:flex;list-style:none;margin:.2rem 0;padding:.2rem 0}.pagination .page-item{margin:.2rem .05rem}.pagination .page-item span{display:inline-block;padding:.2rem .2rem}.pagination .page-item a{border-radius:.1rem;display:inline-block;padding:.2rem .4rem;text-decoration:none}.pagination .page-item a:focus,.pagination .page-item a:hover{color:#5755d9}.pagination .page-item.disabled a{cursor:default;opacity:.5;pointer-events:none}.pagination .page-item.active a{background:#5755d9;color:#fff}.pagination .page-item.page-next,.pagination .page-item.page-prev{-ms-flex:1 0 50%;flex:1 0 50%}.pagination .page-item.page-next{text-align:right}.pagination .page-item .page-item-title{margin:0}.pagination .page-item .page-item-subtitle{margin:0;opacity:.5}.panel{border:.05rem solid #dadee4;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.panel .panel-footer,.panel .panel-header{-ms-flex:0 0 auto;flex:0 0 auto;padding:.8rem}.panel .panel-nav{-ms-flex:0 0 auto;flex:0 0 auto}.panel .panel-body{-ms-flex:1 1 auto;flex:1 1 auto;overflow-y:auto;padding:0 .8rem}.popover{display:inline-block;position:relative}.popover .popover-container{left:50%;opacity:0;padding:.4rem;position:absolute;top:0;transform:translate(-50%,-50%) scale(0);transition:transform .2s;width:320px;z-index:300}.popover :focus+.popover-container,.popover:hover .popover-container{display:block;opacity:1;transform:translate(-50%,-100%) scale(1)}.popover.popover-right .popover-container{left:100%;top:50%}.popover.popover-right :focus+.popover-container,.popover.popover-right:hover .popover-container{transform:translate(0,-50%) scale(1)}.popover.popover-bottom .popover-container{left:50%;top:100%}.popover.popover-bottom :focus+.popover-container,.popover.popover-bottom:hover .popover-container{transform:translate(-50%,0) scale(1)}.popover.popover-left .popover-container{left:0;top:50%}.popover.popover-left :focus+.popover-container,.popover.popover-left:hover .popover-container{transform:translate(-100%,-50%) scale(1)}.popover .card{border:0;box-shadow:0 .2rem .5rem rgba(48,55,66,.3)}.step{display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;list-style:none;margin:.2rem 0;width:100%}.step .step-item{-ms-flex:1 1 0;flex:1 1 0;margin-top:0;min-height:1rem;position:relative;text-align:center}.step .step-item:not(:first-child)::before{background:#5755d9;content:"";height:2px;left:-50%;position:absolute;top:9px;width:100%}.step .step-item a{color:#5755d9;display:inline-block;padding:20px 10px 0;text-decoration:none}.step .step-item a::before{background:#5755d9;border:.1rem solid #fff;border-radius:50%;content:"";display:block;height:.6rem;left:50%;position:absolute;top:.2rem;transform:translateX(-50%);width:.6rem;z-index:1}.step .step-item.active a::before{background:#fff;border:.1rem solid #5755d9}.step .step-item.active~.step-item::before{background:#dadee4}.step .step-item.active~.step-item a{color:#bcc3ce}.step .step-item.active~.step-item a::before{background:#dadee4}.tab{align-items:center;border-bottom:.05rem solid #dadee4;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-wrap:wrap;flex-wrap:wrap;list-style:none;margin:.2rem 0 .15rem 0}.tab .tab-item{margin-top:0}.tab .tab-item a{border-bottom:.1rem solid transparent;color:inherit;display:block;margin:0 .4rem 0 0;padding:.4rem .2rem .3rem .2rem;text-decoration:none}.tab .tab-item a:focus,.tab .tab-item a:hover{color:#5755d9}.tab .tab-item a.active,.tab .tab-item.active a{border-bottom-color:#5755d9;color:#5755d9}.tab .tab-item.tab-action{-ms-flex:1 0 auto;flex:1 0 auto;text-align:right}.tab .tab-item .btn-clear{margin-top:-.2rem}.tab.tab-block .tab-item{-ms-flex:1 0 0;flex:1 0 0;text-align:center}.tab.tab-block .tab-item a{margin:0}.tab.tab-block .tab-item .badge[data-badge]::after{position:absolute;right:.1rem;top:.1rem;transform:translate(0,0)}.tab:not(.tab-block) .badge{padding-right:0}.tile{align-content:space-between;align-items:flex-start;display:-ms-flexbox;display:flex;-ms-flex-align:start;-ms-flex-line-pack:justify}.tile .tile-action,.tile .tile-icon{-ms-flex:0 0 auto;flex:0 0 auto}.tile .tile-content{-ms-flex:1 1 auto;flex:1 1 auto}.tile .tile-content:not(:first-child){padding-left:.4rem}.tile .tile-content:not(:last-child){padding-right:.4rem}.tile .tile-subtitle,.tile .tile-title{line-height:1.2rem}.tile.tile-centered{align-items:center;-ms-flex-align:center}.tile.tile-centered .tile-content{overflow:hidden}.tile.tile-centered .tile-subtitle,.tile.tile-centered .tile-title{margin-bottom:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.toast{background:rgba(48,55,66,.95);border:.05rem solid #303742;border-color:#303742;border-radius:.1rem;color:#fff;display:block;padding:.4rem;width:100%}.toast.toast-primary{background:rgba(87,85,217,.95);border-color:#5755d9}.toast.toast-success{background:rgba(50,182,67,.95);border-color:#32b643}.toast.toast-warning{background:rgba(255,183,0,.95);border-color:#ffb700}.toast.toast-error{background:rgba(232,86,0,.95);border-color:#e85600}.toast a{color:#fff;text-decoration:underline}.toast a.active,.toast a:active,.toast a:focus,.toast a:hover{opacity:.75}.toast .btn-clear{margin:.1rem}.toast p:last-child{margin-bottom:0}.tooltip{position:relative}.tooltip::after{background:rgba(48,55,66,.95);border-radius:.1rem;bottom:100%;color:#fff;content:attr(data-tooltip);display:block;font-size:.7rem;left:50%;max-width:320px;opacity:0;overflow:hidden;padding:.2rem .4rem;pointer-events:none;position:absolute;text-overflow:ellipsis;transform:translate(-50%,.4rem);transition:opacity .2s,transform .2s;white-space:pre;z-index:300}.tooltip:focus::after,.tooltip:hover::after{opacity:1;transform:translate(-50%,-.2rem)}.tooltip.disabled,.tooltip[disabled]{pointer-events:auto}.tooltip.tooltip-right::after{bottom:50%;left:100%;transform:translate(-.2rem,50%)}.tooltip.tooltip-right:focus::after,.tooltip.tooltip-right:hover::after{transform:translate(.2rem,50%)}.tooltip.tooltip-bottom::after{bottom:auto;top:100%;transform:translate(-50%,-.4rem)}.tooltip.tooltip-bottom:focus::after,.tooltip.tooltip-bottom:hover::after{transform:translate(-50%,.2rem)}.tooltip.tooltip-left::after{bottom:50%;left:auto;right:100%;transform:translate(.4rem,50%)}.tooltip.tooltip-left:focus::after,.tooltip.tooltip-left:hover::after{transform:translate(-.2rem,50%)}@keyframes loading{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes slide-down{0%{opacity:0;transform:translateY(-1.6rem)}100%{opacity:1;transform:translateY(0)}}.text-primary{color:#5755d9!important}a.text-primary:focus,a.text-primary:hover{color:#4240d4}a.text-primary:visited{color:#6c6ade}.text-secondary{color:#e5e5f9!important}a.text-secondary:focus,a.text-secondary:hover{color:#d1d0f4}a.text-secondary:visited{color:#fafafe}.text-gray{color:#bcc3ce!important}a.text-gray:focus,a.text-gray:hover{color:#adb6c4}a.text-gray:visited{color:#cbd0d9}.text-light{color:#fff!important}a.text-light:focus,a.text-light:hover{color:#f2f2f2}a.text-light:visited{color:#fff}.text-dark{color:#3b4351!important}a.text-dark:focus,a.text-dark:hover{color:#303742}a.text-dark:visited{color:#455060}.text-success{color:#32b643!important}a.text-success:focus,a.text-success:hover{color:#2da23c}a.text-success:visited{color:#39c94b}.text-warning{color:#ffb700!important}a.text-warning:focus,a.text-warning:hover{color:#e6a500}a.text-warning:visited{color:#ffbe1a}.text-error{color:#e85600!important}a.text-error:focus,a.text-error:hover{color:#cf4d00}a.text-error:visited{color:#ff6003}.bg-primary{background:#5755d9!important;color:#fff}.bg-secondary{background:#f1f1fc!important}.bg-dark{background:#303742!important;color:#fff}.bg-gray{background:#f7f8f9!important}.bg-success{background:#32b643!important;color:#fff}.bg-warning{background:#ffb700!important;color:#fff}.bg-error{background:#e85600!important;color:#fff}.c-hand{cursor:pointer}.c-move{cursor:move}.c-zoom-in{cursor:zoom-in}.c-zoom-out{cursor:zoom-out}.c-not-allowed{cursor:not-allowed}.c-auto{cursor:auto}.d-block{display:block}.d-inline{display:inline}.d-inline-block{display:inline-block}.d-flex{display:-ms-flexbox;display:flex}.d-inline-flex{display:-ms-inline-flexbox;display:inline-flex}.d-hide,.d-none{display:none!important}.d-visible{visibility:visible}.d-invisible{visibility:hidden}.text-hide{background:0 0;border:0;color:transparent;font-size:0;line-height:0;text-shadow:none}.text-assistive{border:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.divider,.divider-vert{display:block;position:relative}.divider-vert[data-content]::after,.divider[data-content]::after{background:#fff;color:#bcc3ce;content:attr(data-content);display:inline-block;font-size:.7rem;padding:0 .4rem;transform:translateY(-.65rem)}.divider{border-top:.05rem solid #f1f3f5;height:.05rem;margin:.4rem 0}.divider[data-content]{margin:.8rem 0}.divider-vert{display:block;padding:.8rem}.divider-vert::before{border-left:.05rem solid #dadee4;bottom:.4rem;content:"";display:block;left:50%;position:absolute;top:.4rem;transform:translateX(-50%)}.divider-vert[data-content]::after{left:50%;padding:.2rem 0;position:absolute;top:50%;transform:translate(-50%,-50%)}.loading{color:transparent!important;min-height:.8rem;pointer-events:none;position:relative}.loading::after{animation:loading .5s infinite linear;background:0 0;border:.1rem solid #5755d9;border-radius:50%;border-right-color:transparent;border-top-color:transparent;content:"";display:block;height:.8rem;left:50%;margin-left:-.4rem;margin-top:-.4rem;opacity:1;padding:0;position:absolute;top:50%;width:.8rem;z-index:1}.loading.loading-lg{min-height:2rem}.loading.loading-lg::after{height:1.6rem;margin-left:-.8rem;margin-top:-.8rem;width:1.6rem}.clearfix::after{clear:both;content:"";display:table}.float-left{float:left!important}.float-right{float:right!important}.p-relative{position:relative!important}.p-absolute{position:absolute!important}.p-fixed{position:fixed!important}.p-sticky{position:-webkit-sticky!important;position:sticky!important}.p-centered{display:block;float:none;margin-left:auto;margin-right:auto}.flex-centered{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;justify-content:center}.m-0{margin:0!important}.mb-0{margin-bottom:0!important}.ml-0{margin-left:0!important}.mr-0{margin-right:0!important}.mt-0{margin-top:0!important}.mx-0{margin-left:0!important;margin-right:0!important}.my-0{margin-bottom:0!important;margin-top:0!important}.m-1{margin:.2rem!important}.mb-1{margin-bottom:.2rem!important}.ml-1{margin-left:.2rem!important}.mr-1{margin-right:.2rem!important}.mt-1{margin-top:.2rem!important}.mx-1{margin-left:.2rem!important;margin-right:.2rem!important}.my-1{margin-bottom:.2rem!important;margin-top:.2rem!important}.m-2{margin:.4rem!important}.mb-2{margin-bottom:.4rem!important}.ml-2{margin-left:.4rem!important}.mr-2{margin-right:.4rem!important}.mt-2{margin-top:.4rem!important}.mx-2{margin-left:.4rem!important;margin-right:.4rem!important}.my-2{margin-bottom:.4rem!important;margin-top:.4rem!important}.p-0{padding:0!important}.pb-0{padding-bottom:0!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.pt-0{padding-top:0!important}.px-0{padding-left:0!important;padding-right:0!important}.py-0{padding-bottom:0!important;padding-top:0!important}.p-1{padding:.2rem!important}.pb-1{padding-bottom:.2rem!important}.pl-1{padding-left:.2rem!important}.pr-1{padding-right:.2rem!important}.pt-1{padding-top:.2rem!important}.px-1{padding-left:.2rem!important;padding-right:.2rem!important}.py-1{padding-bottom:.2rem!important;padding-top:.2rem!important}.p-2{padding:.4rem!important}.pb-2{padding-bottom:.4rem!important}.pl-2{padding-left:.4rem!important}.pr-2{padding-right:.4rem!important}.pt-2{padding-top:.4rem!important}.px-2{padding-left:.4rem!important;padding-right:.4rem!important}.py-2{padding-bottom:.4rem!important;padding-top:.4rem!important}.s-rounded{border-radius:.1rem}.s-circle{border-radius:50%}.text-left{text-align:left}.text-right{text-align:right}.text-center{text-align:center}.text-justify{text-align:justify}.text-lowercase{text-transform:lowercase}.text-uppercase{text-transform:uppercase}.text-capitalize{text-transform:capitalize}.text-normal{font-weight:400}.text-bold{font-weight:700}.text-italic{font-style:italic}.text-large{font-size:1.2em}.text-small{font-size:.9em}.text-tiny{font-size:.8em}.text-muted{opacity:.8}.text-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.text-clip{overflow:hidden;text-overflow:clip;white-space:nowrap}.text-break{-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;word-break:break-word;word-wrap:break-word} \ No newline at end of file +html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}address{font-style:normal}b,strong{font-weight:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:"SF Mono","Segoe UI Mono","Roboto Mono",Menlo,Courier,monospace;font-size:1em}dfn{font-style:italic}small{font-size:80%;font-weight:400}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}fieldset{border:0;margin:0;padding:0}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item;outline:0}canvas{display:inline-block}template{display:none}[hidden]{display:none}*,::after,::before{box-sizing:inherit}html{box-sizing:border-box;font-size:20px;line-height:1.5;-webkit-tap-highlight-color:transparent}body{background:#fff;color:#3b4351;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;font-size:.8rem;overflow-x:hidden;text-rendering:optimizeLegibility}a{color:#5755d9;outline:0;text-decoration:none}a:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}a.active,a:active,a:focus,a:hover{color:#302ecd;text-decoration:underline}a:visited{color:#807fe2}h1,h2,h3,h4,h5,h6{color:inherit;font-weight:500;line-height:1.2;margin-bottom:.5em;margin-top:0}.h1,.h2,.h3,.h4,.h5,.h6{font-weight:500}.h1,h1{font-size:2rem}.h2,h2{font-size:1.6rem}.h3,h3{font-size:1.4rem}.h4,h4{font-size:1.2rem}.h5,h5{font-size:1rem}.h6,h6{font-size:.8rem}p{margin:0 0 1.2rem}a,ins,u{text-decoration-skip:ink edges}abbr[title]{border-bottom:.05rem dotted;cursor:help;text-decoration:none}kbd{background:#303742;border-radius:.1rem;color:#fff;font-size:.7rem;line-height:1.25;padding:.1rem .2rem}mark{background:#ffe9b3;border-bottom:.05rem solid #ffd367;border-radius:.1rem;color:#3b4351;padding:.05rem .1rem 0}blockquote{border-left:.1rem solid #dadee4;margin-left:0;padding:.4rem .8rem}blockquote p:last-child{margin-bottom:0}ol,ul{margin:.8rem 0 .8rem .8rem;padding:0}ol ol,ol ul,ul ol,ul ul{margin:.8rem 0 .8rem .8rem}ol li,ul li{margin-top:.4rem}ul{list-style:disc inside}ul ul{list-style-type:circle}ol{list-style:decimal inside}ol ol{list-style-type:lower-alpha}dl dt{font-weight:700}dl dd{margin:.4rem 0 .8rem 0}.lang-zh,.lang-zh-hans,html:lang(zh),html:lang(zh-Hans){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",sans-serif}.lang-zh-hant,html:lang(zh-Hant){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang TC","Hiragino Sans CNS","Microsoft JhengHei","Helvetica Neue",sans-serif}.lang-ja,html:lang(ja){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Hiragino Sans","Hiragino Kaku Gothic Pro","Yu Gothic",YuGothic,Meiryo,"Helvetica Neue",sans-serif}.lang-ko,html:lang(ko){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Malgun Gothic","Helvetica Neue",sans-serif}.lang-cjk ins,.lang-cjk u,:lang(ja) ins,:lang(ja) u,:lang(zh) ins,:lang(zh) u{border-bottom:.05rem solid;text-decoration:none}.lang-cjk del+del,.lang-cjk del+s,.lang-cjk ins+ins,.lang-cjk ins+u,.lang-cjk s+del,.lang-cjk s+s,.lang-cjk u+ins,.lang-cjk u+u,:lang(ja) del+del,:lang(ja) del+s,:lang(ja) ins+ins,:lang(ja) ins+u,:lang(ja) s+del,:lang(ja) s+s,:lang(ja) u+ins,:lang(ja) u+u,:lang(zh) del+del,:lang(zh) del+s,:lang(zh) ins+ins,:lang(zh) ins+u,:lang(zh) s+del,:lang(zh) s+s,:lang(zh) u+ins,:lang(zh) u+u{margin-left:.125em}.table{border-collapse:collapse;border-spacing:0;text-align:left;width:100%}.table.table-striped tbody tr:nth-of-type(odd){background:#f7f8f9}.table tbody tr.active,.table.table-striped tbody tr.active{background:#eef0f3}.table.table-hover tbody tr:hover{background:#eef0f3}.table.table-scroll{display:block;overflow-x:auto;padding-bottom:.75rem;white-space:nowrap}.table td,.table th{border-bottom:.05rem solid #dadee4;padding:.6rem .4rem}.table th{border-bottom-width:.1rem}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:.05rem solid #5755d9;border-radius:.1rem;color:#5755d9;cursor:pointer;display:inline-block;font-size:.8rem;height:1.8rem;line-height:1.2rem;outline:0;padding:.25rem .4rem;text-align:center;text-decoration:none;transition:background .2s,border .2s,box-shadow .2s,color .2s;-webkit-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap}.btn:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.btn:focus,.btn:hover{background:#f1f1fc;border-color:#4b48d6;text-decoration:none}.btn.active,.btn:active{background:#4b48d6;border-color:#3634d2;color:#fff;text-decoration:none}.btn.active.loading::after,.btn:active.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.disabled,.btn:disabled,.btn[disabled]{cursor:default;opacity:.5;pointer-events:none}.btn.btn-primary{background:#5755d9;border-color:#4b48d6;color:#fff}.btn.btn-primary:focus,.btn.btn-primary:hover{background:#4240d4;border-color:#3634d2;color:#fff}.btn.btn-primary.active,.btn.btn-primary:active{background:#3a38d2;border-color:#302ecd;color:#fff}.btn.btn-primary.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-success{background:#32b643;border-color:#2faa3f;color:#fff}.btn.btn-success:focus{box-shadow:0 0 0 .1rem rgba(50,182,67,.2)}.btn.btn-success:focus,.btn.btn-success:hover{background:#30ae40;border-color:#2da23c;color:#fff}.btn.btn-success.active,.btn.btn-success:active{background:#2a9a39;border-color:#278e34;color:#fff}.btn.btn-success.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-error{background:#e85600;border-color:#d95000;color:#fff}.btn.btn-error:focus{box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.btn.btn-error:focus,.btn.btn-error:hover{background:#de5200;border-color:#cf4d00;color:#fff}.btn.btn-error.active,.btn.btn-error:active{background:#c44900;border-color:#b54300;color:#fff}.btn.btn-error.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-link{background:0 0;border-color:transparent;color:#5755d9}.btn.btn-link.active,.btn.btn-link:active,.btn.btn-link:focus,.btn.btn-link:hover{color:#302ecd}.btn.btn-sm{font-size:.7rem;height:1.4rem;padding:.05rem .3rem}.btn.btn-lg{font-size:.9rem;height:2rem;padding:.35rem .6rem}.btn.btn-block{display:block;width:100%}.btn.btn-action{padding-left:0;padding-right:0;width:1.8rem}.btn.btn-action.btn-sm{width:1.4rem}.btn.btn-action.btn-lg{width:2rem}.btn.btn-clear{background:0 0;border:0;color:currentColor;height:1rem;line-height:.8rem;margin-left:.2rem;margin-right:-2px;opacity:1;padding:.1rem;text-decoration:none;width:1rem}.btn.btn-clear:focus,.btn.btn-clear:hover{background:rgba(247,248,249,.5);opacity:.95}.btn.btn-clear::before{content:"✕"}.btn-group{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.btn-group .btn{-ms-flex:1 0 auto;flex:1 0 auto}.btn-group .btn:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.btn-group .btn:not(:first-child):not(:last-child){border-radius:0;margin-left:-.05rem}.btn-group .btn:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-.05rem}.btn-group .btn.active,.btn-group .btn:active,.btn-group .btn:focus,.btn-group .btn:hover{z-index:1}.btn-group.btn-group-block{display:-ms-flexbox;display:flex}.btn-group.btn-group-block .btn{-ms-flex:1 0 0;flex:1 0 0}.form-group:not(:last-child){margin-bottom:.4rem}fieldset{margin-bottom:.8rem}legend{font-size:.9rem;font-weight:500;margin-bottom:.8rem}.form-label{display:block;line-height:1.2rem;padding:.3rem 0}.form-label.label-sm{font-size:.7rem;padding:.1rem 0}.form-label.label-lg{font-size:.9rem;padding:.4rem 0}.form-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;background-image:none;border:.05rem solid #bcc3ce;border-radius:.1rem;color:#3b4351;display:block;font-size:.8rem;height:1.8rem;line-height:1.2rem;max-width:100%;outline:0;padding:.25rem .4rem;position:relative;transition:background .2s,border .2s,box-shadow .2s,color .2s;width:100%}.form-input:focus{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-input:-ms-input-placeholder{color:#bcc3ce}.form-input::-ms-input-placeholder{color:#bcc3ce}.form-input::placeholder{color:#bcc3ce}.form-input.input-sm{font-size:.7rem;height:1.4rem;padding:.05rem .3rem}.form-input.input-lg{font-size:.9rem;height:2rem;padding:.35rem .6rem}.form-input.input-inline{display:inline-block;vertical-align:middle;width:auto}.form-input[type=file]{height:auto}textarea.form-input,textarea.form-input.input-lg,textarea.form-input.input-sm{height:auto}.form-input-hint{color:#bcc3ce;font-size:.7rem;margin-top:.2rem}.has-success .form-input-hint,.is-success+.form-input-hint{color:#32b643}.has-error .form-input-hint,.is-error+.form-input-hint{color:#e85600}.form-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:.05rem solid #bcc3ce;border-radius:.1rem;color:inherit;font-size:.8rem;height:1.8rem;line-height:1.2rem;outline:0;padding:.25rem .4rem;vertical-align:middle;width:100%}.form-select:focus{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-select::-ms-expand{display:none}.form-select.select-sm{font-size:.7rem;height:1.4rem;padding:.05rem 1.1rem .05rem .3rem}.form-select.select-lg{font-size:.9rem;height:2rem;padding:.35rem 1.4rem .35rem .6rem}.form-select[multiple],.form-select[size]{height:auto;padding:.25rem .4rem}.form-select[multiple] option,.form-select[size] option{padding:.1rem .2rem}.form-select:not([multiple]):not([size]){background:#fff url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center/.4rem .5rem;padding-right:1.2rem}.has-icon-left,.has-icon-right{position:relative}.has-icon-left .form-icon,.has-icon-right .form-icon{height:.8rem;margin:0 .25rem;position:absolute;top:50%;transform:translateY(-50%);width:.8rem;z-index:2}.has-icon-left .form-icon{left:.05rem}.has-icon-left .form-input{padding-left:1.3rem}.has-icon-right .form-icon{right:.05rem}.has-icon-right .form-input{padding-right:1.3rem}.form-checkbox,.form-radio,.form-switch{display:block;line-height:1.2rem;margin:.2rem 0;min-height:1.4rem;padding:.1rem .4rem .1rem 1.2rem;position:relative}.form-checkbox input,.form-radio input,.form-switch input{clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;position:absolute;width:1px}.form-checkbox input:focus+.form-icon,.form-radio input:focus+.form-icon,.form-switch input:focus+.form-icon{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-checkbox input:checked+.form-icon,.form-radio input:checked+.form-icon,.form-switch input:checked+.form-icon{background:#5755d9;border-color:#5755d9}.form-checkbox .form-icon,.form-radio .form-icon,.form-switch .form-icon{border:.05rem solid #bcc3ce;cursor:pointer;display:inline-block;position:absolute;transition:background .2s,border .2s,box-shadow .2s,color .2s}.form-checkbox.input-sm,.form-radio.input-sm,.form-switch.input-sm{font-size:.7rem;margin:0}.form-checkbox.input-lg,.form-radio.input-lg,.form-switch.input-lg{font-size:.9rem;margin:.3rem 0}.form-checkbox .form-icon,.form-radio .form-icon{background:#fff;height:.8rem;left:0;top:.3rem;width:.8rem}.form-checkbox input:active+.form-icon,.form-radio input:active+.form-icon{background:#eef0f3}.form-checkbox .form-icon{border-radius:.1rem}.form-checkbox input:checked+.form-icon::before{background-clip:padding-box;border:.1rem solid #fff;border-left-width:0;border-top-width:0;content:"";height:9px;left:50%;margin-left:-3px;margin-top:-6px;position:absolute;top:50%;transform:rotate(45deg);width:6px}.form-checkbox input:indeterminate+.form-icon{background:#5755d9;border-color:#5755d9}.form-checkbox input:indeterminate+.form-icon::before{background:#fff;content:"";height:2px;left:50%;margin-left:-5px;margin-top:-1px;position:absolute;top:50%;width:10px}.form-radio .form-icon{border-radius:50%}.form-radio input:checked+.form-icon::before{background:#fff;border-radius:50%;content:"";height:6px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:6px}.form-switch{padding-left:2rem}.form-switch .form-icon{background:#bcc3ce;background-clip:padding-box;border-radius:.45rem;height:.9rem;left:0;top:.25rem;width:1.6rem}.form-switch .form-icon::before{background:#fff;border-radius:50%;content:"";display:block;height:.8rem;left:0;position:absolute;top:0;transition:background .2s,border .2s,box-shadow .2s,color .2s,left .2s;width:.8rem}.form-switch input:checked+.form-icon::before{left:14px}.form-switch input:active+.form-icon::before{background:#f7f8f9}.input-group{display:-ms-flexbox;display:flex}.input-group .input-group-addon{background:#f7f8f9;border:.05rem solid #bcc3ce;border-radius:.1rem;line-height:1.2rem;padding:.25rem .4rem;white-space:nowrap}.input-group .input-group-addon.addon-sm{font-size:.7rem;padding:.05rem .3rem}.input-group .input-group-addon.addon-lg{font-size:.9rem;padding:.35rem .6rem}.input-group .form-input,.input-group .form-select{-ms-flex:1 1 auto;flex:1 1 auto;width:1%}.input-group .input-group-btn{z-index:1}.input-group .form-input:first-child:not(:last-child),.input-group .form-select:first-child:not(:last-child),.input-group .input-group-addon:first-child:not(:last-child),.input-group .input-group-btn:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.input-group .form-input:not(:first-child):not(:last-child),.input-group .form-select:not(:first-child):not(:last-child),.input-group .input-group-addon:not(:first-child):not(:last-child),.input-group .input-group-btn:not(:first-child):not(:last-child){border-radius:0;margin-left:-.05rem}.input-group .form-input:last-child:not(:first-child),.input-group .form-select:last-child:not(:first-child),.input-group .input-group-addon:last-child:not(:first-child),.input-group .input-group-btn:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-.05rem}.input-group .form-input:focus,.input-group .form-select:focus,.input-group .input-group-addon:focus,.input-group .input-group-btn:focus{z-index:2}.input-group .form-select{width:auto}.input-group.input-inline{display:-ms-inline-flexbox;display:inline-flex}.form-input.is-success,.form-select.is-success,.has-success .form-input,.has-success .form-select{background:#f9fdfa;border-color:#32b643}.form-input.is-success:focus,.form-select.is-success:focus,.has-success .form-input:focus,.has-success .form-select:focus{box-shadow:0 0 0 .1rem rgba(50,182,67,.2)}.form-input.is-error,.form-select.is-error,.has-error .form-input,.has-error .form-select{background:#fffaf7;border-color:#e85600}.form-input.is-error:focus,.form-select.is-error:focus,.has-error .form-input:focus,.has-error .form-select:focus{box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-checkbox.is-error .form-icon,.form-radio.is-error .form-icon,.form-switch.is-error .form-icon,.has-error .form-checkbox .form-icon,.has-error .form-radio .form-icon,.has-error .form-switch .form-icon{border-color:#e85600}.form-checkbox.is-error input:checked+.form-icon,.form-radio.is-error input:checked+.form-icon,.form-switch.is-error input:checked+.form-icon,.has-error .form-checkbox input:checked+.form-icon,.has-error .form-radio input:checked+.form-icon,.has-error .form-switch input:checked+.form-icon{background:#e85600;border-color:#e85600}.form-checkbox.is-error input:focus+.form-icon,.form-radio.is-error input:focus+.form-icon,.form-switch.is-error input:focus+.form-icon,.has-error .form-checkbox input:focus+.form-icon,.has-error .form-radio input:focus+.form-icon,.has-error .form-switch input:focus+.form-icon{border-color:#e85600;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-checkbox.is-error input:indeterminate+.form-icon,.has-error .form-checkbox input:indeterminate+.form-icon{background:#e85600;border-color:#e85600}.form-input:not(:-ms-input-placeholder):invalid{border-color:#e85600}.form-input:not(:placeholder-shown):invalid{border-color:#e85600}.form-input:not(:-ms-input-placeholder):invalid:focus{background:#fffaf7;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-input:not(:placeholder-shown):invalid:focus{background:#fffaf7;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-input:not(:-ms-input-placeholder):invalid+.form-input-hint{color:#e85600}.form-input:not(:placeholder-shown):invalid+.form-input-hint{color:#e85600}.form-input.disabled,.form-input:disabled,.form-select.disabled,.form-select:disabled{background-color:#eef0f3;cursor:not-allowed;opacity:.5}.form-input[readonly]{background-color:#f7f8f9}input.disabled+.form-icon,input:disabled+.form-icon{background:#eef0f3;cursor:not-allowed;opacity:.5}.form-switch input.disabled+.form-icon::before,.form-switch input:disabled+.form-icon::before{background:#fff}.form-horizontal{padding:.4rem 0}.form-horizontal .form-group{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.form-inline{display:inline-block}.label{background:#eef0f3;border-radius:.1rem;color:#455060;display:inline-block;line-height:1.25;padding:.1rem .2rem}.label.label-rounded{border-radius:5rem;padding-left:.4rem;padding-right:.4rem}.label.label-primary{background:#5755d9;color:#fff}.label.label-secondary{background:#f1f1fc;color:#5755d9}.label.label-success{background:#32b643;color:#fff}.label.label-warning{background:#ffb700;color:#fff}.label.label-error{background:#e85600;color:#fff}code{background:#fcf2f2;border-radius:.1rem;color:#d73e48;font-size:85%;line-height:1.25;padding:.1rem .2rem}.code{border-radius:.1rem;color:#3b4351;position:relative}.code::before{color:#bcc3ce;content:attr(data-lang);font-size:.7rem;position:absolute;right:.4rem;top:.1rem}.code code{background:#f7f8f9;color:inherit;display:block;line-height:1.5;overflow-x:auto;padding:1rem;width:100%}.img-responsive{display:block;height:auto;max-width:100%}.img-fit-cover{object-fit:cover}.img-fit-contain{object-fit:contain}.video-responsive{display:block;overflow:hidden;padding:0;position:relative;width:100%}.video-responsive::before{content:"";display:block;padding-bottom:56.25%}.video-responsive embed,.video-responsive iframe,.video-responsive object{border:0;bottom:0;height:100%;left:0;position:absolute;right:0;top:0;width:100%}video.video-responsive{height:auto;max-width:100%}video.video-responsive::before{content:none}.video-responsive-4-3::before{padding-bottom:75%}.video-responsive-1-1::before{padding-bottom:100%}.figure{margin:0 0 .4rem 0}.figure .figure-caption{color:#66758c;margin-top:.4rem}.container{margin-left:auto;margin-right:auto;padding-left:.4rem;padding-right:.4rem;width:100%}.container.grid-xl{max-width:1296px}.container.grid-lg{max-width:976px}.container.grid-md{max-width:856px}.container.grid-sm{max-width:616px}.container.grid-xs{max-width:496px}.show-lg,.show-md,.show-sm,.show-xl,.show-xs{display:none!important}.cols,.columns{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-left:-.4rem;margin-right:-.4rem}.cols.col-gapless,.columns.col-gapless{margin-left:0;margin-right:0}.cols.col-gapless>.column,.columns.col-gapless>.column{padding-left:0;padding-right:0}.cols.col-oneline,.columns.col-oneline{-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto}.column,[class~=col-]{-ms-flex:1;flex:1;max-width:100%;padding-left:.4rem;padding-right:.4rem}.column.col-1,.column.col-10,.column.col-11,.column.col-12,.column.col-2,.column.col-3,.column.col-4,.column.col-5,.column.col-6,.column.col-7,.column.col-8,.column.col-9,.column.col-auto,[class~=col-].col-1,[class~=col-].col-10,[class~=col-].col-11,[class~=col-].col-12,[class~=col-].col-2,[class~=col-].col-3,[class~=col-].col-4,[class~=col-].col-5,[class~=col-].col-6,[class~=col-].col-7,[class~=col-].col-8,[class~=col-].col-9,[class~=col-].col-auto{-ms-flex:none;flex:none}.col-12{width:100%}.col-11{width:91.66666667%}.col-10{width:83.33333333%}.col-9{width:75%}.col-8{width:66.66666667%}.col-7{width:58.33333333%}.col-6{width:50%}.col-5{width:41.66666667%}.col-4{width:33.33333333%}.col-3{width:25%}.col-2{width:16.66666667%}.col-1{width:8.33333333%}.col-auto{-ms-flex:0 0 auto;flex:0 0 auto;max-width:none;width:auto}.col-mx-auto{margin-left:auto;margin-right:auto}.col-ml-auto{margin-left:auto}.col-mr-auto{margin-right:auto}@media(max-width:1280px){.col-xl-1,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-auto{-ms-flex:none;flex:none}.col-xl-12{width:100%}.col-xl-11{width:91.66666667%}.col-xl-10{width:83.33333333%}.col-xl-9{width:75%}.col-xl-8{width:66.66666667%}.col-xl-7{width:58.33333333%}.col-xl-6{width:50%}.col-xl-5{width:41.66666667%}.col-xl-4{width:33.33333333%}.col-xl-3{width:25%}.col-xl-2{width:16.66666667%}.col-xl-1{width:8.33333333%}.col-xl-auto{width:auto}.hide-xl{display:none!important}.show-xl{display:block!important}}@media(max-width:960px){.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-auto{-ms-flex:none;flex:none}.col-lg-12{width:100%}.col-lg-11{width:91.66666667%}.col-lg-10{width:83.33333333%}.col-lg-9{width:75%}.col-lg-8{width:66.66666667%}.col-lg-7{width:58.33333333%}.col-lg-6{width:50%}.col-lg-5{width:41.66666667%}.col-lg-4{width:33.33333333%}.col-lg-3{width:25%}.col-lg-2{width:16.66666667%}.col-lg-1{width:8.33333333%}.col-lg-auto{width:auto}.hide-lg{display:none!important}.show-lg{display:block!important}}@media(max-width:840px){.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-auto{-ms-flex:none;flex:none}.col-md-12{width:100%}.col-md-11{width:91.66666667%}.col-md-10{width:83.33333333%}.col-md-9{width:75%}.col-md-8{width:66.66666667%}.col-md-7{width:58.33333333%}.col-md-6{width:50%}.col-md-5{width:41.66666667%}.col-md-4{width:33.33333333%}.col-md-3{width:25%}.col-md-2{width:16.66666667%}.col-md-1{width:8.33333333%}.col-md-auto{width:auto}.hide-md{display:none!important}.show-md{display:block!important}}@media(max-width:600px){.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-auto{-ms-flex:none;flex:none}.col-sm-12{width:100%}.col-sm-11{width:91.66666667%}.col-sm-10{width:83.33333333%}.col-sm-9{width:75%}.col-sm-8{width:66.66666667%}.col-sm-7{width:58.33333333%}.col-sm-6{width:50%}.col-sm-5{width:41.66666667%}.col-sm-4{width:33.33333333%}.col-sm-3{width:25%}.col-sm-2{width:16.66666667%}.col-sm-1{width:8.33333333%}.col-sm-auto{width:auto}.hide-sm{display:none!important}.show-sm{display:block!important}}@media(max-width:480px){.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-auto{-ms-flex:none;flex:none}.col-xs-12{width:100%}.col-xs-11{width:91.66666667%}.col-xs-10{width:83.33333333%}.col-xs-9{width:75%}.col-xs-8{width:66.66666667%}.col-xs-7{width:58.33333333%}.col-xs-6{width:50%}.col-xs-5{width:41.66666667%}.col-xs-4{width:33.33333333%}.col-xs-3{width:25%}.col-xs-2{width:16.66666667%}.col-xs-1{width:8.33333333%}.col-xs-auto{width:auto}.hide-xs{display:none!important}.show-xs{display:block!important}}.hero{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:4rem;padding-top:4rem}.hero.hero-sm{padding-bottom:2rem;padding-top:2rem}.hero.hero-lg{padding-bottom:8rem;padding-top:8rem}.hero .hero-body{padding:.4rem}.navbar{align-items:stretch;display:-ms-flexbox;display:flex;-ms-flex-align:stretch;-ms-flex-pack:justify;-ms-flex-wrap:wrap;flex-wrap:wrap;justify-content:space-between}.navbar .navbar-section{align-items:center;display:-ms-flexbox;display:flex;-ms-flex:1 0 0;flex:1 0 0;-ms-flex-align:center}.navbar .navbar-section:not(:first-child):last-child{-ms-flex-pack:end;justify-content:flex-end}.navbar .navbar-center{align-items:center;display:-ms-flexbox;display:flex;-ms-flex:0 0 auto;flex:0 0 auto;-ms-flex-align:center}.navbar .navbar-brand{font-size:.9rem;text-decoration:none}.accordion input:checked~.accordion-header>.icon:first-child,.accordion[open] .accordion-header>.icon:first-child{transform:rotate(90deg)}.accordion input:checked~.accordion-body,.accordion[open] .accordion-body{max-height:50rem}.accordion .accordion-header{display:block;padding:.2rem .4rem}.accordion .accordion-header .icon{transition:transform .25s}.accordion .accordion-body{margin-bottom:.4rem;max-height:0;overflow:hidden;transition:max-height .25s}summary.accordion-header::-webkit-details-marker{display:none}.avatar{background:#5755d9;border-radius:50%;color:rgba(255,255,255,.85);display:inline-block;font-size:.8rem;font-weight:300;height:1.6rem;line-height:1.25;margin:0;position:relative;vertical-align:middle;width:1.6rem}.avatar.avatar-xs{font-size:.4rem;height:.8rem;width:.8rem}.avatar.avatar-sm{font-size:.6rem;height:1.2rem;width:1.2rem}.avatar.avatar-lg{font-size:1.2rem;height:2.4rem;width:2.4rem}.avatar.avatar-xl{font-size:1.6rem;height:3.2rem;width:3.2rem}.avatar img{border-radius:50%;height:100%;position:relative;width:100%;z-index:1}.avatar .avatar-icon,.avatar .avatar-presence{background:#fff;bottom:14.64%;height:50%;padding:.1rem;position:absolute;right:14.64%;transform:translate(50%,50%);width:50%;z-index:2}.avatar .avatar-presence{background:#bcc3ce;border-radius:50%;box-shadow:0 0 0 .1rem #fff;height:.5em;width:.5em}.avatar .avatar-presence.online{background:#32b643}.avatar .avatar-presence.busy{background:#e85600}.avatar .avatar-presence.away{background:#ffb700}.avatar[data-initial]::before{color:currentColor;content:attr(data-initial);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:1}.badge{position:relative;white-space:nowrap}.badge:not([data-badge])::after,.badge[data-badge]::after{background:#5755d9;background-clip:padding-box;border-radius:.5rem;box-shadow:0 0 0 .1rem #fff;color:#fff;content:attr(data-badge);display:inline-block;transform:translate(-.05rem,-.5rem)}.badge[data-badge]::after{font-size:.7rem;height:.9rem;line-height:1;min-width:.9rem;padding:.1rem .2rem;text-align:center;white-space:nowrap}.badge:not([data-badge])::after,.badge[data-badge=""]::after{height:6px;min-width:6px;padding:0;width:6px}.badge.btn::after{position:absolute;right:0;top:0;transform:translate(50%,-50%)}.badge.avatar::after{position:absolute;right:14.64%;top:14.64%;transform:translate(50%,-50%);z-index:100}.breadcrumb{list-style:none;margin:.2rem 0;padding:.2rem 0}.breadcrumb .breadcrumb-item{color:#66758c;display:inline-block;margin:0;padding:.2rem 0}.breadcrumb .breadcrumb-item:not(:last-child){margin-right:.2rem}.breadcrumb .breadcrumb-item:not(:last-child) a{color:#66758c}.breadcrumb .breadcrumb-item:not(:first-child)::before{color:#66758c;content:"/";padding-right:.4rem}.bar{background:#eef0f3;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;height:.8rem;width:100%}.bar.bar-sm{height:.2rem}.bar .bar-item{background:#5755d9;color:#fff;display:block;-ms-flex-negative:0;flex-shrink:0;font-size:.7rem;height:100%;line-height:.8rem;position:relative;text-align:center;width:0}.bar .bar-item:first-child{border-bottom-left-radius:.1rem;border-top-left-radius:.1rem}.bar .bar-item:last-child{border-bottom-right-radius:.1rem;border-top-right-radius:.1rem;-ms-flex-negative:1;flex-shrink:1}.bar-slider{height:.1rem;margin:.4rem 0;position:relative}.bar-slider .bar-item{left:0;padding:0;position:absolute}.bar-slider .bar-item:not(:last-child):first-child{background:#eef0f3;z-index:1}.bar-slider .bar-slider-btn{background:#5755d9;border:0;border-radius:50%;height:.6rem;padding:0;position:absolute;right:0;top:50%;transform:translate(50%,-50%);width:.6rem}.bar-slider .bar-slider-btn:active{box-shadow:0 0 0 .1rem #5755d9}.card{background:#fff;border:.05rem solid #dadee4;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.card .card-body,.card .card-footer,.card .card-header{padding:.8rem;padding-bottom:0}.card .card-body:last-child,.card .card-footer:last-child,.card .card-header:last-child{padding-bottom:.8rem}.card .card-body{-ms-flex:1 1 auto;flex:1 1 auto}.card .card-image{padding-top:.8rem}.card .card-image:first-child{padding-top:0}.card .card-image:first-child img{border-top-left-radius:.1rem;border-top-right-radius:.1rem}.card .card-image:last-child img{border-bottom-left-radius:.1rem;border-bottom-right-radius:.1rem}.chip{align-items:center;background:#eef0f3;border-radius:5rem;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;font-size:90%;height:1.2rem;line-height:.8rem;margin:.1rem;max-width:320px;overflow:hidden;padding:.2rem .4rem;text-decoration:none;text-overflow:ellipsis;vertical-align:middle;white-space:nowrap}.chip.active{background:#5755d9;color:#fff}.chip .avatar{margin-left:-.4rem;margin-right:.2rem}.chip .btn-clear{border-radius:50%;transform:scale(.75)}.dropdown{display:inline-block;position:relative}.dropdown .menu{animation:slide-down .15s ease 1;display:none;left:0;max-height:50vh;overflow-y:auto;position:absolute;top:100%}.dropdown.dropdown-right .menu{left:auto;right:0}.dropdown .dropdown-toggle:focus+.menu,.dropdown .menu:hover,.dropdown.active .menu{display:block}.dropdown .btn-group .dropdown-toggle:nth-last-child(2){border-bottom-right-radius:.1rem;border-top-right-radius:.1rem}.empty{background:#f7f8f9;border-radius:.1rem;color:#66758c;padding:3.2rem 1.6rem;text-align:center}.empty .empty-icon{margin-bottom:.8rem}.empty .empty-subtitle,.empty .empty-title{margin:.4rem auto}.empty .empty-action{margin-top:.8rem}.menu{background:#fff;border-radius:.1rem;box-shadow:0 .05rem .2rem rgba(48,55,66,.3);list-style:none;margin:0;min-width:180px;padding:.4rem;transform:translateY(.2rem);z-index:300}.menu.menu-nav{background:0 0;box-shadow:none}.menu .menu-item{margin-top:0;padding:0 .4rem;position:relative;text-decoration:none}.menu .menu-item>a{border-radius:.1rem;color:inherit;display:block;margin:0 -.4rem;padding:.2rem .4rem;text-decoration:none}.menu .menu-item>a:focus,.menu .menu-item>a:hover{background:#f1f1fc;color:#5755d9}.menu .menu-item>a.active,.menu .menu-item>a:active{background:#f1f1fc;color:#5755d9}.menu .menu-item .form-checkbox,.menu .menu-item .form-radio,.menu .menu-item .form-switch{margin:.1rem 0}.menu .menu-item+.menu-item{margin-top:.2rem}.menu .menu-badge{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;height:100%;position:absolute;right:0;top:0}.menu .menu-badge .label{margin-right:.4rem}.modal{align-items:center;bottom:0;display:none;-ms-flex-align:center;-ms-flex-pack:center;justify-content:center;left:0;opacity:0;overflow:hidden;padding:.4rem;position:fixed;right:0;top:0}.modal.active,.modal:target{display:-ms-flexbox;display:flex;opacity:1;z-index:400}.modal.active .modal-overlay,.modal:target .modal-overlay{background:rgba(247,248,249,.75);bottom:0;cursor:default;display:block;left:0;position:absolute;right:0;top:0}.modal.active .modal-container,.modal:target .modal-container{animation:slide-down .2s ease 1;z-index:1}.modal.modal-sm .modal-container{max-width:320px;padding:0 .4rem}.modal.modal-lg .modal-overlay{background:#fff}.modal.modal-lg .modal-container{box-shadow:none;max-width:960px}.modal-container{background:#fff;border-radius:.1rem;box-shadow:0 .2rem .5rem rgba(48,55,66,.3);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;max-height:75vh;max-width:640px;padding:0 .8rem;width:100%}.modal-container.modal-fullheight{max-height:100vh}.modal-container .modal-header{color:#303742;padding:.8rem}.modal-container .modal-body{overflow-y:auto;padding:.8rem;position:relative}.modal-container .modal-footer{padding:.8rem;text-align:right}.nav{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;list-style:none;margin:.2rem 0}.nav .nav-item a{color:#66758c;padding:.2rem .4rem;text-decoration:none}.nav .nav-item a:focus,.nav .nav-item a:hover{color:#5755d9}.nav .nav-item.active>a{color:#505c6e;font-weight:700}.nav .nav-item.active>a:focus,.nav .nav-item.active>a:hover{color:#5755d9}.nav .nav{margin-bottom:.4rem;margin-left:.8rem}.pagination{display:-ms-flexbox;display:flex;list-style:none;margin:.2rem 0;padding:.2rem 0}.pagination .page-item{margin:.2rem .05rem}.pagination .page-item span{display:inline-block;padding:.2rem .2rem}.pagination .page-item a{border-radius:.1rem;display:inline-block;padding:.2rem .4rem;text-decoration:none}.pagination .page-item a:focus,.pagination .page-item a:hover{color:#5755d9}.pagination .page-item.disabled a{cursor:default;opacity:.5;pointer-events:none}.pagination .page-item.active a{background:#5755d9;color:#fff}.pagination .page-item.page-next,.pagination .page-item.page-prev{-ms-flex:1 0 50%;flex:1 0 50%}.pagination .page-item.page-next{text-align:right}.pagination .page-item .page-item-title{margin:0}.pagination .page-item .page-item-subtitle{margin:0;opacity:.5}.panel{border:.05rem solid #dadee4;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.panel .panel-footer,.panel .panel-header{-ms-flex:0 0 auto;flex:0 0 auto;padding:.8rem}.panel .panel-nav{-ms-flex:0 0 auto;flex:0 0 auto}.panel .panel-body{-ms-flex:1 1 auto;flex:1 1 auto;overflow-y:auto;padding:0 .8rem}.popover{display:inline-block;position:relative}.popover .popover-container{left:50%;opacity:0;padding:.4rem;position:absolute;top:0;transform:translate(-50%,-50%) scale(0);transition:transform .2s;width:320px;z-index:300}.popover :focus+.popover-container,.popover:hover .popover-container{display:block;opacity:1;transform:translate(-50%,-100%) scale(1)}.popover.popover-right .popover-container{left:100%;top:50%}.popover.popover-right :focus+.popover-container,.popover.popover-right:hover .popover-container{transform:translate(0,-50%) scale(1)}.popover.popover-bottom .popover-container{left:50%;top:100%}.popover.popover-bottom :focus+.popover-container,.popover.popover-bottom:hover .popover-container{transform:translate(-50%,0) scale(1)}.popover.popover-left .popover-container{left:0;top:50%}.popover.popover-left :focus+.popover-container,.popover.popover-left:hover .popover-container{transform:translate(-100%,-50%) scale(1)}.popover .card{border:0;box-shadow:0 .2rem .5rem rgba(48,55,66,.3)}.step{display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;list-style:none;margin:.2rem 0;width:100%}.step .step-item{-ms-flex:1 1 0;flex:1 1 0;margin-top:0;min-height:1rem;position:relative;text-align:center}.step .step-item:not(:first-child)::before{background:#5755d9;content:"";height:2px;left:-50%;position:absolute;top:9px;width:100%}.step .step-item a{color:#5755d9;display:inline-block;padding:20px 10px 0;text-decoration:none}.step .step-item a::before{background:#5755d9;border:.1rem solid #fff;border-radius:50%;content:"";display:block;height:.6rem;left:50%;position:absolute;top:.2rem;transform:translateX(-50%);width:.6rem;z-index:1}.step .step-item.active a::before{background:#fff;border:.1rem solid #5755d9}.step .step-item.active~.step-item::before{background:#dadee4}.step .step-item.active~.step-item a{color:#bcc3ce}.step .step-item.active~.step-item a::before{background:#dadee4}.tab{align-items:center;border-bottom:.05rem solid #dadee4;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-wrap:wrap;flex-wrap:wrap;list-style:none;margin:.2rem 0 .15rem 0}.tab .tab-item{margin-top:0}.tab .tab-item a{border-bottom:.1rem solid transparent;color:inherit;display:block;margin:0 .4rem 0 0;padding:.4rem .2rem .3rem .2rem;text-decoration:none}.tab .tab-item a:focus,.tab .tab-item a:hover{color:#5755d9}.tab .tab-item a.active,.tab .tab-item.active a{border-bottom-color:#5755d9;color:#5755d9}.tab .tab-item.tab-action{-ms-flex:1 0 auto;flex:1 0 auto;text-align:right}.tab .tab-item .btn-clear{margin-top:-.2rem}.tab.tab-block .tab-item{-ms-flex:1 0 0;flex:1 0 0;text-align:center}.tab.tab-block .tab-item a{margin:0}.tab.tab-block .tab-item .badge[data-badge]::after{position:absolute;right:.1rem;top:.1rem;transform:translate(0,0)}.tab:not(.tab-block) .badge{padding-right:0}.tile{align-content:space-between;align-items:flex-start;display:-ms-flexbox;display:flex;-ms-flex-align:start;-ms-flex-line-pack:justify}.tile .tile-action,.tile .tile-icon{-ms-flex:0 0 auto;flex:0 0 auto}.tile .tile-content{-ms-flex:1 1 auto;flex:1 1 auto}.tile .tile-content:not(:first-child){padding-left:.4rem}.tile .tile-content:not(:last-child){padding-right:.4rem}.tile .tile-subtitle,.tile .tile-title{line-height:1.2rem}.tile.tile-centered{align-items:center;-ms-flex-align:center}.tile.tile-centered .tile-content{overflow:hidden}.tile.tile-centered .tile-subtitle,.tile.tile-centered .tile-title{margin-bottom:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.toast{background:rgba(48,55,66,.95);border:.05rem solid #303742;border-color:#303742;border-radius:.1rem;color:#fff;display:block;padding:.4rem;width:100%}.toast.toast-primary{background:rgba(87,85,217,.95);border-color:#5755d9}.toast.toast-success{background:rgba(50,182,67,.95);border-color:#32b643}.toast.toast-warning{background:rgba(255,183,0,.95);border-color:#ffb700}.toast.toast-error{background:rgba(232,86,0,.95);border-color:#e85600}.toast a{color:#fff;text-decoration:underline}.toast a.active,.toast a:active,.toast a:focus,.toast a:hover{opacity:.75}.toast .btn-clear{margin:.1rem}.toast p:last-child{margin-bottom:0}.tooltip{position:relative}.tooltip::after{background:rgba(48,55,66,.95);border-radius:.1rem;bottom:100%;color:#fff;content:attr(data-tooltip);display:block;font-size:.7rem;left:50%;max-width:320px;opacity:0;overflow:hidden;padding:.2rem .4rem;pointer-events:none;position:absolute;text-overflow:ellipsis;transform:translate(-50%,.4rem);transition:opacity .2s,transform .2s;white-space:pre;z-index:300}.tooltip:focus::after,.tooltip:hover::after{opacity:1;transform:translate(-50%,-.2rem)}.tooltip.disabled,.tooltip[disabled]{pointer-events:auto}.tooltip.tooltip-right::after{bottom:50%;left:100%;transform:translate(-.2rem,50%)}.tooltip.tooltip-right:focus::after,.tooltip.tooltip-right:hover::after{transform:translate(.2rem,50%)}.tooltip.tooltip-bottom::after{bottom:auto;top:100%;transform:translate(-50%,-.4rem)}.tooltip.tooltip-bottom:focus::after,.tooltip.tooltip-bottom:hover::after{transform:translate(-50%,.2rem)}.tooltip.tooltip-left::after{bottom:50%;left:auto;right:100%;transform:translate(.4rem,50%)}.tooltip.tooltip-left:focus::after,.tooltip.tooltip-left:hover::after{transform:translate(-.2rem,50%)}@keyframes loading{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes slide-down{0%{opacity:0;transform:translateY(-1.6rem)}100%{opacity:1;transform:translateY(0)}}.text-primary{color:#5755d9!important}a.text-primary:focus,a.text-primary:hover{color:#4240d4}a.text-primary:visited{color:#6c6ade}.text-secondary{color:#e5e5f9!important}a.text-secondary:focus,a.text-secondary:hover{color:#d1d0f4}a.text-secondary:visited{color:#fafafe}.text-gray{color:#bcc3ce!important}a.text-gray:focus,a.text-gray:hover{color:#adb6c4}a.text-gray:visited{color:#cbd0d9}.text-light{color:#fff!important}a.text-light:focus,a.text-light:hover{color:#f2f2f2}a.text-light:visited{color:#fff}.text-dark{color:#3b4351!important}a.text-dark:focus,a.text-dark:hover{color:#303742}a.text-dark:visited{color:#455060}.text-success{color:#32b643!important}a.text-success:focus,a.text-success:hover{color:#2da23c}a.text-success:visited{color:#39c94b}.text-warning{color:#ffb700!important}a.text-warning:focus,a.text-warning:hover{color:#e6a500}a.text-warning:visited{color:#ffbe1a}.text-error{color:#e85600!important}a.text-error:focus,a.text-error:hover{color:#cf4d00}a.text-error:visited{color:#ff6003}.bg-primary{background:#5755d9!important;color:#fff}.bg-secondary{background:#f1f1fc!important}.bg-dark{background:#303742!important;color:#fff}.bg-gray{background:#f7f8f9!important}.bg-success{background:#32b643!important;color:#fff}.bg-warning{background:#ffb700!important;color:#fff}.bg-error{background:#e85600!important;color:#fff}.c-hand{cursor:pointer}.c-move{cursor:move}.c-zoom-in{cursor:zoom-in}.c-zoom-out{cursor:zoom-out}.c-not-allowed{cursor:not-allowed}.c-auto{cursor:auto}.d-block{display:block}.d-inline{display:inline}.d-inline-block{display:inline-block}.d-flex{display:-ms-flexbox;display:flex}.d-inline-flex{display:-ms-inline-flexbox;display:inline-flex}.d-hide,.d-none{display:none!important}.d-visible{visibility:visible}.d-invisible{visibility:hidden}.text-hide{background:0 0;border:0;color:transparent;font-size:0;line-height:0;text-shadow:none}.text-assistive{border:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.divider,.divider-vert{display:block;position:relative}.divider-vert[data-content]::after,.divider[data-content]::after{background:#fff;color:#bcc3ce;content:attr(data-content);display:inline-block;font-size:.7rem;padding:0 .4rem;transform:translateY(-.65rem)}.divider{border-top:.05rem solid #f1f3f5;height:.05rem;margin:.4rem 0}.divider[data-content]{margin:.8rem 0}.divider-vert{display:block;padding:.8rem}.divider-vert::before{border-left:.05rem solid #dadee4;bottom:.4rem;content:"";display:block;left:50%;position:absolute;top:.4rem;transform:translateX(-50%)}.divider-vert[data-content]::after{left:50%;padding:.2rem 0;position:absolute;top:50%;transform:translate(-50%,-50%)}.loading{color:transparent!important;min-height:.8rem;pointer-events:none;position:relative}.loading::after{animation:loading .5s infinite linear;background:0 0;border:.1rem solid #5755d9;border-radius:50%;border-right-color:transparent;border-top-color:transparent;content:"";display:block;height:.8rem;left:50%;margin-left:-.4rem;margin-top:-.4rem;opacity:1;padding:0;position:absolute;top:50%;width:.8rem;z-index:1}.loading.loading-lg{min-height:2rem}.loading.loading-lg::after{height:1.6rem;margin-left:-.8rem;margin-top:-.8rem;width:1.6rem}.clearfix::after{clear:both;content:"";display:table}.float-left{float:left!important}.float-right{float:right!important}.p-relative{position:relative!important}.p-absolute{position:absolute!important}.p-fixed{position:fixed!important}.p-sticky{position:-webkit-sticky!important;position:sticky!important}.p-centered{display:block;float:none;margin-left:auto;margin-right:auto}.flex-centered{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;justify-content:center}.m-0{margin:0!important}.mb-0{margin-bottom:0!important}.ml-0{margin-left:0!important}.mr-0{margin-right:0!important}.mt-0{margin-top:0!important}.mx-0{margin-left:0!important;margin-right:0!important}.my-0{margin-bottom:0!important;margin-top:0!important}.m-1{margin:.2rem!important}.mb-1{margin-bottom:.2rem!important}.ml-1{margin-left:.2rem!important}.mr-1{margin-right:.2rem!important}.mt-1{margin-top:.2rem!important}.mx-1{margin-left:.2rem!important;margin-right:.2rem!important}.my-1{margin-bottom:.2rem!important;margin-top:.2rem!important}.m-2{margin:.4rem!important}.mb-2{margin-bottom:.4rem!important}.ml-2{margin-left:.4rem!important}.mr-2{margin-right:.4rem!important}.mt-2{margin-top:.4rem!important}.mx-2{margin-left:.4rem!important;margin-right:.4rem!important}.my-2{margin-bottom:.4rem!important;margin-top:.4rem!important}.p-0{padding:0!important}.pb-0{padding-bottom:0!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.pt-0{padding-top:0!important}.px-0{padding-left:0!important;padding-right:0!important}.py-0{padding-bottom:0!important;padding-top:0!important}.p-1{padding:.2rem!important}.pb-1{padding-bottom:.2rem!important}.pl-1{padding-left:.2rem!important}.pr-1{padding-right:.2rem!important}.pt-1{padding-top:.2rem!important}.px-1{padding-left:.2rem!important;padding-right:.2rem!important}.py-1{padding-bottom:.2rem!important;padding-top:.2rem!important}.p-2{padding:.4rem!important}.pb-2{padding-bottom:.4rem!important}.pl-2{padding-left:.4rem!important}.pr-2{padding-right:.4rem!important}.pt-2{padding-top:.4rem!important}.px-2{padding-left:.4rem!important;padding-right:.4rem!important}.py-2{padding-bottom:.4rem!important;padding-top:.4rem!important}.s-rounded{border-radius:.1rem}.s-circle{border-radius:50%}.text-left{text-align:left}.text-right{text-align:right}.text-center{text-align:center}.text-justify{text-align:justify}.text-lowercase{text-transform:lowercase}.text-uppercase{text-transform:uppercase}.text-capitalize{text-transform:capitalize}.text-normal{font-weight:400}.text-bold{font-weight:700}.text-italic{font-style:italic}.text-large{font-size:1.2em}.text-small{font-size:.9em}.text-tiny{font-size:.8em}.text-muted{opacity:.8}.text-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.text-clip{overflow:hidden;text-overflow:clip;white-space:nowrap}.text-break{-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;word-break:break-word;word-wrap:break-word}/*! Spectre.css v0.5.9 | MIT License | github.com/picturepan2/spectre */ \ No newline at end of file diff --git a/docs/src/scss/docs.scss b/docs/src/scss/docs.scss index 656bfa345..a7b250c55 100644 --- a/docs/src/scss/docs.scss +++ b/docs/src/scss/docs.scss @@ -1,10 +1,11 @@ /*! Spectre.css Docs | MIT License | github.com/picturepan2/spectre */ // Core variables and mixins -@import "../../../src/variables"; -@import "../../../src/mixins"; +@use "sass:color"; +@use "../../../src/variables"; +@use "../../../src/mixins"; .version::after { - content: "#{$version}"; + content: "#{variables.$version}"; } .off-canvas { @@ -33,7 +34,7 @@ position: fixed; right: 0; top: 0; - z-index: $zindex-1; + z-index: variables.$zindex-1; .btns { position: absolute; @@ -63,7 +64,7 @@ input { & ~ .accordion-header { - color: lighten($dark-color, 10%); + color: color.adjust(variables.$dark-color, $lightness: 10%); font-size: .65rem; font-weight: 600; text-transform: uppercase; @@ -71,7 +72,7 @@ &:checked { & ~ .accordion-header { - color: lighten($dark-color, 15%); + color: color.adjust(variables.$dark-color, $lightness: 15%); } } } @@ -83,7 +84,7 @@ & > a { background: transparent; - color: $gray-color-dark; + color: variables.$gray-color-dark; display: inline-block; } } @@ -103,7 +104,7 @@ } .anchor { - color: $primary-color-light; + color: variables.$primary-color-light; display: none; margin-left: .2rem; padding: 0 .2rem; @@ -125,10 +126,10 @@ @supports (position: sticky) { position: sticky; top: 0; - z-index: $zindex-1 - 1; + z-index: variables.$zindex-1 - 1; &::before { - background: $light-color; + background: variables.$light-color; bottom: 0; content: ""; display: block; @@ -136,7 +137,7 @@ position: absolute; right: -10px; top: -5px; - z-index: -$zindex-0; + z-index: -(variables.$zindex-0); } } @@ -156,22 +157,22 @@ padding-top: 1rem; .card { - box-shadow: 0 .25rem 1rem rgba($dark-color, .15); + box-shadow: 0 .25rem 1rem rgba(variables.$dark-color, .15); border: 0; height: 100%; } } .column { - padding: $layout-spacing; + padding: variables.$layout-spacing; } .docs-block { - border-radius: $border-radius; - padding: $unit-2; + border-radius: variables.$border-radius; + padding: variables.$unit-2; &.bg-gray { - background: $bg-color-dark; + background: variables.$bg-color-dark; } } @@ -198,30 +199,30 @@ } .docs-color { - border-radius: $border-radius; + border-radius: variables.$border-radius; margin: .25rem 0; padding: 5rem .5rem .5rem; .color-subtitle { - font-size: $font-size-sm; + font-size: variables.$font-size-sm; opacity: .75; } } .code { .hljs-tag { - color: lighten($body-font-color, 10%); + color: color.adjust(variables.$body-font-color, $lightness: 10%); } .hljs-comment { - color: $gray-color; + color: variables.$gray-color; } .hljs-title, .hljs-class, .hljs-string, .hljs-number { - color: $primary-color; + color: variables.$primary-color; } .hljs-name, @@ -229,12 +230,12 @@ .hljs-variable, .hljs-keyword, .hljs-built_in { - color: $code-color; + color: variables.$code-color; } .hljs-value, .hljs-hexcolor { - color: lighten($body-font-color, 10%); + color: color.adjust(variables.$body-font-color, $lightness: 10%); } } @@ -261,9 +262,9 @@ .example-tile-icon { align-content: space-around; align-items: center; - background: $primary-color; - border-radius: $border-radius; - color: $light-color; + background: variables.$primary-color; + border-radius: variables.$border-radius; + color: variables.$light-color; display: flex; font-size: 1.2rem; height: 2rem; @@ -287,16 +288,16 @@ position: relative; .off-canvas-toggle { - left: $layout-spacing; + left: variables.$layout-spacing; position: absolute; - top: $layout-spacing; - z-index: $zindex-0; + top: variables.$layout-spacing; + z-index: variables.$zindex-0; } } } .docs-brand { - color: $primary-color; + color: variables.$primary-color; height: 2rem; left: 1.5rem; position: fixed; @@ -304,7 +305,7 @@ .docs-logo { align-items: center; - border-radius: $border-radius; + border-radius: variables.$border-radius; display: inline-flex; font-size: .7rem; height: 2rem; @@ -335,20 +336,20 @@ } .docs-footer { - color: $gray-color; + color: variables.$gray-color; padding: .5rem; a { - color: $gray-color-dark; + color: variables.$gray-color-dark; } } .docs-ad { - background: $bg-color; - border-radius: $border-radius; + background: variables.$bg-color; + border-radius: variables.$border-radius; display: block; margin: 2rem 0; - padding: $layout-spacing; + padding: variables.$layout-spacing; position: relative; ins { @@ -362,15 +363,15 @@ } .carbon-text { - color: $gray-color-dark; + color: variables.$gray-color-dark; display: block; - font-size: $font-size-sm; + font-size: variables.$font-size-sm; } } .carbon-poweredby { - color: $gray-color; - font-size: $font-size-sm; + color: variables.$gray-color; + font-size: variables.$font-size-sm; } } @@ -383,12 +384,12 @@ top: .85rem; h2 { - color: $primary-color; + color: variables.$primary-color; } } .column { - padding: $layout-spacing; + padding: variables.$layout-spacing; } } @@ -409,18 +410,18 @@ padding: 4.5rem .5rem; .column { - padding: $layout-spacing; + padding: variables.$layout-spacing; } } .section-footer { - color: $gray-color; + color: variables.$gray-color; padding: 1.8rem .75rem 1rem; position: relative; z-index: 200; a { - color: $gray-color-dark; + color: variables.$gray-color-dark; } } @@ -429,22 +430,22 @@ padding-top: 6rem; h1 { - color: $body-font-color; + color: variables.$body-font-color; font-size: 1.6rem; font-weight: 600; margin-bottom: 1.5rem; } h2 { - color: lighten($body-font-color, 5%); + color: color.adjust(variables.$body-font-color, $lightness: 5%); font-size: .9rem; font-weight: 400; line-height: 1.5rem; margin-bottom: 1.5rem; u { - border-bottom: $border-width-lg solid currentColor; - padding-bottom: $unit-o; + border-bottom: variables.$border-width-lg solid currentColor; + padding-bottom: variables.$unit-o; text-decoration: none; } } @@ -452,11 +453,11 @@ .card { background: none; border: 0; - color: lighten($body-font-color, 15%); + color: color.adjust(variables.$body-font-color, $lightness: 15%); padding: .5rem; .card-title { - color: $primary-color; + color: variables.$primary-color; font-size: 1rem; font-weight: 700; margin-bottom: 0; @@ -467,7 +468,7 @@ @media (max-width: 960px) { .off-canvas { .off-canvas-toggle { - z-index: $zindex-3; + z-index: variables.$zindex-3; } .off-canvas-content { @@ -494,7 +495,7 @@ .docs-navbar { backdrop-filter: blur(5px); - background: rgba($bg-color, .65); + background: rgba(variables.$bg-color, .65); left: 0; } @@ -579,7 +580,7 @@ padding: 0 .5rem; .docs-block { - padding: $unit-2 $unit-h; + padding: variables.$unit-2 variables.$unit-h; } } } @@ -793,7 +794,7 @@ cursor: pointer; &.ds-cursor .algolia-docsearch-suggestion { &.suggestion-layout-simple, &:not(.suggestion-layout-simple) .algolia-docsearch-suggestion--content { - background-color: rgba($primary-color, .05); + background-color: rgba(variables.$primary-color, .05); } } } @@ -816,13 +817,13 @@ position: relative; padding: 0 8px; background: #fff; - color: $dark-color; + color: variables.$dark-color; overflow: hidden; } .algolia-docsearch-suggestion--highlight { - color: $primary-color; - background: rgba($primary-color, .1); + color: variables.$primary-color; + background: rgba(variables.$primary-color, .1); padding: 0.1em 0.05em; } @@ -830,7 +831,7 @@ .algolia-docsearch-suggestion--category-header-lvl0 .algolia-docsearch-suggestion--highlight, .algolia-docsearch-suggestion--category-header-lvl1 .algolia-docsearch-suggestion--highlight { padding: 0 0 1px; background: inherit; - box-shadow: inset 0 -2px 0 0 rgba($primary-color, .8); + box-shadow: inset 0 -2px 0 0 rgba(variables.$primary-color, .8); color: inherit; } } @@ -838,7 +839,7 @@ .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight { padding: 0 0 1px; background: inherit; - box-shadow: inset 0 -2px 0 0 rgba($primary-color, .8); + box-shadow: inset 0 -2px 0 0 rgba(variables.$primary-color, .8); color: inherit; } @@ -856,19 +857,19 @@ top: 0; height: 100%; width: 1px; - background: $gray-color-light; + background: variables.$gray-color-light; left: -1px; } } .algolia-docsearch-suggestion--category-header { position: relative; - border-bottom: 1px solid $gray-color-light; + border-bottom: 1px solid variables.$gray-color-light; display: none; margin-top: 8px; padding: 4px 0; font-size: 1em; - color: $dark-color; + color: variables.$dark-color; } .algolia-docsearch-suggestion--wrapper { @@ -883,7 +884,7 @@ text-align: right; position: relative; padding: 5.33333px 10.66667px; - color: $gray-color; + color: variables.$gray-color; font-size: .9em; word-wrap: break-word; &:before { @@ -893,7 +894,7 @@ top: 0; height: 100%; width: 1px; - background: $gray-color-light; + background: variables.$gray-color-light; right: 0; } } @@ -903,7 +904,7 @@ } .algolia-docsearch-suggestion--title { - color: $dark-color; + color: variables.$dark-color; font-size: .9em; font-weight: 700; } @@ -912,7 +913,7 @@ display: block; line-height: 1.2em; font-size: .85em; - color: $gray-color-dark; + color: variables.$gray-color-dark; } .algolia-docsearch-suggestion--no-results { diff --git a/docs/src/scss/spectre-rtl.scss b/docs/src/scss/spectre-rtl.scss index cda0b96f5..83948e468 100644 --- a/docs/src/scss/spectre-rtl.scss +++ b/docs/src/scss/spectre-rtl.scss @@ -2,5 +2,5 @@ $rtl: true; // Import Spectre -@import "../../../src/spectre"; -@import "../../../src/spectre-exp"; +@use "../../../src/spectre"; +@use "../../../src/spectre-exp"; diff --git a/gulpfile.js b/gulpfile.js index fe701b36d..1b9562abb 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -1,6 +1,6 @@ const gulp = require("gulp"); const { parallel } = require("gulp"); -const sass = require('gulp-sass'); +const sass = require('gulp-dart-sass'); const cleancss = require('gulp-clean-css'); const csscomb = require('gulp-csscomb'); const rename = require('gulp-rename'); @@ -10,7 +10,7 @@ const autoprefixer = require('gulp-autoprefixer'); function build() { return gulp .src('./src/*.scss') - .pipe(sass({outputStyle: 'compact', precision: 10}) + .pipe(sass({outputStyle: 'compressed', precision: 10}) .on('error', sass.logError) ) .pipe(autoprefixer()) @@ -26,7 +26,7 @@ function build() { function docs_css() { return gulp .src(['./src/*.scss', './docs/src/scss/*.scss']) - .pipe(sass({outputStyle: 'compact', precision: 10}) + .pipe(sass({outputStyle: 'compressed', precision: 10}) .on('error', sass.logError) ) .pipe(autoprefixer()) diff --git a/package.json b/package.json index bd200612f..b29e0db75 100644 --- a/package.json +++ b/package.json @@ -28,9 +28,9 @@ "gulp-autoprefixer": "^7.0.1", "gulp-clean-css": "^4.3.0", "gulp-csscomb": "^3.1.0", + "gulp-dart-sass": "^1.0.2", "gulp-pug": "^4.0.1", "gulp-rename": "^2.0.0", - "gulp-sass": "^4.1.0", "jstransformer-highlight": "^2.0.0", "jstransformer-markdown-it": "^2.1.0" }, diff --git a/src/_accordions.scss b/src/_accordions.scss index ee57ac050..128162eab 100644 --- a/src/_accordions.scss +++ b/src/_accordions.scss @@ -1,3 +1,5 @@ +@use "variables"; + // Accordions .accordion { input:checked ~, @@ -15,7 +17,7 @@ .accordion-header { display: block; - padding: $unit-1 $unit-2; + padding: variables.$unit-1 variables.$unit-2; .icon { transition: transform .25s; @@ -23,7 +25,7 @@ } .accordion-body { - margin-bottom: $layout-spacing; + margin-bottom: variables.$layout-spacing; max-height: 0; overflow: hidden; transition: max-height .25s; diff --git a/src/_animations.scss b/src/_animations.scss index e7fde1ace..7bd0c3435 100644 --- a/src/_animations.scss +++ b/src/_animations.scss @@ -1,3 +1,5 @@ +@use "variables"; + // Animations @keyframes loading { 0% { @@ -11,7 +13,7 @@ @keyframes slide-down { 0% { opacity: 0; - transform: translateY(-$unit-8); + transform: translateY(-(variables.$unit-8)); } 100% { opacity: 1; diff --git a/src/_asian.scss b/src/_asian.scss index e426f39a5..e6fd8a0c7 100644 --- a/src/_asian.scss +++ b/src/_asian.scss @@ -1,24 +1,26 @@ +@use "variables"; + // Optimized for East Asian CJK html:lang(zh), html:lang(zh-Hans), .lang-zh, .lang-zh-hans { - font-family: $cjk-zh-hans-font-family; + font-family: variables.$cjk-zh-hans-font-family; } html:lang(zh-Hant), .lang-zh-hant { - font-family: $cjk-zh-hant-font-family; + font-family: variables.$cjk-zh-hant-font-family; } html:lang(ja), .lang-ja { - font-family: $cjk-jp-font-family; + font-family: variables.$cjk-jp-font-family; } html:lang(ko), .lang-ko { - font-family: $cjk-ko-font-family; + font-family: variables.$cjk-ko-font-family; } :lang(zh), @@ -26,7 +28,7 @@ html:lang(ko), .lang-cjk { ins, u { - border-bottom: $border-width solid; + border-bottom: variables.$border-width solid; text-decoration: none; } diff --git a/src/_autocomplete.scss b/src/_autocomplete.scss index 279fa036a..7602f2582 100644 --- a/src/_autocomplete.scss +++ b/src/_autocomplete.scss @@ -1,3 +1,6 @@ +@use "variables"; +@use "mixins/shadow"; + // Autocomplete .form-autocomplete { position: relative; @@ -7,12 +10,12 @@ display: flex; flex-wrap: wrap; height: auto; - min-height: $unit-8; - padding: $unit-h; + min-height: variables.$unit-8; + padding: variables.$unit-h; &.is-focused { - @include control-shadow(); - border-color: $primary-color; + @include shadow.control-shadow(); + border-color: variables.$primary-color; } .form-input { @@ -20,9 +23,9 @@ box-shadow: none; display: inline-block; flex: 1 0 auto; - height: $unit-6; - line-height: $unit-4; - margin: $unit-h; + height: variables.$unit-6; + line-height: variables.$unit-4; + margin: variables.$unit-h; width: auto; } } diff --git a/src/_avatars.scss b/src/_avatars.scss index b203aa25c..afcf7264a 100644 --- a/src/_avatars.scss +++ b/src/_avatars.scss @@ -1,9 +1,12 @@ +@use "mixins/avatar"; +@use "variables"; + // Avatars .avatar { - @include avatar-base(); - background: $primary-color; + @include avatar.avatar-base(); + background: variables.$primary-color; border-radius: 50%; - color: rgba($light-color, .85); + color: rgba(variables.$light-color, .85); display: inline-block; font-weight: 300; line-height: 1.25; @@ -12,16 +15,16 @@ vertical-align: middle; &.avatar-xs { - @include avatar-base($unit-4); + @include avatar.avatar-base(variables.$unit-4); } &.avatar-sm { - @include avatar-base($unit-6); + @include avatar.avatar-base(variables.$unit-6); } &.avatar-lg { - @include avatar-base($unit-12); + @include avatar.avatar-base(variables.$unit-12); } &.avatar-xl { - @include avatar-base($unit-16); + @include avatar.avatar-base(variables.$unit-16); } img { @@ -29,39 +32,39 @@ height: 100%; position: relative; width: 100%; - z-index: $zindex-0; + z-index: variables.$zindex-0; } .avatar-icon, .avatar-presence { - background: $bg-color-light; + background: variables.$bg-color-light; bottom: 14.64%; height: 50%; - padding: $border-width-lg; + padding: variables.$border-width-lg; position: absolute; right: 14.64%; transform: translate(50%, 50%); width: 50%; - z-index: $zindex-0 + 1; + z-index: variables.$zindex-0 + 1; } .avatar-presence { - background: $gray-color; - box-shadow: 0 0 0 $border-width-lg $light-color; + background: variables.$gray-color; + box-shadow: 0 0 0 variables.$border-width-lg variables.$light-color; border-radius: 50%; height: .5em; width: .5em; &.online { - background: $success-color; + background: variables.$success-color; } &.busy { - background: $error-color; + background: variables.$error-color; } &.away { - background: $warning-color; + background: variables.$warning-color; } } @@ -72,6 +75,6 @@ position: absolute; top: 50%; transform: translate(-50%, -50%); - z-index: $zindex-0; + z-index: variables.$zindex-0; } } \ No newline at end of file diff --git a/src/_badges.scss b/src/_badges.scss index d67f6d19a..04e170c89 100644 --- a/src/_badges.scss +++ b/src/_badges.scss @@ -1,3 +1,5 @@ +@use "variables"; + // Badges .badge { position: relative; @@ -6,11 +8,11 @@ &[data-badge], &:not([data-badge]) { &::after { - background: $primary-color; + background: variables.$primary-color; background-clip: padding-box; border-radius: .5rem; - box-shadow: 0 0 0 .1rem $bg-color-light; - color: $light-color; + box-shadow: 0 0 0 .1rem variables.$bg-color-light; + color: variables.$light-color; content: attr(data-badge); display: inline-block; transform: translate(-.05rem, -.5rem); @@ -18,7 +20,7 @@ } &[data-badge] { &::after { - font-size: $font-size-sm; + font-size: variables.$font-size-sm; height: .9rem; line-height: 1; min-width: .9rem; @@ -54,7 +56,7 @@ top: 14.64%; right: 14.64%; transform: translate(50%, -50%); - z-index: $zindex-1; + z-index: variables.$zindex-1; } } } diff --git a/src/_bars.scss b/src/_bars.scss index 47e21c9a6..2ccfaf37f 100644 --- a/src/_bars.scss +++ b/src/_bars.scss @@ -1,36 +1,38 @@ +@use "variables"; + // Bars .bar { - background: $bg-color-dark; - border-radius: $border-radius; + background: variables.$bg-color-dark; + border-radius: variables.$border-radius; display: flex; flex-wrap: nowrap; - height: $unit-4; + height: variables.$unit-4; width: 100%; &.bar-sm { - height: $unit-1; + height: variables.$unit-1; } // TODO: attr() support .bar-item { - background: $primary-color; - color: $light-color; + background: variables.$primary-color; + color: variables.$light-color; display: block; - font-size: $font-size-sm; + font-size: variables.$font-size-sm; flex-shrink: 0; - line-height: $unit-4; + line-height: variables.$unit-4; height: 100%; position: relative; text-align: center; width: 0; &:first-child { - border-bottom-left-radius: $border-radius; - border-top-left-radius: $border-radius; + border-bottom-left-radius: variables.$border-radius; + border-top-left-radius: variables.$border-radius; } &:last-child { - border-bottom-right-radius: $border-radius; - border-top-right-radius: $border-radius; + border-bottom-right-radius: variables.$border-radius; + border-top-right-radius: variables.$border-radius; flex-shrink: 1; } } @@ -38,8 +40,8 @@ // Slider bar .bar-slider { - height: $border-width-lg; - margin: $layout-spacing 0; + height: variables.$border-width-lg; + margin: variables.$layout-spacing 0; position: relative; .bar-item { @@ -47,25 +49,25 @@ padding: 0; position: absolute; &:not(:last-child):first-child { - background: $bg-color-dark; - z-index: $zindex-0; + background: variables.$bg-color-dark; + z-index: variables.$zindex-0; } } .bar-slider-btn { - background: $primary-color; + background: variables.$primary-color; border: 0; border-radius: 50%; - height: $unit-3; + height: variables.$unit-3; padding: 0; position: absolute; right: 0; top: 50%; transform: translate(50%, -50%); - width: $unit-3; + width: variables.$unit-3; &:active { - box-shadow: 0 0 0 .1rem $primary-color; + box-shadow: 0 0 0 .1rem variables.$primary-color; } } } diff --git a/src/_base.scss b/src/_base.scss index 4e01b202e..08ffc1102 100644 --- a/src/_base.scss +++ b/src/_base.scss @@ -1,3 +1,6 @@ +@use "mixins/shadow"; +@use "variables"; + // Base *, *::before, @@ -7,38 +10,38 @@ html { box-sizing: border-box; - font-size: $html-font-size; - line-height: $html-line-height; + font-size: variables.$html-font-size; + line-height: variables.$html-line-height; -webkit-tap-highlight-color: transparent; } body { - background: $body-bg; - color: $body-font-color; - font-family: $body-font-family; - font-size: $font-size; + background: variables.$body-bg; + color: variables.$body-font-color; + font-family: variables.$body-font-family; + font-size: variables.$font-size; overflow-x: hidden; text-rendering: optimizeLegibility; } a { - color: $link-color; + color: variables.$link-color; outline: none; text-decoration: none; &:focus { - @include control-shadow(); + @include shadow.control-shadow(); } &:focus, &:hover, &:active, &.active { - color: $link-color-dark; + color: variables.$link-color-dark; text-decoration: underline; } &:visited { - color: $link-color-light; + color: variables.$link-color-light; } } diff --git a/src/_breadcrumbs.scss b/src/_breadcrumbs.scss index 6a5af3167..b2995bf11 100644 --- a/src/_breadcrumbs.scss +++ b/src/_breadcrumbs.scss @@ -1,28 +1,30 @@ +@use "variables"; + // Breadcrumbs .breadcrumb { list-style: none; - margin: $unit-1 0; - padding: $unit-1 0; + margin: variables.$unit-1 0; + padding: variables.$unit-1 0; .breadcrumb-item { - color: $gray-color-dark; + color: variables.$gray-color-dark; display: inline-block; margin: 0; - padding: $unit-1 0; + padding: variables.$unit-1 0; &:not(:last-child) { - margin-right: $unit-1; + margin-right: variables.$unit-1; a { - color: $gray-color-dark; + color: variables.$gray-color-dark; } } &:not(:first-child) { &::before { - color: $gray-color-dark; + color: variables.$gray-color-dark; content: "/"; - padding-right: $unit-2; + padding-right: variables.$unit-2; } } } diff --git a/src/_buttons.scss b/src/_buttons.scss index 9158f0fce..a4b0db5b9 100644 --- a/src/_buttons.scss +++ b/src/_buttons.scss @@ -1,17 +1,22 @@ +@use "sass:color"; +@use "mixins/button"; +@use "mixins/shadow"; +@use "variables"; + // Buttons .btn { appearance: none; - background: $bg-color-light; - border: $border-width solid $primary-color; - border-radius: $border-radius; - color: $primary-color; + background: variables.$bg-color-light; + border: variables.$border-width solid variables.$primary-color; + border-radius: variables.$border-radius; + color: variables.$primary-color; cursor: pointer; display: inline-block; - font-size: $font-size; - height: $control-size; - line-height: $line-height; + font-size: variables.$font-size; + height: variables.$control-size; + line-height: variables.$line-height; outline: none; - padding: $control-padding-y $control-padding-x; + padding: variables.$control-padding-y variables.$control-padding-x; text-align: center; text-decoration: none; transition: background .2s, border .2s, box-shadow .2s, color .2s; @@ -19,24 +24,24 @@ vertical-align: middle; white-space: nowrap; &:focus { - @include control-shadow(); + @include shadow.control-shadow(); } &:focus, &:hover { - background: $secondary-color; - border-color: $primary-color-dark; + background: variables.$secondary-color; + border-color: variables.$primary-color-dark; text-decoration: none; } &:active, &.active { - background: $primary-color-dark; - border-color: darken($primary-color-dark, 5%); - color: $light-color; + background: variables.$primary-color-dark; + border-color: color.adjust(variables.$primary-color-dark, $lightness: -5%); + color: variables.$light-color; text-decoration: none; &.loading { &::after { - border-bottom-color: $light-color; - border-left-color: $light-color; + border-bottom-color: variables.$light-color; + border-left-color: variables.$light-color; } } } @@ -50,62 +55,62 @@ // Button Primary &.btn-primary { - background: $primary-color; - border-color: $primary-color-dark; - color: $light-color; + background: variables.$primary-color; + border-color: variables.$primary-color-dark; + color: variables.$light-color; &:focus, &:hover { - background: darken($primary-color-dark, 2%); - border-color: darken($primary-color-dark, 5%); - color: $light-color; + background: color.adjust(variables.$primary-color-dark, $lightness: -2%); + border-color: color.adjust(variables.$primary-color-dark, $lightness: -5%); + color: variables.$light-color; } &:active, &.active { - background: darken($primary-color-dark, 4%); - border-color: darken($primary-color-dark, 7%); - color: $light-color; + background: color.adjust(variables.$primary-color-dark, $lightness: -4%); + border-color: color.adjust(variables.$primary-color-dark, $lightness: -7%); + color: variables.$light-color; } &.loading { &::after { - border-bottom-color: $light-color; - border-left-color: $light-color; + border-bottom-color: variables.$light-color; + border-left-color: variables.$light-color; } } } // Button Colors &.btn-success { - @include button-variant($success-color); + @include button.button-variant(variables.$success-color); } &.btn-error { - @include button-variant($error-color); + @include button.button-variant(variables.$error-color); } // Button Link &.btn-link { background: transparent; border-color: transparent; - color: $link-color; + color: variables.$link-color; &:focus, &:hover, &:active, &.active { - color: $link-color-dark; + color: variables.$link-color-dark; } } // Button Sizes &.btn-sm { - font-size: $font-size-sm; - height: $control-size-sm; - padding: $control-padding-y-sm $control-padding-x-sm; + font-size: variables.$font-size-sm; + height: variables.$control-size-sm; + padding: variables.$control-padding-y-sm variables.$control-padding-x-sm; } &.btn-lg { - font-size: $font-size-lg; - height: $control-size-lg; - padding: $control-padding-y-lg $control-padding-x-lg; + font-size: variables.$font-size-lg; + height: variables.$control-size-lg; + padding: variables.$control-padding-y-lg variables.$control-padding-x-lg; } // Button Block @@ -116,16 +121,16 @@ // Button Action &.btn-action { - width: $control-size; + width: variables.$control-size; padding-left: 0; padding-right: 0; &.btn-sm { - width: $control-size-sm; + width: variables.$control-size-sm; } &.btn-lg { - width: $control-size-lg; + width: variables.$control-size-lg; } } @@ -134,18 +139,18 @@ background: transparent; border: 0; color: currentColor; - height: $unit-5; - line-height: $unit-4; - margin-left: $unit-1; + height: variables.$unit-5; + line-height: variables.$unit-4; + margin-left: variables.$unit-1; margin-right: -2px; opacity: 1; - padding: $unit-h; + padding: variables.$unit-h; text-decoration: none; - width: $unit-5; + width: variables.$unit-5; &:focus, &:hover { - background: rgba($bg-color, .5); + background: rgba(variables.$bg-color, .5); opacity: .95; } @@ -168,18 +173,18 @@ } &:not(:first-child):not(:last-child) { border-radius: 0; - margin-left: -$border-width; + margin-left: -(variables.$border-width); } &:last-child:not(:first-child) { border-bottom-left-radius: 0; border-top-left-radius: 0; - margin-left: -$border-width; + margin-left: -(variables.$border-width); } &:focus, &:hover, &:active, &.active { - z-index: $zindex-0; + z-index: variables.$zindex-0; } } diff --git a/src/_calendars.scss b/src/_calendars.scss index 1e9fd1532..8218770db 100644 --- a/src/_calendars.scss +++ b/src/_calendars.scss @@ -1,18 +1,22 @@ +@use "sass:color"; +@use "variables"; +@use "mixins/shadow"; + // Calendars .calendar { - border: $border-width solid $border-color; - border-radius: $border-radius; + border: variables.$border-width solid variables.$border-color; + border-radius: variables.$border-radius; display: block; min-width: 280px; .calendar-nav { align-items: center; - background: $bg-color; - border-top-left-radius: $border-radius; - border-top-right-radius: $border-radius; + background: variables.$bg-color; + border-top-left-radius: variables.$border-radius; + border-top-right-radius: variables.$border-radius; display: flex; - font-size: $font-size-lg; - padding: $layout-spacing; + font-size: variables.$font-size-lg; + padding: variables.$layout-spacing; } .calendar-header, @@ -20,7 +24,7 @@ display: flex; flex-wrap: wrap; justify-content: center; - padding: $layout-spacing 0; + padding: variables.$layout-spacing 0; .calendar-date { flex: 0 0 14.28%; // 7 calendar-items each row @@ -29,62 +33,65 @@ } .calendar-header { - background: $bg-color; - border-bottom: $border-width solid $border-color; - color: $gray-color; - font-size: $font-size-sm; + background: variables.$bg-color; + border-bottom: variables.$border-width solid variables.$border-color; + color: variables.$gray-color; + font-size: variables.$font-size-sm; text-align: center; } .calendar-body { - color: $gray-color-dark; + color: variables.$gray-color-dark; } .calendar-date { border: 0; - padding: $unit-1; + padding: variables.$unit-1; .date-item { appearance: none; background: transparent; - border: $border-width solid transparent; + border: variables.$border-width solid transparent; border-radius: 50%; - color: $gray-color-dark; + color: variables.$gray-color-dark; cursor: pointer; - font-size: $font-size-sm; - height: $unit-7; - line-height: $unit-5; + font-size: variables.$font-size-sm; + height: variables.$unit-7; + line-height: variables.$unit-5; outline: none; - padding: $unit-h; + padding: variables.$unit-h; position: relative; text-align: center; text-decoration: none; - transition: background .2s, border .2s, box-shadow .2s, color .2s; + transition: background 0.2s, border 0.2s, box-shadow 0.2s, color 0.2s; vertical-align: middle; white-space: nowrap; - width: $unit-7; + width: variables.$unit-7; &.date-today { - border-color: $secondary-color-dark; - color: $primary-color; + border-color: variables.$secondary-color-dark; + color: variables.$primary-color; } &:focus { - @include control-shadow(); + @include shadow.control-shadow(); } &:focus, &:hover { - background: $secondary-color-light; - border-color: $secondary-color-dark; - color: $primary-color; + background: variables.$secondary-color-light; + border-color: variables.$secondary-color-dark; + color: variables.$primary-color; text-decoration: none; } &:active, &.active { - background: $primary-color-dark; - border-color: darken($primary-color-dark, 5%); - color: $light-color; + background: variables.$primary-color-dark; + border-color: color.adjust( + variables.$primary-color-dark, + $lightness: -5% + ); + color: variables.$light-color; } // Calendar badge support @@ -103,7 +110,7 @@ &:disabled, &.disabled { cursor: default; - opacity: .25; + opacity: 0.25; pointer-events: none; } } @@ -112,7 +119,7 @@ &.next-month { .date-item, .calendar-event { - opacity: .25; + opacity: 0.25; } } } @@ -121,9 +128,9 @@ position: relative; &::before { - background: $secondary-color; - content: ""; - height: $unit-7; + background: variables.$secondary-color; + content: ''; + height: variables.$unit-7; left: 0; position: absolute; right: 0; @@ -144,14 +151,17 @@ &.range-start, &.range-end { .date-item { - background: $primary-color-dark; - border-color: darken($primary-color-dark, 5%); - color: $light-color; + background: variables.$primary-color-dark; + border-color: color.adjust( + variables.$primary-color-dark, + $lightness: -5% + ); + color: variables.$light-color; } } .date-item { - color: $primary-color; + color: variables.$primary-color; } } @@ -161,8 +171,8 @@ padding: 0; .calendar-date { - border-bottom: $border-width solid $border-color; - border-right: $border-width solid $border-color; + border-bottom: variables.$border-width solid variables.$border-color; + border-right: variables.$border-width solid variables.$border-color; display: flex; flex-direction: column; height: 5.5rem; @@ -171,7 +181,7 @@ &:nth-child(7n) { border-right: 0; } - &:nth-last-child(-n+7) { + &:nth-last-child(-n + 7) { border-bottom: 0; } } @@ -179,9 +189,9 @@ .date-item { align-self: flex-end; - height: $unit-7; - margin-right: $layout-spacing-sm; - margin-top: $layout-spacing-sm; + height: variables.$unit-7; + margin-right: variables.$layout-spacing-sm; + margin-top: variables.$layout-spacing-sm; } .calendar-range { @@ -205,14 +215,14 @@ flex-grow: 1; line-height: 1; overflow-y: auto; - padding: $layout-spacing-sm; + padding: variables.$layout-spacing-sm; } .calendar-event { - border-radius: $border-radius; - font-size: $font-size-sm; + border-radius: variables.$border-radius; + font-size: variables.$font-size-sm; display: block; - margin: $unit-h auto; + margin: variables.$unit-h auto; overflow: hidden; padding: 3px 4px; text-overflow: ellipsis; diff --git a/src/_cards.scss b/src/_cards.scss index 6b712e153..b6b6af4a1 100644 --- a/src/_cards.scss +++ b/src/_cards.scss @@ -1,19 +1,21 @@ +@use "variables"; + // Cards .card { - background: $bg-color-light; - border: $border-width solid $border-color; - border-radius: $border-radius; + background: variables.$bg-color-light; + border: variables.$border-width solid variables.$border-color; + border-radius: variables.$border-radius; display: flex; flex-direction: column; .card-header, .card-body, .card-footer { - padding: $layout-spacing-lg; + padding: variables.$layout-spacing-lg; padding-bottom: 0; &:last-child { - padding-bottom: $layout-spacing-lg; + padding-bottom: variables.$layout-spacing-lg; } } @@ -22,21 +24,21 @@ } .card-image { - padding-top: $layout-spacing-lg; + padding-top: variables.$layout-spacing-lg; &:first-child { padding-top: 0; img { - border-top-left-radius: $border-radius; - border-top-right-radius: $border-radius; + border-top-left-radius: variables.$border-radius; + border-top-right-radius: variables.$border-radius; } } &:last-child { img { - border-bottom-left-radius: $border-radius; - border-bottom-right-radius: $border-radius; + border-bottom-left-radius: variables.$border-radius; + border-bottom-right-radius: variables.$border-radius; } } } diff --git a/src/_carousels.scss b/src/_carousels.scss index 66dc51b27..0297def56 100644 --- a/src/_carousels.scss +++ b/src/_carousels.scss @@ -1,3 +1,5 @@ +@use "variables"; + // Carousels // The number of carousel images $carousel-number: 8; @@ -5,21 +7,21 @@ $carousel-number: 8; %carousel-image-checked { animation: carousel-slidein .75s ease-in-out 1; opacity: 1; - z-index: $zindex-1; + z-index: variables.$zindex-1; } %carousel-nav-checked { - color: $gray-color-light; + color: variables.$gray-color-light; } .carousel { - background: $bg-color; + background: variables.$bg-color; display: block; overflow: hidden; position: relative; width: 100%; -webkit-overflow-scrolling: touch; - z-index: $zindex-0; + z-index: variables.$zindex-0; .carousel-container { height: 100%; @@ -51,15 +53,15 @@ $carousel-number: 8; .item-prev, .item-next { - background: rgba($gray-color-light, .25); - border-color: rgba($gray-color-light, .5); - color: $gray-color-light; + background: rgba(variables.$gray-color-light, .25); + border-color: rgba(variables.$gray-color-light, .5); + color: variables.$gray-color-light; opacity: 0; position: absolute; top: 50%; transition: all .4s; transform: translateY(-50%); - z-index: $zindex-1; + z-index: variables.$zindex-1; } .item-prev { left: 1rem; @@ -84,21 +86,21 @@ $carousel-number: 8; } .carousel-nav { - bottom: $layout-spacing; + bottom: variables.$layout-spacing; display: flex; justify-content: center; left: 50%; position: absolute; transform: translateX(-50%); width: 10rem; - z-index: $zindex-1; + z-index: variables.$zindex-1; .nav-item { - color: rgba($gray-color-light, .5); + color: rgba(variables.$gray-color-light, .5); display: block; flex: 1 0 auto; - height: $unit-8; - margin: $unit-1; + height: variables.$unit-8; + margin: variables.$unit-1; max-width: 2.5rem; position: relative; @@ -106,7 +108,7 @@ $carousel-number: 8; background: currentColor; content: ""; display: block; - height: $unit-h; + height: variables.$unit-h; position: absolute; top: .5rem; width: 100%; diff --git a/src/_chips.scss b/src/_chips.scss index 6729c5608..d10401ac1 100644 --- a/src/_chips.scss +++ b/src/_chips.scss @@ -1,29 +1,31 @@ +@use "variables"; + // Chips .chip { align-items: center; - background: $bg-color-dark; + background: variables.$bg-color-dark; border-radius: 5rem; display: inline-flex; font-size: 90%; - height: $unit-6; - line-height: $unit-4; - margin: $unit-h; - max-width: $control-width-sm; + height: variables.$unit-6; + line-height: variables.$unit-4; + margin: variables.$unit-h; + max-width: variables.$control-width-sm; overflow: hidden; - padding: $unit-1 $unit-2; + padding: variables.$unit-1 variables.$unit-2; text-decoration: none; text-overflow: ellipsis; vertical-align: middle; white-space: nowrap; &.active { - background: $primary-color; - color: $light-color; + background: variables.$primary-color; + color: variables.$light-color; } .avatar { - margin-left: -$unit-2; - margin-right: $unit-1; + margin-left: -(variables.$unit-2); + margin-right: variables.$unit-1; } .btn-clear { diff --git a/src/_codes.scss b/src/_codes.scss index 817452bde..51e7b9483 100644 --- a/src/_codes.scss +++ b/src/_codes.scss @@ -1,26 +1,30 @@ +@use "sass:color"; +@use "mixins/label"; +@use "variables"; + // Codes code { - @include label-base(); - @include label-variant($code-color, lighten($code-color, 42.5%)); + @include label.label-base(); + @include label.label-variant(variables.$code-color, color.adjust(variables.$code-color, $lightness: 42.5%)); font-size: 85%; } .code { - border-radius: $border-radius; - color: $body-font-color; + border-radius: variables.$border-radius; + color: variables.$body-font-color; position: relative; &::before { - color: $gray-color; + color: variables.$gray-color; content: attr(data-lang); - font-size: $font-size-sm; + font-size: variables.$font-size-sm; position: absolute; - right: $layout-spacing; - top: $unit-h; + right: variables.$layout-spacing; + top: variables.$unit-h; } code { - background: $bg-color; + background: variables.$bg-color; color: inherit; display: block; line-height: 1.5; diff --git a/src/_comparison-sliders.scss b/src/_comparison-sliders.scss index ec3609b3c..8639f347d 100644 --- a/src/_comparison-sliders.scss +++ b/src/_comparison-sliders.scss @@ -1,3 +1,5 @@ +@use "variables"; + // Image comparison slider // Credit: http://codepen.io/solipsistacp/pen/Gpmaq .comparison-slider { @@ -30,7 +32,7 @@ z-index: 1; .comparison-label { - right: $unit-4; + right: variables.$unit-4; } } @@ -46,38 +48,38 @@ height: 100%; left: 0; position: absolute; - right: $unit-4; + right: variables.$unit-4; top: 0; - z-index: $zindex-0; + z-index: variables.$zindex-0; } &::after { background: currentColor; border-radius: 50%; box-shadow: 0 -5px, 0 5px; - color: $light-color; + color: variables.$light-color; content: ""; height: 3px; pointer-events: none; position: absolute; - right: $unit-2; + right: variables.$unit-2; top: 50%; transform: translate(50%, -50%); width: 3px; } .comparison-label { - left: $unit-4; + left: variables.$unit-4; } } .comparison-resizer { animation: first-run 1.5s 1 ease-in-out; cursor: ew-resize; - height: $unit-4; + height: variables.$unit-4; left: 0; max-width: 100%; - min-width: $unit-4; + min-width: variables.$unit-4; opacity: 0; outline: none; position: relative; @@ -88,10 +90,10 @@ } .comparison-label { - background: rgba($dark-color, .5); - bottom: $unit-4; - color: $light-color; - padding: $unit-1 $unit-2; + background: rgba(variables.$dark-color, .5); + bottom: variables.$unit-4; + color: variables.$light-color; + padding: variables.$unit-1 variables.$unit-2; position: absolute; user-select: none; } @@ -102,13 +104,13 @@ width: 0; } 25% { - width: $unit-12; + width: variables.$unit-12; } 50% { - width: $unit-4; + width: variables.$unit-4; } 75% { - width: $unit-6; + width: variables.$unit-6; } 100% { width: 0; diff --git a/src/_dropdowns.scss b/src/_dropdowns.scss index 324440ba4..91dc3c424 100644 --- a/src/_dropdowns.scss +++ b/src/_dropdowns.scss @@ -1,3 +1,5 @@ +@use "variables"; + // Dropdown .dropdown { display: inline-block; @@ -29,8 +31,8 @@ // Fix dropdown-toggle border radius in button groups .btn-group { .dropdown-toggle:nth-last-child(2) { - border-bottom-right-radius: $border-radius; - border-top-right-radius: $border-radius; + border-bottom-right-radius: variables.$border-radius; + border-top-right-radius: variables.$border-radius; } } } diff --git a/src/_empty.scss b/src/_empty.scss index accba9ca8..056d2a512 100644 --- a/src/_empty.scss +++ b/src/_empty.scss @@ -1,21 +1,23 @@ +@use "variables"; + // Empty states (or Blank slates) .empty { - background: $bg-color; - border-radius: $border-radius; - color: $gray-color-dark; + background: variables.$bg-color; + border-radius: variables.$border-radius; + color: variables.$gray-color-dark; text-align: center; - padding: $unit-16 $unit-8; + padding: variables.$unit-16 variables.$unit-8; .empty-icon { - margin-bottom: $layout-spacing-lg; + margin-bottom: variables.$layout-spacing-lg; } .empty-title, .empty-subtitle { - margin: $layout-spacing auto; + margin: variables.$layout-spacing auto; } .empty-action { - margin-top: $layout-spacing-lg; + margin-top: variables.$layout-spacing-lg; } } diff --git a/src/_filters.scss b/src/_filters.scss index 37ccc89ed..ba4716eaa 100644 --- a/src/_filters.scss +++ b/src/_filters.scss @@ -1,10 +1,12 @@ +@use "variables"; + // Filters // The number of filter options $filter-number: 8 !default; %filter-checked-nav { - background: $primary-color; - color: $light-color; + background: variables.$primary-color; + color: variables.$light-color; } %filter-checked-body { @@ -13,7 +15,7 @@ $filter-number: 8 !default; .filter { .filter-nav { - margin: $layout-spacing 0; + margin: variables.$layout-spacing 0; } .filter-body { diff --git a/src/_forms.scss b/src/_forms.scss index 20a6b4fa3..e290e9500 100644 --- a/src/_forms.scss +++ b/src/_forms.scss @@ -1,74 +1,78 @@ +@use "sass:color"; +@use "mixins/shadow"; +@use "variables"; + // Forms .form-group { &:not(:last-child) { - margin-bottom: $layout-spacing; + margin-bottom: variables.$layout-spacing; } } fieldset { - margin-bottom: $layout-spacing-lg; + margin-bottom: variables.$layout-spacing-lg; } legend { - font-size: $font-size-lg; + font-size: variables.$font-size-lg; font-weight: 500; - margin-bottom: $layout-spacing-lg; + margin-bottom: variables.$layout-spacing-lg; } // Form element: Label .form-label { display: block; - line-height: $line-height; - padding: $control-padding-y + $border-width 0; + line-height: variables.$line-height; + padding: variables.$control-padding-y + variables.$border-width 0; &.label-sm { - font-size: $font-size-sm; - padding: $control-padding-y-sm + $border-width 0; + font-size: variables.$font-size-sm; + padding: variables.$control-padding-y-sm + variables.$border-width 0; } &.label-lg { - font-size: $font-size-lg; - padding: $control-padding-y-lg + $border-width 0; + font-size: variables.$font-size-lg; + padding: variables.$control-padding-y-lg + variables.$border-width 0; } } // Form element: Input .form-input { appearance: none; - background: $bg-color-light; + background: variables.$bg-color-light; background-image: none; - border: $border-width solid $border-color-dark; - border-radius: $border-radius; - color: $body-font-color; + border: variables.$border-width solid variables.$border-color-dark; + border-radius: variables.$border-radius; + color: variables.$body-font-color; display: block; - font-size: $font-size; - height: $control-size; - line-height: $line-height; + font-size: variables.$font-size; + height: variables.$control-size; + line-height: variables.$line-height; max-width: 100%; outline: none; - padding: $control-padding-y $control-padding-x; + padding: variables.$control-padding-y variables.$control-padding-x; position: relative; transition: background .2s, border .2s, box-shadow .2s, color .2s; width: 100%; &:focus { - @include control-shadow(); - border-color: $primary-color; + @include shadow.control-shadow(); + border-color: variables.$primary-color; } &::placeholder { - color: $gray-color; + color: variables.$gray-color; } // Input sizes &.input-sm { - font-size: $font-size-sm; - height: $control-size-sm; - padding: $control-padding-y-sm $control-padding-x-sm; + font-size: variables.$font-size-sm; + height: variables.$control-size-sm; + padding: variables.$control-padding-y-sm variables.$control-padding-x-sm; } &.input-lg { - font-size: $font-size-lg; - height: $control-size-lg; - padding: $control-padding-y-lg $control-padding-x-lg; + font-size: variables.$font-size-lg; + height: variables.$control-size-lg; + padding: variables.$control-padding-y-lg variables.$control-padding-x-lg; } &.input-inline { @@ -94,38 +98,38 @@ textarea.form-input { // Form element: Input hint .form-input-hint { - color: $gray-color; - font-size: $font-size-sm; - margin-top: $unit-1; + color: variables.$gray-color; + font-size: variables.$font-size-sm; + margin-top: variables.$unit-1; .has-success &, .is-success + & { - color: $success-color; + color: variables.$success-color; } .has-error &, .is-error + & { - color: $error-color; + color: variables.$error-color; } } // Form element: Select .form-select { appearance: none; - border: $border-width solid $border-color-dark; - border-radius: $border-radius; + border: variables.$border-width solid variables.$border-color-dark; + border-radius: variables.$border-radius; color: inherit; - font-size: $font-size; - height: $control-size; - line-height: $line-height; + font-size: variables.$font-size; + height: variables.$control-size; + line-height: variables.$line-height; outline: none; - padding: $control-padding-y $control-padding-x; + padding: variables.$control-padding-y variables.$control-padding-x; vertical-align: middle; width: 100%; - background: $bg-color-light; + background: variables.$bg-color-light; &:focus { - @include control-shadow(); - border-color: $primary-color; + @include shadow.control-shadow(); + border-color: variables.$primary-color; } &::-ms-expand { display: none; @@ -133,30 +137,30 @@ textarea.form-input { // Select sizes &.select-sm { - font-size: $font-size-sm; - height: $control-size-sm; - padding: $control-padding-y-sm ($control-icon-size + $control-padding-x-sm) $control-padding-y-sm $control-padding-x-sm; + font-size: variables.$font-size-sm; + height: variables.$control-size-sm; + padding: variables.$control-padding-y-sm (variables.$control-icon-size + variables.$control-padding-x-sm) variables.$control-padding-y-sm variables.$control-padding-x-sm; } &.select-lg { - font-size: $font-size-lg; - height: $control-size-lg; - padding: $control-padding-y-lg ($control-icon-size + $control-padding-x-lg) $control-padding-y-lg $control-padding-x-lg; + font-size: variables.$font-size-lg; + height: variables.$control-size-lg; + padding: variables.$control-padding-y-lg (variables.$control-icon-size + variables.$control-padding-x-lg) variables.$control-padding-y-lg variables.$control-padding-x-lg; } // Multiple select &[size], &[multiple] { height: auto; - padding: $control-padding-y $control-padding-x; + padding: variables.$control-padding-y variables.$control-padding-x; option { - padding: $unit-h $unit-1; + padding: variables.$unit-h variables.$unit-1; } } &:not([multiple]):not([size]) { - background: $bg-color-light url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center / .4rem .5rem; - padding-right: $control-icon-size + $control-padding-x; + background: variables.$bg-color-light url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center / .4rem .5rem; + padding-right: variables.$control-icon-size + variables.$control-padding-x; } } @@ -166,33 +170,33 @@ textarea.form-input { position: relative; .form-icon { - height: $control-icon-size; - margin: 0 $control-padding-y; + height: variables.$control-icon-size; + margin: 0 variables.$control-padding-y; position: absolute; top: 50%; transform: translateY(-50%); - width: $control-icon-size; - z-index: $zindex-0 + 1; + width: variables.$control-icon-size; + z-index: variables.$zindex-0 + 1; } } .has-icon-left { .form-icon { - left: $border-width; + left: variables.$border-width; } .form-input { - padding-left: $control-icon-size + $control-padding-y * 2; + padding-left: variables.$control-icon-size + variables.$control-padding-y * 2; } } .has-icon-right { .form-icon { - right: $border-width; + right: variables.$border-width; } .form-input { - padding-right: $control-icon-size + $control-padding-y * 2; + padding-right: variables.$control-icon-size + variables.$control-padding-y * 2; } } @@ -201,10 +205,10 @@ textarea.form-input { .form-radio, .form-switch { display: block; - line-height: $line-height; - margin: ($control-size - $control-size-sm) / 2 0; - min-height: $control-size-sm; - padding: (($control-size-sm - $line-height) / 2) $control-padding-x (($control-size-sm - $line-height) / 2) ($control-icon-size + $control-padding-x); + line-height: variables.$line-height; + margin: (variables.$control-size - variables.$control-size-sm) / 2 0; + min-height: variables.$control-size-sm; + padding: ((variables.$control-size-sm - variables.$line-height) / 2) variables.$control-padding-x ((variables.$control-size-sm - variables.$line-height) / 2) (variables.$control-icon-size + variables.$control-padding-x); position: relative; input { @@ -215,17 +219,17 @@ textarea.form-input { position: absolute; width: 1px; &:focus + .form-icon { - @include control-shadow(); - border-color: $primary-color; + @include shadow.control-shadow(); + border-color: variables.$primary-color; } &:checked + .form-icon { - background: $primary-color; - border-color: $primary-color; + background: variables.$primary-color; + border-color: variables.$primary-color; } } .form-icon { - border: $border-width solid $border-color-dark; + border: variables.$border-width solid variables.$border-color-dark; cursor: pointer; display: inline-block; position: absolute; @@ -234,42 +238,42 @@ textarea.form-input { // Input checkbox, radio and switch sizes &.input-sm { - font-size: $font-size-sm; + font-size: variables.$font-size-sm; margin: 0; } &.input-lg { - font-size: $font-size-lg; - margin: ($control-size-lg - $control-size-sm) / 2 0; + font-size: variables.$font-size-lg; + margin: (variables.$control-size-lg - variables.$control-size-sm) / 2 0; } } .form-checkbox, .form-radio { .form-icon { - background: $bg-color-light; - height: $control-icon-size; + background: variables.$bg-color-light; + height: variables.$control-icon-size; left: 0; - top: ($control-size-sm - $control-icon-size) / 2; - width: $control-icon-size; + top: (variables.$control-size-sm - variables.$control-icon-size) / 2; + width: variables.$control-icon-size; } input { &:active + .form-icon { - background: $bg-color-dark; + background: variables.$bg-color-dark; } } } .form-checkbox { .form-icon { - border-radius: $border-radius; + border-radius: variables.$border-radius; } input { &:checked + .form-icon { &::before { background-clip: padding-box; - border: $border-width-lg solid $light-color; + border: variables.$border-width-lg solid variables.$light-color; border-left-width: 0; border-top-width: 0; content: ""; @@ -284,10 +288,10 @@ textarea.form-input { } } &:indeterminate + .form-icon { - background: $primary-color; - border-color: $primary-color; + background: variables.$primary-color; + border-color: variables.$primary-color; &::before { - background: $bg-color-light; + background: variables.$bg-color-light; content: ""; height: 2px; left: 50%; @@ -308,7 +312,7 @@ textarea.form-input { input { &:checked + .form-icon { &::before { - background: $bg-color-light; + background: variables.$bg-color-light; border-radius: 50%; content: ""; height: 6px; @@ -324,27 +328,27 @@ textarea.form-input { // Form element: Switch .form-switch { - padding-left: ($unit-8 + $control-padding-x); + padding-left: (variables.$unit-8 + variables.$control-padding-x); .form-icon { - background: $gray-color; + background: variables.$gray-color; background-clip: padding-box; - border-radius: $unit-2 + $border-width; - height: $unit-4 + $border-width * 2; + border-radius: variables.$unit-2 + variables.$border-width; + height: variables.$unit-4 + variables.$border-width * 2; left: 0; - top: ($control-size-sm - $unit-4) / 2 - $border-width; - width: $unit-8; + top: (variables.$control-size-sm - variables.$unit-4) / 2 - variables.$border-width; + width: variables.$unit-8; &::before { - background: $bg-color-light; + background: variables.$bg-color-light; border-radius: 50%; content: ""; display: block; - height: $unit-4; + height: variables.$unit-4; left: 0; position: absolute; top: 0; transition: background .2s, border .2s, box-shadow .2s, color .2s, left .2s; - width: $unit-4; + width: variables.$unit-4; } } @@ -356,7 +360,7 @@ textarea.form-input { } &:active + .form-icon { &::before { - background: $bg-color; + background: variables.$bg-color; } } } @@ -367,21 +371,21 @@ textarea.form-input { display: flex; .input-group-addon { - background: $bg-color; - border: $border-width solid $border-color-dark; - border-radius: $border-radius; - line-height: $line-height; - padding: $control-padding-y $control-padding-x; + background: variables.$bg-color; + border: variables.$border-width solid variables.$border-color-dark; + border-radius: variables.$border-radius; + line-height: variables.$line-height; + padding: variables.$control-padding-y variables.$control-padding-x; white-space: nowrap; &.addon-sm { - font-size: $font-size-sm; - padding: $control-padding-y-sm $control-padding-x-sm; + font-size: variables.$font-size-sm; + padding: variables.$control-padding-y-sm variables.$control-padding-x-sm; } &.addon-lg { - font-size: $font-size-lg; - padding: $control-padding-y-lg $control-padding-x-lg; + font-size: variables.$font-size-lg; + padding: variables.$control-padding-y-lg variables.$control-padding-x-lg; } } @@ -392,7 +396,7 @@ textarea.form-input { } .input-group-btn { - z-index: $zindex-0; + z-index: variables.$zindex-0; } .form-input, @@ -405,15 +409,15 @@ textarea.form-input { } &:not(:first-child):not(:last-child) { border-radius: 0; - margin-left: -$border-width; + margin-left: -(variables.$border-width); } &:last-child:not(:first-child) { border-bottom-left-radius: 0; border-top-left-radius: 0; - margin-left: -$border-width; + margin-left: -(variables.$border-width); } &:focus { - z-index: $zindex-0 + 1; + z-index: variables.$zindex-0 + 1; } } @@ -431,19 +435,19 @@ textarea.form-input { .form-select { .has-success &, &.is-success { - background: lighten($success-color, 53%); - border-color: $success-color; + background: color.adjust(variables.$success-color, $lightness: 53%); + border-color: variables.$success-color; &:focus { - @include control-shadow($success-color); + @include shadow.control-shadow(variables.$success-color); } } .has-error &, &.is-error { - background: lighten($error-color, 53%); - border-color: $error-color; + background: color.adjust(variables.$error-color, $lightness: 53%); + border-color: variables.$error-color; &:focus { - @include control-shadow($error-color); + @include shadow.control-shadow(variables.$error-color); } } } @@ -454,18 +458,18 @@ textarea.form-input { .has-error &, &.is-error { .form-icon { - border-color: $error-color; + border-color: variables.$error-color; } input { &:checked + .form-icon { - background: $error-color; - border-color: $error-color; + background: variables.$error-color; + border-color: variables.$error-color; } &:focus + .form-icon { - @include control-shadow($error-color); - border-color: $error-color; + @include shadow.control-shadow(variables.$error-color); + border-color: variables.$error-color; } } } @@ -476,8 +480,8 @@ textarea.form-input { &.is-error { input { &:indeterminate + .form-icon { - background: $error-color; - border-color: $error-color; + background: variables.$error-color; + border-color: variables.$error-color; } } } @@ -487,14 +491,14 @@ textarea.form-input { .form-input { &:not(:placeholder-shown) { &:invalid { - border-color: $error-color; + border-color: variables.$error-color; &:focus { - @include control-shadow($error-color); - background: lighten($error-color, 53%); + @include shadow.control-shadow(variables.$error-color); + background: color.adjust(variables.$error-color, $lightness: 53%); } & + .form-input-hint { - color: $error-color; + color: variables.$error-color; } } } @@ -505,7 +509,7 @@ textarea.form-input { .form-select { &:disabled, &.disabled { - background-color: $bg-color-dark; + background-color: variables.$bg-color-dark; cursor: not-allowed; opacity: .5; } @@ -513,7 +517,7 @@ textarea.form-input { .form-input { &[readonly] { - background-color: $bg-color; + background-color: variables.$bg-color; } } @@ -521,7 +525,7 @@ input { &:disabled, &.disabled { & + .form-icon { - background: $bg-color-dark; + background: variables.$bg-color-dark; cursor: not-allowed; opacity: .5; } @@ -533,7 +537,7 @@ input { &:disabled, &.disabled { & + .form-icon::before { - background: $bg-color-light; + background: variables.$bg-color-light; } } } @@ -541,7 +545,7 @@ input { // Form horizontal .form-horizontal { - padding: $layout-spacing 0; + padding: variables.$layout-spacing 0; .form-group { display: flex; diff --git a/src/_hero.scss b/src/_hero.scss index 004446181..910d0342c 100644 --- a/src/_hero.scss +++ b/src/_hero.scss @@ -1,3 +1,5 @@ +@use "variables"; + // Hero .hero { display: flex; @@ -17,6 +19,6 @@ } .hero-body { - padding: $layout-spacing; + padding: variables.$layout-spacing; } } \ No newline at end of file diff --git a/src/_icons.scss b/src/_icons.scss index 4f3c5ce66..1c099e6cb 100644 --- a/src/_icons.scss +++ b/src/_icons.scss @@ -1,5 +1,5 @@ // CSS Icons -@import "icons/icons-core"; -@import "icons/icons-navigation"; -@import "icons/icons-action"; -@import "icons/icons-object"; \ No newline at end of file +@use "icons/icons-core"; +@use "icons/icons-navigation"; +@use "icons/icons-action"; +@use "icons/icons-object"; \ No newline at end of file diff --git a/src/_labels.scss b/src/_labels.scss index ca693cd2c..88aa69609 100644 --- a/src/_labels.scss +++ b/src/_labels.scss @@ -1,7 +1,11 @@ +@use "sass:color"; +@use "mixins/label"; +@use "variables"; + // Labels .label { - @include label-base(); - @include label-variant(lighten($body-font-color, 5%), $bg-color-dark); + @include label.label-base(); + @include label.label-variant(color.adjust(variables.$body-font-color, $lightness: 5%), variables.$bg-color-dark); display: inline-block; // Label rounded @@ -13,22 +17,22 @@ // Label colors &.label-primary { - @include label-variant($light-color, $primary-color); + @include label.label-variant(variables.$light-color, variables.$primary-color); } &.label-secondary { - @include label-variant($primary-color, $secondary-color); + @include label.label-variant(variables.$primary-color, variables.$secondary-color); } &.label-success { - @include label-variant($light-color, $success-color); + @include label.label-variant(variables.$light-color, variables.$success-color); } &.label-warning { - @include label-variant($light-color, $warning-color); + @include label.label-variant(variables.$light-color, variables.$warning-color); } &.label-error { - @include label-variant($light-color, $error-color); + @include label.label-variant(variables.$light-color, variables.$error-color); } } diff --git a/src/_layout.scss b/src/_layout.scss index e6bad9ad0..10edc4cb5 100644 --- a/src/_layout.scss +++ b/src/_layout.scss @@ -1,31 +1,33 @@ +@use "variables"; + // Layout .container { margin-left: auto; margin-right: auto; - padding-left: $layout-spacing; - padding-right: $layout-spacing; + padding-left: variables.$layout-spacing; + padding-right: variables.$layout-spacing; width: 100%; - $grid-spacing: ($layout-spacing / ($layout-spacing * 0 + 1)) * $html-font-size; + $grid-spacing: (variables.$layout-spacing / (variables.$layout-spacing * 0 + 1)) * variables.$html-font-size; &.grid-xl { - max-width: $grid-spacing * 2 + $size-xl; + max-width: $grid-spacing * 2 + variables.$size-xl; } &.grid-lg { - max-width: $grid-spacing * 2 + $size-lg; + max-width: $grid-spacing * 2 + variables.$size-lg; } &.grid-md { - max-width: $grid-spacing * 2 + $size-md; + max-width: $grid-spacing * 2 + variables.$size-md; } &.grid-sm { - max-width: $grid-spacing * 2 + $size-sm; + max-width: $grid-spacing * 2 + variables.$size-sm; } &.grid-xs { - max-width: $grid-spacing * 2 + $size-xs; + max-width: $grid-spacing * 2 + variables.$size-xs; } } @@ -43,8 +45,8 @@ .columns { display: flex; flex-wrap: wrap; - margin-left: -$layout-spacing; - margin-right: -$layout-spacing; + margin-left: -(variables.$layout-spacing); + margin-right: -(variables.$layout-spacing); &.col-gapless { margin-left: 0; @@ -64,8 +66,8 @@ .column { flex: 1; max-width: 100%; - padding-left: $layout-spacing; - padding-right: $layout-spacing; + padding-left: variables.$layout-spacing; + padding-right: variables.$layout-spacing; &.col-12, &.col-11, @@ -134,7 +136,7 @@ .col-mr-auto { margin-right: auto; } -@media (max-width: $size-xl) { +@media (max-width: variables.$size-xl) { .col-xl-12, .col-xl-11, .col-xl-10, @@ -196,7 +198,7 @@ display: block !important; } } -@media (max-width: $size-lg) { +@media (max-width: variables.$size-lg) { .col-lg-12, .col-lg-11, .col-lg-10, @@ -258,7 +260,7 @@ display: block !important; } } -@media (max-width: $size-md) { +@media (max-width: variables.$size-md) { .col-md-12, .col-md-11, .col-md-10, @@ -320,7 +322,7 @@ display: block !important; } } -@media (max-width: $size-sm) { +@media (max-width: variables.$size-sm) { .col-sm-12, .col-sm-11, .col-sm-10, @@ -382,7 +384,7 @@ display: block !important; } } -@media (max-width: $size-xs) { +@media (max-width: variables.$size-xs) { .col-xs-12, .col-xs-11, .col-xs-10, diff --git a/src/_media.scss b/src/_media.scss index 4029e4cdb..e20ad9b03 100644 --- a/src/_media.scss +++ b/src/_media.scss @@ -1,3 +1,5 @@ +@use "variables"; + // Media // Image responsive .img-responsive { @@ -66,10 +68,10 @@ video.video-responsive { // Figure .figure { - margin: 0 0 $layout-spacing 0; + margin: 0 0 variables.$layout-spacing 0; .figure-caption { - color: $gray-color-dark; - margin-top: $layout-spacing; + color: variables.$gray-color-dark; + margin-top: variables.$layout-spacing; } } diff --git a/src/_menus.scss b/src/_menus.scss index 411cada32..4c17730b3 100644 --- a/src/_menus.scss +++ b/src/_menus.scss @@ -1,14 +1,17 @@ +@use "mixins/shadow"; +@use "variables"; + // Menus .menu { - @include shadow-variant(.05rem); - background: $bg-color-light; - border-radius: $border-radius; + @include shadow.shadow-variant(.05rem); + background: variables.$bg-color-light; + border-radius: variables.$border-radius; list-style: none; margin: 0; - min-width: $control-width-xs; - padding: $unit-2; - transform: translateY($layout-spacing-sm); - z-index: $zindex-3; + min-width: variables.$control-width-xs; + padding: variables.$unit-2; + transform: translateY(variables.$layout-spacing-sm); + z-index: variables.$zindex-3; &.menu-nav { background: transparent; @@ -17,37 +20,37 @@ .menu-item { margin-top: 0; - padding: 0 $unit-2; + padding: 0 variables.$unit-2; position: relative; text-decoration: none; & > a { - border-radius: $border-radius; + border-radius: variables.$border-radius; color: inherit; display: block; - margin: 0 (-$unit-2); - padding: $unit-1 $unit-2; + margin: 0 (-(variables.$unit-2)); + padding: variables.$unit-1 variables.$unit-2; text-decoration: none; &:focus, &:hover { - background: $secondary-color; - color: $primary-color; + background: variables.$secondary-color; + color: variables.$primary-color; } &:active, &.active { - background: $secondary-color; - color: $primary-color; + background: variables.$secondary-color; + color: variables.$primary-color; } } .form-checkbox, .form-radio, .form-switch { - margin: $unit-h 0; + margin: variables.$unit-h 0; } & + .menu-item { - margin-top: $unit-1; + margin-top: variables.$unit-1; } } @@ -60,7 +63,7 @@ top: 0; .label { - margin-right: $unit-2; + margin-right: variables.$unit-2; } } } \ No newline at end of file diff --git a/src/_meters.scss b/src/_meters.scss index 9fd98b0e9..cc8b8c685 100644 --- a/src/_meters.scss +++ b/src/_meters.scss @@ -1,13 +1,15 @@ +@use "variables"; + // Meters // Credit: https://css-tricks.com/html5-meter-element/ .meter { appearance: none; - background: $bg-color; + background: variables.$bg-color; border: 0; - border-radius: $border-radius; + border-radius: variables.$border-radius; display: block; width: 100%; - height: $unit-4; + height: variables.$unit-4; &::-webkit-meter-inner-element { display: block; @@ -17,41 +19,41 @@ &::-webkit-meter-optimum-value, &::-webkit-meter-suboptimum-value, &::-webkit-meter-even-less-good-value { - border-radius: $border-radius; + border-radius: variables.$border-radius; } &::-webkit-meter-bar { - background: $bg-color; + background: variables.$bg-color; } &::-webkit-meter-optimum-value { - background: $success-color; + background: variables.$success-color; } &::-webkit-meter-suboptimum-value { - background: $warning-color; + background: variables.$warning-color; } &::-webkit-meter-even-less-good-value { - background: $error-color; + background: variables.$error-color; } &::-moz-meter-bar, &:-moz-meter-optimum, &:-moz-meter-sub-optimum, &:-moz-meter-sub-sub-optimum { - border-radius: $border-radius; + border-radius: variables.$border-radius; } &:-moz-meter-optimum::-moz-meter-bar { - background: $success-color; + background: variables.$success-color; } &:-moz-meter-sub-optimum::-moz-meter-bar { - background: $warning-color; + background: variables.$warning-color; } &:-moz-meter-sub-sub-optimum::-moz-meter-bar { - background: $error-color; + background: variables.$error-color; } } diff --git a/src/_mixins.scss b/src/_mixins.scss index d3a28d555..25f413da8 100644 --- a/src/_mixins.scss +++ b/src/_mixins.scss @@ -1,10 +1,10 @@ // Mixins -@import "mixins/avatar"; -@import "mixins/button"; -@import "mixins/clearfix"; -@import "mixins/color"; -@import "mixins/label"; -@import "mixins/position"; -@import "mixins/shadow"; -@import "mixins/text"; -@import "mixins/toast"; \ No newline at end of file +@use "mixins/avatar"; +@use "mixins/button"; +@use "mixins/clearfix"; +@use "mixins/color"; +@use "mixins/label"; +@use "mixins/position"; +@use "mixins/shadow"; +@use "mixins/text"; +@use "mixins/toast"; \ No newline at end of file diff --git a/src/_modals.scss b/src/_modals.scss index a7b3f10ec..471a2253f 100644 --- a/src/_modals.scss +++ b/src/_modals.scss @@ -1,3 +1,6 @@ +@use "mixins/shadow"; +@use "variables"; + // Modals .modal { align-items: center; @@ -7,7 +10,7 @@ left: 0; opacity: 0; overflow: hidden; - padding: $layout-spacing; + padding: variables.$layout-spacing; position: fixed; right: 0; top: 0; @@ -16,10 +19,10 @@ &.active { display: flex; opacity: 1; - z-index: $zindex-4; + z-index: variables.$zindex-4; .modal-overlay { - background: rgba($bg-color, .75); + background: rgba(variables.$bg-color, .75); bottom: 0; cursor: default; display: block; @@ -31,38 +34,38 @@ .modal-container { animation: slide-down .2s ease 1; - z-index: $zindex-0; + z-index: variables.$zindex-0; } } &.modal-sm { .modal-container { - max-width: $control-width-sm; - padding: 0 $unit-2; + max-width: variables.$control-width-sm; + padding: 0 variables.$unit-2; } } &.modal-lg { .modal-overlay { - background: $bg-color-light; + background: variables.$bg-color-light; } .modal-container { box-shadow: none; - max-width: $control-width-lg; + max-width: variables.$control-width-lg; } } } .modal-container { - @include shadow-variant(.2rem); - background: $bg-color-light; - border-radius: $border-radius; + @include shadow.shadow-variant(.2rem); + background: variables.$bg-color-light; + border-radius: variables.$border-radius; display: flex; flex-direction: column; max-height: 75vh; - max-width: $control-width-md; - padding: 0 $unit-4; + max-width: variables.$control-width-md; + padding: 0 variables.$unit-4; width: 100%; &.modal-fullheight { @@ -70,18 +73,18 @@ } .modal-header { - color: $dark-color; - padding: $unit-4; + color: variables.$dark-color; + padding: variables.$unit-4; } .modal-body { overflow-y: auto; - padding: $unit-4; + padding: variables.$unit-4; position: relative; } .modal-footer { - padding: $unit-4; + padding: variables.$unit-4; text-align: right; } } diff --git a/src/_navbar.scss b/src/_navbar.scss index 11642969b..bea631407 100755 --- a/src/_navbar.scss +++ b/src/_navbar.scss @@ -1,3 +1,5 @@ +@use "variables"; + // Navbar .navbar { align-items: stretch; @@ -22,7 +24,7 @@ } .navbar-brand { - font-size: $font-size-lg; + font-size: variables.$font-size-lg; text-decoration: none; } } diff --git a/src/_navs.scss b/src/_navs.scss index 4bedc27b6..717794c3b 100644 --- a/src/_navs.scss +++ b/src/_navs.scss @@ -1,34 +1,37 @@ +@use "sass:color"; +@use "variables"; + // Navs .nav { display: flex; flex-direction: column; list-style: none; - margin: $unit-1 0; + margin: variables.$unit-1 0; .nav-item { a { - color: $gray-color-dark; - padding: $unit-1 $unit-2; + color: variables.$gray-color-dark; + padding: variables.$unit-1 variables.$unit-2; text-decoration: none; &:focus, &:hover { - color: $primary-color; + color: variables.$primary-color; } } &.active { & > a { - color: darken($gray-color-dark, 10%); + color: color.adjust(variables.$gray-color-dark, $lightness: -10%); font-weight: bold; &:focus, &:hover { - color: $primary-color; + color: variables.$primary-color; } } } } & .nav { - margin-bottom: $unit-2; - margin-left: $unit-4; + margin-bottom: variables.$unit-2; + margin-left: variables.$unit-4; } } diff --git a/src/_normalize.scss b/src/_normalize.scss index a098a84dc..e069cac06 100644 --- a/src/_normalize.scss +++ b/src/_normalize.scss @@ -1,3 +1,5 @@ +@use "variables"; + /* Manually forked from Normalize.css */ /* normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */ @@ -148,7 +150,7 @@ code, kbd, pre, samp { - font-family: $mono-font-family; /* 1 (changed) */ + font-family: variables.$mono-font-family; /* 1 (changed) */ font-size: 1em; /* 2 */ } diff --git a/src/_off-canvas.scss b/src/_off-canvas.scss index f3b8b9f1c..96d15719f 100644 --- a/src/_off-canvas.scss +++ b/src/_off-canvas.scss @@ -1,5 +1,7 @@ +@use "variables"; + // Off canvas menus -$off-canvas-breakpoint: $size-lg !default; +$off-canvas-breakpoint: variables.$size-lg !default; .off-canvas { display: flex; @@ -11,26 +13,26 @@ $off-canvas-breakpoint: $size-lg !default; .off-canvas-toggle { display: block; position: absolute; - top: $layout-spacing; + top: variables.$layout-spacing; transition: none; - z-index: $zindex-0; - @if $rtl == true { - right: $layout-spacing; + z-index: variables.$zindex-0; + @if variables.$rtl == true { + right: variables.$layout-spacing; } @else { - left: $layout-spacing; + left: variables.$layout-spacing; } } .off-canvas-sidebar { - background: $bg-color; + background: variables.$bg-color; bottom: 0; min-width: 10rem; overflow-y: auto; position: fixed; top: 0; transition: transform .25s; - z-index: $zindex-2; - @if $rtl == true { + z-index: variables.$zindex-2; + @if variables.$rtl == true { right: 0; transform: translateX(100%); } @else { @@ -42,11 +44,11 @@ $off-canvas-breakpoint: $size-lg !default; .off-canvas-content { flex: 1 1 auto; height: 100%; - padding: $layout-spacing $layout-spacing $layout-spacing 4rem; + padding: variables.$layout-spacing variables.$layout-spacing variables.$layout-spacing 4rem; } .off-canvas-overlay { - background: rgba($dark-color, .1); + background: rgba(variables.$dark-color, .1); border-color: transparent; border-radius: 0; bottom: 0; @@ -68,7 +70,7 @@ $off-canvas-breakpoint: $size-lg !default; &:target ~ .off-canvas-overlay, &.active ~ .off-canvas-overlay { display: block; - z-index: $zindex-1; + z-index: variables.$zindex-1; } } } diff --git a/src/_pagination.scss b/src/_pagination.scss index 4c0e01132..60b821395 100644 --- a/src/_pagination.scss +++ b/src/_pagination.scss @@ -1,26 +1,28 @@ +@use "variables"; + // Pagination .pagination { display: flex; list-style: none; - margin: $unit-1 0; - padding: $unit-1 0; + margin: variables.$unit-1 0; + padding: variables.$unit-1 0; .page-item { - margin: $unit-1 $unit-o; + margin: variables.$unit-1 variables.$unit-o; span { display: inline-block; - padding: $unit-1 $unit-1; + padding: variables.$unit-1 variables.$unit-1; } a { - border-radius: $border-radius; + border-radius: variables.$border-radius; display: inline-block; - padding: $unit-1 $unit-2; + padding: variables.$unit-1 variables.$unit-2; text-decoration: none; &:focus, &:hover { - color: $primary-color; + color: variables.$primary-color; } } @@ -34,8 +36,8 @@ &.active { a { - background: $primary-color; - color: $light-color; + background: variables.$primary-color; + color: variables.$light-color; } } diff --git a/src/_panels.scss b/src/_panels.scss index 386f96ecc..70db4dea9 100644 --- a/src/_panels.scss +++ b/src/_panels.scss @@ -1,14 +1,16 @@ +@use "variables"; + // Panels .panel { - border: $border-width solid $border-color; - border-radius: $border-radius; + border: variables.$border-width solid variables.$border-color; + border-radius: variables.$border-radius; display: flex; flex-direction: column; .panel-header, .panel-footer { flex: 0 0 auto; - padding: $layout-spacing-lg; + padding: variables.$layout-spacing-lg; } .panel-nav { @@ -18,6 +20,6 @@ .panel-body { flex: 1 1 auto; overflow-y: auto; - padding: 0 $layout-spacing-lg; + padding: 0 variables.$layout-spacing-lg; } } diff --git a/src/_parallax.scss b/src/_parallax.scss index ea244e547..54351e405 100644 --- a/src/_parallax.scss +++ b/src/_parallax.scss @@ -1,3 +1,6 @@ +@use "variables"; +@use "mixins/shadow"; + // Parallax $parallax-deg: 3deg !default; $parallax-offset: 4.5px !default; @@ -12,7 +15,7 @@ $parallax-fade-color: rgba(255, 255, 255, .35) !default; outline: none; position: absolute; width: 50%; - z-index: $zindex-1; + z-index: variables.$zindex-1; } .parallax { @@ -22,7 +25,7 @@ $parallax-fade-color: rgba(255, 255, 255, .35) !default; width: auto; .parallax-content { - @include shadow-variant(1rem); + @include shadow.shadow-variant(1rem); height: auto; transform: perspective($parallax-perspective); transform-style: preserve-3d; @@ -42,19 +45,19 @@ $parallax-fade-color: rgba(255, 255, 255, .35) !default; .parallax-front { align-items: center; - color: $light-color; + color: variables.$light-color; display: flex; height: 100%; justify-content: center; left: 0; position: absolute; text-align: center; - text-shadow: 0 0 20px rgba($dark-color, .75); + text-shadow: 0 0 20px rgba(variables.$dark-color, .75); top: 0; transform: translateZ($parallax-offset-z) scale($parallax-scale); transition: transform .4s; width: 100%; - z-index: $zindex-0; + z-index: variables.$zindex-0; } .parallax-top-left { diff --git a/src/_popovers.scss b/src/_popovers.scss index 35b6bcd83..73fe67095 100644 --- a/src/_popovers.scss +++ b/src/_popovers.scss @@ -1,3 +1,6 @@ +@use "mixins/shadow"; +@use "variables"; + // Popovers .popover { display: inline-block; @@ -6,13 +9,13 @@ .popover-container { left: 50%; opacity: 0; - padding: $layout-spacing; + padding: variables.$layout-spacing; position: absolute; top: 0; transform: translate(-50%, -50%) scale(0); transition: transform .2s; - width: $control-width-sm; - z-index: $zindex-3; + width: variables.$control-width-sm; + z-index: variables.$zindex-3; } *:focus + .popover-container, @@ -59,7 +62,7 @@ } .card { - @include shadow-variant(.2rem); + @include shadow.shadow-variant(.2rem); border: 0; } } diff --git a/src/_progress.scss b/src/_progress.scss index f173772b6..c39c831cb 100644 --- a/src/_progress.scss +++ b/src/_progress.scss @@ -1,33 +1,35 @@ +@use "variables"; + // Progress // Credit: https://css-tricks.com/html5-progress-element/ .progress { appearance: none; - background: $bg-color-dark; + background: variables.$bg-color-dark; border: 0; - border-radius: $border-radius; - color: $primary-color; - height: $unit-1; + border-radius: variables.$border-radius; + color: variables.$primary-color; + height: variables.$unit-1; position: relative; width: 100%; &::-webkit-progress-bar { background: transparent; - border-radius: $border-radius; + border-radius: variables.$border-radius; } &::-webkit-progress-value { - background: $primary-color; - border-radius: $border-radius; + background: variables.$primary-color; + border-radius: variables.$border-radius; } &::-moz-progress-bar { - background: $primary-color; - border-radius: $border-radius; + background: variables.$primary-color; + border-radius: variables.$border-radius; } &:indeterminate { animation: progress-indeterminate 1.5s linear infinite; - background: $bg-color-dark linear-gradient(to right, $primary-color 30%, $bg-color-dark 30%) top left / 150% 150% no-repeat; + background: variables.$bg-color-dark linear-gradient(to right, variables.$primary-color 30%, variables.$bg-color-dark 30%) top left / 150% 150% no-repeat; &::-moz-progress-bar { background: transparent; diff --git a/src/_sliders.scss b/src/_sliders.scss index 3ff38e801..c8274c694 100644 --- a/src/_sliders.scss +++ b/src/_sliders.scss @@ -1,3 +1,6 @@ +@use "variables"; +@use "mixins/shadow"; + // Sliders // Credit: https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/ .slider { @@ -5,10 +8,10 @@ background: transparent; display: block; width: 100%; - height: $unit-6; + height: variables.$unit-6; &:focus { - @include control-shadow(); + @include shadow.control-shadow(); outline: none; } @@ -21,29 +24,29 @@ // Slider Thumb &::-webkit-slider-thumb { -webkit-appearance: none; - background: $primary-color; + background: variables.$primary-color; border: 0; border-radius: 50%; - height: $unit-3; - margin-top: -($unit-3 - $unit-h) / 2; + height: variables.$unit-3; + margin-top: -(variables.$unit-3 - variables.$unit-h) / 2; transition: transform .2s; - width: $unit-3; + width: variables.$unit-3; } &::-moz-range-thumb { - background: $primary-color; + background: variables.$primary-color; border: 0; border-radius: 50%; - height: $unit-3; + height: variables.$unit-3; transition: transform .2s; - width: $unit-3; + width: variables.$unit-3; } &::-ms-thumb { - background: $primary-color; + background: variables.$primary-color; border: 0; border-radius: 50%; - height: $unit-3; + height: variables.$unit-3; transition: transform .2s; - width: $unit-3; + width: variables.$unit-3; } &:active { @@ -61,39 +64,39 @@ &:disabled, &.disabled { &::-webkit-slider-thumb { - background: $gray-color-light; + background: variables.$gray-color-light; transform: scale(1); } &::-moz-range-thumb { - background: $gray-color-light; + background: variables.$gray-color-light; transform: scale(1); } &::-ms-thumb { - background: $gray-color-light; + background: variables.$gray-color-light; transform: scale(1); } } // Slider Track &::-webkit-slider-runnable-track { - background: $bg-color-dark; - border-radius: $border-radius; - height: $unit-h; + background: variables.$bg-color-dark; + border-radius: variables.$border-radius; + height: variables.$unit-h; width: 100%; } &::-moz-range-track { - background: $bg-color-dark; - border-radius: $border-radius; - height: $unit-h; + background: variables.$bg-color-dark; + border-radius: variables.$border-radius; + height: variables.$unit-h; width: 100%; } &::-ms-track { - background: $bg-color-dark; - border-radius: $border-radius; - height: $unit-h; + background: variables.$bg-color-dark; + border-radius: variables.$border-radius; + height: variables.$unit-h; width: 100%; } &::-ms-fill-lower { - background: $primary-color; + background: variables.$primary-color; } } diff --git a/src/_steps.scss b/src/_steps.scss index f642ff8b6..01d2c81c7 100644 --- a/src/_steps.scss +++ b/src/_steps.scss @@ -1,9 +1,11 @@ +@use "variables"; + // Steps .step { display: flex; flex-wrap: nowrap; list-style: none; - margin: $unit-1 0; + margin: variables.$unit-1 0; width: 100%; .step-item { @@ -14,7 +16,7 @@ position: relative; &:not(:first-child)::before { - background: $primary-color; + background: variables.$primary-color; content: ""; height: 2px; left: -50%; @@ -24,45 +26,45 @@ } a { - color: $primary-color; + color: variables.$primary-color; display: inline-block; padding: 20px 10px 0; text-decoration: none; &::before { - background: $primary-color; - border: $border-width-lg solid $light-color; + background: variables.$primary-color; + border: variables.$border-width-lg solid variables.$light-color; border-radius: 50%; content: ""; display: block; - height: $unit-3; + height: variables.$unit-3; left: 50%; position: absolute; - top: $unit-1; + top: variables.$unit-1; transform: translateX(-50%); - width: $unit-3; - z-index: $zindex-0; + width: variables.$unit-3; + z-index: variables.$zindex-0; } } &.active { a { &::before { - background: $light-color; - border: $border-width-lg solid $primary-color; + background: variables.$light-color; + border: variables.$border-width-lg solid variables.$primary-color; } } & ~ .step-item { &::before { - background: $border-color; + background: variables.$border-color; } a { - color: $gray-color; + color: variables.$gray-color; &::before { - background: $border-color; + background: variables.$border-color; } } } diff --git a/src/_tables.scss b/src/_tables.scss index 656c03e50..099e0b49d 100644 --- a/src/_tables.scss +++ b/src/_tables.scss @@ -1,9 +1,11 @@ +@use "variables"; + // Tables .table { border-collapse: collapse; border-spacing: 0; width: 100%; - @if $rtl == true { + @if variables.$rtl == true { text-align: right; } @else { text-align: left; @@ -12,7 +14,7 @@ &.table-striped { tbody { tr:nth-of-type(odd) { - background: $bg-color; + background: variables.$bg-color; } } } @@ -22,7 +24,7 @@ tbody { tr { &.active { - background: $bg-color-dark; + background: variables.$bg-color-dark; } } } @@ -32,7 +34,7 @@ tbody { tr { &:hover { - background: $bg-color-dark; + background: variables.$bg-color-dark; } } } @@ -48,10 +50,10 @@ td, th { - border-bottom: $border-width solid $border-color; - padding: $unit-3 $unit-2; + border-bottom: variables.$border-width solid variables.$border-color; + padding: variables.$unit-3 variables.$unit-2; } th { - border-bottom-width: $border-width-lg; + border-bottom-width: variables.$border-width-lg; } } diff --git a/src/_tabs.scss b/src/_tabs.scss index 0dcbaf37a..28062d35b 100644 --- a/src/_tabs.scss +++ b/src/_tabs.scss @@ -1,31 +1,33 @@ +@use "variables"; + // Tabs .tab { align-items: center; - border-bottom: $border-width solid $border-color; + border-bottom: variables.$border-width solid variables.$border-color; display: flex; flex-wrap: wrap; list-style: none; - margin: $unit-1 0 ($unit-1 - $border-width) 0; + margin: variables.$unit-1 0 (variables.$unit-1 - variables.$border-width) 0; .tab-item { margin-top: 0; a { - border-bottom: $border-width-lg solid transparent; + border-bottom: variables.$border-width-lg solid transparent; color: inherit; display: block; - margin: 0 $unit-2 0 0; - padding: $unit-2 $unit-1 $unit-2 - $border-width-lg $unit-1; + margin: 0 variables.$unit-2 0 0; + padding: variables.$unit-2 variables.$unit-1 variables.$unit-2 - variables.$border-width-lg variables.$unit-1; text-decoration: none; &:focus, &:hover { - color: $link-color; + color: variables.$link-color; } } &.active a, a.active { - border-bottom-color: $primary-color; - color: $link-color; + border-bottom-color: variables.$primary-color; + color: variables.$link-color; } &.tab-action { @@ -34,7 +36,7 @@ } .btn-clear { - margin-top: -$unit-1; + margin-top: -(variables.$unit-1); } } @@ -50,8 +52,8 @@ .badge { &[data-badge]::after { position: absolute; - right: $unit-h; - top: $unit-h; + right: variables.$unit-h; + top: variables.$unit-h; transform: translate(0, 0); } } diff --git a/src/_tiles.scss b/src/_tiles.scss index 742bbaeb5..98cb072c5 100644 --- a/src/_tiles.scss +++ b/src/_tiles.scss @@ -1,3 +1,6 @@ +@use "mixins/text"; +@use "variables"; + // Tiles .tile { align-content: space-between; @@ -11,15 +14,15 @@ .tile-content { flex: 1 1 auto; &:not(:first-child) { - padding-left: $unit-2; + padding-left: variables.$unit-2; } &:not(:last-child) { - padding-right: $unit-2; + padding-right: variables.$unit-2; } } .tile-title, .tile-subtitle { - line-height: $line-height; + line-height: variables.$line-height; } &.tile-centered { @@ -31,7 +34,7 @@ .tile-title, .tile-subtitle { - @include text-ellipsis(); + @include text.text-ellipsis(); margin-bottom: 0; } } diff --git a/src/_timelines.scss b/src/_timelines.scss index c56746d2c..84dfa8497 100644 --- a/src/_timelines.scss +++ b/src/_timelines.scss @@ -1,16 +1,18 @@ +@use "variables"; + // Timelines .timeline { .timeline-item { display: flex; - margin-bottom: $unit-6; + margin-bottom: variables.$unit-6; position: relative; &::before { - background: $border-color; + background: variables.$border-color; content: ""; height: 100%; left: 11px; position: absolute; - top: $unit-6; + top: variables.$unit-6; width: 2px; } @@ -20,33 +22,33 @@ .timeline-content { flex: 1 1 auto; - padding: 2px 0 2px $layout-spacing-lg; + padding: 2px 0 2px variables.$layout-spacing-lg; } .timeline-icon { align-items: center; border-radius: 50%; - color: $light-color; + color: variables.$light-color; display: flex; - height: $unit-6; + height: variables.$unit-6; justify-content: center; text-align: center; - width: $unit-6; + width: variables.$unit-6; &::before { - border: $border-width-lg solid $primary-color; + border: variables.$border-width-lg solid variables.$primary-color; border-radius: 50%; content: ""; display: block; - height: $unit-2; - left: $unit-2; + height: variables.$unit-2; + left: variables.$unit-2; position: absolute; - top: $unit-2; - width: $unit-2; + top: variables.$unit-2; + width: variables.$unit-2; } &.icon-lg { - background: $primary-color; - line-height: $line-height; + background: variables.$primary-color; + line-height: variables.$line-height; &::before { content: none; } diff --git a/src/_toasts.scss b/src/_toasts.scss index fef15f8db..753c9ca2b 100644 --- a/src/_toasts.scss +++ b/src/_toasts.scss @@ -1,31 +1,34 @@ +@use "mixins/toast"; +@use "variables"; + // Toasts .toast { - @include toast-variant($dark-color); - border: $border-width solid $dark-color; - border-radius: $border-radius; - color: $light-color; + @include toast.toast-variant(variables.$dark-color); + border: variables.$border-width solid variables.$dark-color; + border-radius: variables.$border-radius; + color: variables.$light-color; display: block; - padding: $layout-spacing; + padding: variables.$layout-spacing; width: 100%; &.toast-primary { - @include toast-variant($primary-color); + @include toast.toast-variant(variables.$primary-color); } &.toast-success { - @include toast-variant($success-color); + @include toast.toast-variant(variables.$success-color); } &.toast-warning { - @include toast-variant($warning-color); + @include toast.toast-variant(variables.$warning-color); } &.toast-error { - @include toast-variant($error-color); + @include toast.toast-variant(variables.$error-color); } a { - color: $light-color; + color: variables.$light-color; text-decoration: underline; &:focus, @@ -37,7 +40,7 @@ } .btn-clear { - margin: $unit-h; + margin: variables.$unit-h; } p { diff --git a/src/_tooltips.scss b/src/_tooltips.scss index 8693b67be..ef88845df 100644 --- a/src/_tooltips.scss +++ b/src/_tooltips.scss @@ -1,32 +1,34 @@ +@use "variables"; + // Tooltips .tooltip { position: relative; &::after { - background: rgba($dark-color, .95); - border-radius: $border-radius; + background: rgba(variables.$dark-color, .95); + border-radius: variables.$border-radius; bottom: 100%; - color: $light-color; + color: variables.$light-color; content: attr(data-tooltip); display: block; - font-size: $font-size-sm; + font-size: variables.$font-size-sm; left: 50%; - max-width: $control-width-sm; + max-width: variables.$control-width-sm; opacity: 0; overflow: hidden; - padding: $unit-1 $unit-2; + padding: variables.$unit-1 variables.$unit-2; pointer-events: none; position: absolute; text-overflow: ellipsis; - transform: translate(-50%, $unit-2); + transform: translate(-50%, variables.$unit-2); transition: opacity .2s, transform .2s; white-space: pre; - z-index: $zindex-3; + z-index: variables.$zindex-3; } &:focus, &:hover { &::after { opacity: 1; - transform: translate(-50%, -$unit-1); + transform: translate(-50%, -(variables.$unit-1)); } } &[disabled], @@ -38,12 +40,12 @@ &::after { bottom: 50%; left: 100%; - transform: translate(-$unit-1, 50%); + transform: translate(-(variables.$unit-1), 50%); } &:focus, &:hover { &::after { - transform: translate($unit-1, 50%); + transform: translate(variables.$unit-1, 50%); } } } @@ -52,12 +54,12 @@ &::after { bottom: auto; top: 100%; - transform: translate(-50%, -$unit-2); + transform: translate(-50%, -(variables.$unit-2)); } &:focus, &:hover { &::after { - transform: translate(-50%, $unit-1); + transform: translate(-50%, variables.$unit-1); } } } @@ -67,12 +69,12 @@ bottom: 50%; left: auto; right: 100%; - transform: translate($unit-2, 50%); + transform: translate(variables.$unit-2, 50%); } &:focus, &:hover { &::after { - transform: translate(-$unit-1, 50%); + transform: translate(-(variables.$unit-1), 50%); } } } diff --git a/src/_typography.scss b/src/_typography.scss index bbeb87692..020479f69 100644 --- a/src/_typography.scss +++ b/src/_typography.scss @@ -1,3 +1,7 @@ +@use "sass:color"; +@use "mixins/label"; +@use "variables"; + // Typography // Headings h1, @@ -47,7 +51,7 @@ h6, // Paragraphs p { - margin: 0 0 $line-height; + margin: 0 0 variables.$line-height; } // Semantic text elements @@ -58,29 +62,29 @@ u { } abbr[title] { - border-bottom: $border-width dotted; + border-bottom: variables.$border-width dotted; cursor: help; text-decoration: none; } kbd { - @include label-base(); - @include label-variant($light-color, $dark-color); - font-size: $font-size-sm; + @include label.label-base(); + @include label.label-variant(variables.$light-color, variables.$dark-color); + font-size: variables.$font-size-sm; } mark { - @include label-variant($body-font-color, $highlight-color); - border-bottom: $unit-o solid darken($highlight-color, 15%); - border-radius: $border-radius; - padding: $unit-o $unit-h 0; + @include label.label-variant(variables.$body-font-color, variables.$highlight-color); + border-bottom: variables.$unit-o solid color.adjust(variables.$highlight-color, $lightness: -15%); + border-radius: variables.$border-radius; + padding: variables.$unit-o variables.$unit-h 0; } // Blockquote blockquote { - border-left: $border-width-lg solid $border-color; + border-left: variables.$border-width-lg solid variables.$border-color; margin-left: 0; - padding: $unit-2 $unit-4; + padding: variables.$unit-2 variables.$unit-4; p:last-child { margin-bottom: 0; @@ -90,16 +94,16 @@ blockquote { // Lists ul, ol { - margin: $unit-4 0 $unit-4 $unit-4; + margin: variables.$unit-4 0 variables.$unit-4 variables.$unit-4; padding: 0; ul, ol { - margin: $unit-4 0 $unit-4 $unit-4; + margin: variables.$unit-4 0 variables.$unit-4 variables.$unit-4; } li { - margin-top: $unit-2; + margin-top: variables.$unit-2; } } @@ -124,6 +128,6 @@ dl { font-weight: bold; } dd { - margin: $unit-2 0 $unit-4 0; + margin: variables.$unit-2 0 variables.$unit-4 0; } } diff --git a/src/_utilities.scss b/src/_utilities.scss index 80f1e0b55..23d544b33 100644 --- a/src/_utilities.scss +++ b/src/_utilities.scss @@ -1,8 +1,8 @@ -@import "utilities/colors"; -@import "utilities/cursors"; -@import "utilities/display"; -@import "utilities/divider"; -@import "utilities/loading"; -@import "utilities/position"; -@import "utilities/shapes"; -@import "utilities/text"; +@use "utilities/colors"; +@use "utilities/cursors"; +@use "utilities/display"; +@use "utilities/divider"; +@use "utilities/loading"; +@use "utilities/position"; +@use "utilities/shapes"; +@use "utilities/text"; diff --git a/src/_variables.scss b/src/_variables.scss index 604c0062d..2b4be5be0 100644 --- a/src/_variables.scss +++ b/src/_variables.scss @@ -1,3 +1,4 @@ +@use "sass:color"; // Core variables $version: "0.5.9"; @@ -6,24 +7,24 @@ $rtl: false !default; // Core colors $primary-color: #5755d9 !default; -$primary-color-dark: darken($primary-color, 3%) !default; -$primary-color-light: lighten($primary-color, 3%) !default; -$secondary-color: lighten($primary-color, 37.5%) !default; -$secondary-color-dark: darken($secondary-color, 3%) !default; -$secondary-color-light: lighten($secondary-color, 3%) !default; +$primary-color-dark: color.adjust($primary-color, $lightness: -3%) !default; +$primary-color-light: color.adjust($primary-color, $lightness: 3%) !default; +$secondary-color: color.adjust($primary-color, $lightness: 37.5%) !default; +$secondary-color-dark: color.adjust($secondary-color, $lightness: -3%) !default; +$secondary-color-light: color.adjust($secondary-color, $lightness: 3%) !default; // Gray colors $dark-color: #303742 !default; $light-color: #fff !default; -$gray-color: lighten($dark-color, 55%) !default; -$gray-color-dark: darken($gray-color, 30%) !default; -$gray-color-light: lighten($gray-color, 20%) !default; +$gray-color: color.adjust($dark-color, $lightness: 55%) !default; +$gray-color-dark: color.adjust($gray-color, $lightness: -30%) !default; +$gray-color-light: color.adjust($gray-color, $lightness: 20%) !default; -$border-color: lighten($dark-color, 65%) !default; -$border-color-dark: darken($border-color, 10%) !default; -$border-color-light: lighten($border-color, 8%) !default; -$bg-color: lighten($dark-color, 75%) !default; -$bg-color-dark: darken($bg-color, 3%) !default; +$border-color: color.adjust($dark-color, $lightness: 65%) !default; +$border-color-dark: color.adjust($border-color, $lightness: -10%) !default; +$border-color-light: color.adjust($border-color, $lightness: 8%) !default; +$bg-color: color.adjust($dark-color, $lightness: 75%) !default; +$bg-color-dark: color.adjust($bg-color, $lightness: -3%) !default; $bg-color-light: $light-color !default; // Control colors @@ -35,10 +36,10 @@ $error-color: #e85600 !default; $code-color: #d73e48 !default; $highlight-color: #ffe9b3 !default; $body-bg: $bg-color-light !default; -$body-font-color: lighten($dark-color, 5%) !default; +$body-font-color: color.adjust($dark-color, $lightness: 5%) !default; $link-color: $primary-color !default; -$link-color-dark: darken($link-color, 10%) !default; -$link-color-light: lighten($link-color, 10%) !default; +$link-color-dark: color.adjust($link-color, $lightness: -10%) !default; +$link-color-light: color.adjust($link-color, $lightness: 10%) !default; // Fonts // Credit: https://www.smashingmagazine.com/2015/11/using-system-ui-fonts-practical-guide/ diff --git a/src/_viewer-360.scss b/src/_viewer-360.scss index c1b8928d9..7aba4de07 100644 --- a/src/_viewer-360.scss +++ b/src/_viewer-360.scss @@ -1,10 +1,11 @@ +@use "sass:math"; // 360 Degree Viewer // Mixin: Viewer slider sizes @mixin viewer-slider-size($image-number: 36) { @for $s from 1 through ($image-number) { .viewer-slider[max='#{$image-number}'][value='#{$s}'] + .viewer-image { - background-position-y: percentage((($s)-1) * 1/(($image-number)-1)); + background-position-y: math.percentage((($s)-1) * 1/(($image-number)-1)); } } } diff --git a/src/icons/_icons-action.scss b/src/icons/_icons-action.scss index 1b952ea18..845948e3b 100644 --- a/src/icons/_icons-action.scss +++ b/src/icons/_icons-action.scss @@ -1,9 +1,12 @@ +@use "variables"; +@use "icons-core"; + // Icon resize .icon-resize-horiz, .icon-resize-vert { &::before, &::after { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-bottom: 0; border-right: 0; height: .45em; @@ -50,7 +53,7 @@ .icon-cross { &::before { background: currentColor; - height: $icon-border-width; + height: icons-core.$icon-border-width; width: 100%; } } @@ -60,7 +63,7 @@ &::after { background: currentColor; height: 100%; - width: $icon-border-width; + width: icons-core.$icon-border-width; } } @@ -80,7 +83,7 @@ // Icon check .icon-check { &::before { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-right: 0; border-top: 0; height: .5em; @@ -91,11 +94,11 @@ // Icon stop .icon-stop { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-radius: 50%; &::before { background: currentColor; - height: $icon-border-width; + height: icons-core.$icon-border-width; transform: translate(-50%, -50%) rotate(45deg); width: 1em; } @@ -103,7 +106,7 @@ // Icon shutdown .icon-shutdown { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-radius: 50%; border-top-color: transparent; &::before { @@ -111,14 +114,14 @@ content: ""; height: .5em; top: .1em; - width: $icon-border-width; + width: icons-core.$icon-border-width; } } // Icon refresh .icon-refresh { &::before { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-radius: 50%; border-right-color: transparent; height: 1em; @@ -138,7 +141,7 @@ // Icon search .icon-search { &::before { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-radius: 50%; height: .75em; left: 5%; @@ -148,7 +151,7 @@ } &::after { background: currentColor; - height: $icon-border-width; + height: icons-core.$icon-border-width; left: 80%; top: 80%; transform: translate(-50%, -50%) rotate(45deg); @@ -159,7 +162,7 @@ // Icon edit .icon-edit { &::before { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; height: .4em; transform: translate(-40%, -60%) rotate(-45deg); width: .85em; @@ -179,9 +182,9 @@ // Icon delete .icon-delete { &::before { - border: $icon-border-width solid currentColor; - border-bottom-left-radius: $border-radius; - border-bottom-right-radius: $border-radius; + border: icons-core.$icon-border-width solid currentColor; + border-bottom-left-radius: variables.$border-radius; + border-bottom-right-radius: variables.$border-radius; border-top: 0; height: .75em; top: 60%; @@ -190,20 +193,20 @@ &::after { background: currentColor; box-shadow: -.25em .2em, .25em .2em; - height: $icon-border-width; - top: $icon-border-width/2; + height: icons-core.$icon-border-width; + top: icons-core.$icon-border-width/2; width: .5em; } } // Icon share .icon-share { - border: $icon-border-width solid currentColor; - border-radius: $border-radius; + border: icons-core.$icon-border-width solid currentColor; + border-radius: variables.$border-radius; border-right: 0; border-top: 0; &::before { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-left: 0; border-top: 0; height: .4em; @@ -213,7 +216,7 @@ width: .4em; } &::after { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-bottom: 0; border-right: 0; border-radius: 75% 0; @@ -228,13 +231,13 @@ background: currentColor; height: 1em; left: 15%; - width: $icon-border-width; + width: icons-core.$icon-border-width; } &::after { - border: $icon-border-width solid currentColor; - border-bottom-right-radius: $border-radius; + border: icons-core.$icon-border-width solid currentColor; + border-bottom-right-radius: variables.$border-radius; border-left: 0; - border-top-right-radius: $border-radius; + border-top-right-radius: variables.$border-radius; height: .65em; top: 35%; left: 60%; @@ -245,18 +248,18 @@ // Icon bookmark .icon-bookmark { &::before { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-bottom: 0; - border-top-left-radius: $border-radius; - border-top-right-radius: $border-radius; + border-top-left-radius: variables.$border-radius; + border-top-right-radius: variables.$border-radius; height: .9em; width: .8em; } &::after { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-bottom: 0; border-left: 0; - border-radius: $border-radius; + border-radius: variables.$border-radius; height: .5em; transform: translate(-50%, 35%) rotate(-45deg) skew(15deg, 15deg); width: .5em; @@ -266,9 +269,9 @@ // Icon download & upload .icon-download, .icon-upload { - border-bottom: $icon-border-width solid currentColor; + border-bottom: icons-core.$icon-border-width solid currentColor; &::before { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-bottom: 0; border-right: 0; height: .5em; @@ -279,7 +282,7 @@ background: currentColor; height: .6em; top: 40%; - width: $icon-border-width; + width: icons-core.$icon-border-width; } } @@ -295,8 +298,8 @@ // Icon copy .icon-copy { &::before { - border: $icon-border-width solid currentColor; - border-radius: $border-radius; + border: icons-core.$icon-border-width solid currentColor; + border-radius: variables.$border-radius; border-right: 0; border-bottom: 0; height: .8em; @@ -305,8 +308,8 @@ width: .8em; } &::after { - border: $icon-border-width solid currentColor; - border-radius: $border-radius; + border: icons-core.$icon-border-width solid currentColor; + border-radius: variables.$border-radius; height: .8em; left: 60%; top: 60%; diff --git a/src/icons/_icons-core.scss b/src/icons/_icons-core.scss index 9a67ae4f7..f48bd4fd3 100644 --- a/src/icons/_icons-core.scss +++ b/src/icons/_icons-core.scss @@ -1,5 +1,7 @@ +@use "variables"; + // Icon variables -$icon-border-width: $border-width-lg; +$icon-border-width: variables.$border-width-lg; $icon-prefix: "icon"; // Icon base style diff --git a/src/icons/_icons-navigation.scss b/src/icons/_icons-navigation.scss index 92ab231aa..2d4efc1fd 100644 --- a/src/icons/_icons-navigation.scss +++ b/src/icons/_icons-navigation.scss @@ -1,3 +1,5 @@ +@use "icons-core"; + // Icon arrows .icon-arrow-down, .icon-arrow-left, @@ -8,7 +10,7 @@ .icon-forward, .icon-upward { &::before { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-bottom: 0; border-right: 0; height: .65em; @@ -44,7 +46,7 @@ .icon-forward { &::after { background: currentColor; - height: $icon-border-width; + height: icons-core.$icon-border-width; width: .8em; } } @@ -54,7 +56,7 @@ &::after { background: currentColor; height: .8em; - width: $icon-border-width; + width: icons-core.$icon-border-width; } } @@ -111,7 +113,7 @@ &::before { background: currentColor; box-shadow: 0 -.35em, 0 .35em; - height: $icon-border-width; + height: icons-core.$icon-border-width; width: 100%; } } diff --git a/src/icons/_icons-object.scss b/src/icons/_icons-object.scss index 00597d8a4..4a9156b69 100644 --- a/src/icons/_icons-object.scss +++ b/src/icons/_icons-object.scss @@ -1,32 +1,35 @@ +@use "variables"; +@use "icons-core"; + // Icon time .icon-time { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-radius: 50%; &::before { background: currentColor; height: .4em; transform: translate(-50%, -75%); - width: $icon-border-width; + width: icons-core.$icon-border-width; } &::after { background: currentColor; height: .3em; transform: translate(-50%, -75%) rotate(90deg); transform-origin: 50% 90%; - width: $icon-border-width; + width: icons-core.$icon-border-width; } } // Icon mail .icon-mail { &::before { - border: $icon-border-width solid currentColor; - border-radius: $border-radius; + border: icons-core.$icon-border-width solid currentColor; + border-radius: variables.$border-radius; height: .8em; width: 1em; } &::after { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-right: 0; border-top: 0; height: .5em; @@ -38,14 +41,14 @@ // Icon people .icon-people { &::before { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-radius: 50%; height: .45em; top: 25%; width: .45em; } &::after { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-radius: 50% 50% 0 0; height: .4em; top: 75%; @@ -55,13 +58,13 @@ // Icon message .icon-message { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-bottom: 0; - border-radius: $border-radius; + border-radius: variables.$border-radius; border-right: 0; &::before { - border: $icon-border-width solid currentColor; - border-bottom-right-radius: $border-radius; + border: icons-core.$icon-border-width solid currentColor; + border-bottom-right-radius: variables.$border-radius; border-left: 0; border-top: 0; height: .8em; @@ -71,21 +74,21 @@ } &::after { background: currentColor; - border-radius: $border-radius; + border-radius: variables.$border-radius; height: .3em; left: 10%; top: 100%; transform: translate(0, -90%) rotate(45deg); - width: $icon-border-width; + width: icons-core.$icon-border-width; } } // Icon photo .icon-photo { - border: $icon-border-width solid currentColor; - border-radius: $border-radius; + border: icons-core.$icon-border-width solid currentColor; + border-radius: variables.$border-radius; &::before { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-radius: 50%; height: .25em; left: 35%; @@ -93,7 +96,7 @@ width: .25em; } &::after { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-bottom: 0; border-left: 0; height: .5em; @@ -107,7 +110,7 @@ .icon-link { &::before, &::after { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-radius: 5em 0 0 5em; border-right: 0; height: .5em; @@ -124,14 +127,14 @@ // Icon location .icon-location { &::before { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-radius: 50% 50% 50% 0; height: .8em; transform: translate(-50%, -60%) rotate(-45deg); width: .8em; } &::after { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-radius: 50%; height: .2em; transform: translate(-50%, -80%); @@ -141,7 +144,7 @@ // Icon emoji .icon-emoji { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-radius: 50%; &::before { border-radius: 50%; @@ -150,7 +153,7 @@ width: .15em; } &::after { - border: $icon-border-width solid currentColor; + border: icons-core.$icon-border-width solid currentColor; border-bottom-color: transparent; border-radius: 50%; border-right-color: transparent; diff --git a/src/mixins/_avatar.scss b/src/mixins/_avatar.scss index 14617adb6..cdd544c9f 100644 --- a/src/mixins/_avatar.scss +++ b/src/mixins/_avatar.scss @@ -1,5 +1,7 @@ +@use "variables"; + // Avatar mixin -@mixin avatar-base($size: $unit-8) { +@mixin avatar-base($size: variables.$unit-8) { font-size: $size / 2; height: $size; width: $size; diff --git a/src/mixins/_button.scss b/src/mixins/_button.scss index c90a94bda..b48099b27 100644 --- a/src/mixins/_button.scss +++ b/src/mixins/_button.scss @@ -1,49 +1,53 @@ +@use "sass:color"; +@use "variables"; +@use "shadow"; + // Button variant mixin -@mixin button-variant($color: $primary-color) { +@mixin button-variant($color: variables.$primary-color) { background: $color; - border-color: darken($color, 3%); - color: $light-color; + border-color: color.adjust($color, $lightness: -3%); + color: variables.$light-color; &:focus { - @include control-shadow($color); + @include shadow.control-shadow($color); } &:focus, &:hover { - background: darken($color, 2%); - border-color: darken($color, 5%); - color: $light-color; + background: color.adjust($color, $lightness: -2%); + border-color: color.adjust($color, $lightness: -5%); + color: variables.$light-color; } &:active, &.active { - background: darken($color, 7%); - border-color: darken($color, 10%); - color: $light-color; + background: color.adjust($color, $lightness: -7%); + border-color: color.adjust($color, $lightness: -10%); + color: variables.$light-color; } &.loading { &::after { - border-bottom-color: $light-color; - border-left-color: $light-color; + border-bottom-color: variables.$light-color; + border-left-color: variables.$light-color; } } } -@mixin button-outline-variant($color: $primary-color) { - background: $light-color; +@mixin button-outline-variant($color: variables.$primary-color) { + background: variables.$light-color; border-color: $color; color: $color; &:focus { - @include control-shadow($color); + @include shadow.control-shadow($color); } &:focus, &:hover { - background: lighten($color, 50%); - border-color: darken($color, 2%); + background: color.adjust($color, $lightness: 50%); + border-color: color.adjust($color, $lightness: -2%); color: $color; } &:active, &.active { background: $color; - border-color: darken($color, 5%); - color: $light-color; + border-color: color.adjust($color, $lightness: -5%); + color: variables.$light-color; } &.loading { &::after { diff --git a/src/mixins/_color.scss b/src/mixins/_color.scss index 697d0c37e..bb829ddc5 100644 --- a/src/mixins/_color.scss +++ b/src/mixins/_color.scss @@ -1,16 +1,19 @@ +@use "sass:color"; +@use "variables"; + // Background color utility mixin -@mixin bg-color-variant($name: ".bg-primary", $color: $primary-color) { +@mixin bg-color-variant($name: ".bg-primary", $color: variables.$primary-color) { #{$name} { background: $color !important; - @if (lightness($color) < 60) { - color: $light-color; + @if (color.lightness($color) < 60) { + color: variables.$light-color; } } } // Text color utility mixin -@mixin text-color-variant($name: ".text-primary", $color: $primary-color) { +@mixin text-color-variant($name: ".text-primary", $color: variables.$primary-color) { #{$name} { color: $color !important; } @@ -18,10 +21,10 @@ a#{$name} { &:focus, &:hover { - color: darken($color, 5%); + color: color.adjust($color, $lightness: -5%); } &:visited { - color: lighten($color, 5%); + color: color.adjust($color, $lightness: 5%); } } } diff --git a/src/mixins/_label.scss b/src/mixins/_label.scss index 1574f0269..410887d15 100644 --- a/src/mixins/_label.scss +++ b/src/mixins/_label.scss @@ -1,11 +1,13 @@ +@use "variables"; + // Label base style @mixin label-base() { - border-radius: $border-radius; + border-radius: variables.$border-radius; line-height: 1.25; padding: .1rem .2rem; } -@mixin label-variant($color: $light-color, $bg-color: $primary-color) { +@mixin label-variant($color: variables.$light-color, $bg-color: variables.$primary-color) { background: $bg-color; color: $color; } diff --git a/src/mixins/_position.scss b/src/mixins/_position.scss index 98b5cfc0e..ad8635bae 100644 --- a/src/mixins/_position.scss +++ b/src/mixins/_position.scss @@ -1,5 +1,7 @@ +@use "variables"; + // Margin utility mixin -@mixin margin-variant($id: 1, $size: $unit-1) { +@mixin margin-variant($id: 1, $size: variables.$unit-1) { .m-#{$id} { margin: $size !important; } @@ -32,7 +34,7 @@ } // Padding utility mixin -@mixin padding-variant($id: 1, $size: $unit-1) { +@mixin padding-variant($id: 1, $size: variables.$unit-1) { .p-#{$id} { padding: $size !important; } diff --git a/src/mixins/_shadow.scss b/src/mixins/_shadow.scss index 79844491e..56a020478 100644 --- a/src/mixins/_shadow.scss +++ b/src/mixins/_shadow.scss @@ -1,9 +1,11 @@ +@use "variables"; + // Component focus shadow -@mixin control-shadow($color: $primary-color) { +@mixin control-shadow($color: variables.$primary-color) { box-shadow: 0 0 0 .1rem rgba($color, .2); } // Shadow mixin @mixin shadow-variant($offset) { - box-shadow: 0 $offset ($offset + .05rem) * 2 rgba($dark-color, .3); + box-shadow: 0 $offset ($offset + .05rem) * 2 rgba(variables.$dark-color, .3); } diff --git a/src/mixins/_toast.scss b/src/mixins/_toast.scss index fa2bb13db..72829305a 100644 --- a/src/mixins/_toast.scss +++ b/src/mixins/_toast.scss @@ -1,5 +1,7 @@ +@use "variables"; + // Toast variant mixin -@mixin toast-variant($color: $dark-color) { +@mixin toast-variant($color: variables.$dark-color) { background: rgba($color, .95); border-color: $color; } diff --git a/src/spectre-exp.scss b/src/spectre-exp.scss index 33ed3fe3b..79c13c59f 100644 --- a/src/spectre-exp.scss +++ b/src/spectre-exp.scss @@ -1,18 +1,18 @@ // Variables and mixins -@import "variables"; -@import "mixins"; +@use "variables"; +@use "mixins"; -/*! Spectre.css Experimentals v#{$version} | MIT License | github.com/picturepan2/spectre */ +/*! Spectre.css Experimentals v#{variables.$version} | MIT License | github.com/picturepan2/spectre */ // Experimentals -@import "autocomplete"; -@import "calendars"; -@import "carousels"; -@import "comparison-sliders"; -@import "filters"; -@import "meters"; -@import "off-canvas"; -@import "parallax"; -@import "progress"; -@import "sliders"; -@import "timelines"; -@import "viewer-360"; +@use "autocomplete"; +@use "calendars"; +@use "carousels"; +@use "comparison-sliders"; +@use "filters"; +@use "meters"; +@use "off-canvas"; +@use "parallax"; +@use "progress"; +@use "sliders"; +@use "timelines"; +@use "viewer-360"; diff --git a/src/spectre-icons.scss b/src/spectre-icons.scss index 383624e88..47b6bb92c 100644 --- a/src/spectre-icons.scss +++ b/src/spectre-icons.scss @@ -1,10 +1,10 @@ // Variables and mixins -@import "variables"; -@import "mixins"; +@use "variables"; +@use "mixins"; -/*! Spectre.css Icons v#{$version} | MIT License | github.com/picturepan2/spectre */ +/*! Spectre.css Icons v#{variables.$version} | MIT License | github.com/picturepan2/spectre */ // Icons -@import "icons/icons-core"; -@import "icons/icons-navigation"; -@import "icons/icons-action"; -@import "icons/icons-object"; +@use "icons/icons-core"; +@use "icons/icons-navigation"; +@use "icons/icons-action"; +@use "icons/icons-object"; diff --git a/src/spectre.scss b/src/spectre.scss index cff1fde09..91a105407 100644 --- a/src/spectre.scss +++ b/src/spectre.scss @@ -1,49 +1,49 @@ // Variables and mixins -@import "variables"; -@import "mixins"; +@use "variables"; +@use "mixins"; -/*! Spectre.css v#{$version} | MIT License | github.com/picturepan2/spectre */ +/*! Spectre.css v#{variables.$version} | MIT License | github.com/picturepan2/spectre */ // Reset and dependencies -@import "normalize"; -@import "base"; +@use "normalize"; +@use "base"; // Elements -@import "typography"; -@import "asian"; -@import "tables"; -@import "buttons"; -@import "forms"; -@import "labels"; -@import "codes"; -@import "media"; +@use "typography"; +@use "asian"; +@use "tables"; +@use "buttons"; +@use "forms"; +@use "labels"; +@use "codes"; +@use "media"; // Layout -@import "layout"; -@import "hero"; -@import "navbar"; +@use "layout"; +@use "hero"; +@use "navbar"; // Components -@import "accordions"; -@import "avatars"; -@import "badges"; -@import "breadcrumbs"; -@import "bars"; -@import "cards"; -@import "chips"; -@import "dropdowns"; -@import "empty"; -@import "menus"; -@import "modals"; -@import "navs"; -@import "pagination"; -@import "panels"; -@import "popovers"; -@import "steps"; -@import "tabs"; -@import "tiles"; -@import "toasts"; -@import "tooltips"; +@use "accordions"; +@use "avatars"; +@use "badges"; +@use "breadcrumbs"; +@use "bars"; +@use "cards"; +@use "chips"; +@use "dropdowns"; +@use "empty"; +@use "menus"; +@use "modals"; +@use "navs"; +@use "pagination"; +@use "panels"; +@use "popovers"; +@use "steps"; +@use "tabs"; +@use "tiles"; +@use "toasts"; +@use "tooltips"; // Utility classes -@import "animations"; -@import "utilities"; +@use "animations"; +@use "utilities"; diff --git a/src/utilities/_colors.scss b/src/utilities/_colors.scss index 28dd22181..edd25154d 100644 --- a/src/utilities/_colors.scss +++ b/src/utilities/_colors.scss @@ -1,31 +1,34 @@ +@use "mixins/color"; +@use "variables"; + // Text colors -@include text-color-variant(".text-primary", $primary-color); +@include color.text-color-variant(".text-primary", variables.$primary-color); -@include text-color-variant(".text-secondary", $secondary-color-dark); +@include color.text-color-variant(".text-secondary", variables.$secondary-color-dark); -@include text-color-variant(".text-gray", $gray-color); +@include color.text-color-variant(".text-gray", variables.$gray-color); -@include text-color-variant(".text-light", $light-color); +@include color.text-color-variant(".text-light", variables.$light-color); -@include text-color-variant(".text-dark", $body-font-color); +@include color.text-color-variant(".text-dark", variables.$body-font-color); -@include text-color-variant(".text-success", $success-color); +@include color.text-color-variant(".text-success", variables.$success-color); -@include text-color-variant(".text-warning", $warning-color); +@include color.text-color-variant(".text-warning", variables.$warning-color); -@include text-color-variant(".text-error", $error-color); +@include color.text-color-variant(".text-error", variables.$error-color); // Background colors -@include bg-color-variant(".bg-primary", $primary-color); +@include color.bg-color-variant(".bg-primary", variables.$primary-color); -@include bg-color-variant(".bg-secondary", $secondary-color); +@include color.bg-color-variant(".bg-secondary", variables.$secondary-color); -@include bg-color-variant(".bg-dark", $dark-color); +@include color.bg-color-variant(".bg-dark", variables.$dark-color); -@include bg-color-variant(".bg-gray", $bg-color); +@include color.bg-color-variant(".bg-gray", variables.$bg-color); -@include bg-color-variant(".bg-success", $success-color); +@include color.bg-color-variant(".bg-success", variables.$success-color); -@include bg-color-variant(".bg-warning", $warning-color); +@include color.bg-color-variant(".bg-warning", variables.$warning-color); -@include bg-color-variant(".bg-error", $error-color); +@include color.bg-color-variant(".bg-error", variables.$error-color); diff --git a/src/utilities/_divider.scss b/src/utilities/_divider.scss index e6c09d2f0..3dc88153f 100644 --- a/src/utilities/_divider.scss +++ b/src/utilities/_divider.scss @@ -1,3 +1,5 @@ +@use "variables"; + // Divider .divider, .divider-vert { @@ -5,44 +7,44 @@ position: relative; &[data-content]::after { - background: $bg-color-light; - color: $gray-color; + background: variables.$bg-color-light; + color: variables.$gray-color; content: attr(data-content); display: inline-block; - font-size: $font-size-sm; - padding: 0 $unit-2; - transform: translateY(-$font-size-sm + $border-width); + font-size: variables.$font-size-sm; + padding: 0 variables.$unit-2; + transform: translateY(-(variables.$font-size-sm) + variables.$border-width); } } .divider { - border-top: $border-width solid $border-color-light; - height: $border-width; - margin: $unit-2 0; + border-top: variables.$border-width solid variables.$border-color-light; + height: variables.$border-width; + margin: variables.$unit-2 0; &[data-content] { - margin: $unit-4 0; + margin: variables.$unit-4 0; } } .divider-vert { display: block; - padding: $unit-4; + padding: variables.$unit-4; &::before { - border-left: $border-width solid $border-color; - bottom: $unit-2; + border-left: variables.$border-width solid variables.$border-color; + bottom: variables.$unit-2; content: ""; display: block; left: 50%; position: absolute; - top: $unit-2; + top: variables.$unit-2; transform: translateX(-50%); } &[data-content]::after { left: 50%; - padding: $unit-1 0; + padding: variables.$unit-1 0; position: absolute; top: 50%; transform: translate(-50%, -50%); diff --git a/src/utilities/_loading.scss b/src/utilities/_loading.scss index 2cfdefa25..66e38c876 100644 --- a/src/utilities/_loading.scss +++ b/src/utilities/_loading.scss @@ -1,37 +1,39 @@ +@use "variables"; + // Loading .loading { color: transparent !important; - min-height: $unit-4; + min-height: variables.$unit-4; pointer-events: none; position: relative; &::after { animation: loading 500ms infinite linear; background: transparent; - border: $border-width-lg solid $primary-color; + border: variables.$border-width-lg solid variables.$primary-color; border-radius: 50%; border-right-color: transparent; border-top-color: transparent; content: ""; display: block; - height: $unit-4; + height: variables.$unit-4; left: 50%; - margin-left: -$unit-2; - margin-top: -$unit-2; + margin-left: -(variables.$unit-2); + margin-top: -(variables.$unit-2); opacity: 1; padding: 0; position: absolute; top: 50%; - width: $unit-4; - z-index: $zindex-0; + width: variables.$unit-4; + z-index: variables.$zindex-0; } &.loading-lg { - min-height: $unit-10; + min-height: variables.$unit-10; &::after { - height: $unit-8; - margin-left: -$unit-4; - margin-top: -$unit-4; - width: $unit-8; + height: variables.$unit-8; + margin-left: -(variables.$unit-4); + margin-top: -(variables.$unit-4); + width: variables.$unit-8; } } } diff --git a/src/utilities/_position.scss b/src/utilities/_position.scss index c1a7f756a..27fcebdc5 100644 --- a/src/utilities/_position.scss +++ b/src/utilities/_position.scss @@ -1,6 +1,10 @@ +@use "mixins/clearfix"; +@use "mixins/position"; +@use "variables"; + // Position .clearfix { - @include clearfix(); + @include clearfix.clearfix(); } .float-left { @@ -41,14 +45,14 @@ } // Spacing -@include margin-variant(0, 0); +@include position.margin-variant(0, 0); -@include margin-variant(1, $unit-1); +@include position.margin-variant(1, variables.$unit-1); -@include margin-variant(2, $unit-2); +@include position.margin-variant(2, variables.$unit-2); -@include padding-variant(0, 0); +@include position.padding-variant(0, 0); -@include padding-variant(1, $unit-1); +@include position.padding-variant(1, variables.$unit-1); -@include padding-variant(2, $unit-2); +@include position.padding-variant(2, variables.$unit-2); diff --git a/src/utilities/_shapes.scss b/src/utilities/_shapes.scss index 23e131e94..8a3dd6bbd 100644 --- a/src/utilities/_shapes.scss +++ b/src/utilities/_shapes.scss @@ -1,6 +1,8 @@ +@use "variables"; + // Shapes .s-rounded { - border-radius: $border-radius; + border-radius: variables.$border-radius; } .s-circle { diff --git a/src/utilities/_text.scss b/src/utilities/_text.scss index 57969051a..ab6cdc41d 100644 --- a/src/utilities/_text.scss +++ b/src/utilities/_text.scss @@ -1,3 +1,5 @@ +@use "mixins/text"; + // Text // Text alignment utilities .text-left { @@ -60,7 +62,7 @@ // Text overflow utilities .text-ellipsis { - @include text-ellipsis(); + @include text.text-ellipsis(); } .text-clip { From 1dd11933804696d49e682331f3ef4c62878987fd Mon Sep 17 00:00:00 2001 From: Mlbiche Date: Wed, 24 Feb 2021 18:50:38 +0100 Subject: [PATCH 2/5] Update main mixins stylesheet to forward other mixins stylesheets --- src/_autocomplete.scss | 4 ++-- src/_avatars.scss | 14 +++++++------- src/_base.scss | 4 ++-- src/_buttons.scss | 9 ++++----- src/_calendars.scss | 4 ++-- src/_codes.scss | 6 +++--- src/_forms.scss | 18 +++++++++--------- src/_labels.scss | 18 +++++++++--------- src/_menus.scss | 6 +++--- src/_mixins.scss | 18 +++++++++--------- src/_modals.scss | 4 ++-- src/_parallax.scss | 4 ++-- src/_popovers.scss | 4 ++-- src/_sliders.scss | 4 ++-- src/_tiles.scss | 4 ++-- src/_toasts.scss | 14 +++++++------- src/_typography.scss | 8 ++++---- src/utilities/_colors.scss | 32 ++++++++++++++++---------------- src/utilities/_position.scss | 17 ++++++++--------- src/utilities/_text.scss | 4 ++-- 20 files changed, 97 insertions(+), 99 deletions(-) diff --git a/src/_autocomplete.scss b/src/_autocomplete.scss index 7602f2582..f86def9f7 100644 --- a/src/_autocomplete.scss +++ b/src/_autocomplete.scss @@ -1,5 +1,5 @@ @use "variables"; -@use "mixins/shadow"; +@use "mixins"; // Autocomplete .form-autocomplete { @@ -14,7 +14,7 @@ padding: variables.$unit-h; &.is-focused { - @include shadow.control-shadow(); + @include mixins.control-shadow(); border-color: variables.$primary-color; } diff --git a/src/_avatars.scss b/src/_avatars.scss index afcf7264a..6231ef41f 100644 --- a/src/_avatars.scss +++ b/src/_avatars.scss @@ -1,9 +1,9 @@ -@use "mixins/avatar"; +@use "mixins"; @use "variables"; // Avatars .avatar { - @include avatar.avatar-base(); + @include mixins.avatar-base(); background: variables.$primary-color; border-radius: 50%; color: rgba(variables.$light-color, .85); @@ -15,16 +15,16 @@ vertical-align: middle; &.avatar-xs { - @include avatar.avatar-base(variables.$unit-4); + @include mixins.avatar-base(variables.$unit-4); } &.avatar-sm { - @include avatar.avatar-base(variables.$unit-6); + @include mixins.avatar-base(variables.$unit-6); } &.avatar-lg { - @include avatar.avatar-base(variables.$unit-12); + @include mixins.avatar-base(variables.$unit-12); } &.avatar-xl { - @include avatar.avatar-base(variables.$unit-16); + @include mixins.avatar-base(variables.$unit-16); } img { @@ -77,4 +77,4 @@ transform: translate(-50%, -50%); z-index: variables.$zindex-0; } -} \ No newline at end of file +} diff --git a/src/_base.scss b/src/_base.scss index 08ffc1102..a27af89a4 100644 --- a/src/_base.scss +++ b/src/_base.scss @@ -1,4 +1,4 @@ -@use "mixins/shadow"; +@use "mixins"; @use "variables"; // Base @@ -30,7 +30,7 @@ a { text-decoration: none; &:focus { - @include shadow.control-shadow(); + @include mixins.control-shadow(); } &:focus, diff --git a/src/_buttons.scss b/src/_buttons.scss index a4b0db5b9..0ca6bd96d 100644 --- a/src/_buttons.scss +++ b/src/_buttons.scss @@ -1,6 +1,5 @@ @use "sass:color"; -@use "mixins/button"; -@use "mixins/shadow"; +@use "mixins"; @use "variables"; // Buttons @@ -24,7 +23,7 @@ vertical-align: middle; white-space: nowrap; &:focus { - @include shadow.control-shadow(); + @include mixins.control-shadow(); } &:focus, &:hover { @@ -80,11 +79,11 @@ // Button Colors &.btn-success { - @include button.button-variant(variables.$success-color); + @include mixins.button-variant(variables.$success-color); } &.btn-error { - @include button.button-variant(variables.$error-color); + @include mixins.button-variant(variables.$error-color); } // Button Link diff --git a/src/_calendars.scss b/src/_calendars.scss index 8218770db..4259fc0a3 100644 --- a/src/_calendars.scss +++ b/src/_calendars.scss @@ -1,6 +1,6 @@ @use "sass:color"; @use "variables"; -@use "mixins/shadow"; +@use "mixins"; // Calendars .calendar { @@ -74,7 +74,7 @@ } &:focus { - @include shadow.control-shadow(); + @include mixins.control-shadow(); } &:focus, diff --git a/src/_codes.scss b/src/_codes.scss index 51e7b9483..7f78aa866 100644 --- a/src/_codes.scss +++ b/src/_codes.scss @@ -1,11 +1,11 @@ @use "sass:color"; -@use "mixins/label"; +@use "mixins"; @use "variables"; // Codes code { - @include label.label-base(); - @include label.label-variant(variables.$code-color, color.adjust(variables.$code-color, $lightness: 42.5%)); + @include mixins.label-base(); + @include mixins.label-variant(variables.$code-color, color.adjust(variables.$code-color, $lightness: 42.5%)); font-size: 85%; } diff --git a/src/_forms.scss b/src/_forms.scss index e290e9500..7b7547aa6 100644 --- a/src/_forms.scss +++ b/src/_forms.scss @@ -1,5 +1,5 @@ @use "sass:color"; -@use "mixins/shadow"; +@use "mixins"; @use "variables"; // Forms @@ -55,7 +55,7 @@ legend { transition: background .2s, border .2s, box-shadow .2s, color .2s; width: 100%; &:focus { - @include shadow.control-shadow(); + @include mixins.control-shadow(); border-color: variables.$primary-color; } &::placeholder { @@ -126,9 +126,9 @@ textarea.form-input { padding: variables.$control-padding-y variables.$control-padding-x; vertical-align: middle; width: 100%; - background: variables.$bg-color-light; + background: variables.$bg-color-light; &:focus { - @include shadow.control-shadow(); + @include mixins.control-shadow(); border-color: variables.$primary-color; } &::-ms-expand { @@ -219,7 +219,7 @@ textarea.form-input { position: absolute; width: 1px; &:focus + .form-icon { - @include shadow.control-shadow(); + @include mixins.control-shadow(); border-color: variables.$primary-color; } &:checked + .form-icon { @@ -438,7 +438,7 @@ textarea.form-input { background: color.adjust(variables.$success-color, $lightness: 53%); border-color: variables.$success-color; &:focus { - @include shadow.control-shadow(variables.$success-color); + @include mixins.control-shadow(variables.$success-color); } } @@ -447,7 +447,7 @@ textarea.form-input { background: color.adjust(variables.$error-color, $lightness: 53%); border-color: variables.$error-color; &:focus { - @include shadow.control-shadow(variables.$error-color); + @include mixins.control-shadow(variables.$error-color); } } } @@ -468,7 +468,7 @@ textarea.form-input { } &:focus + .form-icon { - @include shadow.control-shadow(variables.$error-color); + @include mixins.control-shadow(variables.$error-color); border-color: variables.$error-color; } } @@ -493,7 +493,7 @@ textarea.form-input { &:invalid { border-color: variables.$error-color; &:focus { - @include shadow.control-shadow(variables.$error-color); + @include mixins.control-shadow(variables.$error-color); background: color.adjust(variables.$error-color, $lightness: 53%); } diff --git a/src/_labels.scss b/src/_labels.scss index 88aa69609..adcfd7677 100644 --- a/src/_labels.scss +++ b/src/_labels.scss @@ -1,38 +1,38 @@ @use "sass:color"; -@use "mixins/label"; +@use "mixins"; @use "variables"; // Labels .label { - @include label.label-base(); - @include label.label-variant(color.adjust(variables.$body-font-color, $lightness: 5%), variables.$bg-color-dark); + @include mixins.label-base(); + @include mixins.label-variant(color.adjust(variables.$body-font-color, $lightness: 5%), variables.$bg-color-dark); display: inline-block; // Label rounded &.label-rounded { border-radius: 5rem; padding-left: .4rem; - padding-right: .4rem; + padding-right: .4rem; } // Label colors &.label-primary { - @include label.label-variant(variables.$light-color, variables.$primary-color); + @include mixins.label-variant(variables.$light-color, variables.$primary-color); } &.label-secondary { - @include label.label-variant(variables.$primary-color, variables.$secondary-color); + @include mixins.label-variant(variables.$primary-color, variables.$secondary-color); } &.label-success { - @include label.label-variant(variables.$light-color, variables.$success-color); + @include mixins.label-variant(variables.$light-color, variables.$success-color); } &.label-warning { - @include label.label-variant(variables.$light-color, variables.$warning-color); + @include mixins.label-variant(variables.$light-color, variables.$warning-color); } &.label-error { - @include label.label-variant(variables.$light-color, variables.$error-color); + @include mixins.label-variant(variables.$light-color, variables.$error-color); } } diff --git a/src/_menus.scss b/src/_menus.scss index 4c17730b3..d191f4bea 100644 --- a/src/_menus.scss +++ b/src/_menus.scss @@ -1,9 +1,9 @@ -@use "mixins/shadow"; +@use "mixins"; @use "variables"; // Menus .menu { - @include shadow.shadow-variant(.05rem); + @include mixins.shadow-variant(.05rem); background: variables.$bg-color-light; border-radius: variables.$border-radius; list-style: none; @@ -66,4 +66,4 @@ margin-right: variables.$unit-2; } } -} \ No newline at end of file +} diff --git a/src/_mixins.scss b/src/_mixins.scss index 25f413da8..bc097a27f 100644 --- a/src/_mixins.scss +++ b/src/_mixins.scss @@ -1,10 +1,10 @@ // Mixins -@use "mixins/avatar"; -@use "mixins/button"; -@use "mixins/clearfix"; -@use "mixins/color"; -@use "mixins/label"; -@use "mixins/position"; -@use "mixins/shadow"; -@use "mixins/text"; -@use "mixins/toast"; \ No newline at end of file +@forward "mixins/avatar"; +@forward "mixins/button"; +@forward "mixins/clearfix"; +@forward "mixins/color"; +@forward "mixins/label"; +@forward "mixins/position"; +@forward "mixins/shadow"; +@forward "mixins/text"; +@forward "mixins/toast"; diff --git a/src/_modals.scss b/src/_modals.scss index 471a2253f..493062105 100644 --- a/src/_modals.scss +++ b/src/_modals.scss @@ -1,4 +1,4 @@ -@use "mixins/shadow"; +@use "mixins"; @use "variables"; // Modals @@ -58,7 +58,7 @@ } .modal-container { - @include shadow.shadow-variant(.2rem); + @include mixins.shadow-variant(.2rem); background: variables.$bg-color-light; border-radius: variables.$border-radius; display: flex; diff --git a/src/_parallax.scss b/src/_parallax.scss index 54351e405..c378cdf42 100644 --- a/src/_parallax.scss +++ b/src/_parallax.scss @@ -1,5 +1,5 @@ @use "variables"; -@use "mixins/shadow"; +@use "mixins"; // Parallax $parallax-deg: 3deg !default; @@ -25,7 +25,7 @@ $parallax-fade-color: rgba(255, 255, 255, .35) !default; width: auto; .parallax-content { - @include shadow.shadow-variant(1rem); + @include mixins.shadow-variant(1rem); height: auto; transform: perspective($parallax-perspective); transform-style: preserve-3d; diff --git a/src/_popovers.scss b/src/_popovers.scss index 73fe67095..c77c7bde2 100644 --- a/src/_popovers.scss +++ b/src/_popovers.scss @@ -1,4 +1,4 @@ -@use "mixins/shadow"; +@use "mixins"; @use "variables"; // Popovers @@ -62,7 +62,7 @@ } .card { - @include shadow.shadow-variant(.2rem); + @include mixins.shadow-variant(.2rem); border: 0; } } diff --git a/src/_sliders.scss b/src/_sliders.scss index c8274c694..816a6f4cf 100644 --- a/src/_sliders.scss +++ b/src/_sliders.scss @@ -1,5 +1,5 @@ @use "variables"; -@use "mixins/shadow"; +@use "mixins"; // Sliders // Credit: https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/ @@ -11,7 +11,7 @@ height: variables.$unit-6; &:focus { - @include shadow.control-shadow(); + @include mixins.control-shadow(); outline: none; } diff --git a/src/_tiles.scss b/src/_tiles.scss index 98cb072c5..099f26875 100644 --- a/src/_tiles.scss +++ b/src/_tiles.scss @@ -1,4 +1,4 @@ -@use "mixins/text"; +@use "mixins"; @use "variables"; // Tiles @@ -34,7 +34,7 @@ .tile-title, .tile-subtitle { - @include text.text-ellipsis(); + @include mixins.text-ellipsis(); margin-bottom: 0; } } diff --git a/src/_toasts.scss b/src/_toasts.scss index 753c9ca2b..5aedf9982 100644 --- a/src/_toasts.scss +++ b/src/_toasts.scss @@ -1,9 +1,9 @@ -@use "mixins/toast"; +@use "mixins"; @use "variables"; // Toasts .toast { - @include toast.toast-variant(variables.$dark-color); + @include mixins.toast-variant(variables.$dark-color); border: variables.$border-width solid variables.$dark-color; border-radius: variables.$border-radius; color: variables.$light-color; @@ -12,25 +12,25 @@ width: 100%; &.toast-primary { - @include toast.toast-variant(variables.$primary-color); + @include mixins.toast-variant(variables.$primary-color); } &.toast-success { - @include toast.toast-variant(variables.$success-color); + @include mixins.toast-variant(variables.$success-color); } &.toast-warning { - @include toast.toast-variant(variables.$warning-color); + @include mixins.toast-variant(variables.$warning-color); } &.toast-error { - @include toast.toast-variant(variables.$error-color); + @include mixins.toast-variant(variables.$error-color); } a { color: variables.$light-color; text-decoration: underline; - + &:focus, &:hover, &:active, diff --git a/src/_typography.scss b/src/_typography.scss index 020479f69..68b85449f 100644 --- a/src/_typography.scss +++ b/src/_typography.scss @@ -1,5 +1,5 @@ @use "sass:color"; -@use "mixins/label"; +@use "mixins"; @use "variables"; // Typography @@ -68,13 +68,13 @@ abbr[title] { } kbd { - @include label.label-base(); - @include label.label-variant(variables.$light-color, variables.$dark-color); + @include mixins.label-base(); + @include mixins.label-variant(variables.$light-color, variables.$dark-color); font-size: variables.$font-size-sm; } mark { - @include label.label-variant(variables.$body-font-color, variables.$highlight-color); + @include mixins.label-variant(variables.$body-font-color, variables.$highlight-color); border-bottom: variables.$unit-o solid color.adjust(variables.$highlight-color, $lightness: -15%); border-radius: variables.$border-radius; padding: variables.$unit-o variables.$unit-h 0; diff --git a/src/utilities/_colors.scss b/src/utilities/_colors.scss index edd25154d..56e3f9335 100644 --- a/src/utilities/_colors.scss +++ b/src/utilities/_colors.scss @@ -1,34 +1,34 @@ -@use "mixins/color"; +@use "mixins"; @use "variables"; // Text colors -@include color.text-color-variant(".text-primary", variables.$primary-color); +@include mixins.text-color-variant(".text-primary", variables.$primary-color); -@include color.text-color-variant(".text-secondary", variables.$secondary-color-dark); +@include mixins.text-color-variant(".text-secondary", variables.$secondary-color-dark); -@include color.text-color-variant(".text-gray", variables.$gray-color); +@include mixins.text-color-variant(".text-gray", variables.$gray-color); -@include color.text-color-variant(".text-light", variables.$light-color); +@include mixins.text-color-variant(".text-light", variables.$light-color); -@include color.text-color-variant(".text-dark", variables.$body-font-color); +@include mixins.text-color-variant(".text-dark", variables.$body-font-color); -@include color.text-color-variant(".text-success", variables.$success-color); +@include mixins.text-color-variant(".text-success", variables.$success-color); -@include color.text-color-variant(".text-warning", variables.$warning-color); +@include mixins.text-color-variant(".text-warning", variables.$warning-color); -@include color.text-color-variant(".text-error", variables.$error-color); +@include mixins.text-color-variant(".text-error", variables.$error-color); // Background colors -@include color.bg-color-variant(".bg-primary", variables.$primary-color); +@include mixins.bg-color-variant(".bg-primary", variables.$primary-color); -@include color.bg-color-variant(".bg-secondary", variables.$secondary-color); +@include mixins.bg-color-variant(".bg-secondary", variables.$secondary-color); -@include color.bg-color-variant(".bg-dark", variables.$dark-color); +@include mixins.bg-color-variant(".bg-dark", variables.$dark-color); -@include color.bg-color-variant(".bg-gray", variables.$bg-color); +@include mixins.bg-color-variant(".bg-gray", variables.$bg-color); -@include color.bg-color-variant(".bg-success", variables.$success-color); +@include mixins.bg-color-variant(".bg-success", variables.$success-color); -@include color.bg-color-variant(".bg-warning", variables.$warning-color); +@include mixins.bg-color-variant(".bg-warning", variables.$warning-color); -@include color.bg-color-variant(".bg-error", variables.$error-color); +@include mixins.bg-color-variant(".bg-error", variables.$error-color); diff --git a/src/utilities/_position.scss b/src/utilities/_position.scss index 27fcebdc5..1c8ab77b2 100644 --- a/src/utilities/_position.scss +++ b/src/utilities/_position.scss @@ -1,10 +1,9 @@ -@use "mixins/clearfix"; -@use "mixins/position"; +@use "mixins"; @use "variables"; // Position .clearfix { - @include clearfix.clearfix(); + @include mixins.clearfix(); } .float-left { @@ -45,14 +44,14 @@ } // Spacing -@include position.margin-variant(0, 0); +@include mixins.margin-variant(0, 0); -@include position.margin-variant(1, variables.$unit-1); +@include mixins.margin-variant(1, variables.$unit-1); -@include position.margin-variant(2, variables.$unit-2); +@include mixins.margin-variant(2, variables.$unit-2); -@include position.padding-variant(0, 0); +@include mixins.padding-variant(0, 0); -@include position.padding-variant(1, variables.$unit-1); +@include mixins.padding-variant(1, variables.$unit-1); -@include position.padding-variant(2, variables.$unit-2); +@include mixins.padding-variant(2, variables.$unit-2); diff --git a/src/utilities/_text.scss b/src/utilities/_text.scss index ab6cdc41d..474195c1f 100644 --- a/src/utilities/_text.scss +++ b/src/utilities/_text.scss @@ -1,4 +1,4 @@ -@use "mixins/text"; +@use "mixins"; // Text // Text alignment utilities @@ -62,7 +62,7 @@ // Text overflow utilities .text-ellipsis { - @include text.text-ellipsis(); + @include mixins.text-ellipsis(); } .text-clip { From 99a1963ff38751ce060e8e57f6724d989b27ace9 Mon Sep 17 00:00:00 2001 From: Mlbiche Date: Wed, 24 Feb 2021 18:54:07 +0100 Subject: [PATCH 3/5] Update documentation and documentation stylesheets --- docs/dist/docs.css | 773 ++---- docs/dist/docs.min.css | 2 +- docs/dist/spectre-exp.css | 837 ++----- docs/dist/spectre-exp.min.css | 2 +- docs/dist/spectre-icons.css | 355 +-- docs/dist/spectre-icons.min.css | 2 +- docs/dist/spectre-rtl.css | 3614 ++++++++------------------- docs/dist/spectre-rtl.min.css | 2 +- docs/dist/spectre.css | 2772 ++++++-------------- docs/dist/spectre.min.css | 2 +- docs/getting-started/custom.html | 8 +- docs/src/getting-started/custom.pug | 8 +- docs/src/scss/docs.scss | 6 +- docs/src/scss/spectre-rtl.scss | 4 +- gulpfile.js | 7 +- 15 files changed, 2321 insertions(+), 6073 deletions(-) diff --git a/docs/dist/docs.css b/docs/dist/docs.css index 1ed0dadf7..0ba77cee4 100644 --- a/docs/dist/docs.css +++ b/docs/dist/docs.css @@ -1,127 +1,87 @@ -/*! Spectre.css Docs | MIT License | github.com/picturepan2/spectre */ -.version::after { +/*! Spectre.css Docs | MIT License | github.com/picturepan2/spectre */.version::after { content: "0.5.9"; -} - -.off-canvas .off-canvas-toggle { +}.off-canvas .off-canvas-toggle { font-size: 1rem; left: 1.5rem; position: fixed; top: 1rem; -} - -.off-canvas .off-canvas-sidebar { +}.off-canvas .off-canvas-sidebar { width: 12rem; -} - -.off-canvas .off-canvas-content { +}.off-canvas .off-canvas-content { padding: 0; -} - -.docs-container { +}.docs-container { min-height: 100vh; -} - -.docs-navbar { +}.docs-navbar { height: 3.8rem; position: fixed; right: 0; top: 0; z-index: 100; -} - -.docs-navbar .btns { +}.docs-navbar .btns { position: absolute; right: 1.5rem; top: 1rem; width: 14rem; -} - -.docs-navbar .algolia-autocomplete { +}.docs-navbar .algolia-autocomplete { -ms-flex: 1 1 auto; flex: 1 1 auto; -} - -.docs-sidebar .docs-nav { +}.docs-sidebar .docs-nav { bottom: 1.5rem; - -webkit-overflow-scrolling: touch; + -webkit-overflow-scrolling: touch; overflow-y: auto; padding: .5rem 1.5rem; position: fixed; top: 3.5rem; width: 12rem; -} - -.docs-sidebar .accordion { +}.docs-sidebar .accordion { margin-bottom: .75rem; -} - -.docs-sidebar .accordion input ~ .accordion-header { +}.docs-sidebar .accordion input ~ .accordion-header { color: #455060; font-size: .65rem; font-weight: 600; text-transform: uppercase; -} - -.docs-sidebar .accordion input:checked ~ .accordion-header { +}.docs-sidebar .accordion input:checked ~ .accordion-header { color: #505c6e; -} - -.docs-sidebar .accordion .menu .menu-item { +}.docs-sidebar .accordion .menu .menu-item { font-size: .7rem; padding-left: 1rem; -} - -.docs-sidebar .accordion .menu .menu-item > a { +}.docs-sidebar .accordion .menu .menu-item > a { background: transparent; color: #66758c; display: inline-block; -} - -.docs-content { +}.docs-content { -ms-flex: 1 1 auto; flex: 1 1 auto; padding: 0 4rem; width: calc(100vw - 12rem); -} - -.docs-content > .container { +}.docs-content > .container { margin-left: 0; max-width: 800px; padding-bottom: 1.5rem; -} - -.docs-content .anchor { +}.docs-content .anchor { color: #6362dc; display: none; margin-left: .2rem; padding: 0 .2rem; -} - -.docs-content .anchor:focus, +}.docs-content .anchor:focus, .docs-content .anchor:hover { display: inline; text-decoration: none; -} - -.docs-content .s-title, +}.docs-content .s-title, .docs-content .s-subtitle { line-height: 1.8rem; margin-bottom: 0; padding-bottom: 1rem; padding-top: 1rem; position: static; -} - -@supports ((position: -webkit-sticky) or (position: sticky)) { +}@supports((position: -webkit-sticky) or (position: sticky)) { .docs-content .s-title, .docs-content .s-subtitle { position: -webkit-sticky; position: sticky; top: 0; z-index: 99; - } - .docs-content .s-title::before, + }.docs-content .s-title::before, .docs-content .s-subtitle::before { background: #fff; bottom: 0; @@ -133,125 +93,78 @@ top: -5px; z-index: -1; } -} - -.docs-content .s-title:hover .anchor, +}.docs-content .s-title:hover .anchor, .docs-content .s-subtitle:hover .anchor { display: inline; -} - -.docs-content .s-title + .docs-note, +}.docs-content .s-title + .docs-note, .docs-content .s-subtitle + .docs-note { margin-top: .4rem; -} - -.docs-content .docs-demo { +}.docs-content .docs-demo { padding-bottom: 1rem; padding-top: 1rem; -} - -.docs-content .docs-demo .card { +}.docs-content .docs-demo .card { border: 0; - box-shadow: 0 .25rem 1rem rgba(48, 55, 66, .15); + box-shadow: 0 .25rem 1rem rgba(48,55,66,.15); height: 100%; -} - -.docs-content .column { +}.docs-content .column { padding: .4rem; -} - -.docs-content .docs-block { +}.docs-content .docs-block { border-radius: .1rem; padding: .4rem; -} - -.docs-content .docs-block.bg-gray { +}.docs-content .docs-block.bg-gray { background: #eef0f3; -} - -.docs-content .docs-shape { +}.docs-content .docs-shape { height: 4.8rem; line-height: 1.2rem; padding: 1.8rem 0; width: 4.8rem; -} - -.docs-content .docs-dot { +}.docs-content .docs-dot { border-radius: 50%; display: inline-block; height: .5rem; padding: 0; width: .5rem; -} - -.docs-content .docs-table th, +}.docs-content .docs-table th, .docs-content .docs-table td { padding: .75rem .25rem; -} - -.docs-content .docs-color { +}.docs-content .docs-color { border-radius: .1rem; margin: .25rem 0; padding: 5rem .5rem .5rem; -} - -.docs-content .docs-color .color-subtitle { +}.docs-content .docs-color .color-subtitle { font-size: .7rem; opacity: .75; -} - -.docs-content .code .hljs-tag { +}.docs-content .code .hljs-tag { color: #505c6e; -} - -.docs-content .code .hljs-comment { +}.docs-content .code .hljs-comment { color: #bcc3ce; -} - -.docs-content .code .hljs-title, +}.docs-content .code .hljs-title, .docs-content .code .hljs-class, .docs-content .code .hljs-string, .docs-content .code .hljs-number { color: #5755d9; -} - -.docs-content .code .hljs-name, +}.docs-content .code .hljs-name, .docs-content .code .hljs-attribute, .docs-content .code .hljs-variable, .docs-content .code .hljs-keyword, .docs-content .code .hljs-built_in { color: #d73e48; -} - -.docs-content .code .hljs-value, +}.docs-content .code .hljs-value, .docs-content .code .hljs-hexcolor { color: #505c6e; -} - -.docs-content .c-select-all { +}.docs-content .c-select-all { -webkit-user-select: all; - -moz-user-select: all; -ms-user-select: all; user-select: all; -} - -.docs-content .panel { +}.docs-content .panel { height: 75vh; -} - -.docs-content .panel .tile { +}.docs-content .panel .tile { margin: .75rem 0; -} - -.docs-content .parallax { +}.docs-content .parallax { margin: 2rem auto; -} - -.docs-content .form-autocomplete .menu { +}.docs-content .form-autocomplete .menu { position: static; -} - -.docs-content .example-tile-icon { +}.docs-content .example-tile-icon { align-content: space-around; align-items: center; background: #5755d9; @@ -264,41 +177,27 @@ font-size: 1.2rem; height: 2rem; width: 2rem; -} - -.docs-content .example-tile-icon .icon { +}.docs-content .example-tile-icon .icon { margin: auto; -} - -.docs-content .comparison-slider { +}.docs-content .comparison-slider { height: auto; padding-bottom: 56.2222%; -} - -.docs-content .comparison-slider .filter-grayscale { +}.docs-content .comparison-slider .filter-grayscale { filter: grayscale(75%); -} - -.docs-content .off-canvas { +}.docs-content .off-canvas { position: relative; -} - -.docs-content .off-canvas .off-canvas-toggle { +}.docs-content .off-canvas .off-canvas-toggle { left: .4rem; position: absolute; top: .4rem; z-index: 1; -} - -.docs-brand { +}.docs-brand { color: #5755d9; height: 2rem; left: 1.5rem; position: fixed; top: .85rem; -} - -.docs-brand .docs-logo { +}.docs-brand .docs-logo { align-items: center; border-radius: .1rem; display: -ms-inline-flexbox; @@ -308,20 +207,14 @@ height: 2rem; padding: .2rem; width: auto; -} - -.docs-brand .docs-logo:focus, +}.docs-brand .docs-logo:focus, .docs-brand .docs-logo:hover { text-decoration: none; -} - -.docs-brand .docs-logo img { +}.docs-brand .docs-logo img { display: inline-block; height: auto; width: 1.6rem; -} - -.docs-brand .docs-logo h2 { +}.docs-brand .docs-logo h2 { display: inline-block; font-size: .8rem; font-weight: 700; @@ -329,224 +222,149 @@ margin-bottom: 0; margin-left: .5rem; margin-right: .3rem; -} - -.docs-footer { +}.docs-footer { color: #bcc3ce; padding: .5rem; -} - -.docs-footer a { +}.docs-footer a { color: #66758c; -} - -.docs-ad { +}.docs-ad { background: #f7f8f9; border-radius: .1rem; display: block; margin: 2rem 0; padding: .4rem; position: relative; -} - -.docs-ad ins { +}.docs-ad ins { line-height: 1; vertical-align: middle; -} - -.docs-ad .carbon-wrap .carbon-img { +}.docs-ad .carbon-wrap .carbon-img { display: block; -} - -.docs-ad .carbon-wrap .carbon-text { +}.docs-ad .carbon-wrap .carbon-text { color: #66758c; display: block; font-size: .7rem; -} - -.docs-ad .carbon-poweredby { +}.docs-ad .carbon-poweredby { color: #bcc3ce; font-size: .7rem; -} - -/* Spectre Homepage style */ -.section-hero { +}.section-hero { padding: 1rem .5rem; -} - -.section-hero .docs-brand { +}.section-hero .docs-brand { position: absolute; top: .85rem; -} - -.section-hero .docs-brand h2 { +}.section-hero .docs-brand h2 { color: #5755d9; -} - -.section-hero .column { +}.section-hero .column { padding: .4rem; -} - -.section-ads { +}.section-ads { padding: 1rem .5rem; -} - -.section-updates { +}.section-updates { padding: 4.5rem .5rem 2.5rem .5rem; -} - -.section-updates .card { +}.section-updates .card { border: 0; margin-bottom: 1rem; -} - -.section-features { +}.section-features { padding: 4.5rem .5rem; -} - -.section-features .column { +}.section-features .column { padding: .4rem; -} - -.section-footer { +}.section-footer { color: #bcc3ce; padding: 1.8rem .75rem 1rem; position: relative; z-index: 200; -} - -.section-footer a { +}.section-footer a { color: #66758c; -} - -.grid-hero { +}.grid-hero { padding-bottom: 2rem; padding-top: 6rem; -} - -.grid-hero h1 { +}.grid-hero h1 { color: #3b4351; font-size: 1.6rem; font-weight: 600; margin-bottom: 1.5rem; -} - -.grid-hero h2 { +}.grid-hero h2 { color: #455060; font-size: .9rem; font-weight: 400; line-height: 1.5rem; margin-bottom: 1.5rem; -} - -.grid-hero h2 u { +}.grid-hero h2 u { border-bottom: .1rem solid currentColor; padding-bottom: .05rem; text-decoration: none; -} - -.grid-hero .card { +}.grid-hero .card { background: none; border: 0; color: #5b687d; padding: .5rem; -} - -.grid-hero .card .card-title { +}.grid-hero .card .card-title { color: #5755d9; font-size: 1rem; font-weight: 700; margin-bottom: 0; -} - -@media (max-width: 960px) { +}@media(max-width: 960px) { .off-canvas .off-canvas-toggle { z-index: 300; - } - .off-canvas .off-canvas-content { + }.off-canvas .off-canvas-content { width: 100%; - } - .docs-sidebar .docs-brand { + }.docs-sidebar .docs-brand { margin: .85rem 1.5rem; padding: 0; position: static; - } - .docs-sidebar .docs-nav { + }.docs-sidebar .docs-nav { margin-top: 1rem; position: static; - } - .docs-sidebar .menu .menu-item > a { + }.docs-sidebar .menu .menu-item > a { padding: .3rem .4rem; - } - .docs-navbar { + }.docs-navbar { -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); - background: rgba(247, 248, 249, .65); + background: rgba(247,248,249,.65); left: 0; - } - .docs-content { + }.docs-content { min-width: auto; padding: 0 1.5rem; width: 100%; - } - .docs-content .s-title, + }.docs-content .s-title, .docs-content .s-subtitle { padding-top: 5rem; position: static; - } - .docs-content .s-title::before, + }.docs-content .s-title::before, .docs-content .s-subtitle::before { content: none; - } - .section-hero .s-brand { + }.section-hero .s-brand { height: 5rem; padding: 1.5rem .5rem; text-align: center; width: 100%; - } - .section-hero .s-brand .s-logo { + }.section-hero .s-brand .s-logo { height: auto; - } - .section-hero .s-brand img { + }.section-hero .s-brand img { height: 3.2rem; width: 3.2rem; - } - .section-hero .s-brand h2 { + }.section-hero .s-brand h2 { display: none; } -} - -@media (max-width: 600px) { +}@media(max-width: 600px) { .grid-hero h2 { font-size: .9rem; - } - .grid-hero .card { + }.grid-hero .card { padding: 0; - } - .off-canvas .off-canvas-toggle { + }.off-canvas .off-canvas-toggle { left: .5rem; - } - .docs-navbar .btns { + }.docs-navbar .btns { right: .9rem; - } - .grid-hero .docs-brand { + }.grid-hero .docs-brand { left: .9rem; - } - .docs-sidebar .docs-brand { + }.docs-sidebar .docs-brand { margin: .85rem 1rem; - } - .docs-sidebar .docs-nav { + }.docs-sidebar .docs-nav { padding: .5rem 1rem; - } - .docs-content { + }.docs-content { padding: 0 .5rem; - } - .docs-content .docs-block { + }.docs-content .docs-block { padding: .4rem .1rem; } -} - -@media (min-width: 1366px) { +}@media(min-width: 1366px) { .docs-ad.docs-ad-sidebar { bottom: 1rem; margin: 0; @@ -554,35 +372,27 @@ right: 1rem; width: 7.3rem; } -} - -.searchbox { +}.searchbox { box-sizing: border-box; display: inline-block; height: 32px !important; position: relative; - visibility: visible !important; + visibility: visible !important; white-space: nowrap; width: 200px; -} - -.searchbox .algolia-autocomplete { +}.searchbox .algolia-autocomplete { display: block; - height: 100%; + height: 100%; width: 100%; -} - -.searchbox__wrapper { +}.searchbox__wrapper { height: 100%; - position: relative; + position: relative; width: 100%; z-index: 999; -} - -.searchbox__input { +}.searchbox__input { -webkit-appearance: none; -moz-appearance: none; - appearance: none; + appearance: none; background: #fff !important; border: 0; border-radius: 16px; @@ -592,49 +402,35 @@ font-size: 12px; height: 100%; padding: 0 26px 0 32px; - transition: box-shadow .4s ease, background .4s ease; + transition: box-shadow .4s ease,background .4s ease; vertical-align: middle; white-space: normal; width: 100%; -} - -.searchbox__input::-webkit-search-cancel-button, +}.searchbox__input::-webkit-search-cancel-button, .searchbox__input::-webkit-search-decoration, .searchbox__input::-webkit-search-results-button, .searchbox__input::-webkit-search-results-decoration { display: none; -} - -.searchbox__input:hover { +}.searchbox__input:hover { box-shadow: inset 0 0 0 1px #b3b3b3; -} - -.searchbox__input:active, +}.searchbox__input:active, .searchbox__input:focus { - background: #fff; + background: #fff; box-shadow: inset 0 0 0 1px #aaa; outline: 0; -} - -.searchbox__input:-ms-input-placeholder { +}.searchbox__input:-ms-input-placeholder { color: #aaa; -} - -.searchbox__input::-ms-input-placeholder { +}.searchbox__input::-ms-input-placeholder { color: #aaa; -} - -.searchbox__input::placeholder { +}.searchbox__input::placeholder { color: #aaa; -} - -.searchbox__submit { - background-color: rgba(69, 142, 225, 0); +}.searchbox__submit { + background-color: rgba(69,142,225,0); border: 0; border-radius: 16px 0 0 16px; font-size: inherit; height: 100%; - left: 0; + left: 0; margin: 0; padding: 0; position: absolute; @@ -642,43 +438,32 @@ text-align: center; top: 0; -webkit-user-select: none; - -moz-user-select: none; -ms-user-select: none; user-select: none; vertical-align: middle; width: 32px; -} - -.searchbox__submit:before { - content: ""; +}.searchbox__submit:before { + content: ""; display: inline-block; height: 100%; margin-right: -4px; vertical-align: middle; -} - -.searchbox__submit:active, +}.searchbox__submit:active, .searchbox__submit:hover { cursor: pointer; -} - -.searchbox__submit:focus { +}.searchbox__submit:focus { outline: 0; -} - -.searchbox__submit svg { - fill: #6d7e96; +}.searchbox__submit svg { + fill: #6d7e96; height: 14px; vertical-align: middle; width: 14px; -} - -.searchbox__reset { +}.searchbox__reset { background: none; border: 0; cursor: pointer; display: block; - fill: rgba(0, 0, 0, .5); + fill: rgba(0,0,0,.5); font-size: inherit; margin: 0; padding: 0; @@ -686,66 +471,44 @@ right: 8px; top: 8px; -webkit-user-select: none; - -moz-user-select: none; -ms-user-select: none; user-select: none; -} - -.searchbox__reset.hide { +}.searchbox__reset.hide { display: none; -} - -.searchbox__reset:focus { +}.searchbox__reset:focus { outline: 0; -} - -.searchbox__reset svg { +}.searchbox__reset svg { display: block; - height: 8px; + height: 8px; margin: 4px; width: 8px; -} - -.searchbox__input:valid ~ .searchbox__reset { - animation-duration: .15s; +}.searchbox__input:valid ~ .searchbox__reset { + animation-duration: .15s; animation-name: sbx-reset-in; display: block; -} - -@keyframes sbx-reset-in { +}@keyframes sbx-reset-in { 0% { - opacity: 0; + opacity: 0; transform: translate3d(-20%, 0, 0); - } - to { - opacity: 1; + }to { + opacity: 1; transform: none; } -} - -.algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu { - left: inherit !important; +}.algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu { + left: inherit !important; right: 0 !important; -} - -.algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu:before { +}.algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu:before { right: 48px; -} - -.algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu { +}.algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu { left: 0 !important; right: inherit !important; -} - -.algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu:before { +}.algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu:before { left: 48px; -} - -.algolia-autocomplete .ds-dropdown-menu { +}.algolia-autocomplete .ds-dropdown-menu { background: transparent; border: none; border-radius: 4px; - box-shadow: 0 .05rem .2rem rgba(48, 55, 66, .3); + box-shadow: 0 .05rem .2rem rgba(48,55,66,.3); height: auto; margin: 6px 0 0; max-width: 600px; @@ -755,106 +518,76 @@ text-align: left; top: -6px; z-index: 999; -} - -.algolia-autocomplete .ds-dropdown-menu .ds-suggestions { - margin-top: 8px; +}.algolia-autocomplete .ds-dropdown-menu .ds-suggestions { + margin-top: 8px; position: relative; z-index: 1000; -} - -.algolia-autocomplete .ds-dropdown-menu .ds-suggestions a:hover { +}.algolia-autocomplete .ds-dropdown-menu .ds-suggestions a:hover { text-decoration: none; -} - -.algolia-autocomplete .ds-dropdown-menu .ds-suggestion { +}.algolia-autocomplete .ds-dropdown-menu .ds-suggestion { cursor: pointer; -} - -.algolia-autocomplete .ds-dropdown-menu .ds-suggestion.ds-cursor .algolia-docsearch-suggestion.suggestion-layout-simple, +}.algolia-autocomplete .ds-dropdown-menu .ds-suggestion.ds-cursor .algolia-docsearch-suggestion.suggestion-layout-simple, .algolia-autocomplete .ds-dropdown-menu .ds-suggestion.ds-cursor .algolia-docsearch-suggestion:not(.suggestion-layout-simple) .algolia-docsearch-suggestion--content { - background-color: rgba(87, 85, 217, .05); -} - -.algolia-autocomplete .ds-dropdown-menu [class^=ds-dataset-] { + background-color: rgba(87,85,217,.05); +}.algolia-autocomplete .ds-dropdown-menu [class^=ds-dataset-] { background: #fff; border-radius: 4px; overflow: auto; - padding: 0 8px 8px; + padding: 0 8px 8px; position: relative; -} - -.algolia-autocomplete .ds-dropdown-menu * { +}.algolia-autocomplete .ds-dropdown-menu * { box-sizing: border-box; -} - -.algolia-autocomplete .algolia-docsearch-suggestion { +}.algolia-autocomplete .algolia-docsearch-suggestion { background: #fff; color: #303742; display: block; - overflow: hidden; + overflow: hidden; padding: 0 8px; position: relative; -} - -.algolia-autocomplete .algolia-docsearch-suggestion--highlight { - background: rgba(87, 85, 217, .1); +}.algolia-autocomplete .algolia-docsearch-suggestion--highlight { + background: rgba(87,85,217,.1); color: #5755d9; padding: .1em .05em; -} - -.algolia-autocomplete .algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--category-header-lvl0 .algolia-docsearch-suggestion--highlight, +}.algolia-autocomplete .algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--category-header-lvl0 .algolia-docsearch-suggestion--highlight, .algolia-autocomplete .algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--category-header-lvl1 .algolia-docsearch-suggestion--highlight { background: inherit; - box-shadow: inset 0 -2px 0 0 rgba(87, 85, 217, .8); - color: inherit; + box-shadow: inset 0 -2px 0 0 rgba(87,85,217,.8); + color: inherit; padding: 0 0 1px; -} - -.algolia-autocomplete .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight { +}.algolia-autocomplete .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight { background: inherit; - box-shadow: inset 0 -2px 0 0 rgba(87, 85, 217, .8); - color: inherit; + box-shadow: inset 0 -2px 0 0 rgba(87,85,217,.8); + color: inherit; padding: 0 0 1px; -} - -.algolia-autocomplete .algolia-docsearch-suggestion--content { - cursor: pointer; +}.algolia-autocomplete .algolia-docsearch-suggestion--content { + cursor: pointer; display: block; float: right; padding: 5.33333px 0 5.33333px 10.66667px; position: relative; width: 70%; -} - -.algolia-autocomplete .algolia-docsearch-suggestion--content:before { +}.algolia-autocomplete .algolia-docsearch-suggestion--content:before { background: #f7f8f9; content: ""; display: block; height: 100%; - left: -1px; + left: -1px; position: absolute; top: 0; width: 1px; -} - -.algolia-autocomplete .algolia-docsearch-suggestion--category-header { +}.algolia-autocomplete .algolia-docsearch-suggestion--category-header { border-bottom: 1px solid #f7f8f9; - color: #303742; + color: #303742; display: none; font-size: 1em; margin-top: 8px; padding: 4px 0; position: relative; -} - -.algolia-autocomplete .algolia-docsearch-suggestion--wrapper { +}.algolia-autocomplete .algolia-docsearch-suggestion--wrapper { float: left; - padding: 8px 0 0; + padding: 8px 0 0; width: 100%; -} - -.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column { +}.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column { color: #bcc3ce; float: left; font-size: .9em; @@ -863,204 +596,148 @@ text-align: right; width: 30%; word-wrap: break-word; -} - -.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column:before { +}.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column:before { background: #f7f8f9; content: ""; display: block; height: 100%; position: absolute; - right: 0; + right: 0; top: 0; width: 1px; -} - -.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-inline { +}.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-inline { display: none; -} - -.algolia-autocomplete .algolia-docsearch-suggestion--title { +}.algolia-autocomplete .algolia-docsearch-suggestion--title { color: #303742; font-size: .9em; font-weight: 700; -} - -.algolia-autocomplete .algolia-docsearch-suggestion--text { - color: #66758c; +}.algolia-autocomplete .algolia-docsearch-suggestion--text { + color: #66758c; display: block; font-size: .85em; line-height: 1.2em; -} - -.algolia-autocomplete .algolia-docsearch-suggestion--no-results { - font-size: 1.2em; +}.algolia-autocomplete .algolia-docsearch-suggestion--no-results { + font-size: 1.2em; padding: 8px 0; text-align: center; width: 100%; -} - -.algolia-autocomplete .algolia-docsearch-suggestion--no-results:before { +}.algolia-autocomplete .algolia-docsearch-suggestion--no-results:before { display: none; -} - -.algolia-autocomplete .algolia-docsearch-suggestion code { +}.algolia-autocomplete .algolia-docsearch-suggestion code { background-color: #ebebeb; border: none; border-radius: 3px; color: #222; - font-family: Menlo, Monaco, Consolas, Courier New, monospace; + font-family: Menlo,Monaco,Consolas,Courier New,monospace; font-size: 90%; padding: 1px 5px; -} - -.algolia-autocomplete .algolia-docsearch-suggestion code .algolia-docsearch-suggestion--highlight { +}.algolia-autocomplete .algolia-docsearch-suggestion code .algolia-docsearch-suggestion--highlight { background: none; -} - -.algolia-autocomplete .algolia-docsearch-suggestion.algolia-docsearch-suggestion__main .algolia-docsearch-suggestion--category-header, +}.algolia-autocomplete .algolia-docsearch-suggestion.algolia-docsearch-suggestion__main .algolia-docsearch-suggestion--category-header, .algolia-autocomplete .algolia-docsearch-suggestion.algolia-docsearch-suggestion__secondary { display: block; -} - -.algolia-autocomplete .suggestion-layout-simple.algolia-docsearch-suggestion { +}.algolia-autocomplete .suggestion-layout-simple.algolia-docsearch-suggestion { border-bottom: 1px solid #eee; - margin: 0; + margin: 0; padding: 8px; -} - -.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--content { - padding: 0; +}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--content { + padding: 0; width: 100%; -} - -.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--content:before { +}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--content:before { display: none; -} - -.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header { - border: none; +}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header { + border: none; display: block; margin: 0; padding: 0; width: 100%; -} - -.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header-lvl0 { - font-size: .85em; +}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header-lvl0 { + font-size: .85em; opacity: .6; -} - -.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header-lvl1 { - font-size: .85em; +}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header-lvl1 { + font-size: .85em; opacity: .6; -} - -.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header-lvl1:before { +}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header-lvl1:before { background-image: url("data:image/svg+xml;utf8,"); content: ""; - display: inline-block; + display: inline-block; height: 10px; width: 10px; -} - -.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--wrapper { +}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--wrapper { float: left; margin: 0; - padding: 0; + padding: 0; width: 100%; -} - -.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--duplicate-content, +}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--duplicate-content, .algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--subcategory-inline { display: none !important; -} - -.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--title { +}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--title { color: #458ee1; font-size: .9em; - font-weight: 400; + font-weight: 400; margin: 0; -} - -.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--title:before { +}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--title:before { color: #458ee1; content: "#"; - display: inline-block; + display: inline-block; font-weight: 700; -} - -.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--text { +}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--text { background: #f8f8f8; display: block; font-size: .85em; line-height: 1.4em; margin: 4px 0 0; - opacity: .8; + opacity: .8; padding: 5.33333px 8px; -} - -.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight { - box-shadow: none; +}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight { + box-shadow: none; color: #3f4145; font-weight: 700; -} - -.algolia-autocomplete .algolia-docsearch-footer { +}.algolia-autocomplete .algolia-docsearch-footer { float: right; font-size: 0; height: 20px; - line-height: 0; + line-height: 0; margin-top: 10.66667px; width: 134px; z-index: 2000; -} - -.algolia-autocomplete .algolia-docsearch-footer--logo { +}.algolia-autocomplete .algolia-docsearch-footer--logo { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='168' height='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M78.988.938h16.594a2.968 2.968 0 0 1 2.966 2.966V20.5a2.967 2.967 0 0 1-2.966 2.964H78.988a2.967 2.967 0 0 1-2.966-2.964V3.897A2.961 2.961 0 0 1 78.988.938zm41.937 17.866c-4.386.02-4.386-3.54-4.386-4.106l-.007-13.336 2.675-.424v13.254c0 .322 0 2.358 1.718 2.364v2.248zm-10.846-2.18c.821 0 1.43-.047 1.855-.129v-2.719a6.334 6.334 0 0 0-1.574-.199 5.7 5.7 0 0 0-.897.069 2.699 2.699 0 0 0-.814.24c-.24.116-.439.28-.582.491-.15.212-.219.335-.219.656 0 .628.219.991.616 1.23s.938.362 1.615.362zm-.233-9.7c.883 0 1.629.109 2.231.328.602.218 1.088.525 1.444.915.363.396.609.922.76 1.483.157.56.232 1.175.232 1.85v6.874a32.5 32.5 0 0 1-1.868.314c-.834.123-1.772.185-2.813.185-.69 0-1.327-.069-1.895-.198a4.001 4.001 0 0 1-1.471-.636 3.085 3.085 0 0 1-.951-1.134c-.226-.465-.343-1.12-.343-1.803 0-.656.13-1.073.384-1.525a3.24 3.24 0 0 1 1.047-1.106c.445-.287.95-.492 1.532-.615a8.8 8.8 0 0 1 1.82-.185 8.404 8.404 0 0 1 1.972.24v-.438c0-.307-.035-.6-.11-.874a1.88 1.88 0 0 0-.384-.73 1.784 1.784 0 0 0-.724-.493 3.164 3.164 0 0 0-1.143-.205c-.616 0-1.177.075-1.69.164a7.735 7.735 0 0 0-1.26.307l-.321-2.192c.335-.117.834-.233 1.478-.349a10.98 10.98 0 0 1 2.073-.178zm52.842 9.626c.822 0 1.43-.048 1.854-.13V13.7a6.347 6.347 0 0 0-1.574-.199c-.294 0-.595.021-.896.069a2.7 2.7 0 0 0-.814.24 1.46 1.46 0 0 0-.582.491c-.15.212-.218.335-.218.656 0 .628.218.991.615 1.23.404.245.938.362 1.615.362zm-.226-9.694c.883 0 1.629.108 2.231.327.602.219 1.088.526 1.444.915.355.39.609.923.759 1.483a6.8 6.8 0 0 1 .233 1.852v6.873c-.41.088-1.034.19-1.868.314-.834.123-1.772.184-2.813.184-.69 0-1.327-.068-1.895-.198a4.001 4.001 0 0 1-1.471-.635 3.085 3.085 0 0 1-.951-1.134c-.226-.465-.343-1.12-.343-1.804 0-.656.13-1.073.384-1.524.26-.45.608-.82 1.047-1.107.445-.286.95-.491 1.532-.614a8.803 8.803 0 0 1 2.751-.13c.329.034.671.096 1.04.185v-.437a3.3 3.3 0 0 0-.109-.875 1.873 1.873 0 0 0-.384-.731 1.784 1.784 0 0 0-.724-.492 3.165 3.165 0 0 0-1.143-.205c-.616 0-1.177.075-1.69.164a7.75 7.75 0 0 0-1.26.307l-.321-2.193c.335-.116.834-.232 1.478-.348a11.633 11.633 0 0 1 2.073-.177zm-8.034-1.271a1.626 1.626 0 0 1-1.628-1.62c0-.895.725-1.62 1.628-1.62.904 0 1.63.725 1.63 1.62 0 .895-.733 1.62-1.63 1.62zm1.348 13.22h-2.689V7.27l2.69-.423v11.956zm-4.714 0c-4.386.02-4.386-3.54-4.386-4.107l-.008-13.336 2.676-.424v13.254c0 .322 0 2.358 1.718 2.364v2.248zm-8.698-5.903c0-1.156-.253-2.119-.746-2.788-.493-.677-1.183-1.01-2.067-1.01-.882 0-1.574.333-2.065 1.01-.493.676-.733 1.632-.733 2.788 0 1.168.246 1.953.74 2.63.492.683 1.183 1.018 2.066 1.018.882 0 1.574-.342 2.067-1.019.492-.683.738-1.46.738-2.63zm2.737-.007c0 .902-.13 1.584-.397 2.33a5.52 5.52 0 0 1-1.128 1.906 4.986 4.986 0 0 1-1.752 1.223c-.685.286-1.739.45-2.265.45-.528-.006-1.574-.157-2.252-.45a5.096 5.096 0 0 1-1.744-1.223c-.487-.527-.863-1.162-1.137-1.906a6.345 6.345 0 0 1-.41-2.33c0-.902.123-1.77.397-2.508a5.554 5.554 0 0 1 1.15-1.892 5.133 5.133 0 0 1 1.75-1.216c.679-.287 1.425-.423 2.232-.423.808 0 1.553.142 2.237.423a4.88 4.88 0 0 1 1.753 1.216 5.644 5.644 0 0 1 1.135 1.892c.287.738.431 1.606.431 2.508zm-20.138 0c0 1.12.246 2.363.738 2.882.493.52 1.13.78 1.91.78.424 0 .828-.062 1.204-.178.377-.116.677-.253.917-.417V9.33a10.476 10.476 0 0 0-1.766-.226c-.971-.028-1.71.37-2.23 1.004-.513.636-.773 1.75-.773 2.788zm7.438 5.274c0 1.824-.466 3.156-1.404 4.004-.936.846-2.367 1.27-4.296 1.27-.705 0-2.17-.137-3.34-.396l.431-2.118c.98.205 2.272.26 2.95.26 1.074 0 1.84-.219 2.299-.656.459-.437.684-1.086.684-1.948v-.437a8.07 8.07 0 0 1-1.047.397c-.43.13-.93.198-1.492.198-.739 0-1.41-.116-2.018-.349a4.206 4.206 0 0 1-1.567-1.025c-.431-.45-.774-1.017-1.013-1.694-.24-.677-.363-1.885-.363-2.773 0-.834.13-1.88.384-2.577.26-.696.629-1.298 1.129-1.796.493-.498 1.095-.881 1.8-1.162a6.605 6.605 0 0 1 2.428-.457c.87 0 1.67.109 2.45.24.78.129 1.444.265 1.985.415V18.17z' fill='%235468FF'/%3E%3Cpath d='M6.972 6.677v1.627c-.712-.446-1.52-.67-2.425-.67-.585 0-1.045.13-1.38.391a1.24 1.24 0 0 0-.502 1.03c0 .425.164.765.494 1.02.33.256.835.532 1.516.83.447.192.795.356 1.045.495.25.138.537.332.862.582.324.25.563.548.718.894.154.345.23.741.23 1.188 0 .947-.334 1.691-1.004 2.234-.67.542-1.537.814-2.601.814-1.18 0-2.16-.229-2.936-.686v-1.708c.84.628 1.814.942 2.92.942.585 0 1.048-.136 1.388-.407.34-.271.51-.646.51-1.125 0-.287-.1-.55-.302-.79-.203-.24-.42-.42-.655-.542-.234-.123-.585-.29-1.053-.503a61.27 61.27 0 0 1-.582-.271 13.67 13.67 0 0 1-.55-.287 4.275 4.275 0 0 1-.567-.351 6.92 6.92 0 0 1-.455-.4c-.18-.17-.31-.34-.39-.51-.08-.17-.155-.37-.224-.598a2.553 2.553 0 0 1-.104-.742c0-.915.333-1.638.998-2.17.664-.532 1.523-.798 2.576-.798.968 0 1.793.17 2.473.51zm7.468 5.696v-.287c-.022-.607-.187-1.088-.495-1.444-.309-.357-.75-.535-1.324-.535-.532 0-.99.194-1.373.583-.382.388-.622.949-.717 1.683h3.909zm1.005 2.792v1.404c-.596.34-1.383.51-2.362.51-1.255 0-2.255-.377-3-1.132-.744-.755-1.116-1.744-1.116-2.968 0-1.297.34-2.316 1.021-3.055.68-.74 1.548-1.11 2.6-1.11 1.033 0 1.852.323 2.458.966.606.644.91 1.572.91 2.784 0 .33-.033.676-.096 1.038h-5.314c.107.702.405 1.239.894 1.611.49.372 1.106.558 1.85.558.862 0 1.58-.202 2.155-.606zm6.605-1.77h-1.212c-.596 0-1.045.116-1.349.35-.303.234-.454.532-.454.894 0 .372.117.664.35.877.235.213.575.32 1.022.32.51 0 .912-.142 1.204-.424.293-.281.44-.651.44-1.108v-.91zm-4.068-2.554V9.325c.627-.361 1.457-.542 2.489-.542 2.116 0 3.175 1.026 3.175 3.08V17h-1.548v-.957c-.415.68-1.143 1.02-2.186 1.02-.766 0-1.38-.22-1.843-.661-.462-.442-.694-1.003-.694-1.684 0-.776.293-1.38.878-1.81.585-.431 1.404-.647 2.457-.647h1.34V11.8c0-.554-.133-.971-.399-1.253-.266-.282-.707-.423-1.324-.423a4.07 4.07 0 0 0-2.345.718zm9.333-1.93v1.42c.394-1 1.101-1.5 2.123-1.5.148 0 .313.016.494.048v1.531a1.885 1.885 0 0 0-.75-.143c-.542 0-.989.24-1.34.718-.351.479-.527 1.048-.527 1.707V17h-1.563V8.91h1.563zm5.01 4.084c.022.82.272 1.492.75 2.019.479.526 1.15.79 2.01.79.639 0 1.235-.176 1.788-.527v1.404c-.521.319-1.186.479-1.995.479-1.265 0-2.276-.4-3.031-1.197-.755-.798-1.133-1.792-1.133-2.984 0-1.16.38-2.151 1.14-2.975.761-.825 1.79-1.237 3.088-1.237.702 0 1.346.149 1.93.447v1.436a3.242 3.242 0 0 0-1.77-.495c-.84 0-1.513.266-2.019.798-.505.532-.758 1.213-.758 2.042zM40.24 5.72v4.579c.458-1 1.293-1.5 2.505-1.5.787 0 1.42.245 1.899.734.479.49.718 1.17.718 2.042V17h-1.564v-5.106c0-.553-.14-.98-.422-1.284-.282-.303-.652-.455-1.11-.455-.531 0-1.002.202-1.411.606-.41.405-.615 1.022-.615 1.851V17h-1.563V5.72h1.563zm14.966 10.02c.596 0 1.096-.253 1.5-.758.404-.506.606-1.157.606-1.955 0-.915-.202-1.62-.606-2.114-.404-.495-.92-.742-1.548-.742-.553 0-1.05.224-1.491.67-.442.447-.662 1.133-.662 2.058 0 .958.212 1.67.638 2.138.425.469.946.703 1.563.703zM53.004 5.72v4.42c.574-.894 1.388-1.341 2.44-1.341 1.022 0 1.857.383 2.506 1.149.649.766.973 1.781.973 3.047 0 1.138-.309 2.109-.925 2.912-.617.803-1.463 1.205-2.537 1.205-1.075 0-1.894-.447-2.457-1.34V17h-1.58V5.72h1.58zm9.908 11.104l-3.223-7.913h1.739l1.005 2.632 1.26 3.415c.096-.32.48-1.458 1.15-3.415l.909-2.632h1.66l-2.92 7.866c-.777 2.074-1.963 3.11-3.559 3.11a2.92 2.92 0 0 1-.734-.079v-1.34c.17.042.351.064.543.064 1.032 0 1.755-.57 2.17-1.708z' fill='%235D6494'/%3E%3Cpath d='M89.632 5.967v-.772a.978.978 0 0 0-.978-.977h-2.28a.978.978 0 0 0-.978.977v.793c0 .088.082.15.171.13a7.127 7.127 0 0 1 1.984-.28c.65 0 1.295.088 1.917.259.082.02.164-.04.164-.13m-6.248 1.01l-.39-.389a.977.977 0 0 0-1.382 0l-.465.465a.973.973 0 0 0 0 1.38l.383.383c.062.061.15.047.205-.014.226-.307.472-.601.746-.874.281-.28.568-.526.883-.751.068-.042.075-.137.02-.2m4.16 2.453v3.341c0 .096.104.165.192.117l2.97-1.537c.068-.034.089-.117.055-.184a3.695 3.695 0 0 0-3.08-1.866c-.068 0-.136.054-.136.13m0 8.048a4.489 4.489 0 0 1-4.49-4.482 4.488 4.488 0 0 1 4.49-4.482 4.488 4.488 0 0 1 4.489 4.482 4.484 4.484 0 0 1-4.49 4.482m0-10.85a6.363 6.363 0 1 0 0 12.729 6.37 6.37 0 0 0 6.372-6.368 6.358 6.358 0 0 0-6.371-6.36' fill='%23FFF'/%3E%3C/g%3E%3C/svg%3E"); background-position: 50%; background-repeat: no-repeat; background-size: 100%; - display: block; + display: block; height: 100%; overflow: hidden; padding: 0 !important; text-indent: -9000px; width: 100%; -} - -@media (min-width: 768px) { +}@media(min-width: 768px) { .algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column { display: block; } -} - -@media (max-width: 768px) { +}@media(max-width: 768px) { .algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column { color: #02060c; display: inline-block; float: left; font-size: .9em; font-weight: 700; - opacity: .5; + opacity: .5; padding: 0; text-align: left; width: auto; - } - .algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column:before { + }.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column:before { display: none; - } - .algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column:after { + }.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column:after { content: "|"; - } - .algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--content { + }.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--content { display: inline-block; float: left; - padding: 0; + padding: 0; text-align: left; width: auto; - } - .algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--content:before { + }.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--content:before { display: none; } } \ No newline at end of file diff --git a/docs/dist/docs.min.css b/docs/dist/docs.min.css index 035f451be..1706b749b 100644 --- a/docs/dist/docs.min.css +++ b/docs/dist/docs.min.css @@ -1 +1 @@ -/*! Spectre.css Docs | MIT License | github.com/picturepan2/spectre */.version::after{content:"0.5.9"}.off-canvas .off-canvas-toggle{font-size:1rem;left:1.5rem;position:fixed;top:1rem}.off-canvas .off-canvas-sidebar{width:12rem}.off-canvas .off-canvas-content{padding:0}.docs-container{min-height:100vh}.docs-navbar{height:3.8rem;position:fixed;right:0;top:0;z-index:100}.docs-navbar .btns{position:absolute;right:1.5rem;top:1rem;width:14rem}.docs-navbar .algolia-autocomplete{-ms-flex:1 1 auto;flex:1 1 auto}.docs-sidebar .docs-nav{bottom:1.5rem;-webkit-overflow-scrolling:touch;overflow-y:auto;padding:.5rem 1.5rem;position:fixed;top:3.5rem;width:12rem}.docs-sidebar .accordion{margin-bottom:.75rem}.docs-sidebar .accordion input~.accordion-header{color:#455060;font-size:.65rem;font-weight:600;text-transform:uppercase}.docs-sidebar .accordion input:checked~.accordion-header{color:#505c6e}.docs-sidebar .accordion .menu .menu-item{font-size:.7rem;padding-left:1rem}.docs-sidebar .accordion .menu .menu-item>a{background:0 0;color:#66758c;display:inline-block}.docs-content{-ms-flex:1 1 auto;flex:1 1 auto;padding:0 4rem;width:calc(100vw - 12rem)}.docs-content>.container{margin-left:0;max-width:800px;padding-bottom:1.5rem}.docs-content .anchor{color:#6362dc;display:none;margin-left:.2rem;padding:0 .2rem}.docs-content .anchor:focus,.docs-content .anchor:hover{display:inline;text-decoration:none}.docs-content .s-subtitle,.docs-content .s-title{line-height:1.8rem;margin-bottom:0;padding-bottom:1rem;padding-top:1rem;position:static}@supports ((position:-webkit-sticky) or (position:sticky)){.docs-content .s-subtitle,.docs-content .s-title{position:-webkit-sticky;position:sticky;top:0;z-index:99}.docs-content .s-subtitle::before,.docs-content .s-title::before{background:#fff;bottom:0;content:"";display:block;left:-10px;position:absolute;right:-10px;top:-5px;z-index:-1}}.docs-content .s-subtitle:hover .anchor,.docs-content .s-title:hover .anchor{display:inline}.docs-content .s-subtitle+.docs-note,.docs-content .s-title+.docs-note{margin-top:.4rem}.docs-content .docs-demo{padding-bottom:1rem;padding-top:1rem}.docs-content .docs-demo .card{border:0;box-shadow:0 .25rem 1rem rgba(48,55,66,.15);height:100%}.docs-content .column{padding:.4rem}.docs-content .docs-block{border-radius:.1rem;padding:.4rem}.docs-content .docs-block.bg-gray{background:#eef0f3}.docs-content .docs-shape{height:4.8rem;line-height:1.2rem;padding:1.8rem 0;width:4.8rem}.docs-content .docs-dot{border-radius:50%;display:inline-block;height:.5rem;padding:0;width:.5rem}.docs-content .docs-table td,.docs-content .docs-table th{padding:.75rem .25rem}.docs-content .docs-color{border-radius:.1rem;margin:.25rem 0;padding:5rem .5rem .5rem}.docs-content .docs-color .color-subtitle{font-size:.7rem;opacity:.75}.docs-content .code .hljs-tag{color:#505c6e}.docs-content .code .hljs-comment{color:#bcc3ce}.docs-content .code .hljs-class,.docs-content .code .hljs-number,.docs-content .code .hljs-string,.docs-content .code .hljs-title{color:#5755d9}.docs-content .code .hljs-attribute,.docs-content .code .hljs-built_in,.docs-content .code .hljs-keyword,.docs-content .code .hljs-name,.docs-content .code .hljs-variable{color:#d73e48}.docs-content .code .hljs-hexcolor,.docs-content .code .hljs-value{color:#505c6e}.docs-content .c-select-all{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}.docs-content .panel{height:75vh}.docs-content .panel .tile{margin:.75rem 0}.docs-content .parallax{margin:2rem auto}.docs-content .form-autocomplete .menu{position:static}.docs-content .example-tile-icon{align-content:space-around;align-items:center;background:#5755d9;border-radius:.1rem;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-line-pack:distribute;font-size:1.2rem;height:2rem;width:2rem}.docs-content .example-tile-icon .icon{margin:auto}.docs-content .comparison-slider{height:auto;padding-bottom:56.2222%}.docs-content .comparison-slider .filter-grayscale{filter:grayscale(75%)}.docs-content .off-canvas{position:relative}.docs-content .off-canvas .off-canvas-toggle{left:.4rem;position:absolute;top:.4rem;z-index:1}.docs-brand{color:#5755d9;height:2rem;left:1.5rem;position:fixed;top:.85rem}.docs-brand .docs-logo{align-items:center;border-radius:.1rem;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;font-size:.7rem;height:2rem;padding:.2rem;width:auto}.docs-brand .docs-logo:focus,.docs-brand .docs-logo:hover{text-decoration:none}.docs-brand .docs-logo img{display:inline-block;height:auto;width:1.6rem}.docs-brand .docs-logo h2{display:inline-block;font-size:.8rem;font-weight:700;line-height:1.5rem;margin-bottom:0;margin-left:.5rem;margin-right:.3rem}.docs-footer{color:#bcc3ce;padding:.5rem}.docs-footer a{color:#66758c}.docs-ad{background:#f7f8f9;border-radius:.1rem;display:block;margin:2rem 0;padding:.4rem;position:relative}.docs-ad ins{line-height:1;vertical-align:middle}.docs-ad .carbon-wrap .carbon-img{display:block}.docs-ad .carbon-wrap .carbon-text{color:#66758c;display:block;font-size:.7rem}.docs-ad .carbon-poweredby{color:#bcc3ce;font-size:.7rem}.section-hero{padding:1rem .5rem}.section-hero .docs-brand{position:absolute;top:.85rem}.section-hero .docs-brand h2{color:#5755d9}.section-hero .column{padding:.4rem}.section-ads{padding:1rem .5rem}.section-updates{padding:4.5rem .5rem 2.5rem .5rem}.section-updates .card{border:0;margin-bottom:1rem}.section-features{padding:4.5rem .5rem}.section-features .column{padding:.4rem}.section-footer{color:#bcc3ce;padding:1.8rem .75rem 1rem;position:relative;z-index:200}.section-footer a{color:#66758c}.grid-hero{padding-bottom:2rem;padding-top:6rem}.grid-hero h1{color:#3b4351;font-size:1.6rem;font-weight:600;margin-bottom:1.5rem}.grid-hero h2{color:#455060;font-size:.9rem;font-weight:400;line-height:1.5rem;margin-bottom:1.5rem}.grid-hero h2 u{border-bottom:.1rem solid currentColor;padding-bottom:.05rem;text-decoration:none}.grid-hero .card{background:0 0;border:0;color:#5b687d;padding:.5rem}.grid-hero .card .card-title{color:#5755d9;font-size:1rem;font-weight:700;margin-bottom:0}@media (max-width:960px){.off-canvas .off-canvas-toggle{z-index:300}.off-canvas .off-canvas-content{width:100%}.docs-sidebar .docs-brand{margin:.85rem 1.5rem;padding:0;position:static}.docs-sidebar .docs-nav{margin-top:1rem;position:static}.docs-sidebar .menu .menu-item>a{padding:.3rem .4rem}.docs-navbar{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:rgba(247,248,249,.65);left:0}.docs-content{min-width:auto;padding:0 1.5rem;width:100%}.docs-content .s-subtitle,.docs-content .s-title{padding-top:5rem;position:static}.docs-content .s-subtitle::before,.docs-content .s-title::before{content:none}.section-hero .s-brand{height:5rem;padding:1.5rem .5rem;text-align:center;width:100%}.section-hero .s-brand .s-logo{height:auto}.section-hero .s-brand img{height:3.2rem;width:3.2rem}.section-hero .s-brand h2{display:none}}@media (max-width:600px){.grid-hero h2{font-size:.9rem}.grid-hero .card{padding:0}.off-canvas .off-canvas-toggle{left:.5rem}.docs-navbar .btns{right:.9rem}.grid-hero .docs-brand{left:.9rem}.docs-sidebar .docs-brand{margin:.85rem 1rem}.docs-sidebar .docs-nav{padding:.5rem 1rem}.docs-content{padding:0 .5rem}.docs-content .docs-block{padding:.4rem .1rem}}@media (min-width:1366px){.docs-ad.docs-ad-sidebar{bottom:1rem;margin:0;position:fixed;right:1rem;width:7.3rem}}.searchbox{box-sizing:border-box;display:inline-block;height:32px!important;position:relative;visibility:visible!important;white-space:nowrap;width:200px}.searchbox .algolia-autocomplete{display:block;height:100%;width:100%}.searchbox__wrapper{height:100%;position:relative;width:100%;z-index:999}.searchbox__input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff!important;border:0;border-radius:16px;box-shadow:inset 0 0 0 1px #ccc;box-sizing:border-box;display:inline-block;font-size:12px;height:100%;padding:0 26px 0 32px;transition:box-shadow .4s ease,background .4s ease;vertical-align:middle;white-space:normal;width:100%}.searchbox__input::-webkit-search-cancel-button,.searchbox__input::-webkit-search-decoration,.searchbox__input::-webkit-search-results-button,.searchbox__input::-webkit-search-results-decoration{display:none}.searchbox__input:hover{box-shadow:inset 0 0 0 1px #b3b3b3}.searchbox__input:active,.searchbox__input:focus{background:#fff;box-shadow:inset 0 0 0 1px #aaa;outline:0}.searchbox__input:-ms-input-placeholder{color:#aaa}.searchbox__input::-ms-input-placeholder{color:#aaa}.searchbox__input::placeholder{color:#aaa}.searchbox__submit{background-color:rgba(69,142,225,0);border:0;border-radius:16px 0 0 16px;font-size:inherit;height:100%;left:0;margin:0;padding:0;position:absolute;right:inherit;text-align:center;top:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle;width:32px}.searchbox__submit:before{content:"";display:inline-block;height:100%;margin-right:-4px;vertical-align:middle}.searchbox__submit:active,.searchbox__submit:hover{cursor:pointer}.searchbox__submit:focus{outline:0}.searchbox__submit svg{fill:#6d7e96;height:14px;vertical-align:middle;width:14px}.searchbox__reset{background:0 0;border:0;cursor:pointer;display:block;fill:rgba(0,0,0,.5);font-size:inherit;margin:0;padding:0;position:absolute;right:8px;top:8px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.searchbox__reset.hide{display:none}.searchbox__reset:focus{outline:0}.searchbox__reset svg{display:block;height:8px;margin:4px;width:8px}.searchbox__input:valid~.searchbox__reset{animation-duration:.15s;animation-name:sbx-reset-in;display:block}@keyframes sbx-reset-in{0%{opacity:0;transform:translate3d(-20%,0,0)}to{opacity:1;transform:none}}.algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu{left:inherit!important;right:0!important}.algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu:before{right:48px}.algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu{left:0!important;right:inherit!important}.algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu:before{left:48px}.algolia-autocomplete .ds-dropdown-menu{background:0 0;border:none;border-radius:4px;box-shadow:0 .05rem .2rem rgba(48,55,66,.3);height:auto;margin:6px 0 0;max-width:600px;min-width:500px;padding:0;position:relative;text-align:left;top:-6px;z-index:999}.algolia-autocomplete .ds-dropdown-menu .ds-suggestions{margin-top:8px;position:relative;z-index:1000}.algolia-autocomplete .ds-dropdown-menu .ds-suggestions a:hover{text-decoration:none}.algolia-autocomplete .ds-dropdown-menu .ds-suggestion{cursor:pointer}.algolia-autocomplete .ds-dropdown-menu .ds-suggestion.ds-cursor .algolia-docsearch-suggestion.suggestion-layout-simple,.algolia-autocomplete .ds-dropdown-menu .ds-suggestion.ds-cursor .algolia-docsearch-suggestion:not(.suggestion-layout-simple) .algolia-docsearch-suggestion--content{background-color:rgba(87,85,217,.05)}.algolia-autocomplete .ds-dropdown-menu [class^=ds-dataset-]{background:#fff;border-radius:4px;overflow:auto;padding:0 8px 8px;position:relative}.algolia-autocomplete .ds-dropdown-menu *{box-sizing:border-box}.algolia-autocomplete .algolia-docsearch-suggestion{background:#fff;color:#303742;display:block;overflow:hidden;padding:0 8px;position:relative}.algolia-autocomplete .algolia-docsearch-suggestion--highlight{background:rgba(87,85,217,.1);color:#5755d9;padding:.1em .05em}.algolia-autocomplete .algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--category-header-lvl0 .algolia-docsearch-suggestion--highlight,.algolia-autocomplete .algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--category-header-lvl1 .algolia-docsearch-suggestion--highlight{background:inherit;box-shadow:inset 0 -2px 0 0 rgba(87,85,217,.8);color:inherit;padding:0 0 1px}.algolia-autocomplete .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight{background:inherit;box-shadow:inset 0 -2px 0 0 rgba(87,85,217,.8);color:inherit;padding:0 0 1px}.algolia-autocomplete .algolia-docsearch-suggestion--content{cursor:pointer;display:block;float:right;padding:5.33333px 0 5.33333px 10.66667px;position:relative;width:70%}.algolia-autocomplete .algolia-docsearch-suggestion--content:before{background:#f7f8f9;content:"";display:block;height:100%;left:-1px;position:absolute;top:0;width:1px}.algolia-autocomplete .algolia-docsearch-suggestion--category-header{border-bottom:1px solid #f7f8f9;color:#303742;display:none;font-size:1em;margin-top:8px;padding:4px 0;position:relative}.algolia-autocomplete .algolia-docsearch-suggestion--wrapper{float:left;padding:8px 0 0;width:100%}.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column{color:#bcc3ce;float:left;font-size:.9em;padding:5.33333px 10.66667px;position:relative;text-align:right;width:30%;word-wrap:break-word}.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column:before{background:#f7f8f9;content:"";display:block;height:100%;position:absolute;right:0;top:0;width:1px}.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-inline{display:none}.algolia-autocomplete .algolia-docsearch-suggestion--title{color:#303742;font-size:.9em;font-weight:700}.algolia-autocomplete .algolia-docsearch-suggestion--text{color:#66758c;display:block;font-size:.85em;line-height:1.2em}.algolia-autocomplete .algolia-docsearch-suggestion--no-results{font-size:1.2em;padding:8px 0;text-align:center;width:100%}.algolia-autocomplete .algolia-docsearch-suggestion--no-results:before{display:none}.algolia-autocomplete .algolia-docsearch-suggestion code{background-color:#ebebeb;border:none;border-radius:3px;color:#222;font-family:Menlo,Monaco,Consolas,Courier New,monospace;font-size:90%;padding:1px 5px}.algolia-autocomplete .algolia-docsearch-suggestion code .algolia-docsearch-suggestion--highlight{background:0 0}.algolia-autocomplete .algolia-docsearch-suggestion.algolia-docsearch-suggestion__main .algolia-docsearch-suggestion--category-header,.algolia-autocomplete .algolia-docsearch-suggestion.algolia-docsearch-suggestion__secondary{display:block}.algolia-autocomplete .suggestion-layout-simple.algolia-docsearch-suggestion{border-bottom:1px solid #eee;margin:0;padding:8px}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--content{padding:0;width:100%}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--content:before{display:none}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header{border:none;display:block;margin:0;padding:0;width:100%}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header-lvl0{font-size:.85em;opacity:.6}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header-lvl1{font-size:.85em;opacity:.6}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header-lvl1:before{background-image:url("data:image/svg+xml;utf8,");content:"";display:inline-block;height:10px;width:10px}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--wrapper{float:left;margin:0;padding:0;width:100%}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--duplicate-content,.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--subcategory-inline{display:none!important}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--title{color:#458ee1;font-size:.9em;font-weight:400;margin:0}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--title:before{color:#458ee1;content:"#";display:inline-block;font-weight:700}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--text{background:#f8f8f8;display:block;font-size:.85em;line-height:1.4em;margin:4px 0 0;opacity:.8;padding:5.33333px 8px}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight{box-shadow:none;color:#3f4145;font-weight:700}.algolia-autocomplete .algolia-docsearch-footer{float:right;font-size:0;height:20px;line-height:0;margin-top:10.66667px;width:134px;z-index:2000}.algolia-autocomplete .algolia-docsearch-footer--logo{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='168' height='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M78.988.938h16.594a2.968 2.968 0 0 1 2.966 2.966V20.5a2.967 2.967 0 0 1-2.966 2.964H78.988a2.967 2.967 0 0 1-2.966-2.964V3.897A2.961 2.961 0 0 1 78.988.938zm41.937 17.866c-4.386.02-4.386-3.54-4.386-4.106l-.007-13.336 2.675-.424v13.254c0 .322 0 2.358 1.718 2.364v2.248zm-10.846-2.18c.821 0 1.43-.047 1.855-.129v-2.719a6.334 6.334 0 0 0-1.574-.199 5.7 5.7 0 0 0-.897.069 2.699 2.699 0 0 0-.814.24c-.24.116-.439.28-.582.491-.15.212-.219.335-.219.656 0 .628.219.991.616 1.23s.938.362 1.615.362zm-.233-9.7c.883 0 1.629.109 2.231.328.602.218 1.088.525 1.444.915.363.396.609.922.76 1.483.157.56.232 1.175.232 1.85v6.874a32.5 32.5 0 0 1-1.868.314c-.834.123-1.772.185-2.813.185-.69 0-1.327-.069-1.895-.198a4.001 4.001 0 0 1-1.471-.636 3.085 3.085 0 0 1-.951-1.134c-.226-.465-.343-1.12-.343-1.803 0-.656.13-1.073.384-1.525a3.24 3.24 0 0 1 1.047-1.106c.445-.287.95-.492 1.532-.615a8.8 8.8 0 0 1 1.82-.185 8.404 8.404 0 0 1 1.972.24v-.438c0-.307-.035-.6-.11-.874a1.88 1.88 0 0 0-.384-.73 1.784 1.784 0 0 0-.724-.493 3.164 3.164 0 0 0-1.143-.205c-.616 0-1.177.075-1.69.164a7.735 7.735 0 0 0-1.26.307l-.321-2.192c.335-.117.834-.233 1.478-.349a10.98 10.98 0 0 1 2.073-.178zm52.842 9.626c.822 0 1.43-.048 1.854-.13V13.7a6.347 6.347 0 0 0-1.574-.199c-.294 0-.595.021-.896.069a2.7 2.7 0 0 0-.814.24 1.46 1.46 0 0 0-.582.491c-.15.212-.218.335-.218.656 0 .628.218.991.615 1.23.404.245.938.362 1.615.362zm-.226-9.694c.883 0 1.629.108 2.231.327.602.219 1.088.526 1.444.915.355.39.609.923.759 1.483a6.8 6.8 0 0 1 .233 1.852v6.873c-.41.088-1.034.19-1.868.314-.834.123-1.772.184-2.813.184-.69 0-1.327-.068-1.895-.198a4.001 4.001 0 0 1-1.471-.635 3.085 3.085 0 0 1-.951-1.134c-.226-.465-.343-1.12-.343-1.804 0-.656.13-1.073.384-1.524.26-.45.608-.82 1.047-1.107.445-.286.95-.491 1.532-.614a8.803 8.803 0 0 1 2.751-.13c.329.034.671.096 1.04.185v-.437a3.3 3.3 0 0 0-.109-.875 1.873 1.873 0 0 0-.384-.731 1.784 1.784 0 0 0-.724-.492 3.165 3.165 0 0 0-1.143-.205c-.616 0-1.177.075-1.69.164a7.75 7.75 0 0 0-1.26.307l-.321-2.193c.335-.116.834-.232 1.478-.348a11.633 11.633 0 0 1 2.073-.177zm-8.034-1.271a1.626 1.626 0 0 1-1.628-1.62c0-.895.725-1.62 1.628-1.62.904 0 1.63.725 1.63 1.62 0 .895-.733 1.62-1.63 1.62zm1.348 13.22h-2.689V7.27l2.69-.423v11.956zm-4.714 0c-4.386.02-4.386-3.54-4.386-4.107l-.008-13.336 2.676-.424v13.254c0 .322 0 2.358 1.718 2.364v2.248zm-8.698-5.903c0-1.156-.253-2.119-.746-2.788-.493-.677-1.183-1.01-2.067-1.01-.882 0-1.574.333-2.065 1.01-.493.676-.733 1.632-.733 2.788 0 1.168.246 1.953.74 2.63.492.683 1.183 1.018 2.066 1.018.882 0 1.574-.342 2.067-1.019.492-.683.738-1.46.738-2.63zm2.737-.007c0 .902-.13 1.584-.397 2.33a5.52 5.52 0 0 1-1.128 1.906 4.986 4.986 0 0 1-1.752 1.223c-.685.286-1.739.45-2.265.45-.528-.006-1.574-.157-2.252-.45a5.096 5.096 0 0 1-1.744-1.223c-.487-.527-.863-1.162-1.137-1.906a6.345 6.345 0 0 1-.41-2.33c0-.902.123-1.77.397-2.508a5.554 5.554 0 0 1 1.15-1.892 5.133 5.133 0 0 1 1.75-1.216c.679-.287 1.425-.423 2.232-.423.808 0 1.553.142 2.237.423a4.88 4.88 0 0 1 1.753 1.216 5.644 5.644 0 0 1 1.135 1.892c.287.738.431 1.606.431 2.508zm-20.138 0c0 1.12.246 2.363.738 2.882.493.52 1.13.78 1.91.78.424 0 .828-.062 1.204-.178.377-.116.677-.253.917-.417V9.33a10.476 10.476 0 0 0-1.766-.226c-.971-.028-1.71.37-2.23 1.004-.513.636-.773 1.75-.773 2.788zm7.438 5.274c0 1.824-.466 3.156-1.404 4.004-.936.846-2.367 1.27-4.296 1.27-.705 0-2.17-.137-3.34-.396l.431-2.118c.98.205 2.272.26 2.95.26 1.074 0 1.84-.219 2.299-.656.459-.437.684-1.086.684-1.948v-.437a8.07 8.07 0 0 1-1.047.397c-.43.13-.93.198-1.492.198-.739 0-1.41-.116-2.018-.349a4.206 4.206 0 0 1-1.567-1.025c-.431-.45-.774-1.017-1.013-1.694-.24-.677-.363-1.885-.363-2.773 0-.834.13-1.88.384-2.577.26-.696.629-1.298 1.129-1.796.493-.498 1.095-.881 1.8-1.162a6.605 6.605 0 0 1 2.428-.457c.87 0 1.67.109 2.45.24.78.129 1.444.265 1.985.415V18.17z' fill='%235468FF'/%3E%3Cpath d='M6.972 6.677v1.627c-.712-.446-1.52-.67-2.425-.67-.585 0-1.045.13-1.38.391a1.24 1.24 0 0 0-.502 1.03c0 .425.164.765.494 1.02.33.256.835.532 1.516.83.447.192.795.356 1.045.495.25.138.537.332.862.582.324.25.563.548.718.894.154.345.23.741.23 1.188 0 .947-.334 1.691-1.004 2.234-.67.542-1.537.814-2.601.814-1.18 0-2.16-.229-2.936-.686v-1.708c.84.628 1.814.942 2.92.942.585 0 1.048-.136 1.388-.407.34-.271.51-.646.51-1.125 0-.287-.1-.55-.302-.79-.203-.24-.42-.42-.655-.542-.234-.123-.585-.29-1.053-.503a61.27 61.27 0 0 1-.582-.271 13.67 13.67 0 0 1-.55-.287 4.275 4.275 0 0 1-.567-.351 6.92 6.92 0 0 1-.455-.4c-.18-.17-.31-.34-.39-.51-.08-.17-.155-.37-.224-.598a2.553 2.553 0 0 1-.104-.742c0-.915.333-1.638.998-2.17.664-.532 1.523-.798 2.576-.798.968 0 1.793.17 2.473.51zm7.468 5.696v-.287c-.022-.607-.187-1.088-.495-1.444-.309-.357-.75-.535-1.324-.535-.532 0-.99.194-1.373.583-.382.388-.622.949-.717 1.683h3.909zm1.005 2.792v1.404c-.596.34-1.383.51-2.362.51-1.255 0-2.255-.377-3-1.132-.744-.755-1.116-1.744-1.116-2.968 0-1.297.34-2.316 1.021-3.055.68-.74 1.548-1.11 2.6-1.11 1.033 0 1.852.323 2.458.966.606.644.91 1.572.91 2.784 0 .33-.033.676-.096 1.038h-5.314c.107.702.405 1.239.894 1.611.49.372 1.106.558 1.85.558.862 0 1.58-.202 2.155-.606zm6.605-1.77h-1.212c-.596 0-1.045.116-1.349.35-.303.234-.454.532-.454.894 0 .372.117.664.35.877.235.213.575.32 1.022.32.51 0 .912-.142 1.204-.424.293-.281.44-.651.44-1.108v-.91zm-4.068-2.554V9.325c.627-.361 1.457-.542 2.489-.542 2.116 0 3.175 1.026 3.175 3.08V17h-1.548v-.957c-.415.68-1.143 1.02-2.186 1.02-.766 0-1.38-.22-1.843-.661-.462-.442-.694-1.003-.694-1.684 0-.776.293-1.38.878-1.81.585-.431 1.404-.647 2.457-.647h1.34V11.8c0-.554-.133-.971-.399-1.253-.266-.282-.707-.423-1.324-.423a4.07 4.07 0 0 0-2.345.718zm9.333-1.93v1.42c.394-1 1.101-1.5 2.123-1.5.148 0 .313.016.494.048v1.531a1.885 1.885 0 0 0-.75-.143c-.542 0-.989.24-1.34.718-.351.479-.527 1.048-.527 1.707V17h-1.563V8.91h1.563zm5.01 4.084c.022.82.272 1.492.75 2.019.479.526 1.15.79 2.01.79.639 0 1.235-.176 1.788-.527v1.404c-.521.319-1.186.479-1.995.479-1.265 0-2.276-.4-3.031-1.197-.755-.798-1.133-1.792-1.133-2.984 0-1.16.38-2.151 1.14-2.975.761-.825 1.79-1.237 3.088-1.237.702 0 1.346.149 1.93.447v1.436a3.242 3.242 0 0 0-1.77-.495c-.84 0-1.513.266-2.019.798-.505.532-.758 1.213-.758 2.042zM40.24 5.72v4.579c.458-1 1.293-1.5 2.505-1.5.787 0 1.42.245 1.899.734.479.49.718 1.17.718 2.042V17h-1.564v-5.106c0-.553-.14-.98-.422-1.284-.282-.303-.652-.455-1.11-.455-.531 0-1.002.202-1.411.606-.41.405-.615 1.022-.615 1.851V17h-1.563V5.72h1.563zm14.966 10.02c.596 0 1.096-.253 1.5-.758.404-.506.606-1.157.606-1.955 0-.915-.202-1.62-.606-2.114-.404-.495-.92-.742-1.548-.742-.553 0-1.05.224-1.491.67-.442.447-.662 1.133-.662 2.058 0 .958.212 1.67.638 2.138.425.469.946.703 1.563.703zM53.004 5.72v4.42c.574-.894 1.388-1.341 2.44-1.341 1.022 0 1.857.383 2.506 1.149.649.766.973 1.781.973 3.047 0 1.138-.309 2.109-.925 2.912-.617.803-1.463 1.205-2.537 1.205-1.075 0-1.894-.447-2.457-1.34V17h-1.58V5.72h1.58zm9.908 11.104l-3.223-7.913h1.739l1.005 2.632 1.26 3.415c.096-.32.48-1.458 1.15-3.415l.909-2.632h1.66l-2.92 7.866c-.777 2.074-1.963 3.11-3.559 3.11a2.92 2.92 0 0 1-.734-.079v-1.34c.17.042.351.064.543.064 1.032 0 1.755-.57 2.17-1.708z' fill='%235D6494'/%3E%3Cpath d='M89.632 5.967v-.772a.978.978 0 0 0-.978-.977h-2.28a.978.978 0 0 0-.978.977v.793c0 .088.082.15.171.13a7.127 7.127 0 0 1 1.984-.28c.65 0 1.295.088 1.917.259.082.02.164-.04.164-.13m-6.248 1.01l-.39-.389a.977.977 0 0 0-1.382 0l-.465.465a.973.973 0 0 0 0 1.38l.383.383c.062.061.15.047.205-.014.226-.307.472-.601.746-.874.281-.28.568-.526.883-.751.068-.042.075-.137.02-.2m4.16 2.453v3.341c0 .096.104.165.192.117l2.97-1.537c.068-.034.089-.117.055-.184a3.695 3.695 0 0 0-3.08-1.866c-.068 0-.136.054-.136.13m0 8.048a4.489 4.489 0 0 1-4.49-4.482 4.488 4.488 0 0 1 4.49-4.482 4.488 4.488 0 0 1 4.489 4.482 4.484 4.484 0 0 1-4.49 4.482m0-10.85a6.363 6.363 0 1 0 0 12.729 6.37 6.37 0 0 0 6.372-6.368 6.358 6.358 0 0 0-6.371-6.36' fill='%23FFF'/%3E%3C/g%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:100%;display:block;height:100%;overflow:hidden;padding:0!important;text-indent:-9000px;width:100%}@media (min-width:768px){.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column{display:block}}@media (max-width:768px){.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column{color:#02060c;display:inline-block;float:left;font-size:.9em;font-weight:700;opacity:.5;padding:0;text-align:left;width:auto}.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column:before{display:none}.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column:after{content:"|"}.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--content{display:inline-block;float:left;padding:0;text-align:left;width:auto}.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--content:before{display:none}} \ No newline at end of file +/*! Spectre.css Docs | MIT License | github.com/picturepan2/spectre */.version::after{content:"0.5.9"}.off-canvas .off-canvas-toggle{font-size:1rem;left:1.5rem;position:fixed;top:1rem}.off-canvas .off-canvas-sidebar{width:12rem}.off-canvas .off-canvas-content{padding:0}.docs-container{min-height:100vh}.docs-navbar{height:3.8rem;position:fixed;right:0;top:0;z-index:100}.docs-navbar .btns{position:absolute;right:1.5rem;top:1rem;width:14rem}.docs-navbar .algolia-autocomplete{-ms-flex:1 1 auto;flex:1 1 auto}.docs-sidebar .docs-nav{bottom:1.5rem;-webkit-overflow-scrolling:touch;overflow-y:auto;padding:.5rem 1.5rem;position:fixed;top:3.5rem;width:12rem}.docs-sidebar .accordion{margin-bottom:.75rem}.docs-sidebar .accordion input~.accordion-header{color:#455060;font-size:.65rem;font-weight:600;text-transform:uppercase}.docs-sidebar .accordion input:checked~.accordion-header{color:#505c6e}.docs-sidebar .accordion .menu .menu-item{font-size:.7rem;padding-left:1rem}.docs-sidebar .accordion .menu .menu-item>a{background:0 0;color:#66758c;display:inline-block}.docs-content{-ms-flex:1 1 auto;flex:1 1 auto;padding:0 4rem;width:calc(100vw - 12rem)}.docs-content>.container{margin-left:0;max-width:800px;padding-bottom:1.5rem}.docs-content .anchor{color:#6362dc;display:none;margin-left:.2rem;padding:0 .2rem}.docs-content .anchor:focus,.docs-content .anchor:hover{display:inline;text-decoration:none}.docs-content .s-subtitle,.docs-content .s-title{line-height:1.8rem;margin-bottom:0;padding-bottom:1rem;padding-top:1rem;position:static}@supports((position:-webkit-sticky) or (position:sticky)){.docs-content .s-subtitle,.docs-content .s-title{position:-webkit-sticky;position:sticky;top:0;z-index:99}.docs-content .s-subtitle::before,.docs-content .s-title::before{background:#fff;bottom:0;content:"";display:block;left:-10px;position:absolute;right:-10px;top:-5px;z-index:-1}}.docs-content .s-subtitle:hover .anchor,.docs-content .s-title:hover .anchor{display:inline}.docs-content .s-subtitle+.docs-note,.docs-content .s-title+.docs-note{margin-top:.4rem}.docs-content .docs-demo{padding-bottom:1rem;padding-top:1rem}.docs-content .docs-demo .card{border:0;box-shadow:0 .25rem 1rem rgba(48,55,66,.15);height:100%}.docs-content .column{padding:.4rem}.docs-content .docs-block{border-radius:.1rem;padding:.4rem}.docs-content .docs-block.bg-gray{background:#eef0f3}.docs-content .docs-shape{height:4.8rem;line-height:1.2rem;padding:1.8rem 0;width:4.8rem}.docs-content .docs-dot{border-radius:50%;display:inline-block;height:.5rem;padding:0;width:.5rem}.docs-content .docs-table td,.docs-content .docs-table th{padding:.75rem .25rem}.docs-content .docs-color{border-radius:.1rem;margin:.25rem 0;padding:5rem .5rem .5rem}.docs-content .docs-color .color-subtitle{font-size:.7rem;opacity:.75}.docs-content .code .hljs-tag{color:#505c6e}.docs-content .code .hljs-comment{color:#bcc3ce}.docs-content .code .hljs-class,.docs-content .code .hljs-number,.docs-content .code .hljs-string,.docs-content .code .hljs-title{color:#5755d9}.docs-content .code .hljs-attribute,.docs-content .code .hljs-built_in,.docs-content .code .hljs-keyword,.docs-content .code .hljs-name,.docs-content .code .hljs-variable{color:#d73e48}.docs-content .code .hljs-hexcolor,.docs-content .code .hljs-value{color:#505c6e}.docs-content .c-select-all{-webkit-user-select:all;-ms-user-select:all;user-select:all}.docs-content .panel{height:75vh}.docs-content .panel .tile{margin:.75rem 0}.docs-content .parallax{margin:2rem auto}.docs-content .form-autocomplete .menu{position:static}.docs-content .example-tile-icon{align-content:space-around;align-items:center;background:#5755d9;border-radius:.1rem;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-line-pack:distribute;font-size:1.2rem;height:2rem;width:2rem}.docs-content .example-tile-icon .icon{margin:auto}.docs-content .comparison-slider{height:auto;padding-bottom:56.2222%}.docs-content .comparison-slider .filter-grayscale{filter:grayscale(75%)}.docs-content .off-canvas{position:relative}.docs-content .off-canvas .off-canvas-toggle{left:.4rem;position:absolute;top:.4rem;z-index:1}.docs-brand{color:#5755d9;height:2rem;left:1.5rem;position:fixed;top:.85rem}.docs-brand .docs-logo{align-items:center;border-radius:.1rem;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;font-size:.7rem;height:2rem;padding:.2rem;width:auto}.docs-brand .docs-logo:focus,.docs-brand .docs-logo:hover{text-decoration:none}.docs-brand .docs-logo img{display:inline-block;height:auto;width:1.6rem}.docs-brand .docs-logo h2{display:inline-block;font-size:.8rem;font-weight:700;line-height:1.5rem;margin-bottom:0;margin-left:.5rem;margin-right:.3rem}.docs-footer{color:#bcc3ce;padding:.5rem}.docs-footer a{color:#66758c}.docs-ad{background:#f7f8f9;border-radius:.1rem;display:block;margin:2rem 0;padding:.4rem;position:relative}.docs-ad ins{line-height:1;vertical-align:middle}.docs-ad .carbon-wrap .carbon-img{display:block}.docs-ad .carbon-wrap .carbon-text{color:#66758c;display:block;font-size:.7rem}.docs-ad .carbon-poweredby{color:#bcc3ce;font-size:.7rem}.section-hero{padding:1rem .5rem}.section-hero .docs-brand{position:absolute;top:.85rem}.section-hero .docs-brand h2{color:#5755d9}.section-hero .column{padding:.4rem}.section-ads{padding:1rem .5rem}.section-updates{padding:4.5rem .5rem 2.5rem .5rem}.section-updates .card{border:0;margin-bottom:1rem}.section-features{padding:4.5rem .5rem}.section-features .column{padding:.4rem}.section-footer{color:#bcc3ce;padding:1.8rem .75rem 1rem;position:relative;z-index:200}.section-footer a{color:#66758c}.grid-hero{padding-bottom:2rem;padding-top:6rem}.grid-hero h1{color:#3b4351;font-size:1.6rem;font-weight:600;margin-bottom:1.5rem}.grid-hero h2{color:#455060;font-size:.9rem;font-weight:400;line-height:1.5rem;margin-bottom:1.5rem}.grid-hero h2 u{border-bottom:.1rem solid currentColor;padding-bottom:.05rem;text-decoration:none}.grid-hero .card{background:0 0;border:0;color:#5b687d;padding:.5rem}.grid-hero .card .card-title{color:#5755d9;font-size:1rem;font-weight:700;margin-bottom:0}@media(max-width:960px){.off-canvas .off-canvas-toggle{z-index:300}.off-canvas .off-canvas-content{width:100%}.docs-sidebar .docs-brand{margin:.85rem 1.5rem;padding:0;position:static}.docs-sidebar .docs-nav{margin-top:1rem;position:static}.docs-sidebar .menu .menu-item>a{padding:.3rem .4rem}.docs-navbar{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:rgba(247,248,249,.65);left:0}.docs-content{min-width:auto;padding:0 1.5rem;width:100%}.docs-content .s-subtitle,.docs-content .s-title{padding-top:5rem;position:static}.docs-content .s-subtitle::before,.docs-content .s-title::before{content:none}.section-hero .s-brand{height:5rem;padding:1.5rem .5rem;text-align:center;width:100%}.section-hero .s-brand .s-logo{height:auto}.section-hero .s-brand img{height:3.2rem;width:3.2rem}.section-hero .s-brand h2{display:none}}@media(max-width:600px){.grid-hero h2{font-size:.9rem}.grid-hero .card{padding:0}.off-canvas .off-canvas-toggle{left:.5rem}.docs-navbar .btns{right:.9rem}.grid-hero .docs-brand{left:.9rem}.docs-sidebar .docs-brand{margin:.85rem 1rem}.docs-sidebar .docs-nav{padding:.5rem 1rem}.docs-content{padding:0 .5rem}.docs-content .docs-block{padding:.4rem .1rem}}@media(min-width:1366px){.docs-ad.docs-ad-sidebar{bottom:1rem;margin:0;position:fixed;right:1rem;width:7.3rem}}.searchbox{box-sizing:border-box;display:inline-block;height:32px!important;position:relative;visibility:visible!important;white-space:nowrap;width:200px}.searchbox .algolia-autocomplete{display:block;height:100%;width:100%}.searchbox__wrapper{height:100%;position:relative;width:100%;z-index:999}.searchbox__input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff!important;border:0;border-radius:16px;box-shadow:inset 0 0 0 1px #ccc;box-sizing:border-box;display:inline-block;font-size:12px;height:100%;padding:0 26px 0 32px;transition:box-shadow .4s ease,background .4s ease;vertical-align:middle;white-space:normal;width:100%}.searchbox__input::-webkit-search-cancel-button,.searchbox__input::-webkit-search-decoration,.searchbox__input::-webkit-search-results-button,.searchbox__input::-webkit-search-results-decoration{display:none}.searchbox__input:hover{box-shadow:inset 0 0 0 1px #b3b3b3}.searchbox__input:active,.searchbox__input:focus{background:#fff;box-shadow:inset 0 0 0 1px #aaa;outline:0}.searchbox__input:-ms-input-placeholder{color:#aaa}.searchbox__input::-ms-input-placeholder{color:#aaa}.searchbox__input::placeholder{color:#aaa}.searchbox__submit{background-color:rgba(69,142,225,0);border:0;border-radius:16px 0 0 16px;font-size:inherit;height:100%;left:0;margin:0;padding:0;position:absolute;right:inherit;text-align:center;top:0;-webkit-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle;width:32px}.searchbox__submit:before{content:"";display:inline-block;height:100%;margin-right:-4px;vertical-align:middle}.searchbox__submit:active,.searchbox__submit:hover{cursor:pointer}.searchbox__submit:focus{outline:0}.searchbox__submit svg{fill:#6d7e96;height:14px;vertical-align:middle;width:14px}.searchbox__reset{background:0 0;border:0;cursor:pointer;display:block;fill:rgba(0,0,0,.5);font-size:inherit;margin:0;padding:0;position:absolute;right:8px;top:8px;-webkit-user-select:none;-ms-user-select:none;user-select:none}.searchbox__reset.hide{display:none}.searchbox__reset:focus{outline:0}.searchbox__reset svg{display:block;height:8px;margin:4px;width:8px}.searchbox__input:valid~.searchbox__reset{animation-duration:.15s;animation-name:sbx-reset-in;display:block}@keyframes sbx-reset-in{0%{opacity:0;transform:translate3d(-20%,0,0)}to{opacity:1;transform:none}}.algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu{left:inherit!important;right:0!important}.algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu:before{right:48px}.algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu{left:0!important;right:inherit!important}.algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu:before{left:48px}.algolia-autocomplete .ds-dropdown-menu{background:0 0;border:none;border-radius:4px;box-shadow:0 .05rem .2rem rgba(48,55,66,.3);height:auto;margin:6px 0 0;max-width:600px;min-width:500px;padding:0;position:relative;text-align:left;top:-6px;z-index:999}.algolia-autocomplete .ds-dropdown-menu .ds-suggestions{margin-top:8px;position:relative;z-index:1000}.algolia-autocomplete .ds-dropdown-menu .ds-suggestions a:hover{text-decoration:none}.algolia-autocomplete .ds-dropdown-menu .ds-suggestion{cursor:pointer}.algolia-autocomplete .ds-dropdown-menu .ds-suggestion.ds-cursor .algolia-docsearch-suggestion.suggestion-layout-simple,.algolia-autocomplete .ds-dropdown-menu .ds-suggestion.ds-cursor .algolia-docsearch-suggestion:not(.suggestion-layout-simple) .algolia-docsearch-suggestion--content{background-color:rgba(87,85,217,.05)}.algolia-autocomplete .ds-dropdown-menu [class^=ds-dataset-]{background:#fff;border-radius:4px;overflow:auto;padding:0 8px 8px;position:relative}.algolia-autocomplete .ds-dropdown-menu *{box-sizing:border-box}.algolia-autocomplete .algolia-docsearch-suggestion{background:#fff;color:#303742;display:block;overflow:hidden;padding:0 8px;position:relative}.algolia-autocomplete .algolia-docsearch-suggestion--highlight{background:rgba(87,85,217,.1);color:#5755d9;padding:.1em .05em}.algolia-autocomplete .algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--category-header-lvl0 .algolia-docsearch-suggestion--highlight,.algolia-autocomplete .algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--category-header-lvl1 .algolia-docsearch-suggestion--highlight{background:inherit;box-shadow:inset 0 -2px 0 0 rgba(87,85,217,.8);color:inherit;padding:0 0 1px}.algolia-autocomplete .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight{background:inherit;box-shadow:inset 0 -2px 0 0 rgba(87,85,217,.8);color:inherit;padding:0 0 1px}.algolia-autocomplete .algolia-docsearch-suggestion--content{cursor:pointer;display:block;float:right;padding:5.33333px 0 5.33333px 10.66667px;position:relative;width:70%}.algolia-autocomplete .algolia-docsearch-suggestion--content:before{background:#f7f8f9;content:"";display:block;height:100%;left:-1px;position:absolute;top:0;width:1px}.algolia-autocomplete .algolia-docsearch-suggestion--category-header{border-bottom:1px solid #f7f8f9;color:#303742;display:none;font-size:1em;margin-top:8px;padding:4px 0;position:relative}.algolia-autocomplete .algolia-docsearch-suggestion--wrapper{float:left;padding:8px 0 0;width:100%}.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column{color:#bcc3ce;float:left;font-size:.9em;padding:5.33333px 10.66667px;position:relative;text-align:right;width:30%;word-wrap:break-word}.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column:before{background:#f7f8f9;content:"";display:block;height:100%;position:absolute;right:0;top:0;width:1px}.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-inline{display:none}.algolia-autocomplete .algolia-docsearch-suggestion--title{color:#303742;font-size:.9em;font-weight:700}.algolia-autocomplete .algolia-docsearch-suggestion--text{color:#66758c;display:block;font-size:.85em;line-height:1.2em}.algolia-autocomplete .algolia-docsearch-suggestion--no-results{font-size:1.2em;padding:8px 0;text-align:center;width:100%}.algolia-autocomplete .algolia-docsearch-suggestion--no-results:before{display:none}.algolia-autocomplete .algolia-docsearch-suggestion code{background-color:#ebebeb;border:none;border-radius:3px;color:#222;font-family:Menlo,Monaco,Consolas,Courier New,monospace;font-size:90%;padding:1px 5px}.algolia-autocomplete .algolia-docsearch-suggestion code .algolia-docsearch-suggestion--highlight{background:0 0}.algolia-autocomplete .algolia-docsearch-suggestion.algolia-docsearch-suggestion__main .algolia-docsearch-suggestion--category-header,.algolia-autocomplete .algolia-docsearch-suggestion.algolia-docsearch-suggestion__secondary{display:block}.algolia-autocomplete .suggestion-layout-simple.algolia-docsearch-suggestion{border-bottom:1px solid #eee;margin:0;padding:8px}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--content{padding:0;width:100%}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--content:before{display:none}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header{border:none;display:block;margin:0;padding:0;width:100%}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header-lvl0{font-size:.85em;opacity:.6}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header-lvl1{font-size:.85em;opacity:.6}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header-lvl1:before{background-image:url("data:image/svg+xml;utf8,");content:"";display:inline-block;height:10px;width:10px}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--wrapper{float:left;margin:0;padding:0;width:100%}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--duplicate-content,.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--subcategory-inline{display:none!important}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--title{color:#458ee1;font-size:.9em;font-weight:400;margin:0}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--title:before{color:#458ee1;content:"#";display:inline-block;font-weight:700}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--text{background:#f8f8f8;display:block;font-size:.85em;line-height:1.4em;margin:4px 0 0;opacity:.8;padding:5.33333px 8px}.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight{box-shadow:none;color:#3f4145;font-weight:700}.algolia-autocomplete .algolia-docsearch-footer{float:right;font-size:0;height:20px;line-height:0;margin-top:10.66667px;width:134px;z-index:2000}.algolia-autocomplete .algolia-docsearch-footer--logo{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='168' height='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M78.988.938h16.594a2.968 2.968 0 0 1 2.966 2.966V20.5a2.967 2.967 0 0 1-2.966 2.964H78.988a2.967 2.967 0 0 1-2.966-2.964V3.897A2.961 2.961 0 0 1 78.988.938zm41.937 17.866c-4.386.02-4.386-3.54-4.386-4.106l-.007-13.336 2.675-.424v13.254c0 .322 0 2.358 1.718 2.364v2.248zm-10.846-2.18c.821 0 1.43-.047 1.855-.129v-2.719a6.334 6.334 0 0 0-1.574-.199 5.7 5.7 0 0 0-.897.069 2.699 2.699 0 0 0-.814.24c-.24.116-.439.28-.582.491-.15.212-.219.335-.219.656 0 .628.219.991.616 1.23s.938.362 1.615.362zm-.233-9.7c.883 0 1.629.109 2.231.328.602.218 1.088.525 1.444.915.363.396.609.922.76 1.483.157.56.232 1.175.232 1.85v6.874a32.5 32.5 0 0 1-1.868.314c-.834.123-1.772.185-2.813.185-.69 0-1.327-.069-1.895-.198a4.001 4.001 0 0 1-1.471-.636 3.085 3.085 0 0 1-.951-1.134c-.226-.465-.343-1.12-.343-1.803 0-.656.13-1.073.384-1.525a3.24 3.24 0 0 1 1.047-1.106c.445-.287.95-.492 1.532-.615a8.8 8.8 0 0 1 1.82-.185 8.404 8.404 0 0 1 1.972.24v-.438c0-.307-.035-.6-.11-.874a1.88 1.88 0 0 0-.384-.73 1.784 1.784 0 0 0-.724-.493 3.164 3.164 0 0 0-1.143-.205c-.616 0-1.177.075-1.69.164a7.735 7.735 0 0 0-1.26.307l-.321-2.192c.335-.117.834-.233 1.478-.349a10.98 10.98 0 0 1 2.073-.178zm52.842 9.626c.822 0 1.43-.048 1.854-.13V13.7a6.347 6.347 0 0 0-1.574-.199c-.294 0-.595.021-.896.069a2.7 2.7 0 0 0-.814.24 1.46 1.46 0 0 0-.582.491c-.15.212-.218.335-.218.656 0 .628.218.991.615 1.23.404.245.938.362 1.615.362zm-.226-9.694c.883 0 1.629.108 2.231.327.602.219 1.088.526 1.444.915.355.39.609.923.759 1.483a6.8 6.8 0 0 1 .233 1.852v6.873c-.41.088-1.034.19-1.868.314-.834.123-1.772.184-2.813.184-.69 0-1.327-.068-1.895-.198a4.001 4.001 0 0 1-1.471-.635 3.085 3.085 0 0 1-.951-1.134c-.226-.465-.343-1.12-.343-1.804 0-.656.13-1.073.384-1.524.26-.45.608-.82 1.047-1.107.445-.286.95-.491 1.532-.614a8.803 8.803 0 0 1 2.751-.13c.329.034.671.096 1.04.185v-.437a3.3 3.3 0 0 0-.109-.875 1.873 1.873 0 0 0-.384-.731 1.784 1.784 0 0 0-.724-.492 3.165 3.165 0 0 0-1.143-.205c-.616 0-1.177.075-1.69.164a7.75 7.75 0 0 0-1.26.307l-.321-2.193c.335-.116.834-.232 1.478-.348a11.633 11.633 0 0 1 2.073-.177zm-8.034-1.271a1.626 1.626 0 0 1-1.628-1.62c0-.895.725-1.62 1.628-1.62.904 0 1.63.725 1.63 1.62 0 .895-.733 1.62-1.63 1.62zm1.348 13.22h-2.689V7.27l2.69-.423v11.956zm-4.714 0c-4.386.02-4.386-3.54-4.386-4.107l-.008-13.336 2.676-.424v13.254c0 .322 0 2.358 1.718 2.364v2.248zm-8.698-5.903c0-1.156-.253-2.119-.746-2.788-.493-.677-1.183-1.01-2.067-1.01-.882 0-1.574.333-2.065 1.01-.493.676-.733 1.632-.733 2.788 0 1.168.246 1.953.74 2.63.492.683 1.183 1.018 2.066 1.018.882 0 1.574-.342 2.067-1.019.492-.683.738-1.46.738-2.63zm2.737-.007c0 .902-.13 1.584-.397 2.33a5.52 5.52 0 0 1-1.128 1.906 4.986 4.986 0 0 1-1.752 1.223c-.685.286-1.739.45-2.265.45-.528-.006-1.574-.157-2.252-.45a5.096 5.096 0 0 1-1.744-1.223c-.487-.527-.863-1.162-1.137-1.906a6.345 6.345 0 0 1-.41-2.33c0-.902.123-1.77.397-2.508a5.554 5.554 0 0 1 1.15-1.892 5.133 5.133 0 0 1 1.75-1.216c.679-.287 1.425-.423 2.232-.423.808 0 1.553.142 2.237.423a4.88 4.88 0 0 1 1.753 1.216 5.644 5.644 0 0 1 1.135 1.892c.287.738.431 1.606.431 2.508zm-20.138 0c0 1.12.246 2.363.738 2.882.493.52 1.13.78 1.91.78.424 0 .828-.062 1.204-.178.377-.116.677-.253.917-.417V9.33a10.476 10.476 0 0 0-1.766-.226c-.971-.028-1.71.37-2.23 1.004-.513.636-.773 1.75-.773 2.788zm7.438 5.274c0 1.824-.466 3.156-1.404 4.004-.936.846-2.367 1.27-4.296 1.27-.705 0-2.17-.137-3.34-.396l.431-2.118c.98.205 2.272.26 2.95.26 1.074 0 1.84-.219 2.299-.656.459-.437.684-1.086.684-1.948v-.437a8.07 8.07 0 0 1-1.047.397c-.43.13-.93.198-1.492.198-.739 0-1.41-.116-2.018-.349a4.206 4.206 0 0 1-1.567-1.025c-.431-.45-.774-1.017-1.013-1.694-.24-.677-.363-1.885-.363-2.773 0-.834.13-1.88.384-2.577.26-.696.629-1.298 1.129-1.796.493-.498 1.095-.881 1.8-1.162a6.605 6.605 0 0 1 2.428-.457c.87 0 1.67.109 2.45.24.78.129 1.444.265 1.985.415V18.17z' fill='%235468FF'/%3E%3Cpath d='M6.972 6.677v1.627c-.712-.446-1.52-.67-2.425-.67-.585 0-1.045.13-1.38.391a1.24 1.24 0 0 0-.502 1.03c0 .425.164.765.494 1.02.33.256.835.532 1.516.83.447.192.795.356 1.045.495.25.138.537.332.862.582.324.25.563.548.718.894.154.345.23.741.23 1.188 0 .947-.334 1.691-1.004 2.234-.67.542-1.537.814-2.601.814-1.18 0-2.16-.229-2.936-.686v-1.708c.84.628 1.814.942 2.92.942.585 0 1.048-.136 1.388-.407.34-.271.51-.646.51-1.125 0-.287-.1-.55-.302-.79-.203-.24-.42-.42-.655-.542-.234-.123-.585-.29-1.053-.503a61.27 61.27 0 0 1-.582-.271 13.67 13.67 0 0 1-.55-.287 4.275 4.275 0 0 1-.567-.351 6.92 6.92 0 0 1-.455-.4c-.18-.17-.31-.34-.39-.51-.08-.17-.155-.37-.224-.598a2.553 2.553 0 0 1-.104-.742c0-.915.333-1.638.998-2.17.664-.532 1.523-.798 2.576-.798.968 0 1.793.17 2.473.51zm7.468 5.696v-.287c-.022-.607-.187-1.088-.495-1.444-.309-.357-.75-.535-1.324-.535-.532 0-.99.194-1.373.583-.382.388-.622.949-.717 1.683h3.909zm1.005 2.792v1.404c-.596.34-1.383.51-2.362.51-1.255 0-2.255-.377-3-1.132-.744-.755-1.116-1.744-1.116-2.968 0-1.297.34-2.316 1.021-3.055.68-.74 1.548-1.11 2.6-1.11 1.033 0 1.852.323 2.458.966.606.644.91 1.572.91 2.784 0 .33-.033.676-.096 1.038h-5.314c.107.702.405 1.239.894 1.611.49.372 1.106.558 1.85.558.862 0 1.58-.202 2.155-.606zm6.605-1.77h-1.212c-.596 0-1.045.116-1.349.35-.303.234-.454.532-.454.894 0 .372.117.664.35.877.235.213.575.32 1.022.32.51 0 .912-.142 1.204-.424.293-.281.44-.651.44-1.108v-.91zm-4.068-2.554V9.325c.627-.361 1.457-.542 2.489-.542 2.116 0 3.175 1.026 3.175 3.08V17h-1.548v-.957c-.415.68-1.143 1.02-2.186 1.02-.766 0-1.38-.22-1.843-.661-.462-.442-.694-1.003-.694-1.684 0-.776.293-1.38.878-1.81.585-.431 1.404-.647 2.457-.647h1.34V11.8c0-.554-.133-.971-.399-1.253-.266-.282-.707-.423-1.324-.423a4.07 4.07 0 0 0-2.345.718zm9.333-1.93v1.42c.394-1 1.101-1.5 2.123-1.5.148 0 .313.016.494.048v1.531a1.885 1.885 0 0 0-.75-.143c-.542 0-.989.24-1.34.718-.351.479-.527 1.048-.527 1.707V17h-1.563V8.91h1.563zm5.01 4.084c.022.82.272 1.492.75 2.019.479.526 1.15.79 2.01.79.639 0 1.235-.176 1.788-.527v1.404c-.521.319-1.186.479-1.995.479-1.265 0-2.276-.4-3.031-1.197-.755-.798-1.133-1.792-1.133-2.984 0-1.16.38-2.151 1.14-2.975.761-.825 1.79-1.237 3.088-1.237.702 0 1.346.149 1.93.447v1.436a3.242 3.242 0 0 0-1.77-.495c-.84 0-1.513.266-2.019.798-.505.532-.758 1.213-.758 2.042zM40.24 5.72v4.579c.458-1 1.293-1.5 2.505-1.5.787 0 1.42.245 1.899.734.479.49.718 1.17.718 2.042V17h-1.564v-5.106c0-.553-.14-.98-.422-1.284-.282-.303-.652-.455-1.11-.455-.531 0-1.002.202-1.411.606-.41.405-.615 1.022-.615 1.851V17h-1.563V5.72h1.563zm14.966 10.02c.596 0 1.096-.253 1.5-.758.404-.506.606-1.157.606-1.955 0-.915-.202-1.62-.606-2.114-.404-.495-.92-.742-1.548-.742-.553 0-1.05.224-1.491.67-.442.447-.662 1.133-.662 2.058 0 .958.212 1.67.638 2.138.425.469.946.703 1.563.703zM53.004 5.72v4.42c.574-.894 1.388-1.341 2.44-1.341 1.022 0 1.857.383 2.506 1.149.649.766.973 1.781.973 3.047 0 1.138-.309 2.109-.925 2.912-.617.803-1.463 1.205-2.537 1.205-1.075 0-1.894-.447-2.457-1.34V17h-1.58V5.72h1.58zm9.908 11.104l-3.223-7.913h1.739l1.005 2.632 1.26 3.415c.096-.32.48-1.458 1.15-3.415l.909-2.632h1.66l-2.92 7.866c-.777 2.074-1.963 3.11-3.559 3.11a2.92 2.92 0 0 1-.734-.079v-1.34c.17.042.351.064.543.064 1.032 0 1.755-.57 2.17-1.708z' fill='%235D6494'/%3E%3Cpath d='M89.632 5.967v-.772a.978.978 0 0 0-.978-.977h-2.28a.978.978 0 0 0-.978.977v.793c0 .088.082.15.171.13a7.127 7.127 0 0 1 1.984-.28c.65 0 1.295.088 1.917.259.082.02.164-.04.164-.13m-6.248 1.01l-.39-.389a.977.977 0 0 0-1.382 0l-.465.465a.973.973 0 0 0 0 1.38l.383.383c.062.061.15.047.205-.014.226-.307.472-.601.746-.874.281-.28.568-.526.883-.751.068-.042.075-.137.02-.2m4.16 2.453v3.341c0 .096.104.165.192.117l2.97-1.537c.068-.034.089-.117.055-.184a3.695 3.695 0 0 0-3.08-1.866c-.068 0-.136.054-.136.13m0 8.048a4.489 4.489 0 0 1-4.49-4.482 4.488 4.488 0 0 1 4.49-4.482 4.488 4.488 0 0 1 4.489 4.482 4.484 4.484 0 0 1-4.49 4.482m0-10.85a6.363 6.363 0 1 0 0 12.729 6.37 6.37 0 0 0 6.372-6.368 6.358 6.358 0 0 0-6.371-6.36' fill='%23FFF'/%3E%3C/g%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:100%;display:block;height:100%;overflow:hidden;padding:0!important;text-indent:-9000px;width:100%}@media(min-width:768px){.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column{display:block}}@media(max-width:768px){.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column{color:#02060c;display:inline-block;float:left;font-size:.9em;font-weight:700;opacity:.5;padding:0;text-align:left;width:auto}.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column:before{display:none}.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column:after{content:"|"}.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--content{display:inline-block;float:left;padding:0;text-align:left;width:auto}.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--content:before{display:none}} \ No newline at end of file diff --git a/docs/dist/spectre-exp.css b/docs/dist/spectre-exp.css index 446b27758..47e307398 100644 --- a/docs/dist/spectre-exp.css +++ b/docs/dist/spectre-exp.css @@ -1,9 +1,6 @@ -/*! Spectre.css Experimentals v0.5.9 | MIT License | github.com/picturepan2/spectre */ .form-autocomplete { position: relative; -} - -.form-autocomplete .form-autocomplete-input { +}.form-autocomplete .form-autocomplete-input { align-content: flex-start; display: -ms-flexbox; display: flex; @@ -13,14 +10,10 @@ height: auto; min-height: 1.6rem; padding: .1rem; -} - -.form-autocomplete .form-autocomplete-input.is-focused { - border-color: #5755d9; - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.form-autocomplete .form-autocomplete-input .form-input { +}.form-autocomplete .form-autocomplete-input.is-focused { + border-color: #5755d9; + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.form-autocomplete .form-autocomplete-input .form-input { border-color: transparent; box-shadow: none; display: inline-block; @@ -30,34 +23,24 @@ line-height: .8rem; margin: .1rem; width: auto; -} - -.form-autocomplete .menu { +}.form-autocomplete .menu { left: 0; position: absolute; top: 100%; width: 100%; -} - -.form-autocomplete.autocomplete-oneline .form-autocomplete-input { +}.form-autocomplete.autocomplete-oneline .form-autocomplete-input { -ms-flex-wrap: nowrap; flex-wrap: nowrap; overflow-x: auto; -} - -.form-autocomplete.autocomplete-oneline .chip { +}.form-autocomplete.autocomplete-oneline .chip { -ms-flex: 1 0 auto; flex: 1 0 auto; -} - -.calendar { +}.calendar { border: .05rem solid #dadee4; border-radius: .1rem; display: block; min-width: 280px; -} - -.calendar .calendar-nav { +}.calendar .calendar-nav { align-items: center; background: #f7f8f9; border-top-left-radius: .1rem; @@ -67,9 +50,7 @@ -ms-flex-align: center; font-size: .9rem; padding: .4rem; -} - -.calendar .calendar-header, +}.calendar .calendar-header, .calendar .calendar-body { display: -ms-flexbox; display: flex; @@ -78,33 +59,23 @@ flex-wrap: wrap; justify-content: center; padding: .4rem 0; -} - -.calendar .calendar-header .calendar-date, +}.calendar .calendar-header .calendar-date, .calendar .calendar-body .calendar-date { -ms-flex: 0 0 14.28%; flex: 0 0 14.28%; max-width: 14.28%; -} - -.calendar .calendar-header { +}.calendar .calendar-header { background: #f7f8f9; border-bottom: .05rem solid #dadee4; color: #bcc3ce; font-size: .7rem; text-align: center; -} - -.calendar .calendar-body { +}.calendar .calendar-body { color: #66758c; -} - -.calendar .calendar-date { +}.calendar .calendar-date { border: 0; padding: .2rem; -} - -.calendar .calendar-date .date-item { +}.calendar .calendar-date .date-item { -webkit-appearance: none; -moz-appearance: none; appearance: none; @@ -121,64 +92,46 @@ position: relative; text-align: center; text-decoration: none; - transition: background .2s, border .2s, box-shadow .2s, color .2s; + transition: background .2s,border .2s,box-shadow .2s,color .2s; vertical-align: middle; white-space: nowrap; width: 1.4rem; -} - -.calendar .calendar-date .date-item.date-today { +}.calendar .calendar-date .date-item.date-today { border-color: #e5e5f9; color: #5755d9; -} - -.calendar .calendar-date .date-item:focus { - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.calendar .calendar-date .date-item:focus, +}.calendar .calendar-date .date-item:focus { + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.calendar .calendar-date .date-item:focus, .calendar .calendar-date .date-item:hover { background: #fefeff; border-color: #e5e5f9; color: #5755d9; text-decoration: none; -} - -.calendar .calendar-date .date-item:active, +}.calendar .calendar-date .date-item:active, .calendar .calendar-date .date-item.active { background: #4b48d6; border-color: #3634d2; color: #fff; -} - -.calendar .calendar-date .date-item.badge::after { +}.calendar .calendar-date .date-item.badge::after { position: absolute; right: 3px; top: 3px; transform: translate(50%, -50%); -} - -.calendar .calendar-date .date-item:disabled, +}.calendar .calendar-date .date-item:disabled, .calendar .calendar-date .date-item.disabled, .calendar .calendar-date .calendar-event:disabled, .calendar .calendar-date .calendar-event.disabled { cursor: default; opacity: .25; pointer-events: none; -} - -.calendar .calendar-date.prev-month .date-item, +}.calendar .calendar-date.prev-month .date-item, .calendar .calendar-date.prev-month .calendar-event, .calendar .calendar-date.next-month .date-item, .calendar .calendar-date.next-month .calendar-event { opacity: .25; -} - -.calendar .calendar-range { +}.calendar .calendar-range { position: relative; -} - -.calendar .calendar-range::before { +}.calendar .calendar-range::before { background: #f1f1fc; content: ""; height: 1.4rem; @@ -187,32 +140,20 @@ right: 0; top: 50%; transform: translateY(-50%); -} - -.calendar .calendar-range.range-start::before { +}.calendar .calendar-range.range-start::before { left: 50%; -} - -.calendar .calendar-range.range-end::before { +}.calendar .calendar-range.range-end::before { right: 50%; -} - -.calendar .calendar-range.range-start .date-item, +}.calendar .calendar-range.range-start .date-item, .calendar .calendar-range.range-end .date-item { background: #4b48d6; border-color: #3634d2; color: #fff; -} - -.calendar .calendar-range .date-item { +}.calendar .calendar-range .date-item { color: #5755d9; -} - -.calendar.calendar-lg .calendar-body { +}.calendar.calendar-lg .calendar-body { padding: 0; -} - -.calendar.calendar-lg .calendar-body .calendar-date { +}.calendar.calendar-lg .calendar-body .calendar-date { border-bottom: .05rem solid #dadee4; border-right: .05rem solid #dadee4; display: -ms-flexbox; @@ -221,46 +162,30 @@ flex-direction: column; height: 5.5rem; padding: 0; -} - -.calendar.calendar-lg .calendar-body .calendar-date:nth-child(7n) { +}.calendar.calendar-lg .calendar-body .calendar-date:nth-child(7n) { border-right: 0; -} - -.calendar.calendar-lg .calendar-body .calendar-date:nth-last-child(-n+7) { +}.calendar.calendar-lg .calendar-body .calendar-date:nth-last-child(-n+7) { border-bottom: 0; -} - -.calendar.calendar-lg .date-item { +}.calendar.calendar-lg .date-item { align-self: flex-end; -ms-flex-item-align: end; height: 1.4rem; margin-right: .2rem; margin-top: .2rem; -} - -.calendar.calendar-lg .calendar-range::before { +}.calendar.calendar-lg .calendar-range::before { top: 19px; -} - -.calendar.calendar-lg .calendar-range.range-start::before { +}.calendar.calendar-lg .calendar-range.range-start::before { left: auto; width: 19px; -} - -.calendar.calendar-lg .calendar-range.range-end::before { +}.calendar.calendar-lg .calendar-range.range-end::before { right: 19px; -} - -.calendar.calendar-lg .calendar-events { +}.calendar.calendar-lg .calendar-events { flex-grow: 1; -ms-flex-positive: 1; line-height: 1; overflow-y: auto; padding: .2rem; -} - -.calendar.calendar-lg .calendar-event { +}.calendar.calendar-lg .calendar-event { border-radius: .1rem; display: block; font-size: .7rem; @@ -269,33 +194,27 @@ padding: 3px 4px; text-overflow: ellipsis; white-space: nowrap; -} - -.carousel .carousel-locator:nth-of-type(1):checked ~ .carousel-container .carousel-item:nth-of-type(1), -.carousel .carousel-locator:nth-of-type(2):checked ~ .carousel-container .carousel-item:nth-of-type(2), -.carousel .carousel-locator:nth-of-type(3):checked ~ .carousel-container .carousel-item:nth-of-type(3), -.carousel .carousel-locator:nth-of-type(4):checked ~ .carousel-container .carousel-item:nth-of-type(4), -.carousel .carousel-locator:nth-of-type(5):checked ~ .carousel-container .carousel-item:nth-of-type(5), -.carousel .carousel-locator:nth-of-type(6):checked ~ .carousel-container .carousel-item:nth-of-type(6), +}.carousel .carousel-locator:nth-of-type(8):checked ~ .carousel-container .carousel-item:nth-of-type(8), .carousel .carousel-locator:nth-of-type(7):checked ~ .carousel-container .carousel-item:nth-of-type(7), -.carousel .carousel-locator:nth-of-type(8):checked ~ .carousel-container .carousel-item:nth-of-type(8) { +.carousel .carousel-locator:nth-of-type(6):checked ~ .carousel-container .carousel-item:nth-of-type(6), +.carousel .carousel-locator:nth-of-type(5):checked ~ .carousel-container .carousel-item:nth-of-type(5), +.carousel .carousel-locator:nth-of-type(4):checked ~ .carousel-container .carousel-item:nth-of-type(4), +.carousel .carousel-locator:nth-of-type(3):checked ~ .carousel-container .carousel-item:nth-of-type(3), +.carousel .carousel-locator:nth-of-type(2):checked ~ .carousel-container .carousel-item:nth-of-type(2), +.carousel .carousel-locator:nth-of-type(1):checked ~ .carousel-container .carousel-item:nth-of-type(1) { animation: carousel-slidein .75s ease-in-out 1; opacity: 1; z-index: 100; -} - -.carousel .carousel-locator:nth-of-type(1):checked ~ .carousel-nav .nav-item:nth-of-type(1), -.carousel .carousel-locator:nth-of-type(2):checked ~ .carousel-nav .nav-item:nth-of-type(2), -.carousel .carousel-locator:nth-of-type(3):checked ~ .carousel-nav .nav-item:nth-of-type(3), -.carousel .carousel-locator:nth-of-type(4):checked ~ .carousel-nav .nav-item:nth-of-type(4), -.carousel .carousel-locator:nth-of-type(5):checked ~ .carousel-nav .nav-item:nth-of-type(5), -.carousel .carousel-locator:nth-of-type(6):checked ~ .carousel-nav .nav-item:nth-of-type(6), +}.carousel .carousel-locator:nth-of-type(8):checked ~ .carousel-nav .nav-item:nth-of-type(8), .carousel .carousel-locator:nth-of-type(7):checked ~ .carousel-nav .nav-item:nth-of-type(7), -.carousel .carousel-locator:nth-of-type(8):checked ~ .carousel-nav .nav-item:nth-of-type(8) { +.carousel .carousel-locator:nth-of-type(6):checked ~ .carousel-nav .nav-item:nth-of-type(6), +.carousel .carousel-locator:nth-of-type(5):checked ~ .carousel-nav .nav-item:nth-of-type(5), +.carousel .carousel-locator:nth-of-type(4):checked ~ .carousel-nav .nav-item:nth-of-type(4), +.carousel .carousel-locator:nth-of-type(3):checked ~ .carousel-nav .nav-item:nth-of-type(3), +.carousel .carousel-locator:nth-of-type(2):checked ~ .carousel-nav .nav-item:nth-of-type(2), +.carousel .carousel-locator:nth-of-type(1):checked ~ .carousel-nav .nav-item:nth-of-type(1) { color: #f7f8f9; -} - -.carousel { +}.carousel { background: #f7f8f9; display: block; overflow: hidden; @@ -303,21 +222,15 @@ position: relative; width: 100%; z-index: 1; -} - -.carousel .carousel-container { +}.carousel .carousel-container { height: 100%; left: 0; position: relative; -} - -.carousel .carousel-container::before { +}.carousel .carousel-container::before { content: ""; display: block; padding-bottom: 56.25%; -} - -.carousel .carousel-container .carousel-item { +}.carousel .carousel-container .carousel-item { animation: carousel-slideout 1s ease-in-out 1; height: 100%; left: 0; @@ -326,17 +239,13 @@ position: absolute; top: 0; width: 100%; -} - -.carousel .carousel-container .carousel-item:hover .item-prev, +}.carousel .carousel-container .carousel-item:hover .item-prev, .carousel .carousel-container .carousel-item:hover .item-next { opacity: 1; -} - -.carousel .carousel-container .item-prev, +}.carousel .carousel-container .item-prev, .carousel .carousel-container .item-next { - background: rgba(247, 248, 249, .25); - border-color: rgba(247, 248, 249, .5); + background: rgba(247,248,249,.25); + border-color: rgba(247,248,249,.5); color: #f7f8f9; opacity: 0; position: absolute; @@ -344,17 +253,11 @@ transform: translateY(-50%); transition: all .4s; z-index: 100; -} - -.carousel .carousel-container .item-prev { +}.carousel .carousel-container .item-prev { left: 1rem; -} - -.carousel .carousel-container .item-next { +}.carousel .carousel-container .item-next { right: 1rem; -} - -.carousel .carousel-nav { +}.carousel .carousel-nav { bottom: .4rem; display: -ms-flexbox; display: flex; @@ -365,10 +268,8 @@ transform: translateX(-50%); width: 10rem; z-index: 100; -} - -.carousel .carousel-nav .nav-item { - color: rgba(247, 248, 249, .5); +}.carousel .carousel-nav .nav-item { + color: rgba(247,248,249,.5); display: block; -ms-flex: 1 0 auto; flex: 1 0 auto; @@ -376,9 +277,7 @@ margin: .2rem; max-width: 2.5rem; position: relative; -} - -.carousel .carousel-nav .nav-item::before { +}.carousel .carousel-nav .nav-item::before { background: currentColor; content: ""; display: block; @@ -386,37 +285,27 @@ position: absolute; top: .5rem; width: 100%; -} - -@keyframes carousel-slidein { +}@keyframes carousel-slidein { 0% { transform: translateX(100%); - } - 100% { + }100% { transform: translateX(0); } -} - -@keyframes carousel-slideout { +}@keyframes carousel-slideout { 0% { opacity: 1; transform: translateX(0); - } - 100% { + }100% { opacity: 1; transform: translateX(-50%); } -} - -.comparison-slider { +}.comparison-slider { height: 50vh; overflow: hidden; - -webkit-overflow-scrolling: touch; + -webkit-overflow-scrolling: touch; position: relative; width: 100%; -} - -.comparison-slider .comparison-before, +}.comparison-slider .comparison-before, .comparison-slider .comparison-after { height: 100%; left: 0; @@ -424,33 +313,23 @@ overflow: hidden; position: absolute; top: 0; -} - -.comparison-slider .comparison-before img, +}.comparison-slider .comparison-before img, .comparison-slider .comparison-after img { height: 100%; object-fit: cover; object-position: left center; position: absolute; width: 100%; -} - -.comparison-slider .comparison-before { +}.comparison-slider .comparison-before { width: 100%; z-index: 1; -} - -.comparison-slider .comparison-before .comparison-label { +}.comparison-slider .comparison-before .comparison-label { right: .8rem; -} - -.comparison-slider .comparison-after { +}.comparison-slider .comparison-after { max-width: 100%; min-width: 0; z-index: 2; -} - -.comparison-slider .comparison-after::before { +}.comparison-slider .comparison-after::before { background: transparent; content: ""; cursor: default; @@ -460,12 +339,10 @@ right: .8rem; top: 0; z-index: 1; -} - -.comparison-slider .comparison-after::after { +}.comparison-slider .comparison-after::after { background: currentColor; border-radius: 50%; - box-shadow: 0 -5px, 0 5px; + box-shadow: 0 -5px,0 5px; color: #fff; content: ""; height: 3px; @@ -475,13 +352,9 @@ top: 50%; transform: translate(50%, -50%); width: 3px; -} - -.comparison-slider .comparison-after .comparison-label { +}.comparison-slider .comparison-after .comparison-label { left: .8rem; -} - -.comparison-slider .comparison-resizer { +}.comparison-slider .comparison-resizer { animation: first-run 1.5s 1 ease-in-out; cursor: ew-resize; height: .8rem; @@ -495,74 +368,55 @@ top: 50%; transform: translateY(-50%) scaleY(30); width: 0; -} - -.comparison-slider .comparison-label { - background: rgba(48, 55, 66, .5); +}.comparison-slider .comparison-label { + background: rgba(48,55,66,.5); bottom: .8rem; color: #fff; padding: .2rem .4rem; position: absolute; -webkit-user-select: none; - -moz-user-select: none; -ms-user-select: none; user-select: none; -} - -@keyframes first-run { +}@keyframes first-run { 0% { width: 0; - } - 25% { + }25% { width: 2.4rem; - } - 50% { + }50% { width: .8rem; - } - 75% { + }75% { width: 1.2rem; - } - 100% { + }100% { width: 0; } -} - -.filter .filter-tag#tag-0:checked ~ .filter-nav .chip[for="tag-0"], -.filter .filter-tag#tag-1:checked ~ .filter-nav .chip[for="tag-1"], -.filter .filter-tag#tag-2:checked ~ .filter-nav .chip[for="tag-2"], -.filter .filter-tag#tag-3:checked ~ .filter-nav .chip[for="tag-3"], -.filter .filter-tag#tag-4:checked ~ .filter-nav .chip[for="tag-4"], -.filter .filter-tag#tag-5:checked ~ .filter-nav .chip[for="tag-5"], -.filter .filter-tag#tag-6:checked ~ .filter-nav .chip[for="tag-6"], -.filter .filter-tag#tag-7:checked ~ .filter-nav .chip[for="tag-7"], -.filter .filter-tag#tag-8:checked ~ .filter-nav .chip[for="tag-8"] { +}.filter .filter-tag#tag-8:checked ~ .filter-nav .chip[for=tag-8], +.filter .filter-tag#tag-7:checked ~ .filter-nav .chip[for=tag-7], +.filter .filter-tag#tag-6:checked ~ .filter-nav .chip[for=tag-6], +.filter .filter-tag#tag-5:checked ~ .filter-nav .chip[for=tag-5], +.filter .filter-tag#tag-4:checked ~ .filter-nav .chip[for=tag-4], +.filter .filter-tag#tag-3:checked ~ .filter-nav .chip[for=tag-3], +.filter .filter-tag#tag-2:checked ~ .filter-nav .chip[for=tag-2], +.filter .filter-tag#tag-1:checked ~ .filter-nav .chip[for=tag-1], +.filter .filter-tag#tag-0:checked ~ .filter-nav .chip[for=tag-0] { background: #5755d9; color: #fff; -} - -.filter .filter-tag#tag-1:checked ~ .filter-body .filter-item:not([data-tag~="tag-1"]), -.filter .filter-tag#tag-2:checked ~ .filter-body .filter-item:not([data-tag~="tag-2"]), -.filter .filter-tag#tag-3:checked ~ .filter-body .filter-item:not([data-tag~="tag-3"]), -.filter .filter-tag#tag-4:checked ~ .filter-body .filter-item:not([data-tag~="tag-4"]), -.filter .filter-tag#tag-5:checked ~ .filter-body .filter-item:not([data-tag~="tag-5"]), -.filter .filter-tag#tag-6:checked ~ .filter-body .filter-item:not([data-tag~="tag-6"]), -.filter .filter-tag#tag-7:checked ~ .filter-body .filter-item:not([data-tag~="tag-7"]), -.filter .filter-tag#tag-8:checked ~ .filter-body .filter-item:not([data-tag~="tag-8"]) { +}.filter .filter-tag#tag-8:checked ~ .filter-body .filter-item:not([data-tag~=tag-8]), +.filter .filter-tag#tag-7:checked ~ .filter-body .filter-item:not([data-tag~=tag-7]), +.filter .filter-tag#tag-6:checked ~ .filter-body .filter-item:not([data-tag~=tag-6]), +.filter .filter-tag#tag-5:checked ~ .filter-body .filter-item:not([data-tag~=tag-5]), +.filter .filter-tag#tag-4:checked ~ .filter-body .filter-item:not([data-tag~=tag-4]), +.filter .filter-tag#tag-3:checked ~ .filter-body .filter-item:not([data-tag~=tag-3]), +.filter .filter-tag#tag-2:checked ~ .filter-body .filter-item:not([data-tag~=tag-2]), +.filter .filter-tag#tag-1:checked ~ .filter-body .filter-item:not([data-tag~=tag-1]) { display: none; -} - -.filter .filter-nav { +}.filter .filter-nav { margin: .4rem 0; -} - -.filter .filter-body { +}.filter .filter-body { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -} - -.meter { +}.meter { -webkit-appearance: none; -moz-appearance: none; appearance: none; @@ -570,57 +424,35 @@ border: 0; border-radius: .1rem; display: block; - height: .8rem; + height: .8rem; width: 100%; -} - -.meter::-webkit-meter-inner-element { +}.meter::-webkit-meter-inner-element { display: block; -} - -.meter::-webkit-meter-bar, +}.meter::-webkit-meter-bar, .meter::-webkit-meter-optimum-value, .meter::-webkit-meter-suboptimum-value, .meter::-webkit-meter-even-less-good-value { border-radius: .1rem; -} - -.meter::-webkit-meter-bar { +}.meter::-webkit-meter-bar { background: #f7f8f9; -} - -.meter::-webkit-meter-optimum-value { +}.meter::-webkit-meter-optimum-value { background: #32b643; -} - -.meter::-webkit-meter-suboptimum-value { +}.meter::-webkit-meter-suboptimum-value { background: #ffb700; -} - -.meter::-webkit-meter-even-less-good-value { +}.meter::-webkit-meter-even-less-good-value { background: #e85600; -} - -.meter::-moz-meter-bar, +}.meter::-moz-meter-bar, .meter:-moz-meter-optimum, .meter:-moz-meter-sub-optimum, .meter:-moz-meter-sub-sub-optimum { border-radius: .1rem; -} - -.meter:-moz-meter-optimum::-moz-meter-bar { +}.meter:-moz-meter-optimum::-moz-meter-bar { background: #32b643; -} - -.meter:-moz-meter-sub-optimum::-moz-meter-bar { +}.meter:-moz-meter-sub-optimum::-moz-meter-bar { background: #ffb700; -} - -.meter:-moz-meter-sub-sub-optimum::-moz-meter-bar { +}.meter:-moz-meter-sub-sub-optimum::-moz-meter-bar { background: #e85600; -} - -.off-canvas { +}.off-canvas { display: -ms-flexbox; display: flex; -ms-flex-flow: nowrap; @@ -628,18 +460,14 @@ height: 100%; position: relative; width: 100%; -} - -.off-canvas .off-canvas-toggle { +}.off-canvas .off-canvas-toggle { display: block; - left: .4rem; + left: .4rem; position: absolute; top: .4rem; transition: none; z-index: 1; -} - -.off-canvas .off-canvas-sidebar { +}.off-canvas .off-canvas-sidebar { background: #f7f8f9; bottom: 0; left: 0; @@ -647,20 +475,16 @@ overflow-y: auto; position: fixed; top: 0; - transform: translateX(-100%); + transform: translateX(-100%); transition: transform .25s; z-index: 200; -} - -.off-canvas .off-canvas-content { +}.off-canvas .off-canvas-content { -ms-flex: 1 1 auto; flex: 1 1 auto; height: 100%; padding: .4rem .4rem .4rem 4rem; -} - -.off-canvas .off-canvas-overlay { - background: rgba(48, 55, 66, .1); +}.off-canvas .off-canvas-overlay { + background: rgba(48,55,66,.1); border-color: transparent; border-radius: 0; bottom: 0; @@ -671,51 +495,37 @@ right: 0; top: 0; width: 100%; -} - -.off-canvas .off-canvas-sidebar:target, +}.off-canvas .off-canvas-sidebar:target, .off-canvas .off-canvas-sidebar.active { transform: translateX(0); -} - -.off-canvas .off-canvas-sidebar:target ~ .off-canvas-overlay, +}.off-canvas .off-canvas-sidebar:target ~ .off-canvas-overlay, .off-canvas .off-canvas-sidebar.active ~ .off-canvas-overlay { display: block; z-index: 100; -} - -@media (min-width: 960px) { +}@media(min-width: 960px) { .off-canvas.off-canvas-sidebar-show .off-canvas-toggle { display: none; - } - .off-canvas.off-canvas-sidebar-show .off-canvas-sidebar { + }.off-canvas.off-canvas-sidebar-show .off-canvas-sidebar { -ms-flex: 0 0 auto; flex: 0 0 auto; position: relative; transform: none; - } - .off-canvas.off-canvas-sidebar-show .off-canvas-overlay { + }.off-canvas.off-canvas-sidebar-show .off-canvas-overlay { display: none !important; } -} - -.parallax { +}.parallax { display: block; height: auto; position: relative; width: auto; -} - -.parallax .parallax-content { - box-shadow: 0 1rem 2.1rem rgba(48, 55, 66, .3); +}.parallax .parallax-content { + box-shadow: 0 1rem 2.1rem rgba(48,55,66,.3); height: auto; transform: perspective(1000px); transform-style: preserve-3d; transition: all .4s ease; width: 100%; -} - -.parallax .parallax-content::before { +}.parallax .parallax-content::before { content: ""; display: block; height: 100%; @@ -723,9 +533,7 @@ position: absolute; top: 0; width: 100%; -} - -.parallax .parallax-front { +}.parallax .parallax-front { align-items: center; color: #fff; display: -ms-flexbox; @@ -737,115 +545,81 @@ left: 0; position: absolute; text-align: center; - text-shadow: 0 0 20px rgba(48, 55, 66, .75); + text-shadow: 0 0 20px rgba(48,55,66,.75); top: 0; transform: translateZ(50px) scale(.95); transition: transform .4s; width: 100%; z-index: 1; -} - -.parallax .parallax-top-left { +}.parallax .parallax-top-left { height: 50%; left: 0; outline: none; position: absolute; - top: 0; + top: 0; width: 50%; z-index: 100; -} - -.parallax .parallax-top-left:focus ~ .parallax-content, +}.parallax .parallax-top-left:focus ~ .parallax-content, .parallax .parallax-top-left:hover ~ .parallax-content { transform: perspective(1000px) rotateX(3deg) rotateY(-3deg); -} - -.parallax .parallax-top-left:focus ~ .parallax-content::before, +}.parallax .parallax-top-left:focus ~ .parallax-content::before, .parallax .parallax-top-left:hover ~ .parallax-content::before { background: linear-gradient(135deg, rgba(255, 255, 255, .35) 0%, transparent 50%); -} - -.parallax .parallax-top-left:focus ~ .parallax-content .parallax-front, +}.parallax .parallax-top-left:focus ~ .parallax-content .parallax-front, .parallax .parallax-top-left:hover ~ .parallax-content .parallax-front { transform: translate3d(4.5px, 4.5px, 50px) scale(.95); -} - -.parallax .parallax-top-right { +}.parallax .parallax-top-right { height: 50%; outline: none; position: absolute; right: 0; - top: 0; + top: 0; width: 50%; z-index: 100; -} - -.parallax .parallax-top-right:focus ~ .parallax-content, +}.parallax .parallax-top-right:focus ~ .parallax-content, .parallax .parallax-top-right:hover ~ .parallax-content { transform: perspective(1000px) rotateX(3deg) rotateY(3deg); -} - -.parallax .parallax-top-right:focus ~ .parallax-content::before, +}.parallax .parallax-top-right:focus ~ .parallax-content::before, .parallax .parallax-top-right:hover ~ .parallax-content::before { background: linear-gradient(-135deg, rgba(255, 255, 255, .35) 0%, transparent 50%); -} - -.parallax .parallax-top-right:focus ~ .parallax-content .parallax-front, +}.parallax .parallax-top-right:focus ~ .parallax-content .parallax-front, .parallax .parallax-top-right:hover ~ .parallax-content .parallax-front { transform: translate3d(-4.5px, 4.5px, 50px) scale(.95); -} - -.parallax .parallax-bottom-left { +}.parallax .parallax-bottom-left { bottom: 0; height: 50%; - left: 0; + left: 0; outline: none; position: absolute; width: 50%; z-index: 100; -} - -.parallax .parallax-bottom-left:focus ~ .parallax-content, +}.parallax .parallax-bottom-left:focus ~ .parallax-content, .parallax .parallax-bottom-left:hover ~ .parallax-content { transform: perspective(1000px) rotateX(-3deg) rotateY(-3deg); -} - -.parallax .parallax-bottom-left:focus ~ .parallax-content::before, +}.parallax .parallax-bottom-left:focus ~ .parallax-content::before, .parallax .parallax-bottom-left:hover ~ .parallax-content::before { background: linear-gradient(45deg, rgba(255, 255, 255, .35) 0%, transparent 50%); -} - -.parallax .parallax-bottom-left:focus ~ .parallax-content .parallax-front, +}.parallax .parallax-bottom-left:focus ~ .parallax-content .parallax-front, .parallax .parallax-bottom-left:hover ~ .parallax-content .parallax-front { transform: translate3d(4.5px, -4.5px, 50px) scale(.95); -} - -.parallax .parallax-bottom-right { +}.parallax .parallax-bottom-right { bottom: 0; height: 50%; outline: none; position: absolute; - right: 0; + right: 0; width: 50%; z-index: 100; -} - -.parallax .parallax-bottom-right:focus ~ .parallax-content, +}.parallax .parallax-bottom-right:focus ~ .parallax-content, .parallax .parallax-bottom-right:hover ~ .parallax-content { transform: perspective(1000px) rotateX(-3deg) rotateY(3deg); -} - -.parallax .parallax-bottom-right:focus ~ .parallax-content::before, +}.parallax .parallax-bottom-right:focus ~ .parallax-content::before, .parallax .parallax-bottom-right:hover ~ .parallax-content::before { background: linear-gradient(-45deg, rgba(255, 255, 255, .35) 0%, transparent 50%); -} - -.parallax .parallax-bottom-right:focus ~ .parallax-content .parallax-front, +}.parallax .parallax-bottom-right:focus ~ .parallax-content .parallax-front, .parallax .parallax-bottom-right:hover ~ .parallax-content .parallax-front { transform: translate3d(-4.5px, -4.5px, 50px) scale(.95); -} - -.progress { +}.progress { -webkit-appearance: none; -moz-appearance: none; appearance: none; @@ -856,61 +630,40 @@ height: .2rem; position: relative; width: 100%; -} - -.progress::-webkit-progress-bar { +}.progress::-webkit-progress-bar { background: transparent; border-radius: .1rem; -} - -.progress::-webkit-progress-value { +}.progress::-webkit-progress-value { background: #5755d9; border-radius: .1rem; -} - -.progress::-moz-progress-bar { +}.progress::-moz-progress-bar { background: #5755d9; border-radius: .1rem; -} - -.progress:indeterminate { +}.progress:indeterminate { animation: progress-indeterminate 1.5s linear infinite; background: #eef0f3 linear-gradient(to right, #5755d9 30%, #eef0f3 30%) top left/150% 150% no-repeat; -} - -.progress:indeterminate::-moz-progress-bar { +}.progress:indeterminate::-moz-progress-bar { background: transparent; -} - -@keyframes progress-indeterminate { +}@keyframes progress-indeterminate { 0% { background-position: 200% 0; - } - 100% { + }100% { background-position: -200% 0; } -} - -.slider { +}.slider { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: transparent; display: block; - height: 1.2rem; + height: 1.2rem; width: 100%; -} - -.slider:focus { - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); +}.slider:focus { + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); outline: none; -} - -.slider.tooltip:not([data-tooltip])::after { +}.slider.tooltip:not([data-tooltip])::after { content: attr(value); -} - -.slider::-webkit-slider-thumb { +}.slider::-webkit-slider-thumb { -webkit-appearance: none; background: #5755d9; border: 0; @@ -920,9 +673,7 @@ -webkit-transition: transform .2s; transition: transform .2s; width: .6rem; -} - -.slider::-moz-range-thumb { +}.slider::-moz-range-thumb { background: #5755d9; border: 0; border-radius: 50%; @@ -930,9 +681,7 @@ -moz-transition: transform .2s; transition: transform .2s; width: .6rem; -} - -.slider::-ms-thumb { +}.slider::-ms-thumb { background: #5755d9; border: 0; border-radius: 50%; @@ -940,71 +689,47 @@ -ms-transition: transform .2s; transition: transform .2s; width: .6rem; -} - -.slider:active::-webkit-slider-thumb { +}.slider:active::-webkit-slider-thumb { transform: scale(1.25); -} - -.slider:active::-moz-range-thumb { +}.slider:active::-moz-range-thumb { transform: scale(1.25); -} - -.slider:active::-ms-thumb { +}.slider:active::-ms-thumb { transform: scale(1.25); -} - -.slider:disabled::-webkit-slider-thumb, +}.slider:disabled::-webkit-slider-thumb, .slider.disabled::-webkit-slider-thumb { background: #f7f8f9; transform: scale(1); -} - -.slider:disabled::-moz-range-thumb, +}.slider:disabled::-moz-range-thumb, .slider.disabled::-moz-range-thumb { background: #f7f8f9; transform: scale(1); -} - -.slider:disabled::-ms-thumb, +}.slider:disabled::-ms-thumb, .slider.disabled::-ms-thumb { background: #f7f8f9; transform: scale(1); -} - -.slider::-webkit-slider-runnable-track { +}.slider::-webkit-slider-runnable-track { background: #eef0f3; border-radius: .1rem; height: .1rem; width: 100%; -} - -.slider::-moz-range-track { +}.slider::-moz-range-track { background: #eef0f3; border-radius: .1rem; height: .1rem; width: 100%; -} - -.slider::-ms-track { +}.slider::-ms-track { background: #eef0f3; border-radius: .1rem; height: .1rem; width: 100%; -} - -.slider::-ms-fill-lower { +}.slider::-ms-fill-lower { background: #5755d9; -} - -.timeline .timeline-item { +}.timeline .timeline-item { display: -ms-flexbox; display: flex; margin-bottom: 1.2rem; position: relative; -} - -.timeline .timeline-item::before { +}.timeline .timeline-item::before { background: #dadee4; content: ""; height: 100%; @@ -1012,20 +737,14 @@ position: absolute; top: 1.2rem; width: 2px; -} - -.timeline .timeline-item .timeline-left { +}.timeline .timeline-item .timeline-left { -ms-flex: 0 0 auto; flex: 0 0 auto; -} - -.timeline .timeline-item .timeline-content { +}.timeline .timeline-item .timeline-content { -ms-flex: 1 1 auto; flex: 1 1 auto; padding: 2px 0 2px .8rem; -} - -.timeline .timeline-item .timeline-icon { +}.timeline .timeline-item .timeline-icon { align-items: center; border-radius: 50%; color: #fff; @@ -1037,9 +756,7 @@ justify-content: center; text-align: center; width: 1.2rem; -} - -.timeline .timeline-item .timeline-icon::before { +}.timeline .timeline-item .timeline-icon::before { border: .1rem solid #5755d9; border-radius: 50%; content: ""; @@ -1049,183 +766,101 @@ position: absolute; top: .4rem; width: .4rem; -} - -.timeline .timeline-item .timeline-icon.icon-lg { +}.timeline .timeline-item .timeline-icon.icon-lg { background: #5755d9; line-height: 1.2rem; -} - -.timeline .timeline-item .timeline-icon.icon-lg::before { +}.timeline .timeline-item .timeline-icon.icon-lg::before { content: none; -} - -.viewer-360 { +}.viewer-360 { align-items: center; display: -ms-flexbox; display: flex; -ms-flex-align: center; -ms-flex-direction: column; flex-direction: column; -} - -.viewer-360 .viewer-slider[max="36"][value="1"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="1"] + .viewer-image { background-position-y: 0; -} - -.viewer-360 .viewer-slider[max="36"][value="2"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="2"] + .viewer-image { background-position-y: 2.8571428571%; -} - -.viewer-360 .viewer-slider[max="36"][value="3"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="3"] + .viewer-image { background-position-y: 5.7142857143%; -} - -.viewer-360 .viewer-slider[max="36"][value="4"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="4"] + .viewer-image { background-position-y: 8.5714285714%; -} - -.viewer-360 .viewer-slider[max="36"][value="5"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="5"] + .viewer-image { background-position-y: 11.4285714286%; -} - -.viewer-360 .viewer-slider[max="36"][value="6"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="6"] + .viewer-image { background-position-y: 14.2857142857%; -} - -.viewer-360 .viewer-slider[max="36"][value="7"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="7"] + .viewer-image { background-position-y: 17.1428571429%; -} - -.viewer-360 .viewer-slider[max="36"][value="8"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="8"] + .viewer-image { background-position-y: 20%; -} - -.viewer-360 .viewer-slider[max="36"][value="9"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="9"] + .viewer-image { background-position-y: 22.8571428571%; -} - -.viewer-360 .viewer-slider[max="36"][value="10"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="10"] + .viewer-image { background-position-y: 25.7142857143%; -} - -.viewer-360 .viewer-slider[max="36"][value="11"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="11"] + .viewer-image { background-position-y: 28.5714285714%; -} - -.viewer-360 .viewer-slider[max="36"][value="12"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="12"] + .viewer-image { background-position-y: 31.4285714286%; -} - -.viewer-360 .viewer-slider[max="36"][value="13"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="13"] + .viewer-image { background-position-y: 34.2857142857%; -} - -.viewer-360 .viewer-slider[max="36"][value="14"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="14"] + .viewer-image { background-position-y: 37.1428571429%; -} - -.viewer-360 .viewer-slider[max="36"][value="15"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="15"] + .viewer-image { background-position-y: 40%; -} - -.viewer-360 .viewer-slider[max="36"][value="16"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="16"] + .viewer-image { background-position-y: 42.8571428571%; -} - -.viewer-360 .viewer-slider[max="36"][value="17"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="17"] + .viewer-image { background-position-y: 45.7142857143%; -} - -.viewer-360 .viewer-slider[max="36"][value="18"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="18"] + .viewer-image { background-position-y: 48.5714285714%; -} - -.viewer-360 .viewer-slider[max="36"][value="19"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="19"] + .viewer-image { background-position-y: 51.4285714286%; -} - -.viewer-360 .viewer-slider[max="36"][value="20"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="20"] + .viewer-image { background-position-y: 54.2857142857%; -} - -.viewer-360 .viewer-slider[max="36"][value="21"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="21"] + .viewer-image { background-position-y: 57.1428571429%; -} - -.viewer-360 .viewer-slider[max="36"][value="22"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="22"] + .viewer-image { background-position-y: 60%; -} - -.viewer-360 .viewer-slider[max="36"][value="23"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="23"] + .viewer-image { background-position-y: 62.8571428571%; -} - -.viewer-360 .viewer-slider[max="36"][value="24"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="24"] + .viewer-image { background-position-y: 65.7142857143%; -} - -.viewer-360 .viewer-slider[max="36"][value="25"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="25"] + .viewer-image { background-position-y: 68.5714285714%; -} - -.viewer-360 .viewer-slider[max="36"][value="26"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="26"] + .viewer-image { background-position-y: 71.4285714286%; -} - -.viewer-360 .viewer-slider[max="36"][value="27"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="27"] + .viewer-image { background-position-y: 74.2857142857%; -} - -.viewer-360 .viewer-slider[max="36"][value="28"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="28"] + .viewer-image { background-position-y: 77.1428571429%; -} - -.viewer-360 .viewer-slider[max="36"][value="29"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="29"] + .viewer-image { background-position-y: 80%; -} - -.viewer-360 .viewer-slider[max="36"][value="30"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="30"] + .viewer-image { background-position-y: 82.8571428571%; -} - -.viewer-360 .viewer-slider[max="36"][value="31"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="31"] + .viewer-image { background-position-y: 85.7142857143%; -} - -.viewer-360 .viewer-slider[max="36"][value="32"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="32"] + .viewer-image { background-position-y: 88.5714285714%; -} - -.viewer-360 .viewer-slider[max="36"][value="33"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="33"] + .viewer-image { background-position-y: 91.4285714286%; -} - -.viewer-360 .viewer-slider[max="36"][value="34"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="34"] + .viewer-image { background-position-y: 94.2857142857%; -} - -.viewer-360 .viewer-slider[max="36"][value="35"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="35"] + .viewer-image { background-position-y: 97.1428571429%; -} - -.viewer-360 .viewer-slider[max="36"][value="36"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="36"] + .viewer-image { background-position-y: 100%; -} - -.viewer-360 .viewer-slider { +}.viewer-360 .viewer-slider { cursor: ew-resize; -ms-flex-order: 2; margin: 1rem; order: 2; width: 60%; -} - -.viewer-360 .viewer-image { +}.viewer-360 .viewer-image { background-position-y: 0; background-repeat: no-repeat; background-size: 100%; -ms-flex-order: 1; max-width: 100%; order: 1; -} \ No newline at end of file +}/*! Spectre.css Experimentals v0.5.9 | MIT License | github.com/picturepan2/spectre */ \ No newline at end of file diff --git a/docs/dist/spectre-exp.min.css b/docs/dist/spectre-exp.min.css index d3137743a..59e0fb45d 100644 --- a/docs/dist/spectre-exp.min.css +++ b/docs/dist/spectre-exp.min.css @@ -1 +1 @@ -/*! Spectre.css Experimentals v0.5.9 | MIT License | github.com/picturepan2/spectre */.form-autocomplete{position:relative}.form-autocomplete .form-autocomplete-input{align-content:flex-start;display:-ms-flexbox;display:flex;-ms-flex-line-pack:start;-ms-flex-wrap:wrap;flex-wrap:wrap;height:auto;min-height:1.6rem;padding:.1rem}.form-autocomplete .form-autocomplete-input.is-focused{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-autocomplete .form-autocomplete-input .form-input{border-color:transparent;box-shadow:none;display:inline-block;-ms-flex:1 0 auto;flex:1 0 auto;height:1.2rem;line-height:.8rem;margin:.1rem;width:auto}.form-autocomplete .menu{left:0;position:absolute;top:100%;width:100%}.form-autocomplete.autocomplete-oneline .form-autocomplete-input{-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto}.form-autocomplete.autocomplete-oneline .chip{-ms-flex:1 0 auto;flex:1 0 auto}.calendar{border:.05rem solid #dadee4;border-radius:.1rem;display:block;min-width:280px}.calendar .calendar-nav{align-items:center;background:#f7f8f9;border-top-left-radius:.1rem;border-top-right-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-align:center;font-size:.9rem;padding:.4rem}.calendar .calendar-body,.calendar .calendar-header{display:-ms-flexbox;display:flex;-ms-flex-pack:center;-ms-flex-wrap:wrap;flex-wrap:wrap;justify-content:center;padding:.4rem 0}.calendar .calendar-body .calendar-date,.calendar .calendar-header .calendar-date{-ms-flex:0 0 14.28%;flex:0 0 14.28%;max-width:14.28%}.calendar .calendar-header{background:#f7f8f9;border-bottom:.05rem solid #dadee4;color:#bcc3ce;font-size:.7rem;text-align:center}.calendar .calendar-body{color:#66758c}.calendar .calendar-date{border:0;padding:.2rem}.calendar .calendar-date .date-item{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:.05rem solid transparent;border-radius:50%;color:#66758c;cursor:pointer;font-size:.7rem;height:1.4rem;line-height:1rem;outline:0;padding:.1rem;position:relative;text-align:center;text-decoration:none;transition:background .2s,border .2s,box-shadow .2s,color .2s;vertical-align:middle;white-space:nowrap;width:1.4rem}.calendar .calendar-date .date-item.date-today{border-color:#e5e5f9;color:#5755d9}.calendar .calendar-date .date-item:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.calendar .calendar-date .date-item:focus,.calendar .calendar-date .date-item:hover{background:#fefeff;border-color:#e5e5f9;color:#5755d9;text-decoration:none}.calendar .calendar-date .date-item.active,.calendar .calendar-date .date-item:active{background:#4b48d6;border-color:#3634d2;color:#fff}.calendar .calendar-date .date-item.badge::after{position:absolute;right:3px;top:3px;transform:translate(50%,-50%)}.calendar .calendar-date .calendar-event.disabled,.calendar .calendar-date .calendar-event:disabled,.calendar .calendar-date .date-item.disabled,.calendar .calendar-date .date-item:disabled{cursor:default;opacity:.25;pointer-events:none}.calendar .calendar-date.next-month .calendar-event,.calendar .calendar-date.next-month .date-item,.calendar .calendar-date.prev-month .calendar-event,.calendar .calendar-date.prev-month .date-item{opacity:.25}.calendar .calendar-range{position:relative}.calendar .calendar-range::before{background:#f1f1fc;content:"";height:1.4rem;left:0;position:absolute;right:0;top:50%;transform:translateY(-50%)}.calendar .calendar-range.range-start::before{left:50%}.calendar .calendar-range.range-end::before{right:50%}.calendar .calendar-range.range-end .date-item,.calendar .calendar-range.range-start .date-item{background:#4b48d6;border-color:#3634d2;color:#fff}.calendar .calendar-range .date-item{color:#5755d9}.calendar.calendar-lg .calendar-body{padding:0}.calendar.calendar-lg .calendar-body .calendar-date{border-bottom:.05rem solid #dadee4;border-right:.05rem solid #dadee4;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:5.5rem;padding:0}.calendar.calendar-lg .calendar-body .calendar-date:nth-child(7n){border-right:0}.calendar.calendar-lg .calendar-body .calendar-date:nth-last-child(-n+7){border-bottom:0}.calendar.calendar-lg .date-item{align-self:flex-end;-ms-flex-item-align:end;height:1.4rem;margin-right:.2rem;margin-top:.2rem}.calendar.calendar-lg .calendar-range::before{top:19px}.calendar.calendar-lg .calendar-range.range-start::before{left:auto;width:19px}.calendar.calendar-lg .calendar-range.range-end::before{right:19px}.calendar.calendar-lg .calendar-events{flex-grow:1;-ms-flex-positive:1;line-height:1;overflow-y:auto;padding:.2rem}.calendar.calendar-lg .calendar-event{border-radius:.1rem;display:block;font-size:.7rem;margin:.1rem auto;overflow:hidden;padding:3px 4px;text-overflow:ellipsis;white-space:nowrap}.carousel .carousel-locator:nth-of-type(1):checked~.carousel-container .carousel-item:nth-of-type(1),.carousel .carousel-locator:nth-of-type(2):checked~.carousel-container .carousel-item:nth-of-type(2),.carousel .carousel-locator:nth-of-type(3):checked~.carousel-container .carousel-item:nth-of-type(3),.carousel .carousel-locator:nth-of-type(4):checked~.carousel-container .carousel-item:nth-of-type(4),.carousel .carousel-locator:nth-of-type(5):checked~.carousel-container .carousel-item:nth-of-type(5),.carousel .carousel-locator:nth-of-type(6):checked~.carousel-container .carousel-item:nth-of-type(6),.carousel .carousel-locator:nth-of-type(7):checked~.carousel-container .carousel-item:nth-of-type(7),.carousel .carousel-locator:nth-of-type(8):checked~.carousel-container .carousel-item:nth-of-type(8){animation:carousel-slidein .75s ease-in-out 1;opacity:1;z-index:100}.carousel .carousel-locator:nth-of-type(1):checked~.carousel-nav .nav-item:nth-of-type(1),.carousel .carousel-locator:nth-of-type(2):checked~.carousel-nav .nav-item:nth-of-type(2),.carousel .carousel-locator:nth-of-type(3):checked~.carousel-nav .nav-item:nth-of-type(3),.carousel .carousel-locator:nth-of-type(4):checked~.carousel-nav .nav-item:nth-of-type(4),.carousel .carousel-locator:nth-of-type(5):checked~.carousel-nav .nav-item:nth-of-type(5),.carousel .carousel-locator:nth-of-type(6):checked~.carousel-nav .nav-item:nth-of-type(6),.carousel .carousel-locator:nth-of-type(7):checked~.carousel-nav .nav-item:nth-of-type(7),.carousel .carousel-locator:nth-of-type(8):checked~.carousel-nav .nav-item:nth-of-type(8){color:#f7f8f9}.carousel{background:#f7f8f9;display:block;overflow:hidden;-webkit-overflow-scrolling:touch;position:relative;width:100%;z-index:1}.carousel .carousel-container{height:100%;left:0;position:relative}.carousel .carousel-container::before{content:"";display:block;padding-bottom:56.25%}.carousel .carousel-container .carousel-item{animation:carousel-slideout 1s ease-in-out 1;height:100%;left:0;margin:0;opacity:0;position:absolute;top:0;width:100%}.carousel .carousel-container .carousel-item:hover .item-next,.carousel .carousel-container .carousel-item:hover .item-prev{opacity:1}.carousel .carousel-container .item-next,.carousel .carousel-container .item-prev{background:rgba(247,248,249,.25);border-color:rgba(247,248,249,.5);color:#f7f8f9;opacity:0;position:absolute;top:50%;transform:translateY(-50%);transition:all .4s;z-index:100}.carousel .carousel-container .item-prev{left:1rem}.carousel .carousel-container .item-next{right:1rem}.carousel .carousel-nav{bottom:.4rem;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;left:50%;position:absolute;transform:translateX(-50%);width:10rem;z-index:100}.carousel .carousel-nav .nav-item{color:rgba(247,248,249,.5);display:block;-ms-flex:1 0 auto;flex:1 0 auto;height:1.6rem;margin:.2rem;max-width:2.5rem;position:relative}.carousel .carousel-nav .nav-item::before{background:currentColor;content:"";display:block;height:.1rem;position:absolute;top:.5rem;width:100%}@keyframes carousel-slidein{0%{transform:translateX(100%)}100%{transform:translateX(0)}}@keyframes carousel-slideout{0%{opacity:1;transform:translateX(0)}100%{opacity:1;transform:translateX(-50%)}}.comparison-slider{height:50vh;overflow:hidden;-webkit-overflow-scrolling:touch;position:relative;width:100%}.comparison-slider .comparison-after,.comparison-slider .comparison-before{height:100%;left:0;margin:0;overflow:hidden;position:absolute;top:0}.comparison-slider .comparison-after img,.comparison-slider .comparison-before img{height:100%;object-fit:cover;object-position:left center;position:absolute;width:100%}.comparison-slider .comparison-before{width:100%;z-index:1}.comparison-slider .comparison-before .comparison-label{right:.8rem}.comparison-slider .comparison-after{max-width:100%;min-width:0;z-index:2}.comparison-slider .comparison-after::before{background:0 0;content:"";cursor:default;height:100%;left:0;position:absolute;right:.8rem;top:0;z-index:1}.comparison-slider .comparison-after::after{background:currentColor;border-radius:50%;box-shadow:0 -5px,0 5px;color:#fff;content:"";height:3px;pointer-events:none;position:absolute;right:.4rem;top:50%;transform:translate(50%,-50%);width:3px}.comparison-slider .comparison-after .comparison-label{left:.8rem}.comparison-slider .comparison-resizer{animation:first-run 1.5s 1 ease-in-out;cursor:ew-resize;height:.8rem;left:0;max-width:100%;min-width:.8rem;opacity:0;outline:0;position:relative;resize:horizontal;top:50%;transform:translateY(-50%) scaleY(30);width:0}.comparison-slider .comparison-label{background:rgba(48,55,66,.5);bottom:.8rem;color:#fff;padding:.2rem .4rem;position:absolute;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}@keyframes first-run{0%{width:0}25%{width:2.4rem}50%{width:.8rem}75%{width:1.2rem}100%{width:0}}.filter .filter-tag#tag-0:checked~.filter-nav .chip[for=tag-0],.filter .filter-tag#tag-1:checked~.filter-nav .chip[for=tag-1],.filter .filter-tag#tag-2:checked~.filter-nav .chip[for=tag-2],.filter .filter-tag#tag-3:checked~.filter-nav .chip[for=tag-3],.filter .filter-tag#tag-4:checked~.filter-nav .chip[for=tag-4],.filter .filter-tag#tag-5:checked~.filter-nav .chip[for=tag-5],.filter .filter-tag#tag-6:checked~.filter-nav .chip[for=tag-6],.filter .filter-tag#tag-7:checked~.filter-nav .chip[for=tag-7],.filter .filter-tag#tag-8:checked~.filter-nav .chip[for=tag-8]{background:#5755d9;color:#fff}.filter .filter-tag#tag-1:checked~.filter-body .filter-item:not([data-tag~=tag-1]),.filter .filter-tag#tag-2:checked~.filter-body .filter-item:not([data-tag~=tag-2]),.filter .filter-tag#tag-3:checked~.filter-body .filter-item:not([data-tag~=tag-3]),.filter .filter-tag#tag-4:checked~.filter-body .filter-item:not([data-tag~=tag-4]),.filter .filter-tag#tag-5:checked~.filter-body .filter-item:not([data-tag~=tag-5]),.filter .filter-tag#tag-6:checked~.filter-body .filter-item:not([data-tag~=tag-6]),.filter .filter-tag#tag-7:checked~.filter-body .filter-item:not([data-tag~=tag-7]),.filter .filter-tag#tag-8:checked~.filter-body .filter-item:not([data-tag~=tag-8]){display:none}.filter .filter-nav{margin:.4rem 0}.filter .filter-body{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.meter{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#f7f8f9;border:0;border-radius:.1rem;display:block;height:.8rem;width:100%}.meter::-webkit-meter-inner-element{display:block}.meter::-webkit-meter-bar,.meter::-webkit-meter-even-less-good-value,.meter::-webkit-meter-optimum-value,.meter::-webkit-meter-suboptimum-value{border-radius:.1rem}.meter::-webkit-meter-bar{background:#f7f8f9}.meter::-webkit-meter-optimum-value{background:#32b643}.meter::-webkit-meter-suboptimum-value{background:#ffb700}.meter::-webkit-meter-even-less-good-value{background:#e85600}.meter:-moz-meter-optimum,.meter:-moz-meter-sub-optimum,.meter:-moz-meter-sub-sub-optimum,.meter::-moz-meter-bar{border-radius:.1rem}.meter:-moz-meter-optimum::-moz-meter-bar{background:#32b643}.meter:-moz-meter-sub-optimum::-moz-meter-bar{background:#ffb700}.meter:-moz-meter-sub-sub-optimum::-moz-meter-bar{background:#e85600}.off-canvas{display:-ms-flexbox;display:flex;-ms-flex-flow:nowrap;flex-flow:nowrap;height:100%;position:relative;width:100%}.off-canvas .off-canvas-toggle{display:block;left:.4rem;position:absolute;top:.4rem;transition:none;z-index:1}.off-canvas .off-canvas-sidebar{background:#f7f8f9;bottom:0;left:0;min-width:10rem;overflow-y:auto;position:fixed;top:0;transform:translateX(-100%);transition:transform .25s;z-index:200}.off-canvas .off-canvas-content{-ms-flex:1 1 auto;flex:1 1 auto;height:100%;padding:.4rem .4rem .4rem 4rem}.off-canvas .off-canvas-overlay{background:rgba(48,55,66,.1);border-color:transparent;border-radius:0;bottom:0;display:none;height:100%;left:0;position:fixed;right:0;top:0;width:100%}.off-canvas .off-canvas-sidebar.active,.off-canvas .off-canvas-sidebar:target{transform:translateX(0)}.off-canvas .off-canvas-sidebar.active~.off-canvas-overlay,.off-canvas .off-canvas-sidebar:target~.off-canvas-overlay{display:block;z-index:100}@media (min-width:960px){.off-canvas.off-canvas-sidebar-show .off-canvas-toggle{display:none}.off-canvas.off-canvas-sidebar-show .off-canvas-sidebar{-ms-flex:0 0 auto;flex:0 0 auto;position:relative;transform:none}.off-canvas.off-canvas-sidebar-show .off-canvas-overlay{display:none!important}}.parallax{display:block;height:auto;position:relative;width:auto}.parallax .parallax-content{box-shadow:0 1rem 2.1rem rgba(48,55,66,.3);height:auto;transform:perspective(1000px);transform-style:preserve-3d;transition:all .4s ease;width:100%}.parallax .parallax-content::before{content:"";display:block;height:100%;left:0;position:absolute;top:0;width:100%}.parallax .parallax-front{align-items:center;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;height:100%;justify-content:center;left:0;position:absolute;text-align:center;text-shadow:0 0 20px rgba(48,55,66,.75);top:0;transform:translateZ(50px) scale(.95);transition:transform .4s;width:100%;z-index:1}.parallax .parallax-top-left{height:50%;left:0;outline:0;position:absolute;top:0;width:50%;z-index:100}.parallax .parallax-top-left:focus~.parallax-content,.parallax .parallax-top-left:hover~.parallax-content{transform:perspective(1000px) rotateX(3deg) rotateY(-3deg)}.parallax .parallax-top-left:focus~.parallax-content::before,.parallax .parallax-top-left:hover~.parallax-content::before{background:linear-gradient(135deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-top-left:focus~.parallax-content .parallax-front,.parallax .parallax-top-left:hover~.parallax-content .parallax-front{transform:translate3d(4.5px,4.5px,50px) scale(.95)}.parallax .parallax-top-right{height:50%;outline:0;position:absolute;right:0;top:0;width:50%;z-index:100}.parallax .parallax-top-right:focus~.parallax-content,.parallax .parallax-top-right:hover~.parallax-content{transform:perspective(1000px) rotateX(3deg) rotateY(3deg)}.parallax .parallax-top-right:focus~.parallax-content::before,.parallax .parallax-top-right:hover~.parallax-content::before{background:linear-gradient(-135deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-top-right:focus~.parallax-content .parallax-front,.parallax .parallax-top-right:hover~.parallax-content .parallax-front{transform:translate3d(-4.5px,4.5px,50px) scale(.95)}.parallax .parallax-bottom-left{bottom:0;height:50%;left:0;outline:0;position:absolute;width:50%;z-index:100}.parallax .parallax-bottom-left:focus~.parallax-content,.parallax .parallax-bottom-left:hover~.parallax-content{transform:perspective(1000px) rotateX(-3deg) rotateY(-3deg)}.parallax .parallax-bottom-left:focus~.parallax-content::before,.parallax .parallax-bottom-left:hover~.parallax-content::before{background:linear-gradient(45deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-bottom-left:focus~.parallax-content .parallax-front,.parallax .parallax-bottom-left:hover~.parallax-content .parallax-front{transform:translate3d(4.5px,-4.5px,50px) scale(.95)}.parallax .parallax-bottom-right{bottom:0;height:50%;outline:0;position:absolute;right:0;width:50%;z-index:100}.parallax .parallax-bottom-right:focus~.parallax-content,.parallax .parallax-bottom-right:hover~.parallax-content{transform:perspective(1000px) rotateX(-3deg) rotateY(3deg)}.parallax .parallax-bottom-right:focus~.parallax-content::before,.parallax .parallax-bottom-right:hover~.parallax-content::before{background:linear-gradient(-45deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-bottom-right:focus~.parallax-content .parallax-front,.parallax .parallax-bottom-right:hover~.parallax-content .parallax-front{transform:translate3d(-4.5px,-4.5px,50px) scale(.95)}.progress{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#eef0f3;border:0;border-radius:.1rem;color:#5755d9;height:.2rem;position:relative;width:100%}.progress::-webkit-progress-bar{background:0 0;border-radius:.1rem}.progress::-webkit-progress-value{background:#5755d9;border-radius:.1rem}.progress::-moz-progress-bar{background:#5755d9;border-radius:.1rem}.progress:indeterminate{animation:progress-indeterminate 1.5s linear infinite;background:#eef0f3 linear-gradient(to right,#5755d9 30%,#eef0f3 30%) top left/150% 150% no-repeat}.progress:indeterminate::-moz-progress-bar{background:0 0}@keyframes progress-indeterminate{0%{background-position:200% 0}100%{background-position:-200% 0}}.slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;display:block;height:1.2rem;width:100%}.slider:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2);outline:0}.slider.tooltip:not([data-tooltip])::after{content:attr(value)}.slider::-webkit-slider-thumb{-webkit-appearance:none;background:#5755d9;border:0;border-radius:50%;height:.6rem;margin-top:-.25rem;-webkit-transition:transform .2s;transition:transform .2s;width:.6rem}.slider::-moz-range-thumb{background:#5755d9;border:0;border-radius:50%;height:.6rem;-moz-transition:transform .2s;transition:transform .2s;width:.6rem}.slider::-ms-thumb{background:#5755d9;border:0;border-radius:50%;height:.6rem;-ms-transition:transform .2s;transition:transform .2s;width:.6rem}.slider:active::-webkit-slider-thumb{transform:scale(1.25)}.slider:active::-moz-range-thumb{transform:scale(1.25)}.slider:active::-ms-thumb{transform:scale(1.25)}.slider.disabled::-webkit-slider-thumb,.slider:disabled::-webkit-slider-thumb{background:#f7f8f9;transform:scale(1)}.slider.disabled::-moz-range-thumb,.slider:disabled::-moz-range-thumb{background:#f7f8f9;transform:scale(1)}.slider.disabled::-ms-thumb,.slider:disabled::-ms-thumb{background:#f7f8f9;transform:scale(1)}.slider::-webkit-slider-runnable-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-moz-range-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-ms-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-ms-fill-lower{background:#5755d9}.timeline .timeline-item{display:-ms-flexbox;display:flex;margin-bottom:1.2rem;position:relative}.timeline .timeline-item::before{background:#dadee4;content:"";height:100%;left:11px;position:absolute;top:1.2rem;width:2px}.timeline .timeline-item .timeline-left{-ms-flex:0 0 auto;flex:0 0 auto}.timeline .timeline-item .timeline-content{-ms-flex:1 1 auto;flex:1 1 auto;padding:2px 0 2px .8rem}.timeline .timeline-item .timeline-icon{align-items:center;border-radius:50%;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;height:1.2rem;justify-content:center;text-align:center;width:1.2rem}.timeline .timeline-item .timeline-icon::before{border:.1rem solid #5755d9;border-radius:50%;content:"";display:block;height:.4rem;left:.4rem;position:absolute;top:.4rem;width:.4rem}.timeline .timeline-item .timeline-icon.icon-lg{background:#5755d9;line-height:1.2rem}.timeline .timeline-item .timeline-icon.icon-lg::before{content:none}.viewer-360{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-direction:column;flex-direction:column}.viewer-360 .viewer-slider[max="36"][value="1"]+.viewer-image{background-position-y:0}.viewer-360 .viewer-slider[max="36"][value="2"]+.viewer-image{background-position-y:2.8571428571%}.viewer-360 .viewer-slider[max="36"][value="3"]+.viewer-image{background-position-y:5.7142857143%}.viewer-360 .viewer-slider[max="36"][value="4"]+.viewer-image{background-position-y:8.5714285714%}.viewer-360 .viewer-slider[max="36"][value="5"]+.viewer-image{background-position-y:11.4285714286%}.viewer-360 .viewer-slider[max="36"][value="6"]+.viewer-image{background-position-y:14.2857142857%}.viewer-360 .viewer-slider[max="36"][value="7"]+.viewer-image{background-position-y:17.1428571429%}.viewer-360 .viewer-slider[max="36"][value="8"]+.viewer-image{background-position-y:20%}.viewer-360 .viewer-slider[max="36"][value="9"]+.viewer-image{background-position-y:22.8571428571%}.viewer-360 .viewer-slider[max="36"][value="10"]+.viewer-image{background-position-y:25.7142857143%}.viewer-360 .viewer-slider[max="36"][value="11"]+.viewer-image{background-position-y:28.5714285714%}.viewer-360 .viewer-slider[max="36"][value="12"]+.viewer-image{background-position-y:31.4285714286%}.viewer-360 .viewer-slider[max="36"][value="13"]+.viewer-image{background-position-y:34.2857142857%}.viewer-360 .viewer-slider[max="36"][value="14"]+.viewer-image{background-position-y:37.1428571429%}.viewer-360 .viewer-slider[max="36"][value="15"]+.viewer-image{background-position-y:40%}.viewer-360 .viewer-slider[max="36"][value="16"]+.viewer-image{background-position-y:42.8571428571%}.viewer-360 .viewer-slider[max="36"][value="17"]+.viewer-image{background-position-y:45.7142857143%}.viewer-360 .viewer-slider[max="36"][value="18"]+.viewer-image{background-position-y:48.5714285714%}.viewer-360 .viewer-slider[max="36"][value="19"]+.viewer-image{background-position-y:51.4285714286%}.viewer-360 .viewer-slider[max="36"][value="20"]+.viewer-image{background-position-y:54.2857142857%}.viewer-360 .viewer-slider[max="36"][value="21"]+.viewer-image{background-position-y:57.1428571429%}.viewer-360 .viewer-slider[max="36"][value="22"]+.viewer-image{background-position-y:60%}.viewer-360 .viewer-slider[max="36"][value="23"]+.viewer-image{background-position-y:62.8571428571%}.viewer-360 .viewer-slider[max="36"][value="24"]+.viewer-image{background-position-y:65.7142857143%}.viewer-360 .viewer-slider[max="36"][value="25"]+.viewer-image{background-position-y:68.5714285714%}.viewer-360 .viewer-slider[max="36"][value="26"]+.viewer-image{background-position-y:71.4285714286%}.viewer-360 .viewer-slider[max="36"][value="27"]+.viewer-image{background-position-y:74.2857142857%}.viewer-360 .viewer-slider[max="36"][value="28"]+.viewer-image{background-position-y:77.1428571429%}.viewer-360 .viewer-slider[max="36"][value="29"]+.viewer-image{background-position-y:80%}.viewer-360 .viewer-slider[max="36"][value="30"]+.viewer-image{background-position-y:82.8571428571%}.viewer-360 .viewer-slider[max="36"][value="31"]+.viewer-image{background-position-y:85.7142857143%}.viewer-360 .viewer-slider[max="36"][value="32"]+.viewer-image{background-position-y:88.5714285714%}.viewer-360 .viewer-slider[max="36"][value="33"]+.viewer-image{background-position-y:91.4285714286%}.viewer-360 .viewer-slider[max="36"][value="34"]+.viewer-image{background-position-y:94.2857142857%}.viewer-360 .viewer-slider[max="36"][value="35"]+.viewer-image{background-position-y:97.1428571429%}.viewer-360 .viewer-slider[max="36"][value="36"]+.viewer-image{background-position-y:100%}.viewer-360 .viewer-slider{cursor:ew-resize;-ms-flex-order:2;margin:1rem;order:2;width:60%}.viewer-360 .viewer-image{background-position-y:0;background-repeat:no-repeat;background-size:100%;-ms-flex-order:1;max-width:100%;order:1} \ No newline at end of file +.form-autocomplete{position:relative}.form-autocomplete .form-autocomplete-input{align-content:flex-start;display:-ms-flexbox;display:flex;-ms-flex-line-pack:start;-ms-flex-wrap:wrap;flex-wrap:wrap;height:auto;min-height:1.6rem;padding:.1rem}.form-autocomplete .form-autocomplete-input.is-focused{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-autocomplete .form-autocomplete-input .form-input{border-color:transparent;box-shadow:none;display:inline-block;-ms-flex:1 0 auto;flex:1 0 auto;height:1.2rem;line-height:.8rem;margin:.1rem;width:auto}.form-autocomplete .menu{left:0;position:absolute;top:100%;width:100%}.form-autocomplete.autocomplete-oneline .form-autocomplete-input{-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto}.form-autocomplete.autocomplete-oneline .chip{-ms-flex:1 0 auto;flex:1 0 auto}.calendar{border:.05rem solid #dadee4;border-radius:.1rem;display:block;min-width:280px}.calendar .calendar-nav{align-items:center;background:#f7f8f9;border-top-left-radius:.1rem;border-top-right-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-align:center;font-size:.9rem;padding:.4rem}.calendar .calendar-body,.calendar .calendar-header{display:-ms-flexbox;display:flex;-ms-flex-pack:center;-ms-flex-wrap:wrap;flex-wrap:wrap;justify-content:center;padding:.4rem 0}.calendar .calendar-body .calendar-date,.calendar .calendar-header .calendar-date{-ms-flex:0 0 14.28%;flex:0 0 14.28%;max-width:14.28%}.calendar .calendar-header{background:#f7f8f9;border-bottom:.05rem solid #dadee4;color:#bcc3ce;font-size:.7rem;text-align:center}.calendar .calendar-body{color:#66758c}.calendar .calendar-date{border:0;padding:.2rem}.calendar .calendar-date .date-item{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:.05rem solid transparent;border-radius:50%;color:#66758c;cursor:pointer;font-size:.7rem;height:1.4rem;line-height:1rem;outline:0;padding:.1rem;position:relative;text-align:center;text-decoration:none;transition:background .2s,border .2s,box-shadow .2s,color .2s;vertical-align:middle;white-space:nowrap;width:1.4rem}.calendar .calendar-date .date-item.date-today{border-color:#e5e5f9;color:#5755d9}.calendar .calendar-date .date-item:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.calendar .calendar-date .date-item:focus,.calendar .calendar-date .date-item:hover{background:#fefeff;border-color:#e5e5f9;color:#5755d9;text-decoration:none}.calendar .calendar-date .date-item.active,.calendar .calendar-date .date-item:active{background:#4b48d6;border-color:#3634d2;color:#fff}.calendar .calendar-date .date-item.badge::after{position:absolute;right:3px;top:3px;transform:translate(50%,-50%)}.calendar .calendar-date .calendar-event.disabled,.calendar .calendar-date .calendar-event:disabled,.calendar .calendar-date .date-item.disabled,.calendar .calendar-date .date-item:disabled{cursor:default;opacity:.25;pointer-events:none}.calendar .calendar-date.next-month .calendar-event,.calendar .calendar-date.next-month .date-item,.calendar .calendar-date.prev-month .calendar-event,.calendar .calendar-date.prev-month .date-item{opacity:.25}.calendar .calendar-range{position:relative}.calendar .calendar-range::before{background:#f1f1fc;content:"";height:1.4rem;left:0;position:absolute;right:0;top:50%;transform:translateY(-50%)}.calendar .calendar-range.range-start::before{left:50%}.calendar .calendar-range.range-end::before{right:50%}.calendar .calendar-range.range-end .date-item,.calendar .calendar-range.range-start .date-item{background:#4b48d6;border-color:#3634d2;color:#fff}.calendar .calendar-range .date-item{color:#5755d9}.calendar.calendar-lg .calendar-body{padding:0}.calendar.calendar-lg .calendar-body .calendar-date{border-bottom:.05rem solid #dadee4;border-right:.05rem solid #dadee4;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:5.5rem;padding:0}.calendar.calendar-lg .calendar-body .calendar-date:nth-child(7n){border-right:0}.calendar.calendar-lg .calendar-body .calendar-date:nth-last-child(-n+7){border-bottom:0}.calendar.calendar-lg .date-item{align-self:flex-end;-ms-flex-item-align:end;height:1.4rem;margin-right:.2rem;margin-top:.2rem}.calendar.calendar-lg .calendar-range::before{top:19px}.calendar.calendar-lg .calendar-range.range-start::before{left:auto;width:19px}.calendar.calendar-lg .calendar-range.range-end::before{right:19px}.calendar.calendar-lg .calendar-events{flex-grow:1;-ms-flex-positive:1;line-height:1;overflow-y:auto;padding:.2rem}.calendar.calendar-lg .calendar-event{border-radius:.1rem;display:block;font-size:.7rem;margin:.1rem auto;overflow:hidden;padding:3px 4px;text-overflow:ellipsis;white-space:nowrap}.carousel .carousel-locator:nth-of-type(1):checked~.carousel-container .carousel-item:nth-of-type(1),.carousel .carousel-locator:nth-of-type(2):checked~.carousel-container .carousel-item:nth-of-type(2),.carousel .carousel-locator:nth-of-type(3):checked~.carousel-container .carousel-item:nth-of-type(3),.carousel .carousel-locator:nth-of-type(4):checked~.carousel-container .carousel-item:nth-of-type(4),.carousel .carousel-locator:nth-of-type(5):checked~.carousel-container .carousel-item:nth-of-type(5),.carousel .carousel-locator:nth-of-type(6):checked~.carousel-container .carousel-item:nth-of-type(6),.carousel .carousel-locator:nth-of-type(7):checked~.carousel-container .carousel-item:nth-of-type(7),.carousel .carousel-locator:nth-of-type(8):checked~.carousel-container .carousel-item:nth-of-type(8){animation:carousel-slidein .75s ease-in-out 1;opacity:1;z-index:100}.carousel .carousel-locator:nth-of-type(1):checked~.carousel-nav .nav-item:nth-of-type(1),.carousel .carousel-locator:nth-of-type(2):checked~.carousel-nav .nav-item:nth-of-type(2),.carousel .carousel-locator:nth-of-type(3):checked~.carousel-nav .nav-item:nth-of-type(3),.carousel .carousel-locator:nth-of-type(4):checked~.carousel-nav .nav-item:nth-of-type(4),.carousel .carousel-locator:nth-of-type(5):checked~.carousel-nav .nav-item:nth-of-type(5),.carousel .carousel-locator:nth-of-type(6):checked~.carousel-nav .nav-item:nth-of-type(6),.carousel .carousel-locator:nth-of-type(7):checked~.carousel-nav .nav-item:nth-of-type(7),.carousel .carousel-locator:nth-of-type(8):checked~.carousel-nav .nav-item:nth-of-type(8){color:#f7f8f9}.carousel{background:#f7f8f9;display:block;overflow:hidden;-webkit-overflow-scrolling:touch;position:relative;width:100%;z-index:1}.carousel .carousel-container{height:100%;left:0;position:relative}.carousel .carousel-container::before{content:"";display:block;padding-bottom:56.25%}.carousel .carousel-container .carousel-item{animation:carousel-slideout 1s ease-in-out 1;height:100%;left:0;margin:0;opacity:0;position:absolute;top:0;width:100%}.carousel .carousel-container .carousel-item:hover .item-next,.carousel .carousel-container .carousel-item:hover .item-prev{opacity:1}.carousel .carousel-container .item-next,.carousel .carousel-container .item-prev{background:rgba(247,248,249,.25);border-color:rgba(247,248,249,.5);color:#f7f8f9;opacity:0;position:absolute;top:50%;transform:translateY(-50%);transition:all .4s;z-index:100}.carousel .carousel-container .item-prev{left:1rem}.carousel .carousel-container .item-next{right:1rem}.carousel .carousel-nav{bottom:.4rem;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;left:50%;position:absolute;transform:translateX(-50%);width:10rem;z-index:100}.carousel .carousel-nav .nav-item{color:rgba(247,248,249,.5);display:block;-ms-flex:1 0 auto;flex:1 0 auto;height:1.6rem;margin:.2rem;max-width:2.5rem;position:relative}.carousel .carousel-nav .nav-item::before{background:currentColor;content:"";display:block;height:.1rem;position:absolute;top:.5rem;width:100%}@keyframes carousel-slidein{0%{transform:translateX(100%)}100%{transform:translateX(0)}}@keyframes carousel-slideout{0%{opacity:1;transform:translateX(0)}100%{opacity:1;transform:translateX(-50%)}}.comparison-slider{height:50vh;overflow:hidden;-webkit-overflow-scrolling:touch;position:relative;width:100%}.comparison-slider .comparison-after,.comparison-slider .comparison-before{height:100%;left:0;margin:0;overflow:hidden;position:absolute;top:0}.comparison-slider .comparison-after img,.comparison-slider .comparison-before img{height:100%;object-fit:cover;object-position:left center;position:absolute;width:100%}.comparison-slider .comparison-before{width:100%;z-index:1}.comparison-slider .comparison-before .comparison-label{right:.8rem}.comparison-slider .comparison-after{max-width:100%;min-width:0;z-index:2}.comparison-slider .comparison-after::before{background:0 0;content:"";cursor:default;height:100%;left:0;position:absolute;right:.8rem;top:0;z-index:1}.comparison-slider .comparison-after::after{background:currentColor;border-radius:50%;box-shadow:0 -5px,0 5px;color:#fff;content:"";height:3px;pointer-events:none;position:absolute;right:.4rem;top:50%;transform:translate(50%,-50%);width:3px}.comparison-slider .comparison-after .comparison-label{left:.8rem}.comparison-slider .comparison-resizer{animation:first-run 1.5s 1 ease-in-out;cursor:ew-resize;height:.8rem;left:0;max-width:100%;min-width:.8rem;opacity:0;outline:0;position:relative;resize:horizontal;top:50%;transform:translateY(-50%) scaleY(30);width:0}.comparison-slider .comparison-label{background:rgba(48,55,66,.5);bottom:.8rem;color:#fff;padding:.2rem .4rem;position:absolute;-webkit-user-select:none;-ms-user-select:none;user-select:none}@keyframes first-run{0%{width:0}25%{width:2.4rem}50%{width:.8rem}75%{width:1.2rem}100%{width:0}}.filter .filter-tag#tag-0:checked~.filter-nav .chip[for=tag-0],.filter .filter-tag#tag-1:checked~.filter-nav .chip[for=tag-1],.filter .filter-tag#tag-2:checked~.filter-nav .chip[for=tag-2],.filter .filter-tag#tag-3:checked~.filter-nav .chip[for=tag-3],.filter .filter-tag#tag-4:checked~.filter-nav .chip[for=tag-4],.filter .filter-tag#tag-5:checked~.filter-nav .chip[for=tag-5],.filter .filter-tag#tag-6:checked~.filter-nav .chip[for=tag-6],.filter .filter-tag#tag-7:checked~.filter-nav .chip[for=tag-7],.filter .filter-tag#tag-8:checked~.filter-nav .chip[for=tag-8]{background:#5755d9;color:#fff}.filter .filter-tag#tag-1:checked~.filter-body .filter-item:not([data-tag~=tag-1]),.filter .filter-tag#tag-2:checked~.filter-body .filter-item:not([data-tag~=tag-2]),.filter .filter-tag#tag-3:checked~.filter-body .filter-item:not([data-tag~=tag-3]),.filter .filter-tag#tag-4:checked~.filter-body .filter-item:not([data-tag~=tag-4]),.filter .filter-tag#tag-5:checked~.filter-body .filter-item:not([data-tag~=tag-5]),.filter .filter-tag#tag-6:checked~.filter-body .filter-item:not([data-tag~=tag-6]),.filter .filter-tag#tag-7:checked~.filter-body .filter-item:not([data-tag~=tag-7]),.filter .filter-tag#tag-8:checked~.filter-body .filter-item:not([data-tag~=tag-8]){display:none}.filter .filter-nav{margin:.4rem 0}.filter .filter-body{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.meter{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#f7f8f9;border:0;border-radius:.1rem;display:block;height:.8rem;width:100%}.meter::-webkit-meter-inner-element{display:block}.meter::-webkit-meter-bar,.meter::-webkit-meter-even-less-good-value,.meter::-webkit-meter-optimum-value,.meter::-webkit-meter-suboptimum-value{border-radius:.1rem}.meter::-webkit-meter-bar{background:#f7f8f9}.meter::-webkit-meter-optimum-value{background:#32b643}.meter::-webkit-meter-suboptimum-value{background:#ffb700}.meter::-webkit-meter-even-less-good-value{background:#e85600}.meter:-moz-meter-optimum,.meter:-moz-meter-sub-optimum,.meter:-moz-meter-sub-sub-optimum,.meter::-moz-meter-bar{border-radius:.1rem}.meter:-moz-meter-optimum::-moz-meter-bar{background:#32b643}.meter:-moz-meter-sub-optimum::-moz-meter-bar{background:#ffb700}.meter:-moz-meter-sub-sub-optimum::-moz-meter-bar{background:#e85600}.off-canvas{display:-ms-flexbox;display:flex;-ms-flex-flow:nowrap;flex-flow:nowrap;height:100%;position:relative;width:100%}.off-canvas .off-canvas-toggle{display:block;left:.4rem;position:absolute;top:.4rem;transition:none;z-index:1}.off-canvas .off-canvas-sidebar{background:#f7f8f9;bottom:0;left:0;min-width:10rem;overflow-y:auto;position:fixed;top:0;transform:translateX(-100%);transition:transform .25s;z-index:200}.off-canvas .off-canvas-content{-ms-flex:1 1 auto;flex:1 1 auto;height:100%;padding:.4rem .4rem .4rem 4rem}.off-canvas .off-canvas-overlay{background:rgba(48,55,66,.1);border-color:transparent;border-radius:0;bottom:0;display:none;height:100%;left:0;position:fixed;right:0;top:0;width:100%}.off-canvas .off-canvas-sidebar.active,.off-canvas .off-canvas-sidebar:target{transform:translateX(0)}.off-canvas .off-canvas-sidebar.active~.off-canvas-overlay,.off-canvas .off-canvas-sidebar:target~.off-canvas-overlay{display:block;z-index:100}@media(min-width:960px){.off-canvas.off-canvas-sidebar-show .off-canvas-toggle{display:none}.off-canvas.off-canvas-sidebar-show .off-canvas-sidebar{-ms-flex:0 0 auto;flex:0 0 auto;position:relative;transform:none}.off-canvas.off-canvas-sidebar-show .off-canvas-overlay{display:none!important}}.parallax{display:block;height:auto;position:relative;width:auto}.parallax .parallax-content{box-shadow:0 1rem 2.1rem rgba(48,55,66,.3);height:auto;transform:perspective(1000px);transform-style:preserve-3d;transition:all .4s ease;width:100%}.parallax .parallax-content::before{content:"";display:block;height:100%;left:0;position:absolute;top:0;width:100%}.parallax .parallax-front{align-items:center;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;height:100%;justify-content:center;left:0;position:absolute;text-align:center;text-shadow:0 0 20px rgba(48,55,66,.75);top:0;transform:translateZ(50px) scale(.95);transition:transform .4s;width:100%;z-index:1}.parallax .parallax-top-left{height:50%;left:0;outline:0;position:absolute;top:0;width:50%;z-index:100}.parallax .parallax-top-left:focus~.parallax-content,.parallax .parallax-top-left:hover~.parallax-content{transform:perspective(1000px) rotateX(3deg) rotateY(-3deg)}.parallax .parallax-top-left:focus~.parallax-content::before,.parallax .parallax-top-left:hover~.parallax-content::before{background:linear-gradient(135deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-top-left:focus~.parallax-content .parallax-front,.parallax .parallax-top-left:hover~.parallax-content .parallax-front{transform:translate3d(4.5px,4.5px,50px) scale(.95)}.parallax .parallax-top-right{height:50%;outline:0;position:absolute;right:0;top:0;width:50%;z-index:100}.parallax .parallax-top-right:focus~.parallax-content,.parallax .parallax-top-right:hover~.parallax-content{transform:perspective(1000px) rotateX(3deg) rotateY(3deg)}.parallax .parallax-top-right:focus~.parallax-content::before,.parallax .parallax-top-right:hover~.parallax-content::before{background:linear-gradient(-135deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-top-right:focus~.parallax-content .parallax-front,.parallax .parallax-top-right:hover~.parallax-content .parallax-front{transform:translate3d(-4.5px,4.5px,50px) scale(.95)}.parallax .parallax-bottom-left{bottom:0;height:50%;left:0;outline:0;position:absolute;width:50%;z-index:100}.parallax .parallax-bottom-left:focus~.parallax-content,.parallax .parallax-bottom-left:hover~.parallax-content{transform:perspective(1000px) rotateX(-3deg) rotateY(-3deg)}.parallax .parallax-bottom-left:focus~.parallax-content::before,.parallax .parallax-bottom-left:hover~.parallax-content::before{background:linear-gradient(45deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-bottom-left:focus~.parallax-content .parallax-front,.parallax .parallax-bottom-left:hover~.parallax-content .parallax-front{transform:translate3d(4.5px,-4.5px,50px) scale(.95)}.parallax .parallax-bottom-right{bottom:0;height:50%;outline:0;position:absolute;right:0;width:50%;z-index:100}.parallax .parallax-bottom-right:focus~.parallax-content,.parallax .parallax-bottom-right:hover~.parallax-content{transform:perspective(1000px) rotateX(-3deg) rotateY(3deg)}.parallax .parallax-bottom-right:focus~.parallax-content::before,.parallax .parallax-bottom-right:hover~.parallax-content::before{background:linear-gradient(-45deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-bottom-right:focus~.parallax-content .parallax-front,.parallax .parallax-bottom-right:hover~.parallax-content .parallax-front{transform:translate3d(-4.5px,-4.5px,50px) scale(.95)}.progress{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#eef0f3;border:0;border-radius:.1rem;color:#5755d9;height:.2rem;position:relative;width:100%}.progress::-webkit-progress-bar{background:0 0;border-radius:.1rem}.progress::-webkit-progress-value{background:#5755d9;border-radius:.1rem}.progress::-moz-progress-bar{background:#5755d9;border-radius:.1rem}.progress:indeterminate{animation:progress-indeterminate 1.5s linear infinite;background:#eef0f3 linear-gradient(to right,#5755d9 30%,#eef0f3 30%) top left/150% 150% no-repeat}.progress:indeterminate::-moz-progress-bar{background:0 0}@keyframes progress-indeterminate{0%{background-position:200% 0}100%{background-position:-200% 0}}.slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;display:block;height:1.2rem;width:100%}.slider:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2);outline:0}.slider.tooltip:not([data-tooltip])::after{content:attr(value)}.slider::-webkit-slider-thumb{-webkit-appearance:none;background:#5755d9;border:0;border-radius:50%;height:.6rem;margin-top:-.25rem;-webkit-transition:transform .2s;transition:transform .2s;width:.6rem}.slider::-moz-range-thumb{background:#5755d9;border:0;border-radius:50%;height:.6rem;-moz-transition:transform .2s;transition:transform .2s;width:.6rem}.slider::-ms-thumb{background:#5755d9;border:0;border-radius:50%;height:.6rem;-ms-transition:transform .2s;transition:transform .2s;width:.6rem}.slider:active::-webkit-slider-thumb{transform:scale(1.25)}.slider:active::-moz-range-thumb{transform:scale(1.25)}.slider:active::-ms-thumb{transform:scale(1.25)}.slider.disabled::-webkit-slider-thumb,.slider:disabled::-webkit-slider-thumb{background:#f7f8f9;transform:scale(1)}.slider.disabled::-moz-range-thumb,.slider:disabled::-moz-range-thumb{background:#f7f8f9;transform:scale(1)}.slider.disabled::-ms-thumb,.slider:disabled::-ms-thumb{background:#f7f8f9;transform:scale(1)}.slider::-webkit-slider-runnable-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-moz-range-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-ms-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-ms-fill-lower{background:#5755d9}.timeline .timeline-item{display:-ms-flexbox;display:flex;margin-bottom:1.2rem;position:relative}.timeline .timeline-item::before{background:#dadee4;content:"";height:100%;left:11px;position:absolute;top:1.2rem;width:2px}.timeline .timeline-item .timeline-left{-ms-flex:0 0 auto;flex:0 0 auto}.timeline .timeline-item .timeline-content{-ms-flex:1 1 auto;flex:1 1 auto;padding:2px 0 2px .8rem}.timeline .timeline-item .timeline-icon{align-items:center;border-radius:50%;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;height:1.2rem;justify-content:center;text-align:center;width:1.2rem}.timeline .timeline-item .timeline-icon::before{border:.1rem solid #5755d9;border-radius:50%;content:"";display:block;height:.4rem;left:.4rem;position:absolute;top:.4rem;width:.4rem}.timeline .timeline-item .timeline-icon.icon-lg{background:#5755d9;line-height:1.2rem}.timeline .timeline-item .timeline-icon.icon-lg::before{content:none}.viewer-360{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-direction:column;flex-direction:column}.viewer-360 .viewer-slider[max="36"][value="1"]+.viewer-image{background-position-y:0}.viewer-360 .viewer-slider[max="36"][value="2"]+.viewer-image{background-position-y:2.8571428571%}.viewer-360 .viewer-slider[max="36"][value="3"]+.viewer-image{background-position-y:5.7142857143%}.viewer-360 .viewer-slider[max="36"][value="4"]+.viewer-image{background-position-y:8.5714285714%}.viewer-360 .viewer-slider[max="36"][value="5"]+.viewer-image{background-position-y:11.4285714286%}.viewer-360 .viewer-slider[max="36"][value="6"]+.viewer-image{background-position-y:14.2857142857%}.viewer-360 .viewer-slider[max="36"][value="7"]+.viewer-image{background-position-y:17.1428571429%}.viewer-360 .viewer-slider[max="36"][value="8"]+.viewer-image{background-position-y:20%}.viewer-360 .viewer-slider[max="36"][value="9"]+.viewer-image{background-position-y:22.8571428571%}.viewer-360 .viewer-slider[max="36"][value="10"]+.viewer-image{background-position-y:25.7142857143%}.viewer-360 .viewer-slider[max="36"][value="11"]+.viewer-image{background-position-y:28.5714285714%}.viewer-360 .viewer-slider[max="36"][value="12"]+.viewer-image{background-position-y:31.4285714286%}.viewer-360 .viewer-slider[max="36"][value="13"]+.viewer-image{background-position-y:34.2857142857%}.viewer-360 .viewer-slider[max="36"][value="14"]+.viewer-image{background-position-y:37.1428571429%}.viewer-360 .viewer-slider[max="36"][value="15"]+.viewer-image{background-position-y:40%}.viewer-360 .viewer-slider[max="36"][value="16"]+.viewer-image{background-position-y:42.8571428571%}.viewer-360 .viewer-slider[max="36"][value="17"]+.viewer-image{background-position-y:45.7142857143%}.viewer-360 .viewer-slider[max="36"][value="18"]+.viewer-image{background-position-y:48.5714285714%}.viewer-360 .viewer-slider[max="36"][value="19"]+.viewer-image{background-position-y:51.4285714286%}.viewer-360 .viewer-slider[max="36"][value="20"]+.viewer-image{background-position-y:54.2857142857%}.viewer-360 .viewer-slider[max="36"][value="21"]+.viewer-image{background-position-y:57.1428571429%}.viewer-360 .viewer-slider[max="36"][value="22"]+.viewer-image{background-position-y:60%}.viewer-360 .viewer-slider[max="36"][value="23"]+.viewer-image{background-position-y:62.8571428571%}.viewer-360 .viewer-slider[max="36"][value="24"]+.viewer-image{background-position-y:65.7142857143%}.viewer-360 .viewer-slider[max="36"][value="25"]+.viewer-image{background-position-y:68.5714285714%}.viewer-360 .viewer-slider[max="36"][value="26"]+.viewer-image{background-position-y:71.4285714286%}.viewer-360 .viewer-slider[max="36"][value="27"]+.viewer-image{background-position-y:74.2857142857%}.viewer-360 .viewer-slider[max="36"][value="28"]+.viewer-image{background-position-y:77.1428571429%}.viewer-360 .viewer-slider[max="36"][value="29"]+.viewer-image{background-position-y:80%}.viewer-360 .viewer-slider[max="36"][value="30"]+.viewer-image{background-position-y:82.8571428571%}.viewer-360 .viewer-slider[max="36"][value="31"]+.viewer-image{background-position-y:85.7142857143%}.viewer-360 .viewer-slider[max="36"][value="32"]+.viewer-image{background-position-y:88.5714285714%}.viewer-360 .viewer-slider[max="36"][value="33"]+.viewer-image{background-position-y:91.4285714286%}.viewer-360 .viewer-slider[max="36"][value="34"]+.viewer-image{background-position-y:94.2857142857%}.viewer-360 .viewer-slider[max="36"][value="35"]+.viewer-image{background-position-y:97.1428571429%}.viewer-360 .viewer-slider[max="36"][value="36"]+.viewer-image{background-position-y:100%}.viewer-360 .viewer-slider{cursor:ew-resize;-ms-flex-order:2;margin:1rem;order:2;width:60%}.viewer-360 .viewer-image{background-position-y:0;background-repeat:no-repeat;background-size:100%;-ms-flex-order:1;max-width:100%;order:1}/*! Spectre.css Experimentals v0.5.9 | MIT License | github.com/picturepan2/spectre */ \ No newline at end of file diff --git a/docs/dist/spectre-icons.css b/docs/dist/spectre-icons.css index fd881f151..d9bb5fd95 100644 --- a/docs/dist/spectre-icons.css +++ b/docs/dist/spectre-icons.css @@ -1,4 +1,3 @@ -/*! Spectre.css Icons v0.5.9 | MIT License | github.com/picturepan2/spectre */ .icon { box-sizing: border-box; display: inline-block; @@ -9,9 +8,7 @@ text-indent: -9999px; vertical-align: middle; width: 1em; -} - -.icon::before, +}.icon::before, .icon::after { content: ""; display: block; @@ -19,32 +16,20 @@ position: absolute; top: 50%; transform: translate(-50%, -50%); -} - -.icon.icon-2x { +}.icon.icon-2x { font-size: 1.6rem; -} - -.icon.icon-3x { +}.icon.icon-3x { font-size: 2.4rem; -} - -.icon.icon-4x { +}.icon.icon-4x { font-size: 3.2rem; -} - -.accordion .icon, +}.accordion .icon, .btn .icon, .toast .icon, .menu .icon { vertical-align: -10%; -} - -.btn-lg .icon { +}.btn-lg .icon { vertical-align: -15%; -} - -.icon-arrow-down::before, +}.icon-arrow-down::before, .icon-arrow-left::before, .icon-arrow-right::before, .icon-arrow-up::before, @@ -57,94 +42,58 @@ border-right: 0; height: .65em; width: .65em; -} - -.icon-arrow-down::before { +}.icon-arrow-down::before { transform: translate(-50%, -75%) rotate(225deg); -} - -.icon-arrow-left::before { +}.icon-arrow-left::before { transform: translate(-25%, -50%) rotate(-45deg); -} - -.icon-arrow-right::before { +}.icon-arrow-right::before { transform: translate(-75%, -50%) rotate(135deg); -} - -.icon-arrow-up::before { +}.icon-arrow-up::before { transform: translate(-50%, -25%) rotate(45deg); -} - -.icon-back::after, +}.icon-back::after, .icon-forward::after { background: currentColor; height: .1rem; width: .8em; -} - -.icon-downward::after, +}.icon-downward::after, .icon-upward::after { background: currentColor; height: .8em; width: .1rem; -} - -.icon-back::after { +}.icon-back::after { left: 55%; -} - -.icon-back::before { +}.icon-back::before { transform: translate(-50%, -50%) rotate(-45deg); -} - -.icon-downward::after { +}.icon-downward::after { top: 45%; -} - -.icon-downward::before { +}.icon-downward::before { transform: translate(-50%, -50%) rotate(-135deg); -} - -.icon-forward::after { +}.icon-forward::after { left: 45%; -} - -.icon-forward::before { +}.icon-forward::before { transform: translate(-50%, -50%) rotate(135deg); -} - -.icon-upward::after { +}.icon-upward::after { top: 55%; -} - -.icon-upward::before { +}.icon-upward::before { transform: translate(-50%, -50%) rotate(45deg); -} - -.icon-caret::before { +}.icon-caret::before { border-left: .3em solid transparent; border-right: .3em solid transparent; border-top: .3em solid currentColor; height: 0; transform: translate(-50%, -25%); width: 0; -} - -.icon-menu::before { +}.icon-menu::before { background: currentColor; - box-shadow: 0 -.35em, 0 .35em; + box-shadow: 0 -.35em,0 .35em; height: .1rem; width: 100%; -} - -.icon-apps::before { +}.icon-apps::before { background: currentColor; - box-shadow: -.35em -.35em, -.35em 0, -.35em .35em, 0 -.35em, 0 .35em, .35em -.35em, .35em 0, .35em .35em; + box-shadow: -.35em -.35em,-.35em 0,-.35em .35em,0 -.35em,0 .35em,.35em -.35em,.35em 0,.35em .35em; height: 3px; width: 3px; -} - -.icon-resize-horiz::before, +}.icon-resize-horiz::before, .icon-resize-horiz::after, .icon-resize-vert::before, .icon-resize-vert::after { @@ -153,111 +102,75 @@ border-right: 0; height: .45em; width: .45em; -} - -.icon-resize-horiz::before, +}.icon-resize-horiz::before, .icon-resize-vert::before { transform: translate(-50%, -90%) rotate(45deg); -} - -.icon-resize-horiz::after, +}.icon-resize-horiz::after, .icon-resize-vert::after { transform: translate(-50%, -10%) rotate(225deg); -} - -.icon-resize-horiz::before { +}.icon-resize-horiz::before { transform: translate(-90%, -50%) rotate(-45deg); -} - -.icon-resize-horiz::after { +}.icon-resize-horiz::after { transform: translate(-10%, -50%) rotate(135deg); -} - -.icon-more-horiz::before, +}.icon-more-horiz::before, .icon-more-vert::before { background: currentColor; border-radius: 50%; - box-shadow: -.4em 0, .4em 0; + box-shadow: -.4em 0,.4em 0; height: 3px; width: 3px; -} - -.icon-more-vert::before { - box-shadow: 0 -.4em, 0 .4em; -} - -.icon-plus::before, +}.icon-more-vert::before { + box-shadow: 0 -.4em,0 .4em; +}.icon-plus::before, .icon-minus::before, .icon-cross::before { background: currentColor; height: .1rem; width: 100%; -} - -.icon-plus::after, +}.icon-plus::after, .icon-cross::after { background: currentColor; height: 100%; width: .1rem; -} - -.icon-cross::before { +}.icon-cross::before { width: 100%; -} - -.icon-cross::after { +}.icon-cross::after { height: 100%; -} - -.icon-cross::before, +}.icon-cross::before, .icon-cross::after { transform: translate(-50%, -50%) rotate(45deg); -} - -.icon-check::before { +}.icon-check::before { border: .1rem solid currentColor; border-right: 0; border-top: 0; height: .5em; - transform: translate(-50%, -75%) rotate(-45deg); + transform: translate(-50%, -75%) rotate(-45deg); width: .9em; -} - -.icon-stop { +}.icon-stop { border: .1rem solid currentColor; border-radius: 50%; -} - -.icon-stop::before { +}.icon-stop::before { background: currentColor; height: .1rem; transform: translate(-50%, -50%) rotate(45deg); width: 1em; -} - -.icon-shutdown { +}.icon-shutdown { border: .1rem solid currentColor; border-radius: 50%; border-top-color: transparent; -} - -.icon-shutdown::before { +}.icon-shutdown::before { background: currentColor; content: ""; height: .5em; top: .1em; width: .1rem; -} - -.icon-refresh::before { +}.icon-refresh::before { border: .1rem solid currentColor; border-radius: 50%; border-right-color: transparent; height: 1em; width: 1em; -} - -.icon-refresh::after { +}.icon-refresh::after { border: .2em solid currentColor; border-left-color: transparent; border-top-color: transparent; @@ -265,9 +178,7 @@ left: 80%; top: 20%; width: 0; -} - -.icon-search::before { +}.icon-search::before { border: .1rem solid currentColor; border-radius: 50%; height: .75em; @@ -275,25 +186,19 @@ top: 5%; transform: translate(0, 0) rotate(45deg); width: .75em; -} - -.icon-search::after { +}.icon-search::after { background: currentColor; height: .1rem; left: 80%; top: 80%; transform: translate(-50%, -50%) rotate(45deg); width: .4em; -} - -.icon-edit::before { +}.icon-edit::before { border: .1rem solid currentColor; height: .4em; transform: translate(-40%, -60%) rotate(-45deg); width: .85em; -} - -.icon-edit::after { +}.icon-edit::after { border: .15em solid currentColor; border-right-color: transparent; border-top-color: transparent; @@ -302,9 +207,7 @@ top: 95%; transform: translate(0, -100%); width: 0; -} - -.icon-delete::before { +}.icon-delete::before { border: .1rem solid currentColor; border-bottom-left-radius: .1rem; border-bottom-right-radius: .1rem; @@ -312,24 +215,18 @@ height: .75em; top: 60%; width: .75em; -} - -.icon-delete::after { +}.icon-delete::after { background: currentColor; - box-shadow: -.25em .2em, .25em .2em; + box-shadow: -.25em .2em,.25em .2em; height: .1rem; top: .05rem; width: .5em; -} - -.icon-share { +}.icon-share { border: .1rem solid currentColor; border-radius: .1rem; border-right: 0; border-top: 0; -} - -.icon-share::before { +}.icon-share::before { border: .1rem solid currentColor; border-left: 0; border-top: 0; @@ -338,25 +235,19 @@ top: .25em; transform: translate(-125%, -50%) rotate(-45deg); width: .4em; -} - -.icon-share::after { +}.icon-share::after { border: .1rem solid currentColor; border-bottom: 0; border-radius: 75% 0; border-right: 0; height: .5em; width: .6em; -} - -.icon-flag::before { +}.icon-flag::before { background: currentColor; height: 1em; left: 15%; width: .1rem; -} - -.icon-flag::after { +}.icon-flag::after { border: .1rem solid currentColor; border-bottom-right-radius: .1rem; border-left: 0; @@ -365,18 +256,14 @@ left: 60%; top: 35%; width: .8em; -} - -.icon-bookmark::before { +}.icon-bookmark::before { border: .1rem solid currentColor; border-bottom: 0; border-top-left-radius: .1rem; border-top-right-radius: .1rem; height: .9em; width: .8em; -} - -.icon-bookmark::after { +}.icon-bookmark::after { border: .1rem solid currentColor; border-bottom: 0; border-left: 0; @@ -384,40 +271,28 @@ height: .5em; transform: translate(-50%, 35%) rotate(-45deg) skew(15deg, 15deg); width: .5em; -} - -.icon-download, +}.icon-download, .icon-upload { border-bottom: .1rem solid currentColor; -} - -.icon-download::before, +}.icon-download::before, .icon-upload::before { border: .1rem solid currentColor; border-bottom: 0; border-right: 0; height: .5em; - transform: translate(-50%, -60%) rotate(-135deg); + transform: translate(-50%, -60%) rotate(-135deg); width: .5em; -} - -.icon-download::after, +}.icon-download::after, .icon-upload::after { background: currentColor; height: .6em; top: 40%; width: .1rem; -} - -.icon-upload::before { +}.icon-upload::before { transform: translate(-50%, -60%) rotate(45deg); -} - -.icon-upload::after { +}.icon-upload::after { top: 50%; -} - -.icon-copy::before { +}.icon-copy::before { border: .1rem solid currentColor; border-bottom: 0; border-radius: .1rem; @@ -426,77 +301,57 @@ left: 40%; top: 35%; width: .8em; -} - -.icon-copy::after { +}.icon-copy::after { border: .1rem solid currentColor; border-radius: .1rem; height: .8em; left: 60%; top: 60%; width: .8em; -} - -.icon-time { +}.icon-time { border: .1rem solid currentColor; border-radius: 50%; -} - -.icon-time::before { +}.icon-time::before { background: currentColor; height: .4em; transform: translate(-50%, -75%); width: .1rem; -} - -.icon-time::after { +}.icon-time::after { background: currentColor; height: .3em; transform: translate(-50%, -75%) rotate(90deg); transform-origin: 50% 90%; width: .1rem; -} - -.icon-mail::before { +}.icon-mail::before { border: .1rem solid currentColor; border-radius: .1rem; height: .8em; width: 1em; -} - -.icon-mail::after { +}.icon-mail::after { border: .1rem solid currentColor; border-right: 0; border-top: 0; height: .5em; transform: translate(-50%, -90%) rotate(-45deg) skew(10deg, 10deg); width: .5em; -} - -.icon-people::before { +}.icon-people::before { border: .1rem solid currentColor; border-radius: 50%; height: .45em; top: 25%; width: .45em; -} - -.icon-people::after { +}.icon-people::after { border: .1rem solid currentColor; border-radius: 50% 50% 0 0; height: .4em; top: 75%; width: .9em; -} - -.icon-message { +}.icon-message { border: .1rem solid currentColor; border-bottom: 0; border-radius: .1rem; border-right: 0; -} - -.icon-message::before { +}.icon-message::before { border: .1rem solid currentColor; border-bottom-right-radius: .1rem; border-left: 0; @@ -505,9 +360,7 @@ left: 65%; top: 40%; width: .7em; -} - -.icon-message::after { +}.icon-message::after { background: currentColor; border-radius: .1rem; height: .3em; @@ -515,23 +368,17 @@ top: 100%; transform: translate(0, -90%) rotate(45deg); width: .1rem; -} - -.icon-photo { +}.icon-photo { border: .1rem solid currentColor; border-radius: .1rem; -} - -.icon-photo::before { +}.icon-photo::before { border: .1rem solid currentColor; border-radius: 50%; height: .25em; left: 35%; top: 35%; width: .25em; -} - -.icon-photo::after { +}.icon-photo::after { border: .1rem solid currentColor; border-bottom: 0; border-left: 0; @@ -539,54 +386,38 @@ left: 60%; transform: translate(-50%, 25%) rotate(-45deg); width: .5em; -} - -.icon-link::before, +}.icon-link::before, .icon-link::after { border: .1rem solid currentColor; border-radius: 5em 0 0 5em; border-right: 0; height: .5em; width: .75em; -} - -.icon-link::before { +}.icon-link::before { transform: translate(-70%, -45%) rotate(-45deg); -} - -.icon-link::after { +}.icon-link::after { transform: translate(-30%, -55%) rotate(135deg); -} - -.icon-location::before { +}.icon-location::before { border: .1rem solid currentColor; border-radius: 50% 50% 50% 0; height: .8em; transform: translate(-50%, -60%) rotate(-45deg); width: .8em; -} - -.icon-location::after { +}.icon-location::after { border: .1rem solid currentColor; border-radius: 50%; height: .2em; transform: translate(-50%, -80%); width: .2em; -} - -.icon-emoji { +}.icon-emoji { border: .1rem solid currentColor; border-radius: 50%; -} - -.icon-emoji::before { +}.icon-emoji::before { border-radius: 50%; - box-shadow: -.17em -.1em, .17em -.1em; + box-shadow: -.17em -.1em,.17em -.1em; height: .15em; width: .15em; -} - -.icon-emoji::after { +}.icon-emoji::after { border: .1rem solid currentColor; border-bottom-color: transparent; border-radius: 50%; @@ -594,4 +425,4 @@ height: .5em; transform: translate(-50%, -40%) rotate(-135deg); width: .5em; -} \ No newline at end of file +}/*! Spectre.css Icons v0.5.9 | MIT License | github.com/picturepan2/spectre */ \ No newline at end of file diff --git a/docs/dist/spectre-icons.min.css b/docs/dist/spectre-icons.min.css index 0276f7b84..c69a975bd 100644 --- a/docs/dist/spectre-icons.min.css +++ b/docs/dist/spectre-icons.min.css @@ -1 +1 @@ -/*! Spectre.css Icons v0.5.9 | MIT License | github.com/picturepan2/spectre */.icon{box-sizing:border-box;display:inline-block;font-size:inherit;font-style:normal;height:1em;position:relative;text-indent:-9999px;vertical-align:middle;width:1em}.icon::after,.icon::before{content:"";display:block;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.icon.icon-2x{font-size:1.6rem}.icon.icon-3x{font-size:2.4rem}.icon.icon-4x{font-size:3.2rem}.accordion .icon,.btn .icon,.menu .icon,.toast .icon{vertical-align:-10%}.btn-lg .icon{vertical-align:-15%}.icon-arrow-down::before,.icon-arrow-left::before,.icon-arrow-right::before,.icon-arrow-up::before,.icon-back::before,.icon-downward::before,.icon-forward::before,.icon-upward::before{border:.1rem solid currentColor;border-bottom:0;border-right:0;height:.65em;width:.65em}.icon-arrow-down::before{transform:translate(-50%,-75%) rotate(225deg)}.icon-arrow-left::before{transform:translate(-25%,-50%) rotate(-45deg)}.icon-arrow-right::before{transform:translate(-75%,-50%) rotate(135deg)}.icon-arrow-up::before{transform:translate(-50%,-25%) rotate(45deg)}.icon-back::after,.icon-forward::after{background:currentColor;height:.1rem;width:.8em}.icon-downward::after,.icon-upward::after{background:currentColor;height:.8em;width:.1rem}.icon-back::after{left:55%}.icon-back::before{transform:translate(-50%,-50%) rotate(-45deg)}.icon-downward::after{top:45%}.icon-downward::before{transform:translate(-50%,-50%) rotate(-135deg)}.icon-forward::after{left:45%}.icon-forward::before{transform:translate(-50%,-50%) rotate(135deg)}.icon-upward::after{top:55%}.icon-upward::before{transform:translate(-50%,-50%) rotate(45deg)}.icon-caret::before{border-left:.3em solid transparent;border-right:.3em solid transparent;border-top:.3em solid currentColor;height:0;transform:translate(-50%,-25%);width:0}.icon-menu::before{background:currentColor;box-shadow:0 -.35em,0 .35em;height:.1rem;width:100%}.icon-apps::before{background:currentColor;box-shadow:-.35em -.35em,-.35em 0,-.35em .35em,0 -.35em,0 .35em,.35em -.35em,.35em 0,.35em .35em;height:3px;width:3px}.icon-resize-horiz::after,.icon-resize-horiz::before,.icon-resize-vert::after,.icon-resize-vert::before{border:.1rem solid currentColor;border-bottom:0;border-right:0;height:.45em;width:.45em}.icon-resize-horiz::before,.icon-resize-vert::before{transform:translate(-50%,-90%) rotate(45deg)}.icon-resize-horiz::after,.icon-resize-vert::after{transform:translate(-50%,-10%) rotate(225deg)}.icon-resize-horiz::before{transform:translate(-90%,-50%) rotate(-45deg)}.icon-resize-horiz::after{transform:translate(-10%,-50%) rotate(135deg)}.icon-more-horiz::before,.icon-more-vert::before{background:currentColor;border-radius:50%;box-shadow:-.4em 0,.4em 0;height:3px;width:3px}.icon-more-vert::before{box-shadow:0 -.4em,0 .4em}.icon-cross::before,.icon-minus::before,.icon-plus::before{background:currentColor;height:.1rem;width:100%}.icon-cross::after,.icon-plus::after{background:currentColor;height:100%;width:.1rem}.icon-cross::before{width:100%}.icon-cross::after{height:100%}.icon-cross::after,.icon-cross::before{transform:translate(-50%,-50%) rotate(45deg)}.icon-check::before{border:.1rem solid currentColor;border-right:0;border-top:0;height:.5em;transform:translate(-50%,-75%) rotate(-45deg);width:.9em}.icon-stop{border:.1rem solid currentColor;border-radius:50%}.icon-stop::before{background:currentColor;height:.1rem;transform:translate(-50%,-50%) rotate(45deg);width:1em}.icon-shutdown{border:.1rem solid currentColor;border-radius:50%;border-top-color:transparent}.icon-shutdown::before{background:currentColor;content:"";height:.5em;top:.1em;width:.1rem}.icon-refresh::before{border:.1rem solid currentColor;border-radius:50%;border-right-color:transparent;height:1em;width:1em}.icon-refresh::after{border:.2em solid currentColor;border-left-color:transparent;border-top-color:transparent;height:0;left:80%;top:20%;width:0}.icon-search::before{border:.1rem solid currentColor;border-radius:50%;height:.75em;left:5%;top:5%;transform:translate(0,0) rotate(45deg);width:.75em}.icon-search::after{background:currentColor;height:.1rem;left:80%;top:80%;transform:translate(-50%,-50%) rotate(45deg);width:.4em}.icon-edit::before{border:.1rem solid currentColor;height:.4em;transform:translate(-40%,-60%) rotate(-45deg);width:.85em}.icon-edit::after{border:.15em solid currentColor;border-right-color:transparent;border-top-color:transparent;height:0;left:5%;top:95%;transform:translate(0,-100%);width:0}.icon-delete::before{border:.1rem solid currentColor;border-bottom-left-radius:.1rem;border-bottom-right-radius:.1rem;border-top:0;height:.75em;top:60%;width:.75em}.icon-delete::after{background:currentColor;box-shadow:-.25em .2em,.25em .2em;height:.1rem;top:.05rem;width:.5em}.icon-share{border:.1rem solid currentColor;border-radius:.1rem;border-right:0;border-top:0}.icon-share::before{border:.1rem solid currentColor;border-left:0;border-top:0;height:.4em;left:100%;top:.25em;transform:translate(-125%,-50%) rotate(-45deg);width:.4em}.icon-share::after{border:.1rem solid currentColor;border-bottom:0;border-radius:75% 0;border-right:0;height:.5em;width:.6em}.icon-flag::before{background:currentColor;height:1em;left:15%;width:.1rem}.icon-flag::after{border:.1rem solid currentColor;border-bottom-right-radius:.1rem;border-left:0;border-top-right-radius:.1rem;height:.65em;left:60%;top:35%;width:.8em}.icon-bookmark::before{border:.1rem solid currentColor;border-bottom:0;border-top-left-radius:.1rem;border-top-right-radius:.1rem;height:.9em;width:.8em}.icon-bookmark::after{border:.1rem solid currentColor;border-bottom:0;border-left:0;border-radius:.1rem;height:.5em;transform:translate(-50%,35%) rotate(-45deg) skew(15deg,15deg);width:.5em}.icon-download,.icon-upload{border-bottom:.1rem solid currentColor}.icon-download::before,.icon-upload::before{border:.1rem solid currentColor;border-bottom:0;border-right:0;height:.5em;transform:translate(-50%,-60%) rotate(-135deg);width:.5em}.icon-download::after,.icon-upload::after{background:currentColor;height:.6em;top:40%;width:.1rem}.icon-upload::before{transform:translate(-50%,-60%) rotate(45deg)}.icon-upload::after{top:50%}.icon-copy::before{border:.1rem solid currentColor;border-bottom:0;border-radius:.1rem;border-right:0;height:.8em;left:40%;top:35%;width:.8em}.icon-copy::after{border:.1rem solid currentColor;border-radius:.1rem;height:.8em;left:60%;top:60%;width:.8em}.icon-time{border:.1rem solid currentColor;border-radius:50%}.icon-time::before{background:currentColor;height:.4em;transform:translate(-50%,-75%);width:.1rem}.icon-time::after{background:currentColor;height:.3em;transform:translate(-50%,-75%) rotate(90deg);transform-origin:50% 90%;width:.1rem}.icon-mail::before{border:.1rem solid currentColor;border-radius:.1rem;height:.8em;width:1em}.icon-mail::after{border:.1rem solid currentColor;border-right:0;border-top:0;height:.5em;transform:translate(-50%,-90%) rotate(-45deg) skew(10deg,10deg);width:.5em}.icon-people::before{border:.1rem solid currentColor;border-radius:50%;height:.45em;top:25%;width:.45em}.icon-people::after{border:.1rem solid currentColor;border-radius:50% 50% 0 0;height:.4em;top:75%;width:.9em}.icon-message{border:.1rem solid currentColor;border-bottom:0;border-radius:.1rem;border-right:0}.icon-message::before{border:.1rem solid currentColor;border-bottom-right-radius:.1rem;border-left:0;border-top:0;height:.8em;left:65%;top:40%;width:.7em}.icon-message::after{background:currentColor;border-radius:.1rem;height:.3em;left:10%;top:100%;transform:translate(0,-90%) rotate(45deg);width:.1rem}.icon-photo{border:.1rem solid currentColor;border-radius:.1rem}.icon-photo::before{border:.1rem solid currentColor;border-radius:50%;height:.25em;left:35%;top:35%;width:.25em}.icon-photo::after{border:.1rem solid currentColor;border-bottom:0;border-left:0;height:.5em;left:60%;transform:translate(-50%,25%) rotate(-45deg);width:.5em}.icon-link::after,.icon-link::before{border:.1rem solid currentColor;border-radius:5em 0 0 5em;border-right:0;height:.5em;width:.75em}.icon-link::before{transform:translate(-70%,-45%) rotate(-45deg)}.icon-link::after{transform:translate(-30%,-55%) rotate(135deg)}.icon-location::before{border:.1rem solid currentColor;border-radius:50% 50% 50% 0;height:.8em;transform:translate(-50%,-60%) rotate(-45deg);width:.8em}.icon-location::after{border:.1rem solid currentColor;border-radius:50%;height:.2em;transform:translate(-50%,-80%);width:.2em}.icon-emoji{border:.1rem solid currentColor;border-radius:50%}.icon-emoji::before{border-radius:50%;box-shadow:-.17em -.1em,.17em -.1em;height:.15em;width:.15em}.icon-emoji::after{border:.1rem solid currentColor;border-bottom-color:transparent;border-radius:50%;border-right-color:transparent;height:.5em;transform:translate(-50%,-40%) rotate(-135deg);width:.5em} \ No newline at end of file +.icon{box-sizing:border-box;display:inline-block;font-size:inherit;font-style:normal;height:1em;position:relative;text-indent:-9999px;vertical-align:middle;width:1em}.icon::after,.icon::before{content:"";display:block;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.icon.icon-2x{font-size:1.6rem}.icon.icon-3x{font-size:2.4rem}.icon.icon-4x{font-size:3.2rem}.accordion .icon,.btn .icon,.menu .icon,.toast .icon{vertical-align:-10%}.btn-lg .icon{vertical-align:-15%}.icon-arrow-down::before,.icon-arrow-left::before,.icon-arrow-right::before,.icon-arrow-up::before,.icon-back::before,.icon-downward::before,.icon-forward::before,.icon-upward::before{border:.1rem solid currentColor;border-bottom:0;border-right:0;height:.65em;width:.65em}.icon-arrow-down::before{transform:translate(-50%,-75%) rotate(225deg)}.icon-arrow-left::before{transform:translate(-25%,-50%) rotate(-45deg)}.icon-arrow-right::before{transform:translate(-75%,-50%) rotate(135deg)}.icon-arrow-up::before{transform:translate(-50%,-25%) rotate(45deg)}.icon-back::after,.icon-forward::after{background:currentColor;height:.1rem;width:.8em}.icon-downward::after,.icon-upward::after{background:currentColor;height:.8em;width:.1rem}.icon-back::after{left:55%}.icon-back::before{transform:translate(-50%,-50%) rotate(-45deg)}.icon-downward::after{top:45%}.icon-downward::before{transform:translate(-50%,-50%) rotate(-135deg)}.icon-forward::after{left:45%}.icon-forward::before{transform:translate(-50%,-50%) rotate(135deg)}.icon-upward::after{top:55%}.icon-upward::before{transform:translate(-50%,-50%) rotate(45deg)}.icon-caret::before{border-left:.3em solid transparent;border-right:.3em solid transparent;border-top:.3em solid currentColor;height:0;transform:translate(-50%,-25%);width:0}.icon-menu::before{background:currentColor;box-shadow:0 -.35em,0 .35em;height:.1rem;width:100%}.icon-apps::before{background:currentColor;box-shadow:-.35em -.35em,-.35em 0,-.35em .35em,0 -.35em,0 .35em,.35em -.35em,.35em 0,.35em .35em;height:3px;width:3px}.icon-resize-horiz::after,.icon-resize-horiz::before,.icon-resize-vert::after,.icon-resize-vert::before{border:.1rem solid currentColor;border-bottom:0;border-right:0;height:.45em;width:.45em}.icon-resize-horiz::before,.icon-resize-vert::before{transform:translate(-50%,-90%) rotate(45deg)}.icon-resize-horiz::after,.icon-resize-vert::after{transform:translate(-50%,-10%) rotate(225deg)}.icon-resize-horiz::before{transform:translate(-90%,-50%) rotate(-45deg)}.icon-resize-horiz::after{transform:translate(-10%,-50%) rotate(135deg)}.icon-more-horiz::before,.icon-more-vert::before{background:currentColor;border-radius:50%;box-shadow:-.4em 0,.4em 0;height:3px;width:3px}.icon-more-vert::before{box-shadow:0 -.4em,0 .4em}.icon-cross::before,.icon-minus::before,.icon-plus::before{background:currentColor;height:.1rem;width:100%}.icon-cross::after,.icon-plus::after{background:currentColor;height:100%;width:.1rem}.icon-cross::before{width:100%}.icon-cross::after{height:100%}.icon-cross::after,.icon-cross::before{transform:translate(-50%,-50%) rotate(45deg)}.icon-check::before{border:.1rem solid currentColor;border-right:0;border-top:0;height:.5em;transform:translate(-50%,-75%) rotate(-45deg);width:.9em}.icon-stop{border:.1rem solid currentColor;border-radius:50%}.icon-stop::before{background:currentColor;height:.1rem;transform:translate(-50%,-50%) rotate(45deg);width:1em}.icon-shutdown{border:.1rem solid currentColor;border-radius:50%;border-top-color:transparent}.icon-shutdown::before{background:currentColor;content:"";height:.5em;top:.1em;width:.1rem}.icon-refresh::before{border:.1rem solid currentColor;border-radius:50%;border-right-color:transparent;height:1em;width:1em}.icon-refresh::after{border:.2em solid currentColor;border-left-color:transparent;border-top-color:transparent;height:0;left:80%;top:20%;width:0}.icon-search::before{border:.1rem solid currentColor;border-radius:50%;height:.75em;left:5%;top:5%;transform:translate(0,0) rotate(45deg);width:.75em}.icon-search::after{background:currentColor;height:.1rem;left:80%;top:80%;transform:translate(-50%,-50%) rotate(45deg);width:.4em}.icon-edit::before{border:.1rem solid currentColor;height:.4em;transform:translate(-40%,-60%) rotate(-45deg);width:.85em}.icon-edit::after{border:.15em solid currentColor;border-right-color:transparent;border-top-color:transparent;height:0;left:5%;top:95%;transform:translate(0,-100%);width:0}.icon-delete::before{border:.1rem solid currentColor;border-bottom-left-radius:.1rem;border-bottom-right-radius:.1rem;border-top:0;height:.75em;top:60%;width:.75em}.icon-delete::after{background:currentColor;box-shadow:-.25em .2em,.25em .2em;height:.1rem;top:.05rem;width:.5em}.icon-share{border:.1rem solid currentColor;border-radius:.1rem;border-right:0;border-top:0}.icon-share::before{border:.1rem solid currentColor;border-left:0;border-top:0;height:.4em;left:100%;top:.25em;transform:translate(-125%,-50%) rotate(-45deg);width:.4em}.icon-share::after{border:.1rem solid currentColor;border-bottom:0;border-radius:75% 0;border-right:0;height:.5em;width:.6em}.icon-flag::before{background:currentColor;height:1em;left:15%;width:.1rem}.icon-flag::after{border:.1rem solid currentColor;border-bottom-right-radius:.1rem;border-left:0;border-top-right-radius:.1rem;height:.65em;left:60%;top:35%;width:.8em}.icon-bookmark::before{border:.1rem solid currentColor;border-bottom:0;border-top-left-radius:.1rem;border-top-right-radius:.1rem;height:.9em;width:.8em}.icon-bookmark::after{border:.1rem solid currentColor;border-bottom:0;border-left:0;border-radius:.1rem;height:.5em;transform:translate(-50%,35%) rotate(-45deg) skew(15deg,15deg);width:.5em}.icon-download,.icon-upload{border-bottom:.1rem solid currentColor}.icon-download::before,.icon-upload::before{border:.1rem solid currentColor;border-bottom:0;border-right:0;height:.5em;transform:translate(-50%,-60%) rotate(-135deg);width:.5em}.icon-download::after,.icon-upload::after{background:currentColor;height:.6em;top:40%;width:.1rem}.icon-upload::before{transform:translate(-50%,-60%) rotate(45deg)}.icon-upload::after{top:50%}.icon-copy::before{border:.1rem solid currentColor;border-bottom:0;border-radius:.1rem;border-right:0;height:.8em;left:40%;top:35%;width:.8em}.icon-copy::after{border:.1rem solid currentColor;border-radius:.1rem;height:.8em;left:60%;top:60%;width:.8em}.icon-time{border:.1rem solid currentColor;border-radius:50%}.icon-time::before{background:currentColor;height:.4em;transform:translate(-50%,-75%);width:.1rem}.icon-time::after{background:currentColor;height:.3em;transform:translate(-50%,-75%) rotate(90deg);transform-origin:50% 90%;width:.1rem}.icon-mail::before{border:.1rem solid currentColor;border-radius:.1rem;height:.8em;width:1em}.icon-mail::after{border:.1rem solid currentColor;border-right:0;border-top:0;height:.5em;transform:translate(-50%,-90%) rotate(-45deg) skew(10deg,10deg);width:.5em}.icon-people::before{border:.1rem solid currentColor;border-radius:50%;height:.45em;top:25%;width:.45em}.icon-people::after{border:.1rem solid currentColor;border-radius:50% 50% 0 0;height:.4em;top:75%;width:.9em}.icon-message{border:.1rem solid currentColor;border-bottom:0;border-radius:.1rem;border-right:0}.icon-message::before{border:.1rem solid currentColor;border-bottom-right-radius:.1rem;border-left:0;border-top:0;height:.8em;left:65%;top:40%;width:.7em}.icon-message::after{background:currentColor;border-radius:.1rem;height:.3em;left:10%;top:100%;transform:translate(0,-90%) rotate(45deg);width:.1rem}.icon-photo{border:.1rem solid currentColor;border-radius:.1rem}.icon-photo::before{border:.1rem solid currentColor;border-radius:50%;height:.25em;left:35%;top:35%;width:.25em}.icon-photo::after{border:.1rem solid currentColor;border-bottom:0;border-left:0;height:.5em;left:60%;transform:translate(-50%,25%) rotate(-45deg);width:.5em}.icon-link::after,.icon-link::before{border:.1rem solid currentColor;border-radius:5em 0 0 5em;border-right:0;height:.5em;width:.75em}.icon-link::before{transform:translate(-70%,-45%) rotate(-45deg)}.icon-link::after{transform:translate(-30%,-55%) rotate(135deg)}.icon-location::before{border:.1rem solid currentColor;border-radius:50% 50% 50% 0;height:.8em;transform:translate(-50%,-60%) rotate(-45deg);width:.8em}.icon-location::after{border:.1rem solid currentColor;border-radius:50%;height:.2em;transform:translate(-50%,-80%);width:.2em}.icon-emoji{border:.1rem solid currentColor;border-radius:50%}.icon-emoji::before{border-radius:50%;box-shadow:-.17em -.1em,.17em -.1em;height:.15em;width:.15em}.icon-emoji::after{border:.1rem solid currentColor;border-bottom-color:transparent;border-radius:50%;border-right-color:transparent;height:.5em;transform:translate(-50%,-40%) rotate(-135deg);width:.5em}/*! Spectre.css Icons v0.5.9 | MIT License | github.com/picturepan2/spectre */ \ No newline at end of file diff --git a/docs/dist/spectre-rtl.css b/docs/dist/spectre-rtl.css index 8273d4e3d..6f7417cc3 100644 --- a/docs/dist/spectre-rtl.css +++ b/docs/dist/spectre-rtl.css @@ -1,323 +1,173 @@ -/*! Spectre.css RTL | MIT License | github.com/picturepan2/spectre */ -/*! Spectre.css v0.5.9 | MIT License | github.com/picturepan2/spectre */ -/* Manually forked from Normalize.css */ -/* normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */ -/** 1. Change the default font family in all browsers (opinionated). 2. Correct the line height in all browsers. 3. Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS. */ -/* Document ========================================================================== */ html { - font-family: sans-serif; /* 1 */ - -webkit-text-size-adjust: 100%; /* 3 */ - -ms-text-size-adjust: 100%; /* 3 */ -} - -/* Sections ========================================================================== */ -/** Remove the margin in all browsers (opinionated). */ -body { + font-family: sans-serif; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; +}body { margin: 0; -} - -/** Add the correct display in IE 9-. */ -article, +}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 { +}h1 { font-size: 2em; margin: .67em 0; -} - -/* Grouping content ========================================================================== */ -/** Add the correct display in IE 9-. 1. Add the correct display in IE. */ -figcaption, +}figcaption, figure, main { - /* 1 */ display: block; -} - -/** Add the correct margin in IE 8 (removed). */ -/** 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. (removed) 2. Correct the odd `em` font sizing in all browsers. */ -/* 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 */ -} - -/** Remove the outline on focused links when they are also active or hovered in all browsers (opinionated). */ -a:active, + display: block; +}hr { + box-sizing: content-box; + height: 0; + overflow: visible; +}a { + background-color: transparent; + -webkit-text-decoration-skip: objects; +}a:active, a:hover { outline-width: 0; -} - -/** Modify default styling of address. */ -address { +}address { font-style: normal; -} - -/** 1. Remove the bottom border in Firefox 39-. 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. (removed) */ -/** Prevent the duplicate application of `bolder` by the next rule in Safari 6. */ -b, +}b, strong { font-weight: inherit; -} - -/** Add the correct font weight in Chrome, Edge, and Safari. */ -b, +}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, +}code, kbd, pre, samp { - font-family: "SF Mono", "Segoe UI Mono", "Roboto Mono", Menlo, Courier, monospace; /* 1 (changed) */ - font-size: 1em; /* 2 */ -} - -/** Add the correct font style in Android 4.3-. */ -dfn { + font-family: "SF Mono","Segoe UI Mono","Roboto Mono",Menlo,Courier,monospace; + font-size: 1em; +}dfn { font-style: italic; -} - -/** Add the correct background and color in IE 9-. (Removed) */ -/** Add the correct font size in all browsers. */ -small { +}small { font-size: 80%; - font-weight: 400; /* (added) */ -} - -/** Prevent `sub` and `sup` elements from affecting the line height in all browsers. */ -sub, + font-weight: 400; +}sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; -} - -sub { +}sub { bottom: -.25em; -} - -sup { +}sup { top: -.5em; -} - -/* Embedded content ========================================================================== */ -/** Add the correct display in IE 9-. */ -audio, +}audio, video { display: inline-block; -} - -/** Add the correct display in iOS 4-7. */ -audio:not([controls]) { +}audio:not([controls]) { display: none; height: 0; -} - -/** Remove the border on images inside links in IE 10-. */ -img { +}img { border-style: none; -} - -/** Hide the overflow in IE. */ -svg:not(:root) { +}svg:not(:root) { overflow: hidden; -} - -/* Forms ========================================================================== */ -/** 1. Change the font styles in all browsers (opinionated). 2. Remove the margin in Firefox and Safari. */ -button, +}button, input, optgroup, select, textarea { - font-family: inherit; /* 1 (changed) */ - font-size: inherit; /* 1 (changed) */ - line-height: inherit; /* 1 (changed) */ - margin: 0; /* 2 */ -} - -/** Show the overflow in IE. 1. Show the overflow in Edge. */ -button, + font-family: inherit; + font-size: inherit; + line-height: inherit; + margin: 0; +}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, + overflow: visible; +}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 { + text-transform: none; +}button, +html [type=button], +[type=reset], +[type=submit] { + -webkit-appearance: button; +}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 (removed). */ -/** Change the border, margin, and padding in all browsers (opinionated) (changed). */ -fieldset { +}fieldset { border: 0; margin: 0; padding: 0; -} - -/** 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 { +}legend { + box-sizing: border-box; + color: inherit; + display: table; + max-width: 100%; + padding: 0; + white-space: normal; +}progress { + display: inline-block; + vertical-align: baseline; +}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 { +}[type=checkbox], +[type=radio] { + box-sizing: border-box; + padding: 0; +}[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 { +}[type=search] { + -webkit-appearance: textfield; + outline-offset: -2px; +}[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, +}::-webkit-file-upload-button { + -webkit-appearance: button; + font: inherit; +}details, menu { display: block; -} - -/* Add the correct display in all browsers. */ -summary { +}summary { display: list-item; outline: none; -} - -/* Scripting ========================================================================== */ -/** Add the correct display in IE 9-. */ -canvas { +}canvas { display: inline-block; -} - -/** Add the correct display in IE. */ -template { +}template { display: none; -} - -/* Hidden ========================================================================== */ -/** Add the correct display in IE 10-. */ -[hidden] { +}[hidden] { display: none; -} - -*, +}*, *::before, *::after { box-sizing: inherit; -} - -html { +}html { box-sizing: border-box; font-size: 20px; line-height: 1.5; -webkit-tap-highlight-color: transparent; -} - -body { +}body { background: #fff; color: #3b4351; - font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif; font-size: .8rem; overflow-x: hidden; text-rendering: optimizeLegibility; -} - -a { +}a { color: #5755d9; outline: none; text-decoration: none; -} - -a:focus { - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -a:focus, +}a:focus { + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}a:focus, a:hover, a:active, a.active { color: #302ecd; text-decoration: underline; -} - -a:visited { +}a:visited { color: #807fe2; -} - -h1, +}h1, h2, h3, h4, @@ -328,156 +178,99 @@ h6 { line-height: 1.2; margin-bottom: .5em; margin-top: 0; -} - -.h1, +}.h1, .h2, .h3, .h4, .h5, .h6 { font-weight: 500; -} - -h1, +}h1, .h1 { font-size: 2rem; -} - -h2, +}h2, .h2 { font-size: 1.6rem; -} - -h3, +}h3, .h3 { font-size: 1.4rem; -} - -h4, +}h4, .h4 { font-size: 1.2rem; -} - -h5, +}h5, .h5 { font-size: 1rem; -} - -h6, +}h6, .h6 { font-size: .8rem; -} - -p { +}p { margin: 0 0 1.2rem; -} - -a, +}a, ins, u { - -webkit-text-decoration-skip: ink edges; text-decoration-skip: ink edges; -} - -abbr[title] { +}abbr[title] { border-bottom: .05rem dotted; cursor: help; text-decoration: none; -} - -kbd { +}kbd { background: #303742; border-radius: .1rem; color: #fff; - font-size: .7rem; + font-size: .7rem; line-height: 1.25; padding: .1rem .2rem; -} - -mark { +}mark { background: #ffe9b3; border-bottom: .05rem solid #ffd367; border-radius: .1rem; color: #3b4351; padding: .05rem .1rem 0; -} - -blockquote { +}blockquote { border-left: .1rem solid #dadee4; margin-left: 0; padding: .4rem .8rem; -} - -blockquote p:last-child { +}blockquote p:last-child { margin-bottom: 0; -} - -ul, +}ul, ol { margin: .8rem 0 .8rem .8rem; padding: 0; -} - -ul ul, +}ul ul, ul ol, ol ul, ol ol { margin: .8rem 0 .8rem .8rem; -} - -ul li, +}ul li, ol li { margin-top: .4rem; -} - -ul { +}ul { list-style: disc inside; -} - -ul ul { +}ul ul { list-style-type: circle; -} - -ol { +}ol { list-style: decimal inside; -} - -ol ol { +}ol ol { list-style-type: lower-alpha; -} - -dl dt { +}dl dt { font-weight: bold; -} - -dl dd { +}dl dd { margin: .4rem 0 .8rem 0; -} - -html:lang(zh), +}html:lang(zh), html:lang(zh-Hans), .lang-zh, .lang-zh-hans { - font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", sans-serif; -} - -html:lang(zh-Hant), + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",sans-serif; +}html:lang(zh-Hant), .lang-zh-hant { - font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang TC", "Hiragino Sans CNS", "Microsoft JhengHei", "Helvetica Neue", sans-serif; -} - -html:lang(ja), + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang TC","Hiragino Sans CNS","Microsoft JhengHei","Helvetica Neue",sans-serif; +}html:lang(ja), .lang-ja { - font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Hiragino Sans", "Hiragino Kaku Gothic Pro", "Yu Gothic", YuGothic, Meiryo, "Helvetica Neue", sans-serif; -} - -html:lang(ko), + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Hiragino Sans","Hiragino Kaku Gothic Pro","Yu Gothic",YuGothic,Meiryo,"Helvetica Neue",sans-serif; +}html:lang(ko), .lang-ko { - font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Malgun Gothic", "Helvetica Neue", sans-serif; -} - -:lang(zh) ins, + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Malgun Gothic","Helvetica Neue",sans-serif; +}:lang(zh) ins, :lang(zh) u, :lang(ja) ins, :lang(ja) u, @@ -485,9 +278,7 @@ html:lang(ko), .lang-cjk u { border-bottom: .05rem solid; text-decoration: none; -} - -:lang(zh) del + del, +}:lang(zh) del + del, :lang(zh) del + s, :lang(zh) ins + ins, :lang(zh) ins + u, @@ -512,46 +303,30 @@ html:lang(ko), .lang-cjk u + ins, .lang-cjk u + u { margin-left: .125em; -} - -.table { +}.table { border-collapse: collapse; border-spacing: 0; - text-align: right; + text-align: left; width: 100%; -} - -.table.table-striped tbody tr:nth-of-type(odd) { +}.table.table-striped tbody tr:nth-of-type(odd) { background: #f7f8f9; -} - -.table tbody tr.active, +}.table tbody tr.active, .table.table-striped tbody tr.active { background: #eef0f3; -} - -.table.table-hover tbody tr:hover { +}.table.table-hover tbody tr:hover { background: #eef0f3; -} - -.table.table-scroll { +}.table.table-scroll { display: block; overflow-x: auto; padding-bottom: .75rem; white-space: nowrap; -} - -.table td, +}.table td, .table th { border-bottom: .05rem solid #dadee4; padding: .6rem .4rem; -} - -.table th { +}.table th { border-bottom-width: .1rem; -} - -.btn { +}.btn { -webkit-appearance: none; -moz-appearance: none; appearance: none; @@ -568,176 +343,119 @@ html:lang(ko), padding: .25rem .4rem; text-align: center; text-decoration: none; - transition: background .2s, border .2s, box-shadow .2s, color .2s; + transition: background .2s,border .2s,box-shadow .2s,color .2s; -webkit-user-select: none; - -moz-user-select: none; -ms-user-select: none; user-select: none; vertical-align: middle; white-space: nowrap; -} - -.btn:focus { - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.btn:focus, +}.btn:focus { + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.btn:focus, .btn:hover { background: #f1f1fc; border-color: #4b48d6; text-decoration: none; -} - -.btn:active, +}.btn:active, .btn.active { background: #4b48d6; border-color: #3634d2; color: #fff; text-decoration: none; -} - -.btn:active.loading::after, +}.btn:active.loading::after, .btn.active.loading::after { border-bottom-color: #fff; border-left-color: #fff; -} - -.btn[disabled], +}.btn[disabled], .btn:disabled, .btn.disabled { cursor: default; opacity: .5; pointer-events: none; -} - -.btn.btn-primary { +}.btn.btn-primary { background: #5755d9; border-color: #4b48d6; color: #fff; -} - -.btn.btn-primary:focus, +}.btn.btn-primary:focus, .btn.btn-primary:hover { background: #4240d4; border-color: #3634d2; color: #fff; -} - -.btn.btn-primary:active, +}.btn.btn-primary:active, .btn.btn-primary.active { background: #3a38d2; border-color: #302ecd; color: #fff; -} - -.btn.btn-primary.loading::after { +}.btn.btn-primary.loading::after { border-bottom-color: #fff; border-left-color: #fff; -} - -.btn.btn-success { +}.btn.btn-success { background: #32b643; border-color: #2faa3f; color: #fff; -} - -.btn.btn-success:focus { - box-shadow: 0 0 0 .1rem rgba(50, 182, 67, .2); -} - -.btn.btn-success:focus, +}.btn.btn-success:focus { + box-shadow: 0 0 0 .1rem rgba(50,182,67,.2); +}.btn.btn-success:focus, .btn.btn-success:hover { background: #30ae40; border-color: #2da23c; color: #fff; -} - -.btn.btn-success:active, +}.btn.btn-success:active, .btn.btn-success.active { background: #2a9a39; border-color: #278e34; color: #fff; -} - -.btn.btn-success.loading::after { +}.btn.btn-success.loading::after { border-bottom-color: #fff; border-left-color: #fff; -} - -.btn.btn-error { +}.btn.btn-error { background: #e85600; border-color: #d95000; color: #fff; -} - -.btn.btn-error:focus { - box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2); -} - -.btn.btn-error:focus, +}.btn.btn-error:focus { + box-shadow: 0 0 0 .1rem rgba(232,86,0,.2); +}.btn.btn-error:focus, .btn.btn-error:hover { background: #de5200; border-color: #cf4d00; color: #fff; -} - -.btn.btn-error:active, +}.btn.btn-error:active, .btn.btn-error.active { background: #c44900; border-color: #b54300; color: #fff; -} - -.btn.btn-error.loading::after { +}.btn.btn-error.loading::after { border-bottom-color: #fff; border-left-color: #fff; -} - -.btn.btn-link { +}.btn.btn-link { background: transparent; border-color: transparent; color: #5755d9; -} - -.btn.btn-link:focus, +}.btn.btn-link:focus, .btn.btn-link:hover, .btn.btn-link:active, .btn.btn-link.active { color: #302ecd; -} - -.btn.btn-sm { +}.btn.btn-sm { font-size: .7rem; height: 1.4rem; padding: .05rem .3rem; -} - -.btn.btn-lg { +}.btn.btn-lg { font-size: .9rem; height: 2rem; padding: .35rem .6rem; -} - -.btn.btn-block { +}.btn.btn-block { display: block; width: 100%; -} - -.btn.btn-action { +}.btn.btn-action { padding-left: 0; - padding-right: 0; + padding-right: 0; width: 1.8rem; -} - -.btn.btn-action.btn-sm { +}.btn.btn-action.btn-sm { width: 1.4rem; -} - -.btn.btn-action.btn-lg { +}.btn.btn-action.btn-lg { width: 2rem; -} - -.btn.btn-clear { +}.btn.btn-clear { background: transparent; border: 0; color: currentColor; @@ -749,94 +467,60 @@ html:lang(ko), padding: .1rem; text-decoration: none; width: 1rem; -} - -.btn.btn-clear:focus, +}.btn.btn-clear:focus, .btn.btn-clear:hover { - background: rgba(247, 248, 249, .5); + background: rgba(247,248,249,.5); opacity: .95; -} - -.btn.btn-clear::before { - content: "\2715"; -} - -.btn-group { +}.btn.btn-clear::before { + content: "✕"; +}.btn-group { display: -ms-inline-flexbox; display: inline-flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -} - -.btn-group .btn { +}.btn-group .btn { -ms-flex: 1 0 auto; flex: 1 0 auto; -} - -.btn-group .btn:first-child:not(:last-child) { +}.btn-group .btn:first-child:not(:last-child) { border-bottom-right-radius: 0; border-top-right-radius: 0; -} - -.btn-group .btn:not(:first-child):not(:last-child) { +}.btn-group .btn:not(:first-child):not(:last-child) { border-radius: 0; margin-left: -.05rem; -} - -.btn-group .btn:last-child:not(:first-child) { +}.btn-group .btn:last-child:not(:first-child) { border-bottom-left-radius: 0; border-top-left-radius: 0; margin-left: -.05rem; -} - -.btn-group .btn:focus, +}.btn-group .btn:focus, .btn-group .btn:hover, .btn-group .btn:active, .btn-group .btn.active { z-index: 1; -} - -.btn-group.btn-group-block { +}.btn-group.btn-group-block { display: -ms-flexbox; display: flex; -} - -.btn-group.btn-group-block .btn { +}.btn-group.btn-group-block .btn { -ms-flex: 1 0 0; flex: 1 0 0; -} - -.form-group:not(:last-child) { +}.form-group:not(:last-child) { margin-bottom: .4rem; -} - -fieldset { +}fieldset { margin-bottom: .8rem; -} - -legend { +}legend { font-size: .9rem; font-weight: 500; margin-bottom: .8rem; -} - -.form-label { +}.form-label { display: block; line-height: 1.2rem; padding: .3rem 0; -} - -.form-label.label-sm { +}.form-label.label-sm { font-size: .7rem; padding: .1rem 0; -} - -.form-label.label-lg { +}.form-label.label-lg { font-size: .9rem; padding: .4rem 0; -} - -.form-input { +}.form-input { -webkit-appearance: none; -moz-appearance: none; appearance: none; @@ -853,76 +537,50 @@ legend { outline: none; padding: .25rem .4rem; position: relative; - transition: background .2s, border .2s, box-shadow .2s, color .2s; + transition: background .2s,border .2s,box-shadow .2s,color .2s; width: 100%; -} - -.form-input:focus { - border-color: #5755d9; - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.form-input:-ms-input-placeholder { +}.form-input:focus { + border-color: #5755d9; + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.form-input:-ms-input-placeholder { color: #bcc3ce; -} - -.form-input::-ms-input-placeholder { +}.form-input::-ms-input-placeholder { color: #bcc3ce; -} - -.form-input::placeholder { +}.form-input::placeholder { color: #bcc3ce; -} - -.form-input.input-sm { +}.form-input.input-sm { font-size: .7rem; height: 1.4rem; padding: .05rem .3rem; -} - -.form-input.input-lg { +}.form-input.input-lg { font-size: .9rem; height: 2rem; padding: .35rem .6rem; -} - -.form-input.input-inline { +}.form-input.input-inline { display: inline-block; vertical-align: middle; width: auto; -} - -.form-input[type="file"] { +}.form-input[type=file] { height: auto; -} - -textarea.form-input, +}textarea.form-input, textarea.form-input.input-lg, textarea.form-input.input-sm { height: auto; -} - -.form-input-hint { +}.form-input-hint { color: #bcc3ce; font-size: .7rem; margin-top: .2rem; -} - -.has-success .form-input-hint, +}.has-success .form-input-hint, .is-success + .form-input-hint { color: #32b643; -} - -.has-error .form-input-hint, +}.has-error .form-input-hint, .is-error + .form-input-hint { color: #e85600; -} - -.form-select { +}.form-select { -webkit-appearance: none; -moz-appearance: none; appearance: none; - background: #fff; + background: #fff; border: .05rem solid #bcc3ce; border-radius: .1rem; color: inherit; @@ -933,51 +591,33 @@ textarea.form-input.input-sm { padding: .25rem .4rem; vertical-align: middle; width: 100%; -} - -.form-select:focus { - border-color: #5755d9; - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.form-select::-ms-expand { +}.form-select:focus { + border-color: #5755d9; + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.form-select::-ms-expand { display: none; -} - -.form-select.select-sm { +}.form-select.select-sm { font-size: .7rem; height: 1.4rem; padding: .05rem 1.1rem .05rem .3rem; -} - -.form-select.select-lg { +}.form-select.select-lg { font-size: .9rem; height: 2rem; padding: .35rem 1.4rem .35rem .6rem; -} - -.form-select[size], +}.form-select[size], .form-select[multiple] { height: auto; padding: .25rem .4rem; -} - -.form-select[size] option, +}.form-select[size] option, .form-select[multiple] option { padding: .1rem .2rem; -} - -.form-select:not([multiple]):not([size]) { +}.form-select:not([multiple]):not([size]) { background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center/.4rem .5rem; padding-right: 1.2rem; -} - -.has-icon-left, +}.has-icon-left, .has-icon-right { position: relative; -} - -.has-icon-left .form-icon, +}.has-icon-left .form-icon, .has-icon-right .form-icon { height: .8rem; margin: 0 .25rem; @@ -986,25 +626,15 @@ textarea.form-input.input-sm { transform: translateY(-50%); width: .8rem; z-index: 2; -} - -.has-icon-left .form-icon { +}.has-icon-left .form-icon { left: .05rem; -} - -.has-icon-left .form-input { +}.has-icon-left .form-input { padding-left: 1.3rem; -} - -.has-icon-right .form-icon { +}.has-icon-right .form-icon { right: .05rem; -} - -.has-icon-right .form-input { +}.has-icon-right .form-input { padding-right: 1.3rem; -} - -.form-checkbox, +}.form-checkbox, .form-radio, .form-switch { display: block; @@ -1013,9 +643,7 @@ textarea.form-input.input-sm { min-height: 1.4rem; padding: .1rem .4rem .1rem 1.2rem; position: relative; -} - -.form-checkbox input, +}.form-checkbox input, .form-radio input, .form-switch input { clip: rect(0, 0, 0, 0); @@ -1024,65 +652,47 @@ textarea.form-input.input-sm { overflow: hidden; position: absolute; width: 1px; -} - -.form-checkbox input:focus + .form-icon, +}.form-checkbox input:focus + .form-icon, .form-radio input:focus + .form-icon, .form-switch input:focus + .form-icon { - border-color: #5755d9; - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.form-checkbox input:checked + .form-icon, + border-color: #5755d9; + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.form-checkbox input:checked + .form-icon, .form-radio input:checked + .form-icon, .form-switch input:checked + .form-icon { background: #5755d9; border-color: #5755d9; -} - -.form-checkbox .form-icon, +}.form-checkbox .form-icon, .form-radio .form-icon, .form-switch .form-icon { border: .05rem solid #bcc3ce; cursor: pointer; display: inline-block; position: absolute; - transition: background .2s, border .2s, box-shadow .2s, color .2s; -} - -.form-checkbox.input-sm, + transition: background .2s,border .2s,box-shadow .2s,color .2s; +}.form-checkbox.input-sm, .form-radio.input-sm, .form-switch.input-sm { font-size: .7rem; margin: 0; -} - -.form-checkbox.input-lg, +}.form-checkbox.input-lg, .form-radio.input-lg, .form-switch.input-lg { font-size: .9rem; margin: .3rem 0; -} - -.form-checkbox .form-icon, +}.form-checkbox .form-icon, .form-radio .form-icon { background: #fff; height: .8rem; left: 0; top: .3rem; width: .8rem; -} - -.form-checkbox input:active + .form-icon, +}.form-checkbox input:active + .form-icon, .form-radio input:active + .form-icon { background: #eef0f3; -} - -.form-checkbox .form-icon { +}.form-checkbox .form-icon { border-radius: .1rem; -} - -.form-checkbox input:checked + .form-icon::before { +}.form-checkbox input:checked + .form-icon::before { background-clip: padding-box; border: .1rem solid #fff; border-left-width: 0; @@ -1096,14 +706,10 @@ textarea.form-input.input-sm { top: 50%; transform: rotate(45deg); width: 6px; -} - -.form-checkbox input:indeterminate + .form-icon { +}.form-checkbox input:indeterminate + .form-icon { background: #5755d9; border-color: #5755d9; -} - -.form-checkbox input:indeterminate + .form-icon::before { +}.form-checkbox input:indeterminate + .form-icon::before { background: #fff; content: ""; height: 2px; @@ -1113,13 +719,9 @@ textarea.form-input.input-sm { position: absolute; top: 50%; width: 10px; -} - -.form-radio .form-icon { +}.form-radio .form-icon { border-radius: 50%; -} - -.form-radio input:checked + .form-icon::before { +}.form-radio input:checked + .form-icon::before { background: #fff; border-radius: 50%; content: ""; @@ -1129,13 +731,9 @@ textarea.form-input.input-sm { top: 50%; transform: translate(-50%, -50%); width: 6px; -} - -.form-switch { +}.form-switch { padding-left: 2rem; -} - -.form-switch .form-icon { +}.form-switch .form-icon { background: #bcc3ce; background-clip: padding-box; border-radius: .45rem; @@ -1143,9 +741,7 @@ textarea.form-input.input-sm { left: 0; top: .25rem; width: 1.6rem; -} - -.form-switch .form-icon::before { +}.form-switch .form-icon::before { background: #fff; border-radius: 50%; content: ""; @@ -1154,134 +750,94 @@ textarea.form-input.input-sm { left: 0; position: absolute; top: 0; - transition: background .2s, border .2s, box-shadow .2s, color .2s, left .2s; + transition: background .2s,border .2s,box-shadow .2s,color .2s,left .2s; width: .8rem; -} - -.form-switch input:checked + .form-icon::before { +}.form-switch input:checked + .form-icon::before { left: 14px; -} - -.form-switch input:active + .form-icon::before { +}.form-switch input:active + .form-icon::before { background: #f7f8f9; -} - -.input-group { +}.input-group { display: -ms-flexbox; display: flex; -} - -.input-group .input-group-addon { +}.input-group .input-group-addon { background: #f7f8f9; border: .05rem solid #bcc3ce; border-radius: .1rem; line-height: 1.2rem; padding: .25rem .4rem; white-space: nowrap; -} - -.input-group .input-group-addon.addon-sm { +}.input-group .input-group-addon.addon-sm { font-size: .7rem; padding: .05rem .3rem; -} - -.input-group .input-group-addon.addon-lg { +}.input-group .input-group-addon.addon-lg { font-size: .9rem; padding: .35rem .6rem; -} - -.input-group .form-input, +}.input-group .form-input, .input-group .form-select { -ms-flex: 1 1 auto; flex: 1 1 auto; width: 1%; -} - -.input-group .input-group-btn { +}.input-group .input-group-btn { z-index: 1; -} - -.input-group .form-input:first-child:not(:last-child), +}.input-group .form-input:first-child:not(:last-child), .input-group .form-select:first-child:not(:last-child), .input-group .input-group-addon:first-child:not(:last-child), .input-group .input-group-btn:first-child:not(:last-child) { border-bottom-right-radius: 0; border-top-right-radius: 0; -} - -.input-group .form-input:not(:first-child):not(:last-child), +}.input-group .form-input:not(:first-child):not(:last-child), .input-group .form-select:not(:first-child):not(:last-child), .input-group .input-group-addon:not(:first-child):not(:last-child), .input-group .input-group-btn:not(:first-child):not(:last-child) { border-radius: 0; margin-left: -.05rem; -} - -.input-group .form-input:last-child:not(:first-child), +}.input-group .form-input:last-child:not(:first-child), .input-group .form-select:last-child:not(:first-child), .input-group .input-group-addon:last-child:not(:first-child), .input-group .input-group-btn:last-child:not(:first-child) { border-bottom-left-radius: 0; border-top-left-radius: 0; margin-left: -.05rem; -} - -.input-group .form-input:focus, +}.input-group .form-input:focus, .input-group .form-select:focus, .input-group .input-group-addon:focus, .input-group .input-group-btn:focus { z-index: 2; -} - -.input-group .form-select { +}.input-group .form-select { width: auto; -} - -.input-group.input-inline { +}.input-group.input-inline { display: -ms-inline-flexbox; display: inline-flex; -} - -.has-success .form-input, +}.has-success .form-input, .form-input.is-success, .has-success .form-select, .form-select.is-success { background: #f9fdfa; border-color: #32b643; -} - -.has-success .form-input:focus, +}.has-success .form-input:focus, .form-input.is-success:focus, .has-success .form-select:focus, .form-select.is-success:focus { - box-shadow: 0 0 0 .1rem rgba(50, 182, 67, .2); -} - -.has-error .form-input, + box-shadow: 0 0 0 .1rem rgba(50,182,67,.2); +}.has-error .form-input, .form-input.is-error, .has-error .form-select, .form-select.is-error { background: #fffaf7; border-color: #e85600; -} - -.has-error .form-input:focus, +}.has-error .form-input:focus, .form-input.is-error:focus, .has-error .form-select:focus, .form-select.is-error:focus { - box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2); -} - -.has-error .form-checkbox .form-icon, + box-shadow: 0 0 0 .1rem rgba(232,86,0,.2); +}.has-error .form-checkbox .form-icon, .form-checkbox.is-error .form-icon, .has-error .form-radio .form-icon, .form-radio.is-error .form-icon, .has-error .form-switch .form-icon, .form-switch.is-error .form-icon { border-color: #e85600; -} - -.has-error .form-checkbox input:checked + .form-icon, +}.has-error .form-checkbox input:checked + .form-icon, .form-checkbox.is-error input:checked + .form-icon, .has-error .form-radio input:checked + .form-icon, .form-radio.is-error input:checked + .form-icon, @@ -1289,155 +845,103 @@ textarea.form-input.input-sm { .form-switch.is-error input:checked + .form-icon { background: #e85600; border-color: #e85600; -} - -.has-error .form-checkbox input:focus + .form-icon, +}.has-error .form-checkbox input:focus + .form-icon, .form-checkbox.is-error input:focus + .form-icon, .has-error .form-radio input:focus + .form-icon, .form-radio.is-error input:focus + .form-icon, .has-error .form-switch input:focus + .form-icon, .form-switch.is-error input:focus + .form-icon { - border-color: #e85600; - box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2); -} - -.has-error .form-checkbox input:indeterminate + .form-icon, + border-color: #e85600; + box-shadow: 0 0 0 .1rem rgba(232,86,0,.2); +}.has-error .form-checkbox input:indeterminate + .form-icon, .form-checkbox.is-error input:indeterminate + .form-icon { background: #e85600; border-color: #e85600; -} - -.form-input:not(:-ms-input-placeholder):invalid { +}.form-input:not(:-ms-input-placeholder):invalid { border-color: #e85600; -} - -.form-input:not(:placeholder-shown):invalid { +}.form-input:not(:placeholder-shown):invalid { border-color: #e85600; -} - -.form-input:not(:-ms-input-placeholder):invalid:focus { - background: #fffaf7; - box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2); -} - -.form-input:not(:placeholder-shown):invalid:focus { - background: #fffaf7; - box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2); -} - -.form-input:not(:-ms-input-placeholder):invalid + .form-input-hint { +}.form-input:not(:-ms-input-placeholder):invalid:focus { + background: #fffaf7; + box-shadow: 0 0 0 .1rem rgba(232,86,0,.2); +}.form-input:not(:placeholder-shown):invalid:focus { + background: #fffaf7; + box-shadow: 0 0 0 .1rem rgba(232,86,0,.2); +}.form-input:not(:-ms-input-placeholder):invalid + .form-input-hint { color: #e85600; -} - -.form-input:not(:placeholder-shown):invalid + .form-input-hint { +}.form-input:not(:placeholder-shown):invalid + .form-input-hint { color: #e85600; -} - -.form-input:disabled, +}.form-input:disabled, .form-input.disabled, .form-select:disabled, .form-select.disabled { background-color: #eef0f3; cursor: not-allowed; opacity: .5; -} - -.form-input[readonly] { +}.form-input[readonly] { background-color: #f7f8f9; -} - -input:disabled + .form-icon, +}input:disabled + .form-icon, input.disabled + .form-icon { background: #eef0f3; cursor: not-allowed; opacity: .5; -} - -.form-switch input:disabled + .form-icon::before, +}.form-switch input:disabled + .form-icon::before, .form-switch input.disabled + .form-icon::before { background: #fff; -} - -.form-horizontal { +}.form-horizontal { padding: .4rem 0; -} - -.form-horizontal .form-group { +}.form-horizontal .form-group { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -} - -.form-inline { +}.form-inline { display: inline-block; -} - -.label { +}.label { background: #eef0f3; border-radius: .1rem; color: #455060; - display: inline-block; + display: inline-block; line-height: 1.25; padding: .1rem .2rem; -} - -.label.label-rounded { +}.label.label-rounded { border-radius: 5rem; padding-left: .4rem; padding-right: .4rem; -} - -.label.label-primary { +}.label.label-primary { background: #5755d9; color: #fff; -} - -.label.label-secondary { +}.label.label-secondary { background: #f1f1fc; color: #5755d9; -} - -.label.label-success { +}.label.label-success { background: #32b643; color: #fff; -} - -.label.label-warning { +}.label.label-warning { background: #ffb700; color: #fff; -} - -.label.label-error { +}.label.label-error { background: #e85600; color: #fff; -} - -code { +}code { background: #fcf2f2; border-radius: .1rem; color: #d73e48; - font-size: 85%; + font-size: 85%; line-height: 1.25; padding: .1rem .2rem; -} - -.code { +}.code { border-radius: .1rem; color: #3b4351; position: relative; -} - -.code::before { +}.code::before { color: #bcc3ce; content: attr(data-lang); font-size: .7rem; position: absolute; right: .4rem; top: .1rem; -} - -.code code { +}.code code { background: #f7f8f9; color: inherit; display: block; @@ -1445,37 +949,25 @@ code { overflow-x: auto; padding: 1rem; width: 100%; -} - -.img-responsive { +}.img-responsive { display: block; height: auto; max-width: 100%; -} - -.img-fit-cover { +}.img-fit-cover { object-fit: cover; -} - -.img-fit-contain { +}.img-fit-contain { object-fit: contain; -} - -.video-responsive { +}.video-responsive { display: block; overflow: hidden; padding: 0; position: relative; width: 100%; -} - -.video-responsive::before { +}.video-responsive::before { content: ""; display: block; padding-bottom: 56.25%; -} - -.video-responsive iframe, +}.video-responsive iframe, .video-responsive object, .video-responsive embed { border: 0; @@ -1486,71 +978,43 @@ code { right: 0; top: 0; width: 100%; -} - -video.video-responsive { +}video.video-responsive { height: auto; max-width: 100%; -} - -video.video-responsive::before { +}video.video-responsive::before { content: none; -} - -.video-responsive-4-3::before { +}.video-responsive-4-3::before { padding-bottom: 75%; -} - -.video-responsive-1-1::before { +}.video-responsive-1-1::before { padding-bottom: 100%; -} - -.figure { +}.figure { margin: 0 0 .4rem 0; -} - -.figure .figure-caption { +}.figure .figure-caption { color: #66758c; margin-top: .4rem; -} - -.container { +}.container { margin-left: auto; margin-right: auto; padding-left: .4rem; padding-right: .4rem; width: 100%; -} - -.container.grid-xl { +}.container.grid-xl { max-width: 1296px; -} - -.container.grid-lg { +}.container.grid-lg { max-width: 976px; -} - -.container.grid-md { +}.container.grid-md { max-width: 856px; -} - -.container.grid-sm { +}.container.grid-sm { max-width: 616px; -} - -.container.grid-xs { +}.container.grid-xs { max-width: 496px; -} - -.show-xs, +}.show-xs, .show-sm, .show-md, .show-lg, .show-xl { display: none !important; -} - -.cols, +}.cols, .columns { display: -ms-flexbox; display: flex; @@ -1558,49 +1022,39 @@ video.video-responsive::before { flex-wrap: wrap; margin-left: -.4rem; margin-right: -.4rem; -} - -.cols.col-gapless, +}.cols.col-gapless, .columns.col-gapless { margin-left: 0; margin-right: 0; -} - -.cols.col-gapless > .column, +}.cols.col-gapless > .column, .columns.col-gapless > .column { padding-left: 0; padding-right: 0; -} - -.cols.col-oneline, +}.cols.col-oneline, .columns.col-oneline { -ms-flex-wrap: nowrap; flex-wrap: nowrap; overflow-x: auto; -} - -[class~="col-"], +}[class~=col-], .column { -ms-flex: 1; flex: 1; max-width: 100%; padding-left: .4rem; padding-right: .4rem; -} - -[class~="col-"].col-12, -[class~="col-"].col-11, -[class~="col-"].col-10, -[class~="col-"].col-9, -[class~="col-"].col-8, -[class~="col-"].col-7, -[class~="col-"].col-6, -[class~="col-"].col-5, -[class~="col-"].col-4, -[class~="col-"].col-3, -[class~="col-"].col-2, -[class~="col-"].col-1, -[class~="col-"].col-auto, +}[class~=col-].col-12, +[class~=col-].col-11, +[class~=col-].col-10, +[class~=col-].col-9, +[class~=col-].col-8, +[class~=col-].col-7, +[class~=col-].col-6, +[class~=col-].col-5, +[class~=col-].col-4, +[class~=col-].col-3, +[class~=col-].col-2, +[class~=col-].col-1, +[class~=col-].col-auto, .column.col-12, .column.col-11, .column.col-10, @@ -1616,77 +1070,43 @@ video.video-responsive::before { .column.col-auto { -ms-flex: none; flex: none; -} - -.col-12 { +}.col-12 { width: 100%; -} - -.col-11 { +}.col-11 { width: 91.66666667%; -} - -.col-10 { +}.col-10 { width: 83.33333333%; -} - -.col-9 { +}.col-9 { width: 75%; -} - -.col-8 { +}.col-8 { width: 66.66666667%; -} - -.col-7 { +}.col-7 { width: 58.33333333%; -} - -.col-6 { +}.col-6 { width: 50%; -} - -.col-5 { +}.col-5 { width: 41.66666667%; -} - -.col-4 { +}.col-4 { width: 33.33333333%; -} - -.col-3 { +}.col-3 { width: 25%; -} - -.col-2 { +}.col-2 { width: 16.66666667%; -} - -.col-1 { +}.col-1 { width: 8.33333333%; -} - -.col-auto { +}.col-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; max-width: none; width: auto; -} - -.col-mx-auto { +}.col-mx-auto { margin-left: auto; margin-right: auto; -} - -.col-ml-auto { +}.col-ml-auto { margin-left: auto; -} - -.col-mr-auto { +}.col-mr-auto { margin-right: auto; -} - -@media (max-width: 1280px) { +}@media(max-width: 1280px) { .col-xl-12, .col-xl-11, .col-xl-10, @@ -1702,55 +1122,38 @@ video.video-responsive::before { .col-xl-auto { -ms-flex: none; flex: none; - } - .col-xl-12 { + }.col-xl-12 { width: 100%; - } - .col-xl-11 { + }.col-xl-11 { width: 91.66666667%; - } - .col-xl-10 { + }.col-xl-10 { width: 83.33333333%; - } - .col-xl-9 { + }.col-xl-9 { width: 75%; - } - .col-xl-8 { + }.col-xl-8 { width: 66.66666667%; - } - .col-xl-7 { + }.col-xl-7 { width: 58.33333333%; - } - .col-xl-6 { + }.col-xl-6 { width: 50%; - } - .col-xl-5 { + }.col-xl-5 { width: 41.66666667%; - } - .col-xl-4 { + }.col-xl-4 { width: 33.33333333%; - } - .col-xl-3 { + }.col-xl-3 { width: 25%; - } - .col-xl-2 { + }.col-xl-2 { width: 16.66666667%; - } - .col-xl-1 { + }.col-xl-1 { width: 8.33333333%; - } - .col-xl-auto { + }.col-xl-auto { width: auto; - } - .hide-xl { + }.hide-xl { display: none !important; - } - .show-xl { + }.show-xl { display: block !important; } -} - -@media (max-width: 960px) { +}@media(max-width: 960px) { .col-lg-12, .col-lg-11, .col-lg-10, @@ -1766,55 +1169,38 @@ video.video-responsive::before { .col-lg-auto { -ms-flex: none; flex: none; - } - .col-lg-12 { + }.col-lg-12 { width: 100%; - } - .col-lg-11 { + }.col-lg-11 { width: 91.66666667%; - } - .col-lg-10 { + }.col-lg-10 { width: 83.33333333%; - } - .col-lg-9 { + }.col-lg-9 { width: 75%; - } - .col-lg-8 { + }.col-lg-8 { width: 66.66666667%; - } - .col-lg-7 { + }.col-lg-7 { width: 58.33333333%; - } - .col-lg-6 { + }.col-lg-6 { width: 50%; - } - .col-lg-5 { + }.col-lg-5 { width: 41.66666667%; - } - .col-lg-4 { + }.col-lg-4 { width: 33.33333333%; - } - .col-lg-3 { + }.col-lg-3 { width: 25%; - } - .col-lg-2 { + }.col-lg-2 { width: 16.66666667%; - } - .col-lg-1 { + }.col-lg-1 { width: 8.33333333%; - } - .col-lg-auto { + }.col-lg-auto { width: auto; - } - .hide-lg { + }.hide-lg { display: none !important; - } - .show-lg { + }.show-lg { display: block !important; } -} - -@media (max-width: 840px) { +}@media(max-width: 840px) { .col-md-12, .col-md-11, .col-md-10, @@ -1830,55 +1216,38 @@ video.video-responsive::before { .col-md-auto { -ms-flex: none; flex: none; - } - .col-md-12 { + }.col-md-12 { width: 100%; - } - .col-md-11 { + }.col-md-11 { width: 91.66666667%; - } - .col-md-10 { + }.col-md-10 { width: 83.33333333%; - } - .col-md-9 { + }.col-md-9 { width: 75%; - } - .col-md-8 { + }.col-md-8 { width: 66.66666667%; - } - .col-md-7 { + }.col-md-7 { width: 58.33333333%; - } - .col-md-6 { + }.col-md-6 { width: 50%; - } - .col-md-5 { + }.col-md-5 { width: 41.66666667%; - } - .col-md-4 { + }.col-md-4 { width: 33.33333333%; - } - .col-md-3 { + }.col-md-3 { width: 25%; - } - .col-md-2 { + }.col-md-2 { width: 16.66666667%; - } - .col-md-1 { + }.col-md-1 { width: 8.33333333%; - } - .col-md-auto { + }.col-md-auto { width: auto; - } - .hide-md { + }.hide-md { display: none !important; - } - .show-md { + }.show-md { display: block !important; } -} - -@media (max-width: 600px) { +}@media(max-width: 600px) { .col-sm-12, .col-sm-11, .col-sm-10, @@ -1894,55 +1263,38 @@ video.video-responsive::before { .col-sm-auto { -ms-flex: none; flex: none; - } - .col-sm-12 { + }.col-sm-12 { width: 100%; - } - .col-sm-11 { + }.col-sm-11 { width: 91.66666667%; - } - .col-sm-10 { + }.col-sm-10 { width: 83.33333333%; - } - .col-sm-9 { + }.col-sm-9 { width: 75%; - } - .col-sm-8 { + }.col-sm-8 { width: 66.66666667%; - } - .col-sm-7 { + }.col-sm-7 { width: 58.33333333%; - } - .col-sm-6 { + }.col-sm-6 { width: 50%; - } - .col-sm-5 { + }.col-sm-5 { width: 41.66666667%; - } - .col-sm-4 { + }.col-sm-4 { width: 33.33333333%; - } - .col-sm-3 { + }.col-sm-3 { width: 25%; - } - .col-sm-2 { + }.col-sm-2 { width: 16.66666667%; - } - .col-sm-1 { + }.col-sm-1 { width: 8.33333333%; - } - .col-sm-auto { + }.col-sm-auto { width: auto; - } - .hide-sm { + }.hide-sm { display: none !important; - } - .show-sm { + }.show-sm { display: block !important; } -} - -@media (max-width: 480px) { +}@media(max-width: 480px) { .col-xs-12, .col-xs-11, .col-xs-10, @@ -1958,55 +1310,38 @@ video.video-responsive::before { .col-xs-auto { -ms-flex: none; flex: none; - } - .col-xs-12 { + }.col-xs-12 { width: 100%; - } - .col-xs-11 { + }.col-xs-11 { width: 91.66666667%; - } - .col-xs-10 { + }.col-xs-10 { width: 83.33333333%; - } - .col-xs-9 { + }.col-xs-9 { width: 75%; - } - .col-xs-8 { + }.col-xs-8 { width: 66.66666667%; - } - .col-xs-7 { + }.col-xs-7 { width: 58.33333333%; - } - .col-xs-6 { + }.col-xs-6 { width: 50%; - } - .col-xs-5 { + }.col-xs-5 { width: 41.66666667%; - } - .col-xs-4 { + }.col-xs-4 { width: 33.33333333%; - } - .col-xs-3 { + }.col-xs-3 { width: 25%; - } - .col-xs-2 { + }.col-xs-2 { width: 16.66666667%; - } - .col-xs-1 { + }.col-xs-1 { width: 8.33333333%; - } - .col-xs-auto { + }.col-xs-auto { width: auto; - } - .hide-xs { + }.hide-xs { display: none !important; - } - .show-xs { + }.show-xs { display: block !important; } -} - -.hero { +}.hero { display: -ms-flexbox; display: flex; -ms-flex-direction: column; @@ -2015,23 +1350,15 @@ video.video-responsive::before { justify-content: space-between; padding-bottom: 4rem; padding-top: 4rem; -} - -.hero.hero-sm { +}.hero.hero-sm { padding-bottom: 2rem; padding-top: 2rem; -} - -.hero.hero-lg { +}.hero.hero-lg { padding-bottom: 8rem; padding-top: 8rem; -} - -.hero .hero-body { +}.hero .hero-body { padding: .4rem; -} - -.navbar { +}.navbar { align-items: stretch; display: -ms-flexbox; display: flex; @@ -2040,70 +1367,48 @@ video.video-responsive::before { -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; -} - -.navbar .navbar-section { +}.navbar .navbar-section { align-items: center; display: -ms-flexbox; display: flex; -ms-flex: 1 0 0; - flex: 1 0 0; + flex: 1 0 0; -ms-flex-align: center; -} - -.navbar .navbar-section:not(:first-child):last-child { +}.navbar .navbar-section:not(:first-child):last-child { -ms-flex-pack: end; justify-content: flex-end; -} - -.navbar .navbar-center { +}.navbar .navbar-center { align-items: center; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; - flex: 0 0 auto; + flex: 0 0 auto; -ms-flex-align: center; -} - -.navbar .navbar-brand { +}.navbar .navbar-brand { font-size: .9rem; text-decoration: none; -} - -.accordion input:checked ~ .accordion-header > .icon:first-child, +}.accordion input:checked ~ .accordion-header > .icon:first-child, .accordion[open] .accordion-header > .icon:first-child { transform: rotate(90deg); -} - -.accordion input:checked ~ .accordion-body, +}.accordion input:checked ~ .accordion-body, .accordion[open] .accordion-body { max-height: 50rem; -} - -.accordion .accordion-header { +}.accordion .accordion-header { display: block; padding: .2rem .4rem; -} - -.accordion .accordion-header .icon { +}.accordion .accordion-header .icon { transition: transform .25s; -} - -.accordion .accordion-body { +}.accordion .accordion-body { margin-bottom: .4rem; max-height: 0; overflow: hidden; transition: max-height .25s; -} - -summary.accordion-header::-webkit-details-marker { +}summary.accordion-header::-webkit-details-marker { display: none; -} - -.avatar { +}.avatar { background: #5755d9; border-radius: 50%; - color: rgba(255, 255, 255, .85); + color: rgba(255,255,255,.85); display: inline-block; font-size: .8rem; font-weight: 300; @@ -2111,43 +1416,31 @@ summary.accordion-header::-webkit-details-marker { line-height: 1.25; margin: 0; position: relative; - vertical-align: middle; + vertical-align: middle; width: 1.6rem; -} - -.avatar.avatar-xs { +}.avatar.avatar-xs { font-size: .4rem; height: .8rem; width: .8rem; -} - -.avatar.avatar-sm { +}.avatar.avatar-sm { font-size: .6rem; height: 1.2rem; width: 1.2rem; -} - -.avatar.avatar-lg { +}.avatar.avatar-lg { font-size: 1.2rem; height: 2.4rem; width: 2.4rem; -} - -.avatar.avatar-xl { +}.avatar.avatar-xl { font-size: 1.6rem; height: 3.2rem; width: 3.2rem; -} - -.avatar img { +}.avatar img { border-radius: 50%; height: 100%; position: relative; width: 100%; z-index: 1; -} - -.avatar .avatar-icon, +}.avatar .avatar-icon, .avatar .avatar-presence { background: #fff; bottom: 14.64%; @@ -2158,29 +1451,19 @@ summary.accordion-header::-webkit-details-marker { transform: translate(50%, 50%); width: 50%; z-index: 2; -} - -.avatar .avatar-presence { +}.avatar .avatar-presence { background: #bcc3ce; border-radius: 50%; box-shadow: 0 0 0 .1rem #fff; height: .5em; width: .5em; -} - -.avatar .avatar-presence.online { +}.avatar .avatar-presence.online { background: #32b643; -} - -.avatar .avatar-presence.busy { +}.avatar .avatar-presence.busy { background: #e85600; -} - -.avatar .avatar-presence.away { +}.avatar .avatar-presence.away { background: #ffb700; -} - -.avatar[data-initial]::before { +}.avatar[data-initial]::before { color: currentColor; content: attr(data-initial); left: 50%; @@ -2188,14 +1471,10 @@ summary.accordion-header::-webkit-details-marker { top: 50%; transform: translate(-50%, -50%); z-index: 1; -} - -.badge { +}.badge { position: relative; white-space: nowrap; -} - -.badge[data-badge]::after, +}.badge[data-badge]::after, .badge:not([data-badge])::after { background: #5755d9; background-clip: padding-box; @@ -2205,9 +1484,7 @@ summary.accordion-header::-webkit-details-marker { content: attr(data-badge); display: inline-block; transform: translate(-.05rem, -.5rem); -} - -.badge[data-badge]::after { +}.badge[data-badge]::after { font-size: .7rem; height: .9rem; line-height: 1; @@ -2215,59 +1492,41 @@ summary.accordion-header::-webkit-details-marker { padding: .1rem .2rem; text-align: center; white-space: nowrap; -} - -.badge:not([data-badge])::after, +}.badge:not([data-badge])::after, .badge[data-badge=""]::after { height: 6px; min-width: 6px; padding: 0; width: 6px; -} - -.badge.btn::after { +}.badge.btn::after { position: absolute; right: 0; top: 0; transform: translate(50%, -50%); -} - -.badge.avatar::after { +}.badge.avatar::after { position: absolute; right: 14.64%; top: 14.64%; transform: translate(50%, -50%); z-index: 100; -} - -.breadcrumb { +}.breadcrumb { list-style: none; margin: .2rem 0; padding: .2rem 0; -} - -.breadcrumb .breadcrumb-item { +}.breadcrumb .breadcrumb-item { color: #66758c; display: inline-block; margin: 0; padding: .2rem 0; -} - -.breadcrumb .breadcrumb-item:not(:last-child) { +}.breadcrumb .breadcrumb-item:not(:last-child) { margin-right: .2rem; -} - -.breadcrumb .breadcrumb-item:not(:last-child) a { +}.breadcrumb .breadcrumb-item:not(:last-child) a { color: #66758c; -} - -.breadcrumb .breadcrumb-item:not(:first-child)::before { +}.breadcrumb .breadcrumb-item:not(:first-child)::before { color: #66758c; content: "/"; padding-right: .4rem; -} - -.bar { +}.bar { background: #eef0f3; border-radius: .1rem; display: -ms-flexbox; @@ -2276,13 +1535,9 @@ summary.accordion-header::-webkit-details-marker { flex-wrap: nowrap; height: .8rem; width: 100%; -} - -.bar.bar-sm { +}.bar.bar-sm { height: .2rem; -} - -.bar .bar-item { +}.bar .bar-item { background: #5755d9; color: #fff; display: block; @@ -2294,38 +1549,26 @@ summary.accordion-header::-webkit-details-marker { position: relative; text-align: center; width: 0; -} - -.bar .bar-item:first-child { +}.bar .bar-item:first-child { border-bottom-left-radius: .1rem; border-top-left-radius: .1rem; -} - -.bar .bar-item:last-child { +}.bar .bar-item:last-child { border-bottom-right-radius: .1rem; border-top-right-radius: .1rem; -ms-flex-negative: 1; flex-shrink: 1; -} - -.bar-slider { +}.bar-slider { height: .1rem; margin: .4rem 0; position: relative; -} - -.bar-slider .bar-item { +}.bar-slider .bar-item { left: 0; padding: 0; position: absolute; -} - -.bar-slider .bar-item:not(:last-child):first-child { +}.bar-slider .bar-item:not(:last-child):first-child { background: #eef0f3; z-index: 1; -} - -.bar-slider .bar-slider-btn { +}.bar-slider .bar-slider-btn { background: #5755d9; border: 0; border-radius: 50%; @@ -2336,13 +1579,9 @@ summary.accordion-header::-webkit-details-marker { top: 50%; transform: translate(50%, -50%); width: .6rem; -} - -.bar-slider .bar-slider-btn:active { +}.bar-slider .bar-slider-btn:active { box-shadow: 0 0 0 .1rem #5755d9; -} - -.card { +}.card { background: #fff; border: .05rem solid #dadee4; border-radius: .1rem; @@ -2350,45 +1589,29 @@ summary.accordion-header::-webkit-details-marker { display: flex; -ms-flex-direction: column; flex-direction: column; -} - -.card .card-header, +}.card .card-header, .card .card-body, .card .card-footer { padding: .8rem; padding-bottom: 0; -} - -.card .card-header:last-child, +}.card .card-header:last-child, .card .card-body:last-child, .card .card-footer:last-child { padding-bottom: .8rem; -} - -.card .card-body { +}.card .card-body { -ms-flex: 1 1 auto; flex: 1 1 auto; -} - -.card .card-image { +}.card .card-image { padding-top: .8rem; -} - -.card .card-image:first-child { +}.card .card-image:first-child { padding-top: 0; -} - -.card .card-image:first-child img { +}.card .card-image:first-child img { border-top-left-radius: .1rem; border-top-right-radius: .1rem; -} - -.card .card-image:last-child img { +}.card .card-image:last-child img { border-bottom-left-radius: .1rem; border-bottom-right-radius: .1rem; -} - -.chip { +}.chip { align-items: center; background: #eef0f3; border-radius: 5rem; @@ -2406,29 +1629,19 @@ summary.accordion-header::-webkit-details-marker { text-overflow: ellipsis; vertical-align: middle; white-space: nowrap; -} - -.chip.active { +}.chip.active { background: #5755d9; color: #fff; -} - -.chip .avatar { +}.chip .avatar { margin-left: -.4rem; margin-right: .2rem; -} - -.chip .btn-clear { +}.chip .btn-clear { border-radius: 50%; transform: scale(.75); -} - -.dropdown { +}.dropdown { display: inline-block; position: relative; -} - -.dropdown .menu { +}.dropdown .menu { animation: slide-down .15s ease 1; display: none; left: 0; @@ -2436,101 +1649,69 @@ summary.accordion-header::-webkit-details-marker { overflow-y: auto; position: absolute; top: 100%; -} - -.dropdown.dropdown-right .menu { +}.dropdown.dropdown-right .menu { left: auto; right: 0; -} - -.dropdown.active .menu, +}.dropdown.active .menu, .dropdown .dropdown-toggle:focus + .menu, .dropdown .menu:hover { display: block; -} - -.dropdown .btn-group .dropdown-toggle:nth-last-child(2) { +}.dropdown .btn-group .dropdown-toggle:nth-last-child(2) { border-bottom-right-radius: .1rem; border-top-right-radius: .1rem; -} - -.empty { +}.empty { background: #f7f8f9; border-radius: .1rem; color: #66758c; - padding: 3.2rem 1.6rem; + padding: 3.2rem 1.6rem; text-align: center; -} - -.empty .empty-icon { +}.empty .empty-icon { margin-bottom: .8rem; -} - -.empty .empty-title, +}.empty .empty-title, .empty .empty-subtitle { margin: .4rem auto; -} - -.empty .empty-action { +}.empty .empty-action { margin-top: .8rem; -} - -.menu { +}.menu { background: #fff; border-radius: .1rem; - box-shadow: 0 .05rem .2rem rgba(48, 55, 66, .3); + box-shadow: 0 .05rem .2rem rgba(48,55,66,.3); list-style: none; margin: 0; min-width: 180px; padding: .4rem; transform: translateY(.2rem); z-index: 300; -} - -.menu.menu-nav { +}.menu.menu-nav { background: transparent; box-shadow: none; -} - -.menu .menu-item { +}.menu .menu-item { margin-top: 0; padding: 0 .4rem; position: relative; text-decoration: none; -} - -.menu .menu-item > a { +}.menu .menu-item > a { border-radius: .1rem; color: inherit; display: block; margin: 0 -.4rem; padding: .2rem .4rem; text-decoration: none; -} - -.menu .menu-item > a:focus, +}.menu .menu-item > a:focus, .menu .menu-item > a:hover { background: #f1f1fc; color: #5755d9; -} - -.menu .menu-item > a:active, +}.menu .menu-item > a:active, .menu .menu-item > a.active { background: #f1f1fc; color: #5755d9; -} - -.menu .menu-item .form-checkbox, +}.menu .menu-item .form-checkbox, .menu .menu-item .form-radio, .menu .menu-item .form-switch { margin: .1rem 0; -} - -.menu .menu-item + .menu-item { +}.menu .menu-item + .menu-item { margin-top: .2rem; -} - -.menu .menu-badge { +}.menu .menu-badge { align-items: center; display: -ms-flexbox; display: flex; @@ -2539,13 +1720,9 @@ summary.accordion-header::-webkit-details-marker { position: absolute; right: 0; top: 0; -} - -.menu .menu-badge .label { +}.menu .menu-badge .label { margin-right: .4rem; -} - -.modal { +}.modal { align-items: center; bottom: 0; display: none; @@ -2559,19 +1736,15 @@ summary.accordion-header::-webkit-details-marker { position: fixed; right: 0; top: 0; -} - -.modal:target, +}.modal:target, .modal.active { display: -ms-flexbox; display: flex; opacity: 1; z-index: 400; -} - -.modal:target .modal-overlay, +}.modal:target .modal-overlay, .modal.active .modal-overlay { - background: rgba(247, 248, 249, .75); + background: rgba(247,248,249,.75); bottom: 0; cursor: default; display: block; @@ -2579,32 +1752,22 @@ summary.accordion-header::-webkit-details-marker { position: absolute; right: 0; top: 0; -} - -.modal:target .modal-container, +}.modal:target .modal-container, .modal.active .modal-container { animation: slide-down .2s ease 1; z-index: 1; -} - -.modal.modal-sm .modal-container { +}.modal.modal-sm .modal-container { max-width: 320px; padding: 0 .4rem; -} - -.modal.modal-lg .modal-overlay { +}.modal.modal-lg .modal-overlay { background: #fff; -} - -.modal.modal-lg .modal-container { +}.modal.modal-lg .modal-container { box-shadow: none; max-width: 960px; -} - -.modal-container { +}.modal-container { background: #fff; border-radius: .1rem; - box-shadow: 0 .2rem .5rem rgba(48, 55, 66, .3); + box-shadow: 0 .2rem .5rem rgba(48,55,66,.3); display: -ms-flexbox; display: flex; -ms-flex-direction: column; @@ -2613,156 +1776,102 @@ summary.accordion-header::-webkit-details-marker { max-width: 640px; padding: 0 .8rem; width: 100%; -} - -.modal-container.modal-fullheight { +}.modal-container.modal-fullheight { max-height: 100vh; -} - -.modal-container .modal-header { +}.modal-container .modal-header { color: #303742; padding: .8rem; -} - -.modal-container .modal-body { +}.modal-container .modal-body { overflow-y: auto; padding: .8rem; position: relative; -} - -.modal-container .modal-footer { +}.modal-container .modal-footer { padding: .8rem; text-align: right; -} - -.nav { +}.nav { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; list-style: none; margin: .2rem 0; -} - -.nav .nav-item a { +}.nav .nav-item a { color: #66758c; padding: .2rem .4rem; text-decoration: none; -} - -.nav .nav-item a:focus, +}.nav .nav-item a:focus, .nav .nav-item a:hover { color: #5755d9; -} - -.nav .nav-item.active > a { +}.nav .nav-item.active > a { color: #505c6e; font-weight: bold; -} - -.nav .nav-item.active > a:focus, +}.nav .nav-item.active > a:focus, .nav .nav-item.active > a:hover { color: #5755d9; -} - -.nav .nav { +}.nav .nav { margin-bottom: .4rem; margin-left: .8rem; -} - -.pagination { +}.pagination { display: -ms-flexbox; display: flex; list-style: none; margin: .2rem 0; padding: .2rem 0; -} - -.pagination .page-item { +}.pagination .page-item { margin: .2rem .05rem; -} - -.pagination .page-item span { +}.pagination .page-item span { display: inline-block; padding: .2rem .2rem; -} - -.pagination .page-item a { +}.pagination .page-item a { border-radius: .1rem; display: inline-block; padding: .2rem .4rem; text-decoration: none; -} - -.pagination .page-item a:focus, +}.pagination .page-item a:focus, .pagination .page-item a:hover { color: #5755d9; -} - -.pagination .page-item.disabled a { +}.pagination .page-item.disabled a { cursor: default; opacity: .5; pointer-events: none; -} - -.pagination .page-item.active a { +}.pagination .page-item.active a { background: #5755d9; color: #fff; -} - -.pagination .page-item.page-prev, +}.pagination .page-item.page-prev, .pagination .page-item.page-next { -ms-flex: 1 0 50%; flex: 1 0 50%; -} - -.pagination .page-item.page-next { +}.pagination .page-item.page-next { text-align: right; -} - -.pagination .page-item .page-item-title { +}.pagination .page-item .page-item-title { margin: 0; -} - -.pagination .page-item .page-item-subtitle { +}.pagination .page-item .page-item-subtitle { margin: 0; opacity: .5; -} - -.panel { +}.panel { border: .05rem solid #dadee4; border-radius: .1rem; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -} - -.panel .panel-header, +}.panel .panel-header, .panel .panel-footer { -ms-flex: 0 0 auto; flex: 0 0 auto; padding: .8rem; -} - -.panel .panel-nav { +}.panel .panel-nav { -ms-flex: 0 0 auto; flex: 0 0 auto; -} - -.panel .panel-body { +}.panel .panel-body { -ms-flex: 1 1 auto; flex: 1 1 auto; overflow-y: auto; padding: 0 .8rem; -} - -.popover { +}.popover { display: inline-block; position: relative; -} - -.popover .popover-container { +}.popover .popover-container { left: 50%; opacity: 0; padding: .4rem; @@ -2772,51 +1881,33 @@ summary.accordion-header::-webkit-details-marker { transition: transform .2s; width: 320px; z-index: 300; -} - -.popover *:focus + .popover-container, +}.popover *:focus + .popover-container, .popover:hover .popover-container { display: block; opacity: 1; transform: translate(-50%, -100%) scale(1); -} - -.popover.popover-right .popover-container { +}.popover.popover-right .popover-container { left: 100%; top: 50%; -} - -.popover.popover-right *:focus + .popover-container, +}.popover.popover-right *:focus + .popover-container, .popover.popover-right:hover .popover-container { transform: translate(0, -50%) scale(1); -} - -.popover.popover-bottom .popover-container { +}.popover.popover-bottom .popover-container { left: 50%; top: 100%; -} - -.popover.popover-bottom *:focus + .popover-container, +}.popover.popover-bottom *:focus + .popover-container, .popover.popover-bottom:hover .popover-container { transform: translate(-50%, 0) scale(1); -} - -.popover.popover-left .popover-container { +}.popover.popover-left .popover-container { left: 0; top: 50%; -} - -.popover.popover-left *:focus + .popover-container, +}.popover.popover-left *:focus + .popover-container, .popover.popover-left:hover .popover-container { transform: translate(-100%, -50%) scale(1); -} - -.popover .card { - border: 0; - box-shadow: 0 .2rem .5rem rgba(48, 55, 66, .3); -} - -.step { +}.popover .card { + border: 0; + box-shadow: 0 .2rem .5rem rgba(48,55,66,.3); +}.step { display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; @@ -2824,18 +1915,14 @@ summary.accordion-header::-webkit-details-marker { list-style: none; margin: .2rem 0; width: 100%; -} - -.step .step-item { +}.step .step-item { -ms-flex: 1 1 0; flex: 1 1 0; margin-top: 0; min-height: 1rem; - position: relative; + position: relative; text-align: center; -} - -.step .step-item:not(:first-child)::before { +}.step .step-item:not(:first-child)::before { background: #5755d9; content: ""; height: 2px; @@ -2843,16 +1930,12 @@ summary.accordion-header::-webkit-details-marker { position: absolute; top: 9px; width: 100%; -} - -.step .step-item a { +}.step .step-item a { color: #5755d9; display: inline-block; padding: 20px 10px 0; text-decoration: none; -} - -.step .step-item a::before { +}.step .step-item a::before { background: #5755d9; border: .1rem solid #fff; border-radius: 50%; @@ -2865,26 +1948,16 @@ summary.accordion-header::-webkit-details-marker { transform: translateX(-50%); width: .6rem; z-index: 1; -} - -.step .step-item.active a::before { +}.step .step-item.active a::before { background: #fff; border: .1rem solid #5755d9; -} - -.step .step-item.active ~ .step-item::before { +}.step .step-item.active ~ .step-item::before { background: #dadee4; -} - -.step .step-item.active ~ .step-item a { +}.step .step-item.active ~ .step-item a { color: #bcc3ce; -} - -.step .step-item.active ~ .step-item a::before { +}.step .step-item.active ~ .step-item a::before { background: #dadee4; -} - -.tab { +}.tab { align-items: center; border-bottom: .05rem solid #dadee4; display: -ms-flexbox; @@ -2894,115 +1967,75 @@ summary.accordion-header::-webkit-details-marker { flex-wrap: wrap; list-style: none; margin: .2rem 0 .15rem 0; -} - -.tab .tab-item { +}.tab .tab-item { margin-top: 0; -} - -.tab .tab-item a { +}.tab .tab-item a { border-bottom: .1rem solid transparent; color: inherit; display: block; margin: 0 .4rem 0 0; padding: .4rem .2rem .3rem .2rem; text-decoration: none; -} - -.tab .tab-item a:focus, +}.tab .tab-item a:focus, .tab .tab-item a:hover { color: #5755d9; -} - -.tab .tab-item.active a, +}.tab .tab-item.active a, .tab .tab-item a.active { border-bottom-color: #5755d9; color: #5755d9; -} - -.tab .tab-item.tab-action { +}.tab .tab-item.tab-action { -ms-flex: 1 0 auto; flex: 1 0 auto; text-align: right; -} - -.tab .tab-item .btn-clear { +}.tab .tab-item .btn-clear { margin-top: -.2rem; -} - -.tab.tab-block .tab-item { +}.tab.tab-block .tab-item { -ms-flex: 1 0 0; flex: 1 0 0; text-align: center; -} - -.tab.tab-block .tab-item a { +}.tab.tab-block .tab-item a { margin: 0; -} - -.tab.tab-block .tab-item .badge[data-badge]::after { +}.tab.tab-block .tab-item .badge[data-badge]::after { position: absolute; right: .1rem; top: .1rem; transform: translate(0, 0); -} - -.tab:not(.tab-block) .badge { +}.tab:not(.tab-block) .badge { padding-right: 0; -} - -.tile { +}.tile { align-content: space-between; align-items: flex-start; display: -ms-flexbox; - display: flex; + display: flex; -ms-flex-align: start; -ms-flex-line-pack: justify; -} - -.tile .tile-icon, +}.tile .tile-icon, .tile .tile-action { -ms-flex: 0 0 auto; flex: 0 0 auto; -} - -.tile .tile-content { +}.tile .tile-content { -ms-flex: 1 1 auto; flex: 1 1 auto; -} - -.tile .tile-content:not(:first-child) { +}.tile .tile-content:not(:first-child) { padding-left: .4rem; -} - -.tile .tile-content:not(:last-child) { +}.tile .tile-content:not(:last-child) { padding-right: .4rem; -} - -.tile .tile-title, +}.tile .tile-title, .tile .tile-subtitle { line-height: 1.2rem; -} - -.tile.tile-centered { - align-items: center; +}.tile.tile-centered { + align-items: center; -ms-flex-align: center; -} - -.tile.tile-centered .tile-content { +}.tile.tile-centered .tile-content { overflow: hidden; -} - -.tile.tile-centered .tile-title, +}.tile.tile-centered .tile-title, .tile.tile-centered .tile-subtitle { - margin-bottom: 0; + margin-bottom: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -} - -.toast { - background: rgba(48, 55, 66, .95); +}.toast { + background: rgba(48,55,66,.95); border: .05rem solid #303742; border-color: #303742; border-radius: .1rem; @@ -3010,54 +2043,34 @@ summary.accordion-header::-webkit-details-marker { display: block; padding: .4rem; width: 100%; -} - -.toast.toast-primary { - background: rgba(87, 85, 217, .95); +}.toast.toast-primary { + background: rgba(87,85,217,.95); border-color: #5755d9; -} - -.toast.toast-success { - background: rgba(50, 182, 67, .95); +}.toast.toast-success { + background: rgba(50,182,67,.95); border-color: #32b643; -} - -.toast.toast-warning { - background: rgba(255, 183, 0, .95); +}.toast.toast-warning { + background: rgba(255,183,0,.95); border-color: #ffb700; -} - -.toast.toast-error { - background: rgba(232, 86, 0, .95); +}.toast.toast-error { + background: rgba(232,86,0,.95); border-color: #e85600; -} - -.toast a { +}.toast a { color: #fff; text-decoration: underline; -} - -.toast a:focus, +}.toast a:focus, .toast a:hover, .toast a:active, .toast a.active { opacity: .75; -} - -.toast .btn-clear { +}.toast .btn-clear { margin: .1rem; -} - -.toast p:last-child { +}.toast p:last-child { margin-bottom: 0; -} - -.tooltip { +}.tooltip { position: relative; -} - -.tooltip::after { - background: rgba(48, 55, 66, .95); +}.tooltip::after { + background: rgba(48,55,66,.95); border-radius: .1rem; bottom: 100%; color: #fff; @@ -3073,282 +2086,166 @@ summary.accordion-header::-webkit-details-marker { position: absolute; text-overflow: ellipsis; transform: translate(-50%, .4rem); - transition: opacity .2s, transform .2s; + transition: opacity .2s,transform .2s; white-space: pre; z-index: 300; -} - -.tooltip:focus::after, +}.tooltip:focus::after, .tooltip:hover::after { opacity: 1; transform: translate(-50%, -.2rem); -} - -.tooltip[disabled], +}.tooltip[disabled], .tooltip.disabled { pointer-events: auto; -} - -.tooltip.tooltip-right::after { +}.tooltip.tooltip-right::after { bottom: 50%; left: 100%; transform: translate(-.2rem, 50%); -} - -.tooltip.tooltip-right:focus::after, +}.tooltip.tooltip-right:focus::after, .tooltip.tooltip-right:hover::after { transform: translate(.2rem, 50%); -} - -.tooltip.tooltip-bottom::after { +}.tooltip.tooltip-bottom::after { bottom: auto; top: 100%; transform: translate(-50%, -.4rem); -} - -.tooltip.tooltip-bottom:focus::after, +}.tooltip.tooltip-bottom:focus::after, .tooltip.tooltip-bottom:hover::after { transform: translate(-50%, .2rem); -} - -.tooltip.tooltip-left::after { +}.tooltip.tooltip-left::after { bottom: 50%; left: auto; right: 100%; transform: translate(.4rem, 50%); -} - -.tooltip.tooltip-left:focus::after, +}.tooltip.tooltip-left:focus::after, .tooltip.tooltip-left:hover::after { transform: translate(-.2rem, 50%); -} - -@keyframes loading { +}@keyframes loading { 0% { transform: rotate(0deg); - } - 100% { + }100% { transform: rotate(360deg); } -} - -@keyframes slide-down { +}@keyframes slide-down { 0% { opacity: 0; transform: translateY(-1.6rem); - } - 100% { + }100% { opacity: 1; transform: translateY(0); } -} - -.text-primary { +}.text-primary { color: #5755d9 !important; -} - -a.text-primary:focus, +}a.text-primary:focus, a.text-primary:hover { color: #4240d4; -} - -a.text-primary:visited { +}a.text-primary:visited { color: #6c6ade; -} - -.text-secondary { +}.text-secondary { color: #e5e5f9 !important; -} - -a.text-secondary:focus, +}a.text-secondary:focus, a.text-secondary:hover { color: #d1d0f4; -} - -a.text-secondary:visited { +}a.text-secondary:visited { color: #fafafe; -} - -.text-gray { +}.text-gray { color: #bcc3ce !important; -} - -a.text-gray:focus, +}a.text-gray:focus, a.text-gray:hover { color: #adb6c4; -} - -a.text-gray:visited { +}a.text-gray:visited { color: #cbd0d9; -} - -.text-light { +}.text-light { color: #fff !important; -} - -a.text-light:focus, +}a.text-light:focus, a.text-light:hover { color: #f2f2f2; -} - -a.text-light:visited { - color: white; -} - -.text-dark { +}a.text-light:visited { + color: #fff; +}.text-dark { color: #3b4351 !important; -} - -a.text-dark:focus, +}a.text-dark:focus, a.text-dark:hover { color: #303742; -} - -a.text-dark:visited { +}a.text-dark:visited { color: #455060; -} - -.text-success { +}.text-success { color: #32b643 !important; -} - -a.text-success:focus, +}a.text-success:focus, a.text-success:hover { color: #2da23c; -} - -a.text-success:visited { +}a.text-success:visited { color: #39c94b; -} - -.text-warning { +}.text-warning { color: #ffb700 !important; -} - -a.text-warning:focus, +}a.text-warning:focus, a.text-warning:hover { color: #e6a500; -} - -a.text-warning:visited { +}a.text-warning:visited { color: #ffbe1a; -} - -.text-error { +}.text-error { color: #e85600 !important; -} - -a.text-error:focus, +}a.text-error:focus, a.text-error:hover { color: #cf4d00; -} - -a.text-error:visited { +}a.text-error:visited { color: #ff6003; -} - -.bg-primary { +}.bg-primary { background: #5755d9 !important; color: #fff; -} - -.bg-secondary { +}.bg-secondary { background: #f1f1fc !important; -} - -.bg-dark { +}.bg-dark { background: #303742 !important; color: #fff; -} - -.bg-gray { +}.bg-gray { background: #f7f8f9 !important; -} - -.bg-success { +}.bg-success { background: #32b643 !important; color: #fff; -} - -.bg-warning { +}.bg-warning { background: #ffb700 !important; color: #fff; -} - -.bg-error { +}.bg-error { background: #e85600 !important; color: #fff; -} - -.c-hand { +}.c-hand { cursor: pointer; -} - -.c-move { +}.c-move { cursor: move; -} - -.c-zoom-in { +}.c-zoom-in { cursor: zoom-in; -} - -.c-zoom-out { +}.c-zoom-out { cursor: zoom-out; -} - -.c-not-allowed { +}.c-not-allowed { cursor: not-allowed; -} - -.c-auto { +}.c-auto { cursor: auto; -} - -.d-block { +}.d-block { display: block; -} - -.d-inline { +}.d-inline { display: inline; -} - -.d-inline-block { +}.d-inline-block { display: inline-block; -} - -.d-flex { +}.d-flex { display: -ms-flexbox; display: flex; -} - -.d-inline-flex { +}.d-inline-flex { display: -ms-inline-flexbox; display: inline-flex; -} - -.d-none, +}.d-none, .d-hide { display: none !important; -} - -.d-visible { +}.d-visible { visibility: visible; -} - -.d-invisible { +}.d-invisible { visibility: hidden; -} - -.text-hide { +}.text-hide { background: transparent; border: 0; color: transparent; font-size: 0; line-height: 0; text-shadow: none; -} - -.text-assistive { +}.text-assistive { border: 0; clip: rect(0, 0, 0, 0); height: 1px; @@ -3357,15 +2254,11 @@ a.text-error:visited { padding: 0; position: absolute; width: 1px; -} - -.divider, +}.divider, .divider-vert { display: block; position: relative; -} - -.divider[data-content]::after, +}.divider[data-content]::after, .divider-vert[data-content]::after { background: #fff; color: #bcc3ce; @@ -3374,24 +2267,16 @@ a.text-error:visited { font-size: .7rem; padding: 0 .4rem; transform: translateY(-.65rem); -} - -.divider { +}.divider { border-top: .05rem solid #f1f3f5; height: .05rem; margin: .4rem 0; -} - -.divider[data-content] { +}.divider[data-content] { margin: .8rem 0; -} - -.divider-vert { +}.divider-vert { display: block; padding: .8rem; -} - -.divider-vert::before { +}.divider-vert::before { border-left: .05rem solid #dadee4; bottom: .4rem; content: ""; @@ -3400,24 +2285,18 @@ a.text-error:visited { position: absolute; top: .4rem; transform: translateX(-50%); -} - -.divider-vert[data-content]::after { +}.divider-vert[data-content]::after { left: 50%; padding: .2rem 0; position: absolute; top: 50%; transform: translate(-50%, -50%); -} - -.loading { +}.loading { color: transparent !important; min-height: .8rem; pointer-events: none; position: relative; -} - -.loading::after { +}.loading::after { animation: loading 500ms infinite linear; background: transparent; border: .1rem solid #5755d9; @@ -3436,336 +2315,187 @@ a.text-error:visited { top: 50%; width: .8rem; z-index: 1; -} - -.loading.loading-lg { +}.loading.loading-lg { min-height: 2rem; -} - -.loading.loading-lg::after { +}.loading.loading-lg::after { height: 1.6rem; margin-left: -.8rem; margin-top: -.8rem; width: 1.6rem; -} - -.clearfix::after { +}.clearfix::after { clear: both; content: ""; display: table; -} - -.float-left { +}.float-left { float: left !important; -} - -.float-right { +}.float-right { float: right !important; -} - -.p-relative { +}.p-relative { position: relative !important; -} - -.p-absolute { +}.p-absolute { position: absolute !important; -} - -.p-fixed { +}.p-fixed { position: fixed !important; -} - -.p-sticky { +}.p-sticky { position: -webkit-sticky !important; position: sticky !important; -} - -.p-centered { +}.p-centered { display: block; float: none; margin-left: auto; margin-right: auto; -} - -.flex-centered { +}.flex-centered { align-items: center; display: -ms-flexbox; display: flex; -ms-flex-align: center; -ms-flex-pack: center; justify-content: center; -} - -.m-0 { +}.m-0 { margin: 0 !important; -} - -.mb-0 { +}.mb-0 { margin-bottom: 0 !important; -} - -.ml-0 { +}.ml-0 { margin-left: 0 !important; -} - -.mr-0 { +}.mr-0 { margin-right: 0 !important; -} - -.mt-0 { +}.mt-0 { margin-top: 0 !important; -} - -.mx-0 { +}.mx-0 { margin-left: 0 !important; margin-right: 0 !important; -} - -.my-0 { +}.my-0 { margin-bottom: 0 !important; margin-top: 0 !important; -} - -.m-1 { +}.m-1 { margin: .2rem !important; -} - -.mb-1 { +}.mb-1 { margin-bottom: .2rem !important; -} - -.ml-1 { +}.ml-1 { margin-left: .2rem !important; -} - -.mr-1 { +}.mr-1 { margin-right: .2rem !important; -} - -.mt-1 { +}.mt-1 { margin-top: .2rem !important; -} - -.mx-1 { +}.mx-1 { margin-left: .2rem !important; margin-right: .2rem !important; -} - -.my-1 { +}.my-1 { margin-bottom: .2rem !important; margin-top: .2rem !important; -} - -.m-2 { +}.m-2 { margin: .4rem !important; -} - -.mb-2 { +}.mb-2 { margin-bottom: .4rem !important; -} - -.ml-2 { +}.ml-2 { margin-left: .4rem !important; -} - -.mr-2 { +}.mr-2 { margin-right: .4rem !important; -} - -.mt-2 { +}.mt-2 { margin-top: .4rem !important; -} - -.mx-2 { +}.mx-2 { margin-left: .4rem !important; margin-right: .4rem !important; -} - -.my-2 { +}.my-2 { margin-bottom: .4rem !important; margin-top: .4rem !important; -} - -.p-0 { +}.p-0 { padding: 0 !important; -} - -.pb-0 { +}.pb-0 { padding-bottom: 0 !important; -} - -.pl-0 { +}.pl-0 { padding-left: 0 !important; -} - -.pr-0 { +}.pr-0 { padding-right: 0 !important; -} - -.pt-0 { +}.pt-0 { padding-top: 0 !important; -} - -.px-0 { +}.px-0 { padding-left: 0 !important; padding-right: 0 !important; -} - -.py-0 { +}.py-0 { padding-bottom: 0 !important; padding-top: 0 !important; -} - -.p-1 { +}.p-1 { padding: .2rem !important; -} - -.pb-1 { +}.pb-1 { padding-bottom: .2rem !important; -} - -.pl-1 { +}.pl-1 { padding-left: .2rem !important; -} - -.pr-1 { +}.pr-1 { padding-right: .2rem !important; -} - -.pt-1 { +}.pt-1 { padding-top: .2rem !important; -} - -.px-1 { +}.px-1 { padding-left: .2rem !important; padding-right: .2rem !important; -} - -.py-1 { +}.py-1 { padding-bottom: .2rem !important; padding-top: .2rem !important; -} - -.p-2 { +}.p-2 { padding: .4rem !important; -} - -.pb-2 { +}.pb-2 { padding-bottom: .4rem !important; -} - -.pl-2 { +}.pl-2 { padding-left: .4rem !important; -} - -.pr-2 { +}.pr-2 { padding-right: .4rem !important; -} - -.pt-2 { +}.pt-2 { padding-top: .4rem !important; -} - -.px-2 { +}.px-2 { padding-left: .4rem !important; padding-right: .4rem !important; -} - -.py-2 { +}.py-2 { padding-bottom: .4rem !important; padding-top: .4rem !important; -} - -.s-rounded { +}.s-rounded { border-radius: .1rem; -} - -.s-circle { +}.s-circle { border-radius: 50%; -} - -.text-left { +}.text-left { text-align: left; -} - -.text-right { +}.text-right { text-align: right; -} - -.text-center { +}.text-center { text-align: center; -} - -.text-justify { +}.text-justify { text-align: justify; -} - -.text-lowercase { +}.text-lowercase { text-transform: lowercase; -} - -.text-uppercase { +}.text-uppercase { text-transform: uppercase; -} - -.text-capitalize { +}.text-capitalize { text-transform: capitalize; -} - -.text-normal { +}.text-normal { font-weight: normal; -} - -.text-bold { +}.text-bold { font-weight: bold; -} - -.text-italic { +}.text-italic { font-style: italic; -} - -.text-large { +}.text-large { font-size: 1.2em; -} - -.text-small { +}.text-small { font-size: .9em; -} - -.text-tiny { +}.text-tiny { font-size: .8em; -} - -.text-muted { +}.text-muted { opacity: .8; -} - -.text-ellipsis { +}.text-ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -} - -.text-clip { +}.text-clip { overflow: hidden; text-overflow: clip; white-space: nowrap; -} - -.text-break { +}.text-break { -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; word-break: break-word; word-wrap: break-word; -} - -/*! Spectre.css Experimentals v0.5.9 | MIT License | github.com/picturepan2/spectre */ -.form-autocomplete { +}/*! Spectre.css v0.5.9 | MIT License | github.com/picturepan2/spectre */.form-autocomplete { position: relative; -} - -.form-autocomplete .form-autocomplete-input { +}.form-autocomplete .form-autocomplete-input { align-content: flex-start; display: -ms-flexbox; display: flex; @@ -3775,14 +2505,10 @@ a.text-error:visited { height: auto; min-height: 1.6rem; padding: .1rem; -} - -.form-autocomplete .form-autocomplete-input.is-focused { - border-color: #5755d9; - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.form-autocomplete .form-autocomplete-input .form-input { +}.form-autocomplete .form-autocomplete-input.is-focused { + border-color: #5755d9; + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.form-autocomplete .form-autocomplete-input .form-input { border-color: transparent; box-shadow: none; display: inline-block; @@ -3792,34 +2518,24 @@ a.text-error:visited { line-height: .8rem; margin: .1rem; width: auto; -} - -.form-autocomplete .menu { +}.form-autocomplete .menu { left: 0; position: absolute; top: 100%; width: 100%; -} - -.form-autocomplete.autocomplete-oneline .form-autocomplete-input { +}.form-autocomplete.autocomplete-oneline .form-autocomplete-input { -ms-flex-wrap: nowrap; flex-wrap: nowrap; overflow-x: auto; -} - -.form-autocomplete.autocomplete-oneline .chip { +}.form-autocomplete.autocomplete-oneline .chip { -ms-flex: 1 0 auto; flex: 1 0 auto; -} - -.calendar { +}.calendar { border: .05rem solid #dadee4; border-radius: .1rem; display: block; min-width: 280px; -} - -.calendar .calendar-nav { +}.calendar .calendar-nav { align-items: center; background: #f7f8f9; border-top-left-radius: .1rem; @@ -3829,9 +2545,7 @@ a.text-error:visited { -ms-flex-align: center; font-size: .9rem; padding: .4rem; -} - -.calendar .calendar-header, +}.calendar .calendar-header, .calendar .calendar-body { display: -ms-flexbox; display: flex; @@ -3840,33 +2554,23 @@ a.text-error:visited { flex-wrap: wrap; justify-content: center; padding: .4rem 0; -} - -.calendar .calendar-header .calendar-date, +}.calendar .calendar-header .calendar-date, .calendar .calendar-body .calendar-date { -ms-flex: 0 0 14.28%; flex: 0 0 14.28%; max-width: 14.28%; -} - -.calendar .calendar-header { +}.calendar .calendar-header { background: #f7f8f9; border-bottom: .05rem solid #dadee4; color: #bcc3ce; font-size: .7rem; text-align: center; -} - -.calendar .calendar-body { +}.calendar .calendar-body { color: #66758c; -} - -.calendar .calendar-date { +}.calendar .calendar-date { border: 0; padding: .2rem; -} - -.calendar .calendar-date .date-item { +}.calendar .calendar-date .date-item { -webkit-appearance: none; -moz-appearance: none; appearance: none; @@ -3883,64 +2587,46 @@ a.text-error:visited { position: relative; text-align: center; text-decoration: none; - transition: background .2s, border .2s, box-shadow .2s, color .2s; + transition: background .2s,border .2s,box-shadow .2s,color .2s; vertical-align: middle; white-space: nowrap; width: 1.4rem; -} - -.calendar .calendar-date .date-item.date-today { +}.calendar .calendar-date .date-item.date-today { border-color: #e5e5f9; color: #5755d9; -} - -.calendar .calendar-date .date-item:focus { - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.calendar .calendar-date .date-item:focus, +}.calendar .calendar-date .date-item:focus { + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.calendar .calendar-date .date-item:focus, .calendar .calendar-date .date-item:hover { background: #fefeff; border-color: #e5e5f9; color: #5755d9; text-decoration: none; -} - -.calendar .calendar-date .date-item:active, +}.calendar .calendar-date .date-item:active, .calendar .calendar-date .date-item.active { background: #4b48d6; border-color: #3634d2; color: #fff; -} - -.calendar .calendar-date .date-item.badge::after { +}.calendar .calendar-date .date-item.badge::after { position: absolute; right: 3px; top: 3px; transform: translate(50%, -50%); -} - -.calendar .calendar-date .date-item:disabled, +}.calendar .calendar-date .date-item:disabled, .calendar .calendar-date .date-item.disabled, .calendar .calendar-date .calendar-event:disabled, .calendar .calendar-date .calendar-event.disabled { cursor: default; opacity: .25; pointer-events: none; -} - -.calendar .calendar-date.prev-month .date-item, +}.calendar .calendar-date.prev-month .date-item, .calendar .calendar-date.prev-month .calendar-event, .calendar .calendar-date.next-month .date-item, .calendar .calendar-date.next-month .calendar-event { opacity: .25; -} - -.calendar .calendar-range { +}.calendar .calendar-range { position: relative; -} - -.calendar .calendar-range::before { +}.calendar .calendar-range::before { background: #f1f1fc; content: ""; height: 1.4rem; @@ -3949,32 +2635,20 @@ a.text-error:visited { right: 0; top: 50%; transform: translateY(-50%); -} - -.calendar .calendar-range.range-start::before { +}.calendar .calendar-range.range-start::before { left: 50%; -} - -.calendar .calendar-range.range-end::before { +}.calendar .calendar-range.range-end::before { right: 50%; -} - -.calendar .calendar-range.range-start .date-item, +}.calendar .calendar-range.range-start .date-item, .calendar .calendar-range.range-end .date-item { background: #4b48d6; border-color: #3634d2; color: #fff; -} - -.calendar .calendar-range .date-item { +}.calendar .calendar-range .date-item { color: #5755d9; -} - -.calendar.calendar-lg .calendar-body { +}.calendar.calendar-lg .calendar-body { padding: 0; -} - -.calendar.calendar-lg .calendar-body .calendar-date { +}.calendar.calendar-lg .calendar-body .calendar-date { border-bottom: .05rem solid #dadee4; border-right: .05rem solid #dadee4; display: -ms-flexbox; @@ -3983,46 +2657,30 @@ a.text-error:visited { flex-direction: column; height: 5.5rem; padding: 0; -} - -.calendar.calendar-lg .calendar-body .calendar-date:nth-child(7n) { +}.calendar.calendar-lg .calendar-body .calendar-date:nth-child(7n) { border-right: 0; -} - -.calendar.calendar-lg .calendar-body .calendar-date:nth-last-child(-n+7) { +}.calendar.calendar-lg .calendar-body .calendar-date:nth-last-child(-n+7) { border-bottom: 0; -} - -.calendar.calendar-lg .date-item { +}.calendar.calendar-lg .date-item { align-self: flex-end; -ms-flex-item-align: end; height: 1.4rem; margin-right: .2rem; margin-top: .2rem; -} - -.calendar.calendar-lg .calendar-range::before { +}.calendar.calendar-lg .calendar-range::before { top: 19px; -} - -.calendar.calendar-lg .calendar-range.range-start::before { +}.calendar.calendar-lg .calendar-range.range-start::before { left: auto; width: 19px; -} - -.calendar.calendar-lg .calendar-range.range-end::before { +}.calendar.calendar-lg .calendar-range.range-end::before { right: 19px; -} - -.calendar.calendar-lg .calendar-events { +}.calendar.calendar-lg .calendar-events { flex-grow: 1; -ms-flex-positive: 1; line-height: 1; overflow-y: auto; padding: .2rem; -} - -.calendar.calendar-lg .calendar-event { +}.calendar.calendar-lg .calendar-event { border-radius: .1rem; display: block; font-size: .7rem; @@ -4031,33 +2689,27 @@ a.text-error:visited { padding: 3px 4px; text-overflow: ellipsis; white-space: nowrap; -} - -.carousel .carousel-locator:nth-of-type(1):checked ~ .carousel-container .carousel-item:nth-of-type(1), -.carousel .carousel-locator:nth-of-type(2):checked ~ .carousel-container .carousel-item:nth-of-type(2), -.carousel .carousel-locator:nth-of-type(3):checked ~ .carousel-container .carousel-item:nth-of-type(3), -.carousel .carousel-locator:nth-of-type(4):checked ~ .carousel-container .carousel-item:nth-of-type(4), -.carousel .carousel-locator:nth-of-type(5):checked ~ .carousel-container .carousel-item:nth-of-type(5), -.carousel .carousel-locator:nth-of-type(6):checked ~ .carousel-container .carousel-item:nth-of-type(6), +}.carousel .carousel-locator:nth-of-type(8):checked ~ .carousel-container .carousel-item:nth-of-type(8), .carousel .carousel-locator:nth-of-type(7):checked ~ .carousel-container .carousel-item:nth-of-type(7), -.carousel .carousel-locator:nth-of-type(8):checked ~ .carousel-container .carousel-item:nth-of-type(8) { +.carousel .carousel-locator:nth-of-type(6):checked ~ .carousel-container .carousel-item:nth-of-type(6), +.carousel .carousel-locator:nth-of-type(5):checked ~ .carousel-container .carousel-item:nth-of-type(5), +.carousel .carousel-locator:nth-of-type(4):checked ~ .carousel-container .carousel-item:nth-of-type(4), +.carousel .carousel-locator:nth-of-type(3):checked ~ .carousel-container .carousel-item:nth-of-type(3), +.carousel .carousel-locator:nth-of-type(2):checked ~ .carousel-container .carousel-item:nth-of-type(2), +.carousel .carousel-locator:nth-of-type(1):checked ~ .carousel-container .carousel-item:nth-of-type(1) { animation: carousel-slidein .75s ease-in-out 1; opacity: 1; z-index: 100; -} - -.carousel .carousel-locator:nth-of-type(1):checked ~ .carousel-nav .nav-item:nth-of-type(1), -.carousel .carousel-locator:nth-of-type(2):checked ~ .carousel-nav .nav-item:nth-of-type(2), -.carousel .carousel-locator:nth-of-type(3):checked ~ .carousel-nav .nav-item:nth-of-type(3), -.carousel .carousel-locator:nth-of-type(4):checked ~ .carousel-nav .nav-item:nth-of-type(4), -.carousel .carousel-locator:nth-of-type(5):checked ~ .carousel-nav .nav-item:nth-of-type(5), -.carousel .carousel-locator:nth-of-type(6):checked ~ .carousel-nav .nav-item:nth-of-type(6), +}.carousel .carousel-locator:nth-of-type(8):checked ~ .carousel-nav .nav-item:nth-of-type(8), .carousel .carousel-locator:nth-of-type(7):checked ~ .carousel-nav .nav-item:nth-of-type(7), -.carousel .carousel-locator:nth-of-type(8):checked ~ .carousel-nav .nav-item:nth-of-type(8) { +.carousel .carousel-locator:nth-of-type(6):checked ~ .carousel-nav .nav-item:nth-of-type(6), +.carousel .carousel-locator:nth-of-type(5):checked ~ .carousel-nav .nav-item:nth-of-type(5), +.carousel .carousel-locator:nth-of-type(4):checked ~ .carousel-nav .nav-item:nth-of-type(4), +.carousel .carousel-locator:nth-of-type(3):checked ~ .carousel-nav .nav-item:nth-of-type(3), +.carousel .carousel-locator:nth-of-type(2):checked ~ .carousel-nav .nav-item:nth-of-type(2), +.carousel .carousel-locator:nth-of-type(1):checked ~ .carousel-nav .nav-item:nth-of-type(1) { color: #f7f8f9; -} - -.carousel { +}.carousel { background: #f7f8f9; display: block; overflow: hidden; @@ -4065,21 +2717,15 @@ a.text-error:visited { position: relative; width: 100%; z-index: 1; -} - -.carousel .carousel-container { +}.carousel .carousel-container { height: 100%; left: 0; position: relative; -} - -.carousel .carousel-container::before { +}.carousel .carousel-container::before { content: ""; display: block; padding-bottom: 56.25%; -} - -.carousel .carousel-container .carousel-item { +}.carousel .carousel-container .carousel-item { animation: carousel-slideout 1s ease-in-out 1; height: 100%; left: 0; @@ -4088,17 +2734,13 @@ a.text-error:visited { position: absolute; top: 0; width: 100%; -} - -.carousel .carousel-container .carousel-item:hover .item-prev, +}.carousel .carousel-container .carousel-item:hover .item-prev, .carousel .carousel-container .carousel-item:hover .item-next { opacity: 1; -} - -.carousel .carousel-container .item-prev, +}.carousel .carousel-container .item-prev, .carousel .carousel-container .item-next { - background: rgba(247, 248, 249, .25); - border-color: rgba(247, 248, 249, .5); + background: rgba(247,248,249,.25); + border-color: rgba(247,248,249,.5); color: #f7f8f9; opacity: 0; position: absolute; @@ -4106,17 +2748,11 @@ a.text-error:visited { transform: translateY(-50%); transition: all .4s; z-index: 100; -} - -.carousel .carousel-container .item-prev { +}.carousel .carousel-container .item-prev { left: 1rem; -} - -.carousel .carousel-container .item-next { +}.carousel .carousel-container .item-next { right: 1rem; -} - -.carousel .carousel-nav { +}.carousel .carousel-nav { bottom: .4rem; display: -ms-flexbox; display: flex; @@ -4127,10 +2763,8 @@ a.text-error:visited { transform: translateX(-50%); width: 10rem; z-index: 100; -} - -.carousel .carousel-nav .nav-item { - color: rgba(247, 248, 249, .5); +}.carousel .carousel-nav .nav-item { + color: rgba(247,248,249,.5); display: block; -ms-flex: 1 0 auto; flex: 1 0 auto; @@ -4138,9 +2772,7 @@ a.text-error:visited { margin: .2rem; max-width: 2.5rem; position: relative; -} - -.carousel .carousel-nav .nav-item::before { +}.carousel .carousel-nav .nav-item::before { background: currentColor; content: ""; display: block; @@ -4148,37 +2780,27 @@ a.text-error:visited { position: absolute; top: .5rem; width: 100%; -} - -@keyframes carousel-slidein { +}@keyframes carousel-slidein { 0% { transform: translateX(100%); - } - 100% { + }100% { transform: translateX(0); } -} - -@keyframes carousel-slideout { +}@keyframes carousel-slideout { 0% { opacity: 1; transform: translateX(0); - } - 100% { + }100% { opacity: 1; transform: translateX(-50%); } -} - -.comparison-slider { +}.comparison-slider { height: 50vh; overflow: hidden; - -webkit-overflow-scrolling: touch; + -webkit-overflow-scrolling: touch; position: relative; width: 100%; -} - -.comparison-slider .comparison-before, +}.comparison-slider .comparison-before, .comparison-slider .comparison-after { height: 100%; left: 0; @@ -4186,33 +2808,23 @@ a.text-error:visited { overflow: hidden; position: absolute; top: 0; -} - -.comparison-slider .comparison-before img, +}.comparison-slider .comparison-before img, .comparison-slider .comparison-after img { height: 100%; object-fit: cover; object-position: left center; position: absolute; width: 100%; -} - -.comparison-slider .comparison-before { +}.comparison-slider .comparison-before { width: 100%; z-index: 1; -} - -.comparison-slider .comparison-before .comparison-label { +}.comparison-slider .comparison-before .comparison-label { right: .8rem; -} - -.comparison-slider .comparison-after { +}.comparison-slider .comparison-after { max-width: 100%; min-width: 0; z-index: 2; -} - -.comparison-slider .comparison-after::before { +}.comparison-slider .comparison-after::before { background: transparent; content: ""; cursor: default; @@ -4222,12 +2834,10 @@ a.text-error:visited { right: .8rem; top: 0; z-index: 1; -} - -.comparison-slider .comparison-after::after { +}.comparison-slider .comparison-after::after { background: currentColor; border-radius: 50%; - box-shadow: 0 -5px, 0 5px; + box-shadow: 0 -5px,0 5px; color: #fff; content: ""; height: 3px; @@ -4237,13 +2847,9 @@ a.text-error:visited { top: 50%; transform: translate(50%, -50%); width: 3px; -} - -.comparison-slider .comparison-after .comparison-label { +}.comparison-slider .comparison-after .comparison-label { left: .8rem; -} - -.comparison-slider .comparison-resizer { +}.comparison-slider .comparison-resizer { animation: first-run 1.5s 1 ease-in-out; cursor: ew-resize; height: .8rem; @@ -4257,74 +2863,55 @@ a.text-error:visited { top: 50%; transform: translateY(-50%) scaleY(30); width: 0; -} - -.comparison-slider .comparison-label { - background: rgba(48, 55, 66, .5); +}.comparison-slider .comparison-label { + background: rgba(48,55,66,.5); bottom: .8rem; color: #fff; padding: .2rem .4rem; position: absolute; -webkit-user-select: none; - -moz-user-select: none; -ms-user-select: none; user-select: none; -} - -@keyframes first-run { +}@keyframes first-run { 0% { width: 0; - } - 25% { + }25% { width: 2.4rem; - } - 50% { + }50% { width: .8rem; - } - 75% { + }75% { width: 1.2rem; - } - 100% { + }100% { width: 0; } -} - -.filter .filter-tag#tag-0:checked ~ .filter-nav .chip[for="tag-0"], -.filter .filter-tag#tag-1:checked ~ .filter-nav .chip[for="tag-1"], -.filter .filter-tag#tag-2:checked ~ .filter-nav .chip[for="tag-2"], -.filter .filter-tag#tag-3:checked ~ .filter-nav .chip[for="tag-3"], -.filter .filter-tag#tag-4:checked ~ .filter-nav .chip[for="tag-4"], -.filter .filter-tag#tag-5:checked ~ .filter-nav .chip[for="tag-5"], -.filter .filter-tag#tag-6:checked ~ .filter-nav .chip[for="tag-6"], -.filter .filter-tag#tag-7:checked ~ .filter-nav .chip[for="tag-7"], -.filter .filter-tag#tag-8:checked ~ .filter-nav .chip[for="tag-8"] { +}.filter .filter-tag#tag-8:checked ~ .filter-nav .chip[for=tag-8], +.filter .filter-tag#tag-7:checked ~ .filter-nav .chip[for=tag-7], +.filter .filter-tag#tag-6:checked ~ .filter-nav .chip[for=tag-6], +.filter .filter-tag#tag-5:checked ~ .filter-nav .chip[for=tag-5], +.filter .filter-tag#tag-4:checked ~ .filter-nav .chip[for=tag-4], +.filter .filter-tag#tag-3:checked ~ .filter-nav .chip[for=tag-3], +.filter .filter-tag#tag-2:checked ~ .filter-nav .chip[for=tag-2], +.filter .filter-tag#tag-1:checked ~ .filter-nav .chip[for=tag-1], +.filter .filter-tag#tag-0:checked ~ .filter-nav .chip[for=tag-0] { background: #5755d9; color: #fff; -} - -.filter .filter-tag#tag-1:checked ~ .filter-body .filter-item:not([data-tag~="tag-1"]), -.filter .filter-tag#tag-2:checked ~ .filter-body .filter-item:not([data-tag~="tag-2"]), -.filter .filter-tag#tag-3:checked ~ .filter-body .filter-item:not([data-tag~="tag-3"]), -.filter .filter-tag#tag-4:checked ~ .filter-body .filter-item:not([data-tag~="tag-4"]), -.filter .filter-tag#tag-5:checked ~ .filter-body .filter-item:not([data-tag~="tag-5"]), -.filter .filter-tag#tag-6:checked ~ .filter-body .filter-item:not([data-tag~="tag-6"]), -.filter .filter-tag#tag-7:checked ~ .filter-body .filter-item:not([data-tag~="tag-7"]), -.filter .filter-tag#tag-8:checked ~ .filter-body .filter-item:not([data-tag~="tag-8"]) { +}.filter .filter-tag#tag-8:checked ~ .filter-body .filter-item:not([data-tag~=tag-8]), +.filter .filter-tag#tag-7:checked ~ .filter-body .filter-item:not([data-tag~=tag-7]), +.filter .filter-tag#tag-6:checked ~ .filter-body .filter-item:not([data-tag~=tag-6]), +.filter .filter-tag#tag-5:checked ~ .filter-body .filter-item:not([data-tag~=tag-5]), +.filter .filter-tag#tag-4:checked ~ .filter-body .filter-item:not([data-tag~=tag-4]), +.filter .filter-tag#tag-3:checked ~ .filter-body .filter-item:not([data-tag~=tag-3]), +.filter .filter-tag#tag-2:checked ~ .filter-body .filter-item:not([data-tag~=tag-2]), +.filter .filter-tag#tag-1:checked ~ .filter-body .filter-item:not([data-tag~=tag-1]) { display: none; -} - -.filter .filter-nav { +}.filter .filter-nav { margin: .4rem 0; -} - -.filter .filter-body { +}.filter .filter-body { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -} - -.meter { +}.meter { -webkit-appearance: none; -moz-appearance: none; appearance: none; @@ -4332,57 +2919,35 @@ a.text-error:visited { border: 0; border-radius: .1rem; display: block; - height: .8rem; + height: .8rem; width: 100%; -} - -.meter::-webkit-meter-inner-element { +}.meter::-webkit-meter-inner-element { display: block; -} - -.meter::-webkit-meter-bar, +}.meter::-webkit-meter-bar, .meter::-webkit-meter-optimum-value, .meter::-webkit-meter-suboptimum-value, .meter::-webkit-meter-even-less-good-value { border-radius: .1rem; -} - -.meter::-webkit-meter-bar { +}.meter::-webkit-meter-bar { background: #f7f8f9; -} - -.meter::-webkit-meter-optimum-value { +}.meter::-webkit-meter-optimum-value { background: #32b643; -} - -.meter::-webkit-meter-suboptimum-value { +}.meter::-webkit-meter-suboptimum-value { background: #ffb700; -} - -.meter::-webkit-meter-even-less-good-value { +}.meter::-webkit-meter-even-less-good-value { background: #e85600; -} - -.meter::-moz-meter-bar, +}.meter::-moz-meter-bar, .meter:-moz-meter-optimum, .meter:-moz-meter-sub-optimum, .meter:-moz-meter-sub-sub-optimum { border-radius: .1rem; -} - -.meter:-moz-meter-optimum::-moz-meter-bar { +}.meter:-moz-meter-optimum::-moz-meter-bar { background: #32b643; -} - -.meter:-moz-meter-sub-optimum::-moz-meter-bar { +}.meter:-moz-meter-sub-optimum::-moz-meter-bar { background: #ffb700; -} - -.meter:-moz-meter-sub-sub-optimum::-moz-meter-bar { +}.meter:-moz-meter-sub-sub-optimum::-moz-meter-bar { background: #e85600; -} - -.off-canvas { +}.off-canvas { display: -ms-flexbox; display: flex; -ms-flex-flow: nowrap; @@ -4390,39 +2955,31 @@ a.text-error:visited { height: 100%; position: relative; width: 100%; -} - -.off-canvas .off-canvas-toggle { +}.off-canvas .off-canvas-toggle { display: block; + left: .4rem; position: absolute; - right: .4rem; top: .4rem; transition: none; z-index: 1; -} - -.off-canvas .off-canvas-sidebar { +}.off-canvas .off-canvas-sidebar { background: #f7f8f9; bottom: 0; + left: 0; min-width: 10rem; overflow-y: auto; position: fixed; - right: 0; top: 0; - transform: translateX(100%); + transform: translateX(-100%); transition: transform .25s; z-index: 200; -} - -.off-canvas .off-canvas-content { +}.off-canvas .off-canvas-content { -ms-flex: 1 1 auto; flex: 1 1 auto; height: 100%; padding: .4rem .4rem .4rem 4rem; -} - -.off-canvas .off-canvas-overlay { - background: rgba(48, 55, 66, .1); +}.off-canvas .off-canvas-overlay { + background: rgba(48,55,66,.1); border-color: transparent; border-radius: 0; bottom: 0; @@ -4433,51 +2990,37 @@ a.text-error:visited { right: 0; top: 0; width: 100%; -} - -.off-canvas .off-canvas-sidebar:target, +}.off-canvas .off-canvas-sidebar:target, .off-canvas .off-canvas-sidebar.active { transform: translateX(0); -} - -.off-canvas .off-canvas-sidebar:target ~ .off-canvas-overlay, +}.off-canvas .off-canvas-sidebar:target ~ .off-canvas-overlay, .off-canvas .off-canvas-sidebar.active ~ .off-canvas-overlay { display: block; z-index: 100; -} - -@media (min-width: 960px) { +}@media(min-width: 960px) { .off-canvas.off-canvas-sidebar-show .off-canvas-toggle { display: none; - } - .off-canvas.off-canvas-sidebar-show .off-canvas-sidebar { + }.off-canvas.off-canvas-sidebar-show .off-canvas-sidebar { -ms-flex: 0 0 auto; flex: 0 0 auto; position: relative; transform: none; - } - .off-canvas.off-canvas-sidebar-show .off-canvas-overlay { + }.off-canvas.off-canvas-sidebar-show .off-canvas-overlay { display: none !important; } -} - -.parallax { +}.parallax { display: block; height: auto; position: relative; width: auto; -} - -.parallax .parallax-content { - box-shadow: 0 1rem 2.1rem rgba(48, 55, 66, .3); +}.parallax .parallax-content { + box-shadow: 0 1rem 2.1rem rgba(48,55,66,.3); height: auto; transform: perspective(1000px); transform-style: preserve-3d; transition: all .4s ease; width: 100%; -} - -.parallax .parallax-content::before { +}.parallax .parallax-content::before { content: ""; display: block; height: 100%; @@ -4485,9 +3028,7 @@ a.text-error:visited { position: absolute; top: 0; width: 100%; -} - -.parallax .parallax-front { +}.parallax .parallax-front { align-items: center; color: #fff; display: -ms-flexbox; @@ -4499,115 +3040,81 @@ a.text-error:visited { left: 0; position: absolute; text-align: center; - text-shadow: 0 0 20px rgba(48, 55, 66, .75); + text-shadow: 0 0 20px rgba(48,55,66,.75); top: 0; transform: translateZ(50px) scale(.95); transition: transform .4s; width: 100%; z-index: 1; -} - -.parallax .parallax-top-left { +}.parallax .parallax-top-left { height: 50%; left: 0; outline: none; position: absolute; - top: 0; + top: 0; width: 50%; z-index: 100; -} - -.parallax .parallax-top-left:focus ~ .parallax-content, +}.parallax .parallax-top-left:focus ~ .parallax-content, .parallax .parallax-top-left:hover ~ .parallax-content { transform: perspective(1000px) rotateX(3deg) rotateY(-3deg); -} - -.parallax .parallax-top-left:focus ~ .parallax-content::before, +}.parallax .parallax-top-left:focus ~ .parallax-content::before, .parallax .parallax-top-left:hover ~ .parallax-content::before { background: linear-gradient(135deg, rgba(255, 255, 255, .35) 0%, transparent 50%); -} - -.parallax .parallax-top-left:focus ~ .parallax-content .parallax-front, +}.parallax .parallax-top-left:focus ~ .parallax-content .parallax-front, .parallax .parallax-top-left:hover ~ .parallax-content .parallax-front { transform: translate3d(4.5px, 4.5px, 50px) scale(.95); -} - -.parallax .parallax-top-right { +}.parallax .parallax-top-right { height: 50%; outline: none; position: absolute; right: 0; - top: 0; + top: 0; width: 50%; z-index: 100; -} - -.parallax .parallax-top-right:focus ~ .parallax-content, +}.parallax .parallax-top-right:focus ~ .parallax-content, .parallax .parallax-top-right:hover ~ .parallax-content { transform: perspective(1000px) rotateX(3deg) rotateY(3deg); -} - -.parallax .parallax-top-right:focus ~ .parallax-content::before, +}.parallax .parallax-top-right:focus ~ .parallax-content::before, .parallax .parallax-top-right:hover ~ .parallax-content::before { background: linear-gradient(-135deg, rgba(255, 255, 255, .35) 0%, transparent 50%); -} - -.parallax .parallax-top-right:focus ~ .parallax-content .parallax-front, +}.parallax .parallax-top-right:focus ~ .parallax-content .parallax-front, .parallax .parallax-top-right:hover ~ .parallax-content .parallax-front { transform: translate3d(-4.5px, 4.5px, 50px) scale(.95); -} - -.parallax .parallax-bottom-left { +}.parallax .parallax-bottom-left { bottom: 0; height: 50%; - left: 0; + left: 0; outline: none; position: absolute; width: 50%; z-index: 100; -} - -.parallax .parallax-bottom-left:focus ~ .parallax-content, +}.parallax .parallax-bottom-left:focus ~ .parallax-content, .parallax .parallax-bottom-left:hover ~ .parallax-content { transform: perspective(1000px) rotateX(-3deg) rotateY(-3deg); -} - -.parallax .parallax-bottom-left:focus ~ .parallax-content::before, +}.parallax .parallax-bottom-left:focus ~ .parallax-content::before, .parallax .parallax-bottom-left:hover ~ .parallax-content::before { background: linear-gradient(45deg, rgba(255, 255, 255, .35) 0%, transparent 50%); -} - -.parallax .parallax-bottom-left:focus ~ .parallax-content .parallax-front, +}.parallax .parallax-bottom-left:focus ~ .parallax-content .parallax-front, .parallax .parallax-bottom-left:hover ~ .parallax-content .parallax-front { transform: translate3d(4.5px, -4.5px, 50px) scale(.95); -} - -.parallax .parallax-bottom-right { +}.parallax .parallax-bottom-right { bottom: 0; height: 50%; outline: none; position: absolute; - right: 0; + right: 0; width: 50%; z-index: 100; -} - -.parallax .parallax-bottom-right:focus ~ .parallax-content, +}.parallax .parallax-bottom-right:focus ~ .parallax-content, .parallax .parallax-bottom-right:hover ~ .parallax-content { transform: perspective(1000px) rotateX(-3deg) rotateY(3deg); -} - -.parallax .parallax-bottom-right:focus ~ .parallax-content::before, +}.parallax .parallax-bottom-right:focus ~ .parallax-content::before, .parallax .parallax-bottom-right:hover ~ .parallax-content::before { background: linear-gradient(-45deg, rgba(255, 255, 255, .35) 0%, transparent 50%); -} - -.parallax .parallax-bottom-right:focus ~ .parallax-content .parallax-front, +}.parallax .parallax-bottom-right:focus ~ .parallax-content .parallax-front, .parallax .parallax-bottom-right:hover ~ .parallax-content .parallax-front { transform: translate3d(-4.5px, -4.5px, 50px) scale(.95); -} - -.progress { +}.progress { -webkit-appearance: none; -moz-appearance: none; appearance: none; @@ -4618,61 +3125,40 @@ a.text-error:visited { height: .2rem; position: relative; width: 100%; -} - -.progress::-webkit-progress-bar { +}.progress::-webkit-progress-bar { background: transparent; border-radius: .1rem; -} - -.progress::-webkit-progress-value { +}.progress::-webkit-progress-value { background: #5755d9; border-radius: .1rem; -} - -.progress::-moz-progress-bar { +}.progress::-moz-progress-bar { background: #5755d9; border-radius: .1rem; -} - -.progress:indeterminate { +}.progress:indeterminate { animation: progress-indeterminate 1.5s linear infinite; background: #eef0f3 linear-gradient(to right, #5755d9 30%, #eef0f3 30%) top left/150% 150% no-repeat; -} - -.progress:indeterminate::-moz-progress-bar { +}.progress:indeterminate::-moz-progress-bar { background: transparent; -} - -@keyframes progress-indeterminate { +}@keyframes progress-indeterminate { 0% { background-position: 200% 0; - } - 100% { + }100% { background-position: -200% 0; } -} - -.slider { +}.slider { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: transparent; display: block; - height: 1.2rem; + height: 1.2rem; width: 100%; -} - -.slider:focus { - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); +}.slider:focus { + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); outline: none; -} - -.slider.tooltip:not([data-tooltip])::after { +}.slider.tooltip:not([data-tooltip])::after { content: attr(value); -} - -.slider::-webkit-slider-thumb { +}.slider::-webkit-slider-thumb { -webkit-appearance: none; background: #5755d9; border: 0; @@ -4682,9 +3168,7 @@ a.text-error:visited { -webkit-transition: transform .2s; transition: transform .2s; width: .6rem; -} - -.slider::-moz-range-thumb { +}.slider::-moz-range-thumb { background: #5755d9; border: 0; border-radius: 50%; @@ -4692,9 +3176,7 @@ a.text-error:visited { -moz-transition: transform .2s; transition: transform .2s; width: .6rem; -} - -.slider::-ms-thumb { +}.slider::-ms-thumb { background: #5755d9; border: 0; border-radius: 50%; @@ -4702,71 +3184,47 @@ a.text-error:visited { -ms-transition: transform .2s; transition: transform .2s; width: .6rem; -} - -.slider:active::-webkit-slider-thumb { +}.slider:active::-webkit-slider-thumb { transform: scale(1.25); -} - -.slider:active::-moz-range-thumb { +}.slider:active::-moz-range-thumb { transform: scale(1.25); -} - -.slider:active::-ms-thumb { +}.slider:active::-ms-thumb { transform: scale(1.25); -} - -.slider:disabled::-webkit-slider-thumb, +}.slider:disabled::-webkit-slider-thumb, .slider.disabled::-webkit-slider-thumb { background: #f7f8f9; transform: scale(1); -} - -.slider:disabled::-moz-range-thumb, +}.slider:disabled::-moz-range-thumb, .slider.disabled::-moz-range-thumb { background: #f7f8f9; transform: scale(1); -} - -.slider:disabled::-ms-thumb, +}.slider:disabled::-ms-thumb, .slider.disabled::-ms-thumb { background: #f7f8f9; transform: scale(1); -} - -.slider::-webkit-slider-runnable-track { +}.slider::-webkit-slider-runnable-track { background: #eef0f3; border-radius: .1rem; height: .1rem; width: 100%; -} - -.slider::-moz-range-track { +}.slider::-moz-range-track { background: #eef0f3; border-radius: .1rem; height: .1rem; width: 100%; -} - -.slider::-ms-track { +}.slider::-ms-track { background: #eef0f3; border-radius: .1rem; height: .1rem; width: 100%; -} - -.slider::-ms-fill-lower { +}.slider::-ms-fill-lower { background: #5755d9; -} - -.timeline .timeline-item { +}.timeline .timeline-item { display: -ms-flexbox; display: flex; margin-bottom: 1.2rem; position: relative; -} - -.timeline .timeline-item::before { +}.timeline .timeline-item::before { background: #dadee4; content: ""; height: 100%; @@ -4774,20 +3232,14 @@ a.text-error:visited { position: absolute; top: 1.2rem; width: 2px; -} - -.timeline .timeline-item .timeline-left { +}.timeline .timeline-item .timeline-left { -ms-flex: 0 0 auto; flex: 0 0 auto; -} - -.timeline .timeline-item .timeline-content { +}.timeline .timeline-item .timeline-content { -ms-flex: 1 1 auto; flex: 1 1 auto; padding: 2px 0 2px .8rem; -} - -.timeline .timeline-item .timeline-icon { +}.timeline .timeline-item .timeline-icon { align-items: center; border-radius: 50%; color: #fff; @@ -4799,9 +3251,7 @@ a.text-error:visited { justify-content: center; text-align: center; width: 1.2rem; -} - -.timeline .timeline-item .timeline-icon::before { +}.timeline .timeline-item .timeline-icon::before { border: .1rem solid #5755d9; border-radius: 50%; content: ""; @@ -4811,183 +3261,101 @@ a.text-error:visited { position: absolute; top: .4rem; width: .4rem; -} - -.timeline .timeline-item .timeline-icon.icon-lg { +}.timeline .timeline-item .timeline-icon.icon-lg { background: #5755d9; line-height: 1.2rem; -} - -.timeline .timeline-item .timeline-icon.icon-lg::before { +}.timeline .timeline-item .timeline-icon.icon-lg::before { content: none; -} - -.viewer-360 { +}.viewer-360 { align-items: center; display: -ms-flexbox; display: flex; -ms-flex-align: center; -ms-flex-direction: column; flex-direction: column; -} - -.viewer-360 .viewer-slider[max="36"][value="1"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="1"] + .viewer-image { background-position-y: 0; -} - -.viewer-360 .viewer-slider[max="36"][value="2"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="2"] + .viewer-image { background-position-y: 2.8571428571%; -} - -.viewer-360 .viewer-slider[max="36"][value="3"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="3"] + .viewer-image { background-position-y: 5.7142857143%; -} - -.viewer-360 .viewer-slider[max="36"][value="4"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="4"] + .viewer-image { background-position-y: 8.5714285714%; -} - -.viewer-360 .viewer-slider[max="36"][value="5"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="5"] + .viewer-image { background-position-y: 11.4285714286%; -} - -.viewer-360 .viewer-slider[max="36"][value="6"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="6"] + .viewer-image { background-position-y: 14.2857142857%; -} - -.viewer-360 .viewer-slider[max="36"][value="7"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="7"] + .viewer-image { background-position-y: 17.1428571429%; -} - -.viewer-360 .viewer-slider[max="36"][value="8"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="8"] + .viewer-image { background-position-y: 20%; -} - -.viewer-360 .viewer-slider[max="36"][value="9"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="9"] + .viewer-image { background-position-y: 22.8571428571%; -} - -.viewer-360 .viewer-slider[max="36"][value="10"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="10"] + .viewer-image { background-position-y: 25.7142857143%; -} - -.viewer-360 .viewer-slider[max="36"][value="11"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="11"] + .viewer-image { background-position-y: 28.5714285714%; -} - -.viewer-360 .viewer-slider[max="36"][value="12"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="12"] + .viewer-image { background-position-y: 31.4285714286%; -} - -.viewer-360 .viewer-slider[max="36"][value="13"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="13"] + .viewer-image { background-position-y: 34.2857142857%; -} - -.viewer-360 .viewer-slider[max="36"][value="14"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="14"] + .viewer-image { background-position-y: 37.1428571429%; -} - -.viewer-360 .viewer-slider[max="36"][value="15"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="15"] + .viewer-image { background-position-y: 40%; -} - -.viewer-360 .viewer-slider[max="36"][value="16"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="16"] + .viewer-image { background-position-y: 42.8571428571%; -} - -.viewer-360 .viewer-slider[max="36"][value="17"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="17"] + .viewer-image { background-position-y: 45.7142857143%; -} - -.viewer-360 .viewer-slider[max="36"][value="18"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="18"] + .viewer-image { background-position-y: 48.5714285714%; -} - -.viewer-360 .viewer-slider[max="36"][value="19"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="19"] + .viewer-image { background-position-y: 51.4285714286%; -} - -.viewer-360 .viewer-slider[max="36"][value="20"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="20"] + .viewer-image { background-position-y: 54.2857142857%; -} - -.viewer-360 .viewer-slider[max="36"][value="21"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="21"] + .viewer-image { background-position-y: 57.1428571429%; -} - -.viewer-360 .viewer-slider[max="36"][value="22"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="22"] + .viewer-image { background-position-y: 60%; -} - -.viewer-360 .viewer-slider[max="36"][value="23"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="23"] + .viewer-image { background-position-y: 62.8571428571%; -} - -.viewer-360 .viewer-slider[max="36"][value="24"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="24"] + .viewer-image { background-position-y: 65.7142857143%; -} - -.viewer-360 .viewer-slider[max="36"][value="25"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="25"] + .viewer-image { background-position-y: 68.5714285714%; -} - -.viewer-360 .viewer-slider[max="36"][value="26"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="26"] + .viewer-image { background-position-y: 71.4285714286%; -} - -.viewer-360 .viewer-slider[max="36"][value="27"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="27"] + .viewer-image { background-position-y: 74.2857142857%; -} - -.viewer-360 .viewer-slider[max="36"][value="28"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="28"] + .viewer-image { background-position-y: 77.1428571429%; -} - -.viewer-360 .viewer-slider[max="36"][value="29"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="29"] + .viewer-image { background-position-y: 80%; -} - -.viewer-360 .viewer-slider[max="36"][value="30"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="30"] + .viewer-image { background-position-y: 82.8571428571%; -} - -.viewer-360 .viewer-slider[max="36"][value="31"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="31"] + .viewer-image { background-position-y: 85.7142857143%; -} - -.viewer-360 .viewer-slider[max="36"][value="32"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="32"] + .viewer-image { background-position-y: 88.5714285714%; -} - -.viewer-360 .viewer-slider[max="36"][value="33"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="33"] + .viewer-image { background-position-y: 91.4285714286%; -} - -.viewer-360 .viewer-slider[max="36"][value="34"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="34"] + .viewer-image { background-position-y: 94.2857142857%; -} - -.viewer-360 .viewer-slider[max="36"][value="35"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="35"] + .viewer-image { background-position-y: 97.1428571429%; -} - -.viewer-360 .viewer-slider[max="36"][value="36"] + .viewer-image { +}.viewer-360 .viewer-slider[max="36"][value="36"] + .viewer-image { background-position-y: 100%; -} - -.viewer-360 .viewer-slider { +}.viewer-360 .viewer-slider { cursor: ew-resize; -ms-flex-order: 2; margin: 1rem; order: 2; width: 60%; -} - -.viewer-360 .viewer-image { +}.viewer-360 .viewer-image { background-position-y: 0; background-repeat: no-repeat; background-size: 100%; -ms-flex-order: 1; max-width: 100%; order: 1; -} \ No newline at end of file +}/*! Spectre.css Experimentals v0.5.9 | MIT License | github.com/picturepan2/spectre *//*! Spectre.css RTL | MIT License | github.com/picturepan2/spectre */ \ No newline at end of file diff --git a/docs/dist/spectre-rtl.min.css b/docs/dist/spectre-rtl.min.css index 3c5608d02..c1a68ae40 100644 --- a/docs/dist/spectre-rtl.min.css +++ b/docs/dist/spectre-rtl.min.css @@ -1 +1 @@ -/*! Spectre.css RTL | MIT License | github.com/picturepan2/spectre *//*! Spectre.css v0.5.9 | MIT License | github.com/picturepan2/spectre */html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}address{font-style:normal}b,strong{font-weight:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:"SF Mono","Segoe UI Mono","Roboto Mono",Menlo,Courier,monospace;font-size:1em}dfn{font-style:italic}small{font-size:80%;font-weight:400}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}fieldset{border:0;margin:0;padding:0}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item;outline:0}canvas{display:inline-block}template{display:none}[hidden]{display:none}*,::after,::before{box-sizing:inherit}html{box-sizing:border-box;font-size:20px;line-height:1.5;-webkit-tap-highlight-color:transparent}body{background:#fff;color:#3b4351;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;font-size:.8rem;overflow-x:hidden;text-rendering:optimizeLegibility}a{color:#5755d9;outline:0;text-decoration:none}a:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}a.active,a:active,a:focus,a:hover{color:#302ecd;text-decoration:underline}a:visited{color:#807fe2}h1,h2,h3,h4,h5,h6{color:inherit;font-weight:500;line-height:1.2;margin-bottom:.5em;margin-top:0}.h1,.h2,.h3,.h4,.h5,.h6{font-weight:500}.h1,h1{font-size:2rem}.h2,h2{font-size:1.6rem}.h3,h3{font-size:1.4rem}.h4,h4{font-size:1.2rem}.h5,h5{font-size:1rem}.h6,h6{font-size:.8rem}p{margin:0 0 1.2rem}a,ins,u{-webkit-text-decoration-skip:ink edges;text-decoration-skip:ink edges}abbr[title]{border-bottom:.05rem dotted;cursor:help;text-decoration:none}kbd{background:#303742;border-radius:.1rem;color:#fff;font-size:.7rem;line-height:1.25;padding:.1rem .2rem}mark{background:#ffe9b3;border-bottom:.05rem solid #ffd367;border-radius:.1rem;color:#3b4351;padding:.05rem .1rem 0}blockquote{border-left:.1rem solid #dadee4;margin-left:0;padding:.4rem .8rem}blockquote p:last-child{margin-bottom:0}ol,ul{margin:.8rem 0 .8rem .8rem;padding:0}ol ol,ol ul,ul ol,ul ul{margin:.8rem 0 .8rem .8rem}ol li,ul li{margin-top:.4rem}ul{list-style:disc inside}ul ul{list-style-type:circle}ol{list-style:decimal inside}ol ol{list-style-type:lower-alpha}dl dt{font-weight:700}dl dd{margin:.4rem 0 .8rem 0}.lang-zh,.lang-zh-hans,html:lang(zh),html:lang(zh-Hans){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",sans-serif}.lang-zh-hant,html:lang(zh-Hant){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang TC","Hiragino Sans CNS","Microsoft JhengHei","Helvetica Neue",sans-serif}.lang-ja,html:lang(ja){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Hiragino Sans","Hiragino Kaku Gothic Pro","Yu Gothic",YuGothic,Meiryo,"Helvetica Neue",sans-serif}.lang-ko,html:lang(ko){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Malgun Gothic","Helvetica Neue",sans-serif}.lang-cjk ins,.lang-cjk u,:lang(ja) ins,:lang(ja) u,:lang(zh) ins,:lang(zh) u{border-bottom:.05rem solid;text-decoration:none}.lang-cjk del+del,.lang-cjk del+s,.lang-cjk ins+ins,.lang-cjk ins+u,.lang-cjk s+del,.lang-cjk s+s,.lang-cjk u+ins,.lang-cjk u+u,:lang(ja) del+del,:lang(ja) del+s,:lang(ja) ins+ins,:lang(ja) ins+u,:lang(ja) s+del,:lang(ja) s+s,:lang(ja) u+ins,:lang(ja) u+u,:lang(zh) del+del,:lang(zh) del+s,:lang(zh) ins+ins,:lang(zh) ins+u,:lang(zh) s+del,:lang(zh) s+s,:lang(zh) u+ins,:lang(zh) u+u{margin-left:.125em}.table{border-collapse:collapse;border-spacing:0;text-align:right;width:100%}.table.table-striped tbody tr:nth-of-type(odd){background:#f7f8f9}.table tbody tr.active,.table.table-striped tbody tr.active{background:#eef0f3}.table.table-hover tbody tr:hover{background:#eef0f3}.table.table-scroll{display:block;overflow-x:auto;padding-bottom:.75rem;white-space:nowrap}.table td,.table th{border-bottom:.05rem solid #dadee4;padding:.6rem .4rem}.table th{border-bottom-width:.1rem}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:.05rem solid #5755d9;border-radius:.1rem;color:#5755d9;cursor:pointer;display:inline-block;font-size:.8rem;height:1.8rem;line-height:1.2rem;outline:0;padding:.25rem .4rem;text-align:center;text-decoration:none;transition:background .2s,border .2s,box-shadow .2s,color .2s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap}.btn:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.btn:focus,.btn:hover{background:#f1f1fc;border-color:#4b48d6;text-decoration:none}.btn.active,.btn:active{background:#4b48d6;border-color:#3634d2;color:#fff;text-decoration:none}.btn.active.loading::after,.btn:active.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.disabled,.btn:disabled,.btn[disabled]{cursor:default;opacity:.5;pointer-events:none}.btn.btn-primary{background:#5755d9;border-color:#4b48d6;color:#fff}.btn.btn-primary:focus,.btn.btn-primary:hover{background:#4240d4;border-color:#3634d2;color:#fff}.btn.btn-primary.active,.btn.btn-primary:active{background:#3a38d2;border-color:#302ecd;color:#fff}.btn.btn-primary.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-success{background:#32b643;border-color:#2faa3f;color:#fff}.btn.btn-success:focus{box-shadow:0 0 0 .1rem rgba(50,182,67,.2)}.btn.btn-success:focus,.btn.btn-success:hover{background:#30ae40;border-color:#2da23c;color:#fff}.btn.btn-success.active,.btn.btn-success:active{background:#2a9a39;border-color:#278e34;color:#fff}.btn.btn-success.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-error{background:#e85600;border-color:#d95000;color:#fff}.btn.btn-error:focus{box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.btn.btn-error:focus,.btn.btn-error:hover{background:#de5200;border-color:#cf4d00;color:#fff}.btn.btn-error.active,.btn.btn-error:active{background:#c44900;border-color:#b54300;color:#fff}.btn.btn-error.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-link{background:0 0;border-color:transparent;color:#5755d9}.btn.btn-link.active,.btn.btn-link:active,.btn.btn-link:focus,.btn.btn-link:hover{color:#302ecd}.btn.btn-sm{font-size:.7rem;height:1.4rem;padding:.05rem .3rem}.btn.btn-lg{font-size:.9rem;height:2rem;padding:.35rem .6rem}.btn.btn-block{display:block;width:100%}.btn.btn-action{padding-left:0;padding-right:0;width:1.8rem}.btn.btn-action.btn-sm{width:1.4rem}.btn.btn-action.btn-lg{width:2rem}.btn.btn-clear{background:0 0;border:0;color:currentColor;height:1rem;line-height:.8rem;margin-left:.2rem;margin-right:-2px;opacity:1;padding:.1rem;text-decoration:none;width:1rem}.btn.btn-clear:focus,.btn.btn-clear:hover{background:rgba(247,248,249,.5);opacity:.95}.btn.btn-clear::before{content:"\2715"}.btn-group{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.btn-group .btn{-ms-flex:1 0 auto;flex:1 0 auto}.btn-group .btn:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.btn-group .btn:not(:first-child):not(:last-child){border-radius:0;margin-left:-.05rem}.btn-group .btn:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-.05rem}.btn-group .btn.active,.btn-group .btn:active,.btn-group .btn:focus,.btn-group .btn:hover{z-index:1}.btn-group.btn-group-block{display:-ms-flexbox;display:flex}.btn-group.btn-group-block .btn{-ms-flex:1 0 0;flex:1 0 0}.form-group:not(:last-child){margin-bottom:.4rem}fieldset{margin-bottom:.8rem}legend{font-size:.9rem;font-weight:500;margin-bottom:.8rem}.form-label{display:block;line-height:1.2rem;padding:.3rem 0}.form-label.label-sm{font-size:.7rem;padding:.1rem 0}.form-label.label-lg{font-size:.9rem;padding:.4rem 0}.form-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;background-image:none;border:.05rem solid #bcc3ce;border-radius:.1rem;color:#3b4351;display:block;font-size:.8rem;height:1.8rem;line-height:1.2rem;max-width:100%;outline:0;padding:.25rem .4rem;position:relative;transition:background .2s,border .2s,box-shadow .2s,color .2s;width:100%}.form-input:focus{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-input:-ms-input-placeholder{color:#bcc3ce}.form-input::-ms-input-placeholder{color:#bcc3ce}.form-input::placeholder{color:#bcc3ce}.form-input.input-sm{font-size:.7rem;height:1.4rem;padding:.05rem .3rem}.form-input.input-lg{font-size:.9rem;height:2rem;padding:.35rem .6rem}.form-input.input-inline{display:inline-block;vertical-align:middle;width:auto}.form-input[type=file]{height:auto}textarea.form-input,textarea.form-input.input-lg,textarea.form-input.input-sm{height:auto}.form-input-hint{color:#bcc3ce;font-size:.7rem;margin-top:.2rem}.has-success .form-input-hint,.is-success+.form-input-hint{color:#32b643}.has-error .form-input-hint,.is-error+.form-input-hint{color:#e85600}.form-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:.05rem solid #bcc3ce;border-radius:.1rem;color:inherit;font-size:.8rem;height:1.8rem;line-height:1.2rem;outline:0;padding:.25rem .4rem;vertical-align:middle;width:100%}.form-select:focus{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-select::-ms-expand{display:none}.form-select.select-sm{font-size:.7rem;height:1.4rem;padding:.05rem 1.1rem .05rem .3rem}.form-select.select-lg{font-size:.9rem;height:2rem;padding:.35rem 1.4rem .35rem .6rem}.form-select[multiple],.form-select[size]{height:auto;padding:.25rem .4rem}.form-select[multiple] option,.form-select[size] option{padding:.1rem .2rem}.form-select:not([multiple]):not([size]){background:#fff url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center/.4rem .5rem;padding-right:1.2rem}.has-icon-left,.has-icon-right{position:relative}.has-icon-left .form-icon,.has-icon-right .form-icon{height:.8rem;margin:0 .25rem;position:absolute;top:50%;transform:translateY(-50%);width:.8rem;z-index:2}.has-icon-left .form-icon{left:.05rem}.has-icon-left .form-input{padding-left:1.3rem}.has-icon-right .form-icon{right:.05rem}.has-icon-right .form-input{padding-right:1.3rem}.form-checkbox,.form-radio,.form-switch{display:block;line-height:1.2rem;margin:.2rem 0;min-height:1.4rem;padding:.1rem .4rem .1rem 1.2rem;position:relative}.form-checkbox input,.form-radio input,.form-switch input{clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;position:absolute;width:1px}.form-checkbox input:focus+.form-icon,.form-radio input:focus+.form-icon,.form-switch input:focus+.form-icon{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-checkbox input:checked+.form-icon,.form-radio input:checked+.form-icon,.form-switch input:checked+.form-icon{background:#5755d9;border-color:#5755d9}.form-checkbox .form-icon,.form-radio .form-icon,.form-switch .form-icon{border:.05rem solid #bcc3ce;cursor:pointer;display:inline-block;position:absolute;transition:background .2s,border .2s,box-shadow .2s,color .2s}.form-checkbox.input-sm,.form-radio.input-sm,.form-switch.input-sm{font-size:.7rem;margin:0}.form-checkbox.input-lg,.form-radio.input-lg,.form-switch.input-lg{font-size:.9rem;margin:.3rem 0}.form-checkbox .form-icon,.form-radio .form-icon{background:#fff;height:.8rem;left:0;top:.3rem;width:.8rem}.form-checkbox input:active+.form-icon,.form-radio input:active+.form-icon{background:#eef0f3}.form-checkbox .form-icon{border-radius:.1rem}.form-checkbox input:checked+.form-icon::before{background-clip:padding-box;border:.1rem solid #fff;border-left-width:0;border-top-width:0;content:"";height:9px;left:50%;margin-left:-3px;margin-top:-6px;position:absolute;top:50%;transform:rotate(45deg);width:6px}.form-checkbox input:indeterminate+.form-icon{background:#5755d9;border-color:#5755d9}.form-checkbox input:indeterminate+.form-icon::before{background:#fff;content:"";height:2px;left:50%;margin-left:-5px;margin-top:-1px;position:absolute;top:50%;width:10px}.form-radio .form-icon{border-radius:50%}.form-radio input:checked+.form-icon::before{background:#fff;border-radius:50%;content:"";height:6px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:6px}.form-switch{padding-left:2rem}.form-switch .form-icon{background:#bcc3ce;background-clip:padding-box;border-radius:.45rem;height:.9rem;left:0;top:.25rem;width:1.6rem}.form-switch .form-icon::before{background:#fff;border-radius:50%;content:"";display:block;height:.8rem;left:0;position:absolute;top:0;transition:background .2s,border .2s,box-shadow .2s,color .2s,left .2s;width:.8rem}.form-switch input:checked+.form-icon::before{left:14px}.form-switch input:active+.form-icon::before{background:#f7f8f9}.input-group{display:-ms-flexbox;display:flex}.input-group .input-group-addon{background:#f7f8f9;border:.05rem solid #bcc3ce;border-radius:.1rem;line-height:1.2rem;padding:.25rem .4rem;white-space:nowrap}.input-group .input-group-addon.addon-sm{font-size:.7rem;padding:.05rem .3rem}.input-group .input-group-addon.addon-lg{font-size:.9rem;padding:.35rem .6rem}.input-group .form-input,.input-group .form-select{-ms-flex:1 1 auto;flex:1 1 auto;width:1%}.input-group .input-group-btn{z-index:1}.input-group .form-input:first-child:not(:last-child),.input-group .form-select:first-child:not(:last-child),.input-group .input-group-addon:first-child:not(:last-child),.input-group .input-group-btn:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.input-group .form-input:not(:first-child):not(:last-child),.input-group .form-select:not(:first-child):not(:last-child),.input-group .input-group-addon:not(:first-child):not(:last-child),.input-group .input-group-btn:not(:first-child):not(:last-child){border-radius:0;margin-left:-.05rem}.input-group .form-input:last-child:not(:first-child),.input-group .form-select:last-child:not(:first-child),.input-group .input-group-addon:last-child:not(:first-child),.input-group .input-group-btn:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-.05rem}.input-group .form-input:focus,.input-group .form-select:focus,.input-group .input-group-addon:focus,.input-group .input-group-btn:focus{z-index:2}.input-group .form-select{width:auto}.input-group.input-inline{display:-ms-inline-flexbox;display:inline-flex}.form-input.is-success,.form-select.is-success,.has-success .form-input,.has-success .form-select{background:#f9fdfa;border-color:#32b643}.form-input.is-success:focus,.form-select.is-success:focus,.has-success .form-input:focus,.has-success .form-select:focus{box-shadow:0 0 0 .1rem rgba(50,182,67,.2)}.form-input.is-error,.form-select.is-error,.has-error .form-input,.has-error .form-select{background:#fffaf7;border-color:#e85600}.form-input.is-error:focus,.form-select.is-error:focus,.has-error .form-input:focus,.has-error .form-select:focus{box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-checkbox.is-error .form-icon,.form-radio.is-error .form-icon,.form-switch.is-error .form-icon,.has-error .form-checkbox .form-icon,.has-error .form-radio .form-icon,.has-error .form-switch .form-icon{border-color:#e85600}.form-checkbox.is-error input:checked+.form-icon,.form-radio.is-error input:checked+.form-icon,.form-switch.is-error input:checked+.form-icon,.has-error .form-checkbox input:checked+.form-icon,.has-error .form-radio input:checked+.form-icon,.has-error .form-switch input:checked+.form-icon{background:#e85600;border-color:#e85600}.form-checkbox.is-error input:focus+.form-icon,.form-radio.is-error input:focus+.form-icon,.form-switch.is-error input:focus+.form-icon,.has-error .form-checkbox input:focus+.form-icon,.has-error .form-radio input:focus+.form-icon,.has-error .form-switch input:focus+.form-icon{border-color:#e85600;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-checkbox.is-error input:indeterminate+.form-icon,.has-error .form-checkbox input:indeterminate+.form-icon{background:#e85600;border-color:#e85600}.form-input:not(:-ms-input-placeholder):invalid{border-color:#e85600}.form-input:not(:placeholder-shown):invalid{border-color:#e85600}.form-input:not(:-ms-input-placeholder):invalid:focus{background:#fffaf7;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-input:not(:placeholder-shown):invalid:focus{background:#fffaf7;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-input:not(:-ms-input-placeholder):invalid+.form-input-hint{color:#e85600}.form-input:not(:placeholder-shown):invalid+.form-input-hint{color:#e85600}.form-input.disabled,.form-input:disabled,.form-select.disabled,.form-select:disabled{background-color:#eef0f3;cursor:not-allowed;opacity:.5}.form-input[readonly]{background-color:#f7f8f9}input.disabled+.form-icon,input:disabled+.form-icon{background:#eef0f3;cursor:not-allowed;opacity:.5}.form-switch input.disabled+.form-icon::before,.form-switch input:disabled+.form-icon::before{background:#fff}.form-horizontal{padding:.4rem 0}.form-horizontal .form-group{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.form-inline{display:inline-block}.label{background:#eef0f3;border-radius:.1rem;color:#455060;display:inline-block;line-height:1.25;padding:.1rem .2rem}.label.label-rounded{border-radius:5rem;padding-left:.4rem;padding-right:.4rem}.label.label-primary{background:#5755d9;color:#fff}.label.label-secondary{background:#f1f1fc;color:#5755d9}.label.label-success{background:#32b643;color:#fff}.label.label-warning{background:#ffb700;color:#fff}.label.label-error{background:#e85600;color:#fff}code{background:#fcf2f2;border-radius:.1rem;color:#d73e48;font-size:85%;line-height:1.25;padding:.1rem .2rem}.code{border-radius:.1rem;color:#3b4351;position:relative}.code::before{color:#bcc3ce;content:attr(data-lang);font-size:.7rem;position:absolute;right:.4rem;top:.1rem}.code code{background:#f7f8f9;color:inherit;display:block;line-height:1.5;overflow-x:auto;padding:1rem;width:100%}.img-responsive{display:block;height:auto;max-width:100%}.img-fit-cover{object-fit:cover}.img-fit-contain{object-fit:contain}.video-responsive{display:block;overflow:hidden;padding:0;position:relative;width:100%}.video-responsive::before{content:"";display:block;padding-bottom:56.25%}.video-responsive embed,.video-responsive iframe,.video-responsive object{border:0;bottom:0;height:100%;left:0;position:absolute;right:0;top:0;width:100%}video.video-responsive{height:auto;max-width:100%}video.video-responsive::before{content:none}.video-responsive-4-3::before{padding-bottom:75%}.video-responsive-1-1::before{padding-bottom:100%}.figure{margin:0 0 .4rem 0}.figure .figure-caption{color:#66758c;margin-top:.4rem}.container{margin-left:auto;margin-right:auto;padding-left:.4rem;padding-right:.4rem;width:100%}.container.grid-xl{max-width:1296px}.container.grid-lg{max-width:976px}.container.grid-md{max-width:856px}.container.grid-sm{max-width:616px}.container.grid-xs{max-width:496px}.show-lg,.show-md,.show-sm,.show-xl,.show-xs{display:none!important}.cols,.columns{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-left:-.4rem;margin-right:-.4rem}.cols.col-gapless,.columns.col-gapless{margin-left:0;margin-right:0}.cols.col-gapless>.column,.columns.col-gapless>.column{padding-left:0;padding-right:0}.cols.col-oneline,.columns.col-oneline{-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto}.column,[class~=col-]{-ms-flex:1;flex:1;max-width:100%;padding-left:.4rem;padding-right:.4rem}.column.col-1,.column.col-10,.column.col-11,.column.col-12,.column.col-2,.column.col-3,.column.col-4,.column.col-5,.column.col-6,.column.col-7,.column.col-8,.column.col-9,.column.col-auto,[class~=col-].col-1,[class~=col-].col-10,[class~=col-].col-11,[class~=col-].col-12,[class~=col-].col-2,[class~=col-].col-3,[class~=col-].col-4,[class~=col-].col-5,[class~=col-].col-6,[class~=col-].col-7,[class~=col-].col-8,[class~=col-].col-9,[class~=col-].col-auto{-ms-flex:none;flex:none}.col-12{width:100%}.col-11{width:91.66666667%}.col-10{width:83.33333333%}.col-9{width:75%}.col-8{width:66.66666667%}.col-7{width:58.33333333%}.col-6{width:50%}.col-5{width:41.66666667%}.col-4{width:33.33333333%}.col-3{width:25%}.col-2{width:16.66666667%}.col-1{width:8.33333333%}.col-auto{-ms-flex:0 0 auto;flex:0 0 auto;max-width:none;width:auto}.col-mx-auto{margin-left:auto;margin-right:auto}.col-ml-auto{margin-left:auto}.col-mr-auto{margin-right:auto}@media (max-width:1280px){.col-xl-1,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-auto{-ms-flex:none;flex:none}.col-xl-12{width:100%}.col-xl-11{width:91.66666667%}.col-xl-10{width:83.33333333%}.col-xl-9{width:75%}.col-xl-8{width:66.66666667%}.col-xl-7{width:58.33333333%}.col-xl-6{width:50%}.col-xl-5{width:41.66666667%}.col-xl-4{width:33.33333333%}.col-xl-3{width:25%}.col-xl-2{width:16.66666667%}.col-xl-1{width:8.33333333%}.col-xl-auto{width:auto}.hide-xl{display:none!important}.show-xl{display:block!important}}@media (max-width:960px){.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-auto{-ms-flex:none;flex:none}.col-lg-12{width:100%}.col-lg-11{width:91.66666667%}.col-lg-10{width:83.33333333%}.col-lg-9{width:75%}.col-lg-8{width:66.66666667%}.col-lg-7{width:58.33333333%}.col-lg-6{width:50%}.col-lg-5{width:41.66666667%}.col-lg-4{width:33.33333333%}.col-lg-3{width:25%}.col-lg-2{width:16.66666667%}.col-lg-1{width:8.33333333%}.col-lg-auto{width:auto}.hide-lg{display:none!important}.show-lg{display:block!important}}@media (max-width:840px){.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-auto{-ms-flex:none;flex:none}.col-md-12{width:100%}.col-md-11{width:91.66666667%}.col-md-10{width:83.33333333%}.col-md-9{width:75%}.col-md-8{width:66.66666667%}.col-md-7{width:58.33333333%}.col-md-6{width:50%}.col-md-5{width:41.66666667%}.col-md-4{width:33.33333333%}.col-md-3{width:25%}.col-md-2{width:16.66666667%}.col-md-1{width:8.33333333%}.col-md-auto{width:auto}.hide-md{display:none!important}.show-md{display:block!important}}@media (max-width:600px){.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-auto{-ms-flex:none;flex:none}.col-sm-12{width:100%}.col-sm-11{width:91.66666667%}.col-sm-10{width:83.33333333%}.col-sm-9{width:75%}.col-sm-8{width:66.66666667%}.col-sm-7{width:58.33333333%}.col-sm-6{width:50%}.col-sm-5{width:41.66666667%}.col-sm-4{width:33.33333333%}.col-sm-3{width:25%}.col-sm-2{width:16.66666667%}.col-sm-1{width:8.33333333%}.col-sm-auto{width:auto}.hide-sm{display:none!important}.show-sm{display:block!important}}@media (max-width:480px){.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-auto{-ms-flex:none;flex:none}.col-xs-12{width:100%}.col-xs-11{width:91.66666667%}.col-xs-10{width:83.33333333%}.col-xs-9{width:75%}.col-xs-8{width:66.66666667%}.col-xs-7{width:58.33333333%}.col-xs-6{width:50%}.col-xs-5{width:41.66666667%}.col-xs-4{width:33.33333333%}.col-xs-3{width:25%}.col-xs-2{width:16.66666667%}.col-xs-1{width:8.33333333%}.col-xs-auto{width:auto}.hide-xs{display:none!important}.show-xs{display:block!important}}.hero{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:4rem;padding-top:4rem}.hero.hero-sm{padding-bottom:2rem;padding-top:2rem}.hero.hero-lg{padding-bottom:8rem;padding-top:8rem}.hero .hero-body{padding:.4rem}.navbar{align-items:stretch;display:-ms-flexbox;display:flex;-ms-flex-align:stretch;-ms-flex-pack:justify;-ms-flex-wrap:wrap;flex-wrap:wrap;justify-content:space-between}.navbar .navbar-section{align-items:center;display:-ms-flexbox;display:flex;-ms-flex:1 0 0;flex:1 0 0;-ms-flex-align:center}.navbar .navbar-section:not(:first-child):last-child{-ms-flex-pack:end;justify-content:flex-end}.navbar .navbar-center{align-items:center;display:-ms-flexbox;display:flex;-ms-flex:0 0 auto;flex:0 0 auto;-ms-flex-align:center}.navbar .navbar-brand{font-size:.9rem;text-decoration:none}.accordion input:checked~.accordion-header>.icon:first-child,.accordion[open] .accordion-header>.icon:first-child{transform:rotate(90deg)}.accordion input:checked~.accordion-body,.accordion[open] .accordion-body{max-height:50rem}.accordion .accordion-header{display:block;padding:.2rem .4rem}.accordion .accordion-header .icon{transition:transform .25s}.accordion .accordion-body{margin-bottom:.4rem;max-height:0;overflow:hidden;transition:max-height .25s}summary.accordion-header::-webkit-details-marker{display:none}.avatar{background:#5755d9;border-radius:50%;color:rgba(255,255,255,.85);display:inline-block;font-size:.8rem;font-weight:300;height:1.6rem;line-height:1.25;margin:0;position:relative;vertical-align:middle;width:1.6rem}.avatar.avatar-xs{font-size:.4rem;height:.8rem;width:.8rem}.avatar.avatar-sm{font-size:.6rem;height:1.2rem;width:1.2rem}.avatar.avatar-lg{font-size:1.2rem;height:2.4rem;width:2.4rem}.avatar.avatar-xl{font-size:1.6rem;height:3.2rem;width:3.2rem}.avatar img{border-radius:50%;height:100%;position:relative;width:100%;z-index:1}.avatar .avatar-icon,.avatar .avatar-presence{background:#fff;bottom:14.64%;height:50%;padding:.1rem;position:absolute;right:14.64%;transform:translate(50%,50%);width:50%;z-index:2}.avatar .avatar-presence{background:#bcc3ce;border-radius:50%;box-shadow:0 0 0 .1rem #fff;height:.5em;width:.5em}.avatar .avatar-presence.online{background:#32b643}.avatar .avatar-presence.busy{background:#e85600}.avatar .avatar-presence.away{background:#ffb700}.avatar[data-initial]::before{color:currentColor;content:attr(data-initial);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:1}.badge{position:relative;white-space:nowrap}.badge:not([data-badge])::after,.badge[data-badge]::after{background:#5755d9;background-clip:padding-box;border-radius:.5rem;box-shadow:0 0 0 .1rem #fff;color:#fff;content:attr(data-badge);display:inline-block;transform:translate(-.05rem,-.5rem)}.badge[data-badge]::after{font-size:.7rem;height:.9rem;line-height:1;min-width:.9rem;padding:.1rem .2rem;text-align:center;white-space:nowrap}.badge:not([data-badge])::after,.badge[data-badge=""]::after{height:6px;min-width:6px;padding:0;width:6px}.badge.btn::after{position:absolute;right:0;top:0;transform:translate(50%,-50%)}.badge.avatar::after{position:absolute;right:14.64%;top:14.64%;transform:translate(50%,-50%);z-index:100}.breadcrumb{list-style:none;margin:.2rem 0;padding:.2rem 0}.breadcrumb .breadcrumb-item{color:#66758c;display:inline-block;margin:0;padding:.2rem 0}.breadcrumb .breadcrumb-item:not(:last-child){margin-right:.2rem}.breadcrumb .breadcrumb-item:not(:last-child) a{color:#66758c}.breadcrumb .breadcrumb-item:not(:first-child)::before{color:#66758c;content:"/";padding-right:.4rem}.bar{background:#eef0f3;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;height:.8rem;width:100%}.bar.bar-sm{height:.2rem}.bar .bar-item{background:#5755d9;color:#fff;display:block;-ms-flex-negative:0;flex-shrink:0;font-size:.7rem;height:100%;line-height:.8rem;position:relative;text-align:center;width:0}.bar .bar-item:first-child{border-bottom-left-radius:.1rem;border-top-left-radius:.1rem}.bar .bar-item:last-child{border-bottom-right-radius:.1rem;border-top-right-radius:.1rem;-ms-flex-negative:1;flex-shrink:1}.bar-slider{height:.1rem;margin:.4rem 0;position:relative}.bar-slider .bar-item{left:0;padding:0;position:absolute}.bar-slider .bar-item:not(:last-child):first-child{background:#eef0f3;z-index:1}.bar-slider .bar-slider-btn{background:#5755d9;border:0;border-radius:50%;height:.6rem;padding:0;position:absolute;right:0;top:50%;transform:translate(50%,-50%);width:.6rem}.bar-slider .bar-slider-btn:active{box-shadow:0 0 0 .1rem #5755d9}.card{background:#fff;border:.05rem solid #dadee4;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.card .card-body,.card .card-footer,.card .card-header{padding:.8rem;padding-bottom:0}.card .card-body:last-child,.card .card-footer:last-child,.card .card-header:last-child{padding-bottom:.8rem}.card .card-body{-ms-flex:1 1 auto;flex:1 1 auto}.card .card-image{padding-top:.8rem}.card .card-image:first-child{padding-top:0}.card .card-image:first-child img{border-top-left-radius:.1rem;border-top-right-radius:.1rem}.card .card-image:last-child img{border-bottom-left-radius:.1rem;border-bottom-right-radius:.1rem}.chip{align-items:center;background:#eef0f3;border-radius:5rem;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;font-size:90%;height:1.2rem;line-height:.8rem;margin:.1rem;max-width:320px;overflow:hidden;padding:.2rem .4rem;text-decoration:none;text-overflow:ellipsis;vertical-align:middle;white-space:nowrap}.chip.active{background:#5755d9;color:#fff}.chip .avatar{margin-left:-.4rem;margin-right:.2rem}.chip .btn-clear{border-radius:50%;transform:scale(.75)}.dropdown{display:inline-block;position:relative}.dropdown .menu{animation:slide-down .15s ease 1;display:none;left:0;max-height:50vh;overflow-y:auto;position:absolute;top:100%}.dropdown.dropdown-right .menu{left:auto;right:0}.dropdown .dropdown-toggle:focus+.menu,.dropdown .menu:hover,.dropdown.active .menu{display:block}.dropdown .btn-group .dropdown-toggle:nth-last-child(2){border-bottom-right-radius:.1rem;border-top-right-radius:.1rem}.empty{background:#f7f8f9;border-radius:.1rem;color:#66758c;padding:3.2rem 1.6rem;text-align:center}.empty .empty-icon{margin-bottom:.8rem}.empty .empty-subtitle,.empty .empty-title{margin:.4rem auto}.empty .empty-action{margin-top:.8rem}.menu{background:#fff;border-radius:.1rem;box-shadow:0 .05rem .2rem rgba(48,55,66,.3);list-style:none;margin:0;min-width:180px;padding:.4rem;transform:translateY(.2rem);z-index:300}.menu.menu-nav{background:0 0;box-shadow:none}.menu .menu-item{margin-top:0;padding:0 .4rem;position:relative;text-decoration:none}.menu .menu-item>a{border-radius:.1rem;color:inherit;display:block;margin:0 -.4rem;padding:.2rem .4rem;text-decoration:none}.menu .menu-item>a:focus,.menu .menu-item>a:hover{background:#f1f1fc;color:#5755d9}.menu .menu-item>a.active,.menu .menu-item>a:active{background:#f1f1fc;color:#5755d9}.menu .menu-item .form-checkbox,.menu .menu-item .form-radio,.menu .menu-item .form-switch{margin:.1rem 0}.menu .menu-item+.menu-item{margin-top:.2rem}.menu .menu-badge{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;height:100%;position:absolute;right:0;top:0}.menu .menu-badge .label{margin-right:.4rem}.modal{align-items:center;bottom:0;display:none;-ms-flex-align:center;-ms-flex-pack:center;justify-content:center;left:0;opacity:0;overflow:hidden;padding:.4rem;position:fixed;right:0;top:0}.modal.active,.modal:target{display:-ms-flexbox;display:flex;opacity:1;z-index:400}.modal.active .modal-overlay,.modal:target .modal-overlay{background:rgba(247,248,249,.75);bottom:0;cursor:default;display:block;left:0;position:absolute;right:0;top:0}.modal.active .modal-container,.modal:target .modal-container{animation:slide-down .2s ease 1;z-index:1}.modal.modal-sm .modal-container{max-width:320px;padding:0 .4rem}.modal.modal-lg .modal-overlay{background:#fff}.modal.modal-lg .modal-container{box-shadow:none;max-width:960px}.modal-container{background:#fff;border-radius:.1rem;box-shadow:0 .2rem .5rem rgba(48,55,66,.3);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;max-height:75vh;max-width:640px;padding:0 .8rem;width:100%}.modal-container.modal-fullheight{max-height:100vh}.modal-container .modal-header{color:#303742;padding:.8rem}.modal-container .modal-body{overflow-y:auto;padding:.8rem;position:relative}.modal-container .modal-footer{padding:.8rem;text-align:right}.nav{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;list-style:none;margin:.2rem 0}.nav .nav-item a{color:#66758c;padding:.2rem .4rem;text-decoration:none}.nav .nav-item a:focus,.nav .nav-item a:hover{color:#5755d9}.nav .nav-item.active>a{color:#505c6e;font-weight:700}.nav .nav-item.active>a:focus,.nav .nav-item.active>a:hover{color:#5755d9}.nav .nav{margin-bottom:.4rem;margin-left:.8rem}.pagination{display:-ms-flexbox;display:flex;list-style:none;margin:.2rem 0;padding:.2rem 0}.pagination .page-item{margin:.2rem .05rem}.pagination .page-item span{display:inline-block;padding:.2rem .2rem}.pagination .page-item a{border-radius:.1rem;display:inline-block;padding:.2rem .4rem;text-decoration:none}.pagination .page-item a:focus,.pagination .page-item a:hover{color:#5755d9}.pagination .page-item.disabled a{cursor:default;opacity:.5;pointer-events:none}.pagination .page-item.active a{background:#5755d9;color:#fff}.pagination .page-item.page-next,.pagination .page-item.page-prev{-ms-flex:1 0 50%;flex:1 0 50%}.pagination .page-item.page-next{text-align:right}.pagination .page-item .page-item-title{margin:0}.pagination .page-item .page-item-subtitle{margin:0;opacity:.5}.panel{border:.05rem solid #dadee4;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.panel .panel-footer,.panel .panel-header{-ms-flex:0 0 auto;flex:0 0 auto;padding:.8rem}.panel .panel-nav{-ms-flex:0 0 auto;flex:0 0 auto}.panel .panel-body{-ms-flex:1 1 auto;flex:1 1 auto;overflow-y:auto;padding:0 .8rem}.popover{display:inline-block;position:relative}.popover .popover-container{left:50%;opacity:0;padding:.4rem;position:absolute;top:0;transform:translate(-50%,-50%) scale(0);transition:transform .2s;width:320px;z-index:300}.popover :focus+.popover-container,.popover:hover .popover-container{display:block;opacity:1;transform:translate(-50%,-100%) scale(1)}.popover.popover-right .popover-container{left:100%;top:50%}.popover.popover-right :focus+.popover-container,.popover.popover-right:hover .popover-container{transform:translate(0,-50%) scale(1)}.popover.popover-bottom .popover-container{left:50%;top:100%}.popover.popover-bottom :focus+.popover-container,.popover.popover-bottom:hover .popover-container{transform:translate(-50%,0) scale(1)}.popover.popover-left .popover-container{left:0;top:50%}.popover.popover-left :focus+.popover-container,.popover.popover-left:hover .popover-container{transform:translate(-100%,-50%) scale(1)}.popover .card{border:0;box-shadow:0 .2rem .5rem rgba(48,55,66,.3)}.step{display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;list-style:none;margin:.2rem 0;width:100%}.step .step-item{-ms-flex:1 1 0;flex:1 1 0;margin-top:0;min-height:1rem;position:relative;text-align:center}.step .step-item:not(:first-child)::before{background:#5755d9;content:"";height:2px;left:-50%;position:absolute;top:9px;width:100%}.step .step-item a{color:#5755d9;display:inline-block;padding:20px 10px 0;text-decoration:none}.step .step-item a::before{background:#5755d9;border:.1rem solid #fff;border-radius:50%;content:"";display:block;height:.6rem;left:50%;position:absolute;top:.2rem;transform:translateX(-50%);width:.6rem;z-index:1}.step .step-item.active a::before{background:#fff;border:.1rem solid #5755d9}.step .step-item.active~.step-item::before{background:#dadee4}.step .step-item.active~.step-item a{color:#bcc3ce}.step .step-item.active~.step-item a::before{background:#dadee4}.tab{align-items:center;border-bottom:.05rem solid #dadee4;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-wrap:wrap;flex-wrap:wrap;list-style:none;margin:.2rem 0 .15rem 0}.tab .tab-item{margin-top:0}.tab .tab-item a{border-bottom:.1rem solid transparent;color:inherit;display:block;margin:0 .4rem 0 0;padding:.4rem .2rem .3rem .2rem;text-decoration:none}.tab .tab-item a:focus,.tab .tab-item a:hover{color:#5755d9}.tab .tab-item a.active,.tab .tab-item.active a{border-bottom-color:#5755d9;color:#5755d9}.tab .tab-item.tab-action{-ms-flex:1 0 auto;flex:1 0 auto;text-align:right}.tab .tab-item .btn-clear{margin-top:-.2rem}.tab.tab-block .tab-item{-ms-flex:1 0 0;flex:1 0 0;text-align:center}.tab.tab-block .tab-item a{margin:0}.tab.tab-block .tab-item .badge[data-badge]::after{position:absolute;right:.1rem;top:.1rem;transform:translate(0,0)}.tab:not(.tab-block) .badge{padding-right:0}.tile{align-content:space-between;align-items:flex-start;display:-ms-flexbox;display:flex;-ms-flex-align:start;-ms-flex-line-pack:justify}.tile .tile-action,.tile .tile-icon{-ms-flex:0 0 auto;flex:0 0 auto}.tile .tile-content{-ms-flex:1 1 auto;flex:1 1 auto}.tile .tile-content:not(:first-child){padding-left:.4rem}.tile .tile-content:not(:last-child){padding-right:.4rem}.tile .tile-subtitle,.tile .tile-title{line-height:1.2rem}.tile.tile-centered{align-items:center;-ms-flex-align:center}.tile.tile-centered .tile-content{overflow:hidden}.tile.tile-centered .tile-subtitle,.tile.tile-centered .tile-title{margin-bottom:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.toast{background:rgba(48,55,66,.95);border:.05rem solid #303742;border-color:#303742;border-radius:.1rem;color:#fff;display:block;padding:.4rem;width:100%}.toast.toast-primary{background:rgba(87,85,217,.95);border-color:#5755d9}.toast.toast-success{background:rgba(50,182,67,.95);border-color:#32b643}.toast.toast-warning{background:rgba(255,183,0,.95);border-color:#ffb700}.toast.toast-error{background:rgba(232,86,0,.95);border-color:#e85600}.toast a{color:#fff;text-decoration:underline}.toast a.active,.toast a:active,.toast a:focus,.toast a:hover{opacity:.75}.toast .btn-clear{margin:.1rem}.toast p:last-child{margin-bottom:0}.tooltip{position:relative}.tooltip::after{background:rgba(48,55,66,.95);border-radius:.1rem;bottom:100%;color:#fff;content:attr(data-tooltip);display:block;font-size:.7rem;left:50%;max-width:320px;opacity:0;overflow:hidden;padding:.2rem .4rem;pointer-events:none;position:absolute;text-overflow:ellipsis;transform:translate(-50%,.4rem);transition:opacity .2s,transform .2s;white-space:pre;z-index:300}.tooltip:focus::after,.tooltip:hover::after{opacity:1;transform:translate(-50%,-.2rem)}.tooltip.disabled,.tooltip[disabled]{pointer-events:auto}.tooltip.tooltip-right::after{bottom:50%;left:100%;transform:translate(-.2rem,50%)}.tooltip.tooltip-right:focus::after,.tooltip.tooltip-right:hover::after{transform:translate(.2rem,50%)}.tooltip.tooltip-bottom::after{bottom:auto;top:100%;transform:translate(-50%,-.4rem)}.tooltip.tooltip-bottom:focus::after,.tooltip.tooltip-bottom:hover::after{transform:translate(-50%,.2rem)}.tooltip.tooltip-left::after{bottom:50%;left:auto;right:100%;transform:translate(.4rem,50%)}.tooltip.tooltip-left:focus::after,.tooltip.tooltip-left:hover::after{transform:translate(-.2rem,50%)}@keyframes loading{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes slide-down{0%{opacity:0;transform:translateY(-1.6rem)}100%{opacity:1;transform:translateY(0)}}.text-primary{color:#5755d9!important}a.text-primary:focus,a.text-primary:hover{color:#4240d4}a.text-primary:visited{color:#6c6ade}.text-secondary{color:#e5e5f9!important}a.text-secondary:focus,a.text-secondary:hover{color:#d1d0f4}a.text-secondary:visited{color:#fafafe}.text-gray{color:#bcc3ce!important}a.text-gray:focus,a.text-gray:hover{color:#adb6c4}a.text-gray:visited{color:#cbd0d9}.text-light{color:#fff!important}a.text-light:focus,a.text-light:hover{color:#f2f2f2}a.text-light:visited{color:#fff}.text-dark{color:#3b4351!important}a.text-dark:focus,a.text-dark:hover{color:#303742}a.text-dark:visited{color:#455060}.text-success{color:#32b643!important}a.text-success:focus,a.text-success:hover{color:#2da23c}a.text-success:visited{color:#39c94b}.text-warning{color:#ffb700!important}a.text-warning:focus,a.text-warning:hover{color:#e6a500}a.text-warning:visited{color:#ffbe1a}.text-error{color:#e85600!important}a.text-error:focus,a.text-error:hover{color:#cf4d00}a.text-error:visited{color:#ff6003}.bg-primary{background:#5755d9!important;color:#fff}.bg-secondary{background:#f1f1fc!important}.bg-dark{background:#303742!important;color:#fff}.bg-gray{background:#f7f8f9!important}.bg-success{background:#32b643!important;color:#fff}.bg-warning{background:#ffb700!important;color:#fff}.bg-error{background:#e85600!important;color:#fff}.c-hand{cursor:pointer}.c-move{cursor:move}.c-zoom-in{cursor:zoom-in}.c-zoom-out{cursor:zoom-out}.c-not-allowed{cursor:not-allowed}.c-auto{cursor:auto}.d-block{display:block}.d-inline{display:inline}.d-inline-block{display:inline-block}.d-flex{display:-ms-flexbox;display:flex}.d-inline-flex{display:-ms-inline-flexbox;display:inline-flex}.d-hide,.d-none{display:none!important}.d-visible{visibility:visible}.d-invisible{visibility:hidden}.text-hide{background:0 0;border:0;color:transparent;font-size:0;line-height:0;text-shadow:none}.text-assistive{border:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.divider,.divider-vert{display:block;position:relative}.divider-vert[data-content]::after,.divider[data-content]::after{background:#fff;color:#bcc3ce;content:attr(data-content);display:inline-block;font-size:.7rem;padding:0 .4rem;transform:translateY(-.65rem)}.divider{border-top:.05rem solid #f1f3f5;height:.05rem;margin:.4rem 0}.divider[data-content]{margin:.8rem 0}.divider-vert{display:block;padding:.8rem}.divider-vert::before{border-left:.05rem solid #dadee4;bottom:.4rem;content:"";display:block;left:50%;position:absolute;top:.4rem;transform:translateX(-50%)}.divider-vert[data-content]::after{left:50%;padding:.2rem 0;position:absolute;top:50%;transform:translate(-50%,-50%)}.loading{color:transparent!important;min-height:.8rem;pointer-events:none;position:relative}.loading::after{animation:loading .5s infinite linear;background:0 0;border:.1rem solid #5755d9;border-radius:50%;border-right-color:transparent;border-top-color:transparent;content:"";display:block;height:.8rem;left:50%;margin-left:-.4rem;margin-top:-.4rem;opacity:1;padding:0;position:absolute;top:50%;width:.8rem;z-index:1}.loading.loading-lg{min-height:2rem}.loading.loading-lg::after{height:1.6rem;margin-left:-.8rem;margin-top:-.8rem;width:1.6rem}.clearfix::after{clear:both;content:"";display:table}.float-left{float:left!important}.float-right{float:right!important}.p-relative{position:relative!important}.p-absolute{position:absolute!important}.p-fixed{position:fixed!important}.p-sticky{position:-webkit-sticky!important;position:sticky!important}.p-centered{display:block;float:none;margin-left:auto;margin-right:auto}.flex-centered{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;justify-content:center}.m-0{margin:0!important}.mb-0{margin-bottom:0!important}.ml-0{margin-left:0!important}.mr-0{margin-right:0!important}.mt-0{margin-top:0!important}.mx-0{margin-left:0!important;margin-right:0!important}.my-0{margin-bottom:0!important;margin-top:0!important}.m-1{margin:.2rem!important}.mb-1{margin-bottom:.2rem!important}.ml-1{margin-left:.2rem!important}.mr-1{margin-right:.2rem!important}.mt-1{margin-top:.2rem!important}.mx-1{margin-left:.2rem!important;margin-right:.2rem!important}.my-1{margin-bottom:.2rem!important;margin-top:.2rem!important}.m-2{margin:.4rem!important}.mb-2{margin-bottom:.4rem!important}.ml-2{margin-left:.4rem!important}.mr-2{margin-right:.4rem!important}.mt-2{margin-top:.4rem!important}.mx-2{margin-left:.4rem!important;margin-right:.4rem!important}.my-2{margin-bottom:.4rem!important;margin-top:.4rem!important}.p-0{padding:0!important}.pb-0{padding-bottom:0!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.pt-0{padding-top:0!important}.px-0{padding-left:0!important;padding-right:0!important}.py-0{padding-bottom:0!important;padding-top:0!important}.p-1{padding:.2rem!important}.pb-1{padding-bottom:.2rem!important}.pl-1{padding-left:.2rem!important}.pr-1{padding-right:.2rem!important}.pt-1{padding-top:.2rem!important}.px-1{padding-left:.2rem!important;padding-right:.2rem!important}.py-1{padding-bottom:.2rem!important;padding-top:.2rem!important}.p-2{padding:.4rem!important}.pb-2{padding-bottom:.4rem!important}.pl-2{padding-left:.4rem!important}.pr-2{padding-right:.4rem!important}.pt-2{padding-top:.4rem!important}.px-2{padding-left:.4rem!important;padding-right:.4rem!important}.py-2{padding-bottom:.4rem!important;padding-top:.4rem!important}.s-rounded{border-radius:.1rem}.s-circle{border-radius:50%}.text-left{text-align:left}.text-right{text-align:right}.text-center{text-align:center}.text-justify{text-align:justify}.text-lowercase{text-transform:lowercase}.text-uppercase{text-transform:uppercase}.text-capitalize{text-transform:capitalize}.text-normal{font-weight:400}.text-bold{font-weight:700}.text-italic{font-style:italic}.text-large{font-size:1.2em}.text-small{font-size:.9em}.text-tiny{font-size:.8em}.text-muted{opacity:.8}.text-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.text-clip{overflow:hidden;text-overflow:clip;white-space:nowrap}.text-break{-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;word-break:break-word;word-wrap:break-word}/*! Spectre.css Experimentals v0.5.9 | MIT License | github.com/picturepan2/spectre */.form-autocomplete{position:relative}.form-autocomplete .form-autocomplete-input{align-content:flex-start;display:-ms-flexbox;display:flex;-ms-flex-line-pack:start;-ms-flex-wrap:wrap;flex-wrap:wrap;height:auto;min-height:1.6rem;padding:.1rem}.form-autocomplete .form-autocomplete-input.is-focused{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-autocomplete .form-autocomplete-input .form-input{border-color:transparent;box-shadow:none;display:inline-block;-ms-flex:1 0 auto;flex:1 0 auto;height:1.2rem;line-height:.8rem;margin:.1rem;width:auto}.form-autocomplete .menu{left:0;position:absolute;top:100%;width:100%}.form-autocomplete.autocomplete-oneline .form-autocomplete-input{-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto}.form-autocomplete.autocomplete-oneline .chip{-ms-flex:1 0 auto;flex:1 0 auto}.calendar{border:.05rem solid #dadee4;border-radius:.1rem;display:block;min-width:280px}.calendar .calendar-nav{align-items:center;background:#f7f8f9;border-top-left-radius:.1rem;border-top-right-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-align:center;font-size:.9rem;padding:.4rem}.calendar .calendar-body,.calendar .calendar-header{display:-ms-flexbox;display:flex;-ms-flex-pack:center;-ms-flex-wrap:wrap;flex-wrap:wrap;justify-content:center;padding:.4rem 0}.calendar .calendar-body .calendar-date,.calendar .calendar-header .calendar-date{-ms-flex:0 0 14.28%;flex:0 0 14.28%;max-width:14.28%}.calendar .calendar-header{background:#f7f8f9;border-bottom:.05rem solid #dadee4;color:#bcc3ce;font-size:.7rem;text-align:center}.calendar .calendar-body{color:#66758c}.calendar .calendar-date{border:0;padding:.2rem}.calendar .calendar-date .date-item{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:.05rem solid transparent;border-radius:50%;color:#66758c;cursor:pointer;font-size:.7rem;height:1.4rem;line-height:1rem;outline:0;padding:.1rem;position:relative;text-align:center;text-decoration:none;transition:background .2s,border .2s,box-shadow .2s,color .2s;vertical-align:middle;white-space:nowrap;width:1.4rem}.calendar .calendar-date .date-item.date-today{border-color:#e5e5f9;color:#5755d9}.calendar .calendar-date .date-item:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.calendar .calendar-date .date-item:focus,.calendar .calendar-date .date-item:hover{background:#fefeff;border-color:#e5e5f9;color:#5755d9;text-decoration:none}.calendar .calendar-date .date-item.active,.calendar .calendar-date .date-item:active{background:#4b48d6;border-color:#3634d2;color:#fff}.calendar .calendar-date .date-item.badge::after{position:absolute;right:3px;top:3px;transform:translate(50%,-50%)}.calendar .calendar-date .calendar-event.disabled,.calendar .calendar-date .calendar-event:disabled,.calendar .calendar-date .date-item.disabled,.calendar .calendar-date .date-item:disabled{cursor:default;opacity:.25;pointer-events:none}.calendar .calendar-date.next-month .calendar-event,.calendar .calendar-date.next-month .date-item,.calendar .calendar-date.prev-month .calendar-event,.calendar .calendar-date.prev-month .date-item{opacity:.25}.calendar .calendar-range{position:relative}.calendar .calendar-range::before{background:#f1f1fc;content:"";height:1.4rem;left:0;position:absolute;right:0;top:50%;transform:translateY(-50%)}.calendar .calendar-range.range-start::before{left:50%}.calendar .calendar-range.range-end::before{right:50%}.calendar .calendar-range.range-end .date-item,.calendar .calendar-range.range-start .date-item{background:#4b48d6;border-color:#3634d2;color:#fff}.calendar .calendar-range .date-item{color:#5755d9}.calendar.calendar-lg .calendar-body{padding:0}.calendar.calendar-lg .calendar-body .calendar-date{border-bottom:.05rem solid #dadee4;border-right:.05rem solid #dadee4;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:5.5rem;padding:0}.calendar.calendar-lg .calendar-body .calendar-date:nth-child(7n){border-right:0}.calendar.calendar-lg .calendar-body .calendar-date:nth-last-child(-n+7){border-bottom:0}.calendar.calendar-lg .date-item{align-self:flex-end;-ms-flex-item-align:end;height:1.4rem;margin-right:.2rem;margin-top:.2rem}.calendar.calendar-lg .calendar-range::before{top:19px}.calendar.calendar-lg .calendar-range.range-start::before{left:auto;width:19px}.calendar.calendar-lg .calendar-range.range-end::before{right:19px}.calendar.calendar-lg .calendar-events{flex-grow:1;-ms-flex-positive:1;line-height:1;overflow-y:auto;padding:.2rem}.calendar.calendar-lg .calendar-event{border-radius:.1rem;display:block;font-size:.7rem;margin:.1rem auto;overflow:hidden;padding:3px 4px;text-overflow:ellipsis;white-space:nowrap}.carousel .carousel-locator:nth-of-type(1):checked~.carousel-container .carousel-item:nth-of-type(1),.carousel .carousel-locator:nth-of-type(2):checked~.carousel-container .carousel-item:nth-of-type(2),.carousel .carousel-locator:nth-of-type(3):checked~.carousel-container .carousel-item:nth-of-type(3),.carousel .carousel-locator:nth-of-type(4):checked~.carousel-container .carousel-item:nth-of-type(4),.carousel .carousel-locator:nth-of-type(5):checked~.carousel-container .carousel-item:nth-of-type(5),.carousel .carousel-locator:nth-of-type(6):checked~.carousel-container .carousel-item:nth-of-type(6),.carousel .carousel-locator:nth-of-type(7):checked~.carousel-container .carousel-item:nth-of-type(7),.carousel .carousel-locator:nth-of-type(8):checked~.carousel-container .carousel-item:nth-of-type(8){animation:carousel-slidein .75s ease-in-out 1;opacity:1;z-index:100}.carousel .carousel-locator:nth-of-type(1):checked~.carousel-nav .nav-item:nth-of-type(1),.carousel .carousel-locator:nth-of-type(2):checked~.carousel-nav .nav-item:nth-of-type(2),.carousel .carousel-locator:nth-of-type(3):checked~.carousel-nav .nav-item:nth-of-type(3),.carousel .carousel-locator:nth-of-type(4):checked~.carousel-nav .nav-item:nth-of-type(4),.carousel .carousel-locator:nth-of-type(5):checked~.carousel-nav .nav-item:nth-of-type(5),.carousel .carousel-locator:nth-of-type(6):checked~.carousel-nav .nav-item:nth-of-type(6),.carousel .carousel-locator:nth-of-type(7):checked~.carousel-nav .nav-item:nth-of-type(7),.carousel .carousel-locator:nth-of-type(8):checked~.carousel-nav .nav-item:nth-of-type(8){color:#f7f8f9}.carousel{background:#f7f8f9;display:block;overflow:hidden;-webkit-overflow-scrolling:touch;position:relative;width:100%;z-index:1}.carousel .carousel-container{height:100%;left:0;position:relative}.carousel .carousel-container::before{content:"";display:block;padding-bottom:56.25%}.carousel .carousel-container .carousel-item{animation:carousel-slideout 1s ease-in-out 1;height:100%;left:0;margin:0;opacity:0;position:absolute;top:0;width:100%}.carousel .carousel-container .carousel-item:hover .item-next,.carousel .carousel-container .carousel-item:hover .item-prev{opacity:1}.carousel .carousel-container .item-next,.carousel .carousel-container .item-prev{background:rgba(247,248,249,.25);border-color:rgba(247,248,249,.5);color:#f7f8f9;opacity:0;position:absolute;top:50%;transform:translateY(-50%);transition:all .4s;z-index:100}.carousel .carousel-container .item-prev{left:1rem}.carousel .carousel-container .item-next{right:1rem}.carousel .carousel-nav{bottom:.4rem;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;left:50%;position:absolute;transform:translateX(-50%);width:10rem;z-index:100}.carousel .carousel-nav .nav-item{color:rgba(247,248,249,.5);display:block;-ms-flex:1 0 auto;flex:1 0 auto;height:1.6rem;margin:.2rem;max-width:2.5rem;position:relative}.carousel .carousel-nav .nav-item::before{background:currentColor;content:"";display:block;height:.1rem;position:absolute;top:.5rem;width:100%}@keyframes carousel-slidein{0%{transform:translateX(100%)}100%{transform:translateX(0)}}@keyframes carousel-slideout{0%{opacity:1;transform:translateX(0)}100%{opacity:1;transform:translateX(-50%)}}.comparison-slider{height:50vh;overflow:hidden;-webkit-overflow-scrolling:touch;position:relative;width:100%}.comparison-slider .comparison-after,.comparison-slider .comparison-before{height:100%;left:0;margin:0;overflow:hidden;position:absolute;top:0}.comparison-slider .comparison-after img,.comparison-slider .comparison-before img{height:100%;object-fit:cover;object-position:left center;position:absolute;width:100%}.comparison-slider .comparison-before{width:100%;z-index:1}.comparison-slider .comparison-before .comparison-label{right:.8rem}.comparison-slider .comparison-after{max-width:100%;min-width:0;z-index:2}.comparison-slider .comparison-after::before{background:0 0;content:"";cursor:default;height:100%;left:0;position:absolute;right:.8rem;top:0;z-index:1}.comparison-slider .comparison-after::after{background:currentColor;border-radius:50%;box-shadow:0 -5px,0 5px;color:#fff;content:"";height:3px;pointer-events:none;position:absolute;right:.4rem;top:50%;transform:translate(50%,-50%);width:3px}.comparison-slider .comparison-after .comparison-label{left:.8rem}.comparison-slider .comparison-resizer{animation:first-run 1.5s 1 ease-in-out;cursor:ew-resize;height:.8rem;left:0;max-width:100%;min-width:.8rem;opacity:0;outline:0;position:relative;resize:horizontal;top:50%;transform:translateY(-50%) scaleY(30);width:0}.comparison-slider .comparison-label{background:rgba(48,55,66,.5);bottom:.8rem;color:#fff;padding:.2rem .4rem;position:absolute;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}@keyframes first-run{0%{width:0}25%{width:2.4rem}50%{width:.8rem}75%{width:1.2rem}100%{width:0}}.filter .filter-tag#tag-0:checked~.filter-nav .chip[for=tag-0],.filter .filter-tag#tag-1:checked~.filter-nav .chip[for=tag-1],.filter .filter-tag#tag-2:checked~.filter-nav .chip[for=tag-2],.filter .filter-tag#tag-3:checked~.filter-nav .chip[for=tag-3],.filter .filter-tag#tag-4:checked~.filter-nav .chip[for=tag-4],.filter .filter-tag#tag-5:checked~.filter-nav .chip[for=tag-5],.filter .filter-tag#tag-6:checked~.filter-nav .chip[for=tag-6],.filter .filter-tag#tag-7:checked~.filter-nav .chip[for=tag-7],.filter .filter-tag#tag-8:checked~.filter-nav .chip[for=tag-8]{background:#5755d9;color:#fff}.filter .filter-tag#tag-1:checked~.filter-body .filter-item:not([data-tag~=tag-1]),.filter .filter-tag#tag-2:checked~.filter-body .filter-item:not([data-tag~=tag-2]),.filter .filter-tag#tag-3:checked~.filter-body .filter-item:not([data-tag~=tag-3]),.filter .filter-tag#tag-4:checked~.filter-body .filter-item:not([data-tag~=tag-4]),.filter .filter-tag#tag-5:checked~.filter-body .filter-item:not([data-tag~=tag-5]),.filter .filter-tag#tag-6:checked~.filter-body .filter-item:not([data-tag~=tag-6]),.filter .filter-tag#tag-7:checked~.filter-body .filter-item:not([data-tag~=tag-7]),.filter .filter-tag#tag-8:checked~.filter-body .filter-item:not([data-tag~=tag-8]){display:none}.filter .filter-nav{margin:.4rem 0}.filter .filter-body{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.meter{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#f7f8f9;border:0;border-radius:.1rem;display:block;height:.8rem;width:100%}.meter::-webkit-meter-inner-element{display:block}.meter::-webkit-meter-bar,.meter::-webkit-meter-even-less-good-value,.meter::-webkit-meter-optimum-value,.meter::-webkit-meter-suboptimum-value{border-radius:.1rem}.meter::-webkit-meter-bar{background:#f7f8f9}.meter::-webkit-meter-optimum-value{background:#32b643}.meter::-webkit-meter-suboptimum-value{background:#ffb700}.meter::-webkit-meter-even-less-good-value{background:#e85600}.meter:-moz-meter-optimum,.meter:-moz-meter-sub-optimum,.meter:-moz-meter-sub-sub-optimum,.meter::-moz-meter-bar{border-radius:.1rem}.meter:-moz-meter-optimum::-moz-meter-bar{background:#32b643}.meter:-moz-meter-sub-optimum::-moz-meter-bar{background:#ffb700}.meter:-moz-meter-sub-sub-optimum::-moz-meter-bar{background:#e85600}.off-canvas{display:-ms-flexbox;display:flex;-ms-flex-flow:nowrap;flex-flow:nowrap;height:100%;position:relative;width:100%}.off-canvas .off-canvas-toggle{display:block;position:absolute;right:.4rem;top:.4rem;transition:none;z-index:1}.off-canvas .off-canvas-sidebar{background:#f7f8f9;bottom:0;min-width:10rem;overflow-y:auto;position:fixed;right:0;top:0;transform:translateX(100%);transition:transform .25s;z-index:200}.off-canvas .off-canvas-content{-ms-flex:1 1 auto;flex:1 1 auto;height:100%;padding:.4rem .4rem .4rem 4rem}.off-canvas .off-canvas-overlay{background:rgba(48,55,66,.1);border-color:transparent;border-radius:0;bottom:0;display:none;height:100%;left:0;position:fixed;right:0;top:0;width:100%}.off-canvas .off-canvas-sidebar.active,.off-canvas .off-canvas-sidebar:target{transform:translateX(0)}.off-canvas .off-canvas-sidebar.active~.off-canvas-overlay,.off-canvas .off-canvas-sidebar:target~.off-canvas-overlay{display:block;z-index:100}@media (min-width:960px){.off-canvas.off-canvas-sidebar-show .off-canvas-toggle{display:none}.off-canvas.off-canvas-sidebar-show .off-canvas-sidebar{-ms-flex:0 0 auto;flex:0 0 auto;position:relative;transform:none}.off-canvas.off-canvas-sidebar-show .off-canvas-overlay{display:none!important}}.parallax{display:block;height:auto;position:relative;width:auto}.parallax .parallax-content{box-shadow:0 1rem 2.1rem rgba(48,55,66,.3);height:auto;transform:perspective(1000px);transform-style:preserve-3d;transition:all .4s ease;width:100%}.parallax .parallax-content::before{content:"";display:block;height:100%;left:0;position:absolute;top:0;width:100%}.parallax .parallax-front{align-items:center;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;height:100%;justify-content:center;left:0;position:absolute;text-align:center;text-shadow:0 0 20px rgba(48,55,66,.75);top:0;transform:translateZ(50px) scale(.95);transition:transform .4s;width:100%;z-index:1}.parallax .parallax-top-left{height:50%;left:0;outline:0;position:absolute;top:0;width:50%;z-index:100}.parallax .parallax-top-left:focus~.parallax-content,.parallax .parallax-top-left:hover~.parallax-content{transform:perspective(1000px) rotateX(3deg) rotateY(-3deg)}.parallax .parallax-top-left:focus~.parallax-content::before,.parallax .parallax-top-left:hover~.parallax-content::before{background:linear-gradient(135deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-top-left:focus~.parallax-content .parallax-front,.parallax .parallax-top-left:hover~.parallax-content .parallax-front{transform:translate3d(4.5px,4.5px,50px) scale(.95)}.parallax .parallax-top-right{height:50%;outline:0;position:absolute;right:0;top:0;width:50%;z-index:100}.parallax .parallax-top-right:focus~.parallax-content,.parallax .parallax-top-right:hover~.parallax-content{transform:perspective(1000px) rotateX(3deg) rotateY(3deg)}.parallax .parallax-top-right:focus~.parallax-content::before,.parallax .parallax-top-right:hover~.parallax-content::before{background:linear-gradient(-135deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-top-right:focus~.parallax-content .parallax-front,.parallax .parallax-top-right:hover~.parallax-content .parallax-front{transform:translate3d(-4.5px,4.5px,50px) scale(.95)}.parallax .parallax-bottom-left{bottom:0;height:50%;left:0;outline:0;position:absolute;width:50%;z-index:100}.parallax .parallax-bottom-left:focus~.parallax-content,.parallax .parallax-bottom-left:hover~.parallax-content{transform:perspective(1000px) rotateX(-3deg) rotateY(-3deg)}.parallax .parallax-bottom-left:focus~.parallax-content::before,.parallax .parallax-bottom-left:hover~.parallax-content::before{background:linear-gradient(45deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-bottom-left:focus~.parallax-content .parallax-front,.parallax .parallax-bottom-left:hover~.parallax-content .parallax-front{transform:translate3d(4.5px,-4.5px,50px) scale(.95)}.parallax .parallax-bottom-right{bottom:0;height:50%;outline:0;position:absolute;right:0;width:50%;z-index:100}.parallax .parallax-bottom-right:focus~.parallax-content,.parallax .parallax-bottom-right:hover~.parallax-content{transform:perspective(1000px) rotateX(-3deg) rotateY(3deg)}.parallax .parallax-bottom-right:focus~.parallax-content::before,.parallax .parallax-bottom-right:hover~.parallax-content::before{background:linear-gradient(-45deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-bottom-right:focus~.parallax-content .parallax-front,.parallax .parallax-bottom-right:hover~.parallax-content .parallax-front{transform:translate3d(-4.5px,-4.5px,50px) scale(.95)}.progress{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#eef0f3;border:0;border-radius:.1rem;color:#5755d9;height:.2rem;position:relative;width:100%}.progress::-webkit-progress-bar{background:0 0;border-radius:.1rem}.progress::-webkit-progress-value{background:#5755d9;border-radius:.1rem}.progress::-moz-progress-bar{background:#5755d9;border-radius:.1rem}.progress:indeterminate{animation:progress-indeterminate 1.5s linear infinite;background:#eef0f3 linear-gradient(to right,#5755d9 30%,#eef0f3 30%) top left/150% 150% no-repeat}.progress:indeterminate::-moz-progress-bar{background:0 0}@keyframes progress-indeterminate{0%{background-position:200% 0}100%{background-position:-200% 0}}.slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;display:block;height:1.2rem;width:100%}.slider:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2);outline:0}.slider.tooltip:not([data-tooltip])::after{content:attr(value)}.slider::-webkit-slider-thumb{-webkit-appearance:none;background:#5755d9;border:0;border-radius:50%;height:.6rem;margin-top:-.25rem;-webkit-transition:transform .2s;transition:transform .2s;width:.6rem}.slider::-moz-range-thumb{background:#5755d9;border:0;border-radius:50%;height:.6rem;-moz-transition:transform .2s;transition:transform .2s;width:.6rem}.slider::-ms-thumb{background:#5755d9;border:0;border-radius:50%;height:.6rem;-ms-transition:transform .2s;transition:transform .2s;width:.6rem}.slider:active::-webkit-slider-thumb{transform:scale(1.25)}.slider:active::-moz-range-thumb{transform:scale(1.25)}.slider:active::-ms-thumb{transform:scale(1.25)}.slider.disabled::-webkit-slider-thumb,.slider:disabled::-webkit-slider-thumb{background:#f7f8f9;transform:scale(1)}.slider.disabled::-moz-range-thumb,.slider:disabled::-moz-range-thumb{background:#f7f8f9;transform:scale(1)}.slider.disabled::-ms-thumb,.slider:disabled::-ms-thumb{background:#f7f8f9;transform:scale(1)}.slider::-webkit-slider-runnable-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-moz-range-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-ms-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-ms-fill-lower{background:#5755d9}.timeline .timeline-item{display:-ms-flexbox;display:flex;margin-bottom:1.2rem;position:relative}.timeline .timeline-item::before{background:#dadee4;content:"";height:100%;left:11px;position:absolute;top:1.2rem;width:2px}.timeline .timeline-item .timeline-left{-ms-flex:0 0 auto;flex:0 0 auto}.timeline .timeline-item .timeline-content{-ms-flex:1 1 auto;flex:1 1 auto;padding:2px 0 2px .8rem}.timeline .timeline-item .timeline-icon{align-items:center;border-radius:50%;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;height:1.2rem;justify-content:center;text-align:center;width:1.2rem}.timeline .timeline-item .timeline-icon::before{border:.1rem solid #5755d9;border-radius:50%;content:"";display:block;height:.4rem;left:.4rem;position:absolute;top:.4rem;width:.4rem}.timeline .timeline-item .timeline-icon.icon-lg{background:#5755d9;line-height:1.2rem}.timeline .timeline-item .timeline-icon.icon-lg::before{content:none}.viewer-360{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-direction:column;flex-direction:column}.viewer-360 .viewer-slider[max="36"][value="1"]+.viewer-image{background-position-y:0}.viewer-360 .viewer-slider[max="36"][value="2"]+.viewer-image{background-position-y:2.8571428571%}.viewer-360 .viewer-slider[max="36"][value="3"]+.viewer-image{background-position-y:5.7142857143%}.viewer-360 .viewer-slider[max="36"][value="4"]+.viewer-image{background-position-y:8.5714285714%}.viewer-360 .viewer-slider[max="36"][value="5"]+.viewer-image{background-position-y:11.4285714286%}.viewer-360 .viewer-slider[max="36"][value="6"]+.viewer-image{background-position-y:14.2857142857%}.viewer-360 .viewer-slider[max="36"][value="7"]+.viewer-image{background-position-y:17.1428571429%}.viewer-360 .viewer-slider[max="36"][value="8"]+.viewer-image{background-position-y:20%}.viewer-360 .viewer-slider[max="36"][value="9"]+.viewer-image{background-position-y:22.8571428571%}.viewer-360 .viewer-slider[max="36"][value="10"]+.viewer-image{background-position-y:25.7142857143%}.viewer-360 .viewer-slider[max="36"][value="11"]+.viewer-image{background-position-y:28.5714285714%}.viewer-360 .viewer-slider[max="36"][value="12"]+.viewer-image{background-position-y:31.4285714286%}.viewer-360 .viewer-slider[max="36"][value="13"]+.viewer-image{background-position-y:34.2857142857%}.viewer-360 .viewer-slider[max="36"][value="14"]+.viewer-image{background-position-y:37.1428571429%}.viewer-360 .viewer-slider[max="36"][value="15"]+.viewer-image{background-position-y:40%}.viewer-360 .viewer-slider[max="36"][value="16"]+.viewer-image{background-position-y:42.8571428571%}.viewer-360 .viewer-slider[max="36"][value="17"]+.viewer-image{background-position-y:45.7142857143%}.viewer-360 .viewer-slider[max="36"][value="18"]+.viewer-image{background-position-y:48.5714285714%}.viewer-360 .viewer-slider[max="36"][value="19"]+.viewer-image{background-position-y:51.4285714286%}.viewer-360 .viewer-slider[max="36"][value="20"]+.viewer-image{background-position-y:54.2857142857%}.viewer-360 .viewer-slider[max="36"][value="21"]+.viewer-image{background-position-y:57.1428571429%}.viewer-360 .viewer-slider[max="36"][value="22"]+.viewer-image{background-position-y:60%}.viewer-360 .viewer-slider[max="36"][value="23"]+.viewer-image{background-position-y:62.8571428571%}.viewer-360 .viewer-slider[max="36"][value="24"]+.viewer-image{background-position-y:65.7142857143%}.viewer-360 .viewer-slider[max="36"][value="25"]+.viewer-image{background-position-y:68.5714285714%}.viewer-360 .viewer-slider[max="36"][value="26"]+.viewer-image{background-position-y:71.4285714286%}.viewer-360 .viewer-slider[max="36"][value="27"]+.viewer-image{background-position-y:74.2857142857%}.viewer-360 .viewer-slider[max="36"][value="28"]+.viewer-image{background-position-y:77.1428571429%}.viewer-360 .viewer-slider[max="36"][value="29"]+.viewer-image{background-position-y:80%}.viewer-360 .viewer-slider[max="36"][value="30"]+.viewer-image{background-position-y:82.8571428571%}.viewer-360 .viewer-slider[max="36"][value="31"]+.viewer-image{background-position-y:85.7142857143%}.viewer-360 .viewer-slider[max="36"][value="32"]+.viewer-image{background-position-y:88.5714285714%}.viewer-360 .viewer-slider[max="36"][value="33"]+.viewer-image{background-position-y:91.4285714286%}.viewer-360 .viewer-slider[max="36"][value="34"]+.viewer-image{background-position-y:94.2857142857%}.viewer-360 .viewer-slider[max="36"][value="35"]+.viewer-image{background-position-y:97.1428571429%}.viewer-360 .viewer-slider[max="36"][value="36"]+.viewer-image{background-position-y:100%}.viewer-360 .viewer-slider{cursor:ew-resize;-ms-flex-order:2;margin:1rem;order:2;width:60%}.viewer-360 .viewer-image{background-position-y:0;background-repeat:no-repeat;background-size:100%;-ms-flex-order:1;max-width:100%;order:1} \ No newline at end of file +html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}address{font-style:normal}b,strong{font-weight:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:"SF Mono","Segoe UI Mono","Roboto Mono",Menlo,Courier,monospace;font-size:1em}dfn{font-style:italic}small{font-size:80%;font-weight:400}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}fieldset{border:0;margin:0;padding:0}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item;outline:0}canvas{display:inline-block}template{display:none}[hidden]{display:none}*,::after,::before{box-sizing:inherit}html{box-sizing:border-box;font-size:20px;line-height:1.5;-webkit-tap-highlight-color:transparent}body{background:#fff;color:#3b4351;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;font-size:.8rem;overflow-x:hidden;text-rendering:optimizeLegibility}a{color:#5755d9;outline:0;text-decoration:none}a:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}a.active,a:active,a:focus,a:hover{color:#302ecd;text-decoration:underline}a:visited{color:#807fe2}h1,h2,h3,h4,h5,h6{color:inherit;font-weight:500;line-height:1.2;margin-bottom:.5em;margin-top:0}.h1,.h2,.h3,.h4,.h5,.h6{font-weight:500}.h1,h1{font-size:2rem}.h2,h2{font-size:1.6rem}.h3,h3{font-size:1.4rem}.h4,h4{font-size:1.2rem}.h5,h5{font-size:1rem}.h6,h6{font-size:.8rem}p{margin:0 0 1.2rem}a,ins,u{text-decoration-skip:ink edges}abbr[title]{border-bottom:.05rem dotted;cursor:help;text-decoration:none}kbd{background:#303742;border-radius:.1rem;color:#fff;font-size:.7rem;line-height:1.25;padding:.1rem .2rem}mark{background:#ffe9b3;border-bottom:.05rem solid #ffd367;border-radius:.1rem;color:#3b4351;padding:.05rem .1rem 0}blockquote{border-left:.1rem solid #dadee4;margin-left:0;padding:.4rem .8rem}blockquote p:last-child{margin-bottom:0}ol,ul{margin:.8rem 0 .8rem .8rem;padding:0}ol ol,ol ul,ul ol,ul ul{margin:.8rem 0 .8rem .8rem}ol li,ul li{margin-top:.4rem}ul{list-style:disc inside}ul ul{list-style-type:circle}ol{list-style:decimal inside}ol ol{list-style-type:lower-alpha}dl dt{font-weight:700}dl dd{margin:.4rem 0 .8rem 0}.lang-zh,.lang-zh-hans,html:lang(zh),html:lang(zh-Hans){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",sans-serif}.lang-zh-hant,html:lang(zh-Hant){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang TC","Hiragino Sans CNS","Microsoft JhengHei","Helvetica Neue",sans-serif}.lang-ja,html:lang(ja){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Hiragino Sans","Hiragino Kaku Gothic Pro","Yu Gothic",YuGothic,Meiryo,"Helvetica Neue",sans-serif}.lang-ko,html:lang(ko){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Malgun Gothic","Helvetica Neue",sans-serif}.lang-cjk ins,.lang-cjk u,:lang(ja) ins,:lang(ja) u,:lang(zh) ins,:lang(zh) u{border-bottom:.05rem solid;text-decoration:none}.lang-cjk del+del,.lang-cjk del+s,.lang-cjk ins+ins,.lang-cjk ins+u,.lang-cjk s+del,.lang-cjk s+s,.lang-cjk u+ins,.lang-cjk u+u,:lang(ja) del+del,:lang(ja) del+s,:lang(ja) ins+ins,:lang(ja) ins+u,:lang(ja) s+del,:lang(ja) s+s,:lang(ja) u+ins,:lang(ja) u+u,:lang(zh) del+del,:lang(zh) del+s,:lang(zh) ins+ins,:lang(zh) ins+u,:lang(zh) s+del,:lang(zh) s+s,:lang(zh) u+ins,:lang(zh) u+u{margin-left:.125em}.table{border-collapse:collapse;border-spacing:0;text-align:left;width:100%}.table.table-striped tbody tr:nth-of-type(odd){background:#f7f8f9}.table tbody tr.active,.table.table-striped tbody tr.active{background:#eef0f3}.table.table-hover tbody tr:hover{background:#eef0f3}.table.table-scroll{display:block;overflow-x:auto;padding-bottom:.75rem;white-space:nowrap}.table td,.table th{border-bottom:.05rem solid #dadee4;padding:.6rem .4rem}.table th{border-bottom-width:.1rem}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:.05rem solid #5755d9;border-radius:.1rem;color:#5755d9;cursor:pointer;display:inline-block;font-size:.8rem;height:1.8rem;line-height:1.2rem;outline:0;padding:.25rem .4rem;text-align:center;text-decoration:none;transition:background .2s,border .2s,box-shadow .2s,color .2s;-webkit-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap}.btn:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.btn:focus,.btn:hover{background:#f1f1fc;border-color:#4b48d6;text-decoration:none}.btn.active,.btn:active{background:#4b48d6;border-color:#3634d2;color:#fff;text-decoration:none}.btn.active.loading::after,.btn:active.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.disabled,.btn:disabled,.btn[disabled]{cursor:default;opacity:.5;pointer-events:none}.btn.btn-primary{background:#5755d9;border-color:#4b48d6;color:#fff}.btn.btn-primary:focus,.btn.btn-primary:hover{background:#4240d4;border-color:#3634d2;color:#fff}.btn.btn-primary.active,.btn.btn-primary:active{background:#3a38d2;border-color:#302ecd;color:#fff}.btn.btn-primary.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-success{background:#32b643;border-color:#2faa3f;color:#fff}.btn.btn-success:focus{box-shadow:0 0 0 .1rem rgba(50,182,67,.2)}.btn.btn-success:focus,.btn.btn-success:hover{background:#30ae40;border-color:#2da23c;color:#fff}.btn.btn-success.active,.btn.btn-success:active{background:#2a9a39;border-color:#278e34;color:#fff}.btn.btn-success.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-error{background:#e85600;border-color:#d95000;color:#fff}.btn.btn-error:focus{box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.btn.btn-error:focus,.btn.btn-error:hover{background:#de5200;border-color:#cf4d00;color:#fff}.btn.btn-error.active,.btn.btn-error:active{background:#c44900;border-color:#b54300;color:#fff}.btn.btn-error.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-link{background:0 0;border-color:transparent;color:#5755d9}.btn.btn-link.active,.btn.btn-link:active,.btn.btn-link:focus,.btn.btn-link:hover{color:#302ecd}.btn.btn-sm{font-size:.7rem;height:1.4rem;padding:.05rem .3rem}.btn.btn-lg{font-size:.9rem;height:2rem;padding:.35rem .6rem}.btn.btn-block{display:block;width:100%}.btn.btn-action{padding-left:0;padding-right:0;width:1.8rem}.btn.btn-action.btn-sm{width:1.4rem}.btn.btn-action.btn-lg{width:2rem}.btn.btn-clear{background:0 0;border:0;color:currentColor;height:1rem;line-height:.8rem;margin-left:.2rem;margin-right:-2px;opacity:1;padding:.1rem;text-decoration:none;width:1rem}.btn.btn-clear:focus,.btn.btn-clear:hover{background:rgba(247,248,249,.5);opacity:.95}.btn.btn-clear::before{content:"✕"}.btn-group{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.btn-group .btn{-ms-flex:1 0 auto;flex:1 0 auto}.btn-group .btn:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.btn-group .btn:not(:first-child):not(:last-child){border-radius:0;margin-left:-.05rem}.btn-group .btn:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-.05rem}.btn-group .btn.active,.btn-group .btn:active,.btn-group .btn:focus,.btn-group .btn:hover{z-index:1}.btn-group.btn-group-block{display:-ms-flexbox;display:flex}.btn-group.btn-group-block .btn{-ms-flex:1 0 0;flex:1 0 0}.form-group:not(:last-child){margin-bottom:.4rem}fieldset{margin-bottom:.8rem}legend{font-size:.9rem;font-weight:500;margin-bottom:.8rem}.form-label{display:block;line-height:1.2rem;padding:.3rem 0}.form-label.label-sm{font-size:.7rem;padding:.1rem 0}.form-label.label-lg{font-size:.9rem;padding:.4rem 0}.form-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;background-image:none;border:.05rem solid #bcc3ce;border-radius:.1rem;color:#3b4351;display:block;font-size:.8rem;height:1.8rem;line-height:1.2rem;max-width:100%;outline:0;padding:.25rem .4rem;position:relative;transition:background .2s,border .2s,box-shadow .2s,color .2s;width:100%}.form-input:focus{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-input:-ms-input-placeholder{color:#bcc3ce}.form-input::-ms-input-placeholder{color:#bcc3ce}.form-input::placeholder{color:#bcc3ce}.form-input.input-sm{font-size:.7rem;height:1.4rem;padding:.05rem .3rem}.form-input.input-lg{font-size:.9rem;height:2rem;padding:.35rem .6rem}.form-input.input-inline{display:inline-block;vertical-align:middle;width:auto}.form-input[type=file]{height:auto}textarea.form-input,textarea.form-input.input-lg,textarea.form-input.input-sm{height:auto}.form-input-hint{color:#bcc3ce;font-size:.7rem;margin-top:.2rem}.has-success .form-input-hint,.is-success+.form-input-hint{color:#32b643}.has-error .form-input-hint,.is-error+.form-input-hint{color:#e85600}.form-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:.05rem solid #bcc3ce;border-radius:.1rem;color:inherit;font-size:.8rem;height:1.8rem;line-height:1.2rem;outline:0;padding:.25rem .4rem;vertical-align:middle;width:100%}.form-select:focus{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-select::-ms-expand{display:none}.form-select.select-sm{font-size:.7rem;height:1.4rem;padding:.05rem 1.1rem .05rem .3rem}.form-select.select-lg{font-size:.9rem;height:2rem;padding:.35rem 1.4rem .35rem .6rem}.form-select[multiple],.form-select[size]{height:auto;padding:.25rem .4rem}.form-select[multiple] option,.form-select[size] option{padding:.1rem .2rem}.form-select:not([multiple]):not([size]){background:#fff url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center/.4rem .5rem;padding-right:1.2rem}.has-icon-left,.has-icon-right{position:relative}.has-icon-left .form-icon,.has-icon-right .form-icon{height:.8rem;margin:0 .25rem;position:absolute;top:50%;transform:translateY(-50%);width:.8rem;z-index:2}.has-icon-left .form-icon{left:.05rem}.has-icon-left .form-input{padding-left:1.3rem}.has-icon-right .form-icon{right:.05rem}.has-icon-right .form-input{padding-right:1.3rem}.form-checkbox,.form-radio,.form-switch{display:block;line-height:1.2rem;margin:.2rem 0;min-height:1.4rem;padding:.1rem .4rem .1rem 1.2rem;position:relative}.form-checkbox input,.form-radio input,.form-switch input{clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;position:absolute;width:1px}.form-checkbox input:focus+.form-icon,.form-radio input:focus+.form-icon,.form-switch input:focus+.form-icon{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-checkbox input:checked+.form-icon,.form-radio input:checked+.form-icon,.form-switch input:checked+.form-icon{background:#5755d9;border-color:#5755d9}.form-checkbox .form-icon,.form-radio .form-icon,.form-switch .form-icon{border:.05rem solid #bcc3ce;cursor:pointer;display:inline-block;position:absolute;transition:background .2s,border .2s,box-shadow .2s,color .2s}.form-checkbox.input-sm,.form-radio.input-sm,.form-switch.input-sm{font-size:.7rem;margin:0}.form-checkbox.input-lg,.form-radio.input-lg,.form-switch.input-lg{font-size:.9rem;margin:.3rem 0}.form-checkbox .form-icon,.form-radio .form-icon{background:#fff;height:.8rem;left:0;top:.3rem;width:.8rem}.form-checkbox input:active+.form-icon,.form-radio input:active+.form-icon{background:#eef0f3}.form-checkbox .form-icon{border-radius:.1rem}.form-checkbox input:checked+.form-icon::before{background-clip:padding-box;border:.1rem solid #fff;border-left-width:0;border-top-width:0;content:"";height:9px;left:50%;margin-left:-3px;margin-top:-6px;position:absolute;top:50%;transform:rotate(45deg);width:6px}.form-checkbox input:indeterminate+.form-icon{background:#5755d9;border-color:#5755d9}.form-checkbox input:indeterminate+.form-icon::before{background:#fff;content:"";height:2px;left:50%;margin-left:-5px;margin-top:-1px;position:absolute;top:50%;width:10px}.form-radio .form-icon{border-radius:50%}.form-radio input:checked+.form-icon::before{background:#fff;border-radius:50%;content:"";height:6px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:6px}.form-switch{padding-left:2rem}.form-switch .form-icon{background:#bcc3ce;background-clip:padding-box;border-radius:.45rem;height:.9rem;left:0;top:.25rem;width:1.6rem}.form-switch .form-icon::before{background:#fff;border-radius:50%;content:"";display:block;height:.8rem;left:0;position:absolute;top:0;transition:background .2s,border .2s,box-shadow .2s,color .2s,left .2s;width:.8rem}.form-switch input:checked+.form-icon::before{left:14px}.form-switch input:active+.form-icon::before{background:#f7f8f9}.input-group{display:-ms-flexbox;display:flex}.input-group .input-group-addon{background:#f7f8f9;border:.05rem solid #bcc3ce;border-radius:.1rem;line-height:1.2rem;padding:.25rem .4rem;white-space:nowrap}.input-group .input-group-addon.addon-sm{font-size:.7rem;padding:.05rem .3rem}.input-group .input-group-addon.addon-lg{font-size:.9rem;padding:.35rem .6rem}.input-group .form-input,.input-group .form-select{-ms-flex:1 1 auto;flex:1 1 auto;width:1%}.input-group .input-group-btn{z-index:1}.input-group .form-input:first-child:not(:last-child),.input-group .form-select:first-child:not(:last-child),.input-group .input-group-addon:first-child:not(:last-child),.input-group .input-group-btn:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.input-group .form-input:not(:first-child):not(:last-child),.input-group .form-select:not(:first-child):not(:last-child),.input-group .input-group-addon:not(:first-child):not(:last-child),.input-group .input-group-btn:not(:first-child):not(:last-child){border-radius:0;margin-left:-.05rem}.input-group .form-input:last-child:not(:first-child),.input-group .form-select:last-child:not(:first-child),.input-group .input-group-addon:last-child:not(:first-child),.input-group .input-group-btn:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-.05rem}.input-group .form-input:focus,.input-group .form-select:focus,.input-group .input-group-addon:focus,.input-group .input-group-btn:focus{z-index:2}.input-group .form-select{width:auto}.input-group.input-inline{display:-ms-inline-flexbox;display:inline-flex}.form-input.is-success,.form-select.is-success,.has-success .form-input,.has-success .form-select{background:#f9fdfa;border-color:#32b643}.form-input.is-success:focus,.form-select.is-success:focus,.has-success .form-input:focus,.has-success .form-select:focus{box-shadow:0 0 0 .1rem rgba(50,182,67,.2)}.form-input.is-error,.form-select.is-error,.has-error .form-input,.has-error .form-select{background:#fffaf7;border-color:#e85600}.form-input.is-error:focus,.form-select.is-error:focus,.has-error .form-input:focus,.has-error .form-select:focus{box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-checkbox.is-error .form-icon,.form-radio.is-error .form-icon,.form-switch.is-error .form-icon,.has-error .form-checkbox .form-icon,.has-error .form-radio .form-icon,.has-error .form-switch .form-icon{border-color:#e85600}.form-checkbox.is-error input:checked+.form-icon,.form-radio.is-error input:checked+.form-icon,.form-switch.is-error input:checked+.form-icon,.has-error .form-checkbox input:checked+.form-icon,.has-error .form-radio input:checked+.form-icon,.has-error .form-switch input:checked+.form-icon{background:#e85600;border-color:#e85600}.form-checkbox.is-error input:focus+.form-icon,.form-radio.is-error input:focus+.form-icon,.form-switch.is-error input:focus+.form-icon,.has-error .form-checkbox input:focus+.form-icon,.has-error .form-radio input:focus+.form-icon,.has-error .form-switch input:focus+.form-icon{border-color:#e85600;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-checkbox.is-error input:indeterminate+.form-icon,.has-error .form-checkbox input:indeterminate+.form-icon{background:#e85600;border-color:#e85600}.form-input:not(:-ms-input-placeholder):invalid{border-color:#e85600}.form-input:not(:placeholder-shown):invalid{border-color:#e85600}.form-input:not(:-ms-input-placeholder):invalid:focus{background:#fffaf7;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-input:not(:placeholder-shown):invalid:focus{background:#fffaf7;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-input:not(:-ms-input-placeholder):invalid+.form-input-hint{color:#e85600}.form-input:not(:placeholder-shown):invalid+.form-input-hint{color:#e85600}.form-input.disabled,.form-input:disabled,.form-select.disabled,.form-select:disabled{background-color:#eef0f3;cursor:not-allowed;opacity:.5}.form-input[readonly]{background-color:#f7f8f9}input.disabled+.form-icon,input:disabled+.form-icon{background:#eef0f3;cursor:not-allowed;opacity:.5}.form-switch input.disabled+.form-icon::before,.form-switch input:disabled+.form-icon::before{background:#fff}.form-horizontal{padding:.4rem 0}.form-horizontal .form-group{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.form-inline{display:inline-block}.label{background:#eef0f3;border-radius:.1rem;color:#455060;display:inline-block;line-height:1.25;padding:.1rem .2rem}.label.label-rounded{border-radius:5rem;padding-left:.4rem;padding-right:.4rem}.label.label-primary{background:#5755d9;color:#fff}.label.label-secondary{background:#f1f1fc;color:#5755d9}.label.label-success{background:#32b643;color:#fff}.label.label-warning{background:#ffb700;color:#fff}.label.label-error{background:#e85600;color:#fff}code{background:#fcf2f2;border-radius:.1rem;color:#d73e48;font-size:85%;line-height:1.25;padding:.1rem .2rem}.code{border-radius:.1rem;color:#3b4351;position:relative}.code::before{color:#bcc3ce;content:attr(data-lang);font-size:.7rem;position:absolute;right:.4rem;top:.1rem}.code code{background:#f7f8f9;color:inherit;display:block;line-height:1.5;overflow-x:auto;padding:1rem;width:100%}.img-responsive{display:block;height:auto;max-width:100%}.img-fit-cover{object-fit:cover}.img-fit-contain{object-fit:contain}.video-responsive{display:block;overflow:hidden;padding:0;position:relative;width:100%}.video-responsive::before{content:"";display:block;padding-bottom:56.25%}.video-responsive embed,.video-responsive iframe,.video-responsive object{border:0;bottom:0;height:100%;left:0;position:absolute;right:0;top:0;width:100%}video.video-responsive{height:auto;max-width:100%}video.video-responsive::before{content:none}.video-responsive-4-3::before{padding-bottom:75%}.video-responsive-1-1::before{padding-bottom:100%}.figure{margin:0 0 .4rem 0}.figure .figure-caption{color:#66758c;margin-top:.4rem}.container{margin-left:auto;margin-right:auto;padding-left:.4rem;padding-right:.4rem;width:100%}.container.grid-xl{max-width:1296px}.container.grid-lg{max-width:976px}.container.grid-md{max-width:856px}.container.grid-sm{max-width:616px}.container.grid-xs{max-width:496px}.show-lg,.show-md,.show-sm,.show-xl,.show-xs{display:none!important}.cols,.columns{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-left:-.4rem;margin-right:-.4rem}.cols.col-gapless,.columns.col-gapless{margin-left:0;margin-right:0}.cols.col-gapless>.column,.columns.col-gapless>.column{padding-left:0;padding-right:0}.cols.col-oneline,.columns.col-oneline{-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto}.column,[class~=col-]{-ms-flex:1;flex:1;max-width:100%;padding-left:.4rem;padding-right:.4rem}.column.col-1,.column.col-10,.column.col-11,.column.col-12,.column.col-2,.column.col-3,.column.col-4,.column.col-5,.column.col-6,.column.col-7,.column.col-8,.column.col-9,.column.col-auto,[class~=col-].col-1,[class~=col-].col-10,[class~=col-].col-11,[class~=col-].col-12,[class~=col-].col-2,[class~=col-].col-3,[class~=col-].col-4,[class~=col-].col-5,[class~=col-].col-6,[class~=col-].col-7,[class~=col-].col-8,[class~=col-].col-9,[class~=col-].col-auto{-ms-flex:none;flex:none}.col-12{width:100%}.col-11{width:91.66666667%}.col-10{width:83.33333333%}.col-9{width:75%}.col-8{width:66.66666667%}.col-7{width:58.33333333%}.col-6{width:50%}.col-5{width:41.66666667%}.col-4{width:33.33333333%}.col-3{width:25%}.col-2{width:16.66666667%}.col-1{width:8.33333333%}.col-auto{-ms-flex:0 0 auto;flex:0 0 auto;max-width:none;width:auto}.col-mx-auto{margin-left:auto;margin-right:auto}.col-ml-auto{margin-left:auto}.col-mr-auto{margin-right:auto}@media(max-width:1280px){.col-xl-1,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-auto{-ms-flex:none;flex:none}.col-xl-12{width:100%}.col-xl-11{width:91.66666667%}.col-xl-10{width:83.33333333%}.col-xl-9{width:75%}.col-xl-8{width:66.66666667%}.col-xl-7{width:58.33333333%}.col-xl-6{width:50%}.col-xl-5{width:41.66666667%}.col-xl-4{width:33.33333333%}.col-xl-3{width:25%}.col-xl-2{width:16.66666667%}.col-xl-1{width:8.33333333%}.col-xl-auto{width:auto}.hide-xl{display:none!important}.show-xl{display:block!important}}@media(max-width:960px){.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-auto{-ms-flex:none;flex:none}.col-lg-12{width:100%}.col-lg-11{width:91.66666667%}.col-lg-10{width:83.33333333%}.col-lg-9{width:75%}.col-lg-8{width:66.66666667%}.col-lg-7{width:58.33333333%}.col-lg-6{width:50%}.col-lg-5{width:41.66666667%}.col-lg-4{width:33.33333333%}.col-lg-3{width:25%}.col-lg-2{width:16.66666667%}.col-lg-1{width:8.33333333%}.col-lg-auto{width:auto}.hide-lg{display:none!important}.show-lg{display:block!important}}@media(max-width:840px){.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-auto{-ms-flex:none;flex:none}.col-md-12{width:100%}.col-md-11{width:91.66666667%}.col-md-10{width:83.33333333%}.col-md-9{width:75%}.col-md-8{width:66.66666667%}.col-md-7{width:58.33333333%}.col-md-6{width:50%}.col-md-5{width:41.66666667%}.col-md-4{width:33.33333333%}.col-md-3{width:25%}.col-md-2{width:16.66666667%}.col-md-1{width:8.33333333%}.col-md-auto{width:auto}.hide-md{display:none!important}.show-md{display:block!important}}@media(max-width:600px){.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-auto{-ms-flex:none;flex:none}.col-sm-12{width:100%}.col-sm-11{width:91.66666667%}.col-sm-10{width:83.33333333%}.col-sm-9{width:75%}.col-sm-8{width:66.66666667%}.col-sm-7{width:58.33333333%}.col-sm-6{width:50%}.col-sm-5{width:41.66666667%}.col-sm-4{width:33.33333333%}.col-sm-3{width:25%}.col-sm-2{width:16.66666667%}.col-sm-1{width:8.33333333%}.col-sm-auto{width:auto}.hide-sm{display:none!important}.show-sm{display:block!important}}@media(max-width:480px){.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-auto{-ms-flex:none;flex:none}.col-xs-12{width:100%}.col-xs-11{width:91.66666667%}.col-xs-10{width:83.33333333%}.col-xs-9{width:75%}.col-xs-8{width:66.66666667%}.col-xs-7{width:58.33333333%}.col-xs-6{width:50%}.col-xs-5{width:41.66666667%}.col-xs-4{width:33.33333333%}.col-xs-3{width:25%}.col-xs-2{width:16.66666667%}.col-xs-1{width:8.33333333%}.col-xs-auto{width:auto}.hide-xs{display:none!important}.show-xs{display:block!important}}.hero{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:4rem;padding-top:4rem}.hero.hero-sm{padding-bottom:2rem;padding-top:2rem}.hero.hero-lg{padding-bottom:8rem;padding-top:8rem}.hero .hero-body{padding:.4rem}.navbar{align-items:stretch;display:-ms-flexbox;display:flex;-ms-flex-align:stretch;-ms-flex-pack:justify;-ms-flex-wrap:wrap;flex-wrap:wrap;justify-content:space-between}.navbar .navbar-section{align-items:center;display:-ms-flexbox;display:flex;-ms-flex:1 0 0;flex:1 0 0;-ms-flex-align:center}.navbar .navbar-section:not(:first-child):last-child{-ms-flex-pack:end;justify-content:flex-end}.navbar .navbar-center{align-items:center;display:-ms-flexbox;display:flex;-ms-flex:0 0 auto;flex:0 0 auto;-ms-flex-align:center}.navbar .navbar-brand{font-size:.9rem;text-decoration:none}.accordion input:checked~.accordion-header>.icon:first-child,.accordion[open] .accordion-header>.icon:first-child{transform:rotate(90deg)}.accordion input:checked~.accordion-body,.accordion[open] .accordion-body{max-height:50rem}.accordion .accordion-header{display:block;padding:.2rem .4rem}.accordion .accordion-header .icon{transition:transform .25s}.accordion .accordion-body{margin-bottom:.4rem;max-height:0;overflow:hidden;transition:max-height .25s}summary.accordion-header::-webkit-details-marker{display:none}.avatar{background:#5755d9;border-radius:50%;color:rgba(255,255,255,.85);display:inline-block;font-size:.8rem;font-weight:300;height:1.6rem;line-height:1.25;margin:0;position:relative;vertical-align:middle;width:1.6rem}.avatar.avatar-xs{font-size:.4rem;height:.8rem;width:.8rem}.avatar.avatar-sm{font-size:.6rem;height:1.2rem;width:1.2rem}.avatar.avatar-lg{font-size:1.2rem;height:2.4rem;width:2.4rem}.avatar.avatar-xl{font-size:1.6rem;height:3.2rem;width:3.2rem}.avatar img{border-radius:50%;height:100%;position:relative;width:100%;z-index:1}.avatar .avatar-icon,.avatar .avatar-presence{background:#fff;bottom:14.64%;height:50%;padding:.1rem;position:absolute;right:14.64%;transform:translate(50%,50%);width:50%;z-index:2}.avatar .avatar-presence{background:#bcc3ce;border-radius:50%;box-shadow:0 0 0 .1rem #fff;height:.5em;width:.5em}.avatar .avatar-presence.online{background:#32b643}.avatar .avatar-presence.busy{background:#e85600}.avatar .avatar-presence.away{background:#ffb700}.avatar[data-initial]::before{color:currentColor;content:attr(data-initial);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:1}.badge{position:relative;white-space:nowrap}.badge:not([data-badge])::after,.badge[data-badge]::after{background:#5755d9;background-clip:padding-box;border-radius:.5rem;box-shadow:0 0 0 .1rem #fff;color:#fff;content:attr(data-badge);display:inline-block;transform:translate(-.05rem,-.5rem)}.badge[data-badge]::after{font-size:.7rem;height:.9rem;line-height:1;min-width:.9rem;padding:.1rem .2rem;text-align:center;white-space:nowrap}.badge:not([data-badge])::after,.badge[data-badge=""]::after{height:6px;min-width:6px;padding:0;width:6px}.badge.btn::after{position:absolute;right:0;top:0;transform:translate(50%,-50%)}.badge.avatar::after{position:absolute;right:14.64%;top:14.64%;transform:translate(50%,-50%);z-index:100}.breadcrumb{list-style:none;margin:.2rem 0;padding:.2rem 0}.breadcrumb .breadcrumb-item{color:#66758c;display:inline-block;margin:0;padding:.2rem 0}.breadcrumb .breadcrumb-item:not(:last-child){margin-right:.2rem}.breadcrumb .breadcrumb-item:not(:last-child) a{color:#66758c}.breadcrumb .breadcrumb-item:not(:first-child)::before{color:#66758c;content:"/";padding-right:.4rem}.bar{background:#eef0f3;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;height:.8rem;width:100%}.bar.bar-sm{height:.2rem}.bar .bar-item{background:#5755d9;color:#fff;display:block;-ms-flex-negative:0;flex-shrink:0;font-size:.7rem;height:100%;line-height:.8rem;position:relative;text-align:center;width:0}.bar .bar-item:first-child{border-bottom-left-radius:.1rem;border-top-left-radius:.1rem}.bar .bar-item:last-child{border-bottom-right-radius:.1rem;border-top-right-radius:.1rem;-ms-flex-negative:1;flex-shrink:1}.bar-slider{height:.1rem;margin:.4rem 0;position:relative}.bar-slider .bar-item{left:0;padding:0;position:absolute}.bar-slider .bar-item:not(:last-child):first-child{background:#eef0f3;z-index:1}.bar-slider .bar-slider-btn{background:#5755d9;border:0;border-radius:50%;height:.6rem;padding:0;position:absolute;right:0;top:50%;transform:translate(50%,-50%);width:.6rem}.bar-slider .bar-slider-btn:active{box-shadow:0 0 0 .1rem #5755d9}.card{background:#fff;border:.05rem solid #dadee4;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.card .card-body,.card .card-footer,.card .card-header{padding:.8rem;padding-bottom:0}.card .card-body:last-child,.card .card-footer:last-child,.card .card-header:last-child{padding-bottom:.8rem}.card .card-body{-ms-flex:1 1 auto;flex:1 1 auto}.card .card-image{padding-top:.8rem}.card .card-image:first-child{padding-top:0}.card .card-image:first-child img{border-top-left-radius:.1rem;border-top-right-radius:.1rem}.card .card-image:last-child img{border-bottom-left-radius:.1rem;border-bottom-right-radius:.1rem}.chip{align-items:center;background:#eef0f3;border-radius:5rem;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;font-size:90%;height:1.2rem;line-height:.8rem;margin:.1rem;max-width:320px;overflow:hidden;padding:.2rem .4rem;text-decoration:none;text-overflow:ellipsis;vertical-align:middle;white-space:nowrap}.chip.active{background:#5755d9;color:#fff}.chip .avatar{margin-left:-.4rem;margin-right:.2rem}.chip .btn-clear{border-radius:50%;transform:scale(.75)}.dropdown{display:inline-block;position:relative}.dropdown .menu{animation:slide-down .15s ease 1;display:none;left:0;max-height:50vh;overflow-y:auto;position:absolute;top:100%}.dropdown.dropdown-right .menu{left:auto;right:0}.dropdown .dropdown-toggle:focus+.menu,.dropdown .menu:hover,.dropdown.active .menu{display:block}.dropdown .btn-group .dropdown-toggle:nth-last-child(2){border-bottom-right-radius:.1rem;border-top-right-radius:.1rem}.empty{background:#f7f8f9;border-radius:.1rem;color:#66758c;padding:3.2rem 1.6rem;text-align:center}.empty .empty-icon{margin-bottom:.8rem}.empty .empty-subtitle,.empty .empty-title{margin:.4rem auto}.empty .empty-action{margin-top:.8rem}.menu{background:#fff;border-radius:.1rem;box-shadow:0 .05rem .2rem rgba(48,55,66,.3);list-style:none;margin:0;min-width:180px;padding:.4rem;transform:translateY(.2rem);z-index:300}.menu.menu-nav{background:0 0;box-shadow:none}.menu .menu-item{margin-top:0;padding:0 .4rem;position:relative;text-decoration:none}.menu .menu-item>a{border-radius:.1rem;color:inherit;display:block;margin:0 -.4rem;padding:.2rem .4rem;text-decoration:none}.menu .menu-item>a:focus,.menu .menu-item>a:hover{background:#f1f1fc;color:#5755d9}.menu .menu-item>a.active,.menu .menu-item>a:active{background:#f1f1fc;color:#5755d9}.menu .menu-item .form-checkbox,.menu .menu-item .form-radio,.menu .menu-item .form-switch{margin:.1rem 0}.menu .menu-item+.menu-item{margin-top:.2rem}.menu .menu-badge{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;height:100%;position:absolute;right:0;top:0}.menu .menu-badge .label{margin-right:.4rem}.modal{align-items:center;bottom:0;display:none;-ms-flex-align:center;-ms-flex-pack:center;justify-content:center;left:0;opacity:0;overflow:hidden;padding:.4rem;position:fixed;right:0;top:0}.modal.active,.modal:target{display:-ms-flexbox;display:flex;opacity:1;z-index:400}.modal.active .modal-overlay,.modal:target .modal-overlay{background:rgba(247,248,249,.75);bottom:0;cursor:default;display:block;left:0;position:absolute;right:0;top:0}.modal.active .modal-container,.modal:target .modal-container{animation:slide-down .2s ease 1;z-index:1}.modal.modal-sm .modal-container{max-width:320px;padding:0 .4rem}.modal.modal-lg .modal-overlay{background:#fff}.modal.modal-lg .modal-container{box-shadow:none;max-width:960px}.modal-container{background:#fff;border-radius:.1rem;box-shadow:0 .2rem .5rem rgba(48,55,66,.3);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;max-height:75vh;max-width:640px;padding:0 .8rem;width:100%}.modal-container.modal-fullheight{max-height:100vh}.modal-container .modal-header{color:#303742;padding:.8rem}.modal-container .modal-body{overflow-y:auto;padding:.8rem;position:relative}.modal-container .modal-footer{padding:.8rem;text-align:right}.nav{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;list-style:none;margin:.2rem 0}.nav .nav-item a{color:#66758c;padding:.2rem .4rem;text-decoration:none}.nav .nav-item a:focus,.nav .nav-item a:hover{color:#5755d9}.nav .nav-item.active>a{color:#505c6e;font-weight:700}.nav .nav-item.active>a:focus,.nav .nav-item.active>a:hover{color:#5755d9}.nav .nav{margin-bottom:.4rem;margin-left:.8rem}.pagination{display:-ms-flexbox;display:flex;list-style:none;margin:.2rem 0;padding:.2rem 0}.pagination .page-item{margin:.2rem .05rem}.pagination .page-item span{display:inline-block;padding:.2rem .2rem}.pagination .page-item a{border-radius:.1rem;display:inline-block;padding:.2rem .4rem;text-decoration:none}.pagination .page-item a:focus,.pagination .page-item a:hover{color:#5755d9}.pagination .page-item.disabled a{cursor:default;opacity:.5;pointer-events:none}.pagination .page-item.active a{background:#5755d9;color:#fff}.pagination .page-item.page-next,.pagination .page-item.page-prev{-ms-flex:1 0 50%;flex:1 0 50%}.pagination .page-item.page-next{text-align:right}.pagination .page-item .page-item-title{margin:0}.pagination .page-item .page-item-subtitle{margin:0;opacity:.5}.panel{border:.05rem solid #dadee4;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.panel .panel-footer,.panel .panel-header{-ms-flex:0 0 auto;flex:0 0 auto;padding:.8rem}.panel .panel-nav{-ms-flex:0 0 auto;flex:0 0 auto}.panel .panel-body{-ms-flex:1 1 auto;flex:1 1 auto;overflow-y:auto;padding:0 .8rem}.popover{display:inline-block;position:relative}.popover .popover-container{left:50%;opacity:0;padding:.4rem;position:absolute;top:0;transform:translate(-50%,-50%) scale(0);transition:transform .2s;width:320px;z-index:300}.popover :focus+.popover-container,.popover:hover .popover-container{display:block;opacity:1;transform:translate(-50%,-100%) scale(1)}.popover.popover-right .popover-container{left:100%;top:50%}.popover.popover-right :focus+.popover-container,.popover.popover-right:hover .popover-container{transform:translate(0,-50%) scale(1)}.popover.popover-bottom .popover-container{left:50%;top:100%}.popover.popover-bottom :focus+.popover-container,.popover.popover-bottom:hover .popover-container{transform:translate(-50%,0) scale(1)}.popover.popover-left .popover-container{left:0;top:50%}.popover.popover-left :focus+.popover-container,.popover.popover-left:hover .popover-container{transform:translate(-100%,-50%) scale(1)}.popover .card{border:0;box-shadow:0 .2rem .5rem rgba(48,55,66,.3)}.step{display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;list-style:none;margin:.2rem 0;width:100%}.step .step-item{-ms-flex:1 1 0;flex:1 1 0;margin-top:0;min-height:1rem;position:relative;text-align:center}.step .step-item:not(:first-child)::before{background:#5755d9;content:"";height:2px;left:-50%;position:absolute;top:9px;width:100%}.step .step-item a{color:#5755d9;display:inline-block;padding:20px 10px 0;text-decoration:none}.step .step-item a::before{background:#5755d9;border:.1rem solid #fff;border-radius:50%;content:"";display:block;height:.6rem;left:50%;position:absolute;top:.2rem;transform:translateX(-50%);width:.6rem;z-index:1}.step .step-item.active a::before{background:#fff;border:.1rem solid #5755d9}.step .step-item.active~.step-item::before{background:#dadee4}.step .step-item.active~.step-item a{color:#bcc3ce}.step .step-item.active~.step-item a::before{background:#dadee4}.tab{align-items:center;border-bottom:.05rem solid #dadee4;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-wrap:wrap;flex-wrap:wrap;list-style:none;margin:.2rem 0 .15rem 0}.tab .tab-item{margin-top:0}.tab .tab-item a{border-bottom:.1rem solid transparent;color:inherit;display:block;margin:0 .4rem 0 0;padding:.4rem .2rem .3rem .2rem;text-decoration:none}.tab .tab-item a:focus,.tab .tab-item a:hover{color:#5755d9}.tab .tab-item a.active,.tab .tab-item.active a{border-bottom-color:#5755d9;color:#5755d9}.tab .tab-item.tab-action{-ms-flex:1 0 auto;flex:1 0 auto;text-align:right}.tab .tab-item .btn-clear{margin-top:-.2rem}.tab.tab-block .tab-item{-ms-flex:1 0 0;flex:1 0 0;text-align:center}.tab.tab-block .tab-item a{margin:0}.tab.tab-block .tab-item .badge[data-badge]::after{position:absolute;right:.1rem;top:.1rem;transform:translate(0,0)}.tab:not(.tab-block) .badge{padding-right:0}.tile{align-content:space-between;align-items:flex-start;display:-ms-flexbox;display:flex;-ms-flex-align:start;-ms-flex-line-pack:justify}.tile .tile-action,.tile .tile-icon{-ms-flex:0 0 auto;flex:0 0 auto}.tile .tile-content{-ms-flex:1 1 auto;flex:1 1 auto}.tile .tile-content:not(:first-child){padding-left:.4rem}.tile .tile-content:not(:last-child){padding-right:.4rem}.tile .tile-subtitle,.tile .tile-title{line-height:1.2rem}.tile.tile-centered{align-items:center;-ms-flex-align:center}.tile.tile-centered .tile-content{overflow:hidden}.tile.tile-centered .tile-subtitle,.tile.tile-centered .tile-title{margin-bottom:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.toast{background:rgba(48,55,66,.95);border:.05rem solid #303742;border-color:#303742;border-radius:.1rem;color:#fff;display:block;padding:.4rem;width:100%}.toast.toast-primary{background:rgba(87,85,217,.95);border-color:#5755d9}.toast.toast-success{background:rgba(50,182,67,.95);border-color:#32b643}.toast.toast-warning{background:rgba(255,183,0,.95);border-color:#ffb700}.toast.toast-error{background:rgba(232,86,0,.95);border-color:#e85600}.toast a{color:#fff;text-decoration:underline}.toast a.active,.toast a:active,.toast a:focus,.toast a:hover{opacity:.75}.toast .btn-clear{margin:.1rem}.toast p:last-child{margin-bottom:0}.tooltip{position:relative}.tooltip::after{background:rgba(48,55,66,.95);border-radius:.1rem;bottom:100%;color:#fff;content:attr(data-tooltip);display:block;font-size:.7rem;left:50%;max-width:320px;opacity:0;overflow:hidden;padding:.2rem .4rem;pointer-events:none;position:absolute;text-overflow:ellipsis;transform:translate(-50%,.4rem);transition:opacity .2s,transform .2s;white-space:pre;z-index:300}.tooltip:focus::after,.tooltip:hover::after{opacity:1;transform:translate(-50%,-.2rem)}.tooltip.disabled,.tooltip[disabled]{pointer-events:auto}.tooltip.tooltip-right::after{bottom:50%;left:100%;transform:translate(-.2rem,50%)}.tooltip.tooltip-right:focus::after,.tooltip.tooltip-right:hover::after{transform:translate(.2rem,50%)}.tooltip.tooltip-bottom::after{bottom:auto;top:100%;transform:translate(-50%,-.4rem)}.tooltip.tooltip-bottom:focus::after,.tooltip.tooltip-bottom:hover::after{transform:translate(-50%,.2rem)}.tooltip.tooltip-left::after{bottom:50%;left:auto;right:100%;transform:translate(.4rem,50%)}.tooltip.tooltip-left:focus::after,.tooltip.tooltip-left:hover::after{transform:translate(-.2rem,50%)}@keyframes loading{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes slide-down{0%{opacity:0;transform:translateY(-1.6rem)}100%{opacity:1;transform:translateY(0)}}.text-primary{color:#5755d9!important}a.text-primary:focus,a.text-primary:hover{color:#4240d4}a.text-primary:visited{color:#6c6ade}.text-secondary{color:#e5e5f9!important}a.text-secondary:focus,a.text-secondary:hover{color:#d1d0f4}a.text-secondary:visited{color:#fafafe}.text-gray{color:#bcc3ce!important}a.text-gray:focus,a.text-gray:hover{color:#adb6c4}a.text-gray:visited{color:#cbd0d9}.text-light{color:#fff!important}a.text-light:focus,a.text-light:hover{color:#f2f2f2}a.text-light:visited{color:#fff}.text-dark{color:#3b4351!important}a.text-dark:focus,a.text-dark:hover{color:#303742}a.text-dark:visited{color:#455060}.text-success{color:#32b643!important}a.text-success:focus,a.text-success:hover{color:#2da23c}a.text-success:visited{color:#39c94b}.text-warning{color:#ffb700!important}a.text-warning:focus,a.text-warning:hover{color:#e6a500}a.text-warning:visited{color:#ffbe1a}.text-error{color:#e85600!important}a.text-error:focus,a.text-error:hover{color:#cf4d00}a.text-error:visited{color:#ff6003}.bg-primary{background:#5755d9!important;color:#fff}.bg-secondary{background:#f1f1fc!important}.bg-dark{background:#303742!important;color:#fff}.bg-gray{background:#f7f8f9!important}.bg-success{background:#32b643!important;color:#fff}.bg-warning{background:#ffb700!important;color:#fff}.bg-error{background:#e85600!important;color:#fff}.c-hand{cursor:pointer}.c-move{cursor:move}.c-zoom-in{cursor:zoom-in}.c-zoom-out{cursor:zoom-out}.c-not-allowed{cursor:not-allowed}.c-auto{cursor:auto}.d-block{display:block}.d-inline{display:inline}.d-inline-block{display:inline-block}.d-flex{display:-ms-flexbox;display:flex}.d-inline-flex{display:-ms-inline-flexbox;display:inline-flex}.d-hide,.d-none{display:none!important}.d-visible{visibility:visible}.d-invisible{visibility:hidden}.text-hide{background:0 0;border:0;color:transparent;font-size:0;line-height:0;text-shadow:none}.text-assistive{border:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.divider,.divider-vert{display:block;position:relative}.divider-vert[data-content]::after,.divider[data-content]::after{background:#fff;color:#bcc3ce;content:attr(data-content);display:inline-block;font-size:.7rem;padding:0 .4rem;transform:translateY(-.65rem)}.divider{border-top:.05rem solid #f1f3f5;height:.05rem;margin:.4rem 0}.divider[data-content]{margin:.8rem 0}.divider-vert{display:block;padding:.8rem}.divider-vert::before{border-left:.05rem solid #dadee4;bottom:.4rem;content:"";display:block;left:50%;position:absolute;top:.4rem;transform:translateX(-50%)}.divider-vert[data-content]::after{left:50%;padding:.2rem 0;position:absolute;top:50%;transform:translate(-50%,-50%)}.loading{color:transparent!important;min-height:.8rem;pointer-events:none;position:relative}.loading::after{animation:loading .5s infinite linear;background:0 0;border:.1rem solid #5755d9;border-radius:50%;border-right-color:transparent;border-top-color:transparent;content:"";display:block;height:.8rem;left:50%;margin-left:-.4rem;margin-top:-.4rem;opacity:1;padding:0;position:absolute;top:50%;width:.8rem;z-index:1}.loading.loading-lg{min-height:2rem}.loading.loading-lg::after{height:1.6rem;margin-left:-.8rem;margin-top:-.8rem;width:1.6rem}.clearfix::after{clear:both;content:"";display:table}.float-left{float:left!important}.float-right{float:right!important}.p-relative{position:relative!important}.p-absolute{position:absolute!important}.p-fixed{position:fixed!important}.p-sticky{position:-webkit-sticky!important;position:sticky!important}.p-centered{display:block;float:none;margin-left:auto;margin-right:auto}.flex-centered{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;justify-content:center}.m-0{margin:0!important}.mb-0{margin-bottom:0!important}.ml-0{margin-left:0!important}.mr-0{margin-right:0!important}.mt-0{margin-top:0!important}.mx-0{margin-left:0!important;margin-right:0!important}.my-0{margin-bottom:0!important;margin-top:0!important}.m-1{margin:.2rem!important}.mb-1{margin-bottom:.2rem!important}.ml-1{margin-left:.2rem!important}.mr-1{margin-right:.2rem!important}.mt-1{margin-top:.2rem!important}.mx-1{margin-left:.2rem!important;margin-right:.2rem!important}.my-1{margin-bottom:.2rem!important;margin-top:.2rem!important}.m-2{margin:.4rem!important}.mb-2{margin-bottom:.4rem!important}.ml-2{margin-left:.4rem!important}.mr-2{margin-right:.4rem!important}.mt-2{margin-top:.4rem!important}.mx-2{margin-left:.4rem!important;margin-right:.4rem!important}.my-2{margin-bottom:.4rem!important;margin-top:.4rem!important}.p-0{padding:0!important}.pb-0{padding-bottom:0!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.pt-0{padding-top:0!important}.px-0{padding-left:0!important;padding-right:0!important}.py-0{padding-bottom:0!important;padding-top:0!important}.p-1{padding:.2rem!important}.pb-1{padding-bottom:.2rem!important}.pl-1{padding-left:.2rem!important}.pr-1{padding-right:.2rem!important}.pt-1{padding-top:.2rem!important}.px-1{padding-left:.2rem!important;padding-right:.2rem!important}.py-1{padding-bottom:.2rem!important;padding-top:.2rem!important}.p-2{padding:.4rem!important}.pb-2{padding-bottom:.4rem!important}.pl-2{padding-left:.4rem!important}.pr-2{padding-right:.4rem!important}.pt-2{padding-top:.4rem!important}.px-2{padding-left:.4rem!important;padding-right:.4rem!important}.py-2{padding-bottom:.4rem!important;padding-top:.4rem!important}.s-rounded{border-radius:.1rem}.s-circle{border-radius:50%}.text-left{text-align:left}.text-right{text-align:right}.text-center{text-align:center}.text-justify{text-align:justify}.text-lowercase{text-transform:lowercase}.text-uppercase{text-transform:uppercase}.text-capitalize{text-transform:capitalize}.text-normal{font-weight:400}.text-bold{font-weight:700}.text-italic{font-style:italic}.text-large{font-size:1.2em}.text-small{font-size:.9em}.text-tiny{font-size:.8em}.text-muted{opacity:.8}.text-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.text-clip{overflow:hidden;text-overflow:clip;white-space:nowrap}.text-break{-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;word-break:break-word;word-wrap:break-word}/*! Spectre.css v0.5.9 | MIT License | github.com/picturepan2/spectre */.form-autocomplete{position:relative}.form-autocomplete .form-autocomplete-input{align-content:flex-start;display:-ms-flexbox;display:flex;-ms-flex-line-pack:start;-ms-flex-wrap:wrap;flex-wrap:wrap;height:auto;min-height:1.6rem;padding:.1rem}.form-autocomplete .form-autocomplete-input.is-focused{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-autocomplete .form-autocomplete-input .form-input{border-color:transparent;box-shadow:none;display:inline-block;-ms-flex:1 0 auto;flex:1 0 auto;height:1.2rem;line-height:.8rem;margin:.1rem;width:auto}.form-autocomplete .menu{left:0;position:absolute;top:100%;width:100%}.form-autocomplete.autocomplete-oneline .form-autocomplete-input{-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto}.form-autocomplete.autocomplete-oneline .chip{-ms-flex:1 0 auto;flex:1 0 auto}.calendar{border:.05rem solid #dadee4;border-radius:.1rem;display:block;min-width:280px}.calendar .calendar-nav{align-items:center;background:#f7f8f9;border-top-left-radius:.1rem;border-top-right-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-align:center;font-size:.9rem;padding:.4rem}.calendar .calendar-body,.calendar .calendar-header{display:-ms-flexbox;display:flex;-ms-flex-pack:center;-ms-flex-wrap:wrap;flex-wrap:wrap;justify-content:center;padding:.4rem 0}.calendar .calendar-body .calendar-date,.calendar .calendar-header .calendar-date{-ms-flex:0 0 14.28%;flex:0 0 14.28%;max-width:14.28%}.calendar .calendar-header{background:#f7f8f9;border-bottom:.05rem solid #dadee4;color:#bcc3ce;font-size:.7rem;text-align:center}.calendar .calendar-body{color:#66758c}.calendar .calendar-date{border:0;padding:.2rem}.calendar .calendar-date .date-item{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;border:.05rem solid transparent;border-radius:50%;color:#66758c;cursor:pointer;font-size:.7rem;height:1.4rem;line-height:1rem;outline:0;padding:.1rem;position:relative;text-align:center;text-decoration:none;transition:background .2s,border .2s,box-shadow .2s,color .2s;vertical-align:middle;white-space:nowrap;width:1.4rem}.calendar .calendar-date .date-item.date-today{border-color:#e5e5f9;color:#5755d9}.calendar .calendar-date .date-item:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.calendar .calendar-date .date-item:focus,.calendar .calendar-date .date-item:hover{background:#fefeff;border-color:#e5e5f9;color:#5755d9;text-decoration:none}.calendar .calendar-date .date-item.active,.calendar .calendar-date .date-item:active{background:#4b48d6;border-color:#3634d2;color:#fff}.calendar .calendar-date .date-item.badge::after{position:absolute;right:3px;top:3px;transform:translate(50%,-50%)}.calendar .calendar-date .calendar-event.disabled,.calendar .calendar-date .calendar-event:disabled,.calendar .calendar-date .date-item.disabled,.calendar .calendar-date .date-item:disabled{cursor:default;opacity:.25;pointer-events:none}.calendar .calendar-date.next-month .calendar-event,.calendar .calendar-date.next-month .date-item,.calendar .calendar-date.prev-month .calendar-event,.calendar .calendar-date.prev-month .date-item{opacity:.25}.calendar .calendar-range{position:relative}.calendar .calendar-range::before{background:#f1f1fc;content:"";height:1.4rem;left:0;position:absolute;right:0;top:50%;transform:translateY(-50%)}.calendar .calendar-range.range-start::before{left:50%}.calendar .calendar-range.range-end::before{right:50%}.calendar .calendar-range.range-end .date-item,.calendar .calendar-range.range-start .date-item{background:#4b48d6;border-color:#3634d2;color:#fff}.calendar .calendar-range .date-item{color:#5755d9}.calendar.calendar-lg .calendar-body{padding:0}.calendar.calendar-lg .calendar-body .calendar-date{border-bottom:.05rem solid #dadee4;border-right:.05rem solid #dadee4;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:5.5rem;padding:0}.calendar.calendar-lg .calendar-body .calendar-date:nth-child(7n){border-right:0}.calendar.calendar-lg .calendar-body .calendar-date:nth-last-child(-n+7){border-bottom:0}.calendar.calendar-lg .date-item{align-self:flex-end;-ms-flex-item-align:end;height:1.4rem;margin-right:.2rem;margin-top:.2rem}.calendar.calendar-lg .calendar-range::before{top:19px}.calendar.calendar-lg .calendar-range.range-start::before{left:auto;width:19px}.calendar.calendar-lg .calendar-range.range-end::before{right:19px}.calendar.calendar-lg .calendar-events{flex-grow:1;-ms-flex-positive:1;line-height:1;overflow-y:auto;padding:.2rem}.calendar.calendar-lg .calendar-event{border-radius:.1rem;display:block;font-size:.7rem;margin:.1rem auto;overflow:hidden;padding:3px 4px;text-overflow:ellipsis;white-space:nowrap}.carousel .carousel-locator:nth-of-type(1):checked~.carousel-container .carousel-item:nth-of-type(1),.carousel .carousel-locator:nth-of-type(2):checked~.carousel-container .carousel-item:nth-of-type(2),.carousel .carousel-locator:nth-of-type(3):checked~.carousel-container .carousel-item:nth-of-type(3),.carousel .carousel-locator:nth-of-type(4):checked~.carousel-container .carousel-item:nth-of-type(4),.carousel .carousel-locator:nth-of-type(5):checked~.carousel-container .carousel-item:nth-of-type(5),.carousel .carousel-locator:nth-of-type(6):checked~.carousel-container .carousel-item:nth-of-type(6),.carousel .carousel-locator:nth-of-type(7):checked~.carousel-container .carousel-item:nth-of-type(7),.carousel .carousel-locator:nth-of-type(8):checked~.carousel-container .carousel-item:nth-of-type(8){animation:carousel-slidein .75s ease-in-out 1;opacity:1;z-index:100}.carousel .carousel-locator:nth-of-type(1):checked~.carousel-nav .nav-item:nth-of-type(1),.carousel .carousel-locator:nth-of-type(2):checked~.carousel-nav .nav-item:nth-of-type(2),.carousel .carousel-locator:nth-of-type(3):checked~.carousel-nav .nav-item:nth-of-type(3),.carousel .carousel-locator:nth-of-type(4):checked~.carousel-nav .nav-item:nth-of-type(4),.carousel .carousel-locator:nth-of-type(5):checked~.carousel-nav .nav-item:nth-of-type(5),.carousel .carousel-locator:nth-of-type(6):checked~.carousel-nav .nav-item:nth-of-type(6),.carousel .carousel-locator:nth-of-type(7):checked~.carousel-nav .nav-item:nth-of-type(7),.carousel .carousel-locator:nth-of-type(8):checked~.carousel-nav .nav-item:nth-of-type(8){color:#f7f8f9}.carousel{background:#f7f8f9;display:block;overflow:hidden;-webkit-overflow-scrolling:touch;position:relative;width:100%;z-index:1}.carousel .carousel-container{height:100%;left:0;position:relative}.carousel .carousel-container::before{content:"";display:block;padding-bottom:56.25%}.carousel .carousel-container .carousel-item{animation:carousel-slideout 1s ease-in-out 1;height:100%;left:0;margin:0;opacity:0;position:absolute;top:0;width:100%}.carousel .carousel-container .carousel-item:hover .item-next,.carousel .carousel-container .carousel-item:hover .item-prev{opacity:1}.carousel .carousel-container .item-next,.carousel .carousel-container .item-prev{background:rgba(247,248,249,.25);border-color:rgba(247,248,249,.5);color:#f7f8f9;opacity:0;position:absolute;top:50%;transform:translateY(-50%);transition:all .4s;z-index:100}.carousel .carousel-container .item-prev{left:1rem}.carousel .carousel-container .item-next{right:1rem}.carousel .carousel-nav{bottom:.4rem;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;left:50%;position:absolute;transform:translateX(-50%);width:10rem;z-index:100}.carousel .carousel-nav .nav-item{color:rgba(247,248,249,.5);display:block;-ms-flex:1 0 auto;flex:1 0 auto;height:1.6rem;margin:.2rem;max-width:2.5rem;position:relative}.carousel .carousel-nav .nav-item::before{background:currentColor;content:"";display:block;height:.1rem;position:absolute;top:.5rem;width:100%}@keyframes carousel-slidein{0%{transform:translateX(100%)}100%{transform:translateX(0)}}@keyframes carousel-slideout{0%{opacity:1;transform:translateX(0)}100%{opacity:1;transform:translateX(-50%)}}.comparison-slider{height:50vh;overflow:hidden;-webkit-overflow-scrolling:touch;position:relative;width:100%}.comparison-slider .comparison-after,.comparison-slider .comparison-before{height:100%;left:0;margin:0;overflow:hidden;position:absolute;top:0}.comparison-slider .comparison-after img,.comparison-slider .comparison-before img{height:100%;object-fit:cover;object-position:left center;position:absolute;width:100%}.comparison-slider .comparison-before{width:100%;z-index:1}.comparison-slider .comparison-before .comparison-label{right:.8rem}.comparison-slider .comparison-after{max-width:100%;min-width:0;z-index:2}.comparison-slider .comparison-after::before{background:0 0;content:"";cursor:default;height:100%;left:0;position:absolute;right:.8rem;top:0;z-index:1}.comparison-slider .comparison-after::after{background:currentColor;border-radius:50%;box-shadow:0 -5px,0 5px;color:#fff;content:"";height:3px;pointer-events:none;position:absolute;right:.4rem;top:50%;transform:translate(50%,-50%);width:3px}.comparison-slider .comparison-after .comparison-label{left:.8rem}.comparison-slider .comparison-resizer{animation:first-run 1.5s 1 ease-in-out;cursor:ew-resize;height:.8rem;left:0;max-width:100%;min-width:.8rem;opacity:0;outline:0;position:relative;resize:horizontal;top:50%;transform:translateY(-50%) scaleY(30);width:0}.comparison-slider .comparison-label{background:rgba(48,55,66,.5);bottom:.8rem;color:#fff;padding:.2rem .4rem;position:absolute;-webkit-user-select:none;-ms-user-select:none;user-select:none}@keyframes first-run{0%{width:0}25%{width:2.4rem}50%{width:.8rem}75%{width:1.2rem}100%{width:0}}.filter .filter-tag#tag-0:checked~.filter-nav .chip[for=tag-0],.filter .filter-tag#tag-1:checked~.filter-nav .chip[for=tag-1],.filter .filter-tag#tag-2:checked~.filter-nav .chip[for=tag-2],.filter .filter-tag#tag-3:checked~.filter-nav .chip[for=tag-3],.filter .filter-tag#tag-4:checked~.filter-nav .chip[for=tag-4],.filter .filter-tag#tag-5:checked~.filter-nav .chip[for=tag-5],.filter .filter-tag#tag-6:checked~.filter-nav .chip[for=tag-6],.filter .filter-tag#tag-7:checked~.filter-nav .chip[for=tag-7],.filter .filter-tag#tag-8:checked~.filter-nav .chip[for=tag-8]{background:#5755d9;color:#fff}.filter .filter-tag#tag-1:checked~.filter-body .filter-item:not([data-tag~=tag-1]),.filter .filter-tag#tag-2:checked~.filter-body .filter-item:not([data-tag~=tag-2]),.filter .filter-tag#tag-3:checked~.filter-body .filter-item:not([data-tag~=tag-3]),.filter .filter-tag#tag-4:checked~.filter-body .filter-item:not([data-tag~=tag-4]),.filter .filter-tag#tag-5:checked~.filter-body .filter-item:not([data-tag~=tag-5]),.filter .filter-tag#tag-6:checked~.filter-body .filter-item:not([data-tag~=tag-6]),.filter .filter-tag#tag-7:checked~.filter-body .filter-item:not([data-tag~=tag-7]),.filter .filter-tag#tag-8:checked~.filter-body .filter-item:not([data-tag~=tag-8]){display:none}.filter .filter-nav{margin:.4rem 0}.filter .filter-body{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.meter{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#f7f8f9;border:0;border-radius:.1rem;display:block;height:.8rem;width:100%}.meter::-webkit-meter-inner-element{display:block}.meter::-webkit-meter-bar,.meter::-webkit-meter-even-less-good-value,.meter::-webkit-meter-optimum-value,.meter::-webkit-meter-suboptimum-value{border-radius:.1rem}.meter::-webkit-meter-bar{background:#f7f8f9}.meter::-webkit-meter-optimum-value{background:#32b643}.meter::-webkit-meter-suboptimum-value{background:#ffb700}.meter::-webkit-meter-even-less-good-value{background:#e85600}.meter:-moz-meter-optimum,.meter:-moz-meter-sub-optimum,.meter:-moz-meter-sub-sub-optimum,.meter::-moz-meter-bar{border-radius:.1rem}.meter:-moz-meter-optimum::-moz-meter-bar{background:#32b643}.meter:-moz-meter-sub-optimum::-moz-meter-bar{background:#ffb700}.meter:-moz-meter-sub-sub-optimum::-moz-meter-bar{background:#e85600}.off-canvas{display:-ms-flexbox;display:flex;-ms-flex-flow:nowrap;flex-flow:nowrap;height:100%;position:relative;width:100%}.off-canvas .off-canvas-toggle{display:block;left:.4rem;position:absolute;top:.4rem;transition:none;z-index:1}.off-canvas .off-canvas-sidebar{background:#f7f8f9;bottom:0;left:0;min-width:10rem;overflow-y:auto;position:fixed;top:0;transform:translateX(-100%);transition:transform .25s;z-index:200}.off-canvas .off-canvas-content{-ms-flex:1 1 auto;flex:1 1 auto;height:100%;padding:.4rem .4rem .4rem 4rem}.off-canvas .off-canvas-overlay{background:rgba(48,55,66,.1);border-color:transparent;border-radius:0;bottom:0;display:none;height:100%;left:0;position:fixed;right:0;top:0;width:100%}.off-canvas .off-canvas-sidebar.active,.off-canvas .off-canvas-sidebar:target{transform:translateX(0)}.off-canvas .off-canvas-sidebar.active~.off-canvas-overlay,.off-canvas .off-canvas-sidebar:target~.off-canvas-overlay{display:block;z-index:100}@media(min-width:960px){.off-canvas.off-canvas-sidebar-show .off-canvas-toggle{display:none}.off-canvas.off-canvas-sidebar-show .off-canvas-sidebar{-ms-flex:0 0 auto;flex:0 0 auto;position:relative;transform:none}.off-canvas.off-canvas-sidebar-show .off-canvas-overlay{display:none!important}}.parallax{display:block;height:auto;position:relative;width:auto}.parallax .parallax-content{box-shadow:0 1rem 2.1rem rgba(48,55,66,.3);height:auto;transform:perspective(1000px);transform-style:preserve-3d;transition:all .4s ease;width:100%}.parallax .parallax-content::before{content:"";display:block;height:100%;left:0;position:absolute;top:0;width:100%}.parallax .parallax-front{align-items:center;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;height:100%;justify-content:center;left:0;position:absolute;text-align:center;text-shadow:0 0 20px rgba(48,55,66,.75);top:0;transform:translateZ(50px) scale(.95);transition:transform .4s;width:100%;z-index:1}.parallax .parallax-top-left{height:50%;left:0;outline:0;position:absolute;top:0;width:50%;z-index:100}.parallax .parallax-top-left:focus~.parallax-content,.parallax .parallax-top-left:hover~.parallax-content{transform:perspective(1000px) rotateX(3deg) rotateY(-3deg)}.parallax .parallax-top-left:focus~.parallax-content::before,.parallax .parallax-top-left:hover~.parallax-content::before{background:linear-gradient(135deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-top-left:focus~.parallax-content .parallax-front,.parallax .parallax-top-left:hover~.parallax-content .parallax-front{transform:translate3d(4.5px,4.5px,50px) scale(.95)}.parallax .parallax-top-right{height:50%;outline:0;position:absolute;right:0;top:0;width:50%;z-index:100}.parallax .parallax-top-right:focus~.parallax-content,.parallax .parallax-top-right:hover~.parallax-content{transform:perspective(1000px) rotateX(3deg) rotateY(3deg)}.parallax .parallax-top-right:focus~.parallax-content::before,.parallax .parallax-top-right:hover~.parallax-content::before{background:linear-gradient(-135deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-top-right:focus~.parallax-content .parallax-front,.parallax .parallax-top-right:hover~.parallax-content .parallax-front{transform:translate3d(-4.5px,4.5px,50px) scale(.95)}.parallax .parallax-bottom-left{bottom:0;height:50%;left:0;outline:0;position:absolute;width:50%;z-index:100}.parallax .parallax-bottom-left:focus~.parallax-content,.parallax .parallax-bottom-left:hover~.parallax-content{transform:perspective(1000px) rotateX(-3deg) rotateY(-3deg)}.parallax .parallax-bottom-left:focus~.parallax-content::before,.parallax .parallax-bottom-left:hover~.parallax-content::before{background:linear-gradient(45deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-bottom-left:focus~.parallax-content .parallax-front,.parallax .parallax-bottom-left:hover~.parallax-content .parallax-front{transform:translate3d(4.5px,-4.5px,50px) scale(.95)}.parallax .parallax-bottom-right{bottom:0;height:50%;outline:0;position:absolute;right:0;width:50%;z-index:100}.parallax .parallax-bottom-right:focus~.parallax-content,.parallax .parallax-bottom-right:hover~.parallax-content{transform:perspective(1000px) rotateX(-3deg) rotateY(3deg)}.parallax .parallax-bottom-right:focus~.parallax-content::before,.parallax .parallax-bottom-right:hover~.parallax-content::before{background:linear-gradient(-45deg,rgba(255,255,255,.35) 0,transparent 50%)}.parallax .parallax-bottom-right:focus~.parallax-content .parallax-front,.parallax .parallax-bottom-right:hover~.parallax-content .parallax-front{transform:translate3d(-4.5px,-4.5px,50px) scale(.95)}.progress{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#eef0f3;border:0;border-radius:.1rem;color:#5755d9;height:.2rem;position:relative;width:100%}.progress::-webkit-progress-bar{background:0 0;border-radius:.1rem}.progress::-webkit-progress-value{background:#5755d9;border-radius:.1rem}.progress::-moz-progress-bar{background:#5755d9;border-radius:.1rem}.progress:indeterminate{animation:progress-indeterminate 1.5s linear infinite;background:#eef0f3 linear-gradient(to right,#5755d9 30%,#eef0f3 30%) top left/150% 150% no-repeat}.progress:indeterminate::-moz-progress-bar{background:0 0}@keyframes progress-indeterminate{0%{background-position:200% 0}100%{background-position:-200% 0}}.slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;display:block;height:1.2rem;width:100%}.slider:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2);outline:0}.slider.tooltip:not([data-tooltip])::after{content:attr(value)}.slider::-webkit-slider-thumb{-webkit-appearance:none;background:#5755d9;border:0;border-radius:50%;height:.6rem;margin-top:-.25rem;-webkit-transition:transform .2s;transition:transform .2s;width:.6rem}.slider::-moz-range-thumb{background:#5755d9;border:0;border-radius:50%;height:.6rem;-moz-transition:transform .2s;transition:transform .2s;width:.6rem}.slider::-ms-thumb{background:#5755d9;border:0;border-radius:50%;height:.6rem;-ms-transition:transform .2s;transition:transform .2s;width:.6rem}.slider:active::-webkit-slider-thumb{transform:scale(1.25)}.slider:active::-moz-range-thumb{transform:scale(1.25)}.slider:active::-ms-thumb{transform:scale(1.25)}.slider.disabled::-webkit-slider-thumb,.slider:disabled::-webkit-slider-thumb{background:#f7f8f9;transform:scale(1)}.slider.disabled::-moz-range-thumb,.slider:disabled::-moz-range-thumb{background:#f7f8f9;transform:scale(1)}.slider.disabled::-ms-thumb,.slider:disabled::-ms-thumb{background:#f7f8f9;transform:scale(1)}.slider::-webkit-slider-runnable-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-moz-range-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-ms-track{background:#eef0f3;border-radius:.1rem;height:.1rem;width:100%}.slider::-ms-fill-lower{background:#5755d9}.timeline .timeline-item{display:-ms-flexbox;display:flex;margin-bottom:1.2rem;position:relative}.timeline .timeline-item::before{background:#dadee4;content:"";height:100%;left:11px;position:absolute;top:1.2rem;width:2px}.timeline .timeline-item .timeline-left{-ms-flex:0 0 auto;flex:0 0 auto}.timeline .timeline-item .timeline-content{-ms-flex:1 1 auto;flex:1 1 auto;padding:2px 0 2px .8rem}.timeline .timeline-item .timeline-icon{align-items:center;border-radius:50%;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;height:1.2rem;justify-content:center;text-align:center;width:1.2rem}.timeline .timeline-item .timeline-icon::before{border:.1rem solid #5755d9;border-radius:50%;content:"";display:block;height:.4rem;left:.4rem;position:absolute;top:.4rem;width:.4rem}.timeline .timeline-item .timeline-icon.icon-lg{background:#5755d9;line-height:1.2rem}.timeline .timeline-item .timeline-icon.icon-lg::before{content:none}.viewer-360{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-direction:column;flex-direction:column}.viewer-360 .viewer-slider[max="36"][value="1"]+.viewer-image{background-position-y:0}.viewer-360 .viewer-slider[max="36"][value="2"]+.viewer-image{background-position-y:2.8571428571%}.viewer-360 .viewer-slider[max="36"][value="3"]+.viewer-image{background-position-y:5.7142857143%}.viewer-360 .viewer-slider[max="36"][value="4"]+.viewer-image{background-position-y:8.5714285714%}.viewer-360 .viewer-slider[max="36"][value="5"]+.viewer-image{background-position-y:11.4285714286%}.viewer-360 .viewer-slider[max="36"][value="6"]+.viewer-image{background-position-y:14.2857142857%}.viewer-360 .viewer-slider[max="36"][value="7"]+.viewer-image{background-position-y:17.1428571429%}.viewer-360 .viewer-slider[max="36"][value="8"]+.viewer-image{background-position-y:20%}.viewer-360 .viewer-slider[max="36"][value="9"]+.viewer-image{background-position-y:22.8571428571%}.viewer-360 .viewer-slider[max="36"][value="10"]+.viewer-image{background-position-y:25.7142857143%}.viewer-360 .viewer-slider[max="36"][value="11"]+.viewer-image{background-position-y:28.5714285714%}.viewer-360 .viewer-slider[max="36"][value="12"]+.viewer-image{background-position-y:31.4285714286%}.viewer-360 .viewer-slider[max="36"][value="13"]+.viewer-image{background-position-y:34.2857142857%}.viewer-360 .viewer-slider[max="36"][value="14"]+.viewer-image{background-position-y:37.1428571429%}.viewer-360 .viewer-slider[max="36"][value="15"]+.viewer-image{background-position-y:40%}.viewer-360 .viewer-slider[max="36"][value="16"]+.viewer-image{background-position-y:42.8571428571%}.viewer-360 .viewer-slider[max="36"][value="17"]+.viewer-image{background-position-y:45.7142857143%}.viewer-360 .viewer-slider[max="36"][value="18"]+.viewer-image{background-position-y:48.5714285714%}.viewer-360 .viewer-slider[max="36"][value="19"]+.viewer-image{background-position-y:51.4285714286%}.viewer-360 .viewer-slider[max="36"][value="20"]+.viewer-image{background-position-y:54.2857142857%}.viewer-360 .viewer-slider[max="36"][value="21"]+.viewer-image{background-position-y:57.1428571429%}.viewer-360 .viewer-slider[max="36"][value="22"]+.viewer-image{background-position-y:60%}.viewer-360 .viewer-slider[max="36"][value="23"]+.viewer-image{background-position-y:62.8571428571%}.viewer-360 .viewer-slider[max="36"][value="24"]+.viewer-image{background-position-y:65.7142857143%}.viewer-360 .viewer-slider[max="36"][value="25"]+.viewer-image{background-position-y:68.5714285714%}.viewer-360 .viewer-slider[max="36"][value="26"]+.viewer-image{background-position-y:71.4285714286%}.viewer-360 .viewer-slider[max="36"][value="27"]+.viewer-image{background-position-y:74.2857142857%}.viewer-360 .viewer-slider[max="36"][value="28"]+.viewer-image{background-position-y:77.1428571429%}.viewer-360 .viewer-slider[max="36"][value="29"]+.viewer-image{background-position-y:80%}.viewer-360 .viewer-slider[max="36"][value="30"]+.viewer-image{background-position-y:82.8571428571%}.viewer-360 .viewer-slider[max="36"][value="31"]+.viewer-image{background-position-y:85.7142857143%}.viewer-360 .viewer-slider[max="36"][value="32"]+.viewer-image{background-position-y:88.5714285714%}.viewer-360 .viewer-slider[max="36"][value="33"]+.viewer-image{background-position-y:91.4285714286%}.viewer-360 .viewer-slider[max="36"][value="34"]+.viewer-image{background-position-y:94.2857142857%}.viewer-360 .viewer-slider[max="36"][value="35"]+.viewer-image{background-position-y:97.1428571429%}.viewer-360 .viewer-slider[max="36"][value="36"]+.viewer-image{background-position-y:100%}.viewer-360 .viewer-slider{cursor:ew-resize;-ms-flex-order:2;margin:1rem;order:2;width:60%}.viewer-360 .viewer-image{background-position-y:0;background-repeat:no-repeat;background-size:100%;-ms-flex-order:1;max-width:100%;order:1}/*! Spectre.css Experimentals v0.5.9 | MIT License | github.com/picturepan2/spectre *//*! Spectre.css RTL | MIT License | github.com/picturepan2/spectre */ \ No newline at end of file diff --git a/docs/dist/spectre.css b/docs/dist/spectre.css index 1499dcc69..8d1f02b79 100644 --- a/docs/dist/spectre.css +++ b/docs/dist/spectre.css @@ -1,322 +1,173 @@ -/*! Spectre.css v0.5.9 | MIT License | github.com/picturepan2/spectre */ -/* Manually forked from Normalize.css */ -/* normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */ -/** 1. Change the default font family in all browsers (opinionated). 2. Correct the line height in all browsers. 3. Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS. */ -/* Document ========================================================================== */ html { - font-family: sans-serif; /* 1 */ - -webkit-text-size-adjust: 100%; /* 3 */ - -ms-text-size-adjust: 100%; /* 3 */ -} - -/* Sections ========================================================================== */ -/** Remove the margin in all browsers (opinionated). */ -body { + font-family: sans-serif; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; +}body { margin: 0; -} - -/** Add the correct display in IE 9-. */ -article, +}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 { +}h1 { font-size: 2em; margin: .67em 0; -} - -/* Grouping content ========================================================================== */ -/** Add the correct display in IE 9-. 1. Add the correct display in IE. */ -figcaption, +}figcaption, figure, main { - /* 1 */ display: block; -} - -/** Add the correct margin in IE 8 (removed). */ -/** 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. (removed) 2. Correct the odd `em` font sizing in all browsers. */ -/* 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 */ -} - -/** Remove the outline on focused links when they are also active or hovered in all browsers (opinionated). */ -a:active, + display: block; +}hr { + box-sizing: content-box; + height: 0; + overflow: visible; +}a { + background-color: transparent; + -webkit-text-decoration-skip: objects; +}a:active, a:hover { outline-width: 0; -} - -/** Modify default styling of address. */ -address { +}address { font-style: normal; -} - -/** 1. Remove the bottom border in Firefox 39-. 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. (removed) */ -/** Prevent the duplicate application of `bolder` by the next rule in Safari 6. */ -b, +}b, strong { font-weight: inherit; -} - -/** Add the correct font weight in Chrome, Edge, and Safari. */ -b, +}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, +}code, kbd, pre, samp { - font-family: "SF Mono", "Segoe UI Mono", "Roboto Mono", Menlo, Courier, monospace; /* 1 (changed) */ - font-size: 1em; /* 2 */ -} - -/** Add the correct font style in Android 4.3-. */ -dfn { + font-family: "SF Mono","Segoe UI Mono","Roboto Mono",Menlo,Courier,monospace; + font-size: 1em; +}dfn { font-style: italic; -} - -/** Add the correct background and color in IE 9-. (Removed) */ -/** Add the correct font size in all browsers. */ -small { +}small { font-size: 80%; - font-weight: 400; /* (added) */ -} - -/** Prevent `sub` and `sup` elements from affecting the line height in all browsers. */ -sub, + font-weight: 400; +}sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; -} - -sub { +}sub { bottom: -.25em; -} - -sup { +}sup { top: -.5em; -} - -/* Embedded content ========================================================================== */ -/** Add the correct display in IE 9-. */ -audio, +}audio, video { display: inline-block; -} - -/** Add the correct display in iOS 4-7. */ -audio:not([controls]) { +}audio:not([controls]) { display: none; height: 0; -} - -/** Remove the border on images inside links in IE 10-. */ -img { +}img { border-style: none; -} - -/** Hide the overflow in IE. */ -svg:not(:root) { +}svg:not(:root) { overflow: hidden; -} - -/* Forms ========================================================================== */ -/** 1. Change the font styles in all browsers (opinionated). 2. Remove the margin in Firefox and Safari. */ -button, +}button, input, optgroup, select, textarea { - font-family: inherit; /* 1 (changed) */ - font-size: inherit; /* 1 (changed) */ - line-height: inherit; /* 1 (changed) */ - margin: 0; /* 2 */ -} - -/** Show the overflow in IE. 1. Show the overflow in Edge. */ -button, + font-family: inherit; + font-size: inherit; + line-height: inherit; + margin: 0; +}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, + overflow: visible; +}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 { + text-transform: none; +}button, +html [type=button], +[type=reset], +[type=submit] { + -webkit-appearance: button; +}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 (removed). */ -/** Change the border, margin, and padding in all browsers (opinionated) (changed). */ -fieldset { +}fieldset { border: 0; margin: 0; padding: 0; -} - -/** 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 { +}legend { + box-sizing: border-box; + color: inherit; + display: table; + max-width: 100%; + padding: 0; + white-space: normal; +}progress { + display: inline-block; + vertical-align: baseline; +}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 { +}[type=checkbox], +[type=radio] { + box-sizing: border-box; + padding: 0; +}[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 { +}[type=search] { + -webkit-appearance: textfield; + outline-offset: -2px; +}[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, +}::-webkit-file-upload-button { + -webkit-appearance: button; + font: inherit; +}details, menu { display: block; -} - -/* Add the correct display in all browsers. */ -summary { +}summary { display: list-item; outline: none; -} - -/* Scripting ========================================================================== */ -/** Add the correct display in IE 9-. */ -canvas { +}canvas { display: inline-block; -} - -/** Add the correct display in IE. */ -template { +}template { display: none; -} - -/* Hidden ========================================================================== */ -/** Add the correct display in IE 10-. */ -[hidden] { +}[hidden] { display: none; -} - -*, +}*, *::before, *::after { box-sizing: inherit; -} - -html { +}html { box-sizing: border-box; font-size: 20px; line-height: 1.5; -webkit-tap-highlight-color: transparent; -} - -body { +}body { background: #fff; color: #3b4351; - font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif; font-size: .8rem; overflow-x: hidden; text-rendering: optimizeLegibility; -} - -a { +}a { color: #5755d9; outline: none; text-decoration: none; -} - -a:focus { - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -a:focus, +}a:focus { + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}a:focus, a:hover, a:active, a.active { color: #302ecd; text-decoration: underline; -} - -a:visited { +}a:visited { color: #807fe2; -} - -h1, +}h1, h2, h3, h4, @@ -327,156 +178,99 @@ h6 { line-height: 1.2; margin-bottom: .5em; margin-top: 0; -} - -.h1, +}.h1, .h2, .h3, .h4, .h5, .h6 { font-weight: 500; -} - -h1, +}h1, .h1 { font-size: 2rem; -} - -h2, +}h2, .h2 { font-size: 1.6rem; -} - -h3, +}h3, .h3 { font-size: 1.4rem; -} - -h4, +}h4, .h4 { font-size: 1.2rem; -} - -h5, +}h5, .h5 { font-size: 1rem; -} - -h6, +}h6, .h6 { font-size: .8rem; -} - -p { +}p { margin: 0 0 1.2rem; -} - -a, +}a, ins, u { - -webkit-text-decoration-skip: ink edges; text-decoration-skip: ink edges; -} - -abbr[title] { +}abbr[title] { border-bottom: .05rem dotted; cursor: help; text-decoration: none; -} - -kbd { +}kbd { background: #303742; border-radius: .1rem; color: #fff; - font-size: .7rem; + font-size: .7rem; line-height: 1.25; padding: .1rem .2rem; -} - -mark { +}mark { background: #ffe9b3; border-bottom: .05rem solid #ffd367; border-radius: .1rem; color: #3b4351; padding: .05rem .1rem 0; -} - -blockquote { +}blockquote { border-left: .1rem solid #dadee4; margin-left: 0; padding: .4rem .8rem; -} - -blockquote p:last-child { +}blockquote p:last-child { margin-bottom: 0; -} - -ul, +}ul, ol { margin: .8rem 0 .8rem .8rem; padding: 0; -} - -ul ul, +}ul ul, ul ol, ol ul, ol ol { margin: .8rem 0 .8rem .8rem; -} - -ul li, +}ul li, ol li { margin-top: .4rem; -} - -ul { +}ul { list-style: disc inside; -} - -ul ul { +}ul ul { list-style-type: circle; -} - -ol { +}ol { list-style: decimal inside; -} - -ol ol { +}ol ol { list-style-type: lower-alpha; -} - -dl dt { +}dl dt { font-weight: bold; -} - -dl dd { +}dl dd { margin: .4rem 0 .8rem 0; -} - -html:lang(zh), +}html:lang(zh), html:lang(zh-Hans), .lang-zh, .lang-zh-hans { - font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", sans-serif; -} - -html:lang(zh-Hant), + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",sans-serif; +}html:lang(zh-Hant), .lang-zh-hant { - font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang TC", "Hiragino Sans CNS", "Microsoft JhengHei", "Helvetica Neue", sans-serif; -} - -html:lang(ja), + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang TC","Hiragino Sans CNS","Microsoft JhengHei","Helvetica Neue",sans-serif; +}html:lang(ja), .lang-ja { - font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Hiragino Sans", "Hiragino Kaku Gothic Pro", "Yu Gothic", YuGothic, Meiryo, "Helvetica Neue", sans-serif; -} - -html:lang(ko), + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Hiragino Sans","Hiragino Kaku Gothic Pro","Yu Gothic",YuGothic,Meiryo,"Helvetica Neue",sans-serif; +}html:lang(ko), .lang-ko { - font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Malgun Gothic", "Helvetica Neue", sans-serif; -} - -:lang(zh) ins, + font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Malgun Gothic","Helvetica Neue",sans-serif; +}:lang(zh) ins, :lang(zh) u, :lang(ja) ins, :lang(ja) u, @@ -484,9 +278,7 @@ html:lang(ko), .lang-cjk u { border-bottom: .05rem solid; text-decoration: none; -} - -:lang(zh) del + del, +}:lang(zh) del + del, :lang(zh) del + s, :lang(zh) ins + ins, :lang(zh) ins + u, @@ -511,46 +303,30 @@ html:lang(ko), .lang-cjk u + ins, .lang-cjk u + u { margin-left: .125em; -} - -.table { +}.table { border-collapse: collapse; border-spacing: 0; - text-align: left; + text-align: left; width: 100%; -} - -.table.table-striped tbody tr:nth-of-type(odd) { +}.table.table-striped tbody tr:nth-of-type(odd) { background: #f7f8f9; -} - -.table tbody tr.active, +}.table tbody tr.active, .table.table-striped tbody tr.active { background: #eef0f3; -} - -.table.table-hover tbody tr:hover { +}.table.table-hover tbody tr:hover { background: #eef0f3; -} - -.table.table-scroll { +}.table.table-scroll { display: block; overflow-x: auto; padding-bottom: .75rem; white-space: nowrap; -} - -.table td, +}.table td, .table th { border-bottom: .05rem solid #dadee4; padding: .6rem .4rem; -} - -.table th { +}.table th { border-bottom-width: .1rem; -} - -.btn { +}.btn { -webkit-appearance: none; -moz-appearance: none; appearance: none; @@ -567,176 +343,119 @@ html:lang(ko), padding: .25rem .4rem; text-align: center; text-decoration: none; - transition: background .2s, border .2s, box-shadow .2s, color .2s; + transition: background .2s,border .2s,box-shadow .2s,color .2s; -webkit-user-select: none; - -moz-user-select: none; -ms-user-select: none; user-select: none; vertical-align: middle; white-space: nowrap; -} - -.btn:focus { - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.btn:focus, +}.btn:focus { + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.btn:focus, .btn:hover { background: #f1f1fc; border-color: #4b48d6; text-decoration: none; -} - -.btn:active, +}.btn:active, .btn.active { background: #4b48d6; border-color: #3634d2; color: #fff; text-decoration: none; -} - -.btn:active.loading::after, +}.btn:active.loading::after, .btn.active.loading::after { border-bottom-color: #fff; border-left-color: #fff; -} - -.btn[disabled], +}.btn[disabled], .btn:disabled, .btn.disabled { cursor: default; opacity: .5; pointer-events: none; -} - -.btn.btn-primary { +}.btn.btn-primary { background: #5755d9; border-color: #4b48d6; color: #fff; -} - -.btn.btn-primary:focus, +}.btn.btn-primary:focus, .btn.btn-primary:hover { background: #4240d4; border-color: #3634d2; color: #fff; -} - -.btn.btn-primary:active, +}.btn.btn-primary:active, .btn.btn-primary.active { background: #3a38d2; border-color: #302ecd; color: #fff; -} - -.btn.btn-primary.loading::after { +}.btn.btn-primary.loading::after { border-bottom-color: #fff; border-left-color: #fff; -} - -.btn.btn-success { +}.btn.btn-success { background: #32b643; border-color: #2faa3f; color: #fff; -} - -.btn.btn-success:focus { - box-shadow: 0 0 0 .1rem rgba(50, 182, 67, .2); -} - -.btn.btn-success:focus, +}.btn.btn-success:focus { + box-shadow: 0 0 0 .1rem rgba(50,182,67,.2); +}.btn.btn-success:focus, .btn.btn-success:hover { background: #30ae40; border-color: #2da23c; color: #fff; -} - -.btn.btn-success:active, +}.btn.btn-success:active, .btn.btn-success.active { background: #2a9a39; border-color: #278e34; color: #fff; -} - -.btn.btn-success.loading::after { +}.btn.btn-success.loading::after { border-bottom-color: #fff; border-left-color: #fff; -} - -.btn.btn-error { +}.btn.btn-error { background: #e85600; border-color: #d95000; color: #fff; -} - -.btn.btn-error:focus { - box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2); -} - -.btn.btn-error:focus, +}.btn.btn-error:focus { + box-shadow: 0 0 0 .1rem rgba(232,86,0,.2); +}.btn.btn-error:focus, .btn.btn-error:hover { background: #de5200; border-color: #cf4d00; color: #fff; -} - -.btn.btn-error:active, +}.btn.btn-error:active, .btn.btn-error.active { background: #c44900; border-color: #b54300; color: #fff; -} - -.btn.btn-error.loading::after { +}.btn.btn-error.loading::after { border-bottom-color: #fff; border-left-color: #fff; -} - -.btn.btn-link { +}.btn.btn-link { background: transparent; border-color: transparent; color: #5755d9; -} - -.btn.btn-link:focus, +}.btn.btn-link:focus, .btn.btn-link:hover, .btn.btn-link:active, .btn.btn-link.active { color: #302ecd; -} - -.btn.btn-sm { +}.btn.btn-sm { font-size: .7rem; height: 1.4rem; padding: .05rem .3rem; -} - -.btn.btn-lg { +}.btn.btn-lg { font-size: .9rem; height: 2rem; padding: .35rem .6rem; -} - -.btn.btn-block { +}.btn.btn-block { display: block; width: 100%; -} - -.btn.btn-action { +}.btn.btn-action { padding-left: 0; - padding-right: 0; + padding-right: 0; width: 1.8rem; -} - -.btn.btn-action.btn-sm { +}.btn.btn-action.btn-sm { width: 1.4rem; -} - -.btn.btn-action.btn-lg { +}.btn.btn-action.btn-lg { width: 2rem; -} - -.btn.btn-clear { +}.btn.btn-clear { background: transparent; border: 0; color: currentColor; @@ -748,94 +467,60 @@ html:lang(ko), padding: .1rem; text-decoration: none; width: 1rem; -} - -.btn.btn-clear:focus, +}.btn.btn-clear:focus, .btn.btn-clear:hover { - background: rgba(247, 248, 249, .5); + background: rgba(247,248,249,.5); opacity: .95; -} - -.btn.btn-clear::before { - content: "\2715"; -} - -.btn-group { +}.btn.btn-clear::before { + content: "✕"; +}.btn-group { display: -ms-inline-flexbox; display: inline-flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -} - -.btn-group .btn { +}.btn-group .btn { -ms-flex: 1 0 auto; flex: 1 0 auto; -} - -.btn-group .btn:first-child:not(:last-child) { +}.btn-group .btn:first-child:not(:last-child) { border-bottom-right-radius: 0; border-top-right-radius: 0; -} - -.btn-group .btn:not(:first-child):not(:last-child) { +}.btn-group .btn:not(:first-child):not(:last-child) { border-radius: 0; margin-left: -.05rem; -} - -.btn-group .btn:last-child:not(:first-child) { +}.btn-group .btn:last-child:not(:first-child) { border-bottom-left-radius: 0; border-top-left-radius: 0; margin-left: -.05rem; -} - -.btn-group .btn:focus, +}.btn-group .btn:focus, .btn-group .btn:hover, .btn-group .btn:active, .btn-group .btn.active { z-index: 1; -} - -.btn-group.btn-group-block { +}.btn-group.btn-group-block { display: -ms-flexbox; display: flex; -} - -.btn-group.btn-group-block .btn { +}.btn-group.btn-group-block .btn { -ms-flex: 1 0 0; flex: 1 0 0; -} - -.form-group:not(:last-child) { +}.form-group:not(:last-child) { margin-bottom: .4rem; -} - -fieldset { +}fieldset { margin-bottom: .8rem; -} - -legend { +}legend { font-size: .9rem; font-weight: 500; margin-bottom: .8rem; -} - -.form-label { +}.form-label { display: block; line-height: 1.2rem; padding: .3rem 0; -} - -.form-label.label-sm { +}.form-label.label-sm { font-size: .7rem; padding: .1rem 0; -} - -.form-label.label-lg { +}.form-label.label-lg { font-size: .9rem; padding: .4rem 0; -} - -.form-input { +}.form-input { -webkit-appearance: none; -moz-appearance: none; appearance: none; @@ -852,76 +537,50 @@ legend { outline: none; padding: .25rem .4rem; position: relative; - transition: background .2s, border .2s, box-shadow .2s, color .2s; + transition: background .2s,border .2s,box-shadow .2s,color .2s; width: 100%; -} - -.form-input:focus { - border-color: #5755d9; - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.form-input:-ms-input-placeholder { +}.form-input:focus { + border-color: #5755d9; + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.form-input:-ms-input-placeholder { color: #bcc3ce; -} - -.form-input::-ms-input-placeholder { +}.form-input::-ms-input-placeholder { color: #bcc3ce; -} - -.form-input::placeholder { +}.form-input::placeholder { color: #bcc3ce; -} - -.form-input.input-sm { +}.form-input.input-sm { font-size: .7rem; height: 1.4rem; padding: .05rem .3rem; -} - -.form-input.input-lg { +}.form-input.input-lg { font-size: .9rem; height: 2rem; padding: .35rem .6rem; -} - -.form-input.input-inline { +}.form-input.input-inline { display: inline-block; vertical-align: middle; width: auto; -} - -.form-input[type="file"] { +}.form-input[type=file] { height: auto; -} - -textarea.form-input, +}textarea.form-input, textarea.form-input.input-lg, textarea.form-input.input-sm { height: auto; -} - -.form-input-hint { +}.form-input-hint { color: #bcc3ce; font-size: .7rem; margin-top: .2rem; -} - -.has-success .form-input-hint, +}.has-success .form-input-hint, .is-success + .form-input-hint { color: #32b643; -} - -.has-error .form-input-hint, +}.has-error .form-input-hint, .is-error + .form-input-hint { color: #e85600; -} - -.form-select { +}.form-select { -webkit-appearance: none; -moz-appearance: none; appearance: none; - background: #fff; + background: #fff; border: .05rem solid #bcc3ce; border-radius: .1rem; color: inherit; @@ -932,51 +591,33 @@ textarea.form-input.input-sm { padding: .25rem .4rem; vertical-align: middle; width: 100%; -} - -.form-select:focus { - border-color: #5755d9; - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.form-select::-ms-expand { +}.form-select:focus { + border-color: #5755d9; + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.form-select::-ms-expand { display: none; -} - -.form-select.select-sm { +}.form-select.select-sm { font-size: .7rem; height: 1.4rem; padding: .05rem 1.1rem .05rem .3rem; -} - -.form-select.select-lg { +}.form-select.select-lg { font-size: .9rem; height: 2rem; padding: .35rem 1.4rem .35rem .6rem; -} - -.form-select[size], +}.form-select[size], .form-select[multiple] { height: auto; padding: .25rem .4rem; -} - -.form-select[size] option, +}.form-select[size] option, .form-select[multiple] option { padding: .1rem .2rem; -} - -.form-select:not([multiple]):not([size]) { +}.form-select:not([multiple]):not([size]) { background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center/.4rem .5rem; padding-right: 1.2rem; -} - -.has-icon-left, +}.has-icon-left, .has-icon-right { position: relative; -} - -.has-icon-left .form-icon, +}.has-icon-left .form-icon, .has-icon-right .form-icon { height: .8rem; margin: 0 .25rem; @@ -985,25 +626,15 @@ textarea.form-input.input-sm { transform: translateY(-50%); width: .8rem; z-index: 2; -} - -.has-icon-left .form-icon { +}.has-icon-left .form-icon { left: .05rem; -} - -.has-icon-left .form-input { +}.has-icon-left .form-input { padding-left: 1.3rem; -} - -.has-icon-right .form-icon { +}.has-icon-right .form-icon { right: .05rem; -} - -.has-icon-right .form-input { +}.has-icon-right .form-input { padding-right: 1.3rem; -} - -.form-checkbox, +}.form-checkbox, .form-radio, .form-switch { display: block; @@ -1012,9 +643,7 @@ textarea.form-input.input-sm { min-height: 1.4rem; padding: .1rem .4rem .1rem 1.2rem; position: relative; -} - -.form-checkbox input, +}.form-checkbox input, .form-radio input, .form-switch input { clip: rect(0, 0, 0, 0); @@ -1023,65 +652,47 @@ textarea.form-input.input-sm { overflow: hidden; position: absolute; width: 1px; -} - -.form-checkbox input:focus + .form-icon, +}.form-checkbox input:focus + .form-icon, .form-radio input:focus + .form-icon, .form-switch input:focus + .form-icon { - border-color: #5755d9; - box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2); -} - -.form-checkbox input:checked + .form-icon, + border-color: #5755d9; + box-shadow: 0 0 0 .1rem rgba(87,85,217,.2); +}.form-checkbox input:checked + .form-icon, .form-radio input:checked + .form-icon, .form-switch input:checked + .form-icon { background: #5755d9; border-color: #5755d9; -} - -.form-checkbox .form-icon, +}.form-checkbox .form-icon, .form-radio .form-icon, .form-switch .form-icon { border: .05rem solid #bcc3ce; cursor: pointer; display: inline-block; position: absolute; - transition: background .2s, border .2s, box-shadow .2s, color .2s; -} - -.form-checkbox.input-sm, + transition: background .2s,border .2s,box-shadow .2s,color .2s; +}.form-checkbox.input-sm, .form-radio.input-sm, .form-switch.input-sm { font-size: .7rem; margin: 0; -} - -.form-checkbox.input-lg, +}.form-checkbox.input-lg, .form-radio.input-lg, .form-switch.input-lg { font-size: .9rem; margin: .3rem 0; -} - -.form-checkbox .form-icon, +}.form-checkbox .form-icon, .form-radio .form-icon { background: #fff; height: .8rem; left: 0; top: .3rem; width: .8rem; -} - -.form-checkbox input:active + .form-icon, +}.form-checkbox input:active + .form-icon, .form-radio input:active + .form-icon { background: #eef0f3; -} - -.form-checkbox .form-icon { +}.form-checkbox .form-icon { border-radius: .1rem; -} - -.form-checkbox input:checked + .form-icon::before { +}.form-checkbox input:checked + .form-icon::before { background-clip: padding-box; border: .1rem solid #fff; border-left-width: 0; @@ -1095,14 +706,10 @@ textarea.form-input.input-sm { top: 50%; transform: rotate(45deg); width: 6px; -} - -.form-checkbox input:indeterminate + .form-icon { +}.form-checkbox input:indeterminate + .form-icon { background: #5755d9; border-color: #5755d9; -} - -.form-checkbox input:indeterminate + .form-icon::before { +}.form-checkbox input:indeterminate + .form-icon::before { background: #fff; content: ""; height: 2px; @@ -1112,13 +719,9 @@ textarea.form-input.input-sm { position: absolute; top: 50%; width: 10px; -} - -.form-radio .form-icon { +}.form-radio .form-icon { border-radius: 50%; -} - -.form-radio input:checked + .form-icon::before { +}.form-radio input:checked + .form-icon::before { background: #fff; border-radius: 50%; content: ""; @@ -1128,13 +731,9 @@ textarea.form-input.input-sm { top: 50%; transform: translate(-50%, -50%); width: 6px; -} - -.form-switch { +}.form-switch { padding-left: 2rem; -} - -.form-switch .form-icon { +}.form-switch .form-icon { background: #bcc3ce; background-clip: padding-box; border-radius: .45rem; @@ -1142,9 +741,7 @@ textarea.form-input.input-sm { left: 0; top: .25rem; width: 1.6rem; -} - -.form-switch .form-icon::before { +}.form-switch .form-icon::before { background: #fff; border-radius: 50%; content: ""; @@ -1153,134 +750,94 @@ textarea.form-input.input-sm { left: 0; position: absolute; top: 0; - transition: background .2s, border .2s, box-shadow .2s, color .2s, left .2s; + transition: background .2s,border .2s,box-shadow .2s,color .2s,left .2s; width: .8rem; -} - -.form-switch input:checked + .form-icon::before { +}.form-switch input:checked + .form-icon::before { left: 14px; -} - -.form-switch input:active + .form-icon::before { +}.form-switch input:active + .form-icon::before { background: #f7f8f9; -} - -.input-group { +}.input-group { display: -ms-flexbox; display: flex; -} - -.input-group .input-group-addon { +}.input-group .input-group-addon { background: #f7f8f9; border: .05rem solid #bcc3ce; border-radius: .1rem; line-height: 1.2rem; padding: .25rem .4rem; white-space: nowrap; -} - -.input-group .input-group-addon.addon-sm { +}.input-group .input-group-addon.addon-sm { font-size: .7rem; padding: .05rem .3rem; -} - -.input-group .input-group-addon.addon-lg { +}.input-group .input-group-addon.addon-lg { font-size: .9rem; padding: .35rem .6rem; -} - -.input-group .form-input, +}.input-group .form-input, .input-group .form-select { -ms-flex: 1 1 auto; flex: 1 1 auto; width: 1%; -} - -.input-group .input-group-btn { +}.input-group .input-group-btn { z-index: 1; -} - -.input-group .form-input:first-child:not(:last-child), +}.input-group .form-input:first-child:not(:last-child), .input-group .form-select:first-child:not(:last-child), .input-group .input-group-addon:first-child:not(:last-child), .input-group .input-group-btn:first-child:not(:last-child) { border-bottom-right-radius: 0; border-top-right-radius: 0; -} - -.input-group .form-input:not(:first-child):not(:last-child), +}.input-group .form-input:not(:first-child):not(:last-child), .input-group .form-select:not(:first-child):not(:last-child), .input-group .input-group-addon:not(:first-child):not(:last-child), .input-group .input-group-btn:not(:first-child):not(:last-child) { border-radius: 0; margin-left: -.05rem; -} - -.input-group .form-input:last-child:not(:first-child), +}.input-group .form-input:last-child:not(:first-child), .input-group .form-select:last-child:not(:first-child), .input-group .input-group-addon:last-child:not(:first-child), .input-group .input-group-btn:last-child:not(:first-child) { border-bottom-left-radius: 0; border-top-left-radius: 0; margin-left: -.05rem; -} - -.input-group .form-input:focus, +}.input-group .form-input:focus, .input-group .form-select:focus, .input-group .input-group-addon:focus, .input-group .input-group-btn:focus { z-index: 2; -} - -.input-group .form-select { +}.input-group .form-select { width: auto; -} - -.input-group.input-inline { +}.input-group.input-inline { display: -ms-inline-flexbox; display: inline-flex; -} - -.has-success .form-input, +}.has-success .form-input, .form-input.is-success, .has-success .form-select, .form-select.is-success { background: #f9fdfa; border-color: #32b643; -} - -.has-success .form-input:focus, +}.has-success .form-input:focus, .form-input.is-success:focus, .has-success .form-select:focus, .form-select.is-success:focus { - box-shadow: 0 0 0 .1rem rgba(50, 182, 67, .2); -} - -.has-error .form-input, + box-shadow: 0 0 0 .1rem rgba(50,182,67,.2); +}.has-error .form-input, .form-input.is-error, .has-error .form-select, .form-select.is-error { background: #fffaf7; border-color: #e85600; -} - -.has-error .form-input:focus, +}.has-error .form-input:focus, .form-input.is-error:focus, .has-error .form-select:focus, .form-select.is-error:focus { - box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2); -} - -.has-error .form-checkbox .form-icon, + box-shadow: 0 0 0 .1rem rgba(232,86,0,.2); +}.has-error .form-checkbox .form-icon, .form-checkbox.is-error .form-icon, .has-error .form-radio .form-icon, .form-radio.is-error .form-icon, .has-error .form-switch .form-icon, .form-switch.is-error .form-icon { border-color: #e85600; -} - -.has-error .form-checkbox input:checked + .form-icon, +}.has-error .form-checkbox input:checked + .form-icon, .form-checkbox.is-error input:checked + .form-icon, .has-error .form-radio input:checked + .form-icon, .form-radio.is-error input:checked + .form-icon, @@ -1288,155 +845,103 @@ textarea.form-input.input-sm { .form-switch.is-error input:checked + .form-icon { background: #e85600; border-color: #e85600; -} - -.has-error .form-checkbox input:focus + .form-icon, +}.has-error .form-checkbox input:focus + .form-icon, .form-checkbox.is-error input:focus + .form-icon, .has-error .form-radio input:focus + .form-icon, .form-radio.is-error input:focus + .form-icon, .has-error .form-switch input:focus + .form-icon, .form-switch.is-error input:focus + .form-icon { - border-color: #e85600; - box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2); -} - -.has-error .form-checkbox input:indeterminate + .form-icon, + border-color: #e85600; + box-shadow: 0 0 0 .1rem rgba(232,86,0,.2); +}.has-error .form-checkbox input:indeterminate + .form-icon, .form-checkbox.is-error input:indeterminate + .form-icon { background: #e85600; border-color: #e85600; -} - -.form-input:not(:-ms-input-placeholder):invalid { +}.form-input:not(:-ms-input-placeholder):invalid { border-color: #e85600; -} - -.form-input:not(:placeholder-shown):invalid { +}.form-input:not(:placeholder-shown):invalid { border-color: #e85600; -} - -.form-input:not(:-ms-input-placeholder):invalid:focus { - background: #fffaf7; - box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2); -} - -.form-input:not(:placeholder-shown):invalid:focus { - background: #fffaf7; - box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2); -} - -.form-input:not(:-ms-input-placeholder):invalid + .form-input-hint { +}.form-input:not(:-ms-input-placeholder):invalid:focus { + background: #fffaf7; + box-shadow: 0 0 0 .1rem rgba(232,86,0,.2); +}.form-input:not(:placeholder-shown):invalid:focus { + background: #fffaf7; + box-shadow: 0 0 0 .1rem rgba(232,86,0,.2); +}.form-input:not(:-ms-input-placeholder):invalid + .form-input-hint { color: #e85600; -} - -.form-input:not(:placeholder-shown):invalid + .form-input-hint { +}.form-input:not(:placeholder-shown):invalid + .form-input-hint { color: #e85600; -} - -.form-input:disabled, +}.form-input:disabled, .form-input.disabled, .form-select:disabled, .form-select.disabled { background-color: #eef0f3; cursor: not-allowed; opacity: .5; -} - -.form-input[readonly] { +}.form-input[readonly] { background-color: #f7f8f9; -} - -input:disabled + .form-icon, +}input:disabled + .form-icon, input.disabled + .form-icon { background: #eef0f3; cursor: not-allowed; opacity: .5; -} - -.form-switch input:disabled + .form-icon::before, +}.form-switch input:disabled + .form-icon::before, .form-switch input.disabled + .form-icon::before { background: #fff; -} - -.form-horizontal { +}.form-horizontal { padding: .4rem 0; -} - -.form-horizontal .form-group { +}.form-horizontal .form-group { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -} - -.form-inline { +}.form-inline { display: inline-block; -} - -.label { +}.label { background: #eef0f3; border-radius: .1rem; color: #455060; - display: inline-block; + display: inline-block; line-height: 1.25; padding: .1rem .2rem; -} - -.label.label-rounded { +}.label.label-rounded { border-radius: 5rem; padding-left: .4rem; padding-right: .4rem; -} - -.label.label-primary { +}.label.label-primary { background: #5755d9; color: #fff; -} - -.label.label-secondary { +}.label.label-secondary { background: #f1f1fc; color: #5755d9; -} - -.label.label-success { +}.label.label-success { background: #32b643; color: #fff; -} - -.label.label-warning { +}.label.label-warning { background: #ffb700; color: #fff; -} - -.label.label-error { +}.label.label-error { background: #e85600; color: #fff; -} - -code { +}code { background: #fcf2f2; border-radius: .1rem; color: #d73e48; - font-size: 85%; + font-size: 85%; line-height: 1.25; padding: .1rem .2rem; -} - -.code { +}.code { border-radius: .1rem; color: #3b4351; position: relative; -} - -.code::before { +}.code::before { color: #bcc3ce; content: attr(data-lang); font-size: .7rem; position: absolute; right: .4rem; top: .1rem; -} - -.code code { +}.code code { background: #f7f8f9; color: inherit; display: block; @@ -1444,37 +949,25 @@ code { overflow-x: auto; padding: 1rem; width: 100%; -} - -.img-responsive { +}.img-responsive { display: block; height: auto; max-width: 100%; -} - -.img-fit-cover { +}.img-fit-cover { object-fit: cover; -} - -.img-fit-contain { +}.img-fit-contain { object-fit: contain; -} - -.video-responsive { +}.video-responsive { display: block; overflow: hidden; padding: 0; position: relative; width: 100%; -} - -.video-responsive::before { +}.video-responsive::before { content: ""; display: block; padding-bottom: 56.25%; -} - -.video-responsive iframe, +}.video-responsive iframe, .video-responsive object, .video-responsive embed { border: 0; @@ -1485,71 +978,43 @@ code { right: 0; top: 0; width: 100%; -} - -video.video-responsive { +}video.video-responsive { height: auto; max-width: 100%; -} - -video.video-responsive::before { +}video.video-responsive::before { content: none; -} - -.video-responsive-4-3::before { +}.video-responsive-4-3::before { padding-bottom: 75%; -} - -.video-responsive-1-1::before { +}.video-responsive-1-1::before { padding-bottom: 100%; -} - -.figure { +}.figure { margin: 0 0 .4rem 0; -} - -.figure .figure-caption { +}.figure .figure-caption { color: #66758c; margin-top: .4rem; -} - -.container { +}.container { margin-left: auto; margin-right: auto; padding-left: .4rem; padding-right: .4rem; width: 100%; -} - -.container.grid-xl { +}.container.grid-xl { max-width: 1296px; -} - -.container.grid-lg { +}.container.grid-lg { max-width: 976px; -} - -.container.grid-md { +}.container.grid-md { max-width: 856px; -} - -.container.grid-sm { +}.container.grid-sm { max-width: 616px; -} - -.container.grid-xs { +}.container.grid-xs { max-width: 496px; -} - -.show-xs, +}.show-xs, .show-sm, .show-md, .show-lg, .show-xl { display: none !important; -} - -.cols, +}.cols, .columns { display: -ms-flexbox; display: flex; @@ -1557,49 +1022,39 @@ video.video-responsive::before { flex-wrap: wrap; margin-left: -.4rem; margin-right: -.4rem; -} - -.cols.col-gapless, +}.cols.col-gapless, .columns.col-gapless { margin-left: 0; margin-right: 0; -} - -.cols.col-gapless > .column, +}.cols.col-gapless > .column, .columns.col-gapless > .column { padding-left: 0; padding-right: 0; -} - -.cols.col-oneline, +}.cols.col-oneline, .columns.col-oneline { -ms-flex-wrap: nowrap; flex-wrap: nowrap; overflow-x: auto; -} - -[class~="col-"], +}[class~=col-], .column { -ms-flex: 1; flex: 1; max-width: 100%; padding-left: .4rem; padding-right: .4rem; -} - -[class~="col-"].col-12, -[class~="col-"].col-11, -[class~="col-"].col-10, -[class~="col-"].col-9, -[class~="col-"].col-8, -[class~="col-"].col-7, -[class~="col-"].col-6, -[class~="col-"].col-5, -[class~="col-"].col-4, -[class~="col-"].col-3, -[class~="col-"].col-2, -[class~="col-"].col-1, -[class~="col-"].col-auto, +}[class~=col-].col-12, +[class~=col-].col-11, +[class~=col-].col-10, +[class~=col-].col-9, +[class~=col-].col-8, +[class~=col-].col-7, +[class~=col-].col-6, +[class~=col-].col-5, +[class~=col-].col-4, +[class~=col-].col-3, +[class~=col-].col-2, +[class~=col-].col-1, +[class~=col-].col-auto, .column.col-12, .column.col-11, .column.col-10, @@ -1615,77 +1070,43 @@ video.video-responsive::before { .column.col-auto { -ms-flex: none; flex: none; -} - -.col-12 { +}.col-12 { width: 100%; -} - -.col-11 { +}.col-11 { width: 91.66666667%; -} - -.col-10 { +}.col-10 { width: 83.33333333%; -} - -.col-9 { +}.col-9 { width: 75%; -} - -.col-8 { +}.col-8 { width: 66.66666667%; -} - -.col-7 { +}.col-7 { width: 58.33333333%; -} - -.col-6 { +}.col-6 { width: 50%; -} - -.col-5 { +}.col-5 { width: 41.66666667%; -} - -.col-4 { +}.col-4 { width: 33.33333333%; -} - -.col-3 { +}.col-3 { width: 25%; -} - -.col-2 { +}.col-2 { width: 16.66666667%; -} - -.col-1 { +}.col-1 { width: 8.33333333%; -} - -.col-auto { +}.col-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; max-width: none; width: auto; -} - -.col-mx-auto { +}.col-mx-auto { margin-left: auto; margin-right: auto; -} - -.col-ml-auto { +}.col-ml-auto { margin-left: auto; -} - -.col-mr-auto { +}.col-mr-auto { margin-right: auto; -} - -@media (max-width: 1280px) { +}@media(max-width: 1280px) { .col-xl-12, .col-xl-11, .col-xl-10, @@ -1701,55 +1122,38 @@ video.video-responsive::before { .col-xl-auto { -ms-flex: none; flex: none; - } - .col-xl-12 { + }.col-xl-12 { width: 100%; - } - .col-xl-11 { + }.col-xl-11 { width: 91.66666667%; - } - .col-xl-10 { + }.col-xl-10 { width: 83.33333333%; - } - .col-xl-9 { + }.col-xl-9 { width: 75%; - } - .col-xl-8 { + }.col-xl-8 { width: 66.66666667%; - } - .col-xl-7 { + }.col-xl-7 { width: 58.33333333%; - } - .col-xl-6 { + }.col-xl-6 { width: 50%; - } - .col-xl-5 { + }.col-xl-5 { width: 41.66666667%; - } - .col-xl-4 { + }.col-xl-4 { width: 33.33333333%; - } - .col-xl-3 { + }.col-xl-3 { width: 25%; - } - .col-xl-2 { + }.col-xl-2 { width: 16.66666667%; - } - .col-xl-1 { + }.col-xl-1 { width: 8.33333333%; - } - .col-xl-auto { + }.col-xl-auto { width: auto; - } - .hide-xl { + }.hide-xl { display: none !important; - } - .show-xl { + }.show-xl { display: block !important; } -} - -@media (max-width: 960px) { +}@media(max-width: 960px) { .col-lg-12, .col-lg-11, .col-lg-10, @@ -1765,55 +1169,38 @@ video.video-responsive::before { .col-lg-auto { -ms-flex: none; flex: none; - } - .col-lg-12 { + }.col-lg-12 { width: 100%; - } - .col-lg-11 { + }.col-lg-11 { width: 91.66666667%; - } - .col-lg-10 { + }.col-lg-10 { width: 83.33333333%; - } - .col-lg-9 { + }.col-lg-9 { width: 75%; - } - .col-lg-8 { + }.col-lg-8 { width: 66.66666667%; - } - .col-lg-7 { + }.col-lg-7 { width: 58.33333333%; - } - .col-lg-6 { + }.col-lg-6 { width: 50%; - } - .col-lg-5 { + }.col-lg-5 { width: 41.66666667%; - } - .col-lg-4 { + }.col-lg-4 { width: 33.33333333%; - } - .col-lg-3 { + }.col-lg-3 { width: 25%; - } - .col-lg-2 { + }.col-lg-2 { width: 16.66666667%; - } - .col-lg-1 { + }.col-lg-1 { width: 8.33333333%; - } - .col-lg-auto { + }.col-lg-auto { width: auto; - } - .hide-lg { + }.hide-lg { display: none !important; - } - .show-lg { + }.show-lg { display: block !important; } -} - -@media (max-width: 840px) { +}@media(max-width: 840px) { .col-md-12, .col-md-11, .col-md-10, @@ -1829,55 +1216,38 @@ video.video-responsive::before { .col-md-auto { -ms-flex: none; flex: none; - } - .col-md-12 { + }.col-md-12 { width: 100%; - } - .col-md-11 { + }.col-md-11 { width: 91.66666667%; - } - .col-md-10 { + }.col-md-10 { width: 83.33333333%; - } - .col-md-9 { + }.col-md-9 { width: 75%; - } - .col-md-8 { + }.col-md-8 { width: 66.66666667%; - } - .col-md-7 { + }.col-md-7 { width: 58.33333333%; - } - .col-md-6 { + }.col-md-6 { width: 50%; - } - .col-md-5 { + }.col-md-5 { width: 41.66666667%; - } - .col-md-4 { + }.col-md-4 { width: 33.33333333%; - } - .col-md-3 { + }.col-md-3 { width: 25%; - } - .col-md-2 { + }.col-md-2 { width: 16.66666667%; - } - .col-md-1 { + }.col-md-1 { width: 8.33333333%; - } - .col-md-auto { + }.col-md-auto { width: auto; - } - .hide-md { + }.hide-md { display: none !important; - } - .show-md { + }.show-md { display: block !important; } -} - -@media (max-width: 600px) { +}@media(max-width: 600px) { .col-sm-12, .col-sm-11, .col-sm-10, @@ -1893,55 +1263,38 @@ video.video-responsive::before { .col-sm-auto { -ms-flex: none; flex: none; - } - .col-sm-12 { + }.col-sm-12 { width: 100%; - } - .col-sm-11 { + }.col-sm-11 { width: 91.66666667%; - } - .col-sm-10 { + }.col-sm-10 { width: 83.33333333%; - } - .col-sm-9 { + }.col-sm-9 { width: 75%; - } - .col-sm-8 { + }.col-sm-8 { width: 66.66666667%; - } - .col-sm-7 { + }.col-sm-7 { width: 58.33333333%; - } - .col-sm-6 { + }.col-sm-6 { width: 50%; - } - .col-sm-5 { + }.col-sm-5 { width: 41.66666667%; - } - .col-sm-4 { + }.col-sm-4 { width: 33.33333333%; - } - .col-sm-3 { + }.col-sm-3 { width: 25%; - } - .col-sm-2 { + }.col-sm-2 { width: 16.66666667%; - } - .col-sm-1 { + }.col-sm-1 { width: 8.33333333%; - } - .col-sm-auto { + }.col-sm-auto { width: auto; - } - .hide-sm { + }.hide-sm { display: none !important; - } - .show-sm { + }.show-sm { display: block !important; } -} - -@media (max-width: 480px) { +}@media(max-width: 480px) { .col-xs-12, .col-xs-11, .col-xs-10, @@ -1957,55 +1310,38 @@ video.video-responsive::before { .col-xs-auto { -ms-flex: none; flex: none; - } - .col-xs-12 { + }.col-xs-12 { width: 100%; - } - .col-xs-11 { + }.col-xs-11 { width: 91.66666667%; - } - .col-xs-10 { + }.col-xs-10 { width: 83.33333333%; - } - .col-xs-9 { + }.col-xs-9 { width: 75%; - } - .col-xs-8 { + }.col-xs-8 { width: 66.66666667%; - } - .col-xs-7 { + }.col-xs-7 { width: 58.33333333%; - } - .col-xs-6 { + }.col-xs-6 { width: 50%; - } - .col-xs-5 { + }.col-xs-5 { width: 41.66666667%; - } - .col-xs-4 { + }.col-xs-4 { width: 33.33333333%; - } - .col-xs-3 { + }.col-xs-3 { width: 25%; - } - .col-xs-2 { + }.col-xs-2 { width: 16.66666667%; - } - .col-xs-1 { + }.col-xs-1 { width: 8.33333333%; - } - .col-xs-auto { + }.col-xs-auto { width: auto; - } - .hide-xs { + }.hide-xs { display: none !important; - } - .show-xs { + }.show-xs { display: block !important; } -} - -.hero { +}.hero { display: -ms-flexbox; display: flex; -ms-flex-direction: column; @@ -2014,23 +1350,15 @@ video.video-responsive::before { justify-content: space-between; padding-bottom: 4rem; padding-top: 4rem; -} - -.hero.hero-sm { +}.hero.hero-sm { padding-bottom: 2rem; padding-top: 2rem; -} - -.hero.hero-lg { +}.hero.hero-lg { padding-bottom: 8rem; padding-top: 8rem; -} - -.hero .hero-body { +}.hero .hero-body { padding: .4rem; -} - -.navbar { +}.navbar { align-items: stretch; display: -ms-flexbox; display: flex; @@ -2039,70 +1367,48 @@ video.video-responsive::before { -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; -} - -.navbar .navbar-section { +}.navbar .navbar-section { align-items: center; display: -ms-flexbox; display: flex; -ms-flex: 1 0 0; - flex: 1 0 0; + flex: 1 0 0; -ms-flex-align: center; -} - -.navbar .navbar-section:not(:first-child):last-child { +}.navbar .navbar-section:not(:first-child):last-child { -ms-flex-pack: end; justify-content: flex-end; -} - -.navbar .navbar-center { +}.navbar .navbar-center { align-items: center; display: -ms-flexbox; display: flex; -ms-flex: 0 0 auto; - flex: 0 0 auto; + flex: 0 0 auto; -ms-flex-align: center; -} - -.navbar .navbar-brand { +}.navbar .navbar-brand { font-size: .9rem; text-decoration: none; -} - -.accordion input:checked ~ .accordion-header > .icon:first-child, +}.accordion input:checked ~ .accordion-header > .icon:first-child, .accordion[open] .accordion-header > .icon:first-child { transform: rotate(90deg); -} - -.accordion input:checked ~ .accordion-body, +}.accordion input:checked ~ .accordion-body, .accordion[open] .accordion-body { max-height: 50rem; -} - -.accordion .accordion-header { +}.accordion .accordion-header { display: block; padding: .2rem .4rem; -} - -.accordion .accordion-header .icon { +}.accordion .accordion-header .icon { transition: transform .25s; -} - -.accordion .accordion-body { +}.accordion .accordion-body { margin-bottom: .4rem; max-height: 0; overflow: hidden; transition: max-height .25s; -} - -summary.accordion-header::-webkit-details-marker { +}summary.accordion-header::-webkit-details-marker { display: none; -} - -.avatar { +}.avatar { background: #5755d9; border-radius: 50%; - color: rgba(255, 255, 255, .85); + color: rgba(255,255,255,.85); display: inline-block; font-size: .8rem; font-weight: 300; @@ -2110,43 +1416,31 @@ summary.accordion-header::-webkit-details-marker { line-height: 1.25; margin: 0; position: relative; - vertical-align: middle; + vertical-align: middle; width: 1.6rem; -} - -.avatar.avatar-xs { +}.avatar.avatar-xs { font-size: .4rem; height: .8rem; width: .8rem; -} - -.avatar.avatar-sm { +}.avatar.avatar-sm { font-size: .6rem; height: 1.2rem; width: 1.2rem; -} - -.avatar.avatar-lg { +}.avatar.avatar-lg { font-size: 1.2rem; height: 2.4rem; width: 2.4rem; -} - -.avatar.avatar-xl { +}.avatar.avatar-xl { font-size: 1.6rem; height: 3.2rem; width: 3.2rem; -} - -.avatar img { +}.avatar img { border-radius: 50%; height: 100%; position: relative; width: 100%; z-index: 1; -} - -.avatar .avatar-icon, +}.avatar .avatar-icon, .avatar .avatar-presence { background: #fff; bottom: 14.64%; @@ -2157,29 +1451,19 @@ summary.accordion-header::-webkit-details-marker { transform: translate(50%, 50%); width: 50%; z-index: 2; -} - -.avatar .avatar-presence { +}.avatar .avatar-presence { background: #bcc3ce; border-radius: 50%; box-shadow: 0 0 0 .1rem #fff; height: .5em; width: .5em; -} - -.avatar .avatar-presence.online { +}.avatar .avatar-presence.online { background: #32b643; -} - -.avatar .avatar-presence.busy { +}.avatar .avatar-presence.busy { background: #e85600; -} - -.avatar .avatar-presence.away { +}.avatar .avatar-presence.away { background: #ffb700; -} - -.avatar[data-initial]::before { +}.avatar[data-initial]::before { color: currentColor; content: attr(data-initial); left: 50%; @@ -2187,14 +1471,10 @@ summary.accordion-header::-webkit-details-marker { top: 50%; transform: translate(-50%, -50%); z-index: 1; -} - -.badge { +}.badge { position: relative; white-space: nowrap; -} - -.badge[data-badge]::after, +}.badge[data-badge]::after, .badge:not([data-badge])::after { background: #5755d9; background-clip: padding-box; @@ -2204,9 +1484,7 @@ summary.accordion-header::-webkit-details-marker { content: attr(data-badge); display: inline-block; transform: translate(-.05rem, -.5rem); -} - -.badge[data-badge]::after { +}.badge[data-badge]::after { font-size: .7rem; height: .9rem; line-height: 1; @@ -2214,59 +1492,41 @@ summary.accordion-header::-webkit-details-marker { padding: .1rem .2rem; text-align: center; white-space: nowrap; -} - -.badge:not([data-badge])::after, +}.badge:not([data-badge])::after, .badge[data-badge=""]::after { height: 6px; min-width: 6px; padding: 0; width: 6px; -} - -.badge.btn::after { +}.badge.btn::after { position: absolute; right: 0; top: 0; transform: translate(50%, -50%); -} - -.badge.avatar::after { +}.badge.avatar::after { position: absolute; right: 14.64%; top: 14.64%; transform: translate(50%, -50%); z-index: 100; -} - -.breadcrumb { +}.breadcrumb { list-style: none; margin: .2rem 0; padding: .2rem 0; -} - -.breadcrumb .breadcrumb-item { +}.breadcrumb .breadcrumb-item { color: #66758c; display: inline-block; margin: 0; padding: .2rem 0; -} - -.breadcrumb .breadcrumb-item:not(:last-child) { +}.breadcrumb .breadcrumb-item:not(:last-child) { margin-right: .2rem; -} - -.breadcrumb .breadcrumb-item:not(:last-child) a { +}.breadcrumb .breadcrumb-item:not(:last-child) a { color: #66758c; -} - -.breadcrumb .breadcrumb-item:not(:first-child)::before { +}.breadcrumb .breadcrumb-item:not(:first-child)::before { color: #66758c; content: "/"; padding-right: .4rem; -} - -.bar { +}.bar { background: #eef0f3; border-radius: .1rem; display: -ms-flexbox; @@ -2275,13 +1535,9 @@ summary.accordion-header::-webkit-details-marker { flex-wrap: nowrap; height: .8rem; width: 100%; -} - -.bar.bar-sm { +}.bar.bar-sm { height: .2rem; -} - -.bar .bar-item { +}.bar .bar-item { background: #5755d9; color: #fff; display: block; @@ -2293,38 +1549,26 @@ summary.accordion-header::-webkit-details-marker { position: relative; text-align: center; width: 0; -} - -.bar .bar-item:first-child { +}.bar .bar-item:first-child { border-bottom-left-radius: .1rem; border-top-left-radius: .1rem; -} - -.bar .bar-item:last-child { +}.bar .bar-item:last-child { border-bottom-right-radius: .1rem; border-top-right-radius: .1rem; -ms-flex-negative: 1; flex-shrink: 1; -} - -.bar-slider { +}.bar-slider { height: .1rem; margin: .4rem 0; position: relative; -} - -.bar-slider .bar-item { +}.bar-slider .bar-item { left: 0; padding: 0; position: absolute; -} - -.bar-slider .bar-item:not(:last-child):first-child { +}.bar-slider .bar-item:not(:last-child):first-child { background: #eef0f3; z-index: 1; -} - -.bar-slider .bar-slider-btn { +}.bar-slider .bar-slider-btn { background: #5755d9; border: 0; border-radius: 50%; @@ -2335,13 +1579,9 @@ summary.accordion-header::-webkit-details-marker { top: 50%; transform: translate(50%, -50%); width: .6rem; -} - -.bar-slider .bar-slider-btn:active { +}.bar-slider .bar-slider-btn:active { box-shadow: 0 0 0 .1rem #5755d9; -} - -.card { +}.card { background: #fff; border: .05rem solid #dadee4; border-radius: .1rem; @@ -2349,45 +1589,29 @@ summary.accordion-header::-webkit-details-marker { display: flex; -ms-flex-direction: column; flex-direction: column; -} - -.card .card-header, +}.card .card-header, .card .card-body, .card .card-footer { padding: .8rem; padding-bottom: 0; -} - -.card .card-header:last-child, +}.card .card-header:last-child, .card .card-body:last-child, .card .card-footer:last-child { padding-bottom: .8rem; -} - -.card .card-body { +}.card .card-body { -ms-flex: 1 1 auto; flex: 1 1 auto; -} - -.card .card-image { +}.card .card-image { padding-top: .8rem; -} - -.card .card-image:first-child { +}.card .card-image:first-child { padding-top: 0; -} - -.card .card-image:first-child img { +}.card .card-image:first-child img { border-top-left-radius: .1rem; border-top-right-radius: .1rem; -} - -.card .card-image:last-child img { +}.card .card-image:last-child img { border-bottom-left-radius: .1rem; border-bottom-right-radius: .1rem; -} - -.chip { +}.chip { align-items: center; background: #eef0f3; border-radius: 5rem; @@ -2405,29 +1629,19 @@ summary.accordion-header::-webkit-details-marker { text-overflow: ellipsis; vertical-align: middle; white-space: nowrap; -} - -.chip.active { +}.chip.active { background: #5755d9; color: #fff; -} - -.chip .avatar { +}.chip .avatar { margin-left: -.4rem; margin-right: .2rem; -} - -.chip .btn-clear { +}.chip .btn-clear { border-radius: 50%; transform: scale(.75); -} - -.dropdown { +}.dropdown { display: inline-block; position: relative; -} - -.dropdown .menu { +}.dropdown .menu { animation: slide-down .15s ease 1; display: none; left: 0; @@ -2435,101 +1649,69 @@ summary.accordion-header::-webkit-details-marker { overflow-y: auto; position: absolute; top: 100%; -} - -.dropdown.dropdown-right .menu { +}.dropdown.dropdown-right .menu { left: auto; right: 0; -} - -.dropdown.active .menu, +}.dropdown.active .menu, .dropdown .dropdown-toggle:focus + .menu, .dropdown .menu:hover { display: block; -} - -.dropdown .btn-group .dropdown-toggle:nth-last-child(2) { +}.dropdown .btn-group .dropdown-toggle:nth-last-child(2) { border-bottom-right-radius: .1rem; border-top-right-radius: .1rem; -} - -.empty { +}.empty { background: #f7f8f9; border-radius: .1rem; color: #66758c; - padding: 3.2rem 1.6rem; + padding: 3.2rem 1.6rem; text-align: center; -} - -.empty .empty-icon { +}.empty .empty-icon { margin-bottom: .8rem; -} - -.empty .empty-title, +}.empty .empty-title, .empty .empty-subtitle { margin: .4rem auto; -} - -.empty .empty-action { +}.empty .empty-action { margin-top: .8rem; -} - -.menu { +}.menu { background: #fff; border-radius: .1rem; - box-shadow: 0 .05rem .2rem rgba(48, 55, 66, .3); + box-shadow: 0 .05rem .2rem rgba(48,55,66,.3); list-style: none; margin: 0; min-width: 180px; padding: .4rem; transform: translateY(.2rem); z-index: 300; -} - -.menu.menu-nav { +}.menu.menu-nav { background: transparent; box-shadow: none; -} - -.menu .menu-item { +}.menu .menu-item { margin-top: 0; padding: 0 .4rem; position: relative; text-decoration: none; -} - -.menu .menu-item > a { +}.menu .menu-item > a { border-radius: .1rem; color: inherit; display: block; margin: 0 -.4rem; padding: .2rem .4rem; text-decoration: none; -} - -.menu .menu-item > a:focus, +}.menu .menu-item > a:focus, .menu .menu-item > a:hover { background: #f1f1fc; color: #5755d9; -} - -.menu .menu-item > a:active, +}.menu .menu-item > a:active, .menu .menu-item > a.active { background: #f1f1fc; color: #5755d9; -} - -.menu .menu-item .form-checkbox, +}.menu .menu-item .form-checkbox, .menu .menu-item .form-radio, .menu .menu-item .form-switch { margin: .1rem 0; -} - -.menu .menu-item + .menu-item { +}.menu .menu-item + .menu-item { margin-top: .2rem; -} - -.menu .menu-badge { +}.menu .menu-badge { align-items: center; display: -ms-flexbox; display: flex; @@ -2538,13 +1720,9 @@ summary.accordion-header::-webkit-details-marker { position: absolute; right: 0; top: 0; -} - -.menu .menu-badge .label { +}.menu .menu-badge .label { margin-right: .4rem; -} - -.modal { +}.modal { align-items: center; bottom: 0; display: none; @@ -2558,19 +1736,15 @@ summary.accordion-header::-webkit-details-marker { position: fixed; right: 0; top: 0; -} - -.modal:target, +}.modal:target, .modal.active { display: -ms-flexbox; display: flex; opacity: 1; z-index: 400; -} - -.modal:target .modal-overlay, +}.modal:target .modal-overlay, .modal.active .modal-overlay { - background: rgba(247, 248, 249, .75); + background: rgba(247,248,249,.75); bottom: 0; cursor: default; display: block; @@ -2578,32 +1752,22 @@ summary.accordion-header::-webkit-details-marker { position: absolute; right: 0; top: 0; -} - -.modal:target .modal-container, +}.modal:target .modal-container, .modal.active .modal-container { animation: slide-down .2s ease 1; z-index: 1; -} - -.modal.modal-sm .modal-container { +}.modal.modal-sm .modal-container { max-width: 320px; padding: 0 .4rem; -} - -.modal.modal-lg .modal-overlay { +}.modal.modal-lg .modal-overlay { background: #fff; -} - -.modal.modal-lg .modal-container { +}.modal.modal-lg .modal-container { box-shadow: none; max-width: 960px; -} - -.modal-container { +}.modal-container { background: #fff; border-radius: .1rem; - box-shadow: 0 .2rem .5rem rgba(48, 55, 66, .3); + box-shadow: 0 .2rem .5rem rgba(48,55,66,.3); display: -ms-flexbox; display: flex; -ms-flex-direction: column; @@ -2612,156 +1776,102 @@ summary.accordion-header::-webkit-details-marker { max-width: 640px; padding: 0 .8rem; width: 100%; -} - -.modal-container.modal-fullheight { +}.modal-container.modal-fullheight { max-height: 100vh; -} - -.modal-container .modal-header { +}.modal-container .modal-header { color: #303742; padding: .8rem; -} - -.modal-container .modal-body { +}.modal-container .modal-body { overflow-y: auto; padding: .8rem; position: relative; -} - -.modal-container .modal-footer { +}.modal-container .modal-footer { padding: .8rem; text-align: right; -} - -.nav { +}.nav { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; list-style: none; margin: .2rem 0; -} - -.nav .nav-item a { +}.nav .nav-item a { color: #66758c; padding: .2rem .4rem; text-decoration: none; -} - -.nav .nav-item a:focus, +}.nav .nav-item a:focus, .nav .nav-item a:hover { color: #5755d9; -} - -.nav .nav-item.active > a { +}.nav .nav-item.active > a { color: #505c6e; font-weight: bold; -} - -.nav .nav-item.active > a:focus, +}.nav .nav-item.active > a:focus, .nav .nav-item.active > a:hover { color: #5755d9; -} - -.nav .nav { +}.nav .nav { margin-bottom: .4rem; margin-left: .8rem; -} - -.pagination { +}.pagination { display: -ms-flexbox; display: flex; list-style: none; margin: .2rem 0; padding: .2rem 0; -} - -.pagination .page-item { +}.pagination .page-item { margin: .2rem .05rem; -} - -.pagination .page-item span { +}.pagination .page-item span { display: inline-block; padding: .2rem .2rem; -} - -.pagination .page-item a { +}.pagination .page-item a { border-radius: .1rem; display: inline-block; padding: .2rem .4rem; text-decoration: none; -} - -.pagination .page-item a:focus, +}.pagination .page-item a:focus, .pagination .page-item a:hover { color: #5755d9; -} - -.pagination .page-item.disabled a { +}.pagination .page-item.disabled a { cursor: default; opacity: .5; pointer-events: none; -} - -.pagination .page-item.active a { +}.pagination .page-item.active a { background: #5755d9; color: #fff; -} - -.pagination .page-item.page-prev, +}.pagination .page-item.page-prev, .pagination .page-item.page-next { -ms-flex: 1 0 50%; flex: 1 0 50%; -} - -.pagination .page-item.page-next { +}.pagination .page-item.page-next { text-align: right; -} - -.pagination .page-item .page-item-title { +}.pagination .page-item .page-item-title { margin: 0; -} - -.pagination .page-item .page-item-subtitle { +}.pagination .page-item .page-item-subtitle { margin: 0; opacity: .5; -} - -.panel { +}.panel { border: .05rem solid #dadee4; border-radius: .1rem; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -} - -.panel .panel-header, +}.panel .panel-header, .panel .panel-footer { -ms-flex: 0 0 auto; flex: 0 0 auto; padding: .8rem; -} - -.panel .panel-nav { +}.panel .panel-nav { -ms-flex: 0 0 auto; flex: 0 0 auto; -} - -.panel .panel-body { +}.panel .panel-body { -ms-flex: 1 1 auto; flex: 1 1 auto; overflow-y: auto; padding: 0 .8rem; -} - -.popover { +}.popover { display: inline-block; position: relative; -} - -.popover .popover-container { +}.popover .popover-container { left: 50%; opacity: 0; padding: .4rem; @@ -2771,51 +1881,33 @@ summary.accordion-header::-webkit-details-marker { transition: transform .2s; width: 320px; z-index: 300; -} - -.popover *:focus + .popover-container, +}.popover *:focus + .popover-container, .popover:hover .popover-container { display: block; opacity: 1; transform: translate(-50%, -100%) scale(1); -} - -.popover.popover-right .popover-container { +}.popover.popover-right .popover-container { left: 100%; top: 50%; -} - -.popover.popover-right *:focus + .popover-container, +}.popover.popover-right *:focus + .popover-container, .popover.popover-right:hover .popover-container { transform: translate(0, -50%) scale(1); -} - -.popover.popover-bottom .popover-container { +}.popover.popover-bottom .popover-container { left: 50%; top: 100%; -} - -.popover.popover-bottom *:focus + .popover-container, +}.popover.popover-bottom *:focus + .popover-container, .popover.popover-bottom:hover .popover-container { transform: translate(-50%, 0) scale(1); -} - -.popover.popover-left .popover-container { +}.popover.popover-left .popover-container { left: 0; top: 50%; -} - -.popover.popover-left *:focus + .popover-container, +}.popover.popover-left *:focus + .popover-container, .popover.popover-left:hover .popover-container { transform: translate(-100%, -50%) scale(1); -} - -.popover .card { - border: 0; - box-shadow: 0 .2rem .5rem rgba(48, 55, 66, .3); -} - -.step { +}.popover .card { + border: 0; + box-shadow: 0 .2rem .5rem rgba(48,55,66,.3); +}.step { display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; @@ -2823,18 +1915,14 @@ summary.accordion-header::-webkit-details-marker { list-style: none; margin: .2rem 0; width: 100%; -} - -.step .step-item { +}.step .step-item { -ms-flex: 1 1 0; flex: 1 1 0; margin-top: 0; min-height: 1rem; - position: relative; + position: relative; text-align: center; -} - -.step .step-item:not(:first-child)::before { +}.step .step-item:not(:first-child)::before { background: #5755d9; content: ""; height: 2px; @@ -2842,16 +1930,12 @@ summary.accordion-header::-webkit-details-marker { position: absolute; top: 9px; width: 100%; -} - -.step .step-item a { +}.step .step-item a { color: #5755d9; display: inline-block; padding: 20px 10px 0; text-decoration: none; -} - -.step .step-item a::before { +}.step .step-item a::before { background: #5755d9; border: .1rem solid #fff; border-radius: 50%; @@ -2864,26 +1948,16 @@ summary.accordion-header::-webkit-details-marker { transform: translateX(-50%); width: .6rem; z-index: 1; -} - -.step .step-item.active a::before { +}.step .step-item.active a::before { background: #fff; border: .1rem solid #5755d9; -} - -.step .step-item.active ~ .step-item::before { +}.step .step-item.active ~ .step-item::before { background: #dadee4; -} - -.step .step-item.active ~ .step-item a { +}.step .step-item.active ~ .step-item a { color: #bcc3ce; -} - -.step .step-item.active ~ .step-item a::before { +}.step .step-item.active ~ .step-item a::before { background: #dadee4; -} - -.tab { +}.tab { align-items: center; border-bottom: .05rem solid #dadee4; display: -ms-flexbox; @@ -2893,115 +1967,75 @@ summary.accordion-header::-webkit-details-marker { flex-wrap: wrap; list-style: none; margin: .2rem 0 .15rem 0; -} - -.tab .tab-item { +}.tab .tab-item { margin-top: 0; -} - -.tab .tab-item a { +}.tab .tab-item a { border-bottom: .1rem solid transparent; color: inherit; display: block; margin: 0 .4rem 0 0; padding: .4rem .2rem .3rem .2rem; text-decoration: none; -} - -.tab .tab-item a:focus, +}.tab .tab-item a:focus, .tab .tab-item a:hover { color: #5755d9; -} - -.tab .tab-item.active a, +}.tab .tab-item.active a, .tab .tab-item a.active { border-bottom-color: #5755d9; color: #5755d9; -} - -.tab .tab-item.tab-action { +}.tab .tab-item.tab-action { -ms-flex: 1 0 auto; flex: 1 0 auto; text-align: right; -} - -.tab .tab-item .btn-clear { +}.tab .tab-item .btn-clear { margin-top: -.2rem; -} - -.tab.tab-block .tab-item { +}.tab.tab-block .tab-item { -ms-flex: 1 0 0; flex: 1 0 0; text-align: center; -} - -.tab.tab-block .tab-item a { +}.tab.tab-block .tab-item a { margin: 0; -} - -.tab.tab-block .tab-item .badge[data-badge]::after { +}.tab.tab-block .tab-item .badge[data-badge]::after { position: absolute; right: .1rem; top: .1rem; transform: translate(0, 0); -} - -.tab:not(.tab-block) .badge { +}.tab:not(.tab-block) .badge { padding-right: 0; -} - -.tile { +}.tile { align-content: space-between; align-items: flex-start; display: -ms-flexbox; - display: flex; + display: flex; -ms-flex-align: start; -ms-flex-line-pack: justify; -} - -.tile .tile-icon, +}.tile .tile-icon, .tile .tile-action { -ms-flex: 0 0 auto; flex: 0 0 auto; -} - -.tile .tile-content { +}.tile .tile-content { -ms-flex: 1 1 auto; flex: 1 1 auto; -} - -.tile .tile-content:not(:first-child) { +}.tile .tile-content:not(:first-child) { padding-left: .4rem; -} - -.tile .tile-content:not(:last-child) { +}.tile .tile-content:not(:last-child) { padding-right: .4rem; -} - -.tile .tile-title, +}.tile .tile-title, .tile .tile-subtitle { line-height: 1.2rem; -} - -.tile.tile-centered { - align-items: center; +}.tile.tile-centered { + align-items: center; -ms-flex-align: center; -} - -.tile.tile-centered .tile-content { +}.tile.tile-centered .tile-content { overflow: hidden; -} - -.tile.tile-centered .tile-title, +}.tile.tile-centered .tile-title, .tile.tile-centered .tile-subtitle { - margin-bottom: 0; + margin-bottom: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -} - -.toast { - background: rgba(48, 55, 66, .95); +}.toast { + background: rgba(48,55,66,.95); border: .05rem solid #303742; border-color: #303742; border-radius: .1rem; @@ -3009,54 +2043,34 @@ summary.accordion-header::-webkit-details-marker { display: block; padding: .4rem; width: 100%; -} - -.toast.toast-primary { - background: rgba(87, 85, 217, .95); +}.toast.toast-primary { + background: rgba(87,85,217,.95); border-color: #5755d9; -} - -.toast.toast-success { - background: rgba(50, 182, 67, .95); +}.toast.toast-success { + background: rgba(50,182,67,.95); border-color: #32b643; -} - -.toast.toast-warning { - background: rgba(255, 183, 0, .95); +}.toast.toast-warning { + background: rgba(255,183,0,.95); border-color: #ffb700; -} - -.toast.toast-error { - background: rgba(232, 86, 0, .95); +}.toast.toast-error { + background: rgba(232,86,0,.95); border-color: #e85600; -} - -.toast a { +}.toast a { color: #fff; text-decoration: underline; -} - -.toast a:focus, +}.toast a:focus, .toast a:hover, .toast a:active, .toast a.active { opacity: .75; -} - -.toast .btn-clear { +}.toast .btn-clear { margin: .1rem; -} - -.toast p:last-child { +}.toast p:last-child { margin-bottom: 0; -} - -.tooltip { +}.tooltip { position: relative; -} - -.tooltip::after { - background: rgba(48, 55, 66, .95); +}.tooltip::after { + background: rgba(48,55,66,.95); border-radius: .1rem; bottom: 100%; color: #fff; @@ -3072,282 +2086,166 @@ summary.accordion-header::-webkit-details-marker { position: absolute; text-overflow: ellipsis; transform: translate(-50%, .4rem); - transition: opacity .2s, transform .2s; + transition: opacity .2s,transform .2s; white-space: pre; z-index: 300; -} - -.tooltip:focus::after, +}.tooltip:focus::after, .tooltip:hover::after { opacity: 1; transform: translate(-50%, -.2rem); -} - -.tooltip[disabled], +}.tooltip[disabled], .tooltip.disabled { pointer-events: auto; -} - -.tooltip.tooltip-right::after { +}.tooltip.tooltip-right::after { bottom: 50%; left: 100%; transform: translate(-.2rem, 50%); -} - -.tooltip.tooltip-right:focus::after, +}.tooltip.tooltip-right:focus::after, .tooltip.tooltip-right:hover::after { transform: translate(.2rem, 50%); -} - -.tooltip.tooltip-bottom::after { +}.tooltip.tooltip-bottom::after { bottom: auto; top: 100%; transform: translate(-50%, -.4rem); -} - -.tooltip.tooltip-bottom:focus::after, +}.tooltip.tooltip-bottom:focus::after, .tooltip.tooltip-bottom:hover::after { transform: translate(-50%, .2rem); -} - -.tooltip.tooltip-left::after { +}.tooltip.tooltip-left::after { bottom: 50%; left: auto; right: 100%; transform: translate(.4rem, 50%); -} - -.tooltip.tooltip-left:focus::after, +}.tooltip.tooltip-left:focus::after, .tooltip.tooltip-left:hover::after { transform: translate(-.2rem, 50%); -} - -@keyframes loading { +}@keyframes loading { 0% { transform: rotate(0deg); - } - 100% { + }100% { transform: rotate(360deg); } -} - -@keyframes slide-down { +}@keyframes slide-down { 0% { opacity: 0; transform: translateY(-1.6rem); - } - 100% { + }100% { opacity: 1; transform: translateY(0); } -} - -.text-primary { +}.text-primary { color: #5755d9 !important; -} - -a.text-primary:focus, +}a.text-primary:focus, a.text-primary:hover { color: #4240d4; -} - -a.text-primary:visited { +}a.text-primary:visited { color: #6c6ade; -} - -.text-secondary { +}.text-secondary { color: #e5e5f9 !important; -} - -a.text-secondary:focus, +}a.text-secondary:focus, a.text-secondary:hover { color: #d1d0f4; -} - -a.text-secondary:visited { +}a.text-secondary:visited { color: #fafafe; -} - -.text-gray { +}.text-gray { color: #bcc3ce !important; -} - -a.text-gray:focus, +}a.text-gray:focus, a.text-gray:hover { color: #adb6c4; -} - -a.text-gray:visited { +}a.text-gray:visited { color: #cbd0d9; -} - -.text-light { +}.text-light { color: #fff !important; -} - -a.text-light:focus, +}a.text-light:focus, a.text-light:hover { color: #f2f2f2; -} - -a.text-light:visited { - color: white; -} - -.text-dark { +}a.text-light:visited { + color: #fff; +}.text-dark { color: #3b4351 !important; -} - -a.text-dark:focus, +}a.text-dark:focus, a.text-dark:hover { color: #303742; -} - -a.text-dark:visited { +}a.text-dark:visited { color: #455060; -} - -.text-success { +}.text-success { color: #32b643 !important; -} - -a.text-success:focus, +}a.text-success:focus, a.text-success:hover { color: #2da23c; -} - -a.text-success:visited { +}a.text-success:visited { color: #39c94b; -} - -.text-warning { +}.text-warning { color: #ffb700 !important; -} - -a.text-warning:focus, +}a.text-warning:focus, a.text-warning:hover { color: #e6a500; -} - -a.text-warning:visited { +}a.text-warning:visited { color: #ffbe1a; -} - -.text-error { +}.text-error { color: #e85600 !important; -} - -a.text-error:focus, +}a.text-error:focus, a.text-error:hover { color: #cf4d00; -} - -a.text-error:visited { +}a.text-error:visited { color: #ff6003; -} - -.bg-primary { +}.bg-primary { background: #5755d9 !important; color: #fff; -} - -.bg-secondary { +}.bg-secondary { background: #f1f1fc !important; -} - -.bg-dark { +}.bg-dark { background: #303742 !important; color: #fff; -} - -.bg-gray { +}.bg-gray { background: #f7f8f9 !important; -} - -.bg-success { +}.bg-success { background: #32b643 !important; color: #fff; -} - -.bg-warning { +}.bg-warning { background: #ffb700 !important; color: #fff; -} - -.bg-error { +}.bg-error { background: #e85600 !important; color: #fff; -} - -.c-hand { +}.c-hand { cursor: pointer; -} - -.c-move { +}.c-move { cursor: move; -} - -.c-zoom-in { +}.c-zoom-in { cursor: zoom-in; -} - -.c-zoom-out { +}.c-zoom-out { cursor: zoom-out; -} - -.c-not-allowed { +}.c-not-allowed { cursor: not-allowed; -} - -.c-auto { +}.c-auto { cursor: auto; -} - -.d-block { +}.d-block { display: block; -} - -.d-inline { +}.d-inline { display: inline; -} - -.d-inline-block { +}.d-inline-block { display: inline-block; -} - -.d-flex { +}.d-flex { display: -ms-flexbox; display: flex; -} - -.d-inline-flex { +}.d-inline-flex { display: -ms-inline-flexbox; display: inline-flex; -} - -.d-none, +}.d-none, .d-hide { display: none !important; -} - -.d-visible { +}.d-visible { visibility: visible; -} - -.d-invisible { +}.d-invisible { visibility: hidden; -} - -.text-hide { +}.text-hide { background: transparent; border: 0; color: transparent; font-size: 0; line-height: 0; text-shadow: none; -} - -.text-assistive { +}.text-assistive { border: 0; clip: rect(0, 0, 0, 0); height: 1px; @@ -3356,15 +2254,11 @@ a.text-error:visited { padding: 0; position: absolute; width: 1px; -} - -.divider, +}.divider, .divider-vert { display: block; position: relative; -} - -.divider[data-content]::after, +}.divider[data-content]::after, .divider-vert[data-content]::after { background: #fff; color: #bcc3ce; @@ -3373,24 +2267,16 @@ a.text-error:visited { font-size: .7rem; padding: 0 .4rem; transform: translateY(-.65rem); -} - -.divider { +}.divider { border-top: .05rem solid #f1f3f5; height: .05rem; margin: .4rem 0; -} - -.divider[data-content] { +}.divider[data-content] { margin: .8rem 0; -} - -.divider-vert { +}.divider-vert { display: block; padding: .8rem; -} - -.divider-vert::before { +}.divider-vert::before { border-left: .05rem solid #dadee4; bottom: .4rem; content: ""; @@ -3399,24 +2285,18 @@ a.text-error:visited { position: absolute; top: .4rem; transform: translateX(-50%); -} - -.divider-vert[data-content]::after { +}.divider-vert[data-content]::after { left: 50%; padding: .2rem 0; position: absolute; top: 50%; transform: translate(-50%, -50%); -} - -.loading { +}.loading { color: transparent !important; min-height: .8rem; pointer-events: none; position: relative; -} - -.loading::after { +}.loading::after { animation: loading 500ms infinite linear; background: transparent; border: .1rem solid #5755d9; @@ -3435,326 +2315,182 @@ a.text-error:visited { top: 50%; width: .8rem; z-index: 1; -} - -.loading.loading-lg { +}.loading.loading-lg { min-height: 2rem; -} - -.loading.loading-lg::after { +}.loading.loading-lg::after { height: 1.6rem; margin-left: -.8rem; margin-top: -.8rem; width: 1.6rem; -} - -.clearfix::after { +}.clearfix::after { clear: both; content: ""; display: table; -} - -.float-left { +}.float-left { float: left !important; -} - -.float-right { +}.float-right { float: right !important; -} - -.p-relative { +}.p-relative { position: relative !important; -} - -.p-absolute { +}.p-absolute { position: absolute !important; -} - -.p-fixed { +}.p-fixed { position: fixed !important; -} - -.p-sticky { +}.p-sticky { position: -webkit-sticky !important; position: sticky !important; -} - -.p-centered { +}.p-centered { display: block; float: none; margin-left: auto; margin-right: auto; -} - -.flex-centered { +}.flex-centered { align-items: center; display: -ms-flexbox; display: flex; -ms-flex-align: center; -ms-flex-pack: center; justify-content: center; -} - -.m-0 { +}.m-0 { margin: 0 !important; -} - -.mb-0 { +}.mb-0 { margin-bottom: 0 !important; -} - -.ml-0 { +}.ml-0 { margin-left: 0 !important; -} - -.mr-0 { +}.mr-0 { margin-right: 0 !important; -} - -.mt-0 { +}.mt-0 { margin-top: 0 !important; -} - -.mx-0 { +}.mx-0 { margin-left: 0 !important; margin-right: 0 !important; -} - -.my-0 { +}.my-0 { margin-bottom: 0 !important; margin-top: 0 !important; -} - -.m-1 { +}.m-1 { margin: .2rem !important; -} - -.mb-1 { +}.mb-1 { margin-bottom: .2rem !important; -} - -.ml-1 { +}.ml-1 { margin-left: .2rem !important; -} - -.mr-1 { +}.mr-1 { margin-right: .2rem !important; -} - -.mt-1 { +}.mt-1 { margin-top: .2rem !important; -} - -.mx-1 { +}.mx-1 { margin-left: .2rem !important; margin-right: .2rem !important; -} - -.my-1 { +}.my-1 { margin-bottom: .2rem !important; margin-top: .2rem !important; -} - -.m-2 { +}.m-2 { margin: .4rem !important; -} - -.mb-2 { +}.mb-2 { margin-bottom: .4rem !important; -} - -.ml-2 { +}.ml-2 { margin-left: .4rem !important; -} - -.mr-2 { +}.mr-2 { margin-right: .4rem !important; -} - -.mt-2 { +}.mt-2 { margin-top: .4rem !important; -} - -.mx-2 { +}.mx-2 { margin-left: .4rem !important; margin-right: .4rem !important; -} - -.my-2 { +}.my-2 { margin-bottom: .4rem !important; margin-top: .4rem !important; -} - -.p-0 { +}.p-0 { padding: 0 !important; -} - -.pb-0 { +}.pb-0 { padding-bottom: 0 !important; -} - -.pl-0 { +}.pl-0 { padding-left: 0 !important; -} - -.pr-0 { +}.pr-0 { padding-right: 0 !important; -} - -.pt-0 { +}.pt-0 { padding-top: 0 !important; -} - -.px-0 { +}.px-0 { padding-left: 0 !important; padding-right: 0 !important; -} - -.py-0 { +}.py-0 { padding-bottom: 0 !important; padding-top: 0 !important; -} - -.p-1 { +}.p-1 { padding: .2rem !important; -} - -.pb-1 { +}.pb-1 { padding-bottom: .2rem !important; -} - -.pl-1 { +}.pl-1 { padding-left: .2rem !important; -} - -.pr-1 { +}.pr-1 { padding-right: .2rem !important; -} - -.pt-1 { +}.pt-1 { padding-top: .2rem !important; -} - -.px-1 { +}.px-1 { padding-left: .2rem !important; padding-right: .2rem !important; -} - -.py-1 { +}.py-1 { padding-bottom: .2rem !important; padding-top: .2rem !important; -} - -.p-2 { +}.p-2 { padding: .4rem !important; -} - -.pb-2 { +}.pb-2 { padding-bottom: .4rem !important; -} - -.pl-2 { +}.pl-2 { padding-left: .4rem !important; -} - -.pr-2 { +}.pr-2 { padding-right: .4rem !important; -} - -.pt-2 { +}.pt-2 { padding-top: .4rem !important; -} - -.px-2 { +}.px-2 { padding-left: .4rem !important; padding-right: .4rem !important; -} - -.py-2 { +}.py-2 { padding-bottom: .4rem !important; padding-top: .4rem !important; -} - -.s-rounded { +}.s-rounded { border-radius: .1rem; -} - -.s-circle { +}.s-circle { border-radius: 50%; -} - -.text-left { +}.text-left { text-align: left; -} - -.text-right { +}.text-right { text-align: right; -} - -.text-center { +}.text-center { text-align: center; -} - -.text-justify { +}.text-justify { text-align: justify; -} - -.text-lowercase { +}.text-lowercase { text-transform: lowercase; -} - -.text-uppercase { +}.text-uppercase { text-transform: uppercase; -} - -.text-capitalize { +}.text-capitalize { text-transform: capitalize; -} - -.text-normal { +}.text-normal { font-weight: normal; -} - -.text-bold { +}.text-bold { font-weight: bold; -} - -.text-italic { +}.text-italic { font-style: italic; -} - -.text-large { +}.text-large { font-size: 1.2em; -} - -.text-small { +}.text-small { font-size: .9em; -} - -.text-tiny { +}.text-tiny { font-size: .8em; -} - -.text-muted { +}.text-muted { opacity: .8; -} - -.text-ellipsis { +}.text-ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -} - -.text-clip { +}.text-clip { overflow: hidden; text-overflow: clip; white-space: nowrap; -} - -.text-break { +}.text-break { -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; word-break: break-word; word-wrap: break-word; -} \ No newline at end of file +}/*! Spectre.css v0.5.9 | MIT License | github.com/picturepan2/spectre */ \ No newline at end of file diff --git a/docs/dist/spectre.min.css b/docs/dist/spectre.min.css index 0fe23d9c0..8777fede2 100644 --- a/docs/dist/spectre.min.css +++ b/docs/dist/spectre.min.css @@ -1 +1 @@ -/*! Spectre.css v0.5.9 | MIT License | github.com/picturepan2/spectre */html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}address{font-style:normal}b,strong{font-weight:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:"SF Mono","Segoe UI Mono","Roboto Mono",Menlo,Courier,monospace;font-size:1em}dfn{font-style:italic}small{font-size:80%;font-weight:400}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}fieldset{border:0;margin:0;padding:0}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item;outline:0}canvas{display:inline-block}template{display:none}[hidden]{display:none}*,::after,::before{box-sizing:inherit}html{box-sizing:border-box;font-size:20px;line-height:1.5;-webkit-tap-highlight-color:transparent}body{background:#fff;color:#3b4351;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;font-size:.8rem;overflow-x:hidden;text-rendering:optimizeLegibility}a{color:#5755d9;outline:0;text-decoration:none}a:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}a.active,a:active,a:focus,a:hover{color:#302ecd;text-decoration:underline}a:visited{color:#807fe2}h1,h2,h3,h4,h5,h6{color:inherit;font-weight:500;line-height:1.2;margin-bottom:.5em;margin-top:0}.h1,.h2,.h3,.h4,.h5,.h6{font-weight:500}.h1,h1{font-size:2rem}.h2,h2{font-size:1.6rem}.h3,h3{font-size:1.4rem}.h4,h4{font-size:1.2rem}.h5,h5{font-size:1rem}.h6,h6{font-size:.8rem}p{margin:0 0 1.2rem}a,ins,u{-webkit-text-decoration-skip:ink edges;text-decoration-skip:ink edges}abbr[title]{border-bottom:.05rem dotted;cursor:help;text-decoration:none}kbd{background:#303742;border-radius:.1rem;color:#fff;font-size:.7rem;line-height:1.25;padding:.1rem .2rem}mark{background:#ffe9b3;border-bottom:.05rem solid #ffd367;border-radius:.1rem;color:#3b4351;padding:.05rem .1rem 0}blockquote{border-left:.1rem solid #dadee4;margin-left:0;padding:.4rem .8rem}blockquote p:last-child{margin-bottom:0}ol,ul{margin:.8rem 0 .8rem .8rem;padding:0}ol ol,ol ul,ul ol,ul ul{margin:.8rem 0 .8rem .8rem}ol li,ul li{margin-top:.4rem}ul{list-style:disc inside}ul ul{list-style-type:circle}ol{list-style:decimal inside}ol ol{list-style-type:lower-alpha}dl dt{font-weight:700}dl dd{margin:.4rem 0 .8rem 0}.lang-zh,.lang-zh-hans,html:lang(zh),html:lang(zh-Hans){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",sans-serif}.lang-zh-hant,html:lang(zh-Hant){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang TC","Hiragino Sans CNS","Microsoft JhengHei","Helvetica Neue",sans-serif}.lang-ja,html:lang(ja){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Hiragino Sans","Hiragino Kaku Gothic Pro","Yu Gothic",YuGothic,Meiryo,"Helvetica Neue",sans-serif}.lang-ko,html:lang(ko){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Malgun Gothic","Helvetica Neue",sans-serif}.lang-cjk ins,.lang-cjk u,:lang(ja) ins,:lang(ja) u,:lang(zh) ins,:lang(zh) u{border-bottom:.05rem solid;text-decoration:none}.lang-cjk del+del,.lang-cjk del+s,.lang-cjk ins+ins,.lang-cjk ins+u,.lang-cjk s+del,.lang-cjk s+s,.lang-cjk u+ins,.lang-cjk u+u,:lang(ja) del+del,:lang(ja) del+s,:lang(ja) ins+ins,:lang(ja) ins+u,:lang(ja) s+del,:lang(ja) s+s,:lang(ja) u+ins,:lang(ja) u+u,:lang(zh) del+del,:lang(zh) del+s,:lang(zh) ins+ins,:lang(zh) ins+u,:lang(zh) s+del,:lang(zh) s+s,:lang(zh) u+ins,:lang(zh) u+u{margin-left:.125em}.table{border-collapse:collapse;border-spacing:0;text-align:left;width:100%}.table.table-striped tbody tr:nth-of-type(odd){background:#f7f8f9}.table tbody tr.active,.table.table-striped tbody tr.active{background:#eef0f3}.table.table-hover tbody tr:hover{background:#eef0f3}.table.table-scroll{display:block;overflow-x:auto;padding-bottom:.75rem;white-space:nowrap}.table td,.table th{border-bottom:.05rem solid #dadee4;padding:.6rem .4rem}.table th{border-bottom-width:.1rem}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:.05rem solid #5755d9;border-radius:.1rem;color:#5755d9;cursor:pointer;display:inline-block;font-size:.8rem;height:1.8rem;line-height:1.2rem;outline:0;padding:.25rem .4rem;text-align:center;text-decoration:none;transition:background .2s,border .2s,box-shadow .2s,color .2s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap}.btn:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.btn:focus,.btn:hover{background:#f1f1fc;border-color:#4b48d6;text-decoration:none}.btn.active,.btn:active{background:#4b48d6;border-color:#3634d2;color:#fff;text-decoration:none}.btn.active.loading::after,.btn:active.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.disabled,.btn:disabled,.btn[disabled]{cursor:default;opacity:.5;pointer-events:none}.btn.btn-primary{background:#5755d9;border-color:#4b48d6;color:#fff}.btn.btn-primary:focus,.btn.btn-primary:hover{background:#4240d4;border-color:#3634d2;color:#fff}.btn.btn-primary.active,.btn.btn-primary:active{background:#3a38d2;border-color:#302ecd;color:#fff}.btn.btn-primary.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-success{background:#32b643;border-color:#2faa3f;color:#fff}.btn.btn-success:focus{box-shadow:0 0 0 .1rem rgba(50,182,67,.2)}.btn.btn-success:focus,.btn.btn-success:hover{background:#30ae40;border-color:#2da23c;color:#fff}.btn.btn-success.active,.btn.btn-success:active{background:#2a9a39;border-color:#278e34;color:#fff}.btn.btn-success.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-error{background:#e85600;border-color:#d95000;color:#fff}.btn.btn-error:focus{box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.btn.btn-error:focus,.btn.btn-error:hover{background:#de5200;border-color:#cf4d00;color:#fff}.btn.btn-error.active,.btn.btn-error:active{background:#c44900;border-color:#b54300;color:#fff}.btn.btn-error.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-link{background:0 0;border-color:transparent;color:#5755d9}.btn.btn-link.active,.btn.btn-link:active,.btn.btn-link:focus,.btn.btn-link:hover{color:#302ecd}.btn.btn-sm{font-size:.7rem;height:1.4rem;padding:.05rem .3rem}.btn.btn-lg{font-size:.9rem;height:2rem;padding:.35rem .6rem}.btn.btn-block{display:block;width:100%}.btn.btn-action{padding-left:0;padding-right:0;width:1.8rem}.btn.btn-action.btn-sm{width:1.4rem}.btn.btn-action.btn-lg{width:2rem}.btn.btn-clear{background:0 0;border:0;color:currentColor;height:1rem;line-height:.8rem;margin-left:.2rem;margin-right:-2px;opacity:1;padding:.1rem;text-decoration:none;width:1rem}.btn.btn-clear:focus,.btn.btn-clear:hover{background:rgba(247,248,249,.5);opacity:.95}.btn.btn-clear::before{content:"\2715"}.btn-group{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.btn-group .btn{-ms-flex:1 0 auto;flex:1 0 auto}.btn-group .btn:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.btn-group .btn:not(:first-child):not(:last-child){border-radius:0;margin-left:-.05rem}.btn-group .btn:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-.05rem}.btn-group .btn.active,.btn-group .btn:active,.btn-group .btn:focus,.btn-group .btn:hover{z-index:1}.btn-group.btn-group-block{display:-ms-flexbox;display:flex}.btn-group.btn-group-block .btn{-ms-flex:1 0 0;flex:1 0 0}.form-group:not(:last-child){margin-bottom:.4rem}fieldset{margin-bottom:.8rem}legend{font-size:.9rem;font-weight:500;margin-bottom:.8rem}.form-label{display:block;line-height:1.2rem;padding:.3rem 0}.form-label.label-sm{font-size:.7rem;padding:.1rem 0}.form-label.label-lg{font-size:.9rem;padding:.4rem 0}.form-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;background-image:none;border:.05rem solid #bcc3ce;border-radius:.1rem;color:#3b4351;display:block;font-size:.8rem;height:1.8rem;line-height:1.2rem;max-width:100%;outline:0;padding:.25rem .4rem;position:relative;transition:background .2s,border .2s,box-shadow .2s,color .2s;width:100%}.form-input:focus{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-input:-ms-input-placeholder{color:#bcc3ce}.form-input::-ms-input-placeholder{color:#bcc3ce}.form-input::placeholder{color:#bcc3ce}.form-input.input-sm{font-size:.7rem;height:1.4rem;padding:.05rem .3rem}.form-input.input-lg{font-size:.9rem;height:2rem;padding:.35rem .6rem}.form-input.input-inline{display:inline-block;vertical-align:middle;width:auto}.form-input[type=file]{height:auto}textarea.form-input,textarea.form-input.input-lg,textarea.form-input.input-sm{height:auto}.form-input-hint{color:#bcc3ce;font-size:.7rem;margin-top:.2rem}.has-success .form-input-hint,.is-success+.form-input-hint{color:#32b643}.has-error .form-input-hint,.is-error+.form-input-hint{color:#e85600}.form-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:.05rem solid #bcc3ce;border-radius:.1rem;color:inherit;font-size:.8rem;height:1.8rem;line-height:1.2rem;outline:0;padding:.25rem .4rem;vertical-align:middle;width:100%}.form-select:focus{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-select::-ms-expand{display:none}.form-select.select-sm{font-size:.7rem;height:1.4rem;padding:.05rem 1.1rem .05rem .3rem}.form-select.select-lg{font-size:.9rem;height:2rem;padding:.35rem 1.4rem .35rem .6rem}.form-select[multiple],.form-select[size]{height:auto;padding:.25rem .4rem}.form-select[multiple] option,.form-select[size] option{padding:.1rem .2rem}.form-select:not([multiple]):not([size]){background:#fff url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center/.4rem .5rem;padding-right:1.2rem}.has-icon-left,.has-icon-right{position:relative}.has-icon-left .form-icon,.has-icon-right .form-icon{height:.8rem;margin:0 .25rem;position:absolute;top:50%;transform:translateY(-50%);width:.8rem;z-index:2}.has-icon-left .form-icon{left:.05rem}.has-icon-left .form-input{padding-left:1.3rem}.has-icon-right .form-icon{right:.05rem}.has-icon-right .form-input{padding-right:1.3rem}.form-checkbox,.form-radio,.form-switch{display:block;line-height:1.2rem;margin:.2rem 0;min-height:1.4rem;padding:.1rem .4rem .1rem 1.2rem;position:relative}.form-checkbox input,.form-radio input,.form-switch input{clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;position:absolute;width:1px}.form-checkbox input:focus+.form-icon,.form-radio input:focus+.form-icon,.form-switch input:focus+.form-icon{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-checkbox input:checked+.form-icon,.form-radio input:checked+.form-icon,.form-switch input:checked+.form-icon{background:#5755d9;border-color:#5755d9}.form-checkbox .form-icon,.form-radio .form-icon,.form-switch .form-icon{border:.05rem solid #bcc3ce;cursor:pointer;display:inline-block;position:absolute;transition:background .2s,border .2s,box-shadow .2s,color .2s}.form-checkbox.input-sm,.form-radio.input-sm,.form-switch.input-sm{font-size:.7rem;margin:0}.form-checkbox.input-lg,.form-radio.input-lg,.form-switch.input-lg{font-size:.9rem;margin:.3rem 0}.form-checkbox .form-icon,.form-radio .form-icon{background:#fff;height:.8rem;left:0;top:.3rem;width:.8rem}.form-checkbox input:active+.form-icon,.form-radio input:active+.form-icon{background:#eef0f3}.form-checkbox .form-icon{border-radius:.1rem}.form-checkbox input:checked+.form-icon::before{background-clip:padding-box;border:.1rem solid #fff;border-left-width:0;border-top-width:0;content:"";height:9px;left:50%;margin-left:-3px;margin-top:-6px;position:absolute;top:50%;transform:rotate(45deg);width:6px}.form-checkbox input:indeterminate+.form-icon{background:#5755d9;border-color:#5755d9}.form-checkbox input:indeterminate+.form-icon::before{background:#fff;content:"";height:2px;left:50%;margin-left:-5px;margin-top:-1px;position:absolute;top:50%;width:10px}.form-radio .form-icon{border-radius:50%}.form-radio input:checked+.form-icon::before{background:#fff;border-radius:50%;content:"";height:6px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:6px}.form-switch{padding-left:2rem}.form-switch .form-icon{background:#bcc3ce;background-clip:padding-box;border-radius:.45rem;height:.9rem;left:0;top:.25rem;width:1.6rem}.form-switch .form-icon::before{background:#fff;border-radius:50%;content:"";display:block;height:.8rem;left:0;position:absolute;top:0;transition:background .2s,border .2s,box-shadow .2s,color .2s,left .2s;width:.8rem}.form-switch input:checked+.form-icon::before{left:14px}.form-switch input:active+.form-icon::before{background:#f7f8f9}.input-group{display:-ms-flexbox;display:flex}.input-group .input-group-addon{background:#f7f8f9;border:.05rem solid #bcc3ce;border-radius:.1rem;line-height:1.2rem;padding:.25rem .4rem;white-space:nowrap}.input-group .input-group-addon.addon-sm{font-size:.7rem;padding:.05rem .3rem}.input-group .input-group-addon.addon-lg{font-size:.9rem;padding:.35rem .6rem}.input-group .form-input,.input-group .form-select{-ms-flex:1 1 auto;flex:1 1 auto;width:1%}.input-group .input-group-btn{z-index:1}.input-group .form-input:first-child:not(:last-child),.input-group .form-select:first-child:not(:last-child),.input-group .input-group-addon:first-child:not(:last-child),.input-group .input-group-btn:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.input-group .form-input:not(:first-child):not(:last-child),.input-group .form-select:not(:first-child):not(:last-child),.input-group .input-group-addon:not(:first-child):not(:last-child),.input-group .input-group-btn:not(:first-child):not(:last-child){border-radius:0;margin-left:-.05rem}.input-group .form-input:last-child:not(:first-child),.input-group .form-select:last-child:not(:first-child),.input-group .input-group-addon:last-child:not(:first-child),.input-group .input-group-btn:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-.05rem}.input-group .form-input:focus,.input-group .form-select:focus,.input-group .input-group-addon:focus,.input-group .input-group-btn:focus{z-index:2}.input-group .form-select{width:auto}.input-group.input-inline{display:-ms-inline-flexbox;display:inline-flex}.form-input.is-success,.form-select.is-success,.has-success .form-input,.has-success .form-select{background:#f9fdfa;border-color:#32b643}.form-input.is-success:focus,.form-select.is-success:focus,.has-success .form-input:focus,.has-success .form-select:focus{box-shadow:0 0 0 .1rem rgba(50,182,67,.2)}.form-input.is-error,.form-select.is-error,.has-error .form-input,.has-error .form-select{background:#fffaf7;border-color:#e85600}.form-input.is-error:focus,.form-select.is-error:focus,.has-error .form-input:focus,.has-error .form-select:focus{box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-checkbox.is-error .form-icon,.form-radio.is-error .form-icon,.form-switch.is-error .form-icon,.has-error .form-checkbox .form-icon,.has-error .form-radio .form-icon,.has-error .form-switch .form-icon{border-color:#e85600}.form-checkbox.is-error input:checked+.form-icon,.form-radio.is-error input:checked+.form-icon,.form-switch.is-error input:checked+.form-icon,.has-error .form-checkbox input:checked+.form-icon,.has-error .form-radio input:checked+.form-icon,.has-error .form-switch input:checked+.form-icon{background:#e85600;border-color:#e85600}.form-checkbox.is-error input:focus+.form-icon,.form-radio.is-error input:focus+.form-icon,.form-switch.is-error input:focus+.form-icon,.has-error .form-checkbox input:focus+.form-icon,.has-error .form-radio input:focus+.form-icon,.has-error .form-switch input:focus+.form-icon{border-color:#e85600;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-checkbox.is-error input:indeterminate+.form-icon,.has-error .form-checkbox input:indeterminate+.form-icon{background:#e85600;border-color:#e85600}.form-input:not(:-ms-input-placeholder):invalid{border-color:#e85600}.form-input:not(:placeholder-shown):invalid{border-color:#e85600}.form-input:not(:-ms-input-placeholder):invalid:focus{background:#fffaf7;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-input:not(:placeholder-shown):invalid:focus{background:#fffaf7;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-input:not(:-ms-input-placeholder):invalid+.form-input-hint{color:#e85600}.form-input:not(:placeholder-shown):invalid+.form-input-hint{color:#e85600}.form-input.disabled,.form-input:disabled,.form-select.disabled,.form-select:disabled{background-color:#eef0f3;cursor:not-allowed;opacity:.5}.form-input[readonly]{background-color:#f7f8f9}input.disabled+.form-icon,input:disabled+.form-icon{background:#eef0f3;cursor:not-allowed;opacity:.5}.form-switch input.disabled+.form-icon::before,.form-switch input:disabled+.form-icon::before{background:#fff}.form-horizontal{padding:.4rem 0}.form-horizontal .form-group{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.form-inline{display:inline-block}.label{background:#eef0f3;border-radius:.1rem;color:#455060;display:inline-block;line-height:1.25;padding:.1rem .2rem}.label.label-rounded{border-radius:5rem;padding-left:.4rem;padding-right:.4rem}.label.label-primary{background:#5755d9;color:#fff}.label.label-secondary{background:#f1f1fc;color:#5755d9}.label.label-success{background:#32b643;color:#fff}.label.label-warning{background:#ffb700;color:#fff}.label.label-error{background:#e85600;color:#fff}code{background:#fcf2f2;border-radius:.1rem;color:#d73e48;font-size:85%;line-height:1.25;padding:.1rem .2rem}.code{border-radius:.1rem;color:#3b4351;position:relative}.code::before{color:#bcc3ce;content:attr(data-lang);font-size:.7rem;position:absolute;right:.4rem;top:.1rem}.code code{background:#f7f8f9;color:inherit;display:block;line-height:1.5;overflow-x:auto;padding:1rem;width:100%}.img-responsive{display:block;height:auto;max-width:100%}.img-fit-cover{object-fit:cover}.img-fit-contain{object-fit:contain}.video-responsive{display:block;overflow:hidden;padding:0;position:relative;width:100%}.video-responsive::before{content:"";display:block;padding-bottom:56.25%}.video-responsive embed,.video-responsive iframe,.video-responsive object{border:0;bottom:0;height:100%;left:0;position:absolute;right:0;top:0;width:100%}video.video-responsive{height:auto;max-width:100%}video.video-responsive::before{content:none}.video-responsive-4-3::before{padding-bottom:75%}.video-responsive-1-1::before{padding-bottom:100%}.figure{margin:0 0 .4rem 0}.figure .figure-caption{color:#66758c;margin-top:.4rem}.container{margin-left:auto;margin-right:auto;padding-left:.4rem;padding-right:.4rem;width:100%}.container.grid-xl{max-width:1296px}.container.grid-lg{max-width:976px}.container.grid-md{max-width:856px}.container.grid-sm{max-width:616px}.container.grid-xs{max-width:496px}.show-lg,.show-md,.show-sm,.show-xl,.show-xs{display:none!important}.cols,.columns{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-left:-.4rem;margin-right:-.4rem}.cols.col-gapless,.columns.col-gapless{margin-left:0;margin-right:0}.cols.col-gapless>.column,.columns.col-gapless>.column{padding-left:0;padding-right:0}.cols.col-oneline,.columns.col-oneline{-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto}.column,[class~=col-]{-ms-flex:1;flex:1;max-width:100%;padding-left:.4rem;padding-right:.4rem}.column.col-1,.column.col-10,.column.col-11,.column.col-12,.column.col-2,.column.col-3,.column.col-4,.column.col-5,.column.col-6,.column.col-7,.column.col-8,.column.col-9,.column.col-auto,[class~=col-].col-1,[class~=col-].col-10,[class~=col-].col-11,[class~=col-].col-12,[class~=col-].col-2,[class~=col-].col-3,[class~=col-].col-4,[class~=col-].col-5,[class~=col-].col-6,[class~=col-].col-7,[class~=col-].col-8,[class~=col-].col-9,[class~=col-].col-auto{-ms-flex:none;flex:none}.col-12{width:100%}.col-11{width:91.66666667%}.col-10{width:83.33333333%}.col-9{width:75%}.col-8{width:66.66666667%}.col-7{width:58.33333333%}.col-6{width:50%}.col-5{width:41.66666667%}.col-4{width:33.33333333%}.col-3{width:25%}.col-2{width:16.66666667%}.col-1{width:8.33333333%}.col-auto{-ms-flex:0 0 auto;flex:0 0 auto;max-width:none;width:auto}.col-mx-auto{margin-left:auto;margin-right:auto}.col-ml-auto{margin-left:auto}.col-mr-auto{margin-right:auto}@media (max-width:1280px){.col-xl-1,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-auto{-ms-flex:none;flex:none}.col-xl-12{width:100%}.col-xl-11{width:91.66666667%}.col-xl-10{width:83.33333333%}.col-xl-9{width:75%}.col-xl-8{width:66.66666667%}.col-xl-7{width:58.33333333%}.col-xl-6{width:50%}.col-xl-5{width:41.66666667%}.col-xl-4{width:33.33333333%}.col-xl-3{width:25%}.col-xl-2{width:16.66666667%}.col-xl-1{width:8.33333333%}.col-xl-auto{width:auto}.hide-xl{display:none!important}.show-xl{display:block!important}}@media (max-width:960px){.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-auto{-ms-flex:none;flex:none}.col-lg-12{width:100%}.col-lg-11{width:91.66666667%}.col-lg-10{width:83.33333333%}.col-lg-9{width:75%}.col-lg-8{width:66.66666667%}.col-lg-7{width:58.33333333%}.col-lg-6{width:50%}.col-lg-5{width:41.66666667%}.col-lg-4{width:33.33333333%}.col-lg-3{width:25%}.col-lg-2{width:16.66666667%}.col-lg-1{width:8.33333333%}.col-lg-auto{width:auto}.hide-lg{display:none!important}.show-lg{display:block!important}}@media (max-width:840px){.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-auto{-ms-flex:none;flex:none}.col-md-12{width:100%}.col-md-11{width:91.66666667%}.col-md-10{width:83.33333333%}.col-md-9{width:75%}.col-md-8{width:66.66666667%}.col-md-7{width:58.33333333%}.col-md-6{width:50%}.col-md-5{width:41.66666667%}.col-md-4{width:33.33333333%}.col-md-3{width:25%}.col-md-2{width:16.66666667%}.col-md-1{width:8.33333333%}.col-md-auto{width:auto}.hide-md{display:none!important}.show-md{display:block!important}}@media (max-width:600px){.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-auto{-ms-flex:none;flex:none}.col-sm-12{width:100%}.col-sm-11{width:91.66666667%}.col-sm-10{width:83.33333333%}.col-sm-9{width:75%}.col-sm-8{width:66.66666667%}.col-sm-7{width:58.33333333%}.col-sm-6{width:50%}.col-sm-5{width:41.66666667%}.col-sm-4{width:33.33333333%}.col-sm-3{width:25%}.col-sm-2{width:16.66666667%}.col-sm-1{width:8.33333333%}.col-sm-auto{width:auto}.hide-sm{display:none!important}.show-sm{display:block!important}}@media (max-width:480px){.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-auto{-ms-flex:none;flex:none}.col-xs-12{width:100%}.col-xs-11{width:91.66666667%}.col-xs-10{width:83.33333333%}.col-xs-9{width:75%}.col-xs-8{width:66.66666667%}.col-xs-7{width:58.33333333%}.col-xs-6{width:50%}.col-xs-5{width:41.66666667%}.col-xs-4{width:33.33333333%}.col-xs-3{width:25%}.col-xs-2{width:16.66666667%}.col-xs-1{width:8.33333333%}.col-xs-auto{width:auto}.hide-xs{display:none!important}.show-xs{display:block!important}}.hero{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:4rem;padding-top:4rem}.hero.hero-sm{padding-bottom:2rem;padding-top:2rem}.hero.hero-lg{padding-bottom:8rem;padding-top:8rem}.hero .hero-body{padding:.4rem}.navbar{align-items:stretch;display:-ms-flexbox;display:flex;-ms-flex-align:stretch;-ms-flex-pack:justify;-ms-flex-wrap:wrap;flex-wrap:wrap;justify-content:space-between}.navbar .navbar-section{align-items:center;display:-ms-flexbox;display:flex;-ms-flex:1 0 0;flex:1 0 0;-ms-flex-align:center}.navbar .navbar-section:not(:first-child):last-child{-ms-flex-pack:end;justify-content:flex-end}.navbar .navbar-center{align-items:center;display:-ms-flexbox;display:flex;-ms-flex:0 0 auto;flex:0 0 auto;-ms-flex-align:center}.navbar .navbar-brand{font-size:.9rem;text-decoration:none}.accordion input:checked~.accordion-header>.icon:first-child,.accordion[open] .accordion-header>.icon:first-child{transform:rotate(90deg)}.accordion input:checked~.accordion-body,.accordion[open] .accordion-body{max-height:50rem}.accordion .accordion-header{display:block;padding:.2rem .4rem}.accordion .accordion-header .icon{transition:transform .25s}.accordion .accordion-body{margin-bottom:.4rem;max-height:0;overflow:hidden;transition:max-height .25s}summary.accordion-header::-webkit-details-marker{display:none}.avatar{background:#5755d9;border-radius:50%;color:rgba(255,255,255,.85);display:inline-block;font-size:.8rem;font-weight:300;height:1.6rem;line-height:1.25;margin:0;position:relative;vertical-align:middle;width:1.6rem}.avatar.avatar-xs{font-size:.4rem;height:.8rem;width:.8rem}.avatar.avatar-sm{font-size:.6rem;height:1.2rem;width:1.2rem}.avatar.avatar-lg{font-size:1.2rem;height:2.4rem;width:2.4rem}.avatar.avatar-xl{font-size:1.6rem;height:3.2rem;width:3.2rem}.avatar img{border-radius:50%;height:100%;position:relative;width:100%;z-index:1}.avatar .avatar-icon,.avatar .avatar-presence{background:#fff;bottom:14.64%;height:50%;padding:.1rem;position:absolute;right:14.64%;transform:translate(50%,50%);width:50%;z-index:2}.avatar .avatar-presence{background:#bcc3ce;border-radius:50%;box-shadow:0 0 0 .1rem #fff;height:.5em;width:.5em}.avatar .avatar-presence.online{background:#32b643}.avatar .avatar-presence.busy{background:#e85600}.avatar .avatar-presence.away{background:#ffb700}.avatar[data-initial]::before{color:currentColor;content:attr(data-initial);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:1}.badge{position:relative;white-space:nowrap}.badge:not([data-badge])::after,.badge[data-badge]::after{background:#5755d9;background-clip:padding-box;border-radius:.5rem;box-shadow:0 0 0 .1rem #fff;color:#fff;content:attr(data-badge);display:inline-block;transform:translate(-.05rem,-.5rem)}.badge[data-badge]::after{font-size:.7rem;height:.9rem;line-height:1;min-width:.9rem;padding:.1rem .2rem;text-align:center;white-space:nowrap}.badge:not([data-badge])::after,.badge[data-badge=""]::after{height:6px;min-width:6px;padding:0;width:6px}.badge.btn::after{position:absolute;right:0;top:0;transform:translate(50%,-50%)}.badge.avatar::after{position:absolute;right:14.64%;top:14.64%;transform:translate(50%,-50%);z-index:100}.breadcrumb{list-style:none;margin:.2rem 0;padding:.2rem 0}.breadcrumb .breadcrumb-item{color:#66758c;display:inline-block;margin:0;padding:.2rem 0}.breadcrumb .breadcrumb-item:not(:last-child){margin-right:.2rem}.breadcrumb .breadcrumb-item:not(:last-child) a{color:#66758c}.breadcrumb .breadcrumb-item:not(:first-child)::before{color:#66758c;content:"/";padding-right:.4rem}.bar{background:#eef0f3;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;height:.8rem;width:100%}.bar.bar-sm{height:.2rem}.bar .bar-item{background:#5755d9;color:#fff;display:block;-ms-flex-negative:0;flex-shrink:0;font-size:.7rem;height:100%;line-height:.8rem;position:relative;text-align:center;width:0}.bar .bar-item:first-child{border-bottom-left-radius:.1rem;border-top-left-radius:.1rem}.bar .bar-item:last-child{border-bottom-right-radius:.1rem;border-top-right-radius:.1rem;-ms-flex-negative:1;flex-shrink:1}.bar-slider{height:.1rem;margin:.4rem 0;position:relative}.bar-slider .bar-item{left:0;padding:0;position:absolute}.bar-slider .bar-item:not(:last-child):first-child{background:#eef0f3;z-index:1}.bar-slider .bar-slider-btn{background:#5755d9;border:0;border-radius:50%;height:.6rem;padding:0;position:absolute;right:0;top:50%;transform:translate(50%,-50%);width:.6rem}.bar-slider .bar-slider-btn:active{box-shadow:0 0 0 .1rem #5755d9}.card{background:#fff;border:.05rem solid #dadee4;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.card .card-body,.card .card-footer,.card .card-header{padding:.8rem;padding-bottom:0}.card .card-body:last-child,.card .card-footer:last-child,.card .card-header:last-child{padding-bottom:.8rem}.card .card-body{-ms-flex:1 1 auto;flex:1 1 auto}.card .card-image{padding-top:.8rem}.card .card-image:first-child{padding-top:0}.card .card-image:first-child img{border-top-left-radius:.1rem;border-top-right-radius:.1rem}.card .card-image:last-child img{border-bottom-left-radius:.1rem;border-bottom-right-radius:.1rem}.chip{align-items:center;background:#eef0f3;border-radius:5rem;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;font-size:90%;height:1.2rem;line-height:.8rem;margin:.1rem;max-width:320px;overflow:hidden;padding:.2rem .4rem;text-decoration:none;text-overflow:ellipsis;vertical-align:middle;white-space:nowrap}.chip.active{background:#5755d9;color:#fff}.chip .avatar{margin-left:-.4rem;margin-right:.2rem}.chip .btn-clear{border-radius:50%;transform:scale(.75)}.dropdown{display:inline-block;position:relative}.dropdown .menu{animation:slide-down .15s ease 1;display:none;left:0;max-height:50vh;overflow-y:auto;position:absolute;top:100%}.dropdown.dropdown-right .menu{left:auto;right:0}.dropdown .dropdown-toggle:focus+.menu,.dropdown .menu:hover,.dropdown.active .menu{display:block}.dropdown .btn-group .dropdown-toggle:nth-last-child(2){border-bottom-right-radius:.1rem;border-top-right-radius:.1rem}.empty{background:#f7f8f9;border-radius:.1rem;color:#66758c;padding:3.2rem 1.6rem;text-align:center}.empty .empty-icon{margin-bottom:.8rem}.empty .empty-subtitle,.empty .empty-title{margin:.4rem auto}.empty .empty-action{margin-top:.8rem}.menu{background:#fff;border-radius:.1rem;box-shadow:0 .05rem .2rem rgba(48,55,66,.3);list-style:none;margin:0;min-width:180px;padding:.4rem;transform:translateY(.2rem);z-index:300}.menu.menu-nav{background:0 0;box-shadow:none}.menu .menu-item{margin-top:0;padding:0 .4rem;position:relative;text-decoration:none}.menu .menu-item>a{border-radius:.1rem;color:inherit;display:block;margin:0 -.4rem;padding:.2rem .4rem;text-decoration:none}.menu .menu-item>a:focus,.menu .menu-item>a:hover{background:#f1f1fc;color:#5755d9}.menu .menu-item>a.active,.menu .menu-item>a:active{background:#f1f1fc;color:#5755d9}.menu .menu-item .form-checkbox,.menu .menu-item .form-radio,.menu .menu-item .form-switch{margin:.1rem 0}.menu .menu-item+.menu-item{margin-top:.2rem}.menu .menu-badge{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;height:100%;position:absolute;right:0;top:0}.menu .menu-badge .label{margin-right:.4rem}.modal{align-items:center;bottom:0;display:none;-ms-flex-align:center;-ms-flex-pack:center;justify-content:center;left:0;opacity:0;overflow:hidden;padding:.4rem;position:fixed;right:0;top:0}.modal.active,.modal:target{display:-ms-flexbox;display:flex;opacity:1;z-index:400}.modal.active .modal-overlay,.modal:target .modal-overlay{background:rgba(247,248,249,.75);bottom:0;cursor:default;display:block;left:0;position:absolute;right:0;top:0}.modal.active .modal-container,.modal:target .modal-container{animation:slide-down .2s ease 1;z-index:1}.modal.modal-sm .modal-container{max-width:320px;padding:0 .4rem}.modal.modal-lg .modal-overlay{background:#fff}.modal.modal-lg .modal-container{box-shadow:none;max-width:960px}.modal-container{background:#fff;border-radius:.1rem;box-shadow:0 .2rem .5rem rgba(48,55,66,.3);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;max-height:75vh;max-width:640px;padding:0 .8rem;width:100%}.modal-container.modal-fullheight{max-height:100vh}.modal-container .modal-header{color:#303742;padding:.8rem}.modal-container .modal-body{overflow-y:auto;padding:.8rem;position:relative}.modal-container .modal-footer{padding:.8rem;text-align:right}.nav{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;list-style:none;margin:.2rem 0}.nav .nav-item a{color:#66758c;padding:.2rem .4rem;text-decoration:none}.nav .nav-item a:focus,.nav .nav-item a:hover{color:#5755d9}.nav .nav-item.active>a{color:#505c6e;font-weight:700}.nav .nav-item.active>a:focus,.nav .nav-item.active>a:hover{color:#5755d9}.nav .nav{margin-bottom:.4rem;margin-left:.8rem}.pagination{display:-ms-flexbox;display:flex;list-style:none;margin:.2rem 0;padding:.2rem 0}.pagination .page-item{margin:.2rem .05rem}.pagination .page-item span{display:inline-block;padding:.2rem .2rem}.pagination .page-item a{border-radius:.1rem;display:inline-block;padding:.2rem .4rem;text-decoration:none}.pagination .page-item a:focus,.pagination .page-item a:hover{color:#5755d9}.pagination .page-item.disabled a{cursor:default;opacity:.5;pointer-events:none}.pagination .page-item.active a{background:#5755d9;color:#fff}.pagination .page-item.page-next,.pagination .page-item.page-prev{-ms-flex:1 0 50%;flex:1 0 50%}.pagination .page-item.page-next{text-align:right}.pagination .page-item .page-item-title{margin:0}.pagination .page-item .page-item-subtitle{margin:0;opacity:.5}.panel{border:.05rem solid #dadee4;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.panel .panel-footer,.panel .panel-header{-ms-flex:0 0 auto;flex:0 0 auto;padding:.8rem}.panel .panel-nav{-ms-flex:0 0 auto;flex:0 0 auto}.panel .panel-body{-ms-flex:1 1 auto;flex:1 1 auto;overflow-y:auto;padding:0 .8rem}.popover{display:inline-block;position:relative}.popover .popover-container{left:50%;opacity:0;padding:.4rem;position:absolute;top:0;transform:translate(-50%,-50%) scale(0);transition:transform .2s;width:320px;z-index:300}.popover :focus+.popover-container,.popover:hover .popover-container{display:block;opacity:1;transform:translate(-50%,-100%) scale(1)}.popover.popover-right .popover-container{left:100%;top:50%}.popover.popover-right :focus+.popover-container,.popover.popover-right:hover .popover-container{transform:translate(0,-50%) scale(1)}.popover.popover-bottom .popover-container{left:50%;top:100%}.popover.popover-bottom :focus+.popover-container,.popover.popover-bottom:hover .popover-container{transform:translate(-50%,0) scale(1)}.popover.popover-left .popover-container{left:0;top:50%}.popover.popover-left :focus+.popover-container,.popover.popover-left:hover .popover-container{transform:translate(-100%,-50%) scale(1)}.popover .card{border:0;box-shadow:0 .2rem .5rem rgba(48,55,66,.3)}.step{display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;list-style:none;margin:.2rem 0;width:100%}.step .step-item{-ms-flex:1 1 0;flex:1 1 0;margin-top:0;min-height:1rem;position:relative;text-align:center}.step .step-item:not(:first-child)::before{background:#5755d9;content:"";height:2px;left:-50%;position:absolute;top:9px;width:100%}.step .step-item a{color:#5755d9;display:inline-block;padding:20px 10px 0;text-decoration:none}.step .step-item a::before{background:#5755d9;border:.1rem solid #fff;border-radius:50%;content:"";display:block;height:.6rem;left:50%;position:absolute;top:.2rem;transform:translateX(-50%);width:.6rem;z-index:1}.step .step-item.active a::before{background:#fff;border:.1rem solid #5755d9}.step .step-item.active~.step-item::before{background:#dadee4}.step .step-item.active~.step-item a{color:#bcc3ce}.step .step-item.active~.step-item a::before{background:#dadee4}.tab{align-items:center;border-bottom:.05rem solid #dadee4;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-wrap:wrap;flex-wrap:wrap;list-style:none;margin:.2rem 0 .15rem 0}.tab .tab-item{margin-top:0}.tab .tab-item a{border-bottom:.1rem solid transparent;color:inherit;display:block;margin:0 .4rem 0 0;padding:.4rem .2rem .3rem .2rem;text-decoration:none}.tab .tab-item a:focus,.tab .tab-item a:hover{color:#5755d9}.tab .tab-item a.active,.tab .tab-item.active a{border-bottom-color:#5755d9;color:#5755d9}.tab .tab-item.tab-action{-ms-flex:1 0 auto;flex:1 0 auto;text-align:right}.tab .tab-item .btn-clear{margin-top:-.2rem}.tab.tab-block .tab-item{-ms-flex:1 0 0;flex:1 0 0;text-align:center}.tab.tab-block .tab-item a{margin:0}.tab.tab-block .tab-item .badge[data-badge]::after{position:absolute;right:.1rem;top:.1rem;transform:translate(0,0)}.tab:not(.tab-block) .badge{padding-right:0}.tile{align-content:space-between;align-items:flex-start;display:-ms-flexbox;display:flex;-ms-flex-align:start;-ms-flex-line-pack:justify}.tile .tile-action,.tile .tile-icon{-ms-flex:0 0 auto;flex:0 0 auto}.tile .tile-content{-ms-flex:1 1 auto;flex:1 1 auto}.tile .tile-content:not(:first-child){padding-left:.4rem}.tile .tile-content:not(:last-child){padding-right:.4rem}.tile .tile-subtitle,.tile .tile-title{line-height:1.2rem}.tile.tile-centered{align-items:center;-ms-flex-align:center}.tile.tile-centered .tile-content{overflow:hidden}.tile.tile-centered .tile-subtitle,.tile.tile-centered .tile-title{margin-bottom:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.toast{background:rgba(48,55,66,.95);border:.05rem solid #303742;border-color:#303742;border-radius:.1rem;color:#fff;display:block;padding:.4rem;width:100%}.toast.toast-primary{background:rgba(87,85,217,.95);border-color:#5755d9}.toast.toast-success{background:rgba(50,182,67,.95);border-color:#32b643}.toast.toast-warning{background:rgba(255,183,0,.95);border-color:#ffb700}.toast.toast-error{background:rgba(232,86,0,.95);border-color:#e85600}.toast a{color:#fff;text-decoration:underline}.toast a.active,.toast a:active,.toast a:focus,.toast a:hover{opacity:.75}.toast .btn-clear{margin:.1rem}.toast p:last-child{margin-bottom:0}.tooltip{position:relative}.tooltip::after{background:rgba(48,55,66,.95);border-radius:.1rem;bottom:100%;color:#fff;content:attr(data-tooltip);display:block;font-size:.7rem;left:50%;max-width:320px;opacity:0;overflow:hidden;padding:.2rem .4rem;pointer-events:none;position:absolute;text-overflow:ellipsis;transform:translate(-50%,.4rem);transition:opacity .2s,transform .2s;white-space:pre;z-index:300}.tooltip:focus::after,.tooltip:hover::after{opacity:1;transform:translate(-50%,-.2rem)}.tooltip.disabled,.tooltip[disabled]{pointer-events:auto}.tooltip.tooltip-right::after{bottom:50%;left:100%;transform:translate(-.2rem,50%)}.tooltip.tooltip-right:focus::after,.tooltip.tooltip-right:hover::after{transform:translate(.2rem,50%)}.tooltip.tooltip-bottom::after{bottom:auto;top:100%;transform:translate(-50%,-.4rem)}.tooltip.tooltip-bottom:focus::after,.tooltip.tooltip-bottom:hover::after{transform:translate(-50%,.2rem)}.tooltip.tooltip-left::after{bottom:50%;left:auto;right:100%;transform:translate(.4rem,50%)}.tooltip.tooltip-left:focus::after,.tooltip.tooltip-left:hover::after{transform:translate(-.2rem,50%)}@keyframes loading{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes slide-down{0%{opacity:0;transform:translateY(-1.6rem)}100%{opacity:1;transform:translateY(0)}}.text-primary{color:#5755d9!important}a.text-primary:focus,a.text-primary:hover{color:#4240d4}a.text-primary:visited{color:#6c6ade}.text-secondary{color:#e5e5f9!important}a.text-secondary:focus,a.text-secondary:hover{color:#d1d0f4}a.text-secondary:visited{color:#fafafe}.text-gray{color:#bcc3ce!important}a.text-gray:focus,a.text-gray:hover{color:#adb6c4}a.text-gray:visited{color:#cbd0d9}.text-light{color:#fff!important}a.text-light:focus,a.text-light:hover{color:#f2f2f2}a.text-light:visited{color:#fff}.text-dark{color:#3b4351!important}a.text-dark:focus,a.text-dark:hover{color:#303742}a.text-dark:visited{color:#455060}.text-success{color:#32b643!important}a.text-success:focus,a.text-success:hover{color:#2da23c}a.text-success:visited{color:#39c94b}.text-warning{color:#ffb700!important}a.text-warning:focus,a.text-warning:hover{color:#e6a500}a.text-warning:visited{color:#ffbe1a}.text-error{color:#e85600!important}a.text-error:focus,a.text-error:hover{color:#cf4d00}a.text-error:visited{color:#ff6003}.bg-primary{background:#5755d9!important;color:#fff}.bg-secondary{background:#f1f1fc!important}.bg-dark{background:#303742!important;color:#fff}.bg-gray{background:#f7f8f9!important}.bg-success{background:#32b643!important;color:#fff}.bg-warning{background:#ffb700!important;color:#fff}.bg-error{background:#e85600!important;color:#fff}.c-hand{cursor:pointer}.c-move{cursor:move}.c-zoom-in{cursor:zoom-in}.c-zoom-out{cursor:zoom-out}.c-not-allowed{cursor:not-allowed}.c-auto{cursor:auto}.d-block{display:block}.d-inline{display:inline}.d-inline-block{display:inline-block}.d-flex{display:-ms-flexbox;display:flex}.d-inline-flex{display:-ms-inline-flexbox;display:inline-flex}.d-hide,.d-none{display:none!important}.d-visible{visibility:visible}.d-invisible{visibility:hidden}.text-hide{background:0 0;border:0;color:transparent;font-size:0;line-height:0;text-shadow:none}.text-assistive{border:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.divider,.divider-vert{display:block;position:relative}.divider-vert[data-content]::after,.divider[data-content]::after{background:#fff;color:#bcc3ce;content:attr(data-content);display:inline-block;font-size:.7rem;padding:0 .4rem;transform:translateY(-.65rem)}.divider{border-top:.05rem solid #f1f3f5;height:.05rem;margin:.4rem 0}.divider[data-content]{margin:.8rem 0}.divider-vert{display:block;padding:.8rem}.divider-vert::before{border-left:.05rem solid #dadee4;bottom:.4rem;content:"";display:block;left:50%;position:absolute;top:.4rem;transform:translateX(-50%)}.divider-vert[data-content]::after{left:50%;padding:.2rem 0;position:absolute;top:50%;transform:translate(-50%,-50%)}.loading{color:transparent!important;min-height:.8rem;pointer-events:none;position:relative}.loading::after{animation:loading .5s infinite linear;background:0 0;border:.1rem solid #5755d9;border-radius:50%;border-right-color:transparent;border-top-color:transparent;content:"";display:block;height:.8rem;left:50%;margin-left:-.4rem;margin-top:-.4rem;opacity:1;padding:0;position:absolute;top:50%;width:.8rem;z-index:1}.loading.loading-lg{min-height:2rem}.loading.loading-lg::after{height:1.6rem;margin-left:-.8rem;margin-top:-.8rem;width:1.6rem}.clearfix::after{clear:both;content:"";display:table}.float-left{float:left!important}.float-right{float:right!important}.p-relative{position:relative!important}.p-absolute{position:absolute!important}.p-fixed{position:fixed!important}.p-sticky{position:-webkit-sticky!important;position:sticky!important}.p-centered{display:block;float:none;margin-left:auto;margin-right:auto}.flex-centered{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;justify-content:center}.m-0{margin:0!important}.mb-0{margin-bottom:0!important}.ml-0{margin-left:0!important}.mr-0{margin-right:0!important}.mt-0{margin-top:0!important}.mx-0{margin-left:0!important;margin-right:0!important}.my-0{margin-bottom:0!important;margin-top:0!important}.m-1{margin:.2rem!important}.mb-1{margin-bottom:.2rem!important}.ml-1{margin-left:.2rem!important}.mr-1{margin-right:.2rem!important}.mt-1{margin-top:.2rem!important}.mx-1{margin-left:.2rem!important;margin-right:.2rem!important}.my-1{margin-bottom:.2rem!important;margin-top:.2rem!important}.m-2{margin:.4rem!important}.mb-2{margin-bottom:.4rem!important}.ml-2{margin-left:.4rem!important}.mr-2{margin-right:.4rem!important}.mt-2{margin-top:.4rem!important}.mx-2{margin-left:.4rem!important;margin-right:.4rem!important}.my-2{margin-bottom:.4rem!important;margin-top:.4rem!important}.p-0{padding:0!important}.pb-0{padding-bottom:0!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.pt-0{padding-top:0!important}.px-0{padding-left:0!important;padding-right:0!important}.py-0{padding-bottom:0!important;padding-top:0!important}.p-1{padding:.2rem!important}.pb-1{padding-bottom:.2rem!important}.pl-1{padding-left:.2rem!important}.pr-1{padding-right:.2rem!important}.pt-1{padding-top:.2rem!important}.px-1{padding-left:.2rem!important;padding-right:.2rem!important}.py-1{padding-bottom:.2rem!important;padding-top:.2rem!important}.p-2{padding:.4rem!important}.pb-2{padding-bottom:.4rem!important}.pl-2{padding-left:.4rem!important}.pr-2{padding-right:.4rem!important}.pt-2{padding-top:.4rem!important}.px-2{padding-left:.4rem!important;padding-right:.4rem!important}.py-2{padding-bottom:.4rem!important;padding-top:.4rem!important}.s-rounded{border-radius:.1rem}.s-circle{border-radius:50%}.text-left{text-align:left}.text-right{text-align:right}.text-center{text-align:center}.text-justify{text-align:justify}.text-lowercase{text-transform:lowercase}.text-uppercase{text-transform:uppercase}.text-capitalize{text-transform:capitalize}.text-normal{font-weight:400}.text-bold{font-weight:700}.text-italic{font-style:italic}.text-large{font-size:1.2em}.text-small{font-size:.9em}.text-tiny{font-size:.8em}.text-muted{opacity:.8}.text-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.text-clip{overflow:hidden;text-overflow:clip;white-space:nowrap}.text-break{-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;word-break:break-word;word-wrap:break-word} \ No newline at end of file +html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}address{font-style:normal}b,strong{font-weight:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:"SF Mono","Segoe UI Mono","Roboto Mono",Menlo,Courier,monospace;font-size:1em}dfn{font-style:italic}small{font-size:80%;font-weight:400}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}fieldset{border:0;margin:0;padding:0}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item;outline:0}canvas{display:inline-block}template{display:none}[hidden]{display:none}*,::after,::before{box-sizing:inherit}html{box-sizing:border-box;font-size:20px;line-height:1.5;-webkit-tap-highlight-color:transparent}body{background:#fff;color:#3b4351;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;font-size:.8rem;overflow-x:hidden;text-rendering:optimizeLegibility}a{color:#5755d9;outline:0;text-decoration:none}a:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}a.active,a:active,a:focus,a:hover{color:#302ecd;text-decoration:underline}a:visited{color:#807fe2}h1,h2,h3,h4,h5,h6{color:inherit;font-weight:500;line-height:1.2;margin-bottom:.5em;margin-top:0}.h1,.h2,.h3,.h4,.h5,.h6{font-weight:500}.h1,h1{font-size:2rem}.h2,h2{font-size:1.6rem}.h3,h3{font-size:1.4rem}.h4,h4{font-size:1.2rem}.h5,h5{font-size:1rem}.h6,h6{font-size:.8rem}p{margin:0 0 1.2rem}a,ins,u{text-decoration-skip:ink edges}abbr[title]{border-bottom:.05rem dotted;cursor:help;text-decoration:none}kbd{background:#303742;border-radius:.1rem;color:#fff;font-size:.7rem;line-height:1.25;padding:.1rem .2rem}mark{background:#ffe9b3;border-bottom:.05rem solid #ffd367;border-radius:.1rem;color:#3b4351;padding:.05rem .1rem 0}blockquote{border-left:.1rem solid #dadee4;margin-left:0;padding:.4rem .8rem}blockquote p:last-child{margin-bottom:0}ol,ul{margin:.8rem 0 .8rem .8rem;padding:0}ol ol,ol ul,ul ol,ul ul{margin:.8rem 0 .8rem .8rem}ol li,ul li{margin-top:.4rem}ul{list-style:disc inside}ul ul{list-style-type:circle}ol{list-style:decimal inside}ol ol{list-style-type:lower-alpha}dl dt{font-weight:700}dl dd{margin:.4rem 0 .8rem 0}.lang-zh,.lang-zh-hans,html:lang(zh),html:lang(zh-Hans){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",sans-serif}.lang-zh-hant,html:lang(zh-Hant){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang TC","Hiragino Sans CNS","Microsoft JhengHei","Helvetica Neue",sans-serif}.lang-ja,html:lang(ja){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Hiragino Sans","Hiragino Kaku Gothic Pro","Yu Gothic",YuGothic,Meiryo,"Helvetica Neue",sans-serif}.lang-ko,html:lang(ko){font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Malgun Gothic","Helvetica Neue",sans-serif}.lang-cjk ins,.lang-cjk u,:lang(ja) ins,:lang(ja) u,:lang(zh) ins,:lang(zh) u{border-bottom:.05rem solid;text-decoration:none}.lang-cjk del+del,.lang-cjk del+s,.lang-cjk ins+ins,.lang-cjk ins+u,.lang-cjk s+del,.lang-cjk s+s,.lang-cjk u+ins,.lang-cjk u+u,:lang(ja) del+del,:lang(ja) del+s,:lang(ja) ins+ins,:lang(ja) ins+u,:lang(ja) s+del,:lang(ja) s+s,:lang(ja) u+ins,:lang(ja) u+u,:lang(zh) del+del,:lang(zh) del+s,:lang(zh) ins+ins,:lang(zh) ins+u,:lang(zh) s+del,:lang(zh) s+s,:lang(zh) u+ins,:lang(zh) u+u{margin-left:.125em}.table{border-collapse:collapse;border-spacing:0;text-align:left;width:100%}.table.table-striped tbody tr:nth-of-type(odd){background:#f7f8f9}.table tbody tr.active,.table.table-striped tbody tr.active{background:#eef0f3}.table.table-hover tbody tr:hover{background:#eef0f3}.table.table-scroll{display:block;overflow-x:auto;padding-bottom:.75rem;white-space:nowrap}.table td,.table th{border-bottom:.05rem solid #dadee4;padding:.6rem .4rem}.table th{border-bottom-width:.1rem}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:.05rem solid #5755d9;border-radius:.1rem;color:#5755d9;cursor:pointer;display:inline-block;font-size:.8rem;height:1.8rem;line-height:1.2rem;outline:0;padding:.25rem .4rem;text-align:center;text-decoration:none;transition:background .2s,border .2s,box-shadow .2s,color .2s;-webkit-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap}.btn:focus{box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.btn:focus,.btn:hover{background:#f1f1fc;border-color:#4b48d6;text-decoration:none}.btn.active,.btn:active{background:#4b48d6;border-color:#3634d2;color:#fff;text-decoration:none}.btn.active.loading::after,.btn:active.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.disabled,.btn:disabled,.btn[disabled]{cursor:default;opacity:.5;pointer-events:none}.btn.btn-primary{background:#5755d9;border-color:#4b48d6;color:#fff}.btn.btn-primary:focus,.btn.btn-primary:hover{background:#4240d4;border-color:#3634d2;color:#fff}.btn.btn-primary.active,.btn.btn-primary:active{background:#3a38d2;border-color:#302ecd;color:#fff}.btn.btn-primary.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-success{background:#32b643;border-color:#2faa3f;color:#fff}.btn.btn-success:focus{box-shadow:0 0 0 .1rem rgba(50,182,67,.2)}.btn.btn-success:focus,.btn.btn-success:hover{background:#30ae40;border-color:#2da23c;color:#fff}.btn.btn-success.active,.btn.btn-success:active{background:#2a9a39;border-color:#278e34;color:#fff}.btn.btn-success.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-error{background:#e85600;border-color:#d95000;color:#fff}.btn.btn-error:focus{box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.btn.btn-error:focus,.btn.btn-error:hover{background:#de5200;border-color:#cf4d00;color:#fff}.btn.btn-error.active,.btn.btn-error:active{background:#c44900;border-color:#b54300;color:#fff}.btn.btn-error.loading::after{border-bottom-color:#fff;border-left-color:#fff}.btn.btn-link{background:0 0;border-color:transparent;color:#5755d9}.btn.btn-link.active,.btn.btn-link:active,.btn.btn-link:focus,.btn.btn-link:hover{color:#302ecd}.btn.btn-sm{font-size:.7rem;height:1.4rem;padding:.05rem .3rem}.btn.btn-lg{font-size:.9rem;height:2rem;padding:.35rem .6rem}.btn.btn-block{display:block;width:100%}.btn.btn-action{padding-left:0;padding-right:0;width:1.8rem}.btn.btn-action.btn-sm{width:1.4rem}.btn.btn-action.btn-lg{width:2rem}.btn.btn-clear{background:0 0;border:0;color:currentColor;height:1rem;line-height:.8rem;margin-left:.2rem;margin-right:-2px;opacity:1;padding:.1rem;text-decoration:none;width:1rem}.btn.btn-clear:focus,.btn.btn-clear:hover{background:rgba(247,248,249,.5);opacity:.95}.btn.btn-clear::before{content:"✕"}.btn-group{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.btn-group .btn{-ms-flex:1 0 auto;flex:1 0 auto}.btn-group .btn:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.btn-group .btn:not(:first-child):not(:last-child){border-radius:0;margin-left:-.05rem}.btn-group .btn:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-.05rem}.btn-group .btn.active,.btn-group .btn:active,.btn-group .btn:focus,.btn-group .btn:hover{z-index:1}.btn-group.btn-group-block{display:-ms-flexbox;display:flex}.btn-group.btn-group-block .btn{-ms-flex:1 0 0;flex:1 0 0}.form-group:not(:last-child){margin-bottom:.4rem}fieldset{margin-bottom:.8rem}legend{font-size:.9rem;font-weight:500;margin-bottom:.8rem}.form-label{display:block;line-height:1.2rem;padding:.3rem 0}.form-label.label-sm{font-size:.7rem;padding:.1rem 0}.form-label.label-lg{font-size:.9rem;padding:.4rem 0}.form-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;background-image:none;border:.05rem solid #bcc3ce;border-radius:.1rem;color:#3b4351;display:block;font-size:.8rem;height:1.8rem;line-height:1.2rem;max-width:100%;outline:0;padding:.25rem .4rem;position:relative;transition:background .2s,border .2s,box-shadow .2s,color .2s;width:100%}.form-input:focus{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-input:-ms-input-placeholder{color:#bcc3ce}.form-input::-ms-input-placeholder{color:#bcc3ce}.form-input::placeholder{color:#bcc3ce}.form-input.input-sm{font-size:.7rem;height:1.4rem;padding:.05rem .3rem}.form-input.input-lg{font-size:.9rem;height:2rem;padding:.35rem .6rem}.form-input.input-inline{display:inline-block;vertical-align:middle;width:auto}.form-input[type=file]{height:auto}textarea.form-input,textarea.form-input.input-lg,textarea.form-input.input-sm{height:auto}.form-input-hint{color:#bcc3ce;font-size:.7rem;margin-top:.2rem}.has-success .form-input-hint,.is-success+.form-input-hint{color:#32b643}.has-error .form-input-hint,.is-error+.form-input-hint{color:#e85600}.form-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff;border:.05rem solid #bcc3ce;border-radius:.1rem;color:inherit;font-size:.8rem;height:1.8rem;line-height:1.2rem;outline:0;padding:.25rem .4rem;vertical-align:middle;width:100%}.form-select:focus{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-select::-ms-expand{display:none}.form-select.select-sm{font-size:.7rem;height:1.4rem;padding:.05rem 1.1rem .05rem .3rem}.form-select.select-lg{font-size:.9rem;height:2rem;padding:.35rem 1.4rem .35rem .6rem}.form-select[multiple],.form-select[size]{height:auto;padding:.25rem .4rem}.form-select[multiple] option,.form-select[size] option{padding:.1rem .2rem}.form-select:not([multiple]):not([size]){background:#fff url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center/.4rem .5rem;padding-right:1.2rem}.has-icon-left,.has-icon-right{position:relative}.has-icon-left .form-icon,.has-icon-right .form-icon{height:.8rem;margin:0 .25rem;position:absolute;top:50%;transform:translateY(-50%);width:.8rem;z-index:2}.has-icon-left .form-icon{left:.05rem}.has-icon-left .form-input{padding-left:1.3rem}.has-icon-right .form-icon{right:.05rem}.has-icon-right .form-input{padding-right:1.3rem}.form-checkbox,.form-radio,.form-switch{display:block;line-height:1.2rem;margin:.2rem 0;min-height:1.4rem;padding:.1rem .4rem .1rem 1.2rem;position:relative}.form-checkbox input,.form-radio input,.form-switch input{clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;position:absolute;width:1px}.form-checkbox input:focus+.form-icon,.form-radio input:focus+.form-icon,.form-switch input:focus+.form-icon{border-color:#5755d9;box-shadow:0 0 0 .1rem rgba(87,85,217,.2)}.form-checkbox input:checked+.form-icon,.form-radio input:checked+.form-icon,.form-switch input:checked+.form-icon{background:#5755d9;border-color:#5755d9}.form-checkbox .form-icon,.form-radio .form-icon,.form-switch .form-icon{border:.05rem solid #bcc3ce;cursor:pointer;display:inline-block;position:absolute;transition:background .2s,border .2s,box-shadow .2s,color .2s}.form-checkbox.input-sm,.form-radio.input-sm,.form-switch.input-sm{font-size:.7rem;margin:0}.form-checkbox.input-lg,.form-radio.input-lg,.form-switch.input-lg{font-size:.9rem;margin:.3rem 0}.form-checkbox .form-icon,.form-radio .form-icon{background:#fff;height:.8rem;left:0;top:.3rem;width:.8rem}.form-checkbox input:active+.form-icon,.form-radio input:active+.form-icon{background:#eef0f3}.form-checkbox .form-icon{border-radius:.1rem}.form-checkbox input:checked+.form-icon::before{background-clip:padding-box;border:.1rem solid #fff;border-left-width:0;border-top-width:0;content:"";height:9px;left:50%;margin-left:-3px;margin-top:-6px;position:absolute;top:50%;transform:rotate(45deg);width:6px}.form-checkbox input:indeterminate+.form-icon{background:#5755d9;border-color:#5755d9}.form-checkbox input:indeterminate+.form-icon::before{background:#fff;content:"";height:2px;left:50%;margin-left:-5px;margin-top:-1px;position:absolute;top:50%;width:10px}.form-radio .form-icon{border-radius:50%}.form-radio input:checked+.form-icon::before{background:#fff;border-radius:50%;content:"";height:6px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:6px}.form-switch{padding-left:2rem}.form-switch .form-icon{background:#bcc3ce;background-clip:padding-box;border-radius:.45rem;height:.9rem;left:0;top:.25rem;width:1.6rem}.form-switch .form-icon::before{background:#fff;border-radius:50%;content:"";display:block;height:.8rem;left:0;position:absolute;top:0;transition:background .2s,border .2s,box-shadow .2s,color .2s,left .2s;width:.8rem}.form-switch input:checked+.form-icon::before{left:14px}.form-switch input:active+.form-icon::before{background:#f7f8f9}.input-group{display:-ms-flexbox;display:flex}.input-group .input-group-addon{background:#f7f8f9;border:.05rem solid #bcc3ce;border-radius:.1rem;line-height:1.2rem;padding:.25rem .4rem;white-space:nowrap}.input-group .input-group-addon.addon-sm{font-size:.7rem;padding:.05rem .3rem}.input-group .input-group-addon.addon-lg{font-size:.9rem;padding:.35rem .6rem}.input-group .form-input,.input-group .form-select{-ms-flex:1 1 auto;flex:1 1 auto;width:1%}.input-group .input-group-btn{z-index:1}.input-group .form-input:first-child:not(:last-child),.input-group .form-select:first-child:not(:last-child),.input-group .input-group-addon:first-child:not(:last-child),.input-group .input-group-btn:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.input-group .form-input:not(:first-child):not(:last-child),.input-group .form-select:not(:first-child):not(:last-child),.input-group .input-group-addon:not(:first-child):not(:last-child),.input-group .input-group-btn:not(:first-child):not(:last-child){border-radius:0;margin-left:-.05rem}.input-group .form-input:last-child:not(:first-child),.input-group .form-select:last-child:not(:first-child),.input-group .input-group-addon:last-child:not(:first-child),.input-group .input-group-btn:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-.05rem}.input-group .form-input:focus,.input-group .form-select:focus,.input-group .input-group-addon:focus,.input-group .input-group-btn:focus{z-index:2}.input-group .form-select{width:auto}.input-group.input-inline{display:-ms-inline-flexbox;display:inline-flex}.form-input.is-success,.form-select.is-success,.has-success .form-input,.has-success .form-select{background:#f9fdfa;border-color:#32b643}.form-input.is-success:focus,.form-select.is-success:focus,.has-success .form-input:focus,.has-success .form-select:focus{box-shadow:0 0 0 .1rem rgba(50,182,67,.2)}.form-input.is-error,.form-select.is-error,.has-error .form-input,.has-error .form-select{background:#fffaf7;border-color:#e85600}.form-input.is-error:focus,.form-select.is-error:focus,.has-error .form-input:focus,.has-error .form-select:focus{box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-checkbox.is-error .form-icon,.form-radio.is-error .form-icon,.form-switch.is-error .form-icon,.has-error .form-checkbox .form-icon,.has-error .form-radio .form-icon,.has-error .form-switch .form-icon{border-color:#e85600}.form-checkbox.is-error input:checked+.form-icon,.form-radio.is-error input:checked+.form-icon,.form-switch.is-error input:checked+.form-icon,.has-error .form-checkbox input:checked+.form-icon,.has-error .form-radio input:checked+.form-icon,.has-error .form-switch input:checked+.form-icon{background:#e85600;border-color:#e85600}.form-checkbox.is-error input:focus+.form-icon,.form-radio.is-error input:focus+.form-icon,.form-switch.is-error input:focus+.form-icon,.has-error .form-checkbox input:focus+.form-icon,.has-error .form-radio input:focus+.form-icon,.has-error .form-switch input:focus+.form-icon{border-color:#e85600;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-checkbox.is-error input:indeterminate+.form-icon,.has-error .form-checkbox input:indeterminate+.form-icon{background:#e85600;border-color:#e85600}.form-input:not(:-ms-input-placeholder):invalid{border-color:#e85600}.form-input:not(:placeholder-shown):invalid{border-color:#e85600}.form-input:not(:-ms-input-placeholder):invalid:focus{background:#fffaf7;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-input:not(:placeholder-shown):invalid:focus{background:#fffaf7;box-shadow:0 0 0 .1rem rgba(232,86,0,.2)}.form-input:not(:-ms-input-placeholder):invalid+.form-input-hint{color:#e85600}.form-input:not(:placeholder-shown):invalid+.form-input-hint{color:#e85600}.form-input.disabled,.form-input:disabled,.form-select.disabled,.form-select:disabled{background-color:#eef0f3;cursor:not-allowed;opacity:.5}.form-input[readonly]{background-color:#f7f8f9}input.disabled+.form-icon,input:disabled+.form-icon{background:#eef0f3;cursor:not-allowed;opacity:.5}.form-switch input.disabled+.form-icon::before,.form-switch input:disabled+.form-icon::before{background:#fff}.form-horizontal{padding:.4rem 0}.form-horizontal .form-group{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.form-inline{display:inline-block}.label{background:#eef0f3;border-radius:.1rem;color:#455060;display:inline-block;line-height:1.25;padding:.1rem .2rem}.label.label-rounded{border-radius:5rem;padding-left:.4rem;padding-right:.4rem}.label.label-primary{background:#5755d9;color:#fff}.label.label-secondary{background:#f1f1fc;color:#5755d9}.label.label-success{background:#32b643;color:#fff}.label.label-warning{background:#ffb700;color:#fff}.label.label-error{background:#e85600;color:#fff}code{background:#fcf2f2;border-radius:.1rem;color:#d73e48;font-size:85%;line-height:1.25;padding:.1rem .2rem}.code{border-radius:.1rem;color:#3b4351;position:relative}.code::before{color:#bcc3ce;content:attr(data-lang);font-size:.7rem;position:absolute;right:.4rem;top:.1rem}.code code{background:#f7f8f9;color:inherit;display:block;line-height:1.5;overflow-x:auto;padding:1rem;width:100%}.img-responsive{display:block;height:auto;max-width:100%}.img-fit-cover{object-fit:cover}.img-fit-contain{object-fit:contain}.video-responsive{display:block;overflow:hidden;padding:0;position:relative;width:100%}.video-responsive::before{content:"";display:block;padding-bottom:56.25%}.video-responsive embed,.video-responsive iframe,.video-responsive object{border:0;bottom:0;height:100%;left:0;position:absolute;right:0;top:0;width:100%}video.video-responsive{height:auto;max-width:100%}video.video-responsive::before{content:none}.video-responsive-4-3::before{padding-bottom:75%}.video-responsive-1-1::before{padding-bottom:100%}.figure{margin:0 0 .4rem 0}.figure .figure-caption{color:#66758c;margin-top:.4rem}.container{margin-left:auto;margin-right:auto;padding-left:.4rem;padding-right:.4rem;width:100%}.container.grid-xl{max-width:1296px}.container.grid-lg{max-width:976px}.container.grid-md{max-width:856px}.container.grid-sm{max-width:616px}.container.grid-xs{max-width:496px}.show-lg,.show-md,.show-sm,.show-xl,.show-xs{display:none!important}.cols,.columns{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-left:-.4rem;margin-right:-.4rem}.cols.col-gapless,.columns.col-gapless{margin-left:0;margin-right:0}.cols.col-gapless>.column,.columns.col-gapless>.column{padding-left:0;padding-right:0}.cols.col-oneline,.columns.col-oneline{-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto}.column,[class~=col-]{-ms-flex:1;flex:1;max-width:100%;padding-left:.4rem;padding-right:.4rem}.column.col-1,.column.col-10,.column.col-11,.column.col-12,.column.col-2,.column.col-3,.column.col-4,.column.col-5,.column.col-6,.column.col-7,.column.col-8,.column.col-9,.column.col-auto,[class~=col-].col-1,[class~=col-].col-10,[class~=col-].col-11,[class~=col-].col-12,[class~=col-].col-2,[class~=col-].col-3,[class~=col-].col-4,[class~=col-].col-5,[class~=col-].col-6,[class~=col-].col-7,[class~=col-].col-8,[class~=col-].col-9,[class~=col-].col-auto{-ms-flex:none;flex:none}.col-12{width:100%}.col-11{width:91.66666667%}.col-10{width:83.33333333%}.col-9{width:75%}.col-8{width:66.66666667%}.col-7{width:58.33333333%}.col-6{width:50%}.col-5{width:41.66666667%}.col-4{width:33.33333333%}.col-3{width:25%}.col-2{width:16.66666667%}.col-1{width:8.33333333%}.col-auto{-ms-flex:0 0 auto;flex:0 0 auto;max-width:none;width:auto}.col-mx-auto{margin-left:auto;margin-right:auto}.col-ml-auto{margin-left:auto}.col-mr-auto{margin-right:auto}@media(max-width:1280px){.col-xl-1,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-auto{-ms-flex:none;flex:none}.col-xl-12{width:100%}.col-xl-11{width:91.66666667%}.col-xl-10{width:83.33333333%}.col-xl-9{width:75%}.col-xl-8{width:66.66666667%}.col-xl-7{width:58.33333333%}.col-xl-6{width:50%}.col-xl-5{width:41.66666667%}.col-xl-4{width:33.33333333%}.col-xl-3{width:25%}.col-xl-2{width:16.66666667%}.col-xl-1{width:8.33333333%}.col-xl-auto{width:auto}.hide-xl{display:none!important}.show-xl{display:block!important}}@media(max-width:960px){.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-auto{-ms-flex:none;flex:none}.col-lg-12{width:100%}.col-lg-11{width:91.66666667%}.col-lg-10{width:83.33333333%}.col-lg-9{width:75%}.col-lg-8{width:66.66666667%}.col-lg-7{width:58.33333333%}.col-lg-6{width:50%}.col-lg-5{width:41.66666667%}.col-lg-4{width:33.33333333%}.col-lg-3{width:25%}.col-lg-2{width:16.66666667%}.col-lg-1{width:8.33333333%}.col-lg-auto{width:auto}.hide-lg{display:none!important}.show-lg{display:block!important}}@media(max-width:840px){.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-auto{-ms-flex:none;flex:none}.col-md-12{width:100%}.col-md-11{width:91.66666667%}.col-md-10{width:83.33333333%}.col-md-9{width:75%}.col-md-8{width:66.66666667%}.col-md-7{width:58.33333333%}.col-md-6{width:50%}.col-md-5{width:41.66666667%}.col-md-4{width:33.33333333%}.col-md-3{width:25%}.col-md-2{width:16.66666667%}.col-md-1{width:8.33333333%}.col-md-auto{width:auto}.hide-md{display:none!important}.show-md{display:block!important}}@media(max-width:600px){.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-auto{-ms-flex:none;flex:none}.col-sm-12{width:100%}.col-sm-11{width:91.66666667%}.col-sm-10{width:83.33333333%}.col-sm-9{width:75%}.col-sm-8{width:66.66666667%}.col-sm-7{width:58.33333333%}.col-sm-6{width:50%}.col-sm-5{width:41.66666667%}.col-sm-4{width:33.33333333%}.col-sm-3{width:25%}.col-sm-2{width:16.66666667%}.col-sm-1{width:8.33333333%}.col-sm-auto{width:auto}.hide-sm{display:none!important}.show-sm{display:block!important}}@media(max-width:480px){.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-auto{-ms-flex:none;flex:none}.col-xs-12{width:100%}.col-xs-11{width:91.66666667%}.col-xs-10{width:83.33333333%}.col-xs-9{width:75%}.col-xs-8{width:66.66666667%}.col-xs-7{width:58.33333333%}.col-xs-6{width:50%}.col-xs-5{width:41.66666667%}.col-xs-4{width:33.33333333%}.col-xs-3{width:25%}.col-xs-2{width:16.66666667%}.col-xs-1{width:8.33333333%}.col-xs-auto{width:auto}.hide-xs{display:none!important}.show-xs{display:block!important}}.hero{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:4rem;padding-top:4rem}.hero.hero-sm{padding-bottom:2rem;padding-top:2rem}.hero.hero-lg{padding-bottom:8rem;padding-top:8rem}.hero .hero-body{padding:.4rem}.navbar{align-items:stretch;display:-ms-flexbox;display:flex;-ms-flex-align:stretch;-ms-flex-pack:justify;-ms-flex-wrap:wrap;flex-wrap:wrap;justify-content:space-between}.navbar .navbar-section{align-items:center;display:-ms-flexbox;display:flex;-ms-flex:1 0 0;flex:1 0 0;-ms-flex-align:center}.navbar .navbar-section:not(:first-child):last-child{-ms-flex-pack:end;justify-content:flex-end}.navbar .navbar-center{align-items:center;display:-ms-flexbox;display:flex;-ms-flex:0 0 auto;flex:0 0 auto;-ms-flex-align:center}.navbar .navbar-brand{font-size:.9rem;text-decoration:none}.accordion input:checked~.accordion-header>.icon:first-child,.accordion[open] .accordion-header>.icon:first-child{transform:rotate(90deg)}.accordion input:checked~.accordion-body,.accordion[open] .accordion-body{max-height:50rem}.accordion .accordion-header{display:block;padding:.2rem .4rem}.accordion .accordion-header .icon{transition:transform .25s}.accordion .accordion-body{margin-bottom:.4rem;max-height:0;overflow:hidden;transition:max-height .25s}summary.accordion-header::-webkit-details-marker{display:none}.avatar{background:#5755d9;border-radius:50%;color:rgba(255,255,255,.85);display:inline-block;font-size:.8rem;font-weight:300;height:1.6rem;line-height:1.25;margin:0;position:relative;vertical-align:middle;width:1.6rem}.avatar.avatar-xs{font-size:.4rem;height:.8rem;width:.8rem}.avatar.avatar-sm{font-size:.6rem;height:1.2rem;width:1.2rem}.avatar.avatar-lg{font-size:1.2rem;height:2.4rem;width:2.4rem}.avatar.avatar-xl{font-size:1.6rem;height:3.2rem;width:3.2rem}.avatar img{border-radius:50%;height:100%;position:relative;width:100%;z-index:1}.avatar .avatar-icon,.avatar .avatar-presence{background:#fff;bottom:14.64%;height:50%;padding:.1rem;position:absolute;right:14.64%;transform:translate(50%,50%);width:50%;z-index:2}.avatar .avatar-presence{background:#bcc3ce;border-radius:50%;box-shadow:0 0 0 .1rem #fff;height:.5em;width:.5em}.avatar .avatar-presence.online{background:#32b643}.avatar .avatar-presence.busy{background:#e85600}.avatar .avatar-presence.away{background:#ffb700}.avatar[data-initial]::before{color:currentColor;content:attr(data-initial);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:1}.badge{position:relative;white-space:nowrap}.badge:not([data-badge])::after,.badge[data-badge]::after{background:#5755d9;background-clip:padding-box;border-radius:.5rem;box-shadow:0 0 0 .1rem #fff;color:#fff;content:attr(data-badge);display:inline-block;transform:translate(-.05rem,-.5rem)}.badge[data-badge]::after{font-size:.7rem;height:.9rem;line-height:1;min-width:.9rem;padding:.1rem .2rem;text-align:center;white-space:nowrap}.badge:not([data-badge])::after,.badge[data-badge=""]::after{height:6px;min-width:6px;padding:0;width:6px}.badge.btn::after{position:absolute;right:0;top:0;transform:translate(50%,-50%)}.badge.avatar::after{position:absolute;right:14.64%;top:14.64%;transform:translate(50%,-50%);z-index:100}.breadcrumb{list-style:none;margin:.2rem 0;padding:.2rem 0}.breadcrumb .breadcrumb-item{color:#66758c;display:inline-block;margin:0;padding:.2rem 0}.breadcrumb .breadcrumb-item:not(:last-child){margin-right:.2rem}.breadcrumb .breadcrumb-item:not(:last-child) a{color:#66758c}.breadcrumb .breadcrumb-item:not(:first-child)::before{color:#66758c;content:"/";padding-right:.4rem}.bar{background:#eef0f3;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;height:.8rem;width:100%}.bar.bar-sm{height:.2rem}.bar .bar-item{background:#5755d9;color:#fff;display:block;-ms-flex-negative:0;flex-shrink:0;font-size:.7rem;height:100%;line-height:.8rem;position:relative;text-align:center;width:0}.bar .bar-item:first-child{border-bottom-left-radius:.1rem;border-top-left-radius:.1rem}.bar .bar-item:last-child{border-bottom-right-radius:.1rem;border-top-right-radius:.1rem;-ms-flex-negative:1;flex-shrink:1}.bar-slider{height:.1rem;margin:.4rem 0;position:relative}.bar-slider .bar-item{left:0;padding:0;position:absolute}.bar-slider .bar-item:not(:last-child):first-child{background:#eef0f3;z-index:1}.bar-slider .bar-slider-btn{background:#5755d9;border:0;border-radius:50%;height:.6rem;padding:0;position:absolute;right:0;top:50%;transform:translate(50%,-50%);width:.6rem}.bar-slider .bar-slider-btn:active{box-shadow:0 0 0 .1rem #5755d9}.card{background:#fff;border:.05rem solid #dadee4;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.card .card-body,.card .card-footer,.card .card-header{padding:.8rem;padding-bottom:0}.card .card-body:last-child,.card .card-footer:last-child,.card .card-header:last-child{padding-bottom:.8rem}.card .card-body{-ms-flex:1 1 auto;flex:1 1 auto}.card .card-image{padding-top:.8rem}.card .card-image:first-child{padding-top:0}.card .card-image:first-child img{border-top-left-radius:.1rem;border-top-right-radius:.1rem}.card .card-image:last-child img{border-bottom-left-radius:.1rem;border-bottom-right-radius:.1rem}.chip{align-items:center;background:#eef0f3;border-radius:5rem;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;font-size:90%;height:1.2rem;line-height:.8rem;margin:.1rem;max-width:320px;overflow:hidden;padding:.2rem .4rem;text-decoration:none;text-overflow:ellipsis;vertical-align:middle;white-space:nowrap}.chip.active{background:#5755d9;color:#fff}.chip .avatar{margin-left:-.4rem;margin-right:.2rem}.chip .btn-clear{border-radius:50%;transform:scale(.75)}.dropdown{display:inline-block;position:relative}.dropdown .menu{animation:slide-down .15s ease 1;display:none;left:0;max-height:50vh;overflow-y:auto;position:absolute;top:100%}.dropdown.dropdown-right .menu{left:auto;right:0}.dropdown .dropdown-toggle:focus+.menu,.dropdown .menu:hover,.dropdown.active .menu{display:block}.dropdown .btn-group .dropdown-toggle:nth-last-child(2){border-bottom-right-radius:.1rem;border-top-right-radius:.1rem}.empty{background:#f7f8f9;border-radius:.1rem;color:#66758c;padding:3.2rem 1.6rem;text-align:center}.empty .empty-icon{margin-bottom:.8rem}.empty .empty-subtitle,.empty .empty-title{margin:.4rem auto}.empty .empty-action{margin-top:.8rem}.menu{background:#fff;border-radius:.1rem;box-shadow:0 .05rem .2rem rgba(48,55,66,.3);list-style:none;margin:0;min-width:180px;padding:.4rem;transform:translateY(.2rem);z-index:300}.menu.menu-nav{background:0 0;box-shadow:none}.menu .menu-item{margin-top:0;padding:0 .4rem;position:relative;text-decoration:none}.menu .menu-item>a{border-radius:.1rem;color:inherit;display:block;margin:0 -.4rem;padding:.2rem .4rem;text-decoration:none}.menu .menu-item>a:focus,.menu .menu-item>a:hover{background:#f1f1fc;color:#5755d9}.menu .menu-item>a.active,.menu .menu-item>a:active{background:#f1f1fc;color:#5755d9}.menu .menu-item .form-checkbox,.menu .menu-item .form-radio,.menu .menu-item .form-switch{margin:.1rem 0}.menu .menu-item+.menu-item{margin-top:.2rem}.menu .menu-badge{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;height:100%;position:absolute;right:0;top:0}.menu .menu-badge .label{margin-right:.4rem}.modal{align-items:center;bottom:0;display:none;-ms-flex-align:center;-ms-flex-pack:center;justify-content:center;left:0;opacity:0;overflow:hidden;padding:.4rem;position:fixed;right:0;top:0}.modal.active,.modal:target{display:-ms-flexbox;display:flex;opacity:1;z-index:400}.modal.active .modal-overlay,.modal:target .modal-overlay{background:rgba(247,248,249,.75);bottom:0;cursor:default;display:block;left:0;position:absolute;right:0;top:0}.modal.active .modal-container,.modal:target .modal-container{animation:slide-down .2s ease 1;z-index:1}.modal.modal-sm .modal-container{max-width:320px;padding:0 .4rem}.modal.modal-lg .modal-overlay{background:#fff}.modal.modal-lg .modal-container{box-shadow:none;max-width:960px}.modal-container{background:#fff;border-radius:.1rem;box-shadow:0 .2rem .5rem rgba(48,55,66,.3);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;max-height:75vh;max-width:640px;padding:0 .8rem;width:100%}.modal-container.modal-fullheight{max-height:100vh}.modal-container .modal-header{color:#303742;padding:.8rem}.modal-container .modal-body{overflow-y:auto;padding:.8rem;position:relative}.modal-container .modal-footer{padding:.8rem;text-align:right}.nav{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;list-style:none;margin:.2rem 0}.nav .nav-item a{color:#66758c;padding:.2rem .4rem;text-decoration:none}.nav .nav-item a:focus,.nav .nav-item a:hover{color:#5755d9}.nav .nav-item.active>a{color:#505c6e;font-weight:700}.nav .nav-item.active>a:focus,.nav .nav-item.active>a:hover{color:#5755d9}.nav .nav{margin-bottom:.4rem;margin-left:.8rem}.pagination{display:-ms-flexbox;display:flex;list-style:none;margin:.2rem 0;padding:.2rem 0}.pagination .page-item{margin:.2rem .05rem}.pagination .page-item span{display:inline-block;padding:.2rem .2rem}.pagination .page-item a{border-radius:.1rem;display:inline-block;padding:.2rem .4rem;text-decoration:none}.pagination .page-item a:focus,.pagination .page-item a:hover{color:#5755d9}.pagination .page-item.disabled a{cursor:default;opacity:.5;pointer-events:none}.pagination .page-item.active a{background:#5755d9;color:#fff}.pagination .page-item.page-next,.pagination .page-item.page-prev{-ms-flex:1 0 50%;flex:1 0 50%}.pagination .page-item.page-next{text-align:right}.pagination .page-item .page-item-title{margin:0}.pagination .page-item .page-item-subtitle{margin:0;opacity:.5}.panel{border:.05rem solid #dadee4;border-radius:.1rem;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.panel .panel-footer,.panel .panel-header{-ms-flex:0 0 auto;flex:0 0 auto;padding:.8rem}.panel .panel-nav{-ms-flex:0 0 auto;flex:0 0 auto}.panel .panel-body{-ms-flex:1 1 auto;flex:1 1 auto;overflow-y:auto;padding:0 .8rem}.popover{display:inline-block;position:relative}.popover .popover-container{left:50%;opacity:0;padding:.4rem;position:absolute;top:0;transform:translate(-50%,-50%) scale(0);transition:transform .2s;width:320px;z-index:300}.popover :focus+.popover-container,.popover:hover .popover-container{display:block;opacity:1;transform:translate(-50%,-100%) scale(1)}.popover.popover-right .popover-container{left:100%;top:50%}.popover.popover-right :focus+.popover-container,.popover.popover-right:hover .popover-container{transform:translate(0,-50%) scale(1)}.popover.popover-bottom .popover-container{left:50%;top:100%}.popover.popover-bottom :focus+.popover-container,.popover.popover-bottom:hover .popover-container{transform:translate(-50%,0) scale(1)}.popover.popover-left .popover-container{left:0;top:50%}.popover.popover-left :focus+.popover-container,.popover.popover-left:hover .popover-container{transform:translate(-100%,-50%) scale(1)}.popover .card{border:0;box-shadow:0 .2rem .5rem rgba(48,55,66,.3)}.step{display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;list-style:none;margin:.2rem 0;width:100%}.step .step-item{-ms-flex:1 1 0;flex:1 1 0;margin-top:0;min-height:1rem;position:relative;text-align:center}.step .step-item:not(:first-child)::before{background:#5755d9;content:"";height:2px;left:-50%;position:absolute;top:9px;width:100%}.step .step-item a{color:#5755d9;display:inline-block;padding:20px 10px 0;text-decoration:none}.step .step-item a::before{background:#5755d9;border:.1rem solid #fff;border-radius:50%;content:"";display:block;height:.6rem;left:50%;position:absolute;top:.2rem;transform:translateX(-50%);width:.6rem;z-index:1}.step .step-item.active a::before{background:#fff;border:.1rem solid #5755d9}.step .step-item.active~.step-item::before{background:#dadee4}.step .step-item.active~.step-item a{color:#bcc3ce}.step .step-item.active~.step-item a::before{background:#dadee4}.tab{align-items:center;border-bottom:.05rem solid #dadee4;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-wrap:wrap;flex-wrap:wrap;list-style:none;margin:.2rem 0 .15rem 0}.tab .tab-item{margin-top:0}.tab .tab-item a{border-bottom:.1rem solid transparent;color:inherit;display:block;margin:0 .4rem 0 0;padding:.4rem .2rem .3rem .2rem;text-decoration:none}.tab .tab-item a:focus,.tab .tab-item a:hover{color:#5755d9}.tab .tab-item a.active,.tab .tab-item.active a{border-bottom-color:#5755d9;color:#5755d9}.tab .tab-item.tab-action{-ms-flex:1 0 auto;flex:1 0 auto;text-align:right}.tab .tab-item .btn-clear{margin-top:-.2rem}.tab.tab-block .tab-item{-ms-flex:1 0 0;flex:1 0 0;text-align:center}.tab.tab-block .tab-item a{margin:0}.tab.tab-block .tab-item .badge[data-badge]::after{position:absolute;right:.1rem;top:.1rem;transform:translate(0,0)}.tab:not(.tab-block) .badge{padding-right:0}.tile{align-content:space-between;align-items:flex-start;display:-ms-flexbox;display:flex;-ms-flex-align:start;-ms-flex-line-pack:justify}.tile .tile-action,.tile .tile-icon{-ms-flex:0 0 auto;flex:0 0 auto}.tile .tile-content{-ms-flex:1 1 auto;flex:1 1 auto}.tile .tile-content:not(:first-child){padding-left:.4rem}.tile .tile-content:not(:last-child){padding-right:.4rem}.tile .tile-subtitle,.tile .tile-title{line-height:1.2rem}.tile.tile-centered{align-items:center;-ms-flex-align:center}.tile.tile-centered .tile-content{overflow:hidden}.tile.tile-centered .tile-subtitle,.tile.tile-centered .tile-title{margin-bottom:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.toast{background:rgba(48,55,66,.95);border:.05rem solid #303742;border-color:#303742;border-radius:.1rem;color:#fff;display:block;padding:.4rem;width:100%}.toast.toast-primary{background:rgba(87,85,217,.95);border-color:#5755d9}.toast.toast-success{background:rgba(50,182,67,.95);border-color:#32b643}.toast.toast-warning{background:rgba(255,183,0,.95);border-color:#ffb700}.toast.toast-error{background:rgba(232,86,0,.95);border-color:#e85600}.toast a{color:#fff;text-decoration:underline}.toast a.active,.toast a:active,.toast a:focus,.toast a:hover{opacity:.75}.toast .btn-clear{margin:.1rem}.toast p:last-child{margin-bottom:0}.tooltip{position:relative}.tooltip::after{background:rgba(48,55,66,.95);border-radius:.1rem;bottom:100%;color:#fff;content:attr(data-tooltip);display:block;font-size:.7rem;left:50%;max-width:320px;opacity:0;overflow:hidden;padding:.2rem .4rem;pointer-events:none;position:absolute;text-overflow:ellipsis;transform:translate(-50%,.4rem);transition:opacity .2s,transform .2s;white-space:pre;z-index:300}.tooltip:focus::after,.tooltip:hover::after{opacity:1;transform:translate(-50%,-.2rem)}.tooltip.disabled,.tooltip[disabled]{pointer-events:auto}.tooltip.tooltip-right::after{bottom:50%;left:100%;transform:translate(-.2rem,50%)}.tooltip.tooltip-right:focus::after,.tooltip.tooltip-right:hover::after{transform:translate(.2rem,50%)}.tooltip.tooltip-bottom::after{bottom:auto;top:100%;transform:translate(-50%,-.4rem)}.tooltip.tooltip-bottom:focus::after,.tooltip.tooltip-bottom:hover::after{transform:translate(-50%,.2rem)}.tooltip.tooltip-left::after{bottom:50%;left:auto;right:100%;transform:translate(.4rem,50%)}.tooltip.tooltip-left:focus::after,.tooltip.tooltip-left:hover::after{transform:translate(-.2rem,50%)}@keyframes loading{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes slide-down{0%{opacity:0;transform:translateY(-1.6rem)}100%{opacity:1;transform:translateY(0)}}.text-primary{color:#5755d9!important}a.text-primary:focus,a.text-primary:hover{color:#4240d4}a.text-primary:visited{color:#6c6ade}.text-secondary{color:#e5e5f9!important}a.text-secondary:focus,a.text-secondary:hover{color:#d1d0f4}a.text-secondary:visited{color:#fafafe}.text-gray{color:#bcc3ce!important}a.text-gray:focus,a.text-gray:hover{color:#adb6c4}a.text-gray:visited{color:#cbd0d9}.text-light{color:#fff!important}a.text-light:focus,a.text-light:hover{color:#f2f2f2}a.text-light:visited{color:#fff}.text-dark{color:#3b4351!important}a.text-dark:focus,a.text-dark:hover{color:#303742}a.text-dark:visited{color:#455060}.text-success{color:#32b643!important}a.text-success:focus,a.text-success:hover{color:#2da23c}a.text-success:visited{color:#39c94b}.text-warning{color:#ffb700!important}a.text-warning:focus,a.text-warning:hover{color:#e6a500}a.text-warning:visited{color:#ffbe1a}.text-error{color:#e85600!important}a.text-error:focus,a.text-error:hover{color:#cf4d00}a.text-error:visited{color:#ff6003}.bg-primary{background:#5755d9!important;color:#fff}.bg-secondary{background:#f1f1fc!important}.bg-dark{background:#303742!important;color:#fff}.bg-gray{background:#f7f8f9!important}.bg-success{background:#32b643!important;color:#fff}.bg-warning{background:#ffb700!important;color:#fff}.bg-error{background:#e85600!important;color:#fff}.c-hand{cursor:pointer}.c-move{cursor:move}.c-zoom-in{cursor:zoom-in}.c-zoom-out{cursor:zoom-out}.c-not-allowed{cursor:not-allowed}.c-auto{cursor:auto}.d-block{display:block}.d-inline{display:inline}.d-inline-block{display:inline-block}.d-flex{display:-ms-flexbox;display:flex}.d-inline-flex{display:-ms-inline-flexbox;display:inline-flex}.d-hide,.d-none{display:none!important}.d-visible{visibility:visible}.d-invisible{visibility:hidden}.text-hide{background:0 0;border:0;color:transparent;font-size:0;line-height:0;text-shadow:none}.text-assistive{border:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.divider,.divider-vert{display:block;position:relative}.divider-vert[data-content]::after,.divider[data-content]::after{background:#fff;color:#bcc3ce;content:attr(data-content);display:inline-block;font-size:.7rem;padding:0 .4rem;transform:translateY(-.65rem)}.divider{border-top:.05rem solid #f1f3f5;height:.05rem;margin:.4rem 0}.divider[data-content]{margin:.8rem 0}.divider-vert{display:block;padding:.8rem}.divider-vert::before{border-left:.05rem solid #dadee4;bottom:.4rem;content:"";display:block;left:50%;position:absolute;top:.4rem;transform:translateX(-50%)}.divider-vert[data-content]::after{left:50%;padding:.2rem 0;position:absolute;top:50%;transform:translate(-50%,-50%)}.loading{color:transparent!important;min-height:.8rem;pointer-events:none;position:relative}.loading::after{animation:loading .5s infinite linear;background:0 0;border:.1rem solid #5755d9;border-radius:50%;border-right-color:transparent;border-top-color:transparent;content:"";display:block;height:.8rem;left:50%;margin-left:-.4rem;margin-top:-.4rem;opacity:1;padding:0;position:absolute;top:50%;width:.8rem;z-index:1}.loading.loading-lg{min-height:2rem}.loading.loading-lg::after{height:1.6rem;margin-left:-.8rem;margin-top:-.8rem;width:1.6rem}.clearfix::after{clear:both;content:"";display:table}.float-left{float:left!important}.float-right{float:right!important}.p-relative{position:relative!important}.p-absolute{position:absolute!important}.p-fixed{position:fixed!important}.p-sticky{position:-webkit-sticky!important;position:sticky!important}.p-centered{display:block;float:none;margin-left:auto;margin-right:auto}.flex-centered{align-items:center;display:-ms-flexbox;display:flex;-ms-flex-align:center;-ms-flex-pack:center;justify-content:center}.m-0{margin:0!important}.mb-0{margin-bottom:0!important}.ml-0{margin-left:0!important}.mr-0{margin-right:0!important}.mt-0{margin-top:0!important}.mx-0{margin-left:0!important;margin-right:0!important}.my-0{margin-bottom:0!important;margin-top:0!important}.m-1{margin:.2rem!important}.mb-1{margin-bottom:.2rem!important}.ml-1{margin-left:.2rem!important}.mr-1{margin-right:.2rem!important}.mt-1{margin-top:.2rem!important}.mx-1{margin-left:.2rem!important;margin-right:.2rem!important}.my-1{margin-bottom:.2rem!important;margin-top:.2rem!important}.m-2{margin:.4rem!important}.mb-2{margin-bottom:.4rem!important}.ml-2{margin-left:.4rem!important}.mr-2{margin-right:.4rem!important}.mt-2{margin-top:.4rem!important}.mx-2{margin-left:.4rem!important;margin-right:.4rem!important}.my-2{margin-bottom:.4rem!important;margin-top:.4rem!important}.p-0{padding:0!important}.pb-0{padding-bottom:0!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.pt-0{padding-top:0!important}.px-0{padding-left:0!important;padding-right:0!important}.py-0{padding-bottom:0!important;padding-top:0!important}.p-1{padding:.2rem!important}.pb-1{padding-bottom:.2rem!important}.pl-1{padding-left:.2rem!important}.pr-1{padding-right:.2rem!important}.pt-1{padding-top:.2rem!important}.px-1{padding-left:.2rem!important;padding-right:.2rem!important}.py-1{padding-bottom:.2rem!important;padding-top:.2rem!important}.p-2{padding:.4rem!important}.pb-2{padding-bottom:.4rem!important}.pl-2{padding-left:.4rem!important}.pr-2{padding-right:.4rem!important}.pt-2{padding-top:.4rem!important}.px-2{padding-left:.4rem!important;padding-right:.4rem!important}.py-2{padding-bottom:.4rem!important;padding-top:.4rem!important}.s-rounded{border-radius:.1rem}.s-circle{border-radius:50%}.text-left{text-align:left}.text-right{text-align:right}.text-center{text-align:center}.text-justify{text-align:justify}.text-lowercase{text-transform:lowercase}.text-uppercase{text-transform:uppercase}.text-capitalize{text-transform:capitalize}.text-normal{font-weight:400}.text-bold{font-weight:700}.text-italic{font-style:italic}.text-large{font-size:1.2em}.text-small{font-size:.9em}.text-tiny{font-size:.8em}.text-muted{opacity:.8}.text-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.text-clip{overflow:hidden;text-overflow:clip;white-space:nowrap}.text-break{-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;word-break:break-word;word-wrap:break-word}/*! Spectre.css v0.5.9 | MIT License | github.com/picturepan2/spectre */ \ No newline at end of file diff --git a/docs/getting-started/custom.html b/docs/getting-started/custom.html index 415aa53fb..01604b8df 100644 --- a/docs/getting-started/custom.html +++ b/docs/getting-started/custom.html @@ -243,15 +243,13 @@

Importing Sass$dark-color: #3e396b; // Import full Spectre source code -@import "node_modules/spectre.css/src/spectre"; +@use "node_modules/spectre.css/src/spectre";

Alternatively, you can create custom _variables.scss and import it to project-name.scss.

// Example of project-name.scss
-@import "variables";
-
 // Import only the needed components
-@import "node_modules/spectre.css/src/buttons";
-@import "node_modules/spectre.css/src/forms";
+@use "node_modules/spectre.css/src/buttons";
+@use "node_modules/spectre.css/src/forms";

Folder structure

spectre/
diff --git a/docs/src/getting-started/custom.pug b/docs/src/getting-started/custom.pug
index 12817fa79..4833a177c 100644
--- a/docs/src/getting-started/custom.pug
+++ b/docs/src/getting-started/custom.pug
@@ -86,7 +86,7 @@ block docs-content
           $dark-color: #3e396b;
 
           // Import full Spectre source code
-          @import "node_modules/spectre.css/src/spectre";
+          @use "node_modules/spectre.css/src/spectre";
 
     p
       | Alternatively, you can create custom 
@@ -100,11 +100,9 @@ block docs-content
       code
         :highlight(lang="scss")
           // Example of project-name.scss
-          @import "variables";
-
           // Import only the needed components
-          @import "node_modules/spectre.css/src/buttons";
-          @import "node_modules/spectre.css/src/forms";
+          @use "node_modules/spectre.css/src/buttons";
+          @use "node_modules/spectre.css/src/forms";
 
     +docs-subheading('folders', 'Folder structure')
 
diff --git a/docs/src/scss/docs.scss b/docs/src/scss/docs.scss
index a7b250c55..f5f198d9c 100644
--- a/docs/src/scss/docs.scss
+++ b/docs/src/scss/docs.scss
@@ -1,8 +1,8 @@
 /*! Spectre.css Docs | MIT License | github.com/picturepan2/spectre */
 // Core variables and mixins
 @use "sass:color";
-@use "../../../src/variables";
-@use "../../../src/mixins";
+@use "variables";
+@use "mixins";
 
 .version::after {
   content: "#{variables.$version}";
@@ -779,7 +779,7 @@
     z-index: 999;
     max-width: 600px;
     min-width: 500px;
-    @include shadow-variant(.05rem);
+    @include mixins.shadow-variant(.05rem);
 
     .ds-suggestions {
       position: relative;
diff --git a/docs/src/scss/spectre-rtl.scss b/docs/src/scss/spectre-rtl.scss
index 83948e468..db261a79e 100644
--- a/docs/src/scss/spectre-rtl.scss
+++ b/docs/src/scss/spectre-rtl.scss
@@ -2,5 +2,5 @@
 $rtl: true;
 
 // Import Spectre
-@use "../../../src/spectre";
-@use "../../../src/spectre-exp";
+@use "spectre";
+@use "spectre-exp";
diff --git a/gulpfile.js b/gulpfile.js
index 1b9562abb..715862be7 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -26,7 +26,12 @@ function build() {
 function docs_css() {
   return gulp
     .src(['./src/*.scss', './docs/src/scss/*.scss'])
-    .pipe(sass({outputStyle: 'compressed', precision: 10})
+    .pipe(
+      sass({
+        outputStyle: 'compressed',
+        precision: 10,
+        includePaths: ['./src', './docs/src/scss/*.scss']
+      })
       .on('error', sass.logError)
     )
     .pipe(autoprefixer())

From f10d87e086d946022196c0b3582f9e90b871fc5a Mon Sep 17 00:00:00 2001
From: Mlbiche 
Date: Wed, 24 Feb 2021 19:03:06 +0100
Subject: [PATCH 4/5] Fix missing trailing line

---
 src/_icons.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/_icons.scss b/src/_icons.scss
index 1c099e6cb..4a489a56b 100644
--- a/src/_icons.scss
+++ b/src/_icons.scss
@@ -2,4 +2,4 @@
 @use "icons/icons-core";
 @use "icons/icons-navigation";
 @use "icons/icons-action";
-@use "icons/icons-object";
\ No newline at end of file
+@use "icons/icons-object";

From 443e5af272bbd98b87dfe55d3c336bb117fed63b Mon Sep 17 00:00:00 2001
From: Mlbiche 
Date: Fri, 26 Feb 2021 18:35:57 +0100
Subject: [PATCH 5/5] Update main icons and utilities stylesheets to forward
 other icons and utilities stylesheets

---
 src/_icons.scss     |  8 ++++----
 src/_utilities.scss | 16 ++++++++--------
 2 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/_icons.scss b/src/_icons.scss
index 4a489a56b..faa8095f7 100644
--- a/src/_icons.scss
+++ b/src/_icons.scss
@@ -1,5 +1,5 @@
 // CSS Icons
-@use "icons/icons-core";
-@use "icons/icons-navigation";
-@use "icons/icons-action";
-@use "icons/icons-object";
+@forward "icons/icons-core";
+@forward "icons/icons-navigation";
+@forward "icons/icons-action";
+@forward "icons/icons-object";
diff --git a/src/_utilities.scss b/src/_utilities.scss
index 23d544b33..4363bc1cb 100644
--- a/src/_utilities.scss
+++ b/src/_utilities.scss
@@ -1,8 +1,8 @@
-@use "utilities/colors";
-@use "utilities/cursors";
-@use "utilities/display";
-@use "utilities/divider";
-@use "utilities/loading";
-@use "utilities/position";
-@use "utilities/shapes";
-@use "utilities/text";
+@forward "utilities/colors";
+@forward "utilities/cursors";
+@forward "utilities/display";
+@forward "utilities/divider";
+@forward "utilities/loading";
+@forward "utilities/position";
+@forward "utilities/shapes";
+@forward "utilities/text";