* {

    box-sizing:border-box;

}




body {

    margin:0;

    width:100vw;

    height:100dvh;

    overflow:hidden;

    background:white;

    position:fixed;

}






.stack {


    position:absolute;


    height:100dvh;


    width:70vw;


    left:15vw;


    top:0;


    overflow:hidden;


}







.stack img {


    position:absolute;


    width:100%;


    height:100%;


    object-fit:contain;


    transform-origin:center center;


}







/* ==========================
FIRST IMAGE
========================== */


.first-wrapper {

    position:absolute;

    height:85%;

    top:7.5%;

    left:50%;

    transform:translateX(-50%);

    aspect-ratio:1157 / 1640;

    z-index:150;

}





.first-wrapper img {


    width:100%;


    height:100%;



}






/* ==========================
CONTACT OVERLAY
========================== */


.contact-overlay {


    position:absolute;


    inset:0;


    width:100%;


    height:100%;
    


}







.contact-box {


    position:absolute;


    display:block;

    background:transparent;

}






/* EMAIL */


.email {


    left:9.16%;


    top:33.41%;


    width:64.21%;


    height:3.66%;

    z-index:200;


}







/* INSTAGRAM */


.instagram {


    left:9.5%;


    top:37.87%;


    width:39.93%;


    height:3.72%;

    z-index:200;


}









/* ==========================
SWIPE AREAS
========================== */



.click-area {


    position:fixed;


    top:0;


    height:100dvh;


    width:50%;


    z-index:100;



}





.left {


    left:0;


    cursor:w-resize;


}





.right {


    right:0;


    cursor:e-resize;


}








@media(max-width:1200px){


    .stack {


        width:100vw;


        left:0;


    }


}








@media(max-width:600px){


    .stack {

        height:70dvh;

        width:100vw;

        top:15dvh;

    }



    .first-wrapper {


        width:75%;


        height:auto;


        aspect-ratio:1157 / 1640;


        left:50%;


        top:50%;


        transform:translate(-50%,-50%);


    }


    .first-wrapper img {


        width:100%;


        height:100%;


    }


}



