/* Overlay */

    #overlay {
        position:fixed;
        visibility:hidden;
        top:0;
        left:0;
        width:100vw;
        height:100vh;
        background-color:rgba(0, 0, 0, 0.8);
        z-index:2;
        opacity:0;
        transition: opacity 0.5s linear;
    }

    #overlay-close {
        position:absolute;
        top:0;
        left:0;
        width:100%;
        height:100%;
        z-index:3;
    }


/* Showcase */

    #showcase {
        position: absolute;
        width:960px;
        height:800px;
        max-height:90%;
        margin:auto;
        left:0;
        right:0;
        top:0;
        bottom:0;
        z-index:4;
    }


/* Showcase Title */

    #showcase-title {
        display:flex;
        justify-content: space-between;
        pointer-events: none;
    }

    #showcase-title span {
        display:inline-block;
        font-family:var(--font-accent-1);
        color:white;
        font-size:42px;
        height:68px;
        font-weight: bold;
        text-align: center;
    }

    #showcase-title img {
        display:inline-block;
        width:36px;
        height:34px;
        margin-top:12px;
        border-radius:100%;
        cursor:pointer;
        pointer-events: auto;
        -webkit-filter: drop-shadow(0px 0px 2px black);
        filter: drop-shadow(0px 0px 2px black);
    }


/* Showcase Content */

    .showcase-content {
        height:calc(100% - 136px);
        background-color:white;
        border:1px solid black;
        border-bottom:0;
        padding:20px;
        overflow-y:auto;
    }

    .showcase-tab {
        height:100%;
        width:100%;
        display:grid;
        grid-template-columns: 42% 1fr;
        grid-template-rows: calc(36% + 10px) 1fr;
        grid-gap:24px;
        grid-template-areas: "video text" "gallery text";
    }

    .showcase-text {
        grid-area: text;
        overflow:auto;
        padding-right:24px;
    }

    .showcase-text .link-button:first-of-type {
        margin-top:10px;
    }

    .showcase-text li {
        padding:2px 0 6px 0;
    }

    .showcase-video {
        grid-area: video;
        outline:1px solid black;
        border-radius:2px;
    }

    .showcase-video img {
        width:100%;
        height:100%;
        object-fit:cover;
    }

    .showcase-gallery {
        position:relative;
        grid-area: gallery;
    }

    .showcase-gallery .slide {
        background-color:#ddd;
        outline:1px solid black;
        border-radius:2px;
        cursor: -moz-zoom-in; 
        cursor: -webkit-zoom-in; 
        cursor: zoom-in;
    }

    .showcase-gallery .slide picture {
        display:block;
    }

    .showcase-gallery .slide img,
    .showcase-gallery .slide picture * {
        height:200px;
        width:100%;
        object-fit: cover;
    }

    .showcase-gallery .slide p {
        font-size:14px;
        text-align:center;
        padding:8px;
        padding-top:2px;
    }

    .showcase-gallery #showcase-navigation {
        position:absolute;
        top:0;
        color:white;
        font-size:20px;
        font-weight:bold;
        width:calc(100% - 16px);
        display:flex;
        justify-content: space-between;
        margin-top:90px;
        padding:0px 8px;
        pointer-events: none;
    }

    .showcase-gallery .previous,
    .showcase-gallery .next {
        width:24px;
        height:24px;
        background-color:white;
        border-radius:100%;
        text-align:center;
        cursor:pointer;
        pointer-events: auto;
    }

    .information tr td {
        vertical-align: top;
    }

    .information tr td:first-child {
        min-width:100px;
        font-weight:bold;
        padding-right:10px;
    }

    .information tr td:last-child {
        padding-bottom:6px;
    }