<!--  
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@////@
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@//////////////*////@
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@//////////////////@@
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@//////@@@@@@*////@@@
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@/////////////////////@@@@@@@@@@@/////@@@@@/,////@@@
@@@@@@@@@@@@@@@@@@@////*//////////////////////////@@@#*///@@@////@@@@@@@/////@@@
@@@@@@@@@@@@@@@@@@@@/,//////////@@@@@@@@@@@@,////@@@@**/@@@@/*///////////,////@@
@@@@@@@@@@@@/////@@@@@/*//@@@@@@@@@@@@@@@@@,,,//@@@@@@@@@@/,//////////////////@@
@@@@@@@@@@@///,////@@@@/,///@@@@@@@@@@@@@@@////@@@@@@@@@/,////@@@@@@@@@@@@@@@@@@
@@@@@@@@@@///,////////@@/*///@@@@@@@@@@@@@//*/@@@@@@@@**///@@@@@////@@@@@@@@@@@@
@@@@@@@@@///,//@@@//////@@/,///@@@@@@@@@@//,/@@@@@@/,////@@@@@@@//#@@@@@@@@@@@@@
@@@@@@@@///,//@@@@@@@/////@//*//@@@@@@@@////@@@@@,*///@@@@@@@@@@@@@@@@@@@@@@@@@@
@@@@@@@///,//@@@@@@@@@@///////,///@@@@@////@@@//////@@@@@@@@@@@@@@@@@@@@@@@@@@@@
@@@@@@///,//@@@@@@@@@@@@@//////,///@@@////@(/////@@@@@@@@@@@@#/////////@@@@@@@@@
@@@@@///,//@@@@@@@@@@@@@@@@@////////@//////////@@@@@@/////////,,,/,////@@@@@@@@@
@@@@///,//@@@@@@@@@@@@@@@@@@@@//////////////@//////////////@@@@@@*////@@@@@@@@@@
@@@///*//@@@@@@@@@@@@@@@///////////////////////////@@@@@@@@@@@@@@,////@@@@@@@@@@
@@/////////////////////////////////////////@@@@@@@@@@@@@@@@@@@@@/*///@@@@@@@@@@@
@@@////////@@@@@@@@@@//////////////////////////@@@@@@@@@@@@@@@@@,////@@@@@@@@@@@
@@@@@@@@@@@@@//,,/////////@@@@@@///,/////,/////////@@@@@@@@@@@@/,////@@@@@@@@@@@
@@@@@@//,,////////@@@@@@@@@@@@@////,//@@@@/,//////////@@@@@@@@@**///@@@@@@@@@@@@
@@@@///,////@@@@@@@@@@@@@@@@@@////////@@@@@@/,////@///////@@@@@,////@@@@@@@@@@@@
@@@@@@///**///@@@@@@@@@@@@@@@/////,///@@@@@@@@//,///@@/////////////@@@@@@@@@@@@@
@@@@@@@@#///,///@@@@@@@@@@@@//////,//@@@@@@@@@@@@/,///@@@@/////////@@@@@@@@@@@@@
@@@@@@@@@@@///*///@@@@@@@@@/////@////@@@@@@@@@@@@@@/,////@@@@@/////@@@@@@@@@@@@@
@@@@@@@@@@@@@////////@@@@@//,//@@,///@@@@@@@@@@@@@@@@//////@@@@@@@@@@@@@@@@@@@@@
@@@@@@@@@@@@@@@//////,/@@//,//@@/,//@@@@@@@@@@@@@@@//////////@@@@@@@@@@@@@@@@@@@
@@@@@@@@@@@@@@@@@@,//,,*//,//@@@/*//@@@@@@@//////////////////@@@@@@@@@@@@@@@@@@@
@@@@@@@@@@@@@@@@@@@,/////,//@@@@*///,,*///////////////@@@@@@@@@@@@@@@@@@@@@@@@@@
@@@@@@@@@@@@@@@@@@@@@@/////@@@@//////////////@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@//////@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@

 _______                       _      _        _______ _                             _                        
