* {
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
    scroll-snap-margin-top:10vh;
    scroll-margin: 10vh;
    scroll-margin: 10lvh;
    scrollbar-gutter: stable;
  }


  @font-face {
    font-family: "Brandon-Bold";
    font-weight: bold;
    src: local("HVD Fonts-BrandonGrotesque-Bold"),
    url(font/HVD\ Fonts-BrandonGrotesque-Bold.otf);
  }
  @font-face {
    font-family: "Brandon-Regular";
    font-weight:400;
    src: local("HVD Fonts-BrandonGrotesque-Regular"),
    url(font/HVD\ Fonts-BrandonGrotesque-Regular.otf);
  }
  @font-face {
    font-family: "Brandon-Light";
    font-weight:300;
    src: local("HVD Fonts-BrandonGrotesque-Light"),
    url(font/HVD\ Fonts-BrandonGrotesque-Light.otf);
  }

  
  h1{
    padding-top: 2vh;
    padding-top: 2lvh;
    padding-bottom: 2vh;
    padding-bottom: 2lvh;
    color: rgb(30, 30, 30);
    font-family: "Brandon-Bold"; 
    letter-spacing: 0.04em;
    font-size: 3rem;
    line-height: 0.98;
    text-transform: uppercase;
  }
  
  h2{
    padding-top: 5vh;
    padding-top: 5%;
    padding-bottom: 1vh;
    padding-bottom: 1lvh;
    color: rgb(30,30,30);
    font-family: "Brandon-Bold"; 
    letter-spacing: 0.04em;
    font-size: 2rem;
    line-height: 120%;
    text-transform: uppercase;
  }

  h3{
    padding-top: 5vh;
    padding-top: 5%;
    padding-bottom: 1vh;
    padding-bottom: 1lvh;
    color: rgb(30,30,30);
    font-family: "Brandon-Bold"; 
    letter-spacing: 0.04em;
    font-size: 1.5rem;
    text-transform: uppercase;
  }
  
  body{
    background-color: rgb(240, 240, 240);
    font-family: "Brandon-Regular";
    font-size: 1.25rem;
    letter-spacing: 0.02em;
    line-height: 120%;
    color: rgb(30, 30, 30);
    overflow-x: hidden;
  }

  strong{
    font-family: "Brandon-Bold";
  }
  
  header{
    z-index: 5;
    width: 100vw;
    width: 100lvw;
    height: 10vh;
    height: 10lvh;
    position: fixed;
    top: 0;
    display: flex;
    justify-content: space-between;
    background-color: rgb(240, 240, 240);
    font-family: "Brandon-Bold";
  }
  
  header img{
    padding: 2.5vh;
    padding: 2.5lvh;
    height: 5vh;
    height: 5lvh;
  }
  
  header img:hover{
    transform: scale(1.1);
    transition: transform 0.1s cubic-bezier(0.82, -0.27, 0.16, 1.39);
  }
  
  nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
    height: 100%; 
    background-color: rgb(240, 240, 240);
    color: rgb(30, 30, 30);
    font-family: "Brandon-Bold";
    text-transform: uppercase;
  }
  
  nav ul {
    list-style-type: none;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    width:auto;
    height: 100%;    
    transition: all 0.6s ease-in-out;
    margin-right: 5vw;
    margin-right: 5lvw;
  }
  
  nav li {
    flex: 1;
    text-align: justify;
    color: rgb(30,30,30);
    max-width: fit-content;
    margin-right: 2vw;
    margin-right: 2lvw;

  }
  
  nav li a:link {
    color: rgb(30, 30, 30);
    text-decoration: none;
    justify-content: center;
    align-items: center;
    height: 100%;
  }
  
  nav li a:visited {
    color: rgb(30,30,30);
  }
  nav li a:hover {
    color: rgb(180,180,180);
    font-weight: bolder;
  }

  #burger{
    display: none;
  }
  
