.caption {
    max-width: 50vw;
    white-space: pre-wrap;
}

.comment {
    display: flex;
    flex-wrap: wrap;
    margin: 1em;
}

.comment div {
    display: flex;
    flex-direction: column;
}

.comment-content {
    flex-basis: 100%;
}

.commenter-picture {
    height: 7rem;
    width: 7rem;
}

#comment-form {
    display: flex;
    flex-direction: column;
    margin: 1em;
}

#comment-section {
    margin: 1em;
}

.post-details {
    display: flex;
    flex-direction: column;
    gap: 0.25em;
}

.tag-list {
    list-style-type: none;
}

.view-container {
    align-items: center;
    display: flex;
    gap: 5em;
    height: 100vh;
    justify-content: center;
    padding: 1em;
}

@media (max-width: 768px) {
    .view-container {
        flex-direction: column;
    }
}

.view-container audio,
.view-container img,
.view-container video {
    height: 100vh;
    overflow: hidden;
    object-fit: contain;
    width: 100vw;
}