/*-----STYLE.CSS V1-----*/
/*--------------------ALLGEMEINES--------------------*/
html,
body {
  margin: 0;
  width: 100vw;
  overflow-x: hidden;
  font-family: "Oswald", "Comfortaa", Arial, Helvetica, sans-serif;
}

img {
  width: 100%;
  display: block;
}

picture {
  display: flex;
}

h2 {
  font-weight: 100;
}

a {
  text-decoration: none;
  transition: all 0.3s ease;
}

a:hover {
  cursor: pointer;
  transform: scale(1.02);
}

p,
li {
  line-height: 1.5;
  font-size: 110%;
  color: var(--main-color);
}

.anchor {
  position: absolute;
  top: -60px;
}

/*------Farben------*/

:root {
  --main-color: rgb(30, 30, 30);
  --second-color: rgb(69, 154, 238);
  --second-color: rgb(22, 31, 141);
  --second-color-opac: rgba(69, 154, 238, 0.3);
  --grau: rgba(240, 240, 240, 1);
  --dunkelgrau: rgb(100, 100, 100);
  --darkgrey: rgb(50, 50, 50);
  --verlauf: linear-gradient(90deg, rgb(69, 154, 238), white);
}

.light {
  background-color: white;
}

.color_secondary {
  color: var(--second-color);
}

.color_main {
  color: var(--main-color);
}

.color_white {
  color: white;
}

.color_black {
  color: black;
}

.color_dunkelgrau {
  color: var(--dunkelgrau) !important;
}

.color_darkgrey {
  color: var(--darkgrey);
}

.bg_white {
  background-color: white;
  z-index: 0;
}

.bg_lightgrey {
  background-color: var(--grau) !important;
}

.bg_darkgrey {
  background-color: var(--dunkelgrau) !important;
}

.bg_main {
  background-color: var(--main-color);
}

.bg_secondary {
  background-color: var(--second-color);
}

.bg_verlauf {
  background-image: var(--verlauf);
}

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

@font-face {
  font-family: "Oswald";
  src: url("../style/fonts/Oswald-VariableFont_wght.ttf") format("truetype");
}

@font-face {
  font-family: "Gruppo";
  src: url("../style/fonts/Gruppo-Regular.ttf") format("truetype");
}

@font-face {
  font-family: "Michroma";
  src: url("../style/fonts/Michroma-Regular.ttf") format("truetype");
}

.gruppo {
  font-family: "Gruppo", Arial;
}

.oswald {
  font-family: "Oswald", Arial;
}

.michroma {
  font-family: "Michroma", sans-serif;
}

/*------Flexbox, Position, Alignment------*/

.position_relativ {
  position: relative;
}

.flexbox {
  width: 100%;
  display: flex;
  justify-content: space-evenly;
}

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

.flex_center_arround {
  display: flex;
  justify-content: space-around !important;
  align-items: center;
}

