:root {
  --lp-tur-base: rgba(7,104,115,1)!important;
  --lp-tur-over: rgba(2,81,89,1)!important;
  --lp-tur-dark: rgba(2,54,66,1)!important;
  --lp-grey-lighter: rgba(237,237,237,1)!important;
  --lp-grey-medium: rgba(199,199,199,1)!important;
  --lp-creme-lighter-2:rgba(233,216,188,0.2)!important;
  --lp-creme-lighter:rgba(233,216,188,0.4)!important;
  --lp-creme-light:rgba(233,216,188,1)!important;
  --lp-creme-middle:rgba(193,164,131,0.4)!important;
  --bs-blue: rgba(23,162,176,1)!important;
  --lp-signal-btn: rgba(168,41,96,1);
  --lp-signal-btn-dark: rgba(113,26,64,1);
  --lp-over-btn: rgba(155,35,84,0.7);
  --lp-font-color: rgba(74,80,84,0.9);
}

/* Gallery */

.gal-item .bg-image {
  max-width: 100%;
  height: auto;
}

.gal-item .inner.overlay {
  background: rgba(0,0,0,0.6);
  border-top-left-radius: 25px;
  border-bottom-right-radius: 25px;
}

.gal-item .inner.overlay h2 {
  padding-top: 0em;
  font-size: 2.75em;
  line-height:1em;
  margin: 0px auto;
  border-bottom: none;
}

.gal-item .inner.overlay .btn-container {
  padding-bottom: 0!important;
}

/* Gallery End */

.frame-type-html h1 {
  font-family: ff-enzo-web, helvetica, arial, sans-serif!important;
  font-weight: 700;
  font-size: 2em!important;
}

.frame-type-html h2 {
  margin-top: 1.5rem;
  font-family: ff-enzo-web, helvetica, arial, sans-serif!important;
  font-weight: 700;
  font-size: 1.25em!important;
  border-bottom: 1px dotted var(--lp-grey-lighter);
  width: 100%;
  max-width: unset;
  margin-bottom: 1.5rem!important;
}

.frame-type-html IMG.schloss {
  width: 17px!important;
  height: 18px!important;
}

.frame-type-html h3 {
  font-family: ff-enzo-web, helvetica, arial, sans-serif!important;
  font-weight: 700;
  font-size: 1em!important;
  letter-spacing: unset!important;
  margin-top: 1rem!important;
  margin-bottom: 1rem!important;
}

.pageUid-11 .footerline a:first-child {
  font-weight: 700;
}

.pageUid-10 .footerline a:nth-child(2) {
  font-weight: 700;
}

/* Table Portfolio */

#c69 .table-responsive {
  margin-top: 3rem;
  margin-bottom: 2rem;
  border-radius: 5px;
  overflow: hidden;
  display: inline-block;
}

#c69 .table-responsive tbody {
  border-bottom: none!important;
}

#c69 .table-responsive ul.list-normal {
  margin: 0;
  margin-bottom: 20px;
}

#c69 .table-responsive ul.list-normal li {
  border-bottom: 1px dotted var(--lp-tur-base);
}

#c69 .table-responsive ul.list-normal li:last-child {
  border-bottom: none;
}

#c69 .table-responsive td {
  vertical-align: baseline;
  padding: 15px;
  padding-left: 3rem;
  padding-right: 3rem;
}

#c69 .table-responsive td:first-child {
  min-width: 200px;
  font-weight: 700;
  color: var(--lp-tur-base);
}

#c69 .table-responsive tr:nth-child(1) td {
  background: rgba(7,104,115,0.6);
}

#c69 .table-responsive tr:nth-child(2) td {
  background: rgba(7,104,115,0.4);
}

#c69 .table-responsive tr:nth-child(3) td {
  background: rgba(7,104,115,0.2);
}

/* Table Portfolio END */

.teaser-item.sortiment .inner-teaser {
  position: relative;
  height: 250px;
  background: var(--lp-grey-lighter);
}

.teaser-item.sortiment .inner-teaser h4 {
  max-width: 280px;
  margin: 0px auto 3rem auto;
  font-size: 1.4rem!important;
  line-height: 1.2em!important;
  text-transform: uppercase;
  font-weight: 400;
}

.teaser-item.sortiment .content-gallery {
  position: absolute;
  bottom: 0;
  width: 100%;
  left: 0;
}

.main-content p a, .main-content li a {
  color: var(--lp-signal-btn);
  text-decoration: none;
  position: relative;
}

.main-content p a::before {
  content:'';
  position: absolute;
  width: 0;
  height: 2px;
  background: var(--lp-signal-btn-dark);
  left: 0;
  bottom: -1px;
  opacity: 0;
  transition: all 0.3s ease;
}

.main-content p a:hover {
  color: var(--lp-signal-btn-dark);
}

