﻿/* =======================================================================================================
   Praxis Schlüter Schleuß Elemente
   ======================================================================================================= */

/* =======================================================================================================
   Horizontale Linie PSS Medium Dark Cyan
   Primary Color: hsl(177, 100%, 33%) Hexadezimal #00a9a0 rgba(0, 169, 160, 1.0)
   ======================================================================================================= */

.hr-PSSmd_cyan {
    border: none;                                         /* Standardrahmen entfernen */
    height: 1px;                                          /* Höhe der Linie festlegen */
    background-color: hsl(177, 100%, 33%) !important;     /* Farbe der Linie */
    margin: 0px 0;                                        /* Abstand oben/unten */
}


/* =======================================================================================================
   Praxis Schlüter Schleuß Farben
   ======================================================================================================= */

/* =======================================================================================================
   PSS Medium Dark Cyan
   Primary Color: hsl(177, 100%, 33%) Hexadezimal #00a9a0 rgba(0, 169, 160, 1.0)
   ======================================================================================================= */
/* source/colors-css/pssvars.less */
:root {
  --color-light-PSSmd_cyan: hsl(177, 100%, 94%);
  --color-minor-PSSmd_cyan: hsl(177, 100%, 89%);
  --color-PSSmd_cyan: hsl(177, 100%, 33%);  Original cyan  /*metro --color-PSSmd_cyan: hsl(177, 100%, 79%) */
  --color-sat-PSSmd_cyan: hsl(177, 100%, 37%);
  --color-dark-PSSmd_cyan: hsl(177, 97%, 27%);
  --color-primary: #00a9a0;  /*metro --color-primary: #f75553 */
}

/* source/colors-css/pssbackground.less */
.bg-PSSmd_cyan {
  background-color: hsl(177, 100%, 33%) !important;
}
.bg-PSSmd_cyan-active:active {
  background-color: hsl(177, 100%, 33%) !important;
}
.bg-PSSmd_cyan-hover:hover {
  background-color: hsl(177, 100%, 33%) !important;
}
.bg-PSSmd_cyan-focus:focus {
  background-color: hsl(177, 100%, 33%) !important;
}
.bg-light-PSSmd_cyan {
  background-color: hsl(177, 100%, 94%) !important;
}
.bg-minor-PSSmd_cyan {
  background-color: hsl(177, 100%, 89%) !important;
}
.bg-sat-PSSmd_cyan {
  background-color: hsl(177, 100%, 37%) !important;
}
.bg-dark-PSSmd_cyan {
  background-color: hsl(177, 97%, 27%) !important;
}
:root {
  --gm-value: 16px;
}
.bg-glassmorphism {
  background-color: rgba(255, 255, 255, 0.1) !important;
  backdrop-filter: blur(var(--gm-value)) !important;
}

/* source/colors-css/pssborder.less */
.bd-PSSmd_cyan {
  border-color: hsl(177, 100%, 79%) !important;
}
.bd-PSSmd_cyan-active:active {
  border-color: hsl(177, 100%, 79%) !important;
}
.bd-PSSmd_cyan-hover:hover {
  border-color: hsl(177, 100%, 79%) !important;
}
.bd-PSSmd_cyan-focus:focus {
  border-color: hsl(177, 100%, 79%) !important;
}
@property --border-angle { syntax: "<angle>"; initial-value: 0deg; inherits: true; }
@keyframes spin-border {
  from {
    --border-angle: 0deg;
  }
  to {
    --border-angle: 360deg;
  }
}
:root {
  --gradient-border-speed: 3s;
  --gradient-border-size: 2px;
  --gradient-border-colors:
    #ff4545,
    #00ff99,
    #006aff,
    #ff0095,
    #ff4545;
  --gradient-border-transparent-size: 50%;
}
.gradient-border {
  isolation: isolate;
}
.gradient-border::before,
.gradient-border::after {
  content: "";
  position: absolute;
  inset: calc(-1 * var(--gradient-border-size));
  border-radius: inherit;
  background: conic-gradient(from var(--border-angle), var(--gradient-border-colors));
  z-index: -2;
  display: block;
  transition: all 0.3s linear;
}
.gradient-border::after {
  inset: 0;
  z-index: -1;
  background: inherit;
}
.animated-border {
  animation: spin-border var(--gradient-border-speed) linear infinite;
}
.animated-border-hover:hover {
  animation: spin-border var(--gradient-border-speed) linear infinite;
}
.animated-border-PSSmd_cyan {
  --gradient-border-colors: transparent var(--gradient-border-transparent-size), hsl(177, 100%, 79%);
  animation: spin-border var(--gradient-border-speed) linear infinite;
}

