/* Style Sheet */



/* sofia-sans-condensed-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: 'Sofia Sans Condensed';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/sofia-sans-condensed-v5-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/sofia-sans-condensed-v5-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* sofia-sans-condensed-600 - 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: 'Sofia Sans Condensed';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/sofia-sans-condensed-v5-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/sofia-sans-condensed-v5-latin-600.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* sofia-sans-condensed-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: 'Sofia Sans Condensed';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/sofia-sans-condensed-v5-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/sofia-sans-condensed-v5-latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* poppins-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: 'Poppins';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/poppins-v24-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/poppins-v24-latin-300.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* poppins-200 - 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: 'Poppins';
  font-style: normal;
  font-weight: 200;
  src: url('../fonts/poppins-v24-latin-200.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/poppins-v24-latin-200.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* poppins-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: 'Poppins';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/poppins-v24-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/poppins-v24-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* poppins-500 - 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: 'Poppins';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/poppins-v24-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/poppins-v24-latin-500.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* poppins-600 - 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: 'Poppins';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/poppins-v24-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/poppins-v24-latin-600.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* poppins-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: 'Poppins';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/poppins-v24-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/poppins-v24-latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}



/* Kalibrierung der wichtigsten Abstände */

/* Allgemeine Selektoren */

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;

}

html {
  background: white;
  scroll-behavior: smooth;
}

body {
  color: rgb(49,50,60);
  background: white;
  line-height: 1.5;
hyphens: auto;
  overflow-wrap: break-word;
  word-break: normal;
}

a { outline: none; }
/* Styles für das Layout */

img {
  max-width: 100%;
  height: auto;
}

p {
  margin: 0 0 15px 0;
}

#banner {
  width: 100%;
  height: auto;
  overflow: hidden;
  background: white;
  opacity: 0.9;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
}




#banner-innen {
  width: 100%;
  max-width: 1280px;
  height: auto;
  margin-right: auto;
  margin-left: auto;
  padding: 20px 0 20px 20px;
}

#logo {
  width: 50%;
  height: auto;

}



.orgel {
  width: 30%;
  height: auto;
  font-family: 'Poppins';
  font-weight: 500;
 font-size: clamp(0.8rem, 0.5333rem + 1.3333vw, 1.6rem);
  color: rgb(136,22,33);
  margin: 0;
  line-height: 1.2;
  padding-top: 10px;
}

#orgel-1 {
  display: none;
}

.orgel-mobile {
    width: 100%;
  max-width: 1280px;
  height: auto;
  font-family: 'Poppins';
  font-weight: 500;
 font-size: clamp(0.8rem, 0.5333rem + 1.3333vw, 1.6rem);
  color: rgb(136,22,33);
  margin: 0 auto;
  line-height: 1.2;
  padding: 5px;
}

/* mobil menu*/

#aussen {
  width: 7%;
  height: auto;
  overflow: hidden;
  margin-right: 20px;
}

#aussen .button {
  color: rgb(136,22,33);

}

#aussen .button:hover {
  color: rgb(35,38,122);
}

#aussen .button rect {
  height: 3px;
}





/* Navigation */

#canvas ul {
  padding-left: 0;
}

#canvas ul li {
  list-style-type: none;
  font-family: 'Poppins';
  font-weight: 600;
}



#canvas ul li a {
  text-decoration: none;
  background-color: rgb(210,210,234);
  padding: 10px 30px 10px 30px;
  display: block;
  margin-bottom: 2px;
  color: rgb(35,38,122);
  font-size: clamp(1rem, 0.8rem + 1vw, 1.6rem);
}

#canvas ul li a:hover,
#canvas ul li.uk-active a,
#canvas ul li.item-114.uk-active a,
#canvas ul li.item-115.uk-active a,
#canvas ul li.item-116.uk-active a,
#canvas ul li.item-117.uk-active a,
#canvas ul li.item-119.uk-active a,
#canvas ul li.item-120.uk-active a,
#canvas ul li.item-123.uk-active a {
  color: rgb(136,22,33);
}

#canvas ul li.item-114 a,
#canvas ul li.item-115 a,
#canvas ul li.item-116 a,
#canvas ul li.item-117 a,
#canvas ul li.item-119 a,
#canvas ul li.item-120 a,
#canvas ul li.item-123 a {
   text-decoration: none;
  background-color: rgb(210,210,234);
  padding: 10px 20px 10px 70px;
  display: block;
  margin-bottom: 2px;
  color: rgb(35,38,122);
font-size: clamp(1rem, 0.8667rem + 0.6667vw, 1.4rem);
  font-weight: 400;
}



