<div class="row">
    <div class="col-sm-6">
        <img class="user_profile_img" ng-src="assets/img/avatars/avatar08.png" alt="" width="76" height="76" />
        <h1 class="user_profile_name"> Carrol Clark</h1>
        <p class="user_profile_info">Web Developer</p>
        <p class="user_profile_info"> Toy-Crooks</p>
    </div>
    <div class="col-sm-6 text-right-sm">
        <div class="easy_chart_box">
            <div class="easy_chart_user_tasks easy_chart" data-percent="66">
                <span class="easy_chart_icon icon_download"></span>
            </div>
        </div>
        <div class="easy_chart_box">
            <div class="easy_chart_user_mails easy_chart" data-percent="32">
                <span class="easy_chart_percent_text"></span>
            </div>
        </div>
        <div class="easy_chart_box">
            <div class="easy_chart_user_sale easy_chart" data-percent="88">
                <span class="easy_chart_percent"></span>
            </div>
        </div>
    </div>
</div>
<hr/>
<div class="row">
    <div class="col-md-9">
        <div class="timeline">
            <div class="timeline-row">
                <div class="timeline-time">
                    <small>Jun 22</small> 08:33
                </div>
                <div class="timeline-icon">
                    <div class="bg-primary">
                        <i class="el-icon-time"></i>
                    </div>
                </div>
                <div class="timeline-content">
                    <div class="timeline-inner-content">
                        <h2>Lorem ipsum dolor sit&hellip;</h2>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Blanditiis eaque earum fugit harum iste libero maxime similique! Architecto consequatur, delectus esse explicabo minima reprehenderit similique voluptatum? Distinctio repellat sequi vero?</p>
                        <p><span class="label label-info">Tag 1</span> <span class="label label-default">Tag 2</span></p>
                    </div>
                </div>
            </div>
            <div class="timeline-row">
                <div class="timeline-time">
                    <small>Jun 23</small> 14:23
                </div>
                <div class="timeline-icon">
                    <div class="bg-info">
                        <i class="el-icon-pencil"></i>
                    </div>
                </div>
                <div class="timeline-content">
                    <div class="timeline-inner-content">
                        <h2>New image</h2>
                        <p><img ng-src="assets/img/gallery/Image009.jpg" alt="" width="420" height="280" class="img-thumbnail"> </p>
                        <p> <small class="text-muted">Uploaded by:</small> John Smith</p>
                    </div>
                </div>
            </div>
            <div class="timeline-row">
                <div class="timeline-time">
                    <small>Jun 20</small> 20:10
                </div>
                <div class="timeline-icon">
                    <div class="bg-danger">
                        <i class="el-icon-comment"></i>
                    </div>
                </div>
                <div class="timeline-content">
                    <div class="timeline-inner-content">
                        <h2>Comment</h2>
                        <p><i>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa deleniti dolorum&hellip;</i></p>
                        <p class="sepH_c"><small class="text-muted">User:</small> Kate Roos</p>
                        <p><button class="btn btn-outline btn-sm btn-primary">View Comment</button></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-3">
        <h3 class="heading_a">
            <span class="heading_text">Friends</span>
        </h3>
        <ul class="user_profile_list_a">
            <li>
                <img ng-src="assets/img/avatars/avatar04_tn.png" alt="" width="38" height="38">
                <p>Daisy Abbott <span><span class="text-muted">Birthday:</span> 23 December</span></p>
            </li>
            <li>
                <img ng-src="assets/img/avatars/avatar09_tn.png" alt="" width="38" height="38">
                <p>Denis Bartell <span><span class="text-muted">Birthday:</span> 11 May</span></p>
            </li>
            <li>
                <img ng-src="assets/img/avatars/avatar12_tn.png" alt="" width="38" height="38">
                <p>Bernadette Rowe <span><span class="text-muted">Birthday:</span> 7 July</span></p>
            </li>
            <li>
                <img ng-src="assets/img/avatars/avatar11_tn.png" alt="" width="38" height="38">
                <p>Saul Prosacco <span><span class="text-muted">Birthday:</span> 19 October</span></p>
            </li>
        </ul>
        <h3 class="heading_a">
            <span class="heading_text">Other Info</span>
        </h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Esse est harum illum magnam quasi quia quis totam vero. Ad excepturi fuga hic illum laboriosam magnam molestiae nobis perspiciatis quasi, rerum!</p>
        <button class="btn btn-xs btn-primary">Read more&hellip;</button>
    </div>
</div>