@charset "UTF-8";
/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0; }

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0; }

/* Grouping content
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */ }

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent; }

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */ }

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder; }

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%; }

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none; }

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */ }

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible; }

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none; }

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; }

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 0.0625em dotted ButtonText; }

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em; }

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */ }

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline; }

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto; }

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -0.125em;
  /* 2 */ }

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */ }

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block; }

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item; }

/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
  display: none; }

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none; }

/* MAIN-CONTENT*/
[class^="icon-"], [class*=" icon-"] {
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  text-decoration: none;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility; }

[class^="icon-"]::before,
[class*=" icon-"]::before {
  display: inline-block;
  text-decoration: none; }

[dir=rtl] [class^="icon-"] {
  transform: scaleX(-1); }

.icon-size-medium {
  font-size: calc(var(--button-large-icon-size, 1.75rem) * 1.5); }

.icon-size-big {
  font-size: calc(var(--button-large-icon-size, 1.75rem) * 2); }

.icon-empty::before {
  content: " "; }

.icon-success:before {
  content: "\e900"; }

.icon-close:before {
  content: "\e901"; }

.icon-warning:before {
  content: "\e902"; }

.icon-info:before {
  content: "\e903"; }

.icon-help:before {
  content: "\e91e"; }

.icon-next:before {
  content: "\e904"; }

.icon-previous:before {
  content: "\e905"; }

.icon-toggle-close:before {
  content: "\e906";
  font-size: 1.375rem; }

.icon-toggle-open:before {
  content: "\e907";
  font-size: 1.375rem; }

.icon-plus:before {
  content: "\e908"; }

.icon-minus:before {
  content: "\e909"; }

.icon-back:before {
  content: "\e90a"; }

.icon-filter-reset:before,
.icon-error:before {
  content: "\e90b"; }

.icon-upload:before {
  content: "\e90c"; }

.icon-download:before {
  content: "\e90d"; }

.icon-delete:before {
  content: "\e919"; }

.icon-styleguide:before {
  content: "\e90e"; }

.icon-data-save:before {
  content: "\e90f"; }

.icon-home:before {
  content: "\e910"; }

.icon-invoice-details:before {
  content: "\e911"; }

.icon-invoice-party:before {
  content: "\e912"; }

.icon-invoice-recipient:before {
  content: "\e913"; }

.icon-invoice-position:before {
  content: "\e914"; }

.icon-invoice-amount:before {
  content: "\e915"; }

.icon-payment-data:before {
  content: "\e916"; }

.icon-attachment:before {
  content: "\e917"; }

.icon-invoice-finish:before {
  content: "\e918"; }

.icon-invoice-tax-representatives:before {
  content: "\e91a"; }

.icon-invoice-delivery:before {
  content: "\e91b"; }

.icon-settings:before {
  content: "\e91d"; }

.icon-invoice-value-added-tax:before {
  content: "\e91c"; }

.icon-calendar:before {
  content: "\e91f"; }

.icon-user:before {
  content: "\e920"; }

.icon-user-group:before {
  content: "\e921"; }

.icon-log-out:before {
  content: "\e922"; }

.icon-lock:before {
  content: "\e923"; }

.icon-first-page:before {
  content: "\e924"; }

.icon-last-page:before {
  content: "\e925"; }

.icon-search:before {
  content: "\e926"; }

.icon-reset:before {
  content: "\e927"; }

.icon-action-edit:before {
  content: "\e928"; }

.icon-action-copy:before {
  content: "\e930"; }

.icon-action-protocol:before {
  content: "\e931"; }

.icon-dashboard:before {
  content: "\e932"; }

.icon-invoice-create:before {
  content: "\e933"; }

.icon-invoice-import:before {
  content: "\e934"; }

.icon-invoice-intermediate-import:before {
  content: "\e935"; }

.icon-legend:before {
  content: "\e936"; }

.icon-mail:before {
  content: "\e937"; }

.icon-pdf-download:before {
  content: "\e938"; }

.icon-paperflyer:before {
  content: "\e939"; }

.icon-cloud-upload:before {
  content: "\e940"; }

.icon-globe:before {
  content: "\e941"; }

.icon-aria-easy-speech:before {
  content: "\e942"; }

.icon-aria-sign-speech:before {
  content: "\e943"; }

.icon-aria-subtitle:before {
  content: "\e944"; }

/* Sortierung Tabelle */
.icon-sort-up:before {
  content: "\e945"; }

.icon-sort-down:before {
  content: "\e946"; }

.icon-sort-up-down:before {
  content: "\e929"; }

.icon-show-password:before {
  content: "\e947"; }

.icon-hide-password:before {
  content: "\e948"; }

.icon-dot-horizontal:before {
  content: "\e949"; }

.icon-dot-vertical:before {
  content: "\e950"; }

/*****
 HTML/BODY
 *****/
html, body {
  height: 100%;
  min-height: 100%;
  width: 100%; }

