<!-- 
        ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣀⣤⣤⣴⠶⠶⠶⠶⠦⣤⣤⣀⣀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣠⣶⠾⠟⣿⣿⠾⠛⠉⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠉⠙⠻⢶⣤⣠⣤⣤⣄⣀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣠⡾⠟⠉⠀⠀⠸⠋⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠛⢷⣀⠈⠙⠻⣦⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣠⡾⠋⠀⠀⠀⢀⣄⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠻⣧⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢠⣾⠏⠀⠀⠀⠀⢠⡿⠃⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢠⡀⠀⠀⠀⠈⠻⣦⣄⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⢀⣴⡟⠁⠀⠀⠀⠀⢀⡿⠁⠀⠀⣰⣶⣦⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣠⣄⠀⠀⠀⠀⠀⢿⡀⠀⠀⠀⠀⠀⠙⠷⣤⣀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⣀⣴⠟⠋⠀⠀⠀⠀⠀⠀⣼⠇⠀⠀⠐⣿⣿⡿⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣴⣿⣿⡇⠀⠀⠀⠀⢸⣇⠀⠀⠀⠀⠀⠀⠀⠈⠙⠳⣦⣄⡀⠀⠀⠀⠀⠀
⠀⠀⠀⣀⣴⠾⠋⠁⠀⠀⠀⠀⠀⠀⠀⠀⢿⡇⠉⠁⠉⠈⠉⠀⠀⠀⠀⠀⠀⣠⢤⣀⠀⠀⠀⠀⠀⠉⠿⠿⠁⡀⠀⠀⠀⢸⣿⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠉⠻⢶⣄⠀⠀⠀
⠀⣠⡾⠋⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠘⣷⣄⠤⠠⠐⢀⡀⠀⠀⠀⠀⠀⠋⠁⠉⠁⠀⠀⠀⠀⠀⠄⠀⠀⠀⢁⠀⠀⣼⢿⣦⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠙⣷⡄⠀
⢠⡿⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢠⡟⠻⢶⣤⣴⡾⠷⣦⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣴⣦⣤⠀⠜⣀⣴⠟⠈⢿⣆⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠙⣷⠀
⣿⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣠⡿⠁⠀⠀⣿⠃⠀⠀⢸⡟⠳⠶⠶⠶⢦⣶⣴⣶⣴⣶⣶⣿⠉⠀⠹⣷⣿⣿⣥⣄⡀⠀⢻⣦⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀ ⠀⢸⡇
⣿⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣴⠟⠁⠀⠀⠀⢿⣆⣠⡄⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠙⠳⠀⢀⣿⠟⠉⠉⠉⠛⣷⡄⠙⢷⣄⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣼⠇
⠘⢷⣄⡀⠀⠀⠀⠀⠀⠀⢀⣠⣴⠟⠃⠀⠀⠀⠀⠀⠀⣼⠏⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠰⠶⠿⣷⡀⠀⠀⣀⠀⠈⣿⡄⠀⠙⢷⣄⡀⠀⠀⠀⠀⠀⠀⣀⣼⠏⠀
⠀⠀⠉⠛⠷⠶⠶⠶⠶⠾⠛⠋⠁⠀⠀⠀⠀⠀⠀⠀⣸⡟⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢹⣧⣤⣴⠏⠀⠀⣽⡇⠀⠀⠀⠈⠛⠿⠶⠶⠶⠶⠿⠋⠁⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣿⡇⠀⣠⣤⣄⠀⠀⠀⠀⠀⠀⠀⣀⣀⡀⠀⠀⠀⠀⠀⣼⡇⠀⠀⠀⠀⣴⡟⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠹⣷⡾⠋⠀⠁⠀⠀⠀⠀⠀⢀⣾⠛⠉⠙⠓⠀⠀⢀⣴⠟⠛⠿⠾⠿⠛⠉⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⣷⠀⠀⠐⢶⣶⣶⣶⣶⣾⣿⡀⠀⠀⢶⡶⠛⠋⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠹⣧⣀⣠⡿⠁⠀⠀⠀⠀⢹⣇⡀⣠⡾⠃⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠉⠁⠀⠀⠀⠀⠀⠀⠀⠙⠛⠉⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
   
        ================================================================
        
                       // Websites that you may find useful // 
                       
            // https://www.w3schools.com/ 
            // https://learnlayout.com/
            // https://lilaclynx.net/responsive.html
            // https://stackoverflow.com/
            // https://codepen.io/
            // https://www.10bestdesign.com/dirtymarkup/
            // https://css-tricks.com/
            // https://www.cssportal.com/
            // https://www.codecademy.com/
            
        ================================================================            

    -->
    
    
