@charset "UTF-8";

/* ≡≡≡ Webfonts ≡≡≡ */

/* === Roboto === */

/* Roboto 300 */

@font-face {
  font-display: swap;
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/roboto/roboto_300.eot");
  src: url("../fonts/roboto/roboto_300.eot?#iefix") format("embedded-opentype"),
    url("../fonts/roboto/roboto_300.woff2") format("woff2"),
    url("../fonts/roboto/roboto_300.woff") format("woff"),
    url("../fonts/roboto/roboto_300.ttf") format("truetype"),
    url("../fonts/roboto/roboto_300.svg#Roboto") format("svg");
}

/* Roboto 400 */

@font-face {
  font-display: swap;
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/roboto/roboto_400.eot");
  src: url("../fonts/roboto/roboto_400.eot?#iefix") format("embedded-opentype"),
    url("../fonts/roboto/roboto_400.woff2") format("woff2"),
    url("../fonts/roboto/roboto_400.woff") format("woff"),
    url("../fonts/roboto/roboto_400.ttf") format("truetype"),
    url("../fonts/roboto/roboto_400.svg#Roboto") format("svg");
}

/* Roboto 700 */

@font-face {
  font-display: swap;
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/roboto/roboto_700.eot");
  src: url("../fonts/roboto/roboto_700.eot?#iefix") format("embedded-opentype"),
    url("../fonts/roboto/roboto_700.woff2") format("woff2"),
    url("../fonts/roboto/roboto_700.woff") format("woff"),
    url("../fonts/roboto/roboto_700.ttf") format("truetype"),
    url("../fonts/roboto/roboto_700.svg#Roboto") format("svg");
}

/* === Noto Serif === */

/* Noto Serif 400 */

@font-face {
  font-display: swap;
  font-family: "Noto Serif";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/noto_serif/noto_serif_400.eot");
  src: url("../fonts/noto_serif/noto_serif_400.eot?#iefix")
      format("embedded-opentype"),
    url("../fonts/noto_serif/noto_serif_400.woff2") format("woff2"),
    url("../fonts/noto_serif/noto_serif_400.woff") format("woff"),
    url("../fonts/noto_serif/noto_serif_400.ttf") format("truetype"),
    url("../fonts/noto_serif/noto_serif_400.svg#NotoSerif") format("svg");
}

/* Noto Serif 700 */

@font-face {
  font-display: swap;
  font-family: "Noto Serif";
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/noto_serif/noto_serif_700.eot");
  src: url("../fonts/noto_serif/noto_serif_700.eot?#iefix")
      format("embedded-opentype"),
    url("../fonts/noto_serif/noto_serif_700.woff2") format("woff2"),
    url("../fonts/noto_serif/noto_serif_700.woff") format("woff"),
    url("../fonts/noto_serif/noto_serif_700.ttf") format("truetype"),
    url("../fonts/noto_serif/noto_serif_700.svg#NotoSerif") format("svg");
}

/* ≡≡≡ Core ≡≡≡ */

:root {
  --tpl-font-main: "Roboto", Arial, sans-serif;
  --tpl-font-sub: "Noto Serif", Arial, sans-serif;
  --tpl-font-size: 1rem;
  --tpl-line-height: 1rem;

  --tpl-spacing-content: 30px;



  --tpl-color-main-a: hsla(195, 100%, 30%, 1);
  --tpl-color-main-b: hsla(195, 100%, 46%, 1);
  --tpl-color-main-c: hsla(195, 100%, 80%, 1);
  --tpl-color-main-d: hsla(195, 100%, 95%, 1);
  --tpl-color-main-e: hsla(195, 100%, 98%, 1);



  /*
  --tpl-color-main-a: #007399;
  --tpl-color-main-b: #00b0eb;
  --tpl-color-main-c: #99e6ff;
  --tpl-color-main-d: #e6f9ff;
  --tpl-color-main-e: #f5fcff;
  */

  --tpl-color-sub-a: #1f1f1f;
  --tpl-color-sub-b: #454545;
  --tpl-color-sub-c: #adadad;
  --tpl-color-sub-d: #cccccc;
  --tpl-color-sub-e: #f2f2f2;
  --tpl-color-sub-f: #f5f5f5;
  --tpl-color-sub-g: #ffffff;

  --tpl-color-extra-1: #c0b4af;

  --tpl-color-mobilemenu-lv0: #f5f5f5;
  --tpl-color-mobilemenu-lv0-active: #ffc9b3;
  --tpl-color-mobilemenu-lv1: #ebebeb;
  --tpl-color-mobilemenu-lv1-active: #fbdcd2;
}

body {
  font-family: var(--tpl-font-main);
  color: var(--tpl-color-sub-a);
  font-size: 16px;
  line-height: 22px;
  font-weight: 300;
  text-align: left;

  overflow-x: hidden; /* Fix for Testimonials */
}

*:focus {
  box-shadow: none !important;
}

*:focus-visible {
  outline: 0px !important;
}

/* === Headings === */

h1:first-child,
.h1:first-child,
h2:first-child,
.h2:first-child,
h3:first-child,
.h3:first-child,
h4:first-child,
.h4:first-child,
h5:first-child,
.h5:first-child,
h6:first-child,
.h6:first-child {
  margin-top: 0px;
  padding-top: 0px;
}

h1,
.h1 {
  font-size: 36px;
  line-height: 46px;
  font-family: var(--tpl-font-sub);
  margin: 0px 0px var(--tpl-spacing-content) 0px;
  font-weight: 400;
  display: block;
}

h2,
.h2 {
  font-size: 30px;
  line-height: 36px;
  font-family: var(--tpl-font-sub);
  margin: 0px 0px calc(var(--tpl-spacing-content) * 0.75) 0px;
  font-weight: 400;
  display: block;
}

h3,
.h3 {
  font-size: 26px;
  line-height: 32px;
  font-family: var(--tpl-font-sub);
  margin: 0px 0px calc(var(--tpl-spacing-content) * 0.5) 0px;
  font-weight: 400;
  display: block;
}

h4,
.h4,
h5,
.h5,
h6,
.h6 {
  font-size: 20px;
  line-height: 26px;
  font-family: var(--tpl-font-sub);
  margin: 0px 0px calc(var(--tpl-spacing-content) * 0.25) 0px;
  font-weight: 400;
  display: block;
}

/* === Text === */

p {
  margin: 0px 0px var(--tpl-spacing-content) 0px;
  font-size: 16px;
  line-height: 22px;
  font-weight: 300;
}

p:last-child {
  margin-bottom: 0px;
}

span {
  font-size: 16px;
  line-height: 22px;
}

a {
  color: var(--tpl-color-main-b);
  transition: color 0.15s ease;
  text-decoration: none;
}

a:hover {
  color: var(--tpl-color-main-a);
  transition: color 0.3s ease;
  text-decoration: none;
}

strong {
  font-weight: 700;
}

/* === Lists === */

ul ul,
ol ol,
ul ol,
ol ul {
  margin: 8px 0px 12px 0px;
}

/* --- Unordered Lists --- */

ul {
  margin: 0px 0px var(--tpl-spacing-content) 0px;
  padding: 0px 0px 0px 0px;
  list-style: none;
}

ul > li {
  position: relative;
  margin: 0px 0px 7px 0px;
  padding-left: 17px;
  font-size: 16px;
  line-height: 22px;
  font-weight: 300;
}

ul > li::before {
  display: inline-block;
  position: absolute;
  top: 7px;
  left: 0px;
  content: "";
  width: 7px;
  height: 7px;
  background: var(--tpl-color-main-b);
  border-radius: 7px;
}

ul > li > ul > li::before {
  background: var(--tpl-color-sub-d);
}

ul > li > ul > li > ul > li::before {
  background: var(--tpl-color-sub-b);
}

/* --- Ordered Lists --- */

ol {
  margin: 0px 0px var(--tpl-spacing-content) 0px;
  padding: 0px 0px 0px 0px;
  list-style: none;
  counter-reset: ol-list;
}

ol > li {
  position: relative;
  margin: 0px 0px 7px 0px;
  padding-left: 24px;
  font-size: 16px;
  line-height: 22px;
  font-weight: 300;
  counter-increment: ol-list;
}

ol > li::before {
  display: inline-block;
  position: absolute;
  top: 0px;
  left: 0px;
  content: counter(ol-list) ". ";
  font-weight: 300;
  color: var(--tpl-color-main-b);
}

ol.alpha-numeric > li::before {
  content: counter(ol-list, lower-alpha) ". ";
}

ol > li > ol > li {
  padding-left: 36px;
}

ol > li > ol > li::before {
  display: inline-block;
  position: absolute;
  top: 0px;
  left: 0px;
  content: counters(ol-list, ".") ". ";
  color: var(--tpl-color-sub-d);
}

ol > li > ol > li > ol > li {
  padding-left: 48px;
}

ol > li > ol > li > ol > li::before {
  color: var(--tpl-color-sub-b);
}

ol.list-steps > li {
  padding-left: 35px;
  margin-bottom: 10px;
}

ol.list-steps > li::before {
  top: 3px;
  font-weight: 700;
  border-radius: 100px;
  display: inline-flex;
  align-items: center;
  justify-content: space-around;
  width: 24px;
  height: 24px;
  color: var(--tpl-color-sub-g);
  background-color: var(--tpl-color-main-a);
  content: counters(ol-list, "");
  font-size: 16px;
  line-height: 16px;
}

/* Menu Fix */

ul.menu,
ul.menu li {
  margin: 0px;
  padding: 0px;
  list-style: none;
}

ul.menu > li::before,
ul.menu > li::after,
ul.menu > li > ul > li::before,
ul.menu > li > ul > li::after,
ul.menu > li > ul > li > ul > li::before,
ul.menu > li > ul > li > ul > li::after {
  display: none;
  position: static;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  width: auto;
  height: auto;
  background: none;
  border-radius: 0px;
}

/* === Lines === */

hr {
  display: block;
  opacity: 0.25;
  width: 100%;
  height: 1px;
  margin: calc(var(--tpl-spacing-content) * 0.5) 0px;
  background-color: var(--tpl-color-sub-a);
  border: 0px;
  color: inherit;
}

/* === Tables === */

.table-wrap {
  margin: 0px 0px var(--tpl-spacing-content) 0px;
}

table {
  margin: 0px 0px var(--tpl-spacing-content) 0px;
  border-radius: 50px;
  border-spacing: 0px;
  border-collapse: separate;
}

.table-wrap > table {
  margin: 0px;
}

table th {
  padding: 12px 20px;
  background: var(--tpl-color-main-c);
  font-size: 16px;
  line-height: 22px;
  font-weight: 700;
  color: var(--tpl-color-sub-a);
  border: 0px;
}

table td {
  padding: 18px 20px;
  background: #ffffff;
  font-size: 16px;
  line-height: 22px;
  font-weight: 300;
  border: 0px;
  border-top: 2px solid #f1f1f1;
}

table thead tr:first-child > *:first-child {
  border-radius: 4px 0px 0px 4px;
}

table thead tr:first-child > *:last-child {
  border-radius: 0px 4px 4px 0px;
}

table tbody tr:first-child > * {
  border-top: 0px;
}

/* === Images === */

figure.image img {
  max-width: 1200px;
  box-shadow: 0px 0px 30px hsla(0, 0%, 0%, 0.1);
  object-fit: cover;
  object-position: center;
  border-radius: 20px;
  width: 100%;
}

figure.image.no-border img {
  border-radius: 00px;
}

figure.image.no-shadow img {
  box-shadow: none;
  border-radius: 00px;
}

/* === Figures === */

figure {
  display: inline-block;
  margin: 0px 0px var(--tpl-spacing-content) 0px;
}

figcaption {
  margin: 0px;
  padding: 6px 0px 0px 0px;
  font-size: 14px;
  line-height: 20px;
  font-weight: 300;
  color: var(--tpl-color-sub-c);
  text-align: right;
  position: relative;
  z-index: 990;
}

/* === Forms === */

legend {
  margin: 0px 0px var(--tpl-spacing-content) 0px;
}

/* === Blockquotes === */

blockquote {
  margin: 0px 0px var(--tpl-spacing-content) 0px;
}

/* === Pre === */

pre {
  margin: 0px 0px var(--tpl-spacing-content) 0px;
}

/* === Sonstiges === */
section,
legend {
  line-height: 1.2;
}

/* === Maxwidths === */

.maxwidth {
  max-width: 1200px;
  margin: 0 auto;
}

.maxwidth-large {
  max-width: 1400px;
  margin: 0 auto;
}

/* === Buttons === */

.btn-wip {
  --tpl-btn-font-family: var(--tpl-font-main);
  --tpl-btn-font-size: 18px;
  --tpl-btn-font-weight: 700;
  --tpl-btn-line-height: 24px;
  --tpl-btn-color: var(--tpl-color-main-a);
  --tpl-btn-hover-color: #ffffff;
  --tpl-btn-bg: var(--tpl-color-main-c);
  --tpl-btn-hover-bg: var(--tpl-color-main-b);
  --tpl-btn-border-width: 2px;
  --tpl-btn-border-color: var(--tpl-color-main-c);
  --tpl-btn-hover-border-color: var(--tpl-color-main-b);
  --tpl-btn-border-radius: 5px;
  --tpl-btn-box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
  --tpl-btn-disabled-opacity: 0.65;
  --tpl-btn-focus-box-shadow: none;
  --tpl-btn-padding: 5px 24px;
  display: inline-block;
  position: relative;
  padding: var(--tpl-btn-padding);
  background-color: var(--tpl-btn-bg);
  border: var(--tpl-btn-border-width) solid var(--tpl-btn-border-color);
  border-radius: var(--tpl-btn-border-radius);
  cursor: pointer;
  font-size: var(--tpl-btn-font-size);
  line-height: var(--tpl-btn-line-height);
  font-weight: var(--tpl-btn-font-weight);
  font-family: var(--tpl-btn-font-family);
  color: var(--tpl-btn-color);
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  transition: color 0.15s ease, background 0.15s ease, border 0.15s ease;
  user-select: none;
  box-shadow: var(--tpl-btn-box-shadow);
}

.btn-wip:hover {
  background-color: var(--tpl-btn-hover-bg);
  border-color: var(--tpl-btn-hover-border-color);
  color: var(--tpl-btn-hover-color);
  transition: color 0.3s ease, background 0.3s ease, border 0.3s ease;
}

.btn-wip.btn-wip-white {
  --tpl-btn-font-family: var(--tpl-font-main);
  --tpl-btn-font-size: 18px;
  --tpl-btn-font-weight: 700;
  --tpl-btn-line-height: 24px;
  --tpl-btn-color: var(--tpl-color-main-a);
  --tpl-btn-hover-color: var(--tpl-color-main-a);
  --tpl-btn-bg: var(--tpl-color-sub-g);
  --tpl-btn-hover-bg: var(--tpl-color-sub-e);
  --tpl-btn-border-width: 2px;
  --tpl-btn-border-color: var(--tpl-color-sub-g);
  --tpl-btn-hover-border-color: var(--tpl-color-sub-e);
  --tpl-btn-border-radius: 5px;
  --tpl-btn-box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
  --tpl-btn-disabled-opacity: 0.65;
  --tpl-btn-focus-box-shadow: none;
}

.btn-wip.btn-small {
  --tpl-btn-padding: 4px 16px;
  --tpl-btn-font-size: 14px;
  --tpl-btn-line-height: 20px;
}

/* === Text-Align === */

.text-center {
  text-align: center !important;
}

.text-end {
  text-align: right !important;
}

/* === Info-Box === */

.box-info {
  margin: 0px 0px 30px 0px;
  padding: 16px 20px;
  background: #fafafa;
  border-left: 14px solid var(--tpl-color-main-d);
  border-radius: 4px;
}

.box-info > *:last-child {
  margin-bottom: 0px;
}

/* --- Youtube --- */

.youtube-wrap {
  position: relative;
  height: 0;
  padding-top: 0;
  padding-bottom: 56.25%;
  overflow: hidden;
}

.youtube-wrap iframe,
.youtube-wrap object,
.youtube-wrap embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* --- Vimeo --- */

.vimeo-wrap {
  padding: 56.25% 0 0 0;
  position: relative;
}

.vimeo-wrap iframe,
.vimeo-wrap object,
.vimeo-wrap embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* ≡≡≡ Template ≡≡≡ */

/* === Banner ===  */