.flex_top_center {
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

.flex_top_center_arround {
  display: flex;
  justify-content: space-around !important;
  align-items: flex-start;
}

.flex_left_center {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.wrap {
  flex-wrap: wrap;
}

.nowrap {
  flex-wrap: nowrap;
}

.align_stretch {
  align-items: stretch;
}

.bottom_align {
  position: absolute;
  bottom: 10px;
}

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

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

.inline {
  display: inline-block !important;
}

/*------Height & Width------*/

.w100 {
  width: 100%;
}

.minheight0 {
  min-height: 0 !important;
}

/*------Margin & Padding------*/

.margin_zero {
  margin: 0 !important;
}

.margin_top {
  margin-top: 10px !important;
}

.margin_bottom {
  margin-bottom: 10px !important;
}

.padding_zero {
  padding: 0;
}

.padding10 {
  padding: 10px;
  box-sizing: border-box;
}

.padding20 {
  padding: 20px;
  box-sizing: border-box;
}

.padding_20_5 {
  padding: 20px 5%;
  box-sizing: border-box;
}

.padding_20_10 {
  padding: 20px 10%;
  box-sizing: border-box;
}

.padding_left_20 {
  padding-left: 20px;
}

.padding_top_bottom2 {
  padding-top: 2%;
  padding-bottom: 2%;
}

/*------Sonstiges------*/

.zindex2 {
  z-index: 2;
}

.display_desktop,
.display_tablet_and_desktop {
  display: none;
}

.lower-alpha {
  list-style: lower-alpha;
}

.strichliste {
  list-style-image: url(../files/svgs/ul.svg);
}

.strichliste_blau {
  list-style-image: url(../files/svgs/ul-blau.svg);
}

/*--------------------KOMPONENTEN / MODULE--------------------*/

/*------Headlines------*/

.h1_big {
  font-size: 33px;
  margin: 10px 0;
}

.h2_big {
  font-size: 33px;
  margin: 10px 0;
}

.h3_big {
  font-size: 27px;
  margin: 5px 0;
  font-weight: 100;
}

.p_x_big {
  font-size: 24px;
  margin: 0;
}

.p_big {
  font-size: 22px;
  margin: 0;
}

.p_small {
  font-size: 12px;
  margin: 0;
}

.standart_headline {
  padding: 10px 0;
  font-size: 30px;
  font-weight: bold;
}

/*------Spaces------*/

.space_small {
  height: 40px;
  width: 100%;
  background-color: white;
  z-index: 1;
}

.space75 {
  height: 75px;
  width: 100%;
}

/*------Links & Buttons------*/
/*------Links------*/

.link_secondary {
  color: var(--second-color);
  transition: all 0.2s ease;
}

.link_secondary:hover {
  color: var(--main-color);
}

/*------Buttons------*/
.button {
  background-color: var(--second-color);
  border: 1px solid var(--second-color);
  color: white;
  padding: 10px 20px;
  margin: 20px 20px;
  display: block;
  text-align: center;
  transition: all 0.5s ease;
  font-size: 120%;
  letter-spacing: 1.2px;
}

.button:hover {
  transform: scale(1.05);
  background-color: white;
  color: var(--second-color);
  cursor: pointer;
}

.button_white {
  background-color: white;
  color: var(--second-color);
  padding: 10px 20px;
  margin: 20px 20px;
  display: inline-block;
  text-align: center;
  transition: all 0.5s ease;
  font-size: 120%;
  letter-spacing: 1.2px;
}

.button_white:hover {
  transform: scale(1.05);
  cursor: pointer;
}

/*------Stages------*/

.stage_v2 {
  width: 100%;
  height: 100vh;
  min-height: 700px;
  position: relative;
}

.stage_v2_text {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 2;
  padding: calc(75px + 3%) 15%;
  box-sizing: border-box;
  text-align: center;
}

.stage_v2_overlay {
  width: inherit;
  height: inherit;
  top: 0;
  left: 0;
  padding: 100px 5% 0 5%;
  padding-top: 100px;
  box-sizing: border-box;
  position: absolute;
  z-index: 2;
}

.stage_v2 img {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 60vh;
  min-height: 390px;
}

.stage_v2 .two_col .button_white {
  min-height: 50px;
  min-width: 30vw;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

.stage_v2 .button_white,
.stage_v2 .button {
  width: 50%;
  border-radius: 5px;
  font-size: 15px;
}

.stage_v2 .center .button {
  width: 30%;
  min-width: 250px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 15px;
  margin-bottom: 5px;
}

.stage_v2 .icon--big {
  position: relative;
  width: 150px;
  height: auto;
  min-height: unset;
  margin: 0 auto;
}

.gradient {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}

.gradient_black {
  background-color: rgba(0, 0, 0, 0.7);
}

.gradient_light_black {
  background-color: rgba(0, 0, 0, 0.4);
}

.gradient_white {
  background-color: rgba(255, 255, 255, 0.7);
}

.gradient_light_white {
  background-color: rgba(255, 255, 255, 0.4);
}

.gradient_white_left {
  background-color: rgba(255, 255, 255, 0.8);
  background-image: none;
}

/*------Akkordion OHNE JS MIT +/- -------*/

.accordion input {
  display: none;
}

.accordion label {
  display: block;
  padding: 8px 22px;
  margin: 0 0 1px 0;
  cursor: pointer;
  background: var(--second-color);
  border-radius: 3px;
  color: white;
  transition: ease 0.5s;
  position: relative;
}

.accordion label:hover {
  background: var(--main-color);
}

.accordion label::after {
  content: "+";
  right: 10px;
  top: 10px;
  position: absolute;
}

input:checked + label::after {
  content: "-";
  right: 10px;
  position: absolute;
}

.accordion_content {
  background: white;
  padding: 10px 25px;
  border: 1px solid var(--main-color);
  margin: 0 0 1px 0;
  border-radius: 3px;
  transition: all 0.5s ease;
}

input + label + .accordion_content {
  display: none;
  /*transform: scale(1, 0);
    transform-origin: top;
    position: absolute;*/
  z-index: 1;
}

input:checked + label + .accordion_content {
  display: block;
  /*transform: scale(1, 1);*/
}

/*------Columns------*/

.column_container {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  position: relative;
  justify-content: center;
}

.column_reverse {
  flex-direction: column-reverse;
}

.row_reverse {
  flex-direction: row-reverse;
}

.two_col {
  width: 100%;
  min-height: 250px;
  overflow: hidden;
  align-items: center;
  overflow: hidden;
  box-sizing: border-box;
}

.col_10,
.col_20,
.col_30,
.col_40,
.col_50,
.col_60,
.col_70 {
  width: 100%;
  overflow: hidden;
  align-items: center;
}

.col_20_mobile {
  width: 20%;
  overflow: hidden;
  align-items: center;
}

.col_80_desktop {
  width: 100%;
  overflow: hidden;
  align-items: center;
}

.three_col,
.three_col_small {
  width: 90%;
  overflow: hidden;
  margin: 20px 5%;
  box-sizing: border-box;
}

/*------Slider------*/

.slider_container {
  width: 100%;
  position: relative;
  padding: 10px 0;
  overflow: hidden;
}

.slider {
  display: flex;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  transition: all 0.5s ease-in-out;
}

.slide {
  width: 100%;
  padding: 0 10%;
  box-sizing: border-box;
  flex-shrink: 0;
  height: 100%;
  scroll-snap-align: start;
  scroll-behavior: smooth;
}

.move_left,
.move_right {
  width: 10%;
  height: 100%;
  position: absolute;
  top: 0;
  z-index: 2;
  transition: all 0.5s ease;
}

.move_left:hover,
.move_right:hover {
  cursor: pointer;
  transform: scale(1.05);
}

.move_left {
  left: 0;
}

.move_right {
  right: 0;
}

/*------Round Icons------*/

.round_icon {
  width: 120px;
  height: 120px;
  padding: 30px;
  margin: 2%;
  box-sizing: border-box;
  border-radius: 1000px;
  background-color: var(--second-color);
  transition: all 0.5s ease;
}

.round_icon:hover {
  transform: scale(1.05);
}

/*------Teaser------*/

.teaser {
  padding: 20px;
  box-sizing: border-box;
}

.img_teaser {
  width: 50%;
  height: 200px;
  position: relative;
  display: block;
  background-size: cover;
}

.img_teaser:hover {
  cursor: pointer;
}

.img_teaser:hover > .img_teaser_gradient {
  background-color: rgba(0, 0, 0, 0.2);
}

.img_teaser_gradient {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.89);
  transition: all 0.2s ease;
}

.img_teaser_gradient img {
  transition: all 0.2s ease;
  width: initial;
  height: 60px;
}

.img_teaser_gradient:hover > img {
  opacity: 0;
}

.img_teaser_text {
  position: absolute;
  bottom: 10px;
  left: 10px;
  font-size: 120%;
  color: white;
  z-index: 3;
}

.teaser_v2 .button {
  position: absolute;
  bottom: 0px;
  width: calc(80% - 40px);
  left: 10%;
  box-sizing: border-box;
}

.teaser_v2 .teaser_v2_text {
  margin-bottom: 70px;
}

/*------Steps------*/

.step_container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  position: relative;
}

.step_icon {
  width: 150px;
  height: 150px;
  background-color: var(--grau);
  border-radius: 1000px;
}

.step_icon img {
  width: 50%;
}

.step_number {
  width: 0;
  height: 0;
  padding: 20px;
  position: absolute;
  top: 55%;
  left: calc(50% - 105px);
  background-color: var(--second-color);
  border-radius: 1000px;
}

/*------Effekte------*/

.hover_move_up {
  display: block;
  position: relative;
  transition: all 0.2s ease;
}

.hover_move_up:hover {
  margin-top: -10px;
  margin-bottom: 10px;
  box-shadow: 0 10px 15px var(--dunkelgrau);
}

.hover_grow {
  transition: all 0.4s ease;
}

.hover_grow:hover {
  transform: scale(1.05);
  box-shadow: 0 0 15px 2px var(--dunkelgrau);
}

/*------Zoom Bild------*/

.zoom_image {
  width: 100%;
  overflow: hidden;
}

.zoom_image img {
  transition: all 0.4s ease;
}

.zoom_image img:hover {
  transform: scale(1.07);
}

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

.kontakt_formular .two_col {
  min-height: initial;
}

.kontakt_formular label {
  font-size: 20px;
}

.kontakt_formular input {
  width: 90%;
  height: 30px;
  margin-bottom: 10px;
  font-size: 20px;
  border: 1px solid white;
}

.kontakt_formular input[name="datenschutz"] {
  width: auto;
  margin: 0;
}

.kontakt_formular textarea {
  width: 95%;
  height: 60px;
}

.kontakt_formular button {
  padding: 10px 20px;
  border: none;
  background-color: white;
  font-size: 100%;
  transition: all 0.2s ease;
}

.kontakt_formular button:hover {
  color: var(--second-color);
  cursor: pointer;
  transform: scale(1.05);
  border-radius: 5px;
}

/*------Termin vereinbaren Modul------*/

.termin .two_col {
  min-height: initial;
}

.termin h2 {
  margin-top: 20px;
  font-weight: bold;
}

.telefon {
  margin: 20px 30px 20px 30px;
  padding: 10px 20px 10px 60px;
  width: 160px;
  background-color: white;
  position: relative;
  transition: all 0.2s ease;
}

.telefon:hover > .hoerer_kreis {
  transform: scale(1.1);
}

.telefon:hover {
  transform: scale(1.05);
  cursor: pointer;
  border-radius: 5px;
}

.telefon a {
  color: var(--second-color);
}

.hoerer_kreis {
  width: 50px;
  height: 50px;
  padding: 10px;
  border-radius: 50px;
  background-color: white;
  position: absolute;
  top: -10px;
  left: -20px;
  transition: all 0.2s ease;
}

/*-------------Referenzen-------------*/

#references {
  width: 100%;
  padding: 20px 00px;
  box-sizing: border-box;
}

