Freebie Another

<!----------
------------ default highlight color is #e8a4b0
------------ default link color is #999
------------ default font color is #14171A
------------
------------ use find & replace to quickly switch out hex codes
------------>

<div class="container-fluid card border-0 pt-5 pb-4" style="margin-top: -64px;">
<div class="container-fluid" style="max-width: 950px; letter-spacing: .4px;">
  <!--- SET BACKGROUND PATTERN HERE ------------------>
  <div style="background-image: url(https://f2.toyhou.se/file/f2-toyhou-se/images/18493463_E7zWDYoSCMyMjEH.png);
  border-radius: 1em; background-attachmen: fixed;" class="p-lg-5 p-md-4 p-3">
    <div class="row no-gutters">
            <div class="col-md-4 pr-md-2 mb-3">
              <!----- main focal image here -- will scale/crop with screen size -- focus of image is the top center ---->
                <div style="background-image: url(IMG_URL);
                background-size: cover; background-position:top center; min-height: 350px; border-radius: 1em; box-shadow: 0px 0px 12px rgba(0,0,0,.2);" class="h-100"></div>
            </div>
            <div class="col-md-8 pl-md-2 mb-3">
              <!----- content block ------------------------------------------>
                <div style="background: #fff; color: #14171A; box-shadow: 0px 0px 12px rgba(0,0,0,.2); border-radius: 1em;"
                class="pt-4 pb-1 px-md-4 px-3 w-100 h-100 d-flex">
                  <!---- stats use font awesome icons --- feel free to customize the icons ----->
                  <div class="row no-gutters my-auto">
                    <div class="col-md-6 pr-md-1 mb-3">

                      <i class="fas fa-user fa-fw" style="color: #e8a4b0;" />
                      Name
                    </div>
                    <div class="col-md-6 pl-md-1 mb-3">

                      <i class="fas fa-comment-dots fa-fw" style="color: #e8a4b0;" />
                      Alias/nickname
                    </div>

                    <div class="col-md-6 pr-md-1 mb-3">

                      <i class="fas fa-birthday-cake fa-fw" style="color: #e8a4b0;" />
                      Age
                    </div>
                    <div class="col-md-6 pl-md-1 mb-3">

                      <i class="fas fa-calendar-alt fa-fw" style="color: #e8a4b0;" />
                      birthdate
                    </div>

                    <div class="col-md-6 pr-md-1 mb-3">

                      <i class="fas fa-venus-mars fa-fw" style="color: #e8a4b0;" />
                      Gender
                    </div>
                    <div class="col-md-6 pl-md-1 mb-3">

                      <i class="fas fa-heartbeat fa-fw" style="color: #e8a4b0;" />
                      orientation
                    </div>

                    <div class="col-md-6 pr-md-1 mb-3">

                      <i class="fas fa-ruler fa-fw" style="color: #e8a4b0;" />
                      Height
                    </div>
                    <div class="col-md-6 pl-md-1 mb-3">

                      <i class="fas fa-question fa-fw" style="color: #e8a4b0;" />
                      Race
                    </div>

                    <div class="col-md-6 pr-md-1 mb-3">

                      <i class="fas fa-book fa-fw" style="color: #e8a4b0;" />
                      Role/what they do
                    </div>
                    <div class="col-md-6 pl-md-1 mb-3">

                      <i class="fas fa-balance-scale fa-fw" style="color: #e8a4b0;" />
                      MBTI
                    </div>

                    <div class="col-md-6 pr-md-1 mb-3">

                      <i class="fas fa-volume-up fa-fw" style="color: #e8a4b0;" />
                      <a href="SONG_LINK" target="_BLANK" style="color: #999;">
                        <i class="fas fa-music-alt" /> <i class="fas fa-music" /> <i class="fas fa-music-alt" />
                      </a>
                    </div>
                    <div class="col-md-6 pl-md-1 mb-3">
                      <!------------ coding credit ----- pls leave this alone ------------------>
                      <i class="fas fa-code fa-fw" style="color: #e8a4b0;" />
                      <a href="/Pinky" style="color: #999;">Pinky</a>
                    </div>

                    <div class="col-md-6 pr-md-1 mb-3">

                      <i class="fas fa-check fa-fw" style="color: #e8a4b0;" />
                      likes one, two, three, four
                    </div>
                    <div class="col-md-6 pl-md-1 mb-3">

                      <i class="fas fa-times fa-fw" style="color: #e8a4b0;" />
                      dislikes one, two, three, four
                    </div>

                    <div class="col-md-6 pr-md-1 mb-3">

                      <i class="fas fa-tag fa-fw" style="color: #e8a4b0;" />
                      Value
                    </div>
                    <div class="col-md-6 pl-md-1 mb-3">

                      <i class="fas fa-hands fa-fw" style="color: #e8a4b0;" />
                      Obtained
                    </div>

                  </div>
                </div>
            </div>
        </div>
    <!----- quote box ------------------------------------>
    <div style="background: #fff; color: #14171A; box-shadow: 0px 0px 12px rgba(0,0,0,.2); border-radius: 1em; "
    class="px-3 py-2 display-flex justify-content-between">
      <span style="color: #e8a4b0"><i class="fas fa-quote-left fa-fw" /></span> <span class="text-center" style="font-style: italic; letter-spacing: 1px;">

        Put a quote here

      </span><span style="color: #e8a4b0"><i class="fas fa-quote-right fa-fw" /></span>
    </div>

  </div>
</div>
</div>