F2U ✦ starstruck / character profile 01

<!--------------------------------------------------------------------------------

✦ ⋯ ACCENT COLORS
     > accent #1: a66359

✦ ⋯ TO CHANGE THE MARGINS
     > adjust the max-width: 550px; to what best suits your tastes.
     > you may also add a certain height to it (min-height: 0px;),
     though i do not think it looks good.

--------------------------------------------------------------------------------->


  <div class="card bg-transparent m-5 border-0 mx-auto"
       style="max-width: 900px;">




<!--------------------------------------------------------------------------------

✦ ⋯ START OF THE CODE
     > main information

--------------------------------------------------------------------------------->


    <div class="row no-gutters">

        <!--------- doll / decoration image ------------------------------------->
        <div class="col-lg-4">
            <img src="https://f2.toyhou.se/file/f2-toyhou-se/images/95343866_BdCXpIxUXLkemeC.png">
    </div>


    <div class="col-lg-8">
        <p class="m-2"
           style="font-size: 18px;">
            <font style="color:#a66359;">
                ✸
            </font>

            <font style="letter-spacing: .2em">
                <i>PREFIXSUFFIX</i>
            </font>

            <font style="opacity: 0.4;
                         color:#a66359;">
                ✦
            </font>

            TRAIT 01

            <font style="opacity: 0.4;
                         color:#a66359;">
                ✦
            </font>

            TRAIT 02

            <font style="opacity: 0.4;
                         color:#a66359;">
                ✦
            </font>

            TRAIT 03
        </p>




<!--------------------------------------------------------------------------------

✦ ⋯ DIVIDER
     > to add an IMAGE divider, simply use this code instead:
     > you can adjust or entirely remove opacity if you wish.

     <img class="mb-2 my-2"
         src="URL"
         style="opacity: 0.3;">

--------------------------------------------------------------------------------->


    <!--------- divider --------------------------------------------------------->
    <div class="card bg-transparent mb-3 my-3"
         style="border-top: 1px solid #a66359;
                border-bottom: 0px solid;
                border-left: 0px solid;
                border-right: 0px solid;
                filter: drop-shadow(0px 0px 2px #a66359);
                opacity: 0.5;"></div>

    <!--------- about ----------------------------------------------------------->
    <div class="row no-gutters">
        <div class="col-sm-1">
            <i class="fa-duotone fa-solid fa-quote-left"
               style="opacity: 0.5;
                      color: #a66359;"></i>
        </div>

        <!--------- quote ------------------------------------------------------->
        <!--- put a quote here. make it as long as you want! -------------------->
        <div class="col-sm-10">
            <p class="m-1"
               style="text-align: center; font-size: smaller;">

                am i evil, archivist? is a thing evil when it simply obeys its own nature? when it embodies its nature? when that nature is created by those which revile it? — the magnus archives

            </p>
        </div>

        <div class="col-sm-1">
            <i class="fa-duotone fa-solid fa-quote-right"
               style="opacity: 0.5;
                      color: #a66359;"></i>
        </div>
    </div>


    <!--------- divider --------------------------------------------------------->
    <div class="card bg-transparent mb-3 my-3"
         style="border-top: 1px solid #a66359;
                border-bottom: 0px solid;
                border-left: 0px solid;
                border-right: 0px solid;
                filter: drop-shadow(0px 0px 2px #a66359);
                opacity: 0.5;"></div>




<!--------------------------------------------------------------------------------

✦ ⋯ GENERAL INFO

--------------------------------------------------------------------------------->


    <!--------- basic info ------------------------------------------------------>
    <p class="m-1">
        <font style="color:#a66359;">
            ⯏
        </font>

        （
             INFO
        ）

        <font style="font-size: smaller;
                     text-indent: 5px;;">
            <ul>

                <li>
                    <font style="color:#a66359;">
                        NAME
                    </font>
                     ;

                    nicknames
                </li>

                <li>
                    <font style="color:#a66359;">
                        AMAB / AFAB
                    </font>

                    ;

                    pro / nouns
                </li>

                <li>
                    <font style="color:#a66359;">
                        AFFILIATION
                    </font>

                    ;

                    affiliation
                </li>

                <li>
                    <font style="color:#a66359;">
                        ROLES
                    </font>

                    ;

                    role, subroles etc
                </li>

                <li>
                    <font style="color:#a66359;">
                        AGE
                    </font>

                    ;

                    number moons
                </li>

                <li>
                    <font style="color:#a66359;">
                        ORIENTATION
                    </font>

                    ;

                    blanksexual, blankromantic, monogamous etc
                </li>

                <li>
                    <font style="color:#a66359;">
                        PARTNER / s
                    </font>

                    ;

                    <a style="color:#a66359;" href="#">name</a>
                </li>

            </ul>
        </font>
    </p>



<!--------------------------------------------------------------------------------

✦ ⋯ CREDITS
     > please do not remove!
     > you MAY edit / move it around for aesthetics / personal aesthetics,
     however it must STILL remain visible !

--------------------------------------------------------------------------------->


  <p class="mx-auto p-2">
      <a href="https://toyhou.se/29519406.f2u-starstruck">
          <i class="fa-solid fa-code tooltipster"
             title="code by bumblebree" data-toggle-original="code by bumblebree"
             style="color: #a66359;
                    opacity: 0.4;"></i>
      </a>
  </p>
  </div>

  </div>