.reference {
  width: 100%;
  margin-bottom: 20px;
}

.reference_name {
  font-size: 110%;
  margin: 0;
  margin-bottom: 10px;
  margin-right: 20px;
  font-weight: bold;
  display: inline-block;
  vertical-align: top;
}

.reference_stars {
  display: inline-block;
  vertical-align: top;
  height: 20px;
  width: initial;
}

.reference_text {
  color: grey;
}

/*------Background Images------*/

.bg_cover {
  background-size: cover;
}

.bg_center {
  background-position: center;
}

#bg_img_stage_home {
  background-image: url("../files/images/IMG_6_450x600.jpg");
}

#bg_img_stage_hobbywerkstatt {
  background-image: url("../files/images/IMG_4_450x600.jpg");
}

#bg_img_hobbywerkstatt_teaser {
  background-image: url("../files/images/IMG_16_450x600.jpg");
}

#bg_img_teaser_reifen {
  background-image: url("../files/images/IMG_12_500x333.jpg");
}

#bg_img_teaser_inspektion {
  background-image: url("../files/images/IMG_9_500x333.jpg");
}

#bg_img_teaser_huau {
  background-image: url("../files/images/IMG_15_500x333.jpg");
}

#bg_img_teaser_smartrepair {
  background-image: url("../files/images/IMG_14_500x333.jpg");
}