#banner {
  padding-bottom: 70px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: inset 0px 3px 30px rgba(0, 0, 0, 0.1);
}

.home #banner,
.shop-product #banner,
.empty-landingpage #banner {
  padding-bottom: 0px;
}

body.shop-product {
  background-image: url(../images/bg_page_product.svg);
  background-size: 100% auto;
  background-position: 0px 140px;
  background-repeat: no-repeat;
}

/* === Topbar === */

#topbar {
  position: relative;
  z-index: 999;
  padding-top: 7px;
  padding-bottom: 7px;
  background: #ffffff;
  border-bottom: 1px solid #f2f2f2;
}

#topbar .inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* --- Links --- */

#topbar .links-wrap {
  display: flex;
  align-items: center;
}

#topbar .links-wrap a {
  position: relative;
  padding-left: 23px;
  cursor: pointer;
  margin-right: 18px;
  font-size: 16px;
  line-height: 22px;
  color: var(--tpl-color-sub-c);
  transition: color 0.15s ease;
  font-weight: 400;
}

#topbar .links-wrap a:hover {
  cursor: pointer;
  color: var(--tpl-color-main-b);
  transition: color 0.3s ease;
}

#topbar .links-wrap .fa {
  display: flex;
  align-items: center;
  justify-content: space-around;
  position: absolute;
  top: 2px;
  left: 0px;
  width: 15px;
  height: 15px;
  background: var(--tpl-color-sub-c);
  border-radius: 17px;
  font-size: 10px;
  line-height: 22px;
  color: #ffffff;
  transition: background 0.15s ease;
}

#topbar .links-wrap .phone .fa {
  font-size: 8px;
  line-height: 22px;
}

#topbar .links-wrap a:hover .fa {
  cursor: pointer;
  background: var(--tpl-color-main-b);
  transition: background 0.3s ease;
}

/* --- Search --- */

#topbar .mod-finder .input-group {
  display: flex;
  align-items: stretch;
}

#topbar .mod-finder .input-searchword {
  width: 230px;
  margin-right: 6px;
  padding: 3px 6px;
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: 3px !important;
  font-size: 16px;
  line-height: 22px;
  color: var(--tpl-color-sub-b);
  text-align: left;
  transition: background 0.15s ease, border 0.15s ease;
}

#topbar .mod-finder .input-searchword.empty {
  text-align: right;
}

#topbar .mod-finder .input-searchword.focused {
  background: var(--tpl-color-sub-f);
  border: 1px solid #cccccc;
  text-align: left;
  transition: background 0.3s ease, border 0.3s ease;
}

#topbar .mod-finder .btn-wip {
  --tpl-btn-font-family: var(--tpl-font-main);
  --tpl-btn-font-size: 16px;
  --tpl-btn-font-weight: 400;
  --tpl-btn-line-height: 22px;
  --tpl-btn-color: var(--tpl-color-sub-c);
  --tpl-btn-hover-color: #ffffff;
  --tpl-btn-bg: #ffffff;
  --tpl-btn-hover-bg: var(--tpl-color-main-b);
  --tpl-btn-border-width: 0px;
  --tpl-btn-border-color: #ffffff;
  --tpl-btn-hover-border-color: #ffffff;
  --tpl-btn-border-radius: 5px;
  --tpl-btn-box-shadow: none;
  --tpl-btn-disabled-opacity: 0.65;
  --tpl-btn-focus-box-shadow: none;
  --tpl-btn-padding: 3px 6px;
}

/* === Navbar === */

#navbar {
  position: relative;
  z-index: 998;
  background: #ffffff;
  box-shadow: 0px 3px 30px rgba(0, 0, 0, 0.1);
}

.empty-landingpage #navbar {
  box-shadow: none;
}

#navbar.is-stuck {
  position: fixed;
  top: 0px;
  right: 0px;
  left: 0px;
  width: 100%;
}

#navbar > .inner {
  display: flex;
  align-items: center;
}

/* --- Logo --- */

#navbar .logo-wrap {
  width: 100%;
  max-width: 160px;
  margin-right: 64px;
  text-align: center;
}

#navbar.is-stuck .logo-wrap {
  padding-bottom: 0px;
  transition: padding 0.3s ease;
}

#logo {
  display: inline-block;
  height: 60px;
  margin: 0 auto;
  transition: height 0.15s ease 0.15s;
}

.is-stuck #logo {
  height: 24px;
  transition: height 0.3s ease;
}

#logo svg {
  display: block;
  height: 100%;
  margin: 0 auto;
}

#logo svg .full-version {
  opacity: 1;
  transition: opacity 0.15s ease 0.15s;
}

.is-stuck #logo .full-version {
  opacity: 0;
  transition: opacity 0.3s ease;
}

#logo .small-version {
  opacity: 0;
  transition: opacity 0.15s ease;
}

.is-stuck #logo .small-version {
  opacity: 1;
  transition: opacity 0.3s ease 0.3s;
}

/* --- Mainmenu --- */

#navbar .mainmenu-wrap {
  margin-right: 5px;
  margin-left: auto;
}

#mainmenu {
  padding-top: 36px;
  transition: padding 0.15s ease;
}

.is-stuck #mainmenu {
  padding-top: 12px;
}

#mainmenu ul {
  margin: 0px;
  padding: 0px;
  list-style: none;
}

/* Level 0 */

#mainmenu .lv-0 {
  display: flex;
  align-items: center;
}

#mainmenu .lv-0 > li {
  position: relative;
  margin: 0px 7px 0px 0px;
  padding-bottom: 36px;
  transition: padding 0.15s ease;
}

.is-stuck #mainmenu .lv-0 > li {
  padding-bottom: 15px;
  transition: padding 0.3s ease;
}

#mainmenu .lv-0 > li > .menu-link {
  padding: 5px 14px;
  background: #ffffff;
  border-radius: 10px;
  font-size: 18px;
  line-height: 24px;
  color: var(--tpl-color-sub-a);
  transition: background 0.15s ease;
  white-space: nowrap;
}

#mainmenu .lv-0 > li > .menu-link:hover,
#mainmenu .lv-0 > li.active > .menu-link {
  background: var(--tpl-color-main-d);
  transition: background 0.15s ease;
}

#mainmenu .lv-0 > li::before {
  display: none;
}

#mainmenu .lv-0 > li.parent > .menu-link {
  position: relative;
  padding-right: 32px;
}

#mainmenu .lv-0 > li.parent > .menu-link::after {
  position: absolute;
  top: calc(50% - 7px);
  right: 12px;
  content: "";
  width: 9px;
  height: 9px;
  border-bottom: 2px solid var(--tpl-color-sub-a);
  border-left: 2px solid var(--tpl-color-sub-a);
  transform: rotate(-45deg);
  transform-origin: 50% 50%;
}

/* --- Level 1 --- */

#mainmenu .lv-1 {
  position: absolute;
  top: 100%;
  left: 0px;
  z-index: 997;
  min-width: 100%;
  border-radius: 0px 0px 10px 10px;
  box-shadow: 0px 8px 10px rgba(0, 0, 0, 0.18);
  white-space: pre;
}

#mainmenu .lv-1 > li {
  margin: 0px;
}

#mainmenu .lv-1 > li::before {
  display: none;
}

#mainmenu .lv-1 > li > .menu-link {
  display: block;
  padding: 6px 22px;
  background: #ffffff;
  font-size: 16px;
  line-height: 22px;
  font-weight: 300;
  color: var(--tpl-color-sub-b);
  transition: background 0.15s ease;
}

#mainmenu .lv-1 > li > .menu-link:hover,
#mainmenu .lv-1 > li.active > .menu-link {
  background: var(--tpl-color-main-d);
  transition: background 0.3s ease;
}

#mainmenu .lv-1 > li:last-child > .menu-link {
  border-radius: 0px 0px 10px 10px;
}

/* Submenu 1 Hover */

@media (min-width: 1199.99px) {
  #mainmenu .lv-1 {
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s ease;
  }

  #mainmenu .lv-1::before {
    position: absolute;
    top: -4px;
    right: 0px;
    left: 0px;
    content: "";
    width: 100%;
    height: 4px;
    background: #ffffff;
  }

  #mainmenu .lv-0 > li.parent:hover > .lv-1 {
    visibility: visible;
    opacity: 1;
  }
}

/* === Menu Togglers === */

#mainmenu-toggler {
  width: 35px;
  height: 28px;
  margin-left: auto;
  padding: 5px;
  cursor: pointer;
  display: none;
}

#mainmenu-toggler .bar {
  display: block;
  width: 24px;
  height: 3px;
  margin-bottom: 4px;
  background: var(--tpl-color-sub-a);
  border-radius: 2px;
  line-height: 0px;
  transition: background 0.15s ease;
}

#mainmenu-toggler .bar:last-child {
  margin-bottom: 0px;
}

#mainmenu-toggler.alive .bar {
  background: var(--tpl-color-main-a);
  transition: background 0.3s ease;
}

/* --- Warenkorb --- */

#navbar .warenkorb-wrap {
  margin-left: auto;
}

#navbar .shopping-cart .indicator {
  font-family: "Roboto";
  font-weight: bold;
}

/* === Footerbar === */

#footerbar {
  padding-top: 40px;
  padding-bottom: 20px;
  background: #ffffff;
}

#footerbar > div {
  padding-top: 25px;
  padding-bottom: 25px;
  border-bottom: 1px solid #f1f1f1;
}

#footerbar > div:last-child {
  border-bottom: 0px;
}

#footerbar .module-headline {
  margin-bottom: 15px;
}

#footerbar .module-headline .headline {
  font-size: 16px;
  line-height: 22px;
  font-weight: 700;
  font-family: var(--tpl-font-main);
}

/* --- Top --- */

#footerbar .top > div > .inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

#footerbar .top .module-pseudo {
  flex: 0 0 auto;
  width: auto;
}

/* Payment Methods */

#footerbar .mod-paymentmethods .payment-methods {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
}

#footerbar .mod-paymentmethods .payment-methods > .item {
  margin-right: 16px;
  text-align: center;
}

#footerbar .mod-paymentmethods .payment-methods > .item:last-child {
  margin-right: 0px;
}

/* Hotline */

#footerbar .mod-hotline {
  text-align: right;
}

#footerbar .mod-hotline a {
  position: relative;
  padding-left: 47px;
  font-size: 24px;
  line-height: 34px;
  font-family: var(--tpl-font-sub);
  color: var(--tpl-color-sub-a);
  padding-top: 8px;
}

#footerbar .mod-hotline a:hover {
  color: var(--tpl-color-main-a);
}

#footerbar .mod-hotline a .fa {
  display: flex;
  align-items: center;
  justify-content: space-around;
  position: absolute;
  top: 8px;
  left: 0px;
  width: 37px;
  height: 37px;
  background: var(--tpl-color-main-a);
  border-radius: 37px;
  font-size: 20px;
  line-height: 20px;
  color: #ffffff;
}

/* --- Center --- */

/* Quicklinks */

#footerbar .center .mod-menu .lv-0, #footerbar .center .mod-si-footer-elearning .lv-0 {
  margin: 0px;
  padding: 0px;
  list-style: none;
    max-width:300px;
}

#footerbar .center .mod-menu .lv-0 > li, #footerbar .center .mod-si-footer-elearning .lv-0 > li {
  margin: 0px 0px 6px 0px;
  font-size: 14px;
  line-height: 20px;
}

#footerbar .center .mod-menu .lv-0 > li:last-child, #footerbar .center .mod-si-footer-elearning .lv-0 > li:last-child {
  margin-bottom: 0px;
}

#footerbar .center .mod-menu .lv-0 > li > .menu-link, #footerbar .center .mod-si-footer-elearning .lv-0 > li > .menu-link {
  font-weight: 300;
  color: var(--tpl-color-sub-b);
}

#footerbar .center .mod-menu .lv-0 > li > .menu-link:hover, #footerbar .center .mod-si-footer-elearning .lv-0 > li > .menu-link:hover {
  color: var(--tpl-color-main-a);
}






/* Newsflash */

#footerbar .center .mod-articles-news .lv-0 {
  margin: 0px;
  padding: 0px;
  list-style: none;
}

#footerbar .center .mod-articles-news .lv-0 > li {
  margin: 0px 0px 6px 0px;
  font-size: 14px;
  line-height: 20px;
  padding: 0px;
}

#footerbar .center .mod-articles-news .lv-0 > li::before {
  display: none;
}

#footerbar .center .mod-articles-news .lv-0 > li:last-child {
  margin-bottom: 0px;
}

#footerbar .center .mod-articles-news .lv-0 > li > a {
  font-weight: 300;
  color: var(--tpl-color-sub-b);
}

#footerbar .center .mod-articles-news .lv-0 > li > a:hover {
  color: var(--tpl-color-main-a);
}

/* Social Media */

#footerbar .mod-socialmedia {
  margin-left: 45px;
  text-align: right;
}

#footerbar .mod-socialmedia .social-media {
  display: flex;
  align-items: center;
}

#footerbar .mod-socialmedia .social-media > .item {
  margin-right: 12px;
}

#footerbar .mod-socialmedia .social-media > .item:first-child {
  margin-left: auto;
}

#footerbar .mod-socialmedia .social-media > .item:last-child {
  margin-right: 0px;
}

#footerbar .mod-socialmedia .social-media a {
  opacity: 1;
  width: 43px;
  height: 43px;
  transition: opacity 0.3s ease, filter 0.3s ease;
  filter: grayscale(0%);
}

#footerbar .mod-socialmedia .social-media a:hover {
  opacity: 0.5;
  filter: grayscale(100%);
}

#footerbar .mod-socialmedia .social-media svg {
  width: 100%;
}

/* --- Bottom --- */

#footerbar .bottom {
  padding-top: 25px;
  padding-bottom: 12px;
}

/* Siegel */

#siegel {
  text-align: right;
  padding: 30px 0px;
}

#siegel .siegel-reihe {
  display: flex;
  align-items: flex-start;
}

#siegel .siegel-reihe > .siegel {
  text-align: center;
  margin-right: 25px;
}

#siegel .siegel-reihe > .siegel:first-child {
  margin-left: auto;
}

#siegel .siegel-reihe > .siegel:last-child {
  margin-right: auto;
}

#siegel figure {
  margin: 0px;
}

#siegel img {
  object-fit: contain;
  object-position: center;
}

#siegel .info {
  font-size: 11px;
  line-height: 15px;
  margin-top: 10px;
  margin-bottom: 0px;
}

#siegel .tuev img {
  max-width: 400px;
  width: 100%;
}

/* Copyright */

#copyright p {
  font-size: 12px;
  line-height: 18px;
  color: var(--tpl-color-sub-c);
  text-align: center;
}

#copyright p:last-child {
  margin: 0px;
}

/* Legalsmenu */

#legalsmenu {
  padding-top: 25px;
  padding-bottom: 12px;
}

#legalsmenu .lv-0 {
  display: flex;
  align-items: center;
  margin: 0px;
  padding: 0px;
  list-style: none;
}

#legalsmenu .lv-0 > li {
  display: inline-block;
  position: relative;
  margin: 0px 8px 0px 0px;
  padding-right: 9px;
  font-size: 12px;
  line-height: 18px;
}

#legalsmenu .lv-0 > li:first-child {
  margin-left: auto;
}

#legalsmenu .lv-0 > li:last-child {
  margin-right: auto;
}

#legalsmenu .lv-0 > li::after {
  display: inline-block;
  position: absolute;
  top: 2px;
  right: 0px;
  content: "";
  width: 1px;
  height: 14px;
  background: #cccccc;
}

#legalsmenu .lv-0 > li:last-child::after {
  display: none;
}

#legalsmenu .lv-0 > li > .menu-link {
  font-weight: 300;
  color: var(--tpl-color-sub-b);
}

#legalsmenu .lv-0 > li > .menu-link:hover {
  color: var(--tpl-color-main-a);
}

/* === Blog === */

#blog {
  padding-top: 50px;
}

#blog .category-intro {
  display: flex;
  align-items: flex-start;
  margin-bottom: 40px;
}

#blog .category-intro .left {
  flex: 1 1 100%;
}

#blog .category-intro .right {
  flex: 0 0 380px;
  margin-left: 58px;
}

#blog .page-header {
  margin-bottom: 20px;
}

#blog .page-header > h1 {
  margin-bottom: 20px;
}