/* source/colors-css/psssvg.less */
.fc-PSSmd_cyan {
  fill: hsl(177, 100%, 79%) !important;
}
.fc-PSSmd_cyan-active:active {
  fill: hsl(177, 100%, 79%) !important;
}
.fc-PSSmd_cyan-hover:hover {
  fill: hsl(177, 100%, 79%) !important;
}
.fc-PSSmd_cyan-focus:focus {
  fill: hsl(177, 100%, 79%) !important;
}
.fc-light-PSSmd_cyan {
  fill: hsl(177, 100%, 94%) !important;
}
.fc-light-PSSmd_cyan-active:active {
  fill: hsl(177, 100%, 94%) !important;
}
.fc-light-PSSmd_cyan-hover:hover {
  fill: hsl(177, 100%, 94%) !important;
}
.fc-light-PSSmd_cyan-focus:focus {
  fill: hsl(177, 100%, 94%) !important;
}
.fc-minor-PSSmd_cyan {
  fill: hsl(177, 100%, 89%) !important;
}
.fc-minor-PSSmd_cyan-active:active {
  fill: hsl(177, 100%, 89%) !important;
}
.fc-minor-PSSmd_cyan-hover:hover {
  fill: hsl(177, 100%, 89%) !important;
}
.fc-minor-PSSmd_cyan-focus:focus {
  fill: hsl(177, 100%, 89%) !important;
}
.fc-sat-PSSmd_cyan {
  fill: hsl(177, 100%, 64%) !important;
}
.fc-sat-PSSmd_cyan-active:active {
  fill: hsl(177, 100%, 64%) !important;
}
.fc-sat-PSSmd_cyan-hover:hover {
  fill: hsl(177, 100%, 64%) !important;
}
.fc-sat-PSSmd_cyan-focus:focus {
  fill: hsl(177, 100%, 64%) !important;
}
.fc-dark-PSSmd_cyan {
  fill: hsl(177, 100%, 54%) !important;
}
.fc-dark-PSSmd_cyan-active:active {
  fill: hsl(177, 100%, 54%) !important;
}
.fc-dark-PSSmd_cyan-hover:hover {
  fill: hsl(177, 100%, 54%) !important;
}
.fc-dark-PSSmd_cyan-focus:focus {
  fill: hsl(177, 100%, 54%) !important;
}
.sc-PSSmd_cyan {
  stroke: hsl(177, 100%, 79%) !important;
}
.sc-PSSmd_cyan-active:active {
  stroke: hsl(177, 100%, 79%) !important;
}
.sc-PSSmd_cyan-hover:hover {
  stroke: hsl(177, 100%, 79%) !important;
}
.sc-PSSmd_cyan-focus:focus {
  stroke: hsl(177, 100%, 79%) !important;
}
.sc-light-PSSmd_cyan {
  stroke: hsl(177, 100%, 94%) !important;
}
.sc-light-PSSmd_cyan-active:active {
  stroke: hsl(177, 100%, 94%) !important;
}
.sc-light-PSSmd_cyan-hover:hover {
  stroke: hsl(177, 100%, 94%) !important;
}
.sc-light-PSSmd_cyan-focus:focus {
  stroke: hsl(177, 100%, 94%) !important;
}
.sc-minor-PSSmd_cyan {
  stroke: hsl(177, 100%, 89%) !important;
}
.sc-minor-PSSmd_cyan-active:active {
  stroke: hsl(177, 100%, 89%) !important;
}
.sc-minor-PSSmd_cyan-hover:hover {
  stroke: hsl(177, 100%, 89%) !important;
}
.sc-minor-PSSmd_cyan-focus:focus {
  stroke: hsl(177, 100%, 89%) !important;
}
.sc-sat-PSSmd_cyan {
  stroke: hsl(177, 100%, 64%) !important;
}
.sc-sat-PSSmd_cyan-active:active {
  stroke: hsl(177, 100%, 64%) !important;
}
.sc-sat-PSSmd_cyan-hover:hover {
  stroke: hsl(177, 100%, 64%) !important;
}
.sc-sat-PSSmd_cyan-focus:focus {
  stroke: hsl(177, 100%, 64%) !important;
}
.sc-dark-PSSmd_cyan {
  stroke: hsl(177, 100%, 54%) !important;
}
.sc-dark-PSSmd_cyan-active:active {
  stroke: hsl(177, 100%, 54%) !important;
}
.sc-dark-PSSmd_cyan-hover:hover {
  stroke: hsl(177, 100%, 54%) !important;
}
.sc-dark-PSSmd_cyan-focus:focus {
  stroke: hsl(177, 100%, 54%) !important;
}
/* source/colors-css/PSSforeground.less */
.fg-PSSmd_cyan {
  color: hsl(177, 100%, 33%) !important;
}
.fg-PSSmd_cyan-active:active {
  color: hsl(177, 100%, 79%) !important;
}
.fg-PSSmd_cyan-hover:hover {
  color: hsl(177, 100%, 79%) !important;
}
.fg-PSSmd_cyan-focus:focus {
  color: hsl(177, 100%, 79%) !important;
}
.fg-light-PSSmd_cyan {
  color: hsl(177, 100%, 94%) !important;
}
.fg-light-PSSmd_cyan-active:active {
  color: hsl(177, 100%, 94%) !important;
}
.fg-light-PSSmd_cyan-hover:hover {
  color: hsl(177, 100%, 94%) !important;
}
.fg-light-PSSmd_cyan-focus:focus {
  color: hsl(177, 100%, 94%) !important;
}
.fg-minor-PSSmd_cyan {
  color: hsl(177, 100%, 89%) !important;
}
.fg-minor-PSSmd_cyan-active:active {
  color: hsl(177, 100%, 89%) !important;
}
.fg-minor-PSSmd_cyan-hover:hover {
  color: hsl(177, 100%, 89%) !important;
}
.fg-minor-PSSmd_cyan-focus:focus {
  color: hsl(177, 100%, 89%) !important;
}
.fg-sat-PSSmd_cyan {
  color: hsl(177, 100%, 37%) !important;
}
.fg-sat-PSSmd_cyan-active:active {
  color: hsl(177, 100%, 37%) !important;
}
.fg-sat-PSSmd_cyan-hover:hover {
  color: hsl(177, 100%, 37%) !important;
}
.fg-sat-PSSmd_cyan-focus:focus {
  color: hsl(177, 100%, 64%) !important;
}
.fg-dark-PSSmd_cyan {
  color: hsl(177, 100%, 54%) !important;
}
.fg-dark-PSSmd_cyan-active:active {
  color: hsl(177, 100%, 54%) !important;
}
.fg-dark-PSSmd_cyan-hover:hover {
  color: hsl(177, 100%, 54%) !important;
}
.fg-dark-PSSmd_cyan-focus:focus {
  color: hsl(177, 100%, 54%) !important;
}

