@charset "UTF-8";
/*
 Theme Name:     Atomic Child Theme
 Theme URI:      http://duotones.ch
 Description:    A Atomic Child Theme
 Author:         Elegant Themes
 Author URI:     http://duotones.ch
 Template:       atomic
 Version:        1.0.0
*/
/*
 * Developer : Marcel Hadorn for Duotones LLC (marcel@duotones.ch)
 * All HTML/CSS code (c)2014 Duotones LLC. all rights reserved
*/
@import 'https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400i,700,700i';
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block;
}

audio,
canvas,
video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

[hidden] {
  display: none;
}

html {
  font-size: 100%; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

html,
button,
input,
select,
textarea {
  font-family: sans-serif;
}

body {
  margin: 0;
}

a:focus {
  outline: thin dotted;
}

a:active,
a:hover {
  outline: 0;
}

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

h2 {
  font-size: 1.5em;
  margin: 0.83em 0;
}

h3 {
  font-size: 1.17em;
  margin: 1em 0;
}

h4, .module-list-disabled > div p {
  font-size: 1em;
  margin: 1.33em 0;
}

h5 {
  font-size: 0.83em;
  margin: 1.67em 0;
}

h6 {
  font-size: 0.67em;
  margin: 2.33em 0;
}

abbr[title] {
  border-bottom: 1px dotted;
}

b,
strong {
  font-weight: bold;
}

blockquote {
  margin: 1em 40px;
}

dfn {
  font-style: italic;
}

hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}

mark {
  background: #ff0;
  color: #000;
}

p,
pre {
  margin: 1em 0;
}

code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  _font-family: "courier new", monospace;
  font-size: 1em;
}

pre {
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word;
}

q {
  quotes: none;
}

q:before,
q:after {
  content: "";
  content: none;
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

dl,
menu,
ol,
ul {
  margin: 1em 0;
}

dd {
  margin: 0 0 0 40px;
}

menu,
ol,
ul {
  padding: 0 0 0 40px;
}

nav ul,
nav ol {
  list-style: none;
  list-style-image: none;
}

img {
  border: 0; /* 1 */
  -ms-interpolation-mode: bicubic; /* 2 */
}

svg:not(:root) {
  overflow: hidden;
}

figure {
  margin: 0;
}

form {
  margin: 0;
}

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

legend {
  border: 0; /* 1 */
  padding: 0;
  white-space: normal; /* 2 */
  *margin-left: -7px; /* 3 */
}

button,
input,
select,
textarea {
  font-size: 100%; /* 1 */
  margin: 0; /* 2 */
  vertical-align: baseline; /* 3 */
  *vertical-align: middle; /* 3 */
}

button,
input {
  line-height: normal;
}

button,
select {
  text-transform: none;
}

button,
html input[type=button],
input[type=reset],
input[type=submit] {
  -webkit-appearance: button; /* 2 */
  cursor: pointer; /* 3 */
  *overflow: visible; /* 4 */
}

button[disabled],
html input[disabled] {
  cursor: default;
}

input[type=checkbox],
input[type=radio] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
  *height: 13px; /* 3 */
  *width: 13px; /* 3 */
}

input[type=search] {
  -webkit-appearance: textfield; /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box; /* 2 */
  box-sizing: content-box;
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

textarea {
  overflow: auto; /* 1 */
  vertical-align: top; /* 2 */
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/*
default variables
the default variables are used to set up your basic theme styles like fonts, basc typography, colors, borders, gradients and so on… this variables are used to style all atoms, molecules and organisms.
*/
/* responsive helpers */
/* fonts */
/* typography */
/* colors */
/* theme colors */
/* alerts */
/* gray scales */
/* font colors */
/* background colors */
/* gradients */
/* border */
/* spaces */
/*
default variables
the default variables are used to set up your basic theme styles like fonts, basic typography, colors, borders, gradients and so on… this variables are used to style all atoms, molecules and organisms.
*/
/* responsive helpers */
/* fonts */
/* typography */
/* colors */
/* theme colors */
/* alerts */
/* gray scales */
/* font colors */
/* background colors */
/* gradients */
/* border */
/* spaces */
/* input elements */
/* theme measures */
@font-face {
  font-family: "fwsj-icons";
  font-style: normal;
  font-weight: normal;
  src: url("../assets/font/icons/fwsj-icons.eot");
  src: url("../assets/font/icons/fwsj-icons.eot#iefix") format("embedded-opentype"), url("../assets/font/icons/fwsj-icons.ttf") format("truetype"), url("../assets/font/icons/fwsj-icons.woff") format("woff"), url("../assets/font/icons/fwsj-icons.svg#icomoon") format("svg");
}
.fwsj-icon, .dot.checked-dot::before, .organigram-item .organigram-item-inner.overview .count::before, .scale-value::before, .chart-job-stress-index .wave-warning-icon {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "fwsj-icons" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  white-space: nowrap;
  speak: none;
  line-height: 1;
  font-feature-settings: "liga" 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

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

.icon-tips::before {
  content: "\e93e";
}

.icon-travel::before {
  content: "\e92e";
}

.icon-executive::before {
  content: "\e93f";
}

.icon-bad::before {
  content: "\e93d";
}

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

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

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

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

.icon-compare::before {
  content: "\e935";
}

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

.icon-contract::before {
  content: "\e929";
}

.icon-happy::before {
  content: "\e92a";
}

.icon-barometer::before {
  content: "\e92b";
}

.icon-filter::before {
  content: "\e92c";
}

.icon-leadership::before {
  content: "\e92d";
}

.icon-sex::before {
  content: "\e92f";
}

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

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

.icon-travel::before {
  content: "\e92e";
}

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

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

.icon-analysis-bad::before {
  content: "\e925";
}

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

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

.icon-analysis-bad-large::before {
  content: "\e93a";
}

.icon-analysis-good-large::before {
  content: "\e93b";
}

.icon-analysis-ok-large::before {
  content: "\e93c";
}

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

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

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

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

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

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

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

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

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

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

.icon-drag::before {
  content: "\e91c";
}

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

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

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

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

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

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

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

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

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

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

.icon-dots::before {
  content: "\e907";
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.icon-clock-past::before {
  content: "\e940";
}

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

.flex-grid {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  max-width: 1600px;
}
.flex-grid > div[class^=col-] {
  min-height: 50px;
}

.col-1of12 {
  width: calc(8.3333333333% - 28px);
  margin-right: 28px;
}
.col-1of12:last-child {
  margin-right: 0;
}

.col-2of12 {
  width: calc(16.6666666667% - 28px);
  margin-right: 28px;
}
.col-2of12:last-child {
  margin-right: 0;
}

.col-3of12 {
  width: calc(25% - 28px);
  margin-right: 28px;
}
.col-3of12:last-child {
  margin-right: 0;
}

.col-4of12 {
  width: calc(33.3333333333% - 28px);
  margin-right: 28px;
}
.col-4of12:last-child {
  margin-right: 0;
}

.col-5of12 {
  width: calc(41.6666666667% - 28px);
  margin-right: 28px;
}
.col-5of12:last-child {
  margin-right: 0;
}

.col-6of12 {
  width: calc(50% - 28px);
  margin-right: 28px;
}
.col-6of12:last-child {
  margin-right: 0;
}

.col-7of12 {
  width: calc(58.3333333333% - 28px);
  margin-right: 28px;
}
.col-7of12:last-child {
  margin-right: 0;
}

.col-8of12 {
  width: calc(66.6666666667% - 28px);
  margin-right: 28px;
}
.col-8of12:last-child {
  margin-right: 0;
}

.col-9of12 {
  width: calc(75% - 28px);
  margin-right: 28px;
}
.col-9of12:last-child {
  margin-right: 0;
}

.col-10of12 {
  width: calc(83.3333333333% - 28px);
  margin-right: 28px;
}
.col-10of12:last-child {
  margin-right: 0;
}

.col-11of12 {
  width: calc(91.6666666667% - 28px);
  margin-right: 28px;
}
.col-11of12:last-child {
  margin-right: 0;
}

.col-12of12 {
  width: 100%;
  margin-right: 28px;
}
.col-12of12:last-child {
  margin-right: 0;
}

html {
  box-sizing: border-box;
}

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

body {
  font-size: 1em;
  line-height: 1.5;
  color: #333333;
  -webkit-font-smoothing: antialiased;
}

.site-header .container {
  background: transparent;
}

.header-bar {
  top: 0;
  left: 0;
  z-index: 12;
  width: 100%;
  background-color: #ffffff;
}

.container {
  max-width: 2000px;
  margin-right: auto;
  margin-left: auto;
  padding: 24px;
  box-sizing: border-box;
}
.container::after {
  display: block;
  clear: both;
  content: "";
}

.half {
  width: calc(50% - 28px);
  margin-right: 28px;
}
@media screen and (max-width: 768px) {
  .half {
    width: 100%;
    margin-right: 28px;
  }
  .half:last-child {
    margin-right: 0;
  }
}
@media screen and (max-width: 500px) {
  .half {
    margin-top: 15px;
  }
}
.half:last-child {
  margin-right: 0;
}

.wide {
  width: calc(66.6666666667% - 28px);
  margin-right: 28px;
}
@media screen and (max-width: 768px) {
  .wide {
    width: 100%;
    margin-right: 28px;
  }
  .wide:last-child {
    margin-right: 0;
  }
}
@media screen and (max-width: 500px) {
  .wide {
    margin-top: 15px;
  }
}
.wide:last-child {
  margin-right: 0;
}

.narrow {
  width: calc(33.3333333333% - 28px);
  margin-right: 28px;
}
@media screen and (max-width: 680px) {
  .narrow {
    width: 100%;
    margin-right: 28px;
  }
  .narrow:last-child {
    margin-right: 0;
  }
}
@media screen and (max-width: 500px) {
  .narrow {
    margin-top: 15px;
  }
}
.narrow:last-child {
  margin-right: 0;
}

.quarter {
  width: calc(25% - 28px);
  margin-right: 28px;
}
@media screen and (max-width: 680px) {
  .quarter {
    width: calc(50% - 28px);
    margin-right: 28px;
  }
  .quarter:last-child {
    margin-right: 0;
  }
}
@media screen and (max-width: 500px) {
  .quarter {
    margin-top: 15px;
  }
}
.quarter:last-child {
  margin-right: 0;
}

.three-quarter {
  width: calc(75% - 28px);
  margin-right: 28px;
}
@media screen and (max-width: 680px) {
  .three-quarter {
    width: 100%;
    margin-right: 28px;
  }
  .three-quarter:last-child {
    margin-right: 0;
  }
}
@media screen and (max-width: 500px) {
  .three-quarter {
    margin-top: 15px;
  }
}
.three-quarter:last-child {
  margin-right: 0;
}

.clearfix::after {
  display: block;
  clear: both;
  content: "";
}

html {
  font-family: "Source Sans Pro", sans-serif;
}

.flex .flex-1of2 {
  width: 50%;
}
@media screen and (max-width: 420px) {
  .flex .flex-1of2 {
    width: 100%;
  }
}
.flex .flex-1of4 {
  width: 25%;
  flex: 1 auto;
}
@media screen and (max-width: 420px) {
  .flex .flex-1of4 {
    width: 100%;
  }
}
.flex .flex-1of3 {
  width: 33.3333333333%;
}
@media screen and (max-width: 1024px) {
  .flex .flex-1of3 {
    width: 100%;
  }
}
.flex .flex-2of3 {
  width: 66.6666666667%;
}
@media screen and (max-width: 1024px) {
  .flex .flex-2of3 {
    width: 100%;
  }
}
.flex .flex-3of4 {
  width: 75%;
}
@media screen and (max-width: 420px) {
  .flex .flex-3of4 {
    width: 100%;
  }
}
.flex .flex-1of6 {
  width: 16.6666666667%;
}
@media screen and (max-width: 420px) {
  .flex .flex-1of6 {
    width: 100%;
  }
}
.flex .flex-2of6 {
  width: 33.3333333333%;
}
@media screen and (max-width: 420px) {
  .flex .flex-2of6 {
    width: 100%;
  }
}
.flex .flex-3of6 {
  width: 50%;
}
@media screen and (max-width: 420px) {
  .flex .flex-3of6 {
    width: 100%;
  }
}
.flex .flex-5of6 {
  width: 83.3333333333%;
}
@media screen and (max-width: 420px) {
  .flex .flex-5of6 {
    width: 100%;
  }
}
@media screen and (max-width: 680px) {
  .flex .phone-landscape {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .flex .tablet-portrait {
    width: 100%;
  }
}
@media screen and (max-width: 1024px) {
  .flex .tablet-landscape {
    width: 100%;
  }
}

.flex-row {
  flex-flow: row wrap;
}

.flex {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: flex-start;
}
.flex > div {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}
@media screen and (max-width: 1024px) {
  .flex > div {
    width: 50%;
  }
}
@media screen and (max-width: 420px) {
  .flex > div {
    width: 100%;
  }
}
.flex > div[class^=col],
.flex > div[class^=tile],
.flex > div[class^=row] {
  width: calc(100% / 4);
}
.flex.reverse {
  flex-direction: row-reverse;
}
.flex .container::after {
  display: none;
}

.flex-alternate .flex:nth-of-type(even) {
  flex-direction: row-reverse;
}

.full-bg {
  justify-content: stretch;
}
.full-bg > div {
  display: flex;
  flex-direction: row;
  flex-grow: 1;
}
.full-bg > div > div {
  padding: 72px 72px 96px;
  max-width: 748px;
}
@media screen and (max-width: 768px) {
  .full-bg > div > div {
    padding: 24px 24px 48px;
  }
}
.full-bg > div:first-child {
  justify-content: flex-end;
}
.full-bg > div:last-child {
  justify-content: flex-start;
}
.full-bg a {
  display: inline-block;
  margin-top: 24px;
}

.web .container {
  max-width: 1400px;
  margin-right: auto;
  margin-left: auto;
}
.web .container::after {
  display: block;
  clear: both;
  content: "";
}
.web .container.sm, .web .tooltip-container.sm .tooltip .container.tooltip-close, .tooltip-container.sm .tooltip .web .container.tooltip-close {
  max-width: 800px;
  margin-right: auto;
  margin-left: auto;
}
.web .container.sm::after, .web .tooltip-container.sm .tooltip .container.tooltip-close::after, .tooltip-container.sm .tooltip .web .container.tooltip-close::after {
  display: block;
  clear: both;
  content: "";
}

.middle,
.flex .middle,
.grid .middle,
.grid .tile.middle {
  justify-content: center;
}

.center,
.flex .center,
.grid .center {
  align-content: center;
  align-items: center;
  text-align: center;
}
.center > *,
.flex .center > *,
.grid .center > * {
  margin-right: auto;
  margin-left: auto;
}

@media screen and (max-width: 1024px) {
  .container.flex .tile.blue, .container.flex .tooltip-container .tile.tooltip, .tooltip-container .container.flex .tile.tooltip {
    padding: 24px;
    margin: 0 -24px;
  }
}
@supports (display: grid) {
  @media screen and (min-width: 1000px), print {
    .grid {
      display: grid;
      grid-gap: 0;
      grid-template-columns: repeat(4, 1fr);
      grid-auto-rows: minmax(max-content, calc(30vh - (68px / 3))) minmax(max-content, calc(30vh - (68px / 3))) minmax(max-content, calc(40vh - (68px / 3))) minmax(max-content, calc(40vh - (68px / 3))) minmax(max-content, calc(40vh - (68px / 3))) minmax(max-content, calc(40vh - (68px / 3)));
    }
  }
  @media screen and (min-width: 1000px) and (max-width: 1331.2px) {
    .grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  @media screen and (min-width: 1000px) and (max-width: 680px) {
    .grid {
      grid-template-columns: 100vw;
    }
  }
  .grid.even-rows {
    grid-auto-rows: minmax(max-content, calc(30vh - (68px / 3)));
  }
}
.analysis .main-body {
  margin-top: 0;
  overflow-x: auto;
}

@supports (display: grid) {
  .analysis .grid {
    grid-auto-rows: minmax(max-content, max-content);
    grid-template-areas: "intro1 intro2 intro3 aside1" "scales1 scales2 scales3 aside2";
  }
  .analysis .grid .tile {
    justify-content: flex-start;
  }
  @media screen and (max-width: 1331.2px) {
    .analysis .grid {
      grid-template-columns: 1fr 1fr 1fr;
      grid-template-areas: "intro1 intro2 intro3" "scales1 scales2 scales3" "aside1 aside2 aside2";
    }
  }
  .grid.subject {
    width: 100vw;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-areas: "intro1	intro2 intro3" "scales1 scales2 scales3" "intro4 intro5 intro6" "scales4 scales5 scales6";
  }
  .grid.subject.column-count-4 {
    grid-template-columns: repeat(4, 1fr);
  }
  @media screen and (min-width: 998px) {
    .grid.subject.column-count-4 {
      width: 160vw;
    }
  }
  @media screen and (min-width: 2400px) {
    .grid.subject.column-count-4 {
      width: 80vw;
    }
  }
  .grid.subject.column-count-5 {
    grid-template-columns: repeat(5, 1fr);
  }
  @media screen and (min-width: 998px) {
    .grid.subject.column-count-5 {
      width: 200vw;
    }
  }
  @media screen and (min-width: 2400px) {
    .grid.subject.column-count-5 {
      width: 100vw;
    }
  }
  .grid.subject.column-count-6 {
    grid-template-columns: repeat(6, 1fr);
  }
  @media screen and (min-width: 998px) {
    .grid.subject.column-count-6 {
      width: 240vw;
    }
  }
  @media screen and (min-width: 2400px) {
    .grid.subject.column-count-6 {
      width: 120vw;
    }
  }
  .grid.subject.column-count-7 {
    grid-template-columns: repeat(7, 1fr);
  }
  @media screen and (min-width: 998px) {
    .grid.subject.column-count-7 {
      width: 280vw;
    }
  }
  @media screen and (min-width: 2400px) {
    .grid.subject.column-count-7 {
      width: 140vw;
    }
  }
  .grid.subject.column-count-8 {
    grid-template-columns: repeat(8, 1fr);
  }
  @media screen and (min-width: 998px) {
    .grid.subject.column-count-8 {
      width: 320vw;
    }
  }
  @media screen and (min-width: 2400px) {
    .grid.subject.column-count-8 {
      width: 160vw;
    }
  }
  .grid.subject.column-count-9 {
    grid-template-columns: repeat(9, 1fr);
  }
  @media screen and (min-width: 998px) {
    .grid.subject.column-count-9 {
      width: 360vw;
    }
  }
  @media screen and (min-width: 2400px) {
    .grid.subject.column-count-9 {
      width: 180vw;
    }
  }
  .grid.subject.column-count-10 {
    grid-template-columns: repeat(10, 1fr);
  }
  @media screen and (min-width: 998px) {
    .grid.subject.column-count-10 {
      width: 400vw;
    }
  }
  @media screen and (min-width: 2400px) {
    .grid.subject.column-count-10 {
      width: 200vw;
    }
  }
  .grid.subject.column-count-11 {
    grid-template-columns: repeat(11, 1fr);
  }
  @media screen and (min-width: 998px) {
    .grid.subject.column-count-11 {
      width: 440vw;
    }
  }
  @media screen and (min-width: 2400px) {
    .grid.subject.column-count-11 {
      width: 220vw;
    }
  }
  .grid.subject.column-count-12 {
    grid-template-columns: repeat(12, 1fr);
  }
  @media screen and (min-width: 998px) {
    .grid.subject.column-count-12 {
      width: 480vw;
    }
  }
  @media screen and (min-width: 2400px) {
    .grid.subject.column-count-12 {
      width: 240vw;
    }
  }
  .grid.subject.column-count-13 {
    grid-template-columns: repeat(13, 1fr);
  }
  @media screen and (min-width: 998px) {
    .grid.subject.column-count-13 {
      width: 520vw;
    }
  }
  @media screen and (min-width: 2400px) {
    .grid.subject.column-count-13 {
      width: 260vw;
    }
  }
  .grid.subject.column-count-14 {
    grid-template-columns: repeat(14, 1fr);
  }
  @media screen and (min-width: 998px) {
    .grid.subject.column-count-14 {
      width: 560vw;
    }
  }
  @media screen and (min-width: 2400px) {
    .grid.subject.column-count-14 {
      width: 280vw;
    }
  }
  .grid.subject.column-count-15 {
    grid-template-columns: repeat(15, 1fr);
  }
  @media screen and (min-width: 998px) {
    .grid.subject.column-count-15 {
      width: 600vw;
    }
  }
  @media screen and (min-width: 2400px) {
    .grid.subject.column-count-15 {
      width: 300vw;
    }
  }
  .grid.subject.column-count-16 {
    grid-template-columns: repeat(16, 1fr);
  }
  @media screen and (min-width: 998px) {
    .grid.subject.column-count-16 {
      width: 640vw;
    }
  }
  @media screen and (min-width: 2400px) {
    .grid.subject.column-count-16 {
      width: 320vw;
    }
  }
  .intro-1 {
    grid-area: intro1;
  }
  .scales-1 {
    grid-area: scales1;
  }
  .intro-2 {
    grid-area: intro2;
  }
  .scales-2 {
    grid-area: scales2;
  }
  .intro-3 {
    grid-area: intro3;
  }
  .scales-3 {
    grid-area: scales3;
  }
  .aside-1 {
    grid-area: aside1;
  }
  .aside-2 {
    grid-area: aside2;
  }
  .subject .tile-intro {
    grid-row-start: 1;
  }
  @media screen and (max-width: 1331.2px) and (min-width: 680px) {
    .aside-2 {
      display: flex;
    }
    .aside-2 > div {
      width: 50%;
    }
  }
}
.col-2 {
  grid-column: span 2;
}
@media screen and (max-width: 680px) {
  .col-2 {
    grid-column: span 1;
  }
}

.col-3 {
  grid-column: span 3;
}
@media screen and (max-width: 1331.2px) {
  .col-3 {
    grid-column: span 2;
  }
}
@media screen and (max-width: 680px) {
  .col-3 {
    grid-column: span 1;
  }
}

@media print {
  .print-col-3 {
    grid-column: span 3;
  }
}

.col-4 {
  grid-column: span 4;
}
@media screen and (max-width: 1331.2px) {
  .col-4 {
    grid-column: span 2;
  }
}
@media screen and (max-width: 680px) {
  .col-4 {
    grid-column: span 1;
  }
}

.row-2 {
  grid-row: span 2;
}
@media screen and (max-width: 680px) {
  .row-2 {
    grid-row: span 1;
  }
}

.grid.inactive {
  pointer-events: none;
  opacity: 0.5;
}

/**
* if you wanna use this mixin simply add it as css rule to the element of your joice.
*
*     @css rule
*     .arrow {
*          @include arrow(left, #000000, 40px, 2px, '', '', after);
*     }
*
*     @additional remarks for declarations
*     $direction = up, right, down or left / sets direction to which the arrow points
*     $color = any color value or variable
*     $size = any size in px, em etc.
*     $thickness = any size in px, em etc.
*     $top = any size in px, em, % etc. / sets the top position
*     $right = any size in px, em, % etc. / sets the right position
*     $pseudo = after or before / declares the pseudo element of your html element in which the arrow should be generated
*
*/
blockquote {
  position: relative;
  padding: 0 0 0 16px;
  margin: 24px 0 24px 24px;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 2.5em;
}
@media screen and (max-width: 768px) {
  blockquote {
    font-size: 1.5em;
  }
}
blockquote::before {
  position: absolute;
  top: 0;
  left: -40px;
  color: #dfe1e5;
  font-size: 2.5em;
  display: block;
  content: "“";
  line-height: 0.8;
}
@media screen and (max-width: 768px) {
  blockquote::before {
    left: -20px;
    font-size: 2.25em;
  }
}
blockquote .source {
  margin-top: 16px;
  display: block;
  font-size: 14px;
  color: #262626;
  content: "– " attr(cite);
}

/* three different button colors per default */
/* three different button sizes per default */
/* disabled buttons */
/* button hover darken value */
/* you will find this in /sass/_atoms/mixins/_buttons.scss */
input[type=submit],
input[type=reset],
input[type=button], .btn,
.button,
button,
p a.btn, .wysiwyg-container .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section .tinymce-mobile-mask-tap-icon::before {
  color: #ffffff;
  background-color: #0053d8;
  display: inline-block;
  padding: 11px 36px;
  margin: 0;
  margin-bottom: 16px;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 1em;
  font-weight: 600;
  line-height: 1.5em;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  border: 2px solid transparent;
  border-radius: 50px;
  outline: none;
  transition: 0.2s cubic-bezier(1, 0, 0, 1) all, 0.15s cubic-bezier(0.445, 0.05, 0.55, 0.95) transform;
  appearance: none;
  user-select: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -moz-tap-highlight-color: rgba(0, 0, 0, 0);
  tap-highlight-color: rgba(0, 0, 0, 0);
}
input[type=submit]:hover,
input[type=reset]:hover,
input[type=button]:hover, .btn:hover,
.button:hover,
button:hover, .wysiwyg-container .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section .tinymce-mobile-mask-tap-icon:hover::before {
  color: #ffffff;
  background-color: #0044b3;
}
input.disabled[type=submit],
input.disabled[type=reset],
input.disabled[type=button], .disabled.btn,
.disabled.button,
button.disabled, .wysiwyg-container .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section .disabled.tinymce-mobile-mask-tap-icon::before, input[disabled][type=submit],
input[disabled][type=reset],
input[disabled][type=button], [disabled].btn,
[disabled].button,
button[disabled], .wysiwyg-container .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section [disabled].tinymce-mobile-mask-tap-icon::before {
  cursor: default;
  background-color: #c0c7d1;
}
input[type=submit]:active,
input[type=reset]:active,
input[type=button]:active, .btn:active,
.button:active,
button:active, .wysiwyg-container .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section .tinymce-mobile-mask-tap-icon:active::before {
  transform: scale(0.98);
}

.btn.outline,
.button.outline,
button.outline,
p a.btn.outline {
  color: #0053d8;
  background-color: transparent;
  border-color: #0053d8;
}
.btn.outline:hover,
.button.outline:hover,
button.outline:hover {
  color: #ffffff;
  background-color: #0053d8;
}
.disabled.btn.outline,
.disabled.button.outline,
button.disabled.outline, [disabled].btn.outline,
[disabled].button.outline,
button[disabled].outline {
  color: #c0c7d1;
  border-color: #c0c7d1;
}
.disabled.btn.outline:hover,
.disabled.button.outline:hover,
button.disabled.outline:hover, [disabled].btn.outline:hover,
[disabled].button.outline:hover,
button[disabled].outline:hover {
  background: transparent;
}

.btn.outline.negative,
.button.outline.negative,
button.outline.negative,
p a.btn.outline.negative {
  color: #ffffff;
  background-color: transparent;
  border-color: #ffffff;
}
.btn.outline.negative:hover,
.button.outline.negative:hover,
button.outline.negative:hover {
  color: #0053d8;
  background-color: #ffffff;
}
.disabled.btn.outline.negative,
.disabled.button.outline.negative,
button.disabled.outline.negative, [disabled].btn.outline.negative,
[disabled].button.outline.negative,
button[disabled].outline.negative {
  color: #c0c7d1;
  border-color: #c0c7d1;
}
.disabled.btn.outline.negative:hover,
.disabled.button.outline.negative:hover,
button.disabled.outline.negative:hover, [disabled].btn.outline.negative:hover,
[disabled].button.outline.negative:hover,
button[disabled].outline.negative:hover {
  background: transparent;
}

.btn.ghost,
.button.ghost,
button.ghost,
p a.btn.ghost {
  color: #0053d8;
  background-color: transparent;
  border-color: transparent;
}
.btn.ghost:hover,
.button.ghost:hover,
button.ghost:hover {
  background-color: rgba(223, 225, 229, 0.5);
}

.btn.icontext,
.button.icontext,
button.icontext,
p a.btn.icontext {
  display: inline-flex;
  align-items: center;
  background-color: transparent;
}
.btn.icontext i,
.button.icontext i,
button.icontext i {
  margin-right: 0.4em;
  font-size: 20px;
}
.disabled.btn.icontext,
.disabled.button.icontext,
button.disabled.icontext, [disabled].btn.icontext,
[disabled].button.icontext,
button[disabled].icontext {
  color: #95a0af;
}
.dark.btn.icontext,
.dark.button.icontext,
button.dark.icontext {
  color: #0053d8;
}
.dark.disabled.btn.icontext,
.dark.disabled.button.icontext,
button.dark.disabled.icontext, .dark[disabled].btn.icontext,
.dark[disabled].button.icontext,
button.dark[disabled].icontext {
  color: #c0c7d1;
}

.btn.warning,
.button.warning,
button.warning,
p a.btn.warning {
  color: #9a9a9a;
}
.btn.warning:hover,
.button.warning:hover,
button.warning:hover {
  color: #ff5d41;
}

.btn.sm, .tooltip-container.sm .tooltip .btn.tooltip-close,
.button.sm,
.tooltip-container.sm .tooltip .button.tooltip-close,
button.sm,
.tooltip-container.sm .tooltip button.tooltip-close,
p a.btn.sm {
  width: auto;
  padding: 0.5em 1em 0.5em 1em;
  margin: 0;
  font-size: 1rem;
}
.btn.sm i, .tooltip-container.sm .tooltip .btn.tooltip-close i,
.button.sm i,
.tooltip-container.sm .tooltip .button.tooltip-close i,
button.sm i,
.tooltip-container.sm .tooltip button.tooltip-close i {
  margin: 0;
}

.btn.xs, .footer-edit-action-items a.btn,
.button.xs,
.footer-edit-action-items a.button,
button.xs,
p a.btn.xs {
  width: auto;
  padding: 0.5em 1em 0.5em 1em;
  margin: 0;
  font-size: 0.8rem;
}

.btn.lg,
.button.lg,
button.lg,
p a.btn.lg {
  padding: 0.4615384615em 1em;
  font-size: 1.5em;
}

.btn.icon,
.button.icon,
button.icon,
p a.btn.icon {
  width: 50px;
  padding-right: 0;
  padding-left: 0;
  font-size: 1.5em;
  line-height: 0.7;
  text-align: center;
}
.btn.icon > *,
.button.icon > *,
button.icon > * {
  padding: 0;
  font-size: inherit;
}
.sm.btn.icon,
.sm.button.icon,
button.sm.icon, .tooltip-container.sm .tooltip .tooltip-close.btn.icon,
.tooltip-container.sm .tooltip .tooltip-close.button.icon,
.tooltip-container.sm .tooltip button.tooltip-close.icon {
  width: calc(2em + 4px);
  font-size: 1rem;
}
.xs.btn.icon,
.xs.button.icon,
button.xs.icon, .footer-edit-action-items a.btn.icon,
.footer-edit-action-items a.button.icon {
  width: calc(2em + 4px);
  font-size: 0.8rem;
}
.tooltip.btn.icon,
.tooltip.button.icon,
button.tooltip.icon {
  width: 20px;
  height: 20px;
  padding: 0;
  margin: 0;
  margin-left: 0.5em;
  font-size: 0.7rem;
  font-weight: bold;
  line-height: 1;
  color: #ffffff;
  vertical-align: 30%;
  background: rgba(0, 83, 216, 0.9);
}
.tooltip.btn.icon .fwsj-icon, .tooltip.btn.icon .dot.checked-dot::before,
.tooltip.button.icon .fwsj-icon,
.tooltip.button.icon .dot.checked-dot::before,
button.tooltip.icon .fwsj-icon,
button.tooltip.icon .dot.checked-dot::before, .tooltip.btn.icon .organigram-item .organigram-item-inner.overview .count::before,
.tooltip.button.icon .organigram-item .organigram-item-inner.overview .count::before,
button.tooltip.icon .organigram-item .organigram-item-inner.overview .count::before, .organigram-item .organigram-item-inner.overview .tooltip.btn.icon .count::before,
.organigram-item .organigram-item-inner.overview .tooltip.button.icon .count::before,
.organigram-item .organigram-item-inner.overview button.tooltip.icon .count::before, .tooltip.btn.icon .scale-value::before,
.tooltip.button.icon .scale-value::before,
button.tooltip.icon .scale-value::before, .tooltip.btn.icon .chart-job-stress-index .wave-warning-icon,
.tooltip.button.icon .chart-job-stress-index .wave-warning-icon,
button.tooltip.icon .chart-job-stress-index .wave-warning-icon, .chart-job-stress-index .tooltip.btn.icon .wave-warning-icon,
.chart-job-stress-index .tooltip.button.icon .wave-warning-icon,
.chart-job-stress-index button.tooltip.icon .wave-warning-icon {
  color: inherit;
  vertical-align: sub;
}
.tooltip.btn.icon:hover,
.tooltip.button.icon:hover,
button.tooltip.icon:hover {
  background: #0053d8;
  color: #ffffff;
}
.tooltip.btn.icon:hover .fwsj-icon, .tooltip.btn.icon:hover .dot.checked-dot::before,
.tooltip.button.icon:hover .fwsj-icon,
.tooltip.button.icon:hover .dot.checked-dot::before,
button.tooltip.icon:hover .fwsj-icon,
button.tooltip.icon:hover .dot.checked-dot::before, .tooltip.btn.icon:hover .organigram-item .organigram-item-inner.overview .count::before,
.tooltip.button.icon:hover .organigram-item .organigram-item-inner.overview .count::before,
button.tooltip.icon:hover .organigram-item .organigram-item-inner.overview .count::before, .organigram-item .organigram-item-inner.overview .tooltip.btn.icon:hover .count::before,
.organigram-item .organigram-item-inner.overview .tooltip.button.icon:hover .count::before,
.organigram-item .organigram-item-inner.overview button.tooltip.icon:hover .count::before, .tooltip.btn.icon:hover .scale-value::before,
.tooltip.button.icon:hover .scale-value::before,
button.tooltip.icon:hover .scale-value::before, .tooltip.btn.icon:hover .chart-job-stress-index .wave-warning-icon,
.tooltip.button.icon:hover .chart-job-stress-index .wave-warning-icon,
button.tooltip.icon:hover .chart-job-stress-index .wave-warning-icon, .chart-job-stress-index .tooltip.btn.icon:hover .wave-warning-icon,
.chart-job-stress-index .tooltip.button.icon:hover .wave-warning-icon,
.chart-job-stress-index button.tooltip.icon:hover .wave-warning-icon {
  color: inherit;
}
@media print {
  .tooltip.btn.icon,
  .tooltip.button.icon,
  button.tooltip.icon {
    display: none !important;
  }
}

.btn.nav-back:before,
.button.nav-back:before,
button.nav-back:before {
  transform: rotate(135deg);
  position: absolute;
  top: 8px;
  right: calc(100% - 14px);
  width: 8px;
  height: 8px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: currentColor;
  content: "";
}
.btn.nav-back::before,
.button.nav-back::before,
button.nav-back::before {
  position: relative;
  top: 0;
  left: 0;
  display: inline-block;
  margin-right: 8px;
}

.toggle,
.button-toggle {
  position: relative;
  display: inline-block;
}
.toggle > *,
.button-toggle > * {
  padding-top: calc((68px - 32px) / 2);
  font-size: 32px;
}
.toggle > *:nth-child(1),
.button-toggle > *:nth-child(1) {
  display: inline-block;
}
.toggle > *:nth-child(2),
.button-toggle > *:nth-child(2) {
  display: none;
}
.toggle.active > *:nth-child(1),
.button-toggle.active > *:nth-child(1) {
  display: none;
}
.toggle.active > *:nth-child(2),
.button-toggle.active > *:nth-child(2) {
  display: inline-block;
}

code, p code,
p pre {
  padding: 0 8px;
  font-family: "Lucida Console", Monaco, monospace;
  font-size: 0.875em;
  background-color: #e4ebef;
  border-radius: 2px;
}

.dot::before, .tooltip-dot::before {
  position: absolute;
  z-index: 9;
  display: block;
  width: 30px;
  height: 30px;
  cursor: pointer;
  border: 4px solid #dfe1e5;
  border-radius: 100%;
  content: "";
}

.dot.sm::before, .tooltip-container.sm .tooltip .dot.tooltip-close::before, .tooltip-dot::before, .process-status.sm ul .dot::before, .tooltip-container.sm .tooltip .process-status.tooltip-close ul .dot::before {
  width: 16px;
  height: 16px;
  border-width: 3px;
}

.dot.xs::before, .footer-edit-action-items a.dot::before {
  width: 7px;
  height: 7px;
  border-width: 1px;
}

.blue .dot::before, .tooltip-container .tooltip .dot::before {
  border-width: 5px;
}

.blue .dot.sm::before, .tooltip-container .tooltip .dot.sm::before, .tooltip-container.sm .tooltip .dot.tooltip-close::before, .blue .process-status.sm .dot::before, .tooltip-container .tooltip .process-status.sm .dot::before, .blue .tooltip-container.sm .tooltip .process-status.tooltip-close .dot::before, .tooltip-container .tooltip .tooltip-container.sm .tooltip .process-status.tooltip-close .dot::before, .tooltip-container.sm .tooltip .blue .process-status.tooltip-close .dot::before, .tooltip-container.sm .tooltip .tooltip .process-status.tooltip-close .dot::before {
  border-width: 4px;
}

.dot.pulse::before, .tooltip-dot::before {
  background-color: rgba(223, 225, 229, 0.1);
  border-color: #00c2df;
  animation: pulse2 2s infinite;
}

@keyframes pulse2 {
  0% {
    background-color: rgba(0, 194, 223, 0.1);
    box-shadow: 0 0 0 0 rgba(0, 194, 223, 0.6);
  }
  70% {
    background-color: rgba(0, 194, 223, 0.25);
    box-shadow: 0 0 0 10px rgba(0, 194, 223, 0);
  }
  100% {
    background-color: rgba(0, 194, 223, 0.1);
    box-shadow: 0 0 0 0 rgba(0, 194, 223, 0);
  }
}
dl {
  margin: 0 0 0.75em 0;
  font-family: "Source Sans Pro", sans-serif;
}
dl dt {
  margin: 0.75em 0 0 0;
  font-weight: bold;
}
dl dd {
  margin: 0;
}

figure {
  padding: 8px;
  margin-bottom: 8px;
  background-color: #ffffff;
  border: none;
}
figure figcaption {
  margin-top: 8px;
  margin-bottom: 0;
  line-height: 1.5em;
}
@media (max-width: 500px) {
  figure figcaption {
    font-size: 0.75em;
  }
}
@media (max-width: 768px) {
  figure {
    text-align: center;
  }
}
figure img {
  display: block;
  margin: 0 auto;
}

/*//body.tabbing *:focus::after {
//	content: '';
//	position: relative;
//	width: 100%;
//	box-shadow: 0 0 0 5px transparent, 0 0 10px 5px $secondary;
//	border-radius: $border-radius*2;
//}*/
#flying-focus {
  position: absolute;
  margin: 0;
  background: transparent;
  -webkit-transition-property: left, top, width, height;
  transition-property: left, top, width, height;
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
  visibility: hidden;
  pointer-events: none;
}

#flying-focus {
  box-shadow: 0 0 2px 3px #FBBC00, 0 0 2px #FBBC00 inset;
  border-radius: 4px;
}

#flying-focus.flying-focus_visible {
  visibility: visible;
  z-index: 9999;
}

.flying-focus_target {
  outline: none !important; /* Doesn't work in Firefox :( */
}

/* http://stackoverflow.com/questions/71074/how-to-remove-firefoxs-dotted-outline-on-buttons-as-well-as-links/199319 */
.flying-focus_target::-moz-focus-inner {
  border: 0 !important;
}

/* Replace it with @supports rule when browsers catch up */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  #flying-focus {
    box-shadow: none;
    outline: 4px auto #FBBC00;
    outline-offset: 4px;
  }
}
.hamburger {
  position: fixed;
  top: 28px;
  right: 16px;
  z-index: 10;
  padding: 16px;
  cursor: pointer;
  transition: 0.5s all cubic-bezier(0.86, 0, 0.07, 1);
}
.hamburger .bar {
  display: block;
  width: 26px;
  height: 2px;
  margin-bottom: 5px;
  background-color: #333333;
  transition: 0.5s all cubic-bezier(0.86, 0, 0.07, 1);
}
.hamburger .bar:last-child {
  margin-bottom: 0;
}
.in.hamburger {
  right: 8px;
}
.in.hamburger .bar {
  background-color: #333333;
}
.in.hamburger .bar:nth-child(1) {
  transform: rotateZ(45deg) translateY(-2.5px);
  transform-origin: left top;
}
.in.hamburger .bar:nth-child(2) {
  width: 2px;
  transform: rotateZ(0deg) translateX(9px);
  transform-origin: center right;
}
.in.hamburger .bar:nth-child(3) {
  transform: rotateZ(-45deg) translateY(2.5px);
  transform-origin: left bottom;
}
@media screen and (min-width: 1025px) {
  .hamburger {
    display: none;
  }
}

/* for px value (value, 'px'), for em value (value, 'em') */
/* for px value (value, 'px'), for em value (value, 'em') */
/* for px value (value, 'px'), for em value (value, 'em') */
/* for px value (value, 'px'), for em value (value, 'em') */
/* for px value (value, 'px'), for em value (value, 'em') */
/* for px value (value, 'px'), for em value (value, 'em') */
h1,
h2,
h3,
h4,
.module-list-disabled > div p,
h5,
h6, .process-status .count {
  margin: 16px 0 8px;
  font-family: "Source Sans Pro", sans-serif;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
  color: #333333;
  text-rendering: optimizeLegibility;
  text-transform: normal;
}

h1 {
  font-size: 2.5em;
}
@media screen and (max-width: 768px) {
  h1 {
    font-size: 2em;
  }
}

h2 {
  font-size: 2em;
}
@media screen and (max-width: 768px) {
  h2 {
    font-size: 1.75em;
  }
}
h2.lg {
  font-size: 3em;
}
@media screen and (max-width: 768px) {
  h2.lg {
    font-size: 1.75em;
  }
}
h2.md {
  font-size: 2.25em;
}
@media screen and (max-width: 768px) {
  h2.md {
    font-size: 1.75em;
  }
}
h2.lg, h2.md {
  line-height: 1.25;
}

h3 {
  font-size: 1.75em;
  line-height: 1.2;
  color: #484848;
}
@media screen and (max-width: 768px) {
  h3 {
    font-size: 28px;
  }
}

h4, .module-list-disabled > div p {
  font-weight: 400;
  font-size: 1.5em;
}

h5 {
  font-size: 1.25em;
  text-transform: uppercase;
}

h6 {
  font-size: 1em;
}

.hide-text {
  overflow: hidden;
  text-indent: 101%;
  white-space: nowrap;
}

hr {
  margin: 1.5em 0;
  border-top: 0;
  border-right: 0;
  border-bottom: 2px solid rgba(0, 83, 216, 0.2);
  border-left: 0;
}

img {
  width: 100%;
  height: auto;
  max-width: 100%;
  margin: 0;
}

img.centered, .tile img.background,
.flex .tile img.background {
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  min-width: 100%;
  min-height: 100%;
  transform: translate(-50%, -50%);
}

img.sm, .tooltip-container.sm .tooltip img.tooltip-close {
  width: 35px;
}

img.md {
  width: 75px;
}

img.lg {
  width: 150px;
}

img.xl {
  width: 300px;
}

/**
*     @additional information
*     all inputs are basically extended with %input and all text inputs with %input and %focus
*     checkbox, fileupload, radiobutton, submit, search and select have own atom setups
*/
input[type=date]:focus,
input[type=datetime]:focus,
input[type=datetime-local]:focus,
input[type=email]:focus,
input[type=month]:focus,
input[type=number]:focus,
input[type=password]:focus,
input[type=search]:focus,
input[type=tel]:focus,
input[type=text]:focus,
input[type=time]:focus,
input[type=url]:focus,
input[type=week]:focus {
  color: #333333;
  border-color: #0053d8;
}
input[type=date]:focus::placeholder,
input[type=datetime]:focus::placeholder,
input[type=datetime-local]:focus::placeholder,
input[type=email]:focus::placeholder,
input[type=month]:focus::placeholder,
input[type=number]:focus::placeholder,
input[type=password]:focus::placeholder,
input[type=search]:focus::placeholder,
input[type=tel]:focus::placeholder,
input[type=text]:focus::placeholder,
input[type=time]:focus::placeholder,
input[type=url]:focus::placeholder,
input[type=week]:focus::placeholder {
  text-overflow: ellipsis !important;
}

input[type=date],
input[type=datetime],
input[type=datetime-local],
input[type=email],
input[type=month],
input[type=number],
input[type=password],
input[type=search],
input[type=tel],
input[type=text],
input[type=time],
input[type=url],
input[type=week] {
  display: block;
  width: 100%;
  padding: 16px 2px;
  margin: 0 8px 4px 0;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 1.375rem;
  line-height: 1.5em;
  color: #333333;
  text-overflow: ellipsis;
  background-color: rgba(0, 83, 216, 0);
  border: 0;
  border-bottom: 2px solid #dfe1e5;
  border-radius: 0;
  outline: none;
  box-shadow: none;
  box-sizing: border-box;
  appearance: none;
  -webkit-appearance: none;
  caret-color: #0053d8;
}
input[type=date]::-webkit-inner-spin-button,
input[type=datetime]::-webkit-inner-spin-button,
input[type=datetime-local]::-webkit-inner-spin-button,
input[type=email]::-webkit-inner-spin-button,
input[type=month]::-webkit-inner-spin-button,
input[type=number]::-webkit-inner-spin-button,
input[type=password]::-webkit-inner-spin-button,
input[type=search]::-webkit-inner-spin-button,
input[type=tel]::-webkit-inner-spin-button,
input[type=text]::-webkit-inner-spin-button,
input[type=time]::-webkit-inner-spin-button,
input[type=url]::-webkit-inner-spin-button,
input[type=week]::-webkit-inner-spin-button, input[type=date]::-webkit-outer-spin-button,
input[type=datetime]::-webkit-outer-spin-button,
input[type=datetime-local]::-webkit-outer-spin-button,
input[type=email]::-webkit-outer-spin-button,
input[type=month]::-webkit-outer-spin-button,
input[type=number]::-webkit-outer-spin-button,
input[type=password]::-webkit-outer-spin-button,
input[type=search]::-webkit-outer-spin-button,
input[type=tel]::-webkit-outer-spin-button,
input[type=text]::-webkit-outer-spin-button,
input[type=time]::-webkit-outer-spin-button,
input[type=url]::-webkit-outer-spin-button,
input[type=week]::-webkit-outer-spin-button {
  margin: 0;
  -webkit-appearance: none;
}
input.sm[type=date],
input.sm[type=datetime],
input.sm[type=datetime-local],
input.sm[type=email],
input.sm[type=month],
input.sm[type=number],
input.sm[type=password],
input.sm[type=search],
input.sm[type=tel],
input.sm[type=text],
input.sm[type=time],
input.sm[type=url],
input.sm[type=week], .tooltip-container.sm .tooltip input.tooltip-close[type=date],
.tooltip-container.sm .tooltip input.tooltip-close[type=datetime],
.tooltip-container.sm .tooltip input.tooltip-close[type=datetime-local],
.tooltip-container.sm .tooltip input.tooltip-close[type=email],
.tooltip-container.sm .tooltip input.tooltip-close[type=month],
.tooltip-container.sm .tooltip input.tooltip-close[type=number],
.tooltip-container.sm .tooltip input.tooltip-close[type=password],
.tooltip-container.sm .tooltip input.tooltip-close[type=search],
.tooltip-container.sm .tooltip input.tooltip-close[type=tel],
.tooltip-container.sm .tooltip input.tooltip-close[type=text],
.tooltip-container.sm .tooltip input.tooltip-close[type=time],
.tooltip-container.sm .tooltip input.tooltip-close[type=url],
.tooltip-container.sm .tooltip input.tooltip-close[type=week] {
  padding: 5px 2px;
  font-size: 1rem;
}
input[type=date]::placeholder,
input[type=datetime]::placeholder,
input[type=datetime-local]::placeholder,
input[type=email]::placeholder,
input[type=month]::placeholder,
input[type=number]::placeholder,
input[type=password]::placeholder,
input[type=search]::placeholder,
input[type=tel]::placeholder,
input[type=text]::placeholder,
input[type=time]::placeholder,
input[type=url]::placeholder,
input[type=week]::placeholder {
  color: #9a9a9a;
}
input[type=date]:disabled,
input[type=datetime]:disabled,
input[type=datetime-local]:disabled,
input[type=email]:disabled,
input[type=month]:disabled,
input[type=number]:disabled,
input[type=password]:disabled,
input[type=search]:disabled,
input[type=tel]:disabled,
input[type=text]:disabled,
input[type=time]:disabled,
input[type=url]:disabled,
input[type=week]:disabled {
  color: #777777;
}

/**
*     @additional information
*     all inputs are basically extended with %input and all text inputs with %input and %focus
*     checkbox, fileupload, radiobutton, submit, search and select have own atom setups
*/
label.password {
  position: relative;
}
label.password span.pass-visibility {
  position: absolute;
  right: 8px;
  margin-top: -57px;
}
label.password span.pass-visibility .fwsj-icon, label.password span.pass-visibility .dot.checked-dot::before, label.password span.pass-visibility .organigram-item .organigram-item-inner.overview .count::before, .organigram-item .organigram-item-inner.overview label.password span.pass-visibility .count::before, label.password span.pass-visibility .scale-value::before, label.password span.pass-visibility .chart-job-stress-index .wave-warning-icon, .chart-job-stress-index label.password span.pass-visibility .wave-warning-icon {
  font-size: 0.8em;
  color: #95a0af;
}
label.password span.pass-visibility:hover {
  cursor: pointer;
}

input[type=password] {
  letter-spacing: 6px;
}
input[type=password]::placeholder {
  font-family: "Source Sans Pro", sans-serif;
  font-size: 1.375rem;
  font-weight: 200;
  line-height: 1.2;
  letter-spacing: 0;
}
input[type=password]::-ms-reveal, input[type=password]::-ms-clear {
  display: none;
}

label.suffix input {
  display: inline-block;
  width: 50px;
  padding-top: 8px;
  padding-right: 8px;
  padding-bottom: 8px;
  margin-bottom: 16px;
  text-align: right;
}
label.suffix input[maxlength="1"] {
  width: 30px;
}
label.suffix input[maxlength="2"] {
  width: 40px;
}
label.suffix input[maxlength="3"] {
  width: 50px;
}
label.suffix input[maxlength="4"] {
  width: 60px;
}
label.suffix input[maxlength="5"] {
  width: 70px;
}
label.suffix input[maxlength="6"] {
  width: 80px;
}

/**
*     @additional information
*     all inputs are basically extended with the input atom and are the base for %input-checkbox
*/
input[type=checkbox] {
  display: inline-block;
  width: 24px;
  margin: 0 0.375em 0 0;
  cursor: pointer;
  outline: none;
}

label.checkbox {
  position: relative;
  display: block;
  padding-left: 5px;
  margin-bottom: 0.75em;
  font-size: 1.125em;
  font-weight: normal;
  text-indent: 2.3em;
  cursor: pointer;
}
label[disabled].checkbox {
  cursor: default;
}
label[disabled].checkbox:hover {
  text-decoration: none;
}
label.checkbox:hover input[type=checkbox]::before {
  color: #0053d8;
  background-color: #ffffff;
  border-color: #0053d8;
}
label.checkbox input[type=checkbox] {
  position: absolute;
  top: 3px;
  left: -1px;
  display: block;
  float: left;
  width: 24px;
  height: 24px;
  line-height: 1.5em;
  border: none;
  appearance: none;
}
label.checkbox input[type=checkbox]::before {
  position: absolute;
  top: 0;
  left: 1px;
  width: 100%;
  height: 100%;
  padding-left: 1px;
  margin-left: 1px;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.55em;
  color: #0053d8;
  text-align: center;
  pointer-events: none;
  background-color: rgba(0, 83, 216, 0);
  border: 2px solid #dfe1e5;
  border-color: rgba(149, 160, 175, 0.8);
  border-radius: 2px;
  content: attr(data-key);
  box-shadow: 0;
  box-sizing: border-box;
  transition: all 0.15s cubic-bezier(0.445, 0.05, 0.55, 0.95);
}
label.checkbox input[type=checkbox]::after {
  position: absolute;
  top: 54%;
  left: 57%;
  width: 11px;
  height: 5px;
  background: transparent;
  border: 2px solid #ffffff;
  border-top: 0;
  border-right: 0;
  content: "";
  opacity: 0;
  transform: rotate(-45deg) scale(0.55) translateX(-35%) translateY(-65%);
  transition: all 0.15s cubic-bezier(0.445, 0.05, 0.55, 0.95);
  transform-origin: 0% 0%;
}
label.checkbox input[type=checkbox]:checked::before {
  color: rgba(0, 83, 216, 0);
  background-color: #0053d8;
  border-color: #0053d8;
  content: "";
}
label.checkbox input[type=checkbox]:checked::after {
  opacity: 1;
  transform: rotate(-45deg) scale(1) translateX(-35%) translateY(-65%);
  transform-origin: 0% 0%;
}
label.checkbox input[type=checkbox]:checked:disabled::before {
  background-color: #c0c7d1;
  border-color: #c0c7d1;
}
label.checkbox input[type=checkbox]:disabled::before {
  background-color: rgba(223, 225, 229, 0.5);
  border-color: #dfe1e5;
}
label.checkbox .checkbox-paragraph {
  margin-left: 40px;
  text-indent: 0;
}

.org-profile label.checkbox {
  margin-bottom: 48px;
}

.radio-check label.button-checkbox,
.radio-check label.button-checkbox.sm,
.radio-check .tooltip-container.sm .tooltip label.button-checkbox.tooltip-close,
.tooltip-container.sm .tooltip .radio-check label.button-checkbox.tooltip-close {
  padding: 20px 20px 20px 46px;
  margin-bottom: 0;
  text-decoration: none;
  text-indent: 0;
  border-radius: 4px;
}
.radio-check label.button-checkbox:hover,
.radio-check label.button-checkbox.sm:hover,
.radio-check .tooltip-container.sm .tooltip label.button-checkbox.tooltip-close:hover,
.tooltip-container.sm .tooltip .radio-check label.button-checkbox.tooltip-close:hover {
  text-decoration: none;
  background: rgba(154, 154, 154, 0.1);
}
.radio-check label.button-checkbox input[type=checkbox],
.radio-check label.button-checkbox.sm input[type=checkbox],
.radio-check .tooltip-container.sm .tooltip label.button-checkbox.tooltip-close input[type=checkbox],
.tooltip-container.sm .tooltip .radio-check label.button-checkbox.tooltip-close input[type=checkbox] {
  top: 26px;
  left: 18px;
  width: 14px;
  height: 14px;
}

.error-message {
  display: none;
  margin-top: 0;
  font-size: 1rem;
  font-weight: 700;
  color: #ff5d41;
}

.error textarea,
.error label,
.error input {
  color: #ff5d41;
  border-color: #ff5d41;
}
.error textarea:focus,
.error label:focus,
.error input:focus {
  color: #ff5d41;
  border-color: #ff5d41;
}
.error span.error-message {
  display: block;
}
.error.suffix input {
  margin-bottom: 0;
}

label.error {
  color: #ff5d41;
}

/**
*     @additional information
*     all inputs are basically extended with the input atom and are the base for %input-radio
*/
input[type=radio] {
  display: inline;
  width: 24px;
  margin: 0 0.375em 0 0;
  cursor: pointer;
  outline: none;
}
input[type=radio]:disabled {
  cursor: default;
}

label.radio {
  position: relative;
  display: block;
  padding-left: 34px;
  margin-bottom: 0.75em;
  font-size: 1.125em;
  font-weight: normal;
  text-indent: 0;
  cursor: pointer;
}
label[disabled].radio {
  cursor: default;
}
label[disabled].radio:hover {
  text-decoration: none;
}
label.radio:hover {
  text-decoration: underline;
}
label.radio:hover input[type=radio]:not([disabled])::before {
  color: #0053d8;
  background-color: #ffffff;
  border-color: #0053d8;
}
label.radio input[type=radio] {
  position: absolute;
  top: 1px;
  left: 0;
  display: block;
  float: left;
  width: 24px;
  height: 24px;
  line-height: 1.5em;
  border: 0;
  appearance: none;
}
label.radio input[type=radio]::-ms-check {
  color: #0053d8;
  border-color: #dfe1e5;
  border-width: 2px;
}
label.radio input[type=radio]::before {
  position: absolute;
  width: 100%;
  height: 100%;
  padding-left: 1px;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.55em;
  color: #0053d8;
  text-align: center;
  pointer-events: none;
  background-color: rgba(0, 83, 216, 0);
  border: 2px solid #dfe1e5;
  border-color: rgba(149, 160, 175, 0.8);
  border-radius: 2px;
  content: attr(data-key);
  box-shadow: 0;
  box-sizing: border-box;
  transition: all 0.15s cubic-bezier(0.445, 0.05, 0.55, 0.95);
}
label.radio input[type=radio]:disabled::before {
  color: #95a0af;
  background-color: rgba(223, 225, 229, 0.5);
  border-color: #dfe1e5;
}
label.radio input[type=radio]:checked::-ms-check {
  border-color: #0053d8;
}
label.radio input[type=radio]:checked::before {
  color: #ffffff;
  background-color: #0053d8;
  border-color: #0053d8;
}
label.radio input[type=radio]:checked:disabled::before {
  background-color: #c0c7d1;
  border-color: #c0c7d1;
}

.radio-check label:not(.radio) {
  margin-bottom: 1em;
}

.radio-check label input[type=radio]::before {
  border-radius: 50%;
}
.radio-check label input[type=radio]:checked::before {
  background: #ffffff;
  border-color: #0053d8;
}
.radio-check label input[type=radio]:checked::after {
  position: absolute;
  display: block;
  width: calc(100% - 12px);
  height: calc(100% - 12px);
  margin: 6px;
  background: #0053d8;
  border-radius: 50%;
  content: "";
}
.radio-check label input[type=radio]:checked:disabled::before {
  background: #ffffff;
}
.radio-check label input[type=radio]:checked:disabled::after {
  background: #c0c7d1;
}

.radio-check label.sm, .radio-check .tooltip-container.sm .tooltip label.tooltip-close, .tooltip-container.sm .tooltip .radio-check label.tooltip-close {
  padding-left: 26px;
  font-size: 16px;
  font-weight: 700;
  text-indent: 0;
}
.radio-check label.sm img, .radio-check .tooltip-container.sm .tooltip label.tooltip-close img, .tooltip-container.sm .tooltip .radio-check label.tooltip-close img {
  display: block;
  width: 100%;
  margin-top: 10px;
}
.radio-check label.sm input[type=radio], .radio-check .tooltip-container.sm .tooltip label.tooltip-close input[type=radio], .tooltip-container.sm .tooltip .radio-check label.tooltip-close input[type=radio] {
  top: 6px;
  left: 0;
  width: 14px;
  height: 14px;
}
.radio-check label.sm input[type=radio]:checked::before, .radio-check .tooltip-container.sm .tooltip label.tooltip-close input[type=radio]:checked::before, .tooltip-container.sm .tooltip .radio-check label.tooltip-close input[type=radio]:checked::before {
  background: transparent;
  border-color: #0053d8;
}
.radio-check label.sm input[type=radio]:checked::after, .radio-check .tooltip-container.sm .tooltip label.tooltip-close input[type=radio]:checked::after, .tooltip-container.sm .tooltip .radio-check label.tooltip-close input[type=radio]:checked::after {
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  margin: 4px;
}

.radio-check label.button-radio {
  padding: 20px 20px 20px 46px;
  margin-bottom: 0;
  text-decoration: none;
  text-indent: 0;
  border-radius: 4px;
}
.radio-check label.button-radio.active {
  background: rgba(154, 154, 154, 0.2);
}
.radio-check label.button-radio.active:hover {
  background: rgba(154, 154, 154, 0.2);
}
.radio-check label.button-radio:hover {
  text-decoration: none;
  background: rgba(154, 154, 154, 0.1);
}
.radio-check label.button-radio input[type=radio] {
  top: 26px;
  left: 18px;
  width: 14px;
  height: 14px;
}

.blue .radio-check label[disabled], .tooltip-container .tooltip .radio-check label[disabled] {
  color: rgba(255, 255, 255, 0.5);
}
.blue .radio-check label input[type=radio]::before, .tooltip-container .tooltip .radio-check label input[type=radio]::before {
  border-color: rgba(255, 255, 255, 0.75);
}
.blue .radio-check label input[type=radio]:checked::before, .tooltip-container .tooltip .radio-check label input[type=radio]:checked::before {
  background-color: #0053d8;
  border-color: #ffffff;
}
.blue .radio-check label input[type=radio]:checked::after, .tooltip-container .tooltip .radio-check label input[type=radio]:checked::after {
  background-color: #ffffff;
}
.blue .radio-check label input[type=radio]:checked:disabled::after, .tooltip-container .tooltip .radio-check label input[type=radio]:checked:disabled::after {
  background-color: rgba(255, 255, 255, 0.5);
}
.blue .radio-check label input[type=radio]:disabled::before, .tooltip-container .tooltip .radio-check label input[type=radio]:disabled::before {
  background-color: transparent;
  border-color: rgba(255, 255, 255, 0.5);
}
.blue .radio-check label:hover input[type=radio]:not([disabled])::before, .tooltip-container .tooltip .radio-check label:hover input[type=radio]:not([disabled])::before {
  background-color: transparent;
  border-color: #ffffff;
}

/**
*     @additional information
*     all inputs are basically extended with the input atom. so do not wonder if there are more rules on this input type
*/
fieldset {
  width: 100%;
  padding: 0;
  margin: 16px 0;
  background: none;
  border: none;
  min-inline-size: auto;
}
fieldset:disabled label {
  color: #777777;
  cursor: default;
}

label {
  display: block;
  margin: 0 0 48px 0;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 1.375em;
  font-weight: normal;
  line-height: 1.5;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -moz-tap-highlight-color: rgba(0, 0, 0, 0);
  tap-highlight-color: rgba(0, 0, 0, 0);
}
label.required span.prefix::after {
  content: "*";
}
label.small {
  margin-bottom: 6px;
}
label.xs {
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 700;
}
label abbr {
  display: none;
}
label.checkbox.checked {
  border-color: #0053d8;
}
label .hint {
  font-size: 1rem;
  color: #95a0af;
}
label[data-tag] {
  position: relative;
  max-width: max-content;
  padding-right: 20px;
}
label[data-tag]::before, label[data-tag]::after {
  position: absolute;
  top: calc(50% - 16px);
}
label[data-tag]::before {
  content: "";
  left: calc(100% - 11px);
  width: 0;
  height: 0;
  border-top: 16px solid transparent;
  border-bottom: 16px solid transparent;
  border-right: 16px solid #0053d8;
}
label[data-tag]::after {
  content: attr(data-tag);
  left: calc(100% + 5px);
  padding: 7px 8px;
  background: #0053d8;
  color: #ffffff;
  font-weight: 700;
  font-size: 12px;
  width: 63px;
  text-align: center;
}

label.suffix {
  font-size: 1em;
}

legend {
  display: block;
  max-width: 100%;
  margin: 0 0 2rem 0;
  overflow: hidden;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 1.375em;
  font-weight: normal;
  line-height: 1.64;
}
legend.required::after {
  content: "*";
}
legend.input-error {
  color: #ff5d41;
}

a:not(.btn) {
  color: #0053d8;
  text-decoration: none;
  word-break: break-word;
}
a:hover:not(.btn) {
  color: #153a77;
}
a:active:not(.btn) {
  color: #153a77;
  outline: none;
}
a:focus:not(.btn) {
  color: #153a77;
  outline: none;
}
a:visited:not(.btn) {
  color: #0053d8;
}
a:not(.btn) .fwsj-icon, a:not(.btn) .dot.checked-dot::before, a:not(.btn) .organigram-item .organigram-item-inner.overview .count::before, .organigram-item .organigram-item-inner.overview a:not(.btn) .count::before, a:not(.btn) .scale-value::before, a:not(.btn) .chart-job-stress-index .wave-warning-icon, .chart-job-stress-index a:not(.btn) .wave-warning-icon {
  line-height: 1.5;
  vertical-align: bottom;
}

a:-webkit-any-link {
  text-decoration: none;
  outline: 0;
}

a.icon {
  color: #0053d8;
}

li {
  display: list-item;
  text-align: -webkit-match-parent;
}

.media {
  width: 100%;
  margin-right: 28px;
  margin: auto;
}
.media:last-child {
  margin-right: 0;
}

.media .media-wrapper {
  position: relative;
  top: 0;
  left: 0;
  height: 0;
  padding: 0 0 56.25% 0;
  margin: 0 0 20px 0;
}
.media .media-wrapper embed,
.media .media-wrapper iframe,
.media .media-wrapper object {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
}

ol, ul {
  padding: 0 0 0 1.5em;
  margin: 0 0 0.75em 0;
  font-family: "Source Sans Pro", sans-serif;
}

.checklist ol {
  padding: 0 0 0 24px;
}
.checklist ol li {
  margin: 36px 0;
  padding-left: 16px;
}

.toolbar label.radio, .input-group label.checkbox,
.input-group label.radio, .input-hierarchical .tree .leaf button, .chip {
  width: 100%;
  padding: 15px 27px 17px 27px;
  margin-bottom: 13px;
  text-indent: 0;
  border: 2px solid #dfe1e5;
  border-radius: 32px;
  transition: 0.3s cubic-bezier(0.445, 0.05, 0.55, 0.95) all;
  padding-left: 64px;
}
.toolbar label.radio:hover, .input-group label.checkbox:hover,
.input-group label.radio:hover, .input-hierarchical .tree .leaf button:hover, .chip:hover {
  text-decoration: none;
  border-color: #0053d8;
}
.toolbar label.check.radio, .input-group label.check.checkbox,
.input-group label.check.radio, .input-hierarchical .tree .leaf button.check, .check.chip {
  animation-duration: 0.2s;
  animation-iteration-count: 5;
  animation-name: selected;
  animation-timing-function: ease-in-out;
  animation-direction: alternate-reverse;
}
.toolbar label.check.radio, .input-group label.check.checkbox,
.input-group label.check.radio, .input-hierarchical .tree .leaf button.check, .check.chip, .toolbar label.checked.radio, .input-group label.checked.checkbox,
.input-group label.checked.radio, .input-hierarchical .tree .leaf button.checked, .checked.chip {
  border-color: #0053d8;
}
.toolbar label.radio input[type=checkbox], .input-group label.checkbox input[type=checkbox],
.input-group label.radio input[type=checkbox], .input-hierarchical .tree .leaf button input[type=checkbox], .chip input[type=checkbox],
.toolbar label.radio input[type=radio],
.input-group label.checkbox input[type=radio],
.input-group label.radio input[type=radio],
.input-hierarchical .tree .leaf button input[type=radio],
.chip input[type=radio] {
  top: 17px;
  left: 25px;
  margin-bottom: 1.5rem;
}
.toolbar label.radio input[type=checkbox]::before, .input-group label.checkbox input[type=checkbox]::before,
.input-group label.radio input[type=checkbox]::before, .input-hierarchical .tree .leaf button input[type=checkbox]::before, .chip input[type=checkbox]::before,
.toolbar label.radio input[type=radio]::before,
.input-group label.checkbox input[type=radio]::before,
.input-group label.radio input[type=radio]::before,
.input-hierarchical .tree .leaf button input[type=radio]::before,
.chip input[type=radio]::before {
  top: 0;
  left: 0;
  border-color: #0053d8;
}
.toolbar label.radio input[type=checkbox] :not(:checked)::before, .input-group label.checkbox input[type=checkbox] :not(:checked)::before,
.input-group label.radio input[type=checkbox] :not(:checked)::before, .input-hierarchical .tree .leaf button input[type=checkbox] :not(:checked)::before, .chip input[type=checkbox] :not(:checked)::before,
.toolbar label.radio input[type=radio] :not(:checked)::before,
.input-group label.checkbox input[type=radio] :not(:checked)::before,
.input-group label.radio input[type=radio] :not(:checked)::before,
.input-hierarchical .tree .leaf button input[type=radio] :not(:checked)::before,
.chip input[type=radio] :not(:checked)::before {
  background-color: #ffffff;
}
@keyframes selected {
  0% {
    background-color: rgba(68, 245, 170, 0.5);
  }
  100% {
    background-color: rgba(0, 83, 216, 0.5);
  }
}

@media screen and (max-width: 680px) {
  .input-group label.checkbox,
  .input-group label.radio, .input-hierarchical .tree .leaf button {
    width: calc(100% + 2 * (24px));
    margin: 0 -24px;
    background-color: #fafafa;
    border-width: 0;
    border-radius: 0;
  }
  .input-group label.checkbox:nth-of-type(odd),
  .input-group label.radio:nth-of-type(odd), .input-hierarchical .tree .leaf button:nth-of-type(odd) {
    background-color: whitesmoke;
  }
}

p {
  margin: 0 0 0.9999em;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 1em;
}
@media (max-width: 680px) {
  p {
    font-size: 0.95em;
  }
}
p * {
  font-family: "Source Sans Pro", sans-serif;
}
progress {
  width: 100%;
  height: 3px;
  -webkit-appearance: none;
  transition: 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955) all;
}
progress::-webkit-progress-bar {
  transition: 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955) all;
  background: #dfe1e5;
}
progress::-webkit-progress-value {
  transition: 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955) all;
  background: #00c2df;
}
progress::-moz-progress-bar {
  transition: 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955) all;
  background: transparent;
}

.scale-indicator {
  bottom: 0;
  left: 0;
  z-index: 7;
  display: inline-block;
  transition: left 0.15s cubic-bezier(0.47, 0, 0.745, 0.715);
}
.scale-indicator:not(.legend) {
  position: absolute;
}
.scale-indicator .dash {
  width: 6px;
  height: 2px;
  margin-top: 2px;
  border-radius: 1px;
  -webkit-print-color-adjust: exact;
  color-adjust: exact;
  background-color: #333333;
}
.scale-indicator.bad .dash {
  background-color: #BF331B;
}
.scale-indicator.ok .dash {
  background-color: #A5922B;
}
.scale-indicator.good .dash {
  background-color: #08A160;
}
.scale-indicator.current .dash {
  height: 14px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.scale-indicator.legend {
  padding: 0;
}
.scale-indicator.legend .dash {
  width: 10px;
}
.scale-indicator.legend.bad .dash {
  background-color: #ff5d41;
}
.scale-indicator.legend.ok .dash {
  background-color: #f4cf04;
}
.scale-indicator.legend.good .dash {
  background-color: #44f5aa;
}

.input-select {
  font-size: 1.375rem;
}

.select-wrapper {
  position: relative;
  margin-bottom: 48px;
  border-bottom: 2px solid #dfe1e5;
}
.select-wrapper:after {
  transform: rotate(45deg);
  position: absolute;
  top: 24px;
  right: 12px;
  width: 9px;
  height: 9px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #95a0af;
  content: "";
}
.select-wrapper::after {
  pointer-events: none;
}
.select-wrapper.sm, .tooltip-container.sm .tooltip .select-wrapper.tooltip-close {
  margin: 0 16px 0 0;
  border-bottom: 0;
}
.select-wrapper.sm .select, .tooltip-container.sm .tooltip .select-wrapper.tooltip-close .select {
  font-size: 16px;
}
.select-wrapper.sm::after, .tooltip-container.sm .tooltip .select-wrapper.tooltip-close::after {
  top: 21px;
  right: 7px;
  width: 9px;
  height: 9px;
}

.select {
  font-family: "Source Sans Pro", sans-serif;
  font-size: 1.375rem;
  color: #333333;
  background-color: transparent;
  border: 0;
}
.select::-ms-expand {
  display: none;
}

select {
  display: block;
  width: 100%;
  max-width: 100%;
  outline: none;
}

select.select {
  padding: 16px 16px 16px 2px;
  transition: all 0.3s cubic-bezier(0.86, 0, 0.07, 1);
}
select.select:not([multiple]) {
  appearance: none;
}
select.select:not([multiple]):hover {
  cursor: pointer;
  outline: 0;
}

table {
  width: 100%;
  margin: 0.75em 0;
  border-collapse: collapse;
  table-layout: fixed;
}

th {
  padding: 0.75em 0;
  font-weight: bold;
  text-align: left;
  vertical-align: top;
  border-bottom: 2px solid rgba(0, 54, 140, 0.2);
}

td {
  padding: 0.75em 0;
  vertical-align: top;
  border-bottom: 2px solid rgba(0, 83, 216, 0.2);
}

tr {
  vertical-align: top;
}

.table-container {
  position: relative;
}
.table-container .table-scroll {
  overflow-x: auto;
}
.table-container .table-scroll table {
  min-width: 975px;
  border-collapse: separate;
}
.table-container .table-scroll table.first-row-sticky tr :first-child {
  position: sticky;
  left: 0;
  width: 138px;
  background: #ffffff;
  border-right: 1px solid #dfe1e5;
}

* ::selection {
  text-shadow: none;
  background-color: #2679ff;
}

textarea, .web .at-contact textarea,
.at-contact textarea {
  width: 100%;
  padding: 16px 0;
  margin: 0 0 0.75em 0;
  overflow: hidden;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 1.375rem;
  line-height: 1.2;
  background-color: transparent;
  border: 0 transparent solid;
  border-bottom: 2px solid #dfe1e5;
  border-radius: 0;
  outline: none;
  box-shadow: none;
  box-sizing: border-box;
  resize: vertical;
}
textarea:focus,
.at-contact textarea:focus {
  border-bottom-color: #0053d8;
}
textarea:disabled,
.at-contact textarea:disabled {
  color: #777777;
}
textarea::placeholder, .web .at-contact textarea::placeholder,
.at-contact textarea::placeholder {
  color: #9a9a9a;
}
textarea.negative,
.at-contact textarea.negative {
  color: #ffffff;
  border-bottom: 2px solid rgba(255, 255, 255, 0.5);
}
textarea.negative::placeholder,
.at-contact textarea.negative::placeholder {
  color: rgba(255, 255, 255, 0.8);
}
textarea.negative:focus {
  border-bottom-color: rgba(255, 255, 255, 0.8);
}
textarea.negative:focus::placeholder {
  color: rgba(255, 255, 255, 0.2);
}
textarea.small,
.at-contact textarea.small {
  font-size: 1rem;
}

.web textarea {
  border-bottom: 2px solid #dfe1e5;
  border-radius: 0;
  background-color: #fafafa;
  height: 192px;
  padding-left: 16px;
  padding-right: 16px;
}

/* textlink inspired by -- https://eager.io/blog/smarter-link-underlines/ */
ul {
  list-style-type: disc;
}

div.spinner {
  position: relative;
}

.rotate {
  transform: rotate(-90deg) translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -25px 0 0 -25px;
  width: 50px;
  height: 50px;
}

svg.spinner {
  animation: rotate 1.75s linear infinite;
  z-index: 2;
  width: 100%;
  height: 100%;
}
svg.spinner .path {
  animation: dash 1.75s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite;
  stroke-dasharray: 150, 150;
  stroke-dashoffset: 0;
}

@keyframes rotate {
  100% {
    transform: rotate(360deg);
  }
}
@keyframes dash {
  0% {
    stroke-dasharray: 1, 150;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -25;
  }
  100% {
    stroke-dasharray: 180, 150;
    stroke-dashoffset: -150;
  }
}
.approved {
  position: relative;
  border-radius: 50%;
  background-color: #3de49d;
}
.approved i {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  color: #ffffff;
}

.approved-sm {
  width: 16px;
  height: 16px;
}
.approved-sm i {
  font-size: 10px;
}

.approved-md {
  width: 24px;
  height: 24px;
}
.approved-md i {
  font-size: 14px;
}

.approved-lg {
  width: 36px;
  height: 36px;
}
.approved-lg i {
  font-size: 20px;
}

.approved-xl {
  width: 112px;
  height: 112px;
}
.approved-xl i {
  font-size: 56px;
}

.integrity-check {
  position: absolute;
  top: 24px;
  left: 20px;
  z-index: 10;
}
@media screen and (max-width: 680px) {
  .integrity-check {
    display: none;
  }
}

.status-icon {
  position: relative;
  background-color: #c0c7d1;
  border-radius: 50%;
}
.status-icon i {
  position: absolute;
  top: 50%;
  left: 50%;
  color: #ffffff;
  transform: translateX(-50%) translateY(-50%);
}
.status-icon.sm, .tooltip-container.sm .tooltip .status-icon.tooltip-close {
  width: 16px;
  height: 16px;
  border-width: 1px;
}
.status-icon.sm i, .tooltip-container.sm .tooltip .status-icon.tooltip-close i {
  font-size: 10px;
}
.status-icon.md {
  width: 24px;
  height: 24px;
  border-width: 2px;
}
.status-icon.md i {
  font-size: 14px;
}
.status-icon.lg {
  width: 36px;
  height: 36px;
  border-width: 3px;
}
.status-icon.lg i {
  font-size: 20px;
}
.status-icon.xl {
  width: 112px;
  height: 112px;
  border-width: 4px;
}
.status-icon.xl i {
  font-size: 56px;
}
.status-icon.ok {
  background-color: #3de49d;
}
.status-icon.ok.inactive {
  background-color: #b1f4d8;
}
.status-icon.warning {
  background-color: #ffe200;
}
.status-icon.warning.inactive {
  background-color: #fff399;
}
.status-icon.error {
  background-color: #ff5d41;
}
.status-icon.error.inactive {
  background-color: #ffbeb3;
}
.status-icon.info {
  background-color: #0053d8;
}
.status-icon.info.inactive {
  background-color: #99baef;
}
.status-icon.pending {
  background-color: transparent;
  border-color: #484848;
  border-style: dashed;
}
.status-icon.pending > i {
  display: none;
}

.integrity-check {
  position: absolute;
  top: 40px;
  left: 20px;
  z-index: 10;
}
@media screen and (max-width: 680px) {
  .integrity-check {
    display: none;
  }
}

.approved {
  position: relative;
  border-radius: 50%;
  background-color: #3de49d;
}
.approved i {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  color: #ffffff;
}

.approved-sm {
  width: 16px;
  height: 16px;
}
.approved-sm i {
  font-size: 10px;
}

.approved-md {
  width: 24px;
  height: 24px;
}
.approved-md i {
  font-size: 14px;
}

.approved-lg {
  width: 36px;
  height: 36px;
}
.approved-lg i {
  font-size: 20px;
}

.approved-xl {
  width: 112px;
  height: 112px;
}
.approved-xl i {
  font-size: 56px;
}

.integrity-check {
  position: absolute;
  top: 24px;
  left: 20px;
  z-index: 10;
}
@media screen and (max-width: 680px) {
  .integrity-check {
    display: none;
  }
}

.chip {
  display: inline-block;
  width: auto;
  padding: 4px 12px;
  margin: 8px 4px 0 0;
  color: #ffffff;
  white-space: nowrap;
  cursor: pointer;
  background: #0053d8;
  border-color: transparent;
}
.chip .fwsj-icon, .chip .dot.checked-dot::before, .chip .organigram-item .organigram-item-inner.overview .count::before, .organigram-item .organigram-item-inner.overview .chip .count::before, .chip .scale-value::before, .chip .chart-job-stress-index .wave-warning-icon, .chart-job-stress-index .chip .wave-warning-icon {
  display: inline-block;
  width: 16px;
  margin-left: 4px;
  font-size: 1.2em;
  vertical-align: text-bottom;
  cursor: pointer;
}
.chip .fwsj-icon:hover, .chip .dot.checked-dot:hover::before, .chip .organigram-item .organigram-item-inner.overview .count:hover::before, .organigram-item .organigram-item-inner.overview .chip .count:hover::before, .chip .scale-value:hover::before, .chip .chart-job-stress-index .wave-warning-icon:hover, .chart-job-stress-index .chip .wave-warning-icon:hover {
  color: rgba(255, 255, 255, 0.5);
}
.chip.outline {
  color: #0053d8;
  background: none;
  border-color: #0053d8;
}
.chip.disabled {
  background-color: #c0c7d1;
}
.chip.disabled:hover {
  border-color: #c0c7d1;
}
.chip.primary {
  background-color: #3de49d;
}
.chip.primary:hover {
  border-color: #3de49d;
}
.chip.secondary {
  background-color: #ff8870;
}
.chip.secondary:hover {
  border-color: #ff8870;
}

.chip.status,
.chip.mode {
  display: inline-block;
  padding: 4px 13px;
  min-width: 54px;
  margin: -4px 0 0;
  font-weight: 800;
  border: 0;
  background-color: #f1f1ea;
}
.chip.status.l,
.chip.mode.l {
  background-color: #ffa600;
}
.chip.status.s,
.chip.mode.s {
  background-color: #f4cf04;
}
.chip.status.r,
.chip.mode.r {
  background-color: #3de49d;
}
.chip.status.regular,
.chip.mode.regular {
  background-color: #d6d6c8;
  color: #333333;
}
.chip.status.m3,
.chip.mode.m3 {
  background-color: #0044b3;
}
.chip.status.short,
.chip.mode.short {
  background-color: #ff5d41;
}

.chip.status {
  background-image: url("../assets/img/icon-progress.svg");
  background-repeat: no-repeat;
  background-size: auto;
  background-position: 30px 50%;
}
.chip.status.done {
  background-image: url("../assets/img/icon-check.svg");
  background-size: 28%;
}

.chip.mode {
  width: auto;
  min-width: 84px;
  background-image: none;
}

.corner-label,
.corner-label-sm,
.corner-label-lg,
.corner-label-pseudo {
  position: relative;
  overflow: hidden;
}
.corner-label::after,
.corner-label-sm::after,
.corner-label-lg::after,
.corner-label-pseudo::after {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 76px;
  height: 38px;
  padding-top: 16px;
  font-size: 1em;
  font-weight: bold;
  line-height: 1;
  color: #ffffff;
  text-align: center;
  background: #ff8870;
  content: attr(data-label);
  transform: translate(50%, 0) rotate(45deg);
  transform-origin: top center;
}

.corner-label::after {
  width: 76px;
  height: 38px;
  padding-top: 16px;
  font-size: 1em;
}

.label-green::after {
  background: #44f5aa;
}

.corner-label-sm::after {
  width: 61px;
  height: 31px;
  padding-top: 12px;
  font-size: 0.8em;
}

.corner-label-lg::after {
  width: 76px;
  height: 38px;
  padding-top: 20px;
  font-size: 0.75em;
}

.corner-label-pseudo {
  position: absolute;
  top: 0;
  right: 0;
  width: 56px;
  height: 56px;
}

a.download-link {
  display: flex;
  line-height: 1.2;
  color: #333333;
}
a.download-link:visited {
  color: #333333;
}
a.download-link:hover {
  color: #9a9a9a;
}
a.download-link .download-link-title {
  margin-right: 24px;
}
a.download-link .download-link-size,
a.download-link .download-link-date {
  margin-right: 8px;
  font-size: 0.825em;
}
a.download-link i {
  font-size: 1.125em;
}

label.switch {
  position: relative;
  display: inline-block;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  align-items: center;
  max-width: max-content;
}
label.reverse.switch {
  flex-direction: row-reverse;
  justify-content: flex-end;
}
label.reverse.switch input {
  margin-left: 0;
}
label.switch input {
  width: 51px;
  min-width: 51px;
  height: 30px;
  margin-right: 20px;
  margin-left: 20px;
  line-height: 30px;
  cursor: pointer;
  background-color: #abbfcd;
  border-radius: 100px;
  transition: background-color 0.2s ease-in;
  appearance: none;
  -webkit-appearance: none;
}
label.switch input::before {
  position: absolute;
  top: 50%;
  bottom: 10%;
  width: 25px;
  height: 25px;
  background-color: #ffffff;
  border-radius: 100px;
  content: "";
  transform: translate(10%, -50%);
  transition: all 0.2s cubic-bezier(0.86, 0, 0.07, 1);
}
label.switch input::before::before {
  transition: all 0.2s cubic-bezier(0.86, 0, 0.07, 1);
}
label.switch input:checked {
  background-color: #3de49d;
}
label.switch input:checked::before {
  transform: translate(23.5px, -50%);
}

.switch-container {
  display: flex;
}
.switch-container label {
  transition: color 0.2s linear;
}
.switch-container label:first-of-type.active {
  color: #FBBC00;
}
.switch-container label:first-of-type:hover {
  color: #FBBC00;
}
.switch-container label:first-of-type input[type=radio] {
  background-color: #0053d8;
}
.switch-container label:first-of-type input[type=radio]::before {
  transform: translate(23.5px, -49%);
}
.switch-container label:first-of-type input[type=radio][checked=true] {
  background-color: #FBBC00;
}
.switch-container label:first-of-type input[type=radio][checked=true]::before {
  transform: translate(10%, -49%);
}
.switch-container label:last-of-type.active {
  color: #0053d8;
}
.switch-container label:last-of-type:hover {
  color: #0053d8;
}
.switch-container label:last-of-type input[type=radio] {
  position: absolute;
  top: 0;
  margin: 0;
  opacity: 0;
  transform: translate(-150%, -49%);
}
.switch-container label span.discount {
  position: absolute;
  top: -20px;
  left: 60%;
  padding: 6px 10px;
  font-size: 0.8em;
  line-height: 1;
  color: #ffffff;
  white-space: nowrap;
  background-color: #ff5d41;
  border-radius: 4px;
  transform: rotate(10deg);
  -webkit-backface-visibility: hidden;
}

.header-bar {
  position: absolute;
}
.header-bar .container {
  padding-top: 32px;
  padding-bottom: 32px;
}

.site {
  padding-top: calc(1em + ((12px + 12px + 32px) * 2));
}

.main-navigation .nav-drawer ul {
  float: right;
  padding: 12px 0;
  margin: 0;
}
.main-navigation .nav-drawer li {
  display: inline-block;
  padding: 0 20px;
}
.main-navigation .nav-drawer li a {
  transition: 0.3s all cubic-bezier(0.785, 0.135, 0.15, 0.86);
  display: block;
  padding: 0;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 1.4em;
  font-weight: 500;
  line-height: 1em;
  color: #FBBC00;
  text-transform: lowercase;
  border-bottom: 2px solid transparent;
}
.main-navigation .nav-drawer li a:hover {
  color: #957000;
}
.main-navigation .nav-drawer li.current_page_item > a, .main-navigation .nav-drawer li.selected a {
  border-bottom: 2px solid #FBBC00;
}
@media screen and (max-width: 1025px) {
  .main-navigation .nav-drawer {
    transition: 0.3s all cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transform: translateX(280px);
    position: fixed;
    top: 0;
    right: 0;
    float: none;
    width: 280px;
    height: 100%;
    color: #ffffff;
    background: #c89600;
  }
  .main-navigation .nav-drawer ul {
    float: none;
    width: 100%;
    padding: 0;
    margin-top: 104px;
  }
  .main-navigation .nav-drawer ul li,
  .main-navigation .nav-drawer ul li.selected {
    display: block;
    padding: 0;
  }
  .main-navigation .nav-drawer ul li a,
  .main-navigation .nav-drawer ul li.selected a {
    display: block;
    padding: 8px 24px;
    font-size: 1.1em;
    line-height: 1.5em;
    color: #ffffff;
    border-top: 1px solid #f1b400;
    border-bottom: 0;
  }
  .main-navigation .nav-drawer ul li a:hover,
  .main-navigation .nav-drawer ul li.selected a:hover {
    color: #ffffff;
  }
  .main-navigation .nav-drawer ul li.current_page_item {
    background-color: #e2a900;
  }
  .main-navigation .nav-drawer ul li.current_page_item a {
    color: #ffffff;
    border-bottom: 0;
  }
  .main-navigation .nav-drawer.in {
    transform: translateX(0);
  }
}

@media screen and (max-width: 1025px) {
  .shift {
    transition: 0.3s all cubic-bezier(0.785, 0.135, 0.15, 0.86);
  }
  .shift.out {
    transform: translate3d(-280px, 0, 2px);
  }
}
h2.site-title {
  float: left;
  padding: 8px 0;
  margin: 0;
  font-size: 2.1em;
  line-height: 1;
  text-transform: uppercase;
}
h2.site-title a {
  color: #FBBC00;
}

.accordion {
  padding-bottom: 8px;
}
.accordion.open > .accordion-body {
  height: auto;
  visibility: visible;
}
.accordion.open > .accordion-header button.accordion-toggler {
  transform: rotate(-179.9deg);
}

.accordion-header {
  position: relative;
  cursor: pointer;
}
.accordion-header.has-toggler {
  padding-right: 32px;
}

button.accordion-toggler {
  position: absolute;
  top: calc((1.5 * 1em - 24px) / 2);
  right: 0;
  width: 24px;
  height: 24px;
  padding: 0;
  margin: 0;
  background: 0;
  border: 0;
  transition: transform 0.2s;
}
button.accordion-toggler:before {
  transform: rotate(45deg);
  position: absolute;
  top: calc(50% - 6px);
  right: calc(50% - 4.5px);
  width: 8px;
  height: 8px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #9a9a9a;
  content: "";
}
button.accordion-toggler:hover {
  background: none;
}

.accordion-body {
  height: 0;
  overflow: hidden;
  visibility: hidden;
  transition: height 0.3s, visibility 0.3s;
}
.accordion-body::after {
  display: block;
  float: none;
  clear: both;
  content: "";
}

.web .at-contact .flex-1of3,
.at-contact .flex-1of3 {
  width: 33.3333333333%;
}
@media screen and (max-width: 868px) {
  .web .at-contact .flex-1of3,
  .at-contact .flex-1of3 {
    order: 2;
    width: 100%;
  }
}
.web .at-contact .flex-2of3,
.at-contact .flex-2of3 {
  width: 66.6666666667%;
}
@media screen and (max-width: 868px) {
  .web .at-contact .flex-2of3,
  .at-contact .flex-2of3 {
    order: 1;
    width: 100%;
  }
}
.web .at-contact fieldset,
.at-contact fieldset {
  display: flex;
  flex-wrap: wrap;
  margin-top: 0;
}
.web .at-contact label[for=name],
.web .at-contact label[for=email],
.at-contact label[for=name],
.at-contact label[for=email] {
  width: 50%;
}
.web .at-contact label[for=subject],
.web .at-contact label[for=message],
.at-contact label[for=subject],
.at-contact label[for=message] {
  width: 100%;
}
.blockquote-portrait {
  display: flex;
}
@media screen and (max-width: 768px) {
  .blockquote-portrait {
    flex-direction: column;
  }
}
.blockquote-portrait img {
  width: 88px;
  height: 88px;
  margin: 16px 48px 0 0;
}
@media screen and (max-width: 768px) {
  .blockquote-portrait img {
    flex-direction: column;
    margin: 24px auto;
  }
}
.blockquote-portrait blockquote {
  margin-top: 0;
  margin-bottom: 0;
}

.chart-circular,
.circular-chart {
  position: relative;
  display: inline-block;
  width: 96px;
  height: 96px;
}
.chart-circular.md,
.circular-chart.md {
  width: 128px;
  height: 128px;
}
.chart-circular.lg,
.circular-chart.lg {
  width: 144px;
  height: 144px;
}
.chart-circular.xl,
.circular-chart.xl {
  width: 220px;
  height: 220px;
}

svg.circular-figure {
  overflow: visible;
  transform: rotate(-90deg);
}
svg.circular-figure circle {
  fill: none;
  stroke: rgba(0, 194, 223, 0.2);
  stroke-width: 4;
}
svg.circular-figure circle.fill {
  transition: 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86) all;
  transition-property: stroke-dasharray, stroke-dashoffset;
  stroke-width: 12;
  stroke: #00def1;
}
svg.circular-figure g circle.fill {
  stroke-width: 28;
}
svg.circular-figure g circle.fill.thin {
  stroke-width: 12;
}
svg.circular-figure g circle.fill.active {
  stroke-width: 48;
}
svg.circular-figure g circle.fill.primary {
  stroke: #FBBC00;
}
svg.circular-figure g circle.fill.secondary {
  stroke: #0053d8;
}
svg.circular-figure g circle.fill.yellow {
  stroke: #ffee56;
}
svg.circular-figure g circle.fill.red {
  stroke: #ff5d41;
}
svg.circular-figure g circle.fill.green {
  stroke: #44f5aa;
}

.chart-circular.negative svg.circular-figure circle:not(.strong),
.circular-chart.negative svg.circular-figure circle:not(.strong) {
  stroke: rgba(255, 255, 255, 0.2);
}
.chart-circular.negative svg.circular-figure circle.fill:not(.strong),
.chart-circular.negative svg.circular-figure g circle.fill:not(.strong),
.circular-chart.negative svg.circular-figure circle.fill:not(.strong),
.circular-chart.negative svg.circular-figure g circle.fill:not(.strong) {
  stroke: #ffffff;
}

.circular-content {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  min-width: auto;
  min-height: auto;
  text-align: center;
  pointer-events: none;
  transform: translate(-50%, -50%);
}
.circular-content label {
  margin: 0;
  line-height: 0.7em;
}
.circular-content label.data {
  font-size: 1.25em;
  font-weight: 700;
  letter-spacing: 1.2px;
}
.circular-content label.desc {
  font-size: 0.75rem;
  font-weight: 100;
}

.chart-circular.lg .circular-content label,
.circular-chart.lg .circular-content label,
.chart-circular.md .circular-content label,
.circular-chart.md .circular-content label,
.chart-circular.xl .circular-content label,
.circular-chart.xl .circular-content label {
  line-height: 1.1em;
}
.chart-circular.lg .circular-content label.data,
.circular-chart.lg .circular-content label.data,
.chart-circular.md .circular-content label.data,
.circular-chart.md .circular-content label.data,
.chart-circular.xl .circular-content label.data,
.circular-chart.xl .circular-content label.data {
  font-size: 1.5em;
  letter-spacing: 1px;
}

.chart-circular.lg .circular-content label,
.circular-chart.lg .circular-content label {
  line-height: 1.5em;
}

.chart-container {
  margin: 24px 0;
  cursor: pointer;
}
.chart-container .chart-legend p {
  margin: 0.5em 0;
}

@media screen and (max-width: 420px) {
  .chart-circular-svg svg {
    max-width: 100%;
  }
}
.chart-circular-svg .secondary {
  fill: #0053d8;
}
.chart-circular-svg .tertiary {
  fill: #008bee;
}
.chart-circular-svg .secondary-d3 {
  fill: #0a367c;
}
.chart-circular-svg .quaternary {
  fill: #00c2df;
}
.chart-circular-svg .label-text {
  font-weight: bold;
}
.chart-circular-svg .participants-number {
  font-weight: bold;
}

.chart-job-stress-index svg {
  max-width: 100%;
}
.chart-job-stress-index .filter-state {
  visibility: hidden;
}
@media print {
  .chart-job-stress-index .filter-state {
    visibility: visible;
  }
}
.chart-job-stress-index .filter-state .filter-state__label {
  font-weight: bold;
}
.chart-job-stress-index .neutral {
  color: #00def1;
}
.chart-job-stress-index .bad {
  color: #ff5d41;
}
.chart-job-stress-index .good {
  color: #3de49d;
}
.chart-job-stress-index .wave-warning-background {
  fill: #ff5d41;
}
.chart-job-stress-index .wave-warning-icon {
  font-size: 0.75rem;
  cursor: pointer;
  fill: #ffffff;
}
.chart-job-stress-index .sector .sector-label {
  font-weight: bold;
  font-size: 0.875rem;
}
.chart-job-stress-index .sector .sector-line {
  stroke-width: 4;
  stroke: currentColor;
}
.chart-job-stress-index .sector .sector-seperator {
  fill: currentColor;
}
.chart-job-stress-index .sector.bad {
  stroke-dasharray: 6 3 6 3 10000;
}
.chart-job-stress-index .sector.bad .sector-label {
  fill: #cc4a34;
}
.chart-job-stress-index .sector.good {
  stroke-dasharray: 6 3 6 3 10000;
}
.chart-job-stress-index .sector.good .sector-label {
  fill: #31b67e;
}
.chart-job-stress-index .team .team-circle {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  fill: #ffffff;
}
.chart-job-stress-index .team .team-line {
  stroke: currentColor;
  stroke-width: 1;
}
.chart-job-stress-index .team .team-label {
  font-size: 1rem;
}
.chart-job-stress-index .wave .wave-line {
  stroke: currentColor;
}
.chart-job-stress-index .wave .wave-line-circle {
  stroke: currentColor;
  fill: #ffffff;
  stroke-dasharray: none;
  stroke-linecap: round;
}
.chart-job-stress-index .wave .wave-label {
  font-weight: bold;
}
.chart-job-stress-index .wave .wave-label .label-text {
  font-size: 0.875rem;
  fill: #484848;
}
.chart-job-stress-index .wave .wave-label .label-value {
  font-size: 1.625rem;
}
.chart-job-stress-index .wave.primary .wave-line,
.chart-job-stress-index .wave.primary .wave-line-circle {
  stroke-width: 4;
}
.chart-job-stress-index .wave.secondary .wave-line-circle {
  stroke-width: 2;
}
.chart-job-stress-index .wave.secondary .wave-line {
  stroke-width: 2;
  stroke-dasharray: 6 3;
}
.chart-job-stress-index .share .share-label {
  font-weight: bold;
  font-size: 0.875rem;
}
.chart-job-stress-index .share .share-line {
  stroke-dasharray: 6 3;
  stroke-width: 2;
}
.chart-job-stress-index .share.neutral .share-line {
  stroke: #006f79;
}
.chart-job-stress-index .share.neutral .share-label {
  fill: #006f79;
}
.chart-job-stress-index .share.bad .share-line {
  stroke: #802f21;
}
.chart-job-stress-index .share.bad .share-label {
  fill: #802f21;
}
.chart-job-stress-index .share.good .share-line {
  stroke: #1f724f;
}
.chart-job-stress-index .share.good .share-label {
  fill: #1f724f;
}
.chart-job-stress-index .share .share-block.primary {
  fill: currentColor;
}
.chart-job-stress-index .share .share-block.secondary {
  opacity: 0.1;
  fill: currentColor;
}
.chart-job-stress-index .shares-label {
  font-weight: bold;
}

.chart-scale-example {
  width: 50%;
  padding: 32px 0 36px;
}
@media screen and (max-width: 768px) {
  .chart-scale-example {
    width: auto;
  }
}
.chart-scale-example .scale-bar {
  background-image: linear-gradient(to right, #4af4d6 0%, #44f5aa 25%, #44f5aa 50%, #ffee56 62%, #ffe956 86%, #ff5d41 94%, #ff5d41);
}
.chart-scale-example .scale-bar::before, .chart-scale-example .scale-bar::after {
  content: none;
}
.chart-scale-example .chart-scale-description,
.chart-scale-example .chart-scale-name {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
}
.chart-scale-example .chart-scale-description {
  font-size: 0.875em;
  color: #9a9a9a;
}

.chart-scale-analysis {
  display: flex;
  align-items: baseline;
  flex-shrink: 0;
  width: calc(50% + 60px);
}
@media screen and (max-width: 768px) {
  .chart-scale-analysis {
    width: calc(100% - 30px);
  }
}
.chart-scale-analysis.ghost {
  pointer-events: none;
  opacity: 0.4;
}
.chart-scale-analysis.blind {
  padding-right: 16px;
}
.chart-scale-analysis.blind .scale-bar {
  background-color: #dfe1e5;
}
.chart-scale-analysis .scale-bar {
  width: calc(100% - 60px);
  margin: 0 8px 0 0;
}

.scale-bar {
  position: relative;
  display: block;
  height: 10px;
  border-radius: 2px;
  -webkit-print-color-adjust: exact;
  color-adjust: exact;
}
.scale-bar::before, .scale-bar::after {
  position: absolute;
  top: -6px;
  width: 2px;
  height: 4px;
  background-color: #333333;
  border-radius: 1px;
  content: "";
}
.scale-bar::before {
  left: 60%;
}
.scale-bar::after {
  left: 90%;
}
.scale-bar.bad:hover, .scale-bar.ok:hover, .scale-bar.good:hover {
  background-image: linear-gradient(to right, #4af4d6 0%, #44f5aa 25%, #44f5aa 50%, #ffee56 62%, #ffe956 86%, #ff5d41 94%, #ff5d41);
}
.scale-bar.bad {
  background-color: #ff5d41;
  background-image: none;
}
.scale-bar.ok {
  background-color: #ffe200;
  background-image: none;
}
.scale-bar.good {
  background-color: #44f5aa;
  background-image: none;
}
.scale-bar .indicators {
  position: relative;
  display: block;
  width: calc(100% - 6px);
  height: 100%;
}
.scale-bar .change {
  position: absolute;
  bottom: 0;
  height: 14px;
  border-top-right-radius: 1px;
  border-top-left-radius: 1px;
}
.scale-bar .change::before {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url("../assets/img/chevron.png");
  background-repeat: repeat-x;
  background-size: contain;
  content: "";
  opacity: 0.17;
}
.scale-bar .change.better::before {
  transform: rotate(180deg);
}
.scale-bar .change.good-bad {
  background-image: linear-gradient(to right, #44f5aa, #ff5d41);
}
.scale-bar .change.good-ok {
  background-image: linear-gradient(to right, #44f5aa, #ffee56);
}
.scale-bar .change.ok-bad {
  background-image: linear-gradient(to right, #ffee56, #ff5d41);
}
.scale-bar .change.good-good {
  background-image: linear-gradient(to right, #44f5aa, #37ca8c);
}
.scale-bar .change.ok-ok {
  background-image: linear-gradient(to right, #ffee56, #f4cf04);
}
.scale-bar .change.bad-bad {
  background-image: linear-gradient(to right, #ff5d41, #CE2205);
}

.scale-value {
  min-width: 20px;
  margin-right: 8px;
  font-weight: 700;
  cursor: default;
}
.scale-value.bad, .scale-value.ok, .scale-value.good {
  min-width: 60px;
}
.scale-value::before {
  margin-right: 6px;
  font-size: 0.75em;
}

.scale-value.bad::before {
  color: #ff5d41;
  content: "\e925";
}

.scale-value.ok::before {
  color: #ffe200;
  content: "\e927";
}

.scale-value.good::before {
  color: #44f5aa;
  content: "\e926";
}

.chart-spider {
  width: 100%;
}
.chart-spider.preview .container-sector-label,
.chart-spider.preview .container-scale-label {
  opacity: 0;
}
.chart-spider.preview g {
  pointer-events: none;
}
.chart-spider.preview .tick,
.chart-spider.preview .sector {
  stroke-width: 3;
}
.chart-spider svg {
  width: 100%;
  height: auto;
}
.chart-spider svg #beige stop.start {
  stop-color: #F0EEE3;
}
.chart-spider svg #beige stop.end {
  stop-color: #FAFAF5;
}
.chart-spider svg .sector {
  fill: none;
  stroke: #c0c7d1;
}
.chart-spider svg .sector-label {
  font-weight: bold;
}
.chart-spider svg .polygon {
  opacity: 0.7;
}
.chart-spider svg .polygon-dot .dot-visual {
  transition: transform 0.3s;
}
.chart-spider svg .polygon-dot .dot-trigger {
  opacity: 0;
}
.chart-spider svg .polygon-dot:hover .dot-visual {
  transform: scale(1.5);
}
.chart-spider svg .primary {
  fill: #44f5aa;
}
.chart-spider svg .secondary {
  fill: #ff694c;
}
.chart-spider svg .tick {
  fill: none;
  stroke: #c0c7d1;
}
.chart-spider svg .tick.background {
  fill: url(#beige);
}

.chart-gradients {
  position: absolute;
  width: 0;
  height: 0;
  visibility: hidden;
}
.chart-gradients .gradient-secondary__tertiary stop.start {
  stop-color: #0053d8;
}
.chart-gradients .gradient-secondary__tertiary stop.end {
  stop-color: #008bee;
}
.chart-gradients .gradient-secondary-d2__secondary stop.start {
  stop-color: #093c8d;
}
.chart-gradients .gradient-secondary-d2__secondary stop.end {
  stop-color: #0053d8;
}

.chart-bar {
  width: 100%;
  overflow-x: auto;
}
.chart-bar text,
.chart-bar tspan {
  fill: currentColor;
}
.chart-bar svg {
  display: block;
  max-width: 100%;
}
@media screen and (max-width: 1331.2px) {
  .chart-bar svg {
    max-width: inherit;
  }
}
.chart-bar.vertical {
  max-width: 100%;
}
.chart-bar.vertical .bar {
  fill: url("#gradient-secondary__tertiary-horizontal");
}
.chart-bar.horizontal .bar {
  fill: url("#gradient-secondary__tertiary-vertical");
}
.chart-bar.dark.vertical .bar {
  fill: url("#gradient-secondary-d2__secondary-horizontal");
}
.chart-bar.dark.horizontal .bar {
  fill: url("#gradient-secondary-d2__secondary-vertical");
}
.chart-bar .label-text {
  font-weight: bold;
}
.chart-bar .bar-value {
  font-size: 0.875rem;
}
.chart-bar.negative.vertical .bar {
  fill: #ffffff;
}
.chart-bar.negative.horizontal .bar {
  fill: #ffffff;
}

.chips-filter {
  margin-bottom: 24px;
}
.chips-filter .chip.primary,
.chips-filter .chip.secondary,
.chips-filter .chip.disabled {
  cursor: default;
}
.chips-filter .chip.outline:hover {
  color: #37ca8c;
  border-color: #3de49d;
}
.chips-filter.primary-set .chip.outline:hover {
  color: #ff5d41;
  border-color: #ff8870;
}

.input-hierarchical > label {
  position: relative;
  margin-bottom: 0;
}
.input-hierarchical label h2 {
  font-size: 1em;
  font-weight: normal;
  line-height: 1.5;
}
.input-hierarchical .tree {
  padding-left: 0;
  overflow: hidden;
  list-style: none;
}
.input-hierarchical .tree ul {
  margin: 0;
  list-style: none;
}
.input-hierarchical .tree h3 {
  padding: 6px 0 4px 8px;
  margin: 0;
  font-size: 1.25em;
}
.input-hierarchical .tree li {
  clear: both;
}
.input-hierarchical .tree .leaf button {
  position: relative;
  width: 100%;
  height: auto;
  padding: 12px 24px;
  margin: 0 0 6px 0;
  font-weight: 400;
  line-height: 1;
  color: #333333;
  text-align: inherit;
  background-color: #ffffff;
  border: 2px solid #dfe1e5;
  border-radius: 32px;
  transition: 0.3s cubic-bezier(0.445, 0.05, 0.55, 0.95) all;
}
.input-hierarchical .tree .leaf button input[type=checkbox],
.input-hierarchical .tree .leaf button input[type=radio] {
  top: 17px;
  left: 25px;
  margin-bottom: 1.5rem;
}
.input-hierarchical .tree .leaf button input[type=checkbox]::before,
.input-hierarchical .tree .leaf button input[type=radio]::before {
  top: 0;
  left: 0;
  border-color: #0053d8;
}
.input-hierarchical .tree .leaf button input[type=checkbox] :not(:checked)::before,
.input-hierarchical .tree .leaf button input[type=radio] :not(:checked)::before {
  background-color: #ffffff;
}
.input-hierarchical .tree .leaf button:before {
  transform: rotate(-45deg);
  position: absolute;
  top: 16px;
  right: 16px;
  width: 8px;
  height: 8px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #0053d8;
  content: "";
}
.input-hierarchical .tree.in-search li {
  display: none;
}
.input-hierarchical .tree.in-search li.has-results {
  display: block;
}
.input-hierarchical .tree.in-search .leaf {
  display: none;
}
.input-hierarchical .tree.in-search .search-result {
  display: block;
}

.typeahead {
  position: relative;
  display: block;
  margin-bottom: 4px;
  font-size: 1rem;
}
@media print {
  .typeahead input {
    border-bottom: unset;
  }
}
.typeahead input.typeahead-text-input {
  position: relative;
  padding: 0.3em 2em 0.3em 2px;
  margin: 0;
  font-size: inherit;
  background: none;
  outline: none;
}
.typeahead .typeahead-text-display {
  position: absolute;
  width: 100%;
  height: 100%;
  padding: 0.3em 2em 0.3em 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.typeahead button.typeahead-toggler {
  position: absolute;
  top: calc(50% - 12px);
  right: 0;
  width: 24px;
  height: 24px;
  padding: 0;
  margin: 0;
  background: 0;
  border: 0;
  transition: transform 0.2s;
}
.typeahead button.typeahead-toggler:before {
  transform: rotate(45deg);
  position: absolute;
  top: calc(50% - 6px);
  right: calc(50% - 4.5px);
  width: 8px;
  height: 8px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #9a9a9a;
  content: "";
}
.typeahead button.typeahead-toggler:hover {
  background: none;
}
.typeahead button.typeahead-toggler.open {
  transform: rotate(-179.9deg);
}
.typeahead button.typeahead-toggler.open::before {
  border-color: #0053d8;
}
.typeahead .typeahead-option-container {
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  z-index: 90;
  display: flex;
  flex-direction: column;
  height: auto;
  margin-top: 4px;
  overflow: hidden;
  visibility: visible;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  transition: height 0.3s, visibility 0.3s;
}
.typeahead .typeahead-option-container.hidden {
  z-index: 89;
  display: flex;
  height: 0;
  visibility: hidden;
}
.typeahead.up .typeahead-option-container {
  top: initial;
  bottom: 100%;
}
.typeahead .typeahead-option-list {
  flex-shrink: 0;
  max-height: 250px;
  padding: 2px 0 0;
  margin: 0;
  overflow: auto;
  list-style: none;
  background: #ffffff;
}
.typeahead .typeahead-option-list .typeahead-option {
  position: relative;
  padding: 0.7em 1em;
  margin-top: -2px;
  color: #333333;
  cursor: pointer;
  border: 2px solid #dfe1e5;
}
.typeahead .typeahead-option-list .typeahead-option.hidden {
  display: none;
}
.typeahead .typeahead-option-list .typeahead-option[aria-selected] {
  z-index: 1;
  border-color: #0053d8;
}
.typeahead .typeahead-action {
  flex-shrink: 0;
  padding: 0.6em;
  margin: 0;
  border-radius: 0;
}
.typeahead.lg {
  font-size: 1.375rem;
}
.typeahead.lg .typeahead-text-display,
.typeahead.lg input.typeahead-text-input {
  padding: 0.75em 2em 0.75em 2px;
}
.typeahead.lg .typeahead-option-list {
  font-size: 1.125rem;
}
.typeahead.disabled {
  color: #777777;
}

li.timeline-item {
  position: relative;
  padding: 0 0 0 24px;
  list-style-type: none;
  border-left: solid 3px #dfe1e5;
  transition: 0.3s cubic-bezier(0.445, 0.05, 0.55, 0.95) all;
}
li.timeline-item:last-child {
  height: 0;
}
li.timeline-item span {
  position: relative;
  top: 0;
  font-weight: 500;
  color: #a7acb7;
  cursor: default;
  transition: 0.3s cubic-bezier(0.445, 0.05, 0.55, 0.95) opacity;
}
li.timeline-item span.progress-line {
  position: absolute;
  left: -3px;
  width: 3px;
  height: 0%;
  pointer-events: none;
  opacity: 0;
  transition: 0.3s all cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
li.timeline-item span.title {
  top: -21px;
}
li.timeline-item > span.title::before,
li.timeline-item > span.title::after {
  position: absolute;
  left: -34px;
  z-index: 9;
  display: block;
  width: 17px;
  height: 17px;
  background-color: #fafafa;
  border: solid 3px #dfe1e5;
  border-radius: 100%;
  content: "";
}
li.timeline-item > span.title::before {
  top: 5px;
}
li.timeline-item > span.title::after {
  display: none;
}
li.timeline-item.initiate span {
  color: #95a0af;
}
li.timeline-item.initiate > span.title::before {
  cursor: pointer;
  border-color: #c0c7d1;
}
li.timeline-item span.progress-line.initiate {
  background-color: #c0c7d1;
  opacity: 1;
}
li.timeline-item.complete span {
  color: #95a0af;
}
li.timeline-item.complete span.progress-line.current {
  background-color: #00c2df;
}
li.timeline-item.current span, li.timeline-item.complete span {
  color: #484848;
  cursor: pointer;
}
li.timeline-item.current span.progress-line, li.timeline-item.complete span.progress-line {
  opacity: 1;
}
li.timeline-item.current span.progress-line.current, li.timeline-item.complete span.progress-line.current {
  background-color: #00c2df;
}
li.timeline-item.current > span.title::before, li.timeline-item.complete > span.title::before {
  cursor: pointer;
  border-color: #00c2df;
}
li.timeline-item.current > span.title::before {
  animation: pulse 2s infinite;
}
li.timeline-item.current span {
  font-weight: 800;
  color: #333333;
}

@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(0, 194, 223, 0.6);
    box-shadow: 0 0 0 0 rgba(0, 194, 223, 0.6);
  }
  70% {
    -moz-box-shadow: 0 0 0 10px rgba(0, 194, 223, 0);
    box-shadow: 0 0 0 10px rgba(0, 194, 223, 0);
  }
  100% {
    -moz-box-shadow: 0 0 0 0 rgba(0, 194, 223, 0);
    box-shadow: 0 0 0 0 rgba(0, 194, 223, 0);
  }
}
.analysis-summary {
  display: flex;
  justify-content: space-between;
  cursor: pointer;
}
@media screen and (max-width: 999px) {
  .analysis-summary {
    flex-grow: 1;
  }
  .analysis-summary .analysis-summary-icon {
    margin-right: 16px;
  }
  .analysis-summary .analysis-summary-label {
    display: none;
  }
}
.analysis-summary.no-label {
  flex-grow: 1;
}
.analysis-summary.no-label .analysis-summary-icon {
  margin-right: 16px;
}
.analysis-summary.no-label .analysis-summary-label {
  display: none;
}
.analysis-summary.no-description .analysis-summary-description {
  display: none;
}
.analysis-summary.compact.vertical > div {
  margin-bottom: 8px;
}
.analysis-summary.vertical {
  flex-direction: column;
}
.analysis-summary.vertical > div {
  align-items: center;
  margin-bottom: 16px;
}
.analysis-summary.vertical > div b {
  margin-right: 4px;
}
.analysis-summary.vertical > div:nth-child(n+2) {
  padding-left: inherit;
}
@media screen and (max-width: 999px) {
  .analysis-summary.vertical {
    flex-grow: 1;
    flex-direction: row;
    margin-top: 24px;
    margin-bottom: 24px;
  }
  .analysis-summary.vertical .analysis-summary-icon {
    margin-right: 16px;
  }
  .analysis-summary.vertical .analysis-summary-label {
    display: none;
  }
  .analysis-summary.vertical > div {
    margin-bottom: inherit;
  }
  .analysis-summary.vertical .analysis-summary-description {
    display: none;
  }
}
.analysis-summary.large {
  flex-grow: 1;
  justify-content: space-between;
  margin-top: 24px;
  margin-bottom: 24px;
}
.analysis-summary.large .analysis-summary-icon {
  margin-right: 16px;
}
.analysis-summary.large .analysis-summary-label {
  display: none;
}
.analysis-summary.large > div {
  align-items: center;
  flex-direction: row;
}
.analysis-summary.large .analysis-summary-description {
  display: none;
}
@media screen and (min-width: 481px) {
  .analysis-summary.large {
    justify-content: center;
  }
  .analysis-summary.large > div {
    align-items: center;
    flex-direction: column;
  }
  .analysis-summary.large .analysis-summary-icon {
    width: 76px;
    height: 76px;
    margin-right: 0;
    margin-bottom: 24px;
  }
  .analysis-summary.large .analysis-summary-icon svg {
    width: 76px;
    height: 76px;
  }
  .analysis-summary.large .analysis-summary-icon .small {
    display: none;
  }
  .analysis-summary.large .analysis-summary-icon .large {
    display: block;
  }
  .analysis-summary.large .analysis-summary-value {
    display: flex;
    align-items: center;
    flex-direction: column;
  }
  .analysis-summary.large .analysis-summary-label {
    display: inline;
  }
  .analysis-summary.large .analysis-summary-description {
    display: block;
    text-align: center;
  }
}
.analysis-summary > div {
  display: flex;
  align-items: center;
}
.analysis-summary > div:nth-child(n+2) {
  padding-left: 60px;
}
@media screen and (max-width: 680px) {
  .analysis-summary > div:nth-child(n+2) {
    padding-left: 24px;
  }
}
.analysis-summary > div.good .analysis-summary-icon {
  fill: #44f5aa;
}
.analysis-summary > div.ok .analysis-summary-icon {
  fill: #ffe200;
}
.analysis-summary > div.bad .analysis-summary-icon {
  fill: #ff5d41;
}
.analysis-summary > div > * {
  display: inline-block;
}
.analysis-summary .analysis-summary-icon {
  width: 16px;
  height: 16px;
  margin-right: 16px;
}
@media screen and (max-width: 680px) {
  .analysis-summary .analysis-summary-icon {
    margin-right: 8px;
  }
}
.analysis-summary .analysis-summary-icon svg {
  width: 16px;
  height: 16px;
}
.analysis-summary .analysis-summary-icon .large {
  display: none;
}
.analysis-summary .analysis-summary-value {
  margin-top: 2px;
}

.demo .analysis-summary {
  opacity: 0.5;
}

.menu-bar {
  display: flex;
  justify-content: space-evenly;
  float: right;
  width: 25vw;
  height: 100%;
  padding-left: 0;
  margin-bottom: 0;
  background: #ffffff;
}
@media screen and (max-width: 1280px) {
  .menu-bar {
    width: 33vw;
  }
}
@media screen and (max-width: 1024px) {
  .menu-bar {
    width: 50vw;
  }
}
@media screen and (max-width: 680px) {
  .menu-bar {
    width: 100vw;
  }
}
.menu-bar li {
  position: relative;
  display: inline-block;
  width: 20%;
  height: 100%;
  text-align: center;
}
.menu-bar li .toggle {
  width: 68px;
}
.menu-bar .menu-button {
  width: 100%;
  height: 100%;
  transition: color 0.2s ease-in-out;
}
.menu-bar .menu-button i {
  font-size: 24px;
}
.menu-bar .menu-button i,
.menu-bar .menu-button img {
  position: absolute;
  top: 50%;
  left: 50%;
  padding-top: 0;
  transform: translateX(-50%) translateY(-50%);
}
.menu-bar .menu-button img {
  width: 28px;
}
.menu-bar .menu-button i.close {
  font-size: 24px;
}
.menu-bar .menu-button:hover,
.menu-bar .menu-button:active,
.menu-bar .menu-button:focus {
  color: #0053d8;
}
.menu-bar a[data-nav=dots] i {
  font-size: 19px;
}
.menu-bar a[data-nav=profile] i {
  font-size: 28px;
}
@media screen and (max-width: 680px) {
  .menu-bar {
    position: fixed;
    bottom: 0;
    z-index: 10;
    height: 68px;
  }
}

.menu-bar.mixed-links {
  justify-content: flex-end;
  width: 100%;
}
@media screen and (max-width: 1024px) {
  .menu-bar.mixed-links {
    justify-content: space-around;
    width: 100vw;
  }
}
.menu-bar.mixed-links li {
  width: auto;
}
.menu-bar.mixed-links li.text-links {
  display: none;
}
@media screen and (max-width: 680px) {
  .menu-bar.mixed-links li.text-links {
    display: block;
  }
}
@media screen and (max-width: 680px) {
  .menu-bar.mixed-links li.text {
    display: none;
  }
}
.menu-bar.mixed-links li.text a {
  display: block;
  padding: 20px 48px 0;
  font-weight: 700;
}

.menu-button:after {
  transform: rotate(-135deg);
  position: absolute;
  top: 52px;
  right: 50%;
  width: 6px;
  height: 6px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: transparent;
  content: "";
}
.menu-button::after {
  transform: rotate(-135deg) translateX(-70%);
}
.menu-button:hover::after {
  border-color: #9a9a9a;
}
@media screen and (max-width: 680px) {
  .menu-button:hover::after {
    display: none;
  }
}
.menu-button.active::after, .menu-button.current::after {
  border-color: #0053d8;
}
@media screen and (max-width: 680px) {
  .menu-button.active::after, .menu-button.current::after {
    display: block;
  }
}

.app.dashboard .menu-button.dashboard::after {
  border-color: #0053d8;
}
.app.dashboard .menu-button.dashboard.inactive::after {
  border-color: #9a9a9a;
}

.side-cap .center {
  margin: auto;
  max-width: 480px;
}
.side-cap img {
  width: 100%;
  margin-left: 24px;
}
.side-cap div:last-child {
  padding: 0 48px 0;
}
.side-cap:nth-of-type(even) div:last-child {
  padding: 0 48px 0;
}
@media screen and (max-width: 768px) {
  .side-cap div:last-child {
    padding: 0;
  }
  .side-cap:nth-of-type(even) div:last-child {
    padding: 0;
  }
}

.question-group {
  position: absolute;
  top: 1.75rem;
  z-index: -1;
  opacity: 0;
  visibility: hidden;
  overflow: scroll;
  transform: translateY(50vh);
  transition: 0.5s cubic-bezier(0.86, 0, 0.07, 1) all;
}
@media screen and (max-width: 680px) {
  .question-group {
    top: 0;
    margin: 0;
  }
}
.question-group.active {
  z-index: 2;
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  overflow: visible;
}
.question-group.prev {
  transform: translateY(-50vh);
  overflow: visible;
  visibility: visible;
}
.question-group.prev .input-hierarchical {
  display: none;
}
.question-group > legend {
  margin-bottom: 0;
}
@media screen and (max-width: 680px) {
  .question-group {
    margin-bottom: 20px;
  }
}
.input-group {
  position: absolute;
  pointer-events: none;
}
@media screen and (max-width: 680px) {
  .input-group {
    margin-top: 4px;
  }
}
@media screen and (max-width: 768px) {
  .input-group {
    min-height: 100vh;
    margin-bottom: 36px;
  }
}
.input-group > legend {
  max-width: 100%;
  min-height: 96px;
  margin: 0 0 1rem;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transform: translateX(400px);
  transition: 0.5s cubic-bezier(0.86, 0, 0.07, 1) transform, 0.5s cubic-bezier(1, 0, 0, 1) opacity, 0s visibility 0.5s;
}
.input-group > legend p:last-child {
  margin-bottom: 0;
}
@media screen and (max-width: 680px) {
  .input-group > legend {
    min-height: 24px;
    margin-bottom: 24px;
    font-size: 1.25rem;
    line-height: 1.3;
  }
}
.input-group label.checkbox.emoji::after,
.input-group label.radio.emoji::after {
  content: "";
  position: absolute;
  right: 12px;
  top: 10px;
  width: 40px;
  height: 40px;
  display: block;
  background-size: 40px 40px;
}
@media screen and (max-width: 680px) {
  .input-group label.checkbox.emoji::after,
  .input-group label.radio.emoji::after {
    right: auto;
    left: 15px;
  }
}
@media screen and (max-width: 680px) {
  .input-group label.checkbox.emoji,
  .input-group label.radio.emoji {
    padding-left: 70px;
  }
}
.input-group label.checkbox.emoji.supersad::after,
.input-group label.radio.emoji.supersad::after {
  background-image: url(../assets/img/supersad.png);
}
.input-group label.checkbox.emoji.verysad::after,
.input-group label.radio.emoji.verysad::after {
  background-image: url(../assets/img/verysad.png);
}
.input-group label.checkbox.emoji.sad::after,
.input-group label.radio.emoji.sad::after {
  background-image: url(../assets/img/sad.png);
}
.input-group label.checkbox.emoji.neutral::after,
.input-group label.radio.emoji.neutral::after {
  background-image: url(../assets/img/neutral.png);
}
.input-group label.checkbox.emoji.happy::after,
.input-group label.radio.emoji.happy::after {
  background-image: url(../assets/img/happy.png);
}
.input-group label.checkbox.emoji.veryhappy::after,
.input-group label.radio.emoji.veryhappy::after {
  background-image: url(../assets/img/veryhappy.png);
}
.input-group label.checkbox.emoji.superhappy::after,
.input-group label.radio.emoji.superhappy::after {
  background-image: url(../assets/img/superhappy.png);
}
@media screen and (max-height: 900px) and (min-width: 680px) {
  .input-group label.checkbox,
  .input-group label.radio {
    padding-top: 5px;
    padding-bottom: 6px;
    padding-left: 53px;
    margin-bottom: 8px;
  }
  .input-group label.checkbox.emoji::after,
  .input-group label.radio.emoji::after {
    top: 3px;
    right: 5px;
    width: 30px;
    height: 30px;
    background-size: 30px 30px;
  }
  .input-group label.checkbox input[type=radio],
  .input-group label.radio input[type=radio] {
    top: 7px;
    left: 16px;
  }
}
.input-group a.skip {
  float: right;
  padding: 18px 8px;
  margin-top: 24px;
  font-weight: bold;
  cursor: pointer;
}
.input-group button,
.input-group input,
.input-group label,
.input-group a {
  display: none;
}
.input-group.active {
  position: relative;
  pointer-events: auto;
}
.input-group.active legend {
  pointer-events: auto;
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
  transition: 0.5s cubic-bezier(0.86, 0, 0.07, 1) transform, 0.5s cubic-bezier(1, 0, 0, 1) opacity, 0s visibility 0s;
}
.input-group.active button,
.input-group.active input,
.input-group.active label,
.input-group.active a {
  display: block;
}
.input-group.active label.suffix input {
  display: inline-block;
}
.input-group.prev legend {
  opacity: 0;
  transform: translateX(-150px);
  transition: 0.5s cubic-bezier(0.86, 0, 0.07, 1) transform, 0.5s cubic-bezier(1, 0, 0, 1) opacity, 0s visibility 0.5s;
}
.input-group label {
  margin-bottom: 0;
}
.input-group .scroll-container {
  height: auto;
  max-width: calc(100vw - 24px * 2);
  max-height: 50vh;
  padding: 16px;
  overflow-y: auto;
  font-size: 1rem;
  border: 1px solid #f1f1ea;
  border-radius: 4px;
}
.input-group button {
  float: right;
  height: 60px;
  margin: 16px 0 96px 24px;
}

.chapter {
  position: relative;
  margin: 0;
}

.flex .survey-info .tile {
  position: fixed;
  bottom: 0;
  display: inline-block;
  width: inherit;
  height: auto;
  padding-bottom: 94px;
  transform: translateY(100%);
  transition: 0.3s cubic-bezier(0.86, 0, 0.07, 1) transform;
}
.flex .survey-info .tile.in, .flex .survey-info .tile.show {
  z-index: 9;
  transform: translateY(0%);
}

.survey-info .btn.icon {
  right: 48px;
  bottom: 48px;
}
.survey-info .btn.icon.toggle {
  position: absolute;
  right: 48px;
  bottom: 48px;
  display: inline-block;
}
.survey-info .btn.icon.toggle.lang {
  right: 120px;
  height: 50px;
  padding-top: 15px;
  font-size: 1.25em;
  font-weight: normal;
}
.survey-info[data-target=lang] .tile {
  width: 33.333%;
  height: 680px;
}
@media screen and (min-width: 2400px) {
  .survey-info[data-target=lang] .tile {
    width: 25%;
  }
}
.survey-info[data-target=lang] .tile > nav.navigation {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.survey-info[data-target=lang] .tile > nav.navigation .nav-back {
  top: 12px;
  left: -4px;
}
.survey-info[data-target=lang] .tile > nav.navigation .nav-back::before {
  border-color: #ffffff;
}
.survey-info[data-target=lang] .tile > nav.navigation ul.menu,
.survey-info[data-target=lang] .tile > nav.navigation ul.menu div {
  padding-right: 0;
  padding-left: 0;
}
.survey-info[data-target=lang] .tile > nav.navigation ul.menu .btn,
.survey-info[data-target=lang] .tile > nav.navigation ul.menu div .btn {
  text-align: center;
  border-bottom-width: 2px;
}
.survey-info[data-target=lang] .tile > nav.navigation ul.menu li a,
.survey-info[data-target=lang] .tile > nav.navigation ul.menu div li a {
  color: #ffffff;
}
.survey-info[data-target=lang] .tile > nav.navigation ul.menu li a::before,
.survey-info[data-target=lang] .tile > nav.navigation ul.menu div li a::before {
  border-color: #ffffff;
}
.survey-info[data-target=lang] .tile p {
  display: block;
  width: 100%;
}

nav.tabs {
  display: inline-block;
  margin-right: 24px;
}
nav.tabs[data-tab-bar=analysis] {
  min-width: 202px;
}

.tabs ul {
  height: 68px;
  margin-bottom: 0;
}
.tabs ul li {
  display: flex;
  align-items: center;
  height: 100%;
  margin: 0 24px 0 0;
  border-bottom: 2px solid transparent;
}
.tabs ul li a,
.tabs ul li a:visited {
  color: #333333;
}
.tabs ul li.active {
  font-weight: bold;
  border-bottom: 2px solid #333333;
}

.tab-panel:not(.active) {
  display: none;
}

/* for px value (value, 'px'), for em value (value, 'em') */
/* for px value (value, 'px'), for em value (value, 'em') */
/* for px value (value, 'px'), for em value (value, 'em') */
/* for px value (value, 'px'), for em value (value, 'em') */
/* for px value (value, 'px'), for em value (value, 'em') */
/* for px value (value, 'px'), for em value (value, 'em') */
.tile,
.flex .tile {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 56px 64px;
  hyphens: auto;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
@media only screen and (max-width: 420px) {
  .tile,
  .flex .tile {
    padding: 32px 36px;
  }
}
@media only screen and (max-width: 580px) {
  .tile,
  .flex .tile {
    min-height: 80vw;
  }
}
@media screen and (min-width: 581px) and (max-width: 680px) {
  .tile,
  .flex .tile {
    min-height: 60vw;
  }
}
@media screen and (min-width: 681px) and (max-width: 999px) {
  .tile,
  .flex .tile {
    min-height: 350px;
  }
}
.tile.no-overflow,
.flex .tile.no-overflow {
  overflow: hidden;
}
.tile.center .content,
.flex .tile.center .content {
  z-index: 1;
  width: 100%;
  max-width: 400px;
}
.tile.content-bottom .content,
.flex .tile.content-bottom .content {
  margin-top: auto;
}
.tile.content-bottom.extra-margin .content,
.flex .tile.content-bottom.extra-margin .content {
  margin-bottom: 48px;
}
.tile.content-top,
.flex .tile.content-top {
  justify-content: flex-start;
}
.tile.content-top .actions,
.flex .tile.content-top .actions {
  margin-bottom: 0;
  margin-top: auto;
}
.tile.with-header-button header,
.flex .tile.with-header-button header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
.tile.baseline,
.flex .tile.baseline {
  justify-content: baseline;
}
.tile.spacey > *,
.flex .tile.spacey > * {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}
.tile.spacey > * > div,
.flex .tile.spacey > * > div {
  margin: 24px;
}
.tile.horizontal,
.flex .tile.horizontal {
  flex-direction: row;
}
.tile.horizontal > *:nth-child(1),
.flex .tile.horizontal > *:nth-child(1) {
  margin-right: 16px;
}
@media only screen and (max-width: 420px) {
  .tile.horizontal,
  .flex .tile.horizontal {
    flex-direction: column;
  }
  .tile.horizontal > *,
  .flex .tile.horizontal > * {
    align-self: center;
    text-align: center;
  }
}
.tile img,
.flex .tile img {
  align-self: center;
  max-width: 256px;
  max-height: 100%;
}
.tile img.small,
.flex .tile img.small {
  max-width: 180px;
}
.tile img.background,
.flex .tile img.background {
  z-index: 0;
  width: 100%;
  height: 100%;
  max-width: unset;
  max-height: unset;
  min-width: unset;
  min-height: unset;
  opacity: 0.1;
  object-fit: cover;
}
.tile .play,
.flex .tile .play {
  width: 56px;
  margin: 24px;
}
.tile h1,
.flex .tile h1 {
  font-size: 2.25em;
  font-weight: 700;
}
.tile h2,
.flex .tile h2 {
  margin: 0 0 4px;
  font-size: 1.25em;
  font-weight: 700;
}
.tile h2.large,
.flex .tile h2.large {
  margin-bottom: 16px;
  font-size: 1.75em;
}
.tile h3,
.flex .tile h3 {
  margin: 0;
  font-size: 1em;
  font-weight: 700;
}
.tile h4, .tile .module-list-disabled > div p, .module-list-disabled > div .tile p,
.flex .tile h4,
.flex .tile .module-list-disabled > div p,
.module-list-disabled > div .flex .tile p {
  font-size: 1.5em;
  font-weight: 700;
}
.tile h5,
.flex .tile h5 {
  font-size: 1.25em;
  font-weight: 700;
}
.tile h6,
.flex .tile h6 {
  font-size: 1.05em;
  font-weight: 400;
}
.tile h4, .tile .module-list-disabled > div p, .module-list-disabled > div .tile p,
.tile h5,
.tile h6,
.flex .tile h4,
.flex .tile .module-list-disabled > div p,
.module-list-disabled > div .flex .tile p,
.flex .tile h5,
.flex .tile h6 {
  margin-top: 0;
}
.tile.blue *::selection, .tooltip-container .tile.tooltip *::selection,
.flex .tile.blue *::selection,
.flex .tooltip-container .tile.tooltip *::selection,
.tooltip-container .flex .tile.tooltip *::selection {
  background-color: #00c2df;
}
.tile.grey,
.flex .tile.grey {
  background-image: linear-gradient(60deg, whitesmoke, #fafafa 50%, white);
}
.tile.aqua .actions .btn.ghost:hover,
.flex .tile.aqua .actions .btn.ghost:hover {
  color: #00c2df;
}
.tile.green .actions .btn.ghost:hover,
.flex .tile.green .actions .btn.ghost:hover {
  color: #37ca8c;
}
.tile .actions,
.flex .tile .actions {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
.tile .actions .btn,
.flex .tile .actions .btn {
  margin-bottom: 0;
}
.tile .actions .btn.ghost,
.flex .tile .actions .btn.ghost {
  margin-left: -36px;
}
.tile .actions .btn.ghost:hover,
.flex .tile .actions .btn.ghost:hover {
  background-color: #fbfbf6;
}
.tile .actions .right,
.flex .tile .actions .right {
  align-self: flex-end;
}

ul.pagination {
  position: absolute;
  bottom: 48px;
  width: 100%;
  display: flex;
  align-self: flex-end;
  justify-content: center;
  padding: 0;
  margin: 0;
  list-style: none;
}
@media screen and (max-width: 1024px) {
  ul.pagination {
    bottom: auto;
    top: 16px;
  }
}
ul.pagination li {
  display: block;
  width: 12px;
  height: 12px;
  margin: 0 8px;
  border-radius: 50%;
  border: 2px solid #333333;
  cursor: pointer;
}
ul.pagination li.active {
  background: #333333;
}
@media screen and (max-width: 680px) {
  ul.pagination li {
    width: 8px;
    height: 8px;
  }
}
ul.pagination.negative li {
  border-color: #ffffff;
}
ul.pagination.negative li.active {
  background: #ffffff;
}

nav.navigation.multi-level {
  position: absolute;
  width: 100%;
  height: 100%;
}
nav.navigation.multi-level .breadcrumbs-container {
  position: relative;
}
nav.navigation.multi-level .breadcrumbs-container .ancestors,
nav.navigation.multi-level .breadcrumbs-container .parent {
  display: inline;
  font-weight: 700;
}
nav.navigation.multi-level .breadcrumbs-container .ancestors::before {
  content: "…";
}
nav.navigation.multi-level .breadcrumbs-container .ancestors::after {
  margin: 0 2px 0 6px;
  content: "/";
}
nav.navigation.multi-level .breadcrumbs-container .ancestors:hover {
  cursor: pointer;
}
nav.navigation.multi-level .breadcrumbs-container .ancestors ul {
  position: absolute;
  right: 0;
  left: 0;
  display: none;
  padding: 16px 24px;
  margin-top: 8px;
  background: #ffffff;
  box-shadow: 0 5px 15px -8px rgba(0, 0, 0, 0.4);
}
nav.navigation.multi-level .breadcrumbs-container .ancestors ul::before {
  position: absolute;
  top: -5px;
  left: 30px;
  width: 10px;
  height: 10px;
  background: #ffffff;
  content: "";
  transform: rotate(45deg);
  box-shadow: 0 5px 15px -8px rgba(0, 0, 0, 0.4);
}
nav.navigation.multi-level .breadcrumbs-container .ancestors ul.show {
  z-index: 1100;
  display: block;
}
nav.navigation.multi-level .breadcrumbs-container .ancestors ul li {
  margin-bottom: 12px;
  font-size: 0.875rem;
  line-height: 1.3;
}
nav.navigation.multi-level .breadcrumbs-container .ancestors ul li:nth-of-type(2) {
  padding-left: 8px;
}
nav.navigation.multi-level .breadcrumbs-container .ancestors ul li:nth-of-type(3) {
  padding-left: 16px;
}
nav.navigation.multi-level .breadcrumbs-container .ancestors ul li:nth-of-type(4) {
  padding-left: 24px;
}
nav.navigation.multi-level .breadcrumbs-container .ancestors ul li:last-of-type {
  margin-bottom: 0;
}
nav.navigation.multi-level .breadcrumbs-container .parent {
  font-size: 1.25rem;
}
nav.navigation.multi-level .nav-back {
  position: relative;
  top: 16px;
  left: 20px;
  z-index: 1000;
  padding-left: 20px;
  font-weight: 700;
  visibility: hidden;
  transition: all 0.2s ease-in-out, visibility 0s ease-in;
}
nav.navigation.multi-level .nav-back:before {
  transform: rotate(135deg);
  position: absolute;
  top: 8px;
  right: calc(100% - 14px);
  width: 8px;
  height: 8px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #0053d8;
  content: "";
}
nav.navigation.multi-level .nav-back.sub-open {
  visibility: visible;
}
nav.navigation.multi-level .nav-back:hover {
  color: #153a77;
  cursor: pointer;
}
nav.navigation.multi-level .nav-back:hover:before {
  transform: rotate(135deg);
  position: absolute;
  top: 8px;
  right: calc(100% - 14px);
  width: 8px;
  height: 8px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #153a77;
  content: "";
}
nav.navigation.multi-level ul.menu {
  margin-bottom: 0;
}
nav.navigation.multi-level ul.menu.ready {
  transition: 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955) transform;
}
nav.navigation.multi-level ul.menu.ready ul,
nav.navigation.multi-level ul.menu.ready div {
  transition: 0.3s transform cubic-bezier(0.785, 0.135, 0.15, 0.86);
}
@media screen and (max-width: 1024px) {
  nav.navigation.multi-level ul.menu {
    position: relative;
    left: 0;
    justify-content: center;
    width: 100%;
    padding-top: 32px;
    padding-right: 24px;
    padding-left: 24px;
  }
  nav.navigation.multi-level ul.menu.hide,
  nav.navigation.multi-level ul.menu ul.hide {
    transform: translateX(-100%);
    transition-delay: 0;
  }
  nav.navigation.multi-level ul.menu .menu-section {
    margin-top: 50px;
  }
  nav.navigation.multi-level ul.menu > li:not(:nth-last-child(-n+2)),
  nav.navigation.multi-level ul.menu li li {
    position: static;
    display: block;
    width: 100%;
    margin-bottom: 0;
    border-bottom: 1px solid #dfe1e5;
  }
  nav.navigation.multi-level ul.menu > li:not(:nth-last-child(-n+2)):last-child,
  nav.navigation.multi-level ul.menu li li:last-child {
    margin-bottom: 48px;
  }
  nav.navigation.multi-level ul.menu > li:not(:nth-last-child(-n+2)) a,
  nav.navigation.multi-level ul.menu li li a {
    position: relative;
    display: block;
    width: 100%;
    min-height: 48px;
    padding: 12px 18px 12px 4px;
    margin-right: 0;
    margin-left: 0;
    transition: all 0.2s ease-in-out;
  }
  nav.navigation.multi-level ul.menu > li:not(:nth-last-child(-n+2)) a.has-children:before,
  nav.navigation.multi-level ul.menu li li a.has-children:before {
    transform: rotate(-45deg);
    position: absolute;
    top: calc(50% - 3px);
    right: 8px;
    width: 8px;
    height: 8px;
    border-right: 2px solid;
    border-bottom: 2px solid;
    border-color: #333333;
    content: "";
  }
  nav.navigation.multi-level ul.menu > li:not(:nth-last-child(-n+2)) a.has-children:hover, nav.navigation.multi-level ul.menu > li:not(:nth-last-child(-n+2)) a:hover,
  nav.navigation.multi-level ul.menu li li a.has-children:hover,
  nav.navigation.multi-level ul.menu li li a:hover {
    color: #153a77;
    cursor: pointer;
  }
  nav.navigation.multi-level ul.menu > li:not(:nth-last-child(-n+2)) a.has-children:hover:before,
  nav.navigation.multi-level ul.menu li li a.has-children:hover:before {
    transform: rotate(-45deg);
    position: absolute;
    top: calc(50% - 3px);
    right: 8px;
    width: 8px;
    height: 8px;
    border-right: 2px solid;
    border-bottom: 2px solid;
    border-color: #153a77;
    content: "";
  }
  nav.navigation.multi-level ul.menu > li:not(:nth-last-child(-n+2)) a span,
  nav.navigation.multi-level ul.menu li li a span {
    padding-top: 0;
    font-size: inherit;
    font-weight: 400;
  }
  nav.navigation.multi-level ul.menu > li:not(:nth-last-child(-n+2))::after,
  nav.navigation.multi-level ul.menu li li::after {
    content: "";
  }
  nav.navigation.multi-level ul.menu > li:not(:nth-last-child(-n+2)) > div,
  nav.navigation.multi-level ul.menu > li:not(:nth-last-child(-n+2)) ul,
  nav.navigation.multi-level ul.menu li li > div,
  nav.navigation.multi-level ul.menu li li ul {
    position: absolute;
    top: 0;
    left: 200%;
    width: 100%;
    height: 0;
    transform: translateX(0);
  }
  nav.navigation.multi-level ul.menu > li:not(:nth-last-child(-n+2)) ul,
  nav.navigation.multi-level ul.menu li li ul {
    padding-top: 32px;
    padding-right: 24px;
    padding-left: 24px;
  }
  nav.navigation.multi-level ul.menu > li:not(:nth-last-child(-n+2)).in > ul,
  nav.navigation.multi-level ul.menu > li:not(:nth-last-child(-n+2)).in > div,
  nav.navigation.multi-level ul.menu li li.in > ul,
  nav.navigation.multi-level ul.menu li li.in > div {
    transform: translateX(-100%);
  }
  nav.navigation.multi-level ul.menu > li:not(:nth-last-child(-n+2)).in > ul.hide,
  nav.navigation.multi-level ul.menu li li.in > ul.hide {
    transform: translateX(-200%);
  }
  nav.navigation.multi-level ul.menu > li:nth-last-child(-n+2) {
    opacity: 1;
    transition: 0.2s 0.15s all cubic-bezier(0.785, 0.135, 0.15, 0.86);
  }
  nav.navigation.multi-level ul.menu > li:nth-last-child(-n+2).hide {
    opacity: 0;
    transition: 0s all cubic-bezier(0.785, 0.135, 0.15, 0.86);
  }
  nav.navigation.multi-level ul.menu > li:nth-last-child(-n+2) a.btn {
    padding: 0.5em 1.5em;
    margin-top: 24px;
  }
  nav.navigation.multi-level ul.menu > li:nth-last-child(-n+2) .btn.sm.ghost, nav.navigation.multi-level ul.menu > li:nth-last-child(-n+2) .tooltip-container.sm .tooltip .btn.ghost.tooltip-close, .tooltip-container.sm .tooltip nav.navigation.multi-level ul.menu > li:nth-last-child(-n+2) .btn.ghost.tooltip-close {
    color: #0053d8;
    background-color: transparent;
    border-color: #0053d8;
  }
  nav.navigation.multi-level ul.menu > li:nth-last-child(-n+2) .btn.sm.ghost:hover, nav.navigation.multi-level ul.menu > li:nth-last-child(-n+2) .tooltip-container.sm .tooltip .btn.ghost.tooltip-close:hover, .tooltip-container.sm .tooltip nav.navigation.multi-level ul.menu > li:nth-last-child(-n+2) .btn.ghost.tooltip-close:hover {
    color: #ffffff;
    background-color: #0053d8;
  }
}

@media screen and (max-width: 768px) {
  .scale {
    margin-bottom: 8px;
  }
}
@media print {
  .scale {
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
  }
}
.scale.change .scale-bar:hover {
  background-image: unset;
}
.scale.kmuv .chart-scale .scale-bar {
  background-color: #dfe1e5;
}
.scale.kmuv .chart-scale .scale-bar::before {
  content: unset;
}
.scale.kmuv .chart-scale .scale-bar::after {
  width: 100%;
  background-color: unset;
  top: -20px;
  left: 0;
  content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 834.85 8'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %23000000; stroke-miterlimit: 10; stroke-width: 2px; %7D %3C/style%3E%3C/defs%3E%3Cline class='cls-1' x1='.5' y1='8' x2='.5'/%3E%3Cline class='cls-1' x1='834.35' x2='834.35' y2='8'/%3E%3Cline class='cls-1' x1='625.89' x2='625.89' y2='8'/%3E%3Cline class='cls-1' x1='417.43' x2='417.43' y2='8'/%3E%3Cline class='cls-1' x1='208.96' x2='208.96' y2='8'/%3E%3C/svg%3E");
}
.scale.kmuv .chart-scale .scale-bar:hover {
  background-image: unset;
}
.scale.kmuv .sub-scale-figure .chart-scale .scale-bar::after {
  content: unset;
}
.scale.kmuv .sub-scale-figure.sub-scale-figure .open-modal.btn {
  background: transparent;
  color: #0053d8;
  border-color: #0053d8;
}
.scale.kmuv .scale-detail {
  max-width: 940px;
  width: calc(100% - 24px);
  padding-left: 0;
}
.scale .accordion {
  padding-bottom: 0;
}
.scale .accordion .scale-figure {
  padding: 6px 0 6px 24px;
}
.scale .accordion .scale-figure .scale-info {
  font-weight: 700;
}
.scale .accordion .scale-figure.sub-scale-figure .scale-info {
  font-weight: 400;
}
@media print {
  .scale .accordion .scale-figure {
    padding-left: 0;
  }
}
.scale .accordion-header {
  padding-right: 0;
}
.scale .accordion-toggler {
  top: 8px;
  right: unset;
  left: 0;
}
.scale .accordion-body {
  padding: 0 0 0 24px;
}
.scale .scale-figure {
  display: flex;
  align-items: baseline;
  padding: 6px 0;
  margin-bottom: 0;
  background-color: transparent;
}
@media screen and (max-width: 768px) {
  .scale .scale-figure {
    flex-wrap: wrap;
  }
}
.scale .scale-figure .sub-scale-count,
.scale .scale-figure .tendency-sign {
  display: block;
  flex-shrink: 0;
  width: 30px;
  padding: 0 5px;
}
@media screen and (max-width: 768px) {
  .scale .scale-figure .sub-scale-count,
  .scale .scale-figure .tendency-sign {
    width: 30px;
  }
}
.scale .scale-figure .sub-scale-count {
  text-align: center;
}
.scale .scale-figure .tendency-sign {
  padding: 0 10px 0 0;
  text-align: right;
}
.scale .scale-figure.sub-scale-figure {
  padding-left: 0;
}
.scale .scale-figure.sub-scale-figure .scale-tip .fwsj-icon, .scale .scale-figure.sub-scale-figure .scale-tip .dot.checked-dot::before, .scale .scale-figure.sub-scale-figure .scale-tip .organigram-item .organigram-item-inner.overview .count::before, .organigram-item .organigram-item-inner.overview .scale .scale-figure.sub-scale-figure .scale-tip .count::before, .scale .scale-figure.sub-scale-figure .scale-tip .chart-job-stress-index .wave-warning-icon, .chart-job-stress-index .scale .scale-figure.sub-scale-figure .scale-tip .wave-warning-icon, .scale .scale-figure.sub-scale-figure .scale-tip .scale-value::before {
  padding-left: 5px;
  margin-top: -3px;
  font-size: 1.1875rem;
}
.scale .scale-figure.sub-scale-figure .open-modal.btn {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  padding: 0;
  margin: 0;
  margin-left: 0.5em;
  font-size: 0.7rem;
  font-weight: bold;
  line-height: 1;
  color: #ffffff;
  vertical-align: 30%;
  background: rgba(0, 83, 216, 0.9);
}
@media (max-width: 500px) {
  .scale .scale-figure.sub-scale-figure .open-modal.btn {
    width: 15px;
    height: 15px;
    font-size: 0.525rem;
  }
}
.scale .sub-scales-title {
  margin: 12px 0 4px 30px;
}
.scale .scale-info {
  margin-top: 0;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .scale .scale-info {
    margin-left: 30px;
  }
}
@media (max-width: 500px) {
  .scale .scale-info {
    font-size: 0.75rem;
  }
}
.scale .scale-detail {
  max-width: 540px;
  padding-left: 30px;
  margin-top: 16px;
  margin-bottom: 48px;
}
.scale .scale-detail .tendency {
  position: relative;
  margin-bottom: 12px;
}
.scale .scale-detail .tendency .tendency-sign {
  position: absolute;
  left: -30px;
  width: 30px;
  padding: 0 10px 0 0;
  text-align: right;
}
.scale .scale-detail .scale-tip {
  display: flex;
  align-items: center;
  margin-top: 16px;
}
.scale .scale-detail .scale-tip .fwsj-icon, .scale .scale-detail .scale-tip .dot.checked-dot::before, .scale .scale-detail .scale-tip .organigram-item .organigram-item-inner.overview .count::before, .organigram-item .organigram-item-inner.overview .scale .scale-detail .scale-tip .count::before, .scale .scale-detail .scale-tip .chart-job-stress-index .wave-warning-icon, .chart-job-stress-index .scale .scale-detail .scale-tip .wave-warning-icon, .scale .scale-detail .scale-tip .scale-value::before {
  margin-right: 8px;
  font-size: 2rem;
}
.scale .tendency,
.scale .tendency-sign {
  font-weight: 700;
}
.scale .tendency.better,
.scale .tendency-sign.better {
  color: #08A160;
}
.scale .tendency.worse,
.scale .tendency-sign.worse {
  color: #ff5d41;
}
.scale .tendency-sign.worse {
  letter-spacing: 1px;
}

.scale-title {
  margin-bottom: 8px;
  font-weight: 700;
}

.scale-compare {
  width: 100%;
}
.scale-compare.no-subscales {
  margin-left: 54px;
}
.scale-compare.no-subscales .scale-compare-info {
  font-weight: 700;
}
.scale-compare.no-subscales .chart-scale-analysis {
  width: calc(37.5% - 9px);
}
.scale-compare .chart-scale-analysis {
  width: calc(37.5% - 20px);
  margin-right: 36px;
}
@media screen and (max-width: 1024px) {
  .scale-compare .chart-scale-analysis {
    margin-right: 16px;
  }
}
.scale-compare .chart-scale-analysis.ghost {
  pointer-events: none;
  opacity: 0.4;
}
.scale-compare .scale-compare-info {
  margin-top: 0;
  overflow: hidden;
  font-size: 1rem;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.scale-compare .scale-figure {
  flex-wrap: nowrap;
}
.scale-compare .scale-figure.sub-scale-figure {
  margin-left: 30px;
}
.scale-compare .scale-figure.sub-scale-figure .chart-scale-analysis {
  width: calc(37.5% - 9px);
}
.scale-compare .accordion-header .scale-compare-info {
  font-weight: 700;
}
.scale-compare .accordion.open {
  margin-bottom: 48px;
}

.scale-section-legend {
  display: flex;
  align-items: flex-end;
  width: 50%;
  padding-left: 20px;
  font-size: 0.875rem;
}
.scale-section-legend-has-text {
  height: 100px;
}
.scale-section-legend-3-items .scale-section-legend-item:nth-last-child(n+2) {
  width: 50%;
}
.scale-section-legend-5-items .scale-section-legend-item:nth-last-child(n+2) {
  width: 25%;
}
.scale-section-legend-item {
  position: relative;
  font-weight: 700;
  cursor: default;
}
.scale-section-legend-text {
  position: absolute;
  bottom: 20px;
  transform-origin: center left;
  transform: rotate(-45deg);
  font-weight: 400;
  white-space: nowrap;
  cursor: default;
}

.scale .scale-section-legend {
  width: calc(50% - 16px);
  margin-bottom: -14px;
  padding-left: 0;
}
.scale .scale-section-legend-item {
  font-size: 0.75rem;
}

div.loading-screen {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  flex-direction: column;
  width: 100vw;
  height: 100vh;
  background-color: #fafafa;
}

.spinner {
  margin-bottom: 80px;
}

.loading-note {
  font-size: 14px;
  color: #95a0af;
}
.loading-note p {
  width: 60%;
}

.notification {
  position: fixed;
  top: 0;
  left: 50%;
  z-index: 2000;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-height: 100vh;
  overflow: hidden;
  transform: translate3d(-50%, -250%, 0);
  box-shadow: rgba(0, 0, 0, 0.3) 0 15px 20px -12px;
  transition: 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) transform;
}
.notification.show {
  height: auto;
  transform: translate3d(-50%, 0%, 0);
}
.notification.info {
  background: #0053d8;
}
.notification.success {
  background: #37ca8c;
}
.notification.success .fwsj-icon, .notification.success .dot.checked-dot::before, .notification.success .organigram-item .organigram-item-inner.overview .count::before, .organigram-item .organigram-item-inner.overview .notification.success .count::before, .notification.success .chart-job-stress-index .wave-warning-icon, .chart-job-stress-index .notification.success .wave-warning-icon, .notification.success .scale-value::before {
  font-size: 18px;
}
.notification.warning {
  background: #ffe200;
}
.notification.warning *,
.notification.warning .fwsj-icon,
.notification.warning .dot.checked-dot::before,
.notification.warning .organigram-item .organigram-item-inner.overview .count::before,
.organigram-item .organigram-item-inner.overview .notification.warning .count::before,
.notification.warning .scale-value::before {
  color: #665a00;
}
.notification.error {
  background: #ff5d41;
}
.notification.error *,
.notification.error .fwsj-icon,
.notification.error .dot.checked-dot::before,
.notification.error .organigram-item .organigram-item-inner.overview .count::before,
.organigram-item .organigram-item-inner.overview .notification.error .count::before,
.notification.error .scale-value::before, .notification.info *,
.notification.info .fwsj-icon,
.notification.info .dot.checked-dot::before,
.notification.info .organigram-item .organigram-item-inner.overview .count::before,
.organigram-item .organigram-item-inner.overview .notification.info .count::before,
.notification.info .scale-value::before, .notification.success *,
.notification.success .fwsj-icon,
.notification.success .dot.checked-dot::before,
.notification.success .organigram-item .organigram-item-inner.overview .count::before,
.organigram-item .organigram-item-inner.overview .notification.success .count::before,
.notification.success .scale-value::before {
  color: #ffffff;
}
.notification .fwsj-icon, .notification .dot.checked-dot::before, .notification .organigram-item .organigram-item-inner.overview .count::before, .organigram-item .organigram-item-inner.overview .notification .count::before, .notification .chart-job-stress-index .wave-warning-icon, .chart-job-stress-index .notification .wave-warning-icon, .notification .scale-value::before {
  display: block;
  height: 48px;
  min-width: 48px;
  padding: 14px 4px;
  font-size: 20px;
  color: #333333;
  text-align: center;
}
.notification .action {
  width: 48px;
  background: rgba(0, 0, 0, 0.1);
}
.notification .action:hover {
  background: rgba(0, 0, 0, 0.2);
}
.notification .action .fwsj-icon, .notification .action .dot.checked-dot::before, .notification .action .organigram-item .organigram-item-inner.overview .count::before, .organigram-item .organigram-item-inner.overview .notification .action .count::before, .notification .action .chart-job-stress-index .wave-warning-icon, .chart-job-stress-index .notification .action .wave-warning-icon, .notification .action .scale-value::before {
  padding: 4.4px 10.4px;
  font-size: 26.4px;
}
.notification .main {
  display: flex;
  flex-direction: row;
  flex-shrink: 0;
  justify-content: space-between;
}
.notification .main > .fwsj-icon, .notification .main > .dot.checked-dot::before, .notification .organigram-item .organigram-item-inner.overview .main > .count::before, .organigram-item .organigram-item-inner.overview .notification .main > .count::before, .notification .chart-job-stress-index .main > .wave-warning-icon, .chart-job-stress-index .notification .main > .wave-warning-icon, .notification .main > .scale-value::before {
  display: none;
}
.notification .title {
  flex-grow: 10;
  padding-right: 8px;
  margin: 10px 0 8px 16px;
  font-size: 16px;
}
.notification .desc {
  width: auto;
  padding: 4px 16px 16px;
  overflow-y: auto;
}
@media screen and (min-width: 680px) {
  .notification {
    top: 44px;
    width: 48px;
    max-height: unset;
    transition: 0.3s 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) transform, 0.5s cubic-bezier(0.86, 0, 0.07, 1) width;
  }
  .notification.descriptive {
    transition: 0.3s 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955) transform, 0.5s 0.3s cubic-bezier(0.86, 0, 0.07, 1) width;
  }
  .notification.descriptive .desc {
    max-height: 0;
    padding: 0 16px;
    transition: 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86) max-height, 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86) padding-top, 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86) padding-bottom;
  }
  .notification.show {
    width: 480px;
    height: auto;
    transform: translate3d(-50%, 0%, 0);
    transition: 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955) transform, 0.5s 0.5s cubic-bezier(0.86, 0, 0.07, 1) width;
  }
  .notification.show .desc {
    max-height: 200px;
    padding: 4px 16px 16px;
    transition: 0.4s 1s cubic-bezier(0.785, 0.135, 0.15, 0.86) max-height, 0.4s 1s padding-top, 0.4s 1s padding-bottom;
  }
  .notification .main {
    height: 48px;
  }
  .notification .main > .fwsj-icon, .notification .main > .dot.checked-dot::before, .notification .organigram-item .organigram-item-inner.overview .main > .count::before, .organigram-item .organigram-item-inner.overview .notification .main > .count::before, .notification .chart-job-stress-index .main > .wave-warning-icon, .chart-job-stress-index .notification .main > .wave-warning-icon, .notification .main > .scale-value::before {
    display: block;
  }
  .notification .action {
    width: 48px;
  }
  .notification .title {
    padding-right: 16px;
    margin: 10px 0 8px 4px;
    font-size: 18px;
    text-transform: none;
    white-space: nowrap;
  }
  .notification .desc {
    width: auto;
    padding: 4px 72px 16px 52px;
    overflow-y: auto;
  }
}

label.switch {
  position: relative;
  display: flex;
  align-items: center;
  flex-direction: row;
  cursor: pointer;
}
label.reverse.switch {
  flex-direction: row-reverse;
  justify-content: flex-end;
}
label.reverse.switch input {
  margin-left: 0;
}
label.switch span {
  font-family: "Source Sans Pro", sans-serif;
  font-size: 16px;
  transition: color 0.2s ease-in-out;
}
label.switch input {
  position: relative;
  flex-shrink: 0;
  width: 53px;
  height: 32px;
  min-width: unset;
  margin-right: 20px;
  margin-left: 20px;
  cursor: pointer;
  background-color: #f1f1ea;
  border-radius: 100px;
  transition: background-color 0.2s ease-in-out;
  appearance: none;
}
label.switch input::before {
  position: absolute;
  top: 50%;
  left: 2px;
  width: 28px;
  height: 28px;
  background-color: #ff5d41;
  border-radius: 100px;
  content: "";
  transform: translate(0, -50%);
  transition: all 0.2s cubic-bezier(0.86, 0, 0.07, 1);
}
label.switch input::before:not(:checked)::before {
  transition: all 0.2s cubic-bezier(0.86, 0, 0.07, 1);
}
label.switch input:checked {
  background-color: rgba(61, 228, 157, 0.3);
}
label.switch input:checked::before {
  background-color: #3de49d;
  transform: translate(75%, -50%);
}
label.switch input:disabled {
  opacity: 0.3;
}
label.negative.switch input {
  background-color: #ffffff;
}
label.negative.switch input::before {
  background-color: #0053d8;
}
label.negative.switch input:checked {
  background-color: #ffffff;
}
label.negative.switch input:checked::before {
  background-color: #3de49d;
}
label.sm.switch input, .tooltip-container.sm .tooltip label.tooltip-close.switch input {
  width: 39px;
  height: 24px;
}
label.sm.switch input::before, .tooltip-container.sm .tooltip label.tooltip-close.switch input::before {
  width: 20px;
  height: 20px;
}

.app .survey-navigation .drawer .navigation .survey-help .support.tile,
.support.tile {
  flex-shrink: 0;
  width: 100%;
  hyphens: none;
}
.app .survey-navigation .drawer .navigation .survey-help .support.tile h4,
.support.tile h4,
.support.tile .module-list-disabled > div p,
.module-list-disabled > div .support.tile p {
  padding: 0;
  font-size: 1.25em;
}
.app .survey-navigation .drawer .navigation .survey-help .support.tile ul,
.support.tile ul {
  position: static;
  height: auto;
  padding: 0;
}
.app .survey-navigation .drawer .navigation .survey-help .support.tile ul li,
.support.tile ul li {
  margin-bottom: 24px;
  white-space: pre-line;
  list-style: none;
}
.app .survey-navigation .drawer .navigation .survey-help .support.tile ul li:last-child,
.support.tile ul li:last-child {
  margin-bottom: 0;
}
.app .survey-navigation .drawer .navigation .survey-help .support.tile ul li a,
.support.tile ul li a {
  display: inline;
  padding: 0;
  color: inherit;
}
.app .survey-navigation .drawer .navigation .survey-help .support.tile ul li a:hover,
.support.tile ul li a:hover {
  color: #153a77;
}

.upload-box {
  align-items: center;
  width: 100%;
  margin-bottom: 48px;
  background-color: #00c2df;
}
.upload-box .upload {
  position: relative;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  padding: 48px 24px;
  margin: 8px;
  border: 2px dashed #ffffff;
}
.upload-box .upload input[type=file] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  opacity: 0;
}
.upload-box .upload i {
  margin-right: 8px;
}

.checklist-question {
  display: inline-flex;
  flex-wrap: nowrap;
  width: 100%;
  margin-bottom: 24px;
}
@media screen and (max-width: 1024px) {
  .checklist-question {
    flex-wrap: wrap;
  }
}
.checklist-question .condition,
.checklist-question label.condition {
  width: 100%;
  margin-bottom: 16px;
}
.checklist-question .confirmation {
  flex: 0 0 auto;
  flex-direction: row;
  margin-left: 150px;
}
@media screen and (max-width: 1024px) {
  .checklist-question .confirmation {
    margin-left: 0;
  }
}
.checklist-question .confirmation .radio:first-child {
  margin-right: 36px;
}

.accordion.person-element {
  margin-top: 0;
  margin-bottom: 8px;
}
.accordion.person-element .title {
  align-items: center;
  flex-wrap: nowrap;
  justify-content: space-between;
  padding: 0;
}
.accordion.person-element .title::after {
  display: none;
}
.accordion.person-element .title .profile-icon {
  margin-right: 12px;
  margin-left: 1px;
  font-size: 32px;
  color: #0053d8;
}
.accordion.person-element.person-extern .profile-icon {
  color: #FBBC00;
}
.accordion.person-element.person-support .profile-icon {
  color: #00c2df;
}
.accordion.person-element.person-new .btn {
  width: 270px;
  margin-bottom: 0;
}
.accordion.person-element .person-tools {
  align-items: center;
  flex: 0 0 auto;
  flex-direction: row;
  width: unset;
  padding-left: 16px;
}
.accordion.person-element .person-data {
  display: block;
  flex: 1 1 auto;
  width: auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.accordion.person-element span,
.accordion.person-element input.btn {
  margin-right: 12px;
}
.accordion.person-element .checkbox {
  clear: both;
}

.card-check {
  float: left;
  width: 33.33%;
  margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
  .card-check {
    width: 100%;
  }
}
.card-check .card-illustration {
  position: relative;
}
.card-check .card-illustration .approved {
  position: absolute;
  top: calc(50% - 56px);
  left: calc(50% - 56px);
  transition: all 0.3s ease-in-out;
}
.card-check .card-checkbox {
  min-height: 117px;
  padding: 16px 32px 8px 20px;
  background-color: #fafafa;
  border: rgba(223, 225, 229, 0.3) solid;
  border-width: 0 0 0 1px;
}

.process-status ul .dot {
  height: 4px;
  background-color: #dfe1e5;
}

.process-status ul .dot label {
  position: absolute;
  z-index: 10;
  margin: 0;
  font-size: 0.875em;
  text-align: center;
}

.process-status .count {
  margin-bottom: 40px;
  font-size: 1em;
}
.process-status.sm .count, .tooltip-container.sm .tooltip .process-status.tooltip-close .count {
  margin-bottom: 28px;
}
.process-status.sm ul, .tooltip-container.sm .tooltip .process-status.tooltip-close ul {
  margin-bottom: 8px;
}
.process-status.sm ul .dot:not(:first-of-type), .tooltip-container.sm .tooltip .process-status.tooltip-close ul .dot:not(:first-of-type) {
  width: 24px;
  min-width: 4px;
  margin-left: 0;
}
.process-status.sm ul .dot:not(:first-of-type)::before, .tooltip-container.sm .tooltip .process-status.tooltip-close ul .dot:not(:first-of-type)::before {
  right: 8px;
}
.process-status.sm ul .dot::before, .tooltip-container.sm .tooltip .process-status.tooltip-close ul .dot::before {
  transform: translate(-100%, -50%);
}
.process-status.sm ul .dot label, .tooltip-container.sm .tooltip .process-status.tooltip-close ul .dot label {
  top: -6px;
  left: -16px;
  width: 16px;
  padding-top: 18px;
}
.process-status ul {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 15px;
  margin-top: 24px;
  list-style: none;
}
.process-status ul .dot {
  position: relative;
}
.process-status ul .dot:not(:first-of-type) {
  width: 50px;
  min-width: 4px;
  margin-right: 15px;
  margin-left: 15px;
}
.process-status ul .dot:not(:first-of-type)::before {
  right: 15px;
  display: block;
  margin: 1.5px 0 0;
  transform: translate(150%, -50%);
}
.process-status ul .dot:not(:first-of-type) label {
  left: 100%;
}
.process-status ul .dot::before {
  margin: 1.5px 0 0;
  cursor: auto;
  transform: translate(-50%, -50%);
}
.process-status ul .dot label {
  top: -13px;
  left: -15px;
  width: 30px;
  padding-top: 37px;
}
.process-status.vertical ul {
  display: block;
  padding-top: 0;
  margin-top: 48px;
  margin-left: 4px;
  margin-bottom: -15px;
}
.process-status.vertical ul .dot {
  width: 4px;
  height: 30px;
  margin-left: 0;
  margin-top: 30px;
}
.process-status.vertical ul .dot:not(:first-of-type) {
  min-width: 4px;
  margin: 0;
  margin-top: 30px;
}
.process-status.vertical ul .dot:not(:first-of-type)::before {
  right: 0;
  left: 0;
  display: block;
  margin: 0;
}
.process-status.vertical ul .dot:not(:first-of-type) label {
  top: -27px;
  left: 30px;
  padding: 0;
  font-size: 1rem;
  width: auto;
  text-wrap: nowrap;
  text-align: left;
  padding-right: 10px;
  display: inline-block;
}
.process-status.vertical ul .dot::before {
  margin: 0;
  transform: translate(-45%, -30px);
}
.process-status.vertical ul .dot:last-of-type {
  height: 0px;
}
.process-status.vertical ul label {
  top: -27px;
  left: 30px;
  padding: 0;
  font-size: 1rem;
  width: auto;
  text-wrap: nowrap;
  text-align: left;
  padding-right: 10px;
  display: inline-block;
}
.process-status .hint {
  max-width: 500px;
  margin-top: 72px;
  font-size: 1rem;
  color: #9a9a9a;
}

.blue .process-status.sm .dot::before, .tooltip-container .tooltip .process-status.sm .dot::before, .blue .tooltip-container.sm .tooltip .process-status.tooltip-close .dot::before, .tooltip-container .tooltip .tooltip-container.sm .tooltip .process-status.tooltip-close .dot::before, .tooltip-container.sm .tooltip .blue .process-status.tooltip-close .dot::before, .tooltip-container.sm .tooltip .tooltip .process-status.tooltip-close .dot::before {
  margin-top: 2px;
}

.status-list {
  padding-left: 0;
  list-style-type: none;
}
.status-list li {
  line-height: 40px;
}
.status-list .status-icon {
  display: inline-block;
  margin-right: 8px;
  vertical-align: middle;
}
.status-list .status-icon i {
  overflow-wrap: normal;
}

.form-bar {
  display: flex;
  flex-direction: row;
  margin-bottom: 16px;
  text-align: left;
}
.form-bar .btn.ghost {
  padding: 0;
  margin: 8px 0;
  background: none;
  border: 0;
  border-radius: 0;
}
@media screen and (max-width: 1024px) {
  .form-bar {
    display: block;
  }
}
.form-bar .form-bar-data {
  display: flex;
  align-items: flex-start;
  flex-direction: row;
  flex-wrap: wrap;
}
.form-bar .form-bar-data > div {
  display: flex;
  flex-shrink: 0;
  margin: 16px 32px 0 0;
}
.form-bar .form-bar-data > div > label, .form-bar .form-bar-data > div > span, .form-bar .form-bar-data > div > a, .form-bar .form-bar-data > div > p, .form-bar .form-bar-data > div > button {
  margin: 5px 0;
  margin-right: 8px;
}
.form-bar .form-bar-data > div:last-child {
  flex-shrink: 1;
}
.form-bar .form-bar-data h1 {
  margin: 0;
  line-height: 1;
}
.form-bar .form-bar-data label {
  margin: 0;
  font-size: 1em;
  font-weight: bold;
}
.form-bar .form-bar-data input[type=date],
.form-bar .form-bar-data input[type=text] {
  display: inline-block;
  padding: 4px 2px;
  font-size: 1em;
  font-weight: normal;
}
.form-bar .form-bar-data .typeahead {
  max-width: 300px;
  min-width: 250px;
}
.form-bar .form-bar-data .scale-indicator {
  margin-right: 8px;
  padding-bottom: 4px;
}
.form-bar .form-bar-data .scale-indicator:not(.current) {
  margin-left: 3px;
}
.form-bar .form-bar-data .input-title {
  flex-direction: column;
}
.form-bar .form-bar-data .input-title input {
  display: block;
  margin: 0;
  font-size: 3em;
  font-weight: bold;
  line-height: 1;
}
.form-bar .form-bar-data .select-chip {
  max-width: 430px;
  margin-right: 8px;
}
.form-bar .form-bar-data .select-chip .chip-list {
  margin-top: 4px;
}
@media screen and (max-width: 768px) {
  .form-bar .form-bar-data {
    display: block;
  }
  .form-bar .form-bar-data > div {
    display: block;
    margin: 8px 0;
  }
  .form-bar .form-bar-data > div > label, .form-bar .form-bar-data > div > span, .form-bar .form-bar-data > div > a, .form-bar .form-bar-data > div > p, .form-bar .form-bar-data > div > button, .form-bar .form-bar-data > div > .btn.ghost {
    margin: 16px 0;
  }
  .form-bar .form-bar-data input,
  .form-bar .form-bar-data .select-chip {
    max-width: unset;
    margin: 0;
  }
  .form-bar .form-bar-data .typeahead {
    max-width: unset;
  }
}
.form-bar .form-bar-action {
  display: flex;
  align-items: flex-start;
  flex-shrink: 0;
  flex-wrap: wrap;
}
@media screen and (max-width: 1024px) {
  .form-bar .form-bar-action {
    margin-top: 24px;
  }
}
.form-bar .form-bar-action button.ghost + button.ghost {
  margin-left: 24px;
}
.form-bar .form-bar-action > div {
  display: flex;
  margin: 0 8px;
}
.form-bar .form-bar-action > div button,
.form-bar .form-bar-action > div a.btn {
  margin: 5px 0;
}
.form-bar .form-bar-action > div label:not(.desc):not(.data) {
  margin: 0;
  font-size: 1em;
  font-weight: bold;
}
.form-bar .form-bar-action > div.action:hover {
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  .form-bar .form-bar-action > div {
    display: block;
    margin-top: 8px;
    margin-bottom: 8px;
    margin-left: 0;
  }
}
.form-bar.center {
  align-items: center;
}
.form-bar.center .form-bar-data,
.form-bar.center .form-bar-action {
  align-items: center;
  margin-right: 0;
}
.form-bar.center .form-bar-data > div,
.form-bar.center .form-bar-action > div {
  align-items: center;
  margin-top: 8px;
  margin-bottom: 8px;
}
.form-bar.center .form-bar-data {
  margin-right: 48px;
  margin-left: 0;
}

.typeahead-group, .multi-input-list .multi-input-list-rows > div, .respondents-list li > div {
  display: flex;
  align-items: center;
  margin-bottom: 4px;
}
.typeahead-group > div, .multi-input-list .multi-input-list-rows > div > div, .respondents-list li > div > div {
  width: 100%;
}
.typeahead-group > div:nth-child(n+2), .multi-input-list .multi-input-list-rows > div > div:nth-child(n+2), .respondents-list li > div > div:nth-child(n+2) {
  margin-left: 8px;
}
.typeahead-group > div.small, .multi-input-list .multi-input-list-rows > div > div.small, .respondents-list li > div > div.small {
  width: 25%;
  width: max-content;
}
@media screen and (max-width: 768px) {
  .typeahead-group, .multi-input-list .multi-input-list-rows > div, .respondents-list li > div {
    flex-wrap: wrap;
  }
  .typeahead-group > div:nth-child(n+2), .multi-input-list .multi-input-list-rows > div > div:nth-child(n+2), .respondents-list li > div > div:nth-child(n+2) {
    margin-left: 0;
  }
}

.draggable-list {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 0;
  margin-top: 8px;
  margin-bottom: 0;
  list-style: none;
}
.draggable-list .draggable-item {
  position: relative;
  display: flex;
  align-items: center;
  padding: 12px 48px 16px 0;
  margin-bottom: 16px;
  background: #fafafa;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  transition: all 0.3s;
}
.draggable-list .draggable-item label {
  display: flex;
  align-items: center;
  margin: 0;
  font-size: 1em;
}
.draggable-list .draggable-item label span {
  margin-right: 8px;
  margin-bottom: 5px;
  font-size: 0.875em;
  font-weight: bold;
  color: #484848;
}
.draggable-list .draggable-item.dragging {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  transition: all 0s;
}
.draggable-list .placeholder {
  display: none;
  width: 100%;
  padding: 8px;
  margin: -8px;
  margin-bottom: 8px;
  border: 1px dashed #0053d8;
  box-sizing: content-box;
}
.draggable-list .placeholder.active {
  display: block;
}
.draggable-list .draggable-item-content {
  flex: 1 1 auto;
}
.draggable-list .draggable-item-handle {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  justify-content: center;
  width: 60px;
  height: 100%;
  color: #95a0af;
  cursor: move;
  user-select: none;
}
.draggable-list .draggable-item-handle:hover {
  color: #0053d8;
}
.draggable-list .draggable-item-remove {
  position: absolute;
  top: 0;
  right: 0;
}

.feature-list header {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 24px;
}
@media screen and (max-width: 768px) {
  .feature-list header {
    flex-direction: column;
    padding: 0;
    margin: 0;
    text-align: center;
  }
}
.feature-list header .heading {
  padding: 24px 0;
}
@media screen and (max-width: 768px) {
  .feature-list header .heading {
    padding-top: 0;
  }
}
.feature-list header .image {
  flex-shrink: 0;
  width: 40%;
  max-width: 120px;
  margin: 0;
}
.feature-list header .image img {
  display: block;
}
.feature-list header h2 {
  margin: 0;
  font-size: 2rem;
  line-height: 1.2;
}
.feature-list header span {
  font-size: 1.25rem;
}
.feature-list .intro {
  padding: 36px 48px 0;
  font-size: 1rem;
  background-image: linear-gradient(160deg, #ebebe1, #f1f1ea 50%, #fbfbf6);
}
.feature-list .status-list {
  padding: 48px 48px 24px;
}
.feature-list .status-list li {
  display: flex;
  align-items: center;
  margin-bottom: 24px;
}
.feature-list .status-list li .status-icon {
  flex-shrink: 0;
  margin-right: 16px;
}
.feature-list .status-list li strong {
  line-height: 1.5;
}
.feature-list .action {
  padding: 0 48px 48px;
}

.action-list {
  padding: 0;
  list-style: none;
}
.action-list > li, .action-list > div {
  display: flex;
  align-items: center;
  padding: 16px 0;
  border-bottom: 1px solid #f1f1ea;
}
.action-list > li:first-child, .action-list > div:first-child {
  border-top: 1px solid #f1f1ea;
}
.action-list .action-list-col {
  padding-right: 8px;
  padding-left: 8px;
}
.action-list .action-list-col label {
  margin: 0;
}
.action-list .action-list-col img {
  max-width: 24px;
  margin: 0;
}
.action-list .action-list-col.align-center {
  margin-right: auto;
  margin-left: auto;
}
.action-list .action-list-col.align-right {
  margin-left: auto;
}
.action-list .action-list-col:first-child {
  padding-left: 0;
}
.action-list .action-list-col:last-child {
  padding-right: 0;
}
.action-list .checkbox {
  width: 24px;
}
.action-list .checkbox input[type=checkbox] {
  top: -11px;
}
.action-list.action-list-header {
  font-weight: 700;
}
.action-list.action-list-header > li, .action-list.action-list-header > div {
  border-bottom: 0;
}
.action-list.action-list-header > li:first-child, .action-list.action-list-header > div:first-child {
  border-top: 0;
}
.action-list.disabled {
  color: #777777;
}
.action-list.responsive .action-list-col {
  flex-shrink: 0;
}
.action-list.responsive .action-list-col.fixed-width-15 {
  min-width: 15%;
}
.action-list.responsive .action-list-col.fixed-width-15.truncate-text {
  width: 15%;
}
.action-list.responsive .action-list-col.fixed-width-20 {
  min-width: 20%;
}
.action-list.responsive .action-list-col.fixed-width-20.truncate-text {
  width: 20%;
}
.action-list.responsive .action-list-col.fixed-width-30 {
  min-width: 30%;
}
.action-list.responsive .action-list-col.fixed-width-30.truncate-text {
  width: 30%;
}
.action-list.responsive .action-list-col.fixed-width-50 {
  min-width: 50%;
}
.action-list.responsive .action-list-col.fixed-width-50.truncate-text {
  width: 50%;
}
.action-list.responsive .action-list-col.fixed-width-55 {
  min-width: 55%;
}
.action-list.responsive .action-list-col.fixed-width-55.truncate-text {
  width: 55%;
}
.action-list.responsive .action-list-col.fixed-width-75 {
  min-width: 75%;
}
.action-list.responsive .action-list-col.fixed-width-75.truncate-text {
  width: 75%;
}
@media screen and (max-width: 1024px) {
  .action-list.responsive:not(.tablet-portrait) {
    padding-left: 0;
  }
}
@media screen and (max-width: 1024px) {
  .action-list.responsive:not(.tablet-portrait) > li, .action-list.responsive:not(.tablet-portrait) > div {
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;
  }
}
@media screen and (max-width: 1024px) {
  .action-list.responsive:not(.tablet-portrait).action-list-header {
    display: none;
  }
}
.action-list.responsive:not(.tablet-portrait) .action-list-header-inline {
  display: none;
}
@media screen and (max-width: 1024px) {
  .action-list.responsive:not(.tablet-portrait) .action-list-header-inline {
    display: inline-block;
    min-width: 150px;
    font-weight: 700;
  }
}
@media screen and (max-width: 1024px) {
  .action-list.responsive:not(.tablet-portrait) .action-list-col {
    padding-right: 0;
    padding-left: 0;
  }
}
.action-list.responsive:not(.tablet-portrait) .action-list-col.truncate-text {
  flex-shrink: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media screen and (max-width: 1024px) {
  .action-list.responsive:not(.tablet-portrait) .action-list-col.truncate-text {
    width: 100%;
    overflow: auto;
    text-overflow: clip;
    white-space: normal;
  }
}
@media screen and (max-width: 1024px) {
  .action-list.responsive:not(.tablet-portrait) .action-list-col.align-right {
    margin-left: 0;
  }
}
@media screen and (max-width: 1024px) {
  .action-list.responsive:not(.tablet-portrait) .action-list-col .checkbox {
    height: 24px;
  }
  .action-list.responsive:not(.tablet-portrait) .action-list-col .checkbox input[type=checkbox] {
    top: 4px;
  }
}
@media screen and (max-width: 768px) {
  .action-list.responsive.tablet-portrait {
    padding-left: 0;
  }
}
@media screen and (max-width: 768px) {
  .action-list.responsive.tablet-portrait > li, .action-list.responsive.tablet-portrait > div {
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;
  }
}
@media screen and (max-width: 768px) {
  .action-list.responsive.tablet-portrait.action-list-header {
    display: none;
  }
}
.action-list.responsive.tablet-portrait .action-list-header-inline {
  display: none;
}
@media screen and (max-width: 768px) {
  .action-list.responsive.tablet-portrait .action-list-header-inline {
    display: inline-block;
    min-width: 150px;
    font-weight: 700;
  }
}
@media screen and (max-width: 768px) {
  .action-list.responsive.tablet-portrait .action-list-col {
    padding-right: 0;
    padding-left: 0;
  }
}
.action-list.responsive.tablet-portrait .action-list-col.truncate-text {
  flex-shrink: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .action-list.responsive.tablet-portrait .action-list-col.truncate-text {
    width: 100%;
    overflow: auto;
    text-overflow: clip;
    white-space: normal;
  }
}
@media screen and (max-width: 768px) {
  .action-list.responsive.tablet-portrait .action-list-col.align-right {
    margin-left: 0;
  }
}
@media screen and (max-width: 768px) {
  .action-list.responsive.tablet-portrait .action-list-col .checkbox {
    height: 24px;
  }
  .action-list.responsive.tablet-portrait .action-list-col .checkbox input[type=checkbox] {
    top: 4px;
  }
}

.header-list {
  display: flex;
  align-items: baseline;
}
@media screen and (max-width: 1024px) {
  .header-list {
    flex-direction: column;
  }
}
.header-list .header-list-actions {
  margin-left: auto;
}
@media screen and (max-width: 1024px) {
  .header-list .header-list-actions {
    margin-left: 0;
  }
}
.header-list .header-list-actions .btn {
  margin-bottom: 0;
}

.tile .action-list {
  margin-top: 24px;
}

.beige .action-list > li, .register .tab-panels .tab-panel:nth-child(even) .action-list > li {
  border-color: #c0c7d1;
}

.card {
  display: flex;
  flex-direction: column;
  padding: 12px 16px 8px;
  color: #ffffff;
  text-align: center;
  background-color: #0053d8;
  border-radius: 6px;
}
.card .card-body {
  height: 100%;
}
.card .card-footer {
  margin-top: auto;
  font-size: 0.875em;
}
.card .small {
  font-size: 0.875em;
}
.card .spread {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
.card.organigram {
  display: inline-block;
  padding: 24px;
  padding-top: 48px;
  text-align: left;
  background: none;
  border: 2px solid #ffffff;
}
.card.organigram h2 {
  margin-bottom: 1em;
}
.card.organigram img {
  width: 160px;
}

.context-menu {
  position: relative;
  min-width: 320px;
  text-align: left;
}
.context-menu.active .context-trigger {
  display: none;
}
.context-menu.active .context-options {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}
.context-menu ul {
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}
.context-menu .context-options {
  position: absolute;
  width: 280px;
  padding: 0;
  z-index: 1000;
  top: 0;
  right: 0;
  left: unset;
  margin: 8px;
  list-style: none;
  pointer-events: all;
  background: #ffffff;
  border-radius: 3px;
  opacity: 0;
  visibility: hidden;
  transform: scale(0.95);
  transition-duration: 0.3s;
  transition-property: transform, opacity, visibility;
}
.context-menu .context-options a {
  display: block;
  padding: 8px 16px;
  color: #0053d8;
  cursor: pointer;
  border-bottom: 1px solid rgba(0, 83, 216, 0.1);
  transition: all 0.15s;
}
.context-menu .context-options a:hover {
  background: rgba(0, 83, 216, 0.05);
}
.context-menu .context-options.active {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}
.context-menu .context-options li {
  display: none;
}
.context-menu .context-options li:last-child a {
  border-bottom: none;
}
.context-menu .context-options li a {
  color: #333333;
}
.context-menu .context-options li a i {
  margin-right: 10px;
}
.context-menu .context-options li.edit a i {
  color: #0044b3;
}
.context-menu .context-options li.delete a {
  color: #ff5d41;
}
.context-menu .context-options li.ta i {
  color: #00def1;
}
.context-menu .context-options li.ra i {
  color: #44f5aa;
}
.context-menu .context-options li.self i {
  color: #0B8DE3;
}
.context-menu .context-options li.label i {
  color: #FBBC00;
}

.module .context-menu {
  position: inherit;
  width: 100%;
  text-align: center;
  pointer-events: none;
}
.module .context-menu .context-trigger {
  position: absolute;
  top: 0;
  right: 0;
  pointer-events: all;
}
.module .context-menu .context-options {
  left: 0;
  width: calc(100% - 16px);
}
.module .context-menu.active .context-trigger {
  display: none;
}
.module .context-menu.active .context-options li {
  display: block;
}

.organigram-add-sibling,
.organigram-add-child, .organigram-item.inactive::after, .organigram-item:not(.root)::after {
  width: 18px;
  height: 18px;
  border: 2px solid #0053d8;
  border-radius: 100%;
}

.organigram-container {
  position: relative;
  padding: 36px 60px;
  overflow-x: scroll;
  user-select: none;
}
.organigram-container .has-children > .organigram-item > .organigram-item-inner .level-toggle {
  display: inline-block;
  width: 72px;
  height: 100%;
  padding-right: 16px;
  margin-bottom: 0;
  text-align: right;
  pointer-events: all;
  background: none;
  border-right: 1px solid #ffffff;
  border-radius: 0;
}
.organigram-container .has-children > .organigram-item > .organigram-item-inner .level-toggle:active {
  transform: none;
}
.organigram-container .has-children > .organigram-item > .organigram-item-inner .level-toggle::before {
  transition: transform 0.2s ease-in-out, top 0.2s;
}
.organigram-container .has-children > .organigram-item > .organigram-item-inner > input {
  display: none;
}
.organigram-container .has-children > .organigram-item > .organigram-item-inner > .organigram-add-child {
  display: none;
}
.organigram-container .has-children > .organigram-item .closed .organigram-add-sibling {
  display: none;
}
.organigram-container .has-children > .organigram-item:not(.closed) > .organigram-add-sibling {
  display: flex;
}

.organigram {
  position: relative;
  width: fit-content;
  padding: 0;
  padding-right: 60px;
  margin: 0;
  list-style: none;
}
.organigram .organigram-item-list {
  position: relative;
  padding: 0;
  margin: 0;
  margin-top: 16px;
  margin-left: 80px;
  list-style: none;
}
.organigram .organigram-item-list::before {
  position: absolute;
  top: -20px;
  left: -64px;
  height: calc(100% + 20px);
  border-left: 2px solid #0053d8;
  content: "";
}

.organigram-item-list.edit.typeahead-open {
  z-index: 10;
}
.organigram-item-list.edit > .organigram-item > .overview {
  display: none;
}
.organigram-item-list.edit > .organigram-item > .form {
  display: block;
}
.organigram-item-list.edit.new .actions {
  justify-content: flex-end;
}
.organigram-item-list.edit.new .actions .cancel,
.organigram-item-list.edit.new .actions .delete {
  display: none;
  pointer-events: none;
}
.organigram-item-list.edit .actions .delete {
  margin-right: auto;
}

.organigram-item {
  position: relative;
}
.organigram-item:not(.root)::before {
  position: absolute;
  top: 22px;
  left: -64px;
  width: 64px;
  border-bottom: 2px solid #0053d8;
  content: "";
}
.organigram-item:not(.root)::after {
  position: absolute;
  top: 15px;
  left: -72px;
  z-index: 1;
  background-color: #ffffff;
  content: "";
}
.organigram-item .level-toggle:before {
  transform: rotate(-135deg);
  position: absolute;
  top: 50%;
  right: calc(100% - 30px);
  width: 8px;
  height: 8px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #ffffff;
  content: "";
}
.organigram-item.closed > .organigram-item-list,
.organigram-item.closed .organigram-add-sibling {
  display: none;
}
.organigram-item.closed .level-toggle::before {
  top: calc(50% - 4px);
  transform: rotate(45deg);
}
.organigram-item.inactive::after {
  position: absolute;
  top: 14px;
  left: 0;
  content: "";
}
.organigram-item.inactive > div,
.organigram-item.inactive > ul {
  pointer-events: none;
  cursor: auto;
  opacity: 0;
}
.organigram-item.drag-ready > div {
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}
.organigram-item.dragging {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}
.organigram-item.placeholder::before {
  border-bottom-style: dashed;
}
.organigram-item.placeholder .organigram-item-inner {
  height: 48px;
  background: transparent;
  border: 2px dashed #0053d8;
}
.organigram-item .organigram-item-inner {
  position: relative;
  z-index: 1;
  display: inline-block;
  width: fit-content;
  min-width: 380px;
  padding-right: 24px;
  border-radius: 8px;
}
.organigram-item .organigram-item-inner.overview {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: 48px;
  color: #ffffff;
  cursor: pointer;
  background-color: #0053d8;
}
.organigram-item .organigram-item-inner.overview.context-active {
  z-index: 5;
}
.organigram-item .organigram-item-inner.overview .name,
.organigram-item .organigram-item-inner.overview .count {
  display: inline-block;
  padding-top: 8px;
  padding-bottom: 8px;
  margin-right: 16px;
}
.organigram-item .organigram-item-inner.overview .name {
  padding-left: 16px;
}
.organigram-item .organigram-item-inner.overview .count {
  margin-left: auto;
}
.organigram-item .organigram-item-inner.overview .count::before {
  margin-right: 4px;
}
.organigram-item .organigram-item-inner.overview .context-menu {
  right: 0;
  left: auto;
  width: auto;
  margin-right: 0;
}
.organigram-item .organigram-item-inner.overview .context-menu .btn {
  width: auto;
  padding: 12px 4px;
  margin: 0;
  color: #ffffff;
  border: 0;
}
.organigram-item .organigram-item-inner.overview .context-menu .context-options li a {
  padding: 8px 48px;
}
.organigram-item .organigram-item-inner.form {
  display: none;
  width: 380px;
  padding: 16px 16px 4px;
  background-color: #ffffff;
  border: 2px solid #0053d8;
  border-radius: 8px;
}
.organigram-item .organigram-item-inner.form .title {
  color: #0053d8;
}
.organigram-item .organigram-item-inner.form .language-group,
.organigram-item .organigram-item-inner.form .group-link {
  display: flex;
  margin-top: 24px;
}
.organigram-item .organigram-item-inner.form .language-group label,
.organigram-item .organigram-item-inner.form .group-link label {
  margin-bottom: 4px;
}
.organigram-item .organigram-item-inner.form .language-group ~ .language-group {
  margin-top: 12px;
}
.organigram-item .organigram-item-inner.form .language-group label:nth-of-type(1) {
  width: 100%;
  margin-right: 8px;
}
.organigram-item .organigram-item-inner.form .group-link ~ .group-link {
  margin-top: 12px;
}
.organigram-item .organigram-item-inner.form .group-link label {
  width: 100%;
}
.organigram-item .organigram-item-inner.form input,
.organigram-item .organigram-item-inner.form .typeahead,
.organigram-item .organigram-item-inner.form .btn {
  font-size: 12px;
}
.organigram-item .organigram-item-inner.form .error-message {
  font-size: 14px;
}
.organigram-item .organigram-item-inner.form label {
  font-size: 12px;
}
.organigram-item .organigram-item-inner.form > label {
  margin: 24px 0 0;
}
.organigram-item .organigram-item-inner.form .organigram-input {
  padding-top: 0.3em;
  padding-bottom: 0.3em;
}
.organigram-item .organigram-item-inner.form .btn.icon {
  flex-grow: 1;
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  margin-left: 8px;
}
.organigram-item .organigram-item-inner.form .btn.icontext {
  margin-bottom: 4px;
  font-weight: 400;
  color: #0053d8;
}
.organigram-item .organigram-item-inner.form .btn.icontext i {
  font-size: 12px;
}
.organigram-item .organigram-item-inner.form .actions {
  display: flex;
}
.organigram-item .organigram-item-inner.form .actions .btn {
  padding: 8px 10px;
  margin-bottom: 4px;
}
.organigram-item .organigram-item-inner .level-toggle {
  display: none;
}

.organigram-add-sibling,
.organigram-add-child {
  left: 8px;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0;
  background-color: #ffffff;
}
.organigram-add-sibling:hover,
.organigram-add-child:hover {
  background: #ffffff;
}
.organigram-add-sibling i,
.organigram-add-child i {
  font-size: 12px;
  font-weight: 900;
  color: #0053d8;
}

.organigram-add-sibling {
  position: relative;
}
.organigram-add-sibling::after {
  clear: both;
}

.organigram-add-child {
  position: absolute;
  bottom: -8px;
  display: flex;
}

.organigram-container.static .organigram-item-inner:hover,
.organigram-container.navigation .organigram-item-inner:hover,
[class^="organigram-container results"] .organigram-item-inner:hover {
  cursor: default;
}
.organigram-container.static .organigram-item-list:last-of-type::before,
.organigram-container.navigation .organigram-item-list:last-of-type::before,
[class^="organigram-container results"] .organigram-item-list:last-of-type::before {
  height: 40px;
}
.organigram-container.static .organigram-item-inner,
.organigram-container.navigation .organigram-item-inner,
[class^="organigram-container results"] .organigram-item-inner {
  overflow: hidden;
}
.organigram-container.static .organigram-item-inner > *:not(.progress),
.organigram-container.navigation .organigram-item-inner > *:not(.progress),
[class^="organigram-container results"] .organigram-item-inner > *:not(.progress) {
  z-index: 1;
}
.organigram-container.static .organigram-item-inner .percentage,
.organigram-container.navigation .organigram-item-inner .percentage,
[class^="organigram-container results"] .organigram-item-inner .percentage {
  margin-right: 0;
  margin-left: auto;
}
.organigram-container.static .organigram-item-inner .progress,
.organigram-container.navigation .organigram-item-inner .progress,
[class^="organigram-container results"] .organigram-item-inner .progress {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  height: 100%;
  background-color: #008bee;
}
.organigram-container.static .level-toggle,
.organigram-container.static .has-children > .organigram-item > .organigram-add-sibling,
.organigram-container.navigation .level-toggle,
.organigram-container.navigation .has-children > .organigram-item > .organigram-add-sibling,
[class^="organigram-container results"] .level-toggle,
[class^="organigram-container results"] .has-children > .organigram-item > .organigram-add-sibling {
  display: none;
}

.organigram-container.static .organigram-item,
[class^="organigram-container results"] .organigram-item {
  display: flex;
  flex-wrap: wrap;
  min-width: 470px;
}
@media screen and (max-width: 680px) {
  .organigram-container.static .organigram-item,
  [class^="organigram-container results"] .organigram-item {
    width: fit-content;
  }
}
.organigram-container.static .organigram-item .return,
[class^="organigram-container results"] .organigram-item .return {
  display: flex;
  align-items: center;
  min-width: unset;
  padding: 8px 16px;
}
.organigram-container.static .organigram-item .return .count,
[class^="organigram-container results"] .organigram-item .return .count {
  margin-left: 4px;
}
.organigram-container.static .organigram-item-list,
[class^="organigram-container results"] .organigram-item-list {
  width: 100%;
}

[class^="organigram-container results"] .organigram-item .organigram-item-inner.overview {
  overflow: hidden;
  color: #333333;
  cursor: default;
  background: #f1f1ea;
}
[class^="organigram-container results"] .organigram-item .organigram-item-inner .value {
  margin-left: auto;
}
[class^="organigram-container results"] .organigram-item-list::before,
[class^="organigram-container results"] .organigram-item:not(.root)::after,
[class^="organigram-container results"] .organigram-item:not(.root)::before {
  border-color: #333333;
}
[class^="organigram-container results"] .organigram-item.jsi-bad:not(.root)::after {
  background: #ff5d41;
}
[class^="organigram-container results"] .organigram-item.jsi-good:not(.root)::after {
  background: #3de49d;
}
[class^="organigram-container results"] .organigram-item.jsi-neutral:not(.root)::after {
  background: #00def1;
}
[class^="organigram-container results"] .level-toggle {
  color: #333333;
}
[class^="organigram-container results"] .level-toggle::before {
  border-color: #333333;
}

.organigram-container.results-jsi .distribution {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  width: 100%;
  height: 4px;
}
.organigram-container.results-jsi .distribution .share {
  height: 100%;
}
.organigram-container.results-jsi .distribution .share.good {
  background: #44f5aa;
}
.organigram-container.results-jsi .distribution .share.neutral {
  background: #00def1;
}
.organigram-container.results-jsi .distribution .share.bad {
  background: #ff5d41;
}

.organigram-container.results-scales .organigram-item.scale-bad:not(.root)::after {
  background: #ff5d41;
}
.organigram-container.results-scales .organigram-item.scale-ok:not(.root)::after {
  background: #ffe200;
}
.organigram-container.results-scales .organigram-item.scale-good:not(.root)::after {
  background: #44f5aa;
}
.organigram-container.results-scales .chart-scale {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}
.organigram-container.results-scales .chart-scale .scale-bar {
  width: 100%;
  height: 6px;
  margin-right: 0;
}
.organigram-container.results-scales .chart-scale .scale-indicator {
  bottom: -6px;
}

.organigram-container.navigation {
  padding-right: 0;
  padding-left: 0;
}
.organigram-container.navigation .organigram .organigram-item-list {
  margin-left: 24px;
}
.organigram-container.navigation .organigram .organigram-item-list::before {
  left: -12px;
}
.organigram-container.navigation .organigram-item.active .organigram-item-inner.overview {
  color: #ffffff;
  background-color: #0053d8;
}
.organigram-container.navigation .organigram-item:not(.root)::before {
  top: 14px;
  left: -8px;
  width: 8px;
}
.organigram-container.navigation .organigram-item:not(.root)::after {
  top: 10px;
  left: -16px;
  z-index: 1;
  width: 10px;
  height: 10px;
}
.organigram-container.navigation .organigram-item-inner.overview {
  justify-content: space-between;
  width: 260px;
  height: 30px;
  min-width: 260px;
  padding-right: 0;
  font-size: 0.875rem;
  font-weight: 700;
  color: #0053d8;
  background-color: #ffffff;
  border: 2px solid #0053d8;
  border-radius: 4px;
  box-sizing: border-box;
}
.organigram-container.navigation .organigram-item-inner.overview:hover {
  cursor: pointer;
}
.organigram-container.navigation .organigram-item-inner.overview .name {
  flex-grow: 1;
  max-width: 260px;
  padding-right: 10px;
  padding-left: 10px;
  margin-right: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.organigram-container.navigation .organigram-item-inner.overview .filter-remove {
  width: 30px;
  height: 30px;
  padding: 0;
  margin: 0;
  font-size: 1.25em;
  border-radius: 0;
}
.organigram-container.navigation .organigram-item-inner.overview .filter-remove:hover {
  background: none;
}
.organigram-container.navigation .has-children > .organigram-item > .organigram-item-inner .level-toggle {
  width: auto;
  height: unset;
  padding: 4px 6px 4px 16px;
  color: #0053d8;
  border-right: 2px solid #0053d8;
}
.organigram-container.navigation .has-children > .organigram-item.active > .organigram-item-inner .level-toggle {
  color: #ffffff;
  border-right: 2px solid #ffffff;
}
.organigram-container.navigation .has-children > .organigram-item.active > .organigram-item-inner .level-toggle::before {
  border-color: #ffffff;
}
.organigram-container.navigation .level-toggle {
  cursor: pointer;
}
.organigram-container.navigation .level-toggle:before {
  transform: rotate(-135deg);
  position: absolute;
  top: calc(50% - 1px);
  right: calc(100% - 13px);
  width: 5px;
  height: 5px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #0053d8;
  content: "";
}
.organigram-container.navigation .organigram-item.closed .level-toggle::before {
  top: calc(50% - 2px);
  transform: rotate(45deg);
}

.page-banner {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999999;
  display: flex;
  align-items: center;
  width: 100%;
  padding: 16px;
  color: #ffffff;
  pointer-events: none;
  background: rgba(0, 83, 216, 0.7);
  transition: all 0.3s 0.5s;
}
.page-banner .message {
  display: block;
  width: 100%;
  text-align: center;
}
.page-banner .btn {
  margin: 0;
  color: #ffffff;
  pointer-events: all;
  border-color: #ffffff;
}
.page-banner .btn:hover {
  background-color: rgba(255, 255, 255, 0.7);
}
.page-banner.ok {
  background: rgba(61, 228, 157, 0.7);
}
.page-banner.warning {
  background: rgba(251, 188, 0, 0.7);
}
.page-banner.error {
  background: rgba(255, 93, 65, 0.7);
}

.water-sign {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 999999;
  width: 200%;
  padding: 48px;
  font-size: 4em;
  font-weight: bold;
  color: #ffffff;
  text-align: center;
  pointer-events: none;
  background: #0053d8;
  opacity: 0.3;
  transform: translate(-50%, -50%) rotate(-25deg);
}
.water-sign.ok {
  background: #3de49d;
}
.water-sign.warning {
  background: #FBBC00;
}
.water-sign.error {
  background: #ff5d41;
}

.flex > .radio-card {
  width: 175px;
}

.radio-card {
  display: flex;
  flex-direction: column;
}
.radio-card .radio-card-header {
  position: relative;
  padding: 24px 48px;
}
.radio-card .radio-card-header .status-icon {
  position: absolute;
  right: 0;
  bottom: 0;
  margin: 48px 48px;
}
.radio-card .radio-card-body {
  padding: 16px;
  background: #fafafa;
  border-right: 1px solid #ffffff;
  border-left: 1px solid #ffffff;
}
.radio-card .radio-card-body .radio-card-description {
  font-size: 0.875em;
}

.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow, .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle, .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle {
  position: absolute;
  margin-left: -8px;
}
.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow, .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle, .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle, .react-datepicker__year-read-view--down-arrow::before,
.react-datepicker__month-read-view--down-arrow::before,
.react-datepicker__month-year-read-view--down-arrow::before, .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before, .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before {
  position: absolute;
  width: 1px;
  height: 0;
  border: 8px solid transparent;
  box-sizing: content-box;
}
.react-datepicker__year-read-view--down-arrow::before,
.react-datepicker__month-read-view--down-arrow::before,
.react-datepicker__month-year-read-view--down-arrow::before, .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before, .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before {
  left: -8px;
  z-index: -1;
  border-bottom-color: #0053d8;
  border-width: 8px;
  content: "";
}

.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle {
  top: 0;
  margin-top: -8px;
}
.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle, .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before {
  border-top: none;
  border-bottom-color: #0053d8;
}
.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before {
  top: 0;
  border-bottom-color: #0053d8;
}

.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow, .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle {
  bottom: 0;
  margin-bottom: -8px;
}
.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow, .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle, .react-datepicker__year-read-view--down-arrow::before,
.react-datepicker__month-read-view--down-arrow::before,
.react-datepicker__month-year-read-view--down-arrow::before, .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before {
  border-bottom: none;
  border-top-color: #0053d8;
}
.react-datepicker__year-read-view--down-arrow::before,
.react-datepicker__month-read-view--down-arrow::before,
.react-datepicker__month-year-read-view--down-arrow::before, .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before {
  bottom: 0;
  border-top-color: #0053d8;
}

.react-datepicker-wrapper {
  display: inline-block;
}

.react-datepicker {
  position: relative;
  display: inline-block;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 0.8rem;
  color: #333333;
  background-color: #ffffff;
  border: 0;
  box-shadow: 0 10px 30px -12px rgba(0, 0, 0, 0.8);
}

.react-datepicker--time-only .react-datepicker__triangle {
  left: 35px;
}
.react-datepicker--time-only .react-datepicker__time-container {
  border-left: 0;
}
.react-datepicker--time-only .react-datepicker__time {
  border-radius: 0.3rem;
}
.react-datepicker--time-only .react-datepicker__time-box {
  border-radius: 0.3rem;
}

.react-datepicker__triangle {
  position: absolute;
  left: 50px;
}

.react-datepicker-popper {
  z-index: 1;
}
.react-datepicker-popper[data-placement^=bottom] {
  margin-top: 10px;
}
.react-datepicker-popper[data-placement^=top] {
  margin-bottom: 10px;
}
.react-datepicker-popper[data-placement^=right] {
  margin-left: 8px;
}
.react-datepicker-popper[data-placement^=right] .react-datepicker__triangle {
  right: 42px;
  left: auto;
}
.react-datepicker-popper[data-placement^=left] {
  margin-right: 8px;
}
.react-datepicker-popper[data-placement^=left] .react-datepicker__triangle {
  right: auto;
  left: 42px;
}

.react-datepicker__header {
  position: relative;
  padding-top: 8px;
  text-align: center;
  background-image: linear-gradient(232deg, #008bee, #005adb 50%, #0053d8);
  border-bottom: 1px solid #0053d8;
}
.react-datepicker__header--time {
  padding-right: 5px;
  padding-bottom: 8px;
  padding-left: 5px;
}

.react-datepicker__year-dropdown-container--select,
.react-datepicker__month-dropdown-container--select,
.react-datepicker__month-year-dropdown-container--select,
.react-datepicker__year-dropdown-container--scroll,
.react-datepicker__month-dropdown-container--scroll,
.react-datepicker__month-year-dropdown-container--scroll {
  display: inline-block;
  margin: 0 2px;
}

.react-datepicker__current-month,
.react-datepicker-time__header,
.react-datepicker-year-header {
  margin-top: 0;
  font-size: 0.944rem;
  font-weight: bold;
  color: #ffffff;
}

.react-datepicker-time__header {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.react-datepicker__navigation {
  position: absolute;
  top: 10px;
  z-index: 1;
  width: 10px;
  height: 10px;
  padding: 0;
  overflow: hidden;
  line-height: 1.7rem;
  text-align: center;
  text-indent: -999em;
  cursor: pointer;
  background: none;
  border: 0.45rem solid transparent;
  border-radius: 0;
}
.react-datepicker__navigation--previous {
  left: 10px;
  border-right-color: #ffffff;
}
.react-datepicker__navigation--previous:hover {
  background: none;
  border-right-color: #e6e6e6;
}
.react-datepicker__navigation--previous--disabled, .react-datepicker__navigation--previous--disabled:hover {
  cursor: default;
  border-right-color: white;
}
.react-datepicker__navigation--next {
  right: 10px;
  border-left-color: #ffffff;
}
.react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button) {
  right: 80px;
}
.react-datepicker__navigation--next:hover {
  background: none;
  border-left-color: #e6e6e6;
}
.react-datepicker__navigation--next--disabled, .react-datepicker__navigation--next--disabled:hover {
  cursor: default;
  border-left-color: white;
}
.react-datepicker__navigation--years {
  position: relative;
  top: 0;
  display: block;
  margin-right: auto;
  margin-left: auto;
}
.react-datepicker__navigation--years-previous {
  top: 4px;
  border-top-color: #ffffff;
}
.react-datepicker__navigation--years-previous:hover {
  border-top-color: #e6e6e6;
}
.react-datepicker__navigation--years-upcoming {
  top: -4px;
  border-bottom-color: #ffffff;
}
.react-datepicker__navigation--years-upcoming:hover {
  border-bottom-color: #e6e6e6;
}

.react-datepicker__month-container {
  float: left;
}

.react-datepicker__month {
  margin: 0.4rem;
  text-align: center;
}
.react-datepicker__month .react-datepicker__month-text {
  display: inline-block;
  width: 4rem;
  margin: 2px;
}

.react-datepicker__input-time-container {
  float: left;
  width: 100%;
  margin: 5px 0 10px 15px;
  clear: both;
  text-align: left;
}
.react-datepicker__input-time-container .react-datepicker-time__caption {
  display: inline-block;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container {
  display: inline-block;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input {
  display: inline-block;
  margin-left: 10px;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input {
  width: 85px;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-inner-spin-button,
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-outer-spin-button {
  margin: 0;
  -webkit-appearance: none;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time] {
  -moz-appearance: textfield;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__delimiter {
  display: inline-block;
  margin-left: 5px;
}

.react-datepicker__time-container {
  float: right;
  width: 70px;
  border-left: 1px solid #0053d8;
}
.react-datepicker__time-container--with-today-button {
  position: absolute;
  top: 0;
  right: -72px;
  display: inline;
  border: 1px solid #aeaeae;
  border-radius: 0.3rem;
}
.react-datepicker__time-container .react-datepicker__time {
  position: relative;
  background: white;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box {
  width: 70px;
  margin: 0 auto;
  overflow-x: hidden;
  text-align: center;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list {
  width: 100%;
  height: calc(195px + (1.7rem / 2));
  padding-right: 0px;
  padding-left: 0px;
  margin: 0;
  overflow-y: scroll;
  list-style: none;
  box-sizing: content-box;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item {
  height: 30px;
  padding: 5px 10px;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover {
  cursor: pointer;
  background-color: #0053d8;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected {
  font-weight: bold;
  color: white;
  background-color: #0053d8;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover {
  background-color: #0053d8;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled {
  color: #ffffff;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover {
  cursor: default;
  background-color: transparent;
}

.react-datepicker__week-number {
  display: inline-block;
  width: 1.7rem;
  margin: 0.166rem;
  line-height: 1.7rem;
  color: #ffffff;
  text-align: center;
}
.react-datepicker__week-number.react-datepicker__week-number--clickable {
  cursor: pointer;
}
.react-datepicker__week-number.react-datepicker__week-number--clickable:hover {
  background-color: #0053d8;
  border-radius: 30px;
}

.react-datepicker__day-names,
.react-datepicker__week {
  white-space: nowrap;
}

.react-datepicker__day-name,
.react-datepicker__day,
.react-datepicker__time-name {
  display: inline-block;
  width: 1.7rem;
  margin: 0.166rem;
  line-height: 1.7rem;
  color: #333333;
  text-align: center;
}

.react-datepicker__day-name {
  color: #ffffff;
}

.react-datepicker__month--selected, .react-datepicker__month--in-selecting-range, .react-datepicker__month--in-range {
  color: #fff;
  background-color: #0053d8;
  border-radius: 30px;
}
.react-datepicker__month--selected:hover, .react-datepicker__month--in-selecting-range:hover, .react-datepicker__month--in-range:hover {
  background-color: #0049bf;
}
.react-datepicker__month--disabled {
  color: #ffffff;
  pointer-events: none;
}
.react-datepicker__month--disabled:hover {
  cursor: default;
  background-color: transparent;
}

.react-datepicker__day,
.react-datepicker__month-text {
  cursor: pointer;
}
.react-datepicker__day:hover,
.react-datepicker__month-text:hover {
  background-color: #0053d8;
  border-radius: 30px;
  color: #ffffff;
}
.react-datepicker__day--today,
.react-datepicker__month-text--today {
  font-weight: bold;
}
.react-datepicker__day--highlighted,
.react-datepicker__month-text--highlighted {
  color: #fff;
  background-color: #FBBC00;
  border-radius: 30px;
}
.react-datepicker__day--highlighted:hover,
.react-datepicker__month-text--highlighted:hover {
  background-color: #e2a900;
}
.react-datepicker__day--highlighted-custom-1,
.react-datepicker__month-text--highlighted-custom-1 {
  color: magenta;
}
.react-datepicker__day--highlighted-custom-2,
.react-datepicker__month-text--highlighted-custom-2 {
  color: green;
}
.react-datepicker__day--selected, .react-datepicker__day--in-selecting-range, .react-datepicker__day--in-range,
.react-datepicker__month-text--selected,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__month-text--in-range {
  color: #fff;
  background-color: #0053d8;
  border-radius: 30px;
}
.react-datepicker__day--selected:hover, .react-datepicker__day--in-selecting-range:hover, .react-datepicker__day--in-range:hover,
.react-datepicker__month-text--selected:hover,
.react-datepicker__month-text--in-selecting-range:hover,
.react-datepicker__month-text--in-range:hover {
  background-color: #0049bf;
}
.react-datepicker__day--keyboard-selected,
.react-datepicker__month-text--keyboard-selected {
  color: #fff;
  background-color: #0c69ff;
  border-radius: 30px;
}
.react-datepicker__day--keyboard-selected:hover,
.react-datepicker__month-text--keyboard-selected:hover {
  background-color: #0049bf;
}
.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range,
.react-datepicker__month-text--in-range),
.react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range,
.react-datepicker__month-text--in-range) {
  background-color: rgba(0, 83, 216, 0.5);
}
.react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range),
.react-datepicker__month--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range) {
  color: #333333;
  background-color: #0053d8;
}
.react-datepicker__day--disabled,
.react-datepicker__month-text--disabled {
  color: #ffffff;
  cursor: default;
}
.react-datepicker__day--disabled:hover,
.react-datepicker__month-text--disabled:hover {
  background-color: transparent;
}

.react-datepicker__month-text.react-datepicker__month--selected:hover, .react-datepicker__month-text.react-datepicker__month--in-range:hover {
  background-color: #0053d8;
}
.react-datepicker__month-text:hover {
  background-color: #0053d8;
}

.react-datepicker__input-container {
  position: relative;
  display: inline-block;
}

.react-datepicker__year-read-view,
.react-datepicker__month-read-view,
.react-datepicker__month-year-read-view {
  border: 1px solid transparent;
  border-radius: 30px;
}
.react-datepicker__year-read-view:hover,
.react-datepicker__month-read-view:hover,
.react-datepicker__month-year-read-view:hover {
  cursor: pointer;
}
.react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow {
  border-top-color: #e6e6e6;
}
.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow {
  position: relative;
  top: 8px;
  float: right;
  margin-left: 20px;
  border-top-color: #ffffff;
  border-width: 0.45rem;
}

.react-datepicker__year-dropdown,
.react-datepicker__month-dropdown,
.react-datepicker__month-year-dropdown {
  position: absolute;
  top: 30px;
  left: 25%;
  z-index: 1;
  width: 50%;
  text-align: center;
  background-color: #0053d8;
  border: 1px solid #0053d8;
  border-radius: 30px;
}
.react-datepicker__year-dropdown:hover,
.react-datepicker__month-dropdown:hover,
.react-datepicker__month-year-dropdown:hover {
  cursor: pointer;
}
.react-datepicker__year-dropdown--scrollable,
.react-datepicker__month-dropdown--scrollable,
.react-datepicker__month-year-dropdown--scrollable {
  height: 150px;
  overflow-y: scroll;
}

.react-datepicker__year-option,
.react-datepicker__month-option,
.react-datepicker__month-year-option {
  display: block;
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  line-height: 20px;
}
.react-datepicker__year-option:first-of-type,
.react-datepicker__month-option:first-of-type,
.react-datepicker__month-year-option:first-of-type {
  border-top-right-radius: 30px;
  border-top-left-radius: 30px;
}
.react-datepicker__year-option:last-of-type,
.react-datepicker__month-option:last-of-type,
.react-datepicker__month-year-option:last-of-type {
  border-bottom-right-radius: 30px;
  border-bottom-left-radius: 30px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.react-datepicker__year-option:hover,
.react-datepicker__month-option:hover,
.react-datepicker__month-year-option:hover {
  background-color: #ffffff;
}
.react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming,
.react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,
.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming {
  border-bottom-color: #e6e6e6;
}
.react-datepicker__year-option:hover .react-datepicker__navigation--years-previous,
.react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,
.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous {
  border-top-color: #e6e6e6;
}
.react-datepicker__year-option--selected,
.react-datepicker__month-option--selected,
.react-datepicker__month-year-option--selected {
  position: absolute;
  left: 15px;
}

.react-datepicker__close-icon {
  position: absolute;
  top: 25%;
  right: 7px;
  width: 16px;
  height: 16px;
  padding: 0;
  vertical-align: middle;
  cursor: pointer;
  background-color: transparent;
  border: 0;
  outline: 0;
}
.react-datepicker__close-icon::after {
  position: absolute;
  right: 0px;
  bottom: 0;
  width: 16px;
  height: 16px;
  padding: 2px;
  margin: -8px auto 0;
  font-size: 12px;
  line-height: 1;
  color: #fff;
  text-align: center;
  cursor: pointer;
  background-color: #0053d8;
  border-radius: 50%;
  content: "×";
  box-sizing: border-box;
}

.react-datepicker__today-button {
  padding: 8px 0;
  clear: left;
  font-weight: bold;
  color: #ffffff;
  text-align: center;
  cursor: pointer;
  background-image: linear-gradient(232deg, #008bee, #005adb 50%, #0053d8);
  border-top: 1px solid #0053d8;
}

.react-datepicker__portal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2147483647;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.8);
}
.react-datepicker__portal .react-datepicker__day-name,
.react-datepicker__portal .react-datepicker__day,
.react-datepicker__portal .react-datepicker__time-name {
  width: 3rem;
  line-height: 3rem;
}
@media (max-width: 400px), (max-height: 550px) {
  .react-datepicker__portal .react-datepicker__day-name,
  .react-datepicker__portal .react-datepicker__day,
  .react-datepicker__portal .react-datepicker__time-name {
    width: 2rem;
    line-height: 2rem;
  }
}
.react-datepicker__portal .react-datepicker__current-month,
.react-datepicker__portal .react-datepicker-time__header {
  font-size: 1.44rem;
}
.react-datepicker__portal .react-datepicker__navigation {
  border: 0.81rem solid transparent;
}
.react-datepicker__portal .react-datepicker__navigation--previous {
  border-right-color: #ffffff;
}
.react-datepicker__portal .react-datepicker__navigation--previous:hover {
  border-right-color: #e6e6e6;
}
.react-datepicker__portal .react-datepicker__navigation--previous--disabled, .react-datepicker__portal .react-datepicker__navigation--previous--disabled:hover {
  cursor: default;
  border-right-color: white;
}
.react-datepicker__portal .react-datepicker__navigation--next {
  border-left-color: #ffffff;
}
.react-datepicker__portal .react-datepicker__navigation--next:hover {
  border-left-color: #e6e6e6;
}
.react-datepicker__portal .react-datepicker__navigation--next--disabled, .react-datepicker__portal .react-datepicker__navigation--next--disabled:hover {
  cursor: default;
  border-left-color: white;
}

.progress-indicator {
  cursor: pointer;
}

.progress-indicator-image {
  position: relative;
  width: 120px;
}
.progress-indicator-image svg {
  display: block;
}
.progress-indicator-image .gradient-start-color {
  stop-color: #ffffff;
}
.progress-indicator-image .gradient-end-color {
  stop-color: #0053d8;
}
.progress-indicator-image .progress-indicator-title {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 60%;
  font-size: 0.75em;
  font-weight: bold;
  text-align: center;
  transform: translate(-50%, -50%);
}

.progress-indicator-text {
  width: 80%;
  margin-top: 16px;
  font-size: 0.875em;
  font-weight: bold;
}

.blue .gradient-start-color, .tooltip-container .tooltip .gradient-start-color {
  stop-color: #0053d8;
}
.blue .gradient-end-color, .tooltip-container .tooltip .gradient-end-color {
  stop-color: #ffffff;
}

.nav-sidebar {
  position: relative;
  right: 0;
  width: 100%;
  height: 80vh;
  overflow: hidden;
  overflow-y: auto;
}
.nav-sidebar h4, .nav-sidebar .module-list-disabled > div p, .module-list-disabled > div .nav-sidebar p {
  margin: 48px 0 24px 48px;
}
.nav-sidebar nav.navigation .nav-back {
  margin-left: 24px;
}
.nav-sidebar nav.navigation ul.menu {
  position: relative;
  left: 0;
  justify-content: center;
  width: 100%;
  padding-top: 32px;
  padding-right: 24px;
  padding-left: 24px;
  padding-right: 48px;
  padding-left: 48px;
}
.nav-sidebar nav.navigation ul.menu.hide,
.nav-sidebar nav.navigation ul.menu ul.hide {
  transform: translateX(-100%);
  transition-delay: 0;
}
.nav-sidebar nav.navigation ul.menu .menu-section {
  margin-top: 50px;
}
.nav-sidebar nav.navigation ul.menu li {
  position: static;
  display: block;
  width: 100%;
  margin-bottom: 0;
  border-bottom: 1px solid #dfe1e5;
  width: 100%;
}
.nav-sidebar nav.navigation ul.menu li:last-child {
  margin-bottom: 48px;
}
.nav-sidebar nav.navigation ul.menu li a {
  position: relative;
  display: block;
  width: 100%;
  min-height: 48px;
  padding: 12px 18px 12px 4px;
  margin-right: 0;
  margin-left: 0;
  transition: all 0.2s ease-in-out;
}
.nav-sidebar nav.navigation ul.menu li a.has-children:before {
  transform: rotate(-45deg);
  position: absolute;
  top: calc(50% - 3px);
  right: 8px;
  width: 8px;
  height: 8px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #333333;
  content: "";
}
.nav-sidebar nav.navigation ul.menu li a.has-children:hover, .nav-sidebar nav.navigation ul.menu li a:hover {
  color: #153a77;
  cursor: pointer;
}
.nav-sidebar nav.navigation ul.menu li a.has-children:hover:before {
  transform: rotate(-45deg);
  position: absolute;
  top: calc(50% - 3px);
  right: 8px;
  width: 8px;
  height: 8px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #153a77;
  content: "";
}
.nav-sidebar nav.navigation ul.menu li a span {
  padding-top: 0;
  font-size: inherit;
  font-weight: 400;
}
.nav-sidebar nav.navigation ul.menu li::after {
  content: "";
}
.nav-sidebar nav.navigation ul.menu li > div,
.nav-sidebar nav.navigation ul.menu li ul {
  position: absolute;
  top: 0;
  left: 200%;
  width: 100%;
  height: 0;
  transform: translateX(0);
}
.nav-sidebar nav.navigation ul.menu li ul {
  padding-top: 32px;
  padding-right: 24px;
  padding-left: 24px;
}
.nav-sidebar nav.navigation ul.menu li.in > ul,
.nav-sidebar nav.navigation ul.menu li.in > div {
  transform: translateX(-100%);
}
.nav-sidebar nav.navigation ul.menu li.in > ul.hide {
  transform: translateX(-200%);
}
.nav-sidebar nav.navigation ul.menu li ul {
  padding-right: 48px;
  padding-left: 48px;
}
.nav-sidebar nav.navigation ul.menu li a:not(.btn) {
  margin: 0;
}

.chart-legend .chart-legend-item {
  display: flex;
  align-items: center;
  margin: 0.5em 0;
}
.chart-legend .chart-legend-icon {
  margin-right: 8px;
}
.chart-legend .chart-legend-icon::before {
  position: relative;
  display: block;
}
.chart-legend.compact .chart-legend-item {
  margin: 0;
}
.chart-legend.horizontal {
  display: flex;
}
.chart-legend.horizontal .chart-legend-item {
  flex-direction: column;
  margin: 0 0.5em;
}
.chart-legend.horizontal .chart-legend-item:first-of-type {
  margin-left: 0;
}
.chart-legend.horizontal .chart-legend-item:last-child {
  margin-right: 0;
}
.chart-legend.horizontal .chart-legend-icon {
  margin-right: 0;
  margin-bottom: 0.25em;
  line-height: 1;
}
.chart-legend.horizontal.compact .chart-legend-icon {
  margin-bottom: 0;
  line-height: 0.75;
}
.chart-legend.sm, .tooltip-container.sm .tooltip .chart-legend.tooltip-close {
  font-size: 0.875rem;
}

.grade-scale {
  position: relative;
  display: block;
  height: 8px;
  min-width: 204px;
  margin-top: 32px;
  background: #dfe1e5;
  border-radius: 3px;
}
@media screen and (min-width: 1700px) {
  .grade-scale {
    min-width: 300px;
  }
}
.grade-scale .grade-progress {
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  border-radius: 3px;
}
.grade-scale .grade-progress.good {
  background-color: #44f5aa;
  background-image: linear-gradient(232deg, #37ca8c, #44f5aa);
}
.grade-scale .grade-progress.bad {
  background-color: #ff5d41;
  background-image: linear-gradient(232deg, #ff8870, #ff5d41);
}
.grade-scale .grade-label {
  position: absolute;
  right: 0;
  bottom: 0;
  margin-bottom: 16px;
  font-size: 1.125rem;
  font-weight: bold;
  color: #333333;
  transform: translateX(50%);
}

.upload-compact {
  position: relative;
  display: flex;
  flex-direction: column;
}
.upload-compact label.btn.icontext {
  margin-top: -8px;
  margin-bottom: 0;
}
.upload-compact input[type=file] {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  opacity: 0;
}
.upload-compact .preview-container {
  display: flex;
  align-items: flex-end;
  flex-direction: column;
  margin-top: 4px;
}
.upload-compact .preview-container button {
  margin-left: 4px;
}
.upload-compact .preview-container img {
  max-width: 200px;
  margin-bottom: 4px;
}

.checklist-question .confirmation .upload-compact {
  align-items: flex-end;
}
.checklist-question .confirmation .upload-compact label.btn.icontext {
  align-self: flex-end;
}
@media screen and (max-width: 1024px) {
  .checklist-question .confirmation .upload-compact label.btn.icontext {
    align-self: flex-start;
  }
}
.checklist-question .confirmation .upload-compact .preview-container {
  justify-content: flex-end;
}

.header-tile {
  display: flex;
  padding: 32px 60px 32px 60px;
}
@media screen and (max-width: 1000px) {
  .header-tile {
    flex-direction: column;
  }
}
@media only screen and (max-width: 320px) {
  .header-tile {
    padding: 32px 36px;
  }
}
.header-tile h1 {
  margin-top: 0;
}
@media screen and (min-width: 2000px) {
  .header-tile p {
    font-size: 120%;
  }
}
@media screen and (min-width: 1331.2px) {
  .header-tile p {
    max-width: 900px;
  }
}
@media screen and (min-width: 2000px) {
  .header-tile p a {
    font-size: 100%;
  }
}
.header-tile .aside {
  align-self: flex-end;
  max-width: 100%;
  margin-left: auto;
}
@media screen and (max-width: 1000px) {
  .header-tile .aside {
    align-self: flex-start;
    margin-left: 0;
  }
}

.wysiwyg-container {
  display: flex;
  flex-grow: 1;
  min-height: 300px;
}

.wysiwyg.full-height + div:not(.tox-fullscreen) {
  flex-grow: 1;
  min-height: 100%;
}

.wysiwyg-container .tinymce-mobile-outer-container .tiny-mce-mobile-editor-socket {
  padding: 32px 36px;
}
.wysiwyg-container .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask {
  background-color: rgba(223, 225, 229, 0.65);
}
.wysiwyg-container .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section .tinymce-mobile-mask-tap-icon {
  width: auto;
  height: auto;
  background-color: transparent;
}
.wysiwyg-container .tinymce-mobile-outer-container .tinymce-mobile-disabled-mask .tinymce-mobile-content-container .tinymce-mobile-content-tap-section .tinymce-mobile-mask-tap-icon::before {
  margin-bottom: 0;
  content: "Text bearbeiten";
}

.nav-filter.seamless .accordion {
  margin-right: -16px;
  margin-left: -16px;
}
.nav-filter.seamless .nav-filter-modal .filter-option {
  margin-right: -16px;
}
.nav-filter .accordion .accordion-header {
  display: flex;
  padding: 8px 8px 8px 16px;
  border-radius: 4px;
}
.nav-filter .accordion .accordion-header:hover {
  background: rgba(154, 154, 154, 0.06);
}
.nav-filter .accordion .accordion-header i {
  margin-right: 8px;
  font-size: 22px;
}
.nav-filter .accordion .accordion-toggler {
  position: relative;
  margin-left: auto;
}
.nav-filter .accordion .accordion-toggler::before,
.nav-filter .accordion .accordion-toggler::after {
  position: absolute;
  top: calc(50% - 1px);
  left: calc(50% - 6px);
  display: block;
  width: 12px;
  height: 2px;
  background: #0053d8;
  border: 0;
  content: "";
}
.nav-filter .accordion .accordion-toggler::before {
  transform: rotate(90deg);
  transition: transform 0.3s;
}
.nav-filter .accordion.open .accordion-toggler::before {
  transform: rotate(90deg) scaleX(0);
}
.nav-filter .accordion.open .accordion-header {
  background: rgba(154, 154, 154, 0.2);
}
.nav-filter .accordion.active:not(.open) .accordion-body {
  height: auto;
  visibility: visible;
}
.nav-filter .accordion.active:not(.open) .accordion-body .filter-option:not(.active) {
  display: none;
}
.nav-filter .nav-filter-options {
  margin-left: 24px;
}
.nav-filter .nav-filter-options .filter-option:first-child {
  margin-top: 8px;
}
.nav-filter .nav-filter-options .filter-option:last-child {
  margin-bottom: 16px;
}
.nav-filter .nav-filter-modal {
  margin-bottom: 36px;
}
.nav-filter .nav-filter-modal .icontext {
  padding: 8px 0;
  margin: 0;
}
.nav-filter .nav-filter-modal .filter-option {
  margin: 0;
  margin-left: 36px;
}
.nav-filter .nav-filter-modal .filter-option:not(.active) {
  display: none;
}

.filter-option {
  display: flex;
  align-items: center;
  margin: 0;
  overflow: hidden;
  color: #0053d8;
  border-radius: 4px;
}
.filter-option.active {
  color: #ffffff;
  background-color: #0053d8;
}
.filter-option.active .filter-option-remove {
  display: flex;
}
.filter-option .filter-option-select {
  flex-grow: 1;
  font-weight: normal;
}
.filter-option .filter-option-select:disabled {
  color: #c0c7d1;
}
.filter-option .filter-option-remove {
  display: none;
  flex-grow: 0;
  margin-right: 2px;
}
.filter-option .filter-option-select,
.filter-option .filter-option-remove {
  padding: 4px 8px;
  margin: 0;
  color: inherit;
  text-align: left;
  background: none;
  border-radius: 0;
}
.filter-option .filter-option-select:hover,
.filter-option .filter-option-remove:hover {
  background-color: rgba(154, 154, 154, 0.06);
}

.breadcrumbs {
  display: flex;
  align-items: center;
}
.breadcrumbs .breadcrumbs-item {
  display: block;
  font-size: 0.875rem;
  font-weight: bold;
  color: inherit;
}
.breadcrumbs .breadcrumbs-item:visited {
  color: inherit;
}
.breadcrumbs .breadcrumbs-item.current {
  font-size: 1.25rem;
}
.breadcrumbs .breadcrumbs-item:not(.current)::after {
  display: inline-block;
  margin: 0 8px;
  content: "/";
}

.rating-stars {
  display: flex;
  align-items: center;
  margin-top: 32px;
}
.rating-stars-label {
  margin-top: 4px;
  margin-left: 8px;
  font-size: 1.5rem;
  font-weight: bold;
  color: #333333;
}
.rating-stars i {
  margin-right: 4px;
  font-size: 2rem;
  color: #dfe1e5;
}
.rating-stars i.active {
  color: #3de49d;
}

.search-trigger {
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 16px 0;
  color: #9a9a9a;
  cursor: pointer;
}

.search-bar {
  position: relative;
  display: block;
  width: 100%;
}
.search-bar form.search {
  position: relative;
}
.search-bar input {
  display: block;
  background-color: #f1f1ea;
  border-radius: 50px;
  padding: 8px 24px;
  border-bottom: none;
}
.search-bar .search-trigger {
  position: absolute;
  right: 20px;
  bottom: 0;
  padding: 0;
  color: #9a9a9a;
  font-size: 1.325em;
}
.search-bar label {
  margin-top: 16px;
  margin-bottom: 4px;
}

.admin .main {
  width: 100%;
  max-width: 1000px;
}

.admin h1.group,
.admin h1.uo {
  position: relative;
  text-indent: 36px;
}
.admin h1.group:before,
.admin h1.uo:before {
  content: "";
  position: absolute;
  width: 60px;
  height: 100%;
  top: 20%;
  left: -5px;
  z-index: -1;
  transform: rotate(30deg);
  background-image: url("../assets/img/group.svg");
  background-size: 40%;
  background-repeat: no-repeat;
  background-position: 0px 50%;
}

.admin h1.uo:before {
  background-image: url("../assets/img/uo.svg");
  background-size: 36%;
}

.data-field {
  font-weight: bold;
}

.admin-table {
  margin-right: 34px;
  overflow: scroll;
}
.admin-table .tr {
  display: flex;
  margin-right: 30px;
}
.admin-table .tr.edit {
  background-color: #f1f1ea;
}
.admin-table .thead,
.admin-table .tbody {
  width: fit-content;
  margin-right: 120px;
}
.admin-table .tbody {
  position: relative;
  height: 400px;
  padding-top: 28px;
  padding-bottom: 30px;
  overflow-x: hidden;
  overflow-y: scroll;
}
.admin-table .tbody .tr {
  cursor: pointer;
}
.admin-table .tbody .tr:hover {
  background-color: #fbfbf6;
}
.admin-table .tbody .tr.edit {
  background-color: #f1f1ea;
}
.admin-table .th {
  padding-top: 6px;
}
.admin-table .th div:first-child {
  font-weight: 700;
}
.admin-table .th:last-of-type {
  position: absolute;
  right: 24px;
  width: auto;
  padding-top: 0;
  background: #ffffff;
}
.admin-table .th,
.admin-table .td {
  flex: 140 0 auto;
  width: 140px;
  padding-right: 8px;
  padding-left: 8px;
}
.admin-table .th:first-of-type,
.admin-table .td:first-of-type {
  padding-left: 0;
}
.admin-table .th.md,
.admin-table .td.md {
  flex: 200 0 auto;
  width: 200px;
}
.admin-table .th.lg,
.admin-table .td.lg {
  flex: 300 0 auto;
  width: 300px;
}
.admin-table .sort {
  position: relative;
  margin-left: 18px;
}
.admin-table .sort:after {
  transform: rotate(45deg);
  position: absolute;
  top: 4px;
  right: 50%;
  width: 10px;
  height: 10px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #9a9a9a;
  content: "";
}
.admin-table .sort::after {
  transition: transform 0.2s;
  transform-origin: 7px 7px;
}
.admin-table .sort.reverse::after {
  transform: rotate(-134.9deg);
}
.admin-table .sort:hover::after {
  border-color: #0053d8;
}
.admin-table .modal.modal-right .modal-box {
  min-width: 560px;
}
.admin-table .modal.modal-right .modal-box .modal-column:first-of-type {
  padding-right: 24px;
}
.admin-table .modal.modal-right .modal-box .modal-column:last-of-type {
  padding-left: 24px;
}

.admin-table--context-menu {
  position: absolute;
  top: 0;
  left: 0;
  padding: 0;
  list-style: none;
  pointer-events: all;
  background: #ffffff;
  border-radius: 3px;
  opacity: 0;
  visibility: hidden;
  transform: scale(0.95) translate(-50%, -50%);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  transition: scale 0.3s, top 0s, left 0s;
}
.admin-table--context-menu li a {
  display: block;
  padding: 8px 16px;
  text-align: center;
  cursor: pointer;
  transition: all 0.15s;
}
.admin-table--context-menu li:first-child a {
  border-bottom: 1px solid rgba(0, 83, 216, 0.1);
}
.admin-table--context-menu.open {
  opacity: 1;
  visibility: visible;
}

.flex > .admin-table {
  width: auto;
}

.at-edit {
  flex-grow: 1;
}
@media screen and (min-width: 1024px) {
  .at-edit {
    flex-wrap: nowrap;
    margin-bottom: 60px;
  }
}
.at-edit .main {
  width: 100%;
  font-size: 0.875rem;
}
@media screen and (min-width: 680px) {
  .at-edit .main {
    font-size: 1rem;
  }
}
@media screen and (min-width: 1024px) {
  .at-edit .main {
    width: 50%;
    font-size: 0.875rem;
  }
}
@media screen and (min-width: 1280px) {
  .at-edit .main {
    width: 66.6666666667%;
    font-size: 1rem;
  }
}
@media screen and (min-width: 1800px) {
  .at-edit .main {
    width: 50%;
  }
}
.at-edit .sidebar {
  width: 100%;
}
@media screen and (min-width: 1024px) {
  .at-edit .sidebar {
    width: 50%;
  }
}
@media screen and (min-width: 1280px) {
  .at-edit .sidebar {
    min-width: 650px;
  }
}
@media screen and (min-width: 1800px) {
  .at-edit .sidebar {
    width: 50%;
  }
}

.chart-circular-interactive .chart-legend-item {
  cursor: pointer;
}
.chart-circular-interactive .circular-figure .fill {
  transition: stroke-width 0.12s cubic-bezier(0.19, 1, 0.22, 1);
}

.modal {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 998;
  display: none;
  align-items: center;
  justify-content: center;
  visibility: hidden;
}
.modal.open {
  position: fixed;
  display: flex;
  visibility: visible;
}
.modal .modal-backdrop {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(51, 51, 51, 0.3);
}
.modal .modal-wrapper {
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}
.modal.margin-inset-scroll .modal-wrapper {
  margin-top: 64px;
  margin-right: 32px;
}
.modal.margin-inset-scroll .modal-wrapper .modal-header {
  padding: 0 48px 0 48px;
}
.modal.margin-inset-scroll .modal-wrapper .modal-content .modal-column {
  padding: 16px 48px 48px 48px;
}
@media screen and (max-width: 768px) {
  .modal.margin-inset-scroll .modal-wrapper {
    margin-top: 32px;
    margin-right: 0;
  }
}
.modal .modal-box {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  z-index: 999;
  max-width: 100vw;
  max-height: 100vh;
  background: #ffffff;
  box-shadow: 0 15px 25px -15px rgba(0, 0, 0, 0.4);
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .modal .modal-box {
    overflow-x: auto;
    overflow-y: auto;
  }
}
.modal .modal-box .modal-header {
  flex-shrink: 0;
  padding: 48px 48px 24px 48px;
}
.modal .modal-box .modal-header > * {
  flex-shrink: 0;
}
.modal .modal-box .modal-header h1 {
  margin-top: 0;
}
.modal .modal-box .modal-content {
  display: flex;
  max-width: inherit;
}
.modal .modal-box .modal-content .modal-column {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: min-content;
  padding: 48px;
}
.modal .modal-box .modal-content .modal-column > * {
  flex-shrink: 0;
}
.modal .modal-box .modal-content .modal-column > .illustration {
  max-width: 180px;
  max-height: 180px;
}
@media screen and (max-width: 768px) {
  .modal .modal-box .modal-content {
    flex-direction: column;
  }
}
@media screen and (min-width: 768px) {
  .modal .modal-box .modal-content {
    max-width: 1080px;
  }
}
.modal .modal-box .modal-footer {
  display: flex;
  flex-direction: column;
  min-height: min-content;
  padding: 48px;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
}
.modal .modal-box .modal-footer > * {
  flex-shrink: 0;
}
.modal .modal-box .modal-close {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  width: 48px;
  height: 48px;
  padding: 8px;
  margin: 8px;
  font-size: 1.75em;
  border-radius: 0;
}
.modal .modal-box .modal-actions-bottom {
  align-self: flex-end;
  padding-top: 16px;
  margin-top: auto;
}
.modal .modal-box .modal-actions-bottom button,
.modal .modal-box .modal-actions-bottom a {
  margin-bottom: 16px;
}
@media screen and (min-width: 768px) {
  .modal .modal-box .modal-actions-bottom button,
  .modal .modal-box .modal-actions-bottom a {
    margin-bottom: 0;
  }
}
@media screen and (min-height: 650px) and (min-width: 768px) {
  .modal .modal-box {
    max-height: 80vh;
  }
}
@media screen and (max-width: 400px) {
  .modal .modal-box {
    overflow-x: auto;
  }
}
@media screen and (max-width: 768px) {
  .modal:not(.video) .modal-box {
    height: 100%;
  }
  .modal:not(.video) .modal-box .modal-wrapper {
    flex-grow: 1;
  }
  .modal:not(.video) .modal-box .modal-content {
    flex-grow: 1;
  }
  .modal:not(.video) .modal-box .modal-column {
    flex-grow: 1;
  }
}
@media screen and (min-width: 680px) {
  .modal.small .modal-box {
    max-width: 680px;
  }
}
@media screen and (min-width: 800px) {
  .modal.medium .modal-content {
    min-height: 50vh;
  }
}
.modal.modal-right .modal-box, .modal.modal-left .modal-box {
  width: 33%;
  height: 100vh;
  max-height: 100vh;
  min-width: 520px;
  min-height: 100vh;
}
@media only screen and (max-width: 520px) {
  .modal.modal-right .modal-box, .modal.modal-left .modal-box {
    width: 100vw;
    min-width: unset;
  }
}
.modal.modal-right {
  justify-content: flex-end;
}
.modal.modal-left {
  justify-content: flex-start;
}
.modal.white-modal-close .modal-close {
  color: #ffffff;
}
.modal.light .modal-backdrop {
  background-color: rgba(255, 255, 255, 0.95);
}
.modal.video .modal-box {
  padding: 48px;
}
.modal.video .modal-box .modal-close {
  margin: 0;
}
.modal.video .modal-box .modal-content {
  position: relative;
  width: calc(100vh - 96px);
  max-width: calc(100vw - 96px);
  padding: 0;
  padding-bottom: 56.25%;
}
.modal.video .modal-box .modal-content iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.hero {
  position: relative;
  padding: 0 24px 48px;
  margin-top: 0;
}
.hero img {
  display: none;
}
@media screen and (min-width: 768px) {
  .hero img {
    display: block;
    max-width: 50vw;
    width: 900px;
    float: right;
  }
}
.hero .content {
  transform: translate3d(0%, -50%, 0);
  position: absolute;
  top: 50%;
  z-index: 3;
  display: block;
  max-width: 600px;
}
@media screen and (max-width: 768px) {
  .hero .content {
    position: relative;
    transform: translate3d(0, 0, 0);
  }
}
.hero p.lead {
  font-size: 24px;
  margin-bottom: 48px;
}

.hero {
  margin-top: 0;
}

h1.lg {
  font-size: 64px;
  line-height: 1.125;
  margin-top: 0;
  margin-bottom: 24px;
}
@media screen and (max-width: 768px) {
  h1.lg {
    font-size: 3em;
  }
}

.web .drawer,
.web .nav-panel {
  display: block;
}
@media screen and (max-width: 1024px) {
  .web .drawer,
  .web .nav-panel {
    position: fixed;
    top: 0;
    right: 0;
    display: block;
    width: 100vw;
    height: 100vh;
    background-color: #ffffff;
    transform: translateX(100%);
    transition: 0.3s all cubic-bezier(0.785, 0.135, 0.15, 0.86);
  }
  .web .drawer.in,
  .web .nav-panel.in {
    transform: translateX(0);
  }
}

nav.navigation ul.menu li a:not(.btn) {
  margin: 0 16px;
  color: #333333;
}
nav.navigation ul.menu li a:not(.btn) span {
  padding-top: 0;
  font-size: inherit;
  font-weight: inherit;
}
nav.navigation ul.menu li a.active {
  font-weight: bold;
}
@media screen and (min-width: 1024px) {
  nav.navigation ul.menu {
    align-items: baseline;
    flex-direction: row;
    justify-content: flex-end;
  }
  nav.navigation ul.menu li {
    position: relative;
    display: flex;
    width: auto;
  }
}
nav.navigation.lang {
  margin-top: 4px;
}
@media screen and (max-width: 1024px) {
  nav.navigation.lang {
    position: absolute;
    bottom: 24px;
    z-index: 1;
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 0;
    margin-bottom: 48px;
  }
}
nav.navigation.lang ul.menu {
  align-items: baseline;
  flex-direction: row;
}
@media screen and (max-width: 1024px) {
  nav.navigation.lang ul.menu {
    justify-content: center;
    padding-left: 0;
    margin-bottom: 0;
  }
}
nav.navigation.lang ul.menu li {
  border-left: 1px solid #333333;
}
nav.navigation.lang ul.menu li:first-child {
  border-left: 0;
}
nav.navigation.lang ul.menu li a {
  padding: 0 4px;
  line-height: 1;
}
nav.navigation.footer ul.menu {
  justify-content: flex-start;
}
nav.navigation.footer ul.menu li:first-child a {
  margin-left: 0;
}
@media screen and (max-width: 1024px) {
  nav.navigation.footer ul.menu {
    padding-left: 0;
  }
  nav.navigation.footer ul.menu li a {
    margin-left: 0;
  }
}

.web nav.navigation {
  z-index: 0;
}
.web nav.navigation.lang {
  z-index: 1;
}
.web nav.navigation.main {
  position: relative;
  top: auto;
  width: auto;
}
@media screen and (max-width: 1024px) {
  .web nav.navigation.main {
    position: absolute;
    top: 24px;
    width: 100%;
  }
}
@media screen and (min-width: 1500px) {
  .web nav.navigation.footer ul.menu {
    padding-left: 0;
  }
}
@media screen and (min-width: 1024px) {
  .web nav.navigation.main ul.menu > li > ul {
    display: none;
  }
  .web nav.navigation.main ul.menu > li:hover a > span {
    color: #0053d8;
  }
  .web nav.navigation.main ul.menu > li:hover > ul {
    position: absolute;
    top: 24px;
    left: 0;
    display: block;
    padding-bottom: 8px;
    padding-left: 0;
    background: #ffffff;
    box-shadow: 0 5px 15px -8px rgba(0, 0, 0, 0.2);
  }
  .web nav.navigation.main ul.menu > li:hover > ul li:nth-child(1) {
    margin-top: 16px;
  }
  .web nav.navigation.main ul.menu > li:hover > ul li {
    padding: 8px 16px;
  }
  .web nav.navigation.main ul.menu > li:hover > ul li a {
    height: 24px;
    line-height: 24px;
    white-space: nowrap;
  }
  .web nav.navigation.main ul.menu > li:hover > ul li:hover a {
    color: #0053d8;
  }
  .web nav.navigation.main ul.menu .toggle.active *:nth-child(1) {
    display: inline-block;
  }
  .web nav.navigation.main ul.menu .toggle.active *:nth-child(2) {
    display: none;
  }
}
.web nav.navigation.multi-level .nav-back {
  top: 16px;
}
.web nav.navigation.multi-level .nav-back.sub-open {
  display: none;
}
@media screen and (max-width: 1024px) {
  .web nav.navigation.multi-level .nav-back.sub-open {
    display: block;
  }
}

.app .survey-info .navigation,
.app header .navigation,
.app .drawer .navigation {
  position: relative;
  width: 25%;
}
@media screen and (max-width: 1280px) {
  .app .survey-info .navigation,
  .app header .navigation,
  .app .drawer .navigation {
    width: 33vw;
  }
}
@media screen and (max-width: 1024px) {
  .app .survey-info .navigation,
  .app header .navigation,
  .app .drawer .navigation {
    width: 50vw;
  }
}
@media screen and (max-width: 680px) {
  .app .survey-info .navigation,
  .app header .navigation,
  .app .drawer .navigation {
    width: 100vw;
    height: 0;
  }
}
@media print {
  .app .survey-info .navigation,
  .app header .navigation,
  .app .drawer .navigation {
    display: none;
  }
}
.app .survey-info .navigation.multi-level, .app .survey-info .navigation.text-links,
.app header .navigation.multi-level,
.app header .navigation.text-links,
.app .drawer .navigation.multi-level,
.app .drawer .navigation.text-links {
  width: 100%;
}
.app .survey-info .navigation.text-links .current:after,
.app header .navigation.text-links .current:after,
.app .drawer .navigation.text-links .current:after {
  transform: rotate(-45deg);
  position: absolute;
  top: calc(50% - 3px);
  right: calc(100% + 2px);
  width: 8px;
  height: 8px;
  border-right: 3px solid;
  border-bottom: 3px solid;
  border-color: #0053d8;
  content: "";
}
.app .survey-info .navigation.always-open .toggle.active > *:nth-child(1),
.app header .navigation.always-open .toggle.active > *:nth-child(1),
.app .drawer .navigation.always-open .toggle.active > *:nth-child(1) {
  display: inline-block;
}
.app .survey-info .navigation.always-open .toggle.active > *:nth-child(2),
.app header .navigation.always-open .toggle.active > *:nth-child(2),
.app .drawer .navigation.always-open .toggle.active > *:nth-child(2) {
  display: none;
}
.app .survey-info .navigation.always-open .drawer,
.app header .navigation.always-open .drawer,
.app .drawer .navigation.always-open .drawer {
  transform: translateX(0);
}
.app .survey-info .navigation.always-open .reel,
.app header .navigation.always-open .reel,
.app .drawer .navigation.always-open .reel {
  transition: 0.3s transform cubic-bezier(0.77, 0, 0.175, 1);
}
.app .survey-info .navigation ul.menu,
.app header .navigation ul.menu,
.app .drawer .navigation ul.menu {
  position: relative;
  left: 0;
  justify-content: center;
  width: 100%;
  padding-top: 32px;
  padding-right: 24px;
  padding-left: 24px;
  display: block;
}
.app .survey-info .navigation ul.menu.hide,
.app .survey-info .navigation ul.menu ul.hide,
.app header .navigation ul.menu.hide,
.app header .navigation ul.menu ul.hide,
.app .drawer .navigation ul.menu.hide,
.app .drawer .navigation ul.menu ul.hide {
  transform: translateX(-100%);
  transition-delay: 0;
}
.app .survey-info .navigation ul.menu .menu-section,
.app header .navigation ul.menu .menu-section,
.app .drawer .navigation ul.menu .menu-section {
  margin-top: 50px;
}
.app .survey-info .navigation ul.menu li,
.app header .navigation ul.menu li,
.app .drawer .navigation ul.menu li {
  position: static;
  display: block;
  width: 100%;
  margin-bottom: 0;
  border-bottom: 1px solid #dfe1e5;
  display: none;
}
.app .survey-info .navigation ul.menu li:last-child,
.app header .navigation ul.menu li:last-child,
.app .drawer .navigation ul.menu li:last-child {
  margin-bottom: 48px;
}
.app .survey-info .navigation ul.menu li a,
.app header .navigation ul.menu li a,
.app .drawer .navigation ul.menu li a {
  position: relative;
  display: block;
  width: 100%;
  min-height: 48px;
  padding: 12px 18px 12px 4px;
  margin-right: 0;
  margin-left: 0;
  transition: all 0.2s ease-in-out;
}
.app .survey-info .navigation ul.menu li a.has-children:before,
.app header .navigation ul.menu li a.has-children:before,
.app .drawer .navigation ul.menu li a.has-children:before {
  transform: rotate(-45deg);
  position: absolute;
  top: calc(50% - 3px);
  right: 8px;
  width: 8px;
  height: 8px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #333333;
  content: "";
}
.app .survey-info .navigation ul.menu li a.has-children:hover, .app .survey-info .navigation ul.menu li a:hover,
.app header .navigation ul.menu li a.has-children:hover,
.app header .navigation ul.menu li a:hover,
.app .drawer .navigation ul.menu li a.has-children:hover,
.app .drawer .navigation ul.menu li a:hover {
  color: #153a77;
  cursor: pointer;
}
.app .survey-info .navigation ul.menu li a.has-children:hover:before,
.app header .navigation ul.menu li a.has-children:hover:before,
.app .drawer .navigation ul.menu li a.has-children:hover:before {
  transform: rotate(-45deg);
  position: absolute;
  top: calc(50% - 3px);
  right: 8px;
  width: 8px;
  height: 8px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #153a77;
  content: "";
}
.app .survey-info .navigation ul.menu li a span,
.app header .navigation ul.menu li a span,
.app .drawer .navigation ul.menu li a span {
  padding-top: 0;
  font-size: inherit;
  font-weight: 400;
}
.app .survey-info .navigation ul.menu li::after,
.app header .navigation ul.menu li::after,
.app .drawer .navigation ul.menu li::after {
  content: "";
}
.app .survey-info .navigation ul.menu li > div,
.app .survey-info .navigation ul.menu li ul,
.app header .navigation ul.menu li > div,
.app header .navigation ul.menu li ul,
.app .drawer .navigation ul.menu li > div,
.app .drawer .navigation ul.menu li ul {
  position: absolute;
  top: 0;
  left: 200%;
  width: 100%;
  height: 0;
  transform: translateX(0);
}
.app .survey-info .navigation ul.menu li ul,
.app header .navigation ul.menu li ul,
.app .drawer .navigation ul.menu li ul {
  padding-top: 32px;
  padding-right: 24px;
  padding-left: 24px;
}
.app .survey-info .navigation ul.menu li.in > ul,
.app .survey-info .navigation ul.menu li.in > div,
.app header .navigation ul.menu li.in > ul,
.app header .navigation ul.menu li.in > div,
.app .drawer .navigation ul.menu li.in > ul,
.app .drawer .navigation ul.menu li.in > div {
  transform: translateX(-100%);
}
.app .survey-info .navigation ul.menu li.in > ul.hide,
.app header .navigation ul.menu li.in > ul.hide,
.app .drawer .navigation ul.menu li.in > ul.hide {
  transform: translateX(-200%);
}
.app .survey-info .navigation ul.menu li.description,
.app header .navigation ul.menu li.description,
.app .drawer .navigation ul.menu li.description {
  padding-top: 32px;
  border-bottom: 0;
}
.app .survey-info .navigation ul.menu li.in,
.app header .navigation ul.menu li.in,
.app .drawer .navigation ul.menu li.in {
  display: block;
}
.app .survey-info .navigation ul.menu .current > ul > li,
.app header .navigation ul.menu .current > ul > li,
.app .drawer .navigation ul.menu .current > ul > li {
  display: block;
}
.app .survey-info .navigation ul.menu:not(.hide) > li,
.app header .navigation ul.menu:not(.hide) > li,
.app .drawer .navigation ul.menu:not(.hide) > li {
  display: block;
}
.app header > .navigation:not(.secondary) {
  width: auto;
  height: 68px;
}
@media screen and (max-width: 680px) {
  .app header > .navigation:not(.secondary) {
    height: 0;
  }
}
.app .navigation.secondary {
  position: absolute;
  top: 0;
  right: 0;
  width: 30%;
  height: 100%;
}
.app .navigation.secondary .drawer {
  display: none;
}
.app .navigation.secondary .menu-bar {
  width: 100%;
}
.app .navigation.secondary .menu-bar li {
  width: 20%;
}
.app .navigation.secondary .menu-bar .menu-button {
  display: block;
  color: #ffffff;
  background: #0053d8;
}
.app .navigation.secondary .menu-bar .menu-button::after {
  content: none;
}
.app .navigation + .impersonate {
  margin-top: 24px;
  margin-right: 16px;
}
@media screen and (max-width: 1024px) {
  .app .navigation + .impersonate {
    display: block;
    float: left;
    padding-left: 64px;
  }
}
@media screen and (max-width: 680px) {
  .app .navigation + .impersonate {
    display: none;
  }
}

.toolbar {
  display: flex;
  align-items: baseline;
  flex-direction: row;
  margin-top: 68px;
  border-top: 1px solid #f1f1ea;
}
@media screen and (min-width: 680px) {
  .toolbar {
    position: fixed;
    z-index: 9;
    width: 100%;
    background: #ffffff;
  }
}
.toolbar form {
  display: inline-block;
  width: auto;
  justify-self: flex-end;
}
.toolbar fieldset {
  display: inline-block;
  margin: 0 16px;
}
.toolbar label.radio {
  display: inline-block;
  width: auto;
  padding: 4px 20px;
  margin-left: 8px;
  font-size: 16px;
}
.toolbar label.radio input[type=checkbox],
.toolbar label.radio input[type=radio] {
  display: none;
}
.toolbar label.radio.checked {
  color: #ffffff;
  background-color: #0053d8;
}
@media screen and (max-width: 340px) {
  .toolbar label.radio {
    padding: 2px 8px;
    margin-left: 2px;
  }
}
@media screen and (max-width: 680px) {
  .toolbar {
    flex-direction: column;
    margin-top: 0;
  }
  .toolbar form {
    padding: 16px 8px 8px;
  }
  .toolbar form fieldset {
    justify-items: center;
  }
}
.toolbar .arrow {
  position: relative;
  padding: 16px;
}
.toolbar .scroll-nav {
  position: absolute;
  right: 48px;
  padding-top: 10px;
}
@media screen and (min-width: 2400px) {
  .toolbar .scroll-nav {
    display: none;
  }
  .toolbar .scroll-nav.lg-screen {
    display: block;
  }
}
@media screen and (max-width: 998px) {
  .toolbar .scroll-nav {
    display: none;
  }
}
.toolbar .scroll-nav .arrow.inactive {
  pointer-events: none;
  opacity: 0.3;
}
.toolbar .actions {
  margin-right: 24px;
}
.toolbar .actions .btn {
  padding-right: 16px;
  padding-left: 16px;
}
@media screen and (max-width: 818px) {
  .toolbar .actions {
    display: none;
  }
}

.progress-interface {
  position: relative;
  width: 104px;
  height: 104px;
  margin: 20px;
  z-index: 50;
  display: flex;
}
.progress-interface.zero svg.circular-figure circle.fill {
  stroke: rgba(0, 194, 223, 0);
  stroke-width: 0;
}
.progress-interface nav {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 104px;
  height: 104px;
  pointer-events: none;
  transform: translate(-50%, -50%);
}
@media screen and (max-width: 1000px) {
  .progress-interface nav {
    height: 48px;
    width: calc(100vw - 16px*5 - 50px);
    top: 0;
    left: 0;
    transform: none;
  }
}
.progress-interface nav span::after,
.progress-interface nav span::before {
  pointer-events: auto;
  cursor: pointer;
}
.progress-interface nav .back,
.progress-interface nav .forward {
  position: absolute;
  display: block;
  width: 104px;
  height: 104px;
  transform: rotate(0.00001deg);
  transition: transform cubic-bezier(0.86, 0, 0.07, 1) 0.4s;
}
.progress-interface nav .back::after,
.progress-interface nav .forward::after {
  position: absolute;
  top: 52px;
  width: 36px;
  height: 36px;
  content: "";
  opacity: 0.5;
  transform: translate(-50%, -50%);
}
@media screen and (max-width: 1000px) {
  .progress-interface nav .back::after,
  .progress-interface nav .forward::after {
    top: 0;
    left: 0;
    transform: translate(0, 0);
    width: 60px;
    height: 60px;
  }
}
@media screen and (max-width: 1000px) {
  .progress-interface nav .back,
  .progress-interface nav .forward {
    position: absolute;
    height: 48px;
    width: 48px;
    pointer-events: default;
  }
}
.progress-interface nav .back:before {
  transform: rotate(135deg);
  position: absolute;
  top: 16px;
  right: auto;
  width: 12px;
  height: 12px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: rgba(51, 51, 51, 0.4);
  content: "";
}
.progress-interface nav .back::before {
  left: 24px;
}
@media screen and (min-width: 1000px) {
  .progress-interface nav .back:before {
    transform: rotate(135deg);
    position: absolute;
    top: calc(50% - 6.6px);
    right: calc(100% - 6.6px);
    width: 12px;
    height: 12px;
    border-right: 2px solid;
    border-bottom: 2px solid;
    border-color: rgba(51, 51, 51, 0.4);
    content: "";
  }
  .progress-interface nav .back::before {
    left: auto;
  }
  .progress-interface nav .back.first {
    transform: rotate(90deg);
  }
}
.progress-interface nav .forward {
  right: 0;
  display: none;
}
.progress-interface nav .forward:before {
  transform: rotate(-45deg);
  position: absolute;
  top: 16px;
  right: 24px;
  width: 12px;
  height: 12px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: rgba(51, 51, 51, 0.4);
  content: "";
}
@media screen and (min-width: 1000px) {
  .progress-interface nav .forward:before {
    transform: rotate(-45deg);
    position: absolute;
    top: calc(50% - 6.6px);
    right: calc(0% - 5.28px);
    width: 12px;
    height: 12px;
    border-right: 2px solid;
    border-bottom: 2px solid;
    border-color: rgba(51, 51, 51, 0.4);
    content: "";
  }
  .progress-interface nav .forward.last {
    transform: rotate(90deg);
  }
}
.progress-interface nav .forward::after {
  left: 104px;
}
@media screen and (max-width: 1000px) {
  .progress-interface nav .forward::after {
    left: auto;
    right: 0;
  }
}
.progress-interface.has-next nav .forward {
  display: block;
}
.progress-interface.start nav .back {
  display: none;
}
.progress-interface .chart-circular,
.progress-interface .circular-chart {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media screen and (max-width: 1000px) {
  .progress-interface .chart-circular,
  .progress-interface .circular-chart {
    height: 48px;
    width: calc(100vw - 16px*5 - 50px);
    left: 0;
    transform: translate(0, -50%);
  }
}
.progress-interface .survey-percentage-mobile {
  display: none;
  width: 80px;
  padding: 12px 16px;
  font-size: 1.25em;
  line-height: 1;
  font-weight: bold;
  text-align: center;
  background: transparent;
  border-right: 1px solid #dfe1e5;
  border-left: 1px solid #dfe1e5;
}
.progress-interface .menu {
  display: none;
  cursor: pointer;
}
.progress-interface .menu .fwsj-icon, .progress-interface .menu .dot.checked-dot::before, .progress-interface .menu .chart-job-stress-index .wave-warning-icon, .chart-job-stress-index .progress-interface .menu .wave-warning-icon, .progress-interface .menu .scale-value::before, .progress-interface .menu .organigram-item .organigram-item-inner.overview .count::before, .organigram-item .organigram-item-inner.overview .progress-interface .menu .count::before {
  color: #333333;
}
.progress-interface .menu .fwsj-icon.close, .progress-interface .menu .close.dot.checked-dot::before, .progress-interface .menu .chart-job-stress-index .close.wave-warning-icon, .chart-job-stress-index .progress-interface .menu .close.wave-warning-icon, .progress-interface .menu .close.scale-value::before, .progress-interface .menu .organigram-item .organigram-item-inner.overview .close.count::before, .organigram-item .organigram-item-inner.overview .progress-interface .menu .close.count::before {
  padding: 6px 19px;
}
.progress-interface .menu .fwsj-icon.dots, .progress-interface .menu .dots.dot.checked-dot::before, .progress-interface .menu .chart-job-stress-index .dots.wave-warning-icon, .chart-job-stress-index .progress-interface .menu .dots.wave-warning-icon, .progress-interface .menu .dots.scale-value::before, .progress-interface .menu .organigram-item .organigram-item-inner.overview .dots.count::before, .organigram-item .organigram-item-inner.overview .progress-interface .menu .dots.count::before {
  padding: 11px 23px 10px 23px;
  font-size: 24px;
}
.progress-interface .menu.active {
  padding-top: 1px;
  background: #fafafa;
}
.progress-interface progress {
  display: none;
}
@media screen and (max-width: 1000px) {
  .progress-interface {
    width: 100%;
    height: 48px;
    top: auto;
    left: 0;
    bottom: 0;
    position: fixed;
    background: #ffffff;
    margin: 0;
    box-shadow: 0 -5px 20px rgba(0, 0, 0, 0.075);
    border-top: 1px solid #dfe1e5;
    border-bottom: 3px solid #dfe1e5;
  }
  .progress-interface svg {
    display: none;
  }
  .progress-interface progress {
    position: absolute;
    bottom: -3px;
    left: 0;
    display: block;
  }
  .progress-interface .survey-percentage-mobile {
    display: block;
  }
  .progress-interface .menu {
    display: flex;
    align-items: center;
  }
}

.respondents-list li > div {
  display: inline-flex;
  align-items: flex-end;
  width: 100%;
}
.respondents-list li > div label {
  width: 100%;
  margin-bottom: 0;
}
.respondents-list li > div label .error-message {
  position: absolute;
}
.respondents-list li > div label.error, .respondents-list li > div label.error + div.small, .respondents-list li > div label.error + div.small + div.small {
  margin-bottom: 24px;
}
.respondents-list li > div textarea {
  padding-top: 10px;
  padding-bottom: 8px;
  margin-bottom: 4px;
}
@media screen and (max-width: 420px) {
  .respondents-list {
    padding: 0;
  }
  .respondents-list li > div {
    flex-wrap: wrap;
  }
  .respondents-list li > div > div.small {
    margin-left: 0;
  }
  .respondents-list li > div > div.small:not(:last-of-type) {
    width: 80%;
  }
  .respondents-list li > div > div.small:last-of-type {
    width: 20%;
  }
  .respondents-list li > div > div.small:last-of-type button {
    float: right;
    padding-right: 0;
  }
}

.app .drawer,
.app .nav-panel {
  position: relative;
  float: right;
  width: 25vw;
  height: calc(100vh - 68px);
  overflow: hidden;
  overflow-y: auto;
  clear: both;
  background-color: #fafafa;
  transform: translateX(100%);
  transition: 0.3s all cubic-bezier(0.895, 0.03, 0.685, 0.22);
}
@media screen and (max-width: 1280px) {
  .app .drawer,
  .app .nav-panel {
    width: 33vw;
  }
}
@media screen and (max-width: 1024px) {
  .app .drawer,
  .app .nav-panel {
    width: 50vw;
  }
}
@media screen and (max-width: 680px) {
  .app .drawer,
  .app .nav-panel {
    width: 100vw;
  }
}
.app .drawer.in, .app .drawer.open,
.app .nav-panel.in,
.app .nav-panel.open {
  transform: translateX(0);
  transition: 0.5s all cubic-bezier(0.23, 1, 0.32, 1);
}
.app .drawer.in .reel.ready,
.app .drawer.in .nav-slides.ready, .app .drawer.open .reel.ready,
.app .drawer.open .nav-slides.ready,
.app .nav-panel.in .reel.ready,
.app .nav-panel.in .nav-slides.ready,
.app .nav-panel.open .reel.ready,
.app .nav-panel.open .nav-slides.ready {
  transition: 0.3s transform cubic-bezier(0.77, 0, 0.175, 1);
}
.app .drawer.blue nav.navigation ul.menu li a, .app .tooltip-container .drawer.tooltip nav.navigation ul.menu li a, .tooltip-container .app .drawer.tooltip nav.navigation ul.menu li a,
.app .drawer.blue nav.navigation ul.menu li a:hover,
.app .drawer.blue nav.navigation ul.menu li a.has-children:hover,
.app .nav-panel.blue nav.navigation ul.menu li a,
.app .tooltip-container .nav-panel.tooltip nav.navigation ul.menu li a,
.tooltip-container .app .nav-panel.tooltip nav.navigation ul.menu li a,
.app .nav-panel.blue nav.navigation ul.menu li a:hover,
.app .nav-panel.blue nav.navigation ul.menu li a.has-children:hover {
  color: #ffffff;
}
.app .drawer.blue nav.navigation ul.menu li a.has-children::before, .app .tooltip-container .drawer.tooltip nav.navigation ul.menu li a.has-children::before, .tooltip-container .app .drawer.tooltip nav.navigation ul.menu li a.has-children::before,
.app .drawer.blue nav.navigation ul.menu li a.has-children:hover::before,
.app .nav-panel.blue nav.navigation ul.menu li a.has-children::before,
.app .tooltip-container .nav-panel.tooltip nav.navigation ul.menu li a.has-children::before,
.tooltip-container .app .nav-panel.tooltip nav.navigation ul.menu li a.has-children::before,
.app .nav-panel.blue nav.navigation ul.menu li a.has-children:hover::before {
  border-color: #ffffff;
}
.app .drawer.blue .nav-back:hover, .app .tooltip-container .drawer.tooltip .nav-back:hover, .tooltip-container .app .drawer.tooltip .nav-back:hover,
.app .nav-panel.blue .nav-back:hover,
.app .tooltip-container .nav-panel.tooltip .nav-back:hover,
.tooltip-container .app .nav-panel.tooltip .nav-back:hover {
  color: #ffffff;
}
.app .drawer.blue .nav-back::before, .app .tooltip-container .drawer.tooltip .nav-back::before, .tooltip-container .app .drawer.tooltip .nav-back::before,
.app .drawer.blue .nav-back:hover::before,
.app .nav-panel.blue .nav-back::before,
.app .tooltip-container .nav-panel.tooltip .nav-back::before,
.tooltip-container .app .nav-panel.tooltip .nav-back::before,
.app .nav-panel.blue .nav-back:hover::before {
  border-color: #ffffff;
}
.app .drawer .frame > div:not(.tile),
.app .drawer .nav-slide > div:not(.tile),
.app .nav-panel .frame > div:not(.tile),
.app .nav-panel .nav-slide > div:not(.tile) {
  padding: 64px;
}
@media screen and (max-width: 420px) {
  .app .drawer .frame > div:not(.tile),
  .app .drawer .nav-slide > div:not(.tile),
  .app .nav-panel .frame > div:not(.tile),
  .app .nav-panel .nav-slide > div:not(.tile) {
    padding: 32px;
  }
}
.app .drawer .frame#profile img, .app .drawer .frame.profile img,
.app .drawer .nav-slide#profile img,
.app .drawer .nav-slide.profile img,
.app .nav-panel .frame#profile img,
.app .nav-panel .frame.profile img,
.app .nav-panel .nav-slide#profile img,
.app .nav-panel .nav-slide.profile img {
  display: block;
  width: 75px;
  margin-bottom: 60px;
}
.app .drawer .frame .btn,
.app .drawer .nav-slide .btn,
.app .nav-panel .frame .btn,
.app .nav-panel .nav-slide .btn {
  margin-right: 50%;
  margin-left: 0;
}
.app .drawer .frame strong,
.app .drawer .nav-slide strong,
.app .nav-panel .frame strong,
.app .nav-panel .nav-slide strong {
  display: block;
  margin-bottom: 16px;
}
.app .drawer .frame#profile .drawer-impersonate, .app .drawer .frame.profile .drawer-impersonate,
.app .drawer .nav-slide#profile .drawer-impersonate,
.app .drawer .nav-slide.profile .drawer-impersonate,
.app .nav-panel .frame#profile .drawer-impersonate,
.app .nav-panel .frame.profile .drawer-impersonate,
.app .nav-panel .nav-slide#profile .drawer-impersonate,
.app .nav-panel .nav-slide.profile .drawer-impersonate {
  display: flex;
  align-items: center;
  flex-direction: row;
  margin-bottom: 60px;
}
.app .drawer .frame#profile .drawer-impersonate img, .app .drawer .frame.profile .drawer-impersonate img,
.app .drawer .nav-slide#profile .drawer-impersonate img,
.app .drawer .nav-slide.profile .drawer-impersonate img,
.app .nav-panel .frame#profile .drawer-impersonate img,
.app .nav-panel .frame.profile .drawer-impersonate img,
.app .nav-panel .nav-slide#profile .drawer-impersonate img,
.app .nav-panel .nav-slide.profile .drawer-impersonate img {
  margin-bottom: 0;
}
.app .drawer .frame#profile .drawer-impersonate > div, .app .drawer .frame.profile .drawer-impersonate > div,
.app .drawer .nav-slide#profile .drawer-impersonate > div,
.app .drawer .nav-slide.profile .drawer-impersonate > div,
.app .nav-panel .frame#profile .drawer-impersonate > div,
.app .nav-panel .frame.profile .drawer-impersonate > div,
.app .nav-panel .nav-slide#profile .drawer-impersonate > div,
.app .nav-panel .nav-slide.profile .drawer-impersonate > div {
  width: calc(100% - 75px - 12px);
  margin-left: 12px;
}
@media screen and (min-width: 1025px) and (max-width: 1324px) {
  .app .drawer .frame#profile .drawer-impersonate, .app .drawer .frame.profile .drawer-impersonate,
  .app .drawer .nav-slide#profile .drawer-impersonate,
  .app .drawer .nav-slide.profile .drawer-impersonate,
  .app .nav-panel .frame#profile .drawer-impersonate,
  .app .nav-panel .frame.profile .drawer-impersonate,
  .app .nav-panel .nav-slide#profile .drawer-impersonate,
  .app .nav-panel .nav-slide.profile .drawer-impersonate {
    align-items: flex-start;
    flex-direction: column;
  }
  .app .drawer .frame#profile .drawer-impersonate > div, .app .drawer .frame.profile .drawer-impersonate > div,
  .app .drawer .nav-slide#profile .drawer-impersonate > div,
  .app .drawer .nav-slide.profile .drawer-impersonate > div,
  .app .nav-panel .frame#profile .drawer-impersonate > div,
  .app .nav-panel .frame.profile .drawer-impersonate > div,
  .app .nav-panel .nav-slide#profile .drawer-impersonate > div,
  .app .nav-panel .nav-slide.profile .drawer-impersonate > div {
    width: 100%;
    margin-top: 16px;
    margin-left: 0;
  }
}
.app .drawer ul,
.app .nav-panel ul {
  padding-left: 0;
  margin-bottom: 42px;
}
.app .drawer ul a.btn.pseudo,
.app .nav-panel ul a.btn.pseudo {
  padding: 0;
  color: #0053d8;
  border: 0;
}
.app .drawer ul a.btn.pseudo:hover,
.app .nav-panel ul a.btn.pseudo:hover {
  background: transparent;
}
.app .drawer ul a,
.app .nav-panel ul a {
  color: #333333;
  transition: all 0.2s ease-in-out;
}
.app .drawer ul a:hover,
.app .nav-panel ul a:hover {
  color: #153a77;
}
.app .drawer h4, .app .drawer .module-list-disabled > div p, .module-list-disabled > div .app .drawer p,
.app .drawer .navigation > p,
.app .drawer .breadcrumbs-container,
.app .nav-panel h4,
.app .nav-panel .module-list-disabled > div p,
.module-list-disabled > div .app .nav-panel p,
.app .nav-panel .navigation > p,
.app .nav-panel .breadcrumbs-container {
  padding: 32px 28px 0;
}
.app .drawer .tile h4, .app .drawer .tile .module-list-disabled > div p, .module-list-disabled > div .app .drawer .tile p,
.app .nav-panel .tile h4,
.app .nav-panel .tile .module-list-disabled > div p,
.module-list-disabled > div .app .nav-panel .tile p {
  padding: 0;
}

.question {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media screen and (max-height: 850px) {
  .question .tile {
    padding: 40px 64px;
  }
}
.question .tutorial {
  flex-shrink: 0;
}
.question .tutorial label {
  margin-bottom: 16px;
}
.question .tutorial a {
  margin: 16px 0 24px 0;
  font-size: 24px;
  transition: color 0.2s ease-in-out;
}
.question .tutorial i {
  margin-right: 8px;
  font-size: 16px;
  line-height: 2.25;
  transition: color 0.2s ease-in-out;
}
.question .tile:nth-of-type(1),
.question .tile:nth-of-type(3) {
  flex-grow: 1;
}
.question .tile:nth-of-type(2) {
  flex-grow: 2;
}
@media screen and (max-width: 680px) {
  .question .tile:nth-of-type(3) {
    padding-bottom: 68px;
  }
}

.reel,
.nav-slides {
  width: calc(5 * 100%);
  transform: translateX(0%);
}
.reel .frame,
.reel .nav-slide,
.nav-slides .frame,
.nav-slides .nav-slide {
  float: left;
  width: calc(100% / 5);
  min-height: calc(100vh - 68px);
}

.lang.settings li {
  margin-right: 16px;
}
.lang.settings li a.active {
  font-weight: bold;
}

.logo {
  width: auto;
  float: left;
}
.logo .large {
  height: 50px;
}
@media screen and (max-width: 768px) {
  .logo .desktop {
    display: none;
  }
}
.logo .mobile {
  display: none;
}
@media screen and (max-width: 768px) {
  .logo .mobile {
    display: block;
  }
}

.header,
.app-header {
  position: fixed;
  top: 0;
  z-index: 15;
  width: 100vw;
  background: #ffffff;
  border-bottom: 1px solid #f1f1ea;
}
@media print {
  .header,
  .app-header {
    position: relative;
    border-bottom: 0;
  }
}
.header .logo,
.app-header .logo {
  float: left;
  margin: 21.6px;
}
.header > *,
.app-header > * {
  float: right;
}
.header .btn,
.app-header .btn {
  margin: 8px;
}
@media screen and (max-width: 1024px) {
  .header > *:not(.container),
  .app-header > *:not(.container) {
    display: none;
  }
  .header .navigation,
  .app-header .navigation {
    display: block;
  }
}
@media screen and (max-width: 680px) {
  .header,
  .app-header {
    height: 0;
  }
}

.web .header,
.web .app-header {
  border-bottom: 2px solid #fafafa;
}
.web .header .container,
.web .app-header .container {
  background-color: #ffffff;
}
.web .header > *,
.web .app-header > * {
  float: none;
}
.web .header .logo,
.web .app-header .logo {
  margin-left: 0px;
}
@media screen and (max-width: 1024px) {
  .web .header .logo,
  .web .app-header .logo {
    margin: 0;
  }
  .web .header .logo img,
  .web .app-header .logo img {
    max-width: calc(100vw - 110px);
  }
}
@media screen and (min-width: 1024px) {
  .web .header .logo,
  .web .app-header .logo {
    z-index: 9;
    position: absolute;
  }
}
@media screen and (min-width: 1600px) {
  .web .header .logo,
  .web .app-header .logo {
    margin-left: -100px;
  }
}
.web .app-body {
  margin-top: 143px;
}
.web .main-body {
  margin-top: 166px;
}
@media screen and (max-width: 1024px) {
  .web .main-body {
    margin-top: 143px;
  }
}

@media screen and (max-width: 680px) {
  body {
    margin-bottom: 68px;
  }
}
.app {
  position: relative;
  overflow-x: hidden;
}

.analysis .view-header,
.analysis .header-view {
  margin: 36px 60px 36px 60px;
}
@media screen and (min-width: 680px) {
  .analysis .view-header,
  .analysis .header-view {
    margin-top: 170px;
  }
}
.analysis .view-header .flex,
.analysis .header-view .flex {
  justify-content: space-between;
}
.analysis .view-header .analysis-summary,
.analysis .header-view .analysis-summary {
  flex-direction: row;
  justify-content: space-evenly;
}
@media screen and (max-width: 1024px) {
  .analysis .view-header .flex,
  .analysis .header-view .flex {
    flex-direction: column;
  }
  .analysis .view-header .flex .analysis-summary,
  .analysis .view-header .flex .typeahead,
  .analysis .header-view .flex .analysis-summary,
  .analysis .header-view .flex .typeahead {
    width: calc(100% - 16px * 3.5);
  }
  .analysis .view-header .flex .analysis-summary,
  .analysis .header-view .flex .analysis-summary {
    justify-content: space-between;
  }
}
@media screen and (max-width: 420px) {
  .analysis .view-header,
  .analysis .header-view {
    margin: 32px 0 0 32px;
  }
  .analysis .view-header .flex .analysis-summary,
  .analysis .view-header .flex .typeahead,
  .analysis .header-view .flex .analysis-summary,
  .analysis .header-view .flex .typeahead {
    width: calc(100% - 16px * 2);
  }
}

@media screen and (min-width: 681px) {
  .dashboard .view {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    margin-top: 68px;
  }
}
.dashboard .view .view-header,
.dashboard .view .header-view {
  padding: 36px 60px 24px 60px;
}
@media only screen and (max-width: 420px) {
  .dashboard .view .view-header,
  .dashboard .view .header-view {
    padding: 32px 36px;
  }
}
.dashboard .view .view-header.slim,
.dashboard .view .header-view.slim {
  position: relative;
  padding: 16px 60px;
  border-bottom: 1px solid #f1f1ea;
}
@media screen and (max-width: 420px) {
  .dashboard .view .view-header.slim,
  .dashboard .view .header-view.slim {
    padding: 16px 24px;
  }
}
.dashboard .view .view-header.slim .form-bar,
.dashboard .view .header-view.slim .form-bar {
  margin-bottom: 0;
}
.dashboard .view .view-header.slim .form-bar h1,
.dashboard .view .header-view.slim .form-bar h1 {
  margin-bottom: 16px;
}
@media screen and (max-width: 420px) {
  .dashboard .view .view-header.slim .form-bar .form-bar-action,
  .dashboard .view .header-view.slim .form-bar .form-bar-action {
    float: left;
    margin-top: 0;
    margin-right: 16px;
  }
  .dashboard .view .view-header.slim .form-bar .form-bar-action a.btn,
  .dashboard .view .header-view.slim .form-bar .form-bar-action a.btn {
    margin: 0;
  }
  .dashboard .view .view-header.slim .form-bar .form-bar-data,
  .dashboard .view .header-view.slim .form-bar .form-bar-data {
    margin-right: 0;
  }
}
.dashboard .view .main-body {
  margin-top: 0;
}
.dashboard .view .main-body + .view-nav {
  margin-top: auto;
}
@media screen and (max-width: 680px) {
  .dashboard .view .view-header,
  .dashboard .view .header-view {
    margin: 0;
  }
}
.dashboard .view.full-height,
.dashboard .view.full-height .full-height {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
.dashboard .view.full-height .site-footer,
.dashboard .view.full-height .full-height .site-footer {
  margin-top: auto;
}

.header-flex-row {
  display: flex;
  align-items: center;
}
.header-flex-row > div {
  margin-right: 24px;
}
@media screen and (max-width: 680px) {
  .header-flex-row .nav-back-collapsed {
    border: 0;
  }
  .header-flex-row .nav-back-collapsed::before {
    margin-right: 0;
  }
  .header-flex-row .nav-back-collapsed span {
    display: none;
  }
  .header-flex-row > div {
    margin-right: 8px;
  }
}

.view-nav {
  display: flex;
  align-items: center;
  min-height: 62px;
  padding: 0 60px;
  padding-right: 0;
  background: #ffffff;
  border-top: 2px solid #f1f1ea;
  border-bottom: 1px solid #f1f1ea;
}
.view-nav .nav-back {
  margin: 0;
}
@media screen and (max-width: 680px) {
  .view-nav {
    display: none;
  }
}
@media screen and (max-width: 680px) {
  .view-nav.fixed {
    position: fixed;
    top: 0;
    z-index: 20;
    display: flex;
    width: 100%;
    padding: 0 24px;
    padding-right: 0;
  }
}
.view-nav .breadcrumbs {
  margin: 0 0 0 24px;
}
@media screen and (max-width: 1024px) {
  .view-nav .breadcrumbs {
    display: none;
  }
}
.view-nav .tabs {
  margin: 0 0 0 auto;
}
.view-nav .tabs ul {
  height: unset;
}
.view-nav .tabs li {
  padding: 12px 0;
  margin: 0;
  font-weight: normal;
  border-bottom: 0;
}
.view-nav .tabs li a,
.view-nav .tabs li a:visited {
  display: flex;
  align-items: center;
  padding: 4px 20px;
  color: #0053d8;
  border-left: 1px solid rgba(0, 83, 216, 0.2);
}
.view-nav .tabs li a span,
.view-nav .tabs li a:visited span {
  margin-left: 4px;
}
.view-nav .tabs li a i,
.view-nav .tabs li a:visited i {
  font-size: 20px;
}
@media screen and (max-width: 1024px) {
  .view-nav .tabs li:not(.active) a span {
    display: none;
  }
}
@media screen and (max-width: 680px) {
  .view-nav .tabs li a span {
    display: none;
  }
}
.view-nav .tabs li:last-child a,
.view-nav .tabs li:last-child a:visited {
  border-right: 1px solid rgba(0, 83, 216, 0.2);
}
.view-nav .tabs li.active {
  font-weight: normal;
  background: #0053d8;
  border: 0;
}
.view-nav .tabs li.active a,
.view-nav .tabs li.active a:visited {
  color: white;
}

.scale-section {
  display: -ms-grid;
  display: grid;
  padding: 0;
  -ms-grid-columns: 1fr 1fr 1fr 450px;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: max-content;
}
@media screen and (max-width: 1024px), print {
  .scale-section {
    display: flex;
    flex-direction: column;
  }
}
@media print {
  .scale-section {
    display: block;
    order: 999;
  }
}
.scale-section .scale-section-header {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 56px 64px 0;
  -ms-grid-column: 1;
  -ms-grid-column-span: 3;
  grid-column: 1/span 3;
}
@media screen and (max-width: 1024px) {
  .scale-section .scale-section-header {
    padding: 56px 64px 16px;
  }
}
@media screen and (max-width: 420px) {
  .scale-section .scale-section-header {
    padding: 32px 36px 8px;
  }
}
.scale-section .scale-section-header h2 {
  margin-right: 48px;
}
.scale-section .scale-section-header .analysis-summary {
  cursor: default;
}
.scale-section .scale-section-content {
  min-width: 0;
  padding: 56px 64px;
  box-sizing: border-box;
  -ms-grid-row: 2;
  -ms-grid-column: 1;
  -ms-grid-column-span: 3;
  grid-column: 1/span 3;
}
@media screen and (max-width: 1024px) {
  .scale-section .scale-section-content {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .scale-section .scale-section-content {
    padding: 64px 16px 64px 36px;
  }
}
@media only screen and (max-width: 420px) {
  .scale-section .scale-section-content {
    padding: 32px 22px;
  }
}
.scale-section .show-all-scales {
  display: flex;
  align-items: center;
  width: 90%;
  max-width: 1200px;
  margin: 36px 0;
  font-weight: 700;
  color: #0053d8;
  cursor: pointer;
}
.scale-section .show-all-scales div {
  flex-grow: 1;
  height: 2px;
  margin: 0 8px;
  background: #dfe1e5;
}
.scale-section .collapse-scales {
  position: relative;
  margin-left: -24px;
  padding-left: 24px;
}
.scale-section .collapse-scales .collapse-indicator {
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  height: 100%;
  font-weight: 700;
  color: #0053d8;
  cursor: pointer;
  transform: rotate(-180deg);
  writing-mode: tb-rl;
}
@media print {
  .scale-section .collapse-scales .collapse-indicator {
    display: none;
  }
}
.scale-section .collapse-scales .collapse-indicator div:first-child,
.scale-section .collapse-scales .collapse-indicator div:last-child {
  flex-grow: 1;
  width: 5px;
  margin-right: 8px;
  border-right: 2px solid #dfe1e5;
}
.scale-section .collapse-scales .collapse-indicator div:first-child {
  margin-bottom: 8px;
  border-top: 2px solid #dfe1e5;
}
.scale-section .collapse-scales .collapse-indicator div:last-child {
  margin-top: 8px;
  border-bottom: 2px solid #dfe1e5;
}
.scale-section .collapse-scales.preEnter, .scale-section .collapse-scales.entering {
  transform-origin: top center;
  overflow: hidden;
  transition: transform 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955), height 0.25s cubic-bezier(0.39, 0.575, 0.565, 1), opacity 0.075s cubic-bezier(0.47, 0, 0.745, 0.715);
}
.scale-section .collapse-scales.preExit, .scale-section .collapse-scales.exiting {
  transform-origin: top center;
  overflow: hidden;
  transition: transform 0.17s cubic-bezier(0.455, 0.03, 0.515, 0.955), height 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.2s cubic-bezier(0.47, 0, 0.745, 0.715);
}
.scale-section .collapse-scales.preEnter, .scale-section .collapse-scales.exiting {
  height: 96px;
  transform: scale(1, 0.75);
  opacity: 0;
}
.scale-section .collapse-scales.entering, .scale-section .collapse-scales.preExit {
  transform: scale(1, 1);
  opacity: 1;
}
.scale-section .scale-group-title {
  padding: 48px 0 16px;
  font-size: 1.125em;
}
.scale-section .scale-group-title.endpoint {
  padding: 24px 0;
}
.scale-section .scale-section-aside {
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  -ms-grid-column: 4;
  grid-row: 1/span 2;
  grid-column: 4;
  min-width: 350px;
}
@media screen and (max-width: 1024px), print {
  .scale-section .scale-section-aside {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
}

.scale-section-compare {
  display: block;
}
@media screen and (max-width: 1024px) {
  .scale-section-compare {
    overflow-x: scroll;
  }
}
.scale-section-compare .scale-section-header {
  justify-content: flex-start;
}
.scale-section-compare .scale-section-compare-content {
  display: flex;
  flex-wrap: wrap;
  padding: 16px 64px 56px;
}
@media screen and (max-width: 1024px) {
  .scale-section-compare .scale-section-compare-content {
    width: 1024px;
  }
}
.scale-section-compare .scale-group-header {
  width: calc(37.5% - 20px);
  margin-right: 36px;
}
@media screen and (max-width: 1024px) {
  .scale-section-compare .scale-group-header {
    margin-right: 16px;
  }
}
.scale-section-compare .scale-group-header.ghost {
  pointer-events: none;
  opacity: 0.4;
}
.scale-section-compare .scale-group-header:nth-of-type(2) {
  margin-right: 0;
  margin-left: 45px;
}
.scale-section-compare .scale-group-filter-container {
  display: none;
}
.scale-section-compare .scale-group-filter-container.active {
  display: inline-block;
  margin-right: 16px;
}

.flex.survey-container {
  width: 100%;
  min-height: 100vh;
}
.flex.survey-container .survey-info .tile,
.flex.survey-container .btn.icon {
  display: inline-block;
}
@media screen and (max-width: 1000px) {
  .flex.survey-container .flex-1of6,
  .flex.survey-container .flex-2of6 {
    width: 0;
  }
  .flex.survey-container .flex-3of6 {
    width: 100%;
    margin-top: 40px;
  }
}
@media screen and (min-width: 1000px) {
  .flex.survey-container {
    padding: 0;
  }
  .flex.survey-container .flex-1of6 {
    position: fixed;
    align-items: flex-end;
  }
  .flex.survey-container .progress-interface {
    position: absolute;
    top: 24px;
    left: 24px;
  }
  .flex.survey-container > * {
    position: relative;
    min-height: 100vh;
  }
  .flex.survey-container .flex-3of6 {
    margin-left: 16.6666666667%;
  }
}
@media screen and (min-width: 1000px) and (min-width: 1600px) {
  .flex.survey-container .flex-3of6 {
    margin-left: 266.6666666667px;
  }
}
@media screen and (min-width: 1000px) {
  .flex.survey-container .flex-3of6 .survey {
    overflow-x: hidden;
    overflow-y: scroll;
  }
  .flex.survey-container .flex-3of6 .survey::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0);
    transition: background 0.3s cubic-bezier(0.445, 0.05, 0.55, 0.95);
  }
  .flex.survey-container .flex-3of6 .survey.scrollable {
    height: 100vh;
  }
  .flex.survey-container .flex-3of6 .survey.scrollable::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.15);
  }
  .flex.survey-container .btn.close {
    bottom: auto;
    height: 50px;
  }
  .flex.survey-container .btn.close i {
    color: #9a9a9a;
  }
  .flex.survey-container aside {
    position: fixed;
    right: 0;
    height: 100%;
    min-height: 100vh;
    overflow-y: scroll;
    transition: 0.3s cubic-bezier(0.86, 0, 0.07, 1) all;
  }
}
@media screen and (min-width: 1000px) and (min-width: 1600px) {
  .flex.survey-container aside {
    width: calc(50% - 266.6666666667px);
  }
}
@media screen and (min-width: 1000px) {
  .flex.survey-container aside > .btn.icon i {
    margin-left: 2px;
  }
  .flex.survey-container aside .timeline-container {
    position: relative;
    transition: 0.3s cubic-bezier(0.86, 0, 0.07, 1) transform;
  }
  .flex.survey-container aside.shift .timeline-container {
    transform: translateY(-30%);
  }
}
@media screen and (min-width: 2400px) {
  .flex.survey-container.flex aside {
    width: calc(50% - 266.6666666667px);
  }
}
@media screen and (max-width: 1000px) {
  .flex.survey-container {
    padding-top: 4px;
  }
}

form.survey {
  position: relative;
  width: 100%;
  min-height: calc(100vh - (48px));
  padding-top: 0;
  padding-bottom: 0;
  margin: 0;
}
@media screen and (min-width: 680px) {
  form.survey {
    padding: 0 48px;
  }
}
@media screen and (min-width: 1000px) {
  form.survey {
    padding: 24px 48px 0 0;
  }
}
form.survey legend {
  outline: none;
}
form.survey legend h3 {
  font-size: 0.75em;
}

*::-webkit-scrollbar {
  float: right;
  width: 8px;
}

*::-webkit-scrollbar-thumb {
  width: 6px;
  background-color: rgba(0, 0, 0, 0.2);
}

.survey-container aside {
  z-index: 999;
  background: #fafafa;
}

ul.survey-timeline {
  max-width: 320px;
  min-height: calc(100vh - 216px);
  margin: 108px 48px;
}
@media screen and (max-width: 1000px) {
  ul.survey-timeline {
    display: none;
  }
}

.survey-percentage {
  position: absolute;
  top: -7px;
  width: 48px;
  padding: 4px 0 6px;
  font-weight: 700;
  line-height: 1;
  color: #333333;
  text-align: center;
  cursor: pointer;
  background: rgba(214, 214, 200, 0.6);
  transform: translateY(-50%);
  transition: 0.3s top cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.survey-percentage::after {
  position: absolute;
  top: 0;
  right: -13px;
  border-top: 13px solid transparent;
  border-bottom: 13px solid transparent;
  border-left: 13px solid rgba(214, 214, 200, 0.6);
  content: " ";
}
@media screen and (max-width: 1000px) {
  .survey-percentage {
    display: none;
  }
}

.app .survey-navigation .shortcuts,
.survey-navigation .shortcuts {
  position: fixed;
  right: 58px;
  bottom: 32px;
  display: flex;
}
.app .survey-navigation .shortcuts .icon,
.survey-navigation .shortcuts .icon {
  display: block;
  margin: 0 0 0 0.3em;
}
.app .survey-navigation .shortcuts .icon i,
.survey-navigation .shortcuts .icon i {
  display: block;
}
.app .survey-navigation .shortcuts .lang,
.survey-navigation .shortcuts .lang {
  width: 50px;
  height: 50px;
  font-weight: normal;
  line-height: 0.9em;
}
.app .survey-navigation .drawer,
.survey-navigation .drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10;
  height: 100vh;
  overflow-x: hidden;
  background-color: #ffffff;
}
.app .survey-navigation .drawer .navigation ul.menu,
.app .survey-navigation .drawer .navigation ul.menu ul,
.survey-navigation .drawer .navigation ul.menu,
.survey-navigation .drawer .navigation ul.menu ul {
  padding-top: 80px;
}
.app .survey-navigation .drawer .navigation ul.menu .survey-help,
.app .survey-navigation .drawer .navigation ul.menu ul .survey-help,
.survey-navigation .drawer .navigation ul.menu .survey-help,
.survey-navigation .drawer .navigation ul.menu ul .survey-help {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: auto;
  min-height: 100vh;
}
.app .survey-navigation .drawer .navigation ul.menu .survey-help .tile:nth-of-type(1),
.app .survey-navigation .drawer .navigation ul.menu ul .survey-help .tile:nth-of-type(1),
.survey-navigation .drawer .navigation ul.menu .survey-help .tile:nth-of-type(1),
.survey-navigation .drawer .navigation ul.menu ul .survey-help .tile:nth-of-type(1) {
  display: block;
  padding-top: 96px;
  overflow: visible;
}
.app .survey-navigation .drawer .navigation ul.menu .tile ul,
.app .survey-navigation .drawer .navigation ul.menu ul .tile ul,
.survey-navigation .drawer .navigation ul.menu .tile ul,
.survey-navigation .drawer .navigation ul.menu ul .tile ul {
  position: unset;
  height: unset;
  padding: 0 0 0 24px;
  list-style: disc;
}
.app .survey-navigation .drawer .navigation ul.menu .tile ul li,
.app .survey-navigation .drawer .navigation ul.menu ul .tile ul li,
.survey-navigation .drawer .navigation ul.menu .tile ul li,
.survey-navigation .drawer .navigation ul.menu ul .tile ul li {
  position: relative;
  display: list-item;
  width: unset;
  border: 0;
}
.app .survey-navigation .drawer .nav-back,
.survey-navigation .drawer .nav-back {
  top: 60px;
}
.app .survey-navigation .close,
.survey-navigation .close {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 30;
  display: block;
  padding: 24px;
}
@media screen and (max-width: 1000px) {
  .app .survey-navigation .drawer,
  .survey-navigation .drawer {
    bottom: 48px;
    width: 100%;
    height: auto;
  }
  .app .survey-navigation .menu,
  .survey-navigation .menu {
    display: block;
  }
  .app .survey-navigation .menu .survey-help .tile:nth-of-type(2),
  .survey-navigation .menu .survey-help .tile:nth-of-type(2) {
    padding-bottom: 100px;
  }
  .app .survey-navigation .shortcuts,
  .survey-navigation .shortcuts {
    display: none;
  }
}
@media screen and (min-width: 1000px) {
  .app .survey-navigation .drawer,
  .survey-navigation .drawer {
    right: auto;
    left: auto;
    width: 33.3333333333%;
    color: #ffffff;
    background-color: #0053d8;
    background-image: linear-gradient(232deg, #008bee, #005adb 50%, #0053d8);
  }
  .app .survey-navigation .drawer nav.navigation ul.menu,
  .survey-navigation .drawer nav.navigation ul.menu {
    padding-right: 64px;
    padding-left: 64px;
  }
  .app .survey-navigation .drawer nav.navigation ul.menu li ul,
  .survey-navigation .drawer nav.navigation ul.menu li ul {
    padding-right: 64px;
    padding-left: 64px;
  }
  .app .survey-navigation .drawer nav.navigation ul.menu li a,
  .app .survey-navigation .drawer nav.navigation ul.menu li a:hover,
  .app .survey-navigation .drawer nav.navigation ul.menu li a.has-children:hover,
  .survey-navigation .drawer nav.navigation ul.menu li a,
  .survey-navigation .drawer nav.navigation ul.menu li a:hover,
  .survey-navigation .drawer nav.navigation ul.menu li a.has-children:hover {
    color: #ffffff;
  }
  .app .survey-navigation .drawer nav.navigation ul.menu li a.has-children::before,
  .app .survey-navigation .drawer nav.navigation ul.menu li a.has-children:hover::before,
  .survey-navigation .drawer nav.navigation ul.menu li a.has-children::before,
  .survey-navigation .drawer nav.navigation ul.menu li a.has-children:hover::before {
    border-color: #ffffff;
  }
  .app .survey-navigation .drawer .nav-back,
  .app .survey-navigation .drawer .nav-back:hover,
  .survey-navigation .drawer .nav-back,
  .survey-navigation .drawer .nav-back:hover {
    left: 56px;
    color: #ffffff;
  }
  .app .survey-navigation .drawer .nav-back::before,
  .app .survey-navigation .drawer .nav-back:hover::before,
  .survey-navigation .drawer .nav-back::before,
  .survey-navigation .drawer .nav-back:hover::before {
    border-color: #ffffff;
  }
  .app .survey-navigation .close,
  .survey-navigation .close {
    color: #ffffff;
  }
}
@media screen and (min-width: 1600px) {
  .app .survey-navigation .drawer,
  .survey-navigation .drawer {
    width: calc(50% - 266.6666666667px);
  }
}

.carousel {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  min-height: 300px;
}
.carousel.animate .slide {
  transition: 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) all;
}
@media screen and (max-width: 1024px) {
  .carousel.animate .slide {
    transition: 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) all;
  }
}
.carousel .slide {
  position: absolute;
  top: 0;
  left: 100%;
  display: block;
  width: 100%;
  height: 100%;
  transform: translate(0, 0);
}
.carousel .slide.active {
  left: 0;
}
.carousel .slide.past {
  left: -100%;
}
.carousel .slide .flex-row {
  flex-direction: row;
  width: 100%;
}
.carousel .slide .flex-col {
  flex-direction: column;
}
.carousel .btn img {
  max-width: 12px;
  margin-right: 16px;
}
.carousel .btn.play {
  margin-top: 8px;
}
@media screen and (max-width: 767px) {
  .carousel .flex-row {
    margin-bottom: 0;
  }
}
.carousel .space-around {
  justify-content: space-around;
}
@media screen and (max-width: 767px) {
  .carousel .space-around {
    justify-content: flex-start;
  }
}

.app .onboarding {
  width: 100vw;
  height: 100vh;
}

.onboarding {
  width: 100%;
  height: 600px;
}
.onboarding .bottom {
  position: absolute;
  bottom: 120px;
  left: 0;
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .onboarding .bottom {
    bottom: 0;
  }
}
@media screen and (max-width: 420px) {
  .onboarding .content > div {
    display: flex;
    align-items: flex-start;
    flex-flow: column;
  }
  .onboarding .top h2 {
    margin-top: 96px;
    font-size: 1.5em;
  }
  .onboarding .content.middle br {
    display: none;
  }
}
.onboarding .mockup {
  position: relative;
  align-self: flex-start;
  width: auto;
  max-width: 300px;
  max-height: 90%;
  margin: auto;
}
@media screen and (max-width: 1024px) {
  .onboarding .mockup {
    max-width: 200px;
  }
}
@media screen and (max-width: 680px) {
  .onboarding .mockup {
    display: none;
  }
}
@media screen and (max-height: 520px) {
  .onboarding h1 {
    font-size: 1.5em;
  }
  .onboarding h2.lg.center {
    display: none;
  }
  .onboarding .flex-row {
    margin-top: 10px;
  }
  .onboarding .content {
    width: 100%;
  }
  .onboarding .content > div {
    width: 100%;
  }
  .onboarding .content img {
    margin-top: -16px;
  }
  .onboarding p:not(.lead) {
    display: none;
  }
}
@media screen and (max-width: 1024px) {
  .onboarding .flex-1of3.tablet-portrait {
    width: 33.3333333333%;
  }
}
@media screen and (max-width: 767px) {
  .onboarding .flex-1of3.tablet-portrait {
    width: 100%;
    padding: 4px;
  }
  .onboarding .flex-1of3.tablet-portrait:first-child {
    margin-top: 8px;
  }
  .onboarding .flex-1of3.tablet-portrait .content {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    text-align: left;
  }
  .onboarding .flex-1of3.tablet-portrait .content div {
    padding-left: 4px;
  }
  .onboarding .flex-1of3.tablet-portrait .content h2 {
    margin-bottom: 0;
    font-size: 85%;
  }
  .onboarding .flex-1of3.tablet-portrait .content img {
    align-self: flex-start;
    width: 25%;
    margin-left: -16px;
  }
  .onboarding .flex-1of3.tablet-portrait .content p {
    font-size: 85%;
  }
}
@media screen and (max-width: 340px) {
  .onboarding .flex-1of3.tablet-portrait .content div p {
    font-size: 80%;
  }
}
@media screen and (max-width: 340px) {
  .onboarding .container {
    padding: 16px 16px 16px;
  }
  .onboarding .container .btn {
    padding: 8px 24px;
  }
}
@media screen and (max-width: 767px) {
  .onboarding h2.center {
    font-size: 24px;
  }
}
@media screen and (max-width: 419px) {
  .onboarding h2.center {
    font-size: 24px;
    text-align: left;
  }
}
.onboarding .tile {
  padding: 24px;
}

.partner {
  background: #ffffff;
  border-top: 2px solid #fafafa;
}
.partner img {
  align-self: flex-start;
  width: auto;
  height: auto;
  max-width: 292px;
  max-height: 100px;
  min-width: 0;
  min-height: 0;
}
@media screen and (max-width: 420px) {
  .partner img {
    max-width: 100%;
  }
}
.partner p {
  margin-bottom: 24px;
}
.partner .flex {
  flex-wrap: wrap;
}
.partner .flex div:first-child {
  padding-right: 24px;
}
@media screen and (max-width: 1499px) {
  .partner .flex div:first-child {
    padding-left: 24px;
  }
}
.partner .flex > div:last-child {
  flex-direction: row;
  justify-content: flex-end;
}
@media screen and (max-width: 1499px) {
  .partner .flex > div:last-child {
    padding-right: 24px;
  }
}
@media screen and (max-width: 1024px) {
  .partner .flex {
    flex-direction: column;
  }
  .partner .flex div:last-child {
    flex-direction: column;
    justify-content: flex-start;
  }
}

.app .partner .flex > div {
  padding-left: 24px;
}

.copy {
  background: #f1f1ea;
}
.copy .legal {
  flex-direction: row;
  justify-content: flex-end;
}

.tooltip-container {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1000;
  max-width: 100%;
  transition: all 0.3s;
}
@media screen and (max-width: 680px) {
  .tooltip-container {
    padding-right: 0;
    padding-left: 0;
  }
}
.tooltip-container.full {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  transition: opacity 0.3s;
}
@media screen and (max-width: 680px) {
  .tooltip-container.full {
    padding: 0;
  }
}
.tooltip-container.full::before {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.8);
  content: "";
}
.tooltip-container.full::after {
  display: none;
}
.tooltip-container.full .tooltip {
  width: 100%;
  height: auto;
  max-width: 740px;
  max-height: 100%;
}
@media screen and (max-width: 680px) {
  .tooltip-container.full .tooltip {
    flex-flow: column;
    height: 100%;
    max-width: unset;
    max-height: unset;
  }
}
.tooltip-container.full .tooltip .tooltip-content .tooltip-text {
  flex-grow: 0;
  padding: 64px 48px 0 64px;
}
@media screen and (max-width: 680px) {
  .tooltip-container.full .tooltip .tooltip-content .tooltip-text {
    flex-grow: 2;
    padding: 32px;
  }
}
.tooltip-container.sm .tooltip .tooltip-close {
  display: none;
}
.tooltip-container.sm .tooltip .tooltip-content .tooltip-text {
  padding: 16px 24px 16px 24px;
}
.tooltip-container.sm .tooltip .tooltip-content .tooltip-text p {
  font-size: 1em;
}
.tooltip-container.sm .tooltip .tooltip-content .tooltip-footer {
  padding-top: 0;
  padding-bottom: 0;
}
.tooltip-container .tooltip {
  position: relative;
  display: flex;
  max-width: 500px;
  max-height: 50vh;
  text-align: left;
  box-shadow: 0 10px 30px -12px rgba(0, 0, 0, 0.8);
  transition: background-color 0.1s;
}
@media screen and (min-width: 1024px) and (max-width: 1680px) {
  .tooltip-container .tooltip {
    max-width: 300px;
  }
}
@media screen and (max-width: 680px) {
  .tooltip-container .tooltip {
    min-width: unset;
  }
}
.tooltip-container .tooltip .tooltip-arrow {
  position: absolute;
  top: 0;
  left: 0;
  width: 10px;
  height: 10px;
  margin: -5px 0 0 -5px;
  background: blue;
  clip-path: polygon(0% 0%, 100% 100%, 0% 100%, 0% 0%);
}
.tooltip-container .tooltip .tooltip-close {
  position: absolute;
  top: 0;
  right: 0;
  margin: 4px;
  cursor: pointer;
  transition: transform 0.3s, background 0.3s;
}
.tooltip-container .tooltip .tooltip-close:hover {
  background: none;
}
.tooltip-container .tooltip .tooltip-close:active {
  background: rgba(255, 255, 255, 0.1);
  transform: scale(0.9);
}
.tooltip-container .tooltip .tooltip-image {
  align-self: center;
  flex: 1 1 auto;
  max-width: 200px;
  padding: 32px;
  margin-right: -64px;
  box-sizing: content-box;
}
@media screen and (max-width: 680px) {
  .tooltip-container .tooltip .tooltip-image {
    align-self: center;
    width: auto;
    max-width: unset;
    max-height: 25vh;
    padding: 32px 0 0;
    margin: 0;
  }
}
.tooltip-container .tooltip .tooltip-content {
  display: flex;
  flex-direction: column;
  flex-grow: 2;
  overflow-y: auto;
}
.tooltip-container .tooltip .tooltip-content .tooltip-text {
  flex-grow: 2;
  padding: 48px 32px 0 48px;
  overflow-y: auto;
}
@media screen and (max-width: 680px) {
  .tooltip-container .tooltip .tooltip-content .tooltip-text {
    padding: 32px 32px 0 32px;
    margin: 0;
    font-size: 0.9em;
  }
}
.tooltip-container .tooltip .tooltip-content .tooltip-text h1 {
  margin-top: 0;
  font-size: 2.25em;
  line-height: 1.25;
  color: inherit;
}
.tooltip-container .tooltip .tooltip-content .tooltip-text h2 {
  margin: 0 0 24px;
  font-size: 1.375em;
  line-height: 1.25;
  color: inherit;
}
.tooltip-container .tooltip .tooltip-content .tooltip-text h3 {
  margin: 0 0 8px;
  font-size: 1.125em;
  color: inherit;
}
.tooltip-container .tooltip .tooltip-content .tooltip-text p {
  margin: 0.8em 0;
  font-size: 1.25em;
  color: inherit;
}
.tooltip-container .tooltip .tooltip-content .tooltip-text .full-width {
  position: relative;
  width: calc(100% + 80px);
  padding: 16px 32px 16px 48px;
  margin-bottom: 16px;
  margin-left: -48px;
  color: #333333;
  background: #ffffff;
}
.tooltip-container .tooltip .tooltip-content .tooltip-text .full-width p {
  font-size: 0.875em;
}
.tooltip-container .tooltip .tooltip-content .tooltip-text .split {
  display: flex;
  align-items: baseline;
}
.tooltip-container .tooltip .tooltip-content .tooltip-text .split > div:nth-last-child(n+2) {
  padding: 0 16px 0 0;
}
.tooltip-container .tooltip .tooltip-content .tooltip-text .split > div:nth-child(n+2) {
  padding: 0 0 0 16px;
  border-left: 1px solid #dfe1e5;
}
.tooltip-container .tooltip .tooltip-content .tooltip-footer {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  flex-wrap: wrap;
  justify-content: flex-end;
  padding: 16px 48px 32px 64px;
}
@media screen and (max-width: 680px) {
  .tooltip-container .tooltip .tooltip-content .tooltip-footer {
    flex-wrap: nowrap;
    width: 100%;
    padding: 8px 0 0;
  }
}
.tooltip-container .tooltip .tooltip-content .tooltip-footer .tooltip-progress {
  font-weight: bold;
}
@media screen and (max-width: 680px) {
  .tooltip-container .tooltip .tooltip-content .tooltip-footer .tooltip-progress {
    width: 100%;
    text-align: center;
  }
}
.tooltip-container .tooltip .tooltip-content .tooltip-footer .tooltip-action {
  margin: 0 0 0 16px;
}
@media screen and (max-width: 680px) {
  .tooltip-container .tooltip .tooltip-content .tooltip-footer .tooltip-action {
    width: 100%;
    margin: 0;
    border-radius: 0;
  }
}
.tooltip-container .tooltip .tooltip-content .tooltip-footer .tooltip-action.primary-action {
  color: #0053d8;
  background: #ffffff;
}
.tooltip-container .tooltip .tooltip-content .tooltip-footer .tooltip-action.secondary-action {
  color: #ffffff;
  background: transparent;
  border-color: #ffffff;
}
@media screen and (max-width: 680px) {
  .tooltip-container .tooltip .tooltip-content .tooltip-footer .tooltip-action.secondary-action {
    border-color: transparent;
  }
}
.tooltip-container.white .tooltip {
  background-color: #ffffff;
  background-image: linear-gradient(60deg, #ffffff, #fafafa);
  box-shadow: 0 10px 30px -12px rgba(149, 160, 175, 0.7);
}
.tooltip-container.white .tooltip *:not(.btn) {
  color: #333333;
}
.tooltip-container.white .tooltip-arrow {
  background-color: #ffffff;
}
.tooltip-container.good .tooltip {
  background-color: #3de49d;
  background-image: none;
  box-shadow: 0 10px 30px -12px rgba(149, 160, 175, 0.7);
}
.tooltip-container.good .tooltip *:not(.btn) {
  color: #12442f;
}
.tooltip-container.good .tooltip-arrow {
  background-color: #3de49d;
}
.tooltip-container.bad .tooltip {
  background-color: #ff5d41;
  background-image: none;
  box-shadow: 0 10px 30px -12px rgba(149, 160, 175, 0.7);
}
.tooltip-container.bad .tooltip *:not(.btn) {
  color: #4d1c14;
}
.tooltip-container.bad .tooltip-arrow {
  background-color: #ff5d41;
}
.tooltip-container.neutral .tooltip {
  background-color: #00def1;
  background-image: none;
  box-shadow: 0 10px 30px -12px rgba(149, 160, 175, 0.7);
}
.tooltip-container.neutral .tooltip *:not(.btn) {
  color: #004348;
}
.tooltip-container.neutral .tooltip-arrow {
  background-color: #00def1;
}
.tooltip-container.warning .tooltip {
  background-color: #ffa600;
  background-image: none;
  box-shadow: 0 10px 30px -12px rgba(149, 160, 175, 0.7);
}
.tooltip-container.warning .tooltip *:not(.btn) {
  color: #4d3200;
}
.tooltip-container.warning .tooltip-arrow {
  background-color: #ffa600;
}
.tooltip-container.hidden {
  display: flex;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
}
.tooltip-container.is-following {
  transition: all 0.3s, transform 0s;
}

.tooltip-dot {
  position: relative;
}
.tooltip-dot::before {
  top: 50%;
  right: 0;
  transform: translate(50%, -50%);
}

.person-list {
  margin-top: 32px;
}
.person-list .radio-check {
  display: flex;
  clear: both;
}
.person-list .radio-check label {
  margin-right: 32px;
}

.module-selection {
  position: relative;
}
.module-selection .form-bar {
  padding-bottom: 24px;
}
.module-selection .form-bar.center {
  display: block;
  text-align: left;
}
.module-selection .form-bar.center p {
  margin: 0;
}
.module-selection .form-bar h1 {
  font-size: 1.75em;
}
.module-selection .form-bar .duration {
  padding-top: 8px;
}
.module-selection .form-bar .duration .fwsj-icon, .module-selection .form-bar .duration .dot.checked-dot::before, .module-selection .form-bar .duration .chart-job-stress-index .wave-warning-icon, .chart-job-stress-index .module-selection .form-bar .duration .wave-warning-icon, .module-selection .form-bar .duration .scale-value::before, .module-selection .form-bar .duration .organigram-item .organigram-item-inner.overview .count::before, .organigram-item .organigram-item-inner.overview .module-selection .form-bar .duration .count::before {
  margin-right: 2px;
  vertical-align: -2%;
}
.module-selection .module-list-title {
  position: absolute;
  top: 50%;
  font-size: 1.25em;
  font-weight: bold;
  line-height: 44px;
  color: #0053d8;
  transform: rotate(-90deg);
  transform-origin: bottom left;
}
.module-selection .switch-module::after {
  display: inline-block;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .module-selection .module-list {
    height: 100%;
  }
}

.module-list {
  position: relative;
  z-index: 2;
  height: auto;
}
.module-list.scrollable .module-list-pagination {
  visibility: visible;
}
.module-list.drop-area {
  z-index: 1;
}
.module-list.drop-area::after {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: calc(100% + 24px);
  height: calc(100% + 24px);
  margin: -12px;
  background: rgba(0, 83, 216, 0.05);
  border: 1px dashed #0053d8;
  border-radius: 8px;
  content: "";
}

.module-area {
  position: relative;
  padding: 44px;
  padding-bottom: 64px;
}

.module-container {
  display: flex;
  min-height: 200px;
  transition: transform 0.3s;
}
.module-container.no-transition {
  transition: transform 0s;
}

.module-list-disabled {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10;
  background-color: rgba(255, 255, 255, 0.7);
}
.module-list-disabled > div {
  max-width: 680px;
  display: flex;
  align-items: center;
  background-color: rgba(255, 255, 255, 0.7);
  border-radius: 5px;
  padding: 16px 24px;
  margin: 0 24px;
}
.module-list-disabled > div .status-icon {
  flex-shrink: 0;
}
.module-list-disabled > div p {
  margin-top: 0;
  margin-bottom: 0;
  margin-left: 24px;
}

.module {
  position: relative;
  z-index: 2;
  flex-shrink: 0;
  width: 215px;
  margin-right: 32px;
  overflow: hidden;
  transition: opacity 0.3s;
  user-select: none;
}
.module.transparent {
  pointer-events: none;
  opacity: 0;
}
.module.transparent:hover {
  cursor: default;
}
.module:hover {
  cursor: pointer;
}
.module h2 {
  min-height: 2.5em;
  margin-bottom: 1em;
  font-size: 1.5rem;
  font-weight: bold;
  line-height: 1.25;
  color: inherit;
}
.module .context-trigger {
  width: 34px;
  height: 42px;
  margin: 0;
  margin-right: auto;
  font-size: 1em;
  color: #ffffff;
  background: transparent;
  border: 0;
}
.module .context-trigger:hover {
  background: transparent;
}
.module.draggable {
  cursor: grab;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  transition: transform 0.3s, box-shadow 0.2s, background 0.3s, opacity 0.3s;
}
.module.draggable:hover {
  background: #125fdb;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}
.module.draggable.animated {
  z-index: 3;
}
.module.draggable.dragging {
  position: relative;
  z-index: 4;
  cursor: grabbing;
  border: 2px solid #ffffff;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
  transition: transform 0s, box-shadow 0.2s, opacity 0.3s;
}

.module-list-pagination {
  position: absolute;
  bottom: -48px;
  left: 50%;
  display: flex;
  visibility: hidden;
  transform: translateX(-50%);
}

.pagination-container {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  margin: 0 4px;
}

.pagination-prev:before {
  transform: rotate(135deg);
  position: absolute;
  top: calc(50% - 5px);
  right: 0;
  width: 10px;
  height: 10px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #0053d8;
  content: "";
}
.pagination-prev::before {
  margin-left: 0.9em;
}

.pagination-next:before {
  transform: rotate(-45deg);
  position: absolute;
  top: calc(50% - 5px);
  right: 0;
  width: 10px;
  height: 10px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #0053d8;
  content: "";
}
.pagination-next::before {
  margin-left: 0.7em;
}

.pagination-prev,
.pagination-next {
  flex-shrink: 0;
  margin: 0;
  border: none;
}
.pagination-prev::before,
.pagination-next::before {
  position: relative;
  top: unset;
  right: unset;
  display: block;
  margin-top: 4px;
  margin-bottom: 4px;
}
.pagination-prev.disabled,
.pagination-next.disabled {
  opacity: 0.2;
}

.pagination-page {
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  margin: 0 4px;
  cursor: pointer;
  background: transparent;
  border: 2px solid #0053d8;
  border-radius: 50%;
  transition: background 0.3s;
}
.pagination-page.active {
  background: #0053d8;
}

.selection-overlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: #0053d8;
  opacity: 0;
  visibility: hidden;
  transition: all 0.1s;
}
.selection-overlay h2 {
  position: relative;
  max-width: 300px;
  text-align: center;
}
.selection-overlay h2:before {
  transform: rotate(45deg);
  position: absolute;
  top: calc(100% + 25px);
  right: calc(50% - 8px);
  width: 16px;
  height: 16px;
  border-right: 3px solid;
  border-bottom: 3px solid;
  border-color: inherit;
  content: "";
}

.blue .context-menu a:not(.btn), .tooltip-container .tooltip .context-menu a:not(.btn) {
  color: #0053d8;
}
.blue .pagination-page, .tooltip-container .tooltip .pagination-page {
  border-color: #ffffff;
}
.blue .pagination-page.active, .tooltip-container .tooltip .pagination-page.active {
  background: #ffffff;
}
.blue .pagination-next::before, .tooltip-container .tooltip .pagination-next::before,
.blue .pagination-prev::before,
.tooltip-container .tooltip .pagination-prev::before {
  border-color: #ffffff;
}
.blue .drop-area::after, .tooltip-container .tooltip .drop-area::after {
  background: rgba(255, 255, 255, 0.05);
  border-color: #ffffff;
}
.blue .module, .tooltip-container .tooltip .module {
  border: 2px solid #ffffff;
}
.blue .module.placeholder, .tooltip-container .tooltip .module.placeholder {
  z-index: unset;
  order: 99999;
  background: transparent;
  border-color: transparent;
}
.blue .module.placeholder button, .tooltip-container .tooltip .module.placeholder button {
  border-color: #ffffff;
}
.blue .module.placeholder .card-footer, .tooltip-container .tooltip .module.placeholder .card-footer {
  margin-top: auto;
}
.blue .module.placeholder.disabled, .tooltip-container .tooltip .module.placeholder.disabled {
  opacity: 0.3;
  cursor: default;
  pointer-events: none;
}

.selection-mode .selection-overlay {
  opacity: 0.95;
  visibility: visible;
  transition: all 0.5s;
}
.selection-mode .placeholder,
.selection-mode .add-module {
  opacity: 0;
  visibility: hidden;
}
.selection-mode .module-list .module.draggable {
  cursor: pointer;
}
.selection-mode .context-menu {
  display: none;
}

.app .module-edit,
.module-edit {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 64px;
  left: 0;
  width: auto;
}
@media screen and (min-width: 681px) {
  .app .module-edit,
  .module-edit {
    position: absolute;
    bottom: 0;
    left: auto;
    width: 75%;
    max-width: 650px;
  }
}
@media screen and (max-width: 680px) {
  .app .module-edit,
  .module-edit {
    visibility: hidden;
  }
  .app .module-edit.active,
  .module-edit.active {
    z-index: 15;
    visibility: visible;
  }
}
@media screen and (min-width: 769px) {
  .app .module-edit,
  .module-edit {
    width: 60%;
  }
}
@media screen and (min-width: 1025px) {
  .app .module-edit,
  .module-edit {
    width: 50%;
  }
}
@media screen and (min-width: 2001px) {
  .app .module-edit,
  .module-edit {
    width: 40%;
  }
}
.app .module-edit .drawer,
.module-edit .drawer {
  z-index: 10;
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
@media screen and (min-width: 681px) {
  .app .module-edit .drawer h4,
  .app .module-edit .drawer .navigation > p,
  .module-edit .drawer h4,
  .module-edit .drawer .module-list-disabled > div p,
  .module-list-disabled > div .module-edit .drawer p,
  .module-edit .drawer .navigation > p {
    padding-right: 64px;
    padding-left: 64px;
  }
  .app .module-edit .drawer .navigation > p,
  .module-edit .drawer .navigation > p {
    padding-top: 16px;
  }
}
@media only screen and (max-width: 419px) {
  .app .module-edit .drawer .tile.horizontal,
  .module-edit .drawer .tile.horizontal {
    flex-direction: column;
  }
}
@media only screen and (min-width: 420px) {
  .app .module-edit .drawer .tile.horizontal,
  .module-edit .drawer .tile.horizontal {
    padding: 24px 48px 24px 16px;
  }
}
.app .module-edit .drawer .tile.horizontal img,
.module-edit .drawer .tile.horizontal img {
  flex-shrink: 0;
  max-width: 136px;
}
.app .module-edit .drawer .nav-back,
.module-edit .drawer .nav-back {
  position: relative;
  top: 16px;
  left: 24px;
}
@media screen and (min-width: 681px) {
  .app .module-edit .drawer .nav-back,
  .module-edit .drawer .nav-back {
    left: 56px;
  }
}
.app .module-edit .drawer .duration,
.module-edit .drawer .duration {
  position: relative;
  top: 32px;
  left: 28px;
  display: flex;
  align-items: center;
}
@media screen and (min-width: 681px) {
  .app .module-edit .drawer .duration,
  .module-edit .drawer .duration {
    left: 64px;
  }
}
.app .module-edit .drawer .duration .fwsj-icon,
.module-edit .drawer .duration .fwsj-icon,
.module-edit .drawer .duration .dot.checked-dot::before,
.module-edit .drawer .duration .chart-job-stress-index .wave-warning-icon,
.chart-job-stress-index .module-edit .drawer .duration .wave-warning-icon,
.module-edit .drawer .duration .scale-value::before,
.module-edit .drawer .duration .organigram-item .organigram-item-inner.overview .count::before,
.organigram-item .organigram-item-inner.overview .module-edit .drawer .duration .count::before {
  margin-right: 0.125em;
  font-size: 1.125em;
}
@media screen and (min-width: 681px) {
  .app .module-edit .drawer .navigation ul.menu,
  .module-edit .drawer .navigation ul.menu {
    padding-right: 64px;
    padding-left: 64px;
  }
}
.app .module-edit .drawer .navigation ul.menu span,
.module-edit .drawer .navigation ul.menu span {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}
.app .module-edit .drawer .navigation ul.menu span span,
.module-edit .drawer .navigation ul.menu span span {
  margin-bottom: 0.75em;
}
.app .module-edit .drawer .navigation ul.menu a.has-children,
.module-edit .drawer .navigation ul.menu a.has-children {
  width: auto;
  min-width: 100px;
  padding-right: 24px;
  color: #0053d8;
}
.app .module-edit .drawer .navigation ul.menu a.has-children::before,
.module-edit .drawer .navigation ul.menu a.has-children::before {
  border-color: #0053d8;
}
.app .module-edit .drawer .navigation ul.menu ul,
.module-edit .drawer .navigation ul.menu ul {
  padding-top: 48px;
  padding-right: 28px;
  padding-left: 28px;
}
@media screen and (min-width: 681px) {
  .app .module-edit .drawer .navigation ul.menu ul,
  .module-edit .drawer .navigation ul.menu ul {
    padding-right: 64px;
    padding-left: 64px;
  }
}
.app .module-edit .drawer .navigation ul.menu label.checkbox,
.module-edit .drawer .navigation ul.menu label.checkbox {
  padding-left: 40px;
  text-indent: 0;
}
.app .module-edit .drawer .navigation ul.menu .question,
.module-edit .drawer .navigation ul.menu .question {
  padding: 12px 0;
}
.app .module-edit .drawer .navigation ul.menu .question-intro,
.module-edit .drawer .navigation ul.menu .question-intro {
  padding: 24px 0 12px;
  font-weight: bold;
}
.app .module-edit .close,
.module-edit .close {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 30;
  display: block;
  padding: 24px;
}
.app .module-edit .close :hover,
.module-edit .close :hover {
  cursor: pointer;
}

.org-profile-section h2 {
  font-weight: normal;
}
.org-profile-section h2 .fwsj-icon, .org-profile-section h2 .dot.checked-dot::before, .org-profile-section h2 .chart-job-stress-index .wave-warning-icon, .chart-job-stress-index .org-profile-section h2 .wave-warning-icon, .org-profile-section h2 .scale-value::before, .org-profile-section h2 .organigram-item .organigram-item-inner.overview .count::before, .organigram-item .organigram-item-inner.overview .org-profile-section h2 .count::before {
  margin-right: 16px;
  font-size: 0.875em;
}
.org-profile-section .accordion-header button.accordion-toggler {
  font-size: 2em;
}
.org-profile-section .accordion-header .status-icon {
  position: absolute;
  top: 24px;
  left: 20px;
}

.free-pro-comparison > button {
  margin-top: 24px;
}
.free-pro-comparison .lead {
  font-size: 1.5rem;
}
.free-pro-comparison .feature-list {
  display: flex;
  flex-direction: row;
  flex-grow: 1;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
  margin-top: 16px;
  margin-bottom: 24px;
}
.free-pro-comparison .feature-list .item {
  width: calc(50% - 8px);
}
@media screen and (max-width: 679px) {
  .free-pro-comparison .feature-list .item {
    width: 100%;
  }
  .free-pro-comparison .feature-list .item:nth-child(2n) {
    order: 2000;
  }
}
.free-pro-comparison .info > div {
  flex-grow: 1;
  margin-right: 24px;
}

.multi-input-list .multi-input-list-item {
  display: flex;
  align-items: flex-end;
}
.multi-input-list .multi-input-list-rows {
  width: 100%;
}
.multi-input-list .multi-input-list-rows > div {
  display: inline-flex;
  align-items: flex-end;
  width: 100%;
}
.multi-input-list .multi-input-list-actions {
  margin-bottom: 6px;
  margin-left: 8px;
}
.multi-input-list label {
  width: 100%;
  margin-bottom: 0;
}
.multi-input-list label .error-message {
  position: absolute;
}
.multi-input-list label.error, .multi-input-list label.error + div.small, .multi-input-list label.error + div.small + div.small {
  margin-bottom: 24px;
}
.multi-input-list textarea {
  padding-top: 10px;
  padding-bottom: 8px;
  margin-bottom: 4px;
}
@media screen and (max-width: 420px) {
  .multi-input-list .multi-input-list-rows div > div.small {
    width: 100%;
    padding-right: 0;
  }
}
@media screen and (max-width: 768px) {
  .multi-input-list .multi-input-list-rows div.small {
    padding-right: 8px;
  }
}

.footer-edit {
  position: relative;
  bottom: 0;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
  height: 60px;
  padding: 12px 24px;
}
@media screen and (min-width: 1024px) {
  .footer-edit {
    position: fixed;
    z-index: 2;
  }
}
.footer-edit-checkbox {
  justify-content: center;
  width: 25%;
  min-width: max-content;
}
.footer-edit-checkbox label {
  width: max-content;
  margin-bottom: 0;
}
.footer-edit-navigation nav {
  display: flex;
  align-items: center;
}
.footer-edit-navigation nav p {
  margin-bottom: 0;
}
.footer-edit-navigation nav .disabled {
  color: #9a9a9a;
}
.footer-edit-navigation nav .navigation-jumpto {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 32px;
}
.footer-edit-navigation nav .navigation-previous:active, .footer-edit-navigation nav .navigation-previous:visited,
.footer-edit-navigation nav .navigation-next:active,
.footer-edit-navigation nav .navigation-next:visited {
  color: #0053d8;
}
.footer-edit-navigation nav .navigation-previous {
  display: flex;
}
.footer-edit-navigation nav .navigation-previous span:before {
  transform: rotate(135deg);
  position: absolute;
  top: -1px;
  right: 8px;
  width: 8px;
  height: 8px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: currentColor;
  content: "";
}
.footer-edit-navigation nav .navigation-previous span::before {
  position: relative;
  display: inline-block;
}
.footer-edit-navigation nav .navigation-next {
  display: flex;
}
.footer-edit-navigation nav .navigation-next span:after {
  transform: rotate(-45deg);
  position: absolute;
  top: -1px;
  right: -8px;
  width: 8px;
  height: 8px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: currentColor;
  content: "";
}
.footer-edit-navigation nav .navigation-next span::after {
  position: relative;
  display: inline-block;
}
.footer-edit-navigation nav .select-wrapper .select {
  font-weight: bold;
  padding-top: 8px;
  padding-bottom: 8px;
}
.footer-edit-navigation nav .select-wrapper::after {
  top: 12px;
}
.footer-edit-action-items {
  flex-shrink: 0;
  width: 25%;
  min-width: max-content;
  text-align: right;
}
.footer-edit-action-items a {
  margin-right: 16px;
  margin-bottom: 0;
}
.footer-edit-action-items a:last-child {
  margin-right: 0;
}

@media screen and (max-width: 1250px) {
  .footer-edit-navigation nav a > p {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .footer-edit-checkbox {
    margin-right: 16px;
    margin-bottom: 10px;
  }
  .footer-edit-navigation {
    display: none;
  }
  .footer-edit-action-items {
    text-align: left;
  }
}
@media screen and (max-width: 543px) {
  .footer-edit-checkbox {
    margin-bottom: 16px;
  }
  .footer-edit-action-items {
    flex-shrink: 1;
    width: 100%;
    min-width: min-content;
  }
  .footer-edit-action-items a {
    margin-bottom: 16px;
  }
}
.register .tab-panels .tab-panel {
  padding: 24px;
}
@media screen and (min-width: 680px) {
  .register .tab-panels .tab-panel {
    padding: 48px;
  }
}

.register {
  position: relative;
  height: 100%;
}
.register .tabs {
  display: none;
  overflow-y: hidden;
}
@media screen and (min-width: 1024px) {
  .register .tabs {
    position: absolute;
    z-index: 10;
    display: block;
    width: 100%;
    height: 100%;
    margin-right: 0;
    transform: translateX(calc(100% - 48px));
    transition: all 0.15s cubic-bezier(0.39, 0.575, 0.565, 1);
  }
}
@media screen and (min-width: 1800px) {
  .register .tabs {
    transform: translateX(calc(100% - 190px));
  }
}
.register .tabs:hover {
  transition: all 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95);
  transition-delay: 0.1s;
}
.register .tabs ul {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  width: 190px;
  height: 100%;
  padding: 0;
  background: #0053d8;
}
.register .tabs ul li {
  width: 100%;
  height: 48px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.register .tabs ul li:hover {
  cursor: pointer;
  background-color: rgb(64, 126, 225);
}
.register .tabs ul li.active {
  background-color: #fafafa;
  border-bottom: 0;
}
.register .tabs ul li.active a {
  color: #0053d8;
}
.register .tabs ul li a {
  color: #ffffff;
}
.register .tabs ul li a .fwsj-icon, .register .tabs ul li a .dot.checked-dot::before, .register .tabs ul li a .chart-job-stress-index .wave-warning-icon, .chart-job-stress-index .register .tabs ul li a .wave-warning-icon, .register .tabs ul li a .scale-value::before, .register .tabs ul li a .organigram-item .organigram-item-inner.overview .count::before, .organigram-item .organigram-item-inner.overview .register .tabs ul li a .count::before {
  display: inline-block;
  width: 48px;
  text-align: center;
}
.register .tab-panels {
  font-size: 0.875rem;
  background-color: #fafafa;
}
@media screen and (min-width: 680px) {
  .register .tab-panels {
    font-size: 1rem;
  }
}
@media screen and (min-width: 1024px) {
  .register .tab-panels {
    width: calc(100% - 48px);
    height: 100%;
    font-size: 0.875rem;
  }
}
@media screen and (min-width: 1280px) {
  .register .tab-panels {
    font-size: 1rem;
  }
}
@media screen and (min-width: 1800px) {
  .register .tab-panels {
    width: calc(100% - 190px);
  }
}
.register .tab-panels .tab-panel {
  display: block;
}
@media screen and (min-width: 1024px) {
  .register .tab-panels .tab-panel.active:nth-child(even) {
    background-color: unset;
    background-image: unset;
  }
  .register .tab-panels .tab-panel:not(.active) {
    display: none;
  }
}
.register .tab-panels .tab-panel h2 {
  margin-top: 0;
  font-size: 1.625em;
}
.register .tab-panels .tab-panel h3 {
  font-size: 1.125em;
}
.register .tab-panels .tab-panel fieldset {
  margin-bottom: 48px;
}
.register .tab-panels .tab-panel .radio-check label {
  padding: 8px 0 12px;
  margin-bottom: 0;
  font-size: 1em;
}
.register .tab-panels .tab-panel .radio-check label input[type=radio] {
  top: 8px;
}
.register .tab-panels .tab-panel .radio-check label:hover {
  text-decoration: none;
}
.register .tab-panels .tab-panel .radio-check label span {
  display: block;
  padding-left: 36px;
  text-indent: 0;
}
.register .tab-panels .tab-panel .tooltip {
  max-width: 400px;
}

.section-sidebar {
  display: flex;
  flex-direction: column;
  height: 100%;
  background-image: linear-gradient(210deg, #fbfbf6, #fbfbf6 10%, #fafafa);
}
@media screen and (max-width: 1024px) {
  .section-sidebar {
    background-image: none;
  }
}
.section-sidebar .section-sidebar-title {
  display: block;
  flex-grow: 1;
}
.section-sidebar .section-sidebar-states {
  display: none;
}
.section-sidebar .section-sidebar-states.active {
  display: block;
  padding: 56px 64px 0;
}
@media screen and (max-width: 1024px) {
  .section-sidebar .section-sidebar-states {
    display: block;
    padding: 0 64px 0;
  }
}
@media screen and (max-width: 420px) {
  .section-sidebar .section-sidebar-states {
    padding: 32px 36px;
  }
}
@media print {
  .section-sidebar .section-sidebar-states {
    display: block;
  }
}
.section-sidebar .section-sidebar-close {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  display: block;
  width: 48px;
  height: 48px;
  padding: 8px;
  margin: 8px;
  font-size: 1.75em;
  border-radius: 0;
}
.section-sidebar .section-sidebar-navigation {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 1024px) {
  .section-sidebar .section-sidebar-navigation {
    padding: 0 64px;
    font-size: 0.875rem;
  }
}
@media only screen and (max-width: 420px) {
  .section-sidebar .section-sidebar-navigation {
    padding: 0 36px;
  }
}
@media print {
  .section-sidebar .section-sidebar-navigation {
    display: none;
  }
}
.section-sidebar .section-sidebar-navigation button {
  display: flex;
  align-items: center;
  flex-grow: 1;
  justify-content: center;
  padding: 20px;
  margin: 0;
  font-size: 1.125rem;
  font-weight: normal;
  color: #333333;
  background: #f1f1ea;
  border-radius: 0;
}
.section-sidebar .section-sidebar-navigation button i {
  margin-right: 8px;
}
.section-sidebar .section-sidebar-navigation button:active {
  transform: none;
}
@media screen and (min-width: 1024px) {
  .section-sidebar .section-sidebar-navigation button {
    background: #ffffff;
  }
  .section-sidebar .section-sidebar-navigation button:only-of-type {
    padding-top: 56px;
    padding-right: 64px;
    padding-left: 64px;
    justify-content: flex-start;
  }
  .section-sidebar .section-sidebar-navigation button.active {
    font-weight: 700;
    background: #fbfbf6;
    border-bottom: 1px solid #fbfbf6;
    border-color: transparent;
  }
}
@media screen and (max-width: 1024px) {
  .section-sidebar .section-sidebar-navigation button {
    flex-grow: 0;
    padding: 8px 16px;
    margin-left: 8px;
  }
}
.section-sidebar .section-sidebar-tabs {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
@media screen and (max-width: 1024px) {
  .section-sidebar .section-sidebar-tabs {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 400;
    display: none;
    width: 100%;
  }
  .section-sidebar .section-sidebar-tabs.open {
    display: flex;
  }
}
@media print {
  .section-sidebar .section-sidebar-tabs {
    display: none;
  }
}
.section-sidebar .section-sidebar-tab {
  display: none;
  flex-grow: 1;
  padding: 56px 68px 56px 60px;
  overflow-y: auto;
}
@media screen and (max-width: 1024px) {
  .section-sidebar .section-sidebar-tab {
    background-image: linear-gradient(210deg, #fbfbf6, #fbfbf6 10%, #fafafa);
  }
}
@media screen and (max-width: 420px) {
  .section-sidebar .section-sidebar-tab {
    padding: 32px 36px;
  }
}
.section-sidebar .section-sidebar-tab.active {
  display: flex;
  flex-direction: column;
}
.section-sidebar .section-sidebar-tab .section-sidebar-tab-item {
  padding: 16px 0;
}
.section-sidebar .section-sidebar-tab .section-sidebar-tab-item .btn {
  margin-bottom: 0;
  font-size: 1rem;
}
.section-sidebar .section-sidebar-tab .section-sidebar-tab-item.with-border {
  border-bottom: 1px solid rgba(72, 72, 72, 0.1);
}
.section-sidebar .section-sidebar-tab .section-sidebar-tab-item.align-bottom {
  margin-top: auto;
}
.section-sidebar .section-sidebar-tab .section-sidebar-tab-item:first-of-type {
  padding-top: 0;
}
.section-sidebar .section-sidebar-tab .section-sidebar-tab-item .button-radio.disabled,
.section-sidebar .section-sidebar-tab .section-sidebar-tab-item .button-checkbox.disabled {
  color: #c0c7d1;
}
.section-sidebar .section-sidebar-tab .section-sidebar-tab-item .button-radio.disabled img,
.section-sidebar .section-sidebar-tab .section-sidebar-tab-item .button-checkbox.disabled img {
  filter: grayscale(1);
}
.section-sidebar .section-sidebar-tab .section-sidebar-tab-item .button-radio.disabled:hover input::before,
.section-sidebar .section-sidebar-tab .section-sidebar-tab-item .button-checkbox.disabled:hover input::before {
  background-color: rgba(223, 225, 229, 0.5);
  border-color: #dfe1e5;
}
.section-sidebar .tab-title {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
}
.section-sidebar .tab-title i {
  margin-right: 8px;
}
@media screen and (min-width: 1024px) {
  .section-sidebar .section-sidebar-mobile {
    display: none;
  }
}
.section-sidebar.overlay .section-sidebar-tabs {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  width: 25vw;
  min-width: 350px;
  background-image: linear-gradient(210deg, #fbfbf6, #fbfbf6 10%, #fafafa);
}
@media screen and (max-width: 1024px) {
  .section-sidebar.overlay .section-sidebar-tabs {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 400;
    display: none;
    width: 100%;
  }
  .section-sidebar.overlay .section-sidebar-tabs.open {
    display: flex;
  }
}
.section-sidebar.overlay .section-sidebar-navigation {
  display: none;
}
.section-sidebar.overlay .section-sidebar-mobile {
  display: block;
}
.section-sidebar.overlay .section-sidebar-tabs:not(.open) {
  display: none;
}
.section-sidebar.overlay .section-sidebar-states {
  display: none;
}

@media screen and (max-width: 1024px) {
  body.prevent-scroll-mobile {
    overflow: hidden;
  }
}
.key-number-section {
  display: grid;
  grid-auto-rows: unset;
  grid-template-columns: repeat(4, 1fr);
}
@media screen and (max-width: 1331px) {
  .key-number-section {
    grid-template-columns: repeat(2, 1fr);
    -ms-grid-columns: 50% 50%;
  }
}
@media screen and (max-width: 998px) {
  .key-number-section {
    grid-template-columns: 1fr;
    -ms-grid-columns: 100%;
  }
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .key-number-section {
    flex-direction: row !important;
    flex-wrap: wrap;
  }
  .key-number-section .tile {
    width: 25%;
  }
}
@media all and (max-width: 1331px) and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .key-number-section .tile {
    width: 50%;
  }
}
@media all and (max-width: 998px) and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .key-number-section .tile {
    width: 100%;
  }
}
.key-number-section .tile {
  justify-content: center;
}
@media print {
  .key-number-section .tile {
    padding-right: 40px;
    padding-left: 40px;
    background: none;
  }
}
.key-number-section i {
  margin-right: 8px;
  font-size: 56px;
  color: #0053d8;
}
.key-number-section .unit {
  font-size: 24px;
  font-weight: bold;
}
.key-number-section .value {
  padding: 0 8px;
  font-size: 4em;
  font-weight: bold;
  line-height: 0;
}
@media print {
  .key-number-section .value {
    font-size: 3em;
  }
}
.key-number-section .value.small {
  padding: 0 4px;
  font-size: 2em;
}
@media print {
  .key-number-section .value.small {
    font-size: 32px;
  }
}
.key-number-section h2 {
  margin-top: 12px;
}
.key-number-section p {
  margin-top: 12px;
  font-weight: bold;
}

.table-container {
  overflow-y: hidden;
  overflow-x: scroll;
}

table.at-admin {
  width: 100%;
  min-width: 1400px;
  margin-bottom: 24px;
}
table.at-admin tr {
  transition: background-color 1s ease;
  display: flex;
}
table.at-admin td, table.at-admin th {
  border: 0;
  padding: 10px 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}
table.at-admin tbody tr.odd {
  background-color: #f1f1ea;
}
table.at-admin tr {
  border-radius: 30px;
}
table.at-admin tr.row {
  height: 44px;
  cursor: pointer;
}
table.at-admin td.actions {
  position: relative;
  overflow: hidden;
}
table.at-admin tr.last td.actions .context-menu .context-options,
table.at-admin tr.last tr.row td.actions .context-menu .context-options {
  top: unset;
  bottom: 0;
}
table.at-admin table.sub {
  height: auto;
}
table.at-admin table.sub > tbody > tr {
  height: 0px;
  opacity: 0;
  transition: height 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955), opacity 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
table.at-admin table.sub > tbody > tr.show {
  height: 44px;
  opacity: 1;
  transition: height 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955), opacity 0.45s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
table.at-admin tr td,
table.at-admin tr th {
  flex: 1;
}
table.at-admin tr td.type,
table.at-admin tr th.type {
  flex-basis: 5%;
  max-width: 60px;
}
table.at-admin tr td.status,
table.at-admin tr th.status {
  flex-basis: 7%;
  max-width: 80px;
  padding-left: 8px;
}
table.at-admin tr td:not(.sub):nth-last-child(1),
table.at-admin tr th:nth-last-child(1) {
  max-width: 48px;
  min-width: 48px;
  text-align: center;
}
table.at-admin tr td:not(.sub):nth-last-child(1) button.icon,
table.at-admin tr th:nth-last-child(1) button.icon {
  background-color: #f1f1ea;
}
table.at-admin tr td:not(.sub):nth-last-child(1) button.icon:hover,
table.at-admin tr th:nth-last-child(1) button.icon:hover {
  background-color: #e7e7db;
}
table.at-admin tr td:not(.sub):nth-last-child(1) button.icon i,
table.at-admin tr th:nth-last-child(1) button.icon i {
  font-weight: bold;
}
table.at-admin td.sub {
  padding: 0;
  padding-left: 15px;
}
table.at-admin td.sub tr td:nth-child(2),
table.at-admin td.sub tr th:nth-child(2) {
  flex-basis: calc(20% - 13px);
  max-width: 700px;
  min-width: 500px;
}
table.at-admin table.sub {
  margin: 0;
}
table.at-admin td {
  width: auto;
  white-space: nowrap;
}
table.at-admin tr.parent td.type {
  cursor: pointer;
  z-index: 995;
}
table.at-admin td.type img {
  pointer-events: none;
  width: 12px;
  margin-left: 16px;
}
table.at-admin tr.parent td.type img {
  width: 16px;
  margin-top: 5px;
  transition: all 0.15s ease-in-out;
}
table.at-admin tr.parent.collapsed td.type img {
  transform: rotate(-90deg);
}

.at-admin:not(.assessments) tr td:nth-child(2),
.at-admin:not(.assessments) tr th:nth-child(2) {
  flex-basis: 20%;
  max-width: 715px;
  min-width: 515px;
  font-weight: 800;
  overflow: hidden;
}
.at-admin:not(.assessments) tr td:nth-child(4),
.at-admin:not(.assessments) tr th:nth-child(4) {
  flex-basis: 10%;
  max-width: 500px;
  min-width: 100px;
  overflow: hidden;
}
.at-admin:not(.assessments) tr td:nth-child(5),
.at-admin:not(.assessments) tr th:nth-child(5) {
  flex-basis: 5%;
  max-width: 500px;
  min-width: 50px;
  overflow: hidden;
}

.arrow.up:after {
  transform: rotate(-135deg);
  position: absolute;
  top: "";
  right: "";
  width: 16px;
  height: 16px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #000000;
  content: "";
}
.arrow.right:after {
  transform: rotate(-45deg);
  position: absolute;
  top: "";
  right: "";
  width: 16px;
  height: 16px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #000000;
  content: "";
}
.arrow.down:after {
  transform: rotate(45deg);
  position: absolute;
  top: "";
  right: "";
  width: 16px;
  height: 16px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #000000;
  content: "";
}
.arrow.left:after {
  transform: rotate(135deg);
  position: absolute;
  top: "";
  right: "";
  width: 16px;
  height: 16px;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-color: #000000;
  content: "";
}

.btn.icontext:not(.outline),
.button.icontext:not(.outline),
button.icontext:not(.outline),
p a.btn.icontext:not(.outline) {
  padding-right: 0;
  padding-left: 0;
}
@media print {
  .btn,
  .button,
  button,
  p a.btn {
    display: none !important;
  }
}

.btn.ghost.right + .btn.outline.right {
  margin-top: 16px;
}

.dot {
  position: relative;
}
.dot.space-right {
  display: flex;
  align-items: center;
}
.dot.space-right::before {
  position: relative;
  margin-right: 8px;
}
.dot.checked-dot::before {
  display: inline-block;
  padding-left: 2px;
  line-height: inherit;
  color: #ffffff;
  text-align: center;
  vertical-align: baseline;
  content: "success";
}
.dot.checked-dot.sm::before, .tooltip-container.sm .tooltip .dot.checked-dot.tooltip-close::before {
  padding-top: 1px;
  padding-left: 1px;
  font-size: 9px;
  line-height: initial;
}
.dot::before {
  border-color: #dfe1e5;
}
.dot.filled::before {
  background-color: #dfe1e5;
  box-shadow: 0 0 1px 0 #FFFFFF;
}
.dot.dot-white::before {
  border-color: #ffffff;
}
.dot.dot-white.filled::before {
  background-color: #ffffff;
  box-shadow: 0 0 1px 0 #FFFFFF;
}
.dot.dot-green::before {
  border-color: #44f5aa;
}
.dot.dot-green.filled::before {
  background-color: #44f5aa;
  box-shadow: 0 0 1px 0 #FFFFFF;
}
.dot.dot-yellow::before {
  border-color: #ffee56;
}
.dot.dot-yellow.filled::before {
  background-color: #ffee56;
  box-shadow: 0 0 1px 0 #FFFFFF;
}
.dot.dot-orange::before {
  border-color: #ffa600;
}
.dot.dot-orange.filled::before {
  background-color: #ffa600;
  box-shadow: 0 0 1px 0 #FFFFFF;
}
.dot.dot-red::before {
  border-color: #ff8870;
}
.dot.dot-red.filled::before {
  background-color: #ff8870;
  box-shadow: 0 0 1px 0 #FFFFFF;
}
.dot.dot-alpha::before {
  border-color: #44f5aa;
}
.dot.dot-alpha.filled::before {
  background-color: #44f5aa;
  box-shadow: 0 0 1px 0 #FFFFFF;
}
.dot.dot-beta::before {
  border-color: #ffe200;
}
.dot.dot-beta.filled::before {
  background-color: #ffe200;
  box-shadow: 0 0 1px 0 #FFFFFF;
}
.dot.dot-gamma::before {
  border-color: #ffe200;
}
.dot.dot-gamma.filled::before {
  background-color: #ffe200;
  box-shadow: 0 0 1px 0 #FFFFFF;
}

.tooltip-container .tooltip .dot.sm::before, .tooltip-container.sm .tooltip .dot.tooltip-close::before {
  border-width: 2px;
}

.registration label.checkbox::after {
  display: none;
}

.content p a {
  text-decoration: underline;
}

.notice {
  padding: 0.75em 1.5em;
  margin-bottom: 0.75em;
  font-style: "Source Sans Pro", sans-serif;
  font-weight: bold;
  color: #005158;
  background: rgba(0, 222, 241, 0.8);
  border-radius: 2px;
}
.notice a {
  color: black;
}
.notice a:hover {
  color: black;
}

.notice.error {
  color: #a71900;
  background: rgba(255, 93, 65, 0.8);
}
.notice.error a {
  color: black;
}
.notice.error a:hover {
  color: black;
}

.notice.warning {
  color: #665a00;
  background: rgba(255, 226, 0, 0.8);
}
.notice.warning a {
  color: black;
}
.notice.warning a:hover {
  color: black;
}

.notice.success {
  color: #11774c;
  background: rgba(61, 228, 157, 0.8);
}
.notice.success a {
  color: black;
}
.notice.success a:hover {
  color: black;
}

table.with-border {
  line-height: initial;
}
table.with-border tbody th {
  text-align: center;
  border-bottom: 0;
}
table.with-border tbody td {
  border-bottom: 0;
}
table.with-border tfoot td,
table.with-border tfoot th {
  border-top: 1px solid #dfe1e5;
  border-bottom: 0;
}
table.with-border th {
  padding: 12px 0;
  border-right: 1px solid #dfe1e5;
  border-bottom: 1px solid #dfe1e5;
  box-sizing: border-box;
}
table.with-border th:last-child {
  border-right: 0;
}
table.with-border td {
  padding: 12px 0;
  text-align: center;
  border-right: 1px solid #dfe1e5;
  border-bottom: 1px solid #dfe1e5;
}
table.with-border td:last-child {
  border-right: 0;
}
table.with-border .with-border-bottom td,
table.with-border .with-border-bottom th {
  border-bottom: 1px solid #dfe1e5;
}
table.with-border .no-border-right th, table.with-border .no-border-right td {
  border-right: 0;
}
table.with-border .padding-horizontal td, table.with-border .padding-horizontal th {
  padding: 12px 8px;
}
table.with-border .empty {
  color: #95a0af;
  background: #fafafa;
}
table.with-border .bold {
  font-weight: bold;
}
table.with-border .title {
  font-size: 18px;
  line-height: initial;
}
@media screen and (max-height: 770px) {
  table.with-border {
    font-size: 14px;
  }
  table.with-border .title {
    font-size: 16px;
  }
  table.with-border th, table.with-border td {
    padding: 2px;
  }
  table.with-border .padding-horizontal td, table.with-border .padding-horizontal th {
    padding: 2px 8px;
  }
}

ul ul {
  margin-bottom: 0;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  label.switch input,
  label.switch input:checked,
  label.switch.sm input,
  .tooltip-container.sm .tooltip label.switch.tooltip-close input,
  label.switch.sm input:checked {
    width: 1em;
    height: 1em;
    min-width: 0;
    min-height: 0;
    background: black;
    border-radius: 0;
  }
}
.hidden-opacity {
  opacity: 0;
}

.hidden {
  display: none;
}

.left {
  float: left;
}

.right {
  float: right;
}

.text-align-right {
  text-align: right;
}

.full-height {
  height: 100%;
}

.full-width,
.flex .full-width {
  width: 100%;
}

p {
  font-weight: 400;
}

p.lead {
  font-size: 20px;
}

.v-pad-xl {
  padding-top: 24px;
  padding-bottom: 24px;
}

.v-pad-2xl {
  padding-top: 48px;
  padding-bottom: 48px;
}

.h-pad-xl {
  padding-right: 24px;
  padding-left: 24px;
}

.h-pad-2xl {
  padding-right: 48px;
  padding-left: 48px;
}

.h-pad-lg {
  padding-left: 16px;
  padding-right: 16px;
}

.margin-sm-right {
  margin-right: 4px;
}

.margin-md-right {
  margin-right: 8px;
}

.margin-lg-right {
  margin-right: 16px;
}

.margin-xl-right {
  margin-right: 24px;
}

.margin-2xl-right {
  margin-right: 48px;
}

.margin-sm-left {
  margin-left: 4px;
}

.margin-md-left {
  margin-left: 8px;
}

.margin-lg-left {
  margin-left: 16px;
}

.margin-xl-left {
  margin-left: 24px;
}

.margin-2xl-left {
  margin-left: 48px;
}

.margin-sm-bottom {
  margin-bottom: 4px;
}

.margin-md-bottom {
  margin-bottom: 8px;
}

.margin-lg-bottom {
  margin-bottom: 16px;
}

.margin-xl-bottom {
  margin-bottom: 24px;
}

.margin-2xl-bottom {
  margin-bottom: 48px;
}

.margin-sm-top {
  margin-top: 4px;
}

.margin-md-top {
  margin-top: 8px;
}

.margin-lg-top {
  margin-top: 16px;
}

.margin-xl-top {
  margin-top: 24px;
}

.margin-2xl-top {
  margin-top: 48px;
}

.space-after {
  margin-bottom: 72px;
}
@media screen and (max-width: 768px) {
  .space-after {
    margin-bottom: 24px;
  }
}

@media screen and (max-width: 768px) {
  .web .tile {
    padding: 16px;
  }
}

.aqua, .red, .green, .blue, .tooltip-container .tooltip {
  color: #ffffff;
}
.aqua *:not(.btn), .red *:not(.btn), .green *:not(.btn), .blue *:not(.btn), .tooltip-container .tooltip *:not(.btn),
.tooltip-container .tooltip *:visited:not(.btn),
.aqua .btn.ghost,
.red .btn.ghost,
.green .btn.ghost,
.blue .btn.ghost,
.tooltip-container .tooltip .btn.ghost {
  color: #ffffff;
}
.aqua input, .red input, .green input, .blue input, .tooltip-container .tooltip input {
  caret-color: #ffffff;
  border-color: rgba(255, 255, 255, 0.5);
  color: #ffffff;
}
.aqua input::placeholder, .red input::placeholder, .green input::placeholder, .blue input::placeholder, .tooltip-container .tooltip input::placeholder {
  color: rgba(255, 255, 255, 0.8);
}
.aqua input:focus, .red input:focus, .green input:focus, .blue input:focus, .tooltip-container .tooltip input:focus {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.9);
}
.aqua input:focus::placeholder, .red input:focus::placeholder, .green input:focus::placeholder, .blue input:focus::placeholder, .tooltip-container .tooltip input:focus::placeholder {
  color: rgba(255, 255, 255, 0.2);
}
.aqua label.error input, .red label.error input, .green label.error input, .blue label.error input, .tooltip-container .tooltip label.error input {
  border-color: #ff5d41;
}
.aqua .error-message, .red .error-message, .green .error-message, .blue .error-message, .tooltip-container .tooltip .error-message {
  padding: 2px 8px 4px;
  margin-top: -4px;
  background-color: #ff5d41;
}

.grey {
  background-color: #fbfbf6;
}

.beige, .register .tab-panels .tab-panel:nth-child(even) {
  background-color: #f1f1ea;
  background-image: linear-gradient(60deg, #ebebe1, #f1f1ea 50%, #fbfbf6);
}

.beige-dark {
  background-color: #d6d6c8;
}

.blue, .tooltip-container .tooltip {
  background-color: #0053d8;
  background-image: linear-gradient(232deg, #008bee, #005adb 50%, #0053d8);
}
.blue .btn.tooltip.icon, .tooltip-container .tooltip .btn.tooltip.icon {
  background: rgba(255, 255, 255, 0.9);
  color: #0053d8;
}
.blue .btn.tooltip.icon:hover, .tooltip-container .tooltip .btn.tooltip.icon:hover {
  color: #0053d8;
  background: #ffffff;
}
.blue .typeahead .typeahead-toggler::before, .tooltip-container .tooltip .typeahead .typeahead-toggler::before {
  border-color: rgba(255, 255, 255, 0.8);
}
.blue .typeahead .typeahead-toggler.open::before, .tooltip-container .tooltip .typeahead .typeahead-toggler.open::before {
  border-color: #ffffff;
}
.blue .typeahead .typeahead-option-list, .tooltip-container .tooltip .typeahead .typeahead-option-list,
.blue .typeahead .typeahead-option-list *,
.tooltip-container .tooltip .typeahead .typeahead-option-list * {
  color: #333333;
}
.blue .btn.ghost:hover, .tooltip-container .tooltip .btn.ghost:hover {
  color: #0053d8;
}

.color-blue {
  color: #0053d8;
}
.color-blue:hover {
  color: #153a77;
}

.green {
  background-color: #0053d8;
  background-image: linear-gradient(232deg, #17CDA5, #01A17B);
}

.red {
  background-color: #ff8870;
  background-image: linear-gradient(232deg, #FF9676, #FF5D41);
}

.aqua {
  background-color: #00d1e7;
  background-image: linear-gradient(232deg, #00e3f1, #00d1e7 50%, #00c2df);
}

.text-block {
  max-width: 800px;
  margin-bottom: 72px;
  text-align: left;
}

@media screen and (min-width: 768px) {
  .mobile {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  .desktop {
    display: none;
  }
}

.btn.icon.close {
  position: absolute;
  top: 0;
  right: 0;
  bottom: auto;
  line-height: 0;
  color: #95a0af;
  border-radius: 0;
}
.btn.icon.close:hover {
  color: #0053d8;
}
.btn.icon.close:hover::before {
  right: 38.4px;
  color: rgba(51, 51, 51, 0.8);
}
.btn.icon.close::before {
  position: absolute;
  top: 0;
  right: 24px;
  display: block;
  width: auto;
  padding: 22px;
  font-size: 14px;
  font-weight: 400;
  color: rgba(51, 51, 51, 0.6);
  content: attr(data-text);
  transition: all 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

/* =Theme customization starts here
------------------------------------------------------- */
:root {
  --color-analysis-good: #44f5aa;
  --color-analysis-okay: #ffe200;
  --color-analysis-bad: #ff5d41;
  --color-analysis-neutral: #dfe1e5;
}

html {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
  font-weight: 400;
}

@-moz-document url-prefix() {
  body {
    font-weight: lighter !important;
  }
}
body.nav-open {
  overflow: hidden;
}

body.prevent-scroll {
  overflow-y: scroll;
  position: fixed;
}

h2.site-title {
  padding: 12px 0;
}

.app,
.web {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.app > footer.footer-edit,
.web > footer.footer-edit {
  z-index: 20;
  display: flex;
}
.app > footer,
.web > footer {
  z-index: 20;
  display: none;
  margin-top: auto;
}
@media screen and (min-width: 1025px) {
  .app > footer,
  .web > footer {
    display: block;
  }
}
@media print {
  .app,
  .web {
    display: block;
  }
}

.main-body,
.app-body {
  margin-top: 68px;
}
@media screen and (max-width: 680px) {
  .main-body,
  .app-body {
    margin-top: 0;
  }
}

.page-template-atomic-base-styleguide h2.site-title {
  margin: 0;
}

.multigraph {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.multigraph img {
  width: 23%;
}

.icons.atomic-styleguide-section {
  display: none;
}

.font.primary p {
  font-weight: 400;
}

.styleguide .drawer,
.styleguide .nav-panel {
  height: 940px;
}
.styleguide .grid {
  width: 100vw;
}

.site {
  padding-top: 0;
}

.web .page.container > .registration,
.web .page.container > .padded-content {
  padding: 24px 48px 24px 0;
}

.app .page.container {
  flex-wrap: nowrap;
  max-width: unset;
}
@media screen and (max-width: 1024px) {
  .app .page.container {
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 1024px) and (min-width: 681px) {
  .app .page.container {
    padding-right: 60px;
  }
}
.app .page.container > .content,
.app .page.container > .org-profile {
  flex-shrink: 10;
  width: 100%;
  max-width: 1200px;
  min-width: 0;
  padding: 24px 48px 24px 0;
  margin-right: auto;
  margin-left: auto;
}
@media screen and (max-width: 1024px) {
  .app .page.container > .content,
  .app .page.container > .org-profile {
    padding: 0 0 24px 0;
  }
}
.app .page.container > .padded-content {
  padding: 24px 48px 24px 0;
}
@media screen and (max-width: 680px) {
  .app .page.container > .padded-content {
    padding-right: 0;
  }
}

@media screen and (min-width: 681px) {
  .app .page.container {
    padding: 36px 0 0 60px;
    padding-top: 0;
  }
  .web .page.container {
    padding-top: 0;
  }
}
.onboarding .bottom {
  pointer-events: none;
}

.onboarding .bottom a {
  pointer-events: auto;
}

.onboarding .app footer {
  display: block;
}

.typeahead-group button,
.person-list button {
  margin: 0;
}

#atlwdg-trigger {
  z-index: 9999999999;
}

.tooltip-text .tendency > div {
  font-size: 1.75em;
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
}

@page {
  margin: 10mm;
  size: 297mm 420mm;
}
@media print {
  html,
  body {
    width: 297mm;
  }
  .no-print {
    display: none !important;
  }
  .next-page {
    break-after: page;
  }
  .grid {
    display: block;
  }
}
@media screen and (min-width: 681px) {
  .app.admin .page.container {
    padding: 36px 60px 0 60px;
    padding-top: 0;
  }
}

/*# sourceMappingURL=style.css.map */