#blog .page-header > *:last-child {
  margin-bottom: 0px;
}

#blog .category-intro .right figure {
  margin-bottom: 0px;
}

#blog .category-intro .right img {
  border-radius: 20px;
  box-shadow: 0px 0px 85px rgba(0, 0, 0, 0.1);
  width: 380px;
  height: 340px;
  object-fit: cover;
  object-position: center;
}

#blog .category-tags {
  margin-bottom: 50px;
}

#blog .category-tags .tags {
  display: flex;
  flex-wrap: wrap;
  margin: 0px;
  padding: 0px;
}

#blog .category-tags .tags > li {
  margin: 0px 10px 10px 0px;
  padding: 0px;
}

#blog .category-tags .tags > li::before {
  display: none;
}

#blog .category-tags .tags a {
  display: inline-block;
  padding: 6px 14px;
  background: var(--tpl-color-main-d);
  border-radius: 4px;
  font-size: 16px;
  line-height: 24px;
  color: var(--tpl-color-sub-a);
  transition: background 0.15s ease;
}

#blog .category-tags .tags a:hover,
#blog .category-tags .tags a.active {
  background: var(--tpl-color-main-c);
}

/* --- Blog-Item --- */

#blog .item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 105px;
  gap: 20px;
}

#blog .item .imageside {
  flex: 0 1 450px;
  position: relative;
}

#blog .item .imageside figure {
  position: relative;
  z-index: 2;
}

#blog .item .imageside img {
  box-shadow: 0px 0px 85px rgba(0, 0, 0, 0.1);
  max-width: 450px;
  width: 100%;
  height: 300px;
  object-fit: cover;
  object-position: center;
  border-radius: 20px;
}

#blog .item .introside {
  flex: 0 1 670px;
}

#blog .item .tag-wrap {
  margin: 0px 0px 8px 0px;
}

#blog .item .tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 0px;
  padding: 0px;
}

#blog .item .tags > li {
  margin-right: 12px;
  padding: 0px;
}

#blog .item .tags > li::before {
  display: none;
}

#blog .item .tags a {
  font-size: 14px;
  line-height: 20px;
  padding: 3px 7px 2px 7px;
  border: 1px solid var(--tpl-color-main-b);
  border-radius: 4px;
  color: var(--tpl-color-main-a);
  transition: 0.3s ease;
}

#blog .item .tags a:hover {
  border: 1px solid var(--tpl-color-sub-c);
  color: var(--tpl-color-sub-b);
}

#blog .item .title-wrap {
  margin-bottom: 12px;
}

#blog .item .title {
  font-size: 28px;
  line-height: 32px;
  font-family: var(--tpl-font-sub);
  color: var(--tpl-color-sub-a);
}

#blog .item .title:hover {
  color: var(--tpl-color-main-a);
}

#blog .item .introtext-wrap {
  margin-bottom: 15px;
}

/* Special */
#blog .item:nth-child(even) .imageside {
  order: 2;
}

#blog .item:nth-child(even) .introside {
  order: 1;
}

#blog .item:nth-child(1) .imageside::before,
#blog .item:nth-child(4) .imageside::before {
  display: inline-block;
  position: absolute;
  z-index: 1;
  content: "";
  width: 238px;
  height: 245px;
  background-image: url(../images/tupfer_color_main_4.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

#blog .item:nth-child(1) .imageside::before {
  bottom: -10px;
  left: -100px;
  transform: rotate(176deg);
}

#blog .item:nth-child(4) .imageside::before {
  top: -80px;
  right: -110px;
  transform: rotate(-25deg);
}

/* === Pagination === */

.pagination-wrap {
  display: flex;
  align-items: center;
  margin: 0px 0px 80px 0px;
}

.pagination-wrap .pagination {
  margin-right: auto;
}

.pagination-wrap .counter {
  margin-left: auto;
}

.pagination-wrap .counter {
  font-size: 16px;
  line-height: 26px;
  color: var(--tpl-color-sub-a);
}

.pagination {
  display: flex;
  align-items: center;
  margin: 0px;
  padding: 0px;
}

.pagination > li {
  padding: 0px;
}

.pagination > .page-item {
  margin-right: 4px;
  margin-bottom: 0px;
}

.pagination > .page-item::before {
  display: none;
}

.pagination .page-link {
  display: flex;
  align-items: center;
  justify-content: space-around;
  min-width: 32px;
  height: 34px;
  background: rgba(0, 0, 0, 0);
  border-radius: 4px;
  font-size: 16px;
  line-height: 26px;
  font-weight: bold;
  color: var(--tpl-color-sub-c);
  transition: background 0.15s ease, color 0.15s ease;
  border: 0px;
  padding: 0px;
  margin-left: 0px;
}

.pagination .page-link:hover,
.pagination .active .page-link {
  background-color: var(--tpl-color-main-c);
  color: var(--tpl-color-sub-a);
  transition: background 0.3s ease, color 0.3s ease;
}

.pagination .disabled .page-link,
.pagination .disabled .page-link:hover {
  opacity: 0.25;
  background: rgba(0, 0, 0, 0);
  cursor: default;
  color: var(--tpl-color-sub-c);
}

/* === Article === */

#article {
  padding-bottom: 50px;
  padding-top: 70px;
}

#article > .inner {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
}

#article > .inner > .left > :last-child,
#article > .inner > .right > :last-child {
  margin-bottom: 0px;
}

#article > .inner > .left {
  flex: 1 0 0%;
  order: 1;
  position: relative;
  width: 100%;
  max-width: 100%;
}

#article > .inner > .right {
  flex: 0 0 auto;
  order: 2;
  padding-left: 60px;
  max-width: 400px;
  width: 100%;
}

#article > .inner .author-mobile {
  display: none;
}

#article .row.gutter-1 {
  --bs-gutter-x: 30px;
}

#article .row.gutter-2 {
  --bs-gutter-x: 60px;
}

#article .row.gutter-1 {
  --bs-gutter-x: 30px;
}

#article .row.gutter-2 {
  --bs-gutter-x: 60px;
}

#article .page-header,
#article .page-header > h1 {
  margin-bottom: 40px;
}

#article.news .page-header,
#article.news .page-header > h1 {
  margin-bottom: 20px;
}

#article .page-header > *:last-child {
  margin-bottom: 0px;
}

/* Im Content soll die Schrift kleiner sein */
/*#article p,
#article ul > li,
#article ol > li{
	font-size: 16px;
	line-height: 22px;
}*/

#article .leftside > .row {
  margin-bottom: var(--tpl-spacing-content);
}

#article .row > div > p:last-child {
  margin-bottom: var(--tpl-spacing-content);
}

#article .row.row-vorteile {
  align-items: stretch;
}

#article .row.row-vorteile > div {
  height: auto;
  padding-bottom: var(--tpl-spacing-content);
}

#article .row.row-vorteile > div > div {
  height: 100%;
}

#article .row.row-vorteile .image-wrap {
  margin-top: 10px;
  margin-bottom: 20px;
}

#article .row.row-vorteile .image-wrap img {
  width: 100px;
  height: 100px;
  max-width: 100px;
  max-height: 100px;
  object-fit: contain;
  object-position: center;
}

/* --- Social Share --- */

#article-share {
  position: absolute;
  top: 0px;
  left: -50px;
  width: 28px;
}

#article-share a {
  display: flex;
  align-items: center;
  justify-content: space-around;
  width: 28px;
  height: 28px;
  margin-bottom: 9px;
  background: var(--tpl-color-sub-d);
  border-radius: 4px;
  font-size: 16px;
  line-height: 16px;
  color: #ffffff;
  transition: background 0.15s ease;
}

#article-share a:hover {
  cursor: pointer;
  transition: background 0.3s ease;
}

#article-share a:last-child {
  margin-bottom: 0px;
}

#article-share a.facebook:hover {
  background: #3b5897;
}

#article-share a.twitter:hover {
  background: #53abee;
}

#article-share a.whatsapp:hover {
  background: #4ec247;
}

#article-share a.linkedin:hover {
  background: #007ab3;
}

/* --- Statblock --- */

#article-statblock {
  margin-bottom: 16px;
  font-size: 16px;
  line-height: 22px;
  color: var(--tpl-color-sub-b);
}

#article-statblock > .inner {
  display: flex;
  align-items: flex-start;
  margin-bottom: 10px;
}

#article-statblock > .inner > div {
  position: relative;
  margin-right: 10px;
  padding-right: 11px;
}

#article-statblock > .inner > div:last-child {
  margin-right: 0px;
  padding-right: 0px;
}

#article-statblock > .inner > div::after {
  display: inline-block;
  position: absolute;
  top: 4px;
  right: 0px;
  content: "";
  width: 1px;
  height: 16px;
  background: var(--tpl-color-sub-c);
}

#article-statblock > .inner > div:last-child::after {
  display: none;
}

/* --- Datum & Lesezeit --- */

#article-statblock .item.date,
#article-statblock .item.lesezeit {
  flex: 0 0 auto;
  position: relative;
  padding-left: 23px;
}

#article-statblock .item.date svg,
#article-statblock .item.lesezeit svg {
  position: absolute;
  top: 5px;
  left: 0px;
  width: 15px;
  height: 15px;
}

#article-statblock .item.date span,
#article-statblock .item.lesezeit span {
  vertical-align: middle;
}

/* --- Tags --- */

#article-statblock .tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 0px;
  padding: 0px;
  list-style: none;
}

#article-statblock .tags > li {
  margin: 0px 8px 8px 0px;
  padding: 0px;
}

#article-statblock .tags > li:last-child {
  margin-right: 0px;
}

#article-statblock .tags > li::before {
  display: none;
}

#article-statblock .tags > li > a {
  padding: 3px 7px 2px 7px;
  border: 1px solid var(--tpl-color-main-b);
  border-radius: 4px;
  font-size: 14px;
  line-height: 20px;
  color: var(--tpl-color-main-a);
  transition: 0.3s ease;
}

#article-statblock .tags > li > a:hover {
  border: 1px solid var(--tpl-color-sub-c);
  color: var(--tpl-color-sub-b);
}

/* --- Full Image --- */

#article .image-fulltext,
#article .image-fulltext img {
  width: 100%;
}

#article .image-fulltext img {
  border-radius: 20px;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
}

/* --- Intro Image --- */

#article .image-intro {
  margin-bottom: 40px;
}

#article .image-intro img {
  border-radius: 20px;
  box-shadow: 0px 0px 85px rgba(0, 0, 0, 0.1);
  width: 100%;
    min-width:340px;
  max-width: 400px;
  height: auto;
  object-fit: cover;
  object-position: center;
}

/* --- Block --- */

#article .block,
.information .block {
  margin-bottom: 40px;
  padding: 31px;
  background-color: var(--tpl-color-main-d);
  border-radius: 20px;
}

#article .block .headline-wrap,
.information .block .headline-wrap {
  margin-bottom: 20px;
}

#article .block .headline,
.information .block .headline {
  font-size: 20px;
  line-height: 26px;
  font-family: var(--tpl-font-sub);
}

#article .block .content > *:last-child {
  margin-bottom: 0px;
}

/* --- Inhaltsverzeichnis-Block --- */

#article .block-iv .headline-wrap {
  margin-bottom: 0px;
}

#article .block-iv .content {
  display: block;
  padding-top: 20px;
}

#article .block-iv ol,
#article .block-iv ol {
  margin-bottom: 0px;
}

#article .block-iv ol > li {
  margin-bottom: 12px;
  font-size: 14px;
  line-height: 20px;
}

#article .block-iv ol > li:last-child {
  margin-bottom: 0px;
}

#article .block-iv .iv-link {
  cursor: pointer;
  font-weight: 300;
  color: var(--tpl-color-sub-b);
  transition: color 0.15s ease;
  font-size: 14px;
  line-height: 20px;
}

#article .block-iv .iv-link:hover {
  color: var(--tpl-color-main-a);
  transition: color 0.3s ease;
}

#article .block-iv .iv-button {
  width: 35px;
  height: 28px;
  margin-left: auto;
  padding: 5px;
  cursor: pointer;
  display: none;
}

#article .block-iv .iv-button .bar {
  display: block;
  width: 24px;
  height: 3px;
  margin-bottom: 4px;
  background: var(--tpl-color-sub-a);
  border-radius: 2px;
  line-height: 0px;
  transition: background 0.15s ease;
}

#article .block-iv .iv-button .bar:last-child {
  margin-bottom: 0px;
}

#article .block-iv .iv-button.alive .bar {
  background: var(--tpl-color-main-a);
  transition: background 0.3s ease;
}

/* --- Author-Block --- */

#article .block-author .headline-wrap {
  text-align: center;
}

#article .block-author .image-wrap {
  margin-bottom: 12px;
  text-align: center;
}

#article .block-author .image-wrap img {
  display: inline-block;
  width: 128px;
  height: 128px;
  margin: 0 auto;
  border-radius: 128px;
  object-fit: cover;
  object-position: center;
}

#article .block-author .title-wrap {
  margin-bottom: 20px;
  text-align: center;
}

#article .block-author .title-wrap .title {
  font-size: 18px;
  line-height: 24px;
  font-family: var(--tpl-font-main);
  color: var(--tpl-color-main-b);
  font-weight: 400;
}

#article .block-author .description-wrap,
#article .block-author .description-wrap * {
  font-size: 14px;
  line-height: 20px;
  font-weight: 300;
}

/* --- Accordions --- */

#article .ult-tabs {
  margin: 0px 0px var(--tpl-spacing-content) 0px;
}

#article .ult-tabs .ult-tab {
  margin-bottom: 15px;
}

#article .ult-tabs .ult-headline {
  font-size: 18px;
  line-height: 26px;
  display: block;
  padding: 12px 35px 12px 21px;
  color: var(--tpl-color-main-a);
  background: var(--tpl-color-main-d);
  border-radius: 4px;
  position: relative;
  cursor: pointer;
  font-weight: 400;
}

#article .ult-tabs .ult-headline::before,
#article .ult-tabs .ult-headline::after {
  background: var(--tpl-color-main-a);
  display: inline-block;
  content: "";
  width: 18px;
  height: 4px;
  position: absolute;
  transition: all 0.15s ease;
}

#article .ult-tabs .ult-headline::after {
  right: 12px;
  top: calc(50% - 2px);
}

#article .ult-tabs .ult-headline::before {
  transform: rotate(90deg);
  transform-origin: 50% 50%;
  right: 12px;
  top: calc(50% - 2px);
  opacity: 1;
}

#article .ult-tabs .active .ult-headline {
  color: var(--tpl-color-main-a);
  transition: all 0.3s ease;
  background: var(--tpl-color-main-c);
}

#article .ult-tabs .active .ult-headline::before {
  opacity: 0;
  transition: all 0.15s ease;
}

#article .ult-tabs .active .ult-headline::after {
  background: var(--tpl-color-main-a);
  transition: all 0.3s ease;
}

#article .ult-tabs .ult-inner {
  padding: 12px 21px;
}

/* --- Cards --- */

#article .card {
  background: var(--tpl-color-sub-g);
  padding: 20px;
  border-radius: 15px;
  text-align: center;
  box-shadow: 0px 0px 30px hsla(0, 0%, 0%, 0.1);
  padding-bottom: var(--tpl-spacing-content);
}

#article .card img {
  max-width: 100px;
  max-height: 100px;
  width: auto;
  height: auto;
  object-fit: contain;
  object-position: center;
}

/* --- General --- */

#article.news > .inner > .left figure img {
  max-width: 800px;
  box-shadow: 0px 0px 30px hsla(0, 0%, 0%, 0.1);
  object-fit: cover;
  object-position: center;
  border-radius: 20px;
  width: 100%;
}

#article .youtube-wrap,
#article .vimeo-wrap {
  margin-bottom: 30px;
}

/* === Search === */

#page-search {
  padding-top: 50px;
  padding-bottom: 70px;
}

#search-form {
  margin-bottom: 20px;
  padding: 15px 25px;
  background-color: var(--tpl-color-sub-f);
  border-radius: 20px;
}

#search-form .label-wrap {
  margin-bottom: 10px;
}

#search-form .input-wrap {
  display: flex;
  align-items: stretch;
}

#input-search {
  width: 100%;
  max-width: 260px;
  margin-right: 5px;
  padding: 6px 12px;
  border: 1px solid var(--tpl-color-sub-d);
  border-radius: 5px;
  font-size: 16px;
  line-height: 22px;
  font-weight: 400;
  color: var(--tpl-color-sub-b);
}