(_______)                     (_)    ( )      (_______|_)                           | |                       
 _______ _   _ ___   ____ ____ _ ____|/ ___    _____   _  ____ _____  ____ _____  __| |_____                  
|  ___  ( \ / ) _ \ / ___) ___) (____ |/___)  |  ___) | |/ ___) ___ |/ ___|____ |/ _  | ___ |                 
| |   | |) X ( |_| | |  ( (___| / ___ |___ |  | |     | | |   | ____( (___/ ___ ( (_| | ____|                 
|_|   |_(_/ \_)___/|_|   \____)_\_____(___/   |_|     |_|_|   |_____)\____)_____|\____|_____)                 
                                                                                                              
       _       _        _           _              ___                    _______         _                   
      (_)  _  | |      | |         | |            / __)                  (_______)       | |                  
 _ _ _ _ _| |_| |__    | |__  _____| | ____     _| |__ ____ ___  ____     _____ _   _  __| | ____ _____ _   _ 
| | | | (_   _)  _ \   |  _ \| ___ | ||  _ \   (_   __) ___) _ \|    \   |  ___) | | |/ _  |/ _  | ___ | | | |
| | | | | | |_| | | |  | | | | ____| || |_| |    | | | |  | |_| | | | |  | |   | |_| ( (_| ( (_| | ____| |_| |
 \___/|_|  \__)_| |_|  |_| |_|_____)\_)  __/     |_| |_|   \___/|_|_|_|  |_|   |____/ \____|\___ |_____)____/ 
                                      |_|                                                  (_____|  
                                      
                                                                                                     
                            ▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓                                                  
                            ███████████████▓▓▓▓▓▓▓▓▓▓▓▓▓▓                                            
                               ██████████████████▓▓▓▓▓▓▓▓▓▓▓▓                                        
                                 ████████████████████▓▓▓▓▓▓▓▓▓▓▓                                     
                                   █████████████████████▓▓▓▓▓▓▓▓▓▓▓                                  
                                     █████████████████████▓▓▓▓▓▓▓▓▓▓▓                                
         ▓▓                           ██████████████████████▓▓▓▓▓▓▓▓▓▓▓                              
        ▓▓▓▓                            ██████████████████████▓▓▓▓▓▓▓▓▓▓▓                 ███        
        █▓▓▓▓▓                           ███████████████████████▓▓▓▓▓▓▓▓▓▓▓           ███████        
       ██▓▓▓▓▓▓▓                         ████████████████████████▓▓▓▓▓▓▓▓▓▓▓       █████████         
       ███▓▓▓▓▓▓▓▓▓                       █████████████████████████▓▓▓▓▓▓▓▓▓▓▓  ████████████         
       ████▓▓▓▓▓▓▓▓▓▓▓▓▓                  ██████████████████████████▓▓▓▓▓▓▓▓▓██████████████          
      ██████▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓████████████████████████████▓▓▓▓▓████████████████          
      ████████▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓██████████████████████████████▓▓█████████████████           
       █████████▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓█████████████████████████████████████████████████            
       ███████████▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓██████████████████████████████████████████████████             
       ██████████████▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓████████████████████████████████████████████████████             
        █████████████████▓▓▓▓▓▓▓▓███████████████████████▓▓▓▓▓██████████████████████████              
         ██████████████████████████████████████████████▓▓▓▓▓▓▓▓███████████████████████               
          ████████████████████████████████████████████▓▓▓▓▓▓▓▓▓▓████████████████████▓▓▓              
           ██████████████████████████████████████████▓▓▓▓▓▓       █████████████████▓▓▓▓              
            ████████████████████████████████████████▓▓▓▓▓          ▒██████████████▓▓▓▓▓              
              ██████████████████████████████████████▓▓▓              ████████████▓▓▓▓▓▓              
  ▓             ████████████████████████████████████▓▓                ███████████▓▓▓▓▓▓              
  █▓               ████████████████████████████████▓▓▓                ░███████████▓▓▓▓▓              
   ██▓▓▓              ██████████████████████████████▓           ████   ▓██████████▓▓▓▓               
   ███▓▓▓▓▓▓▓▓           ██▓▓▓██████████████████████▓          █████    ███████████▓▓▓               
   █████▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓███████████████████████         █████      ██████████▓▓                
    ██████▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓█████████████████████████░       █████░      ██████████▓▓                
    ████████▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓███████████████████████████      ░████        ▓█████████▓                 
     ███████████▓▓▓▓▓▓▓▓███████████████████████████████     ████         ░█████████                  
      ██████████████████████████████████████████████████                 ░████████                   
        ██████████████████████████████████████████████████               ░███████                    
         ████████████████████████████████████████████████████░           ░█████                      
           █████████████████████████████████████████████████████████▓░   ░███                        
             ███████████████████████████████████████████████████████████████                         
               ████████████████████████████████████████████████████████████████                      
                 █████████████████████████████████████████████████████████████████                   
                    ███████████████████████    ██████████████████████████████   ███████              
                         ████████████               ███████████████████████       ███                
                                                                 ██                                  
                                                                                                                             
-->

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>The Firecade!</title>

    <link href="/style.css" rel="stylesheet" type="text/css" media="all">
    <script sec="https://code.jquery.com/jquery-1.11.0.min.js"></script>
    
    <link rel="apple-touch-icon" sizes="180x180" href="/imgs/favicon/apple-touch-icon.png">
    <link rel="icon" type="image/png" sizes="32x32" href="/imgs/favicon/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="/imgs/favicon/favicon-16x16.png">
    <link rel="manifest" href="/imgs/favicon/site.webmanifest">
    <link rel="mask-icon" href="/imgs/favicon/safari-pinned-tab.svg" color="#5bbad5">
    <meta name="apple-mobile-web-app-title" content="The Firecade">
    <meta name="application-name" content="The Firecade">
    <meta name="msapplication-TileColor" content="#001715">
    <meta name="theme-color" content="#001715">
    
  </head>
  
  
  <body>
    <div id="tower">
    
      <section id="roof" class="notStick">
        <div class="roomContainer skyBKG">
          <div id="fworkCont">
            <script type="text/javascript">
            // <![CDATA[
            var bits=80; // how many bits
            var speed=30; // how fast - smaller is faster
            var bangs=5; // how many can be launched simultaneously (note that using too many can slow the script down)
            var colours=new Array("#3d00ff", "#ff2151", "#af85ff", "#39c5bb", "#ff1098", "#573dff"); 
            //                     blue        red        purple     cyan       pink    bright purp
            
            /****************************
            *      Fireworks Effect     *
            *(c)2004-14 mf2fm web-design*
            *  http://www.mf2fm.com/rv  *
            * DON'T EDIT BELOW THIS BOX *
            ****************************/
            var bangheight=new Array();
            var intensity=new Array();
            var colour=new Array();
            var Xpos=new Array();
            var Ypos=new Array();
            var dX=new Array();
            var dY=new Array();
            var stars=new Array();
            var decay=new Array();
            var swide=800;
            var shigh=600;
            var boddie;
            
            if (typeof('addRVLoadEvent')!='function') function addRVLoadEvent(funky) {
              var oldonload=window.onload;
              if (typeof(oldonload)!='function') window.onload=funky;
              else window.onload=function() {
                if (oldonload) oldonload();
                funky();
              }
            }
            
            addRVLoadEvent(light_blue_touchpaper);
            
            function light_blue_touchpaper() { if (document.getElementById) {
              var i;
              boddie=document.getElementById("fworkCont");
              set_width();
              for (i=0; i<bangs; i++) {
                write_fire(i);
                launch(i);
                setInterval('stepthrough('+i+')', speed);
              }
            }}
            
            function write_fire(N) {
              var i, rlef, rdow;
              stars[N+'r']=createDiv('|', 12);
              boddie.appendChild(stars[N+'r']);
              for (i=bits*N; i<bits+bits*N; i++) {
                stars[i]=createDiv('*', 13);
                boddie.appendChild(stars[i]);
              }
            }
            
            function createDiv(char, size) {
              var div=document.createElement("div");
              div.style.font=size+"px monospace";
              div.style.position="fixed";
              div.style.backgroundColor="transparent";
              div.appendChild(document.createTextNode(char));
              return (div);
            }
            
            function launch(N) {
              colour[N]=Math.floor(Math.random()*colours.length);
              Xpos[N+"r"]=swide*0.5;
              Ypos[N+"r"]=shigh-5-200;
              bangheight[N]=Math.round((0.5+Math.random())*shigh*0.4);
              dX[N+"r"]=(Math.random()-0.5)*swide/bangheight[N];
              if (dX[N+"r"]>1.25) stars[N+"r"].firstChild.nodeValue="/";
              else if (dX[N+"r"]<-1.25) stars[N+"r"].firstChild.nodeValue="\\";
              else stars[N+"r"].firstChild.nodeValue="|";
              stars[N+"r"].style.color=colours[colour[N]];
            }
            
            function bang(N) {
              var i, Z, A=0;
              for (i=bits*N; i<bits+bits*N; i++) { 
                Z=stars[i].style;
                Z.left=Xpos[i]+"px";
                Z.top=Ypos[i]+"px";
                if (decay[i]) decay[i]--;
                else A++;
                if (decay[i]==15) Z.fontSize="7px";
                else if (decay[i]==7) Z.fontSize="2px";
                else if (decay[i]==1) Z.visibility="hidden";
            	if (decay[i]>1 && Math.random()<.1) {
            	   Z.visibility="hidden";
            	   setTimeout('stars['+i+'].style.visibility="visible"', speed-1);
            	}
                Xpos[i]+=dX[i];
                Ypos[i]+=(dY[i]+=1.25/intensity[N]);
            
              }
              if (A!=bits) setTimeout("bang("+N+")", speed);
            }
            
            function stepthrough(N) { 
              var i, M, Z;
              var oldx=Xpos[N+"r"];
              var oldy=Ypos[N+"r"];
              Xpos[N+"r"]+=dX[N+"r"];
              Ypos[N+"r"]-=4;
              if (Ypos[N+"r"]<bangheight[N]) {
                M=Math.floor(Math.random()*3*colours.length);
                intensity[N]=5+Math.random()*4;
                for (i=N*bits; i<bits+bits*N; i++) {
                  Xpos[i]=Xpos[N+"r"];
                  Ypos[i]=Ypos[N+"r"];
                  dY[i]=(Math.random()-0.5)*intensity[N];
                  dX[i]=(Math.random()-0.5)*(intensity[N]-Math.abs(dY[i]))*1.25;
                  decay[i]=16+Math.floor(Math.random()*16);
                  Z=stars[i];
                  if (M<colours.length) Z.style.color=colours[i%2?colour[N]:M];
                  else if (M<2*colours.length) Z.style.color=colours[colour[N]];
                  else Z.style.color=colours[i%colours.length];
                  Z.style.fontSize="13px";
                  Z.style.visibility="visible";
                }
                bang(N);
                launch(N);
              }
              stars[N+"r"].style.left=oldx+"px";
              stars[N+"r"].style.top=oldy+"px";
            } 
            
            window.onresize=set_width;
            function set_width() {
              var sw_min=999999;
              var sh_min=999999;
              if (document.documentElement && document.documentElement.clientWidth) {
                if (document.documentElement.clientWidth>0) sw_min=document.documentElement.clientWidth;
                if (document.documentElement.clientHeight>0) sh_min=document.documentElement.clientHeight;
              }
              if (typeof(self.innerWidth)!="undefined" && self.innerWidth) {
                if (self.innerWidth>0 && self.innerWidth<sw_min) sw_min=self.innerWidth;
                if (self.innerHeight>0 && self.innerHeight<sh_min) sh_min=self.innerHeight;
              }
              if (document.body.clientWidth) {
                if (document.body.clientWidth>0 && document.body.clientWidth<sw_min) sw_min=document.body.clientWidth;
                if (document.body.clientHeight>0 && document.body.clientHeight<sh_min) sh_min=document.body.clientHeight;
              }
              if (sw_min==999999 || sh_min==999999) {
                sw_min=800;
                sh_min=600;
              }
              swide=sw_min;
              shigh=sh_min;
            }
            // ]]>
            </script>
          </div>
          <div class="botWall"></div>
        </div>
        

      </section>
      
      
      <section id="bossOffice" class="notStick">
        <div class="roomContainer">
          <div class="centerWall"></div>
          <div class="topWall"></div>
          <div class="leftWall">
          
            <svg version="1.1" id="Layer_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 641 805.733" style="enable-background:new 0 0 641 805.733; position:absolute; width:100%; bottom:0px;" xml:space="preserve">
          
              <style type="text/css">
              	.st1{fill:blue; opacity:0;}
              </style>
              <image style="overflow:visible;" width="1144" height="1438" xlink:href="/imgs/ele_w_butts.png"  transform="matrix(0.5603 0 0 0.5603 0 0)">
              </image>
              
              <a onclick="transFloor('#roof')"> 
              	<polygon class="st1" points="0,355.333 30.111,279.719 60.222,355.222"/>
              </a>
              <a onclick="transFloor('#bbbGarden')">
              	<polygon class="st1" points="0,388.889 30.111,464.503 60.222,389"/>
              </a>
              <a onclick="transFloor('#lobby')">
              	<polygon class="st1" points="565.667,283.833 575.833,283.833 607.833,328.5 639.833,421.167 629.333,460.167 618.5,460.167 
              		597.5,423 585.833,389.667 565.667,322.667"/>


              </a>
            </svg>
          
          </div>
          <div class="rightWall"></div>
          <div class="botWall"></div>
        </div>
      </section>
      

      <section id="bbbGarden" class="notStick">
      
        <div class="roomContainer" id="bbb">
          <div class="centerWall"></div>
          <div class="topWall"></div>
          <div class="leftWall">
          
            <svg version="1.1" id="Layer_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 641 805.733" style="enable-background:new 0 0 641 805.733; position:absolute; width:100%; bottom:0px;" xml:space="preserve">
          
              <style type="text/css">
              	.st1{fill:blue; opacity:0;}
              </style>
              <image style="overflow:visible;" width="1144" height="1438" xlink:href="/imgs/ele_w_butts.png"  transform="matrix(0.5603 0 0 0.5603 0 0)">
              </image>
              
              <a onclick="transFloor('#bossOffice')">
              	<polygon class="st1" points="0,355.333 30.111,279.719 60.222,355.222"/>
              </a>
              <a onclick="transFloor('#dreamLand')">
              	<polygon class="st1" points="0,388.889 30.111,464.503 60.222,389"/>
              </a>
              <a onclick="transFloor('#lobby')">
              	<polygon class="st1" points="565.667,283.833 575.833,283.833 607.833,328.5 639.833,421.167 629.333,460.167 618.5,460.167 
              		597.5,423 585.833,389.667 565.667,322.667"/>
              </a>
            </svg>
          
          </div>
          <div class="rightWall"></div>
          <div class="botWall"></div>
          <div class="toRightButt" onclick="goRight()">
            <img src="/imgs/to_right_arrow.png" alt="arrow pointing to the right">
          </div>
        </div>
        
        <div class="roomContainer secondRoom" id="garden">
          <div class="centerWall"></div>
          <div class="topWall"></div>
          <div class="leftWall"></div>
          <div class="rightWall"></div>
          <div class="botWall"></div>
          <div class="toLeftButt" onclick="goLeft()">
            <img src="/imgs/to_left_arrow.png" alt="arrow pointing to the left">
          </div>
        </div>
        
      </section>
      
      
      <section id="dreamLand" class="notStick">
        <div class="roomContainer">
          <div class="centerWall">
            <h1><br/><br/>dreams go here, maybe like an oekaki board or somethin</h1>
          </div>
          <div class="topWall"></div>
          <div class="leftWall">
          
            <svg version="1.1" id="Layer_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 641 805.733" style="enable-background:new 0 0 641 805.733; position:absolute; width:100%; bottom:0px;" xml:space="preserve">
          
              <style type="text/css">
              	.st1{fill:blue; opacity:0;}
              </style>
              <image style="overflow:visible;" width="1144" height="1438" xlink:href="/imgs/ele_w_butts.png"  transform="matrix(0.5603 0 0 0.5603 0 0)">
              </image>
              
              <a onclick="transFloor('#bbbGarden')">
              	<polygon class="st1" points="0,355.333 30.111,279.719 60.222,355.222"/>
              </a>
              <a onclick="transFloor('#stickies')">
              	<polygon class="st1" points="0,388.889 30.111,464.503 60.222,389"/>
              </a>
              <a onclick="transFloor('#lobby')">
              	<polygon class="st1" points="565.667,283.833 575.833,283.833 607.833,328.5 639.833,421.167 629.333,460.167 618.5,460.167 
              		597.5,423 585.833,389.667 565.667,322.667"/>
              </a>
            </svg>
          
          </div>
          <div class="rightWall"></div>
          <div class="botWall"></div>
        </div>
      </section>
      
      
      <section id="stickies">
        <div class="roomContainer">
          <div class="centerWall">
            <h1><br/><br/>stickie table for blog posts or something idk</h1>
          </div>
          <div class="topWall"></div>
          <div class="leftWall">
          
            <!-- ELEVATOR -->
            <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 641 805.733" style="enable-background:new 0 0 641 805.733; position:absolute; width:100%; bottom:0px;" xml:space="preserve">
          
              <style type="text/css">
              	.st1{fill:blue; opacity:0;}
              </style>
              <image style="overflow:visible;" width="1144" height="1438" xlink:href="/imgs/ele_w_butts.png"  transform="matrix(0.5603 0 0 0.5603 0 0)">
              </image>
              
              <a onclick="transFloor('#dreamLand')">
              	<polygon class="st1" points="0,355.333 30.111,279.719 60.222,355.222"/>
              </a>
              <a onclick="transFloor('#lobby')">
              	<polygon class="st1" points="0,388.889 30.111,464.503 60.222,389"/>
              </a>
              <a onclick="transFloor('#lobby')">
              	<polygon class="st1" points="565.667,283.833 575.833,283.833 607.833,328.5 639.833,421.167 629.333,460.167 618.5,460.167 
              		597.5,423 585.833,389.667 565.667,322.667"/>
              </a>
            </svg>
          
          </div>
          <div class="rightWall"></div>
          <div class="botWall"></div>
          
          <!-- TABLE -->
          <svg version="1.1" id="slayer1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 435 785" style="enable-background:new 0 0 435 785; position:absolute; bottom:20px; left:50vw; height:35vh;" xml:space="preserve">
	 
            <style type="text/css">
            	.st0{fill:blue; opacity:0;}
            </style>
            
            <image style="overflow:visible;enable-background:new;" width="435" height="785" xlink:href="/imgs/stickie_table.png" >
            </image>
            
            <a id="stickieNot" onclick="zooom();">
            	<polygon class="st0" points="184,167 282.667,164.333 282.667,152.667 273,140.333 273.333,98.667 298.333,92 298.333,48 
            		271.678,36.051 289.667,3.667 186,0 163.333,41.333 163.333,76.333 147.333,97 147.333,104.667 159,143 	"/>
            </a>
          </svg>
          
        </div>
      </section>
      
      
      <div class="pipes notStick"></div>
      
      
      <section id="lobby" class="notStick">
        <div class="roomContainer">
        
          <div class="centerWall">
            <h1><br/><br/>wip also slight hiatus on updates while i do schoolwork
            <br/><br/>
            TO DO LIST
            <ul>
            <li> make this list </li>
            <li> drag n drop trash can stickies </li>
            <li> guestbook stickies </li>
            <li> newspaper blog iframe -> andou site inspo </li>
            <li> draw lil rooftop elevator </li>
            <li> elevator </li>
            <li> draw a fireworks launcher </li>
            <li> quake </li>
            <li> lisa frank room </li>
            </ul>
            </h1>
          </div>
          <div class="topWall"></div>
          <div class="leftWall">
  
            <div class="mapTitle">
              <img src="/imgs/arcade_map_word.png" alt="graphic saying: ARCADE MAP">
            </div>
            
            <nav>
              <div class="mapButton">
                <button class="buttonClass" onclick="transFloor('#roof')">Rooftop</button>
                <button class="buttonClass" onclick="transFloor('#bossOffice')">Boss's Office</button>
                <button class="buttonClass" onclick="transFloor('#bbbGarden')">BBB N' Garden</button>
                <button class="buttonClass" onclick="transFloor('#dreamLand')">DreamLand</button>
                <button class="buttonClass" onclick="transFloor('#stickies')">TFAITTHOASD</button>
                <button class="buttonClass">Lobby</button>
                <button class="buttonClass" onclick="transFloor('#newsMap')">Updates N' Map</button>
                <button class="buttonClass">Game Floor</button>
                <button class="buttonClass">Gallery</button>
                <button class="buttonClass">Theater</button>
                <button class="buttonClass">Shrines</button>
                <button class="buttonClass" onclick="transFloor('#chair')">Reflection Chair</button>
              </div>
            </nav>
            
            
          </div>
          <div class="rightWall"></div>
          <div class="botWall"></div>
          <div class="signboard">
            <img src="/imgs/firecade_sign_board.png" alt="Signboard reading: The Firecade">

          </div>
          
        </div>
      </section>
      
      
      <div class="pipesNot notStick">
        <img style="margin-left: 1%;" src="/imgs/pipe_skull.png">
        <img style="margin-left: 80%;" src="/imgs/pipe_bun.gif">
      </div>
      
      
      <section id="newsMap" class="notStick">
      
        <div class="roomContainer">
          <div class="centerWall"><h1>News on right<br/>map center wall</h1></div>
          <div class="topWall"></div>
          <div class="leftWall">
          
            <svg version="1.1" id="Layer_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 641 805.733" style="enable-background:new 0 0 641 805.733; position:absolute; width:calc(100% - 20px); bottom:0px; left:10px;" xml:space="preserve">
          
              <style type="text/css">
              	.st1{fill:blue; opacity:0;}
              </style>
              <image style="overflow:visible;" width="1144" height="1438" xlink:href="/imgs/ele_w_butts.png"  transform="matrix(0.5603 0 0 0.5603 0 0)">
              </image>
              
              <a onclick="transFloor('#lobby')">
              	<polygon class="st1" points="0,355.333 30.111,279.719 60.222,355.222"/>
              </a>
              <a onclick="transFloor('#gallery')">
              	<polygon class="st1" points="0,388.889 30.111,464.503 60.222,389"/>
              </a>
              <a onclick="transFloor('#lobby')">
              	<polygon class="st1" points="565.667,283.833 575.833,283.833 607.833,328.5 639.833,421.167 629.333,460.167 618.5,460.167 
              		597.5,423 585.833,389.667 565.667,322.667"/>
              </a>
            </svg>
          
          </div>
          <div class="rightWall"></div>
          <div class="botWall"></div>

        </div>
        
      </section>
      
      
      <section id="gallery" class="notStick">
      
        <div class="roomContainer">
          <div class="centerWall"></div>
          <div class="topWall"></div>
          <div class="leftWall">
          
            <svg version="1.1" id="Layer_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 641 805.733" style="enable-background:new 0 0 641 805.733; position:absolute; width:100%; bottom:0px;" xml:space="preserve">
          
              <style type="text/css">
              	.st1{fill:blue; opacity:0;}
              </style>
              <image style="overflow:visible;" width="1144" height="1438" xlink:href="/imgs/ele_w_butts.png"  transform="matrix(0.5603 0 0 0.5603 0 0)">
              </image>
              
              <a onclick="transFloor('#newsMap')"> 
              	<polygon class="st1" points="0,355.333 30.111,279.719 60.222,355.222"/>
              </a>
              <a onclick="transFloor('#chair')">
              	<polygon class="st1" points="0,388.889 30.111,464.503 60.222,389"/>
              </a>
              <a onclick="transFloor('#lobby')">
              	<polygon class="st1" points="565.667,283.833 575.833,283.833 607.833,328.5 639.833,421.167 629.333,460.167 618.5,460.167 
              		597.5,423 585.833,389.667 565.667,322.667"/>
              </a>
            </svg>
          
          </div>
          <div class="rightWall"></div>
          <div class="botWall"></div>
        </div>
      </section>

      
      <section id="chair" class="notStick">
      
        <div class="roomContainer blackBKG">
          <div class="centerWall"><h1>Criminals Sit In The Chair</h1></div>
          <div class="topWall"></div>
          <div class="leftWall"></div>
          <div class="rightWall"></div>
          <div class="botWall"></div>
          <a href="/shhh"><img src="https://cdn.discordapp.com/attachments/714903773478125630/1158574526657994842/Froggy_Chair_PG_Model.png" style="position:absolute; height:50vh; bottom:0px; left:25%"></a>
          

        </div>
        
      </section>
      
      
    </div>
      
      
    <!--            SCROPTS LOL         -->  
    <script type="text/javascript"> 
    
    
      function goRight(){
        document.getElementById("bbb").style.transform="translateX(-100vw)"
        document.getElementById("garden").style.transform="translateX(0)"
      }
      function goLeft(){
        document.getElementById("bbb").style.transform="translateX(0)"
        document.getElementById("garden").style.transform="translateX(100vw)"
      }
      
      function transFloor(link){
        document.documentElement.style.scrollBehavior="smooth"
        window.location.replace(link)
        setTimeout(()=>{document.documentElement.style.scrollBehavior="unset"},1500) 
      }
      
      function zooom(){
        
        var audio = new Audio("https://cdn.discordapp.com/attachments/1149876350346334228/1162199169889468556/papers-tossed-into-air-falling-1wav-14545.mp3")
        audio.play()
        const boxes = document.querySelectorAll(".notStick")
        boxes.forEach(box =>{box.style.display="none"})
        var element= document.getElementById("stickieNot")
        var rect = element.getBoundingClientRect();
        var stickies = document.getElementById("stickies")
        stickies.style.position = "fixed"
        stickies.style.left = "0"
        stickies.style.top = "0"
        stickies.style.opacity = "0"
        var scale = 2.5;
        var containerRect = stickies.getBoundingClientRect();
        var stickieCenterH = (rect.left + rect.right) / 2
        var stickieCenterV = (rect.top + rect.bottom) / 2
        var centerContainerH = containerRect.right / 2
        var centerContainerV = containerRect.bottom / 2
        var deltaX = centerContainerH - stickieCenterH
        var deltaY = centerContainerV - stickieCenterV
        deltaX *= scale;
        deltaY *= scale;
        stickies.style.transform="translate(" + deltaX + "px, " + deltaY + "px) scale(" + scale + ")"
        setTimeout(() =>{window.location.href="/stickie/index.html"}, 500)
        
        
      }
      
      
    </script>  
      
  </body>
</html>