<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>e4rth2em</title>
    <link rel="icon" type="image/x-icon" href="https://faegardens333.neocities.org/icons1/apple.png">
</head>
<body><center>
  <!-- BIO -->
  <div id="info">
    <h2>E4rth2Em!!</h2>
    <div id="content">
      <!-- DESCRIPTION -->
      <b>any prns ☺ // INFJ // Solange Sergeant//19//3.8</b>
      <br>
      <img src="https://cutekawaiiresources.files.wordpress.com/2016/11/cinnamoroll-11.gif?w=90&h=90&zoom=2" style="float:left; margin:5px">
      <p> hey hey hey! I'm <a href="https://1drv.ms/i/s!AvnIOBViWe90gyxYKQK1MZguwCSv?e=3cAHn1">emerald okwueze,</a>  & i'm a second year majoring in poli-comm & government </p>
      <img src="https://cutekawaiiresources.files.wordpress.com/2016/11/cinnamoroll-5.gif?w=90&h=90&zoom=2" style="float:right;">
      <p>I'm not sure what to put here buttt heyy! I'm a pretty introverted person, I rarely talk unless spoken too and when i do talk I talk pretty fast! (I used to be a speed debater) It's my second year at UT and i wanted to get out of my comfort zone and truly have a college experience that didn't solely revolve around being in academic distress.</p>
      <br>
      <h2 style="background: linear-gradient(90deg, pink 30%, transparent);">what I-luv about D-luv</h2>
      <img src="https://cutekawaiiresources.files.wordpress.com/2016/11/cinnamoroll-9.gif?w=90&h=90&zoom=2" style="float:middle;">
      <p>What really interests me the most about Darlins is the sisterhood aspect. I have 3 sisters and I lived with my 2 cousins as well so you can imagine having 6 girls under one roof. Being seperated from that has been a transition and while i've enjoyed finding out who i am as an individual, i miss being a silly girl with other silly girls.</p>
    <p>Even though i'm mute like 80% of the time I think i could contribute a lot to the sisterhood, from sharing clothes to giving advice or being a shoulder to cry on. I miss the emotional aspect of being there to listen and assure someone that we're all on the same journey together.</p>
      <p>I think Darlins represents a lot, apart from sisterhood, i think it symbolizes putting positivity and kindess into the world even if you don't get anything in return. From small actions like complimenting other girls to big actions like helping serve the community and supporting other organizations that prioritize the wellness of the community.  </p>
      <p>The organizations i've been in since coming to UT have kinda showed me the ropes to having balance both socially and academically. My mentors have been a good resource on the adversity that comes with higher education but to not let it get to you but rather keep it pushing bc college literally waits for no one, it just keeps going unfortunately </p>
      <img src="https://cutekawaiiresources.files.wordpress.com/2016/11/cinnamoroll-6.gif?w=90&h=90&zoom=2" style="float:right; margin:10px"><p>i definietly think the darlins should have a talent show!! not because i wanna show off the fact that i'd be a great dj buttt i think it'll be silly to see what the girls come up with and what everyone ends up doing!
        <p>In the past i've usually been a perfectionist with stuff i engage in, usually avoiding things to not deal disappointment or failure. On my new journey to put myself more out there, I applied to several creative organizations, even telling my friends about it and going out of my way to do publically post my creative ideas since I believed in them so much. I didn't end up getting into the creative organizations and i'm ngl it hurt (real bad) but I learned to put myself more out there and be ok with rejection. Maybe I wasn't their cup of tea, but the experience still got to me to put myself out there and post what <strong>I</strong> enjoyed doing. It also def taught me to be easier on myself and not take it to heart, it's literally not the end of the world if u fail, just redirection for something better. </p>
      <br>
      <h2 style="background: linear-gradient(90deg, lightblue 30%, transparent);">B.F.F.R</h2>
      <img src="https://cutekawaiiresources.files.wordpress.com/2016/11/cinnamoroll-30.gif?w=90&h=90&zoom=2" style="float:right;">
      <p>3 words that describe me would be: ditzy,overambitious,homebody</p>
      <p>if i could be any shoe in the worldd i would specifically be a Vintage Christian Dior Floral Logo lock Key Heel, with a flower belt. Just because shes not practical for everyday use, but the one time you wear her you're like ykw shes cute and she's giving character to the outfit. so shes basically a let me cook and youll see the personality type of shoe which is why she is me and i am her. </p>
      <img src="https://cutekawaiiresources.files.wordpress.com/2016/11/cinnamoroll-29.gif?w=100&h=120&zoom=2" style="float:left">
      <p>If money literally wasn't a thing and time didn't exist i would simply just travel and be a dj/music producer/actress/magazine designer/photographer/food critic. I would just lollygag and do whatever my heart desires all the time.</p>
    <p>the past year i had a lot of self-doubt about like myself and who i was as a person versus who i wanted to become and my aspirations in life so my friend Mei who i love dearly! sent me this quote by Tracee Ellis Ross "I am learning everyday to allow the space between where i am and where i want to be to inspire me and not terrify me." and i love it the most, because why am i scared of the future when everything about the future can be what i want it to be depending on what i do today !!! </p>
  </div>
  </div>
  
  <!-- PEACH & BERRIES DECO -->
  <img src="https://faegardens333.neocities.org/etc/peach_berries.png" style="
  position:absolute; width:200px; transform:translate(-3em, -20px) rotate(10deg);">
  
  <!-- 3D FLOWER DECO -->
  <img src="https://faegardens333.neocities.org/etc/3d_tulips.gif" style="
  position:absolute; transform:translate(-18em, 25em); width:130px;">

  <!-- STAMPS/FLAGS -->
  <div class="flag">
    <img src="https://openclipart.org/image/800px/287298" style="transform:rotate(2deg)">
    <img src="https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/1b5136f8-3c17-465b-a83a-111e8d89dcc0/dcqkhav-992c629e-c6ef-4bf5-b6db-403ef99cad51.png/v1/fill/w_99,h_56/_lgbt_stamps__bisexual_by_littlesunset264_dcqkhav-fullview.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7ImhlaWdodCI6Ijw9NTYiLCJwYXRoIjoiXC9mXC8xYjUxMzZmOC0zYzE3LTQ2NWItYTgzYS0xMTFlOGQ4OWRjYzBcL2RjcWtoYXYtOTkyYzYyOWUtYzZlZi00YmY1LWI2ZGItNDAzZWY5OWNhZDUxLnBuZyIsIndpZHRoIjoiPD05OSJ9XV0sImF1ZCI6WyJ1cm46c2VydmljZTppbWFnZS5vcGVyYXRpb25zIl19.bSvdeauaWMGXCH5aAsWHeV6rtDb5-jNSVeP74WYj5qI" style="transform:rotate(-2deg)">
    <img src="https://faegardens333.neocities.org/stamp/strawberry.png" style="transform:rotate(2deg)">
  </div>
  
  <!-- FUN FACTS -->
  <div id="fact">
    <h2>fun facts(scroll)</h2>
    <ul>
      <li> I like to eat jalapeno peppers as a snack</li>
      <li>My childhood bedroom used to be dark purple, blue, and neon pink till 3 years ago.</li>
      <li>I thrift for sport, so when i say lets go thrift, this is a whole day event.</li>
      <li>I've gotten chased and bitten by 3 dogs on 2 different occasions.</li>
      <li>Trader joes fanatic. seriously </li>
    </ul>
  </div>
  
  <!-- LIKES -->
  <div id="likes">
    <h2>stuff i like</h2>
    <div id="content">
      <b>colors:</b> Light blue, light pink,lavender, and forest green. <br>
      <b>animals:</b> dogs, raccoons, cows, monkeys & cats <br>
      <b>flower:</b> Baby's Breath & Periwinkle ♡ <br>
      <b>season:</b> fall <br>
      <b>food:</b> tacos, ramen, & pizza <br>
      <b>snack:</b> baked lays, trolli worms, Milano milk chocolate cookies!
      <br><br><br>
      <b>music genres:</b> Every genre you could think of.  <br><br>
      <b>artists:</b> <strong>Sade</strong>,<strong>Solange</strong>,<strong>Blood Orange</strong> Drake, Destroy Lonely, A tribe called Quest & Slum Village! <br><br>
      <b>songs:</b> 1Thing by Amerie has been on repeat for the past 3 days! Also Happy ending by Kelela! <br><br>
      <b>hobbies:</b> Thrifting, Puzzles, Crosswords, attempting to sew & reading!
    </div>
  </div>
  
  <!-- DISLIKES -->
  <div id="dislikes">
    <h2>Silly questions</h2>
    <div id="content">
      <b>Darlins I know:</b> I know two actives outside of recruitment, Nardos, we just started talking but shes da sweetest!! & Bee!!! (Kristina) from freshman year, we met randomly in the hallway and ever since then she's been Bee to me! <br>
      <b>Events I went 2:</b> I wen't to 3 (4 if you count info session) recruitment events - DEI, service pillar & the AEPI mixer! <br>
    </div>
  </div>
  
  <!-- CHERRY DECO -->
  <img src="https://faegardens333.neocities.org/dithered/cherry_dither.png" style="
    position:absolute; top:23em; left:17em; z-index:3; transform:scalex(-1)">
  
  <!-- YOUTUBE VID PLAYER -->
  <div id="video">
   <iframe name="video" src="https://player.vimeo.com/video/56914171?h=eb072738e0" target="video" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share allowfullscreen"></iframe>
    <div class="videos">
      <h2>Just Listen!</h2>
      <ul>
        <li><a href="https://player.vimeo.com/video/56914171?h=eb072738e0" target="video">am i losing you for good</3 </a></li>
        <li><a href="https://player.vimeo.com/video/25920288?h=5522757711" target="video">what is the look offf</a></li>
        <li><a href="https://player.vimeo.com/video/40906281?h=b021e0a9fa" target="video">come into my bedroom!!</a></li>
      </ul>
    </div>
 </div>
  
  <!-- QUIZZ RESULTS -->
  <h2 class="quiz">Quizzes(Click)</h2>
  <div id="quiz">
  <!-- quizzes --><div>
      <!-- GREEK GODDESS LOVER QUIZ-->
       <div style=" background:#3a6142; color:#e6b5cf; width:93%; display:block; padding:10px; border:1px solid; margin:0 auto; font-family:times; font-size:11pt;">
       <div style="display: flex; justify-content: space-around;">
        <div style="padding:5px">
          <p>Call me, Beep Me</p>
          <h1 class="title">Wya Em?</h1>
          <p class="description">I'm involved with 2 orgs at the moment, BSA & MWPLI! I'm avaliable Wednesday from 7-8:30 Also down for an interview (first or second) anytime!</p>
        </div><img style="width:50%; border: 1px solid" alt="Hera" src="https://media2.giphy.com/media/v1.Y2lkPTc5MGI3NjExbzQzOHo0MWNieTJkMmx6ZXdjZ2h4czg5ZW45Z2Q3dGU3NmM3NHc0NCZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9cw/ZBCu8vvgnd56izKFY2/giphy.gif"></div>
        <a >713-505-5826! or Kookwueze@gmail.com</a>
       </div>
       <!-- CHEESE QUIZ-->
       <a href="http://cupped-expressions.net/cheese/quiz/"><img src="https://cupped-expressions.net/cheese/quiz/american03.gif" border=0 width=100%></a><br><small>
       <!-- ANIMAL PROTECTION -->
       <div class="results" style="
       width:92%; background:linear-gradient(lavender,lightblue,lightpink); color:darkolivegreen; display:block; padding:10px; border:1px solid;">
          <p style="margin: 0">This page is protected by a</p>
          <h1 class="h1" style="margin: 0">Hedgehog</h1>
          <img class="image" style="max-width: 160px;border: 1px solid" src="https://i.ibb.co/7yb0DDj/hedgehog.jpg">
          <p class="description">Hedgehogs are lactose intolerant.</p>
       </div>
      <!-- DOKODEMO -->
      <a href="https://www.16personalities.com/free-personality-test"><img style="border: 6px darkgreen dotted;" src="https://miro.medium.com/v2/resize:fit:1400/1*LbtHD2XTXwV-_9W9Ja312A.jpeg"></a> 
      <!--- MIKU NENDOROID -->
      <A href="https://www.astro.com/cgi/ade.cgi?lang=e&ract=xx68747470733a2f2f7777772e617374726f2e636f6d2f6367692f656c65632e6367693f266c616e673d65"><img style="border: 2px lightpink solid;" src="https://www.yourtango.com/sites/default/files/styles/body_image_default/public/2020/astrology-meme-46.jpg"/></a>
      <!-- TAROT CARD -->
      <a href="https://web.archive.org/web/20030815075155/http://www.zenhex.com/tests/tarot/">
      <!-- PEACHIE NU FLOWER-->
      <a href="https://www.buzzfeed.com/kattspya/which-flower-are-you-5adpbdhqde" target="_blank"><img src="https://web.archive.org/web/20040109225800im_/http://www.peachie.nu/rose.gif"></a>
    </div>
  </div>

  <!-- FONT SMOOTH TOGGLE -->
    <label id="smooth">
      Watch Now!
      <input type="checkbox"><br>
      <a href="https://www.tiktok.com/t/ZT82fdoBX/
