@media screen and (max-width: 950px) {}

@media only screen and (max-height: 550px) {}

@media only screen and (min-device-width: 801px) and (max-device-width: 1000px) {
    .works {
        position: relative;
        background-color: grey;
        width: 38vw;
        height: 32.76vw;
        margin: .5vh .7vw 0 0;
        float: left;
    }
    .projekteContainer {
        width: 80vw;
        margin: 5vh 0vw 0;
    }
    iframe {
        max-height: 150vh;
    }
    .images {
        width: 100vw;
        height: 56.25vw;
        float: none;
    }
    .image {
        width: 100vw;
        height: 56.25vw;
    }
    .lb-text {
        width: 100vw;
        height: auto;
        float: none;
    }
    .lb-leiste {
        width: 100vw;
        max-height: 33vw;
        margin-left: .3vw;
        float: none;
    }
    .image-element {
        width: 32vw;
        height: 18vw;
        margin: 0.001vh 0.25vw;
        padding: 0;
    }
    .lb-text {
        width: 100%;
        height: auto;
        float: none;
    }
    .hideme {
        display: block;
    }
    .h2-responsive {
        margin: 5vh 0 0vh 5vw;
    }
    .h2-responsive+div {
        margin-top: -.8vh;
        margin-left: 4vw;
        background-color: rgba(117, 212, 212);
        z-index: 199;
    }
    .lb-list {
        font-size: calc(12px + .4vw);
        line-height: 1.3em;
        margin: 1vh 0 0 4vw;
        height: 28vh;
    }
    .donthide {
        display: none;
    }
    #div1,
    #div2,
    #div3,
    #div4,
    #div5,
    #div6 {
        width: 100vw;
        height: 56.25vw;
    }
    .icons {
        display: inline;
        height: 3vw;
        width: auto;
        margin: 1.5vh 0 1.5vw 1.5vw;
        line-height: 0;
    }
    .icons-yt {
        display: inline;
        height: 2vw;
        width: auto;
        margin: 1.75vw 0 1.75vw 1.5vw;
        line-height: 0;
    }
    .ham-hide {
        display: inline;
    }
    #myNameBlock {
        background-color: rgb(117, 212, 212);
        height: 1.6vh;
        width: 5vw;
        left: 34vw;
    }
    #navBar>div {
        display: none;
    }
    #navBar {
        display: none;
    }
    .child {
        scroll-snap-align: none;
    }
    #myName {
        left: 35vw;
    }
    .left {
        margin-top: 5vw;
    }
    .works {
        position: relative;
        background-color: grey;
        margin: 40vh 0;
    }
    .works2 {
        position: relative;
        background-color: grey;
        right: 0;
        margin: 40vh 0;
    }
    .workTitle {
        position: absolute;
        width: 100%;
        height: auto;
        left: 2vw;
        font-size: calc( 7px + 0.5vw);
        line-height: 1.3em;
    }
    .timeline {
        display: none;
    }
    .timeline2 {
        display: none;
    }
    h3+div {
        position: absolute;
        margin-top: -4.8vh;
        margin-left: -0.7vw;
        width: 26vw;
        height: 1.6em;
        background-color: rgb(117, 212, 212);
        z-index: 99;
    }
    h3 {
        position: relative;
        z-index: 100;
        font-weight: 600;
        margin: 0;
        padding: 0;
        line-height: 1.3em;
        font-size: calc(10px + 1vw);
        text-transform: uppercase;
        text-align: left;
    }
    html {
        scroll-snap-type: none;
    }
    .proj {
        height: auto;
    }
    h2 {
        position: relative;
        font-weight: 400;
        display: block;
        margin: 10vh 0 3vh 5vw;
        padding: 0;
        line-height: 1.3em;
        font-size: calc(10px + 1.5vw);
        text-transform: uppercase;
        z-index: 200;
    }
    .h2-3 {
        margin: 1vh 0 3vh 5vw;
    }
    .grid-container {
        display: block;
        grid-auto-flow: column;
        margin-top: 0;
    }
    .midgrid {
        position: relative;
        top: 0;
        transform: initial;
    }
    .grid-kontakt {
        width: 100%;
        margin-left: 0;
    }
    h2+div {
        position: absolute;
        margin-top: -8vh;
        margin-left: 4vw;
        width: 15em;
        height: 2em;
        background-color: rgba(117, 212, 212);
        z-index: 199;
    }
    .logo-grid {
        width: 100%;
        height: auto;
        display: grid;
        grid-template-columns: 7vw 1fr 9vw 1fr;
        grid-template-rows: 1fr 1fr 1fr 1fr;
        grid-gap: 0;
        font-size: calc(4px + 0.5vw);
    }
    .childskills {
        height: 200vh;
    }
    .child-bildung {
        height: 170vh;
    }
    .child-kontakt {
        height: 140vh
    }
    .child-nosnap-kontakt {
        position: absolute;
        width: 100%;
        height: 30vh;
        bottom: 0;
        left: 0;
        -webkit-box-shadow: 0px 0px 5vw 0px rgba(0, 0, 0, 0.005);
        -moz-box-shadow: 0px 0px 5vw 0px rgba(0, 0, 0, 0.005);
        box-shadow: 0px 0px 5vw 0px rgba(0, 0, 0, 0.005);
    }
    .job {
        position: relative;
        text-align: center;
        width: 100%;
        margin-top: 43vh;
        margin-left: -4vw;
        transform: translateY(-50%);
    }
}


