code fixed

<!------------
  ⏻ - WIKIA V2 (TH) by watergems
  do not remove credit/claim
  color: primary
  links: @@characterID
  ------------>

<!------ INFOBOX ------>
<div class="row no-gutters">
<div class="col-md-8 col-sm-12 mr-md-2 mr-sm-0" style="max-width: 47em">
<!------ QUOTE ------>
<div class="row mb-3">
  <div class="col-md-10 offset-md-1">
<div class="card p-2 bg-faded card-outline-default"><span class="text-center mb-2">
<i class="fa-lg fas fa-quote-left float-left text-primary" />
<i class="fa-lg fas fa-quote-right float-right text-primary" />
  <i>Augh!!! Leave me alone!! What did I do to upset you?! Do you need to talk? A hug? I'm sure we're all getting real sick of running!! </i>
</span><div class="text-right text-muted">
  ― Kaz; being chased by Rod once again.
</div></div>
</div></div>

<!------ INTRODUCTION ------>
  <p><strong>Kaz Lovato is the main protagonist</strong> of Elk Creek. They go through life wanting to help as many people as possible. Which is difficult when your lycanthropy can mean that you end up hurting as many people as you help. Kaz was bitten as a child and can't help but be upset at his situation. They moved to Elk Creek to be closer to more lycanthropy help resources which are few and far between. Bafflingly enough, he is the number one target of the Syndicate of Vegnxy. </p>
  <p> His werewolf form is huge and menacing, with raggard fur and a long snout full of razor-sharp teeth.</p>

<!------ TABLE OF CONTENTS // credit to @lowkeywicked for toggle base code ------>
<!-- SUBSECTIONS // copy+paste <ol> section when needed -->
<div class="row mb-3"><a id="toc"></a>
<div class="col-md-5 mb-2"><div class="card bg-faded card-outline-default">
<h6 class="p-2 mb-0 text-center">Contents <small>[<a data-toggle="collapse" href="#tocshow2">show</a>]</small></h6>
<ol class="collapse p-2 pt-0 pl-4 rounded-bottom mb-0" id="tocshow2">
  <li><a href="#appearance">Appearance</a></li>
  <li><a href="#personality">Personality</a></li>
  <li><a href="#history">History</a></li>
  <li><a href="#abilities">Abilities</a></li>
  <ol class="pl-3" style="list-style-type: lower-alpha">
    <li><a href="#unique">Unique Abilities</a></li>
    <li><a href="#skillset">Skillset</a></li>
  </ol>
  <li><a href="#relationships">Relationships</a></li>
  <ol class="pl-3" style="list-style-type: lower-alpha">
    <li><a href="#nameone">Name One</a></li>
    <li><a href="#nametwo">Name Two</a></li>
  </ol>
  <li><a href="#trivia">Trivia</li>
</ol></div>
</div></div>

<!------ APPEARANCE ------>
<div class="profile-fields-title mt-2">
  <a id="appearance" /><h2>Appearance <a href="#toc"><i style="font-size:.75em" class="fas fa-bars" /></a></h2>
</div><div class="card bg-faded mt-1 mb-2 border-top-0" style="height:1px;"> </div>
  <p>Kaz is a tall mesomorphic teenager. He is a brunette with shoulder-length curly hair that is usually styled into a low ponytail. Her tail matches the length, colour and texture of her hair. They have a thin layer of greyish-brown fur on their body. Their ears are long and pointed, and the fur on them is thicker and a different colour from the rest of their body. They have large yellow eyes with slitted pupils that widen when happy or satisfied, and grow more slitted when threatened or angry. They have round dark eyebrows. </p>

<!------ PERSONALITY ------>
<div class="profile-fields-title mt-2">
  <a id="personality" /><h2>Personality <a href="#toc"><i style="font-size:.75em" class="fas fa-bars" /></a></h2>
</div><div class="card bg-faded my-1 border-top-0" style="height:1px;"> </div>
  <p>Kaz is a sweet kid with a big heart. They are full of life, love and laughter. They care about everyone and want to help everyone, no matter the cost, by which I mean NO MATTER the cost. He's prepared to throw himself into ongoing traffic just to save a lizard from getting hit. She's very empathetic and believes that there is good in absolutely everyone and no one is beyond saving or redemption. Unfortunately, caring about everyone means that she’s a little bit too trusting. Sometimes he will end up helping those who do not want to be helped or being kind to the wrong person. He's very easy to manipulate. She's a rather pushy person and will basically force her help onto you, even if you don't actually want it. Kaz is a born leader. He listens, he understands, he's caring yet firm. She gets incredibly distressed if she thinks she's hurt someone, to the point of being absolutely inconsolable. When confronted with this situation or when she has a normal selfish teenage thought, it makes her question everything she stands for and everything they are. They hate himself when this kind of thing happens, and it can be hard to convince them that they're not a terrible person.</p>

