/*
Theme Name: the7dtchild
Author: Dream-Theme
Author URI: http://dream-theme.com/
Description: The7 is perfectly scalable, performance and SEO optimized, responsive, retina ready multipurpose WordPress theme. It will fit every site – big or small. From huge corporate portals to studio or personal sites – The7 will become a great foundation for your next project!
Version: 1.0.0
License: This WordPress theme is comprised of two parts: (1) The PHP code and integrated HTML are licensed under the GPL license as is WordPress itself.  You will find a copy of the license text in the same directory as this text file. Or you can read it here: http://wordpress.org/about/gpl/ (2) All other parts of the theme including, but not limited to the CSS code, images, and design are licensed according to the license purchased. Read about licensing details here: http://themeforest.net/licenses/regular_extended
Template: dt-the7
*/

/* -------------------------------------------------------------------------- */
/*                         //NOTE Media + Tastenkürzel                        */
/* -------------------------------------------------------------------------- */

/*


FARBEN
------

Hintergrund hellgrau

color: #f4f2ef;
rgb(244,242,239);

----------------------------

Linkfarbe grün

color: #aadb1e;
rgb(170,219,30);

----------------------------

dunkelgrau Schrift und Footer

color: #47474a;
rgb(71,71,74);


----------------------------


@media (max-width: 449px) {
    Handy klein
}

@media (min-width: 450px ) {
    Handy größer
}

@media (min-width: 768px ) {
    beginn der 1-Spaltigkeit
}

@media (min-width: 992px ) {

}

@media (min-width: 1500px ) {

}

________________________________________________________________________________
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
	…
}
________________________________________________________________________________

*/

/*
Tastenkürzel um Kommentarblöcke zu erzeugen
*/

/* Shift + Alt + X */
/* -------------------------------------------------------------------------- */
/*                               Shift + Alt + X                              */
/* -------------------------------------------------------------------------- */

/* Alt + X */
/* --------------------------------- Alt + X -------------------------------- */

/* Alt + Y */
/* -------------------------------------------------------------------------- */

/* Strg + # */
/*  */

/* -------------------------------------------------------------------------- */
/*                                //NOTE Fonts                                */
/* -------------------------------------------------------------------------- */

/* playfair-display-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Playfair Display";
  font-style: normal;
  font-weight: 400;
  src: url("./fonts/playfair-display-v36-latin-regular.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* playfair-display-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Playfair Display";
  font-style: italic;
  font-weight: 400;
  src: url("./fonts/playfair-display-v36-latin-italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-100 - latin */