.navbar-toggler-right {
  display: none;
}



 .uk-offcanvas-bar {
   z-index: 2000;
    left: -500px;
    width: 500px;
    padding: 0;
   background: none;
   top: 120px;
  }



/* Startseite*/

/* slider */

.top-slider {
  width: 100%;
  height: auto;
}

.abstand {
  padding-bottom: 40px;
}

.abstand-klein {
  padding-bottom: 20px;
}

.slider-alles {
  width: 100%;
  max-width: 1280px;
  padding-left: 20px;
  height: auto;
  margin: 0 auto;
}

.slider-bild {
  width: 50%;
  height: auto;
  margin-bottom: 8%;
}



.slider-unten {
  font-family: 'Poppins';
  font-weight: 200;
font-size: clamp(1.2rem, -0.0667rem + 6.3333vw, 5rem);
  color: white;
  background: rgba(136,22,33,0.8);
  padding: 0 20px 0 20px;
}

.slider-unten p,
.slider-unten-blau p {
  margin: 0;
}

.slider-unten-blau {
  font-family: 'Poppins';
  font-weight: 200;
font-size: clamp(1.2rem, -0.0667rem + 6.3333vw, 5rem);
  color: white;
  background: rgba(35,38,122,0.8);
  padding: 0 20px 0 20px;
}

.slider-unten-blau .kontakt {
  font-size: clamp(1.2rem, 0.7667rem + 2.1667vw, 2.5rem);
}


/* Inhalt */

#content {
  width: 100%;
  height: auto;
  overflow: hidden;
}


.inhalt {
  width: 100%;
  max-width: 1100px;
  height: auto;
 font-family: 'Sofia Sans Condensed';
  font-style: normal;
  font-weight: 400;
  color: rgb(49,50,60);
font-size: clamp(1.2rem, 1.0359rem + 0.8205vw, 1.6rem);
  margin: 0 auto;
  padding: 40px 30px 0px 0px;
}

.inhalt h1,
p.gross {
  font-family: 'Poppins';
  font-weight: 500;
 font-size: clamp(1.2rem, 0.8333rem + 1.8333vw, 2.3rem);
  color: rgb(136,22,33);
  margin-left: 11.5%;
}

p.gross-blau {
  font-family: 'Poppins';
  font-weight: 500;
font-size: clamp(1.2rem, 0.8333rem + 1.8333vw, 2.3rem);
  color: rgb(35,38,122);
  margin-left: 11.5%;
  line-height: 1.2;
}

.inhalt .links-abstand {
  margin-left: 9%;
}

/* graues Feld mit Icons */

.feld-grau {
  width: 100%;
  height: auto;
  background: rgb(241,240,249);
  padding: 40px 20px 40px 20px;
}

.feld-inhalt {
   width: 100%;
  max-width: 1100px;
  height: auto;
 font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  color: rgb(136,22,33);
  margin: 0 auto;
}

.feld-inhalt a:hover {
  text-decoration: none;
}

.feld-inhalt a:hover .feld-innen {
  background: rgb(247,241,239);
}

.feld-innen {
  background: rgb(241,240,249);
}

.feld-innen img {
  width: 30%;
  height: auto;
}

.card-titel {
 font-size: clamp(1.2rem, 1.0667rem + 0.6667vw, 1.6rem);
  color: rgb(136,22,33);
  font-weight: 500;
  line-height: 1.3;
  font-family: 'Poppins';
  
}

.ueber,
.liste {
 font-size: clamp(1.2rem, 1.0359rem + 0.8205vw, 1.6rem);
  color: rgb(136,22,33);
  font-weight: 500;
  font-family: 'Poppins';  
}

.liste-blau {
 font-size: clamp(1.2rem, 1.0359rem + 0.8205vw, 1.6rem);
  color: rgb(35,38,122);
  font-weight: 500;
  font-family: 'Poppins';  
}

.ueber-blau,
h1.ueber-blau {
 font-size: clamp(1.2rem, 1.0359rem + 0.8205vw, 1.6rem);
  color: rgb(35,38,122);
  font-weight: 500;
  font-family: 'Poppins';  
  margin-left: 0;
}

.liste,
.liste-blau {
  list-style-type: none;
}

.liste > li,
.liste-blau > li {
  position: relative;
    padding-left: 1.1em; /* Abstand zum Quadrat */
}



.liste > li::before,
.liste-blau > li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.40em; /* vertikale Ausrichtung */
    width: 0.7em;   /* Quadratgröße */
    height: 0.7em;
    background-color: currentColor; /* übernimmt Textfarbe */
}

.liste,
.liste-blau {
  margin-left: 0;
}

