hi hi! if you like my f2u codes, pls consider supporting with a kofi!
<!-------------------------------------------------
F2U Lenient — Bootstrap Version
(code by jiko)
------------------------------
RULES
> read this thoroughly please, and maybe drop a small comment saying that you've read it? :'3
thank youu [ https://toyhou.se/~bulletins/127417.code-rules ]
> turn OFF WYSIWYG (in your display settings)
> turn ON Code Editor
------------------------------
TIPPY TIPS
> insert your img links INSIDE brackets or quotation marks!!
> looking for a good online code editor? try [ https://th.circlejourney.net/# ] !
------------------------------
PALETTE
> accent ------------- [ -success ]
(you can choose from -primary, -warning, -danger, -info, or -secondary)
use control/command + f to quickly change the colours!
------------------------------------------------->
<div style="font-size:95%;">
<div style="position:relative; overflow:hidden; border-radius:25px; box-shadow:0px 0px 20px rgba(0,0,0,0.1)">
<!-------------------------------------------------
BACKROUND
------------------------------------------------->
<div class="bg-success" style="position:absolute; top:0; right:0; bottom:0; left:0; z-index:-1; transform:scale(1.2,1.2);
/* BACKGROUND SETTINGS
---------------------------------------- */;
background-size:cover;
background-position:center;
background-image:url(https://images.unsplash.com/photo-1662182911222-2b02d7925066?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=987&q=80);
/* BLUR SETTING
> 0px is no blur
---------------------------------------- */;
filter:blur(6px);
">
</div>
<!-------------------------------------------------
CODE STARTS
------------------------------------------------->
<div class="mx-auto p-sm-4 p-3 my-sm-5" style="position:relative; z-index:420; max-width:750px;">
<!-------------------------------------------------
HALF-HIDDEN SUBTITLE
------------------------------------------------->
<div class="position:relative; z-index:-1;">
<div class="text-center font-italic mt-3" style="color:#fff; font-size:60px; font-family:times; font-weight:900; margin-bottom:-5px; line-height:40px">
lenient.
</div>
</div>
<!-------------------------------------------------
PROFILE
------------------------------------------------->
<div class="card border-0" style="border-radius:20px; box-shadow:0px 0px 30px rgba(0,0,0,0.2)">
<div class="row no-gutters" style="border-radius:19px; overflow:hidden">
<!-- FOCAL IMAGES
---------------------------------------------->
<div class="col-md-5">
<!-- BACKGROUND -------------------------->
<div class="h-100 bg-success" style="min-height:300px;
background-image:url(https://images.unsplash.com/photo-1662182911222-2b02d7925066?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=987&q=80);
background-size:cover;
background-position:center;">
<!-- CHARACTER IMAGE (OPTIONAL) --------------------->
<!--
> if you're using a full image rather than a headshot of the character, you're going to have to be finicky with the background-size and/or background-position below
> however, you're welcome to delete this part and just use the above for the overall image ovo)b
-->
<div class="h-100" style="min-height:300px;
background-image:url(IMG_ADDRESS_HERE);
background-size:550px;
background-position:top center;
background-repeat:no-repeat;">
</div>
</div>
</div>
<!-- BASIC INFOS
---------------------------------------------->
<!--
> works best with short answers!
-->
<div class="col-md-7 my-auto">
<div class="px-3 pt-3 pb-2">
<div class="d-flex justify-content-between align-items-center">
<span class="font-weight-bold font-italic text-success" style="letter-spacing:1px;">NAME</span>
<span style="font-family:times; font-size:110%; letter-spacing:0.5px;">
content
</span>
</div>
<!---------------------------------------->
<hr class="my-2" style="border-width:1px;">
<div class="d-flex justify-content-between align-items-center">
<span class="font-weight-bold font-italic text-success" style="letter-spacing:1px;">NICKNAMES</span>
<span style="font-family:times; font-size:110%; letter-spacing:0.5px;">
content
</span>
</div>
<!---------------------------------------->
<hr class="my-2" style="border-width:1px;">
<div class="d-flex justify-content-between align-items-center">
<span class="font-weight-bold font-italic text-success" style="letter-spacing:1px;">AGE</span>
<span style="font-family:times; font-size:110%; letter-spacing:0.5px;">
content
</span>
</div>
<!---------------------------------------->
<hr class="my-2" style="border-width:1px;">
<div class="d-flex justify-content-between align-items-center">
<span class="font-weight-bold font-italic text-success" style="letter-spacing:1px;">GENDER</span>
<span style="font-family:times; font-size:110%; letter-spacing:0.5px;">
content (pro/nouns)
</span>
</div>
<!---------------------------------------->
<hr class="my-2" style="border-width:1px;">
<div class="d-flex justify-content-between align-items-center">
<span class="font-weight-bold font-italic text-success" style="letter-spacing:1px;">ORIENTATION</span>
<span style="font-family:times; font-size:110%; letter-spacing:0.5px;">
content
</span>
</div>
<!---------------------------------------->
<hr class="my-2" style="border-width:1px;">
<div class="d-flex justify-content-between align-items-center">
<span class="font-weight-bold font-italic text-success" style="letter-spacing:1px;">RACE</span>
<span style="font-family:times; font-size:110%; letter-spacing:0.5px;">
or species
</span>
</div>
<!---------------------------------------->
<hr class="my-2" style="border-width:1px;">
<div class="d-flex justify-content-between mb-2">
<span class="font-weight-bold font-italic text-success" style="letter-spacing:1px;">OCCUPATION</span>
<span style="font-family:times; font-size:110%; letter-spacing:0.5px;">
content
</span>
</div>
<!---------------------------------------->
<hr class="my-2" style="border-width:1px;">
<div class="d-flex justify-content-between align-items-center">
<span class="font-weight-bold font-italic text-success" style="letter-spacing:1px;">THEME</span>
<a class="text-reset" style="font-family:times; font-size:110%; letter-spacing:0.5px;"
href="LINK_TO_YT_VIDEO_OR_SPOTIFY">
song title
</a>
</div>
<!-- add/delete more above this line! -->
</div>
</div>
<!-- MAIN QUOTE, SUMMARY OR LYRIC
---------------------------------------------->
<div class="col-12 bg-faded">
<div class="p-4 text-center text-muted">
<!-- TOP DIVIDER -->
<div class="faded mx-auto d-flex justify-content-between align-items-center mb-2" style="max-width:300px;">
<hr class="flex-fill">
<i class="fa-light fa-seedling fa-fw mx-2"></i>
<hr class="flex-fill">
</div>
<!-- TEXT -->
<div class="font-italic" style="font-size:120%; font-family:times;">
Quote with a <b class="text-success">highlighted</b> word here.
</div>
<!-- BOTTOM DIVIDER -->
<div class="faded mx-auto d-flex justify-content-between align-items-center mt-2" style="max-width:300px;">
<hr class="flex-fill">
<i class="fa-light fa-seedling fa-fw mx-2 fa-flip-vertical"></i>
<hr class="flex-fill">
</div>
</div>
</div>
<!-- TAB CONTENT
---------------------------------------------->
<div class="col-12">
<div class="tab-content p-md-4 p-3" style="height:350px; overflow:auto;">
<!-- BIOGRAPHY --------------------------->
<div class="tab-pane fade text-justify active show" id="lenient_one">
<!-- ONE -->
<div class="p-2 text-uppercase font-weight-bold font-italic text-success" style="letter-spacing:1px;">
Subheading
</div>
<div style="font-family:times; font-size:110%; letter-spacing:0.5px">
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vel eros in nisl lobortis suscipit. Curabitur fringilla ante elit, sit amet mattis odio posuere at. Donec sem massa, scelerisque a ultricies a, mattis mollis felis. Sed diam mauris, sagittis non magna et, pharetra ornare eros. Fusce non congue leo.</p>
</div>
<!-- TWO -->
<hr><div class="p-2 text-uppercase font-weight-bold font-italic text-success" style="letter-spacing:1px;">
Subheading
</div>
<div style="font-family:times; font-size:110%; letter-spacing:0.5px">
<p>Fusce elit velit, egestas ut tortor ac, semper pulvinar erat. Sed eget enim ut metus sollicitudin lacinia nec a diam. Praesent volutpat lectus et maximus tempor. Phasellus sed ornare urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae.</p>
</div>
<!-- THREE -->
<hr><div class="p-2 text-uppercase font-weight-bold font-italic text-success" style="letter-spacing:1px;">
Subheading
</div>
<div style="font-family:times; font-size:110%; letter-spacing:0.5px">
<p>Integer neque ipsum, consectetur sit amet nunc vitae, sollicitudin pulvinar dui. Nulla pretium tincidunt sem, vitae lobortis risus aliquam nec. Proin dapibus elementum aliquet. Aliquam sit amet elementum libero. Cras molestie, ipsum tincidunt sodales pulvinar, sapien dolor tincidunt diam, non luctus sem tellus nec diam. Suspendisse egestas purus et lorem finibus scelerisque eget id felis.</p>
</div>
<!-- add more above this line -->
</div>
<!-- DESIGN --------------------------->
<div class="tab-pane fade" id="lenient_two">
<!-- SUMMARY ---------------------->
<div class="p-2 text-uppercase font-weight-bold font-italic text-success" style="letter-spacing:1px;">Appearance</div>
<div class="text-justify" style="font-family:times; font-size:110%; letter-spacing:0.5px">
<p>Etiam orci dolor, lobortis non risus quis, feugiat vehicula lacus. Nullam sit amet sapien laoreet, eleifend dui nec, consequat elit. Fusce gravida justo in sem ultricies varius. Nullam tincidunt libero imperdiet tortor sollicitudin porttitor. Duis finibus libero vitae nisl posuere consectetur. Duis fringilla sagittis tellus, et dapibus elit suscipit id. In in dui quis elit sagittis imperdiet non et velit. </p>
</div>
<hr>
<!-- DETAILS ---------------------->
<div class="row no-gutters flex-row-reverse">
<!-- IMAGE -->
<div class="col-md-5">
<div class="h-100 bg-faded" style="min-height:250px;
background-image:url(https://f2.toyhou.se/file/f2-toyhou-se/characters/17712606?1661490969);
background-size:cover;
background-position:center;
border-radius:20px"></div>
</div>
<!-- BASIC INFO PT.2 -->
<div class="col-md-7 pr-md-3 pt-md-0 pt-3 my-auto">
<div class="d-flex justify-content-between align-items-center">
<span class="font-weight-bold font-italic text-success" style="letter-spacing:1px;">DESIGNER</span>
<a class="text-reset" style="font-family:times; font-size:110%; letter-spacing:0.5px;"
href="LINK_TO_CREATOR">
content
</a>
</div>
<hr class="my-2">
<div class="d-flex justify-content-between align-items-center">
<span class="font-weight-bold font-italic text-success" style="letter-spacing:1px;">OBTAINED BY</span>
<span style="font-family:times; font-size:110%; letter-spacing:0.5px;">
content
<!-- e.g. initial creation/trade/brought/custom -->
</span>
</div>
<hr class="my-2">
<div class="d-flex justify-content-between align-items-center">
<span class="font-weight-bold font-italic text-success" style="letter-spacing:1px;">WORTH</span>
<span style="font-family:times; font-size:110%; letter-spacing:0.5px;">
content
</span>
</div>
<hr class="my-2">
<div class="d-flex justify-content-between align-items-center">
<span class="font-weight-bold font-italic text-success" style="letter-spacing:1px;">AESTHETIC</span>
<span style="font-family:times; font-size:110%; letter-spacing:0.5px;">
content
</span>
</div>
<hr class="my-2">
<div class="d-flex justify-content-between align-items-center">
<span class="font-weight-bold font-italic text-success" style="letter-spacing:1px;">LINK TO REF</span>
<a class="text-reset" style="font-family:times; font-size:110%; letter-spacing:0.5px;"
href="LINK_TO_REFSHEET">
boop!
</a>
</div>
<!-- add more above this line! -->
</div>
</div>
<hr>
<!-- DESIGN NOTES ----------------->
<div class="mt-3 p-2 text-uppercase font-weight-bold font-italic" style="letter-spacing:1px;">Design Notes</div>
<ul class="mb-0 p-0 fa-ul" style="font-family:times; font-size:110%; letter-spacing:0.5px">
<li class="my-1 text-success">
<span class="fa-li"><i class="fa-regular fa-plus"></i></span>
<span class="text-body">aliquam erat volutpat</span>
</li>
<li class="my-1 text-success">
<span class="fa-li"><i class="fa-regular fa-plus"></i></span>
<span class="text-body">duis tortor nisi, mattis ut augue nec</span>
</li>
<li class="my-1 text-success">
<span class="fa-li"><i class="fa-regular fa-plus"></i></span>
<span class="text-body">ullamcorper accumsan nisl</span>
</li>
<!-- add more above this line! -->
</ul>
</div>
<!-- TRIVIA ------------------------------>
<div class="tab-pane fade" id="lenient_three">
<!-- PREFERENCES --------------------->
<!--
> suited for short/one-worded answers!
-->
<div class="row no-gutters mb-4">
<!-- LIKES -->
<div class="col">
<div class="p-2 text-uppercase font-weight-bold font-italic text-success" style="letter-spacing:1px;">Likes</div>
<ul class="mb-0 p-0 fa-ul" style="font-family:times; font-size:110%; letter-spacing:0.5px">
<li class="my-1 text-success">
<span class="fa-li"><i class="fa-regular fa-check"></i></span>
<span class="text-body">content</span>
</li>
<li class="my-1 text-success">
<span class="fa-li"><i class="fa-regular fa-check"></i></span>
<span class="text-body">content</span>
</li>
<li class="my-1 text-success">
<span class="fa-li"><i class="fa-regular fa-check"></i></span>
<span class="text-body">content</span>
</li>
<!-- add more above this line! -->
</ul>
</div>
<!-- DIVIDER -->
<div class="col-auto px-2">
<div class="card h-100" style="border-width:0 1px 0 0"></div>
</div>
<!-- DISLIKES -->
<div class="col">
<div class="p-2 text-uppercase font-weight-bold font-italic text-success" style="letter-spacing:1px;">Dislikes</div>
<ul class="mb-0 p-0 fa-ul" style="font-family:times; font-size:110%; letter-spacing:0.5px">
<li class="my-1 text-success">
<span class="fa-li"><i class="fa-regular fa-times"></i></span>
<span class="text-body">content</span>
</li>
<li class="my-1 text-success">
<span class="fa-li"><i class="fa-regular fa-times"></i></span>
<span class="text-body">content</span>
</li>
<li class="my-1 text-success">
<span class="fa-li"><i class="fa-regular fa-times"></i></span>
<span class="text-body">content</span>
</li>
<!-- add more above this line! -->
</ul>
</div>
</div>
<hr>
<!-- 5/5 STATS ----------------------->
<!--
> full ===== <i class="fa-solid fa-circle text-success"></i>
> empty ==== <i class="fa-light fa-circle text-muted"></i>
> feel free to replace fa-circle with any icon from [fontawesome.com]!
-->
<div class="p-2 text-uppercase font-weight-bold font-italic text-success" style="letter-spacing:1px;">Stats</div>
<div class="row no-gutters m-n2">
<div class="col-md-6 p-2 text-center">
<div class="d-flex justify-content-between flex-row-reverse align-items-center">
<span style="font-family:times; font-size:110%; letter-spacing:0.5px">
intelligence
</span>
<div>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-light fa-circle text-muted"></i>
<i class="fa-light fa-circle text-muted"></i>
</div>
</div><hr class="my-2">
</div>
<!-------------------------------->
<div class="col-md-6 p-2 text-center">
<div class="d-flex justify-content-between flex-row-reverse align-items-center">
<span style="font-family:times; font-size:110%; letter-spacing:0.5px">
charisma
</span>
<div>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-light fa-circle text-muted"></i>
<i class="fa-light fa-circle text-muted"></i>
</div>
</div><hr class="my-2">
</div>
<!-------------------------------->
<div class="col-md-6 p-2 text-center">
<div class="d-flex justify-content-between flex-row-reverse align-items-center">
<span style="font-family:times; font-size:110%; letter-spacing:0.5px">
confidence
</span>
<div>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-light fa-circle text-muted"></i>
<i class="fa-light fa-circle text-muted"></i>
</div>
</div><hr class="my-2">
</div>
<!-------------------------------->
<div class="col-md-6 p-2 text-center">
<div class="d-flex justify-content-between flex-row-reverse align-items-center">
<span style="font-family:times; font-size:110%; letter-spacing:0.5px">
empathy
</span>
<div>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-light fa-circle text-muted"></i>
<i class="fa-light fa-circle text-muted"></i>
</div>
</div><hr class="my-2">
</div>
<!-------------------------------->
<div class="col-md-6 p-2 text-center">
<div class="d-flex justify-content-between flex-row-reverse align-items-center">
<span style="font-family:times; font-size:110%; letter-spacing:0.5px">
patience
</span>
<div>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-light fa-circle text-muted"></i>
<i class="fa-light fa-circle text-muted"></i>
</div>
</div><hr class="my-2">
</div>
<!-------------------------------->
<div class="col-md-6 p-2 text-center">
<div class="d-flex justify-content-between flex-row-reverse align-items-center">
<span style="font-family:times; font-size:110%; letter-spacing:0.5px">
humour
</span>
<div>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-solid fa-circle text-success"></i>
<i class="fa-light fa-circle text-muted"></i>
<i class="fa-light fa-circle text-muted"></i>
</div>
</div><hr class="my-2">
</div>
<!-- add more above this line! -->
</div>
<!-- FUN FACTS ----------------------->
<div class="mt-3 p-2 text-uppercase font-weight-bold font-italic" style="letter-spacing:1px;">Trivia</div>
<ul class="mb-0 p-0 fa-ul" style="font-family:times; font-size:110%; letter-spacing:0.5px">
<li class="my-1 text-success">
<span class="fa-li"><i class="fa-regular fa-angle-right"></i></span>
<span class="text-body">vivamus condimentum mi ac tortor imperdiet consequat</span>
</li>
<li class="my-1 text-success">
<span class="fa-li"><i class="fa-regular fa-angle-right"></i></span>
<span class="text-body">sed quis odio elit. Quisque vitae fringilla purus, vitae ultrices diam</span>
</li>
<li class="my-1 text-success">
<span class="fa-li"><i class="fa-regular fa-angle-right"></i></span>
<span class="text-body">praesent at leo vitae diam hendrerit posuere vel at lorem</span>
</li>
<!-- add more above this line! -->
</ul>
</div>
<!-- RELATIONSHIPS ----------------------->
<div class="tab-pane fade" id="lenient_four">
<!-- RELATION 1 ---------------------->
<div class="row no-gutters">
<div class="col-auto">
<!-- ICON -->
<!-- best if 200x200 or squared -->
<img src="https://f2.toyhou.se/file/f2-toyhou-se/characters/17712606?1661490969"
class="bg-faded"
style="height:80px; width:80px; border-radius:10px;">
</div>
<div class="col pl-3">
<a href="LINK_TO_CHARACTER" class="p-2 text-uppercase text-success font-weight-bold font-italic" style="letter-spacing:1px;">
Character Name
</a>
<div class="text-muted font-italic" style="font-size:120%; font-family:times;">
( relation )
</div>
<div class="text-justify" style="font-family:times; font-size:110%; letter-spacing:0.5px">
Proin placerat auctor dapibus. In hac habitasse platea dictumst. In tempor velit vel pellentesque volutpat.
</div>
</div>
</div>
<!-- RELATION 2 ---------------------->
<hr><div class="row no-gutters">
<div class="col-auto">
<!-- ICON -->
<!-- best if 200x200 or squared -->
<img src="https://f2.toyhou.se/file/f2-toyhou-se/characters/17712606?1661490969"
class="bg-faded"
style="height:80px; width:80px; border-radius:10px;">
</div>
<div class="col pl-3">
<a href="LINK_TO_CHARACTER" class="p-2 text-uppercase text-success font-weight-bold font-italic" style="letter-spacing:1px;">
Character Name
</a>
<div class="text-muted font-italic" style="font-size:120%; font-family:times;">
( relation )
</div>
<div class="text-justify" style="font-family:times; font-size:110%; letter-spacing:0.5px">
Fusce interdum ligula sed luctus eleifend.
</div>
</div>
</div>
<!-- RELATION 3 ---------------------->
<hr><div class="row no-gutters">
<div class="col-auto">
<!-- ICON -->
<!-- best if 200x200 or squared -->
<img src="https://f2.toyhou.se/file/f2-toyhou-se/characters/17712606?1661490969"
class="bg-faded"
style="height:80px; width:80px; border-radius:10px;">
</div>
<div class="col pl-3">
<a href="LINK_TO_CHARACTER" class="p-2 text-uppercase text-success font-weight-bold font-italic" style="letter-spacing:1px;">
Character Name
</a>
<div class="text-muted font-italic" style="font-size:120%; font-family:times;">
( relation )
</div>
<div class="text-justify" style="font-family:times; font-size:110%; letter-spacing:0.5px">
Nulla dapibus molestie vestibulum. Sed cursus, est et ornare ultrices, eros orci sodales nulla, eu porta massa arcu id massa. In hac habitasse platea dictumst. Suspendisse elementum dolor nec laoreet dapibus. Nam feugiat, tortor ac mattis imperdiet, lectus enim cursus ante, quis tempus mi nisl ac metus. Suspendisse potenti. Donec ultrices semper ultricies.
</div>
</div>
</div>
<!-- add more above this line! -->
</div>
</div>
</div>
<!-- TAB BUTTONS
---------------------------------------------->
<div class="col-12 bg-faded">
<div class="p-3">
<ul class="nav row no-gutters justify-content-center">
<li class="col-auto px-1 nav-item">
<a href="#lenient_one" class="active nav-link btn btn-default text-success border-0 align-items-center justify-content-center tooltipster" title="biography" data-toggle="tab" style="box-shadow:none; height:40px; width:40px; border-radius:50%">
<i class="fa-solid fa-seedling"></i>
</a>
</li>
<li class="col-auto px-1 nav-item">
<a href="#lenient_two" class="nav-link btn btn-default text-success border-0 align-items-center justify-content-center tooltipster" title="appearance" data-toggle="tab" style="box-shadow:none; height:40px; width:40px; border-radius:50%">
<i class="fa-solid fa-tree"></i>
</a>
</li>
<li class="col-auto nav-item px-1">
<a href="#lenient_three" class="nav-link btn btn-default text-success border-0 align-items-center justify-content-center tooltipster" title="trivia" data-toggle="tab" style="box-shadow:none; height:40px; width:40px; border-radius:50%">
<i class="fa-solid fa-trees"></i>
</a>
</li>
<li class="col-auto px-1 nav-item">
<a href="#lenient_four" class="nav-link btn btn-default text-success border-0 align-items-center justify-content-center tooltipster" title="relations" data-toggle="tab" style="box-shadow:none; height:40px; width:40px; border-radius:50%">
<i class="fa-solid fa-mountains"></i>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<!-------------------------------------------------
CREDITS
------------------------------------------------->
<div class="p-2">
<div class="faded small text-center text-monospace text-muted">
<!-- CREDIT FOR BACKGROUND -->
<a title="background image by Hiroyuki Sen" href="https://unsplash.com/photos/9L6BaV8sAZA"
class="text-reset tooltipster" style="text-decoration:none;">
<i class="fa-regular fa-image"></i>
</a>
/
<a title="code by jiko" href="https://toyhou.se/20348790."
class="text-reset tooltipster" style="text-decoration:none;">
<i class="fa-regular fa-code"></i>
</a>
</div>
</div>
</div>
<!-- CODE ENDS -->