/* nav-icon-2 */
.nav-icon-2{
  width: 35px;
  height: 30px;
  /* margin: 10px 10px; */
  margin: 2.5vh 2.5vh;
  margin: 2.5lvh 2.5lvh;
  position: relative;
  cursor: pointer;
  display: inline-block;
}
.nav-icon-2 span{
  /* background-color:#FFF; */
  background-color: rgb(49,43,33);
  position: absolute;
  border-radius: 2px;
  transition: .3s cubic-bezier(.8, .5, .2, 1.4);
}
.nav-icon-2 span:nth-child(1){
  width: 100%;
  height:  5px;
  display: block;
  top: 0px;
  left: 0px;
}
.nav-icon-2 span:nth-child(2){
  width: 100%;
  height:  5px;
  display: block;
  top: 13px;
  left: 0px;
}
.nav-icon-2 span:nth-child(3){
  width: 100%;
  height:  5px;
  display: block;
  bottom: 0px;
  left: 0px;
}

.nav-icon-2.open span:nth-child(1){
  left:3px;
  top: 2px;
  width: 30px;
  transition: .3s cubic-bezier(.8, .5, .2, 1.4);
  transform: rotate(90deg);
  transition-delay: 150ms;
}
.nav-icon-2.open span:nth-child(3){
  left:2px;
  top: -5px;
  width: 20px;
  transition: .3s cubic-bezier(.8, .5, .2, 1.4);
  transform: rotate(-45deg);
  transition-delay: 50ms;
}
.nav-icon-2.open span:nth-child(2){
  left:14px;
  top: -5px;
  width: 20px;
  transition: .3s cubic-bezier(.8, .5, .2, 1.4);
  transform: rotate(45deg);
  transition-delay: 100ms;
}

.btn{
  background-color: rgb(30,30,30);
  color: rgb(240, 240, 240);
  margin-top: 20px;
  margin-bottom: 20px;
  padding: 10px;
  padding-left: 20px;
  padding-right: 20px;

}

.btn:link{
  text-decoration: none;
}

.btn:visited{
  color: rgb(240, 240, 240);

}

.btn:hover{
  color: rgb(180,180,180);
}

.noDec:link{
  text-decoration: none;
  color: rgb(30, 30, 30);
}

.noDec:hover{
  color: rgb(180,180,180);
}

.myHover:hover{
  color: rgb(240, 240, 240);
}

footer{
  position: relative;
  bottom: 0;  
  z-index: 2;
  width: 100vw;
  width: 100lvw;
  min-height: 25vh;
  min-height: 25lvh;
  background-color: rgb(180,180,180);
  padding-top: 7vh;
  padding-top: 7lvh;
}

#footerContainer{
  display: grid;
  width: 80vw;
  width: 80lvw;
  margin: auto;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows:auto;
  gap: 5vw 2vw;
  gap: 5lvw 2lvw;
}

footer a{
  text-decoration: none;
  color: rgb(30, 30, 30);
}

footer a:hover{
  color: rgb(240, 240, 240);
}

/* footer a:visited{
  color: rgb(30, 30, 30);
} */

#footerLogo{
  grid-column: 1;
}

#footerLogo img{
  width: 100%;
}

#footerKontakt{
  grid-column: 2 / 6;
}

#footerImpressum{
  grid-column: 8 / 12;
}
  
  #container{
    z-index: 1;
    display: grid;
    width: 80vw;
    width: 80lvw;
    margin: auto;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: repeat(6, 90lvh), auto, 90lvh;
    gap: 5vw 2vw;
    gap: 5lvw 2lvw;
  }

  #logoBig{
    grid-row: 1 / 5;
    grid-column: 1 / 6;
    margin-top:10vh;
    margin-top:10lvh;
  }

  #logoBig img{
    position:sticky;
    position: -webkit-sticky;
    top: 10vh;
    top: 10lvh;
    right: 0;
    max-width: 100%;
    min-height: 90vh;
    min-height: 90lvh;
  }