#search-form label {
  font-size: 16px;
  line-height: 22px;
  margin-bottom: 10px;
}

#search-form .input-group {
  display: flex;
  align-items: stretch;
}

#search-form .form-control {
  border: 0px;
  padding: 6px 12px;
  border-radius: 5px 0px 0px 5px;
}

#search-form .btn-wip {
  --tpl-btn-border-radius: 0px 5px 5px 0px;
  --tpl-btn-padding: 6px 12px;
  font-size: 16px;
  line-height: 22px;
}

#search-form .btn-wip .icon-search {
  margin-right: 4px;
}

#search-query-explained {
  margin-bottom: 20px;
}

#search-query-explained p {
  font-size: 14px;
  line-height: 20px;
  color: var(--tpl-color-sub-b);
}

#search-results {
  padding-top: 20px;
  margin-bottom: 80px;
}

#search-results #search-result-list {
  padding-left: 35px;
}

#search-results #search-result-list li {
  margin-bottom: 30px;
  padding: 0px;
}

#search-results #search-result-list li::before {
  left: -35px;
}

#search-results #search-result-list li a {
  margin-bottom: 5px;
  font-weight: 600;
  font-size: 18px;
  line-height: 24px;
}

#search-result-empty {
  padding-top: 30px;
}

/* === Shop - Products === */

#page-products {
  padding-top: 70px;
}

#page-products .products-intro {
  display: flex;
  align-items: flex-start;
  margin-bottom: 40px;
}

#page-products .products-intro > .left {
  flex: 1 1 100%;
}

#page-products .products-intro > .right {
  flex: 0 0 380px;
  margin-left: 58px;
}

#page-products .page-header {
  margin-bottom: 20px;
}

#page-products .page-header > h1 {
  margin-bottom: 20px;
}

#page-products .page-header > *:last-child {
  margin-bottom: 0px;
}

#page-products .products-intro > .right figure {
  margin-bottom: 0px;
}

#page-products .products-intro > .right img {
  border-radius: 20px;
  box-shadow: 0px 0px 85px rgba(0, 0, 0, 0.18);
  width: 380px;
  height: 340px;
  object-fit: cover;
  object-position: center;
}

#product-overview {
  /*padding-bottom: 80px;*/
  margin-top: -80px;
}

@media (max-width: 992px) {
  #product-overview {
    margin-top: 0px;
  }
}

#product-overview > .row {
  --bs-gutter-x: 54px;
}

/* Product */

#page-products .product-teaser {
  margin-bottom: 50px;
  padding-top: 264px;
  position: relative;
}

#page-products .product-teaser:last-child {
  margin-right: 0px;
}

#page-products .product-teaser > .inner {
  border-radius: 20px;
  box-shadow: 0px 0px 85px rgba(0, 0, 0, 0.1);
  position: relative;
}

#page-products .product-teaser .top {
  padding: 88px 35px 20px 35px;
  background: #ffffff;
  border-radius: 20px 20px 0px 0px;
}

#page-products .product-teaser .top > div:last-child {
  margin-bottom: 0px;
}

#page-products .product-teaser .image-wrap {
  display: block;
  position: absolute;
  top: 0;
  transform: translateY(-70%);
  left: 0px;
  right: 0px;
  padding: 0px;
  z-index: 1;
}

#page-products .product-teaser .image-wrap figure {
  margin: 0px;
}

#page-products .product-teaser .image-wrap img {
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: center;
}

#page-products .product-teaser .headline-wrap {
  position: relative;
  z-index: 2;
  margin-bottom: 10px;
}

#page-products .product-teaser .headline-wrap .headline {
  font-size: 16px;
  line-height: 22px;
  font-weight: 700;
}

#page-products .product-teaser .description-wrap {
  margin-bottom: 20px;
}

#page-products .product-teaser .description-wrap * {
  font-size: 14px;
  line-height: 20px;
  font-weight: 300;
}

#page-products .product-teaser .bottom {
  display: flex;
  align-items: center;
  padding: 15px 35px 15px 35px;
  background: var(--tpl-color-main-e);
  border-radius: 0px 0px 20px 20px;
}

#page-products .product-teaser .price-wrap {
  margin-right: auto;
}

#page-products .product-teaser .price-wrap .price {
  font-size: 18px;
  line-height: 24px;
  font-weight: bold;
}

#page-products .product-teaser .link-wrap {
  margin-left: auto;
}

#page-products .product-teaser .link-wrap a {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-left: auto;
  border-top: 4px solid var(--tpl-color-main-a);
  border-right: 4px solid var(--tpl-color-main-a);
  transition: border 0.15s ease;
  transform: rotate(45deg);
  transform-origin: 50% 50%;
}

#page-products .product-teaser .link-wrap a:hover {
  border-top: 4px solid var(--tpl-color-main-b);
  border-right: 4px solid var(--tpl-color-main-b);
  transition: border 0.3s ease;
}

/* === Shop - Product === */

#page-product .header {
  padding-top: 45px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  /*flex-wrap: nowrap;*/
  flex-wrap: wrap;
  padding-left: 100px;
  margin-bottom: 100px;
}

@media (max-width: 1199px) {
  #page-product .header {
    padding-left: 0px;
    margin-bottom: 20px;
  }
}

#page-product .header > .left {
  flex: 0 0 auto;
  width: 100%;
  max-width: 680px;
}

#page-product .header > .right {
  flex: 0 0 auto;
  width: 100%;
  max-width: 480px;
}

/* --- Slideshow --- */

#product-slideshow {
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0px 0px 85px rgba(0, 0, 0, 0.18);
  overflow: hidden;
  height: 525px;
}

#product-slideshow.slick-initialized {
  height: auto;
}

#product-slideshow .slide-inner {
  border-radius: 20px;
  overflow: hidden;
  width: 100%;
  height: 525px;
}

#product-slideshow .slide-inner figure {
  margin: 0px;
  width: 100%;
  height: 100%;
}

#product-slideshow .slide-inner img {
  margin: 0px;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
}

@media (max-width: 1199px) {
  #product-slideshow .slide-inner img {
    object-fit: cover;
  }
}

#product-slideshow .slick-arrow {
  appearance: none;
  font-size: 0px;
  line-height: 0px;
  color: rgba(0, 0, 0, 0);
  position: absolute;
  top: calc(50% - 11px);
  width: 22px;
  height: 22px;
  background: none;
  transition: border 0.15s ease;
  border: 0px;
  z-index: 900;
  cursor: pointer;
}

#product-slideshow .slick-arrow:hover {
  transition: border 0.3s ease;
  border-color: var(--tpl-color-main-a) !important;
}

#product-slideshow .slick-prev {
  border-left: 5px solid var(--tpl-color-main-b);
  border-bottom: 5px solid var(--tpl-color-main-b);
  transform: rotate(45deg);
  left: 30px;
}

#product-slideshow .slick-next {
  border-right: 5px solid var(--tpl-color-main-b);
  border-bottom: 5px solid var(--tpl-color-main-b);
  transform: rotate(-45deg);
  right: 30px;
}

#product-slideshow-nav {
  padding-top: 12px;
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  width: 100%;
  max-width: 680px;
}

#product-slideshow-nav .item {
  border-radius: 6px;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
  width: 120px;
  height: 120px;
  position: relative;
  margin-right: 20px;
  margin-top: 20px;
  overflow: hidden;
  cursor: pointer;
}

#product-slideshow-nav .item::after {
  transition: border 0.15s ease;
  content: "";
  display: inline-block;
  border: 2px solid rgba(0, 0, 0, 0);
  border-radius: 6px;
  width: 100%;
  height: 100%;
  z-index: 2;
  position: absolute;
  left: 0px;
  right: 0px;
  top: 0px;
  bottom: 0px;
}

#product-slideshow-nav .item:hover::after,
#product-slideshow-nav .item.active::after {
  transition: border 0.3s ease;
  border-color: var(--tpl-color-main-c);
}

#product-slideshow-nav .item figure {
  margin: 0px;
  width: 100%;
  height: 100%;
}

#product-slideshow-nav .item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* --- Details --- */

#page-product .header .title {
  margin-bottom: 22px;
}

#page-product .header .title,
#page-product .header .title .title__main {
  font-size: 36px;
  line-height: 46px;
  margin-top: 20px;
}

#page-product .header .title h1 {
  margin: 0px;
}

#page-product .header .title span {
  display: block;
}

#page-product .header .title__sub,
#page-product .header .title__ter {
  font-size: 26px;
  line-height: 32px;
}

#page-product .header .bulletpoints {
  margin-bottom: 25px;
}

#page-product .header .bulletpoints ul {
  margin: 0px;
}

#page-product .header .bulletpoints li {
  padding-left: 32px;
  font-size: 20px;
  line-height: 26px;
}

@media (max-width: 1199px) {
  #page-product .header .bulletpoints li {
    font-size: 18px;
    line-height: 22px;
  }
}

@media (max-width: 767px) {
  #page-product .header .bulletpoints li {
    font-size: 16px;
    line-height: 20px;
  }
}

#page-product .header .bulletpoints li::before {
  content: "";
  border-bottom: 4px solid var(--tpl-color-main-a);
  border-right: 4px solid var(--tpl-color-main-a);
  width: 11px;
  height: 18px;
  border-radius: 0px;
  background: none;
  transform: rotate(45deg);
  position: absolute;
  left: 4px;
  top: 3px;
}

@media (max-width: 1199px) {
  #page-product .header .bulletpoints li::before {
    width: 8px;
    height: 14px;
    left: 3px;
    top: 2px;
  }
}

@media (max-wdith: 767px) {
  #page-product .header .bulletpoints li::before {
    width: 6px;
    height: 10px;
    left: 2px;
    top: 1px;
  }
}

#page-product .header .price {
  margin-bottom: 23px;
}

#page-product .header .price .price__value {
  font-size: 26px;
  line-height: 32px;
  color: var(--tpl-color-sub-a);
  font-weight: 700;
  display: block;
}

#page-product .header .price .price__info {
  font-size: 12px;
  line-height: 18px;
  color: var(--tpl-color-extra-1);
  display: block;
}

#page-product .header .addtocart-wrap {
  margin-bottom: 12px;
}

#page-product .header .addtocart-wrap .btn-wip {
  --tpl-btn-font-weight: 700;
  --tpl-btn-color: #ffffff;
  --tpl-btn-hover-color: #ffffff;
  --tpl-btn-bg: var(--tpl-color-main-a);
  --tpl-btn-hover-bg: var(--tpl-color-main-b);
  --tpl-btn-border-color: var(--tpl-color-main-a);
  --tpl-btn-hover-border-color: var(--tpl-color-main-b);
}

@media (max-width: 1199px) {
  #page-product .header .addtocart-wrap .btn-wip {
    width: 100%;
  }
}

#page-product .header .addtocart-wrap .btn-wip .fas {
  margin-right: 6px;
}

#page-product .header .notewrap p {
  margin: 0px;
  font-size: 14px;
  line-height: 20px;
}

/* --- Information --- */

#page-product .information .row {
  --bs-gutter-x: 66px;
}

#page-product .information .addtocart-wrap {
  margin-top: 36px;
  margin-bottom: 40px;
}

#page-product .information .addtocart-wrap .btn-wip .fas {
  margin-right: 6px;
}

#page-product .attributes {
  margin-bottom: 25px;
}

#page-product .attributes .attribute {
  display: flex;
  align-items: flex-start;
  flex-wrap: nowrap;
  justify-content: space-between;
  border-bottom: 2px solid var(--tpl-color-sub-f);
  padding: 15px 0px;
}

#page-product .attributes .attribute:last-child {
  border-bottom: 0px;
}

#page-product .attributes .attribute .attribute__label {
  flex: 0 0 auto;
  width: 100%;
  max-width: 180px;
  margin-right: 25px;
}

#page-product .attributes .attribute .attribute__value {
  flex: 0 1 auto;
  width: 100%;
}

#page-product .attributes .attribute span {
  font-size: 18px;
  line-height: 24px;
}

#page-product .attributes .attribute__label span {
  font-weight: 700;
}

#page-product .video {
  position: relative;
}

#page-product .video::before {
  display: inline-block;
  position: absolute;
  bottom: -90px;
  right: -130px;
  z-index: -1;
  content: "";
  width: 380px;
  height: 380px;
  background-image: url(../images/tupfer_color_main_4.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  transform: rotate(269deg);
}

#page-product .video > div {
  z-index: 2;
}

/* --- Vorteile --- */

#page-product .benefits {
  padding-top: 30px;
}

@media (max-width: 1199px) {
  #page-product .benefits {
    padding-top: 20px;
  }
}

#page-product .benefits h2 {
  margin: 0px 0px 50px 0px;
}

#page-product .benefits .row {
  --bs-gutter-x: 80px;
  --bs-gutter-y: 24px;
}

#page-product .benefits .benefit {
  position: relative;
  padding-left: 128px;
  padding-top: 28px;
}

#page-product .benefits .benefit__image {
  position: absolute;
  left: 0px;
  top: 0px;
}

#page-product .benefits .benefit__image figure {
  margin: 0px;
}

#page-product .benefits .benefit__image img {
  width: 100px;
  height: 100px;
  object-fit: contain;
  object-position: center;
}

#page-product .benefits .benefit__title {
  padding-bottom: 11px;
}

#page-product .benefits .benefit__title span {
  font-size: 20px;
  line-height: 26px;
  font-weight: 400;
}

#page-product .benefits .benefit__text * {
  font-size: 20px;
  line-height: 26px;
}

/* Störer */

/* FAQ */

#page-product .faq {
  padding-top: 50px;
  width: 100%;
}

#page-product .faq h2 {
  margin-bottom: 35px;
}

#page-product .ult-tabs {
  margin: 0px 0px var(--spacing-content) 0px;
}

#page-product .ult-tabs .ult-tab {
  margin-bottom: 15px;
}

#page-product .ult-tabs .ult-headline {
  font-size: 18px;
  line-height: 26px;
  display: block;
  padding: 12px 35px 12px 21px;
  color: var(--tpl-color-main-a);
  background: var(--tpl-color-main-d);
  border-radius: 4px;
  position: relative;
  cursor: pointer;
}

#page-product .ult-tabs .ult-headline::before,
#page-product .ult-tabs .ult-headline::after {
  background: var(--tpl-color-main-a);
  display: inline-block;
  content: "";
  width: 18px;
  height: 4px;
  position: absolute;
  transition: all 0.15s ease;
}

#page-product .ult-tabs .ult-headline::after {
  right: 12px;
  top: calc(50% - 2px);
}

#page-product .ult-tabs .ult-headline::before {
  transform: rotate(90deg);
  transform-origin: 50% 50%;
  right: 12px;
  top: calc(50% - 2px);
  opacity: 1;
}

#page-product .ult-tabs .active .ult-headline {
  color: var(--tpl-color-main-a);
  transition: all 0.3s ease;
  background: var(--tpl-color-main-c);
}

#page-product .ult-tabs .active .ult-headline::before {
  opacity: 0;
  transition: all 0.15s ease;
}

#page-product .ult-tabs .active .ult-headline::after {
  background: var(--tpl-color-main-a);
  transition: all 0.3s ease;
}

#page-product .ult-tabs .ult-inner {
  padding: 12px 21px;
}

/* === Shop - Warenkorb === */

#page-cart {
  padding-top: 50px;
  padding-bottom: 70px;
}

#page-cart .page-header {
  margin-bottom: 32px;
}

#page-cart .page-header > * {
  margin: 0px;
}

#page-cart .row-cart {
  --bs-gutter-x: 58px;
}

#page-cart .product-list {
  padding-top: 8px;
}

#page-cart .product-list .item {
  display: flex;
  align-items: center;
  padding: 5px 0px;
}

#page-cart .product-list .item-head {
  padding: 0px 0px 12px 0px;
  border-bottom: 2px solid #f1f1f1;
  margin-bottom: 12px;
}

#page-cart .product-list .item-head span {
  color: #aeaeae;
  font-size: 16px;
  line-height: 22px;
  font-weight: 300;
}

#page-cart .product-list .column {
  flex: 0 1 auto;
  width: 100%;
}

#page-cart .product-list .column-image {
  max-width: 150px;
  margin-right: 32px;
}

#page-cart .product-list .column-product {
  max-width: 340px;
  margin-right: 50px;
}

