/*
******************************************************************

CSS for Module Gallery

(c) sinntun.codes
******************************************************************
*/


.gallery-list {
    display: flex;
    gap: 2.1875rem;
    flex-wrap: wrap;
    justify-content: space-around;
}

.pageelement-gallery-list .text-container {
    padding: 0.3125rem 0.625rem;
    margin: 0;
    background: #ff8c00;
}

.pageelement-gallery-list > div:has(a:hover) {
    outline: 0.1875rem solid #000;
    outline-offset: 0.1250rem;
}

.pageelement-gallery-list a:focus-visible {
    outline: none;
}

.pageelement-gallery-list > div:has(a:focus) {
    outline: 0.1875rem solid #000;
    outline-offset: 0.1250rem;
}


.pageelement-gallery-list .gallery-overview-copyright {
    opacity: 0.8;
    font-size: 0.75rem;
    float: right;
    margin-top: -0.3125rem;
    word-wrap: break-word;
    word-break: break-word;
}

.pageelement-gallery-list .text-container a.title {
    margin: 0.938rem 0 !important;
    display: block;
}

.pageelement-gallery-list .ai-mark {
    position: absolute;
    bottom: 0.6rem;
    right: 0.1rem;
    display: inline-block;
    text-align: right;
    padding-right: 0.938rem;
}

.pageelement-gallery-list .ai-mark::before {
    content: '';
    background: url(/_images/ai-mark.svg) no-repeat;
    height: 1.5625rem;
    width: 1.5625rem;
    display: block;
    opacity: 0.4;
}

.pageelement-gallery-list .image-container {
    position: relative;
}

.gallery-list .item {
    width: calc(33.3% - 1.5000rem);
}

.gallery-list .item:hover {
    outline: 0.1875rem solid #000;
    outline-offset: 0.1250rem;
}

.gallery-list .title-container {
    background: #ff8c00;
    margin-bottom: 0.0000rem;
    padding: 0.6250rem 0.7500rem;
    line-height: 1.0000rem;
}

.gallery-list .title-container .title {
    color: #000;
    font-size: 1.0000rem;
}

.gallery-detail .content.gallery-container {
    display: flex;
    flex-wrap: wrap;
    gap: 2.0625rem;
}

.pageelement-gallery-detail .gallery-image {
    display: inline-block;
    width: calc(33.3% - 1.3750rem);
}

.pageelement-gallery-detail .gallery-image:hover {
    outline: 0.1875rem solid #000;
    outline-offset: 0.1250rem;
}

.pageelement-gallery-detail .back-link {
    font-size: 1.2500rem;
    font-weight: 700;
    margin-top: 1.2500rem;
    display: inline-block;
}

.pageelement-gallery-detail .back-link:hover {
    text-decoration: underline;
}

.pageelement-gallery-detail .back-link:before {
    content: '\f32a';
    font-family: 'Font Awesome 6 Pro', sans-serif;
    margin-right: 0.6250rem;
    font-size: 1.1250rem;
}

@media only screen and (max-width: 64.0000rem) {
    .gallery-list .item,
    .pageelement-gallery-detail .gallery-image {
        width: calc(50% - 1.1250rem);
    }
}

@media only screen and (max-width: 40.6250rem) {
    .gallery-list .item,
    .pageelement-gallery-detail .gallery-image {
        width: 100%;
    }
}