/* start */
  #start{
    grid-row: 3;
    grid-column: 8 / 13;

    margin-top:10vh;
    margin-top:10lvh;
  }

  #claim{
    font-size: 5rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 60vh;
    min-height: 60lvh;
  }

  #claimBottom{
    margin-top: auto;
    line-height: 0.95;
    text-transform: uppercase;
    font-family: "Brandon-Bold";
    font-size: 4vw;
    font-size: 4lvw;
  }


/* Banner Ausstellung */
#bannerAusstellung{

  grid-row: 1;
  grid-column: 6 / 13;

  display: grid;
  grid-template-columns: subgrid;
  grid-template-columns: repeat(8, 1fr);
  /* grid-auto-rows: min-content; */

  min-height: 30vh;
  width: 100%;
  background-color: #ADA39B;
  margin-top: 15vh;
  padding: 2vh;
  padding-left: 3vh;

  text-decoration: none;
}

/* #hrefBanner{
  display: grid;
  width: 100%;
  height: 100%;
} */

#bannerHeadline{
  grid-row: 1;
  grid-column: 1 / 4;
  color: rgb(240, 240, 240);
}

#bannerHeadline img{
  width: 100%;
  margin-top: 5vh;
  height: auto;
}

#bannerHeadline h3{
  text-transform: none;
}


.noPadding{
  padding: 0;
}

.colorWhite{
  color: rgb(240, 240, 240)
}

#bannerDatum{
  grid-row: 1;
  grid-column: 7 / 9;
  font-family: "Brandon-Bold";
  font-size: 4rem;
  line-height: 0.95;
  color: rgb(240, 240, 240);
  justify-self:right;
}

#bannerDatum p{
  font-size: 1.25rem;
  line-height: 1.25;
  font-family: "Brandon-Regular";
  padding-top: 2vh;
  width: 100%;
  word-wrap: break-word;
}


#buttonCTA{
  grid-row: 2;
  grid-column: 4 / 5;

  background-color: rgb(30, 30, 30);
  color: rgb(240, 240, 240);
  border-radius: 100%;
  width: 9vw;
  height: 9vw;
  max-width: 150px;
  max-height: 150px;
  text-align: center;
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  margin-top: 1vh;
  /* margin-left: 2vw; */
  padding: 1vh;
  transform: rotate(-5deg);
}

/* Neuerscheinung */
  #neu{
    grid-row: 2;
    grid-column: 6 / 13;

    display: grid;
    grid-template-columns: subgrid;
    grid-template-columns: repeat(8, 1fr);
    min-height: 90vh;
    min-height: 90lvh;
    margin-top:5vh;
    margin-top:5lvh;
  }

  #neu h3{
    padding: 0;
  }

  #neuText{
    grid-row: 1;
    grid-column: 1 / 6;
    margin-bottom: 20vh;
  }

  #neuImg{
    grid-row: 1;
    grid-column: 6 / 10;
  }

  #neuImg img{
    width: 100%;
    position: relative;
    left: 2vw;
    left: 2lvw;
    filter: drop-shadow(8px 10px 14px #000000);
  }

  /* HK Alles auf Schiene Publikationen */
  #hkText{
    grid-row: 2;
    grid-column: 1 / 6;
  }

  #hkImg{
    grid-row: 2;
    grid-column: 6 / 10;
  }

  #hkImg img{
    width: 200%;
    position: relative;
    left: -8vw;
    left: -8lvw;
  }


  #neu h1{
    padding-bottom: 0;
    /* font-size: 5rem; */
    font-size: 5vw;
    font-size: 5lvw;
    word-spacing: 100;
  }

  #neu h2{
    padding-top: 1vh;
    padding-top: 1lvh;
    padding-bottom: 1vh;
    padding-bottom: 1lvh;
    /* font-size: 2rem; */
    font-size: 2vw;
    font-size: 2lvw;
  }

  #neu span{
    padding: 10px;
    background-color: rgb(180, 180, 180);
    text-transform: uppercase;
    font-family: 'Brandon-Bold';
  }

  #neu p{
    margin-bottom: 0;
  }