#page-cart .product-list .column-amount {
  max-width: 120px;
  width: 100%;
  text-align: center;
}

#page-cart .product-list .column-price {
  text-align: right;
  max-width: 120px;
  width: 100%;
}

#page-cart .product-list .column-image figure {
  margin: 0px;
}

#page-cart .product-list .column-image img {
  width: 150px;
  height: 150px;
  object-fit: cover;
  object-position: center;
}

#page-cart .product-list .item .title {
  display: block;
  font-size: 18px;
  line-height: 24px;
  font-weight: 700;
  margin-bottom: 6px;
}

#page-cart .product-list .item .description {
  display: block;
  color: var(--tpl-color-sub-b);
}

#page-cart .product-list .input-amount {
  appearance: none;
  max-width: 60px;
  color: var(--tpl-color-sub-b);
  text-align: center;
  background: none;
  border: 1px solid #efefef;
  padding: 2px 4px 2px 4px;
  font-size: 1.25em;
}

.column-amount .whi-cmd {
  margin-left: 12px;
}

#page-cart .product-list .item .price {
  font-weight: 700;
}

#page-cart .product-list .footer {
  padding-top: 19px;
  border-top: 2px solid #f1f1f1;
}

#page-cart .product-list .footer p {
  font-size: 12px;
  line-height: 18px;
  margin: 0px;
  color: #aeaeae;
}

#page-cart .summary {
  max-width: 382px;
  background: var(--tpl-color-main-d);
  border-radius: 20px;
  padding: 34px;
}

#page-cart .summary .title-wrap {
  margin-bottom: 11px;
}

#page-cart .summary .title-wrap .title {
  font-family: var(--tpl-font-sub);
  font-size: 20px;
  line-height: 26px;
}

#page-cart .summary .item {
  padding: 13px 0px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  width: 314px;
}

#page-cart .summary .item:last-child {
  border-bottom: 0px;
  margin-bottom: 17px;
}

#page-cart .summary .item > div {
  flex: 0 1 auto;
}

#page-cart .summary .item .label,
#page-cart .summary .item .price {
  color: var(--tpl-color-sub-b);
}

#page-cart .summary .item.final .label,
#page-cart .summary .item.final .price {
  font-weight: 700;
  font-size: 18px;
  line-height: 24px;
}

#page-cart .summary .item .sub-label {
  font-size: 14px;
  line-height: 20px;
  font-weight: 300;
  color: var(--tpl-color-extra-1);
}

#page-cart .summary .btn-wip {
  --tpl-btn-color: var(--tpl-color-sub-g);
  --tpl-btn-hover-color: var(--tpl-color-sub-g);
  --tpl-btn-bg: var(--tpl-color-main-a);
  --tpl-btn-hover-bg: var(--tpl-color-main-b);
  --tpl-btn-border-color: var(--tpl-color-main-a);
  --tpl-btn-hover-border-color: var(--tpl-color-main-b);
  --tpl-btn-border-radius: 5px;
  --tpl-btn-box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.2);
  --tpl-btn-padding: 8px 24px;
  width: 100%;
  position: relative;
}

#page-cart .summary .btn-wip::after {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  border-right: 3px solid var(--tpl-color-sub-g);
  border-bottom: 3px solid var(--tpl-color-sub-g);
  transform: rotate(-45deg);
  transform-origin: center;
  position: absolute;
  right: 24px;
  top: calc(50% - 6px);
}

#page-cart .payment-methods {
  margin-top: 25px;
}

#page-cart .payment-methods .title-wrap {
  margin-bottom: 8px;
}

#page-cart .payment-methods .title {
  font-size: 14px;
  line-height: 20px;
}

#page-cart .payment-methods .images-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#page-cart .payment-methods img {
  width: 118px;
}

/* === Modules === */

.module {
  position: relative;
}

/* --- Breadcrumbs --- */

.mod-breadcrumbs {
  padding: 15px 0px;
}

.breadcrumbs > ol {
  display: flex;
  align-items: center;
  margin: 0px;
  padding: 0px;
}

.breadcrumbs ol > li {
  position: relative;
  margin: 0px 8px 0px 0px;
  padding: 0px 18px 0px 0px;
}

.breadcrumbs ol > li::before {
  display: none;
}

.breadcrumbs ol > li::after {
  position: absolute;
  top: 9px;
  right: 5px;
  content: "";
  width: 7px;
  height: 7px;
  border-top: 1px solid var(--tpl-color-sub-d);
  border-right: 1px solid var(--tpl-color-sub-d);
  transform: rotate(45deg);
  transform-origin: center;
}

.breadcrumbs ol > li:last-child {
  margin-right: 0px;
  padding-right: 0px;
}

.breadcrumbs ol > li:last-child::after {
  display: none;
}

.breadcrumbs ol > li:last-child::after {
  display: none;
}

.breadcrumbs a,
.breadcrumbs span {
  font-size: 14px;
  line-height: 20px;
  font-weight: 300;
  color: var(--tpl-color-sub-c);
  transition: color 0.15s ease;
}

.breadcrumbs a:hover,
.breadcrumbs a:hover > span {
  color: var(--tpl-color-main-b);
  transition: color 0.3s ease;
}

.breadcrumbs .active span {
  color: var(--tpl-color-sub-a);
}

/* --- Störer --- */

.cta {
  padding: 25px 50px 25px 300px;
  background: var(--tpl-color-main-d);
  background-image: url(/images/modules/cta/cta_questionmark.png);
  background-repeat: no-repeat;
  background-position: 45px center;
  background-size: auto calc(100% + 30px);
  border-radius: 10px;
  margin-bottom: 30px;
}

.cta:last-child {
  margin-bottom: 0px;
}

.cta.ulrichpoetter {
  background-image: url(/images/modules/cta/cta_ulrichpoetter.png);
  padding-left: 325px;
}

.cta.massageausbildung {
  background-image: url(/images/modules/cta/cta_massageausbildung.png);
  padding-left: 350px;
}

.cta .headline-wrap {
  margin-bottom: 12px;
}

.cta .headline-wrap .headline {
  display: block;
  font-size: 36px;
  line-height: 46px;
  font-weight: 700;
  font-family: var(--tpl-font-sub);
  color: var(--tpl-color-sub-a);
}

.cta .content-wrap {
  display: flex;
  align-items: center;
}

.cta .content-wrap a:not(.btn) {
  margin-right: 18px;
  font-size: 16px;
  line-height: 22px;
  color: var(--tpl-color-sub-a);
  transition: color 0.15s ease;
}

.cta .content-wrap a:not(.btn):hover {
  color: var(--tpl-color-main-b);
  cursor: pointer;
  transition: color 0.3s ease;
}

.cta .content-wrap a:last-child {
  margin-right: 0px;
}

.cta .content-wrap > .btn {
  margin-top: 18px;
}

.cta .content-wrap .has-icon {
  position: relative;
  padding-left: 23px;
  cursor: pointer;
}

.cta .content-wrap .has-icon .fas {
  display: flex;
  align-items: center;
  justify-content: space-around;
  position: absolute;
  top: 3px;
  left: 0px;
  width: 17px;
  height: 17px;
  font-size: 10px;
  line-height: 22px;
  color: var(--tpl-color-main-d);
  background: var(--tpl-color-sub-a);
  border-radius: 17px;
  transition: background 0.15s ease;
}

.cta .content-wrap .has-icon .fas.fas-phone-alt::before {
  transform: translateY(-1px);
}

.cta .content-wrap .has-icon:hover .fas {
  background: var(--tpl-color-main-a);
  transition: background 0.3s ease;
}

/* --- Slideshow --- */

#slideshow-148 {
  opacity: 0;
}

.slide-image figcaption {
  transform: rotate(-90deg);
  bottom: 140px;
  right: -280px;
  color: var(--tpl-color-sub-g);
}

.slideshow-header {
  max-width: 1570px;
  margin: 0 auto;
  overflow: visible;
  position: relative;
}

.slideshow-header figure {
  margin-bottom: 0px;
}

.slideshow-header .slick-track {
  overflow: hidden;
}

.slideshow-header .slide-inner {
  display: flex;
  align-items: stretch;
}

/* Left */

.slideshow-header .slide-inner > .left {
  display: flex;
  align-items: center;
  height: auto;
  margin-right: 73px;
  margin-left: auto;
  padding-bottom: 143px;
  padding-left: 30px;
  text-align: right;
  max-width: 580px;
}

.slideshow-header .signets {
  margin-bottom: 30px;
}

.slideshow-header .signets__inner {
  display: flex;
  justify-content: flex-end;
}

.slideshow-header .signets__inner > .signet {
  margin-right: 15px;
}

.slideshow-header .signets__inner > .signet:first-child {
  margin-left: auto;
}

.slideshow-header .signets__inner > .signet:last-child {
  margin-right: 0px;
}

.slideshow-header .signet__text {
  font-size: 11px;
  line-height: 15px;
  color: #ebebeb;
  margin-bottom: 0px;
  margin-top: 10px;
}

.slideshow-header .signet-b .signet__text {
  padding-right: 25px;
}

.slideshow-header .slide-headline {
  margin-bottom: 15px;
}

.slideshow-header .slide-headline .headline {
  font-size: 30px;
  line-height: 34px;
  font-family: var(--tpl-font-sub);
  color: #fff;
}

.slideshow-header .slide-content {
  margin-bottom: 24px;
}

.slideshow-header .slide-content * {
  font-size: 18px;
  line-height: 24px;
  font-weight: 300;
  color: #ffffff;
}

.slideshow-header .slide-inner > .left > div:last-child {
  margin-bottom: 0px;
}

.slideshow-header .slide-readmore .btn-wip {
  --tpl-btn-font-size: 16px;
  --tpl-btn-font-weight: 700;
  --tpl-btn-line-height: 22px;
  --tpl-btn-padding: 5px 24px;
}

/* Right */

.slideshow-header .slide-inner > .right {
  padding: 50px 85px 85px 0px;
  max-width: 885px;
  flex: 0 0 100%;
}

.slick-slide:nth-child(1) .slide-inner > .right {
  padding: 0px 85px 85px 0px;
}

.slideshow-header .slide-inner > .right img {
  /*border-radius: 20px;
	box-shadow: 0px 0px 85px rgba(0, 0, 0, 0.1);*/

  width: 540px;
  height: 400px;
  object-fit: cover;
  object-position: center;
}

.slick-slide:nth-child(1) .slide-inner > .right img {
  /*border-radius: 20px;
	box-shadow: 0px 0px 85px rgba(0, 0, 0, 0.1);*/

  width: 320px;
  height: auto;
  object-fit: cover;
  object-position: center;
}

/* Dot Navigation */

.slideshow-header .slick-dots {
  display: flex;
  align-items: center;
  bottom: 150px;
  right: 958px;
  width: auto;
  position: absolute;
  margin: 0px;
}

.slideshow-header .slick-dots > li {
  display: inline-block;
  opacity: 1;
  width: auto;
  height: auto;
  margin: 0px 13px 0px 0px;
  background: none;
  line-height: 0px;
  padding: 0px;
}

.slideshow-header .slick-dots > li::before {
  display: none;
}

.slideshow-header .slick-dots > li:last-child {
  margin-right: 0px;
}

.slideshow-header .slick-dots > li > button {
  display: inline-block;
  opacity: 0.4;
  width: 17px;
  height: 17px;
  padding: 0px;
  background: #ffffff;
  border-radius: 17px;
  transition: opacity 0.15s ease;
  appearance: none;
  border: 0px;
  color: rgba(0, 0, 0, 0);
  line-height: 0px;
  font-size: 0px;
}

.slideshow-header .slick-dots > li > button:hover,
.slideshow-header .slick-dots > li.slick-active > button {
  opacity: 1;
  cursor: pointer;
  transition: opacity 0.3s ease;
}

.slideshow-header .slick-dots > li > button::before {
  display: none;
}

/* --- Imageblock Module --- */

.mod-wip-imageblock .imagetextblock {
  display: flex;
  align-items: center;
}

.mod-wip-imageblock .left {
  flex: 0 1 auto;
  position: relative;
  margin-right: 86px;
}

.mod-wip-imageblock .left::before {
  display: inline-block;
  position: absolute;
  bottom: -100px;
  left: -100px;
  z-index: 1;
  content: "";
  width: 400px;
  height: 420px;
  background-image: url(../images/tupfer_color_main_4.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  transform: rotate(82deg);
}

.mod-wip-imageblock .type-1 .left::before {
  top: -40px;
  bottom: auto;
  left: -75px;
  width: 300px;
  height: 320px;
  transform: rotate(-92deg);
}

.mod-wip-imageblock .type-2 .left::before {
  top: -50px;
  bottom: auto;
  left: 51px;
  width: 300px;
  height: 300px;
  transform: rotate(77deg);
}

.mod-wip-imageblock figure {
  margin-bottom: 0px;
}

.mod-wip-imageblock .left img {
  position: relative;
  z-index: 2;
  width: 500px;
  height: 450px;
  object-fit: contain;
  object-position: center;
}

.mod-wip-imageblock .not-transparent .left img {
  position: relative;
  z-index: 2;
  border-radius: 20px;
  box-shadow: 0px 0px 85px rgba(0, 0, 0, 0.1);
  object-fit: cover;
}

.mod-wip-imageblock .right {
  flex: 1 1 100%;
  max-width: 600px;
}

.mod-wip-imageblock .headline-wrap {
  margin-bottom: 20px;
}

.mod-wip-imageblock .headline-wrap .headline {
  font-size: 36px;
  line-height: 46px;
  font-family: var(--tpl-font-sub);
}

.mod-wip-imageblock .content-wrap {
  margin-bottom: 29px;
}

.mod-wip-imageblock .content-wrap p {
  font-size: 20px;
  line-height: 26px;
  font-weight: 300;
}

.mod-wip-imageblock .button-wrap .btn-wip {
  --tpl-btn-font-size: 18px;
  --tpl-btn-line-height: 24px;
}

/* --- Statcards --- */

#statcards::before {
  display: block;
  position: absolute;
  top: auto;
  right: 0px;
  bottom: 0px;
  left: 0px;
  z-index: 1;
  content: "";
  width: 100%;
  height: 45%;
  background: var(--tpl-color-main-d);
  border-radius: 50% 50% 50% 50% / 12% 12% 0 0;
}

#statcards figure {
  margin: 0px;
}

/* Top */

#statcards > .top {
  position: relative;
  z-index: 2;
  padding-bottom: 90px;
  text-align: center;
}

#statcards > .top > .inner {
  max-width: 768px;
  margin: 0 auto;
}

#statcards > .top .headline-wrap {
  margin-bottom: 20px;
  text-align: center;
}

#statcards > .top .headline-wrap .headline {
  font-size: 36px;
  line-height: 46px;
  font-family: var(--tpl-font-sub);
}

#statcards > .top .content-wrap {
  margin-bottom: 30px;
  text-align: center;
}

#statcards > .top .content-wrap p {
  font-size: 20px;
  line-height: 26px;
  font-weight: 300;
}

#statcards > .top .content-wrap p:last-child {
  margin-bottom: 0px;
}

#statcards > .top .marker {
  position: absolute;
  right: 0px;
  bottom: 53px;
  left: 0px;
  width: 34px;
  height: 34px;
  margin: 0 auto;
  background: var(--tpl-color-main-a);
  border-radius: 34px;
  box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.08);
}

#statcards > .top .marker::before {
  position: absolute;
  top: 11px;
  right: 12px;
  content: "";
  width: 10px;
  height: 10px;
  border-bottom: 3px solid #ffffff;
  border-left: 3px solid #ffffff;
  transform: rotate(-45deg);
  transform-origin: 50% 50%;
}

/* Bottom */

#statcards > .bottom {
  position: relative;
  z-index: 2;
}

#statcards > .bottom > .inner {
  display: flex;
  align-items: center;
}

/* Statcard */

#statcards .statcard {
  flex: 1 1 430px;
  position: relative;
  margin-right: 40px;
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0px 0px 85px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}

#statcards .statcard > .top {
  padding: 30px 34px 5px 34px;
}

#statcards .statcard > .top > div:last-child {
  margin-bottom: 0px;
}

#statcards .statcard > .bottom {
  padding: 14px 34px 17px 34px;
  background-color: var(--tpl-color-main-e);
  border-radius: 0px 0px 20px 20px;
}

#statcards .statcard:last-child {
  margin-right: 0px;
}

