Before
<div>
<div>
<div>
<img src="img/avatar3.jpg">
<i class="fas fa-cat"></i>
</div>
<span>Online</span>
</div>
<div>
<h3>Lagunite Cat</h3>
<h5>Frontend Developer</h5>
<p >"Hi, I am the Cat. I would like to connect with your"</p>
<div>
<button>Message <i class="fas fa-envelope"></i></button>
<button>Add Friend <i class="fas fa-user-plus"></i></button>
</div>
<div>
<i class="fab fa-instagram-square"></i>
<i class="fab fa-facebook-square"></i>
<i class="fab fa-linkedin"></i>
<i class="fab fa-github-square"></i>
</div>
</div>
</div>
After
<div class=""col-row bg-4 dminw8 border-r-xl shadow-1 wfc padd-s center">
<div class="col">
<div class="rel">
<img class="avatar border-circle marg-s color-success" src="img/avatar3.jpg">
<i class="fas fa-cat float-bc bg-6 wfc padd-xs bordered font-l"></i>
</div>
<span class="uppercase bold ">Online</span>
</div>
<div class="col color marg-h ta-cl xai-c dai-fs">
<h3>Lagunite Cat</h3>
<h5 class="font-text italic ">Frontend Developer</h5>
<p class="padd-0 ta-cl maxw6">"Hi, I am the Cat. I would like to connect with your"</p>
<div class="row ">
<button class="btn fit alt">Message <i class="fas fa-envelope"></i></button>
<button class="btn fit">Add Friend <i class="fas fa-user-plus"></i></button>
</div>
<div class="row center">
<i class="fab icon-l color-main fa-instagram-square"></i>
<i class="fab icon-l color-main fa-facebook-square"></i>
<i class="fab icon-l color-main fa-linkedin"></i>
<i class="fab icon-l color-main fa-github-square"></i>
</div>
</div>
</div>