/* Über den Verlag */
  #about{
    grid-row: 4;
    grid-column: 6 / 12;

    min-height: 90vh;
    min-height: 90lvh;
    margin-top:10vh;
    margin-top:10lvh;
  }


/* Buchgestaltung */
  #bookDesign{
    grid-row: 5;
    grid-column: 2 / 13;

    display: grid;

    min-height: 70vh;
    min-height: 70lvh;
    margin-top: 30vh;
    margin-top: 30lvh;

    grid-template-columns: subgrid;
    grid-template-rows: auto 10vh 10vh 10vh 10vh 10vh 10vh 10vh 10vh 10vh 10vh;
    column-gap: 2vw;
    row-gap: 2vw;
  }

  #bookDesign img{
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  #bookDesignText{
    grid-row: 1;
    grid-column: 1 / 8;
  }

  #refBookAltiger{
    grid-row: 2 / 5;
    grid-column: 1 / 5;
  }

  #refBookGoefis{
    grid-row: 3 / 6;
    grid-column: 5 / 9;
  }

  #refBookOerfla{
    grid-row: 1;
    grid-column: 8 / 12;
    height: calc(30vh + 4vw);
    margin-top: 10vh;
  }

  #refBookTreemotion{
    grid-row: 6 / 9;
    grid-column: 3 / 7;
  }

  #refBookSchnaps{
    grid-row: 6 / 9;
    grid-column: 8 / 12;
  }

  #refBookAllesAufSchiene{
    grid-row: 9 / 12;
    grid-column: 1 / 5;
  }

/* Flyingallery */
  #flyingallery{
    grid-row: 6;
    grid-column: 2 / 9;

    min-height: 90vh;
    min-height: 90lvh;
    margin-top:10vh;
    margin-top:10lvh;

  }

  #flyingalleryIMG{
    margin-top: 5vh;
  }
  
  .imgText{
    margin-top: 1vh;
  }
  

/* Kontakt */
  #kontakt{
    grid-row: 7;
    grid-column: 2 / 9;

    min-height: 90vh;
    min-height: 90lvh;
    margin-top:10vh;
    margin-top:10lvh;
  }
  
  
/* Impressum */

#containerImpressum{
  width: 80vw;
  width: 80lvw;
  margin: auto;
  margin-top: 20vh;
  margin-top: 20lvh;
  margin-bottom: 20vh;
  margin-bottom: 20lvh;
}

.mbImp{
  margin-bottom: 10vh;
  margin-bottom: 10lvh;
}


@media only screen and (max-width: 1200px) {

  #burger{
    display: block;
  }

  header{
    height: auto;
  }

  nav ul{
    display: none;
    width: 100%;
    margin-right: 0;
  }

  nav ul{
    flex-direction:column;
    transition: all 0.6s ease-in-out;
  }
  
  
  nav ul.show{
    display: flex;
    margin-bottom: 2vh;
    margin-bottom: 2lvh;
  }
  nav li {
    margin-bottom: 0.5vh;
    margin-bottom: 0.5lvh;
    margin-right: 0;
  }

  #bannerHeadline{
    grid-row: 1;
    grid-column: 1 / 5;
  }

  #bannerHeadline img{
    width: 100%
  }


  #bannerDatum{
    grid-row: 2;
    grid-column: 1 / 13;
    /* font-size: 2.5rem; */
  }

  #buttonCTA{
    grid-row: 3;
    word-break: break-word;
    hyphens: auto;
  }

}


  /* Tablet */
