<!---Third code! (Wahoo!) I honestly think this one's pretty niche, so thank you for considering using it!! I appreciate it a lot!... PLEASE BE SURE TO EDIT THIS WITH WYSWYG MODE TURNED OFF.--->
<div class="col-md-12">
<div class="card border-0 p-1 mx-auto" style="background: white;background-size: cover; background-position: justify; max-width: 350px; min-height: 100px; min-width: 150px; box-shadow: inset 0px 0px 1px 1px;">
<div class="col-md-0">
<div class="card border-0 p-2" style="background: url(BACKGROUND'S IMAGE URL GOES HERE);background-size: justify; background-position: center; max-width: 350px; min-height: 100px; min-width: 150px; box-shadow: inset 0px 0px 1px 1px;">
<!---Place your background image's URL here! It should fit regardless of size.--->
<!---Icon's image URL goes here- feel free to use either a non transparent icon, or even a chibi fullbody. It should fit in, regardless of size.--->
<div class="container">
<div class="row">
<div class="col-md-0">
<div class="card border-right; h-100" style="background: url(ICON'S IMAGE URL GOES HERE); background-size: cover; background-position: justify; background-repeat: no-repeat; max-height:150px; max-width: 150px; min-height: 100px; min-width: 100px; border-color: #000;"></i></a>
</div>
</div>
<!---After this point, you can replace color: #000 with another hex code, or replace it with color: white;--->
<div class="col-md-8">
<div style="font-size:large; color: #000">
<strong>
NAME</strong>
<!---(I reccomend writing the name in all caps, but that's just me)--->
<hr style="border-color: #000; margin-bottom:0; margin-top:0;">
</div>
<div style="font-size:small; color: #000">
<em>Write a short blurb here! You can make it longer, but it'll extend (the icon will extend too)!</em>
<!---If you just want the namecard, icon, and blurb, first ctrl + F 'NOTE' to find the second half, then start selecting and erase the area from here to there.--->
</div>
<div class="mt-2"></div>
<a data-toggle="collapse" href="#stats" role="button" aria-expanded="false" aria-controls="collapseExample">
<!---If you'd like a white down arrow, replace the current i class with <i class="fas fa-caret-down" style="color: white;"> (or, you can change the 'white' to any hex colour you'd like!--->
<center><i class="fas fa-caret-down">
</i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="collapse" id="stats">
<div class="col-md-12">
<div class="card border-0 p-1 mx-auto" style="background: white;background-size: cover; background-position: justify; max-width: 200px; min-height: 100px; min-width: 150px; box-shadow: inset 0px 0px 1px 1px;">
<div class="col-md-0">
<div class="card border-0 p-2" style="background: #000;background-size: cover; background-position: justify; max-width: 200px; min-height: 100px; min-width: 150px; box-shadow: inset 0px 0px 1px 1px;">
<div style="font-size:small; color: white"><center><strong>STATS:</strong></center></div>
<!---If you'd like to add additional stats/stat bars, copy and paste from <div style to top:0;"> below "DROPS" (or whatever you substitute there. You can also remove stats, just be sure to erase the same <div to top:0;> area as written above.--->
<div style="font-size:small; color: white"><center>
<em>Another short blurb goes here.</em></center><div class="mt-2"></div>
<hr style="border-color: white; margin-bottom:0; margin-top:0;">
<div class="col-sm"><strong>PRONOUNS</strong><span class="pull-right"><em>???</em></span></div>
<hr style="border-color: white; margin-bottom:0; margin-top:0;">
<div class="col-sm"><strong>SPECIES</strong><span class="pull-right"><em>???</em></span></div>
<hr style="border-color: white; margin-bottom:0; margin-top:0;">
<div class="col-sm"><strong>HP</strong><span class="pull-right"><em>12345</em></span></div>
<hr style="border-color: white; margin-bottom:0; margin-top:0;">
<div class="col-sm"><strong>OFF</strong><span class="pull-right"><em>12345</em></span></div>
<hr style="border-color: white; margin-bottom:0; margin-top:0;">
<div class="col-sm"><strong>DEF</strong><span class="pull-right"><em>12345</em></span></div>
<hr style="border-color: white; margin-bottom:0; margin-top:0;">
<!---I reccomend keeping items within the 'drops' column limited to 2 drops, but feel free to add more if you need it.--->
<div class="col-sm"><strong>DROPS</strong>
<span class="pull-right"><em>Item Drop (10%)</em></span>
<span class="pull-right"><em>Rarer Drop (1%)</em></span>
</div>
</a>
</center>
<!---NOTE: If you just want the blurb without the stats tab, here's where you stop.--->
</div>
</div>
</div>
</div>
</div>
</div>
<!---CREDIT LINE, PLEASE DO NOT REMOVE--->
<div style="font-size:x-small; color: #000">
<center><a href="https://toyhou.se/Coturnix"><i class="fas fa-moon-stars tooltipster" title="Code cooked up by Quail"></i></a> ◈
<!---Background and icon credits go here.--->
<a href="ICON CREDIT URL HERE"><i class="fas fa-icons tooltipster" title="ICON CREDIT HERE"></i></a>
◈ <a href="BACKGROUND CREDIT URL HERE"><i class="fas fa-window-maximize tooltipster" title="BACKGROUND CREDIT HERE"></i></a>