Profile
<div class="row no-gutters">
<div class="col-sm-1" style="padding-right: 15px;">
<br>
</div>
<div class="col-sm-3" style="Margin-right: 15px;">
<div class="card card-block py-3 text-center" style="text-align: center;height: 555px;"><img src="https://vignette.wikia.nocookie.net/project-pokemon/images/4/47/Placeholder.png" class="fr-dib" width="230" height="230">
<br>
<p class="h1 text-center"><span style="font-size: 30px;">NAME</span></p>
<p class="card-text">SPECIES | AGE | PRONOUNS</p>
<p style="text-align: center;"><i class="fas fa-circle" style="color:#aaa;font-size:35px;"></i>
<i class="fas fa-circle" style="color:#aaa;font-size:35px;"></i>
<i class="fas fa-circle" style="color:#aaa;font-size:35px;"></i>
<i class="fas fa-circle" style="color:#aaa;font-size:35px;"></i>
<i class="fas fa-circle" style="color:#aaa;font-size:35px;"></i>
<i class="fas fa-circle" style="color:#aaa;font-size:35px;"></i></p>
<br>
<div class="d-flex justify-content-between p-1" style="text-align: left;"><span class="w-50">Value</span>
<span class="w-50 text-right">$ money</span></div>
<div class="d-flex justify-content-between p-1" style="text-align: left;"><span class="w-50">Designer</span>
<span class="w-50 text-right">@ user</span></div>
<div class="d-flex justify-content-between p-1" style="text-align: left;"><span class="w-50">Status</span>
<span class="w-50 text-right">do NOT offer</span></div>
<div class="d-flex justify-content-between p-1" style="text-align: left;"><span class="w-50">Link</span>
<a href="https://toyhou.se/" id=""><span class="w-50 text-right">Thing</span></a></div>
</div>
</div>
<div class="col-sm-7" style="padding-right: 15px;">
<div class="card card-block ui-accordion" style="text-align: center; height: 237px;">
<p class="h1 text-left"><i class="fas fa-info-circle"></i> About</p>
<div class="card p-2 border-0 bg-transparent ui-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Aliquet porttitor lacus luctus accumsan. Pellentesque diam volutpat commodo sed egestas egestas fringilla. Quis eleifend quam adipiscing vitae proin. Morbi tristique senectus et netus et malesuada. Aliquam etiam erat velit scelerisque in. Nunc vel risus commodo viverra maecenas accumsan lacus vel. Hendrerit dolor magna eget est lorem ipsum dolor sit amet. Consectetur adipiscing elit pellentesque habitant morbi tristique senectus et. Habitant morbi tristique senectus et netus et malesuada fames ac. Cras pulvinar mattis nunc sed blandit libero volutpat sed. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Viverra adipiscing at in tellus. At augue eget arcu dictum varius duis at.</p>
</div>
</div>
<div class="card border-0 bg-transparent" style="height: 15px;">
<br>
</div>
<div class="row no-gutters">
<div class="col-sm-6" style="padding-right:15px;">
<div class="card px-3 py-4 ui-accordion" style="height: 303px;">
<p class="h1 text-left"><i class="fas fa-edit"></i> Design Notes</p>
<div class="card p-2 border-0 bg-transparent ui-accordion-content">
<p>- a detail about your character’s appearance
<br>- a detail about your character’s appearance
<br>- a detail about your character’s appearance
<br>- a detail about your character’s appearance
<br>- a detail about your character’s appearance</p>
</div>
</div>
<div class="card border-0 bg-transparent" style="height: 15px;">
<br>
</div>
</div>
<div class="col-sm-6">
<div class="card card-block ui-accordion" style="height: 144px;">
<p class="h1 text-left"><i class="fas fa-heart"></i> Likes</p>
<div class="card p-2 border-0 bg-transparent ui-accordion-content">a thing, thing, thing, thing, thing, thing, thing, thing, thing, thing, and a thing
<p>
<br>
</p>
</div>
</div>
<div class="card border-0 bg-transparent" style="height: 15px;">
<br>
</div>
<div class="card card-block ui-accordion" style="height: 144px;">
<p class="h1 text-left"><i class="fas fa-times-circle"></i> Dislikes</p>
<div class="card p-2 border-0 bg-transparent ui-accordion-content">
<p>a thing, thing, thing, thing, thing, thing, thing, thing, thing, thing, and a thing</p>
</div>
</div>
</div>
</div>
<p style="text-align: right;"><a href="https://toyhou.se/8056243.character-template-6" id="">Html code</a> by Coywolfy</p>
</div>
<div class="col-sm-1" style="padding-right: 15px;">
<br>
</div>
</div>