@charset "UTF-8";
/*
Autor: Werbung 705, Marco Brüggemann, www.705gruppe.de
*/
body.home, body.unterseite,
body.impressum {
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-rows: 800px auto auto 50px;
  grid-template-areas: "sliderTop" "contentArea" "footerArea" "footerMenuLine";
  padding-top: 70px;
}
@media screen and (max-width: 499px) {
  body.home, body.unterseite,
  body.impressum {
    grid-template-rows: 500px auto auto 50px;
  }
}
@media screen and (min-width: 500px) and (max-width: 799px) {
  body.home, body.unterseite,
  body.impressum {
    grid-template-rows: 500px auto auto 50px;
  }
}
@media screen and (min-width: 800px) and (max-width: 1199px) {
  body.home, body.unterseite,
  body.impressum {
    grid-template-rows: 600px auto auto 50px;
  }
}
@media screen and (min-width: 1200px) and (max-width: 1600px) {
  body.home, body.unterseite,
  body.impressum {
    grid-template-rows: 700px auto auto 50px;
  }
}

body.unterseite {
  grid-template-rows: 800px auto auto 50px;
}

#sliderTop,
#sliderTopBellini,
#sliderTopAlbertpark,
#sliderTopHeideDresden,
#sliderTopWeisweiler,
#sliderTopLerchenfeld,
#sliderTopRomainRolland,
#sliderTopLeistungen,
#pageHeader,
.contentThema,
#pageFooter,
#pageFooterMenuline {
  display: grid;
  grid-template-columns: 1fr 1500px 1fr;
}
@media screen and (max-width: 499px) {
  #sliderTop,
  #sliderTopBellini,
  #sliderTopAlbertpark,
  #sliderTopHeideDresden,
  #sliderTopWeisweiler,
  #sliderTopLerchenfeld,
  #sliderTopRomainRolland,
  #sliderTopLeistungen,
  #pageHeader,
  .contentThema,
  #pageFooter,
  #pageFooterMenuline {
    grid-template-columns: 1fr 349px 1fr;
  }
}
@media screen and (min-width: 500px) and (max-width: 799px) {
  #sliderTop,
  #sliderTopBellini,
  #sliderTopAlbertpark,
  #sliderTopHeideDresden,
  #sliderTopWeisweiler,
  #sliderTopLerchenfeld,
  #sliderTopRomainRolland,
  #sliderTopLeistungen,
  #pageHeader,
  .contentThema,
  #pageFooter,
  #pageFooterMenuline {
    grid-template-columns: 1fr 399px 1fr;
  }
}
@media screen and (min-width: 800px) and (max-width: 1199px) {
  #sliderTop,
  #sliderTopBellini,
  #sliderTopAlbertpark,
  #sliderTopHeideDresden,
  #sliderTopWeisweiler,
  #sliderTopLerchenfeld,
  #sliderTopRomainRolland,
  #sliderTopLeistungen,
  #pageHeader,
  .contentThema,
  #pageFooter,
  #pageFooterMenuline {
    grid-template-columns: 1fr 699px 1fr;
  }
}
@media screen and (min-width: 1200px) and (max-width: 1600px) {
  #sliderTop,
  #sliderTopBellini,
  #sliderTopAlbertpark,
  #sliderTopHeideDresden,
  #sliderTopWeisweiler,
  #sliderTopLerchenfeld,
  #sliderTopRomainRolland,
  #sliderTopLeistungen,
  #pageHeader,
  .contentThema,
  #pageFooter,
  #pageFooterMenuline {
    grid-template-columns: 1fr 1099px 1fr;
  }
}

.contentPictoBild {
  display: grid;
  grid-template-columns: 1fr 400px 100px 100px 400px 1fr;
}

.fullWidht {
  width: 100%;
}

#sliderTop,
#sliderTopBellini,
#sliderTopAlbertpark,
#sliderTopHeideDresden,
#sliderTopLerchenfeld,
#sliderTopRomainRolland,
#sliderTopLeistungen,
#sliderTopWeisweiler { /* ZeilenBox */
  grid-template-areas: ". pageHeaderContent .";
}

#sliderTextarea {
  grid-area: pageHeaderContent;
}

