body {
    background-color: #ffffff;
 font-family: 'NewYork';
    color: #000000;

}
 @font-face {
font-family: "NewYork";
src:url(NewYork.otf) format("opentype");
}

a {
    text-decoration: none;
 color: #000000;
}
.myVideo {
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;

}
.hintergrund {
    width: 100vw;
    height: 100vh;
      right: 0;
  bottom: 0;
    position: fixed;
      transition: all 1s ease-in-out;
    filter: grayscale(0%);
}
.hintergrundda {
    width: 100vw;
    height: 100vh;
      right: 0;
  bottom: 0;
    position: fixed;
    filter: grayscale(50%);
}
.layerda {
    width: 100vw;
    height: 100vh;
      right: 0;
  bottom: 0;
    position: fixed;
    z-index: 5;
    background-color: rgba(250,250,250,0.5);
}
.back {
    font-size: 6vh;
}
.hintergrund.active {
    filter: grayscale(50%);
}
.layer {
    width: 100vw;
    height: 100vh;
      right: 0;
  bottom: 0;
    position: fixed;
      transition: all 1s ease-in-out;
    z-index: 5;
    background-color: rgba(250,250,250,0);
}
.layer.aktive {
    background-color: rgba(250,250,250,0.5);
}
.oben {
    position: fixed;
    width: 90vw;
    text-align: right;
    margin-top: -5vh;
    font-size: 20px;
    margin-left: 5vw;
    margin-right: 5vw;
    z-index: 8;
}
.obenimp {
    position: fixed;
    width: 90vw;
    text-align: right;
    margin-top: 14vh;
    font-size: 20px;
    margin-left: 5vw;
    margin-right: 5vw;
    z-index: 10;
}
.an {
    display: inline;
}
.aus {
    display: inline;
    opacity: 0.3;
        transition: all 0.3s ease-in-out;
}
.aus:hover {
    opacity: 1;
    transition: all 0.3s ease-in-out;
}
.menu {
    float: right;
    width: 30px;
    height: auto;
}
.unten {
    width: 100%;
    text-align: center;
    margin-top: 30vh;
    z-index: 1000;
    font-size: 3vh;
    padding-bottom: 1vh;
}
.uhhlogo {
    width: 50px;
    height: auto;
}

.main {
    padding: 5vw;
    background-color: rgba(250,250,250,0);
 position: relative;
    margin-top: 10vh;
    margin-left: 5vw;
    margin-right: 5vw;
    width: 80vw;
    min-height: 100vh;
    font-size: 11vh;
    text-align: center;
    z-index: 6;
    
}
.impressum {
    padding: 5vw;
    background-color: rgba(250,250,250,0);
 position: relative;
    margin-top: -10vh;
    margin-left: 5vw;
    margin-right: 5vw;
    width: 80vw;
    min-height: 100vh;
    font-size: 4vh;
    text-align: center;
    z-index: 6;
    
}
.forschungtitel {
    font-size: 8vh;
}
#letzte {
    padding: 5vw;
    background-color: rgba(250,250,250,0);
    position: relative;
    margin-top: 10vh;
    margin-left: 5vw;
    margin-right: 5vw;
    width: 80vw;
    min-height: 30vh;
    height: 60vh;
    font-size: 11vh;
    text-align: center;
    z-index: 6;
}
.logo {
    margin-top: 20vh;
    font-size: 10vw;
}
.forschungsprojekt {
    font-size: 4vh;
}
.ausstellung {
    font-size: 6vh;
}
.mehrinfos {
    font-size: 5vh;
}
.presse {
    font-size: 4vh;
    line-height: 4vh;
}
.datum {
    font-size: 3vh;
    line-height: 1vh;
}
.kontakt {
    font-size: 4vh;
}
.uhh {
    font-size: 2.5vh;
}
.socialmediaimpressum {
    font-size: 2.5vh;
}

@media (max-width: 768px) {
    .logo {
        font-size: 20vw;
    }
    .main {
        font-size: 9vw;
    }
    .impressum {
        font-size: 5vw;
        margin-top: -5vh;
    }
    #letzte {
        font-size: 9vw;
    }
    .oben {
        margin-top: -9vh;
    }
     .obenimp {
        margin-top: 10vh;
    }
    .forschungsprojekt {
    font-size: 5vw;
}
    .ausstellung {
        font-size: 8vw;
    }
    .mehrinfos {
    font-size: 5vw;
}
    .presse {
    font-size: 5vw;
        line-height: 5vw;
}
    .datum {
        font-size: 3vw;
         line-height: 1vw;
    }
    .kontakt {
    font-size: 4vw;
}
    .forschungtitel {
    font-size: 9vw;
}
    .back {
    font-size: 9vw;
}
    .unten {
        margin-top: 40vh;
        font-size: 5vw;
    }
    .uhh {
        font-size: 4vw;
    }
    .socialmediaimpressum {
    font-size: 2.5vw;
}
}