/* source/colors-css/opacity.less */
.op-PSSmd_cyan {
  background-color: hsl(from hsl(177, 100%, 79%) h s l / 0.5) !important;
}
.op-PSSmd_cyan-hi {
  background-color: hsl(from hsl(177, 100%, 79%) h s l / 0.2) !important;
}
.op-PSSmd_cyan-low {
  background-color: hsl(from hsl(177, 100%, 79%) h s l / 0.8) !important;
}
.op-light-PSSmd_cyan {
  background-color: hsl(from hsl(177, 100%, 94%) h s l / 0.5) !important;
}
.op-light-PSSmd_cyan-hi {
  background-color: hsl(from hsl(177, 100%, 94%) h s l / 0.2) !important;
}
.op-light-PSSmd_cyan-low {
  background-color: hsl(from hsl(177, 100%, 94%) h s l / 0.8) !important;
}
.op-minor-PSSmd_cyan {
  background-color: hsl(from hsl(177, 100%, 89%) h s l / 0.5) !important;
}
.op-minor-PSSmd_cyan-hi {
  background-color: hsl(from hsl(177, 100%, 89%) h s l / 0.2) !important;
}
.op-minor-PSSmd_cyan-low {
  background-color: hsl(from hsl(177, 100%, 89%) h s l / 0.8) !important;
}
.op-sat-PSSmd_cyan {
  background-color: hsl(from hsl(177, 100%, 64%) h s l / 0.5) !important;
}
.op-sat-PSSmd_cyan-hi {
  background-color: hsl(from hsl(177, 100%, 64%) h s l / 0.2) !important;
}
.op-sat-PSSmd_cyan-low {
  background-color: hsl(from hsl(177, 100%, 64%) h s l / 0.8) !important;
}
.op-dark-PSSmd_cyan {
  background-color: hsl(from hsl(177, 100%, 54%) h s l / 0.5) !important;
}
.op-dark-PSSmd_cyan-hi {
  background-color: hsl(from hsl(177, 100%, 54%) h s l / 0.2) !important;
}
.op-dark-PSSmd_cyan-low {
  background-color: hsl(from hsl(177, 100%, 54%) h s l / 0.8) !important;
}