@font-face {
  font-display: swap;
  /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: normal;
  font-weight: 100;
  src: url("./fonts/roboto-v30-latin-100.woff2") format("woff2");
  /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-300 - latin */
@font-face {
  font-display: swap;
  /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  src: url("./fonts/roboto-v30-latin-300.woff2") format("woff2");
  /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-regular - latin */
@font-face {
  font-display: swap;
  /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  src: url("./fonts/roboto-v30-latin-regular.woff2") format("woff2");
  /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  src: url("./fonts/roboto-v30-latin-700.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: normal;
  font-weight: 900;
  src: url("./fonts/roboto-v30-latin-900.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* -------------------------------------------------------------------------- */
/* ------------------------------- Kontrolltag ------------------------------ */
/* nur aktivieren um zu kontrollieren das jede Class überschrieben wird */

/* 
* {
    font-size: 10px !important;
    color: blue !important;
} 
*/

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

/* -------------------------------------------------------------------------- */
/*                            //NOTE The7 allgemein                           */
/* -------------------------------------------------------------------------- */

body {
  /* background-color: rgb(212, 203, 190, 0.25);
  background: rgb(212, 203, 190, 0.25); */
  background-color: #f4f2ef;
  background: #f4f2ef;
  -webkit-font-smoothing: antialiased;
}

body,
html {
  font-size: 13px;
}

@media screen and (min-width: 768px) {
  body,
  html {
    font-size: 15px;
  }
}

@media screen and (min-width: 1200px) {
  body,
  html {
    font-size: 16px;
  }
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Playfair Display";
  line-height: 1.3;
  font-weight: 400;
  margin: 0;
  padding: 0;
  margin-bottom: 1.25rem;
  margin-top: 1.25rem;
}

h1 {
  font-size: 2rem;
  letter-spacing: -0.5px;
}

h2 {
  font-size: 1.7rem;
}

h3 {
  font-size: 1.7rem;
}

h4,
h5 {
  font-size: 1.4rem;
}

h6 {
  font-size: 1.2rem;
}

a:link,
a:visited {
  color: #aadb1e;
  font-weight: 300;
  text-decoration: none;
}

a:hover,
a:active {
  text-decoration: underline;
}

p,
li {
  font-family: "Roboto";
  font-weight: 300;
}

.font400,
.font400 p {
  font-weight: 400;
}

@media screen and (min-width: 768px) {
  p,
  li {
  }
}

b,
strong {
  font-weight: 700;
}

/* kein unterer Abstand von Editorelementen */
.wpb_button,
.wpb_content_element,
ul.wpb_thumbnails-fluid > li {
  margin-bottom: 0;
}

/* wird nicht mehr benötigt - maximale Breite zentriert 
.conmaxwidth {
  max-width: 1030px;
  margin: 0 auto;
}


.conminwidth {
  max-width: 768px;
  margin: 0 auto;
}
*/

/* ab hier temporäre Startseite */

.icenter {
  text-align: left;
}

.center * {
  text-align: center;
}

.tbold p {
  font-family: "Playfair Display";
  font-size: 1.6rem;
  line-height: 1.3;
}

.tnormal p {
  font-family: "Roboto";
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.5;
}

@media (min-width: 992px) and (max-width: 11100px) {
  .tbold p {
    font-size: 1.4rem;
  }
}

@media (max-width: 992px) {
  .tnormal p {
    font-size: 1rem;
  }
}

.dsmax {
  width: 100%;
  max-width: 350px;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}

/* nur bei temporärer Startseite !!! */
a.flatlinks {
  color: #47474a;
  position: relative;
  z-index: 2;
  text-decoration: none !important;
  display: inline-block;
}

a.flatlinks:hover {
}

a.flatlinks::before {
  content: "";
  background-color: #aadb1e;
  position: absolute;
  left: -2px;
  bottom: 1px;
  width: calc(100% + 4px) !important;
  height: 2px;
  z-index: -1;
  transition: all 0.3s ease-in-out;
}

a.flatlinks:hover::before {
  background-color: #47474a;
  bottom: 1px;
  height: 2px;
  z-index: -1;
}

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

.spincontainer {
  position: relative;
}

@media (max-width: 450px) {
  .spincontainer.spin_mobil {
    max-width: 200px;
  }
}

@media (max-width: 767.999px) {
  .spincontainer.spin_mobil {
    max-width: 60vw;
  }
}

.spincontainer img {
  margin: 0;
  padding: 0;
}

.bildz1 {
  position: relative;
  top: 0;
  left: 0;
  z-index: 1;
}

.bildz2 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  animation-name: spin1;
  animation-duration: 20s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

.bildz3 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  animation-name: spin2;
  animation-duration: 40s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

.bildz4 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 4;
  animation-name: spin3;
  animation-duration: 60s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@keyframes spin1 {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

@keyframes spin2 {
  from {
    transform: rotate(360deg);
  }

  to {
    transform: rotate(0deg);
  }
}

@keyframes spin3 {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

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

/* jedem Absatz mehr Abstand nach unten.... */
p,
.likep {
  font-size: 0.95rem;
  line-height: 1.5 !important;
  padding-bottom: 20px;
  margin-bottom: 0 !important;
}

.p_nobottom {
  padding-bottom: 0;
}

.p_nopad {
  padding: 0 !important;
}

.tcenter,
.tcenter p {
  text-align: center;
}

.tblack,
.tblack * {
  color: #000000 !important;
}

.twhite,
.twhite * {
  color: #ffffff !important;
}

/* -------------------------------------------------------------------------- */
/*                              //NOTE Schriften                              */
/* -------------------------------------------------------------------------- */

/* große Schrift wie Überschrift */
.h2like,
.h2like p,
.h2like_c,
.h2like_c2 p,
.h2like_c p {
  font-family: "Playfair Display";
  font-weight: 400;
  font-size: 2rem;
  line-height: 1.3;
  padding-bottom: 1.25rem;
}

@media (min-width: 768px) {
  .h2like_c,
  .h2like_c2 {
    margin: 3rem auto 3rem auto;
  }
  .h2like_c,
  .h2like_c p {
    text-align: center;
    max-width: 700px;
  }
  .h2like_c2 p {
    text-align: center;
    max-width: 800px;
  }
}

/* shop Überschriften und groß */

.h3shop,
.h3shop p {
  font-family: "Playfair Display";
  font-weight: 400;
  font-size: 1.7rem;
  line-height: 1.3;
  padding-bottom: 1.25rem;
  margin-top: -7.5px;
}

/* mittlere Schrift wie Überschrift */
.h4like,
.h4like p {
  font-family: "Playfair Display";
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 1.3;
  padding: 0.75rem 0 2rem 0;
}

.h5shop,
.h5shop p {
  font-family: "Playfair Display";
  font-weight: 400;
  font-size: 1.2rem;
  line-height: 1.3;
  padding: 0.75rem 0 1rem 0;
}

.gedehnt,
.gedehnt p {
  letter-spacing: 0.4em;
}

/* italic Schrift */
.font_i {
  font-style: italic;
}

/* ---------------------------------- Links --------------------------------- */

/* Icons - Winkel */
.icon_winkel::before {
  display: inline-block;
  content: "\f009";
  font-family: icomoon-the7-font !important;
  font-size: 1.2rem;
  font-style: normal;
  font-weight: 400;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  transition: transform 0.3s ease;
  padding-top: 15px;
}

a.icon_winkel:link,
a.icon_winkel:visited {
  color: #aadb1e;
  text-decoration: none;
}

a.flatlink:link,
a.flatlink:visited {
  color: #47474a;
  text-decoration: underline solid #aadb1e 2px;
}

a.flatlink:hover,
a.flatlink:active,
a.flatlink_a {
  color: #aadb1e;
}

/* -------------------------------------------------------------------------- */
/*                                 //NOTE Menü                                */
/* -------------------------------------------------------------------------- */

@media (min-width: 1200px) {
  /* Hamburger zum Content hin versetzen */
  .top-line-right {
    justify-content: unset;
    position: relative;
  }

  .menu-toggle {
    margin: 0px 0px 0px 500px;
  }
}

/* dickere Linien */
.type-9-menu-icon .menu-toggle .lines-button .menu-line:nth-child(2),
.type-9-mobile-menu-icon
  .dt-mobile-menu-icon
  .lines-button
  .menu-line:nth-child(2) {
  top: 8px;
  left: 12px;
  width: 30px;
}

.type-9-menu-icon .menu-toggle .lines-button .menu-line:nth-child(3),
.type-9-mobile-menu-icon
  .dt-mobile-menu-icon
  .lines-button
  .menu-line:nth-child(3) {
  top: 16px;
}

.type-9-menu-icon .menu-toggle .lines-button .menu-line,
.type-9-mobile-menu-icon .dt-mobile-menu-icon .lines-button .menu-line {
  height: 3px;
}

/* Plus-Zeichen aus */
.sub-downwards .main-nav > li > .next-level-button svg {
  display: none;
}

/* neu Pfeil */
.sub-downwards .main-nav > li > .next-level-button::before {
  display: block;
  content: "\f005";
  /* font: normal normal normal 14px/1 FontAwesome; */
  font-family: icomoon-the7-font !important;
  font-style: normal;
  font-weight: normal;
  color: #ffffff;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.sub-downwards .main-nav > li > .next-level-button:hover::before {
  color: #aadb1e !important;
}

/* wenn geklickt neuen Pfeil drehen */
.dt-mobile-header li.has-children.open-sub > .next-level-button,
.sub-downwards li.has-children.open-sub > .next-level-button,
.dt-mobile-header li.has-children.open-sub > .next-level-button::before,
.sub-downwards li.has-children.open-sub > .next-level-button::before {
  transform: rotate(180deg);
  color: #aadb1e !important;
}

/* Menü oberste Ebene - Desktop */
.main-nav > li > a .menu-text {
  font-family: "Roboto";
  font-weight: 400;
  font-size: 1.45rem !important;
}

/* Menü oberste Ebene - Mobil */
.mobile-main-nav li > a .menu-text {
  font-family: "Roboto";
  font-weight: 400;
  font-size: 1.2rem;
  line-height: 1.5;
}

/* Desktop Menü */
.main-nav > li > a .menu-text {
  font-size: 1.2rem;
  line-height: 1.5;
}

.dt-mobile-header * {
  font-size: 1.2rem;
  line-height: 1.5;
}

/* Untermenu */
.main-nav .sub-nav > li > a .menu-text {
  font-family: "Roboto";
  font-weight: 300;
  font-size: 1.2rem !important;
}

/* blind-Logo im Overlay-Menü aus */
.side-header.h-center .branding {
  display: none;
}

.overlay-navigation .side-header .header-bar {
  width: 340px;
  padding: 0px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ------------------ eingerücktes immer offenes Untermenü ------------------ */

.main-nav > li.umoffen > a .menu-text {
	font-size: 1rem !important;
	line-height: 1 !important;
}

.main-nav > li.umoffen > a {
	margin: 0 0 6px 0 !important;
	/* padding: 5px 5px 5px 5px; */
}


.main-nav > li.ams-shop.umoffen > a {
	margin-top: -6px !important;
	/* padding: 5px 5px 5px 5px; */
}


/* -------------------------------------------------------------------------- */
/*                               //NOTE Sprache                               */
/* -------------------------------------------------------------------------- */

/* Desktop - Position Sprachschalter rechts neben scroll-top */

#trp-floater-ls.trp-bottom-right {
  right: calc(50% - 520px);
}

@media (min-width: 1420px) {
  #trp-floater-ls.trp-bottom-right {
    right: calc(50% - 690px);
  }
}

@media (max-width: 1160px) {
  #trp-floater-ls.trp-bottom-right {
    display: none;
  }
}

/* Höhe */
#trp-floater-ls {
  height: 50px;
  z-index: 7555;
}

.trp-language-switcher-container.trp-floater-ls-names.trp-bottom-right.trp-color-dark {
  min-width: 100px;
}

#trp-floater-ls-current-language a,
#trp-floater-ls-language-list a {
  font-family: "Roboto";
  font-weight: 500;
}

/* Sprachumschalter im Menü */

ul#header_microwidget2-menu {
  margin-top: 35px;
}

#header_microwidget2-menu li > a .trp-ls-language-name:hover,
#header_microwidget2-menu
  li.current-language-menu-item
  > a
  .trp-ls-language-name {
  color: #aadb1e;
  text-decoration: none;
}

#header_microwidget2-menu li > a .trp-ls-language-name {
  color: #ffffff;
}

/* Sprachumschalter für Footer siehe unten */

/* -------------------------------------------------------------------------- */
/*                                //NOTE Layout                               */
/* -------------------------------------------------------------------------- */

@media (min-width: 992px) {
  .over {
    position: absolute;
    text-align: center;
    margin-left: -35px;
    z-index: 9;
  }

  .over_center {
    width: calc(50% - 80px);
    padding: 40px;
    text-align: left;
    margin: auto;
    background-color: #ffffff;
  }

  .over_center p:last-child {
    padding-bottom: 0;
  }
}

@media (min-width: 992px) {
  .over_single_right {
    margin-left: -50%;
    /* margin-top: -10px; */
    padding: 40px;
    background-color: #ffffff;
  }

  .over_single_right p:last-child {
    padding-bottom: 0;
  }
}

@media (min-width: 768px) {
  /* Element über Slider Home-Seite */
  .container_1_3 {
    position: relative;
    right: 0;
    top: 0;
    z-index: 9;
  }

  .inhalt_1_3 {
    /* Breite minus padding rechts und links */
    width: calc(50% - 80px);
    padding: 40px;
    min-height: 100px;
    text-align: left;
    margin: -150px 0 0 auto;
    background-color: #ffffff;
  }

  .inhalt_1_3 p:last-child {
    padding-bottom: 0;
  }

  .container_1_3_shop {
    position: absolute;
    left: 0 !important;
    /* top: 0; */
    z-index: 9;
  }

  .inhalt_1_3_shop {
    /* Breite minus padding rechts und links */
    width: calc(50% - 80px);
    padding: 40px;
    min-height: 100px;
    text-align: left;
    margin: 0 0 -35px 0;
    background-color: #ffffff;
  }

  /* hebt einen Bildcontainer hoch Abstand von oben -25px */
  .choch {
    margin-top: -125px;
  }

  /* ---- */

  .container_1_3_left {
    position: absolute;
    z-index: 9;
  }
  .inhalt_1_3_left_c {
    /* Breite minus padding rechts und links */
    width: calc(50% - 80px);
    padding: 40px;
    margin-top: -25px;
    min-height: 100px;
    text-align: left;
    background-color: #ffffff;
  }

  .inhalt_1_3_left_c p:last-child {
    padding-bottom: 0;
  }

  .inhalt_1_3_left_d {
    /* Breite minus padding rechts und links */
    width: calc(50% - 80px);
    padding: 40px;
    margin-bottom: 50px;
    min-height: 100px;
    text-align: left;
    background-color: #ffffff;
  }

  .inhalt_1_3_left_d p:last-child {
    padding-bottom: 0;
  }
}

/* -------------------------------------------------------------------------- */
/*                               Makin of Seite                               */
/* -------------------------------------------------------------------------- */

@media (min-width: 768px) {
  .container_1_2_left {
    position: relative;
    right: 0;
    top: 0;
    z-index: 9;
  }
  .inhalt_1_2_left_c {
    width: calc(50% - 80px);
    padding: 40px;
    margin-top: -400px;

    min-height: 500px;
    text-align: left;
    background-color: #ffffff;
  }

  .inhalt_1_2_left_c p:last-child {
    padding-bottom: 0;
  }
}


@media (min-width: 768px) {
  .over_mo {
    position: relative;
    /* text-align: center; */
    margin-left: -35px;
margin-top: -220px;
    z-index: 9;
  }

  .over_center_mo {
    width: calc(50% - 80px);
    padding: 40px;
    text-align: left;
    margin: auto; 
        background-color: #ffffff;
  }

  .over_center_mo p:last-child {
    padding-bottom: 0;
  }

  .over_mo_imgright {
    margin-top: 125px;
  }

/* ----------------------------- Making of unten ---------------------------- */

.container_1_3_mo {
  position: relative;
  right: 0;
  top: 0;
  z-index: 9;
}

.inhalt_1_3_mo {
  width: calc(50% - 92.5px);
  padding: 40px;
  min-height: 100px;
  text-align: left;
  margin: -250px 0 -250px auto;
  background-color: #ffffff;
}

.inhalt_1_3_mo p:last-child {
  padding-bottom: 0;
}
}



@media (min-width: 768px) {
  .container_1_2_left_mo {
    position: relative;
    right: 0;
    top: 0;
    z-index: 9;
  }
  .inhalt_1_2_left_c_mo {
    width: 60%;
    padding: 40px;
    margin-top: -240px;
    min-height: 100px;
    text-align: left;
    background-color: #ffffff;
  }

  .inhalt_1_2_left_c_mo p:last-child {
    padding-bottom: 0;
  }

  .img_mo_u {
    padding-left: 80px;
  }
  .img_mo_uright {
    margin-top: 340px;
  }

  .over_sd {
    position: relative;
    /* text-align: center; */
    margin-left: -35px;
margin-top: -250px;
margin-bottom: -180px;
    z-index: 9;
  }

}

/* --------------------------- Showroom Düsseldorf -------------------------- */



@media (min-width: 768px) {

  .inhalt_sd {
    width: calc(50% - 80px);
    padding: 40px;
    margin-top: -200px;

    min-height: 100px;
    text-align: left;
    background-color: #ffffff;
  }

  .inhalt_sd p:last-child {
    padding-bottom: 0;
  }
}

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

/* Startseite Brandcontainer */
@media (min-width: 768px) {
  .whitebg {
    background-color: #ffffff;
    margin: 0;
    padding: 40px 25px 15px 25px;
  }
}

/* --------------------------------- Slider --------------------------------- */
/* keine grüne Einfärbung bei hover */
.rollover i,
.post-rollover i,
.rollover-video i,
.enable-bg-rollover .post-thumbnail-rollover::after,
.enable-bg-rollover .gallery-rollover,
.enable-bg-rollover.hover-scale figure::after {
  background-color: transparent;
}

@media (max-width: 767.999px) {
  /* dots mobil kleiner */
  .gallery-carousel-shortcode.gallery-carousel-shortcode-id-81cc2ba67431b935a09bd11473b22a2d
    .owl-dot {
    width: 30px !important;
    height: 30px !important;
    margin: 0 5px;
  }
}

/* -------------------- ab hier Interior und Styles-Seite ------------------- */

/* Pfeile ohne Unterstrich */
a.owl-prev:hover,
a.owl-next:hover {
  text-decoration: none !important;
}

/* -------------------------------------------------------------------------- */
/* funktioniert so nicht */
.animate {
  opacity: 0;
  transition: 0.3s ease-in;
  -ms-transform: translate(0px, 70px);
  -webkit-transform: translate(0px, 70px);
  transform: translate(0px, 70px);
}

.animate.showit {
  opacity: 1;
  -ms-transform: translate(0px, 0px);
  -webkit-transform: translate(0px, 0px);
  transform: translate(0px, 0px);
}
/* -------------------------------------------------------------------------- */

/* ------------------------------- About-Seite ------------------------------ */

@media (min-width: 768px) {
  .about_rad_oben {
    position: relative;
    z-index: 99;
    padding: 20px 40px 20px 40px;
    background-color: #ffffff;
    margin-bottom: -8rem;
  }

  .about_rad_unten {
    position: relative;
    z-index: 99;
    padding: 20px 40px 20px 40px;
    background-color: #ffffff;
    margin-top: -8rem;
  }

  .about_rad_mitte_over {
    position: absolute;
    z-index: 99;
  }
  .about_rad_mitte {
    padding: 20px 40px 20px 40px;
    background-color: #ffffff;
    width: 36%;
    margin-top: -25px;
    min-height: 100px;
  }
}

/* -------------------------------------------------------------------------- */
/*                               //NOTE Projekte                              */
/* -------------------------------------------------------------------------- */

/* Filter Übersichtsseite */

ul.vc_grid-filter {
  margin: 0px 0 50px -10px;
}
ul.vc_grid-filter li {
  font-weight: 400;
}

/* active Auswahl */
.vc_grid-filter.vc_grid-filter-color-grey > .vc_grid-filter-item.vc_active,
.vc_grid-filter.vc_grid-filter-color-grey > .vc_grid-filter-item:hover {
  background-color: transparent;
  font-weight: 400;
  text-decoration: underline solid #aadb1e 2px;
}

.vc_gitem-post-data a {
  color: #47474a;
  font-weight: 400;
}

.abstand_uebersicht {
  margin: 1rem 0 2rem 0;
}

/* Abstand nach Navigation */
.postbottom {
  padding-top: 2rem;
}

/* -------------------------------------------------------------------------- */
/* Tabellen ähnliche Anzeige für Projekte Location, Services, usw */

.projekt-table {
  display: table;
}

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

.projekt-table-cell {
  display: table-cell;
}

/* rechte Tabellenseite */
.projekt-table-cell:nth-child(2) {
  padding-left: 20px;
}

@media (min-width: 768px) and (max-width: 991px) {
  .projekt-table {
    display: block;
  }
  .projekt-table-row {
    display: block;
  }
  .projekt-table-cell {
    display: block;
  }
  /* rechte Tabellenseite */
  .projekt-table-cell:nth-child(2) {
    padding-left: 0;
    padding-bottom: 0.75rem;
  }
}

@media (min-width: 768px) {
  .projekt-table {
    padding-top: 3rem;
  }
}

/* linke Tabellenseite */
.projekt-table-cell:nth-child(1) {
  font-family: "Roboto";
  font-weight: 300;
  font-size: 0.95rem;
  line-height: 1.5;
}

/* rechte Tabellenseite */
.projekt-table-cell:nth-child(2) {
  font-family: "Roboto";
  font-weight: 400;
  font-size: 0.95rem;
  line-height: 1.5;
}

/* -------------------------------- Teppiche -------------------------------- */

@media (min-width: 768px) {
  .halbe_breite {
    max-width: 50%;
  }
}

/* -------------------------------------------------------------------------- */
/*                                 //NOTE Shop                                */
/* -------------------------------------------------------------------------- */

/* -------------------------- Shop Übersichtsseite -------------------------- */

a.uebercontentlink {
  text-decoration: none;
  color: #47474a !important;
  text-align: center;
}

a.uebercontentlink_ob {
  text-decoration: none;
  color: #47474a !important;
  text-align: center;
}

.uebercontent {
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: space-around;
  /* justify-content: space-between; */
  align-items: center;
  padding: 3rem 0 3rem 0;
}

.uebercontent h3 {
  margin-top: 0;
}

.uebersicht50 > .vc_column_container > .vc_column-inner > .wpb_wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 10px;
  /* column-gap: 10px; */
}

