html {
    margin:auto;
    a[aria-current="page"],a:hover {
        color:red;
    }
}

body {
    min-height:100vh;width:80vw;
    margin:auto;
    background-image: url("/img/backgroundEigg2b.webp");
    background-position:center center;
    background-attachment:fixed;
    background-repeat:no-repeat;
    background-size:cover;
    display:grid;
    gap:20px;
    grid-template-rows:auto 1fr auto;
    grid-template-columns:1fr 3fr 1fr;
    grid-template-areas:
    ". header ."
    ". main ."
    ". footer .";
}
header,footer,main,nav {margin:auto;width:100%;}
header {
    border-radius:20px;border:2px solid black;
    margin-top:2rem;
    text-align:center;
    background:rgb(255 255 255 / 70%);
    grid-area:header;display:grid;
    grid-template-areas:
    "wiggle1 h1 wiggle2"
    "wiggle1 nav wiggle2";
    grid-template-columns:auto 1fr auto;
    grid-template-rows:auto auto;
}
header .wiggle1 {
    grid-area:wiggle1;
}

header .wiggle2 {
    grid-area:wiggle2;
}

header .header-title {
    grid-area:h1;
}

nav {
    grid-area:nav;
}

main {
    height:100%;
    grid-area:main;
    display:flex;
    flex-flow:wrap column;
}

footer {
    margin:auto;border:2px solid black;
    margin-bottom:2rem;
    border-radius:20px;
    img {
        display:block;
        width:10%;heigh:auto;
        margin:auto;
        margin-top:2rem;
    }
    text-align:center;
    background:rgb(255 255 255 / 70%);
    grid-area:footer;
}

.gallery-article, .gallery-article__main-content, .gallery-article__other-links__previews {
    background:rgb(255 255 255 / 70%);
    border-radius:20px;
    border:2px solid black;
    display:flex;
    flex-flow:wrap column;
    gap:10px;
}
.gallery-article__main-content--row {
    flex-flow:wrap row;
/*     margin:auto; */
    justify-content:center;
}

.gallery-article figcaption {
    h2 {border:none;}
}

.gallery-article {
    padding:15px;
    text-align:center;
    h2, h3 {border-bottom:2px solid black;}
    flex-grow:4;
}

.gallery-article__main-content {
    padding:0.5rem;
    a {
/*         padding:15px; */
        border-radius:15px;
        overflow:hidden;
        img {
            display:block;
            max-width:100%;
            margin:auto;
            object-fit:cover;
            border-radius:15px;
        }
    }
}

.gallery-article__img-link {
    border-radius:15px;
    overflow:hidden;
    img {
        display:block;
        max-width:100%;
        margin:auto;
        object-fit:cover;
        border-radius:15px;
    }
}
.gallery-article__blurb {
    text-align:left;
    background:linear-gradient(to right bottom, palegoldenrod, rgb(255 255 255 / 70%) );
    p {margin:0.5rem;}
    border-radius:15px;
    border:1px solid black;
}

.gallery-article__other-links {
    align-text:center;
}

.gallery-article__other-links__previews {
    display:flex;
    flex-flow:wrap row;
    flex-grow:4;
    justify-content:center;
    figcaption {
        text-align:center;
    }

}

.gallery-article__other-links__previews img {
    margin:0.5rem;
    border-radius:10px;
    border:1px solid black;
    height:250px;
    width:auto;
    object-fit:contain;
    opacity:0.7;
}

.gallery-article__other-links__previews img:hover {
    opacity:1;
}

.gallery-article__other-links__previews--generated-page-previews {
    img {
        aspect-ratio:1/1;
        width:100%;
        max-width:250px;
        object-fit:cover;
    }
}