/* source/colors-css/outline.less */
.ol-PSSmd_cyan {
  outline-color: hsl(177, 100%, 79%) !important;
}
.ol-PSSmd_cyan-active:active {
  outline-color: hsl(177, 100%, 79%) !important;
}
.ol-PSSmd_cyan-hover:hover {
  outline-color: hsl(177, 100%, 79%) !important;
}
.ol-PSSmd_cyan-focus:focus {
  outline-color: hsl(177, 100%, 79%) !important;
}
.ol-light-PSSmd_cyan {
  outline-color: hsl(177, 100%, 94%) !important;
}
.ol-light-PSSmd_cyan-active:active {
  outline-color: hsl(177, 100%, 94%) !important;
}
.ol-light-PSSmd_cyan-hover:hover {
  outline-color: hsl(177, 100%, 94%) !important;
}
.ol-light-PSSmd_cyan-focus:focus {
  outline-color: hsl(177, 100%, 94%) !important;
}
.ol-minor-PSSmd_cyan {
  outline-color: hsl(177, 100%, 89%) !important;
}
.ol-minor-PSSmd_cyan-active:active {
  outline-color: hsl(177, 100%, 89%) !important;
}
.ol-minor-PSSmd_cyan-hover:hover {
  outline-color: hsl(177, 100%, 89%) !important;
}
.ol-minor-PSSmd_cyan-focus:focus {
  outline-color: hsl(177, 100%, 89%) !important;
}
.ol-sat-PSSmd_cyan {
  outline-color: hsl(177, 100%, 64%) !important;
}
.ol-sat-PSSmd_cyan-active:active {
  outline-color: hsl(177, 100%, 64%) !important;
}
.ol-sat-PSSmd_cyan-hover:hover {
  outline-color: hsl(177, 100%, 64%) !important;
}
.ol-sat-PSSmd_cyan-focus:focus {
  outline-color: hsl(177, 100%, 64%) !important;
}
.ol-dark-PSSmd_cyan {
  outline-color: hsl(177, 100%, 54%) !important;
}
.ol-dark-PSSmd_cyan-active:active {
  outline-color: hsl(177, 100%, 54%) !important;
}
.ol-dark-PSSmd_cyan-hover:hover {
  outline-color: hsl(177, 100%, 54%) !important;
}
.ol-dark-PSSmd_cyan-focus:focus {
  outline-color: hsl(177, 100%, 54%) !important;
}