.uebersicht50
  > .vc_column_container
  > .vc_column-inner
  > .wpb_wrapper
  > .wpb_content_element {
  background-color: #ffffff;
  /* aspect-ratio: 1 / 1.2;*/
  width: 100%;
  position: relative;
}

a.bgi::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 10px;
  right: 10px;
  bottom: 10px;
  border: 1px solid #ffffff;
  z-index: 5;
}

.hoverbg {
  position: absolute;
  top: 57%;
  left: 0;
  right: 0;
  text-align: center;
  z-index: 4;
}

@media (min-width: 768px) {
  .hoverbg {
    top: 55%;
  }
}

@media (min-width: 836px) {
  .hoverbg {
    top: 58.8%;
  }
}

@media (min-width: 1036px) {
  .hoverbg {
    top: 59.6%;
  }
}

@media (min-width: 1200px) {
  .hoverbg {
    top: 58.9%;
  }
}

a.uebercontentlink_ob {
  display: block;
  text-decoration: none;
  background-color: #f4f2ef;
  /* border: 1px solid #aadb1e; */
}

a.uebercontentlink_ob::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 10px;
  right: 10px;
  bottom: 10px;
  border: 1px solid #aadb1e;
  z-index: 5;
}

a.uebercontentlink:hover,
a.uebercontentlink_ob:hover {
  box-shadow: 0px 5px 13px 0px rgba(0, 0, 0, 0.35); /* Sanfter Schatten nach außen */
}

