/* Variablen Projekt */

:root {
  --color-primary: #0177BD;
  --color-secondary: #FFE45B;
  --color-tertiary: #808080;
  --bgcolor-footer: #ffffff;
  --bgcolor-main: #ffffff;
  --text-color-light: rgba(255,255,255,0.8);
  --text-color-dark: rgba(0,0,0,0.8);
  /*--text-color-medium: rgba(48,48,48,0.8);*/
  --border-radius: 0;
  /*--icon-color: white;*/
  --container-padding: 3rem 5rem 3rem 5rem;
  --line-height: 1em;
  --margin-standard: 3rem;
  --margin-small: 1rem;
  --margin-big: 5rem;
  --padding-standard: 3rem;
  --padding-small: 1rem;
  --padding-big: 5rem;
  --font-zoom-animation: font-size 0.5s ease-in-out;
  --text-shadow-light: 1px 1px 2px rgba(0,0,0,0.9);
  --box-shadow-light: 1px 1px 2px rgba(0,0,0,0.9);
}

/* Grundeinstellungen */

body::-webkit-scrollbar {
  display: none;
}

* {
  margin: 0;
  padding: 0;
  font-weight: 300;
  /*scrollbar-color: var(--color-primary) var(--bgcolor-main);*/
  scrollbar-width: thin;
}

html {
  scroll-behavior: smooth;
}

a, a:hover, .link-standard, .link-standard:hover {
  color: inherit;
  cursor: pointer;
  text-decoration: none;
}

html {
  font-size: 100%;
  letter-spacing: .02rem;
}

@media (min-width: 576px) {
  html {
    font-size: 90%;
  }
}

@media (min-width: 768px) {
  html {
    font-size: 90%;
  }
}

@media (min-width: 992px) {
  html {
    font-size: 90%;
  }
}

@media (min-width: 1200px) {
  html {
    font-size: 100%;
  }
}

@media (min-width: 1400px) {
  html {
    font-size: 110%;
  }
}

@media (min-width: 1600px) {
  html {
    font-size: 120%;
  }
}

@media (min-width: 1800px) {
  html {
    font-size: 130%;
  }
}

@media (min-width: 2000px) {
  html {
    font-size: 140%;
  }
}

body {
  font-family: 'Poppins';
  background-color: white;
}

.hintergrundbild-dienstleistungen {
  background-position: right;
  background: linear-gradient(black 0%, rgba(16,13,13,0.46) 33%, rgba(255,255,255,0) 100%), url("../../assets/img/Header/Hintergrund-Dienstleistungen.webp") top center / cover no-repeat;
  background-size: auto, cover;
}