@charset "UTF-8";
@font-face {
  font-family: "FS Me Web";
  font-style: normal;
  font-weight: normal;
  src: url("fonts/UBSMeWeb-Regular.eot");
  /* IE 8 compatibility mode */
  src: url("fonts/UBSMeWeb-Regular.eot?#iefix") format("embedded-opentype"), url("fonts/UBSMeWeb-Regular.woff") format("woff"), url("fonts/UBSMeWeb-Regular.ttf") format("truetype"), url("fonts/UBSMeWeb-Regular.svg#UBSMeWeb-Regular") format("svg"); }

@font-face {
  font-family: "FS Me Web";
  font-style: normal;
  font-weight: bold;
  src: url("fonts/UBSMeWeb-Bold.eot");
  /* IE 8 compatibility mode */
  src: url("fonts/UBSMeWeb-Bold.eot?#iefix") format("embedded-opentype"), url("fonts/UBSMeWeb-Bold.woff") format("woff"), url("fonts/UBSMeWeb-Bold.ttf") format("truetype"), url("fonts/UBSMeWeb-Bold.svg#UBSMeWeb-Bold") format("svg"); }

@font-face {
  font-family: "FS Me Web";
  font-style: italic;
  font-weight: normal;
  line-height: 1.5;
  src: url("fonts/UBSMeWeb-Italic.eot");
  /* IE 8 compatibility mode */
  src: url("fonts/UBSMeWeb-Italic.eot?#iefix") format("embedded-opentype"), url("fonts/UBSMeWeb-Italic.woff") format("woff"), url("fonts/UBSMeWeb-Italic.ttf") format("truetype"), url("fonts/UBSMeWeb-Italic.svg#UBSMeWeb-Italic") format("svg"); }

@font-face {
  font-family: "FS Me Web";
  font-style: italic;
  font-weight: bold;
  src: url("fonts/UBSMeWeb-BoldItalic.eot");
  /* IE 8 compatibility mode */
  src: url("fonts/UBSMeWeb-BoldItalic.eot?#iefix") format("embedded-opentype"), url("fonts/UBSMeWeb-BoldItalic.woff") format("woff"), url("fonts/UBSMeWeb-BoldItalic.ttf") format("truetype"), url("fonts/UBSMeWeb-BoldItalic.svg#UBSMeWeb-BoldItalic") format("svg"); }

@font-face {
  font-family: "OpenSans Web";
  font-style: normal;
  font-weight: normal;
  src: url("fonts/OpenSans-Regular.eot");
  /* IE 8 compatibility mode */
  src: url("fonts/OpenSans-Regular.eot?#iefix") format("embedded-opentype"), url("fonts/OpenSans-Regular.woff") format("woff"), url("fonts/OpenSans-Regular.ttf") format("truetype"), url("fonts/OpenSans-Regular.svg#OpenSans-Regular") format("svg"); }

@font-face {
  font-family: "OpenSans Web";
  font-style: normal;
  font-weight: bold;
  src: url("fonts/OpenSans-Semibold.eot");
  /* IE 8 compatibility mode */
  src: url("fonts/OpenSans-Semibold.eot?#iefix") format("embedded-opentype"), url("fonts/OpenSans-Semibold.woff") format("woff"), url("fonts/OpenSans-Semibold.ttf") format("truetype"), url("fonts/OpenSans-Semibold.svg#OpenSans-Semibold") format("svg"); }

@font-face {
  font-family: "OpenSans Web";
  font-style: italic;
  font-weight: normal;
  src: url("fonts/OpenSans-Italic.eot");
  /* IE 8 compatibility mode */
  src: url("fonts/OpenSans-Italic.eot?#iefix") format("embedded-opentype"), url("fonts/OpenSans-Italic.woff") format("woff"), url("fonts/OpenSans-Italic.ttf") format("truetype"), url("fonts/OpenSans-Italic.svg#OpenSans-Italic") format("svg"); }

@font-face {
  font-family: "OpenSans Web";
  font-style: italic;
  font-weight: bold;
  src: url("fonts/OpenSans-SemiboldItalic.eot");
  /* IE 8 compatibility mode */
  src: url("fonts/OpenSans-SemiboldItalic.eot?#iefix") format("embedded-opentype"), url("fonts/OpenSans-SemiboldItalic.woff") format("woff"), url("fonts/OpenSans-SemiboldItalic.ttf") format("truetype"), url("fonts/OpenSans-SemiboldItalic.svg#OpenSans-SemiboldItalic") format("svg"); }

button, input, optgroup, select, textarea {
  line-height: inherit; }

html {
  box-sizing: border-box; }

*,
*::before,
*::after {
  box-sizing: inherit; }

body {
  text-transform: none;
  line-height: 1.38472;
  letter-spacing: 0;
  font-family: -apple-system, "BlinkMacSystemFont", "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Open Sans", "Helvetica Neue", "Icons16", sans-serif;
  font-size: 13px;
  font-weight: 400;
  background-color: #ebebeb;
  color: #444;
  font-family: "FS Me Web", Arial, Helvetica, sans-serif;
  vertical-align: text-bottom; }
  body.reui-dark {
    background-color: #404040; }

p {
  margin-top: 0;
  margin-bottom: 10px; }

small {
  font-size: 12px; }

strong {
  font-weight: 600; }

::selection {
  background: rgba(125, 188, 255, 0.6); }

/*
Headings

Markup:
<div>
  <h1 class="@ns-heading">H1 heading</h1>
  <h2 class="@ns-heading">H2 heading</h2>
  <h3 class="@ns-heading">H3 heading</h3>
  <h4 class="@ns-heading">H4 heading</h4>
  <h5 class="@ns-heading">H5 heading</h5>
  <h6 class="@ns-heading">H6 heading</h6>
</div>

Styleguide headings
*/
.reui-heading {
  color: #444;
  font-weight: 600;
  margin: 0 0 10px;
  padding: 0; }
  .reui-dark .reui-heading {
    color: #fafafa; }

h1.reui-heading, .reui-running-text h1 {
  line-height: 40px;
  font-size: 35px; }

h2.reui-heading, .reui-running-text h2 {
  line-height: 32px;
  font-size: 27px; }

h3.reui-heading, .reui-running-text h3 {
  line-height: 25px;
  font-size: 21px; }

h4.reui-heading, .reui-running-text h4 {
  line-height: 21px;
  font-size: 17px; }

h5.reui-heading, .reui-running-text h5 {
  line-height: 19px;
  font-size: 15px; }

h6.reui-heading, .reui-running-text h6 {
  line-height: 16px;
  font-size: 13px; }

/*
UI text

Markup:
<div class="{{.modifier}}">
  More than a decade ago, we set out to create products that would transform
  the way organizations use their data. Today, our products are deployed at
  the most critical government, commercial, and non-profit institutions in
  the world to solve problems we hadn’t even dreamed of back then.
</div>

.reui-ui-text - Default Blueprint font styles, applied to the `<body>` tag and available as a class for nested resets.
.reui-monospace-text - Use a monospace font (ideal for code).
.reui-running-text - Increase line height ideal for longform text. See [Running text](#core/typography.running-text) below for additional features.
.reui-text-large - Use a larger font size.
.reui-text-small - Use a smaller font size.
.reui-text-muted - Change text color to a gentler gray.
.reui-text-disabled - Change text color to a transparent, faded gray.
.reui-text-overflow-ellipsis - Truncate a single line of text with an ellipsis if it overflows its container.

Styleguide ui-text
*/
.reui-ui-text {
  text-transform: none;
  line-height: 1.38472;
  letter-spacing: 0;
  font-family: -apple-system, "BlinkMacSystemFont", "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Open Sans", "Helvetica Neue", "Icons16", sans-serif;
  font-size: 13px;
  font-weight: 400; }

.reui-monospace-text {
  text-transform: none;
  font-family: monospace; }

.reui-text-muted {
  color: #808080; }
  .reui-dark .reui-text-muted {
    color: #d4d4d4; }

.reui-text-disabled {
  color: rgba(128, 128, 128, 0.5); }
  .reui-dark .reui-text-disabled {
    color: rgba(212, 212, 212, 0.5); }

.reui-text-overflow-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal; }

/*
Running text

Markup:
<div class="@ns-running-text {{.modifier}}">
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
    eiusmod tempor incididunt ut labore et dolore magna aliqua.
  </p>
  <ul>
    <li>Item the <code>first</code>.</li>
    <li>Item the <strong>second</strong></code>.</li>
    <li>Item the <a href="#core/typography.running-text">third</a>.</li>
  </ul>
  <h3>New section</h3>
  <p>
    Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
    nisi ut aliquip ex ea commodo consequat.
  </p>
</div>

.reui-text-large - Use larger font size.

Styleguide running-text
*/
.reui-running-text {
  line-height: 1.5;
  font-size: 13px; }
  .reui-running-text h1 {
    color: #444;
    font-weight: 600;
    margin-top: 40px;
    margin-bottom: 20px; }
    .reui-dark .reui-running-text h1 {
      color: #fafafa; }
  .reui-running-text h2 {
    color: #444;
    font-weight: 600;
    margin-top: 40px;
    margin-bottom: 20px; }
    .reui-dark .reui-running-text h2 {
      color: #fafafa; }
  .reui-running-text h3 {
    color: #444;
    font-weight: 600;
    margin-top: 40px;
    margin-bottom: 20px; }
    .reui-dark .reui-running-text h3 {
      color: #fafafa; }
  .reui-running-text h4 {
    color: #444;
    font-weight: 600;
    margin-top: 40px;
    margin-bottom: 20px; }
    .reui-dark .reui-running-text h4 {
      color: #fafafa; }
  .reui-running-text h5 {
    color: #444;
    font-weight: 600;
    margin-top: 40px;
    margin-bottom: 20px; }
    .reui-dark .reui-running-text h5 {
      color: #fafafa; }
  .reui-running-text h6 {
    color: #444;
    font-weight: 600;
    margin-top: 40px;
    margin-bottom: 20px; }
    .reui-dark .reui-running-text h6 {
      color: #fafafa; }
  .reui-running-text hr {
    margin: 20px 0;
    border: none;
    border-bottom: 1px solid rgba(16, 22, 26, 0.175); }
    .reui-dark .reui-running-text hr {
      border-color: rgba(255, 255, 255, 0.15); }
  .reui-running-text p {
    margin: 0 0 10px;
    padding: 0; }

.reui-text-large {
  font-size: 16px; }

.reui-text-small {
  font-size: 12px; }

/*
Links

Simply use an `<a href="">` tag as you normally would. No class is necessary for Blueprint styles.
Links are underlined only when hovered.

Putting an icon inside a link will cause it to inherit the link's text color.

Styleguide typography.links
*/
a {
  text-decoration: none;
  color: #106ba3; }
  a:hover {
    cursor: pointer;
    text-decoration: underline;
    color: #106ba3; }
  a .reui-icon, a .reui-icon-standard, a .reui-icon-large {
    color: inherit; }
  a code,
  .reui-dark a code {
    color: inherit; }
  .reui-dark a,
  .reui-dark a:hover {
    color: #48aff0; }
    .reui-dark a .reui-icon, .reui-dark a .reui-icon-standard, .reui-dark a .reui-icon-large,
    .reui-dark a:hover .reui-icon,
    .reui-dark a:hover .reui-icon-standard,
    .reui-dark a:hover .reui-icon-large {
      color: inherit; }

/*
Preformatted text

Markup:
<div>
  <p>Use the <code class="@ns-code">&lt;code></code> tag for snippets of code.</p>
  <pre class="@ns-code-block">Use the &lt;pre> tag for blocks of code.</pre>
  <pre class="@ns-code-block"><code>// code sample
export function hasModifier(
  modifiers: ts.ModifiersArray,
  ...modifierKinds: ts.SyntaxKind[],
) {
  if (modifiers == null || modifierKinds == null) {
    return false;
  }
  return modifiers.some(m => modifierKinds.some(k => m.kind === k));
}</code></pre>
</div>

Styleguide preformatted
*/
.reui-running-text code, .reui-code {
  text-transform: none;
  font-family: monospace;
  border-radius: 0;
  box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.2);
  background: rgba(255, 255, 255, 0.7);
  padding: 2px 5px;
  color: #808080;
  font-size: smaller; }
  .reui-dark .reui-running-text code, .reui-running-text .reui-dark code, .reui-dark .reui-code {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.4);
    background: rgba(16, 22, 26, 0.3);
    color: #d4d4d4; }
  .reui-running-text a > code, a > .reui-code {
    color: #137cbd; }
    .reui-dark .reui-running-text a > code, .reui-running-text .reui-dark a > code, .reui-dark a > .reui-code {
      color: inherit; }

.reui-running-text pre, .reui-code-block {
  text-transform: none;
  font-family: monospace;
  display: block;
  margin: 10px 0;
  border-radius: 0;
  box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.175);
  background: rgba(255, 255, 255, 0.7);
  padding: 13px 15px 12px;
  line-height: 1.4;
  color: #444;
  font-size: 12px;
  word-break: break-all;
  word-wrap: break-word; }
  .reui-dark .reui-running-text pre, .reui-running-text .reui-dark pre, .reui-dark .reui-code-block {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.4);
    background: rgba(16, 22, 26, 0.3);
    color: #fafafa; }
  .reui-running-text pre > code, .reui-code-block > code {
    box-shadow: none;
    background: none;
    padding: 0;
    color: inherit;
    font-size: inherit; }

.reui-running-text kbd, .reui-key {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0;
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 0 0 rgba(16, 22, 26, 0), 0 1px 1px rgba(16, 22, 26, 0.2);
  background: #ffffff;
  min-width: 24px;
  height: 24px;
  padding: 0 0;
  vertical-align: middle;
  line-height: 24px;
  color: #808080;
  font-family: inherit;
  font-size: 12px; }
  .reui-running-text kbd .reui-icon, .reui-key .reui-icon, .reui-running-text kbd .reui-icon-standard, .reui-key .reui-icon-standard, .reui-running-text kbd .reui-icon-large, .reui-key .reui-icon-large {
    margin-right: 5px; }
  .reui-dark .reui-running-text kbd, .reui-running-text .reui-dark kbd, .reui-dark .reui-key {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 0 0 rgba(16, 22, 26, 0), 0 1px 1px rgba(16, 22, 26, 0.4);
    background: #575757;
    color: #d4d4d4; }

/*
Block quotes

Markup:
<blockquote class="@ns-blockquote">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt
  ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
  ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
  reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
</blockquote>

Styleguide blockquote
*/
.reui-running-text blockquote, .reui-blockquote {
  margin: 0 0 10px;
  border-left: solid 4px rgba(194, 194, 194, 0.5);
  padding: 0 20px; }
  .reui-dark .reui-running-text blockquote, .reui-running-text .reui-dark blockquote, .reui-dark .reui-blockquote {
    border-color: rgba(148, 148, 148, 0.5); }

/*
Lists

Markup:
<ol class="{{.modifier}}">
  <li>Item the first</li>
  <li>Item the second</li>
  <li>
    Item the third
    <ul class="{{.modifier}}">
      <li>Item the fourth</li>
      <li>Item the fifth</li>
    </ul>
  </li>
</ol>

.reui-list - Add a little spacing between items for readability.
.reui-list-unstyled - Remove all list styling (including indicators) so you can add your own.

Styleguide lists
*/
.reui-running-text ul,
.reui-running-text ol, .reui-list {
  margin: 10px 0;
  padding-left: 30px; }
  .reui-running-text ul li:not(:last-child), .reui-running-text ol li:not(:last-child), .reui-list li:not(:last-child) {
    margin-bottom: 5px; }
  .reui-running-text ul ol, .reui-running-text ol ol, .reui-list ol,
  .reui-running-text ul ul,
  .reui-running-text ol ul,
  .reui-list ul {
    margin-top: 5px; }

.reui-list-unstyled {
  margin: 0;
  padding: 0;
  list-style: none; }
  .reui-list-unstyled li {
    padding: 0; }

/*
Right-to-left text

Markup:
<h5 class="@ns-heading">Arabic:</h5>
<p class="@ns-rtl">
  لكل لأداء بمحاولة من. مدينة الواقعة يبق أي, وإعلان وقوعها، حول كل, حدى عجّل مشروط الخاسرة قد.
  من الذود تكبّد بين, و لها واحدة الأراضي. عل الصفحة والروسية يتم, أي للحكومة استعملت شيء. أم وصل زهاء اليا
</p>
<h5 class="@ns-heading">Hebrew:</h5>
<p class="@ns-rtl">
  כדי על עזרה יידיש הבהרה, מלא באגים טכניים דת. תנך או ברית ביולי. כתב בה הטבע למנוע, דת כלים פיסיקה החופשית זכר.
  מתן החלל מאמרשיחהצפה ב. הספרות אנציקלופדיה אם זכר, על שימושי שימושיים תאולוגיה עזה
</p>

Styleguide rtl
*/
.reui-rtl {
  text-align: right; }

.reui-dark {
  color: #fafafa; }

:focus {
  outline: rgba(19, 124, 189, 0.6) auto 2px;
  outline-offset: 2px;
  -moz-outline-radius: 6px; }

.reui-focus-disabled :focus {
  outline: none !important; }
  .reui-focus-disabled :focus ~ .reui-control-indicator {
    outline: none !important; }

.reui-alert {
  max-width: 400px;
  padding: 20px; }

.reui-alert-body {
  display: flex; }
  .reui-alert-body .reui-icon {
    margin-top: 0;
    margin-right: 20px;
    font-size: 40px; }

.reui-alert-footer {
  display: flex;
  flex-direction: row-reverse;
  margin-top: 10px; }
  .reui-alert-footer .reui-button {
    margin-left: 10px; }

/*
Breadcrumbs

Markup:
<ul class="reui-breadcrumbs">
  <li><a class="reui-breadcrumbs-collapsed" href="#"></a></li>
  <li><a class="reui-breadcrumb reui-disabled">Folder one</a></li>
  <li><a class="reui-breadcrumb" href="#">Folder two</a></li>
  <li><a class="reui-breadcrumb" href="#">Folder three</a></li>
  <li><span class="reui-breadcrumb reui-breadcrumb-current">File</span></li>
</ul>

Styleguide breadcrumbs
*/
.reui-breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 0;
  cursor: default;
  height: 30px;
  padding: 0;
  list-style: none; }
  .reui-breadcrumbs > li {
    display: flex;
    align-items: center; }
    .reui-breadcrumbs > li::after {
      display: block;
      margin: 0 5px;
      background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.71 7.29l-4-4a1.003 1.003 0 0 0-1.42 1.42L8.59 8 5.3 11.29c-.19.18-.3.43-.3.71a1.003 1.003 0 0 0 1.71.71l4-4c.18-.18.29-.43.29-.71 0-.28-.11-.53-.29-.71z' fill='rgba(128%2c128%2c128%2c1)'/%3e%3c/svg%3e");
      width: 16px;
      height: 16px;
      content: ""; }
    .reui-breadcrumbs > li:last-of-type::after {
      display: none; }

.reui-breadcrumb,
.reui-breadcrumb-current,
.reui-breadcrumbs-collapsed {
  display: inline-block;
  font-size: 16px; }

.reui-breadcrumb,
.reui-breadcrumbs-collapsed {
  color: #808080; }

.reui-breadcrumb:hover {
  text-decoration: none; }

.reui-breadcrumb.reui-disabled {
  cursor: not-allowed;
  color: rgba(128, 128, 128, 0.5); }

.reui-breadcrumb-current {
  color: inherit;
  font-weight: 600; }
  .reui-breadcrumb-current .reui-input {
    vertical-align: baseline;
    font-size: inherit;
    font-weight: inherit; }

.reui-breadcrumbs-collapsed {
  margin-right: 2px;
  border: none;
  border-radius: 0;
  background: #dedede;
  cursor: pointer;
  padding: 1px 5px; }
  .reui-breadcrumbs-collapsed::before {
    display: block;
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cg fill='rgba(128%2c128%2c128%2c1)'%3e%3ccircle cx='2' cy='8.03' r='2'/%3e%3ccircle cx='14' cy='8.03' r='2'/%3e%3ccircle cx='8' cy='8.03' r='2'/%3e%3c/g%3e%3c/svg%3e") center no-repeat;
    width: 16px;
    height: 16px;
    content: ""; }
  .reui-breadcrumbs-collapsed:hover {
    background: #d4d4d4;
    text-decoration: none;
    color: #444; }

.reui-dark .reui-breadcrumb,
.reui-dark .reui-breadcrumbs-collapsed {
  color: #d4d4d4; }

.reui-dark .reui-breadcrumbs > li::after {
  color: #d4d4d4; }

.reui-dark .reui-breadcrumb.reui-disabled {
  color: rgba(212, 212, 212, 0.5); }

.reui-dark .reui-breadcrumb-current {
  color: #fafafa; }

.reui-dark .reui-breadcrumbs-collapsed {
  background: rgba(16, 22, 26, 0.4); }
  .reui-dark .reui-breadcrumbs-collapsed:hover {
    background: rgba(16, 22, 26, 0.6);
    color: #fafafa; }

/*
CSS `border` property issues:
- An element can only have one border.
- Borders can't stack with shadows.
- Borders modify the size of the element they're applied to.
- Border positioning requires the extra `box-sizing` property.

`box-shadow` doesn't have these issues, we're using it instead of `border`.
*/
/*
Overlay shadows are used for default buttons
floating on top of other elements. This way, the
shadows blend with the colors beneath it.
Switches and slider handles both use these variables.
*/
/*
Button

Markup:
<a role="button" class="reui-button {{.modifier}}" {{:modifier}} tabindex="0">Anchor</a>
<button type="button" class="reui-button reui-icon-add {{.modifier}}" {{:modifier}}>Button</button>

:disabled - Disabled state
.reui-active - Active appearance
.reui-disabled - Disabled appearance
.reui-intent-primary - Primary intent
.reui-intent-success - Success intent
.reui-intent-warning - Warning intent
.reui-intent-danger - Danger intent
.reui-minimal - More subtle appearance
.reui-large - Larger size
.reui-small - Smaller size
.reui-fill - Fill parent container

Styleguide button
*/
.reui-button {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 3px;
  cursor: pointer;
  padding: 5px 10px;
  vertical-align: middle;
  text-align: left;
  font-size: 13px;
  line-height: 1.55;
  min-width: 30px;
  min-height: 30px; }
  .reui-button > * {
    flex-grow: 0;
    flex-shrink: 0; }
  .reui-button > .reui-fill {
    flex-grow: 1;
    flex-shrink: 1; }
  .reui-button::before,
  .reui-button > * {
    margin-right: 7px; }
  .reui-button:empty::before,
  .reui-button > :last-child {
    margin-right: 0; }
  .reui-button:after {
    content: "d";
    visibility: hidden;
    width: 0;
    max-width: 0;
    overflow: hidden;
    order: 0; }
  .reui-button > :last-child {
    order: 1; }
  .reui-button:empty {
    padding: 0 !important; }
  .reui-button:disabled, .reui-button.reui-disabled {
    cursor: not-allowed; }
  .reui-button.reui-fill {
    display: flex;
    width: 100%; }
  .reui-button.reui-align-right,
  .reui-align-right .reui-button {
    text-align: right; }
  .reui-button:not([class*="reui-intent-"]) {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 -1px 0 rgba(16, 22, 26, 0.2);
    background-color: #ebebeb;
    color: #444; }
    .reui-button:not([class*="reui-intent-"]):hover {
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 -1px 0 rgba(16, 22, 26, 0.2);
      background-clip: padding-box;
      background-color: #f0f0f0; }
    .reui-button:not([class*="reui-intent-"]):active, .reui-button:not([class*="reui-intent-"]).reui-active {
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 1px 2px rgba(16, 22, 26, 0.2);
      background-color: #e6e6e6; }
    .reui-button:not([class*="reui-intent-"]):disabled, .reui-button:not([class*="reui-intent-"]).reui-disabled {
      outline: none;
      box-shadow: none;
      background-color: rgba(222, 222, 222, 0.5);
      cursor: not-allowed;
      color: rgba(128, 128, 128, 0.5); }
      .reui-button:not([class*="reui-intent-"]):disabled.reui-active, .reui-button:not([class*="reui-intent-"]):disabled.reui-active:hover, .reui-button:not([class*="reui-intent-"]).reui-disabled.reui-active, .reui-button:not([class*="reui-intent-"]).reui-disabled.reui-active:hover {
        background: rgba(222, 222, 222, 0.7); }
  .reui-button.reui-intent-primary {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 -1px 0 rgba(16, 22, 26, 0.3);
    background-color: #137cbd;
    color: #ffffff; }
    .reui-button.reui-intent-primary:hover, .reui-button.reui-intent-primary:active, .reui-button.reui-intent-primary.reui-active {
      color: #ffffff; }
    .reui-button.reui-intent-primary:hover {
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 -1px 0 rgba(16, 22, 26, 0.3);
      background-color: #106ba3; }
    .reui-button.reui-intent-primary:active, .reui-button.reui-intent-primary.reui-active {
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 1px 2px rgba(16, 22, 26, 0.3);
      background-color: #0e5a8a; }
    .reui-button.reui-intent-primary:disabled, .reui-button.reui-intent-primary.reui-disabled {
      border-color: transparent;
      box-shadow: none;
      background-color: rgba(19, 124, 189, 0.5);
      color: rgba(255, 255, 255, 0.6); }
  .reui-button.reui-intent-success {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 -1px 0 rgba(16, 22, 26, 0.3);
    background-color: #0f9960;
    color: #ffffff; }
    .reui-button.reui-intent-success:hover, .reui-button.reui-intent-success:active, .reui-button.reui-intent-success.reui-active {
      color: #ffffff; }
    .reui-button.reui-intent-success:hover {
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 -1px 0 rgba(16, 22, 26, 0.3);
      background-color: #0d8050; }
    .reui-button.reui-intent-success:active, .reui-button.reui-intent-success.reui-active {
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 1px 2px rgba(16, 22, 26, 0.3);
      background-color: #0a6640; }
    .reui-button.reui-intent-success:disabled, .reui-button.reui-intent-success.reui-disabled {
      border-color: transparent;
      box-shadow: none;
      background-color: rgba(15, 153, 96, 0.5);
      color: rgba(255, 255, 255, 0.6); }
  .reui-button.reui-intent-warning {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 -1px 0 rgba(16, 22, 26, 0.3);
    background-color: #d9822b;
    color: #ffffff; }
    .reui-button.reui-intent-warning:hover, .reui-button.reui-intent-warning:active, .reui-button.reui-intent-warning.reui-active {
      color: #ffffff; }
    .reui-button.reui-intent-warning:hover {
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 -1px 0 rgba(16, 22, 26, 0.3);
      background-color: #bf7326; }
    .reui-button.reui-intent-warning:active, .reui-button.reui-intent-warning.reui-active {
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 1px 2px rgba(16, 22, 26, 0.3);
      background-color: #a66321; }
    .reui-button.reui-intent-warning:disabled, .reui-button.reui-intent-warning.reui-disabled {
      border-color: transparent;
      box-shadow: none;
      background-color: rgba(217, 130, 43, 0.5);
      color: rgba(255, 255, 255, 0.6); }
  .reui-button.reui-intent-danger {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 -1px 0 rgba(16, 22, 26, 0.3);
    background-color: #db3737;
    color: #ffffff; }
    .reui-button.reui-intent-danger:hover, .reui-button.reui-intent-danger:active, .reui-button.reui-intent-danger.reui-active {
      color: #ffffff; }
    .reui-button.reui-intent-danger:hover {
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 -1px 0 rgba(16, 22, 26, 0.3);
      background-color: #c23030; }
    .reui-button.reui-intent-danger:active, .reui-button.reui-intent-danger.reui-active {
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 1px 2px rgba(16, 22, 26, 0.3);
      background-color: #a82a2a; }
    .reui-button.reui-intent-danger:disabled, .reui-button.reui-intent-danger.reui-disabled {
      border-color: transparent;
      box-shadow: none;
      background-color: rgba(219, 55, 55, 0.5);
      color: rgba(255, 255, 255, 0.6); }
  .reui-button[class*="reui-intent-"] .reui-button-spinner .reui-spinner-head {
    stroke: #ffffff; }
  .reui-button.reui-large,
  .reui-large .reui-button {
    min-width: 40px;
    min-height: 40px;
    padding: 5px 15px;
    font-size: 16px;
    line-height: 1.8; }
    .reui-button.reui-large::before,
    .reui-button.reui-large > *,
    .reui-large .reui-button::before,
    .reui-large .reui-button > * {
      margin-right: 10px; }
    .reui-button.reui-large:empty::before,
    .reui-button.reui-large > :last-child,
    .reui-large .reui-button:empty::before,
    .reui-large .reui-button > :last-child {
      margin-right: 0; }
  .reui-button.reui-small,
  .reui-small .reui-button {
    min-width: 24px;
    min-height: 24px;
    padding: 0 7px;
    line-height: 1.75; }
  .reui-button.reui-loading {
    position: relative; }
    .reui-button.reui-loading[class*="reui-icon-"]::before {
      visibility: hidden; }
    .reui-button.reui-loading .reui-button-spinner {
      position: absolute;
      top: 50%;
      left: 50%;
      margin: -10px 0 0 -10px; }
    .reui-button.reui-loading > :not(.reui-button-spinner) {
      visibility: hidden; }
  .reui-button[class*="reui-icon-"]::before {
    line-height: 1;
    font-family: "Icons16", sans-serif;
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    color: #808080; }
  .reui-button .reui-icon, .reui-button .reui-icon-standard, .reui-button .reui-icon-large {
    color: #808080; }
    .reui-button .reui-icon.reui-align-right, .reui-button .reui-icon-standard.reui-align-right, .reui-button .reui-icon-large.reui-align-right {
      margin-left: 7px; }
  .reui-button .reui-icon:first-child:last-child,
  .reui-button .reui-spinner + .reui-icon:last-child {
    margin: 0 -7px; }
  .reui-dark .reui-button:not([class*="reui-intent-"]) {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4);
    background-color: #575757;
    color: #fafafa; }
    .reui-dark .reui-button:not([class*="reui-intent-"]):hover, .reui-dark .reui-button:not([class*="reui-intent-"]):active, .reui-dark .reui-button:not([class*="reui-intent-"]).reui-active {
      color: #fafafa; }
    .reui-dark .reui-button:not([class*="reui-intent-"]):hover {
      box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4);
      background-color: #4d4d4d; }
    .reui-dark .reui-button:not([class*="reui-intent-"]):active, .reui-dark .reui-button:not([class*="reui-intent-"]).reui-active {
      box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.6), inset 0 1px 2px rgba(16, 22, 26, 0.2);
      background-color: #333333; }
    .reui-dark .reui-button:not([class*="reui-intent-"]):disabled, .reui-dark .reui-button:not([class*="reui-intent-"]).reui-disabled {
      box-shadow: none;
      background-color: rgba(87, 87, 87, 0.5);
      color: rgba(212, 212, 212, 0.5); }
      .reui-dark .reui-button:not([class*="reui-intent-"]):disabled.reui-active, .reui-dark .reui-button:not([class*="reui-intent-"]).reui-disabled.reui-active {
        background: rgba(87, 87, 87, 0.7); }
    .reui-dark .reui-button:not([class*="reui-intent-"]) .reui-button-spinner .reui-spinner-head {
      background: rgba(16, 22, 26, 0.5);
      stroke: #a6a6a6; }
    .reui-dark .reui-button:not([class*="reui-intent-"])[class*="reui-icon-"]::before {
      color: #d4d4d4; }
    .reui-dark .reui-button:not([class*="reui-intent-"]) .reui-icon, .reui-dark .reui-button:not([class*="reui-intent-"]) .reui-icon-standard, .reui-dark .reui-button:not([class*="reui-intent-"]) .reui-icon-large {
      color: #d4d4d4; }
  .reui-dark .reui-button[class*="reui-intent-"] {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4); }
    .reui-dark .reui-button[class*="reui-intent-"]:hover {
      box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4); }
    .reui-dark .reui-button[class*="reui-intent-"]:active, .reui-dark .reui-button[class*="reui-intent-"].reui-active {
      box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4), inset 0 1px 2px rgba(16, 22, 26, 0.2); }
    .reui-dark .reui-button[class*="reui-intent-"]:disabled, .reui-dark .reui-button[class*="reui-intent-"].reui-disabled {
      box-shadow: none;
      color: rgba(255, 255, 255, 0.3); }
    .reui-dark .reui-button[class*="reui-intent-"] .reui-button-spinner .reui-spinner-head {
      stroke: #a6a6a6; }
  .reui-button:disabled::before,
  .reui-button:disabled .reui-icon, .reui-button:disabled .reui-icon-standard, .reui-button:disabled .reui-icon-large, .reui-button.reui-disabled::before,
  .reui-button.reui-disabled .reui-icon, .reui-button.reui-disabled .reui-icon-standard, .reui-button.reui-disabled .reui-icon-large, .reui-button[class*="reui-intent-"]::before,
  .reui-button[class*="reui-intent-"] .reui-icon, .reui-button[class*="reui-intent-"] .reui-icon-standard, .reui-button[class*="reui-intent-"] .reui-icon-large {
    color: inherit !important; }
  .reui-button.reui-minimal {
    box-shadow: none;
    background: none; }
    .reui-button.reui-minimal:hover {
      box-shadow: none;
      background: rgba(194, 194, 194, 0.3);
      text-decoration: none;
      color: #444; }
    .reui-button.reui-minimal:active, .reui-button.reui-minimal.reui-active {
      box-shadow: none;
      background: rgba(148, 148, 148, 0.3);
      color: #444; }
    .reui-button.reui-minimal:disabled, .reui-button.reui-minimal:disabled:hover, .reui-button.reui-minimal.reui-disabled, .reui-button.reui-minimal.reui-disabled:hover {
      background: none;
      cursor: not-allowed;
      color: rgba(128, 128, 128, 0.5); }
      .reui-button.reui-minimal:disabled.reui-active, .reui-button.reui-minimal:disabled:hover.reui-active, .reui-button.reui-minimal.reui-disabled.reui-active, .reui-button.reui-minimal.reui-disabled:hover.reui-active {
        background: rgba(148, 148, 148, 0.3); }
    .reui-dark .reui-button.reui-minimal {
      box-shadow: none;
      background: none;
      color: inherit; }
      .reui-dark .reui-button.reui-minimal:hover, .reui-dark .reui-button.reui-minimal:active, .reui-dark .reui-button.reui-minimal.reui-active {
        box-shadow: none;
        background: none; }
      .reui-dark .reui-button.reui-minimal:hover {
        background: rgba(166, 166, 166, 0.15); }
      .reui-dark .reui-button.reui-minimal:active, .reui-dark .reui-button.reui-minimal.reui-active {
        background: rgba(166, 166, 166, 0.3);
        color: #fafafa; }
      .reui-dark .reui-button.reui-minimal:disabled, .reui-dark .reui-button.reui-minimal:disabled:hover, .reui-dark .reui-button.reui-minimal.reui-disabled, .reui-dark .reui-button.reui-minimal.reui-disabled:hover {
        background: none;
        cursor: not-allowed;
        color: rgba(212, 212, 212, 0.5); }
        .reui-dark .reui-button.reui-minimal:disabled.reui-active, .reui-dark .reui-button.reui-minimal:disabled:hover.reui-active, .reui-dark .reui-button.reui-minimal.reui-disabled.reui-active, .reui-dark .reui-button.reui-minimal.reui-disabled:hover.reui-active {
          background: rgba(166, 166, 166, 0.3); }
    .reui-button.reui-minimal.reui-intent-primary {
      color: #106ba3; }
      .reui-button.reui-minimal.reui-intent-primary:hover, .reui-button.reui-minimal.reui-intent-primary:active, .reui-button.reui-minimal.reui-intent-primary.reui-active {
        box-shadow: none;
        background: none;
        color: #106ba3; }
      .reui-button.reui-minimal.reui-intent-primary:hover {
        background: rgba(19, 124, 189, 0.15);
        color: #106ba3; }
      .reui-button.reui-minimal.reui-intent-primary:active, .reui-button.reui-minimal.reui-intent-primary.reui-active {
        background: rgba(19, 124, 189, 0.3);
        color: #106ba3; }
      .reui-button.reui-minimal.reui-intent-primary:disabled, .reui-button.reui-minimal.reui-intent-primary.reui-disabled {
        background: none;
        color: rgba(16, 107, 163, 0.5); }
        .reui-button.reui-minimal.reui-intent-primary:disabled.reui-active, .reui-button.reui-minimal.reui-intent-primary.reui-disabled.reui-active {
          background: rgba(19, 124, 189, 0.3); }
      .reui-button.reui-minimal.reui-intent-primary .reui-button-spinner .reui-spinner-head {
        stroke: #106ba3; }
      .reui-dark .reui-button.reui-minimal.reui-intent-primary {
        color: #48aff0; }
        .reui-dark .reui-button.reui-minimal.reui-intent-primary:hover {
          background: rgba(19, 124, 189, 0.2);
          color: #48aff0; }
        .reui-dark .reui-button.reui-minimal.reui-intent-primary:active, .reui-dark .reui-button.reui-minimal.reui-intent-primary.reui-active {
          background: rgba(19, 124, 189, 0.3);
          color: #48aff0; }
        .reui-dark .reui-button.reui-minimal.reui-intent-primary:disabled, .reui-dark .reui-button.reui-minimal.reui-intent-primary.reui-disabled {
          background: none;
          color: rgba(72, 175, 240, 0.5); }
          .reui-dark .reui-button.reui-minimal.reui-intent-primary:disabled.reui-active, .reui-dark .reui-button.reui-minimal.reui-intent-primary.reui-disabled.reui-active {
            background: rgba(19, 124, 189, 0.3); }
    .reui-button.reui-minimal.reui-intent-success {
      color: #0d8050; }
      .reui-button.reui-minimal.reui-intent-success:hover, .reui-button.reui-minimal.reui-intent-success:active, .reui-button.reui-minimal.reui-intent-success.reui-active {
        box-shadow: none;
        background: none;
        color: #0d8050; }
      .reui-button.reui-minimal.reui-intent-success:hover {
        background: rgba(15, 153, 96, 0.15);
        color: #0d8050; }
      .reui-button.reui-minimal.reui-intent-success:active, .reui-button.reui-minimal.reui-intent-success.reui-active {
        background: rgba(15, 153, 96, 0.3);
        color: #0d8050; }
      .reui-button.reui-minimal.reui-intent-success:disabled, .reui-button.reui-minimal.reui-intent-success.reui-disabled {
        background: none;
        color: rgba(13, 128, 80, 0.5); }
        .reui-button.reui-minimal.reui-intent-success:disabled.reui-active, .reui-button.reui-minimal.reui-intent-success.reui-disabled.reui-active {
          background: rgba(15, 153, 96, 0.3); }
      .reui-button.reui-minimal.reui-intent-success .reui-button-spinner .reui-spinner-head {
        stroke: #0d8050; }
      .reui-dark .reui-button.reui-minimal.reui-intent-success {
        color: #3dcc91; }
        .reui-dark .reui-button.reui-minimal.reui-intent-success:hover {
          background: rgba(15, 153, 96, 0.2);
          color: #3dcc91; }
        .reui-dark .reui-button.reui-minimal.reui-intent-success:active, .reui-dark .reui-button.reui-minimal.reui-intent-success.reui-active {
          background: rgba(15, 153, 96, 0.3);
          color: #3dcc91; }
        .reui-dark .reui-button.reui-minimal.reui-intent-success:disabled, .reui-dark .reui-button.reui-minimal.reui-intent-success.reui-disabled {
          background: none;
          color: rgba(61, 204, 145, 0.5); }
          .reui-dark .reui-button.reui-minimal.reui-intent-success:disabled.reui-active, .reui-dark .reui-button.reui-minimal.reui-intent-success.reui-disabled.reui-active {
            background: rgba(15, 153, 96, 0.3); }
    .reui-button.reui-minimal.reui-intent-warning {
      color: #bf7326; }
      .reui-button.reui-minimal.reui-intent-warning:hover, .reui-button.reui-minimal.reui-intent-warning:active, .reui-button.reui-minimal.reui-intent-warning.reui-active {
        box-shadow: none;
        background: none;
        color: #bf7326; }
      .reui-button.reui-minimal.reui-intent-warning:hover {
        background: rgba(217, 130, 43, 0.15);
        color: #bf7326; }
      .reui-button.reui-minimal.reui-intent-warning:active, .reui-button.reui-minimal.reui-intent-warning.reui-active {
        background: rgba(217, 130, 43, 0.3);
        color: #bf7326; }
      .reui-button.reui-minimal.reui-intent-warning:disabled, .reui-button.reui-minimal.reui-intent-warning.reui-disabled {
        background: none;
        color: rgba(191, 115, 38, 0.5); }
        .reui-button.reui-minimal.reui-intent-warning:disabled.reui-active, .reui-button.reui-minimal.reui-intent-warning.reui-disabled.reui-active {
          background: rgba(217, 130, 43, 0.3); }
      .reui-button.reui-minimal.reui-intent-warning .reui-button-spinner .reui-spinner-head {
        stroke: #bf7326; }
      .reui-dark .reui-button.reui-minimal.reui-intent-warning {
        color: #ffb366; }
        .reui-dark .reui-button.reui-minimal.reui-intent-warning:hover {
          background: rgba(217, 130, 43, 0.2);
          color: #ffb366; }
        .reui-dark .reui-button.reui-minimal.reui-intent-warning:active, .reui-dark .reui-button.reui-minimal.reui-intent-warning.reui-active {
          background: rgba(217, 130, 43, 0.3);
          color: #ffb366; }
        .reui-dark .reui-button.reui-minimal.reui-intent-warning:disabled, .reui-dark .reui-button.reui-minimal.reui-intent-warning.reui-disabled {
          background: none;
          color: rgba(255, 179, 102, 0.5); }
          .reui-dark .reui-button.reui-minimal.reui-intent-warning:disabled.reui-active, .reui-dark .reui-button.reui-minimal.reui-intent-warning.reui-disabled.reui-active {
            background: rgba(217, 130, 43, 0.3); }
    .reui-button.reui-minimal.reui-intent-danger {
      color: #c23030; }
      .reui-button.reui-minimal.reui-intent-danger:hover, .reui-button.reui-minimal.reui-intent-danger:active, .reui-button.reui-minimal.reui-intent-danger.reui-active {
        box-shadow: none;
        background: none;
        color: #c23030; }
      .reui-button.reui-minimal.reui-intent-danger:hover {
        background: rgba(219, 55, 55, 0.15);
        color: #c23030; }
      .reui-button.reui-minimal.reui-intent-danger:active, .reui-button.reui-minimal.reui-intent-danger.reui-active {
        background: rgba(219, 55, 55, 0.3);
        color: #c23030; }
      .reui-button.reui-minimal.reui-intent-danger:disabled, .reui-button.reui-minimal.reui-intent-danger.reui-disabled {
        background: none;
        color: rgba(194, 48, 48, 0.5); }
        .reui-button.reui-minimal.reui-intent-danger:disabled.reui-active, .reui-button.reui-minimal.reui-intent-danger.reui-disabled.reui-active {
          background: rgba(219, 55, 55, 0.3); }
      .reui-button.reui-minimal.reui-intent-danger .reui-button-spinner .reui-spinner-head {
        stroke: #c23030; }
      .reui-dark .reui-button.reui-minimal.reui-intent-danger {
        color: #ff7373; }
        .reui-dark .reui-button.reui-minimal.reui-intent-danger:hover {
          background: rgba(219, 55, 55, 0.2);
          color: #ff7373; }
        .reui-dark .reui-button.reui-minimal.reui-intent-danger:active, .reui-dark .reui-button.reui-minimal.reui-intent-danger.reui-active {
          background: rgba(219, 55, 55, 0.3);
          color: #ff7373; }
        .reui-dark .reui-button.reui-minimal.reui-intent-danger:disabled, .reui-dark .reui-button.reui-minimal.reui-intent-danger.reui-disabled {
          background: none;
          color: rgba(255, 115, 115, 0.5); }
          .reui-dark .reui-button.reui-minimal.reui-intent-danger:disabled.reui-active, .reui-dark .reui-button.reui-minimal.reui-intent-danger.reui-disabled.reui-active {
            background: rgba(219, 55, 55, 0.3); }

a.reui-button {
  text-align: center;
  text-decoration: none;
  transition: none; }
  a.reui-button, a.reui-button:hover, a.reui-button:active {
    color: #444; }
  a.reui-button.reui-disabled {
    color: rgba(128, 128, 128, 0.5); }

.reui-button-text {
  flex: 0 1 auto; }

.reui-button.reui-align-left .reui-button-text, .reui-button.reui-align-right .reui-button-text,
.reui-button-group.reui-align-left .reui-button-text,
.reui-button-group.reui-align-right .reui-button-text {
  flex: 1 1 auto; }

/*
CSS `border` property issues:
- An element can only have one border.
- Borders can't stack with shadows.
- Borders modify the size of the element they're applied to.
- Border positioning requires the extra `box-sizing` property.

`box-shadow` doesn't have these issues, we're using it instead of `border`.
*/
/*
Overlay shadows are used for default buttons
floating on top of other elements. This way, the
shadows blend with the colors beneath it.
Switches and slider handles both use these variables.
*/
/*
CSS `border` property issues:
- An element can only have one border.
- Borders can't stack with shadows.
- Borders modify the size of the element they're applied to.
- Border positioning requires the extra `box-sizing` property.

`box-shadow` doesn't have these issues, we're using it instead of `border`.
*/
/*
Overlay shadows are used for default buttons
floating on top of other elements. This way, the
shadows blend with the colors beneath it.
Switches and slider handles both use these variables.
*/
/*
Button groups

Markup:
<div class="reui-button-group {{.modifier}}">
  <button type="button" class="reui-button reui-intent-success">Save</button>
  <button type="button" class="reui-button reui-intent-success reui-icon-caret-down"></button>
</div>
<div class="reui-button-group {{.modifier}}">
  <a class="reui-button reui-icon-database" tabindex="0" role="button">Queries</a>
  <a class="reui-button reui-icon-function" tabindex="0" role="button">Functions</a>
  <a class="reui-button" tabindex="0" role="button">
    Options <span class="reui-icon-standard reui-icon-caret-down reui-align-right"></span>
  </a>
</div>
<div class="reui-button-group {{.modifier}}">
  <a class="reui-button reui-icon-chart" tabindex="0" role="button"></a>
  <a class="reui-button reui-icon-control" tabindex="0" role="button"></a>
  <a class="reui-button reui-icon-graph" tabindex="0" role="button"></a>
  <a class="reui-button reui-icon-camera" tabindex="0" role="button"></a>
  <a class="reui-button reui-icon-map" tabindex="0" role="button"></a>
  <a class="reui-button reui-icon-code" tabindex="0" role="button"></a>
  <a class="reui-button reui-icon-th" tabindex="0" role="button"></a>
  <a class="reui-button reui-icon-time" tabindex="0" role="button"></a>
  <a class="reui-button reui-icon-compressed" tabindex="0" role="button"></a>
</div>

.reui-fill - Buttons expand equally to fill container
.reui-large - Use large buttons
.reui-minimal - Use minimal buttons
.reui-vertical - Vertical layout

Styleguide button-group
*/
.reui-button-group {
  display: inline-flex;
  /*
  Responsive

  Markup:
  <div class="reui-button-group reui-large reui-fill">
    <a class="reui-button reui-intent-primary reui-fixed" tabindex="0" role="button">Start</a>
    <a class="reui-button reui-intent-primary" tabindex="0" role="button">Left</a>
    <a class="reui-button reui-intent-primary reui-active" tabindex="0" role="button">Middle</a>
    <a class="reui-button reui-intent-primary" tabindex="0" role="button">Right</a>
    <a class="reui-button reui-intent-primary reui-fixed" tabindex="0" role="button">End</a>
  </div>
  <br />
  <div class="reui-button-group reui-fill">
    <button class="reui-button reui-icon-arrow-left"></button>
    <button class="reui-button reui-fill">Middle</button>
    <button class="reui-button reui-icon-arrow-right"></button>
  </div>

  Styleguide button-group}-fill
  */
  /*
  Vertical button groups

  Markup:
  <div class="reui-button-group reui-vertical">
    <a class="reui-button reui-icon-search-template" role="button" tabindex="0"></a>
    <a class="reui-button reui-icon-zoom-in" role="button" tabindex="0"></a>
    <a class="reui-button reui-icon-zoom-out" role="button" tabindex="0"></a>
    <a class="reui-button reui-icon-zoom-to-fit" role="button" tabindex="0"></a>
  </div>
  <div class="reui-button-group reui-vertical">
    <button type="button" class="reui-button reui-active">Home</button>
    <button type="button" class="reui-button">Pages</button>
    <button type="button" class="reui-button">Blog</button>
    <button type="button" class="reui-button">Calendar</button>
  </div>
  <div class="reui-button-group reui-vertical reui-align-left reui-large">
    <button type="button" class="reui-button reui-intent-primary reui-icon-document">Text</button>
    <button type="button" class="reui-button reui-intent-primary reui-icon-media reui-active">Media</button>
    <button type="button" class="reui-button reui-intent-primary reui-icon-link">Sources</button>
  </div>

  Styleguide button-group-vertical
  */ }
  .reui-button-group .reui-button {
    flex: 0 0 auto;
    position: relative;
    z-index: 4; }
    .reui-button-group .reui-button:focus {
      z-index: 5; }
    .reui-button-group .reui-button:hover {
      z-index: 6; }
    .reui-button-group .reui-button:active, .reui-button-group .reui-button.reui-active {
      z-index: 7; }
    .reui-button-group .reui-button:disabled, .reui-button-group .reui-button.reui-disabled {
      z-index: 3; }
    .reui-button-group .reui-button[class*="reui-intent-"] {
      z-index: 9; }
      .reui-button-group .reui-button[class*="reui-intent-"]:focus {
        z-index: 10; }
      .reui-button-group .reui-button[class*="reui-intent-"]:hover {
        z-index: 11; }
      .reui-button-group .reui-button[class*="reui-intent-"]:active, .reui-button-group .reui-button[class*="reui-intent-"].reui-active {
        z-index: 12; }
      .reui-button-group .reui-button[class*="reui-intent-"]:disabled, .reui-button-group .reui-button[class*="reui-intent-"].reui-disabled {
        z-index: 8; }
  .reui-button-group:not(.reui-minimal) > .reui-popover-wrapper:not(:first-child) .reui-button,
  .reui-button-group:not(.reui-minimal) > .reui-button:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0; }
  .reui-button-group:not(.reui-minimal) > .reui-popover-wrapper:not(:last-child) .reui-button,
  .reui-button-group:not(.reui-minimal) > .reui-button:not(:last-child) {
    margin-right: -1px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0; }
  .reui-button-group.reui-minimal .reui-button {
    box-shadow: none;
    background: none; }
    .reui-button-group.reui-minimal .reui-button:hover {
      box-shadow: none;
      background: rgba(194, 194, 194, 0.3);
      text-decoration: none;
      color: #444; }
    .reui-button-group.reui-minimal .reui-button:active, .reui-button-group.reui-minimal .reui-button.reui-active {
      box-shadow: none;
      background: rgba(148, 148, 148, 0.3);
      color: #444; }
    .reui-button-group.reui-minimal .reui-button:disabled, .reui-button-group.reui-minimal .reui-button:disabled:hover, .reui-button-group.reui-minimal .reui-button.reui-disabled, .reui-button-group.reui-minimal .reui-button.reui-disabled:hover {
      background: none;
      cursor: not-allowed;
      color: rgba(128, 128, 128, 0.5); }
      .reui-button-group.reui-minimal .reui-button:disabled.reui-active, .reui-button-group.reui-minimal .reui-button:disabled:hover.reui-active, .reui-button-group.reui-minimal .reui-button.reui-disabled.reui-active, .reui-button-group.reui-minimal .reui-button.reui-disabled:hover.reui-active {
        background: rgba(148, 148, 148, 0.3); }
    .reui-dark .reui-button-group.reui-minimal .reui-button {
      box-shadow: none;
      background: none;
      color: inherit; }
      .reui-dark .reui-button-group.reui-minimal .reui-button:hover, .reui-dark .reui-button-group.reui-minimal .reui-button:active, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-active {
        box-shadow: none;
        background: none; }
      .reui-dark .reui-button-group.reui-minimal .reui-button:hover {
        background: rgba(166, 166, 166, 0.15); }
      .reui-dark .reui-button-group.reui-minimal .reui-button:active, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-active {
        background: rgba(166, 166, 166, 0.3);
        color: #fafafa; }
      .reui-dark .reui-button-group.reui-minimal .reui-button:disabled, .reui-dark .reui-button-group.reui-minimal .reui-button:disabled:hover, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-disabled, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-disabled:hover {
        background: none;
        cursor: not-allowed;
        color: rgba(212, 212, 212, 0.5); }
        .reui-dark .reui-button-group.reui-minimal .reui-button:disabled.reui-active, .reui-dark .reui-button-group.reui-minimal .reui-button:disabled:hover.reui-active, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-disabled.reui-active, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-disabled:hover.reui-active {
          background: rgba(166, 166, 166, 0.3); }
    .reui-button-group.reui-minimal .reui-button.reui-intent-primary {
      color: #106ba3; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-primary:hover, .reui-button-group.reui-minimal .reui-button.reui-intent-primary:active, .reui-button-group.reui-minimal .reui-button.reui-intent-primary.reui-active {
        box-shadow: none;
        background: none;
        color: #106ba3; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-primary:hover {
        background: rgba(19, 124, 189, 0.15);
        color: #106ba3; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-primary:active, .reui-button-group.reui-minimal .reui-button.reui-intent-primary.reui-active {
        background: rgba(19, 124, 189, 0.3);
        color: #106ba3; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-primary:disabled, .reui-button-group.reui-minimal .reui-button.reui-intent-primary.reui-disabled {
        background: none;
        color: rgba(16, 107, 163, 0.5); }
        .reui-button-group.reui-minimal .reui-button.reui-intent-primary:disabled.reui-active, .reui-button-group.reui-minimal .reui-button.reui-intent-primary.reui-disabled.reui-active {
          background: rgba(19, 124, 189, 0.3); }
      .reui-button-group.reui-minimal .reui-button.reui-intent-primary .reui-button-spinner .reui-spinner-head {
        stroke: #106ba3; }
      .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-primary {
        color: #48aff0; }
        .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-primary:hover {
          background: rgba(19, 124, 189, 0.2);
          color: #48aff0; }
        .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-primary:active, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-primary.reui-active {
          background: rgba(19, 124, 189, 0.3);
          color: #48aff0; }
        .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-primary:disabled, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-primary.reui-disabled {
          background: none;
          color: rgba(72, 175, 240, 0.5); }
          .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-primary:disabled.reui-active, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-primary.reui-disabled.reui-active {
            background: rgba(19, 124, 189, 0.3); }
    .reui-button-group.reui-minimal .reui-button.reui-intent-success {
      color: #0d8050; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-success:hover, .reui-button-group.reui-minimal .reui-button.reui-intent-success:active, .reui-button-group.reui-minimal .reui-button.reui-intent-success.reui-active {
        box-shadow: none;
        background: none;
        color: #0d8050; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-success:hover {
        background: rgba(15, 153, 96, 0.15);
        color: #0d8050; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-success:active, .reui-button-group.reui-minimal .reui-button.reui-intent-success.reui-active {
        background: rgba(15, 153, 96, 0.3);
        color: #0d8050; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-success:disabled, .reui-button-group.reui-minimal .reui-button.reui-intent-success.reui-disabled {
        background: none;
        color: rgba(13, 128, 80, 0.5); }
        .reui-button-group.reui-minimal .reui-button.reui-intent-success:disabled.reui-active, .reui-button-group.reui-minimal .reui-button.reui-intent-success.reui-disabled.reui-active {
          background: rgba(15, 153, 96, 0.3); }
      .reui-button-group.reui-minimal .reui-button.reui-intent-success .reui-button-spinner .reui-spinner-head {
        stroke: #0d8050; }
      .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-success {
        color: #3dcc91; }
        .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-success:hover {
          background: rgba(15, 153, 96, 0.2);
          color: #3dcc91; }
        .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-success:active, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-success.reui-active {
          background: rgba(15, 153, 96, 0.3);
          color: #3dcc91; }
        .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-success:disabled, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-success.reui-disabled {
          background: none;
          color: rgba(61, 204, 145, 0.5); }
          .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-success:disabled.reui-active, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-success.reui-disabled.reui-active {
            background: rgba(15, 153, 96, 0.3); }
    .reui-button-group.reui-minimal .reui-button.reui-intent-warning {
      color: #bf7326; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-warning:hover, .reui-button-group.reui-minimal .reui-button.reui-intent-warning:active, .reui-button-group.reui-minimal .reui-button.reui-intent-warning.reui-active {
        box-shadow: none;
        background: none;
        color: #bf7326; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-warning:hover {
        background: rgba(217, 130, 43, 0.15);
        color: #bf7326; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-warning:active, .reui-button-group.reui-minimal .reui-button.reui-intent-warning.reui-active {
        background: rgba(217, 130, 43, 0.3);
        color: #bf7326; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-warning:disabled, .reui-button-group.reui-minimal .reui-button.reui-intent-warning.reui-disabled {
        background: none;
        color: rgba(191, 115, 38, 0.5); }
        .reui-button-group.reui-minimal .reui-button.reui-intent-warning:disabled.reui-active, .reui-button-group.reui-minimal .reui-button.reui-intent-warning.reui-disabled.reui-active {
          background: rgba(217, 130, 43, 0.3); }
      .reui-button-group.reui-minimal .reui-button.reui-intent-warning .reui-button-spinner .reui-spinner-head {
        stroke: #bf7326; }
      .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-warning {
        color: #ffb366; }
        .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-warning:hover {
          background: rgba(217, 130, 43, 0.2);
          color: #ffb366; }
        .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-warning:active, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-warning.reui-active {
          background: rgba(217, 130, 43, 0.3);
          color: #ffb366; }
        .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-warning:disabled, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-warning.reui-disabled {
          background: none;
          color: rgba(255, 179, 102, 0.5); }
          .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-warning:disabled.reui-active, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-warning.reui-disabled.reui-active {
            background: rgba(217, 130, 43, 0.3); }
    .reui-button-group.reui-minimal .reui-button.reui-intent-danger {
      color: #c23030; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-danger:hover, .reui-button-group.reui-minimal .reui-button.reui-intent-danger:active, .reui-button-group.reui-minimal .reui-button.reui-intent-danger.reui-active {
        box-shadow: none;
        background: none;
        color: #c23030; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-danger:hover {
        background: rgba(219, 55, 55, 0.15);
        color: #c23030; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-danger:active, .reui-button-group.reui-minimal .reui-button.reui-intent-danger.reui-active {
        background: rgba(219, 55, 55, 0.3);
        color: #c23030; }
      .reui-button-group.reui-minimal .reui-button.reui-intent-danger:disabled, .reui-button-group.reui-minimal .reui-button.reui-intent-danger.reui-disabled {
        background: none;
        color: rgba(194, 48, 48, 0.5); }
        .reui-button-group.reui-minimal .reui-button.reui-intent-danger:disabled.reui-active, .reui-button-group.reui-minimal .reui-button.reui-intent-danger.reui-disabled.reui-active {
          background: rgba(219, 55, 55, 0.3); }
      .reui-button-group.reui-minimal .reui-button.reui-intent-danger .reui-button-spinner .reui-spinner-head {
        stroke: #c23030; }
      .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-danger {
        color: #ff7373; }
        .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-danger:hover {
          background: rgba(219, 55, 55, 0.2);
          color: #ff7373; }
        .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-danger:active, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-danger.reui-active {
          background: rgba(219, 55, 55, 0.3);
          color: #ff7373; }
        .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-danger:disabled, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-danger.reui-disabled {
          background: none;
          color: rgba(255, 115, 115, 0.5); }
          .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-danger:disabled.reui-active, .reui-dark .reui-button-group.reui-minimal .reui-button.reui-intent-danger.reui-disabled.reui-active {
            background: rgba(219, 55, 55, 0.3); }
  .reui-button-group.reui-fill {
    display: flex;
    width: 100%; }
  .reui-button-group .reui-button.reui-fill,
  .reui-button-group.reui-fill .reui-button:not(.reui-fixed) {
    flex: 1 1 auto; }
  .reui-button-group.reui-vertical {
    flex-direction: column;
    align-items: stretch;
    vertical-align: top; }
    .reui-button-group.reui-vertical.reui-fill {
      width: unset;
      height: 100%; }
    .reui-button-group.reui-vertical .reui-button {
      margin-right: 0 !important;
      width: 100%; }
    .reui-button-group.reui-vertical .reui-popover-target {
      display: block; }
    .reui-button-group.reui-vertical:not(.reui-minimal) > .reui-popover-wrapper:first-child .reui-button,
    .reui-button-group.reui-vertical:not(.reui-minimal) > .reui-button:first-child {
      border-radius: 3px 3px 0 0; }
    .reui-button-group.reui-vertical:not(.reui-minimal) > .reui-popover-wrapper:last-child .reui-button,
    .reui-button-group.reui-vertical:not(.reui-minimal) > .reui-button:last-child {
      border-radius: 0 0 3px 3px; }
    .reui-button-group.reui-vertical:not(.reui-minimal) > .reui-popover-wrapper:not(:last-child) .reui-button,
    .reui-button-group.reui-vertical:not(.reui-minimal) > .reui-button:not(:last-child) {
      margin-bottom: -1px; }
  .reui-button-group.reui-align-left .reui-button {
    text-align: left; }
  .reui-dark .reui-button-group:not(.reui-minimal) > .reui-popover-wrapper:not(:last-child) .reui-button,
  .reui-dark .reui-button-group:not(.reui-minimal) > .reui-button:not(:last-child) {
    margin-right: 1px; }
  .reui-dark .reui-button-group.reui-vertical > .reui-popover-wrapper:not(:last-child) .reui-button,
  .reui-dark .reui-button-group.reui-vertical > .reui-button:not(:last-child) {
    margin-bottom: 1px; }

/*
Callout

Markup:
<div class="reui-callout {{.modifier}}">
  <h4 class="reui-heading">Callout Heading</h4>
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ex, delectus!
</div>

.reui-intent-primary - Primary intent
.reui-intent-success - Success intent
.reui-intent-warning - Warning intent
.reui-intent-danger  - Danger intent
.reui-icon-info-sign - With an icon

Styleguide callout
*/
.reui-callout {
  line-height: 1.5;
  font-size: 13px;
  position: relative;
  border-radius: 0;
  background-color: #f0f0f0;
  width: 100%;
  padding: 10px 12px 9px; }
  .reui-callout[class*="reui-icon-"] {
    padding-left: 33px; }
    .reui-callout[class*="reui-icon-"]::before {
      line-height: 1;
      font-family: "Icons16", sans-serif;
      font-size: 16px;
      font-weight: 400;
      font-style: normal;
      -moz-osx-font-smoothing: grayscale;
      -webkit-font-smoothing: antialiased;
      position: absolute;
      top: 10px;
      left: 10px;
      color: #808080; }
  .reui-callout.reui-callout-icon {
    padding-left: 33px; }
    .reui-callout.reui-callout-icon > .reui-icon:first-child {
      position: absolute;
      top: 10px;
      left: 10px;
      color: #808080; }
  .reui-callout .reui-heading {
    margin-top: 0;
    margin-bottom: 5px;
    line-height: 16px; }
  .reui-dark .reui-callout {
    background-color: rgba(166, 166, 166, 0.2); }
    .reui-dark .reui-callout[class*="reui-icon-"]::before {
      color: #d4d4d4; }
  .reui-callout.reui-intent-primary {
    background-color: rgba(19, 124, 189, 0.15); }
    .reui-callout.reui-intent-primary[class*="reui-icon-"]::before,
    .reui-callout.reui-intent-primary > .reui-icon:first-child,
    .reui-callout.reui-intent-primary .reui-heading {
      color: #106ba3; }
    .reui-dark .reui-callout.reui-intent-primary {
      background-color: rgba(19, 124, 189, 0.25); }
      .reui-dark .reui-callout.reui-intent-primary[class*="reui-icon-"]::before,
      .reui-dark .reui-callout.reui-intent-primary > .reui-icon:first-child,
      .reui-dark .reui-callout.reui-intent-primary .reui-heading {
        color: #48aff0; }
  .reui-callout.reui-intent-success {
    background-color: rgba(15, 153, 96, 0.15); }
    .reui-callout.reui-intent-success[class*="reui-icon-"]::before,
    .reui-callout.reui-intent-success > .reui-icon:first-child,
    .reui-callout.reui-intent-success .reui-heading {
      color: #0d8050; }
    .reui-dark .reui-callout.reui-intent-success {
      background-color: rgba(15, 153, 96, 0.25); }
      .reui-dark .reui-callout.reui-intent-success[class*="reui-icon-"]::before,
      .reui-dark .reui-callout.reui-intent-success > .reui-icon:first-child,
      .reui-dark .reui-callout.reui-intent-success .reui-heading {
        color: #3dcc91; }
  .reui-callout.reui-intent-warning {
    background-color: rgba(217, 130, 43, 0.15); }
    .reui-callout.reui-intent-warning[class*="reui-icon-"]::before,
    .reui-callout.reui-intent-warning > .reui-icon:first-child,
    .reui-callout.reui-intent-warning .reui-heading {
      color: #bf7326; }
    .reui-dark .reui-callout.reui-intent-warning {
      background-color: rgba(217, 130, 43, 0.25); }
      .reui-dark .reui-callout.reui-intent-warning[class*="reui-icon-"]::before,
      .reui-dark .reui-callout.reui-intent-warning > .reui-icon:first-child,
      .reui-dark .reui-callout.reui-intent-warning .reui-heading {
        color: #ffb366; }
  .reui-callout.reui-intent-danger {
    background-color: rgba(219, 55, 55, 0.15); }
    .reui-callout.reui-intent-danger[class*="reui-icon-"]::before,
    .reui-callout.reui-intent-danger > .reui-icon:first-child,
    .reui-callout.reui-intent-danger .reui-heading {
      color: #c23030; }
    .reui-dark .reui-callout.reui-intent-danger {
      background-color: rgba(219, 55, 55, 0.25); }
      .reui-dark .reui-callout.reui-intent-danger[class*="reui-icon-"]::before,
      .reui-dark .reui-callout.reui-intent-danger > .reui-icon:first-child,
      .reui-dark .reui-callout.reui-intent-danger .reui-heading {
        color: #ff7373; }
  .reui-running-text .reui-callout {
    margin: 20px 0; }

/*
Cards

Markup:
<div class="reui-card {{.modifier}}">
  We build products that make people better at their most important work.
</div>

.reui-elevation-0 - Ground floor. This level provides just a gentle border shadow.
.reui-elevation-1 - First. Subtle drop shadow intended for static containers.
.reui-elevation-2 - Second. An even stronger shadow, moving on up.
.reui-elevation-3 - Third. For containers overlaying content temporarily.
.reui-elevation-4 - Fourth. The strongest shadow, usually for overlay containers on top of backdrops.
.reui-interactive - On hover, increase elevation and use pointer cursor.

Styleguide card
*/
.reui-card {
  border-radius: 0;
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.175), 0 0 0 rgba(16, 22, 26, 0), 0 0 0 rgba(16, 22, 26, 0);
  background-color: #ffffff;
  padding: 20px;
  transition: transform 200ms cubic-bezier(0.4, 1, 0.75, 0.9), box-shadow 200ms cubic-bezier(0.4, 1, 0.75, 0.9); }
  .reui-card.reui-dark,
  .reui-dark .reui-card {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4), 0 0 0 rgba(16, 22, 26, 0), 0 0 0 rgba(16, 22, 26, 0);
    background-color: #4d4d4d; }

.reui-elevation-0 {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.175), 0 0 0 rgba(16, 22, 26, 0), 0 0 0 rgba(16, 22, 26, 0); }
  .reui-elevation-0.reui-dark,
  .reui-dark .reui-elevation-0 {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4), 0 0 0 rgba(16, 22, 26, 0), 0 0 0 rgba(16, 22, 26, 0); }

.reui-elevation-1 {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 0 0 rgba(16, 22, 26, 0), 0 1px 1px rgba(16, 22, 26, 0.2); }
  .reui-elevation-1.reui-dark,
  .reui-dark .reui-elevation-1 {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 0 0 rgba(16, 22, 26, 0), 0 1px 1px rgba(16, 22, 26, 0.4); }

.reui-elevation-2 {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 1px 1px rgba(16, 22, 26, 0.2), 0 2px 6px rgba(16, 22, 26, 0.2); }
  .reui-elevation-2.reui-dark,
  .reui-dark .reui-elevation-2 {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 1px 1px rgba(16, 22, 26, 0.4), 0 2px 6px rgba(16, 22, 26, 0.4); }

.reui-elevation-3 {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 2px 4px rgba(16, 22, 26, 0.2), 0 8px 24px rgba(16, 22, 26, 0.2); }
  .reui-elevation-3.reui-dark,
  .reui-dark .reui-elevation-3 {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 2px 4px rgba(16, 22, 26, 0.4), 0 8px 24px rgba(16, 22, 26, 0.4); }

.reui-elevation-4 {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 4px 8px rgba(16, 22, 26, 0.2), 0 18px 46px 6px rgba(16, 22, 26, 0.2); }
  .reui-elevation-4.reui-dark,
  .reui-dark .reui-elevation-4 {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 4px 8px rgba(16, 22, 26, 0.4), 0 18px 46px 6px rgba(16, 22, 26, 0.4); }

.reui-card.reui-interactive:hover {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 2px 4px rgba(16, 22, 26, 0.2), 0 8px 24px rgba(16, 22, 26, 0.2);
  cursor: pointer; }
  .reui-card.reui-interactive:hover.reui-dark,
  .reui-dark .reui-card.reui-interactive:hover {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 2px 4px rgba(16, 22, 26, 0.4), 0 8px 24px rgba(16, 22, 26, 0.4); }

.reui-card.reui-interactive:active {
  opacity: 0.9;
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 0 0 rgba(16, 22, 26, 0), 0 1px 1px rgba(16, 22, 26, 0.2);
  transition-duration: 0; }
  .reui-card.reui-interactive:active.reui-dark,
  .reui-dark .reui-card.reui-interactive:active {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 0 0 rgba(16, 22, 26, 0), 0 1px 1px rgba(16, 22, 26, 0.4); }

/*
Panels

Markup:
<div class="reui-panel {{.modifier}}">
  <div class="reui-heading">Panel Heading</div>
  We build products that make people better at their most important work.
</div>

.reui-elevation-0 - Ground floor. This level provides just a gentle border shadow.
.reui-elevation-1 - First. Subtle drop shadow intended for static containers.
.reui-elevation-2 - Second. An even stronger shadow, moving on up.
.reui-elevation-3 - Third. For containers overlaying content temporarily.
.reui-elevation-4 - Fourth. The strongest shadow, usually for overlay containers on top of backdrops.
.reui-interactive - On hover, increase highlight.

Styleguide panel
*/
.reui-panel {
  border-radius: 0;
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.175), 0 0 0 rgba(16, 22, 26, 0), 0 0 0 rgba(16, 22, 26, 0);
  background-color: #ffffff;
  padding: 0;
  transition: transform 200ms cubic-bezier(0.4, 1, 0.75, 0.9), box-shadow 200ms cubic-bezier(0.4, 1, 0.75, 0.9), background-color 200ms cubic-bezier(0.4, 1, 0.75, 0.9); }
  .reui-panel > .reui-panel-header {
    background-color: #f0f0f0;
    box-shadow: 0 1px rgba(16, 22, 26, 0.175);
    transition: background-color 200ms cubic-bezier(0.4, 1, 0.75, 0.9); }
    .reui-dark .reui-panel > .reui-panel-header {
      background-color: #4d4d4d;
      box-shadow: 0 1px rgba(16, 22, 26, 0.175); }
  .reui-panel.reui-dark,
  .reui-dark .reui-panel {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4), 0 0 0 rgba(16, 22, 26, 0), 0 0 0 rgba(16, 22, 26, 0);
    background-color: #4d4d4d; }

.reui-elevation-0 {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.175), 0 0 0 rgba(16, 22, 26, 0), 0 0 0 rgba(16, 22, 26, 0); }
  .reui-elevation-0.reui-dark,
  .reui-dark .reui-elevation-0 {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4), 0 0 0 rgba(16, 22, 26, 0), 0 0 0 rgba(16, 22, 26, 0); }

.reui-elevation-1 {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 0 0 rgba(16, 22, 26, 0), 0 1px 1px rgba(16, 22, 26, 0.2); }
  .reui-elevation-1.reui-dark,
  .reui-dark .reui-elevation-1 {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 0 0 rgba(16, 22, 26, 0), 0 1px 1px rgba(16, 22, 26, 0.4); }

.reui-elevation-2 {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 1px 1px rgba(16, 22, 26, 0.2), 0 2px 6px rgba(16, 22, 26, 0.2); }
  .reui-elevation-2.reui-dark,
  .reui-dark .reui-elevation-2 {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 1px 1px rgba(16, 22, 26, 0.4), 0 2px 6px rgba(16, 22, 26, 0.4); }

.reui-elevation-3 {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 2px 4px rgba(16, 22, 26, 0.2), 0 8px 24px rgba(16, 22, 26, 0.2); }
  .reui-elevation-3.reui-dark,
  .reui-dark .reui-elevation-3 {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 2px 4px rgba(16, 22, 26, 0.4), 0 8px 24px rgba(16, 22, 26, 0.4); }

.reui-elevation-4 {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 4px 8px rgba(16, 22, 26, 0.2), 0 18px 46px 6px rgba(16, 22, 26, 0.2); }
  .reui-elevation-4.reui-dark,
  .reui-dark .reui-elevation-4 {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 4px 8px rgba(16, 22, 26, 0.4), 0 18px 46px 6px rgba(16, 22, 26, 0.4); }

.reui-panel.reui-interactive:hover {
  background-color: #f2f2f2;
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 2px 4px rgba(16, 22, 26, 0.2), 0 8px 24px rgba(16, 22, 26, 0.2); }
  .reui-panel.reui-interactive:hover > .reui-panel-header {
    background-color: #e3e3e3; }
    .reui-dark .reui-panel.reui-interactive:hover > .reui-panel-header {
      background-color: #404040; }
  .reui-panel.reui-interactive:hover.reui-dark,
  .reui-dark .reui-panel.reui-interactive:hover {
    background-color: #404040;
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 2px 4px rgba(16, 22, 26, 0.4), 0 8px 24px rgba(16, 22, 26, 0.4); }

.reui-collapse {
  height: 0;
  overflow-y: hidden;
  transition: height 200ms cubic-bezier(0.4, 1, 0.75, 0.9); }
  .reui-collapse .reui-collapse-body {
    transition: transform 200ms cubic-bezier(0.4, 1, 0.75, 0.9); }
    .reui-collapse .reui-collapse-body[aria-hidden="true"] {
      display: none; }

.reui-context-menu .reui-popover-target {
  display: block; }

.reui-context-menu-popover-target {
  position: fixed; }

.reui-divider {
  margin: 5px;
  border-right: 1px solid rgba(16, 22, 26, 0.175);
  border-bottom: 1px solid rgba(16, 22, 26, 0.175); }
  .reui-dark .reui-divider {
    border-color: rgba(16, 22, 26, 0.4); }

/*
A mixin to generate the classes for a React CSSTransition which animates any number of CSS
properties at once.

Transitioned properties are specificed as a map of property names to lists of (inital value, final
value). For enter & appear transitions, each property will transition from its initial to its final
value. For exit transitions, each property will transition in reverse, from final to initial.

**Simple example:**
`@include react-transition("popover", (opacity: 0 1), $before: "&");`
Transition named "popover" moves opacity from 0 to 1. `"&"` indicates that the
Transition classes are expected to be applied to this element, where the mixin is invoked.

**Params:**
$name: React transitionName prop
$properties: map of CSS property to (initial, final) values
$duration: transition duration
$easing: transition easing function
$delay: transition delay
$before: selector text to insert before transition name (often to select self: &)
$after: selector text to insert after transiton name (to select children)
*/
/*
A mixin to generate the classes for one phase of a React CSSTransition.
`$phase` must be `appear` or `enter` or `exit`.
If `enter` phase is given then `appear` phase will be generated at the same time.
If `exit` phase is given then property values are animated in reverse, from final to initial.

**Example:**
@include react-transition-phase(toast, enter, $enter-translate, $before: "&");
@include react-transition-phase(toast, leave, $leave-blur, $pt-transition-duration * 3, $before: "&");
*/
/*
Given map of properties to values, set each property to the value at the given index.
(remember that sass indices are 1-based).

Example: `each-prop((opacity: 0 1), 2)` will print "opacity: 1"
*/
/*
Format transition class name with all the bits.
"enter" phase will include "appear" phase in returned name.
*/
/*
Dialog

Markup:
<!-- this container element fills its parent and centers the .reui-dialog within it -->
<div class="reui-dialog-container">
  <div class="reui-dialog">
    <div class="reui-dialog-header">
      <span class="reui-icon-large reui-icon-inbox"></span>
      <h4 class="reui-heading">Dialog header</h4>
      <button aria-label="Close" class="reui-dialog-close-button reui-icon-small-cross"></button>
    </div>
    <div class="reui-dialog-body">
      This dialog hasn't been wired up with any open or close interactions.
      It's just an example of markup and styles.
    </div>
    <div class="reui-dialog-footer">
      <div class="reui-dialog-footer-actions">
        <button type="button" class="reui-button">Secondary button</button>
        <button type="submit" class="reui-button reui-intent-primary">Primary button</button>
      </div>
    </div>
  </div>
</div>

Styleguide dialog
*/
.reui-dialog-container {
  opacity: 1;
  transform: translateY(0);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 100%;
  pointer-events: none;
  user-select: none; }
  .reui-dialog-container.reui-overlay-enter > .reui-dialog, .reui-dialog-container.reui-overlay-appear > .reui-dialog {
    opacity: 0;
    transform: translateY(-20px); }
  .reui-dialog-container.reui-overlay-enter-active > .reui-dialog, .reui-dialog-container.reui-overlay-appear-active > .reui-dialog {
    opacity: 1;
    transform: translateY(0);
    transition-property: opacity, transform;
    transition-duration: 300ms;
    transition-timing-function: cubic-bezier(0.54, 1.12, 0.38, 1.11);
    transition-delay: 0; }
  .reui-dialog-container.reui-overlay-exit > .reui-dialog {
    opacity: 1;
    transform: translateY(0); }
  .reui-dialog-container.reui-overlay-exit-active > .reui-dialog {
    opacity: 0;
    transform: translateY(-20px);
    transition-property: opacity, transform;
    transition-duration: 300ms;
    transition-timing-function: cubic-bezier(0.54, 1.12, 0.38, 1.11);
    transition-delay: 0; }

.reui-dialog {
  display: flex;
  flex-direction: column;
  margin: 30px 0;
  border-radius: 0;
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 4px 8px rgba(16, 22, 26, 0.2), 0 18px 46px 6px rgba(16, 22, 26, 0.2);
  background: #ebebeb;
  width: 500px;
  padding-bottom: 20px;
  pointer-events: all;
  user-select: text; }
  .reui-dialog:focus {
    outline: 0; }
  .reui-dialog.reui-dark,
  .reui-dark .reui-dialog {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 4px 8px rgba(16, 22, 26, 0.4), 0 18px 46px 6px rgba(16, 22, 26, 0.4);
    background: #404040;
    color: #fafafa; }

.reui-dialog-header {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  border-radius: 0 0 0 0;
  box-shadow: 0 1px 0 rgba(16, 22, 26, 0.175);
  min-height: 40px;
  padding-left: 20px; }
  .reui-dialog-header .reui-icon-large,
  .reui-dialog-header .reui-icon {
    flex: 0 0 auto;
    margin-right: 10px;
    color: #808080; }
  .reui-dialog-header .reui-heading {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal;
    flex: 1 1 auto;
    margin: 0;
    line-height: inherit; }
    .reui-dialog-header .reui-heading:last-child {
      margin-right: 20px; }
  .reui-dark .reui-dialog-header {
    box-shadow: 0 1px 0 rgba(16, 22, 26, 0.4); }
    .reui-dark .reui-dialog-header .reui-icon-large,
    .reui-dark .reui-dialog-header .reui-icon {
      color: #d4d4d4; }

.reui-dialog-close-button {
  line-height: 1;
  font-family: "Icons20", sans-serif;
  font-size: 20px;
  font-weight: 400;
  font-style: normal;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  color: #808080;
  flex: 0 0 auto;
  border: none;
  background: none;
  cursor: pointer;
  padding: 10px; }
  .reui-dialog-close-button:hover {
    color: #444; }
  .reui-dark .reui-dialog-close-button {
    color: #d4d4d4; }
    .reui-dark .reui-dialog-close-button:hover {
      color: #fafafa; }
  .reui-dialog-close-button .reui-icon-large,
  .reui-dialog-close-button .reui-icon {
    margin: 0; }

.reui-dialog-body {
  flex: 1 1 auto;
  margin: 20px;
  line-height: 18px; }

.reui-dialog-footer {
  flex: 0 0 auto;
  margin: 0 20px; }

.reui-dialog-footer-actions {
  display: flex;
  justify-content: flex-end; }
  .reui-dialog-footer-actions .reui-button {
    margin-left: 10px; }

/*
CSS `border` property issues:
- An element can only have one border.
- Borders can't stack with shadows.
- Borders modify the size of the element they're applied to.
- Border positioning requires the extra `box-sizing` property.

`box-shadow` doesn't have these issues, we're using it instead of `border`.
*/
/*
Overlay shadows are used for default buttons
floating on top of other elements. This way, the
shadows blend with the colors beneath it.
Switches and slider handles both use these variables.
*/
.reui-editable-text {
  display: inline-block;
  position: relative;
  cursor: text;
  max-width: 100%;
  vertical-align: top;
  white-space: nowrap; }
  .reui-editable-text::before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 0;
    content: "";
    transition: background-color 100ms cubic-bezier(0.4, 1, 0.75, 0.9), box-shadow 100ms cubic-bezier(0.4, 1, 0.75, 0.9); }
  .reui-editable-text:hover::before {
    box-shadow: 0 0 0 0 rgba(19, 124, 189, 0), 0 0 0 0 rgba(19, 124, 189, 0), inset 0 0 0 1px rgba(16, 22, 26, 0.175); }
  .reui-editable-text.reui-editable-text-editing::before {
    box-shadow: 0 0 0 1px #137cbd, 0 0 0 3px rgba(19, 124, 189, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2);
    background-color: #ffffff; }
  .reui-editable-text.reui-disabled::before {
    box-shadow: none; }
  .reui-editable-text.reui-intent-primary .reui-editable-text-input,
  .reui-editable-text.reui-intent-primary .reui-editable-text-content {
    color: #137cbd; }
  .reui-editable-text.reui-intent-primary:hover::before {
    box-shadow: 0 0 0 0 rgba(19, 124, 189, 0), 0 0 0 0 rgba(19, 124, 189, 0), inset 0 0 0 1px rgba(19, 124, 189, 0.4); }
  .reui-editable-text.reui-intent-primary.reui-editable-text-editing::before {
    box-shadow: 0 0 0 1px #137cbd, 0 0 0 3px rgba(19, 124, 189, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2); }
  .reui-editable-text.reui-intent-success .reui-editable-text-input,
  .reui-editable-text.reui-intent-success .reui-editable-text-content {
    color: #0f9960; }
  .reui-editable-text.reui-intent-success:hover::before {
    box-shadow: 0 0 0 0 rgba(15, 153, 96, 0), 0 0 0 0 rgba(15, 153, 96, 0), inset 0 0 0 1px rgba(15, 153, 96, 0.4); }
  .reui-editable-text.reui-intent-success.reui-editable-text-editing::before {
    box-shadow: 0 0 0 1px #0f9960, 0 0 0 3px rgba(15, 153, 96, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2); }
  .reui-editable-text.reui-intent-warning .reui-editable-text-input,
  .reui-editable-text.reui-intent-warning .reui-editable-text-content {
    color: #d9822b; }
  .reui-editable-text.reui-intent-warning:hover::before {
    box-shadow: 0 0 0 0 rgba(217, 130, 43, 0), 0 0 0 0 rgba(217, 130, 43, 0), inset 0 0 0 1px rgba(217, 130, 43, 0.4); }
  .reui-editable-text.reui-intent-warning.reui-editable-text-editing::before {
    box-shadow: 0 0 0 1px #d9822b, 0 0 0 3px rgba(217, 130, 43, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2); }
  .reui-editable-text.reui-intent-danger .reui-editable-text-input,
  .reui-editable-text.reui-intent-danger .reui-editable-text-content {
    color: #db3737; }
  .reui-editable-text.reui-intent-danger:hover::before {
    box-shadow: 0 0 0 0 rgba(219, 55, 55, 0), 0 0 0 0 rgba(219, 55, 55, 0), inset 0 0 0 1px rgba(219, 55, 55, 0.4); }
  .reui-editable-text.reui-intent-danger.reui-editable-text-editing::before {
    box-shadow: 0 0 0 1px #db3737, 0 0 0 3px rgba(219, 55, 55, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2); }
  .reui-dark .reui-editable-text:hover::before {
    box-shadow: 0 0 0 0 rgba(19, 124, 189, 0), 0 0 0 0 rgba(19, 124, 189, 0), inset 0 0 0 1px rgba(255, 255, 255, 0.15); }
  .reui-dark .reui-editable-text.reui-editable-text-editing::before {
    box-shadow: 0 0 0 1px #137cbd, 0 0 0 3px rgba(19, 124, 189, 0.3), inset 0 0 0 1px rgba(16, 22, 26, 0.45);
    background-color: rgba(16, 22, 26, 0.3); }
  .reui-dark .reui-editable-text.reui-disabled::before {
    box-shadow: none; }
  .reui-dark .reui-editable-text.reui-intent-primary .reui-editable-text-content {
    color: #48aff0; }
  .reui-dark .reui-editable-text.reui-intent-primary:hover::before {
    box-shadow: 0 0 0 0 rgba(72, 175, 240, 0), 0 0 0 0 rgba(72, 175, 240, 0), inset 0 0 0 1px rgba(72, 175, 240, 0.4); }
  .reui-dark .reui-editable-text.reui-intent-primary.reui-editable-text-editing::before {
    box-shadow: 0 0 0 1px #48aff0, 0 0 0 3px rgba(72, 175, 240, 0.3), inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
  .reui-dark .reui-editable-text.reui-intent-success .reui-editable-text-content {
    color: #3dcc91; }
  .reui-dark .reui-editable-text.reui-intent-success:hover::before {
    box-shadow: 0 0 0 0 rgba(61, 204, 145, 0), 0 0 0 0 rgba(61, 204, 145, 0), inset 0 0 0 1px rgba(61, 204, 145, 0.4); }
  .reui-dark .reui-editable-text.reui-intent-success.reui-editable-text-editing::before {
    box-shadow: 0 0 0 1px #3dcc91, 0 0 0 3px rgba(61, 204, 145, 0.3), inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
  .reui-dark .reui-editable-text.reui-intent-warning .reui-editable-text-content {
    color: #ffb366; }
  .reui-dark .reui-editable-text.reui-intent-warning:hover::before {
    box-shadow: 0 0 0 0 rgba(255, 179, 102, 0), 0 0 0 0 rgba(255, 179, 102, 0), inset 0 0 0 1px rgba(255, 179, 102, 0.4); }
  .reui-dark .reui-editable-text.reui-intent-warning.reui-editable-text-editing::before {
    box-shadow: 0 0 0 1px #ffb366, 0 0 0 3px rgba(255, 179, 102, 0.3), inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
  .reui-dark .reui-editable-text.reui-intent-danger .reui-editable-text-content {
    color: #ff7373; }
  .reui-dark .reui-editable-text.reui-intent-danger:hover::before {
    box-shadow: 0 0 0 0 rgba(255, 115, 115, 0), 0 0 0 0 rgba(255, 115, 115, 0), inset 0 0 0 1px rgba(255, 115, 115, 0.4); }
  .reui-dark .reui-editable-text.reui-intent-danger.reui-editable-text-editing::before {
    box-shadow: 0 0 0 1px #ff7373, 0 0 0 3px rgba(255, 115, 115, 0.3), inset 0 0 0 1px rgba(16, 22, 26, 0.45); }

.reui-editable-text-input,
.reui-editable-text-content {
  display: inherit;
  position: relative;
  min-width: inherit;
  max-width: inherit;
  vertical-align: top;
  text-transform: inherit;
  letter-spacing: inherit;
  color: inherit;
  font: inherit;
  resize: none; }

.reui-editable-text-input {
  border: none;
  box-shadow: none;
  background: none;
  width: 100%;
  padding: 0;
  white-space: pre-wrap; }
  .reui-editable-text-input::placeholder {
    opacity: 1;
    color: rgba(128, 128, 128, 0.5); }
  .reui-editable-text-input:focus {
    outline: none; }
  .reui-editable-text-input::-ms-clear {
    display: none; }

.reui-editable-text-content {
  overflow: hidden;
  padding-right: 2px;
  text-overflow: ellipsis;
  white-space: pre; }
  .reui-editable-text-editing > .reui-editable-text-content {
    position: absolute;
    left: 0;
    visibility: hidden; }
  .reui-editable-text-placeholder > .reui-editable-text-content {
    color: rgba(128, 128, 128, 0.5); }
    .reui-dark .reui-editable-text-placeholder > .reui-editable-text-content {
      color: rgba(212, 212, 212, 0.5); }

.reui-editable-text.reui-multiline {
  display: block; }
  .reui-editable-text.reui-multiline .reui-editable-text-content {
    overflow: auto;
    white-space: pre-wrap;
    word-wrap: break-word; }

/*
CSS `border` property issues:
- An element can only have one border.
- Borders can't stack with shadows.
- Borders modify the size of the element they're applied to.
- Border positioning requires the extra `box-sizing` property.

`box-shadow` doesn't have these issues, we're using it instead of `border`.
*/
/*
Overlay shadows are used for default buttons
floating on top of other elements. This way, the
shadows blend with the colors beneath it.
Switches and slider handles both use these variables.
*/
/*
CSS `border` property issues:
- An element can only have one border.
- Borders can't stack with shadows.
- Borders modify the size of the element they're applied to.
- Border positioning requires the extra `box-sizing` property.

`box-shadow` doesn't have these issues, we're using it instead of `border`.
*/
/*
Overlay shadows are used for default buttons
floating on top of other elements. This way, the
shadows blend with the colors beneath it.
Switches and slider handles both use these variables.
*/
/*
CSS `border` property issues:
- An element can only have one border.
- Borders can't stack with shadows.
- Borders modify the size of the element they're applied to.
- Border positioning requires the extra `box-sizing` property.

`box-shadow` doesn't have these issues, we're using it instead of `border`.
*/
/*
Overlay shadows are used for default buttons
floating on top of other elements. This way, the
shadows blend with the colors beneath it.
Switches and slider handles both use these variables.
*/
/*
Control groups

Markup:
<div class="reui-control-group">
  <button class="reui-button reui-icon-filter">Filter</button>
  <input type="text" class="reui-input" placeholder="Find filters..." />
</div>
<div class="reui-control-group">
  <div class="reui-select">
    <select>
      <option selected>Filter...</option>
      <option value="1">Issues</option>
      <option value="2">Requests</option>
      <option value="3">Projects</option>
    </select>
  </div>
  <div class="reui-input-group">
    <span class="reui-icon reui-icon-search"></span>
    <input type="text" class="reui-input" value="from:ggray to:allorca" />
  </div>
</div>
<div class="reui-control-group">
  <div class="reui-input-group">
    <span class="reui-icon reui-icon-people"></span>
    <input type="text" class="reui-input" placeholder="Find collaborators..." style="padding-right:94px" />
    <div class="reui-input-action">
      <button class="reui-button reui-minimal reui-intent-primary">
        can view<span class="reui-icon-standard reui-icon-caret-down reui-align-right"></span>
      </button>
    </div>
  </div>
  <button class="reui-button reui-intent-primary">Add</button>
</div>

Styleguide control-group
*/
.reui-control-group {
  transform: translateZ(0);
  display: flex;
  flex-direction: row;
  align-items: stretch;
  /*
  Responsive control groups

  Markup:
  <div class="reui-control-group">
    <div class="reui-input-group reui-fill">
      <span class="reui-icon reui-icon-people"></span>
      <input type="text" class="reui-input" placeholder="Find collaborators..." />
    </div>
    <button class="reui-button reui-intent-primary">Add</button>
  </div>
  <div class="reui-control-group reui-fill">
    <button class="reui-button reui-icon-minus reui-fixed"></button>
    <input type="text" class="reui-input" placeholder="Enter a value..." />
    <button class="reui-button reui-icon-plus reui-fixed"></button>
  </div>

  Styleguide control-group-fill
  */
  /*
  Vertical control groups

  Markup:
  <div class="reui-control-group reui-vertical" style="width: 300px;">
    <div class="reui-input-group reui-large">
      <span class="reui-icon reui-icon-person"></span>
      <input type="text" class="reui-input" placeholder="Username" />
    </div>
    <div class="reui-input-group reui-large">
      <span class="reui-icon reui-icon-lock"></span>
      <input type="password" class="reui-input" placeholder="Password" />
    </div>
    <button class="reui-button reui-large reui-intent-primary">Login</button>
  </div>

  Styleguide control-group-vertical
  */ }
  .reui-control-group > * {
    flex-grow: 0;
    flex-shrink: 0; }
  .reui-control-group > .reui-fill {
    flex-grow: 1;
    flex-shrink: 1; }
  .reui-control-group .reui-button,
  .reui-control-group .reui-html-select,
  .reui-control-group .reui-input,
  .reui-control-group .reui-select {
    position: relative; }
  .reui-control-group .reui-input {
    z-index: 2;
    border-radius: inherit; }
    .reui-control-group .reui-input:focus {
      z-index: 14;
      border-radius: 0; }
    .reui-control-group .reui-input[class*="reui-intent"] {
      z-index: 13; }
      .reui-control-group .reui-input[class*="reui-intent"]:focus {
        z-index: 15; }
    .reui-control-group .reui-input[readonly], .reui-control-group .reui-input:disabled, .reui-control-group .reui-input.reui-disabled {
      z-index: 1; }
  .reui-control-group .reui-input-group[class*="reui-intent"] .reui-input {
    z-index: 13; }
    .reui-control-group .reui-input-group[class*="reui-intent"] .reui-input:focus {
      z-index: 15; }
  .reui-control-group .reui-button,
  .reui-control-group .reui-html-select select,
  .reui-control-group .reui-select select {
    z-index: 4;
    border-radius: inherit; }
    .reui-control-group .reui-button:focus,
    .reui-control-group .reui-html-select select:focus,
    .reui-control-group .reui-select select:focus {
      position: relative;
      z-index: 5; }
    .reui-control-group .reui-button:hover,
    .reui-control-group .reui-html-select select:hover,
    .reui-control-group .reui-select select:hover {
      z-index: 6; }
    .reui-control-group .reui-button:active,
    .reui-control-group .reui-html-select select:active,
    .reui-control-group .reui-select select:active {
      z-index: 7; }
    .reui-control-group .reui-button[readonly], .reui-control-group .reui-button:disabled, .reui-control-group .reui-button.reui-disabled,
    .reui-control-group .reui-html-select select[readonly],
    .reui-control-group .reui-html-select select:disabled,
    .reui-control-group .reui-html-select select.reui-disabled,
    .reui-control-group .reui-select select[readonly],
    .reui-control-group .reui-select select:disabled,
    .reui-control-group .reui-select select.reui-disabled {
      z-index: 3; }
    .reui-control-group .reui-button[class*="reui-intent"],
    .reui-control-group .reui-html-select select[class*="reui-intent"],
    .reui-control-group .reui-select select[class*="reui-intent"] {
      z-index: 9; }
      .reui-control-group .reui-button[class*="reui-intent"]:focus,
      .reui-control-group .reui-html-select select[class*="reui-intent"]:focus,
      .reui-control-group .reui-select select[class*="reui-intent"]:focus {
        z-index: 10; }
      .reui-control-group .reui-button[class*="reui-intent"]:hover,
      .reui-control-group .reui-html-select select[class*="reui-intent"]:hover,
      .reui-control-group .reui-select select[class*="reui-intent"]:hover {
        z-index: 11; }
      .reui-control-group .reui-button[class*="reui-intent"]:active,
      .reui-control-group .reui-html-select select[class*="reui-intent"]:active,
      .reui-control-group .reui-select select[class*="reui-intent"]:active {
        z-index: 12; }
      .reui-control-group .reui-button[class*="reui-intent"][readonly], .reui-control-group .reui-button[class*="reui-intent"]:disabled, .reui-control-group .reui-button[class*="reui-intent"].reui-disabled,
      .reui-control-group .reui-html-select select[class*="reui-intent"][readonly],
      .reui-control-group .reui-html-select select[class*="reui-intent"]:disabled,
      .reui-control-group .reui-html-select select[class*="reui-intent"].reui-disabled,
      .reui-control-group .reui-select select[class*="reui-intent"][readonly],
      .reui-control-group .reui-select select[class*="reui-intent"]:disabled,
      .reui-control-group .reui-select select[class*="reui-intent"].reui-disabled {
        z-index: 8; }
  .reui-control-group .reui-input-group > .reui-icon,
  .reui-control-group .reui-input-group > .reui-button,
  .reui-control-group .reui-input-group > .reui-input-action {
    z-index: 16; }
  .reui-control-group .reui-select::after {
    z-index: 17; }
  .reui-control-group:not(.reui-vertical) > * {
    margin-right: -1px; }
  .reui-dark .reui-control-group:not(.reui-vertical) > * {
    margin-right: 0; }
  .reui-dark .reui-control-group:not(.reui-vertical) > .reui-button + .reui-button {
    margin-left: 1px; }
  .reui-control-group .reui-popover-wrapper,
  .reui-control-group .reui-popover-target {
    border-radius: inherit; }
  .reui-control-group > :first-child {
    border-radius: 0 0 0 0; }
  .reui-control-group > :last-child {
    margin-right: 0;
    border-radius: 0 0 0 0; }
  .reui-control-group > :only-child {
    margin-right: 0;
    border-radius: 0; }
  .reui-control-group .reui-input-group .reui-button {
    border-radius: 0; }
  .reui-control-group > .reui-fill {
    flex: 1 1 auto; }
  .reui-control-group.reui-fill > *:not(.reui-fixed) {
    flex: 1 1 auto; }
  .reui-control-group.reui-vertical {
    flex-direction: column; }
    .reui-control-group.reui-vertical > * {
      margin-top: -1px; }
    .reui-control-group.reui-vertical > :first-child {
      margin-top: 0;
      border-radius: 0 0 0 0; }
    .reui-control-group.reui-vertical > :last-child {
      border-radius: 0 0 0 0; }

/*
CSS `border` property issues:
- An element can only have one border.
- Borders can't stack with shadows.
- Borders modify the size of the element they're applied to.
- Border positioning requires the extra `box-sizing` property.

`box-shadow` doesn't have these issues, we're using it instead of `border`.
*/
/*
Overlay shadows are used for default buttons
floating on top of other elements. This way, the
shadows blend with the colors beneath it.
Switches and slider handles both use these variables.
*/
.reui-control {
  display: block;
  position: relative;
  margin-bottom: 10px;
  cursor: pointer;
  text-transform: none;
  /*
  Checkbox

  Markup:
  <label class="reui-control reui-checkbox {{.modifier}}">
    <input type="checkbox" {{:modifier}} />
    <span class="reui-control-indicator"></span>
    Checkbox
  </label>

  :checked  - Checked
  :disabled - Disabled. Also add <code>.reui-disabled</code> to <code>.reui-control</code> to change text color (not shown below).
  :indeterminate - Indeterminate. Note that this style can only be achieved via JavaScript
                   <code>input.indeterminate = true</code>.
  .reui-align-right - Right-aligned indicator
  .reui-large - Large

  Styleguide checkbox
  */
  /*
  Radio

  Markup:
  <label class="reui-control reui-radio {{.modifier}}">
    <input type="radio" name="docs-radio-regular" {{:modifier}} />
    <span class="reui-control-indicator"></span>
    Radio
  </label>

  :checked  - Selected
  :disabled - Disabled. Also add <code>.reui-disabled</code> to <code>.reui-control</code> to change text color (not shown below).
  .reui-align-right - Right-aligned indicator
  .reui-large - Large

  Styleguide radio
  */
  /*
  Switch

  Markup:
  <label class="reui-control reui-switch {{.modifier}}">
    <input type="checkbox" {{:modifier}} />
    <span class="reui-control-indicator"></span>
    Switch
  </label>

  :checked  - Selected
  :disabled - Disabled. Also add <code>.reui-disabled</code> to <code>.reui-control</code> to change text color (not shown below).
  .reui-align-right - Right-aligned indicator
  .reui-large - Large

  Styleguide switch
  */
  /*
  Inline labels

  Markup:
  <div>
    <label class="reui-label">A group of related options</label>
    <label class="reui-control reui-checkbox reui-inline">
      <input type="checkbox" />
      <span class="reui-control-indicator"></span>
      First
    </label>
    <label class="reui-control reui-checkbox reui-inline">
      <input type="checkbox" />
      <span class="reui-control-indicator"></span>
      Second
    </label>
    <label class="reui-control reui-checkbox reui-inline">
      <input type="checkbox" />
      <span class="reui-control-indicator"></span>
      Third
    </label>
  </div>

  Styleguide checkbox-inline
  */ }
  .reui-control input:checked ~ .reui-control-indicator {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 -1px 0 rgba(16, 22, 26, 0.3);
    background-color: #137cbd;
    color: #ffffff; }
  .reui-control:hover input:checked ~ .reui-control-indicator {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 -1px 0 rgba(16, 22, 26, 0.3);
    background-color: #106ba3; }
  .reui-control input:not(:disabled):active:checked ~ .reui-control-indicator {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 1px 2px rgba(16, 22, 26, 0.3);
    background: #0e5a8a; }
  .reui-control input:disabled:checked ~ .reui-control-indicator {
    box-shadow: none;
    background: rgba(19, 124, 189, 0.5); }
  .reui-dark .reui-control input:checked ~ .reui-control-indicator {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4); }
  .reui-dark .reui-control:hover input:checked ~ .reui-control-indicator {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4);
    background-color: #106ba3; }
  .reui-dark .reui-control input:not(:disabled):active:checked ~ .reui-control-indicator {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4), inset 0 1px 2px rgba(16, 22, 26, 0.2);
    background-color: #0e5a8a; }
  .reui-dark .reui-control input:disabled:checked ~ .reui-control-indicator {
    box-shadow: none;
    background: rgba(14, 90, 138, 0.5); }
  .reui-control:not(.reui-align-right) {
    padding-left: 26px; }
    .reui-control:not(.reui-align-right) .reui-control-indicator {
      margin-left: -26px; }
  .reui-control.reui-align-right {
    padding-right: 26px; }
    .reui-control.reui-align-right .reui-control-indicator {
      margin-right: -26px; }
  .reui-control.reui-disabled {
    cursor: not-allowed;
    color: rgba(128, 128, 128, 0.5); }
  .reui-control.reui-inline {
    display: inline-block;
    margin-right: 20px; }
  .reui-control input {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: -1; }
  .reui-control .reui-control-indicator {
    display: inline-block;
    position: relative;
    margin-top: -3px;
    margin-right: 10px;
    border: none;
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 -1px 0 rgba(16, 22, 26, 0.2);
    background-clip: padding-box;
    background-color: #ebebeb;
    cursor: pointer;
    width: 1em;
    height: 1em;
    vertical-align: middle;
    font-size: 16px;
    user-select: none; }
    .reui-control .reui-control-indicator::before {
      display: inline-block;
      width: 1em;
      height: 1em;
      content: ""; }
  .reui-control:hover .reui-control-indicator {
    background-color: #f0f0f0; }
  .reui-control input:not(:disabled):active ~ .reui-control-indicator {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 1px 2px rgba(16, 22, 26, 0.2);
    background: #e6e6e6; }
  .reui-control input:disabled ~ .reui-control-indicator {
    box-shadow: none;
    background: rgba(222, 222, 222, 0.5);
    cursor: not-allowed; }
  .reui-control input:focus ~ .reui-control-indicator {
    outline: rgba(19, 124, 189, 0.6) auto 2px;
    outline-offset: 2px;
    -moz-outline-radius: 6px; }
  .reui-control.reui-align-right .reui-control-indicator {
    float: right;
    margin-top: 1px;
    margin-left: 10px; }
  .reui-control.reui-large {
    font-size: 16px; }
    .reui-control.reui-large:not(.reui-align-right) {
      padding-left: 30px; }
      .reui-control.reui-large:not(.reui-align-right) .reui-control-indicator {
        margin-left: -30px; }
    .reui-control.reui-large.reui-align-right {
      padding-right: 30px; }
      .reui-control.reui-large.reui-align-right .reui-control-indicator {
        margin-right: -30px; }
    .reui-control.reui-large .reui-control-indicator {
      font-size: 20px; }
    .reui-control.reui-large.reui-align-right .reui-control-indicator {
      margin-top: 0; }
  .reui-control.reui-checkbox input:indeterminate ~ .reui-control-indicator {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 -1px 0 rgba(16, 22, 26, 0.3);
    background-color: #137cbd;
    color: #ffffff; }
  .reui-control.reui-checkbox:hover input:indeterminate ~ .reui-control-indicator {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 -1px 0 rgba(16, 22, 26, 0.3);
    background-color: #106ba3; }
  .reui-control.reui-checkbox input:not(:disabled):active:indeterminate ~ .reui-control-indicator {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.5), inset 0 1px 2px rgba(16, 22, 26, 0.3);
    background: #0e5a8a; }
  .reui-control.reui-checkbox input:disabled:indeterminate ~ .reui-control-indicator {
    box-shadow: none;
    background: rgba(19, 124, 189, 0.5); }
  .reui-dark .reui-control.reui-checkbox input:indeterminate ~ .reui-control-indicator {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4); }
  .reui-dark .reui-control.reui-checkbox:hover input:indeterminate ~ .reui-control-indicator {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4);
    background-color: #106ba3; }
  .reui-dark .reui-control.reui-checkbox input:not(:disabled):active:indeterminate ~ .reui-control-indicator {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4), inset 0 1px 2px rgba(16, 22, 26, 0.2);
    background-color: #0e5a8a; }
  .reui-dark .reui-control.reui-checkbox input:disabled:indeterminate ~ .reui-control-indicator {
    box-shadow: none;
    background: rgba(14, 90, 138, 0.5); }
  .reui-control.reui-checkbox .reui-control-indicator {
    border-radius: 0; }
  .reui-control.reui-checkbox input:checked ~ .reui-control-indicator::before {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 5c-.28 0-.53.11-.71.29L7 9.59l-2.29-2.3a1.003 1.003 0 0 0-1.42 1.42l3 3c.18.18.43.29.71.29s.53-.11.71-.29l5-5A1.003 1.003 0 0 0 12 5z' fill='rgba(255%2c255%2c255%2c1)'/%3e%3c/svg%3e"); }
  .reui-control.reui-checkbox input:indeterminate ~ .reui-control-indicator::before {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 7H5c-.55 0-1 .45-1 1s.45 1 1 1h6c.55 0 1-.45 1-1s-.45-1-1-1z' fill='rgba(255%2c255%2c255%2c1)'/%3e%3c/svg%3e"); }
  .reui-control.reui-checkbox.reui-checkbox-alone {
    padding-left: 0;
    margin-bottom: 0; }
    .reui-control.reui-checkbox.reui-checkbox-alone input {
      margin: 0; }
    .reui-control.reui-checkbox.reui-checkbox-alone .reui-control-indicator {
      margin-left: 0;
      margin-right: 0; }
  .reui-control.reui-radio .reui-control-indicator {
    border-radius: 50%; }
  .reui-control.reui-radio input:checked ~ .reui-control-indicator::before {
    background-image: radial-gradient(#ffffff, #ffffff 28%, transparent 32%); }
  .reui-control.reui-radio input:checked:disabled ~ .reui-control-indicator::before {
    opacity: 0.5; }
  .reui-control.reui-radio input:focus ~ .reui-control-indicator {
    -moz-outline-radius: 16px; }
  .reui-control.reui-switch input ~ .reui-control-indicator {
    background: rgba(194, 194, 194, 0.5); }
  .reui-control.reui-switch:hover input ~ .reui-control-indicator {
    background: rgba(148, 148, 148, 0.5); }
  .reui-control.reui-switch input:not(:disabled):active ~ .reui-control-indicator {
    background: rgba(128, 128, 128, 0.5); }
  .reui-control.reui-switch input:disabled ~ .reui-control-indicator {
    background: rgba(222, 222, 222, 0.5); }
  .reui-control.reui-switch input:checked ~ .reui-control-indicator {
    background: #137cbd; }
  .reui-control.reui-switch:hover input:checked ~ .reui-control-indicator {
    background: #106ba3; }
  .reui-control.reui-switch input:checked:not(:disabled):active ~ .reui-control-indicator {
    background: #0e5a8a; }
  .reui-control.reui-switch input:checked:disabled ~ .reui-control-indicator {
    background: rgba(19, 124, 189, 0.5); }
  .reui-control.reui-switch:not(.reui-align-right) {
    padding-left: 38px; }
    .reui-control.reui-switch:not(.reui-align-right) .reui-control-indicator {
      margin-left: -38px; }
  .reui-control.reui-switch.reui-align-right {
    padding-right: 38px; }
    .reui-control.reui-switch.reui-align-right .reui-control-indicator {
      margin-right: -38px; }
  .reui-control.reui-switch .reui-control-indicator {
    border: none;
    border-radius: 1.75em;
    box-shadow: none !important;
    width: 1.75em;
    transition: background-color 100ms cubic-bezier(0.4, 1, 0.75, 0.9); }
    .reui-control.reui-switch .reui-control-indicator::before {
      position: relative;
      left: 0;
      margin: 2px;
      border-radius: 50%;
      box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.3), 0 1px 1px rgba(16, 22, 26, 0.2);
      background: #ffffff;
      width: calc(1em - 4px);
      height: calc(1em - 4px);
      transition: left 100ms cubic-bezier(0.4, 1, 0.75, 0.9); }
  .reui-control.reui-switch input:checked ~ .reui-control-indicator::before {
    left: 0.75em; }
  .reui-control.reui-switch.reui-large:not(.reui-align-right) {
    padding-left: 45px; }
    .reui-control.reui-switch.reui-large:not(.reui-align-right) .reui-control-indicator {
      margin-left: -45px; }
  .reui-control.reui-switch.reui-large.reui-align-right {
    padding-right: 45px; }
    .reui-control.reui-switch.reui-large.reui-align-right .reui-control-indicator {
      margin-right: -45px; }
  .reui-dark .reui-control.reui-switch input ~ .reui-control-indicator {
    background: rgba(194, 194, 194, 0.5); }
  .reui-dark .reui-control.reui-switch:hover input ~ .reui-control-indicator {
    background: rgba(148, 148, 148, 0.5); }
  .reui-dark .reui-control.reui-switch input:not(:disabled):active ~ .reui-control-indicator {
    background: rgba(128, 128, 128, 0.5); }
  .reui-dark .reui-control.reui-switch input:disabled ~ .reui-control-indicator {
    background: rgba(222, 222, 222, 0.5); }
  .reui-dark .reui-control.reui-switch input:checked ~ .reui-control-indicator {
    background: #137cbd; }
  .reui-dark .reui-control.reui-switch:hover input:checked ~ .reui-control-indicator {
    background: #106ba3; }
  .reui-dark .reui-control.reui-switch input:checked:not(:disabled):active ~ .reui-control-indicator {
    background: #0e5a8a; }
  .reui-dark .reui-control.reui-switch input:checked:disabled ~ .reui-control-indicator {
    background: rgba(19, 124, 189, 0.5); }
  .reui-dark .reui-control.reui-switch .reui-control-indicator::before {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4);
    background: #575757; }
  .reui-dark .reui-control.reui-switch input:checked ~ .reui-control-indicator::before {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.4); }
  .reui-dark .reui-control {
    color: #fafafa; }
    .reui-dark .reui-control.reui-disabled {
      color: rgba(212, 212, 212, 0.5); }
    .reui-dark .reui-control .reui-control-indicator {
      box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4);
      background-color: #575757; }
    .reui-dark .reui-control:hover .reui-control-indicator {
      background-color: #4d4d4d; }
    .reui-dark .reui-control input:not(:disabled):active ~ .reui-control-indicator {
      box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.6), inset 0 1px 2px rgba(16, 22, 26, 0.2);
      background: #333333; }
    .reui-dark .reui-control input:disabled ~ .reui-control-indicator {
      box-shadow: none;
      background: rgba(87, 87, 87, 0.5);
      cursor: not-allowed; }
    .reui-dark .reui-control.reui-checkbox input:disabled:checked ~ .reui-control-indicator, .reui-dark .reui-control.reui-checkbox input:disabled:indeterminate ~ .reui-control-indicator {
      color: rgba(212, 212, 212, 0.5); }

/*
CSS `border` property issues:
- An element can only have one border.
- Borders can't stack with shadows.
- Borders modify the size of the element they're applied to.
- Border positioning requires the extra `box-sizing` property.

`box-shadow` doesn't have these issues, we're using it instead of `border`.
*/
/*
Overlay shadows are used for default buttons
floating on top of other elements. This way, the
shadows blend with the colors beneath it.
Switches and slider handles both use these variables.
*/
/*
File input

Markup:
<label class="reui-file-input {{.modifier}}">
  <input type="file" {{:modifier}}/>
  <span class="reui-file-upload-input">Choose file...</span>
</label>

:disabled - Disabled
.reui-large - Larger size
.reui-fill - Take up full width of parent element

Styleguide file-input
*/
.reui-file-input {
  display: inline-block;
  position: relative;
  cursor: pointer;
  height: 30px; }
  .reui-file-input input {
    opacity: 0;
    margin: 0;
    min-width: 200px; }
    .reui-file-input input:disabled + .reui-file-upload-input,
    .reui-file-input input.reui-disabled + .reui-file-upload-input {
      box-shadow: none;
      background: rgba(222, 222, 222, 0.5);
      cursor: not-allowed;
      color: rgba(128, 128, 128, 0.5);
      resize: none; }
      .reui-file-input input:disabled + .reui-file-upload-input::after,
      .reui-file-input input.reui-disabled + .reui-file-upload-input::after {
        outline: none;
        box-shadow: none;
        background-color: rgba(222, 222, 222, 0.5);
        cursor: not-allowed;
        color: rgba(128, 128, 128, 0.5); }
        .reui-file-input input:disabled + .reui-file-upload-input::after.reui-active, .reui-file-input input:disabled + .reui-file-upload-input::after.reui-active:hover,
        .reui-file-input input.reui-disabled + .reui-file-upload-input::after.reui-active,
        .reui-file-input input.reui-disabled + .reui-file-upload-input::after.reui-active:hover {
          background: rgba(222, 222, 222, 0.7); }
      .reui-dark .reui-file-input input:disabled + .reui-file-upload-input, .reui-dark
      .reui-file-input input.reui-disabled + .reui-file-upload-input {
        box-shadow: none;
        background: rgba(87, 87, 87, 0.5);
        color: rgba(212, 212, 212, 0.5); }
        .reui-dark .reui-file-input input:disabled + .reui-file-upload-input::after, .reui-dark
        .reui-file-input input.reui-disabled + .reui-file-upload-input::after {
          box-shadow: none;
          background-color: rgba(87, 87, 87, 0.5);
          color: rgba(212, 212, 212, 0.5); }
          .reui-dark .reui-file-input input:disabled + .reui-file-upload-input::after.reui-active, .reui-dark
          .reui-file-input input.reui-disabled + .reui-file-upload-input::after.reui-active {
            background: rgba(87, 87, 87, 0.7); }
  .reui-file-input.reui-fill {
    width: 100%; }
  .reui-file-input.reui-large,
  .reui-large .reui-file-input {
    height: 40px; }

.reui-file-upload-input {
  outline: none;
  border: none;
  border-radius: 0;
  box-shadow: 0 0 0 0 rgba(19, 124, 189, 0), 0 0 0 0 rgba(19, 124, 189, 0), inset 0 0 0 1px rgba(16, 22, 26, 0.45);
  background: #ffffff;
  height: 30px;
  padding: 0 10px;
  vertical-align: middle;
  line-height: 30px;
  color: #444;
  font-size: 13px;
  font-weight: 400;
  transition: box-shadow 100ms cubic-bezier(0.4, 1, 0.75, 0.9);
  appearance: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  padding-right: 80px;
  user-select: none; }
  .reui-file-upload-input::placeholder {
    opacity: 1;
    color: rgba(128, 128, 128, 0.5); }
  .reui-file-upload-input:focus, .reui-file-upload-input.reui-active {
    box-shadow: 0 0 0 1px #137cbd, 0 0 0 3px rgba(19, 124, 189, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2); }
  .reui-file-upload-input[type="search"], .reui-file-upload-input.reui-round {
    border-radius: 30px;
    box-sizing: border-box;
    padding-left: 10px; }
  .reui-file-upload-input[readonly] {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.175); }
  .reui-file-upload-input:disabled, .reui-file-upload-input.reui-disabled {
    box-shadow: none;
    background: rgba(222, 222, 222, 0.5);
    cursor: not-allowed;
    color: rgba(128, 128, 128, 0.5);
    resize: none; }
  .reui-file-upload-input::after {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 -1px 0 rgba(16, 22, 26, 0.2);
    background-color: #ebebeb;
    color: #444;
    min-width: 24px;
    min-height: 24px;
    position: absolute;
    top: 0;
    right: 0;
    margin: 3px;
    border-radius: 0;
    width: 70px;
    text-align: center;
    line-height: 24px;
    content: "Browse"; }
    .reui-file-upload-input::after:hover {
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 -1px 0 rgba(16, 22, 26, 0.2);
      background-clip: padding-box;
      background-color: #f0f0f0; }
    .reui-file-upload-input::after:active, .reui-file-upload-input::after.reui-active {
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 1px 2px rgba(16, 22, 26, 0.2);
      background-color: #e6e6e6; }
    .reui-file-upload-input::after:disabled, .reui-file-upload-input::after.reui-disabled {
      outline: none;
      box-shadow: none;
      background-color: rgba(222, 222, 222, 0.5);
      cursor: not-allowed;
      color: rgba(128, 128, 128, 0.5); }
      .reui-file-upload-input::after:disabled.reui-active, .reui-file-upload-input::after:disabled.reui-active:hover, .reui-file-upload-input::after.reui-disabled.reui-active, .reui-file-upload-input::after.reui-disabled.reui-active:hover {
        background: rgba(222, 222, 222, 0.7); }
  .reui-file-upload-input:hover::after {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 -1px 0 rgba(16, 22, 26, 0.2);
    background-clip: padding-box;
    background-color: #f0f0f0; }
  .reui-file-upload-input:active::after {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 1px 2px rgba(16, 22, 26, 0.2);
    background-color: #e6e6e6; }
  .reui-large .reui-file-upload-input {
    height: 40px;
    line-height: 40px;
    font-size: 16px;
    padding-right: 95px; }
    .reui-large .reui-file-upload-input[type="search"], .reui-large .reui-file-upload-input.reui-round {
      padding: 0 15px; }
    .reui-large .reui-file-upload-input::after {
      min-width: 30px;
      min-height: 30px;
      margin: 5px;
      width: 85px;
      line-height: 30px; }
  .reui-dark .reui-file-upload-input {
    box-shadow: 0 0 0 0 rgba(19, 124, 189, 0), 0 0 0 0 rgba(19, 124, 189, 0), 0 0 0 0 rgba(19, 124, 189, 0), inset 0 0 0 1px rgba(16, 22, 26, 0.45);
    background: rgba(16, 22, 26, 0.3);
    color: #fafafa;
    color: #d4d4d4; }
    .reui-dark .reui-file-upload-input::placeholder {
      color: rgba(212, 212, 212, 0.5); }
    .reui-dark .reui-file-upload-input:focus {
      box-shadow: 0 0 0 1px #137cbd, 0 0 0 1px #137cbd, 0 0 0 3px rgba(19, 124, 189, 0.3), inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
    .reui-dark .reui-file-upload-input[readonly] {
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.4); }
    .reui-dark .reui-file-upload-input:disabled, .reui-dark .reui-file-upload-input.reui-disabled {
      box-shadow: none;
      background: rgba(87, 87, 87, 0.5);
      color: rgba(212, 212, 212, 0.5); }
    .reui-dark .reui-file-upload-input::after {
      box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4);
      background-color: #575757;
      color: #fafafa; }
      .reui-dark .reui-file-upload-input::after:hover, .reui-dark .reui-file-upload-input::after:active, .reui-dark .reui-file-upload-input::after.reui-active {
        color: #fafafa; }
      .reui-dark .reui-file-upload-input::after:hover {
        box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4);
        background-color: #4d4d4d; }
      .reui-dark .reui-file-upload-input::after:active, .reui-dark .reui-file-upload-input::after.reui-active {
        box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.6), inset 0 1px 2px rgba(16, 22, 26, 0.2);
        background-color: #333333; }
      .reui-dark .reui-file-upload-input::after:disabled, .reui-dark .reui-file-upload-input::after.reui-disabled {
        box-shadow: none;
        background-color: rgba(87, 87, 87, 0.5);
        color: rgba(212, 212, 212, 0.5); }
        .reui-dark .reui-file-upload-input::after:disabled.reui-active, .reui-dark .reui-file-upload-input::after.reui-disabled.reui-active {
          background: rgba(87, 87, 87, 0.7); }
      .reui-dark .reui-file-upload-input::after .reui-button-spinner .reui-spinner-head {
        background: rgba(16, 22, 26, 0.5);
        stroke: #a6a6a6; }
    .reui-dark .reui-file-upload-input:hover::after {
      box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4);
      background-color: #4d4d4d; }
    .reui-dark .reui-file-upload-input:active::after {
      box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.6), inset 0 1px 2px rgba(16, 22, 26, 0.2);
      background-color: #333333; }

.reui-file-upload-input::after {
  box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 -1px 0 rgba(16, 22, 26, 0.2); }

/*
CSS `border` property issues:
- An element can only have one border.
- Borders can't stack with shadows.
- Borders modify the size of the element they're applied to.
- Border positioning requires the extra `box-sizing` property.

`box-shadow` doesn't have these issues, we're using it instead of `border`.
*/
/*
Overlay shadows are used for default buttons
floating on top of other elements. This way, the
shadows blend with the colors beneath it.
Switches and slider handles both use these variables.
*/
/*
Form groups

Markup:
<div class="reui-form-group {{.modifier}}">
  <label class="reui-label" for="form-group-input">
    Label
    <span class="reui-text-muted">(required)</span>
  </label>
  <div class="reui-form-content">
    <div class="reui-input-group {{.modifier}}">
      <span class="reui-icon reui-icon-calendar"></span>
      <input id="form-group-input" type="text" {{:modifier}} class="reui-input"
             style="width: 200px;" placeholder="Placeholder text" dir="auto" />
    </div>
    <div class="reui-form-helper-text">Please enter a value</div>
  </div>
</div>

:disabled - Disable the input.
.reui-disabled - Disabled styles. Input must be disabled separately via attribute.
.reui-inline - Label and content appear side by side.
.reui-intent-primary - Apply intent to form group and input separately.

Styleguide form-group
*/
.reui-form-group {
  display: flex;
  flex-direction: column;
  margin: 0 0 15px; }
  .reui-form-group label.reui-label {
    margin-bottom: 5px; }
  .reui-form-group .reui-control {
    margin-top: 7px; }
  .reui-form-group .reui-form-helper-text {
    margin-top: 5px;
    color: #808080;
    font-size: 12px; }
  .reui-form-group.reui-intent-primary .reui-form-helper-text {
    color: #106ba3; }
  .reui-form-group.reui-intent-success .reui-form-helper-text {
    color: #0d8050; }
  .reui-form-group.reui-intent-warning .reui-form-helper-text {
    color: #bf7326; }
  .reui-form-group.reui-intent-danger .reui-form-helper-text {
    color: #c23030; }
  .reui-form-group.reui-inline {
    flex-direction: row;
    align-items: flex-start; }
    .reui-form-group.reui-inline.reui-large label.reui-label {
      margin: 0 10px 0 0;
      line-height: 40px; }
    .reui-form-group.reui-inline label.reui-label {
      margin: 0 10px 0 0;
      line-height: 30px; }
  .reui-form-group.reui-disabled .reui-label,
  .reui-form-group.reui-disabled .reui-text-muted,
  .reui-form-group.reui-disabled .reui-form-helper-text {
    color: rgba(128, 128, 128, 0.5) !important; }
  .reui-dark .reui-form-group.reui-intent-primary .reui-form-helper-text {
    color: #48aff0; }
  .reui-dark .reui-form-group.reui-intent-success .reui-form-helper-text {
    color: #3dcc91; }
  .reui-dark .reui-form-group.reui-intent-warning .reui-form-helper-text {
    color: #ffb366; }
  .reui-dark .reui-form-group.reui-intent-danger .reui-form-helper-text {
    color: #ff7373; }
  .reui-dark .reui-form-group .reui-form-helper-text {
    color: #d4d4d4; }
  .reui-dark .reui-form-group.reui-disabled .reui-label,
  .reui-dark .reui-form-group.reui-disabled .reui-text-muted,
  .reui-dark .reui-form-group.reui-disabled .reui-form-helper-text {
    color: rgba(212, 212, 212, 0.5) !important; }

/*
CSS `border` property issues:
- An element can only have one border.
- Borders can't stack with shadows.
- Borders modify the size of the element they're applied to.
- Border positioning requires the extra `box-sizing` property.

`box-shadow` doesn't have these issues, we're using it instead of `border`.
*/
/*
Overlay shadows are used for default buttons
floating on top of other elements. This way, the
shadows blend with the colors beneath it.
Switches and slider handles both use these variables.
*/
/*
Input groups

Markup:
<div class="reui-input-group {{.modifier}}">
  <span class="reui-icon reui-icon-filter"></span>
  <input type="text" class="reui-input" {{:modifier}} placeholder="Filter histogram..." />
</div>
<div class="reui-input-group {{.modifier}}">
  <input type="password" class="reui-input" {{:modifier}} placeholder="Enter your password..." />
  <button class="reui-button reui-minimal reui-intent-warning reui-icon-lock" {{:modifier}}></button>
</div>
<div class="reui-input-group {{.modifier}}">
  <span class="reui-icon reui-icon-search"></span>
  <input type="text" class="reui-input" {{:modifier}} placeholder="Search" />
  <button class="reui-button reui-minimal reui-intent-primary reui-icon-arrow-right" {{:modifier}}></button>
</div>

:disabled - Disabled input. Must be added separately to the <code>&#60;input&#62;</code> and <code>&#60;button&#62;</code>. Also add <code>.reui-disabled</code> to <code>.reui-input-group</code> for icon coloring (not shown below).
.reui-round - Rounded caps. Button will also be rounded.
.reui-large - Large group. Children will adjust size accordingly.
.reui-intent-primary - Primary intent. (All 4 intents are supported.)
.reui-fill - Take up full width of parent element.

Styleguide input-group
*/
.reui-input-group {
  display: block;
  position: relative; }
  .reui-input-group .reui-input {
    position: relative;
    width: 100%; }
    .reui-input-group .reui-input:not(:first-child) {
      padding-left: 30px; }
    .reui-input-group .reui-input:not(:last-child) {
      padding-right: 30px; }
  .reui-input-group .reui-input-action,
  .reui-input-group > .reui-button,
  .reui-input-group > .reui-icon {
    position: absolute;
    top: 0; }
    .reui-input-group .reui-input-action:first-child,
    .reui-input-group > .reui-button:first-child,
    .reui-input-group > .reui-icon:first-child {
      left: 0; }
    .reui-input-group .reui-input-action:last-child,
    .reui-input-group > .reui-button:last-child,
    .reui-input-group > .reui-icon:last-child {
      right: 0; }
  .reui-input-group .reui-button {
    min-width: 24px;
    min-height: 24px;
    margin: 3px;
    padding: 0 7px;
    line-height: 1.8; }
    .reui-input-group .reui-button:empty {
      padding: 0; }
  .reui-input-group > .reui-icon {
    line-height: 1;
    font-family: "Icons16", sans-serif;
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    z-index: 1;
    color: #808080; }
  .reui-input-group > .reui-icon,
  .reui-input-group .reui-input-action > .reui-spinner {
    margin: 7px; }
  .reui-input-group .reui-tag {
    margin: 5px; }
  .reui-input-group .reui-input:not(:focus) + .reui-button.reui-minimal:not(:hover):not(:focus),
  .reui-input-group .reui-input:not(:focus) + .reui-input-action .reui-button.reui-minimal:not(:hover):not(:focus) {
    color: #808080; }
    .reui-dark .reui-input-group .reui-input:not(:focus) + .reui-button.reui-minimal:not(:hover):not(:focus), .reui-dark
    .reui-input-group .reui-input:not(:focus) + .reui-input-action .reui-button.reui-minimal:not(:hover):not(:focus) {
      color: #d4d4d4; }
    .reui-input-group .reui-input:not(:focus) + .reui-button.reui-minimal:not(:hover):not(:focus) .reui-icon, .reui-input-group .reui-input:not(:focus) + .reui-button.reui-minimal:not(:hover):not(:focus) .reui-icon-standard, .reui-input-group .reui-input:not(:focus) + .reui-button.reui-minimal:not(:hover):not(:focus) .reui-icon-large,
    .reui-input-group .reui-input:not(:focus) + .reui-input-action .reui-button.reui-minimal:not(:hover):not(:focus) .reui-icon,
    .reui-input-group .reui-input:not(:focus) + .reui-input-action .reui-button.reui-minimal:not(:hover):not(:focus) .reui-icon-standard,
    .reui-input-group .reui-input:not(:focus) + .reui-input-action .reui-button.reui-minimal:not(:hover):not(:focus) .reui-icon-large {
      color: #808080; }
  .reui-input-group .reui-input:not(:focus) + .reui-button.reui-minimal:disabled,
  .reui-input-group .reui-input:not(:focus) + .reui-input-action .reui-button.reui-minimal:disabled {
    color: rgba(128, 128, 128, 0.5) !important; }
    .reui-input-group .reui-input:not(:focus) + .reui-button.reui-minimal:disabled .reui-icon, .reui-input-group .reui-input:not(:focus) + .reui-button.reui-minimal:disabled .reui-icon-standard, .reui-input-group .reui-input:not(:focus) + .reui-button.reui-minimal:disabled .reui-icon-large,
    .reui-input-group .reui-input:not(:focus) + .reui-input-action .reui-button.reui-minimal:disabled .reui-icon,
    .reui-input-group .reui-input:not(:focus) + .reui-input-action .reui-button.reui-minimal:disabled .reui-icon-standard,
    .reui-input-group .reui-input:not(:focus) + .reui-input-action .reui-button.reui-minimal:disabled .reui-icon-large {
      color: rgba(128, 128, 128, 0.5) !important; }
  .reui-input-group.reui-disabled {
    cursor: not-allowed; }
    .reui-input-group.reui-disabled .reui-icon {
      color: rgba(128, 128, 128, 0.5); }
  .reui-input-group.reui-large .reui-button {
    min-width: 30px;
    min-height: 30px;
    margin: 5px; }
  .reui-input-group.reui-large > .reui-icon,
  .reui-input-group.reui-large .reui-input-action > .reui-spinner {
    margin: 12px; }
  .reui-input-group.reui-large .reui-input {
    height: 40px;
    line-height: 40px;
    font-size: 16px; }
    .reui-input-group.reui-large .reui-input[type="search"], .reui-input-group.reui-large .reui-input.reui-round {
      padding: 0 15px; }
    .reui-input-group.reui-large .reui-input:not(:first-child) {
      padding-left: 40px; }
    .reui-input-group.reui-large .reui-input:not(:last-child) {
      padding-right: 40px; }
  .reui-input-group.reui-fill {
    flex: 1 1 auto;
    width: 100%; }
  .reui-input-group.reui-round .reui-button,
  .reui-input-group.reui-round .reui-input,
  .reui-input-group.reui-round .reui-tag {
    border-radius: 30px; }
  .reui-dark .reui-input-group .reui-icon {
    color: #d4d4d4; }
  .reui-dark .reui-input-group.reui-disabled .reui-icon {
    color: rgba(212, 212, 212, 0.5); }
  .reui-input-group.reui-intent-primary .reui-input {
    box-shadow: 0 0 0 0 rgba(19, 124, 189, 0), 0 0 0 0 rgba(19, 124, 189, 0), inset 0 0 0 1px #137cbd, inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
    .reui-input-group.reui-intent-primary .reui-input:focus {
      box-shadow: 0 0 0 1px #137cbd, 0 0 0 3px rgba(19, 124, 189, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2); }
    .reui-input-group.reui-intent-primary .reui-input[readonly] {
      box-shadow: inset 0 0 0 1px #137cbd; }
    .reui-input-group.reui-intent-primary .reui-input:disabled, .reui-input-group.reui-intent-primary .reui-input.reui-disabled {
      box-shadow: none; }
  .reui-input-group.reui-intent-primary > .reui-icon {
    color: #106ba3; }
    .reui-dark .reui-input-group.reui-intent-primary > .reui-icon {
      color: #48aff0; }
  .reui-input-group.reui-intent-success .reui-input {
    box-shadow: 0 0 0 0 rgba(15, 153, 96, 0), 0 0 0 0 rgba(15, 153, 96, 0), inset 0 0 0 1px #0f9960, inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
    .reui-input-group.reui-intent-success .reui-input:focus {
      box-shadow: 0 0 0 1px #0f9960, 0 0 0 3px rgba(15, 153, 96, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2); }
    .reui-input-group.reui-intent-success .reui-input[readonly] {
      box-shadow: inset 0 0 0 1px #0f9960; }
    .reui-input-group.reui-intent-success .reui-input:disabled, .reui-input-group.reui-intent-success .reui-input.reui-disabled {
      box-shadow: none; }
  .reui-input-group.reui-intent-success > .reui-icon {
    color: #0d8050; }
    .reui-dark .reui-input-group.reui-intent-success > .reui-icon {
      color: #3dcc91; }
  .reui-input-group.reui-intent-warning .reui-input {
    box-shadow: 0 0 0 0 rgba(217, 130, 43, 0), 0 0 0 0 rgba(217, 130, 43, 0), inset 0 0 0 1px #d9822b, inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
    .reui-input-group.reui-intent-warning .reui-input:focus {
      box-shadow: 0 0 0 1px #d9822b, 0 0 0 3px rgba(217, 130, 43, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2); }
    .reui-input-group.reui-intent-warning .reui-input[readonly] {
      box-shadow: inset 0 0 0 1px #d9822b; }
    .reui-input-group.reui-intent-warning .reui-input:disabled, .reui-input-group.reui-intent-warning .reui-input.reui-disabled {
      box-shadow: none; }
  .reui-input-group.reui-intent-warning > .reui-icon {
    color: #bf7326; }
    .reui-dark .reui-input-group.reui-intent-warning > .reui-icon {
      color: #ffb366; }
  .reui-input-group.reui-intent-danger .reui-input {
    box-shadow: 0 0 0 0 rgba(219, 55, 55, 0), 0 0 0 0 rgba(219, 55, 55, 0), inset 0 0 0 1px #db3737, inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
    .reui-input-group.reui-intent-danger .reui-input:focus {
      box-shadow: 0 0 0 1px #db3737, 0 0 0 3px rgba(219, 55, 55, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2); }
    .reui-input-group.reui-intent-danger .reui-input[readonly] {
      box-shadow: inset 0 0 0 1px #db3737; }
    .reui-input-group.reui-intent-danger .reui-input:disabled, .reui-input-group.reui-intent-danger .reui-input.reui-disabled {
      box-shadow: none; }
  .reui-input-group.reui-intent-danger > .reui-icon {
    color: #c23030; }
    .reui-dark .reui-input-group.reui-intent-danger > .reui-icon {
      color: #ff7373; }

/*
Text inputs

Markup:
<input class="reui-input {{.modifier}}" {{:modifier}} type="text" placeholder="Text input" dir="auto" />

:disabled - Disabled
:readonly - Readonly
.reui-round - Rounded ends
.reui-large - Larger size
.reui-intent-primary - Primary intent
.reui-intent-success - Success intent
.reui-intent-warning - Warning intent
.reui-intent-danger - Danger intent
.reui-fill - Take up full width of parent element

Styleguide input
*/
.reui-input {
  outline: none;
  border: none;
  border-radius: 0;
  box-shadow: 0 0 0 0 rgba(19, 124, 189, 0), 0 0 0 0 rgba(19, 124, 189, 0), inset 0 0 0 1px rgba(16, 22, 26, 0.45);
  background: #ffffff;
  height: 30px;
  padding: 0 10px;
  vertical-align: middle;
  line-height: 30px;
  color: #444;
  font-size: 13px;
  font-weight: 400;
  transition: box-shadow 100ms cubic-bezier(0.4, 1, 0.75, 0.9);
  appearance: none; }
  .reui-input::placeholder {
    opacity: 1;
    color: rgba(128, 128, 128, 0.5); }
  .reui-input:focus, .reui-input.reui-active {
    box-shadow: 0 0 0 1px #137cbd, 0 0 0 3px rgba(19, 124, 189, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2); }
  .reui-input[type="search"], .reui-input.reui-round {
    border-radius: 30px;
    box-sizing: border-box;
    padding-left: 10px; }
  .reui-input[readonly] {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.175); }
  .reui-input:disabled, .reui-input.reui-disabled {
    box-shadow: none;
    background: rgba(222, 222, 222, 0.5);
    cursor: not-allowed;
    color: rgba(128, 128, 128, 0.5);
    resize: none; }
  .reui-input.reui-large {
    height: 40px;
    line-height: 40px;
    font-size: 16px; }
    .reui-input.reui-large[type="search"], .reui-input.reui-large.reui-round {
      padding: 0 15px; }
  .reui-input.reui-fill {
    flex: 1 1 auto;
    width: 100%; }
  .reui-dark .reui-input {
    box-shadow: 0 0 0 0 rgba(19, 124, 189, 0), 0 0 0 0 rgba(19, 124, 189, 0), 0 0 0 0 rgba(19, 124, 189, 0), inset 0 0 0 1px rgba(16, 22, 26, 0.45);
    background: rgba(16, 22, 26, 0.3);
    color: #fafafa; }
    .reui-dark .reui-input::placeholder {
      color: rgba(212, 212, 212, 0.5); }
    .reui-dark .reui-input:focus {
      box-shadow: 0 0 0 1px #137cbd, 0 0 0 1px #137cbd, 0 0 0 3px rgba(19, 124, 189, 0.3), inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
    .reui-dark .reui-input[readonly] {
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.4); }
    .reui-dark .reui-input:disabled, .reui-dark .reui-input.reui-disabled {
      box-shadow: none;
      background: rgba(87, 87, 87, 0.5);
      color: rgba(212, 212, 212, 0.5); }
  .reui-input.reui-intent-primary {
    box-shadow: 0 0 0 0 rgba(19, 124, 189, 0), 0 0 0 0 rgba(19, 124, 189, 0), inset 0 0 0 1px #137cbd, inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
    .reui-input.reui-intent-primary:focus {
      box-shadow: 0 0 0 1px #137cbd, 0 0 0 3px rgba(19, 124, 189, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2); }
    .reui-input.reui-intent-primary[readonly] {
      box-shadow: inset 0 0 0 1px #137cbd; }
    .reui-input.reui-intent-primary:disabled, .reui-input.reui-intent-primary.reui-disabled {
      box-shadow: none; }
    .reui-dark .reui-input.reui-intent-primary {
      box-shadow: 0 0 0 0 rgba(19, 124, 189, 0), 0 0 0 0 rgba(19, 124, 189, 0), 0 0 0 0 rgba(19, 124, 189, 0), inset 0 0 0 1px #137cbd, inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
      .reui-dark .reui-input.reui-intent-primary:focus {
        box-shadow: 0 0 0 1px #137cbd, 0 0 0 1px #137cbd, 0 0 0 3px rgba(19, 124, 189, 0.3), inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
      .reui-dark .reui-input.reui-intent-primary[readonly] {
        box-shadow: inset 0 0 0 1px #137cbd; }
      .reui-dark .reui-input.reui-intent-primary:disabled, .reui-dark .reui-input.reui-intent-primary.reui-disabled {
        box-shadow: none; }
  .reui-input.reui-intent-success {
    box-shadow: 0 0 0 0 rgba(15, 153, 96, 0), 0 0 0 0 rgba(15, 153, 96, 0), inset 0 0 0 1px #0f9960, inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
    .reui-input.reui-intent-success:focus {
      box-shadow: 0 0 0 1px #0f9960, 0 0 0 3px rgba(15, 153, 96, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2); }
    .reui-input.reui-intent-success[readonly] {
      box-shadow: inset 0 0 0 1px #0f9960; }
    .reui-input.reui-intent-success:disabled, .reui-input.reui-intent-success.reui-disabled {
      box-shadow: none; }
    .reui-dark .reui-input.reui-intent-success {
      box-shadow: 0 0 0 0 rgba(15, 153, 96, 0), 0 0 0 0 rgba(15, 153, 96, 0), 0 0 0 0 rgba(15, 153, 96, 0), inset 0 0 0 1px #0f9960, inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
      .reui-dark .reui-input.reui-intent-success:focus {
        box-shadow: 0 0 0 1px #0f9960, 0 0 0 1px #0f9960, 0 0 0 3px rgba(15, 153, 96, 0.3), inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
      .reui-dark .reui-input.reui-intent-success[readonly] {
        box-shadow: inset 0 0 0 1px #0f9960; }
      .reui-dark .reui-input.reui-intent-success:disabled, .reui-dark .reui-input.reui-intent-success.reui-disabled {
        box-shadow: none; }
  .reui-input.reui-intent-warning {
    box-shadow: 0 0 0 0 rgba(217, 130, 43, 0), 0 0 0 0 rgba(217, 130, 43, 0), inset 0 0 0 1px #d9822b, inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
    .reui-input.reui-intent-warning:focus {
      box-shadow: 0 0 0 1px #d9822b, 0 0 0 3px rgba(217, 130, 43, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2); }
    .reui-input.reui-intent-warning[readonly] {
      box-shadow: inset 0 0 0 1px #d9822b; }
    .reui-input.reui-intent-warning:disabled, .reui-input.reui-intent-warning.reui-disabled {
      box-shadow: none; }
    .reui-dark .reui-input.reui-intent-warning {
      box-shadow: 0 0 0 0 rgba(217, 130, 43, 0), 0 0 0 0 rgba(217, 130, 43, 0), 0 0 0 0 rgba(217, 130, 43, 0), inset 0 0 0 1px #d9822b, inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
      .reui-dark .reui-input.reui-intent-warning:focus {
        box-shadow: 0 0 0 1px #d9822b, 0 0 0 1px #d9822b, 0 0 0 3px rgba(217, 130, 43, 0.3), inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
      .reui-dark .reui-input.reui-intent-warning[readonly] {
        box-shadow: inset 0 0 0 1px #d9822b; }
      .reui-dark .reui-input.reui-intent-warning:disabled, .reui-dark .reui-input.reui-intent-warning.reui-disabled {
        box-shadow: none; }
  .reui-input.reui-intent-danger {
    box-shadow: 0 0 0 0 rgba(219, 55, 55, 0), 0 0 0 0 rgba(219, 55, 55, 0), inset 0 0 0 1px #db3737, inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
    .reui-input.reui-intent-danger:focus {
      box-shadow: 0 0 0 1px #db3737, 0 0 0 3px rgba(219, 55, 55, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2); }
    .reui-input.reui-intent-danger[readonly] {
      box-shadow: inset 0 0 0 1px #db3737; }
    .reui-input.reui-intent-danger:disabled, .reui-input.reui-intent-danger.reui-disabled {
      box-shadow: none; }
    .reui-dark .reui-input.reui-intent-danger {
      box-shadow: 0 0 0 0 rgba(219, 55, 55, 0), 0 0 0 0 rgba(219, 55, 55, 0), 0 0 0 0 rgba(219, 55, 55, 0), inset 0 0 0 1px #db3737, inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
      .reui-dark .reui-input.reui-intent-danger:focus {
        box-shadow: 0 0 0 1px #db3737, 0 0 0 1px #db3737, 0 0 0 3px rgba(219, 55, 55, 0.3), inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
      .reui-dark .reui-input.reui-intent-danger[readonly] {
        box-shadow: inset 0 0 0 1px #db3737; }
      .reui-dark .reui-input.reui-intent-danger:disabled, .reui-dark .reui-input.reui-intent-danger.reui-disabled {
        box-shadow: none; }
  .reui-input::-ms-clear {
    display: none; }

/*
Search inputs

Markup:
<div class="reui-input-group {{.modifier}}">
  <span class="reui-icon reui-icon-search"></span>
  <input class="reui-input" {{:modifier}} type="search" placeholder="Search input" dir="auto" />
</div>

:disabled - Disabled. Also add <code>.reui-disabled</code> to <code>.reui-input-group</code> for icon coloring (not shown below).
.reui-large - Large

Styleguide input-search
*/
/*
Textareas

Markup:
<textarea class="reui-input {{.modifier}}" {{:modifier}} dir="auto"></textarea>

:disabled - Disabled
:readonly - Readonly
.reui-large - Larger font size
.reui-intent-primary - Primary intent
.reui-intent-danger  - Danger intent
.reui-fill  - Take up full width of parent element

Styleguide textarea
*/
textarea.reui-input {
  max-width: 100%;
  height: auto;
  padding: 10px;
  line-height: 1.38472; }
  textarea.reui-input.reui-large {
    line-height: 1.38472;
    font-size: 16px; }
  .reui-dark textarea.reui-input {
    box-shadow: 0 0 0 0 rgba(19, 124, 189, 0), 0 0 0 0 rgba(19, 124, 189, 0), 0 0 0 0 rgba(19, 124, 189, 0), inset 0 0 0 1px rgba(16, 22, 26, 0.45);
    background: rgba(16, 22, 26, 0.3);
    color: #fafafa; }
    .reui-dark textarea.reui-input::placeholder {
      color: rgba(212, 212, 212, 0.5); }
    .reui-dark textarea.reui-input:focus {
      box-shadow: 0 0 0 1px #137cbd, 0 0 0 1px #137cbd, 0 0 0 3px rgba(19, 124, 189, 0.3), inset 0 0 0 1px rgba(16, 22, 26, 0.45); }
    .reui-dark textarea.reui-input[readonly] {
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.4); }
    .reui-dark textarea.reui-input:disabled, .reui-dark textarea.reui-input.reui-disabled {
      box-shadow: none;
      background: rgba(87, 87, 87, 0.5);
      color: rgba(212, 212, 212, 0.5); }

/*
Labels

Markup:
<div>
  <label class="reui-label {{.modifier}}">
    Label A
    <span class="reui-text-muted">(optional)</span>
    <input {{:modifier}} class="reui-input" style="width: 200px;" type="text" placeholder="Text input" dir="auto" />
  </label>
  <label class="reui-label {{.modifier}}">
    Label B
    <div class="reui-input-group {{.modifier}}">
      <span class="reui-icon reui-icon-calendar"></span>
      <input {{:modifier}} class="reui-input" style="width: 200px;" type="text" placeholder="Input group" dir="auto" />
    </div>
  </label>
  <label class="reui-label {{.modifier}}">
    Label C
    <div class="reui-select {{.modifier}}">
      <select {{:modifier}}>
        <option selected>Choose an item...</option>
        <option value="1">One</option>
      </select>
    </div>
  </label>
</div>

:disabled - Disable the input.
.reui-disabled - Disabled styles. Input must be disabled separately via attribute.
.reui-inline - Label and content appear side by side.

Styleguide label
*/
label.reui-label {
  display: block;
  margin-top: 0;
  margin-bottom: 15px; }
  label.reui-label .reui-html-select,
  label.reui-label .reui-input,
  label.reui-label .reui-select,
  label.reui-label .reui-slider,
  label.reui-label .reui-popover-wrapper {
    display: block;
    margin-top: 5px;
    text-transform: none; }
  label.reui-label .reui-select select,
  label.reui-label .reui-html-select select {
    width: 100%;
    vertical-align: top;
    font-weight: 400; }
  label.reui-label.reui-disabled,
  label.reui-label.reui-disabled .reui-text-muted {
    color: rgba(128, 128, 128, 0.5); }
  label.reui-label.reui-inline {
    line-height: 30px; }
    label.reui-label.reui-inline .reui-html-select,
    label.reui-label.reui-inline .reui-input,
    label.reui-label.reui-inline .reui-input-group,
    label.reui-label.reui-inline .reui-select,
    label.reui-label.reui-inline .reui-popover-wrapper {
      display: inline-block;
      margin: 0 0 0 5px;
      vertical-align: top; }
    label.reui-label.reui-inline .reui-input-group .reui-input {
      margin-left: 0; }
    label.reui-label.reui-inline.reui-large {
      line-height: 40px; }
  label.reui-label:not(.reui-inline) .reui-popover-target {
    display: block; }
  .reui-dark label.reui-label {
    color: #fafafa; }
    .reui-dark label.reui-label.reui-disabled,
    .reui-dark label.reui-label.reui-disabled .reui-text-muted {
      color: rgba(212, 212, 212, 0.5); }

/*
CSS `border` property issues:
- An element can only have one border.
- Borders can't stack with shadows.
- Borders modify the size of the element they're applied to.
- Border positioning requires the extra `box-sizing` property.

`box-shadow` doesn't have these issues, we're using it instead of `border`.
*/
/*
Overlay shadows are used for default buttons
floating on top of other elements. This way, the
shadows blend with the colors beneath it.
Switches and slider handles both use these variables.
*/
.reui-numeric-input .reui-button-group.reui-vertical > .reui-button {
  flex: 1 1 14px;
  width: 30px;
  min-height: 0;
  padding: 0; }
  .reui-numeric-input .reui-button-group.reui-vertical > .reui-button:first-child {
    border-radius: 0 0 0 0; }
  .reui-numeric-input .reui-button-group.reui-vertical > .reui-button:last-child {
    border-radius: 0 0 0 0; }

.reui-numeric-input .reui-button-group.reui-vertical:first-child > .reui-button:first-child {
  border-radius: 0 0 0 0; }

.reui-numeric-input .reui-button-group.reui-vertical:first-child > .reui-button:last-child {
  border-radius: 0 0 0 0; }

.reui-numeric-input.reui-large .reui-button-group.reui-vertical > .reui-button {
  width: 40px; }

form {
  display: block; }

/*
A mixin to generate the classes for a React CSSTransition which animates any number of CSS
properties at once.

Transitioned properties are specificed as a map of property names to lists of (inital value, final
value). For enter & appear transitions, each property will transition from its initial to its final
value. For exit transitions, each property will transition in reverse, from final to initial.

**Simple example:**
`@include react-transition("popover", (opacity: 0 1), $before: "&");`
Transition named "popover" moves opacity from 0 to 1. `"&"` indicates that the
Transition classes are expected to be applied to this element, where the mixin is invoked.

**Params:**
$name: React transitionName prop
$properties: map of CSS property to (initial, final) values
$duration: transition duration
$easing: transition easing function
$delay: transition delay
$before: selector text to insert before transition name (often to select self: &)
$after: selector text to insert after transiton name (to select children)
*/
/*
A mixin to generate the classes for one phase of a React CSSTransition.
`$phase` must be `appear` or `enter` or `exit`.
If `enter` phase is given then `appear` phase will be generated at the same time.
If `exit` phase is given then property values are animated in reverse, from final to initial.

**Example:**
@include react-transition-phase(toast, enter, $enter-translate, $before: "&");
@include react-transition-phase(toast, leave, $leave-blur, $pt-transition-duration * 3, $before: "&");
*/
/*
Given map of properties to values, set each property to the value at the given index.
(remember that sass indices are 1-based).

Example: `each-prop((opacity: 0 1), 2)` will print "opacity: 1"
*/
/*
Format transition class name with all the bits.
"enter" phase will include "appear" phase in returned name.
*/
/*
CSS `border` property issues:
- An element can only have one border.
- Borders can't stack with shadows.
- Borders modify the size of the element they're applied to.
- Border positioning requires the extra `box-sizing` property.

`box-shadow` doesn't have these issues, we're using it instead of `border`.
*/
/*
Overlay shadows are used for default buttons
floating on top of other elements. This way, the
shadows blend with the colors beneath it.
Switches and slider handles both use these variables.
*/
.reui-html-select select,
.reui-select select {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 3px;
  cursor: pointer;
  padding: 5px 10px;
  vertical-align: middle;
  text-align: left;
  font-size: 13px;
  line-height: 1.55;
  box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 -1px 0 rgba(16, 22, 26, 0.2);
  background-color: #ebebeb;
  color: #444;
  border-radius: 0;
  width: 100%;
  height: 30px;
  padding: 0 25px 0 10px;
  -moz-appearance: none;
  -webkit-appearance: none; }
  .reui-html-select select > *, .reui-select select > * {
    flex-grow: 0;
    flex-shrink: 0; }
  .reui-html-select select > .reui-fill, .reui-select select > .reui-fill {
    flex-grow: 1;
    flex-shrink: 1; }
  .reui-html-select select::before,
  .reui-select select::before, .reui-html-select select > *, .reui-select select > * {
    margin-right: 7px; }
  .reui-html-select select:empty::before,
  .reui-select select:empty::before,
  .reui-html-select select > :last-child,
  .reui-select select > :last-child {
    margin-right: 0; }
  .reui-html-select select:after,
  .reui-select select:after {
    content: "d";
    visibility: hidden;
    width: 0;
    max-width: 0;
    overflow: hidden;
    order: 0; }
  
  .reui-html-select select > :last-child,
  .reui-select select > :last-child {
    order: 1; }
  .reui-html-select select:hover,
  .reui-select select:hover {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 -1px 0 rgba(16, 22, 26, 0.2);
    background-clip: padding-box;
    background-color: #f0f0f0; }
  .reui-html-select select:active,
  .reui-select select:active, .reui-html-select select.reui-active,
  .reui-select select.reui-active {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 1px 2px rgba(16, 22, 26, 0.2);
    background-color: #e6e6e6; }
  .reui-html-select select:disabled,
  .reui-select select:disabled, .reui-html-select select.reui-disabled,
  .reui-select select.reui-disabled {
    outline: none;
    box-shadow: none;
    background-color: rgba(222, 222, 222, 0.5);
    cursor: not-allowed;
    color: rgba(128, 128, 128, 0.5); }
    .reui-html-select select:disabled.reui-active,
    .reui-select select:disabled.reui-active, .reui-html-select select:disabled.reui-active:hover,
    .reui-select select:disabled.reui-active:hover, .reui-html-select select.reui-disabled.reui-active,
    .reui-select select.reui-disabled.reui-active, .reui-html-select select.reui-disabled.reui-active:hover,
    .reui-select select.reui-disabled.reui-active:hover {
      background: rgba(222, 222, 222, 0.7); }

.reui-html-select.reui-minimal select,
.reui-select.reui-minimal select {
  box-shadow: none;
  background: none; }
  .reui-html-select.reui-minimal select:hover,
  .reui-select.reui-minimal select:hover {
    box-shadow: none;
    background: rgba(194, 194, 194, 0.3);
    text-decoration: none;
    color: #444; }
  .reui-html-select.reui-minimal select:active,
  .reui-select.reui-minimal select:active, .reui-html-select.reui-minimal select.reui-active,
  .reui-select.reui-minimal select.reui-active {
    box-shadow: none;
    background: rgba(148, 148, 148, 0.3);
    color: #444; }
  .reui-html-select.reui-minimal select:disabled,
  .reui-select.reui-minimal select:disabled, .reui-html-select.reui-minimal select:disabled:hover,
  .reui-select.reui-minimal select:disabled:hover, .reui-html-select.reui-minimal select.reui-disabled,
  .reui-select.reui-minimal select.reui-disabled, .reui-html-select.reui-minimal select.reui-disabled:hover,
  .reui-select.reui-minimal select.reui-disabled:hover {
    background: none;
    cursor: not-allowed;
    color: rgba(128, 128, 128, 0.5); }
    .reui-html-select.reui-minimal select:disabled.reui-active,
    .reui-select.reui-minimal select:disabled.reui-active, .reui-html-select.reui-minimal select:disabled:hover.reui-active,
    .reui-select.reui-minimal select:disabled:hover.reui-active, .reui-html-select.reui-minimal select.reui-disabled.reui-active,
    .reui-select.reui-minimal select.reui-disabled.reui-active, .reui-html-select.reui-minimal select.reui-disabled:hover.reui-active,
    .reui-select.reui-minimal select.reui-disabled:hover.reui-active {
      background: rgba(148, 148, 148, 0.3); }
  .reui-dark .reui-html-select.reui-minimal select, .reui-html-select.reui-minimal .reui-dark select,
  .reui-dark .reui-select.reui-minimal select, .reui-select.reui-minimal .reui-dark select {
    box-shadow: none;
    background: none;
    color: inherit; }
    .reui-dark .reui-html-select.reui-minimal select:hover, .reui-html-select.reui-minimal .reui-dark select:hover,
    .reui-dark .reui-select.reui-minimal select:hover, .reui-select.reui-minimal .reui-dark select:hover, .reui-dark .reui-html-select.reui-minimal select:active, .reui-html-select.reui-minimal .reui-dark select:active,
    .reui-dark .reui-select.reui-minimal select:active, .reui-select.reui-minimal .reui-dark select:active, .reui-dark .reui-html-select.reui-minimal select.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-active,
    .reui-dark .reui-select.reui-minimal select.reui-active, .reui-select.reui-minimal .reui-dark select.reui-active {
      box-shadow: none;
      background: none; }
    .reui-dark .reui-html-select.reui-minimal select:hover, .reui-html-select.reui-minimal .reui-dark select:hover,
    .reui-dark .reui-select.reui-minimal select:hover, .reui-select.reui-minimal .reui-dark select:hover {
      background: rgba(166, 166, 166, 0.15); }
    .reui-dark .reui-html-select.reui-minimal select:active, .reui-html-select.reui-minimal .reui-dark select:active,
    .reui-dark .reui-select.reui-minimal select:active, .reui-select.reui-minimal .reui-dark select:active, .reui-dark .reui-html-select.reui-minimal select.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-active,
    .reui-dark .reui-select.reui-minimal select.reui-active, .reui-select.reui-minimal .reui-dark select.reui-active {
      background: rgba(166, 166, 166, 0.3);
      color: #fafafa; }
    .reui-dark .reui-html-select.reui-minimal select:disabled, .reui-html-select.reui-minimal .reui-dark select:disabled,
    .reui-dark .reui-select.reui-minimal select:disabled, .reui-select.reui-minimal .reui-dark select:disabled, .reui-dark .reui-html-select.reui-minimal select:disabled:hover, .reui-html-select.reui-minimal .reui-dark select:disabled:hover,
    .reui-dark .reui-select.reui-minimal select:disabled:hover, .reui-select.reui-minimal .reui-dark select:disabled:hover, .reui-dark .reui-html-select.reui-minimal select.reui-disabled, .reui-html-select.reui-minimal .reui-dark select.reui-disabled,
    .reui-dark .reui-select.reui-minimal select.reui-disabled, .reui-select.reui-minimal .reui-dark select.reui-disabled, .reui-dark .reui-html-select.reui-minimal select.reui-disabled:hover, .reui-html-select.reui-minimal .reui-dark select.reui-disabled:hover,
    .reui-dark .reui-select.reui-minimal select.reui-disabled:hover, .reui-select.reui-minimal .reui-dark select.reui-disabled:hover {
      background: none;
      cursor: not-allowed;
      color: rgba(212, 212, 212, 0.5); }
      .reui-dark .reui-html-select.reui-minimal select:disabled.reui-active, .reui-html-select.reui-minimal .reui-dark select:disabled.reui-active,
      .reui-dark .reui-select.reui-minimal select:disabled.reui-active, .reui-select.reui-minimal .reui-dark select:disabled.reui-active, .reui-dark .reui-html-select.reui-minimal select:disabled:hover.reui-active, .reui-html-select.reui-minimal .reui-dark select:disabled:hover.reui-active,
      .reui-dark .reui-select.reui-minimal select:disabled:hover.reui-active, .reui-select.reui-minimal .reui-dark select:disabled:hover.reui-active, .reui-dark .reui-html-select.reui-minimal select.reui-disabled.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-disabled.reui-active,
      .reui-dark .reui-select.reui-minimal select.reui-disabled.reui-active, .reui-select.reui-minimal .reui-dark select.reui-disabled.reui-active, .reui-dark .reui-html-select.reui-minimal select.reui-disabled:hover.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-disabled:hover.reui-active,
      .reui-dark .reui-select.reui-minimal select.reui-disabled:hover.reui-active, .reui-select.reui-minimal .reui-dark select.reui-disabled:hover.reui-active {
        background: rgba(166, 166, 166, 0.3); }
  .reui-html-select.reui-minimal select.reui-intent-primary,
  .reui-select.reui-minimal select.reui-intent-primary {
    color: #106ba3; }
    .reui-html-select.reui-minimal select.reui-intent-primary:hover,
    .reui-select.reui-minimal select.reui-intent-primary:hover, .reui-html-select.reui-minimal select.reui-intent-primary:active,
    .reui-select.reui-minimal select.reui-intent-primary:active, .reui-html-select.reui-minimal select.reui-intent-primary.reui-active,
    .reui-select.reui-minimal select.reui-intent-primary.reui-active {
      box-shadow: none;
      background: none;
      color: #106ba3; }
    .reui-html-select.reui-minimal select.reui-intent-primary:hover,
    .reui-select.reui-minimal select.reui-intent-primary:hover {
      background: rgba(19, 124, 189, 0.15);
      color: #106ba3; }
    .reui-html-select.reui-minimal select.reui-intent-primary:active,
    .reui-select.reui-minimal select.reui-intent-primary:active, .reui-html-select.reui-minimal select.reui-intent-primary.reui-active,
    .reui-select.reui-minimal select.reui-intent-primary.reui-active {
      background: rgba(19, 124, 189, 0.3);
      color: #106ba3; }
    .reui-html-select.reui-minimal select.reui-intent-primary:disabled,
    .reui-select.reui-minimal select.reui-intent-primary:disabled, .reui-html-select.reui-minimal select.reui-intent-primary.reui-disabled,
    .reui-select.reui-minimal select.reui-intent-primary.reui-disabled {
      background: none;
      color: rgba(16, 107, 163, 0.5); }
      .reui-html-select.reui-minimal select.reui-intent-primary:disabled.reui-active,
      .reui-select.reui-minimal select.reui-intent-primary:disabled.reui-active, .reui-html-select.reui-minimal select.reui-intent-primary.reui-disabled.reui-active,
      .reui-select.reui-minimal select.reui-intent-primary.reui-disabled.reui-active {
        background: rgba(19, 124, 189, 0.3); }
    .reui-html-select.reui-minimal select.reui-intent-primary .reui-button-spinner .reui-spinner-head, .reui-select.reui-minimal select.reui-intent-primary .reui-button-spinner .reui-spinner-head {
      stroke: #106ba3; }
    .reui-dark .reui-html-select.reui-minimal select.reui-intent-primary, .reui-html-select.reui-minimal .reui-dark select.reui-intent-primary,
    .reui-dark .reui-select.reui-minimal select.reui-intent-primary, .reui-select.reui-minimal .reui-dark select.reui-intent-primary {
      color: #48aff0; }
      .reui-dark .reui-html-select.reui-minimal select.reui-intent-primary:hover, .reui-html-select.reui-minimal .reui-dark select.reui-intent-primary:hover,
      .reui-dark .reui-select.reui-minimal select.reui-intent-primary:hover, .reui-select.reui-minimal .reui-dark select.reui-intent-primary:hover {
        background: rgba(19, 124, 189, 0.2);
        color: #48aff0; }
      .reui-dark .reui-html-select.reui-minimal select.reui-intent-primary:active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-primary:active,
      .reui-dark .reui-select.reui-minimal select.reui-intent-primary:active, .reui-select.reui-minimal .reui-dark select.reui-intent-primary:active, .reui-dark .reui-html-select.reui-minimal select.reui-intent-primary.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-primary.reui-active,
      .reui-dark .reui-select.reui-minimal select.reui-intent-primary.reui-active, .reui-select.reui-minimal .reui-dark select.reui-intent-primary.reui-active {
        background: rgba(19, 124, 189, 0.3);
        color: #48aff0; }
      .reui-dark .reui-html-select.reui-minimal select.reui-intent-primary:disabled, .reui-html-select.reui-minimal .reui-dark select.reui-intent-primary:disabled,
      .reui-dark .reui-select.reui-minimal select.reui-intent-primary:disabled, .reui-select.reui-minimal .reui-dark select.reui-intent-primary:disabled, .reui-dark .reui-html-select.reui-minimal select.reui-intent-primary.reui-disabled, .reui-html-select.reui-minimal .reui-dark select.reui-intent-primary.reui-disabled,
      .reui-dark .reui-select.reui-minimal select.reui-intent-primary.reui-disabled, .reui-select.reui-minimal .reui-dark select.reui-intent-primary.reui-disabled {
        background: none;
        color: rgba(72, 175, 240, 0.5); }
        .reui-dark .reui-html-select.reui-minimal select.reui-intent-primary:disabled.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-primary:disabled.reui-active,
        .reui-dark .reui-select.reui-minimal select.reui-intent-primary:disabled.reui-active, .reui-select.reui-minimal .reui-dark select.reui-intent-primary:disabled.reui-active, .reui-dark .reui-html-select.reui-minimal select.reui-intent-primary.reui-disabled.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-primary.reui-disabled.reui-active,
        .reui-dark .reui-select.reui-minimal select.reui-intent-primary.reui-disabled.reui-active, .reui-select.reui-minimal .reui-dark select.reui-intent-primary.reui-disabled.reui-active {
          background: rgba(19, 124, 189, 0.3); }
  .reui-html-select.reui-minimal select.reui-intent-success,
  .reui-select.reui-minimal select.reui-intent-success {
    color: #0d8050; }
    .reui-html-select.reui-minimal select.reui-intent-success:hover,
    .reui-select.reui-minimal select.reui-intent-success:hover, .reui-html-select.reui-minimal select.reui-intent-success:active,
    .reui-select.reui-minimal select.reui-intent-success:active, .reui-html-select.reui-minimal select.reui-intent-success.reui-active,
    .reui-select.reui-minimal select.reui-intent-success.reui-active {
      box-shadow: none;
      background: none;
      color: #0d8050; }
    .reui-html-select.reui-minimal select.reui-intent-success:hover,
    .reui-select.reui-minimal select.reui-intent-success:hover {
      background: rgba(15, 153, 96, 0.15);
      color: #0d8050; }
    .reui-html-select.reui-minimal select.reui-intent-success:active,
    .reui-select.reui-minimal select.reui-intent-success:active, .reui-html-select.reui-minimal select.reui-intent-success.reui-active,
    .reui-select.reui-minimal select.reui-intent-success.reui-active {
      background: rgba(15, 153, 96, 0.3);
      color: #0d8050; }
    .reui-html-select.reui-minimal select.reui-intent-success:disabled,
    .reui-select.reui-minimal select.reui-intent-success:disabled, .reui-html-select.reui-minimal select.reui-intent-success.reui-disabled,
    .reui-select.reui-minimal select.reui-intent-success.reui-disabled {
      background: none;
      color: rgba(13, 128, 80, 0.5); }
      .reui-html-select.reui-minimal select.reui-intent-success:disabled.reui-active,
      .reui-select.reui-minimal select.reui-intent-success:disabled.reui-active, .reui-html-select.reui-minimal select.reui-intent-success.reui-disabled.reui-active,
      .reui-select.reui-minimal select.reui-intent-success.reui-disabled.reui-active {
        background: rgba(15, 153, 96, 0.3); }
    .reui-html-select.reui-minimal select.reui-intent-success .reui-button-spinner .reui-spinner-head, .reui-select.reui-minimal select.reui-intent-success .reui-button-spinner .reui-spinner-head {
      stroke: #0d8050; }
    .reui-dark .reui-html-select.reui-minimal select.reui-intent-success, .reui-html-select.reui-minimal .reui-dark select.reui-intent-success,
    .reui-dark .reui-select.reui-minimal select.reui-intent-success, .reui-select.reui-minimal .reui-dark select.reui-intent-success {
      color: #3dcc91; }
      .reui-dark .reui-html-select.reui-minimal select.reui-intent-success:hover, .reui-html-select.reui-minimal .reui-dark select.reui-intent-success:hover,
      .reui-dark .reui-select.reui-minimal select.reui-intent-success:hover, .reui-select.reui-minimal .reui-dark select.reui-intent-success:hover {
        background: rgba(15, 153, 96, 0.2);
        color: #3dcc91; }
      .reui-dark .reui-html-select.reui-minimal select.reui-intent-success:active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-success:active,
      .reui-dark .reui-select.reui-minimal select.reui-intent-success:active, .reui-select.reui-minimal .reui-dark select.reui-intent-success:active, .reui-dark .reui-html-select.reui-minimal select.reui-intent-success.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-success.reui-active,
      .reui-dark .reui-select.reui-minimal select.reui-intent-success.reui-active, .reui-select.reui-minimal .reui-dark select.reui-intent-success.reui-active {
        background: rgba(15, 153, 96, 0.3);
        color: #3dcc91; }
      .reui-dark .reui-html-select.reui-minimal select.reui-intent-success:disabled, .reui-html-select.reui-minimal .reui-dark select.reui-intent-success:disabled,
      .reui-dark .reui-select.reui-minimal select.reui-intent-success:disabled, .reui-select.reui-minimal .reui-dark select.reui-intent-success:disabled, .reui-dark .reui-html-select.reui-minimal select.reui-intent-success.reui-disabled, .reui-html-select.reui-minimal .reui-dark select.reui-intent-success.reui-disabled,
      .reui-dark .reui-select.reui-minimal select.reui-intent-success.reui-disabled, .reui-select.reui-minimal .reui-dark select.reui-intent-success.reui-disabled {
        background: none;
        color: rgba(61, 204, 145, 0.5); }
        .reui-dark .reui-html-select.reui-minimal select.reui-intent-success:disabled.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-success:disabled.reui-active,
        .reui-dark .reui-select.reui-minimal select.reui-intent-success:disabled.reui-active, .reui-select.reui-minimal .reui-dark select.reui-intent-success:disabled.reui-active, .reui-dark .reui-html-select.reui-minimal select.reui-intent-success.reui-disabled.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-success.reui-disabled.reui-active,
        .reui-dark .reui-select.reui-minimal select.reui-intent-success.reui-disabled.reui-active, .reui-select.reui-minimal .reui-dark select.reui-intent-success.reui-disabled.reui-active {
          background: rgba(15, 153, 96, 0.3); }
  .reui-html-select.reui-minimal select.reui-intent-warning,
  .reui-select.reui-minimal select.reui-intent-warning {
    color: #bf7326; }
    .reui-html-select.reui-minimal select.reui-intent-warning:hover,
    .reui-select.reui-minimal select.reui-intent-warning:hover, .reui-html-select.reui-minimal select.reui-intent-warning:active,
    .reui-select.reui-minimal select.reui-intent-warning:active, .reui-html-select.reui-minimal select.reui-intent-warning.reui-active,
    .reui-select.reui-minimal select.reui-intent-warning.reui-active {
      box-shadow: none;
      background: none;
      color: #bf7326; }
    .reui-html-select.reui-minimal select.reui-intent-warning:hover,
    .reui-select.reui-minimal select.reui-intent-warning:hover {
      background: rgba(217, 130, 43, 0.15);
      color: #bf7326; }
    .reui-html-select.reui-minimal select.reui-intent-warning:active,
    .reui-select.reui-minimal select.reui-intent-warning:active, .reui-html-select.reui-minimal select.reui-intent-warning.reui-active,
    .reui-select.reui-minimal select.reui-intent-warning.reui-active {
      background: rgba(217, 130, 43, 0.3);
      color: #bf7326; }
    .reui-html-select.reui-minimal select.reui-intent-warning:disabled,
    .reui-select.reui-minimal select.reui-intent-warning:disabled, .reui-html-select.reui-minimal select.reui-intent-warning.reui-disabled,
    .reui-select.reui-minimal select.reui-intent-warning.reui-disabled {
      background: none;
      color: rgba(191, 115, 38, 0.5); }
      .reui-html-select.reui-minimal select.reui-intent-warning:disabled.reui-active,
      .reui-select.reui-minimal select.reui-intent-warning:disabled.reui-active, .reui-html-select.reui-minimal select.reui-intent-warning.reui-disabled.reui-active,
      .reui-select.reui-minimal select.reui-intent-warning.reui-disabled.reui-active {
        background: rgba(217, 130, 43, 0.3); }
    .reui-html-select.reui-minimal select.reui-intent-warning .reui-button-spinner .reui-spinner-head, .reui-select.reui-minimal select.reui-intent-warning .reui-button-spinner .reui-spinner-head {
      stroke: #bf7326; }
    .reui-dark .reui-html-select.reui-minimal select.reui-intent-warning, .reui-html-select.reui-minimal .reui-dark select.reui-intent-warning,
    .reui-dark .reui-select.reui-minimal select.reui-intent-warning, .reui-select.reui-minimal .reui-dark select.reui-intent-warning {
      color: #ffb366; }
      .reui-dark .reui-html-select.reui-minimal select.reui-intent-warning:hover, .reui-html-select.reui-minimal .reui-dark select.reui-intent-warning:hover,
      .reui-dark .reui-select.reui-minimal select.reui-intent-warning:hover, .reui-select.reui-minimal .reui-dark select.reui-intent-warning:hover {
        background: rgba(217, 130, 43, 0.2);
        color: #ffb366; }
      .reui-dark .reui-html-select.reui-minimal select.reui-intent-warning:active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-warning:active,
      .reui-dark .reui-select.reui-minimal select.reui-intent-warning:active, .reui-select.reui-minimal .reui-dark select.reui-intent-warning:active, .reui-dark .reui-html-select.reui-minimal select.reui-intent-warning.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-warning.reui-active,
      .reui-dark .reui-select.reui-minimal select.reui-intent-warning.reui-active, .reui-select.reui-minimal .reui-dark select.reui-intent-warning.reui-active {
        background: rgba(217, 130, 43, 0.3);
        color: #ffb366; }
      .reui-dark .reui-html-select.reui-minimal select.reui-intent-warning:disabled, .reui-html-select.reui-minimal .reui-dark select.reui-intent-warning:disabled,
      .reui-dark .reui-select.reui-minimal select.reui-intent-warning:disabled, .reui-select.reui-minimal .reui-dark select.reui-intent-warning:disabled, .reui-dark .reui-html-select.reui-minimal select.reui-intent-warning.reui-disabled, .reui-html-select.reui-minimal .reui-dark select.reui-intent-warning.reui-disabled,
      .reui-dark .reui-select.reui-minimal select.reui-intent-warning.reui-disabled, .reui-select.reui-minimal .reui-dark select.reui-intent-warning.reui-disabled {
        background: none;
        color: rgba(255, 179, 102, 0.5); }
        .reui-dark .reui-html-select.reui-minimal select.reui-intent-warning:disabled.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-warning:disabled.reui-active,
        .reui-dark .reui-select.reui-minimal select.reui-intent-warning:disabled.reui-active, .reui-select.reui-minimal .reui-dark select.reui-intent-warning:disabled.reui-active, .reui-dark .reui-html-select.reui-minimal select.reui-intent-warning.reui-disabled.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-warning.reui-disabled.reui-active,
        .reui-dark .reui-select.reui-minimal select.reui-intent-warning.reui-disabled.reui-active, .reui-select.reui-minimal .reui-dark select.reui-intent-warning.reui-disabled.reui-active {
          background: rgba(217, 130, 43, 0.3); }
  .reui-html-select.reui-minimal select.reui-intent-danger,
  .reui-select.reui-minimal select.reui-intent-danger {
    color: #c23030; }
    .reui-html-select.reui-minimal select.reui-intent-danger:hover,
    .reui-select.reui-minimal select.reui-intent-danger:hover, .reui-html-select.reui-minimal select.reui-intent-danger:active,
    .reui-select.reui-minimal select.reui-intent-danger:active, .reui-html-select.reui-minimal select.reui-intent-danger.reui-active,
    .reui-select.reui-minimal select.reui-intent-danger.reui-active {
      box-shadow: none;
      background: none;
      color: #c23030; }
    .reui-html-select.reui-minimal select.reui-intent-danger:hover,
    .reui-select.reui-minimal select.reui-intent-danger:hover {
      background: rgba(219, 55, 55, 0.15);
      color: #c23030; }
    .reui-html-select.reui-minimal select.reui-intent-danger:active,
    .reui-select.reui-minimal select.reui-intent-danger:active, .reui-html-select.reui-minimal select.reui-intent-danger.reui-active,
    .reui-select.reui-minimal select.reui-intent-danger.reui-active {
      background: rgba(219, 55, 55, 0.3);
      color: #c23030; }
    .reui-html-select.reui-minimal select.reui-intent-danger:disabled,
    .reui-select.reui-minimal select.reui-intent-danger:disabled, .reui-html-select.reui-minimal select.reui-intent-danger.reui-disabled,
    .reui-select.reui-minimal select.reui-intent-danger.reui-disabled {
      background: none;
      color: rgba(194, 48, 48, 0.5); }
      .reui-html-select.reui-minimal select.reui-intent-danger:disabled.reui-active,
      .reui-select.reui-minimal select.reui-intent-danger:disabled.reui-active, .reui-html-select.reui-minimal select.reui-intent-danger.reui-disabled.reui-active,
      .reui-select.reui-minimal select.reui-intent-danger.reui-disabled.reui-active {
        background: rgba(219, 55, 55, 0.3); }
    .reui-html-select.reui-minimal select.reui-intent-danger .reui-button-spinner .reui-spinner-head, .reui-select.reui-minimal select.reui-intent-danger .reui-button-spinner .reui-spinner-head {
      stroke: #c23030; }
    .reui-dark .reui-html-select.reui-minimal select.reui-intent-danger, .reui-html-select.reui-minimal .reui-dark select.reui-intent-danger,
    .reui-dark .reui-select.reui-minimal select.reui-intent-danger, .reui-select.reui-minimal .reui-dark select.reui-intent-danger {
      color: #ff7373; }
      .reui-dark .reui-html-select.reui-minimal select.reui-intent-danger:hover, .reui-html-select.reui-minimal .reui-dark select.reui-intent-danger:hover,
      .reui-dark .reui-select.reui-minimal select.reui-intent-danger:hover, .reui-select.reui-minimal .reui-dark select.reui-intent-danger:hover {
        background: rgba(219, 55, 55, 0.2);
        color: #ff7373; }
      .reui-dark .reui-html-select.reui-minimal select.reui-intent-danger:active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-danger:active,
      .reui-dark .reui-select.reui-minimal select.reui-intent-danger:active, .reui-select.reui-minimal .reui-dark select.reui-intent-danger:active, .reui-dark .reui-html-select.reui-minimal select.reui-intent-danger.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-danger.reui-active,
      .reui-dark .reui-select.reui-minimal select.reui-intent-danger.reui-active, .reui-select.reui-minimal .reui-dark select.reui-intent-danger.reui-active {
        background: rgba(219, 55, 55, 0.3);
        color: #ff7373; }
      .reui-dark .reui-html-select.reui-minimal select.reui-intent-danger:disabled, .reui-html-select.reui-minimal .reui-dark select.reui-intent-danger:disabled,
      .reui-dark .reui-select.reui-minimal select.reui-intent-danger:disabled, .reui-select.reui-minimal .reui-dark select.reui-intent-danger:disabled, .reui-dark .reui-html-select.reui-minimal select.reui-intent-danger.reui-disabled, .reui-html-select.reui-minimal .reui-dark select.reui-intent-danger.reui-disabled,
      .reui-dark .reui-select.reui-minimal select.reui-intent-danger.reui-disabled, .reui-select.reui-minimal .reui-dark select.reui-intent-danger.reui-disabled {
        background: none;
        color: rgba(255, 115, 115, 0.5); }
        .reui-dark .reui-html-select.reui-minimal select.reui-intent-danger:disabled.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-danger:disabled.reui-active,
        .reui-dark .reui-select.reui-minimal select.reui-intent-danger:disabled.reui-active, .reui-select.reui-minimal .reui-dark select.reui-intent-danger:disabled.reui-active, .reui-dark .reui-html-select.reui-minimal select.reui-intent-danger.reui-disabled.reui-active, .reui-html-select.reui-minimal .reui-dark select.reui-intent-danger.reui-disabled.reui-active,
        .reui-dark .reui-select.reui-minimal select.reui-intent-danger.reui-disabled.reui-active, .reui-select.reui-minimal .reui-dark select.reui-intent-danger.reui-disabled.reui-active {
          background: rgba(219, 55, 55, 0.3); }

.reui-html-select.reui-large select,
.reui-select.reui-large select {
  height: 40px;
  padding-right: 35px;
  font-size: 16px; }

.reui-dark .reui-html-select select, .reui-dark .reui-select select {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4);
  background-color: #575757;
  color: #fafafa; }
  .reui-dark .reui-html-select select:hover, .reui-dark .reui-select select:hover, .reui-dark .reui-html-select select:active, .reui-dark .reui-select select:active, .reui-dark .reui-html-select select.reui-active, .reui-dark .reui-select select.reui-active {
    color: #fafafa; }
  .reui-dark .reui-html-select select:hover, .reui-dark .reui-select select:hover {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4);
    background-color: #4d4d4d; }
  .reui-dark .reui-html-select select:active, .reui-dark .reui-select select:active, .reui-dark .reui-html-select select.reui-active, .reui-dark .reui-select select.reui-active {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.6), inset 0 1px 2px rgba(16, 22, 26, 0.2);
    background-color: #333333; }
  .reui-dark .reui-html-select select:disabled, .reui-dark .reui-select select:disabled, .reui-dark .reui-html-select select.reui-disabled, .reui-dark .reui-select select.reui-disabled {
    box-shadow: none;
    background-color: rgba(87, 87, 87, 0.5);
    color: rgba(212, 212, 212, 0.5); }
    .reui-dark .reui-html-select select:disabled.reui-active, .reui-dark .reui-select select:disabled.reui-active, .reui-dark .reui-html-select select.reui-disabled.reui-active, .reui-dark .reui-select select.reui-disabled.reui-active {
      background: rgba(87, 87, 87, 0.7); }
  .reui-dark .reui-html-select select .reui-button-spinner .reui-spinner-head, .reui-dark .reui-select select .reui-button-spinner .reui-spinner-head {
    background: rgba(16, 22, 26, 0.5);
    stroke: #a6a6a6; }

.reui-html-select select:disabled,
.reui-select select:disabled {
  box-shadow: none;
  background-color: rgba(222, 222, 222, 0.5);
  cursor: not-allowed;
  color: rgba(128, 128, 128, 0.5); }

.reui-html-select .reui-icon,
.reui-select .reui-icon, .reui-select::after {
  position: absolute;
  top: 7px;
  right: 7px;
  color: #808080;
  pointer-events: none; }
  .reui-html-select .reui-disabled.reui-icon,
  .reui-select .reui-disabled.reui-icon, .reui-disabled.reui-select::after {
    color: rgba(128, 128, 128, 0.5); }

/*
HTML select

Markup:
<div class="reui-select {{.modifier}}">
  <select {{:modifier}}>
    <option selected>Choose an item...</option>
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option>
  </select>
</div>

:disabled - Disabled. Also add <code>.reui-disabled</code> to <code>.reui-select</code> for icon coloring (not shown below).
.reui-fill - Expand to fill parent container
.reui-large - Large size
.reui-minimal - Minimal appearance

Styleguide select
*/
.reui-html-select,
.reui-select {
  display: inline-block;
  position: relative;
  vertical-align: middle;
  letter-spacing: normal; }
  .reui-html-select select::-ms-expand,
  .reui-select select::-ms-expand {
    display: none; }
  .reui-html-select .reui-icon,
  .reui-select .reui-icon {
    color: #808080; }
    .reui-html-select .reui-icon:hover,
    .reui-select .reui-icon:hover {
      color: #444; }
    .reui-dark .reui-html-select .reui-icon, .reui-dark
    .reui-select .reui-icon {
      color: #d4d4d4; }
      .reui-dark .reui-html-select .reui-icon:hover, .reui-dark
      .reui-select .reui-icon:hover {
        color: #fafafa; }
  .reui-html-select.reui-large::after,
  .reui-html-select.reui-large .reui-icon,
  .reui-select.reui-large::after,
  .reui-select.reui-large .reui-icon {
    top: 12px;
    right: 12px; }
  .reui-html-select.reui-fill,
  .reui-html-select.reui-fill select,
  .reui-select.reui-fill,
  .reui-select.reui-fill select {
    width: 100%; }
  .reui-dark .reui-html-select option, .reui-dark
  .reui-select option {
    background-color: #4d4d4d;
    color: #fafafa; }
  .reui-dark .reui-html-select::after, .reui-dark
  .reui-select::after {
    color: #d4d4d4; }

.reui-select::after {
  line-height: 1;
  font-family: "Icons16", sans-serif;
  font-size: 16px;
  font-weight: 400;
  font-style: normal;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  content: ""; }

/*
Tables

Markup:
<table class="reui-html-table {{.modifier}}">
  <thead>
    <tr>
      <th>Project</th>
      <th>Description</th>
      <th>Technologies</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Blueprint</td>
      <td>CSS framework and UI toolkit</td>
      <td>Sass, TypeScript, React</td>
    </tr>
    <tr>
      <td>TSLint</td>
      <td>Static analysis linter for TypeScript</td>
      <td>TypeScript</td>
    </tr>
    <tr>
      <td>Plottable</td>
      <td>Composable charting library built on top of D3</td>
      <td>SVG, TypeScript, D3</td>
    </tr>
  </tbody>
</table>

.reui-small - Small, condensed appearance
.reui-html-table-striped - Striped appearance
.reui-html-table-bordered - Bordered appearance
.reui-interactive - Enables hover styles on rows

Styleguide html-table
*/
.reui-running-text table, table.reui-html-table {
  border-spacing: 0;
  font-size: 13px;
  width: 100%; }
  .reui-running-text table th, table.reui-html-table th,
  .reui-running-text table td,
  table.reui-html-table td {
    padding: 9px;
    vertical-align: top;
    text-align: left; }
  .reui-running-text table th, table.reui-html-table th {
    position: relative;
    color: #444;
    font-weight: inherit;
    vertical-align: bottom;
    box-shadow: 0 1px 0 0 rgba(16, 22, 26, 0.175); }
    .reui-dark .reui-running-text table th, .reui-running-text .reui-dark table th, .reui-dark table.reui-html-table th {
      box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.15); }
    .reui-running-text table th:not(:last-child):after, table.reui-html-table th:not(:last-child):after {
      position: absolute;
      right: 0;
      top: 5px;
      bottom: 5px;
      content: "";
      width: 1px;
      box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.175); }
      .reui-dark .reui-running-text table th:not(:last-child):after, .reui-running-text .reui-dark table th:not(:last-child):after, .reui-dark table.reui-html-table th:not(:last-child):after {
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15); }
  
  .reui-running-text table td,
  table.reui-html-table td {
    color: #444; }
  .reui-dark .reui-running-text table th, .reui-running-text .reui-dark table th, .reui-dark table.reui-html-table th {
    color: #fafafa; }
  .reui-dark .reui-running-text table td, .reui-running-text .reui-dark table td, .reui-dark table.reui-html-table td {
    color: #fafafa; }

table.reui-html-table.reui-small th,
table.reui-html-table.reui-small td {
  padding-top: 6px;
  padding-bottom: 6px; }

table.reui-html-table.reui-html-table-striped tbody tr:nth-child(odd) td {
  background: rgba(212, 212, 212, 0.15); }

table.reui-html-table.reui-html-table-border {
  box-shadow: 0 1px 0 0 rgba(16, 22, 26, 0.175), 1px 0 0 0 rgba(16, 22, 26, 0.175), -1px 0 0 0 rgba(16, 22, 26, 0.175); }
  .reui-dark table.reui-html-table.reui-html-table-border {
    box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.15), 1px 0 0 0 rgba(255, 255, 255, 0.15), -1px 0 0 0 rgba(255, 255, 255, 0.15); }

table.reui-html-table.reui-html-table-bordered tbody tr:not(:last-child) td {
  position: relative; }
  table.reui-html-table.reui-html-table-bordered tbody tr:not(:last-child) td:after {
    position: absolute;
    right: 5px;
    bottom: 0;
    left: 5px;
    content: "";
    height: 1px;
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.15); }
    .reui-dark table.reui-html-table.reui-html-table-bordered tbody tr:not(:last-child) td:after {
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15); }

table.reui-html-table tr.reui-html-table-row-header {
  background-color: rgba(250, 250, 250, 0.3); }
  .reui-dark table.reui-html-table tr.reui-html-table-row-header {
    background-color: rgba(87, 87, 87, 0.3); }
  table.reui-html-table tr.reui-html-table-row-header:hover td {
    background-color: rgba(212, 212, 212, 0.3); }
  table.reui-html-table tr.reui-html-table-row-header:active td {
    background-color: rgba(212, 212, 212, 0.4); }

table.reui-html-table.reui-interactive tbody tr:hover td {
  background-color: rgba(212, 212, 212, 0.3);
  cursor: pointer; }

table.reui-html-table.reui-interactive tbody tr:active td {
  background-color: rgba(212, 212, 212, 0.4); }

.reui-dark table.reui-html-table.reui-html-table-striped tbody tr:nth-child(odd) td {
  background: rgba(128, 128, 128, 0.15); }

.reui-dark table.reui-html-table.reui-html-table-bordered th:not(:first-child) {
  box-shadow: inset 1px 0 0 0 rgba(255, 255, 255, 0.15); }

.reui-dark table.reui-html-table.reui-html-table-bordered tbody tr td {
  box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.15); }
  .reui-dark table.reui-html-table.reui-html-table-bordered tbody tr td:not(:first-child) {
    box-shadow: inset 1px 1px 0 0 rgba(255, 255, 255, 0.15); }

.reui-dark table.reui-html-table.reui-html-table-bordered.reui-html-table-striped tbody tr:not(:first-child) td {
  box-shadow: inset 1px 0 0 0 rgba(255, 255, 255, 0.15); }
  .reui-dark table.reui-html-table.reui-html-table-bordered.reui-html-table-striped tbody tr:not(:first-child) td:first-child {
    box-shadow: none; }

.reui-dark table.reui-html-table.reui-interactive tbody tr:hover td {
  background-color: rgba(128, 128, 128, 0.3);
  cursor: pointer; }

.reui-dark table.reui-html-table.reui-interactive tbody tr:active td {
  background-color: rgba(128, 128, 128, 0.4); }

.reui-key-combo .reui-key:not(:last-child) {
  margin-right: 5px; }

.reui-hotkey-dialog {
  top: 40px;
  padding-bottom: 0; }
  .reui-hotkey-dialog .reui-dialog-body {
    margin: 0;
    padding: 0; }
  .reui-hotkey-dialog .reui-hotkey-label {
    flex-grow: 1; }

.reui-hotkey-column {
  margin: auto;
  max-height: 80vh;
  overflow-y: auto;
  padding: 30px; }
  .reui-hotkey-column .reui-heading {
    margin-bottom: 20px; }
    .reui-hotkey-column .reui-heading:not(:first-child) {
      margin-top: 40px; }

.reui-hotkey {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-right: 0;
  margin-left: 0; }
  .reui-hotkey:not(:last-child) {
    margin-bottom: 10px; }

.reui-icon, .reui-icon-standard, .reui-icon-large {
  display: inline-block; }
  .reui-icon.reui-intent-primary, .reui-icon-standard.reui-intent-primary, .reui-icon-large.reui-intent-primary {
    color: #106ba3; }
    .reui-dark .reui-icon.reui-intent-primary, .reui-dark .reui-icon-standard.reui-intent-primary, .reui-dark .reui-icon-large.reui-intent-primary {
      color: #48aff0; }
  .reui-icon.reui-intent-success, .reui-icon-standard.reui-intent-success, .reui-icon-large.reui-intent-success {
    color: #0d8050; }
    .reui-dark .reui-icon.reui-intent-success, .reui-dark .reui-icon-standard.reui-intent-success, .reui-dark .reui-icon-large.reui-intent-success {
      color: #3dcc91; }
  .reui-icon.reui-intent-warning, .reui-icon-standard.reui-intent-warning, .reui-icon-large.reui-intent-warning {
    color: #bf7326; }
    .reui-dark .reui-icon.reui-intent-warning, .reui-dark .reui-icon-standard.reui-intent-warning, .reui-dark .reui-icon-large.reui-intent-warning {
      color: #ffb366; }
  .reui-icon.reui-intent-danger, .reui-icon-standard.reui-intent-danger, .reui-icon-large.reui-intent-danger {
    color: #c23030; }
    .reui-dark .reui-icon.reui-intent-danger, .reui-dark .reui-icon-standard.reui-intent-danger, .reui-dark .reui-icon-large.reui-intent-danger {
      color: #ff7373; }

span.reui-icon-standard {
  line-height: 1;
  font-family: "Icons16", sans-serif;
  font-size: 16px;
  font-weight: 400;
  font-style: normal;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased; }

span.reui-icon-large {
  line-height: 1;
  font-family: "Icons20", sans-serif;
  font-size: 20px;
  font-weight: 400;
  font-style: normal;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased; }

span.reui-icon {
  line-height: 1;
  font-family: "Icons20";
  font-size: inherit;
  font-weight: 400;
  font-style: normal; }
  span.reui-icon::before {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased; }

.reui-icon-add::before {
  content: ""; }

.reui-icon-add-column-left::before {
  content: ""; }

.reui-icon-add-column-right::before {
  content: ""; }

.reui-icon-add-row-bottom::before {
  content: ""; }

.reui-icon-add-row-top::before {
  content: ""; }

.reui-icon-add-to-artifact::before {
  content: ""; }

.reui-icon-add-to-folder::before {
  content: ""; }

.reui-icon-airplane::before {
  content: ""; }

.reui-icon-align-center::before {
  content: ""; }

.reui-icon-align-justify::before {
  content: ""; }

.reui-icon-align-left::before {
  content: ""; }

.reui-icon-align-right::before {
  content: ""; }

.reui-icon-alignment-bottom::before {
  content: ""; }

.reui-icon-alignment-horizontal-center::before {
  content: ""; }

.reui-icon-alignment-left::before {
  content: ""; }

.reui-icon-alignment-right::before {
  content: ""; }

.reui-icon-alignment-top::before {
  content: ""; }

.reui-icon-alignment-vertical-center::before {
  content: ""; }

.reui-icon-annotation::before {
  content: ""; }

.reui-icon-application::before {
  content: ""; }

.reui-icon-applications::before {
  content: ""; }

.reui-icon-arrow-bottom-left::before {
  content: "↙"; }

.reui-icon-arrow-bottom-right::before {
  content: "↘"; }

.reui-icon-arrow-down::before {
  content: "↓"; }

.reui-icon-arrow-left::before {
  content: "←"; }

.reui-icon-arrow-right::before {
  content: "→"; }

.reui-icon-arrow-top-left::before {
  content: "↖"; }

.reui-icon-arrow-top-right::before {
  content: "↗"; }

.reui-icon-arrow-up::before {
  content: "↑"; }

.reui-icon-arrows-horizontal::before {
  content: "↔"; }

.reui-icon-arrows-vertical::before {
  content: "↕"; }

.reui-icon-asterisk::before {
  content: "*"; }

.reui-icon-automatic-updates::before {
  content: ""; }

.reui-icon-badge::before {
  content: ""; }

.reui-icon-ban-circle::before {
  content: ""; }

.reui-icon-bank-account::before {
  content: ""; }

.reui-icon-barcode::before {
  content: ""; }

.reui-icon-blank::before {
  content: ""; }

.reui-icon-blocked-person::before {
  content: ""; }

.reui-icon-bold::before {
  content: ""; }

.reui-icon-book::before {
  content: ""; }

.reui-icon-bookmark::before {
  content: ""; }

.reui-icon-box::before {
  content: ""; }

.reui-icon-briefcase::before {
  content: ""; }

.reui-icon-build::before {
  content: ""; }

.reui-icon-calculator::before {
  content: ""; }

.reui-icon-calendar::before {
  content: ""; }

.reui-icon-camera::before {
  content: ""; }

.reui-icon-caret-down::before {
  content: "⌄"; }

.reui-icon-caret-left::before {
  content: "〈"; }

.reui-icon-caret-right::before {
  content: "〉"; }

.reui-icon-caret-up::before {
  content: "⌃"; }

.reui-icon-cell-tower::before {
  content: ""; }

.reui-icon-changes::before {
  content: ""; }

.reui-icon-chart::before {
  content: ""; }

.reui-icon-chat::before {
  content: ""; }

.reui-icon-chevron-backward::before {
  content: ""; }

.reui-icon-chevron-down::before {
  content: ""; }

.reui-icon-chevron-forward::before {
  content: ""; }

.reui-icon-chevron-left::before {
  content: ""; }

.reui-icon-chevron-right::before {
  content: ""; }

.reui-icon-chevron-up::before {
  content: ""; }

.reui-icon-circle::before {
  content: ""; }

.reui-icon-circle-arrow-down::before {
  content: ""; }

.reui-icon-circle-arrow-left::before {
  content: ""; }

.reui-icon-circle-arrow-right::before {
  content: ""; }

.reui-icon-circle-arrow-up::before {
  content: ""; }

.reui-icon-citation::before {
  content: ""; }

.reui-icon-clipboard::before {
  content: ""; }

.reui-icon-cloud::before {
  content: "☁"; }

.reui-icon-cloud-download::before {
  content: ""; }

.reui-icon-cloud-upload::before {
  content: ""; }

.reui-icon-code::before {
  content: ""; }

.reui-icon-code-block::before {
  content: ""; }

.reui-icon-cog::before {
  content: ""; }

.reui-icon-collapse-all::before {
  content: ""; }

.reui-icon-column-layout::before {
  content: ""; }

.reui-icon-comment::before {
  content: ""; }

.reui-icon-comparison::before {
  content: ""; }

.reui-icon-compass::before {
  content: ""; }

.reui-icon-compressed::before {
  content: ""; }

.reui-icon-confirm::before {
  content: ""; }

.reui-icon-console::before {
  content: ""; }

.reui-icon-contrast::before {
  content: ""; }

.reui-icon-control::before {
  content: ""; }

.reui-icon-credit-card::before {
  content: ""; }

.reui-icon-cross::before {
  content: "✗"; }

.reui-icon-crown::before {
  content: ""; }

.reui-icon-curved-range-chart::before {
  content: ""; }

.reui-icon-cut::before {
  content: ""; }

.reui-icon-dashboard::before {
  content: ""; }

.reui-icon-database::before {
  content: ""; }

.reui-icon-delete::before {
  content: ""; }

.reui-icon-delta::before {
  content: "Δ"; }

.reui-icon-derive-column::before {
  content: ""; }

.reui-icon-desktop::before {
  content: ""; }

.reui-icon-diagram-tree::before {
  content: ""; }

.reui-icon-direction-left::before {
  content: ""; }

.reui-icon-direction-right::before {
  content: ""; }

.reui-icon-disable::before {
  content: ""; }

.reui-icon-document::before {
  content: ""; }

.reui-icon-document-open::before {
  content: ""; }

.reui-icon-document-share::before {
  content: ""; }

.reui-icon-dollar::before {
  content: "$"; }

.reui-icon-dot::before {
  content: "•"; }

.reui-icon-double-caret-horizontal::before {
  content: ""; }

.reui-icon-double-caret-vertical::before {
  content: ""; }

.reui-icon-double-chevron-down::before {
  content: ""; }

.reui-icon-double-chevron-left::before {
  content: ""; }

.reui-icon-double-chevron-right::before {
  content: ""; }

.reui-icon-double-chevron-up::before {
  content: ""; }

.reui-icon-doughnut-chart::before {
  content: ""; }

.reui-icon-download::before {
  content: ""; }

.reui-icon-drag-handle-horizontal::before {
  content: ""; }

.reui-icon-drag-handle-vertical::before {
  content: ""; }

.reui-icon-draw::before {
  content: ""; }

.reui-icon-drive-time::before {
  content: ""; }

.reui-icon-duplicate::before {
  content: ""; }

.reui-icon-edit::before {
  content: "✎"; }

.reui-icon-eject::before {
  content: "⏏"; }

.reui-icon-endorsed::before {
  content: ""; }

.reui-icon-envelope::before {
  content: "✉"; }

.reui-icon-eraser::before {
  content: ""; }

.reui-icon-error::before {
  content: ""; }

.reui-icon-euro::before {
  content: "€"; }

.reui-icon-exchange::before {
  content: ""; }

.reui-icon-exclude-row::before {
  content: ""; }

.reui-icon-expand-all::before {
  content: ""; }

.reui-icon-export::before {
  content: ""; }

.reui-icon-eye-off::before {
  content: ""; }

.reui-icon-eye-on::before {
  content: ""; }

.reui-icon-eye-open::before {
  content: ""; }

.reui-icon-fast-backward::before {
  content: ""; }

.reui-icon-fast-forward::before {
  content: ""; }

.reui-icon-feed::before {
  content: ""; }

.reui-icon-feed-subscribed::before {
  content: ""; }

.reui-icon-film::before {
  content: ""; }

.reui-icon-filter::before {
  content: ""; }

.reui-icon-filter-keep::before {
  content: ""; }

.reui-icon-filter-list::before {
  content: ""; }

.reui-icon-filter-remove::before {
  content: ""; }

.reui-icon-flag::before {
  content: "⚑"; }

.reui-icon-flame::before {
  content: ""; }

.reui-icon-flash::before {
  content: ""; }

.reui-icon-floppy-disk::before {
  content: ""; }

.reui-icon-flows::before {
  content: ""; }

.reui-icon-folder-close::before {
  content: ""; }

.reui-icon-folder-new::before {
  content: ""; }

.reui-icon-folder-open::before {
  content: ""; }

.reui-icon-folder-shared::before {
  content: ""; }

.reui-icon-folder-shared-open::before {
  content: ""; }

.reui-icon-follower::before {
  content: ""; }

.reui-icon-following::before {
  content: ""; }

.reui-icon-font::before {
  content: ""; }

.reui-icon-fork::before {
  content: ""; }

.reui-icon-form::before {
  content: ""; }

.reui-icon-full-circle::before {
  content: ""; }

.reui-icon-full-stacked-chart::before {
  content: ""; }

.reui-icon-fullscreen::before {
  content: ""; }

.reui-icon-function::before {
  content: ""; }

.reui-icon-gantt-chart::before {
  content: ""; }

.reui-icon-geolocation::before {
  content: ""; }

.reui-icon-geosearch::before {
  content: ""; }

.reui-icon-git-branch::before {
  content: ""; }

.reui-icon-git-commit::before {
  content: ""; }

.reui-icon-git-merge::before {
  content: ""; }

.reui-icon-git-new-branch::before {
  content: ""; }

.reui-icon-git-pull::before {
  content: ""; }

.reui-icon-git-push::before {
  content: ""; }

.reui-icon-git-repo::before {
  content: ""; }

.reui-icon-glass::before {
  content: ""; }

.reui-icon-globe::before {
  content: ""; }

.reui-icon-globe-network::before {
  content: ""; }

.reui-icon-graph::before {
  content: ""; }

.reui-icon-graph-remove::before {
  content: ""; }

.reui-icon-grid::before {
  content: ""; }

.reui-icon-grid-view::before {
  content: ""; }

.reui-icon-group-objects::before {
  content: ""; }

.reui-icon-grouped-bar-chart::before {
  content: ""; }

.reui-icon-hand::before {
  content: ""; }

.reui-icon-hand-down::before {
  content: ""; }

.reui-icon-hand-left::before {
  content: ""; }

.reui-icon-hand-right::before {
  content: ""; }

.reui-icon-hand-up::before {
  content: ""; }

.reui-icon-header::before {
  content: ""; }

.reui-icon-header-one::before {
  content: ""; }

.reui-icon-header-two::before {
  content: ""; }

.reui-icon-headset::before {
  content: ""; }

.reui-icon-heart::before {
  content: "♥"; }

.reui-icon-heart-broken::before {
  content: ""; }

.reui-icon-heat-grid::before {
  content: ""; }

.reui-icon-heatmap::before {
  content: ""; }

.reui-icon-help::before {
  content: "?"; }

.reui-icon-helper-management::before {
  content: ""; }

.reui-icon-highlight::before {
  content: ""; }

.reui-icon-history::before {
  content: ""; }

.reui-icon-home::before {
  content: "⌂"; }

.reui-icon-horizontal-bar-chart::before {
  content: ""; }

.reui-icon-horizontal-bar-chart-asc::before {
  content: ""; }

.reui-icon-horizontal-bar-chart-desc::before {
  content: ""; }

.reui-icon-horizontal-distribution::before {
  content: ""; }

.reui-icon-id-number::before {
  content: ""; }

.reui-icon-image-rotate-left::before {
  content: ""; }

.reui-icon-image-rotate-right::before {
  content: ""; }

.reui-icon-import::before {
  content: ""; }

.reui-icon-inbox::before {
  content: ""; }

.reui-icon-info-sign::before {
  content: "ℹ"; }

.reui-icon-inner-join::before {
  content: ""; }

.reui-icon-insert::before {
  content: ""; }

.reui-icon-intersection::before {
  content: ""; }

.reui-icon-ip-address::before {
  content: ""; }

.reui-icon-issue::before {
  content: ""; }

.reui-icon-issue-closed::before {
  content: ""; }

.reui-icon-issue-new::before {
  content: ""; }

.reui-icon-italic::before {
  content: ""; }

.reui-icon-join-table::before {
  content: ""; }

.reui-icon-key::before {
  content: ""; }

.reui-icon-key-backspace::before {
  content: ""; }

.reui-icon-key-command::before {
  content: ""; }

.reui-icon-key-control::before {
  content: ""; }

.reui-icon-key-delete::before {
  content: ""; }

.reui-icon-key-enter::before {
  content: ""; }

.reui-icon-key-escape::before {
  content: ""; }

.reui-icon-key-option::before {
  content: ""; }

.reui-icon-key-shift::before {
  content: ""; }

.reui-icon-key-tab::before {
  content: ""; }

.reui-icon-known-vehicle::before {
  content: ""; }

.reui-icon-label::before {
  content: ""; }

.reui-icon-layer::before {
  content: ""; }

.reui-icon-layers::before {
  content: ""; }

.reui-icon-layout::before {
  content: ""; }

.reui-icon-layout-auto::before {
  content: ""; }

.reui-icon-layout-balloon::before {
  content: ""; }

.reui-icon-layout-circle::before {
  content: ""; }

.reui-icon-layout-grid::before {
  content: ""; }

.reui-icon-layout-group-by::before {
  content: ""; }

.reui-icon-layout-hierarchy::before {
  content: ""; }

.reui-icon-layout-linear::before {
  content: ""; }

.reui-icon-layout-skew-grid::before {
  content: ""; }

.reui-icon-layout-sorted-clusters::before {
  content: ""; }

.reui-icon-left-join::before {
  content: ""; }

.reui-icon-lightbulb::before {
  content: ""; }

.reui-icon-link::before {
  content: ""; }

.reui-icon-list::before {
  content: "☰"; }

.reui-icon-list-detail-view::before {
  content: ""; }

.reui-icon-locate::before {
  content: ""; }

.reui-icon-lock::before {
  content: ""; }

.reui-icon-log-in::before {
  content: ""; }

.reui-icon-log-out::before {
  content: ""; }

.reui-icon-manual::before {
  content: ""; }

.reui-icon-manually-entered-data::before {
  content: ""; }

.reui-icon-map::before {
  content: ""; }

.reui-icon-map-create::before {
  content: ""; }

.reui-icon-map-marker::before {
  content: ""; }

.reui-icon-maximize::before {
  content: ""; }

.reui-icon-media::before {
  content: ""; }

.reui-icon-menu::before {
  content: ""; }

.reui-icon-menu-closed::before {
  content: ""; }

.reui-icon-menu-open::before {
  content: ""; }

.reui-icon-merge-columns::before {
  content: ""; }

.reui-icon-merge-links::before {
  content: ""; }

.reui-icon-minimize::before {
  content: ""; }

.reui-icon-minus::before {
  content: "−"; }

.reui-icon-mobile-phone::before {
  content: ""; }

.reui-icon-mobile-video::before {
  content: ""; }

.reui-icon-moon::before {
  content: ""; }

.reui-icon-more::before {
  content: ""; }

.reui-icon-mountain::before {
  content: ""; }

.reui-icon-move::before {
  content: ""; }

.reui-icon-mugshot::before {
  content: ""; }

.reui-icon-multi-select::before {
  content: ""; }

.reui-icon-music::before {
  content: ""; }

.reui-icon-new-grid-item::before {
  content: ""; }

.reui-icon-new-link::before {
  content: ""; }

.reui-icon-new-object::before {
  content: ""; }

.reui-icon-new-person::before {
  content: ""; }

.reui-icon-new-prescription::before {
  content: ""; }

.reui-icon-new-text-box::before {
  content: ""; }

.reui-icon-ninja::before {
  content: ""; }

.reui-icon-notifications::before {
  content: ""; }

.reui-icon-notifications-updated::before {
  content: ""; }

.reui-icon-numbered-list::before {
  content: ""; }

.reui-icon-numerical::before {
  content: ""; }

.reui-icon-office::before {
  content: ""; }

.reui-icon-offline::before {
  content: ""; }

.reui-icon-oil-field::before {
  content: ""; }

.reui-icon-one-column::before {
  content: ""; }

.reui-icon-outdated::before {
  content: ""; }

.reui-icon-page-layout::before {
  content: ""; }

.reui-icon-panel-stats::before {
  content: ""; }

.reui-icon-panel-table::before {
  content: ""; }

.reui-icon-paperclip::before {
  content: ""; }

.reui-icon-paragraph::before {
  content: ""; }

.reui-icon-path::before {
  content: ""; }

.reui-icon-path-search::before {
  content: ""; }

.reui-icon-pause::before {
  content: ""; }

.reui-icon-people::before {
  content: ""; }

.reui-icon-percentage::before {
  content: ""; }

.reui-icon-person::before {
  content: ""; }

.reui-icon-phone::before {
  content: "☎"; }

.reui-icon-pie-chart::before {
  content: ""; }

.reui-icon-pin::before {
  content: ""; }

.reui-icon-pivot::before {
  content: ""; }

.reui-icon-pivot-table::before {
  content: ""; }

.reui-icon-play::before {
  content: ""; }

.reui-icon-plus::before {
  content: "+"; }

.reui-icon-polygon-filter::before {
  content: ""; }

.reui-icon-power::before {
  content: ""; }

.reui-icon-predictive-analysis::before {
  content: ""; }

.reui-icon-prescription::before {
  content: ""; }

.reui-icon-presentation::before {
  content: ""; }

.reui-icon-print::before {
  content: "⎙"; }

.reui-icon-projects::before {
  content: ""; }

.reui-icon-properties::before {
  content: ""; }

.reui-icon-property::before {
  content: ""; }

.reui-icon-publish-function::before {
  content: ""; }

.reui-icon-pulse::before {
  content: ""; }

.reui-icon-random::before {
  content: ""; }

.reui-icon-record::before {
  content: ""; }

.reui-icon-redo::before {
  content: ""; }

.reui-icon-refresh::before {
  content: ""; }

.reui-icon-regression-chart::before {
  content: ""; }

.reui-icon-remove::before {
  content: ""; }

.reui-icon-remove-column::before {
  content: ""; }

.reui-icon-remove-column-left::before {
  content: ""; }

.reui-icon-remove-column-right::before {
  content: ""; }

.reui-icon-remove-row-bottom::before {
  content: ""; }

.reui-icon-remove-row-top::before {
  content: ""; }

.reui-icon-repeat::before {
  content: ""; }

.reui-icon-resolve::before {
  content: ""; }

.reui-icon-rig::before {
  content: ""; }

.reui-icon-right-join::before {
  content: ""; }

.reui-icon-ring::before {
  content: ""; }

.reui-icon-rotate-document::before {
  content: ""; }

.reui-icon-rotate-page::before {
  content: ""; }

.reui-icon-satellite::before {
  content: ""; }

.reui-icon-saved::before {
  content: ""; }

.reui-icon-scatter-plot::before {
  content: ""; }

.reui-icon-search::before {
  content: ""; }

.reui-icon-search-around::before {
  content: ""; }

.reui-icon-search-template::before {
  content: ""; }

.reui-icon-search-text::before {
  content: ""; }

.reui-icon-segmented-control::before {
  content: ""; }

.reui-icon-select::before {
  content: ""; }

.reui-icon-selection::before {
  content: "⦿"; }

.reui-icon-send-to::before {
  content: ""; }

.reui-icon-send-to-graph::before {
  content: ""; }

.reui-icon-send-to-map::before {
  content: ""; }

.reui-icon-series-add::before {
  content: ""; }

.reui-icon-series-configuration::before {
  content: ""; }

.reui-icon-series-derived::before {
  content: ""; }

.reui-icon-series-filtered::before {
  content: ""; }

.reui-icon-series-search::before {
  content: ""; }

.reui-icon-settings::before {
  content: ""; }

.reui-icon-share::before {
  content: ""; }

.reui-icon-shield::before {
  content: ""; }

.reui-icon-shop::before {
  content: ""; }

.reui-icon-shopping-cart::before {
  content: ""; }

.reui-icon-sim-card::before {
  content: ""; }

.reui-icon-slash::before {
  content: ""; }

.reui-icon-small-cross::before {
  content: ""; }

.reui-icon-small-minus::before {
  content: ""; }

.reui-icon-small-plus::before {
  content: ""; }

.reui-icon-small-tick::before {
  content: ""; }

.reui-icon-snowflake::before {
  content: ""; }

.reui-icon-social-media::before {
  content: ""; }

.reui-icon-sort::before {
  content: ""; }

.reui-icon-sort-alphabetical::before {
  content: ""; }

.reui-icon-sort-alphabetical-desc::before {
  content: ""; }

.reui-icon-sort-asc::before {
  content: ""; }

.reui-icon-sort-desc::before {
  content: ""; }

.reui-icon-sort-numerical::before {
  content: ""; }

.reui-icon-sort-numerical-desc::before {
  content: ""; }

.reui-icon-split-columns::before {
  content: ""; }

.reui-icon-square::before {
  content: ""; }

.reui-icon-stacked-chart::before {
  content: ""; }

.reui-icon-star::before {
  content: "★"; }

.reui-icon-star-empty::before {
  content: "☆"; }

.reui-icon-step-backward::before {
  content: ""; }

.reui-icon-step-chart::before {
  content: ""; }

.reui-icon-step-forward::before {
  content: ""; }

.reui-icon-stop::before {
  content: ""; }

.reui-icon-strikethrough::before {
  content: ""; }

.reui-icon-style::before {
  content: ""; }

.reui-icon-swap-horizontal::before {
  content: ""; }

.reui-icon-swap-vertical::before {
  content: ""; }

.reui-icon-symbol-circle::before {
  content: ""; }

.reui-icon-symbol-cross::before {
  content: ""; }

.reui-icon-symbol-diamond::before {
  content: ""; }

.reui-icon-symbol-square::before {
  content: ""; }

.reui-icon-symbol-triangle-down::before {
  content: ""; }

.reui-icon-symbol-triangle-up::before {
  content: ""; }

.reui-icon-tag::before {
  content: ""; }

.reui-icon-take-action::before {
  content: ""; }

.reui-icon-taxi::before {
  content: ""; }

.reui-icon-text-highlight::before {
  content: ""; }

.reui-icon-th::before {
  content: ""; }

.reui-icon-th-derived::before {
  content: ""; }

.reui-icon-th-list::before {
  content: ""; }

.reui-icon-thumbs-down::before {
  content: ""; }

.reui-icon-thumbs-up::before {
  content: ""; }

.reui-icon-tick::before {
  content: "✓"; }

.reui-icon-tick-circle::before {
  content: ""; }

.reui-icon-time::before {
  content: "⏲"; }

.reui-icon-timeline-area-chart::before {
  content: ""; }

.reui-icon-timeline-bar-chart::before {
  content: ""; }

.reui-icon-timeline-events::before {
  content: ""; }

.reui-icon-timeline-line-chart::before {
  content: ""; }

.reui-icon-tint::before {
  content: ""; }

.reui-icon-torch::before {
  content: ""; }

.reui-icon-train::before {
  content: ""; }

.reui-icon-translate::before {
  content: ""; }

.reui-icon-trash::before {
  content: ""; }

.reui-icon-tree::before {
  content: ""; }

.reui-icon-trending-down::before {
  content: ""; }

.reui-icon-trending-up::before {
  content: ""; }

.reui-icon-two-columns::before {
  content: ""; }

.reui-icon-underline::before {
  content: "⎁"; }

.reui-icon-undo::before {
  content: "⎌"; }

.reui-icon-ungroup-objects::before {
  content: ""; }

.reui-icon-unknown-vehicle::before {
  content: ""; }

.reui-icon-unlock::before {
  content: ""; }

.reui-icon-unpin::before {
  content: ""; }

.reui-icon-unresolve::before {
  content: ""; }

.reui-icon-updated::before {
  content: ""; }

.reui-icon-upload::before {
  content: ""; }

.reui-icon-user::before {
  content: ""; }

.reui-icon-variable::before {
  content: ""; }

.reui-icon-vertical-bar-chart-asc::before {
  content: ""; }

.reui-icon-vertical-bar-chart-desc::before {
  content: ""; }

.reui-icon-vertical-distribution::before {
  content: ""; }

.reui-icon-video::before {
  content: ""; }

.reui-icon-volume-down::before {
  content: ""; }

.reui-icon-volume-off::before {
  content: ""; }

.reui-icon-volume-up::before {
  content: ""; }

.reui-icon-walk::before {
  content: ""; }

.reui-icon-warning-sign::before {
  content: ""; }

.reui-icon-waterfall-chart::before {
  content: ""; }

.reui-icon-widget::before {
  content: ""; }

.reui-icon-widget-button::before {
  content: ""; }

.reui-icon-widget-footer::before {
  content: ""; }

.reui-icon-widget-header::before {
  content: ""; }

.reui-icon-wrench::before {
  content: ""; }

.reui-icon-zoom-in::before {
  content: ""; }

.reui-icon-zoom-out::before {
  content: ""; }

.reui-icon-zoom-to-fit::before {
  content: ""; }

svg.reui-icon {
  flex: 0 0 auto;
  vertical-align: top;
  fill: currentColor; }

.reui-submenu > .reui-popover-wrapper {
  display: block; }

.reui-submenu .reui-popover-target {
  display: block; }

.reui-submenu.reui-popover {
  box-shadow: none;
  padding: 0 5px; }
  .reui-submenu.reui-popover > .reui-popover-content {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 2px 4px rgba(16, 22, 26, 0.2), 0 8px 24px rgba(16, 22, 26, 0.2); }
  .reui-dark .reui-submenu.reui-popover, .reui-submenu.reui-popover.reui-dark {
    box-shadow: none; }
    .reui-dark .reui-submenu.reui-popover > .reui-popover-content, .reui-submenu.reui-popover.reui-dark > .reui-popover-content {
      box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 2px 4px rgba(16, 22, 26, 0.4), 0 8px 24px rgba(16, 22, 26, 0.4); }

/*
Menus

Markup:
<ul class="reui-menu {{.modifier}} reui-elevation-1">
  <li>
    <a class="reui-menu-item reui-icon-people" tabindex="0">Share...</a>
  </li>
  <li>
    <a class="reui-menu-item reui-icon-circle-arrow-right" tabindex="0">Move...</a>
  </li>
  <li>
    <a class="reui-menu-item reui-icon-edit" tabindex="0">Rename</a>
  </li>
  <li class="reui-menu-divider"></li>
  <li>
    <a class="reui-menu-item reui-icon-trash reui-intent-danger" tabindex="0">Delete</a>
  </li>
</ul>

.reui-large - Large size (only supported on <code>.reui-menu</code>)

Styleguide menu
*/
.reui-menu {
  margin: 0;
  border-radius: 0;
  background: #ffffff;
  min-width: 180px;
  padding: 5px;
  list-style: none;
  text-align: left;
  color: #444; }

.reui-menu-divider {
  display: block;
  margin: 5px;
  border-top: 1px solid rgba(16, 22, 26, 0.175); }
  .reui-dark .reui-menu-divider {
    border-top-color: rgba(255, 255, 255, 0.15); }

.reui-menu-item {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  border-radius: -1;
  padding: 6px 7px;
  text-decoration: none;
  line-height: 18px;
  color: inherit;
  user-select: none; }
  .reui-menu-item > * {
    flex-grow: 0;
    flex-shrink: 0; }
  .reui-menu-item > .reui-fill {
    flex-grow: 1;
    flex-shrink: 1; }
  .reui-menu-item::before,
  .reui-menu-item > * {
    margin-right: 7px; }
  .reui-menu-item:empty::before,
  .reui-menu-item > :last-child {
    margin-right: 0; }
  .reui-menu-item > .reui-fill {
    word-break: break-word; }
  .reui-menu-item:hover, .reui-submenu .reui-popover-target.reui-popover-open > .reui-menu-item {
    background-color: rgba(194, 194, 194, 0.3);
    cursor: pointer;
    text-decoration: none; }
  .reui-menu-item.reui-disabled {
    background-color: inherit;
    cursor: not-allowed;
    color: rgba(128, 128, 128, 0.5); }
  .reui-dark .reui-menu-item {
    color: inherit; }
    .reui-dark .reui-menu-item:hover, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-menu-item, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-menu-item {
      background-color: rgba(166, 166, 166, 0.15);
      color: inherit; }
    .reui-dark .reui-menu-item.reui-disabled {
      background-color: inherit;
      color: rgba(212, 212, 212, 0.5); }
  .reui-menu-item.reui-intent-primary {
    color: #106ba3; }
    .reui-menu-item.reui-intent-primary .reui-icon {
      color: inherit; }
    .reui-menu-item.reui-intent-primary::before, .reui-menu-item.reui-intent-primary::after,
    .reui-menu-item.reui-intent-primary .reui-menu-item-label {
      color: #106ba3; }
    .reui-menu-item.reui-intent-primary:hover, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-primary.reui-menu-item, .reui-menu-item.reui-intent-primary.reui-active {
      background-color: #137cbd; }
    .reui-menu-item.reui-intent-primary:active {
      background-color: #106ba3; }
    .reui-menu-item.reui-intent-primary:hover, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-primary.reui-menu-item, .reui-menu-item.reui-intent-primary:hover::before, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-primary.reui-menu-item::before, .reui-menu-item.reui-intent-primary:hover::after, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-primary.reui-menu-item::after,
    .reui-menu-item.reui-intent-primary:hover .reui-menu-item-label,
    .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-primary.reui-menu-item .reui-menu-item-label, .reui-menu-item.reui-intent-primary:active, .reui-menu-item.reui-intent-primary:active::before, .reui-menu-item.reui-intent-primary:active::after,
    .reui-menu-item.reui-intent-primary:active .reui-menu-item-label, .reui-menu-item.reui-intent-primary.reui-active, .reui-menu-item.reui-intent-primary.reui-active::before, .reui-menu-item.reui-intent-primary.reui-active::after,
    .reui-menu-item.reui-intent-primary.reui-active .reui-menu-item-label {
      color: #ffffff; }
  .reui-menu-item.reui-intent-success {
    color: #0d8050; }
    .reui-menu-item.reui-intent-success .reui-icon {
      color: inherit; }
    .reui-menu-item.reui-intent-success::before, .reui-menu-item.reui-intent-success::after,
    .reui-menu-item.reui-intent-success .reui-menu-item-label {
      color: #0d8050; }
    .reui-menu-item.reui-intent-success:hover, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-success.reui-menu-item, .reui-menu-item.reui-intent-success.reui-active {
      background-color: #0f9960; }
    .reui-menu-item.reui-intent-success:active {
      background-color: #0d8050; }
    .reui-menu-item.reui-intent-success:hover, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-success.reui-menu-item, .reui-menu-item.reui-intent-success:hover::before, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-success.reui-menu-item::before, .reui-menu-item.reui-intent-success:hover::after, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-success.reui-menu-item::after,
    .reui-menu-item.reui-intent-success:hover .reui-menu-item-label,
    .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-success.reui-menu-item .reui-menu-item-label, .reui-menu-item.reui-intent-success:active, .reui-menu-item.reui-intent-success:active::before, .reui-menu-item.reui-intent-success:active::after,
    .reui-menu-item.reui-intent-success:active .reui-menu-item-label, .reui-menu-item.reui-intent-success.reui-active, .reui-menu-item.reui-intent-success.reui-active::before, .reui-menu-item.reui-intent-success.reui-active::after,
    .reui-menu-item.reui-intent-success.reui-active .reui-menu-item-label {
      color: #ffffff; }
  .reui-menu-item.reui-intent-warning {
    color: #bf7326; }
    .reui-menu-item.reui-intent-warning .reui-icon {
      color: inherit; }
    .reui-menu-item.reui-intent-warning::before, .reui-menu-item.reui-intent-warning::after,
    .reui-menu-item.reui-intent-warning .reui-menu-item-label {
      color: #bf7326; }
    .reui-menu-item.reui-intent-warning:hover, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-warning.reui-menu-item, .reui-menu-item.reui-intent-warning.reui-active {
      background-color: #d9822b; }
    .reui-menu-item.reui-intent-warning:active {
      background-color: #bf7326; }
    .reui-menu-item.reui-intent-warning:hover, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-warning.reui-menu-item, .reui-menu-item.reui-intent-warning:hover::before, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-warning.reui-menu-item::before, .reui-menu-item.reui-intent-warning:hover::after, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-warning.reui-menu-item::after,
    .reui-menu-item.reui-intent-warning:hover .reui-menu-item-label,
    .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-warning.reui-menu-item .reui-menu-item-label, .reui-menu-item.reui-intent-warning:active, .reui-menu-item.reui-intent-warning:active::before, .reui-menu-item.reui-intent-warning:active::after,
    .reui-menu-item.reui-intent-warning:active .reui-menu-item-label, .reui-menu-item.reui-intent-warning.reui-active, .reui-menu-item.reui-intent-warning.reui-active::before, .reui-menu-item.reui-intent-warning.reui-active::after,
    .reui-menu-item.reui-intent-warning.reui-active .reui-menu-item-label {
      color: #ffffff; }
  .reui-menu-item.reui-intent-danger {
    color: #c23030; }
    .reui-menu-item.reui-intent-danger .reui-icon {
      color: inherit; }
    .reui-menu-item.reui-intent-danger::before, .reui-menu-item.reui-intent-danger::after,
    .reui-menu-item.reui-intent-danger .reui-menu-item-label {
      color: #c23030; }
    .reui-menu-item.reui-intent-danger:hover, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-danger.reui-menu-item, .reui-menu-item.reui-intent-danger.reui-active {
      background-color: #db3737; }
    .reui-menu-item.reui-intent-danger:active {
      background-color: #c23030; }
    .reui-menu-item.reui-intent-danger:hover, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-danger.reui-menu-item, .reui-menu-item.reui-intent-danger:hover::before, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-danger.reui-menu-item::before, .reui-menu-item.reui-intent-danger:hover::after, .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-danger.reui-menu-item::after,
    .reui-menu-item.reui-intent-danger:hover .reui-menu-item-label,
    .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-danger.reui-menu-item .reui-menu-item-label, .reui-menu-item.reui-intent-danger:active, .reui-menu-item.reui-intent-danger:active::before, .reui-menu-item.reui-intent-danger:active::after,
    .reui-menu-item.reui-intent-danger:active .reui-menu-item-label, .reui-menu-item.reui-intent-danger.reui-active, .reui-menu-item.reui-intent-danger.reui-active::before, .reui-menu-item.reui-intent-danger.reui-active::after,
    .reui-menu-item.reui-intent-danger.reui-active .reui-menu-item-label {
      color: #ffffff; }
  .reui-menu-item::before {
    line-height: 1;
    font-family: "Icons16", sans-serif;
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    margin-right: 7px; }
  .reui-menu-item::before,
  .reui-menu-item > .reui-icon {
    margin-top: 1px;
    color: #808080; }
  .reui-menu-item .reui-menu-item-label {
    color: #808080; }
  .reui-menu-item:hover, .reui-submenu .reui-popover-target.reui-popover-open > .reui-menu-item {
    color: inherit; }
  .reui-menu-item.reui-active, .reui-menu-item:active {
    background-color: rgba(148, 148, 148, 0.3); }
  .reui-menu-item.reui-disabled {
    outline: none !important;
    background-color: inherit !important;
    cursor: not-allowed !important;
    color: rgba(128, 128, 128, 0.5) !important; }
    .reui-menu-item.reui-disabled::before,
    .reui-menu-item.reui-disabled > .reui-icon,
    .reui-menu-item.reui-disabled .reui-menu-item-label {
      color: rgba(128, 128, 128, 0.5) !important; }
  .reui-large .reui-menu-item {
    padding: 9px 7px;
    line-height: 22px;
    font-size: 16px; }
    .reui-large .reui-menu-item .reui-icon {
      margin-top: 3px; }
    .reui-large .reui-menu-item::before {
      line-height: 1;
      font-family: "Icons20", sans-serif;
      font-size: 20px;
      font-weight: 400;
      font-style: normal;
      -moz-osx-font-smoothing: grayscale;
      -webkit-font-smoothing: antialiased;
      margin-top: 1px;
      margin-right: 10px; }

button.reui-menu-item {
  border: none;
  background: none;
  width: 100%;
  text-align: left; }

/*
Menu headers

Markup:
<ul class="reui-menu reui-elevation-1">
  <li class="reui-menu-header"><h6 class="reui-heading">Layouts</h6></li>
  <li><button type="button" class="reui-menu-item reui-icon-layout-auto">Auto</button></li>
  <li><button type="button" class="reui-menu-item reui-icon-layout-circle">Circle</button></li>
  <li><button type="button" class="reui-menu-item reui-icon-layout-grid">Grid</button></li>
  <li class="reui-menu-header"><h6 class="reui-heading">Views</h6></li>
  <li><button type="button" class="reui-menu-item reui-icon-history">History</button></li>
  <li><button type="button" class="reui-menu-item reui-icon-star">Favorites</button></li>
  <li><button type="button" class="reui-menu-item reui-icon-envelope">Messages</button></li>
</ul>

Styleguide menu-header
*/
.reui-menu-header {
  display: block;
  margin: 5px;
  border-top: 1px solid rgba(16, 22, 26, 0.175);
  cursor: default;
  padding-left: 2px; }
  .reui-dark .reui-menu-header {
    border-top-color: rgba(255, 255, 255, 0.15); }
  .reui-menu-header:first-of-type {
    border-top: none; }
  .reui-menu-header > h6 {
    color: #444;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal;
    margin: 0;
    padding: 10px 7px 0 1px;
    line-height: 17px; }
    .reui-dark .reui-menu-header > h6 {
      color: #fafafa; }
  .reui-menu-header:first-of-type > h6 {
    padding-top: 0; }
  .reui-large .reui-menu-header > h6 {
    padding-top: 15px;
    padding-bottom: 5px;
    font-size: 18px; }
  .reui-large .reui-menu-header:first-of-type > h6 {
    padding-top: 0; }

.reui-dark .reui-menu {
  background: #4d4d4d;
  color: #fafafa; }

.reui-dark .reui-menu-item.reui-intent-primary {
  color: #48aff0; }
  .reui-dark .reui-menu-item.reui-intent-primary .reui-icon {
    color: inherit; }
  .reui-dark .reui-menu-item.reui-intent-primary::before, .reui-dark .reui-menu-item.reui-intent-primary::after,
  .reui-dark .reui-menu-item.reui-intent-primary .reui-menu-item-label {
    color: #48aff0; }
  .reui-dark .reui-menu-item.reui-intent-primary:hover, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-primary.reui-menu-item, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-primary.reui-menu-item, .reui-dark .reui-menu-item.reui-intent-primary.reui-active {
    background-color: #137cbd; }
  .reui-dark .reui-menu-item.reui-intent-primary:active {
    background-color: #106ba3; }
  .reui-dark .reui-menu-item.reui-intent-primary:hover, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-primary.reui-menu-item, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-primary.reui-menu-item, .reui-dark .reui-menu-item.reui-intent-primary:hover::before, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-primary.reui-menu-item::before, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-primary.reui-menu-item::before, .reui-dark .reui-menu-item.reui-intent-primary:hover::after, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-primary.reui-menu-item::after, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-primary.reui-menu-item::after,
  .reui-dark .reui-menu-item.reui-intent-primary:hover .reui-menu-item-label,
  .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-primary.reui-menu-item .reui-menu-item-label,
  .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-primary.reui-menu-item .reui-menu-item-label, .reui-dark .reui-menu-item.reui-intent-primary:active, .reui-dark .reui-menu-item.reui-intent-primary:active::before, .reui-dark .reui-menu-item.reui-intent-primary:active::after,
  .reui-dark .reui-menu-item.reui-intent-primary:active .reui-menu-item-label, .reui-dark .reui-menu-item.reui-intent-primary.reui-active, .reui-dark .reui-menu-item.reui-intent-primary.reui-active::before, .reui-dark .reui-menu-item.reui-intent-primary.reui-active::after,
  .reui-dark .reui-menu-item.reui-intent-primary.reui-active .reui-menu-item-label {
    color: #ffffff; }

.reui-dark .reui-menu-item.reui-intent-success {
  color: #3dcc91; }
  .reui-dark .reui-menu-item.reui-intent-success .reui-icon {
    color: inherit; }
  .reui-dark .reui-menu-item.reui-intent-success::before, .reui-dark .reui-menu-item.reui-intent-success::after,
  .reui-dark .reui-menu-item.reui-intent-success .reui-menu-item-label {
    color: #3dcc91; }
  .reui-dark .reui-menu-item.reui-intent-success:hover, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-success.reui-menu-item, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-success.reui-menu-item, .reui-dark .reui-menu-item.reui-intent-success.reui-active {
    background-color: #0f9960; }
  .reui-dark .reui-menu-item.reui-intent-success:active {
    background-color: #0d8050; }
  .reui-dark .reui-menu-item.reui-intent-success:hover, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-success.reui-menu-item, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-success.reui-menu-item, .reui-dark .reui-menu-item.reui-intent-success:hover::before, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-success.reui-menu-item::before, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-success.reui-menu-item::before, .reui-dark .reui-menu-item.reui-intent-success:hover::after, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-success.reui-menu-item::after, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-success.reui-menu-item::after,
  .reui-dark .reui-menu-item.reui-intent-success:hover .reui-menu-item-label,
  .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-success.reui-menu-item .reui-menu-item-label,
  .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-success.reui-menu-item .reui-menu-item-label, .reui-dark .reui-menu-item.reui-intent-success:active, .reui-dark .reui-menu-item.reui-intent-success:active::before, .reui-dark .reui-menu-item.reui-intent-success:active::after,
  .reui-dark .reui-menu-item.reui-intent-success:active .reui-menu-item-label, .reui-dark .reui-menu-item.reui-intent-success.reui-active, .reui-dark .reui-menu-item.reui-intent-success.reui-active::before, .reui-dark .reui-menu-item.reui-intent-success.reui-active::after,
  .reui-dark .reui-menu-item.reui-intent-success.reui-active .reui-menu-item-label {
    color: #ffffff; }

.reui-dark .reui-menu-item.reui-intent-warning {
  color: #ffb366; }
  .reui-dark .reui-menu-item.reui-intent-warning .reui-icon {
    color: inherit; }
  .reui-dark .reui-menu-item.reui-intent-warning::before, .reui-dark .reui-menu-item.reui-intent-warning::after,
  .reui-dark .reui-menu-item.reui-intent-warning .reui-menu-item-label {
    color: #ffb366; }
  .reui-dark .reui-menu-item.reui-intent-warning:hover, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-warning.reui-menu-item, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-warning.reui-menu-item, .reui-dark .reui-menu-item.reui-intent-warning.reui-active {
    background-color: #d9822b; }
  .reui-dark .reui-menu-item.reui-intent-warning:active {
    background-color: #bf7326; }
  .reui-dark .reui-menu-item.reui-intent-warning:hover, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-warning.reui-menu-item, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-warning.reui-menu-item, .reui-dark .reui-menu-item.reui-intent-warning:hover::before, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-warning.reui-menu-item::before, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-warning.reui-menu-item::before, .reui-dark .reui-menu-item.reui-intent-warning:hover::after, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-warning.reui-menu-item::after, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-warning.reui-menu-item::after,
  .reui-dark .reui-menu-item.reui-intent-warning:hover .reui-menu-item-label,
  .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-warning.reui-menu-item .reui-menu-item-label,
  .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-warning.reui-menu-item .reui-menu-item-label, .reui-dark .reui-menu-item.reui-intent-warning:active, .reui-dark .reui-menu-item.reui-intent-warning:active::before, .reui-dark .reui-menu-item.reui-intent-warning:active::after,
  .reui-dark .reui-menu-item.reui-intent-warning:active .reui-menu-item-label, .reui-dark .reui-menu-item.reui-intent-warning.reui-active, .reui-dark .reui-menu-item.reui-intent-warning.reui-active::before, .reui-dark .reui-menu-item.reui-intent-warning.reui-active::after,
  .reui-dark .reui-menu-item.reui-intent-warning.reui-active .reui-menu-item-label {
    color: #ffffff; }

.reui-dark .reui-menu-item.reui-intent-danger {
  color: #ff7373; }
  .reui-dark .reui-menu-item.reui-intent-danger .reui-icon {
    color: inherit; }
  .reui-dark .reui-menu-item.reui-intent-danger::before, .reui-dark .reui-menu-item.reui-intent-danger::after,
  .reui-dark .reui-menu-item.reui-intent-danger .reui-menu-item-label {
    color: #ff7373; }
  .reui-dark .reui-menu-item.reui-intent-danger:hover, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-danger.reui-menu-item, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-danger.reui-menu-item, .reui-dark .reui-menu-item.reui-intent-danger.reui-active {
    background-color: #db3737; }
  .reui-dark .reui-menu-item.reui-intent-danger:active {
    background-color: #c23030; }
  .reui-dark .reui-menu-item.reui-intent-danger:hover, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-danger.reui-menu-item, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-danger.reui-menu-item, .reui-dark .reui-menu-item.reui-intent-danger:hover::before, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-danger.reui-menu-item::before, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-danger.reui-menu-item::before, .reui-dark .reui-menu-item.reui-intent-danger:hover::after, .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-danger.reui-menu-item::after, .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-danger.reui-menu-item::after,
  .reui-dark .reui-menu-item.reui-intent-danger:hover .reui-menu-item-label,
  .reui-dark .reui-submenu .reui-popover-target.reui-popover-open > .reui-intent-danger.reui-menu-item .reui-menu-item-label,
  .reui-submenu .reui-dark .reui-popover-target.reui-popover-open > .reui-intent-danger.reui-menu-item .reui-menu-item-label, .reui-dark .reui-menu-item.reui-intent-danger:active, .reui-dark .reui-menu-item.reui-intent-danger:active::before, .reui-dark .reui-menu-item.reui-intent-danger:active::after,
  .reui-dark .reui-menu-item.reui-intent-danger:active .reui-menu-item-label, .reui-dark .reui-menu-item.reui-intent-danger.reui-active, .reui-dark .reui-menu-item.reui-intent-danger.reui-active::before, .reui-dark .reui-menu-item.reui-intent-danger.reui-active::after,
  .reui-dark .reui-menu-item.reui-intent-danger.reui-active .reui-menu-item-label {
    color: #ffffff; }

.reui-dark .reui-menu-item::before,
.reui-dark .reui-menu-item > .reui-icon {
  color: #d4d4d4; }

.reui-dark .reui-menu-item .reui-menu-item-label {
  color: #d4d4d4; }

.reui-dark .reui-menu-item.reui-active, .reui-dark .reui-menu-item:active {
  background-color: rgba(166, 166, 166, 0.3); }

.reui-dark .reui-menu-item.reui-disabled {
  color: rgba(212, 212, 212, 0.5) !important; }
  .reui-dark .reui-menu-item.reui-disabled::before,
  .reui-dark .reui-menu-item.reui-disabled > .reui-icon,
  .reui-dark .reui-menu-item.reui-disabled .reui-menu-item-label {
    color: rgba(212, 212, 212, 0.5) !important; }

.reui-dark .reui-menu-divider,
.reui-dark .reui-menu-header {
  border-color: rgba(255, 255, 255, 0.15); }

.reui-dark .reui-menu-header > h6 {
  color: #fafafa; }

.reui-label .reui-menu {
  margin-top: 5px; }

/*
Navbars

Markup:
<nav class="reui-navbar {{.modifier}}">
  <div class="reui-navbar-group reui-align-left">
    <div class="reui-navbar-heading">Blueprint</div>
    <input class="reui-input" placeholder="Search files..." type="text" />
  </div>
  <div class="reui-navbar-group reui-align-right">
    <button class="reui-button reui-minimal reui-icon-home">Home</button>
    <button class="reui-button reui-minimal reui-icon-document">Files</button>
    <span class="reui-navbar-divider"></span>
    <button class="reui-button reui-minimal reui-icon-user"></button>
    <button class="reui-button reui-minimal reui-icon-notifications"></button>
    <button class="reui-button reui-minimal reui-icon-cog"></button>
  </div>
</nav>

.reui-dark - Dark theme

Styleguide navbar
*/
.reui-navbar {
  position: relative;
  z-index: 10;
  background-color: transparent;
  width: 100%;
  height: 50px;
  padding: 0 15px; }
  .reui-navbar.reui-dark,
  .reui-dark .reui-navbar {
    background-color: #575757; }
  .reui-navbar.reui-dark {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.2), 0 0 0 rgba(16, 22, 26, 0), 0 1px 1px rgba(16, 22, 26, 0.4); }
  .reui-dark .reui-navbar {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 0 0 rgba(16, 22, 26, 0), 0 1px 1px rgba(16, 22, 26, 0.4); }
  .reui-navbar.reui-fixed-top {
    position: fixed;
    top: 0;
    right: 0;
    left: 0; }
  .reui-navbar .reui-logo {
    margin-right: 15px;
    width: 20px; }

.reui-navbar-heading {
  margin-right: 15px;
  font-size: 16px; }

.reui-navbar-group {
  display: flex;
  align-items: center;
  height: 50px; }
  .reui-navbar-group.reui-align-left {
    float: left; }
  .reui-navbar-group.reui-align-right {
    float: right; }

.reui-navbar-divider {
  margin: 0 10px;
  border-left: 1px solid rgba(16, 22, 26, 0.175);
  height: 20px; }
  .reui-dark .reui-navbar-divider {
    border-left-color: rgba(255, 255, 255, 0.15); }

/*
Fixed width

Markup:
<nav class="reui-navbar reui-dark">
  <div style="margin: 0 auto; width: 480px;"> <!-- ADD ME -->
    <div class="reui-navbar-group reui-align-left">
      <div class="reui-navbar-heading">Blueprint</div>
    </div>
    <div class="reui-navbar-group reui-align-right">
      <button class="reui-button reui-minimal reui-icon-home">Home</button>
      <button class="reui-button reui-minimal reui-icon-document">Files</button>
      <span class="reui-navbar-divider"></span>
      <button class="reui-button reui-minimal reui-icon-user"></button>
      <button class="reui-button reui-minimal reui-icon-notifications"></button>
      <button class="reui-button reui-minimal reui-icon-cog"></button>
    </div>
  </div>
</nav>

Styleguide navbar-container
*/
/*
Non-ideal state

Markup:
<div class="reui-non-ideal-state">
  <div class="reui-non-ideal-state-visual">
    <span class="reui-icon reui-icon-folder-open"></span>
  </div>
  <h4 class="reui-heading">This folder is empty</h4>
  <div>Create a new file to populate the folder.</div>
  <button class="reui-button reui-intent-primary">Create</button>
</div>

Styleguide non-ideal-state
*/
.reui-non-ideal-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  text-align: center; }
  .reui-non-ideal-state > * {
    flex-grow: 0;
    flex-shrink: 0; }
  .reui-non-ideal-state > .reui-fill {
    flex-grow: 1;
    flex-shrink: 1; }
  .reui-non-ideal-state::before,
  .reui-non-ideal-state > * {
    margin-bottom: 20px; }
  .reui-non-ideal-state:empty::before,
  .reui-non-ideal-state > :last-child {
    margin-bottom: 0; }
  .reui-non-ideal-state > * {
    max-width: 400px; }

.reui-non-ideal-state-visual {
  color: rgba(128, 128, 128, 0.5);
  font-size: 60px; }
  .reui-dark .reui-non-ideal-state-visual {
    color: rgba(212, 212, 212, 0.5); }

.reui-overflow-list {
  display: flex;
  flex-wrap: nowrap;
  min-width: 0; }

.reui-overflow-list-spacer {
  flex-shrink: 1;
  width: 1px; }

body.reui-overlay-open {
  overflow: hidden; }

.reui-overlay {
  position: static;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 20; }
  .reui-overlay:not(.reui-overlay-open) {
    pointer-events: none; }
  .reui-overlay.reui-overlay-scroll-container {
    position: fixed;
    overflow: auto; }
    .reui-overlay.reui-overlay-scroll-container.reui-overlay-inline {
      position: absolute; }
  .reui-overlay.reui-overlay-inline {
    display: inline;
    overflow: visible; }

.reui-overlay-content {
  position: fixed;
  z-index: 20; }
  .reui-overlay-inline .reui-overlay-content,
  .reui-overlay-scroll-container .reui-overlay-content {
    position: absolute; }

.reui-overlay-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 1;
  z-index: 20;
  background-color: rgba(16, 22, 26, 0.7);
  overflow: auto;
  user-select: none; }
  .reui-overlay-backdrop.reui-overlay-enter, .reui-overlay-backdrop.reui-overlay-appear {
    opacity: 0; }
  .reui-overlay-backdrop.reui-overlay-enter-active, .reui-overlay-backdrop.reui-overlay-appear-active {
    opacity: 1;
    transition-property: opacity;
    transition-duration: 200ms;
    transition-timing-function: cubic-bezier(0.4, 1, 0.75, 0.9);
    transition-delay: 0; }
  .reui-overlay-backdrop.reui-overlay-exit {
    opacity: 1; }
  .reui-overlay-backdrop.reui-overlay-exit-active {
    opacity: 0;
    transition-property: opacity;
    transition-duration: 200ms;
    transition-timing-function: cubic-bezier(0.4, 1, 0.75, 0.9);
    transition-delay: 0; }
  .reui-overlay-backdrop:focus {
    outline: none; }
  .reui-overlay-inline .reui-overlay-backdrop {
    position: absolute; }

/*
A mixin to generate the classes for a React CSSTransition which animates any number of CSS
properties at once.

Transitioned properties are specificed as a map of property names to lists of (inital value, final
value). For enter & appear transitions, each property will transition from its initial to its final
value. For exit transitions, each property will transition in reverse, from final to initial.

**Simple example:**
`@include react-transition("popover", (opacity: 0 1), $before: "&");`
Transition named "popover" moves opacity from 0 to 1. `"&"` indicates that the
Transition classes are expected to be applied to this element, where the mixin is invoked.

**Params:**
$name: React transitionName prop
$properties: map of CSS property to (initial, final) values
$duration: transition duration
$easing: transition easing function
$delay: transition delay
$before: selector text to insert before transition name (often to select self: &)
$after: selector text to insert after transiton name (to select children)
*/
/*
A mixin to generate the classes for one phase of a React CSSTransition.
`$phase` must be `appear` or `enter` or `exit`.
If `enter` phase is given then `appear` phase will be generated at the same time.
If `exit` phase is given then property values are animated in reverse, from final to initial.

**Example:**
@include react-transition-phase(toast, enter, $enter-translate, $before: "&");
@include react-transition-phase(toast, leave, $leave-blur, $pt-transition-duration * 3, $before: "&");
*/
/*
Given map of properties to values, set each property to the value at the given index.
(remember that sass indices are 1-based).

Example: `each-prop((opacity: 0 1), 2)` will print "opacity: 1"
*/
/*
Format transition class name with all the bits.
"enter" phase will include "appear" phase in returned name.
*/
.reui-popover {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 2px 4px rgba(16, 22, 26, 0.2), 0 8px 24px rgba(16, 22, 26, 0.2);
  transform: translateY(0);
  display: inline-block;
  z-index: 20;
  border-radius: 0; }
  .reui-popover .reui-popover-arrow {
    position: absolute;
    width: 30px;
    height: 30px; }
    .reui-popover .reui-popover-arrow::before {
      margin: 5px;
      width: 20px;
      height: 20px; }
  .reui-tether-element-attached-bottom.reui-tether-target-attached-top > .reui-popover {
    margin-top: -17px;
    margin-bottom: 17px; }
    .reui-tether-element-attached-bottom.reui-tether-target-attached-top > .reui-popover > .reui-popover-arrow {
      bottom: -11px; }
      .reui-tether-element-attached-bottom.reui-tether-target-attached-top > .reui-popover > .reui-popover-arrow svg {
        transform: rotate(-90deg); }
  .reui-tether-element-attached-left.reui-tether-target-attached-right > .reui-popover {
    margin-left: 17px; }
    .reui-tether-element-attached-left.reui-tether-target-attached-right > .reui-popover > .reui-popover-arrow {
      left: -11px; }
      .reui-tether-element-attached-left.reui-tether-target-attached-right > .reui-popover > .reui-popover-arrow svg {
        transform: rotate(0); }
  .reui-tether-element-attached-top.reui-tether-target-attached-bottom > .reui-popover {
    margin-top: 17px; }
    .reui-tether-element-attached-top.reui-tether-target-attached-bottom > .reui-popover > .reui-popover-arrow {
      top: -11px; }
      .reui-tether-element-attached-top.reui-tether-target-attached-bottom > .reui-popover > .reui-popover-arrow svg {
        transform: rotate(90deg); }
  .reui-tether-element-attached-right.reui-tether-target-attached-left > .reui-popover {
    margin-right: 17px;
    margin-left: -17px; }
    .reui-tether-element-attached-right.reui-tether-target-attached-left > .reui-popover > .reui-popover-arrow {
      right: -11px; }
      .reui-tether-element-attached-right.reui-tether-target-attached-left > .reui-popover > .reui-popover-arrow svg {
        transform: rotate(180deg); }
  .reui-tether-element-attached-middle > .reui-popover > .reui-popover-arrow {
    top: 50%;
    transform: translateY(-50%); }
  .reui-tether-element-attached-center > .reui-popover > .reui-popover-arrow {
    right: 50%;
    transform: translateX(50%); }
  .reui-tether-element-attached-top.reui-tether-target-attached-top > .reui-popover > .reui-popover-arrow {
    top: -0.3934px; }
  .reui-tether-element-attached-right.reui-tether-target-attached-right > .reui-popover > .reui-popover-arrow {
    right: -0.3934px; }
  .reui-tether-element-attached-left.reui-tether-target-attached-left > .reui-popover > .reui-popover-arrow {
    left: -0.3934px; }
  .reui-tether-element-attached-bottom.reui-tether-target-attached-bottom > .reui-popover > .reui-popover-arrow {
    bottom: -0.3934px; }
  .reui-tether-element-attached-top.reui-tether-element-attached-left > .reui-popover {
    transform-origin: top left; }
  .reui-tether-element-attached-top.reui-tether-element-attached-center > .reui-popover {
    transform-origin: top center; }
  .reui-tether-element-attached-top.reui-tether-element-attached-right > .reui-popover {
    transform-origin: top right; }
  .reui-tether-element-attached-middle.reui-tether-element-attached-left > .reui-popover {
    transform-origin: center left; }
  .reui-tether-element-attached-middle.reui-tether-element-attached-center > .reui-popover {
    transform-origin: center center; }
  .reui-tether-element-attached-middle.reui-tether-element-attached-right > .reui-popover {
    transform-origin: center right; }
  .reui-tether-element-attached-bottom.reui-tether-element-attached-left > .reui-popover {
    transform-origin: bottom left; }
  .reui-tether-element-attached-bottom.reui-tether-element-attached-center > .reui-popover {
    transform-origin: bottom center; }
  .reui-tether-element-attached-bottom.reui-tether-element-attached-right > .reui-popover {
    transform-origin: bottom right; }
  .reui-popover .reui-popover-content {
    background: #ffffff;
    color: inherit; }
  .reui-popover .reui-popover-arrow::before {
    box-shadow: 1px 1px 6px rgba(16, 22, 26, 0.2); }
  .reui-popover .reui-popover-arrow-border {
    fill: #10161a;
    fill-opacity: 0.1; }
  .reui-popover .reui-popover-arrow-fill {
    fill: #ffffff; }
  .reui-popover-enter > .reui-popover, .reui-popover-appear > .reui-popover {
    transform: translateY(-10px); }
  .reui-popover-enter-active > .reui-popover, .reui-popover-appear-active > .reui-popover {
    transform: translateY(0);
    transition-property: transform;
    transition-duration: 300ms;
    transition-timing-function: cubic-bezier(0.54, 1.12, 0.38, 1.11);
    transition-delay: 0; }
  .reui-popover-exit > .reui-popover {
    transform: translateY(0); }
  .reui-popover-exit-active > .reui-popover {
    transform: translateY(-10px);
    transition-property: transform;
    transition-duration: 300ms;
    transition-timing-function: cubic-bezier(0.54, 1.12, 0.38, 1.11);
    transition-delay: 0; }
  .reui-popover .reui-popover-content {
    position: relative;
    border-radius: 0; }
  .reui-popover.reui-popover-content-sizing .reui-popover-content {
    max-width: 350px;
    padding: 20px; }
  .reui-popover-target + .reui-overlay .reui-popover.reui-popover-content-sizing {
    width: 350px; }
  .reui-popover.reui-minimal {
    margin: 0 !important; }
    .reui-popover.reui-minimal .reui-popover-arrow {
      display: none; }
    .reui-popover.reui-minimal.reui-popover {
      transform: scale(1); }
      .reui-popover-enter > .reui-popover.reui-minimal.reui-popover, .reui-popover-appear > .reui-popover.reui-minimal.reui-popover {
        transform: scale(1); }
      .reui-popover-enter-active > .reui-popover.reui-minimal.reui-popover, .reui-popover-appear-active > .reui-popover.reui-minimal.reui-popover {
        transform: scale(1);
        transition-property: transform;
        transition-duration: 100ms;
        transition-timing-function: cubic-bezier(0.4, 1, 0.75, 0.9);
        transition-delay: 0; }
      .reui-popover-exit > .reui-popover.reui-minimal.reui-popover {
        transform: scale(1); }
      .reui-popover-exit-active > .reui-popover.reui-minimal.reui-popover {
        transform: scale(1);
        transition-property: transform;
        transition-duration: 100ms;
        transition-timing-function: cubic-bezier(0.4, 1, 0.75, 0.9);
        transition-delay: 0; }
  .reui-popover.reui-dark,
  .reui-dark .reui-popover {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 2px 4px rgba(16, 22, 26, 0.4), 0 8px 24px rgba(16, 22, 26, 0.4); }
    .reui-popover.reui-dark .reui-popover-content,
    .reui-dark .reui-popover .reui-popover-content {
      background: #4d4d4d;
      color: inherit; }
    .reui-popover.reui-dark .reui-popover-arrow::before,
    .reui-dark .reui-popover .reui-popover-arrow::before {
      box-shadow: 1px 1px 6px rgba(16, 22, 26, 0.4); }
    .reui-popover.reui-dark .reui-popover-arrow-border,
    .reui-dark .reui-popover .reui-popover-arrow-border {
      fill: #10161a;
      fill-opacity: 0.2; }
    .reui-popover.reui-dark .reui-popover-arrow-fill,
    .reui-dark .reui-popover .reui-popover-arrow-fill {
      fill: #4d4d4d; }

.reui-popover-arrow::before {
  display: block;
  position: absolute;
  transform: rotate(45deg);
  border-radius: -1;
  content: ""; }

.reui-tether-pinned .reui-popover-arrow {
  display: none; }

.reui-popover-backdrop {
  background: rgba(255, 255, 255, 0); }

.reui-transition-container {
  opacity: 1;
  display: flex;
  z-index: 20; }
  .reui-transition-container.reui-popover-enter, .reui-transition-container.reui-popover-appear {
    opacity: 0; }
  .reui-transition-container.reui-popover-enter-active, .reui-transition-container.reui-popover-appear-active {
    opacity: 1;
    transition-property: opacity;
    transition-duration: 100ms;
    transition-timing-function: cubic-bezier(0.4, 1, 0.75, 0.9);
    transition-delay: 0; }
  .reui-transition-container.reui-popover-exit {
    opacity: 1; }
  .reui-transition-container.reui-popover-exit-active {
    opacity: 0;
    transition-property: opacity;
    transition-duration: 100ms;
    transition-timing-function: cubic-bezier(0.4, 1, 0.75, 0.9);
    transition-delay: 0; }
  .reui-transition-container:focus {
    outline: none; }
  .reui-transition-container.reui-popover-leave .reui-popover-content {
    pointer-events: none; }
  .reui-transition-container[data-x-out-of-boundaries] {
    display: none; }

span.reui-popover-target {
  display: inline-block; }

.reui-portal {
  position: absolute;
  top: 0;
  right: 0;
  left: 0; }

/*
Progress bars

Markup:
<div class="reui-progress-bar {{.modifier}}">
  <div class="reui-progress-meter" style="width: 25%"></div>
</div>
<div class="reui-progress-bar reui-intent-primary {{.modifier}}">
  <div class="reui-progress-meter" style="width: 50%"></div>
</div>
<div class="reui-progress-bar reui-intent-success {{.modifier}}">
  <div class="reui-progress-meter" style="width: 75%"></div>
</div>
<div class="reui-progress-bar reui-intent-danger {{.modifier}}">
  <div class="reui-progress-meter" style="width: 100%"></div>
</div>

.reui-no-stripes   - No stripes
.reui-no-animation - No animation

Styleguide progress-bar
*/
@keyframes linear-progress-bar-stripes {
  from {
    background-position: 0 0; }
  to {
    background-position: 30px 0; } }

.reui-progress-bar {
  display: block;
  position: relative;
  border-radius: 40px;
  background: rgba(128, 128, 128, 0.2);
  width: 100%;
  height: 8px;
  overflow: hidden; }
  .reui-progress-bar .reui-progress-meter {
    position: absolute;
    border-radius: 40px;
    background: linear-gradient(-45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%);
    background-color: rgba(128, 128, 128, 0.8);
    background-size: 30px 30px;
    width: 100%;
    height: 100%;
    transition: width 200ms cubic-bezier(0.4, 1, 0.75, 0.9); }
  .reui-progress-bar:not(.reui-no-animation):not(.reui-no-stripes) .reui-progress-meter {
    animation: linear-progress-bar-stripes 300ms linear infinite reverse; }
  .reui-progress-bar.reui-no-stripes .reui-progress-meter {
    background-image: none; }

.reui-dark .reui-progress-bar {
  background: rgba(16, 22, 26, 0.5); }
  .reui-dark .reui-progress-bar .reui-progress-meter {
    background-color: #a6a6a6; }

.reui-progress-bar.reui-intent-primary .reui-progress-meter {
  background-color: #137cbd; }

.reui-progress-bar.reui-intent-success .reui-progress-meter {
  background-color: #0f9960; }

.reui-progress-bar.reui-intent-warning .reui-progress-meter {
  background-color: #d9822b; }

.reui-progress-bar.reui-intent-danger .reui-progress-meter {
  background-color: #db3737; }

/*
Skeletons

Markup:
<div class="reui-card">
  <h5 class="reui-heading"><a class="{{.modifier}}" href="#" tabindex="-1">Card heading</a></h5>
  <p class="{{.modifier}}">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eget tortor felis.
    Fusce dapibus metus in dapibus mollis. Quisque eget ex diam.
  </p>
  <button type="button" class="reui-button reui-icon-add {{.modifier}}" tabindex="-1">Submit</button>
</div>

.reui-skeleton - Render this element as a skeleton, an outline of its true self.

Styleguide skeleton
*/
@keyframes glow {
  0%,
  100% {
    border-color: rgba(194, 194, 194, 0.2);
    background-color: rgba(194, 194, 194, 0.2); }
  50% {
    border-color: rgba(128, 128, 128, 0.2);
    background-color: rgba(128, 128, 128, 0.2); } }

/* stylelint-disable declaration-no-important */
.reui-skeleton {
  border-color: rgba(194, 194, 194, 0.2) !important;
  border-radius: 2px;
  box-shadow: none !important;
  background: rgba(194, 194, 194, 0.2) !important;
  background-clip: padding-box !important;
  cursor: default;
  color: transparent !important;
  animation: 2000ms linear infinite glow;
  pointer-events: none;
  user-select: none; }
  .reui-skeleton::before, .reui-skeleton::after,
  .reui-skeleton * {
    visibility: hidden !important; }

/* stylelint-enable declaration-no-important */
/*
CSS `border` property issues:
- An element can only have one border.
- Borders can't stack with shadows.
- Borders modify the size of the element they're applied to.
- Border positioning requires the extra `box-sizing` property.

`box-shadow` doesn't have these issues, we're using it instead of `border`.
*/
/*
Overlay shadows are used for default buttons
floating on top of other elements. This way, the
shadows blend with the colors beneath it.
Switches and slider handles both use these variables.
*/
.reui-slider {
  width: 100%;
  min-width: 150px;
  height: 40px;
  position: relative;
  outline: none;
  cursor: default;
  user-select: none; }
  .reui-slider:hover {
    cursor: pointer; }
  .reui-slider:active {
    cursor: grabbing; }
  .reui-slider.reui-disabled {
    opacity: 0.5;
    cursor: not-allowed; }
  .reui-slider.reui-slider-unlabeled {
    height: 16px; }

.reui-slider-track,
.reui-slider-progress {
  top: 5px;
  right: 0;
  left: 0;
  height: 6px;
  position: absolute; }

.reui-slider-track {
  border-radius: 0;
  overflow: hidden; }

.reui-slider-progress {
  background: rgba(128, 128, 128, 0.2); }
  .reui-dark .reui-slider-progress {
    background: rgba(16, 22, 26, 0.5); }
  .reui-slider-progress.reui-intent-primary {
    background-color: #137cbd; }
  .reui-slider-progress.reui-intent-success {
    background-color: #0f9960; }
  .reui-slider-progress.reui-intent-warning {
    background-color: #d9822b; }
  .reui-slider-progress.reui-intent-danger {
    background-color: #db3737; }

.reui-slider-handle {
  box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 -1px 0 rgba(16, 22, 26, 0.2);
  background-color: #ebebeb;
  color: #444;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 0;
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.3), 0 1px 1px rgba(16, 22, 26, 0.2);
  cursor: pointer;
  width: 16px;
  height: 16px; }
  .reui-slider-handle:hover {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 -1px 0 rgba(16, 22, 26, 0.2);
    background-clip: padding-box;
    background-color: #f0f0f0; }
  .reui-slider-handle:active, .reui-slider-handle.reui-active {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 1px 2px rgba(16, 22, 26, 0.2);
    background-color: #e6e6e6; }
  .reui-slider-handle:disabled, .reui-slider-handle.reui-disabled {
    outline: none;
    box-shadow: none;
    background-color: rgba(222, 222, 222, 0.5);
    cursor: not-allowed;
    color: rgba(128, 128, 128, 0.5); }
    .reui-slider-handle:disabled.reui-active, .reui-slider-handle:disabled.reui-active:hover, .reui-slider-handle.reui-disabled.reui-active, .reui-slider-handle.reui-disabled.reui-active:hover {
      background: rgba(222, 222, 222, 0.7); }
  .reui-slider-handle:focus {
    z-index: 1; }
  .reui-slider-handle:hover {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 -1px 0 rgba(16, 22, 26, 0.2);
    background-clip: padding-box;
    background-color: #f0f0f0;
    z-index: 2;
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.3), 0 1px 1px rgba(16, 22, 26, 0.2);
    cursor: grab; }
  .reui-slider-handle.reui-active {
    box-shadow: inset 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 1px 2px rgba(16, 22, 26, 0.2);
    background-color: #e6e6e6;
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.1);
    cursor: grabbing; }
  .reui-disabled .reui-slider-handle {
    box-shadow: none;
    background: #d4d4d4;
    pointer-events: none; }
  .reui-dark .reui-slider-handle {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4);
    background-color: #575757;
    color: #fafafa; }
    .reui-dark .reui-slider-handle:hover, .reui-dark .reui-slider-handle:active, .reui-dark .reui-slider-handle.reui-active {
      color: #fafafa; }
    .reui-dark .reui-slider-handle:hover {
      box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4);
      background-color: #4d4d4d; }
    .reui-dark .reui-slider-handle:active, .reui-dark .reui-slider-handle.reui-active {
      box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.6), inset 0 1px 2px rgba(16, 22, 26, 0.2);
      background-color: #333333; }
    .reui-dark .reui-slider-handle:disabled, .reui-dark .reui-slider-handle.reui-disabled {
      box-shadow: none;
      background-color: rgba(87, 87, 87, 0.5);
      color: rgba(212, 212, 212, 0.5); }
      .reui-dark .reui-slider-handle:disabled.reui-active, .reui-dark .reui-slider-handle.reui-disabled.reui-active {
        background: rgba(87, 87, 87, 0.7); }
    .reui-dark .reui-slider-handle .reui-button-spinner .reui-spinner-head {
      background: rgba(16, 22, 26, 0.5);
      stroke: #a6a6a6; }
    .reui-dark .reui-slider-handle, .reui-dark .reui-slider-handle:hover {
      background-color: #575757; }
    .reui-dark .reui-slider-handle.reui-active {
      background-color: #404040; }
  .reui-dark .reui-disabled .reui-slider-handle {
    border-color: #808080;
    box-shadow: none;
    background: #808080; }
  .reui-slider-handle .reui-slider-label {
    margin-left: 8px;
    border-radius: 0;
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 2px 4px rgba(16, 22, 26, 0.2), 0 8px 24px rgba(16, 22, 26, 0.2);
    background: #575757;
    color: #fafafa; }
    .reui-dark .reui-slider-handle .reui-slider-label {
      box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 2px 4px rgba(16, 22, 26, 0.4), 0 8px 24px rgba(16, 22, 26, 0.4);
      background: #ebebeb;
      color: #575757; }
    .reui-disabled .reui-slider-handle .reui-slider-label {
      box-shadow: none; }
  .reui-slider-handle.reui-start, .reui-slider-handle.reui-end {
    width: 8px; }
  .reui-slider-handle.reui-start {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0; }
  .reui-slider-handle.reui-end {
    margin-left: 8px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0; }
    .reui-slider-handle.reui-end .reui-slider-label {
      margin-left: 0; }

.reui-slider-label {
  transform: translate(-50%, 20px);
  display: inline-block;
  position: absolute;
  padding: 2px 5px;
  vertical-align: top;
  line-height: 1;
  font-size: 12px; }

.reui-slider.reui-vertical {
  width: 40px;
  min-width: 40px;
  height: 150px; }
  .reui-slider.reui-vertical .reui-slider-track,
  .reui-slider.reui-vertical .reui-slider-progress {
    top: 0;
    bottom: 0;
    left: 5px;
    width: 6px;
    height: auto; }
  .reui-slider.reui-vertical .reui-slider-progress {
    top: auto; }
  .reui-slider.reui-vertical .reui-slider-label {
    transform: translate(20px, 50%); }
  .reui-slider.reui-vertical .reui-slider-handle {
    top: auto; }
    .reui-slider.reui-vertical .reui-slider-handle .reui-slider-label {
      margin-top: -8px;
      margin-left: 0; }
    .reui-slider.reui-vertical .reui-slider-handle.reui-end, .reui-slider.reui-vertical .reui-slider-handle.reui-start {
      margin-left: 0;
      width: 16px;
      height: 8px; }
    .reui-slider.reui-vertical .reui-slider-handle.reui-start {
      border-top-left-radius: 0;
      border-bottom-right-radius: 0; }
      .reui-slider.reui-vertical .reui-slider-handle.reui-start .reui-slider-label {
        transform: translate(20px); }
    .reui-slider.reui-vertical .reui-slider-handle.reui-end {
      margin-bottom: 8px;
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
      border-bottom-right-radius: 0; }

@keyframes pt-spinner-animation {
  from {
    transform: rotate(0deg); }
  to {
    transform: rotate(360deg); } }

.reui-spinner {
  overflow: visible;
  vertical-align: middle;
  animation: pt-spinner-animation 500ms linear infinite; }
  .reui-spinner svg {
    display: block; }
  .reui-spinner path {
    fill-opacity: 0; }
  .reui-spinner .reui-spinner-head {
    transform-origin: center;
    transition: stroke-dashoffset 200ms cubic-bezier(0.4, 1, 0.75, 0.9);
    stroke: rgba(128, 128, 128, 0.8);
    stroke-linecap: round; }
  .reui-spinner .reui-spinner-track {
    stroke: rgba(128, 128, 128, 0.2); }
  .reui-spinner.reui-no-spin {
    animation: none; }

.reui-dark .reui-spinner .reui-spinner-head {
  stroke: #a6a6a6; }

.reui-dark .reui-spinner .reui-spinner-track {
  stroke: rgba(16, 22, 26, 0.5); }

.reui-spinner.reui-intent-primary .reui-spinner-head {
  stroke: #137cbd; }

.reui-spinner.reui-intent-success .reui-spinner-head {
  stroke: #0f9960; }

.reui-spinner.reui-intent-warning .reui-spinner-head {
  stroke: #d9822b; }

.reui-spinner.reui-intent-danger .reui-spinner-head {
  stroke: #db3737; }

/*
Panels

Markup:
<div class="reui-tabs {{.modifier}}">
  <div class="reui-heading">Panel Heading</div>
  We build products that make people better at their most important work.
</div>

.reui-elevation-0 - Ground floor. This level provides just a gentle border shadow.
.reui-elevation-1 - First. Subtle drop shadow intended for static containers.
.reui-elevation-2 - Second. An even stronger shadow, moving on up.
.reui-elevation-3 - Third. For containers overlaying content temporarily.
.reui-elevation-4 - Fourth. The strongest shadow, usually for overlay containers on top of backdrops.
.reui-interactive - On hover, increase highlight.

Styleguide tabs
*/
.reui-tabs {
  border-radius: 0;
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.175), 0 0 0 rgba(16, 22, 26, 0), 0 0 0 rgba(16, 22, 26, 0);
  background-color: #ffffff;
  padding: 0;
  transition: transform 200ms cubic-bezier(0.4, 1, 0.75, 0.9), box-shadow 200ms cubic-bezier(0.4, 1, 0.75, 0.9), background-color 200ms cubic-bezier(0.4, 1, 0.75, 0.9); }
  .reui-tabs > .reui-tabs-header {
    background-color: #f0f0f0;
    box-shadow: 0 1px rgba(16, 22, 26, 0.175);
    transition: background-color 200ms cubic-bezier(0.4, 1, 0.75, 0.9); }
    .reui-dark .reui-tabs > .reui-tabs-header {
      background-color: #4d4d4d;
      box-shadow: 0 1px rgba(16, 22, 26, 0.175); }
    .reui-tabs > .reui-tabs-header > .reui-tab-header {
      position: relative;
      margin-top: 4px;
      font-size: 14.3px;
      font-weight: 200;
      padding: 5px 30px 5px 30px;
      transition: background-color 200ms cubic-bezier(0.4, 1, 0.75, 0.9);
      cursor: pointer;
      z-index: 1; }
      .reui-tabs > .reui-tabs-header > .reui-tab-header:not(:first-child):before {
        position: absolute;
        content: "";
        background-color: #a6a6a6;
        top: 2px;
        bottom: 6px;
        right: 100%;
        width: 1px;
        z-index: 1; }
        .reui-dark .reui-tabs > .reui-tabs-header > .reui-tab-header:not(:first-child):before {
          background-color: #4d4d4d; }
      .reui-tabs > .reui-tabs-header > .reui-tab-header:after {
        position: absolute;
        content: "";
        background-color: #a6a6a6;
        top: 2px;
        bottom: 6px;
        left: calc(100% - 1px);
        width: 1px;
        z-index: 1; }
        .reui-dark .reui-tabs > .reui-tabs-header > .reui-tab-header:after {
          background-color: #4d4d4d; }
      .reui-tabs > .reui-tabs-header > .reui-tab-header:active, .reui-tabs > .reui-tabs-header > .reui-tab-header:hover {
        background-color: #e6e6e6;
        box-shadow: 0 -4px #a6a6a6; }
        .reui-tabs > .reui-tabs-header > .reui-tab-header:active:before, .reui-tabs > .reui-tabs-header > .reui-tab-header:hover:before {
          top: -4px;
          bottom: 0; }
        .reui-tabs > .reui-tabs-header > .reui-tab-header:active:after, .reui-tabs > .reui-tabs-header > .reui-tab-header:hover:after {
          top: -4px;
          bottom: 0; }
        .reui-dark .reui-tabs > .reui-tabs-header > .reui-tab-header:active, .reui-dark .reui-tabs > .reui-tabs-header > .reui-tab-header:hover {
          background-color: #333333; }
      .reui-tabs > .reui-tabs-header > .reui-tab-header.reui-tab-header-active {
        background-color: #ffffff;
        box-shadow: 0 -4px #808080, 0 1px #ffffff; }
        .reui-tabs > .reui-tabs-header > .reui-tab-header.reui-tab-header-active:before {
          top: -4px;
          background-color: #808080;
          bottom: 0; }
          .reui-dark .reui-tabs > .reui-tabs-header > .reui-tab-header.reui-tab-header-active:before {
            background-color: #404040; }
        .reui-tabs > .reui-tabs-header > .reui-tab-header.reui-tab-header-active:after {
          top: -4px;
          background-color: #808080;
          bottom: 0; }
          .reui-dark .reui-tabs > .reui-tabs-header > .reui-tab-header.reui-tab-header-active:after {
            background-color: #404040; }
        .reui-dark .reui-tabs > .reui-tabs-header > .reui-tab-header.reui-tab-header-active {
          background-color: #4d4d4d;
          box-shadow: 0 -4px #404040, 0 1px #4d4d4d; }
  .reui-tabs.reui-dark,
  .reui-dark .reui-tabs {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4), 0 0 0 rgba(16, 22, 26, 0), 0 0 0 rgba(16, 22, 26, 0);
    background-color: #4d4d4d; }

.reui-elevation-0 {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.175), 0 0 0 rgba(16, 22, 26, 0), 0 0 0 rgba(16, 22, 26, 0); }
  .reui-elevation-0.reui-dark,
  .reui-dark .reui-elevation-0 {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.4), 0 0 0 rgba(16, 22, 26, 0), 0 0 0 rgba(16, 22, 26, 0); }

.reui-elevation-1 {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 0 0 rgba(16, 22, 26, 0), 0 1px 1px rgba(16, 22, 26, 0.2); }
  .reui-elevation-1.reui-dark,
  .reui-dark .reui-elevation-1 {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 0 0 rgba(16, 22, 26, 0), 0 1px 1px rgba(16, 22, 26, 0.4); }

.reui-elevation-2 {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 1px 1px rgba(16, 22, 26, 0.2), 0 2px 6px rgba(16, 22, 26, 0.2); }
  .reui-elevation-2.reui-dark,
  .reui-dark .reui-elevation-2 {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 1px 1px rgba(16, 22, 26, 0.4), 0 2px 6px rgba(16, 22, 26, 0.4); }

.reui-elevation-3 {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 2px 4px rgba(16, 22, 26, 0.2), 0 8px 24px rgba(16, 22, 26, 0.2); }
  .reui-elevation-3.reui-dark,
  .reui-dark .reui-elevation-3 {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 2px 4px rgba(16, 22, 26, 0.4), 0 8px 24px rgba(16, 22, 26, 0.4); }

.reui-elevation-4 {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 4px 8px rgba(16, 22, 26, 0.2), 0 18px 46px 6px rgba(16, 22, 26, 0.2); }
  .reui-elevation-4.reui-dark,
  .reui-dark .reui-elevation-4 {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 4px 8px rgba(16, 22, 26, 0.4), 0 18px 46px 6px rgba(16, 22, 26, 0.4); }

.reui-tabs.reui-interactive:hover {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 2px 4px rgba(16, 22, 26, 0.2), 0 8px 24px rgba(16, 22, 26, 0.2); }
  .reui-tabs.reui-interactive:hover > .reui-tabs-header {
    background-color: #e3e3e3; }
    .reui-dark .reui-tabs.reui-interactive:hover > .reui-tabs-header {
      background-color: #404040; }
  .reui-tabs.reui-interactive:hover.reui-dark,
  .reui-dark .reui-tabs.reui-interactive:hover {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 2px 4px rgba(16, 22, 26, 0.4), 0 8px 24px rgba(16, 22, 26, 0.4); }

/*
Tags

Markup:
<span class="reui-tag {{.modifier}}">125</span>
<span class="reui-tag {{.modifier}}">Done</span>
<span class="reui-tag {{.modifier}}">
  Tracking
  <button class="reui-tag-remove"></button>
</span>
<span class="reui-tag {{.modifier}}">
  Crushed
  <button class="reui-tag-remove"></button>
</span>
<span class="reui-tag {{.modifier}}">
  A rather long string of text that wraps to multiple lines
  demonstrates the position of the remove button.
  <button class="reui-tag-remove"></button>
</span>

.reui-large - Large
.reui-minimal - Minimal appearance
.reui-round - Rounded corners, ideal for badges
.reui-interactive - Hover and active effects
.reui-intent-primary - Primary intent
.reui-intent-success - Success intent
.reui-intent-warning - Warning intent
.reui-intent-danger  - Danger intent

Styleguide tag
*/
.reui-tag {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  position: relative;
  border: none;
  border-radius: 0;
  box-shadow: none;
  background-color: #808080;
  min-width: 20px;
  max-width: 100%;
  min-height: 20px;
  padding: 2px 6px;
  color: #fafafa;
  font-size: 12px;
  line-height: 1.4; }
  .reui-tag.reui-interactive {
    cursor: pointer; }
    .reui-tag.reui-interactive:hover {
      background-color: rgba(128, 128, 128, 0.85); }
    .reui-tag.reui-interactive.reui-active, .reui-tag.reui-interactive:active {
      background-color: rgba(128, 128, 128, 0.7); }
  .reui-tag > * {
    flex-grow: 0;
    flex-shrink: 0; }
  .reui-tag > .reui-fill {
    flex-grow: 1;
    flex-shrink: 1; }
  .reui-tag::before,
  .reui-tag > * {
    margin-right: 4px; }
  .reui-tag:empty::before,
  .reui-tag > :last-child {
    margin-right: 0; }
  .reui-tag * {
    line-height: 1.4; }
  .reui-tag:focus {
    outline: rgba(19, 124, 189, 0.6) auto 2px;
    outline-offset: 0;
    -moz-outline-radius: 6px; }
  .reui-tag.reui-round {
    border-radius: 30px;
    padding-right: 8px;
    padding-left: 8px; }
  .reui-dark .reui-tag {
    background-color: #d4d4d4;
    color: #444; }
    .reui-dark .reui-tag.reui-interactive {
      cursor: pointer; }
      .reui-dark .reui-tag.reui-interactive:hover {
        background-color: rgba(212, 212, 212, 0.85); }
      .reui-dark .reui-tag.reui-interactive.reui-active, .reui-dark .reui-tag.reui-interactive:active {
        background-color: rgba(212, 212, 212, 0.7); }
    .reui-dark .reui-tag > .reui-icon, .reui-dark .reui-tag .reui-icon-standard, .reui-dark .reui-tag .reui-icon-large {
      fill: currentColor; }
  .reui-tag > .reui-icon, .reui-tag .reui-icon-standard, .reui-tag .reui-icon-large {
    flex: 0 0 auto;
    fill: #ffffff; }
  .reui-tag.reui-large,
  .reui-large .reui-tag {
    min-width: 30px;
    min-height: 30px;
    padding: 0 10px;
    font-size: 13px; }
    .reui-tag.reui-large::before,
    .reui-tag.reui-large > *,
    .reui-large .reui-tag::before,
    .reui-large .reui-tag > * {
      margin-right: 7px; }
    .reui-tag.reui-large:empty::before,
    .reui-tag.reui-large > :last-child,
    .reui-large .reui-tag:empty::before,
    .reui-large .reui-tag > :last-child {
      margin-right: 0; }
    .reui-tag.reui-large.reui-round,
    .reui-large .reui-tag.reui-round {
      padding-right: 12px;
      padding-left: 12px; }
  .reui-tag.reui-intent-primary {
    background: #137cbd;
    color: #ffffff; }
    .reui-tag.reui-intent-primary.reui-interactive {
      cursor: pointer; }
      .reui-tag.reui-intent-primary.reui-interactive:hover {
        background-color: rgba(19, 124, 189, 0.85); }
      .reui-tag.reui-intent-primary.reui-interactive.reui-active, .reui-tag.reui-intent-primary.reui-interactive:active {
        background-color: rgba(19, 124, 189, 0.7); }
  .reui-tag.reui-intent-success {
    background: #0f9960;
    color: #ffffff; }
    .reui-tag.reui-intent-success.reui-interactive {
      cursor: pointer; }
      .reui-tag.reui-intent-success.reui-interactive:hover {
        background-color: rgba(15, 153, 96, 0.85); }
      .reui-tag.reui-intent-success.reui-interactive.reui-active, .reui-tag.reui-intent-success.reui-interactive:active {
        background-color: rgba(15, 153, 96, 0.7); }
  .reui-tag.reui-intent-warning {
    background: #d9822b;
    color: #ffffff; }
    .reui-tag.reui-intent-warning.reui-interactive {
      cursor: pointer; }
      .reui-tag.reui-intent-warning.reui-interactive:hover {
        background-color: rgba(217, 130, 43, 0.85); }
      .reui-tag.reui-intent-warning.reui-interactive.reui-active, .reui-tag.reui-intent-warning.reui-interactive:active {
        background-color: rgba(217, 130, 43, 0.7); }
  .reui-tag.reui-intent-danger {
    background: #db3737;
    color: #ffffff; }
    .reui-tag.reui-intent-danger.reui-interactive {
      cursor: pointer; }
      .reui-tag.reui-intent-danger.reui-interactive:hover {
        background-color: rgba(219, 55, 55, 0.85); }
      .reui-tag.reui-intent-danger.reui-interactive.reui-active, .reui-tag.reui-intent-danger.reui-interactive:active {
        background-color: rgba(219, 55, 55, 0.7); }
  .reui-tag.reui-minimal > .reui-icon, .reui-tag.reui-minimal .reui-icon-standard, .reui-tag.reui-minimal .reui-icon-large {
    fill: #808080; }
  .reui-tag.reui-minimal:not([class*="reui-intent-"]) {
    background-color: rgba(166, 166, 166, 0.2);
    color: #444; }
    .reui-tag.reui-minimal:not([class*="reui-intent-"]).reui-interactive {
      cursor: pointer; }
      .reui-tag.reui-minimal:not([class*="reui-intent-"]).reui-interactive:hover {
        background-color: rgba(128, 128, 128, 0.3); }
      .reui-tag.reui-minimal:not([class*="reui-intent-"]).reui-interactive.reui-active, .reui-tag.reui-minimal:not([class*="reui-intent-"]).reui-interactive:active {
        background-color: rgba(128, 128, 128, 0.4); }
    .reui-dark .reui-tag.reui-minimal:not([class*="reui-intent-"]) {
      color: #fafafa; }
      .reui-dark .reui-tag.reui-minimal:not([class*="reui-intent-"]).reui-interactive {
        cursor: pointer; }
        .reui-dark .reui-tag.reui-minimal:not([class*="reui-intent-"]).reui-interactive:hover {
          background-color: rgba(212, 212, 212, 0.3); }
        .reui-dark .reui-tag.reui-minimal:not([class*="reui-intent-"]).reui-interactive.reui-active, .reui-dark .reui-tag.reui-minimal:not([class*="reui-intent-"]).reui-interactive:active {
          background-color: rgba(212, 212, 212, 0.4); }
      .reui-dark .reui-tag.reui-minimal:not([class*="reui-intent-"]) > .reui-icon, .reui-dark .reui-tag.reui-minimal:not([class*="reui-intent-"]) .reui-icon-standard, .reui-dark .reui-tag.reui-minimal:not([class*="reui-intent-"]) .reui-icon-large {
        fill: #d4d4d4; }
  .reui-tag.reui-minimal.reui-intent-primary {
    background-color: rgba(19, 124, 189, 0.15);
    color: #106ba3; }
    .reui-tag.reui-minimal.reui-intent-primary.reui-interactive {
      cursor: pointer; }
      .reui-tag.reui-minimal.reui-intent-primary.reui-interactive:hover {
        background-color: rgba(19, 124, 189, 0.25); }
      .reui-tag.reui-minimal.reui-intent-primary.reui-interactive.reui-active, .reui-tag.reui-minimal.reui-intent-primary.reui-interactive:active {
        background-color: rgba(19, 124, 189, 0.35); }
    .reui-tag.reui-minimal.reui-intent-primary > .reui-icon, .reui-tag.reui-minimal.reui-intent-primary .reui-icon-standard, .reui-tag.reui-minimal.reui-intent-primary .reui-icon-large {
      fill: #137cbd; }
    .reui-dark .reui-tag.reui-minimal.reui-intent-primary {
      background-color: rgba(19, 124, 189, 0.25);
      color: #48aff0; }
      .reui-dark .reui-tag.reui-minimal.reui-intent-primary.reui-interactive {
        cursor: pointer; }
        .reui-dark .reui-tag.reui-minimal.reui-intent-primary.reui-interactive:hover {
          background-color: rgba(19, 124, 189, 0.35); }
        .reui-dark .reui-tag.reui-minimal.reui-intent-primary.reui-interactive.reui-active, .reui-dark .reui-tag.reui-minimal.reui-intent-primary.reui-interactive:active {
          background-color: rgba(19, 124, 189, 0.45); }
  .reui-tag.reui-minimal.reui-intent-success {
    background-color: rgba(15, 153, 96, 0.15);
    color: #0d8050; }
    .reui-tag.reui-minimal.reui-intent-success.reui-interactive {
      cursor: pointer; }
      .reui-tag.reui-minimal.reui-intent-success.reui-interactive:hover {
        background-color: rgba(15, 153, 96, 0.25); }
      .reui-tag.reui-minimal.reui-intent-success.reui-interactive.reui-active, .reui-tag.reui-minimal.reui-intent-success.reui-interactive:active {
        background-color: rgba(15, 153, 96, 0.35); }
    .reui-tag.reui-minimal.reui-intent-success > .reui-icon, .reui-tag.reui-minimal.reui-intent-success .reui-icon-standard, .reui-tag.reui-minimal.reui-intent-success .reui-icon-large {
      fill: #0f9960; }
    .reui-dark .reui-tag.reui-minimal.reui-intent-success {
      background-color: rgba(15, 153, 96, 0.25);
      color: #3dcc91; }
      .reui-dark .reui-tag.reui-minimal.reui-intent-success.reui-interactive {
        cursor: pointer; }
        .reui-dark .reui-tag.reui-minimal.reui-intent-success.reui-interactive:hover {
          background-color: rgba(15, 153, 96, 0.35); }
        .reui-dark .reui-tag.reui-minimal.reui-intent-success.reui-interactive.reui-active, .reui-dark .reui-tag.reui-minimal.reui-intent-success.reui-interactive:active {
          background-color: rgba(15, 153, 96, 0.45); }
  .reui-tag.reui-minimal.reui-intent-warning {
    background-color: rgba(217, 130, 43, 0.15);
    color: #bf7326; }
    .reui-tag.reui-minimal.reui-intent-warning.reui-interactive {
      cursor: pointer; }
      .reui-tag.reui-minimal.reui-intent-warning.reui-interactive:hover {
        background-color: rgba(217, 130, 43, 0.25); }
      .reui-tag.reui-minimal.reui-intent-warning.reui-interactive.reui-active, .reui-tag.reui-minimal.reui-intent-warning.reui-interactive:active {
        background-color: rgba(217, 130, 43, 0.35); }
    .reui-tag.reui-minimal.reui-intent-warning > .reui-icon, .reui-tag.reui-minimal.reui-intent-warning .reui-icon-standard, .reui-tag.reui-minimal.reui-intent-warning .reui-icon-large {
      fill: #d9822b; }
    .reui-dark .reui-tag.reui-minimal.reui-intent-warning {
      background-color: rgba(217, 130, 43, 0.25);
      color: #ffb366; }
      .reui-dark .reui-tag.reui-minimal.reui-intent-warning.reui-interactive {
        cursor: pointer; }
        .reui-dark .reui-tag.reui-minimal.reui-intent-warning.reui-interactive:hover {
          background-color: rgba(217, 130, 43, 0.35); }
        .reui-dark .reui-tag.reui-minimal.reui-intent-warning.reui-interactive.reui-active, .reui-dark .reui-tag.reui-minimal.reui-intent-warning.reui-interactive:active {
          background-color: rgba(217, 130, 43, 0.45); }
  .reui-tag.reui-minimal.reui-intent-danger {
    background-color: rgba(219, 55, 55, 0.15);
    color: #c23030; }
    .reui-tag.reui-minimal.reui-intent-danger.reui-interactive {
      cursor: pointer; }
      .reui-tag.reui-minimal.reui-intent-danger.reui-interactive:hover {
        background-color: rgba(219, 55, 55, 0.25); }
      .reui-tag.reui-minimal.reui-intent-danger.reui-interactive.reui-active, .reui-tag.reui-minimal.reui-intent-danger.reui-interactive:active {
        background-color: rgba(219, 55, 55, 0.35); }
    .reui-tag.reui-minimal.reui-intent-danger > .reui-icon, .reui-tag.reui-minimal.reui-intent-danger .reui-icon-standard, .reui-tag.reui-minimal.reui-intent-danger .reui-icon-large {
      fill: #db3737; }
    .reui-dark .reui-tag.reui-minimal.reui-intent-danger {
      background-color: rgba(219, 55, 55, 0.25);
      color: #ff7373; }
      .reui-dark .reui-tag.reui-minimal.reui-intent-danger.reui-interactive {
        cursor: pointer; }
        .reui-dark .reui-tag.reui-minimal.reui-intent-danger.reui-interactive:hover {
          background-color: rgba(219, 55, 55, 0.35); }
        .reui-dark .reui-tag.reui-minimal.reui-intent-danger.reui-interactive.reui-active, .reui-dark .reui-tag.reui-minimal.reui-intent-danger.reui-interactive:active {
          background-color: rgba(219, 55, 55, 0.45); }

.reui-tag-remove {
  opacity: 0.5;
  margin-top: -2px;
  margin-right: -6px !important;
  margin-bottom: -2px;
  border: none;
  background: none;
  cursor: pointer;
  padding: 2px;
  padding-left: 0;
  color: inherit; }
  .reui-tag-remove:hover {
    opacity: 0.8;
    background: none;
    text-decoration: none; }
  .reui-tag-remove:active {
    opacity: 1; }
  .reui-tag-remove:empty::before {
    line-height: 1;
    font-family: "Icons16", sans-serif;
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    content: ""; }
  .reui-large .reui-tag-remove {
    margin-right: -10px !important;
    padding: 5px;
    padding-left: 0; }
    .reui-large .reui-tag-remove:empty::before {
      line-height: 1;
      font-family: "Icons20", sans-serif;
      font-size: 20px;
      font-weight: 400;
      font-style: normal; }

/*
CSS `border` property issues:
- An element can only have one border.
- Borders can't stack with shadows.
- Borders modify the size of the element they're applied to.
- Border positioning requires the extra `box-sizing` property.

`box-shadow` doesn't have these issues, we're using it instead of `border`.
*/
/*
Overlay shadows are used for default buttons
floating on top of other elements. This way, the
shadows blend with the colors beneath it.
Switches and slider handles both use these variables.
*/
.reui-tag-input {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  cursor: text;
  height: auto;
  min-height: 30px;
  padding-right: 0;
  padding-left: 5px;
  line-height: inherit; }
  .reui-tag-input > * {
    flex-grow: 0;
    flex-shrink: 0; }
  .reui-tag-input > .reui-tag-input-values {
    flex-grow: 1;
    flex-shrink: 1; }
  .reui-tag-input .reui-tag-input-icon {
    margin-top: 7px;
    margin-right: 7px;
    margin-left: 2px;
    color: #808080; }
  .reui-tag-input .reui-tag-input-values {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    align-self: stretch;
    margin-top: 5px;
    margin-right: 7px; }
    .reui-tag-input .reui-tag-input-values > * {
      flex-grow: 0;
      flex-shrink: 0; }
    .reui-tag-input .reui-tag-input-values > .reui-fill {
      flex-grow: 1;
      flex-shrink: 1; }
    .reui-tag-input .reui-tag-input-values::before,
    .reui-tag-input .reui-tag-input-values > * {
      margin-right: 5px; }
    .reui-tag-input .reui-tag-input-values:empty::before,
    .reui-tag-input .reui-tag-input-values > :last-child {
      margin-right: 0; }
    .reui-tag-input .reui-tag-input-values > * {
      margin-bottom: 5px; }
  .reui-tag-input .reui-tag {
    overflow-wrap: break-word; }
    .reui-tag-input .reui-tag.reui-active {
      outline: rgba(19, 124, 189, 0.6) auto 2px;
      outline-offset: 0;
      -moz-outline-radius: 6px; }
  .reui-tag-input .reui-input-ghost {
    flex: 1 1 auto;
    width: 80px;
    line-height: 20px; }
    .reui-tag-input .reui-input-ghost:disabled, .reui-tag-input .reui-input-ghost.reui-disabled {
      cursor: not-allowed; }
  .reui-tag-input .reui-button,
  .reui-tag-input .reui-spinner {
    margin: 3px;
    margin-left: 0; }
  .reui-tag-input .reui-button {
    min-width: 24px;
    min-height: 24px;
    padding: 0 7px;
    line-height: 1.75; }
  .reui-tag-input.reui-large {
    height: auto;
    min-height: 40px; }
    .reui-tag-input.reui-large::before,
    .reui-tag-input.reui-large > * {
      margin-right: 10px; }
    .reui-tag-input.reui-large:empty::before,
    .reui-tag-input.reui-large > :last-child {
      margin-right: 0; }
    .reui-tag-input.reui-large .reui-tag-input-icon {
      margin-top: 10px;
      margin-left: 5px; }
    .reui-tag-input.reui-large .reui-input-ghost {
      line-height: 30px; }
    .reui-tag-input.reui-large .reui-button {
      min-width: 30px;
      min-height: 30px;
      padding: 5px 10px;
      margin: 5px;
      margin-left: 0; }
    .reui-tag-input.reui-large .reui-spinner {
      margin: 8px;
      margin-left: 0; }
  .reui-tag-input.reui-active {
    box-shadow: 0 0 0 1px #137cbd, 0 0 0 3px rgba(19, 124, 189, 0.3), inset 0 1px 1px rgba(16, 22, 26, 0.2);
    background-color: #ffffff; }
  .reui-dark .reui-tag-input .reui-tag-input-icon, .reui-tag-input.reui-dark .reui-tag-input-icon {
    color: #d4d4d4; }
  .reui-dark .reui-tag-input .reui-input-ghost, .reui-tag-input.reui-dark .reui-input-ghost {
    color: #fafafa; }
    .reui-dark .reui-tag-input .reui-input-ghost::placeholder, .reui-tag-input.reui-dark .reui-input-ghost::placeholder {
      color: rgba(212, 212, 212, 0.5); }
  .reui-dark .reui-tag-input.reui-active, .reui-tag-input.reui-dark.reui-active {
    box-shadow: 0 0 0 1px #137cbd, 0 0 0 1px #137cbd, 0 0 0 3px rgba(19, 124, 189, 0.3), inset 0 0 0 1px rgba(16, 22, 26, 0.45);
    background-color: rgba(16, 22, 26, 0.3); }

.reui-input-ghost {
  border: none;
  box-shadow: none;
  background: none;
  padding: 0; }
  .reui-input-ghost::placeholder {
    opacity: 1;
    color: rgba(128, 128, 128, 0.5); }
  .reui-input-ghost:focus {
    outline: none !important; }

/*
A mixin to generate the classes for a React CSSTransition which animates any number of CSS
properties at once.

Transitioned properties are specificed as a map of property names to lists of (inital value, final
value). For enter & appear transitions, each property will transition from its initial to its final
value. For exit transitions, each property will transition in reverse, from final to initial.

**Simple example:**
`@include react-transition("popover", (opacity: 0 1), $before: "&");`
Transition named "popover" moves opacity from 0 to 1. `"&"` indicates that the
Transition classes are expected to be applied to this element, where the mixin is invoked.

**Params:**
$name: React transitionName prop
$properties: map of CSS property to (initial, final) values
$duration: transition duration
$easing: transition easing function
$delay: transition delay
$before: selector text to insert before transition name (often to select self: &)
$after: selector text to insert after transiton name (to select children)
*/
/*
A mixin to generate the classes for one phase of a React CSSTransition.
`$phase` must be `appear` or `enter` or `exit`.
If `enter` phase is given then `appear` phase will be generated at the same time.
If `exit` phase is given then property values are animated in reverse, from final to initial.

**Example:**
@include react-transition-phase(toast, enter, $enter-translate, $before: "&");
@include react-transition-phase(toast, leave, $leave-blur, $pt-transition-duration * 3, $before: "&");
*/
/*
Given map of properties to values, set each property to the value at the given index.
(remember that sass indices are 1-based).

Example: `each-prop((opacity: 0 1), 2)` will print "opacity: 1"
*/
/*
Format transition class name with all the bits.
"enter" phase will include "appear" phase in returned name.
*/
.reui-toast {
  display: flex;
  align-items: flex-start;
  position: relative !important;
  margin: 20px 0 0;
  border-radius: 0;
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 2px 4px rgba(16, 22, 26, 0.2), 0 8px 24px rgba(16, 22, 26, 0.2);
  background-color: #ffffff;
  min-width: 300px;
  max-width: 500px;
  pointer-events: all; }
  .reui-toast.reui-toast-enter, .reui-toast.reui-toast-appear {
    transform: translateY(-40px); }
  .reui-toast.reui-toast-enter-active, .reui-toast.reui-toast-appear-active {
    transform: translateY(0);
    transition-property: transform;
    transition-duration: 300ms;
    transition-timing-function: cubic-bezier(0.54, 1.12, 0.38, 1.11);
    transition-delay: 0; }
  .reui-toast.reui-toast-enter ~ .reui-toast, .reui-toast.reui-toast-appear ~ .reui-toast {
    transform: translateY(-40px); }
  .reui-toast.reui-toast-enter-active ~ .reui-toast, .reui-toast.reui-toast-appear-active ~ .reui-toast {
    transform: translateY(0);
    transition-property: transform;
    transition-duration: 300ms;
    transition-timing-function: cubic-bezier(0.54, 1.12, 0.38, 1.11);
    transition-delay: 0; }
  .reui-toast.reui-toast-exit {
    opacity: 1;
    filter: blur(0); }
  .reui-toast.reui-toast-exit-active {
    opacity: 0;
    filter: blur(10px);
    transition-property: opacity, filter;
    transition-duration: 300ms;
    transition-timing-function: cubic-bezier(0.4, 1, 0.75, 0.9);
    transition-delay: 0; }
  .reui-toast.reui-toast-exit ~ .reui-toast {
    transform: translateY(0); }
  .reui-toast.reui-toast-exit-active ~ .reui-toast {
    transform: translateY(-40px);
    transition-property: transform;
    transition-duration: 100ms;
    transition-timing-function: cubic-bezier(0.4, 1, 0.75, 0.9);
    transition-delay: 50ms; }
  .reui-toast .reui-button-group {
    flex: 0 0 auto;
    padding: 5px;
    padding-left: 0; }
  .reui-toast > .reui-icon {
    margin: 12px;
    margin-right: 0;
    color: #808080; }
  .reui-toast.reui-dark,
  .reui-dark .reui-toast {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 2px 4px rgba(16, 22, 26, 0.4), 0 8px 24px rgba(16, 22, 26, 0.4);
    background-color: #575757; }
    .reui-toast.reui-dark > .reui-icon,
    .reui-dark .reui-toast > .reui-icon {
      color: #d4d4d4; }
  .reui-toast[class*="reui-intent-"] a {
    color: rgba(255, 255, 255, 0.7); }
    .reui-toast[class*="reui-intent-"] a:hover {
      color: #ffffff; }
  .reui-toast[class*="reui-intent-"] > .reui-icon {
    color: #ffffff; }
  .reui-toast[class*="reui-intent-"] .reui-button, .reui-toast[class*="reui-intent-"] .reui-button::before,
  .reui-toast[class*="reui-intent-"] .reui-button .reui-icon, .reui-toast[class*="reui-intent-"] .reui-button:active {
    color: rgba(255, 255, 255, 0.7) !important; }
  .reui-toast[class*="reui-intent-"] .reui-button:focus {
    outline-color: rgba(255, 255, 255, 0.5); }
  .reui-toast[class*="reui-intent-"] .reui-button:hover {
    background-color: rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important; }
  .reui-toast[class*="reui-intent-"] .reui-button:active {
    background-color: rgba(255, 255, 255, 0.3) !important;
    color: #ffffff !important; }
  .reui-toast[class*="reui-intent-"] .reui-button::after {
    background: rgba(255, 255, 255, 0.3) !important; }
  .reui-toast.reui-intent-primary {
    background-color: #137cbd;
    color: #ffffff; }
  .reui-toast.reui-intent-success {
    background-color: #0f9960;
    color: #ffffff; }
  .reui-toast.reui-intent-warning {
    background-color: #d9822b;
    color: #ffffff; }
  .reui-toast.reui-intent-danger {
    background-color: #db3737;
    color: #ffffff; }

.reui-toast-message {
  flex: 1 1 auto;
  padding: 11px; }

.reui-toast-container {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  position: fixed;
  right: 0;
  left: 0;
  z-index: 40;
  overflow: hidden;
  padding: 0 20px 20px;
  pointer-events: none; }
  .reui-toast-container.reui-toast-container-top {
    top: 0;
    bottom: auto; }
  .reui-toast-container.reui-toast-container-bottom {
    flex-direction: column-reverse;
    top: auto;
    bottom: 0; }
  .reui-toast-container.reui-toast-container-left {
    align-items: flex-start; }
  .reui-toast-container.reui-toast-container-right {
    align-items: flex-end; }

.reui-toast-container-bottom .reui-toast.reui-toast-enter:not(.reui-toast-enter-active),
.reui-toast-container-bottom .reui-toast.reui-toast-enter:not(.reui-toast-enter-active) ~ .reui-toast,
.reui-toast-container-bottom .reui-toast.reui-toast-leave-active ~ .reui-toast {
  transform: translateY(60px); }

/*
A mixin to generate the classes for a React CSSTransition which animates any number of CSS
properties at once.

Transitioned properties are specificed as a map of property names to lists of (inital value, final
value). For enter & appear transitions, each property will transition from its initial to its final
value. For exit transitions, each property will transition in reverse, from final to initial.

**Simple example:**
`@include react-transition("popover", (opacity: 0 1), $before: "&");`
Transition named "popover" moves opacity from 0 to 1. `"&"` indicates that the
Transition classes are expected to be applied to this element, where the mixin is invoked.

**Params:**
$name: React transitionName prop
$properties: map of CSS property to (initial, final) values
$duration: transition duration
$easing: transition easing function
$delay: transition delay
$before: selector text to insert before transition name (often to select self: &)
$after: selector text to insert after transiton name (to select children)
*/
/*
A mixin to generate the classes for one phase of a React CSSTransition.
`$phase` must be `appear` or `enter` or `exit`.
If `enter` phase is given then `appear` phase will be generated at the same time.
If `exit` phase is given then property values are animated in reverse, from final to initial.

**Example:**
@include react-transition-phase(toast, enter, $enter-translate, $before: "&");
@include react-transition-phase(toast, leave, $leave-blur, $pt-transition-duration * 3, $before: "&");
*/
/*
Given map of properties to values, set each property to the value at the given index.
(remember that sass indices are 1-based).

Example: `each-prop((opacity: 0 1), 2)` will print "opacity: 1"
*/
/*
Format transition class name with all the bits.
"enter" phase will include "appear" phase in returned name.
*/
.reui-tooltip {
  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 2px 4px rgba(16, 22, 26, 0.2), 0 8px 24px rgba(16, 22, 26, 0.2);
  transform: scale(1); }
  .reui-tooltip .reui-popover-arrow {
    position: absolute;
    width: 22px;
    height: 22px; }
    .reui-tooltip .reui-popover-arrow::before {
      margin: 4px;
      width: 14px;
      height: 14px; }
  .reui-tether-element-attached-bottom.reui-tether-target-attached-top > .reui-tooltip {
    margin-top: -11px;
    margin-bottom: 11px; }
    .reui-tether-element-attached-bottom.reui-tether-target-attached-top > .reui-tooltip > .reui-popover-arrow {
      bottom: -8px; }
      .reui-tether-element-attached-bottom.reui-tether-target-attached-top > .reui-tooltip > .reui-popover-arrow svg {
        transform: rotate(-90deg); }
  .reui-tether-element-attached-left.reui-tether-target-attached-right > .reui-tooltip {
    margin-left: 11px; }
    .reui-tether-element-attached-left.reui-tether-target-attached-right > .reui-tooltip > .reui-popover-arrow {
      left: -8px; }
      .reui-tether-element-attached-left.reui-tether-target-attached-right > .reui-tooltip > .reui-popover-arrow svg {
        transform: rotate(0); }
  .reui-tether-element-attached-top.reui-tether-target-attached-bottom > .reui-tooltip {
    margin-top: 11px; }
    .reui-tether-element-attached-top.reui-tether-target-attached-bottom > .reui-tooltip > .reui-popover-arrow {
      top: -8px; }
      .reui-tether-element-attached-top.reui-tether-target-attached-bottom > .reui-tooltip > .reui-popover-arrow svg {
        transform: rotate(90deg); }
  .reui-tether-element-attached-right.reui-tether-target-attached-left > .reui-tooltip {
    margin-right: 11px;
    margin-left: -11px; }
    .reui-tether-element-attached-right.reui-tether-target-attached-left > .reui-tooltip > .reui-popover-arrow {
      right: -8px; }
      .reui-tether-element-attached-right.reui-tether-target-attached-left > .reui-tooltip > .reui-popover-arrow svg {
        transform: rotate(180deg); }
  .reui-tether-element-attached-middle > .reui-tooltip > .reui-popover-arrow {
    top: 50%;
    transform: translateY(-50%); }
  .reui-tether-element-attached-center > .reui-tooltip > .reui-popover-arrow {
    right: 50%;
    transform: translateX(50%); }
  .reui-tether-element-attached-top.reui-tether-target-attached-top > .reui-tooltip > .reui-popover-arrow {
    top: -0.22183px; }
  .reui-tether-element-attached-right.reui-tether-target-attached-right > .reui-tooltip > .reui-popover-arrow {
    right: -0.22183px; }
  .reui-tether-element-attached-left.reui-tether-target-attached-left > .reui-tooltip > .reui-popover-arrow {
    left: -0.22183px; }
  .reui-tether-element-attached-bottom.reui-tether-target-attached-bottom > .reui-tooltip > .reui-popover-arrow {
    bottom: -0.22183px; }
  .reui-tether-element-attached-top.reui-tether-element-attached-left > .reui-tooltip {
    transform-origin: top left; }
  .reui-tether-element-attached-top.reui-tether-element-attached-center > .reui-tooltip {
    transform-origin: top center; }
  .reui-tether-element-attached-top.reui-tether-element-attached-right > .reui-tooltip {
    transform-origin: top right; }
  .reui-tether-element-attached-middle.reui-tether-element-attached-left > .reui-tooltip {
    transform-origin: center left; }
  .reui-tether-element-attached-middle.reui-tether-element-attached-center > .reui-tooltip {
    transform-origin: center center; }
  .reui-tether-element-attached-middle.reui-tether-element-attached-right > .reui-tooltip {
    transform-origin: center right; }
  .reui-tether-element-attached-bottom.reui-tether-element-attached-left > .reui-tooltip {
    transform-origin: bottom left; }
  .reui-tether-element-attached-bottom.reui-tether-element-attached-center > .reui-tooltip {
    transform-origin: bottom center; }
  .reui-tether-element-attached-bottom.reui-tether-element-attached-right > .reui-tooltip {
    transform-origin: bottom right; }
  .reui-tooltip .reui-popover-content {
    background: #575757;
    color: #fafafa; }
  .reui-tooltip .reui-popover-arrow::before {
    box-shadow: 1px 1px 6px rgba(16, 22, 26, 0.2); }
  .reui-tooltip .reui-popover-arrow-border {
    fill: #10161a;
    fill-opacity: 0.1; }
  .reui-tooltip .reui-popover-arrow-fill {
    fill: #575757; }
  .reui-popover-enter > .reui-tooltip, .reui-popover-appear > .reui-tooltip {
    transform: scale(0.8); }
  .reui-popover-enter-active > .reui-tooltip, .reui-popover-appear-active > .reui-tooltip {
    transform: scale(1);
    transition-property: transform;
    transition-duration: 100ms;
    transition-timing-function: cubic-bezier(0.4, 1, 0.75, 0.9);
    transition-delay: 0; }
  .reui-popover-exit > .reui-tooltip {
    transform: scale(1); }
  .reui-popover-exit-active > .reui-tooltip {
    transform: scale(0.8);
    transition-property: transform;
    transition-duration: 100ms;
    transition-timing-function: cubic-bezier(0.4, 1, 0.75, 0.9);
    transition-delay: 0; }
  .reui-tooltip .reui-popover-content {
    padding: 10px 12px; }
  .reui-tooltip.reui-dark,
  .reui-dark .reui-tooltip {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.2), 0 2px 4px rgba(16, 22, 26, 0.4), 0 8px 24px rgba(16, 22, 26, 0.4); }
    .reui-tooltip.reui-dark .reui-popover-content,
    .reui-dark .reui-tooltip .reui-popover-content {
      background: #ebebeb;
      color: #575757; }
    .reui-tooltip.reui-dark .reui-popover-arrow::before,
    .reui-dark .reui-tooltip .reui-popover-arrow::before {
      box-shadow: 1px 1px 6px rgba(16, 22, 26, 0.4); }
    .reui-tooltip.reui-dark .reui-popover-arrow-border,
    .reui-dark .reui-tooltip .reui-popover-arrow-border {
      fill: #10161a;
      fill-opacity: 0.2; }
    .reui-tooltip.reui-dark .reui-popover-arrow-fill,
    .reui-dark .reui-tooltip .reui-popover-arrow-fill {
      fill: #ebebeb; }
  .reui-tooltip.reui-intent-primary .reui-popover-content {
    background: #137cbd;
    color: #ffffff; }
  .reui-tooltip.reui-intent-primary .reui-popover-arrow-fill {
    fill: #137cbd; }
  .reui-tooltip.reui-intent-success .reui-popover-content {
    background: #0f9960;
    color: #ffffff; }
  .reui-tooltip.reui-intent-success .reui-popover-arrow-fill {
    fill: #0f9960; }
  .reui-tooltip.reui-intent-warning .reui-popover-content {
    background: #d9822b;
    color: #ffffff; }
  .reui-tooltip.reui-intent-warning .reui-popover-arrow-fill {
    fill: #d9822b; }
  .reui-tooltip.reui-intent-danger .reui-popover-content {
    background: #db3737;
    color: #ffffff; }
  .reui-tooltip.reui-intent-danger .reui-popover-arrow-fill {
    fill: #db3737; }

.reui-tooltip-indicator {
  border-bottom: dotted 1px;
  cursor: help; }

/*
Trees

Markup:
<div class="reui-tree reui-elevation-0">
  <ul class="reui-tree-node-list reui-tree-root">
    <li class="reui-tree-node reui-tree-node-expanded">
      <div class="reui-tree-node-content">
        <span class="reui-tree-node-caret reui-tree-node-caret-open reui-icon-standard"></span>
        <span class="reui-tree-node-icon reui-icon-standard reui-icon-folder-close"></span>
        <span class="reui-tree-node-label">Label</span>
        <span class="reui-tree-node-secondary-label">Secondary label</span>
      </div>
      <ul class="reui-tree-node-list">
        <li class="reui-tree-node">
          <div class="reui-tree-node-content">
            <span class="reui-tree-node-caret-none reui-icon-standard"></span>
            <span class="reui-tree-node-icon reui-icon-standard reui-icon-document"></span>
          <span class="reui-tree-node-label">A Document</span>
          </div>
        </li>
        <li class="reui-tree-node">
          <div class="reui-tree-node-content">
            <span class="reui-tree-node-caret-none reui-icon-standard"></span>
            <span class="reui-tree-node-icon reui-icon-standard reui-icon-document"></span>
            <span class="reui-tree-node-label">Another Document</span>
          </div>
        </li>
      </ul>
    </li>
  </ul>
</div>

Styleguide tree
*/
.reui-tree-node-list {
  margin: 0;
  padding-left: 0;
  list-style: none; }

.reui-tree-root {
  position: relative;
  background-color: transparent;
  cursor: default;
  padding-left: 0; }

.reui-tree-node-content-0 {
  padding-left: 0px; }

.reui-tree-node-content-1 {
  padding-left: 23px; }

.reui-tree-node-content-2 {
  padding-left: 46px; }

.reui-tree-node-content-3 {
  padding-left: 69px; }

.reui-tree-node-content-4 {
  padding-left: 92px; }

.reui-tree-node-content-5 {
  padding-left: 115px; }

.reui-tree-node-content-6 {
  padding-left: 138px; }

.reui-tree-node-content-7 {
  padding-left: 161px; }

.reui-tree-node-content-8 {
  padding-left: 184px; }

.reui-tree-node-content-9 {
  padding-left: 207px; }

.reui-tree-node-content-10 {
  padding-left: 230px; }

.reui-tree-node-content-11 {
  padding-left: 253px; }

.reui-tree-node-content-12 {
  padding-left: 276px; }

.reui-tree-node-content-13 {
  padding-left: 299px; }

.reui-tree-node-content-14 {
  padding-left: 322px; }

.reui-tree-node-content-15 {
  padding-left: 345px; }

.reui-tree-node-content-16 {
  padding-left: 368px; }

.reui-tree-node-content-17 {
  padding-left: 391px; }

.reui-tree-node-content-18 {
  padding-left: 414px; }

.reui-tree-node-content-19 {
  padding-left: 437px; }

.reui-tree-node-content-20 {
  padding-left: 460px; }

.reui-tree-node-content {
  display: flex;
  align-items: center;
  width: 100%;
  height: 30px;
  padding-right: 5px; }
  .reui-tree-node-content:hover {
    background-color: rgba(212, 212, 212, 0.4); }

.reui-tree-node-caret,
.reui-tree-node-caret-none {
  position: relative;
  min-width: 30px;
  line-height: 30px !important; }

.reui-tree-node-caret {
  color: #808080;
  transform: rotate(0deg);
  cursor: pointer;
  text-align: center;
  transition: transform 200ms cubic-bezier(0.4, 1, 0.75, 0.9); }
  .reui-tree-node-caret:hover {
    color: #444; }
  .reui-dark .reui-tree-node-caret {
    color: #d4d4d4; }
    .reui-dark .reui-tree-node-caret:hover {
      color: #fafafa; }
  .reui-tree-node-caret.reui-tree-node-caret-open {
    transform: rotate(90deg); }
  .reui-tree-node-caret.reui-icon-standard::before {
    content: ""; }
  .reui-tree-node-caret .reui-icon {
    margin: 7px; }

.reui-tree-node-icon {
  position: relative;
  margin-right: 7px;
  color: #808080; }

.reui-tree-node-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  flex: 1 1 auto;
  position: relative;
  user-select: none; }
  .reui-tree-node-label span {
    display: inline; }

.reui-tree-node-secondary-label {
  padding: 0 5px;
  line-height: 30px;
  user-select: none; }

.reui-tree-node.reui-tree-node-selected > .reui-tree-node-content {
  background-color: #137cbd; }
  .reui-tree-node.reui-tree-node-selected > .reui-tree-node-content,
  .reui-tree-node.reui-tree-node-selected > .reui-tree-node-content .reui-icon, .reui-tree-node.reui-tree-node-selected > .reui-tree-node-content .reui-icon-standard, .reui-tree-node.reui-tree-node-selected > .reui-tree-node-content .reui-icon-large {
    color: #ffffff; }
  .reui-tree-node.reui-tree-node-selected > .reui-tree-node-content .reui-tree-node-caret::before {
    color: rgba(255, 255, 255, 0.7); }
  .reui-tree-node.reui-tree-node-selected > .reui-tree-node-content .reui-tree-node-caret:hover::before {
    color: #ffffff; }

.reui-dark .reui-tree-node-content:hover {
  background-color: rgba(128, 128, 128, 0.3); }

.reui-dark .reui-tree-node-icon {
  color: #d4d4d4; }

.reui-dark .reui-tree-node.reui-tree-node-selected > .reui-tree-node-content {
  background-color: #137cbd; }

/*# sourceMappingURL=index.css.map */