@media (min-width: 768px) {
  .uebersicht50 > .vc_column_container > .vc_column-inner > .wpb_wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    row-gap: 10px;
    /* column-gap: 10px; */
  }

  .uebersicht50
    > .vc_column_container
    > .vc_column-inner
    > .wpb_wrapper
    > .wpb_content_element {
    background-color: #ffffff;
    aspect-ratio: 1 / 1.3;
    width: calc(50% - 5px);
    position: relative;
  }

  .uebercontent {
    margin-bottom: 0;
    padding: 0;
  }

  a.uebercontentlink {
    position: absolute;
    width: 100%;
    height: 100%;
  }

  a.uebercontentlink_ob {
    position: absolute;
    width: 100%;
    height: 100%;
    text-decoration: none;
    background-color: #f4f2ef;
    /* border: 1px solid #aadb1e; */
  }

  img.ueberthumb {
    margin-bottom: -1rem;
  }
}

img.ueberthumb {
  max-width: 66%;
  height: auto;
}

.uebercontent p {
  /* padding: 0 2rem 0 2rem; */
  width: 70%;
  margin: auto;
}

@media (max-width: 768px) {
  .uebercontentlink.bgi {
    display: block;
    background-size: cover;

    /* height: calc(125vw - 40px); */

    aspect-ratio: 1 / 1.3;
    width: 100%;
  }
}