#bg_img_teaser_bremse {
  background-image: url("../files/images/IMG_1_500x333.jpg");
}

#bg_img_teaser_licht {
  background-image: url("../files/images/IMG_11_500x333.jpg");
}

#bg_img_teaser_getriebe {
  background-image: url("../files/images/IMG_8_500x466.jpg");
}

#bg_img_teaser_klima {
  background-image: url("../files/images/IMG_10_500x333.jpg");
}

#bg_img_meisterwerkstatt {
  background-image: url("../files/images/IMG_2_640x480.jpg");
}

#bg_img_hobbywerkstatt {
  background-image: url("../files/images/IMG_3_640x480.jpg");
}

/*--------------------HEADER--------------------*/
/*------Navigation------*/
#space {
  height: 65px;
  width: 100%;
  display: none;
}

#navi {
  width: 100%;
  position: fixed;
  background-color: white;
  display: flex;
  align-items: center;
  z-index: 10;
}

#logo_img {
  height: 45px;
  width: auto;
  padding: 15px;
  transition: all 0.5s ease;
}

#home_headline {
  width: calc(100% - 75px - 60px);
  margin-top: 0px;
  font-size: 22px;
  transition: all 0.5s ease;
  font-weight: bold;
  overflow: hidden;
  line-height: 1;
}

