html {
    height: 100dvh;
    font-size: 1.25vw;
}

body {
    font-family: "univers", sans-serif;
    font-size: var(--fontNormal);
    line-height: var(--lineHeight);
    font-weight: bold;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100dvh;
    flex-wrap: nowrap;
}

.int {
    text-align: right;
    color: var(--third);
    cursor: pointer;
}


header h1 {
    color: var(--contrast);
}

header h2 {
    /* text-transform: uppercase; */
    /* font-size: var(--fontSmall);
    line-height: var(--lineHeight); */
}

.notAvailable {
    font-size: var(--fontSmall);
    line-height: var(--lineHeight);
    opacity: 0.25;
}


.unit {
    position: absolute;
    visibility: hidden;
    width: var(--m);
    height: var(--m);
}

a {
    color: inherit;
    text-decoration: none;
}

a:hover {
    color: var(--contrast);
}

.content p {}

.nimbus, blockquote {
    font-family: "nimbus", serif;
    font-size: var(--fontNormalNimbus);
    line-height: var(--lineHeight);
}

.extract p {
    font-family: "nimbus", serif;
    font-size: var(--fontNormalNimbus);
    line-height: var(--lineHeight);
}

header {
    border-bottom: 1px solid black;
    line-height: 1em;
}

header h1 {
    /* font-size: var(--fontBig); */
    /* font-family: "univers", sans-serif; */
}


#photosList {
    font-size: var(--fontSmall);
    line-height: var(--lineHeight);
}

.content {
    font-weight: normal;
}

/* .content h1+h2,
.content h1+h2,
.content h1+img,
.content h1+p,
.content h1+div,
.content h1+h3,
.content h1+blockquote,

.content h2+h1,
.content h2+h2,
.content h2+img,
.content h2+p,
.content h2+div,
.content h2+h3,
.content h2+blockquote,

.content h3+h1,
.content h3+h2,
.content h3+img,
.content h3+p,
.content h3+div,
.content h3+h3,
.content h3+blockquote,

.content img+h1,
.content img+h2,
.content img+img,
.content img+p,
.content img+div,
.content img+h3,
.content img+blockquote,

.content p+h1,
.content p+h2,
.content p+img,
.content p+p,
.content p+div,
.content p+h3,
.content p+blockquote,

.content div+h1,
.content div+h2,
.content div+img,
.content div+p,
.content div+div,
.content div+h3,
.content div+blockquote,

.content blockquote+h1,
.content blockquote+h2,
.content blockquote+img,
.content blockquote+p,
.content blockquote+div,
.content blockquote+h3,
.content blockquote+blockquote */

.content *:is(h1, h2, h3, img, p, div, blockquote, span)+*:is(h1, h2, h3, img, p, div, blockquote, span)

/* .content *+*  */
    {
    margin-top: var(--lineHeight);
    /* color: red; */
}


.content .author {
    font-size: var(--fontSmall);
    line-height: var(--lineHeight);
}

.content a {
    text-decoration: underline;
}

.experienceText {
    font-family: "nimbus", serif;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.9);
    position: fixed;
    left: 0%;
    top: 0%;
    font-size: var(--fontNormalNimbus);
    line-height: var(--lineHeight);
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    display: none;
    cursor: pointer;
}


.welcomeText .content {
    width: var(--column8);
}

img {
    display: block;
    width: 100%;
}

.gallery img {
    object-fit: contain;
    width: var(--column1);
    height: var(--column1);
}

/* .gallery .img1 {
} */

.leftGallery img {
    width: var(--column1);
}

.leftGallery img+img {
    /* width: var(--column3); */
    padding-top: var(--m);
}

hr {
    margin: 0px;
    border: 1px solid black;
    border-width: 1px 0px 0px 0px;
}

header {
    /* background-color: white; */
    width: 100%;
    padding: var(--m);
    z-index: 4;
    /* border-bottom: 1px solid; */
}

footer {
    padding: var(--m);
    /* background-color: white; */
    bottom: 0px;
    width: 100%;
    left: 0px;
    z-index: 2;
    /* border-top: 1px solid; */
}

nav {
    background-color: white;
    z-index: 2;
    line-height: 1em;
    /* border-bottom: 1px solid; */
}

.red {
    color: var(--contrast);
}

.fix {
    position: fixed;
}


.anchor {
    scroll-margin-top: var(--m);
}



#menu {
    /* border-top: 1px solid; */
    position: absolute;
    /* font-size: 2rem; */
    width: 100%;
    z-index: 9;
    /* font-family: "univers", sans-serif; */
}

.small {
    font-size: var(--fontSmall);
    line-height: var(--lineHeight);
}

#menu li {
    padding: var(--m);
    border-bottom: 1px solid black;
}

.infiniteCanvasControl {
    /* position: fixed; */
    display: block;
    top: 0;
    width: 100vw;
    height: 100%;
    overflow: hidden;
    cursor: grab;
}

.page {
    padding: var(--m);
}


/* .pageGallery {
    width: var(--column2);
} */

.addPointerEvent {
    pointer-events: all;
    cursor: pointer;
    fill: rgba(255, 255, 255, 0);
    transition: fill var(--animation);
}

.addPointerEvent.showWhite:hover {
    fill: rgba(255, 255, 255, 0.25);
    /* opacity: 25%; */
}

/* @media screen and (max-aspect-ratio: 4/3) {
    html {
        font-size: 1.75vw;
    }
} */

@media screen and (orientation: portrait) {
    html {
        font-size: 4vw;
    }

    .leftGallery {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: var(--m);
    }

    .leftGallery img {
        width: var(--column6);
        height: var(--column6);
        object-fit: contain;
        display: block;
        padding-top: 0px !important;
    }

    .rflexLeft {
        justify-content: left;
    }

    .rorder1 {
        order: 1;
    }

    .rorder2 {
        order: 2;
    }

    .rorder3 {
        order: 3;
    }

    .gallery img {
        width: var(--column6);
        height: var(--column6);
    }

    .mHide {
        display: none;
    }

    .fix {
        position: relative;
    }

    .marginTopM {
        margin-top: calc(var(--m) + var(--fontNormal));
    }

}