.main-content p a:hover::before {
  width: 100%;
  opacity: 1;
}

.teaser-item.sortiment .inner-teaser .inner-content {
  position: relative;
  z-index: 5;
}

.teaser-item.sortiment IMG {
  border-radius: unset!important;
  height: 100%!important;
  width: auto!important;
}

.teaser-item.sortiment .inner-teaser:after {
  border-radius:.3rem !important;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
  position: absolute;
  left: 0;
  top: 0;
  z-index: 3;
  content:'';
}

.teaser-item .gal-link, .gal-item .gal-link a {
  font-size: 0.8em;
  position: relative;
  font-weight: 700;
  color:white;
  text-decoration: none;
  text-transform: none;
  padding: 22px;
  background: url(../img/plus.svg) no-repeat;
  background-size: 17px;
  background-position: center 150%;
  transition: all 0.3s ease;
}

.teaser-item .gal-link:hover, .gal-item .gal-link a:hover  {
  background-position: center bottom;

}

ul.list-normal {
  padding: 0;
  margin: 0;
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}

ul.list-normal li {
  max-width: 750px;
  list-style: none;
  padding-left: 40px;
  background: url(../img/list-style-icon.svg) no-repeat;
  background-size: 25px;
  background-position: left 18px;
  line-height: 1.5em;
  padding-top: 15px;
  padding-bottom: 15px;
  border-bottom: 1px dotted var(--lp-grey-lighter);
}

h3.accordion-header {
  max-width: unset;
}

.accordion-button:not(.collapsed) {
    color: var(--lp-tur-dark)!important;
    background-color: var(--lp-grey-lighter)!important;
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.125);
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23076873'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")!important;
    transform: rotate(-180deg);
}

.accordion-button:focus {
  border: none!important;
  box-shadow: none!important;
  outline: 0!important;
}

.headerbanner {
  transition: all 0.3s ease;
}

.headerbanner IMG {
  width: 100%;
  height: auto;
}

@keyframes pulse {
  from { width:50px;height:50px; }
  to { width:60px; height:60px; }
}

div.active { animation:bounce .5s ease; }
@keyframes bounce {
 100%{ transform: translate(-50%,-50%) scale(2); opacity:0; }
 0%{ transform: translate(-50%,-50%) scale(1); opacity:1; }
}

strong, b {
  font-weight: 700;
}

.swiper-pagination-bullet-active {
  background: var(--lp-tur-base)!important;
}

@keyframes slideDown {
  from {
    transform: translateY(-100%);
  }
  to {
    transform: translateY(0);
  }
}

@keyframes typing {
  from {
    width: 0;
  }
}

@keyframes blink {
  50% {
    border-color: transparent;
  }
}

/* ENDLESS ROTATE */
.circle{
  animation: spinner 21.5s linear infinite;
}
@keyframes spinner {
  to { transform: rotate(360deg); }
}

.quote .inner {
  position: relative;
  background: var(--lp-tur-over);
  border-top-right-radius: 25px;
  border-bottom-left-radius: 25px;
  padding-top: 9%!important;
  padding-bottom: 9%!important;
  color: #fff;
}

.quote .inner blockquote p {
  font-family: "professor", sans-serif;
  font-size: 2.75em;
  line-height: 1.35em;
  font-weight: 400;
  width: 100%!important;
  max-width: 100%!important;
}

.quote .inner::after {
  content:'';
  background: url(../img/background-quote3.svg) repeat;
  background-size: cover;
  background-position: center;
  position: absolute;
  border-top-right-radius: 25px;
  border-bottom-left-radius: 25px;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 1;
}

.main-page .add-content {
  padding: 7%!important;
  background: url(../img/bgAblauf.jpg) var(--lp-creme-lighter-2) no-repeat!important;
  background-size:cover!important;
  background-position:center;
}

.main-page .add-content::before {
  background: rgba(89,75,63,0.1);
  opacity: 0.7;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  content:'';
  z-index:1;
}

.main-content h4:not(.gal-title) {
  display: inline-block;
  min-width: 50%;
  padding-right: 5rem;
  color: var(--lp-tur-base);
  font-weight: 700;
  border-bottom: 1px solid rgba(0, 0, 0, .125);
}

.main-page .add-content h4 {
  color:var(--lp-tur-over);
}

.sub-add-content {
  padding: 5%!important;
  min-height: 500px;
  background: linear-gradient(var(--lp-tur-base),var(--lp-tur-dark));
  background-size:cover!important;
  background-position:center;
}

.sub-add-content::after {
    content: '';
    background: url(../img/background-quote4.svg) repeat;
    background-size: cover;
    background-position: center;
    position: absolute;
    border-top-right-radius: 25px;
    border-bottom-left-radius: 25px;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 0.3;
    transition: all 0.4s ease;
}