.liste li.schaden::before {
  visibility: hidden;
}
.liste > li.schaden {
  position: relative;
    padding-left: 0; /* Abstand zum Quadrat */
}
.card-text {
 font-size: clamp(1rem, 0.8974rem + 0.5128vw, 1.25rem);
   color: rgb(136,22,33);
}

.feld-blau {
  background: rgb(35,38,122);
}

.feld-blau p {
  color: white;
   font-size: clamp(1.2rem, 1.0359rem + 0.8205vw, 1.6rem);
}

.klein.uk-list > :nth-child(n+2) {
  margin-top: 0;
}

/* rosa Feld */

.feld-rosa,
.feld-rosa-gross {
  width: 100%;
  height: auto;
  background: rgb(247,241,239);
  padding-bottom: 40px;
}

.feld-hell {
  width: 100%;
  height: auto;
  background: rgb(241,240,249);
  padding-bottom: 40px;
}

.feld-rosa p {
  color: rgb(136,22,33);
  margin: 0 !important;
}

.feld-hell p {
  color: rgb(35,38,122);
  margin: 0 !important;
}

.feld-rosa p.strong,
.feld-hell p.strong {
  font-weight: 700;
}

p.strong-rot {
   color: rgb(136,22,33);
  font-weight: 700;
}

/* Schadenmanagement */

a.schaden {
  text-decoration: none;
  color: rgb(136,22,33);
  font-weight: 700;
}

a.schaden:hover {
  color: rgb(35,38,122);
}

.toggle-inhalt {
  background: rgb(241,240,249);
  margin-left: 30px;
  padding: 30px 30px 30px 10px;
}

.abstand-oben {
  padding-top: 40px;
}


  /* footer */

#footer {
    width: 100%;
    height: auto;
  }

.footer-innen {
  width: 100%;
  max-width: 1280px;
  height: auto;
  padding: 40px 20px 40px 20px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
justify-content: space-between;
}

.footer-left {
  width: 37%;
  height: auto;
  padding-right: 40px;
}

.footer-left img {
  object-fit: unset;
}


.footer-mitte {
  width: 43%;
  height: auto;
}

.footer-mitte p {
  color: rgb(136,22,33);
  font-family: 'Poppins';
 font-size: clamp(1.2rem, 0.9333rem + 1.3333vw, 2rem);
  font-weight: 500;
  line-height: 1.2;
}

.footer-mitte p.footer-klein {
    color: rgb(49,50,60);
font-family: 'Sofia Sans Condensed';
font-size: clamp(1.2rem, 1.0359rem + 0.8205vw, 1.6rem);
  font-weight: 400;
  margin-top: 30px;
}

.footer-right {
  width: 20%;
  height: auto;
}

.footer-right p {
  color: rgb(136,22,33);
font-family: 'Sofia Sans Condensed';
font-size: clamp(1.2rem, 1.0359rem + 0.8205vw, 1.6rem);
  font-weight: 400;
  line-height: 1.2;
  margin-top: 0;
  margin-bottom: 10px;
}


a.rot {
  color: rgb(136,22,33);
  text-decoration: none;
}

a.rot:hover,
a.grau:hover {
  color: rgb(35,38,122);
  text-decoration: none;
}

p.unter {
  line-height: 1.1;
}

a.blau {
   color: rgb(35,38,122);
}

a.blau:hover {
    color: rgb(136,22,33);
}

a.grau {
  color: rgb(49,50,60);
  text-decoartion: none;
}

/* fixierte box seitlich */

#fixed-middle-box {
    position: fixed;
    top: 70%;
    right: 0;
    transform: translateY(-90%);
    z-index: 1000;
    overflow: visible;
}
.contact {
	margin-bottom: 15px;
    display: flex;
    align-items: center;
    position: relative;
	right: -150px; /* versteckt den Textteil */
    transition: right 0.3s ease;
}

.con-icon {
	width: 80px;
	height: 80px;
	 display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}


.con-text {
	width: 150px;
	height: 80px;
	 font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
	font-size: clamp(1rem, 0.8667rem + 0.6667vw, 1.4rem);
	color: rgb(49,50,60);
	background: white;
	padding-left: 10px;
	display: flex;
    align-items: center;
    white-space: nowrap;
}

/* Slide-in beim Hover auf .contact */

.contact:hover {
   right: 0;
}

.con-text a {
	color: rgb(49,50,60);
	text-decoration: none;
}

.con-text a:hover {
	color: rgb(35,38,122);
	text-decoration: none;
}

#schimmelpilzsanierung {
  scroll-margin-top: 110px;
}

.skip-to {
  z-index: 5000;
}