Goofing off since 2004! || On the World Wide Web, in pixelated form best suited for the human eyeballs--no work, all play!

My Rings!

Name: goobert
Adopt one yourself! @Pokémon Orphanage

my jam!!

Under Your Spell

scrollbox

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique tellus arcu, nec pulvinar dolor pretium in. Nulla ac volutpat tortor. Mauris elementum augue vel massa sagittis aliquam.

Curabitur convallis rhoncus orci, et luctus erat aliquam et. In hac habitasse platea dictumst. In egestas turpis nisl, vel mollis purus porta vel. In hac habitasse platea dictumst. Nulla ac volutpat tortor. Mauris elementum augue vel massa sagittis aliquam.

title here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique tellus arcu, nec pulvinar dolor pretium in. Integer nec rhoncus risus.

title here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique tellus arcu, nec pulvinar dolor pretium in. Nulla ac volutpat tortor. Mauris elementum augue vel massa sagittis aliquam.

GREETINGS!!! Welcome to 39nfdc, a repurposed site for my journaling, art, and journies through life. Keeping a diary is good for you!! The theming for this site revolves around iMacs (specifically a tangerine iMac G3 I post from!) dogs and webcore. All things I love! :)

title here

YOU ARE VISITOR NUMBER

the code

<!DOCTYPE html><html><head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>itinerae : greyscale</title>
<link rel="shortcut icon" href="https://files.catbox.moe/rshw42.png"> 
<link href="//fonts.googleapis.com/css?family=Megrim%7CLato" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css2?family=Silkscreen:wght@400;700&display=swap" rel="stylesheet">

