<!-- 
GET OUT OF HERE!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░▄█▀▀▀▀▀▄▄░░░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░░░░░░░░░░░█▀░░░░░░░░░█░░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░░░░░░░░░░█░░░░░░░░░░░░▌░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░░░░░▄▄▄▄▄▌░░░░░░▄░░░░▐░░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░▄█▀▀░░░░░░░░░░▄█░░░░░█░░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░▄█▀▀██▀░░░░░░░░░░░░░█░░░░░░░░█░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░█▀░░░░░░░░░▄▄▄▄▄▄░░░▐▀░░░░░░░░░░█░░░░░░░░░░░░░░░░░░
░░░░░░░░░█░░░░░░░░░█▀░░░░░░░░░░░░░▀▀▀▀▀▀▄░░█░░░░░░░░░░░░░░░░░
░░░░░░░░░▌░░░░░░░░▐░░░░░░░░░░░░░░▌░░░░░░▐░░▐░░░░░░░░░░░░░░░░░
░░░░░░░░▐░░░░░░░░░▀░░░▄█▀▀▀▀▀█░░▐░░█░░░░░▌░░█░░░░░░░░░░░░░░░░
░░░░░░░░░▌░░░░░░░░░░░█░░░░░░░░█░░█░░░░░░▀░░░▐░░░░░░░░░░░░░░░░
░░░░░░░░░▀█░░░░░░░░░░▌░░▄░░░░░▐░░░▀▀▄▄█▀░░░░░▌░░░░░░░░░░░░░░░
░░░░░░░░░░░▀▀█▄▄▄░░░░▌░░▀░░░░░█░░░░░░░░░░░░░░▌░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░▐░░░░█░░░░░░░▄▌░░░░░░▄█░░░░░░▌░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░▐░░░░░▀█▄▄▄▄█░░░░░░░██▌░░░░░▐░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░█░░░░░░░░░░░░░░░░░░░░░░░░░█▀░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░▀█▄░░░░░░░░░░░░░░░░░░░▄█▀░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░░▀█▄▄▄░░░░░░░░░▄▄▄▀▀▀░░░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░░░░░░░▀▀▀▀▀▀█▀▀░░░░░░░░░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░█░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░░░░░░░░▄▄▄▄▄█▄▄▄▄▄▄░░░░░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░█░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░█░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░█░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░██░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░░░░░░░░░░░█░░█░░░░░░░░░░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░░░░░░░░░░█░░░░█░░░░░░░░░░░░░░░░░░░░░░░░░░░
░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
-->
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title> website this is my website </title>
    <link href="/style.css" rel="stylesheet" type="text/css" media="all">
 </head>
        <div id="container">
                <br>
                <center> <header> <img src="logogk2.gif" height="150"> </header> </center>   
            
        <marquee direction="left" behavior="scroll" scrollamount="10" onmouseover="this.stop();" onmouseout="this.start();">
            
<img src="transrights1.gif"/> 

<img src="haruokumurablinkiemadebyjennife_blu.gif" width="150px">
    
<img src="garfield.gif"/>
    
<img src="ilovecats.gif"/> 
    
<img src="https://jennifeblu.neocities.org/blinkiesCafe-xJ.gif"/>
        
<img src="legalizem.webp" width="150px"/> 

<img src="mycodewontwork.webp"/>
 
<img src="mikufan.webp"/>
        
<img src="fishyfishy.gif"/>
    
