body{width:100%;height:100vh;margin:0;padding:0;background-color:#36393e;color:#d3d3d3;font-family:"Marvel",sans-serif;font-size:19px;line-height:1;-webkit-font-smoothing:antialiased;-moz-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}ul{list-style:none;margin:0;padding:0}::selection{background-color:transparent;color:#257163}::-moz-selection{background-color:transparent;color:#257163}::-webkit-scrollbar-thumb{background-color:rgba(26,197,176,0.7);border-radius:10px;box-shadow:inset -3px -4px 4px 0 rgba(0,0,0,0.4)}::-webkit-scrollbar-track{background-color:#36393e;border-radius:10px}::-webkit-scrollbar{background-color:rgba(0,0,0,0.02);height:8px;width:3px}::-moz-scrollbar-thumb{background-color:rgba(26,197,176,0.7);border-radius:10px;box-shadow:inset -3px -4px 4px 0 rgba(0,0,0,0.4)}::-moz-scrollbar-track{background-color:#36393e;border-radius:10px}::-moz-scrollbar{background-color:rgba(0,0,0,0.02);height:8px;width:3px}#characters .imagewrap:after{-webkit-transition:all .4s cubic-bezier(0.55,0.06,0.68,0.19);-moz-transition:all .4s cubic-bezier(0.55,0.06,0.68,0.19);-ms-transition:all .4s cubic-bezier(0.55,0.06,0.68,0.19);-o-transition:all .4s cubic-bezier(0.55,0.06,0.68,0.19);transition:all .4s cubic-bezier(0.55,0.06,0.68,0.19)}a{-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;transition:all .4s ease-in-out}#wrapper{overflow:hidden}#characters,#timeline,#board{position:relative;float:left;height:100vh;overflow:hidden}#board{float:none;padding:0 0 40px 20px;background:#36393e;box-shadow:inset 1px 1px 2px #1a1b1c;overflow-y:scroll}#characters{width:258px;background:#2f3238}#timeline{width:340px;background:#2d2f34;overflow-y:scroll;margin-right:-3px}#board .header{text-align:right;margin-top:62px;margin-bottom:26px;padding-right:20px}#characters .header,#timeline .header{overflow:hidden;clear:both;width:100%;margin:0}#timeline .header{position:fixed;padding-top:32px;background:#2d2f34;width:337px;z-index:200}#characters .header{position:absolute;height:134px;padding-top:70px}ul.character-filters{display:none;clear:both;float:right;margin-right:-10px}ul.character-filters.enabled{display:block}ul.character-filters:first-of-type{margin-top:4px}ul.character-filters li{display:inline-block;color:#2f3238;background:rgba(227,48,9,0.75) url(https://i.imgur.com/I4W55h0.png);text-transform:uppercase;letter-spacing:.5px;font-family:'Nova Flat',sans-serif;font-weight:400;font-size:13px;padding:2px 8px 2px 9px;margin-left:-1px;transform:skew(-32deg);cursor:pointer}ul.character-filters li:last-of-type{padding-right:18px}ul.character-filters li span{display:block;transform:skew(32deg)}ul.character-filters li.active{background-color:rgba(227,9,9,0.55)}ul.character-filters li:not(.active):hover{background-color:rgba(217,187,45,0.5)}.characterlist{margin-top:134px;height:calc(100vh - 134px);overflow-y:scroll}.characterlist li{visibility:hidden;height:0}.characterlist.show-all li,.characterlist.show-hero li.filter-hero,.characterlist.show-villain li.filter-villain,.characterlist.show-npc li.filter-npc{visibility:visible;height:auto}#characters .characterlist li{position:relative;padding:2px 0}#characters .characterlist > li:first-of-type{padding-top:0}#characters .characterlist li:last-of-type{padding-bottom:0}#characters .header:after,#characters .characterlist > li:after /#characters .characterlist > li:first-of-type:before*/{content:'';position:absolute;width:100%;height:1px;background:#585a5f;border-top:solid 1px #151617;opacity:.4}#characters .header:after{bottom:2px}#characters .characterlist > li:after{bottom:-2px}#characters .characterlist > li:last-of-type:after{content:none}#characters .characterlist article{display:none;padding:0 10px 0 14px;text-align:justify;font-size:14px;color:#8f8f98}#characters .characterlist article p:not(:first-of-type){margin-top:-7px}#characters .header h4,#timeline .header h4,#board .header h4,#board section h4{padding:0;margin:0;letter-spacing:-.5px;font-family:'Nova Flat',sans-serif;font-weight:400;font-style:italic}#characters .header h4,#timeline .header h4,#board section h4{display:inline-block;float:right;background:url(https://i.imgur.com/Y68MH83.png);background-position:bottom left;padding:5px 14px 3px 24px;text-transform:uppercase;font-size:24px;color:#2d2f34;text-shadow:1px 1px #1fbdaa}#timeline .header h4{letter-spacing:1px}#board .header h4{font-size:48px;color:#36393e;text-shadow:3px 2px #44c4b4}#board .header .subheading{font-style:italic;font-size:18px;color:#219486;text-transform:uppercase;padding-right:9px;text-shadow:0 0 1px #219486}#board .header .subheading:nth-of-type(2){padding-right:18px}#board section h4{font-size:20px;padding:4px 14px 2px 24px;margin-bottom:10px;margin-top:-10px}#characters li h4{margin:0;margin-left:-4px}#characters li h4:nth-of-type(2){margin-top:5px}#characters li h4 span{background:url(https://i.imgur.com/gH1v2q1.png);background-position:top right;padding:0 22px 1px 16px;text-transform:uppercase;letter-spacing:.5px;font-weight:700;font-style:italic;font-size:21px;color:#c1c2c5;transform:skewX(-8deg)}#characters li h4.alt span{font-size:17px;padding:0 18px 1px 12px}#characters .imagewrap{position:relative;width:100%;height:145px;cursor:pointer;background-position:center;background-size:cover}#characters .imagewrap:after{content:'';position:absolute;top:0;left:0;bottom:0;right:0;opacity:.6;background:url(https://i.imgur.com/I4W55h0.png);background-color:#151618}#characters .imagewrap:hover:after{opacity:.5;background:url(https://i.imgur.com/ktl0xrN.png);background-color:transparent}#characters .imagewrap .container{position:absolute;left:0;bottom:20px;z-index:1}.timeline .timeline-body{border-radius:0 8px 8px 0;padding:5px 0;position:absolute;top:0;margin-top:64px}.timeline .timeline-body:after{content:'';width:4px;height:100%;background-color:#309588;position:absolute;right:17px;top:0}.timeline .timeline-body .timeline-item{position:relative}.timeline .timeline-body .timeline-item:hover{background-color:#24282a;background-image:url(https://i.imgur.com/I4W55h0.png)}.timeline .timeline-body .timeline-item:after{content:'';width:12px;height:12px;border-radius:50%;border:3px solid #309588;background-color:#2F3331;position:absolute;right:10px;top:18px;z-index:9}.timeline .timeline-body .timeline-item:hover:after{background-color:#e4e4e4}.timeline .timeline-body .timeline-item .content{border-bottom:1px dashed #36393e;padding:8px 36px 8px 22px;margin:0}.timeline .timeline-body .timeline-item .content .title{margin:0;margin-top:9px;font-weight:400;font-size:20px;text-align:right;text-transform:uppercase}.timeline .timeline-body .timeline-item .content p{margin-top:6px;font-size:13px;text-align:right;text-transform:uppercase}.time{display:none}#board section{clear:both;float:right;width:96%;max-width:620px;margin:0;margin-bottom:6px}#board section.plot,#board section.active{background:#2d2f34;margin-bottom:32px}#board section .content{visibility:hidden;height:0;clear:both;padding:0 24px 0 28px;text-align:justify}#board section.plot .content,#board section.active .content{visibility:visible;height:auto}