Last active
November 28, 2015 17:39
-
-
Save OleVik/f885e51ba3fe8a6d07e7 to your computer and use it in GitHub Desktop.
Foundation 6 Flex
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @charset"UTF-8"; | |
| /*! normalize.css v3.0.2 | MIT License | git.io/normalize */ | |
| /** | |
| * 1. Set default font family to sans-serif. | |
| * 2. Prevent iOS text size adjust after orientation change, without disabling | |
| * user zoom. | |
| */ | |
| html { | |
| font-family: sans-serif; | |
| /* 1 */ | |
| -ms-text-size-adjust: 100%; | |
| /* 2 */ | |
| -webkit-text-size-adjust: 100%; | |
| /* 2 */ | |
| } | |
| /** | |
| * Remove default margin. | |
| */ | |
| body { | |
| margin: 0; | |
| } | |
| /* HTML5 display definitions | |
| ========================================================================== */ | |
| /** | |
| * Correct `block` display not defined for any HTML5 element in IE 8/9. | |
| * Correct `block` display not defined for `details` or `summary` in IE 10/11 | |
| * and Firefox. | |
| * Correct `block` display not defined for `main` in IE 11. | |
| */ | |
| article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { | |
| display: block; | |
| } | |
| /** | |
| * 1. Correct `inline-block` display not defined in IE 8/9. | |
| * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. | |
| */ | |
| audio, canvas, progress, video { | |
| display: inline-block; | |
| /* 1 */ | |
| vertical-align: baseline; | |
| /* 2 */ | |
| } | |
| /** | |
| * Prevent modern browsers from displaying `audio` without controls. | |
| * Remove excess height in iOS 5 devices. | |
| */ | |
| audio:not([controls]) { | |
| display: none; | |
| height: 0; | |
| } | |
| /** | |
| * Address `[hidden]` styling not present in IE 8/9/10. | |
| * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. | |
| */ | |
| [hidden], template { | |
| display: none; | |
| } | |
| /* Links | |
| ========================================================================== */ | |
| /** | |
| * Remove the gray background color from active links in IE 10. | |
| */ | |
| a { | |
| background-color: transparent; | |
| } | |
| /** | |
| * Improve readability when focused and also mouse hovered in all browsers. | |
| */ | |
| a:active, a:hover { | |
| outline: 0; | |
| } | |
| /* Text-level semantics | |
| ========================================================================== */ | |
| /** | |
| * Address styling not present in IE 8/9/10/11, Safari, and Chrome. | |
| */ | |
| abbr[title] { | |
| border-bottom: 1px dotted; | |
| } | |
| /** | |
| * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. | |
| */ | |
| b, strong { | |
| font-weight: bold; | |
| } | |
| /** | |
| * Address styling not present in Safari and Chrome. | |
| */ | |
| dfn { | |
| font-style: italic; | |
| } | |
| /** | |
| * Address variable `h1` font-size and margin within `section` and `article` | |
| * contexts in Firefox 4+, Safari, and Chrome. | |
| */ | |
| h1 { | |
| font-size: 2em; | |
| margin: 0.67em 0; | |
| } | |
| /** | |
| * Address styling not present in IE 8/9. | |
| */ | |
| mark { | |
| background: #ff0; | |
| color: #000; | |
| } | |
| /** | |
| * Address inconsistent and variable font size in all browsers. | |
| */ | |
| small { | |
| font-size: 80%; | |
| } | |
| /** | |
| * Prevent `sub` and `sup` affecting `line-height` in all browsers. | |
| */ | |
| sub, sup { | |
| font-size: 75%; | |
| line-height: 0; | |
| position: relative; | |
| vertical-align: baseline; | |
| } | |
| sup { | |
| top: -0.5em; | |
| } | |
| sub { | |
| bottom: -0.25em; | |
| } | |
| /* Embedded content | |
| ========================================================================== */ | |
| /** | |
| * Remove border when inside `a` element in IE 8/9/10. | |
| */ | |
| img { | |
| border: 0; | |
| } | |
| /** | |
| * Correct overflow not hidden in IE 9/10/11. | |
| */ | |
| svg:not(:root) { | |
| overflow: hidden; | |
| } | |
| /* Grouping content | |
| ========================================================================== */ | |
| /** | |
| * Address margin not present in IE 8/9 and Safari. | |
| */ | |
| figure { | |
| margin: 1em 40px; | |
| } | |
| /** | |
| * Address differences between Firefox and other browsers. | |
| */ | |
| hr { | |
| box-sizing: content-box; | |
| height: 0; | |
| } | |
| /** | |
| * Contain overflow in all browsers. | |
| */ | |
| pre { | |
| overflow: auto; | |
| } | |
| /** | |
| * Address odd `em`-unit font size rendering in all browsers. | |
| */ | |
| code, kbd, pre, samp { | |
| font-family: monospace, monospace; | |
| font-size: 1em; | |
| } | |
| /* Forms | |
| ========================================================================== */ | |
| /** | |
| * Known limitation: by default, Chrome and Safari on OS X allow very limited | |
| * styling of `select`, unless a `border` property is set. | |
| */ | |
| /** | |
| * 1. Correct color not being inherited. | |
| * Known issue: affects color of disabled elements. | |
| * 2. Correct font properties not being inherited. | |
| * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. | |
| */ | |
| button, input, optgroup, select, textarea { | |
| color: inherit; | |
| /* 1 */ | |
| font: inherit; | |
| /* 2 */ | |
| margin: 0; | |
| /* 3 */ | |
| } | |
| /** | |
| * Address `overflow` set to `hidden` in IE 8/9/10/11. | |
| */ | |
| button { | |
| overflow: visible; | |
| } | |
| /** | |
| * Address inconsistent `text-transform` inheritance for `button` and `select`. | |
| * All other form control elements do not inherit `text-transform` values. | |
| * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. | |
| * Correct `select` style inheritance in Firefox. | |
| */ | |
| button, select { | |
| text-transform: none; | |
| } | |
| /** | |
| * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` | |
| * and `video` controls. | |
| * 2. Correct inability to style clickable `input` types in iOS. | |
| * 3. Improve usability and consistency of cursor style between image-type | |
| * `input` and others. | |
| */ | |
| button, html input[type="button"], input[type="reset"], input[type="submit"] { | |
| -webkit-appearance: button; | |
| /* 2 */ | |
| cursor: pointer; | |
| /* 3 */ | |
| } | |
| /** | |
| * Re-set default cursor for disabled elements. | |
| */ | |
| button[disabled], html input[disabled] { | |
| cursor: default; | |
| } | |
| /** | |
| * Remove inner padding and border in Firefox 4+. | |
| */ | |
| button::-moz-focus-inner, input::-moz-focus-inner { | |
| border: 0; | |
| padding: 0; | |
| } | |
| /** | |
| * Address Firefox 4+ setting `line-height` on `input` using `!important` in | |
| * the UA stylesheet. | |
| */ | |
| input { | |
| line-height: normal; | |
| } | |
| /** | |
| * It's recommended that you don't attempt to style these elements. | |
| * Firefox's implementation doesn't respect box-sizing, padding, or width. | |
| * | |
| * 1. Address box sizing set to `content-box` in IE 8/9/10. | |
| * 2. Remove excess padding in IE 8/9/10. | |
| */ | |
| input[type="checkbox"], input[type="radio"] { | |
| box-sizing: border-box; | |
| /* 1 */ | |
| padding: 0; | |
| /* 2 */ | |
| } | |
| /** | |
| * Fix the cursor style for Chrome's increment/decrement buttons. For certain | |
| * `font-size` values of the `input`, it causes the cursor style of the | |
| * decrement button to change from `default` to `text`. | |
| */ | |
| input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { | |
| height: auto; | |
| } | |
| /** | |
| * 1. Address `appearance` set to `searchfield` in Safari and Chrome. | |
| * 2. Address `box-sizing` set to `border-box` in Safari and Chrome | |
| * (include `-moz` to future-proof). | |
| */ | |
| input[type="search"] { | |
| -webkit-appearance: textfield; | |
| /* 1 */ | |
| /* 2 */ | |
| box-sizing: content-box; | |
| } | |
| /** | |
| * Remove inner padding and search cancel button in Safari and Chrome on OS X. | |
| * Safari (but not Chrome) clips the cancel button when the search input has | |
| * padding (and `textfield` appearance). | |
| */ | |
| input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { | |
| -webkit-appearance: none; | |
| } | |
| /** | |
| * Define consistent border, margin, and padding. | |
| */ | |
| fieldset { | |
| border: 1px solid #c0c0c0; | |
| margin: 0 2px; | |
| padding: 0.35em 0.625em 0.75em; | |
| } | |
| /** | |
| * 1. Correct `color` not being inherited in IE 8/9/10/11. | |
| * 2. Remove padding so people aren't caught out if they zero out fieldsets. | |
| */ | |
| legend { | |
| border: 0; | |
| /* 1 */ | |
| padding: 0; | |
| /* 2 */ | |
| } | |
| /** | |
| * Remove default vertical scrollbar in IE 8/9/10/11. | |
| */ | |
| textarea { | |
| overflow: auto; | |
| } | |
| /** | |
| * Don't inherit the `font-weight` (applied by a rule above). | |
| * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. | |
| */ | |
| optgroup { | |
| font-weight: bold; | |
| } | |
| /* Tables | |
| ========================================================================== */ | |
| /** | |
| * Remove most spacing between table cells. | |
| */ | |
| table { | |
| border-collapse: collapse; | |
| border-spacing: 0; | |
| } | |
| td, th { | |
| padding: 0; | |
| } | |
| body.is-reveal-open { | |
| overflow: hidden; | |
| } | |
| .foundation-mq { | |
| font-family:"small=0em&medium=32em&large=64em&xlarge=75em&xxlarge=90em"; | |
| } | |
| .slide-in-down.mui-enter, .slide-in-left.mui-enter, .slide-in-up.mui-enter, .slide-in-right.mui-enter, .slide-out-down.mui-leave, .slide-out-right.mui-leave, .slide-out-up.mui-leave, .slide-out-left.mui-leave, .fade-in.mui-enter, .fade-out.mui-leave, .hinge-in-from-top.mui-enter, .hinge-in-from-right.mui-enter, .hinge-in-from-bottom.mui-enter, .hinge-in-from-left.mui-enter, .hinge-in-from-middle-x.mui-enter, .hinge-in-from-middle-y.mui-enter, .hinge-out-from-top.mui-leave, .hinge-out-from-right.mui-leave, .hinge-out-from-bottom.mui-leave, .hinge-out-from-left.mui-leave, .hinge-out-from-middle-x.mui-leave, .hinge-out-from-middle-y.mui-leave, .scale-in-up.mui-enter, .scale-in-down.mui-enter, .scale-out-up.mui-leave, .scale-out-down.mui-leave, .spin-in.mui-enter, .spin-out.mui-leave, .spin-in-ccw.mui-enter, .spin-out-ccw.mui-leave { | |
| transition-duration: 500ms; | |
| transition-timing-function: linear; | |
| } | |
| html, body { | |
| font-size: 100%; | |
| box-sizing: border-box; | |
| } | |
| *, *:before, *:after { | |
| box-sizing: inherit; | |
| } | |
| body { | |
| padding: 0; | |
| margin: 0; | |
| font-family:"Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; | |
| font-weight: normal; | |
| line-height: 1.5; | |
| color: #0a0a0a; | |
| background: #fefefe; | |
| -webkit-font-smoothing: antialiased; | |
| -moz-osx-font-smoothing: grayscale; | |
| } | |
| img { | |
| max-width: 100%; | |
| height: auto; | |
| -ms-interpolation-mode: bicubic; | |
| display: inline-block; | |
| vertical-align: middle; | |
| } | |
| textarea { | |
| height: auto; | |
| min-height: 50px; | |
| border-radius: 0; | |
| } | |
| select { | |
| width: 100%; | |
| border-radius: 0; | |
| } | |
| #map_canvas img, #map_canvas embed, #map_canvas object, .map_canvas img, .map_canvas embed, .map_canvas object, .mqa-display img, .mqa-display embed, .mqa-display object { | |
| max-width: none !important; | |
| } | |
| button { | |
| -webkit-appearance: none; | |
| -moz-appearance: none; | |
| background: transparent; | |
| padding: 0; | |
| border: 0; | |
| border-radius: 0; | |
| line-height: 1; | |
| } | |
| .row { | |
| max-width: 75rem; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| -webkit-flex-flow: row wrap; | |
| -ms-flex-flow: row wrap; | |
| flex-flow: row wrap; | |
| margin-left: auto; | |
| margin-right: auto; | |
| } | |
| .row .row, .column-row .row { | |
| margin-left: -0.9375rem; | |
| margin-right: -0.9375rem; | |
| } | |
| .column, .columns { | |
| -webkit-flex: 1 1 0px; | |
| -ms-flex: 1 1 0px; | |
| flex: 1 1 0px; | |
| padding-left: 0.9375rem; | |
| padding-right: 0.9375rem; | |
| } | |
| .small-1 { | |
| -webkit-flex: 0 0 8.33333%; | |
| -ms-flex: 0 0 8.33333%; | |
| flex: 0 0 8.33333%; | |
| max-width: 8.33333%; | |
| } | |
| .small-2 { | |
| -webkit-flex: 0 0 16.66667%; | |
| -ms-flex: 0 0 16.66667%; | |
| flex: 0 0 16.66667%; | |
| max-width: 16.66667%; | |
| } | |
| .small-3 { | |
| -webkit-flex: 0 0 25%; | |
| -ms-flex: 0 0 25%; | |
| flex: 0 0 25%; | |
| max-width: 25%; | |
| } | |
| .small-4 { | |
| -webkit-flex: 0 0 33.33333%; | |
| -ms-flex: 0 0 33.33333%; | |
| flex: 0 0 33.33333%; | |
| max-width: 33.33333%; | |
| } | |
| .small-5 { | |
| -webkit-flex: 0 0 41.66667%; | |
| -ms-flex: 0 0 41.66667%; | |
| flex: 0 0 41.66667%; | |
| max-width: 41.66667%; | |
| } | |
| .small-6 { | |
| -webkit-flex: 0 0 50%; | |
| -ms-flex: 0 0 50%; | |
| flex: 0 0 50%; | |
| max-width: 50%; | |
| } | |
| .small-7 { | |
| -webkit-flex: 0 0 58.33333%; | |
| -ms-flex: 0 0 58.33333%; | |
| flex: 0 0 58.33333%; | |
| max-width: 58.33333%; | |
| } | |
| .small-8 { | |
| -webkit-flex: 0 0 66.66667%; | |
| -ms-flex: 0 0 66.66667%; | |
| flex: 0 0 66.66667%; | |
| max-width: 66.66667%; | |
| } | |
| .small-9 { | |
| -webkit-flex: 0 0 75%; | |
| -ms-flex: 0 0 75%; | |
| flex: 0 0 75%; | |
| max-width: 75%; | |
| } | |
| .small-10 { | |
| -webkit-flex: 0 0 83.33333%; | |
| -ms-flex: 0 0 83.33333%; | |
| flex: 0 0 83.33333%; | |
| max-width: 83.33333%; | |
| } | |
| .small-11 { | |
| -webkit-flex: 0 0 91.66667%; | |
| -ms-flex: 0 0 91.66667%; | |
| flex: 0 0 91.66667%; | |
| max-width: 91.66667%; | |
| } | |
| .small-12 { | |
| -webkit-flex: 0 0 100%; | |
| -ms-flex: 0 0 100%; | |
| flex: 0 0 100%; | |
| max-width: 100%; | |
| } | |
| @media screen and (min-width: 32em) { | |
| .medium-1 { | |
| -webkit-flex: 0 0 8.33333%; | |
| -ms-flex: 0 0 8.33333%; | |
| flex: 0 0 8.33333%; | |
| max-width: 8.33333%; | |
| } | |
| .medium-2 { | |
| -webkit-flex: 0 0 16.66667%; | |
| -ms-flex: 0 0 16.66667%; | |
| flex: 0 0 16.66667%; | |
| max-width: 16.66667%; | |
| } | |
| .medium-3 { | |
| -webkit-flex: 0 0 25%; | |
| -ms-flex: 0 0 25%; | |
| flex: 0 0 25%; | |
| max-width: 25%; | |
| } | |
| .medium-4 { | |
| -webkit-flex: 0 0 33.33333%; | |
| -ms-flex: 0 0 33.33333%; | |
| flex: 0 0 33.33333%; | |
| max-width: 33.33333%; | |
| } | |
| .medium-5 { | |
| -webkit-flex: 0 0 41.66667%; | |
| -ms-flex: 0 0 41.66667%; | |
| flex: 0 0 41.66667%; | |
| max-width: 41.66667%; | |
| } | |
| .medium-6 { | |
| -webkit-flex: 0 0 50%; | |
| -ms-flex: 0 0 50%; | |
| flex: 0 0 50%; | |
| max-width: 50%; | |
| } | |
| .medium-7 { | |
| -webkit-flex: 0 0 58.33333%; | |
| -ms-flex: 0 0 58.33333%; | |
| flex: 0 0 58.33333%; | |
| max-width: 58.33333%; | |
| } | |
| .medium-8 { | |
| -webkit-flex: 0 0 66.66667%; | |
| -ms-flex: 0 0 66.66667%; | |
| flex: 0 0 66.66667%; | |
| max-width: 66.66667%; | |
| } | |
| .medium-9 { | |
| -webkit-flex: 0 0 75%; | |
| -ms-flex: 0 0 75%; | |
| flex: 0 0 75%; | |
| max-width: 75%; | |
| } | |
| .medium-10 { | |
| -webkit-flex: 0 0 83.33333%; | |
| -ms-flex: 0 0 83.33333%; | |
| flex: 0 0 83.33333%; | |
| max-width: 83.33333%; | |
| } | |
| .medium-11 { | |
| -webkit-flex: 0 0 91.66667%; | |
| -ms-flex: 0 0 91.66667%; | |
| flex: 0 0 91.66667%; | |
| max-width: 91.66667%; | |
| } | |
| .medium-12 { | |
| -webkit-flex: 0 0 100%; | |
| -ms-flex: 0 0 100%; | |
| flex: 0 0 100%; | |
| max-width: 100%; | |
| } | |
| } | |
| @media screen and (min-width: 64em) { | |
| .large-1 { | |
| -webkit-flex: 0 0 8.33333%; | |
| -ms-flex: 0 0 8.33333%; | |
| flex: 0 0 8.33333%; | |
| max-width: 8.33333%; | |
| } | |
| .large-2 { | |
| -webkit-flex: 0 0 16.66667%; | |
| -ms-flex: 0 0 16.66667%; | |
| flex: 0 0 16.66667%; | |
| max-width: 16.66667%; | |
| } | |
| .large-3 { | |
| -webkit-flex: 0 0 25%; | |
| -ms-flex: 0 0 25%; | |
| flex: 0 0 25%; | |
| max-width: 25%; | |
| } | |
| .large-4 { | |
| -webkit-flex: 0 0 33.33333%; | |
| -ms-flex: 0 0 33.33333%; | |
| flex: 0 0 33.33333%; | |
| max-width: 33.33333%; | |
| } | |
| .large-5 { | |
| -webkit-flex: 0 0 41.66667%; | |
| -ms-flex: 0 0 41.66667%; | |
| flex: 0 0 41.66667%; | |
| max-width: 41.66667%; | |
| } | |
| .large-6 { | |
| -webkit-flex: 0 0 50%; | |
| -ms-flex: 0 0 50%; | |
| flex: 0 0 50%; | |
| max-width: 50%; | |
| } | |
| .large-7 { | |
| -webkit-flex: 0 0 58.33333%; | |
| -ms-flex: 0 0 58.33333%; | |
| flex: 0 0 58.33333%; | |
| max-width: 58.33333%; | |
| } | |
| .large-8 { | |
| -webkit-flex: 0 0 66.66667%; | |
| -ms-flex: 0 0 66.66667%; | |
| flex: 0 0 66.66667%; | |
| max-width: 66.66667%; | |
| } | |
| .large-9 { | |
| -webkit-flex: 0 0 75%; | |
| -ms-flex: 0 0 75%; | |
| flex: 0 0 75%; | |
| max-width: 75%; | |
| } | |
| .large-10 { | |
| -webkit-flex: 0 0 83.33333%; | |
| -ms-flex: 0 0 83.33333%; | |
| flex: 0 0 83.33333%; | |
| max-width: 83.33333%; | |
| } | |
| .large-11 { | |
| -webkit-flex: 0 0 91.66667%; | |
| -ms-flex: 0 0 91.66667%; | |
| flex: 0 0 91.66667%; | |
| max-width: 91.66667%; | |
| } | |
| .large-12 { | |
| -webkit-flex: 0 0 100%; | |
| -ms-flex: 0 0 100%; | |
| flex: 0 0 100%; | |
| max-width: 100%; | |
| } | |
| } | |
| @media screen and (min-width: 32em) { | |
| .medium-expand { | |
| -webkit-flex: 1 1 0px; | |
| -ms-flex: 1 1 0px; | |
| flex: 1 1 0px; | |
| } | |
| } | |
| @media screen and (min-width: 64em) { | |
| .large-expand { | |
| -webkit-flex: 1 1 0px; | |
| -ms-flex: 1 1 0px; | |
| flex: 1 1 0px; | |
| } | |
| } | |
| .shrink { | |
| -webkit-flex: 0 0 auto; | |
| -ms-flex: 0 0 auto; | |
| flex: 0 0 auto; | |
| } | |
| .row.medium-unstack .column { | |
| -webkit-flex: 0 0 100%; | |
| -ms-flex: 0 0 100%; | |
| flex: 0 0 100%; | |
| } | |
| @media screen and (min-width: 32em) { | |
| .row.medium-unstack .column { | |
| -webkit-flex: 1 1 0px; | |
| -ms-flex: 1 1 0px; | |
| flex: 1 1 0px; | |
| } | |
| } | |
| .row.large-unstack .column { | |
| -webkit-flex: 0 0 100%; | |
| -ms-flex: 0 0 100%; | |
| flex: 0 0 100%; | |
| } | |
| @media screen and (min-width: 64em) { | |
| .row.large-unstack .column { | |
| -webkit-flex: 1 1 0px; | |
| -ms-flex: 1 1 0px; | |
| flex: 1 1 0px; | |
| } | |
| } | |
| .small-order-1 { | |
| -webkit-order: 1; | |
| -ms-flex-order: 1; | |
| order: 1; | |
| } | |
| .small-order-2 { | |
| -webkit-order: 2; | |
| -ms-flex-order: 2; | |
| order: 2; | |
| } | |
| .small-order-3 { | |
| -webkit-order: 3; | |
| -ms-flex-order: 3; | |
| order: 3; | |
| } | |
| .small-order-4 { | |
| -webkit-order: 4; | |
| -ms-flex-order: 4; | |
| order: 4; | |
| } | |
| .small-order-5 { | |
| -webkit-order: 5; | |
| -ms-flex-order: 5; | |
| order: 5; | |
| } | |
| .small-order-6 { | |
| -webkit-order: 6; | |
| -ms-flex-order: 6; | |
| order: 6; | |
| } | |
| @media screen and (min-width: 32em) { | |
| .medium-order-1 { | |
| -webkit-order: 1; | |
| -ms-flex-order: 1; | |
| order: 1; | |
| } | |
| .medium-order-2 { | |
| -webkit-order: 2; | |
| -ms-flex-order: 2; | |
| order: 2; | |
| } | |
| .medium-order-3 { | |
| -webkit-order: 3; | |
| -ms-flex-order: 3; | |
| order: 3; | |
| } | |
| .medium-order-4 { | |
| -webkit-order: 4; | |
| -ms-flex-order: 4; | |
| order: 4; | |
| } | |
| .medium-order-5 { | |
| -webkit-order: 5; | |
| -ms-flex-order: 5; | |
| order: 5; | |
| } | |
| .medium-order-6 { | |
| -webkit-order: 6; | |
| -ms-flex-order: 6; | |
| order: 6; | |
| } | |
| } | |
| @media screen and (min-width: 64em) { | |
| .large-order-1 { | |
| -webkit-order: 1; | |
| -ms-flex-order: 1; | |
| order: 1; | |
| } | |
| .large-order-2 { | |
| -webkit-order: 2; | |
| -ms-flex-order: 2; | |
| order: 2; | |
| } | |
| .large-order-3 { | |
| -webkit-order: 3; | |
| -ms-flex-order: 3; | |
| order: 3; | |
| } | |
| .large-order-4 { | |
| -webkit-order: 4; | |
| -ms-flex-order: 4; | |
| order: 4; | |
| } | |
| .large-order-5 { | |
| -webkit-order: 5; | |
| -ms-flex-order: 5; | |
| order: 5; | |
| } | |
| .large-order-6 { | |
| -webkit-order: 6; | |
| -ms-flex-order: 6; | |
| order: 6; | |
| } | |
| } | |
| .row.align-right { | |
| -webkit-justify-content: flex-end; | |
| -ms-flex-pack: end; | |
| justify-content: flex-end; | |
| } | |
| .row.align-center { | |
| -webkit-justify-content: center; | |
| -ms-flex-pack: center; | |
| justify-content: center; | |
| } | |
| .row.align-justify { | |
| -webkit-justify-content: space-between; | |
| -ms-flex-pack: justify; | |
| justify-content: space-between; | |
| } | |
| .row.align-spaced { | |
| -webkit-justify-content: space-around; | |
| -ms-flex-pack: distribute; | |
| justify-content: space-around; | |
| } | |
| .row.align-top { | |
| -webkit-align-items: flex-start; | |
| -ms-flex-align: start; | |
| align-items: flex-start; | |
| } | |
| .column.align-top { | |
| -webkit-align-self: flex-start; | |
| -ms-flex-item-align: start; | |
| align-self: flex-start; | |
| } | |
| .row.align-bottom { | |
| -webkit-align-items: flex-end; | |
| -ms-flex-align: end; | |
| align-items: flex-end; | |
| } | |
| .column.align-bottom { | |
| -webkit-align-self: flex-end; | |
| -ms-flex-item-align: end; | |
| align-self: flex-end; | |
| } | |
| .row.align-middle { | |
| -webkit-align-items: center; | |
| -ms-flex-align: center; | |
| align-items: center; | |
| } | |
| .column.align-middle { | |
| -webkit-align-self: center; | |
| -ms-flex-item-align: center; | |
| align-self: center; | |
| } | |
| .row.align-stretch { | |
| -webkit-align-items: stretch; | |
| -ms-flex-align: stretch; | |
| align-items: stretch; | |
| } | |
| .column.align-stretch { | |
| -webkit-align-self: stretch; | |
| -ms-flex-item-align: stretch; | |
| align-self: stretch; | |
| } | |
| div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td { | |
| margin: 0; | |
| padding: 0; | |
| } | |
| p { | |
| font-size: inherit; | |
| line-height: 1.6; | |
| margin-bottom: 1rem; | |
| text-rendering: optimizeLegibility; | |
| } | |
| em, i { | |
| font-style: italic; | |
| line-height: inherit; | |
| } | |
| strong, b { | |
| font-weight: bold; | |
| line-height: inherit; | |
| } | |
| small { | |
| font-size: 80%; | |
| line-height: inherit; | |
| } | |
| h1, h2, h3, h4, h5, h6 { | |
| font-family:"Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; | |
| font-weight: normal; | |
| font-style: normal; | |
| color: inherit; | |
| text-rendering: optimizeLegibility; | |
| margin-top: 0; | |
| margin-bottom: 0.5rem; | |
| line-height: 1.4; | |
| } | |
| h1 small, h2 small, h3 small, h4 small, h5 small, h6 small { | |
| color: #cacaca; | |
| line-height: 0; | |
| } | |
| h1 { | |
| font-size: 1.5rem; | |
| } | |
| h2 { | |
| font-size: 1.25rem; | |
| } | |
| h3 { | |
| font-size: 1.1875rem; | |
| } | |
| h4 { | |
| font-size: 1.125rem; | |
| } | |
| h5 { | |
| font-size: 1.0625rem; | |
| } | |
| h6 { | |
| font-size: 1rem; | |
| } | |
| @media screen and (min-width: 32em) { | |
| h1 { | |
| font-size: 3rem; | |
| } | |
| h2 { | |
| font-size: 2.5rem; | |
| } | |
| h3 { | |
| font-size: 1.9375rem; | |
| } | |
| h4 { | |
| font-size: 1.5625rem; | |
| } | |
| h5 { | |
| font-size: 1.25rem; | |
| } | |
| h6 { | |
| font-size: 1rem; | |
| } | |
| } | |
| a { | |
| color: #2199e8; | |
| text-decoration: none; | |
| line-height: inherit; | |
| cursor: pointer; | |
| } | |
| a:hover, a:focus { | |
| color: #1585cf; | |
| } | |
| a img { | |
| border: 0; | |
| } | |
| hr { | |
| max-width: 75rem; | |
| height: 0; | |
| border-top: 0; | |
| border-bottom: 1px solid #cacaca; | |
| margin: 1.25rem auto; | |
| clear: both; | |
| } | |
| ul, ol, dl { | |
| line-height: 1.6; | |
| margin-bottom: 1rem; | |
| list-style-position: outside; | |
| } | |
| li { | |
| font-size: inherit; | |
| } | |
| ul { | |
| list-style-type: disc; | |
| margin-left: 1.25rem; | |
| } | |
| ol { | |
| margin-left: 1.25rem; | |
| } | |
| ul ul, ol ul, ul ol, ol ol { | |
| margin-left: 1.25rem; | |
| margin-bottom: 0; | |
| list-style-type: inherit; | |
| } | |
| dl { | |
| margin-bottom: 1rem; | |
| } | |
| dl dt { | |
| margin-bottom: 0.3rem; | |
| font-weight: bold; | |
| } | |
| blockquote { | |
| margin: 0 0 1rem; | |
| padding: 0.5625rem 1.25rem 0 1.1875rem; | |
| border-left: 1px solid #cacaca; | |
| } | |
| blockquote, blockquote p { | |
| line-height: 1.6; | |
| color: #8a8a8a; | |
| } | |
| cite { | |
| display: block; | |
| font-size: 0.8125rem; | |
| color: #8a8a8a; | |
| } | |
| cite:before { | |
| content:'\2014 \0020'; | |
| } | |
| abbr { | |
| color: #0a0a0a; | |
| cursor: help; | |
| border-bottom: 1px dotted #0a0a0a; | |
| } | |
| code { | |
| font-family: Consolas, "Liberation Mono", Courier, monospace; | |
| font-weight: normal; | |
| color: #0a0a0a; | |
| background-color: #e6e6e6; | |
| border: 1px solid #cacaca; | |
| padding: 0.125rem 0.3125rem 0.0625rem; | |
| } | |
| kbd { | |
| padding: 0.125rem 0.25rem 0; | |
| margin: 0; | |
| background-color: #e6e6e6; | |
| color: #0a0a0a; | |
| font-family: Consolas, "Liberation Mono", Courier, monospace; | |
| } | |
| .subheader { | |
| margin-top: 0.2rem; | |
| margin-bottom: 0.5rem; | |
| font-weight: normal; | |
| line-height: 1.4; | |
| color: #8a8a8a; | |
| } | |
| .lead { | |
| font-size: 125%; | |
| line-height: 1.6; | |
| } | |
| .stat { | |
| font-size: 2.5rem; | |
| line-height: 1; | |
| } | |
| p + .stat { | |
| margin-top: -1rem; | |
| } | |
| .no-bullet { | |
| margin-left: 0; | |
| list-style: none; | |
| } | |
| .text-left { | |
| text-align: left; | |
| } | |
| @media screen and (min-width: 32em) { | |
| .medium-text-left { | |
| text-align: left; | |
| } | |
| } | |
| @media screen and (min-width: 64em) { | |
| .large-text-left { | |
| text-align: left; | |
| } | |
| } | |
| .text-right { | |
| text-align: right; | |
| } | |
| @media screen and (min-width: 32em) { | |
| .medium-text-right { | |
| text-align: right; | |
| } | |
| } | |
| @media screen and (min-width: 64em) { | |
| .large-text-right { | |
| text-align: right; | |
| } | |
| } | |
| .text-center { | |
| text-align: center; | |
| } | |
| @media screen and (min-width: 32em) { | |
| .medium-text-center { | |
| text-align: center; | |
| } | |
| } | |
| @media screen and (min-width: 64em) { | |
| .large-text-center { | |
| text-align: center; | |
| } | |
| } | |
| .text-justify { | |
| text-align: justify; | |
| } | |
| @media screen and (min-width: 32em) { | |
| .medium-text-justify { | |
| text-align: justify; | |
| } | |
| } | |
| @media screen and (min-width: 64em) { | |
| .large-text-justify { | |
| text-align: justify; | |
| } | |
| } | |
| .show-for-print { | |
| display: none !important; | |
| } | |
| @media print { | |
| * { | |
| background: transparent !important; | |
| color: black !important; | |
| box-shadow: none !important; | |
| text-shadow: none !important; | |
| } | |
| .show-for-print { | |
| display: block !important; | |
| } | |
| .hide-for-print { | |
| display: none !important; | |
| } | |
| table.show-for-print { | |
| display: table !important; | |
| } | |
| thead.show-for-print { | |
| display: table-header-group !important; | |
| } | |
| tbody.show-for-print { | |
| display: table-row-group !important; | |
| } | |
| tr.show-for-print { | |
| display: table-row !important; | |
| } | |
| td.show-for-print { | |
| display: table-cell !important; | |
| } | |
| th.show-for-print { | |
| display: table-cell !important; | |
| } | |
| a, a:visited { | |
| text-decoration: underline; | |
| } | |
| a[href]:after { | |
| content:" (" attr(href)")"; | |
| } | |
| .ir a:after, a[href^='javascript:']:after, a[href^='#']:after { | |
| content:''; | |
| } | |
| abbr[title]:after { | |
| content:" (" attr(title)")"; | |
| } | |
| pre, blockquote { | |
| border: 1px solid #999; | |
| page-break-inside: avoid; | |
| } | |
| thead { | |
| display: table-header-group; | |
| } | |
| tr, img { | |
| page-break-inside: avoid; | |
| } | |
| img { | |
| max-width: 100% !important; | |
| } | |
| @page { | |
| margin: 0.5cm; | |
| } | |
| p, h2, h3 { | |
| orphans: 3; | |
| widows: 3; | |
| } | |
| h2, h3 { | |
| page-break-after: avoid; | |
| } | |
| } | |
| .button { | |
| display: inline-block; | |
| text-align: center; | |
| line-height: 1; | |
| cursor: pointer; | |
| -webkit-appearance: none; | |
| transition: all 0.25s ease-out; | |
| vertical-align: middle; | |
| border: 1px solid transparent; | |
| border-radius: 0; | |
| padding: 0.85em 1em; | |
| margin: 0 1rem 1rem 0; | |
| font-size: 0.9rem; | |
| background: #2199e8; | |
| color: #fff; | |
| } | |
| [data-whatinput="mouse"] .button { | |
| outline: 0; | |
| } | |
| .button:hover, .button:focus { | |
| background: #1583cc; | |
| color: #fff; | |
| } | |
| .button.tiny { | |
| font-size: 0.6rem; | |
| } | |
| .button.small { | |
| font-size: 0.75rem; | |
| } | |
| .button.large { | |
| font-size: 1.25rem; | |
| } | |
| .button.expanded { | |
| display: block; | |
| width: 100%; | |
| margin-left: 0; | |
| margin-right: 0; | |
| } | |
| .button.primary { | |
| background: #2199e8; | |
| color: #fff; | |
| } | |
| .button.primary:hover, .button.primary:focus { | |
| background: #147cc0; | |
| color: #fff; | |
| } | |
| .button.secondary { | |
| background: #777; | |
| color: #fff; | |
| } | |
| .button.secondary:hover, .button.secondary:focus { | |
| background: #5f5f5f; | |
| color: #fff; | |
| } | |
| .button.success { | |
| background: #3adb76; | |
| color: #fff; | |
| } | |
| .button.success:hover, .button.success:focus { | |
| background: #22bb5b; | |
| color: #fff; | |
| } | |
| .button.alert { | |
| background: #ec5840; | |
| color: #fff; | |
| } | |
| .button.alert:hover, .button.alert:focus { | |
| background: #da3116; | |
| color: #fff; | |
| } | |
| .button.warning { | |
| background: #ffae00; | |
| color: #fff; | |
| } | |
| .button.warning:hover, .button.warning:focus { | |
| background: #cc8b00; | |
| color: #fff; | |
| } | |
| .button.hollow { | |
| border: 1px solid #2199e8; | |
| color: #2199e8; | |
| } | |
| .button.hollow, .button.hollow:hover, .button.hollow:focus { | |
| background: transparent; | |
| } | |
| .button.hollow:hover, .button.hollow:focus { | |
| border-color: #0c4d78; | |
| color: #0c4d78; | |
| } | |
| .button.hollow.primary { | |
| border: 1px solid #2199e8; | |
| color: #2199e8; | |
| } | |
| .button.hollow.primary:hover, .button.hollow.primary:focus { | |
| border-color: #0c4d78; | |
| color: #0c4d78; | |
| } | |
| .button.hollow.secondary { | |
| border: 1px solid #777; | |
| color: #777; | |
| } | |
| .button.hollow.secondary:hover, .button.hollow.secondary:focus { | |
| border-color: #3c3c3c; | |
| color: #3c3c3c; | |
| } | |
| .button.hollow.success { | |
| border: 1px solid #3adb76; | |
| color: #3adb76; | |
| } | |
| .button.hollow.success:hover, .button.hollow.success:focus { | |
| border-color: #157539; | |
| color: #157539; | |
| } | |
| .button.hollow.alert { | |
| border: 1px solid #ec5840; | |
| color: #ec5840; | |
| } | |
| .button.hollow.alert:hover, .button.hollow.alert:focus { | |
| border-color: #881f0e; | |
| color: #881f0e; | |
| } | |
| .button.hollow.warning { | |
| border: 1px solid #ffae00; | |
| color: #ffae00; | |
| } | |
| .button.hollow.warning:hover, .button.hollow.warning:focus { | |
| border-color: #805700; | |
| color: #805700; | |
| } | |
| .button.disabled { | |
| opacity: 0.25; | |
| cursor: not-allowed; | |
| pointer-events: none; | |
| } | |
| .button.dropdown::after { | |
| content:''; | |
| display: block; | |
| width: 0; | |
| height: 0; | |
| border: inset 0.4em; | |
| border-color: #fefefe transparent transparent; | |
| border-top-style: solid; | |
| position: relative; | |
| top: 0.4em; | |
| float: right; | |
| margin-left: 1em; | |
| display: inline-block; | |
| } | |
| .button.arrow-only::after { | |
| margin-left: 0; | |
| float: none; | |
| top: 0.2em; | |
| } | |
| [type="text"], [type="password"], [type="date"], [type="datetime"], [type="datetime-local"], [type="month"], [type="week"], [type="email"], [type="number"], [type="search"], [type="tel"], [type="time"], [type="url"], [type="color"], textarea { | |
| display: block; | |
| box-sizing: border-box; | |
| width: 100%; | |
| height: 2.4375rem; | |
| padding: 0.5rem; | |
| border: 1px solid #cacaca; | |
| margin: 0 0 1rem; | |
| font-family: inherit; | |
| font-size: 1rem; | |
| color: #8a8a8a; | |
| background-color: #fefefe; | |
| box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1); | |
| border-radius: 0; | |
| transition: box-shadow 0.5s, border-color 0.25s ease-in-out; | |
| -webkit-appearance: none; | |
| -moz-appearance: none; | |
| } | |
| [type="text"]:focus, [type="password"]:focus, [type="date"]:focus, [type="datetime"]:focus, [type="datetime-local"]:focus, [type="month"]:focus, [type="week"]:focus, [type="email"]:focus, [type="number"]:focus, [type="search"]:focus, [type="tel"]:focus, [type="time"]:focus, [type="url"]:focus, [type="color"]:focus, textarea:focus { | |
| border: 1px solid #8a8a8a; | |
| background: #fefefe; | |
| outline: none; | |
| box-shadow: 0 0 5px #cacaca; | |
| transition: box-shadow 0.5s, border-color 0.25s ease-in-out; | |
| } | |
| textarea { | |
| max-width: 100%; | |
| } | |
| textarea[rows] { | |
| height: auto; | |
| } | |
| input:disabled, input[readonly], textarea:disabled, textarea[readonly] { | |
| background-color: #e6e6e6; | |
| cursor: default; | |
| } | |
| [type="submit"], [type="button"] { | |
| border-radius: 0; | |
| -webkit-appearance: none; | |
| -moz-appearance: none; | |
| } | |
| input[type="search"] { | |
| box-sizing: border-box; | |
| } | |
| [type="file"], [type="checkbox"], [type="radio"] { | |
| margin: 0 0 1rem; | |
| } | |
| [type="checkbox"] + label, [type="radio"] + label { | |
| display: inline-block; | |
| margin-left: 0.5rem; | |
| margin-right: 1rem; | |
| margin-bottom: 0; | |
| vertical-align: baseline; | |
| } | |
| label >[type="checkbox"], label >[type="label"] { | |
| margin-right: 0.5rem; | |
| } | |
| [type="file"] { | |
| width: 100%; | |
| } | |
| label { | |
| display: block; | |
| margin: 0; | |
| font-size: 0.875rem; | |
| font-weight: normal; | |
| line-height: 1.8; | |
| color: #0a0a0a; | |
| } | |
| label.middle { | |
| margin: 0 0 1rem; | |
| padding: 0.5625rem 0; | |
| } | |
| .help-text { | |
| margin-top: -0.5rem; | |
| font-size: 0.8125rem; | |
| font-style: italic; | |
| color: #333; | |
| } | |
| .input-group { | |
| display: table; | |
| width: 100%; | |
| margin-bottom: 1rem; | |
| } | |
| .input-group-label, .input-group-field, .input-group-button { | |
| display: table-cell; | |
| margin: 0; | |
| vertical-align: middle; | |
| } | |
| .input-group-label { | |
| text-align: center; | |
| width: 1%; | |
| height: 100%; | |
| padding: 0 1rem; | |
| background: #e6e6e6; | |
| color: #0a0a0a; | |
| border: 1px solid #cacaca; | |
| } | |
| .input-group-label:first-child { | |
| border-right: 0; | |
| } | |
| .input-group-label:last-child { | |
| border-left: 0; | |
| } | |
| .input-group-button { | |
| height: 100%; | |
| padding-top: 0; | |
| padding-bottom: 0; | |
| text-align: center; | |
| width: 1%; | |
| } | |
| fieldset { | |
| border: 0; | |
| padding: 0; | |
| margin: 0; | |
| } | |
| legend { | |
| margin-bottom: 0.5rem; | |
| } | |
| .fieldset { | |
| border: 1px solid #cacaca; | |
| padding: 1.25rem; | |
| margin: 1.125rem 0; | |
| } | |
| .fieldset legend { | |
| background: #fefefe; | |
| padding: 0 0.1875rem; | |
| margin: 0; | |
| margin-left: -0.1875rem; | |
| } | |
| select { | |
| height: 2.4375rem; | |
| padding: 0.5rem; | |
| border: 1px solid #cacaca; | |
| border-radius: 0; | |
| margin: 0 0 1rem; | |
| font-size: 1rem; | |
| font-family: inherit; | |
| line-height: normal; | |
| color: #8a8a8a; | |
| background-color: #fafafa; | |
| border-radius: 0; | |
| -webkit-appearance: none; | |
| -moz-appearance: none; | |
| background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="32" height="24" viewBox="0 0 32 24"><polygon points="0,0 32,0 16,24" style="fill: rgb(51, 51, 51)"></polygon></svg>'); | |
| background-size: 9px 6px; | |
| background-position: right 0.5rem center; | |
| background-repeat: no-repeat; | |
| } | |
| @media screen and (min-width: 0\0) { | |
| select { | |
| background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNrEkckNgDAMBBfRkEt0ObRBBdsGXUDgmQfK4XhH2m8czQAAy27R3tsw4Qfe2x8uOO6oYLb6GlOor3GF+swURAOmUJ+RwtEJs9WvTGEYxBXqI1MQAZhCfUQKRzDMVj+TwrAIV6jvSUEkYAr1LSkcyTBb/V+KYfX7xAeusq3sLDtGH3kEGACPWIflNZfhRQAAAABJRU5ErkJggg=="); | |
| } | |
| } | |
| select:disabled { | |
| background-color: #e6e6e6; | |
| cursor: default; | |
| } | |
| select::-ms-expand { | |
| display: none; | |
| } | |
| select[multiple] { | |
| height: auto; | |
| } | |
| .is-invalid-input:not(:focus) { | |
| background-color: rgba(236, 88, 64, 0.1); | |
| border-color: #ec5840; | |
| } | |
| .is-invalid-label { | |
| color: #ec5840; | |
| } | |
| .form-error { | |
| display: none; | |
| margin-top: -0.5rem; | |
| margin-bottom: 1rem; | |
| font-size: 0.75rem; | |
| font-weight: bold; | |
| color: #ec5840; | |
| } | |
| .form-error.is-visible { | |
| display: block; | |
| } | |
| .hide { | |
| display: none !important; | |
| } | |
| .invisible { | |
| visibility: hidden; | |
| } | |
| @media screen and (min-width: 0em) and (max-width: 31.9375em) { | |
| .hide-for-small-only { | |
| display: none !important; | |
| } | |
| } | |
| @media screen and (max-width: -0.0625em), screen and (min-width: 32em) { | |
| .show-for-small-only { | |
| display: none !important; | |
| } | |
| } | |
| @media screen and (min-width: 32em) { | |
| .hide-for-medium { | |
| display: none !important; | |
| } | |
| } | |
| @media screen and (max-width: 31.9375em) { | |
| .show-for-medium { | |
| display: none !important; | |
| } | |
| } | |
| @media screen and (min-width: 32em) and (max-width: 63.9375em) { | |
| .hide-for-medium-only { | |
| display: none !important; | |
| } | |
| } | |
| @media screen and (max-width: 31.9375em), screen and (min-width: 64em) { | |
| .show-for-medium-only { | |
| display: none !important; | |
| } | |
| } | |
| @media screen and (min-width: 64em) { | |
| .hide-for-large { | |
| display: none !important; | |
| } | |
| } | |
| @media screen and (max-width: 63.9375em) { | |
| .show-for-large { | |
| display: none !important; | |
| } | |
| } | |
| @media screen and (min-width: 64em) and (max-width: 74.9375em) { | |
| .hide-for-large-only { | |
| display: none !important; | |
| } | |
| } | |
| @media screen and (max-width: 63.9375em), screen and (min-width: 75em) { | |
| .show-for-large-only { | |
| display: none !important; | |
| } | |
| } | |
| .show-for-sr, .show-on-focus { | |
| position: absolute !important; | |
| width: 1px; | |
| height: 1px; | |
| overflow: hidden; | |
| clip: rect(0, 0, 0, 0); | |
| } | |
| .show-on-focus:active, .show-on-focus:focus { | |
| position: static !important; | |
| height: auto; | |
| width: auto; | |
| overflow: visible; | |
| clip: auto; | |
| } | |
| .show-for-landscape, .hide-for-portrait { | |
| display: block !important; | |
| } | |
| @media screen and (orientation: landscape) { | |
| .show-for-landscape, .hide-for-portrait { | |
| display: block !important; | |
| } | |
| } | |
| @media screen and (orientation: portrait) { | |
| .show-for-landscape, .hide-for-portrait { | |
| display: none !important; | |
| } | |
| } | |
| .hide-for-landscape, .show-for-portrait { | |
| display: none !important; | |
| } | |
| @media screen and (orientation: landscape) { | |
| .hide-for-landscape, .show-for-portrait { | |
| display: none !important; | |
| } | |
| } | |
| @media screen and (orientation: portrait) { | |
| .hide-for-landscape, .show-for-portrait { | |
| display: block !important; | |
| } | |
| } | |
| .float-left { | |
| float: left !important; | |
| } | |
| .float-right { | |
| float: right !important; | |
| } | |
| .float-center { | |
| display: block; | |
| margin-left: auto; | |
| margin-right: auto; | |
| } | |
| .clearfix::before, .clearfix::after { | |
| content:' '; | |
| display: table; | |
| } | |
| .clearfix::after { | |
| clear: both; | |
| } | |
| .accordion { | |
| list-style-type: none; | |
| background: #fefefe; | |
| border: 1px solid #e6e6e6; | |
| border-radius: 0; | |
| margin-left: 0; | |
| } | |
| .accordion-title { | |
| display: block; | |
| padding: 1.25rem 1rem; | |
| line-height: 1; | |
| font-size: 0.75rem; | |
| color: #2199e8; | |
| position: relative; | |
| border-bottom: 1px solid #e6e6e6; | |
| } | |
| .accordion-title:hover, .accordion-title:focus { | |
| background-color: #e6e6e6; | |
| } | |
| :last-child > .accordion-title { | |
| border-bottom-width: 0; | |
| } | |
| .accordion-title::before { | |
| content:'+'; | |
| position: absolute; | |
| right: 1rem; | |
| top: 50%; | |
| margin-top: -0.5rem; | |
| } | |
| .is-active > .accordion-title::before { | |
| content:'–'; | |
| } | |
| .accordion-content { | |
| padding: 1.25rem 1rem; | |
| display: none; | |
| border-bottom: 1px solid #e6e6e6; | |
| } | |
| .badge { | |
| display: inline-block; | |
| padding: 0.3em; | |
| min-width: 2.1em; | |
| font-size: 0.6rem; | |
| text-align: center; | |
| border-radius: 50%; | |
| background: #2199e8; | |
| color: #fefefe; | |
| } | |
| .badge.secondary { | |
| background: #777; | |
| color: #fefefe; | |
| } | |
| .badge.success { | |
| background: #3adb76; | |
| color: #fefefe; | |
| } | |
| .badge.alert { | |
| background: #ec5840; | |
| color: #fefefe; | |
| } | |
| .badge.warning { | |
| background: #ffae00; | |
| color: #fefefe; | |
| } | |
| .breadcrumbs { | |
| list-style: none; | |
| margin: 0 0 1rem 0; | |
| } | |
| .breadcrumbs::before, .breadcrumbs::after { | |
| content:' '; | |
| display: table; | |
| } | |
| .breadcrumbs::after { | |
| clear: both; | |
| } | |
| .breadcrumbs li { | |
| float: left; | |
| color: #0a0a0a; | |
| font-size: 0.6875rem; | |
| cursor: default; | |
| text-transform: uppercase; | |
| } | |
| .breadcrumbs li:not(:last-child)::after { | |
| color: #cacaca; | |
| content:"/"; | |
| margin: 0 0.75rem; | |
| position: relative; | |
| top: 1px; | |
| opacity: 1; | |
| } | |
| .breadcrumbs a { | |
| color: #2199e8; | |
| } | |
| .breadcrumbs a:hover { | |
| text-decoration: underline; | |
| } | |
| .breadcrumbs .disabled { | |
| color: #cacaca; | |
| } | |
| .button-group { | |
| margin-bottom: 1rem; | |
| font-size: 0.9rem; | |
| } | |
| .button-group::before, .button-group::after { | |
| content:' '; | |
| display: table; | |
| } | |
| .button-group::after { | |
| clear: both; | |
| } | |
| .button-group .button { | |
| float: left; | |
| margin: 0; | |
| font-size: inherit; | |
| } | |
| .button-group .button:not(:last-child) { | |
| border-right: 1px solid #fefefe; | |
| } | |
| .button-group.tiny { | |
| font-size: 0.6rem; | |
| } | |
| .button-group.small { | |
| font-size: 0.75rem; | |
| } | |
| .button-group.large { | |
| font-size: 1.25rem; | |
| } | |
| .button-group.expanded .button:nth-last-child(2):first-child, .button-group.expanded .button:nth-last-child(2):first-child ~ .button { | |
| width: 50%; | |
| } | |
| .button-group.expanded .button:nth-last-child(3):first-child, .button-group.expanded .button:nth-last-child(3):first-child ~ .button { | |
| width: 33.33333%; | |
| } | |
| .button-group.expanded .button:nth-last-child(4):first-child, .button-group.expanded .button:nth-last-child(4):first-child ~ .button { | |
| width: 25%; | |
| } | |
| .button-group.expanded .button:nth-last-child(5):first-child, .button-group.expanded .button:nth-last-child(5):first-child ~ .button { | |
| width: 20%; | |
| } | |
| .button-group.expanded .button:nth-last-child(6):first-child, .button-group.expanded .button:nth-last-child(6):first-child ~ .button { | |
| width: 16.66667%; | |
| } | |
| .button-group.primary .button { | |
| background: #2199e8; | |
| color: #fff; | |
| } | |
| .button-group.primary .button:hover, .button-group.primary .button:focus { | |
| background: #147cc0; | |
| color: #fff; | |
| } | |
| .button-group.secondary .button { | |
| background: #777; | |
| color: #fff; | |
| } | |
| .button-group.secondary .button:hover, .button-group.secondary .button:focus { | |
| background: #5f5f5f; | |
| color: #fff; | |
| } | |
| .button-group.success .button { | |
| background: #3adb76; | |
| color: #fff; | |
| } | |
| .button-group.success .button:hover, .button-group.success .button:focus { | |
| background: #22bb5b; | |
| color: #fff; | |
| } | |
| .button-group.alert .button { | |
| background: #ec5840; | |
| color: #fff; | |
| } | |
| .button-group.alert .button:hover, .button-group.alert .button:focus { | |
| background: #da3116; | |
| color: #fff; | |
| } | |
| .button-group.warning .button { | |
| background: #ffae00; | |
| color: #fff; | |
| } | |
| .button-group.warning .button:hover, .button-group.warning .button:focus { | |
| background: #cc8b00; | |
| color: #fff; | |
| } | |
| .button-group.stacked .button, .button-group.stacked-for-small .button { | |
| width: 100%; | |
| border-right: 0; | |
| } | |
| @media screen and (min-width: 32em) { | |
| .button-group.stacked-for-small .button { | |
| width: auto; | |
| } | |
| .button-group.stacked-for-small .button:not(:last-child) { | |
| border-right: 1px solid #fefefe; | |
| } | |
| } | |
| .callout { | |
| margin: 0 0 1rem 0; | |
| padding: 1rem; | |
| border: 1px solid rgba(10, 10, 10, 0.25); | |
| border-radius: 0; | |
| position: relative; | |
| background-color: white; | |
| } | |
| .callout > :first-child { | |
| margin-top: 0; | |
| } | |
| .callout > :last-child { | |
| margin-bottom: 0; | |
| } | |
| .callout.primary { | |
| background-color: #def0fc; | |
| } | |
| .callout.primary a { | |
| color: #116ca8; | |
| } | |
| .callout.primary a:hover { | |
| color: #0a4063; | |
| } | |
| .callout.secondary { | |
| background-color: #ebebeb; | |
| } | |
| .callout.success { | |
| background-color: #e1faea; | |
| } | |
| .callout.success a { | |
| color: #1ea450; | |
| } | |
| .callout.success a:hover { | |
| color: #126330; | |
| } | |
| .callout.alert { | |
| background-color: #fce6e2; | |
| } | |
| .callout.alert a { | |
| color: #bf2b13; | |
| } | |
| .callout.alert a:hover { | |
| color: #791b0c; | |
| } | |
| .callout.warning { | |
| background-color: #fff3d9; | |
| } | |
| .callout.warning a { | |
| color: #b37a00; | |
| } | |
| .callout.warning a:hover { | |
| color: #664600; | |
| } | |
| .callout.small { | |
| padding-top: 0.5rem; | |
| padding-right: 0.5rem; | |
| padding-bottom: 0.5rem; | |
| padding-left: 0.5rem; | |
| } | |
| .callout.large { | |
| padding-top: 3rem; | |
| padding-right: 3rem; | |
| padding-bottom: 3rem; | |
| padding-left: 3rem; | |
| } | |
| .close-button { | |
| position: absolute; | |
| color: #8a8a8a; | |
| right: 1rem; | |
| top: 0.5rem; | |
| font-size: 2em; | |
| line-height: 1; | |
| cursor: pointer; | |
| } | |
| [data-whatinput="mouse"] .close-button { | |
| outline: 0; | |
| } | |
| .close-button:hover, .close-button:focus { | |
| color: #0a0a0a; | |
| } | |
| .is-drilldown { | |
| position: relative; | |
| overflow: hidden; | |
| } | |
| .is-drilldown-sub { | |
| position: absolute; | |
| top: 0; | |
| left: 100%; | |
| z-index: -1; | |
| height: 100%; | |
| width: 100%; | |
| background: #fefefe; | |
| transition: -webkit-transform 0.15s linear; | |
| transition: transform 0.15s linear; | |
| } | |
| .is-drilldown-sub.is-active { | |
| z-index: 1; | |
| display: block; | |
| -webkit-transform: translateX(-100%); | |
| -ms-transform: translateX(-100%); | |
| transform: translateX(-100%); | |
| } | |
| .is-drilldown-sub.is-closing { | |
| -webkit-transform: translateX(100%); | |
| -ms-transform: translateX(100%); | |
| transform: translateX(100%); | |
| } | |
| .is-drilldown-submenu-parent > a { | |
| position: relative; | |
| } | |
| .is-drilldown-submenu-parent > a::after { | |
| content:''; | |
| display: block; | |
| width: 0; | |
| height: 0; | |
| border: inset 6px; | |
| border-color: transparent transparent transparent #2199e8; | |
| border-left-style: solid; | |
| position: absolute; | |
| top: 50%; | |
| margin-top: -6px; | |
| right: 1rem; | |
| } | |
| .js-drilldown-back::before { | |
| content:''; | |
| display: block; | |
| width: 0; | |
| height: 0; | |
| border: inset 6px; | |
| border-color: transparent #2199e8 transparent transparent; | |
| border-right-style: solid; | |
| float: left; | |
| margin-right: 0.75rem; | |
| margin-left: 0.6rem; | |
| margin-top: 14px; | |
| } | |
| .dropdown-pane { | |
| background-color: #fefefe; | |
| border: 1px solid #cacaca; | |
| display: block; | |
| padding: 1rem; | |
| position: absolute; | |
| visibility: hidden; | |
| width: 300px; | |
| z-index: 10; | |
| border-radius: 0; | |
| } | |
| .dropdown-pane.is-open { | |
| visibility: visible; | |
| } | |
| .dropdown-pane.tiny { | |
| width: 100px; | |
| } | |
| .dropdown-pane.small { | |
| width: 200px; | |
| } | |
| .dropdown-pane.large { | |
| width: 400px; | |
| } | |
| .dropdown.menu .has-submenu { | |
| position: relative; | |
| } | |
| .dropdown.menu .has-submenu a::after { | |
| float: right; | |
| margin-top: 3px; | |
| margin-left: 10px; | |
| } | |
| .dropdown.menu .has-submenu.is-down-arrow > a::after { | |
| content:''; | |
| display: block; | |
| width: 0; | |
| height: 0; | |
| border: inset 5px; | |
| border-color: #2199e8 transparent transparent; | |
| border-top-style: solid; | |
| } | |
| .dropdown.menu .has-submenu.is-left-arrow > a::after { | |
| content:''; | |
| display: block; | |
| width: 0; | |
| height: 0; | |
| border: inset 5px; | |
| border-color: transparent #2199e8 transparent transparent; | |
| border-right-style: solid; | |
| float: left; | |
| margin-left: 0; | |
| margin-right: 10px; | |
| } | |
| .dropdown.menu .has-submenu.is-right-arrow > a::after { | |
| content:''; | |
| display: block; | |
| width: 0; | |
| height: 0; | |
| border: inset 5px; | |
| border-color: transparent transparent transparent #2199e8; | |
| border-left-style: solid; | |
| } | |
| .dropdown.menu .has-submenu.is-left-arrow.opens-inner .submenu { | |
| right: 0; | |
| left: auto; | |
| } | |
| .dropdown.menu .has-submenu.is-right-arrow.opens-inner .submenu { | |
| left: 0; | |
| right: auto; | |
| } | |
| .dropdown.menu .has-submenu.opens-inner .submenu { | |
| top: 100%; | |
| } | |
| .dropdown.menu .submenu { | |
| display: none; | |
| position: absolute; | |
| top: 0; | |
| left: 100%; | |
| min-width: 200px; | |
| z-index: 1; | |
| background: #fefefe; | |
| border: 1px solid #cacaca; | |
| } | |
| .dropdown.menu .submenu > li { | |
| width: 100%; | |
| } | |
| .dropdown.menu .submenu.first-sub { | |
| top: 100%; | |
| left: 0; | |
| right: auto; | |
| } | |
| .dropdown.menu .submenu:not(.js-dropdown-nohover) > .has-submenu:hover > .dropdown.menu .submenu, .dropdown.menu .submenu.js-dropdown-active { | |
| display: block; | |
| } | |
| .dropdown.menu .has-submenu.opens-left .submenu { | |
| left: auto; | |
| right: 100%; | |
| } | |
| .dropdown.menu.align-right .submenu.first-sub { | |
| top: 100%; | |
| left: auto; | |
| right: 0; | |
| } | |
| .dropdown.menu.vertical { | |
| width: 100px; | |
| } | |
| .dropdown.menu.vertical.align-right { | |
| float: right; | |
| } | |
| .dropdown.menu.vertical > li .submenu { | |
| top: 0; | |
| left: 100%; | |
| } | |
| .flex-video { | |
| position: relative; | |
| height: 0; | |
| padding-top: 1.5625rem; | |
| padding-bottom: 75%; | |
| margin-bottom: 1rem; | |
| overflow: hidden; | |
| } | |
| .flex-video iframe, .flex-video object, .flex-video embed, .flex-video video { | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| } | |
| .flex-video.widescreen { | |
| padding-bottom: 56.25%; | |
| } | |
| .flex-video.vimeo { | |
| padding-top: 0; | |
| } | |
| .label { | |
| display: inline-block; | |
| padding: 0.33333rem 0.5rem; | |
| font-size: 0.8rem; | |
| line-height: 1; | |
| white-space: nowrap; | |
| cursor: default; | |
| border-radius: 0; | |
| background: #2199e8; | |
| color: #fefefe; | |
| } | |
| .label.secondary { | |
| background: #777; | |
| color: #fefefe; | |
| } | |
| .label.success { | |
| background: #3adb76; | |
| color: #fefefe; | |
| } | |
| .label.alert { | |
| background: #ec5840; | |
| color: #fefefe; | |
| } | |
| .label.warning { | |
| background: #ffae00; | |
| color: #fefefe; | |
| } | |
| .media-object { | |
| margin-bottom: 1rem; | |
| display: block; | |
| } | |
| .media-object img { | |
| max-width: none; | |
| } | |
| @media screen and (min-width: 0em) and (max-width: 31.9375em) { | |
| .media-object.stack-for-small .media-object-section { | |
| display: block; | |
| padding: 0; | |
| padding-bottom: 1rem; | |
| } | |
| .media-object.stack-for-small .media-object-section img { | |
| width: 100%; | |
| } | |
| } | |
| .media-object-section { | |
| display: table-cell; | |
| vertical-align: top; | |
| } | |
| .media-object-section:first-child { | |
| padding-right: 1rem; | |
| } | |
| .media-object-section:last-child:not(+ &:first-child) { | |
| padding-left: 1rem; | |
| } | |
| .media-object-section.middle { | |
| vertical-align: middle; | |
| } | |
| .media-object-section.bottom { | |
| vertical-align: bottom; | |
| } | |
| .menu { | |
| margin: 0; | |
| list-style-type: none; | |
| } | |
| .menu > li { | |
| display: table-cell; | |
| vertical-align: middle; | |
| } | |
| [data-whatinput="mouse"] .menu > li { | |
| outline: 0; | |
| } | |
| .menu > li > a { | |
| display: block; | |
| padding: 0.7rem 1rem; | |
| line-height: 1; | |
| } | |
| .menu input, .menu a, .menu button { | |
| margin-bottom: 0; | |
| } | |
| .menu > li > a > img, .menu > li > a > i { | |
| vertical-align: middle; | |
| } | |
| .menu > li > a > span { | |
| vertical-align: middle; | |
| } | |
| .menu > li > a > img, .menu > li > a > i { | |
| display: inline-block; | |
| margin-right: 0.25rem; | |
| } | |
| .menu > li { | |
| display: table-cell; | |
| } | |
| .menu.vertical > li { | |
| display: block; | |
| } | |
| @media screen and (min-width: 32em) { | |
| .menu.medium-horizontal > li { | |
| display: table-cell; | |
| } | |
| .menu.medium-vertical > li { | |
| display: block; | |
| } | |
| } | |
| @media screen and (min-width: 64em) { | |
| .menu.large-horizontal > li { | |
| display: table-cell; | |
| } | |
| .menu.large-vertical > li { | |
| display: block; | |
| } | |
| } | |
| .menu.simple a { | |
| padding: 0; | |
| margin-right: 1rem; | |
| } | |
| .menu.align-right > li { | |
| float: right; | |
| } | |
| .menu.expanded { | |
| display: table; | |
| width: 100%; | |
| } | |
| .menu.expanded > li:nth-last-child(2):first-child, .menu.expanded > li:nth-last-child(2):first-child ~ li { | |
| width: 50%; | |
| } | |
| .menu.expanded > li:nth-last-child(3):first-child, .menu.expanded > li:nth-last-child(3):first-child ~ li { | |
| width: 33.33333%; | |
| } | |
| .menu.expanded > li:nth-last-child(4):first-child, .menu.expanded > li:nth-last-child(4):first-child ~ li { | |
| width: 25%; | |
| } | |
| .menu.expanded > li:nth-last-child(5):first-child, .menu.expanded > li:nth-last-child(5):first-child ~ li { | |
| width: 20%; | |
| } | |
| .menu.expanded > li:nth-last-child(6):first-child, .menu.expanded > li:nth-last-child(6):first-child ~ li { | |
| width: 16.66667%; | |
| } | |
| .menu.expanded > li:first-child:last-child { | |
| width: 100%; | |
| } | |
| .menu.icon-top > li > a { | |
| text-align: center; | |
| } | |
| .menu.icon-top > li > a > img, .menu.icon-top > li > a > i { | |
| display: block; | |
| margin: 0 auto 0.25rem; | |
| } | |
| .menu.nested { | |
| margin-left: 1rem; | |
| } | |
| .menu-text { | |
| font-weight: bold; | |
| color: inherit; | |
| line-height: 1; | |
| padding-top: 0; | |
| padding-bottom: 0; | |
| padding: 0.7rem 1rem; | |
| } | |
| html, body { | |
| height: 100%; | |
| } | |
| .off-canvas-wrapper { | |
| width: 100%; | |
| overflow-x: hidden; | |
| position: relative; | |
| -webkit-backface-visibility: hidden; | |
| backface-visibility: hidden; | |
| -webkit-overflow-scrolling: touch; | |
| } | |
| .off-canvas-wrapper-inner { | |
| position: relative; | |
| width: 100%; | |
| transition: -webkit-transform 0.5s ease; | |
| transition: transform 0.5s ease; | |
| } | |
| .off-canvas-wrapper-inner::before, .off-canvas-wrapper-inner::after { | |
| content:' '; | |
| display: table; | |
| } | |
| .off-canvas-wrapper-inner::after { | |
| clear: both; | |
| } | |
| .off-canvas-content { | |
| min-height: 100%; | |
| background: #fefefe; | |
| transition: -webkit-transform 0.5s ease; | |
| transition: transform 0.5s ease; | |
| -webkit-backface-visibility: hidden; | |
| backface-visibility: hidden; | |
| z-index: 1; | |
| box-shadow: 0 0 10px rgba(10, 10, 10, 0.5); | |
| } | |
| .js-off-canvas-exit { | |
| display: none; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| background: rgba(254, 254, 254, 0.25); | |
| cursor: pointer; | |
| transition: background 0.5s ease; | |
| } | |
| .is-off-canvas-open .js-off-canvas-exit { | |
| display: block; | |
| } | |
| .off-canvas { | |
| position: absolute; | |
| background: #e6e6e6; | |
| z-index: -1; | |
| min-height: 100%; | |
| -webkit-transform: translateX(0px); | |
| -ms-transform: translateX(0px); | |
| transform: translateX(0px); | |
| } | |
| [data-whatinput="mouse"] .off-canvas { | |
| outline: 0; | |
| } | |
| .off-canvas.position-left { | |
| left: -250px; | |
| top: 0; | |
| width: 250px; | |
| } | |
| .is-open-left { | |
| -webkit-transform: translateX(250px); | |
| -ms-transform: translateX(250px); | |
| transform: translateX(250px); | |
| } | |
| .off-canvas.position-right { | |
| right: -250px; | |
| top: 0; | |
| width: 250px; | |
| } | |
| .is-open-right { | |
| -webkit-transform: translateX(-250px); | |
| -ms-transform: translateX(-250px); | |
| transform: translateX(-250px); | |
| } | |
| @media screen and (min-width: 32em) { | |
| .position-left.reveal-for-medium { | |
| left: 0; | |
| } | |
| .position-left.reveal-for-medium ~ .off-canvas-content { | |
| margin-left: 250px; | |
| } | |
| .position-right.reveal-for-medium { | |
| right: 0; | |
| } | |
| .position-right.reveal-for-medium ~ .off-canvas-content { | |
| margin-right: 250px; | |
| } | |
| } | |
| @media screen and (min-width: 64em) { | |
| .position-left.reveal-for-large { | |
| left: 0; | |
| } | |
| .position-left.reveal-for-large ~ .off-canvas-content { | |
| margin-left: 250px; | |
| } | |
| .position-right.reveal-for-large { | |
| right: 0; | |
| } | |
| .position-right.reveal-for-large ~ .off-canvas-content { | |
| margin-right: 250px; | |
| } | |
| } | |
| .orbit { | |
| position: relative; | |
| } | |
| .orbit-container { | |
| position: relative; | |
| margin: 0; | |
| overflow: hidden; | |
| list-style: none; | |
| } | |
| .orbit-slide { | |
| width: 100%; | |
| max-height: 100%; | |
| } | |
| .orbit-figure { | |
| margin: 0; | |
| } | |
| .orbit-image { | |
| margin: 0; | |
| width: 100%; | |
| max-width: 100%; | |
| } | |
| .orbit-caption { | |
| position: absolute; | |
| bottom: 0; | |
| width: 100%; | |
| padding: 1rem; | |
| margin-bottom: 0; | |
| color: #fefefe; | |
| background-color: rgba(10, 10, 10, 0.5); | |
| } | |
| .orbit-previous, .orbit-next { | |
| position: absolute; | |
| top: 50%; | |
| -webkit-transform: translateY(-50%); | |
| -ms-transform: translateY(-50%); | |
| transform: translateY(-50%); | |
| z-index: 10; | |
| padding: 1rem; | |
| color: #fefefe; | |
| } | |
| [data-whatinput="mouse"] .orbit-previous, [data-whatinput="mouse"] .orbit-next { | |
| outline: 0; | |
| } | |
| .orbit-previous:hover, .orbit-next:hover, .orbit-previous:active, .orbit-next:active, .orbit-previous:focus, .orbit-next:focus { | |
| background-color: rgba(10, 10, 10, 0.5); | |
| } | |
| .orbit-previous { | |
| left: 0; | |
| } | |
| .orbit-next { | |
| left: auto; | |
| right: 0; | |
| } | |
| .orbit-bullets { | |
| position: relative; | |
| margin-top: 0.8rem; | |
| margin-bottom: 0.8rem; | |
| text-align: center; | |
| } | |
| [data-whatinput="mouse"] .orbit-bullets { | |
| outline: 0; | |
| } | |
| .orbit-bullets button { | |
| width: 1.2rem; | |
| height: 1.2rem; | |
| margin: 0.1rem; | |
| background-color: #cacaca; | |
| border-radius: 50%; | |
| } | |
| .orbit-bullets button:hover { | |
| background-color: #8a8a8a; | |
| } | |
| .orbit-bullets button.is-active { | |
| background-color: #8a8a8a; | |
| } | |
| .pagination { | |
| margin-left: 0; | |
| margin-bottom: 1rem; | |
| } | |
| .pagination::before, .pagination::after { | |
| content:' '; | |
| display: table; | |
| } | |
| .pagination::after { | |
| clear: both; | |
| } | |
| .pagination li { | |
| font-size: 0.875rem; | |
| margin-right: 0.0625rem; | |
| display: none; | |
| border-radius: 0; | |
| } | |
| .pagination li:last-child, .pagination li:first-child { | |
| display: inline-block; | |
| } | |
| @media screen and (min-width: 32em) { | |
| .pagination li { | |
| display: inline-block; | |
| } | |
| } | |
| .pagination a, .pagination button { | |
| color: #0a0a0a; | |
| display: block; | |
| padding: 0.1875rem 0.625rem; | |
| border-radius: 0; | |
| } | |
| .pagination a:hover, .pagination button:hover { | |
| background: #e6e6e6; | |
| } | |
| .pagination[aria-label="previous"]::before { | |
| content:'«'; | |
| display: inline-block; | |
| margin-right: 0.75rem; | |
| } | |
| .pagination[aria-label="next"]::after { | |
| content:'»'; | |
| display: inline-block; | |
| margin-left: 0.75rem; | |
| } | |
| .pagination .current { | |
| padding: 0.1875rem 0.625rem; | |
| background: #2199e8; | |
| color: #fefefe; | |
| cursor: default; | |
| } | |
| .pagination .disabled { | |
| padding: 0.1875rem 0.625rem; | |
| color: #cacaca; | |
| cursor: default; | |
| } | |
| .pagination .disabled:hover { | |
| background: transparent; | |
| } | |
| .pagination .ellipsis::after { | |
| content:'…'; | |
| padding: 0.1875rem 0.625rem; | |
| color: #0a0a0a; | |
| } | |
| .progress { | |
| background-color: #cacaca; | |
| height: 1rem; | |
| margin-bottom: 1rem; | |
| border-radius: 0; | |
| } | |
| .progress.primary .progress-meter { | |
| background-color: #2199e8; | |
| } | |
| .progress.secondary .progress-meter { | |
| background-color: #777; | |
| } | |
| .progress.success .progress-meter { | |
| background-color: #3adb76; | |
| } | |
| .progress.alert .progress-meter { | |
| background-color: #ec5840; | |
| } | |
| .progress.warning .progress-meter { | |
| background-color: #ffae00; | |
| } | |
| .progress-meter { | |
| position: relative; | |
| display: block; | |
| width: 0%; | |
| height: 100%; | |
| background-color: #2199e8; | |
| border-radius: 0; | |
| } | |
| .progress-meter .progress-meter-text { | |
| position: absolute; | |
| top: 50%; | |
| left: 50%; | |
| -webkit-transform: translate(-50%, -50%); | |
| -ms-transform: translate(-50%, -50%); | |
| transform: translate(-50%, -50%); | |
| margin: 0; | |
| font-size: 0.75rem; | |
| font-weight: bold; | |
| color: #fefefe; | |
| white-space: nowrap; | |
| } | |
| .slider { | |
| position: relative; | |
| height: 0.5rem; | |
| margin-top: 1.25rem; | |
| margin-bottom: 2.25rem; | |
| background-color: #e6e6e6; | |
| cursor: pointer; | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; | |
| } | |
| .slider-fill { | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| display: inline-block; | |
| max-width: 100%; | |
| height: 0.5rem; | |
| background-color: #cacaca; | |
| transition: all 0.2s ease-in-out; | |
| } | |
| .slider-fill.is-dragging { | |
| transition: all 0s linear; | |
| } | |
| .slider-handle { | |
| position: absolute; | |
| top: 50%; | |
| -webkit-transform: translateY(-50%); | |
| -ms-transform: translateY(-50%); | |
| transform: translateY(-50%); | |
| position: absolute; | |
| left: 0; | |
| z-index: 1; | |
| display: inline-block; | |
| width: 1.4rem; | |
| height: 1.4rem; | |
| background-color: #2199e8; | |
| transition: all 0.2s ease-in-out; | |
| -ms-touch-action: manipulation; | |
| touch-action: manipulation; | |
| border-radius: 0; | |
| } | |
| [data-whatinput="mouse"] .slider-handle { | |
| outline: 0; | |
| } | |
| .slider-handle:hover { | |
| background-color: #1583cc; | |
| } | |
| .slider-handle.is-dragging { | |
| transition: all 0s linear; | |
| } | |
| .slider.disabled, .slider[disabled] { | |
| opacity: 0.25; | |
| cursor: not-allowed; | |
| } | |
| .slider.vertical { | |
| display: inline-block; | |
| width: 0.5rem; | |
| height: 12.5rem; | |
| margin: 0 1.25rem; | |
| -webkit-transform: scale(1, -1); | |
| -ms-transform: scale(1, -1); | |
| transform: scale(1, -1); | |
| } | |
| .slider.vertical .slider-fill { | |
| top: 0; | |
| width: 0.5rem; | |
| max-height: 100%; | |
| } | |
| .slider.vertical .slider-handle { | |
| position: absolute; | |
| top: 0; | |
| left: 50%; | |
| width: 1.4rem; | |
| height: 1.4rem; | |
| -webkit-transform: translateX(-50%); | |
| -ms-transform: translateX(-50%); | |
| transform: translateX(-50%); | |
| } | |
| .sticky-container { | |
| position: relative; | |
| } | |
| .sticky { | |
| position: absolute; | |
| z-index: 0; | |
| -webkit-transform: translate3d(0, 0, 0); | |
| transform: translate3d(0, 0, 0); | |
| } | |
| .sticky.is-stuck { | |
| position: fixed; | |
| z-index: 5; | |
| } | |
| .sticky.is-stuck.is-at-top { | |
| top: 0; | |
| } | |
| .sticky.is-stuck.is-at-bottom { | |
| bottom: 0; | |
| } | |
| .sticky.is-anchored { | |
| position: absolute; | |
| left: auto; | |
| right: auto; | |
| } | |
| .sticky.is-anchored.is-at-bottom { | |
| bottom: 0; | |
| } | |
| .reveal-overlay { | |
| display: none; | |
| position: fixed; | |
| top: 0; | |
| bottom: 0; | |
| left: 0; | |
| right: 0; | |
| z-index: 1005; | |
| background-color: rgba(10, 10, 10, 0.45); | |
| overflow-y: scroll; | |
| } | |
| .reveal { | |
| display: none; | |
| z-index: 1006; | |
| padding: 1rem; | |
| border: 1px solid #cacaca; | |
| margin: 100px auto 0 auto; | |
| background-color: #fefefe; | |
| border-radius: 0; | |
| position: absolute; | |
| overflow-y: auto; | |
| } | |
| [data-whatinput="mouse"] .reveal { | |
| outline: 0; | |
| } | |
| @media screen and (min-width: 32em) { | |
| .reveal { | |
| min-height: 0; | |
| } | |
| } | |
| .reveal .column, .reveal .columns { | |
| min-width: 0; | |
| } | |
| .reveal > :last-child { | |
| margin-bottom: 0; | |
| } | |
| @media screen and (min-width: 32em) { | |
| .reveal { | |
| width: 600px; | |
| max-width: 75rem; | |
| } | |
| } | |
| .reveal.collapse { | |
| padding: 0; | |
| } | |
| @media screen and (min-width: 32em) { | |
| .reveal .reveal { | |
| left: auto; | |
| right: auto; | |
| margin: 0 auto; | |
| } | |
| } | |
| @media screen and (min-width: 32em) { | |
| .reveal.tiny { | |
| width: 30%; | |
| max-width: 75rem; | |
| } | |
| } | |
| @media screen and (min-width: 32em) { | |
| .reveal.small { | |
| width: 50%; | |
| max-width: 75rem; | |
| } | |
| } | |
| @media screen and (min-width: 32em) { | |
| .reveal.large { | |
| width: 90%; | |
| max-width: 75rem; | |
| } | |
| } | |
| .reveal.full { | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| height: 100vh; | |
| min-height: 100vh; | |
| max-width: none; | |
| margin-left: 0; | |
| } | |
| .switch { | |
| margin-bottom: 1rem; | |
| outline: 0; | |
| position: relative; | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; | |
| color: #fefefe; | |
| font-weight: bold; | |
| font-size: 0.875rem; | |
| } | |
| .switch-input { | |
| opacity: 0; | |
| position: absolute; | |
| } | |
| .switch-paddle { | |
| background: #cacaca; | |
| cursor: pointer; | |
| display: block; | |
| position: relative; | |
| width: 4rem; | |
| height: 2rem; | |
| transition: all 0.25s ease-out; | |
| border-radius: 0; | |
| color: inherit; | |
| font-weight: inherit; | |
| } | |
| input + .switch-paddle { | |
| margin: 0; | |
| } | |
| .switch-paddle::after { | |
| background: #fefefe; | |
| content:''; | |
| display: block; | |
| position: absolute; | |
| height: 1.5rem; | |
| left: 0.25rem; | |
| top: 0.25rem; | |
| width: 1.5rem; | |
| transition: all 0.25s ease-out; | |
| -webkit-transform: translate3d(0, 0, 0); | |
| transform: translate3d(0, 0, 0); | |
| } | |
| input:checked ~ .switch-paddle { | |
| background: #2199e8; | |
| } | |
| input:checked ~ .switch-paddle::after { | |
| left: 2.25rem; | |
| } | |
| [data-whatinput="mouse"] input:focus ~ .switch-paddle { | |
| outline: 0; | |
| } | |
| .switch-active, .switch-inactive { | |
| position: absolute; | |
| top: 50%; | |
| -webkit-transform: translateY(-50%); | |
| -ms-transform: translateY(-50%); | |
| transform: translateY(-50%); | |
| } | |
| .switch-active { | |
| left: 8%; | |
| display: none; | |
| } | |
| input:checked + label > .switch-active { | |
| display: block; | |
| } | |
| .switch-inactive { | |
| right: 15%; | |
| } | |
| input:checked + label > .switch-inactive { | |
| display: none; | |
| } | |
| .switch.tiny .switch-paddle { | |
| width: 3rem; | |
| height: 1.5rem; | |
| font-size: 0.625rem; | |
| } | |
| .switch.tiny .switch-paddle::after { | |
| width: 1rem; | |
| height: 1rem; | |
| } | |
| .switch.tiny input:checked ~ .switch-paddle:after { | |
| left: 1.75rem; | |
| } | |
| .switch.small .switch-paddle { | |
| width: 3.5rem; | |
| height: 1.75rem; | |
| font-size: 0.75rem; | |
| } | |
| .switch.small .switch-paddle::after { | |
| width: 1.25rem; | |
| height: 1.25rem; | |
| } | |
| .switch.small input:checked ~ .switch-paddle:after { | |
| left: 2rem; | |
| } | |
| .switch.large .switch-paddle { | |
| width: 5rem; | |
| height: 2.5rem; | |
| font-size: 1rem; | |
| } | |
| .switch.large .switch-paddle::after { | |
| width: 2rem; | |
| height: 2rem; | |
| } | |
| .switch.large input:checked ~ .switch-paddle:after { | |
| left: 2.75rem; | |
| } | |
| table { | |
| margin-bottom: 1rem; | |
| border-radius: 0; | |
| } | |
| thead, tbody, tfoot { | |
| border: 1px solid #f1f1f1; | |
| background-color: #fefefe; | |
| } | |
| caption { | |
| font-weight: bold; | |
| padding: 0.5rem 0.625rem 0.625rem; | |
| } | |
| thead, tfoot { | |
| background: #f8f8f8; | |
| color: #0a0a0a; | |
| } | |
| thead tr, tfoot tr { | |
| background: transparent; | |
| } | |
| thead th, thead td, tfoot th, tfoot td { | |
| padding: 0.5rem 0.625rem 0.625rem; | |
| font-weight: bold; | |
| text-align: left; | |
| } | |
| tbody tr:nth-child(even) { | |
| background-color: #f1f1f1; | |
| } | |
| tbody th, tbody td { | |
| padding: 0.5rem 0.625rem 0.625rem; | |
| } | |
| @media screen and (max-width: 63.9375em) { | |
| table.stack thead { | |
| display: none; | |
| } | |
| table.stack tfoot { | |
| display: none; | |
| } | |
| table.stack tr, table.stack th, table.stack td { | |
| display: block; | |
| } | |
| table.stack td { | |
| border-top: 0; | |
| } | |
| } | |
| table.scroll { | |
| display: block; | |
| width: 100%; | |
| overflow-y: scroll; | |
| } | |
| table.hover tr:hover { | |
| background-color: #f9f9f9; | |
| } | |
| table.hover tr:nth-of-type(even):hover { | |
| background-color: #ececec; | |
| } | |
| .tabs { | |
| margin: 0; | |
| list-style-type: none; | |
| background: #fefefe; | |
| border: 1px solid #e6e6e6; | |
| } | |
| .tabs::before, .tabs::after { | |
| content:' '; | |
| display: table; | |
| } | |
| .tabs::after { | |
| clear: both; | |
| } | |
| .tabs.simple > li > a { | |
| padding: 0; | |
| } | |
| .tabs.simple > li > a:hover { | |
| background: transparent; | |
| } | |
| .tabs.vertical > li { | |
| width: auto; | |
| float: none; | |
| display: block; | |
| } | |
| .tabs.primary { | |
| background: #2199e8; | |
| } | |
| .tabs.primary > li > a { | |
| color: #fefefe; | |
| } | |
| .tabs.primary > li > a:hover, .tabs.primary > li > a:focus { | |
| background: #1893e4; | |
| } | |
| .tabs-title { | |
| float: left; | |
| } | |
| .tabs-title > a { | |
| display: block; | |
| padding: 1.25rem 1.5rem; | |
| line-height: 1; | |
| font-size: 12px; | |
| color: #2199e8; | |
| } | |
| .tabs-title > a:hover, .tabs-title > a:focus, .tabs-title > a[aria-selected="true"] { | |
| background: #e6e6e6; | |
| } | |
| .tabs-content { | |
| background: #fefefe; | |
| transition: all 0.5s ease; | |
| border: 1px solid #e6e6e6; | |
| border-top: 0; | |
| } | |
| .tabs-content.vertical { | |
| border: 1px solid #e6e6e6; | |
| border-left: 0; | |
| } | |
| .tabs-panel { | |
| display: none; | |
| padding: 1rem; | |
| } | |
| .tabs-panel.is-active { | |
| display: block; | |
| } | |
| .thumbnail { | |
| border: solid 4px #fefefe; | |
| box-shadow: 0 0 0 1px rgba(10, 10, 10, 0.2); | |
| display: inline-block; | |
| line-height: 0; | |
| max-width: 100%; | |
| transition: box-shadow 200ms ease-out; | |
| border-radius: 0; | |
| margin-bottom: 1rem; | |
| } | |
| .thumbnail:hover, .thumbnail:focus { | |
| box-shadow: 0 0 6px 1px rgba(33, 153, 232, 0.5); | |
| } | |
| .title-bar { | |
| background: #0a0a0a; | |
| color: #fefefe; | |
| padding: 0.5rem; | |
| } | |
| .title-bar::before, .title-bar::after { | |
| content:' '; | |
| display: table; | |
| } | |
| .title-bar::after { | |
| clear: both; | |
| } | |
| .title-bar .menu-icon { | |
| margin-left: 0.25rem; | |
| margin-right: 0.5rem; | |
| } | |
| .title-bar-left { | |
| float: left; | |
| } | |
| .title-bar-right { | |
| float: right; | |
| text-align: right; | |
| } | |
| .title-bar-title { | |
| font-weight: bold; | |
| vertical-align: middle; | |
| display: inline-block; | |
| } | |
| .menu-icon { | |
| position: relative; | |
| display: inline-block; | |
| vertical-align: middle; | |
| cursor: pointer; | |
| width: 20px; | |
| height: 16px; | |
| } | |
| .menu-icon::after { | |
| content:''; | |
| position: absolute; | |
| display: block; | |
| width: 100%; | |
| height: 2px; | |
| background: white; | |
| top: 0; | |
| left: 0; | |
| box-shadow: 0 7px 0 white, 0 14px 0 white; | |
| } | |
| .menu-icon:hover::after { | |
| background: #cacaca; | |
| box-shadow: 0 7px 0 #cacaca, 0 14px 0 #cacaca; | |
| } | |
| .menu-icon.dark { | |
| position: relative; | |
| display: inline-block; | |
| vertical-align: middle; | |
| cursor: pointer; | |
| width: 20px; | |
| height: 16px; | |
| } | |
| .menu-icon.dark::after { | |
| content:''; | |
| position: absolute; | |
| display: block; | |
| width: 100%; | |
| height: 2px; | |
| background: black; | |
| top: 0; | |
| left: 0; | |
| box-shadow: 0 7px 0 black, 0 14px 0 black; | |
| } | |
| .menu-icon.dark:hover::after { | |
| background: #666; | |
| box-shadow: 0 7px 0 #666, 0 14px 0 #666; | |
| } | |
| .has-tip { | |
| border-bottom: dotted 1px #8a8a8a; | |
| font-weight: bold; | |
| position: relative; | |
| display: inline-block; | |
| } | |
| .has-tip:hover { | |
| cursor: help; | |
| } | |
| .tooltip { | |
| background-color: #0a0a0a; | |
| color: #fefefe; | |
| font-size: 80%; | |
| padding: 0.75rem; | |
| position: absolute; | |
| z-index: 10; | |
| top: calc(100% + 0.6495rem); | |
| max-width: 10rem !important; | |
| border-radius: 0; | |
| } | |
| .tooltip::before { | |
| content:''; | |
| display: block; | |
| width: 0; | |
| height: 0; | |
| border: inset 0.75rem; | |
| border-color: transparent transparent #0a0a0a; | |
| border-bottom-style: solid; | |
| bottom: 100%; | |
| position: absolute; | |
| left: 50%; | |
| -webkit-transform: translateX(-50%); | |
| -ms-transform: translateX(-50%); | |
| transform: translateX(-50%); | |
| } | |
| .tooltip.top::before { | |
| content:''; | |
| display: block; | |
| width: 0; | |
| height: 0; | |
| border: inset 0.75rem; | |
| border-color: #0a0a0a transparent transparent; | |
| border-top-style: solid; | |
| top: 100%; | |
| bottom: auto; | |
| } | |
| .tooltip.left::before { | |
| content:''; | |
| display: block; | |
| width: 0; | |
| height: 0; | |
| border: inset 0.75rem; | |
| border-color: transparent transparent transparent #0a0a0a; | |
| border-left-style: solid; | |
| bottom: auto; | |
| left: 100%; | |
| top: 50%; | |
| -webkit-transform: translateY(-50%); | |
| -ms-transform: translateY(-50%); | |
| transform: translateY(-50%); | |
| } | |
| .tooltip.right::before { | |
| content:''; | |
| display: block; | |
| width: 0; | |
| height: 0; | |
| border: inset 0.75rem; | |
| border-color: transparent #0a0a0a transparent transparent; | |
| border-right-style: solid; | |
| bottom: auto; | |
| left: auto; | |
| right: 100%; | |
| top: 50%; | |
| -webkit-transform: translateY(-50%); | |
| -ms-transform: translateY(-50%); | |
| transform: translateY(-50%); | |
| } | |
| .top-bar { | |
| padding: 0.5rem; | |
| } | |
| .top-bar::before, .top-bar::after { | |
| content:' '; | |
| display: table; | |
| } | |
| .top-bar::after { | |
| clear: both; | |
| } | |
| .top-bar, .top-bar ul { | |
| background-color: #eee; | |
| } | |
| .top-bar input { | |
| width: 200px; | |
| margin-right: 1rem; | |
| } | |
| @media screen and (min-width: 32em) { | |
| .top-bar-left { | |
| float: left; | |
| } | |
| .top-bar-right { | |
| float: right; | |
| } | |
| } | |
| .slide-in-down.mui-enter { | |
| -webkit-transform: translateY(-100%); | |
| -ms-transform: translateY(-100%); | |
| transform: translateY(-100%); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| -webkit-backface-visibility: hidden; | |
| backface-visibility: hidden; | |
| } | |
| .slide-in-down.mui-enter.mui-enter-active { | |
| -webkit-transform: translateY(0); | |
| -ms-transform: translateY(0); | |
| transform: translateY(0); | |
| } | |
| .slide-in-left.mui-enter { | |
| -webkit-transform: translateX(-100%); | |
| -ms-transform: translateX(-100%); | |
| transform: translateX(-100%); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| -webkit-backface-visibility: hidden; | |
| backface-visibility: hidden; | |
| } | |
| .slide-in-left.mui-enter.mui-enter-active { | |
| -webkit-transform: translateX(0); | |
| -ms-transform: translateX(0); | |
| transform: translateX(0); | |
| } | |
| .slide-in-up.mui-enter { | |
| -webkit-transform: translateY(100%); | |
| -ms-transform: translateY(100%); | |
| transform: translateY(100%); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| -webkit-backface-visibility: hidden; | |
| backface-visibility: hidden; | |
| } | |
| .slide-in-up.mui-enter.mui-enter-active { | |
| -webkit-transform: translateY(0); | |
| -ms-transform: translateY(0); | |
| transform: translateY(0); | |
| } | |
| .slide-in-right.mui-enter { | |
| -webkit-transform: translateX(100%); | |
| -ms-transform: translateX(100%); | |
| transform: translateX(100%); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| -webkit-backface-visibility: hidden; | |
| backface-visibility: hidden; | |
| } | |
| .slide-in-right.mui-enter.mui-enter-active { | |
| -webkit-transform: translateX(0); | |
| -ms-transform: translateX(0); | |
| transform: translateX(0); | |
| } | |
| .slide-out-down.mui-leave { | |
| -webkit-transform: translateY(0); | |
| -ms-transform: translateY(0); | |
| transform: translateY(0); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| -webkit-backface-visibility: hidden; | |
| backface-visibility: hidden; | |
| } | |
| .slide-out-down.mui-leave.mui-leave-active { | |
| -webkit-transform: translateY(-100%); | |
| -ms-transform: translateY(-100%); | |
| transform: translateY(-100%); | |
| } | |
| .slide-out-right.mui-leave { | |
| -webkit-transform: translateX(0); | |
| -ms-transform: translateX(0); | |
| transform: translateX(0); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| -webkit-backface-visibility: hidden; | |
| backface-visibility: hidden; | |
| } | |
| .slide-out-right.mui-leave.mui-leave-active { | |
| -webkit-transform: translateX(100%); | |
| -ms-transform: translateX(100%); | |
| transform: translateX(100%); | |
| } | |
| .slide-out-up.mui-leave { | |
| -webkit-transform: translateY(0); | |
| -ms-transform: translateY(0); | |
| transform: translateY(0); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| -webkit-backface-visibility: hidden; | |
| backface-visibility: hidden; | |
| } | |
| .slide-out-up.mui-leave.mui-leave-active { | |
| -webkit-transform: translateY(-100%); | |
| -ms-transform: translateY(-100%); | |
| transform: translateY(-100%); | |
| } | |
| .slide-out-left.mui-leave { | |
| -webkit-transform: translateX(0); | |
| -ms-transform: translateX(0); | |
| transform: translateX(0); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| -webkit-backface-visibility: hidden; | |
| backface-visibility: hidden; | |
| } | |
| .slide-out-left.mui-leave.mui-leave-active { | |
| -webkit-transform: translateX(-100%); | |
| -ms-transform: translateX(-100%); | |
| transform: translateX(-100%); | |
| } | |
| .fade-in.mui-enter { | |
| opacity: 0; | |
| transition-property: opacity; | |
| } | |
| .fade-in.mui-enter.mui-enter-active { | |
| opacity: 1; | |
| } | |
| .fade-out.mui-leave { | |
| opacity: 1; | |
| transition-property: opacity; | |
| } | |
| .fade-out.mui-leave.mui-leave-active { | |
| opacity: 0; | |
| } | |
| .hinge-in-from-top.mui-enter { | |
| -webkit-transform: perspective(2000px) rotateX(-90deg); | |
| transform: perspective(2000px) rotateX(-90deg); | |
| -webkit-transform-origin: top; | |
| -ms-transform-origin: top; | |
| transform-origin: top; | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 0; | |
| } | |
| .hinge-in-from-top.mui-enter.mui-enter-active { | |
| -webkit-transform: perspective(2000px) rotate(0deg); | |
| transform: perspective(2000px) rotate(0deg); | |
| opacity: 1; | |
| } | |
| .hinge-in-from-right.mui-enter { | |
| -webkit-transform: perspective(2000px) rotateY(-90deg); | |
| transform: perspective(2000px) rotateY(-90deg); | |
| -webkit-transform-origin: right; | |
| -ms-transform-origin: right; | |
| transform-origin: right; | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 0; | |
| } | |
| .hinge-in-from-right.mui-enter.mui-enter-active { | |
| -webkit-transform: perspective(2000px) rotate(0deg); | |
| transform: perspective(2000px) rotate(0deg); | |
| opacity: 1; | |
| } | |
| .hinge-in-from-bottom.mui-enter { | |
| -webkit-transform: perspective(2000px) rotateX(90deg); | |
| transform: perspective(2000px) rotateX(90deg); | |
| -webkit-transform-origin: bottom; | |
| -ms-transform-origin: bottom; | |
| transform-origin: bottom; | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 0; | |
| } | |
| .hinge-in-from-bottom.mui-enter.mui-enter-active { | |
| -webkit-transform: perspective(2000px) rotate(0deg); | |
| transform: perspective(2000px) rotate(0deg); | |
| opacity: 1; | |
| } | |
| .hinge-in-from-left.mui-enter { | |
| -webkit-transform: perspective(2000px) rotateY(90deg); | |
| transform: perspective(2000px) rotateY(90deg); | |
| -webkit-transform-origin: left; | |
| -ms-transform-origin: left; | |
| transform-origin: left; | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 0; | |
| } | |
| .hinge-in-from-left.mui-enter.mui-enter-active { | |
| -webkit-transform: perspective(2000px) rotate(0deg); | |
| transform: perspective(2000px) rotate(0deg); | |
| opacity: 1; | |
| } | |
| .hinge-in-from-middle-x.mui-enter { | |
| -webkit-transform: perspective(2000px) rotateX(-90deg); | |
| transform: perspective(2000px) rotateX(-90deg); | |
| -webkit-transform-origin: center; | |
| -ms-transform-origin: center; | |
| transform-origin: center; | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 0; | |
| } | |
| .hinge-in-from-middle-x.mui-enter.mui-enter-active { | |
| -webkit-transform: perspective(2000px) rotate(0deg); | |
| transform: perspective(2000px) rotate(0deg); | |
| opacity: 1; | |
| } | |
| .hinge-in-from-middle-y.mui-enter { | |
| -webkit-transform: perspective(2000px) rotateY(-90deg); | |
| transform: perspective(2000px) rotateY(-90deg); | |
| -webkit-transform-origin: center; | |
| -ms-transform-origin: center; | |
| transform-origin: center; | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 0; | |
| } | |
| .hinge-in-from-middle-y.mui-enter.mui-enter-active { | |
| -webkit-transform: perspective(2000px) rotate(0deg); | |
| transform: perspective(2000px) rotate(0deg); | |
| opacity: 1; | |
| } | |
| .hinge-out-from-top.mui-leave { | |
| -webkit-transform: perspective(2000px) rotate(0deg); | |
| transform: perspective(2000px) rotate(0deg); | |
| -webkit-transform-origin: top; | |
| -ms-transform-origin: top; | |
| transform-origin: top; | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 1; | |
| } | |
| .hinge-out-from-top.mui-leave.mui-leave-active { | |
| -webkit-transform: perspective(2000px) rotateX(-90deg); | |
| transform: perspective(2000px) rotateX(-90deg); | |
| opacity: 0; | |
| } | |
| .hinge-out-from-right.mui-leave { | |
| -webkit-transform: perspective(2000px) rotate(0deg); | |
| transform: perspective(2000px) rotate(0deg); | |
| -webkit-transform-origin: right; | |
| -ms-transform-origin: right; | |
| transform-origin: right; | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 1; | |
| } | |
| .hinge-out-from-right.mui-leave.mui-leave-active { | |
| -webkit-transform: perspective(2000px) rotateY(-90deg); | |
| transform: perspective(2000px) rotateY(-90deg); | |
| opacity: 0; | |
| } | |
| .hinge-out-from-bottom.mui-leave { | |
| -webkit-transform: perspective(2000px) rotate(0deg); | |
| transform: perspective(2000px) rotate(0deg); | |
| -webkit-transform-origin: bottom; | |
| -ms-transform-origin: bottom; | |
| transform-origin: bottom; | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 1; | |
| } | |
| .hinge-out-from-bottom.mui-leave.mui-leave-active { | |
| -webkit-transform: perspective(2000px) rotateX(90deg); | |
| transform: perspective(2000px) rotateX(90deg); | |
| opacity: 0; | |
| } | |
| .hinge-out-from-left.mui-leave { | |
| -webkit-transform: perspective(2000px) rotate(0deg); | |
| transform: perspective(2000px) rotate(0deg); | |
| -webkit-transform-origin: left; | |
| -ms-transform-origin: left; | |
| transform-origin: left; | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 1; | |
| } | |
| .hinge-out-from-left.mui-leave.mui-leave-active { | |
| -webkit-transform: perspective(2000px) rotateY(90deg); | |
| transform: perspective(2000px) rotateY(90deg); | |
| opacity: 0; | |
| } | |
| .hinge-out-from-middle-x.mui-leave { | |
| -webkit-transform: perspective(2000px) rotate(0deg); | |
| transform: perspective(2000px) rotate(0deg); | |
| -webkit-transform-origin: center; | |
| -ms-transform-origin: center; | |
| transform-origin: center; | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 1; | |
| } | |
| .hinge-out-from-middle-x.mui-leave.mui-leave-active { | |
| -webkit-transform: perspective(2000px) rotateX(-90deg); | |
| transform: perspective(2000px) rotateX(-90deg); | |
| opacity: 0; | |
| } | |
| .hinge-out-from-middle-y.mui-leave { | |
| -webkit-transform: perspective(2000px) rotate(0deg); | |
| transform: perspective(2000px) rotate(0deg); | |
| -webkit-transform-origin: center; | |
| -ms-transform-origin: center; | |
| transform-origin: center; | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 1; | |
| } | |
| .hinge-out-from-middle-y.mui-leave.mui-leave-active { | |
| -webkit-transform: perspective(2000px) rotateY(-90deg); | |
| transform: perspective(2000px) rotateY(-90deg); | |
| opacity: 0; | |
| } | |
| .scale-in-up.mui-enter { | |
| -webkit-transform: scale(0.5); | |
| -ms-transform: scale(0.5); | |
| transform: scale(0.5); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 0; | |
| } | |
| .scale-in-up.mui-enter.mui-enter-active { | |
| -webkit-transform: scale(1); | |
| -ms-transform: scale(1); | |
| transform: scale(1); | |
| opacity: 1; | |
| } | |
| .scale-in-down.mui-enter { | |
| -webkit-transform: scale(1.5); | |
| -ms-transform: scale(1.5); | |
| transform: scale(1.5); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 0; | |
| } | |
| .scale-in-down.mui-enter.mui-enter-active { | |
| -webkit-transform: scale(1); | |
| -ms-transform: scale(1); | |
| transform: scale(1); | |
| opacity: 1; | |
| } | |
| .scale-out-up.mui-leave { | |
| -webkit-transform: scale(1); | |
| -ms-transform: scale(1); | |
| transform: scale(1); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 1; | |
| } | |
| .scale-out-up.mui-leave.mui-leave-active { | |
| -webkit-transform: scale(1.5); | |
| -ms-transform: scale(1.5); | |
| transform: scale(1.5); | |
| opacity: 0; | |
| } | |
| .scale-out-down.mui-leave { | |
| -webkit-transform: scale(1); | |
| -ms-transform: scale(1); | |
| transform: scale(1); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 1; | |
| } | |
| .scale-out-down.mui-leave.mui-leave-active { | |
| -webkit-transform: scale(0.5); | |
| -ms-transform: scale(0.5); | |
| transform: scale(0.5); | |
| opacity: 0; | |
| } | |
| .spin-in.mui-enter { | |
| -webkit-transform: rotate(-0.75turn); | |
| -ms-transform: rotate(-0.75turn); | |
| transform: rotate(-0.75turn); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 0; | |
| } | |
| .spin-in.mui-enter.mui-enter-active { | |
| -webkit-transform: rotate(0); | |
| -ms-transform: rotate(0); | |
| transform: rotate(0); | |
| opacity: 1; | |
| } | |
| .spin-out.mui-leave { | |
| -webkit-transform: rotate(0); | |
| -ms-transform: rotate(0); | |
| transform: rotate(0); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 1; | |
| } | |
| .spin-out.mui-leave.mui-leave-active { | |
| -webkit-transform: rotate(0.75turn); | |
| -ms-transform: rotate(0.75turn); | |
| transform: rotate(0.75turn); | |
| opacity: 0; | |
| } | |
| .spin-in-ccw.mui-enter { | |
| -webkit-transform: rotate(0.75turn); | |
| -ms-transform: rotate(0.75turn); | |
| transform: rotate(0.75turn); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 0; | |
| } | |
| .spin-in-ccw.mui-enter.mui-enter-active { | |
| -webkit-transform: rotate(0); | |
| -ms-transform: rotate(0); | |
| transform: rotate(0); | |
| opacity: 1; | |
| } | |
| .spin-out-ccw.mui-leave { | |
| -webkit-transform: rotate(0); | |
| -ms-transform: rotate(0); | |
| transform: rotate(0); | |
| transition-property: -webkit-transform, opacity; | |
| transition-property: transform, opacity; | |
| opacity: 1; | |
| } | |
| .spin-out-ccw.mui-leave.mui-leave-active { | |
| -webkit-transform: rotate(-0.75turn); | |
| -ms-transform: rotate(-0.75turn); | |
| transform: rotate(-0.75turn); | |
| opacity: 0; | |
| } | |
| .slow { | |
| transition-duration: 750ms !important; | |
| } | |
| .fast { | |
| transition-duration: 250ms !important; | |
| } | |
| .linear { | |
| transition-timing-function: linear !important; | |
| } | |
| .ease { | |
| transition-timing-function: ease !important; | |
| } | |
| .ease-in { | |
| transition-timing-function: ease-in !important; | |
| } | |
| .ease-out { | |
| transition-timing-function: ease-out !important; | |
| } | |
| .ease-in-out { | |
| transition-timing-function: ease-in-out !important; | |
| } | |
| .bounce-in { | |
| transition-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important; | |
| } | |
| .bounce-out { | |
| transition-timing-function: cubic-bezier(0.485, 0.155, 0.515, 0.845) !important; | |
| } | |
| .bounce-in-out { | |
| transition-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important; | |
| } | |
| .short-delay { | |
| transition-delay: 300ms !important; | |
| } | |
| .long-delay { | |
| transition-delay: 700ms !important; | |
| } | |
| .shake { | |
| -webkit-animation-name: shake-7; | |
| animation-name: shake-7; | |
| } | |
| @-webkit-keyframes shake-7 { | |
| 0%, 10%, 20%, 30%, 40%, 50%, 60%, 70%, 80%, 90% { | |
| -webkit-transform: translateX(7%); | |
| transform: translateX(7%); | |
| } | |
| 5%, 15%, 25%, 35%, 45%, 55%, 65%, 75%, 85%, 95% { | |
| -webkit-transform: translateX(-7%); | |
| transform: translateX(-7%); | |
| } | |
| } | |
| @keyframes shake-7 { | |
| 0%, 10%, 20%, 30%, 40%, 50%, 60%, 70%, 80%, 90% { | |
| -webkit-transform: translateX(7%); | |
| transform: translateX(7%); | |
| } | |
| 5%, 15%, 25%, 35%, 45%, 55%, 65%, 75%, 85%, 95% { | |
| -webkit-transform: translateX(-7%); | |
| transform: translateX(-7%); | |
| } | |
| } | |
| .spin-cw { | |
| -webkit-animation-name: spin-cw-1turn; | |
| animation-name: spin-cw-1turn; | |
| } | |
| @-webkit-keyframes spin-cw-1turn { | |
| 0% { | |
| -webkit-transform: rotate(-1turn); | |
| transform: rotate(-1turn); | |
| } | |
| 100% { | |
| -webkit-transform: rotate(0); | |
| transform: rotate(0); | |
| } | |
| } | |
| @keyframes spin-cw-1turn { | |
| 0% { | |
| -webkit-transform: rotate(-1turn); | |
| transform: rotate(-1turn); | |
| } | |
| 100% { | |
| -webkit-transform: rotate(0); | |
| transform: rotate(0); | |
| } | |
| } | |
| .spin-ccw { | |
| -webkit-animation-name: spin-cw-1turn; | |
| animation-name: spin-cw-1turn; | |
| } | |
| @keyframes spin-cw-1turn { | |
| 0% { | |
| -webkit-transform: rotate(0); | |
| transform: rotate(0); | |
| } | |
| 100% { | |
| -webkit-transform: rotate(1turn); | |
| transform: rotate(1turn); | |
| } | |
| } | |
| .wiggle { | |
| -webkit-animation-name: wiggle-7deg; | |
| animation-name: wiggle-7deg; | |
| } | |
| @-webkit-keyframes wiggle-7deg { | |
| 40%, 50%, 60% { | |
| -webkit-transform: rotate(7deg); | |
| transform: rotate(7deg); | |
| } | |
| 35%, 45%, 55%, 65% { | |
| -webkit-transform: rotate(-7deg); | |
| transform: rotate(-7deg); | |
| } | |
| 0%, 30%, 70%, 100% { | |
| -webkit-transform: rotate(0); | |
| transform: rotate(0); | |
| } | |
| } | |
| @keyframes wiggle-7deg { | |
| 40%, 50%, 60% { | |
| -webkit-transform: rotate(7deg); | |
| transform: rotate(7deg); | |
| } | |
| 35%, 45%, 55%, 65% { | |
| -webkit-transform: rotate(-7deg); | |
| transform: rotate(-7deg); | |
| } | |
| 0%, 30%, 70%, 100% { | |
| -webkit-transform: rotate(0); | |
| transform: rotate(0); | |
| } | |
| } | |
| .infinite { | |
| -webkit-animation-iteration-count: infinite; | |
| animation-iteration-count: infinite; | |
| } | |
| .slow { | |
| -webkit-animation-duration: 750ms !important; | |
| animation-duration: 750ms !important; | |
| } | |
| .fast { | |
| -webkit-animation-duration: 250ms !important; | |
| animation-duration: 250ms !important; | |
| } | |
| .linear { | |
| -webkit-animation-timing-function: linear !important; | |
| animation-timing-function: linear !important; | |
| } | |
| .ease { | |
| -webkit-animation-timing-function: ease !important; | |
| animation-timing-function: ease !important; | |
| } | |
| .ease-in { | |
| -webkit-animation-timing-function: ease-in !important; | |
| animation-timing-function: ease-in !important; | |
| } | |
| .ease-out { | |
| -webkit-animation-timing-function: ease-out !important; | |
| animation-timing-function: ease-out !important; | |
| } | |
| .ease-in-out { | |
| -webkit-animation-timing-function: ease-in-out !important; | |
| animation-timing-function: ease-in-out !important; | |
| } | |
| .bounce-in { | |
| -webkit-animation-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important; | |
| animation-timing-function: cubic-bezier(0.485, 0.155, 0.24, 1.245) !important; | |
| } | |
| .bounce-out { | |
| -webkit-animation-timing-function: cubic-bezier(0.485, 0.155, 0.515, 0.845) !important; | |
| animation-timing-function: cubic-bezier(0.485, 0.155, 0.515, 0.845) !important; | |
| } | |
| .bounce-in-out { | |
| -webkit-animation-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important; | |
| animation-timing-function: cubic-bezier(0.76, -0.245, 0.24, 1.245) !important; | |
| } | |
| .short-delay { | |
| -webkit-animation-delay: 300ms !important; | |
| animation-delay: 300ms !important; | |
| } | |
| .long-delay { | |
| -webkit-animation-delay: 700ms !important; | |
| animation-delay: 700ms !important; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment