.snac-announcement { border: #888 1px solid; padding: 0.5rem; }
.snac-author, .snac-author-tag { font-size: 0.8rem; }
.snac-instance-blurb, .snac-header { text-transform: lowercase; } 
.snac-post-header p { line-height: 1rem; }
.snac-post-header span { display: none; }
.snac-post-header a { font-size: 0.8rem; text-decoration: none; }
.snac-top-user { font-size: 0.8rem; color: #888; line-height: 0.8rem; } 
.snac-top-user a { color: #888; } 
.snac-top-nav { padding-bottom: 1rem; color: #888; font-size: 0.8rem; }
.snac-top-nav a { color: #888; text-transform: lowercase; }
.snac-top-nav img { height: 3rem; width: 3rem; padding-right: 1rem; padding-bottom: 1rem; }
.snac-avatar { float: left; height: 2rem; width: 2rem; padding-right: 0.5rem; padding-bottom: 0.5 rem; }
.snac-btn-delete, .snac-btn-follow, .snac-btn-hide, .snac-btn-limit, .snac-btn-mute, .snac-btn-unfollow, .snac-btn-unlimit, .snac-btn-unmute { float: right; margin-left: 0.5rem; }
.snac-children { padding-left: 1rem; border-left: 1px solid #888; font-size: 0.8rem; margin-left: 0.35rem; }
.snac-embedded-video, img { max-width: 100%; }
.snac-footer { margin-top: 2rem; margin-bottom: 2rem; font-size: 0.8rem; color: #888;  }
.snac-footer a { color: #888; }
.snac-history { padding-top: 2rem; text-transform: lowercase; font-size: 0.8rem; color: #888; }
.snac-history ul { list-style-type: none; }
.snac-history li { color: #888; }
.snac-history a { color: #888; }
.snac-list-of-lists li { display: inline; margin-right: 0.5rem; padding-right: 0.5rem; }
.snac-list-of-lists { padding-left: 0; }
.snac-no-more-unseen-posts { border-top: 2px solid #f00; padding-top: 0.5rem; text-transform: lowercase; color: #888; font-size: 0.8rem; color: #f00; }
.snac-no-more-unseen-posts a { color: #f00; }
.snac-origin { font-size: 0.8rem; color: #888;}
.snac-poll-result { margin-left: auto; margin-right: auto; }
.snac-post { margin-bottom: 5rem; }
.snac-pubdate, .snac-score { float: right; color: #888; font-size: 0.8rem; padding-left: 1rem; line-height: 1rem; }
.snac-reaction { padding: 5px; padding-left: 10px; padding-right: 10px; display: inline-flex; margin-right: 5px; font-family: inherit; font-size: 0.8rem; height: 2.5rem; vertical-align:middle; align-items:center; }
.snac-reaction-div { border-left: darkgray; border-left-style: solid; margin-bottom: .3rem; padding-left: .3rem; border-left-width: 2px; }
.snac-reaction-image { max-width: 100%; max-height: 100%; }
.snac-textarea { font-family: inherit; width: 100%; }
.snac-top-controls { padding-bottom: 1.5rem; line-height: 1.8rem; }
.snac-top-user { padding-bottom: 2rem; }
.snac-top-user-bio { line-height: 1.8rem; padding-bottom: 1rem; padding-top: 1rem; }
.snac-top-user-id, .snac-top-user-name { line-height: 1.5rem; margin: 0; }
.snac-alt-text { text-transform: lowercase; } 
.snac-content { line-height: 1.8rem; }
.snac-content>div>div>p { font-size: 0.8rem; text-transform: lowercase; color: #888; }
.snac-children .snac-post-header p { margin: 0; } 
.snac-children>div>a { display: none; }
.snac-poll-result td { border-bottom: 1px solid #888; }
.snac-poll-result td:last-child { text-align: right; }

.snac-origin a, a.snac-author-tag { color: #888; }
.snac-content-attachments>details>summary { color: #888; visibility: collapse; list-style: none; cursor: pointer; font-size: 0.8rem; }
.snac-content-attachments>details>summary:before { content: "\25b7  alt text "; visibility: visible; }
.snac-content-attachments>details[open]>summary:before { content: "\25bd  alt text"; visibility: visible; }

.snac-children>details>summary { color: #888; visibility: collapse; list-style: none; cursor: pointer; font-size: 0.8rem; margin-bottom: 1rem; }
.snac-children>details>summary:before { content: "\25b7  older posts"; visibility: visible; }
.snac-children>details[open]>summary:before { content: "\25bd  older posts"; visibility: visible; }

.snac-child>details>summary { color: #888; visibility: collapse; list-style: none; cursor: pointer; font-size: 0.8rem; }
.snac-child>details>summary:before { content: "\25b7"; visibility: visible; }
.snac-child>details[open]>summary:before { content: "\25bd"; visibility: visible; }

.snac-thread-cont { border-left: 1px solid #888; margin-left: 0.35rem; padding-left: 1rem; }
.snac-post>details>summary { color: #888; visibility: collapse; list-style: none; cursor: pointer; font-size: 0.8rem; margin-bottom: 1rem; }
.snac-post>details>summary:before { content: "\25b7  thread"; visibility: visible; }
.snac-post>details[open]>summary:before { content: "\25bd  thread"; visibility: visible; }

.snac-content-attachments { margin: 0.5em 0; }
.snac-content-attachments>details { margin: 0.5em 0; color: #888; font-size: 0.8rem; }

a { display: inline-block; max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
select { max-width: 16rem; }

input:not([type="checkbox"]):not([type="radio"]), select, textarea { display: block; }
select { background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' height='95' width='120' fill='%23888' %3E%3Cpolygon points='0,0 100,0 50,100' /%3E%3C/svg%3E") calc(100% - 0.5rem) 50%/0.6rem no-repeat; padding: 0.5rem 1.5rem 0.5rem 0.5rem; }
label { margin: 0.5rem 0.5rem 0 0; white-space: nowrap; }
input, select, textarea { background-color: #eee; }
button, input, textarea { padding: 0.5rem; }
button, input, select, textarea { color: #000; font-family: inherit; font-size: 0.8rem; margin-top: 0.5rem; margin-bottom: 0.5rem; border: 0; border-radius: 0.3rem; outline: 0; }
input[type="file"] { padding: 0.3rem 0; background: 0 0; }
button, input[type="button"], input[type="submit"] { background-color: #ccc; }
button, input:not([type="checkbox"]):not([type="radio"]), select, textarea { appearance: none; }
textarea { margin-right: 0; width: 100%; resize: vertical; }
button, input[type="button"], input[type="submit"] { padding-right: 1.5rem; padding-left: 1.5rem; }
button:hover, input[type="button"]:hover, input[type="submit"]:hover { background: #ddd; }
button:focus, input:focus, select:focus, textarea:focus { box-shadow: 0 0 0 0.1rem #888; }
input[type="checkbox"], input[type="radio"] { width: 1rem; height: 1rem; }
button:active, input[type="button"]:active, input[type="checkbox"]:active, input[type="radio"]:active, input[type="submit"]:active { transform: translateY(0.1rem); }
button:disabled, input:disabled, select:disabled, textarea:disabled { cursor: not-allowed; opacity: 0.5; transform: none; }
::placeholder { color: #999; }
@media (min-width: 40rem) {
  input[type="email"], input[type="file"], input[type="password"], input[type="tel"], input[type="text"], input[type="url"], textarea { width: 20em; margin-right: 0; }
}