">cool videos</a>
    </label>
  <!-- HOME -->
    <div id="home"><a href="https://www.pinterest.com/">go home</a></div>

<!-- DECORATIONS -->
<!-- BRANCH -->
  <img src="https://faegardens333.neocities.org/etc/fruit_branch.png" style="
    position:absolute; left:1240px; top:-1.5em; width:200px; z-index:3">
<!-- EATING APPLE-->
  <img src="https://faegardens333.neocities.org/etc/bite_apple.gif" style="
    position:absolute; top:500px; left:360px; width:60px; transform:rotate(5deg); z-index:3;">
<!-- CAT STAMP -->
  <img src="https://nickwatton.com/wp-content/uploads/2014/11/NickWattonLittleMermaidStamp.jpg" style="
    z-index:3; width:100px; position:absolute; left:1240px; top:40em; transform:rotate(3deg); image-rendering:crisp-edges;">
<!-- ROSE -->
  <img src="https://faegardens333.neocities.org/etc/rose_drops.gif" style="
    position:absolute; z-index:3; left:0px; top:35em; transform:scalex(-1); width:250px">
<!-- RAINBOW BUTTERFLY -->
  <img src="https://media.tenor.com/z8swAVI-pygAAAAj/cinnamoroll-sanrio-characters.gif" style="
    position:absolute; z-index:3; transform:translate(14em,32em) rotate(-8deg); width:100px">
  
