UNPKG

blexar

Version:

CSS framework to establish your favorite websites in mints, with user experience in mind.

2,127 lines 87.2 kB
/** * core */ .button.is-tiny, .buttons.is-tiny >.button, .label.is-tiny, .input.is-tiny, .input-tag.is-tiny, .input-group.is-tiny >.button, .input-group.is-tiny >.input, .input-group.is-tiny >.input-tag, .checkbox.is-tiny, .radio.is-tiny, .switcher.is-tiny, .textarea.is-tiny, .select.is-tiny, .pagination.is-tiny, .content.is-tiny { font-size: 12gu 9i; } .button.is-small, .buttons.is-small >.button, .label, .label.is-small, .input.is-small, .input-tag.is-small, .input-group.is-small >.button, .input-group.is-small >.input, .input-group.is-small >.input-tag, .checkbox.is-small, .radio.is-small, .switcher.is-small, .textarea.is-small, [tooltip]:after, .select.is-small, .pagination.is-small, .content.is-small { font-size: 14gu 9i; } p, body, .button, .button.is-normal, .buttons.is-normal >.button, .label, .label.is-normal, .input, .input.is-normal, .input-tag, .input-tag.is-normal, .input-group.is-normal >.button, .input-group.is-normal >.input, .input-group.is-normal >.input-tag, .checkbox, .checkbox.is-normal, .radio, .radio.is-normal, .switcher, .switcher.is-normal, .table, .textarea, .textarea.is-normal, .select, .select.is-normal, .modal, .navbar-item, .pagination-item, .pagination-next, .pagination-prev, .pagination-first, .pagination-last, .pagination, .pagination.is-normal, .content, .content.is-normal { font-size: 16gu 9i; } .button.is-large, .buttons.is-large >.button, .label.is-large, .input.is-large, .input-tag.is-large, .input-group.is-large >.button, .input-group.is-large >.input, .input-group.is-large >.input-tag, .checkbox.is-large, .radio.is-large, .switcher.is-large, .textarea.is-large, .select.is-large, .pagination.is-large, .content.is-large { font-size: 20gu 9i; } .button.is-massive, .buttons.is-massive >.button, .label.is-massive, .input.is-massive, .input-tag.is-massive, .input-group.is-massive >.button, .input-group.is-massive >.input, .input-group.is-massive >.input-tag, .checkbox.is-massive, .radio.is-massive, .switcher.is-massive, .textarea.is-massive, .select.is-massive, .pagination.is-massive, .content.is-massive { font-size: 24gu 9i; } html { line-height: 1.1875 /* 1 */; -ms-text-size-adjust: 100% /* 2 */; -webkit-text-size-adjust: 100% /* 2 */; } * { box-sizing: border-box; } body { margin: 0; } article, aside, footer, header, nav, section { display: block; } figcaption, figure, main { /* 1 */ display: block; } figure { margin: 1em 40px; } hr { overflow: visible /* 2 */; box-sizing: content-box /* 1 */; height: 0 /* 1 */; } pre { font-size: 1em /* 2 */; font-family: monospace, monospace /* 1 */; } a { background-color: transparent /* 1 */; -webkit-text-decoration-skip: objects /* 2 */; } abbr[title] { border-bottom: none /* 1 */; text-decoration: underline /* 2 */; text-decoration: underline dotted /* 2 */; } b, strong { font-weight: inherit; } b, strong { font-weight: bolder; } code, kbd, samp { font-size: 1em /* 2 */; font-family: monospace, monospace /* 1 */; } dfn { font-style: italic; } mark { background-color: #ff0; color: #000; } small { font-size: 80%; } sub, sup { position: relative; vertical-align: baseline; font-size: 75%; line-height: 0; } sub { bottom: -0.25em; } sup { top: -0.5em; } audio, video { display: inline-block; } audio:not([controls]) { display: none; height: 0; } img { border-style: none; } svg:not(:root) { overflow: hidden; } button, input, optgroup, select, textarea { margin: 0 /* 2 */; font-size: 100% /* 1 */; font-family: sans-serif /* 1 */; line-height: 1.15 /* 1 */; } button, input { /* 1 */ overflow: visible; } button, select { /* 1 */ text-transform: none; } button, html [type='button'], [type='reset'], [type='submit'] { -webkit-appearance: button /* 2 */; } button::-moz-focus-inner, [type='button']::-moz-focus-inner, [type='reset']::-moz-focus-inner, [type='submit']::-moz-focus-inner { padding: 0; border-style: none; } button:-moz-focusring, [type='button']:-moz-focusring, [type='reset']:-moz-focusring, [type='submit']:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { padding: 0.35em 0.75em 0.625em; } legend { display: table /* 1 */; box-sizing: border-box /* 1 */; padding: 0 /* 3 */; max-width: 100% /* 1 */; color: inherit /* 2 */; white-space: normal /* 1 */; } progress { display: inline-block /* 1 */; vertical-align: baseline /* 2 */; } textarea { overflow: auto; } [type='checkbox'], [type='radio'] { box-sizing: border-box /* 1 */; padding: 0 /* 2 */; } [type='number']::-webkit-inner-spin-button, [type='number']::-webkit-outer-spin-button { margin: 0; -webkit-appearance: none; } [type=number] { -moz-appearance: textfield; } [type='search'] { outline-offset: -2px /* 2 */; -webkit-appearance: textfield /* 1 */; } [type='search']::-webkit-search-cancel-button, [type='search']::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { font: inherit /* 2 */; -webkit-appearance: button /* 1 */; } details, menu { display: block; } summary { display: list-item; } canvas { display: inline-block; } template { display: none; } [hidden] { display: none; } h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { margin-top: 0; margin-bottom: 0.5em; line-height: 1.1875; font-weight: 900; } p, body { margin: 0; } ::-moz-selection { background: #0072ff; color: #fff; } ::selection { background: #0072ff; color: #fff; } *::-webkit-input-placeholder { color: #aeaeae; opacity: 1; } *:-ms-input-placeholder { color: #aeaeae; opacity: 1; } *::placeholder { color: #aeaeae; opacity: 1; } *::-webkit-input-placeholder:focus { outline: 0; } *:-ms-input-placeholder:focus { outline: 0; } *::placeholder:focus { outline: 0; } html, input, button { direction: ltr; font-family: 'Graphik', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; font-weight: 400; } a { color: #0072ff; cursor: pointer; text-decoration: none; } a:hover { color: #eb008b; } img { max-width: 100%; height: auto; } strong, b { font-weight: 900; } pre { direction: ltr; } .container { width: calc(100% - 22px); margin: auto; padding-left: 1.5625vw; padding-right: 1.5625vw; } @media screen and (min-width: 768px) { .container { width: 724px; } } @media screen and (min-width: 991px) { .container { width: 925px; } } @media screen and (min-width: 1360px) { .container { width: 1272px; } } @media screen and (min-width: 1920px) { .container { width: 1810px; } } .container-full { width: 100%; padding-left: 8vw; padding-right: 8vw; } .column { -ms-flex: 1 0; flex: 1 0; padding-right: 1.5625vw; padding-left: 1.5625vw; } .column[class*='is-tablet-'], .column[class*='is-desktop-'], .column[class*='is-widescreen-'], .column[class*='is-ultrawide-'], .grid[class*='is-tablet-'] >.column:not([class*='is-']), .grid[class*='is-desktop-'] >.column:not([class*='is-']), .grid[class*='is-widescreen-'] >.column:not([class*='is-']), .grid[class*='is-ultrawide-'] >.column:not([class*='is-']), .row[class*='is-tablet-'] >.column:not([class*='is-']), .row[class*='is-desktop-'] >.column:not([class*='is-']), .row[class*='is-widescreen-'] >.column:not([class*='is-']), .row[class*='is-ultrawide-'] >.column:not([class*='is-']) { -ms-flex: 1 0 100%; flex: 1 0 100%; min-width: 100%; } .column.is-0, .column.is-mobile-0 { -ms-flex: 0 0 0%; flex: 0 0 0%; min-width: 0%; } .column.is-offset-0, .column.is-offset-mobile-0 { margin-left: 0%; } .column.is-1, .column.is-mobile-1, .grid.is-1 >.column:not([class*='is-']), .grid.is-mobile-1 >.column:not([class*='is-']), .row.is-1 >.column:not([class*='is-']), .row.is-mobile-1 >.column:not([class*='is-']) { -ms-flex: 0 0 8.333333333333332%; flex: 0 0 8.333333333333332%; min-width: 8.333333333333332%; } .column.is-offset-1, .column.is-offset-mobile-1 { margin-left: 8.333333333333332%; } .column.is-2, .column.is-mobile-2, .grid.is-2 >.column:not([class*='is-']), .grid.is-mobile-2 >.column:not([class*='is-']), .row.is-2 >.column:not([class*='is-']), .row.is-mobile-2 >.column:not([class*='is-']) { -ms-flex: 0 0 16.666666666666664%; flex: 0 0 16.666666666666664%; min-width: 16.666666666666664%; } .column.is-offset-2, .column.is-offset-mobile-2 { margin-left: 16.666666666666664%; } .column.is-3, .column.is-mobile-3, .grid.is-3 >.column:not([class*='is-']), .grid.is-mobile-3 >.column:not([class*='is-']), .row.is-3 >.column:not([class*='is-']), .row.is-mobile-3 >.column:not([class*='is-']) { -ms-flex: 0 0 25%; flex: 0 0 25%; min-width: 25%; } .column.is-offset-3, .column.is-offset-mobile-3 { margin-left: 25%; } .column.is-4, .column.is-mobile-4, .grid.is-4 >.column:not([class*='is-']), .grid.is-mobile-4 >.column:not([class*='is-']), .row.is-4 >.column:not([class*='is-']), .row.is-mobile-4 >.column:not([class*='is-']) { -ms-flex: 0 0 33.33333333333333%; flex: 0 0 33.33333333333333%; min-width: 33.33333333333333%; } .column.is-offset-4, .column.is-offset-mobile-4 { margin-left: 33.33333333333333%; } .column.is-5, .column.is-mobile-5, .grid.is-5 >.column:not([class*='is-']), .grid.is-mobile-5 >.column:not([class*='is-']), .row.is-5 >.column:not([class*='is-']), .row.is-mobile-5 >.column:not([class*='is-']) { -ms-flex: 0 0 41.66666666666667%; flex: 0 0 41.66666666666667%; min-width: 41.66666666666667%; } .column.is-offset-5, .column.is-offset-mobile-5 { margin-left: 41.66666666666667%; } .column.is-6, .column.is-mobile-6, .grid.is-6 >.column:not([class*='is-']), .grid.is-mobile-6 >.column:not([class*='is-']), .row.is-6 >.column:not([class*='is-']), .row.is-mobile-6 >.column:not([class*='is-']) { -ms-flex: 0 0 50%; flex: 0 0 50%; min-width: 50%; } .column.is-offset-6, .column.is-offset-mobile-6 { margin-left: 50%; } .column.is-7, .column.is-mobile-7, .grid.is-7 >.column:not([class*='is-']), .grid.is-mobile-7 >.column:not([class*='is-']), .row.is-7 >.column:not([class*='is-']), .row.is-mobile-7 >.column:not([class*='is-']) { -ms-flex: 0 0 58.333333333333336%; flex: 0 0 58.333333333333336%; min-width: 58.333333333333336%; } .column.is-offset-7, .column.is-offset-mobile-7 { margin-left: 58.333333333333336%; } .column.is-8, .column.is-mobile-8, .grid.is-8 >.column:not([class*='is-']), .grid.is-mobile-8 >.column:not([class*='is-']), .row.is-8 >.column:not([class*='is-']), .row.is-mobile-8 >.column:not([class*='is-']) { -ms-flex: 0 0 66.66666666666666%; flex: 0 0 66.66666666666666%; min-width: 66.66666666666666%; } .column.is-offset-8, .column.is-offset-mobile-8 { margin-left: 66.66666666666666%; } .column.is-9, .column.is-mobile-9, .grid.is-9 >.column:not([class*='is-']), .grid.is-mobile-9 >.column:not([class*='is-']), .row.is-9 >.column:not([class*='is-']), .row.is-mobile-9 >.column:not([class*='is-']) { -ms-flex: 0 0 75%; flex: 0 0 75%; min-width: 75%; } .column.is-offset-9, .column.is-offset-mobile-9 { margin-left: 75%; } .column.is-10, .column.is-mobile-10, .grid.is-10 >.column:not([class*='is-']), .grid.is-mobile-10 >.column:not([class*='is-']), .row.is-10 >.column:not([class*='is-']), .row.is-mobile-10 >.column:not([class*='is-']) { -ms-flex: 0 0 83.33333333333334%; flex: 0 0 83.33333333333334%; min-width: 83.33333333333334%; } .column.is-offset-10, .column.is-offset-mobile-10 { margin-left: 83.33333333333334%; } .column.is-11, .column.is-mobile-11, .grid.is-11 >.column:not([class*='is-']), .grid.is-mobile-11 >.column:not([class*='is-']), .row.is-11 >.column:not([class*='is-']), .row.is-mobile-11 >.column:not([class*='is-']) { -ms-flex: 0 0 91.66666666666666%; flex: 0 0 91.66666666666666%; min-width: 91.66666666666666%; } .column.is-offset-11, .column.is-offset-mobile-11 { margin-left: 91.66666666666666%; } .column.is-12, .column.is-mobile-12, .grid.is-12 >.column:not([class*='is-']), .grid.is-mobile-12 >.column:not([class*='is-']), .row.is-12 >.column:not([class*='is-']), .row.is-mobile-12 >.column:not([class*='is-']) { -ms-flex: 0 0 100%; flex: 0 0 100%; min-width: 100%; } .column.is-offset-12, .column.is-offset-mobile-12 { margin-left: 100%; } @media screen and (min-width: 768px) { .column.is-tablet-0 { -ms-flex: 0 0 0%; flex: 0 0 0%; min-width: 0%; } .column.is-offset-tablet-0 { margin-left: 0%; } .column.is-tablet-1, .grid.is-tablet-1 >.column:not([class*='is-']), .row.is-tablet-1 >.column:not([class*='is-']) { -ms-flex: 0 0 8.333333333333332%; flex: 0 0 8.333333333333332%; min-width: 8.333333333333332%; } .column.is-offset-tablet-1 { margin-left: 8.333333333333332%; } .column.is-tablet-2, .grid.is-tablet-2 >.column:not([class*='is-']), .row.is-tablet-2 >.column:not([class*='is-']) { -ms-flex: 0 0 16.666666666666664%; flex: 0 0 16.666666666666664%; min-width: 16.666666666666664%; } .column.is-offset-tablet-2 { margin-left: 16.666666666666664%; } .column.is-tablet-3, .grid.is-tablet-3 >.column:not([class*='is-']), .row.is-tablet-3 >.column:not([class*='is-']) { -ms-flex: 0 0 25%; flex: 0 0 25%; min-width: 25%; } .column.is-offset-tablet-3 { margin-left: 25%; } .column.is-tablet-4, .grid.is-tablet-4 >.column:not([class*='is-']), .row.is-tablet-4 >.column:not([class*='is-']) { -ms-flex: 0 0 33.33333333333333%; flex: 0 0 33.33333333333333%; min-width: 33.33333333333333%; } .column.is-offset-tablet-4 { margin-left: 33.33333333333333%; } .column.is-tablet-5, .grid.is-tablet-5 >.column:not([class*='is-']), .row.is-tablet-5 >.column:not([class*='is-']) { -ms-flex: 0 0 41.66666666666667%; flex: 0 0 41.66666666666667%; min-width: 41.66666666666667%; } .column.is-offset-tablet-5 { margin-left: 41.66666666666667%; } .column.is-tablet-6, .grid.is-tablet-6 >.column:not([class*='is-']), .row.is-tablet-6 >.column:not([class*='is-']) { -ms-flex: 0 0 50%; flex: 0 0 50%; min-width: 50%; } .column.is-offset-tablet-6 { margin-left: 50%; } .column.is-tablet-7, .grid.is-tablet-7 >.column:not([class*='is-']), .row.is-tablet-7 >.column:not([class*='is-']) { -ms-flex: 0 0 58.333333333333336%; flex: 0 0 58.333333333333336%; min-width: 58.333333333333336%; } .column.is-offset-tablet-7 { margin-left: 58.333333333333336%; } .column.is-tablet-8, .grid.is-tablet-8 >.column:not([class*='is-']), .row.is-tablet-8 >.column:not([class*='is-']) { -ms-flex: 0 0 66.66666666666666%; flex: 0 0 66.66666666666666%; min-width: 66.66666666666666%; } .column.is-offset-tablet-8 { margin-left: 66.66666666666666%; } .column.is-tablet-9, .grid.is-tablet-9 >.column:not([class*='is-']), .row.is-tablet-9 >.column:not([class*='is-']) { -ms-flex: 0 0 75%; flex: 0 0 75%; min-width: 75%; } .column.is-offset-tablet-9 { margin-left: 75%; } .column.is-tablet-10, .grid.is-tablet-10 >.column:not([class*='is-']), .row.is-tablet-10 >.column:not([class*='is-']) { -ms-flex: 0 0 83.33333333333334%; flex: 0 0 83.33333333333334%; min-width: 83.33333333333334%; } .column.is-offset-tablet-10 { margin-left: 83.33333333333334%; } .column.is-tablet-11, .grid.is-tablet-11 >.column:not([class*='is-']), .row.is-tablet-11 >.column:not([class*='is-']) { -ms-flex: 0 0 91.66666666666666%; flex: 0 0 91.66666666666666%; min-width: 91.66666666666666%; } .column.is-offset-tablet-11 { margin-left: 91.66666666666666%; } .column.is-tablet-12, .grid.is-tablet-12 >.column:not([class*='is-']), .row.is-tablet-12 >.column:not([class*='is-']) { -ms-flex: 0 0 100%; flex: 0 0 100%; min-width: 100%; } .column.is-offset-tablet-12 { margin-left: 100%; } } @media screen and (min-width: 991px) { .column.is-desktop-0 { -ms-flex: 0 0 0%; flex: 0 0 0%; min-width: 0%; } .column.is-offset-desktop-0 { margin-left: 0%; } .column.is-desktop-1, .grid.is-desktop-1 >.column:not([class*='is-']), .row.is-desktop-1 >.column:not([class*='is-']) { -ms-flex: 0 0 8.333333333333332%; flex: 0 0 8.333333333333332%; min-width: 8.333333333333332%; } .column.is-offset-desktop-1 { margin-left: 8.333333333333332%; } .column.is-desktop-2, .grid.is-desktop-2 >.column:not([class*='is-']), .row.is-desktop-2 >.column:not([class*='is-']) { -ms-flex: 0 0 16.666666666666664%; flex: 0 0 16.666666666666664%; min-width: 16.666666666666664%; } .column.is-offset-desktop-2 { margin-left: 16.666666666666664%; } .column.is-desktop-3, .grid.is-desktop-3 >.column:not([class*='is-']), .row.is-desktop-3 >.column:not([class*='is-']) { -ms-flex: 0 0 25%; flex: 0 0 25%; min-width: 25%; } .column.is-offset-desktop-3 { margin-left: 25%; } .column.is-desktop-4, .grid.is-desktop-4 >.column:not([class*='is-']), .row.is-desktop-4 >.column:not([class*='is-']) { -ms-flex: 0 0 33.33333333333333%; flex: 0 0 33.33333333333333%; min-width: 33.33333333333333%; } .column.is-offset-desktop-4 { margin-left: 33.33333333333333%; } .column.is-desktop-5, .grid.is-desktop-5 >.column:not([class*='is-']), .row.is-desktop-5 >.column:not([class*='is-']) { -ms-flex: 0 0 41.66666666666667%; flex: 0 0 41.66666666666667%; min-width: 41.66666666666667%; } .column.is-offset-desktop-5 { margin-left: 41.66666666666667%; } .column.is-desktop-6, .grid.is-desktop-6 >.column:not([class*='is-']), .row.is-desktop-6 >.column:not([class*='is-']) { -ms-flex: 0 0 50%; flex: 0 0 50%; min-width: 50%; } .column.is-offset-desktop-6 { margin-left: 50%; } .column.is-desktop-7, .grid.is-desktop-7 >.column:not([class*='is-']), .row.is-desktop-7 >.column:not([class*='is-']) { -ms-flex: 0 0 58.333333333333336%; flex: 0 0 58.333333333333336%; min-width: 58.333333333333336%; } .column.is-offset-desktop-7 { margin-left: 58.333333333333336%; } .column.is-desktop-8, .grid.is-desktop-8 >.column:not([class*='is-']), .row.is-desktop-8 >.column:not([class*='is-']) { -ms-flex: 0 0 66.66666666666666%; flex: 0 0 66.66666666666666%; min-width: 66.66666666666666%; } .column.is-offset-desktop-8 { margin-left: 66.66666666666666%; } .column.is-desktop-9, .grid.is-desktop-9 >.column:not([class*='is-']), .row.is-desktop-9 >.column:not([class*='is-']) { -ms-flex: 0 0 75%; flex: 0 0 75%; min-width: 75%; } .column.is-offset-desktop-9 { margin-left: 75%; } .column.is-desktop-10, .grid.is-desktop-10 >.column:not([class*='is-']), .row.is-desktop-10 >.column:not([class*='is-']) { -ms-flex: 0 0 83.33333333333334%; flex: 0 0 83.33333333333334%; min-width: 83.33333333333334%; } .column.is-offset-desktop-10 { margin-left: 83.33333333333334%; } .column.is-desktop-11, .grid.is-desktop-11 >.column:not([class*='is-']), .row.is-desktop-11 >.column:not([class*='is-']) { -ms-flex: 0 0 91.66666666666666%; flex: 0 0 91.66666666666666%; min-width: 91.66666666666666%; } .column.is-offset-desktop-11 { margin-left: 91.66666666666666%; } .column.is-desktop-12, .grid.is-desktop-12 >.column:not([class*='is-']), .row.is-desktop-12 >.column:not([class*='is-']) { -ms-flex: 0 0 100%; flex: 0 0 100%; min-width: 100%; } .column.is-offset-desktop-12 { margin-left: 100%; } } @media screen and (min-width: 1360px) { .column.is-widescreen-0 { -ms-flex: 0 0 0%; flex: 0 0 0%; min-width: 0%; } .column.is-offset-widescreen-0 { margin-left: 0%; } .column.is-widescreen-1, .grid.is-widescreen-1 >.column:not([class*='is-']), .row.is-widescreen-1 >.column:not([class*='is-']) { -ms-flex: 0 0 8.333333333333332%; flex: 0 0 8.333333333333332%; min-width: 8.333333333333332%; } .column.is-offset-widescreen-1 { margin-left: 8.333333333333332%; } .column.is-widescreen-2, .grid.is-widescreen-2 >.column:not([class*='is-']), .row.is-widescreen-2 >.column:not([class*='is-']) { -ms-flex: 0 0 16.666666666666664%; flex: 0 0 16.666666666666664%; min-width: 16.666666666666664%; } .column.is-offset-widescreen-2 { margin-left: 16.666666666666664%; } .column.is-widescreen-3, .grid.is-widescreen-3 >.column:not([class*='is-']), .row.is-widescreen-3 >.column:not([class*='is-']) { -ms-flex: 0 0 25%; flex: 0 0 25%; min-width: 25%; } .column.is-offset-widescreen-3 { margin-left: 25%; } .column.is-widescreen-4, .grid.is-widescreen-4 >.column:not([class*='is-']), .row.is-widescreen-4 >.column:not([class*='is-']) { -ms-flex: 0 0 33.33333333333333%; flex: 0 0 33.33333333333333%; min-width: 33.33333333333333%; } .column.is-offset-widescreen-4 { margin-left: 33.33333333333333%; } .column.is-widescreen-5, .grid.is-widescreen-5 >.column:not([class*='is-']), .row.is-widescreen-5 >.column:not([class*='is-']) { -ms-flex: 0 0 41.66666666666667%; flex: 0 0 41.66666666666667%; min-width: 41.66666666666667%; } .column.is-offset-widescreen-5 { margin-left: 41.66666666666667%; } .column.is-widescreen-6, .grid.is-widescreen-6 >.column:not([class*='is-']), .row.is-widescreen-6 >.column:not([class*='is-']) { -ms-flex: 0 0 50%; flex: 0 0 50%; min-width: 50%; } .column.is-offset-widescreen-6 { margin-left: 50%; } .column.is-widescreen-7, .grid.is-widescreen-7 >.column:not([class*='is-']), .row.is-widescreen-7 >.column:not([class*='is-']) { -ms-flex: 0 0 58.333333333333336%; flex: 0 0 58.333333333333336%; min-width: 58.333333333333336%; } .column.is-offset-widescreen-7 { margin-left: 58.333333333333336%; } .column.is-widescreen-8, .grid.is-widescreen-8 >.column:not([class*='is-']), .row.is-widescreen-8 >.column:not([class*='is-']) { -ms-flex: 0 0 66.66666666666666%; flex: 0 0 66.66666666666666%; min-width: 66.66666666666666%; } .column.is-offset-widescreen-8 { margin-left: 66.66666666666666%; } .column.is-widescreen-9, .grid.is-widescreen-9 >.column:not([class*='is-']), .row.is-widescreen-9 >.column:not([class*='is-']) { -ms-flex: 0 0 75%; flex: 0 0 75%; min-width: 75%; } .column.is-offset-widescreen-9 { margin-left: 75%; } .column.is-widescreen-10, .grid.is-widescreen-10 >.column:not([class*='is-']), .row.is-widescreen-10 >.column:not([class*='is-']) { -ms-flex: 0 0 83.33333333333334%; flex: 0 0 83.33333333333334%; min-width: 83.33333333333334%; } .column.is-offset-widescreen-10 { margin-left: 83.33333333333334%; } .column.is-widescreen-11, .grid.is-widescreen-11 >.column:not([class*='is-']), .row.is-widescreen-11 >.column:not([class*='is-']) { -ms-flex: 0 0 91.66666666666666%; flex: 0 0 91.66666666666666%; min-width: 91.66666666666666%; } .column.is-offset-widescreen-11 { margin-left: 91.66666666666666%; } .column.is-widescreen-12, .grid.is-widescreen-12 >.column:not([class*='is-']), .row.is-widescreen-12 >.column:not([class*='is-']) { -ms-flex: 0 0 100%; flex: 0 0 100%; min-width: 100%; } .column.is-offset-widescreen-12 { margin-left: 100%; } } @media screen and (min-width: 1920px) { .column.is-ultrawide-0 { -ms-flex: 0 0 0%; flex: 0 0 0%; min-width: 0%; } .column.is-offset-ultrawide-0 { margin-left: 0%; } .column.is-ultrawide-1, .grid.is-ultrawide-1 >.column:not([class*='is-']), .row.is-ultrawide-1 >.column:not([class*='is-']) { -ms-flex: 0 0 8.333333333333332%; flex: 0 0 8.333333333333332%; min-width: 8.333333333333332%; } .column.is-offset-ultrawide-1 { margin-left: 8.333333333333332%; } .column.is-ultrawide-2, .grid.is-ultrawide-2 >.column:not([class*='is-']), .row.is-ultrawide-2 >.column:not([class*='is-']) { -ms-flex: 0 0 16.666666666666664%; flex: 0 0 16.666666666666664%; min-width: 16.666666666666664%; } .column.is-offset-ultrawide-2 { margin-left: 16.666666666666664%; } .column.is-ultrawide-3, .grid.is-ultrawide-3 >.column:not([class*='is-']), .row.is-ultrawide-3 >.column:not([class*='is-']) { -ms-flex: 0 0 25%; flex: 0 0 25%; min-width: 25%; } .column.is-offset-ultrawide-3 { margin-left: 25%; } .column.is-ultrawide-4, .grid.is-ultrawide-4 >.column:not([class*='is-']), .row.is-ultrawide-4 >.column:not([class*='is-']) { -ms-flex: 0 0 33.33333333333333%; flex: 0 0 33.33333333333333%; min-width: 33.33333333333333%; } .column.is-offset-ultrawide-4 { margin-left: 33.33333333333333%; } .column.is-ultrawide-5, .grid.is-ultrawide-5 >.column:not([class*='is-']), .row.is-ultrawide-5 >.column:not([class*='is-']) { -ms-flex: 0 0 41.66666666666667%; flex: 0 0 41.66666666666667%; min-width: 41.66666666666667%; } .column.is-offset-ultrawide-5 { margin-left: 41.66666666666667%; } .column.is-ultrawide-6, .grid.is-ultrawide-6 >.column:not([class*='is-']), .row.is-ultrawide-6 >.column:not([class*='is-']) { -ms-flex: 0 0 50%; flex: 0 0 50%; min-width: 50%; } .column.is-offset-ultrawide-6 { margin-left: 50%; } .column.is-ultrawide-7, .grid.is-ultrawide-7 >.column:not([class*='is-']), .row.is-ultrawide-7 >.column:not([class*='is-']) { -ms-flex: 0 0 58.333333333333336%; flex: 0 0 58.333333333333336%; min-width: 58.333333333333336%; } .column.is-offset-ultrawide-7 { margin-left: 58.333333333333336%; } .column.is-ultrawide-8, .grid.is-ultrawide-8 >.column:not([class*='is-']), .row.is-ultrawide-8 >.column:not([class*='is-']) { -ms-flex: 0 0 66.66666666666666%; flex: 0 0 66.66666666666666%; min-width: 66.66666666666666%; } .column.is-offset-ultrawide-8 { margin-left: 66.66666666666666%; } .column.is-ultrawide-9, .grid.is-ultrawide-9 >.column:not([class*='is-']), .row.is-ultrawide-9 >.column:not([class*='is-']) { -ms-flex: 0 0 75%; flex: 0 0 75%; min-width: 75%; } .column.is-offset-ultrawide-9 { margin-left: 75%; } .column.is-ultrawide-10, .grid.is-ultrawide-10 >.column:not([class*='is-']), .row.is-ultrawide-10 >.column:not([class*='is-']) { -ms-flex: 0 0 83.33333333333334%; flex: 0 0 83.33333333333334%; min-width: 83.33333333333334%; } .column.is-offset-ultrawide-10 { margin-left: 83.33333333333334%; } .column.is-ultrawide-11, .grid.is-ultrawide-11 >.column:not([class*='is-']), .row.is-ultrawide-11 >.column:not([class*='is-']) { -ms-flex: 0 0 91.66666666666666%; flex: 0 0 91.66666666666666%; min-width: 91.66666666666666%; } .column.is-offset-ultrawide-11 { margin-left: 91.66666666666666%; } .column.is-ultrawide-12, .grid.is-ultrawide-12 >.column:not([class*='is-']), .row.is-ultrawide-12 >.column:not([class*='is-']) { -ms-flex: 0 0 100%; flex: 0 0 100%; min-width: 100%; } .column.is-offset-ultrawide-12 { margin-left: 100%; } } .column.is-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; } .column.is-top { -ms-flex-item-align: start; align-self: flex-start; } .column.is-bottom { -ms-flex-item-align: end; align-self: flex-end; } .column >.row { margin: 0 -1.5625vw; min-width: calc(100% + 3.125vw); } .grid, .row { position: relative; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -1.5625vw; margin-left: -1.5625vw; width: auto; } .grid.is-center, .row.is-center { -ms-flex-pack: center; justify-content: center; } .grid.is-end, .row.is-end { -ms-flex-pack: end; justify-content: flex-end; } .grid.is-start, .row.is-start { -ms-flex-pack: start; justify-content: flex-start; } .grid.is-middle, .row.is-middle { -ms-flex-align: center; align-items: center; } .grid.is-top, .row.is-top { -ms-flex-align: start; align-items: flex-start; } .grid.is-bottom, .row.is-bottom { -ms-flex-align: end; align-items: flex-end; } .grid.is-vertical, .row.is-vertical { -ms-flex-direction: column; flex-direction: column; -ms-flex-align: start; align-items: flex-start; } .grid.is-shrink >.column:not([class*='is-']), .row.is-shrink >.column:not([class*='is-']) { -ms-flex: 0 0 auto; flex: 0 0 auto; } .grid.is-relaxed, .row.is-relaxed { margin-right: 0; margin-left: 0; } .grid.is-relaxed >.column, .row.is-relaxed >.column { padding: 0; } .row { width: 100%; -ms-flex-pack: inherit; justify-content: inherit; margin: 0; } .button { position: relative; display: -ms-inline-flexbox; display: inline-flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 10px; padding: 0.5em 0.75em; outline: none; border-width: 1px; border-style: solid; border-radius: 4px; background-clip: border-box; vertical-align: top; text-align: center; text-decoration: none; cursor: pointer; transition: 0.4s ease-in-out; border-color: #0072ff; background-color: #0072ff; color: #fff; fill: #fff; stroke-width: 0; } .button.is-inverse { background-color: transparent; color: #0072ff; fill: #0072ff; stroke-width: 0; } .button:hover, .button:active, .button.is-active { border-color: #0061d9; background-color: #0061d9; color: #fff; fill: #fff; stroke-width: 0; } .button:focus { box-shadow: 0 0 0 3px rgba(0,114,255,0.25); } .button[disabled] { border-color: #0072ff; background-color: #0072ff; color: #fff; fill: #fff; stroke-width: 0; } .button.is-primary, .buttons.is-primary >.button, .input-group.is-primary >.button { border-color: #0072ff; background-color: #0072ff; color: #fff; fill: #fff; stroke-width: 0; } .button.is-primary.is-inverse, .buttons.is-primary >.button.is-inverse, .input-group.is-primary >.button.is-inverse, .buttons.is-primary.is-inverse >.button { background-color: transparent; color: #0072ff; fill: #0072ff; stroke-width: 0; } .button.is-primary:hover, .buttons.is-primary >.button:hover, .input-group.is-primary >.button:hover, .button.is-primary:active, .buttons.is-primary >.button:active, .input-group.is-primary >.button:active, .button.is-primary.is-active, .buttons.is-primary >.button.is-active, .input-group.is-primary >.button.is-active { border-color: #0061d9; background-color: #0061d9; color: #fff; fill: #fff; stroke-width: 0; } .button.is-primary:focus, .buttons.is-primary >.button:focus, .input-group.is-primary >.button:focus { box-shadow: 0 0 0 3px rgba(0,114,255,0.25); } .button.is-primary[disabled], .buttons.is-primary >.button[disabled], .input-group.is-primary >.button[disabled] { border-color: #0072ff; background-color: #0072ff; color: #fff; fill: #fff; stroke-width: 0; } .button.is-secondary, .buttons.is-secondary >.button, .input-group.is-secondary >.button { border-color: #c7c7c7; background-color: #c7c7c7; color: #000; fill: #000; stroke-width: 0; } .button.is-secondary.is-inverse, .buttons.is-secondary >.button.is-inverse, .input-group.is-secondary >.button.is-inverse, .buttons.is-secondary.is-inverse >.button { background-color: transparent; color: #c7c7c7; fill: #c7c7c7; stroke-width: 0; } .button.is-secondary:hover, .buttons.is-secondary >.button:hover, .input-group.is-secondary >.button:hover, .button.is-secondary:active, .buttons.is-secondary >.button:active, .input-group.is-secondary >.button:active, .button.is-secondary.is-active, .buttons.is-secondary >.button.is-active, .input-group.is-secondary >.button.is-active { border-color: #a9a9a9; background-color: #a9a9a9; color: #000; fill: #000; stroke-width: 0; } .button.is-secondary:focus, .buttons.is-secondary >.button:focus, .input-group.is-secondary >.button:focus { box-shadow: 0 0 0 3px rgba(199,199,199,0.25); } .button.is-secondary[disabled], .buttons.is-secondary >.button[disabled], .input-group.is-secondary >.button[disabled] { border-color: #c7c7c7; background-color: #c7c7c7; color: #000; fill: #000; stroke-width: 0; } .button.is-info, .buttons.is-info >.button, .input-group.is-info >.button { border-color: #00d4f0; background-color: #00d4f0; color: #fff; fill: #fff; stroke-width: 0; } .button.is-info.is-inverse, .buttons.is-info >.button.is-inverse, .input-group.is-info >.button.is-inverse, .buttons.is-info.is-inverse >.button { background-color: transparent; color: #00d4f0; fill: #00d4f0; stroke-width: 0; } .button.is-info:hover, .buttons.is-info >.button:hover, .input-group.is-info >.button:hover, .button.is-info:active, .buttons.is-info >.button:active, .input-group.is-info >.button:active, .button.is-info.is-active, .buttons.is-info >.button.is-active, .input-group.is-info >.button.is-active { border-color: #00b4cc; background-color: #00b4cc; color: #fff; fill: #fff; stroke-width: 0; } .button.is-info:focus, .buttons.is-info >.button:focus, .input-group.is-info >.button:focus { box-shadow: 0 0 0 3px rgba(0,212,240,0.25); } .button.is-info[disabled], .buttons.is-info >.button[disabled], .input-group.is-info >.button[disabled] { border-color: #00d4f0; background-color: #00d4f0; color: #fff; fill: #fff; stroke-width: 0; } .button.is-success, .buttons.is-success >.button, .input-group.is-success >.button { border-color: #18d88b; background-color: #18d88b; color: #fff; fill: #fff; stroke-width: 0; } .button.is-success.is-inverse, .buttons.is-success >.button.is-inverse, .input-group.is-success >.button.is-inverse, .buttons.is-success.is-inverse >.button { background-color: transparent; color: #18d88b; fill: #18d88b; stroke-width: 0; } .button.is-success:hover, .buttons.is-success >.button:hover, .input-group.is-success >.button:hover, .button.is-success:active, .buttons.is-success >.button:active, .input-group.is-success >.button:active, .button.is-success.is-active, .buttons.is-success >.button.is-active, .input-group.is-success >.button.is-active { border-color: #14b876; background-color: #14b876; color: #fff; fill: #fff; stroke-width: 0; } .button.is-success:focus, .buttons.is-success >.button:focus, .input-group.is-success >.button:focus { box-shadow: 0 0 0 3px rgba(24,216,139,0.25); } .button.is-success[disabled], .buttons.is-success >.button[disabled], .input-group.is-success >.button[disabled] { border-color: #18d88b; background-color: #18d88b; color: #fff; fill: #fff; stroke-width: 0; } .button.is-warning, .buttons.is-warning >.button, .input-group.is-warning >.button { border-color: #ffdd57; background-color: #ffdd57; color: #fff; fill: #fff; stroke-width: 0; } .button.is-warning.is-inverse, .buttons.is-warning >.button.is-inverse, .input-group.is-warning >.button.is-inverse, .buttons.is-warning.is-inverse >.button { background-color: transparent; color: #ffdd57; fill: #ffdd57; stroke-width: 0; } .button.is-warning:hover, .buttons.is-warning >.button:hover, .input-group.is-warning >.button:hover, .button.is-warning:active, .buttons.is-warning >.button:active, .input-group.is-warning >.button:active, .button.is-warning.is-active, .buttons.is-warning >.button.is-active, .input-group.is-warning >.button.is-active { border-color: #ffd324; background-color: #ffd324; color: #fff; fill: #fff; stroke-width: 0; } .button.is-warning:focus, .buttons.is-warning >.button:focus, .input-group.is-warning >.button:focus { box-shadow: 0 0 0 3px rgba(255,221,87,0.25); } .button.is-warning[disabled], .buttons.is-warning >.button[disabled], .input-group.is-warning >.button[disabled] { border-color: #ffdd57; background-color: #ffdd57; color: #fff; fill: #fff; stroke-width: 0; } .button.is-danger, .buttons.is-danger >.button, .input-group.is-danger >.button { border-color: #ff3d3d; background-color: #ff3d3d; color: #fff; fill: #fff; stroke-width: 0; } .button.is-danger.is-inverse, .buttons.is-danger >.button.is-inverse, .input-group.is-danger >.button.is-inverse, .buttons.is-danger.is-inverse >.button { background-color: transparent; color: #ff3d3d; fill: #ff3d3d; stroke-width: 0; } .button.is-danger:hover, .buttons.is-danger >.button:hover, .input-group.is-danger >.button:hover, .button.is-danger:active, .buttons.is-danger >.button:active, .input-group.is-danger >.button:active, .button.is-danger.is-active, .buttons.is-danger >.button.is-active, .input-group.is-danger >.button.is-active { border-color: #ff0e0e; background-color: #ff0e0e; color: #fff; fill: #fff; stroke-width: 0; } .button.is-danger:focus, .buttons.is-danger >.button:focus, .input-group.is-danger >.button:focus { box-shadow: 0 0 0 3px rgba(255,61,61,0.25); } .button.is-danger[disabled], .buttons.is-danger >.button[disabled], .input-group.is-danger >.button[disabled] { border-color: #ff3d3d; background-color: #ff3d3d; color: #fff; fill: #fff; stroke-width: 0; } .button.is-black, .buttons.is-black >.button, .input-group.is-black >.button { border-color: #000; background-color: #000; color: #fff; fill: #fff; stroke-width: 0; } .button.is-black.is-inverse, .buttons.is-black >.button.is-inverse, .input-group.is-black >.button.is-inverse, .buttons.is-black.is-inverse >.button { background-color: transparent; color: #000; fill: #000; stroke-width: 0; } .button.is-black:hover, .buttons.is-black >.button:hover, .input-group.is-black >.button:hover, .button.is-black:active, .buttons.is-black >.button:active, .input-group.is-black >.button:active, .button.is-black.is-active, .buttons.is-black >.button.is-active, .input-group.is-black >.button.is-active { border-color: #000; background-color: #000; color: #fff; fill: #fff; stroke-width: 0; } .button.is-black:focus, .buttons.is-black >.button:focus, .input-group.is-black >.button:focus { box-shadow: 0 0 0 3px rgba(0,0,0,0.25); } .button.is-black[disabled], .buttons.is-black >.button[disabled], .input-group.is-black >.button[disabled] { border-color: #000; background-color: #000; color: #fff; fill: #fff; stroke-width: 0; } .button.is-white, .buttons.is-white >.button, .input-group.is-white >.button { border-color: #fff; background-color: #fff; color: #000; fill: #000; stroke-width: 0; } .button.is-white.is-inverse, .buttons.is-white >.button.is-inverse, .input-group.is-white >.button.is-inverse, .buttons.is-white.is-inverse >.button { background-color: transparent; color: #fff; fill: #fff; stroke-width: 0; } .button.is-white:hover, .buttons.is-white >.button:hover, .input-group.is-white >.button:hover, .button.is-white:active, .buttons.is-white >.button:active, .input-group.is-white >.button:active, .button.is-white.is-active, .buttons.is-white >.button.is-active, .input-group.is-white >.button.is-active { border-color: #d9d9d9; background-color: #d9d9d9; color: #000; fill: #000; stroke-width: 0; } .button.is-white:focus, .buttons.is-white >.button:focus, .input-group.is-white >.button:focus { box-shadow: 0 0 0 3px rgba(255,255,255,0.25); } .button.is-white[disabled], .buttons.is-white >.button[disabled], .input-group.is-white >.button[disabled] { border-color: #fff; background-color: #fff; color: #000; fill: #000; stroke-width: 0; } .button.is-dark, .buttons.is-dark >.button, .input-group.is-dark >.button { border-color: #323c47; background-color: #323c47; color: #fff; fill: #fff; stroke-width: 0; } .button.is-dark.is-inverse, .buttons.is-dark >.button.is-inverse, .input-group.is-dark >.button.is-inverse, .buttons.is-dark.is-inverse >.button { background-color: transparent; color: #323c47; fill: #323c47; stroke-width: 0; } .button.is-dark:hover, .buttons.is-dark >.button:hover, .input-group.is-dark >.button:hover, .button.is-dark:active, .buttons.is-dark >.button:active, .input-group.is-dark >.button:active, .button.is-dark.is-active, .buttons.is-dark >.button.is-active, .input-group.is-dark >.button.is-active { border-color: #2a333c; background-color: #2a333c; color: #fff; fill: #fff; stroke-width: 0; } .button.is-dark:focus, .buttons.is-dark >.button:focus, .input-group.is-dark >.button:focus { box-shadow: 0 0 0 3px rgba(50,60,71,0.25); } .button.is-dark[disabled], .buttons.is-dark >.button[disabled], .input-group.is-dark >.button[disabled] { border-color: #323c47; background-color: #323c47; color: #fff; fill: #fff; stroke-width: 0; } .button.is-light, .buttons.is-light >.button, .input-group.is-light >.button { border-color: #f5f5f5; background-color: #f5f5f5; color: #000; fill: #000; stroke-width: 0; } .button.is-light.is-inverse, .buttons.is-light >.button.is-inverse, .input-group.is-light >.button.is-inverse, .buttons.is-light.is-inverse >.button { background-color: transparent; color: #f5f5f5; fill: #f5f5f5; stroke-width: 0; } .button.is-light:hover, .buttons.is-light >.button:hover, .input-group.is-light >.button:hover, .button.is-light:active, .buttons.is-light >.button:active, .input-group.is-light >.button:active, .button.is-light.is-active, .buttons.is-light >.button.is-active, .input-group.is-light >.button.is-active { border-color: #d0d0d0; background-color: #d0d0d0; color: #000; fill: #000; stroke-width: 0; } .button.is-light:focus, .buttons.is-light >.button:focus, .input-group.is-light >.button:focus { box-shadow: 0 0 0 3px rgba(245,245,245,0.25); } .button.is-light[disabled], .buttons.is-light >.button[disabled], .input-group.is-light >.button[disabled] { border-color: #f5f5f5; background-color: #f5f5f5; color: #000; fill: #000; stroke-width: 0; } .button .icon:first-child:not(:last-child) { margin-right: 0.25em; } .button .icon:last-child:not(:first-child) { margin-left: 0.25em; } .button .icon:only-child { margin: 0 -0.25em; } .button .label { margin: -0.5em 0; } .button.is-block, .buttons.is-block >.button, .input-group.is-block >.button { width: 100%; } .button.is-rounded, .buttons.is-rounded >.button, .input-group.is-rounded >.button { border-width: 1px; border-radius: 10em; } .button.is-clean { margin: 0; border: 0; background-color: transparent; color: #000; fill: #000; stroke-width: 0; } .button.is-link { padding-top: 0.3em; padding-bottom: 0.3em; padding-left: 0; padding-right: 0.7em; border: 0; background-color: transparent; color: #0072ff; fill: #0072ff; stroke-width: 0; } .button.is-link:after { position: absolute; display: block; content: ''; width: 100%; height: 0.15em; background-color: #0072ff; bottom: 0; left: 0; right: 0; } .button.is-link:hover, .button.is-link:active, .button.is-link.is-active { color: #eb008b; } .button.is-link:hover:after, .button.is-link:active:after, .button.is-link.is-active:after { background-color: #eb008b; height: 0.25em; } .button:hover { text-decoration: none; } .button.is-disabled, .button[disabled], .buttons.is-disabled >.button, .buttons[disabled] >.button, .input-group.is-disabled >.button { opacity: 0.8; cursor: not-allowed; } .buttons { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: center; align-items: center; margin-bottom: 10px; } .buttons >.label { z-index: 2; margin: 0 -18.5px; } .buttons >.button { margin-bottom: 0; } .buttons >.button:not(:first-child):not(:last-child) { border-radius: 0; } .buttons >.button:first-child { border-top-right-radius: 0; border-bottom-right-radius: 0; } .buttons >.button:last-child { border-top-left-radius: 0; border-bottom-left-radius: 0; } .buttons.is-inverse .button:not(:first-child):not(:last-child) { border-left-width: 0; } .buttons.is-inverse .button:last-child { border-left-width: 0; } .label { display: -ms-inline-flexbox; display: inline-flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; overflow: hidden; margin: 0 2px; margin-bottom: 10px; padding: 0.5em; min-width: 37px; border-radius: 4px; color: #000; vertical-align: top; font-weight: 200; line-height: 1; background-color: #c1c1c1; color: #fff; fill: #fff; stroke-width: 0; } .label img { margin: -0.75em; height: 2.5em; vertical-align: top; } .label .icon { height: 1em; width: 1em; } .label .icon:first-child:not(:last-child), .label img:first-child:not(:last-child) { margin-right: 0.25em; } .label .icon:last-child:not(:first-child), .label img:last-child:not(:first-child) { margin-left: 0.25em; } .label.is-primary { background-color: #0072ff; color: #fff; fill: #fff; stroke-width: 0; } .label.is-secondary { background-color: #c7c7c7; color: #000; fill: #000; stroke-width: 0; } .label.is-info { background-color: #00d4f0; color: #fff; fill: #fff; stroke-width: 0; } .label.is-success { background-color: #18d88b; color: #fff; fill: #fff; stroke-width: 0; } .label.is-warning { background-color: #ffdd57; color: #fff; fill: #fff; stroke-width: 0; } .label.is-danger { background-color: #ff3d3d; color: #fff; fill: #fff; stroke-width: 0; } .label.is-black { background-color: #000; color: #fff; fill: #fff; stroke-width: 0; } .label.is-white { background-color: #fff; color: #000; fill: #000; stroke-width: 0; } .label.is-dark { background-color: #323c47; color: #fff; fill: #fff; stroke-width: 0; } .label.is-light { background-color: #f5f5f5; color: #000; fill: #000; stroke-width: 0; } .label.is-rounded { border-radius: 10em; } .label.is-block { display: -ms-flexbox; display: flex; } .label.is-float { position: absolute; top: 0; margin: 0; margin-top: -1em; right: 0; margin-right: -1em; } .input { margin-bottom: 10px; padding: 0.5em 0.75em; width: 100%; outline: none; border-width: 1px; border-style: solid; border-radius: 4px; -webkit-appearance: none; -moz-appearance: none; border-color: #c1c1c1; } .input:focus { border-color: #0061d9; box-shadow: 0 0 0 3px rgba(0,114,255,0.25); } .input.is-primary, .input-group.is-primary >.input { border-color: #0072ff; } .input.is-primary:focus, .input-group.is-primary >.input:focus { border-color: #0061d9; box-shadow: 0 0 0 3px rgba(0,114,255,0.25); } .input.is-secondary, .input-group.is-secondary >.input { border-color: #c7c7c7; } .input.is-secondary:focus, .input-group.is-secondary >.input:focus { border-color: #a9a9a9; box-shadow: 0 0 0 3px rgba(199,199,199,0.25); } .input.is-info, .input-group.is-info >.input { border-color: #00d4f0; } .input.is-info:focus, .input-group.is-info >.input:focus { border-color: #00b4cc; box-shadow: 0 0 0 3px rgba(0,212,240,0.25); } .input.is-success, .input-group.is-success >.input { border-color: #18d88b; } .input.is-success:focus, .input-group.is-success >.input:focus { border-color: #14b876; box-shadow: 0 0 0 3px rgba(24,216,139,0.25); } .input.is-warning, .input-group.is-warning >.input { border-color: #ffdd57; } .input.is-warning:focus, .input-group.is-warning >.input:focus { border-color: #ffd324; box-shadow: 0 0 0 3px rgba(255,221,87,0.25); } .input.is-danger, .input-group.is-danger >.input { border-color: #ff3d3d; } .input.is-danger:focus, .input-group.is-danger >.input:focus { border-color: #ff0e0e; box-shadow: 0 0 0 3px rgba(255,61,61,0.25); } .input.is-black, .input-group.is-black >.input { border-color: #000; } .input.is-black:focus, .input-group.is-black >.input:focus { border-color: #000; box-shadow: 0 0 0 3px rgba(0,0,0,0.25); } .input.is-white, .input-group.is-white >.input { border-color: #fff; } .input.is-white:focus, .input-group.is-white >.input:focus { border-color: #d9d9d9; box-shadow: 0 0 0 3px rgba(255,255,255,0.25); } .input.is-dark, .input-group.is-dark >.input { border-color: #323c47; } .input.is-dark:focus, .input-group.is-dark >.input:focus { border-color: #2a333c; box-shadow: 0 0 0 3px rgba(50,60,71,0.25); } .input.is-light, .input-group.is-light >.input { border-color: #f5f5f5; } .input.is-light:focus, .input-group.is-light >.input:focus { border-color: #d0d0d0; box-shadow: 0 0 0 3px rgba(245,245,245,0.25); } .input.is-block, .input-group.is-block >.input { width: 100%; } .input.is-rounded, .input-group.is-rounded >.input { border-radius: 10em; } .input:disabled, .input.is-disabled, .input-group.is-disabled >.input { cursor: not-allowed; background: #c1c1c1; } .input.is-disabled, .input-group.is-disabled >.input { pointer-events: none; } .input-tag { display: -ms-inline-flexbox; display: inline-flex; padding: 0.5em 0.75em; border-width: 1px; border-style: solid; border-radius: 4px; vertical-align: top; text-align: center; border-color: #c1c1c1; background-color: #c1c1c1; color: #323c47; fill: #323c47; stroke-width: 0; } .input-tag .icon:first-child:not(:last-child) { margin-right: 0.25em; } .input-tag .icon:last-child:not(:first-child) { margin-left: 0.25em; } .input-tag .icon:only-child { margin: 0 -0.25em; } .input-tag.is-primary, .input-group.is-primary >.input-tag { border-color: #0072ff; background-color: #0072ff; color: #fff; fill: #fff; stroke-width: 0; } .input-tag.is-secondary, .input-group.is-secondary >.input-tag { border-color: #c7c7c7; background-color: #c7c7c7; color: #fff; fill: #fff; stroke-width: 0; } .input-tag.is-info, .input-group.is-info >.input-ta