#statcards .statcard.item-2 {
  flex: 1 1 460px;
}

#statcards .statcard.best-option::before {
  display: inline-block;
  position: absolute;
  top: 0px;
  right: 0px;
  content: "";
  width: 100px;
  height: 100px;
  background-image: url(../images/modules/statcards/beste_option.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

#statcards .statcard .image-wrap {
  margin-bottom: 5px;
  text-align: center;
}

#statcards .statcard .image-wrap img {
  width: auto;
  height: 260px;
}

#statcards .statcard.item-2 .image-wrap {
  margin-bottom: 25px;
}

#statcards .statcard .headline-wrap {
  margin-bottom: 16px;
  text-align: center;
}

#statcards .statcard .headline-wrap .headline {
  font-size: 22px;
  line-height: 26px;
  font-weight: 700;
  font-family: var(--tpl-font-main);
}

#statcards .statcard .description-wrap {
  margin-bottom: 24px;
  text-align: center;
}

#statcards .statcard .description-wrap p {
  font-size: 16px;
  line-height: 22px;
  font-weight: 300;
}

#statcards .statcard .button-wrap {
  margin-bottom: 24px;
  text-align: center;
}

#statcards .statcard .btn-wip {
  --tpl-btn-font-size: 16px;
  --tpl-btn-line-height: 22px;
}

#statcards .statcard .list-wrap {
  margin-bottom: 16px;
  text-align: center;
}

#statcards .statcard ul {
  padding: 0px;
  display: inline-block;
  margin: 0 auto 10px auto;
}

#statcards .statcard ul li {
  margin: 0px;
  padding: 8px 0px 8px 25px;
  font-size: 16px;
  line-height: 22px;
  font-weight: 300;
  text-align: left;
}

#statcards .statcard ul li:last-child {
  border-bottom: 0px;
}

#statcards .statcard ul li::before {
  display: inline-block;
  content: "\f00c";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-style: normal;
  font-variant: normal;
  line-height: 1;
  position: absolute;
  left: 0px;
  color: var(--tpl-color-main-b);
  background: none;
  border-radius: 0px;
  width: auto;
  height: auto;
  top: 12px;
}

#statcards .statcard > .bottom {
  display: flex;
  align-items: center;
}

#statcards .statcard .price-wrap {
  margin-right: auto;
}

#statcards .statcard .price-wrap .price {
  margin-right: 15px;
  font-size: 20px;
  line-height: 26px;
  font-weight: 700;
}

#statcards .statcard .price-wrap .priceinfo {
  font-size: 12px;
  line-height: 22px;
  font-weight: 300;
  color: var(--tpl-color-sub-c);
}

#statcards .statcard .link-wrap {
  margin-left: auto;
}

#statcards .statcard .link-wrap a {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-left: auto;
  border-top: 4px solid var(--tpl-color-main-a);
  border-right: 4px solid var(--tpl-color-main-a);
  transition: border 0.15s ease;
  transform: rotate(45deg);
  transform-origin: 50% 50%;
}

#statcards .statcard .link-wrap a:hover {
  border-top: 4px solid var(--tpl-color-main-b);
  border-right: 4px solid var(--tpl-color-main-b);
  transition: border 0.3s ease;
}

/* --- Vorteile --- */

#vorteile::before {
  display: block;
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  z-index: 1;
  content: "";
  width: 100%;
  height: 100%;
  background: var(--tpl-color-main-d);
  border-radius: 0% 0% 50% 50% / 50% 50% 12% 12%;
}

#vorteile > .inner {
  position: relative;
  z-index: 2;
}

#vorteile .headline-wrap {
  margin-bottom: 60px;
}

#vorteile .headline-wrap .headline {
  font-size: 36px;
  line-height: 46px;
  font-family: var(--tpl-font-sub);
}

#vorteile .row {
  --bs-gutter-x: 85px;
  --bs-gutter-y: 33px;
}

/* --- Accordions --- */

#vorteile .ult-tab {
  position: relative;
  margin-bottom: 60px;
  padding-left: 120px;
}

#vorteile .ult-head {
  position: relative;
}

#vorteile .ult-headline {
  position: relative;
  min-height: 61px;
  padding: 8px 40px 8px 0px;
  font-size: 20px;
  line-height: 20px;
  color: var(--tpl-color-sub-a);
  background: none;
  border-bottom: 1px solid #ddd0ca;
  display: block;
  cursor: pointer;
  transition: all 0.15s ease;
}

#vorteile .ult-headline::before,
#vorteile .ult-headline::after {
  background: var(--tpl-color-extra-1);
  display: inline-block;
  content: "";
  width: 18px;
  height: 4px;
  position: absolute;
  transition: all 0.15s ease;
}

#vorteile .ult-headline::after {
  right: 12px;
  top: calc(50% - 4px);
}

#vorteile .ult-headline::before {
  transform: rotate(90deg);
  transform-origin: 50% 50%;
  right: 12px;
  top: calc(50% - 4px);
  opacity: 1;
}

#vorteile .active .ult-headline {
  color: var(--tpl-color-main-a);
  transition: all 0.3s ease;
}

#vorteile .active .ult-headline::before {
  opacity: 0;
  transition: all 0.15s ease;
}

#vorteile .active .ult-headline::after {
  background: var(--tpl-color-main-a);
  transition: all 0.3s ease;
}

#vorteile .ultima-accordion .ult-inner {
  padding: 20px 0px 0px 0px;
}

#vorteile .ult-tab::before {
  display: inline-block;
  position: absolute;
  top: -10px;
  left: 0px;
  content: "";
  width: 86px;
  height: 86px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

#vorteile .ult-tab.item-1::before {
  background-image: url(../images/modules/vorteile/icon_1.svg);
}

#vorteile .ult-tab.item-2::before {
  background-image: url(../images/modules/vorteile/icon_2.svg);
}

#vorteile .ult-tab.item-3::before {
  background-image: url(../images/modules/vorteile/icon_3.svg);
}

#vorteile .ult-tab.item-4::before {
  background-image: url(../images/modules/vorteile/icon_4.svg);
}

#vorteile .ult-tab.item-5::before {
  background-image: url(../images/modules/vorteile/icon_5.svg);
}

#vorteile .ult-tab.item-6::before {
  background-image: url(../images/modules/vorteile/icon_6.svg);
}

#vorteile .ult-tab.item-7::before {
  background-image: url(../images/modules/vorteile/icon_7.svg);
}

#vorteile .ult-tab.item-8::before {
  background-image: url(../images/modules/vorteile/icon_8.svg);
}

/* --- Produkte Teasers --- */

#products-teaser > .top {
  text-align: center;
}

#products-teaser > .top .headline-wrap {
  margin-bottom: 20px;
}

#products-teaser > .top .headline-wrap .headline {
  font-size: 36px;
  line-height: 46px;
  font-family: var(--tpl-font-sub);
}

#products-teaser > .top .content-wrap {
  margin-bottom: 30px;
}

#products-teaser > .top .content-wrap p {
  font-size: 20px;
  line-height: 26px;
  font-weight: 300;
}

#products-teaser > .top .content-wrap p:last-child {
  margin-bottom: 0px;
}

#products-teaser > .bottom > .inner {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

#products-teaser .product-teaser {
  flex: 1 1 33%;
  padding-top: 250px;
  position: relative;
  padding-left: 16px;
  padding-right: 16px;
}

#products-teaser .product-teaser:last-child {
  margin-right: 0px;
}

#products-teaser .product-teaser > .inner {
  border-radius: 20px;
  box-shadow: 0px 0px 85px rgba(0, 0, 0, 0.1);
}

#products-teaser .product-teaser .top {
  padding: 23px 35px 20px 35px;
  background: #ffffff;
  border-radius: 20px 20px 0px 0px;
}

#products-teaser .product-teaser .top > div:last-child {
  margin-bottom: 0px;
}

#products-teaser .product-teaser .image-wrap {
  display: block;
  position: relative;
  width: 100%;
  height: auto;
  margin-bottom: 10px;
  padding-bottom: 50px;
}

#products-teaser .product-teaser .image-wrap img {
  position: absolute;
  bottom: -25px;
  left: -35px;
  z-index: 1;
  width: calc(100% + 70px);
  height: 318px;
  object-fit: contain;
  object-position: center bottom;
}

#products-teaser .product-teaser .headline-wrap {
  position: relative;
  z-index: 2;
  margin-bottom: 10px;
}

#products-teaser .product-teaser .headline-wrap .headline {
  font-size: 16px;
  line-height: 22px;
  font-weight: 700;
}

#products-teaser .product-teaser .description-wrap {
  margin-bottom: 20px;
}

#products-teaser .product-teaser .description-wrap * {
  font-size: 14px;
  line-height: 20px;
  font-weight: 300;
}

#products-teaser .product-teaser .bottom {
  display: flex;
  align-items: center;
  padding: 15px 35px 15px 35px;
  background: var(--tpl-color-main-e);
  border-radius: 0px 0px 20px 20px;
}

#products-teaser .product-teaser .price-wrap {
  margin-right: auto;
}

#products-teaser .product-teaser .price-wrap .price {
  font-size: 18px;
  line-height: 24px;
  font-weight: bold;
}

#products-teaser .product-teaser .link-wrap {
  margin-left: auto;
}

#products-teaser .product-teaser .link-wrap a {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-left: auto;
  border-top: 4px solid var(--tpl-color-main-a);
  border-right: 4px solid var(--tpl-color-main-a);
  transition: border 0.15s ease;
  transform: rotate(45deg);
  transform-origin: 50% 50%;
}

#products-teaser .product-teaser .link-wrap a:hover {
  border-top: 4px solid var(--tpl-color-main-b);
  border-right: 4px solid var(--tpl-color-main-b);
  transition: border 0.3s ease;
}

#products-teaser .product-teaser:last-child {
  position: relative;
}

#products-teaser .product-teaser:last-child::before {
  display: inline-block;
  position: absolute;
  right: -80px;
  bottom: 60px;
  z-index: 1;
  content: "";
  width: 300px;
  height: 300px;
  background-image: url(../images/tupfer_color_main_4.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  transform: rotate(82deg);
}

#products-teaser .product-teaser > .inner {
  position: relative;
  z-index: 2;
}

/* --- Testimonials --- */

#testimonials {
  position: relative;
}

#testimonials > .headline-wrap {
  margin-bottom: 64px;
  text-align: center;
}

#testimonials > .headline-wrap .headline {
  font-size: 36px;
  line-height: 46px;
  font-family: var(--tpl-font-sub);
}

#testimonials .slick-dotted.slick-slider {
  margin-bottom: 0px;
  padding-bottom: 60px;
}

#testimonials .slick-list {
  overflow: visible;
}

#testimonials .slide-inner {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0px 0px 85px rgba(0, 0, 0, 0.1);
  max-height: 400px;
  text-align: left;
}

#testimonials .left {
  padding: 20px 50px 20px 60px;
  flex: 0 1 calc(100% - 530px);
  display: flex;
  height: auto;
  align-items: center;
  position: relative;
}

#testimonials .left::after {
  content: "";
  display: inline-block;
  position: absolute;
  z-index: 1;
  left: 100%;
  top: 0px;
  bottom: 0px;
  height: 100%;
  width: 130px;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center top;
  background-image: url(../images/modules/testimonials/swipe.svg);
}

#testimonials .slide-content p,
#testimonials .slide-headline .headline {
  font-size: 16px;
  line-height: 22px;
  font-weight: 300;
}

#testimonials .slide-headline {
  margin-top: 30px;
}

#testimonials .slide-headline .headline {
  font-weight: bold;
}

#testimonials .right {
  min-height: 384px;
  flex: 0 1 530px;
  display: flex;
  height: auto;
  position: relative;
  border-radius: 0px 20px 20px 0px;
  overflow: hidden;
}

#testimonials .right img {
  position: absolute;
  left: 0px;
  top: 0px;
  right: 0px;
  bottom: 0px;
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
}

/* Navigation */

#testimonials .slick-dots {
  display: flex;
  align-items: center;
  bottom: 0px;
  left: 0px;
  width: auto;
  padding-top: 30px;
  margin: 0px;
}

#testimonials .slick-dots > li {
  display: inline-block;
  opacity: 1;
  width: auto;
  height: auto;
  margin: 0px 13px 0px 0px;
  background: none;
  line-height: 0px;
  padding: 0px;
}

#testimonials .slick-dots > li::before {
  display: none;
}

#testimonials .slick-dots > li:last-child {
  margin-right: 0px;
}

#testimonials .slick-dots > li > button {
  display: inline-block;
  width: 17px;
  height: 17px;
  padding: 0px;
  background: var(--tpl-color-main-c);
  border-radius: 17px;
  transition: background 0.15s ease;
  font-size: 0px;
  line-height: 0px;
  color: rgba(0, 0, 0, 0);
  border: none;
  appearance: none;
}

#testimonials .slick-dots > li > button:hover,
#testimonials .slick-dots > li.slick-active > button {
  background: var(--tpl-color-main-a);
  cursor: pointer;
  transition: background 0.3s ease;
}

#testimonials .slick-dots > li > button::before {
  display: none;
}

/* Go To All */

#testimonials .go-to-all {
  position: absolute;
  right: 0px;
  bottom: 0px;
}

/* --- Marken --- */

#praxislogos {
  position: relative;
}

#praxislogos > .headline-wrap {
  text-align: center;
  margin-bottom: 32px;
}

#praxislogos > .headline-wrap .headline {
  font-size: 24px;
  line-height: 30px;
  font-family: var(--tpl-font-sub);
  font-weight: 300;
}

#praxislogos .slideshow {
  padding-left: 50px;
  padding-right: 50px;
}

#praxislogos .slick-prev,
#praxislogos .slick-next {
  font-size: 0px;
  line-height: 0px;
  color: rgba(0, 0, 0, 0);
  display: inline-block;
  width: 24px;
  height: 24px;
  transform: rotate(45deg);
  transform-origin: center;
  opacity: 1;
  top: calc(50% - 12px);
  transition: border 0.15s ease;
  position: absolute;
  appearance: none;
  background: none;
}

#praxislogos .slick-prev:hover,
#praxislogos .slick-next:hover {
  transition: border 0.3s ease;
  border-color: var(--tpl-color-main-a);
}

#praxislogos .slick-prev {
  left: 5px !important;
  border: 0px;
  border-left: 5px solid var(--tpl-color-sub-c);
  border-bottom: 5px solid var(--tpl-color-sub-c);
}

#praxislogos .slick-next {
  right: 5px !important;
  border: 0px;
  border-top: 5px solid var(--tpl-color-sub-c);
  border-right: 5px solid var(--tpl-color-sub-c);
}

#praxislogos .slick-dotted.slick-slider {
  margin-bottom: 0px;
  padding-bottom: 60px;
}

#praxislogos .slick-track {
  display: flex;
  align-items: stretch;
}

#praxislogos .slick-track .slick-slide {
  display: flex;
  align-items: center;
  justify-content: space-around;
  text-align: center;
  height: auto;
}

#praxislogos .slide-inner {
  padding: 10px;
}

#praxislogos .slide-inner figure {
  margin: 0px;
}

#praxislogos .slide-inner img {
  width: 100%;
  max-height: 45px;
  object-fit: contain;
  object-position: center;
}

/*
#praxislogos .slide-inner > *{
	filter: grayscale(1);
	opacity: 0.3;
	transition: filter 0.15s ease, opacity 0.15s ease;
}

#praxislogos .slide-inner > *:hover{
	filter: grayscale(0);
	opacity: 1;
	transition: filter 0.3s ease, opacity 0.3s ease;
}*/

/* --- Contacts --- */

.mod-wip-contacts .item {
  margin-bottom: 30px;
  padding: 0px 20px;
}

.mod-wip-contacts .image-wrap {
  text-align: center;
}

.mod-wip-contacts .image-wrap img {
  max-width: 200px;
  border-radius: 4px;
  box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.15);
}

.mod-wip-contacts .info-wrap {
  padding: 8px 10px 10px 10px;
  text-align: center;
}

/* --- Ähnliche Beiträge --- */

.mod-tags-similar .module-headline {
  margin-bottom: 45px;
}

.mod-tags-similar .module-headline .headline {
  font-size: 30px;
  line-height: 36px;
  font-family: var(--tpl-font-sub);
}

.mod-tags-similar .items {
  --bs-gutter-x: 54px;
}