.main-page .add-content::before {
  background: linear-gradient(rgba(89,75,63,0.7) ,rgba(89,75,63,0.4) ) ;
  opacity: 0.3;
}

.main-page .add-content {
  color: #fff;
}

.main-page .add-content .container {
  position: relative;
  z-index: 2;
}

.main-page .add-content .ani-el {
  right: 10%;
  top: 10%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.3s ease;
}

.main-page .add-content .circle {
    width: 300px;
    height: 300px;
    background: url(../img/circle3.svg);
    z-index:2!important;
}

.main-page .add-content .ani-el .heart {
  position: absolute;
  content:'';

  background: url(../img/heart.svg) no-repeat;
  width: 50px;
  height: 50px;
  z-index: 1;
}

.quote .inner .quote-text {
  z-index: 100;
}

.quote p {
  margin-bottom: 0px;
  width: 100%!important;
  max-width: 100%!important;
}

.wrapper {
  display: grid;
  place-items: center;
  z-index: 20;
  right: 0!important;
  width: 100%;
  top: 0;
  left: 0;
  height: calc(100vh - 180px - 6rem)!important;
}

.swiper.main-slider {
  height: auto!important;
}

.typing {
  color:#fff!important;
}

.swiper-slide-active .typing {
  white-space: nowrap;
  overflow: hidden;
  border-right: 3px solid;
  font-family: monospace;
  font-weight: 300;
  font-size: 1.25em;
  color:#fff;
}

.text-wrapper {
  display: flex;
  justify-content: center;
  align-items:center;
  border-top-right-radius: 25px;
  border-bottom-left-radius: 25px;
  width: 500px;
  height: 140px;
  background: var(--lp-tur-base);
  right: 6rem;
  top: calc(100% - 140px - 6rem);
}

.text-wrapper .typing {
  z-index: 20;
}

.swiper-slide {
  overflow-y: hidden;
}

.swiper-slide-active .typing-1 {
  width: 32ch;
  display: inline-block;
  animation: typing 2s steps(32), blink .5s step-end infinite alternate;
}

.swiper-slide-active .typing-2 {
  width: 29ch;
  display: inline-block;
  animation: typing 2s steps(29), blink .5s step-end infinite alternate;
}

.swiper-slide-active .typing-3 {
  width: 34ch;
  display: inline-block;
  animation: typing 2s steps(34), blink .5s step-end infinite alternate;
}

.swiper-slide-active .typing-4 {
  width: 37ch;
  display: inline-block;
  animation: typing 2s steps(37), blink .5s step-end infinite alternate;
}


body.activeNav {
  overflow: hidden;
}


.main-slider {

}

#siteHeader .outer {
  height: 180px;
}

#slider {

}

.stylefont {
  font-family: ff-enzo-web, helvetica, arial, sans-serif;
}

#slider .swiper-slide IMG {
  display: flex;
  object-fit: cover;
  width: 100%;
  height: auto;
  object-position: center;
}

.lpcolor {
  color: var(--lp-tur-base)!important;
}

.nav-container {
  top: 0px;
  bottom: 0px;
  right: -100%;
  width: 40%;
  max-width: 550px;
  height: calc(100vh + 15px);
  background: var(--lp-tur-over);
  transition: clip-path 0.3s ease-in-out;
  position: fixed;
  z-index:15;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.3s ease;
}

.nav-container::after {
    content: '';
    background: url(../img/background-quote4.svg) repeat;
    background-size:1400px;
    background-position: center;
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 0.5;
}

.nav-container ul {
  z-index: 2;
  padding: 0!important;
  margin: 0!important;
}

.nav-container .socials {
  top: 3rem!important;
  left: 3rem!important;
  color: white;
  z-index: 5;
}

.nav-container .socials .icon IMG {
  filter: invert(100%)!important
}

.activeNav .nav-container {
  right: 0!important;
}

button {
  border: none!important;
  box-shadow:0!important;
}

button.nav-toggle {
  border-radius: 50em;
  transition:all 0.4s ease;
}

button.nav-toggle:hover {
  background: var(--lp-grey-lighter)!important;
}

.close-btn {
  right:2.75em;
  top: 2.75em;
  opacity: 0;
  padding: 15px;
  transform: scale(1);
  background: rgba(255,255,255,0);
  border-radius: 150px;
  transition: all 0.3s ease-in-out;
  z-index: 100;
}

.activeNav .close-btn {
  right: 3em;
  top: 3em;
  opacity: 1;
}

#desktopNav ul li a {
  opacity:1;
}

#desktopNav ul {
  opacity: 0;
  transition: all 1.2s ease-in-out;
}

#desktopNav ul.nav-show {
  opacity: 1;
}
#desktopNav ul li {
  opacity: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: auto!important;
}

#desktopNav ul.nav-show li {
  transform: translateX(0px)!important;
  opacity:1!important;
}

