/* ######################### MenuPages | MenuSubpages | MenuRelatedPages | MenuCategorizedPages ######################### */

.frame-type-menu_pages,
.frame-type-menu_subpages,
.frame-type-menu_related_pages,
.frame-type-menu_categorized_pages {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 1em;
    margin: 1em 0;
    overflow: visible;
}

.article-list {
    display: contents;
    --image-width: 360px;
    --image-height: 223px;
    --text-height: 137px; /* 360-223=137 */
}

.article-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.article-list-item {
    position: relative;
    align-self: start;
    width: var(--image-width);
    height: calc(var(--image-height) + var(--text-height));
}

.article-list-item>a {
    display:flex;
    flex-direction:column;
    outline: 0.0625rem solid var(--color-primary);
    text-decoration:none;
    justify-content: space-between;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    overflow: hidden;
}

.article-list-item>a:hover {
    outline-color: var(--color-secondary);
    color:var(--color-secondary);
}

.article-list-item>a>div {
    display:flex;
    flex-direction:column;
    width: 100%;
}



.article-list-item>a>img {
    object-fit: cover;
    width: var(--image-width);
    height: var(--image-height);
    z-index: -1;
}

.article-list-item h3:not(:empty),
.article-list-item p {
    padding-left: 1rem;
    background-color: inherit !important;
    color: inherit !important;
    line-height:1.6;
}

.article-list-item>a:hover h3:not(:empty) {
    color: var(--color-secondary) !important;
}