.thumbnail { position: relative; padding: 0; height: 135px; overflow: hidden; border-radius: 0; border: 1px solid #515151; } .thumbnail img { background-repeat: no-repeat; width: 100%; height: auto; } .thumbnail .upper, .thumbnail .lower { position: absolute; left: 0; width: 100%; background-color: rgba( 0, 0, 0, 0.5 ); padding: 5px 10px; color: white; font-size: 0.8em; } .thumbnail .upper { top: 0; } .thumbnail .upper .ago { float: right; } .thumbnail .lower { bottom: 0; } .thumbnail .model { } .thumbnail .file { display: inline-block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden !important; bottom: 0; padding-right: 10px; width: 100%; } .thumbnail .lower .selectvideo { position: absolute; right: 4px; bottom: 4px; } .thumbnail .lower .duration { float: right; } .thumbnail.selectable .lower .duration { margin-right: 12px; } .thumbnail .badges { position: absolute; top: 23px; right: 5px; font-size: 1.3em; } .thumbnail .badges .followed { color: gold; display: none; } .thumbnail .badges.followed .followed { display: inline-block; } .thumbnail .badges .recording { color: red; display: none; } .thumbnail .badges .video-tag { font-size: 0.7em; } .thumbnail:hover .badges { display: none; } .thumbnail .badges.recording .recording { display: inline-block; animation: pulsing-opacity 3s infinite; } .thumbnail .messages { position: absolute; bottom: 30px; left: 10px; font-size: 0.8em; font-weight: bold; font-family: monospace; } .thumbnail .messages span { color: white; padding: 0.3em; border-radius: 3px; border: 1px solid black; border: 1px solid rgba( 0, 0, 0, 0.4 ); } .thumbnail .messages span.notwatched { background-color: deepskyblue; } .thumbnail .messages span.discarded { background-color: red; } .thumbnail.folder { text-align: center; } .thumbnail.folder .lower { text-align: left; } .thumbnail.folder .upper { text-align: center; font-weight: bold; } .thumbnail.folder i { margin-top: 25px; font-size: 600%; } .thumbnail.folder .folder-small { position: absolute; top: 10px; left: 10px; font-size: 200%; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; } .bulkactions { display: inline-block; } .search { background-color: #0c0c0c; padding: 5px; margin: 5px 0 5px 0; border-radius: 5px; } .search.model-entry { } .search.model-entry img { width: 120px; height: 120px; display: inline-block; padding: 0; border-radius: 0; border: 1px solid #515151; vertical-align: top; object-fit: cover; } .search.model-entry .info { padding-left: 10px; display: inline-block; width: 50%; } .search.model-entry.big .info { width: calc(100% - 210px); } .search.model-entry .info h4 { border-bottom: 1px solid darkred; display: inline-block; width: 100%; font-size: 1.2em; } .search.model-entry.big img { width: 200px; height: 200px; } .search.model-entry .thumbnail { width: 100px; }