</center></body>

  
  
<!-- CASCADING STYLE SHEETS & JAVASCRIPT -->

<!-- ROOT & TEXT SMOOTHING THEME -->
<style>
  :root {
    --font: never;
    --font2: none;
  }

body[data-theme="smooth"] {
	--font: always;
	--font2: subpixel-antialiased;
}
</style>

<!-- BODY -->
<style>
  body {
    width: 1420px;
    postion: relative;
    background-image: url(https://wallpaper-house.com/data/out/8/wallpaper2you_289297.jpg), url(https://faegardens333.neocities.org/etc/sparkles.gif);
    background-blend-mode: lighten;
    background-size: 1440px 900px, auto;
    
    font-family: verdana;
    font-smooth: var(--font);
	  -webkit-font-smoothing: var(--font2);
    overflow-y: hidden;
  }
  
  img {
    filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.5));
    image-rendering: pixelated;
    
  }
  
  h1, h2, h3 {
    margin: 0px;
  }
  
  p {
    font-size: 14px;
  }
  
  a {
    color: lightblue;
    text-decoration: none;
  }
  
  /* Hide scrollbar for Chrome, Safari and Opera */
  div::-webkit-scrollbar {
      display: none;
  }

  /* Hide scrollbar for IE, Edge and Firefox */
  div {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
  }