@media only screen and (max-width: 768px) {
  /* 500px */
  main{
    overflow-x: hidden;
  }

  h1{
    font-size: 3rem;
  }
  
  h2{
    letter-spacing: 0.04em;
    font-size: 2rem;
  }

  h3{
    letter-spacing: 0.04em;
    font-size: 1.5rem;
  }

  #container{
    width: 96lvw;
  }

  #logoBig{
    grid-row: 1;
    grid-column: 2 / 5;
    margin-top:10vh;
    margin-top:10lvh;
    max-height: 60vh;
  }

  #logoBig img{
    position:relative;
    top: -25vh;
    top: -25lvh;
    left: 0;
    width: 100%;
  }

  #start{
    grid-row: 1;
    grid-column: 7 / 12;
  }

  #claim{
    min-height: 52vh;
    min-height: 52lvh;
  }

  #claimBottom{
    font-size: 5vw;
    font-size: 5lvw;
  }

  #bannerAusstellung{
    grid-row: 2;
    grid-column: 1 / 13;
    height: auto;
    width: auto;
    margin-bottom: 6vh;
  }
  

  #bannerDatum{
    font-size: 2.5rem;
  }

  #buttonCTA{
    width: 15vh;
    height: 15vh;
    margin-top: 1vh;
    margin-bottom: 1vh;
  }

  #neu{
    grid-row: 3;
    grid-column: 2 / 13;
    margin-top: 0;
  }

  .btn{
    display: block;
    text-align: center;
    width: 100%;
    padding-top: 1.5vh;
    padding-top: 1.5lvh;
    padding-bottom: 1.5vh;
    padding-bottom: 1.5lvh;
    padding-left: 0;
    padding-right: 0;
  }

  #neu h1{
    font-size: 6vw;
    font-size: 6lvw;
  }

  #neu h2{
    font-size: 3vw;
    font-size: 3lvw;
  }

  #neuText{
    grid-row: 1;
    grid-column: 1 / 5;
    margin-bottom: 20vh;
  }

  #neuImg{
    grid-row: 1;
    grid-column: 5 / 10;
  }

  #neuImg img{
    width: 80%;
  }

  /* HK Alles auf Schiene Publikationen */
  #hkText{
    grid-row: 2;
    grid-column: 1 / 6;
  }

  #hkImg{
    grid-row: 2;
    grid-column: 6 / 10;
  }

  #hkImg img{
    width: 200%;
    position: relative;
    left: -8vw;
    left: -8lvw;
  }
  

  #about{
    grid-column: 2 / 12;
    min-height: 60vh;
    min-height: 60lvh;
  }

  #bookDesign{
    grid-column: 2 / 12;
    min-height: 80vh;
    min-height: 80lvh;
  }

  #bookDesign{
    grid-template-columns: subgrid;
    grid-template-rows: auto 10vh 10vh 10vh 10vh 10vh 10vh 10vh 10vh 10vh 10vh 10vh 10vh;
    column-gap: 2vw;
    row-gap: 2vw;
  }

  #bookDesignText{
    grid-row: 1;
    grid-column: 1 / 10;
  }

  #refBookAltiger{
    grid-row: 2 / 5;
    grid-column: 1 / 6;
  }

  #refBookGoefis{
    grid-row: 3 / 6;
    grid-column: 6 / 11;
  }

  #refBookOerfla{
    grid-row: 6 / 10;
    grid-column: 6 / 11;
    height: 70%;
    margin-top: 0;
  }

  #refBookTreemotion{
    grid-row: 5 / 8;
    grid-column: 1 / 6;
  }

  #refBookSchnaps{
    grid-row: 8 / 11;
    grid-column: 1 / 6;
  }

  #refBookAllesAufSchiene{
    grid-row: 9 / 12;
    grid-column: 6 / 11;
  }


  #flyingallery{
    grid-column: 5 / 12;
    height: 60vh;
    height: 60lvh;
    margin-top: 0;
  }

  #kontakt{
    grid-row: 7;
    grid-column: 2 / 9;
    min-height: 90vh;
    min-height: 90lvh;
    margin-top:10vh;
    margin-top:10lvh;
  }

  #footer{
    min-height: 30vh;
  }

  #footerContainer{
    width: 96vw;
    width: 96lvw;
  }
  
  #footerLogo{
    grid-column: 2;
  }
  
  #footerKontakt{
    grid-column: 3 / 7;
  }
  
  #footerImpressum{
    grid-row: 2;
    grid-column: 3 / 12;
    margin-bottom: 5vh;
  }


  #burger{
    display: block;
  }

  header{
    height: auto;
  }

  nav ul{
    display: none;
    width: 100%;
  }

  nav ul{
    flex-direction:column;
    transition: all 0.6s ease-in-out;
  }
  
  nav ul.show{
    display: flex;
    margin-bottom: 2vh;
    margin-bottom: 2lvh;
  }
  nav li {
    margin-bottom: 0.5vh;
    margin-bottom: 0.5lvh;
  }

}