b {color:#444;font-weight:bold;}
      i {font-style:italic;color:#aaa;}
      u {color:#888;text-decoration:underline;}
  
  img {border:0;}
  textarea {font:9px 'lato', verdana;letter-spacing:1px;}

::-webkit-scrollbar {
    width: 16px;
    height: 16px;}

::-webkit-scrollbar-track {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAAFElEQVQIW2M4fPz0////GYAYyAIASnoKpV3w4kgAAAAASUVORK5CYII=");
    image-rendering: pixelated;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);}

::-webkit-scrollbar-track:active {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAAEElEQVQIW2No6+pjgAAgCwAWogM9VKrgGQAAAABJRU5ErkJggg==");
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);}

::-webkit-scrollbar-thumb {
    border-top: 1px solid #cccccc;
    border-left: 1px solid #cccccc;
    border-right: 1px solid black;
    border-bottom: 1px solid black;
    box-shadow: inset 1px 1px 0 0 white, inset -1px -1px 0 0 #868a8e;
    width: 16px;
    height: 16px;
    background-color: #cccccc;
    z-index: 1;}

::-webkit-scrollbar-corner {
    background-color: #cccccc;}

::-webkit-resizer {
    width: 16px;
    height: 16px;
    background-color: #cccccc;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAN0lEQVR4Ae3MgQUAMBRDwU5fFF05lb/CARTBw2Ulof0DxPtcwp3hNuEYnjbcEW4TjuFpwx3h9gMWGgZ2Y/PT2gAAAABJRU5ErkJggg==");
    background-position: bottom right;
    background-repeat: no-repeat;
    image-rendering: pixelated;}

::-webkit-scrollbar-button,
  ::-webkit-scrollbar-button {
    border-top: 1px solid #cccccc;
    border-left: 1px solid #cccccc;
    border-right: 1px solid black;
    border-bottom: 1px solid black;
    box-shadow: inset 1px 1px 0 0 white, inset -1px -1px 0 0 #868a8e;
    display: block;
    width: 16px;
    height: 16px;
    background-color: #cccccc;
    image-rendering: pixelated;
    background-repeat: no-repeat;
    background-position: center center;}

::-webkit-scrollbar-button:active,
  ::-webkit-scrollbar-button:active {
    background-position: 2px 2px;}

::-webkit-scrollbar-button:horizontal:decrement,
  ::-webkit-scrollbar-button:horizontal:decrement {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAQAAAD8fJRsAAAAHklEQVQY02NgoBT8xyX8H5fwf1zCpOjAYwceV1EEAAO2D/HsQ4vsAAAAAElFTkSuQmCC");}

::-webkit-scrollbar-button:horizontal:increment,
  ::-webkit-scrollbar-button:horizontal:increment {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAQAAAD8fJRsAAAAHUlEQVQY02NgIB/8xy3xH7fEf9wS/0nUQZqrKAYAK44P8ZRmzLQAAAAASUVORK5CYII=");}

::-webkit-scrollbar-button:vertical:decrement,
  ::-webkit-scrollbar-button:vertical:decrement {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGklEQVR4AWMYxuA/SYphmETFhDX9x4mHGQAAcL4P8dQiMq8AAAAASUVORK5CYII=");}

::-webkit-scrollbar-button:vertical:increment,
  ::-webkit-scrollbar-button:vertical:increment {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAQAAAD8fJRsAAAAF0lEQVQY02NgoBf4jwJxSOHQhcNAOgMAWWAP8Rv2U3UAAAAASUVORK5CYII=");}

::-webkit-scrollbar-button:horizontal:increment:start,
  ::-webkit-scrollbar-button:horizontal:increment:start {
    display: none;}

::-webkit-scrollbar-button:horizontal:decrement:end,
  ::-webkit-scrollbar-button:horizontal:decrement:end {
    display: none;}

::-webkit-scrollbar-button:vertical:increment:start,
  ::-webkit-scrollbar-button:vertical:increment:start {
    display: none;}

::-webkit-scrollbar-button:vertical:decrement:end,
  ::-webkit-scrollbar-button:vertical:decrement:end {
    display: none;}

::-webkit-scrollbar-button:active,
  ::-webkit-scrollbar-button:active {
    border-top: 1px solid #868a8e;
    border-left: 1px solid #868a8e;
    border-bottom: 1px solid #868a8e;
    border-right: 1px solid #868a8e;
    box-shadow: none;}
  
   
.header {background:#aaa url();color:#BCACCC;text-align:center;border-top-right-radius:30px;border-top-left-radius:30px;border:2px solid #444;border-bottom:0px;}

.header a {font-family: 'sysfont', monospace;font-size:20px;text-decoration:underline;color:#fff;letter-spacing:3px;text-shadow: 1px 1px 2px black;}

.navigation {background:#FFf;margin-top:0px;border-top:1px solid #111;border-bottom:1px solid #111;}

.navigation a {
display:inline-block;
background:transparent;
text-align:center;
margin-bottom:2px;
margin-right:4px;
padding-bottom:2px;
padding-top:2px;
font:normal 9px 'silkscreen',arial;
line-height:10px;
text-transform:uppercase;
letter-spacing:1px;
color:#444;
width:75px;}

.navigation a:hover {
background:#f0f0f0;
color:#000;}
  
.icon {margin-bottom:4px;margin-top:4px;}

.marquee {background:#444;color:#ddd;font:9px 'sysfont' ;padding:2px;}

.leftside {background: #FFF; border-right: 2px solid #444;}
.content {background: #FFF; border-right: 2px solid #444;}
.rightside {background: #FFF;}
.footer {background: #606060;color:#ccc; border-top:1px solid #111;
 border-bottom-left-radius:10px;border-bottom-right-radius:10px;line-height:20px;}
.footer a {color:#fff;}
  
.scrollbox {height:90px;border:1px solid #888;border-right:0px;padding:6px;margin-bottom:3px;overflow:scroll;overflow-x:hidden;}
  
.title {font: 10px 'sysfont' ;color:#999;letter-spacing:1px;text-align:left;padding:0px;padding-left:4px;
margin-bottom:4px;text-transform:uppercase;background:#eee;border-bottom:1px solid #ddd;}
  
  @font-face {
  font-family: 'sysfont';
  src: url(https://39nfdc.neocities.org/sysfont.woff);
}
  
</style>
</head>
  
    <body>
          <div id="app" style="position: absolute; bottom: 100; right: 100;">
      
    </div>
    <script src="https://unpkg.com/webamp@1.4.0/built/webamp.bundle.min.js"></script>
    <script>
      const Webamp = window.Webamp;
        const options = {
  // Optional. An object representing the initial skin to use.
  // If omitted, the default skin, included in the bundle, will be used.
  // Note: This URL must be served the with correct CORs headers.
  initialSkin: {
    url: "https://files.catbox.moe/3kt3ik.wsz",
  },

// Optional. An array of `track`s (see above) to prepopulate the playlist with.
   initialTracks: [
          {
            metaData: {
              artist: "snow strippers",
              title: "✧ under your spell ✧",
            },
            url: "https://files.catbox.moe/so9rxm.mp3",
          },
          {
            metaData: {
              artist: "death grips",
              title: "⛧ beware ⛧",
            },
            url: "https://files.catbox.moe/r3zixo.mp3",
          },
          {
            metaData: {
              artist: "teriyki boyz (ft. pharrell/busta rhymes)",
              title: "★ zock on! ★",
            },
            url: "https://files.catbox.moe/eczi3m.mp3",
          },
          {
            metaData: {
              artist: "pilotredsun",
              title: "funny animals 𓃠",
            },
            url: "https://files.catbox.moe/v6j0nf.mp3",
          },
          {
            metaData: {
              artist: "emezie",
              title: "𐙚 volaille (goose's theme)",
            },
            url: "https://files.catbox.moe/2dgmex.mp3",
          },
          {
            metaData: {
              artist: "kors k",
              title: "smooooch・∀・",
            },
            url: "https://files.catbox.moe/vnoem4.mp3",
          },
                    {
            metaData: {
              artist: "pokemon b/w",
              title: "dreamyard/pinwheel forest",
            },
            url: "https://files.catbox.moe/7rydxi.mp3",
          },
                              {
            metaData: {
              artist: "saint pepsi",
              title: "enjoy yourself",
            },
            url: "https://files.catbox.moe/ex920v.mp3",
          },
        ],
  // Optional. An object representing the initial layout of the windows.
  // Valid keys are `main`, `equalizer`, `playlist` and `milkdrop`. All windows
  // are optional.
  //
  // - Each provided window must specify a `position` object with `top` and
  //   `left` which specify pixel offsets.
  // - Each provided window, except for
  // `milkdrop` may specify a `shadeMode` boolean.
  // - Each provided window may specify a `closed` boolean.
  // - The playlist and milkdrop windows may specify a `size` object with
  //   `extraHeight` and `extraWidth`.
  //
  // **Note:** After windows are positioned, they are then centered _as a group_
  // within the DOM element that Webamp is rendered into.
  //
  // **Since** @next
  windowLayout: {
    main: {
      position: { top: 0, left: 0 },
      shadeMode: true,
      closed: false,
    },
    equalizer: {
      position: { top: 0, left: 0 },
      shadeMode: true,
      closed: false,
    },
    playlist: {
      position: { top: 0, left: 0 },
      shadeMode: true,
      // Number of additional sprites by which to expand the window.
      size: { extraHeight: 1, extraHeight: 10 },
      closed: false,
    },
  },

// Optional. (Default: `false`) Should double size mode be enabled?
  // **Note:** In keeping with the original Winamp, double size mode
  // does not apply to resizable windows like the equalizer or Milkdrop.
  //
  // **Since** @next
  enableDoubleSizeMode: true,

// Optional. (Default: `false`) Should global hotkeys be enabled?
  enableHotkeys: true,
};
const webamp = new Webamp(options);
      // Returns a promise indicating when it's done loading.
      webamp.renderWhenReady(document.getElementById("app"));
    </script>
  </body>
  
  
<body>

<center>
<table width="600" cellpadding="4" cellspacing="0"> 
<tr>
<td class="header"  height="90"> 
<center>
<a href=""><img src="https://files.catbox.moe/rshw42.png" alt="star"> your site name <img src="https://files.catbox.moe/rshw42.png" alt="star"></a>
</center>
  
</td>
</tr>
</table>
  
  
  
<table width="730" cellpadding="0" cellspacing="0"> 
<tr>
<td class="marquee" valign="top"> 
<marquee direction="left">  Maybe updates? Or buttons?  Please don't remove the credits from the bottom of the site.   </marquee>
</td>
</tr>
</table>
  
  
  
  
<table width="730" cellpadding="0" cellspacing="0"> 
<tr>
<td class="navigation" valign="top"> 
<center>
<a href=""><img src="https://files.catbox.moe/k8yx7i.gif" height="32" class="icon" alt="computer"><br> link</a> 
<a href=""><img src="https://files.catbox.moe/q65h03.png" height="32" class="icon" alt="book"><br> link</a> 
<a href=""><img src="https://files.catbox.moe/ie5d9v.png" height="32" class="icon" alt="paint"><br> link</a> 
<a href=""><img src="https://files.catbox.moe/nafoo9.png" height="32" class="icon" alt="cam"><br> link</a> 
<a href=""><img src="https://files.catbox.moe/ggt4px.gif" height="32" class="icon" alt="faq"><br> link</a>  
<a href=""><img src="https://files.catbox.moe/su2ve8.jpg" height="32" class="icon" alt="globe"><br> link</a>  
<a href=""><img src="https://files.catbox.moe/sx5jag.gif" height="32" class="icon" alt="pen"><br> link</a>  
</center>
</td>
</tr>
</table>

<table width="730" cellpadding="4" cellspacing="0">
<tr>
<td class="leftside" width="150" valign="top">
 
  
<div class="title">title here <img src="https://64.media.tumblr.com/3cac94a7d41dfd4690d418c5b2b8bca2/7ff5f8980156b828-8b/s75x75_c1/f6c3dc9dd6acf5fc74ff0a4465a8e5ed1c2d9531.pnj" align="right" alt="x"> </div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique tellus arcu, nec pulvinar dolor pretium in.
Nulla ac volutpat tortor. Mauris elementum augue vel massa sagittis aliquam. <b>Bold text.</b> <i>Italic text.</i> <a href="">Link.</a>
<br><br>

<div class="title">scrollbox <img src="https://64.media.tumblr.com/3cac94a7d41dfd4690d418c5b2b8bca2/7ff5f8980156b828-8b/s75x75_c1/f6c3dc9dd6acf5fc74ff0a4465a8e5ed1c2d9531.pnj" align="right" alt="x"> </div>
  
<div class="scrollbox">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique tellus arcu, nec pulvinar dolor pretium in.
Nulla ac volutpat tortor. Mauris elementum augue vel massa sagittis aliquam. <br><br>
Curabitur convallis rhoncus orci, et luctus erat aliquam et. In hac habitasse platea dictumst. In egestas turpis nisl, vel mollis purus porta vel. In hac habitasse platea dictumst. Nulla ac volutpat tortor. Mauris elementum augue vel massa sagittis aliquam.
</div>
<br>
  
  
<div class="title">
title here <img src="https://64.media.tumblr.com/3cac94a7d41dfd4690d418c5b2b8bca2/7ff5f8980156b828-8b/s75x75_c1/f6c3dc9dd6acf5fc74ff0a4465a8e5ed1c2d9531.pnj" align="right" alt="x"></div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique tellus arcu, nec pulvinar dolor pretium in. 
Integer nec rhoncus risus.
<br><br>
  
  
<div class="title">
title here <img src="https://64.media.tumblr.com/3cac94a7d41dfd4690d418c5b2b8bca2/7ff5f8980156b828-8b/s75x75_c1/f6c3dc9dd6acf5fc74ff0a4465a8e5ed1c2d9531.pnj" align="right" alt="x"></div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique tellus arcu, nec pulvinar dolor pretium in. 
Nulla ac volutpat tortor. Mauris elementum augue vel massa sagittis aliquam.

</td>

<td class="content" width="500" valign="top">
  
<div class="title">
title here</div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique tellus arcu, nec pulvinar dolor pretium in. 
Nullam eget sapien sodales, tempor nisi eu, bibendum dolor. Quisque id dolor dui. Fusce sed ultricies nulla. 
Vestibulum ultrices auctor mollis. Nulla aliquam ac libero id euismod. 
<br><br>

<div class="title">
title here </div>
Curabitur convallis rhoncus orci, et luctus erat aliquam et. In hac habitasse platea dictumst. 
In egestas turpis nisl, vel mollis purus porta vel. In hac habitasse platea dictumst. Nulla ac volutpat tortor. 
Mauris elementum augue vel massa sagittis aliquam. Sed ornare odio nec purus vulputate, et pharetra erat fringilla.   
Ut luctus, quam ac aliquam dictum, quam ligula pellentesque eros, sit amet dictum libero lacus accumsan orci. 
Integer nec rhoncus risus. Nulla in nunc eros. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
<br><br>

<div class="title"> 
title here </div>
Mauris purus sem, ornare eu dolor et, pretium placerat lacus. Cras felis turpis, congue eget condimentum at, hendrerit at lorem. Suspendisse laoreet id justo eget rutrum. Curabitur sollicitudin ante leo, a posuere ex porttitor quis. Cras ac bibendum lacus. Etiam lacinia ipsum a aliquam facilisis. Curabitur lectus magna, pharetra a massa nec, maximus auctor ex. Pellentesque fringilla a odio eget efficitur. Proin tristique pellentesque volutpat.
<br><br>
  
 <div class="title">
title here </div>
In hac habitasse platea dictumst. Nulla ac volutpat tortor. 
Mauris elementum augue vel massa sagittis aliquam. Sed ornare odio nec purus vulputate, et pharetra erat fringilla.   
Ut luctus, quam ac aliquam dictum, quam ligula pellentesque eros, sit amet dictum libero lacus accumsan orci. 
<br><br>

</td>

<td class="rightside" width="250" valign="top">
  
<div class="title">
title here <img src="https://64.media.tumblr.com/3cac94a7d41dfd4690d418c5b2b8bca2/7ff5f8980156b828-8b/s75x75_c1/f6c3dc9dd6acf5fc74ff0a4465a8e5ed1c2d9531.pnj" align="right" alt="x"></div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique tellus arcu, nec pulvinar dolor pretium in.
Nulla ac volutpat tortor. Mauris elementum augue vel massa sagittis aliquam. 
<br><br>
  
  
<div class="title">
title here <img src="https://64.media.tumblr.com/3cac94a7d41dfd4690d418c5b2b8bca2/7ff5f8980156b828-8b/s75x75_c1/f6c3dc9dd6acf5fc74ff0a4465a8e5ed1c2d9531.pnj" align="right" alt="x"> </div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique tellus arcu, nec pulvinar dolor pretium in. 
Integer nec rhoncus risus.
<br><br>
  
  
<div class="title">scrollbox <img src="https://64.media.tumblr.com/3cac94a7d41dfd4690d418c5b2b8bca2/7ff5f8980156b828-8b/s75x75_c1/f6c3dc9dd6acf5fc74ff0a4465a8e5ed1c2d9531.pnj" align="right" alt="x"> </div>

<div class="scrollbox">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique tellus arcu, nec pulvinar dolor pretium in.
Nulla ac volutpat tortor. Mauris elementum augue vel massa sagittis aliquam. <br><br>
Curabitur convallis rhoncus orci, et luctus erat aliquam et. In hac habitasse platea dictumst. In egestas turpis nisl, vel mollis purus porta vel. In hac habitasse platea dictumst. Nulla ac volutpat tortor. Mauris elementum augue vel massa sagittis aliquam.
</div>
<br>
  
<div class="title">
title here <img src="https://64.media.tumblr.com/3cac94a7d41dfd4690d418c5b2b8bca2/7ff5f8980156b828-8b/s75x75_c1/f6c3dc9dd6acf5fc74ff0a4465a8e5ed1c2d9531.pnj" align="right" alt="x"></div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique tellus arcu, nec pulvinar dolor pretium in. 
Nulla ac volutpat tortor. Mauris elementum augue vel massa sagittis aliquam.

</td>
</table>
  
  
  
  
  
<table width="730" height="20" cellpadding="0" cellspacing="0"> 
<tr>

<td class="footer" valign="top"> 
<center>
Layout <a href="http://itinerae.neocities.org" target="_blank">Itinerae</a> // 
<a href="https://artwork.neocities.org/oldweb" target="_blank">Icons,</a> 
<a href="https://jasminnie.weebly.com/pixels1.html" target="_blank">Pixels, </a> 
<a href="https://jsfiddle.net/naocrrds/bfzs7Lp0/" target="_blank">Scrollbar</a> 
</center>
   
</td>
  
</tr>
</table>

</center>
  
</body>
</html>

If you don't like the link icons I chose,
you can find more of them here !

title here

Mauris purus sem, ornare eu dolor et, pretium placerat lacus. Cras felis turpis, congue eget condimentum at, hendrerit at lorem. Suspendisse laoreet id justo eget rutrum. Curabitur sollicitudin ante leo, a posuere ex porttitor quis. Cras ac bibendum lacus. Etiam lacinia ipsum a aliquam facilisis. Curabitur lectus magna, pharetra a massa nec, maximus auctor ex. Pellentesque fringilla a odio eget efficitur. Proin tristique pellentesque volutpat.

title here

In hac habitasse platea dictumst. Nulla ac volutpat tortor. Mauris elementum augue vel massa sagittis aliquam. Sed ornare odio nec purus vulputate, et pharetra erat fringilla. Ut luctus, quam ac aliquam dictum, quam ligula pellentesque eros, sit amet dictum libero lacus accumsan orci.

title here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique tellus arcu, nec pulvinar dolor pretium in. Nulla ac volutpat tortor. Mauris elementum augue vel massa sagittis aliquam.

title here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique tellus arcu, nec pulvinar dolor pretium in. Integer nec rhoncus risus.

scrollbox

title here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tristique tellus arcu, nec pulvinar dolor pretium in. Nulla ac volutpat tortor. Mauris elementum augue vel massa sagittis aliquam.