</style>

<!-- CURSOR -->
<style>
  * {cursor: url(https://faegardens333.neocities.org/cursor/apple_normal.png), auto !important;}
  
  a {
    cursor: url(https://faegardens333.neocities.org/cursor/apple_hover.png), crosshair !important;
  }
</style>

<!-- INFO -->
<style>
  #info {
    position: absolute;
    left: 20em;
    top: 3em;
    background: url(https://sadhost.neocities.org/images/tiles/tumblr_inline_mlkxsmQayT1r53miq540.gif);
    
    width: 500px;
    height: 385px;
    overflow-y: scroll;
    border: 1px solid black;
    border-radius: 10px;
    
  }
  
  #info h2 {
    background: linear-gradient(90deg, lightblue 30%, transparent);
    
    border-radius: 0 100px 100px 0;
    border: 1px solid black;
    border-left: none;
    
    margin: 0;
    margin-top: 10px;
    margin-right: 20px;
    padding: 5px;
    
    font-family: verdana;
    text-align: left;
    color: white;
    text-shadow: 1px 1px 0px black, -1px 1px 0px black, 1px -1px 0px black, -1px -1px 0px black;
  }
  
  #info #content {
    background: linear-gradient(rgba(255, 255, 255, 0.9) 50%, #deefff);
    height: 230px;
    overflow-y: scroll;
    margin: 20px;
    margin-bottom: 0;
    padding: 30px;
    border-radius: 10px;
    border: 1px solid black;
    box-shadow: inset 2px 2px 2px white, inset -2px -2px 2px #c4d1ff;
  }
  
  #info #content h2 {
    margin-left: -30px;
  }
  
  #info p {
    font-size: 14px;
  }
  
  #info b {
    color: pink;
  }
