<!---------------------------------------------
Basics - Custom Colors Version
by LeafJelly
Plain without Deocrations
Hex Codes
Background: #ffe2aa
Info Backgrounds: #e7930e
Font: #FFF
Font Accent: #fffac3
Dividers: #d06200
Decorations: #bc5407
---------------------------------------------->
<div class="container-fluid rounded p-1 mx-auto" style="max-width:700px; font-weight:300; font-family:calibri; color:#FFF; background:#ffe2aa"><div class="row no-gutters">
<!-----Left------->
<div class="col-12 col-md-4 p-1"><div class="card bg-faded rounded border-0 p-2 text-center h-100" style="background:#e7930e;"><div class="my-auto">
<!-------------------------------
ICON
Replace the URL with a image url/address
-------------------------------->
<div style="background-image:url(
https://via.placeholder.com/100
); background-size:cover;background-position:center; height:100px;width:100px;" class="rounded-circle mx-auto"></div>
<div>
<!-------------------------------
Basic Character Info
-------------------------------->
<p style="font-size:1.3em; font-weight:400; font-variant:small-caps;
color:#fffac3">
Character Name
</p><hr class="m-0" style="border-color:#d06200">
<div class="row no-gutters">
<div class="col-6 text-right pr-1 my-auto" style="font-weight:400">
Age
<i class="far fa-hyphen"></i></div><div class="col-6 text-left">
Content
</div>
<!---------->
<div class="col-6 text-right pr-1 my-auto" style="font-weight:400">
Gender
<i class="far fa-hyphen"></i></div><div class="col-6 text-left">
Content
</div>
<!---------->
<div class="col-6 text-right pr-1 my-auto" style="font-weight:400">
Pronouns
<i class="far fa-hyphen"></i></div><div class="col-6 text-left">
Content
</div>
<!---------->
<div class="col-6 text-right pr-1 my-auto" style="font-weight:400">
Orientation
<i class="far fa-hyphen"></i></div><div class="col-6 text-left">
Content
</div>
<!---------->
<div class="col-6 text-right pr-1 my-auto" style="font-weight:400">
Occupation
<i class="far fa-hyphen"></i></div><div class="col-6 text-left">
Content
</div>
<!-----Delete the Link Line if you don't want a link----->
<div class="col-6 text-right pr-1 my-auto" style="font-weight:400">
Species
<i class="far fa-hyphen"></i></div><div class="col-6 text-left">
<a href="URL_HERE" style="color:#fffac3">Link</a>
Not a Link Content Here
</div>
<!----- Copy and paste Above here for More ------>
</div>
</div></div>
</div></div>
<!-------------------------------
Text Box
It does NOT scroll
-------------------------------->
<div class="col-12 col-md-8 p-1" ><div class="card bg-faded rounded border-0 p-0 text-center h-100" style="background:#e7930e;"><div class="my-auto p-3">
<!-------------------------------
Pride Flags or Character Ribbns
Mini Pride Flags : https://toyhou.se/6899962.mini-pride-flags
Large Pride Flags: https://toyhou.se/11507691.pride-flags-
character Ribbons: https://toyhou.se/4739396.-ribbons
-------------------------------->
<div>
<img src="https://f2.toyhou.se/file/f2-toyhou-se/images/22459146_fQbRQXya1W8MgDL.png?1623251736">
<img src="https://f2.toyhou.se/file/f2-toyhou-se/images/22461205_3l1VKp5w0kcyqZ2.png?1623251708">
<img src="https://f2.toyhou.se/file/f2-toyhou-se/images/22462732_oIAZdtNmsvjgmwL.png?1623251728">
<!---Copy and Paste Above here for More--->
</div>
<!---- Adjectives ----->
<span style="font-size:1.2em; font-variant:small-caps;font-weight:400;
color:#fffac3">
adj · adj · adj · adj
</span>
<!------------- Divider Start --------------->
<div class="col p-0 mb-2" style="color:#d06200"><div class="row no-gutters">
<hr class="col my-1 mr-3" style="border-color:#d06200">
<!--------- Symbol -------->
<i class="fas fa-sun mx-1"></i>
<!---- Copy and Paste above here for more Symbols ---->
<hr class="col p-0 my-1 ml-3" style="border-color:#d06200"></div></div>
<!------------- Divider End --------------->
<!------Copy and paste above here for more------>
<!----- Text -------->
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non.
</p>
<!---Copy and paste above here for more paragrpahs--->
</div>
<!-------------------------------
Mood Board
Replace the URLS with a image url/address
-------------------------------->
<div class="col-0 row no-gutters p-2" style="height:90px">
<!---------- Image 1 --------------->
<div class="col-4"><div style="background-image:url(
https://via.placeholder.com/400x90
);background-position:center; background-size:cover" class="h-100 rounded">
</div></div>
<!---------- Image 2 --------------->
<div class="col-4 px-1"><div style="background-image:url(
https://via.placeholder.com/400x90
);background-position:center; background-size:cover" class="h-100 rounded">
</div></div>
<!---------- Image 3 --------------->
<div class="col-4"><div style="background-image:url(
https://via.placeholder.com/400x90
);background-position:center; background-size:cover" class="h-100 rounded">
</div></div>
</div></div></div></div></div>
<!------------- CREDIT DO NOT REMOVE ------------------------------>
<div class="col-12 text-center px-1">
<a href="/LeafJelly" title="HTML by LeafJelly"><i class="fal fa-code text-muted mx-1 tooltipster"></i></a></div>