#pageHeader { /* ZeilenBox */
  grid-template-areas: ". pageHeaderContent .";
  position: fixed;
  top: 0;
  height: 70px;
}

#pageHeaderContent {
  grid-area: pageHeaderContent;
}

#pageHeaderContent {
  display: grid;
  grid-template-columns: 1fr 5fr;
  grid-template-areas: "menuLogoDisplay menuDisplay";
}

#headerlogo {
  grid-area: menuLogoDisplay;
}

#mainMenu {
  grid-area: menuDisplay;
}

#pageContent {
  grid-area: contentArea;
}

.pageContentContent {
  grid-column: 2/3;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
}

.pageContentContentflex, .zusammenfassung, .pageContentContentflex .ansichten {
  grid-column: 2/3;
  display: flex;
  flex-wrap: wrap;
  gap: 30px 149px;
}
@media screen and (min-width: 800px) and (max-width: 1199px) {
  .pageContentContentflex, .zusammenfassung, .pageContentContentflex .ansichten {
    gap: 30px 57px;
  }
}
@media screen and (min-width: 1200px) and (max-width: 1600px) {
  .pageContentContentflex, .zusammenfassung, .pageContentContentflex .ansichten {
    gap: 30px 67px;
  }
}

div.pageContentContentflex.ansichten {
  gap: 30px 32px;
}
@media screen and (min-width: 800px) and (max-width: 1199px) {
  div.pageContentContentflex.ansichten {
    gap: 30px 38px;
  }
}
@media screen and (min-width: 1200px) and (max-width: 1600px) {
  div.pageContentContentflex.ansichten {
    gap: 30px 33px;
  }
}

.content_1_1 {
  grid-column: 1/2;
}

.content_1_2 {
  grid-column: 1/3;
}

.content_1_3 {
  grid-column: 1/4;
}

.content_1_4 {
  grid-column: 1/5;
}

.content_1_5 {
  grid-column: 1/6;
}

.content_1_6 {
  grid-column: 1/7;
}

.content_1_7 {
  grid-column: 1/8;
}

.content_1_8 {
  grid-column: 1/9;
}

.content_2_2 {
  grid-column: 2/3;
}

.content_2_3 {
  grid-column: 2/4;
}

.content_2_4 {
  grid-column: 2/5;
}

.content_2_5 {
  grid-column: 2/6;
}

.content_2_6 {
  grid-column: 2/7;
}

.content_2_7 {
  grid-column: 2/8;
}

.content_2_8 {
  grid-column: 2/9;
}

.content_3_3 {
  grid-column: 3/4;
}

.content_3_4 {
  grid-column: 3/5;
}

.content_3_5 {
  grid-column: 3/6;
}

.content_3_6 {
  grid-column: 3/7;
}

.content_3_7 {
  grid-column: 3/8;
}

.content_3_8 {
  grid-column: 3/9;
}

.content_4_4 {
  grid-column: 4/5;
}

.content_4_5 {
  grid-column: 4/6;
}

.content_4_6 {
  grid-column: 4/7;
}

.content_4_7 {
  grid-column: 4/8;
}

.content_4_8 {
  grid-column: 4/9;
}

.content_5_5 {
  grid-column: 5/6;
}

.content_5_6 {
  grid-column: 5/7;
}

.content_5_7 {
  grid-column: 5/8;
}

.content_5_8 {
  grid-column: 5/9;
}

.content_6_6 {
  grid-column: 6/7;
}

.content_6_7 {
  grid-column: 6/8;
}

.content_6_8 {
  grid-column: 6/9;
}

.content_7_7 {
  grid-column: 7/8;
}

.content_7_8 {
  grid-column: 7/9;
}

.content_8_8 {
  grid-column: 8/9;
}

.ProjektEntwicklung,
.beratung,
.Revitalisierung,
.zusammen-liste1,
.zusammen-liste2,
.ausstattung {
  width: 100%;
}