#desktopNav ul li:nth-child(1) {
  transform: translateX(-10px);
  transition: all 0.4s ease 0.3s!important;
}

#desktopNav ul li:nth-child(2) {
  transform: translateX(-15px);
  transition: all 0.4s ease 0.4s!important;
  transition-delay: 0.2s;
}

#desktopNav ul li:nth-child(3) {
  transform: translateX(-20px);
  transition: all 0.4s ease 0.5s!important;
  transition-delay: 0.3s;
}

#desktopNav ul li:nth-child(4) {
  transform: translateX(-25px);
  transition: all 0.4s ease 0.6s!important;
  transition-delay: 0.4s;
}

#desktopNav ul li:nth-child(5) {
  transform: translateX(-30px);
  transition: all 0.4s ease 0.7s!important;
  transition-delay: 0.5s;
}

#desktopNav ul li:nth-child(6) {
  transform: translateX(-35px);
  transition: all 0.4s ease 0.8s!important;
  transition-delay: 0.6s;
}


#desktopNav.show-link ul li a, #desktopNav ul li, #desktopNav ul li.active a {
  border: none!important;
}

#desktopNav ul li:hover a, #desktopNav ul li.active:hover a, #desktopNav ul li a:hover, #desktopNav ul li.active a:hover {
  border: none!important;
}

#desktopNav ul li a {
  text-transform: none;
  border-radius: 50em!important;
  text-align:center!important;
  top: 0;
  font-size: clamp(1rem, 4vw, 1.4rem);
  padding: 1.5rem 4.5rem 1.5rem 4.5rem!important;
  line-height: 1em!important;
}

#desktopNav ul li.active a {
  position: relative;
    background: linear-gradient(to right, var(--lp-signal-btn),var(--lp-signal-btn-dark))!important;
}

#desktopNav ul li a:after {
  content:'';
  position: absolute;
  left: 4.5rem;
  bottom: 1.25rem;
  width: 0;
  height: 2px;
  background: white;
  opacity: 0;
  transition: all 0.3s ease;
}

#desktopNav ul li a:hover:after {
  width: calc(100% - 9rem);
  opacity: 1;
}

#desktopNav ul li a:hover, #desktopNav ul li.active a:hover {

}

.close-btn {
    cursor: pointer;
}

.close-btn:hover {
  transform: scale(1.25);
  padding: 15px;
  background: rgba(255,255,255,0.02);
}

#siteFooter {
  background: var(--lp-grey-lighter);
}

footer a {
  position: relative;
  z-index: 1;
}

footer a::before {
  width: 0;
  height: 5px;
  background: var(--lp-grey-medium);
  content:'';
  bottom: 0;
  left: 0;
  position: absolute;
  z-index: -1;
}

footer a:hover::before {
  width: 100%;
}

a, a::before, button, .nav-link, header#mainHeader, header#mainHeader IMG, .lp-btn {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.nav-link {
  padding: 0!important;
  line-height: 1em;
}

.edge {
  width: 55px;
  height: 55px;
  position: absolute;
}

.left-top {
  top: 20px;
  left: 20px;
}

.right-top {
  top: 20px;
  right: 20px;
}

.bottom-right {
  top: calc(100% - 60px);
  right: 20px;
}

.bottom-left {
  top: calc(100% - 60px);
  left: 20px;
}

body, html {
  padding: 0;
  margin: 0;
  background: white;
  color:var(--lp-font-color)!important;
  font-family: ff-enzo-web, helvetica, arial, sans-serif;
}

p, p.lead {
  color: var(--lpt-font-color)!important;
}

.lp-2col p.lead {
  color: var(--lp-tur-base)!important;
}

.text-black {
  color:var(--lp-font-color)!important;
}

.frame-header {

}

h1, h2 {
  font-family: mr-gabe, sans-serif;
  font-weight: 400;
}

h3, h4, h5, h6 {
  font-family: ff-enzo-web, helvetica, arial, sans-serif!important;
  font-weight: 400;
  line-height: 1.5em;
  font-size: 1.4em;
  max-width: 900px;
}

.accordion-item h3 {
  letter-spacing: unset;
  font-size: 1.5rem;
  line-height: 1.15em;
}


h2 {
  font-size: 11em;
  position: relative;
  padding-left: 0;
  padding-bottom: 1.25rem!important;
  margin-bottom: 0px!important;
}

h2::before {
  opacity: 0.5;
  content:'';
  width: 30px;
  left: -40px;
  top: 50%;
  height: 20px;
  margin-top: -12px;
  position: absolute;
  background: url(../img/tilde.svg) no-repeat;
  background-size: cover;
  background-position: center;
  display : none!important;
}


.sub-add-content .container {
  position: relative;
  z-index: 5;
}

.sub-add-content h2.element-header {
  color:white;
  /*font-size: clamp(32px, 4vw, 8rem)!important;*/

}