body {
  background: var(--body-bg-color, #f0eef0);
  color: var(--font-color-base, #000);
  font-family: var(--font-family-base);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: var(--font-weight-base, normal);
  line-height: var(--font-line-height-base, 120%); }

/****
  FONZ-SIZE / THEME | GENERAL DEFAULT
  Hier wird die Standard font-size des Themes bestimtt !!!!
****/
body .main,
body .login-main {
  font-size: var(--font-size-base, 0.875rem); }

option {
  font-family: var(--font-family-base), Arial; }

/*****
 FORMATIERUNGEN
 *****/
/* HACK EDGE/IE- entfernen der Löschfunktion innherhalb von textfeldern  */
input::-ms-clear {
  display: none; }

/* Focus auf Element */
:focus {
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 0.1875rem var(--focus-shadow-color, #3c7dcd);
  z-index: 2; }

/* Textmarkierung mit cursor */
::selection {
  background: var(--cursor-selection-bg-color, #003865);
  color: var(--cursor-selection-color, #fff); }

b,
strong {
  font-family: var(--font-family-bold, var(--font-family-base));
  font-weight: var(--font-weight-bold-base, bold); }

em,
i {
  font-family: var(--font-family-italic, var(--font-family-base));
  font-weight: var(--font-weight-base, normal); }

/*****
 SCROLLBARS
 *****/
* {
  scrollbar-width: thin;
  scrollbar-color: var(--scrollbar-thumb-color, #003865) var(--scrollbar-bg-color, #ddd); }

/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar-track {
  background-color: var(--scrollbar-bg-color, #ddd); }

*::-webkit-scrollbar {
  width: 0.75rem;
  background-color: var(--scrollbar-bg-color, #ddd); }

*::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-thumb-color, #003865); }

/*****
 LIST
 *****/
/* unsorted List */
.list {
  margin: 0 0 0 0.9375rem;
  padding: 0;
  list-style-type: square;
  list-style-position: outside; }

.list__item {
  margin-bottom: 0.3125rem; }

.list__item > .list > .list__item:first-child {
  margin-top: 0.3125rem; }

/* ordered List */
.ol-list {
  margin: 0;
  padding: 0 0 0 0.9375rem;
  list-style-type: none;
  list-style-position: outside; }

.ol-list:not(:first-child) {
  padding-left: 0; }

.ol-list__item {
  margin-bottom: 0.3125rem; }

.ol-list__item > .ol-list > .ol-list__item:first-child {
  margin-top: 0.3125rem; }

.ol-list {
  counter-reset: zahl; }

.ol-list .ol-list__item:before {
  counter-increment: zahl;
  content: counters(zahl, ".") ". "; }

/*****
 IMAGE
 *****/
.image {
  display: block;
  height: auto;
  max-width: 100%; }

/*****
 LINK
 *****/
.link,
.link-icon,
.link:hover,
.link-icon:hover,
.link:active,
.link-icon:active,
.link:visited,
.link-icon:visited {
  background: none;
  color: var(--link-normal-color, #003865);
  text-decoration: var(--link-normal-decoration, underline);
  font-weight: var(--link-normal-weight, normal);
  font-style: var(--link-normal-style, normal); }

.link:hover,
.link-icon:hover {
  text-decoration: var(--link-hover-decoration, none); }

/* Links als Tooltip :focus Einstellungen */
.link[data-tooltip]:focus {
  background: none;
  color: var(--link-normal-color, #003865); }

/*****
 LINK MIT ICON
 *****/
.link-icon {
  display: inline-flex; }

/* Icon steht rechts */
.link-icon > i {
  margin-left: 0;
  margin-right: 0.1875rem;
  top: 0.125rem;
  position: relative;
  order: 1; }

.link-icon > i + .link-icon__text {
  order: 2; }

/* Icon steht links */
.link-icon > .link-icon__text {
  order: 1; }

.link-icon > .link-icon__text + i {
  margin-right: 0;
  margin-left: 0.1875rem;
  order: 2; }

abbr[title],
acronym[title] {
  text-decoration: unset;
  border-bottom: 0.125rem dotted; }

/*****
 SCHRIFT / UEBERSCHRIFTEN
 *****/
.paragraph {
  margin: var(--paragraph-margin, 0.9375rem 0);
  padding: 0; }

h1,
[role="heading"][aria-level="1"],
h2,
[role="heading"][aria-level="2"],
h3,
[role="heading"][aria-level="3"],
h4,
[role="heading"][aria-level="4"] {
  color: var(--font-color-headlines, #003865);
  display: block;
  font-family: var(--font-family-headlines);
  font-weight: var(--font-weight-headlines, normal);
  font-style: var(--font-style-headlines, normal);
  line-height: var(--font-line-height-headlines, 120%);
  text-transform: var(--font-headlines-text-transform, none);
  margin: 0.9375rem 0;
  padding: 0; }

h1,
[role="heading"][aria-level="1"] {
  font-size: var(--font-size-h1, 1.5rem); }

h2,
[role="heading"][aria-level="2"] {
  font-size: var(--font-size-h2, 1.375rem); }

h3,
[role="heading"][aria-level="3"] {
  font-size: var(--font-size-h3, 1.125rem); }

h4,
[role="heading"][aria-level="4"] {
  font-size: var(--font-size-h4, 0.875rem); }

/* Nur ueberschrift */
.headline {
  background: var(--main-content-headline-bg-color, #fff);
  box-shadow: 0 0.3125rem 0.4375rem 0 rgba(0, 0, 0, var(--box-shadow));
  border-radius: var(--panel-border-radius, 0);
  text-align: left;
  padding: var(--main-content-headline-padding, 0.5rem 0.9375rem);
  margin: var(--main-content-headline-margin, 0 0 2.1875rem 0);
  min-height: var(--main-content-headline-icon-size, 1.875rem);
  align-items: center;
  display: flex;
  word-wrap: break-word;
  word-break: break-all;
  hyphens: auto;
  border-left: var(--main-content-headline-border-left, 0.625rem solid);
  border-left-color: var(--main-content-headline-border-left-color, #003865);
  flex-wrap: wrap; }
  .headline:after {
    content: '';
    min-height: inherit;
    font-size: 0; }

.headline__icon {
  font-size: var(--main-content-headline-icon-size, 1.875rem);
  display: flex;
  align-items: center;
  padding-right: 0.3125rem; }

.headline-section {
  position: relative;
  z-index: 1;
  margin: 0.9375rem 0 0 0; }
  .headline-section__text {
    display: inline-flex;
    border-left: 0.3125rem solid;
    border-left-color: var(--main-content-headline-border-left-color, #003865);
    background-color: var(--section-headline-text-bg-color, #f1f1f1);
    color: var(--section-headline-text-color, #000);
    font-size: var(--section-headline-text-font-size, 0.75rem);
    font-weight: var(--section-headline-text-font-weight, normal);
    text-transform: var(--section-headline-text-transform, uppercase);
    padding: 0.5rem 0.3125rem;
    min-height: 1.375rem;
    align-items: center;
    max-width: 90%; }
  .headline-section::after {
    border-top: 0.0625rem solid var(--section-headline-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
    content: "";
    margin: 0 auto;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    z-index: -1; }

/************************************

 ARIA Komponenten

 ************************************/
/*****
  TEXT NUR FUER SCREENREADER ERKENNBAR
  steht im Quellcode, jedoch versteckt
 *****/
.screenreader-only {
  position: absolute;
  overflow: hidden;
  left: -10000px;
  top: auto;
  color: #000;
  padding: 0;
  border: none;
  width: 1px;
  height: 1px;
  background: #fff; }

/************************************

 RTL (RightToLeft) Reihenfolge aendern

 ************************************/
[dir=rtl] .list {
  margin: 0.3125rem 0.9375rem 0.3125rem 0;
  padding: 0; }

/*****
 BUTTONS
 *****/
.button {
  background: var(--button-default-bg-color, #003865);
  border-color: var(--button-default-bg-color, #003865);
  border-width: 0.0625rem;
  border-style: solid;
  color: var(--button-default-color, #fff);
  font-size: var(--button-default-font-size, 0.75rem);
  line-height: var(--button-default-font-size, 0.75rem);
  min-height: var(--button-default-height, 1.875rem);
  min-width: calc(var(--button-default-height, 1.875rem) + (0.0625rem * 2));
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  border-radius: var(--default-border-radius, 0.3125rem);
  padding: 0 0.3125rem;
  margin: 0 -0.0625rem;
  font-weight: var(--button-default-font-weight, normal); }

/* reset bei Tags die kein <button> oder <a> sind */
a.button,
div.button,
span.button {
  padding: 0; }

/* Button input  */
input.button {
  display: inline-block;
  height: calc(var(--button-default-height, 1.875rem) + (0.0625rem * 2));
  text-transform: var(--button-default-text-transform, uppercase); }

/* Hover - focus */
.button:hover,
input.button:hover,
.button:focus:hover,
input.button:focus:hover {
  background-color: var(--button-default-bg-color-hover, #0077cb);
  border-color: var(--button-default-bg-color-hover, #0077cb);
  color: var(--button-default-color-hover, #fff);
  outline: 0; }

.button:focus,
input.button:focus,
.button:active,
input.button:active {
  background: var(--button-default-bg-color-focus, #0077cb);
  border-color: var(--button-default-bg-color-focus, #0077cb);
  color: var(--button-default-color-focus, #fff);
  outline: 0; }

.button:focus,
input.button:focus {
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 0.1875rem var(--focus-shadow-color, #3c7dcd);
  z-index: 2; }

/* Large Button */
.button-style--large,
a.button-style--large,
.button--style-large,
a.button--style-large {
  font-size: var(--button-large-font-size, 0.875rem);
  line-height: var(--button-large-font-size, 0.875rem);
  padding: var(--button-large-padding, 0.3125rem); }

/* Button transparent */
.button-style--transparent,
.button--style-transparent {
  box-shadow: none;
  border: none;
  background: transparent;
  color: var(--link-normal-color, #003865); }

.button__icon,
.button__text,
.button__toggle,
.button__tools {
  min-width: calc(var(--button-default-height, 1.875rem) - 10);
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center; }

.button__icon:empty,
.button__tools:empty {
  display: none; }

.button__icon {
  font-size: var(--default-icon-size, 1.5rem);
  height: 100%;
  min-height: var(--button-default-height, 1.875rem); }

.button__text {
  text-align: center;
  justify-content: flex-start;
  height: 100%;
  min-height: var(--button-default-height, 1.875rem);
  text-transform: var(--button-default-text-transform, uppercase);
  padding: 0 0.3125rem; }

.button__text {
  margin-top: var(--button-text-margin-top, 0); }

.button__toggle,
.button__tools {
  font-size: var(--default-icon-size, 1.5rem);
  height: 100%;
  min-height: var(--button-default-height, 1.875rem); }

.button__toggle {
  margin-right: 0.3125rem; }

/* margin von icon - text - tools setzen */
.button__icon + .button__text,
.button__text + .button__toggle,
.button__icon + .button__toggle {
  margin-left: 0.125rem;
  margin-right: 0; }

/*****
 BUTTON-GROUP
 *****/
.button-group {
  position: relative;
  display: flex; }

.button-group > .button {
  margin-right: 0.625rem; }

.button-group > .button:last-child {
  margin-right: 0; }

/*****
 BUTTON-CONTAINER
 *****/
.button-container {
  padding: 0; }

.input-group__button-container {
  margin-top: var(--form-button-container-margin-top, 2.625rem); }

/*****
 MODIFIER
 *****/
.button-style--large .button__icon {
  font-size: var(--button-large-icon-size, 1.75rem); }

.button-style--large .button__toggle {
  font-size: var(--button-large-icon-size, 1.75rem); }

.button-style--large .badge {
  font-size: 0.875rem; }

.button-direction-vertical {
  flex-direction: column;
  align-items: center; }

/************************************

 MEDIA-QUERIES

 ************************************/
@media (max-width: 768px) {
  .input-group__button-container {
    margin-top: 0.9375rem; } }

/************************************

 RTL (RightToLeft) Reihenfolge aendern - margin von icon - text - tools neu setzen

 ************************************/
[dir=rtl] .button__icon + .button__text,
[dir=rtl] .button__text + .button__toggle,
[dir=rtl] .button__icon + .button__toggle {
  margin-left: 0;
  margin-right: 0.3125rem; }

/*****
 SPEZIELLER DASHBOARD BUTTON
 *****/
.dashboard__button {
  flex-direction: column;
  align-items: center;
  border: var(--dashboard-button-border, 0.0625rem solid var(--default-border-color, #cdcdcd));
  border-radius: var(--dashboard-button-border-radius, 0.3125rem);
  color: var(--link-normal-color, #003865);
  background: transparent;
  box-shadow: none; }

.dashboard__button .button__icon {
  margin-top: 0.3125rem;
  font-size: calc(var(--button-large-icon-size, 1.75rem) * 4); }

.dashboard__button.button__text {
  margin-top: 0.3125rem;
  line-height: calc(var(--button-default-font-size, 0.75rem) * 1.2); }

/*****
 SWITCH-BUTTON
 Komponente bestehend aus <label> & type="checkbox"
 *****/
.switch-buttons {
  display: flex;
  flex-direction: column; }

.switch-button {
  display: flex;
  align-items: center;
  cursor: pointer;
  max-width: fit-content;
  min-height: 2.5rem;
  /* FOKUS */
  /* DISABLED */
  /* Status ON */
  /* Status ON mit Icomoon */
  /* Status ON mit Text */
  /* Status OFF */
  /* Status OFF mit Icomoon */
  /* Status OFF mit Text */
  /* Label Text */ }
  .switch-button__checkbox {
    position: absolute;
    overflow: hidden;
    left: -10000px;
    top: auto; }
  .switch-button__icon {
    display: flex;
    min-width: 3.125rem;
    height: 1.625rem;
    padding: 0 0.3125rem;
    border-radius: calc(1.625rem / 2);
    align-items: center;
    transition: 0.25s 0.09s;
    background-color: #ccc;
    box-sizing: content-box;
    box-shadow: inset 0 3px 6px 0 rgba(0, 0, 0, 0.2);
    position: relative; }
  .switch-button__icon::after {
    content: "";
    font-family: "icomoon";
    font-size: 0.875rem;
    color: #000;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    box-shadow: 4px 0 5px 0 rgba(0, 0, 0, 0.2);
    transition: 0.3s;
    position: absolute; }
  .switch-button__icon::before {
    display: inline-flex;
    align-items: center;
    font-family: Arial, Helvetica, sans-serif;
    flex-grow: 1;
    font-size: 0.75rem;
    font-weight: bold;
    text-transform: uppercase; }
  .switch-button__checkbox:checked + .switch-button__icon::after {
    transform: translateX(calc(3.125rem - 1rem));
    box-shadow: -4px 0 5px 0 rgba(0, 0, 0, 0.2); }
  .switch-button__checkbox:focus + .switch-button__icon {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 0.1875rem var(--focus-shadow-color, #3c7dcd);
    z-index: 2; }
  .switch-button__checkbox.bg-color--disabled + .switch-button__icon,
  .switch-button__checkbox.bg-color--disabled:checked + .switch-button__icon {
    background: #e6e6e6;
    box-shadow: unset; }
  .switch-button__checkbox.bg-color--disabled + .switch-button__icon::after,
  .switch-button__checkbox.bg-color--disabled:checked + .switch-button__icon::after {
    background: #939393;
    box-shadow: unset;
    color: #e6e6e6; }
  .switch-button--with-text .switch-button__checkbox.bg-color--disabled + .switch-button__icon::before,
  .switch-button--with-text .switch-button__checkbox.bg-color--disabled:checked + .switch-button__icon::before {
    color: #939393; }
  .switch-button__checkbox:checked + .switch-button__icon {
    background-color: var(--switch-button-bg-checked, #21a665); }
  .switch-button--with-sign .switch-button__checkbox:checked + .switch-button__icon::after {
    content: "\e900"; }
  .switch-button--with-text .switch-button__checkbox:checked + .switch-button__icon::before {
    content: attr(data-switch-button-text-on);
    color: var(--switch-button-color-checked, #fff);
    justify-content: flex-start; }
  .switch-button__icon::after {
    background: linear-gradient(to bottom, #fff 0%, #eee 100%); }
  .switch-button--with-sign .switch-button__icon::after {
    content: "\e90b"; }
  .switch-button--with-text .switch-button__icon::before {
    content: attr(data-switch-button-text-off);
    color: var(--switch-button-color-unchecked, #000);
    justify-content: flex-end; }
  .switch-button__label {
    font-size: var(--font-size-base, 0.875rem);
    margin-left: 0.9375rem; }

/*****
 DROPDOWN
 *****/
.dropdown {
  margin: 0;
  padding: 0;
  display: inline-flex;
  position: relative; }

.dropdown:hover .dropdown__submenu,
.dropdown.dropdown__submenu--open .dropdown__submenu {
  animation: var(--dropdown-submenu-animation, fadeInBottom 0.2s ease-in);
  visibility: visible;
  opacity: 1; }

.dropdown__button {
  border-radius: var(--default-border-radius, 0.3125rem);
  margin: 0;
  padding: 0 0.3125rem !important; }

.dropdown__button .button__icon,
.dropdown__button .button__toogle,
.dropdown__button .button__tools {
  font-size: var(--default-icon-size, 1.5rem);
  min-height: var(--dropdown-button-height, var(--button-default-height, 1.875rem)); }

/* SUBMENUE */
.dropdown__submenu {
  box-shadow: 0 1.5625rem 1.25rem -0.625rem rgba(0, 0, 0, 0.3);
  background-color: var(--dropdown-submenu-bg-color, #fff);
  border-radius: var(--default-border-radius, 0.3125rem);
  margin: 0;
  list-style-type: none;
  padding: var(--dropdown-submenu-padding-top-bottom, 0.3125rem) 0;
  position: absolute;
  z-index: 9998;
  min-width: 100%;
  max-width: calc(var(--dropdown-submenu-max-width, 18.75rem) * 2);
  visibility: hidden;
  opacity: 0;
  border: 0.0625rem solid var(--dropdown-submenu-seperator-bg-color, var(--default-border-color, #cdcdcd));
  display: flex;
  flex-direction: column; }

.dropdown__submenu-item {
  position: relative; }

.dropdown__submenu-item--overflow-y {
  max-height: 12.5rem;
  overflow-y: auto;
  padding-right: 1.25rem; }

/* Content Container z.B. Multiple filterienstellungen */
.dropdown__submenu-content {
  display: flex;
  flex-direction: column; }

.dropdown__submenu-content-row {
  padding: 0 0.9375rem; }

.dropdown__submenu-content-action-form {
  border-top: 0.0625rem solid var(--dropdown-submenu-seperator-bg-color, var(--default-border-color, #cdcdcd));
  padding: 0.9375rem;
  margin-top: 1.5625rem; }

.dropdown__submenu-link {
  color: var(--dropdown-submenu-link-color, #003865);
  display: flex;
  align-items: center;
  padding: 0 0.3125rem;
  flex-direction: row;
  min-height: var(--dropdown-submenu-link-height, 1.875rem);
  text-decoration: none; }

/* Hover + Focus */
.dropdown__submenu-link:hover {
  background-color: var(--dropdown-submenu-link-bg-color-hover, #003865);
  color: var(--dropdown-submenu-link-color-hover, #fff); }

.dropdown__submenu-link:focus,
.dropdown__submenu-link:active {
  background-color: var(--dropdown-submenu-link-bg-color-focus, #0077cb);
  color: var(--dropdown-submenu-link-color-focus, #fff);
  outline: 0;
  box-shadow: none; }

.dropdown__submenu-icon,
.dropdown__submenu-text,
.dropdown__submenu-tools {
  display: flex; }

/*****
 VERWENDUNG VON FORMELEMENTE IM DROPDOWN SUBMENUE
 *****/
.dropdown__submenu-text,
.dropdown__submenu .label,
.dropdown__submenu .legend__label-group {
  font-size: var(--dropdown-submenu-link-font-size, 0.75rem);
  line-height: calc(var(--dropdown-submenu-link-font-size, 0.75rem) * 1.5);
  text-transform: var(--dropdown-submenu-link-text-transform, uppercase); }

/*****
 SPACE fuer Legend / Checkbox / Radiobutton
 *****/
.dropdown__submenu .legend__label-group,
.dropdown__submenu .radio-group,
.dropdown__submenu .checkbox-group {
  padding: 0 0.3125rem; }

.dropdown__submenu .checkbox-group__wrapper {
  margin-top: 0; }

/****
* ".legend__label-group" fuer Kontext bei Checkboxen und Radiobuttons
 *****/
.dropdown__submenu .legend__label-group {
  margin: 0.3125rem 0 0.5rem 0;
  max-width: var(--dropdown-submenu-max-width, 18.75rem); }

.dropdown__submenu .legend__label-group .label-group__label {
  min-height: 0.0625rem; }

.dropdown__submenu-text,
.dropdown__submenu .label-group__label {
  min-width: var(--dropdown-submenu-text-min-width, 11.25rem);
  max-width: var(--dropdown-submenu-text-max-width, 15.625rem); }

.dropdown__submenu-icon {
  font-size: var(--default-icon-size, 1.5rem);
  min-width: var(--dropdown-submenu-icon-width, 1.875rem);
  justify-content: center;
  order: 1; }

.dropdown__submenu-text {
  align-items: center;
  font-weight: var(--dropdown-submenu-link-weight, normal);
  order: 2;
  padding: 0 0.3125rem;
  text-align: left; }

/* Wenn Input-Element (Label -> Radio/Checkbox) vorhanden sind */
.dropdown__submenu .label-group__label {
  font-size: var(--dropdown-submenu-link-font-size, 0.75rem);
  text-transform: var(--dropdown-submenu-link-text-transform, uppercase); }

.dropdown__submenu-tools,
.dropdown__submenu .checkbox-group__addon,
.dropdown__submenu .radio-group__addon {
  font-size: var(--default-icon-size, 1.5rem);
  min-width: var(--dropdown-submenu-icon-width, 1.875rem);
  justify-content: flex-end;
  order: 3;
  margin-left: auto; }

/* Seperator */
.dropdown__submenu-item--separator::after {
  content: "";
  display: flex;
  height: 0.0625rem;
  width: 100%;
  position: relative;
  margin: 0.3125rem 0;
  border-top: 0.0625rem solid var(--seperator-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd))); }

.dropdown__submenu-seperator {
  display: block;
  height: 0.0625rem;
  background: var(--dropdown-submenu-seperator-bg-color, var(--default-border-color, #cdcdcd));
  margin: 0.3125rem 0; }

/* Ueberschrift */
.dropdown__submenu-headline {
  font-weight: var(--dropdown-submenu-headline-weight, bold);
  color: var(--dropdown-submenu-headline-color, #000);
  margin: 0.3125rem 0;
  padding-left: 0.3125rem;
  display: inline-block;
  word-wrap: break-word; }

/*
    Subemnue geht nach OBEN - LINKS auf
*/
.dropdown__submenu--top-left {
  bottom: 100%;
  left: 0; }

/*
    Subemnue geht nach OBEN - RECHTS auf
*/
.dropdown__submenu--top-right {
  bottom: 100%;
  right: 0; }

/*
    Subemnue geht nach LINKS auf
*/
.dropdown__submenu--left {
  top: 0;
  right: 100%; }

/*
      Subemnue geht nach RECHTS auf
  */
.dropdown__submenu--right {
  top: 0;
  left: 100%; }

/*
    Subemnue geht nach UNTEN - LINKS auf
*/
.dropdown__submenu--bottom-left {
  top: 100%;
  left: 0; }

/*
    Subemnue geht nach UNTEN - RECHTS auf
*/
.dropdown__submenu--bottom-right {
  top: 100%;
  right: 0; }

/*
    Subemnue als Megamenue
*/
.megamenu {
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start; }

.megamenu__cell {
  width: 100%;
  border-right: 0.0625rem solid var(--dropdown-submenu-seperator-bg-color, var(--default-border-color, #cdcdcd)); }

.megamenu__cell:last-child {
  border-right: none; }

.megamenu__cell::after {
  top: 100%; }

.megamenu__cell::after {
  bottom: 0; }

.megamenu__cell:last-child::before,
.megamenu__cell:last-child::after {
  display: none; }

/************************************

 MEDIA-QUERIES

 ************************************/
/*
  Breite des Submenues begrenzen auf 320px
 */
@media (max-width: 320px) {
  .dropdown__submenu {
    max-width: 18.75rem; } }

@media (max-width: 450px) {
  .megamenu {
    flex-direction: column; } }

.menu {
  background-color: var(--menu-bg-color, #fff);
  list-style-type: none;
  margin-top: var(--menu-margin-top, 0rem);
  padding: 0;
  display: flex;
  flex-direction: column;
  width: var(--menu-width, 15.625rem);
  font-family: var(--menu-font-family, var(--font-family-base)); }

.menu__item {
  border-top: 0.0625rem solid var(--menu-item-border-top-color, #f1f1f1);
  padding: 0;
  flex-grow: 1; }

.menu__section {
  display: flex;
  border-top: 0.0625rem solid var(--menu-item-border-top-color, #f1f1f1);
  color: var(--menu-button-color, #003865);
  min-height: var(--menu-button-height, 2.75rem);
  align-items: center;
  justify-content: flex-end;
  padding: 0.9375rem 0.3125rem 0 0.3125rem; }

.menu__section:first-child {
  border-top: none; }

.menu__section .menu__text {
  font-size: var(--menu-section-font-size, 0.875rem);
  text-transform: var(--menu-section-text-transform, uppercase);
  font-weight: var(--menu-section-font-weight, normal);
  color: var(--menu-section-color, #fff);
  text-shadow: var(--menu-section-text-shadow); }

.menu__section .menu__icon {
  display: none; }

.menu__item:last-child {
  border-bottom: 0.0625rem solid var(--menu-item-border-top-color, #f1f1f1); }

.menu__button {
  background-color: var(--menu-button-bg-color, #fff);
  border-left: var(--menu-button-border-left-width, 0.625rem) solid var(--menu-button-border-left-color, transparent);
  color: var(--menu-button-color, #003865);
  display: flex;
  flex-direction: row;
  min-height: var(--menu-button-height, 2.75rem);
  text-decoration: none;
  align-items: center;
  cursor: pointer;
  position: relative; }

button.menu__button {
  margin: 0;
  padding: 0;
  border-right: none;
  border-top: none;
  border-bottom: none; }

.menu__icon {
  display: flex;
  font-size: var(--menu-icon-size, 1.25rem);
  align-items: center;
  justify-content: center;
  min-width: var(--menu-icon-width, 1.875rem); }

.menu__item > .menu__button:hover .icon-toggle-open,
.menu__item > .menu__button:focus .icon-toggle-open {
  transform: rotate(0) !important; }

.menu__item.menu__item--open > .menu__button .icon-toggle-open {
  transform: rotate(180deg); }

.menu__text {
  display: flex;
  align-items: center;
  flex-grow: 1;
  padding: 0 0.3125rem;
  font-size: var(--menu-button-font-size, 0.875rem);
  line-height: calc(var(--menu-button-font-size, 0.875rem) * 1.2);
  text-transform: var(--menu-button-text-transform, uppercase); }

.menu__toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  order: 3;
  flex: 0 0 var(--menu-toggle-width, 1.875rem); }

.menu__tools {
  display: flex;
  align-items: center;
  justify-content: center;
  order: 4;
  flex: 0 0 var(--menu-tools-width, 1.875rem);
  margin-left: auto; }

.menu__button > .menu__icon + .menu__text {
  margin-left: 0; }

.menu__button > .menu__text {
  margin-left: var(--menu-icon-width, 1.875rem); }

.menu__item:hover > .menu__button {
  background-color: var(--menu-button-bg-color-hover, #003865);
  border-left-color: var(--menu-button-border-left-color-hover, #003865);
  color: var(--menu-button-color-hover, #fff);
  outline: 0; }

.menu__item.menu__item--active > .menu__button {
  background-color: var(--menu-button-bg-color-active, #f5f6f8);
  border-left-color: var(--menu-button-border-left-color-active, #003865);
  color: var(--menu-button-color-active, #003865);
  font-weight: var(--menu-button-font-weight-active, normal);
  font-family: var(--font-family-bold, var(--font-family-base)); }

.menu__item.menu__item--active > .menu__button:hover {
  background-color: var(--menu-button-bg-color-hover);
  border-left-color: var(--menu-button-border-left-color-hover);
  color: var(--menu-button-color-hover); }

.menu .menu__item.menu__item--active .menu__submenu.menu__submenu--open .menu__item:first-child {
  border-top: none; }

.menu .menu__item.menu__item--active .menu__submenu.menu__submenu--open .menu__item:first-child::after {
  content: "";
  position: absolute;
  width: calc(var(--menu-width, 15.625rem) - var(--menu-button-border-left-width, 0.625rem));
  height: 0.0625rem;
  top: 0;
  left: var(--menu-button-border-left-width, 0.625rem);
  background-color: var(--menu-item-border-top-color, #f1f1f1); }

.menu__submenu {
  background-color: var(--sub-menu-bg-color, #fff);
  display: none;
  position: relative;
  margin: 0;
  padding: 0;
  list-style-type: none;
  animation: fadeOut .4s ease-in; }

.state--hover .menu__item:hover > .menu__button + .menu__submenu,
.menu__submenu--open,
.menu__item.menu__item--open > .menu__button + .menu__submenu {
  animation: fadeIn .4s ease-in;
  display: block; }

.menu__submenu > .menu__item:last-child {
  border-bottom: none; }

.menu__submenu .menu__item .menu__button::before {
  content: "";
  display: flex;
  height: 0.0625rem;
  width: var(--menu-button-border-left-width, 0.625rem);
  background: var(--menu-button-border-left-color-active);
  position: absolute;
  left: calc(var(--menu-button-border-left-width, 0.625rem) * -1);
  bottom: -0.0625rem; }

.menu__submenu .menu__item:last-child .menu__button::before {
  display: none; }

.menu__submenu .menu__submenu-button {
  background-color: var(--sub-menu-button-bg-color, #fff);
  border-left-color: var(--sub-menu-button-border-left-color, #fff);
  color: var(--sub-menu-button-color, #003865);
  position: relative; }

.menu__submenu .menu__submenu-button .menu__text {
  text-transform: var(--sub-menu-button-text-transform, none); }

.state--hover .menu__submenu .menu__item:hover > .menu__button,
.menu__submenu .menu__item.menu__item--open > .menu__button {
  background: var(--menu-button-bg-color-hover);
  border-left-color: var(--menu-button-border-left-color-hover);
  color: var(--menu-button-color-hover); }

.menu__submenu .menu__item--active > .menu__button {
  background-color: var(--menu-button-bg-color-active);
  border-left-color: var(--menu-button-border-left-color-active);
  color: var(--menu-button-color-active);
  font-weight: var(--menu-button-font-weight-active); }

.menu__submenu .menu__item--active > .menu__button:hover,
.menu__submenu .menu__item--active > .menu__button:active {
  background-color: var(--menu-button-bg-color-hover);
  border-left-color: var(--menu-button-border-left-color-hover);
  color: var(--menu-button-color-hover);
  -webkit-user-select: none;
  -webkit-touch-callout: none; }

.menu__item--active .menu__button:focus,
.menu__button:focus,
.menu__submenu .menu__button:focus {
  background-color: var(--menu-button-bg-color-focus, #0077cb);
  border-left-color: var(--menu-button-border-left-color-focus, #0077cb);
  color: var(--menu-button-color-focus, #fff);
  box-shadow: 0 0 0 0.1875rem var(--menu-focus-shadow-color, transparent);
  position: relative; }

.menu__submenu .label-group__label {
  margin: 0;
  min-height: 0.0625rem; }

.menu .label,
.menu .legend__label-group {
  font-size: var(--menu-button-font-size, 0.875rem);
  line-height: calc(var(--menu-button-font-size, 0.875rem) * 1.2);
  text-transform: var(--menu-button-text-transform, uppercase);
  min-width: var(--menu-width, 15.625rem)/2; }

@media (max-width: 1280px) {
  .menu:not(.menu--direction-horizontal) .menu__item,
  .menu__submenu {
    z-index: 999; }
  .menu:not(.menu--direction-horizontal) {
    width: calc(var(--menu-icon-width, 1.875rem) + var(--menu-tools-width-small, 1.375rem) + var(--menu-button-border-left-width, 0.625rem)); }
  .menu:not(.menu--direction-horizontal) .menu__submenu {
    box-shadow: 0 0.4375rem 0.625rem 0 rgba(0, 0, 0, 0.3);
    display: none; }
  .menu:not(.menu--direction-horizontal) > .menu__item > .menu__button .menu__tools {
    flex: 0 0 var(--menu-tools-width-small, 1.375rem); }
  .menu:not(.menu--direction-horizontal) > .menu__item > .menu__button .menu__tools > .badge {
    text-indent: -9999px;
    padding: 0;
    min-width: 0.6875rem;
    width: 0.6875rem;
    min-height: 0.6875rem;
    height: 0.6875rem;
    top: -0.625rem; }
  .menu:not(.menu--direction-horizontal) > .menu__item > .menu__button .menu__tools > .badge[data-tooltip]::before {
    text-indent: 0; }
  .menu:not(.menu--direction-horizontal) > .menu__section .menu__text,
  .menu:not(.menu--direction-horizontal) > .menu__item > .menu__button .menu__text {
    position: absolute;
    left: -10000px;
    top: auto;
    overflow: hidden; }
  .menu:not(.menu--direction-horizontal) .menu__button .menu__toggle {
    position: absolute;
    right: 0;
    bottom: 50%;
    top: 50%; }
  .menu:not(.menu--direction-horizontal) .menu__button:has(.menu__tools > *) .menu__toggle {
    bottom: 0; }
  @-moz-document url-prefix() {
    .menu:not(.menu--direction-horizontal) .menu__button .menu__toggle {
      bottom: 0; } }
  .menu:not(.menu--direction-horizontal) > .menu__item.menu__item--active > .menu__button {
    height: var(--menu-button-height, 2.75rem); }
  .state--hover .menu:not(.menu--direction-horizontal) > .menu__item:hover > .menu__button,
  .menu:not(.menu--direction-horizontal) > .menu__item.menu__item--open > .menu__button {
    width: calc(var(--menu-width, 15.625rem) + var(--menu-icon-width, 1.875rem) + var(--menu-button-border-left-width, 0.625rem)); }
  .state--hover .menu:not(.menu--direction-horizontal) > .menu__item:hover > .menu__button .menu__text,
  .state--hover .menu:not(.menu--direction-horizontal) > .menu__item:hover > .menu__button .menu__toggle,
  .menu:not(.menu--direction-horizontal) > .menu__item.menu__item--open > .menu__button .menu__text,
  .menu:not(.menu--direction-horizontal) > .menu__item.menu__item--open > .menu__button .menu__toggle {
    display: flex;
    position: relative;
    top: auto;
    bottom: auto;
    left: auto; }
  .state--hover .menu:not(.menu--direction-horizontal) > .menu__item:hover > .menu__button .menu__text,
  .menu:not(.menu--direction-horizontal) > .menu__item.menu__item--open > .menu__button .menu__text {
    margin-left: calc(var(--menu-tools-width-small, 1.375rem) + var(--menu-button-border-left-width, 0.625rem)); }
  .state--hover .menu:not(.menu--direction-horizontal) > .menu__item:hover > .menu__button .menu__tools,
  .menu:not(.menu--direction-horizontal) > .menu__item.menu__item--open > .menu__button .menu__tools {
    flex: 0 0 var(--menu-tools-width, 1.875rem); }
  .state--hover .menu:not(.menu--direction-horizontal) > .menu__item:hover > .menu__button .menu__tools > .badge,
  .menu:not(.menu--direction-horizontal) > .menu__item.menu__item--open > .menu__button .menu__tools > .badge {
    line-height: 1.25rem;
    min-height: 1.25rem;
    min-width: 1.125rem;
    padding: 0 0.125rem;
    text-indent: 0;
    top: 0; }
  .state--hover .menu:not(.menu--direction-horizontal) > .menu__item:hover .menu__submenu,
  .menu:not(.menu--direction-horizontal) > .menu__item.menu__item--open .menu__submenu {
    position: absolute;
    display: block;
    left: 100%;
    width: calc(var(--menu-width, 15.625rem) - var(--menu-tools-width-small, 1.375rem));
    animation: fadeIn .4s ease-in; }
  .menu .menu__item.menu__item--active .menu__submenu.menu__submenu--open .menu__item:first-child::after {
    width: calc(var(--menu-width, 15.625rem) - var(--menu-tools-width-small, 1.375rem) - var(--menu-button-border-left-width, 0.625rem)); }
  .menu:not(.menu--direction-horizontal) .menu__submenu .menu__submenu-button > .menu__text {
    margin-left: 0; }
  .menu:not(.menu--direction-horizontal) .menu__submenu .menu__item .menu__submenu-button::after {
    width: calc(var(--menu-width, 15.625rem) - var(--menu-tools-width-small, 1.375rem) - var(--menu-button-border-left-width, 0.625rem)); } }

/*****
 HORIZONTALES MENUE
 *****/
.menu--direction-horizontal {
  flex-direction: row;
  width: 100%;
  border: none;
  text-align: left;
  margin: 0; }

/*****
 Level 1
 *****/
/* Default Menue ist linksbuendig */
.menu--direction-horizontal > .menu__item {
  border: none;
  border-right: 0.0625rem solid var(--menu-horizontal-border-color, #fff);
  position: relative; }

/*****
 Verhalten Border bei menu--direction-horizontal
 Nav ist rechtsbuendig ausgerichtet - nur fuer Level 1
 *****/
.align--right .menu--direction-horizontal > .menu__item:last-child {
  border-right: none; }

.align--right .menu--direction-horizontal > .menu__item:first-child {
  border-left: 0.0625rem solid var(--menu-horizontal-border-color, #fff); }

.menu--direction-horizontal > .menu__item > .menu__button {
  padding: 0 0.3125rem; }

.menu--direction-horizontal > .menu__item > .menu__button .menu__icon,
.menu--direction-horizontal > .menu__item > .menu__button .menu__toggle,
.menu--direction-horizontal > .menu__item > .menu__button .menu__tools {
  min-width: var(--menu-icon-width, 1.875rem); }

.menu--direction-horizontal .menu__button .menu__text {
  margin: 0 0.1875rem;
  max-width: var(--menu-width, 15.625rem); }

/*****
 Level 2n - SUBMENUE
 *****/
.menu--direction-horizontal .menu__submenu {
  position: absolute;
  min-width: 100%;
  max-width: var(--menu-horizontal-submenu-max-width, 21.875rem);
  box-shadow: 0 1.5625rem 1.25rem -0.625rem rgba(0, 0, 0, 0.3);
  display: none;
  right: 0;
  z-index: 9998; }

/* Submenue oeffnen */
.state--hover .menu--direction-horizontal .menu__item:hover .menu__submenu.menu__submenu--open,
.menu--direction-horizontal .menu__submenu.menu__submenu--open {
  animation: fadeIn .4s ease-in;
  display: block; }

.menu--direction-horizontal .menu__submenu .menu__item {
  background: #fff;
  border-top-color: #fff; }

.menu--direction-horizontal .menu__submenu .menu__item .menu__submenu-button::after,
.menu--direction-horizontal .menu__submenu .menu__item .menu__submenu-button::before {
  display: none; }

.menu--direction-horizontal .menu__submenu .menu__item .menu__submenu-button {
  border-left: none;
  padding-left: 0.625rem; }

.menu--direction-horizontal .menu__submenu > .menu__item,
.menu--direction-horizontal .menu__submenu .menu__button .menu__text {
  min-width: calc(var(--menu-horizontal-submenu-max-width, 21.875rem) / 2); }

/* Modifiers */
/* Menue geht nach unten rechts auf */
.menu__submenu.menu__submenu--bottom-left {
  box-shadow: 0.625rem 0.625rem 1.25rem 0 rgba(0, 0, 0, 0.3); }

/*****
 SPACE fuer Legend / Checkbox / Radiobutton
 *****/
.menu--direction-horizontal .menu__submenu .legend__label-group {
  margin: 0.625rem 0 0.3125rem 0; }

.menu--direction-horizontal .menu__submenu .legend__label-group,
.menu--direction-horizontal .menu__submenu .radio-group,
.menu--direction-horizontal .menu__submenu .checkbox-group {
  padding: 0 0.3125rem; }

/************************************

 MEDIA-QUERIES

 ************************************/
@media (max-width: 1280px) {
  .menu--direction-horizontal > .menu__item > .menu__button .menu__text {
    display: none; } }

/************************************
  CONTAINER INNERHALB VON PROJEKTEN
 ************************************/
.projectbox {
  min-height: var(--projectbox-height, 3.4375rem);
  background-color: var(--projectbox-bg-color, #fff);
  flex-direction: row;
  display: flex;
  box-shadow: 0 0.3125rem 0.4375rem 0 rgba(0, 0, 0, var(--box-shadow));
  width: 100%;
  color: var(--projectbox-text-color, #000); }

.projectbox__cell {
  display: flex; }

.projectbox__cell .menu,
.projectbox__cell .menu__item,
.projectbox__cell .menu__button,
.projectbox__cell .projectbox__button {
  height: 100%; }

/* BUTTONS */
.projectbox__button {
  background-color: var(--projectbox-button-bg-color, #fff);
  min-height: var(--projectbox-height, 3.4375rem);
  color: var(--projectbox-button-color, #003865);
  align-content: center;
  box-shadow: none;
  border-radius: 0;
  border: none;
  font-family: var(--projectbox-button-family-level-1, var(--font-family-base)); }

.projectbox__button .menu__text {
  font-weight: var(--projectbox-button-font-weight, normal);
  font-size: var(--projectbox-button-font-size, 0.75rem);
  text-transform: var(--projectbox-button-text-transform, none); }

/* ALS AUSGEWAEHLT */
.projectbox .menu__item--active .projectbox__button {
  background: var(--projectbox-button-bg-color-selected, #003865);
  color: var(--projectbox-button-color-selected, #fff); }

.projectbox .menu__item--active .projectbox__button:focus {
  background: var(--projectbox-button-bg-color-focus, #135831);
  color: var(--projectbox-button-color-focus, #fff); }

/* MENUE */
.projectbox__cell .menu > .menu__item {
  border-color: var(--projectbox-menu-list-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd))); }

.badge {
  justify-content: center;
  align-items: center;
  min-width: 1.25rem;
  min-height: 1.25rem;
  font-weight: bold;
  display: inline-flex;
  border-radius: 50%;
  position: relative;
  background-color: #52575b;
  color: #fff;
  padding: 0.0625rem;
  cursor: default; }

.badge,
.badge-group {
  font-family: "Verdana", sans-serif;
  font-size: 0.75rem;
  line-height: 0.75rem;
  text-transform: uppercase; }

.badge > [class^="icon-"] {
  font-size: 0.875rem;
  justify-content: center;
  align-items: center; }

.badge-group {
  border-radius: 0.1875rem;
  font-weight: bold;
  display: inline-flex;
  letter-spacing: 0;
  padding: 0 0.3125rem;
  min-height: 1.25rem;
  background-color: #52575b;
  color: #fff;
  justify-content: center;
  align-items: center; }

.badge-group [class^="icon-"] {
  font-size: 0.75rem; }

.badge-group > [class^="icon-"] {
  margin-right: 0.3125rem; }

.badge-group > .badge-group__text + [class^="icon-"],
.badge-group > [class^="icon-"] + .badge-group__text + [class^="icon-"] {
  margin-right: 0;
  margin-left: 0.3125rem; }

.badge-wrapper {
  display: inline-flex;
  align-items: center; }

.badge--empty {
  background: none; }

.badge--size-medium {
  font-size: 0.875rem;
  line-height: 100%;
  min-height: 1.75rem;
  width: 1.75rem;
  min-width: 1.75rem; }

.badge--size-medium [class^="icon-"] {
  font-size: 1.125rem; }

.badge--size-big {
  min-height: 2.25rem;
  min-width: 2.25rem; }

.badge--size-big [class^="icon-"] {
  font-size: 1.625rem; }

.tags-list {
  list-style: none;
  padding: 0;
  margin: -0.125rem 0 0 0; }

.tags-list__item {
  display: inline-block;
  padding: 0;
  margin: 0; }

.tags {
  display: inline-flex;
  padding: 0 0.3125rem 0 0.625rem;
  background-color: #52575b;
  color: #fff;
  text-transform: uppercase;
  font-size: 0.625rem;
  min-height: 1.25rem;
  align-items: center;
  position: relative;
  margin: 0 0.9375rem 0.3125rem 0; }

.tags::before {
  content: "";
  position: absolute;
  top: 0;
  left: -0.625rem;
  width: 0;
  height: 0;
  border-color: transparent #52575b transparent transparent;
  border-style: solid;
  border-width: 0.625rem 0.625rem 0.625rem 0; }

.tags::after {
  content: "";
  position: absolute;
  top: 0.4375rem;
  left: 0;
  float: left;
  width: 0.3125rem;
  height: 0.3125rem;
  border-radius: 0.125rem;
  background: #fff;
  box-shadow: 0.0625rem 0.0625rem 0.125rem #000; }

/*****
 PANEL
 *****/
.panel {
  box-shadow: 0 0.3125rem 0.4375rem 0 rgba(0, 0, 0, var(--box-shadow));
  margin-bottom: 0.9375rem;
  -moz-transition: 0.4s;
  background: var(--panel-body-bg-color, #fff);
  border-radius: var(--panel-border-radius, 0);
  border: var(--panel-border, none); }

.panel__head {
  background: var(--panel-header-bg-color, #fff);
  border-bottom: var(--panel-header-border-bottom, 0.0625rem solid var(--default-border-color, #cdcdcd));
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  padding: var(--panel-header-padding, 0.625rem 0.9375rem);
  align-items: stretch;
  text-shadow: var(--panel-header-text-shadow, none);
  border-radius: var(--panel-border-radius, 0) var(--panel-border-radius, 0) 0 0; }

.panel__head-caption {
  display: flex;
  align-items: center;
  align-content: flex-start;
  padding-right: 0.3125rem;
  min-width: 11.25rem; }

.panel__head-title {
  display: flex;
  align-items: center;
  flex-basis: auto; }

.panel__head-headline {
  display: flex;
  flex-direction: column; }

.panel__head-extension {
  font-size: var(--menu-section-font-size, 0.875rem);
  display: inline-block; }

.panel__head-icon {
  display: flex;
  color: var(--panel-header-color, var(--font-color-headlines, #003865));
  align-items: center;
  padding-right: 0.3125rem;
  font-size: var(--panel-header-icon-size, 1.625rem); }

.panel__head-tools {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap; }

.panel__head-tools .paragraph {
  margin: 0; }

.panel__head h1,
.panel__head h2,
.panel__head h3,
.panel__head h4 {
  font-weight: var(--panel-header-font-weight, normal);
  color: var(--panel-header-color, var(--font-color-headlines, #003865));
  margin: 0;
  text-transform: var(--panel-header-text-transform, var(--header-button-text-transform, uppercase)); }

.panel__body {
  background: var(--panel-body-bg-color, #fff);
  padding: 0 0.9375rem 1.5625rem 0.9375rem;
  border-radius: 0 0 var(--panel-border-radius, 0) var(--panel-border-radius, 0); }

.panel__footer {
  background: var(--panel-footer-bg-color, #fff);
  border-top: var(--panel-header-border-bottom, 0.0625rem solid var(--default-border-color, #cdcdcd));
  margin-top: 0.9375rem;
  padding: 0.9375rem; }

/************************************

 MEDIA-QUERIES

 ************************************/
@media (max-width: 768px) {
  .panel__head {
    flex-wrap: wrap; }
  .panel__head-tools {
    flex: 1;
    justify-content: flex-end; } }

.card-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(var(--card-width), 1fr));
  grid-gap: var(--card-gap, 0.9375rem);
  grid-auto-rows: 1fr; }

.card {
  box-shadow: 0 0.3125rem 0.4375rem 0 var(--card-box-shadow, rgba(0, 0, 0, var(--box-shadow)));
  transition: 0.4s;
  background: var(--card-bg-color, #fff);
  border-radius: var(--card-border-radius, 0);
  padding: 0;
  display: flex;
  flex-direction: column; }

.card__head > *,
.card__footer > *,
.card__body > * {
  margin: 0;
  padding: 0; }

.card__head,
.card__footer,
.card__body {
  padding: var(--card-padding, 0.9375rem); }

.card__body {
  flex: 1; }

.card__head,
.card__footer {
  border-bottom: var(--card-border, var(--panel-header-border-bottom, 0.0625rem solid var(--default-border-color, #cdcdcd)));
  display: flex;
  align-items: center; }

.card__footer {
  border-bottom: none;
  border-top: var(--card-border, var(--panel-header-border-bottom, 0.0625rem solid var(--default-border-color, #cdcdcd)));
  margin-top: auto; }

.card__tools {
  display: inline-flex;
  align-items: center; }

.card__column {
  display: inline-flex;
  flex-direction: column; }

.card-container.card--height-unequal {
  grid-auto-rows: auto; }
  .card-container.card--height-unequal .card {
    align-self: self-start; }

.card-container.card--auto-fit {
  grid-template-columns: repeat(auto-fit, minmax(var(--card-width), 1fr)); }

.card-container[class*="size--width-"] {
  width: auto; }

@media screen and (max-width: 670px) {
  .card-container {
    grid-template-columns: repeat(1, 1fr);
    grid-auto-rows: auto; }
    .card-container .card {
      align-self: self-start; } }

.label-group {
  align-items: flex-start;
  display: flex;
  margin: 0.3125rem 0; }

.legend__label-group {
  margin: 0.9375rem 0; }

.label-group__label {
  cursor: pointer;
  min-height: var(--form-label-min-height, 2.1875rem);
  display: inline-flex;
  align-items: flex-end; }

.legend__label-group .label-group__label-text {
  font-weight: bold; }

.label-group__label-text {
  cursor: pointer;
  font-weight: var(--form-label-font-weight, normal);
  line-height: calc(var(--form-label-line-height, 0.875rem) * 1.5); }

.label-group__tools {
  display: flex;
  align-items: flex-start;
  padding: 0.1875rem 0 0 0.3125rem;
  min-height: var(--form-label-min-height, 2.1875rem); }

.label-group__tools > .button {
  margin-right: 0.3125rem; }

.input-group {
  flex-direction: row;
  display: flex; }

.input-group__addon-before,
.input-group__addon-after {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  min-height: 100%;
  min-width: calc(var(--button-default-height, 1.875rem) + 0.125rem); }

.input-group__addon-before.input-group__addon-before--empty {
  min-width: 0; }

.input-group__addon-before [class*='input-group__'] {
  border-right: none; }

.input-group__addon-before [class*='input-group__']:first-child {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0; }

.input-group__addon-before [class*='input-group__']:not(:first-child) {
  border-radius: 0; }

.input-group > div + .input-group__inputs [class*='input-group__element-']:not(.input-group__element-textarea) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0; }

.input-group > div + .input-group__inputs .input-group__element-textarea {
  border-top-left-radius: 0; }

.input-group > div + .input-group__inputs:not(:last-child) [class*='input-group__element-']:not(.input-group__element-textarea) {
  border-radius: 0; }

.input-group > div + .input-group__inputs:not(:last-child) .input-group__element-textarea {
  border-top-right-radius: 0; }

.input-group .input-group__addon-after [class*='input-group__'] {
  border-left: none; }

.input-group .input-group__addon-after [class*='input-group__']:last-child {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0; }

.input-group .input-group__addon-after [class*='input-group__']:not(:last-child) {
  border-radius: 0; }

.input-group__addon-before.input-group__addon-before--empty + .input-group__inputs > [class*='input-group__element'],
.input-group__addon-before.input-group__addon-before--empty + .input-group__inputs > .input-select .input-select__element {
  border-top-left-radius: var(--default-border-radius, 0.3125rem) !important;
  border-bottom-left-radius: var(--default-border-radius, 0.3125rem) !important;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0; }

.input-group__addon-before.input-group__addon-before--empty + .input-group__inputs > [class*='input-group__element'].input-textarea {
  border-top-left-radius: var(--default-border-radius, 0.3125rem) !important;
  border-bottom-left-radius: var(--default-border-radius, 0.3125rem) !important;
  border-top-right-radius: 0;
  border-bottom-right-radius: var(--default-border-radius, 0.3125rem) !important; }

.input-group__inputs {
  flex: 1;
  position: relative; }

.input-group__icon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border: var(--form-inputs-border-width, 0.0625rem) solid var(--form-inputs-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  padding: 0 0.3125rem;
  background-color: var(--form-count-char-bg-color, #f1f1f1);
  height: calc(var(--button-default-height, 1.875rem) + 0.125rem);
  color: var(--button-type-info-color, #8a8a8a); }

.input-group__button {
  margin: 0; }

.input-group__button:hover {
  border-color: var(--form-inputs-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd))); }

.input-group__button:focus,
.input-group__button:active {
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 0.1875rem var(--focus-shadow-color, #3c7dcd);
  z-index: 2;
  border-color: var(--form-inputs-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd))); }

.input-group__icon,
.input-group__button,
.checkbox-group__button,
.radio-group__button,
.read-only__button,
.button-type--info.input-group__button,
.button--type-info.input-group__button {
  box-shadow: none;
  border-color: var(--form-inputs-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  border-radius: var(--default-border-radius, 0.3125rem); }

.input-group__icon,
.input-group__button [class^="icon-"],
.input-group__button [class*=" icon-"],
.checkbox-group__button [class^="icon-"],
.checkbox-group__button [class*=" icon-"],
.radio-group__button [class^="icon-"],
.radio-group__button [class*=" icon-"] {
  font-size: var(--default-icon-size, 1.5rem); }

.input-text,
.input-select__element,
.input-textarea {
  display: flex;
  border: var(--form-inputs-border-width, 0.0625rem) solid var(--form-inputs-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  height: calc(var(--button-default-height, 1.875rem) + var(--form-inputs-border-width, 0.0625rem) * 2);
  min-height: 100%;
  padding: 0 1.5625rem 0 0.3125rem;
  background-color: var(--form-inputs-bg-color, #fff);
  box-shadow: none;
  box-sizing: border-box;
  width: 100%;
  border-radius: var(--default-border-radius, 0.3125rem); }

::-ms-reveal {
  display: none; }

.password {
  position: absolute;
  top: 0;
  right: 0.3125rem; }

.input-type--password {
  padding-right: calc(var(--button-default-height, 1.875rem) + 0.625rem); }

.password-strength {
  align-items: center;
  justify-content: flex-end;
  display: flex;
  padding: 0.3125rem 0; }

.password-strength__message {
  display: flex;
  align-items: center;
  line-height: var(--font-size-small, 0.6875rem);
  font-size: var(--font-size-small, 0.6875rem);
  padding: 0 0.3125rem;
  text-transform: uppercase; }

.password-strength__container {
  background: var(--form-count-char-bg-color, #f1f1f1);
  border: var(--form-inputs-border-width, 0.0625rem) solid var(--form-inputs-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  border-radius: var(--default-border-radius, 0.3125rem);
  display: flex;
  overflow: hidden;
  max-width: 18.75rem;
  width: 100%; }

.password-progressbar {
  display: flex;
  align-items: center;
  justify-content: center;
  text-transform: uppercase;
  font-size: var(--font-size-small, 0.6875rem);
  line-height: var(--font-size-small, 0.6875rem);
  height: 0.875rem;
  transition: width .5s; }

.strength--step-1,
.strength--step-2,
.strength--step-3,
.strength--step-4 {
  border-radius: var(--default-border-radius, 0.3125rem);
  animation: fadeInLeft 1s ease-out;
  text-shadow: 0.0625rem 0.0625rem 0.125rem black; }

.strength--step-1 {
  background-color: #aa2222;
  color: #fff;
  width: 25%; }

.strength--step-2 {
  background-color: #f1c40f;
  color: #000;
  text-shadow: 0.0625rem 0.0625rem 0.125rem white;
  width: 50%; }

.strength--step-3 {
  background-color: #0D6FBA;
  color: #fff;
  width: 75%; }

.strength--step-4 {
  background-color: #146140;
  color: #fff;
  width: 100%; }

.input-text--autocomplete {
  padding-right: calc(var(--button-default-height, 1.875rem) + 0.5rem); }

.input-select {
  position: relative; }
  .input-select::after {
    content: "\e904";
    font-family: 'icomoon';
    width: var(--button-default-height, 1.875rem);
    height: var(--button-default-height, 1.875rem);
    min-height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    pointer-events: none;
    transform: rotate(90deg); }

option {
  background-color: var(--form-inputs-bg-color, #fff); }

.input-select__element {
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

.input-textarea {
  height: var(--form-textarea-height, 7.5rem);
  min-height: var(--form-textarea-height, 7.5rem);
  text-align: left;
  padding: 0.625rem;
  resize: vertical; }

.checkbox-group,
.radio-group {
  flex-direction: row;
  display: flex;
  min-height: var(--button-default-height, 1.875rem);
  justify-content: flex-start; }

.checkbox-group__addon,
.radio-group__addon {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  height: 100%;
  min-height: var(--button-default-height, 1.875rem);
  min-width: calc(var(--button-default-height, 1.875rem) + 0.375rem); }

.checkbox-group__addon .button:not(.footnote__button),
.radio-group__addon .button:not(.footnote__button) {
  border-radius: var(--default-border-radius, 0.3125rem); }

.checkbox-group__addon:first-child,
.radio-group__addon:first-child {
  justify-content: flex-start;
  margin-right: 0.625rem; }

.checkbox-group__addon:last-child,
.radio-group__addon:last-child {
  justify-content: flex-end;
  margin-left: 0.3125rem; }

.checkbox-group__wrapper,
.radio-group__wrapper {
  min-height: var(--button-default-height, 1.875rem);
  margin-top: calc(var(--form-checkbox-width-height, 1.25rem) - var(--font-size-base, 0.875rem));
  position: relative; }

.checkbox-group__wrapper .checkbox-group__label,
.radio-group__wrapper .radio-group__label {
  cursor: pointer;
  display: inline-block;
  font-size: var(--font-size-base, 0.875rem);
  min-height: var(--form-checkbox-width-height, 1.25rem);
  padding: var(--form-checkbox-padding-top, 0.1875rem) 0 0 calc(var(--form-checkbox-width-height, 1.25rem) + 0.625rem);
  text-align: left; }

.checkbox-group__wrapper .checkbox-group__checkbox,
.radio-group__wrapper .radio-group__radio {
  left: -99999px;
  top: 0;
  position: absolute; }

.checkbox-group__wrapper .checkbox-group__label::before {
  background-color: #fff;
  border-radius: var(--default-border-radius, 0.3125rem);
  position: absolute;
  border: 0.0625rem solid var(--form-inputs-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  content: "";
  height: var(--form-checkbox-width-height, 1.25rem);
  width: var(--form-checkbox-width-height, 1.25rem);
  max-height: var(--form-checkbox-width-height, 1.25rem)0.625rem;
  max-width: var(--form-checkbox-width-height, 1.25rem)0.625rem;
  top: calc(var(--form-checkbox-width-height, 1.25rem) / 2 + 0.0625rem);
  left: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
  z-index: 2; }

.checkbox-group__wrapper > .checkbox-group__checkbox:checked + .checkbox-group__label::before {
  font-family: 'icomoon';
  content: "\e900";
  color: var(--form-checkbox-checked-color, #fff);
  font-size: var(--form-checkbox-icon-font-size, 1rem);
  background: var(--form-checkbox-checked-bg-color, #21a665);
  border: 0.0625rem solid var(--form-checkbox-checked-bg-color, #21a665);
  border-radius: var(--default-border-radius, 0.3125rem);
  animation: fadeIn 0.7s ease; }

.checkbox-group__wrapper > .checkbox-group__checkbox:disabled + .checkbox-group__label::before {
  background-color: #ebeced;
  color: #4d4d4d;
  pointer-events: none;
  border-color: #4d4d4d;
  border-radius: var(--default-border-radius, 0.3125rem); }

.radio-group__wrapper .radio-group__label::before {
  position: absolute;
  border: 0.0625rem solid var(--form-inputs-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  content: "";
  height: var(--form-checkbox-width-height, 1.25rem);
  width: var(--form-checkbox-width-height, 1.25rem);
  top: calc(var(--form-checkbox-width-height, 1.25rem) / 2 + 0.0625rem);
  left: 0.0625rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
  border-radius: 100%;
  z-index: 2; }

.radio-group__wrapper > .radio-group__radio:checked + .radio-group__label::before,
.radio-group__wrapper > .radio-group__radio:checked + .radio-group__label::after {
  border-color: var(--form-checkbox-checked-bg-color, #21a665); }

.radio-group__wrapper > .radio-group__radio:checked + .radio-group__label::after {
  position: absolute;
  content: "";
  height: calc((var(--form-checkbox-width-height, 1.25rem) / 2));
  width: calc((var(--form-checkbox-width-height, 1.25rem) / 2));
  background: var(--form-checkbox-checked-bg-color, #21a665);
  border-radius: 100%;
  left: calc(((var(--form-checkbox-width-height, 1.25rem) + 0.125rem) - (var(--form-checkbox-width-height, 1.25rem) / 2)) / 2);
  top: calc(((var(--form-checkbox-width-height, 1.25rem) + 0.125rem) - (var(--form-checkbox-width-height, 1.25rem) / 2)) / 2);
  animation: fadeIn 0.7s ease; }

.checkbox-group__wrapper .checkbox-group__checkbox:focus + .checkbox-group__label::before,
.checkbox-group__wrapper > .checkbox-group__checkbox:checked:focus + .checkbox-group__label::before,
.checkbox-group__wrapper > .checkbox-group__checkbox:disabled:focus + .checkbox-group__label::before,
.radio-group__wrapper .radio-group__radio:focus + .radio-group__label::before {
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 0.1875rem var(--focus-shadow-color, #3c7dcd);
  z-index: 2; }

.radio-group__wrapper > .radio-group__radio:disabled + .radio-group__label::before {
  border-color: #4d4d4d;
  background-color: #ebeced;
  color: #4d4d4d;
  pointer-events: none;
  z-index: 2; }

.radio-group__wrapper > .radio-group__radio:disabled:checked + .radio-group__label::after {
  background-color: #4d4d4d;
  z-index: 3; }

.checkbox-group--readonly, .radio-group--readonly {
  background-color: transparent; }
  .checkbox-group--readonly:not(:checked) + .radio-group__label, .checkbox-group--readonly:not(:checked) + .checkbox-group__label, .radio-group--readonly:not(:checked) + .radio-group__label, .radio-group--readonly:not(:checked) + .checkbox-group__label {
    cursor: default;
    pointer-events: none; }
    .checkbox-group--readonly:not(:checked) + .radio-group__label::before, .checkbox-group--readonly:not(:checked) + .checkbox-group__label::before, .radio-group--readonly:not(:checked) + .radio-group__label::before, .radio-group--readonly:not(:checked) + .checkbox-group__label::before {
      border: none !important; }
  .checkbox-group--readonly:checked + .radio-group__label, .checkbox-group--readonly:checked + .checkbox-group__label, .radio-group--readonly:checked + .radio-group__label, .radio-group--readonly:checked + .checkbox-group__label {
    cursor: default;
    pointer-events: none; }
    .checkbox-group--readonly:checked + .radio-group__label::before, .checkbox-group--readonly:checked + .checkbox-group__label::before, .radio-group--readonly:checked + .radio-group__label::before, .radio-group--readonly:checked + .checkbox-group__label::before {
      border: 0.0625rem solid #4d4d4d !important;
      background: transparent !important;
      color: #4d4d4d !important; }
    .checkbox-group--readonly:checked + .radio-group__label::after, .checkbox-group--readonly:checked + .checkbox-group__label::after, .radio-group--readonly:checked + .radio-group__label::after, .radio-group--readonly:checked + .checkbox-group__label::after {
      background: #4d4d4d !important; }

.input-text:focus,
.input-textarea:focus {
  outline: none;
  color: var(--font-color-base, #000);
  background-color: var(--form-inputs-bg-color-focus, #eaeff6); }

.input-select__element:focus {
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 0.1875rem var(--focus-shadow-color, #3c7dcd);
  z-index: 2; }

.radio-group__label [class^="icon-"],
.checkbox-group__label [class^="icon-"] {
  font-size: calc(var(--font-size-base, 0.875rem) * 1.1); }

.textbox {
  display: inline-flex;
  text-align: left;
  align-items: center; }

.input-group__count-char {
  border: var(--form-inputs-border-width, 0.0625rem) solid var(--form-inputs-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  border-radius: var(--default-border-radius, 0.3125rem);
  background-color: var(--form-count-char-bg-color, #f1f1f1);
  color: #000;
  display: flex;
  font-size: var(--form-count-char-font-size, 0.625rem);
  align-items: center;
  justify-content: center;
  height: calc(var(--button-default-height, 1.875rem) + 0.125rem);
  padding: 0 0.3125rem;
  font-family: sans-serif; }

.read-only {
  display: table;
  width: 100%;
  height: calc(var(--button-default-height, 1.875rem) + 0.125rem); }

.read-only__container-before,
.read-only__container-after {
  display: flex; }

.read-only__text {
  padding: 0;
  min-height: calc(var(--button-default-height, 1.875rem) + 0.125rem);
  font-weight: var(--read-only-font-weight, bold);
  width: 100%;
  display: table-cell;
  vertical-align: middle; }

.read-only__container-before + .read-only__text,
.read-only__text + .read-only__container-after {
  padding-left: 0.625rem; }

.label-hint--mandatory,
.label-hint--conditional,
.label-hint--recommended {
  cursor: default;
  font-weight: bold; }

.label-hint--mandatory,
.label-hint--mandatory:hover {
  background-color: #aa2222;
  color: #fff; }

.label-hint--mandatory::after {
  content: "!";
  position: relative;
  top: -0.0625rem; }

.label-hint--conditional,
.label-hint--conditional:hover {
  background-color: #0D6FBA;
  color: #fff; }

.label-hint--conditional::after {
  content: "!";
  position: relative;
  top: -0.0625rem; }

.label-hint--conditional-recommended,
.label-hint--conditional-recommended:hover {
  background-color: #0D6FBA;
  color: #fff; }

.label-hint--conditional-recommended::after {
  content: "+";
  position: relative;
  top: -0.0625rem; }

.label-hint--recommended,
.label-hint--recommended:hover {
  background-color: #CD3F00;
  color: #fff; }

.label-hint--recommended::after {
  content: "+";
  position: relative;
  top: -0.0625rem; }

.status--error .label-group__label,
.status--error .label-group__label-text,
.status--error .checkbox-group__label,
.status--error .radio-group__label {
  color: #aa2222;
  font-weight: bold; }

.status--error .input-group__inputs *,
.status--error .checkbox-group__label::before {
  border: var(--form-inputs-border-width, 0.0625rem) solid #aa2222; }

.status--error .input-select::after {
  color: #aa2222; }

.status--error .input-select {
  border: none; }

.autocomplete {
  display: flex;
  position: relative;
  flex-direction: column; }

.autocomplete .input-text[aria-expanded="false"] + .autocomplete__box {
  display: none; }

.autocomplete .input-text[aria-expanded="true"] {
  border-bottom-right-radius: 0; }

.autocomplete .input-text[aria-expanded="true"] + .autocomplete__box {
  animation: fadeIn .4s ease-in; }

.autocomplete__box {
  border: 0.0625rem solid var(--form-inputs-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  border-top: none;
  box-shadow: 0 0.3125rem 0.3125rem 0 var(--auto-complete-box-shadow, rgba(0, 0, 0, 0.1));
  background-color: var(--form-inputs-bg-color, #fff);
  flex-direction: column;
  list-style: none;
  margin: calc(1.875rem + 0.0625rem * 2) 0 0 0;
  max-height: calc(1.875rem * 6);
  overflow-y: auto;
  padding: 0;
  position: absolute;
  width: calc(100% - 0.0625rem * 2);
  z-index: 9998; }

.autocomplete__box-item {
  align-items: center;
  border-bottom: 0.0625rem solid var(--form-inputs-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  cursor: pointer;
  min-height: calc(1.875rem + 0.0625rem * 2);
  display: flex;
  padding-left: 0.3125rem; }

.autocomplete__box-item[aria-selected="true"],
.autocomplete__box-item:hover {
  background: var(--auto-complete-button-bg-color-hover, #3c506e);
  color: var(--auto-complete-button-color-hover, #fff); }

.autocomplete__box-item:last-child {
  border-bottom-style: none; }

.autocomplete__hidden-text {
  display: none; }

.autocomplete--no-entry {
  cursor: default; }

.autocomplete--no-entry:hover {
  background: var(--auto-complete-button-bg-color-hover, #3c506e);
  color: var(--auto-complete-button-color-hover, #fff); }

@media (max-width: 450px) {
  .password-strength__message {
    position: absolute;
    overflow: hidden;
    left: -10000px;
    top: auto;
    color: #000;
    padding: 0;
    border: none;
    width: 1px;
    height: 1px;
    background: #fff; } }

/*****
 LOGIN ELEMENTE
 *****/
/* LAYOUT */
/* LOGIN WRAPPER */
.login-wrapper {
  background: var(--login-wrapper-bg-color, #fff);
  flex-direction: column;
  display: flex;
  min-height: 100vH;
  padding: 0 0.9375rem; }

/* LOGIN MAIN */
.login-main {
  align-items: center;
  display: flex;
  flex: 1 1 100%;
  justify-content: center; }

/* LOGIN FOOTER */
.login-footer {
  display: flex;
  padding-bottom: 0.3125rem;
  width: 100%; }

.login-footer__text,
.login-footer__text .link,
.login-footer__text .link-icon {
  color: var(--login-bottom-link-color, #000);
  font-size: var(--login-bottom-link-font-size, 0.75rem); }

/* LOGIN PANEL */
.login {
  max-width: 28.125rem;
  margin-bottom: 0.9375rem;
  width: 100%; }

.login-top {
  background: var(--panel-body-bg-color, #fff);
  border-radius: var(--default-border-radius, 0.3125rem);
  box-shadow: 0 0.9375rem 2.1875rem 0.625rem rgba(0, 0, 0, var(--login-box-shadow, 0.5));
  padding: 0.9375rem; }

.login .text-separator {
  margin: 0.9375rem 0; }

/* LOGIN HEAD */
.login__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center; }

/* Sollte in der Hoehe 50px nicht überschreiten */
.login__head-image {
  height: 5rem;
  display: flex;
  justify-content: center;
  align-items: center; }

.login__head-headline {
  margin: 0 0 0.3125rem 0;
  text-align: center; }

.login__head-subline {
  font-size: var(--font-size-h3, 1.125rem);
  margin: 0;
  text-align: center; }

/* LOGIN BODY */
.login__body {
  display: flex;
  flex-direction: column;
  min-height: 12.5rem; }

.login__body .button,
.login__body .link {
  align-self: flex-start; }

/* FUER NACHRICHTEN UND/ODER TEXT */
.login__body-message-container {
  margin-top: 1.25rem; }

.login__body-message-container > * {
  margin: 0 0 0.9375rem 0; }

/* Formelemente */
.login .label-group__label {
  min-height: 1.25rem; }

.login .message {
  box-shadow: none; }

.login .login__button {
  margin: 1.5625rem 0 0.9375rem 0; }

.login .input-select__element {
  border-radius: 0;
  background-color: transparent;
  border-color: transparent;
  padding-left: 0; }

/* LOGIN FOOTER */
.login-bottom {
  margin-top: 1.875rem;
  padding: 0; }

.login-bottom .input-select,
.login-bottom .input-select__element,
.login-bottom .link {
  color: var(--login-bottom-link-color, #000);
  font-size: var(--login-bottom-link-font-size, 0.75rem); }

.login-bottom .input-select option {
  font-size: var(--font-size-base, 0.875rem); }

.login-bottom-row {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap; }

.login-bottom-column {
  display: flex;
  align-items: center;
  flex-wrap: wrap; }

.login-bottom-column .link,
.login-bottom-column .button {
  margin-right: 0.625rem; }

.login-bottom-column .link:last-child {
  margin-right: 0; }

/* BUTTONS VOR UND ZURUECK */
.login-steps-container {
  display: flex;
  flex-wrap: wrap;
  border-top: 0.0625rem solid var(--seperator-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  margin-top: 2.8125rem;
  align-items: center;
  justify-content: space-between;
  padding-top: 0.9375rem; }

/*****
 OUTPUT ELEMENTE
 *****/
/* Verwendung fuer:
 - INPUT[TYPE="XXX"]
 - SELECT
 - TEXTAREA
 */
.output-label-group__label,
.output-radio-group__label,
.output-checkbox-group__label,
.output-input-group__value-text {
  font-size: var(--font-size-base, 0.875rem); }

/* Label Ausgabe Label  */
.output-label-group {
  align-items: flex-start;
  display: flex;
  margin: 0.3125rem 0; }

.output-label-group__label {
  align-items: flex-end;
  display: inline-flex;
  min-height: var(--form-label-min-height, 2.1875rem);
  border-bottom: 0.0625rem solid var(--form-inputs-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd))); }

.output-label-group__label-text {
  display: inline-block;
  font-weight: var(--form-label-font-weight, normal);
  line-height: calc(var(--form-label-line-height, 0.875rem) * 1.5); }

/* Input Ausgabe Value*/
.output-input-group {
  align-items: flex-start;
  display: flex;
  min-height: calc(var(--button-default-height, 1.875rem) + var(--form-inputs-border-width, 0.0625rem) * 2); }

.output-input-group__addon-before {
  align-items: center;
  display: flex;
  justify-content: center;
  min-height: calc(var(--button-default-height, 1.875rem) + var(--form-inputs-border-width, 0.0625rem) * 2);
  min-width: calc(var(--button-default-height, 1.875rem) + 0.125rem); }

.output-input-group__value {
  display: inline-block;
  padding-top: var(--output-input-padding-top, 0.375rem); }

.output-input-group__addon-before + .output-input-group__value {
  padding-left: 0.625rem;
  padding-right: 0.625rem; }

.output-input-group__value-text {
  display: inline-block;
  line-height: var(--font-line-height-base, 120%); }

.output-input-group__value-text a,
.output-input-group__value-text a:hover,
.output-input-group__value-text a:active,
.output-input-group__value-text a:visited {
  background: none;
  color: var(--link-normal-color, #003865);
  font-weight: var(--link-normal-weight, normal);
  font-style: var(--link-normal-style, normal);
  text-decoration: var(--link-normal-decoration, underline); }

.output-input-group__value-text a:hover {
  text-decoration: var(--link-hover-decoration, none); }

/*
 CHECKBOX
 */
.output-checkbox-group {
  align-items: flex-start;
  display: flex;
  justify-content: flex-start;
  min-height: var(--button-default-height, 1.875rem);
  padding-bottom: 0.25rem; }

.output-checkbox-group__wrapper {
  display: flex;
  min-height: var(--button-default-height, 1.875rem);
  padding: 0; }

.output-checkbox-group__addon {
  align-items: center;
  display: flex;
  height: 100%;
  min-height: var(--button-default-height, 1.875rem);
  min-width: calc(var(--button-default-height, 1.875rem) + 0.375rem); }

.output-checkbox-group__addon:first-child {
  justify-content: flex-start;
  margin-right: 0.625rem; }

.output-checkbox-group__addon:last-child {
  justify-content: flex-end;
  margin-left: 0.3125rem; }

.output-checkbox-group__checkbox {
  align-items: center;
  border: 0.0625rem solid transparent;
  border-radius: var(--default-border-radius, 0.3125rem);
  display: inline-flex;
  height: var(--form-checkbox-width-height, 1.25rem);
  justify-content: center;
  margin-top: calc((var(--button-default-height, 1.875rem) - var(--form-checkbox-width-height, 1.25rem)) / 2 + 0.0625rem);
  min-width: var(--form-checkbox-width-height, 1.25rem); }

.output-checkbox--status-checked {
  background: var(--form-checkbox-checked-bg-color, #21a665);
  border: 0.0625rem solid var(--form-checkbox-checked-bg-color, #21a665);
  border-radius: var(--default-border-radius, 0.3125rem); }

.output-checkbox--status-checked::before {
  color: var(--form-checkbox-checked-color, #fff);
  content: "\e900";
  font-family: 'icomoon';
  font-size: var(--form-checkbox-icon-font-size, 1rem);
  line-height: var(--form-checkbox-icon-font-size, 1rem); }

.output-checkbox-group__label {
  display: inline-block;
  padding: 0 0 0 0.625rem;
  padding-top: calc(var(--form-checkbox-width-height, 1.25rem) - var(--font-size-base, 0.875rem) + 0.125rem); }

/*
 RADIOBUTTON
 */
.output-radio-group {
  align-items: flex-start;
  display: flex;
  justify-content: flex-start;
  height: 100%;
  min-height: var(--button-default-height, 1.875rem); }

.output-radio-group__wrapper {
  display: flex;
  margin-bottom: calc((var(--button-default-height, 1.875rem) - var(--form-checkbox-width-height, 1.25rem)) / 2);
  min-height: var(--button-default-height, 1.875rem);
  padding: 0; }

.output-radio-group__addon {
  align-items: center;
  display: flex;
  height: 100%;
  min-height: var(--button-default-height, 1.875rem);
  min-width: calc(var(--button-default-height, 1.875rem) + 0.375rem); }

.output-radio-group__addon:first-child {
  justify-content: flex-start;
  margin-right: 0.625rem; }

.output-radio-group__addon:last-child {
  justify-content: flex-end;
  margin-left: 0.3125rem; }

.output-radio-group__radio {
  align-self: flex-start;
  align-items: center;
  border: 0.0625rem solid transparent;
  border-radius: 100%;
  display: inline-flex;
  justify-content: center;
  margin-top: calc((var(--button-default-height, 1.875rem) - var(--form-checkbox-width-height, 1.25rem)) / 2);
  max-height: var(--form-checkbox-width-height, 1.25rem)0.625rem;
  max-width: var(--form-checkbox-width-height, 1.25rem)0.625rem;
  min-height: var(--form-checkbox-width-height, 1.25rem);
  min-width: var(--form-checkbox-width-height, 1.25rem); }

.output-radio-group__label {
  display: inline-block;
  padding: 0 0 0 0.625rem;
  padding-top: calc(var(--form-checkbox-width-height, 1.25rem) - var(--font-size-base, 0.875rem) + 0.125rem); }

.output-radio--status-checked {
  border-color: var(--form-checkbox-checked-bg-color, #21a665); }

.output-radio--status-checked::before {
  background: var(--form-checkbox-checked-bg-color, #21a665);
  border-radius: 100%;
  content: "";
  height: calc((var(--form-checkbox-width-height, 1.25rem) / 2));
  width: calc((var(--form-checkbox-width-height, 1.25rem) / 2)); }

/*****
 FUSSNOTE
 *****/
.footnote {
  display: inline-block;
  padding: 1.25rem 1.25rem 0.9375rem 1.25rem;
  margin-top: 1.25rem;
  background: var(--panel-header-bg-color, #fff); }

.footnote :target {
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 0.1875rem var(--focus-shadow-color, #3c7dcd);
  z-index: 2; }

/* Falls footnote im panel steht */
.panel .footnote {
  padding-left: 0; }

.footnote__list {
  border-top: var(--panel-header-border-bottom, 0.0625rem solid var(--default-border-color, #cdcdcd));
  list-style-type: none;
  margin-left: 0;
  display: table; }

.footnote__list li {
  margin-bottom: 0.3125rem; }

.footnote__list li:first-child {
  margin-top: 0.625rem; }

.footnote__button {
  font-family: Verdana, sans-serif;
  font-size: 0.6875rem;
  line-height: 0.6875rem;
  min-height: 1rem;
  min-width: 1rem;
  padding: 0;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  border: none; }

.footnote-icon,
.footnote-text {
  display: table-cell; }

.footnote-icon {
  min-width: 1.25rem;
  vertical-align: top;
  text-align: center; }

.footnote-icon .button {
  cursor: default; }

.footnote-text {
  padding-top: 0.1875rem;
  padding-left: 0.3125rem;
  font-size: var(--font-size-small, 0.6875rem);
  line-height: calc(var(--font-size-small, 0.6875rem) * 1.3); }

.footnote-number:after {
  content: attr(data-js-footnote-number);
  position: relative;
  top: -0.0625rem; }

/*****
 LEGENDE
 *****/
.legend {
  display: flex;
  flex-direction: column;
  margin-top: 0.9375rem; }

.legend__item {
  display: inline-flex;
  margin-bottom: 0.625rem; }

.legend__item-icon {
  display: inline-flex;
  min-width: var(--button-default-height, 1.875rem);
  justify-content: center;
  align-items: center;
  padding-right: 0.625rem; }

/* PSEUDO BUTTTON */
.legend__button {
  cursor: default; }

.legend__button:hover {
  background-color: var(--button-default-bg-color, #003865);
  color: var(--button-default-color, #fff); }

/* <p> TAG */
.legend__paragraph {
  display: inline-flex;
  align-items: center;
  margin: 0; }

/*****
 BREADCRUMB
 *****/
.breadcrumb {
  background: var(--breadcrumb-bg-color, #fff);
  box-shadow: 0 0.3125rem 0.4375rem 0 rgba(0, 0, 0, var(--box-shadow));
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin: 0 0 0.9375rem 0;
  padding: 0.3125rem 0.625rem; }

.breadcrumb__item {
  align-items: center;
  display: inline-flex;
  height: calc(1.875rem - (var(--breadcrumb-text-font-size, var(--font-size-base, 0.875rem)) / 2));
  line-height: var(--breadcrumb-text-font-size, var(--font-size-base, 0.875rem));
  margin: calc(var(--breadcrumb-text-font-size, var(--font-size-base, 0.875rem)) / 2) 0;
  min-height: calc(1.875rem - (var(--breadcrumb-text-font-size, var(--font-size-base, 0.875rem)) / 2)); }

.breadcrumb__item::after {
  content: "\e906";
  font-family: 'icomoon';
  margin: 0 0.3125rem;
  font-size: calc(var(--breadcrumb-text-font-size, var(--font-size-base, 0.875rem)) * 1.3); }

.breadcrumb__item:last-child::after {
  display: none; }

/* Aktuelle Seite */
.breadcrumb__item[aria-current="page"] {
  font-weight: var(--font-weight-bold-base, bold);
  font-family: var(--font-family-bold, var(--font-family-base));
  color: var(--breadcrumb-active-color, #000);
  margin: 0.3125rem 0;
  text-decoration: none; }

.breadcrumb__link {
  align-items: center;
  display: inline-flex;
  font-size: var(--breadcrumb-text-font-size, var(--font-size-base, 0.875rem));
  hyphens: auto;
  overflow-wrap: break-word;
  word-wrap: break-word; }

.breadcrumb__link [class^="icon-"] {
  top: 0;
  font-size: calc(var(--breadcrumb-text-font-size, var(--font-size-base, 0.875rem)) * 1.5); }

/*****
 TOOLBAR
 *****/
.toolbar {
  margin: 0;
  padding: 0; }

.toolbar__box {
  background: var(--tool-box-bg-color, #e6e6e6);
  display: inline-flex;
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 0;
  border: 0.0625rem solid var(--tool-box-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd))); }

.toolbar__item {
  display: flex;
  align-items: center;
  padding: 0 0.3125rem;
  position: relative;
  height: var(--tool-box-height, 2.25rem); }

.toolbar__item::after {
  content: "";
  display: block;
  height: calc(var(--tool-box-height, 2.25rem) / 2);
  width: 0.0625rem;
  right: 0;
  bottom: calc((var(--tool-box-height, 2.25rem) - (var(--tool-box-height, 2.25rem) / 2)) / 2);
  position: absolute;
  background: var(--tool-box-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd))); }

.toolbar__item:last-child::after {
  display: none; }

/*****
 SEPERATOR
 *****/
.separator {
  padding: 0;
  display: block;
  position: relative; }

.separator--vertical {
  height: 100%;
  border: none;
  width: 0;
  border-left: 0.0625rem solid var(--seperator-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd))); }

.separator--horizontal {
  height: 100%;
  border: none;
  border-bottom: 0.0625rem solid var(--seperator-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd))); }

.text-separator {
  display: flex;
  overflow: hidden;
  align-items: center;
  justify-content: center; }

.text-separator__text {
  position: relative;
  display: flex;
  align-items: center;
  max-width: 80%; }

.text-separator__text::after,
.text-separator__text::before {
  content: "";
  position: absolute;
  height: 0.0625rem;
  background: var(--seperator-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  display: flex;
  width: 100vh; }

.text-separator__text::before {
  left: 100%;
  margin-left: 0.9375rem; }

.text-separator__text::after {
  right: 100%;
  margin-right: 0.9375rem; }

/*****
 MESSAGE BOXEN
 *****/
.message-container {
  padding: 0.9375rem; }

.message {
  background-color: var(--message-bg-color, #fff);
  flex-direction: row;
  display: flex;
  width: 100%;
  box-shadow: 0 0.3125rem 0.4375rem 0 rgba(0, 0, 0, 0.08);
  border-radius: var(--message-border-radius, 0);
  animation: fadeIn .4s ease-in; }

/* Abweichungen auf Panel */
.panel .panel__body .message {
  box-shadow: none; }

.message__status {
  flex: 0 0 auto;
  padding: 0 0.625rem;
  align-items: center;
  justify-content: center;
  display: flex;
  border-left: 0.3125rem solid;
  border-top-left-radius: var(--message-border-radius, 0);
  border-bottom-left-radius: var(--message-border-radius, 0); }

.message__paragraph {
  margin: 0.3125rem 0;
  padding-bottom: 0;
  font-size: var(--message-font-size, 0.8125rem);
  font-weight: var(--message-font-weight, 300); }

.message__notice {
  padding: 0.625rem;
  font-size: var(--message-font-size, 0.8125rem);
  align-items: center;
  justify-content: flex-start;
  width: 100%; }

/*****
 MESSAGE STYLE (INFO/ERROR/SUCCESS/WARNING)
 *****/
/* Message Style INFO */
.message--style-info .message__status {
  border-color: #0D6FBA; }

.message--style-info .badge {
  background-color: #0D6FBA;
  border-color: #0D6FBA;
  color: #fff; }

/* Message Style ERROR */
.message--style-error .message__status {
  border-color: #aa2222; }

.message--style-error .badge {
  background-color: #aa2222;
  border-color: #aa2222;
  color: #fff; }

/* Message Style SUCCESS */
.message--style-success .message__status {
  border-color: #146140; }

.message--style-success .badge {
  background-color: #146140;
  border-color: #146140;
  color: #fff; }

/* Message Style WARNING */
.message--style-warning .message__status {
  border-color: #f1c40f; }

.message--style-warning .badge {
  background-color: #f1c40f;
  border-color: #f1c40f;
  color: #000; }

/* TOAST MESSAGES */
/* Messagebox in App bei Benachrichtigungen - ein- ausfahren */
/* CONTAINER */
.toast-message-box {
  display: flex;
  flex-direction: column;
  max-width: var(--toast-message-max-width, 20rem);
  position: fixed;
  right: 0;
  top: calc(var(--header-button-height, 2.75rem) + 0.9375rem);
  z-index: 9999; }

.toast-message-box .message {
  margin-bottom: 0.9375rem;
  min-width: var(--toast-message-max-width, 20rem);
  animation: slideInRight .5s ease-in; }

.toast-message-box .message:last-child {
  margin-bottom: 0; }

/*****
 MODAL DIALOG
 *****/
.modal-dialog {
  position: fixed;
  z-index: 99999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); }

.modal-dialog__inner {
  max-width: var(--modal-dialog-max-width, 31.25rem);
  width: var(--modal-dialog-max-width, 31.25rem);
  max-height: 100%;
  overflow: hidden;
  overflow-y: auto;
  margin: 0 auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); }

.modal-dialog__inner .panel {
  margin: 0; }

.modal-dialog__button-box {
  display: inline-flex;
  width: 100%; }

/*****
 MODAL DIALOG MODIFIER
 *****/
/* Breite */
.modal-dialog__inner--width-max {
  width: calc(100% - 1.875rem);
  max-width: 87.5rem; }

/* Position */
.modal-dialog__inner--dircetion-top {
  top: 0;
  transform: translate(-50%, 0%); }

/*****
 PROGRESSBAR
 *****/
.progress {
  background: #f5f5f5;
  display: flex;
  height: 1rem;
  padding: 0.3125rem;
  box-shadow: inset 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.3); }

.progress__bar {
  display: flex;
  height: 100%;
  background-color: #2bc253;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #2bc253), color-stop(1, #54f054));
  box-shadow: inset 0 0 0.3125rem 0.3125rem rgba(0, 0, 0, 0.2);
  position: relative; }

@-webkit-keyframes move-bg {
  0% {
    background-position: 0 0; }
  100% {
    background-position: 0 2.8125rem; } }

.progress__bar::after {
  font-family: "Verdana", sans-serif;
  content: attr(aria-valuenow) "%";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.125rem 0.3125rem;
  border-radius: 0.1875rem;
  border-top-right-radius: 0;
  font-size: 0.625rem;
  background-color: black;
  position: absolute;
  right: 0;
  color: #fff;
  bottom: -1.5625rem; }

.progress__bar::before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 0.625rem 0.625rem;
  border-color: transparent transparent #000 transparent;
  position: absolute;
  bottom: -0.625rem;
  right: 0; }

.progress__animation {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.2);
  animation: raise-bg 3s ease-in-out infinite; }

@keyframes raise-bg {
  0% {
    width: 0; }
  100% {
    width: 100%; }
  /*
   from {
     width: 0;
   }
   50% {
     width: 100%;
   }
   to {
     width: 0;
   }
   */ }

@keyframes run-bg {
  0% {
    left: 0; }
  100% {
    left: 100%; } }

@keyframes run-bg-reverse {
  from {
    left: 0; }
  50% {
    left: 80%; }
  to {
    left: 0; } }

/*****
 TOGGLE
 *****/
.toggle {
  margin-bottom: var(--toggle-margin-bottom, 0.9375rem); }

.toggle__head {
  background-color: var(--toggle-head-bg-color, #f3f3f3);
  border: 0.0625rem solid var(--toggle-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  display: flex;
  padding: 0;
  align-items: center;
  min-height: var(--toggle-head-min-height-dialog-max-width, 2.5rem);
  justify-content: flex-start; }

.toggle__addon-before {
  flex: 1 1 auto;
  display: flex; }

.toggle__addon-after {
  flex: 0 0 auto; }

/* TABELLE IM TOGGLE HEADER */
.toggle-table {
  display: flex;
  height: 100%;
  flex-direction: column;
  flex: 1 1 0; }

.toggle-table__row {
  display: flex;
  height: 100%;
  flex-direction: row; }

.toggle-table__cell {
  align-items: center;
  display: flex;
  padding: 0.3125rem 0.3125rem 0.3125rem 0;
  text-align: left;
  font-weight: var(--toggle-head-link-weight, normal); }

/* Fuer Zahlen, Betraege */
.toggle-table__box {
  display: inline-block;
  min-width: var(--toogle-digitbox-width, 9.375rem); }

.toggle__separator.separator--vertical {
  border-left: 0.0625rem solid var(--toggle-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  display: block;
  width: 0;
  float: left; }

.toggle__head .button:not(.toggle__button) {
  box-shadow: none;
  margin: 0 0.3125rem; }

.toggle__head .toggle__button,
.toggle__footer .toggle__button {
  box-shadow: none;
  border-radius: 0;
  background-color: transparent;
  color: var(--toggle-head-link-color, #000);
  font-size: var(--toggle-head-font-size, var(--font-size-base, 0.875rem));
  border: none;
  margin: 0;
  justify-content: flex-start;
  text-decoration: none;
  flex: 1;
  min-height: var(--toggle-head-min-height-dialog-max-width, 2.5rem);
  align-items: center;
  padding: 0 0.3125rem; }

.toggle__head .toggle__button .button__text,
.toggle__footer .toggle__button .button__text {
  font-weight: var(--toggle-head-link-weight, normal);
  line-height: calc(var(--toggle-head-font-size, var(--font-size-base, 0.875rem)) * 1.2);
  text-transform: var(--toggle-head-text-transform, none); }

.toggle__head .toggle__button .button__text + .button__toggle,
.toggle__footer .toggle__button .button__text + .button__toggle {
  margin-left: auto; }

.toggle__head .toggle__button .button__text + .button__toggle > *,
.toggle__footer .toggle__button .button__text + .button__toggle > * {
  margin-right: 0.3125rem; }

.toggle__head .toggle__button .button__text + .button__toggle > *:last-child,
.toggle__footer .toggle__button .button__text + .button__toggle > *:last-child {
  margin-right: 0; }

/* ZUSTAENDE BUTTONS IM TOGGLE HEAD */
.toggle__head.toggle__head--active,
.toggle__head.toggle__head--active .toggle__button {
  background: var(--toggle-open-bg-color, brown);
  color: var(--toggle-open-text-color, red); }

.toggle__head:hover,
.toggle__head:hover .toggle__button,
.toggle__footer.open,
.toggle__footer.open .toggle__button {
  background: var(--toggle-head-bg-color-hover, #003865);
  color: var(--toggle-head-text-color-hover, #fff); }

.toggle__button:focus {
  background: var(--toggle-head-bg-color-focus, #003865);
  color: var(--toggle-head-text-color-focus, #fff);
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 0.1875rem var(--focus-shadow-color, #3c7dcd);
  z-index: 2; }

.toggle__footer.open .toggle__separator,
.toggle__head.open .toggle__separator,
.toggle__head:hover .toggle__separator {
  border-left-color: var(--toggle-head-seperator-color, #fff); }

.toggle__content {
  background-color: var(--toggle-content-bg-color, #fff);
  display: none;
  height: 0;
  padding: 0.9375rem;
  min-height: 3.125rem;
  border: var(--toggle-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  border-top: none;
  box-shadow: 0 0.1875rem 0.1875rem 0 var(--toggle-content-box-shadow, rgba(var(--default-box-shadow-color, #000), 0.1)); }

.toggle__content.open,
.toggle__content--open {
  border: 0.0625rem solid var(--toggle-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  border-top: none; }

.toggle__footer {
  display: none;
  background-color: var(--toggle-head-bg-color, #f3f3f3);
  border: var(--toggle-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  border-top: none;
  align-items: center;
  min-height: var(--toggle-head-min-height-dialog-max-width, 2.5rem);
  box-shadow: 0 0.25rem 0.25rem 0 var(--toggle-footer-box-shadow, rgba(var(--default-box-shadow-color, #000), 0.05)); }

.toggle__footer.open {
  display: flex; }

.toggle__footer .button:not(.toggle__button) {
  box-shadow: none;
  margin: 0 0.3125rem; }

.toggle__head .checkbox-group {
  justify-content: flex-start;
  align-items: center;
  margin: 0;
  flex: 1;
  min-height: var(--toggle-head-min-height-dialog-max-width, 2.5rem); }

.toggle__head > .checkbox-group {
  margin-left: 0.3125rem; }

.toggle__head .checkbox-group .checkbox-group__label::before {
  top: 0.125rem;
  transform: translateY(0); }

/* Button Icon geoeffnet */
.toggle__head.toggle__head--active .toggle__button .icon-toggle-close {
  animation: toggle-open ease-out 1s forwards; }

@keyframes toggle-open {
  from {
    transform: rotate(0deg); }
  to {
    transform: rotate(90deg); } }

/* Mehere Toggle */
.toggle-multiple {
  border-bottom: 0.0625rem solid var(--toggle-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd))); }

.toggle-multiple .toggle__content {
  box-shadow: none;
  border-top: var(--toggle-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  border-bottom: none; }

.toggle-multiple .toggle__content:nth-last-child(1) {
  border-bottom: var(--toggle-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  border-top: none;
  box-shadow: 0 0.1875rem 0.1875rem 0 var(--toggle-content-box-shadow, rgba(var(--default-box-shadow-color, #000), 0.1)); }

.toggle-multiple .toggle__head {
  border-bottom: none; }

/* Inhalt geoeffnet */
.toggle__content.toggle__content--open {
  animation: fadeIn 0.5s ease-in;
  display: block;
  height: 100%; }

/* transparent  Single */
.toggle .toggle__head.bg-color--transparent {
  border: var(--toggle-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd))); }

/* transparent  Multiple */
.toggle-multiple .toggle__head.bg-color--transparent {
  border-bottom: none; }

.toggle-multiple .toggle__head.bg-color--transparent:nth-last-child(2) {
  border-bottom: var(--toggle-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd))); }

/* PANELS INNERHALB VOM TOGGLE KEIN SCHATTEN */
.toggle__content .panel,
.toggle-multiple .panel {
  box-shadow: none; }

/************************************

 XRECHNUNG SPEZIFISCH

 ************************************/
/*****
 BOX/CONTAINER FUER DIE JEWEIIGE POSITION
 *****/
.position__box {
  margin-top: 0.9375rem;
  padding-bottom: 0.9375rem; }

/* ACHTUNG !!! ANPASSEN FUER VUE */
.position__box > .toggle + .row > .columns {
  padding-right: 0.9375rem; }

.position__box .toggle__content {
  background-color: #f2f2f2;
  padding: 0; }

.position__box .panel:last-child {
  margin-bottom: 0; }

/*****
 NACHLASS
 *****/
.estate-surcharge {
  margin: 1.875rem 0;
  padding-bottom: 0.625rem; }

.estate-surcharge__head {
  display: inline-flex;
  border: none;
  border-top: 0.0625rem solid var(--estate-surcharge-head-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  background: var(--estate-surcharge-head-bg-color, #eee);
  padding: 0.3125rem 0.625rem;
  text-transform: uppercase;
  justify-content: flex-start;
  align-items: center;
  position: relative;
  box-shadow: 0.3125rem 0.1875rem 0.3125rem 0 rgba(113, 106, 202, 0.4); }

.estate-surcharge__head::before,
.estate-surcharge__head::after {
  content: "";
  display: block;
  width: 100%;
  height: 0.625rem;
  top: 100%;
  left: 0;
  position: absolute;
  background: var(--estate-surcharge-content-bg-color, #fff);
  border-top: 0.0625rem solid var(--estate-surcharge-head-bg-color, #eee);
  z-index: 10; }

.estate-surcharge__head::after {
  border-top: 0.0625rem solid var(--estate-surcharge-head-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  left: 100%;
  width: 0.625rem; }

.estate-surcharge__head > .badge {
  margin: 0 0.3125rem 0 0; }

.estate-surcharge__head > .text + .badge {
  margin: 0 0 0 0.3125rem; }

.estate-surcharge__content {
  border-bottom: 0.0625rem solid var(--estate-surcharge-head-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  border-top: 0.0625rem solid var(--estate-surcharge-head-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  padding: 0 0.625rem 0.9375rem 0.625rem; }

/*****
SWITCH MODULE
 *****/
.switch-module {
  margin: 3.125rem 0;
  min-height: 3.125rem;
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  padding: 0 0.9375rem;
  background: var(--switch-module-bg-color, #fff);
  border-top: 0.0625rem solid var(--switch-module-border-color, #fff);
  box-shadow: 0 0.3125rem 0.4375rem 0 rgba(0, 0, 0, var(--box-shadow)); }

.switch-module__cell {
  padding: 0;
  margin: 0; }

.switch-module__link,
.switch-module__link-icon {
  text-decoration: var(--switch-module-link-text-transform, none); }

.switch-module__link:hover,
.switch-module__link-icon:hover {
  background: var(--switch-module-link-bg-color-hover, transparent);
  color: var(--switch-module-link-color-hover, #003865);
  text-decoration: var(--switch-module-link-text-transform-hover, underline); }

/*****
SPINNER / PRINTER
 *****/
.spinner {
  display: none;
  position: fixed;
  z-index: 10000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6); }

.spinner.open {
  display: block; }

.spinner__inner {
  width: 18.75rem;
  height: 12.5rem;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0; }

/* CIRCLE SPINNER */
.half-circle-spinner {
  width: 4.0625rem;
  height: 4.0625rem;
  border-radius: 100%;
  position: relative; }

.half-circle-spinner .circle {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 100%;
  border: 1.25rem solid transparent; }

.autocomplete-spinner {
  width: calc(var(--button-default-height, 1.875rem) - 0.25rem);
  height: calc(var(--button-default-height, 1.875rem) - 0.25rem);
  border-radius: 100%;
  position: absolute;
  top: 0.1875rem;
  right: calc(var(--button-default-height, 1.875rem) / 4); }

.autocomplete-spinner .circle {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 100%;
  border: 0.25rem solid transparent; }

.half-circle-spinner .circle.circle-1 {
  border-top-color: var(--button-default-bg-color, #003865);
  animation: half-circle-spinner-animation 1s infinite alternate; }

.autocomplete-spinner .circle.circle-1 {
  border-top-color: var(--button-default-bg-color, #003865);
  animation: half-circle-spinner-animation 1s infinite alternate; }

.half-circle-spinner .circle.circle-2 {
  border-bottom-color: var(--button-default-bg-color, #003865);
  animation: half-circle-spinner-animation 1s infinite; }

.autocomplete-spinner .circle.circle-2 {
  border-bottom-color: var(--button-default-bg-color, #003865);
  animation: half-circle-spinner-animation 1s infinite; }

@keyframes half-circle-spinner-animation {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }

/************************************

 MEDIA-QUERIES

 ************************************/
@media (max-width: 768px) {
  .toggle-table__row {
    flex-direction: column; }
  .toggle-table__cell .text--align-right {
    text-align: left; }
  .switch-module__link-icon {
    padding: 0.9375rem 0; } }

/*****
 WRAPPER
 *****/
.layout-wrapper {
  border: none;
  display: grid;
  grid-template-rows: auto 1fr auto;
  margin: var(--layout-wrapper-boxed-margin, 0 auto);
  max-width: var(--layout-wrapper-boxed-width, 100%);
  min-height: 100vh;
  position: relative;
  width: 100%; }

.layout-wrapper::after,
.layout-wrapper::before {
  content: "";
  display: block;
  width: 0.625rem;
  height: 100%;
  background: transparent;
  position: absolute;
  z-index: -1;
  top: 0;
  box-shadow: var(--layout-wrapper-box-shadow, none); }

.layout-wrapper::before {
  left: 0; }

.layout-wrapper::after {
  right: 0; }

/*****
 BOXED LAYOUT
 *****/
.layout--boxed .layout-wrapper {
  margin: var(--layout-wrapper-boxed-margin, 0 auto);
  max-width: var(--layout-wrapper-boxed-width, 100%); }

.layout--boxed .header {
  max-width: var(--layout-wrapper-boxed-width, 100%); }

/************************************

 MEDIA-QUERIES

 ************************************/
@media (max-width: 1024px) {
  .layout--boxed .layout-wrapper {
    margin: 0;
    width: 100%; } }

/*****
 HEADER
 *****/
.header {
  border-top: var(--header-border-top, 0rem);
  border-bottom: var(--header-border-bottom, 0rem);
  border-left: var(--header-border-left, 0rem);
  border-right: var(--header-border-right, 0rem);
  border-radius: var(--header-border-radius, 0);
  border-color: var(--header-border-color, #f5f2f5);
  border-style: var(--header-border-style, solid);
  background: var(--header-bg-color, #003865);
  display: flex;
  justify-content: space-between;
  width: 100%; }

.header__item {
  display: flex; }

/* Wenn Menü oder Dropdown vorhanden */
.header__item-menu {
  background: var(--header-container-menu-bg-color, #003865);
  padding: var(--header-container-menu-padding, 0); }

/* KUNDEN HEADER */
.header_miscellaneous {
  background: var(--header-miscellaneous-bg-color, #f5f6f8);
  flex: 1;
  align-items: var(--header-miscellaneous-vertical-align, flex-start); }

/*****
 BUTTON IM HEADER
 *****/
.header__button,
.header .menu--direction-horizontal > .menu__item > .menu__button {
  background: var(--header-button-bg-color, #003865);
  color: var(--header-button-color, #fff);
  display: flex;
  min-height: var(--header-button-height, 2.75rem);
  align-items: center;
  text-decoration: none;
  margin: 0 var(--header-button-margin-left-right, 0) 0 var(--header-button-margin-left-right, 0);
  box-shadow: none;
  border-radius: 0;
  border: none;
  font-family: var(--header-button-family-level-1, var(--font-family-base)); }

.header__button .button__text,
.header .menu--direction-horizontal > .menu__item > .menu__button .menu__text {
  text-transform: var(--header-button-text-transform, uppercase);
  font-weight: var(--header-button-weight, normal);
  font-size: var(--header-button-font-size, 0.75rem); }

.header__button:hover,
.header__button:focus:hover,
.header .menu--direction-horizontal > .menu__item > .menu__button:hover,
.header .menu--direction-horizontal > .menu__item > .menu__button:focus:hover {
  background-color: var(--header-button-bg-color-hover, #003865);
  color: var(--header-button-color-hover, #fff);
  font-weight: var(--header-button-weight, normal);
  text-decoration: var(--header-button-text-decoration-hover, underline); }

.header__button .button__text,
.header__button .button__icon,
.header__button .button__tools {
  min-height: var(--header-button-height, 2.75rem); }

.header__button:focus,
.header__button:active,
.header .menu--direction-horizontal > .menu__item > .menu__button:focus,
.header .menu--direction-horizontal > .menu__item > .menu__button:active {
  background-color: var(--header-button-bg-color-focus, #0077cb);
  color: var(--header-button-color-focus, #fff);
  font-weight: var(--header-button-weight, normal);
  text-decoration: var(--header-button-text-decoration-focus, underline);
  outline: 0;
  box-shadow: 0 0 0 0.1875rem var(--header-focus-shadow-color, transparent); }

/* Icons */
.header__button .button__icon,
.header .menu--direction-horizontal > .menu__item > .menu__button .menu__icon,
.header .menu--direction-horizontal > .menu__item > .menu__submenu .menu__button .menu__icon {
  font-size: var(--header-button-icon-size, 1.875rem); }

/*****
 LOGO IM HEADER
 *****/
.header__logo {
  background-color: var(--header-logo-bg-color, #003865);
  display: flex;
  height: 100%;
  position: relative;
  align-items: center;
  justify-content: var(--header-logo-justify-content, flex-start);
  padding: 0;
  min-width: var(--header-logo-min-width, 15.625rem); }

.header__logo img {
  margin: var(--header-logo-image-margin, 0 0 0 0.625rem); }

/*****
 FOOTER
 *****/
.footer {
  border-top: var(--footer-border-top, 0);
  border-bottom: var(--footer-border-bottom, none);
  border-left: var(--footer-border-left, none);
  border-right: var(--footer-border-right, none);
  border-radius: var(--footer-border-radius, 0);
  background: var(--footer-bg-color, #003865);
  color: var(--footer-color, #fff);
  font-size: var(--footer-font-size, 0.75rem);
  text-transform: var(--footer-text-transform, normal);
  font-family: var(--footer-font-family, var(--font-family-base));
  min-height: var(--footer-height, 3.75rem);
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin: var(--footer-margin, 0 0 0 0);
  font-weight: var(--footer-font-weight, normal);
  align-items: center; }

.footer .footer__link {
  color: var(--footer-color, #fff);
  text-decoration: var(--footer-button-textdecoration, undeline);
  font-weight: var(--footer-font-weight, normal); }

.footer .footer__link:focus {
  color: var(--footer-color, #fff);
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 0.1875rem var(--footer-focus-shadow-color, #3c7dcd); }

.footer .footer__link:hover {
  color: var(--footer-button-color-hover, #fff);
  text-decoration: var(--footer-button-textdecoration-hover, none);
  font-weight: var(--footer-font-weight, normal); }

.footer .footer__item {
  padding: var(--footer-padding, 0 0.9375rem);
  flex-wrap: wrap; }

/************************************

 MEDIA-QUERIES

 ************************************/
@media (max-width: 1024px) {
  .header::after {
    left: calc(var(--menu-icon-width, 1.875rem) + var(--menu-tools-width-small, 1.375rem) + var(--menu-button-border-left-width, 0.625rem));
    width: calc(100% - calc(var(--menu-icon-width, 1.875rem) + var(--menu-tools-width-small, 1.375rem) + var(--menu-button-border-left-width, 0.625rem))); } }

@media (max-width: 768px) {
  .header__logo {
    min-width: var(--header-logo-mobile-min-width, 10.625rem); }
  /* Text bei Buttons mit Icons ausblenden */
  .header__button .button__text {
    display: none; } }

@media (max-width: 450px) {
  /* Element ausbelenden */
  .header--hide-element {
    display: none; }
  .footer {
    flex-direction: column;
    align-items: center;
    justify-content: center; }
  .footer__item {
    min-height: 1.875rem;
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center; } }

/*****
 MAIN
 *****/
.main {
  background: var(--main-bg-color, #fff);
  display: flex;
  align-content: flex-start;
  flex-direction: row;
  flex-wrap: wrap;
  margin: 0; }

.main__row {
  display: flex;
  width: 100%; }

.main__nav {
  flex: 0 0 var(--menu-width, 15.625rem);
  order: 1;
  min-height: 100%;
  background-color: var(--main-nav-bg-color, #fff); }

/* Wird benoetigt, um die Hoehe (MaiNav) einzustellen,
  wenn eine main__row vorhanden ist
 */
.main .main__row + .main__nav {
  min-height: calc(100% - $main-row-total-margin-padding); }

.main__nav-inner {
  margin-top: var(--menu-margin-top, 0rem);
  position: relative; }

.main__content {
  flex: 1;
  background: var(--main-content-bg-color, #f5f6f8);
  border: var(--main-content-border, none);
  order: 2;
  padding: var(--main-content-padding, 0 0.9375rem 0.9375rem 0.9375rem);
  margin-top: var(--main-content-margin-top, 0); }

/*****
 Z.B. KOMBI H1 UND BREADCRUMB
 *****/
.main-subheader {
  background: #fff;
  box-shadow: 0 0.3125rem 0.4375rem 0 rgba(0, 0, 0, var(--box-shadow));
  display: flex;
  align-items: center;
  border-left: var(--main-content-headline-border-left, 0.625rem solid);
  border-left-color: var(--main-content-headline-border-left-color, #003865);
  padding-right: 0.9375rem; }

/* Bei Überschrift im SubHeader */
.main-subheader .headline {
  border-left: none;
  box-shadow: none;
  margin: 0; }

.main-subheader .button {
  min-height: var(--button-default-height, 1.875rem); }

/*****
 HELP (Hilfetexte)
 *****/
.help {
  flex: 0 0 var(--main-help-width, 0);
  order: 3;
  margin-top: var(--main-help-margin-top, 0.9375rem); }

.help__inner {
  margin-top: var(--main-help-tools-height, 2.5rem);
  position: fixed;
  background: var(--main-help-inner-bg-color, #fff);
  overflow-y: auto;
  direction: rtl;
  padding: 0 0.625rem; }

.help__head {
  background: var(--main-help-tools-bg-color, #fff);
  height: var(--main-help-tools-height, 2.5rem);
  display: flex;
  position: fixed;
  width: var(--main-help-width, 0);
  z-index: 2;
  right: 0; }

.help-tools__head {
  display: flex;
  height: inherit;
  padding-left: 1.25rem;
  align-items: center; }

.help__head .toolbar {
  height: inherit; }

.help__head .toolbar__box {
  border-top: none;
  border-right: none;
  height: inherit; }

.help__content {
  margin-top: 0.9375rem;
  padding: 0 0.625rem 3.125rem 0.625rem;
  background: var(--main-help-content-bg-color, #fff); }

.help__content h2,
.help__content h3,
.help__content h4 {
  hyphens: auto;
  word-break: break-word; }

/************************************

 MEDIA-QUERIES

 ************************************/
@media (max-width: 768px) {
  .main-subheader {
    flex-direction: column;
    align-items: flex-start; }
  /* Wenn wrapped - Abstand oben/unten */
  .main-subheader .button,
  .main-subheader .dropdown {
    margin: 0.625rem 0; } }

@media (max-width: 1280px) {
  .main__nav {
    flex: 0 0 calc(var(--menu-icon-width, 1.875rem) + var(--menu-tools-width-small, 1.375rem) + var(--menu-button-border-left-width, 0.625rem)); } }

/*****
 DROPZONE
 *****/
.dropzone {
  flex-direction: row;
  display: flex;
  margin-bottom: 0.625rem; }

.dropzone__addon {
  display: flex;
  height: 100%;
  min-width: calc(var(--button-default-height, 1.875rem) * 1.5); }

.dropzone__addon > * {
  box-shadow: none; }

.dropzone__addon:first-child {
  margin-right: auto;
  order: 1;
  padding-right: 0.3125rem;
  justify-content: flex-start; }

.dropzone__content {
  flex: 1;
  order: 2; }

.dropzone__addon:last-child {
  margin-left: auto;
  order: 3;
  padding-left: 0.3125rem;
  justify-content: flex-end; }

/* Dropzone Target */
.dropzone__target {
  background-color: var(--dropzone-bg-color, #fcfcfc);
  border: 0.125rem dashed var(--dropzone-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  border-radius: var(--dropzone-border-radius, var(--default-border-radius, 0.3125rem));
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 13.75rem;
  padding: 2.5rem;
  text-align: center;
  box-shadow: 0 0.3125rem 0.4375rem 0 var(--dropzone-upload-box-shadow, rgba(var(--default-box-shadow-color, #000), 0.2)); }

.dropzone__target:not(.bg-color--disabled):focus {
  outline: none;
  background-color: var(--form-inputs-bg-color-focus, #eaeff6); }

.dropzone--drag-hover {
  background-color: var(--dropzone-bg-color, #fcfcfc);
  border: 0.125rem solid var(--dropzone-drag-over-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  color: var(--dropzone-drag-over-color, #000);
  cursor: move; }

.dropzone--drag-hover .link,
.dropzone--drag-hover .button {
  color: var(--dropzone-drag-over-color, #000); }

.dropzone--drag-hover > * {
  animation: zoomIn 0.7s ease;
  filter: blur(0.1875rem); }

/*****
 UPLOAD
 *****/
.upload {
  display: flex;
  flex-direction: column; }

.upload :not(.upload__filefooter) * {
  box-shadow: none; }

.upload__filehead {
  padding: 0.3125rem 0 0.5rem 0; }

.upload__filehead-digit {
  font-weight: var(--font-weight-bold-base, bold); }

.upload__filebox {
  display: block;
  height: var(--upload-filebox-height, 18.75rem);
  overflow-y: auto;
  border: 0.0625rem solid var(--upload-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  box-shadow: 0 0.3125rem 0.4375rem 0 var(--dropzone-upload-box-shadow, rgba(var(--default-box-shadow-color, #000), 0.2));
  position: relative; }

.upload__column {
  display: flex;
  flex-direction: column;
  border-bottom: 0.0625rem solid var(--upload-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd))); }

.upload__column:hover {
  background: var(--table-body-td-hover-bg-color, #eaeff6); }

.upload__row {
  display: flex; }

.upload__filename,
.upload__filesize,
.upload__fileaction {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 0.3125rem; }

.upload__filename {
  width: calc(100% - (var(--upload-column-filesize-width, 3.75rem) + var(--upload-column-action-width, 2.5rem))); }

.upload__text {
  hyphens: auto;
  word-break: break-all;
  font-weight: var(--font-weight-bold-base, bold); }

.upload__filesize {
  align-items: center;
  margin-left: auto;
  width: var(--upload-column-filesize-width, 3.75rem); }

.upload__fileaction {
  align-items: center;
  justify-content: center;
  width: var(--upload-column-action-width, 2.5rem); }

.upload__invalid .upload__column .upload__row {
  background-color: var(--upload-invalid-file-bg-color, #f1f1f1); }

/*
.upload__invalid .upload__column:first-child .upload__row {
  background-color: transparent;
  padding: 5px;
  margin-top: 15px;
}
*/
.upload__valid .message,
.upload__invalid .message {
  background-color: transparent;
  margin-bottom: 0; }

.upload__invalid .message {
  border-color: transparent; }

.upload__filefooter {
  margin: 1.875rem 0; }

.upload__nofile {
  text-align: center;
  font-weight: var(--font-weight-bold-base, bold);
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%); }

/*****
 attachment
 *****/
.attachment {
  margin-bottom: 1.875rem; }

.attachment__head {
  align-items: center;
  background-color: var(--attachment-head-bg-color, #eee);
  box-shadow: 0.3125rem 0.1875rem 0.3125rem 0 var(--attachment-head-box-shadow, rgba(var(--default-box-shadow-color, #000), 0.4));
  border-top: 0.0625rem solid;
  border-color: var(--attachment-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  color: var(--attachment-head-color, var(--font-color-base));
  display: inline-flex;
  padding: 0.3125rem 0.625rem;
  text-transform: uppercase;
  position: relative; }

.attachment__text {
  margin: 0 0.3125rem; }

.attachment__content {
  background-color: var(--attachment-content-bg-color, #fff);
  border: 0.0625rem solid;
  border-color: var(--attachment-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  border-left: 0;
  border-right: 0;
  padding: 0.9375rem; }

.attachment__row {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap; }

.attachment__column {
  flex-direction: column;
  flex: 1; }

.attachment__column:first-child {
  margin-left: 0; }

/*****
 Single Upload
 *****/
.single-upload {
  display: flex;
  width: 100%; }

.single-upload__file {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 0.0625rem;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 0.0625rem; }

.single-upload__button {
  display: inline-flex; }

/* Hover */
.single-upload__file + .single-upload__button:hover {
  background: var(--button-default-bg-color-hover, #0077cb);
  border-color: var(--button-default-bg-color-hover, #0077cb);
  color: var(--button-default-color-hover, #fff);
  outline: 0; }

/* Focus */
.single-upload__file:focus + .single-upload__button {
  background: var(--button-default-bg-color-focus, #0077cb);
  border-color: var(--button-default-bg-color-focus, #0077cb);
  color: var(--button-default-color-focus, #fff);
  outline: 0; }

/* Storage bar */
.storage-bar {
  height: 0.875rem;
  transition: width .5s; }
  .storage-bar__container {
    background: var(--form-count-char-bg-color, #f1f1f1);
    border-radius: var(--default-border-radius, 0.3125rem);
    overflow: hidden; }
  .storage-bar--state-good {
    background-color: #146140;
    width: 20%; }
  .storage-bar--state-ok {
    background-color: #f1c40f;
    width: 75%; }
  .storage-bar--state-full {
    background-color: #aa2222;
    width: 100%; }

/************************************

 MEDIA-QUERIES

 ************************************/
.table {
  display: table;
  width: 100%;
  border-spacing: 0;
  margin-bottom: 0.9375rem;
  box-shadow: 0 0.3125rem 0.4375rem 0 rgba(0, 0, 0, var(--box-shadow)); }

.table__caption {
  margin: 0.9375rem 0;
  font-weight: var(--table-caption-font-weight, 500);
  font-size: var(--table-caption-font-size, var(--font-size-h3, 1.125rem));
  color: var(--table-caption-font-color, var(--font-color-h3, var(--font-color-h1, #003865))); }

.table__head-cell,
.table__body-cell,
.table__foot-cell {
  padding: 0 0.8125rem; }

.table__head {
  display: table-header-group;
  font-size: var(--table-font-size, var(--font-size-base, 0.875rem)); }

.table__head-row {
  display: table-row; }

.table__head-cell {
  display: table-cell;
  vertical-align: middle;
  background: var(--table-head-cell-bg-color, #f3f3f3);
  border-bottom: var(--table-head-cell-border-bottom, 0.0625rem solid var(--default-border-color, #cdcdcd));
  color: var(--table-head-cell-font-color, var(--font-color-base, #000));
  height: calc(var(--table-head-cell-height, 3rem) + 0.3125rem);
  font-size: var(--table-font-size, var(--font-size-base, 0.875rem));
  font-weight: var(--table-head-cell-font-weight, 500);
  white-space: nowrap; }

.table--sortable .table__head-cell {
  padding: 0; }

.table__head-button {
  border-radius: 0;
  border: none;
  background: var(--table-head-cell-bg-color, #f3f3f3);
  color: var(--table-head-cell-font-color, var(--font-color-base, #000));
  font-size: var(--table-font-size, var(--font-size-base, 0.875rem));
  justify-content: flex-start;
  min-height: calc(var(--table-head-cell-height, 3rem) + 0.3125rem);
  width: 100%;
  margin: 0; }
  .table__head-button .button__text {
    text-transform: none; }

.table--sortable .table__head-cell.text--align-center .table__head-button {
  justify-content: center; }

.table--sortable .table__head-cell.text--align-right .table__head-button {
  justify-content: flex-end; }

.table__head-button:not(:hover):not(:focus) .icon-sort-up-down::before {
  opacity: 0.2; }

.table__body {
  display: table-row-group; }

.table__body-row {
  display: table-row; }

.table__body .table__body-row:last-child .table__body-cell {
  border-bottom: none; }

.table__body-cell {
  display: table-cell;
  vertical-align: middle;
  background: var(--table-body-cell-bg-color, #fff);
  border-bottom: var(--table-body-cell-border-bottom, 0.0625rem solid var(--default-border-color, #cdcdcd));
  height: var(--table-head-cell-height, 3rem); }

.table__body-row:hover .table__body-cell {
  background: var(--table-body-td-hover-bg-color, #eaeff6);
  color: var(--table-body-td-hover-color, #000); }

.table__foot-cell {
  background: var(--table-footer-cell-bg-color, #f3f3f3);
  height: var(--table-footer-cell-height, 2.5rem);
  border-bottom: var(--table-footer-cell-border-bottom, none); }

.tablebox {
  display: inline-flex;
  min-height: var(--table-body-height, 2.75rem);
  align-items: center; }

.tablebox__row {
  display: inline-block;
  flex-direction: row;
  align-items: center; }

.tablebox__cell {
  display: inline-block;
  align-items: center; }

.totalsum__table {
  width: 60%; }

.totalsum__table .table__foot-cell {
  background: transparent;
  border-bottom: none; }

.totalsum__table .table__foot-cell:last-child .tablebox {
  border-top: 0.125rem solid #000;
  margin-right: -0.625rem;
  padding: 0.3125rem 0.625rem; }

.filter {
  display: flex;
  background: var(--table-head-cell-bg-color, #f3f3f3);
  box-shadow: 0 1.5625rem 1.25rem -0.625rem rgba(0, 0, 0, var(--box-shadow));
  margin: 0 0 1.875rem 0;
  padding: 0 0.9375rem;
  align-items: center;
  justify-content: flex-start; }

.filter__column {
  display: flex;
  flex-wrap: wrap; }

.filter__column--button-reset {
  flex: 0 0 auto;
  margin-left: auto; }

.filter__column-element {
  margin-right: 0.9375rem;
  padding-bottom: 0.9375rem; }

.filter__column .label-group {
  margin-top: 0; }

.filter__column .input-text {
  border-radius: var(--default-border-radius, 0.3125rem) 0 0 var(--default-border-radius, 0.3125rem);
  width: 17.5rem; }

.filter__column .dropdown__button {
  width: 9.375rem;
  background-color: var(--form-inputs-bg-color, #fff);
  border: var(--form-inputs-border-width, 0.0625rem) solid var(--form-inputs-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)));
  justify-content: flex-start; }

.filter__column .dropdown__button .button__text {
  color: var(--font-color-base, #000);
  text-transform: none;
  font-size: var(--font-size-base, 0.875rem); }

.filter__column .dropdown__button .button__toggle {
  margin-left: auto;
  color: var(--font-color-base, #000); }

.filter__column .dropdown__button:focus {
  color: var(--font-color-base, #000);
  background-color: var(--form-inputs-bg-color, #fff); }

.filter__column .dropdown__submenu-item .label {
  white-space: nowrap;
  text-transform: none;
  font-size: var(--font-size-base, 0.875rem); }

.filter__column .checkbox-group {
  margin: 0.3125rem 0 0 0; }

.filter__column .dropdown__submenu > .dropdown__submenu-item:first-child .checkbox-group {
  top: 0.125rem;
  position: relative; }

.output-list {
  padding: 0;
  margin: 0; }

.output-list__item {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap; }

.output-list__cell {
  padding: 0.3125rem;
  justify-content: center;
  flex-grow: 1;
  flex-basis: 6.25rem;
  max-width: 100%;
  display: flex;
  flex-flow: column;
  word-break: break-word; }

.output-list.totalsum__border .output-list__item:last-child .output-list__cell:last-child span:last-child {
  border-top: 0.125rem solid #000; }

.pagination-section {
  display: flex;
  margin: 1.875rem 0 0.9375rem 0;
  align-items: center; }

.pagination {
  display: inline-flex;
  flex-wrap: wrap;
  padding-left: 0.0625rem;
  border-radius: var(--default-border-radius, 0.3125rem);
  background-color: #fff;
  margin: 0 0.9375rem 0 0; }

.table__foot-cell .pagination {
  margin: 0.5rem 0; }

.pagination__item {
  margin-right: 0.1875rem;
  list-style: none; }

.pagination__item:last-child {
  margin-right: 0; }

.pagination__button {
  border: none;
  border-radius: 0;
  height: calc(var(--button-default-height, 1.875rem) + (0.0625rem * 2));
  padding: 0 0.0625rem;
  box-shadow: none; }

.pagination__button:focus {
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 0.1875rem var(--focus-shadow-color, #3c7dcd);
  z-index: 2; }

.pagination__button .button__icon {
  font-size: var(--pagination-icon-size, 0.875rem); }

.pagination__item:first-child .pagination__button {
  border-radius: var(--default-border-radius, 0.3125rem) 0 0 var(--default-border-radius, 0.3125rem); }

.pagination__item:last-child .pagination__button {
  border-radius: 0 var(--default-border-radius, 0.3125rem) var(--default-border-radius, 0.3125rem) 0; }

.pagination--page-current,
.pagination--page-current:focus {
  background: var(--pagination-currentpage-bg-color, #b64752);
  color: var(--pagination-currentpage-text-color, #fff); }

.table-entries {
  margin-left: auto;
  display: flex;
  align-items: center; }

.table-entries .label-group {
  margin: 0; }

.table-entries .label-group__label {
  align-items: center;
  margin-right: 0.9375rem; }

.table-result {
  display: inline-flex;
  height: calc(var(--button-default-height, 1.875rem) + (0.0625rem * 2));
  align-items: center; }

@media (max-width: 320px) {
  .filter__column .input-text {
    width: 100%; } }

@media (max-width: 450px) {
  .filter__column-element {
    margin-right: 0;
    padding-bottom: 0;
    width: 100%; }
  .filter__column--button-reset {
    justify-content: center !important; }
  .pagination-section .pagination__button {
    margin-bottom: 0.9375rem; } }

@media (max-width: 670px) {
  .filter {
    flex-direction: column; }
  .filter__column-element--input-search-mobile {
    margin-right: 0;
    padding-bottom: 0;
    width: 100%; }
  .filter__column-element--input-search-mobile .input-text {
    width: 100%; }
  .filter__column--button-reset {
    justify-content: flex-end;
    padding: 1.875rem 0 0.9375rem 0;
    width: 100%; } }

@media (max-width: 768px) {
  .pagination-section {
    flex-direction: column;
    align-items: flex-start; }
  .table-entries {
    margin-top: 0.9375rem; } }

@media (max-width: 1024px) {
  .totalsum__table {
    width: 100%; }
  .table__head {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px; }
  .table__body-row {
    display: flex;
    flex-direction: column; }
  .table__body-cell {
    align-items: center;
    display: flex;
    height: 100%;
    min-height: var(--table-head-cell-height, 3rem);
    padding: 0 0 0 30%;
    position: relative; }
  .table__body-cell:first-child {
    border-top: var(--table-body-cell-border-bottom, 0.0625rem solid var(--default-border-color, #cdcdcd)); }
  .table__body .table__body-row:last-child .table__body-cell {
    border-bottom: var(--table-head-cell-border-bottom, 0.0625rem solid var(--default-border-color, #cdcdcd)); }
  .table__body-cell::before,
  .table__body-cell::after {
    content: "";
    display: flex;
    margin-right: 0.625rem;
    min-height: var(--table-head-cell-height, 3rem); }
  .table__body-cell::after {
    align-items: center;
    background: var(--table-head-cell-bg-color, #f3f3f3);
    content: attr(data-head-label);
    height: 100%;
    padding: 0 0.3125rem;
    position: absolute;
    word-wrap: break-word;
    word-break: break-all;
    hyphens: auto;
    left: 0;
    width: 30%;
    min-width: 30%; }
  .table__body-cell:last-child {
    margin-bottom: 1.25rem; }
  .table__body-row:hover .table__body-cell {
    background-color: transparent; } }

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.7.0
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2018 Daniel Eden
 */
@-webkit-keyframes bounce {
  from,
  20%,
  53%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0); }
  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0); }
  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0); } }

@keyframes bounce {
  from,
  20%,
  53%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0); }
  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0); }
  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0); } }

.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom; }

@-webkit-keyframes flash {
  from,
  50%,
  to {
    opacity: 1; }
  25%,
  75% {
    opacity: 0; } }

@keyframes flash {
  from,
  50%,
  to {
    opacity: 1; }
  25%,
  75% {
    opacity: 0; } }

.flash {
  -webkit-animation-name: flash;
  animation-name: flash; }

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); }
  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05); }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); } }

@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); }
  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05); }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); } }

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse; }

@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1); }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1); }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1); }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1); }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1); }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); } }

@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1); }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1); }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1); }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1); }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1); }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); } }

.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand; }

@-webkit-keyframes shake {
  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0); }
  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0); } }

@keyframes shake {
  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0); }
  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0); } }

.shake {
  -webkit-animation-name: shake;
  animation-name: shake; }

@-webkit-keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0); }
  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg); }
  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg); }
  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg); }
  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg); }
  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0); } }

@keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0); }
  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg); }
  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg); }
  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg); }
  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg); }
  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0); } }

.headShake {
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-name: headShake;
  animation-name: headShake; }

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg); }
  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg); }
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg); }
  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg); }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg); } }

@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg); }
  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg); }
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg); }
  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg); }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg); } }

.swing {
  -webkit-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing; }

@-webkit-keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); }
  10%,
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); }
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); }
  40%,
  60%,
  80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); } }

@keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); }
  10%,
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); }
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); }
  40%,
  60%,
  80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); } }

.tada {
  -webkit-animation-name: tada;
  animation-name: tada; }

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes wobble {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); }
  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); }
  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); }
  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); }
  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes wobble {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); }
  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); }
  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); }
  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); }
  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble; }

@-webkit-keyframes jello {
  from,
  11.1%,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg); }
  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg); }
  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg); }
  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg); }
  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg); }
  77.7% {
    -webkit-transform: skewX(0.39062deg) skewY(0.39062deg);
    transform: skewX(0.39062deg) skewY(0.39062deg); }
  88.8% {
    -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
    transform: skewX(-0.19531deg) skewY(-0.19531deg); } }

@keyframes jello {
  from,
  11.1%,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg); }
  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg); }
  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg); }
  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg); }
  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg); }
  77.7% {
    -webkit-transform: skewX(0.39062deg) skewY(0.39062deg);
    transform: skewX(0.39062deg) skewY(0.39062deg); }
  88.8% {
    -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
    transform: skewX(-0.19531deg) skewY(-0.19531deg); } }

.jello {
  -webkit-animation-name: jello;
  animation-name: jello;
  -webkit-transform-origin: center;
  transform-origin: center; }

@-webkit-keyframes heartBeat {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1); }
  14% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3); }
  28% {
    -webkit-transform: scale(1);
    transform: scale(1); }
  42% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3); }
  70% {
    -webkit-transform: scale(1);
    transform: scale(1); } }

@keyframes heartBeat {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1); }
  14% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3); }
  28% {
    -webkit-transform: scale(1);
    transform: scale(1); }
  42% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3); }
  70% {
    -webkit-transform: scale(1);
    transform: scale(1); } }

.heartBeat {
  -webkit-animation-name: heartBeat;
  animation-name: heartBeat;
  -webkit-animation-duration: 1.3s;
  animation-duration: 1.3s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out; }

@-webkit-keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3); }
  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1); }
  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9); }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03); }
  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97); }
  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); } }

@keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3); }
  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1); }
  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9); }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03); }
  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97); }
  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); } }

.bounceIn {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn; }

@-webkit-keyframes bounceInDown {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0); }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0); }
  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0); }
  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0); }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes bounceInDown {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0); }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0); }
  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0); }
  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0); }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown; }

@-webkit-keyframes bounceInLeft {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0); }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0); }
  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0); }
  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0); }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes bounceInLeft {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0); }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0); }
  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0); }
  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0); }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft; }

@-webkit-keyframes bounceInRight {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0); }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0); }
  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0); }
  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0); }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes bounceInRight {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0); }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0); }
  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0); }
  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0); }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight; }

@-webkit-keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0); }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0); }
  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0); }
  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0); }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0); }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0); }
  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0); }
  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0); }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp; }

@-webkit-keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9); }
  50%,
  55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1); }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3); } }

@keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9); }
  50%,
  55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1); }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3); } }

.bounceOut {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut; }

@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0); }
  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0); }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0); } }

@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0); }
  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0); }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0); } }

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown; }

@-webkit-keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0); }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0); } }

@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0); }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0); } }

.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft; }

@-webkit-keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0); }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0); } }

@keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0); }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0); } }

.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight; }

@-webkit-keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0); }
  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0); }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0); } }

@keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0); }
  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0); }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0); } }

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp; }

@-webkit-keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

@keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn; }

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown; }

@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig; }

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft; }

@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig; }

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight; }

@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig; }

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp; }

@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig; }

@-webkit-keyframes fadeOut {
  from {
    opacity: 1; }
  to {
    opacity: 0; } }

@keyframes fadeOut {
  from {
    opacity: 1; }
  to {
    opacity: 0; } }

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut; }

@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); } }

@keyframes fadeOutDown {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); } }

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown; }

@-webkit-keyframes fadeOutDownBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0); } }

@keyframes fadeOutDownBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0); } }

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig; }

@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0); } }

@keyframes fadeOutLeft {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0); } }

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft; }

@-webkit-keyframes fadeOutLeftBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0); } }

@keyframes fadeOutLeftBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0); } }

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig; }

@-webkit-keyframes fadeOutRight {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0); } }

@keyframes fadeOutRight {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0); } }

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight; }

@-webkit-keyframes fadeOutRightBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0); } }

@keyframes fadeOutRightBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0); } }

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig; }

@-webkit-keyframes fadeOutUp {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0); } }