/* source/colors-css/PSSpseudo.less */
.before-bg-PSSmd_cyan::before {
  background: hsl(177, 100%, 79%) !important;
}
.before-fg-PSSmd_cyan::before {
  color: hsl(177, 100%, 79%) !important;
}
.before-bd-PSSmd_cyan::before {
  border-color: hsl(177, 100%, 79%) !important;
}
.after-bg-PSSmd_cyan::after {
  background: hsl(177, 100%, 79%) !important;
}
.after-fg-PSSmd_cyan::after {
  color: hsl(177, 100%, 79%) !important;
}
.after-bd-PSSmd_cyan::after {
  border-color: hsl(177, 100%, 79%) !important;
}
.before-bg-light-PSSmd_cyan::before {
  background: hsl(177, 100%, 94%) !important;
}
.before-fg-light-PSSmd_cyan::before {
  color: hsl(177, 100%, 94%) !important;
}
.before-bd-light-PSSmd_cyan::before {
  border-color: hsl(177, 100%, 94%) !important;
}
.after-bg-light-PSSmd_cyan::after {
  background: hsl(177, 100%, 94%) !important;
}
.after-fg-light-PSSmd_cyan::after {
  color: hsl(177, 100%, 94%) !important;
}
.after-bd-light-PSSmd_cyan::after {
  border-color: hsl(177, 100%, 94%) !important;
}
.before-bg-minor-PSSmd_cyan::before {
  background: hsl(177, 100%, 89%) !important;
}
.before-fg-minor-PSSmd_cyan::before {
  color: hsl(177, 100%, 89%) !important;
}
.before-bd-minor-PSSmd_cyan::before {
  border-color: hsl(177, 100%, 89%) !important;
}
.after-bg-minor-PSSmd_cyan::after {
  background: hsl(177, 100%, 89%) !important;
}
.after-fg-minor-PSSmd_cyan::after {
  color: hsl(177, 100%, 89%) !important;
}
.after-bd-minor-PSSmd_cyan::after {
  border-color: hsl(177, 100%, 89%) !important;
}
.before-bg-sat-PSSmd_cyan::before {
  background: hsl(177, 100%, 64%) !important;
}
.before-fg-sat-PSSmd_cyan::before {
  color: hsl(177, 100%, 64%) !important;
}
.before-bd-sat-PSSmd_cyan::before {
  border-color: hsl(177, 100%, 64%) !important;
}
.after-bg-sat-PSSmd_cyan::after {
  background: hsl(177, 100%, 64%) !important;
}
.after-fg-sat-PSSmd_cyan::after {
  color: hsl(177, 100%, 64%) !important;
}
.after-bd-sat-PSSmd_cyan::after {
  border-color: hsl(177, 100%, 64%) !important;
}
.before-bg-dark-PSSmd_cyan::before {
  background: hsl(177, 100%, 54%) !important;
}
.before-fg-dark-PSSmd_cyan::before {
  color: hsl(177, 100%, 54%) !important;
}
.before-bd-dark-PSSmd_cyan::before {
  border-color: hsl(177, 100%, 54%) !important;
}
.after-bg-dark-PSSmd_cyan::after {
  background: hsl(177, 100%, 54%) !important;
}
.after-fg-dark-PSSmd_cyan::after {
  color: hsl(177, 100%, 54%) !important;
}
.after-bd-dark-PSSmd_cyan::after {
  border-color: hsl(177, 100%, 54%) !important;
}

/* source/colors-css/PSSribbed.less */
:root {
  --ribbed-size: 20px;
  --ribbed-alpha: 0.15;
  --ribbed-angle: -45deg;
}
.ribbed-PSSmd_cyan {
  background:
    hsl(177, 100%, 79%) linear-gradient(
      var(--ribbed-angle),
      rgba(255, 255, 255, var(--ribbed-alpha)) 25%,
      transparent 25%,
      transparent 50%,
      rgba(255, 255, 255, var(--ribbed-alpha)) 50%,
      rgba(255, 255, 255, var(--ribbed-alpha)) 75%,
      transparent 75%,
      transparent) !important;
  background-size: var(--ribbed-size) var(--ribbed-size) !important;
}
.ribbed-light-PSSmd_cyan {
  background:
    hsl(177, 100%, 94%) linear-gradient(
      var(--ribbed-angle),
      rgba(255, 255, 255, var(--ribbed-alpha)) 25%,
      transparent 25%,
      transparent 50%,
      rgba(255, 255, 255, var(--ribbed-alpha)) 50%,
      rgba(255, 255, 255, var(--ribbed-alpha)) 75%,
      transparent 75%,
      transparent) !important;
  background-size: var(--ribbed-size) var(--ribbed-size) !important;
}
.ribbed-minor-PSSmd_cyan {
  background:
    hsl(177, 100%, 89%) linear-gradient(
      var(--ribbed-angle),
      rgba(255, 255, 255, var(--ribbed-alpha)) 25%,
      transparent 25%,
      transparent 50%,
      rgba(255, 255, 255, var(--ribbed-alpha)) 50%,
      rgba(255, 255, 255, var(--ribbed-alpha)) 75%,
      transparent 75%,
      transparent) !important;
  background-size: var(--ribbed-size) var(--ribbed-size) !important;
}
.ribbed-sat-PSSmd_cyan {
  background:
    hsl(177, 100%, 64%) linear-gradient(
      var(--ribbed-angle),
      rgba(255, 255, 255, var(--ribbed-alpha)) 25%,
      transparent 25%,
      transparent 50%,
      rgba(255, 255, 255, var(--ribbed-alpha)) 50%,
      rgba(255, 255, 255, var(--ribbed-alpha)) 75%,
      transparent 75%,
      transparent) !important;
  background-size: var(--ribbed-size) var(--ribbed-size) !important;
}
.ribbed-dark-PSSmd_cyan {
  background:
    hsl(177, 100%, 54%) linear-gradient(
      var(--ribbed-angle),
      rgba(255, 255, 255, var(--ribbed-alpha)) 25%,
      transparent 25%,
      transparent 50%,
      rgba(255, 255, 255, var(--ribbed-alpha)) 50%,
      rgba(255, 255, 255, var(--ribbed-alpha)) 75%,
      transparent 75%,
      transparent) !important;
  background-size: var(--ribbed-size) var(--ribbed-size) !important;
}