#burger_icon {
  padding: 0 15px;
  cursor: pointer;
}

.burger_line {
  width: 25px;
  height: 3px;
  margin: 5px 0;
  background-color: black;
}

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

#menue {
  width: 100%;
  padding-bottom: 30px;
  margin-top: 65px;
  position: fixed;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  transition: all 0.2s ease;
  transform: scale(1, 0);
  transform-origin: top;
  overflow: hidden;
  background-color: white;
  z-index: 10;
}

.menue_item {
  width: 80%;
  padding-top: 20px;
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  position: relative;
}

.menue_link {
  width: 99%;
  color: var(--main-color);
  border-bottom: 1px solid var(--main-color);
}

/*------Dropdown------*/

.dropdown {
  width: 100%;
  padding-left: 2%;
  display: none;
  flex-wrap: wrap;
  justify-content: center;
  overflow: hidden;
  background-color: white;
}

.dropdown_item {
  width: 100%;
  height: 37px;
  display: flex;
  align-items: flex-end;
  color: var(--main-color);
}

.dorpdown_arrow {
  width: 10%;
  right: -10px;
  top: 20px;
  padding: 10px 5px;
  position: absolute;
}

.dorpdown_arrow::after {
  width: 0.45em;
  height: 0.45em;
  margin: -20px 0 0 -5%;
  position: absolute;
  display: flex;
  align-items: flex-end;
  border-style: solid;
  border-width: 0.15em 0.15em 0 0;
  content: "";
  transform: rotate(133deg);
}

/*--------------------FOOTER--------------------*/

footer img {
  width: 50%;
}

#below_menue {
  padding: 20px;
  text-align: center;
  background-color: var(--second-color);
}

#copyright {
  font-size: 50%;
  min-height: initial;
}

#footer_navi {
  padding: 20px;
}