@keyframes fadeOutUp {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0); } }

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp; }

@-webkit-keyframes fadeOutUpBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0); } }

@keyframes fadeOutUpBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0); } }

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig; }

@-webkit-keyframes flip {
  from {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out; }
  40% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out; }
  50% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  to {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; } }

@keyframes flip {
  from {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out; }
  40% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out; }
  50% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  to {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; } }

.animated.flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip; }

@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0; }
  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1; }
  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg); }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px); } }

@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0; }
  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1; }
  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg); }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px); } }

.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX; }

@-webkit-keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0; }
  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1; }
  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg); }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px); } }

@keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0; }
  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in; }
  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1; }
  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg); }
  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px); } }

.flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY; }

@-webkit-keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px); }
  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1; }
  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0; } }

@keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px); }
  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1; }
  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0; } }

.flipOutX {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important; }

@-webkit-keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px); }
  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1; }
  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0; } }

@keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px); }
  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1; }
  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0; } }

.flipOutY {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  animation-name: flipOutY; }

@-webkit-keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0; }
  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1; }
  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg); }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0; }
  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1; }
  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg); }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
  animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out; }

@-webkit-keyframes lightSpeedOut {
  from {
    opacity: 1; }
  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0; } }

@keyframes lightSpeedOut {
  from {
    opacity: 1; }
  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0; } }