h3 {
  padding-left: 0px;
  text-transform: uppercase;
  letter-spacing: 5px;
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 10px;
}

header#mainHeader {
  position: relative;
  top: 0;
  right: 0;
  left: 0;
  padding: 125px 0!important;
  background-size: cover;
  background-position: center;
  width: 100%;
  z-index:2;
}


header#mainHeader::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content:'';
  background: rgba(0,0,0,0.6);
  z-index:-1;
}

footer {
  line-height: 1.75em;
}

pre {
  margin-top: 20px;
  margin-bottom: 0px;
  font-family: "parlare", sans-serif;
  font-size: 170%;
  padding-left: 10px;
  display: block;
  line-height: 2.75em;
}

.btn-container {
  padding-top: 2em;
  padding-bottom: 2em;
}


.btn-container a {
  font-size: 0.7em;
  letter-spacing: 3px;
  text-transform: uppercase;
  font-weight: 700;
}

.lp-btn {
  border-radius: 50px;
  padding: 22px 50px 20px 50px;
  background: linear-gradient(to right, var(--lp-signal-btn), var(--lp-signal-btn-dark));
  border: 1px solid var(--lp-over-btn);
  color: #fff;
  font-weight: 400;
  text-decoration:none;

}

.lp-btn:hover {
  background: linear-gradient(to left, var(--lp-signal-btn), var(--lp-signal-btn-dark));
  color: #fff;
  opacity: 0.9;
  border: 1px solid var(--lp-signal-btn);
}

.spacer {
  color: var(--lp-creme-middle);
}

footer .spacer {
  color: var(--st-grey-middlesoft);
}

.fixed_header header#mainHeader {
  position: fixed;
  width: 100%;
  top: 0;
  /*box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);*/
  padding: 50px 0!important;
  animation: slideDown 0.35s ease-out;
}

.fixed_header header#mainHeader IMG.logo {
  max-width: 225px;
  height: auto;
}

.main-content IMG {
  width: 100%;
  height: auto;
  border-top-left-radius: 25px;
  border-bottom-right-radius: 25px;
}

body {
  min-height: 100vh;
  width: 100vw;
  overflow-x: hidden;
  font-size: 1.15em;
}

.main-content .container p, .main-content .container ul li, .main-content .container blockquote p,
.add-content .container p, .add-content .container ul li, .add-content .container blockquote p {
  color: var(--lp-grey-middle);
}

.main-content .container h1, .main-content .container h2, .main-content .container h3 {
    color: var(--lp-tur-base);
    font-family: mr-gabe, sans-serif;
}

.main-content, .add-content {
  line-height: 2.0em;
}

.add-content p {
  max-width: 75%;
}

.main-content .container h2, .add-content .container h2 {
  /*font-size: 6.75em;*/
  font-weight: 300;
  margin-bottom: 20px;
  position: relative;
  display: inline-block;
  z-index: 2;
  padding-right: 0px;
  color:var(--lp-tur-over);
}


.fixed_header .main-content {
  position: relative;
}

/* Desktop-Nav */

#desktopNav ul {
  width: 100%;
  display: block;
  max-width: 500px;
  margin: 0px auto;
  padding: 0;
}

#desktopNav ul li {
  font-weight: 400;
  font-size: 1.25em;
  /*border-top: 1px dotted white!important;
  border-top: 1px dotted white!important;*/
}

#desktopNav ul li a {
  color: white;
  position: relative;
}

#desktopNav ul li a:hover {

}

#desktopNav ul li.active a {
  background: var(--st-red-base);
  border: 1px solid transparent;
  font-weight: 700;
}

#desktopNav ul li.active a:hover {
  background: var(--st-red-over);
  border: 1px solid transparent;
}

.nav-bg {
  cursor: pointer;
  background: rgba(0,0,0,0.7);
  right: -100%;
  top: 0;
  z-index: 10;
  transition: all 0.3s ease;
}

.activeNav .nav-bg {
  right: 0;
}

.footerline {
  opacity: 0;
  bottom: 0rem;
  transition: all 0.4s ease;
  transition-delay: 0.8s;
  z-index: 20;
}

.activeNav .footerline {
  opacity: 1;
  bottom:50px;
}

.footerline a {
  position: relative;
  border-radius: 5em;
  background: transparent;
  font-size: 0.8em!important;
}

.footerline a:hover {
  background: var(--lp-tur-dark)!important;
}

.lp-footerlink {
  color: var(--lp-tur-base);
}

.lp-footerlink:hover {
  color: var(--lp-tur-dark);
}


/* TIMELINE */

/* The actual timeline (the vertical ruler) */
.main-timeline-2 {
  position: relative;
}

/* The actual timeline (the vertical ruler) */
.main-timeline-2::after {
  content: "";
  position: absolute;
  width: 1px;
  background-color: rgba(0, 0, 0, .125);
  top: 0;
  bottom: 0;
  left: 50%;
  margin-left: -0.5px;
}