/* hochkant */

@media only screen and (max-device-width: 800px) {
    iframe {
        max-height: 150vh;
    }
    .images {
        width: 100vw;
        height: 56.25vw;
        float: none;
    }
    .image {
        width: 100vw;
        height: 56.25vw;
    }
    .lb-text {
        width: 100vw;
        height: auto;
        float: none;
    }
    .lb-leiste {
        width: 100vw;
        max-height: 33vw;
        margin-left: .3vw;
        float: none;
    }
    .image-element {
        width: 32vw;
        height: 18vw;
        margin: 0.001vh 0.25vw;
        padding: 0;
    }
    .lb-text {
        width: 100%;
        height: auto;
        float: none;
    }
    .hideme {
        display: block;
    }
    .h2-responsive {
        margin: 5vh 0 0vh 5vw;
    }
    .h2-responsive+div {
        margin-top: -.8vh;
        margin-left: 4vw;
        background-color: rgba(117, 212, 212);
        z-index: 199;
    }
    .lb-list {
        font-size: calc(12px + .4vw);
        line-height: 1.3em;
        margin: 1vh 0 0 4vw;
        height: 28vh;
    }
    .donthide {
        display: none;
    }
    #div1,
    #div2,
    #div3,
    #div4,
    #div5,
    #div6 {
        width: 100vw;
        height: 56.25vw;
    }
    .icons {
        display: inline;
        height: 2vh;
        width: auto;
        margin: 1.5vh 0 1.5vh 1.5vh;
        line-height: 0;
    }
    .icons-yt {
        display: inline;
        height: 1.5vh;
        width: auto;
        margin: 1.75vh 0 1.75vh 1.5vh;
        line-height: 0;
    }
    .ham-hide {
        display: block;
    }
    #myNameBlock {
        background-color: rgb(117, 212, 212);
        height: 1.6vh;
        width: 12vw;
        left: 34vw;
    }
    #navBar>div {
        display: none;
    }
    .child {
        scroll-snap-align: none;
    }
    #myName {
        left: 35vw;
    }
    .left {
        margin-top: 5vw;
        float: inline-end;
        width: 100%;
    }
    .right {
        margin-top: 0;
        float: inline-end;
        width: 100%;
    }
    .works {
        position: relative;
        background-color: grey;
        width: 38vw;
        height: 32.76vw;
        margin: .5vh .7vw 0 0;
        float: left;
    }
    .projekteContainer {
        width: 80vw;
        margin: 5vh 0vw 0;
    }
    .works2 {
        position: relative;
        background-color: grey;
        width: 75vw;
        height: 65vw;
        right: 0;
        margin: 15vh 0;
    }
    .workTitle {
        position: absolute;
        width: 100%;
        height: auto;
        top: 64vw;
        left: 2vw;
        font-size: calc( 7px + 0.5vw);
        line-height: 1.3em;
    }
    .timeline {
        display: none;
    }
    .timeline2 {
        display: none;
    }
    h3+div {
        position: absolute;
        margin-top: -1.7vh;
        margin-left: -0.7vw;
        width: 26vw;
        height: 1.6em;
        background-color: rgb(117, 212, 212);
        z-index: 99;
    }
    html {
        scroll-snap-type: none;
    }
    .proj {
        height: auto;
    }
    h2 {
        position: relative;
        font-weight: 400;
        display: block;
        margin: 10vh 0 3vh 5vw;
        padding: 0;
        line-height: 1.3em;
        font-size: calc(14px + 3vw);
        text-transform: uppercase;
        z-index: 200;
    }
    .h2-3 {
        margin: 1vh 0 3vh 5vw;
    }
    .clear {
        display: none;
    }
    .grid-container {
        display: block;
        grid-auto-flow: column;
        margin-top: 0;
    }
    .midgrid {
        position: relative;
        top: 0;
        transform: initial;
    }
    .grid-kontakt {
        width: 100%;
        margin-left: 0;
        grid-template-columns: 60% 1fr;
    }
    .kontakt-text {
        display: none;
    }
    .kontakt-text-r {
        display: block;
        width: 100%;
        margin-bottom: 1vh;
    }
    h2+div {
        position: absolute;
        margin-top: -5vh;
        margin-left: 4vw;
        width: 15em;
        height: 2em;
        background-color: rgba(117, 212, 212);
        z-index: 199;
    }
}

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

@media screen and (orientation:portrait) {}