.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
  animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in; }

@-webkit-keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0; }
  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1; } }

@keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0; }
  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1; } }

.rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn; }

@-webkit-keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0; }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1; } }

@keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0; }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1; } }

.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft; }

@-webkit-keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0; }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1; } }

@keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0; }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1; } }

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight; }

@-webkit-keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0; }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1; } }

@keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0; }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1; } }

.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft; }

@-webkit-keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0; }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1; } }

@keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0; }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1; } }

.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight; }

@-webkit-keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1; }
  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0; } }

@keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1; }
  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0; } }

.rotateOut {
  -webkit-animation-name: rotateOut;
  animation-name: rotateOut; }

@-webkit-keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1; }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0; } }

@keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1; }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0; } }

.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft; }

@-webkit-keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1; }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0; } }

@keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1; }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0; } }

.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight; }

@-webkit-keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1; }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0; } }

@keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1; }
  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0; } }

.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft; }

@-webkit-keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1; }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0; } }

@keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1; }
  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0; } }

.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight; }

@-webkit-keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out; }
  20%,
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out; }
  40%,
  80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1; }
  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0; } }

@keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out; }
  20%,
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out; }
  40%,
  80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1; }
  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0; } }

.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-name: hinge;
  animation-name: hinge; }

@-webkit-keyframes jackInTheBox {
  from {
    opacity: 0;
    -webkit-transform: scale(0.1) rotate(30deg);
    transform: scale(0.1) rotate(30deg);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom; }
  50% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg); }
  70% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg); }
  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1); } }

@keyframes jackInTheBox {
  from {
    opacity: 0;
    -webkit-transform: scale(0.1) rotate(30deg);
    transform: scale(0.1) rotate(30deg);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom; }
  50% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg); }
  70% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg); }
  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1); } }

.jackInTheBox {
  -webkit-animation-name: jackInTheBox;
  animation-name: jackInTheBox; }

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn; }

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollOut {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } }

@keyframes rollOut {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } }

.rollOut {
  -webkit-animation-name: rollOut;
  animation-name: rollOut; }

@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3); }
  50% {
    opacity: 1; } }

@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3); }
  50% {
    opacity: 1; } }

.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn; }

@-webkit-keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }

@keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }

.zoomInDown {
  -webkit-animation-name: zoomInDown;
  animation-name: zoomInDown; }

@-webkit-keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }

@keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }

.zoomInLeft {
  -webkit-animation-name: zoomInLeft;
  animation-name: zoomInLeft; }

@-webkit-keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }

@keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }

.zoomInRight {
  -webkit-animation-name: zoomInRight;
  animation-name: zoomInRight; }

@-webkit-keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }

@keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }

.zoomInUp {
  -webkit-animation-name: zoomInUp;
  animation-name: zoomInUp; }

@-webkit-keyframes zoomOut {
  from {
    opacity: 1; }
  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3); }
  to {
    opacity: 0; } }

@keyframes zoomOut {
  from {
    opacity: 1; }
  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3); }
  to {
    opacity: 0; } }

.zoomOut {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut; }

@-webkit-keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }

@keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }

.zoomOutDown {
  -webkit-animation-name: zoomOutDown;
  animation-name: zoomOutDown; }

@-webkit-keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); }
  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center; } }

@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); }
  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center; } }

.zoomOutLeft {
  -webkit-animation-name: zoomOutLeft;
  animation-name: zoomOutLeft; }

@-webkit-keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); }
  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center; } }

@keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); }
  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center; } }

.zoomOutRight {
  -webkit-animation-name: zoomOutRight;
  animation-name: zoomOutRight; }

@-webkit-keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }

@keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }

.zoomOutUp {
  -webkit-animation-name: zoomOutUp;
  animation-name: zoomOutUp; }

@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible; }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible; }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown; }

@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible; }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible; }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft; }

@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible; }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible; }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight; }

@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible; }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible; }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); } }

.slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp; }

@-webkit-keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); } }

@keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); } }

.slideOutDown {
  -webkit-animation-name: slideOutDown;
  animation-name: slideOutDown; }

@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0); } }

@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0); } }

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft; }

@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0); } }

@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0); } }

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight; }

@-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0); } }

@keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }
  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0); } }

.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp; }

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both; }

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite; }

.animated.delay-1s {
  -webkit-animation-delay: 1s;
  animation-delay: 1s; }

.animated.delay-2s {
  -webkit-animation-delay: 2s;
  animation-delay: 2s; }

.animated.delay-3s {
  -webkit-animation-delay: 3s;
  animation-delay: 3s; }

.animated.delay-4s {
  -webkit-animation-delay: 4s;
  animation-delay: 4s; }

.animated.delay-5s {
  -webkit-animation-delay: 5s;
  animation-delay: 5s; }

.animated.fast {
  -webkit-animation-duration: 800ms;
  animation-duration: 800ms; }

.animated.faster {
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms; }

.animated.slow {
  -webkit-animation-duration: 2s;
  animation-duration: 2s; }

.animated.slower {
  -webkit-animation-duration: 3s;
  animation-duration: 3s; }

@media print {
  .animated {
    -webkit-animation: unset !important;
    animation: unset !important;
    -webkit-transition: none !important;
    transition: none !important; } }

/* EIGENE ANIMATIONEN */
@keyframes fadeInBottom {
  from {
    opacity: 0;
    transform: translateY(10%); }
  to {
    opacity: 1; } }

/*****
 TOOLTIP
 *****/
[data-tooltip] {
  position: relative; }

/* Tooltip Position und Sichbarkeit */
[data-tooltip]::before {
  position: absolute;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  min-height: 1.25rem; }

