Code Genevieve

<style>
/*

======== !! IMPORTANT !! DO NOT REMOVE ANY PART OF THIS SECTION =========

AUTHOR: Elle
LANGUAGE: CSS/HTML
SOURCE: https://pastebin.com/raw/9HZZDLW0 -
REGISTRATION: https://www.copyrighted.com/work/2PKqDybNAqyK7xoN ;


######################----########-----------------########------------------######################
######################----########-----------------########------------------######################
######################----########-----------------########------------------######################
########------------------########-----------------########------------------########
########------------------########-----------------########------------------########
######################----########-----------------########------------------######################
######################----########-----------------########------------------######################
######################----########-----------------########------------------######################
########------------------########-----------------########------------------########
########------------------########-----------------########------------------########
######################----#####################----######################----######################
######################----#####################----######################----######################
######################----#####################----######################----######################


============================================================================================================
THE REST OF THE CODE IS KEPT IN MY FILE BUT IT WON'T AFFECT HOW YOUR PROFILE WILL LOOK.
HERE ARE THE EDITABLE PORTIONS OF YOUR CODE. IT MAKES IT EASIER FOR YOU TO IGNORE THE PARTS OF THE
CODE WHERE YOU REALLY CAN'T TOUCH BECAUSE IT MIGHT BREAK THE WHOLE THING. IT ALSO MAKES IT EASIER FOR
ME TO FIX BUGS YOU MAY FIND.
=============================================================================================================
*/

