@font-face {
  font-family: "Montserrat-Bold";
  src: url(../font/Montserrat-Bold.ttf);
  type: "TrueType";
}

@font-face {
  font-family: "Montserrat-Light";
  src: url(../font/Montserrat-Light.ttf);
  type: "TrueType";
}

@font-face {
  font-family: "Montserrat-SemiBoldItalic";
  src: url(../font/Montserrat-SemiBoldItalic.ttf);
  type: "TrueType";
}

* {
  --color-0: #ffffff;
  --color-01: #ffffff80;
  --color-1: #19233a;
  --color-2: #f9ae30;
  --color-3: #32667e;
  --color-31: #47768b;
  --color-4: #646d77;
  --color-5: #c2c8ce;
  --color-6: #eb713b;
  font-family: "Montserrat-Light";
  font-size: 12px;
}

.dn {
  display: none !important;
}

sub,
sup {
  /* Specified in % so that the sup/sup is the
     right size relative to the surrounding text */
  font-size: 75%;

  /* Zero out the line-height so that it doesn't
     interfere with the positioning that follows */
  line-height: 0;

  /* Where the magic happens: makes all browsers position
     the sup/sup properly, relative to the surrounding text */
  position: relative;

  /* Note that if you're using Eric Meyer's reset.css, this
     is already set and you can remove this rule */
  vertical-align: baseline;
}

sup {
  /* Move the superscripted text up */
  top: -0.5em;
}

sub {
  /* Move the subscripted text down, but only
     half as far down as the superscript moved up */
  bottom: -0.25em;
}

body[data-page="contact"] {
  background-image: none !important;
}

body[data-page="disclaimer"] {
  background-image: none !important;
}

/* #################################################################### */
.mainContainer {
  width: 100vw;
  min-height: 100vh;
  padding: 1em 1em 1em 1em;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  background-color: #32667e;
}

body[data-currentview="infusionVerabreichen"] .mainContainer {
  background-color: var(--color-0);
}

.highlight {
  color: var(--color-2);
}

/* -------------------------------------------------------------------- */
.q_width23 {
  width: 23em !important;
}

.q_row {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}

.q_row.q_wrap {
  flex-wrap: wrap;
}

.q_row.q_centered {
  justify-content: center;
}

.q_row .q_weiter {
  min-width: 10em;
  text-align: center;
  color: white;
  border: 2px solid white;
  border-radius: 2em;
  padding-right: 2em;
  padding: 0.5em 1em;
  background-repeat: no-repeat;
  background-position: calc(100% - 1em) center;
  /*background-size:contain;*/
  background-image: url(../img/qarziba/pfeil-rechts-weiss.svg);
}

.q_row.q_spaceBetween {
  justify-content: space-between;
}

.q_row.q_spaceAround {
  justify-content: space-around;
}

.q_row .q_flex1 {
  flex: 1;
}

.q_row .q_flex2 {
  flex: 2;
}

.q_row .q_flex3 {
  flex: 3;
}

.q_legend {
  font-size: 0.75em;
  color: var(--color-4);
}

body[data-term="STI"] .zusatzTextLTI {
  display: none;
}

/* -------------------------------------------------------------------- */
.mainContainer .topBar {
  /*height:6vh;*/
  min-height: 4em;
  margin-bottom: 2em;
  /*padding:3em 1em 1em 1em;*/
  /*background-color:red;*/
  display: -webkit-flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: inherit;
  text-align: center;

  padding-right: 6em;
  background-repeat: no-repeat;
  background-position: calc(100% - 2em) center;
  background-position: right top;
  background-size: contain;
  background-size: 50px 60px;
  background-image: url(../img/qarziba/icon-qarziba.svg);
}

.viewDesktop .mainContainer .topBar .navigationButtons {
  display: -webkit-flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
}

.viewMobile .mainContainer .topBar .navigationButtons {
  display: -webkit-flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: flex-start;
}

.panelBottomBar {
  width: 100%;
  /*display: -webkit-flex;*/
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: center;
  /*background-color: var(--color-31);*/
}

.q_weiterBtn {
  width: 10em;
  height: 3em;
  margin-right: 1em;
  text-align: center;

  display: -webkit-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: white;

  border: 2px solid white;
  border-radius: 2em;
  padding-right: 2em;
  padding: 0.5em 1em;
  background-repeat: no-repeat;
  background-position: calc(100% - 1em) center;
  /* background-size: contain; */
  background-image: url(../img/qarziba/pfeil-rechts-weiss.svg);
  background-color: var(--color-31);
}

/* -------------------------------------------------------------------- */
.mainContainer .content {
  margin: 0.5em 5em;
  padding-bottom: 10vh;
  /*background-color:green;*/
  flex: 1;
}

.viewMobile .mainContainer .content {
  margin: 0.5em 0em;
}

body[data-currentview="infusionHerstellung"] .viewMobile .mainContainer .content,
body[data-currentview="infusionVerabreichen"] .viewMobile .mainContainer .content {
  margin: 0.5em 0em;
}

.mainContainer .content .contentPanel {
  width: 100%;
  min-height: 50%;
  /*padding:3em 0;*/
  display: none;
}

body[data-currentView="dosisberechnung"] .mainContainer .content .contentPanel[data-content="dosisberechnung"] {
  display: flex;
}

body[data-currentView="bedarf"] .mainContainer .content .contentPanel[data-content="bedarf"] {
  display: flex;
}

