Permalink
| /*! | |
| * # Semantic UI 2.1.8 - Reset | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Reset | |
| *******************************/ | |
| /* Border-Box */ | |
| *, | |
| *:before, | |
| *:after { | |
| box-sizing: inherit; | |
| } | |
| html { | |
| box-sizing: border-box; | |
| } | |
| /* iPad Input Shadows */ | |
| input[type="text"], | |
| input[type="email"], | |
| input[type="search"], | |
| input[type="password"] { | |
| -webkit-appearance: none; | |
| -moz-appearance: none; | |
| /* mobile firefox too! */ | |
| } | |
| /******************************* | |
| Theme Overrides | |
| *******************************/ | |
| /*! normalize.css v3.0.1 | MIT License | git.io/normalize */ | |
| /** | |
| * Correct `block` display not defined in IE 8/9. | |
| */ | |
| /*! normalize.css v3.0.1 | 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, | |
| 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: 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; | |
| } | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - Site | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Page | |
| *******************************/ | |
| html, | |
| body { | |
| height: 100%; | |
| } | |
| html { | |
| font-size: 13px; | |
| } | |
| body { | |
| margin: 0px; | |
| padding: 0px; | |
| overflow-x: visible; | |
| min-width: 1049px; | |
| background: #FFFFFF; | |
| font-family: 'Arial', 'Helvetica Neue', Arial, Helvetica, sans-serif; | |
| font-size: 13px; | |
| line-height: 1.4285em; | |
| color: rgba(0, 0, 0, 0.87); | |
| font-smoothing: antialiased; | |
| } | |
| /******************************* | |
| Headers | |
| *******************************/ | |
| h1, | |
| h2, | |
| h3, | |
| h4, | |
| h5 { | |
| font-family: 'Arial', 'Helvetica Neue', Arial, Helvetica, sans-serif; | |
| line-height: 1.2857em; | |
| margin: calc(2rem - 0.14285em ) 0em 1rem; | |
| font-weight: bold; | |
| padding: 0em; | |
| } | |
| h1 { | |
| min-height: 1rem; | |
| font-size: 2.25em; | |
| } | |
| h2 { | |
| font-size: 1.714rem; | |
| } | |
| h3 { | |
| font-size: 1.28rem; | |
| } | |
| h4 { | |
| font-size: 1.071rem; | |
| } | |
| h5 { | |
| font-size: 1rem; | |
| } | |
| h1:first-child, | |
| h2:first-child, | |
| h3:first-child, | |
| h4:first-child, | |
| h5:first-child { | |
| margin-top: 0em; | |
| } | |
| h1:last-child, | |
| h2:last-child, | |
| h3:last-child, | |
| h4:last-child, | |
| h5:last-child { | |
| margin-bottom: 0em; | |
| } | |
| /******************************* | |
| Text | |
| *******************************/ | |
| p { | |
| margin: 0em 0em 1em; | |
| line-height: 1.4285em; | |
| } | |
| p:first-child { | |
| margin-top: 0em; | |
| } | |
| p:last-child { | |
| margin-bottom: 0em; | |
| } | |
| /*------------------- | |
| Links | |
| --------------------*/ | |
| a { | |
| color: #4078C0; | |
| text-decoration: none; | |
| } | |
| a:hover { | |
| color: #4078C0; | |
| text-decoration: underline; | |
| } | |
| /******************************* | |
| Highlighting | |
| *******************************/ | |
| /* Site */ | |
| ::-webkit-selection { | |
| background-color: #CCE2FF; | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| ::-moz-selection { | |
| background-color: #CCE2FF; | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| ::selection { | |
| background-color: #CCE2FF; | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| /* Form */ | |
| textarea::-webkit-selection, | |
| input::-webkit-selection { | |
| background-color: rgba(100, 100, 100, 0.4); | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| textarea::-moz-selection, | |
| input::-moz-selection { | |
| background-color: rgba(100, 100, 100, 0.4); | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| textarea::selection, | |
| input::selection { | |
| background-color: rgba(100, 100, 100, 0.4); | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - Breadcrumb | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Breadcrumb | |
| *******************************/ | |
| .ui.breadcrumb { | |
| line-height: 1; | |
| display: inline-block; | |
| margin: 0em 0em; | |
| vertical-align: middle; | |
| } | |
| .ui.breadcrumb:first-child { | |
| margin-top: 0em; | |
| } | |
| .ui.breadcrumb:last-child { | |
| margin-bottom: 0em; | |
| } | |
| /******************************* | |
| Content | |
| *******************************/ | |
| /* Divider */ | |
| .ui.breadcrumb .divider { | |
| display: inline-block; | |
| opacity: 1; | |
| margin: 0em 0 0em; | |
| font-size: 1.38461538rem; | |
| color: inherit; | |
| vertical-align: baseline; | |
| } | |
| /* Link */ | |
| .ui.breadcrumb a { | |
| color: #4078C0; | |
| } | |
| .ui.breadcrumb a:hover { | |
| color: #4078C0; | |
| } | |
| /* Icon Divider */ | |
| .ui.breadcrumb .icon.divider { | |
| font-size: 0.84615385em; | |
| vertical-align: baseline; | |
| } | |
| /* Section */ | |
| .ui.breadcrumb a.section { | |
| cursor: pointer; | |
| } | |
| .ui.breadcrumb .section { | |
| display: inline-block; | |
| margin: 0em; | |
| padding: 0em; | |
| } | |
| /* Loose Coupling */ | |
| .ui.breadcrumb.segment { | |
| display: inline-block; | |
| padding: 0.69230769em 1em; | |
| } | |
| /******************************* | |
| States | |
| *******************************/ | |
| .ui.breadcrumb .active.section { | |
| font-weight: bold; | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| .ui.mini.breadcrumb { | |
| font-size: 0.69230769rem; | |
| } | |
| .ui.tiny.breadcrumb { | |
| font-size: 0.84615385rem; | |
| } | |
| .ui.small.breadcrumb { | |
| font-size: 0.92307692rem; | |
| } | |
| .ui.breadcrumb { | |
| font-size: 1rem; | |
| } | |
| .ui.large.breadcrumb { | |
| font-size: 1.15384615rem; | |
| } | |
| .ui.big.breadcrumb { | |
| font-size: 1.38461538rem; | |
| } | |
| .ui.huge.breadcrumb { | |
| font-size: 1.46153846rem; | |
| } | |
| .ui.massive.breadcrumb { | |
| font-size: 1.69230769rem; | |
| } | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - Button | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Button | |
| *******************************/ | |
| .ui.button { | |
| cursor: pointer; | |
| display: inline-block; | |
| min-height: 1em; | |
| outline: none; | |
| border: none; | |
| vertical-align: baseline; | |
| background: #FBFBFB -webkit-linear-gradient(rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.05)); | |
| background: #FBFBFB linear-gradient(rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.05)); | |
| color: #333333; | |
| font-family: 'Arial', 'Helvetica Neue', Arial, Helvetica, sans-serif; | |
| margin: 0em 0.23076923rem 0em 0em; | |
| padding: 0.53846154em 0.92307692em 0.53846154em; | |
| text-transform: none; | |
| text-shadow: none; | |
| font-weight: bold; | |
| line-height: 1.53184em; | |
| font-style: normal; | |
| text-align: center; | |
| text-decoration: none; | |
| border-radius: 0.2307em; | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; | |
| -webkit-transition: opacity 0.1s ease, background 0.1s ease, color 0.1s ease, background 0.1s ease; | |
| transition: opacity 0.1s ease, background 0.1s ease, color 0.1s ease, background 0.1s ease; | |
| will-change: ''; | |
| -webkit-tap-highlight-color: transparent; | |
| } | |
| /******************************* | |
| States | |
| *******************************/ | |
| /*-------------- | |
| Hover | |
| ---------------*/ | |
| .ui.button:hover { | |
| background-color: #F0F0F0; | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.1), rgba(0, 0, 0, 0.1)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.1), rgba(0, 0, 0, 0.1)); | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| color: rgba(0, 0, 0, 0.8); | |
| } | |
| .ui.button:hover .icon { | |
| opacity: 0.85; | |
| } | |
| /*-------------- | |
| Focus | |
| ---------------*/ | |
| .ui.button:focus { | |
| background-color: #F0F0F0; | |
| color: rgba(0, 0, 0, 0.8); | |
| background-image: '' !important; | |
| box-shadow: 0px 0px 0px 1px #51A7E8, 0 0 5px rgba(81, 167, 232, 0.5) !important; | |
| } | |
| .ui.button:focus .icon { | |
| opacity: 0.85; | |
| } | |
| /*-------------- | |
| Down | |
| ---------------*/ | |
| .ui.button:active, | |
| .ui.active.button:active { | |
| background-color: ''; | |
| background-image: ''; | |
| color: rgba(0, 0, 0, 0.9); | |
| box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.05) inset, 0 0 0 1px rgba(0, 0, 0, 0.13) inset, 0 3px 5px rgba(0, 0, 0, 0.15) inset !important; | |
| } | |
| /*-------------- | |
| Active | |
| ---------------*/ | |
| .ui.active.button { | |
| background-color: #DFDFDF; | |
| background-image: none; | |
| box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.05) inset, 0 0 0 1px rgba(0, 0, 0, 0.13) inset, 0 3px 5px rgba(0, 0, 0, 0.1) inset !important; | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| .ui.active.button:hover { | |
| background-color: #DFDFDF; | |
| background-image: none; | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| .ui.active.button:active { | |
| background-color: #DFDFDF; | |
| background-image: none; | |
| } | |
| /*-------------- | |
| Loading | |
| ---------------*/ | |
| /* Specificity hack */ | |
| .ui.loading.loading.loading.loading.loading.loading.button { | |
| position: relative; | |
| cursor: default; | |
| text-shadow: none !important; | |
| color: transparent !important; | |
| opacity: 1; | |
| pointer-events: auto; | |
| -webkit-transition: all 0s linear, opacity 0.1s ease; | |
| transition: all 0s linear, opacity 0.1s ease; | |
| } | |
| .ui.loading.button:before { | |
| position: absolute; | |
| content: ''; | |
| top: 50%; | |
| left: 50%; | |
| margin: -0.69230769em 0em 0em -0.69230769em; | |
| width: 1.38461538em; | |
| height: 1.38461538em; | |
| border-radius: 500rem; | |
| border: 0.2em solid rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.loading.button:after { | |
| position: absolute; | |
| content: ''; | |
| top: 50%; | |
| left: 50%; | |
| margin: -0.69230769em 0em 0em -0.69230769em; | |
| width: 1.38461538em; | |
| height: 1.38461538em; | |
| -webkit-animation: button-spin 0.6s linear; | |
| animation: button-spin 0.6s linear; | |
| -webkit-animation-iteration-count: infinite; | |
| animation-iteration-count: infinite; | |
| border-radius: 500rem; | |
| border-color: #FFFFFF transparent transparent; | |
| border-style: solid; | |
| border-width: 0.2em; | |
| box-shadow: 0px 0px 0px 1px transparent; | |
| } | |
| .ui.labeled.icon.loading.button .icon { | |
| background-color: transparent; | |
| box-shadow: none; | |
| } | |
| @-webkit-keyframes button-spin { | |
| from { | |
| -webkit-transform: rotate(0deg); | |
| transform: rotate(0deg); | |
| } | |
| to { | |
| -webkit-transform: rotate(360deg); | |
| transform: rotate(360deg); | |
| } | |
| } | |
| @keyframes button-spin { | |
| from { | |
| -webkit-transform: rotate(0deg); | |
| transform: rotate(0deg); | |
| } | |
| to { | |
| -webkit-transform: rotate(360deg); | |
| transform: rotate(360deg); | |
| } | |
| } | |
| .ui.basic.loading.button:not(.inverted):before { | |
| border-color: rgba(0, 0, 0, 0.1); | |
| } | |
| .ui.basic.loading.button:not(.inverted):after { | |
| border-top-color: #767676; | |
| } | |
| /*------------------- | |
| Disabled | |
| --------------------*/ | |
| .ui.buttons .disabled.button, | |
| .ui.disabled.button, | |
| .ui.button:disabled, | |
| .ui.disabled.button:hover, | |
| .ui.disabled.active.button { | |
| cursor: default; | |
| opacity: 0.3 !important; | |
| background-image: none !important; | |
| box-shadow: none !important; | |
| pointer-events: none; | |
| } | |
| /* Basic Group With Disabled */ | |
| .ui.basic.buttons .ui.disabled.button { | |
| border-color: rgba(34, 36, 38, 0.5); | |
| } | |
| /******************************* | |
| Types | |
| *******************************/ | |
| /*------------------- | |
| Animated | |
| --------------------*/ | |
| .ui.animated.button { | |
| position: relative; | |
| overflow: hidden; | |
| padding-right: 0em !important; | |
| vertical-align: middle; | |
| z-index: 1; | |
| } | |
| .ui.animated.button .content { | |
| will-change: transform, opacity; | |
| } | |
| .ui.animated.button .visible.content { | |
| position: relative; | |
| margin-right: 0.92307692em; | |
| } | |
| .ui.animated.button .hidden.content { | |
| position: absolute; | |
| width: 100%; | |
| } | |
| /* Horizontal */ | |
| .ui.animated.button .visible.content, | |
| .ui.animated.button .hidden.content { | |
| -webkit-transition: right 0.3s ease 0s; | |
| transition: right 0.3s ease 0s; | |
| } | |
| .ui.animated.button .visible.content { | |
| left: auto; | |
| right: 0%; | |
| } | |
| .ui.animated.button .hidden.content { | |
| top: 50%; | |
| left: auto; | |
| right: -100%; | |
| margin-top: -0.76592em; | |
| } | |
| .ui.animated.button:focus .visible.content, | |
| .ui.animated.button:hover .visible.content { | |
| left: auto; | |
| right: 200%; | |
| } | |
| .ui.animated.button:focus .hidden.content, | |
| .ui.animated.button:hover .hidden.content { | |
| left: auto; | |
| right: 0%; | |
| } | |
| /* Vertical */ | |
| .ui.vertical.animated.button .visible.content, | |
| .ui.vertical.animated.button .hidden.content { | |
| -webkit-transition: top 0.3s ease, -webkit-transform 0.3s ease; | |
| transition: top 0.3s ease, -webkit-transform 0.3s ease; | |
| transition: top 0.3s ease, transform 0.3s ease; | |
| transition: top 0.3s ease, transform 0.3s ease, -webkit-transform 0.3s ease; | |
| } | |
| .ui.vertical.animated.button .visible.content { | |
| -webkit-transform: translateY(0%); | |
| transform: translateY(0%); | |
| right: auto; | |
| } | |
| .ui.vertical.animated.button .hidden.content { | |
| top: -50%; | |
| left: 0%; | |
| right: auto; | |
| } | |
| .ui.vertical.animated.button:focus .visible.content, | |
| .ui.vertical.animated.button:hover .visible.content { | |
| -webkit-transform: translateY(200%); | |
| transform: translateY(200%); | |
| right: auto; | |
| } | |
| .ui.vertical.animated.button:focus .hidden.content, | |
| .ui.vertical.animated.button:hover .hidden.content { | |
| top: 50%; | |
| right: auto; | |
| } | |
| /* Fade */ | |
| .ui.fade.animated.button .visible.content, | |
| .ui.fade.animated.button .hidden.content { | |
| -webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease; | |
| transition: opacity 0.3s ease, -webkit-transform 0.3s ease; | |
| transition: opacity 0.3s ease, transform 0.3s ease; | |
| transition: opacity 0.3s ease, transform 0.3s ease, -webkit-transform 0.3s ease; | |
| } | |
| .ui.fade.animated.button .visible.content { | |
| left: auto; | |
| right: auto; | |
| opacity: 1; | |
| -webkit-transform: scale(1); | |
| transform: scale(1); | |
| } | |
| .ui.fade.animated.button .hidden.content { | |
| opacity: 0; | |
| left: 0%; | |
| right: auto; | |
| -webkit-transform: scale(1.5); | |
| transform: scale(1.5); | |
| } | |
| .ui.fade.animated.button:focus .visible.content, | |
| .ui.fade.animated.button:hover .visible.content { | |
| left: auto; | |
| right: auto; | |
| opacity: 0; | |
| -webkit-transform: scale(0.75); | |
| transform: scale(0.75); | |
| } | |
| .ui.fade.animated.button:focus .hidden.content, | |
| .ui.fade.animated.button:hover .hidden.content { | |
| left: 0%; | |
| right: auto; | |
| opacity: 1; | |
| -webkit-transform: scale(1); | |
| transform: scale(1); | |
| } | |
| /*------------------- | |
| Inverted | |
| --------------------*/ | |
| .ui.inverted.button { | |
| box-shadow: 0px 0px 0px 2px #FFFFFF inset !important; | |
| background: transparent none; | |
| color: #FFFFFF; | |
| text-shadow: none !important; | |
| } | |
| /* Group */ | |
| .ui.inverted.buttons .button { | |
| margin: 0px 0px 0px -2px; | |
| } | |
| .ui.inverted.buttons .button:first-child { | |
| margin-left: 0em; | |
| } | |
| .ui.inverted.vertical.buttons .button { | |
| margin: 0px 0px -2px 0px; | |
| } | |
| .ui.inverted.vertical.buttons .button:first-child { | |
| margin-top: 0em; | |
| } | |
| /* States */ | |
| /* Hover */ | |
| .ui.inverted.button:hover { | |
| background: #FFFFFF; | |
| box-shadow: 0px 0px 0px 2px #FFFFFF inset !important; | |
| color: rgba(0, 0, 0, 0.8); | |
| } | |
| /* Active / Focus */ | |
| .ui.inverted.button:focus, | |
| .ui.inverted.button.active { | |
| background: #FFFFFF; | |
| box-shadow: 0px 0px 0px 2px #FFFFFF inset !important; | |
| color: rgba(0, 0, 0, 0.8); | |
| } | |
| /* Active Focus */ | |
| .ui.inverted.button.active:focus { | |
| background: #DCDDDE; | |
| box-shadow: 0px 0px 0px 2px #DCDDDE inset !important; | |
| color: rgba(0, 0, 0, 0.8); | |
| } | |
| /*------------------- | |
| Labeled Button | |
| --------------------*/ | |
| .ui.labeled.button:not(.icon) { | |
| display: -webkit-inline-box; | |
| display: -webkit-inline-flex; | |
| display: -ms-inline-flexbox; | |
| display: inline-flex; | |
| -webkit-box-orient: horizontal; | |
| -webkit-box-direction: normal; | |
| -webkit-flex-direction: row; | |
| -ms-flex-direction: row; | |
| flex-direction: row; | |
| background: none !important; | |
| padding: 0px !important; | |
| border: none !important; | |
| box-shadow: none !important; | |
| } | |
| .ui.labeled.button > .button { | |
| margin: 0px; | |
| } | |
| .ui.labeled.button > .label { | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| -webkit-box-align: center; | |
| -webkit-align-items: center; | |
| -ms-flex-align: center; | |
| align-items: center; | |
| margin: 0px 0px 0px -1px !important; | |
| padding: ''; | |
| font-size: 0.84615385em; | |
| border-color: rgba(0, 0, 0, 0.13); | |
| } | |
| /* Tag */ | |
| .ui.labeled.button > .tag.label:before { | |
| width: 1.85em; | |
| height: 1.85em; | |
| } | |
| /* Right */ | |
| .ui.labeled.button:not([class*="left labeled"]) > .button { | |
| border-top-right-radius: 0px; | |
| border-bottom-right-radius: 0px; | |
| } | |
| .ui.labeled.button:not([class*="left labeled"]) > .label { | |
| border-top-left-radius: 0px; | |
| border-bottom-left-radius: 0px; | |
| } | |
| /* Left Side */ | |
| .ui[class*="left labeled"].button > .button { | |
| border-top-left-radius: 0px; | |
| border-bottom-left-radius: 0px; | |
| } | |
| .ui[class*="left labeled"].button > .label { | |
| border-top-right-radius: 0px; | |
| border-bottom-right-radius: 0px; | |
| } | |
| /*------------------- | |
| Social | |
| --------------------*/ | |
| /* Facebook */ | |
| .ui.facebook.button { | |
| background-color: #3B5998; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.facebook.button:hover { | |
| background-color: #304d8a; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.facebook.button:active { | |
| background-color: #2d4373; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Twitter */ | |
| .ui.twitter.button { | |
| background-color: #0084B4; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.twitter.button:hover { | |
| background-color: #00719b; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.twitter.button:active { | |
| background-color: #005f81; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Google Plus */ | |
| .ui.google.plus.button { | |
| background-color: #DC4A38; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.google.plus.button:hover { | |
| background-color: #de321d; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.google.plus.button:active { | |
| background-color: #bf3322; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Linked In */ | |
| .ui.linkedin.button { | |
| background-color: #1F88BE; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.linkedin.button:hover { | |
| background-color: #147baf; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.linkedin.button:active { | |
| background-color: #186992; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* YouTube */ | |
| .ui.youtube.button { | |
| background-color: #CC181E; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.youtube.button:hover { | |
| background-color: #bd0d13; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.youtube.button:active { | |
| background-color: #9e1317; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Instagram */ | |
| .ui.instagram.button { | |
| background-color: #49769C; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.instagram.button:hover { | |
| background-color: #3d698e; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.instagram.button:active { | |
| background-color: #395c79; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Pinterest */ | |
| .ui.pinterest.button { | |
| background-color: #00ACED; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.pinterest.button:hover { | |
| background-color: #0099d4; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.pinterest.button:active { | |
| background-color: #0087ba; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* VK */ | |
| .ui.vk.button { | |
| background-color: #4D7198; | |
| color: #FFFFFF; | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.vk.button:hover { | |
| background-color: #41648a; | |
| color: #FFFFFF; | |
| } | |
| .ui.vk.button:active { | |
| background-color: #3c5876; | |
| color: #FFFFFF; | |
| } | |
| /*-------------- | |
| Icon | |
| ---------------*/ | |
| .ui.button > .icon:not(.button) { | |
| height: 18px; | |
| opacity: 1; | |
| margin: 0em 0.07692308em 0em -0.03846154em; | |
| -webkit-transition: opacity 0.1s ease; | |
| transition: opacity 0.1s ease; | |
| vertical-align: ''; | |
| color: ''; | |
| } | |
| .ui.button > .right.icon:not(.button) { | |
| margin: 0em -0.03846154em 0em 0.07692308em; | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| /*------------------- | |
| Floated | |
| --------------------*/ | |
| .ui[class*="left floated"].buttons, | |
| .ui[class*="left floated"].button { | |
| float: left; | |
| margin-left: 0em; | |
| margin-right: 0.25em; | |
| } | |
| .ui[class*="right floated"].buttons, | |
| .ui[class*="right floated"].button { | |
| float: right; | |
| margin-right: 0em; | |
| margin-left: 0.25em; | |
| } | |
| /*------------------- | |
| Compact | |
| --------------------*/ | |
| .ui.compact.buttons .button, | |
| .ui.compact.button { | |
| padding: 0.30769231em 0.76923077em 0.30769231em; | |
| } | |
| .ui.compact.icon.buttons .button, | |
| .ui.compact.icon.button { | |
| padding: 0.30769231em 0.30769231em 0.30769231em; | |
| } | |
| .ui.compact.labeled.icon.buttons .button, | |
| .ui.compact.labeled.icon.button { | |
| padding: 0.30769231em 2.84615385em 0.30769231em; | |
| } | |
| /*------------------- | |
| Sizes | |
| --------------------*/ | |
| .ui.mini.buttons .button, | |
| .ui.mini.buttons .or, | |
| .ui.mini.button { | |
| font-size: 10px; | |
| } | |
| .ui.tiny.buttons .button, | |
| .ui.tiny.buttons .or, | |
| .ui.tiny.button { | |
| font-size: 11px; | |
| } | |
| .ui.small.buttons .button, | |
| .ui.small.buttons .or, | |
| .ui.small.button { | |
| font-size: 12px; | |
| } | |
| .ui.buttons .button, | |
| .ui.buttons .or, | |
| .ui.button { | |
| font-size: 13px; | |
| } | |
| .ui.large.buttons .button, | |
| .ui.large.buttons .or, | |
| .ui.large.button { | |
| font-size: 15px; | |
| } | |
| .ui.big.buttons .button, | |
| .ui.big.buttons .or, | |
| .ui.big.button { | |
| font-size: 16px; | |
| } | |
| .ui.huge.buttons .button, | |
| .ui.huge.buttons .or, | |
| .ui.huge.button { | |
| font-size: 18px; | |
| } | |
| .ui.massive.buttons .button, | |
| .ui.massive.buttons .or, | |
| .ui.massive.button { | |
| font-size: 24px; | |
| } | |
| /*-------------- | |
| Icon Only | |
| ---------------*/ | |
| .ui.icon.buttons .button, | |
| .ui.icon.button { | |
| padding: 0.53846154em 0.53846154em 0.53846154em; | |
| } | |
| .ui.icon.buttons .button > .icon, | |
| .ui.icon.button > .icon { | |
| opacity: 0.9; | |
| margin: 0em; | |
| vertical-align: top; | |
| } | |
| /*------------------- | |
| Basic | |
| --------------------*/ | |
| .ui.basic.buttons .button, | |
| .ui.basic.button { | |
| background: transparent none !important; | |
| color: #4078C0 !important; | |
| font-weight: bold; | |
| border-radius: 0.2307em; | |
| text-transform: none; | |
| text-shadow: none !important; | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.basic.buttons { | |
| box-shadow: none; | |
| border: 1px solid rgba(0, 0, 0, 0.13); | |
| border-radius: 0.2307em; | |
| } | |
| .ui.basic.buttons .button { | |
| border-radius: 0em; | |
| } | |
| .ui.basic.buttons .button:hover, | |
| .ui.basic.button:hover { | |
| background: #E0E0E0 !important; | |
| color: #4078C0 !important; | |
| box-shadow: 0px 0px 0px 1px #51A7E8 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.basic.buttons .button:focus, | |
| .ui.basic.button:focus { | |
| background: #E0E0E0 !important; | |
| color: #4078C0 !important; | |
| box-shadow: 0px 0px 0px 1px #51A7E8 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.basic.buttons .button:active, | |
| .ui.basic.button:active { | |
| background: #F8F8F8 !important; | |
| color: rgba(0, 0, 0, 0.9) !important; | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.15) inset, 0px 1px 4px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.basic.buttons .active.button, | |
| .ui.basic.active.button { | |
| background: rgba(0, 0, 0, 0.05) !important; | |
| box-shadow: '' !important; | |
| color: rgba(0, 0, 0, 0.95); | |
| box-shadow: #51A7E8; | |
| } | |
| .ui.basic.buttons .active.button:hover, | |
| .ui.basic.active.button:hover { | |
| background-color: rgba(0, 0, 0, 0.05); | |
| } | |
| /* Vertical */ | |
| .ui.basic.buttons .button:hover { | |
| box-shadow: 0px 0px 0px 1px #51A7E8 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0.13) inset inset; | |
| } | |
| .ui.basic.buttons .button:active { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.15) inset, 0px 1px 4px 0px rgba(0, 0, 0, 0.13) inset inset; | |
| } | |
| .ui.basic.buttons .active.button { | |
| box-shadow: #51A7E8 inset; | |
| } | |
| /* Standard Basic Inverted */ | |
| .ui.basic.inverted.buttons .button, | |
| .ui.basic.inverted.button { | |
| background-color: transparent !important; | |
| color: #F9FAFB !important; | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important; | |
| } | |
| .ui.basic.inverted.buttons .button:hover, | |
| .ui.basic.inverted.button:hover { | |
| color: #FFFFFF !important; | |
| box-shadow: 0px 0px 0px 2px #ffffff inset !important; | |
| } | |
| .ui.basic.inverted.buttons .button:focus, | |
| .ui.basic.inverted.button:focus { | |
| color: #FFFFFF !important; | |
| box-shadow: 0px 0px 0px 2px #ffffff inset !important; | |
| } | |
| .ui.basic.inverted.buttons .button:active, | |
| .ui.basic.inverted.button:active { | |
| background-color: rgba(255, 255, 255, 0.08) !important; | |
| color: #FFFFFF !important; | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.9) inset !important; | |
| } | |
| .ui.basic.inverted.buttons .active.button, | |
| .ui.basic.inverted.active.button { | |
| background-color: rgba(255, 255, 255, 0.08); | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.7) inset; | |
| } | |
| .ui.basic.inverted.buttons .active.button:hover, | |
| .ui.basic.inverted.active.button:hover { | |
| background-color: rgba(255, 255, 255, 0.15); | |
| box-shadow: 0px 0px 0px 2px #ffffff inset !important; | |
| } | |
| /* Basic Group */ | |
| .ui.basic.buttons .button { | |
| border-left: 1px solid rgba(0, 0, 0, 0.13); | |
| box-shadow: none; | |
| } | |
| .ui.basic.vertical.buttons .button { | |
| border-left: none; | |
| } | |
| .ui.basic.vertical.buttons .button { | |
| border-left-width: 0px; | |
| border-top: 1px solid rgba(0, 0, 0, 0.13); | |
| } | |
| .ui.basic.vertical.buttons .button:first-child { | |
| border-top-width: 0px; | |
| } | |
| /*-------------- | |
| Labeled Icon | |
| ---------------*/ | |
| .ui.labeled.icon.buttons .button, | |
| .ui.labeled.icon.button { | |
| position: relative; | |
| padding-left: 3.17307692em !important; | |
| padding-right: 0.92307692em !important; | |
| } | |
| /* Left Labeled */ | |
| .ui.labeled.icon.buttons > .button > .icon, | |
| .ui.labeled.icon.button > .icon { | |
| position: absolute; | |
| height: 100%; | |
| line-height: 1; | |
| border-radius: 0px; | |
| border-top-left-radius: inherit; | |
| border-bottom-left-radius: inherit; | |
| text-align: center; | |
| margin: 0em; | |
| width: 2.07692308em; | |
| background-color: transparent; | |
| color: ''; | |
| box-shadow: -1px 0px 0px 0px transparent inset; | |
| } | |
| /* Left Labeled */ | |
| .ui.labeled.icon.buttons > .button > .icon, | |
| .ui.labeled.icon.button > .icon { | |
| top: 0em; | |
| left: 0em; | |
| } | |
| /* Right Labeled */ | |
| .ui[class*="right labeled"].icon.button { | |
| padding-right: 3.17307692em !important; | |
| padding-left: 0.92307692em !important; | |
| } | |
| .ui[class*="right labeled"].icon.button > .icon { | |
| left: auto; | |
| right: 0em; | |
| border-radius: 0px; | |
| border-top-right-radius: inherit; | |
| border-bottom-right-radius: inherit; | |
| box-shadow: 1px 0px 0px 0px transparent inset; | |
| } | |
| .ui.labeled.icon.buttons > .button > .icon:before, | |
| .ui.labeled.icon.button > .icon:before, | |
| .ui.labeled.icon.buttons > .button > .icon:after, | |
| .ui.labeled.icon.button > .icon:after { | |
| display: block; | |
| position: absolute; | |
| width: 100%; | |
| top: 50%; | |
| text-align: center; | |
| -webkit-transform: translateY(-50%); | |
| transform: translateY(-50%); | |
| } | |
| .ui.labeled.icon.buttons .button > .icon { | |
| border-radius: 0em; | |
| } | |
| .ui.labeled.icon.buttons .button:first-child > .icon { | |
| border-top-left-radius: 0.2307em; | |
| border-bottom-left-radius: 0.2307em; | |
| } | |
| .ui.labeled.icon.buttons .button:last-child > .icon { | |
| border-top-right-radius: 0.2307em; | |
| border-bottom-right-radius: 0.2307em; | |
| } | |
| .ui.vertical.labeled.icon.buttons .button:first-child > .icon { | |
| border-radius: 0em; | |
| border-top-left-radius: 0.2307em; | |
| } | |
| .ui.vertical.labeled.icon.buttons .button:last-child > .icon { | |
| border-radius: 0em; | |
| border-bottom-left-radius: 0.2307em; | |
| } | |
| /* Fluid Labeled */ | |
| .ui.fluid[class*="left labeled"].icon.button, | |
| .ui.fluid[class*="right labeled"].icon.button { | |
| padding-left: 0.92307692em !important; | |
| padding-right: 0.92307692em !important; | |
| } | |
| /*-------------- | |
| Toggle | |
| ---------------*/ | |
| /* Toggle (Modifies active state to give affordances) */ | |
| .ui.toggle.buttons .active.button, | |
| .ui.buttons .button.toggle.active, | |
| .ui.button.toggle.active { | |
| background-color: #84D767 !important; | |
| box-shadow: none !important; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| color: #FFFFFF !important; | |
| } | |
| .ui.button.toggle.active:hover { | |
| background-color: #5DC438 !important; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| color: #FFFFFF !important; | |
| } | |
| /*-------------- | |
| Circular | |
| ---------------*/ | |
| .ui.circular.button { | |
| border-radius: 10em; | |
| } | |
| .ui.circular.button > .icon { | |
| width: 1em; | |
| vertical-align: baseline; | |
| } | |
| /*------------------- | |
| Or Buttons | |
| --------------------*/ | |
| .ui.buttons .or { | |
| position: relative; | |
| width: 0.3em; | |
| height: 2.07692308em; | |
| z-index: 3; | |
| } | |
| .ui.buttons .or:before { | |
| position: absolute; | |
| text-align: center; | |
| border-radius: 500rem; | |
| content: 'or'; | |
| top: 50%; | |
| left: 50%; | |
| background-color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| margin-top: -0.76923077em; | |
| margin-left: -0.76923077em; | |
| width: 1.53846154em; | |
| height: 1.53846154em; | |
| line-height: 1.53846154em; | |
| color: rgba(0, 0, 0, 0.4); | |
| font-style: normal; | |
| font-weight: bold; | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.buttons .or[data-text]:before { | |
| content: attr(data-text); | |
| } | |
| /* Fluid Or */ | |
| .ui.fluid.buttons .or { | |
| width: 0em !important; | |
| } | |
| .ui.fluid.buttons .or:after { | |
| display: none; | |
| } | |
| /*------------------- | |
| Attached | |
| --------------------*/ | |
| /* Singular */ | |
| .ui.attached.button { | |
| position: relative; | |
| display: block; | |
| margin: 0em; | |
| border-radius: 0em; | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) !important; | |
| } | |
| /* Top / Bottom */ | |
| .ui.attached.top.button { | |
| border-radius: 0.2307em 0.2307em 0em 0em; | |
| } | |
| .ui.attached.bottom.button { | |
| border-radius: 0em 0em 0.2307em 0.2307em; | |
| } | |
| /* Left / Right */ | |
| .ui.left.attached.button { | |
| display: inline-block; | |
| border-left: none; | |
| text-align: right; | |
| padding-right: 0.75em; | |
| border-radius: 0.2307em 0em 0em 0.2307em; | |
| } | |
| .ui.right.attached.button { | |
| display: inline-block; | |
| text-align: left; | |
| padding-left: 0.75em; | |
| border-radius: 0em 0.2307em 0.2307em 0em; | |
| } | |
| /* Plural */ | |
| .ui.attached.buttons { | |
| position: relative; | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| border-radius: 0em; | |
| width: auto !important; | |
| z-index: 2; | |
| margin-left: -1px; | |
| margin-right: -1px; | |
| } | |
| .ui.attached.buttons .button { | |
| margin: 0em; | |
| } | |
| .ui.attached.buttons .button:first-child { | |
| border-radius: 0em; | |
| } | |
| .ui.attached.buttons .button:last-child { | |
| border-radius: 0em; | |
| } | |
| /* Top / Bottom */ | |
| .ui[class*="top attached"].buttons { | |
| margin-bottom: -1px; | |
| border-radius: 0.2307em 0.2307em 0em 0em; | |
| } | |
| .ui[class*="top attached"].buttons .button:first-child { | |
| border-radius: 0.2307em 0em 0em 0em; | |
| } | |
| .ui[class*="top attached"].buttons .button:last-child { | |
| border-radius: 0em 0.2307em 0em 0em; | |
| } | |
| .ui[class*="bottom attached"].buttons { | |
| margin-top: -1px; | |
| border-radius: 0em 0em 0.2307em 0.2307em; | |
| } | |
| .ui[class*="bottom attached"].buttons .button:first-child { | |
| border-radius: 0em 0em 0em 0.2307em; | |
| } | |
| .ui[class*="bottom attached"].buttons .button:last-child { | |
| border-radius: 0em 0em 0.2307em 0em; | |
| } | |
| /* Left / Right */ | |
| .ui[class*="left attached"].buttons { | |
| display: -webkit-inline-box; | |
| display: -webkit-inline-flex; | |
| display: -ms-inline-flexbox; | |
| display: inline-flex; | |
| margin-right: 0em; | |
| margin-left: -1px; | |
| border-radius: 0em 0.2307em 0.2307em 0em; | |
| } | |
| .ui[class*="left attached"].buttons .button:first-child { | |
| margin-left: -1px; | |
| border-radius: 0em 0.2307em 0em 0em; | |
| } | |
| .ui[class*="left attached"].buttons .button:last-child { | |
| margin-left: -1px; | |
| border-radius: 0em 0em 0.2307em 0em; | |
| } | |
| .ui[class*="right attached"].buttons { | |
| display: -webkit-inline-box; | |
| display: -webkit-inline-flex; | |
| display: -ms-inline-flexbox; | |
| display: inline-flex; | |
| margin-left: 0em; | |
| margin-right: -1px; | |
| border-radius: 0.2307em 0em 0em 0.2307em; | |
| } | |
| .ui[class*="right attached"].buttons .button:first-child { | |
| margin-left: -1px; | |
| border-radius: 0.2307em 0em 0em 0em; | |
| } | |
| .ui[class*="right attached"].buttons .button:last-child { | |
| margin-left: -1px; | |
| border-radius: 0em 0em 0em 0.2307em; | |
| } | |
| /*------------------- | |
| Fluid | |
| --------------------*/ | |
| .ui.fluid.buttons, | |
| .ui.fluid.button { | |
| width: 100%; | |
| } | |
| .ui.fluid.button { | |
| display: block; | |
| } | |
| .ui.two.buttons { | |
| width: 100%; | |
| } | |
| .ui.two.buttons > .button { | |
| width: 50%; | |
| } | |
| .ui.three.buttons { | |
| width: 100%; | |
| } | |
| .ui.three.buttons > .button { | |
| width: 33.333%; | |
| } | |
| .ui.four.buttons { | |
| width: 100%; | |
| } | |
| .ui.four.buttons > .button { | |
| width: 25%; | |
| } | |
| .ui.five.buttons { | |
| width: 100%; | |
| } | |
| .ui.five.buttons > .button { | |
| width: 20%; | |
| } | |
| .ui.six.buttons { | |
| width: 100%; | |
| } | |
| .ui.six.buttons > .button { | |
| width: 16.666%; | |
| } | |
| .ui.seven.buttons { | |
| width: 100%; | |
| } | |
| .ui.seven.buttons > .button { | |
| width: 14.285%; | |
| } | |
| .ui.eight.buttons { | |
| width: 100%; | |
| } | |
| .ui.eight.buttons > .button { | |
| width: 12.500%; | |
| } | |
| .ui.nine.buttons { | |
| width: 100%; | |
| } | |
| .ui.nine.buttons > .button { | |
| width: 11.11%; | |
| } | |
| .ui.ten.buttons { | |
| width: 100%; | |
| } | |
| .ui.ten.buttons > .button { | |
| width: 10%; | |
| } | |
| .ui.eleven.buttons { | |
| width: 100%; | |
| } | |
| .ui.eleven.buttons > .button { | |
| width: 9.09%; | |
| } | |
| .ui.twelve.buttons { | |
| width: 100%; | |
| } | |
| .ui.twelve.buttons > .button { | |
| width: 8.3333%; | |
| } | |
| /* Fluid Vertical Buttons */ | |
| .ui.fluid.vertical.buttons, | |
| .ui.fluid.vertical.buttons > .button { | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| width: auto; | |
| } | |
| .ui.two.vertical.buttons > .button { | |
| height: 50%; | |
| } | |
| .ui.three.vertical.buttons > .button { | |
| height: 33.333%; | |
| } | |
| .ui.four.vertical.buttons > .button { | |
| height: 25%; | |
| } | |
| .ui.five.vertical.buttons > .button { | |
| height: 20%; | |
| } | |
| .ui.six.vertical.buttons > .button { | |
| height: 16.666%; | |
| } | |
| .ui.seven.vertical.buttons > .button { | |
| height: 14.285%; | |
| } | |
| .ui.eight.vertical.buttons > .button { | |
| height: 12.500%; | |
| } | |
| .ui.nine.vertical.buttons > .button { | |
| height: 11.11%; | |
| } | |
| .ui.ten.vertical.buttons > .button { | |
| height: 10%; | |
| } | |
| .ui.eleven.vertical.buttons > .button { | |
| height: 9.09%; | |
| } | |
| .ui.twelve.vertical.buttons > .button { | |
| height: 8.3333%; | |
| } | |
| /*------------------- | |
| Colors | |
| --------------------*/ | |
| /*--- Black ---*/ | |
| .ui.black.buttons .button, | |
| .ui.black.button { | |
| background-color: #333333; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.black.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.black.buttons .button:hover, | |
| .ui.black.button:hover { | |
| background-color: #404040; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.black.buttons .button:focus, | |
| .ui.black.button:focus { | |
| background-color: #474747; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.black.buttons .button:active, | |
| .ui.black.button:active { | |
| background-color: #4d4d4d; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.black.buttons .active.button, | |
| .ui.black.buttons .active.button:active, | |
| .ui.black.active.button, | |
| .ui.black.button .active.button:active { | |
| background-color: #262626; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Basic */ | |
| .ui.basic.black.buttons .button, | |
| .ui.basic.black.button { | |
| box-shadow: 0px 0px 0px 1px #333333 inset !important; | |
| color: #333333 !important; | |
| } | |
| .ui.basic.black.buttons .button:hover, | |
| .ui.basic.black.button:hover { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #404040 inset !important; | |
| color: #404040 !important; | |
| } | |
| .ui.basic.black.buttons .button:focus, | |
| .ui.basic.black.button:focus { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #474747 inset !important; | |
| color: #404040 !important; | |
| } | |
| .ui.basic.black.buttons .active.button, | |
| .ui.basic.black.active.button { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #262626 inset !important; | |
| color: #4d4d4d !important; | |
| } | |
| .ui.basic.black.buttons .button:active, | |
| .ui.basic.black.button:active { | |
| box-shadow: 0px 0px 0px 1px #4d4d4d inset !important; | |
| color: #4d4d4d !important; | |
| } | |
| .ui.buttons:not(.vertical) > .basic.black.button:not(:first-child) { | |
| margin-left: -1px; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.black.buttons .button, | |
| .ui.inverted.black.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px #DDDDDD inset !important; | |
| color: #FFFFFF; | |
| } | |
| .ui.inverted.black.buttons .button:hover, | |
| .ui.inverted.black.button:hover, | |
| .ui.inverted.black.buttons .button:focus, | |
| .ui.inverted.black.button:focus, | |
| .ui.inverted.black.buttons .button.active, | |
| .ui.inverted.black.button.active, | |
| .ui.inverted.black.buttons .button:active, | |
| .ui.inverted.black.button:active { | |
| box-shadow: none !important; | |
| color: #FFFFFF; | |
| } | |
| .ui.inverted.black.buttons .button:hover, | |
| .ui.inverted.black.button:hover { | |
| background-color: #000000; | |
| } | |
| .ui.inverted.black.buttons .button:focus, | |
| .ui.inverted.black.button:focus { | |
| background-color: #000000; | |
| } | |
| .ui.inverted.black.buttons .active.button, | |
| .ui.inverted.black.active.button { | |
| background-color: #000000; | |
| } | |
| .ui.inverted.black.buttons .button:active, | |
| .ui.inverted.black.button:active { | |
| background-color: #000000; | |
| } | |
| /* Inverted Basic */ | |
| .ui.inverted.black.basic.buttons .button, | |
| .ui.inverted.black.buttons .basic.button, | |
| .ui.inverted.black.basic.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.black.basic.buttons .button:hover, | |
| .ui.inverted.black.buttons .basic.button:hover, | |
| .ui.inverted.black.basic.button:hover { | |
| box-shadow: 0px 0px 0px 2px #000000 inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.black.basic.buttons .button:focus, | |
| .ui.inverted.black.basic.buttons .button:focus, | |
| .ui.inverted.black.basic.button:focus { | |
| box-shadow: 0px 0px 0px 2px #000000 inset !important; | |
| color: #545454 !important; | |
| } | |
| .ui.inverted.black.basic.buttons .active.button, | |
| .ui.inverted.black.buttons .basic.active.button, | |
| .ui.inverted.black.basic.active.button { | |
| box-shadow: 0px 0px 0px 2px #000000 inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.black.basic.buttons .button:active, | |
| .ui.inverted.black.buttons .basic.button:active, | |
| .ui.inverted.black.basic.button:active { | |
| box-shadow: 0px 0px 0px 2px #000000 inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| /*--- Grey ---*/ | |
| .ui.grey.buttons .button, | |
| .ui.grey.button { | |
| background-color: #767676; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.grey.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.grey.buttons .button:hover, | |
| .ui.grey.button:hover { | |
| background-color: #838383; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.grey.buttons .button:focus, | |
| .ui.grey.button:focus { | |
| background-color: #8a8a8a; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.grey.buttons .button:active, | |
| .ui.grey.button:active { | |
| background-color: #909090; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.grey.buttons .active.button, | |
| .ui.grey.buttons .active.button:active, | |
| .ui.grey.active.button, | |
| .ui.grey.button .active.button:active { | |
| background-color: #696969; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Basic */ | |
| .ui.basic.grey.buttons .button, | |
| .ui.basic.grey.button { | |
| box-shadow: 0px 0px 0px 1px #767676 inset !important; | |
| color: #767676 !important; | |
| } | |
| .ui.basic.grey.buttons .button:hover, | |
| .ui.basic.grey.button:hover { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #838383 inset !important; | |
| color: #838383 !important; | |
| } | |
| .ui.basic.grey.buttons .button:focus, | |
| .ui.basic.grey.button:focus { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #8a8a8a inset !important; | |
| color: #838383 !important; | |
| } | |
| .ui.basic.grey.buttons .active.button, | |
| .ui.basic.grey.active.button { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #696969 inset !important; | |
| color: #909090 !important; | |
| } | |
| .ui.basic.grey.buttons .button:active, | |
| .ui.basic.grey.button:active { | |
| box-shadow: 0px 0px 0px 1px #909090 inset !important; | |
| color: #909090 !important; | |
| } | |
| .ui.buttons:not(.vertical) > .basic.grey.button:not(:first-child) { | |
| margin-left: -1px; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.grey.buttons .button, | |
| .ui.inverted.grey.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px #DDDDDD inset !important; | |
| color: #FFFFFF; | |
| } | |
| .ui.inverted.grey.buttons .button:hover, | |
| .ui.inverted.grey.button:hover, | |
| .ui.inverted.grey.buttons .button:focus, | |
| .ui.inverted.grey.button:focus, | |
| .ui.inverted.grey.buttons .button.active, | |
| .ui.inverted.grey.button.active, | |
| .ui.inverted.grey.buttons .button:active, | |
| .ui.inverted.grey.button:active { | |
| box-shadow: none !important; | |
| color: #333333; | |
| } | |
| .ui.inverted.grey.buttons .button:hover, | |
| .ui.inverted.grey.button:hover { | |
| background-color: #cfd0d2; | |
| } | |
| .ui.inverted.grey.buttons .button:focus, | |
| .ui.inverted.grey.button:focus { | |
| background-color: #c7c9cb; | |
| } | |
| .ui.inverted.grey.buttons .active.button, | |
| .ui.inverted.grey.active.button { | |
| background-color: #cfd0d2; | |
| } | |
| .ui.inverted.grey.buttons .button:active, | |
| .ui.inverted.grey.button:active { | |
| background-color: #c2c4c5; | |
| } | |
| /* Inverted Basic */ | |
| .ui.inverted.grey.basic.buttons .button, | |
| .ui.inverted.grey.buttons .basic.button, | |
| .ui.inverted.grey.basic.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.grey.basic.buttons .button:hover, | |
| .ui.inverted.grey.buttons .basic.button:hover, | |
| .ui.inverted.grey.basic.button:hover { | |
| box-shadow: 0px 0px 0px 2px #cfd0d2 inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.grey.basic.buttons .button:focus, | |
| .ui.inverted.grey.basic.buttons .button:focus, | |
| .ui.inverted.grey.basic.button:focus { | |
| box-shadow: 0px 0px 0px 2px #c7c9cb inset !important; | |
| color: #DCDDDE !important; | |
| } | |
| .ui.inverted.grey.basic.buttons .active.button, | |
| .ui.inverted.grey.buttons .basic.active.button, | |
| .ui.inverted.grey.basic.active.button { | |
| box-shadow: 0px 0px 0px 2px #cfd0d2 inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.grey.basic.buttons .button:active, | |
| .ui.inverted.grey.buttons .basic.button:active, | |
| .ui.inverted.grey.basic.button:active { | |
| box-shadow: 0px 0px 0px 2px #c2c4c5 inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| /*--- Brown ---*/ | |
| .ui.brown.buttons .button, | |
| .ui.brown.button { | |
| background-color: #A5673F; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.brown.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.brown.buttons .button:hover, | |
| .ui.brown.button:hover { | |
| background-color: #975b33; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.brown.buttons .button:focus, | |
| .ui.brown.button:focus { | |
| background-color: #90532b; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.brown.buttons .button:active, | |
| .ui.brown.button:active { | |
| background-color: #805031; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.brown.buttons .active.button, | |
| .ui.brown.buttons .active.button:active, | |
| .ui.brown.active.button, | |
| .ui.brown.button .active.button:active { | |
| background-color: #995a31; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Basic */ | |
| .ui.basic.brown.buttons .button, | |
| .ui.basic.brown.button { | |
| box-shadow: 0px 0px 0px 1px #A5673F inset !important; | |
| color: #A5673F !important; | |
| } | |
| .ui.basic.brown.buttons .button:hover, | |
| .ui.basic.brown.button:hover { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #975b33 inset !important; | |
| color: #975b33 !important; | |
| } | |
| .ui.basic.brown.buttons .button:focus, | |
| .ui.basic.brown.button:focus { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #90532b inset !important; | |
| color: #975b33 !important; | |
| } | |
| .ui.basic.brown.buttons .active.button, | |
| .ui.basic.brown.active.button { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #995a31 inset !important; | |
| color: #805031 !important; | |
| } | |
| .ui.basic.brown.buttons .button:active, | |
| .ui.basic.brown.button:active { | |
| box-shadow: 0px 0px 0px 1px #805031 inset !important; | |
| color: #805031 !important; | |
| } | |
| .ui.buttons:not(.vertical) > .basic.brown.button:not(:first-child) { | |
| margin-left: -1px; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.brown.buttons .button, | |
| .ui.inverted.brown.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px #D67C1C inset !important; | |
| color: #D67C1C; | |
| } | |
| .ui.inverted.brown.buttons .button:hover, | |
| .ui.inverted.brown.button:hover, | |
| .ui.inverted.brown.buttons .button:focus, | |
| .ui.inverted.brown.button:focus, | |
| .ui.inverted.brown.buttons .button.active, | |
| .ui.inverted.brown.button.active, | |
| .ui.inverted.brown.buttons .button:active, | |
| .ui.inverted.brown.button:active { | |
| box-shadow: none !important; | |
| color: #FFFFFF; | |
| } | |
| .ui.inverted.brown.buttons .button:hover, | |
| .ui.inverted.brown.button:hover { | |
| background-color: #c86f11; | |
| } | |
| .ui.inverted.brown.buttons .button:focus, | |
| .ui.inverted.brown.button:focus { | |
| background-color: #c16808; | |
| } | |
| .ui.inverted.brown.buttons .active.button, | |
| .ui.inverted.brown.active.button { | |
| background-color: #cc6f0d; | |
| } | |
| .ui.inverted.brown.buttons .button:active, | |
| .ui.inverted.brown.button:active { | |
| background-color: #a96216; | |
| } | |
| /* Inverted Basic */ | |
| .ui.inverted.brown.basic.buttons .button, | |
| .ui.inverted.brown.buttons .basic.button, | |
| .ui.inverted.brown.basic.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.brown.basic.buttons .button:hover, | |
| .ui.inverted.brown.buttons .basic.button:hover, | |
| .ui.inverted.brown.basic.button:hover { | |
| box-shadow: 0px 0px 0px 2px #c86f11 inset !important; | |
| color: #D67C1C !important; | |
| } | |
| .ui.inverted.brown.basic.buttons .button:focus, | |
| .ui.inverted.brown.basic.buttons .button:focus, | |
| .ui.inverted.brown.basic.button:focus { | |
| box-shadow: 0px 0px 0px 2px #c16808 inset !important; | |
| color: #D67C1C !important; | |
| } | |
| .ui.inverted.brown.basic.buttons .active.button, | |
| .ui.inverted.brown.buttons .basic.active.button, | |
| .ui.inverted.brown.basic.active.button { | |
| box-shadow: 0px 0px 0px 2px #cc6f0d inset !important; | |
| color: #D67C1C !important; | |
| } | |
| .ui.inverted.brown.basic.buttons .button:active, | |
| .ui.inverted.brown.buttons .basic.button:active, | |
| .ui.inverted.brown.basic.button:active { | |
| box-shadow: 0px 0px 0px 2px #a96216 inset !important; | |
| color: #D67C1C !important; | |
| } | |
| /*--- Blue ---*/ | |
| .ui.blue.buttons .button, | |
| .ui.blue.button { | |
| background-color: #80A6CD; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.blue.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.blue.buttons .button:hover, | |
| .ui.blue.button:hover { | |
| background-color: #6999ca; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.blue.buttons .button:focus, | |
| .ui.blue.button:focus { | |
| background-color: #5991cb; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.blue.buttons .button:active, | |
| .ui.blue.button:active { | |
| background-color: #5b8cbf; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.blue.buttons .active.button, | |
| .ui.blue.buttons .active.button:active, | |
| .ui.blue.active.button, | |
| .ui.blue.button .active.button:active { | |
| background-color: #6799cc; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Basic */ | |
| .ui.basic.blue.buttons .button, | |
| .ui.basic.blue.button { | |
| box-shadow: 0px 0px 0px 1px #80A6CD inset !important; | |
| color: #80A6CD !important; | |
| } | |
| .ui.basic.blue.buttons .button:hover, | |
| .ui.basic.blue.button:hover { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #6999ca inset !important; | |
| color: #6999ca !important; | |
| } | |
| .ui.basic.blue.buttons .button:focus, | |
| .ui.basic.blue.button:focus { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #5991cb inset !important; | |
| color: #6999ca !important; | |
| } | |
| .ui.basic.blue.buttons .active.button, | |
| .ui.basic.blue.active.button { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #6799cc inset !important; | |
| color: #5b8cbf !important; | |
| } | |
| .ui.basic.blue.buttons .button:active, | |
| .ui.basic.blue.button:active { | |
| box-shadow: 0px 0px 0px 1px #5b8cbf inset !important; | |
| color: #5b8cbf !important; | |
| } | |
| .ui.buttons:not(.vertical) > .basic.blue.button:not(:first-child) { | |
| margin-left: -1px; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.blue.buttons .button, | |
| .ui.inverted.blue.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px #54C8FF inset !important; | |
| color: #54C8FF; | |
| } | |
| .ui.inverted.blue.buttons .button:hover, | |
| .ui.inverted.blue.button:hover, | |
| .ui.inverted.blue.buttons .button:focus, | |
| .ui.inverted.blue.button:focus, | |
| .ui.inverted.blue.buttons .button.active, | |
| .ui.inverted.blue.button.active, | |
| .ui.inverted.blue.buttons .button:active, | |
| .ui.inverted.blue.button:active { | |
| box-shadow: none !important; | |
| color: #FFFFFF; | |
| } | |
| .ui.inverted.blue.buttons .button:hover, | |
| .ui.inverted.blue.button:hover { | |
| background-color: #3ac0ff; | |
| } | |
| .ui.inverted.blue.buttons .button:focus, | |
| .ui.inverted.blue.button:focus { | |
| background-color: #2bbbff; | |
| } | |
| .ui.inverted.blue.buttons .active.button, | |
| .ui.inverted.blue.active.button { | |
| background-color: #3ac0ff; | |
| } | |
| .ui.inverted.blue.buttons .button:active, | |
| .ui.inverted.blue.button:active { | |
| background-color: #21b8ff; | |
| } | |
| /* Inverted Basic */ | |
| .ui.inverted.blue.basic.buttons .button, | |
| .ui.inverted.blue.buttons .basic.button, | |
| .ui.inverted.blue.basic.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.blue.basic.buttons .button:hover, | |
| .ui.inverted.blue.buttons .basic.button:hover, | |
| .ui.inverted.blue.basic.button:hover { | |
| box-shadow: 0px 0px 0px 2px #3ac0ff inset !important; | |
| color: #54C8FF !important; | |
| } | |
| .ui.inverted.blue.basic.buttons .button:focus, | |
| .ui.inverted.blue.basic.buttons .button:focus, | |
| .ui.inverted.blue.basic.button:focus { | |
| box-shadow: 0px 0px 0px 2px #2bbbff inset !important; | |
| color: #54C8FF !important; | |
| } | |
| .ui.inverted.blue.basic.buttons .active.button, | |
| .ui.inverted.blue.buttons .basic.active.button, | |
| .ui.inverted.blue.basic.active.button { | |
| box-shadow: 0px 0px 0px 2px #3ac0ff inset !important; | |
| color: #54C8FF !important; | |
| } | |
| .ui.inverted.blue.basic.buttons .button:active, | |
| .ui.inverted.blue.buttons .basic.button:active, | |
| .ui.inverted.blue.basic.button:active { | |
| box-shadow: 0px 0px 0px 2px #21b8ff inset !important; | |
| color: #54C8FF !important; | |
| } | |
| /*--- Green ---*/ | |
| .ui.green.buttons .button, | |
| .ui.green.button { | |
| background-color: #78CB5B; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.green.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.green.buttons .button:hover, | |
| .ui.green.button:hover { | |
| background-color: #65cb41; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.green.buttons .button:focus, | |
| .ui.green.button:focus { | |
| background-color: #59cd30; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.green.buttons .button:active, | |
| .ui.green.button:active { | |
| background-color: #5bb83b; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.green.buttons .active.button, | |
| .ui.green.buttons .active.button:active, | |
| .ui.green.active.button, | |
| .ui.green.button .active.button:active { | |
| background-color: #64ce3e; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Basic */ | |
| .ui.basic.green.buttons .button, | |
| .ui.basic.green.button { | |
| box-shadow: 0px 0px 0px 1px #78CB5B inset !important; | |
| color: #78CB5B !important; | |
| } | |
| .ui.basic.green.buttons .button:hover, | |
| .ui.basic.green.button:hover { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #65cb41 inset !important; | |
| color: #65cb41 !important; | |
| } | |
| .ui.basic.green.buttons .button:focus, | |
| .ui.basic.green.button:focus { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #59cd30 inset !important; | |
| color: #65cb41 !important; | |
| } | |
| .ui.basic.green.buttons .active.button, | |
| .ui.basic.green.active.button { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #64ce3e inset !important; | |
| color: #5bb83b !important; | |
| } | |
| .ui.basic.green.buttons .button:active, | |
| .ui.basic.green.button:active { | |
| box-shadow: 0px 0px 0px 1px #5bb83b inset !important; | |
| color: #5bb83b !important; | |
| } | |
| .ui.buttons:not(.vertical) > .basic.green.button:not(:first-child) { | |
| margin-left: -1px; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.green.buttons .button, | |
| .ui.inverted.green.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px #2ECC40 inset !important; | |
| color: #2ECC40; | |
| } | |
| .ui.inverted.green.buttons .button:hover, | |
| .ui.inverted.green.button:hover, | |
| .ui.inverted.green.buttons .button:focus, | |
| .ui.inverted.green.button:focus, | |
| .ui.inverted.green.buttons .button.active, | |
| .ui.inverted.green.button.active, | |
| .ui.inverted.green.buttons .button:active, | |
| .ui.inverted.green.button:active { | |
| box-shadlightOw: none !important; | |
| color: #FFFFFF; | |
| } | |
| .ui.inverted.green.buttons .button:hover, | |
| .ui.inverted.green.button:hover { | |
| background-color: #22be34; | |
| } | |
| .ui.inverted.green.buttons .button:focus, | |
| .ui.inverted.green.button:focus { | |
| background-color: #19b82b; | |
| } | |
| .ui.inverted.green.buttons .active.button, | |
| .ui.inverted.green.active.button { | |
| background-color: #1fc231; | |
| } | |
| .ui.inverted.green.buttons .button:active, | |
| .ui.inverted.green.button:active { | |
| background-color: #25a233; | |
| } | |
| /* Inverted Basic */ | |
| .ui.inverted.green.basic.buttons .button, | |
| .ui.inverted.green.buttons .basic.button, | |
| .ui.inverted.green.basic.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.green.basic.buttons .button:hover, | |
| .ui.inverted.green.buttons .basic.button:hover, | |
| .ui.inverted.green.basic.button:hover { | |
| box-shadow: 0px 0px 0px 2px #22be34 inset !important; | |
| color: #2ECC40 !important; | |
| } | |
| .ui.inverted.green.basic.buttons .button:focus, | |
| .ui.inverted.green.basic.buttons .button:focus, | |
| .ui.inverted.green.basic.button:focus { | |
| box-shadow: 0px 0px 0px 2px #19b82b inset !important; | |
| color: #2ECC40 !important; | |
| } | |
| .ui.inverted.green.basic.buttons .active.button, | |
| .ui.inverted.green.buttons .basic.active.button, | |
| .ui.inverted.green.basic.active.button { | |
| box-shadow: 0px 0px 0px 2px #1fc231 inset !important; | |
| color: #2ECC40 !important; | |
| } | |
| .ui.inverted.green.basic.buttons .button:active, | |
| .ui.inverted.green.buttons .basic.button:active, | |
| .ui.inverted.green.basic.button:active { | |
| box-shadow: 0px 0px 0px 2px #25a233 inset !important; | |
| color: #2ECC40 !important; | |
| } | |
| /*--- Orange ---*/ | |
| .ui.orange.buttons .button, | |
| .ui.orange.button { | |
| background-color: #D26911; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.orange.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.orange.buttons .button:hover, | |
| .ui.orange.button:hover { | |
| background-color: #c35c07; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.orange.buttons .button:focus, | |
| .ui.orange.button:focus { | |
| background-color: #ba5500; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.orange.buttons .button:active, | |
| .ui.orange.button:active { | |
| background-color: #a3510d; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.orange.buttons .active.button, | |
| .ui.orange.buttons .active.button:active, | |
| .ui.orange.active.button, | |
| .ui.orange.button .active.button:active { | |
| background-color: #c75c02; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Basic */ | |
| .ui.basic.orange.buttons .button, | |
| .ui.basic.orange.button { | |
| box-shadow: 0px 0px 0px 1px #D26911 inset !important; | |
| color: #D26911 !important; | |
| } | |
| .ui.basic.orange.buttons .button:hover, | |
| .ui.basic.orange.button:hover { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #c35c07 inset !important; | |
| color: #c35c07 !important; | |
| } | |
| .ui.basic.orange.buttons .button:focus, | |
| .ui.basic.orange.button:focus { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #ba5500 inset !important; | |
| color: #c35c07 !important; | |
| } | |
| .ui.basic.orange.buttons .active.button, | |
| .ui.basic.orange.active.button { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #c75c02 inset !important; | |
| color: #a3510d !important; | |
| } | |
| .ui.basic.orange.buttons .button:active, | |
| .ui.basic.orange.button:active { | |
| box-shadow: 0px 0px 0px 1px #a3510d inset !important; | |
| color: #a3510d !important; | |
| } | |
| .ui.buttons:not(.vertical) > .basic.orange.button:not(:first-child) { | |
| margin-left: -1px; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.orange.buttons .button, | |
| .ui.inverted.orange.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px #FF851B inset !important; | |
| color: #FF851B; | |
| } | |
| .ui.inverted.orange.buttons .button:hover, | |
| .ui.inverted.orange.button:hover, | |
| .ui.inverted.orange.buttons .button:focus, | |
| .ui.inverted.orange.button:focus, | |
| .ui.inverted.orange.buttons .button.active, | |
| .ui.inverted.orange.button.active, | |
| .ui.inverted.orange.buttons .button:active, | |
| .ui.inverted.orange.button:active { | |
| box-shadow: none !important; | |
| color: #FFFFFF; | |
| } | |
| .ui.inverted.orange.buttons .button:hover, | |
| .ui.inverted.orange.button:hover { | |
| background-color: #ff7701; | |
| } | |
| .ui.inverted.orange.buttons .button:focus, | |
| .ui.inverted.orange.button:focus { | |
| background-color: #f17000; | |
| } | |
| .ui.inverted.orange.buttons .active.button, | |
| .ui.inverted.orange.active.button { | |
| background-color: #ff7701; | |
| } | |
| .ui.inverted.orange.buttons .button:active, | |
| .ui.inverted.orange.button:active { | |
| background-color: #e76b00; | |
| } | |
| /* Inverted Basic */ | |
| .ui.inverted.orange.basic.buttons .button, | |
| .ui.inverted.orange.buttons .basic.button, | |
| .ui.inverted.orange.basic.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.orange.basic.buttons .button:hover, | |
| .ui.inverted.orange.buttons .basic.button:hover, | |
| .ui.inverted.orange.basic.button:hover { | |
| box-shadow: 0px 0px 0px 2px #ff7701 inset !important; | |
| color: #FF851B !important; | |
| } | |
| .ui.inverted.orange.basic.buttons .button:focus, | |
| .ui.inverted.orange.basic.buttons .button:focus, | |
| .ui.inverted.orange.basic.button:focus { | |
| box-shadow: 0px 0px 0px 2px #f17000 inset !important; | |
| color: #FF851B !important; | |
| } | |
| .ui.inverted.orange.basic.buttons .active.button, | |
| .ui.inverted.orange.buttons .basic.active.button, | |
| .ui.inverted.orange.basic.active.button { | |
| box-shadow: 0px 0px 0px 2px #ff7701 inset !important; | |
| color: #FF851B !important; | |
| } | |
| .ui.inverted.orange.basic.buttons .button:active, | |
| .ui.inverted.orange.buttons .basic.button:active, | |
| .ui.inverted.orange.basic.button:active { | |
| box-shadow: 0px 0px 0px 2px #e76b00 inset !important; | |
| color: #FF851B !important; | |
| } | |
| /*--- Pink ---*/ | |
| .ui.pink.buttons .button, | |
| .ui.pink.button { | |
| background-color: #E03997; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.pink.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.pink.buttons .button:hover, | |
| .ui.pink.button:hover { | |
| background-color: #e61a8d; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.pink.buttons .button:focus, | |
| .ui.pink.button:focus { | |
| background-color: #e10f85; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.pink.buttons .button:active, | |
| .ui.pink.button:active { | |
| background-color: #c71f7e; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.pink.buttons .active.button, | |
| .ui.pink.buttons .active.button:active, | |
| .ui.pink.active.button, | |
| .ui.pink.button .active.button:active { | |
| background-color: #ea158d; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Basic */ | |
| .ui.basic.pink.buttons .button, | |
| .ui.basic.pink.button { | |
| box-shadow: 0px 0px 0px 1px #E03997 inset !important; | |
| color: #E03997 !important; | |
| } | |
| .ui.basic.pink.buttons .button:hover, | |
| .ui.basic.pink.button:hover { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #e61a8d inset !important; | |
| color: #e61a8d !important; | |
| } | |
| .ui.basic.pink.buttons .button:focus, | |
| .ui.basic.pink.button:focus { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #e10f85 inset !important; | |
| color: #e61a8d !important; | |
| } | |
| .ui.basic.pink.buttons .active.button, | |
| .ui.basic.pink.active.button { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #ea158d inset !important; | |
| color: #c71f7e !important; | |
| } | |
| .ui.basic.pink.buttons .button:active, | |
| .ui.basic.pink.button:active { | |
| box-shadow: 0px 0px 0px 1px #c71f7e inset !important; | |
| color: #c71f7e !important; | |
| } | |
| .ui.buttons:not(.vertical) > .basic.pink.button:not(:first-child) { | |
| margin-left: -1px; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.pink.buttons .button, | |
| .ui.inverted.pink.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px #FF8EDF inset !important; | |
| color: #FF8EDF; | |
| } | |
| .ui.inverted.pink.buttons .button:hover, | |
| .ui.inverted.pink.button:hover, | |
| .ui.inverted.pink.buttons .button:focus, | |
| .ui.inverted.pink.button:focus, | |
| .ui.inverted.pink.buttons .button.active, | |
| .ui.inverted.pink.button.active, | |
| .ui.inverted.pink.buttons .button:active, | |
| .ui.inverted.pink.button:active { | |
| box-shadow: none !important; | |
| color: #FFFFFF; | |
| } | |
| .ui.inverted.pink.buttons .button:hover, | |
| .ui.inverted.pink.button:hover { | |
| background-color: #ff74d8; | |
| } | |
| .ui.inverted.pink.buttons .button:focus, | |
| .ui.inverted.pink.button:focus { | |
| background-color: #ff65d3; | |
| } | |
| .ui.inverted.pink.buttons .active.button, | |
| .ui.inverted.pink.active.button { | |
| background-color: #ff74d8; | |
| } | |
| .ui.inverted.pink.buttons .button:active, | |
| .ui.inverted.pink.button:active { | |
| background-color: #ff5bd1; | |
| } | |
| /* Inverted Basic */ | |
| .ui.inverted.pink.basic.buttons .button, | |
| .ui.inverted.pink.buttons .basic.button, | |
| .ui.inverted.pink.basic.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.pink.basic.buttons .button:hover, | |
| .ui.inverted.pink.buttons .basic.button:hover, | |
| .ui.inverted.pink.basic.button:hover { | |
| box-shadow: 0px 0px 0px 2px #ff74d8 inset !important; | |
| color: #FF8EDF !important; | |
| } | |
| .ui.inverted.pink.basic.buttons .button:focus, | |
| .ui.inverted.pink.basic.buttons .button:focus, | |
| .ui.inverted.pink.basic.button:focus { | |
| box-shadow: 0px 0px 0px 2px #ff65d3 inset !important; | |
| color: #FF8EDF !important; | |
| } | |
| .ui.inverted.pink.basic.buttons .active.button, | |
| .ui.inverted.pink.buttons .basic.active.button, | |
| .ui.inverted.pink.basic.active.button { | |
| box-shadow: 0px 0px 0px 2px #ff74d8 inset !important; | |
| color: #FF8EDF !important; | |
| } | |
| .ui.inverted.pink.basic.buttons .button:active, | |
| .ui.inverted.pink.buttons .basic.button:active, | |
| .ui.inverted.pink.basic.button:active { | |
| box-shadow: 0px 0px 0px 2px #ff5bd1 inset !important; | |
| color: #FF8EDF !important; | |
| } | |
| /*--- Violet ---*/ | |
| .ui.violet.buttons .button, | |
| .ui.violet.button { | |
| background-color: #6435C9; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.violet.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.violet.buttons .button:hover, | |
| .ui.violet.button:hover { | |
| background-color: #5829bb; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.violet.buttons .button:focus, | |
| .ui.violet.button:focus { | |
| background-color: #4f20b5; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.violet.buttons .button:active, | |
| .ui.violet.button:active { | |
| background-color: #502aa1; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.violet.buttons .active.button, | |
| .ui.violet.buttons .active.button:active, | |
| .ui.violet.active.button, | |
| .ui.violet.button .active.button:active { | |
| background-color: #5626bf; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Basic */ | |
| .ui.basic.violet.buttons .button, | |
| .ui.basic.violet.button { | |
| box-shadow: 0px 0px 0px 1px #6435C9 inset !important; | |
| color: #6435C9 !important; | |
| } | |
| .ui.basic.violet.buttons .button:hover, | |
| .ui.basic.violet.button:hover { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #5829bb inset !important; | |
| color: #5829bb !important; | |
| } | |
| .ui.basic.violet.buttons .button:focus, | |
| .ui.basic.violet.button:focus { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #4f20b5 inset !important; | |
| color: #5829bb !important; | |
| } | |
| .ui.basic.violet.buttons .active.button, | |
| .ui.basic.violet.active.button { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #5626bf inset !important; | |
| color: #502aa1 !important; | |
| } | |
| .ui.basic.violet.buttons .button:active, | |
| .ui.basic.violet.button:active { | |
| box-shadow: 0px 0px 0px 1px #502aa1 inset !important; | |
| color: #502aa1 !important; | |
| } | |
| .ui.buttons:not(.vertical) > .basic.violet.button:not(:first-child) { | |
| margin-left: -1px; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.violet.buttons .button, | |
| .ui.inverted.violet.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px #A291FB inset !important; | |
| color: #A291FB; | |
| } | |
| .ui.inverted.violet.buttons .button:hover, | |
| .ui.inverted.violet.button:hover, | |
| .ui.inverted.violet.buttons .button:focus, | |
| .ui.inverted.violet.button:focus, | |
| .ui.inverted.violet.buttons .button.active, | |
| .ui.inverted.violet.button.active, | |
| .ui.inverted.violet.buttons .button:active, | |
| .ui.inverted.violet.button:active { | |
| box-shadow: none !important; | |
| color: #FFFFFF; | |
| } | |
| .ui.inverted.violet.buttons .button:hover, | |
| .ui.inverted.violet.button:hover { | |
| background-color: #8a73ff; | |
| } | |
| .ui.inverted.violet.buttons .button:focus, | |
| .ui.inverted.violet.button:focus { | |
| background-color: #7d64ff; | |
| } | |
| .ui.inverted.violet.buttons .active.button, | |
| .ui.inverted.violet.active.button { | |
| background-color: #8a73ff; | |
| } | |
| .ui.inverted.violet.buttons .button:active, | |
| .ui.inverted.violet.button:active { | |
| background-color: #7860f9; | |
| } | |
| /* Inverted Basic */ | |
| .ui.inverted.violet.basic.buttons .button, | |
| .ui.inverted.violet.buttons .basic.button, | |
| .ui.inverted.violet.basic.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.violet.basic.buttons .button:hover, | |
| .ui.inverted.violet.buttons .basic.button:hover, | |
| .ui.inverted.violet.basic.button:hover { | |
| box-shadow: 0px 0px 0px 2px #8a73ff inset !important; | |
| color: #A291FB !important; | |
| } | |
| .ui.inverted.violet.basic.buttons .button:focus, | |
| .ui.inverted.violet.basic.buttons .button:focus, | |
| .ui.inverted.violet.basic.button:focus { | |
| box-shadow: 0px 0px 0px 2px #7d64ff inset !important; | |
| color: #A291FB !important; | |
| } | |
| .ui.inverted.violet.basic.buttons .active.button, | |
| .ui.inverted.violet.buttons .basic.active.button, | |
| .ui.inverted.violet.basic.active.button { | |
| box-shadow: 0px 0px 0px 2px #8a73ff inset !important; | |
| color: #A291FB !important; | |
| } | |
| .ui.inverted.violet.basic.buttons .button:active, | |
| .ui.inverted.violet.buttons .basic.button:active, | |
| .ui.inverted.violet.basic.button:active { | |
| box-shadow: 0px 0px 0px 2px #7860f9 inset !important; | |
| color: #A291FB !important; | |
| } | |
| /*--- Purple ---*/ | |
| .ui.purple.buttons .button, | |
| .ui.purple.button { | |
| background-color: #A333C8; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.purple.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.purple.buttons .button:hover, | |
| .ui.purple.button:hover { | |
| background-color: #9627ba; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.purple.buttons .button:focus, | |
| .ui.purple.button:focus { | |
| background-color: #8f1eb4; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.purple.buttons .button:active, | |
| .ui.purple.button:active { | |
| background-color: #82299f; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.purple.buttons .active.button, | |
| .ui.purple.buttons .active.button:active, | |
| .ui.purple.active.button, | |
| .ui.purple.button .active.button:active { | |
| background-color: #9724be; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Basic */ | |
| .ui.basic.purple.buttons .button, | |
| .ui.basic.purple.button { | |
| box-shadow: 0px 0px 0px 1px #A333C8 inset !important; | |
| color: #A333C8 !important; | |
| } | |
| .ui.basic.purple.buttons .button:hover, | |
| .ui.basic.purple.button:hover { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #9627ba inset !important; | |
| color: #9627ba !important; | |
| } | |
| .ui.basic.purple.buttons .button:focus, | |
| .ui.basic.purple.button:focus { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #8f1eb4 inset !important; | |
| color: #9627ba !important; | |
| } | |
| .ui.basic.purple.buttons .active.button, | |
| .ui.basic.purple.active.button { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #9724be inset !important; | |
| color: #82299f !important; | |
| } | |
| .ui.basic.purple.buttons .button:active, | |
| .ui.basic.purple.button:active { | |
| box-shadow: 0px 0px 0px 1px #82299f inset !important; | |
| color: #82299f !important; | |
| } | |
| .ui.buttons:not(.vertical) > .basic.purple.button:not(:first-child) { | |
| margin-left: -1px; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.purple.buttons .button, | |
| .ui.inverted.purple.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px #DC73FF inset !important; | |
| color: #DC73FF; | |
| } | |
| .ui.inverted.purple.buttons .button:hover, | |
| .ui.inverted.purple.button:hover, | |
| .ui.inverted.purple.buttons .button:focus, | |
| .ui.inverted.purple.button:focus, | |
| .ui.inverted.purple.buttons .button.active, | |
| .ui.inverted.purple.button.active, | |
| .ui.inverted.purple.buttons .button:active, | |
| .ui.inverted.purple.button:active { | |
| box-shadow: none !important; | |
| color: #FFFFFF; | |
| } | |
| .ui.inverted.purple.buttons .button:hover, | |
| .ui.inverted.purple.button:hover { | |
| background-color: #d65aff; | |
| } | |
| .ui.inverted.purple.buttons .button:focus, | |
| .ui.inverted.purple.button:focus { | |
| background-color: #d24aff; | |
| } | |
| .ui.inverted.purple.buttons .active.button, | |
| .ui.inverted.purple.active.button { | |
| background-color: #d65aff; | |
| } | |
| .ui.inverted.purple.buttons .button:active, | |
| .ui.inverted.purple.button:active { | |
| background-color: #cf40ff; | |
| } | |
| /* Inverted Basic */ | |
| .ui.inverted.purple.basic.buttons .button, | |
| .ui.inverted.purple.buttons .basic.button, | |
| .ui.inverted.purple.basic.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.purple.basic.buttons .button:hover, | |
| .ui.inverted.purple.buttons .basic.button:hover, | |
| .ui.inverted.purple.basic.button:hover { | |
| box-shadow: 0px 0px 0px 2px #d65aff inset !important; | |
| color: #DC73FF !important; | |
| } | |
| .ui.inverted.purple.basic.buttons .button:focus, | |
| .ui.inverted.purple.basic.buttons .button:focus, | |
| .ui.inverted.purple.basic.button:focus { | |
| box-shadow: 0px 0px 0px 2px #d24aff inset !important; | |
| color: #DC73FF !important; | |
| } | |
| .ui.inverted.purple.basic.buttons .active.button, | |
| .ui.inverted.purple.buttons .basic.active.button, | |
| .ui.inverted.purple.basic.active.button { | |
| box-shadow: 0px 0px 0px 2px #d65aff inset !important; | |
| color: #DC73FF !important; | |
| } | |
| .ui.inverted.purple.basic.buttons .button:active, | |
| .ui.inverted.purple.buttons .basic.button:active, | |
| .ui.inverted.purple.basic.button:active { | |
| box-shadow: 0px 0px 0px 2px #cf40ff inset !important; | |
| color: #DC73FF !important; | |
| } | |
| /*--- Red ---*/ | |
| .ui.red.buttons .button, | |
| .ui.red.button { | |
| background-color: #DB2828; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.red.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.red.buttons .button:hover, | |
| .ui.red.button:hover { | |
| background-color: #d01919; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.red.buttons .button:focus, | |
| .ui.red.button:focus { | |
| background-color: #ca1010; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.red.buttons .button:active, | |
| .ui.red.button:active { | |
| background-color: #b21e1e; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.red.buttons .active.button, | |
| .ui.red.buttons .active.button:active, | |
| .ui.red.active.button, | |
| .ui.red.button .active.button:active { | |
| background-color: #d41515; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Basic */ | |
| .ui.basic.red.buttons .button, | |
| .ui.basic.red.button { | |
| box-shadow: 0px 0px 0px 1px #DB2828 inset !important; | |
| color: #DB2828 !important; | |
| } | |
| .ui.basic.red.buttons .button:hover, | |
| .ui.basic.red.button:hover { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #d01919 inset !important; | |
| color: #d01919 !important; | |
| } | |
| .ui.basic.red.buttons .button:focus, | |
| .ui.basic.red.button:focus { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #ca1010 inset !important; | |
| color: #d01919 !important; | |
| } | |
| .ui.basic.red.buttons .active.button, | |
| .ui.basic.red.active.button { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #d41515 inset !important; | |
| color: #b21e1e !important; | |
| } | |
| .ui.basic.red.buttons .button:active, | |
| .ui.basic.red.button:active { | |
| box-shadow: 0px 0px 0px 1px #b21e1e inset !important; | |
| color: #b21e1e !important; | |
| } | |
| .ui.buttons:not(.vertical) > .basic.red.button:not(:first-child) { | |
| margin-left: -1px; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.red.buttons .button, | |
| .ui.inverted.red.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px #FF695E inset !important; | |
| color: #FF695E; | |
| } | |
| .ui.inverted.red.buttons .button:hover, | |
| .ui.inverted.red.button:hover, | |
| .ui.inverted.red.buttons .button:focus, | |
| .ui.inverted.red.button:focus, | |
| .ui.inverted.red.buttons .button.active, | |
| .ui.inverted.red.button.active, | |
| .ui.inverted.red.buttons .button:active, | |
| .ui.inverted.red.button:active { | |
| box-shadow: none !important; | |
| color: #FFFFFF; | |
| } | |
| .ui.inverted.red.buttons .button:hover, | |
| .ui.inverted.red.button:hover { | |
| background-color: #ff5144; | |
| } | |
| .ui.inverted.red.buttons .button:focus, | |
| .ui.inverted.red.button:focus { | |
| background-color: #ff4335; | |
| } | |
| .ui.inverted.red.buttons .active.button, | |
| .ui.inverted.red.active.button { | |
| background-color: #ff5144; | |
| } | |
| .ui.inverted.red.buttons .button:active, | |
| .ui.inverted.red.button:active { | |
| background-color: #ff392b; | |
| } | |
| /* Inverted Basic */ | |
| .ui.inverted.red.basic.buttons .button, | |
| .ui.inverted.red.buttons .basic.button, | |
| .ui.inverted.red.basic.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.red.basic.buttons .button:hover, | |
| .ui.inverted.red.buttons .basic.button:hover, | |
| .ui.inverted.red.basic.button:hover { | |
| box-shadow: 0px 0px 0px 2px #ff5144 inset !important; | |
| color: #FF695E !important; | |
| } | |
| .ui.inverted.red.basic.buttons .button:focus, | |
| .ui.inverted.red.basic.buttons .button:focus, | |
| .ui.inverted.red.basic.button:focus { | |
| box-shadow: 0px 0px 0px 2px #ff4335 inset !important; | |
| color: #FF695E !important; | |
| } | |
| .ui.inverted.red.basic.buttons .active.button, | |
| .ui.inverted.red.buttons .basic.active.button, | |
| .ui.inverted.red.basic.active.button { | |
| box-shadow: 0px 0px 0px 2px #ff5144 inset !important; | |
| color: #FF695E !important; | |
| } | |
| .ui.inverted.red.basic.buttons .button:active, | |
| .ui.inverted.red.buttons .basic.button:active, | |
| .ui.inverted.red.basic.button:active { | |
| box-shadow: 0px 0px 0px 2px #ff392b inset !important; | |
| color: #FF695E !important; | |
| } | |
| /*--- Teal ---*/ | |
| .ui.teal.buttons .button, | |
| .ui.teal.button { | |
| background-color: #00B5AD; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.teal.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.teal.buttons .button:hover, | |
| .ui.teal.button:hover { | |
| background-color: #009c95; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.teal.buttons .button:focus, | |
| .ui.teal.button:focus { | |
| background-color: #008c86; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.teal.buttons .button:active, | |
| .ui.teal.button:active { | |
| background-color: #00827c; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.teal.buttons .active.button, | |
| .ui.teal.buttons .active.button:active, | |
| .ui.teal.active.button, | |
| .ui.teal.button .active.button:active { | |
| background-color: #009c95; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Basic */ | |
| .ui.basic.teal.buttons .button, | |
| .ui.basic.teal.button { | |
| box-shadow: 0px 0px 0px 1px #00B5AD inset !important; | |
| color: #00B5AD !important; | |
| } | |
| .ui.basic.teal.buttons .button:hover, | |
| .ui.basic.teal.button:hover { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #009c95 inset !important; | |
| color: #009c95 !important; | |
| } | |
| .ui.basic.teal.buttons .button:focus, | |
| .ui.basic.teal.button:focus { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #008c86 inset !important; | |
| color: #009c95 !important; | |
| } | |
| .ui.basic.teal.buttons .active.button, | |
| .ui.basic.teal.active.button { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #009c95 inset !important; | |
| color: #00827c !important; | |
| } | |
| .ui.basic.teal.buttons .button:active, | |
| .ui.basic.teal.button:active { | |
| box-shadow: 0px 0px 0px 1px #00827c inset !important; | |
| color: #00827c !important; | |
| } | |
| .ui.buttons:not(.vertical) > .basic.teal.button:not(:first-child) { | |
| margin-left: -1px; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.teal.buttons .button, | |
| .ui.inverted.teal.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px #6DFFFF inset !important; | |
| color: #6DFFFF; | |
| } | |
| .ui.inverted.teal.buttons .button:hover, | |
| .ui.inverted.teal.button:hover, | |
| .ui.inverted.teal.buttons .button:focus, | |
| .ui.inverted.teal.button:focus, | |
| .ui.inverted.teal.buttons .button.active, | |
| .ui.inverted.teal.button.active, | |
| .ui.inverted.teal.buttons .button:active, | |
| .ui.inverted.teal.button:active { | |
| box-shadow: none !important; | |
| color: #333333; | |
| } | |
| .ui.inverted.teal.buttons .button:hover, | |
| .ui.inverted.teal.button:hover { | |
| background-color: #54ffff; | |
| } | |
| .ui.inverted.teal.buttons .button:focus, | |
| .ui.inverted.teal.button:focus { | |
| background-color: #44ffff; | |
| } | |
| .ui.inverted.teal.buttons .active.button, | |
| .ui.inverted.teal.active.button { | |
| background-color: #54ffff; | |
| } | |
| .ui.inverted.teal.buttons .button:active, | |
| .ui.inverted.teal.button:active { | |
| background-color: #3affff; | |
| } | |
| /* Inverted Basic */ | |
| .ui.inverted.teal.basic.buttons .button, | |
| .ui.inverted.teal.buttons .basic.button, | |
| .ui.inverted.teal.basic.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.teal.basic.buttons .button:hover, | |
| .ui.inverted.teal.buttons .basic.button:hover, | |
| .ui.inverted.teal.basic.button:hover { | |
| box-shadow: 0px 0px 0px 2px #54ffff inset !important; | |
| color: #6DFFFF !important; | |
| } | |
| .ui.inverted.teal.basic.buttons .button:focus, | |
| .ui.inverted.teal.basic.buttons .button:focus, | |
| .ui.inverted.teal.basic.button:focus { | |
| box-shadow: 0px 0px 0px 2px #44ffff inset !important; | |
| color: #6DFFFF !important; | |
| } | |
| .ui.inverted.teal.basic.buttons .active.button, | |
| .ui.inverted.teal.buttons .basic.active.button, | |
| .ui.inverted.teal.basic.active.button { | |
| box-shadow: 0px 0px 0px 2px #54ffff inset !important; | |
| color: #6DFFFF !important; | |
| } | |
| .ui.inverted.teal.basic.buttons .button:active, | |
| .ui.inverted.teal.buttons .basic.button:active, | |
| .ui.inverted.teal.basic.button:active { | |
| box-shadow: 0px 0px 0px 2px #3affff inset !important; | |
| color: #6DFFFF !important; | |
| } | |
| /*--- Olive ---*/ | |
| .ui.olive.buttons .button, | |
| .ui.olive.button { | |
| background-color: #B5CC18; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.olive.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.olive.buttons .button:hover, | |
| .ui.olive.button:hover { | |
| background-color: #a7bd0d; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.olive.buttons .button:focus, | |
| .ui.olive.button:focus { | |
| background-color: #a0b605; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.olive.buttons .button:active, | |
| .ui.olive.button:active { | |
| background-color: #8d9e13; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.olive.buttons .active.button, | |
| .ui.olive.buttons .active.button:active, | |
| .ui.olive.active.button, | |
| .ui.olive.button .active.button:active { | |
| background-color: #aac109; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Basic */ | |
| .ui.basic.olive.buttons .button, | |
| .ui.basic.olive.button { | |
| box-shadow: 0px 0px 0px 1px #B5CC18 inset !important; | |
| color: #B5CC18 !important; | |
| } | |
| .ui.basic.olive.buttons .button:hover, | |
| .ui.basic.olive.button:hover { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #a7bd0d inset !important; | |
| color: #a7bd0d !important; | |
| } | |
| .ui.basic.olive.buttons .button:focus, | |
| .ui.basic.olive.button:focus { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #a0b605 inset !important; | |
| color: #a7bd0d !important; | |
| } | |
| .ui.basic.olive.buttons .active.button, | |
| .ui.basic.olive.active.button { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #aac109 inset !important; | |
| color: #8d9e13 !important; | |
| } | |
| .ui.basic.olive.buttons .button:active, | |
| .ui.basic.olive.button:active { | |
| box-shadow: 0px 0px 0px 1px #8d9e13 inset !important; | |
| color: #8d9e13 !important; | |
| } | |
| .ui.buttons:not(.vertical) > .basic.olive.button:not(:first-child) { | |
| margin-left: -1px; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.olive.buttons .button, | |
| .ui.inverted.olive.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px #D9E778 inset !important; | |
| color: #D9E778; | |
| } | |
| .ui.inverted.olive.buttons .button:hover, | |
| .ui.inverted.olive.button:hover, | |
| .ui.inverted.olive.buttons .button:focus, | |
| .ui.inverted.olive.button:focus, | |
| .ui.inverted.olive.buttons .button.active, | |
| .ui.inverted.olive.button.active, | |
| .ui.inverted.olive.buttons .button:active, | |
| .ui.inverted.olive.button:active { | |
| box-shadow: none !important; | |
| color: #333333; | |
| } | |
| .ui.inverted.olive.buttons .button:hover, | |
| .ui.inverted.olive.button:hover { | |
| background-color: #d8ea5c; | |
| } | |
| .ui.inverted.olive.buttons .button:focus, | |
| .ui.inverted.olive.button:focus { | |
| background-color: #daef47; | |
| } | |
| .ui.inverted.olive.buttons .active.button, | |
| .ui.inverted.olive.active.button { | |
| background-color: #daed59; | |
| } | |
| .ui.inverted.olive.buttons .button:active, | |
| .ui.inverted.olive.button:active { | |
| background-color: #cddf4d; | |
| } | |
| /* Inverted Basic */ | |
| .ui.inverted.olive.basic.buttons .button, | |
| .ui.inverted.olive.buttons .basic.button, | |
| .ui.inverted.olive.basic.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.olive.basic.buttons .button:hover, | |
| .ui.inverted.olive.buttons .basic.button:hover, | |
| .ui.inverted.olive.basic.button:hover { | |
| box-shadow: 0px 0px 0px 2px #d8ea5c inset !important; | |
| color: #D9E778 !important; | |
| } | |
| .ui.inverted.olive.basic.buttons .button:focus, | |
| .ui.inverted.olive.basic.buttons .button:focus, | |
| .ui.inverted.olive.basic.button:focus { | |
| box-shadow: 0px 0px 0px 2px #daef47 inset !important; | |
| color: #D9E778 !important; | |
| } | |
| .ui.inverted.olive.basic.buttons .active.button, | |
| .ui.inverted.olive.buttons .basic.active.button, | |
| .ui.inverted.olive.basic.active.button { | |
| box-shadow: 0px 0px 0px 2px #daed59 inset !important; | |
| color: #D9E778 !important; | |
| } | |
| .ui.inverted.olive.basic.buttons .button:active, | |
| .ui.inverted.olive.buttons .basic.button:active, | |
| .ui.inverted.olive.basic.button:active { | |
| box-shadow: 0px 0px 0px 2px #cddf4d inset !important; | |
| color: #D9E778 !important; | |
| } | |
| /*--- Yellow ---*/ | |
| .ui.yellow.buttons .button, | |
| .ui.yellow.button { | |
| background-color: #FBBD08; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.yellow.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.yellow.buttons .button:hover, | |
| .ui.yellow.button:hover { | |
| background-color: #eaae00; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.yellow.buttons .button:focus, | |
| .ui.yellow.button:focus { | |
| background-color: #daa300; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.yellow.buttons .button:active, | |
| .ui.yellow.button:active { | |
| background-color: #cd9903; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.yellow.buttons .active.button, | |
| .ui.yellow.buttons .active.button:active, | |
| .ui.yellow.active.button, | |
| .ui.yellow.button .active.button:active { | |
| background-color: #eaae00; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /* Basic */ | |
| .ui.basic.yellow.buttons .button, | |
| .ui.basic.yellow.button { | |
| box-shadow: 0px 0px 0px 1px #FBBD08 inset !important; | |
| color: #FBBD08 !important; | |
| } | |
| .ui.basic.yellow.buttons .button:hover, | |
| .ui.basic.yellow.button:hover { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #eaae00 inset !important; | |
| color: #eaae00 !important; | |
| } | |
| .ui.basic.yellow.buttons .button:focus, | |
| .ui.basic.yellow.button:focus { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #daa300 inset !important; | |
| color: #eaae00 !important; | |
| } | |
| .ui.basic.yellow.buttons .active.button, | |
| .ui.basic.yellow.active.button { | |
| background: transparent !important; | |
| box-shadow: 0px 0px 0px 1px #eaae00 inset !important; | |
| color: #cd9903 !important; | |
| } | |
| .ui.basic.yellow.buttons .button:active, | |
| .ui.basic.yellow.button:active { | |
| box-shadow: 0px 0px 0px 1px #cd9903 inset !important; | |
| color: #cd9903 !important; | |
| } | |
| .ui.buttons:not(.vertical) > .basic.yellow.button:not(:first-child) { | |
| margin-left: -1px; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.yellow.buttons .button, | |
| .ui.inverted.yellow.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px #FFE21F inset !important; | |
| color: #FFE21F; | |
| } | |
| .ui.inverted.yellow.buttons .button:hover, | |
| .ui.inverted.yellow.button:hover, | |
| .ui.inverted.yellow.buttons .button:focus, | |
| .ui.inverted.yellow.button:focus, | |
| .ui.inverted.yellow.buttons .button.active, | |
| .ui.inverted.yellow.button.active, | |
| .ui.inverted.yellow.buttons .button:active, | |
| .ui.inverted.yellow.button:active { | |
| box-shadow: none !important; | |
| color: #333333; | |
| } | |
| .ui.inverted.yellow.buttons .button:hover, | |
| .ui.inverted.yellow.button:hover { | |
| background-color: #ffdf05; | |
| } | |
| .ui.inverted.yellow.buttons .button:focus, | |
| .ui.inverted.yellow.button:focus { | |
| background-color: #f5d500; | |
| } | |
| .ui.inverted.yellow.buttons .active.button, | |
| .ui.inverted.yellow.active.button { | |
| background-color: #ffdf05; | |
| } | |
| .ui.inverted.yellow.buttons .button:active, | |
| .ui.inverted.yellow.button:active { | |
| background-color: #ebcd00; | |
| } | |
| /* Inverted Basic */ | |
| .ui.inverted.yellow.basic.buttons .button, | |
| .ui.inverted.yellow.buttons .basic.button, | |
| .ui.inverted.yellow.basic.button { | |
| background-color: transparent; | |
| box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.yellow.basic.buttons .button:hover, | |
| .ui.inverted.yellow.buttons .basic.button:hover, | |
| .ui.inverted.yellow.basic.button:hover { | |
| box-shadow: 0px 0px 0px 2px #ffdf05 inset !important; | |
| color: #FFE21F !important; | |
| } | |
| .ui.inverted.yellow.basic.buttons .button:focus, | |
| .ui.inverted.yellow.basic.buttons .button:focus, | |
| .ui.inverted.yellow.basic.button:focus { | |
| box-shadow: 0px 0px 0px 2px #f5d500 inset !important; | |
| color: #FFE21F !important; | |
| } | |
| .ui.inverted.yellow.basic.buttons .active.button, | |
| .ui.inverted.yellow.buttons .basic.active.button, | |
| .ui.inverted.yellow.basic.active.button { | |
| box-shadow: 0px 0px 0px 2px #ffdf05 inset !important; | |
| color: #FFE21F !important; | |
| } | |
| .ui.inverted.yellow.basic.buttons .button:active, | |
| .ui.inverted.yellow.buttons .basic.button:active, | |
| .ui.inverted.yellow.basic.button:active { | |
| box-shadow: 0px 0px 0px 2px #ebcd00 inset !important; | |
| color: #FFE21F !important; | |
| } | |
| /*------------------- | |
| Primary | |
| --------------------*/ | |
| .ui.primary.buttons .button, | |
| .ui.primary.button { | |
| background-color: #78CB5B; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.primary.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.primary.buttons .button:hover, | |
| .ui.primary.button:hover { | |
| background-color: #65cb41; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.primary.buttons .button:focus, | |
| .ui.primary.button:focus { | |
| background-color: #59cd30; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.primary.buttons .button:active, | |
| .ui.primary.button:active { | |
| background-color: #5bb83b; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.primary.buttons .active.button, | |
| .ui.primary.active.button { | |
| background-color: #64ce3e; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /*------------------- | |
| Secondary | |
| --------------------*/ | |
| .ui.secondary.buttons .button, | |
| .ui.secondary.button { | |
| background-color: #333333; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.secondary.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.secondary.buttons .button:hover, | |
| .ui.secondary.button:hover { | |
| background-color: #404040; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.secondary.buttons .button:focus, | |
| .ui.secondary.button:focus { | |
| background-color: #474747; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.secondary.buttons .button:active, | |
| .ui.secondary.button:active { | |
| background-color: #4d4d4d; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.secondary.buttons .active.button, | |
| .ui.secondary.active.button { | |
| background-color: #404040; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /*--------------- | |
| Positive | |
| ----------------*/ | |
| .ui.positive.buttons .button, | |
| .ui.positive.button { | |
| background-color: #84D767 !important; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.positive.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.positive.buttons .button:hover, | |
| .ui.positive.button:hover { | |
| background-color: #5DC438 !important; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.positive.buttons .button:focus, | |
| .ui.positive.button:focus { | |
| background-color: #63dc39 !important; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.positive.buttons .button:active, | |
| .ui.positive.button:active { | |
| background-color: #63cc3f !important; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.positive.buttons .active.button, | |
| .ui.positive.active.button, | |
| .ui.positive.buttons .active.button:active { | |
| background-color: #6fdb49; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /*--------------- | |
| Negative | |
| ----------------*/ | |
| .ui.negative.buttons .button, | |
| .ui.negative.button { | |
| background-color: #DB2828 !important; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)); | |
| } | |
| .ui.negative.button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.negative.buttons .button:hover, | |
| .ui.negative.button:hover { | |
| background-color: #d01919 !important; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.negative.buttons .button:focus, | |
| .ui.negative.button:focus { | |
| background-color: #ca1010 !important; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.negative.buttons .button:active, | |
| .ui.negative.button:active { | |
| background-color: #b21e1e !important; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.negative.buttons .active.button, | |
| .ui.negative.active.button, | |
| .ui.negative.buttons .active.button:active { | |
| background-color: #d41515; | |
| color: #FFFFFF; | |
| text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15); | |
| } | |
| /******************************* | |
| Groups | |
| *******************************/ | |
| .ui.buttons { | |
| display: -webkit-inline-box; | |
| display: -webkit-inline-flex; | |
| display: -ms-inline-flexbox; | |
| display: inline-flex; | |
| -webkit-box-orient: horizontal; | |
| -webkit-box-direction: normal; | |
| -webkit-flex-direction: row; | |
| -ms-flex-direction: row; | |
| flex-direction: row; | |
| font-size: 0em; | |
| vertical-align: baseline; | |
| margin: 0em 0.23076923rem 0em 0em; | |
| } | |
| .ui.buttons:not(.basic):not(.inverted) { | |
| box-shadow: none; | |
| } | |
| /* Clearfix */ | |
| .ui.buttons:after { | |
| content: "."; | |
| display: block; | |
| height: 0; | |
| clear: both; | |
| visibility: hidden; | |
| } | |
| /* Standard Group */ | |
| .ui.buttons .button { | |
| -webkit-box-flex: 1; | |
| -webkit-flex: 1 0 auto; | |
| -ms-flex: 1 0 auto; | |
| flex: 1 0 auto; | |
| margin: 0em; | |
| border-radius: 0em; | |
| margin: 0px 0px 0px 0px; | |
| } | |
| .ui.buttons > .ui.button:not(.basic):not(.inverted), | |
| .ui.buttons:not(.basic):not(.inverted) > .button { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset, 0px 0em 0px 0px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| .ui.buttons .button:first-child { | |
| border-left: none; | |
| margin-left: 0em; | |
| border-top-left-radius: 0.2307em; | |
| border-bottom-left-radius: 0.2307em; | |
| } | |
| .ui.buttons .button:last-child { | |
| border-top-right-radius: 0.2307em; | |
| border-bottom-right-radius: 0.2307em; | |
| } | |
| /* Vertical Style */ | |
| .ui.vertical.buttons { | |
| display: -webkit-inline-box; | |
| display: -webkit-inline-flex; | |
| display: -ms-inline-flexbox; | |
| display: inline-flex; | |
| -webkit-box-orient: vertical; | |
| -webkit-box-direction: normal; | |
| -webkit-flex-direction: column; | |
| -ms-flex-direction: column; | |
| flex-direction: column; | |
| } | |
| .ui.vertical.buttons .button { | |
| display: block; | |
| float: none; | |
| width: 100%; | |
| margin: 0px 0px 0px 0px; | |
| box-shadow: none; | |
| } | |
| .ui.vertical.buttons .button:first-child, | |
| .ui.vertical.buttons .mini.button:first-child, | |
| .ui.vertical.buttons .tiny.button:first-child, | |
| .ui.vertical.buttons .small.button:first-child, | |
| .ui.vertical.buttons .massive.button:first-child, | |
| .ui.vertical.buttons .huge.button:first-child { | |
| border-radius: 0.2307em 0.2307em 0px 0px; | |
| } | |
| .ui.vertical.buttons .button:last-child, | |
| .ui.vertical.buttons .mini.button:last-child, | |
| .ui.vertical.buttons .tiny.button:last-child, | |
| .ui.vertical.buttons .small.button:last-child, | |
| .ui.vertical.buttons .massive.button:last-child, | |
| .ui.vertical.buttons .huge.button:last-child, | |
| .ui.vertical.buttons .gigantic.button:last-child { | |
| margin-bottom: 0px; | |
| border-radius: 0px 0px 0.2307em 0.2307em; | |
| } | |
| /******************************* | |
| Overrides | |
| *******************************/ | |
| .ui.compact.icon.buttons .button, | |
| .ui.compact.icon.button { | |
| padding: 0.30769231em 0.76923077em 0.30769231em; | |
| } | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - Container | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Container | |
| *******************************/ | |
| /* All Sizes */ | |
| .ui.container { | |
| display: block; | |
| max-width: 100% !important; | |
| } | |
| /* Mobile */ | |
| @media only screen and (max-width: 1048px) { | |
| .ui.container { | |
| width: auto !important; | |
| margin-left: 1em !important; | |
| margin-right: 1em !important; | |
| } | |
| .ui.grid.container { | |
| width: auto !important; | |
| } | |
| .ui.relaxed.grid.container { | |
| width: auto !important; | |
| } | |
| .ui.very.relaxed.grid.container { | |
| width: auto !important; | |
| } | |
| } | |
| /* Tablet */ | |
| @media only screen and (min-width: 1049px) and (max-width: 1048px) { | |
| .ui.container { | |
| width: 1006px; | |
| margin-left: auto !important; | |
| margin-right: auto !important; | |
| } | |
| .ui.grid.container { | |
| width: calc( 1006px + 2rem ) !important; | |
| } | |
| .ui.relaxed.grid.container { | |
| width: calc( 1006px + 3rem ) !important; | |
| } | |
| .ui.very.relaxed.grid.container { | |
| width: calc( 1006px + 5rem ) !important; | |
| } | |
| } | |
| /* Small Monitor */ | |
| @media only screen and (min-width: 1049px) and (max-width: 1048px) { | |
| .ui.container { | |
| width: 993px; | |
| margin-left: auto !important; | |
| margin-right: auto !important; | |
| } | |
| .ui.grid.container { | |
| width: calc( 993px + 2rem ) !important; | |
| } | |
| .ui.relaxed.grid.container { | |
| width: calc( 993px + 3rem ) !important; | |
| } | |
| .ui.very.relaxed.grid.container { | |
| width: calc( 993px + 5rem ) !important; | |
| } | |
| } | |
| /* Large Monitor */ | |
| @media only screen and (min-width: 1049px) { | |
| .ui.container { | |
| width: 980px; | |
| margin-left: auto !important; | |
| margin-right: auto !important; | |
| } | |
| .ui.grid.container { | |
| width: calc( 980px + 2rem ) !important; | |
| } | |
| .ui.relaxed.grid.container { | |
| width: calc( 980px + 3rem ) !important; | |
| } | |
| .ui.very.relaxed.grid.container { | |
| width: calc( 980px + 5rem ) !important; | |
| } | |
| } | |
| /******************************* | |
| Types | |
| *******************************/ | |
| /* Text Container */ | |
| .ui.text.container { | |
| font-family: 'Arial', 'Helvetica Neue', Arial, Helvetica, sans-serif; | |
| max-width: 700px !important; | |
| line-height: 1.5; | |
| } | |
| .ui.text.container { | |
| font-size: 1.15384615rem; | |
| } | |
| /* Fluid */ | |
| .ui.fluid.container { | |
| width: 100%; | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| .ui[class*="left aligned"].container { | |
| text-align: left; | |
| } | |
| .ui[class*="center aligned"].container { | |
| text-align: center; | |
| } | |
| .ui[class*="right aligned"].container { | |
| text-align: right; | |
| } | |
| .ui.justified.container { | |
| text-align: justify; | |
| -webkit-hyphens: auto; | |
| -moz-hyphens: auto; | |
| -ms-hyphens: auto; | |
| hyphens: auto; | |
| } | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - Divider | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Divider | |
| *******************************/ | |
| .ui.divider { | |
| margin: 1rem 0rem; | |
| line-height: 1; | |
| height: 0em; | |
| font-weight: bold; | |
| text-transform: uppercase; | |
| letter-spacing: 0.05em; | |
| color: rgba(0, 0, 0, 0.85); | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| } | |
| /*-------------- | |
| Basic | |
| ---------------*/ | |
| .ui.divider:not(.vertical):not(.horizontal) { | |
| border-top: 1px solid rgba(34, 36, 38, 0.15); | |
| border-bottom: 1px solid rgba(255, 255, 255, 0.1); | |
| } | |
| /*-------------- | |
| Coupling | |
| ---------------*/ | |
| /* Allow divider between each column row */ | |
| .ui.grid > .column + .divider, | |
| .ui.grid > .row > .column + .divider { | |
| left: auto; | |
| } | |
| /*-------------- | |
| Horizontal | |
| ---------------*/ | |
| .ui.horizontal.divider { | |
| display: table; | |
| white-space: nowrap; | |
| height: auto; | |
| margin: ''; | |
| overflow: hidden; | |
| line-height: 1; | |
| text-align: center; | |
| } | |
| .ui.horizontal.divider:before, | |
| .ui.horizontal.divider:after { | |
| content: ''; | |
| display: table-cell; | |
| position: relative; | |
| top: 50%; | |
| width: 50%; | |
| background-repeat: no-repeat; | |
| } | |
| .ui.horizontal.divider:before { | |
| background-position: right 1em top 50%; | |
| } | |
| .ui.horizontal.divider:after { | |
| background-position: left 1em top 50%; | |
| } | |
| /*-------------- | |
| Vertical | |
| ---------------*/ | |
| .ui.vertical.divider { | |
| position: absolute; | |
| z-index: 2; | |
| top: 50%; | |
| left: 50%; | |
| margin: 0rem; | |
| padding: 0em; | |
| width: auto; | |
| height: 50%; | |
| line-height: 0em; | |
| text-align: center; | |
| -webkit-transform: translateX(-50%); | |
| transform: translateX(-50%); | |
| } | |
| .ui.vertical.divider:before, | |
| .ui.vertical.divider:after { | |
| position: absolute; | |
| left: 50%; | |
| content: ''; | |
| z-index: 3; | |
| border-left: 1px solid rgba(34, 36, 38, 0.15); | |
| border-right: 1px solid rgba(255, 255, 255, 0.1); | |
| width: 0%; | |
| height: calc(100% - 1rem ); | |
| } | |
| .ui.vertical.divider:before { | |
| top: -100%; | |
| } | |
| .ui.vertical.divider:after { | |
| top: auto; | |
| bottom: 0px; | |
| } | |
| /* Inside grid */ | |
| @media only screen and (max-width: 767px) { | |
| .ui.stackable.grid .ui.vertical.divider, | |
| .ui.grid .stackable.row .ui.vertical.divider { | |
| display: table; | |
| white-space: nowrap; | |
| height: auto; | |
| margin: ''; | |
| overflow: hidden; | |
| line-height: 1; | |
| text-align: center; | |
| position: static; | |
| top: 0; | |
| left: 0; | |
| -webkit-transform: none; | |
| transform: none; | |
| } | |
| .ui.stackable.grid .ui.vertical.divider:before, | |
| .ui.grid .stackable.row .ui.vertical.divider:before, | |
| .ui.stackable.grid .ui.vertical.divider:after, | |
| .ui.grid .stackable.row .ui.vertical.divider:after { | |
| position: static; | |
| left: 0; | |
| border-left: none; | |
| border-right: none; | |
| content: ''; | |
| display: table-cell; | |
| position: relative; | |
| top: 50%; | |
| width: 50%; | |
| background-repeat: no-repeat; | |
| } | |
| .ui.stackable.grid .ui.vertical.divider:before, | |
| .ui.grid .stackable.row .ui.vertical.divider:before { | |
| background-position: right 1em top 50%; | |
| } | |
| .ui.stackable.grid .ui.vertical.divider:after, | |
| .ui.grid .stackable.row .ui.vertical.divider:after { | |
| background-position: left 1em top 50%; | |
| } | |
| } | |
| /*-------------- | |
| Icon | |
| ---------------*/ | |
| .ui.divider > .icon { | |
| margin: 0rem; | |
| font-size: 1rem; | |
| height: 1em; | |
| vertical-align: middle; | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| /*-------------- | |
| Hidden | |
| ---------------*/ | |
| .ui.hidden.divider { | |
| border-color: transparent !important; | |
| } | |
| .ui.hidden.divider:before, | |
| .ui.hidden.divider:after { | |
| display: none; | |
| } | |
| /*-------------- | |
| Inverted | |
| ---------------*/ | |
| .ui.divider.inverted, | |
| .ui.vertical.inverted.divider, | |
| .ui.horizontal.inverted.divider { | |
| color: #FFFFFF; | |
| } | |
| .ui.divider.inverted, | |
| .ui.divider.inverted:after, | |
| .ui.divider.inverted:before { | |
| border-top-color: rgba(34, 36, 38, 0.15) !important; | |
| border-left-color: rgba(34, 36, 38, 0.15) !important; | |
| border-bottom-color: rgba(255, 255, 255, 0.15) !important; | |
| border-right-color: rgba(255, 255, 255, 0.15) !important; | |
| } | |
| /*-------------- | |
| Fitted | |
| ---------------*/ | |
| .ui.fitted.divider { | |
| margin: 0em; | |
| } | |
| /*-------------- | |
| Clearing | |
| ---------------*/ | |
| .ui.clearing.divider { | |
| clear: both; | |
| } | |
| /*-------------- | |
| Section | |
| ---------------*/ | |
| .ui.section.divider { | |
| margin-top: 2rem; | |
| margin-bottom: 2rem; | |
| } | |
| /*-------------- | |
| Sizes | |
| ---------------*/ | |
| .ui.divider { | |
| font-size: 1rem; | |
| } | |
| /******************************* | |
| Theme Overrides | |
| *******************************/ | |
| .ui.horizontal.divider:before, | |
| .ui.horizontal.divider:after { | |
| background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC'); | |
| } | |
| @media only screen and (max-width: 767px) { | |
| .ui.stackable.grid .ui.vertical.divider:before, | |
| .ui.grid .stackable.row .ui.vertical.divider:before, | |
| .ui.stackable.grid .ui.vertical.divider:after, | |
| .ui.grid .stackable.row .ui.vertical.divider:after { | |
| background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC'); | |
| } | |
| } | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - Dropdown | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Dropdown | |
| *******************************/ | |
| .ui.dropdown { | |
| cursor: pointer; | |
| position: relative; | |
| display: inline-block; | |
| outline: none; | |
| text-align: left; | |
| -webkit-transition: width 0.1s ease; | |
| transition: width 0.1s ease; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| } | |
| /******************************* | |
| Content | |
| *******************************/ | |
| /*-------------- | |
| Menu | |
| ---------------*/ | |
| .ui.dropdown .menu { | |
| cursor: auto; | |
| position: absolute; | |
| display: none; | |
| outline: none; | |
| top: 100%; | |
| min-width: -webkit-max-content; | |
| min-width: -moz-max-content; | |
| min-width: max-content; | |
| margin: 0em; | |
| padding: 0.38461538em 0px; | |
| background: #FFFFFF; | |
| font-size: 1em; | |
| text-shadow: none; | |
| text-align: left; | |
| box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.13); | |
| border: 1px solid rgba(0, 0, 0, 0.13); | |
| border-radius: 0.2307em; | |
| -webkit-transition: opacity 0.1s ease; | |
| transition: opacity 0.1s ease; | |
| z-index: 11; | |
| will-change: transform, opacity; | |
| } | |
| .ui.dropdown .menu > * { | |
| white-space: nowrap; | |
| } | |
| /*-------------- | |
| Hidden Input | |
| ---------------*/ | |
| .ui.dropdown > input:not(.search):first-child, | |
| .ui.dropdown > select { | |
| display: none !important; | |
| } | |
| /*-------------- | |
| Dropdown Icon | |
| ---------------*/ | |
| .ui.dropdown > .dropdown.icon { | |
| position: relative; | |
| width: auto; | |
| font-size: 0.92307692em; | |
| margin: 0em 0em 0em 2px; | |
| } | |
| .ui.dropdown .menu > .item .dropdown.icon { | |
| width: auto; | |
| float: right; | |
| margin: 0em 0em 0em 1em; | |
| } | |
| .ui.dropdown .menu > .item .dropdown.icon + .text { | |
| margin-right: 1em; | |
| } | |
| /*-------------- | |
| Text | |
| ---------------*/ | |
| .ui.dropdown > .text { | |
| display: inline-block; | |
| -webkit-transition: none; | |
| transition: none; | |
| } | |
| /*-------------- | |
| Menu Item | |
| ---------------*/ | |
| .ui.dropdown .menu > .item { | |
| position: relative; | |
| cursor: pointer; | |
| display: block; | |
| border: none; | |
| height: auto; | |
| text-align: left; | |
| border-top: none; | |
| line-height: 1em; | |
| color: rgba(0, 0, 0, 0.87); | |
| padding: 0.61538462em 1.07692308em !important; | |
| font-size: 1rem; | |
| text-transform: none; | |
| font-weight: normal; | |
| box-shadow: none; | |
| -webkit-touch-callout: none; | |
| } | |
| .ui.dropdown .menu > .item:first-child { | |
| border-top-width: 0px; | |
| } | |
| /*-------------- | |
| Floated Content | |
| ---------------*/ | |
| .ui.dropdown > .text > [class*="right floated"], | |
| .ui.dropdown .menu .item > [class*="right floated"] { | |
| float: right !important; | |
| margin-right: 0em !important; | |
| margin-left: 1em !important; | |
| } | |
| .ui.dropdown > .text > [class*="left floated"], | |
| .ui.dropdown .menu .item > [class*="left floated"] { | |
| float: left !important; | |
| margin-left: 0em !important; | |
| margin-right: 1em !important; | |
| } | |
| .ui.dropdown .menu .item > .icon.floated, | |
| .ui.dropdown .menu .item > .flag.floated, | |
| .ui.dropdown .menu .item > .image.floated, | |
| .ui.dropdown .menu .item > img.floated { | |
| margin-top: 0em; | |
| } | |
| /*-------------- | |
| Menu Divider | |
| ---------------*/ | |
| .ui.dropdown .menu > .header { | |
| margin: 0em; | |
| padding: 0.46153846em 1.07692308em; | |
| color: #767676; | |
| font-size: 0.92307692em; | |
| font-weight: normal; | |
| text-transform: none; | |
| } | |
| .ui.dropdown .menu > .divider { | |
| border-top: 1px solid rgba(0, 0, 0, 0.06); | |
| height: 0em; | |
| margin: 0.61538462em 0em; | |
| } | |
| .ui.dropdown .menu > .input { | |
| width: auto; | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| margin: 1.15384615rem 0.69230769rem; | |
| min-width: 10rem; | |
| } | |
| .ui.dropdown .menu > .header + .input { | |
| margin-top: 0em; | |
| } | |
| .ui.dropdown .menu > .input:not(.transparent) input { | |
| padding: 0.5em 1.07692308em; | |
| } | |
| .ui.dropdown .menu > .input:not(.transparent) .button, | |
| .ui.dropdown .menu > .input:not(.transparent) .icon, | |
| .ui.dropdown .menu > .input:not(.transparent) .label { | |
| padding-top: 0.5em; | |
| padding-bottom: 0.5em; | |
| } | |
| /*----------------- | |
| Item Description | |
| -------------------*/ | |
| .ui.dropdown > .text > .description, | |
| .ui.dropdown .menu > .item > .description { | |
| float: right; | |
| margin: 0em 0em 0em 1em; | |
| color: rgba(0, 0, 0, 0.4); | |
| } | |
| /*----------------- | |
| Message | |
| -------------------*/ | |
| .ui.dropdown .menu > .message { | |
| padding: 0.61538462em 1.07692308em; | |
| font-weight: normal; | |
| } | |
| .ui.dropdown .menu > .message:not(.ui) { | |
| color: rgba(0, 0, 0, 0.4); | |
| } | |
| /*-------------- | |
| Sub Menu | |
| ---------------*/ | |
| .ui.dropdown .menu .menu { | |
| top: 0% !important; | |
| left: 100% !important; | |
| right: auto !important; | |
| margin: 0em 0em 0em -0.5em !important; | |
| border-radius: 0.2307em !important; | |
| z-index: 21 !important; | |
| } | |
| /* Hide Arrow */ | |
| .ui.dropdown .menu .menu:after { | |
| display: none; | |
| } | |
| /*-------------- | |
| Sub Elements | |
| ---------------*/ | |
| /* Icons / Flags / Labels / Image */ | |
| .ui.dropdown > .text > .icon, | |
| .ui.dropdown > .text > .label, | |
| .ui.dropdown > .text > .flag, | |
| .ui.dropdown > .text > img, | |
| .ui.dropdown > .text > .image { | |
| margin-top: 0em; | |
| } | |
| .ui.dropdown .menu > .item > .icon, | |
| .ui.dropdown .menu > .item > .label, | |
| .ui.dropdown .menu > .item > .flag, | |
| .ui.dropdown .menu > .item > .image, | |
| .ui.dropdown .menu > .item > img { | |
| margin-top: 0em; | |
| } | |
| .ui.dropdown > .text > .icon, | |
| .ui.dropdown > .text > .label, | |
| .ui.dropdown > .text > .flag, | |
| .ui.dropdown > .text > img, | |
| .ui.dropdown > .text > .image, | |
| .ui.dropdown .menu > .item > .icon, | |
| .ui.dropdown .menu > .item > .label, | |
| .ui.dropdown .menu > .item > .flag, | |
| .ui.dropdown .menu > .item > .image, | |
| .ui.dropdown .menu > .item > img { | |
| margin-left: 0em; | |
| float: none; | |
| margin-right: 0.69230769rem; | |
| } | |
| /*-------------- | |
| Image | |
| ---------------*/ | |
| .ui.dropdown > .text > img, | |
| .ui.dropdown > .text > .image, | |
| .ui.dropdown .menu > .item > .image, | |
| .ui.dropdown .menu > .item > img { | |
| display: inline-block; | |
| vertical-align: middle; | |
| width: auto; | |
| max-height: 2em; | |
| } | |
| /******************************* | |
| Coupling | |
| *******************************/ | |
| /*-------------- | |
| Menu | |
| ---------------*/ | |
| /* Remove Menu Item Divider */ | |
| .ui.dropdown .ui.menu > .item:before, | |
| .ui.menu .ui.dropdown .menu > .item:before { | |
| display: none; | |
| } | |
| /* Prevent Menu Item Border */ | |
| .ui.menu .ui.dropdown .menu .active.item { | |
| border-left: none; | |
| } | |
| /* Automatically float dropdown menu right on last menu item */ | |
| .ui.menu .right.menu .dropdown:last-child .menu, | |
| .ui.menu .right.dropdown.item .menu, | |
| .ui.buttons > .ui.dropdown:last-child .menu { | |
| left: auto; | |
| right: 0em; | |
| } | |
| /*-------------- | |
| Label | |
| ---------------*/ | |
| /* Dropdown Menu */ | |
| .ui.label.dropdown .menu { | |
| min-width: 100%; | |
| } | |
| /*-------------- | |
| Button | |
| ---------------*/ | |
| /* No Margin On Icon Button */ | |
| .ui.dropdown.icon.button > .dropdown.icon { | |
| margin: 0em; | |
| } | |
| .ui.button.dropdown .menu { | |
| min-width: 100%; | |
| } | |
| /******************************* | |
| Types | |
| *******************************/ | |
| /*-------------- | |
| Selection | |
| ---------------*/ | |
| /* Displays like a select box */ | |
| .ui.selection.dropdown { | |
| cursor: pointer; | |
| word-wrap: break-word; | |
| line-height: 1em; | |
| white-space: normal; | |
| outline: 0; | |
| -webkit-transform: rotateZ(0deg); | |
| transform: rotateZ(0deg); | |
| min-width: 14em; | |
| min-height: 2.82958462em; | |
| background: #FFFFFF; | |
| display: inline-block; | |
| padding: 0.84615385em 2.67692308em 0.84615385em 1.07692308em; | |
| color: rgba(0, 0, 0, 0.87); | |
| box-shadow: none; | |
| border: 1px solid rgba(0, 0, 0, 0.13); | |
| border-radius: 0.2307em; | |
| -webkit-transition: width 0.1s ease; | |
| transition: width 0.1s ease; | |
| } | |
| .ui.selection.dropdown.visible, | |
| .ui.selection.dropdown.active { | |
| z-index: 10; | |
| } | |
| select.ui.dropdown { | |
| height: 38px; | |
| padding: 0.5em; | |
| border: 1px solid rgba(0, 0, 0, 0.13); | |
| visibility: visible; | |
| } | |
| .ui.selection.dropdown > .search.icon, | |
| .ui.selection.dropdown > .delete.icon, | |
| .ui.selection.dropdown > .dropdown.icon { | |
| cursor: pointer; | |
| position: absolute; | |
| top: auto; | |
| width: auto; | |
| z-index: 3; | |
| margin: -0.84615385em; | |
| padding: 0.84615385em; | |
| right: 1.07692308em; | |
| opacity: 0.8; | |
| -webkit-transition: opacity 0.1s ease; | |
| transition: opacity 0.1s ease; | |
| } | |
| /* Compact */ | |
| .ui.compact.selection.dropdown { | |
| min-width: 0px; | |
| } | |
| /* Selection Menu */ | |
| .ui.selection.dropdown .menu { | |
| overflow-x: hidden; | |
| overflow-y: auto; | |
| -webkit-backface-visibility: hidden; | |
| backface-visibility: hidden; | |
| -webkit-overflow-scrolling: touch; | |
| border-top-width: 0px !important; | |
| width: auto; | |
| outline: none; | |
| margin: 0px -1px; | |
| min-width: calc(100% + 2px ); | |
| width: calc(100% + 2px ); | |
| border-radius: 0em 0em 0.2307em 0.2307em; | |
| box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.13); | |
| -webkit-transition: opacity 0.1s ease; | |
| transition: opacity 0.1s ease; | |
| } | |
| .ui.selection.dropdown .menu:after, | |
| .ui.selection.dropdown .menu:before { | |
| display: none; | |
| } | |
| /*-------------- | |
| Message | |
| ---------------*/ | |
| .ui.selection.dropdown .menu > .message { | |
| padding: 0.61538462em 1.07692308em; | |
| } | |
| @media only screen and (max-width: 1048px) { | |
| .ui.selection.dropdown .menu { | |
| max-height: 6.99230769em; | |
| } | |
| } | |
| @media only screen and (min-width: 1049px) { | |
| .ui.selection.dropdown .menu { | |
| max-height: 9.32307692em; | |
| } | |
| } | |
| @media only screen and (min-width: 1049px) { | |
| .ui.selection.dropdown .menu { | |
| max-height: 13.98461538em; | |
| } | |
| } | |
| @media only screen and (min-width: 1920px) { | |
| .ui.selection.dropdown .menu { | |
| max-height: 18.64615385em; | |
| } | |
| } | |
| /* Menu Item */ | |
| .ui.selection.dropdown .menu > .item { | |
| border-top: 1px solid #FAFAFA; | |
| padding: 0.61538462em 1.07692308em !important; | |
| white-space: normal; | |
| word-wrap: normal; | |
| } | |
| /* Hover */ | |
| .ui.selection.dropdown:hover { | |
| border-color: #51A7E8; | |
| box-shadow: none; | |
| } | |
| /* Active */ | |
| .ui.selection.active.dropdown { | |
| border-color: #96C8DA; | |
| box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.13); | |
| } | |
| .ui.selection.active.dropdown .menu { | |
| border-color: #96C8DA; | |
| box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.13); | |
| } | |
| /* Focus */ | |
| .ui.selection.dropdown:focus { | |
| border-color: #96C8DA; | |
| box-shadow: none; | |
| } | |
| .ui.selection.dropdown:focus .menu { | |
| border-color: #96C8DA; | |
| box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.13); | |
| } | |
| /* Visible */ | |
| .ui.selection.visible.dropdown > .text:not(.default) { | |
| font-weight: normal; | |
| color: rgba(0, 0, 0, 0.8); | |
| } | |
| /* Visible Hover */ | |
| .ui.selection.active.dropdown:hover { | |
| border-color: #96C8DA; | |
| box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.13); | |
| } | |
| .ui.selection.active.dropdown:hover .menu { | |
| border-color: #96C8DA; | |
| box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.13); | |
| } | |
| /* Dropdown Icon */ | |
| .ui.active.selection.dropdown > .dropdown.icon, | |
| .ui.visible.selection.dropdown > .dropdown.icon { | |
| opacity: 1; | |
| z-index: 3; | |
| } | |
| /* Connecting Border */ | |
| .ui.active.selection.dropdown { | |
| border-bottom-left-radius: 0em !important; | |
| border-bottom-right-radius: 0em !important; | |
| } | |
| /*-------------- | |
| Searchable | |
| ---------------*/ | |
| /* Search Selection */ | |
| .ui.search.dropdown { | |
| min-width: ''; | |
| } | |
| /* Search Dropdown */ | |
| .ui.search.dropdown > input.search { | |
| background: none transparent !important; | |
| border: none !important; | |
| box-shadow: none !important; | |
| cursor: pointer; | |
| top: 0em; | |
| left: 0em; | |
| width: 100%; | |
| outline: none; | |
| -webkit-tap-highlight-color: rgba(255, 255, 255, 0); | |
| padding: inherit; | |
| } | |
| /* Text Layering */ | |
| .ui.search.dropdown > input.search { | |
| position: absolute; | |
| z-index: 2; | |
| } | |
| .ui.search.dropdown > .text { | |
| cursor: text; | |
| position: relative; | |
| z-index: 3; | |
| } | |
| /* Search Selection */ | |
| .ui.search.selection.dropdown > input.search { | |
| line-height: 1.2142em; | |
| padding: 0.73905385em 2.67692308em 0.73905385em 1.07692308em; | |
| } | |
| /* Active/Visible Search */ | |
| .ui.search.dropdown.active > input.search, | |
| .ui.search.dropdown.visible > input.search { | |
| cursor: auto; | |
| } | |
| .ui.search.dropdown.active > .text, | |
| .ui.search.dropdown.visible > .text { | |
| pointer-events: none; | |
| } | |
| /* Filtered Text */ | |
| .ui.active.search.dropdown input.search:focus + .text .icon, | |
| .ui.active.search.dropdown input.search:focus + .text .flag { | |
| opacity: 0.6; | |
| } | |
| .ui.active.search.dropdown input.search:focus + .text { | |
| color: rgba(0, 0, 0, 0.4) !important; | |
| } | |
| /* Search Menu */ | |
| .ui.search.dropdown .menu { | |
| overflow-x: hidden; | |
| overflow-y: auto; | |
| -webkit-backface-visibility: hidden; | |
| backface-visibility: hidden; | |
| -webkit-overflow-scrolling: touch; | |
| } | |
| @media only screen and (max-width: 1048px) { | |
| .ui.search.dropdown .menu { | |
| max-height: 6.99230769em; | |
| } | |
| } | |
| @media only screen and (min-width: 1049px) { | |
| .ui.search.dropdown .menu { | |
| max-height: 9.32307692em; | |
| } | |
| } | |
| @media only screen and (min-width: 1049px) { | |
| .ui.search.dropdown .menu { | |
| max-height: 13.98461538em; | |
| } | |
| } | |
| @media only screen and (min-width: 1920px) { | |
| .ui.search.dropdown .menu { | |
| max-height: 18.64615385em; | |
| } | |
| } | |
| /*-------------- | |
| Multiple | |
| ---------------*/ | |
| /* Multiple Selection */ | |
| .ui.multiple.dropdown { | |
| padding: 0.24635128em 2.67692308em 0.24635128em 0.38461538em; | |
| } | |
| .ui.multiple.dropdown .menu { | |
| cursor: auto; | |
| } | |
| /* Multiple Search Selection */ | |
| .ui.multiple.search.dropdown, | |
| .ui.multiple.search.dropdown > input.search { | |
| cursor: text; | |
| } | |
| /* Selection Label */ | |
| .ui.multiple.dropdown > .label { | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; | |
| display: inline-block; | |
| vertical-align: top; | |
| white-space: normal; | |
| font-size: 1em; | |
| padding: 0.38461538em 0.69230769em; | |
| margin: 0.23076923em 0.30769231rem 0.23076923em 0em; | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.13) inset; | |
| } | |
| /* Dropdown Icon */ | |
| .ui.multiple.dropdown .dropdown.icon { | |
| margin: 0em -0.69230769em 0em 0em; | |
| padding: 0.5em; | |
| } | |
| /* Text */ | |
| .ui.multiple.dropdown > .text { | |
| position: static; | |
| padding: 0; | |
| max-width: 100%; | |
| margin: 0.49270256em 0em 0.49270256em 0.69230769em; | |
| line-height: 1.2142em; | |
| } | |
| .ui.multiple.dropdown > .label ~ .text { | |
| display: none; | |
| } | |
| /*----------------- | |
| Multiple Search | |
| -----------------*/ | |
| /* Prompt Text */ | |
| .ui.multiple.search.dropdown > .text { | |
| display: inline-block; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| padding: inherit; | |
| margin: 0.49270256em 0em 0.49270256em 0.69230769em; | |
| line-height: 1.2142em; | |
| } | |
| .ui.multiple.search.dropdown > .label ~ .text { | |
| display: none; | |
| } | |
| /* Search */ | |
| .ui.multiple.search.dropdown > input.search { | |
| position: static; | |
| padding: 0; | |
| max-width: 100%; | |
| margin: 0.49270256em 0em 0.49270256em 0.69230769em; | |
| width: 2.2em; | |
| line-height: 1.2142em; | |
| } | |
| /*-------------- | |
| Inline | |
| ---------------*/ | |
| .ui.inline.dropdown { | |
| cursor: pointer; | |
| display: inline-block; | |
| color: inherit; | |
| } | |
| .ui.inline.dropdown .dropdown.icon { | |
| margin: 0em 0.5em 0em 0.25em; | |
| vertical-align: baseline; | |
| } | |
| .ui.inline.dropdown > .text { | |
| font-weight: bold; | |
| } | |
| .ui.inline.dropdown .menu { | |
| cursor: auto; | |
| margin-top: 0.25em; | |
| border-radius: 0.2307em; | |
| } | |
| /******************************* | |
| States | |
| *******************************/ | |
| /*-------------------- | |
| Active | |
| ----------------------*/ | |
| /* Menu Item Active */ | |
| .ui.dropdown .menu .active.item { | |
| background: transparent; | |
| font-weight: bold; | |
| color: rgba(0, 0, 0, 0.95); | |
| box-shadow: none; | |
| z-index: 12; | |
| } | |
| /*-------------------- | |
| Hover | |
| ----------------------*/ | |
| /* Menu Item Hover */ | |
| .ui.dropdown .menu > .item:hover { | |
| background: #4078C0; | |
| color: #FFFFFF; | |
| z-index: 13; | |
| } | |
| /*-------------------- | |
| Loading | |
| ---------------------*/ | |
| /* Positioning */ | |
| .ui.loading.dropdown > i.icon:before, | |
| .ui.loading.dropdown > i.icon:after { | |
| left: 30% !important; | |
| } | |
| .ui.loading.dropdown > i.icon { | |
| top: 50% !important; | |
| } | |
| .ui.multiple.loading.dropdown > i.icon:before, | |
| .ui.multiple.loading.dropdown > i.icon:after { | |
| top: 0% !important; | |
| left: 0% !important; | |
| } | |
| .ui.loading.dropdown > i.icon:before { | |
| position: absolute; | |
| content: ''; | |
| top: 50%; | |
| left: 50%; | |
| margin: -0.69230769em 0em 0em -0.69230769em; | |
| width: 1.38461538em; | |
| height: 1.38461538em; | |
| border-radius: 500rem; | |
| border: 0.2em solid rgba(0, 0, 0, 0.1); | |
| } | |
| .ui.loading.dropdown > i.icon:after { | |
| position: absolute; | |
| content: ''; | |
| top: 50%; | |
| left: 50%; | |
| box-shadow: 0px 0px 0px 1px transparent; | |
| margin: -0.69230769em 0em 0em -0.69230769em; | |
| width: 1.38461538em; | |
| height: 1.38461538em; | |
| -webkit-animation: dropdown-spin 0.6s linear; | |
| animation: dropdown-spin 0.6s linear; | |
| -webkit-animation-iteration-count: infinite; | |
| animation-iteration-count: infinite; | |
| border-radius: 500rem; | |
| border-color: #767676 transparent transparent; | |
| border-style: solid; | |
| border-width: 0.2em; | |
| } | |
| /* Coupling */ | |
| .ui.loading.dropdown.button > i.icon:before, | |
| .ui.loading.dropdown.button > i.icon:after { | |
| display: none; | |
| } | |
| @-webkit-keyframes dropdown-spin { | |
| from { | |
| -webkit-transform: rotate(0deg); | |
| transform: rotate(0deg); | |
| } | |
| to { | |
| -webkit-transform: rotate(360deg); | |
| transform: rotate(360deg); | |
| } | |
| } | |
| @keyframes dropdown-spin { | |
| from { | |
| -webkit-transform: rotate(0deg); | |
| transform: rotate(0deg); | |
| } | |
| to { | |
| -webkit-transform: rotate(360deg); | |
| transform: rotate(360deg); | |
| } | |
| } | |
| /*-------------------- | |
| Default Text | |
| ----------------------*/ | |
| .ui.dropdown > .default.text, | |
| .ui.default.dropdown > .text { | |
| color: rgba(179, 179, 179, 0.7); | |
| } | |
| .ui.dropdown:hover > .default.text, | |
| .ui.default.dropdown:hover > .text { | |
| color: rgba(179, 179, 179, 0.7); | |
| } | |
| /*-------------------- | |
| Loading | |
| ----------------------*/ | |
| .ui.loading.dropdown > .text { | |
| -webkit-transition: none; | |
| transition: none; | |
| } | |
| /* Used To Check Position */ | |
| .ui.dropdown .loading.menu { | |
| display: block; | |
| visibility: hidden; | |
| z-index: -1; | |
| } | |
| /*-------------------- | |
| Keyboard Select | |
| ----------------------*/ | |
| /* Selected Item */ | |
| .ui.dropdown.selected, | |
| .ui.dropdown .menu .selected.item { | |
| background: rgba(0, 0, 0, 0.03); | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| /*-------------------- | |
| Search Filtered | |
| ----------------------*/ | |
| /* Filtered Item */ | |
| .ui.dropdown > .filtered.text { | |
| visibility: hidden; | |
| } | |
| .ui.dropdown .filtered.item { | |
| display: none !important; | |
| } | |
| /*-------------------- | |
| Error | |
| ----------------------*/ | |
| .ui.dropdown.error, | |
| .ui.dropdown.error > .text, | |
| .ui.dropdown.error > .default.text { | |
| color: #991111; | |
| } | |
| .ui.selection.dropdown.error { | |
| background: #FFF6F6; | |
| border-color: #E0B4B4; | |
| } | |
| .ui.selection.dropdown.error:hover { | |
| border-color: #E0B4B4; | |
| } | |
| .ui.dropdown.error > .menu, | |
| .ui.dropdown.error > .menu .menu { | |
| border-color: #E0B4B4; | |
| } | |
| .ui.dropdown.error > .menu > .item { | |
| color: #991111; | |
| } | |
| .ui.multiple.selection.error.dropdown > .label { | |
| border-color: #E0B4B4; | |
| } | |
| /* Item Hover */ | |
| .ui.dropdown.error > .menu > .item:hover { | |
| background-color: #FFF2F2; | |
| } | |
| /* Item Active */ | |
| .ui.dropdown.error > .menu .active.item { | |
| background-color: #FDCFCF; | |
| } | |
| /*-------------------- | |
| Disabled | |
| ----------------------*/ | |
| /* Disabled */ | |
| .ui.disabled.dropdown, | |
| .ui.dropdown .menu > .disabled.item { | |
| cursor: default; | |
| pointer-events: none; | |
| opacity: 0.6; | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| /*-------------- | |
| Direction | |
| ---------------*/ | |
| /* Flyout Direction */ | |
| .ui.dropdown .menu { | |
| left: 0px; | |
| } | |
| /* Default Side (Right) */ | |
| .ui.dropdown .right.menu > .menu, | |
| .ui.dropdown .menu .right.menu { | |
| left: 100% !important; | |
| right: auto !important; | |
| border-radius: 0.2307em !important; | |
| } | |
| /* Left Flyout Menu */ | |
| .ui.dropdown > .left.menu .menu, | |
| .ui.dropdown .menu .left.menu { | |
| left: auto !important; | |
| right: 100% !important; | |
| border-radius: 0.2307em !important; | |
| } | |
| .ui.dropdown .item .left.dropdown.icon, | |
| .ui.dropdown .left.menu .item .dropdown.icon { | |
| width: auto; | |
| float: left; | |
| margin: 0em 0.69230769rem 0em 0em; | |
| } | |
| .ui.dropdown .item .left.dropdown.icon, | |
| .ui.dropdown .left.menu .item .dropdown.icon { | |
| width: auto; | |
| float: left; | |
| margin: 0em 0.69230769rem 0em 0em; | |
| } | |
| .ui.dropdown .item .left.dropdown.icon + .text, | |
| .ui.dropdown .left.menu .item .dropdown.icon + .text { | |
| margin-left: 1em; | |
| } | |
| /*-------------- | |
| Upward | |
| ---------------*/ | |
| /* Upward Main Menu */ | |
| .ui.upward.dropdown > .menu { | |
| top: auto; | |
| bottom: 100%; | |
| box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.08); | |
| border-radius: 0.2307em 0.2307em 0em 0em; | |
| } | |
| /* Upward Sub Menu */ | |
| .ui.dropdown .upward.menu { | |
| top: auto !important; | |
| bottom: 0 !important; | |
| } | |
| /* Active Upward */ | |
| .ui.simple.upward.active.dropdown, | |
| .ui.simple.upward.dropdown:hover { | |
| border-radius: 0.2307em 0.2307em 0em 0em !important; | |
| } | |
| .ui.upward.dropdown.button:not(.pointing):not(.floating).active { | |
| border-radius: 0.2307em 0.2307em 0em 0em; | |
| } | |
| /* Selection */ | |
| .ui.upward.selection.dropdown .menu { | |
| border-top-width: 1px !important; | |
| border-bottom-width: 0px !important; | |
| box-shadow: 0px -2px 3px 0px rgba(0, 0, 0, 0.08); | |
| } | |
| .ui.upward.selection.dropdown:hover { | |
| box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.05); | |
| } | |
| /* Active Upward */ | |
| .ui.active.upward.selection.dropdown { | |
| border-radius: 0em 0em 0.2307em 0.2307em !important; | |
| } | |
| /* Visible Upward */ | |
| .ui.upward.selection.dropdown.visible { | |
| box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.08); | |
| border-radius: 0em 0em 0.2307em 0.2307em !important; | |
| } | |
| /* Visible Hover Upward */ | |
| .ui.upward.active.selection.dropdown:hover { | |
| box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.05); | |
| } | |
| .ui.upward.active.selection.dropdown:hover .menu { | |
| box-shadow: 0px -2px 3px 0px rgba(0, 0, 0, 0.08); | |
| } | |
| /*-------------- | |
| Simple | |
| ---------------*/ | |
| /* Selection Menu */ | |
| .ui.scrolling.dropdown .menu, | |
| .ui.dropdown .scrolling.menu { | |
| overflow-x: hidden; | |
| overflow-y: auto; | |
| } | |
| .ui.scrolling.dropdown .menu { | |
| overflow-x: hidden; | |
| overflow-y: auto; | |
| -webkit-backface-visibility: hidden; | |
| backface-visibility: hidden; | |
| -webkit-overflow-scrolling: touch; | |
| min-width: 100% !important; | |
| width: auto !important; | |
| } | |
| .ui.dropdown .scrolling.menu { | |
| position: static; | |
| overflow-y: auto; | |
| border: none; | |
| box-shadow: none !important; | |
| border-radius: 0 !important; | |
| margin: 0 !important; | |
| min-width: 100% !important; | |
| width: auto !important; | |
| border-top: 1px solid rgba(0, 0, 0, 0.13); | |
| } | |
| .ui.scrolling.dropdown .menu .item.item.item, | |
| .ui.dropdown .scrolling.menu > .item.item.item { | |
| border-top: none; | |
| padding-right: calc( 1.07692308em + 17px ) !important; | |
| } | |
| .ui.scrolling.dropdown .menu .item:first-child, | |
| .ui.dropdown .scrolling.menu .item:first-child { | |
| border-top: none; | |
| } | |
| .ui.dropdown > .animating.menu .scrolling.menu, | |
| .ui.dropdown > .visible.menu .scrolling.menu { | |
| display: block; | |
| } | |
| /* Scrollbar in IE */ | |
| @media all and (-ms-high-contrast: none) { | |
| .ui.scrolling.dropdown .menu, | |
| .ui.dropdown .scrolling.menu { | |
| min-width: calc(100% - 17px ); | |
| } | |
| } | |
| @media only screen and (max-width: 1048px) { | |
| .ui.scrolling.dropdown .menu, | |
| .ui.dropdown .scrolling.menu { | |
| max-height: 8.92307692em; | |
| } | |
| } | |
| @media only screen and (min-width: 1049px) { | |
| .ui.scrolling.dropdown .menu, | |
| .ui.dropdown .scrolling.menu { | |
| max-height: 13.38461538em; | |
| } | |
| } | |
| @media only screen and (min-width: 1049px) { | |
| .ui.scrolling.dropdown .menu, | |
| .ui.dropdown .scrolling.menu { | |
| max-height: 17.84615385em; | |
| } | |
| } | |
| @media only screen and (min-width: 1920px) { | |
| .ui.scrolling.dropdown .menu, | |
| .ui.dropdown .scrolling.menu { | |
| max-height: 17.84615385em; | |
| } | |
| } | |
| /*-------------- | |
| Simple | |
| ---------------*/ | |
| /* Displays without javascript */ | |
| .ui.simple.dropdown .menu:before, | |
| .ui.simple.dropdown .menu:after { | |
| display: none; | |
| } | |
| .ui.simple.dropdown .menu { | |
| position: absolute; | |
| display: block; | |
| overflow: hidden; | |
| top: -9999px !important; | |
| opacity: 0; | |
| width: 0; | |
| height: 0; | |
| -webkit-transition: opacity 0.1s ease; | |
| transition: opacity 0.1s ease; | |
| } | |
| .ui.simple.active.dropdown, | |
| .ui.simple.dropdown:hover { | |
| border-bottom-left-radius: 0em !important; | |
| border-bottom-right-radius: 0em !important; | |
| } | |
| .ui.simple.active.dropdown > .menu, | |
| .ui.simple.dropdown:hover > .menu { | |
| overflow: visible; | |
| width: auto; | |
| height: auto; | |
| top: 100% !important; | |
| opacity: 1; | |
| } | |
| .ui.simple.dropdown > .menu > .item:active > .menu, | |
| .ui.simple.dropdown:hover > .menu > .item:hover > .menu { | |
| overflow: visible; | |
| width: auto; | |
| height: auto; | |
| top: 0% !important; | |
| left: 100% !important; | |
| opacity: 1; | |
| } | |
| .ui.simple.disabled.dropdown:hover .menu { | |
| display: none; | |
| height: 0px; | |
| width: 0px; | |
| overflow: hidden; | |
| } | |
| /* Visible */ | |
| .ui.simple.visible.dropdown > .menu { | |
| display: block; | |
| } | |
| /*-------------- | |
| Fluid | |
| ---------------*/ | |
| .ui.fluid.dropdown { | |
| display: block; | |
| width: 100%; | |
| min-width: 0em; | |
| } | |
| .ui.fluid.dropdown > .dropdown.icon { | |
| float: right; | |
| } | |
| /*-------------- | |
| Floating | |
| ---------------*/ | |
| .ui.floating.dropdown .menu { | |
| left: 0; | |
| right: auto; | |
| box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.08) !important; | |
| border-radius: 0.2307em !important; | |
| } | |
| .ui.floating.dropdown > .menu { | |
| margin-top: 0.5em !important; | |
| border-radius: 0.2307em !important; | |
| } | |
| /*-------------- | |
| Pointing | |
| ---------------*/ | |
| .ui.pointing.dropdown > .menu { | |
| top: 100%; | |
| margin-top: 0.69230769rem; | |
| border-radius: 0.2307em; | |
| } | |
| .ui.pointing.dropdown > .menu:after { | |
| display: block; | |
| position: absolute; | |
| pointer-events: none; | |
| content: ''; | |
| visibility: visible; | |
| -webkit-transform: rotate(45deg); | |
| transform: rotate(45deg); | |
| width: 0.69230769em; | |
| height: 0.69230769em; | |
| box-shadow: -1px -1px 0px 1px rgba(0, 0, 0, 0.13); | |
| background: #FFFFFF; | |
| z-index: 2; | |
| } | |
| .ui.pointing.dropdown > .menu:after { | |
| top: -0.34615385em; | |
| left: 50%; | |
| margin: 0em 0em 0em -0.34615385em; | |
| } | |
| /* Top Left Pointing */ | |
| .ui.top.left.pointing.dropdown > .menu { | |
| top: 100%; | |
| bottom: auto; | |
| left: 0%; | |
| right: auto; | |
| margin: 1em 0em 0em; | |
| } | |
| .ui.top.left.pointing.dropdown > .menu { | |
| top: 100%; | |
| bottom: auto; | |
| left: 0%; | |
| right: auto; | |
| margin: 1em 0em 0em; | |
| } | |
| .ui.top.left.pointing.dropdown > .menu:after { | |
| top: -0.34615385em; | |
| left: 1em; | |
| right: auto; | |
| margin: 0em; | |
| -webkit-transform: rotate(45deg); | |
| transform: rotate(45deg); | |
| } | |
| /* Top Right Pointing */ | |
| .ui.top.right.pointing.dropdown > .menu { | |
| top: 100%; | |
| bottom: auto; | |
| right: 0%; | |
| left: auto; | |
| margin: 1em 0em 0em; | |
| } | |
| .ui.top.right.pointing.dropdown > .menu:after { | |
| top: -0.34615385em; | |
| left: auto; | |
| right: 1em; | |
| margin: 0em; | |
| -webkit-transform: rotate(45deg); | |
| transform: rotate(45deg); | |
| } | |
| /* Left Pointing */ | |
| .ui.left.pointing.dropdown > .menu { | |
| top: 0%; | |
| left: 100%; | |
| right: auto; | |
| margin: 0em 0em 0em 1em; | |
| } | |
| .ui.left.pointing.dropdown > .menu:after { | |
| top: 1em; | |
| left: -0.34615385em; | |
| margin: 0em 0em 0em 0em; | |
| -webkit-transform: rotate(-45deg); | |
| transform: rotate(-45deg); | |
| } | |
| /* Right Pointing */ | |
| .ui.right.pointing.dropdown > .menu { | |
| top: 0%; | |
| left: auto; | |
| right: 100%; | |
| margin: 0em 1em 0em 0em; | |
| } | |
| .ui.right.pointing.dropdown > .menu:after { | |
| top: 1em; | |
| left: auto; | |
| right: -0.34615385em; | |
| margin: 0em 0em 0em 0em; | |
| -webkit-transform: rotate(135deg); | |
| transform: rotate(135deg); | |
| } | |
| /* Bottom Pointing */ | |
| .ui.bottom.pointing.dropdown > .menu { | |
| top: auto; | |
| bottom: 100%; | |
| left: 0%; | |
| right: auto; | |
| margin: 0em 0em 1em; | |
| } | |
| .ui.bottom.pointing.dropdown > .menu:after { | |
| top: auto; | |
| bottom: -0.34615385em; | |
| right: auto; | |
| margin: 0em; | |
| -webkit-transform: rotate(-135deg); | |
| transform: rotate(-135deg); | |
| } | |
| /* Reverse Sub-Menu Direction */ | |
| .ui.bottom.pointing.dropdown > .menu .menu { | |
| top: auto !important; | |
| bottom: 0px !important; | |
| } | |
| /* Bottom Left */ | |
| .ui.bottom.left.pointing.dropdown > .menu { | |
| left: 0%; | |
| right: auto; | |
| } | |
| .ui.bottom.left.pointing.dropdown > .menu:after { | |
| left: 1em; | |
| right: auto; | |
| } | |
| /* Bottom Right */ | |
| .ui.bottom.right.pointing.dropdown > .menu { | |
| right: 0%; | |
| left: auto; | |
| } | |
| .ui.bottom.right.pointing.dropdown > .menu:after { | |
| left: auto; | |
| right: 1em; | |
| } | |
| /* Upward pointing */ | |
| .ui.upward.pointing.dropdown > .menu, | |
| .ui.upward.top.pointing.dropdown > .menu { | |
| top: auto; | |
| bottom: 100%; | |
| margin: 0em 0em 0.69230769rem; | |
| border-radius: 0.2307em; | |
| } | |
| .ui.upward.pointing.dropdown > .menu:after, | |
| .ui.upward.top.pointing.dropdown > .menu:after { | |
| top: 100%; | |
| bottom: auto; | |
| box-shadow: 1px 1px 0px 1px rgba(0, 0, 0, 0.13); | |
| margin: -0.34615385em 0em 0em; | |
| } | |
| /******************************* | |
| User Overrides | |
| *******************************/ | |
| /* Smaller Icon */ | |
| .ui.dropdown > .dropdown.icon { | |
| font-size: 12px; | |
| } | |
| /* Dropdown Carets */ | |
| @font-face { | |
| font-family: 'Dropdown'; | |
| src: url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMggjB5AAAAC8AAAAYGNtYXAPfuIIAAABHAAAAExnYXNwAAAAEAAAAWgAAAAIZ2x5Zjo82LgAAAFwAAABVGhlYWQAQ88bAAACxAAAADZoaGVhAwcB6QAAAvwAAAAkaG10eAS4ABIAAAMgAAAAIGxvY2EBNgDeAAADQAAAABJtYXhwAAoAFgAAA1QAAAAgbmFtZVcZpu4AAAN0AAABRXBvc3QAAwAAAAAEvAAAACAAAwIAAZAABQAAAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADw2gHg/+D/4AHgACAAAAABAAAAAAAAAAAAAAAgAAAAAAACAAAAAwAAABQAAwABAAAAFAAEADgAAAAKAAgAAgACAAEAIPDa//3//wAAAAAAIPDX//3//wAB/+MPLQADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAIABJQElABMAABM0NzY3BTYXFhUUDwEGJwYvASY1AAUGBwEACAUGBoAFCAcGgAUBEgcGBQEBAQcECQYHfwYBAQZ/BwYAAQAAAG4BJQESABMAADc0PwE2MzIfARYVFAcGIyEiJyY1AAWABgcIBYAGBgUI/wAHBgWABwaABQWABgcHBgUFBgcAAAABABIASQC3AW4AEwAANzQ/ATYXNhcWHQEUBwYnBi8BJjUSBoAFCAcFBgYFBwgFgAbbBwZ/BwEBBwQJ/wgEBwEBB38GBgAAAAABAAAASQClAW4AEwAANxE0NzYzMh8BFhUUDwEGIyInJjUABQYHCAWABgaABQgHBgVbAQAIBQYGgAUIBwWABgYFBwAAAAEAAAABAADZuaKOXw889QALAgAAAAAA0ABHWAAAAADQAEdYAAAAAAElAW4AAAAIAAIAAAAAAAAAAQAAAeD/4AAAAgAAAAAAASUAAQAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAABAAAAASUAAAElAAAAtwASALcAAAAAAAAACgAUAB4AQgBkAIgAqgAAAAEAAAAIABQAAQAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQAOAAAAAQAAAAAAAgAOAEcAAQAAAAAAAwAOACQAAQAAAAAABAAOAFUAAQAAAAAABQAWAA4AAQAAAAAABgAHADIAAQAAAAAACgA0AGMAAwABBAkAAQAOAAAAAwABBAkAAgAOAEcAAwABBAkAAwAOACQAAwABBAkABAAOAFUAAwABBAkABQAWAA4AAwABBAkABgAOADkAAwABBAkACgA0AGMAaQBjAG8AbQBvAG8AbgBWAGUAcgBzAGkAbwBuACAAMQAuADAAaQBjAG8AbQBvAG8Abmljb21vb24AaQBjAG8AbQBvAG8AbgBSAGUAZwB1AGwAYQByAGkAYwBvAG0AbwBvAG4ARgBvAG4AdAAgAGcAZQBuAGUAcgBhAHQAZQBkACAAYgB5ACAASQBjAG8ATQBvAG8AbgAuAAAAAAMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=) format('truetype'), url(data:application/font-woff;charset=utf-8;base64,d09GRk9UVE8AAAVwAAoAAAAABSgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAAA9AAAAdkAAAHZLDXE/09TLzIAAALQAAAAYAAAAGAIIweQY21hcAAAAzAAAABMAAAATA9+4ghnYXNwAAADfAAAAAgAAAAIAAAAEGhlYWQAAAOEAAAANgAAADYAQ88baGhlYQAAA7wAAAAkAAAAJAMHAelobXR4AAAD4AAAACAAAAAgBLgAEm1heHAAAAQAAAAABgAAAAYACFAAbmFtZQAABAgAAAFFAAABRVcZpu5wb3N0AAAFUAAAACAAAAAgAAMAAAEABAQAAQEBCGljb21vb24AAQIAAQA6+BwC+BsD+BgEHgoAGVP/i4seCgAZU/+LiwwHi2v4lPh0BR0AAACIDx0AAACNER0AAAAJHQAAAdASAAkBAQgPERMWGyAlKmljb21vb25pY29tb29udTB1MXUyMHVGMEQ3dUYwRDh1RjBEOXVGMERBAAACAYkABgAIAgABAAQABwAKAA0AVgCfAOgBL/yUDvyUDvyUDvuUDvtvi/emFYuQjZCOjo+Pj42Qiwj3lIsFkIuQiY6Hj4iNhouGi4aJh4eHCPsU+xQFiIiGiYaLhouHjYeOCPsU9xQFiI+Jj4uQCA77b4v3FBWLkI2Pjo8I9xT3FAWPjo+NkIuQi5CJjogI9xT7FAWPh42Hi4aLhomHh4eIiIaJhosI+5SLBYaLh42HjoiPiY+LkAgO+92d928Vi5CNkI+OCPcU9xQFjo+QjZCLkIuPiY6Hj4iNhouGCIv7lAWLhomHh4iIh4eJhouGi4aNiI8I+xT3FAWHjomPi5AIDvvdi+YVi/eUBYuQjZCOjo+Pj42Qi5CLkImOhwj3FPsUBY+IjYaLhouGiYeHiAj7FPsUBYiHhomGi4aLh42Hj4iOiY+LkAgO+JQU+JQViwwKAAAAAAMCAAGQAAUAAAFMAWYAAABHAUwBZgAAAPUAGQCEAAAAAAAAAAAAAAAAAAAAARAAAAAAAAAAAAAAAAAAAAAAQAAA8NoB4P/g/+AB4AAgAAAAAQAAAAAAAAAAAAAAIAAAAAAAAgAAAAMAAAAUAAMAAQAAABQABAA4AAAACgAIAAIAAgABACDw2v/9//8AAAAAACDw1//9//8AAf/jDy0AAwABAAAAAAAAAAAAAAABAAH//wAPAAEAAAABAAA5emozXw889QALAgAAAAAA0ABHWAAAAADQAEdYAAAAAAElAW4AAAAIAAIAAAAAAAAAAQAAAeD/4AAAAgAAAAAAASUAAQAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAABAAAAASUAAAElAAAAtwASALcAAAAAUAAACAAAAAAADgCuAAEAAAAAAAEADgAAAAEAAAAAAAIADgBHAAEAAAAAAAMADgAkAAEAAAAAAAQADgBVAAEAAAAAAAUAFgAOAAEAAAAAAAYABwAyAAEAAAAAAAoANABjAAMAAQQJAAEADgAAAAMAAQQJAAIADgBHAAMAAQQJAAMADgAkAAMAAQQJAAQADgBVAAMAAQQJAAUAFgAOAAMAAQQJAAYADgA5AAMAAQQJAAoANABjAGkAYwBvAG0AbwBvAG4AVgBlAHIAcwBpAG8AbgAgADEALgAwAGkAYwBvAG0AbwBvAG5pY29tb29uAGkAYwBvAG0AbwBvAG4AUgBlAGcAdQBsAGEAcgBpAGMAbwBtAG8AbwBuAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('woff'); | |
| font-weight: normal; | |
| font-style: normal; | |
| } | |
| .ui.dropdown > .dropdown.icon { | |
| font-family: 'Dropdown'; | |
| line-height: 1; | |
| height: 1em; | |
| width: 1.23em; | |
| -webkit-backface-visibility: hidden; | |
| backface-visibility: hidden; | |
| font-weight: normal; | |
| font-style: normal; | |
| text-align: center; | |
| } | |
| .ui.dropdown > .dropdown.icon { | |
| width: auto; | |
| } | |
| .ui.dropdown > .dropdown.icon:before { | |
| content: '\f0d7'; | |
| } | |
| /* Sub Menu */ | |
| .ui.dropdown .menu .item .dropdown.icon:before { | |
| content: '\f0da' /*rtl:'\f0d9'*/; | |
| } | |
| .ui.dropdown .item .left.dropdown.icon:before, | |
| .ui.dropdown .left.menu .item .dropdown.icon:before { | |
| content: "\f0d9" /*rtl:"\f0da"*/; | |
| } | |
| /* Vertical Menu Dropdown */ | |
| .ui.vertical.menu .dropdown.item > .dropdown.icon:before { | |
| content: "\f0da" /*rtl:"\f0d9"*/; | |
| } | |
| /******************************* | |
| User Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - Grid | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Standard | |
| *******************************/ | |
| .ui.grid { | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| -webkit-box-orient: horizontal; | |
| -webkit-box-direction: normal; | |
| -webkit-flex-direction: row; | |
| -ms-flex-direction: row; | |
| flex-direction: row; | |
| -webkit-flex-wrap: wrap; | |
| -ms-flex-wrap: wrap; | |
| flex-wrap: wrap; | |
| -webkit-box-align: stretch; | |
| -webkit-align-items: stretch; | |
| -ms-flex-align: stretch; | |
| align-items: stretch; | |
| padding: 0em; | |
| } | |
| /*---------------------- | |
| Remove Gutters | |
| -----------------------*/ | |
| .ui.grid { | |
| margin-top: -1rem; | |
| margin-bottom: -1rem; | |
| margin-left: -1rem; | |
| margin-right: -1rem; | |
| } | |
| .ui.relaxed.grid { | |
| margin-left: -1.5rem; | |
| margin-right: -1.5rem; | |
| } | |
| .ui[class*="very relaxed"].grid { | |
| margin-left: -2.5rem; | |
| margin-right: -2.5rem; | |
| } | |
| /* Preserve Rows Spacing on Consecutive Grids */ | |
| .ui.grid + .grid { | |
| margin-top: 1rem; | |
| } | |
| /*------------------- | |
| Columns | |
| --------------------*/ | |
| /* Standard 16 column */ | |
| .ui.grid > .column:not(.row), | |
| .ui.grid > .row > .column { | |
| position: relative; | |
| display: inline-block; | |
| width: 6.25%; | |
| padding-left: 1rem; | |
| padding-right: 1rem; | |
| vertical-align: top; | |
| } | |
| .ui.grid > * { | |
| padding-left: 1rem; | |
| padding-right: 1rem; | |
| } | |
| /*------------------- | |
| Rows | |
| --------------------*/ | |
| .ui.grid > .row { | |
| position: relative; | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| -webkit-box-orient: horizontal; | |
| -webkit-box-direction: normal; | |
| -webkit-flex-direction: row; | |
| -ms-flex-direction: row; | |
| flex-direction: row; | |
| -webkit-flex-wrap: wrap; | |
| -ms-flex-wrap: wrap; | |
| flex-wrap: wrap; | |
| -webkit-box-pack: inherit; | |
| -webkit-justify-content: inherit; | |
| -ms-flex-pack: inherit; | |
| justify-content: inherit; | |
| -webkit-box-align: stretch; | |
| -webkit-align-items: stretch; | |
| -ms-flex-align: stretch; | |
| align-items: stretch; | |
| width: 100% !important; | |
| padding: 0rem; | |
| padding-top: 1rem; | |
| padding-bottom: 1rem; | |
| } | |
| /*------------------- | |
| Columns | |
| --------------------*/ | |
| /* Vertical padding when no rows */ | |
| .ui.grid > .column:not(.row) { | |
| padding-top: 1rem; | |
| padding-bottom: 1rem; | |
| } | |
| .ui.grid > .row > .column { | |
| margin-top: 0em; | |
| margin-bottom: 0em; | |
| } | |
| /*------------------- | |
| Content | |
| --------------------*/ | |
| .ui.grid > .row > img, | |
| .ui.grid > .row > .column > img { | |
| max-width: 100%; | |
| } | |
| /*------------------- | |
| Loose Coupling | |
| --------------------*/ | |
| /* Collapse Margin on Consecutive Grid */ | |
| .ui.grid > .ui.grid:first-child { | |
| margin-top: 0em; | |
| } | |
| .ui.grid > .ui.grid:last-child { | |
| margin-bottom: 0em; | |
| } | |
| /* Segment inside Aligned Grid */ | |
| .ui.grid .aligned.row > .column > .segment:not(.compact):not(.attached), | |
| .ui.aligned.grid .column > .segment:not(.compact):not(.attached) { | |
| width: 100%; | |
| } | |
| /* Align Dividers with Gutter */ | |
| .ui.grid .row + .ui.divider { | |
| -webkit-box-flex: 1; | |
| -webkit-flex-grow: 1; | |
| -ms-flex-positive: 1; | |
| flex-grow: 1; | |
| margin: 1rem 1rem; | |
| } | |
| .ui.grid .column + .ui.vertical.divider { | |
| height: calc(50% - 1rem ); | |
| } | |
| /* Remove Border on Last Horizontal Segment */ | |
| .ui.grid > .row > .column:last-child > .horizontal.segment, | |
| .ui.grid > .column:last-child > .horizontal.segment { | |
| box-shadow: none; | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| /*----------------------- | |
| Page Grid | |
| -------------------------*/ | |
| @media only screen and (max-width: 767px) { | |
| .ui.page.grid { | |
| width: auto; | |
| padding-left: 0em; | |
| padding-right: 0em; | |
| margin-left: 0em; | |
| margin-right: 0em; | |
| } | |
| } | |
| @media only screen and (min-width: 768px) and (max-width: 991px) { | |
| .ui.page.grid { | |
| width: auto; | |
| margin-left: 0em; | |
| margin-right: 0em; | |
| padding-left: 2em; | |
| padding-right: 2em; | |
| } | |
| } | |
| @media only screen and (min-width: 992px) and (max-width: 1199px) { | |
| .ui.page.grid { | |
| width: auto; | |
| margin-left: 0em; | |
| margin-right: 0em; | |
| padding-left: 3%; | |
| padding-right: 3%; | |
| } | |
| } | |
| @media only screen and (min-width: 1200px) and (max-width: 1919px) { | |
| .ui.page.grid { | |
| width: auto; | |
| margin-left: 0em; | |
| margin-right: 0em; | |
| padding-left: 15%; | |
| padding-right: 15%; | |
| } | |
| } | |
| @media only screen and (min-width: 1920px) { | |
| .ui.page.grid { | |
| width: auto; | |
| margin-left: 0em; | |
| margin-right: 0em; | |
| padding-left: 23%; | |
| padding-right: 23%; | |
| } | |
| } | |
| /*------------------- | |
| Column Count | |
| --------------------*/ | |
| /* Assume full width with one column */ | |
| .ui.grid > .column:only-child, | |
| .ui.grid > .row > .column:only-child { | |
| width: 100%; | |
| } | |
| /* Grid Based */ | |
| .ui[class*="one column"].grid > .row > .column, | |
| .ui[class*="one column"].grid > .column:not(.row) { | |
| width: 100%; | |
| } | |
| .ui[class*="two column"].grid > .row > .column, | |
| .ui[class*="two column"].grid > .column:not(.row) { | |
| width: 50%; | |
| } | |
| .ui[class*="three column"].grid > .row > .column, | |
| .ui[class*="three column"].grid > .column:not(.row) { | |
| width: 33.33333333%; | |
| } | |
| .ui[class*="four column"].grid > .row > .column, | |
| .ui[class*="four column"].grid > .column:not(.row) { | |
| width: 25%; | |
| } | |
| .ui[class*="five column"].grid > .row > .column, | |
| .ui[class*="five column"].grid > .column:not(.row) { | |
| width: 20%; | |
| } | |
| .ui[class*="six column"].grid > .row > .column, | |
| .ui[class*="six column"].grid > .column:not(.row) { | |
| width: 16.66666667%; | |
| } | |
| .ui[class*="seven column"].grid > .row > .column, | |
| .ui[class*="seven column"].grid > .column:not(.row) { | |
| width: 14.28571429%; | |
| } | |
| .ui[class*="eight column"].grid > .row > .column, | |
| .ui[class*="eight column"].grid > .column:not(.row) { | |
| width: 12.5%; | |
| } | |
| .ui[class*="nine column"].grid > .row > .column, | |
| .ui[class*="nine column"].grid > .column:not(.row) { | |
| width: 11.11111111%; | |
| } | |
| .ui[class*="ten column"].grid > .row > .column, | |
| .ui[class*="ten column"].grid > .column:not(.row) { | |
| width: 10%; | |
| } | |
| .ui[class*="eleven column"].grid > .row > .column, | |
| .ui[class*="eleven column"].grid > .column:not(.row) { | |
| width: 9.09090909%; | |
| } | |
| .ui[class*="twelve column"].grid > .row > .column, | |
| .ui[class*="twelve column"].grid > .column:not(.row) { | |
| width: 8.33333333%; | |
| } | |
| .ui[class*="thirteen column"].grid > .row > .column, | |
| .ui[class*="thirteen column"].grid > .column:not(.row) { | |
| width: 7.69230769%; | |
| } | |
| .ui[class*="fourteen column"].grid > .row > .column, | |
| .ui[class*="fourteen column"].grid > .column:not(.row) { | |
| width: 7.14285714%; | |
| } | |
| .ui[class*="fifteen column"].grid > .row > .column, | |
| .ui[class*="fifteen column"].grid > .column:not(.row) { | |
| width: 6.66666667%; | |
| } | |
| .ui[class*="sixteen column"].grid > .row > .column, | |
| .ui[class*="sixteen column"].grid > .column:not(.row) { | |
| width: 6.25%; | |
| } | |
| /* Row Based Overrides */ | |
| .ui.grid > [class*="one column"].row > .column { | |
| width: 100% !important; | |
| } | |
| .ui.grid > [class*="two column"].row > .column { | |
| width: 50% !important; | |
| } | |
| .ui.grid > [class*="three column"].row > .column { | |
| width: 33.33333333% !important; | |
| } | |
| .ui.grid > [class*="four column"].row > .column { | |
| width: 25% !important; | |
| } | |
| .ui.grid > [class*="five column"].row > .column { | |
| width: 20% !important; | |
| } | |
| .ui.grid > [class*="six column"].row > .column { | |
| width: 16.66666667% !important; | |
| } | |
| .ui.grid > [class*="seven column"].row > .column { | |
| width: 14.28571429% !important; | |
| } | |
| .ui.grid > [class*="eight column"].row > .column { | |
| width: 12.5% !important; | |
| } | |
| .ui.grid > [class*="nine column"].row > .column { | |
| width: 11.11111111% !important; | |
| } | |
| .ui.grid > [class*="ten column"].row > .column { | |
| width: 10% !important; | |
| } | |
| .ui.grid > [class*="eleven column"].row > .column { | |
| width: 9.09090909% !important; | |
| } | |
| .ui.grid > [class*="twelve column"].row > .column { | |
| width: 8.33333333% !important; | |
| } | |
| .ui.grid > [class*="thirteen column"].row > .column { | |
| width: 7.69230769% !important; | |
| } | |
| .ui.grid > [class*="fourteen column"].row > .column { | |
| width: 7.14285714% !important; | |
| } | |
| .ui.grid > [class*="fifteen column"].row > .column { | |
| width: 6.66666667% !important; | |
| } | |
| .ui.grid > [class*="sixteen column"].row > .column { | |
| width: 6.25% !important; | |
| } | |
| /* Celled Page */ | |
| .ui.celled.page.grid { | |
| box-shadow: none; | |
| } | |
| /*------------------- | |
| Column Width | |
| --------------------*/ | |
| /* Sizing Combinations */ | |
| .ui.grid > .row > [class*="one wide"].column, | |
| .ui.grid > .column.row > [class*="one wide"].column, | |
| .ui.grid > [class*="one wide"].column, | |
| .ui.column.grid > [class*="one wide"].column { | |
| width: 6.25% !important; | |
| } | |
| .ui.grid > .row > [class*="two wide"].column, | |
| .ui.grid > .column.row > [class*="two wide"].column, | |
| .ui.grid > [class*="two wide"].column, | |
| .ui.column.grid > [class*="two wide"].column { | |
| width: 12.5% !important; | |
| } | |
| .ui.grid > .row > [class*="three wide"].column, | |
| .ui.grid > .column.row > [class*="three wide"].column, | |
| .ui.grid > [class*="three wide"].column, | |
| .ui.column.grid > [class*="three wide"].column { | |
| width: 18.75% !important; | |
| } | |
| .ui.grid > .row > [class*="four wide"].column, | |
| .ui.grid > .column.row > [class*="four wide"].column, | |
| .ui.grid > [class*="four wide"].column, | |
| .ui.column.grid > [class*="four wide"].column { | |
| width: 25% !important; | |
| } | |
| .ui.grid > .row > [class*="five wide"].column, | |
| .ui.grid > .column.row > [class*="five wide"].column, | |
| .ui.grid > [class*="five wide"].column, | |
| .ui.column.grid > [class*="five wide"].column { | |
| width: 31.25% !important; | |
| } | |
| .ui.grid > .row > [class*="six wide"].column, | |
| .ui.grid > .column.row > [class*="six wide"].column, | |
| .ui.grid > [class*="six wide"].column, | |
| .ui.column.grid > [class*="six wide"].column { | |
| width: 37.5% !important; | |
| } | |
| .ui.grid > .row > [class*="seven wide"].column, | |
| .ui.grid > .column.row > [class*="seven wide"].column, | |
| .ui.grid > [class*="seven wide"].column, | |
| .ui.column.grid > [class*="seven wide"].column { | |
| width: 43.75% !important; | |
| } | |
| .ui.grid > .row > [class*="eight wide"].column, | |
| .ui.grid > .column.row > [class*="eight wide"].column, | |
| .ui.grid > [class*="eight wide"].column, | |
| .ui.column.grid > [class*="eight wide"].column { | |
| width: 50% !important; | |
| } | |
| .ui.grid > .row > [class*="nine wide"].column, | |
| .ui.grid > .column.row > [class*="nine wide"].column, | |
| .ui.grid > [class*="nine wide"].column, | |
| .ui.column.grid > [class*="nine wide"].column { | |
| width: 56.25% !important; | |
| } | |
| .ui.grid > .row > [class*="ten wide"].column, | |
| .ui.grid > .column.row > [class*="ten wide"].column, | |
| .ui.grid > [class*="ten wide"].column, | |
| .ui.column.grid > [class*="ten wide"].column { | |
| width: 62.5% !important; | |
| } | |
| .ui.grid > .row > [class*="eleven wide"].column, | |
| .ui.grid > .column.row > [class*="eleven wide"].column, | |
| .ui.grid > [class*="eleven wide"].column, | |
| .ui.column.grid > [class*="eleven wide"].column { | |
| width: 68.75% !important; | |
| } | |
| .ui.grid > .row > [class*="twelve wide"].column, | |
| .ui.grid > .column.row > [class*="twelve wide"].column, | |
| .ui.grid > [class*="twelve wide"].column, | |
| .ui.column.grid > [class*="twelve wide"].column { | |
| width: 75% !important; | |
| } | |
| .ui.grid > .row > [class*="thirteen wide"].column, | |
| .ui.grid > .column.row > [class*="thirteen wide"].column, | |
| .ui.grid > [class*="thirteen wide"].column, | |
| .ui.column.grid > [class*="thirteen wide"].column { | |
| width: 81.25% !important; | |
| } | |
| .ui.grid > .row > [class*="fourteen wide"].column, | |
| .ui.grid > .column.row > [class*="fourteen wide"].column, | |
| .ui.grid > [class*="fourteen wide"].column, | |
| .ui.column.grid > [class*="fourteen wide"].column { | |
| width: 87.5% !important; | |
| } | |
| .ui.grid > .row > [class*="fifteen wide"].column, | |
| .ui.grid > .column.row > [class*="fifteen wide"].column, | |
| .ui.grid > [class*="fifteen wide"].column, | |
| .ui.column.grid > [class*="fifteen wide"].column { | |
| width: 93.75% !important; | |
| } | |
| .ui.grid > .row > [class*="sixteen wide"].column, | |
| .ui.grid > .column.row > [class*="sixteen wide"].column, | |
| .ui.grid > [class*="sixteen wide"].column, | |
| .ui.column.grid > [class*="sixteen wide"].column { | |
| width: 100% !important; | |
| } | |
| /*---------------------- | |
| Width per Device | |
| -----------------------*/ | |
| /* Mobile Sizing Combinations */ | |
| @media only screen and (min-width: 320px) and (max-width: 767px) { | |
| .ui.grid > .row > [class*="one wide mobile"].column, | |
| .ui.grid > .column.row > [class*="one wide mobile"].column, | |
| .ui.grid > [class*="one wide mobile"].column, | |
| .ui.column.grid > [class*="one wide mobile"].column { | |
| width: 6.25% !important; | |
| } | |
| .ui.grid > .row > [class*="two wide mobile"].column, | |
| .ui.grid > .column.row > [class*="two wide mobile"].column, | |
| .ui.grid > [class*="two wide mobile"].column, | |
| .ui.column.grid > [class*="two wide mobile"].column { | |
| width: 12.5% !important; | |
| } | |
| .ui.grid > .row > [class*="three wide mobile"].column, | |
| .ui.grid > .column.row > [class*="three wide mobile"].column, | |
| .ui.grid > [class*="three wide mobile"].column, | |
| .ui.column.grid > [class*="three wide mobile"].column { | |
| width: 18.75% !important; | |
| } | |
| .ui.grid > .row > [class*="four wide mobile"].column, | |
| .ui.grid > .column.row > [class*="four wide mobile"].column, | |
| .ui.grid > [class*="four wide mobile"].column, | |
| .ui.column.grid > [class*="four wide mobile"].column { | |
| width: 25% !important; | |
| } | |
| .ui.grid > .row > [class*="five wide mobile"].column, | |
| .ui.grid > .column.row > [class*="five wide mobile"].column, | |
| .ui.grid > [class*="five wide mobile"].column, | |
| .ui.column.grid > [class*="five wide mobile"].column { | |
| width: 31.25% !important; | |
| } | |
| .ui.grid > .row > [class*="six wide mobile"].column, | |
| .ui.grid > .column.row > [class*="six wide mobile"].column, | |
| .ui.grid > [class*="six wide mobile"].column, | |
| .ui.column.grid > [class*="six wide mobile"].column { | |
| width: 37.5% !important; | |
| } | |
| .ui.grid > .row > [class*="seven wide mobile"].column, | |
| .ui.grid > .column.row > [class*="seven wide mobile"].column, | |
| .ui.grid > [class*="seven wide mobile"].column, | |
| .ui.column.grid > [class*="seven wide mobile"].column { | |
| width: 43.75% !important; | |
| } | |
| .ui.grid > .row > [class*="eight wide mobile"].column, | |
| .ui.grid > .column.row > [class*="eight wide mobile"].column, | |
| .ui.grid > [class*="eight wide mobile"].column, | |
| .ui.column.grid > [class*="eight wide mobile"].column { | |
| width: 50% !important; | |
| } | |
| .ui.grid > .row > [class*="nine wide mobile"].column, | |
| .ui.grid > .column.row > [class*="nine wide mobile"].column, | |
| .ui.grid > [class*="nine wide mobile"].column, | |
| .ui.column.grid > [class*="nine wide mobile"].column { | |
| width: 56.25% !important; | |
| } | |
| .ui.grid > .row > [class*="ten wide mobile"].column, | |
| .ui.grid > .column.row > [class*="ten wide mobile"].column, | |
| .ui.grid > [class*="ten wide mobile"].column, | |
| .ui.column.grid > [class*="ten wide mobile"].column { | |
| width: 62.5% !important; | |
| } | |
| .ui.grid > .row > [class*="eleven wide mobile"].column, | |
| .ui.grid > .column.row > [class*="eleven wide mobile"].column, | |
| .ui.grid > [class*="eleven wide mobile"].column, | |
| .ui.column.grid > [class*="eleven wide mobile"].column { | |
| width: 68.75% !important; | |
| } | |
| .ui.grid > .row > [class*="twelve wide mobile"].column, | |
| .ui.grid > .column.row > [class*="twelve wide mobile"].column, | |
| .ui.grid > [class*="twelve wide mobile"].column, | |
| .ui.column.grid > [class*="twelve wide mobile"].column { | |
| width: 75% !important; | |
| } | |
| .ui.grid > .row > [class*="thirteen wide mobile"].column, | |
| .ui.grid > .column.row > [class*="thirteen wide mobile"].column, | |
| .ui.grid > [class*="thirteen wide mobile"].column, | |
| .ui.column.grid > [class*="thirteen wide mobile"].column { | |
| width: 81.25% !important; | |
| } | |
| .ui.grid > .row > [class*="fourteen wide mobile"].column, | |
| .ui.grid > .column.row > [class*="fourteen wide mobile"].column, | |
| .ui.grid > [class*="fourteen wide mobile"].column, | |
| .ui.column.grid > [class*="fourteen wide mobile"].column { | |
| width: 87.5% !important; | |
| } | |
| .ui.grid > .row > [class*="fifteen wide mobile"].column, | |
| .ui.grid > .column.row > [class*="fifteen wide mobile"].column, | |
| .ui.grid > [class*="fifteen wide mobile"].column, | |
| .ui.column.grid > [class*="fifteen wide mobile"].column { | |
| width: 93.75% !important; | |
| } | |
| .ui.grid > .row > [class*="sixteen wide mobile"].column, | |
| .ui.grid > .column.row > [class*="sixteen wide mobile"].column, | |
| .ui.grid > [class*="sixteen wide mobile"].column, | |
| .ui.column.grid > [class*="sixteen wide mobile"].column { | |
| width: 100% !important; | |
| } | |
| } | |
| /* Tablet Sizing Combinations */ | |
| @media only screen and (min-width: 768px) and (max-width: 991px) { | |
| .ui.grid > .row > [class*="one wide tablet"].column, | |
| .ui.grid > .column.row > [class*="one wide tablet"].column, | |
| .ui.grid > [class*="one wide tablet"].column, | |
| .ui.column.grid > [class*="one wide tablet"].column { | |
| width: 6.25% !important; | |
| } | |
| .ui.grid > .row > [class*="two wide tablet"].column, | |
| .ui.grid > .column.row > [class*="two wide tablet"].column, | |
| .ui.grid > [class*="two wide tablet"].column, | |
| .ui.column.grid > [class*="two wide tablet"].column { | |
| width: 12.5% !important; | |
| } | |
| .ui.grid > .row > [class*="three wide tablet"].column, | |
| .ui.grid > .column.row > [class*="three wide tablet"].column, | |
| .ui.grid > [class*="three wide tablet"].column, | |
| .ui.column.grid > [class*="three wide tablet"].column { | |
| width: 18.75% !important; | |
| } | |
| .ui.grid > .row > [class*="four wide tablet"].column, | |
| .ui.grid > .column.row > [class*="four wide tablet"].column, | |
| .ui.grid > [class*="four wide tablet"].column, | |
| .ui.column.grid > [class*="four wide tablet"].column { | |
| width: 25% !important; | |
| } | |
| .ui.grid > .row > [class*="five wide tablet"].column, | |
| .ui.grid > .column.row > [class*="five wide tablet"].column, | |
| .ui.grid > [class*="five wide tablet"].column, | |
| .ui.column.grid > [class*="five wide tablet"].column { | |
| width: 31.25% !important; | |
| } | |
| .ui.grid > .row > [class*="six wide tablet"].column, | |
| .ui.grid > .column.row > [class*="six wide tablet"].column, | |
| .ui.grid > [class*="six wide tablet"].column, | |
| .ui.column.grid > [class*="six wide tablet"].column { | |
| width: 37.5% !important; | |
| } | |
| .ui.grid > .row > [class*="seven wide tablet"].column, | |
| .ui.grid > .column.row > [class*="seven wide tablet"].column, | |
| .ui.grid > [class*="seven wide tablet"].column, | |
| .ui.column.grid > [class*="seven wide tablet"].column { | |
| width: 43.75% !important; | |
| } | |
| .ui.grid > .row > [class*="eight wide tablet"].column, | |
| .ui.grid > .column.row > [class*="eight wide tablet"].column, | |
| .ui.grid > [class*="eight wide tablet"].column, | |
| .ui.column.grid > [class*="eight wide tablet"].column { | |
| width: 50% !important; | |
| } | |
| .ui.grid > .row > [class*="nine wide tablet"].column, | |
| .ui.grid > .column.row > [class*="nine wide tablet"].column, | |
| .ui.grid > [class*="nine wide tablet"].column, | |
| .ui.column.grid > [class*="nine wide tablet"].column { | |
| width: 56.25% !important; | |
| } | |
| .ui.grid > .row > [class*="ten wide tablet"].column, | |
| .ui.grid > .column.row > [class*="ten wide tablet"].column, | |
| .ui.grid > [class*="ten wide tablet"].column, | |
| .ui.column.grid > [class*="ten wide tablet"].column { | |
| width: 62.5% !important; | |
| } | |
| .ui.grid > .row > [class*="eleven wide tablet"].column, | |
| .ui.grid > .column.row > [class*="eleven wide tablet"].column, | |
| .ui.grid > [class*="eleven wide tablet"].column, | |
| .ui.column.grid > [class*="eleven wide tablet"].column { | |
| width: 68.75% !important; | |
| } | |
| .ui.grid > .row > [class*="twelve wide tablet"].column, | |
| .ui.grid > .column.row > [class*="twelve wide tablet"].column, | |
| .ui.grid > [class*="twelve wide tablet"].column, | |
| .ui.column.grid > [class*="twelve wide tablet"].column { | |
| width: 75% !important; | |
| } | |
| .ui.grid > .row > [class*="thirteen wide tablet"].column, | |
| .ui.grid > .column.row > [class*="thirteen wide tablet"].column, | |
| .ui.grid > [class*="thirteen wide tablet"].column, | |
| .ui.column.grid > [class*="thirteen wide tablet"].column { | |
| width: 81.25% !important; | |
| } | |
| .ui.grid > .row > [class*="fourteen wide tablet"].column, | |
| .ui.grid > .column.row > [class*="fourteen wide tablet"].column, | |
| .ui.grid > [class*="fourteen wide tablet"].column, | |
| .ui.column.grid > [class*="fourteen wide tablet"].column { | |
| width: 87.5% !important; | |
| } | |
| .ui.grid > .row > [class*="fifteen wide tablet"].column, | |
| .ui.grid > .column.row > [class*="fifteen wide tablet"].column, | |
| .ui.grid > [class*="fifteen wide tablet"].column, | |
| .ui.column.grid > [class*="fifteen wide tablet"].column { | |
| width: 93.75% !important; | |
| } | |
| .ui.grid > .row > [class*="sixteen wide tablet"].column, | |
| .ui.grid > .column.row > [class*="sixteen wide tablet"].column, | |
| .ui.grid > [class*="sixteen wide tablet"].column, | |
| .ui.column.grid > [class*="sixteen wide tablet"].column { | |
| width: 100% !important; | |
| } | |
| } | |
| /* Computer/Desktop Sizing Combinations */ | |
| @media only screen and (min-width: 992px) { | |
| .ui.grid > .row > [class*="one wide computer"].column, | |
| .ui.grid > .column.row > [class*="one wide computer"].column, | |
| .ui.grid > [class*="one wide computer"].column, | |
| .ui.column.grid > [class*="one wide computer"].column { | |
| width: 6.25% !important; | |
| } | |
| .ui.grid > .row > [class*="two wide computer"].column, | |
| .ui.grid > .column.row > [class*="two wide computer"].column, | |
| .ui.grid > [class*="two wide computer"].column, | |
| .ui.column.grid > [class*="two wide computer"].column { | |
| width: 12.5% !important; | |
| } | |
| .ui.grid > .row > [class*="three wide computer"].column, | |
| .ui.grid > .column.row > [class*="three wide computer"].column, | |
| .ui.grid > [class*="three wide computer"].column, | |
| .ui.column.grid > [class*="three wide computer"].column { | |
| width: 18.75% !important; | |
| } | |
| .ui.grid > .row > [class*="four wide computer"].column, | |
| .ui.grid > .column.row > [class*="four wide computer"].column, | |
| .ui.grid > [class*="four wide computer"].column, | |
| .ui.column.grid > [class*="four wide computer"].column { | |
| width: 25% !important; | |
| } | |
| .ui.grid > .row > [class*="five wide computer"].column, | |
| .ui.grid > .column.row > [class*="five wide computer"].column, | |
| .ui.grid > [class*="five wide computer"].column, | |
| .ui.column.grid > [class*="five wide computer"].column { | |
| width: 31.25% !important; | |
| } | |
| .ui.grid > .row > [class*="six wide computer"].column, | |
| .ui.grid > .column.row > [class*="six wide computer"].column, | |
| .ui.grid > [class*="six wide computer"].column, | |
| .ui.column.grid > [class*="six wide computer"].column { | |
| width: 37.5% !important; | |
| } | |
| .ui.grid > .row > [class*="seven wide computer"].column, | |
| .ui.grid > .column.row > [class*="seven wide computer"].column, | |
| .ui.grid > [class*="seven wide computer"].column, | |
| .ui.column.grid > [class*="seven wide computer"].column { | |
| width: 43.75% !important; | |
| } | |
| .ui.grid > .row > [class*="eight wide computer"].column, | |
| .ui.grid > .column.row > [class*="eight wide computer"].column, | |
| .ui.grid > [class*="eight wide computer"].column, | |
| .ui.column.grid > [class*="eight wide computer"].column { | |
| width: 50% !important; | |
| } | |
| .ui.grid > .row > [class*="nine wide computer"].column, | |
| .ui.grid > .column.row > [class*="nine wide computer"].column, | |
| .ui.grid > [class*="nine wide computer"].column, | |
| .ui.column.grid > [class*="nine wide computer"].column { | |
| width: 56.25% !important; | |
| } | |
| .ui.grid > .row > [class*="ten wide computer"].column, | |
| .ui.grid > .column.row > [class*="ten wide computer"].column, | |
| .ui.grid > [class*="ten wide computer"].column, | |
| .ui.column.grid > [class*="ten wide computer"].column { | |
| width: 62.5% !important; | |
| } | |
| .ui.grid > .row > [class*="eleven wide computer"].column, | |
| .ui.grid > .column.row > [class*="eleven wide computer"].column, | |
| .ui.grid > [class*="eleven wide computer"].column, | |
| .ui.column.grid > [class*="eleven wide computer"].column { | |
| width: 68.75% !important; | |
| } | |
| .ui.grid > .row > [class*="twelve wide computer"].column, | |
| .ui.grid > .column.row > [class*="twelve wide computer"].column, | |
| .ui.grid > [class*="twelve wide computer"].column, | |
| .ui.column.grid > [class*="twelve wide computer"].column { | |
| width: 75% !important; | |
| } | |
| .ui.grid > .row > [class*="thirteen wide computer"].column, | |
| .ui.grid > .column.row > [class*="thirteen wide computer"].column, | |
| .ui.grid > [class*="thirteen wide computer"].column, | |
| .ui.column.grid > [class*="thirteen wide computer"].column { | |
| width: 81.25% !important; | |
| } | |
| .ui.grid > .row > [class*="fourteen wide computer"].column, | |
| .ui.grid > .column.row > [class*="fourteen wide computer"].column, | |
| .ui.grid > [class*="fourteen wide computer"].column, | |
| .ui.column.grid > [class*="fourteen wide computer"].column { | |
| width: 87.5% !important; | |
| } | |
| .ui.grid > .row > [class*="fifteen wide computer"].column, | |
| .ui.grid > .column.row > [class*="fifteen wide computer"].column, | |
| .ui.grid > [class*="fifteen wide computer"].column, | |
| .ui.column.grid > [class*="fifteen wide computer"].column { | |
| width: 93.75% !important; | |
| } | |
| .ui.grid > .row > [class*="sixteen wide computer"].column, | |
| .ui.grid > .column.row > [class*="sixteen wide computer"].column, | |
| .ui.grid > [class*="sixteen wide computer"].column, | |
| .ui.column.grid > [class*="sixteen wide computer"].column { | |
| width: 100% !important; | |
| } | |
| } | |
| /* Large Monitor Sizing Combinations */ | |
| @media only screen and (min-width: 1200px) and (max-width: 1919px) { | |
| .ui.grid > .row > [class*="one wide large screen"].column, | |
| .ui.grid > .column.row > [class*="one wide large screen"].column, | |
| .ui.grid > [class*="one wide large screen"].column, | |
| .ui.column.grid > [class*="one wide large screen"].column { | |
| width: 6.25% !important; | |
| } | |
| .ui.grid > .row > [class*="two wide large screen"].column, | |
| .ui.grid > .column.row > [class*="two wide large screen"].column, | |
| .ui.grid > [class*="two wide large screen"].column, | |
| .ui.column.grid > [class*="two wide large screen"].column { | |
| width: 12.5% !important; | |
| } | |
| .ui.grid > .row > [class*="three wide large screen"].column, | |
| .ui.grid > .column.row > [class*="three wide large screen"].column, | |
| .ui.grid > [class*="three wide large screen"].column, | |
| .ui.column.grid > [class*="three wide large screen"].column { | |
| width: 18.75% !important; | |
| } | |
| .ui.grid > .row > [class*="four wide large screen"].column, | |
| .ui.grid > .column.row > [class*="four wide large screen"].column, | |
| .ui.grid > [class*="four wide large screen"].column, | |
| .ui.column.grid > [class*="four wide large screen"].column { | |
| width: 25% !important; | |
| } | |
| .ui.grid > .row > [class*="five wide large screen"].column, | |
| .ui.grid > .column.row > [class*="five wide large screen"].column, | |
| .ui.grid > [class*="five wide large screen"].column, | |
| .ui.column.grid > [class*="five wide large screen"].column { | |
| width: 31.25% !important; | |
| } | |
| .ui.grid > .row > [class*="six wide large screen"].column, | |
| .ui.grid > .column.row > [class*="six wide large screen"].column, | |
| .ui.grid > [class*="six wide large screen"].column, | |
| .ui.column.grid > [class*="six wide large screen"].column { | |
| width: 37.5% !important; | |
| } | |
| .ui.grid > .row > [class*="seven wide large screen"].column, | |
| .ui.grid > .column.row > [class*="seven wide large screen"].column, | |
| .ui.grid > [class*="seven wide large screen"].column, | |
| .ui.column.grid > [class*="seven wide large screen"].column { | |
| width: 43.75% !important; | |
| } | |
| .ui.grid > .row > [class*="eight wide large screen"].column, | |
| .ui.grid > .column.row > [class*="eight wide large screen"].column, | |
| .ui.grid > [class*="eight wide large screen"].column, | |
| .ui.column.grid > [class*="eight wide large screen"].column { | |
| width: 50% !important; | |
| } | |
| .ui.grid > .row > [class*="nine wide large screen"].column, | |
| .ui.grid > .column.row > [class*="nine wide large screen"].column, | |
| .ui.grid > [class*="nine wide large screen"].column, | |
| .ui.column.grid > [class*="nine wide large screen"].column { | |
| width: 56.25% !important; | |
| } | |
| .ui.grid > .row > [class*="ten wide large screen"].column, | |
| .ui.grid > .column.row > [class*="ten wide large screen"].column, | |
| .ui.grid > [class*="ten wide large screen"].column, | |
| .ui.column.grid > [class*="ten wide large screen"].column { | |
| width: 62.5% !important; | |
| } | |
| .ui.grid > .row > [class*="eleven wide large screen"].column, | |
| .ui.grid > .column.row > [class*="eleven wide large screen"].column, | |
| .ui.grid > [class*="eleven wide large screen"].column, | |
| .ui.column.grid > [class*="eleven wide large screen"].column { | |
| width: 68.75% !important; | |
| } | |
| .ui.grid > .row > [class*="twelve wide large screen"].column, | |
| .ui.grid > .column.row > [class*="twelve wide large screen"].column, | |
| .ui.grid > [class*="twelve wide large screen"].column, | |
| .ui.column.grid > [class*="twelve wide large screen"].column { | |
| width: 75% !important; | |
| } | |
| .ui.grid > .row > [class*="thirteen wide large screen"].column, | |
| .ui.grid > .column.row > [class*="thirteen wide large screen"].column, | |
| .ui.grid > [class*="thirteen wide large screen"].column, | |
| .ui.column.grid > [class*="thirteen wide large screen"].column { | |
| width: 81.25% !important; | |
| } | |
| .ui.grid > .row > [class*="fourteen wide large screen"].column, | |
| .ui.grid > .column.row > [class*="fourteen wide large screen"].column, | |
| .ui.grid > [class*="fourteen wide large screen"].column, | |
| .ui.column.grid > [class*="fourteen wide large screen"].column { | |
| width: 87.5% !important; | |
| } | |
| .ui.grid > .row > [class*="fifteen wide large screen"].column, | |
| .ui.grid > .column.row > [class*="fifteen wide large screen"].column, | |
| .ui.grid > [class*="fifteen wide large screen"].column, | |
| .ui.column.grid > [class*="fifteen wide large screen"].column { | |
| width: 93.75% !important; | |
| } | |
| .ui.grid > .row > [class*="sixteen wide large screen"].column, | |
| .ui.grid > .column.row > [class*="sixteen wide large screen"].column, | |
| .ui.grid > [class*="sixteen wide large screen"].column, | |
| .ui.column.grid > [class*="sixteen wide large screen"].column { | |
| width: 100% !important; | |
| } | |
| } | |
| /* Widescreen Sizing Combinations */ | |
| @media only screen and (min-width: 1920px) { | |
| .ui.grid > .row > [class*="one wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="one wide widescreen"].column, | |
| .ui.grid > [class*="one wide widescreen"].column, | |
| .ui.column.grid > [class*="one wide widescreen"].column { | |
| width: 6.25% !important; | |
| } | |
| .ui.grid > .row > [class*="two wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="two wide widescreen"].column, | |
| .ui.grid > [class*="two wide widescreen"].column, | |
| .ui.column.grid > [class*="two wide widescreen"].column { | |
| width: 12.5% !important; | |
| } | |
| .ui.grid > .row > [class*="three wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="three wide widescreen"].column, | |
| .ui.grid > [class*="three wide widescreen"].column, | |
| .ui.column.grid > [class*="three wide widescreen"].column { | |
| width: 18.75% !important; | |
| } | |
| .ui.grid > .row > [class*="four wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="four wide widescreen"].column, | |
| .ui.grid > [class*="four wide widescreen"].column, | |
| .ui.column.grid > [class*="four wide widescreen"].column { | |
| width: 25% !important; | |
| } | |
| .ui.grid > .row > [class*="five wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="five wide widescreen"].column, | |
| .ui.grid > [class*="five wide widescreen"].column, | |
| .ui.column.grid > [class*="five wide widescreen"].column { | |
| width: 31.25% !important; | |
| } | |
| .ui.grid > .row > [class*="six wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="six wide widescreen"].column, | |
| .ui.grid > [class*="six wide widescreen"].column, | |
| .ui.column.grid > [class*="six wide widescreen"].column { | |
| width: 37.5% !important; | |
| } | |
| .ui.grid > .row > [class*="seven wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="seven wide widescreen"].column, | |
| .ui.grid > [class*="seven wide widescreen"].column, | |
| .ui.column.grid > [class*="seven wide widescreen"].column { | |
| width: 43.75% !important; | |
| } | |
| .ui.grid > .row > [class*="eight wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="eight wide widescreen"].column, | |
| .ui.grid > [class*="eight wide widescreen"].column, | |
| .ui.column.grid > [class*="eight wide widescreen"].column { | |
| width: 50% !important; | |
| } | |
| .ui.grid > .row > [class*="nine wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="nine wide widescreen"].column, | |
| .ui.grid > [class*="nine wide widescreen"].column, | |
| .ui.column.grid > [class*="nine wide widescreen"].column { | |
| width: 56.25% !important; | |
| } | |
| .ui.grid > .row > [class*="ten wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="ten wide widescreen"].column, | |
| .ui.grid > [class*="ten wide widescreen"].column, | |
| .ui.column.grid > [class*="ten wide widescreen"].column { | |
| width: 62.5% !important; | |
| } | |
| .ui.grid > .row > [class*="eleven wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="eleven wide widescreen"].column, | |
| .ui.grid > [class*="eleven wide widescreen"].column, | |
| .ui.column.grid > [class*="eleven wide widescreen"].column { | |
| width: 68.75% !important; | |
| } | |
| .ui.grid > .row > [class*="twelve wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="twelve wide widescreen"].column, | |
| .ui.grid > [class*="twelve wide widescreen"].column, | |
| .ui.column.grid > [class*="twelve wide widescreen"].column { | |
| width: 75% !important; | |
| } | |
| .ui.grid > .row > [class*="thirteen wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="thirteen wide widescreen"].column, | |
| .ui.grid > [class*="thirteen wide widescreen"].column, | |
| .ui.column.grid > [class*="thirteen wide widescreen"].column { | |
| width: 81.25% !important; | |
| } | |
| .ui.grid > .row > [class*="fourteen wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="fourteen wide widescreen"].column, | |
| .ui.grid > [class*="fourteen wide widescreen"].column, | |
| .ui.column.grid > [class*="fourteen wide widescreen"].column { | |
| width: 87.5% !important; | |
| } | |
| .ui.grid > .row > [class*="fifteen wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="fifteen wide widescreen"].column, | |
| .ui.grid > [class*="fifteen wide widescreen"].column, | |
| .ui.column.grid > [class*="fifteen wide widescreen"].column { | |
| width: 93.75% !important; | |
| } | |
| .ui.grid > .row > [class*="sixteen wide widescreen"].column, | |
| .ui.grid > .column.row > [class*="sixteen wide widescreen"].column, | |
| .ui.grid > [class*="sixteen wide widescreen"].column, | |
| .ui.column.grid > [class*="sixteen wide widescreen"].column { | |
| width: 100% !important; | |
| } | |
| } | |
| /*---------------------- | |
| Centered | |
| -----------------------*/ | |
| .ui.centered.grid, | |
| .ui.centered.grid > .row, | |
| .ui.grid > .centered.row { | |
| text-align: center; | |
| -webkit-box-pack: center; | |
| -webkit-justify-content: center; | |
| -ms-flex-pack: center; | |
| justify-content: center; | |
| } | |
| .ui.centered.grid > .column:not(.aligned):not(.row), | |
| .ui.centered.grid > .row > .column:not(.aligned), | |
| .ui.grid .centered.row > .column:not(.aligned) { | |
| text-align: left; | |
| } | |
| .ui.grid > .centered.column, | |
| .ui.grid > .row > .centered.column { | |
| display: block; | |
| margin-left: auto; | |
| margin-right: auto; | |
| } | |
| /*---------------------- | |
| Relaxed | |
| -----------------------*/ | |
| .ui.relaxed.grid > .column:not(.row), | |
| .ui.relaxed.grid > .row > .column, | |
| .ui.grid > .relaxed.row > .column { | |
| padding-left: 1.5rem; | |
| padding-right: 1.5rem; | |
| } | |
| .ui[class*="very relaxed"].grid > .column:not(.row), | |
| .ui[class*="very relaxed"].grid > .row > .column, | |
| .ui.grid > [class*="very relaxed"].row > .column { | |
| padding-left: 2.5rem; | |
| padding-right: 2.5rem; | |
| } | |
| /* Coupling with UI Divider */ | |
| .ui.relaxed.grid .row + .ui.divider, | |
| .ui.grid .relaxed.row + .ui.divider { | |
| margin-left: 1.5rem; | |
| margin-right: 1.5rem; | |
| } | |
| .ui[class*="very relaxed"].grid .row + .ui.divider, | |
| .ui.grid [class*="very relaxed"].row + .ui.divider { | |
| margin-left: 2.5rem; | |
| margin-right: 2.5rem; | |
| } | |
| /*---------------------- | |
| Padded | |
| -----------------------*/ | |
| .ui.padded.grid:not(.vertically):not(.horizontally) { | |
| margin: 0em !important; | |
| } | |
| [class*="horizontally padded"].ui.grid { | |
| margin-left: 0em !important; | |
| margin-right: 0em !important; | |
| } | |
| [class*="vertically padded"].ui.grid { | |
| margin-top: 0em !important; | |
| margin-bottom: 0em !important; | |
| } | |
| /*---------------------- | |
| "Floated" | |
| -----------------------*/ | |
| .ui.grid [class*="left floated"].column { | |
| margin-right: auto; | |
| } | |
| .ui.grid [class*="right floated"].column { | |
| margin-left: auto; | |
| } | |
| /*---------------------- | |
| Divided | |
| -----------------------*/ | |
| .ui.divided.grid:not([class*="vertically divided"]) > .column:not(.row), | |
| .ui.divided.grid:not([class*="vertically divided"]) > .row > .column { | |
| box-shadow: -1px 0px 0px 0px rgba(34, 36, 38, 0.15); | |
| } | |
| /* Swap from padding to margin on columns to have dividers align */ | |
| .ui[class*="vertically divided"].grid > .column:not(.row), | |
| .ui[class*="vertically divided"].grid > .row > .column { | |
| margin-top: 1rem; | |
| margin-bottom: 1rem; | |
| padding-top: 0rem; | |
| padding-bottom: 0rem; | |
| } | |
| .ui[class*="vertically divided"].grid > .row { | |
| margin-top: 0em; | |
| margin-bottom: 0em; | |
| } | |
| /* No divider on first column on row */ | |
| .ui.divided.grid:not([class*="vertically divided"]) > .column:first-child, | |
| .ui.divided.grid:not([class*="vertically divided"]) > .row > .column:first-child { | |
| box-shadow: none; | |
| } | |
| /* Divided Row */ | |
| .ui.grid > .divided.row > .column { | |
| box-shadow: -1px 0px 0px 0px rgba(34, 36, 38, 0.15); | |
| } | |
| .ui.grid > .divided.row > .column:first-child { | |
| box-shadow: none; | |
| } | |
| /* Vertically Divided */ | |
| .ui[class*="vertically divided"].grid > .row { | |
| position: relative; | |
| } | |
| .ui[class*="vertically divided"].grid > .row:before { | |
| position: absolute; | |
| content: ""; | |
| top: 0em; | |
| left: 0px; | |
| width: calc(100% - 2rem ); | |
| height: 1px; | |
| margin: 0% 1rem; | |
| box-shadow: 0px -1px 0px 0px rgba(34, 36, 38, 0.15); | |
| } | |
| /* Padded Horizontally Divided */ | |
| [class*="horizontally padded"].ui.divided.grid, | |
| .ui.padded.divided.grid:not(.vertically):not(.horizontally) { | |
| width: 100%; | |
| } | |
| /* First Row Vertically Divided */ | |
| .ui[class*="vertically divided"].grid > .row:first-child:before { | |
| box-shadow: none; | |
| } | |
| /* Inverted Divided */ | |
| .ui.inverted.divided.grid:not([class*="vertically divided"]) > .column:not(.row), | |
| .ui.inverted.divided.grid:not([class*="vertically divided"]) > .row > .column { | |
| box-shadow: -1px 0px 0px 0px rgba(255, 255, 255, 0.1); | |
| } | |
| .ui.inverted.divided.grid:not([class*="vertically divided"]) > .column:not(.row):first-child, | |
| .ui.inverted.divided.grid:not([class*="vertically divided"]) > .row > .column:first-child { | |
| box-shadow: none; | |
| } | |
| .ui.inverted[class*="vertically divided"].grid > .row:before { | |
| box-shadow: 0px -1px 0px 0px rgba(255, 255, 255, 0.1); | |
| } | |
| /* Relaxed */ | |
| .ui.relaxed[class*="vertically divided"].grid > .row:before { | |
| margin-left: 1.5rem; | |
| margin-right: 1.5rem; | |
| width: calc(100% - 3rem ); | |
| } | |
| .ui[class*="very relaxed"][class*="vertically divided"].grid > .row:before { | |
| margin-left: 5rem; | |
| margin-right: 5rem; | |
| width: calc(100% - 5rem ); | |
| } | |
| /*---------------------- | |
| Celled | |
| -----------------------*/ | |
| .ui.celled.grid { | |
| width: 100%; | |
| margin: 1em 0em; | |
| box-shadow: 0px 0px 0px 1px #D4D4D5; | |
| } | |
| .ui.celled.grid > .row { | |
| width: 100% !important; | |
| margin: 0em; | |
| padding: 0em; | |
| box-shadow: 0px -1px 0px 0px #D4D4D5; | |
| } | |
| .ui.celled.grid > .column:not(.row), | |
| .ui.celled.grid > .row > .column { | |
| box-shadow: -1px 0px 0px 0px #D4D4D5; | |
| } | |
| .ui.celled.grid > .column:first-child, | |
| .ui.celled.grid > .row > .column:first-child { | |
| box-shadow: none; | |
| } | |
| .ui.celled.grid > .column:not(.row), | |
| .ui.celled.grid > .row > .column { | |
| padding: 1em; | |
| } | |
| .ui.relaxed.celled.grid > .column:not(.row), | |
| .ui.relaxed.celled.grid > .row > .column { | |
| padding: 1.5em; | |
| } | |
| .ui[class*="very relaxed"].celled.grid > .column:not(.row), | |
| .ui[class*="very relaxed"].celled.grid > .row > .column { | |
| padding: 2em; | |
| } | |
| /* Internally Celled */ | |
| .ui[class*="internally celled"].grid { | |
| box-shadow: none; | |
| margin: 0em; | |
| } | |
| .ui[class*="internally celled"].grid > .row:first-child { | |
| box-shadow: none; | |
| } | |
| .ui[class*="internally celled"].grid > .row > .column:first-child { | |
| box-shadow: none; | |
| } | |
| /*---------------------- | |
| Vertically Aligned | |
| -----------------------*/ | |
| /* Top Aligned */ | |
| .ui[class*="top aligned"].grid > .column:not(.row), | |
| .ui[class*="top aligned"].grid > .row > .column, | |
| .ui.grid > [class*="top aligned"].row > .column, | |
| .ui.grid > [class*="top aligned"].column:not(.row), | |
| .ui.grid > .row > [class*="top aligned"].column { | |
| -webkit-box-orient: vertical; | |
| -webkit-box-direction: normal; | |
| -webkit-flex-direction: column; | |
| -ms-flex-direction: column; | |
| flex-direction: column; | |
| vertical-align: top; | |
| -webkit-align-self: flex-start !important; | |
| -ms-flex-item-align: start !important; | |
| align-self: flex-start !important; | |
| } | |
| /* Middle Aligned */ | |
| .ui[class*="middle aligned"].grid > .column:not(.row), | |
| .ui[class*="middle aligned"].grid > .row > .column, | |
| .ui.grid > [class*="middle aligned"].row > .column, | |
| .ui.grid > [class*="middle aligned"].column:not(.row), | |
| .ui.grid > .row > [class*="middle aligned"].column { | |
| -webkit-box-orient: vertical; | |
| -webkit-box-direction: normal; | |
| -webkit-flex-direction: column; | |
| -ms-flex-direction: column; | |
| flex-direction: column; | |
| vertical-align: middle; | |
| -webkit-align-self: center !important; | |
| -ms-flex-item-align: center !important; | |
| align-self: center !important; | |
| } | |
| /* Bottom Aligned */ | |
| .ui[class*="bottom aligned"].grid > .column:not(.row), | |
| .ui[class*="bottom aligned"].grid > .row > .column, | |
| .ui.grid > [class*="bottom aligned"].row > .column, | |
| .ui.grid > [class*="bottom aligned"].column:not(.row), | |
| .ui.grid > .row > [class*="bottom aligned"].column { | |
| -webkit-box-orient: vertical; | |
| -webkit-box-direction: normal; | |
| -webkit-flex-direction: column; | |
| -ms-flex-direction: column; | |
| flex-direction: column; | |
| vertical-align: bottom; | |
| -webkit-align-self: flex-end !important; | |
| -ms-flex-item-align: end !important; | |
| align-self: flex-end !important; | |
| } | |
| /* Stretched */ | |
| .ui.stretched.grid > .row > .column, | |
| .ui.stretched.grid > .column, | |
| .ui.grid > .stretched.row > .column, | |
| .ui.grid > .stretched.column:not(.row), | |
| .ui.grid > .row > .stretched.column { | |
| display: -webkit-inline-box !important; | |
| display: -webkit-inline-flex !important; | |
| display: -ms-inline-flexbox !important; | |
| display: inline-flex !important; | |
| -webkit-align-self: stretch; | |
| -ms-flex-item-align: stretch; | |
| align-self: stretch; | |
| -webkit-box-orient: vertical; | |
| -webkit-box-direction: normal; | |
| -webkit-flex-direction: column; | |
| -ms-flex-direction: column; | |
| flex-direction: column; | |
| } | |
| .ui.stretched.grid > .row > .column > *, | |
| .ui.stretched.grid > .column > *, | |
| .ui.grid > .stretched.row > .column > *, | |
| .ui.grid > .stretched.column:not(.row) > *, | |
| .ui.grid > .row > .stretched.column > * { | |
| -webkit-box-flex: 1; | |
| -webkit-flex-grow: 1; | |
| -ms-flex-positive: 1; | |
| flex-grow: 1; | |
| } | |
| /*---------------------- | |
| Horizontally Centered | |
| -----------------------*/ | |
| /* Left Aligned */ | |
| .ui[class*="left aligned"].grid > .column, | |
| .ui[class*="left aligned"].grid > .row > .column, | |
| .ui.grid > [class*="left aligned"].row > .column, | |
| .ui.grid > [class*="left aligned"].column.column, | |
| .ui.grid > .row > [class*="left aligned"].column { | |
| text-align: left; | |
| -webkit-align-self: inherit; | |
| -ms-flex-item-align: inherit; | |
| align-self: inherit; | |
| } | |
| /* Center Aligned */ | |
| .ui[class*="center aligned"].grid > .column, | |
| .ui[class*="center aligned"].grid > .row > .column, | |
| .ui.grid > [class*="center aligned"].row > .column, | |
| .ui.grid > [class*="center aligned"].column.column, | |
| .ui.grid > .row > [class*="center aligned"].column { | |
| text-align: center; | |
| -webkit-align-self: inherit; | |
| -ms-flex-item-align: inherit; | |
| align-self: inherit; | |
| } | |
| .ui[class*="center aligned"].grid { | |
| -webkit-box-pack: center; | |
| -webkit-justify-content: center; | |
| -ms-flex-pack: center; | |
| justify-content: center; | |
| } | |
| /* Right Aligned */ | |
| .ui[class*="right aligned"].grid > .column, | |
| .ui[class*="right aligned"].grid > .row > .column, | |
| .ui.grid > [class*="right aligned"].row > .column, | |
| .ui.grid > [class*="right aligned"].column.column, | |
| .ui.grid > .row > [class*="right aligned"].column { | |
| text-align: right; | |
| -webkit-align-self: inherit; | |
| -ms-flex-item-align: inherit; | |
| align-self: inherit; | |
| } | |
| /* Justified */ | |
| .ui.justified.grid > .column, | |
| .ui.justified.grid > .row > .column, | |
| .ui.grid > .justified.row > .column, | |
| .ui.grid > .justified.column.column, | |
| .ui.grid > .row > .justified.column { | |
| text-align: justify; | |
| -webkit-hyphens: auto; | |
| -moz-hyphens: auto; | |
| -ms-hyphens: auto; | |
| hyphens: auto; | |
| } | |
| /*---------------------- | |
| Colored | |
| -----------------------*/ | |
| .ui.grid > .row > .red.column, | |
| .ui.grid > .row > .orange.column, | |
| .ui.grid > .row > .yellow.column, | |
| .ui.grid > .row > .olive.column, | |
| .ui.grid > .row > .green.column, | |
| .ui.grid > .row > .teal.column, | |
| .ui.grid > .row > .blue.column, | |
| .ui.grid > .row > .violet.column, | |
| .ui.grid > .row > .purple.column, | |
| .ui.grid > .row > .pink.column, | |
| .ui.grid > .row > .brown.column, | |
| .ui.grid > .row > .grey.column, | |
| .ui.grid > .row > .black.column { | |
| margin-top: -1rem; | |
| margin-bottom: -1rem; | |
| padding-top: 1rem; | |
| padding-bottom: 1rem; | |
| } | |
| /* Red */ | |
| .ui.grid > .red.row, | |
| .ui.grid > .red.column, | |
| .ui.grid > .row > .red.column { | |
| background-color: #DB2828 !important; | |
| color: #FFFFFF; | |
| } | |
| /* Orange */ | |
| .ui.grid > .orange.row, | |
| .ui.grid > .orange.column, | |
| .ui.grid > .row > .orange.column { | |
| background-color: #F2711C !important; | |
| color: #FFFFFF; | |
| } | |
| /* Yellow */ | |
| .ui.grid > .yellow.row, | |
| .ui.grid > .yellow.column, | |
| .ui.grid > .row > .yellow.column { | |
| background-color: #FBBD08 !important; | |
| color: #FFFFFF; | |
| } | |
| /* Olive */ | |
| .ui.grid > .olive.row, | |
| .ui.grid > .olive.column, | |
| .ui.grid > .row > .olive.column { | |
| background-color: #B5CC18 !important; | |
| color: #FFFFFF; | |
| } | |
| /* Green */ | |
| .ui.grid > .green.row, | |
| .ui.grid > .green.column, | |
| .ui.grid > .row > .green.column { | |
| background-color: #21BA45 !important; | |
| color: #FFFFFF; | |
| } | |
| /* Teal */ | |
| .ui.grid > .teal.row, | |
| .ui.grid > .teal.column, | |
| .ui.grid > .row > .teal.column { | |
| background-color: #00B5AD !important; | |
| color: #FFFFFF; | |
| } | |
| /* Blue */ | |
| .ui.grid > .blue.row, | |
| .ui.grid > .blue.column, | |
| .ui.grid > .row > .blue.column { | |
| background-color: #2185D0 !important; | |
| color: #FFFFFF; | |
| } | |
| /* Violet */ | |
| .ui.grid > .violet.row, | |
| .ui.grid > .violet.column, | |
| .ui.grid > .row > .violet.column { | |
| background-color: #6435C9 !important; | |
| color: #FFFFFF; | |
| } | |
| /* Purple */ | |
| .ui.grid > .purple.row, | |
| .ui.grid > .purple.column, | |
| .ui.grid > .row > .purple.column { | |
| background-color: #A333C8 !important; | |
| color: #FFFFFF; | |
| } | |
| /* Pink */ | |
| .ui.grid > .pink.row, | |
| .ui.grid > .pink.column, | |
| .ui.grid > .row > .pink.column { | |
| background-color: #E03997 !important; | |
| color: #FFFFFF; | |
| } | |
| /* Brown */ | |
| .ui.grid > .brown.row, | |
| .ui.grid > .brown.column, | |
| .ui.grid > .row > .brown.column { | |
| background-color: #A5673F !important; | |
| color: #FFFFFF; | |
| } | |
| /* Grey */ | |
| .ui.grid > .grey.row, | |
| .ui.grid > .grey.column, | |
| .ui.grid > .row > .grey.column { | |
| background-color: #767676 !important; | |
| color: #FFFFFF; | |
| } | |
| /* Black */ | |
| .ui.grid > .black.row, | |
| .ui.grid > .black.column, | |
| .ui.grid > .row > .black.column { | |
| background-color: #1B1C1D !important; | |
| color: #FFFFFF; | |
| } | |
| /*---------------------- | |
| Equal Width | |
| -----------------------*/ | |
| .ui[class*="equal width"].grid > .column:not(.row), | |
| .ui[class*="equal width"].grid > .row > .column, | |
| .ui.grid > [class*="equal width"].row > .column { | |
| display: inline-block; | |
| -webkit-box-flex: 1; | |
| -webkit-flex-grow: 1; | |
| -ms-flex-positive: 1; | |
| flex-grow: 1; | |
| } | |
| .ui[class*="equal width"].grid > .wide.column, | |
| .ui[class*="equal width"].grid > .row > .wide.column, | |
| .ui.grid > [class*="equal width"].row > .wide.column { | |
| -webkit-box-flex: 0; | |
| -webkit-flex-grow: 0; | |
| -ms-flex-positive: 0; | |
| flex-grow: 0; | |
| } | |
| /*---------------------- | |
| Reverse | |
| -----------------------*/ | |
| /* Mobile */ | |
| @media only screen and (max-width: 767px) { | |
| .ui[class*="mobile reversed"].grid, | |
| .ui[class*="mobile reversed"].grid > .row, | |
| .ui.grid > [class*="mobile reversed"].row { | |
| -webkit-box-orient: horizontal; | |
| -webkit-box-direction: reverse; | |
| -webkit-flex-direction: row-reverse; | |
| -ms-flex-direction: row-reverse; | |
| flex-direction: row-reverse; | |
| } | |
| .ui[class*="mobile vertically reversed"].grid, | |
| .ui.stackable[class*="mobile reversed"] { | |
| -webkit-box-orient: vertical; | |
| -webkit-box-direction: reverse; | |
| -webkit-flex-direction: column-reverse; | |
| -ms-flex-direction: column-reverse; | |
| flex-direction: column-reverse; | |
| } | |
| /* Divided Reversed */ | |
| .ui[class*="mobile reversed"].divided.grid:not([class*="vertically divided"]) > .column:first-child, | |
| .ui[class*="mobile reversed"].divided.grid:not([class*="vertically divided"]) > .row > .column:first-child { | |
| box-shadow: -1px 0px 0px 0px rgba(34, 36, 38, 0.15); | |
| } | |
| .ui[class*="mobile reversed"].divided.grid:not([class*="vertically divided"]) > .column:last-child, | |
| .ui[class*="mobile reversed"].divided.grid:not([class*="vertically divided"]) > .row > .column:last-child { | |
| box-shadow: none; | |
| } | |
| /* Vertically Divided Reversed */ | |
| .ui.grid[class*="vertically divided"][class*="mobile vertically reversed"] > .row:first-child:before { | |
| box-shadow: 0px -1px 0px 0px rgba(34, 36, 38, 0.15); | |
| } | |
| .ui.grid[class*="vertically divided"][class*="mobile vertically reversed"] > .row:last-child:before { | |
| box-shadow: none; | |
| } | |
| /* Celled Reversed */ | |
| .ui[class*="mobile reversed"].celled.grid > .row > .column:first-child { | |
| box-shadow: -1px 0px 0px 0px #D4D4D5; | |
| } | |
| .ui[class*="mobile reversed"].celled.grid > .row > .column:last-child { | |
| box-shadow: none; | |
| } | |
| } | |
| /* Tablet */ | |
| @media only screen and (min-width: 768px) and (max-width: 991px) { | |
| .ui[class*="tablet reversed"].grid, | |
| .ui[class*="tablet reversed"].grid > .row, | |
| .ui.grid > [class*="tablet reversed"].row { | |
| -webkit-box-orient: horizontal; | |
| -webkit-box-direction: reverse; | |
| -webkit-flex-direction: row-reverse; | |
| -ms-flex-direction: row-reverse; | |
| flex-direction: row-reverse; | |
| } | |
| .ui[class*="tablet vertically reversed"].grid { | |
| -webkit-box-orient: vertical; | |
| -webkit-box-direction: reverse; | |
| -webkit-flex-direction: column-reverse; | |
| -ms-flex-direction: column-reverse; | |
| flex-direction: column-reverse; | |
| } | |
| /* Divided Reversed */ | |
| .ui[class*="tablet reversed"].divided.grid:not([class*="vertically divided"]) > .column:first-child, | |
| .ui[class*="tablet reversed"].divided.grid:not([class*="vertically divided"]) > .row > .column:first-child { | |
| box-shadow: -1px 0px 0px 0px rgba(34, 36, 38, 0.15); | |
| } | |
| .ui[class*="tablet reversed"].divided.grid:not([class*="vertically divided"]) > .column:last-child, | |
| .ui[class*="tablet reversed"].divided.grid:not([class*="vertically divided"]) > .row > .column:last-child { | |
| box-shadow: none; | |
| } | |
| /* Vertically Divided Reversed */ | |
| .ui.grid[class*="vertically divided"][class*="tablet vertically reversed"] > .row:first-child:before { | |
| box-shadow: 0px -1px 0px 0px rgba(34, 36, 38, 0.15); | |
| } | |
| .ui.grid[class*="vertically divided"][class*="tablet vertically reversed"] > .row:last-child:before { | |
| box-shadow: none; | |
| } | |
| /* Celled Reversed */ | |
| .ui[class*="tablet reversed"].celled.grid > .row > .column:first-child { | |
| box-shadow: -1px 0px 0px 0px #D4D4D5; | |
| } | |
| .ui[class*="tablet reversed"].celled.grid > .row > .column:last-child { | |
| box-shadow: none; | |
| } | |
| } | |
| /* Computer */ | |
| @media only screen and (min-width: 992px) { | |
| .ui[class*="computer reversed"].grid, | |
| .ui[class*="computer reversed"].grid > .row, | |
| .ui.grid > [class*="computer reversed"].row { | |
| -webkit-box-orient: horizontal; | |
| -webkit-box-direction: reverse; | |
| -webkit-flex-direction: row-reverse; | |
| -ms-flex-direction: row-reverse; | |
| flex-direction: row-reverse; | |
| } | |
| .ui[class*="computer vertically reversed"].grid { | |
| -webkit-box-orient: vertical; | |
| -webkit-box-direction: reverse; | |
| -webkit-flex-direction: column-reverse; | |
| -ms-flex-direction: column-reverse; | |
| flex-direction: column-reverse; | |
| } | |
| /* Divided Reversed */ | |
| .ui[class*="computer reversed"].divided.grid:not([class*="vertically divided"]) > .column:first-child, | |
| .ui[class*="computer reversed"].divided.grid:not([class*="vertically divided"]) > .row > .column:first-child { | |
| box-shadow: -1px 0px 0px 0px rgba(34, 36, 38, 0.15); | |
| } | |
| .ui[class*="computer reversed"].divided.grid:not([class*="vertically divided"]) > .column:last-child, | |
| .ui[class*="computer reversed"].divided.grid:not([class*="vertically divided"]) > .row > .column:last-child { | |
| box-shadow: none; | |
| } | |
| /* Vertically Divided Reversed */ | |
| .ui.grid[class*="vertically divided"][class*="computer vertically reversed"] > .row:first-child:before { | |
| box-shadow: 0px -1px 0px 0px rgba(34, 36, 38, 0.15); | |
| } | |
| .ui.grid[class*="vertically divided"][class*="computer vertically reversed"] > .row:last-child:before { | |
| box-shadow: none; | |
| } | |
| /* Celled Reversed */ | |
| .ui[class*="computer reversed"].celled.grid > .row > .column:first-child { | |
| box-shadow: -1px 0px 0px 0px #D4D4D5; | |
| } | |
| .ui[class*="computer reversed"].celled.grid > .row > .column:last-child { | |
| box-shadow: none; | |
| } | |
| } | |
| /*------------------- | |
| Doubling | |
| --------------------*/ | |
| /* Tablet Only */ | |
| @media only screen and (min-width: 768px) and (max-width: 991px) { | |
| .ui.doubling.grid { | |
| width: auto; | |
| } | |
| .ui.grid > .doubling.row, | |
| .ui.doubling.grid > .row { | |
| margin: 0em !important; | |
| padding: 0em !important; | |
| } | |
| .ui.grid > .doubling.row > .column, | |
| .ui.doubling.grid > .row > .column { | |
| display: inline-block !important; | |
| padding-top: 1rem !important; | |
| padding-bottom: 1rem !important; | |
| box-shadow: none !important; | |
| margin: 0em; | |
| } | |
| .ui[class*="two column"].doubling.grid > .row > .column, | |
| .ui[class*="two column"].doubling.grid > .column:not(.row), | |
| .ui.grid > [class*="two column"].doubling.row.row > .column { | |
| width: 100% !important; | |
| } | |
| .ui[class*="three column"].doubling.grid > .row > .column, | |
| .ui[class*="three column"].doubling.grid > .column:not(.row), | |
| .ui.grid > [class*="three column"].doubling.row.row > .column { | |
| width: 50% !important; | |
| } | |
| .ui[class*="four column"].doubling.grid > .row > .column, | |
| .ui[class*="four column"].doubling.grid > .column:not(.row), | |
| .ui.grid > [class*="four column"].doubling.row.row > .column { | |
| width: 50% !important; | |
| } | |
| .ui[class*="five column"].doubling.grid > .row > .column, | |
| .ui[class*="five column"].doubling.grid > .column:not(.row), | |
| .ui.grid > [class*="five column"].doubling.row.row > .column { | |
| width: 33.33333333% !important; | |
| } | |
| .ui[class*="six column"].doubling.grid > .row > .column, | |
| .ui[class*="six column"].doubling.grid > .column:not(.row), | |
| .ui.grid > [class*="six column"].doubling.row.row > .column { | |
| width: 33.33333333% !important; | |
| } | |
| .ui[class*="seven column"].doubling.grid > .row > .column, | |
| .ui[class*="seven column"].doubling.grid > .column:not(.row), | |
| .ui.grid > [class*="seven column"].doubling.row.row > .column { | |
| width: 33.33333333% !important; | |
| } | |
| .ui[class*="eight column"].doubling.grid > .row > .column, | |
| .ui[class*="eight column"].doubling.grid > .column:not(.row), | |
| .ui.grid > [class*="eight column"].doubling.row.row > .column { | |
| width: 25% !important; | |
| } | |
| .ui[class*="nine column"].doubling.grid > .row > .column, | |
| .ui[class*="nine column"].doubling.grid > .column:not(.row), | |
| .ui.grid > [class*="nine column"].doubling.row.row > .column { | |
| width: 25% !important; | |
| } | |
| .ui[class*="ten column"].doubling.grid > .row > .column, | |
| .ui[class*="ten column"].doubling.grid > .column:not(.row), | |
| .ui.grid > [class*="ten column"].doubling.row.row > .column { | |
| width: 20% !important; | |
| } | |
| .ui[class*="eleven column"].doubling.grid > .row > .column, | |
| .ui[class*="eleven column"].doubling.grid > .column:not(.row), | |
| .ui.grid > [class*="eleven column"].doubling.row.row > .column { | |
| width: 20% !important; | |
| } | |
| .ui[class*="twelve column"].doubling.grid > .row > .column, | |
| .ui[class*="twelve column"].doubling.grid > .column:not(.row), | |
| .ui.grid > [class*="twelve column"].doubling.row.row > .column { | |
| width: 16.66666667% !important; | |
| } | |
| .ui[class*="thirteen column"].doubling.grid > .row > .column, | |
| .ui[class*="thirteen column"].doubling.grid > .column:not(.row), | |
| .ui.grid > [class*="thirteen column"].doubling.row.row > .column { | |
| width: 16.66666667% !important; | |
| } | |
| .ui[class*="fourteen column"].doubling.grid > .row > .column, | |
| .ui[class*="fourteen column"].doubling.grid > .column:not(.row), | |
| .ui.grid > [class*="fourteen column"].doubling.row.row > .column { | |
| width: 14.28571429% !important; | |
| } | |
| .ui[class*="fifteen column"].doubling.grid > .row > .column, | |
| .ui[class*="fifteen column"].doubling.grid > .column:not(.row), | |
| .ui.grid > [class*="fifteen column"].doubling.row.row > .column { | |
| width: 14.28571429% !important; | |
| } | |
| .ui[class*="sixteen column"].doubling.grid > .row > .column, | |
| .ui[class*="sixteen column"].doubling.grid > .column:not(.row), | |
| .ui.grid > [class*="sixteen column"].doubling.row.row > .column { | |
| width: 12.5% !important; | |
| } | |
| } | |
| /* Mobily Only */ | |
| @media only screen and (max-width: 767px) { | |
| .ui.grid > .doubling.row, | |
| .ui.doubling.grid > .row { | |
| margin: 0em !important; | |
| padding: 0em !important; | |
| } | |
| .ui.grid > .doubling.row > .column, | |
| .ui.doubling.grid > .row > .column { | |
| padding-top: 1rem !important; | |
| padding-bottom: 1rem !important; | |
| margin: 0em !important; | |
| box-shadow: none !important; | |
| } | |
| .ui[class*="two column"].doubling:not(.stackable).grid > .row > .column, | |
| .ui[class*="two column"].doubling:not(.stackable).grid > .column:not(.row), | |
| .ui.grid > [class*="two column"].doubling:not(.stackable).row.row > .column { | |
| width: 100% !important; | |
| } | |
| .ui[class*="three column"].doubling:not(.stackable).grid > .row > .column, | |
| .ui[class*="three column"].doubling:not(.stackable).grid > .column:not(.row), | |
| .ui.grid > [class*="three column"].doubling:not(.stackable).row.row > .column { | |
| width: 50% !important; | |
| } | |
| .ui[class*="four column"].doubling:not(.stackable).grid > .row > .column, | |
| .ui[class*="four column"].doubling:not(.stackable).grid > .column:not(.row), | |
| .ui.grid > [class*="four column"].doubling:not(.stackable).row.row > .column { | |
| width: 50% !important; | |
| } | |
| .ui[class*="five column"].doubling:not(.stackable).grid > .row > .column, | |
| .ui[class*="five column"].doubling:not(.stackable).grid > .column:not(.row), | |
| .ui.grid > [class*="five column"].doubling:not(.stackable).row.row > .column { | |
| width: 50% !important; | |
| } | |
| .ui[class*="six column"].doubling:not(.stackable).grid > .row > .column, | |
| .ui[class*="six column"].doubling:not(.stackable).grid > .column:not(.row), | |
| .ui.grid > [class*="six column"].doubling:not(.stackable).row.row > .column { | |
| width: 50% !important; | |
| } | |
| .ui[class*="seven column"].doubling:not(.stackable).grid > .row > .column, | |
| .ui[class*="seven column"].doubling:not(.stackable).grid > .column:not(.row), | |
| .ui.grid > [class*="seven column"].doubling:not(.stackable).row.row > .column { | |
| width: 50% !important; | |
| } | |
| .ui[class*="eight column"].doubling:not(.stackable).grid > .row > .column, | |
| .ui[class*="eight column"].doubling:not(.stackable).grid > .column:not(.row), | |
| .ui.grid > [class*="eight column"].doubling:not(.stackable).row.row > .column { | |
| width: 50% !important; | |
| } | |
| .ui[class*="nine column"].doubling:not(.stackable).grid > .row > .column, | |
| .ui[class*="nine column"].doubling:not(.stackable).grid > .column:not(.row), | |
| .ui.grid > [class*="nine column"].doubling:not(.stackable).row.row > .column { | |
| width: 33.33333333% !important; | |
| } | |
| .ui[class*="ten column"].doubling:not(.stackable).grid > .row > .column, | |
| .ui[class*="ten column"].doubling:not(.stackable).grid > .column:not(.row), | |
| .ui.grid > [class*="ten column"].doubling:not(.stackable).row.row > .column { | |
| width: 33.33333333% !important; | |
| } | |
| .ui[class*="eleven column"].doubling:not(.stackable).grid > .row > .column, | |
| .ui[class*="eleven column"].doubling:not(.stackable).grid > .column:not(.row), | |
| .ui.grid > [class*="eleven column"].doubling:not(.stackable).row.row > .column { | |
| width: 33.33333333% !important; | |
| } | |
| .ui[class*="twelve column"].doubling:not(.stackable).grid > .row > .column, | |
| .ui[class*="twelve column"].doubling:not(.stackable).grid > .column:not(.row), | |
| .ui.grid > [class*="twelve column"].doubling:not(.stackable).row.row > .column { | |
| width: 33.33333333% !important; | |
| } | |
| .ui[class*="thirteen column"].doubling:not(.stackable).grid > .row > .column, | |
| .ui[class*="thirteen column"].doubling:not(.stackable).grid > .column:not(.row), | |
| .ui.grid > [class*="thirteen column"].doubling:not(.stackable).row.row > .column { | |
| width: 33.33333333% !important; | |
| } | |
| .ui[class*="fourteen column"].doubling:not(.stackable).grid > .row > .column, | |
| .ui[class*="fourteen column"].doubling:not(.stackable).grid > .column:not(.row), | |
| .ui.grid > [class*="fourteen column"].doubling:not(.stackable).row.row > .column { | |
| width: 25% !important; | |
| } | |
| .ui[class*="fifteen column"].doubling:not(.stackable).grid > .row > .column, | |
| .ui[class*="fifteen column"].doubling:not(.stackable).grid > .column:not(.row), | |
| .ui.grid > [class*="fifteen column"].doubling:not(.stackable).row.row > .column { | |
| width: 25% !important; | |
| } | |
| .ui[class*="sixteen column"].doubling:not(.stackable).grid > .row > .column, | |
| .ui[class*="sixteen column"].doubling:not(.stackable).grid > .column:not(.row), | |
| .ui.grid > [class*="sixteen column"].doubling:not(.stackable).row.row > .column { | |
| width: 25% !important; | |
| } | |
| } | |
| /*------------------- | |
| Stackable | |
| --------------------*/ | |
| @media only screen and (max-width: 767px) { | |
| .ui.stackable.grid { | |
| width: auto; | |
| margin-left: 0em !important; | |
| margin-right: 0em !important; | |
| } | |
| .ui.stackable.grid > .row > .wide.column, | |
| .ui.stackable.grid > .wide.column, | |
| .ui.stackable.grid > .column.grid > .column, | |
| .ui.stackable.grid > .column.row > .column, | |
| .ui.stackable.grid > .row > .column, | |
| .ui.stackable.grid > .column:not(.row), | |
| .ui.grid > .stackable.stackable.row > .column { | |
| width: 100% !important; | |
| margin: 0em 0em !important; | |
| box-shadow: none !important; | |
| padding: 1rem 1rem !important; | |
| } | |
| .ui.stackable.grid:not(.vertically) > .row { | |
| margin: 0em; | |
| padding: 0em; | |
| } | |
| /* Coupling */ | |
| .ui.container > .ui.stackable.grid > .column, | |
| .ui.container > .ui.stackable.grid > .row > .column { | |
| padding-left: 0em !important; | |
| padding-right: 0em !important; | |
| } | |
| /* Don't pad inside segment or nested grid */ | |
| .ui.grid .ui.stackable.grid, | |
| .ui.segment:not(.vertical) .ui.stackable.page.grid { | |
| margin-left: -1rem !important; | |
| margin-right: -1rem !important; | |
| } | |
| /* Divided Stackable */ | |
| .ui.stackable.divided.grid > .row:first-child > .column:first-child, | |
| .ui.stackable.celled.grid > .row:first-child > .column:first-child, | |
| .ui.stackable.divided.grid > .column:not(.row):first-child, | |
| .ui.stackable.celled.grid > .column:not(.row):first-child { | |
| border-top: none !important; | |
| } | |
| .ui.inverted.stackable.celled.grid > .column:not(.row), | |
| .ui.inverted.stackable.divided.grid > .column:not(.row), | |
| .ui.inverted.stackable.celled.grid > .row > .column, | |
| .ui.inverted.stackable.divided.grid > .row > .column { | |
| border-top: 1px solid rgba(255, 255, 255, 0.1); | |
| } | |
| .ui.stackable.celled.grid > .column:not(.row), | |
| .ui.stackable.divided:not(.vertically).grid > .column:not(.row), | |
| .ui.stackable.celled.grid > .row > .column, | |
| .ui.stackable.divided:not(.vertically).grid > .row > .column { | |
| border-top: 1px solid rgba(34, 36, 38, 0.15); | |
| box-shadow: none !important; | |
| padding-top: 2rem !important; | |
| padding-bottom: 2rem !important; | |
| } | |
| .ui.stackable.celled.grid > .row { | |
| box-shadow: none !important; | |
| } | |
| .ui.stackable.divided:not(.vertically).grid > .column:not(.row), | |
| .ui.stackable.divided:not(.vertically).grid > .row > .column { | |
| padding-left: 0em !important; | |
| padding-right: 0em !important; | |
| } | |
| } | |
| /*---------------------- | |
| Only (Device) | |
| -----------------------*/ | |
| /* These include arbitrary class repetitions for forced specificity */ | |
| /* Mobile Only Hide */ | |
| @media only screen and (max-width: 767px) { | |
| .ui[class*="tablet only"].grid.grid.grid:not(.mobile), | |
| .ui.grid.grid.grid > [class*="tablet only"].row:not(.mobile), | |
| .ui.grid.grid.grid > [class*="tablet only"].column:not(.mobile), | |
| .ui.grid.grid.grid > .row > [class*="tablet only"].column:not(.mobile) { | |
| display: none !important; | |
| } | |
| .ui[class*="computer only"].grid.grid.grid:not(.mobile), | |
| .ui.grid.grid.grid > [class*="computer only"].row:not(.mobile), | |
| .ui.grid.grid.grid > [class*="computer only"].column:not(.mobile), | |
| .ui.grid.grid.grid > .row > [class*="computer only"].column:not(.mobile) { | |
| display: none !important; | |
| } | |
| .ui[class*="large screen only"].grid.grid.grid:not(.mobile), | |
| .ui.grid.grid.grid > [class*="large screen only"].row:not(.mobile), | |
| .ui.grid.grid.grid > [class*="large screen only"].column:not(.mobile), | |
| .ui.grid.grid.grid > .row > [class*="large screen only"].column:not(.mobile) { | |
| display: none !important; | |
| } | |
| .ui[class*="widescreen only"].grid.grid.grid:not(.mobile), | |
| .ui.grid.grid.grid > [class*="widescreen only"].row:not(.mobile), | |
| .ui.grid.grid.grid > [class*="widescreen only"].column:not(.mobile), | |
| .ui.grid.grid.grid > .row > [class*="widescreen only"].column:not(.mobile) { | |
| display: none !important; | |
| } | |
| } | |
| /* Tablet Only Hide */ | |
| @media only screen and (min-width: 768px) and (max-width: 991px) { | |
| .ui[class*="mobile only"].grid.grid.grid:not(.tablet), | |
| .ui.grid.grid.grid > [class*="mobile only"].row:not(.tablet), | |
| .ui.grid.grid.grid > [class*="mobile only"].column:not(.tablet), | |
| .ui.grid.grid.grid > .row > [class*="mobile only"].column:not(.tablet) { | |
| display: none !important; | |
| } | |
| .ui[class*="computer only"].grid.grid.grid:not(.tablet), | |
| .ui.grid.grid.grid > [class*="computer only"].row:not(.tablet), | |
| .ui.grid.grid.grid > [class*="computer only"].column:not(.tablet), | |
| .ui.grid.grid.grid > .row > [class*="computer only"].column:not(.tablet) { | |
| display: none !important; | |
| } | |
| .ui[class*="large screen only"].grid.grid.grid:not(.mobile), | |
| .ui.grid.grid.grid > [class*="large screen only"].row:not(.mobile), | |
| .ui.grid.grid.grid > [class*="large screen only"].column:not(.mobile), | |
| .ui.grid.grid.grid > .row > [class*="large screen only"].column:not(.mobile) { | |
| display: none !important; | |
| } | |
| .ui[class*="widescreen only"].grid.grid.grid:not(.mobile), | |
| .ui.grid.grid.grid > [class*="widescreen only"].row:not(.mobile), | |
| .ui.grid.grid.grid > [class*="widescreen only"].column:not(.mobile), | |
| .ui.grid.grid.grid > .row > [class*="widescreen only"].column:not(.mobile) { | |
| display: none !important; | |
| } | |
| } | |
| /* Computer Only Hide */ | |
| @media only screen and (min-width: 992px) and (max-width: 1199px) { | |
| .ui[class*="mobile only"].grid.grid.grid:not(.computer), | |
| .ui.grid.grid.grid > [class*="mobile only"].row:not(.computer), | |
| .ui.grid.grid.grid > [class*="mobile only"].column:not(.computer), | |
| .ui.grid.grid.grid > .row > [class*="mobile only"].column:not(.computer) { | |
| display: none !important; | |
| } | |
| .ui[class*="tablet only"].grid.grid.grid:not(.computer), | |
| .ui.grid.grid.grid > [class*="tablet only"].row:not(.computer), | |
| .ui.grid.grid.grid > [class*="tablet only"].column:not(.computer), | |
| .ui.grid.grid.grid > .row > [class*="tablet only"].column:not(.computer) { | |
| display: none !important; | |
| } | |
| .ui[class*="large screen only"].grid.grid.grid:not(.mobile), | |
| .ui.grid.grid.grid > [class*="large screen only"].row:not(.mobile), | |
| .ui.grid.grid.grid > [class*="large screen only"].column:not(.mobile), | |
| .ui.grid.grid.grid > .row > [class*="large screen only"].column:not(.mobile) { | |
| display: none !important; | |
| } | |
| .ui[class*="widescreen only"].grid.grid.grid:not(.mobile), | |
| .ui.grid.grid.grid > [class*="widescreen only"].row:not(.mobile), | |
| .ui.grid.grid.grid > [class*="widescreen only"].column:not(.mobile), | |
| .ui.grid.grid.grid > .row > [class*="widescreen only"].column:not(.mobile) { | |
| display: none !important; | |
| } | |
| } | |
| /* Large Screen Only Hide */ | |
| @media only screen and (min-width: 1200px) and (max-width: 1919px) { | |
| .ui[class*="mobile only"].grid.grid.grid:not(.computer), | |
| .ui.grid.grid.grid > [class*="mobile only"].row:not(.computer), | |
| .ui.grid.grid.grid > [class*="mobile only"].column:not(.computer), | |
| .ui.grid.grid.grid > .row > [class*="mobile only"].column:not(.computer) { | |
| display: none !important; | |
| } | |
| .ui[class*="tablet only"].grid.grid.grid:not(.computer), | |
| .ui.grid.grid.grid > [class*="tablet only"].row:not(.computer), | |
| .ui.grid.grid.grid > [class*="tablet only"].column:not(.computer), | |
| .ui.grid.grid.grid > .row > [class*="tablet only"].column:not(.computer) { | |
| display: none !important; | |
| } | |
| .ui[class*="widescreen only"].grid.grid.grid:not(.mobile), | |
| .ui.grid.grid.grid > [class*="widescreen only"].row:not(.mobile), | |
| .ui.grid.grid.grid > [class*="widescreen only"].column:not(.mobile), | |
| .ui.grid.grid.grid > .row > [class*="widescreen only"].column:not(.mobile) { | |
| display: none !important; | |
| } | |
| } | |
| /* Widescreen Only Hide */ | |
| @media only screen and (min-width: 1920px) { | |
| .ui[class*="mobile only"].grid.grid.grid:not(.computer), | |
| .ui.grid.grid.grid > [class*="mobile only"].row:not(.computer), | |
| .ui.grid.grid.grid > [class*="mobile only"].column:not(.computer), | |
| .ui.grid.grid.grid > .row > [class*="mobile only"].column:not(.computer) { | |
| display: none !important; | |
| } | |
| .ui[class*="tablet only"].grid.grid.grid:not(.computer), | |
| .ui.grid.grid.grid > [class*="tablet only"].row:not(.computer), | |
| .ui.grid.grid.grid > [class*="tablet only"].column:not(.computer), | |
| .ui.grid.grid.grid > .row > [class*="tablet only"].column:not(.computer) { | |
| display: none !important; | |
| } | |
| } | |
| /******************************* | |
| Theme Overrides | |
| *******************************/ | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - Header | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Header | |
| *******************************/ | |
| /* Standard */ | |
| .ui.header { | |
| border: none; | |
| margin: calc(2rem - 0.14285em ) 0em 1rem; | |
| padding: 0em 0em; | |
| font-family: 'Arial', 'Helvetica Neue', Arial, Helvetica, sans-serif; | |
| font-weight: bold; | |
| line-height: 1.2857em; | |
| text-transform: none; | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| .ui.header:first-child { | |
| margin-top: -0.14285em; | |
| } | |
| .ui.header:last-child { | |
| margin-bottom: 0em; | |
| } | |
| /*-------------- | |
| Sub Header | |
| ---------------*/ | |
| .ui.header .sub.header { | |
| display: block; | |
| font-weight: normal; | |
| padding: 0em; | |
| margin: 0em; | |
| font-size: 1rem; | |
| line-height: 1.2em; | |
| color: rgba(0, 0, 0, 0.6); | |
| } | |
| /*-------------- | |
| Icon | |
| ---------------*/ | |
| .ui.header > .icon { | |
| display: table-cell; | |
| opacity: 1; | |
| font-size: 1.5em; | |
| padding-top: 0.14285em; | |
| vertical-align: middle; | |
| } | |
| /* With Text Node */ | |
| .ui.header .icon:only-child { | |
| display: inline-block; | |
| padding: 0em; | |
| margin-right: 0.30769231rem; | |
| } | |
| /*------------------- | |
| Image | |
| --------------------*/ | |
| .ui.header > .image, | |
| .ui.header > img { | |
| display: inline-block; | |
| margin-top: 0.14285em; | |
| width: 2.5em; | |
| height: auto; | |
| vertical-align: middle; | |
| } | |
| .ui.header > .image:only-child, | |
| .ui.header > img:only-child { | |
| margin-right: 0.30769231rem; | |
| } | |
| /*-------------- | |
| Content | |
| ---------------*/ | |
| .ui.header .content { | |
| display: inline-block; | |
| vertical-align: top; | |
| } | |
| /* After Image */ | |
| .ui.header > img + .content, | |
| .ui.header > .image + .content { | |
| padding-left: 0.30769231rem; | |
| vertical-align: middle; | |
| } | |
| /* After Icon */ | |
| .ui.header > .icon + .content { | |
| padding-left: 0.30769231rem; | |
| display: table-cell; | |
| vertical-align: middle; | |
| } | |
| /*-------------- | |
| Loose Coupling | |
| ---------------*/ | |
| .ui.header .ui.label { | |
| font-size: ''; | |
| margin-left: 0.5rem; | |
| vertical-align: middle; | |
| } | |
| /* Positioning */ | |
| .ui.header + p { | |
| margin-top: 0em; | |
| } | |
| /******************************* | |
| Types | |
| *******************************/ | |
| /*-------------- | |
| Page | |
| ---------------*/ | |
| h1.ui.header { | |
| font-size: 2.25em; | |
| } | |
| h2.ui.header { | |
| font-size: 1.714rem; | |
| } | |
| h3.ui.header { | |
| font-size: 1.28rem; | |
| } | |
| h4.ui.header { | |
| font-size: 1.071rem; | |
| } | |
| h5.ui.header { | |
| font-size: 1rem; | |
| } | |
| /* Sub Header */ | |
| h1.ui.header .sub.header { | |
| font-size: 1.15384615rem; | |
| } | |
| h2.ui.header .sub.header { | |
| font-size: 1.15384615rem; | |
| } | |
| h3.ui.header .sub.header { | |
| font-size: 1rem; | |
| } | |
| h4.ui.header .sub.header { | |
| font-size: 1rem; | |
| } | |
| h5.ui.header .sub.header { | |
| font-size: 0.92307692rem; | |
| } | |
| /*-------------- | |
| Content Heading | |
| ---------------*/ | |
| .ui.huge.header { | |
| min-height: 1em; | |
| font-size: 2.25em; | |
| } | |
| .ui.large.header { | |
| font-size: 1.714em; | |
| } | |
| .ui.medium.header { | |
| font-size: 1.28em; | |
| } | |
| .ui.small.header { | |
| font-size: 1.071em; | |
| } | |
| .ui.tiny.header { | |
| font-size: 1em; | |
| } | |
| /* Sub Header */ | |
| .ui.huge.header .sub.header { | |
| font-size: 1.15384615rem; | |
| } | |
| .ui.large.header .sub.header { | |
| font-size: 1.15384615rem; | |
| } | |
| .ui.header .sub.header { | |
| font-size: 1rem; | |
| } | |
| .ui.small.header .sub.header { | |
| font-size: 1rem; | |
| } | |
| .ui.tiny.header .sub.header { | |
| font-size: 0.92307692rem; | |
| } | |
| /*-------------- | |
| Sub Heading | |
| ---------------*/ | |
| .ui.sub.header { | |
| padding: 0em; | |
| margin-bottom: 0.15384615rem; | |
| font-weight: bold; | |
| font-size: 0.84615385em; | |
| text-transform: uppercase; | |
| color: ''; | |
| } | |
| .ui.small.sub.header { | |
| font-size: 0.69230769em; | |
| } | |
| .ui.sub.header { | |
| font-size: 0.84615385em; | |
| } | |
| .ui.large.sub.header { | |
| font-size: 0.92307692em; | |
| } | |
| .ui.huge.sub.header { | |
| font-size: 1em; | |
| } | |
| /*------------------- | |
| Icon | |
| --------------------*/ | |
| .ui.icon.header { | |
| display: inline-block; | |
| text-align: center; | |
| margin: 2rem 0em 1rem; | |
| } | |
| .ui.icon.header:after { | |
| content: ''; | |
| display: block; | |
| height: 0px; | |
| clear: both; | |
| visibility: hidden; | |
| } | |
| .ui.icon.header:first-child { | |
| margin-top: 0em; | |
| } | |
| .ui.icon.header .icon { | |
| float: none; | |
| display: block; | |
| width: auto; | |
| height: auto; | |
| line-height: 1; | |
| padding: 0em; | |
| font-size: 3em; | |
| margin: 0em auto 0.5rem; | |
| opacity: 1; | |
| } | |
| .ui.icon.header .content { | |
| display: block; | |
| } | |
| .ui.icon.header .circular.icon { | |
| font-size: 2em; | |
| } | |
| .ui.icon.header .square.icon { | |
| font-size: 2em; | |
| } | |
| .ui.block.icon.header .icon { | |
| margin-bottom: 0em; | |
| } | |
| .ui.icon.header.aligned { | |
| margin-left: auto; | |
| margin-right: auto; | |
| display: block; | |
| } | |
| /******************************* | |
| States | |
| *******************************/ | |
| .ui.disabled.header { | |
| opacity: 0.3; | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| /*------------------- | |
| Inverted | |
| --------------------*/ | |
| .ui.inverted.header { | |
| color: #FFFFFF; | |
| } | |
| .ui.inverted.header .sub.header { | |
| color: rgba(255, 255, 255, 0.8); | |
| } | |
| .ui.inverted.attached.header { | |
| background: #545454 -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05)); | |
| background: #545454 linear-gradient(transparent, rgba(0, 0, 0, 0.05)); | |
| box-shadow: none; | |
| border-color: transparent; | |
| } | |
| .ui.inverted.block.header { | |
| background: #545454 -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05)); | |
| background: #545454 linear-gradient(transparent, rgba(0, 0, 0, 0.05)); | |
| box-shadow: none; | |
| } | |
| .ui.inverted.block.header { | |
| border-bottom: none; | |
| } | |
| /*------------------- | |
| Colors | |
| --------------------*/ | |
| /*--- Red ---*/ | |
| .ui.red.header { | |
| color: #DB2828 !important; | |
| } | |
| a.ui.red.header:hover { | |
| color: #d01919 !important; | |
| } | |
| .ui.red.dividing.header { | |
| border-bottom: 2px solid #DB2828; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.red.header { | |
| color: #FF695E !important; | |
| } | |
| a.ui.inverted.red.header:hover { | |
| color: #ff5144 !important; | |
| } | |
| /*--- Orange ---*/ | |
| .ui.orange.header { | |
| color: #D26911 !important; | |
| } | |
| a.ui.orange.header:hover { | |
| color: #c35c07 !important; | |
| } | |
| .ui.orange.dividing.header { | |
| border-bottom: 2px solid #D26911; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.orange.header { | |
| color: #FF851B !important; | |
| } | |
| a.ui.inverted.orange.header:hover { | |
| color: #ff7701 !important; | |
| } | |
| /*--- Olive ---*/ | |
| .ui.olive.header { | |
| color: #B5CC18 !important; | |
| } | |
| a.ui.olive.header:hover { | |
| color: #a7bd0d !important; | |
| } | |
| .ui.olive.dividing.header { | |
| border-bottom: 2px solid #B5CC18; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.olive.header { | |
| color: #D9E778 !important; | |
| } | |
| a.ui.inverted.olive.header:hover { | |
| color: #d8ea5c !important; | |
| } | |
| /*--- Yellow ---*/ | |
| .ui.yellow.header { | |
| color: #FBBD08 !important; | |
| } | |
| a.ui.yellow.header:hover { | |
| color: #eaae00 !important; | |
| } | |
| .ui.yellow.dividing.header { | |
| border-bottom: 2px solid #FBBD08; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.yellow.header { | |
| color: #FFE21F !important; | |
| } | |
| a.ui.inverted.yellow.header:hover { | |
| color: #ffdf05 !important; | |
| } | |
| /*--- Green ---*/ | |
| .ui.green.header { | |
| color: #78CB5B !important; | |
| } | |
| a.ui.green.header:hover { | |
| color: #65cb41 !important; | |
| } | |
| .ui.green.dividing.header { | |
| border-bottom: 2px solid #78CB5B; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.green.header { | |
| color: #2ECC40 !important; | |
| } | |
| a.ui.inverted.green.header:hover { | |
| color: #22be34 !important; | |
| } | |
| /*--- Teal ---*/ | |
| .ui.teal.header { | |
| color: #00B5AD !important; | |
| } | |
| a.ui.teal.header:hover { | |
| color: #009c95 !important; | |
| } | |
| .ui.teal.dividing.header { | |
| border-bottom: 2px solid #00B5AD; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.teal.header { | |
| color: #6DFFFF !important; | |
| } | |
| a.ui.inverted.teal.header:hover { | |
| color: #54ffff !important; | |
| } | |
| /*--- Blue ---*/ | |
| .ui.blue.header { | |
| color: #80A6CD !important; | |
| } | |
| a.ui.blue.header:hover { | |
| color: #6999ca !important; | |
| } | |
| .ui.blue.dividing.header { | |
| border-bottom: 2px solid #80A6CD; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.blue.header { | |
| color: #54C8FF !important; | |
| } | |
| a.ui.inverted.blue.header:hover { | |
| color: #3ac0ff !important; | |
| } | |
| /*--- Violet ---*/ | |
| .ui.violet.header { | |
| color: #6435C9 !important; | |
| } | |
| a.ui.violet.header:hover { | |
| color: #5829bb !important; | |
| } | |
| .ui.violet.dividing.header { | |
| border-bottom: 2px solid #6435C9; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.violet.header { | |
| color: #A291FB !important; | |
| } | |
| a.ui.inverted.violet.header:hover { | |
| color: #8a73ff !important; | |
| } | |
| /*--- Purple ---*/ | |
| .ui.purple.header { | |
| color: #A333C8 !important; | |
| } | |
| a.ui.purple.header:hover { | |
| color: #9627ba !important; | |
| } | |
| .ui.purple.dividing.header { | |
| border-bottom: 2px solid #A333C8; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.purple.header { | |
| color: #DC73FF !important; | |
| } | |
| a.ui.inverted.purple.header:hover { | |
| color: #d65aff !important; | |
| } | |
| /*--- Pink ---*/ | |
| .ui.pink.header { | |
| color: #E03997 !important; | |
| } | |
| a.ui.pink.header:hover { | |
| color: #e61a8d !important; | |
| } | |
| .ui.pink.dividing.header { | |
| border-bottom: 2px solid #E03997; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.pink.header { | |
| color: #FF8EDF !important; | |
| } | |
| a.ui.inverted.pink.header:hover { | |
| color: #ff74d8 !important; | |
| } | |
| /*--- Brown ---*/ | |
| .ui.brown.header { | |
| color: #A5673F !important; | |
| } | |
| a.ui.brown.header:hover { | |
| color: #975b33 !important; | |
| } | |
| .ui.brown.dividing.header { | |
| border-bottom: 2px solid #A5673F; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.brown.header { | |
| color: #D67C1C !important; | |
| } | |
| a.ui.inverted.brown.header:hover { | |
| color: #c86f11 !important; | |
| } | |
| /*--- Grey ---*/ | |
| .ui.grey.header { | |
| color: #767676 !important; | |
| } | |
| a.ui.grey.header:hover { | |
| color: #838383 !important; | |
| } | |
| .ui.grey.dividing.header { | |
| border-bottom: 2px solid #767676; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.grey.header { | |
| color: #DCDDDE !important; | |
| } | |
| a.ui.inverted.grey.header:hover { | |
| color: #cfd0d2 !important; | |
| } | |
| /*------------------- | |
| Aligned | |
| --------------------*/ | |
| .ui.left.aligned.header { | |
| text-align: left; | |
| } | |
| .ui.right.aligned.header { | |
| text-align: right; | |
| } | |
| .ui.centered.header, | |
| .ui.center.aligned.header { | |
| text-align: center; | |
| } | |
| .ui.justified.header { | |
| text-align: justify; | |
| } | |
| .ui.justified.header:after { | |
| display: inline-block; | |
| content: ''; | |
| width: 100%; | |
| } | |
| /*------------------- | |
| Floated | |
| --------------------*/ | |
| .ui.floated.header, | |
| .ui[class*="left floated"].header { | |
| float: left; | |
| margin-top: 0em; | |
| margin-right: 0.5em; | |
| } | |
| .ui[class*="right floated"].header { | |
| float: right; | |
| margin-top: 0em; | |
| margin-left: 0.5em; | |
| } | |
| /*------------------- | |
| Fittted | |
| --------------------*/ | |
| .ui.fitted.header { | |
| padding: 0em; | |
| } | |
| /*------------------- | |
| Dividing | |
| --------------------*/ | |
| .ui.dividing.header { | |
| padding-bottom: 0.23076923rem; | |
| border-bottom: 1px solid rgba(0, 0, 0, 0.13); | |
| } | |
| .ui.dividing.header .sub.header { | |
| padding-bottom: 0.23076923rem; | |
| } | |
| .ui.dividing.header .icon { | |
| margin-bottom: 0em; | |
| } | |
| .ui.inverted.dividing.header { | |
| border-bottom-color: rgba(255, 255, 255, 0.1); | |
| } | |
| /*------------------- | |
| Block | |
| --------------------*/ | |
| .ui.block.header { | |
| background: #F3F4F5; | |
| padding: 0.69230769rem 1rem; | |
| box-shadow: none; | |
| border: 1px solid #DDDDDD; | |
| border-radius: 0.2307em; | |
| } | |
| .ui.tiny.block.header { | |
| font-size: 0.84615385rem; | |
| } | |
| .ui.small.block.header { | |
| font-size: 0.92307692rem; | |
| } | |
| .ui.block.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) { | |
| font-size: 1rem; | |
| } | |
| .ui.large.block.header { | |
| font-size: 1.15384615rem; | |
| } | |
| .ui.huge.block.header { | |
| font-size: 1.46153846rem; | |
| } | |
| /*------------------- | |
| Attached | |
| --------------------*/ | |
| .ui.attached.header { | |
| background: #FFFFFF; | |
| padding: 0.69230769rem 1rem; | |
| margin-left: -1px; | |
| margin-right: -1px; | |
| box-shadow: none; | |
| border: 1px solid #DDDDDD; | |
| } | |
| .ui.attached.block.header { | |
| background: #F3F4F5; | |
| } | |
| .ui.attached:not(.top):not(.bottom).header { | |
| margin-top: 0em; | |
| margin-bottom: 0em; | |
| border-top: none; | |
| border-radius: 0em; | |
| } | |
| .ui.top.attached.header { | |
| margin-bottom: 0em; | |
| border-radius: 0.2307em 0.2307em 0em 0em; | |
| } | |
| .ui.bottom.attached.header { | |
| margin-top: 0em; | |
| border-top: none; | |
| border-radius: 0em 0em 0.2307em 0.2307em; | |
| } | |
| /* Attached Sizes */ | |
| .ui.tiny.attached.header { | |
| font-size: 0.84615385em; | |
| } | |
| .ui.small.attached.header { | |
| font-size: 0.92307692em; | |
| } | |
| .ui.attached.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) { | |
| font-size: 1em; | |
| } | |
| .ui.large.attached.header { | |
| font-size: 1.15384615em; | |
| } | |
| .ui.huge.attached.header { | |
| font-size: 1.46153846em; | |
| } | |
| /*------------------- | |
| Sizing | |
| --------------------*/ | |
| .ui.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) { | |
| font-size: 1.28em; | |
| } | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - Input | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Standard | |
| *******************************/ | |
| /*-------------------- | |
| Inputs | |
| ---------------------*/ | |
| .ui.input { | |
| position: relative; | |
| font-weight: normal; | |
| font-style: normal; | |
| display: -webkit-inline-box; | |
| display: -webkit-inline-flex; | |
| display: -ms-inline-flexbox; | |
| display: inline-flex; | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| .ui.input input { | |
| margin: 0em; | |
| max-width: 100%; | |
| -webkit-box-flex: 1; | |
| -webkit-flex: 1 0 auto; | |
| -ms-flex: 1 0 auto; | |
| flex: 1 0 auto; | |
| outline: none; | |
| -webkit-tap-highlight-color: rgba(255, 255, 255, 0); | |
| text-align: left; | |
| line-height: 1.2142em; | |
| font-family: 'Arial', 'Helvetica Neue', Arial, Helvetica, sans-serif; | |
| padding: 0.43136154em 0.61538462em; | |
| background: #FFFFFF; | |
| border: 1px solid #CCCCCC; | |
| color: rgba(0, 0, 0, 0.87); | |
| border-radius: 0.2307em; | |
| -webkit-transition: box-shadow 0.1s ease, border-color 0.1s ease; | |
| transition: box-shadow 0.1s ease, border-color 0.1s ease; | |
| box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075) inset; | |
| } | |
| /*-------------------- | |
| Placeholder | |
| ---------------------*/ | |
| /* browsers require these rules separate */ | |
| .ui.input input::-webkit-input-placeholder { | |
| color: rgba(0, 0, 0, 0.4); | |
| } | |
| .ui.input input::-moz-placeholder { | |
| color: rgba(0, 0, 0, 0.4); | |
| } | |
| .ui.input input::-ms-input-placeholder { | |
| color: rgba(0, 0, 0, 0.4); | |
| } | |
| /******************************* | |
| States | |
| *******************************/ | |
| /*-------------------- | |
| Disabled | |
| ---------------------*/ | |
| .ui.disabled.input, | |
| .ui.input input[disabled] { | |
| opacity: 0.3; | |
| } | |
| .ui.disabled.input input { | |
| pointer-events: none; | |
| } | |
| /*-------------------- | |
| Active | |
| ---------------------*/ | |
| .ui.input input:active, | |
| .ui.input.down input { | |
| border-color: rgba(0, 0, 0, 0.3); | |
| background: #FAFAFA; | |
| color: rgba(0, 0, 0, 0.87); | |
| box-shadow: none; | |
| } | |
| /*-------------------- | |
| Loading | |
| ---------------------*/ | |
| .ui.loading.loading.input > i.icon:before { | |
| position: absolute; | |
| content: ''; | |
| top: 50%; | |
| left: 50%; | |
| margin: -0.69230769em 0em 0em -0.69230769em; | |
| width: 1.38461538em; | |
| height: 1.38461538em; | |
| border-radius: 500rem; | |
| border: 0.2em solid rgba(0, 0, 0, 0.1); | |
| } | |
| .ui.loading.loading.input > i.icon:after { | |
| position: absolute; | |
| content: ''; | |
| top: 50%; | |
| left: 50%; | |
| margin: -0.69230769em 0em 0em -0.69230769em; | |
| width: 1.38461538em; | |
| height: 1.38461538em; | |
| -webkit-animation: button-spin 0.6s linear; | |
| animation: button-spin 0.6s linear; | |
| -webkit-animation-iteration-count: infinite; | |
| animation-iteration-count: infinite; | |
| border-radius: 500rem; | |
| border-color: #767676 transparent transparent; | |
| border-style: solid; | |
| border-width: 0.2em; | |
| box-shadow: 0px 0px 0px 1px transparent; | |
| } | |
| /*-------------------- | |
| Focus | |
| ---------------------*/ | |
| .ui.input.focus input, | |
| .ui.input input:focus { | |
| border-color: #51A7E8; | |
| background: #FFFFFF; | |
| color: rgba(0, 0, 0, 0.8); | |
| box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075) inset, 0 0 5px rgba(81, 167, 232, 0.5); | |
| } | |
| .ui.input.focus input::-webkit-input-placeholder, | |
| .ui.input input:focus::-webkit-input-placeholder { | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| .ui.input.focus input::-moz-placeholder, | |
| .ui.input input:focus::-moz-placeholder { | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| .ui.input.focus input::-ms-input-placeholder, | |
| .ui.input input:focus::-ms-input-placeholder { | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| /*-------------------- | |
| Error | |
| ---------------------*/ | |
| .ui.input.error input { | |
| background-color: #FFF6F6; | |
| border-color: #E0B4B4; | |
| color: #9F3A38; | |
| box-shadow: none; | |
| } | |
| /* Error Placeholder */ | |
| .ui.input.error input::-webkit-input-placeholder { | |
| color: #e7bdbc; | |
| } | |
| .ui.input.error input::-moz-placeholder { | |
| color: #e7bdbc; | |
| } | |
| .ui.input.error input::-ms-input-placeholder { | |
| color: #e7bdbc; | |
| } | |
| /* Focused Error Placeholder */ | |
| .ui.input.error input:focus::-webkit-input-placeholder { | |
| color: #da9796; | |
| } | |
| .ui.input.error input:focus::-moz-placeholder { | |
| color: #da9796; | |
| } | |
| .ui.input.error input:focus::-ms-input-placeholder { | |
| color: #da9796; | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| /*-------------------- | |
| Transparent | |
| ---------------------*/ | |
| .ui.transparent.input input { | |
| border-color: transparent !important; | |
| background-color: transparent !important; | |
| padding: 0em !important; | |
| box-shadow: none !important; | |
| } | |
| /* Transparent Icon */ | |
| .ui.transparent.icon.input > i.icon { | |
| width: 1.1em; | |
| } | |
| .ui.transparent.icon.input > input { | |
| padding-left: 0em !important; | |
| padding-right: 2em !important; | |
| } | |
| .ui.transparent[class*="left icon"].input > input { | |
| padding-left: 2em !important; | |
| padding-right: 0em !important; | |
| } | |
| /* Transparent Inverted */ | |
| .ui.transparent.inverted.input { | |
| color: #FFFFFF; | |
| } | |
| .ui.transparent.inverted.input input { | |
| color: inherit; | |
| } | |
| .ui.transparent.inverted.input input::-webkit-input-placeholder { | |
| color: rgba(255, 255, 255, 0.5); | |
| } | |
| .ui.transparent.inverted.input input::-moz-placeholder { | |
| color: rgba(255, 255, 255, 0.5); | |
| } | |
| .ui.transparent.inverted.input input::-ms-input-placeholder { | |
| color: rgba(255, 255, 255, 0.5); | |
| } | |
| /*-------------------- | |
| Icon | |
| ---------------------*/ | |
| .ui.icon.input > i.icon { | |
| cursor: default; | |
| position: absolute; | |
| line-height: 1; | |
| text-align: center; | |
| top: 0px; | |
| right: 0px; | |
| margin: 0em; | |
| height: 100%; | |
| width: 2.17692308em; | |
| opacity: 0.5; | |
| border-radius: 0em 0.2307em 0.2307em 0em; | |
| -webkit-transition: opacity 0.3s ease; | |
| transition: opacity 0.3s ease; | |
| } | |
| .ui.icon.input > i.icon:not(.link) { | |
| pointer-events: none; | |
| } | |
| .ui.icon.input input { | |
| padding-right: 2.17692308em !important; | |
| } | |
| .ui.icon.input > i.icon:before, | |
| .ui.icon.input > i.icon:after { | |
| left: 0; | |
| position: absolute; | |
| text-align: center; | |
| top: 50%; | |
| width: 100%; | |
| margin-top: -0.5em; | |
| } | |
| .ui.icon.input > i.link.icon { | |
| cursor: pointer; | |
| } | |
| .ui.icon.input > i.circular.icon { | |
| top: 0.35em; | |
| right: 0.5em; | |
| } | |
| /* Left Icon Input */ | |
| .ui[class*="left icon"].input > i.icon { | |
| right: auto; | |
| left: 1px; | |
| border-radius: 0.2307em 0em 0em 0.2307em; | |
| } | |
| .ui[class*="left icon"].input > i.circular.icon { | |
| right: auto; | |
| left: 0.5em; | |
| } | |
| .ui[class*="left icon"].input > input { | |
| padding-left: 2.17692308em !important; | |
| padding-right: 0.61538462em !important; | |
| } | |
| /* Focus */ | |
| .ui.icon.input > input:focus ~ i.icon { | |
| opacity: 1; | |
| } | |
| /*-------------------- | |
| Labeled | |
| ---------------------*/ | |
| /* Adjacent Label */ | |
| .ui.labeled.input > .label { | |
| -webkit-box-flex: 0; | |
| -webkit-flex: 0 0 auto; | |
| -ms-flex: 0 0 auto; | |
| flex: 0 0 auto; | |
| margin: 0; | |
| font-size: 1em; | |
| } | |
| .ui.labeled.input > .label:not(.corner) { | |
| padding-top: 0.53846154em; | |
| padding-bottom: 0.53846154em; | |
| } | |
| /* Regular Label on Left */ | |
| .ui.labeled.input:not([class*="corner labeled"]) .label:first-child { | |
| border-top-right-radius: 0px; | |
| border-bottom-right-radius: 0px; | |
| } | |
| .ui.labeled.input:not([class*="corner labeled"]) .label:first-child + input { | |
| border-top-left-radius: 0px; | |
| border-bottom-left-radius: 0px; | |
| border-left-color: transparent; | |
| } | |
| .ui.labeled.input:not([class*="corner labeled"]) .label:first-child + input:focus { | |
| border-left-color: #51A7E8; | |
| } | |
| /* Regular Label on Right */ | |
| .ui[class*="right labeled"].input input { | |
| border-top-right-radius: 0px !important; | |
| border-bottom-right-radius: 0px !important; | |
| border-right-color: transparent !important; | |
| } | |
| .ui[class*="right labeled"].input input + .label { | |
| border-top-left-radius: 0px; | |
| border-bottom-left-radius: 0px; | |
| } | |
| .ui[class*="right labeled"].input input:focus { | |
| border-right-color: #51A7E8 !important; | |
| } | |
| /* Corner Label */ | |
| .ui.labeled.input .corner.label { | |
| top: 1px; | |
| right: 1px; | |
| font-size: 0.69230769em; | |
| border-radius: 0em 0.2307em 0em 0em; | |
| } | |
| /* Spacing with corner label */ | |
| .ui[class*="corner labeled"]:not([class*="left corner labeled"]).labeled.input input { | |
| padding-right: 2.5em !important; | |
| } | |
| .ui[class*="corner labeled"].icon.input:not([class*="left corner labeled"]) > input { | |
| padding-right: 3.25em !important; | |
| } | |
| .ui[class*="corner labeled"].icon.input:not([class*="left corner labeled"]) > .icon { | |
| margin-right: 1.25em; | |
| } | |
| /* Left Labeled */ | |
| .ui[class*="left corner labeled"].labeled.input input { | |
| padding-left: 2.5em !important; | |
| } | |
| .ui[class*="left corner labeled"].icon.input > input { | |
| padding-left: 3.25em !important; | |
| } | |
| .ui[class*="left corner labeled"].icon.input > .icon { | |
| margin-left: 1.25em; | |
| } | |
| /* Corner Label Position */ | |
| .ui.input > .ui.corner.label { | |
| top: 1px; | |
| right: 1px; | |
| } | |
| .ui.input > .ui.left.corner.label { | |
| right: auto; | |
| left: 1px; | |
| } | |
| /*-------------------- | |
| Action | |
| ---------------------*/ | |
| .ui.action.input > .button, | |
| .ui.action.input > .buttons { | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| -webkit-box-align: center; | |
| -webkit-align-items: center; | |
| -ms-flex-align: center; | |
| align-items: center; | |
| -webkit-box-flex: 0; | |
| -webkit-flex: 0 0 auto; | |
| -ms-flex: 0 0 auto; | |
| flex: 0 0 auto; | |
| } | |
| .ui.action.input > .button, | |
| .ui.action.input > .buttons > .button { | |
| padding-top: 0.53846154em; | |
| padding-bottom: 0.53846154em; | |
| margin: 0; | |
| } | |
| /* Button on Right */ | |
| .ui.action.input:not([class*="left action"]) > input { | |
| border-top-right-radius: 0px !important; | |
| border-bottom-right-radius: 0px !important; | |
| border-right-color: transparent !important; | |
| } | |
| .ui.action.input:not([class*="left action"]) > .dropdown, | |
| .ui.action.input:not([class*="left action"]) > .button, | |
| .ui.action.input:not([class*="left action"]) > .buttons > .button { | |
| border-radius: 0px; | |
| } | |
| .ui.action.input:not([class*="left action"]) > .dropdown:last-child, | |
| .ui.action.input:not([class*="left action"]) > .button:last-child, | |
| .ui.action.input:not([class*="left action"]) > .buttons:last-child > .button { | |
| border-radius: 0px 0.2307em 0.2307em 0px; | |
| } | |
| /* Input Focus */ | |
| .ui.action.input:not([class*="left action"]) input:focus { | |
| border-right-color: #51A7E8 !important; | |
| } | |
| /* Button on Left */ | |
| .ui[class*="left action"].input > input { | |
| border-top-left-radius: 0px !important; | |
| border-bottom-left-radius: 0px !important; | |
| border-left-color: transparent !important; | |
| } | |
| .ui[class*="left action"].input > .dropdown, | |
| .ui[class*="left action"].input > .button, | |
| .ui[class*="left action"].input > .buttons > .button { | |
| border-radius: 0px; | |
| } | |
| .ui[class*="left action"].input > .dropdown:first-child, | |
| .ui[class*="left action"].input > .button:first-child, | |
| .ui[class*="left action"].input > .buttons:first-child > .button { | |
| border-radius: 0.2307em 0px 0px 0.2307em; | |
| } | |
| /* Input Focus */ | |
| .ui[class*="left action"].input > input:focus { | |
| border-left-color: #51A7E8 !important; | |
| } | |
| /*-------------------- | |
| Inverted | |
| ---------------------*/ | |
| /* Standard */ | |
| .ui.inverted.input input { | |
| border: none; | |
| } | |
| /*-------------------- | |
| Fluid | |
| ---------------------*/ | |
| .ui.fluid.input { | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| } | |
| .ui.fluid.input > input { | |
| width: 0px !important; | |
| } | |
| /*-------------------- | |
| Size | |
| ---------------------*/ | |
| .ui.mini.input { | |
| font-size: 0.69230769em; | |
| } | |
| .ui.small.input { | |
| font-size: 0.92307692em; | |
| } | |
| .ui.input { | |
| font-size: 1em; | |
| } | |
| .ui.large.input { | |
| font-size: 1.15384615em; | |
| } | |
| .ui.big.input { | |
| font-size: 1.38461538em; | |
| } | |
| .ui.huge.input { | |
| font-size: 1.46153846em; | |
| } | |
| .ui.massive.input { | |
| font-size: 1.69230769em; | |
| } | |
| /******************************* | |
| Input | |
| *******************************/ | |
| /* Labeled Input has padding */ | |
| .ui.labeled.input { | |
| background-color: #FFFFFF; | |
| border: 1px solid #CCCCCC; | |
| border-radius: 0.2307em !important; | |
| } | |
| .ui.labeled.input input { | |
| box-shadow: none !important; | |
| border: none !important; | |
| } | |
| .ui.labeled.input .label { | |
| font-weight: normal; | |
| -webkit-align-self: center; | |
| -ms-flex-item-align: center; | |
| align-self: center; | |
| font-size: 12px; | |
| margin: 0.15384615rem; | |
| border-radius: 0.2307em !important; | |
| padding: 0.38461538em 0.61538462em !important; | |
| } | |
| /* GitHub Uses Focus Group with class name added */ | |
| .ui.labeled.input.focused { | |
| border-color: #51A7E8; | |
| box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075) inset, 0 0 5px rgba(81, 167, 232, 0.5); | |
| } | |
| .ui.labeled.input.focused .label { | |
| background-color: #E1EAF5; | |
| color: #4078C0; | |
| } | |
| /* Prevent button from matching padding */ | |
| .ui.action.input > .button, | |
| .ui.action.input > .buttons > .button { | |
| padding-top: 0px; | |
| padding-bottom: 0px; | |
| } | |
| .ui.action.input > .button .icon, | |
| .ui.action.input > .buttons > .button .icon { | |
| margin-top: -3px; | |
| } | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - Label | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Label | |
| *******************************/ | |
| .ui.label { | |
| display: inline-block; | |
| line-height: 1; | |
| vertical-align: baseline; | |
| margin: 0em 0.15384615em; | |
| background-color: #E8E8E8; | |
| background-image: none; | |
| padding: 0.5833em 0.833em; | |
| color: rgba(0, 0, 0, 0.6); | |
| text-transform: none; | |
| font-weight: bold; | |
| border: 0px solid transparent; | |
| border-radius: 0.30769231rem; | |
| -webkit-transition: background 0.1s ease; | |
| transition: background 0.1s ease; | |
| } | |
| .ui.label:first-child { | |
| margin-left: 0em; | |
| } | |
| .ui.label:last-child { | |
| margin-right: 0em; | |
| } | |
| /* Link */ | |
| a.ui.label { | |
| cursor: pointer; | |
| } | |
| /* Inside Link */ | |
| .ui.label > a { | |
| cursor: pointer; | |
| color: inherit; | |
| opacity: 0.5; | |
| -webkit-transition: 0.1s opacity ease; | |
| transition: 0.1s opacity ease; | |
| } | |
| .ui.label > a:hover { | |
| opacity: 1; | |
| } | |
| /* Image */ | |
| .ui.label > img { | |
| width: auto !important; | |
| vertical-align: middle; | |
| height: 2.1666em !important; | |
| } | |
| /* Icon */ | |
| .ui.label > .icon { | |
| width: auto; | |
| margin: 0em 0.75em 0em 0em; | |
| } | |
| /* Detail */ | |
| .ui.label > .detail { | |
| display: inline-block; | |
| vertical-align: top; | |
| font-weight: bold; | |
| margin-left: 1em; | |
| opacity: 0.8; | |
| } | |
| .ui.label > .detail .icon { | |
| margin: 0em 0.25em 0em 0em; | |
| } | |
| /* Removable label */ | |
| .ui.label > .close.icon, | |
| .ui.label > .delete.icon { | |
| cursor: pointer; | |
| margin-right: 0em; | |
| margin-left: 0.5em; | |
| font-size: 0.92307692em; | |
| opacity: 0.5; | |
| -webkit-transition: background 0.1s ease; | |
| transition: background 0.1s ease; | |
| } | |
| .ui.label > .delete.icon:hover { | |
| opacity: 1; | |
| } | |
| /*------------------- | |
| Group | |
| --------------------*/ | |
| .ui.labels > .label { | |
| margin: 0em 0.5em 0.5em 0em; | |
| } | |
| /*------------------- | |
| Coupling | |
| --------------------*/ | |
| .ui.header > .ui.label { | |
| margin-top: -0.29165em; | |
| } | |
| /* Remove border radius on attached segment */ | |
| .ui.attached.segment > .ui.top.left.attached.label, | |
| .ui.bottom.attached.segment > .ui.top.left.attached.label { | |
| border-top-left-radius: 0; | |
| } | |
| .ui.attached.segment > .ui.top.right.attached.label, | |
| .ui.bottom.attached.segment > .ui.top.right.attached.label { | |
| border-top-right-radius: 0; | |
| } | |
| .ui.top.attached.segment > .ui.bottom.left.attached.label { | |
| border-bottom-left-radius: 0; | |
| } | |
| .ui.top.attached.segment > .ui.bottom.right.attached.label { | |
| border-bottom-right-radius: 0; | |
| } | |
| /* Padding on next content after a label */ | |
| .ui.top.attached.label:first-child + :not(.attached) { | |
| margin-top: 2rem !important; | |
| } | |
| .ui.bottom.attached.label:first-child ~ :last-child:not(.attached) { | |
| margin-top: 0em; | |
| margin-bottom: 2rem !important; | |
| } | |
| /******************************* | |
| Types | |
| *******************************/ | |
| .ui.image.label { | |
| width: auto !important; | |
| margin-top: 0em; | |
| margin-bottom: 0em; | |
| max-width: 9999px; | |
| vertical-align: baseline; | |
| text-transform: none; | |
| background: #E8E8E8; | |
| padding: 0.5833em 0.833em 0.5833em 0.5em; | |
| border-radius: 0.30769231rem; | |
| box-shadow: none; | |
| } | |
| .ui.image.label img { | |
| display: inline-block; | |
| vertical-align: top; | |
| height: 2.1666em; | |
| margin: -0.5833em 0.5em -0.5833em -0.5em; | |
| border-radius: 0.30769231rem 0em 0em 0.30769231rem; | |
| } | |
| .ui.image.label .detail { | |
| background: rgba(0, 0, 0, 0.1); | |
| margin: -0.5833em -0.833em -0.5833em 0.5em; | |
| padding: 0.5833em 0.833em; | |
| border-radius: 0em 0.30769231rem 0.30769231rem 0em; | |
| } | |
| /*------------------- | |
| Tag | |
| --------------------*/ | |
| .ui.tag.labels .label, | |
| .ui.tag.label { | |
| margin-left: 1em; | |
| position: relative; | |
| padding-left: 1.5em; | |
| padding-right: 1.5em; | |
| border-radius: 0em 0.30769231rem 0.30769231rem 0em; | |
| -webkit-transition: none; | |
| transition: none; | |
| } | |
| .ui.tag.labels .label:before, | |
| .ui.tag.label:before { | |
| position: absolute; | |
| -webkit-transform: translateY(-50%) translateX(50%) rotate(-45deg); | |
| transform: translateY(-50%) translateX(50%) rotate(-45deg); | |
| top: 50%; | |
| right: 100%; | |
| content: ''; | |
| background-color: inherit; | |
| background-image: none; | |
| width: 1.56em; | |
| height: 1.56em; | |
| -webkit-transition: none; | |
| transition: none; | |
| } | |
| .ui.tag.labels .label:after, | |
| .ui.tag.label:after { | |
| position: absolute; | |
| content: ''; | |
| top: 50%; | |
| left: -0.25em; | |
| margin-top: -0.25em; | |
| background-color: #FFFFFF !important; | |
| width: 0.5em; | |
| height: 0.5em; | |
| box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, 0.3); | |
| border-radius: 500rem; | |
| } | |
| /*------------------- | |
| Corner Label | |
| --------------------*/ | |
| .ui.corner.label { | |
| position: absolute; | |
| top: 0em; | |
| right: 0em; | |
| margin: 0em; | |
| padding: 0em; | |
| text-align: center; | |
| border-color: #E8E8E8; | |
| width: 4em; | |
| height: 4em; | |
| z-index: 1; | |
| -webkit-transition: border-color 0.1s ease; | |
| transition: border-color 0.1s ease; | |
| } | |
| /* Icon Label */ | |
| .ui.corner.label { | |
| background-color: transparent !important; | |
| } | |
| .ui.corner.label:after { | |
| position: absolute; | |
| content: ""; | |
| right: 0em; | |
| top: 0em; | |
| z-index: -1; | |
| width: 0em; | |
| height: 0em; | |
| background-color: transparent !important; | |
| border-top: 0em solid transparent; | |
| border-right: 4em solid transparent; | |
| border-bottom: 4em solid transparent; | |
| border-left: 0em solid transparent; | |
| border-right-color: inherit; | |
| -webkit-transition: border-color 0.1s ease; | |
| transition: border-color 0.1s ease; | |
| } | |
| .ui.corner.label .icon { | |
| cursor: default; | |
| position: relative; | |
| top: 0.69230769em; | |
| left: 0.84615385em; | |
| font-size: 1.15384615em; | |
| margin: 0em; | |
| } | |
| /* Left Corner */ | |
| .ui.left.corner.label, | |
| .ui.left.corner.label:after { | |
| right: auto; | |
| left: 0em; | |
| } | |
| .ui.left.corner.label:after { | |
| border-top: 4em solid transparent; | |
| border-right: 4em solid transparent; | |
| border-bottom: 0em solid transparent; | |
| border-left: 0em solid transparent; | |
| border-top-color: inherit; | |
| } | |
| .ui.left.corner.label .icon { | |
| left: -0.84615385em; | |
| } | |
| /* Segment */ | |
| .ui.segment > .ui.corner.label { | |
| top: -1px; | |
| right: -1px; | |
| } | |
| .ui.segment > .ui.left.corner.label { | |
| right: auto; | |
| left: -1px; | |
| } | |
| /*------------------- | |
| Ribbon | |
| --------------------*/ | |
| .ui.ribbon.label { | |
| position: relative; | |
| margin: 0em; | |
| min-width: -webkit-max-content; | |
| min-width: -moz-max-content; | |
| min-width: max-content; | |
| border-radius: 0em 0.30769231rem 0.30769231rem 0em; | |
| border-color: rgba(0, 0, 0, 0.15); | |
| } | |
| .ui.ribbon.label:after { | |
| position: absolute; | |
| content: ''; | |
| top: 100%; | |
| left: 0%; | |
| background-color: transparent !important; | |
| border-style: solid; | |
| border-width: 0em 1.2em 1.2em 0em; | |
| border-color: transparent; | |
| border-right-color: inherit; | |
| width: 0em; | |
| height: 0em; | |
| } | |
| /* Positioning */ | |
| .ui.ribbon.label { | |
| left: calc( -1rem - 1.2em ); | |
| margin-right: -1.2em; | |
| padding-left: calc( 1rem + 1.2em ); | |
| padding-right: 1.2em; | |
| } | |
| .ui[class*="right ribbon"].label { | |
| left: calc(100% + 1rem + 1.2em ); | |
| padding-left: 1.2em; | |
| padding-right: calc( 1rem + 1.2em ); | |
| } | |
| /* Right Ribbon */ | |
| .ui[class*="right ribbon"].label { | |
| text-align: left; | |
| -webkit-transform: translateX(-100%); | |
| transform: translateX(-100%); | |
| border-radius: 0.30769231rem 0em 0em 0.30769231rem; | |
| } | |
| .ui[class*="right ribbon"].label:after { | |
| left: auto; | |
| right: 0%; | |
| border-style: solid; | |
| border-width: 1.2em 1.2em 0em 0em; | |
| border-color: transparent; | |
| border-top-color: inherit; | |
| } | |
| /* Inside Table */ | |
| .ui.image > .ribbon.label, | |
| .ui.card .image > .ribbon.label { | |
| position: absolute; | |
| top: 1rem; | |
| } | |
| .ui.card .image > .ui.ribbon.label, | |
| .ui.image > .ui.ribbon.label { | |
| left: calc( 0.05rem - 1.2em ); | |
| } | |
| .ui.card .image > .ui[class*="right ribbon"].label, | |
| .ui.image > .ui[class*="right ribbon"].label { | |
| left: calc(100% + -0.05rem + 1.2em ); | |
| padding-left: 0.833em; | |
| } | |
| /* Inside Table */ | |
| .ui.table td > .ui.ribbon.label { | |
| left: calc( -0.69230769em - 1.2em ); | |
| } | |
| .ui.table td > .ui[class*="right ribbon"].label { | |
| left: calc(100% + 0.69230769em + 1.2em ); | |
| padding-left: 0.833em; | |
| } | |
| /*------------------- | |
| Attached | |
| --------------------*/ | |
| .ui[class*="top attached"].label, | |
| .ui.attached.label { | |
| width: 100%; | |
| position: absolute; | |
| margin: 0em; | |
| top: 0em; | |
| left: 0em; | |
| padding: 0.75em 1em; | |
| border-radius: 0.23076923rem 0.23076923rem 0em 0em; | |
| } | |
| .ui[class*="bottom attached"].label { | |
| top: auto; | |
| bottom: 0em; | |
| border-radius: 0em 0em 0.23076923rem 0.23076923rem; | |
| } | |
| .ui[class*="top left attached"].label { | |
| width: auto; | |
| margin-top: 0em !important; | |
| border-radius: 0.23076923rem 0em 0.30769231rem 0em; | |
| } | |
| .ui[class*="top right attached"].label { | |
| width: auto; | |
| left: auto; | |
| right: 0em; | |
| border-radius: 0em 0.23076923rem 0em 0.30769231rem; | |
| } | |
| .ui[class*="bottom left attached"].label { | |
| width: auto; | |
| top: auto; | |
| bottom: 0em; | |
| border-radius: 0em 0.30769231rem 0em 0.23076923rem; | |
| } | |
| .ui[class*="bottom right attached"].label { | |
| top: auto; | |
| bottom: 0em; | |
| left: auto; | |
| right: 0em; | |
| width: auto; | |
| border-radius: 0.30769231rem 0em 0.23076923rem 0em; | |
| } | |
| /******************************* | |
| States | |
| *******************************/ | |
| /*------------------- | |
| Disabled | |
| --------------------*/ | |
| .ui.label.disabled { | |
| opacity: 0.5; | |
| } | |
| /*------------------- | |
| Hover | |
| --------------------*/ | |
| a.ui.labels .label:hover, | |
| a.ui.label:hover { | |
| background-color: #E0E0E0; | |
| border-color: #E0E0E0; | |
| background-image: none; | |
| color: rgba(0, 0, 0, 0.8); | |
| } | |
| .ui.labels a.label:hover:before, | |
| a.ui.label:hover:before { | |
| color: rgba(0, 0, 0, 0.8); | |
| } | |
| /*------------------- | |
| Active | |
| --------------------*/ | |
| .ui.active.label { | |
| background-color: #D0D0D0; | |
| border-color: #D0D0D0; | |
| background-image: none; | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| .ui.active.label:before { | |
| background-color: #D0D0D0; | |
| background-image: none; | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| /*------------------- | |
| Active Hover | |
| --------------------*/ | |
| a.ui.labels .active.label:hover, | |
| a.ui.active.label:hover { | |
| background-color: #C8C8C8; | |
| border-color: #C8C8C8; | |
| background-image: none; | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| .ui.labels a.active.label:ActiveHover:before, | |
| a.ui.active.label:ActiveHover:before { | |
| background-color: #C8C8C8; | |
| background-image: none; | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| /*------------------- | |
| Visible | |
| --------------------*/ | |
| .ui.labels.visible .label, | |
| .ui.label.visible { | |
| display: inline-block !important; | |
| } | |
| /*------------------- | |
| Hidden | |
| --------------------*/ | |
| .ui.labels.hidden .label, | |
| .ui.label.hidden { | |
| display: none !important; | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| /*------------------- | |
| Colors | |
| --------------------*/ | |
| /*--- Red ---*/ | |
| .ui.red.labels .label, | |
| .ui.red.label { | |
| background-color: #DB2828 !important; | |
| border-color: #DB2828 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Link */ | |
| .ui.red.labels .label:hover, | |
| a.ui.red.label:hover { | |
| background-color: #d01919 !important; | |
| border-color: #d01919 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Corner */ | |
| .ui.red.corner.label, | |
| .ui.red.corner.label:hover { | |
| background-color: transparent !important; | |
| } | |
| /* Ribbon */ | |
| .ui.red.ribbon.label { | |
| border-color: #b21e1e !important; | |
| } | |
| /* Basic */ | |
| .ui.basic.red.label { | |
| background-color: #FFFFFF !important; | |
| color: #DB2828 !important; | |
| border-color: #DB2828 !important; | |
| } | |
| .ui.basic.red.labels a.label:hover, | |
| a.ui.basic.red.label:hover { | |
| background-color: #FFFFFF !important; | |
| color: #d01919 !important; | |
| border-color: #d01919 !important; | |
| } | |
| /*--- Orange ---*/ | |
| .ui.orange.labels .label, | |
| .ui.orange.label { | |
| background-color: #D26911 !important; | |
| border-color: #D26911 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Link */ | |
| .ui.orange.labels .label:hover, | |
| a.ui.orange.label:hover { | |
| background-color: #c35c07 !important; | |
| border-color: #c35c07 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Corner */ | |
| .ui.orange.corner.label, | |
| .ui.orange.corner.label:hover { | |
| background-color: transparent !important; | |
| } | |
| /* Ribbon */ | |
| .ui.orange.ribbon.label { | |
| border-color: #a3510d !important; | |
| } | |
| /* Basic */ | |
| .ui.basic.orange.label { | |
| background-color: #FFFFFF !important; | |
| color: #D26911 !important; | |
| border-color: #D26911 !important; | |
| } | |
| .ui.basic.orange.labels a.label:hover, | |
| a.ui.basic.orange.label:hover { | |
| background-color: #FFFFFF !important; | |
| color: #c35c07 !important; | |
| border-color: #c35c07 !important; | |
| } | |
| /*--- Yellow ---*/ | |
| .ui.yellow.labels .label, | |
| .ui.yellow.label { | |
| background-color: #FBBD08 !important; | |
| border-color: #FBBD08 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Link */ | |
| .ui.yellow.labels .label:hover, | |
| a.ui.yellow.label:hover { | |
| background-color: #eaae00 !important; | |
| border-color: #eaae00 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Corner */ | |
| .ui.yellow.corner.label, | |
| .ui.yellow.corner.label:hover { | |
| background-color: transparent !important; | |
| } | |
| /* Ribbon */ | |
| .ui.yellow.ribbon.label { | |
| border-color: #cd9903 !important; | |
| } | |
| /* Basic */ | |
| .ui.basic.yellow.label { | |
| background-color: #FFFFFF !important; | |
| color: #FBBD08 !important; | |
| border-color: #FBBD08 !important; | |
| } | |
| .ui.basic.yellow.labels a.label:hover, | |
| a.ui.basic.yellow.label:hover { | |
| background-color: #FFFFFF !important; | |
| color: #eaae00 !important; | |
| border-color: #eaae00 !important; | |
| } | |
| /*--- Olive ---*/ | |
| .ui.olive.labels .label, | |
| .ui.olive.label { | |
| background-color: #B5CC18 !important; | |
| border-color: #B5CC18 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Link */ | |
| .ui.olive.labels .label:hover, | |
| a.ui.olive.label:hover { | |
| background-color: #a7bd0d !important; | |
| border-color: #a7bd0d !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Corner */ | |
| .ui.olive.corner.label, | |
| .ui.olive.corner.label:hover { | |
| background-color: transparent !important; | |
| } | |
| /* Ribbon */ | |
| .ui.olive.ribbon.label { | |
| border-color: #5bb83b !important; | |
| } | |
| /* Basic */ | |
| .ui.basic.olive.label { | |
| background-color: #FFFFFF !important; | |
| color: #B5CC18 !important; | |
| border-color: #B5CC18 !important; | |
| } | |
| .ui.basic.olive.labels a.label:hover, | |
| a.ui.basic.olive.label:hover { | |
| background-color: #FFFFFF !important; | |
| color: #a7bd0d !important; | |
| border-color: #a7bd0d !important; | |
| } | |
| /*--- Green ---*/ | |
| .ui.green.labels .label, | |
| .ui.green.label { | |
| background-color: #78CB5B !important; | |
| border-color: #78CB5B !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Link */ | |
| .ui.green.labels .label:hover, | |
| a.ui.green.label:hover { | |
| background-color: #65cb41 !important; | |
| border-color: #65cb41 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Corner */ | |
| .ui.green.corner.label, | |
| .ui.green.corner.label:hover { | |
| background-color: transparent !important; | |
| } | |
| /* Ribbon */ | |
| .ui.green.ribbon.label { | |
| border-color: #5bb83b !important; | |
| } | |
| /* Basic */ | |
| .ui.basic.green.label { | |
| background-color: #FFFFFF !important; | |
| color: #78CB5B !important; | |
| border-color: #78CB5B !important; | |
| } | |
| .ui.basic.green.labels a.label:hover, | |
| a.ui.basic.green.label:hover { | |
| background-color: #FFFFFF !important; | |
| color: #65cb41 !important; | |
| border-color: #65cb41 !important; | |
| } | |
| /*--- Teal ---*/ | |
| .ui.teal.labels .label, | |
| .ui.teal.label { | |
| background-color: #00B5AD !important; | |
| border-color: #00B5AD !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Link */ | |
| .ui.teal.labels .label:hover, | |
| a.ui.teal.label:hover { | |
| background-color: #009c95 !important; | |
| border-color: #009c95 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Corner */ | |
| .ui.teal.corner.label, | |
| .ui.teal.corner.label:hover { | |
| background-color: transparent !important; | |
| } | |
| /* Ribbon */ | |
| .ui.teal.ribbon.label { | |
| border-color: #00827c !important; | |
| } | |
| /* Basic */ | |
| .ui.basic.teal.label { | |
| background-color: #FFFFFF !important; | |
| color: #00B5AD !important; | |
| border-color: #00B5AD !important; | |
| } | |
| .ui.basic.teal.labels a.label:hover, | |
| a.ui.basic.teal.label:hover { | |
| background-color: #FFFFFF !important; | |
| color: #009c95 !important; | |
| border-color: #009c95 !important; | |
| } | |
| /*--- Blue ---*/ | |
| .ui.blue.labels .label, | |
| .ui.blue.label { | |
| background-color: #80A6CD !important; | |
| border-color: #80A6CD !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Link */ | |
| .ui.blue.labels .label:hover, | |
| a.ui.blue.label:hover { | |
| background-color: #6999ca !important; | |
| border-color: #6999ca !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Corner */ | |
| .ui.blue.corner.label, | |
| .ui.blue.corner.label:hover { | |
| background-color: transparent !important; | |
| } | |
| /* Ribbon */ | |
| .ui.blue.ribbon.label { | |
| border-color: #5b8cbf !important; | |
| } | |
| /* Basic */ | |
| .ui.basic.blue.label { | |
| background-color: #FFFFFF !important; | |
| color: #80A6CD !important; | |
| border-color: #80A6CD !important; | |
| } | |
| .ui.basic.blue.labels a.label:hover, | |
| a.ui.basic.blue.label:hover { | |
| background-color: #FFFFFF !important; | |
| color: #6999ca !important; | |
| border-color: #6999ca !important; | |
| } | |
| /*--- Violet ---*/ | |
| .ui.violet.labels .label, | |
| .ui.violet.label { | |
| background-color: #6435C9 !important; | |
| border-color: #6435C9 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Link */ | |
| .ui.violet.labels .label:hover, | |
| a.ui.violet.label:hover { | |
| background-color: #5829bb !important; | |
| border-color: #5829bb !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Corner */ | |
| .ui.violet.corner.label, | |
| .ui.violet.corner.label:hover { | |
| background-color: transparent !important; | |
| } | |
| /* Ribbon */ | |
| .ui.violet.ribbon.label { | |
| border-color: #502aa1 !important; | |
| } | |
| /* Basic */ | |
| .ui.basic.violet.label { | |
| background-color: #FFFFFF !important; | |
| color: #6435C9 !important; | |
| border-color: #6435C9 !important; | |
| } | |
| .ui.basic.violet.labels a.label:hover, | |
| a.ui.basic.violet.label:hover { | |
| background-color: #FFFFFF !important; | |
| color: #5829bb !important; | |
| border-color: #5829bb !important; | |
| } | |
| /*--- Purple ---*/ | |
| .ui.purple.labels .label, | |
| .ui.purple.label { | |
| background-color: #A333C8 !important; | |
| border-color: #A333C8 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Link */ | |
| .ui.purple.labels .label:hover, | |
| a.ui.purple.label:hover { | |
| background-color: #9627ba !important; | |
| border-color: #9627ba !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Corner */ | |
| .ui.purple.corner.label, | |
| .ui.purple.corner.label:hover { | |
| background-color: transparent !important; | |
| } | |
| /* Ribbon */ | |
| .ui.purple.ribbon.label { | |
| border-color: #82299f !important; | |
| } | |
| /* Basic */ | |
| .ui.basic.purple.label { | |
| background-color: #FFFFFF !important; | |
| color: #A333C8 !important; | |
| border-color: #A333C8 !important; | |
| } | |
| .ui.basic.purple.labels a.label:hover, | |
| a.ui.basic.purple.label:hover { | |
| background-color: #FFFFFF !important; | |
| color: #9627ba !important; | |
| border-color: #9627ba !important; | |
| } | |
| /*--- Pink ---*/ | |
| .ui.pink.labels .label, | |
| .ui.pink.label { | |
| background-color: #E03997 !important; | |
| border-color: #E03997 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Link */ | |
| .ui.pink.labels .label:hover, | |
| a.ui.pink.label:hover { | |
| background-color: #e61a8d !important; | |
| border-color: #e61a8d !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Corner */ | |
| .ui.pink.corner.label, | |
| .ui.pink.corner.label:hover { | |
| background-color: transparent !important; | |
| } | |
| /* Ribbon */ | |
| .ui.pink.ribbon.label { | |
| border-color: #c71f7e !important; | |
| } | |
| /* Basic */ | |
| .ui.basic.pink.label { | |
| background-color: #FFFFFF !important; | |
| color: #E03997 !important; | |
| border-color: #E03997 !important; | |
| } | |
| .ui.basic.pink.labels a.label:hover, | |
| a.ui.basic.pink.label:hover { | |
| background-color: #FFFFFF !important; | |
| color: #e61a8d !important; | |
| border-color: #e61a8d !important; | |
| } | |
| /*--- Brown ---*/ | |
| .ui.brown.labels .label, | |
| .ui.brown.label { | |
| background-color: #A5673F !important; | |
| border-color: #A5673F !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Link */ | |
| .ui.brown.labels .label:hover, | |
| a.ui.brown.label:hover { | |
| background-color: #975b33 !important; | |
| border-color: #975b33 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Corner */ | |
| .ui.brown.corner.label, | |
| .ui.brown.corner.label:hover { | |
| background-color: transparent !important; | |
| } | |
| /* Ribbon */ | |
| .ui.brown.ribbon.label { | |
| border-color: #805031 !important; | |
| } | |
| /* Basic */ | |
| .ui.basic.brown.label { | |
| background-color: #FFFFFF !important; | |
| color: #A5673F !important; | |
| border-color: #A5673F !important; | |
| } | |
| .ui.basic.brown.labels a.label:hover, | |
| a.ui.basic.brown.label:hover { | |
| background-color: #FFFFFF !important; | |
| color: #975b33 !important; | |
| border-color: #975b33 !important; | |
| } | |
| /*--- Grey ---*/ | |
| .ui.grey.labels .label, | |
| .ui.grey.label { | |
| background-color: #767676 !important; | |
| border-color: #767676 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Link */ | |
| .ui.grey.labels .label:hover, | |
| a.ui.grey.label:hover { | |
| background-color: #838383 !important; | |
| border-color: #838383 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Corner */ | |
| .ui.grey.corner.label, | |
| .ui.grey.corner.label:hover { | |
| background-color: transparent !important; | |
| } | |
| /* Ribbon */ | |
| .ui.grey.ribbon.label { | |
| border-color: #805031 !important; | |
| } | |
| /* Basic */ | |
| .ui.basic.grey.label { | |
| background-color: #FFFFFF !important; | |
| color: #767676 !important; | |
| border-color: #767676 !important; | |
| } | |
| .ui.basic.grey.labels a.label:hover, | |
| a.ui.basic.grey.label:hover { | |
| background-color: #FFFFFF !important; | |
| color: #838383 !important; | |
| border-color: #838383 !important; | |
| } | |
| /*--- Black ---*/ | |
| .ui.black.labels .label, | |
| .ui.black.label { | |
| background-color: #333333 !important; | |
| border-color: #333333 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Link */ | |
| .ui.black.labels .label:hover, | |
| a.ui.black.label:hover { | |
| background-color: #404040 !important; | |
| border-color: #404040 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Corner */ | |
| .ui.black.corner.label, | |
| .ui.black.corner.label:hover { | |
| background-color: transparent !important; | |
| } | |
| /* Ribbon */ | |
| .ui.black.ribbon.label { | |
| border-color: #805031 !important; | |
| } | |
| /* Basic */ | |
| .ui.basic.black.label { | |
| background-color: #FFFFFF !important; | |
| color: #333333 !important; | |
| border-color: #333333 !important; | |
| } | |
| .ui.basic.black.labels a.label:hover, | |
| a.ui.basic.black.label:hover { | |
| background-color: #FFFFFF !important; | |
| color: #404040 !important; | |
| border-color: #404040 !important; | |
| } | |
| /*------------------- | |
| Basic | |
| --------------------*/ | |
| .ui.basic.label { | |
| background: none #FFFFFF; | |
| border: 1px solid rgba(0, 0, 0, 0.13); | |
| color: rgba(0, 0, 0, 0.87); | |
| box-shadow: none; | |
| } | |
| /* Link */ | |
| a.ui.basic.label:hover { | |
| text-decoration: none; | |
| background: none #FFFFFF; | |
| color: #4078C0; | |
| box-shadow: 1px solid rgba(0, 0, 0, 0.13); | |
| box-shadow: none; | |
| } | |
| /* Pointing */ | |
| .ui.basic.pointing.label:before { | |
| border-color: inherit; | |
| } | |
| /*------------------- | |
| Fluid | |
| --------------------*/ | |
| .ui.label.fluid, | |
| .ui.fluid.labels > .label { | |
| width: 100%; | |
| box-sizing: border-box; | |
| } | |
| /*------------------- | |
| Inverted | |
| --------------------*/ | |
| .ui.inverted.labels .label, | |
| .ui.inverted.label { | |
| color: rgba(255, 255, 255, 0.9) !important; | |
| } | |
| /*------------------- | |
| Horizontal | |
| --------------------*/ | |
| .ui.horizontal.labels .label, | |
| .ui.horizontal.label { | |
| margin: 0em 0.5em 0em 0em; | |
| padding: 0.4em 0.833em; | |
| min-width: 3em; | |
| text-align: center; | |
| } | |
| /*------------------- | |
| Circular | |
| --------------------*/ | |
| .ui.circular.labels .label, | |
| .ui.circular.label { | |
| min-width: 2em; | |
| min-height: 2em; | |
| padding: 0.5em !important; | |
| line-height: 1em; | |
| text-align: center; | |
| border-radius: 500rem; | |
| } | |
| .ui.empty.circular.labels .label, | |
| .ui.empty.circular.label { | |
| min-width: 0em; | |
| min-height: 0em; | |
| overflow: hidden; | |
| width: 0.5em; | |
| height: 0.5em; | |
| vertical-align: baseline; | |
| } | |
| /*------------------- | |
| Pointing | |
| --------------------*/ | |
| .ui.pointing.label { | |
| position: relative; | |
| } | |
| .ui.attached.pointing.label { | |
| position: absolute; | |
| } | |
| .ui.pointing.label:before { | |
| background-color: inherit; | |
| background-image: inherit; | |
| border-width: none; | |
| border-style: solid; | |
| border-color: inherit; | |
| } | |
| /* Arrow */ | |
| .ui.pointing.label:before { | |
| position: absolute; | |
| content: ''; | |
| -webkit-transform: rotate(45deg); | |
| transform: rotate(45deg); | |
| background-image: none; | |
| z-index: 2; | |
| width: 0.6666em; | |
| height: 0.6666em; | |
| -webkit-transition: background 0.1s ease; | |
| transition: background 0.1s ease; | |
| } | |
| /*--- Above ---*/ | |
| .ui.pointing.label, | |
| .ui[class*="pointing above"].label { | |
| margin-top: 1em; | |
| } | |
| .ui.pointing.label:before, | |
| .ui[class*="pointing above"].label:before { | |
| border-width: 1px 0px 0px 1px; | |
| -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg); | |
| transform: translateX(-50%) translateY(-50%) rotate(45deg); | |
| top: 0%; | |
| left: 50%; | |
| } | |
| /*--- Below ---*/ | |
| .ui[class*="bottom pointing"].label, | |
| .ui[class*="pointing below"].label { | |
| margin-top: 0em; | |
| margin-bottom: 1em; | |
| } | |
| .ui[class*="bottom pointing"].label:before, | |
| .ui[class*="pointing below"].label:before { | |
| border-width: 0px 1px 1px 0px; | |
| top: auto; | |
| right: auto; | |
| -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg); | |
| transform: translateX(-50%) translateY(-50%) rotate(45deg); | |
| top: 100%; | |
| left: 50%; | |
| } | |
| /*--- Left ---*/ | |
| .ui[class*="left pointing"].label { | |
| margin-top: 0em; | |
| margin-left: 0.6666em; | |
| } | |
| .ui[class*="left pointing"].label:before { | |
| border-width: 0px 0px 1px 1px; | |
| -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg); | |
| transform: translateX(-50%) translateY(-50%) rotate(45deg); | |
| bottom: auto; | |
| right: auto; | |
| top: 50%; | |
| left: 0em; | |
| } | |
| /*--- Right ---*/ | |
| .ui[class*="right pointing"].label { | |
| margin-top: 0em; | |
| margin-right: 0.6666em; | |
| } | |
| .ui[class*="right pointing"].label:before { | |
| border-width: 1px 1px 0px 0px; | |
| -webkit-transform: translateX(50%) translateY(-50%) rotate(45deg); | |
| transform: translateX(50%) translateY(-50%) rotate(45deg); | |
| top: 50%; | |
| right: 0%; | |
| bottom: auto; | |
| left: auto; | |
| } | |
| /* Basic Pointing */ | |
| /*--- Above ---*/ | |
| .ui.basic.pointing.label:before, | |
| .ui.basic[class*="pointing above"].label:before { | |
| margin-top: -1px; | |
| } | |
| /*--- Below ---*/ | |
| .ui.basic[class*="bottom pointing"].label:before, | |
| .ui.basic[class*="pointing below"].label:before { | |
| bottom: auto; | |
| top: 100%; | |
| margin-top: 1px; | |
| } | |
| /*--- Left ---*/ | |
| .ui.basic[class*="left pointing"].label:before { | |
| top: 50%; | |
| left: -1px; | |
| } | |
| /*--- Right ---*/ | |
| .ui.basic[class*="right pointing"].label:before { | |
| top: 50%; | |
| right: -1px; | |
| } | |
| /*------------------ | |
| Floating Label | |
| -------------------*/ | |
| .ui.floating.label { | |
| position: absolute; | |
| z-index: 100; | |
| top: -1em; | |
| left: 100%; | |
| margin: 0em 0em 0em -1.5em !important; | |
| } | |
| /*------------------- | |
| Sizes | |
| --------------------*/ | |
| .ui.mini.labels .label, | |
| .ui.mini.label { | |
| font-size: 0.69230769rem; | |
| } | |
| .ui.tiny.labels .label, | |
| .ui.tiny.label { | |
| font-size: 0.76923077rem; | |
| } | |
| .ui.small.labels .label, | |
| .ui.small.label { | |
| font-size: 0.84615385rem; | |
| } | |
| .ui.labels .label, | |
| .ui.label { | |
| font-size: 0.92307692rem; | |
| } | |
| .ui.large.labels .label, | |
| .ui.large.label { | |
| font-size: 1rem; | |
| } | |
| .ui.big.labels .label, | |
| .ui.big.label { | |
| font-size: 1.38461538rem; | |
| } | |
| .ui.huge.labels .label, | |
| .ui.huge.label { | |
| font-size: 1.46153846rem; | |
| } | |
| .ui.massive.labels .label, | |
| .ui.massive.label { | |
| font-size: 1.69230769rem; | |
| } | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /* Notification Label on GitHub */ | |
| .ui.floating.blue.label { | |
| border: 2px solid #f3f3f3 !important; | |
| background-image: -webkit-linear-gradient(#7aa1d3, #4078c0) !important; | |
| background-image: linear-gradient(#7aa1d3, #4078c0) !important; | |
| } | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - List | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| List | |
| *******************************/ | |
| ul.ui.list, | |
| ol.ui.list, | |
| .ui.list { | |
| list-style-type: none; | |
| margin: 1em 0em; | |
| padding: 0em 0em; | |
| } | |
| ul.ui.list:first-child, | |
| ol.ui.list:first-child, | |
| .ui.list:first-child { | |
| margin-top: 0em; | |
| padding-top: 0em; | |
| } | |
| ul.ui.list:last-child, | |
| ol.ui.list:last-child, | |
| .ui.list:last-child { | |
| margin-bottom: 0em; | |
| padding-bottom: 0em; | |
| } | |
| /******************************* | |
| Content | |
| *******************************/ | |
| /* List Item */ | |
| ul.ui.list li, | |
| ol.ui.list li, | |
| .ui.list > .item, | |
| .ui.list .list > .item { | |
| display: list-item; | |
| table-layout: fixed; | |
| list-style-type: none; | |
| list-style-position: outside; | |
| padding: 0.21428571em 0em; | |
| line-height: 1.14285714em; | |
| } | |
| ul.ui.list > li:first-child:after, | |
| ol.ui.list > li:first-child:after, | |
| .ui.list > .list > .item, | |
| .ui.list > .item:after { | |
| content: ''; | |
| display: block; | |
| height: 0; | |
| clear: both; | |
| visibility: hidden; | |
| } | |
| ul.ui.list li:first-child, | |
| ol.ui.list li:first-child, | |
| .ui.list .list > .item:first-child, | |
| .ui.list > .item:first-child { | |
| padding-top: 0em; | |
| } | |
| ul.ui.list li:last-child, | |
| ol.ui.list li:last-child, | |
| .ui.list .list > .item:last-child, | |
| .ui.list > .item:last-child { | |
| padding-bottom: 0em; | |
| } | |
| /* Child List */ | |
| ul.ui.list ul, | |
| ol.ui.list ol, | |
| .ui.list .list { | |
| clear: both; | |
| margin: 0em; | |
| padding: 0.75em 0em 0.25em 0.5em; | |
| } | |
| /* Child Item */ | |
| ul.ui.list ul li, | |
| ol.ui.list ol li, | |
| .ui.list .list > .item { | |
| padding: 0.14285714em 0em; | |
| line-height: inherit; | |
| } | |
| /* Icon */ | |
| .ui.list .list > .item > i.icon, | |
| .ui.list > .item > i.icon { | |
| display: table-cell; | |
| margin: 0em; | |
| padding-top: 0.07142857em; | |
| padding-right: 0.28571429em; | |
| vertical-align: top; | |
| -webkit-transition: color 0.1s ease; | |
| transition: color 0.1s ease; | |
| } | |
| .ui.list .list > .item > i.icon:only-child, | |
| .ui.list > .item > i.icon:only-child { | |
| display: inline-block; | |
| vertical-align: top; | |
| } | |
| /* Image */ | |
| .ui.list .list > .item > .image, | |
| .ui.list > .item > .image { | |
| display: table-cell; | |
| background-color: transparent; | |
| margin: 0em; | |
| vertical-align: top; | |
| } | |
| .ui.list .list > .item > .image:not(:only-child):not(img), | |
| .ui.list > .item > .image:not(:only-child):not(img) { | |
| padding-right: 0.5em; | |
| } | |
| .ui.list .list > .item > .image img, | |
| .ui.list > .item > .image img { | |
| vertical-align: top; | |
| } | |
| .ui.list .list > .item > img.image, | |
| .ui.list .list > .item > .image:only-child, | |
| .ui.list > .item > img.image, | |
| .ui.list > .item > .image:only-child { | |
| display: inline-block; | |
| } | |
| /* Content */ | |
| .ui.list .list > .item > .content, | |
| .ui.list > .item > .content { | |
| line-height: 1.14285714em; | |
| } | |
| .ui.list .list > .item > .image + .content, | |
| .ui.list .list > .item > .icon + .content, | |
| .ui.list > .item > .image + .content, | |
| .ui.list > .item > .icon + .content { | |
| display: table-cell; | |
| padding: 0em 0em 0em 0.5em; | |
| vertical-align: top; | |
| } | |
| .ui.list .list > .item > img.image + .content, | |
| .ui.list > .item > img.image + .content { | |
| display: inline-block; | |
| } | |
| .ui.list .list > .item > .content > .list, | |
| .ui.list > .item > .content > .list { | |
| margin-left: 0em; | |
| padding-left: 0em; | |
| } | |
| /* Header */ | |
| .ui.list .list > .item .header, | |
| .ui.list > .item .header { | |
| display: block; | |
| margin: 0em; | |
| font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif; | |
| font-weight: bold; | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| /* Description */ | |
| .ui.list .list > .item .description, | |
| .ui.list > .item .description { | |
| display: block; | |
| color: rgba(0, 0, 0, 0.7); | |
| } | |
| /* Child Link */ | |
| .ui.list > .item a, | |
| .ui.list .list > .item a { | |
| cursor: pointer; | |
| } | |
| /* Linking Item */ | |
| .ui.list .list > a.item, | |
| .ui.list > a.item { | |
| cursor: pointer; | |
| color: #4183C4; | |
| } | |
| .ui.list .list > a.item:hover, | |
| .ui.list > a.item:hover { | |
| color: #1e70bf; | |
| } | |
| /* Linked Item Icons */ | |
| .ui.list .list > a.item i.icon, | |
| .ui.list > a.item i.icon { | |
| color: rgba(0, 0, 0, 0.4); | |
| } | |
| /* Header Link */ | |
| .ui.list .list > .item a.header, | |
| .ui.list > .item a.header { | |
| cursor: pointer; | |
| color: #4183C4 !important; | |
| } | |
| .ui.list .list > .item a.header:hover, | |
| .ui.list > .item a.header:hover { | |
| color: #1e70bf !important; | |
| } | |
| /* Floated Content */ | |
| .ui[class*="left floated"].list { | |
| float: left; | |
| } | |
| .ui[class*="right floated"].list { | |
| float: right; | |
| } | |
| .ui.list .list > .item [class*="left floated"], | |
| .ui.list > .item [class*="left floated"] { | |
| float: left; | |
| margin: 0em 1em 0em 0em; | |
| } | |
| .ui.list .list > .item [class*="right floated"], | |
| .ui.list > .item [class*="right floated"] { | |
| float: right; | |
| margin: 0em 0em 0em 1em; | |
| } | |
| /******************************* | |
| Coupling | |
| *******************************/ | |
| .ui.menu .ui.list > .item, | |
| .ui.menu .ui.list .list > .item { | |
| display: list-item; | |
| table-layout: fixed; | |
| background-color: transparent; | |
| list-style-type: none; | |
| list-style-position: outside; | |
| padding: 0.21428571em 0em; | |
| line-height: 1.14285714em; | |
| } | |
| .ui.menu .ui.list .list > .item:before, | |
| .ui.menu .ui.list > .item:before { | |
| border: none; | |
| background: none; | |
| } | |
| .ui.menu .ui.list .list > .item:first-child, | |
| .ui.menu .ui.list > .item:first-child { | |
| padding-top: 0em; | |
| } | |
| .ui.menu .ui.list .list > .item:last-child, | |
| .ui.menu .ui.list > .item:last-child { | |
| padding-bottom: 0em; | |
| } | |
| /******************************* | |
| Types | |
| *******************************/ | |
| /*------------------- | |
| Horizontal | |
| --------------------*/ | |
| .ui.horizontal.list { | |
| display: inline-block; | |
| font-size: 0em; | |
| } | |
| .ui.horizontal.list > .item { | |
| display: inline-block; | |
| margin-left: 1em; | |
| font-size: 1rem; | |
| } | |
| .ui.horizontal.list:not(.celled) > .item:first-child { | |
| margin-left: 0em !important; | |
| padding-left: 0em !important; | |
| } | |
| .ui.horizontal.list .list { | |
| padding-left: 0em; | |
| padding-bottom: 0em; | |
| } | |
| .ui.horizontal.list > .item > .image, | |
| .ui.horizontal.list .list > .item > .image, | |
| .ui.horizontal.list > .item > .icon, | |
| .ui.horizontal.list .list > .item > .icon, | |
| .ui.horizontal.list > .item > .content, | |
| .ui.horizontal.list .list > .item > .content { | |
| vertical-align: middle; | |
| } | |
| /* Padding on all elements */ | |
| .ui.horizontal.list > .item:first-child, | |
| .ui.horizontal.list > .item:last-child { | |
| padding-top: 0.21428571em; | |
| padding-bottom: 0.21428571em; | |
| } | |
| /* Horizontal List */ | |
| .ui.horizontal.list > .item > i.icon { | |
| margin: 0em; | |
| padding: 0em 0.25em 0em 0em; | |
| } | |
| .ui.horizontal.list > .item > .icon, | |
| .ui.horizontal.list > .item > .icon + .content { | |
| float: none; | |
| display: inline-block; | |
| } | |
| /******************************* | |
| States | |
| *******************************/ | |
| /*------------------- | |
| Disabled | |
| --------------------*/ | |
| .ui.list .list > .disabled.item, | |
| .ui.list > .disabled.item { | |
| pointer-events: none; | |
| color: rgba(40, 40, 40, 0.3) !important; | |
| } | |
| .ui.inverted.list .list > .disabled.item, | |
| .ui.inverted.list > .disabled.item { | |
| color: rgba(225, 225, 225, 0.3) !important; | |
| } | |
| /*------------------- | |
| Hover | |
| --------------------*/ | |
| .ui.list .list > a.item:hover .icon, | |
| .ui.list > a.item:hover .icon { | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| /*------------------- | |
| Inverted | |
| --------------------*/ | |
| .ui.inverted.list .list > a.item > .icon, | |
| .ui.inverted.list > a.item > .icon { | |
| color: rgba(255, 255, 255, 0.7); | |
| } | |
| .ui.inverted.list .list > .item .header, | |
| .ui.inverted.list > .item .header { | |
| color: rgba(255, 255, 255, 0.9); | |
| } | |
| .ui.inverted.list .list > .item .description, | |
| .ui.inverted.list > .item .description { | |
| color: rgba(255, 255, 255, 0.7); | |
| } | |
| /* Item Link */ | |
| .ui.inverted.list .list > a.item, | |
| .ui.inverted.list > a.item { | |
| cursor: pointer; | |
| color: rgba(255, 255, 255, 0.9); | |
| } | |
| .ui.inverted.list .list > a.item:hover, | |
| .ui.inverted.list > a.item:hover { | |
| color: #1e70bf; | |
| } | |
| /* Linking Content */ | |
| .ui.inverted.list .item a:not(.ui) { | |
| color: rgba(255, 255, 255, 0.9) !important; | |
| } | |
| .ui.inverted.list .item a:not(.ui):hover { | |
| color: #1e70bf !important; | |
| } | |
| /*------------------- | |
| Aligned | |
| --------------------*/ | |
| .ui.list[class*="top aligned"] .image, | |
| .ui.list[class*="top aligned"] .content, | |
| .ui.list [class*="top aligned"] { | |
| vertical-align: top !important; | |
| } | |
| .ui.list[class*="middle aligned"] .image, | |
| .ui.list[class*="middle aligned"] .content, | |
| .ui.list [class*="middle aligned"] { | |
| vertical-align: middle !important; | |
| } | |
| .ui.list[class*="bottom aligned"] .image, | |
| .ui.list[class*="bottom aligned"] .content, | |
| .ui.list [class*="bottom aligned"] { | |
| vertical-align: bottom !important; | |
| } | |
| /*------------------- | |
| Link | |
| --------------------*/ | |
| .ui.link.list .item, | |
| .ui.link.list a.item, | |
| .ui.link.list .item a:not(.ui) { | |
| color: rgba(0, 0, 0, 0.4); | |
| -webkit-transition: 0.1s color ease; | |
| transition: 0.1s color ease; | |
| } | |
| .ui.link.list a.item:hover, | |
| .ui.link.list .item a:not(.ui):hover { | |
| color: rgba(0, 0, 0, 0.8); | |
| } | |
| .ui.link.list a.item:active, | |
| .ui.link.list .item a:not(.ui):active { | |
| color: rgba(0, 0, 0, 0.9); | |
| } | |
| .ui.link.list .active.item, | |
| .ui.link.list .active.item a:not(.ui) { | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| /* Inverted */ | |
| .ui.inverted.link.list .item, | |
| .ui.inverted.link.list a.item, | |
| .ui.inverted.link.list .item a:not(.ui) { | |
| color: rgba(255, 255, 255, 0.5); | |
| } | |
| .ui.inverted.link.list a.item:hover, | |
| .ui.inverted.link.list .item a:not(.ui):hover { | |
| color: #ffffff; | |
| } | |
| .ui.inverted.link.list a.item:active, | |
| .ui.inverted.link.list .item a:not(.ui):active { | |
| color: #ffffff; | |
| } | |
| .ui.inverted.link.list a.active.item, | |
| .ui.inverted.link.list .active.item a:not(.ui) { | |
| color: #ffffff; | |
| } | |
| /*------------------- | |
| Selection | |
| --------------------*/ | |
| .ui.selection.list .list > .item, | |
| .ui.selection.list > .item { | |
| cursor: pointer; | |
| background: transparent; | |
| padding: 0.5em 0.5em; | |
| margin: 0em; | |
| color: rgba(0, 0, 0, 0.4); | |
| border-radius: 0.5em; | |
| -webkit-transition: 0.1s color ease, 0.1s padding-left ease, 0.1s background-color ease; | |
| transition: 0.1s color ease, 0.1s padding-left ease, 0.1s background-color ease; | |
| } | |
| .ui.selection.list .list > .item:last-child, | |
| .ui.selection.list > .item:last-child { | |
| margin-bottom: 0em; | |
| } | |
| .ui.selection.list.list > .item:hover, | |
| .ui.selection.list > .item:hover { | |
| background: rgba(0, 0, 0, 0.03); | |
| color: rgba(0, 0, 0, 0.8); | |
| } | |
| .ui.selection.list .list > .item:active, | |
| .ui.selection.list > .item:active { | |
| background: rgba(0, 0, 0, 0.05); | |
| color: rgba(0, 0, 0, 0.9); | |
| } | |
| .ui.selection.list .list > .item.active, | |
| .ui.selection.list > .item.active { | |
| background: rgba(0, 0, 0, 0.05); | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| /* Inverted */ | |
| .ui.inverted.selection.list > .item, | |
| .ui.inverted.selection.list > .item { | |
| background: transparent; | |
| color: rgba(255, 255, 255, 0.5); | |
| } | |
| .ui.inverted.selection.list > .item:hover, | |
| .ui.inverted.selection.list > .item:hover { | |
| background: rgba(255, 255, 255, 0.02); | |
| color: #ffffff; | |
| } | |
| .ui.inverted.selection.list > .item:active, | |
| .ui.inverted.selection.list > .item:active { | |
| background: rgba(255, 255, 255, 0.08); | |
| color: #ffffff; | |
| } | |
| .ui.inverted.selection.list > .item.active, | |
| .ui.inverted.selection.list > .item.active { | |
| background: rgba(255, 255, 255, 0.08); | |
| color: #ffffff; | |
| } | |
| /* Celled / Divided Selection List */ | |
| .ui.celled.selection.list .list > .item, | |
| .ui.divided.selection.list .list > .item, | |
| .ui.celled.selection.list > .item, | |
| .ui.divided.selection.list > .item { | |
| border-radius: 0em; | |
| } | |
| /*------------------- | |
| Animated | |
| --------------------*/ | |
| .ui.animated.list > .item { | |
| -webkit-transition: 0.25s color ease 0.1s, 0.25s padding-left ease 0.1s, 0.25s background-color ease 0.1s; | |
| transition: 0.25s color ease 0.1s, 0.25s padding-left ease 0.1s, 0.25s background-color ease 0.1s; | |
| } | |
| .ui.animated.list:not(.horizontal) > .item:hover { | |
| padding-left: 1em; | |
| } | |
| /*------------------- | |
| Fitted | |
| --------------------*/ | |
| .ui.fitted.list:not(.selection) .list > .item, | |
| .ui.fitted.list:not(.selection) > .item { | |
| padding-left: 0em; | |
| padding-right: 0em; | |
| } | |
| .ui.fitted.selection.list .list > .item, | |
| .ui.fitted.selection.list > .item { | |
| margin-left: -0.5em; | |
| margin-right: -0.5em; | |
| } | |
| /*------------------- | |
| Bulleted | |
| --------------------*/ | |
| ul.ui.list, | |
| .ui.bulleted.list { | |
| margin-left: 1.25rem; | |
| } | |
| ul.ui.list li, | |
| .ui.bulleted.list .list > .item, | |
| .ui.bulleted.list > .item { | |
| position: relative; | |
| } | |
| ul.ui.list li:before, | |
| .ui.bulleted.list .list > .item:before, | |
| .ui.bulleted.list > .item:before { | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; | |
| pointer-events: none; | |
| position: absolute; | |
| top: auto; | |
| left: auto; | |
| margin-left: -1.25rem; | |
| content: '•'; | |
| opacity: 1; | |
| color: inherit; | |
| vertical-align: top; | |
| } | |
| ul.ui.list ul, | |
| .ui.bulleted.list .list { | |
| padding-left: 1.25rem; | |
| } | |
| /* Horizontal Bulleted */ | |
| ul.ui.horizontal.bulleted.list, | |
| .ui.horizontal.bulleted.list { | |
| margin-left: 0em; | |
| } | |
| ul.ui.horizontal.bulleted.list li, | |
| .ui.horizontal.bulleted.list > .item { | |
| margin-left: 1.75rem; | |
| } | |
| ul.ui.horizontal.bulleted.list li:first-child, | |
| .ui.horizontal.bulleted.list > .item:first-child { | |
| margin-left: 0em; | |
| } | |
| ul.ui.horizontal.bulleted.list li::before, | |
| .ui.horizontal.bulleted.list > .item::before { | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| ul.ui.horizontal.bulleted.list li:first-child::before, | |
| .ui.horizontal.bulleted.list > .item:first-child::before { | |
| display: none; | |
| } | |
| /*------------------- | |
| Ordered | |
| --------------------*/ | |
| ol.ui.list, | |
| .ui.ordered.list, | |
| .ui.ordered.list .list, | |
| ol.ui.list ol { | |
| counter-reset: ordered; | |
| margin-left: 1.25rem; | |
| list-style-type: none; | |
| } | |
| ol.ui.list li, | |
| .ui.ordered.list .list > .item, | |
| .ui.ordered.list > .item { | |
| list-style-type: none; | |
| position: relative; | |
| } | |
| ol.ui.list li:before, | |
| .ui.ordered.list .list > .item:before, | |
| .ui.ordered.list > .item:before { | |
| position: absolute; | |
| top: auto; | |
| left: auto; | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; | |
| pointer-events: none; | |
| margin-left: -1.25rem; | |
| counter-increment: ordered; | |
| content: counters(ordered, ".") " "; | |
| text-align: right; | |
| color: rgba(0, 0, 0, 0.87); | |
| vertical-align: middle; | |
| opacity: 0.8; | |
| } | |
| ol.ui.inverted.list li:before, | |
| .ui.ordered.inverted.list .list > .item:before, | |
| .ui.ordered.inverted.list > .item:before { | |
| color: rgba(255, 255, 255, 0.7); | |
| } | |
| /* Value */ | |
| .ui.ordered.list > .list > .item[data-value], | |
| .ui.ordered.list > .item[data-value] { | |
| content: attr(data-value); | |
| } | |
| ol.ui.list li[value]:before { | |
| content: attr(value); | |
| } | |
| /* Child Lists */ | |
| ol.ui.list ol, | |
| .ui.ordered.list .list { | |
| margin-left: 1em; | |
| } | |
| ol.ui.list ol li:before, | |
| .ui.ordered.list .list > .item:before { | |
| margin-left: -2em; | |
| } | |
| /* Horizontal Ordered */ | |
| ol.ui.horizontal.list, | |
| .ui.ordered.horizontal.list { | |
| margin-left: 0em; | |
| } | |
| ol.ui.horizontal.list li:before, | |
| .ui.ordered.horizontal.list .list > .item:before, | |
| .ui.ordered.horizontal.list > .item:before { | |
| position: static; | |
| margin: 0em 0.5em 0em 0em; | |
| } | |
| /*------------------- | |
| Divided | |
| --------------------*/ | |
| .ui.divided.list > .item { | |
| border-top: 1px solid rgba(34, 36, 38, 0.15); | |
| } | |
| .ui.divided.list .list > .item { | |
| border-top: none; | |
| } | |
| .ui.divided.list .item .list > .item { | |
| border-top: none; | |
| } | |
| .ui.divided.list .list > .item:first-child, | |
| .ui.divided.list > .item:first-child { | |
| border-top: none; | |
| } | |
| /* Sub Menu */ | |
| .ui.divided.list:not(.horizontal) .list > .item:first-child { | |
| border-top-width: 1px; | |
| } | |
| /* Divided bulleted */ | |
| .ui.divided.bulleted.list:not(.horizontal), | |
| .ui.divided.bulleted.list .list { | |
| margin-left: 0em; | |
| padding-left: 0em; | |
| } | |
| .ui.divided.bulleted.list > .item:not(.horizontal) { | |
| padding-left: 1.25rem; | |
| } | |
| /* Divided Ordered */ | |
| .ui.divided.ordered.list { | |
| margin-left: 0em; | |
| } | |
| .ui.divided.ordered.list .list > .item, | |
| .ui.divided.ordered.list > .item { | |
| padding-left: 1.25rem; | |
| } | |
| .ui.divided.ordered.list .item .list { | |
| margin-left: 0em; | |
| margin-right: 0em; | |
| padding-bottom: 0.21428571em; | |
| } | |
| .ui.divided.ordered.list .item .list > .item { | |
| padding-left: 1em; | |
| } | |
| /* Divided Selection */ | |
| .ui.divided.selection.list .list > .item, | |
| .ui.divided.selection.list > .item { | |
| margin: 0em; | |
| border-radius: 0em; | |
| } | |
| /* Divided horizontal */ | |
| .ui.divided.horizontal.list { | |
| margin-left: 0em; | |
| } | |
| .ui.divided.horizontal.list > .item { | |
| border-top: none; | |
| border-left: 1px solid rgba(34, 36, 38, 0.15); | |
| margin: 0em; | |
| padding-left: 0.5em; | |
| padding-right: 0.5em; | |
| line-height: 0.6; | |
| } | |
| .ui.horizontal.divided.list > .item:first-child { | |
| border-left: none; | |
| } | |
| /* Inverted */ | |
| .ui.divided.inverted.list > .item, | |
| .ui.divided.inverted.list > .list, | |
| .ui.divided.inverted.horizontal.list > .item { | |
| border-color: rgba(255, 255, 255, 0.1); | |
| } | |
| /*------------------- | |
| Celled | |
| --------------------*/ | |
| .ui.celled.list > .item, | |
| .ui.celled.list > .list { | |
| border-top: 1px solid rgba(34, 36, 38, 0.15); | |
| padding-left: 0.5em; | |
| padding-right: 0.5em; | |
| } | |
| .ui.celled.list > .item:last-child { | |
| border-bottom: 1px solid rgba(34, 36, 38, 0.15); | |
| } | |
| /* Padding on all elements */ | |
| .ui.celled.list > .item:first-child, | |
| .ui.celled.list > .item:last-child { | |
| padding-top: 0.21428571em; | |
| padding-bottom: 0.21428571em; | |
| } | |
| /* Sub Menu */ | |
| .ui.celled.list .item .list > .item { | |
| border-width: 0px; | |
| } | |
| .ui.celled.list .list > .item:first-child { | |
| border-top-width: 0px; | |
| } | |
| /* Celled Bulleted */ | |
| .ui.celled.bulleted.list { | |
| margin-left: 0em; | |
| } | |
| .ui.celled.bulleted.list .list > .item, | |
| .ui.celled.bulleted.list > .item { | |
| padding-left: 1.25rem; | |
| } | |
| .ui.celled.bulleted.list .item .list { | |
| margin-left: -1.25rem; | |
| margin-right: -1.25rem; | |
| padding-bottom: 0.21428571em; | |
| } | |
| /* Celled Ordered */ | |
| .ui.celled.ordered.list { | |
| margin-left: 0em; | |
| } | |
| .ui.celled.ordered.list .list > .item, | |
| .ui.celled.ordered.list > .item { | |
| padding-left: 1.25rem; | |
| } | |
| .ui.celled.ordered.list .item .list { | |
| margin-left: 0em; | |
| margin-right: 0em; | |
| padding-bottom: 0.21428571em; | |
| } | |
| .ui.celled.ordered.list .list > .item { | |
| padding-left: 1em; | |
| } | |
| /* Celled Horizontal */ | |
| .ui.horizontal.celled.list { | |
| margin-left: 0em; | |
| } | |
| .ui.horizontal.celled.list .list > .item, | |
| .ui.horizontal.celled.list > .item { | |
| border-top: none; | |
| border-left: 1px solid rgba(34, 36, 38, 0.15); | |
| margin: 0em; | |
| padding-left: 0.5em; | |
| padding-right: 0.5em; | |
| line-height: 0.6; | |
| } | |
| .ui.horizontal.celled.list .list > .item:last-child, | |
| .ui.horizontal.celled.list > .item:last-child { | |
| border-bottom: none; | |
| border-right: 1px solid rgba(34, 36, 38, 0.15); | |
| } | |
| /* Inverted */ | |
| .ui.celled.inverted.list > .item, | |
| .ui.celled.inverted.list > .list { | |
| border-color: 1px solid rgba(255, 255, 255, 0.1); | |
| } | |
| .ui.celled.inverted.horizontal.list .list > .item, | |
| .ui.celled.inverted.horizontal.list > .item { | |
| border-color: 1px solid rgba(255, 255, 255, 0.1); | |
| } | |
| /*------------------- | |
| Relaxed | |
| --------------------*/ | |
| .ui.relaxed.list:not(.horizontal) > .item { | |
| padding-top: 0.42857143em; | |
| padding-bottom: 0.42857143em; | |
| } | |
| .ui.relaxed.list:not(.horizontal) .list > .item { | |
| padding-top: 0.21428571em; | |
| padding-bottom: 0.21428571em; | |
| } | |
| .ui.horizontal.relaxed.list > .item { | |
| padding-left: 1rem; | |
| padding-right: 1rem; | |
| } | |
| /* Very Relaxed */ | |
| .ui[class*="very relaxed"].list:not(.horizontal) > .item { | |
| padding-top: 0.85714286em; | |
| padding-bottom: 0.85714286em; | |
| } | |
| .ui[class*="very relaxed"].list:not(.horizontal) .list > .item { | |
| padding-top: 0.28571429em; | |
| padding-bottom: 0.28571429em; | |
| } | |
| .ui.horizontal[class*="very relaxed"].list .list > .item, | |
| .ui.horizontal[class*="very relaxed"].list > .item { | |
| padding-left: 1.5rem; | |
| padding-right: 1.5rem; | |
| } | |
| /*------------------- | |
| Sizes | |
| --------------------*/ | |
| .ui.mini.list { | |
| font-size: 0.71428571em; | |
| } | |
| .ui.tiny.list { | |
| font-size: 0.85714286em; | |
| } | |
| .ui.small.list { | |
| font-size: 0.92857143em; | |
| } | |
| .ui.list { | |
| font-size: 1em; | |
| } | |
| .ui.large.list { | |
| font-size: 1.14285714em; | |
| } | |
| .ui.big.list { | |
| font-size: 1.28571429em; | |
| } | |
| .ui.huge.list { | |
| font-size: 1.42857143em; | |
| } | |
| .ui.massive.list { | |
| font-size: 1.71428571em; | |
| } | |
| .ui.mini.horizontal.list .list > .item, | |
| .ui.mini.horizontal.list > .item { | |
| font-size: 0.71428571rem; | |
| } | |
| .ui.tiny.horizontal.list .list > .item, | |
| .ui.tiny.horizontal.list > .item { | |
| font-size: 0.85714286rem; | |
| } | |
| .ui.small.horizontal.list .list > .item, | |
| .ui.small.horizontal.list > .item { | |
| font-size: 0.92857143rem; | |
| } | |
| .ui.horizontal.list .list > .item, | |
| .ui.horizontal.list > .item { | |
| font-size: 1rem; | |
| } | |
| .ui.large.horizontal.list .list > .item, | |
| .ui.large.horizontal.list > .item { | |
| font-size: 1.14285714rem; | |
| } | |
| .ui.big.horizontal.list .list > .item, | |
| .ui.big.horizontal.list > .item { | |
| font-size: 1.28571429rem; | |
| } | |
| .ui.huge.horizontal.list .list > .item, | |
| .ui.huge.horizontal.list > .item { | |
| font-size: 1.42857143rem; | |
| } | |
| .ui.massive.horizontal.list .list > .item, | |
| .ui.massive.horizontal.list > .item { | |
| font-size: 1.71428571rem; | |
| } | |
| /******************************* | |
| Theme Overrides | |
| *******************************/ | |
| /******************************* | |
| User Variable Overrides | |
| *******************************/ | |
| /* | |
| * # Semantic - Menu | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributor | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Standard | |
| *******************************/ | |
| /*-------------- | |
| Menu | |
| ---------------*/ | |
| .ui.menu { | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| margin: 1rem 0em; | |
| font-family: 'Arial', 'Helvetica Neue', Arial, Helvetica, sans-serif; | |
| background: #FFFFFF; | |
| font-weight: normal; | |
| border: 1px solid rgba(0, 0, 0, 0.13); | |
| box-shadow: none; | |
| border-radius: 0.2307em; | |
| min-height: 2.84615385em; | |
| } | |
| .ui.menu:after { | |
| content: ''; | |
| display: block; | |
| height: 0px; | |
| clear: both; | |
| visibility: hidden; | |
| } | |
| .ui.menu:first-child { | |
| margin-top: 0rem; | |
| } | |
| .ui.menu:last-child { | |
| margin-bottom: 0rem; | |
| } | |
| /*-------------- | |
| Sub-Menu | |
| ---------------*/ | |
| .ui.menu .menu { | |
| margin: 0em; | |
| } | |
| .ui.menu:not(.vertical) > .menu { | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| } | |
| /*-------------- | |
| Item | |
| ---------------*/ | |
| .ui.menu:not(.vertical) .item { | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| -webkit-box-align: center; | |
| -webkit-align-items: center; | |
| -ms-flex-align: center; | |
| align-items: center; | |
| } | |
| .ui.menu .item { | |
| position: relative; | |
| vertical-align: middle; | |
| line-height: 1; | |
| text-decoration: none; | |
| -webkit-tap-highlight-color: transparent; | |
| -webkit-box-flex: 0; | |
| -webkit-flex: 0 0 auto; | |
| -ms-flex: 0 0 auto; | |
| flex: 0 0 auto; | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; | |
| background: none; | |
| padding: 0.92307692em 1.15384615em; | |
| text-transform: none; | |
| color: #767676; | |
| font-weight: normal; | |
| -webkit-transition: background 0.1s ease, box-shadow 0.1s ease, color 0.1s ease; | |
| transition: background 0.1s ease, box-shadow 0.1s ease, color 0.1s ease; | |
| } | |
| .ui.menu > .item:first-child { | |
| border-radius: 0.2307em 0px 0px 0.2307em; | |
| } | |
| /* Border */ | |
| .ui.menu .item:before { | |
| position: absolute; | |
| content: ''; | |
| top: 0%; | |
| right: 0px; | |
| height: 100%; | |
| width: 1px; | |
| background: rgba(0, 0, 0, 0.06); | |
| } | |
| /*-------------- | |
| Text Content | |
| ---------------*/ | |
| .ui.menu .text.item > *, | |
| .ui.menu .item > a:not(.ui), | |
| .ui.menu .item > p:only-child { | |
| -webkit-user-select: text; | |
| -moz-user-select: text; | |
| -ms-user-select: text; | |
| user-select: text; | |
| line-height: 1.3; | |
| } | |
| .ui.menu .item > p:first-child { | |
| margin-top: 0; | |
| } | |
| .ui.menu .item > p:last-child { | |
| margin-bottom: 0; | |
| } | |
| /*-------------- | |
| Icons | |
| ---------------*/ | |
| .ui.menu .item > i.icon { | |
| opacity: 0.5; | |
| float: none; | |
| margin: 0em 0.38461538em 0em 0em; | |
| } | |
| /*-------------- | |
| Button | |
| ---------------*/ | |
| .ui.menu:not(.vertical) .item > .button { | |
| position: relative; | |
| top: -0.15em; | |
| margin: -0.5em 0em; | |
| padding-bottom: 0.75em; | |
| padding-top: 0.75em; | |
| font-size: 1em; | |
| } | |
| /*---------------- | |
| Grid / Container | |
| -----------------*/ | |
| .ui.menu > .grid, | |
| .ui.menu > .container { | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| -webkit-box-align: inherit; | |
| -webkit-align-items: inherit; | |
| -ms-flex-align: inherit; | |
| align-items: inherit; | |
| -webkit-box-orient: vertical; | |
| -webkit-box-direction: normal; | |
| -webkit-flex-direction: inherit; | |
| -ms-flex-direction: inherit; | |
| flex-direction: inherit; | |
| } | |
| /*-------------- | |
| Inputs | |
| ---------------*/ | |
| .ui.menu .item > .input { | |
| width: 100%; | |
| } | |
| .ui.menu:not(.vertical) .item > .input { | |
| position: relative; | |
| top: 0em; | |
| margin: -0.5em 0em; | |
| } | |
| .ui.menu .item > .input input { | |
| font-size: 1em; | |
| padding-top: 0.46153846em; | |
| padding-bottom: 0.46153846em; | |
| } | |
| /*-------------- | |
| Header | |
| ---------------*/ | |
| .ui.menu .header.item, | |
| .ui.vertical.menu .header.item { | |
| margin: 0em; | |
| background: ''; | |
| text-transform: normal; | |
| font-weight: bold; | |
| } | |
| .ui.vertical.menu .item > .header:not(.ui) { | |
| margin: 0em 0em 0.5em; | |
| font-size: 1em; | |
| font-weight: bold; | |
| } | |
| /*-------------- | |
| Popup | |
| ---------------*/ | |
| .ui.menu .ui.popup { | |
| display: none; | |
| } | |
| .ui.menu .ui.visible.popup { | |
| display: block; | |
| } | |
| /*-------------- | |
| Dropdowns | |
| ---------------*/ | |
| /* Dropdown Icon */ | |
| .ui.menu .item > i.dropdown.icon { | |
| padding: 0em; | |
| float: right; | |
| margin: 0em 0em 0em 0.92307692em; | |
| } | |
| /* Menu */ | |
| .ui.menu .dropdown.item .menu { | |
| left: 0px; | |
| min-width: calc(100% - 1px); | |
| border-radius: 0em 0em 0.2307em 0.2307em; | |
| background: #FFFFFF; | |
| margin: 0em 0px 0px; | |
| box-shadow: 0px 3px 12px rgba(0, 0, 0, 0.15); | |
| -webkit-box-orient: vertical !important; | |
| -webkit-box-direction: normal !important; | |
| -webkit-flex-direction: column !important; | |
| -ms-flex-direction: column !important; | |
| flex-direction: column !important; | |
| } | |
| /* Menu Items */ | |
| .ui.menu .ui.dropdown .menu > .item { | |
| margin: 0; | |
| text-align: left; | |
| font-size: 1em !important; | |
| padding: 0.46153846em 1.07692308em !important; | |
| background: transparent !important; | |
| color: rgba(0, 0, 0, 0.87) !important; | |
| text-transform: none !important; | |
| font-weight: normal !important; | |
| box-shadow: none !important; | |
| -webkit-transition: none !important; | |
| transition: none !important; | |
| } | |
| .ui.menu .ui.dropdown .menu > .item:hover { | |
| background: #4078C0 !important; | |
| color: #FFFFFF !important; | |
| } | |
| .ui.menu .ui.dropdown .menu > .selected.item { | |
| background: rgba(0, 0, 0, 0.05) !important; | |
| color: rgba(0, 0, 0, 0.95) !important; | |
| } | |
| .ui.menu .ui.dropdown .menu > .active.item { | |
| background: rgba(0, 0, 0, 0.03) !important; | |
| font-weight: bold !important; | |
| color: rgba(0, 0, 0, 0.95) !important; | |
| } | |
| .ui.menu .ui.dropdown.item .menu .item:not(.filtered) { | |
| display: block; | |
| } | |
| .ui.menu .ui.dropdown .menu > .item .icon:not(.dropdown) { | |
| display: inline-block; | |
| font-size: 1em !important; | |
| float: none; | |
| margin: 0em 0.75em 0em 0em; | |
| } | |
| /* Secondary */ | |
| .ui.secondary.menu .dropdown.item > .menu, | |
| .ui.text.menu .dropdown.item > .menu { | |
| border-radius: 0.2307em; | |
| margin-top: 0.38461538em; | |
| } | |
| /* Pointing */ | |
| .ui.menu .pointing.dropdown.item .menu { | |
| margin-top: 0.75em; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.menu .search.dropdown.item > .search, | |
| .ui.inverted.menu .search.dropdown.item > .text { | |
| color: rgba(255, 255, 255, 0.9); | |
| } | |
| /* Vertical */ | |
| .ui.vertical.menu .dropdown.item > .icon { | |
| float: right; | |
| content: "\f0da"; | |
| margin-left: 1em; | |
| } | |
| .ui.vertical.menu .dropdown.item .menu { | |
| top: 0% !important; | |
| left: 100%; | |
| min-width: 0; | |
| margin: 0em 0em 0em 0em; | |
| box-shadow: 0 1px 3px 0px rgba(0, 0, 0, 0.08); | |
| border-radius: 0em 0.2307em 0.2307em 0.2307em; | |
| } | |
| .ui.vertical.menu .active.dropdown.item { | |
| border-top-right-radius: 0em; | |
| border-bottom-right-radius: 0em; | |
| } | |
| .ui.vertical.menu .dropdown.active.item { | |
| box-shadow: none; | |
| } | |
| /* Evenly Divided */ | |
| .ui.item.menu .dropdown .menu .item { | |
| width: 100%; | |
| } | |
| /*-------------- | |
| Labels | |
| ---------------*/ | |
| .ui.menu .item > .label { | |
| background: #EEEEEE; | |
| color: #666666; | |
| margin-left: 0.30769231rem; | |
| padding: 0.15384615em 0.38461538em; | |
| } | |
| .ui.vertical.menu .item > .label { | |
| background: #EEEEEE; | |
| color: #666666; | |
| margin-top: 0px; | |
| margin-bottom: 0px; | |
| padding: 0.15384615em 0.38461538em; | |
| } | |
| .ui.menu .item > .floating.label { | |
| padding: 0.15384615em 0.38461538em; | |
| } | |
| /*-------------- | |
| Images | |
| ---------------*/ | |
| .ui.menu .item > img:not(.ui) { | |
| display: inline-block; | |
| vertical-align: middle; | |
| margin: -0.3em 0em; | |
| width: 2.5em; | |
| } | |
| .ui.vertical.menu .item > img:not(.ui):only-child { | |
| display: block; | |
| max-width: 100%; | |
| width: auto; | |
| } | |
| /******************************* | |
| Coupling | |
| *******************************/ | |
| /*-------------- | |
| Sidebar | |
| ---------------*/ | |
| /* Show vertical dividers below last */ | |
| .ui.vertical.sidebar.menu > .item:first-child:before { | |
| display: block !important; | |
| } | |
| .ui.vertical.sidebar.menu > .item::before { | |
| top: auto; | |
| bottom: 0px; | |
| } | |
| /*-------------- | |
| Container | |
| ---------------*/ | |
| @media only screen and (max-width: 1048px) { | |
| .ui.menu > .ui.container { | |
| width: 100% !important; | |
| margin-left: 0em !important; | |
| margin-right: 0em !important; | |
| } | |
| } | |
| @media only screen and (min-width: 1049px) { | |
| .ui.menu:not(.secondary):not(.text):not(.tabular):not(.borderless) > .container > .item:not(.right):not(.borderless):first-child { | |
| border-left: 1px solid rgba(0, 0, 0, 0.06); | |
| } | |
| } | |
| /******************************* | |
| States | |
| *******************************/ | |
| /*-------------- | |
| Hover | |
| ---------------*/ | |
| .ui.link.menu .item:hover, | |
| .ui.menu .dropdown.item:hover, | |
| .ui.menu .link.item:hover, | |
| .ui.menu a.item:hover { | |
| cursor: pointer; | |
| background: none transparent; | |
| color: #4078C0; | |
| } | |
| /*-------------- | |
| Pressed | |
| ---------------*/ | |
| .ui.link.menu .item:active, | |
| .ui.menu .link.item:active, | |
| .ui.menu a.item:active { | |
| background: none transparent; | |
| color: #4078C0; | |
| } | |
| /*-------------- | |
| Active | |
| ---------------*/ | |
| .ui.menu .active.item { | |
| background: rgba(0, 0, 0, 0.05); | |
| color: rgba(0, 0, 0, 0.95); | |
| font-weight: normal; | |
| box-shadow: none; | |
| } | |
| .ui.menu .active.item > i.icon { | |
| opacity: 1; | |
| } | |
| /*-------------- | |
| Active Hover | |
| ---------------*/ | |
| .ui.menu .active.item:hover, | |
| .ui.vertical.menu .active.item:hover { | |
| background-color: rgba(0, 0, 0, 0.05); | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| /*-------------- | |
| Disabled | |
| ---------------*/ | |
| .ui.menu .item.disabled, | |
| .ui.menu .item.disabled:hover { | |
| cursor: default; | |
| background-color: transparent !important; | |
| color: rgba(40, 40, 40, 0.3); | |
| } | |
| /******************************* | |
| Types | |
| *******************************/ | |
| /*------------------ | |
| Floated Menu / Item | |
| -------------------*/ | |
| /* Left Floated */ | |
| .ui.menu:not(.vertical) .left.item, | |
| .ui.menu:not(.vertical) .left.menu { | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| margin-right: auto !important; | |
| } | |
| /* Right Floated */ | |
| .ui.menu:not(.vertical) .right.item, | |
| .ui.menu:not(.vertical) .right.menu { | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| margin-left: auto !important; | |
| } | |
| /* Swapped Borders */ | |
| .ui.menu .right.item::before, | |
| .ui.menu .right.menu > .item::before { | |
| right: auto; | |
| left: 0; | |
| } | |
| /*-------------- | |
| Vertical | |
| ---------------*/ | |
| .ui.vertical.menu { | |
| display: block; | |
| -webkit-box-orient: vertical; | |
| -webkit-box-direction: normal; | |
| -webkit-flex-direction: column; | |
| -ms-flex-direction: column; | |
| flex-direction: column; | |
| background: #FFFFFF; | |
| box-shadow: none; | |
| } | |
| /*--- Item ---*/ | |
| .ui.vertical.menu .item { | |
| display: block; | |
| background: -webkit-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.02)); | |
| background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.02)); | |
| border-top: none; | |
| border-right: none; | |
| } | |
| .ui.vertical.menu > .item:first-child { | |
| border-radius: 0.2307em 0.2307em 0px 0px; | |
| } | |
| .ui.vertical.menu > .item:last-child { | |
| border-radius: 0px 0px 0.2307em 0.2307em; | |
| } | |
| /*--- Label ---*/ | |
| .ui.vertical.menu .item > .label { | |
| float: right; | |
| text-align: center; | |
| } | |
| /*--- Icon ---*/ | |
| .ui.vertical.menu .item > i.icon { | |
| width: 1.18em; | |
| float: none; | |
| margin: 0em 0.07692308em 0em 0em; | |
| } | |
| .ui.vertical.menu .item > .label + i.icon { | |
| float: none; | |
| margin: 0em 0.5em 0em 0em; | |
| } | |
| /*--- Border ---*/ | |
| .ui.vertical.menu .item:before { | |
| position: absolute; | |
| content: ''; | |
| top: 0%; | |
| left: 0px; | |
| width: 100%; | |
| background: rgba(0, 0, 0, 0.06); | |
| height: 1px; | |
| } | |
| .ui.vertical.menu .item:first-child:before { | |
| display: none !important; | |
| } | |
| /*--- Sub Menu ---*/ | |
| .ui.vertical.menu .item > .menu { | |
| margin: 0.5em -1.15384615em 0em; | |
| } | |
| .ui.vertical.menu .menu .item { | |
| background: none; | |
| padding: 0.5em 1.34615385em; | |
| font-size: 0.84615385em; | |
| color: rgba(0, 0, 0, 0.5); | |
| } | |
| .ui.vertical.menu .item .menu a.item:hover, | |
| .ui.vertical.menu .item .menu .link.item:hover { | |
| color: rgba(0, 0, 0, 0.85); | |
| } | |
| .ui.vertical.menu .menu .item:before { | |
| display: none; | |
| } | |
| /* Vertical Active */ | |
| .ui.vertical.menu .active.item { | |
| background: rgba(0, 0, 0, 0.05); | |
| border-radius: 0em; | |
| box-shadow: none; | |
| } | |
| .ui.vertical.menu > .active.item:first-child { | |
| border-radius: 0.2307em 0.2307em 0em 0em; | |
| } | |
| .ui.vertical.menu > .active.item:last-child { | |
| border-radius: 0em 0em 0.2307em 0.2307em; | |
| } | |
| .ui.vertical.menu > .active.item:only-child { | |
| border-radius: 0.2307em; | |
| } | |
| .ui.vertical.menu .active.item .menu .active.item { | |
| border-left: none; | |
| } | |
| .ui.vertical.menu .item .menu .active.item { | |
| background-color: transparent; | |
| font-weight: bold; | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| /*-------------- | |
| Tabular | |
| ---------------*/ | |
| .ui.tabular.menu { | |
| border-radius: 0em; | |
| box-shadow: none !important; | |
| border: none; | |
| background: none transparent; | |
| border-bottom: 1px solid #EEEEEE; | |
| } | |
| .ui.tabular.fluid.menu { | |
| width: calc(100% + 2px ) !important; | |
| } | |
| .ui.tabular.menu .item { | |
| background: transparent; | |
| border-bottom: none; | |
| border-left: 1px solid transparent; | |
| border-right: 1px solid transparent; | |
| border-top: 2px solid transparent; | |
| padding: 0.53846154em 1.15384em; | |
| color: #767676; | |
| } | |
| .ui.tabular.menu .item:before { | |
| display: none; | |
| } | |
| /* Hover */ | |
| .ui.tabular.menu .item:hover { | |
| background-color: transparent; | |
| color: rgba(0, 0, 0, 0.8); | |
| } | |
| /* Active */ | |
| .ui.tabular.menu .active.item { | |
| background: none #FFFFFF; | |
| color: rgba(0, 0, 0, 0.95); | |
| border-top-width: 1px; | |
| border-color: #EEEEEE; | |
| font-weight: bold; | |
| margin-bottom: -1px; | |
| box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05); | |
| border-radius: 0.2307em 0.2307em 0px 0px !important; | |
| } | |
| /* Coupling with segment for attachment */ | |
| .ui.tabular.menu + .attached:not(.top).segment, | |
| .ui.tabular.menu + .attached:not(.top).segment + .attached:not(.top).segment { | |
| border-top: none; | |
| margin: 0px; | |
| width: 100%; | |
| } | |
| .top.attached.segment + .ui.bottom.tabular.menu { | |
| position: relative; | |
| width: calc(100% + 2px ); | |
| left: -1px; | |
| } | |
| /* Bottom Vertical Tabular */ | |
| .ui.bottom.tabular.menu { | |
| background: none transparent; | |
| border-radius: 0em; | |
| box-shadow: none !important; | |
| border-bottom: none; | |
| border-top: 1px solid #EEEEEE; | |
| } | |
| .ui.bottom.tabular.menu .item { | |
| background: none; | |
| border-left: 1px solid transparent; | |
| border-right: 1px solid transparent; | |
| border-bottom: 1px solid transparent; | |
| border-top: none; | |
| } | |
| .ui.bottom.tabular.menu .active.item { | |
| background: none #FFFFFF; | |
| color: rgba(0, 0, 0, 0.95); | |
| border-color: #EEEEEE; | |
| margin: -1px 0px 0px 0px; | |
| border-radius: 0px 0px 0.2307em 0.2307em !important; | |
| } | |
| /* Vertical Tabular (Left) */ | |
| .ui.vertical.tabular.menu { | |
| background: -webkit-linear-gradient(right, #f6f6f6 0%, #fff 8px) transparent; | |
| background: linear-gradient(to left, #f6f6f6 0%, #fff 8px) transparent; | |
| border-radius: 0em; | |
| box-shadow: none !important; | |
| border-bottom: none; | |
| border-right: 1px solid #EEEEEE; | |
| } | |
| .ui.vertical.tabular.menu .item { | |
| background: none; | |
| border-left: 1px solid transparent; | |
| border-bottom: 1px solid transparent; | |
| border-top: 1px solid transparent; | |
| border-right: none; | |
| } | |
| .ui.vertical.tabular.menu .active.item { | |
| background: none #FFFFFF; | |
| color: rgba(0, 0, 0, 0.95); | |
| border-color: #EEEEEE; | |
| margin: 0px -1px 0px 0px; | |
| border-radius: 0.2307em 0px 0px 0.2307em !important; | |
| } | |
| /* Vertical Right Tabular */ | |
| .ui.vertical.right.tabular.menu { | |
| background: -webkit-linear-gradient(right, #f6f6f6 0%, #fff 8px) transparent; | |
| background: linear-gradient(to left, #f6f6f6 0%, #fff 8px) transparent; | |
| border-radius: 0em; | |
| box-shadow: none !important; | |
| border-bottom: none; | |
| border-right: none; | |
| border-left: 1px solid #EEEEEE; | |
| } | |
| .ui.vertical.right.tabular.menu .item { | |
| background: none; | |
| border-right: 1px solid transparent; | |
| border-bottom: 1px solid transparent; | |
| border-top: 1px solid transparent; | |
| border-left: none; | |
| } | |
| .ui.vertical.right.tabular.menu .active.item { | |
| background: none #FFFFFF; | |
| color: rgba(0, 0, 0, 0.95); | |
| border-color: #EEEEEE; | |
| margin: 0px 0px 0px -1px; | |
| border-radius: 0px 0.2307em 0.2307em 0px !important; | |
| } | |
| /* Dropdown */ | |
| .ui.tabular.menu .active.dropdown.item { | |
| margin-bottom: 0px; | |
| border-left: 1px solid transparent; | |
| border-right: 1px solid transparent; | |
| border-top: 2px solid transparent; | |
| border-bottom: none; | |
| } | |
| /*-------------- | |
| Pagination | |
| ---------------*/ | |
| .ui.pagination.menu { | |
| margin: 0em; | |
| display: -webkit-inline-box; | |
| display: -webkit-inline-flex; | |
| display: -ms-inline-flexbox; | |
| display: inline-flex; | |
| vertical-align: middle; | |
| } | |
| .ui.pagination.menu .item:last-child { | |
| border-radius: 0em 0.2307em 0.2307em 0em; | |
| } | |
| .ui.compact.menu .item:last-child { | |
| border-radius: 0em 0.2307em 0.2307em 0em; | |
| } | |
| .ui.pagination.menu .item:last-child:before { | |
| display: none; | |
| } | |
| .ui.pagination.menu .item { | |
| min-width: 3.5em; | |
| text-align: center; | |
| } | |
| .ui.pagination.menu .icon.item i.icon { | |
| vertical-align: top; | |
| } | |
| /* Active */ | |
| .ui.pagination.menu .active.item { | |
| border-top: none; | |
| padding-top: 0.92307692em; | |
| background-color: rgba(0, 0, 0, 0.05); | |
| color: rgba(0, 0, 0, 0.95); | |
| box-shadow: none; | |
| } | |
| /*-------------- | |
| Secondary | |
| ---------------*/ | |
| .ui.secondary.menu { | |
| background: none; | |
| margin-left: -0.38461538em; | |
| margin-right: -0.38461538em; | |
| border-radius: 0em; | |
| border: none; | |
| box-shadow: none; | |
| } | |
| /* Item */ | |
| .ui.secondary.menu .item { | |
| -webkit-align-self: center; | |
| -ms-flex-item-align: center; | |
| align-self: center; | |
| box-shadow: none; | |
| border: none; | |
| padding: 0.69230769em 0.92307692em; | |
| margin: 0em 0.38461538em; | |
| background: none; | |
| -webkit-transition: color 0.1s ease; | |
| transition: color 0.1s ease; | |
| border-radius: 0.2307em; | |
| } | |
| /* No Divider */ | |
| .ui.secondary.menu .item:before { | |
| display: none !important; | |
| } | |
| /* Header */ | |
| .ui.secondary.menu .header.item { | |
| border-radius: 0em; | |
| border-right: none; | |
| background: none transparent; | |
| } | |
| /* Image */ | |
| .ui.secondary.menu .item > img:not(.ui) { | |
| margin: 0em; | |
| } | |
| /* Hover */ | |
| .ui.secondary.menu .dropdown.item:hover, | |
| .ui.secondary.menu .link.item:hover, | |
| .ui.secondary.menu a.item:hover { | |
| background: rgba(0, 0, 0, 0.05); | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| /* Active */ | |
| .ui.secondary.menu .active.item { | |
| box-shadow: none; | |
| background: rgba(0, 0, 0, 0.05); | |
| color: rgba(0, 0, 0, 0.95); | |
| border-radius: 0.2307em; | |
| } | |
| /* Active Hover */ | |
| .ui.secondary.menu .active.item:hover { | |
| box-shadow: none; | |
| background: rgba(0, 0, 0, 0.05); | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| /* Inverted */ | |
| .ui.secondary.inverted.menu .link.item, | |
| .ui.secondary.inverted.menu a.item { | |
| color: rgba(255, 255, 255, 0.7) !important; | |
| } | |
| .ui.secondary.inverted.menu .dropdown.item:hover, | |
| .ui.secondary.inverted.menu .link.item:hover, | |
| .ui.secondary.inverted.menu a.item:hover { | |
| background: rgba(255, 255, 255, 0.08); | |
| color: #ffffff !important; | |
| } | |
| .ui.secondary.inverted.menu .active.item { | |
| background: rgba(255, 255, 255, 0.15); | |
| color: #ffffff !important; | |
| } | |
| /* Fix item margins */ | |
| .ui.secondary.item.menu { | |
| margin-left: 0em; | |
| margin-right: 0em; | |
| } | |
| .ui.secondary.item.menu .item:last-child { | |
| margin-right: 0em; | |
| } | |
| .ui.secondary.attached.menu { | |
| box-shadow: none; | |
| } | |
| /* Sub Menu */ | |
| .ui.vertical.secondary.menu .item:not(.dropdown) > .menu { | |
| margin: 0em -0.92307692em; | |
| } | |
| .ui.vertical.secondary.menu .item:not(.dropdown) > .menu > .item { | |
| margin: 0em; | |
| padding: 0.53846154em 1.34615385em; | |
| } | |
| /*--------------------- | |
| Secondary Vertical | |
| -----------------------*/ | |
| .ui.secondary.vertical.menu > .item { | |
| border: none; | |
| margin: 0em 0em 0.38461538em; | |
| border-radius: 0.2307em !important; | |
| } | |
| .ui.secondary.vertical.menu > .header.item { | |
| border-radius: 0em; | |
| } | |
| /* Sub Menu */ | |
| .ui.vertical.secondary.menu .item > .menu .item { | |
| background-color: transparent; | |
| } | |
| /* Inverted */ | |
| .ui.secondary.inverted.menu { | |
| background-color: transparent; | |
| } | |
| /*--------------------- | |
| Secondary Pointing | |
| -----------------------*/ | |
| .ui.secondary.pointing.menu { | |
| margin-left: 0em; | |
| margin-right: 0em; | |
| border-bottom: 2px solid rgba(0, 0, 0, 0.13); | |
| } | |
| .ui.secondary.pointing.menu .item { | |
| border-bottom-color: transparent; | |
| border-bottom-style: solid; | |
| border-radius: 0em; | |
| -webkit-align-self: flex-end; | |
| -ms-flex-item-align: end; | |
| align-self: flex-end; | |
| margin: 0em 0em -2px; | |
| padding: 0.84615385em 1.15384615em; | |
| border-bottom-width: 2px; | |
| -webkit-transition: color 0.1s ease; | |
| transition: color 0.1s ease; | |
| } | |
| /* Item Types */ | |
| .ui.secondary.pointing.menu .header.item { | |
| color: rgba(0, 0, 0, 0.85) !important; | |
| } | |
| .ui.secondary.pointing.menu .text.item { | |
| box-shadow: none !important; | |
| } | |
| .ui.secondary.pointing.menu .item:after { | |
| display: none; | |
| } | |
| /* Hover */ | |
| .ui.secondary.pointing.menu .dropdown.item:hover, | |
| .ui.secondary.pointing.menu .link.item:hover, | |
| .ui.secondary.pointing.menu a.item:hover { | |
| background-color: transparent; | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| /* Pressed */ | |
| .ui.secondary.pointing.menu .dropdown.item:active, | |
| .ui.secondary.pointing.menu .link.item:active, | |
| .ui.secondary.pointing.menu a.item:active { | |
| background-color: transparent; | |
| border-color: rgba(0, 0, 0, 0.13); | |
| } | |
| /* Active */ | |
| .ui.secondary.pointing.menu .active.item { | |
| background-color: transparent; | |
| box-shadow: none; | |
| border-color: #333333; | |
| font-weight: bold; | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| /* Active Hover */ | |
| .ui.secondary.pointing.menu .active.item:hover { | |
| border-color: #333333; | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| /* Active Dropdown */ | |
| .ui.secondary.pointing.menu .active.dropdown.item { | |
| border-color: transparent; | |
| } | |
| /* Vertical Pointing */ | |
| .ui.secondary.vertical.pointing.menu { | |
| border-bottom-width: 0px; | |
| border-right-width: 2px; | |
| border-right-style: solid; | |
| border-right-color: rgba(0, 0, 0, 0.13); | |
| } | |
| .ui.secondary.vertical.pointing.menu .item { | |
| border-bottom: none; | |
| border-right-style: solid; | |
| border-right-color: transparent; | |
| border-radius: 0em !important; | |
| margin: 0em -2px 0em 0em; | |
| border-right-width: 2px; | |
| } | |
| /* Vertical Active */ | |
| .ui.secondary.vertical.pointing.menu .active.item { | |
| border-color: #333333; | |
| } | |
| /* Inverted */ | |
| .ui.secondary.inverted.pointing.menu { | |
| border-color: rgba(255, 255, 255, 0.1); | |
| } | |
| .ui.secondary.inverted.pointing.menu { | |
| border-width: 2px; | |
| border-color: rgba(0, 0, 0, 0.13); | |
| } | |
| .ui.secondary.inverted.pointing.menu .item { | |
| color: rgba(255, 255, 255, 0.9); | |
| } | |
| .ui.secondary.inverted.pointing.menu .header.item { | |
| color: #FFFFFF !important; | |
| } | |
| /* Hover */ | |
| .ui.secondary.inverted.pointing.menu .item:hover { | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| /* Active */ | |
| .ui.secondary.inverted.pointing.menu .active.item { | |
| border-color: #FFFFFF; | |
| color: #ffffff; | |
| } | |
| /*-------------- | |
| Text Menu | |
| ---------------*/ | |
| .ui.text.menu { | |
| background: none transparent; | |
| border-radius: 0px; | |
| box-shadow: none; | |
| border: none; | |
| margin: 1em -0.61538462em; | |
| } | |
| .ui.text.menu .item { | |
| border-radius: 0px; | |
| box-shadow: none; | |
| -webkit-align-self: center; | |
| -ms-flex-item-align: center; | |
| align-self: center; | |
| margin: 0em 0em; | |
| padding: 0.38461538em 0.61538462em; | |
| font-weight: normal; | |
| color: #333333; | |
| -webkit-transition: opacity 0.1s ease; | |
| transition: opacity 0.1s ease; | |
| } | |
| /* Border */ | |
| .ui.text.menu .item:before, | |
| .ui.text.menu .menu .item:before { | |
| display: none !important; | |
| } | |
| /* Header */ | |
| .ui.text.menu .header.item { | |
| background-color: transparent; | |
| opacity: 1; | |
| color: rgba(0, 0, 0, 0.85); | |
| font-size: 0.92307692em; | |
| text-transform: uppercase; | |
| font-weight: bold; | |
| } | |
| /* Image */ | |
| .ui.text.menu .item > img:not(.ui) { | |
| margin: 0em; | |
| } | |
| /*--- fluid text ---*/ | |
| .ui.text.item.menu .item { | |
| margin: 0em; | |
| } | |
| /*--- vertical text ---*/ | |
| .ui.vertical.text.menu { | |
| margin: 1em 0em; | |
| } | |
| .ui.vertical.text.menu:first-child { | |
| margin-top: 0rem; | |
| } | |
| .ui.vertical.text.menu:last-child { | |
| margin-bottom: 0rem; | |
| } | |
| .ui.vertical.text.menu .item { | |
| margin: 0.61538462em 0em; | |
| } | |
| .ui.vertical.text.menu .item > i.icon { | |
| float: none; | |
| margin: 0em 0.38461538em 0em 0em; | |
| } | |
| .ui.vertical.text.menu .header.item { | |
| margin: 0.61538462em 0em 0.76923077em; | |
| } | |
| /* Vertical Sub Menu */ | |
| .ui.vertical.text.menu .item:not(.dropdown) > .menu { | |
| margin: 0em; | |
| } | |
| .ui.vertical.text.menu .item:not(.dropdown) > .menu > .item { | |
| margin: 0em; | |
| padding: 0.53846154em 0em; | |
| } | |
| /*--- hover ---*/ | |
| .ui.text.menu .item:hover { | |
| opacity: 1; | |
| background-color: transparent; | |
| } | |
| /*--- active ---*/ | |
| .ui.text.menu .active.item { | |
| background-color: transparent; | |
| border: none; | |
| box-shadow: none; | |
| font-weight: normal; | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| /*--- active hover ---*/ | |
| .ui.text.menu .active.item:hover { | |
| background-color: transparent; | |
| } | |
| /* Disable Bariations */ | |
| .ui.text.pointing.menu .active.item:after { | |
| box-shadow: none; | |
| } | |
| .ui.text.attached.menu { | |
| box-shadow: none; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.text.menu, | |
| .ui.inverted.text.menu .item, | |
| .ui.inverted.text.menu .item:hover, | |
| .ui.inverted.text.menu .active.item { | |
| background-color: transparent !important; | |
| } | |
| /* Fluid */ | |
| .ui.fluid.text.menu { | |
| margin-left: 0em; | |
| margin-right: 0em; | |
| } | |
| /*-------------- | |
| Icon Only | |
| ---------------*/ | |
| /* Vertical Menu */ | |
| .ui.vertical.icon.menu { | |
| display: inline-block; | |
| width: auto; | |
| } | |
| /* Item */ | |
| .ui.icon.menu .item { | |
| height: auto; | |
| text-align: center; | |
| color: #333333; | |
| } | |
| /* Icon */ | |
| .ui.icon.menu .item > .icon:not(.dropdown) { | |
| margin: 0; | |
| opacity: 1; | |
| } | |
| /* Icon Gylph */ | |
| .ui.icon.menu .icon:before { | |
| opacity: 1; | |
| } | |
| /* (x) Item Icon */ | |
| .ui.menu .icon.item > .icon { | |
| width: auto; | |
| margin: 0em auto; | |
| } | |
| /* Vertical Icon */ | |
| .ui.vertical.icon.menu .item > .icon:not(.dropdown) { | |
| display: block; | |
| opacity: 1; | |
| margin: 0em auto; | |
| float: none; | |
| } | |
| /* Inverted */ | |
| .ui.inverted.icon.menu .item { | |
| color: #FFFFFF; | |
| } | |
| /*-------------- | |
| Labeled Icon | |
| ---------------*/ | |
| /* Menu */ | |
| .ui.labeled.icon.menu { | |
| text-align: center; | |
| } | |
| /* Item */ | |
| .ui.labeled.icon.menu .item { | |
| min-width: 6em; | |
| -webkit-box-orient: vertical; | |
| -webkit-box-direction: normal; | |
| -webkit-flex-direction: column; | |
| -ms-flex-direction: column; | |
| flex-direction: column; | |
| } | |
| /* Icon */ | |
| .ui.labeled.icon.menu .item > .icon:not(.dropdown) { | |
| height: 1em; | |
| display: block; | |
| font-size: 1.69230769em !important; | |
| margin: 0em auto 0.5rem !important; | |
| } | |
| /* Fluid */ | |
| .ui.fluid.labeled.icon.menu > .item { | |
| min-width: 0em; | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| /*-------------- | |
| Stackable | |
| ---------------*/ | |
| @media only screen and (max-width: 1048px) { | |
| .ui.stackable.menu { | |
| -webkit-box-orient: vertical; | |
| -webkit-box-direction: normal; | |
| -webkit-flex-direction: column; | |
| -ms-flex-direction: column; | |
| flex-direction: column; | |
| } | |
| .ui.stackable.menu .item { | |
| width: 100% !important; | |
| } | |
| .ui.stackable.menu .item:before { | |
| position: absolute; | |
| content: ''; | |
| top: auto; | |
| bottom: 0px; | |
| left: 0px; | |
| width: 100%; | |
| background: rgba(0, 0, 0, 0.06); | |
| height: 1px; | |
| } | |
| } | |
| /*-------------- | |
| Colors | |
| ---------------*/ | |
| /*--- Standard Colors ---*/ | |
| .ui.menu .red.active.item, | |
| .ui.red.menu .active.item { | |
| border-color: #DB2828 !important; | |
| color: #DB2828 !important; | |
| } | |
| .ui.menu .orange.active.item, | |
| .ui.orange.menu .active.item { | |
| border-color: #D26911 !important; | |
| color: #D26911 !important; | |
| } | |
| .ui.menu .yellow.active.item, | |
| .ui.yellow.menu .active.item { | |
| border-color: #FBBD08 !important; | |
| color: #FBBD08 !important; | |
| } | |
| .ui.menu .olive.active.item, | |
| .ui.olive.menu .active.item { | |
| border-color: #B5CC18 !important; | |
| color: #B5CC18 !important; | |
| } | |
| .ui.menu .green.active.item, | |
| .ui.green.menu .active.item { | |
| border-color: #78CB5B !important; | |
| color: #78CB5B !important; | |
| } | |
| .ui.menu .teal.active.item, | |
| .ui.teal.menu .active.item { | |
| border-color: #00B5AD !important; | |
| color: #00B5AD !important; | |
| } | |
| .ui.menu .blue.active.item, | |
| .ui.blue.menu .active.item { | |
| border-color: #80A6CD !important; | |
| color: #80A6CD !important; | |
| } | |
| .ui.menu .violet.active.item, | |
| .ui.violet.menu .active.item { | |
| border-color: #6435C9 !important; | |
| color: #6435C9 !important; | |
| } | |
| .ui.menu .purple.active.item, | |
| .ui.purple.menu .active.item { | |
| border-color: #A333C8 !important; | |
| color: #A333C8 !important; | |
| } | |
| .ui.menu .pink.active.item, | |
| .ui.pink.menu .active.item { | |
| border-color: #E03997 !important; | |
| color: #E03997 !important; | |
| } | |
| .ui.menu .brown.active.item, | |
| .ui.brown.menu .active.item { | |
| border-color: #A5673F !important; | |
| color: #A5673F !important; | |
| } | |
| .ui.menu .grey.active.item, | |
| .ui.grey.menu .active.item { | |
| border-color: #767676 !important; | |
| color: #767676 !important; | |
| } | |
| /*-------------- | |
| Inverted | |
| ---------------*/ | |
| .ui.inverted.menu { | |
| border: 0px solid transparent; | |
| background: #333333 -webkit-linear-gradient(rgba(255, 255, 255, 0.05), rgba(0, 0, 0, 0)); | |
| background: #333333 linear-gradient(rgba(255, 255, 255, 0.05), rgba(0, 0, 0, 0)); | |
| box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.15), 0px 0px 0px 1px rgba(255, 255, 255, 0.15); | |
| } | |
| /* Menu Item */ | |
| .ui.inverted.menu .item, | |
| .ui.inverted.menu .item > a:not(.ui) { | |
| background: transparent; | |
| color: rgba(255, 255, 255, 0.9); | |
| } | |
| .ui.inverted.menu .item.menu { | |
| background: transparent; | |
| } | |
| /*--- Border ---*/ | |
| .ui.inverted.menu .item:before { | |
| background: rgba(255, 255, 255, 0.08); | |
| } | |
| .ui.vertical.inverted.menu .item:before { | |
| background: rgba(255, 255, 255, 0.08); | |
| } | |
| /* Sub Menu */ | |
| .ui.vertical.inverted.menu .menu .item, | |
| .ui.vertical.inverted.menu .menu .item a:not(.ui) { | |
| color: rgba(255, 255, 255, 0.5); | |
| } | |
| /* Header */ | |
| .ui.inverted.menu .header.item { | |
| margin: 0em; | |
| background: transparent; | |
| box-shadow: none; | |
| } | |
| /* Disabled */ | |
| .ui.inverted.menu .item.disabled, | |
| .ui.inverted.menu .item.disabled:hover { | |
| color: rgba(225, 225, 225, 0.3); | |
| } | |
| /*--- Hover ---*/ | |
| .ui.link.inverted.menu .item:hover, | |
| .ui.inverted.menu .dropdown.item:hover, | |
| .ui.inverted.menu .link.item:hover, | |
| .ui.inverted.menu a.item:hover { | |
| background: rgba(255, 255, 255, 0.08); | |
| color: #ffffff; | |
| } | |
| .ui.vertical.inverted.menu .item .menu a.item:hover, | |
| .ui.vertical.inverted.menu .item .menu .link.item:hover { | |
| background: transparent; | |
| color: #ffffff; | |
| } | |
| /*--- Pressed ---*/ | |
| .ui.inverted.menu a.item:active, | |
| .ui.inverted.menu .link.item:active, | |
| .ui.inverted.menu a.item:active { | |
| background: rgba(255, 255, 255, 0.08); | |
| color: #ffffff; | |
| } | |
| /*--- Active ---*/ | |
| .ui.inverted.menu .active.item { | |
| background: rgba(255, 255, 255, 0.15); | |
| color: #ffffff !important; | |
| } | |
| .ui.inverted.vertical.menu .item .menu .active.item { | |
| background: transparent; | |
| color: #FFFFFF; | |
| } | |
| .ui.inverted.pointing.menu .active.item:after { | |
| background: #3D3E3F !important; | |
| margin: 0em !important; | |
| box-shadow: none !important; | |
| border: none !important; | |
| } | |
| /*--- Active Hover ---*/ | |
| .ui.inverted.menu .active.item:hover { | |
| background: rgba(255, 255, 255, 0.15); | |
| color: #FFFFFF !important; | |
| } | |
| .ui.inverted.pointing.menu .active.item:hover:after { | |
| background: #3D3E3F !important; | |
| } | |
| /*-------------- | |
| Floated | |
| ---------------*/ | |
| .ui.floated.menu { | |
| float: left; | |
| margin: 0rem 0.5rem 0rem 0rem; | |
| } | |
| .ui.floated.menu .item:last-child:before { | |
| display: none; | |
| } | |
| .ui.right.floated.menu { | |
| float: right; | |
| margin: 0rem 0rem 0rem 0.5rem; | |
| } | |
| /*-------------- | |
| Inverted | |
| ---------------*/ | |
| /* Red */ | |
| .ui.inverted.menu .red.active.item, | |
| .ui.inverted.red.menu { | |
| background-color: #DB2828; | |
| } | |
| .ui.inverted.red.menu .item:before { | |
| background-color: rgba(0, 0, 0, 0.06); | |
| } | |
| .ui.inverted.red.menu .active.item { | |
| background-color: rgba(0, 0, 0, 0.1) !important; | |
| } | |
| /* Orange */ | |
| .ui.inverted.menu .orange.active.item, | |
| .ui.inverted.orange.menu { | |
| background-color: #D26911; | |
| } | |
| .ui.inverted.orange.menu .item:before { | |
| background-color: rgba(0, 0, 0, 0.06); | |
| } | |
| .ui.inverted.orange.menu .active.item { | |
| background-color: rgba(0, 0, 0, 0.1) !important; | |
| } | |
| /* Yellow */ | |
| .ui.inverted.menu .yellow.active.item, | |
| .ui.inverted.yellow.menu { | |
| background-color: #FBBD08; | |
| } | |
| .ui.inverted.yellow.menu .item:before { | |
| background-color: rgba(0, 0, 0, 0.06); | |
| } | |
| .ui.inverted.yellow.menu .active.item { | |
| background-color: rgba(0, 0, 0, 0.1) !important; | |
| } | |
| /* Olive */ | |
| .ui.inverted.menu .olive.active.item, | |
| .ui.inverted.olive.menu { | |
| background-color: #B5CC18; | |
| } | |
| .ui.inverted.olive.menu .item:before { | |
| background-color: rgba(0, 0, 0, 0.06); | |
| } | |
| .ui.inverted.olive.menu .active.item { | |
| background-color: rgba(0, 0, 0, 0.1) !important; | |
| } | |
| /* Green */ | |
| .ui.inverted.menu .green.active.item, | |
| .ui.inverted.green.menu { | |
| background-color: #78CB5B; | |
| } | |
| .ui.inverted.green.menu .item:before { | |
| background-color: rgba(0, 0, 0, 0.06); | |
| } | |
| .ui.inverted.green.menu .active.item { | |
| background-color: rgba(0, 0, 0, 0.1) !important; | |
| } | |
| /* Teal */ | |
| .ui.inverted.menu .teal.active.item, | |
| .ui.inverted.teal.menu { | |
| background-color: #00B5AD; | |
| } | |
| .ui.inverted.teal.menu .item:before { | |
| background-color: rgba(0, 0, 0, 0.06); | |
| } | |
| .ui.inverted.teal.menu .active.item { | |
| background-color: rgba(0, 0, 0, 0.1) !important; | |
| } | |
| /* Blue */ | |
| .ui.inverted.menu .blue.active.item, | |
| .ui.inverted.blue.menu { | |
| background-color: #80A6CD; | |
| } | |
| .ui.inverted.blue.menu .item:before { | |
| background-color: rgba(0, 0, 0, 0.06); | |
| } | |
| .ui.inverted.blue.menu .active.item { | |
| background-color: rgba(0, 0, 0, 0.1) !important; | |
| } | |
| /* Violet */ | |
| .ui.inverted.menu .violet.active.item, | |
| .ui.inverted.violet.menu { | |
| background-color: #6435C9; | |
| } | |
| .ui.inverted.violet.menu .item:before { | |
| background-color: rgba(0, 0, 0, 0.06); | |
| } | |
| .ui.inverted.violet.menu .active.item { | |
| background-color: rgba(0, 0, 0, 0.1) !important; | |
| } | |
| /* Purple */ | |
| .ui.inverted.menu .purple.active.item, | |
| .ui.inverted.purple.menu { | |
| background-color: #A333C8; | |
| } | |
| .ui.inverted.purple.menu .item:before { | |
| background-color: rgba(0, 0, 0, 0.06); | |
| } | |
| .ui.inverted.purple.menu .active.item { | |
| background-color: rgba(0, 0, 0, 0.1) !important; | |
| } | |
| /* Pink */ | |
| .ui.inverted.menu .pink.active.item, | |
| .ui.inverted.pink.menu { | |
| background-color: #E03997; | |
| } | |
| .ui.inverted.pink.menu .item:before { | |
| background-color: rgba(0, 0, 0, 0.06); | |
| } | |
| .ui.inverted.pink.menu .active.item { | |
| background-color: rgba(0, 0, 0, 0.1) !important; | |
| } | |
| /* Brown */ | |
| .ui.inverted.menu .brown.active.item, | |
| .ui.inverted.brown.menu { | |
| background-color: #A5673F; | |
| } | |
| .ui.inverted.brown.menu .item:before { | |
| background-color: rgba(0, 0, 0, 0.06); | |
| } | |
| .ui.inverted.brown.menu .active.item { | |
| background-color: rgba(0, 0, 0, 0.1) !important; | |
| } | |
| /* Grey */ | |
| .ui.inverted.menu .grey.active.item, | |
| .ui.inverted.grey.menu { | |
| background-color: #767676; | |
| } | |
| .ui.inverted.grey.menu .item:before { | |
| background-color: rgba(0, 0, 0, 0.06); | |
| } | |
| .ui.inverted.grey.menu .active.item { | |
| background-color: rgba(0, 0, 0, 0.1) !important; | |
| } | |
| /*-------------- | |
| Fitted | |
| ---------------*/ | |
| .ui.fitted.menu .item, | |
| .ui.fitted.menu .item .menu .item, | |
| .ui.menu .fitted.item { | |
| padding: 0em; | |
| } | |
| .ui.horizontally.fitted.menu .item, | |
| .ui.horizontally.fitted.menu .item .menu .item, | |
| .ui.menu .horizontally.fitted.item { | |
| padding-top: 0.92307692em; | |
| padding-bottom: 0.92307692em; | |
| } | |
| .ui.vertically.fitted.menu .item, | |
| .ui.vertically.fitted.menu .item .menu .item, | |
| .ui.menu .vertically.fitted.item { | |
| padding-left: 1.15384615em; | |
| padding-right: 1.15384615em; | |
| } | |
| /*-------------- | |
| Borderless | |
| ---------------*/ | |
| .ui.borderless.menu .item:before, | |
| .ui.borderless.menu .item .menu .item:before, | |
| .ui.menu .borderless.item:before { | |
| background: none !important; | |
| } | |
| /*------------------- | |
| Compact | |
| --------------------*/ | |
| .ui.compact.menu { | |
| display: -webkit-inline-box; | |
| display: -webkit-inline-flex; | |
| display: -ms-inline-flexbox; | |
| display: inline-flex; | |
| margin: 0em; | |
| vertical-align: middle; | |
| } | |
| .ui.compact.vertical.menu { | |
| display: inline-block; | |
| } | |
| .ui.compact.menu .item:last-child { | |
| border-radius: 0em 0.2307em 0.2307em 0em; | |
| } | |
| .ui.compact.menu .item:last-child:before { | |
| display: none; | |
| } | |
| .ui.compact.vertical.menu { | |
| width: auto !important; | |
| } | |
| .ui.compact.vertical.menu .item:last-child::before { | |
| display: block; | |
| } | |
| /*------------------- | |
| Fluid | |
| --------------------*/ | |
| .ui.menu.fluid, | |
| .ui.vertical.menu.fluid { | |
| width: 100% !important; | |
| } | |
| /*------------------- | |
| Evenly Sized | |
| --------------------*/ | |
| .ui.item.menu, | |
| .ui.item.menu .item { | |
| width: 100%; | |
| padding-left: 0em !important; | |
| padding-right: 0em !important; | |
| margin-left: 0em !important; | |
| margin-right: 0em !important; | |
| text-align: center; | |
| -webkit-box-pack: center; | |
| -webkit-justify-content: center; | |
| -ms-flex-pack: center; | |
| justify-content: center; | |
| } | |
| .ui.item.menu .item:last-child:before { | |
| display: none; | |
| } | |
| .ui.menu.two.item .item { | |
| width: 50%; | |
| } | |
| .ui.menu.three.item .item { | |
| width: 33.333%; | |
| } | |
| .ui.menu.four.item .item { | |
| width: 25%; | |
| } | |
| .ui.menu.five.item .item { | |
| width: 20%; | |
| } | |
| .ui.menu.six.item .item { | |
| width: 16.666%; | |
| } | |
| .ui.menu.seven.item .item { | |
| width: 14.285%; | |
| } | |
| .ui.menu.eight.item .item { | |
| width: 12.500%; | |
| } | |
| .ui.menu.nine.item .item { | |
| width: 11.11%; | |
| } | |
| .ui.menu.ten.item .item { | |
| width: 10.0%; | |
| } | |
| .ui.menu.eleven.item .item { | |
| width: 9.09%; | |
| } | |
| .ui.menu.twelve.item .item { | |
| width: 8.333%; | |
| } | |
| /*-------------- | |
| Fixed | |
| ---------------*/ | |
| .ui.menu.fixed { | |
| position: fixed; | |
| z-index: 101; | |
| margin: 0em; | |
| width: 100%; | |
| } | |
| .ui.menu.fixed, | |
| .ui.menu.fixed .item:first-child, | |
| .ui.menu.fixed .item:last-child { | |
| border-radius: 0px !important; | |
| } | |
| .ui.fixed.menu, | |
| .ui[class*="top fixed"].menu { | |
| top: 0px; | |
| left: 0px; | |
| right: auto; | |
| bottom: auto; | |
| } | |
| .ui[class*="top fixed"].menu { | |
| border-top: none; | |
| border-left: none; | |
| border-right: none; | |
| } | |
| .ui[class*="right fixed"].menu { | |
| border-top: none; | |
| border-bottom: none; | |
| border-right: none; | |
| top: 0px; | |
| right: 0px; | |
| left: auto; | |
| bottom: auto; | |
| width: auto; | |
| height: 100%; | |
| } | |
| .ui[class*="bottom fixed"].menu { | |
| border-bottom: none; | |
| border-left: none; | |
| border-right: none; | |
| bottom: 0px; | |
| left: 0px; | |
| top: auto; | |
| right: auto; | |
| } | |
| .ui[class*="left fixed"].menu { | |
| border-top: none; | |
| border-bottom: none; | |
| border-left: none; | |
| top: 0px; | |
| left: 0px; | |
| right: auto; | |
| bottom: auto; | |
| width: auto; | |
| height: 100%; | |
| } | |
| /* Coupling with Grid */ | |
| .ui.fixed.menu + .ui.grid { | |
| padding-top: 2.75rem; | |
| } | |
| /*------------------- | |
| Pointing | |
| --------------------*/ | |
| .ui.pointing.menu .item:after { | |
| visibility: hidden; | |
| position: absolute; | |
| content: ''; | |
| top: 100%; | |
| left: 50%; | |
| -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg); | |
| transform: translateX(-50%) translateY(-50%) rotate(45deg); | |
| background: none; | |
| margin: 0.5px 0em 0em; | |
| width: 0.61538462em; | |
| height: 0.61538462em; | |
| border: none; | |
| border-bottom: 1px solid #DDDDDD; | |
| border-right: 1px solid #DDDDDD; | |
| z-index: 2; | |
| -webkit-transition: background 0.1s ease; | |
| transition: background 0.1s ease; | |
| } | |
| .ui.vertical.pointing.menu .item:after { | |
| position: absolute; | |
| top: 50%; | |
| right: 0%; | |
| bottom: auto; | |
| left: auto; | |
| -webkit-transform: translateX(50%) translateY(-50%) rotate(45deg); | |
| transform: translateX(50%) translateY(-50%) rotate(45deg); | |
| margin: 0em -0.5px 0em 0em; | |
| border: none; | |
| border-top: 1px solid #DDDDDD; | |
| border-right: 1px solid #DDDDDD; | |
| } | |
| /* Active */ | |
| .ui.pointing.menu .active.item:after { | |
| visibility: visible; | |
| } | |
| .ui.pointing.menu .active.dropdown.item:after { | |
| visibility: hidden; | |
| } | |
| /* Don't double up pointers */ | |
| .ui.pointing.menu .dropdown.active.item:after, | |
| .ui.pointing.menu .active.item .menu .active.item:after { | |
| display: none; | |
| } | |
| /* Colors */ | |
| .ui.pointing.menu .active.item:hover:after { | |
| background-color: #F2F2F2; | |
| } | |
| .ui.pointing.menu .active.item:after { | |
| background-color: #F2F2F2; | |
| } | |
| .ui.pointing.menu .active.item:hover:after { | |
| background-color: #F2F2F2; | |
| } | |
| .ui.vertical.pointing.menu .active.item:hover:after { | |
| background-color: #F2F2F2; | |
| } | |
| .ui.vertical.pointing.menu .active.item:after { | |
| background-color: #F2F2F2; | |
| } | |
| .ui.vertical.pointing.menu .menu .active.item:after { | |
| background-color: #FFFFFF; | |
| } | |
| /*-------------- | |
| Attached | |
| ---------------*/ | |
| /* Middle */ | |
| .ui.attached.menu { | |
| top: 0px; | |
| bottom: 0px; | |
| border-radius: 0px; | |
| margin: 0em -1px; | |
| width: calc(100% + 2px ); | |
| max-width: calc(100% + 2px ); | |
| box-shadow: none; | |
| } | |
| .ui.attached + .ui.attached.menu:not(.top) { | |
| border-top: none; | |
| } | |
| /* Top */ | |
| .ui[class*="top attached"].menu { | |
| bottom: 0px; | |
| margin-bottom: 0em; | |
| top: 0px; | |
| margin-top: 1rem; | |
| border-radius: 0.2307em 0.2307em 0em 0em; | |
| } | |
| .ui.menu[class*="top attached"]:first-child { | |
| margin-top: 0em; | |
| } | |
| /* Bottom */ | |
| .ui[class*="bottom attached"].menu { | |
| bottom: 0px; | |
| margin-top: 0em; | |
| top: 0px; | |
| margin-bottom: 1rem; | |
| box-shadow: none, none; | |
| border-radius: 0em 0em 0.2307em 0.2307em; | |
| } | |
| .ui[class*="bottom attached"].menu:last-child { | |
| margin-bottom: 0em; | |
| } | |
| /* Attached Menu Item */ | |
| .ui.top.attached.menu > .item:first-child { | |
| border-radius: 0.2307em 0em 0em 0em; | |
| } | |
| .ui.bottom.attached.menu > .item:first-child { | |
| border-radius: 0em 0em 0em 0.2307em; | |
| } | |
| /* Tabular Attached */ | |
| .ui.attached.menu:not(.tabular) { | |
| border: 1px solid #DDDDDD; | |
| } | |
| .ui.attached.inverted.menu { | |
| border: none; | |
| } | |
| .ui.attached.tabular.menu { | |
| margin-left: 0; | |
| margin-right: 0; | |
| width: 100%; | |
| } | |
| /*-------------- | |
| Sizes | |
| ---------------*/ | |
| /* Small */ | |
| .ui.small.menu { | |
| font-size: 0.92307692rem; | |
| } | |
| .ui.small.vertical.menu { | |
| width: 13rem; | |
| } | |
| /* Medium */ | |
| .ui.menu { | |
| font-size: 1rem; | |
| } | |
| .ui.vertical.menu { | |
| width: 15rem; | |
| } | |
| /* Large */ | |
| .ui.large.menu { | |
| font-size: 1.15384615rem; | |
| } | |
| .ui.large.vertical.menu { | |
| width: 18rem; | |
| } | |
| /* Huge */ | |
| .ui.huge.menu { | |
| font-size: 1.46153846rem; | |
| } | |
| .ui.huge.vertical.menu { | |
| width: 20rem; | |
| } | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /*-------------- | |
| Tabular | |
| ---------------*/ | |
| .ui.vertical.tabular.menu { | |
| padding: 1rem 0em; | |
| } | |
| .ui.vertical.tabular.menu .item { | |
| margin-top: 0.38461538em; | |
| margin-bottom: 0.38461538em; | |
| border-radius: 0px; | |
| } | |
| /* Special Hover */ | |
| .ui.vertical.tabular.menu a.item:not(.active):hover { | |
| box-shadow: 2px 0px 0px #CCCCCC inset; | |
| } | |
| .ui.vertical.tabular.menu a.item:not(.active):hover .icon { | |
| opacity: 1; | |
| } | |
| /* Special Active */ | |
| .ui.tabular.menu:not(.vertical) .active.item { | |
| border-top: 3px solid #D26911 !important; | |
| box-shadow: none; | |
| } | |
| .ui.vertical.tabular.menu:not(.right) .active.item { | |
| border-left: 3px solid #D26911 !important; | |
| box-shadow: -1px -1px 3px rgba(0, 0, 0, 0.05); | |
| } | |
| /* Right Side */ | |
| .ui.vertical.right.tabular.menu { | |
| background: -webkit-linear-gradient(left, #f6f6f6 0%, #FFFFFF 8px) transparent; | |
| background: linear-gradient(to right, #f6f6f6 0%, #FFFFFF 8px) transparent; | |
| } | |
| .ui.vertical.right.tabular.menu .active.item { | |
| border-right: 3px solid #D26911 !important; | |
| } | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - Message | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Message | |
| *******************************/ | |
| .ui.message { | |
| position: relative; | |
| min-height: 1em; | |
| margin: 1em 0em; | |
| background: #FEFEFE; | |
| padding: 15px 15px; | |
| line-height: 1.4285em; | |
| color: rgba(0, 0, 0, 0.87); | |
| -webkit-transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease; | |
| transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease; | |
| border-radius: 0.2307em; | |
| box-shadow: 0px 0px 0px 1px rgba(255, 255, 255, 0.3) inset, 0px 0px 0px 1px rgba(0, 0, 0, 0.2) inset; | |
| } | |
| .ui.message:first-child { | |
| margin-top: 0em; | |
| } | |
| .ui.message:last-child { | |
| margin-bottom: 0em; | |
| } | |
| /*-------------- | |
| Content | |
| ---------------*/ | |
| /* Header */ | |
| .ui.message .header { | |
| display: block; | |
| font-family: 'Arial', 'Helvetica Neue', Arial, Helvetica, sans-serif; | |
| font-weight: bold; | |
| margin: -0.14285em 0em 0rem 0em; | |
| } | |
| /* Default font size */ | |
| .ui.message .header:not(.ui) { | |
| font-size: 1.15em; | |
| } | |
| /* Paragraph */ | |
| .ui.message p { | |
| opacity: 0.85; | |
| margin: 0.75em 0em; | |
| } | |
| .ui.message p:first-child { | |
| margin-top: 0em; | |
| } | |
| .ui.message p:last-child { | |
| margin-bottom: 0em; | |
| } | |
| .ui.message .header + p { | |
| margin-top: 0.25em; | |
| } | |
| /* List */ | |
| .ui.message .list:not(.ui) { | |
| text-align: left; | |
| padding: 0em; | |
| opacity: 0.85; | |
| list-style-position: inside; | |
| margin: 0.5em 0em 0em; | |
| } | |
| .ui.message .list:not(.ui):first-child { | |
| margin-top: 0em; | |
| } | |
| .ui.message .list:not(.ui):last-child { | |
| margin-bottom: 0em; | |
| } | |
| .ui.message .list:not(.ui) li { | |
| position: relative; | |
| list-style-type: none; | |
| margin: 0em 0em 0.3em 1em; | |
| padding: 0em; | |
| } | |
| .ui.message .list:not(.ui) li:before { | |
| position: absolute; | |
| content: '•'; | |
| left: -1em; | |
| height: 100%; | |
| vertical-align: baseline; | |
| } | |
| .ui.message .list:not(.ui) li:last-child { | |
| margin-bottom: 0em; | |
| } | |
| /* Icon */ | |
| .ui.message > .icon { | |
| margin-right: 0.6em; | |
| } | |
| /* Close Icon */ | |
| .ui.message > .close.icon { | |
| cursor: pointer; | |
| position: absolute; | |
| margin: 0em; | |
| top: 14.78575px; | |
| right: 0.5em; | |
| opacity: 0.7; | |
| -webkit-transition: opacity 0.1s ease; | |
| transition: opacity 0.1s ease; | |
| } | |
| .ui.message > .close.icon:hover { | |
| opacity: 1; | |
| } | |
| /* First / Last Element */ | |
| .ui.message > :first-child { | |
| margin-top: 0em; | |
| } | |
| .ui.message > :last-child { | |
| margin-bottom: 0em; | |
| } | |
| /******************************* | |
| Coupling | |
| *******************************/ | |
| .ui.dropdown .menu > .message { | |
| margin: 0px -1px; | |
| } | |
| /******************************* | |
| States | |
| *******************************/ | |
| /*-------------- | |
| Visible | |
| ---------------*/ | |
| .ui.visible.visible.visible.visible.message { | |
| display: block; | |
| } | |
| .ui.icon.visible.visible.visible.visible.message { | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| } | |
| /*-------------- | |
| Hidden | |
| ---------------*/ | |
| .ui.hidden.hidden.hidden.hidden.message { | |
| display: none; | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| /*-------------- | |
| Compact | |
| ---------------*/ | |
| .ui.compact.message { | |
| display: inline-block; | |
| } | |
| /*-------------- | |
| Attached | |
| ---------------*/ | |
| .ui.attached.message { | |
| margin-bottom: -1px; | |
| border-radius: 0.2307em 0.2307em 0em 0em; | |
| box-shadow: 0em 0em 0em 1px rgba(0, 0, 0, 0.13) inset; | |
| margin-left: -1px; | |
| margin-right: -1px; | |
| } | |
| .ui.attached + .ui.attached.message:not(.top):not(.bottom) { | |
| margin-top: -1px; | |
| border-radius: 0em; | |
| } | |
| .ui.bottom.attached.message { | |
| margin-top: -1px; | |
| border-radius: 0em 0em 0.2307em 0.2307em; | |
| box-shadow: 0em 0em 0em 1px rgba(0, 0, 0, 0.13) inset, 0px 1px 2px 0 rgba(0, 0, 0, 0.13); | |
| } | |
| .ui.bottom.attached.message:not(:last-child) { | |
| margin-bottom: 1em; | |
| } | |
| .ui.attached.icon.message { | |
| width: auto; | |
| } | |
| /*-------------- | |
| Icon | |
| ---------------*/ | |
| .ui.icon.message { | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| width: 100%; | |
| -webkit-box-align: center; | |
| -webkit-align-items: center; | |
| -ms-flex-align: center; | |
| align-items: center; | |
| } | |
| .ui.icon.message > .icon:not(.close) { | |
| display: block; | |
| -webkit-box-flex: 0; | |
| -webkit-flex: 0 0 auto; | |
| -ms-flex: 0 0 auto; | |
| flex: 0 0 auto; | |
| width: auto; | |
| line-height: 1; | |
| vertical-align: middle; | |
| font-size: 3em; | |
| opacity: 0.8; | |
| } | |
| .ui.icon.message > .content { | |
| display: block; | |
| -webkit-box-flex: 1; | |
| -webkit-flex: 1 1 auto; | |
| -ms-flex: 1 1 auto; | |
| flex: 1 1 auto; | |
| vertical-align: middle; | |
| } | |
| .ui.icon.message .icon:not(.close) + .content { | |
| padding-left: 0rem; | |
| } | |
| .ui.icon.message .circular.icon { | |
| width: 1em; | |
| } | |
| /*-------------- | |
| Floating | |
| ---------------*/ | |
| .ui.floating.message { | |
| box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset, 0px 2px 3px 0px rgba(0, 0, 0, 0.1), 0px 0px 0px 1px rgba(0, 0, 0, 0.05) inset; | |
| } | |
| /*-------------- | |
| Colors | |
| ---------------*/ | |
| .ui.black.message { | |
| background-color: #333333; | |
| color: rgba(255, 255, 255, 0.9); | |
| } | |
| /*-------------- | |
| Types | |
| ---------------*/ | |
| /* Positive */ | |
| .ui.positive.message { | |
| background-color: #FCFFF5; | |
| color: #2C662D; | |
| } | |
| .ui.positive.message, | |
| .ui.attached.positive.message { | |
| box-shadow: 0px 0px 0px 1px #A3C293 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0); | |
| } | |
| .ui.positive.message .header { | |
| color: #1A531B; | |
| } | |
| /* Negative */ | |
| .ui.negative.message { | |
| background-color: #FFF6F6; | |
| color: #9F3A38; | |
| } | |
| .ui.negative.message, | |
| .ui.attached.negative.message { | |
| box-shadow: 0px 0px 0px 1px #E0B4B4 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0); | |
| } | |
| .ui.negative.message .header { | |
| color: #912D2B; | |
| } | |
| /* Info */ | |
| .ui.info.message { | |
| background-color: #E6F1F6; | |
| color: #4E575B; | |
| } | |
| .ui.info.message, | |
| .ui.attached.info.message { | |
| box-shadow: 0px 0px 0px 1px #B7C7CF inset, 0px 0px 0px 0px rgba(0, 0, 0, 0); | |
| } | |
| .ui.info.message .header { | |
| color: #0E566C; | |
| } | |
| /* Warning */ | |
| .ui.warning.message { | |
| background-color: #FFFAF3; | |
| color: #613A00; | |
| } | |
| .ui.warning.message, | |
| .ui.attached.warning.message { | |
| box-shadow: 0px 0px 0px 1px #DCA874 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0); | |
| } | |
| .ui.warning.message .header { | |
| color: #794B02; | |
| } | |
| /* Error */ | |
| .ui.error.message { | |
| background-color: #FFF6F6; | |
| color: #991111; | |
| } | |
| .ui.error.message, | |
| .ui.attached.error.message { | |
| box-shadow: 0px 0px 0px 1px #DA9797 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0); | |
| } | |
| .ui.error.message .header { | |
| color: #912D2B; | |
| } | |
| /* Success */ | |
| .ui.success.message { | |
| background-color: #FCFFF5; | |
| color: #2C662D; | |
| } | |
| .ui.success.message, | |
| .ui.attached.success.message { | |
| box-shadow: 0px 0px 0px 1px #A3C293 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0); | |
| } | |
| .ui.success.message .header { | |
| color: #1A531B; | |
| } | |
| /* Colors */ | |
| .ui.inverted.message, | |
| .ui.black.message { | |
| background-color: #333333; | |
| color: rgba(255, 255, 255, 0.9); | |
| } | |
| .ui.red.message { | |
| background-color: #FFE8E6; | |
| color: #DB2828; | |
| } | |
| .ui.red.message .header { | |
| color: #c82121; | |
| } | |
| .ui.orange.message { | |
| background-color: #FFEDDE; | |
| color: #D26911; | |
| } | |
| .ui.orange.message .header { | |
| color: #ba5d0f; | |
| } | |
| .ui.yellow.message { | |
| background-color: #FFF8DB; | |
| color: #B58105; | |
| } | |
| .ui.yellow.message .header { | |
| color: #9c6f04; | |
| } | |
| .ui.olive.message { | |
| background-color: #FBFDEF; | |
| color: #8ABC1E; | |
| } | |
| .ui.olive.message .header { | |
| color: #7aa61a; | |
| } | |
| .ui.green.message { | |
| background-color: #E5F9E7; | |
| color: #1EBC30; | |
| } | |
| .ui.green.message .header { | |
| color: #1aa62a; | |
| } | |
| .ui.teal.message { | |
| background-color: #E1F7F7; | |
| color: #10A3A3; | |
| } | |
| .ui.teal.message .header { | |
| color: #0e8c8c; | |
| } | |
| .ui.blue.message { | |
| background-color: #DFF0FF; | |
| color: #80A6CD; | |
| } | |
| .ui.blue.message .header { | |
| color: #6e99c6; | |
| } | |
| .ui.violet.message { | |
| background-color: #EAE7FF; | |
| color: #6435C9; | |
| } | |
| .ui.violet.message .header { | |
| color: #5a30b5; | |
| } | |
| .ui.purple.message { | |
| background-color: #F6E7FF; | |
| color: #A333C8; | |
| } | |
| .ui.purple.message .header { | |
| color: #922eb4; | |
| } | |
| .ui.pink.message { | |
| background-color: #FFE3FB; | |
| color: #E03997; | |
| } | |
| .ui.pink.message .header { | |
| color: #dd238b; | |
| } | |
| .ui.brown.message { | |
| background-color: #F1E2D3; | |
| color: #A5673F; | |
| } | |
| .ui.brown.message .header { | |
| color: #935b38; | |
| } | |
| /*-------------- | |
| Sizes | |
| ---------------*/ | |
| .ui.small.message { | |
| font-size: 0.92307692em; | |
| } | |
| .ui.message { | |
| font-size: 1em; | |
| } | |
| .ui.large.message { | |
| font-size: 1.15384615em; | |
| } | |
| .ui.huge.message { | |
| font-size: 1.46153846em; | |
| } | |
| .ui.massive.message { | |
| font-size: 1.69230769em; | |
| } | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - Popup | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Popup | |
| *******************************/ | |
| .ui.popup { | |
| display: none; | |
| position: absolute; | |
| top: 0px; | |
| right: 0px; | |
| /* Fixes content being squished when inline (moz only) */ | |
| min-width: -webkit-min-content; | |
| min-width: -moz-min-content; | |
| min-width: min-content; | |
| z-index: 1900; | |
| border: 1px solid #DDDDDD; | |
| line-height: 1.4285em; | |
| max-width: 250px; | |
| background: #FFFFFF; | |
| padding: 0.53846154em 0.84615385em; | |
| font-weight: normal; | |
| font-style: normal; | |
| color: rgba(0, 0, 0, 0.87); | |
| border-radius: 0.2307em; | |
| box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.08); | |
| } | |
| .ui.popup > .header { | |
| padding: 0em; | |
| font-family: 'Arial', 'Helvetica Neue', Arial, Helvetica, sans-serif; | |
| font-size: 1.125em; | |
| line-height: 1.2; | |
| font-weight: bold; | |
| } | |
| .ui.popup > .header + .content { | |
| padding-top: 0.5em; | |
| } | |
| .ui.popup:before { | |
| position: absolute; | |
| content: ''; | |
| width: 0.75em; | |
| height: 0.75em; | |
| background: #FFFFFF; | |
| -webkit-transform: rotate(45deg); | |
| transform: rotate(45deg); | |
| z-index: 2; | |
| box-shadow: 1px 1px 0px 0px #c4c4c4; | |
| } | |
| /******************************* | |
| Types | |
| *******************************/ | |
| /*-------------- | |
| Spacing | |
| ---------------*/ | |
| .ui.popup { | |
| margin: 0em; | |
| } | |
| /* Extending from Top */ | |
| .ui.top.popup { | |
| margin: 0em 0em 0.75em; | |
| } | |
| .ui.top.left.popup { | |
| -webkit-transform-origin: left bottom; | |
| transform-origin: left bottom; | |
| } | |
| .ui.top.center.popup { | |
| -webkit-transform-origin: center bottom; | |
| transform-origin: center bottom; | |
| } | |
| .ui.top.right.popup { | |
| -webkit-transform-origin: right bottom; | |
| transform-origin: right bottom; | |
| } | |
| /* Extending from Vertical Center */ | |
| .ui.left.center.popup { | |
| margin: 0em 0.75em 0em 0em; | |
| -webkit-transform-origin: right 50%; | |
| transform-origin: right 50%; | |
| } | |
| .ui.right.center.popup { | |
| margin: 0em 0em 0em 0.75em; | |
| -webkit-transform-origin: left 50%; | |
| transform-origin: left 50%; | |
| } | |
| /* Extending from Bottom */ | |
| .ui.bottom.popup { | |
| margin: 0.75em 0em 0em; | |
| } | |
| .ui.bottom.left.popup { | |
| -webkit-transform-origin: left top; | |
| transform-origin: left top; | |
| } | |
| .ui.bottom.center.popup { | |
| -webkit-transform-origin: center top; | |
| transform-origin: center top; | |
| } | |
| .ui.bottom.right.popup { | |
| -webkit-transform-origin: right top; | |
| transform-origin: right top; | |
| } | |
| /*-------------- | |
| Pointer | |
| ---------------*/ | |
| /*--- Below ---*/ | |
| .ui.bottom.center.popup:before { | |
| margin-left: -0.325em; | |
| top: -0.325em; | |
| left: 50%; | |
| right: auto; | |
| bottom: auto; | |
| box-shadow: -1px -1px 0px 0px #c4c4c4; | |
| } | |
| .ui.bottom.left.popup { | |
| margin-left: 0em; | |
| } | |
| /*rtl:rename*/ | |
| .ui.bottom.left.popup:before { | |
| top: -0.325em; | |
| left: 1em; | |
| right: auto; | |
| bottom: auto; | |
| margin-left: 0em; | |
| box-shadow: -1px -1px 0px 0px #c4c4c4; | |
| } | |
| .ui.bottom.right.popup { | |
| margin-right: 0em; | |
| } | |
| /*rtl:rename*/ | |
| .ui.bottom.right.popup:before { | |
| top: -0.325em; | |
| right: 1em; | |
| bottom: auto; | |
| left: auto; | |
| margin-left: 0em; | |
| box-shadow: -1px -1px 0px 0px #c4c4c4; | |
| } | |
| /*--- Above ---*/ | |
| .ui.top.center.popup:before { | |
| top: auto; | |
| right: auto; | |
| bottom: -0.325em; | |
| left: 50%; | |
| margin-left: -0.325em; | |
| } | |
| .ui.top.left.popup { | |
| margin-left: 0em; | |
| } | |
| /*rtl:rename*/ | |
| .ui.top.left.popup:before { | |
| bottom: -0.325em; | |
| left: 1em; | |
| top: auto; | |
| right: auto; | |
| margin-left: 0em; | |
| } | |
| .ui.top.right.popup { | |
| margin-right: 0em; | |
| } | |
| /*rtl:rename*/ | |
| .ui.top.right.popup:before { | |
| bottom: -0.325em; | |
| right: 1em; | |
| top: auto; | |
| left: auto; | |
| margin-left: 0em; | |
| } | |
| /*--- Left Center ---*/ | |
| /*rtl:rename*/ | |
| .ui.left.center.popup:before { | |
| top: 50%; | |
| right: -0.325em; | |
| bottom: auto; | |
| left: auto; | |
| margin-top: -0.325em; | |
| box-shadow: 1px -1px 0px 0px #c4c4c4; | |
| } | |
| /*--- Right Center ---*/ | |
| /*rtl:rename*/ | |
| .ui.right.center.popup:before { | |
| top: 50%; | |
| left: -0.325em; | |
| bottom: auto; | |
| right: auto; | |
| margin-top: -0.325em; | |
| box-shadow: -1px 1px 0px 0px #c4c4c4; | |
| } | |
| /* Arrow Color By Location */ | |
| .ui.bottom.popup:before { | |
| background: #FFFFFF; | |
| } | |
| .ui.right.center.popup:before, | |
| .ui.left.center.popup:before { | |
| background: #FFFFFF; | |
| } | |
| .ui.top.popup:before { | |
| background: #FFFFFF; | |
| } | |
| /* Inverted Arrow Color */ | |
| .ui.inverted.bottom.popup:before { | |
| background: #333333; | |
| } | |
| .ui.inverted.right.center.popup:before, | |
| .ui.inverted.left.center.popup:before { | |
| background: #333333; | |
| } | |
| .ui.inverted.top.popup:before { | |
| background: #333333; | |
| } | |
| /******************************* | |
| Coupling | |
| *******************************/ | |
| /* Immediate Nested Grid */ | |
| .ui.popup > .ui.grid:not(.padded) { | |
| width: calc(100% + 1.75rem); | |
| margin: -0.7rem -0.875rem; | |
| } | |
| /******************************* | |
| States | |
| *******************************/ | |
| .ui.loading.popup { | |
| display: block; | |
| visibility: hidden; | |
| z-index: -1; | |
| } | |
| .ui.animating.popup, | |
| .ui.visible.popup { | |
| display: block; | |
| } | |
| .ui.visible.popup { | |
| -webkit-transform: translateZ(0px); | |
| transform: translateZ(0px); | |
| -webkit-backface-visibility: hidden; | |
| backface-visibility: hidden; | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| /*-------------- | |
| Basic | |
| ---------------*/ | |
| .ui.basic.popup:before { | |
| display: none; | |
| } | |
| /*-------------- | |
| Wide | |
| ---------------*/ | |
| .ui.wide.popup { | |
| max-width: 350px; | |
| } | |
| .ui[class*="very wide"].popup { | |
| max-width: 550px; | |
| } | |
| @media only screen and (max-width: 1048px) { | |
| .ui.wide.popup, | |
| .ui[class*="very wide"].popup { | |
| max-width: 250px; | |
| } | |
| } | |
| /*-------------- | |
| Fluid | |
| ---------------*/ | |
| .ui.fluid.popup { | |
| width: 100%; | |
| max-width: none; | |
| } | |
| /*-------------- | |
| Colors | |
| ---------------*/ | |
| /* Inverted colors */ | |
| .ui.inverted.popup { | |
| background: #333333; | |
| color: #FFFFFF; | |
| border: none; | |
| box-shadow: none; | |
| } | |
| .ui.inverted.popup .header { | |
| background-color: none; | |
| color: #FFFFFF; | |
| } | |
| .ui.inverted.popup:before { | |
| background-color: #333333; | |
| box-shadow: none !important; | |
| } | |
| /*-------------- | |
| Flowing | |
| ---------------*/ | |
| .ui.flowing.popup { | |
| max-width: none; | |
| } | |
| /*-------------- | |
| Sizes | |
| ---------------*/ | |
| .ui.mini.popup { | |
| font-size: 0.69230769rem; | |
| } | |
| .ui.tiny.popup { | |
| font-size: 0.84615385rem; | |
| } | |
| .ui.small.popup { | |
| font-size: 0.76923077em; | |
| } | |
| .ui.popup { | |
| font-size: 0.84615385em; | |
| } | |
| .ui.large.popup { | |
| font-size: 1em; | |
| } | |
| .ui.huge.popup { | |
| font-size: 1.46153846rem; | |
| } | |
| /******************************* | |
| User Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - Reveal | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Reveal | |
| *******************************/ | |
| .ui.reveal { | |
| display: inherit; | |
| position: relative !important; | |
| font-size: 0em !important; | |
| } | |
| .ui.reveal > .visible.content { | |
| position: absolute !important; | |
| top: 0em !important; | |
| left: 0em !important; | |
| z-index: 3 !important; | |
| -webkit-transition: all 0.5s ease 0.1s; | |
| transition: all 0.5s ease 0.1s; | |
| } | |
| .ui.reveal > .hidden.content { | |
| position: relative !important; | |
| z-index: 2 !important; | |
| } | |
| /* Make sure hovered element is on top of other reveal */ | |
| .ui.active.reveal .visible.content, | |
| .ui.reveal:hover .visible.content { | |
| z-index: 4 !important; | |
| } | |
| /******************************* | |
| Types | |
| *******************************/ | |
| /*-------------- | |
| Slide | |
| ---------------*/ | |
| .ui.slide.reveal { | |
| position: relative !important; | |
| overflow: hidden !important; | |
| white-space: nowrap; | |
| } | |
| .ui.slide.reveal > .content { | |
| display: block; | |
| width: 100%; | |
| float: left; | |
| margin: 0em; | |
| -webkit-transition: -webkit-transform 0.5s ease 0.1s; | |
| transition: -webkit-transform 0.5s ease 0.1s; | |
| transition: transform 0.5s ease 0.1s; | |
| transition: transform 0.5s ease 0.1s, -webkit-transform 0.5s ease 0.1s; | |
| } | |
| .ui.slide.reveal > .visible.content { | |
| position: relative !important; | |
| } | |
| .ui.slide.reveal > .hidden.content { | |
| position: absolute !important; | |
| left: 0% !important; | |
| width: 100% !important; | |
| -webkit-transform: translateX(100%) !important; | |
| transform: translateX(100%) !important; | |
| } | |
| .ui.slide.active.reveal > .visible.content, | |
| .ui.slide.reveal:hover > .visible.content { | |
| -webkit-transform: translateX(-100%) !important; | |
| transform: translateX(-100%) !important; | |
| } | |
| .ui.slide.active.reveal > .hidden.content, | |
| .ui.slide.reveal:hover > .hidden.content { | |
| -webkit-transform: translateX(0%) !important; | |
| transform: translateX(0%) !important; | |
| } | |
| .ui.slide.right.reveal > .visible.content { | |
| -webkit-transform: translateX(0%) !important; | |
| transform: translateX(0%) !important; | |
| } | |
| .ui.slide.right.reveal > .hidden.content { | |
| -webkit-transform: translateX(-100%) !important; | |
| transform: translateX(-100%) !important; | |
| } | |
| .ui.slide.right.active.reveal > .visible.content, | |
| .ui.slide.right.reveal:hover > .visible.content { | |
| -webkit-transform: translateX(100%) !important; | |
| transform: translateX(100%) !important; | |
| } | |
| .ui.slide.right.active.reveal > .hidden.content, | |
| .ui.slide.right.reveal:hover > .hidden.content { | |
| -webkit-transform: translateX(0%) !important; | |
| transform: translateX(0%) !important; | |
| } | |
| .ui.slide.up.reveal > .hidden.content { | |
| -webkit-transform: translateY(100%) !important; | |
| transform: translateY(100%) !important; | |
| } | |
| .ui.slide.up.active.reveal > .visible.content, | |
| .ui.slide.up.reveal:hover > .visible.content { | |
| -webkit-transform: translateY(-100%) !important; | |
| transform: translateY(-100%) !important; | |
| } | |
| .ui.slide.up.active.reveal > .hidden.content, | |
| .ui.slide.up.reveal:hover > .hidden.content { | |
| -webkit-transform: translateY(0%) !important; | |
| transform: translateY(0%) !important; | |
| } | |
| .ui.slide.down.reveal > .hidden.content { | |
| -webkit-transform: translateY(-100%) !important; | |
| transform: translateY(-100%) !important; | |
| } | |
| .ui.slide.down.active.reveal > .visible.content, | |
| .ui.slide.down.reveal:hover > .visible.content { | |
| -webkit-transform: translateY(100%) !important; | |
| transform: translateY(100%) !important; | |
| } | |
| .ui.slide.down.active.reveal > .hidden.content, | |
| .ui.slide.down.reveal:hover > .hidden.content { | |
| -webkit-transform: translateY(0%) !important; | |
| transform: translateY(0%) !important; | |
| } | |
| /*-------------- | |
| Fade | |
| ---------------*/ | |
| .ui.fade.reveal > .visible.content { | |
| opacity: 1; | |
| } | |
| .ui.fade.active.reveal > .visible.content, | |
| .ui.fade.reveal:hover > .visible.content { | |
| opacity: 0; | |
| } | |
| /*-------------- | |
| Move | |
| ---------------*/ | |
| .ui.move.reveal { | |
| position: relative !important; | |
| overflow: hidden !important; | |
| white-space: nowrap; | |
| } | |
| .ui.move.reveal > .content { | |
| display: block; | |
| float: left; | |
| margin: 0em; | |
| -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1) 0.1s; | |
| transition: -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1) 0.1s; | |
| transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1) 0.1s; | |
| transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1) 0.1s, -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1) 0.1s; | |
| } | |
| .ui.move.reveal > .visible.content { | |
| position: relative !important; | |
| } | |
| .ui.move.reveal > .hidden.content { | |
| position: absolute !important; | |
| left: 0% !important; | |
| width: 100% !important; | |
| } | |
| .ui.move.active.reveal > .visible.content, | |
| .ui.move.reveal:hover > .visible.content { | |
| -webkit-transform: translateX(-100%) !important; | |
| transform: translateX(-100%) !important; | |
| } | |
| .ui.move.right.active.reveal > .visible.content, | |
| .ui.move.right.reveal:hover > .visible.content { | |
| -webkit-transform: translateX(100%) !important; | |
| transform: translateX(100%) !important; | |
| } | |
| .ui.move.up.active.reveal > .visible.content, | |
| .ui.move.up.reveal:hover > .visible.content { | |
| -webkit-transform: translateY(-100%) !important; | |
| transform: translateY(-100%) !important; | |
| } | |
| .ui.move.down.active.reveal > .visible.content, | |
| .ui.move.down.reveal:hover > .visible.content { | |
| -webkit-transform: translateY(100%) !important; | |
| transform: translateY(100%) !important; | |
| } | |
| /*-------------- | |
| Rotate | |
| ---------------*/ | |
| .ui.rotate.reveal > .visible.content { | |
| -webkit-transition-duration: 0.5s; | |
| transition-duration: 0.5s; | |
| -webkit-transform: rotate(0deg); | |
| transform: rotate(0deg); | |
| } | |
| .ui.rotate.reveal > .visible.content, | |
| .ui.rotate.right.reveal > .visible.content { | |
| -webkit-transform-origin: bottom right; | |
| transform-origin: bottom right; | |
| } | |
| .ui.rotate.active.reveal > .visible.conten, | |
| .ui.rotate.reveal:hover > .visible.content, | |
| .ui.rotate.right.active.reveal > .visible.content, | |
| .ui.rotate.right.reveal:hover > .visible.content { | |
| -webkit-transform: rotate(110deg); | |
| transform: rotate(110deg); | |
| } | |
| .ui.rotate.left.reveal > .visible.content { | |
| -webkit-transform-origin: bottom left; | |
| transform-origin: bottom left; | |
| } | |
| .ui.rotate.left.active.reveal > .visible.content, | |
| .ui.rotate.left.reveal:hover > .visible.content { | |
| -webkit-transform: rotate(-110deg); | |
| transform: rotate(-110deg); | |
| } | |
| /******************************* | |
| States | |
| *******************************/ | |
| .ui.disabled.reveal:hover > .visible.visible.content { | |
| position: static !important; | |
| display: block !important; | |
| opacity: 1 !important; | |
| top: 0 !important; | |
| left: 0 !important; | |
| right: auto !important; | |
| bottom: auto !important; | |
| -webkit-transform: none !important; | |
| transform: none !important; | |
| } | |
| .ui.disabled.reveal:hover > .hidden.hidden.content { | |
| display: none !important; | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| /*-------------- | |
| Visible | |
| ---------------*/ | |
| .ui.visible.reveal { | |
| overflow: visible; | |
| } | |
| /*-------------- | |
| Instant | |
| ---------------*/ | |
| .ui.instant.reveal > .content { | |
| -webkit-transition-delay: 0s !important; | |
| transition-delay: 0s !important; | |
| } | |
| /*-------------- | |
| Sizing | |
| ---------------*/ | |
| .ui.reveal > .content { | |
| font-size: 1rem !important; | |
| } | |
| /******************************* | |
| Theme Overrides | |
| *******************************/ | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - Segment | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Segment | |
| *******************************/ | |
| .ui.segment { | |
| position: relative; | |
| background: #FFFFFF; | |
| box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.075); | |
| margin: 1rem 0em; | |
| padding: 20px 20px; | |
| border-radius: 4px; | |
| border: 1px solid #D8DEE2; | |
| } | |
| .ui.segment:first-child { | |
| margin-top: 0em; | |
| } | |
| .ui.segment:last-child { | |
| margin-bottom: 0em; | |
| } | |
| /* Vertical */ | |
| .ui.vertical.segment { | |
| margin: 0em; | |
| padding-left: 0em; | |
| padding-right: 0em; | |
| background: none transparent; | |
| border-radius: 0px; | |
| box-shadow: none; | |
| border: none; | |
| border-bottom: 1px solid rgba(0, 0, 0, 0.13); | |
| } | |
| .ui.vertical.segment:last-child { | |
| border-bottom: none; | |
| } | |
| /*------------------- | |
| Loose Coupling | |
| --------------------*/ | |
| /* Header */ | |
| .ui.inverted.segment > .ui.header { | |
| color: #FFFFFF; | |
| } | |
| /* Label */ | |
| .ui[class*="bottom attached"].segment > [class*="top attached"].label { | |
| border-top-left-radius: 0em; | |
| border-top-right-radius: 0em; | |
| } | |
| .ui[class*="top attached"].segment > [class*="bottom attached"].label { | |
| border-bottom-left-radius: 0em; | |
| border-bottom-right-radius: 0em; | |
| } | |
| .ui.attached.segment:not(.top):not(.bottom) > [class*="top attached"].label { | |
| border-top-left-radius: 0em; | |
| border-top-right-radius: 0em; | |
| } | |
| .ui.attached.segment:not(.top):not(.bottom) > [class*="bottom attached"].label { | |
| border-bottom-left-radius: 0em; | |
| border-bottom-right-radius: 0em; | |
| } | |
| /* Grid */ | |
| .ui.page.grid.segment, | |
| .ui.grid > .row > .ui.segment.column, | |
| .ui.grid > .ui.segment.column { | |
| padding-top: 40px; | |
| padding-bottom: 40px; | |
| } | |
| .ui.grid.segment { | |
| margin: 1rem 0em; | |
| border-radius: 4px; | |
| } | |
| /* Table */ | |
| .ui.basic.table.segment { | |
| background: #FFFFFF; | |
| border: 1px solid #D8DEE2; | |
| box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.075); | |
| } | |
| .ui[class*="very basic"].table.segment { | |
| padding: 20px 20px; | |
| } | |
| /******************************* | |
| Types | |
| *******************************/ | |
| /*------------------- | |
| Piled | |
| --------------------*/ | |
| .ui.piled.segments, | |
| .ui.piled.segment { | |
| margin: 3em 0em; | |
| box-shadow: ''; | |
| z-index: auto; | |
| } | |
| .ui.piled.segment:first-child { | |
| margin-top: 0em; | |
| } | |
| .ui.piled.segment:last-child { | |
| margin-bottom: 0em; | |
| } | |
| .ui.piled.segments:after, | |
| .ui.piled.segments:before, | |
| .ui.piled.segment:after, | |
| .ui.piled.segment:before { | |
| background-color: #FFFFFF; | |
| visibility: visible; | |
| content: ''; | |
| display: block; | |
| height: 100%; | |
| left: 0px; | |
| position: absolute; | |
| width: 100%; | |
| border: 1px solid #D8DEE2; | |
| box-shadow: ''; | |
| } | |
| .ui.piled.segments:before, | |
| .ui.piled.segment:before { | |
| -webkit-transform: rotate(-1.2deg); | |
| transform: rotate(-1.2deg); | |
| top: 0; | |
| z-index: -2; | |
| } | |
| .ui.piled.segments:after, | |
| .ui.piled.segment:after { | |
| -webkit-transform: rotate(1.2deg); | |
| transform: rotate(1.2deg); | |
| top: 0; | |
| z-index: -1; | |
| } | |
| /* Piled Attached */ | |
| .ui[class*="top attached"].piled.segment { | |
| margin-top: 3em; | |
| margin-bottom: 0em; | |
| } | |
| .ui.piled.segment[class*="top attached"]:first-child { | |
| margin-top: 0em; | |
| } | |
| .ui.piled.segment[class*="bottom attached"] { | |
| margin-top: 0em; | |
| margin-bottom: 3em; | |
| } | |
| .ui.piled.segment[class*="bottom attached"]:last-child { | |
| margin-bottom: 0em; | |
| } | |
| /*------------------- | |
| Stacked | |
| --------------------*/ | |
| .ui.stacked.segment { | |
| padding-bottom: 20.4px; | |
| } | |
| .ui.stacked.segments:before, | |
| .ui.stacked.segments:after, | |
| .ui.stacked.segment:before, | |
| .ui.stacked.segment:after { | |
| content: ''; | |
| position: absolute; | |
| bottom: -3px; | |
| left: 0%; | |
| border-top: 1px solid rgba(0, 0, 0, 0.13); | |
| background: rgba(0, 0, 0, 0.03); | |
| width: 100%; | |
| height: 6px; | |
| visibility: visible; | |
| } | |
| .ui.stacked.segments:before, | |
| .ui.stacked.segment:before { | |
| display: none; | |
| } | |
| /* Add additional page */ | |
| .ui.tall.stacked.segments:before, | |
| .ui.tall.stacked.segment:before { | |
| display: block; | |
| bottom: 0px; | |
| } | |
| /* Inverted */ | |
| .ui.stacked.inverted.segments:before, | |
| .ui.stacked.inverted.segments:after, | |
| .ui.stacked.inverted.segment:before, | |
| .ui.stacked.inverted.segment:after { | |
| background-color: rgba(0, 0, 0, 0.03); | |
| border-top: 1px solid #51A7E8; | |
| } | |
| /*------------------- | |
| Padded | |
| --------------------*/ | |
| .ui.padded.segment { | |
| padding: 1.5em; | |
| } | |
| .ui[class*="very padded"].segment { | |
| padding: 3em; | |
| } | |
| /*------------------- | |
| Compact | |
| --------------------*/ | |
| .ui.compact.segment { | |
| display: table; | |
| } | |
| /* Compact Group */ | |
| .ui.compact.segments { | |
| display: -webkit-inline-box; | |
| display: -webkit-inline-flex; | |
| display: -ms-inline-flexbox; | |
| display: inline-flex; | |
| } | |
| .ui.compact.segments .segment, | |
| .ui.segments .compact.segment { | |
| display: block; | |
| -webkit-box-flex: 0; | |
| -webkit-flex: 0 1 auto; | |
| -ms-flex: 0 1 auto; | |
| flex: 0 1 auto; | |
| } | |
| /*------------------- | |
| Circular | |
| --------------------*/ | |
| .ui.circular.segment { | |
| display: table-cell; | |
| padding: 2em; | |
| text-align: center; | |
| vertical-align: middle; | |
| border-radius: 500em; | |
| } | |
| /*------------------- | |
| Raised | |
| --------------------*/ | |
| .ui.raised.segments, | |
| .ui.raised.segment { | |
| box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.075); | |
| } | |
| /******************************* | |
| Groups | |
| *******************************/ | |
| /* Group */ | |
| .ui.segments { | |
| -webkit-box-orient: vertical; | |
| -webkit-box-direction: normal; | |
| -webkit-flex-direction: column; | |
| -ms-flex-direction: column; | |
| flex-direction: column; | |
| position: relative; | |
| margin: 1rem 0em; | |
| border: 1px solid #D8DEE2; | |
| box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.075); | |
| border-radius: 4px; | |
| } | |
| .ui.segments:first-child { | |
| margin-top: 0em; | |
| } | |
| .ui.segments:last-child { | |
| margin-bottom: 0em; | |
| } | |
| /* Nested Segment */ | |
| .ui.segments > .segment { | |
| top: 0px; | |
| bottom: 0px; | |
| border-radius: 0px; | |
| margin: 0em; | |
| width: auto; | |
| box-shadow: none; | |
| border: none; | |
| border-top: 1px solid #D8DEE2; | |
| } | |
| .ui.segments:not(.horizontal) > .segment:first-child { | |
| border-top: none; | |
| margin-top: 0em; | |
| bottom: 0px; | |
| margin-bottom: 0em; | |
| top: 0px; | |
| border-radius: 4px 4px 0em 0em; | |
| } | |
| /* Bottom */ | |
| .ui.segments:not(.horizontal) > .segment:last-child { | |
| top: 0px; | |
| bottom: 0px; | |
| margin-top: 0em; | |
| margin-bottom: 0em; | |
| box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.075), none; | |
| border-radius: 0em 0em 4px 4px; | |
| } | |
| /* Nested Group */ | |
| .ui.segments > .ui.segments { | |
| border-top: 1px solid #D8DEE2; | |
| margin: 1rem 1rem; | |
| } | |
| .ui.segments > .segments:first-child { | |
| border-top: none; | |
| } | |
| .ui.segments > .segment + .segments:not(.horizontal) { | |
| margin-top: 0em; | |
| } | |
| /* Horizontal Group */ | |
| .ui.horizontal.segments { | |
| display: -webkit-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: flex; | |
| -webkit-box-orient: horizontal; | |
| -webkit-box-direction: normal; | |
| -webkit-flex-direction: row; | |
| -ms-flex-direction: row; | |
| flex-direction: row; | |
| background-color: transparent; | |
| border-radius: 0px; | |
| padding: 0em; | |
| background-color: #FFFFFF; | |
| box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.075); | |
| margin: 1rem 0em; | |
| border-radius: 4px; | |
| border: 1px solid #D8DEE2; | |
| } | |
| /* Nested Horizontal Group */ | |
| .ui.segments > .horizontal.segments { | |
| margin: 0em; | |
| background-color: transparent; | |
| border-radius: 0px; | |
| border: none; | |
| box-shadow: none; | |
| border-top: 1px solid #D8DEE2; | |
| } | |
| /* Horizontal Segment */ | |
| .ui.horizontal.segments > .segment { | |
| -webkit-box-flex: 1; | |
| -webkit-flex: 1 1 auto; | |
| flex: 1 1 auto; | |
| -ms-flex: 1 1 0px; | |
| /* Solves #2550 MS Flex */ | |
| margin: 0em; | |
| min-width: 0px; | |
| background-color: transparent; | |
| border-radius: 0px; | |
| border: none; | |
| box-shadow: none; | |
| border-left: 1px solid rgba(0, 0, 0, 0.13); | |
| } | |
| /* Border Fixes */ | |
| .ui.segments > .horizontal.segments:first-child { | |
| border-top: none; | |
| } | |
| .ui.horizontal.segments > .segment:first-child { | |
| border-left: none; | |
| } | |
| /******************************* | |
| States | |
| *******************************/ | |
| /*-------------- | |
| Disabled | |
| ---------------*/ | |
| .ui.disabled.segment { | |
| opacity: 0.3; | |
| color: rgba(40, 40, 40, 0.3); | |
| } | |
| /*-------------- | |
| Loading | |
| ---------------*/ | |
| .ui.loading.segment { | |
| position: relative; | |
| cursor: default; | |
| point-events: none; | |
| text-shadow: none !important; | |
| color: transparent !important; | |
| -webkit-transition: all 0s linear; | |
| transition: all 0s linear; | |
| } | |
| .ui.loading.segment:before { | |
| position: absolute; | |
| content: ''; | |
| top: 0%; | |
| left: 0%; | |
| background: rgba(255, 255, 255, 0.8); | |
| width: 100%; | |
| height: 100%; | |
| border-radius: 4px; | |
| z-index: 100; | |
| } | |
| .ui.loading.segment:after { | |
| position: absolute; | |
| content: ''; | |
| top: 50%; | |
| left: 50%; | |
| margin: -1.5em 0em 0em -1.5em; | |
| width: 3em; | |
| height: 3em; | |
| -webkit-animation: segment-spin 0.6s linear; | |
| animation: segment-spin 0.6s linear; | |
| -webkit-animation-iteration-count: infinite; | |
| animation-iteration-count: infinite; | |
| border-radius: 500rem; | |
| border-color: #767676 rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1); | |
| border-style: solid; | |
| border-width: 0.2em; | |
| box-shadow: 0px 0px 0px 1px transparent; | |
| visibility: visible; | |
| z-index: 101; | |
| } | |
| @-webkit-keyframes segment-spin { | |
| from { | |
| -webkit-transform: rotate(0deg); | |
| transform: rotate(0deg); | |
| } | |
| to { | |
| -webkit-transform: rotate(360deg); | |
| transform: rotate(360deg); | |
| } | |
| } | |
| @keyframes segment-spin { | |
| from { | |
| -webkit-transform: rotate(0deg); | |
| transform: rotate(0deg); | |
| } | |
| to { | |
| -webkit-transform: rotate(360deg); | |
| transform: rotate(360deg); | |
| } | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| /*------------------- | |
| Basic | |
| --------------------*/ | |
| .ui.basic.segment { | |
| background: none transparent; | |
| box-shadow: none; | |
| border: none; | |
| border-radius: 0px; | |
| } | |
| /*------------------- | |
| Clearing | |
| --------------------*/ | |
| .ui.clearing.segment:after { | |
| content: "."; | |
| display: block; | |
| height: 0; | |
| clear: both; | |
| visibility: hidden; | |
| } | |
| /*------------------- | |
| Colors | |
| --------------------*/ | |
| /* Red */ | |
| .ui.red.segment:not(.inverted) { | |
| border-top: 0.5em solid #DB2828; | |
| } | |
| .ui.inverted.red.segment { | |
| background-color: #DB2828 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Orange */ | |
| .ui.orange.segment:not(.inverted) { | |
| border-top: 0.5em solid #D26911; | |
| } | |
| .ui.inverted.orange.segment { | |
| background-color: #D26911 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Yellow */ | |
| .ui.yellow.segment:not(.inverted) { | |
| border-top: 0.5em solid #FBBD08; | |
| } | |
| .ui.inverted.yellow.segment { | |
| background-color: #FBBD08 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Olive */ | |
| .ui.olive.segment:not(.inverted) { | |
| border-top: 0.5em solid #B5CC18; | |
| } | |
| .ui.inverted.olive.segment { | |
| background-color: #B5CC18 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Green */ | |
| .ui.green.segment:not(.inverted) { | |
| border-top: 0.5em solid #78CB5B; | |
| } | |
| .ui.inverted.green.segment { | |
| background-color: #78CB5B !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Teal */ | |
| .ui.teal.segment:not(.inverted) { | |
| border-top: 0.5em solid #00B5AD; | |
| } | |
| .ui.inverted.teal.segment { | |
| background-color: #00B5AD !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Blue */ | |
| .ui.blue.segment:not(.inverted) { | |
| border-top: 0.5em solid #80A6CD; | |
| } | |
| .ui.inverted.blue.segment { | |
| background-color: #80A6CD !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Violet */ | |
| .ui.violet.segment:not(.inverted) { | |
| border-top: 0.5em solid #6435C9; | |
| } | |
| .ui.inverted.violet.segment { | |
| background-color: #6435C9 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Purple */ | |
| .ui.purple.segment:not(.inverted) { | |
| border-top: 0.5em solid #A333C8; | |
| } | |
| .ui.inverted.purple.segment { | |
| background-color: #A333C8 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Pink */ | |
| .ui.pink.segment:not(.inverted) { | |
| border-top: 0.5em solid #E03997; | |
| } | |
| .ui.inverted.pink.segment { | |
| background-color: #E03997 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Brown */ | |
| .ui.brown.segment:not(.inverted) { | |
| border-top: 0.5em solid #A5673F; | |
| } | |
| .ui.inverted.brown.segment { | |
| background-color: #A5673F !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Grey */ | |
| .ui.grey.segment:not(.inverted) { | |
| border-top: 0.5em solid #767676; | |
| } | |
| .ui.inverted.grey.segment { | |
| background-color: #767676 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Black */ | |
| .ui.black.segment:not(.inverted) { | |
| border-top: 0.5em solid #333333; | |
| } | |
| .ui.inverted.black.segment { | |
| background-color: #333333 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /*------------------- | |
| Aligned | |
| --------------------*/ | |
| .ui[class*="left aligned"].segment { | |
| text-align: left; | |
| } | |
| .ui[class*="right aligned"].segment { | |
| text-align: right; | |
| } | |
| .ui[class*="center aligned"].segment { | |
| text-align: center; | |
| } | |
| /*------------------- | |
| Floated | |
| --------------------*/ | |
| .ui.floated.segment, | |
| .ui[class*="left floated"].segment { | |
| float: left; | |
| margin-right: 1em; | |
| } | |
| .ui[class*="right floated"].segment { | |
| float: right; | |
| margin-left: 1em; | |
| } | |
| /*------------------- | |
| Inverted | |
| --------------------*/ | |
| .ui.inverted.segment { | |
| border: none; | |
| box-shadow: none; | |
| } | |
| .ui.inverted.segment, | |
| .ui.primary.inverted.segment { | |
| background: #333333; | |
| color: rgba(255, 255, 255, 0.9); | |
| } | |
| /* Nested */ | |
| .ui.inverted.segment .segment { | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| .ui.inverted.segment .inverted.segment { | |
| color: rgba(255, 255, 255, 0.9); | |
| } | |
| /* Attached */ | |
| .ui.inverted.attached.segment { | |
| border-color: #555555; | |
| } | |
| /*------------------- | |
| Emphasis | |
| --------------------*/ | |
| /* Secondary */ | |
| .ui.secondary.segment { | |
| background: #F9F9F9; | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| .ui.secondary.inverted.segment { | |
| background: #555555; | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| /* Tertiary */ | |
| .ui.tertiary.segment { | |
| background: #F0F0F0; | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| .ui.tertiary.inverted.segment { | |
| background: #333333; | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| /*------------------- | |
| Attached | |
| --------------------*/ | |
| /* Middle */ | |
| .ui.attached.segment { | |
| top: 0px; | |
| bottom: 0px; | |
| border-radius: 0px; | |
| margin: 0em -1px; | |
| width: calc(100% + 2px ); | |
| max-width: calc(100% + 2px ); | |
| box-shadow: none; | |
| border: 1px solid #DDDDDD; | |
| } | |
| .ui.attached + .ui.attached.segment:not(.top) { | |
| border-top: none; | |
| } | |
| /* Top */ | |
| .ui[class*="top attached"].segment { | |
| bottom: 0px; | |
| margin-bottom: 0em; | |
| top: 0px; | |
| margin-top: 1rem; | |
| border-radius: 4px 4px 0em 0em; | |
| } | |
| .ui.segment[class*="top attached"]:first-child { | |
| margin-top: 0em; | |
| } | |
| /* Bottom */ | |
| .ui.segment[class*="bottom attached"] { | |
| bottom: 0px; | |
| margin-top: 0em; | |
| top: 0px; | |
| margin-bottom: 1rem; | |
| box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.075), none; | |
| border-radius: 0em 0em 4px 4px; | |
| } | |
| .ui.segment[class*="bottom attached"]:last-child { | |
| margin-bottom: 0em; | |
| } | |
| /******************************* | |
| Overrides | |
| *******************************/ | |
| /******************************* | |
| Site Overrides | |
| *******************************/ | |
| /*! | |
| * # Semantic UI 2.1.8 - Table | |
| * http://github.com/semantic-org/semantic-ui/ | |
| * | |
| * | |
| * Copyright 2015 Contributors | |
| * Released under the MIT license | |
| * http://opensource.org/licenses/MIT | |
| * | |
| */ | |
| /******************************* | |
| Table | |
| *******************************/ | |
| /* Prototype */ | |
| .ui.table { | |
| width: 100%; | |
| background: #FFFFFF; | |
| margin: 1em 0em; | |
| border: 1px solid rgba(0, 0, 0, 0.13); | |
| box-shadow: none; | |
| border-radius: 0.2307em; | |
| text-align: left; | |
| color: rgba(0, 0, 0, 0.87); | |
| border-collapse: separate; | |
| border-spacing: 0px; | |
| } | |
| .ui.table:first-child { | |
| margin-top: 0em; | |
| } | |
| .ui.table:last-child { | |
| margin-bottom: 0em; | |
| } | |
| /******************************* | |
| Parts | |
| *******************************/ | |
| /* Table Content */ | |
| .ui.table th, | |
| .ui.table td { | |
| -webkit-transition: background 0.1s ease, color 0.1s ease; | |
| transition: background 0.1s ease, color 0.1s ease; | |
| } | |
| /* Headers */ | |
| .ui.table thead { | |
| box-shadow: none; | |
| } | |
| .ui.table thead th { | |
| cursor: auto; | |
| background: #F9FAFB; | |
| text-align: inherit; | |
| color: rgba(0, 0, 0, 0.87); | |
| padding: 0.92307692em 0.61538462em; | |
| vertical-align: inherit; | |
| font-style: none; | |
| font-weight: bold; | |
| text-transform: none; | |
| border-bottom: 1px solid rgba(0, 0, 0, 0.06); | |
| border-left: none; | |
| } | |
| .ui.table thead tr > th:first-child { | |
| border-left: none; | |
| } | |
| .ui.table thead tr:first-child > th:first-child { | |
| border-radius: 0.2307em 0em 0em 0em; | |
| } | |
| .ui.table thead tr:first-child > th:last-child { | |
| border-radius: 0em 0.2307em 0em 0em; | |
| } | |
| .ui.table thead tr:first-child > th:only-child { | |
| border-radius: 0.2307em 0.2307em 0em 0em; | |
| } | |
| /* Footer */ | |
| .ui.table tfoot { | |
| box-shadow: none; | |
| } | |
| .ui.table tfoot th { | |
| cursor: auto; | |
| border-top: 1px solid rgba(0, 0, 0, 0.13); | |
| background: #F9FAFB; | |
| text-align: inherit; | |
| color: rgba(0, 0, 0, 0.87); | |
| padding: 0.46153846em 0.61538462em; | |
| vertical-align: middle; | |
| font-style: normal; | |
| font-weight: normal; | |
| text-transform: none; | |
| } | |
| .ui.table tfoot tr > th:first-child { | |
| border-left: none; | |
| } | |
| .ui.table tfoot tr:first-child > th:first-child { | |
| border-radius: 0em 0em 0em 0.2307em; | |
| } | |
| .ui.table tfoot tr:first-child > th:last-child { | |
| border-radius: 0em 0em 0.2307em 0em; | |
| } | |
| .ui.table tfoot tr:first-child > th:only-child { | |
| border-radius: 0em 0em 0.2307em 0.2307em; | |
| } | |
| /* Table Row */ | |
| .ui.table tr td { | |
| border-top: 1px solid rgba(0, 0, 0, 0.06); | |
| } | |
| .ui.table tr:first-child td { | |
| border-top: none; | |
| } | |
| /* Table Cells */ | |
| .ui.table td { | |
| padding: 0.46153846em 0.61538462em; | |
| text-align: inherit; | |
| } | |
| /* Icons */ | |
| .ui.table > .icon { | |
| vertical-align: baseline; | |
| } | |
| .ui.table > .icon:only-child { | |
| margin: 0em; | |
| } | |
| /* Table Segment */ | |
| .ui.table.segment { | |
| padding: 0em; | |
| } | |
| .ui.table.segment:after { | |
| display: none; | |
| } | |
| .ui.table.segment.stacked:after { | |
| display: block; | |
| } | |
| /* Responsive */ | |
| @media only screen and (max-width: 1048px) { | |
| .ui.table:not(.unstackable) { | |
| width: 100%; | |
| } | |
| .ui.table:not(.unstackable) tbody, | |
| .ui.table:not(.unstackable) tr, | |
| .ui.table:not(.unstackable) tr > th, | |
| .ui.table:not(.unstackable) tr > td { | |
| width: auto !important; | |
| display: block !important; | |
| } | |
| .ui.table:not(.unstackable) { | |
| padding: 0em; | |
| } | |
| .ui.table:not(.unstackable) thead { | |
| display: block; | |
| } | |
| .ui.table:not(.unstackable) tfoot { | |
| display: block; | |
| } | |
| .ui.table:not(.unstackable) tr { | |
| padding-top: 1em; | |
| padding-bottom: 1em; | |
| box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset !important; | |
| } | |
| .ui.table:not(.unstackable) tr > th, | |
| .ui.table:not(.unstackable) tr > td { | |
| background: none; | |
| border: none !important; | |
| padding: 0.25em 0.75em !important; | |
| box-shadow: none !important; | |
| } | |
| .ui.table:not(.unstackable) th:first-child, | |
| .ui.table:not(.unstackable) td:first-child { | |
| font-weight: bold; | |
| } | |
| /* Definition Table */ | |
| .ui.definition.table:not(.unstackable) thead th:first-child { | |
| box-shadow: none !important; | |
| } | |
| } | |
| /******************************* | |
| Coupling | |
| *******************************/ | |
| /* UI Image */ | |
| .ui.table th .image, | |
| .ui.table th .image img, | |
| .ui.table td .image, | |
| .ui.table td .image img { | |
| max-width: none; | |
| } | |
| /******************************* | |
| Types | |
| *******************************/ | |
| /*-------------- | |
| Complex | |
| ---------------*/ | |
| .ui.structured.table { | |
| border-collapse: collapse; | |
| } | |
| .ui.structured.table thead th { | |
| border-left: none; | |
| border-right: none; | |
| } | |
| .ui.structured.sortable.table thead th { | |
| border-left: 1px solid rgba(0, 0, 0, 0.13); | |
| border-right: 1px solid rgba(0, 0, 0, 0.13); | |
| } | |
| .ui.structured.basic.table th { | |
| border-left: none; | |
| border-right: none; | |
| } | |
| .ui.structured.celled.table tr th, | |
| .ui.structured.celled.table tr td { | |
| border-left: 1px solid rgba(0, 0, 0, 0.06); | |
| border-right: 1px solid rgba(0, 0, 0, 0.06); | |
| } | |
| /*-------------- | |
| Definition | |
| ---------------*/ | |
| .ui.definition.table thead:not(.full-width) th:first-child { | |
| pointer-events: none; | |
| background: transparent; | |
| font-weight: normal; | |
| color: rgba(0, 0, 0, 0.4); | |
| box-shadow: -1px -1px 0px 1px #FFFFFF; | |
| } | |
| .ui.definition.table tfoot:not(.full-width) th:first-child { | |
| pointer-events: none; | |
| background: transparent; | |
| font-weight: rgba(0, 0, 0, 0.4); | |
| color: normal; | |
| box-shadow: 1px 1px 0px 1px #FFFFFF; | |
| } | |
| /* Remove Border */ | |
| .ui.celled.definition.table thead:not(.full-width) th:first-child { | |
| box-shadow: 0px -1px 0px 1px #FFFFFF; | |
| } | |
| .ui.celled.definition.table tfoot:not(.full-width) th:first-child { | |
| box-shadow: 0px 1px 0px 1px #FFFFFF; | |
| } | |
| /* Highlight Defining Column */ | |
| .ui.definition.table tr td:first-child { | |
| background: rgba(0, 0, 0, 0.03); | |
| font-weight: bold; | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| /* Fix 2nd Column */ | |
| .ui.definition.table thead:not(.full-width) th:nth-child(2) { | |
| border-left: 1px solid rgba(0, 0, 0, 0.13); | |
| } | |
| .ui.definition.table tfoot:not(.full-width) th:nth-child(2) { | |
| border-left: 1px solid rgba(0, 0, 0, 0.13); | |
| } | |
| .ui.definition.table td:nth-child(2) { | |
| border-left: 1px solid rgba(0, 0, 0, 0.13); | |
| } | |
| /******************************* | |
| States | |
| *******************************/ | |
| /*-------------- | |
| Positive | |
| ---------------*/ | |
| .ui.table tr.positive, | |
| .ui.table td.positive { | |
| box-shadow: 0px 0px 0px #A3C293 inset; | |
| } | |
| .ui.table tr.positive, | |
| .ui.table td.positive { | |
| background: #FCFFF5 !important; | |
| color: #2C662D !important; | |
| } | |
| /*-------------- | |
| Negative | |
| ---------------*/ | |
| .ui.table tr.negative, | |
| .ui.table td.negative { | |
| box-shadow: 0px 0px 0px #E0B4B4 inset; | |
| } | |
| .ui.table tr.negative, | |
| .ui.table td.negative { | |
| background: #FFF6F6 !important; | |
| color: #9F3A38 !important; | |
| } | |
| /*-------------- | |
| Error | |
| ---------------*/ | |
| .ui.table tr.error, | |
| .ui.table td.error { | |
| box-shadow: 0px 0px 0px #E0B4B4 inset; | |
| } | |
| .ui.table tr.error, | |
| .ui.table td.error { | |
| background: #FFF6F6 !important; | |
| color: #991111 !important; | |
| } | |
| /*-------------- | |
| Warning | |
| ---------------*/ | |
| .ui.table tr.warning, | |
| .ui.table td.warning { | |
| box-shadow: 0px 0px 0px #C9BA9B inset; | |
| } | |
| .ui.table tr.warning, | |
| .ui.table td.warning { | |
| background: #FFFAF3 !important; | |
| color: #613A00 !important; | |
| } | |
| /*-------------- | |
| Active | |
| ---------------*/ | |
| .ui.table tr.active, | |
| .ui.table td.active { | |
| box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.87) inset; | |
| } | |
| .ui.table tr.active, | |
| .ui.table td.active { | |
| background: #E0E0E0 !important; | |
| color: rgba(0, 0, 0, 0.87) !important; | |
| } | |
| /*-------------- | |
| Disabled | |
| ---------------*/ | |
| .ui.table tr.disabled td, | |
| .ui.table tr td.disabled, | |
| .ui.table tr.disabled:hover, | |
| .ui.table tr:hover td.disabled { | |
| pointer-events: none; | |
| color: rgba(40, 40, 40, 0.3); | |
| } | |
| /******************************* | |
| Variations | |
| *******************************/ | |
| /*-------------- | |
| Stackable | |
| ---------------*/ | |
| @media only screen and (max-width: 1048px) { | |
| .ui[class*="tablet stackable"].table, | |
| .ui[class*="tablet stackable"].table tbody, | |
| .ui[class*="tablet stackable"].table tr, | |
| .ui[class*="tablet stackable"].table tr > th, | |
| .ui[class*="tablet stackable"].table tr > td { | |
| width: 100% !important; | |
| display: block !important; | |
| } | |
| .ui[class*="tablet stackable"].table { | |
| padding: 0em; | |
| } | |
| .ui[class*="tablet stackable"].table thead { | |
| display: block; | |
| } | |
| .ui[class*="tablet stackable"].table tfoot { | |
| display: block; | |
| } | |
| .ui[class*="tablet stackable"].table tr { | |
| padding-top: 1em; | |
| padding-bottom: 1em; | |
| box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset !important; | |
| } | |
| .ui[class*="tablet stackable"].table tr > th, | |
| .ui[class*="tablet stackable"].table tr > td { | |
| background: none; | |
| border: none !important; | |
| padding: 0.25em 0.75em; | |
| box-shadow: none !important; | |
| } | |
| /* Definition Table */ | |
| .ui.definition[class*="tablet stackable"].table thead th:first-child { | |
| box-shadow: none !important; | |
| } | |
| } | |
| /*-------------- | |
| Text Alignment | |
| ---------------*/ | |
| .ui.table[class*="left aligned"], | |
| .ui.table [class*="left aligned"] { | |
| text-align: left; | |
| } | |
| .ui.table[class*="center aligned"], | |
| .ui.table [class*="center aligned"] { | |
| text-align: center; | |
| } | |
| .ui.table[class*="right aligned"], | |
| .ui.table [class*="right aligned"] { | |
| text-align: right; | |
| } | |
| /*------------------ | |
| Vertical Alignment | |
| ------------------*/ | |
| .ui.table[class*="top aligned"], | |
| .ui.table [class*="top aligned"] { | |
| vertical-align: top; | |
| } | |
| .ui.table[class*="middle aligned"], | |
| .ui.table [class*="middle aligned"] { | |
| vertical-align: middle; | |
| } | |
| .ui.table[class*="bottom aligned"], | |
| .ui.table [class*="bottom aligned"] { | |
| vertical-align: bottom; | |
| } | |
| /*-------------- | |
| Collapsing | |
| ---------------*/ | |
| .ui.table th.collapsing, | |
| .ui.table td.collapsing { | |
| width: 1px; | |
| white-space: nowrap; | |
| } | |
| /*-------------- | |
| Fixed | |
| ---------------*/ | |
| .ui.fixed.table { | |
| table-layout: fixed; | |
| } | |
| .ui.fixed.table th, | |
| .ui.fixed.table td { | |
| overflow: hidden; | |
| text-overflow: ellipsis; | |
| } | |
| /*-------------- | |
| Selectable | |
| ---------------*/ | |
| .ui.selectable.table tbody tr:hover, | |
| .ui.table tbody tr td.selectable:hover { | |
| background: #F5F5F5 !important; | |
| color: rgba(0, 0, 0, 0.87) !important; | |
| } | |
| .ui.selectable.inverted.table tbody tr:hover, | |
| .ui.inverted.table tbody tr td.selectable:hover { | |
| background: rgba(255, 255, 255, 0.08) !important; | |
| color: #ffffff !important; | |
| } | |
| /* Selectable Cell Link */ | |
| .ui.table tbody tr td.selectable { | |
| padding: 0em; | |
| } | |
| .ui.table tbody tr td.selectable > a:not(.ui) { | |
| display: block; | |
| color: inherit; | |
| padding: 0.46153846em 0.61538462em; | |
| } | |
| /* Other States */ | |
| .ui.selectable.table tr.error:hover, | |
| .ui.table tr td.selectable.error:hover, | |
| .ui.selectable.table tr:hover td.error { | |
| background: #ffe7e7 !important; | |
| color: #8b0f0f !important; | |
| } | |
| .ui.selectable.table tr.warning:hover, | |
| .ui.table tr td.selectable.warning:hover, | |
| .ui.selectable.table tr:hover td.warning { | |
| background: #fff4e4 !important; | |
| color: #523100 !important; | |
| } | |
| .ui.selectable.table tr.active:hover, | |
| .ui.table tr td.selectable.active:hover, | |
| .ui.selectable.table tr:hover td.active { | |
| background: #E0E0E0 !important; | |
| color: rgba(0, 0, 0, 0.87) !important; | |
| } | |
| .ui.selectable.table tr.positive:hover, | |
| .ui.table tr td.selectable.positive:hover, | |
| .ui.selectable.table tr:hover td.positive { | |
| background: #f7ffe6 !important; | |
| color: #275b28 !important; | |
| } | |
| .ui.selectable.table tr.negative:hover, | |
| .ui.table tr td.selectable.negative:hover, | |
| .ui.selectable.table tr:hover td.negative { | |
| background: #ffe7e7 !important; | |
| color: #943634 !important; | |
| } | |
| /*------------------- | |
| Attached | |
| --------------------*/ | |
| /* Middle */ | |
| .ui.attached.table { | |
| top: 0px; | |
| bottom: 0px; | |
| border-radius: 0px; | |
| margin: 0em -1px; | |
| width: calc(100% + 2px ); | |
| max-width: calc(100% + 2px ); | |
| box-shadow: none; | |
| border: 1px solid #DDDDDD; | |
| } | |
| .ui.attached + .ui.attached.table:not(.top) { | |
| border-top: none; | |
| } | |
| /* Top */ | |
| .ui[class*="top attached"].table { | |
| bottom: 0px; | |
| margin-bottom: 0em; | |
| top: 0px; | |
| margin-top: 1em; | |
| border-radius: 0.2307em 0.2307em 0em 0em; | |
| } | |
| .ui.table[class*="top attached"]:first-child { | |
| margin-top: 0em; | |
| } | |
| /* Bottom */ | |
| .ui[class*="bottom attached"].table { | |
| bottom: 0px; | |
| margin-top: 0em; | |
| top: 0px; | |
| margin-bottom: 1em; | |
| box-shadow: none, none; | |
| border-radius: 0em 0em 0.2307em 0.2307em; | |
| } | |
| .ui[class*="bottom attached"].table:last-child { | |
| margin-bottom: 0em; | |
| } | |
| /*-------------- | |
| Striped | |
| ---------------*/ | |
| /* Table Striping */ | |
| .ui.striped.table > tr:nth-child(2n), | |
| .ui.striped.table tbody tr:nth-child(2n) { | |
| background-color: rgba(0, 0, 50, 0.02); | |
| } | |
| /* Stripes */ | |
| .ui.inverted.striped.table > tr:nth-child(2n), | |
| .ui.inverted.striped.table tbody tr:nth-child(2n) { | |
| background-color: rgba(255, 255, 255, 0.05); | |
| } | |
| /*-------------- | |
| Single Line | |
| ---------------*/ | |
| .ui.table[class*="single line"], | |
| .ui.table [class*="single line"] { | |
| white-space: nowrap; | |
| } | |
| .ui.table[class*="single line"], | |
| .ui.table [class*="single line"] { | |
| white-space: nowrap; | |
| } | |
| /*------------------- | |
| Colors | |
| --------------------*/ | |
| /* Red */ | |
| .ui.red.table { | |
| border-top: 0.2em solid #DB2828; | |
| } | |
| .ui.inverted.red.table { | |
| background-color: #DB2828 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Orange */ | |
| .ui.orange.table { | |
| border-top: 0.2em solid #D26911; | |
| } | |
| .ui.inverted.orange.table { | |
| background-color: #D26911 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Yellow */ | |
| .ui.yellow.table { | |
| border-top: 0.2em solid #FBBD08; | |
| } | |
| .ui.inverted.yellow.table { | |
| background-color: #FBBD08 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Olive */ | |
| .ui.olive.table { | |
| border-top: 0.2em solid #B5CC18; | |
| } | |
| .ui.inverted.olive.table { | |
| background-color: #B5CC18 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Green */ | |
| .ui.green.table { | |
| border-top: 0.2em solid #78CB5B; | |
| } | |
| .ui.inverted.green.table { | |
| background-color: #78CB5B !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Teal */ | |
| .ui.teal.table { | |
| border-top: 0.2em solid #00B5AD; | |
| } | |
| .ui.inverted.teal.table { | |
| background-color: #00B5AD !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Blue */ | |
| .ui.blue.table { | |
| border-top: 0.2em solid #80A6CD; | |
| } | |
| .ui.inverted.blue.table { | |
| background-color: #80A6CD !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Violet */ | |
| .ui.violet.table { | |
| border-top: 0.2em solid #6435C9; | |
| } | |
| .ui.inverted.violet.table { | |
| background-color: #6435C9 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Purple */ | |
| .ui.purple.table { | |
| border-top: 0.2em solid #A333C8; | |
| } | |
| .ui.inverted.purple.table { | |
| background-color: #A333C8 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Pink */ | |
| .ui.pink.table { | |
| border-top: 0.2em solid #E03997; | |
| } | |
| .ui.inverted.pink.table { | |
| background-color: #E03997 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Brown */ | |
| .ui.brown.table { | |
| border-top: 0.2em solid #A5673F; | |
| } | |
| .ui.inverted.brown.table { | |
| background-color: #A5673F !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Grey */ | |
| .ui.grey.table { | |
| border-top: 0.2em solid #767676; | |
| } | |
| .ui.inverted.grey.table { | |
| background-color: #767676 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /* Black */ | |
| .ui.black.table { | |
| border-top: 0.2em solid #333333; | |
| } | |
| .ui.inverted.black.table { | |
| background-color: #333333 !important; | |
| color: #FFFFFF !important; | |
| } | |
| /*-------------- | |
| Column Count | |
| ---------------*/ | |
| /* Grid Based */ | |
| .ui.one.column.table td { | |
| width: 100%; | |
| } | |
| .ui.two.column.table td { | |
| width: 50%; | |
| } | |
| .ui.three.column.table td { | |
| width: 33.33333333%; | |
| } | |
| .ui.four.column.table td { | |
| width: 25%; | |
| } | |
| .ui.five.column.table td { | |
| width: 20%; | |
| } | |
| .ui.six.column.table td { | |
| width: 16.66666667%; | |
| } | |
| .ui.seven.column.table td { | |
| width: 14.28571429%; | |
| } | |
| .ui.eight.column.table td { | |
| width: 12.5%; | |
| } | |
| .ui.nine.column.table td { | |
| width: 11.11111111%; | |
| } | |
| .ui.ten.column.table td { | |
| width: 10%; | |
| } | |
| .ui.eleven.column.table td { | |
| width: 9.09090909%; | |
| } | |
| .ui.twelve.column.table td { | |
| width: 8.33333333%; | |
| } | |
| .ui.thirteen.column.table td { | |
| width: 7.69230769%; | |
| } | |
| .ui.fourteen.column.table td { | |
| width: 7.14285714%; | |
| } | |
| .ui.fifteen.column.table td { | |
| width: 6.66666667%; | |
| } | |
| .ui.sixteen.column.table td { | |
| width: 6.25%; | |
| } | |
| /* Column Width */ | |
| .ui.table th.one.wide, | |
| .ui.table td.one.wide { | |
| width: 6.25%; | |
| } | |
| .ui.table th.two.wide, | |
| .ui.table td.two.wide { | |
| width: 12.5%; | |
| } | |
| .ui.table th.three.wide, | |
| .ui.table td.three.wide { | |
| width: 18.75%; | |
| } | |
| .ui.table th.four.wide, | |
| .ui.table td.four.wide { | |
| width: 25%; | |
| } | |
| .ui.table th.five.wide, | |
| .ui.table td.five.wide { | |
| width: 31.25%; | |
| } | |
| .ui.table th.six.wide, | |
| .ui.table td.six.wide { | |
| width: 37.5%; | |
| } | |
| .ui.table th.seven.wide, | |
| .ui.table td.seven.wide { | |
| width: 43.75%; | |
| } | |
| .ui.table th.eight.wide, | |
| .ui.table td.eight.wide { | |
| width: 50%; | |
| } | |
| .ui.table th.nine.wide, | |
| .ui.table td.nine.wide { | |
| width: 56.25%; | |
| } | |
| .ui.table th.ten.wide, | |
| .ui.table td.ten.wide { | |
| width: 62.5%; | |
| } | |
| .ui.table th.eleven.wide, | |
| .ui.table td.eleven.wide { | |
| width: 68.75%; | |
| } | |
| .ui.table th.twelve.wide, | |
| .ui.table td.twelve.wide { | |
| width: 75%; | |
| } | |
| .ui.table th.thirteen.wide, | |
| .ui.table td.thirteen.wide { | |
| width: 81.25%; | |
| } | |
| .ui.table th.fourteen.wide, | |
| .ui.table td.fourteen.wide { | |
| width: 87.5%; | |
| } | |
| .ui.table th.fifteen.wide, | |
| .ui.table td.fifteen.wide { | |
| width: 93.75%; | |
| } | |
| .ui.table th.sixteen.wide, | |
| .ui.table td.sixteen.wide { | |
| width: 100%; | |
| } | |
| /*-------------- | |
| Sortable | |
| ---------------*/ | |
| .ui.sortable.table thead th { | |
| cursor: pointer; | |
| white-space: nowrap; | |
| border-left: 1px solid rgba(0, 0, 0, 0.13); | |
| color: rgba(0, 0, 0, 0.87); | |
| } | |
| .ui.sortable.table thead th:first-child { | |
| border-left: none; | |
| } | |
| .ui.sortable.table thead th.sorted, | |
| .ui.sortable.table thead th.sorted:hover { | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; | |
| } | |
| .ui.sortable.table thead th:after { | |
| display: none; | |
| font-style: normal; | |
| font-weight: normal; | |
| text-decoration: inherit; | |
| content: ''; | |
| height: 1em; | |
| width: auto; | |
| opacity: 0.8; | |
| margin: 0em 0em 0em 0.5em; | |
| font-family: 'Icons'; | |
| } | |
| .ui.sortable.table thead th.ascending:after { | |
| content: '\f0d8'; | |
| } | |
| .ui.sortable.table thead th.descending:after { | |
| content: '\f0d7'; | |
| } | |
| /* Hover */ | |
| .ui.sortable.table th.disabled:hover { | |
| cursor: auto; | |
| color: rgba(40, 40, 40, 0.3); | |
| } | |
| .ui.sortable.table thead th:hover { | |
| background: rgba(0, 0, 0, 0.05); | |
| color: rgba(0, 0, 0, 0.8); | |
| } | |
| /* Sorted */ | |
| .ui.sortable.table thead th.sorted { | |
| background: rgba(0, 0, 0, 0.05); | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| .ui.sortable.table thead th.sorted:after { | |
| display: inline-block; | |
| } | |
| /* Sorted Hover */ | |
| .ui.sortable.table thead th.sorted:hover { | |
| background: rgba(0, 0, 0, 0.05); | |
| color: rgba(0, 0, 0, 0.95); | |
| } | |
| /* Inverted */ | |
| .ui.inverted.sortable.table thead th.sorted { | |
| background: rgba(255, 255, 255, 0.15) -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05)); | |
| background: rgba(255, 255, 255, 0.15) linear-gradient(transparent, rgba(0, 0, 0, 0.05)); | |
| color: #ffffff; | |
| } | |
| .ui.inverted.sortable.table thead th:hover { | |
| background: rgba(255, 255, 255, 0.08) -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05)); | |
| background: rgba(255, 255, 255, 0.08) linear-gradient(transparent, rgba(0, 0, 0, 0.05)); | |
| color: #ffffff; | |
| } | |
| .ui.inverted.sortable.table thead th { | |
| border-left-color: transparent; | |
| border-right-color: transparent; | |
| } | |
| /*-------------- | |
| Inverted | |
| ---------------*/ | |
| /* Text Color */ | |
| .ui.inverted.table { | |
| background: #333333; | |
| color: rgba(255, 255, 255, 0.9); | |
| border: none; | |
| } | |
| .ui.inverted.table th { | |
| background-color: rgba(0, 0, 0, 0.15); | |
| border-color: rgba(255, 255, 255, 0.1) !important; | |
| color: rgba(255, 255, 255, 0.9); | |
| } | |
| .ui.inverted.table tr td { | |
| border-color: rgba(255, 255, 255, 0.1) !important; | |
| } | |
| .ui.inverted.table tr.disabled td, | |
| .ui.inverted.table tr td.disabled, | |
| .ui.inverted.table tr.disabled:hover td, | |
| .ui.inverted.table tr:hover td.disabled { | |
| pointer-events: none; | |
| color: rgba(225, 225, 225, 0.3); | |
| } | |
| /* Definition */ | |
| .ui.inverted.definition.table tfoot:not(.full-width) th:first-child, | |
| .ui.inverted.definition.table thead:not(.full-width) th:first-child { | |
| background: #FFFFFF; | |
| } | |
| .ui.inverted.definition.table tr td:first-child { | |
| background: rgba(255, 255, 255, 0.02); | |
| color: #ffffff; | |
| } | |
| /*-------------- | |
| Collapsing | |
| ---------------*/ | |
| .ui.collapsing.table { | |
| width: auto; | |
| } | |
| /*-------------- | |
| Basic | |
| ---------------*/ | |
| .ui.basic.table { | |
| background: transparent; | |
| border: 1px solid rgba(0, 0, 0, 0.13); | |
| box-shadow: none; | |
| } | |
| .ui.basic.table thead, | |
| .ui.basic.table tfoot { | |
| box-shadow: none; | |
| } | |
| .ui.basic.table th { | |
| background: transparent; | |
| border-left: none; | |
| } | |
| .ui.basic.table tbody tr { | |
| border-bottom: 1px solid rgba(0, 0, 0, 0.1); | |
| } | |
| .ui.basic.table td { | |
| background: transparent; | |
| } | |
| .ui.basic.striped.table tbody tr:nth-child(2n) { | |
| background-color: rgba(0, 0, 0, 0.05) !important; | |
| } | |
| /* Very Basic */ | |
| .ui[class*="very basic"].table { | |
| border: none; | |
| } | |
| .ui[class*="very basic"].table:not(.sortable):not(.striped) th, | |
| .ui[class*="very basic"].table:not(.sortable):not(.striped) td { | |
| padding: ''; | |
| } | |
| .ui[class*="very basic"].table:not(.sortable):not(.striped) th:first-child, | |
| .ui[class*="very basic"].table:not(.sortable):not(.striped) td:first-child { | |
| padding-left: 0em; | |
| } | |
| .ui[class*="very basic"].table:not(.sortable):not(.striped) th:last-child, | |
| .ui[class*="very basic"].table:not(.sortable):not(.striped) td:last-child { | |
| padding-right: 0em; | |
| } | |
| .ui[class*="very basic"].table:not(.sortable):not(.striped) thead tr:first-child th { | |
| padding-top: 0em; | |
| } | |
| /*-------------- | |
| Celled | |
| ---------------*/ | |
| .ui.celled.table tr th, | |
| .ui.celled.table tr td { | |
| border-left: 1px solid rgba(0, 0, 0, 0.06); | |
| } | |
| .ui.celled.table tr th:first-child, | |
| .ui.celled.table tr td:first-child { | |
| border-left: none; | |
| } | |
| /*-------------- | |
| Padded | |
| ---------------*/ | |
| .ui.padded.table th { | |
| padding-left: 1em; | |
| padding-right: 1em; | |
| } | |
| .ui.padded.table th, | |
| .ui.padded.table td { | |
| padding: 1em 1em; | |
| } | |
| /* Very */ | |
| .ui[class*="very padded"].table th { | |
| padding-left: 1.5em; | |
| padding-right: 1.5em; | |
| } | |
| .ui[class*="very padded"].table td { | |
| padding: 1.5em 1.5em; | |
| } | |
| /*-------------- | |
| Compact | |
| ---------------*/ | |
| .ui.compact.table th { | |
| padding-left: 0.7em; | |
| padding-right: 0.7em; | |
| } | |
| .ui.compact.table td { | |
| padding: 0.5em 0.7em; | |
| } | |
| /* Very */ | |
| .ui[class*="very compact"].table th { | |
| padding-left: 0.6em; | |
| padding-right: 0.6em; | |
| } | |
| .ui[class*="very compact"].table td { | |
| padding: 0.4em 0.6em; | |
| } | |
| /*-------------- | |
| Sizes | |
| ---------------*/ | |
| /* Small */ | |
| .ui.small.table { | |
| font-size: 0.9em; | |
| } | |
| /* Standard */ | |
| .ui.table { | |
| font-size: 1em; | |
| } | |
| /* Large */ | |
| .ui.large.table { | |
| font-size: 1.1em; | |
| } | |
| .menu { | |
| right: -100.328px; | |
| } | |
| /*!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/ | |
| /*!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/ | |
| /*!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/ | |
| /*!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/ | |
| /*!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/ | |
| /* Repo icon */ | |
| .repository .header-grid .mega-octicon { | |
| font-size: 16px; | |
| color: #959da5; | |
| } | |
| .repository .header-wrapper .ui.tabular .octicon { | |
| color: rgba(27,31,35,0.3); | |
| } | |
| /* Page width */ | |
| .ui.container { | |
| width: 980px; | |
| } | |
| .repository.file.list #repo-files-table thead th { | |
| background-color: #f1f8ff; | |
| } | |
| .repository.file.list #repo-files-table tbody .octicon { | |
| color: rgba(3,47,98,0.5); | |
| } | |
| .repository.file.list #repo-files-table tbody .octicon.octicon-file-directory, .repository.file.list #repo-files-table tbody .octicon.octicon-file-submodule, .repository.file.list #repo-files-table tbody .octicon.octicon-file-symlink-directory { | |
| color: rgba(3,47,98,0.5); | |
| } | |
| .following.bar.light { | |
| background-color: #fff; | |
| border-bottom: 1px solid #DDD; | |
| box-shadow: 0 2px 3px rgba(0,0,0,.04); | |
| } | |
| .following.bar { | |
| margin: 0px; | |
| } | |
| .repository .header-grid .ui.huge.breadcrumbn { | |
| line-height: 26px; | |
| font-size: 18px; | |
| } | |
| .repository.file.list #file-buttons .ui.button { | |
| color: #24292e; | |
| background-color: #e6ebf1; | |
| background-image: linear-gradient(-180deg, #fafbfc 0%, #eff3f6 90%); | |
| font-weight: 600; | |
| } | |
| .ui.tabular.menu:not(.vertical) .active.item { | |
| border-right-color: rgb(225, 228, 232); | |
| border-bottom-color: transparent; | |
| border-left-color: rgb(225, 228, 232); | |
| } | |
| .repository .ui.tabs.container .ui.menu { | |
| font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"; | |
| font-size: 14px; | |
| line-height: 1.5; | |
| color: #24292e; | |
| } |