#footer_navi a {
  color: var(--main-color);
}

#powered {
  padding: 10px;
  min-height: initial;
  color: white;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
}

#powered a {
  color: white;
  text-decoration: underline;
  transition: all 0.2s ease;
}

#powered a:hover {
  color: var(--second-color-opac);
  text-decoration: underline;
}

#logo_footer {
  order: 3;
}

/*------Footer Menü------*/

.footer_menue {
  width: 100%;
  padding: 20px;
  display: flex;
  flex-wrap: wrap;
  background-color: var(--main-color);
  box-sizing: border-box;
}

.footer_menue a {
  width: 100%;
  padding: 5px 0;
  font-size: 90%;
  transition: all 0.2s ease;
  color: white;
}

.footer_menue a:hover {
  color: var(--second-color);
}

.footer_menue h3 {
  margin: 0;
  color: var(--second-color);
  font-size: 150%;
  font-family: "oswald", Arial;
}

/*--------------------IPAD TABLET ANPASSUNGEN--------------------*/

@media only screen and (min-width: 1023px) {
  /*--------------------ALLGEMEINES--------------------*/
  /*--------------------KOMPONENTEN / MODULE--------------------*/
  /*------Headlines------*/

  .h1_big {
    font-size: 60px;
    margin: 10px 0;
  }

  .h2_big {
    font-size: 50px;
    margin: 10px 0;
  }

  .h3_big {
    font-size: 40px;
    margin: 5px 0;
    font-weight: 100;
  }

  .p_x_big {
    font-size: 30px;
    margin: 0;
  }

  .p_small {
    font-size: 15px;
    margin: 0;
  }

  /*------Columns------*/

  .col_10 {
    width: 10%;
  }

  .col_20 {
    width: 20%;
  }

  .col_30 {
    width: 30%;
  }

  .col_40 {
    width: 40%;
  }

  .col_50 {
    width: 50%;
  }

  .col_60 {
    width: 60%;
  }

  .col_70 {
    width: 70%;
  }

  .col_80_desktop {
    width: 80%;
    overflow: hidden;
    align-items: center;
  }

  .two_col {
    width: 50%;
  }

  .two_col_mobile {
    width: 50%;
  }

  .three_col {
    width: 30%;
    margin: 20px 1%;
  }

  .three_col_small {
    width: 25%;
    margin: 20px 3%;
  }

  .column_reverse {
    flex-direction: row;
  }

  /*------Icon Slider------*/

  .icon_slider {
    animation: none;
  }

  .icon_slider_item {
    width: 8%;
    flex-shrink: initial;
  }

  /*------Teaser------*/

  .img_teaser {
    width: 25%;
    height: 300px;
  }

  .img_teaser_text {
    font-size: 200%;
  }

  .img_teaser_gradient img {
    height: 90px;
  }
  d .teaser_v2 .button {
    bottom: 40px;
  }

  /*------Argumente------*/

  .argumente_container {
    height: calc(100vh - 65px);
  }

  .argumente_container .column_container {
    width: 100%;
    bottom: 0;
    left: 0;
    position: absolute;
  }

  .argumente_container .three_col_small {
    bottom: 0;
    margin-bottom: 0;
  }

  /*------Stages------*/

  .stage_v2 img {
    height: 50vh;
  }

  #stage_shape_2 {
    height: 60vh;
    min-height: 450px;
  }

  #bg_img_stage_hobbywerkstatt #stage_shape_2 {
    height: 51vh;
  }

  .stage_v2 .two_col .button_white {
    min-height: 80px;
  }

  .stage_v2 .button_white {
    font-size: 22px;
  }

  .stage_v2 .center .button {
    font-size: 22px;
  }

  .gradient_white_left {
    background-image: linear-gradient(90deg, white, rgba(255, 255, 255, 0.3));
    background-color: none;
  }

  /*------Sonstiges------*/

  .display_tablet_and_desktop {
    display: block;
  }

  /*------Background Images------*/

  #bg_img_stage_home {
    background-image: url("../files/images/IMG_6_1920x1080.jpg");
  }

  #bg_img_stage_hobbywerkstatt {
    background-image: url("../files/images/IMG_4_1920_1080.jpg");
  }

  #bg_img_hobbywerkstatt_teaser {
    background-image: url("../files/images/IMG_16_1920x1000.jpg");
  }

  /*--------------------HEADER--------------------*/

  .burger_line {
    width: 25px;
    height: 3px;
    margin: 5px 0;
  }

  /*--------------------FOOTER--------------------*/
  /*------Footer Menü------*/

  footer {
    display: flex;
    flex-wrap: wrap;
  }

  .footer_menue {
    width: 30%;
    flex-grow: 2;
  }

  #below_menue {
    width: 100%;
  }

  #logo_footer {
    order: 0;
  }

  #powered {
    justify-content: flex-end;
    padding-right: 50px;
  }
}