/* Backgroundimage */
.uebercontentlink.bgi {
  display: block;
  background-size: cover;
}

.bgi13 {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 200px;
  background-size: cover;
}

/* ----------------------------- Musterservices ----------------------------- */

@media (min-width: 768px) {
  .muster
    > .vc_column_container
    > .vc_column-inner
    > .wpb_wrapper
    > .wpb_raw_html
    > .wpb_wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    row-gap: 10px;
  }

  .muster_left {
    position: relative;
    width: calc(67% - 60px);
    background-color: #ffffff;
    margin: 0;
    padding: 40px 25px 15px 25px;
  }

  .muster_right {
    position: relative;
    width: 33%;
  }
  .muster_bg {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
  }

  .muster_left {
    padding: 40px 25px 15px 35px;
  }
}

@media (min-width: 768px) {
  .show_right {
    position: relative;
    width: calc(55% - 60px);
    background-color: #ffffff;
    margin: 0;
    padding: 40px 25px 15px 25px;
  }

  .show_left {
    position: relative;
    width: 45%;
  }
  .muster_bg {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
  }

  .show_right {
    padding: 40px 25px 15px 35px;
  }
}

@media (max-width: 768px) {
  .muster_bg.show_mob {
    position: relative;
    width: 100%;
    height: 70vw;
    background-size: contain;
    background-repeat: no-repeat;
    margin-top: -1rem;
    margin-bottom: 2rem;
  }
}

@media (min-width: 992px) {
  .ausgleich {
    display: block;
    padding-top: 25px;
  }
}

/* mobiler weißer Hintergrund Preise */
@media (max-width: 767px) {
  .info_hg_white {
    background-color: #ffffff;
    padding: 10px 10px 0 5px !important;
    margin-left: 12.5px !important;
    width: calc(100% - 30px) !important;
  }
}

/* -------------------------------------------------------------------------- */
/*                             //NOTE Shop Farben                             */
/* -------------------------------------------------------------------------- */

/* -------------------- Farben in Übersicht als Flexreihe ------------------- */

.ueberfarben {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-bottom: 10px;
}

ul.farbenflex {
  display: flex;
  justify-content: flex-start;
  margin: 0 0 1rem 0;
  padding: 0;
}

ul.farbenflex li {
  text-align: center;
  list-style-type: none;
  font-size: 13px;
  line-height: 1.25;
  width: 60px;
}

ul.groessenflex {
  display: flex;
  justify-content: flex-start;
  gap: 10px;
  margin: 0 0 1rem 0;
  padding: 0;
}

ul.groessenflex li {
  text-align: right;
  list-style-type: none;
  font-size: 13px;
  line-height: 1.25;
}

@media (max-width: 768px) {
  .ueberfarben span {
    width: 15px;
    height: 15px;
  }
}

/* assimilate */
.assimilate_floating_blue {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/assimilate_floating_blue.webp");
  background-size: cover;
}

.assimilate_floating_red {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/assimilate_floating_red.webp");
  background-size: cover;
}

/* assimilate_neon */

.assimilate_neon_neon_green {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/assimilate_neon_neon_green.webp");
  background-size: cover;
}

.assimilate_neon_neon_orange {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/assimilate_neon_neon_orange.webp");
  background-size: cover;
}

.assimilate_neon_neon_yellow {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/assimilate_neon_neon_yellow.webp");
  background-size: cover;
}

/* bondage_single */

.bondage_single_at_night {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/bondage_single_at_night.webp");
  background-size: cover;
}

.bondage_single_at_sunset {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/bondage_single_at_sunset.webp");
  background-size: cover;
}

.bondage_single_at_twillight {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/bondage_single_at_twillight.webp");
  background-size: cover;
}

/* bondage_x */

.bondage_x_deep_taupe {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/bondage_x_deep_taupe.webp");
  background-size: cover;
}

.bondage_x_the_darknet {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/bondage_x_the_darknet.webp");
  background-size: cover;
}

/* chains */

.chains_shy_purple {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/chains_shy_purple.webp");
  background-size: cover;
}