/* =========================== START EDITING HERE =========================== */
:root {
  /* backgrounds and borders */
  --background-color: linear-gradient(white,dodgerblue);
  --main-box-background: #e4f2f7;
  --main-box-border: #5a5aaf;
  --main-image-border-design: dashed;
  --main-image-border-color: #666;
  --ooc-separator-design: dashed;
  --ooc-separator-color: rgba(0,0,0,0.2);
  --picture-border-color: #333;
  --friend-border-color: #333;

  /* images */
  --background-image: url(https://i.imgur.com/mEUDrfw.jpg);
  --main-image: url(https://i.imgur.com/uLchrnZ.jpg);
  --background-image-transparency: 0.2;

  /* tabs */
  --tab-button-border: black;
  --tab-hover-highlight: rgba(0,0,0,0.3);
  --tab-hover-font-color: white;

  /* content */
  --stat-highlight: rgba(0,0,0,0.3);
  --ooc-numbering-highlight: rgba(0,0,0,0.3);

  /* fonts */
  --default-font: 'Economica', sans-serif;
  --default-color: black;
  --stats-font: 'Permanent Marker', cursive;
  --header-font: 'Playball', cursive;
  --link-font: 'Passion One', cursive;

  /* fonts colors */
  --stat-font-color: white;
  --ooc-numbering-font-color: white;
  --header-color: darkslategray;
  --bold-color: darkblue;
  --italics-color: darkslateblue;
  --link-color: hotpink;
  --link-hover-color: #b43977;
}



/*
=======================================================================================================
****** TROUBLESHOOTING: IF YOU NEED ANY HELP, MESSAGE ME ON DISCORD: Lil Monster#3557 ****
=======================================================================================================
*/
</style>
<!-- ===================LOAD IN CSS FILE=================== -->
<link href="https://ellexidecodes.github.io/Profile-Codes/free/genevieve.css" rel="stylesheet">
<!-- main box and image -->
<div id="box">
  <div id="main"></div>
</div>


<!-- tabs start here -->
<div class="tabs">

  <!-- first tab -->
  <div class="tab"><input checked="checked" id="tab-1" name="tab-group-2" type="radio" />
    <label for="tab-1">Dossier</label>

    <div class="content">
      <h1>Not all angels have wings...</h1>
      <table>
        <tbody>
          <tr>
            <td>Name</td>
            <td>Genevieve Sta. Agueda</td>
            <td>Moniker</td>
            <td>Gen</td>
          </tr>
          <tr>
            <td>Gender</td>
            <td>Female</td>
            <td>Sex</td>
            <td>Demisexual</td>
          </tr>
          <tr>
            <td>Age</td>
            <td>24 y.o. <i>...?</i></td>
            <td>Occupation</td>
            <td>Accountant <s>Assassin</s></td>
          </tr>
          <tr>
            <td>Height</td>
            <td>5'7"</td>
            <td>Weight</td>
            <td>110lbs</td>
          </tr>
          <tr>
            <td>Marital Status</td>
            <td>Taken</td>
            <td>Lover</td>
            <td><a href="https://roleplay.chat/profile.php?user=Ellexide">Daniel Rosales</a></td>
          </tr>
          <tr>
            <td>Favourite Spot</td>
            <td>Beach</td>
            <td>Hobby</td>
            <td>Reading, Hiking, Swimming</td>
          </tr>
          <tr>
            <td>Residence</td>
            <td>Barcelona, Spain</td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>


  <!-- second tab -->
  <div class="tab"><input id="tab-2" name="tab-group-2" type="radio" />
    <label for="tab-2">Biography</label>

    <div class="content">
      <h1>... Not all demons have horns</h1>
      <p>
        Normal Text | <b>Bold</b> | <i>Italics</i> | <u>Underline</u> | <s>Strikethrough</s> | <a href="#">Link</a>
      </p>
      <p>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec dolor libero, varius at mi nec, porttitor
        rhoncus augue. Donec semper laoreet nunc, eget pretium quam auctor ac. Vestibulum nec nibh sagittis, varius
        magna in, aliquam odio. Nulla viverra sodales lacus, quis tristique neque fringilla in. Nunc efficitur volutpat
        quam a bibendum. Nulla nec nibh urna. Pellentesque egestas nibh quis accumsan feugiat. Donec commodo faucibus
        tortor id tristique. Mauris tempus ligula arcu, nec consequat libero scelerisque mattis. Maecenas euismod
        condimentum mi eu iaculis. Integer viverra lacinia aliquam. Nullam vulputate felis ut ante porttitor, id
        ultrices dolor sodales. Suspendisse mattis sed mi sed sagittis. Quisque feugiat neque ut consequat iaculis.
        Mauris ipsum elit, volutpat eu sodales ac, fermentum imperdiet orci. Sed a diam sed diam iaculis sagittis ac ac
        augue.
      </p>
      <p>
        Quisque eu sapien vel dolor tincidunt consequat. Duis faucibus consequat augue, non condimentum nisi rutrum
        sagittis. Proin purus est, sodales fermentum est at, ultricies maximus sem. Proin volutpat quam non tincidunt
        pharetra. Donec a euismod nisi, dictum vulputate neque. Fusce euismod, ipsum non efficitur finibus, enim neque
        tempor ipsum, sed vestibulum nulla ligula non diam. Suspendisse commodo interdum quam ut bibendum. Suspendisse
        tincidunt aliquam commodo. Aliquam pellentesque nunc ut fermentum varius. Nunc sagittis neque et pharetra
        rhoncus. Suspendisse velit dui, condimentum non vehicula nec, posuere sollicitudin odio. Ut sed neque lectus.
        Sed ac pellentesque neque. Maecenas tincidunt interdum magna, a aliquet ante fringilla non.
      </p>
    </div>
  </div>


  <!-- third tab -->
  <div class="tab"><input id="tab-3" name="tab-group-2" type="radio" />
    <label for="tab-3">Connections</label>

    <div class="content">
      <h1>my web of lies</h1>
      <div id="friends">
        <a  class="friendo"
            href="https://roleplay.chat/profile.php?user=Ellexide"
            style="background-image:url(https://i.pinimg.com/564x/48/7d/b8/487db8f0bcd8c13d76e40aae52ad90c5.jpg)"
            target="_blank"
            name="Friend name here"
            description="friend comments here"></a>

        <a class="friendo"
            href="https://roleplay.chat/profile.php?user=Ellexide"
            style="background-image:url(https://i.pinimg.com/564x/2a/71/c3/2a71c3dbfa7a735fef17eb28c3e5e1bd.jpg)"
            target="_blank"
            name="Regina George"
            description="She's a little demon. Well, a literal demon. It was odd to see a demon as my client. The whole day I met her was odd now that I think about it."></a>

        <a class="friendo"
            href="https://roleplay.chat/profile.php?user=Ellexide"
            style="background-image:url(https://i.pinimg.com/564x/fc/f9/f3/fcf9f3a84235b83e26b14ffa25ae0630.jpg)"
            target="_blank"
            name="Christian Antonio"
            description="He's Daniel's best friend but we've become pretty close now. He taught me how to skateboard so he's good in my books."></a>

        <a class="friendo"
            href="https://roleplay.chat/profile.php?user=Ellexide"
            style="background-image:url(https://i.pinimg.com/564x/90/b8/bd/90b8bd23b06c44fa9ec19d2ffc2c24e4.jpg)"
            target="_blank"
            name="Charlie"
            description="His real name is Carlos but we call him Charlie because he likes popping in when kids do that dumb 'Charlie, Charlie' challenge."></a>

        <a class="friendo"
            href="https://roleplay.chat/profile.php?user=Ellexide"
            style="background-image:url(https://i.pinimg.com/564x/31/8e/69/318e691160d9509ddc1ba80084e3b3ae.jpg)"
            target="_blank"
            name="Svimi"
            description="He's Liv's husband. I honestly thought it was a Halloween costume because we met on October 28th..."></a>

        <a class="friendo"
            href="https://roleplay.chat/profile.php?user=Ellexide"
            style="background-image:url(https://i.pinimg.com/564x/13/8c/e7/138ce7d6035e3a12630661ac03f9a5f5.jpg)"
            target="_blank" name="Liv"
            description="She's Svimi's wife. Again... I thought it was a costume."></a>

        <a class="friendo"
            href="https://roleplay.chat/profile.php?user=Ellexide"
            style="background-image:url(https://i.pinimg.com/564x/0f/7a/4f/0f7a4fdd44d21834e6890dda523fb881.jpg)"
            target="_blank"
            name="Denise Lopez"
            description="She's my mentor and she's the best person for it. I met her 7 years ago and honestly, she's the big sister I never had."></a>

        <a class="friendo"
            href="https://roleplay.chat/profile.php?user=Ellexide"
            style="background-image:url(https://i.pinimg.com/564x/af/da/f1/afdaf173d79bb9b452d30545713ce89b.jpg)"
            target="_blank" name="Riane Gomez"
            description="She's a witch I met in one of the bars in Barcelona--I won't tell you exactly where--and she makes the best apple pies."></a>

        <a class="friendo"
            href="https://roleplay.chat/profile.php?user=Ellexide"
            style="background-image:url(https://i.pinimg.com/564x/cf/7f/b3/cf7fb31a35026cd46e8a1c4f19462587.jpg)"
            target="_blank"
            name="Maggie Sta. Agueda"
            description="She's my most beautiful little sister. I work as hard as I do for her."></a>

      </div>
    </div>
  </div>


  <!-- fourth tab -->
  <div class="tab"><input id="tab-4" name="tab-group-2" type="radio" />
    <label for="tab-4">Gallery</label>

    <div class="content">
      <h1>show me more</h1>
      <div id="gallery">
        <div class="picture" style="background-image: url(https://i.pinimg.com/564x/ed/3b/a1/ed3ba18c320ec3cbf30e08d098e0a930.jpg)"></div>

        <div class="picture" style="background-image: url(https://i.pinimg.com/564x/a9/2e/f1/a92ef1de30aa8d105e119ab862ff08ad.jpg)"></div>

        <div class="picture" style="background-image: url(https://i.pinimg.com/564x/40/61/16/40611639f33ab43ffe6080f7909be54a.jpg)"></div>

        <div class="picture" style="background-image: url(https://i.pinimg.com/564x/7f/6d/db/7f6ddba2cb5fb21deb33919d9949dcae.jpg)"></div>

        <div class="picture" style="background-image: url(https://i.pinimg.com/564x/d1/2f/f7/d12ff78587793376c42f6f8c789500b6.jpg)"></div>

        <div class="picture" style="background-image: url(https://i.pinimg.com/564x/31/ba/d9/31bad9b45a6818aedd39e04589069afa.jpg)"></div>
      </div>
    </div>
  </div>

  <!-- if you want more tabs, just copy and paste the layouts above. Make sure to rename the input id and label for. Leave the name as "tab-group-2" -->
</div>



<!-- permanent out of character -->
<div id="ooc">
  <h1>Out of Character</h1>
  <ol>
    <li>This profile is <a href="https://www.copyrighted.com/work/2PKqDybNAqyK7xoN" target="_blank">copyrighted</a> and
      made by <a href="https://themonstrousdev.github.io/" target="_blank">The Monster</a> for anybody
      to use. If you want a profile of your own, visit her RPC profile [Deum], pastebin [BappidyBoopidy].</li>
    <hr>
    <li>OOC bullet here</li>
    <li>OOC bullet here</li>
    <li>OOC bullet here</li>
    <li>OOC bullet here</li>
    <li>OOC bullet here</li>
    <li>OOC bullet here</li>
    <li>OOC bullet here</li>
    <li>OOC bullet here</li>
    <li>OOC bullet here</li>
    <li>OOC bullet here</li>
    <li>OOC bullet here</li>
  </ol>
</div>


<!-- please no delete -->
<a id="credit" href="https://roleplay.chat/profile.php?user=Ellexide" target="_blank" title="Coder boi"></a>
<script src='https://themonstrousdev.github.io/profiles/Addons/free.js'></script>