/* Smartphone */
/* @media only screen and (max-width: 400px) { */
@media only screen and (max-width: 576px) {

  main{
    overflow-x: hidden;
  }

  h1{
    font-size: 2rem;
  }
  
  h2{
    letter-spacing: 0.04em;
    font-size: 1.6rem;
    padding-top: 2vh;
    padding-top: 2lvh;
    padding-bottom: 2vh;
    padding-bottom: 2lvh;
  }

  h3{
    letter-spacing: 0.04em;
    font-size: 1.2rem;
    padding-top: 2vh;
    padding-top: 2lvh;
    padding-bottom: 2vh;
    padding-bottom: 2lvh;
  }

  body{
    overflow-wrap: break-word;
    hyphens: auto;
  }

  .btn{
    display: block;
    text-align: center;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
    padding-top: 1.5vh;
    padding-top: 1.5lvh;
    padding-bottom: 1.5vh;
    padding-bottom: 1.5lvh;
  }

  #container{
    width: 96lvw;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(7, auto);
  }


  #logoBig{
    grid-row: 1;
    grid-column: 3 / 5;
    /*height: 50lvh;*/
    height: 50vh;
    height: 50lvh;
    margin-top: 5vh;
    margin-top: 5lvh;
  }

  #logoBig img{
    /*position:initial;*/
    position: relative;
    top: 0;
    height: auto;
    margin-top: 10vh;
    margin-top: 10lvh;
    margin-bottom: 5vh;
    margin-bottom: 5lvh;
    min-height: 0;
  }


/* start */
  #start{
    grid-row: 2;
    grid-column: 1 / 5;
    padding-left: 3vw;
    padding-left: 3lvw;
    margin-top: 20px;
    /*margin-top: 5lvh;*/
    /* height: auto; */
  }

  #claim{
    font-size: 2rem;
    display: block;
    min-height: fit-content;
  }

  #claimBottom{
    margin-top: 0;
    line-height: 0.95;
    /* font-size: 3rem; */
    font-size: 2.25rem;
  }

  #bannerAusstellung{
    grid-row: 3;
    grid-column: 1 / 5;
    grid-template-columns: repeat(1, 1fr);
    height: auto;
    width: auto;
  }

  #bannerHeadline{
    grid-row: 1;
    grid-column: 1 / 5;
    margin-bottom: 5vh;
  }

  #bannerDatum{
    grid-row: 2;
    grid-column: 1 / 5;
    font-size: 2rem;
    margin-bottom:10vh;
  }

  #buttonCTA{
    grid-row: 3;
    grid-column: 1 / 2;
    width: 20vh;
    height: 20vh;
    margin-top: 0;
    padding: 1vh;
    /* margin-left: 5vw; */
    margin-bottom: 2vh;
  }