<!-- sunflower: a page theme by nenrikido.neocities.org -->

<!-- NOTES #1:
  - Change the favicon (tab icon) by swapping the link after 'shortcut icon'.
  - Webkit (custom) scrollbar doesn't work on Mozilla or Safari.
  - If you'd like to use a tiled background instead of an image, navigate to body -> background and change the property to 'background: var(--bg-image) center / auto repeat'
  - On that note: You can also change the background image positioning to suit your image. This is also true for the right and left images! More info: https://www.w3schools.com/cssref/pr_background-position.php
  - If you'd like a solid color background, delete the line entirely and create a new background-color property
  - ctrl + f NOTES to read the next two instruction sections.
  - Feel free to email me at nenrikido@pm.me with questions, comments, or to show me how you use this! -->

  <!DOCTYPE html>
  <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <link rel='shortcut icon' type='image/x-icon' href='https://meltymods.neocities.org/imgs/psp.gif' />
      <title>About Us</title>
    </head>
    <body>
    
    
<style type="text/css">* {cursor: url(https://meltymods.neocities.org/imgs/cursor-spaceviolet2.gif), auto !important;}</style><a href="https://meltymods.neocities.org/imgs/cursor-spaceviolet2.gif" target="_blank" title="Pink Transparent Star"><img src="https://meltymods.neocities.org/imgs/cursor-spaceviolet2.gif" border="0" alt="Pink Transparent Star" style="position:absolute; top: 0px; right: 0px;" /></a>
    
    <style>
  
  /* NOTES #2: 
  - CHANGE YOUR VARIABLES HERE (:root) I tried to keep these simple, but flexible. If you need more, you can make as many as you like.
  - Links can be local; I only chose web links so this page would display immediately upon copy and pasting the code.
  - If you want to remove a side image, simply remove the image URL. The left image is left blank in this preview, but if you add a url, both images will show. 
  - If you'd like to change the fonts, remember to import your custom fonts first. (See @font-face to see how these fonts were imported). */
  
  :root {
    --title-color: #f5a7d2;
    --title-border: #df5ea5;
    --title-font-size: 4.5em;
    --title-font: 'PORKYS'; 
    --body-font: 'National Park'; 
    --body-font-color: #20550f;
    --box-color: #eee5ff;
    --bg-image: url('https://meltymods.neocities.org/imgs/bg2.jpg');
    --left-image: url(''); 
    --right-image: url('https://meltymods.neocities.org/imgs/meltybun.png');
    --divider-image: url('https://meltymods.neocities.org/imgs/loading%20bar.gif');
  }
  
  body, html {
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden;
  }
  
  *, *::before, *::after {
      box-sizing: border-box;
  }
  
  body {
    background: var(--bg-image) top / cover no-repeat;
    text-align: justify;
    font: 1em var(--body-font);
    color: var(--body-font-color);
  }
  
  h1, h2, h3, h4, h5, h6 {
    font-family: var(--title-font);
    color: var(--title-color);
    -webkit-text-stroke: 1px var(--title-border);
  }
  
  a {
    color: var(--title-border);
  }
  
  @font-face {
    font-family: 'PORKYS';
    src: url('https://dl.dropbox.com/s/o15z0l76kqbi8jq/PORKH.ttf');
  }
  
  @font-face {
    font-family: 'National Park';
    src: url('https://dl.dropbox.com/s/jox00bymodcheoy/NationalPark-Regular.otf');
  }
  
  ::-webkit-scrollbar {
    width: 0.5em;
  }
   
  ::-webkit-scrollbar-track {
    box-shadow: inset 0 0 8px var(--title-color);
  }
   
  ::-webkit-scrollbar-thumb {
    background-color: var(--title-color);
    outline: 1px solid var(--title-border);
  }
  
  .container {
    padding: 15px;
    display: flex;
    align-items: stretch;
    flex-wrap: nowrap;
    justify-content: center;
  }
  
  .container > div {
    flex: 1 1 auto;
    width: 33vw;
  }
  
  #divider {
    height: 2.5em;
    max-width: 100%;
    margin: 1em;
    background: var(--divider-image) center / contain no-repeat;
   }
  
  #title {
    font-family: var(--title-font);
    color: var(--title-color);
    font-size: var(--title-font-size);
    text-align: center;
    letter-spacing: 5px;
  }
  
  #title a {
    text-decoration: none;
    color: inherit;
    -webkit-text-stroke: 2px var(--title-border);
  }
  
  #title a:hover {
    filter: drop-shadow(2px 2px 5px var(--title-border));
  }
  
  nav ul {
    list-style-type: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: auto;
    padding: 0;
  }
  
  nav ul li {
  padding: 10px;
  }
  
  #left {
    transform: translateX(15%);
    z-index: 1;
    background: var(--left-image) center / contain no-repeat;
  }
  
  #main {
    z-index: 0;
  }
  
  #box {
    margin: 5em auto;
    width: 25vw;
    height: 35vh;
    padding: 5px;
    overflow-x: hidden;
    overflow-y: scroll;
    border-radius: 5px;
    background-color: var(--box-color);
    box-shadow: 0px 0px 20px 50px var(--box-color);
  }
  
  #right {
    transform: translateX(-10%);
    z-index: 1;
    background: var(--right-image) center / contain no-repeat;
  }
  
  
  /* Mobile */
  @media only screen and (max-width: 800px) {
  #title {
    font-size: calc(var(--title-font-size) / 1.4);
  }
    
  #left, #right {
    display: none;
  }
  
  #box {
    width: 70vw;
    height: 40vh;
  }
  }
  </style>
  
  <div class="container">
    <div id="left"></div>
    <div id="main">
        <div id="divider"></div>
        <!--NOTES #3: 
          - ADD YOUR CONTENT (title, navigation links, box text) HERE!
          - The navigation will wrap if you add more links! -->
        <div id="title"><a href="https://meltymods.neocities.org">Melty Mods</a></div>
        <nav>
            <ul>
                <li><a href="https://meltymods.neocities.org"> <img src="https://meltymods.neocities.org/imgs/home.png"> </a></li>
                <li><a href="about"> <img src="https://meltymods.neocities.org/imgs/about.png"> </a></li>
                <li><a href="contact"> <img src="https://meltymods.neocities.org/imgs/contact.png"> </a></li>
                <li><a href="shop"> <img src="https://meltymods.neocities.org/imgs/shop.png"> </a></li>
                <li><a href="gamelists"> <img src="https://meltymods.neocities.org/imgs/GAMELISTS.png"> </a></li>
        
            </ul>
        </nav>
        <div id="box">
          <h2 align="center">About Us<img src="https://meltymods.neocities.org/imgs/swirl.gif"> </h2> 
   
          
          Welcome to Melty Mods!<br><br>

