TH Theme, F2U, Character Basic Soup

<!--- Main container / Cool background --->
<div class="container-fluid px-2 py-2 " style="max-width: 990px; border-radius:2em">

   <div class="container-fluid px-2 py-2 " style="max-width: 990px; border-radius:2em">

    <div class="card py-4 px-5 m-5 bg-faded" style="border-radius:2em">

    <div class="row">
        <div class="col-md-3 col-sm-6 text-center mb-4">
            <img src="https://via.placeholder.com/350" class="img-rounded" style="border-radius:2em;">
        </div>
        <div class="col-md-3 col-sm-6 text-center mb-4">
            <img src="https://via.placeholder.com/350" class="img-rounded" style="border-radius:2em;">
        </div>
        <div class="col-md-3 col-sm-6 text-center mb-4">
            <img src="https://via.placeholder.com/350" class="img-rounded" style="border-radius:2em;">
        </div>
        <div class="col-md-3 col-sm-6 text-center mb-4">
            <img src="https://via.placeholder.com/350" class="img-rounded" style="border-radius:2em;">
        </div>
    </div>


    <h1 class="text-primary font-weight-bold pull-right p-2" style="font-size:27px;"><i class="far fa-star " ></i> Basic Info</h1>

    <div class="row">

        <div class="col-sm">
            <h2 class="text-muted font-weight-bold">Quote/Title/Whatever</h2>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse sit amet felis interdum nibh efficitur feugiat. Praesent vel libero nec neque fermentum dapibus. Donec eget rhoncus dolor. Sed et neque sed arcu aliquam pharetra vel in purus. Nam dictum enim sem, quis ultrices nisl tincidunt non. Morbi purus ipsum, scelerisque vitae venenatis quis, porta eget libero. Sed auctor enim vitae mollis mattis. Aenean sed felis nec ex vehicula maximus eget sit amet enim.

Maecenas imperdiet sapien non venenatis tempus. Suspendisse vitae fringilla diam, eget blandit metus. Donec vulputate fringilla risus. Nulla metus augue, posuere a faucibus non, laoreet vitae eros. Etiam sapien tortor, interdum at tincidunt at, rutrum at leo. Donec lacus velit, pellentesque ut odio quis, commodo sollicitudin dolor. Fusce a eleifend felis. Phasellus consectetur accumsan augue rutrum ullamcorper. Proin viverra libero in sem ultricies, at pellentesque velit luctus. Duis efficitur venenatis leo eget pellentesque. Ut ultricies lectus at varius luctus. Ut laoreet commodo sodales. Nullam finibus vel massa in ornare.



        </div>
        <div class="col-sm">
            <h2 class="text-muted font-weight-bold">Other stuff</h2>
            <div class="card p-5" style="border-radius:2em;">

                <div class="row">

                    <div class="col-sm">
                        <span class="text-muted font-weight-bold"><i class="fas fa-heart"></i> Likes</span>
                        <ul>
                            <li>Content</li>
                            <li>Content</li>
                            <li>Content</li>
                        </ul>
                    </div>
                    <div class="col-sm">
                        <span class="text-muted font-weight-bold"><i class="fas fa-heart-broken"></i> Dislikes</span>
                        <ul>
                            <li>Content</li>
                            <li>Content</li>
                            <li>Content</li>
                        </ul>
                    </div>


                </div>

            <img src="https://via.placeholder.com/150" class="floatml-sm-2 d-block mx-auto mb-2 center" style="height: 250px; width: 250px; border-radius:50em;" >


            </div>

        </div>

    </div>



   </div>


</div>

<!--- Code credit, please don't remove D: --->
<center><span class="px-0 m-2"><a href="https://toyhou.se/sluggycodes"> <i class="fas fa-feather-alt fa-3x"></i> </a> </span> </center>