Small Decorative Code - Toxic Science Theme - IMG BG - Short

<!----------------------------
Free to Use Small Decorative Code
    Toxic Theme - Short Version
        Image Background
        by LeafJelly

Short Version: Mood board ONLY

    Hex Codes
Background 1: #8417F6
Background 2: #9CCF4C
Symbol: #A6D955
Symbol 2: #DE1AF6
Font: #3C008E

    Customization
fas - is the symbol weight s=solid r=regular l-light t=thin d=duotone
fa-symbol changes what the symbol is using the names found here https://fontawesome.com/ search for the symbols you want here adn replace the name with it.
transform:rotate(#deg) - Rotates Symbols
margin: #px #px - changes the positon of the symbol in Y X order. -Y moves up -X moves left. +Y moves down +X moves right.
---------------------------->
<div class="container col-md-8 col-lg-3 my-4 p-1">

<!-------------Background Image Replace the URl---------------->
<div class="card col-12 border-0 mt-4 p-2" style="height:280px; min-width:380px; background:#8417F6; border-radius:.6em;
background:url(https://ak.picdn.net/shutterstock/videos/35025604/thumb/1.jpg?ip=x480) center">

    <div class="text-center" >
    <!----------Decorations Left Side------------>
    <i class="far fa-flask" style="position:absolute; margin:-45px -155px; font-size:60px; transform:rotate(-25deg); color:#A6D955;"></i>
    <i class="fas fa-vial" style="position:absolute; margin:-40px -45px; font-size:45px; transform:rotate(-10deg); color:#A6D955"></i>
    <i class="fas fa-raindrops" style="position:absolute; margin:20px -60px; font-size:30px;; color:#A6D955"></i>

    <!-----------Background Image & Character Image Must be a Square Image------------->
        <img src="https://cdn.discordapp.com/attachments/395263691085316096/1035760970850631710/packimp_by_cbts004_crop.png"

        class="rounded-circle p-2 mb-1" style="height:120px; width:120px; margin-top:-50px; background:#8417F6;background-attachment:fixed;
        background:url(https://ak.picdn.net/shutterstock/videos/35025604/thumb/1.jpg?ip=x480)">
    <!----------Decorations Right Side------------>
    <i class="fas fa-vial" style="position:absolute; margin:-40px -5px; font-size:45px; transform:rotate(-80deg); color:#A6D955"></i>
    <i class="fas fa-raindrops" style="position:absolute; margin:20px 30px; font-size:30px; ; color:#A6D955"></i>
    <i class="fas fa-vial" style="position:absolute; margin:-40px 100px; font-size:60px; transform:rotate(-5deg); color:#A6D955"></i>


    </div>

<!-----------Content Box------------->
    <div class="card col-0 px-1 m-0 text-center" style="height:210px; overflow:auto; font-size:12px; background:#9CCF4C; color:#3C008E;">
         <p class="my-auto" style="color:#3C008E; font-size:13px">
         Name · Age · Pro/nouns
         <br>Gender · Race/Species · Occupation
         </p>
         <div class="col-auto m-1 p-0" style="border-bottom:1px solid #8417F6; margin:auto"></div>


<!--------Mood Board Replace the URLS ------------>
    <div class="row no-gutters pb-1">
        <div class="col-4 pr-1 border-0" style="height:130px">
            <div class="h-100" style="background-position:center;background-size:cover;
            background-image:url(

            https://directorsblog.nih.gov/wp-content/uploads/2016/12/neurons.jpg

            )"></div>
        </div>

        <div class="col-4 pr-1 border-0" style="height:130px">
            <div class="h-100" style="background-position:center;background-size:cover;
            background-image:url(

            https://www.ifam.fraunhofer.de/en/technologies/vuv-radiation-optimizes-silicone-properties-at-the-surface/jcr:content/stage/stageParsys/stage_slide_copy/image.img.jpg/1638879313096/silikonmodifikation-buehne.jpg

            )"></div>
        </div>

        <div class="col-4 pr-1 border-0" style="height:130px">
            <div class="h-100" style="background-position:center;background-size:cover;
            background-image:url(

            https://www.atcc.org/-/media/images/atcc/390x180/ra-0650_390x180.png?h=180&iar=0&w=390&rev=092cdf51323e4902a7ebcde40aa9d326&hash=420D16A78C9CE3BA58E62ED01206D078

            )"></div>
        </div>
    </div>
    </div>



</div>
<!---------Decorations at the bottom left--------------->
<i class="far fa-biohazard" style="position:absolute; margin:-30px -20px; font-size:50px; color:#DE1AF6"></i>


<div class="text-center" >
<!---------Credit do not remove--------------->
    <a href="/LeafJelly" title="HTML by LeafJelly" style="color:#8417F6"></i> <i class="fas fa-radiation"></i></a>

<!---------Decorations at the bottom right--------------->
<i class="far fa-biohazard" style="position:absolute; margin:-30px 150px; font-size:50px; color:#DE1AF6"></i>
</div>
</div>