/* source/colors-css/gradients.less */
:root {
  --gradient-direction: to right;
  --gradient-position: circle;
}
.gradient-PSSmd_cyan {
  --background:
    linear-gradient(
      var(--gradient-direction),
      hsl(177, 100%, 84%),
      hsl(177, 100%, 59%));
}

/* source/colors-css/stroke.less */
:root {
  --stroke-width: 1px;
}
.stroke-light-PSSmd_cyan {
  color: transparent;
  -webkit-text-stroke: var(--stroke-width) hsl(177, 100%, 94%);
  text-stroke: var(--stroke-width) hsl(177, 100%, 94%);
}
.stroke-minor-PSSmd_cyan {
  color: transparent;
  -webkit-text-stroke: var(--stroke-width) hsl(177, 100%, 89%);
  text-stroke: var(--stroke-width) hsl(177, 100%, 89%);
}
.stroke-PSSmd_cyan {
  color: transparent;
  -webkit-text-stroke: var(--stroke-width) hsl(177, 100%, 79%);
  text-stroke: var(--stroke-width) hsl(177, 100%, 79%);
}
.stroke-sat-PSSmd_cyan {
  color: transparent;
  -webkit-text-stroke: var(--stroke-width) hsl(177, 100%, 64%);
  text-stroke: var(--stroke-width) hsl(177, 100%, 64%);
}
.stroke-dark-PSSmd_cyan {
  color: transparent;
  -webkit-text-stroke: var(--stroke-width) hsl(177, 100%, 54%);
  text-stroke: var(--stroke-width) hsl(177, 100%, 54%);
}