/* close */

.close_starlight {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/close_starlight.webp");
  background-size: cover;
}

/* microscopy */

.microscopy_flower_field {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/microscopy_flower_field.webp");
  background-size: cover;
}

.microscopy_snowspace {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/microscopy_snowspace.webp");
  background-size: cover;
}

/* plisse */

.plisse_autumn_rainbow {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/plisse_autumn_rainbow.webp");
  background-size: cover;
}

.plisse_caramel {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/plisse_caramel.webp");
  background-size: cover;
}

.plisse_off_white {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/plisse_off_white.webp");
  background-size: cover;
}

.plisse_sage {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/plisse_sage.webp");
  background-size: cover;
}

/* spirograph */

.spirograph_bitter_sweet {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/spirograph_bitter_sweet.webp");
  background-size: cover;
}

.spirograph_fruity_juice {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/spirograph_fruity_juice.webp");
  background-size: cover;
}

.spirograph_lemon_tree {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/spirograph_lemon_tree.webp");
  background-size: cover;
}

.spirograph_sea_life {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/spirograph_sea_life.webp");
  background-size: cover;
}

/* take_it */

.take_it_happy_blue {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/take_it_happy_blue.webp");
  background-size: cover;
}

.take_it_happy_grey {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/take_it_happy_grey.webp");
  background-size: cover;
}

.take_it_happy_red {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/take_it_happy_red.webp");
  background-size: cover;
}

/* -------------------------------- Formular -------------------------------- */

.farbe .wpcf7-list-item-label {
  display: none;
}

.wpcf7-list-item.first {
  margin: 0;
}

label:has(input[type="radio"][value="Sage"])::before {
  content: "";
  display: inline-block !important;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/sage.webp");
  background-size: cover;
  margin-right: 5px;
  vertical-align: bottom;
}

label:has(input[type="radio"][value="Caramel"])::before {
  content: "";
  display: inline-block !important;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/caramel.webp");
  background-size: cover;
  margin-right: 5px;
  vertical-align: bottom;
}

label:has(input[type="radio"][value="Off-White"])::before {
  content: "";
  display: inline-block !important;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/off_white.webp");
  background-size: cover;
  margin-right: 5px;
  vertical-align: bottom;
}

label:has(input[type="radio"][value="Autumn Rainbow"])::before {
  content: "";
  display: inline-block !important;
  width: 25px;
  height: 25px;
  background-image: url("./images/farben/autumn_rainbow.webp");
  background-size: cover;
  margin-right: 5px;
  vertical-align: bottom;
}

/* Selector der die ausgewählte Farbe ausgibt */
#selected-color::before {
  content: "ausgewählte Farbe: ";
}

/* --------------------------- Toogle mit Preisen --------------------------- */

/* Basis-Styles für die Box */
.box-container {
  display: inline-block; /* Container passt sich der Breite der Inhalte an */
  overflow: hidden;
  border: 1px solid #aadb1e;
}

.box-content {
  display: grid;
  grid-template-columns: auto auto auto auto; /* 4 Spalten mit flexibler Breite */
  grid-auto-rows: auto; /* Die Zeilenhöhe passt sich dem Inhalt an */
  padding-bottom: 6px;
  max-height: 28px; /* Höhe für die eingeklappte Ansicht (anpassbar) */
  overflow: hidden;
  transition: max-height 0.5s ease-out;
  width: auto; /* Breite passt sich dem Inhalt an */
}

/* Spalten-Styles */
.column {
  padding: 3px 10px 3px 10px;
  box-sizing: border-box;
  white-space: nowrap; /* Verhindert, dass der Inhalt umgebrochen wird */
  font-family: "Roboto";
  font-weight: 300;
  font-size: 0.95rem;
  line-height: 28px;
  color: #47474a;
}

.toggle-column {
  display: flex;
  align-items: center;
  justify-content: center;
}

.toggle-box {
  display: none; /* Checkbox verstecken */
}

/* Winkel und Styles für das Label */
.full-row-label {
  display: contents; /* Label-Container zeigt die Inhalte und lässt Grid-Layout unverändert */
  cursor: pointer;
}

.toggle-label::after {
  content: "\25BC"; /* Pfeil nach unten */
  font-size: 16px;
  transition: transform 0.5s ease-out;
  padding-left: 10px;
  padding-right: 10px;
}

/* Wenn Checkbox aktiviert ist (Box ausgeklappt) */
.toggle-box:checked ~ .box-content {
  max-height: 300px; /* Höhe für die ausgeklappte Ansicht (anpassen nach Bedarf) */
  transition: max-height 0.5s ease-in;
}

.toggle-box:checked ~ .box-content .toggle-label::after {
  content: "\25B2"; /* Pfeil nach oben */
  transform: rotate(180deg); /* Dreht den Pfeil */
}

.icon_kreis::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url("./images/icon_kreis.webp");
  background-size: cover;
  margin-right: 5px;
  vertical-align: -3px;
}

.icon_durchschnitt::before {
  content: "";
  display: inline-block;
  width: 13px;
  height: 13px;
  background-image: url("./images/icon_durchschnitt.webp");
  background-size: cover;
  margin-right: 5px;
  vertical-align: -1px;
}

.icon_quadrat::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url("./images/icon_quadrat.webp");
  background-size: cover;
  margin-right: 5px;
  vertical-align: -3px;
}

.icon_rechteck::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 19.2px;
  background-image: url("./images/icon_rechteck.webp");
  background-size: cover;
  margin-right: 5px;
  vertical-align: -5px;
}

.icon_achteck::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url("./images/icon_achteck.webp");
  background-size: cover;
  margin-right: 5px;
  vertical-align: -3px;
}

.icon_organisch_rund::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url("./images/icon_organisch_rund.webp");
  background-size: cover;
  margin-right: 5px;
  vertical-align: -3px;
}

.icon_oval::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 19.5px;
  background-image: url("./images/icon_oval.webp");
  background-size: cover;
  margin-right: 5px;
  vertical-align: -4px;
}

/* -------------------------------------------------------------------------- */
/*                             //NOTE RoyalSlider                             */
/* -------------------------------------------------------------------------- */

.rsUni,
.rsUni .rsOverflow,
.rsUni .rsSlide,
.rsUni .rsVideoFrameHolder,
.rsUni .rsThumbs {
  background: none !important;
  color: #aadb1e;
}

.rsUni .rsThumb.rsNavSelected {
  background: none !important;
}

.rsUni .rsThumb.rsNavSelected .thumbIco {
  border: 2px solid #aadb1e;
  border: 2px solid rgba(170, 219, 30, 0.9);
}