/* Container around content */
.timeline-2 {
  position: relative;
  background-color: inherit;
  width: 50%;
}

.timeline-2 .history-info p {
  margin-bottom:unset!important;
  padding-bottom: 0!important;
}

/* The circles on the timeline */
.timeline-2::after {
  content: "";
  position: absolute;
  width: 50px;
  height: 50px;
  right: -25px;
  background-color: var(--lp-tur-base);
  top: 15px;
  border-radius: 50%;
  z-index: 1;
}

/* Place the container to the left */
.left-2 {
  padding: 0px 40px 20px 0px;
  left: 0;
}

/* Place the container to the right */
.right-2 {
  padding: 0px 0px 20px 40px;
  left: 50%;
}

/* Add arrows to the left container (pointing right) */
.left-2::before {
  content: " ";
  position: absolute;
  top: 18px;
  z-index: 1;
  right: 30px;
  border: medium solid white;
  border-width: 10px 0 10px 10px;
  border-color: transparent transparent transparent white;
}

/* Add arrows to the right container (pointing left) */
.right-2::before {
  content: " ";
  position: absolute;
  top: 18px;
  z-index: 1;
  left: 30px;
  border: medium solid white;
  border-width: 10px 10px 10px 0;
  border-color: transparent white transparent transparent;
}

/* Fix the circle for containers on the right side */
.right-2::after {
  left: -25px;
}

/* TIMELINE END */

.card {
  background: linear-gradient(to top, #f7f7f7, white);
}

.card-body h4 {
  color: var(--lp-tur-base)!important;
}

.timeline-2.element-1::after {

  background: var(--lp-tur-base) url(../img/ABLAUF/Ablauf_Kontaktaufnahme.svg) no-repeat;
  background-size: 70px;
  background-position: center;

}

.timeline-2.element-2::after {

  background: var(--lp-tur-base) url(../img/ABLAUF/Ablauf_Info_Zeit.svg) no-repeat;
  background-size: 65px;
  background-position: center;

}

.timeline-2.element-3::after {

  background: var(--lp-tur-base) url(../img/ABLAUF/Ablauf_Angebot.svg) no-repeat;
  background-size: 70px;
  background-position: center;

}

.timeline-2.element-4::after {

  background: var(--lp-tur-base) url(../img/ABLAUF/Ablauf_Startschuss.svg) no-repeat;
  background-size: 70px;
  background-position: center;

}


.timeline-2.element-5::after {

  background: var(--lp-tur-base) url(../img/ABLAUF/Ablauf_Feinschliff.svg) no-repeat;
  background-size: 70px;
  background-position: center;

}

.timeline-2.element-6::after {

  background: var(--lp-tur-base) url(../img/ABLAUF/Ablauf_Lieferung.svg) no-repeat;
  background-size: 70px;
  background-position: center;

}

/* Desktop-Nav Ende */

@media (min-width: 1750px) {
  #siteHeader .container-fluid {
    max-width: 85%!important;
    padding-left: 5em!important;
    padding-right: 5em!important;
  }

  .headerbanner {
    max-height: 800px;
  }

  .main-page .add-content .ani-el {
    transform: scale(0.85)!important;
    top: 8.5%!important;
    right: 7.5%!important;
  }
}

@media (max-width: 1649px) {


  .sub-add-content::after {
      background-size: 1600px;
  }

}


@media (min-width: 1400px) {


  #slider IMG {
    position: relative;
    transform: translateY(15%);
  }

  h2::before {
    margin-top: 0px;
  }

  .main-page .add-content .ani-el {
    transform: scale(0.8);
    top: 0;
    right: 0;
  }

  .lp-2col IMG {
    max-width: 100%;
    height: auto;
    max-width: 900px;
  }

  .headerbanner {
    max-height: 800px;
  }

  .lp-2col .col-left {

    z-index: 20;
  }

  .main-content .container .lp-2col .col-left p {
    font-size: 1em;
    line-height: 1.5em;

    color:var(--lp-font-color);
  }

  .main-content .container .lp-2col .col-left p.lead {
    color: var(--lp-tur-base)!important;
    font-weight: 400!important;
    font-size:1.4em;
    margin-top: 0px;
    margin-bottom: 0;
  }


  .lp-2col .col-right IMG {
    opacity: 1;
    position: relative;
    z-index: 1;
  }

  .lp-2col .col-right {
    overflow: hidden;
  }

  .lp-2col .col-right .gallery-item {
    position: relative;
    overflow: hidden;
  }

  .lp-2col p.lead {
    font-size: 1.4em!important;
    line-height: 1.5em!important;
    max-width: unset!important;
  }

  .lp-2col .col-right .gallery-item::after {
  	content: '';
  	position: absolute;
    z-index: 10!important;
  	top: 0;
  	left: 0;
  	width: 70%;
  	height: calc(100% - 17px);
    border-top-left-radius: 25px;
  	background-image: linear-gradient(-90deg, transparent 0 3%, var(--lp-tur-over) 50% 100%);
    opacity: 0.6;
    display: none;
  }

  p, p.lead {
    max-width: 80%;
  }

  p.lead {
    font-size: 1.4em!important;
    line-height: 1.5em!important;
  }

  .sub-add-content p, .sub-add-content p.lead {
    margin: 0px auto 2rem auto;
  }
  #siteHeader .container-fluid {
    width: 100%;
    padding-left: 3em;
    padding-right: 3em;
  }

  #slider, .outer-slider, .main-slider, .swiper-wrapper {
    height: calc(100vh - 180px - 6rem);
  }

  .swiper-pagination {
    bottom: 0!important;
  }

}

