@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Rye&display=swap');

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Instrument Serif", serif;
    font-weight: 400;
    font-style: italic;

}

.heading h1 {
    font-size: clamp(20pt, min(9vw,9vh), 80pt);
}

.center-div {
    display: flex;
    justify-content: center;
    align-items: center;
    /* height: 100vh; */
    flex-direction: column;
    /* Ensure content is stacked vertically */
    text-align: center;
    /* Optional: Center text inside the div */
    margin: 0 auto;
    /* Center the div horizontally */
}

/* .image img {
    max-width: 100%;
    box-shadow: 1px 1px 0px 0px, 2px 2px 0px 0px, 3px 3px 0px 0px, 4px 4px 0px 0px, 5px 5px 0px 0px;
    border: 3px solid;

} */

.image img {
    max-width: 60%;
    box-shadow: 0.08vw 0.08vw 0vw 0vw, 0.16vw 0.16vw 0vw 0vw, 0.24vw 0.24vw 0vw 0vw, 0.32vw 0.32vw 0vw 0vw, 0.4vw 0.4vw 0vw 0vw;
    border: 0.24vw solid;
    /* border: 3px solid; */

}


.introduction {
    font-size: clamp(10pt, min(4vw,4vh), 36pt);
    /* font-family: "Instrument Serif", serif; */
    font-family: "Rye", serif;
    font-weight: 400;
    /* font-style: italic; */
}

body {
    background-color: black;
    color: crimson
}

.content {
    /* max-width: fit-content; */
    display: flex;
    flex-direction: column;
    align-items: center;
    /* max-height: 90vh; */
    /* Optional: to center the content */
}

@media (min-aspect-ratio: 1) {
    .content {
        max-width: 60vw;
    }
}