body[data-currentView="infusionHerstellung"] .mainContainer .content .contentPanel[data-content="infusionHerstellung"] {
  display: flex;
}

body[data-currentView="infusionVerabreichen"] .mainContainer .content .contentPanel[data-content="infusionVerabreichen"] {
  display: flex;
}

body .mainContainer .content .contentPanel {
  max-width: 1024px;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

body[data-currentView="infusionVerabreichen"] .mainContainer .content .contentPanel[data-content="infusionVerabreichen"] {
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto;
}

/*body[data-currentView='infusionHerstellung'] .mainContainer .content .contentPanel[data-content='infusionHerstellung'] .highlight { font-size:2em; }*/

body[data-currentView="infusionHerstellung"] .mainContainer .content .contentPanel[data-content="infusionHerstellung"] .blockHeadline1 {
  padding-left: 0.5em;
  font-size: 2em;
  color: var(--color-2);
}

body[data-currentView="infusionHerstellung"] .mainContainer .content .contentPanel[data-content="infusionHerstellung"] .blockHeadline2 {
  padding-left: 0.5em;
  font-size: 2em;
  color: var(--color-2);
}

body[data-currentView="infusionHerstellung"] .viewMobile .mainContainer .content .contentPanel[data-content="infusionHerstellung"] .blockHeadline1 {
  font-size: calc(1em + 1vw);
}

body[data-currentView="infusionHerstellung"] .viewMobile .mainContainer .content .contentPanel[data-content="infusionHerstellung"] .blockHeadline2 {
  font-size: calc(0.75em + 1vw);
}

body[data-currentView="infusionHerstellung"] .viewMobile .contentPanel[data-content="infusionHerstellung"] .q_bottom .q_label {
  font-size: calc(0.5em + 1vw);
}

.bottomBar {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100vw;
  height: 12vh;
}

.bottomBar .panelBottomBar {
  /*padding:3em 0;*/
  height: inherit;
  /*border:1px solid lime;*/
  display: none;
}

body[data-currentView="dosisberechnung"] .bottomBar .panelBottomBar[data-content="dosisberechnung"] {
  display: flex;
  flex-direction: column;
}

body[data-currentView="bedarf"] .bottomBar .panelBottomBar[data-content="bedarf"] {
  display: flex;
}

body[data-currentView="infusionHerstellung"] .bottomBar .panelBottomBar[data-content="infusionHerstellung"] {
  display: flex;
}

body[data-currentView="infusionVerabreichen"] .bottomBar .panelBottomBar[data-content="infusionVerabreichen"] {
  display: flex;
}

/* -------------------------------------------------------------------- */
.bottomBar {
  /*background-color:blue;*/
}

.q_info,
.q_action {
  cursor: pointer;
}

.q_info {
  /*width:1em;*/
  height: 2em;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url(../img/qarziba/icon-info.svg);
}

/* #################################################################### */

/* #################################################################### */
.mainContainer .topBar .btnRounded {
  height: 3.5em;
  margin: 5px;
  padding: 0.5em 1em;

  display: -webkit-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-weight: bold;

  color: var(--color-01);
  background-color: var(--color-31);
  /*border:2px solid var(--color-31);*/

  border-radius: 2em;
  min-width: 11em;
}

body[data-currentview="infusionVerabreichen"] .mainContainer .topBar .btnRounded {
  color: var(--color-1);
  background-color: var(--color-5);
  border: 2px solid var(--color-1);
}

.mainContainer .topBar .btnRounded.current {
  color: var(--color-0);
  background-color: var(--color-2);
  border-color: var(--color-2) !important;
}

.mainContainer .topBar .btnRounded.dosiskalkulation {
  padding-right: 4em;
  background-repeat: no-repeat;
  background-position: calc(100% - 1em) center;
  background-size: 2em;
  background-image: url(../img/qarziba/btn-video-play.svg);
  border-radius: 0.5em;
  border-color: var(--color-5) !important;
}

body[data-term="LTI"] .mainContainer .topBar .btnRounded.dosiskalkulation.ltivideo {
  display: -webkit-flex;
  min-width: 6em;
}
body[data-term="STI"] .mainContainer .topBar .btnRounded.dosiskalkulation.stivideo {
  display: -webkit-flex;
  min-width: 6em;
}

body[data-term="LTI"][data-currentview="dosisberechnung"] .mainContainer .topBar .btnRounded.dosiskalkulation.ltivideo,
body[data-term="STI"] .mainContainer .topBar .btnRounded.dosiskalkulation.ltivideo {
  display: none;
}
body[data-term="STI"][data-currentview="dosisberechnung"] .mainContainer .topBar .btnRounded.dosiskalkulation.stivideo,
body[data-term="LTI"] .mainContainer .topBar .btnRounded.dosiskalkulation.stivideo {
  display: none;
}

body[data-currentView="dosisberechnung"] .mainContainer .topBar .btnRounded[data-action="dosisberechnung"] {
  color: var(--color-0);
  background-color: var(--color-2);
}

body[data-currentView="bedarf"] .mainContainer .topBar .btnRounded[data-action="bedarf"] {
  color: var(--color-0);
  background-color: var(--color-2);
}

body[data-currentView="infusionHerstellung"] .mainContainer .topBar .btnRounded[data-action="infusionHerstellung"] {
  color: var(--color-0);
  background-color: var(--color-2);
}

body[data-currentView="infusionVerabreichen"] .mainContainer .topBar .btnRounded[data-action="infusionVerabreichen"] {
  color: var(--color-0);
  background-color: var(--color-2);
  border-color: var(--color-2);
}

/* -------------------------------------------------------------------- */
.mainContainer .topBar .burgerMenu {
  position: relative;
  top: -5px;
  width: 50px !important;
  min-width: 50px !important;
  max-width: 50px !important;
  height: 50px;
  background-color: transparent;
  margin-left: 0.5em;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50px 50px;
  /*background-image:url('../img/icon-burger-menu@2x.png');*/
  background-image: url("../img/qarziba/btn-Menu-weiss.svg");
  cursor: pointer;
  border-color: transparent !important;
  background-color: transparent !important;
}

body[data-currentView="infusionVerabreichen"] .mainContainer .topBar .burgerMenu {
  background-image: url("../img/qarziba/btn-Menu-grau.svg");
}

/* -------------------------------------------------------------------- */
.q_spacer {
  flex: 1;
}

/* #################################################################### */
.contentPanel[data-content] .q_headline {
  font-size: 2em;
  color: #f9ae30;
  margin-bottom: 5vh;
  /*box-shadow:0 0 4px black inset;*/
}

/* #################################################################### */
/* ---- D O S I B E R E C H N U N G ----------------------------------- */
/* #################################################################### */
.contentPanel[data-content="dosisberechnung"] {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  /*background-color:orange;*/
}

/* -------------------------------------------------------------------- */
.contentPanel[data-content="dosisberechnung"] .q_mainContent {
  /*box-shadow:0 0 4px black inset;*/
  flex: 1;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}

.contentPanel[data-content="dosisberechnung"] .q_mainContent .q_leftArea,
.contentPanel[data-content="dosisberechnung"] .q_mainContent .q_rightArea {
  /*box-shadow:0 0 4px black inset;*/
  /*margin:10% 0;*/
  padding: 1em;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  background-color: white;
  border-radius: 15px;
}

.contentPanel[data-content="dosisberechnung"] .q_mainContent .q_leftArea {
  min-height: 50vh;
  margin-right: 1em;
  background-repeat: no-repeat;
  background-position: calc(100% - 1em) calc(0% + 1em);
  background-size: calc(100% / 6);
  background-image: url(../img/qarziba/Icon-Kinder.svg);
}

.contentPanel[data-content="dosisberechnung"] .q_mainContent .q_row {
  /*box-shadow:0 0 4px black inset;*/
  padding: 1em 0em;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}

.q_flex1 {
  flex: 1;
}

.contentPanel[data-content="dosisberechnung"] .q_mainContent .q_leftArea .q_headline,
.contentPanel[data-content="dosisberechnung"] .q_mainContent .q_rightArea .q_headline {
  color: black;
  font-size: 1.5em;
  font-weight: bold;
  margin-bottom: 5vh;
}

.contentPanel[data-content="dosisberechnung"] .q_mainContent .q_row .q_label {
  flex: 1;
  font-weight: bold;
}

.contentPanel[data-content="dosisberechnung"] .q_mainContent .q_row .q_label.q_center {
  text-align: center;
}

.contentPanel[data-content="dosisberechnung"] .q_mainContent .q_row .q_label.q_right {
  padding-right: 1em;
  text-align: right;
}

.contentPanel[data-content="dosisberechnung"] .q_mainContent .q_row .q_input {
  flex: 1;
}

.contentPanel[data-content="dosisberechnung"] .q_mainContent .q_row .q_input input {
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: center;
  border-radius: 2em;
  border-color: grey;
  width: 100%;
  height: 4em;

  border-width: 1px;
  border-color: grey;
}

.contentPanel[data-content="dosisberechnung"] .q_mainContent .q_row .q_input input[type="checkbox"] {
  height: 2em;
}

/* -------------------------------------------------------------------- */
.contentPanel[data-content="dosisberechnung"] .q_mainContent .q_rightArea {
  /*box-shadow:0 0 4px black inset;*/
  margin-left: 1em;
  justify-content: space-between;
}

.contentPanel[data-content="dosisberechnung"] .q_mainContent .q_rightArea .q_row .q_label {
  font-size: 1.5em;
}

.contentPanel[data-content="dosisberechnung"] .q_mainContent .q_row .q_value {
  /*box-shadow:0 0 4px black inset;*/
  padding: 0.5em;
  flex: 2;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: center;
  background-color: #f9ae30;
  color: white;
  font-size: 1.5em;
  border-radius: 15px;
}

/* -------------------------------------------------------------------- */
.contentPanel[data-content="dosisberechnung"] .q_footer {
  color: white;
  /*font-size:0.75em;*/
  /*box-shadow:0 0 4px black inset;*/
}

.contentPanel[data-content="dosisberechnung"] .q_infoPopup {
  position: fixed;
  left: 0;
  top: 0;
  min-width: 100vw;
  min-height: 100vh;
  background-color: rgba(0, 0, 0, 0.75);
  display: flex;
  /*display:none;*/
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: center;
  z-index: 2;
}

.contentPanel[data-content="dosisberechnung"] .q_infoPopup img {
  width: 50vw;
  width: auto;
  height: auto;
  height: 50vh;
}

.bottomBar .panelBottomBar[data-content="dosisberechnung"] .q_row {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}

.bottomBar .panelBottomBar[data-content="dosisberechnung"] .q_row.q_spaceAround {
  justify-content: space-around;
}
.bottomBar .panelBottomBar[data-content="dosisberechnung"] .q_row.q_center {
  justify-content: center;
}

.bottomBar .panelBottomBar[data-content="dosisberechnung"] .q_row.q_spaceAround .q_flex1 {
  flex: 1;
}

.bottomBar .panelBottomBar[data-content="dosisberechnung"] .q_row.q_spaceAround .q_flex2 {
  flex: 2;
}

.bottomBar .panelBottomBar[data-content="dosisberechnung"] .q_row.q_spaceAround .q_flex3 {
  flex: 3;
}

.bottomBar .panelBottomBar[data-content="dosisberechnung"] .q_row .q_weiter {
  text-align: center;
  border: 2px solid white;
  border-radius: 2em;
  padding-right: 2em;
  padding: 0.5em 1em;
  background-repeat: no-repeat;
  background-position: calc(100% - 1em) center;
  /*background-size:contain;*/
  background-image: url(../img/qarziba/pfeil-rechts-weiss.svg);
}

.bottomBar .panelBottomBar[data-content="dosisberechnung"] .q_row .q_col {
  /*width:30%;*/
  margin: 0 1em;
  padding: 1em 0.5em;
  color: white;
  background-color: #47768b;
  border-radius: 0.5em;
}
.bottomBar .panelBottomBar[data-content="dosisberechnung"] .q_row .q_col.lti {
  background-color: var(--color-2);
}
.bottomBar .panelBottomBar[data-content="dosisberechnung"] .q_row .q_col.q_suptext {
  border: none;
  padding: 0 0.5em;
  background-color: transparent !important;
}

/* #################################################################### */
/* -------------------------------------------------------------------- */

/* #################################################################### */
/* ---- B E D A R F --------------------------------------------------- */
/* #################################################################### */
.contentPanel[data-content="bedarf"] {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  /*background-color:yellow;*/
}

.contentPanel[data-content="bedarf"] .q_mainContent {
  /*box-shadow:0 0 4px black inset;*/
  flex: 1;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  justify-content: flex-start;
  /*margin-top: 2em;*/
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_leftArea,
.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea {
  /*box-shadow:0 0 4px black inset;*/
  padding: 1em;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_leftArea.packshot {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url(../img/qarziba/Qarziba-packshot.png);
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea {
  flex: 3;
  /*background-color:orange;*/
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_dosisContainer {
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_dosis {
  justify-content: flex-start !important;
  text-align: left !important;
  padding-left: 3.5em;
  color: #f9ae30;
  font-weight: bold;

  background-repeat: no-repeat;
  background-position: 1em center;
  background-size: auto;
  background-image: url(../img/qarziba/icon-infusion.svg);
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_flaeschenContainer {
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_flaeschen {
  justify-content: flex-start !important;
  text-align: left !important;
  padding-left: 3.5em;
  color: #f9ae30;
  font-weight: bold;

  background-repeat: no-repeat;
  background-position: 1em center;
  background-size: auto;
  background-image: url(../img/qarziba/Icon-durchstechflasche.svg);
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_col1 {
  flex: 1.5;
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_col2 {
  flex: 1;
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_col3 {
  flex: 1;
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_col31 {
  flex: 0.5;
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_col4 {
  flex: 1;
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_cell {
  padding: 2px;
  /*margin:2px;*/
  /*border-radius:1em;*/
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_cell2rows .cellContent,
.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_cell .cellContent {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 1em;
  border-radius: 1em;
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_cell2rows .cellContent {
  /*height:calc(100% - 4px);*/
  /*margin:2px;*/
  /*border-radius:1em;*/
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .cellContent.q_h2 {
  height: 6em;
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .cellContent.q_h1 {
  height: calc(3em - 2px);
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_cell.transparent .cellContent {
  background-color: transparent;
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_cell.white .cellContent {
  background-color: white;
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_cell.yellow .cellContent {
  background-color: orange;
  font-weight: bold;
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_cell.darkgrey .cellContent {
  background-color: darkgrey;
}

.contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_cell.lightgrey .cellContent {
  background-color: lightgrey;
}

.q_row .legende {
  font-size: 0.75em;
  color: white;
}

/* -------------------------------------------------------------------- */
.bedarfContainer .bHeadline {
  /*box-shadow:0 0 4px black inset;*/
}

/* -------------------------------------------------------------------- */
.bedarfContainer .bContent {
  /*box-shadow:0 0 4px black inset;*/
  flex: 1;
}

/* -------------------------------------------------------------------- */
.bedarfContainer .bFooter {
  /*box-shadow:0 0 4px black inset;*/
}

.chooseTerm {
  margin-left: 1em;
  display: -webkit-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: white;
}

.chooseTerm .termLTI,
.chooseTerm .termSTI {
  width: 6em;
  height: 3em;
  display: -webkit-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: white;
  cursor: pointer;
}

.chooseTerm .termLTI {
  border-top-left-radius: 1.5em;
  border-bottom-left-radius: 1.5em;
  border-right: 1px solid white;
}

.chooseTerm .termSTI {
  border-top-right-radius: 1.5em;
  border-bottom-right-radius: 1.5em;
  border-left: 1px solid white;
}

body[data-term="LTI"] .termLTI {
  background-color: var(--color-2);
}

body[data-term="LTI"] .termSTI {
  background-color: var(--color-31);
}

body[data-term="STI"] .termSTI {
  background-color: var(--color-1);
}

body[data-term="STI"] .termLTI {
  background-color: var(--color-31);
}

body[data-currentView="bedarf"][data-term="LTI"] .q_rightArea[data-term="LTI"] {
}

body[data-currentView="bedarf"][data-term="LTI"] .q_rightArea[data-term="STI"] {
  display: none;
}

body[data-currentView="bedarf"][data-term="STI"] .q_rightArea[data-term="LTI"] {
  display: none;
}

body[data-currentView="bedarf"][data-term="STI"] .q_rightArea[data-term="STI"] {
}

/*
--color-1:#19233A;
--color-3:#32667E;
*/
/* #################################################################### */

/* #################################################################### */
/* ---- I N F U S I O N    H E R S T E L L E N ------------------------ */
/* #################################################################### */
body[data-currentView="infusionHerstellung"] .contentPanel[data-content="infusionHerstellung"] {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  color: white;
  /*background-color:deeppink;*/
}

/* -------------------------------------------------------------------- */
body[data-currentView="infusionHerstellung"] .contentPanel[data-content="infusionHerstellung"] .q_top {
  /*box-shadow:0 0 4px black inset;*/
  margin-bottom: 1em;
  flex: 1;
  background-color: var(--color-31);
  border-radius: 10px;
  /*font-size:2em;*/
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

body[data-currentView="infusionHerstellung"] .contentPanel[data-content="infusionHerstellung"] .q_row.q_rowCentered {
  flex: 1;
  display: -webkit-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 2em;
}

body[data-currentView="infusionHerstellung"] .viewMobile .contentPanel[data-content="infusionHerstellung"] .q_row.q_rowCentered {
  font-size: calc(1em + 1vw);
}

body[data-currentView="infusionHerstellung"] .contentPanel[data-content="infusionHerstellung"] .volume {
  flex: 1;
  display: -webkit-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

body[data-currentView="infusionHerstellung"] .contentPanel[data-content="infusionHerstellung"] .horizontalRule {
  width: 80%;
  height: 2px;
  border-bottom: 2px solid white;
}

/* -------------------------------------------------------------------- */
body[data-currentView="infusionHerstellung"] .contentPanel[data-content="infusionHerstellung"] .q_bottom {
  /*box-shadow:0 0 4px black inset;*/
  flex: 1;
}

body[data-currentView="infusionHerstellung"] .contentPanel[data-content="infusionHerstellung"] .q_bottom {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}

body[data-currentView="infusionHerstellung"] .contentPanel[data-content="infusionHerstellung"] .q_bottom .q_left {
  width: 70%;
  margin-right: 1em;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  background-color: var(--color-31);
  border-radius: 10px;
}

body[data-currentView="infusionHerstellung"] .contentPanel[data-content="infusionHerstellung"] .q_bottom .q_right {
  width: 30%;
  padding: 0.5em;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  background-color: var(--color-2);
  border-radius: 10px;
  font-size: 1.5em;
  color: black;
}

body[data-currentView="infusionHerstellung"] .contentPanel[data-content="infusionHerstellung"] .q_bottom .q_value {
  width: 25%;

  display: -webkit-flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  text-align: center;
  font-size: 2em;
}

body[data-currentView="infusionHerstellung"] .contentPanel[data-content="infusionHerstellung"] .q_bottom .q_label {
  flex: 1;
  padding-left: 1em;
  display: -webkit-flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  text-align: center;
  font-size: 2em;
}

/* #################################################################### */

/* #################################################################### */
/* ---- I N F U S I O N    V E R A B R E I C H E N -------------------- */
/* #################################################################### */
.infusionVerabreichenContainer {
  width: 100%;
  height: 100%;
  /*background-color:greenyellow;*/
}

.contentPanel[data-content="infusionVerabreichen"] {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

body[data-currentView="infusionVerabreichen"][data-term="LTI"] [data-term="STI"] {
  display: none;
}

body[data-currentView="infusionVerabreichen"][data-term="STI"] [data-term="LTI"] {
  display: none;
}

/* ------------------------------- */
body[data-currentView="infusionVerabreichen"][data-term="LTI"] .dosisschema.LTI {
  width: 100%;
  height: 300px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url(../img/qarziba/InfusionVerabreichenLTI/Dosisschema_LTI@2x.png);
}

body[data-currentView="infusionVerabreichen"][data-term="LTI"] .dosisschema.STI {
  display: none;
}

body[data-currentView="infusionVerabreichen"][data-term="STI"] .dosisschema.LTI {
  display: none;
}

body[data-currentView="infusionVerabreichen"][data-term="STI"] .dosisschema.STI {
  width: 100%;
  height: 300px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url(../img/qarziba/InfusionVerabreichenSTI/Gruppe_320@2x.png);
}

/* ------------------------------- */
body[data-currentView="infusionVerabreichen"][data-term="LTI"] .durchfuehrung.LTI {
  width: 100%;
  height: 200px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url(../img/qarziba/InfusionVerabreichenLTI/Grafik-Durchfuehrung_LTI@2x.png);
}

body[data-currentView="infusionVerabreichen"][data-term="LTI"] .durchfuehrung.STI {
  display: none;
}

body[data-currentView="infusionVerabreichen"][data-term="STI"] .durchfuehrung.LTI {
  display: none;
}

body[data-currentView="infusionVerabreichen"][data-term="STI"] .durchfuehrung.STI {
  width: 100%;
  height: 200px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url(../img/qarziba/InfusionVerabreichenSTI/Grafik_Durchführung_STI@2x.png);
}

/* ------------------------------- */
body[data-currentView="infusionVerabreichen"] .gabepantin {
  width: 100%;
  height: 200px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url(../img/qarziba/InfusionVerabreichenLTI/Gabapentin@2x.png);
}

/* ------------------------------- */
body[data-currentView="infusionVerabreichen"] .morphin {
  width: 100%;
  height: 276px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url(../img/qarziba/InfusionVerabreichenLTI/Morphin@2x.png);
}

/* ------------------------------- */
body[data-currentView="infusionVerabreichen"] .nichtopioidanalgetika {
  width: 100%;
  height: 137px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url(../img/qarziba/InfusionVerabreichenLTI/Nichtopioidanalgetika@2x.png);
}

/* ------------------------------- */

.contentPanel[data-content="infusionVerabreichen"] .q_row.q_rowVerab {
  margin-bottom: 0.5em;
  align-items: flex-end;
}

.contentPanel[data-content="infusionVerabreichen"] .q_row .q_imgLabel {
  font-size: 1.2em;
}

.contentPanel[data-content="infusionVerabreichen"] .q_row .q_imgButton {
  padding: 0.5em 1em;
  font-size: 1em;
  color: var(--color-0);
  background-color: var(--color-6);
  border-radius: 10px;
}

.q_row .q_downloadBtn {
  margin-right: 2em;
  padding: 0.5em 3em;
  font-size: 1em;
  color: var(--color-0);
  background-color: var(--color-6);
  border-radius: 10px;

  display: -webkit-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.contentPanel[data-content="infusionVerabreichen"] .greybox {
  margin: 1em 0em;
  padding: 1em;
  width: 100%;
  background-color: var(--color-5);
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.contentPanel[data-content="infusionVerabreichen"] .greybox .headBlock {
  /*height:2em;*/
  margin: 0.5em 0em;
  padding: 0em 1em;
  display: -webkit-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: center;
  border-radius: 10px;
  color: var(--color-0);
  font-size: 2em;
  font-weight: bold;
}

.contentPanel[data-content="infusionVerabreichen"] .greybox .headBlock.black {
  background-color: var(--color-1);
}

.contentPanel[data-content="infusionVerabreichen"] .greybox .headBlock.orange {
  background-color: var(--color-6);
}

.contentPanel[data-content="infusionVerabreichen"] .greybox .headBlock.grey {
  background-color: var(--color-4);
}

.contentPanel[data-content="infusionVerabreichen"] .greybox .q_row.q_infoText p {
  padding-top: 0.5em;
  line-height: 1.5em;
  font-size: 1.5em;
}

.contentPanel[data-content="infusionVerabreichen"] .greybox .q_row.q_infoText ul {
  list-style: none;
  padding-left: 2em;
}

.contentPanel[data-content="infusionVerabreichen"] .greybox .q_row.q_infoText ul li::before {
  content: "\2022";
  color: var(--color-6);
  font-weight: bold;
  display: inline-block;
  width: 1em;
  margin-left: -1em;
}

.contentPanel[data-content="infusionVerabreichen"] .greybox .q_row.q_infoText ul li {
  font-size: 1.5em;
}

.contentPanel[data-content="infusionVerabreichen"] .q_row.schema {
  margin-bottom: 1em;
  display: -webkit-flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: initial;
  text-align: left;
}

.viewMobile .contentPanel[data-content="infusionVerabreichen"] .q_row.schema {
  flex-direction: column;
}

.contentPanel[data-content="infusionVerabreichen"] .q_row.schema .q_col {
  padding: 0.5em;
  width: 24.5%;
  /*box-shadow:0 0 2px black inset;*/
  background-color: var(--color-5);
  border-radius: 0.5em;
}

.viewMobile .contentPanel[data-content="infusionVerabreichen"] .q_row.schema .q_col {
  width: 100%;
  margin-bottom: 0.5em;
}

.contentPanel[data-content="infusionVerabreichen"] .q_row.schema .q_head {
  margin-bottom: 0.5em;
  font-size: 1.2em;
  font-weight: bold;
}

.contentPanel[data-content="infusionVerabreichen"] .q_antihistaminikum .q_head {
  color: var(--color-4);
}

.contentPanel[data-content="infusionVerabreichen"] .q_gabapentin .q_head {
  color: var(--color-1);
}

.contentPanel[data-content="infusionVerabreichen"] .q_opipide .q_head {
  color: var(--color-1);
}

.contentPanel[data-content="infusionVerabreichen"] .q_nichtopioidanalgetika .q_head {
  color: var(--color-4);
}

.contentPanel[data-content="infusionVerabreichen"] .q_opipide b.highlight {
  color: var(--color-6);
}

.contentPanel[data-content="infusionVerabreichen"] .q_row.schema .q_schema {
  font-size: 0.8em;
}

/* -------------------------------------------------------------------- */
.infusionVerabreichenContainer .ivHeadline {
  /*box-shadow:0 0 4px black inset;*/
}

/* -------------------------------------------------------------------- */
.infusionVerabreichenContainer .ivContent {
  /*box-shadow:0 0 4px black inset;*/
  flex: 1;
}

/* -------------------------------------------------------------------- */
.infusionVerabreichenContainer .ivFooter {
  /*box-shadow:0 0 4px black inset;*/
}

/* #################################################################### */

/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */

.viewMobile .contentPanel[data-content="dosisberechnung"] .q_mainContent {
  flex-direction: column;
}

.viewMobile .contentPanel[data-content="dosisberechnung"] .q_mainContent .q_leftArea {
  margin-right: 0em;
}

.viewMobile .contentPanel[data-content="dosisberechnung"] .q_mainContent .q_rightArea {
  margin-left: 0em;
}

.viewMobile .contentPanel[data-content="dosisberechnung"] .q_actionWeiter {
  padding: 1em;
  margin-bottom: 1em;
  border-radius: 10px;
  color: white;
  background-color: var(--color-31);
}
.viewMobile .contentPanel[data-content="dosisberechnung"] .q_actionWeiter.lti {
  background-color: var(--color-2);
}
.viewMobile .contentPanel[data-content="dosisberechnung"] .q_actionWeiter.q_suptext {
  background-color: transparent;
  padding: 0;
  margin: 0;
  text-align: center;
}

.viewMobile .contentPanel[data-content="dosisberechnung"] .q_footer {
  text-align: center;
}

body[data-viewMode="mobile"] .panelBottomBar[data-content="dosisberechnung"] {
  display: none !important;
}

.viewMobile .contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_emptyColumn {
  justify-content: flex-start !important;
  text-align: left !important;
  padding-left: 3.5em;
  color: #f9ae30;
  font-weight: bold;

  background-repeat: no-repeat;
  background-position: 1em center;
  background-size: auto;
  background-image: none;
  /*url(../img/qarziba/icon-infusion.svg);*/
}

.viewMobile .contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_col1 {
  width: 25%;
  flex: 0;
}

.viewMobile .contentPanel[data-content="bedarf"] .q_mainContent .q_rightArea .q_row .q_col2 {
  width: 75%;
}

.viewMobile .contentPanel[data-content="bedarf"] .q_mainContent .packshot {
  flex: 1;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url(../img/qarziba/Qarziba-packshot.png);
}

.viewMobile .contentPanel[data-content="bedarf"] .q_packshotIcons {
  display: -webkit-flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  text-align: center;
}

.viewMobile .contentPanel[data-content="bedarf"] .q_packshotIcons .packshot {
  flex: 1;
}

.viewMobile .contentPanel[data-content="bedarf"] .iconsDescription {
  /*flex:1;*/
  display: -webkit-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.viewMobile .contentPanel[data-content="bedarf"] .iconsDescription .q_dosis {
  height: 6em;
  margin-bottom: 1em;
  justify-content: flex-start !important;
  text-align: left !important;
  padding-left: 3.5em;
  padding-right: 0.5em;
  color: #f9ae30;
  background-color: white;
  font-weight: bold;
  background-repeat: no-repeat;
  background-position: 1em center;
  background-size: auto;
  background-image: url(../img/qarziba/icon-infusion.svg);

  width: 100%;
  /*height: 100%;*/
  display: flex;
  flex-direction: row;
  /*justify-content: center;*/
  align-items: center;
  /*text-align: center;*/
  font-size: 1em;
  border-radius: 1em;
}

.viewMobile .contentPanel[data-content="bedarf"] .iconsDescription .q_flaeschen {
  height: 6em;
  justify-content: flex-start !important;
  text-align: left !important;
  padding-left: 3.5em;
  padding-right: 0.5em;
  color: #f9ae30;
  background-color: white;
  font-weight: bold;
  background-repeat: no-repeat;
  background-position: 1em center;
  background-size: auto;
  background-image: url(../img/qarziba/Icon-durchstechflasche.svg);

  width: 100%;
  /*height: 100%;*/
  display: flex;
  flex-direction: row;
  /*justify-content: center;*/
  align-items: center;
  /*text-align: center;*/
  font-size: 1em;
  border-radius: 1em;
}

/* -------------------------------------------------------------------- */
body[data-currentView="infusionHerstellung"] .viewMobile .contentPanel[data-content="infusionHerstellung"] .mobView {
  flex: 1;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  margin-bottom: 1em;
}

body[data-currentView="infusionHerstellung"] .viewMobile .contentPanel[data-content="infusionHerstellung"] .mobView .q_left {
  width: 100%;
  /*margin-right:1em;*/
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  background-color: var(--color-31);
  border-radius: 10px;
}

body[data-currentView="infusionHerstellung"] .viewMobile .contentPanel[data-content="infusionHerstellung"] .mobView .q_right {
  width: 100%;
  padding: 0.5em;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  background-color: var(--color-2);
  border-radius: 10px;
  font-size: 1.5em;
  font-size: calc(1em + 1vw);
  color: black;
}

body[data-currentView="infusionHerstellung"] .viewMobile .contentPanel[data-content="infusionHerstellung"] .mobView .q_value {
  width: 25%;

  display: -webkit-flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  text-align: center;
  font-size: 2em;
  font-size: calc(1em + 1vw);
}

body[data-currentView="infusionHerstellung"] .viewMobile .contentPanel[data-content="infusionHerstellung"] .mobView .q_label {
  flex: 1;
  padding-left: 1em;
  display: -webkit-flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  text-align: center;
  font-size: 2em;
  font-size: calc(1em + 1vw);
}

body[data-currentView="infusionHerstellung"] .viewMobile .mainContainer .content .contentPanel[data-content="infusionHerstellung"] .blockHeadline2 {
  font-size: calc(0.75em + 1vw);
}

body[data-currentView="infusionHerstellung"] .viewMobile .contentPanel[data-content="infusionHerstellung"] .q_bottom .q_label {
  font-size: calc(1em + 1vw);
}

/* #################################################################### */

.hinweisePopup {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  font-size: 12px;
  background-color: var(--color-31);
  background-repeat: no-repeat;
  background-position: calc(100% - 1em) 1em;
  background-size: 50px 60px;
  background-image: url(../img/qarziba/icon-qarziba.svg);
  overflow-y: auto;
}

body[data-showHinweisePopup="on"][data-hinweiseTyp="pflichttext"] .hinweisePopup,
body[data-showHinweisePopup="on"][data-hinweiseTyp="install"] .hinweisePopup,
body[data-showHinweisePopup="on"][data-hinweiseTyp="disclaimer"] .hinweisePopup {
  display: block;
}

.hinweisePopup .closeHinweisepopup {
  position: relative;
  left: 1em;
  top: 0.5em;
  width: 10em;
  height: 3em;
  padding: 0.5em;
  font-weight: bold;
  font-size: 1.5em;
  color: black;
  background-color: white;
  border-radius: 1.5em;
  display: -webkit-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: center;

  background-repeat: no-repeat;
  background-position: 1em center;
  background-size: 1em 2em;
  background-image: url(../img/qarziba/pfeil-links-dunkelblau.svg);

  cursor: pointer;
}

body[data-page="contact"] .hinweisePopup .closeHinweisepopup {
  height: 2em;
}

body[data-page="disclaimer"] .hinweisePopup .closeHinweisepopup {
  height: 2em;
}

.hinweisePopup .pflichttext,
.hinweisePopup .install,
.hinweisePopup .disclaimer {
  display: none;
  position: relative;
  left: 1em;
  top: 5.5em;
  width: calc(100vw - 2em);
  height: calc(100vh - 1em);
  /*right:1em;*/
  /*bottom:0.5em;*/
  color: white;
  /*border:1px solid black;*/
  overflow-y: auto;
}

body[data-showHinweisePopup="on"][data-hinweiseTyp="pflichttext"] .hinweisePopup .pflichttext {
  display: block;
}

body[data-showHinweisePopup="on"][data-hinweiseTyp="install"] .hinweisePopup .install {
  display: block;
}

body[data-showHinweisePopup="on"][data-hinweiseTyp="disclaimer"] .hinweisePopup .disclaimer {
  display: block;
}

.hinweisePopup .header {
  display: block;
  font-size: 2em;
  line-height: 2em;
}

.hinweisePopup .subHeader {
  display: block;
  font-size: 1.5em;
  line-height: 1.5em;
}

.hinweisePopup .text {
  display: block;
  font-size: 1em;
  line-height: 1.25em;
  margin-top: 1em;
}

.hinweisePopup .text .subHeader {
  display: block;
  font-size: 1em;
  line-height: 1.25em;
}

.hinweisePopup a:visited,
.hinweisePopup a {
  color: white;
}

/* ########################## SIDE MENU ########################## */
.sideMenu {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  display: none;
  /*background-color:rgba(255,255,255,0.5);*/
}

body[data-showSideMenu="on"] .sideMenu {
  display: block;
}

.sideMenu .entries {
  position: fixed;
  left: 0;
  top: 0;
  min-width: 25em;
  max-width: 25vw;
  height: 100vh;

  display: -webkit-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;

  background-color: white;

  box-shadow: 2px 0 7px black;
}

.sideMenu .entries .close {
  width: 100%;
  height: 6em;
  background-repeat: no-repeat;
  background-position: calc(100% - 1em) 1em;
  background-size: auto;
  background-image: url(../img/qarziba/btn-close-blau.svg);
}

.sideMenu .entries .entry {
  width: 75%;
  text-align: left;
  margin: 1em 0em;
  font-size: calc(1.5em + 1vh);
  color: var(--color-1);
  font-weight: bold;
  cursor: pointer;
}

.sideMenu .entries .line {
  width: 75%;
  border-bottom: 1px solid black;
}

.sideMenu .entries .logout {
  width: 75%;
  height: 1.5em;
  margin-bottom: 1em;
  border-radius: 1em;
  font-size: calc(1.5em + 1vh);
  font-weight: bold;
  text-align: right;
  padding-right: 1em;
  background-color: var(--color-5);
  background-repeat: no-repeat;
  background-position: 1em center;
  background-size: auto;
  background-image: url(../img/qarziba/Icon-Logout.svg);
  cursor: pointer;

  display: -webkit-flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  text-align: center;
}

.hinweisePopup .install {
  padding-bottom: 10em;
  font-size: calc(0.75em + 1vh);
}

.hinweisePopup .install .images {
  padding: 1em;
  margin-bottom: 1em;
  margin-left: auto;
  margin-right: auto;
  width: 75%;
  background-color: var(--color-0);
  border-radius: 1em;
  display: -webkit-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  /*display: none;*/
}

.hinweisePopup .install .images .device {
  padding: 1em 0 1em 0;
  color: var(--color-6);
  font-weight: bold;
}

.hinweisePopup .install .images .q_installInfo {
  margin-bottom: 0.5em;
  color: var(--color-4);
}

.hinweisePopup .install .images img {
}

.q_btn_lti {
  background-color: var(--color-2);
  border: 2px solid var(--color-2) !important;
}

.q_footer .q_suptext {
  font-size: 0.7em;
}

body[data-term="STI"] .legendeStars {
  display: none;
}