.referenzobjekt {
  width: 400px;
}
@media screen and (max-width: 499px) {
  .referenzobjekt {
    width: 350px;
  }
}
@media screen and (min-width: 500px) and (max-width: 799px) {
  .referenzobjekt {
    width: 400px;
  }
}
@media screen and (min-width: 800px) and (max-width: 1199px) {
  .referenzobjekt {
    width: 320px;
  }
}
@media screen and (min-width: 1200px) and (max-width: 1600px) {
  .referenzobjekt {
    width: 320px;
  }
}

.neuobjekt {
  width: 1498px;
}
@media screen and (max-width: 499px) {
  .neuobjekt {
    width: 350px;
  }
}
@media screen and (min-width: 500px) and (max-width: 799px) {
  .neuobjekt {
    width: 400px;
  }
}
@media screen and (min-width: 800px) and (max-width: 1199px) {
  .neuobjekt {
    width: 697px;
  }
}
@media screen and (min-width: 1200px) and (max-width: 1600px) {
  .neuobjekt {
    width: 1094px;
  }
}

.bildunterschrift {
  grid-column: 6/9;
}
@media screen and (max-width: 499px) {
  .bildunterschrift {
    grid-column: 1/9;
  }
}
@media screen and (min-width: 500px) and (max-width: 799px) {
  .bildunterschrift {
    grid-column: 1/9;
  }
}
@media screen and (min-width: 800px) and (max-width: 1199px) {
  .bildunterschrift {
    grid-column: 4/9;
  }
}
@media screen and (min-width: 1200px) and (max-width: 1600px) {
  .bildunterschrift {
    grid-column: 5/9;
  }
}

.zitatbox {
  grid-column: 2/8;
}

.normtext {
  grid-column: 4/9;
}
@media screen and (max-width: 499px) {
  .normtext {
    grid-column: 1/9;
    text-align: center;
  }
}
@media screen and (min-width: 500px) and (max-width: 799px) {
  .normtext {
    grid-column: 1/9;
    text-align: center;
  }
}

.ref-beratung {
  grid-column: 2/9;
  display: flex;
  padding: 0;
  gap: 30px 100px;
}
.ref-beratung div {
  overflow: hidden;
  flex: auto;
  align-items: center;
  height: 80px;
  margin-top: 50px;
}
.ref-beratung div img {
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 499px) {
  .ref-beratung div {
    height: auto;
    margin: 20px auto;
  }
}
@media screen and (min-width: 500px) and (max-width: 799px) {
  .ref-beratung div {
    height: auto;
    margin: 20px auto;
  }
}
@media screen and (max-width: 499px) {
  .ref-beratung {
    grid-column: 1/9;
    flex-direction: column;
    gap: 10px 10px;
  }
}
@media screen and (min-width: 500px) and (max-width: 799px) {
  .ref-beratung {
    grid-column: 1/9;
    flex-direction: column;
    gap: 10px 10px;
  }
}
@media screen and (min-width: 800px) and (max-width: 1199px) {
  .ref-beratung {
    grid-column: 2/9;
  }
}
@media screen and (min-width: 1200px) and (max-width: 1600px) {
  .ref-beratung {
    grid-column: 2/9;
  }
}

.leistungen-ueberschrift {
  grid-column: 1/9;
}

.imagearea {
  display: grid; /* Jede ZeilenBox ist auch ein Grid */
  height: 800px;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; /* Das Grid für die Spalten für Bilder*/
  grid-template-rows: 1fr 100px; /* Für das Grid fümf Zeilen je 200px */
}

.imagearea_Slider {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: repeat(8, 100px);
}
@media screen and (max-width: 499px) {
  .imagearea_Slider {
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: repeat(5, 100px);
  }
}
@media screen and (min-width: 500px) and (max-width: 799px) {
  .imagearea_Slider {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: repeat(5, 100px);
  }
}
@media screen and (min-width: 800px) and (max-width: 1199px) {
  .imagearea_Slider {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: repeat(6, 100px);
  }
}
@media screen and (min-width: 1200px) and (max-width: 1600px) {
  .imagearea_Slider {
    grid-template-rows: repeat(7, 100px);
  }
}