/* source/components/button/PSSbutton.less */
:root {
  --button-border-radius: 4px;
  --button-font-size: 14px;
  --button-background: #ebebeb;
  --button-background-hover: hsl(from var(--button-background) h s calc(l - 10));
  --button-color: #191919;
  --button-disabled-opacity: 0.65;
}
.button-PSSmd_cyan {
  --button-background: hsl(177, 100%, 79%);
  --button-color: #fff;
}
.button-PSSmd_cyan.link {
  --button-color: hsl(177, 100%, 79%) !important;
}
@media (hover: hover) {
  .button-PSSmd_cyan:hover {
    --button-background: hsl(177, 100%, 79%);
    --button-color: #fff;
  }
}
@media (hover: none) {
  .button-PSSmd_cyan:active {
    --button-background: hsl(177, 100%, 79%);
    --button-color: #fff;
  }
}
.button-light-PSSmd_cyan {
  --button-background: hsl(177, 100%, 94%);
  --button-color: #191919;
}
.button-light-PSSmd_cyan.link {
  --button-color: hsl(177, 100%, 94%) !important;
}
@media (hover: hover) {
  .button-light-PSSmd_cyan:hover {
    --button-background: hsl(177, 100%, 94%);
    --button-color: #191919;
  }
}
@media (hover: none) {
  .button-light-PSSmd_cyan:active {
    --button-background: hsl(177, 100%, 94%);
    --button-color: #191919;
  }
}
.button-minor-PSSmd_cyan {
  --button-background: hsl(177, 100%, 89%);
  --button-color: #fff;
}
.button-minor-PSSmd_cyan.link {
  --button-color: hsl(177, 100%, 89%) !important;
}
@media (hover: hover) {
  .button-minor-PSSmd_cyan:hover {
    --button-background: hsl(177, 100%, 89%);
    --button-color: #fff;
  }
}
@media (hover: none) {
  .button-minor-PSSmd_cyan:active {
    --button-background: hsl(177, 100%, 89%);
    --button-color: #fff;
  }
}
.button-sat-PSSmd_cyan {
  --button-background: hsl(177, 100%, 64%);
  --button-color: #fff;
}
.button-sat-PSSmd_cyan.link {
  --button-color: hsl(177, 100%, 64%) !important;
}
@media (hover: hover) {
  .button-sat-PSSmd_cyan:hover {
    --button-background: hsl(177, 100%, 64%);
    --button-color: #fff;
  }
}
@media (hover: none) {
  .button-sat-PSSmd_cyan:active {
    --button-background: hsl(177, 100%, 64%);
    --button-color: #fff;
  }
}
.button-dark-PSSmd_cyan {
  --button-background: hsl(177, 100%, 54%);
  --button-color: #fff;
}
.button-dark-PSSmd_cyan.link {
  --button-color: hsl(177, 100%, 54%) !important;
}
@media (hover: hover) {
  .button-dark-PSSmd_cyan:hover {
    --button-background: hsl(177, 100%, 54%);
    --button-color: #fff;
  }
}
@media (hover: none) {
  .button-dark-PSSmd_cyan:active {
    --button-background: hsl(177, 100%, 54%);
    --button-color: #fff;
  }
}
.button-cobalt {
  --button-background: hsl(215, 100%, 34%);
  --button-color: #fff;
}
.button-cobalt.link {
  --button-color: hsl(215, 100%, 34%) !important;
}
@media (hover: hover) {
  .button-cobalt:hover {
    --button-background: hsl(215, 100%, 34%);
    --button-color: #fff;
  }
}
@media (hover: none) {
  .button-cobalt:active {
    --button-background: hsl(215, 100%, 34%);
    --button-color: #fff;
  }
}