/* Tooltip Aussehen | Groesse */
[data-tooltip]::before {
  content: attr(data-tooltip);
  padding: 0.3125rem;
  min-width: 7.5rem;
  max-width: 15.625rem;
  border-radius: var(--tooltip-border-radius, 0.3125rem);
  background-color: var(--tooltip-bg-color, #000);
  box-shadow: 0.1875rem 0.1875rem 0.1875rem 0 rgba(0, 0, 0, 0.5);
  color: var(--tooltip-color, #fff);
  text-align: var(--tooltip-text-align, left) !important;
  z-index: 99999;
  display: inline-flex;
  align-items: center;
  justify-content: center; }

/*
    Tooltip DREIECK
*/
/* Default Angaben */
[data-tooltip]::after {
  content: "";
  display: inline-flex;
  position: absolute;
  width: 0;
  height: 0;
  z-index: 99999;
  visibility: hidden;
  opacity: 0; }

/* Font Aussehen */
[data-tooltip]::before {
  font-size: var(--tooltip-font-size, 0.75rem);
  line-height: calc(var(--tooltip-font-size, 0.75rem) * 1.2);
  font-weight: normal;
  text-transform: var(--tooltip-text-transform, none);
  letter-spacing: 0;
  font-family: var(--font-family-base); }

/*
    Tooltip geht nach OBEN auf
*/
[data-tooltip-direction="top"]::before {
  left: 50%;
  bottom: calc(100% + 0.3125rem);
  transform: translate(-50%, -0.3125rem); }

[data-tooltip-direction="top"]::after {
  left: calc(50% - 0.625rem);
  top: -0.75rem;
  border-left: 0.625rem solid transparent;
  border-right: 0.625rem solid transparent;
  border-top: 0.625rem solid var(--tooltip-bg-color, #000); }

/*
    Tooltip geht nach OBEN/LINKS auf
*/
[data-tooltip-direction="top-left"]::before {
  left: auto;
  right: 100%;
  bottom: calc(100% + 0.625rem); }

[data-tooltip-direction="top-left"]::after {
  left: -0.625rem;
  top: -1.375rem;
  border-top: 0.625rem solid transparent;
  border-bottom: 0.625rem solid transparent;
  border-left: 0.625rem solid var(--tooltip-bg-color, #000);
  transform: rotate(-180deg); }

/*
    Tooltip geht nach OBEN/RECHTS auf
*/
[data-tooltip-direction="top-right"]::before {
  right: auto;
  left: 100%;
  bottom: calc(100% + 0.625rem); }

[data-tooltip-direction="top-right"]::after {
  right: -0.625rem;
  top: -1.375rem;
  border-top: 0.625rem solid transparent;
  border-bottom: 0.625rem solid transparent;
  border-left: 0.625rem solid var(--tooltip-bg-color, #000); }

/*
    Tooltip geht nach UNTEN auf
*/
[data-tooltip-direction="bottom"]::before {
  top: calc(100% + 0.3125rem);
  left: 50%;
  transform: translate(-50%, 0.3125rem); }

[data-tooltip-direction="bottom"]::after {
  left: calc(50% - 0.625rem);
  bottom: -0.75rem;
  border-left: 0.625rem solid transparent;
  border-right: 0.625rem solid transparent;
  border-bottom: 0.625rem solid var(--tooltip-bg-color, #000); }

/*
    Tooltip geht nach UNTEN/LINKS auf
*/
[data-tooltip-direction="bottom-left"]::before {
  left: auto;
  right: 100%;
  top: calc(100% + 0.625rem); }

[data-tooltip-direction="bottom-left"]::after {
  left: -0.9375rem;
  bottom: -1.0625rem;
  border-left: 0.625rem solid transparent;
  border-right: 0.625rem solid transparent;
  border-bottom: 0.625rem solid var(--tooltip-bg-color, #000);
  transform: rotate(-90deg); }

/*
    Tooltip geht nach UNTEN/RECHTS auf
*/
[data-tooltip-direction="bottom-right"]::before {
  left: 100%;
  right: auto;
  top: calc(100% + 0.625rem); }

[data-tooltip-direction="bottom-right"]::after {
  right: -0.9375rem;
  bottom: -1.0625rem;
  border-left: 0.625rem solid transparent;
  border-right: 0.625rem solid transparent;
  border-bottom: 0.625rem solid var(--tooltip-bg-color, #000);
  transform: rotate(90deg); }

/*
    Tooltip geht nach LINKS auf
*/
[data-tooltip-direction="left"]::before {
  left: auto;
  right: calc(100% + 0.3125rem);
  bottom: 50%;
  transform: translate(-0.3125rem, 50%); }

[data-tooltip-direction="left"]::after {
  left: -0.8125rem;
  top: 0;
  border-top: 0.625rem solid transparent;
  border-bottom: 0.625rem solid transparent;
  border-left: 0.625rem solid var(--tooltip-bg-color, #000); }

/*
    Tooltip geht nach RECHTS auf
*/
[data-tooltip-direction="right"]::before {
  right: auto;
  left: calc(100% + 0.3125rem);
  bottom: 50%;
  transform: translate(0.3125rem, 50%); }

[data-tooltip-direction="right"]::after {
  right: -0.8125rem;
  top: 0;
  border-top: 0.625rem solid transparent;
  border-bottom: 0.625rem solid transparent;
  border-right: 0.625rem solid var(--tooltip-bg-color, #000); }

/************************************
 SICHTBARKEIT des Tooltips STEUERN
 - hover
 - focus

 ************************************/
/* ALLGEMEIN */
[data-tooltip]:hover::before,
[data-tooltip]:hover::after {
  display: inline-flex;
  visibility: visible;
  opacity: 1;
  animation: fadeIn .3s ease-in; }

/* Einblendung 'Dreieck" verzoegert */
[data-tooltip]:hover::after {
  transition-delay: 0.3s; }

/* WENN BUTTON IM
  - MENUE FOCUS
  - DROPDOWN BUTTON
  display: none;
  doppelte Ansage verhindern
 */
[data-tooltip]:focus {
  outline: 0;
  background: var(--button-default-bg-color-focus, #0077cb);
  color: var(--button-default-color-focus, #fff); }

/* Disabled */
[aria-disabled="true"][data-tooltip]:hover::before,
[aria-disabled="true"][data-tooltip]:focus::before,
[aria-disabled="true"][data-tooltip]:hover::after,
[aria-disabled="true"][data-tooltip]:focus::after {
  display: none; }

/************************************
 ARIA WICHTIG bei Tooltip :focus
 .screenreader-only display:none, da
 sonst der Inhalt vom SCR doppelt
 vorgelesen wird !!!
 ************************************/
[data-tooltip]:focus .screenreader-only {
  display: none; }

/*****
 DARKMODE
 *****/
/*
 HEADER
 */
:root {
  --dark-bg-color-one: #272b34;
  --dark-bg-color-two: #323743;
  --dark-bg-color-three: #3c4251;
  --dark-text-color: #e4e4e4;
  --dark-border-color: #52525a;
  --dark-button-blue-color: #00715C;
  --dark-bg-input-focus: #5e677e;
  --dark-button-bg-and-border-color-hover: #000;
  --dark-button-active: #97343e; }

/* Works on Chrome, Edge, and Safari */
[data-js-dark-mode="true"] *::-webkit-scrollbar-track {
  background-color: var(--dark-bg-color-one); }

[data-js-dark-mode="true"] *::-webkit-scrollbar-thumb {
  background-color: var(--dark-button-blue-color); }

/*
 BODY
 */
body[data-js-dark-mode="true"] {
  background: var(--dark-bg-color-one);
  color: var(--dark-text-color); }

/*
 IMAGES TO BLACK/WHITE
 */
[data-js-dark-mode="true"] img {
  -webkit-filter: brightness(0) invert(1);
  filter: brightness(0) invert(1); }

/*
 LINKS
 */
[data-js-dark-mode="true"] a:focus,
[data-js-dark-mode="true"] select:focus {
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 0.1875rem #0691d3;
  z-index: 2; }

/*
 HEADLINE
 */
[data-js-dark-mode="true"] .panel__head-icon,
[data-js-dark-mode="true"] h1,
[data-js-dark-mode="true"] [role="heading"][aria-level="1"],
[data-js-dark-mode="true"] h2,
[data-js-dark-mode="true"] [role="heading"][aria-level="2"],
[data-js-dark-mode="true"] h3,
[data-js-dark-mode="true"][role="heading"][aria-level="3"],
[data-js-dark-mode="true"] h4,
[data-js-dark-mode="true"] [role="heading"][aria-level="4"] {
  color: var(--dark-text-color); }

/*
 BOX | MAIN HEADLINE
 */
[data-js-dark-mode="true"] .headline,
[data-js-dark-mode="true"] .main-subheader {
  background: var(--dark-bg-color-one);
  border-color: var(--dark-border-color);
  color: var(--dark-text-color); }

/*
 BREADCRUMBS
 */
[data-js-dark-mode="true"] .breadcrumb,
[data-js-dark-mode="true"] .breadcrumb__link,
[data-js-dark-mode="true"] .breadcrumb__item::after {
  background: var(--dark-bg-color-one);
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .breadcrumb__item--active {
  color: var(--dark-text-color); }

/*
 HEADER
 */
[data-js-dark-mode="true"] .header,
[data-js-dark-mode="true"] .header__logo {
  background: var(--dark-bg-color-one);
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .header_miscellaneous {
  background: var(--dark-bg-color-three); }

/*
 HEADER | NAV
 */
[data-js-dark-mode="true"] .header .menu--direction-horizontal .menu__button {
  background: var(--dark-bg-color-one);
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .header .menu--direction-horizontal .menu__button:focus {
  background: var(--dark-bg-input-focus);
  color: var(--dark-text-color);
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 0.1875rem #0691d3;
  z-index: 2; }

[data-js-dark-mode="true"] .header .menu--direction-horizontal .menu__submenu .menu__button:hover,
[data-js-dark-mode="true"] .header .menu--direction-horizontal .menu__button:focus:hover,
[data-js-dark-mode="true"] .header .menu--direction-horizontal .menu__button:hover {
  background: var(--dark-button-active);
  color: var(--dark-text-color);
  text-decoration: none; }

[data-js-dark-mode="true"] .menu--direction-horizontal .menu__submenu .menu__item {
  border-color: var(--dark-border-color); }

[data-js-dark-mode="true"] .header .menu--direction-horizontal .menu__item:first-child {
  border-left-color: var(--dark-border-color); }

[data-js-dark-mode="true"] .header .menu--direction-horizontal .menu__submenu .menu__item,
[data-js-dark-mode="true"] .header .menu--direction-horizontal .menu__submenu .menu__button {
  background-color: var(--dark-bg-color-three); }

/*
 MAINNAV
 */
[data-js-dark-mode="true"] .main__nav-inner,
[data-js-dark-mode="true"] .menu,
[data-js-dark-mode="true"] .menu__button,
[data-js-dark-mode="true"] .menu__submenu {
  background: var(--dark-bg-color-one);
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .menu__button {
  border-color: transparent; }

[data-js-dark-mode="true"] .menu__item {
  border-color: var(--dark-border-color); }

[data-js-dark-mode="true"] .menu__submenu .menu__item .menu__submenu-button::after {
  background-color: var(--dark-border-color); }

/* Hover */
[data-js-dark-mode="true"] .menu__button:hover,
[data-js-dark-mode="true"] .menu__item.menu__item--active .menu__button:hover {
  background-color: var(--dark-button-active);
  border-left-color: var(--dark-button-active); }

[data-js-dark-mode="true"] .menu__item.menu__item--active .menu__button:hover:before {
  background: var(--dark-button-bg-and-border-color-hover); }

/* Aktiver Button in NAV */
[data-js-dark-mode="true"] .menu__item--active > .menu__button {
  background: var(--dark-bg-color-two);
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .menu__submenu .menu__item .menu__button:hover::before,
[data-js-dark-mode="true"] .menu__submenu .menu__item .menu__button::before {
  background: var(--dark-button-active); }

[data-js-dark-mode="true"] .menu__item.menu__item--active > .menu__button,
[data-js-dark-mode="true"] .menu__submenu .menu__item--active > .menu__button,
[data-js-dark-mode="true"] .menu__submenu .menu__submenu-button {
  border-left-color: var(--dark-button-active); }

[data-js-dark-mode="true"] .menu .menu__item.menu__item--active .menu__submenu.menu__submenu--open .menu__item:first-child::after {
  background-color: var(--dark-border-color); }

/* Focus in NAV */
[data-js-dark-mode="true"] .menu__button:focus,
[data-js-dark-mode="true"] .menu__item.menu__item--active .menu__button:focus {
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 0.1875rem #0691d3;
  z-index: 2;
  background: var(--dark-bg-color-one);
  color: var(--dark-text-color); }

/* Focus in NAV Actives Element */
[data-js-dark-mode="true"] .menu__item.menu__item--active > .menu__button:focus {
  background: var(--dark-bg-color-two); }

/*
 MAINCONTENT
 */
[data-js-dark-mode="true"] .main,
[data-js-dark-mode="true"] .main__content {
  background: var(--dark-bg-color-three); }

/*
 PROJECTBOX
 */
[data-js-dark-mode="true"] .projectbox {
  background: var(--dark-bg-color-three); }

[data-js-dark-mode="true"] .projectbox .menu__item,
[data-js-dark-mode="true"] .projectbox .menu__item:first-child {
  border-color: var(--dark-border-color); }

/*
 FOOTER
 */
[data-js-dark-mode="true"] .footer {
  color: var(--dark-text-color);
  background: var(--dark-bg-color-one); }

[data-js-dark-mode="true"] .footer__link {
  color: var(--dark-text-color); }

/*
 FUSSNOTE
 */
[data-js-dark-mode="true"] .footnote,
[data-js-dark-mode="true"] .footnote__list {
  background: transparent;
  border-color: var(--dark-border-color); }

/*
 PANEL
 */
[data-js-dark-mode="true"] .panel,
[data-js-dark-mode="true"] .panel__head,
[data-js-dark-mode="true"] .panel__body {
  color: var(--dark-text-color);
  background: var(--dark-bg-color-one); }

[data-js-dark-mode="true"] .panel__head {
  border-color: var(--dark-border-color); }

/*
 TOGGLE
 */
[data-js-dark-mode="true"] .toggle__head {
  border-color: var(--dark-border-color); }

/*
 BUTTONS
 */
[data-js-dark-mode="true"] .button:not([class*="bg-color--"]),
[data-js-dark-mode="true"] .input-group__button {
  border-color: var(--dark-button-blue-color);
  background-color: var(--dark-button-blue-color);
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .button.table__head-button {
  background-color: var(--dark-bg-color-two); }

[data-js-dark-mode="true"] .button.pagination--page-current {
  background: var(--dark-button-active); }

/* Info Button innerhalb des Forms*/
[data-js-dark-mode="true"] [class*="input-group__addon-"] .button.button-type--info {
  background-color: var(--dark-bg-color-three);
  border-color: var(--dark-border-color);
  color: var(--dark-text-color); }

/* Hover */
[data-js-dark-mode="true"] .button:hover,
[data-js-dark-mode="true"] .button.table__head-button:hover
[data-js-dark-mode="true"] [class*="input-group__addon-"] .button.button-type--info:hover,
[data-js-dark-mode="true"] [class*="input-group__addon-"] .button:hover {
  background: var(--dark-button-active);
  border-color: var(--dark-button-active);
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .button:focus {
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 0.1875rem #0691d3;
  z-index: 2; }

/* Disabled Button */
[data-js-dark-mode="true"] .button[aria-disabled="true"] {
  opacity: 0.3; }

/*
 TABELLE
 */
/* Pseudo theader bei kleiner Aufloesung */
[data-js-dark-mode="true"] .table__head-cell,
[data-js-dark-mode="true"] .table__body-cell::after {
  background: var(--dark-bg-color-two);
  border-color: var(--dark-border-color);
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .table__body-cell {
  background: var(--dark-bg-color-three);
  border-color: var(--dark-border-color); }

[data-js-dark-mode="true"] .table__body-row:hover .table__body-cell {
  background-color: transparent;
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .pagination {
  background: none; }

/* Filter */
[data-js-dark-mode="true"] .filter {
  background: var(--dark-bg-color-three); }

[data-js-dark-mode="true"] .filter__column .dropdown__button {
  background-color: var(--dark-bg-color-two);
  border-color: var(--dark-border-color);
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .filter__column .dropdown__button:focus {
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 0.1875rem #0691d3;
  z-index: 2;
  background: var(--dark-bg-input-focus);
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .filter__column .dropdown__button .button__toggle,
[data-js-dark-mode="true"] .filter__column .dropdown__button .button__text {
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .dropdown__submenu-content-action-form,
[data-js-dark-mode="true"] .dropdown__submenu-item--separator::after {
  border-color: var(--dark-border-color); }

/*
 DROPDOWN
 */
[data-js-dark-mode="true"] .dropdown__submenu {
  background: var(--dark-bg-color-three);
  border-color: var(--dark-bg-color-three); }

[data-js-dark-mode="true"] .dropdown__submenu--top-left::after {
  border-color: var(--dark-bg-color-three) transparent transparent transparent; }

[data-js-dark-mode="true"] .dropdown__submenu--top-right::after {
  border-color: var(--dark-bg-color-three) transparent transparent transparent; }

[data-js-dark-mode="true"] .dropdown__submenu--left::after {
  border-color: transparent transparent transparent var(--dark-bg-color-three); }

[data-js-dark-mode="true"] .dropdown__submenu--right::after {
  border-color: transparent var(--dark-bg-color-three) transparent transparent; }

[data-js-dark-mode="true"] .dropdown__submenu--bottom-left::after {
  border-color: transparent transparent var(--dark-bg-color-three) transparent; }

[data-js-dark-mode="true"] .dropdown__submenu--bottom-right::after {
  border-color: transparent transparent var(--dark-bg-color-three) transparent; }

[data-js-dark-mode="true"] .dropdown__submenu-link {
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .dropdown__submenu-link:hover {
  background: var(--dark-button-active);
  color: var(--dark-text-color); }

/*
 FORMS
 */
[data-js-dark-mode="true"] .input-text,
[data-js-dark-mode="true"] .input-select__element,
[data-js-dark-mode="true"] option,
[data-js-dark-mode="true"] .input-textarea {
  background: var(--dark-bg-color-two);
  border-color: var(--dark-border-color);
  color: var(--dark-text-color); }

/* focus  */
[data-js-dark-mode="true"] .input-text:focus,
[data-js-dark-mode="true"] .input-select__element:focus,
[data-js-dark-mode="true"] .input-textarea:focus {
  background: var(--dark-bg-input-focus);
  color: var(--dark-text-color); }

/* select input__group */
[data-js-dark-mode="true"] .input-select::after {
  color: var(--dark-button-blue-color); }

/* checkbox | radiobutton */
[data-js-dark-mode="true"] .checkbox-group__label::before,
[data-js-dark-mode="true"] .radio-group__radio:not(:checked) + .radio-group__label::before {
  background: var(--dark-bg-color-two);
  border-color: var(--dark-border-color); }

[data-js-dark-mode="true"] .checkbox-group__checkbox:focus + .checkbox-group__label::before,
[data-js-dark-mode="true"] .checkbox-group__checkbox:checked:focus + .checkbox-group__label::before,
[data-js-dark-mode="true"] .radio-group__radio:checked:focus + .radio-group__label::before {
  outline-color: var(--dark-text-color); }

[data-js-dark-mode="true"] .checkbox-group__wrapper .checkbox-group__checkbox:focus + .checkbox-group__label::before,
[data-js-dark-mode="true"] .checkbox-group__wrapper > .checkbox-group__checkbox:checked:focus + .checkbox-group__label::before,
[data-js-dark-mode="true"] .checkbox-group__wrapper > .checkbox-group__checkbox:disabled:focus + .checkbox-group__label::before,
[data-js-dark-mode="true"] .radio-group__wrapper .radio-group__radio:focus + .radio-group__label::before {
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 0.1875rem #0691d3;
  z-index: 2; }

[data-js-dark-mode="true"] .autocomplete-spinner .circle.circle-1 {
  border-top-color: var(--dark-text-color); }

[data-js-dark-mode="true"] .autocomplete-spinner .circle.circle-2 {
  border-bottom-color: var(--dark-text-color); }

/*
 ACTION FORM | SWITCH MODULE
 */
[data-js-dark-mode="true"] .switch-module {
  background: var(--dark-bg-color-one);
  border-color: var(--dark-border-color);
  color: var(--dark-text-color); }

/*
 section-headline BEI WEITEREN POSITIONEN
 */
[data-js-dark-mode="true"] .section-headline__text {
  background-color: var(--dark-bg-color-three);
  border-color: var(--dark-border-color);
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .section-headline::after {
  border-color: var(--dark-border-color); }

/*
 ALLGEMEINE LINKS
 */
[data-js-dark-mode="true"] .link,
[data-js-dark-mode="true"] .link-icon {
  color: var(--dark-text-color);
  text-decoration: underline; }

[data-js-dark-mode="true"] .link:hover,
[data-js-dark-mode="true"] .link-icon:hover {
  text-decoration: none; }

[data-js-dark-mode="true"] .link:focus,
[data-js-dark-mode="true"] .link-icon:focus {
  color: var(--dark-text-color);
  outline-color: var(--dark-text-color); }

/*
 NOTIFICATION | MESSAGEBOXEN
 */
[data-js-dark-mode="true"] .message {
  background: var(--dark-bg-color-two);
  border-color: var(--dark-border-color); }

/*
 LOGIN - REGISTER
 */
[data-js-dark-mode="true"] .login-wrapper {
  background: var(--dark-bg-color-three); }

[data-js-dark-mode="true"] .login-wrapper .login-top {
  background: var(--dark-bg-color-one);
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .login-wrapper .input-group [class^="icon-"],
[data-js-dark-mode="true"] .login-wrapper .input-group [class*=" icon-"] {
  background-color: var(--dark-bg-color-three);
  border-color: var(--dark-border-color);
  color: var(--dark-text-color); }

/* Icons und Button's Login Mask */
[data-js-dark-mode="true"] .login-bottom .input-select .input-select__element,
[data-js-dark-mode="true"] .button.button-type--password,
[data-js-dark-mode="true"] .login-wrapper .login-top .button.button-type--password [class^="icon-"] {
  background: none;
  border: none; }

[data-js-dark-mode="true"] .login-steps-container {
  border-color: var(--dark-border-color); }

[data-js-dark-mode="true"] .login-footer .login-footer__text {
  color: var(--dark-text-color); }

[data-js-dark-mode="true"] .password-strength__container {
  background-color: var(--dark-bg-color-two);
  border-color: var(--dark-border-color); }

/************************************

 MEDIA-QUERIES

 ************************************/
@media (max-width: 1024px) {
  [data-js-dark-mode="true"] .table__body-cell::before {
    background-color: var(--dark-bg-color-two); }
  [data-js-dark-mode="true"] .table__body .table__body-row:last-child .table__body-cell {
    border-bottom-color: var(--dark-border-color); } }

/*
  GRID SYSTEM (12 Columns)
  Vorlage: Skleton-Framework https://github.com/skeleton-framework/skeleton-framework
  Last Commit 12/2018

  Modifiziert durch cosinex
*/
.row {
  margin: 0;
  padding: 0; }

.row::before,
.row::after {
  content: "";
  display: table; }

.row::after {
  clear: both; }

.column,
.columns {
  float: left;
  width: 100%;
  min-height: 1px;
  padding-right: 0;
  transition: 0.3s; }

@media screen and (min-width: 768px) {
  .column,
  .columns {
    margin-top: 0; }
  .column,
  .columns {
    padding-right: 15px;
    /* Hier kein REM, da der Abstand der columns immer gleich bleiben sollte */ }
  .column:last-child,
  .columns:last-child {
    padding-right: 0; }
  .one.columns,
  .one.column {
    width: 8.3333333333%; }
  .two.columns,
  .two.columns {
    width: 16.6666666666%; }
  .three.columns,
  .three.column {
    width: 24.9999999999%; }
  .four.columns,
  .four.column {
    width: 33.3333333332%; }
  .five.columns,
  .five.column {
    width: 41.6666666665%; }
  .six.columns,
  .six.column {
    width: 49.9999999998%; }
  .seven.columns,
  .seven.column {
    width: 58.3333333331%; }
  .eight.columns,
  .eight.column {
    width: 66.6666666664%; }
  .nine.columns,
  .nine.column {
    width: 74.9999999997%; }
  .ten.columns,
  .ten.column {
    width: 83.333333333%; }
  .eleven.columns,
  .eleven.column {
    width: 91.6666666663%; }
  .twelve.columns,
  .twelve.column {
    width: 99.9999999996%; }
  /* Offsets */
  .offset-by-one.columns {
    margin-left: 8.3333333333%; }
  .offset-by-two.columns {
    margin-left: 16.6666666666%; }
  .offset-by-three.columns {
    margin-left: 24.9999999999%; }
  .offset-by-four.columns {
    margin-left: 33.3333333332%; }
  .offset-by-five.columns {
    margin-left: 41.6666666665%; }
  .offset-by-six.columns {
    margin-left: 49.9999999998%; }
  .offset-by-seven.columns {
    margin-left: 58.3333333331%; }
  .offset-by-eight.columns {
    margin-left: 66.6666666664%; }
  .offset-by-nine.columns {
    margin-left: 74.9999999997%; }
  .offset-by-ten.columns {
    margin-left: 83.333333333%; }
  .offset-by-eleven.columns {
    margin-left: 91.6666666663%; } }

/* fuer storybook */
.demo-row,
.row--demo {
  margin-bottom: 15px; }

.demo-col,
.column--demo {
  padding-top: 15px;
  padding-bottom: 15px;
  background-color: var(--button-default-bg-color, #003865);
  color: var(--button-default-color, #fff);
  text-align: center; }

.nested {
  background-color: #001f3f; }

/*****
 HEADER + NAV + HILFETEXTBOX POSITION FIXED
 *****/
/* Header  */
.position--fixed .header {
  position: fixed;
  width: 100%;
  z-index: 5000;
  top: 0; }

.position--fixed .layout-wrapper {
  min-height: 100%; }

/* Ausrichtung MAIN */
/* Ausrichtung Contentbox */
.position--fixed .main__content {
  margin-left: var(--menu-width, 15.625rem);
  margin-right: var(--main-help-width, 0);
  padding-bottom: var(--footer-height, 3.75rem); }

/* Hoehe Box Aside Nav */
.position--fixed .main__nav {
  position: fixed;
  z-index: 4999;
  height: 100%; }

/* Hoehe Box Footer */
.position--fixed .footer {
  margin-left: var(--menu-width, 15.625rem)var(--main-content-padding, 0 0.9375rem 0.9375rem 0.9375rem);
  margin-right: var(--main-help-width, 0)var(--main-content-padding, 0 0.9375rem 0.9375rem 0.9375rem); }

/************************************

 MEDIA-QUERIES

 ************************************/
@media (max-width: 1024px) {
  .position--fixed .main__content {
    margin-left: calc(var(--menu-icon-width, 1.875rem) + var(--menu-tools-width-small, 1.375rem) + var(--menu-button-border-left-width, 0.625rem)); }
  .position--fixed .footer {
    margin-left: calc(var(--menu-icon-width, 1.875rem) + var(--menu-tools-width-small, 1.375rem) + var(--menu-button-border-left-width, 0.625rem) + var(--main-content-padding, 0 0.9375rem 0.9375rem 0.9375rem)); } }

/************************************

 BESTIMMTE FARBEN SUCCESS (gruen) - WARNING (gelb) -  ERROR (rot) - INFO (blau)

 ************************************/
/* Background-Color */
/* white */
.bg-color--white {
  background-color: #fff; }

/* RED */
.bg-color--red,
.button.bg-color--red:focus {
  background-color: #aa2222;
  border-color: #aa2222;
  color: #fff; }

.bg-color--red.tag::before {
  border-color: transparent #aa2222 transparent transparent; }

.border-color--red {
  border-color: #aa2222; }

.font-color--red {
  color: #aa2222; }

/* RED Button :hover */
.button.bg-color--red:hover {
  background-color: #bf2727;
  border-color: #bf2727;
  color: #fff; }

/* YELLOW */
.bg-color--yellow,
.button.bg-color--yellow:focus {
  background-color: #f1c40f;
  border-color: #f1c40f;
  color: #000; }

.bg-color--yellow.tag::before {
  border-color: transparent #f1c40f transparent transparent; }

.border-color--yellow {
  border-color: #f1c40f; }

.font-color--yellow {
  color: #f1c40f; }

/* YELLOW Button :hover */
.button.bg-color--yellow:hover {
  background-color: #f6d010;
  border-color: #f6d010;
  color: #000; }

/* GREEN */
.bg-color--green,
.button.bg-color--green:focus {
  background-color: #146140;
  border-color: #146140;
  color: #fff; }

.bg-color--green.tag::before {
  border-color: transparent #146140 transparent transparent; }

.border-color--green {
  border-color: #146140; }

.font-color--green {
  color: #146140; }

/* GREEN Button :hover */
.button.bg-color--green:hover {
  background-color: #176e49;
  border-color: #176e49;
  color: #fff; }

/* BLUE */
.bg-color--blue,
.button.bg-color--blue:focus {
  background-color: #0D6FBA;
  border-color: #0D6FBA;
  color: #fff; }

.bg-color--blue.tag::before {
  border-color: transparent #0D6FBA transparent transparent; }

.border-color--blue {
  border-color: #0D6FBA; }

.font-color--blue {
  color: #0D6FBA; }

/* GREEN Button :hover */
.button.bg-color--blue:hover {
  background-color: #0f7ecf;
  border-color: #0f7ecf;
  color: #fff; }

/* GRAY */
.bg-color--gray {
  background-color: #52575b;
  border-color: #52575b;
  color: #fff; }

.bg-color--gray.tag::before {
  border-color: transparent #fff transparent transparent; }

.border-color--gray {
  border-color: #52575b; }

.font-color--gray {
  color: #52575b; }

/* disabled */
[readonly],
.button[aria-disabled="true"],
[disabled]:active,
.bg-color--disabled,
[disabled],
.bg-color--disabled:hover,
[disabled]:hover,
.bg-color--disabled:focus,
[disabled]:focus {
  background-color: #ebeced;
  color: #4d4d4d;
  pointer-events: none; }

.button[disabled],
.button[aria-disabled="true"],
.button.bg-color--disabled,
.dropzone.bg-color--disabled,
.dropzone[disabled],
.dropzone.bg-color--disabled:hover,
.dropzone[disabled]:hover {
  border-color: #ebeced; }

[aria-disabled="true"] {
  pointer-events: none; }

.button[aria-disabled="true"]:focus {
  outline: 0.0625rem dashed #4d4d4d; }

.bg-color--disabled a {
  color: #4d4d4d;
  cursor: not-allowed; }

/* disabled fuer label in Kombi checkbox-radiobutton forms.css*/
.bg-color--disabled + .label-group__label {
  pointer-events: none; }

/* transparent */
.bg-color--transparent {
  border-color: transparent;
  background: transparent;
  color: var(--font-color-base, #000); }

.toggle__head.bg-color--transparent {
  border: var(--toggle-border, var(--default-border-color-forms, var(--default-border-color, #cdcdcd))); }

/* transparent bei Button mit default Link Farbe */
.button.bg-color--transparent {
  color: var(--link-normal-color, #003865); }

.button:hover.bg-color--transparent {
  color: var(--button-default-color-hover, #fff);
  background-color: var(--button-default-bg-color-hover, #0077cb);
  border-color: var(--button-default-bg-color-hover, #0077cb); }

.button:focus.bg-color--transparent {
  background: var(--button-default-bg-color-focus, #0077cb);
  border-color: var(--button-default-bg-color-focus, #0077cb);
  color: var(--button-default-color-focus, #fff);
  outline: 0; }

.button-type--info,
.button--type-info {
  background: var(--button-type-info-bg-color, #f1f1f1);
  border-color: var(--button-type-info-border-color, #8a8a8a);
  color: var(--button-type-info-color, #8a8a8a); }

.button-type--password,
.button-type--password:hover,
.button-type--password:focus {
  background: transparent;
  color: var(--button-type-info-color, #8a8a8a);
  border-color: transparent;
  border-radius: 0;
  min-height: calc(var(--button-default-height, 1.875rem) + (0.0625rem));
  font-size: 0.625rem; }

.button-type--password:hover,
.button-type--password:focus {
  background: transparent;
  color: var(--font-color-base, #000); }

.button-type--password .button__icon i {
  font-size: calc(var(--default-icon-size, 1.5rem) - 0.25rem); }

.fade--in,
.animation--fade-in {
  animation: fadeIn 0.5s ease; }

.image-width--100-percent {
  width: 100%; }

.scrolling--hide-all {
  overflow: hidden; }

.position--static {
  position: static; }

.position--absolute {
  position: absolute; }

.position--relative {
  position: relative; }

.position--fixed {
  position: absolute; }

.position--absolute {
  position: fixed; }

.position--sticky {
  position: sticky; }

[role="button"] {
  cursor: pointer; }

.list--style-no-style {
  list-style-type: none;
  margin-left: 0; }

.list--style-circle {
  list-style-type: circle; }

.ol-list--style-roman-digits {
  counter-reset: zahl_roman;
  list-style-type: none; }

.ol-list--style-roman-digits ol {
  counter-reset: zahl_roman;
  list-style-type: none; }

.ol-list--style-roman-digits .ol-list__item:before {
  content: counters(zahl_roman, ".", upper-roman) ". ";
  counter-increment: zahl_roman;
  display: inline-block;
  margin-right: 0.3125rem; }

.border--all-none {
  border: none; }

.border--top-none {
  border-top: none; }

.border--bottom-none {
  border-bottom: none; }

.border--left-none {
  border-left: none; }

.border--right-none {
  border-right: none; }

.border--all-solid {
  border-style: solid;
  border-width: 0.0625rem; }

.border--top-solid {
  border-top-style: solid;
  border-top-width: 0.0625rem; }

.border--bottom-solid {
  border-bottom-style: solid;
  border-bottom-width: 0.0625rem; }

.border--left-solid {
  border-left-style: solid;
  border-left-width: 0.0625rem; }

.border--right-solid {
  border-right-style: solid;
  border-right-width: 0.0625rem; }

.border--radius-none {
  border-radius: 0; }

.display--style-none {
  display: none; }

.height--auto {
  min-height: auto;
  height: auto; }

.font--size-20px {
  font-size: calc($value / 16)rem; }

.font--size-22px {
  font-size: calc($value / 16)rem; }

.font--size-24px {
  font-size: calc($value / 16)rem; }

.font--size-26px {
  font-size: calc($value / 16)rem; }

.font--size-28px {
  font-size: calc($value / 16)rem; }

.font--size-30px {
  font-size: calc($value / 16)rem; }

.font--size-32px {
  font-size: calc($value / 16)rem; }

.font--size-34px {
  font-size: calc($value / 16)rem; }

.font--size-36px {
  font-size: calc($value / 16)rem; }

.font--size-38px {
  font-size: calc($value / 16)rem; }

.font--size-40px {
  font-size: calc($value / 16)rem; }

.font--size-42px {
  font-size: calc($value / 16)rem; }

.font--size-44px {
  font-size: calc($value / 16)rem; }

.font--size-46px {
  font-size: calc($value / 16)rem; }

.font--size-48px {
  font-size: calc($value / 16)rem; }

.font--size-50px {
  font-size: calc($value / 16)rem; }

.font--size-52px {
  font-size: calc($value / 16)rem; }

.font--size-54px {
  font-size: calc($value / 16)rem; }

.font--size-56px {
  font-size: calc($value / 16)rem; }

.font--size-58px {
  font-size: calc($value / 16)rem; }

.font--size-60px {
  font-size: calc($value / 16)rem; }

.font--size-62px {
  font-size: calc($value / 16)rem; }

.font--size-64px {
  font-size: calc($value / 16)rem; }

.font--size-66px {
  font-size: calc($value / 16)rem; }

.font--size-68px {
  font-size: calc($value / 16)rem; }

.font--size-70px {
  font-size: calc($value / 16)rem; }

.font--size-72px {
  font-size: calc($value / 16)rem; }

.font--size-74px {
  font-size: calc($value / 16)rem; }

.font--size-76px {
  font-size: calc($value / 16)rem; }

.font--size-78px {
  font-size: calc($value / 16)rem; }

.font--size-80px {
  font-size: calc($value / 16)rem; }

.font--size-82px {
  font-size: calc($value / 16)rem; }

.font--size-84px {
  font-size: calc($value / 16)rem; }

.font--size-86px {
  font-size: calc($value / 16)rem; }

.font--size-88px {
  font-size: calc($value / 16)rem; }

.font--size-90px {
  font-size: calc($value / 16)rem; }

.font--size-92px {
  font-size: calc($value / 16)rem; }

.font--size-94px {
  font-size: calc($value / 16)rem; }

.font--size-96px {
  font-size: calc($value / 16)rem; }

.font--size-98px {
  font-size: calc($value / 16)rem; }

.font--size-100px {
  font-size: calc($value / 16)rem; }

.font--weight-normal {
  font-weight: var(--font-weight-base, normal); }

.text--strong,
.text--weight-strong,
.text--strong i,
.text--weight-strong i,
.text--strong:hover,
.text--weight-strong:hover,
.text--strong i,
.text--weight-strong i {
  font-weight: var(--font-weight-bold-base, bold); }

.text--small,
.text--size-small {
  font-size: var(--font-size-small, 0.6875rem); }

.text--big,
.text--size-big {
  font-size: var(--font-size-big, 1.125rem); }

.text--uppercase,
.text--transform-uppercase {
  text-transform: uppercase; }

.text--transform-normal {
  text-transform: none; }

.text--break-all {
  hyphens: auto;
  word-break: break-all; }

.text--align-right {
  text-align: right;
  justify-content: flex-end;
  margin-left: auto; }

.text--align-left {
  text-align: left;
  justify-content: flex-start; }

.text--align-center {
  text-align: center;
  justify-content: center; }

.table .table__head-cell .text--align-left > * {
  margin-right: auto; }

.table .table__head-cell .text--align-center > * {
  margin-left: auto;
  margin-right: auto; }

.table .table__head-cell .text--align-right > * {
  margin-left: auto; }

.stripes--odd-even .output-list__item:nth-child(odd) {
  background: #f1f1f1; }

.stripes--odd-even .output-list__item:nth-child(even) {
  background: #fff; }

.icon--big,
.icon--size-big {
  font-size: calc(var(--default-icon-size, 1.5rem) * 2); }

.icon--large,
.icon--size-large {
  font-size: calc(var(--default-icon-size, 1.5rem) * 4); }

.indent--left-15 .columns:first-child .checkbox-group,
.indent--left-15 .columns:first-child .label-group:first-child,
.indent--left-15 .columns:first-child .input-group {
  margin-left: 0.9375rem; }

.align--center {
  text-align: center;
  margin-left: auto;
  margin-right: auto; }

.align--left {
  text-align: left;
  margin-right: auto;
  justify-content: flex-start; }

.align--right {
  text-align: right;
  margin-left: auto;
  justify-content: flex-end; }

.vertical--align-center {
  display: flex;
  justify-content: center;
  align-items: center; }

.vertical--align-top {
  align-items: flex-start; }

.vertical--align-bottom {
  align-items: flex-end; }

@media (max-width: 1024px) {
  .table__body-cell.text--align-center {
    justify-content: flex-start;
    margin-left: 0; } }

.button.align--right,
.link.align--right,
.link-icon.align--right {
  text-align: right;
  float: right;
  margin-left: auto; }

.checkbox-group.align--right,
.radio-group.align--right {
  justify-content: flex-end; }

.checkbox-group.align--center,
.radio-group.align--center {
  justify-content: center; }

.boxshadow--none {
  box-shadow: none; }

.size--width-30 {
  width: 30% !important; }

.size--width-50 {
  width: 50% !important; }

.size--width-70 {
  width: 70% !important; }

.size--width-100 {
  width: 100% !important; }

.flex--direction-column {
  flex-direction: column; }

.flex--direction-row {
  flex-direction: row; }

.size--height-0px {
  height: 0rem; }

.size--width-0px {
  width: 0rem; }

.size--width-0px {
  --card-width: 0rem;
  width: 0rem; }

.margin--all-0 {
  margin: 0rem; }

.margin--bottom-0 {
  margin-bottom: 0rem; }

.margin--top-0 {
  margin-top: 0rem; }

.margin--left-0 {
  margin-left: 0rem; }

.margin--right-0 {
  margin-right: 0rem; }

.margin--left-right-0 {
  margin-left: 0rem;
  margin-right: 0rem; }

.margin--top-bottom-0 {
  margin-top: 0rem;
  margin-bottom: 0rem; }

.padding--all-0 {
  padding: 0rem; }

.padding--bottom-0 {
  padding-bottom: 0rem; }

.padding--top-0 {
  padding-top: 0rem; }

.padding--left-0 {
  padding-left: 0rem; }

.padding--right-0 {
  padding-right: 0rem; }

.padding--left-right-0 {
  padding-left: 0rem;
  padding-right: 0rem; }

.padding--top-bottom-0 {
  padding-top: 0rem;
  padding-bottom: 0rem; }

.size--height-5px {
  height: 0.3125rem; }

.size--width-5px {
  width: 0.3125rem; }

.size--width-10px {
  --card-width: 0.625rem;
  width: 0.625rem; }

.margin--all-5 {
  margin: 0.3125rem; }

.margin--bottom-5 {
  margin-bottom: 0.3125rem; }

.margin--top-5 {
  margin-top: 0.3125rem; }

.margin--left-5 {
  margin-left: 0.3125rem; }

.margin--right-5 {
  margin-right: 0.3125rem; }

.margin--left-right-5 {
  margin-left: 0.3125rem;
  margin-right: 0.3125rem; }

.margin--top-bottom-5 {
  margin-top: 0.3125rem;
  margin-bottom: 0.3125rem; }

.padding--all-5 {
  padding: 0.3125rem; }

.padding--bottom-5 {
  padding-bottom: 0.3125rem; }

.padding--top-5 {
  padding-top: 0.3125rem; }

.padding--left-5 {
  padding-left: 0.3125rem; }

.padding--right-5 {
  padding-right: 0.3125rem; }

.padding--left-right-5 {
  padding-left: 0.3125rem;
  padding-right: 0.3125rem; }

.padding--top-bottom-5 {
  padding-top: 0.3125rem;
  padding-bottom: 0.3125rem; }

.size--height-10px {
  height: 0.625rem; }

.size--width-10px {
  width: 0.625rem; }

.size--width-20px {
  --card-width: 1.25rem;
  width: 1.25rem; }

.margin--all-10 {
  margin: 0.625rem; }

.margin--bottom-10 {
  margin-bottom: 0.625rem; }

.margin--top-10 {
  margin-top: 0.625rem; }

.margin--left-10 {
  margin-left: 0.625rem; }

.margin--right-10 {
  margin-right: 0.625rem; }

.margin--left-right-10 {
  margin-left: 0.625rem;
  margin-right: 0.625rem; }

.margin--top-bottom-10 {
  margin-top: 0.625rem;
  margin-bottom: 0.625rem; }

.padding--all-10 {
  padding: 0.625rem; }

.padding--bottom-10 {
  padding-bottom: 0.625rem; }

.padding--top-10 {
  padding-top: 0.625rem; }

.padding--left-10 {
  padding-left: 0.625rem; }

.padding--right-10 {
  padding-right: 0.625rem; }

.padding--left-right-10 {
  padding-left: 0.625rem;
  padding-right: 0.625rem; }

.padding--top-bottom-10 {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem; }

.size--height-15px {
  height: 0.9375rem; }

.size--width-15px {
  width: 0.9375rem; }

.size--width-30px {
  --card-width: 1.875rem;
  width: 1.875rem; }

.margin--all-15 {
  margin: 0.9375rem; }

.margin--bottom-15 {
  margin-bottom: 0.9375rem; }

.margin--top-15 {
  margin-top: 0.9375rem; }

.margin--left-15 {
  margin-left: 0.9375rem; }

.margin--right-15 {
  margin-right: 0.9375rem; }

.margin--left-right-15 {
  margin-left: 0.9375rem;
  margin-right: 0.9375rem; }

.margin--top-bottom-15 {
  margin-top: 0.9375rem;
  margin-bottom: 0.9375rem; }

.padding--all-15 {
  padding: 0.9375rem; }

.padding--bottom-15 {
  padding-bottom: 0.9375rem; }

.padding--top-15 {
  padding-top: 0.9375rem; }

.padding--left-15 {
  padding-left: 0.9375rem; }

.padding--right-15 {
  padding-right: 0.9375rem; }

.padding--left-right-15 {
  padding-left: 0.9375rem;
  padding-right: 0.9375rem; }

.padding--top-bottom-15 {
  padding-top: 0.9375rem;
  padding-bottom: 0.9375rem; }

.size--height-20px {
  height: 1.25rem; }

.size--width-20px {
  width: 1.25rem; }

.size--width-40px {
  --card-width: 2.5rem;
  width: 2.5rem; }

.margin--all-20 {
  margin: 1.25rem; }

.margin--bottom-20 {
  margin-bottom: 1.25rem; }

.margin--top-20 {
  margin-top: 1.25rem; }

.margin--left-20 {
  margin-left: 1.25rem; }

.margin--right-20 {
  margin-right: 1.25rem; }

.margin--left-right-20 {
  margin-left: 1.25rem;
  margin-right: 1.25rem; }

.margin--top-bottom-20 {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem; }

.padding--all-20 {
  padding: 1.25rem; }

.padding--bottom-20 {
  padding-bottom: 1.25rem; }

.padding--top-20 {
  padding-top: 1.25rem; }

.padding--left-20 {
  padding-left: 1.25rem; }

.padding--right-20 {
  padding-right: 1.25rem; }

.padding--left-right-20 {
  padding-left: 1.25rem;
  padding-right: 1.25rem; }

.padding--top-bottom-20 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem; }

.size--height-25px {
  height: 1.5625rem; }

.size--width-25px {
  width: 1.5625rem; }

.size--width-50px {
  --card-width: 3.125rem;
  width: 3.125rem; }

.margin--all-25 {
  margin: 1.5625rem; }

.margin--bottom-25 {
  margin-bottom: 1.5625rem; }

.margin--top-25 {
  margin-top: 1.5625rem; }

.margin--left-25 {
  margin-left: 1.5625rem; }

.margin--right-25 {
  margin-right: 1.5625rem; }

.margin--left-right-25 {
  margin-left: 1.5625rem;
  margin-right: 1.5625rem; }

.margin--top-bottom-25 {
  margin-top: 1.5625rem;
  margin-bottom: 1.5625rem; }

.padding--all-25 {
  padding: 1.5625rem; }

.padding--bottom-25 {
  padding-bottom: 1.5625rem; }

.padding--top-25 {
  padding-top: 1.5625rem; }

.padding--left-25 {
  padding-left: 1.5625rem; }

.padding--right-25 {
  padding-right: 1.5625rem; }

.padding--left-right-25 {
  padding-left: 1.5625rem;
  padding-right: 1.5625rem; }

.padding--top-bottom-25 {
  padding-top: 1.5625rem;
  padding-bottom: 1.5625rem; }

.size--height-30px {
  height: 1.875rem; }

.size--width-30px {
  width: 1.875rem; }

.size--width-60px {
  --card-width: 3.75rem;
  width: 3.75rem; }

.margin--all-30 {
  margin: 1.875rem; }

.margin--bottom-30 {
  margin-bottom: 1.875rem; }

.margin--top-30 {
  margin-top: 1.875rem; }

.margin--left-30 {
  margin-left: 1.875rem; }

.margin--right-30 {
  margin-right: 1.875rem; }

.margin--left-right-30 {
  margin-left: 1.875rem;
  margin-right: 1.875rem; }

.margin--top-bottom-30 {
  margin-top: 1.875rem;
  margin-bottom: 1.875rem; }

.padding--all-30 {
  padding: 1.875rem; }

.padding--bottom-30 {
  padding-bottom: 1.875rem; }

.padding--top-30 {
  padding-top: 1.875rem; }

.padding--left-30 {
  padding-left: 1.875rem; }

.padding--right-30 {
  padding-right: 1.875rem; }

.padding--left-right-30 {
  padding-left: 1.875rem;
  padding-right: 1.875rem; }

.padding--top-bottom-30 {
  padding-top: 1.875rem;
  padding-bottom: 1.875rem; }

.size--height-35px {
  height: 2.1875rem; }

.size--width-35px {
  width: 2.1875rem; }

.size--width-70px {
  --card-width: 4.375rem;
  width: 4.375rem; }

.margin--all-35 {
  margin: 2.1875rem; }

.margin--bottom-35 {
  margin-bottom: 2.1875rem; }

.margin--top-35 {
  margin-top: 2.1875rem; }

.margin--left-35 {
  margin-left: 2.1875rem; }

.margin--right-35 {
  margin-right: 2.1875rem; }

.margin--left-right-35 {
  margin-left: 2.1875rem;
  margin-right: 2.1875rem; }

.margin--top-bottom-35 {
  margin-top: 2.1875rem;
  margin-bottom: 2.1875rem; }

.padding--all-35 {
  padding: 2.1875rem; }

.padding--bottom-35 {
  padding-bottom: 2.1875rem; }

.padding--top-35 {
  padding-top: 2.1875rem; }

.padding--left-35 {
  padding-left: 2.1875rem; }

.padding--right-35 {
  padding-right: 2.1875rem; }

.padding--left-right-35 {
  padding-left: 2.1875rem;
  padding-right: 2.1875rem; }

.padding--top-bottom-35 {
  padding-top: 2.1875rem;
  padding-bottom: 2.1875rem; }

.size--height-40px {
  height: 2.5rem; }

.size--width-40px {
  width: 2.5rem; }

.size--width-80px {
  --card-width: 5rem;
  width: 5rem; }

.margin--all-40 {
  margin: 2.5rem; }

.margin--bottom-40 {
  margin-bottom: 2.5rem; }

.margin--top-40 {
  margin-top: 2.5rem; }

.margin--left-40 {
  margin-left: 2.5rem; }

.margin--right-40 {
  margin-right: 2.5rem; }

.margin--left-right-40 {
  margin-left: 2.5rem;
  margin-right: 2.5rem; }

.margin--top-bottom-40 {
  margin-top: 2.5rem;
  margin-bottom: 2.5rem; }

.padding--all-40 {
  padding: 2.5rem; }

.padding--bottom-40 {
  padding-bottom: 2.5rem; }

.padding--top-40 {
  padding-top: 2.5rem; }

.padding--left-40 {
  padding-left: 2.5rem; }

.padding--right-40 {
  padding-right: 2.5rem; }

.padding--left-right-40 {
  padding-left: 2.5rem;
  padding-right: 2.5rem; }

.padding--top-bottom-40 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem; }

.size--height-45px {
  height: 2.8125rem; }

.size--width-45px {
  width: 2.8125rem; }

.size--width-90px {
  --card-width: 5.625rem;
  width: 5.625rem; }

.margin--all-45 {
  margin: 2.8125rem; }

.margin--bottom-45 {
  margin-bottom: 2.8125rem; }

.margin--top-45 {
  margin-top: 2.8125rem; }

.margin--left-45 {
  margin-left: 2.8125rem; }

.margin--right-45 {
  margin-right: 2.8125rem; }

.margin--left-right-45 {
  margin-left: 2.8125rem;
  margin-right: 2.8125rem; }

.margin--top-bottom-45 {
  margin-top: 2.8125rem;
  margin-bottom: 2.8125rem; }

.padding--all-45 {
  padding: 2.8125rem; }

.padding--bottom-45 {
  padding-bottom: 2.8125rem; }

.padding--top-45 {
  padding-top: 2.8125rem; }

.padding--left-45 {
  padding-left: 2.8125rem; }

.padding--right-45 {
  padding-right: 2.8125rem; }

.padding--left-right-45 {
  padding-left: 2.8125rem;
  padding-right: 2.8125rem; }

.padding--top-bottom-45 {
  padding-top: 2.8125rem;
  padding-bottom: 2.8125rem; }

.size--height-50px {
  height: 3.125rem; }

.size--width-50px {
  width: 3.125rem; }

.size--width-100px {
  --card-width: 6.25rem;
  width: 6.25rem; }

.margin--all-50 {
  margin: 3.125rem; }

.margin--bottom-50 {
  margin-bottom: 3.125rem; }

.margin--top-50 {
  margin-top: 3.125rem; }

.margin--left-50 {
  margin-left: 3.125rem; }

.margin--right-50 {
  margin-right: 3.125rem; }

.margin--left-right-50 {
  margin-left: 3.125rem;
  margin-right: 3.125rem; }

.margin--top-bottom-50 {
  margin-top: 3.125rem;
  margin-bottom: 3.125rem; }

.padding--all-50 {
  padding: 3.125rem; }

.padding--bottom-50 {
  padding-bottom: 3.125rem; }

.padding--top-50 {
  padding-top: 3.125rem; }

.padding--left-50 {
  padding-left: 3.125rem; }

.padding--right-50 {
  padding-right: 3.125rem; }

.padding--left-right-50 {
  padding-left: 3.125rem;
  padding-right: 3.125rem; }

.padding--top-bottom-50 {
  padding-top: 3.125rem;
  padding-bottom: 3.125rem; }

.size--height-55px {
  height: 3.4375rem; }

.size--width-55px {
  width: 3.4375rem; }

.size--width-110px {
  --card-width: 6.875rem;
  width: 6.875rem; }

.margin--all-55 {
  margin: 3.4375rem; }

.margin--bottom-55 {
  margin-bottom: 3.4375rem; }

.margin--top-55 {
  margin-top: 3.4375rem; }

.margin--left-55 {
  margin-left: 3.4375rem; }

.margin--right-55 {
  margin-right: 3.4375rem; }

.margin--left-right-55 {
  margin-left: 3.4375rem;
  margin-right: 3.4375rem; }

.margin--top-bottom-55 {
  margin-top: 3.4375rem;
  margin-bottom: 3.4375rem; }

.padding--all-55 {
  padding: 3.4375rem; }

.padding--bottom-55 {
  padding-bottom: 3.4375rem; }

.padding--top-55 {
  padding-top: 3.4375rem; }

.padding--left-55 {
  padding-left: 3.4375rem; }

.padding--right-55 {
  padding-right: 3.4375rem; }

.padding--left-right-55 {
  padding-left: 3.4375rem;
  padding-right: 3.4375rem; }

.padding--top-bottom-55 {
  padding-top: 3.4375rem;
  padding-bottom: 3.4375rem; }

.size--height-60px {
  height: 3.75rem; }

.size--width-60px {
  width: 3.75rem; }

.size--width-120px {
  --card-width: 7.5rem;
  width: 7.5rem; }

.margin--all-60 {
  margin: 3.75rem; }

.margin--bottom-60 {
  margin-bottom: 3.75rem; }

.margin--top-60 {
  margin-top: 3.75rem; }

.margin--left-60 {
  margin-left: 3.75rem; }

.margin--right-60 {
  margin-right: 3.75rem; }

.margin--left-right-60 {
  margin-left: 3.75rem;
  margin-right: 3.75rem; }

.margin--top-bottom-60 {
  margin-top: 3.75rem;
  margin-bottom: 3.75rem; }

.padding--all-60 {
  padding: 3.75rem; }

.padding--bottom-60 {
  padding-bottom: 3.75rem; }

.padding--top-60 {
  padding-top: 3.75rem; }

.padding--left-60 {
  padding-left: 3.75rem; }

.padding--right-60 {
  padding-right: 3.75rem; }

.padding--left-right-60 {
  padding-left: 3.75rem;
  padding-right: 3.75rem; }

.padding--top-bottom-60 {
  padding-top: 3.75rem;
  padding-bottom: 3.75rem; }

.size--height-65px {
  height: 4.0625rem; }

.size--width-65px {
  width: 4.0625rem; }

.size--width-130px {
  --card-width: 8.125rem;
  width: 8.125rem; }

.margin--all-65 {
  margin: 4.0625rem; }

.margin--bottom-65 {
  margin-bottom: 4.0625rem; }

.margin--top-65 {
  margin-top: 4.0625rem; }

.margin--left-65 {
  margin-left: 4.0625rem; }

.margin--right-65 {
  margin-right: 4.0625rem; }

.margin--left-right-65 {
  margin-left: 4.0625rem;
  margin-right: 4.0625rem; }

.margin--top-bottom-65 {
  margin-top: 4.0625rem;
  margin-bottom: 4.0625rem; }

.padding--all-65 {
  padding: 4.0625rem; }

.padding--bottom-65 {
  padding-bottom: 4.0625rem; }

.padding--top-65 {
  padding-top: 4.0625rem; }

.padding--left-65 {
  padding-left: 4.0625rem; }

.padding--right-65 {
  padding-right: 4.0625rem; }

.padding--left-right-65 {
  padding-left: 4.0625rem;
  padding-right: 4.0625rem; }

.padding--top-bottom-65 {
  padding-top: 4.0625rem;
  padding-bottom: 4.0625rem; }

.size--height-70px {
  height: 4.375rem; }

.size--width-70px {
  width: 4.375rem; }

.size--width-140px {
  --card-width: 8.75rem;
  width: 8.75rem; }

.margin--all-70 {
  margin: 4.375rem; }

.margin--bottom-70 {
  margin-bottom: 4.375rem; }

.margin--top-70 {
  margin-top: 4.375rem; }

.margin--left-70 {
  margin-left: 4.375rem; }

.margin--right-70 {
  margin-right: 4.375rem; }

.margin--left-right-70 {
  margin-left: 4.375rem;
  margin-right: 4.375rem; }

.margin--top-bottom-70 {
  margin-top: 4.375rem;
  margin-bottom: 4.375rem; }

.padding--all-70 {
  padding: 4.375rem; }

.padding--bottom-70 {
  padding-bottom: 4.375rem; }

.padding--top-70 {
  padding-top: 4.375rem; }

.padding--left-70 {
  padding-left: 4.375rem; }

.padding--right-70 {
  padding-right: 4.375rem; }

.padding--left-right-70 {
  padding-left: 4.375rem;
  padding-right: 4.375rem; }

.padding--top-bottom-70 {
  padding-top: 4.375rem;
  padding-bottom: 4.375rem; }

.size--height-75px {
  height: 4.6875rem; }

.size--width-75px {
  width: 4.6875rem; }

.size--width-150px {
  --card-width: 9.375rem;
  width: 9.375rem; }

.margin--all-75 {
  margin: 4.6875rem; }

.margin--bottom-75 {
  margin-bottom: 4.6875rem; }

.margin--top-75 {
  margin-top: 4.6875rem; }

.margin--left-75 {
  margin-left: 4.6875rem; }

.margin--right-75 {
  margin-right: 4.6875rem; }

.margin--left-right-75 {
  margin-left: 4.6875rem;
  margin-right: 4.6875rem; }

.margin--top-bottom-75 {
  margin-top: 4.6875rem;
  margin-bottom: 4.6875rem; }

.padding--all-75 {
  padding: 4.6875rem; }

.padding--bottom-75 {
  padding-bottom: 4.6875rem; }

.padding--top-75 {
  padding-top: 4.6875rem; }

.padding--left-75 {
  padding-left: 4.6875rem; }

.padding--right-75 {
  padding-right: 4.6875rem; }

.padding--left-right-75 {
  padding-left: 4.6875rem;
  padding-right: 4.6875rem; }

.padding--top-bottom-75 {
  padding-top: 4.6875rem;
  padding-bottom: 4.6875rem; }

.size--height-80px {
  height: 5rem; }

.size--width-80px {
  width: 5rem; }

.size--width-160px {
  --card-width: 10rem;
  width: 10rem; }

.margin--all-80 {
  margin: 5rem; }

.margin--bottom-80 {
  margin-bottom: 5rem; }

.margin--top-80 {
  margin-top: 5rem; }

.margin--left-80 {
  margin-left: 5rem; }

.margin--right-80 {
  margin-right: 5rem; }

.margin--left-right-80 {
  margin-left: 5rem;
  margin-right: 5rem; }

.margin--top-bottom-80 {
  margin-top: 5rem;
  margin-bottom: 5rem; }

.padding--all-80 {
  padding: 5rem; }

.padding--bottom-80 {
  padding-bottom: 5rem; }

.padding--top-80 {
  padding-top: 5rem; }

.padding--left-80 {
  padding-left: 5rem; }

.padding--right-80 {
  padding-right: 5rem; }

.padding--left-right-80 {
  padding-left: 5rem;
  padding-right: 5rem; }

.padding--top-bottom-80 {
  padding-top: 5rem;
  padding-bottom: 5rem; }

.size--height-85px {
  height: 5.3125rem; }

.size--width-85px {
  width: 5.3125rem; }

.size--width-170px {
  --card-width: 10.625rem;
  width: 10.625rem; }

.margin--all-85 {
  margin: 5.3125rem; }

.margin--bottom-85 {
  margin-bottom: 5.3125rem; }

.margin--top-85 {
  margin-top: 5.3125rem; }

.margin--left-85 {
  margin-left: 5.3125rem; }

.margin--right-85 {
  margin-right: 5.3125rem; }

.margin--left-right-85 {
  margin-left: 5.3125rem;
  margin-right: 5.3125rem; }

.margin--top-bottom-85 {
  margin-top: 5.3125rem;
  margin-bottom: 5.3125rem; }

.padding--all-85 {
  padding: 5.3125rem; }

.padding--bottom-85 {
  padding-bottom: 5.3125rem; }

.padding--top-85 {
  padding-top: 5.3125rem; }

.padding--left-85 {
  padding-left: 5.3125rem; }

.padding--right-85 {
  padding-right: 5.3125rem; }

.padding--left-right-85 {
  padding-left: 5.3125rem;
  padding-right: 5.3125rem; }

.padding--top-bottom-85 {
  padding-top: 5.3125rem;
  padding-bottom: 5.3125rem; }

.size--height-90px {
  height: 5.625rem; }

.size--width-90px {
  width: 5.625rem; }

.size--width-180px {
  --card-width: 11.25rem;
  width: 11.25rem; }

.margin--all-90 {
  margin: 5.625rem; }

.margin--bottom-90 {
  margin-bottom: 5.625rem; }

.margin--top-90 {
  margin-top: 5.625rem; }

.margin--left-90 {
  margin-left: 5.625rem; }

.margin--right-90 {
  margin-right: 5.625rem; }

.margin--left-right-90 {
  margin-left: 5.625rem;
  margin-right: 5.625rem; }

.margin--top-bottom-90 {
  margin-top: 5.625rem;
  margin-bottom: 5.625rem; }

.padding--all-90 {
  padding: 5.625rem; }

.padding--bottom-90 {
  padding-bottom: 5.625rem; }

.padding--top-90 {
  padding-top: 5.625rem; }

.padding--left-90 {
  padding-left: 5.625rem; }

.padding--right-90 {
  padding-right: 5.625rem; }

.padding--left-right-90 {
  padding-left: 5.625rem;
  padding-right: 5.625rem; }

.padding--top-bottom-90 {
  padding-top: 5.625rem;
  padding-bottom: 5.625rem; }

.size--height-95px {
  height: 5.9375rem; }

.size--width-95px {
  width: 5.9375rem; }

.size--width-190px {
  --card-width: 11.875rem;
  width: 11.875rem; }

.margin--all-95 {
  margin: 5.9375rem; }

.margin--bottom-95 {
  margin-bottom: 5.9375rem; }

.margin--top-95 {
  margin-top: 5.9375rem; }

.margin--left-95 {
  margin-left: 5.9375rem; }

.margin--right-95 {
  margin-right: 5.9375rem; }

.margin--left-right-95 {
  margin-left: 5.9375rem;
  margin-right: 5.9375rem; }

.margin--top-bottom-95 {
  margin-top: 5.9375rem;
  margin-bottom: 5.9375rem; }

.padding--all-95 {
  padding: 5.9375rem; }

.padding--bottom-95 {
  padding-bottom: 5.9375rem; }

.padding--top-95 {
  padding-top: 5.9375rem; }

.padding--left-95 {
  padding-left: 5.9375rem; }

.padding--right-95 {
  padding-right: 5.9375rem; }

.padding--left-right-95 {
  padding-left: 5.9375rem;
  padding-right: 5.9375rem; }

.padding--top-bottom-95 {
  padding-top: 5.9375rem;
  padding-bottom: 5.9375rem; }

.size--height-100px {
  height: 6.25rem; }

.size--width-100px {
  width: 6.25rem; }

.size--width-200px {
  --card-width: 12.5rem;
  width: 12.5rem; }

.margin--all-100 {
  margin: 6.25rem; }

.margin--bottom-100 {
  margin-bottom: 6.25rem; }

.margin--top-100 {
  margin-top: 6.25rem; }

.margin--left-100 {
  margin-left: 6.25rem; }

.margin--right-100 {
  margin-right: 6.25rem; }

.margin--left-right-100 {
  margin-left: 6.25rem;
  margin-right: 6.25rem; }

.margin--top-bottom-100 {
  margin-top: 6.25rem;
  margin-bottom: 6.25rem; }

.padding--all-100 {
  padding: 6.25rem; }

.padding--bottom-100 {
  padding-bottom: 6.25rem; }

.padding--top-100 {
  padding-top: 6.25rem; }

.padding--left-100 {
  padding-left: 6.25rem; }

.padding--right-100 {
  padding-right: 6.25rem; }

.padding--left-right-100 {
  padding-left: 6.25rem;
  padding-right: 6.25rem; }

.padding--top-bottom-100 {
  padding-top: 6.25rem;
  padding-bottom: 6.25rem; }

.size--height-105px {
  height: 6.5625rem; }

.size--width-105px {
  width: 6.5625rem; }

.size--width-210px {
  --card-width: 13.125rem;
  width: 13.125rem; }

.margin--all-105 {
  margin: 6.5625rem; }

.margin--bottom-105 {
  margin-bottom: 6.5625rem; }

.margin--top-105 {
  margin-top: 6.5625rem; }

.margin--left-105 {
  margin-left: 6.5625rem; }

.margin--right-105 {
  margin-right: 6.5625rem; }

.margin--left-right-105 {
  margin-left: 6.5625rem;
  margin-right: 6.5625rem; }

.margin--top-bottom-105 {
  margin-top: 6.5625rem;
  margin-bottom: 6.5625rem; }

.padding--all-105 {
  padding: 6.5625rem; }

.padding--bottom-105 {
  padding-bottom: 6.5625rem; }

.padding--top-105 {
  padding-top: 6.5625rem; }

.padding--left-105 {
  padding-left: 6.5625rem; }

.padding--right-105 {
  padding-right: 6.5625rem; }

.padding--left-right-105 {
  padding-left: 6.5625rem;
  padding-right: 6.5625rem; }

.padding--top-bottom-105 {
  padding-top: 6.5625rem;
  padding-bottom: 6.5625rem; }

.size--height-110px {
  height: 6.875rem; }

.size--width-110px {
  width: 6.875rem; }

.size--width-220px {
  --card-width: 13.75rem;
  width: 13.75rem; }

.margin--all-110 {
  margin: 6.875rem; }

.margin--bottom-110 {
  margin-bottom: 6.875rem; }

.margin--top-110 {
  margin-top: 6.875rem; }

.margin--left-110 {
  margin-left: 6.875rem; }

.margin--right-110 {
  margin-right: 6.875rem; }

.margin--left-right-110 {
  margin-left: 6.875rem;
  margin-right: 6.875rem; }

.margin--top-bottom-110 {
  margin-top: 6.875rem;
  margin-bottom: 6.875rem; }

.padding--all-110 {
  padding: 6.875rem; }

.padding--bottom-110 {
  padding-bottom: 6.875rem; }

.padding--top-110 {
  padding-top: 6.875rem; }

.padding--left-110 {
  padding-left: 6.875rem; }

.padding--right-110 {
  padding-right: 6.875rem; }

.padding--left-right-110 {
  padding-left: 6.875rem;
  padding-right: 6.875rem; }

.padding--top-bottom-110 {
  padding-top: 6.875rem;
  padding-bottom: 6.875rem; }

.size--height-115px {
  height: 7.1875rem; }

.size--width-115px {
  width: 7.1875rem; }

.size--width-230px {
  --card-width: 14.375rem;
  width: 14.375rem; }

.margin--all-115 {
  margin: 7.1875rem; }

.margin--bottom-115 {
  margin-bottom: 7.1875rem; }

.margin--top-115 {
  margin-top: 7.1875rem; }

.margin--left-115 {
  margin-left: 7.1875rem; }

.margin--right-115 {
  margin-right: 7.1875rem; }

.margin--left-right-115 {
  margin-left: 7.1875rem;
  margin-right: 7.1875rem; }

.margin--top-bottom-115 {
  margin-top: 7.1875rem;
  margin-bottom: 7.1875rem; }

.padding--all-115 {
  padding: 7.1875rem; }

.padding--bottom-115 {
  padding-bottom: 7.1875rem; }

.padding--top-115 {
  padding-top: 7.1875rem; }

.padding--left-115 {
  padding-left: 7.1875rem; }

.padding--right-115 {
  padding-right: 7.1875rem; }

.padding--left-right-115 {
  padding-left: 7.1875rem;
  padding-right: 7.1875rem; }

.padding--top-bottom-115 {
  padding-top: 7.1875rem;
  padding-bottom: 7.1875rem; }

.size--height-120px {
  height: 7.5rem; }

.size--width-120px {
  width: 7.5rem; }

.size--width-240px {
  --card-width: 15rem;
  width: 15rem; }

.margin--all-120 {
  margin: 7.5rem; }

.margin--bottom-120 {
  margin-bottom: 7.5rem; }

.margin--top-120 {
  margin-top: 7.5rem; }

.margin--left-120 {
  margin-left: 7.5rem; }

.margin--right-120 {
  margin-right: 7.5rem; }

.margin--left-right-120 {
  margin-left: 7.5rem;
  margin-right: 7.5rem; }

.margin--top-bottom-120 {
  margin-top: 7.5rem;
  margin-bottom: 7.5rem; }

.padding--all-120 {
  padding: 7.5rem; }

.padding--bottom-120 {
  padding-bottom: 7.5rem; }

.padding--top-120 {
  padding-top: 7.5rem; }

.padding--left-120 {
  padding-left: 7.5rem; }

.padding--right-120 {
  padding-right: 7.5rem; }

.padding--left-right-120 {
  padding-left: 7.5rem;
  padding-right: 7.5rem; }

.padding--top-bottom-120 {
  padding-top: 7.5rem;
  padding-bottom: 7.5rem; }

.size--height-125px {
  height: 7.8125rem; }

.size--width-125px {
  width: 7.8125rem; }

.size--width-250px {
  --card-width: 15.625rem;
  width: 15.625rem; }

.margin--all-125 {
  margin: 7.8125rem; }

.margin--bottom-125 {
  margin-bottom: 7.8125rem; }

.margin--top-125 {
  margin-top: 7.8125rem; }

.margin--left-125 {
  margin-left: 7.8125rem; }

.margin--right-125 {
  margin-right: 7.8125rem; }

.margin--left-right-125 {
  margin-left: 7.8125rem;
  margin-right: 7.8125rem; }

.margin--top-bottom-125 {
  margin-top: 7.8125rem;
  margin-bottom: 7.8125rem; }

.padding--all-125 {
  padding: 7.8125rem; }

.padding--bottom-125 {
  padding-bottom: 7.8125rem; }

.padding--top-125 {
  padding-top: 7.8125rem; }

.padding--left-125 {
  padding-left: 7.8125rem; }

.padding--right-125 {
  padding-right: 7.8125rem; }

.padding--left-right-125 {
  padding-left: 7.8125rem;
  padding-right: 7.8125rem; }

.padding--top-bottom-125 {
  padding-top: 7.8125rem;
  padding-bottom: 7.8125rem; }

.size--height-130px {
  height: 8.125rem; }

.size--width-130px {
  width: 8.125rem; }

.size--width-260px {
  --card-width: 16.25rem;
  width: 16.25rem; }

.margin--all-130 {
  margin: 8.125rem; }

.margin--bottom-130 {
  margin-bottom: 8.125rem; }

.margin--top-130 {
  margin-top: 8.125rem; }

.margin--left-130 {
  margin-left: 8.125rem; }

.margin--right-130 {
  margin-right: 8.125rem; }

.margin--left-right-130 {
  margin-left: 8.125rem;
  margin-right: 8.125rem; }

.margin--top-bottom-130 {
  margin-top: 8.125rem;
  margin-bottom: 8.125rem; }

.padding--all-130 {
  padding: 8.125rem; }

.padding--bottom-130 {
  padding-bottom: 8.125rem; }

.padding--top-130 {
  padding-top: 8.125rem; }

.padding--left-130 {
  padding-left: 8.125rem; }

.padding--right-130 {
  padding-right: 8.125rem; }

.padding--left-right-130 {
  padding-left: 8.125rem;
  padding-right: 8.125rem; }

.padding--top-bottom-130 {
  padding-top: 8.125rem;
  padding-bottom: 8.125rem; }

.size--height-135px {
  height: 8.4375rem; }

.size--width-135px {
  width: 8.4375rem; }

.size--width-270px {
  --card-width: 16.875rem;
  width: 16.875rem; }

.margin--all-135 {
  margin: 8.4375rem; }

.margin--bottom-135 {
  margin-bottom: 8.4375rem; }

.margin--top-135 {
  margin-top: 8.4375rem; }

.margin--left-135 {
  margin-left: 8.4375rem; }

.margin--right-135 {
  margin-right: 8.4375rem; }

.margin--left-right-135 {
  margin-left: 8.4375rem;
  margin-right: 8.4375rem; }

.margin--top-bottom-135 {
  margin-top: 8.4375rem;
  margin-bottom: 8.4375rem; }

.padding--all-135 {
  padding: 8.4375rem; }

.padding--bottom-135 {
  padding-bottom: 8.4375rem; }

.padding--top-135 {
  padding-top: 8.4375rem; }

.padding--left-135 {
  padding-left: 8.4375rem; }

.padding--right-135 {
  padding-right: 8.4375rem; }

.padding--left-right-135 {
  padding-left: 8.4375rem;
  padding-right: 8.4375rem; }

.padding--top-bottom-135 {
  padding-top: 8.4375rem;
  padding-bottom: 8.4375rem; }

.size--height-140px {
  height: 8.75rem; }

.size--width-140px {
  width: 8.75rem; }

.size--width-280px {
  --card-width: 17.5rem;
  width: 17.5rem; }

.margin--all-140 {
  margin: 8.75rem; }

.margin--bottom-140 {
  margin-bottom: 8.75rem; }

.margin--top-140 {
  margin-top: 8.75rem; }

.margin--left-140 {
  margin-left: 8.75rem; }

.margin--right-140 {
  margin-right: 8.75rem; }

.margin--left-right-140 {
  margin-left: 8.75rem;
  margin-right: 8.75rem; }

.margin--top-bottom-140 {
  margin-top: 8.75rem;
  margin-bottom: 8.75rem; }

.padding--all-140 {
  padding: 8.75rem; }

.padding--bottom-140 {
  padding-bottom: 8.75rem; }

.padding--top-140 {
  padding-top: 8.75rem; }

.padding--left-140 {
  padding-left: 8.75rem; }

.padding--right-140 {
  padding-right: 8.75rem; }

.padding--left-right-140 {
  padding-left: 8.75rem;
  padding-right: 8.75rem; }

.padding--top-bottom-140 {
  padding-top: 8.75rem;
  padding-bottom: 8.75rem; }

.size--height-145px {
  height: 9.0625rem; }

.size--width-145px {
  width: 9.0625rem; }

.size--width-290px {
  --card-width: 18.125rem;
  width: 18.125rem; }

.margin--all-145 {
  margin: 9.0625rem; }

.margin--bottom-145 {
  margin-bottom: 9.0625rem; }

.margin--top-145 {
  margin-top: 9.0625rem; }

.margin--left-145 {
  margin-left: 9.0625rem; }

.margin--right-145 {
  margin-right: 9.0625rem; }

.margin--left-right-145 {
  margin-left: 9.0625rem;
  margin-right: 9.0625rem; }

.margin--top-bottom-145 {
  margin-top: 9.0625rem;
  margin-bottom: 9.0625rem; }

.padding--all-145 {
  padding: 9.0625rem; }

.padding--bottom-145 {
  padding-bottom: 9.0625rem; }

.padding--top-145 {
  padding-top: 9.0625rem; }

.padding--left-145 {
  padding-left: 9.0625rem; }

.padding--right-145 {
  padding-right: 9.0625rem; }

.padding--left-right-145 {
  padding-left: 9.0625rem;
  padding-right: 9.0625rem; }

.padding--top-bottom-145 {
  padding-top: 9.0625rem;
  padding-bottom: 9.0625rem; }

.size--height-150px {
  height: 9.375rem; }

.size--width-150px {
  width: 9.375rem; }

.size--width-300px {
  --card-width: 18.75rem;
  width: 18.75rem; }

.margin--all-150 {
  margin: 9.375rem; }

.margin--bottom-150 {
  margin-bottom: 9.375rem; }

.margin--top-150 {
  margin-top: 9.375rem; }

.margin--left-150 {
  margin-left: 9.375rem; }

.margin--right-150 {
  margin-right: 9.375rem; }

.margin--left-right-150 {
  margin-left: 9.375rem;
  margin-right: 9.375rem; }

.margin--top-bottom-150 {
  margin-top: 9.375rem;
  margin-bottom: 9.375rem; }

.padding--all-150 {
  padding: 9.375rem; }

.padding--bottom-150 {
  padding-bottom: 9.375rem; }

.padding--top-150 {
  padding-top: 9.375rem; }

.padding--left-150 {
  padding-left: 9.375rem; }

.padding--right-150 {
  padding-right: 9.375rem; }

.padding--left-right-150 {
  padding-left: 9.375rem;
  padding-right: 9.375rem; }

.padding--top-bottom-150 {
  padding-top: 9.375rem;
  padding-bottom: 9.375rem; }

.size--height-155px {
  height: 9.6875rem; }

.size--width-155px {
  width: 9.6875rem; }

.size--width-310px {
  --card-width: 19.375rem;
  width: 19.375rem; }

.margin--all-155 {
  margin: 9.6875rem; }

.margin--bottom-155 {
  margin-bottom: 9.6875rem; }

.margin--top-155 {
  margin-top: 9.6875rem; }

.margin--left-155 {
  margin-left: 9.6875rem; }

.margin--right-155 {
  margin-right: 9.6875rem; }

.margin--left-right-155 {
  margin-left: 9.6875rem;
  margin-right: 9.6875rem; }

.margin--top-bottom-155 {
  margin-top: 9.6875rem;
  margin-bottom: 9.6875rem; }

.padding--all-155 {
  padding: 9.6875rem; }

.padding--bottom-155 {
  padding-bottom: 9.6875rem; }

.padding--top-155 {
  padding-top: 9.6875rem; }

.padding--left-155 {
  padding-left: 9.6875rem; }

.padding--right-155 {
  padding-right: 9.6875rem; }

.padding--left-right-155 {
  padding-left: 9.6875rem;
  padding-right: 9.6875rem; }

.padding--top-bottom-155 {
  padding-top: 9.6875rem;
  padding-bottom: 9.6875rem; }

.size--height-160px {
  height: 10rem; }

.size--width-160px {
  width: 10rem; }

.size--width-320px {
  --card-width: 20rem;
  width: 20rem; }

.margin--all-160 {
  margin: 10rem; }

.margin--bottom-160 {
  margin-bottom: 10rem; }

.margin--top-160 {
  margin-top: 10rem; }

.margin--left-160 {
  margin-left: 10rem; }

.margin--right-160 {
  margin-right: 10rem; }

.margin--left-right-160 {
  margin-left: 10rem;
  margin-right: 10rem; }

.margin--top-bottom-160 {
  margin-top: 10rem;
  margin-bottom: 10rem; }

.padding--all-160 {
  padding: 10rem; }

.padding--bottom-160 {
  padding-bottom: 10rem; }

.padding--top-160 {
  padding-top: 10rem; }

.padding--left-160 {
  padding-left: 10rem; }

.padding--right-160 {
  padding-right: 10rem; }

.padding--left-right-160 {
  padding-left: 10rem;
  padding-right: 10rem; }

.padding--top-bottom-160 {
  padding-top: 10rem;
  padding-bottom: 10rem; }

.size--height-165px {
  height: 10.3125rem; }

.size--width-165px {
  width: 10.3125rem; }

.size--width-330px {
  --card-width: 20.625rem;
  width: 20.625rem; }

.margin--all-165 {
  margin: 10.3125rem; }

.margin--bottom-165 {
  margin-bottom: 10.3125rem; }

.margin--top-165 {
  margin-top: 10.3125rem; }

.margin--left-165 {
  margin-left: 10.3125rem; }

.margin--right-165 {
  margin-right: 10.3125rem; }

.margin--left-right-165 {
  margin-left: 10.3125rem;
  margin-right: 10.3125rem; }

.margin--top-bottom-165 {
  margin-top: 10.3125rem;
  margin-bottom: 10.3125rem; }

.padding--all-165 {
  padding: 10.3125rem; }

.padding--bottom-165 {
  padding-bottom: 10.3125rem; }

.padding--top-165 {
  padding-top: 10.3125rem; }

.padding--left-165 {
  padding-left: 10.3125rem; }

.padding--right-165 {
  padding-right: 10.3125rem; }

.padding--left-right-165 {
  padding-left: 10.3125rem;
  padding-right: 10.3125rem; }

.padding--top-bottom-165 {
  padding-top: 10.3125rem;
  padding-bottom: 10.3125rem; }

.size--height-170px {
  height: 10.625rem; }

.size--width-170px {
  width: 10.625rem; }

.size--width-340px {
  --card-width: 21.25rem;
  width: 21.25rem; }

.margin--all-170 {
  margin: 10.625rem; }

.margin--bottom-170 {
  margin-bottom: 10.625rem; }

.margin--top-170 {
  margin-top: 10.625rem; }

.margin--left-170 {
  margin-left: 10.625rem; }

.margin--right-170 {
  margin-right: 10.625rem; }

.margin--left-right-170 {
  margin-left: 10.625rem;
  margin-right: 10.625rem; }

.margin--top-bottom-170 {
  margin-top: 10.625rem;
  margin-bottom: 10.625rem; }

.padding--all-170 {
  padding: 10.625rem; }

.padding--bottom-170 {
  padding-bottom: 10.625rem; }

.padding--top-170 {
  padding-top: 10.625rem; }

.padding--left-170 {
  padding-left: 10.625rem; }

.padding--right-170 {
  padding-right: 10.625rem; }

.padding--left-right-170 {
  padding-left: 10.625rem;
  padding-right: 10.625rem; }

.padding--top-bottom-170 {
  padding-top: 10.625rem;
  padding-bottom: 10.625rem; }

.size--height-175px {
  height: 10.9375rem; }

.size--width-175px {
  width: 10.9375rem; }

.size--width-350px {
  --card-width: 21.875rem;
  width: 21.875rem; }

.margin--all-175 {
  margin: 10.9375rem; }

.margin--bottom-175 {
  margin-bottom: 10.9375rem; }

.margin--top-175 {
  margin-top: 10.9375rem; }

.margin--left-175 {
  margin-left: 10.9375rem; }

.margin--right-175 {
  margin-right: 10.9375rem; }

.margin--left-right-175 {
  margin-left: 10.9375rem;
  margin-right: 10.9375rem; }

.margin--top-bottom-175 {
  margin-top: 10.9375rem;
  margin-bottom: 10.9375rem; }

.padding--all-175 {
  padding: 10.9375rem; }

.padding--bottom-175 {
  padding-bottom: 10.9375rem; }

.padding--top-175 {
  padding-top: 10.9375rem; }

.padding--left-175 {
  padding-left: 10.9375rem; }

.padding--right-175 {
  padding-right: 10.9375rem; }

.padding--left-right-175 {
  padding-left: 10.9375rem;
  padding-right: 10.9375rem; }

.padding--top-bottom-175 {
  padding-top: 10.9375rem;
  padding-bottom: 10.9375rem; }

.size--height-180px {
  height: 11.25rem; }

.size--width-180px {
  width: 11.25rem; }

.size--width-360px {
  --card-width: 22.5rem;
  width: 22.5rem; }

.margin--all-180 {
  margin: 11.25rem; }

.margin--bottom-180 {
  margin-bottom: 11.25rem; }

.margin--top-180 {
  margin-top: 11.25rem; }

.margin--left-180 {
  margin-left: 11.25rem; }

.margin--right-180 {
  margin-right: 11.25rem; }

.margin--left-right-180 {
  margin-left: 11.25rem;
  margin-right: 11.25rem; }

.margin--top-bottom-180 {
  margin-top: 11.25rem;
  margin-bottom: 11.25rem; }

.padding--all-180 {
  padding: 11.25rem; }

.padding--bottom-180 {
  padding-bottom: 11.25rem; }

.padding--top-180 {
  padding-top: 11.25rem; }

.padding--left-180 {
  padding-left: 11.25rem; }

.padding--right-180 {
  padding-right: 11.25rem; }

.padding--left-right-180 {
  padding-left: 11.25rem;
  padding-right: 11.25rem; }

.padding--top-bottom-180 {
  padding-top: 11.25rem;
  padding-bottom: 11.25rem; }

.size--height-185px {
  height: 11.5625rem; }

.size--width-185px {
  width: 11.5625rem; }

.size--width-370px {
  --card-width: 23.125rem;
  width: 23.125rem; }

.margin--all-185 {
  margin: 11.5625rem; }

.margin--bottom-185 {
  margin-bottom: 11.5625rem; }

.margin--top-185 {
  margin-top: 11.5625rem; }

.margin--left-185 {
  margin-left: 11.5625rem; }

.margin--right-185 {
  margin-right: 11.5625rem; }

.margin--left-right-185 {
  margin-left: 11.5625rem;
  margin-right: 11.5625rem; }

.margin--top-bottom-185 {
  margin-top: 11.5625rem;
  margin-bottom: 11.5625rem; }

.padding--all-185 {
  padding: 11.5625rem; }

.padding--bottom-185 {
  padding-bottom: 11.5625rem; }

.padding--top-185 {
  padding-top: 11.5625rem; }

.padding--left-185 {
  padding-left: 11.5625rem; }

.padding--right-185 {
  padding-right: 11.5625rem; }

.padding--left-right-185 {
  padding-left: 11.5625rem;
  padding-right: 11.5625rem; }

.padding--top-bottom-185 {
  padding-top: 11.5625rem;
  padding-bottom: 11.5625rem; }

.size--height-190px {
  height: 11.875rem; }

.size--width-190px {
  width: 11.875rem; }

.size--width-380px {
  --card-width: 23.75rem;
  width: 23.75rem; }

.margin--all-190 {
  margin: 11.875rem; }

.margin--bottom-190 {
  margin-bottom: 11.875rem; }

.margin--top-190 {
  margin-top: 11.875rem; }

.margin--left-190 {
  margin-left: 11.875rem; }

.margin--right-190 {
  margin-right: 11.875rem; }

.margin--left-right-190 {
  margin-left: 11.875rem;
  margin-right: 11.875rem; }

.margin--top-bottom-190 {
  margin-top: 11.875rem;
  margin-bottom: 11.875rem; }

.padding--all-190 {
  padding: 11.875rem; }

.padding--bottom-190 {
  padding-bottom: 11.875rem; }

.padding--top-190 {
  padding-top: 11.875rem; }

.padding--left-190 {
  padding-left: 11.875rem; }

.padding--right-190 {
  padding-right: 11.875rem; }

.padding--left-right-190 {
  padding-left: 11.875rem;
  padding-right: 11.875rem; }

.padding--top-bottom-190 {
  padding-top: 11.875rem;
  padding-bottom: 11.875rem; }

.size--height-195px {
  height: 12.1875rem; }

.size--width-195px {
  width: 12.1875rem; }

.size--width-390px {
  --card-width: 24.375rem;
  width: 24.375rem; }

.margin--all-195 {
  margin: 12.1875rem; }

.margin--bottom-195 {
  margin-bottom: 12.1875rem; }

.margin--top-195 {
  margin-top: 12.1875rem; }

.margin--left-195 {
  margin-left: 12.1875rem; }

.margin--right-195 {
  margin-right: 12.1875rem; }

.margin--left-right-195 {
  margin-left: 12.1875rem;
  margin-right: 12.1875rem; }

.margin--top-bottom-195 {
  margin-top: 12.1875rem;
  margin-bottom: 12.1875rem; }

.padding--all-195 {
  padding: 12.1875rem; }

.padding--bottom-195 {
  padding-bottom: 12.1875rem; }

.padding--top-195 {
  padding-top: 12.1875rem; }

.padding--left-195 {
  padding-left: 12.1875rem; }

.padding--right-195 {
  padding-right: 12.1875rem; }

.padding--left-right-195 {
  padding-left: 12.1875rem;
  padding-right: 12.1875rem; }

.padding--top-bottom-195 {
  padding-top: 12.1875rem;
  padding-bottom: 12.1875rem; }

.size--height-200px {
  height: 12.5rem; }

.size--width-200px {
  width: 12.5rem; }

.size--width-400px {
  --card-width: 25rem;
  width: 25rem; }

.margin--all-200 {
  margin: 12.5rem; }

.margin--bottom-200 {
  margin-bottom: 12.5rem; }

.margin--top-200 {
  margin-top: 12.5rem; }

.margin--left-200 {
  margin-left: 12.5rem; }

.margin--right-200 {
  margin-right: 12.5rem; }

.margin--left-right-200 {
  margin-left: 12.5rem;
  margin-right: 12.5rem; }

.margin--top-bottom-200 {
  margin-top: 12.5rem;
  margin-bottom: 12.5rem; }

.padding--all-200 {
  padding: 12.5rem; }

.padding--bottom-200 {
  padding-bottom: 12.5rem; }

.padding--top-200 {
  padding-top: 12.5rem; }

.padding--left-200 {
  padding-left: 12.5rem; }

.padding--right-200 {
  padding-right: 12.5rem; }

.padding--left-right-200 {
  padding-left: 12.5rem;
  padding-right: 12.5rem; }

.padding--top-bottom-200 {
  padding-top: 12.5rem;
  padding-bottom: 12.5rem; }

.size--height-205px {
  height: 12.8125rem; }

.size--width-205px {
  width: 12.8125rem; }

.size--width-410px {
  --card-width: 25.625rem;
  width: 25.625rem; }

.margin--all-205 {
  margin: 12.8125rem; }

.margin--bottom-205 {
  margin-bottom: 12.8125rem; }

.margin--top-205 {
  margin-top: 12.8125rem; }

.margin--left-205 {
  margin-left: 12.8125rem; }

.margin--right-205 {
  margin-right: 12.8125rem; }

.margin--left-right-205 {
  margin-left: 12.8125rem;
  margin-right: 12.8125rem; }

.margin--top-bottom-205 {
  margin-top: 12.8125rem;
  margin-bottom: 12.8125rem; }

.padding--all-205 {
  padding: 12.8125rem; }

.padding--bottom-205 {
  padding-bottom: 12.8125rem; }

.padding--top-205 {
  padding-top: 12.8125rem; }

.padding--left-205 {
  padding-left: 12.8125rem; }

.padding--right-205 {
  padding-right: 12.8125rem; }

.padding--left-right-205 {
  padding-left: 12.8125rem;
  padding-right: 12.8125rem; }

.padding--top-bottom-205 {
  padding-top: 12.8125rem;
  padding-bottom: 12.8125rem; }

.size--height-210px {
  height: 13.125rem; }

.size--width-210px {
  width: 13.125rem; }

.size--width-420px {
  --card-width: 26.25rem;
  width: 26.25rem; }

.margin--all-210 {
  margin: 13.125rem; }

.margin--bottom-210 {
  margin-bottom: 13.125rem; }

.margin--top-210 {
  margin-top: 13.125rem; }

.margin--left-210 {
  margin-left: 13.125rem; }

.margin--right-210 {
  margin-right: 13.125rem; }

.margin--left-right-210 {
  margin-left: 13.125rem;
  margin-right: 13.125rem; }

.margin--top-bottom-210 {
  margin-top: 13.125rem;
  margin-bottom: 13.125rem; }

.padding--all-210 {
  padding: 13.125rem; }

.padding--bottom-210 {
  padding-bottom: 13.125rem; }

.padding--top-210 {
  padding-top: 13.125rem; }

.padding--left-210 {
  padding-left: 13.125rem; }

.padding--right-210 {
  padding-right: 13.125rem; }

.padding--left-right-210 {
  padding-left: 13.125rem;
  padding-right: 13.125rem; }

.padding--top-bottom-210 {
  padding-top: 13.125rem;
  padding-bottom: 13.125rem; }

.size--height-215px {
  height: 13.4375rem; }

.size--width-215px {
  width: 13.4375rem; }

.size--width-430px {
  --card-width: 26.875rem;
  width: 26.875rem; }

.margin--all-215 {
  margin: 13.4375rem; }

.margin--bottom-215 {
  margin-bottom: 13.4375rem; }

.margin--top-215 {
  margin-top: 13.4375rem; }

.margin--left-215 {
  margin-left: 13.4375rem; }

.margin--right-215 {
  margin-right: 13.4375rem; }

.margin--left-right-215 {
  margin-left: 13.4375rem;
  margin-right: 13.4375rem; }

.margin--top-bottom-215 {
  margin-top: 13.4375rem;
  margin-bottom: 13.4375rem; }

.padding--all-215 {
  padding: 13.4375rem; }

.padding--bottom-215 {
  padding-bottom: 13.4375rem; }

.padding--top-215 {
  padding-top: 13.4375rem; }

.padding--left-215 {
  padding-left: 13.4375rem; }

.padding--right-215 {
  padding-right: 13.4375rem; }

.padding--left-right-215 {
  padding-left: 13.4375rem;
  padding-right: 13.4375rem; }

.padding--top-bottom-215 {
  padding-top: 13.4375rem;
  padding-bottom: 13.4375rem; }

.size--height-220px {
  height: 13.75rem; }

.size--width-220px {
  width: 13.75rem; }

.size--width-440px {
  --card-width: 27.5rem;
  width: 27.5rem; }

.margin--all-220 {
  margin: 13.75rem; }

.margin--bottom-220 {
  margin-bottom: 13.75rem; }

.margin--top-220 {
  margin-top: 13.75rem; }

.margin--left-220 {
  margin-left: 13.75rem; }

.margin--right-220 {
  margin-right: 13.75rem; }

.margin--left-right-220 {
  margin-left: 13.75rem;
  margin-right: 13.75rem; }

.margin--top-bottom-220 {
  margin-top: 13.75rem;
  margin-bottom: 13.75rem; }

.padding--all-220 {
  padding: 13.75rem; }

.padding--bottom-220 {
  padding-bottom: 13.75rem; }

.padding--top-220 {
  padding-top: 13.75rem; }

.padding--left-220 {
  padding-left: 13.75rem; }

.padding--right-220 {
  padding-right: 13.75rem; }

.padding--left-right-220 {
  padding-left: 13.75rem;
  padding-right: 13.75rem; }

.padding--top-bottom-220 {
  padding-top: 13.75rem;
  padding-bottom: 13.75rem; }

.size--height-225px {
  height: 14.0625rem; }

.size--width-225px {
  width: 14.0625rem; }

.size--width-450px {
  --card-width: 28.125rem;
  width: 28.125rem; }

.margin--all-225 {
  margin: 14.0625rem; }

.margin--bottom-225 {
  margin-bottom: 14.0625rem; }

.margin--top-225 {
  margin-top: 14.0625rem; }

.margin--left-225 {
  margin-left: 14.0625rem; }

.margin--right-225 {
  margin-right: 14.0625rem; }

.margin--left-right-225 {
  margin-left: 14.0625rem;
  margin-right: 14.0625rem; }

.margin--top-bottom-225 {
  margin-top: 14.0625rem;
  margin-bottom: 14.0625rem; }

.padding--all-225 {
  padding: 14.0625rem; }

.padding--bottom-225 {
  padding-bottom: 14.0625rem; }

.padding--top-225 {
  padding-top: 14.0625rem; }

.padding--left-225 {
  padding-left: 14.0625rem; }

.padding--right-225 {
  padding-right: 14.0625rem; }

.padding--left-right-225 {
  padding-left: 14.0625rem;
  padding-right: 14.0625rem; }

.padding--top-bottom-225 {
  padding-top: 14.0625rem;
  padding-bottom: 14.0625rem; }

.size--height-230px {
  height: 14.375rem; }

.size--width-230px {
  width: 14.375rem; }

.size--width-460px {
  --card-width: 28.75rem;
  width: 28.75rem; }

.margin--all-230 {
  margin: 14.375rem; }

.margin--bottom-230 {
  margin-bottom: 14.375rem; }

.margin--top-230 {
  margin-top: 14.375rem; }

.margin--left-230 {
  margin-left: 14.375rem; }

.margin--right-230 {
  margin-right: 14.375rem; }

.margin--left-right-230 {
  margin-left: 14.375rem;
  margin-right: 14.375rem; }

.margin--top-bottom-230 {
  margin-top: 14.375rem;
  margin-bottom: 14.375rem; }

.padding--all-230 {
  padding: 14.375rem; }

.padding--bottom-230 {
  padding-bottom: 14.375rem; }

.padding--top-230 {
  padding-top: 14.375rem; }

.padding--left-230 {
  padding-left: 14.375rem; }

.padding--right-230 {
  padding-right: 14.375rem; }

.padding--left-right-230 {
  padding-left: 14.375rem;
  padding-right: 14.375rem; }

.padding--top-bottom-230 {
  padding-top: 14.375rem;
  padding-bottom: 14.375rem; }

.size--height-235px {
  height: 14.6875rem; }

.size--width-235px {
  width: 14.6875rem; }

.size--width-470px {
  --card-width: 29.375rem;
  width: 29.375rem; }

.margin--all-235 {
  margin: 14.6875rem; }

.margin--bottom-235 {
  margin-bottom: 14.6875rem; }

.margin--top-235 {
  margin-top: 14.6875rem; }

.margin--left-235 {
  margin-left: 14.6875rem; }

.margin--right-235 {
  margin-right: 14.6875rem; }

.margin--left-right-235 {
  margin-left: 14.6875rem;
  margin-right: 14.6875rem; }

.margin--top-bottom-235 {
  margin-top: 14.6875rem;
  margin-bottom: 14.6875rem; }

.padding--all-235 {
  padding: 14.6875rem; }

.padding--bottom-235 {
  padding-bottom: 14.6875rem; }

.padding--top-235 {
  padding-top: 14.6875rem; }

.padding--left-235 {
  padding-left: 14.6875rem; }

.padding--right-235 {
  padding-right: 14.6875rem; }

.padding--left-right-235 {
  padding-left: 14.6875rem;
  padding-right: 14.6875rem; }

.padding--top-bottom-235 {
  padding-top: 14.6875rem;
  padding-bottom: 14.6875rem; }

.size--height-240px {
  height: 15rem; }

.size--width-240px {
  width: 15rem; }

.size--width-480px {
  --card-width: 30rem;
  width: 30rem; }

.margin--all-240 {
  margin: 15rem; }

.margin--bottom-240 {
  margin-bottom: 15rem; }

.margin--top-240 {
  margin-top: 15rem; }

.margin--left-240 {
  margin-left: 15rem; }

.margin--right-240 {
  margin-right: 15rem; }

.margin--left-right-240 {
  margin-left: 15rem;
  margin-right: 15rem; }

.margin--top-bottom-240 {
  margin-top: 15rem;
  margin-bottom: 15rem; }

.padding--all-240 {
  padding: 15rem; }

.padding--bottom-240 {
  padding-bottom: 15rem; }

.padding--top-240 {
  padding-top: 15rem; }

.padding--left-240 {
  padding-left: 15rem; }

.padding--right-240 {
  padding-right: 15rem; }

.padding--left-right-240 {
  padding-left: 15rem;
  padding-right: 15rem; }

.padding--top-bottom-240 {
  padding-top: 15rem;
  padding-bottom: 15rem; }

.size--height-245px {
  height: 15.3125rem; }

.size--width-245px {
  width: 15.3125rem; }

.size--width-490px {
  --card-width: 30.625rem;
  width: 30.625rem; }

.margin--all-245 {
  margin: 15.3125rem; }

.margin--bottom-245 {
  margin-bottom: 15.3125rem; }

.margin--top-245 {
  margin-top: 15.3125rem; }

.margin--left-245 {
  margin-left: 15.3125rem; }

.margin--right-245 {
  margin-right: 15.3125rem; }

.margin--left-right-245 {
  margin-left: 15.3125rem;
  margin-right: 15.3125rem; }

.margin--top-bottom-245 {
  margin-top: 15.3125rem;
  margin-bottom: 15.3125rem; }

.padding--all-245 {
  padding: 15.3125rem; }

.padding--bottom-245 {
  padding-bottom: 15.3125rem; }

.padding--top-245 {
  padding-top: 15.3125rem; }

.padding--left-245 {
  padding-left: 15.3125rem; }

.padding--right-245 {
  padding-right: 15.3125rem; }

.padding--left-right-245 {
  padding-left: 15.3125rem;
  padding-right: 15.3125rem; }

.padding--top-bottom-245 {
  padding-top: 15.3125rem;
  padding-bottom: 15.3125rem; }

.size--height-250px {
  height: 15.625rem; }

.size--width-250px {
  width: 15.625rem; }

.size--width-500px {
  --card-width: 31.25rem;
  width: 31.25rem; }

.margin--all-250 {
  margin: 15.625rem; }

.margin--bottom-250 {
  margin-bottom: 15.625rem; }

.margin--top-250 {
  margin-top: 15.625rem; }

.margin--left-250 {
  margin-left: 15.625rem; }

.margin--right-250 {
  margin-right: 15.625rem; }

.margin--left-right-250 {
  margin-left: 15.625rem;
  margin-right: 15.625rem; }

.margin--top-bottom-250 {
  margin-top: 15.625rem;
  margin-bottom: 15.625rem; }

.padding--all-250 {
  padding: 15.625rem; }

.padding--bottom-250 {
  padding-bottom: 15.625rem; }

.padding--top-250 {
  padding-top: 15.625rem; }

.padding--left-250 {
  padding-left: 15.625rem; }

.padding--right-250 {
  padding-right: 15.625rem; }

.padding--left-right-250 {
  padding-left: 15.625rem;
  padding-right: 15.625rem; }

.padding--top-bottom-250 {
  padding-top: 15.625rem;
  padding-bottom: 15.625rem; }

.icon-toggle-open {
  transition: all 200ms ease-in 0s; }

[class*="button"]:hover .icon-toggle-open,
[class*="button"]:focus .icon-toggle-open {
  transform: rotate(180deg);
  transition: all 200ms ease-in 0s; }

[class*="button"]:hover .icon-toggle-close,
[class*="button"]:focus .icon-toggle-close {
  transform: rotate(90deg);
  transition: all 200ms ease-in 0s; }

/*****
 PLUGINS
 *****/
/* DATEPICKER  vue2-datepicker https://www.npmjs.com/package/vue2-datepicker */
/* Textfeld soll nur 50% an Breite bekommen | wrapper umschliesst das Textfeld und den Button */
.mx-input-wrapper {
  width: 50%; }

.mx-calendar {
  font-family: var(--font-family-base) !important;
  color: var(--font-color-base, #000) !important; }

/* Icon Kalender */
.mx-input-append {
  cursor: pointer;
  color: var(--button-default-color, #fff) !important;
  background-color: var(--button-default-bg-color, #003865) !important;
  padding: 0 !important;
  font-size: var(--default-icon-size, 1.5rem);
  display: inline-block;
  text-align: center;
  border-radius: 0 var(--default-border-radius, 0.3125rem) var(--default-border-radius, 0.3125rem) 0;
  border: var(--form-inputs-border-width, 0.0625rem) solid var(--form-inputs-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd))); }

.mx-input-append:hover {
  border-color: var(--button-default-bg-color-hover, #0077cb) !important;
  color: var(--button-default-color-hover, #fff) !important; }

.mx-datepicker-popup {
  border: 0.0625rem solid var(--date-picker-border-color, var(--form-inputs-border-color, var(--default-border-color-forms, var(--default-border-color, #cdcdcd)))) !important;
  background: var(--date-picker-bg-color, #fff) !important;
  box-shadow: 0.1875rem 0.3125rem 0.4375rem var(--date-picker-shadow, rgba(var(--default-box-shadow-color, #000), 0.3)) !important; }

/* gewaehlter Tag + hover */
.mx-calendar-content .cell:hover {
  color: var(--button-default-color, #fff) !important;
  background-color: var(--button-default-bg-color, #003865) !important; }

.mx-calendar-content .cell.actived {
  color: var(--button-default-color, #fff) !important;
  background-color: var(--button-default-bg-color, #003865) !important; }

/* Kennzeichnung 'heute' */
.mx-panel-date td.today {
  color: var(--date-picker-today-color, #000) !important;
  font-weight: var(--date-picker-today-font-weight, 500) !important;
  border-bottom: 0.0625rem solid var(--date-picker-today-border-color, #003865);
  border-top: 0.0625rem solid var(--date-picker-today-border-color, #003865);
  font-style: italic; }

/* Icon loeschen */
.mx-input-icon {
  color: var(--button-default-color, #fff) !important; }

.mx-clear-icon::before {
  font-family: 'icomoon' !important;
  content: '\e901' !important; }

/* Ausrichtung Kalendericon */
.mx-input-append .icon-calendar {
  display: flex;
  align-items: center;
  height: 100%;
  justify-content: center;
  font-size: calc(var(--default-icon-size, 1.5rem) + 0.125rem); }

@media print {
  @page {
    size: A4;
    margin-top: 0.5cm;
    margin-bottom: 0.5cm;
    margin-right: 0.5cm;
    margin-left: 0.5cm; }
  * {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    box-shadow: none !important; }
  body {
    background: #fff;
    height: 100%;
    width: auto;
    padding: 0;
    margin: 0; }
  .header,
  .header__cell,
  .main__nav,
  .layout-wrapper::after,
  .layout-wrapper::before {
    display: none; }
  .layout-wrapper {
    width: auto;
    height: 100%;
    overflow: auto; }
  .main {
    display: block;
    overflow: hidden; }
  .main__content {
    background: #fff;
    padding: 0;
    margin: 0; }
  .main {
    margin-top: 0; } }

.mx-icon-left:before, .mx-icon-right:before, .mx-icon-double-left:before, .mx-icon-double-right:before, .mx-icon-double-left:after, .mx-icon-double-right:after {
  content: "";
  position: relative;
  top: -1px;
  display: inline-block;
  width: 10px;
  height: 10px;
  vertical-align: middle;
  border-style: solid;
  border-color: currentColor;
  border-width: 2px 0 0 2px;
  border-radius: 1px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transform-origin: center;
  transform-origin: center;
  -webkit-transform: rotate(-45deg) scale(0.7);
  transform: rotate(-45deg) scale(0.7); }

.mx-icon-double-left:after {
  left: -4px; }

.mx-icon-double-right:before {
  left: 4px; }

.mx-icon-right:before, .mx-icon-double-right:before, .mx-icon-double-right:after {
  -webkit-transform: rotate(135deg) scale(0.7);
  transform: rotate(135deg) scale(0.7); }

.mx-btn {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 1;
  font-size: 14px;
  font-weight: 500;
  padding: 7px 15px;
  margin: 0;
  cursor: pointer;
  background-color: transparent;
  outline: none;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  color: #73879c;
  white-space: nowrap; }

.mx-btn:hover {
  border-color: #1284e7;
  color: #1284e7; }

.mx-btn-text {
  border: 0;
  padding: 0 4px;
  text-align: left;
  line-height: inherit; }

.mx-scrollbar {
  height: 100%; }

.mx-scrollbar:hover .mx-scrollbar-track {
  opacity: 1; }

.mx-scrollbar-wrap {
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto; }

.mx-scrollbar-track {
  position: absolute;
  top: 2px;
  right: 2px;
  bottom: 2px;
  width: 6px;
  z-index: 1;
  border-radius: 4px;
  opacity: 0;
  -webkit-transition: opacity .24s ease-out;
  transition: opacity .24s ease-out; }

.mx-scrollbar-track .mx-scrollbar-thumb {
  position: absolute;
  width: 100%;
  height: 0;
  cursor: pointer;
  border-radius: inherit;
  background-color: rgba(144, 147, 153, 0.3);
  -webkit-transition: background-color .3s;
  transition: background-color .3s; }

.mx-zoom-in-down-enter-active, .mx-zoom-in-down-leave-active {
  opacity: 1;
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
  -webkit-transition: opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  transition: opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  -webkit-transform-origin: center top;
  transform-origin: center top; }

.mx-zoom-in-down-enter, .mx-zoom-in-down-leave-to {
  opacity: 0;
  -webkit-transform: scaleY(0);
  transform: scaleY(0); }

.mx-datepicker {
  position: relative;
  display: inline-block;
  width: 210px; }

.mx-datepicker svg {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden; }

.mx-datepicker-range {
  width: 320px; }

.mx-datepicker-inline {
  width: auto; }

.mx-input-wrapper {
  position: relative; }

.mx-input-wrapper .mx-icon-clear {
  display: none; }

.mx-input-wrapper:hover .mx-icon-clear {
  display: block; }

.mx-input-wrapper:hover .mx-icon-clear + .mx-icon-calendar {
  display: none; }

.mx-input {
  display: inline-block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 34px;
  padding: 6px 30px;
  padding-left: 10px;
  font-size: 14px;
  line-height: 1.4;
  color: #555;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }

.mx-input:hover, .mx-input:focus {
  border-color: #409aff; }

.mx-input:disabled, .mx-input.disabled {
  color: #ccc;
  background-color: #f3f3f3;
  border-color: #ccc;
  cursor: not-allowed; }

.mx-input:focus {
  outline: none; }

.mx-input::-ms-clear {
  display: none; }

.mx-icon-calendar, .mx-icon-clear {
  position: absolute;
  top: 50%;
  right: 8px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 16px;
  line-height: 1;
  color: rgba(0, 0, 0, 0.5);
  vertical-align: middle; }

.mx-icon-clear {
  cursor: pointer; }

.mx-icon-clear:hover {
  color: rgba(0, 0, 0, 0.8); }

.mx-datepicker-main {
  font: 14px/1.5 "Helvetica Neue",Helvetica,Arial,"Microsoft Yahei",sans-serif;
  color: #73879c;
  background-color: #fff;
  border: 1px solid #e8e8e8; }

.mx-datepicker-popup {
  position: absolute;
  margin-top: 1px;
  margin-bottom: 1px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  z-index: 2001; }

.mx-datepicker-sidebar {
  float: left;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100px;
  padding: 6px;
  overflow: auto; }

.mx-datepicker-sidebar + .mx-datepicker-content {
  margin-left: 100px;
  border-left: 1px solid #e8e8e8; }

.mx-datepicker-body {
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

.mx-btn-shortcut {
  display: block;
  padding: 0 6px;
  line-height: 24px; }

.mx-range-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }

@media (max-width: 750px) {
  .mx-range-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column; } }

.mx-datepicker-header {
  padding: 6px 8px;
  border-bottom: 1px solid #e8e8e8; }

.mx-datepicker-footer {
  padding: 6px 8px;
  text-align: right;
  border-top: 1px solid #e8e8e8; }

.mx-calendar {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 248px;
  padding: 6px 12px; }

.mx-calendar + .mx-calendar {
  border-left: 1px solid #e8e8e8; }

.mx-calendar-header, .mx-time-header {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 34px;
  line-height: 34px;
  text-align: center;
  overflow: hidden; }

.mx-btn-icon-left, .mx-btn-icon-double-left {
  float: left; }

.mx-btn-icon-right, .mx-btn-icon-double-right {
  float: right; }

.mx-calendar-header-label {
  font-size: 14px; }

.mx-calendar-decade-separator {
  margin: 0 2px; }

.mx-calendar-decade-separator:after {
  content: "~"; }

.mx-calendar-content {
  position: relative;
  height: 224px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

.mx-calendar-content .cell {
  cursor: pointer; }

.mx-calendar-content .cell:hover {
  color: #73879c;
  background-color: #f3f9fe; }

.mx-calendar-content .cell.active {
  color: #fff;
  background-color: #1284e7; }

.mx-calendar-content .cell.in-range {
  color: #73879c;
  background-color: #dbedfb; }

.mx-calendar-content .cell.disabled {
  cursor: not-allowed;
  color: #ccc;
  background-color: #f3f3f3; }

.mx-calendar-week-mode .mx-date-row {
  cursor: pointer; }

.mx-calendar-week-mode .mx-date-row:hover {
  background-color: #f3f9fe; }

.mx-calendar-week-mode .mx-date-row.mx-active-week {
  background-color: #dbedfb; }

.mx-calendar-week-mode .mx-date-row .cell:hover {
  color: inherit;
  background-color: transparent; }

.mx-calendar-week-mode .mx-date-row .cell.active {
  color: inherit;
  background-color: transparent; }

.mx-week-number {
  opacity: .5; }

.mx-table {
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  height: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center;
  vertical-align: middle; }

.mx-table th {
  padding: 0;
  font-weight: 500; }

.mx-table td {
  padding: 0; }

.mx-table-date td, .mx-table-date th {
  height: 32px;
  font-size: 12px; }

.mx-table-date .today {
  color: #2a90e9; }

.mx-table-date .cell.not-current-month {
  color: #ccc; }

.mx-time {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  width: 224px;
  background: #fff; }

.mx-time + .mx-time {
  border-left: 1px solid #e8e8e8; }

.mx-calendar-time {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

.mx-time-header {
  border-bottom: 1px solid #e8e8e8; }

.mx-time-content {
  height: 224px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden; }

.mx-time-columns {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100%;
  overflow: hidden; }

.mx-time-column {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  position: relative;
  border-left: 1px solid #e8e8e8;
  text-align: center; }

.mx-time-column:first-child {
  border-left: 0; }

.mx-time-column .mx-time-list {
  margin: 0;
  padding: 0;
  list-style: none; }

.mx-time-column .mx-time-list::after {
  content: "";
  display: block;
  height: 192px; }

.mx-time-column .mx-time-item {
  cursor: pointer;
  font-size: 12px;
  height: 32px;
  line-height: 32px; }

.mx-time-column .mx-time-item:hover {
  color: #73879c;
  background-color: #f3f9fe; }

.mx-time-column .mx-time-item.active {
  color: #1284e7;
  background-color: transparent;
  font-weight: 700; }

.mx-time-column .mx-time-item.disabled {
  cursor: not-allowed;
  color: #ccc;
  background-color: #f3f3f3; }

.mx-time-option {
  cursor: pointer;
  padding: 8px 10px;
  font-size: 14px;
  line-height: 20px; }

.mx-time-option:hover {
  color: #73879c;
  background-color: #f3f9fe; }

.mx-time-option.active {
  color: #1284e7;
  background-color: transparent;
  font-weight: 700; }

.mx-time-option.disabled {
  cursor: not-allowed;
  color: #ccc;
  background-color: #f3f3f3; }