.mod-tags-similar .item {
  box-shadow: 0px 0px 85px 0px rgba(0, 0, 0, 0.12);
  border-radius: 20px;
}

.mod-tags-similar .item:nth-child(4) {
  display: none;
}

.mod-tags-similar .item figure {
  margin: 0px;
  display: block;
}

.mod-tags-similar .item figure img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  object-position: center;
  border-radius: 20px 20px 0px 0px;
}

.mod-tags-similar .item .bottom {
  background: #ffffff;
  border-radius: 0px 0px 20px 20px;
  padding: 0px 50px 0px 30px;
  position: relative;
}

.mod-tags-similar .item .headline {
  color: var(--tpl-color-sub-a);
  font-size: 18px;
  line-height: 24px;
  transition: color 0.15s ease;
}

.mod-tags-similar .item .headline:hover {
  color: var(--color-main-b);
  transition: color 0.3s ease;
}

.mod-tags-similar .item .arrow {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-left: auto;
  border-top: 4px solid var(--tpl-color-main-a);
  border-right: 4px solid var(--tpl-color-main-a);
  transition: border 0.15s ease;
  transform: rotate(45deg);
  transform-origin: 50% 50%;
  cursor: pointer;
  position: absolute;
  right: 30px;
  top: calc(50% - 9px);
}

.mod-tags-similar .item .arrow:hover {
  border-top: 4px solid var(--tpl-color-main-b);
  border-right: 4px solid var(--tpl-color-main-b);
  transition: border 0.3s ease;
}

/* NEUER PART VON MIR (FRANK) */
.mod-tags-similar .item {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.mod-tags-similar .item .bottom {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 85px; /* feste Mindesthöhe für einheitliches Layout */
}

.mod-tags-similar .item .headline-wrap {
    display: flex;
    align-items: center;
    justify-content: flex-start; /* oder center, je nach gewünschter Ausrichtung */
    text-align: left;
    flex-grow: 1;
}





/* --- Instagram Feed --- */

.mod-si-instagram .module-headline .headline {
  font-size: 30px;
  line-height: 36px;
  font-family: var(--tpl-font-sub);
  margin: 0px 0px calc(var(--tpl-spacing-content) * 0.75) 0px;
  font-weight: 400;
  display: block;
}

/* --- Kurs Termine --- */

.kurstermine__desktop {
  width: 100%;
}

.kurstermine__desktop th,
.kurstermine__desktop td {
  padding: 10px 12px;
}

.kurstermin__bar {
  display: block;
  text-align: center;
  color: #ffffff;
  font-size: 14px;
  line-height: 20px;
  padding: 3px 6px;
}

.kurstermin__bar.--state-3 {
  background: #5eb95e;
}

.kurstermin__bar.--state-2 {
  background: #faa732;
}

.kurstermin__bar.--state-1 {
  background: #dd514c;
}

.kurstermine__mobile {
  display: none;
}

/* --- Kurse Filter Grid --- */

.kurse-grid {
  margin-bottom: 30px;
}

.kurse-grid .row {
  align-items: stretch;
}

.kurse-grid__item-wrap {
  height: auto;
  padding-bottom: 30px;
}

.kurse-grid__item {
  position: relative;
  overflow: hidden;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.15);
  border-radius: 5px;
  height: 100%;
  background: var(--tpl-color-main-d);
  display: flex;
  flex-direction: column;
}

.kurse-grid__item .item__backdrop {
  height: auto;
  margin-bottom: 0px;
}

.kurse-grid__item img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  object-position: center;
}

.ribbon {
  /*! height: 188px; */
  position: relative;
  /*! margin-bottom: 30px; */
  background-size: cover;
  text-transform: uppercase;
  color: white;
  z-index: 9;
}

.ribbon1 {
  position: absolute;
  top: -6.1px;
  right: 10px;
}

.ribbon1:after {
  position: absolute;
  content: "";
  width: 0;
  height: 0;
  border-left: 45px solid transparent;
  border-right: 45px solid transparent;
  border-top: 10px solid #ffd700;
  /*background: linear-gradient(73deg, #FFD700, #E8AE00);*/
}

.ribbon1 span {
  position: relative;
  display: block;
  text-align: center;
  /*background: #F8CA3F;*/
  background: linear-gradient(-7deg, #ffd700, #e8ae00);
  font-size: 14px;
  line-height: 1.4;
  padding: 12px 8px 10px;
  border-top-right-radius: 8px;
  width: 90px;
  color: #fff;
  font-weight: bold;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 1);
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.6);
}

.ribbon1 span:before,
.ribbon1 span:after {
  position: absolute;
  content: "";
}

.ribbon1 span:before {
  height: 6px;
  width: 6px;
  left: -6px;
  top: 0;
  background: #f8ca3f;
}

.ribbon1 span:after {
  height: 6px;
  width: 8px;
  left: -8px;
  top: 0;
  border-radius: 8px 8px 0 0;
  background: #bf971d;
}

.kurse-grid .item__inner {
  padding: 8px 12px;
  display: flex;
  align-items: center;
  margin: auto 0px;
  min-height: 88px;
}

.kurse-grid .item__title {
  font-weight: 700;
  font-size: 18px;
  line-height: 24px;
  color: var(--tpl-color-main-a);
  text-align: center;
}

.kurse-grid .item__price-pill {
  display: inline-block;
  padding: 0.25em 0.75em;
  /*background-color: #096795;*/
  background-color: var(--tpl-color-main-a);
  color: #fff;
  /*! border-radius: 10px; */
  font-size: 0.875em;
  margin-top: 1.5em;
  position: absolute;
  border-top-right-radius: 14px;
  border-bottom-right-radius: 14px;
  font-weight: bold;
  /*border: solid 1px #b3d3e3;*/
  border: solid 1px var(--tpl-color-main-b);
  border-left: none;
  /* add a shadow */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
}

.kurse-grid-filter {
  background: var(--tpl-color-main-a);
  color: #ffffff;
  height: 100%;
  display: flex;
  flex-direction: column;
  background-image: url(../images/tupfer_color_main_dark.svg);
  background-repeat: no-repeat;
  background-position: 260px -109px;
}

.kurse-grid-filter .item__title {
  color: #ffffff;
  padding: 6px 20px;
  margin-bottom: 15px;
  font-size: 20px;
  line-height: 26px;
  text-align: left;
  margin-top: auto;
}

.kurse-grid-filter .item__description {
  padding: 0px 20px;
  margin-bottom: auto;
}

.kurse-grid-filter .item__description p {
  font-size: 18px;
  line-height: 24px;
}

.kurse-grid-filter .item__selection {
  text-align: center;
  background: var(--tpl-color-main-d);
  padding: 6px 12px;
  margin-top: auto;
  min-height: 80px;
  /*display: flex;
	align-items: center;*/
}

.kurse-grid-filter .item__selection select {
  appearance: none;
  font-size: 16px;
  line-height: 22px;
  border: 1px solid #cccccc;
  border-radius: 3px;
  cursor: pointer;
  padding: 6px 12px;
  width: 100%;
  max-width: 80%;
  margin: 0 auto;
  margin-top: 20px;
  position: relative;
  background-color: #ffffff;
  background-image: url(../images/chevron_orange.svg);
  background-size: 18px auto;
  background-position: calc(100% - 9px) calc(50% - 2px);
  background-repeat: no-repeat;
}

.kurse-grid-filter .item__selection input {
  margin-top: 10px;
  padding: 5px;
  padding-left: 11px;
  width: 80%;
  border: solid 1px #ccc;
  margin-bottom: 20px;
}

/* === Layouts === */

/* --- Iconblocks --- */

.iconblocks {
  align-items: stretch;
}

.iconblock {
  height: auto;
}

.iconblocks .row {
  --bs-gutter-x: 20px;
  --bs-gutter-y: 20px;
}

.iconblock__inner {
  position: relative;
  padding: 25px 25px 25px 85px;
  background: var(--tpl-color-main-e);
  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
  border-radius: 10px;
  height: 100%;
}

.iconblock__icon {
  position: absolute;
  left: 15px;
  top: 25px;
  display: inline-block;
}

.iconblock__icon img {
  width: 50px;
  height: 50px;
  object-position: top center;
  object-fit: contain;
}

.iconblock__title {
  font-size: 20px;
  line-height: 26px;
  font-weight: 700;
  margin-bottom: 10px;
}

.iconblock__description {
  font-size: 16px;
  line-height: 22px;
  font-weight: 300;
}

/* === Special Content  === */

.corona-infobox {
  background-image: url("../images/icons/icon_corona.png");
  background-repeat: no-repeat;
  background-color: #b73d25;
  color: #ffffff;
  padding: 15px 20px 15px 65px;
  border-radius: 4px;
  background-position: left 20px center;
  background-size: 30px;
  max-width: 420px;
  margin: 11px auto var(--tpl-spacing-content) auto;
  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
}

.deutsch-infobox {
    background-image: url("../images/icons/icon_flag_DE.png");
    background-repeat: no-repeat;
    background-color: #eee;
    color: #3c3c3c;
    padding: 15px 20px 15px 65px;
    border-radius: 4px;
    background-position: left 20px center;
    background-size: 50px;
    max-width: 420px;
    margin: 11px auto var(--tpl-spacing-content) auto;
    box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
}



.kooperation-infobox {
  display: flex;
  flex-direction: row;
  background: #efefef;
  border: solid 1px #efefef;
  border-radius: 4px;
  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
  margin-bottom: 40px;
  margin-top: 10px;
}

.kooperation-text {
  font-size: 0.9rem;
  line-height: 1.1rem;
  padding: 10px;
}

.logo_swav_whi {
  align-content: center;
  padding: 10px;
}

/* === Modalbox Alerts === */

.modal-wrapper {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  padding: 15px;
  z-index: 9999;
}

.modalbox {
  border-radius: 4px;
  background: #ffffff;
  width: 100%;
  max-width: 520px;
}

.modalbox .modal-body {
  padding: 15px 20px;
}

.modalbox .modal-footer {
  padding: 10px 20px;
  text-align: right;
}

.modalbox .alert-heading {
  margin-bottom: 5px;
}

.modalbox .alert-heading span {
  font-weight: bold;
  font-size: 18px;
  line-height: 26px;
}

.modalbox .alert {
  margin-bottom: 10px;
  padding: 10px 20px;
  border-radius: 5px;
}

.modalbox .alert:last-child {
  margin-bottom: 0;
}

.modalbox .alert p {
  font-size: 16px;
  line-height: 20px;
}

.modalbox .alert .alert-message:last-child p {
  margin-bottom: 0px;
}

.modalbox .alert-danger {
  background: #f8d7da;
  color: #842029;
}

.modalbox .alert-success {
  background: #d1e7dd;
  color: #0f5132;
}

.modalbox .alert-info {
  background: #cff4fc;
  color: #055160;
}

.modalbox .alert-warning {
  background: #fff3cd;
  color: #664d03;
}

.modalbox .btn {
  font-size: 16px;
  line-height: 16px;
  padding: 6px 12px;
}

/* === Iframes === */

.iframe-container {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%;
}

.iframe-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

#produktempfehlungen img {
  max-width: 100%;
  max-height: 250px;
}

/* ≡≡≡ Responsive ≡≡≡ */

@media (max-width: 1860px) {
  .form-newsletter .leftside {
    padding-left: 200px !important;
    padding-bottom: 40px !important;
  }
}

@media (max-width: 1700px) {
  .form-newsletter {
    background-size: auto 100% !important;
  }

  .form-newsletter .leftside {
    padding-left: 270px !important;
  }
}

@media (max-width: 1599.98px) {
  .slideshow-background {
    background-image: none;
    /*background-color: var(--tpl-color-main-a);*/
  }

  .slideshow-background figcaption {
    color: #ffffff;
  }

  .slideshow-header .slide-inner > .right {
    max-width: 685px;
  }

  .slideshow-header .slide-inner > .right img {
    width: 540px;
    height: 400px;
  }
}

@media (max-width: 1399.98px) {
  #blog .blog-items .item,
  #blog .category-intro,
  #blog .category-tags,
  .breadcrumbs,
  #article > .inner,
  .mod-tags-similar {
    padding-left: 24px;
    padding-right: 24px;
  }

  .form-newsletter .leftside {
    padding-left: 200px !important;
  }

  .mod-wip-imageblock {
    padding-left: 24px;
    padding-right: 24px;
  }

  .mod-wip-imageblock .left img {
    width: 400px;
    height: 320px;
  }

  .mod-wip-imageblock .headline-wrap .headline {
    font-size: 32px;
    line-height: 38px;
  }

  .mod-wip-imageblock .content-wrap p {
    font-size: 18px;
    line-height: 24px;
  }

  .mod-wip-imageblock .button-wrap .btn-wip {
    --tpl-btn-font-size: 16px;
    --tpl-btn-line-height: 22px;
  }

  #statcards {
    padding-left: 24px;
    padding-right: 24px;
  }

  #statcards > .top .headline-wrap .headline {
    font-size: 32px;
    line-height: 38px;
  }

  #statcards > .top .content-wrap p {
    font-size: 18px;
    line-height: 24px;
  }

  #statcards .statcard > .top {
    padding: 30px 25px 5px 25px;
  }

  #statcards > .bottom > .inner {
    align-items: flex-start;
  }

  #statcards .statcard .image-wrap img {
    height: 220px;
  }

  .cta.massageausbildung,
  .cta.ulrichpoetter {
    padding-left: 300px;
    background-position: 15px;
  }

  .cta .headline-wrap .headline {
    font-size: 30px;
    line-height: 36px;
  }

  .btn-wip {
    --tpl-btn-font-size: 16px;
    --tpl-btn-line-height: 22px;
  }
}

