@media screen and (min-width: 2500px) {
    div.introTxt p, div#about-txt p, p{
        font-size: 22pt;
        line-height: normal;
    }
    div.introTxt p, div#about-txt p{
        width: 34vw;
        max-width: unset;
    }
}
/*---- 4 K -----*/
@media screen and (min-width: 1440px) {
    #center-div, div.main{
        width: 65vw !important;
    }
    div.main{
        height: 80% !important;
    }
    #img-iki{
        left: 23vw !important;
    }
    div#about-txt{
        left: 26%;
    }
    div.flipContainer{
        left: 18%;
    }
}

/*----Tablet / Laptop-----*/
@media screen and (max-width: 1440px) and (min-width: 856px) {
    div.absolute{
        /*position: absolute;*/
    }
    #center-div{
        margin-top: 5vh;
    }
    div.main{
        margin-right: auto !important;
        height: 87vh !important;
        width: 90vw !important;
    }
    a>img{
        min-width: 225px;
        width: 25vw;
        max-width: 26%;
    }
    img#img-wave{
        left: 30vw;
        top: 12vh;
    }
    img#img-4walls{
        top: 21vh;
        right: 9vw;
    }

    img#img-vinyl{
        bottom: 36vh;
        left: 12vw;
    }
    img#img-iki{
        bottom: 33vh;
        left: 38vw;
    }
    img#img-pixel{
        right: 0;
        bottom: 28vh;
    }

    img#img-workit{
        bottom: 14vh;
        left: 18vw;
    }
    img#img-illustration{
        bottom: 10vh;
        right: 20vw;
    }

}

/*----Ipad Pro----*/
@media screen and (width: 1024px) and (height: 1366px){
    div#about-txt{
        left: 18%;
    }
    div.card img{
        width: 23% !important;
    }
    div.flipContainer{
        top: 51rem;
    }
    a>img{
        width: 36vw;
        max-width: unset;
    }

    img#img-wave{
        top: 11vh;
        left: 36vw;
    }
    img#img-4walls{
        top: 27vh;
        right: 0;
    }
    img#img-workit{
        bottom: 24vh;
        left: 9vw;
    }
    
    img#img-iki{
        bottom: 39vh;
        left: 28vw;
    }
    img#img-pixel{
        bottom: 22vh;
        right: 5vw;
    }
    img#img-vinyl{
        bottom: 44vh;
        left: -3vw;
    }

    img#img-illustration{
        bottom: 9vh;
        right: 32vw;
    }
}
/*
@media screen and (min-width: 1024px) and (max-width: 1440px){
    div.flipContainer{
        right: 28vw;
    }
    img{
        width: 45vh;
    }
    div.infoTxt {
        left: 40vw;
        top: 58vh;
    }

}*/

/*----Mobile S / M / L-----*/
@media screen and (max-width: 855px) {
    html, body{
        overflow-x: hidden;
    }
    div.empty{
        height: 100px;
    }
    nav a{
        margin: 5vw;
        font-size: 1.3rem;
    }
    h1{
        font-size: 2rem;
    }
    #left-div{
        float:none;
        position: relative;
        margin: 0 auto;
        margin-top: 18vh;
    }
    div.infoTxt, div.introTxt{
        position: relative;
        left:0;
    }
    div.infoTxt{
        width: 91vw;
        left: unset;
        margin: auto;
        margin-top: 20%;
        margin-bottom: 6%;
    }
    div.infoTxt p{
        width: auto;
        min-width: 100%;
    }
    div.introTxt p{
        width: auto;
        min-width: 100%;
        font-size: 1.25rem;
    }
    #center-div{
        position: relative;
        width: 98vw;
        height: unset;
        margin-top: 2vh;
        margin-left: 2vw;
        left: 2vw;
        top: 0 !important;
        z-index: 50;
    }
    /*ABOUT PAGE*/
    #about-center-div{
        position: relative;
        display: block;
        width: 55vw;
        height: auto;
        margin: 0 auto;
        margin-top: 10rem;
        margin-right: 22.5vw;
        margin-left: 22.5vw;
        top:0;
        left: 0;
    }
    #about-txt{
        position: relative;
        display: block;
        width: 100%;
        left: 0;
        top: unset;
        margin-top: 0;
        float: unset;
    }
    #about-txt p{
        display: block;
        min-width: unset;
        width: 100%;
        max-width: unset !important;
        font-size: 1.25rem;
    }
    div.flipContainer{
        display: block;
        position: relative;
        perspective: unset;
        right: unset;
        height: 100%;
        width: 100%;
        left: 0;
        top: 0;
        float: unset;
        margin-bottom: 2.3rem;
    }
    .front, .back{position: relative;}
    div.card img{
        display: block;
        min-width: 150px;
        width: 55%;
        float: unset;
    }
    /*-------------*/
    a>img{
        width: 30vw;
    }
    img#img-wave{
        top:0;
        left:0;
    }
    img#img-4walls{
        top:0;
        left: 30vw;
    }
    img#img-workit{
        top:0;
        left:62vw;
    }
    
    img#img-iki{
        top: 18vh;
        left: 0vw;
    }
    img#img-pixel{
        top: 18vh;
        left: 30vw;
    }
    img#img-vinyl{
        top:18vh;
        right: 2vw;
        left: 62vw;
    }

    img#img-illustration{
        top: 34vh;
        left: 2vw;
    }

    div.abs{
        position: absolute;
    }
}

/*----Mobile S / M / L-----*/
@media screen and (max-width: 550px) {
    nav a{
        font-size: 1.1rem;
    }
    #left-div{
        width: 84vw;
    }
    #left-div, #center-div{
        z-index: 0;
        position: relative;
        display: block;
        height: unset!important;
    }
    #center-div{
        left: 0!important;
    }
    a>img{
        left: unset!important;
        right: unset!important;
        top: unset!important;
        bottom: unset!important;
        animation: none!important;
        width: 80vw;
        min-width: 300px;
        position: relative;
        display: block;
        margin: auto;
        margin-bottom: 2rem;
    }
    div.main img{
        width: 90vw;
        margin-left: 2vw;
    }
    img.inline, img.closeUp{
        display: unset;
        width: 100% !important;
    }

    div.infoTxt{
        margin-top: 28%;
        margin-bottom: 12%;
    }

    /*ABOUT PAGE*/
    #about-center-div{
        width: 74vw;
        margin-left: 13vw;
        margin-right: 13vw;
        top: 0;
        left: 0;
    }
    /*-------------*/
}

/*----Mobile S+-----*/
@media screen and (max-width: 320px) {
    nav a{
        font-size: 1rem;
        margin: 4vw;
    }
}