.twitter-button {
  position: fixed;
  bottom: 10px;
  left: 10px;
  z-index: 9999;
  display: block;
  width: 48px;
  height: 48px;
  border-radius: 6px;
  overflow: hidden;
  background: #000;
  box-shadow: 0 0 8px rgba(0,0,0,0.4);
  cursor: pointer;
}

.twitter-button img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.twitter-button:hover {
  filter: brightness(1.25);
  transform: scale(1.05);
  transition: all 0.2s ease-in-out;
}



.magic,.magic img{width:100%}.complete_modal h3,.complete_modal h4,.featured_modal h3,.name_modal input,.research_modal h3,h2{font-weight:400;font-size:16px}@font-face{font-family:pixles;src:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/217233/04B_03__.TTF)}.achievementsButton .pixelsBottom::after,.achievementsButton .pixelsBottom::before,.achievementsButton .pixelsTop::after,.achievementsButton .pixelsTop::before,.auto .pixelsBottom::after,.auto .pixelsBottom::before,.auto .pixelsTop::after,.auto .pixelsTop::before,.complete_modal .pixelsBottom::after,.complete_modal .pixelsBottom::before,.complete_modal .pixelsTop::after,.complete_modal .pixelsTop::before,.endGame .pixelsBottom::after,.endGame .pixelsBottom::before,.endGame .pixelsTop::after,.endGame .pixelsTop::before,.featured_modal .pixelsBottom::after,.featured_modal .pixelsBottom::before,.featured_modal .pixelsTop::after,.featured_modal .pixelsTop::before,.followButton .pixelsBottom::after,.followButton .pixelsBottom::before,.followButton .pixelsTop::after,.followButton .pixelsTop::before,.followers .pixelsBottom::after,.followers .pixelsBottom::before,.followers .pixelsTop::after,.followers .pixelsTop::before,.intro_modal .pixelsBottom::after,.intro_modal .pixelsBottom::before,.intro_modal .pixelsTop::after,.intro_modal .pixelsTop::before,.make .pixelsBottom::after,.make .pixelsBottom::before,.make .pixelsTop::after,.make .pixelsTop::before,.mystats .pixelsBottom::after,.mystats .pixelsBottom::before,.mystats .pixelsTop::after,.mystats .pixelsTop::before,.name_modal .pixelsBottom::after,.name_modal .pixelsBottom::before,.name_modal .pixelsTop::after,.name_modal .pixelsTop::before,.pen .pixelsBottom::after,.pen .pixelsBottom::before,.pen .pixelsTop::after,.pen .pixelsTop::before,.pen_css .pixelsBottom::after,.pen_css .pixelsBottom::before,.pen_css .pixelsTop::after,.pen_css .pixelsTop::before,.pen_design .pixelsBottom::after,.pen_design .pixelsBottom::before,.pen_design .pixelsTop::after,.pen_design .pixelsTop::before,.pen_html .pixelsBottom::after,.pen_html .pixelsBottom::before,.pen_html .pixelsTop::after,.pen_html .pixelsTop::before,.pen_js .pixelsBottom::after,.pen_js .pixelsBottom::before,.pen_js .pixelsTop::after,.pen_js .pixelsTop::before,.pip .pixelsBottom::after,.pip .pixelsBottom::before,.pip .pixelsTop::after,.pip .pixelsTop::before,.releasedEmpty .pixelsBottom::after,.releasedEmpty .pixelsBottom::before,.releasedEmpty .pixelsTop::after,.releasedEmpty .pixelsTop::before,.releasedHeader .pixelsBottom::after,.releasedHeader .pixelsBottom::before,.releasedHeader .pixelsTop::after,.releasedHeader .pixelsTop::before,.released_pen__bottom .pixelsBottom::after,.released_pen__bottom .pixelsBottom::before,.released_pen__bottom .pixelsTop::after,.released_pen__bottom .pixelsTop::before,.released_pen__top .pixelsBottom::after,.released_pen__top .pixelsBottom::before,.released_pen__top .pixelsTop::after,.released_pen__top .pixelsTop::before,.researchButton .pixelsBottom::after,.researchButton .pixelsBottom::before,.researchButton .pixelsTop::after,.researchButton .pixelsTop::before,.researchButton_counter .pixelsBottom::after,.researchButton_counter .pixelsBottom::before,.researchButton_counter .pixelsTop::after,.researchButton_counter .pixelsTop::before,.researchProgress .pixelsBottom::after,.researchProgress .pixelsBottom::before,.researchProgress .pixelsTop::after,.researchProgress .pixelsTop::before,.research_modal .item.researched .research_button .pixelsBottom::after,.research_modal .item.researched .research_button .pixelsBottom::before,.research_modal .item.researched .research_button .pixelsTop::after,.research_modal .item.researched .research_button .pixelsTop::before,.research_modal .item.unavailable .research_button .pixelsBottom::after,.research_modal .item.unavailable .research_button .pixelsBottom::before,.research_modal .item.unavailable .research_button .pixelsTop::after,.research_modal .item.unavailable .research_button .pixelsTop::before,.research_modal .pixelsBottom::after,.research_modal .pixelsBottom::before,.research_modal .pixelsTop::after,.research_modal .pixelsTop::before,.startMashing .pixelsBottom::after,.startMashing .pixelsBottom::before,.startMashing .pixelsTop::after,.startMashing .pixelsTop::before,.username .pixelsBottom::after,.username .pixelsBottom::before,.username .pixelsTop::after,.username .pixelsTop::before{display:block;content:"";position:absolute;width:3px;height:3px;top:0}.auto,.complete_modal,.endGame,.featured_modal,.intro_modal,.make,.mystats,.name_modal,.pen,.pen_css,.pen_design,.pen_html,.pen_js,.pip,.releasedEmpty,.released_pen__bottom,.released_pen__top,.researchProgress,.research_modal,.startMashing,.username{background:#f5f2ed;box-shadow:0 3px #e8e4dd,0 -3px #f5f2ed,3px 0 #f5f2ed,-3px 0 #f5f2ed,0 -6px #c8b8a6,0 6px #c8b8a6,6px 0 #c8b8a6,-6px 0 #c8b8a6,9px 0 rgba(0,0,0,.08),0 9px rgba(0,0,0,.08);position:relative;padding:12px}.achievementsButton .pixelsBottom,.auto .pixelsBottom,.complete_modal .pixelsBottom,.complete_modal .release .pixelsBottom,.complete_modal .scrap .pixelsBottom,.endGame .pixelsBottom,.endGame .restart .pixelsBottom,.endGame .share .pixelsBottom,.featured_modal .awesome .pixelsBottom,.featured_modal .pixelsBottom,.followButton .pixelsBottom,.followers .pixelsBottom,.intro_modal .go .pixelsBottom,.intro_modal .pixelsBottom,.make .pixelsBottom,.mystats .pixelsBottom,.name_modal .next .pixelsBottom,.name_modal .pixelsBottom,.pen .pixelsBottom,.pen_css .pixelsBottom,.pen_design .pixelsBottom,.pen_html .pixelsBottom,.pen_js .pixelsBottom,.pip .pixelsBottom,.releasedEmpty .pixelsBottom,.releasedHeader .pixelsBottom,.released_pen__bottom .pixelsBottom,.released_pen__top .pixelsBottom,.researchButton .pixelsBottom,.researchButton_counter .pixelsBottom,.researchProgress .pixelsBottom,.research_modal .close .pixelsBottom,.research_modal .item.researched .research_button .pixelsBottom,.research_modal .item.unavailable .research_button .pixelsBottom,.research_modal .pixelsBottom,.research_modal .research_button .pixelsBottom,.startMashing .pixelsBottom,.username .pixelsBottom{width:calc(100% + 12px);position:absolute;left:-6px;bottom:0}.auto .pixelsBottom::after,.complete_modal .pixelsBottom::after,.endGame .pixelsBottom::after,.featured_modal .pixelsBottom::after,.intro_modal .pixelsBottom::after,.make .pixelsBottom::after,.mystats .pixelsBottom::after,.name_modal .pixelsBottom::after,.pen .pixelsBottom::after,.pen_css .pixelsBottom::after,.pen_design .pixelsBottom::after,.pen_html .pixelsBottom::after,.pen_js .pixelsBottom::after,.pip .pixelsBottom::after,.releasedEmpty .pixelsBottom::after,.released_pen__bottom .pixelsBottom::after,.released_pen__top .pixelsBottom::after,.researchProgress .pixelsBottom::after,.research_modal .pixelsBottom::after,.startMashing .pixelsBottom::after,.username .pixelsBottom::after{right:3px;top:-3px;background:#e8e4dd;box-shadow:0 3px #c8b8a6,0 6px rgba(0,0,0,.08),3px 3px rgba(0,0,0,.08)}.auto .pixelsBottom::before,.complete_modal .pixelsBottom::before,.endGame .pixelsBottom::before,.featured_modal .pixelsBottom::before,.intro_modal .pixelsBottom::before,.make .pixelsBottom::before,.mystats .pixelsBottom::before,.name_modal .pixelsBottom::before,.pen .pixelsBottom::before,.pen_css .pixelsBottom::before,.pen_design .pixelsBottom::before,.pen_html .pixelsBottom::before,.pen_js .pixelsBottom::before,.pip .pixelsBottom::before,.releasedEmpty .pixelsBottom::before,.released_pen__bottom .pixelsBottom::before,.released_pen__top .pixelsBottom::before,.researchProgress .pixelsBottom::before,.research_modal .pixelsBottom::before,.startMashing .pixelsBottom::before,.username .pixelsBottom::before{left:3px;top:-3px;background:#e8e4dd;box-shadow:0 3px #c8b8a6,0 6px rgba(0,0,0,.08),-3px 3px rgba(0,0,0,.08)}.achievementsButton .pixelsTop,.auto .pixelsTop,.complete_modal .pixelsTop,.complete_modal .release .pixelsTop,.complete_modal .scrap .pixelsTop,.endGame .pixelsTop,.endGame .restart .pixelsTop,.endGame .share .pixelsTop,.featured_modal .awesome .pixelsTop,.featured_modal .pixelsTop,.followButton .pixelsTop,.followers .pixelsTop,.intro_modal .go .pixelsTop,.intro_modal .pixelsTop,.make .pixelsTop,.mystats .pixelsTop,.name_modal .next .pixelsTop,.name_modal .pixelsTop,.pen .pixelsTop,.pen_css .pixelsTop,.pen_design .pixelsTop,.pen_html .pixelsTop,.pen_js .pixelsTop,.pip .pixelsTop,.releasedEmpty .pixelsTop,.releasedHeader .pixelsTop,.released_pen__bottom .pixelsTop,.released_pen__top .pixelsTop,.researchButton .pixelsTop,.researchButton_counter .pixelsTop,.researchProgress .pixelsTop,.research_modal .close .pixelsTop,.research_modal .item.researched .research_button .pixelsTop,.research_modal .item.unavailable .research_button .pixelsTop,.research_modal .pixelsTop,.research_modal .research_button .pixelsTop,.startMashing .pixelsTop,.username .pixelsTop{width:calc(100% + 12px);position:absolute;left:-6px;top:-3px}.auto .pixelsTop::after,.complete_modal .pixelsTop::after,.endGame .pixelsTop::after,.featured_modal .pixelsTop::after,.intro_modal .pixelsTop::after,.make .pixelsTop::after,.mystats .pixelsTop::after,.name_modal .pixelsTop::after,.pen .pixelsTop::after,.pen_css .pixelsTop::after,.pen_design .pixelsTop::after,.pen_html .pixelsTop::after,.pen_js .pixelsTop::after,.pip .pixelsTop::after,.releasedEmpty .pixelsTop::after,.released_pen__bottom .pixelsTop::after,.released_pen__top .pixelsTop::after,.researchProgress .pixelsTop::after,.research_modal .pixelsTop::after,.startMashing .pixelsTop::after,.username .pixelsTop::after{right:3px;background:#c8b8a6}.auto .pixelsTop::before,.complete_modal .pixelsTop::before,.endGame .pixelsTop::before,.featured_modal .pixelsTop::before,.intro_modal .pixelsTop::before,.make .pixelsTop::before,.mystats .pixelsTop::before,.name_modal .pixelsTop::before,.pen .pixelsTop::before,.pen_css .pixelsTop::before,.pen_design .pixelsTop::before,.pen_html .pixelsTop::before,.pen_js .pixelsTop::before,.pip .pixelsTop::before,.releasedEmpty .pixelsTop::before,.released_pen__bottom .pixelsTop::before,.released_pen__top .pixelsTop::before,.researchProgress .pixelsTop::before,.research_modal .pixelsTop::before,.startMashing .pixelsTop::before,.username .pixelsTop::before{left:3px;background:#c8b8a6}.followers{background:#f39c12;box-shadow:0 3px #f5b043,0 -3px #f39c12,3px 0 #f39c12,-3px 0 #f39c12,0 -6px #d68910,0 6px #d68910,6px 0 #d68910,-6px 0 #d68910,9px 0 rgba(0,0,0,.08),0 9px rgba(0,0,0,.08)}.followers .pixelsBottom::after{right:3px;top:-3px;background:#f5b043;box-shadow:0 3px #d68910,0 6px rgba(0,0,0,.08),3px 3px rgba(0,0,0,.08)}.followers .pixelsBottom::before{left:3px;top:-3px;background:#f5b043;box-shadow:0 3px #d68910,0 6px rgba(0,0,0,.08),-3px 3px rgba(0,0,0,.08)}.followers .pixelsTop::after{right:3px;background:#d68910}.followers .pixelsTop::before{left:3px;background:#d68910}.complete_modal .release,.endGame .restart,.featured_modal .awesome,.intro_modal .go,.name_modal .next,.researchButton,.researchButton_counter,.research_modal .research_button{background:#6ab04c;box-shadow:0 3px #82c465,0 -3px #6ab04c,3px 0 #6ab04c,-3px 0 #6ab04c,0 -6px #5a9742,0 6px #5a9742,6px 0 #5a9742,-6px 0 #5a9742,9px 0 rgba(0,0,0,.08),0 9px rgba(0,0,0,.08);position:relative;padding:12px}.complete_modal .release .pixelsBottom::after,.endGame .restart .pixelsBottom::after,.featured_modal .awesome .pixelsBottom::after,.intro_modal .go .pixelsBottom::after,.name_modal .next .pixelsBottom::after,.researchButton .pixelsBottom::after,.researchButton_counter .pixelsBottom::after,.research_modal .research_button .pixelsBottom::after{right:3px;top:-3px;background:#82c465;box-shadow:0 3px #5a9742,0 6px rgba(0,0,0,.08),3px 3px rgba(0,0,0,.08)}.complete_modal .release .pixelsBottom::before,.endGame .restart .pixelsBottom::before,.featured_modal .awesome .pixelsBottom::before,.intro_modal .go .pixelsBottom::before,.name_modal .next .pixelsBottom::before,.researchButton .pixelsBottom::before,.researchButton_counter .pixelsBottom::before,.research_modal .research_button .pixelsBottom::before{left:3px;top:-3px;background:#82c465;box-shadow:0 3px #5a9742,0 6px rgba(0,0,0,.08),-3px 3px rgba(0,0,0,.08)}.complete_modal .release .pixelsTop::after,.endGame .restart .pixelsTop::after,.featured_modal .awesome .pixelsTop::after,.intro_modal .go .pixelsTop::after,.name_modal .next .pixelsTop::after,.researchButton .pixelsTop::after,.researchButton_counter .pixelsTop::after,.research_modal .research_button .pixelsTop::after{right:3px;background:#5a9742}.complete_modal .release .pixelsTop::before,.endGame .restart .pixelsTop::before,.featured_modal .awesome .pixelsTop::before,.intro_modal .go .pixelsTop::before,.name_modal .next .pixelsTop::before,.researchButton .pixelsTop::before,.researchButton_counter .pixelsTop::before,.research_modal .research_button .pixelsTop::before{left:3px;background:#5a9742}.complete_modal .scrap,.research_modal .close,.research_modal .item.unavailable .research_button{background:#e74c3c;box-shadow:0 3px #ec7063,0 -3px #e74c3c,3px 0 #e74c3c,-3px 0 #e74c3c,0 -6px #c44133,0 6px #c44133,6px 0 #c44133,-6px 0 #c44133,9px 0 rgba(0,0,0,.08),0 9px rgba(0,0,0,.08);position:relative;padding:12px}.complete_modal .scrap .pixelsBottom::after,.research_modal .close .pixelsBottom::after,.research_modal .item.unavailable .research_button .pixelsBottom::after{right:3px;top:-3px;background:#ec7063;box-shadow:0 3px #c44133,0 6px rgba(0,0,0,.08),3px 3px rgba(0,0,0,.08)}.complete_modal .scrap .pixelsBottom::before,.research_modal .close .pixelsBottom::before,.research_modal .item.unavailable .research_button .pixelsBottom::before{left:3px;top:-3px;background:#ec7063;box-shadow:0 3px #c44133,0 6px rgba(0,0,0,.08),-3px 3px rgba(0,0,0,.08)}.complete_modal .scrap .pixelsTop::after,.research_modal .close .pixelsTop::after,.research_modal .item.unavailable .research_button .pixelsTop::after{right:3px;background:#c44133}.complete_modal .scrap .pixelsTop::before,.research_modal .close .pixelsTop::before,.research_modal .item.unavailable .research_button .pixelsTop::before{left:3px;background:#c44133}.research_modal .item.researched .research_button{background:#bdc3c7;box-shadow:0 3px #cbd0d3,0 -3px #bdc3c7,3px 0 #bdc3c7,-3px 0 #bdc3c7,0 -6px #a8b0b5,0 6px #a8b0b5,6px 0 #a8b0b5,-6px 0 #a8b0b5,9px 0 rgba(0,0,0,.08),0 9px rgba(0,0,0,.08);position:relative;padding:12px}.research_modal .item.researched .research_button .pixelsBottom::after{right:3px;top:-3px;background:#cbd0d3;box-shadow:0 3px #a8b0b5,0 6px rgba(0,0,0,.08),3px 3px rgba(0,0,0,.08)}.research_modal .item.researched .research_button .pixelsBottom::before{left:3px;top:-3px;background:#cbd0d3;box-shadow:0 3px #a8b0b5,0 6px rgba(0,0,0,.08),-3px 3px rgba(0,0,0,.08)}.research_modal .item.researched .research_button .pixelsTop::after{right:3px;background:#a8b0b5}.research_modal .item.researched .research_button .pixelsTop::before{left:3px;background:#a8b0b5}.achievementsButton{background:#9b59b6;box-shadow:0 3px #af7cc7,0 -3px #9b59b6,3px 0 #9b59b6,-3px 0 #9b59b6,0 -6px #844aa1,0 6px #844aa1,6px 0 #844aa1,-6px 0 #844aa1,9px 0 rgba(0,0,0,.08),0 9px rgba(0,0,0,.08);padding:12px}.achievementsButton .pixelsBottom::after{right:3px;top:-3px;background:#af7cc7;box-shadow:0 3px #844aa1,0 6px rgba(0,0,0,.08),3px 3px rgba(0,0,0,.08)}.achievementsButton .pixelsBottom::before{left:3px;top:-3px;background:#af7cc7;box-shadow:0 3px #844aa1,0 6px rgba(0,0,0,.08),-3px 3px rgba(0,0,0,.08)}.achievementsButton .pixelsTop::after{right:3px;background:#844aa1}.achievementsButton .pixelsTop::before{left:3px;background:#844aa1}.followButton,.releasedHeader{background:#2c3e50;box-shadow:0 3px #34495e,0 -3px #2c3e50,3px 0 #2c3e50,-3px 0 #2c3e50,0 -6px #243342,0 6px #243342,6px 0 #243342,-6px 0 #243342,9px 0 rgba(0,0,0,.08),0 9px rgba(0,0,0,.08);padding:12px}.followButton .pixelsBottom::after,.releasedHeader .pixelsBottom::after{right:3px;top:-3px;background:#34495e;box-shadow:0 3px #243342,0 6px rgba(0,0,0,.08),3px 3px rgba(0,0,0,.08)}.followButton .pixelsBottom::before,.releasedHeader .pixelsBottom::before{left:3px;top:-3px;background:#34495e;box-shadow:0 3px #243342,0 6px rgba(0,0,0,.08),-3px 3px rgba(0,0,0,.08)}.followButton .pixelsTop::after,.releasedHeader .pixelsTop::after{right:3px;background:#243342}.followButton .pixelsTop::before,.releasedHeader .pixelsTop::before{left:3px;background:#243342}.endGame .share{background:#3498db;box-shadow:0 3px #5faee3,0 -3px #3498db,3px 0 #3498db,-3px 0 #3498db,0 -6px #2c81ba,0 6px #2c81ba,6px 0 #2c81ba,-6px 0 #2c81ba,9px 0 rgba(0,0,0,.08),0 9px rgba(0,0,0,.08);padding:12px}.endGame .share .pixelsBottom::after{right:3px;top:-3px;background:#5faee3;box-shadow:0 3px #2c81ba,0 6px rgba(0,0,0,.08),3px 3px rgba(0,0,0,.08)}.endGame .share .pixelsBottom::before{left:3px;top:-3px;background:#5faee3;box-shadow:0 3px #2c81ba,0 6px rgba(0,0,0,.08),-3px 3px rgba(0,0,0,.08)}.endGame .share .pixelsTop::after{right:3px;background:#2c81ba}.endGame .share .pixelsTop::before{left:3px;background:#2c81ba}.achievementsButton,.complete_modal .release,.complete_modal .scrap,.endGame .restart,.endGame .share,.featured_modal .awesome,.followButton,.intro_modal .go,.name_modal .next,.researchButton,.researchButton_counter,.research_modal .close,.research_modal .research_button{position:relative}.grain,.magic{position:fixed;left:0}.achievementsButton:active,.complete_modal .release:active,.complete_modal .scrap:active,.endGame .restart:active,.endGame .share:active,.featured_modal .awesome:active,.followButton:active,.intro_modal .go:active,.name_modal .next:active,.researchButton:active,.researchButton_counter:active,.research_modal .close:active,.research_modal .research_button:active{transform:translateY(2px)}.achievementsButton::after,.complete_modal .release::after,.complete_modal .scrap::after,.endGame .restart::after,.endGame .share::after,.featured_modal .awesome::after,.followButton::after,.intro_modal .go::after,.name_modal .next::after,.researchButton::after,.researchButton_counter::after,.research_modal .close::after,.research_modal .research_button::after{content:"";display:block;width:30px;-webkit-filter:blur(24px);background:rgba(255,255,255,.3);position:absolute;height:50px;transform:rotate(-30deg) skewy(31deg);color:#fff;top:-5px;right:100%;transition:.4s}.auto.off .tick,.auto.on .cross,.complete_modal div.hide,.magic,.research_modal .hide{display:none}.achievementsButton:hover::after,.complete_modal .release:hover::after,.complete_modal .scrap:hover::after,.endGame .restart:hover::after,.endGame .share:hover::after,.featured_modal .awesome:hover::after,.followButton:hover::after,.intro_modal .go:hover::after,.magic,.name_modal .next:hover::after,.researchButton:hover::after,.researchButton_counter:hover::after,.research_modal .close:hover::after,.research_modal .research_button:hover::after{right:0}.magic{margin:auto;top:50%;transform:translateY(-50%);z-index:10;height:100%;background:#000}.grain{top:0;z-index:4;pointer-events:none}.auto,.auto img,.startMashing{position:absolute}.swatch{box-shadow:inset 3px 0 rgba(18,12,12,.1),inset -3px 0 rgba(14,46,154,.3)!important;width:12px!important;height:11px}.mystats_html .swatch,.pen_html .swatch,.swatch.html{background:#e74c3c}.mystats_css .swatch,.pen_css .swatch,.swatch.css{background:#3498db}.mystats_js .swatch,.pen_js .swatch,.swatch.js{background:#f1c40f}.mystats_design .swatch,.pen_design .swatch,.swatch.design{background:#9b59b6}::-webkit-scrollbar{width:3px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#c8b8a6}.auto{text-align:left;bottom:-12px;height:6px;z-index:2;line-height:7px;left:0;right:-480px;margin:auto;cursor:pointer;width:80px}.auto img{width:15px;right:6px;top:7px}.auto.off .cross,.auto.on .tick{display:block}.startMashing{text-align:center;bottom:40px;height:160px;z-index:2;line-height:160px;left:0;right:0;margin:auto;width:500px}.startMashing h2{position:relative;top:-13px}.startMashing h2 img{width:20px;position:absolute;left:0;right:0;margin:auto;top:100px;-webkit-animation:.3s linear infinite key;animation:.3s linear infinite key}@-webkit-keyframes key{from{top:100px}to{top:102px}}@keyframes key{from{top:100px}to{top:102px}}.researchButton{width:203px;color:#f5f2ed;float:left;clear:left;margin-top:27px;cursor:pointer}.researchButton_counter{right:-20px;width:30px;color:#f5f2ed;float:left;text-align:center;clear:left;margin-top:27px;top:-55px;height:30px;line-height:31px;cursor:pointer;padding:0;position:absolute;z-index:1}.achievementsButton,.followButton{width:203px;float:left;margin-top:27px;cursor:pointer;clear:left}.achievementsButton img,.researchButton img{width:12px;position:absolute;top:18px;right:18px}.username{float:left;padding:8px 12px 0 10px;position:relative;top:30px}.username img{width:45px;position:absolute;left:-24px;top:-36px}.date img,.options_bg img{width:21px}.achievementsButton{display:none;color:#f5f2ed}.followButton{color:#f5f2ed}.floor,.overlay{left:0;width:100%}.date{float:right;position:absolute;right:40px;top:10px}.date img{position:relative;top:2px}.floor{background:#2c2c2c;position:fixed;bottom:0;height:36%;z-index:-1;border-top:30px solid #2c2c2c}.options{position:absolute;right:34px;top:81px}.options_sf img{width:18px;margin-right:10px}.options div{float:left;transition:1s;cursor:pointer}.overlay{position:fixed;top:0;cursor:pointer;height:100%;background:#0a0a0a;z-index:3;opacity:.9}.endGame,.researchProgress{left:0;top:50%;transform:translateY(-50%);display:none}.researchProgress{position:absolute;right:0;margin:auto;width:200px}.pen_bar,.researchProgress .bar{width:100%;height:6px;border-bottom:3px solid #c8b8a6;position:relative}.pen_bar_progress,.researchProgress .bar_inner{width:0%;height:6px;position:absolute;left:0;background:#f39c12;box-shadow:0 3px inset #f5b043}.endGame .restart,.endGame .share{width:170px;right:0;margin:auto;bottom:-26px;cursor:pointer}.researchProgress .bar_inner.animate{-webkit-animation:2s linear bar;animation:2s linear bar}@-webkit-keyframes bar{from{width:0%}to{width:100%}}@keyframes bar{from{width:0%}to{width:100%}}.endGame{text-align:center;width:600px;height:250px;position:absolute!important;z-index:3;right:0;margin:auto;padding:40px;text-align:ceter}.endGame .mostName,.endGame .mostViews{font-weight:700}.endGame hr{border:none;width:95%;border-top:3px solid #e8e4dd;margin-bottom:30px;box-shadow:0 3px rgba(0,0,0,.02);z-index:2;position:relative}.endGame h3,.intro_modal h3,.name_modal h3{text-align:center;font-weight:400;font-size:16px;margin:15px 24px 23px}.endGame h1{font-size:41px;margin-bottom:15px;color:#f39c12;margin-top:19px}.intro_modal hr,.name_modal hr,.research_modal hr{margin-bottom:-1px;box-shadow:0 3px rgba(0,0,0,.02);z-index:2}.endGame .restart{color:#f5f2ed;position:absolute;text-align:center;left:220px}.endGame .share{color:#f5f2ed;position:absolute;text-align:center;left:-240px}.complete_modal__header,.endGame__header,.featured_modal__header,.intro_modal__header,.name_modal__header,.research_modal__header{position:absolute;left:0;right:0;margin:auto;width:282px;top:-87px}.featured_modal,.intro_modal,.name_modal{width:600px;height:250px;z-index:3;top:50%;transform:translateY(-50%);padding:40px;position:absolute!important;right:0}.endGame__header p{position:absolute;width:100%;text-align:center;top:71px;color:#f5f2ed;left:4px}.endGame__header img{width:282px}.name_modal{transition:.5s;left:0;margin:auto;text-align:center}.name_modal hr,.research_modal hr{border:none;width:95%;border-top:3px solid #e8e4dd;position:relative}.intro_modal .text,.name_modal .text{margin:20px 0}.name_modal input{font-family:pixles;outline:0;text-align:center;padding:19px;width:360px;border-radius:5px;color:#2c3e50;margin-top:67px;border:3px solid #e8e4dd}.featured_modal .awesome,.intro_modal .go,.name_modal .next{color:#f5f2ed;position:absolute;bottom:-26px;width:140px;text-align:center;margin:auto;left:0;cursor:pointer;right:0}.name_modal__header p{position:absolute;width:100%;text-align:center;top:71px;color:#f5f2ed;left:4px}.name_modal__header img{width:282px}.intro_modal{left:200%;transition:.5s;margin:auto;text-align:center}.intro_modal hr{border:none;width:95%;border-top:3px solid #e8e4dd;position:relative}.intro_modal__header p{position:absolute;width:100%;text-align:center;top:71px;color:#f5f2ed;left:4px}.intro_modal__header img{width:282px}.featured_modal{display:none;left:0;margin:auto;text-align:left}.featured_modal h3{text-align:center;margin:24px}.featured_modal hr{border:none;border-top:3px solid #e8e4dd;margin-bottom:40px}.make,.research_modal .item:first-child{border:none}.featured_modal__header p{position:absolute;width:100%;text-align:center;top:71px;color:#f5f2ed;left:4px}.featured_modal__header img{width:282px}.featured_modal .name{color:#2c3e50}.featured_modal .picker{color:#f39c12}.featured_modal__text{padding-top:15px}.featured_modal__image{float:left;margin-right:30px}.complete_modal,.research_modal{display:none;transition:.7s;width:300px;margin:auto;top:50%;transform:translateY(-50%);z-index:3;left:0;text-align:center}.featured_modal__image img{width:198px}.research_modal{height:40px;position:absolute!important;right:0}.research_modal h3{text-align:center;margin:40px 24px 24px}.research_modal__header p{position:absolute;width:100%;text-align:center;top:67px;color:#f5f2ed;left:1px}.research_modal__header img{width:282px}.research_modal .close{color:#f5f2ed;cursor:pointer;position:absolute;right:-22px;top:-22px;width:10px;height:10px;z-index:3;line-height:11px}.research_modal::after{position:fixed;bottom:15px;left:0;width:98%;height:40px;display:block;background:-webkit-linear-gradient(top,rgba(245,242,237,0) 0,#f5f2ed 100%);content:""}.research_modal__list{padding:1px 20px 20px;overflow-y:scroll;height:288px;position:relative}.research_modal .item{float:left;clear:left;border-top:3px solid #e8e4dd;padding:24px 0 21px;width:95%;position:relative;left:11px}.complete_modal,.followers,.make{position:absolute!important}.research_modal .item.unavailable .research_button{color:#f5f2ed}.research_modal .item.researched::after{display:block;position:absolute;right:-16px;top:6px;content:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/217233/rTick.png)}.research_modal .item.researched .name,.research_modal .item.researched .stat{opacity:.45}.research_modal .item.researched .research_button{color:#7f8c8d}.research_modal .sep{margin:0 6px}.research_modal .name,.research_modal .stat{float:left}.research_modal .green{color:#6ab04c}.research_modal .stat img{width:6px;margin-left:4px}.research_modal .research_button{right:0;color:#f5f2ed;cursor:pointer;padding:4px!important;float:right;position:absolute!important;top:18px;width:150px}.research_modal .research_button img{width:10px;position:relative;left:-4px}.followers span,.research_modal .research_button .cost{color:#fff}.complete_modal{opacity:0;height:40px;right:0}.complete_modal .swatch{position:relative;left:49px;top:3px}.complete_modal__header p{position:absolute;width:100%;text-align:center;top:68px;color:#f5f2ed;left:1px}.complete_modal__header img{width:282px}.complete_modal .scrap{position:absolute;text-align:left;width:240px;bottom:-25px;color:#f5f2ed;cursor:pointer;left:30px}.complete_modal .scrap img{width:15px;float:right;position:relative;top:1px}.complete_modal hr{border:none;border-top:3px solid #e8e4dd;margin-bottom:20px;margin-top:22px;width:60%}.complete_modal h2{margin:20px 0 6px}.complete_modal .release{cursor:pointer;color:#f5f2ed;position:absolute;width:240px;right:30px;bottom:-25px}.complete_modal .release img{width:18px;float:right;position:relative;top:6px}.complete_modal h3{margin:30px 0}.make,img.m{margin:auto;right:0}.complete_modal__stats .css img,.complete_modal__stats .html img,.complete_modal__stats .js img{width:48px;margin-top:-5px}.complete_modal__stats .design img{width:36px;margin-top:-5px}.complete_modal__stats div{float:left;text-align:center;width:25%;box-shadow:inset -3px 0 #e8e4dd}.complete_modal__stats div:last-child{box-shadow:none}.complete_modal__stats div span{display:block;margin-top:17px;position:relative;left:4px}.make{left:0;width:200px;bottom:40px;cursor:pointer;outline:0}body{background:#1a1a1a;color:#2c3e50;margin:50px;overflow:hidden}img{image-rendering:auto;image-rendering:crisp-edges;-ms-interpolation-mode:nearest-neighbor;image-rendering:-moz-crisp-edges;image-rendering:pixelated}img.m{position:absolute;top:50%;left:-40px;transform:translateY(-50%);width:756px}.followers{color:#fff;float:right;transform:translateX(calc(100% + -3px));right:0;z-index:3;bottom:12px;padding:13px 50px!important}.followers img,.mystats img,.pen,.pip,.releasedEmpty{position:absolute}.followers img{width:42px;left:-25px;top:-18px;z-index:2}h2{margin:0 0 6px}body,button{font-family:pixles;text-transform:uppercase;font-size:16px;line-height:20px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.pen{height:52px}.pip,.sep{height:10px}.mystats{margin-top:110px;float:left;padding:30px;clear:left}.mystats img{width:45px;left:-24px;top:-24px;z-index:1}.mystats .pixelsBottom,.mystats .pixelsTop{width:calc(100% + -4px)}.mystats .swatch,.pen .swatch{width:12px;height:11px;top:3px;margin-right:-10px}.mystats .swatch{position:relative;left:-16px;padding:0;float:left}.mystats div{padding-left:16px}.mystats_css,.mystats_design,.mystats_html,.mystats_js{clear:left}.mystats h2{border-bottom:3px solid #c8b8a6;float:left;margin-bottom:16px}.mystats span.val{display:inline-block;position:relative;left:-8px;color:#2c3e50}.mystats span{color:#c8b8a6}p{margin:0}.pip{background:#f5f2ed;left:0;line-height:0;right:0;margin:auto;text-align:center;width:30px;padding:11px 7px 2px;top:50%}.sep{display:inline-block;width:2px;background:#c8b8a6}.releasedEmpty{clear:both;float:right;margin-top:249px;height:60px;line-height:61px;right:53px;width:303px}.pen{left:0;right:0;margin:auto;width:728px}.pen .swatch{position:relative;margin-left:2px;float:left}.pen_css,.pen_design,.pen_html,.pen_js{float:left;position:relative;top:18px;margin-right:27px;padding:3px;width:149px;left:13px;text-align:center}.releasedHeader{float:right;color:#f5f2ed;position:absolute;margin-top:195px;top:15px;right:60px}.releasedHeader img.icon{width:21px;top:4px;position:relative}.releasedHeader img.arrow{width:6px;top:0;position:relative}.released{clear:both;float:right;margin-top:228px;height:420px;overflow:scroll;padding:0 40px 20px 6px;position:relative;left:20px;width:310px;overflow-x:hidden;border-top:3px solid #c8b8a6}.released::after{display:block;content:"";position:fixed;right:0;top:641px;background:-webkit-linear-gradient(top,rgba(0,0,0,0) 10%,#2c2c2c 100%);width:390px;height:80px;z-index:2}.released_pen{transition:1s;float:left;clear:left;margin-top:17px;height:0}.released_pen__top{z-index:2;height:66px;padding:10px}.released_pen__bottom{height:20px;top:-72px;transition:1s;padding-top:30px;width:calc(100% - 48px);left:12px}.released_pen__bottom .sep{margin:0 9px}.released_pen__bottom img{margin-right:6px;position:relative}.released_pen__bottom img.views{width:21px;top:2px}.released_pen__bottom img.likes{width:15px;top:3px}.released_pen__bottom img.comments{width:18px;top:3px}.released_pen .star{position:absolute;right:10px;top:9px}.released_pen .star img{width:15px}.released_pen__graph{height:34px;position:relative;width:300px;border-left:3px solid #e8e4dd;border-bottom:3px solid #e8e4dd;margin:8px 0}.released_pen__graph .line{width:10px;height:40px;max-height:34px;float:left;position:relative;bottom:0;background:#f39c12}