.rsThumb {
  width: 50px !important;
  height: 50px !important;
}

.rsNav {
  margin-left: -10px;
}

@media (min-width: 768px) {
  .rsThumb {
    width: 85px !important;
    height: 85px !important;
  }
}

/* -------------------------------------------------------------------------- */
/*                              //NOTE Navigation                             */
/* -------------------------------------------------------------------------- */

/* andere Schrift */
#page .post-navigation .nav-links a .post-title {
  font-family: "Playfair Display";
  font-weight: 400;
  font-size: 1.1rem;
}

.post-navigation .nav-links {
  border-width: 0;
}

/* Pfeil über Posttitel */
.post-navigation .nav-previous .post-title::before {
  display: block;
  margin-bottom: 10px;
  color: #47474a;
  content: "\f034";
  font-family: icomoon-the7-font !important;
  speak: none;
  font-style: normal;
  font-weight: 400;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  transition: transform 0.3s ease;
}

.post-navigation .nav-next .post-title::before {
  display: block;
  margin-bottom: 10px;
  color: #47474a;
  content: "\f035";
  font-family: icomoon-the7-font !important;
  speak: none;
  font-style: normal;
  font-weight: 400;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  transition: transform 0.3s ease;
}

#page .post-navigation .nav-links a .post-title:hover {
  color: #888888;
  transition: color 0.5s linear;
}

/* ---------------------------------- mobil --------------------------------- */

@media (max-width: 767.999px) {
  .post-navigation .nav-previous {
    text-align: center;
  }

  .post-navigation .nav-next {
    text-align: center;
  }

  .post-navigation .nav-previous .post-title {
    -ms-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
  }

  .post-navigation .nav-next .post-title {
    -ms-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
  }

  .post-navigation .back-to-list,
  .post-navigation .nav-next,
  .post-navigation .nav-previous {
    position: relative;
    display: -ms-flexbox;
    display: -ms-flex;
    display: flex;
    -ms-flex-flow: column wrap;
    flex-flow: column wrap;
    -ms-flex-pack: center;
    -ms-justify-content: center;
    justify-content: center;
    text-decoration: none;
  }

  .post-navigation .nav-next {
    width: 100%;
    padding: 0;
    margin: 15px 0 15px 0;
    -ms-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
  }

  .post-navigation .nav-previous {
    width: 100%;
    padding: 0;
    margin: 15px 0 15px 0;
    -ms-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
  }

  .post-navigation .nav-links {
    -ms-flex-flow: column wrap;
    flex-flow: column wrap;
  }
}

/* --------------------------------- Desktop -------------------------------- */

@media (min-width: 768px) {
  .post-navigation .nav-previous {
    text-align: right;
  }

  .post-navigation .nav-next {
    text-align: left;
  }

  .post-navigation .nav-previous .post-title {
    -ms-align-self: flex-end;
    -ms-flex-item-align: flex-end;
    align-self: flex-end;
  }

  .post-navigation .nav-next .post-title {
    -ms-align-self: flex-start;
    -ms-flex-item-align: flex-start;
    align-self: flex-start;
  }

  .nav-previous {
    width: 48%;
    padding-left: 0;
    margin-right: 15px;
  }

  .post-navigation .nav-next {
    padding-right: 0;
    margin-left: 15px;
  }

  /* Pfeil mit Bewegung */
  .post-navigation .nav-previous .post-title:hover::before {
    transform: translateX(-10px);
    color: #888888;
  }

  .post-navigation .nav-next .post-title:hover::before {
    transform: translateX(10px);
    color: #888888;
  }
}

/* -------------------------------------------------------------------------- */
/*                               //NOTE Kontakt                               */
/* -------------------------------------------------------------------------- */

.contact-form input[type="text"],
.contact-form textarea,
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="url"],
.wpcf7-form input[type="number"],
.wpcf7-form input[type="range"],
.wpcf7-form input[type="date"],
.wpcf7-form textarea {
  background-color: transparent;
  font-family: "Roboto";
  font-size: 1.1rem !important;
  font-weight: 400;
  color: #47474a;
  margin-bottom: 0.8rem !important;
  padding-top: 3px;
  padding-right: 5px;
  padding-bottom: 3px;
  padding-left: 0px;
  border: none !important;
  border-bottom: 1px solid #aadb1e !important;
}

.wpcf7-submit {
  font-family: "Roboto" !important;
  font-size: 1.1rem !important;
  font-weight: 400 !important;
}

.wpcf7-spinner {
  display: none;
}

/* Quiz */
.wpcf7-quiz-label {
  font-family: "Roboto";
  font-size: 1.1rem !important;
}

/* Input vom Quiz */
input[type="text"].qgroesse {
  font-size: 1.1rem !important;
  width: 50px !important;
}

textarea.tgroesse {
  vertical-align: top;
  height: 220px;
}

/* Fehlerausgabe von Form 7*/
span.wpcf7-not-valid-tip {
  color: #b51f29;
}

::-webkit-input-placeholder {
  color: #47474a !important;
  opacity: 1 !important;
}

::-moz-placeholder {
  /* Firefox 19+ */
  color: #47474a !important;
  opacity: 1 !important;
}

:-ms-input-placeholder {
  color: #47474a !important;
  opacity: 1 !important;
}

:-moz-placeholder {
  /* Firefox 18- */
  color: #47474a !important;
  opacity: 1 !important;
}

input:focus::-moz-placeholder {
  color: transparent !important;
}

textarea:focus::-moz-placeholder {
  color: transparent !important;
}

input:focus::-webkit-input-placeholder {
  color: transparent !important;
}

textarea:focus::-webkit-input-placeholder {
  color: transparent !important;
}

input:focus:-ms-input-placeholder {
  color: transparent !important;
}

textarea:focus:-ms-input-placeholder {
  color: transparent !important;
}

input:focus:-moz-placeholder {
  color: transparent !important;
}

textarea:focus:-moz-placeholder {
  color: transparent !important;
}

@media (max-width: 767px) {
  input[type="submit"],
  .nsu-submit {
    font-size: 1rem !important;
  }

  .contact-form input[type="text"],
  .contact-form textarea,
  .wpcf7-form input[type="text"],
  .wpcf7-form input[type="email"],
  .wpcf7-form input[type="tel"],
  .wpcf7-form input[type="url"],
  .wpcf7-form input[type="number"],
  .wpcf7-form input[type="range"],
  .wpcf7-form input[type="date"],
  .wpcf7-form textarea {
    font-size: 1rem !important;
  }
}