Melty Mods is the brainchild of two passionate individuals from Southern California, Soy and Jem. Our journey began with a shared love for gaming, modding, and the thrill of exploring new horizons. Based in the outskirts of Los Angeles, we have crafted a space where creativity knows no bounds.<br><br>

At Melty Mods, we specialize in enhancing your gaming experience by modding game consoles to unlock their full potential. We are dedicated to helping you elevate your gaming adventures.<br><br>

Our interests extend beyond gaming into the vibrant world of rhythm games, Japanese arcades, and curating our very own home arcade experience. This passion fuels our commitment to staying at the forefront of gaming trends and innovations.<br><br>
<center><img src="https://meltymods.neocities.org/imgs/stardivider.gif"></center>
<br>
Meet the team behind Melty Mods: <b>Soy</b>, the creative force behind our website designs and social media presence, and <b>Jem</b>, the technical wizard who ensures everything runs smoothly behind the scenes. Together, we strive to deliver top-notch services and products that cater to fellow gaming enthusiasts like you.<br><br>

Join us on this exciting journey as we continue to push boundaries, embrace creativity, and share our love for gaming with the world. Get ready to level up your gaming experience with Melty Mods!<br>
<br><br>
Let's game on,
<br><br>
<img src="https://meltymods.neocities.org/imgs/meltybun.gif" align="left" style="width:90px;display:block; margin: 0px 2px 2px 2px">
Soy & Jem<br>
Founders, Melty Mods
           
           
        </div>
    </div>
    <div id="right"></div>
  </div>
  
  </body>
  
  </html>