</style>

<!-- FLAGS -->
<style>
  .flag {
    position: absolute;
    left: 52.3em;
    top: 40px;
    width: 70px;
    z-index: 2;
  }
  .flag img {
    width: 100%;
    filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.4));
    margin-bottom: 5px;
  }
</style>

<!-- FUN FACTS -->
<style>
  #fact {
    position: absolute;
    left: 49em;
    top: 12em;
    z-index: 1;
    transform: rotate(-3deg);
    
    width: 180px;
    height: 200px;
    padding-top: 20px;
    padding-left: 19px;
    overflow-y: scroll;
    background: url(https://faegardens333.neocities.org/etc/notebook_paper.png);
    background-size: cover;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.4);
    font-family: handwriting, sans-serif;
    color: #694226;
    
    font-smooth: always;
    -webkit-font-smoothing: subpixel-antialiased;
  }
  
  #fact h2 {
    font-family: fuzzy bubbles, cursive;
  }
  
  #fact ul {
    text-align: left;
    margin-left: -2em;
    list-style: url(https://foollovers.com/mat/i-square/na17-icon-square.gif);
  }
  
  #fact li {
    margin: 1em;
  }
</style>

<!-- LIKES -->
<style>
  #likes {
    position: absolute;
    left: 0;
    
    width: 280px;
    height: 230;
    overflow-y: scroll;
    padding: 10px;
    
    text-align: left;
    background: url(https://i.pinimg.com/564x/4a/d4/49/4ad4494084b5ae219594d6d05bc0be32.jpg);
    background-size: cover;
    background-position: center;
    
    border-radius: 0 50px 30px 0;
    border: 1px dotted #694226;
    box-shadow: inset 0 0 3px orange;
  }
  
  #likes h2 {
    font-family: fuzzy bubbles, cursive;
    text-align: center;
    font-size: 40px;
    color: orange;
    text-shadow:
      1px 1px 0px #694226, -1px 1px 0px #694226, 1px -1px 0px #694226, -1px -1px 0px #694226,
      3px 3px 0px white, -3px 3px 0px white, 3px -3px 0px white, -3px -3px 0px white,
      3px 0px 0px white, 0px 3px 0px white, -3px 0px 0px white, 0px -3px 0px white,
      4px 4px 3px rgba(0, 0, 0, 0.5);
    margin: 8px;
    background: url(https://faegardens333.neocities.org/bg/citrus_plaid.png);
    box-shadow: inset 3px 3px 2px lemonchiffon, inset -2px -2px 3px orange, 2px 2px 4px rgba(0, 0, 0, 0.4);
    border-radius: 100px;
    border: 1px dotted #694226;
    padding: 5px;
  }
  
  #likes #content {
    height: 108px;
    padding: 10px;
    overflow-y: scroll;
    
    background: linear-gradient(white, lemonchiffon);
    border-radius: 20px;
    border: 1px dotted #694226;
    
    font-size: 14px;
    line-height: 1.3em;
    color: #694226;
  }
  
  #likes b {
    color: orange;
    background: url(https://faegardens333.neocities.org/bg/yellow_gingham.gif);
    border-radius: 10px;
    padding-left: 5px;
    padding-right: 5px;
  }
  
  #likes a {
    color: orange;
    text-decoration: dotted underline;
  }
</style>