/*--------------------DESKTOP ANPASSUNGEN--------------------*/

@media only screen and (min-width: 1113px) {
  /*--------------------ALLGEMEINES--------------------*/
  /*--------------------KOMPONENTEN / MODULE--------------------*/
  .stage_v2 .icon--big {
    width: 220px;
  }
  /*-----Columns-----*/

  .three_col_small {
    width: 20%;
    margin: 20px 5%;
  }

  /*------Teaser------*/

  .teaser {
    padding: 20px 5%;
  }

  /*------Sonstiges------*/

  .display_desktop {
    display: block;
  }

  /*--------------------HEADER--------------------*/

  #space {
    display: none;
  }

  #navi {
    transition: all 0.5s ease;
    background-color: white;
  }

  #home_headline {
    font-size: 35px;
    max-width: 400px;
    margin-top: 10px;
    line-height: 1.2;
  }

  #burger_icon {
    display: none;
  }

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

  #menue {
    width: calc(100% - 475px);
    padding: 25px;
    margin: 0;
    justify-content: flex-end;
    right: 0;
    transform: scale(1, 1);
    background-color: initial;
    overflow: initial;
  }

  .menue_item {
    width: auto;
    height: auto;
    padding: 0;
    position: relative;
    display: inline-block;
    transition: all 0.5s ease;
    color: white;
    border-bottom: none;
  }

  .menue_item:hover > .dropdown {
    visibility: visible;
    opacity: 1;
  }

  .menue_link {
    width: 100%;
    padding-top: 50px;
    margin: 0 25px;
    transition: all 0.2s ease;
    color: var(--main-color);
    border-bottom: none;
  }

  .menue_link:hover {
    color: var(--second-color) !important;
    border-bottom: 1px solid var(--second-color);
  }

  /*------Dropdown------*/

  .dropdown {
    width: auto;
    margin: 10px 0 0 25px;
    padding: 0;
    position: absolute;
    display: flex;
    visibility: hidden;
    opacity: 0;
    transition: all 0.3s ease;
    z-index: 1;
  }

  .dropdown_right {
    right: 0;
  }

  .dropdown_item {
    height: auto;
    padding: 15px 5px;
    display: flex;
    transition: all 0.2s ease;
    border-bottom: 1px solid rgba(30, 30, 30, 0.1);
  }

  .dropdown_item:hover {
    color: var(--second-color);
  }

  .dorpdown_arrow {
    display: none;
  }

  /*--------------------FOOTER--------------------*/
}

/*--------------------SEITENSPEZIFISCHE ANPASSUNGEN--------------------*/

/*------Über uns------*/

#ueber_uns .col_20_mobile img {
  border: 1px solid black;
}

#bg_img_hobbywerkstatt_teaser p {
  max-width: 100%;
  padding: 0 2%;
}

@media only screen and (min-width: 1023px) {
  #bg_img_hobbywerkstatt_teaser p {
    max-width: 55%;
    padding-right: 2%;
  }
}