<!------ HISTORY ------>
<div class="profile-fields-title mt-2">
  <a id="history" /><h2>History <a href="#toc"><i style="font-size:.75em" class="fas fa-bars" /></a></h2>
</div><div class="card bg-faded mt-1 mb-2 border-top-0" style="height:1px;"> </div>
  <p>Hundreds of years before Kaz was born, the angel Hothyf Vegnxy purged every werewolf he and his followers could find. The remaining werewolves went into hiding in the Kangaroo Mountains where they were eventually found and killed. Two escaped and gave birth to a werewolf named Tala. Tala’s parents soon were also discovered and were killed. Fortunately, Tala was well hidden and survived the attack. She grew up in the forest with no parents and grew up to live like a wild animal.</p>
  <p>One winter, Tala was very hungry and saw a small boy walking in the forest. She attacked him but was killed by his father before she could do any real damage. The boy didn’t suffer any serious injuries but soon his appearance started physically changing. He was diagnosed with severe physical Lycanthropy and the doctor recommended that Kaz and his mother moved away from the forest into the city where there are more resources readily available for his condition. Kaz loved his old house and was very sad about the move. He had also not attended a proper school before this point. When he arrived, it was off to a bad start. The students didn't seem to like him much. They'd never seen anything like her. Eventually, that all changed. She befriended her main attacker, the one who disliked her from the beginning. Over time, the other students realised he was perfectly nice and grew to like them.</p>

<!------ ABILITIES ------>
<div class="profile-fields-title mt-2">
  <a id="abilities" /><h2>Abilities <a href="#toc"><i style="font-size:.75em" class="fas fa-bars" /></a></h2>
</div><div class="card bg-faded mt-1 mb-2 border-top-0" style="height:1px;"> </div>
  <h4 class="mb-1">Regular <a href="#toc"><i style="font-size:12px" class="fas fa-bars" /></a></h4>
<ul class="pl-4">
  <li><b>Teeth:</b> has the properties of magical weapons that can pierce the phantom.</li>
  <li><b>Strength:</b> Kaz is physically very strong because of his lycanthropy.</li>
</ul>
  <h4 class="mb-1">Transformed <a href="#toc"><i style="font-size:12px" class="fas fa-bars" /></a></h4>
He's very powerful in his werewolf form. He cannot be harmed with magical weapons.

<!------ RELATIONSHIPS ------>
<div class="profile-fields-title mt-2">
  <a id="relationships" /><h2>Relationships <a href="#toc"><i style="font-size:.75em" class="fas fa-bars" /></a></h2>
</div><div class="card bg-faded mt-1 mb-2 border-top-0" style="height:1px;"> </div>
  <a id="nameone" /><h4 class="mb-1">Scraps <a href="#toc"><i style="font-size:12px" class="fas fa-bars" /></a></h4>
<!------ QUOTE // copy+paste or remove as needed ------>
<div class="row mb-1"><div class="col-md-5">
<div class="card p-2 bg-faded card-outline-default">
<span class="text-center mb-2">
<i class="fas fa-quote-left float-left text-primary" />
<i class="fas fa-quote-right float-right text-primary" />
 <i>Scrappy is so great!!! Nothing makes me happier than getting a genuine smile out of her. Other than maybe getting a smile out of Azeal? I love her! Platonically! Haha. </i>
</span></div></div></div>
<!-- END QUOTE -->
  <p>Kaz and Scraps are very similar to each other, yet very different. They have tons of fun together, but they also argue a lot. They're both very passionate and outgoing, always positive that THEIR idea is right. This leads to a frequent butting of heads from the two of them. They're incredibly powerful when they work as a team and their combined perspectives can thwart any foe, when they can come to any sort of agreement at least. They deeply care about each other in a way that almost... transcends friendship. Nothing angers Scraps more than seeing Kaz get hurt by someone that they trusted.</p>
  <a id="nametwo" /><h4 class="mb-1">Azeal <a href="#toc"><i style="font-size:12px" class="fas fa-bars" /></a></h4>
  <!------ QUOTE // copy+paste or remove as needed ------>