/************************ SLIDER START ************************/
.SliderLogo {
  grid-column: 1/4;
  grid-row: 2/4;
}
@media screen and (max-width: 499px) {
  .SliderLogo {
    grid-column: 1/5;
    grid-row: 2/3;
  }
}
@media screen and (min-width: 500px) and (max-width: 799px) {
  .SliderLogo {
    grid-column: 1/6;
    grid-row: 2/3;
  }
}
@media screen and (min-width: 800px) and (max-width: 1199px) {
  .SliderLogo {
    grid-column: 1/4;
  }
}

.SliderText {
  grid-column: 4/9;
  grid-row: 2/6;
  text-align: right;
  font-size: 1.5em;
}
@media screen and (max-width: 499px) {
  .SliderText {
    grid-column: 1/5;
    grid-row: 4/5;
    font-size: 0.8em;
    text-align: center;
  }
}
@media screen and (min-width: 500px) and (max-width: 799px) {
  .SliderText {
    grid-column: 1/6;
    grid-row: 4/5;
    font-size: 0.8em;
    text-align: center;
  }
}
@media screen and (min-width: 800px) and (max-width: 1199px) {
  .SliderText {
    grid-column: 4/9;
    font-size: 1em;
  }
}
@media screen and (min-width: 1200px) and (max-width: 1600px) {
  .SliderText {
    grid-column: 4/9;
    font-size: 1.2em;
  }
}

div.picto {
  grid-column: 2/3;
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  gap: 80px 30px;
}
div.picto div.picto-projekt, div.picto div.picto-beratung, div.picto div.picto-Revitalisierung,
div.picto div.picto-ausstattung {
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 20%;
}
div.picto div.picto-projekt div img, div.picto div.picto-beratung div img, div.picto div.picto-Revitalisierung div img,
div.picto div.picto-ausstattung div img {
  height: auto;
  width: 60%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 499px) {
  div.picto div.picto-projekt, div.picto div.picto-beratung, div.picto div.picto-Revitalisierung,
  div.picto div.picto-ausstattung {
    width: 70%;
  }
}
@media screen and (min-width: 500px) and (max-width: 799px) {
  div.picto div.picto-projekt, div.picto div.picto-beratung, div.picto div.picto-Revitalisierung,
  div.picto div.picto-ausstattung {
    width: 70%;
  }
}
@media screen and (min-width: 800px) and (max-width: 1199px) {
  div.picto div.picto-projekt, div.picto div.picto-beratung, div.picto div.picto-Revitalisierung,
  div.picto div.picto-ausstattung {
    width: 35%;
  }
}

/************************ FOOTER-BEREICH START ************************/
#pageFooter { /* ZeilenBox */
  grid-area: footerArea;
  grid-template-areas: ". pageFooterContent .";
}

#pageFooterContent { /* ZeilenInhaltsBox */
  grid-area: pageFooterContent;
}

.footer-Standort {
  grid-column: 1/4;
}
@media screen and (max-width: 499px) {
  .footer-Standort {
    grid-column: 1/9;
  }
}
@media screen and (min-width: 500px) and (max-width: 799px) {
  .footer-Standort {
    grid-column: 1/9;
  }
}
@media screen and (min-width: 800px) and (max-width: 1199px) {
  .footer-Standort {
    grid-column: 1/5;
  }
}

.footer-Kontakt {
  grid-column: 4/7;
}
@media screen and (max-width: 499px) {
  .footer-Kontakt {
    grid-column: 1/9;
  }
}
@media screen and (min-width: 500px) and (max-width: 799px) {
  .footer-Kontakt {
    grid-column: 1/9;
  }
}
@media screen and (min-width: 800px) and (max-width: 1199px) {
  .footer-Kontakt {
    grid-column: 5/8;
  }
}

/************************ FOOTER-BEREICH ENDE ************************/
#pageFooterMenuline { /* ZeilenBox */
  grid-area: footerMenuLine;
  grid-template-areas: ". pageFooterMenulineContent .";
}

#pageFooterMenulineContent { /* ZeilenInhaltsBox */
  grid-area: pageFooterMenulineContent;
}

/* ====================================== UNTERSEITEN START ====================================== */
.datentabelle {
  grid-column: 1/9;
}

/* ====================================== UNTERSEITEN ENDE ====================================== *//*# sourceMappingURL=grid.css.map */