Code
<div class="px-sm-2 mx-sm-5" style="margin:auto;font:18px Lucida Console,MS Gothic,Telugu Sangam MN,sans-serif;color:#474747;background-image:repeating-linear-gradient(#232323,#232323 5px,#000 5px,#000 12px);">
<div class="px-sm-4 mx-sm-n2 text-uppercase" style="background:#5e606f;">
<div class="nav nav-tabs card-header-tabs row d-flex flex-wrap py-1 px-3">
<a class="btn-danger btn btn-sm active d-flex mx-2" style="filter:hue-rotate(100deg);color:#000;border:1px solid #000 !important;" data-toggle="tab" href="#tab1">Overview</a>
<a class="btn-danger btn btn-sm d-flex mx-2" style="filter:hue-rotate(100deg);color:#000;border:1px solid #000 !important;" data-toggle="tab" href="#tab2">Appearance</a>
<a class="btn-danger btn btn-sm d-flex mx-2" style="filter:hue-rotate(100deg);color:#000;border:1px solid #000 !important;" data-toggle="tab" href="#tab3">Personality</a>
<a class="btn-danger btn btn-sm d-flex mx-2" style="filter:hue-rotate(100deg);color:#000;border:1px solid #000 !important;" data-toggle="tab" href="#tab4">Story</a>
</div>
<a class="btn-danger rounded-circle btn btn-sm mx-2 d-inline-block pull-right" style="color:#000;border:1px solid #000 !important;filter:saturate(300%);margin-top:-19px;" href="/17291610.pok-dex">B</a>
</div>
<div class="px-2 pb-2 mx-4 mt-4" style="background:#f8f8f8;border-radius:10px 10px 60px 10px;border:#5e606f solid 2px;">
<div class="row no-gutters">
<div class="col-md-3 pt-2">
<div class="p-2 rounded" style="background:#d8d8d8;">
<div class="col-12 rounded" style="background:url(https://cdn.pixabay.com/photo/2014/11/30/14/11/cat-551554_1280.jpg) no-repeat center;background-size:100%;height:180px;"></div>
</div>
</div>
<div class="col-md-9">
<div class="rounded mr-sm-5 p-2 mt-2 ml-sm-n2" style="background:#d8d8d8;">
<div class="row no-gutters pl-0">
<div class="col-2 text-uppercase" style="font-weight:bold;color:#000;">Info</div>
<div class="col-10 text-uppercase">Oliver<br />Domestic Cat</div>
</div>
</div>
<div class="col-12 px-0">
<div class="row no-gutters">
<div class="col-md-10 pb-sm-2 px-2 pl-sm-4">
<div class="row no-gutters text-center">
<div class="col-4 pt-2 text-uppercase" style="font-weight:bold;color:#000;border-bottom:1px solid #d8d8d8;">Status</div>
<div class="col-8 pt-2" style="border-bottom:1px solid #d8d8d8;">Content</div>
<div class="col-4 pt-2 text-uppercase" style="font-weight:bold;color:#000;border-bottom:1px solid #d8d8d8;">Gender</div>
<div class="col-8 pt-2" style="border-bottom:1px solid #d8d8d8;">Content (pro/nouns)</div>
<div class="col-4 pt-2 text-uppercase" style="font-weight:bold;color:#000;border-bottom:1px solid #d8d8d8;">Occupation</div>
<div class="col-8 pt-2" style="border-bottom:1px solid #d8d8d8;">Content</div>
<div class="col-4 pt-2 text-uppercase" style="font-weight:bold;color:#000;border-bottom:1px solid #d8d8d8;">Orientation</div>
<div class="col-8 pt-2" style="border-bottom:1px solid #d8d8d8;">Content</div>
</div>
</div>
<div class="col-md-2">
<div class="pl-sm-3 pt-2 pt-sm-5 pull-right">
<span class="d-inline-block fa-stack fa-2x">
<i class="fas fa-circle fa-stack-2x" style="color:#d8d8d8;"/>
<i class="fas fa-paw fa-stack-1x"/>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="px-sm-3 mx-sm-n2 mt-3 pt-2" style="background:#5e606f;color:#474747;">
<div class="tab-content">
<div class="tab-pane active show" id="tab1">
<div class="mt-n3 mb-n2 ml-4 rounded-top text-center text-uppercase" style="background:#f8f8f8;width:140px;">Overview</div><div class="rounded-top" style="background:#f8f8f8;border-left:4px solid #ec1576;border-right:4px solid #ec1576;"><div class="pt-3 pb-2 px-1" style="border-left:12px solid #f748b5;border-right:12px solid #f748b5;height:140px;overflow-y:auto;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis ut libero id pretium. Suspendisse eu pharetra turpis. In accumsan quam commodo, vestibulum mi eget, eleifend velit. Quisque blandit justo id felis pharetra, nec dictum diam rutrum. Aenean iaculis quis nisl at ultrices. Cras accumsan non libero at consequat.</div></div>
</div>
<div class="tab-pane" id="tab2">
<div class="mt-n3 mb-n2 ml-4 rounded-top text-center text-uppercase" style="background:#f8f8f8;width:140px;">Appearance</div><div class="rounded-top" style="background:#f8f8f8;border-left:4px solid #ec1576;border-right:4px solid #ec1576;"><div class="pt-3 pb-2 px-1" style="border-left:12px solid #f748b5;border-right:12px solid #f748b5;height:140px;overflow-y:auto;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis ut libero id pretium. Suspendisse eu pharetra turpis. In accumsan quam commodo, vestibulum mi eget, eleifend velit. Quisque blandit justo id felis pharetra, nec dictum diam rutrum. Aenean iaculis quis nisl at ultrices. Cras accumsan non libero at consequat.</div></div>
</div>
<div class="tab-pane" id="tab3">
<div class="mt-n3 mb-n2 ml-4 rounded-top text-center text-uppercase" style="background:#f8f8f8;width:140px;">Personality</div><div class="rounded-top" style="background:#f8f8f8;border-left:4px solid #ec1576;border-right:4px solid #ec1576;"><div class="pt-3 pb-2 px-1" style="border-left:12px solid #f748b5;border-right:12px solid #f748b5;height:140px;overflow-y:auto;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis ut libero id pretium. Suspendisse eu pharetra turpis. In accumsan quam commodo, vestibulum mi eget, eleifend velit. Quisque blandit justo id felis pharetra, nec dictum diam rutrum. Aenean iaculis quis nisl at ultrices. Cras accumsan non libero at consequat.</div></div>
</div>
<div class="tab-pane" id="tab4">
<div class="mt-n3 mb-n2 ml-4 rounded-top text-center text-uppercase" style="background:#f8f8f8;width:140px;">Story</div><div class="rounded-top" style="background:#f8f8f8;border-left:4px solid #ec1576;border-right:4px solid #ec1576;"><div class="pt-3 pb-2 px-1" style="border-left:12px solid #f748b5;border-right:12px solid #f748b5;height:140px;overflow-y:auto;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed lobortis ut libero id pretium. Suspendisse eu pharetra turpis. In accumsan quam commodo, vestibulum mi eget, eleifend velit. Quisque blandit justo id felis pharetra, nec dictum diam rutrum. Aenean iaculis quis nisl at ultrices. Cras accumsan non libero at consequat.</div></div>
</div>
</div>
</div>
</div>