<div class="row mb-1"><div class="col-md-5">
<div class="card p-2 bg-faded card-outline-default">
<span class="text-center mb-2">
<i class="fas fa-quote-left float-left text-primary" />
<i class="fas fa-quote-right float-right text-primary" />
 <i>Azeal is a great friend. I see him as almost a project in a way. No, that sounds bad. I want to make him more confident in himself. I don't want to overwhelm him though..</i>
</span></div></div></div>
<!-- END QUOTE -->
  <p>Kaz likes Azeal a lot, but that friendship is mixed with pity. He doesn't really understand Azeal like Scraps does, but she wants to. She has no idea how to get him to open up, though, and it makes them very sad and at times frustrated. They try to take Scraps's advice and just leave him alone, but it's hard when she knows she can make him happier if he would let her.</p>

  <a id="nametwo" /><h4 class="mb-1">Hothyf & Rod <a href="#toc"><i style="font-size:12px" class="fas fa-bars" /></a></h4>
  <!------ QUOTE // copy+paste or remove as needed ------>
<div class="row mb-1"><div class="col-md-5">
<div class="card p-2 bg-faded card-outline-default">
<span class="text-center mb-2">
<i class="fas fa-quote-left float-left text-primary" />
<i class="fas fa-quote-right float-right text-primary" />
 <i>Those guys scare the baJEEBERS out of me! Sorry for my language, but they do! They won't give it a break!!! Leave me alone! Or just talk to me and tell me what I did wrong!!</i>
</span></div></div></div>
<!-- END QUOTE -->
  <p>Kaz has no idea why these weird men are suddenly out for their blood. It makes them very upset. Why can't they just sit down and talk things out? It's kind of hard to do that while he's running for his life, though. She feels especially bad for Rod, who she percieves as lost and lonely. Hothyf, though... he's terrified of him.</p>

<!------ TRIVIA ------>
<div class="profile-fields-title mt-3">
  <a id="trivia" /><h2>Trivia <a href="#toc"><i style="font-size:.75em" class="fas fa-bars" /></a></h2>
</div><div class="card bg-faded my-1 border-top-0" style="height:1px;"> </div>
<ul class="pl-4">
  <li>Kaz is a vegan! He's been one since he was born, since he was born into a vegan family. His mother even works at a vegan restaurant. His favourite food is mushrooms.</li>
  <li>One of her hobbies is scrapbooking. Kaz loves to preserve her memories on paper. She sometimes gives out 'friendship diaries' to her friends as presents. Scraps and Azeal both have about 5 of them now. They also really like flower pressing.</li>
  <li>Secretly, he wishes to be human again.</li>
  <li>His favourite kinds of dogs are yorkies.</li>
  <li>They identify as transfeminine, but don't feel ready to go on any kind of hormones yet.</li>
</ul>

</div>

<!-- TEST -->

<div class="col-md-4 col-sm-12 p-0 mb-3 ml-md-3 ml-sm-0">
<div class="card card-outline-primary bg-faded">
<!-- CHARACTER NAME -->
  <h2 class="card-primary card-header card-inverse text-center text-white">Kaz Lovato</h2>
<!-- IMAGE // if you have one image, remove this section -->
<ul class="nav d-flex flex-row p-2 mx-auto list-unstyled">
  <li class="nav-item"><a data-toggle="tab" class="nav-link btn btn-primary mx-1" href="#current">Current</a></li>
  <li class="nav-item"><a data-toggle="tab" class="nav-link btn btn-primary mx-1" href="#debut">Transformed</a></li>
  <li class="nav-item"><a data-toggle="tab" class="nav-link btn btn-primary mx-1" href="#kid">Kid</a></li>
</ul>
<div class="tab-content text-center"><div class="tab-pane fade width-auto active show" id="current">
  <img src="https://f2.toyhou.se/file/f2-toyhou-se/images/38138597_LpCWFMxdpwrOTsk.png?1645161802" class="pt-2 px-2" />
</div><div class="tab-pane fade width-auto" id="debut">
  <img src="http://placehold.it/800x1200" class="pt-2 px-2" />
  <div class="tab-content text-center"><div class="tab-pane fade width-auto active show" id="current">
  <img src="http://placehold.it/800x1200" class="pt-2 px-2" />
  </div>
</div></div>
<!-- IMAGE // if you have one image, remove the comment lines around the next line
  <img src="http://placehold.it/800x1200" class="mx-auto pt-2 px-2" />