@media (max-width: 1399px) {

.main-page .add-content::before {
    background: rgba(0,0,0,0.7)!important;
    opacity: 0.7;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    z-index: 4;
}

.main-page .add-content .container {
  position: relative;
  z-index: 20!important;
}

.main-page .add-content h2, .main-page .add-content h4 {
    color: white!important;
    padding-top: 40px;
}

  .sub-add-content::after {
      background-size: 1400px;
  }

  .headerbanner {
    max-height: 650px;
  }

  .col-left {
    position: static!important;
  }

  .col-right {
    width: 50%!important;
  }

  .col-right .gallery-item::after {
    display: none!important;
  }

  h2 {
    position: relative;
    padding-bottom: 1.25rem!important;
    margin-bottom: 0px!important;
  }

  #siteHeader .outer {
    height: 150px!important;
  }

  #siteHeader .logo IMG {
    width: 150px;
  }

  .main-slider {
    height: auto!important;
    overflow: hidden;
  }

  .wrapper {
    display: grid;
    place-items: center;
    z-index: 20;
    right: 0!important;
    width: 100%;
    bottom: 0;
    left: 0;
    height: auto!important;
  }

  .main-page .add-content .ani-el {
    transform: scale(0.8);
    top: -22.5%;
    right: 0%;
  }


}

@media (min-width: 1200px) {
  .disclaimer {
    border-top: 1px solid rgba(0,0,0,0.2)!important;
  }


  .teaser-item.sortiment IMG {
    max-width: 100%!important;
    width: 100%!important;
    height: auto!important;
    position: relative;
    transform: translateY(-15%);
  }

  h3 {
    margin-bottom: -20px;
  }
}

@media (max-width: 1199px) {

  .gal-item .inner.overlay h2 {
    font-size: 2.25em!important;
  }

  #desktopNav ul li a {
    text-transform: none;
    border-radius: 50em !important;
    text-align: center !important;
    top: 0;
    font-size: 20px!important;
    padding: 1.5rem 4.5rem 1.5rem 4.5rem !important;
    line-height: 1em !important;
  }

  #desktopNav ul {
    max-width: 400px;
  }

  .nav-container {
    width: 80%;
    max-width: 500px;
  }

  .main-page .add-content h2 {
    padding-top: 40px;
  }

  h3 {
    padding-left: 0px;
    text-transform: uppercase;
    letter-spacing: 5px;
    font-size: 0.8rem;
    font-weight: 700;
    margin-bottom: -5px;
}

  h2 {
    font-size: 5rem!important;
  }


  .sub-add-content::after {
      background-size: 1200px;
  }

  h2, h3 {

  }


  .main-page .add-content .ani-el {
    transform: scale(0.8);
    top: -23.5%;
    right: 0%;
  }

  .col-left {
    max-width: 100%;
    transform: unset!important;
    position: static!important;
    width: 100%!important;
  }

  .col-right {
    width: 100%!important;
    max-width: 100%!important;
  }
}


