/* INFORMATION PAGE */
.info-menu-container {
    width: var(--info-menucontainer-width);
}
ul.info-menu {
    list-style: none;
    margin: 2em 0;
    padding-left: 2em;
}
ul.info-menu li {
    margin: 0;
    margin-bottom: -1px;
    padding: 0.8em;
    border: 1px solid var(--border-color);
    cursor: e-resize;
}
.info-menu-li:first-of-type {
    border-top: 1px solid var(--border-color);
}
ul.info-menu li.selected {
    color: var(--font-selected-color)
}
.info-view-container-isvisible ul.info-menu li {
    border-right: 0;
}

#info-view-container {
    display: none;
    position: relative;
    flex-direction: row;
    margin: 2em 2em 2em 0;
    padding: 0;
    width: calc(100vw - var(--info-menucontainer-width) - 2em);
    border: 1px solid var(--border-color);
}
#info-view-container.visible {
    display: flex;
}
.article-view-page {
    width: 100%;
}
.article-view-page a {
    text-decoration: none;
    color: inherit !important;
    font-style: oblique;
    font-weight: bold;
    cursor: var(--link-cursor-type);
}
.article-view-page .wp-block-columns {
    height: 100%;
    width: 100%;
    gap: 0!important;
}

.article-view-page .wp-block-column {
    /* align-content: center; */
}
.article-view-page .wp-block-column {
    width: 50%;
    padding: 1.5em;
}

.border-right {
    border-right: 1px solid var(--border-color);
}

.article-view-page .wp-block-image {
    position: relative;
    margin: 0; padding: 0;
    max-height: 100%;
    max-width: 100%;
}


/* ADAPTIVE SCREEN ON INFORMATION PAGE */
@media all and (max-width: 781px) { /* WP COLUMN IS BEING FLEX ROW */
    .remove-on-small-screen {
        display: none;
    }
    .border-right {
        border-right: 0;
    }
    .article-view-page {
        overflow-y: auto;
    }
    .article-view-page::-webkit-scrollbar{
        width: 0px;
        background-color: transparent;
    }
    .article-view-page::-webkit-scrollbar-thumb{
        background-color: black;
    }
    .article-view-page .wp-block-column {
        padding: 1em;
    }
}

@media all and (max-width: 1000px) {
    :root {
        --info-menucontainer-width: 25vw;
    }
}

@media all and (max-width: 750px) {
    :root {
        --info-menucontainer-width: 20vw;
    }
}

@media all and (max-width: 600px) { /* MOBILE */
    :root {
        --info-menucontainer-width: 100%;
    }
    .info-view-container-isvisible ul.info-menu li {
        border-right: 1px solid var(--border-color);
    }
    div.info-menu-container {
        position: fixed;
    }
    ul.info-menu {
        width: 100%;
        padding: 1rem;
        margin: 0;
    }
    ul.info-menu li {
        padding: 2rem 0;
        text-align: center;
        font-size: 1.1rem;
    }
    #info-view-container {
        background-color: var(--bg-color);
        margin: 0;
        width: 100%;
        border: none;
        display: none;
        overflow-y: scroll;
    }
    .article-view-page {
        height: calc(100vh - var(--nav-height));
    }
    .article-view-page .wp-block-column {
        padding: 1rem var(--card-gap);
    }
    .article-view-page .wp-block-column p {
        padding: 0rem;
    }
    .article-view-page .wp-block-column p:last-of-type {
        margin-bottom: 2.5rem;
    }
    .article-view-page .wp-block-column h2 {
        padding-left: 2rem;
    }
}