@media (max-width: 1199.98px) {
  .btn-wip {
    width: 100%;
  }

  .slideshow-header .slide-headline .headline {
    font-size: 22px;
    line-height: 24px;
    font-family: var(--tpl-font-sub);
    color: #fff;
  }

  .slideshow-header .slide-inner > .left {
    display: flex;
    align-items: center;
    height: auto;
    margin-right: 3px;
    margin-left: auto;
    padding-bottom: 143px;
    padding-left: 30px;
    text-align: right;
    max-width: 320px;
  }

  #article {
    padding-top: 50px;
  }

  #navbar {
    padding: 0px;
  }

  #navbar > .inner {
    display: block;
  }

  #navbar .logo-wrap {
    position: relative;
  }

  #logo {
    position: absolute;
    left: 12px;
    top: 10px;
    z-index: 999;
    height: 52px;
  }

  #navbar .mainmenu-wrap {
    text-align: right;
    margin: 0px;
    line-height: 0px;
    padding-top: 80px;
  }

  #mainmenu-toggler {
    margin-left: auto;
    display: inline-block;
    position: absolute;
    right: 12px;
    top: 22px;
  }

  #mainmenu {
    display: none;
    padding-top: 0px;
  }

  #mainmenu .menu-link {
    display: block;
    width: 100%;
    border-radius: 0px !important;
  }

  #mainmenu .lv-0 {
    display: block;
    text-align: left;
  }

  #mainmenu .lv-0 > li {
    padding: 0px;
    margin: 0px;
  }

  #mainmenu .lv-1 {
    position: relative;
    box-shadow: none;
    border-radius: 0px;
  }

  #mainmenu .lv-0 > li > .menu-link {
    font-size: 18px;
    line-height: 24px;
    font-weight: 300;
    color: var(--tpl-color-sub-a);
    background: var(--tpl-color-mobilemenu-lv0);
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    padding: 8px 12px;
  }

  #mainmenu .lv-0 > li:last-child > .menu-link {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  }

  #mainmenu .lv-0 > li.active > .menu-link {
    background: var(--tpl-color-mobilemenu-lv0-active);
    font-weight: 400;
  }

  #mainmenu .lv-1 {
    display: none;
  }

  #mainmenu .lv-1 > li > .menu-link {
    font-size: 16px;
    line-height: 22px;
    font-weight: 300;
    color: var(--tpl-color-sub-a);
    background: var(--tpl-color-mobilemenu-lv1);
    padding: 8px 12px 8px 32px;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
  }

  #mainmenu .lv-1 > li.active > .menu-link {
    background: var(--tpl-color-mobilemenu-lv1-active);
    font-weight: 400;
  }

  #navbar .shopping-cart {
    position: absolute;
    display: inline-block;
    top: 24px;
    right: 56px;
  }

  .mod-wip-imageblock .left {
    margin-right: 50px;
  }

  .mod-wip-imageblock .left::before {
    bottom: -10px;
    width: 300px;
    height: 300px;
  }

  .mod-wip-imageblock .headline-wrap {
    margin-bottom: 15px;
  }

  .mod-wip-imageblock .headline-wrap .headline {
    font-size: 28px;
    line-height: 34px;
  }

  .mod-wip-imageblock .content-wrap {
    margin-bottom: 20px;
  }

  .mod-wip-imageblock .content-wrap p {
    font-size: 16px;
    line-height: 22px;
  }

  #statcards > .top .headline-wrap .headline {
    font-size: 28px;
    line-height: 34px;
  }

  #statcards > .top .content-wrap p {
    font-size: 16px;
    line-height: 22px;
  }

  #page-products .product-teaser .image-wrap {
    transform: translateY(-70%);
  }

  #blog .item .imageside,
  #blog .item .introside {
    flex: 0 0 50% !important;
  }

  .form-newsletter .leftside {
    padding-left: 24px !important;
  }

  .form-newsletter {
    padding: 50px 0 0 0;
  }

  .mod-wip-vorteile {
    padding-left: 24px;
    padding-right: 24px;
    background: var(--tpl-color-main-d);
  }

  #vorteile::before {
    display: none;
  }

  #vorteile .headline-wrap .headline {
    font-size: 28px;
    line-height: 34px;
  }

  #vorteile .ult-tab {
    padding-left: 80px;
    margin-bottom: 40px;
  }

  #vorteile .ult-tab::before {
    top: 0px;
    width: 60px;
    height: 60px;
  }

  .mod-wip-productsteaser {
    padding-left: 24px;
    padding-right: 24px;
  }

  #products-teaser > .top .headline-wrap .headline {
    font-size: 28px;
    line-height: 34px;
  }

  #products-teaser > .top .content-wrap p {
    font-size: 16px;
    line-height: 22px;
  }

  #products-teaser .btn-wip {
    --tpl-btn-font-size: 16px;
    --tpl-btn-line-height: 22px;
  }

  #products-teaser .product-teaser {
    padding-top: 200px;
    margin-right: 30px;
  }

  #products-teaser .product-teaser:last-child::before {
    display: none;
  }

  #products-teaser .product-teaser .top {
    padding: 20px 25px;
  }

  #products-teaser .product-teaser .bottom {
    padding-left: 25px;
  }

  #testimonials > .headline-wrap .headline {
    font-size: 28px;
    line-height: 34px;
  }

  .mod-wip-testimonials {
    padding-left: 24px;
    padding-right: 24px;
  }

  #testimonials .left {
    padding: 15px 40px;
  }

  #footerbar .container-fluid {
    padding-left: 24px;
    padding-right: 24px;
  }

  #footerbar .ms-auto {
    margin-left: auto;
  }

  #footerbar .me-auto {
    margin-right: auto;
  }

  .iconblock__inner {
    padding: 20px 20px 20px 70px;
  }

  .iconblock__title {
    font-size: 18px;
    line-height: 24px;
  }

  .iconblock__icon img {
    width: 40px;
    height: 40px;
  }

  #page-products .page-header:not(.products-intro .page-header),
  #page-products .kurse-grid {
    padding-left: 24px;
    padding-right: 24px;
  }

  .mod-wip-cta {
    padding-left: 15px;
    padding-right: 15px;
  }
}

@media (max-width: 991.98px) {
  #article {
    padding-top: 40px;
    padding-bottom: 40px;
  }

  #article .image-intro {
    display: none;
  }

  .mod-wip-imageblock .left img {
    width: 300px;
    height: 240px;
  }

  .mod-wip-imageblock .left {
    margin-right: 50px;
  }

  #statcards .statcard {
    margin-right: 0px;
    margin-bottom: 30px;
  }

  #statcards > .top {
    padding-bottom: 35px;
  }

  #statcards > .top .marker {
    display: none;
  }

  #statcards > .bottom > .inner {
    display: block;
  }

  #statcards .statcard .headline-wrap .headline {
    font-size: 20px;
    line-height: 26px;
  }

  #statcards li > br {
    display: none;
  }

  #page-products .product-teaser .image-wrap img {
    width: 80%;
  }

  #page-products .product-teaser .image-wrap figure {
    text-align: center;
  }

  #blog .item {
    flex-direction: column;
    margin-bottom: 50px !important;
  }

  #blog .item .imageside {
    order: 2 !important;
  }

  #article > .inner {
    display: block;
  }

  #article > .inner > .right {
    margin-bottom: 20px;
    padding-left: 0px;
    order: 1 !important;
    max-width: none;
  }

  #article > .inner .author-mobile {
    display: block;
  }

  #article > .inner .author-desktop,
  .mod-tags-similar .col-item-3 {
    display: none;
  }

  #article .block-iv {
    padding: 24px;
  }

  #article .block-iv .headline-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  #article .block-iv .headline {
    margin-right: 0px;
    margin-left: auto;
  }

  #article .block-iv .iv-button {
    display: block;
    margin-left: 8px;
    margin-right: 0px;
  }

  #article .block-iv .content {
    display: none;
  }

  #article .block-iv ol > li,
  #article .block-iv .iv-link {
    font-size: 16px;
    line-height: 22px;
  }

  #article .block-iv .iv-link {
    display: block;
  }

  .form-newsletter .leftside {
    flex: 0 0 70% !important;
    margin-right: 20px !important;
  }

  .form-newsletter .rightside {
    flex: 0 0 30% !important;
  }

  .form-newsletter .rightside img {
    width: 100%;
  }

  #vorteile .headline-wrap {
    margin-bottom: 40px;
  }

  #vorteile .ult-tab {
    margin-bottom: 25px;
    padding-left: 60px;
  }

  #vorteile .ult-tab::before {
    width: 42px;
    height: 42px;
  }

  #vorteile .ult-headline {
    min-height: 1px;
    font-size: 18px;
    line-height: 18px;
    padding-right: 30px;
  }

  #vorteile .ult-headline::before,
  #vorteile .ult-headline::after {
    width: 16px;
    height: 2px;
    right: 8px;
  }

  #vorteile .ultima-accordion .ult-inner {
    padding-top: 15px;
  }

  #vorteile .row > div:last-child {
    margin-top: 0px;
  }

  #products-teaser > .bottom > .inner {
    display: block;
  }

  #products-teaser .product-teaser {
    margin-right: 0px;
  }

  #products-teaser .product-teaser .image-wrap img {
    height: 300px;
  }

  #testimonials .slide-inner {
    display: flex;
    flex-wrap: wrap;
    max-height: none;
  }

  #testimonials .slide-inner .right {
    order: 1;
    flex: 1 1 100%;
    position: relative;
    min-height: 1px;
    border-radius: 20px 20px 0px 0px;
  }

  #testimonials .right figure {
    display: block;
    width: 100%;
    margin: 0px;
  }

  #testimonials .right img {
    position: relative;
    width: 100%;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    border-radius: 20px 20px 0px 0px;
  }

  #testimonials .slide-inner .left {
    order: 2;
    flex: 1 1 100%;
    padding: 15px;
  }

  #testimonials .left::after {
    display: none;
  }

  .mod-wip-marken {
    padding-left: 24px;
    padding-right: 24px;
  }

  #footerbar .top .inner .mod-paymentmethods {
    flex: 0 0 60%;
  }

  #footerbar .top .inner .mod-paymentmethods img {
    width: 100%;
    min-width: 80px;
  }

  #footerbar .top .inner .mod-hotline {
    flex: 0 0 40%;
  }

  #footerbar .top .inner .mod-hotline a {
    font-size: 28px;
  }

  #page-products .product-teaser .image-wrap {
    transform: none;
    position: relative;
    top: auto;
    left: auto;
    bottom: auto;
    right: auto;
    padding: 0px;
  }

  #page-products .product-teaser {
    padding-top: 0px;
    margin-bottom: 30px;
  }

  #page-products .product-teaser .top {
    padding: 15px 20px 20px 20px;
  }

  #product-overview > .row {
    --bs-gutter-x: 30px;
  }

  #page-products .product-teaser .bottom {
    padding: 15px 20px 15px 20px;
  }

  #page-products .product-teaser > .inner {
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2);
  }

  #page-products .product-teaser .link-wrap a {
    transform-origin: 6px 9px;
  }

  #footerbar .mod-hotline a .fa {
    top: 1px;
  }

  .cta {
    padding: 20px 35px 20px 300px;
  }

  .cta.massageausbildung {
    padding-left: 300px;
    background-position: 15px;
  }

  .cta .headline-wrap .headline {
    font-size: 26px;
    line-height: 32px;
  }

  .cta.massageausbildung {
    background-size: 160px;
    padding-left: 200px;
  }
}

@media (max-width: 767.98px) {
  .slideshow-header .slide-inner > .left {
    /*display:none;*/
    opacity: 0 !important;
  }

  .slideshow-header .slide-inner > .right {
    padding: 0px 85px 85px 0px;
  }

  .slideshow-header .slide-inner > .right img {
    /*width: 360px;*/
    width: 100%;
    height: 62vh;
    /*max-height: 360px;*/
    min-width: 360px;
  }

  .slideshow-header figure :not(.slick-slide:nth-child(1) figure) {
    margin-bottom: 0px;
    margin-left: -170px;
  }

  .slick-slide:nth-child(1) .slide-inner > .right img {
    /*border-radius: 20px;
        box-shadow: 0px 0px 85px rgba(0, 0, 0, 0.1);*/

    width: 320px;
    height: auto;
    object-fit: cover;
    object-position: center;
    margin-left: 30px;
    display: block;
    position: absolute;
  }

  #testimonials .right img {
    width: 100%;
    margin-left: 0px;
    height: auto;
    object-fit: cover;
    object-position: center;
    display: block;
    position: absolute;
  }

  #testimonials .slide-inner .right {
    height: 260px;
  }

  #blog .blog-items .item,
  #blog .category-intro,
  #blog .category-tags,
  .breadcrumbs,
  #article > .inner,
  .mod-tags-similar {
    padding-left: 15px;
    padding-right: 15px;
  }

  #mainmenu .lv-0 > li > .menu-link {
    font-size: 16px;
    line-height: 22px;
    padding: 7px 10px;
  }

  #mainmenu .lv-1 > li > .menu-link {
    font-size: 14px;
    line-height: 20px;
    padding: 7px 10px 7px 20px;
  }

  .mod-wip-imageblock .imagetextblock {
    /*display: block;*/
    display: flex;
    flex-direction: column-reverse;
  }

  .mod-wip-imageblock .left {
    margin: 80px 0px 0px 0px;
    text-align: center;
  }

  .mod-wip-imageblock .left::before {
    left: calc(50% - 250px);
  }

  .mod-wip-imageblock .right {
    max-width: none;
  }

  .mod-wip-imageblock .headline-wrap .headline {
    font-size: 24px;
    line-height: 30px;
  }

  .mod-wip-imageblock .content-wrap p {
    font-size: 14px;
    line-height: 20px;
  }

  .mod-wip-imageblock .button-wrap .btn-wip {
    --tpl-btn-font-size: 14px;
    --tpl-btn-line-height: 20px;
  }

  #statcards > .top .headline-wrap .headline {
    font-size: 24px;
    line-height: 30px;
  }

  #statcards > .top .content-wrap p {
    font-size: 14px;
    line-height: 20px;
  }

  .form-newsletter .rightside {
    display: none !important;
  }

  .form-newsletter .leftside {
    flex: 0 0 100% !important;
    margin-right: 0px !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  .form-newsletter .headline-wrap .headline {
    font-size: 30px !important;
    line-height: 36px !important;
  }

  #praxislogos .slideshow {
    padding-left: 35px;
    padding-right: 35px;
  }

  #praxislogos .slick-prev,
  #praxislogos .slick-next {
    width: 20px;
    height: 20px;
  }

  #footerbar {
    padding-top: 0;
  }

  #footerbar .top .inner {
    flex-direction: column-reverse;
    gap: 30px;
    align-items: center !important;
  }

  #footerbar .module-headline {
    text-align: center;
  }

  #footerbar .center .row.gx-5 {
    display: block;
  }

  #footerbar .center .row.gx-5 > div {
    width: 100%;
    text-align: center;
    margin-top: 30px;
  }

  #footerbar .center .row.gx-5 > div:first-child {
    margin-top: 0;
  }

  .mod-socialmedia .social-media {
    justify-content: center;
  }

  #footerbar .mod-socialmedia .social-media > .item:first-child {
    margin-left: unset;
  }

  #siegel {
    padding-top: 0;
  }

  .iconblock__inner {
    padding: 80px 15px 15px 15px;
    text-align: center;
  }

  .iconblock__icon img {
    width: 60px;
    height: 60px;
  }

  .iconblock__icon {
    left: calc(50% - 30px);
    top: 15px;
  }

  #produktempfehlungen img {
    max-width: 800px;
    width: 100%;
  }

  #article .block-iv {
    padding: 20px;
  }

  #page-product .attributes {
    margin-top: 30px;
  }
}

@media (max-width: 575.98px) {
  #topbar .inner {
    text-align: center;
    display: block;
  }

  #topbar .links-wrap {
    display: inline-block;
  }

  #topbar .search-wrap {
    display: none;
  }

  .mod-tags-similar .items.row > div {
    margin-bottom: 25px;
  }

  .mod-tags-similar .items.row > div:nth-child(2) {
    margin-bottom: 0;
  }

  .form-newsletter .headline-wrap .headline {
    font-size: 24px !important;
    line-height: 30px !important;
  }

  .form-newsletter .headline-wrap .headline br {
    display: none;
  }

  .form-newsletter .control-group {
    margin: 0px 0px 25px 0px !important;
    flex: 0 0 100% !important;
  }

  #vorteile .ult-tab {
    padding-top: 50px;
    padding-left: 0px;
  }

  #vorteile .ult-tab::before {
    left: calc(50% - 21px);
  }

  #products-teaser .product-teaser {
    padding-top: 150px;
  }

  #products-teaser .product-teaser .image-wrap img {
    height: 260px;
  }

  #footerbar .mod-socialmedia {
    margin-left: 0px;
  }

  #siegel .siegel-reihe > .siegel {
    margin-right: 0px;
  }

  .cta {
    text-align: center;
  }

  .cta.massageausbildung,
  .cta.ulrichpoetter {
    background-size: 160px;
    padding-left: 20px;
    padding-top: 180px;
    background-position: 50% 20px;
  }

  .cta .content-wrap {
    display: block;
    text-align: center;
  }

  .cta .content-wrap .btn {
    margin: 10px auto 0px auto;
  }

  .kurstermine__desktop {
    display: none;
  }

  .kurstermine__mobile {
    display: block;
  }

  .kurstermine__mobile .kurstermin {
    margin-bottom: 15px;
    background: var(--tpl-color-main-e);
  }

  .kurstermine__mobile .kurstermin .title {
    background: var(--tpl-color-main-d);
    color: var(--tpl-color-main-a);
    font-size: 16px;
    line-height: 22px;
    font-weight: bold;
    padding: 6px 12px;
    border-radius: 5px 5px 0px 0px;
  }

  .kurstermine__mobile .kurstermin .data {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 5px 10px;
  }

  .kurstermine__mobile .kurstermin .data__label {
    flex: 1 1 120px;
    width: 100%;
    max-width: 120px;
    font-weight: bold;
  }

  .kurstermine__mobile .kurstermin .kurstermin__bar {
    width: 75px;
  }

  #article .block-iv {
    padding: 12px 18px;
  }

  #article .block-iv .headline {
    font-size: 16px;
    line-height: 22px;
  }

  .mod-breadcrumbs {
    display: none;
  }
}

@media (max-width: 450px) {
  #siegel .siegel-reihe {
    flex-direction: column-reverse;
    align-items: center;
    gap: 20px;
  }

  #siegel .siegel-reihe > .siegel:last-child {
    margin-right: unset;
  }

  #legalsmenu .menu {
    flex-direction: column;
    justify-content: center;
    gap: 10px;
  }

  #legalsmenu .lv-0 > li:first-child {
    margin-left: unset;
  }

  #legalsmenu .lv-0 > li:last-child {
    margin-right: unset;
  }

  #legalsmenu .lv-0 > li::after {
    display: none;
  }
}