<!-- DISLIKES -->
<style>
  #dislikes {
    position: absolute;
    left: 30px;
    top: 260px;
    z-index: 2;
    transform: rotate(-2deg);
    
    width: 280px;
    height: 230;
    overflow-y: scroll;
    padding: 10px;
    text-align: left;
    background: linear-gradient(lightblue 50%, lavender), url(https://foollovers.com/mat/dotbl/f23-bg-black-dot.gif);
    background-blend-mode: lighten;
    
    border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
    border: 3px solid darkolivegreen;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.4);
  }
  
  #dislikes h2 {
    font-family: chalk, cursive;
    font-weight: none;
    text-align: center;
    font-size: 24px;
    color: white;
    text-shadow: 2px 2px 4px red, -2px 2px 4px red, 2px -2px 4px red, -2px -2px 4px red;
    margin: 8px;
    
    background: url(https://www.fancyparts.com/fancyparts/cg/pattern/dot_07/dot-07-18.gif);
    box-shadow: 6px 6px 0px #694226;
    
    border: 1px dashed #694226;
    outline: 4px solid white;
    border-radius: 50%;
    padding: 18px;
  }
  
  #dislikes #content {
    height: 108px;
    overflow-y: scroll;
    border-radius: 300px 30px 200px 15px/30px 200px 2em 200px;
    border: 1px solid #694226;
    box-shadow: 2px 2px 0px #694226;
    background: url(https://faegardens333.neocities.org/bg/plaid_daisy.gif);
    background-size: 50%;
    padding: 10px;
    font-size: 16px;
    color: #694226;
  }
  
  #dislikes b {
    color: darkolivegreen;
    font-family: chalk;
    text-decoration: dashed underline;
  }
</style>

