#container { text-align:center; } body.crop { overflow:hidden; } #history { padding:0; margin:0; } #container,#image { margin:0; max-height:100%; max-width:100%; padding:0; } a { color:inherit; } #details { display:none; font-weight:700; left:25px; min-width:280px; padding:20px; text-align:center; top:25px; } #history li { left:25px; text-align:center; width:168px; font-family:monospace margin-bottom:15px; } #history li,#loading { font-family:monospace; font-size:10px; padding:10px; display:block; } #loading { font-weight:500; left:220px; min-width:95px; top:95px; } #loading,#details,#history li { background:rgba(43,43,43,0.8); border-radius:5px; color:#85bf25; } #history,#loading,#details { position:absolute; } html,body { background-color:#121211; height:100%; margin:0; padding:0; border:0; overflow:auto; } #history { top:95px; left:25px; max-height:210px; overflow:hidden; } #history li { margin-bottom:10px; opacity:0.1; /* won't display anyway due to #history max height */ } #details { font-family:sans-serif; } #history li:hover, #history li:nth-of-type(1) { opacity:1 !important; } #history li:nth-of-type(2) { opacity:0.8; } #history li:nth-of-type(3) { opacity:0.6; } #history li:nth-of-type(4) { opacity:0.4; } #history li:nth-of-type(5) { opacity:0.2; }