<img src="ilikefish.webp" width="150px">
            
        </marquee>

            <div id="flex">
                <aside>   
                    <center> <h3>current interests!</h3> </center>
                    <div class = "current-interests">
                    <img src="Persona-Famitsu-Cover.jpg" height="155px"> 
                    <img src="Chainsawman.jpg" height="155px">
                    <img src="scottpilgrimmovie.jpg" height="155px">
                    </div> 
                    
                    <br>
                    
                    <br> <a href="about-me!.html">
                    <center> <img src="About%20me!1.png" alt="about-me!.html" width="180" height="70"> </center>
                    </a> 
                    
                    <a href="https://jennifeblu.carrd.co/">
                    <center> <img src="link%20to%20my%20carrd!.png" alt="https://jennifeblu.carrd.co/" width="180" height="70"> </center>
                    </a>
                    
                    <a href="not_found.html">
                    <center> <img src="sitemapbutton.png" alt="not_found.html" width="180" height="70"> </center>
                    </a>
                    
                    <center> <img src='wallace.gif'> </center>
                    
                </aside>
                
                <main>
                    <center> <h1>welcome to my webiste</h1> </center>
                    <center> <p> 
                    if you on your period call me mose cause i'm about to split that red sea! </p> </center>
                    <center> <img src="mostwanted.png" alt="farted" width="600" height="360"> </center>
                    
                    <br><center> hi! I'm Jenni.  I don't know what to put here. </center>
                    
                    <br>
                    
                    <div class="wrapper"> 
                    
                    <div class="LEFT">
                        
                    <div class = "to-do" Style= 'background-color: black; width: 350px; height: 90px; padding: 20px; border: 5px solid #fe188c;'>
                    <center> <strong> to do list:  </strong> <br>
                    •My Scott Pilgrim shrine!<br> •Make a button! <br> •and other stuff! I wanna add more stuff to my website but I'm unsure. <br> • furnish the web graphics page <br> • my site map <br> • art page <br> ヽ（≧□≦）ノ</center>
                    </div> 
                        
                    <br><center> <img src= "paprika.gif" width="350"> </center>
                        
                    </div>
                    
                    <div class="RIGHT">
                        
                    <div class="fav-image" Style= 'background-color: black; width: 250px; padding-left: 25px; border: 5px;'> <center> <h3>My favourtie image of the however long I keep this up for</h3> </center>
                    <center> <img src="https://i.pinimg.com/564x/f1/0a/45/f10a458122fdcf45723a6c2713f73c97.jpg" alt="It is an image I've personally picked out whether I found it hilarious or amusing. 🧐🧐🧐 " height="165" style= 'border: 2px solid #fe188c'> </center></div>
                        
                    </div>
                        
                    </div>
                  
                </main>     
            </div>
                
    <div class="navi">
    <div class="links"> <a href="webgraphics.html"> web graphics</a></div> <img src="webgraphics.png" class="navi-image">
    </div>
        
    <div class="navi">
    <div class="links"> <a href="shrine%20dictionary.html"> shrine dictionary </a></div> <img src="shrine%20dictionary.png" class="navi-image">
    </div>
            
    <div class="navi">
    <div class="links"> <a href="not_found.html"> Art </a></div> <img src="art.png" class="navi-image">
    </div>
            
    <div class="navi">
    <div class="links"> <a href="https://web.archive.org/web/20250000000000*/https://jennifeblu.neocities.org/"> Archive </a></div> <img src="archive.png" class="navi-image">
    </div>
            

     <!-- navi-->  
    <style>
        
    .navi {
    position : relative;
    display: inline-block;
    margin-right: -4px;
        }
        
        .links {
        position: relative;
        z-index: 2;
        padding: 3px 9px;
        background-color: black;
        color: white;
        cursor: pointer;
        font-size: 16px;
        border: 5px solid #fe188c;
        }
        
        .navi-image{
        position: absolute;
        top: 100%;
        left: 0;
        width: 180px;
        height: auto;
        transform: translateY(-145%);
        transition: transform 0.4s ease-in-out;
        z-index: 1;
        }
        
        .navi:hover .navi-image {
            transform: translateY(0);
        }
    
    </style>
            
     <!-- font, boxes and stuff -->   
    <style>
        
        .wrapper{
            display: flex; 
            }
        
        .to-do{
        overflow-y: auto;
        }
        
        .current-interests {
            background-color: black;
            padding: 5px;
            height: 185px;
            overflow-x: auto; 
            overflow-y: hidden;
            white-space: nowrap;
            }
        
        .current-interests img { 
        vertical-align: top;
        display: inline-block;
        border: 2px solid #fe188c;
        }
        
        header {
        padding: 5px;
        }
        
            aside {
                z-index: 3;
                width: 200px;
                padding: 5px;
                font-size: smaller;
                border: 5px solid #fe188c;
                background-color: #000000;
            }

            main {
                z-index: 3;
                flex: 2;
                padding: 20px;
                order: 2;
                border: 5px solid #fe188c;
                width: calc(100% - 600px);
                padding: 20px;
                overflow-y: auto; 
                height: 600px; 
                background-color: #000000;

            }
            
        ::-webkit-scrollbar {
        width: 12px; /
        }

        ::-webkit-scrollbar-track {
        background: #000000; 
        }

        ::-webkit-scrollbar-thumb {
        background: #fe188c; 
        border-radius: 6px; 
        }

            
            @font-face {
            font-family: "PixelOperator"; 
            src: url("PixelOperator.ttf");
            }

            body {
                font-family: "PixelOperator";
                margin: 0;
                background-color: #000000;
                color: white;
            }
            
            

            
            * {
                box-sizing: border-box;
            }

            #container {
                max-width: 900px;
                margin: 0 auto;
                            
            }

            #flex {
                display: flex;
            }

            h1,
            h2,
            h3 {
                color: #fe188c;
            }

            h1 {
                font-size: 25px;
            }

            strong {
                color: #fe188c;
            }
            
            a:link, a:visited, a:hover, a:active  {
            font-family: "PixelOperator";
            margin: 0;
            color: #fe188c;
            }
            
            </style>
            
<style type="text/css">* {cursor: url(https://cur.cursors-4u.net/food/foo-5/foo472.cur), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2011/04/18/cosmopolitan-cocktail.html" target="_blank" title="Cosmopolitan Cocktail"><img src="https://cur.cursors-4u.net/cursor.png" border="0" alt="Cosmopolitan Cocktail" style="position:absolute; top: 0px; right: 0px;" /></a>