<!-- VIDEO PLAYER -->
<style>
  /* #video - box
     .video - navigation
  */
  #video {
    position: absolute;
    left: 24em;
    top: 28.5em;
    width: 545px;
    padding: 10px;
    
    background: url(https://i.pinimg.com/564x/f9/7c/5e/f97c5e5d1d255195bcbd95d6abcd31f9.jpg), rgba(255, 255, 255, 0.3);
    background-size: cover, auto;
    background-blend-mode: overlay;
    font-family: noto sans, sans-serif;
    
    border-radius: 10px;
    border: 1px solid black;
    box-shadow: inset 1.5px 1.5px 1.5px white, inset 0 -10px 10px rgba(0,0,0,0.5), inset -2px -2px 1.5px rgba(0,0,0,0.7);
  }
  
  #video:after {
    content: "";
    display: table;
    clear: both;
  }
  
  #video iframe, .videos {
    float: left;
  }
  
  #video iframe {
    border-radius: 10px 0 0 10px;
    border: 1px solid black;
    box-shadow: 0 3px 5px rgba(0,0,0,0.4), inset 0 0 5px black;
    margin-right: 10px;
    
    width: 60%;
    height: 189px;
    /* width="336" height="189"*/
  }
  
  .videos {
    width: 33.6%;
    height: 169px;
    padding:10px;
    margin-right: -10px;
    overflow: hidden;
    
    background: url(https://i.pinimg.com/564x/f4/d4/70/f4d47049896dba241cc5917b36914cd8.jpg);
    background-size: cover;
    box-shadow: 0 3px 5px rgba(0,0,0,0.4), inset 0 0 5px black;
    border-radius: 0 0 30px 0;
    border: 1px solid black;
    border-top: none;
    text-align: left;
    font-size: 14px;
  }
  
  .videos h2 {
    width: 113%;
    text-align: center;
    font-size: 25px;
    font-family: verdana;
    color: white;
    text-shadow: 1px 1px 0 black, -1px 1px 0 black, 1px -1px 0 black, -1px -1px 0 black, 2px 2px 1px rgba(0,0,0,0.5);
    
    background: linear-gradient(#37c74b 20%, rgba(220,255,113,1) 57%, rgba(255,254,243,0.8) 82%);
    background-size: 130%;
    background-position: left;
    box-shadow: inset 0 -1.5px 2px white, 0 0px 5px rgba(0,0,0,0.8);
    
    border-radius: 0 0 20px 20px;
    border-bottom: 1px solid black;
    
    padding-bottom: 10px;
    padding-top: 10px;
    margin-top: -14px;
    margin-left: -10px;
    
  }
  
  .videos ul {
    height: 100px;
    overflow: scroll;
    background: linear-gradient(white 50%, #b8e340);
    box-shadow: 0 3px 5px rgba(0,0,0,0.4), inset -1px -1px 1px white;
    padding: 5px;
    border: 1px solid black;
    border-radius: 5% 5% 20px 5%;
    list-style: inside url(https://www.fancyparts.com/fancyparts/cg/icon/ball01/ball_s_03.gif);
    color: red;
    text-shadow: 1px 1px 0 rgba(0,0,0,0.2);
  }
  
  .videos li {
    margin: 5px;
    font-size: 15px;
  }
  
  .videos a {
    text-decoration: none;
    color: #000;
  }
  
  .videos a:hover {
    color: blue;
    text-decoration: underline;
  }
</style>

<!-- QUIZ -->
<style>
  #quiz {
    position: absolute;
    left: 980px;
    top: 0px;
    transform: rotate(2deg);
    
    width: 300px;
    height: 90%;
    overflow-y: scroll;
    overflow-x: hidden;
    padding-top: 70px;
    padding-bottom: 40px;
  }
  
  .quiz {
    position: absolute;
    top: -2px;
    left:980px;
    z-index:2;
    
    padding: 5px;
    padding-top: 30px;
    width: 300px;
    
    font-family: marck script, cursive;
    font-size: 36px;
    color: lemonchiffon;
    text-shadow: 1px 1px 0px black, -1px 1px 0px black, 1px -1px 0px black, -1px -1px 0px black;
    
    background: linear-gradient(lavender, lightblue 30%, lightpink), url(https://static.wixstatic.com/media/5922a2_e3fa3a2bc2624085ba47f4c296fbec84~mv2.gif);
    background-size: 30%;
    background-blend-mode: overlay;
    border-radius: 0 0 100px 100px;
    border: 1px solid black;
    box-shadow: 0 4px 10px rgba(0,0,0,0.5);
  }
  
  #quiz img {
    filter: none;
    width: 100%;
    image-rendering: crisp-edges;
  }
</style>

<!-- TOGGLE -->
<style>
  #smooth {
    position: absolute;
    left: 1290px;
    top: 43.5em;
    z-index: 99;
    
    background: url(https://faegardens333.neocities.org/bg/yellow_gingham.gif);
    border-radius: 20px;
    border: 1px solid;
    padding: 5px;
    color:black;
  }
  #smooth a {
    text-decoration: none;
    color: red;
  }
  
  #smooth a:hover {
    color: limegreen;
    font-style: italic;
  }
</style>
<script>
  window.addEventListener('DOMContentLoaded', (event) => {
		// Get the checkbox element 		
    let checkbox = document.querySelector("input")
		
    // Get the body tag	
    let body = document.querySelector("body")
		
		// This event handler listens for the checkbox to be checked or unchecked
    // Then, if the checkbox is checked (event.target.checked == true)
		// Then apply `data-theme="dark"` to the body tag
		// Otherwise, remove the attribute
    checkbox.addEventListener('change', (event) => {
						
			event.target.checked ? body.setAttribute('data-theme', "smooth") : body.removeAttribute("data-theme")

    });

  });
</script>

<!-- HOME -->
<style>
  #home {
    width: 118px;
    padding: 10px;
    position: absolute;
    left: 1290px;
    top: 47.5em;
    z-index: 99;
    
    background: url(https://faegardens333.neocities.org/bg/yellow_gingham.gif);
    border-radius: 20px;
    border: 1px solid;
    color:black;
  }
  #home a {
    text-decoration: none;
    color: red;
  }
  
  #home a:hover {
    color: limegreen;
    font-style: italic;
  }
</style>

<!-- FONT IMPORT -->
<style>
  /* fuzzy bubbles */ @import url('https://fonts.googleapis.com/css2?family=Fuzzy+Bubbles:wght@700&display=swap');
  /* noto sans */ @import url('https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap');
  /* marck script */ @import url('https://fonts.googleapis.com/css2?family=Marck+Script&display=swap');

  /* bradley hand */
  @font-face {
    font-family: handwriting;
    src: url(https://files.catbox.moe/rggxs1.ttf);
  }

  /* mikiyu font: crayon 2 */
  @font-face {
    font-family: chalk;
    src: url(https://files.catbox.moe/4d57rg.TTF);
  }

  /* beatle */
  @font-face {
    font-family: silly;
    src: url(https://files.catbox.moe/nzf1wo.ttf) format("truetype");
  }
</style>
</html>