From f11003a29f2dbed00864271d8ad2cb3770887386 Mon Sep 17 00:00:00 2001 From: Jeremy Thomas Date: Sun, 18 Sep 2016 18:09:32 +0100 Subject: [PATCH] New colors --- docs/css/bulma-docs.css | 1428 +++----- docs/css/bulma.css | 5887 +++++++++++++++++++++++++++++++++ docs/css/utilities.css | 175 + docs/css/variables.css | 0 package.json | 4 +- sass/utilities/variables.sass | 22 +- 6 files changed, 6487 insertions(+), 1029 deletions(-) create mode 100644 docs/css/bulma.css create mode 100644 docs/css/utilities.css create mode 100644 docs/css/variables.css diff --git a/docs/css/bulma-docs.css b/docs/css/bulma-docs.css index ca3c2d1f..c993eed5 100644 --- a/docs/css/bulma-docs.css +++ b/docs/css/bulma-docs.css @@ -165,25 +165,12 @@ input[type=button] { overflow: visible; } -@-webkit-keyframes spin-around { - from { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - to { - -webkit-transform: rotate(359deg); - transform: rotate(359deg); - } -} - @keyframes spin-around { from { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); + transform: rotate(0deg); } to { - -webkit-transform: rotate(359deg); - transform: rotate(359deg); + transform: rotate(359deg); } } @@ -232,10 +219,9 @@ body { } a { - color: #1fc8db; + color: #11e4c4; cursor: pointer; text-decoration: none; - -webkit-transition: none 86ms ease-out; transition: none 86ms ease-out; } @@ -245,7 +231,7 @@ a:hover { code { background-color: #f5f7fa; - color: #ed6c63; + color: #ff0f3f; font-size: 12px; font-weight: normal; padding: 1px 2px 2px; @@ -387,63 +373,47 @@ table th { } .is-flex { - display: -webkit-box; - display: -ms-flexbox; display: flex; } @media screen and (max-width: 768px) { .is-flex-mobile { - display: -webkit-box !important; - display: -ms-flexbox !important; display: flex !important; } } @media screen and (min-width: 769px) { .is-flex-tablet { - display: -webkit-box !important; - display: -ms-flexbox !important; display: flex !important; } } @media screen and (min-width: 769px) and (max-width: 979px) { .is-flex-tablet-only { - display: -webkit-box !important; - display: -ms-flexbox !important; display: flex !important; } } @media screen and (max-width: 979px) { .is-flex-touch { - display: -webkit-box !important; - display: -ms-flexbox !important; display: flex !important; } } @media screen and (min-width: 980px) { .is-flex-desktop { - display: -webkit-box !important; - display: -ms-flexbox !important; display: flex !important; } } @media screen and (min-width: 980px) and (max-width: 1179px) { .is-flex-desktop-only { - display: -webkit-box !important; - display: -ms-flexbox !important; display: flex !important; } } @media screen and (min-width: 1180px) { .is-flex-widescreen { - display: -webkit-box !important; - display: -ms-flexbox !important; display: flex !important; } } @@ -541,63 +511,47 @@ table th { } .is-inline-flex { - display: -webkit-inline-box; - display: -ms-inline-flexbox; display: inline-flex; } @media screen and (max-width: 768px) { .is-inline-flex-mobile { - display: -webkit-inline-box !important; - display: -ms-inline-flexbox !important; display: inline-flex !important; } } @media screen and (min-width: 769px) { .is-inline-flex-tablet { - display: -webkit-inline-box !important; - display: -ms-inline-flexbox !important; display: inline-flex !important; } } @media screen and (min-width: 769px) and (max-width: 979px) { .is-inline-flex-tablet-only { - display: -webkit-inline-box !important; - display: -ms-inline-flexbox !important; display: inline-flex !important; } } @media screen and (max-width: 979px) { .is-inline-flex-touch { - display: -webkit-inline-box !important; - display: -ms-inline-flexbox !important; display: inline-flex !important; } } @media screen and (min-width: 980px) { .is-inline-flex-desktop { - display: -webkit-inline-box !important; - display: -ms-inline-flexbox !important; display: inline-flex !important; } } @media screen and (min-width: 980px) and (max-width: 1179px) { .is-inline-flex-desktop-only { - display: -webkit-inline-box !important; - display: -ms-inline-flexbox !important; display: inline-flex !important; } } @media screen and (min-width: 1180px) { .is-inline-flex-widescreen { - display: -webkit-inline-box !important; - display: -ms-inline-flexbox !important; display: inline-flex !important; } } @@ -707,39 +661,31 @@ table th { } a.box:hover, a.box:focus { - box-shadow: 0 2px 3px rgba(17, 17, 17, 0.1), 0 0 0 1px #1fc8db; + box-shadow: 0 2px 3px rgba(17, 17, 17, 0.1), 0 0 0 1px #11e4c4; } a.box:active { - box-shadow: inset 0 1px 2px rgba(17, 17, 17, 0.2), 0 0 0 1px #1fc8db; + box-shadow: inset 0 1px 2px rgba(17, 17, 17, 0.2), 0 0 0 1px #11e4c4; } .button { -moz-appearance: none; -webkit-appearance: none; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; + align-items: center; background-color: white; border: 1px solid #d3d6db; border-radius: 3px; color: #222324; - display: -webkit-inline-box; - display: -ms-inline-flexbox; display: inline-flex; font-size: 14px; height: 32px; - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; + justify-content: flex-start; line-height: 24px; padding-left: 8px; padding-right: 8px; position: relative; vertical-align: top; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; padding-left: 10px; padding-right: 10px; text-align: center; @@ -751,7 +697,7 @@ a.box:active { } .button:active, .button:focus, .button.is-active { - border-color: #1fc8db; + border-color: #11e4c4; outline: none; } @@ -974,13 +920,13 @@ a.box:active { } .button.is-primary { - background-color: #1fc8db; + background-color: #11e4c4; border-color: transparent; color: white; } .button.is-primary:hover, .button.is-primary:focus, .button.is-primary.is-active { - background-color: #199fae; + background-color: #0eb49b; border-color: transparent; color: white; } @@ -991,7 +937,7 @@ a.box:active { .button.is-primary.is-inverted { background-color: white; - color: #1fc8db; + color: #11e4c4; } .button.is-primary.is-inverted:hover { @@ -1004,24 +950,24 @@ a.box:active { .button.is-primary.is-outlined { background-color: transparent; - border-color: #1fc8db; - color: #1fc8db; + border-color: #11e4c4; + color: #11e4c4; } .button.is-primary.is-outlined:hover, .button.is-primary.is-outlined:focus { - background-color: #1fc8db; - border-color: #1fc8db; + background-color: #11e4c4; + border-color: #11e4c4; color: white; } .button.is-info { - background-color: #42afe3; + background-color: #0f6bff; border-color: transparent; color: white; } .button.is-info:hover, .button.is-info:focus, .button.is-info.is-active { - background-color: #1f99d3; + background-color: #0054db; border-color: transparent; color: white; } @@ -1032,7 +978,7 @@ a.box:active { .button.is-info.is-inverted { background-color: white; - color: #42afe3; + color: #0f6bff; } .button.is-info.is-inverted:hover { @@ -1045,24 +991,24 @@ a.box:active { .button.is-info.is-outlined { background-color: transparent; - border-color: #42afe3; - color: #42afe3; + border-color: #0f6bff; + color: #0f6bff; } .button.is-info.is-outlined:hover, .button.is-info.is-outlined:focus { - background-color: #42afe3; - border-color: #42afe3; + background-color: #0f6bff; + border-color: #0f6bff; color: white; } .button.is-success { - background-color: #97cd76; + background-color: #20ee68; border-color: transparent; color: white; } .button.is-success:hover, .button.is-success:focus, .button.is-success.is-active { - background-color: #7bbf51; + background-color: #0fcc51; border-color: transparent; color: white; } @@ -1073,7 +1019,7 @@ a.box:active { .button.is-success.is-inverted { background-color: white; - color: #97cd76; + color: #20ee68; } .button.is-success.is-inverted:hover { @@ -1086,26 +1032,26 @@ a.box:active { .button.is-success.is-outlined { background-color: transparent; - border-color: #97cd76; - color: #97cd76; + border-color: #20ee68; + color: #20ee68; } .button.is-success.is-outlined:hover, .button.is-success.is-outlined:focus { - background-color: #97cd76; - border-color: #97cd76; + background-color: #20ee68; + border-color: #20ee68; color: white; } .button.is-warning { - background-color: #fce473; + background-color: #ffcf0f; border-color: transparent; - color: rgba(17, 17, 17, 0.5); + color: white; } .button.is-warning:hover, .button.is-warning:focus, .button.is-warning.is-active { - background-color: #fbda41; + background-color: #dbaf00; border-color: transparent; - color: rgba(17, 17, 17, 0.5); + color: white; } .button.is-warning:active { @@ -1113,38 +1059,38 @@ a.box:active { } .button.is-warning.is-inverted { - background-color: rgba(17, 17, 17, 0.5); - color: #fce473; + background-color: white; + color: #ffcf0f; } .button.is-warning.is-inverted:hover { - background-color: rgba(4, 4, 4, 0.5); + background-color: #f2f2f2; } .button.is-warning.is-loading:after { - border-color: transparent transparent rgba(17, 17, 17, 0.5) rgba(17, 17, 17, 0.5) !important; + border-color: transparent transparent white white !important; } .button.is-warning.is-outlined { background-color: transparent; - border-color: #fce473; - color: #fce473; + border-color: #ffcf0f; + color: #ffcf0f; } .button.is-warning.is-outlined:hover, .button.is-warning.is-outlined:focus { - background-color: #fce473; - border-color: #fce473; - color: rgba(17, 17, 17, 0.5); + background-color: #ffcf0f; + border-color: #ffcf0f; + color: white; } .button.is-danger { - background-color: #ed6c63; + background-color: #ff0f3f; border-color: transparent; color: white; } .button.is-danger:hover, .button.is-danger:focus, .button.is-danger.is-active { - background-color: #e84135; + background-color: #db002c; border-color: transparent; color: white; } @@ -1155,7 +1101,7 @@ a.box:active { .button.is-danger.is-inverted { background-color: white; - color: #ed6c63; + color: #ff0f3f; } .button.is-danger.is-inverted:hover { @@ -1168,13 +1114,13 @@ a.box:active { .button.is-danger.is-outlined { background-color: transparent; - border-color: #ed6c63; - color: #ed6c63; + border-color: #ff0f3f; + color: #ff0f3f; } .button.is-danger.is-outlined:hover, .button.is-danger.is-outlined:focus { - background-color: #ed6c63; - border-color: #ed6c63; + background-color: #ff0f3f; + border-color: #ff0f3f; color: white; } @@ -1218,8 +1164,6 @@ a.box:active { } .button.is-fullwidth { - display: -webkit-box; - display: -ms-flexbox; display: flex; width: 100%; } @@ -1243,11 +1187,11 @@ a.box:active { } .content a:not(.button):visited { - color: #847bb9; + color: #b86bff; } .content a:not(.button):hover { - border-bottom-color: #1fc8db; + border-bottom-color: #11e4c4; } .content li + li { @@ -1351,21 +1295,15 @@ a.box:active { .input, .textarea { -moz-appearance: none; -webkit-appearance: none; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; + align-items: center; background-color: white; border: 1px solid #d3d6db; border-radius: 3px; color: #222324; - display: -webkit-inline-box; - display: -ms-inline-flexbox; display: inline-flex; font-size: 14px; height: 32px; - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; + justify-content: flex-start; line-height: 24px; padding-left: 8px; padding-right: 8px; @@ -1381,7 +1319,7 @@ a.box:active { } .input:active, .textarea:active, .input:focus, .textarea:focus, .input.is-active, .is-active.textarea { - border-color: #1fc8db; + border-color: #11e4c4; outline: none; } @@ -1425,23 +1363,23 @@ a.box:active { } .input.is-primary, .is-primary.textarea { - border-color: #1fc8db; + border-color: #11e4c4; } .input.is-info, .is-info.textarea { - border-color: #42afe3; + border-color: #0f6bff; } .input.is-success, .is-success.textarea { - border-color: #97cd76; + border-color: #20ee68; } .input.is-warning, .is-warning.textarea { - border-color: #fce473; + border-color: #ffcf0f; } .input.is-danger, .is-danger.textarea { - border-color: #ed6c63; + border-color: #ff0f3f; } .input[type="search"], [type="search"].textarea { @@ -1533,21 +1471,15 @@ a.box:active { .select select { -moz-appearance: none; -webkit-appearance: none; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; + align-items: center; background-color: white; border: 1px solid #d3d6db; border-radius: 3px; color: #222324; - display: -webkit-inline-box; - display: -ms-inline-flexbox; display: inline-flex; font-size: 14px; height: 32px; - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; + justify-content: flex-start; line-height: 24px; padding-left: 8px; padding-right: 8px; @@ -1564,7 +1496,7 @@ a.box:active { } .select select:active, .select select:focus, .select select.is-active { - border-color: #1fc8db; + border-color: #11e4c4; outline: none; } @@ -1608,23 +1540,23 @@ a.box:active { } .select select.is-primary { - border-color: #1fc8db; + border-color: #11e4c4; } .select select.is-info { - border-color: #42afe3; + border-color: #0f6bff; } .select select.is-success { - border-color: #97cd76; + border-color: #20ee68; } .select select.is-warning { - border-color: #fce473; + border-color: #ffcf0f; } .select select.is-danger { - border-color: #ed6c63; + border-color: #ff0f3f; } .select select:hover { @@ -1644,7 +1576,7 @@ a.box:active { } .select:after { - border: 1px solid #1fc8db; + border: 1px solid #11e4c4; border-right: 0; border-top: 0; content: " "; @@ -1652,8 +1584,7 @@ a.box:active { height: 7px; pointer-events: none; position: absolute; - -webkit-transform: rotate(-45deg); - transform: rotate(-45deg); + transform: rotate(-45deg); width: 7px; margin-top: -6px; right: 16px; @@ -1737,23 +1668,23 @@ a.box:active { } .help.is-primary { - color: #1fc8db; + color: #11e4c4; } .help.is-info { - color: #42afe3; + color: #0f6bff; } .help.is-success { - color: #97cd76; + color: #20ee68; } .help.is-warning { - color: #fce473; + color: #ffcf0f; } .help.is-danger { - color: #ed6c63; + color: #ff0f3f; } @media screen and (max-width: 768px) { @@ -1764,13 +1695,9 @@ a.box:active { @media screen and (min-width: 769px) { .control-label { - -ms-flex-preferred-size: 0; - flex-basis: 0; - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 0; - flex-shrink: 0; + flex-basis: 0; + flex-grow: 1; + flex-shrink: 0; margin-right: 20px; padding-top: 7px; text-align: right; @@ -1787,12 +1714,8 @@ a.box:active { } .control.has-addons { - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; + justify-content: flex-start; } .control.has-addons .button, @@ -1853,34 +1776,24 @@ a.box:active { .control.has-addons .input.is-expanded, .control.has-addons .is-expanded.textarea, .control.has-addons .select.is-expanded { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 0; - flex-shrink: 0; + flex-grow: 1; + flex-shrink: 0; } .control.has-addons.has-addons-centered { - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; } .control.has-addons.has-addons-right { - -webkit-box-pack: end; - -ms-flex-pack: end; - justify-content: flex-end; + justify-content: flex-end; } .control.has-addons.has-addons-fullwidth .button, .control.has-addons.has-addons-fullwidth .input, .control.has-addons.has-addons-fullwidth .textarea, .control.has-addons.has-addons-fullwidth .select { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 0; - flex-shrink: 0; + flex-grow: 1; + flex-shrink: 0; } .control.has-icon > .fa { @@ -1982,12 +1895,8 @@ a.box:active { } .control.is-grouped { - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; + justify-content: flex-start; } .control.is-grouped > .control:not(:last-child) { @@ -1996,42 +1905,27 @@ a.box:active { } .control.is-grouped > .control.is-expanded { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 0; - flex-shrink: 0; + flex-grow: 1; + flex-shrink: 0; } .control.is-grouped.is-grouped-centered { - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; } .control.is-grouped.is-grouped-right { - -webkit-box-pack: end; - -ms-flex-pack: end; - justify-content: flex-end; + justify-content: flex-end; } @media screen and (min-width: 769px) { .control.is-horizontal { - display: -webkit-box; - display: -ms-flexbox; display: flex; } .control.is-horizontal > .control { - display: -webkit-box; - display: -ms-flexbox; display: flex; - -ms-flex-preferred-size: 0; - flex-basis: 0; - -webkit-box-flex: 5; - -ms-flex-positive: 5; - flex-grow: 5; - -ms-flex-negative: 1; - flex-shrink: 1; + flex-basis: 0; + flex-grow: 5; + flex-shrink: 1; } } @@ -2162,27 +2056,27 @@ a.box:active { } .notification.is-primary { - background-color: #1fc8db; + background-color: #11e4c4; color: white; } .notification.is-info { - background-color: #42afe3; + background-color: #0f6bff; color: white; } .notification.is-success { - background-color: #97cd76; + background-color: #20ee68; color: white; } .notification.is-warning { - background-color: #fce473; - color: rgba(17, 17, 17, 0.5); + background-color: #ffcf0f; + color: white; } .notification.is-danger { - background-color: #ed6c63; + background-color: #ff0f3f; color: white; } @@ -2243,43 +2137,43 @@ a.box:active { } .progress.is-primary::-webkit-progress-value { - background-color: #1fc8db; + background-color: #11e4c4; } .progress.is-primary::-moz-progress-bar { - background-color: #1fc8db; + background-color: #11e4c4; } .progress.is-info::-webkit-progress-value { - background-color: #42afe3; + background-color: #0f6bff; } .progress.is-info::-moz-progress-bar { - background-color: #42afe3; + background-color: #0f6bff; } .progress.is-success::-webkit-progress-value { - background-color: #97cd76; + background-color: #20ee68; } .progress.is-success::-moz-progress-bar { - background-color: #97cd76; + background-color: #20ee68; } .progress.is-warning::-webkit-progress-value { - background-color: #fce473; + background-color: #ffcf0f; } .progress.is-warning::-moz-progress-bar { - background-color: #fce473; + background-color: #ffcf0f; } .progress.is-danger::-webkit-progress-value { - background-color: #ed6c63; + background-color: #ff0f3f; } .progress.is-danger::-moz-progress-bar { - background-color: #ed6c63; + background-color: #ff0f3f; } .progress.is-small { @@ -2351,7 +2245,7 @@ a.box:active { .table td.is-link > a:hover, .table th.is-link > a:hover { - background-color: #1fc8db; + background-color: #11e4c4; color: white; } @@ -2659,13 +2553,11 @@ a.box:active { } .delete:before, .modal-close:before { - -webkit-transform: rotate(45deg); - transform: rotate(45deg); + transform: rotate(45deg); } .delete:after, .modal-close:after { - -webkit-transform: rotate(-45deg); - transform: rotate(-45deg); + transform: rotate(-45deg); } .delete:hover, .modal-close:hover { @@ -2748,12 +2640,8 @@ a.box:active { margin-left: -7px; position: absolute; top: 50%; - -webkit-transition: none 86ms ease-out; transition: none 86ms ease-out; - -webkit-transition-property: background, left, opacity, -webkit-transform; - transition-property: background, left, opacity, -webkit-transform; transition-property: background, left, opacity, transform; - transition-property: background, left, opacity, transform, -webkit-transform; width: 15px; } @@ -2774,15 +2662,13 @@ a.box:active { } .hamburger.is-active span, .is-active.nav-toggle span { - background-color: #1fc8db; + background-color: #11e4c4; } .hamburger.is-active span:nth-child(1), .is-active.nav-toggle span:nth-child(1) { margin-left: -5px; - -webkit-transform: rotate(45deg); - transform: rotate(45deg); - -webkit-transform-origin: left top; - transform-origin: left top; + transform: rotate(45deg); + transform-origin: left top; } .hamburger.is-active span:nth-child(2), .is-active.nav-toggle span:nth-child(2) { @@ -2791,10 +2677,8 @@ a.box:active { .hamburger.is-active span:nth-child(3), .is-active.nav-toggle span:nth-child(3) { margin-left: -5px; - -webkit-transform: rotate(-45deg); - transform: rotate(-45deg); - -webkit-transform-origin: left bottom; - transform-origin: left bottom; + transform: rotate(-45deg); + transform-origin: left bottom; } .heading { @@ -2819,8 +2703,7 @@ a.box:active { } .loader, .button.is-loading:after, .control.is-loading:after { - -webkit-animation: spin-around 500ms infinite linear; - animation: spin-around 500ms infinite linear; + animation: spin-around 500ms infinite linear; border: 2px solid #d3d6db; border-radius: 290486px; border-right-color: transparent; @@ -2841,20 +2724,14 @@ a.box:active { } .tag { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; + align-items: center; background-color: #f5f7fa; border-radius: 290486px; color: #69707a; - display: -webkit-inline-box; - display: -ms-inline-flexbox; display: inline-flex; font-size: 12px; height: 24px; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; line-height: 16px; padding-left: 10px; padding-right: 10px; @@ -2888,27 +2765,27 @@ a.box:active { } .tag.is-primary { - background-color: #1fc8db; + background-color: #11e4c4; color: white; } .tag.is-info { - background-color: #42afe3; + background-color: #0f6bff; color: white; } .tag.is-success { - background-color: #97cd76; + background-color: #20ee68; color: white; } .tag.is-warning { - background-color: #fce473; - color: rgba(17, 17, 17, 0.5); + background-color: #ffcf0f; + color: white; } .tag.is-danger { - background-color: #ed6c63; + background-color: #ff0f3f; color: white; } @@ -2949,42 +2826,26 @@ a.box:active { } .card-header { - -webkit-box-align: stretch; - -ms-flex-align: stretch; - align-items: stretch; + align-items: stretch; box-shadow: 0 1px 2px rgba(17, 17, 17, 0.1); - display: -webkit-box; - display: -ms-flexbox; display: flex; min-height: 40px; } .card-header-title { - -webkit-box-align: start; - -ms-flex-align: start; - align-items: flex-start; + align-items: flex-start; color: #222324; - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; + flex-grow: 1; font-weight: bold; padding: 10px; } .card-header-icon { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; + align-items: center; cursor: pointer; - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; width: 40px; } @@ -3003,27 +2864,15 @@ a.box:active { .card-footer { border-top: 1px solid #d3d6db; - -webkit-box-align: stretch; - -ms-flex-align: stretch; - align-items: stretch; - display: -webkit-box; - display: -ms-flexbox; + align-items: stretch; display: flex; } .card-footer-item { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -ms-flexbox; + align-items: center; display: flex; - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + flex-grow: 1; + justify-content: center; padding: 10px; } @@ -3053,61 +2902,43 @@ a.box:active { } .column { - -ms-flex-preferred-size: 0; - flex-basis: 0; - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 1; - flex-shrink: 1; + flex-basis: 0; + flex-grow: 1; + flex-shrink: 1; padding: 10px; } .columns.is-mobile > .column.is-narrow { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; } .columns.is-mobile > .column.is-full { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 100%; } .columns.is-mobile > .column.is-three-quarters { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 75%; } .columns.is-mobile > .column.is-two-thirds { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 66.6666%; } .columns.is-mobile > .column.is-half { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 50%; } .columns.is-mobile > .column.is-one-third { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 33.3333%; } .columns.is-mobile > .column.is-one-quarter { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 25%; } @@ -3132,9 +2963,7 @@ a.box:active { } .columns.is-mobile > .column.is-1 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 8.33333%; } @@ -3143,9 +2972,7 @@ a.box:active { } .columns.is-mobile > .column.is-2 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 16.66667%; } @@ -3154,9 +2981,7 @@ a.box:active { } .columns.is-mobile > .column.is-3 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 25%; } @@ -3165,9 +2990,7 @@ a.box:active { } .columns.is-mobile > .column.is-4 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 33.33333%; } @@ -3176,9 +2999,7 @@ a.box:active { } .columns.is-mobile > .column.is-5 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 41.66667%; } @@ -3187,9 +3008,7 @@ a.box:active { } .columns.is-mobile > .column.is-6 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 50%; } @@ -3198,9 +3017,7 @@ a.box:active { } .columns.is-mobile > .column.is-7 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 58.33333%; } @@ -3209,9 +3026,7 @@ a.box:active { } .columns.is-mobile > .column.is-8 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 66.66667%; } @@ -3220,9 +3035,7 @@ a.box:active { } .columns.is-mobile > .column.is-9 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 75%; } @@ -3231,9 +3044,7 @@ a.box:active { } .columns.is-mobile > .column.is-10 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 83.33333%; } @@ -3242,9 +3053,7 @@ a.box:active { } .columns.is-mobile > .column.is-11 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 91.66667%; } @@ -3253,9 +3062,7 @@ a.box:active { } .columns.is-mobile > .column.is-12 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 100%; } @@ -3265,44 +3072,30 @@ a.box:active { @media screen and (max-width: 768px) { .column.is-narrow-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; } .column.is-full-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 100%; } .column.is-three-quarters-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 75%; } .column.is-two-thirds-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 66.6666%; } .column.is-half-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 50%; } .column.is-one-third-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 33.3333%; } .column.is-one-quarter-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 25%; } .column.is-offset-three-quarters-mobile { @@ -3321,108 +3114,84 @@ a.box:active { margin-left: 25%; } .column.is-1-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 8.33333%; } .column.is-offset-1-mobile { margin-left: 8.33333%; } .column.is-2-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 16.66667%; } .column.is-offset-2-mobile { margin-left: 16.66667%; } .column.is-3-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 25%; } .column.is-offset-3-mobile { margin-left: 25%; } .column.is-4-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 33.33333%; } .column.is-offset-4-mobile { margin-left: 33.33333%; } .column.is-5-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 41.66667%; } .column.is-offset-5-mobile { margin-left: 41.66667%; } .column.is-6-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 50%; } .column.is-offset-6-mobile { margin-left: 50%; } .column.is-7-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 58.33333%; } .column.is-offset-7-mobile { margin-left: 58.33333%; } .column.is-8-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 66.66667%; } .column.is-offset-8-mobile { margin-left: 66.66667%; } .column.is-9-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 75%; } .column.is-offset-9-mobile { margin-left: 75%; } .column.is-10-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 83.33333%; } .column.is-offset-10-mobile { margin-left: 83.33333%; } .column.is-11-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 91.66667%; } .column.is-offset-11-mobile { margin-left: 91.66667%; } .column.is-12-mobile { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 100%; } .column.is-offset-12-mobile { @@ -3432,44 +3201,30 @@ a.box:active { @media screen and (min-width: 769px) { .column.is-narrow, .column.is-narrow-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; } .column.is-full, .column.is-full-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 100%; } .column.is-three-quarters, .column.is-three-quarters-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 75%; } .column.is-two-thirds, .column.is-two-thirds-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 66.6666%; } .column.is-half, .column.is-half-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 50%; } .column.is-one-third, .column.is-one-third-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 33.3333%; } .column.is-one-quarter, .column.is-one-quarter-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 25%; } .column.is-offset-three-quarters, .column.is-offset-three-quarters-tablet { @@ -3488,108 +3243,84 @@ a.box:active { margin-left: 25%; } .column.is-1, .column.is-1-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 8.33333%; } .column.is-offset-1, .column.is-offset-1-tablet { margin-left: 8.33333%; } .column.is-2, .column.is-2-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 16.66667%; } .column.is-offset-2, .column.is-offset-2-tablet { margin-left: 16.66667%; } .column.is-3, .column.is-3-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 25%; } .column.is-offset-3, .column.is-offset-3-tablet { margin-left: 25%; } .column.is-4, .column.is-4-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 33.33333%; } .column.is-offset-4, .column.is-offset-4-tablet { margin-left: 33.33333%; } .column.is-5, .column.is-5-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 41.66667%; } .column.is-offset-5, .column.is-offset-5-tablet { margin-left: 41.66667%; } .column.is-6, .column.is-6-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 50%; } .column.is-offset-6, .column.is-offset-6-tablet { margin-left: 50%; } .column.is-7, .column.is-7-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 58.33333%; } .column.is-offset-7, .column.is-offset-7-tablet { margin-left: 58.33333%; } .column.is-8, .column.is-8-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 66.66667%; } .column.is-offset-8, .column.is-offset-8-tablet { margin-left: 66.66667%; } .column.is-9, .column.is-9-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 75%; } .column.is-offset-9, .column.is-offset-9-tablet { margin-left: 75%; } .column.is-10, .column.is-10-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 83.33333%; } .column.is-offset-10, .column.is-offset-10-tablet { margin-left: 83.33333%; } .column.is-11, .column.is-11-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 91.66667%; } .column.is-offset-11, .column.is-offset-11-tablet { margin-left: 91.66667%; } .column.is-12, .column.is-12-tablet { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 100%; } .column.is-offset-12, .column.is-offset-12-tablet { @@ -3599,44 +3330,30 @@ a.box:active { @media screen and (min-width: 980px) { .column.is-narrow-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; } .column.is-full-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 100%; } .column.is-three-quarters-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 75%; } .column.is-two-thirds-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 66.6666%; } .column.is-half-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 50%; } .column.is-one-third-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 33.3333%; } .column.is-one-quarter-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 25%; } .column.is-offset-three-quarters-desktop { @@ -3655,108 +3372,84 @@ a.box:active { margin-left: 25%; } .column.is-1-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 8.33333%; } .column.is-offset-1-desktop { margin-left: 8.33333%; } .column.is-2-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 16.66667%; } .column.is-offset-2-desktop { margin-left: 16.66667%; } .column.is-3-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 25%; } .column.is-offset-3-desktop { margin-left: 25%; } .column.is-4-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 33.33333%; } .column.is-offset-4-desktop { margin-left: 33.33333%; } .column.is-5-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 41.66667%; } .column.is-offset-5-desktop { margin-left: 41.66667%; } .column.is-6-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 50%; } .column.is-offset-6-desktop { margin-left: 50%; } .column.is-7-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 58.33333%; } .column.is-offset-7-desktop { margin-left: 58.33333%; } .column.is-8-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 66.66667%; } .column.is-offset-8-desktop { margin-left: 66.66667%; } .column.is-9-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 75%; } .column.is-offset-9-desktop { margin-left: 75%; } .column.is-10-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 83.33333%; } .column.is-offset-10-desktop { margin-left: 83.33333%; } .column.is-11-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 91.66667%; } .column.is-offset-11-desktop { margin-left: 91.66667%; } .column.is-12-desktop { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 100%; } .column.is-offset-12-desktop { @@ -3766,44 +3459,30 @@ a.box:active { @media screen and (min-width: 1180px) { .column.is-narrow-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; } .column.is-full-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 100%; } .column.is-three-quarters-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 75%; } .column.is-two-thirds-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 66.6666%; } .column.is-half-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 50%; } .column.is-one-third-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 33.3333%; } .column.is-one-quarter-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 25%; } .column.is-offset-three-quarters-widescreen { @@ -3822,108 +3501,84 @@ a.box:active { margin-left: 25%; } .column.is-1-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 8.33333%; } .column.is-offset-1-widescreen { margin-left: 8.33333%; } .column.is-2-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 16.66667%; } .column.is-offset-2-widescreen { margin-left: 16.66667%; } .column.is-3-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 25%; } .column.is-offset-3-widescreen { margin-left: 25%; } .column.is-4-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 33.33333%; } .column.is-offset-4-widescreen { margin-left: 33.33333%; } .column.is-5-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 41.66667%; } .column.is-offset-5-widescreen { margin-left: 41.66667%; } .column.is-6-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 50%; } .column.is-offset-6-widescreen { margin-left: 50%; } .column.is-7-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 58.33333%; } .column.is-offset-7-widescreen { margin-left: 58.33333%; } .column.is-8-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 66.66667%; } .column.is-offset-8-widescreen { margin-left: 66.66667%; } .column.is-9-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 75%; } .column.is-offset-9-widescreen { margin-left: 75%; } .column.is-10-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 83.33333%; } .column.is-offset-10-widescreen { margin-left: 83.33333%; } .column.is-11-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 91.66667%; } .column.is-offset-11-widescreen { margin-left: 91.66667%; } .column.is-12-widescreen { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 100%; } .column.is-offset-12-widescreen { @@ -3946,9 +3601,7 @@ a.box:active { } .columns.is-centered { - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; } .columns.is-gapless { @@ -3972,8 +3625,7 @@ a.box:active { @media screen and (min-width: 769px) { .columns.is-grid { - -ms-flex-wrap: wrap; - flex-wrap: wrap; + flex-wrap: wrap; } .columns.is-grid > .column { max-width: 33.3333%; @@ -3986,53 +3638,34 @@ a.box:active { } .columns.is-mobile { - display: -webkit-box; - display: -ms-flexbox; display: flex; } .columns.is-multiline { - -ms-flex-wrap: wrap; - flex-wrap: wrap; + flex-wrap: wrap; } .columns.is-vcentered { - -webkit-box-align: center; - -ms-flex-align: center; - -ms-grid-row-align: center; - align-items: center; + align-items: center; } @media screen and (min-width: 769px) { .columns:not(.is-desktop) { - display: -webkit-box; - display: -ms-flexbox; display: flex; } } @media screen and (min-width: 980px) { .columns.is-desktop { - display: -webkit-box; - display: -ms-flexbox; display: flex; } } .tile { - -webkit-box-align: stretch; - -ms-flex-align: stretch; - -ms-grid-row-align: stretch; - align-items: stretch; - -ms-flex-preferred-size: auto; - flex-basis: auto; - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 1; - flex-shrink: 1; - min-height: -webkit-min-content; - min-height: -moz-min-content; + align-items: stretch; + flex-basis: auto; + flex-grow: 1; + flex-shrink: 1; min-height: min-content; } @@ -4059,10 +3692,7 @@ a.box:active { } .tile.is-vertical { - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; + flex-direction: column; } .tile.is-vertical > .tile.is-child:not(:last-child) { @@ -4071,80 +3701,54 @@ a.box:active { @media screen and (min-width: 769px) { .tile:not(.is-child) { - display: -webkit-box; - display: -ms-flexbox; display: flex; } .tile.is-1 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 8.33333%; } .tile.is-2 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 16.66667%; } .tile.is-3 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 25%; } .tile.is-4 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 33.33333%; } .tile.is-5 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 41.66667%; } .tile.is-6 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 50%; } .tile.is-7 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 58.33333%; } .tile.is-8 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 66.66667%; } .tile.is-9 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 75%; } .tile.is-10 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 83.33333%; } .tile.is-11 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 91.66667%; } .tile.is-12 { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; + flex: none; width: 100%; } } @@ -4392,9 +3996,7 @@ a.box:active { .level-left .level-item.is-flexible, .level-right .level-item.is-flexible { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; + flex-grow: 1; } @media screen and (max-width: 768px) { @@ -4405,37 +4007,22 @@ a.box:active { @media screen and (min-width: 769px) { .level-left { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -ms-flexbox; + align-items: center; display: flex; } } @media screen and (min-width: 769px) { .level-right { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -ms-flexbox; + align-items: center; display: flex; - -webkit-box-pack: end; - -ms-flex-pack: end; - justify-content: flex-end; + justify-content: flex-end; } } .level { - -webkit-box-align: center; - -ms-flex-align: center; - -ms-grid-row-align: center; - align-items: center; - -webkit-box-pack: justify; - -ms-flex-pack: justify; - justify-content: space-between; + align-items: center; + justify-content: space-between; } .level code { @@ -4448,8 +4035,6 @@ a.box:active { } .level.is-mobile { - display: -webkit-box; - display: -ms-flexbox; display: flex; } @@ -4458,21 +4043,15 @@ a.box:active { } .level.is-mobile > .level-item:not(.is-narrow) { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; + flex-grow: 1; } @media screen and (min-width: 769px) { .level { - display: -webkit-box; - display: -ms-flexbox; display: flex; } .level > .level-item:not(.is-narrow) { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; + flex-grow: 1; } } @@ -4510,20 +4089,13 @@ a.box:active { } .media-content { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 1; - flex-shrink: 1; + flex-grow: 1; + flex-shrink: 1; text-align: left; } .media { - -webkit-box-align: start; - -ms-flex-align: start; - align-items: flex-start; - display: -webkit-box; - display: -ms-flexbox; + align-items: flex-start; display: flex; text-align: left; } @@ -4534,8 +4106,6 @@ a.box:active { .media .media { border-top: 1px solid rgba(211, 214, 219, 0.5); - display: -webkit-box; - display: -ms-flexbox; display: flex; padding-top: 10px; } @@ -4584,11 +4154,11 @@ a.box:active { .menu-list a:hover { background-color: #f5f7fa; - color: #1fc8db; + color: #11e4c4; } .menu-list a.is-active { - background-color: #1fc8db; + background-color: #11e4c4; color: white; } @@ -4698,44 +4268,44 @@ a.box:active { } .message.is-primary { - background-color: #edfbfc; + background-color: #ecfefb; } .message.is-primary .message-header { - background-color: #1fc8db; + background-color: #11e4c4; color: white; } .message.is-primary .message-body { - border-color: #1fc8db; + border-color: #11e4c4; color: gray; } .message.is-info { - background-color: #edf7fc; + background-color: #ebf2ff; } .message.is-info .message-header { - background-color: #42afe3; + background-color: #0f6bff; color: white; } .message.is-info .message-body { - border-color: #42afe3; + border-color: #0f6bff; color: gray; } .message.is-success { - background-color: #f4faf0; + background-color: #ecfef2; } .message.is-success .message-header { - background-color: #97cd76; + background-color: #20ee68; color: white; } .message.is-success .message-body { - border-color: #97cd76; + border-color: #20ee68; color: gray; } @@ -4744,26 +4314,26 @@ a.box:active { } .message.is-warning .message-header { - background-color: #fce473; - color: rgba(17, 17, 17, 0.5); + background-color: #ffcf0f; + color: white; } .message.is-warning .message-body { - border-color: #fce473; - color: #666666; + border-color: #ffcf0f; + color: gray; } .message.is-danger { - background-color: #fdeeed; + background-color: #ffebef; } .message.is-danger .message-header { - background-color: #ed6c63; + background-color: #ff0f3f; color: white; } .message.is-danger .message-body { - border-color: #ed6c63; + border-color: #ff0f3f; color: gray; } @@ -4802,31 +4372,19 @@ a.box:active { } .modal-card { - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; + flex-direction: column; max-height: calc(100vh - 40px); overflow: hidden; } .modal-card-head, .modal-card-foot { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; + align-items: center; background-color: #f5f7fa; - display: -webkit-box; - display: -ms-flexbox; display: flex; - -ms-flex-negative: 0; - flex-shrink: 0; - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; + flex-shrink: 0; + justify-content: flex-start; padding: 20px; position: relative; } @@ -4839,11 +4397,8 @@ a.box:active { .modal-card-title { color: #222324; - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 0; - flex-shrink: 0; + flex-grow: 1; + flex-shrink: 0; font-size: 24px; line-height: 1; } @@ -4860,11 +4415,8 @@ a.box:active { .modal-card-body { background-color: #fff; - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 1; - flex-shrink: 1; + flex-grow: 1; + flex-shrink: 1; overflow: auto; padding: 20px; } @@ -4875,22 +4427,15 @@ a.box:active { position: absolute; right: 0; top: 0; - -webkit-box-align: center; - -ms-flex-align: center; - -ms-grid-row-align: center; - align-items: center; + align-items: center; display: none; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; overflow: hidden; position: fixed; z-index: 1986; } .modal.is-active { - display: -webkit-box; - display: -ms-flexbox; display: flex; } @@ -4901,24 +4446,15 @@ a.box:active { } .nav-item { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -ms-flexbox; + align-items: center; display: flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; padding: 10px; } .nav-item a { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 0; - flex-shrink: 0; + flex-grow: 1; + flex-shrink: 0; } .nav-item img { @@ -4939,9 +4475,7 @@ a.box:active { @media screen and (max-width: 768px) { .nav-item { - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; + justify-content: flex-start; } } @@ -4970,15 +4504,15 @@ a.nav-item.is-tab { .nav-item a.is-tab:hover, a.nav-item.is-tab:hover { - border-bottom: 1px solid #1fc8db; + border-bottom: 1px solid #11e4c4; border-top: 1px solid transparent; } .nav-item a.is-tab.is-active, a.nav-item.is-tab.is-active { - border-bottom: 3px solid #1fc8db; + border-bottom: 3px solid #11e4c4; border-top: 3px solid transparent; - color: #1fc8db; + color: #11e4c4; } @media screen and (max-width: 768px) { @@ -5007,69 +4541,39 @@ a.nav-item.is-tab.is-active { } .nav-left { - -webkit-box-align: stretch; - -ms-flex-align: stretch; - align-items: stretch; - display: -webkit-box; - display: -ms-flexbox; + align-items: stretch; display: flex; - -ms-flex-preferred-size: 0; - flex-basis: 0; - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 0; - flex-shrink: 0; - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; + flex-basis: 0; + flex-grow: 1; + flex-shrink: 0; + justify-content: flex-start; overflow: hidden; overflow-x: auto; white-space: nowrap; } .nav-center { - -webkit-box-align: stretch; - -ms-flex-align: stretch; - align-items: stretch; - display: -webkit-box; - display: -ms-flexbox; + align-items: stretch; display: flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; margin-left: auto; margin-right: auto; } @media screen and (min-width: 769px) { .nav-right { - -webkit-box-align: stretch; - -ms-flex-align: stretch; - align-items: stretch; - display: -webkit-box; - display: -ms-flexbox; + align-items: stretch; display: flex; - -ms-flex-preferred-size: 0; - flex-basis: 0; - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 0; - flex-shrink: 0; - -webkit-box-pack: end; - -ms-flex-pack: end; - justify-content: flex-end; + flex-basis: 0; + flex-grow: 1; + flex-shrink: 0; + justify-content: flex-end; } } .nav { - -webkit-box-align: stretch; - -ms-flex-align: stretch; - align-items: stretch; + align-items: stretch; background-color: #fff; - display: -webkit-box; - display: -ms-flexbox; display: flex; min-height: 50px; position: relative; @@ -5078,11 +4582,7 @@ a.nav-item.is-tab.is-active { } .nav > .container { - -webkit-box-align: stretch; - -ms-flex-align: stretch; - align-items: stretch; - display: -webkit-box; - display: -ms-flexbox; + align-items: stretch; display: flex; min-height: 50px; width: 100%; @@ -5116,15 +4616,9 @@ a.nav-item.is-tab.is-active { } .pagination { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -ms-flexbox; + align-items: center; display: flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; text-align: center; } @@ -5145,26 +4639,16 @@ a.nav-item.is-tab.is-active { } .pagination ul { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -ms-flexbox; + align-items: center; display: flex; - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 0; - flex-shrink: 0; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + flex-grow: 1; + flex-shrink: 0; + justify-content: center; } @media screen and (max-width: 768px) { .pagination { - -ms-flex-wrap: wrap; - flex-wrap: wrap; + flex-wrap: wrap; } .pagination > a { width: calc(50% - 5px); @@ -5173,11 +4657,8 @@ a.nav-item.is-tab.is-active { margin-left: 10px; } .pagination li { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 0; - flex-shrink: 0; + flex-grow: 1; + flex-shrink: 0; } .pagination ul { margin-top: 10px; @@ -5186,9 +4667,7 @@ a.nav-item.is-tab.is-active { @media screen and (min-width: 769px) { .pagination > a:not(:first-child) { - -webkit-box-ordinal-group: 2; - -ms-flex-order: 1; - order: 1; + order: 1; } } @@ -5225,18 +4704,14 @@ a.nav-item.is-tab.is-active { } .panel-list a:hover { - color: #1fc8db; + color: #11e4c4; } .panel-tabs { - display: -webkit-box; - display: -ms-flexbox; display: flex; font-size: 11px; padding: 5px 10px 0; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; } .panel-tabs a { @@ -5279,15 +4754,9 @@ a.panel-block:hover { } .tabs { - -webkit-box-align: stretch; - -ms-flex-align: stretch; - align-items: stretch; - display: -webkit-box; - display: -ms-flexbox; + align-items: stretch; display: flex; - -webkit-box-pack: justify; - -ms-flex-pack: justify; - justify-content: space-between; + justify-content: space-between; line-height: 24px; overflow: hidden; overflow-x: auto; @@ -5295,17 +4764,11 @@ a.panel-block:hover { } .tabs a { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; + align-items: center; border-bottom: 1px solid #d3d6db; color: #69707a; - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; margin-bottom: -1px; padding: 6px 12px; vertical-align: top; @@ -5321,26 +4784,17 @@ a.panel-block:hover { } .tabs li.is-active a { - border-bottom-color: #1fc8db; - color: #1fc8db; + border-bottom-color: #11e4c4; + color: #11e4c4; } .tabs ul { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; + align-items: center; border-bottom: 1px solid #d3d6db; - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 0; - flex-shrink: 0; - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; + flex-grow: 1; + flex-shrink: 0; + justify-content: flex-start; } .tabs ul.is-left { @@ -5348,20 +4802,14 @@ a.panel-block:hover { } .tabs ul.is-center { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + flex: none; + justify-content: center; padding-left: 10px; padding-right: 10px; } .tabs ul.is-right { - -webkit-box-pack: end; - -ms-flex-pack: end; - justify-content: flex-end; + justify-content: flex-end; padding-left: 10px; } @@ -5374,15 +4822,11 @@ a.panel-block:hover { } .tabs.is-centered ul { - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; } .tabs.is-right ul { - -webkit-box-pack: end; - -ms-flex-pack: end; - justify-content: flex-end; + justify-content: flex-end; } .tabs.is-boxed a { @@ -5404,11 +4848,8 @@ a.panel-block:hover { } .tabs.is-fullwidth li { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 0; - flex-shrink: 0; + flex-grow: 1; + flex-shrink: 0; } .tabs.is-toggle a { @@ -5438,8 +4879,8 @@ a.panel-block:hover { } .tabs.is-toggle li.is-active a { - background-color: #1fc8db; - border-color: #1fc8db; + background-color: #11e4c4; + border-color: #11e4c4; color: white; z-index: 1; } @@ -5502,8 +4943,7 @@ a.panel-block:hover { min-width: 100%; position: absolute; top: 50%; - -webkit-transform: translate3d(-50%, -50%, 0); - transform: translate3d(-50%, -50%, 0); + transform: translate3d(-50%, -50%, 0); } .hero-video.is-transparent { @@ -5522,8 +4962,6 @@ a.panel-block:hover { @media screen and (max-width: 768px) { .hero-buttons .button { - display: -webkit-box; - display: -ms-flexbox; display: flex; } .hero-buttons .button:not(:last-child) { @@ -5533,12 +4971,8 @@ a.panel-block:hover { @media screen and (min-width: 769px) { .hero-buttons { - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; } .hero-buttons .button:not(:last-child) { margin-right: 20px; @@ -5547,16 +4981,12 @@ a.panel-block:hover { .hero-head, .hero-foot { - -ms-flex-negative: 0; - flex-shrink: 0; + flex-shrink: 0; } .hero-body { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 0; - flex-shrink: 0; + flex-grow: 1; + flex-shrink: 0; padding: 40px 20px; } @@ -5568,20 +4998,11 @@ a.panel-block:hover { } .hero { - -webkit-box-align: stretch; - -ms-flex-align: stretch; - align-items: stretch; + align-items: stretch; background-color: #fff; - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; - -webkit-box-pack: justify; - -ms-flex-pack: justify; - justify-content: space-between; + flex-direction: column; + justify-content: space-between; } .hero .nav { @@ -5665,7 +5086,6 @@ a.panel-block:hover { } .hero.is-white.is-bold { - background-image: -webkit-linear-gradient(309deg, #e6e6e6 0%, #fff 71%, white 100%); background-image: linear-gradient(141deg, #e6e6e6 0%, #fff 71%, white 100%); } @@ -5756,7 +5176,6 @@ a.panel-block:hover { } .hero.is-black.is-bold { - background-image: -webkit-linear-gradient(309deg, black 0%, #111 71%, #1f1c1c 100%); background-image: linear-gradient(141deg, black 0%, #111 71%, #1f1c1c 100%); } @@ -5847,7 +5266,6 @@ a.panel-block:hover { } .hero.is-light.is-bold { - background-image: -webkit-linear-gradient(309deg, #d0e0ec 0%, #f5f7fa 71%, white 100%); background-image: linear-gradient(141deg, #d0e0ec 0%, #f5f7fa 71%, white 100%); } @@ -5938,7 +5356,6 @@ a.panel-block:hover { } .hero.is-dark.is-bold { - background-image: -webkit-linear-gradient(309deg, #495a67 0%, #69707a 71%, #6e768e 100%); background-image: linear-gradient(141deg, #495a67 0%, #69707a 71%, #6e768e 100%); } @@ -5958,7 +5375,7 @@ a.panel-block:hover { } .hero.is-primary { - background-color: #1fc8db; + background-color: #11e4c4; color: white; } @@ -5986,7 +5403,7 @@ a.panel-block:hover { @media screen and (max-width: 768px) { .hero.is-primary .nav-menu { - background-color: #1fc8db; + background-color: #11e4c4; } } @@ -6025,12 +5442,11 @@ a.panel-block:hover { .hero.is-primary .tabs.is-boxed li.is-active a, .hero.is-primary .tabs.is-boxed li.is-active a:hover, .hero.is-primary .tabs.is-toggle li.is-active a, .hero.is-primary .tabs.is-toggle li.is-active a:hover { background-color: white; border-color: white; - color: #1fc8db; + color: #11e4c4; } .hero.is-primary.is-bold { - background-image: -webkit-linear-gradient(309deg, #0fb8ad 0%, #1fc8db 71%, #2cb5e8 100%); - background-image: linear-gradient(141deg, #0fb8ad 0%, #1fc8db 71%, #2cb5e8 100%); + background-image: linear-gradient(141deg, #04be83 0%, #11e4c4 71%, #1af1f4 100%); } @media screen and (max-width: 768px) { @@ -6049,7 +5465,7 @@ a.panel-block:hover { } .hero.is-info { - background-color: #42afe3; + background-color: #0f6bff; color: white; } @@ -6077,7 +5493,7 @@ a.panel-block:hover { @media screen and (max-width: 768px) { .hero.is-info .nav-menu { - background-color: #42afe3; + background-color: #0f6bff; } } @@ -6116,12 +5532,11 @@ a.panel-block:hover { .hero.is-info .tabs.is-boxed li.is-active a, .hero.is-info .tabs.is-boxed li.is-active a:hover, .hero.is-info .tabs.is-toggle li.is-active a, .hero.is-info .tabs.is-toggle li.is-active a:hover { background-color: white; border-color: white; - color: #42afe3; + color: #0f6bff; } .hero.is-info.is-bold { - background-image: -webkit-linear-gradient(309deg, #13bfdf 0%, #42afe3 71%, #53a1eb 100%); - background-image: linear-gradient(141deg, #13bfdf 0%, #42afe3 71%, #53a1eb 100%); + background-image: linear-gradient(141deg, #0079db 0%, #0f6bff 71%, #2957ff 100%); } @media screen and (max-width: 768px) { @@ -6140,7 +5555,7 @@ a.panel-block:hover { } .hero.is-success { - background-color: #97cd76; + background-color: #20ee68; color: white; } @@ -6168,7 +5583,7 @@ a.panel-block:hover { @media screen and (max-width: 768px) { .hero.is-success .nav-menu { - background-color: #97cd76; + background-color: #20ee68; } } @@ -6207,12 +5622,11 @@ a.panel-block:hover { .hero.is-success .tabs.is-boxed li.is-active a, .hero.is-success .tabs.is-boxed li.is-active a:hover, .hero.is-success .tabs.is-toggle li.is-active a, .hero.is-success .tabs.is-toggle li.is-active a:hover { background-color: white; border-color: white; - color: #97cd76; + color: #20ee68; } .hero.is-success.is-bold { - background-image: -webkit-linear-gradient(309deg, #8ecb45 0%, #97cd76 71%, #96d885 100%); - background-image: linear-gradient(141deg, #8ecb45 0%, #97cd76 71%, #96d885 100%); + background-image: linear-gradient(141deg, #04d72b 0%, #20ee68 71%, #32f597 100%); } @media screen and (max-width: 768px) { @@ -6231,12 +5645,12 @@ a.panel-block:hover { } .hero.is-warning { - background-color: #fce473; - color: rgba(17, 17, 17, 0.5); + background-color: #ffcf0f; + color: white; } .hero.is-warning .title { - color: rgba(17, 17, 17, 0.5); + color: white; } .hero.is-warning .title a, @@ -6245,37 +5659,37 @@ a.panel-block:hover { } .hero.is-warning .subtitle { - color: rgba(17, 17, 17, 0.7); + color: rgba(255, 255, 255, 0.7); } .hero.is-warning .subtitle a, .hero.is-warning .subtitle strong { - color: rgba(17, 17, 17, 0.5); + color: white; } .hero.is-warning .nav { - box-shadow: 0 1px 0 rgba(17, 17, 17, 0.2); + box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2); } @media screen and (max-width: 768px) { .hero.is-warning .nav-menu { - background-color: #fce473; + background-color: #ffcf0f; } } .hero.is-warning a.nav-item, .hero.is-warning .nav-item a:not(.button) { - color: rgba(17, 17, 17, 0.5); + color: rgba(255, 255, 255, 0.5); } .hero.is-warning a.nav-item:hover, .hero.is-warning a.nav-item.is-active, .hero.is-warning .nav-item a:not(.button):hover, .hero.is-warning .nav-item a:not(.button).is-active { - color: rgba(17, 17, 17, 0.5); + color: white; } .hero.is-warning .tabs a { - color: rgba(17, 17, 17, 0.5); + color: white; opacity: 0.5; } @@ -6288,7 +5702,7 @@ a.panel-block:hover { } .hero.is-warning .tabs.is-boxed a, .hero.is-warning .tabs.is-toggle a { - color: rgba(17, 17, 17, 0.5); + color: white; } .hero.is-warning .tabs.is-boxed a:hover, .hero.is-warning .tabs.is-toggle a:hover { @@ -6296,33 +5710,32 @@ a.panel-block:hover { } .hero.is-warning .tabs.is-boxed li.is-active a, .hero.is-warning .tabs.is-boxed li.is-active a:hover, .hero.is-warning .tabs.is-toggle li.is-active a, .hero.is-warning .tabs.is-toggle li.is-active a:hover { - background-color: rgba(17, 17, 17, 0.5); - border-color: rgba(17, 17, 17, 0.5); - color: #fce473; + background-color: white; + border-color: white; + color: #ffcf0f; } .hero.is-warning.is-bold { - background-image: -webkit-linear-gradient(309deg, #ffbd3d 0%, #fce473 71%, #fffe8a 100%); - background-image: linear-gradient(141deg, #ffbd3d 0%, #fce473 71%, #fffe8a 100%); + background-image: linear-gradient(141deg, #db8b00 0%, #ffcf0f 71%, #fff829 100%); } @media screen and (max-width: 768px) { .hero.is-warning .nav-toggle span { - background-color: rgba(17, 17, 17, 0.5); + background-color: white; } .hero.is-warning .nav-toggle:hover { background-color: rgba(17, 17, 17, 0.1); } .hero.is-warning .nav-toggle.is-active span { - background-color: rgba(17, 17, 17, 0.5); + background-color: white; } .hero.is-warning .nav-menu .nav-item { - border-top-color: rgba(17, 17, 17, 0.2); + border-top-color: rgba(255, 255, 255, 0.2); } } .hero.is-danger { - background-color: #ed6c63; + background-color: #ff0f3f; color: white; } @@ -6350,7 +5763,7 @@ a.panel-block:hover { @media screen and (max-width: 768px) { .hero.is-danger .nav-menu { - background-color: #ed6c63; + background-color: #ff0f3f; } } @@ -6389,12 +5802,11 @@ a.panel-block:hover { .hero.is-danger .tabs.is-boxed li.is-active a, .hero.is-danger .tabs.is-boxed li.is-active a:hover, .hero.is-danger .tabs.is-toggle li.is-active a, .hero.is-danger .tabs.is-toggle li.is-active a:hover { background-color: white; border-color: white; - color: #ed6c63; + color: #ff0f3f; } .hero.is-danger.is-bold { - background-image: -webkit-linear-gradient(309deg, #f32a3e 0%, #ed6c63 71%, #f39376 100%); - background-image: linear-gradient(141deg, #f32a3e 0%, #ed6c63 71%, #f39376 100%); + background-image: linear-gradient(141deg, #db0050 0%, #ff0f3f 71%, #ff2930 100%); } @media screen and (max-width: 768px) { @@ -6431,20 +5843,13 @@ a.panel-block:hover { } .hero.is-fullheight .hero-body { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -ms-flexbox; + align-items: center; display: flex; } .hero.is-fullheight .hero-body > .container { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - -ms-flex-negative: 0; - flex-shrink: 0; + flex-grow: 1; + flex-shrink: 0; } .section { @@ -6479,7 +5884,7 @@ a.panel-block:hover { } .footer a:not(.icon):hover, .footer a:visited:not(.icon):hover { - border-bottom-color: #1fc8db; + border-bottom-color: #11e4c4; } @media screen and (min-width: 769px) { @@ -6601,7 +6006,7 @@ body.page-grid .column > .notification { #npm code { border-radius: 3px; - color: #1fc8db; + color: #11e4c4; display: inline-block; font-size: 16px; padding: 16px 32px; @@ -6632,17 +6037,11 @@ body.page-grid .column > .notification { } #social { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -ms-flexbox; + align-items: center; display: flex; height: 20px; margin-bottom: 1em; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; } #social a { @@ -6670,9 +6069,9 @@ body.page-grid .column > .notification { .example, .structure { - border: 1px solid #fce473; + border: 1px solid #ffcf0f; border-top-right-radius: 3px; - color: rgba(17, 17, 17, 0.5); + color: white; padding: 15px 20px; position: relative; } @@ -6689,7 +6088,7 @@ body.page-grid .column > .notification { .example:before, .structure:before { - background: #fce473; + background: #ffcf0f; border-radius: 3px 3px 0 0; bottom: 100%; content: "Example"; @@ -6714,7 +6113,7 @@ body.page-grid .column > .notification { } .example + .highlight { - border: 1px solid #fce473; + border: 1px solid #ffcf0f; border-radius: 0 0 3px 3px; border-top: none; margin-top: -20px; @@ -6729,13 +6128,13 @@ body.page-grid .column > .notification { } .structure { - border-color: #ed6c63; + border-color: #ff0f3f; border-radius: 3px; padding: 20px; } .structure:before { - background: #ed6c63; + background: #ff0f3f; color: white; content: "Structure"; } @@ -6764,18 +6163,12 @@ body.page-grid .column > .notification { position: absolute; right: 0; top: 0; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; + align-items: center; content: attr(title); - display: -webkit-box; - display: -ms-flexbox; display: flex; font-family: "Source Code Pro", "Monaco", "Inconsolata", monospace; font-size: 11px; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + justify-content: center; padding: 3px 5px; z-index: 2; } @@ -6785,13 +6178,8 @@ body.page-grid .column > .notification { } .structure-item.is-structure-container:after { - -webkit-box-align: start; - -ms-flex-align: start; - -ms-grid-row-align: flex-start; - align-items: flex-start; - -webkit-box-pack: start; - -ms-flex-pack: start; - justify-content: flex-start; + align-items: flex-start; + justify-content: flex-start; padding: 5px 10px; } @@ -6813,8 +6201,8 @@ body.page-grid .column > .notification { .highlight .copy:hover, .highlight .expand:hover { - border-color: #ed6c63; - color: #ed6c63; + border-color: #ff0f3f; + color: #ff0f3f; } .highlight .expand { diff --git a/docs/css/bulma.css b/docs/css/bulma.css new file mode 100644 index 00000000..6976583c --- /dev/null +++ b/docs/css/bulma.css @@ -0,0 +1,5887 @@ +html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font-weight: normal; + vertical-align: baseline; + background: transparent; +} + +article, aside, figure, footer, header, nav, section, details, summary { + display: block; +} + +html { + box-sizing: border-box; +} + +*, +*:before, +*:after { + box-sizing: inherit; +} + +img, +object, +embed { + max-width: 100%; +} + +html { + overflow-y: scroll; +} + +ul { + list-style: none; +} + +blockquote, q { + quotes: none; +} + +blockquote:before, +blockquote:after, +q:before, +q:after { + content: ''; + content: none; +} + +a { + margin: 0; + padding: 0; + font-size: 100%; + vertical-align: baseline; + background: transparent; +} + +del { + text-decoration: line-through; +} + +abbr[title], dfn[title] { + border-bottom: 1px dotted #000; + cursor: help; +} + +table { + border-collapse: collapse; + border-spacing: 0; +} + +th { + font-weight: bold; + vertical-align: bottom; +} + +td { + font-weight: normal; + vertical-align: top; +} + +hr { + display: block; + height: 1px; + border: 0; + border-top: 1px solid #ccc; + margin: 1em 0; + padding: 0; +} + +input, select { + vertical-align: middle; +} + +pre { + white-space: pre; + white-space: pre-wrap; + white-space: pre-line; + word-wrap: break-word; +} + +input[type="radio"] { + vertical-align: text-bottom; +} + +input[type="checkbox"] { + vertical-align: bottom; +} + +select, input, textarea { + font: 99% sans-serif; +} + +table { + font-size: inherit; + font: 100%; +} + +small { + font-size: 85%; +} + +strong { + font-weight: bold; +} + +td, td img { + vertical-align: top; +} + +sub, sup { + font-size: 75%; + line-height: 0; + position: relative; +} + +sup { + top: -0.5em; +} + +sub { + bottom: -0.25em; +} + +pre, code, kbd, samp { + font-family: monospace, sans-serif; +} + +label, +input[type=button], +input[type=submit], +input[type=file], +button { + cursor: pointer; +} + +button, input, select, textarea { + margin: 0; +} + +button, +input[type=button] { + width: auto; + overflow: visible; +} + +@keyframes spin-around { + from { + transform: rotate(0deg); + } + to { + transform: rotate(359deg); + } +} + +html { + background-color: #f5f7fa; + font-size: 14px; + -moz-osx-font-smoothing: grayscale; + -webkit-font-smoothing: antialiased; + min-width: 300px; + overflow-x: hidden; + overflow-y: scroll; + text-rendering: optimizeLegibility; +} + +article, +aside, +figure, +footer, +header, +hgroup, +section { + display: block; +} + +body, +button, +input, +select, +textarea { + font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif; +} + +code, +pre { + -moz-osx-font-smoothing: auto; + -webkit-font-smoothing: auto; + font-family: "Source Code Pro", "Monaco", "Inconsolata", monospace; + line-height: 1.25; +} + +body { + color: #69707a; + font-size: 1rem; + font-weight: 400; + line-height: 1.428571428571429; +} + +a { + color: #24ffde; + cursor: pointer; + text-decoration: none; + transition: none 86ms ease-out; +} + +a:hover { + color: #222324; +} + +code { + background-color: #f5f7fa; + color: #ff2450; + font-size: 12px; + font-weight: normal; + padding: 1px 2px 2px; +} + +hr { + border-top-color: #d3d6db; + margin: 40px 0; +} + +img { + max-width: 100%; +} + +input[type="checkbox"], +input[type="radio"] { + vertical-align: baseline; +} + +small { + font-size: 11px; +} + +span { + font-style: inherit; + font-weight: inherit; +} + +strong { + color: #222324; + font-weight: 700; +} + +pre { + background-color: #f5f7fa; + color: #69707a; + white-space: pre; + word-wrap: normal; +} + +pre code { + background-color: #f5f7fa; + color: #69707a; + display: block; + overflow-x: auto; + padding: 16px 20px; +} + +table { + width: 100%; +} + +table td, +table th { + text-align: left; + vertical-align: top; +} + +table th { + color: #222324; +} + +.block:not(:last-child), .box:not(:last-child), .content:not(:last-child), .notification:not(:last-child), .progress:not(:last-child), .title:not(:last-child), +.subtitle:not(:last-child), .highlight:not(:last-child), .level:not(:last-child), .message:not(:last-child), .tabs:not(:last-child) { + margin-bottom: 20px; +} + +.container { + position: relative; +} + +@media screen and (min-width: 980px) { + .container { + margin: 0 auto; + max-width: 960px; + } + .container.is-fluid { + margin: 0 20px; + max-width: none; + } +} + +@media screen and (min-width: 1180px) { + .container { + max-width: 1200px; + } +} + +.fa { + font-size: 21px; + text-align: center; + vertical-align: top; +} + +.is-block { + display: block; +} + +@media screen and (max-width: 768px) { + .is-block-mobile { + display: block !important; + } +} + +@media screen and (min-width: 769px) { + .is-block-tablet { + display: block !important; + } +} + +@media screen and (min-width: 769px) and (max-width: 979px) { + .is-block-tablet-only { + display: block !important; + } +} + +@media screen and (max-width: 979px) { + .is-block-touch { + display: block !important; + } +} + +@media screen and (min-width: 980px) { + .is-block-desktop { + display: block !important; + } +} + +@media screen and (min-width: 980px) and (max-width: 1179px) { + .is-block-desktop-only { + display: block !important; + } +} + +@media screen and (min-width: 1180px) { + .is-block-widescreen { + display: block !important; + } +} + +.is-flex { + display: flex; +} + +@media screen and (max-width: 768px) { + .is-flex-mobile { + display: flex !important; + } +} + +@media screen and (min-width: 769px) { + .is-flex-tablet { + display: flex !important; + } +} + +@media screen and (min-width: 769px) and (max-width: 979px) { + .is-flex-tablet-only { + display: flex !important; + } +} + +@media screen and (max-width: 979px) { + .is-flex-touch { + display: flex !important; + } +} + +@media screen and (min-width: 980px) { + .is-flex-desktop { + display: flex !important; + } +} + +@media screen and (min-width: 980px) and (max-width: 1179px) { + .is-flex-desktop-only { + display: flex !important; + } +} + +@media screen and (min-width: 1180px) { + .is-flex-widescreen { + display: flex !important; + } +} + +.is-inline { + display: inline; +} + +@media screen and (max-width: 768px) { + .is-inline-mobile { + display: inline !important; + } +} + +@media screen and (min-width: 769px) { + .is-inline-tablet { + display: inline !important; + } +} + +@media screen and (min-width: 769px) and (max-width: 979px) { + .is-inline-tablet-only { + display: inline !important; + } +} + +@media screen and (max-width: 979px) { + .is-inline-touch { + display: inline !important; + } +} + +@media screen and (min-width: 980px) { + .is-inline-desktop { + display: inline !important; + } +} + +@media screen and (min-width: 980px) and (max-width: 1179px) { + .is-inline-desktop-only { + display: inline !important; + } +} + +@media screen and (min-width: 1180px) { + .is-inline-widescreen { + display: inline !important; + } +} + +.is-inline-block { + display: inline-block; +} + +@media screen and (max-width: 768px) { + .is-inline-block-mobile { + display: inline-block !important; + } +} + +@media screen and (min-width: 769px) { + .is-inline-block-tablet { + display: inline-block !important; + } +} + +@media screen and (min-width: 769px) and (max-width: 979px) { + .is-inline-block-tablet-only { + display: inline-block !important; + } +} + +@media screen and (max-width: 979px) { + .is-inline-block-touch { + display: inline-block !important; + } +} + +@media screen and (min-width: 980px) { + .is-inline-block-desktop { + display: inline-block !important; + } +} + +@media screen and (min-width: 980px) and (max-width: 1179px) { + .is-inline-block-desktop-only { + display: inline-block !important; + } +} + +@media screen and (min-width: 1180px) { + .is-inline-block-widescreen { + display: inline-block !important; + } +} + +.is-inline-flex { + display: inline-flex; +} + +@media screen and (max-width: 768px) { + .is-inline-flex-mobile { + display: inline-flex !important; + } +} + +@media screen and (min-width: 769px) { + .is-inline-flex-tablet { + display: inline-flex !important; + } +} + +@media screen and (min-width: 769px) and (max-width: 979px) { + .is-inline-flex-tablet-only { + display: inline-flex !important; + } +} + +@media screen and (max-width: 979px) { + .is-inline-flex-touch { + display: inline-flex !important; + } +} + +@media screen and (min-width: 980px) { + .is-inline-flex-desktop { + display: inline-flex !important; + } +} + +@media screen and (min-width: 980px) and (max-width: 1179px) { + .is-inline-flex-desktop-only { + display: inline-flex !important; + } +} + +@media screen and (min-width: 1180px) { + .is-inline-flex-widescreen { + display: inline-flex !important; + } +} + +.is-clearfix:after { + clear: both; + content: " "; + display: table; +} + +.is-pulled-left { + float: left; +} + +.is-pulled-right { + float: right; +} + +.is-clipped { + overflow: hidden !important; +} + +.is-overlay { + bottom: 0; + left: 0; + position: absolute; + right: 0; + top: 0; +} + +.has-text-centered { + text-align: center; +} + +.has-text-left { + text-align: left; +} + +.has-text-right { + text-align: right; +} + +.is-hidden { + display: none !important; +} + +@media screen and (max-width: 768px) { + .is-hidden-mobile { + display: none !important; + } +} + +@media screen and (min-width: 769px) { + .is-hidden-tablet { + display: none !important; + } +} + +@media screen and (min-width: 769px) and (max-width: 979px) { + .is-hidden-tablet-only { + display: none !important; + } +} + +@media screen and (max-width: 979px) { + .is-hidden-touch { + display: none !important; + } +} + +@media screen and (min-width: 980px) { + .is-hidden-desktop { + display: none !important; + } +} + +@media screen and (min-width: 980px) and (max-width: 1179px) { + .is-hidden-desktop-only { + display: none !important; + } +} + +@media screen and (min-width: 1180px) { + .is-hidden-widescreen { + display: none !important; + } +} + +.is-disabled { + pointer-events: none; +} + +.is-marginless { + margin: 0 !important; +} + +.is-paddingless { + padding: 0 !important; +} + +.box { + background-color: #fff; + border-radius: 5px; + box-shadow: 0 2px 3px rgba(17, 17, 17, 0.1), 0 0 0 1px rgba(17, 17, 17, 0.1); + display: block; + padding: 20px; +} + +a.box:hover, a.box:focus { + box-shadow: 0 2px 3px rgba(17, 17, 17, 0.1), 0 0 0 1px #24ffde; +} + +a.box:active { + box-shadow: inset 0 1px 2px rgba(17, 17, 17, 0.2), 0 0 0 1px #24ffde; +} + +.button { + -moz-appearance: none; + -webkit-appearance: none; + align-items: center; + background-color: white; + border: 1px solid #d3d6db; + border-radius: 3px; + color: #222324; + display: inline-flex; + font-size: 14px; + height: 32px; + justify-content: flex-start; + line-height: 24px; + padding-left: 8px; + padding-right: 8px; + position: relative; + vertical-align: top; + justify-content: center; + padding-left: 10px; + padding-right: 10px; + text-align: center; + white-space: nowrap; +} + +.button:hover { + border-color: #aeb1b5; +} + +.button:active, .button:focus, .button.is-active { + border-color: #24ffde; + outline: none; +} + +.button[disabled], .button.is-disabled { + background-color: #f5f7fa; + border-color: #d3d6db; + cursor: not-allowed; + pointer-events: none; +} + +.button[disabled]::-moz-placeholder, .button.is-disabled::-moz-placeholder { + color: rgba(34, 35, 36, 0.3); +} + +.button[disabled]::-webkit-input-placeholder, .button.is-disabled::-webkit-input-placeholder { + color: rgba(34, 35, 36, 0.3); +} + +.button[disabled]:-moz-placeholder, .button.is-disabled:-moz-placeholder { + color: rgba(34, 35, 36, 0.3); +} + +.button[disabled]:-ms-input-placeholder, .button.is-disabled:-ms-input-placeholder { + color: rgba(34, 35, 36, 0.3); +} + +.button strong { + color: inherit; +} + +.button small { + display: block; + font-size: 11px; + line-height: 1; + margin-top: 5px; +} + +.button .icon:first-child, +.button .tag:first-child { + margin-left: -2px; + margin-right: 4px; +} + +.button .icon:last-child, +.button .tag:last-child { + margin-left: 4px; + margin-right: -2px; +} + +.button:hover, .button:focus, .button.is-active { + color: #222324; +} + +.button:active { + box-shadow: inset 0 1px 2px rgba(17, 17, 17, 0.2); +} + +.button.is-white { + background-color: #fff; + border-color: transparent; + color: #111; +} + +.button.is-white:hover, .button.is-white:focus, .button.is-white.is-active { + background-color: #e6e6e6; + border-color: transparent; + color: #111; +} + +.button.is-white:active { + border-color: transparent; +} + +.button.is-white.is-inverted { + background-color: #111; + color: #fff; +} + +.button.is-white.is-inverted:hover { + background-color: #040404; +} + +.button.is-white.is-loading:after { + border-color: transparent transparent #111 #111 !important; +} + +.button.is-white.is-outlined { + background-color: transparent; + border-color: #fff; + color: #fff; +} + +.button.is-white.is-outlined:hover, .button.is-white.is-outlined:focus { + background-color: #fff; + border-color: #fff; + color: #111; +} + +.button.is-black { + background-color: #111; + border-color: transparent; + color: #fff; +} + +.button.is-black:hover, .button.is-black:focus, .button.is-black.is-active { + background-color: black; + border-color: transparent; + color: #fff; +} + +.button.is-black:active { + border-color: transparent; +} + +.button.is-black.is-inverted { + background-color: #fff; + color: #111; +} + +.button.is-black.is-inverted:hover { + background-color: #f2f2f2; +} + +.button.is-black.is-loading:after { + border-color: transparent transparent #fff #fff !important; +} + +.button.is-black.is-outlined { + background-color: transparent; + border-color: #111; + color: #111; +} + +.button.is-black.is-outlined:hover, .button.is-black.is-outlined:focus { + background-color: #111; + border-color: #111; + color: #fff; +} + +.button.is-light { + background-color: #f5f7fa; + border-color: transparent; + color: #69707a; +} + +.button.is-light:hover, .button.is-light:focus, .button.is-light.is-active { + background-color: #d3dce9; + border-color: transparent; + color: #69707a; +} + +.button.is-light:active { + border-color: transparent; +} + +.button.is-light.is-inverted { + background-color: #69707a; + color: #f5f7fa; +} + +.button.is-light.is-inverted:hover { + background-color: #5d636c; +} + +.button.is-light.is-loading:after { + border-color: transparent transparent #69707a #69707a !important; +} + +.button.is-light.is-outlined { + background-color: transparent; + border-color: #f5f7fa; + color: #f5f7fa; +} + +.button.is-light.is-outlined:hover, .button.is-light.is-outlined:focus { + background-color: #f5f7fa; + border-color: #f5f7fa; + color: #69707a; +} + +.button.is-dark { + background-color: #69707a; + border-color: transparent; + color: #f5f7fa; +} + +.button.is-dark:hover, .button.is-dark:focus, .button.is-dark.is-active { + background-color: #51575f; + border-color: transparent; + color: #f5f7fa; +} + +.button.is-dark:active { + border-color: transparent; +} + +.button.is-dark.is-inverted { + background-color: #f5f7fa; + color: #69707a; +} + +.button.is-dark.is-inverted:hover { + background-color: #e4e9f2; +} + +.button.is-dark.is-loading:after { + border-color: transparent transparent #f5f7fa #f5f7fa !important; +} + +.button.is-dark.is-outlined { + background-color: transparent; + border-color: #69707a; + color: #69707a; +} + +.button.is-dark.is-outlined:hover, .button.is-dark.is-outlined:focus { + background-color: #69707a; + border-color: #69707a; + color: #f5f7fa; +} + +.button.is-primary { + background-color: #24ffde; + border-color: transparent; + color: white; +} + +.button.is-primary:hover, .button.is-primary:focus, .button.is-primary.is-active { + background-color: #00f0cc; + border-color: transparent; + color: white; +} + +.button.is-primary:active { + border-color: transparent; +} + +.button.is-primary.is-inverted { + background-color: white; + color: #24ffde; +} + +.button.is-primary.is-inverted:hover { + background-color: #f2f2f2; +} + +.button.is-primary.is-loading:after { + border-color: transparent transparent white white !important; +} + +.button.is-primary.is-outlined { + background-color: transparent; + border-color: #24ffde; + color: #24ffde; +} + +.button.is-primary.is-outlined:hover, .button.is-primary.is-outlined:focus { + background-color: #24ffde; + border-color: #24ffde; + color: white; +} + +.button.is-info { + background-color: #2478ff; + border-color: transparent; + color: white; +} + +.button.is-info:hover, .button.is-info:focus, .button.is-info.is-active { + background-color: #005cf0; + border-color: transparent; + color: white; +} + +.button.is-info:active { + border-color: transparent; +} + +.button.is-info.is-inverted { + background-color: white; + color: #2478ff; +} + +.button.is-info.is-inverted:hover { + background-color: #f2f2f2; +} + +.button.is-info.is-loading:after { + border-color: transparent transparent white white !important; +} + +.button.is-info.is-outlined { + background-color: transparent; + border-color: #2478ff; + color: #2478ff; +} + +.button.is-info.is-outlined:hover, .button.is-info.is-outlined:focus { + background-color: #2478ff; + border-color: #2478ff; + color: white; +} + +.button.is-success { + background-color: #24ff70; + border-color: transparent; + color: white; +} + +.button.is-success:hover, .button.is-success:focus, .button.is-success.is-active { + background-color: #00f053; + border-color: transparent; + color: white; +} + +.button.is-success:active { + border-color: transparent; +} + +.button.is-success.is-inverted { + background-color: white; + color: #24ff70; +} + +.button.is-success.is-inverted:hover { + background-color: #f2f2f2; +} + +.button.is-success.is-loading:after { + border-color: transparent transparent white white !important; +} + +.button.is-success.is-outlined { + background-color: transparent; + border-color: #24ff70; + color: #24ff70; +} + +.button.is-success.is-outlined:hover, .button.is-success.is-outlined:focus { + background-color: #24ff70; + border-color: #24ff70; + color: white; +} + +.button.is-warning { + background-color: #ffd324; + border-color: transparent; + color: white; +} + +.button.is-warning:hover, .button.is-warning:focus, .button.is-warning.is-active { + background-color: #f0c000; + border-color: transparent; + color: white; +} + +.button.is-warning:active { + border-color: transparent; +} + +.button.is-warning.is-inverted { + background-color: white; + color: #ffd324; +} + +.button.is-warning.is-inverted:hover { + background-color: #f2f2f2; +} + +.button.is-warning.is-loading:after { + border-color: transparent transparent white white !important; +} + +.button.is-warning.is-outlined { + background-color: transparent; + border-color: #ffd324; + color: #ffd324; +} + +.button.is-warning.is-outlined:hover, .button.is-warning.is-outlined:focus { + background-color: #ffd324; + border-color: #ffd324; + color: white; +} + +.button.is-danger { + background-color: #ff2450; + border-color: transparent; + color: white; +} + +.button.is-danger:hover, .button.is-danger:focus, .button.is-danger.is-active { + background-color: #f00030; + border-color: transparent; + color: white; +} + +.button.is-danger:active { + border-color: transparent; +} + +.button.is-danger.is-inverted { + background-color: white; + color: #ff2450; +} + +.button.is-danger.is-inverted:hover { + background-color: #f2f2f2; +} + +.button.is-danger.is-loading:after { + border-color: transparent transparent white white !important; +} + +.button.is-danger.is-outlined { + background-color: transparent; + border-color: #ff2450; + color: #ff2450; +} + +.button.is-danger.is-outlined:hover, .button.is-danger.is-outlined:focus { + background-color: #ff2450; + border-color: #ff2450; + color: white; +} + +.button.is-link { + background-color: transparent; + border-color: transparent; + color: #69707a; + text-decoration: underline; +} + +.button.is-link:hover, .button.is-link:focus { + background-color: #d3d6db; + color: #222324; +} + +.button.is-small { + border-radius: 2px; + font-size: 11px; + height: 24px; + line-height: 16px; + padding-left: 6px; + padding-right: 6px; +} + +.button.is-medium { + font-size: 18px; + height: 40px; + padding-left: 14px; + padding-right: 14px; +} + +.button.is-large { + font-size: 22px; + height: 48px; + padding-left: 20px; + padding-right: 20px; +} + +.button[disabled], .button.is-disabled { + opacity: 0.5; +} + +.button.is-fullwidth { + display: flex; + width: 100%; +} + +.button.is-loading { + color: transparent !important; + pointer-events: none; +} + +.button.is-loading:after { + left: 50%; + margin-left: -8px; + margin-top: -8px; + position: absolute; + top: 50%; + position: absolute !important; +} + +.content a:not(.button) { + border-bottom: 1px solid #d3d6db; +} + +.content a:not(.button):visited { + color: #9524ff; +} + +.content a:not(.button):hover { + border-bottom-color: #24ffde; +} + +.content li + li { + margin-top: 0.25em; +} + +.content blockquote:not(:last-child), +.content p:not(:last-child), +.content ol:not(:last-child), +.content ul:not(:last-child) { + margin-bottom: 1em; +} + +.content h1, +.content h2, +.content h3, +.content h4, +.content h5, +.content h6 { + color: #222324; + font-weight: 300; + line-height: 1.125; + margin-bottom: 20px; +} + +.content h1:not(:first-child), +.content h2:not(:first-child), +.content h3:not(:first-child) { + margin-top: 40px; +} + +.content blockquote { + background-color: #f5f7fa; + border-left: 5px solid #d3d6db; + padding: 1.5em; +} + +.content h1 { + font-size: 2em; +} + +.content h2 { + font-size: 1.75em; +} + +.content h3 { + font-size: 1.5em; +} + +.content h4 { + font-size: 1.25em; +} + +.content h5 { + font-size: 1.125em; +} + +.content h6 { + font-size: 1em; +} + +.content ol { + list-style: decimal outside; + margin-left: 2em; + margin-right: 2em; + margin-top: 1em; +} + +.content ul { + list-style: disc outside; + margin-left: 2em; + margin-right: 2em; + margin-top: 1em; +} + +.content ul ul { + list-style-type: circle; + margin-top: 0.5em; +} + +.content ul ul ul { + list-style-type: square; +} + +.content.is-medium { + font-size: 18px; +} + +.content.is-medium code { + font-size: 14px; +} + +.content.is-large { + font-size: 24px; +} + +.content.is-large code { + font-size: 18px; +} + +.input, .textarea { + -moz-appearance: none; + -webkit-appearance: none; + align-items: center; + background-color: white; + border: 1px solid #d3d6db; + border-radius: 3px; + color: #222324; + display: inline-flex; + font-size: 14px; + height: 32px; + justify-content: flex-start; + line-height: 24px; + padding-left: 8px; + padding-right: 8px; + position: relative; + vertical-align: top; + box-shadow: inset 0 1px 2px rgba(17, 17, 17, 0.1); + max-width: 100%; + width: 100%; +} + +.input:hover, .textarea:hover { + border-color: #aeb1b5; +} + +.input:active, .textarea:active, .input:focus, .textarea:focus, .input.is-active, .is-active.textarea { + border-color: #24ffde; + outline: none; +} + +.input[disabled], [disabled].textarea, .input.is-disabled, .is-disabled.textarea { + background-color: #f5f7fa; + border-color: #d3d6db; + cursor: not-allowed; + pointer-events: none; +} + +.input[disabled]::-moz-placeholder, [disabled].textarea::-moz-placeholder, .input.is-disabled::-moz-placeholder, .is-disabled.textarea::-moz-placeholder { + color: rgba(34, 35, 36, 0.3); +} + +.input[disabled]::-webkit-input-placeholder, [disabled].textarea::-webkit-input-placeholder, .input.is-disabled::-webkit-input-placeholder, .is-disabled.textarea::-webkit-input-placeholder { + color: rgba(34, 35, 36, 0.3); +} + +.input[disabled]:-moz-placeholder, [disabled].textarea:-moz-placeholder, .input.is-disabled:-moz-placeholder, .is-disabled.textarea:-moz-placeholder { + color: rgba(34, 35, 36, 0.3); +} + +.input[disabled]:-ms-input-placeholder, [disabled].textarea:-ms-input-placeholder, .input.is-disabled:-ms-input-placeholder, .is-disabled.textarea:-ms-input-placeholder { + color: rgba(34, 35, 36, 0.3); +} + +.input.is-white, .is-white.textarea { + border-color: #fff; +} + +.input.is-black, .is-black.textarea { + border-color: #111; +} + +.input.is-light, .is-light.textarea { + border-color: #f5f7fa; +} + +.input.is-dark, .is-dark.textarea { + border-color: #69707a; +} + +.input.is-primary, .is-primary.textarea { + border-color: #24ffde; +} + +.input.is-info, .is-info.textarea { + border-color: #2478ff; +} + +.input.is-success, .is-success.textarea { + border-color: #24ff70; +} + +.input.is-warning, .is-warning.textarea { + border-color: #ffd324; +} + +.input.is-danger, .is-danger.textarea { + border-color: #ff2450; +} + +.input[type="search"], [type="search"].textarea { + border-radius: 290486px; +} + +.input.is-small, .is-small.textarea { + border-radius: 2px; + font-size: 11px; + height: 24px; + line-height: 16px; + padding-left: 6px; + padding-right: 6px; +} + +.input.is-medium, .is-medium.textarea { + font-size: 18px; + height: 40px; + line-height: 32px; + padding-left: 10px; + padding-right: 10px; +} + +.input.is-large, .is-large.textarea { + font-size: 24px; + height: 48px; + line-height: 40px; + padding-left: 12px; + padding-right: 12px; +} + +.input.is-fullwidth, .is-fullwidth.textarea { + display: block; + width: 100%; +} + +.input.is-inline, .is-inline.textarea { + display: inline; + width: auto; +} + +.textarea { + display: block; + line-height: 1.2; + max-height: 600px; + max-width: 100%; + min-height: 120px; + min-width: 100%; + padding: 10px; + resize: vertical; +} + +.checkbox, .radio { + cursor: pointer; + display: inline-block; + line-height: 16px; + position: relative; + vertical-align: top; +} + +.checkbox input, .radio input { + cursor: pointer; +} + +.checkbox:hover, .radio:hover { + color: #222324; +} + +.is-disabled.checkbox, .is-disabled.radio { + color: #aeb1b5; + pointer-events: none; +} + +.is-disabled.checkbox input, .is-disabled.radio input { + pointer-events: none; +} + +.radio + .radio { + margin-left: 10px; +} + +.select { + display: inline-block; + height: 32px; + position: relative; + vertical-align: top; +} + +.select select { + -moz-appearance: none; + -webkit-appearance: none; + align-items: center; + background-color: white; + border: 1px solid #d3d6db; + border-radius: 3px; + color: #222324; + display: inline-flex; + font-size: 14px; + height: 32px; + justify-content: flex-start; + line-height: 24px; + padding-left: 8px; + padding-right: 8px; + position: relative; + vertical-align: top; + cursor: pointer; + display: block; + outline: none; + padding-right: 36px; +} + +.select select:hover { + border-color: #aeb1b5; +} + +.select select:active, .select select:focus, .select select.is-active { + border-color: #24ffde; + outline: none; +} + +.select select[disabled], .select select.is-disabled { + background-color: #f5f7fa; + border-color: #d3d6db; + cursor: not-allowed; + pointer-events: none; +} + +.select select[disabled]::-moz-placeholder, .select select.is-disabled::-moz-placeholder { + color: rgba(34, 35, 36, 0.3); +} + +.select select[disabled]::-webkit-input-placeholder, .select select.is-disabled::-webkit-input-placeholder { + color: rgba(34, 35, 36, 0.3); +} + +.select select[disabled]:-moz-placeholder, .select select.is-disabled:-moz-placeholder { + color: rgba(34, 35, 36, 0.3); +} + +.select select[disabled]:-ms-input-placeholder, .select select.is-disabled:-ms-input-placeholder { + color: rgba(34, 35, 36, 0.3); +} + +.select select.is-white { + border-color: #fff; +} + +.select select.is-black { + border-color: #111; +} + +.select select.is-light { + border-color: #f5f7fa; +} + +.select select.is-dark { + border-color: #69707a; +} + +.select select.is-primary { + border-color: #24ffde; +} + +.select select.is-info { + border-color: #2478ff; +} + +.select select.is-success { + border-color: #24ff70; +} + +.select select.is-warning { + border-color: #ffd324; +} + +.select select.is-danger { + border-color: #ff2450; +} + +.select select:hover { + border-color: #aeb1b5; +} + +.select select::ms-expand { + display: none; +} + +.select.is-fullwidth { + width: 100%; +} + +.select.is-fullwidth select { + width: 100%; +} + +.select:after { + border: 1px solid #24ffde; + border-right: 0; + border-top: 0; + content: " "; + display: block; + height: 7px; + pointer-events: none; + position: absolute; + transform: rotate(-45deg); + width: 7px; + margin-top: -6px; + right: 16px; + top: 50%; +} + +.select:hover:after { + border-color: #222324; +} + +.select.is-small { + height: 24px; +} + +.select.is-small select { + border-radius: 2px; + font-size: 11px; + height: 24px; + line-height: 16px; + padding-left: 6px; + padding-right: 6px; + padding-right: 28px; +} + +.select.is-medium { + height: 40px; +} + +.select.is-medium select { + font-size: 18px; + height: 40px; + line-height: 32px; + padding-left: 10px; + padding-right: 10px; + padding-right: 44px; +} + +.select.is-large { + height: 48px; +} + +.select.is-large select { + font-size: 24px; + height: 48px; + line-height: 40px; + padding-left: 12px; + padding-right: 12px; + padding-right: 52px; +} + +.label { + color: #222324; + display: block; + font-weight: bold; +} + +.label:not(:last-child) { + margin-bottom: 5px; +} + +.help { + display: block; + font-size: 11px; + margin-top: 5px; +} + +.help.is-white { + color: #fff; +} + +.help.is-black { + color: #111; +} + +.help.is-light { + color: #f5f7fa; +} + +.help.is-dark { + color: #69707a; +} + +.help.is-primary { + color: #24ffde; +} + +.help.is-info { + color: #2478ff; +} + +.help.is-success { + color: #24ff70; +} + +.help.is-warning { + color: #ffd324; +} + +.help.is-danger { + color: #ff2450; +} + +@media screen and (max-width: 768px) { + .control-label { + margin-bottom: 5px; + } +} + +@media screen and (min-width: 769px) { + .control-label { + flex-basis: 0; + flex-grow: 1; + flex-shrink: 0; + margin-right: 20px; + padding-top: 7px; + text-align: right; + } +} + +.control { + position: relative; + text-align: left; +} + +.control:not(:last-child) { + margin-bottom: 10px; +} + +.control.has-addons { + display: flex; + justify-content: flex-start; +} + +.control.has-addons .button, +.control.has-addons .input, +.control.has-addons .textarea, +.control.has-addons .select { + border-radius: 0; + margin-right: -1px; + width: auto; +} + +.control.has-addons .button:hover, +.control.has-addons .input:hover, +.control.has-addons .textarea:hover, +.control.has-addons .select:hover { + z-index: 2; +} + +.control.has-addons .button:active, .control.has-addons .button:focus, +.control.has-addons .input:active, +.control.has-addons .textarea:active, +.control.has-addons .input:focus, +.control.has-addons .textarea:focus, +.control.has-addons .select:active, +.control.has-addons .select:focus { + z-index: 3; +} + +.control.has-addons .button:first-child, +.control.has-addons .input:first-child, +.control.has-addons .textarea:first-child, +.control.has-addons .select:first-child { + border-radius: 3px 0 0 3px; +} + +.control.has-addons .button:first-child select, +.control.has-addons .input:first-child select, +.control.has-addons .textarea:first-child select, +.control.has-addons .select:first-child select { + border-radius: 3px 0 0 3px; +} + +.control.has-addons .button:last-child, +.control.has-addons .input:last-child, +.control.has-addons .textarea:last-child, +.control.has-addons .select:last-child { + border-radius: 0 3px 3px 0; +} + +.control.has-addons .button:last-child select, +.control.has-addons .input:last-child select, +.control.has-addons .textarea:last-child select, +.control.has-addons .select:last-child select { + border-radius: 0 3px 3px 0; +} + +.control.has-addons .button.is-expanded, +.control.has-addons .input.is-expanded, +.control.has-addons .is-expanded.textarea, +.control.has-addons .select.is-expanded { + flex-grow: 1; + flex-shrink: 0; +} + +.control.has-addons.has-addons-centered { + justify-content: center; +} + +.control.has-addons.has-addons-right { + justify-content: flex-end; +} + +.control.has-addons.has-addons-fullwidth .button, +.control.has-addons.has-addons-fullwidth .input, +.control.has-addons.has-addons-fullwidth .textarea, +.control.has-addons.has-addons-fullwidth .select { + flex-grow: 1; + flex-shrink: 0; +} + +.control.has-icon > .fa { + display: inline-block; + font-size: 14px; + height: 24px; + line-height: 24px; + text-align: center; + vertical-align: top; + width: 24px; + color: #aeb1b5; + pointer-events: none; + position: absolute; + top: 4px; + z-index: 4; +} + +.control.has-icon .input:focus + .fa, .control.has-icon .textarea:focus + .fa { + color: #222324; +} + +.control.has-icon .input.is-small + .fa, .control.has-icon .is-small.textarea + .fa { + font-size: 10.5px; + top: 0; +} + +.control.has-icon .input.is-medium + .fa, .control.has-icon .is-medium.textarea + .fa { + font-size: 21px; + top: 8px; +} + +.control.has-icon .input.is-large + .fa, .control.has-icon .is-large.textarea + .fa { + font-size: 21px; + top: 12px; +} + +.control.has-icon:not(.has-icon-right) > .fa { + left: 4px; +} + +.control.has-icon:not(.has-icon-right) .input, .control.has-icon:not(.has-icon-right) .textarea { + padding-left: 32px; +} + +.control.has-icon:not(.has-icon-right) .input.is-small, .control.has-icon:not(.has-icon-right) .is-small.textarea { + padding-left: 24px; +} + +.control.has-icon:not(.has-icon-right) .input.is-small + .fa, .control.has-icon:not(.has-icon-right) .is-small.textarea + .fa { + left: 0; +} + +.control.has-icon:not(.has-icon-right) .input.is-medium, .control.has-icon:not(.has-icon-right) .is-medium.textarea { + padding-left: 40px; +} + +.control.has-icon:not(.has-icon-right) .input.is-medium + .fa, .control.has-icon:not(.has-icon-right) .is-medium.textarea + .fa { + left: 8px; +} + +.control.has-icon:not(.has-icon-right) .input.is-large, .control.has-icon:not(.has-icon-right) .is-large.textarea { + padding-left: 48px; +} + +.control.has-icon:not(.has-icon-right) .input.is-large + .fa, .control.has-icon:not(.has-icon-right) .is-large.textarea + .fa { + left: 12px; +} + +.control.has-icon.has-icon-right > .fa { + right: 4px; +} + +.control.has-icon.has-icon-right .input, .control.has-icon.has-icon-right .textarea { + padding-right: 32px; +} + +.control.has-icon.has-icon-right .input.is-small, .control.has-icon.has-icon-right .is-small.textarea { + padding-right: 24px; +} + +.control.has-icon.has-icon-right .input.is-small + .fa, .control.has-icon.has-icon-right .is-small.textarea + .fa { + right: 0; +} + +.control.has-icon.has-icon-right .input.is-medium, .control.has-icon.has-icon-right .is-medium.textarea { + padding-right: 40px; +} + +.control.has-icon.has-icon-right .input.is-medium + .fa, .control.has-icon.has-icon-right .is-medium.textarea + .fa { + right: 8px; +} + +.control.has-icon.has-icon-right .input.is-large, .control.has-icon.has-icon-right .is-large.textarea { + padding-right: 48px; +} + +.control.has-icon.has-icon-right .input.is-large + .fa, .control.has-icon.has-icon-right .is-large.textarea + .fa { + right: 12px; +} + +.control.is-grouped { + display: flex; + justify-content: flex-start; +} + +.control.is-grouped > .control:not(:last-child) { + margin-bottom: 0; + margin-right: 10px; +} + +.control.is-grouped > .control.is-expanded { + flex-grow: 1; + flex-shrink: 0; +} + +.control.is-grouped.is-grouped-centered { + justify-content: center; +} + +.control.is-grouped.is-grouped-right { + justify-content: flex-end; +} + +@media screen and (min-width: 769px) { + .control.is-horizontal { + display: flex; + } + .control.is-horizontal > .control { + display: flex; + flex-basis: 0; + flex-grow: 5; + flex-shrink: 1; + } +} + +.control.is-loading:after { + position: absolute !important; + right: 8px; + top: 8px; +} + +.image { + display: block; + position: relative; +} + +.image img { + display: block; + height: auto; + width: 100%; +} + +.image.is-square img, .image.is-1by1 img, .image.is-4by3 img, .image.is-3by2 img, .image.is-16by9 img, .image.is-2by1 img { + bottom: 0; + left: 0; + position: absolute; + right: 0; + top: 0; + height: 100%; + width: 100%; +} + +.image.is-square, .image.is-1by1 { + padding-top: 100%; +} + +.image.is-4by3 { + padding-top: 75%; +} + +.image.is-3by2 { + padding-top: 66.6666%; +} + +.image.is-16by9 { + padding-top: 56.25%; +} + +.image.is-2by1 { + padding-top: 50%; +} + +.image.is-16x16 { + height: 16px; + width: 16px; +} + +.image.is-24x24 { + height: 24px; + width: 24px; +} + +.image.is-32x32 { + height: 32px; + width: 32px; +} + +.image.is-48x48 { + height: 48px; + width: 48px; +} + +.image.is-64x64 { + height: 64px; + width: 64px; +} + +.image.is-96x96 { + height: 96px; + width: 96px; +} + +.image.is-128x128 { + height: 128px; + width: 128px; +} + +.notification { + background-color: #f5f7fa; + border-radius: 3px; + padding: 16px 20px; + position: relative; +} + +.notification:after { + clear: both; + content: " "; + display: table; +} + +.notification .delete, .notification .modal-close { + border-radius: 0 3px; + float: right; + margin: -16px -20px 0 20px; +} + +.notification .subtitle, +.notification .title { + color: inherit; +} + +.notification.is-white { + background-color: #fff; + color: #111; +} + +.notification.is-black { + background-color: #111; + color: #fff; +} + +.notification.is-light { + background-color: #f5f7fa; + color: #69707a; +} + +.notification.is-dark { + background-color: #69707a; + color: #f5f7fa; +} + +.notification.is-primary { + background-color: #24ffde; + color: white; +} + +.notification.is-info { + background-color: #2478ff; + color: white; +} + +.notification.is-success { + background-color: #24ff70; + color: white; +} + +.notification.is-warning { + background-color: #ffd324; + color: white; +} + +.notification.is-danger { + background-color: #ff2450; + color: white; +} + +.progress { + -moz-appearance: none; + -webkit-appearance: none; + border: none; + border-radius: 290486px; + display: block; + height: 12px; + overflow: hidden; + padding: 0; + width: 100%; +} + +.progress::-webkit-progress-bar { + background-color: #d3d6db; +} + +.progress::-webkit-progress-value { + background-color: #69707a; +} + +.progress::-moz-progress-bar { + background-color: #69707a; +} + +.progress.is-white::-webkit-progress-value { + background-color: #fff; +} + +.progress.is-white::-moz-progress-bar { + background-color: #fff; +} + +.progress.is-black::-webkit-progress-value { + background-color: #111; +} + +.progress.is-black::-moz-progress-bar { + background-color: #111; +} + +.progress.is-light::-webkit-progress-value { + background-color: #f5f7fa; +} + +.progress.is-light::-moz-progress-bar { + background-color: #f5f7fa; +} + +.progress.is-dark::-webkit-progress-value { + background-color: #69707a; +} + +.progress.is-dark::-moz-progress-bar { + background-color: #69707a; +} + +.progress.is-primary::-webkit-progress-value { + background-color: #24ffde; +} + +.progress.is-primary::-moz-progress-bar { + background-color: #24ffde; +} + +.progress.is-info::-webkit-progress-value { + background-color: #2478ff; +} + +.progress.is-info::-moz-progress-bar { + background-color: #2478ff; +} + +.progress.is-success::-webkit-progress-value { + background-color: #24ff70; +} + +.progress.is-success::-moz-progress-bar { + background-color: #24ff70; +} + +.progress.is-warning::-webkit-progress-value { + background-color: #ffd324; +} + +.progress.is-warning::-moz-progress-bar { + background-color: #ffd324; +} + +.progress.is-danger::-webkit-progress-value { + background-color: #ff2450; +} + +.progress.is-danger::-moz-progress-bar { + background-color: #ff2450; +} + +.progress.is-small { + height: 8px; +} + +.progress.is-medium { + height: 16px; +} + +.progress.is-large { + height: 20px; +} + +.table { + background-color: #fff; + color: #222324; + margin-bottom: 20px; + width: 100%; +} + +.table td, +.table th { + border: 1px solid #d3d6db; + border-width: 0 0 1px; + padding: 8px 10px; + vertical-align: top; +} + +.table td.is-icon, +.table th.is-icon { + padding: 5px; + text-align: center; + white-space: nowrap; + width: 1%; +} + +.table td.is-icon .fa, +.table th.is-icon .fa { + display: inline-block; + font-size: 21px; + height: 24px; + line-height: 24px; + text-align: center; + vertical-align: top; + width: 24px; +} + +.table td.is-icon.is-link, +.table th.is-icon.is-link { + padding: 0; +} + +.table td.is-icon.is-link > a, +.table th.is-icon.is-link > a { + padding: 5px; +} + +.table td.is-link, +.table th.is-link { + padding: 0; +} + +.table td.is-link > a, +.table th.is-link > a { + display: block; + padding: 8px 10px; +} + +.table td.is-link > a:hover, +.table th.is-link > a:hover { + background-color: #24ffde; + color: white; +} + +.table td.is-narrow, +.table th.is-narrow { + white-space: nowrap; + width: 1%; +} + +.table th { + color: #222324; + text-align: left; +} + +.table tr:hover { + background-color: #f5f7fa; + color: #222324; +} + +.table thead td, +.table thead th { + border-width: 0 0 2px; + color: #aeb1b5; +} + +.table tbody tr:last-child td, +.table tbody tr:last-child th { + border-bottom-width: 0; +} + +.table tfoot td, +.table tfoot th { + border-width: 2px 0 0; + color: #aeb1b5; +} + +.table.is-bordered td, +.table.is-bordered th { + border-width: 1px; +} + +.table.is-bordered tr:last-child td, +.table.is-bordered tr:last-child th { + border-bottom-width: 1px; +} + +.table.is-narrow td, +.table.is-narrow th { + padding: 5px 10px; +} + +.table.is-narrow td.is-icon, +.table.is-narrow th.is-icon { + padding: 2px; +} + +.table.is-narrow td.is-icon.is-link, +.table.is-narrow th.is-icon.is-link { + padding: 0; +} + +.table.is-narrow td.is-icon.is-link > a, +.table.is-narrow th.is-icon.is-link > a { + padding: 2px; +} + +.table.is-narrow td.is-link, +.table.is-narrow th.is-link { + padding: 0; +} + +.table.is-narrow td.is-link > a, +.table.is-narrow th.is-link > a { + padding: 5px 10px; +} + +.table.is-striped tbody tr:hover { + background-color: #eef2f7; +} + +.table.is-striped tbody tr:nth-child(2n) { + background-color: #f5f7fa; +} + +.table.is-striped tbody tr:nth-child(2n):hover { + background-color: #eef2f7; +} + +.title, +.subtitle { + font-weight: 300; + word-break: break-word; +} + +.title em, +.title span, +.subtitle em, +.subtitle span { + font-weight: 300; +} + +.title a:hover, +.subtitle a:hover { + border-bottom: 1px solid; +} + +.title strong, +.subtitle strong { + font-weight: 500; +} + +.title .tag, +.subtitle .tag { + vertical-align: bottom; +} + +.title { + color: #222324; + font-size: 28px; + line-height: 1; +} + +.title code { + display: inline-block; + font-size: 28px; +} + +.title strong { + color: inherit; +} + +.title + .highlight { + margin-top: -10px; +} + +.title + .subtitle { + margin-top: -10px; +} + +.title.is-1 { + font-size: 48px; +} + +.title.is-1 code { + font-size: 40px; +} + +.title.is-2 { + font-size: 40px; +} + +.title.is-2 code { + font-size: 28px; +} + +.title.is-3 { + font-size: 28px; +} + +.title.is-3 code { + font-size: 24px; +} + +.title.is-4 { + font-size: 24px; +} + +.title.is-4 code { + font-size: 18px; +} + +.title.is-5 { + font-size: 18px; +} + +.title.is-5 code { + font-size: 14px; +} + +.title.is-6 { + font-size: 14px; +} + +.title.is-6 code { + font-size: 14px; +} + +.title.is-normal { + font-weight: 400; +} + +.title.is-normal strong { + font-weight: 700; +} + +@media screen and (min-width: 769px) { + .title + .subtitle { + margin-top: -15px; + } +} + +.subtitle { + color: #69707a; + font-size: 18px; + line-height: 1.125; +} + +.subtitle code { + border-radius: 3px; + display: inline-block; + font-size: 14px; + padding: 2px 3px; + vertical-align: top; +} + +.subtitle strong { + color: #222324; +} + +.subtitle + .title { + margin-top: -20px; +} + +.subtitle.is-1 { + font-size: 48px; +} + +.subtitle.is-1 code { + font-size: 40px; +} + +.subtitle.is-2 { + font-size: 40px; +} + +.subtitle.is-2 code { + font-size: 28px; +} + +.subtitle.is-3 { + font-size: 28px; +} + +.subtitle.is-3 code { + font-size: 24px; +} + +.subtitle.is-4 { + font-size: 24px; +} + +.subtitle.is-4 code { + font-size: 18px; +} + +.subtitle.is-5 { + font-size: 18px; +} + +.subtitle.is-5 code { + font-size: 14px; +} + +.subtitle.is-6 { + font-size: 14px; +} + +.subtitle.is-6 code { + font-size: 14px; +} + +.subtitle.is-normal { + font-weight: 400; +} + +.subtitle.is-normal strong { + font-weight: 700; +} + +.delete, .modal-close { + -moz-appearance: none; + -webkit-appearance: none; + background-color: rgba(17, 17, 17, 0.2); + border: none; + border-radius: 290486px; + cursor: pointer; + display: inline-block; + height: 24px; + position: relative; + vertical-align: top; + width: 24px; +} + +.delete:before, .modal-close:before, .delete:after, .modal-close:after { + background-color: #fff; + content: ""; + display: block; + height: 2px; + left: 50%; + margin-left: -25%; + margin-top: -1px; + position: absolute; + top: 50%; + width: 50%; +} + +.delete:before, .modal-close:before { + transform: rotate(45deg); +} + +.delete:after, .modal-close:after { + transform: rotate(-45deg); +} + +.delete:hover, .modal-close:hover { + background-color: rgba(17, 17, 17, 0.5); +} + +.delete.is-small, .tag:not(.is-large) .delete, .tag:not(.is-large) .modal-close, .is-small.modal-close { + height: 16px; + width: 16px; +} + +.delete.is-medium, .is-medium.modal-close { + height: 32px; + width: 32px; +} + +.delete.is-large, .is-large.modal-close { + height: 40px; + width: 40px; +} + +.icon { + display: inline-block; + font-size: 21px; + height: 24px; + line-height: 24px; + text-align: center; + vertical-align: top; + width: 24px; +} + +.icon .fa { + font-size: inherit; + line-height: inherit; +} + +.icon.is-small { + display: inline-block; + font-size: 14px; + height: 16px; + line-height: 16px; + text-align: center; + vertical-align: top; + width: 16px; +} + +.icon.is-medium { + display: inline-block; + font-size: 28px; + height: 32px; + line-height: 32px; + text-align: center; + vertical-align: top; + width: 32px; +} + +.icon.is-large { + display: inline-block; + font-size: 42px; + height: 48px; + line-height: 48px; + text-align: center; + vertical-align: top; + width: 48px; +} + +.hamburger, .nav-toggle { + cursor: pointer; + display: block; + height: 50px; + position: relative; + width: 50px; +} + +.hamburger span, .nav-toggle span { + background-color: #69707a; + display: block; + height: 1px; + left: 50%; + margin-left: -7px; + position: absolute; + top: 50%; + transition: none 86ms ease-out; + transition-property: background, left, opacity, transform; + width: 15px; +} + +.hamburger span:nth-child(1), .nav-toggle span:nth-child(1) { + margin-top: -6px; +} + +.hamburger span:nth-child(2), .nav-toggle span:nth-child(2) { + margin-top: -1px; +} + +.hamburger span:nth-child(3), .nav-toggle span:nth-child(3) { + margin-top: 4px; +} + +.hamburger:hover, .nav-toggle:hover { + background-color: #f5f7fa; +} + +.hamburger.is-active span, .is-active.nav-toggle span { + background-color: #24ffde; +} + +.hamburger.is-active span:nth-child(1), .is-active.nav-toggle span:nth-child(1) { + margin-left: -5px; + transform: rotate(45deg); + transform-origin: left top; +} + +.hamburger.is-active span:nth-child(2), .is-active.nav-toggle span:nth-child(2) { + opacity: 0; +} + +.hamburger.is-active span:nth-child(3), .is-active.nav-toggle span:nth-child(3) { + margin-left: -5px; + transform: rotate(-45deg); + transform-origin: left bottom; +} + +.heading { + display: block; + font-size: 11px; + letter-spacing: 1px; + margin-bottom: 5px; + text-transform: uppercase; +} + +.highlight { + font-size: 12px; + font-weight: normal; + max-width: 100%; + overflow: hidden; + padding: 0; +} + +.highlight pre { + overflow: auto; + max-width: 100%; +} + +.loader, .button.is-loading:after, .control.is-loading:after { + animation: spin-around 500ms infinite linear; + border: 2px solid #d3d6db; + border-radius: 290486px; + border-right-color: transparent; + border-top-color: transparent; + content: ""; + display: block; + height: 16px; + position: relative; + width: 16px; +} + +.number { + background-color: #f5f7fa; + border-radius: 290486px; + display: inline-block; + font-size: 18px; + vertical-align: top; +} + +.tag { + align-items: center; + background-color: #f5f7fa; + border-radius: 290486px; + color: #69707a; + display: inline-flex; + font-size: 12px; + height: 24px; + justify-content: center; + line-height: 16px; + padding-left: 10px; + padding-right: 10px; + vertical-align: top; + white-space: nowrap; +} + +.tag .delete, .tag .modal-close { + margin-left: 4px; + margin-right: -6px; +} + +.tag.is-white { + background-color: #fff; + color: #111; +} + +.tag.is-black { + background-color: #111; + color: #fff; +} + +.tag.is-light { + background-color: #f5f7fa; + color: #69707a; +} + +.tag.is-dark { + background-color: #69707a; + color: #f5f7fa; +} + +.tag.is-primary { + background-color: #24ffde; + color: white; +} + +.tag.is-info { + background-color: #2478ff; + color: white; +} + +.tag.is-success { + background-color: #24ff70; + color: white; +} + +.tag.is-warning { + background-color: #ffd324; + color: white; +} + +.tag.is-danger { + background-color: #ff2450; + color: white; +} + +.tag.is-small { + font-size: 11px; + height: 20px; + padding-left: 8px; + padding-right: 8px; +} + +.tag.is-medium { + font-size: 14px; + height: 32px; + padding-left: 14px; + padding-right: 14px; +} + +.tag.is-large { + font-size: 18px; + height: 40px; + line-height: 24px; + padding-left: 18px; + padding-right: 18px; +} + +.tag.is-large .delete, .tag.is-large .modal-close { + margin-left: 4px; + margin-right: -8px; +} + +.unselectable, .is-unselectable, .button, .delete, .modal-close, .tabs { + -webkit-touch-callout: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +.card-header { + align-items: stretch; + box-shadow: 0 1px 2px rgba(17, 17, 17, 0.1); + display: flex; + min-height: 40px; +} + +.card-header-title { + align-items: flex-start; + color: #222324; + display: flex; + flex-grow: 1; + font-weight: bold; + padding: 10px; +} + +.card-header-icon { + align-items: center; + cursor: pointer; + display: flex; + justify-content: center; + width: 40px; +} + +.card-image { + display: block; + position: relative; +} + +.card-content { + padding: 20px; +} + +.card-content .title + .subtitle { + margin-top: -20px; +} + +.card-footer { + border-top: 1px solid #d3d6db; + align-items: stretch; + display: flex; +} + +.card-footer-item { + align-items: center; + display: flex; + flex-grow: 1; + justify-content: center; + padding: 10px; +} + +.card-footer-item:not(:last-child) { + border-right: 1px solid #d3d6db; +} + +.card { + background-color: #fff; + box-shadow: 0 2px 3px rgba(17, 17, 17, 0.1), 0 0 0 1px rgba(17, 17, 17, 0.1); + color: #69707a; + max-width: 100%; + position: relative; + width: 300px; +} + +.card .media:not(:last-child) { + margin-bottom: 10px; +} + +.card.is-fullwidth { + width: 100%; +} + +.card.is-rounded { + border-radius: 5px; +} + +.column { + flex-basis: 0; + flex-grow: 1; + flex-shrink: 1; + padding: 10px; +} + +.columns.is-mobile > .column.is-narrow { + flex: none; +} + +.columns.is-mobile > .column.is-full { + flex: none; + width: 100%; +} + +.columns.is-mobile > .column.is-three-quarters { + flex: none; + width: 75%; +} + +.columns.is-mobile > .column.is-two-thirds { + flex: none; + width: 66.6666%; +} + +.columns.is-mobile > .column.is-half { + flex: none; + width: 50%; +} + +.columns.is-mobile > .column.is-one-third { + flex: none; + width: 33.3333%; +} + +.columns.is-mobile > .column.is-one-quarter { + flex: none; + width: 25%; +} + +.columns.is-mobile > .column.is-offset-three-quarters { + margin-left: 75%; +} + +.columns.is-mobile > .column.is-offset-two-thirds { + margin-left: 66.6666%; +} + +.columns.is-mobile > .column.is-offset-half { + margin-left: 50%; +} + +.columns.is-mobile > .column.is-offset-one-third { + margin-left: 33.3333%; +} + +.columns.is-mobile > .column.is-offset-one-quarter { + margin-left: 25%; +} + +.columns.is-mobile > .column.is-1 { + flex: none; + width: 8.33333%; +} + +.columns.is-mobile > .column.is-offset-1 { + margin-left: 8.33333%; +} + +.columns.is-mobile > .column.is-2 { + flex: none; + width: 16.66667%; +} + +.columns.is-mobile > .column.is-offset-2 { + margin-left: 16.66667%; +} + +.columns.is-mobile > .column.is-3 { + flex: none; + width: 25%; +} + +.columns.is-mobile > .column.is-offset-3 { + margin-left: 25%; +} + +.columns.is-mobile > .column.is-4 { + flex: none; + width: 33.33333%; +} + +.columns.is-mobile > .column.is-offset-4 { + margin-left: 33.33333%; +} + +.columns.is-mobile > .column.is-5 { + flex: none; + width: 41.66667%; +} + +.columns.is-mobile > .column.is-offset-5 { + margin-left: 41.66667%; +} + +.columns.is-mobile > .column.is-6 { + flex: none; + width: 50%; +} + +.columns.is-mobile > .column.is-offset-6 { + margin-left: 50%; +} + +.columns.is-mobile > .column.is-7 { + flex: none; + width: 58.33333%; +} + +.columns.is-mobile > .column.is-offset-7 { + margin-left: 58.33333%; +} + +.columns.is-mobile > .column.is-8 { + flex: none; + width: 66.66667%; +} + +.columns.is-mobile > .column.is-offset-8 { + margin-left: 66.66667%; +} + +.columns.is-mobile > .column.is-9 { + flex: none; + width: 75%; +} + +.columns.is-mobile > .column.is-offset-9 { + margin-left: 75%; +} + +.columns.is-mobile > .column.is-10 { + flex: none; + width: 83.33333%; +} + +.columns.is-mobile > .column.is-offset-10 { + margin-left: 83.33333%; +} + +.columns.is-mobile > .column.is-11 { + flex: none; + width: 91.66667%; +} + +.columns.is-mobile > .column.is-offset-11 { + margin-left: 91.66667%; +} + +.columns.is-mobile > .column.is-12 { + flex: none; + width: 100%; +} + +.columns.is-mobile > .column.is-offset-12 { + margin-left: 100%; +} + +@media screen and (max-width: 768px) { + .column.is-narrow-mobile { + flex: none; + } + .column.is-full-mobile { + flex: none; + width: 100%; + } + .column.is-three-quarters-mobile { + flex: none; + width: 75%; + } + .column.is-two-thirds-mobile { + flex: none; + width: 66.6666%; + } + .column.is-half-mobile { + flex: none; + width: 50%; + } + .column.is-one-third-mobile { + flex: none; + width: 33.3333%; + } + .column.is-one-quarter-mobile { + flex: none; + width: 25%; + } + .column.is-offset-three-quarters-mobile { + margin-left: 75%; + } + .column.is-offset-two-thirds-mobile { + margin-left: 66.6666%; + } + .column.is-offset-half-mobile { + margin-left: 50%; + } + .column.is-offset-one-third-mobile { + margin-left: 33.3333%; + } + .column.is-offset-one-quarter-mobile { + margin-left: 25%; + } + .column.is-1-mobile { + flex: none; + width: 8.33333%; + } + .column.is-offset-1-mobile { + margin-left: 8.33333%; + } + .column.is-2-mobile { + flex: none; + width: 16.66667%; + } + .column.is-offset-2-mobile { + margin-left: 16.66667%; + } + .column.is-3-mobile { + flex: none; + width: 25%; + } + .column.is-offset-3-mobile { + margin-left: 25%; + } + .column.is-4-mobile { + flex: none; + width: 33.33333%; + } + .column.is-offset-4-mobile { + margin-left: 33.33333%; + } + .column.is-5-mobile { + flex: none; + width: 41.66667%; + } + .column.is-offset-5-mobile { + margin-left: 41.66667%; + } + .column.is-6-mobile { + flex: none; + width: 50%; + } + .column.is-offset-6-mobile { + margin-left: 50%; + } + .column.is-7-mobile { + flex: none; + width: 58.33333%; + } + .column.is-offset-7-mobile { + margin-left: 58.33333%; + } + .column.is-8-mobile { + flex: none; + width: 66.66667%; + } + .column.is-offset-8-mobile { + margin-left: 66.66667%; + } + .column.is-9-mobile { + flex: none; + width: 75%; + } + .column.is-offset-9-mobile { + margin-left: 75%; + } + .column.is-10-mobile { + flex: none; + width: 83.33333%; + } + .column.is-offset-10-mobile { + margin-left: 83.33333%; + } + .column.is-11-mobile { + flex: none; + width: 91.66667%; + } + .column.is-offset-11-mobile { + margin-left: 91.66667%; + } + .column.is-12-mobile { + flex: none; + width: 100%; + } + .column.is-offset-12-mobile { + margin-left: 100%; + } +} + +@media screen and (min-width: 769px) { + .column.is-narrow, .column.is-narrow-tablet { + flex: none; + } + .column.is-full, .column.is-full-tablet { + flex: none; + width: 100%; + } + .column.is-three-quarters, .column.is-three-quarters-tablet { + flex: none; + width: 75%; + } + .column.is-two-thirds, .column.is-two-thirds-tablet { + flex: none; + width: 66.6666%; + } + .column.is-half, .column.is-half-tablet { + flex: none; + width: 50%; + } + .column.is-one-third, .column.is-one-third-tablet { + flex: none; + width: 33.3333%; + } + .column.is-one-quarter, .column.is-one-quarter-tablet { + flex: none; + width: 25%; + } + .column.is-offset-three-quarters, .column.is-offset-three-quarters-tablet { + margin-left: 75%; + } + .column.is-offset-two-thirds, .column.is-offset-two-thirds-tablet { + margin-left: 66.6666%; + } + .column.is-offset-half, .column.is-offset-half-tablet { + margin-left: 50%; + } + .column.is-offset-one-third, .column.is-offset-one-third-tablet { + margin-left: 33.3333%; + } + .column.is-offset-one-quarter, .column.is-offset-one-quarter-tablet { + margin-left: 25%; + } + .column.is-1, .column.is-1-tablet { + flex: none; + width: 8.33333%; + } + .column.is-offset-1, .column.is-offset-1-tablet { + margin-left: 8.33333%; + } + .column.is-2, .column.is-2-tablet { + flex: none; + width: 16.66667%; + } + .column.is-offset-2, .column.is-offset-2-tablet { + margin-left: 16.66667%; + } + .column.is-3, .column.is-3-tablet { + flex: none; + width: 25%; + } + .column.is-offset-3, .column.is-offset-3-tablet { + margin-left: 25%; + } + .column.is-4, .column.is-4-tablet { + flex: none; + width: 33.33333%; + } + .column.is-offset-4, .column.is-offset-4-tablet { + margin-left: 33.33333%; + } + .column.is-5, .column.is-5-tablet { + flex: none; + width: 41.66667%; + } + .column.is-offset-5, .column.is-offset-5-tablet { + margin-left: 41.66667%; + } + .column.is-6, .column.is-6-tablet { + flex: none; + width: 50%; + } + .column.is-offset-6, .column.is-offset-6-tablet { + margin-left: 50%; + } + .column.is-7, .column.is-7-tablet { + flex: none; + width: 58.33333%; + } + .column.is-offset-7, .column.is-offset-7-tablet { + margin-left: 58.33333%; + } + .column.is-8, .column.is-8-tablet { + flex: none; + width: 66.66667%; + } + .column.is-offset-8, .column.is-offset-8-tablet { + margin-left: 66.66667%; + } + .column.is-9, .column.is-9-tablet { + flex: none; + width: 75%; + } + .column.is-offset-9, .column.is-offset-9-tablet { + margin-left: 75%; + } + .column.is-10, .column.is-10-tablet { + flex: none; + width: 83.33333%; + } + .column.is-offset-10, .column.is-offset-10-tablet { + margin-left: 83.33333%; + } + .column.is-11, .column.is-11-tablet { + flex: none; + width: 91.66667%; + } + .column.is-offset-11, .column.is-offset-11-tablet { + margin-left: 91.66667%; + } + .column.is-12, .column.is-12-tablet { + flex: none; + width: 100%; + } + .column.is-offset-12, .column.is-offset-12-tablet { + margin-left: 100%; + } +} + +@media screen and (min-width: 980px) { + .column.is-narrow-desktop { + flex: none; + } + .column.is-full-desktop { + flex: none; + width: 100%; + } + .column.is-three-quarters-desktop { + flex: none; + width: 75%; + } + .column.is-two-thirds-desktop { + flex: none; + width: 66.6666%; + } + .column.is-half-desktop { + flex: none; + width: 50%; + } + .column.is-one-third-desktop { + flex: none; + width: 33.3333%; + } + .column.is-one-quarter-desktop { + flex: none; + width: 25%; + } + .column.is-offset-three-quarters-desktop { + margin-left: 75%; + } + .column.is-offset-two-thirds-desktop { + margin-left: 66.6666%; + } + .column.is-offset-half-desktop { + margin-left: 50%; + } + .column.is-offset-one-third-desktop { + margin-left: 33.3333%; + } + .column.is-offset-one-quarter-desktop { + margin-left: 25%; + } + .column.is-1-desktop { + flex: none; + width: 8.33333%; + } + .column.is-offset-1-desktop { + margin-left: 8.33333%; + } + .column.is-2-desktop { + flex: none; + width: 16.66667%; + } + .column.is-offset-2-desktop { + margin-left: 16.66667%; + } + .column.is-3-desktop { + flex: none; + width: 25%; + } + .column.is-offset-3-desktop { + margin-left: 25%; + } + .column.is-4-desktop { + flex: none; + width: 33.33333%; + } + .column.is-offset-4-desktop { + margin-left: 33.33333%; + } + .column.is-5-desktop { + flex: none; + width: 41.66667%; + } + .column.is-offset-5-desktop { + margin-left: 41.66667%; + } + .column.is-6-desktop { + flex: none; + width: 50%; + } + .column.is-offset-6-desktop { + margin-left: 50%; + } + .column.is-7-desktop { + flex: none; + width: 58.33333%; + } + .column.is-offset-7-desktop { + margin-left: 58.33333%; + } + .column.is-8-desktop { + flex: none; + width: 66.66667%; + } + .column.is-offset-8-desktop { + margin-left: 66.66667%; + } + .column.is-9-desktop { + flex: none; + width: 75%; + } + .column.is-offset-9-desktop { + margin-left: 75%; + } + .column.is-10-desktop { + flex: none; + width: 83.33333%; + } + .column.is-offset-10-desktop { + margin-left: 83.33333%; + } + .column.is-11-desktop { + flex: none; + width: 91.66667%; + } + .column.is-offset-11-desktop { + margin-left: 91.66667%; + } + .column.is-12-desktop { + flex: none; + width: 100%; + } + .column.is-offset-12-desktop { + margin-left: 100%; + } +} + +@media screen and (min-width: 1180px) { + .column.is-narrow-widescreen { + flex: none; + } + .column.is-full-widescreen { + flex: none; + width: 100%; + } + .column.is-three-quarters-widescreen { + flex: none; + width: 75%; + } + .column.is-two-thirds-widescreen { + flex: none; + width: 66.6666%; + } + .column.is-half-widescreen { + flex: none; + width: 50%; + } + .column.is-one-third-widescreen { + flex: none; + width: 33.3333%; + } + .column.is-one-quarter-widescreen { + flex: none; + width: 25%; + } + .column.is-offset-three-quarters-widescreen { + margin-left: 75%; + } + .column.is-offset-two-thirds-widescreen { + margin-left: 66.6666%; + } + .column.is-offset-half-widescreen { + margin-left: 50%; + } + .column.is-offset-one-third-widescreen { + margin-left: 33.3333%; + } + .column.is-offset-one-quarter-widescreen { + margin-left: 25%; + } + .column.is-1-widescreen { + flex: none; + width: 8.33333%; + } + .column.is-offset-1-widescreen { + margin-left: 8.33333%; + } + .column.is-2-widescreen { + flex: none; + width: 16.66667%; + } + .column.is-offset-2-widescreen { + margin-left: 16.66667%; + } + .column.is-3-widescreen { + flex: none; + width: 25%; + } + .column.is-offset-3-widescreen { + margin-left: 25%; + } + .column.is-4-widescreen { + flex: none; + width: 33.33333%; + } + .column.is-offset-4-widescreen { + margin-left: 33.33333%; + } + .column.is-5-widescreen { + flex: none; + width: 41.66667%; + } + .column.is-offset-5-widescreen { + margin-left: 41.66667%; + } + .column.is-6-widescreen { + flex: none; + width: 50%; + } + .column.is-offset-6-widescreen { + margin-left: 50%; + } + .column.is-7-widescreen { + flex: none; + width: 58.33333%; + } + .column.is-offset-7-widescreen { + margin-left: 58.33333%; + } + .column.is-8-widescreen { + flex: none; + width: 66.66667%; + } + .column.is-offset-8-widescreen { + margin-left: 66.66667%; + } + .column.is-9-widescreen { + flex: none; + width: 75%; + } + .column.is-offset-9-widescreen { + margin-left: 75%; + } + .column.is-10-widescreen { + flex: none; + width: 83.33333%; + } + .column.is-offset-10-widescreen { + margin-left: 83.33333%; + } + .column.is-11-widescreen { + flex: none; + width: 91.66667%; + } + .column.is-offset-11-widescreen { + margin-left: 91.66667%; + } + .column.is-12-widescreen { + flex: none; + width: 100%; + } + .column.is-offset-12-widescreen { + margin-left: 100%; + } +} + +.columns { + margin-left: -10px; + margin-right: -10px; + margin-top: -10px; +} + +.columns:last-child { + margin-bottom: -10px; +} + +.columns:not(:last-child) { + margin-bottom: 10px; +} + +.columns.is-centered { + justify-content: center; +} + +.columns.is-gapless { + margin-left: 0; + margin-right: 0; + margin-top: 0; +} + +.columns.is-gapless:last-child { + margin-bottom: 0; +} + +.columns.is-gapless:not(:last-child) { + margin-bottom: 20px; +} + +.columns.is-gapless > .column { + margin: 0; + padding: 0; +} + +@media screen and (min-width: 769px) { + .columns.is-grid { + flex-wrap: wrap; + } + .columns.is-grid > .column { + max-width: 33.3333%; + padding: 10px; + width: 33.3333%; + } + .columns.is-grid > .column + .column { + margin-left: 0; + } +} + +.columns.is-mobile { + display: flex; +} + +.columns.is-multiline { + flex-wrap: wrap; +} + +.columns.is-vcentered { + align-items: center; +} + +@media screen and (min-width: 769px) { + .columns:not(.is-desktop) { + display: flex; + } +} + +@media screen and (min-width: 980px) { + .columns.is-desktop { + display: flex; + } +} + +.tile { + align-items: stretch; + flex-basis: auto; + flex-grow: 1; + flex-shrink: 1; + min-height: min-content; +} + +.tile.is-ancestor { + margin-left: -10px; + margin-right: -10px; + margin-top: -10px; +} + +.tile.is-ancestor:last-child { + margin-bottom: -10px; +} + +.tile.is-ancestor:not(:last-child) { + margin-bottom: 10px; +} + +.tile.is-child { + margin: 0 !important; +} + +.tile.is-parent { + padding: 10px; +} + +.tile.is-vertical { + flex-direction: column; +} + +.tile.is-vertical > .tile.is-child:not(:last-child) { + margin-bottom: 20px !important; +} + +@media screen and (min-width: 769px) { + .tile:not(.is-child) { + display: flex; + } + .tile.is-1 { + flex: none; + width: 8.33333%; + } + .tile.is-2 { + flex: none; + width: 16.66667%; + } + .tile.is-3 { + flex: none; + width: 25%; + } + .tile.is-4 { + flex: none; + width: 33.33333%; + } + .tile.is-5 { + flex: none; + width: 41.66667%; + } + .tile.is-6 { + flex: none; + width: 50%; + } + .tile.is-7 { + flex: none; + width: 58.33333%; + } + .tile.is-8 { + flex: none; + width: 66.66667%; + } + .tile.is-9 { + flex: none; + width: 75%; + } + .tile.is-10 { + flex: none; + width: 83.33333%; + } + .tile.is-11 { + flex: none; + width: 91.66667%; + } + .tile.is-12 { + flex: none; + width: 100%; + } +} + +.highlight { + background-color: #fdf6e3; + color: #586e75; +} + +.highlight .c { + color: #93a1a1; +} + +.highlight .err, +.highlight .g { + color: #586e75; +} + +.highlight .k { + color: #859900; +} + +.highlight .l, +.highlight .n { + color: #586e75; +} + +.highlight .o { + color: #859900; +} + +.highlight .x { + color: #cb4b16; +} + +.highlight .p { + color: #586e75; +} + +.highlight .cm { + color: #93a1a1; +} + +.highlight .cp { + color: #859900; +} + +.highlight .c1 { + color: #93a1a1; +} + +.highlight .cs { + color: #859900; +} + +.highlight .gd { + color: #2aa198; +} + +.highlight .ge { + color: #586e75; + font-style: italic; +} + +.highlight .gr { + color: #dc322f; +} + +.highlight .gh { + color: #cb4b16; +} + +.highlight .gi { + color: #859900; +} + +.highlight .go, +.highlight .gp { + color: #586e75; +} + +.highlight .gs { + color: #586e75; + font-weight: bold; +} + +.highlight .gu { + color: #cb4b16; +} + +.highlight .gt { + color: #586e75; +} + +.highlight .kc { + color: #cb4b16; +} + +.highlight .kd { + color: #268bd2; +} + +.highlight .kn, +.highlight .kp { + color: #859900; +} + +.highlight .kr { + color: #268bd2; +} + +.highlight .kt { + color: #dc322f; +} + +.highlight .ld { + color: #586e75; +} + +.highlight .m, +.highlight .s { + color: #2aa198; +} + +.highlight .na { + color: #B58900; +} + +.highlight .nb { + color: #586e75; +} + +.highlight .nc { + color: #268bd2; +} + +.highlight .no { + color: #cb4b16; +} + +.highlight .nd { + color: #268bd2; +} + +.highlight .ni, +.highlight .ne { + color: #cb4b16; +} + +.highlight .nf { + color: #268bd2; +} + +.highlight .nl, +.highlight .nn, +.highlight .nx, +.highlight .py { + color: #586e75; +} + +.highlight .nt, +.highlight .nv { + color: #268bd2; +} + +.highlight .ow { + color: #859900; +} + +.highlight .w { + color: #586e75; +} + +.highlight .mf, +.highlight .mh, +.highlight .mi, +.highlight .mo { + color: #2aa198; +} + +.highlight .sb { + color: #93a1a1; +} + +.highlight .sc { + color: #2aa198; +} + +.highlight .sd { + color: #586e75; +} + +.highlight .s2 { + color: #2aa198; +} + +.highlight .se { + color: #cb4b16; +} + +.highlight .sh { + color: #586e75; +} + +.highlight .si, +.highlight .sx { + color: #2aa198; +} + +.highlight .sr { + color: #dc322f; +} + +.highlight .s1, +.highlight .ss { + color: #2aa198; +} + +.highlight .bp, +.highlight .vc, +.highlight .vg, +.highlight .vi { + color: #268bd2; +} + +.highlight .il { + color: #2aa198; +} + +.level-item .title, +.level-item .subtitle { + margin-bottom: 0; +} + +@media screen and (max-width: 768px) { + .level-item:not(:last-child) { + margin-bottom: 10px; + } +} + +.level-left .level-item:not(:last-child), +.level-right .level-item:not(:last-child) { + margin-right: 10px; +} + +.level-left .level-item.is-flexible, +.level-right .level-item.is-flexible { + flex-grow: 1; +} + +@media screen and (max-width: 768px) { + .level-left + .level-right { + margin-top: 20px; + } +} + +@media screen and (min-width: 769px) { + .level-left { + align-items: center; + display: flex; + } +} + +@media screen and (min-width: 769px) { + .level-right { + align-items: center; + display: flex; + justify-content: flex-end; + } +} + +.level { + align-items: center; + justify-content: space-between; +} + +.level code { + border-radius: 3px; +} + +.level img { + display: inline-block; + vertical-align: top; +} + +.level.is-mobile { + display: flex; +} + +.level.is-mobile > .level-item:not(:last-child) { + margin-bottom: 0; +} + +.level.is-mobile > .level-item:not(.is-narrow) { + flex-grow: 1; +} + +@media screen and (min-width: 769px) { + .level { + display: flex; + } + .level > .level-item:not(.is-narrow) { + flex-grow: 1; + } +} + +.media-number { + background-color: #f5f7fa; + border-radius: 290486px; + display: inline-block; + font-size: 18px; + height: 32px; + line-height: 24px; + min-width: 32px; + padding: 4px 8px; + text-align: center; + vertical-align: top; +} + +@media screen and (max-width: 768px) { + .media-number { + margin-bottom: 10px; + } +} + +@media screen and (min-width: 769px) { + .media-number { + margin-right: 10px; + } +} + +.media-left { + margin-right: 10px; +} + +.media-right { + margin-left: 10px; +} + +.media-content { + flex-grow: 1; + flex-shrink: 1; + text-align: left; +} + +.media { + align-items: flex-start; + display: flex; + text-align: left; +} + +.media .content:not(:last-child) { + margin-bottom: 10px; +} + +.media .media { + border-top: 1px solid rgba(211, 214, 219, 0.5); + display: flex; + padding-top: 10px; +} + +.media .media .content:not(:last-child), +.media .media .control:not(:last-child) { + margin-bottom: 5px; +} + +.media .media .media { + padding-top: 5px; +} + +.media .media .media + .media { + margin-top: 5px; +} + +.media + .media { + border-top: 1px solid rgba(211, 214, 219, 0.5); + margin-top: 10px; + padding-top: 10px; +} + +.media.is-large + .media { + margin-top: 20px; + padding-top: 20px; +} + +@media screen and (min-width: 769px) { + .media.is-large .media-number { + margin-right: 20px; + } +} + +.menu-nav a { + display: block; + padding: 5px 10px; +} + +.menu-list a { + border-radius: 2px; + color: #69707a; + display: block; + padding: 5px 10px; +} + +.menu-list a:hover { + background-color: #f5f7fa; + color: #24ffde; +} + +.menu-list a.is-active { + background-color: #24ffde; + color: white; +} + +.menu-list li ul { + border-left: 1px solid #d3d6db; + margin: 10px; + padding-left: 10px; +} + +.menu-label { + color: #aeb1b5; + font-size: 11px; + letter-spacing: 1px; + margin-bottom: 5px; + text-transform: uppercase; +} + +.menu-label:not(:first-child) { + margin-top: 20px; +} + +.message-body { + border: 1px solid #d3d6db; + border-radius: 3px; + padding: 12px 15px; +} + +.message-body strong { + color: inherit; +} + +.message-header { + background-color: #69707a; + border-radius: 3px 3px 0 0; + color: white; + padding: 7px 10px; +} + +.message-header strong { + color: inherit; +} + +.message-header + .message-body { + border-radius: 0 0 3px 3px; + border-top: none; +} + +.message { + background-color: #f5f7fa; + border-radius: 3px; +} + +.message.is-white { + background-color: white; +} + +.message.is-white .message-header { + background-color: #fff; + color: #111; +} + +.message.is-white .message-body { + border-color: #fff; + color: #666666; +} + +.message.is-black { + background-color: whitesmoke; +} + +.message.is-black .message-header { + background-color: #111; + color: #fff; +} + +.message.is-black .message-body { + border-color: #111; + color: gray; +} + +.message.is-light { + background-color: #f5f7fa; +} + +.message.is-light .message-header { + background-color: #f5f7fa; + color: #69707a; +} + +.message.is-light .message-body { + border-color: #f5f7fa; + color: #666666; +} + +.message.is-dark { + background-color: #f4f5f6; +} + +.message.is-dark .message-header { + background-color: #69707a; + color: #f5f7fa; +} + +.message.is-dark .message-body { + border-color: #69707a; + color: gray; +} + +.message.is-primary { + background-color: #ebfffc; +} + +.message.is-primary .message-header { + background-color: #24ffde; + color: white; +} + +.message.is-primary .message-body { + border-color: #24ffde; + color: gray; +} + +.message.is-info { + background-color: #ebf2ff; +} + +.message.is-info .message-header { + background-color: #2478ff; + color: white; +} + +.message.is-info .message-body { + border-color: #2478ff; + color: gray; +} + +.message.is-success { + background-color: #ebfff2; +} + +.message.is-success .message-header { + background-color: #24ff70; + color: white; +} + +.message.is-success .message-body { + border-color: #24ff70; + color: gray; +} + +.message.is-warning { + background-color: #fffbeb; +} + +.message.is-warning .message-header { + background-color: #ffd324; + color: white; +} + +.message.is-warning .message-body { + border-color: #ffd324; + color: gray; +} + +.message.is-danger { + background-color: #ffebef; +} + +.message.is-danger .message-header { + background-color: #ff2450; + color: white; +} + +.message.is-danger .message-body { + border-color: #ff2450; + color: gray; +} + +.modal-background { + bottom: 0; + left: 0; + position: absolute; + right: 0; + top: 0; + background-color: rgba(17, 17, 17, 0.86); +} + +.modal-content, .modal-card { + margin: 0 20px; + max-height: calc(100vh - 160px); + overflow: auto; + position: relative; + width: 100%; +} + +@media screen and (min-width: 769px) { + .modal-content, .modal-card { + margin: 0 auto; + max-height: calc(100vh - 40px); + width: 640px; + } +} + +.modal-close { + background: none; + height: 40px; + position: fixed; + right: 20px; + top: 20px; + width: 40px; +} + +.modal-card { + display: flex; + flex-direction: column; + max-height: calc(100vh - 40px); + overflow: hidden; +} + +.modal-card-head, +.modal-card-foot { + align-items: center; + background-color: #f5f7fa; + display: flex; + flex-shrink: 0; + justify-content: flex-start; + padding: 20px; + position: relative; +} + +.modal-card-head { + border-bottom: 1px solid #d3d6db; + border-top-left-radius: 5px; + border-top-right-radius: 5px; +} + +.modal-card-title { + color: #222324; + flex-grow: 1; + flex-shrink: 0; + font-size: 24px; + line-height: 1; +} + +.modal-card-foot { + border-bottom-left-radius: 5px; + border-bottom-right-radius: 5px; + border-top: 1px solid #d3d6db; +} + +.modal-card-foot .button:not(:last-child) { + margin-right: 10px; +} + +.modal-card-body { + background-color: #fff; + flex-grow: 1; + flex-shrink: 1; + overflow: auto; + padding: 20px; +} + +.modal { + bottom: 0; + left: 0; + position: absolute; + right: 0; + top: 0; + align-items: center; + display: none; + justify-content: center; + overflow: hidden; + position: fixed; + z-index: 1986; +} + +.modal.is-active { + display: flex; +} + +@media screen and (min-width: 769px) { + .nav-toggle { + display: none; + } +} + +.nav-item { + align-items: center; + display: flex; + justify-content: center; + padding: 10px; +} + +.nav-item a { + flex-grow: 1; + flex-shrink: 0; +} + +.nav-item img { + max-height: 24px; +} + +.nav-item .button + .button { + margin-left: 10px; +} + +.nav-item .tag:first-child { + margin-right: 5px; +} + +.nav-item .tag:last-child { + margin-left: 5px; +} + +@media screen and (max-width: 768px) { + .nav-item { + justify-content: flex-start; + } +} + +.nav-item a, +a.nav-item { + color: #69707a; +} + +.nav-item a:hover, +a.nav-item:hover { + color: #222324; +} + +.nav-item a.is-active, +a.nav-item.is-active { + color: #222324; +} + +.nav-item a.is-tab, +a.nav-item.is-tab { + border-bottom: 1px solid transparent; + border-top: 1px solid transparent; + padding-left: 12px; + padding-right: 12px; +} + +.nav-item a.is-tab:hover, +a.nav-item.is-tab:hover { + border-bottom: 1px solid #24ffde; + border-top: 1px solid transparent; +} + +.nav-item a.is-tab.is-active, +a.nav-item.is-tab.is-active { + border-bottom: 3px solid #24ffde; + border-top: 3px solid transparent; + color: #24ffde; +} + +@media screen and (max-width: 768px) { + .nav-menu { + background-color: #fff; + box-shadow: 0 4px 7px rgba(17, 17, 17, 0.1); + left: 0; + display: none; + right: 0; + top: 100%; + position: absolute; + } + .nav-menu .nav-item { + border-top: 1px solid rgba(211, 214, 219, 0.5); + padding: 10px; + } + .nav-menu.is-active { + display: block; + } +} + +@media screen and (min-width: 769px) and (max-width: 979px) { + .nav-menu { + padding-right: 20px; + } +} + +.nav-left { + align-items: stretch; + display: flex; + flex-basis: 0; + flex-grow: 1; + flex-shrink: 0; + justify-content: flex-start; + overflow: hidden; + overflow-x: auto; + white-space: nowrap; +} + +.nav-center { + align-items: stretch; + display: flex; + justify-content: center; + margin-left: auto; + margin-right: auto; +} + +@media screen and (min-width: 769px) { + .nav-right { + align-items: stretch; + display: flex; + flex-basis: 0; + flex-grow: 1; + flex-shrink: 0; + justify-content: flex-end; + } +} + +.nav { + align-items: stretch; + background-color: #fff; + display: flex; + min-height: 50px; + position: relative; + text-align: center; + z-index: 2; +} + +.nav > .container { + align-items: stretch; + display: flex; + min-height: 50px; + width: 100%; +} + +.nav > .container > .nav-left > .nav-item:first-child:not(.is-tab) { + padding-left: 0; +} + +.nav > .container > .nav-right > .nav-item:last-child:not(.is-tab) { + padding-right: 0; +} + +.container > .nav > .nav-left > .nav-item:first-child:not(.is-tab) { + padding-left: 0; +} + +.container > .nav > .nav-right > .nav-item:last-child:not(.is-tab) { + padding-right: 0; +} + +.nav.has-shadow { + box-shadow: 0 2px 3px rgba(17, 17, 17, 0.1); +} + +@media screen and (max-width: 979px) { + .nav > .container > .nav-left > .nav-item.is-brand:first-child, + .container > .nav > .nav-left > .nav-item.is-brand:first-child { + padding-left: 20px; + } +} + +.pagination { + align-items: center; + display: flex; + justify-content: center; + text-align: center; +} + +.pagination a { + display: block; + min-width: 32px; + padding: 3px 8px; +} + +.pagination span { + color: #aeb1b5; + display: block; + margin: 0 4px; +} + +.pagination li { + margin: 0 2px; +} + +.pagination ul { + align-items: center; + display: flex; + flex-grow: 1; + flex-shrink: 0; + justify-content: center; +} + +@media screen and (max-width: 768px) { + .pagination { + flex-wrap: wrap; + } + .pagination > a { + width: calc(50% - 5px); + } + .pagination > a:not(:first-child) { + margin-left: 10px; + } + .pagination li { + flex-grow: 1; + flex-shrink: 0; + } + .pagination ul { + margin-top: 10px; + } +} + +@media screen and (min-width: 769px) { + .pagination > a:not(:first-child) { + order: 1; + } +} + +.panel-icon { + display: inline-block; + font-size: 14px; + height: 16px; + line-height: 16px; + text-align: center; + vertical-align: top; + width: 16px; + color: #aeb1b5; + float: left; + margin: 0 4px 0 -2px; +} + +.panel-icon .fa { + font-size: inherit; + line-height: inherit; +} + +.panel-heading { + background-color: #f5f7fa; + border-bottom: 1px solid #d3d6db; + border-radius: 4px 4px 0 0; + color: #222324; + font-size: 18px; + font-weight: 300; + padding: 10px; +} + +.panel-list a { + color: #69707a; +} + +.panel-list a:hover { + color: #24ffde; +} + +.panel-tabs { + display: flex; + font-size: 11px; + padding: 5px 10px 0; + justify-content: center; +} + +.panel-tabs a { + border-bottom: 1px solid #d3d6db; + margin-bottom: -1px; + padding: 5px; +} + +.panel-tabs a.is-active { + border-bottom-color: #222324; + color: #222324; +} + +.panel-tabs:not(:last-child) { + border-bottom: 1px solid #d3d6db; +} + +.panel-block { + color: #222324; + display: block; + line-height: 16px; + padding: 10px; +} + +.panel-block:not(:last-child) { + border-bottom: 1px solid #d3d6db; +} + +a.panel-block:hover { + background-color: #f5f7fa; +} + +.panel { + border: 1px solid #d3d6db; + border-radius: 5px; +} + +.panel:not(:last-child) { + margin-bottom: 20px; +} + +.tabs { + align-items: stretch; + display: flex; + justify-content: space-between; + line-height: 24px; + overflow: hidden; + overflow-x: auto; + white-space: nowrap; +} + +.tabs a { + align-items: center; + border-bottom: 1px solid #d3d6db; + color: #69707a; + display: flex; + justify-content: center; + margin-bottom: -1px; + padding: 6px 12px; + vertical-align: top; +} + +.tabs a:hover { + border-bottom-color: #222324; + color: #222324; +} + +.tabs li { + display: block; +} + +.tabs li.is-active a { + border-bottom-color: #24ffde; + color: #24ffde; +} + +.tabs ul { + align-items: center; + border-bottom: 1px solid #d3d6db; + display: flex; + flex-grow: 1; + flex-shrink: 0; + justify-content: flex-start; +} + +.tabs ul.is-left { + padding-right: 10px; +} + +.tabs ul.is-center { + flex: none; + justify-content: center; + padding-left: 10px; + padding-right: 10px; +} + +.tabs ul.is-right { + justify-content: flex-end; + padding-left: 10px; +} + +.tabs .icon:first-child { + margin-right: 8px; +} + +.tabs .icon:last-child { + margin-left: 8px; +} + +.tabs.is-centered ul { + justify-content: center; +} + +.tabs.is-right ul { + justify-content: flex-end; +} + +.tabs.is-boxed a { + border: 1px solid transparent; + border-radius: 3px 3px 0 0; + padding-bottom: 5px; + padding-top: 5px; +} + +.tabs.is-boxed a:hover { + background-color: #f5f7fa; + border-bottom-color: #d3d6db; +} + +.tabs.is-boxed li.is-active a { + background-color: #fff; + border-color: #d3d6db; + border-bottom-color: transparent !important; +} + +.tabs.is-fullwidth li { + flex-grow: 1; + flex-shrink: 0; +} + +.tabs.is-toggle a { + border: 1px solid #d3d6db; + margin-bottom: 0; + padding-bottom: 5px; + padding-top: 5px; + position: relative; +} + +.tabs.is-toggle a:hover { + background-color: #f5f7fa; + border-color: #aeb1b5; + z-index: 2; +} + +.tabs.is-toggle li + li { + margin-left: -1px; +} + +.tabs.is-toggle li:first-child a { + border-radius: 3px 0 0 3px; +} + +.tabs.is-toggle li:last-child a { + border-radius: 0 3px 3px 0; +} + +.tabs.is-toggle li.is-active a { + background-color: #24ffde; + border-color: #24ffde; + color: white; + z-index: 1; +} + +.tabs.is-toggle ul { + border-bottom: none; +} + +.tabs.is-small { + font-size: 11px; +} + +.tabs.is-small a { + padding: 2px 8px; +} + +.tabs.is-small.is-boxed a, .tabs.is-small.is-toggle a { + padding-bottom: 1px; + padding-top: 1px; +} + +.tabs.is-medium { + font-size: 18px; +} + +.tabs.is-medium a { + padding: 10px 16px; +} + +.tabs.is-medium.is-boxed a, .tabs.is-medium.is-toggle a { + padding-bottom: 9px; + padding-top: 9px; +} + +.tabs.is-large { + font-size: 28px; +} + +.tabs.is-large a { + padding: 14px 20px; +} + +.tabs.is-large.is-boxed a, .tabs.is-large.is-toggle a { + padding-bottom: 13px; + padding-top: 13px; +} + +.hero-video { + bottom: 0; + left: 0; + position: absolute; + right: 0; + top: 0; + overflow: hidden; +} + +.hero-video video { + left: 50%; + min-height: 100%; + min-width: 100%; + position: absolute; + top: 50%; + transform: translate3d(-50%, -50%, 0); +} + +.hero-video.is-transparent { + opacity: 0.3; +} + +@media screen and (max-width: 768px) { + .hero-video { + display: none; + } +} + +.hero-buttons { + margin-top: 20px; +} + +@media screen and (max-width: 768px) { + .hero-buttons .button { + display: flex; + } + .hero-buttons .button:not(:last-child) { + margin-bottom: 10px; + } +} + +@media screen and (min-width: 769px) { + .hero-buttons { + display: flex; + justify-content: center; + } + .hero-buttons .button:not(:last-child) { + margin-right: 20px; + } +} + +.hero-head, +.hero-foot { + flex-shrink: 0; +} + +.hero-body { + flex-grow: 1; + flex-shrink: 0; + padding: 40px 20px; +} + +@media screen and (min-width: 1240px) { + .hero-body { + padding-left: 0; + padding-right: 0; + } +} + +.hero { + align-items: stretch; + background-color: #fff; + display: flex; + flex-direction: column; + justify-content: space-between; +} + +.hero .nav { + background: none; + box-shadow: 0 1px 0 rgba(211, 214, 219, 0.3); +} + +.hero .tabs ul { + border-bottom: none; +} + +.hero.is-white { + background-color: #fff; + color: #111; +} + +.hero.is-white .title { + color: #111; +} + +.hero.is-white .title a, +.hero.is-white .title strong { + color: inherit; +} + +.hero.is-white .subtitle { + color: rgba(17, 17, 17, 0.7); +} + +.hero.is-white .subtitle a, +.hero.is-white .subtitle strong { + color: #111; +} + +.hero.is-white .nav { + box-shadow: 0 1px 0 rgba(17, 17, 17, 0.2); +} + +@media screen and (max-width: 768px) { + .hero.is-white .nav-menu { + background-color: #fff; + } +} + +.hero.is-white a.nav-item, +.hero.is-white .nav-item a:not(.button) { + color: rgba(17, 17, 17, 0.5); +} + +.hero.is-white a.nav-item:hover, .hero.is-white a.nav-item.is-active, +.hero.is-white .nav-item a:not(.button):hover, +.hero.is-white .nav-item a:not(.button).is-active { + color: #111; +} + +.hero.is-white .tabs a { + color: #111; + opacity: 0.5; +} + +.hero.is-white .tabs a:hover { + opacity: 1; +} + +.hero.is-white .tabs li.is-active a { + opacity: 1; +} + +.hero.is-white .tabs.is-boxed a, .hero.is-white .tabs.is-toggle a { + color: #111; +} + +.hero.is-white .tabs.is-boxed a:hover, .hero.is-white .tabs.is-toggle a:hover { + background-color: rgba(17, 17, 17, 0.1); +} + +.hero.is-white .tabs.is-boxed li.is-active a, .hero.is-white .tabs.is-boxed li.is-active a:hover, .hero.is-white .tabs.is-toggle li.is-active a, .hero.is-white .tabs.is-toggle li.is-active a:hover { + background-color: #111; + border-color: #111; + color: #fff; +} + +.hero.is-white.is-bold { + background-image: linear-gradient(141deg, #e6e6e6 0%, #fff 71%, white 100%); +} + +@media screen and (max-width: 768px) { + .hero.is-white .nav-toggle span { + background-color: #111; + } + .hero.is-white .nav-toggle:hover { + background-color: rgba(17, 17, 17, 0.1); + } + .hero.is-white .nav-toggle.is-active span { + background-color: #111; + } + .hero.is-white .nav-menu .nav-item { + border-top-color: rgba(17, 17, 17, 0.2); + } +} + +.hero.is-black { + background-color: #111; + color: #fff; +} + +.hero.is-black .title { + color: #fff; +} + +.hero.is-black .title a, +.hero.is-black .title strong { + color: inherit; +} + +.hero.is-black .subtitle { + color: rgba(255, 255, 255, 0.7); +} + +.hero.is-black .subtitle a, +.hero.is-black .subtitle strong { + color: #fff; +} + +.hero.is-black .nav { + box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2); +} + +@media screen and (max-width: 768px) { + .hero.is-black .nav-menu { + background-color: #111; + } +} + +.hero.is-black a.nav-item, +.hero.is-black .nav-item a:not(.button) { + color: rgba(255, 255, 255, 0.5); +} + +.hero.is-black a.nav-item:hover, .hero.is-black a.nav-item.is-active, +.hero.is-black .nav-item a:not(.button):hover, +.hero.is-black .nav-item a:not(.button).is-active { + color: #fff; +} + +.hero.is-black .tabs a { + color: #fff; + opacity: 0.5; +} + +.hero.is-black .tabs a:hover { + opacity: 1; +} + +.hero.is-black .tabs li.is-active a { + opacity: 1; +} + +.hero.is-black .tabs.is-boxed a, .hero.is-black .tabs.is-toggle a { + color: #fff; +} + +.hero.is-black .tabs.is-boxed a:hover, .hero.is-black .tabs.is-toggle a:hover { + background-color: rgba(17, 17, 17, 0.1); +} + +.hero.is-black .tabs.is-boxed li.is-active a, .hero.is-black .tabs.is-boxed li.is-active a:hover, .hero.is-black .tabs.is-toggle li.is-active a, .hero.is-black .tabs.is-toggle li.is-active a:hover { + background-color: #fff; + border-color: #fff; + color: #111; +} + +.hero.is-black.is-bold { + background-image: linear-gradient(141deg, black 0%, #111 71%, #1f1c1c 100%); +} + +@media screen and (max-width: 768px) { + .hero.is-black .nav-toggle span { + background-color: #fff; + } + .hero.is-black .nav-toggle:hover { + background-color: rgba(17, 17, 17, 0.1); + } + .hero.is-black .nav-toggle.is-active span { + background-color: #fff; + } + .hero.is-black .nav-menu .nav-item { + border-top-color: rgba(255, 255, 255, 0.2); + } +} + +.hero.is-light { + background-color: #f5f7fa; + color: #69707a; +} + +.hero.is-light .title { + color: #69707a; +} + +.hero.is-light .title a, +.hero.is-light .title strong { + color: inherit; +} + +.hero.is-light .subtitle { + color: rgba(105, 112, 122, 0.7); +} + +.hero.is-light .subtitle a, +.hero.is-light .subtitle strong { + color: #69707a; +} + +.hero.is-light .nav { + box-shadow: 0 1px 0 rgba(105, 112, 122, 0.2); +} + +@media screen and (max-width: 768px) { + .hero.is-light .nav-menu { + background-color: #f5f7fa; + } +} + +.hero.is-light a.nav-item, +.hero.is-light .nav-item a:not(.button) { + color: rgba(105, 112, 122, 0.5); +} + +.hero.is-light a.nav-item:hover, .hero.is-light a.nav-item.is-active, +.hero.is-light .nav-item a:not(.button):hover, +.hero.is-light .nav-item a:not(.button).is-active { + color: #69707a; +} + +.hero.is-light .tabs a { + color: #69707a; + opacity: 0.5; +} + +.hero.is-light .tabs a:hover { + opacity: 1; +} + +.hero.is-light .tabs li.is-active a { + opacity: 1; +} + +.hero.is-light .tabs.is-boxed a, .hero.is-light .tabs.is-toggle a { + color: #69707a; +} + +.hero.is-light .tabs.is-boxed a:hover, .hero.is-light .tabs.is-toggle a:hover { + background-color: rgba(17, 17, 17, 0.1); +} + +.hero.is-light .tabs.is-boxed li.is-active a, .hero.is-light .tabs.is-boxed li.is-active a:hover, .hero.is-light .tabs.is-toggle li.is-active a, .hero.is-light .tabs.is-toggle li.is-active a:hover { + background-color: #69707a; + border-color: #69707a; + color: #f5f7fa; +} + +.hero.is-light.is-bold { + background-image: linear-gradient(141deg, #d0e0ec 0%, #f5f7fa 71%, white 100%); +} + +@media screen and (max-width: 768px) { + .hero.is-light .nav-toggle span { + background-color: #69707a; + } + .hero.is-light .nav-toggle:hover { + background-color: rgba(17, 17, 17, 0.1); + } + .hero.is-light .nav-toggle.is-active span { + background-color: #69707a; + } + .hero.is-light .nav-menu .nav-item { + border-top-color: rgba(105, 112, 122, 0.2); + } +} + +.hero.is-dark { + background-color: #69707a; + color: #f5f7fa; +} + +.hero.is-dark .title { + color: #f5f7fa; +} + +.hero.is-dark .title a, +.hero.is-dark .title strong { + color: inherit; +} + +.hero.is-dark .subtitle { + color: rgba(245, 247, 250, 0.7); +} + +.hero.is-dark .subtitle a, +.hero.is-dark .subtitle strong { + color: #f5f7fa; +} + +.hero.is-dark .nav { + box-shadow: 0 1px 0 rgba(245, 247, 250, 0.2); +} + +@media screen and (max-width: 768px) { + .hero.is-dark .nav-menu { + background-color: #69707a; + } +} + +.hero.is-dark a.nav-item, +.hero.is-dark .nav-item a:not(.button) { + color: rgba(245, 247, 250, 0.5); +} + +.hero.is-dark a.nav-item:hover, .hero.is-dark a.nav-item.is-active, +.hero.is-dark .nav-item a:not(.button):hover, +.hero.is-dark .nav-item a:not(.button).is-active { + color: #f5f7fa; +} + +.hero.is-dark .tabs a { + color: #f5f7fa; + opacity: 0.5; +} + +.hero.is-dark .tabs a:hover { + opacity: 1; +} + +.hero.is-dark .tabs li.is-active a { + opacity: 1; +} + +.hero.is-dark .tabs.is-boxed a, .hero.is-dark .tabs.is-toggle a { + color: #f5f7fa; +} + +.hero.is-dark .tabs.is-boxed a:hover, .hero.is-dark .tabs.is-toggle a:hover { + background-color: rgba(17, 17, 17, 0.1); +} + +.hero.is-dark .tabs.is-boxed li.is-active a, .hero.is-dark .tabs.is-boxed li.is-active a:hover, .hero.is-dark .tabs.is-toggle li.is-active a, .hero.is-dark .tabs.is-toggle li.is-active a:hover { + background-color: #f5f7fa; + border-color: #f5f7fa; + color: #69707a; +} + +.hero.is-dark.is-bold { + background-image: linear-gradient(141deg, #495a67 0%, #69707a 71%, #6e768e 100%); +} + +@media screen and (max-width: 768px) { + .hero.is-dark .nav-toggle span { + background-color: #f5f7fa; + } + .hero.is-dark .nav-toggle:hover { + background-color: rgba(17, 17, 17, 0.1); + } + .hero.is-dark .nav-toggle.is-active span { + background-color: #f5f7fa; + } + .hero.is-dark .nav-menu .nav-item { + border-top-color: rgba(245, 247, 250, 0.2); + } +} + +.hero.is-primary { + background-color: #24ffde; + color: white; +} + +.hero.is-primary .title { + color: white; +} + +.hero.is-primary .title a, +.hero.is-primary .title strong { + color: inherit; +} + +.hero.is-primary .subtitle { + color: rgba(255, 255, 255, 0.7); +} + +.hero.is-primary .subtitle a, +.hero.is-primary .subtitle strong { + color: white; +} + +.hero.is-primary .nav { + box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2); +} + +@media screen and (max-width: 768px) { + .hero.is-primary .nav-menu { + background-color: #24ffde; + } +} + +.hero.is-primary a.nav-item, +.hero.is-primary .nav-item a:not(.button) { + color: rgba(255, 255, 255, 0.5); +} + +.hero.is-primary a.nav-item:hover, .hero.is-primary a.nav-item.is-active, +.hero.is-primary .nav-item a:not(.button):hover, +.hero.is-primary .nav-item a:not(.button).is-active { + color: white; +} + +.hero.is-primary .tabs a { + color: white; + opacity: 0.5; +} + +.hero.is-primary .tabs a:hover { + opacity: 1; +} + +.hero.is-primary .tabs li.is-active a { + opacity: 1; +} + +.hero.is-primary .tabs.is-boxed a, .hero.is-primary .tabs.is-toggle a { + color: white; +} + +.hero.is-primary .tabs.is-boxed a:hover, .hero.is-primary .tabs.is-toggle a:hover { + background-color: rgba(17, 17, 17, 0.1); +} + +.hero.is-primary .tabs.is-boxed li.is-active a, .hero.is-primary .tabs.is-boxed li.is-active a:hover, .hero.is-primary .tabs.is-toggle li.is-active a, .hero.is-primary .tabs.is-toggle li.is-active a:hover { + background-color: white; + border-color: white; + color: #24ffde; +} + +.hero.is-primary.is-bold { + background-image: linear-gradient(141deg, #00f0a4 0%, #24ffde 71%, #3efcff 100%); +} + +@media screen and (max-width: 768px) { + .hero.is-primary .nav-toggle span { + background-color: white; + } + .hero.is-primary .nav-toggle:hover { + background-color: rgba(17, 17, 17, 0.1); + } + .hero.is-primary .nav-toggle.is-active span { + background-color: white; + } + .hero.is-primary .nav-menu .nav-item { + border-top-color: rgba(255, 255, 255, 0.2); + } +} + +.hero.is-info { + background-color: #2478ff; + color: white; +} + +.hero.is-info .title { + color: white; +} + +.hero.is-info .title a, +.hero.is-info .title strong { + color: inherit; +} + +.hero.is-info .subtitle { + color: rgba(255, 255, 255, 0.7); +} + +.hero.is-info .subtitle a, +.hero.is-info .subtitle strong { + color: white; +} + +.hero.is-info .nav { + box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2); +} + +@media screen and (max-width: 768px) { + .hero.is-info .nav-menu { + background-color: #2478ff; + } +} + +.hero.is-info a.nav-item, +.hero.is-info .nav-item a:not(.button) { + color: rgba(255, 255, 255, 0.5); +} + +.hero.is-info a.nav-item:hover, .hero.is-info a.nav-item.is-active, +.hero.is-info .nav-item a:not(.button):hover, +.hero.is-info .nav-item a:not(.button).is-active { + color: white; +} + +.hero.is-info .tabs a { + color: white; + opacity: 0.5; +} + +.hero.is-info .tabs a:hover { + opacity: 1; +} + +.hero.is-info .tabs li.is-active a { + opacity: 1; +} + +.hero.is-info .tabs.is-boxed a, .hero.is-info .tabs.is-toggle a { + color: white; +} + +.hero.is-info .tabs.is-boxed a:hover, .hero.is-info .tabs.is-toggle a:hover { + background-color: rgba(17, 17, 17, 0.1); +} + +.hero.is-info .tabs.is-boxed li.is-active a, .hero.is-info .tabs.is-boxed li.is-active a:hover, .hero.is-info .tabs.is-toggle li.is-active a, .hero.is-info .tabs.is-toggle li.is-active a:hover { + background-color: white; + border-color: white; + color: #2478ff; +} + +.hero.is-info.is-bold { + background-image: linear-gradient(141deg, #0084f0 0%, #2478ff 71%, #3e67ff 100%); +} + +@media screen and (max-width: 768px) { + .hero.is-info .nav-toggle span { + background-color: white; + } + .hero.is-info .nav-toggle:hover { + background-color: rgba(17, 17, 17, 0.1); + } + .hero.is-info .nav-toggle.is-active span { + background-color: white; + } + .hero.is-info .nav-menu .nav-item { + border-top-color: rgba(255, 255, 255, 0.2); + } +} + +.hero.is-success { + background-color: #24ff70; + color: white; +} + +.hero.is-success .title { + color: white; +} + +.hero.is-success .title a, +.hero.is-success .title strong { + color: inherit; +} + +.hero.is-success .subtitle { + color: rgba(255, 255, 255, 0.7); +} + +.hero.is-success .subtitle a, +.hero.is-success .subtitle strong { + color: white; +} + +.hero.is-success .nav { + box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2); +} + +@media screen and (max-width: 768px) { + .hero.is-success .nav-menu { + background-color: #24ff70; + } +} + +.hero.is-success a.nav-item, +.hero.is-success .nav-item a:not(.button) { + color: rgba(255, 255, 255, 0.5); +} + +.hero.is-success a.nav-item:hover, .hero.is-success a.nav-item.is-active, +.hero.is-success .nav-item a:not(.button):hover, +.hero.is-success .nav-item a:not(.button).is-active { + color: white; +} + +.hero.is-success .tabs a { + color: white; + opacity: 0.5; +} + +.hero.is-success .tabs a:hover { + opacity: 1; +} + +.hero.is-success .tabs li.is-active a { + opacity: 1; +} + +.hero.is-success .tabs.is-boxed a, .hero.is-success .tabs.is-toggle a { + color: white; +} + +.hero.is-success .tabs.is-boxed a:hover, .hero.is-success .tabs.is-toggle a:hover { + background-color: rgba(17, 17, 17, 0.1); +} + +.hero.is-success .tabs.is-boxed li.is-active a, .hero.is-success .tabs.is-boxed li.is-active a:hover, .hero.is-success .tabs.is-toggle li.is-active a, .hero.is-success .tabs.is-toggle li.is-active a:hover { + background-color: white; + border-color: white; + color: #24ff70; +} + +.hero.is-success.is-bold { + background-image: linear-gradient(141deg, #00f02b 0%, #24ff70 71%, #3effa1 100%); +} + +@media screen and (max-width: 768px) { + .hero.is-success .nav-toggle span { + background-color: white; + } + .hero.is-success .nav-toggle:hover { + background-color: rgba(17, 17, 17, 0.1); + } + .hero.is-success .nav-toggle.is-active span { + background-color: white; + } + .hero.is-success .nav-menu .nav-item { + border-top-color: rgba(255, 255, 255, 0.2); + } +} + +.hero.is-warning { + background-color: #ffd324; + color: white; +} + +.hero.is-warning .title { + color: white; +} + +.hero.is-warning .title a, +.hero.is-warning .title strong { + color: inherit; +} + +.hero.is-warning .subtitle { + color: rgba(255, 255, 255, 0.7); +} + +.hero.is-warning .subtitle a, +.hero.is-warning .subtitle strong { + color: white; +} + +.hero.is-warning .nav { + box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2); +} + +@media screen and (max-width: 768px) { + .hero.is-warning .nav-menu { + background-color: #ffd324; + } +} + +.hero.is-warning a.nav-item, +.hero.is-warning .nav-item a:not(.button) { + color: rgba(255, 255, 255, 0.5); +} + +.hero.is-warning a.nav-item:hover, .hero.is-warning a.nav-item.is-active, +.hero.is-warning .nav-item a:not(.button):hover, +.hero.is-warning .nav-item a:not(.button).is-active { + color: white; +} + +.hero.is-warning .tabs a { + color: white; + opacity: 0.5; +} + +.hero.is-warning .tabs a:hover { + opacity: 1; +} + +.hero.is-warning .tabs li.is-active a { + opacity: 1; +} + +.hero.is-warning .tabs.is-boxed a, .hero.is-warning .tabs.is-toggle a { + color: white; +} + +.hero.is-warning .tabs.is-boxed a:hover, .hero.is-warning .tabs.is-toggle a:hover { + background-color: rgba(17, 17, 17, 0.1); +} + +.hero.is-warning .tabs.is-boxed li.is-active a, .hero.is-warning .tabs.is-boxed li.is-active a:hover, .hero.is-warning .tabs.is-toggle li.is-active a, .hero.is-warning .tabs.is-toggle li.is-active a:hover { + background-color: white; + border-color: white; + color: #ffd324; +} + +.hero.is-warning.is-bold { + background-image: linear-gradient(141deg, #f09800 0%, #ffd324 71%, #fff83e 100%); +} + +@media screen and (max-width: 768px) { + .hero.is-warning .nav-toggle span { + background-color: white; + } + .hero.is-warning .nav-toggle:hover { + background-color: rgba(17, 17, 17, 0.1); + } + .hero.is-warning .nav-toggle.is-active span { + background-color: white; + } + .hero.is-warning .nav-menu .nav-item { + border-top-color: rgba(255, 255, 255, 0.2); + } +} + +.hero.is-danger { + background-color: #ff2450; + color: white; +} + +.hero.is-danger .title { + color: white; +} + +.hero.is-danger .title a, +.hero.is-danger .title strong { + color: inherit; +} + +.hero.is-danger .subtitle { + color: rgba(255, 255, 255, 0.7); +} + +.hero.is-danger .subtitle a, +.hero.is-danger .subtitle strong { + color: white; +} + +.hero.is-danger .nav { + box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2); +} + +@media screen and (max-width: 768px) { + .hero.is-danger .nav-menu { + background-color: #ff2450; + } +} + +.hero.is-danger a.nav-item, +.hero.is-danger .nav-item a:not(.button) { + color: rgba(255, 255, 255, 0.5); +} + +.hero.is-danger a.nav-item:hover, .hero.is-danger a.nav-item.is-active, +.hero.is-danger .nav-item a:not(.button):hover, +.hero.is-danger .nav-item a:not(.button).is-active { + color: white; +} + +.hero.is-danger .tabs a { + color: white; + opacity: 0.5; +} + +.hero.is-danger .tabs a:hover { + opacity: 1; +} + +.hero.is-danger .tabs li.is-active a { + opacity: 1; +} + +.hero.is-danger .tabs.is-boxed a, .hero.is-danger .tabs.is-toggle a { + color: white; +} + +.hero.is-danger .tabs.is-boxed a:hover, .hero.is-danger .tabs.is-toggle a:hover { + background-color: rgba(17, 17, 17, 0.1); +} + +.hero.is-danger .tabs.is-boxed li.is-active a, .hero.is-danger .tabs.is-boxed li.is-active a:hover, .hero.is-danger .tabs.is-toggle li.is-active a, .hero.is-danger .tabs.is-toggle li.is-active a:hover { + background-color: white; + border-color: white; + color: #ff2450; +} + +.hero.is-danger.is-bold { + background-image: linear-gradient(141deg, #f00058 0%, #ff2450 71%, #ff3e44 100%); +} + +@media screen and (max-width: 768px) { + .hero.is-danger .nav-toggle span { + background-color: white; + } + .hero.is-danger .nav-toggle:hover { + background-color: rgba(17, 17, 17, 0.1); + } + .hero.is-danger .nav-toggle.is-active span { + background-color: white; + } + .hero.is-danger .nav-menu .nav-item { + border-top-color: rgba(255, 255, 255, 0.2); + } +} + +@media screen and (min-width: 769px) { + .hero.is-medium .hero-body { + padding-bottom: 120px; + padding-top: 120px; + } +} + +@media screen and (min-width: 769px) { + .hero.is-large .hero-body { + padding-bottom: 240px; + padding-top: 240px; + } +} + +.hero.is-fullheight { + min-height: 100vh; +} + +.hero.is-fullheight .hero-body { + align-items: center; + display: flex; +} + +.hero.is-fullheight .hero-body > .container { + flex-grow: 1; + flex-shrink: 0; +} + +.section { + background-color: #fff; + padding: 40px 20px; +} + +@media screen and (min-width: 980px) { + .section.is-medium { + padding: 120px 20px; + } + .section.is-large { + padding: 240px 20px; + } +} + +.footer { + background-color: #f5f7fa; + padding: 40px 20px 80px; +} + +.footer a, .footer a:visited { + color: #69707a; +} + +.footer a:hover, .footer a:visited:hover { + color: #222324; +} + +.footer a:not(.icon), .footer a:visited:not(.icon) { + border-bottom: 1px solid #d3d6db; +} + +.footer a:not(.icon):hover, .footer a:visited:not(.icon):hover { + border-bottom-color: #24ffde; +} diff --git a/docs/css/utilities.css b/docs/css/utilities.css new file mode 100644 index 00000000..f2f909d6 --- /dev/null +++ b/docs/css/utilities.css @@ -0,0 +1,175 @@ +html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font-weight: normal; + vertical-align: baseline; + background: transparent; +} + +article, aside, figure, footer, header, nav, section, details, summary { + display: block; +} + +html { + box-sizing: border-box; +} + +*, +*:before, +*:after { + box-sizing: inherit; +} + +img, +object, +embed { + max-width: 100%; +} + +html { + overflow-y: scroll; +} + +ul { + list-style: none; +} + +blockquote, q { + quotes: none; +} + +blockquote:before, +blockquote:after, +q:before, +q:after { + content: ''; + content: none; +} + +a { + margin: 0; + padding: 0; + font-size: 100%; + vertical-align: baseline; + background: transparent; +} + +del { + text-decoration: line-through; +} + +abbr[title], dfn[title] { + border-bottom: 1px dotted #000; + cursor: help; +} + +table { + border-collapse: collapse; + border-spacing: 0; +} + +th { + font-weight: bold; + vertical-align: bottom; +} + +td { + font-weight: normal; + vertical-align: top; +} + +hr { + display: block; + height: 1px; + border: 0; + border-top: 1px solid #ccc; + margin: 1em 0; + padding: 0; +} + +input, select { + vertical-align: middle; +} + +pre { + white-space: pre; + white-space: pre-wrap; + white-space: pre-line; + word-wrap: break-word; +} + +input[type="radio"] { + vertical-align: text-bottom; +} + +input[type="checkbox"] { + vertical-align: bottom; +} + +select, input, textarea { + font: 99% sans-serif; +} + +table { + font-size: inherit; + font: 100%; +} + +small { + font-size: 85%; +} + +strong { + font-weight: bold; +} + +td, td img { + vertical-align: top; +} + +sub, sup { + font-size: 75%; + line-height: 0; + position: relative; +} + +sup { + top: -0.5em; +} + +sub { + bottom: -0.25em; +} + +pre, code, kbd, samp { + font-family: monospace, sans-serif; +} + +label, +input[type=button], +input[type=submit], +input[type=file], +button { + cursor: pointer; +} + +button, input, select, textarea { + margin: 0; +} + +button, +input[type=button] { + width: auto; + overflow: visible; +} + +@keyframes spin-around { + from { + transform: rotate(0deg); + } + to { + transform: rotate(359deg); + } +} diff --git a/docs/css/variables.css b/docs/css/variables.css new file mode 100644 index 00000000..e69de29b diff --git a/package.json b/package.json index de90e659..79323148 100644 --- a/package.json +++ b/package.json @@ -30,10 +30,10 @@ "build": "npm run build-clean && npm run build-sass && npm run build-autoprefix", "build-autoprefix": "postcss --use autoprefixer --output css/bulma.css css/bulma.css", "build-clean": "rm -rf css", - "build-sass": "node-sass --output-style expanded --source-map true --output css/ bulma.sass --outFile css/bulma.css", + "build-sass": "node-sass --output-style expanded --source-map true bulma.sass css/bulma.css", "docs": "npm run docs-sass && npm run docs-autoprefix", "docs-autoprefix": "postcss --use autoprefixer --output docs/css/bulma-docs.css docs/css/bulma-docs.css", - "docs-sass": "node-sass --output-style expanded --output docs/css/ docs/bulma-docs.sass --outFile docs/css/bulma-docs.css", + "docs-sass": "node-sass --output-style expanded docs/bulma-docs.sass docs/css/bulma-docs.css", "pre-push": "npm run build && git add css && git commit --amend --no-edit", "start": "npm run build-sass -- --watch", "start-docs": "npm run docs-sass -- --watch" diff --git a/sass/utilities/variables.sass b/sass/utilities/variables.sass index 7513e8b3..acbcc4e8 100644 --- a/sass/utilities/variables.sass +++ b/sass/utilities/variables.sass @@ -10,13 +10,21 @@ $grey-light: #d3d6db !default $grey-lighter: #f5f7fa !default $white: #fff !default -$blue: #42afe3 !default -$green: #97cd76 !default -$orange: #f68b39 !default -$purple: #847bb9 !default -$red: #ed6c63 !default -$turquoise: #1fc8db !default -$yellow: #fce473 !default +// $blue: #42afe3 !default +// $green: #97cd76 !default +// $orange: #f68b39 !default +// $purple: #847bb9 !default +// $red: #ed6c63 !default +// $turquoise: #1fc8db !default +// $yellow: #fce473 !default + +$orange: hsl(14, 100%, 53%) !default +$yellow: hsl(48, 100%, 53%) !default +$green: hsl(141, 86%, 53%) !default +$turquoise: hsl(171, 86%, 48%) !default +$blue: hsl(217, 100%, 53%) !default +$purple: hsl(271, 100%, 71%) !default +$red: hsl(348, 100%, 53%) !default // Typography