.zeile {
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* width: 100%; */
padding-top: 1rem;
margin-left: -.85rem;
}

/* wegen HP */
.wpcf7-form input[type="email"] {
  margin-bottom: -20px !important;
}

/* ------------------------------- Newsletter ------------------------------- */

.mailster-form-3 input.input {
  background-color: transparent;
  font-family: "Roboto";
  font-size: 1.1rem !important;
  font-weight: 400;
  color: #47474a;
  margin-bottom: 0.8rem !important;
  padding-top: 3px;
  padding-right: 5px;
  padding-bottom: 3px;
  padding-left: 0px;
  border: none !important;
  border-bottom: 1px solid #aadb1e !important;
  width: 100%;
}

.mailster-form-3 .mailster-submit-wrapper {
  text-align: right;
  margin-top: 1.5rem;
}

.mailster-form-3 .mailster-submit-wrapper .submit-button {
  font-family: "Roboto";
  font-size: 1.1rem !important;
  font-weight: 400 !important;
  border: 1px solid #aadb1e !important;
}

/* ------------------------------ Shopformular ------------------------------ */

.shopform input[type="text"],
.shopform textarea,
.shopform input[type="email"],
.shopform input[type="tel"],
.shopform input[type="url"],
.shopform input[type="number"],
.shopform input[type="range"],
.shopform input[type="date"],
.shopform textarea {
  background-color: transparent;
  font-family: "Roboto";
  font-size: 0.95rem !important;
  font-weight: 400;
  color: #47474a;
  margin-bottom: 0 !important;
  padding: 0;
  border: none !important;
  border-bottom: 1px solid #aadb1e !important;
  min-height: auto !important;
}

.shopform .wpcf7-submit {
  font-family: "Roboto" !important;
  font-size: 0.95rem !important;
  font-weight: 400 !important;
  padding: 6px 12px 6px 12px !important;
}

.wpcf7-spinner {
  display: none;
}

/* Quiz */
.wpcf7-quiz-label {
  font-family: "Roboto";
  font-size: 0.95rem !important;
}

/* Input vom Quiz */
input[type="text"].qgroesse {
  font-size: 0.95rem !important;
  width: 50px !important;
}

textarea.sfgroesse {
  vertical-align: top;
  height: 100px;
}

textarea.tgroesse2 {
  vertical-align: top;
  height: 180px;
}

/* ------------------------------ Tempshopseite ----------------------------- */

.shopsoon_contact .h4like {
  padding-top: 0;
}

.shopform input[type="text"],
.shopform textarea,
.shopform input[type="email"],
.shopform input[type="tel"],
.shopform input[type="url"],
.shopform input[type="number"],
.shopform input[type="range"],
.shopform input[type="date"],
.shopform textarea {
  background-color: transparent;
  font-family: "Roboto";
  font-size: 0.95rem !important;
  font-weight: 300;
  color: #47474a;
  margin-bottom: 0 !important;
  padding: 0;
  border: none !important;
  border-bottom: 1px solid #aadb1e !important;
  min-height: auto !important;
}

@media (min-width: 768px) {
  .shopsoon_contact.shopform .wpcf7-form {
    padding: 0.5rem 0 0 2rem;
  }
}

/* -------------------------------------------------------------------------- */
/*                           //NOTE Spacer und Toggle                         */
/* -------------------------------------------------------------------------- */

.spacer_1 {
  display: block;
  padding-top: 1rem;
}

.spacer_s {
  display: none;
}

@media (min-width: 768px) {
  .spacer_s {
    display: block;
    padding-top: 10px;
  }
}

/* --------------------------------- Toggle --------------------------------- */
.toogle_769 {
  display: none;
}

.toogle_767 {
  display: block;
}

@media (min-width: 768px) {
  .toogle_769 {
    display: block;
  }
  .toogle_767 {
    display: none;
  }
}

.toogle_993 {
  display: none;
}

.toogle_991 {
  display: block;
}

@media (min-width: 992px) {
  .toogle_993 {
    display: block;
  }
  .toogle_991 {
    display: none;
  }
}

/* -------------------------------------------------------------------------- */
/*                                //NOTE Footer                               */
/* -------------------------------------------------------------------------- */

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

/* Scroll Top immer rechts vom Inhalt nichts rechts absolut */
/* .scroll-top.on {
  right: calc(50% - 750px);
}

@media (max-width: 1600px) {
  .scroll-top.on {
    right: 50px;
  }
}

@media (max-width: 756px) {
  .scroll-top.on {
    right: 20px;
  }
} */

@media (min-width: 1200px) {
  /* Hamburger zum Content hin versetzen */
  .scroll-top.on {
    right: calc(50% - 575px);
  }
}

/* ------------------------- Fusszeile in Urzustand ------------------------- */

.footer .widget {
  margin-bottom: 0;
}

.wf-float-right {
  float: none;
}

#bottom-bar .wf-float-right {
  display: block;
  margin-left: 0;
}

#bottom-bar .wf-container-bottom {
  display: block;
}

.floatright {
  float: right;
  margin-right: -25px;
}

.footermobil {
  margin-left: 30px;
}

/* Sprachumschalter */

.footer_language {
  text-align: center;
  padding-left: 32px;
  margin-bottom: 4rem;
}

li > a .trp-ls-language-name:hover,
li.current-language-menu-item > a .trp-ls-language-name {
  text-decoration: underline solid #aadb1e 2px;
}

/* kein Strich zwischen den Sprachen */
.footer .menu li,
.footer .widget_pages li,
.footer .custom-menu.dividers-on li,
.footer .blogroll li,
.footer .qts-lang-menu li {
  border-width: 0;
  margin: 0;
}

/* -------------------------------------------------------------------------- */
/*                           //NOTE Responsive Ende                           */
/* -------------------------------------------------------------------------- */

/* Abstand Impressum nur desktop */
@media (max-width: 1400px) {
  .bis1400 {
    display: none;
  }
}

@media (max-width: 599px) {
  h1,
  h2 {
    font-size: 2rem;
  }

  h3,
  h4,
  h5,
  h6,
  .h3shop,
  .h3shop p {
    font-size: 1.5rem;
  }
}

.desktop,
.mobil {
  display: none;
}

@media (min-width: 768px) {
  .desktop {
    display: block;
  }
}

@media (max-width: 767.999px) {
  .mobil {
    display: block;
  }
}

/* ---------------------------------- ENDE ---------------------------------- */
/* -------------------------------------------------------------------------- */