/* Neuerscheinung */
  #neu{
    grid-row: 4; 
    grid-column: 1 / 5;

    grid-template-columns: repeat(1, 1fr);
    height: auto;
  }

  #neuText{
    grid-row: 2;
    grid-column: 1;
  }

  #neuImg{
    grid-row: 1;
    grid-column: 1;
  }

  #neuImg img{
    width: 50%;
    left: 40vw;
    margin-bottom: 5vh;
    margin-top: 2vh;
  }

  /* HK Alles auf Schiene Publikationen */
  #hkText{
    grid-row: 4;
    grid-column: 1;
  }

  #hkImg{
    grid-row: 3;
    grid-column: 1;
  }

  #hkImg img{
    width: 100%;
    margin-bottom: -1vh;
    margin-bottom: -1lvh;
    left: 0;
  }


  #neu h1{
    padding-bottom: 0;
    font-size: 2rem;
    word-spacing: 10;
  }

  #neu h2{
    padding-top: 1vh;
    padding-top: 1lvh;
    padding-bottom: 2vh;
    padding-bottom: 2lvh;
    font-size: 1.6rem;
    line-height: 1.05;
  }

  #neu span{
    padding: 10px;
    font-size: 1rem;
    margin-bottom: 2vh;
    margin-bottom: 2lvh;
  }

  #neu p{
    margin-top: 0;
  }



/* Über den Verlag */
  #about{
    grid-row: 5;
    grid-column: 1 / 5;

    height: auto;
    margin-top:10vh;
    margin-top:10lvh;
  }


/* Buchgestaltung */
  #bookDesign{
    grid-row: 6;
    grid-column: 1 / 5;

    margin-top:10vh;
    margin-top: 10lvh;

    grid-template-columns: subgrid;
    grid-template-rows: auto repeat(6, 30vh);
    
    row-gap: 2vw;
  }

  #bookDesignText{
    grid-row: 1;
    grid-column: 1 / 5;
    margin-bottom: 2vh;
  }

  #refBookAltiger{
    grid-row: 2;
    grid-column: 1 / 5;
  }

  #refBookGoefis{
    grid-row: 3;
    grid-column: 1 / 5;
    /* margin-top: 0; */
  }

  #refBookOerfla{
    grid-row: 4;
    grid-column: 1 / 5;
    height: auto;
    margin-top: 0;
  }

  #refBookTreemotion{
    grid-row: 5;
    grid-column: 1 / 5;
    /* margin-top: 0vh; */
  }

  #refBookSchnaps{
    grid-row: 6;
    grid-column: 1 / 5;
  }

  #refBookAllesAufSchiene{
    grid-row: 7;
    grid-column: 1 / 5;
  }


/* Flyingallery */
  #flyingallery{
    grid-row: 7;
    grid-column: 1 / 5;

    height: auto;
    margin-top:10vh;
    margin-top:10lvh;
  }

/* Kontakt */
  #kontakt{
    grid-row: 8;
    grid-column: 1 / 5;

    height: auto;
    margin-top:10vh;
    margin-top:10lvh;
    margin-bottom: 20vh;
    margin-bottom: 20lvh;
  }

  footer{
    height:fit-content;
    padding-top: 2vh;
    padding-top: 2lvh;
  }

  #footerContainer{
    width: 96vw;
    width: 96lvw;
    margin: auto;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows:auto;
    gap: 1vh 6vw;
    gap: 1lvh 6lvw;
  }
  
  #footerLogo{
    grid-row: 1;
    grid-column: 1 / 2;
    padding-left: 2vw;
    padding-left: 2lvw;
  }
  
  
  #footerKontakt{
    grid-row: 1;
    grid-column: 2 / 5;
  }
  
  #footerImpressum{
    grid-row: 3;
    grid-column: 2 / 5;
    margin-bottom: 5vh;
    margin-bottom: 5lvh;
  }

  #containerImpressum{
    width: 96vw;
  }


  #burger{
    display: block;
  }

  header{
    min-height: 10lvh;
    height: auto;
  }

  nav ul{
    display: none;
    width: 100%;
  }

  nav ul{
    flex-direction:column;
    gap: 1vh;
    gap: 1lvh;
    transition: all 0.6s ease-in-out;

  }
  
  nav ul.show{
    display: flex;
    margin-bottom: 2vh;
    margin-bottom: 2lvh;
  margin-right: 0;
  }
  nav li {
    margin-bottom: 0.5vh;
    margin-bottom: 0.5lvh;
  }
}