html, body { max-height: 100%; width: 100%; } body { margin: 1em auto 3em auto; background-color: #262626; color: #fff; font-family: Monospace; font-size: 12px; } .contact { margin: 20px; } input, select, textarea { border: 1px double #99ff00; background: #282A2E; color: #f1e3ce; font-family: 'Hack', monospace, sans-serif; font-size: 80%; } ul#posts { width: calc(100% - 210px); margin: 0; margin-left: 100px; padding: 0; list-style: none; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; flex-flow: row wrap; justify-content: flex-start; -webkit-justify-content: flex-start; } li.post { padding: 5px; width: 128px; height: 128px; margin-top: 5px; line-height: 128px; -webkit-flex: 1 1 auto; ms-flex: 1 1 auto; flex: 1 1 auto; } .thumb { border: 2px solid #4c4a4a; } .thumb:hover { opacity: 0.7; } .clear { clear: both; padding: 1em 0; } a { color: #9f0; } a:hover { color: #74c100; } .medium, .thumbnail { display: flex; justify-content: center; margin-top: 5px; background: #484747; border: 2px solid #99ff00; padding: 5px; } .info { padding-top: 5px; } .id { text-align: center; padding-bottom: 10px; } .controls { text-align: center; color: #99ff00; font-weight: bold; width: 888px; margin: 0 auto; background: #484747; padding-top: 0; margin-top: 5px; border: 2px solid #99ff00; } .navbar { text-align: center; margin-top: 7px; } .return { text-align: center; border: 2px solid #99ff00; width: 888px; margin: 0 auto; background: #484747; font-weight: bold; } .irc { margin: 20px; } code { color: #9df943; } .panel { margin-bottom: 0; background-color: #484747; border: 2px solid #99ff00; border-radius: 0px; padding-left: 10px; padding-right: 10px; width: 25%; float: left; position: relative; min-height: 1px; color: #ffffff; padding-bottom: 5px; } .panel.info { margin: 0 auto; margin-top: 5px; float: none; width: 888px; margin-bottom: 5px; } img { vertical-align: middle; max-height: 770px; } .wrapper { margin: 0 auto; width: 888px; }