.model-block
{
    padding:14px 8px 14px 8px;
    margin:14px auto 14px auto;
    border:1px solid #000;
    display:grid;
}

.unpublished { background-color:#98C9C9; }

a.restricted { color:#F00; }
a.explicit::before { content:"🔞 "; }
a.unpublished::before { content:"🚧 "; }
a.explicit.unpublished::before { content:"🔞🚧 "; }

.model-block.detailed
{
    grid-template-areas:
    "prefix prefix"
    "screenshot title"
    "screenshot data"
    "screenshot desc"
    "extras extras"
    "links links";

    column-gap:8px;
    grid-template-columns: minmax(240px, auto) 1fr;
    grid-template-rows:auto auto auto auto minmax(0px, 1fr);
}

@media (max-width:1279px) {
    .model-block.detailed
    {
        grid-template-areas:
        "prefix"
        "screenshot"
        "title"
        "data"
        "desc"
        "extras"
        "links";

        grid-template-columns: 1fr;
    }

}

.model-block .prefix
{
    grid-area:prefix;
    font-family:"cp437";
    font-size:larger;
    text-align:center;
    padding-bottom:14px;
}

.model-block .preview-image
{
    grid-area:screenshot;
    margin:auto;
}

.model-block .preview-image.thumbnail
{
    width:240px;
}

.model-block .title
{
    grid-area:title;
    margin:0;
}

.model-block .data
{
    grid-area:data;
    display:flex;
    flex-wrap:wrap;
    column-gap:8px;
}

.model-block .data .col
{
    flex:1;
}

.model-block .data .datum
{
    display:flex;
    border-bottom:1px dotted #000;
}

.model-block .data .datum .label
{
    flex:1;
    padding-right:8px;
}

.model-block .data .datum .value
{
    flex:3;
    align-self:flex-end;
}

.model-block .data .datum .value textarea
{
    width:100%;
    height:100px;
}

.model-block .description
{
    grid-area:desc;
}

.model-block.gallery
{
    grid-template-areas:
    "screenshot"
    "title"
    "data";
    margin:0;
}

.model-block.gallery .data
{
    max-width:240px;
    margin:auto;
}

.model-block .extras
{
    grid-area:extras;
}

.model-block .extra h3
{
    margin:0;
    margin-top:14px;
}

.gallery-frame /* Container for gallery blocks */
{
    display:flex;
    flex-wrap:wrap;
    align-items:start;
    text-align:center;
    gap: 14px 8px;
    justify-content:space-evenly;
    margin:14px 0px 14px 0px;
    grid-template-columns: minmax(240px, auto) 1fr;
}

/* Try to fit more than 2 at lower resolutions  TODO: THIS ISN'T VERY GOOD IMO */
@media (max-width:1300px) {
    .gallery-frame
    {
        gap:7px 2px;
    }
}

/* Featued World on Front Page */
#featured .model-block.gallery
{
    border:0;
    padding:0;
}

.model-block.gallery .title
{
    font-size:medium;
    font-weight:normal;
    border-bottom:1px dotted #000;
    max-width:240px;
    margin:auto;
}

.model-block.gallery .datum
{
    border-bottom:0;
}

/* Links for File blocks */
.model-block-links
{
    border:1px solid #000;
    border-top:0;
    margin-top:-14px;
    display:grid;
    grid-template-columns: repeat(6, 1fr);
    text-align:center;
}

@media (max-width:480px) {
    .model-block-links
    {
        grid-template-columns: repeat(3, 1fr);
    }

    .model-block-links .datum .value
    {
        line-height:32px;
    }
}

.file-links .model-block-links
{
    /* Links when viewing a file */
    flex:1;
    margin-top:0;
    border:0;
}

.model-block.detailed.unpublished + .model-block-links
{
    background-color: #98C9C9;
}
/* End Links for File blocks */

.link-icons
{
    padding-right:0.5ch;
}

.link-icons .icon:hover
{
    cursor:help;
}

.fg-icon { filter:sepia(1) hue-rotate(220deg) saturate(6); }

.model-block.gallery.poll
{
    grid-template-areas:
    "screenshot title"
    "screenshot data"
    "screenshot poll";
    color:#FFF;
    font-family:"cp437";
    font-size:16pt;
    column-gap:8px;
}

.model-block.gallery.poll .title { font-size:16pt; max-width:240px; }

.model-block.gallery.poll a { color:#FF5; }

.gallery .poll-info
{
    grid-area:poll;
    max-width:240px;
    text-align:left;
    border-top:1px solid #AAA;
    padding-top:4px;
}

.gallery .poll-patron-label
{
    grid-area:patron;
    text-align:center;
    border-top:1px solid #AAA;
    padding-top:4px;
}