-->
<!-- SUBHEADING 1 -->
  <h5 class="bg-primary text-white text-center py-2 mt-0 mb-2">Meta info</h5>
<!-- FIELDS 1 // copy+paste 5/7 rows as needed -->
<div class="row mb-2">
  <div class="col-5 pl-4 font-weight-bold" align="left">Designer</div>
  <div class="col-7 pr-4" align="right">@mugman</div>
  <div class="col-5 pl-4 font-weight-bold" align="left">Year of Creation</div>
  <div class="col-7 pr-4" align="right"> 2021 </div>
    <div class="col-5 pl-4 font-weight-bold" align="left">Original design</div>
  <div class="col-7 pr-4" align="right"> <a href="https://toyhou.se/10448194.kaz/11924447.old-design">Kaz von Vicious</a></div> </div>
</div>
<!-- SUBHEADING 2 // collapsible section, copy+paste and replace #heading2 as needed -->
  <h5 class="bg-primary text-white text-center py-2 mb-0 pl-4" style="padding-right:-.4rem">Character info </h5>
<div class="row mb-2">
  <div class="col-5 pl-4 font-weight-bold" align="left">Nicknames</div>
  <div class="col-7 pr-4" align="right">Kazzy (<a href="https://toyhou.se/10448316.scraps">Scraps</a>)</div>
  <div class="col-5 pl-4 font-weight-bold" align="left">&nbsp;</div>
  <div class="col-7 pr-4" align="right">Mutt (<a href="https://toyhou.se/10677922.rod">Rod</a>) </div>
  <div class="col-5 pl-4 font-weight-bold" align="left">&nbsp;</div>
  <div class="col-7 pr-4" align="right">Scoob (<a href="https://toyhou.se/10448633.azeal">Azeal</a>) </div>
 <div class="col-5 pl-4 font-weight-bold" align="left">&nbsp;</div>
  <div class="col-7 pr-4" align="right">the werewolf child (<a href="https://toyhou.se/10495023.hothyf">Hothyf</a>) </div>
 <div class="col-5 pl-4 font-weight-bold" align="left">Pronouns</div>
  <div class="col-7 pr-4" align="right">she/he/they; in no order</div>
   <div class="col-5 pl-4 font-weight-bold" align="left">Gender</div>
  <div class="col-7 pr-4" align="right">Genderfluid</div>
   <div class="col-5 pl-4 font-weight-bold" align="left">Age</div>
  <div class="col-7 pr-4" align="right">16</div>
   <div class="col-5 pl-4 font-weight-bold" align="left">Role</div>
  <div class="col-7 pr-4" align="right">Protagonist</div>
     <div class="col-5 pl-4 font-weight-bold" align="left">Occupation</div>
  <div class="col-7 pr-4" align="right">Works part time at her mum's resturaunt (Better in Beetroot) & as a dogwalker </div>
   <div class="col-5 pl-4 font-weight-bold" align="left">Status</div>
  <div class="col-7 pr-4" align="right">Alive</div>


</div>

<!-- SUBHEADING 1 -->
  <h5 class="bg-primary text-white text-center py-2 mt-0 mb-2">Preferences</h5>
<!-- FIELDS 1 // copy+paste 5/7 rows as needed -->
<div class="row mb-2">
  <div class="col-5 pl-4 font-weight-bold" align="left">Favourite colour</div>
  <div class="col-7 pr-4" align="right">Warm colours</div>
  <div class="col-5 pl-4 font-weight-bold" align="left">Favourite animal</div>
  <div class="col-7 pr-4" align="right"> All of them! (dogs) </div>
    <div class="col-5 pl-4 font-weight-bold" align="left">Likes</div>
  <div class="col-7 pr-4" align="right"> Animals, flowers, autumn, summer, pasteries, nature, scrapbooking, vegetables, helping people, smiles </div>
    <div class="col-5 pl-4 font-weight-bold" align="left">Dislikes</div>
  <div class="col-7 pr-4" align="right"> Meat, people getting hurt, losing control </div> </div>
</div>
</div>
<!------ END INFOBOX ------>
</div></div>

</div>

<!------ !! DO NOT DELETE CREDIT !! ------>
  <div class="float-right card bg-faded card-outline-default ml-1">
    <a href="http://toyhou.se/watergems" title="Layout by watergems" class="d-inline-flex text-primary" style="padding:10px 10px 9px;text-decoration:none"><i class="far fa-code" /></a>
  </div>