@media (max-width: 991px) {

  button.nav-toggle:hover {
    background: none!important;
  }

  body {
    font-size: 1.05em;
    line-height: 1.4em;
  }

  .close-btn {
    right: 20px!important;
    top: 20px!important;
  }

  img.close-toggle {
    width: 23px;
    height: 23px;
  }

  #desktopNav ul li a {
    text-transform: none;
    border-radius: 50em!important;
    text-align:center!important;
    top: 0;
    font-size: clamp(1rem, 3vw, 1.45rem);
    padding: 1rem 4rem 1rem 4rem!important;
    line-height: 1em!important;
  }

  #desktopNav ul li a:after {
    left: 4rem;
    bottom: 0.75rem!important;
  }

  #desktopNav ul li a:hover:after {
    width: calc(100% - 8rem);
  }

  .sub-add-content::after {
      background-size: 1000px;
  }

  h2 {
    font-size: 3em;
  }

  .nav-container::after {
    content: '';
    background: url(../img/background-quote4.svg) repeat;
    background-size: 1400px;
    background-position: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 0.5;
  }

  .nav-container .socials {
    top: 10px!important;
    left: 0px!important;
    color: white;
    z-index: 5;
  }

  .close-btn {
    right: 1rem;
    top: 1rem;
    padding: 15px;
    transform: scale(1);
    background: rgba(255,255,255,0);
    border-radius: 150px;
    transition: all 0.3s ease-in-out;
    z-index: 100;
  }

  .main-page .add-content .ani-el {
    transform: scale(0.7);
    top: -17.5%;
    right: 0%;
  }

  .main-page .add-content h2 {
    color: white!important;
    padding-top: 40px;
  }

  .main-page .add-content h2::before {
    display: none;
  }


  .main-page .add-content h4 {
    color: #fff!important;
  }

  header .container-fluid {
    width: 100%!important;
  }

  #siteHeader .outer {
    height: 100px!important;
  }


  section.add-content .frame h4, section.sub-add-content .frame h4, section.sub-add-content p.lead {
      font-size: 1.1em!important;
      line-height: 1.75em!important;
      margin-bottom: 2em!important;
  }

}

@media (min-width: 768px) and (max-width: 991px) {

}

@media (max-width: 767px) {

  #c69 .table-responsive td:first-child {
    min-width: unset;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    font-weight: 700;
    font-size: 0.85em;
    line-height: 1.25em;
  }

  #c69 .table-responsive td {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    font-size: 0.85em;
    line-height: 1.25em;
  }

  .teaser-item.sortiment IMG {
    max-width: 100%!important;
    width: 100%!important;
    height: auto!important;
    position: relative;
    transform: translateY(-5%);
  }

  /* Place the timelime to the left */
  .main-timeline-2::after {
    left: 25px;
  }

  /* Full-width containers */
  .timeline-2 {
    width: 100%;
    padding-left: 70px;
    padding-right: 25px;
  }

  /* Make sure that all arrows are pointing leftwards */
  .timeline-2::before {
    left: 60px;
    border: medium solid white;
    border-width: 10px 10px 10px 0;
    border-color: transparent white transparent transparent;
  }

  /* Make sure all circles are at the same spot */
  .left-2::after,
  .right-2::after {
    left: 0px;
  }

  .left-2::before {
    right: auto;
  }

  /* Make all right containers behave like the left ones */
  .right-2 {
    left: 0%;
  }

  .sub-add-content::after {
      background-size: 900px;
  }

  .main-content .container h2 {
    font-size: 5em;
  }

  h2 {
    margin-bottom: 30px!important;
  }

  .add-content h2 {
    margin-bottom: 0px!important;
  }

  h2::before {
    top: calc( 100% );
    left: 0;
  }

  .quote .inner blockquote p {

    font-size: 1.6em;
    line-height: 1.5em;
    font-weight: 400;
  }

  .quote .inner p {
    font-size: 0.7em;
  }

  .main-page .add-content .ani-el {
    display: none;
  }

  .main-page .add-content h4 {
    font-size: 1.2em!important;
  }


}


@media (max-width: 520px) {



  #c69 .table-responsive {
    margin-top: 1rem;
    margin-bottom: 0rem;
  }

  #c69 .table-responsive ul.list-normal li {
    background: url(../img/list-style-icon.svg) no-repeat;
    background-size: 25px;
    background-position: left 11px;
  }

  #c69 .table-responsive td:first-child {
    min-width: unset;
    padding-left: 1rem;
    padding-right: 1rem;
    font-weight: 700;
    font-size: 0.75em;
    line-height: 1em;
  }

  #c69 .table-responsive td {
    padding-left: 1rem;
    padding-right: 1rem;
    font-size: 0.75em;
    line-height: 1em;
  }

  .activeNav .footerline {
    bottom: 90px;
  }

  .footerline a {
    font-size: 0.7em!important;
  }

  #desktopNav ul {
    max-width: 90%;
  }

  #desktopNav ul li a {
    text-transform: none;
    border-radius: 50em !important;
    text-align: center !important;
    top: 0;
    font-size: 15px!important;
    padding: 0.75rem 4.5rem 0.75rem 4.5rem !important;
    line-height: 1em !important;
  }

  #desktopNav ul li a:after {
    content:'';
    position: absolute;
    left: 4.5rem!important;
    bottom: 0.5rem!important;
    width: 0;
    height: 2px;
    background: white;
    opacity: 0;
    transition: all 0.3s ease;
  }


  #desktopNav ul li a:hover:after {
    width: calc(100% - 9rem)!important;
  }

  h2 {
    font-size: 3em!important;
  }

  ul.navbar-nav {
    margin-top: -5em!important
  }

  ul.navbar-nav li {
    font-size: 2em!important;
  }

}