/* source/components/badges/PSSbadges.less */
:root {
  --badge-background: #F8F8F8;
  --badge-color: #191919;
  --badge-border-radius: 4px;
}
.badge-PSSmd_cyan {
  background: hsl(177, 100%, 79%);
  color: #ffffff;
  border-color: hsl(177, 100%, 54%);
}
/* source/components/checkbox/PSScheckbox.less */
:root {
  --checkbox-size: 22px;
  --checkbox-border-radius: 4px;
  --checkbox-color: #575757;
  --checkbox-color-disabled: #c3c3c3;
  --checkbox-background-disabled: #efefef;
  --checkbox-focus-color: #e8e8e8;
}
input[type=checkbox].checkbox-PSSmd_cyan {
  border-color: hsl(177, 100%, 79%);
}
input[type=checkbox].checkbox-PSSmd_cyan::before {
  border-color: hsl(177, 100%, 79%);

/* source/components/chips/PSSchips.less */
:root {
  --chip-background: #F4F4F4;
  --chip-color: #191919;
  --chip-background-hover: #dadada;
  --chip-color-hover: #191919;
  --chip-action-background: #c1c1c1;
  --chip-action-color: #191919;
}
.soft-PSSmd_cyan {
  background: hsl(177, 100%, 94%);
  color: hsl(177, 100%, 54%);
}
.soft-PSSmd_cyan .action {
  background: hsl(177, 100%, 54%);
  color: #ffffff;
}
@media (hover: hover) {
  .soft-PSSmd_cyan:hover {
    background: hsl(177, 100%, 69%);
    color: #ffffff;
  }
}
@media (hover: none) {
  .soft-PSSmd_cyan:active {
    background: hsl(177, 100%, 69%);
    color: #ffffff;
  }
}
.tag.soft-PSSmd_cyan .action {
  background: hsl(177, 100%, 84%);
  color: #000000;
}
.tag.soft-PSSmd_cyan:hover {
  background: hsl(177, 100%, 94%) !important;
  color: hsl(177, 100%, 54%) !important;
}
.tag.normal-PSSmd_cyan .action {
  background: hsl(177, 100%, 69%);
  color: #ffffff;
}
.tag.normal-PSSmd_cyan:hover {
  background: hsl(177, 100%, 79%) !important;
  color: #ffffff;
}
input[type=radio].radio-PSSmd_cyan {
  border-color: hsl(177, 100%, 79%);
}
input[type=radio].radio-PSSmd_cyan::before {
  background-color: hsl(177, 100%, 79%);
  border-color: hsl(177, 100%, 79%);
}
.donut-PSSmd_cyan svg .donut-back {
  stroke: hsl(177, 100%, 84%);
}
.donut-PSSmd_cyan svg .donut-fill {
  stroke: hsl(177, 100%, 79%);
}
.donut-PSSmd_cyan svg .donut-title {
  fill: hsl(177, 100%, 54%);
}

/* source/components/github-box/PSSgithub-box.less */
:root {
  --github-box-border-radius: 6px;
  --github-box-border-color: #d1d9e0;
  --github-box-background: #ffffff;
  --github-box-color: #191919;
  --github-box-header-background: #f7f8fa;
  --github-box-header-color: #191919;
}
.box-PSSmd_cyan {
  border-color: hsl(177, 100%, 79%);
}
.box-PSSmd_cyan .box-header {
  background: hsl(177, 100%, 94%);
  color: hsl(177, 100%, 54%);
}
.box-PSSmd_cyan .prc {
  border-color: hsl(177, 100%, 79%);
}

/* source/components/tabs/PSStabs.less */
:root {
  --tabs-border-radius: 6px;
  --tabs-border-radius-pills: 16px;
  --tabs-background: var(--default-background);
  --tabs-color: var(--default-color);
  --tabs-hamburger-background: transparent;
  --tabs-hamburger-color: #000000;
  --tabs-item-background: var(--default-background);
  --tabs-item-color: var(--default-color);
  --tabs-item-background-hover: #f5f8fe;
  --tabs-item-color-hover: var(--default-color);
  --tabs-item-background-active: #eaeaea;
  --tabs-item-color-active: var(--default-color);
  --tabs-item-marker: var(--color-primary);
  --tabs-item-marker-height: 2px;
  --tabs-item-icon-background: #ffffff;
  --tabs-item-icon-color: #000000;
}
.tabs-PSSmd_cyan {
/*  --tabs-item-marker: hsl(177, 100%, 79%);
  --tabs-item-background-active: #043c45;
  --tabs-item-color-active: #7fffd4;
  --tabs-item-marker-active: #00a9a0;
  --tabs-item-marker: #00a9a0; */

}

/* source/components/progress/PSSprogress.less */
:root {
  --progress-bar-height: 12px;
  --progress-bar-height-ani: -24px;
  --progress-bar-radius: 8px;
  --progress-bar-back-color: #eeeeee;
  --progress-bar-color: #60A917;
  --progress-bar-buffer-color: #CE352C;
  --progress-bar-line-color: #b3d4fc;
  --progress-bar-line-back-color: #004D6F;
  --progress-bar-load-color:
    radial-gradient(
      #a9c0e9 0%,
      #a9c0e9 16%,
      transparent 42%);
  --progress-bar-value-color: #191919;
}
.bar-PSSmd_cyan {
  --progress-bar-color: hsl(177, 100%, 79%);
}
.progress-PSSmd_cyan {
  --progress-bar-color: hsl(177, 100%, 79%);
  --progress-bar-back-color: hsl(177, 100%, 94%);
}

/* source/components/ribbon/PSSribbon.less */
:root {
  --ribbon-background: #757575;
  --ribbon-color: #ffffff;
}  

.pss-timeline {
  --timeline-marker-color: #00a9a0;      /* pss Color */
  --timeline-time-color: #59636e;
  --timeline-color: #191919;
}
