{{-- Extends layout --}}
@extends('layout.default')



{{-- Content --}}
@section('content')
      <!-- row -->
<div class="container-fluid">
  <!-- Add Order -->
  <div class="modal fade" id="addOrderModalside">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">Create Project</h5>
          <button type="button" class="close" data-dismiss="modal"><span>&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <form>
            <div class="form-group">
              <label class="text-black font-w500">Project Name</label>
              <input type="text" class="form-control">
            </div>
            <div class="form-group">
              <label class="text-black font-w500">Deadline</label>
              <input type="date" class="form-control">
            </div>
            <div class="form-group">
              <label class="text-black font-w500">Client Name</label>
              <input type="text" class="form-control">
            </div>
            <div class="form-group">
              <button type="button" class="btn btn-primary">CREATE</button>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
  <div class="d-md-flex d-block mb-3 pb-3 border-bottom">
    <div class="card-action card-tabs mb-md-0 mb-3  mr-auto">
      <ul class="nav nav-tabs tabs-lg">
        <li class="nav-item">
          <a href="#navpills-1" class="nav-link active" data-toggle="tab" aria-expanded="false"><span>851</span>All Contacs</a>
        </li>
        <li class="nav-item">
          <a href="#navpills-2" class="nav-link" data-toggle="tab" aria-expanded="false"><span>62</span>Pending Invitation</a>
        </li>	
      </ul>
    </div>
    <div>
      <a href="javascript:void(0)" data-toggle="modal" data-target="#addOrderModal"  class="btn btn-primary rounded"><i class="fa fa-user mr-2 scale5" aria-hidden="true"></i>+ New Contact</a>
      <a href="javascript:void(0)" class="mx-4">
        <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M3.99976 7H19.9998C20.7954 7 21.5585 6.68393 22.1211 6.12132C22.6837 5.55871 22.9998 4.79565 22.9998 4C22.9998 3.20435 22.6837 2.44129 22.1211 1.87868C21.5585 1.31607 20.7954 1 19.9998 1H3.99976C3.20411 1 2.44104 1.31607 1.87844 1.87868C1.31583 2.44129 0.999756 3.20435 0.999756 4C0.999756 4.79565 1.31583 5.55871 1.87844 6.12132C2.44104 6.68393 3.20411 7 3.99976 7Z" fill="#CBCBCB"/>
          <path d="M19.9998 9H3.99976C3.20411 9 2.44104 9.31607 1.87844 9.87868C1.31583 10.4413 0.999756 11.2044 0.999756 12C0.999756 12.7956 1.31583 13.5587 1.87844 14.1213C2.44104 14.6839 3.20411 15 3.99976 15H19.9998C20.7954 15 21.5585 14.6839 22.1211 14.1213C22.6837 13.5587 22.9998 12.7956 22.9998 12C22.9998 11.2044 22.6837 10.4413 22.1211 9.87868C21.5585 9.31607 20.7954 9 19.9998 9Z" fill="#CBCBCB"/>
          <path d="M19.9998 17H3.99976C3.20411 17 2.44104 17.3161 1.87844 17.8787C1.31583 18.4413 0.999756 19.2044 0.999756 20C0.999756 20.7956 1.31583 21.5587 1.87844 22.1213C2.44104 22.6839 3.20411 23 3.99976 23H19.9998C20.7954 23 21.5585 22.6839 22.1211 22.1213C22.6837 21.5587 22.9998 20.7956 22.9998 20C22.9998 19.2044 22.6837 18.4413 22.1211 17.8787C21.5585 17.3161 20.7954 17 19.9998 17Z" fill="#CBCBCB"/>
        </svg>
      </a>
      <a href="javascript:void(0)">
        <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
          <path d="M7.99976 0.999939H3.99976C2.3429 0.999939 0.999756 2.34308 0.999756 3.99994V7.99994C0.999756 9.65679 2.3429 10.9999 3.99976 10.9999H7.99976C9.65661 10.9999 10.9998 9.65679 10.9998 7.99994V3.99994C10.9998 2.34308 9.65661 0.999939 7.99976 0.999939Z" fill="#2953E8"/>
          <path d="M19.9998 0.999939H15.9998C14.3429 0.999939 12.9998 2.34308 12.9998 3.99994V7.99994C12.9998 9.65679 14.3429 10.9999 15.9998 10.9999H19.9998C21.6566 10.9999 22.9998 9.65679 22.9998 7.99994V3.99994C22.9998 2.34308 21.6566 0.999939 19.9998 0.999939Z" fill="#2953E8"/>
          <path d="M7.99976 13H3.99976C2.3429 13 0.999756 14.3431 0.999756 16V20C0.999756 21.6569 2.3429 23 3.99976 23H7.99976C9.65661 23 10.9998 21.6569 10.9998 20V16C10.9998 14.3431 9.65661 13 7.99976 13Z" fill="#2953E8"/>
          <path d="M19.9998 13H15.9998C14.3429 13 12.9998 14.3431 12.9998 16V20C12.9998 21.6569 14.3429 23 15.9998 23H19.9998C21.6566 23 22.9998 21.6569 22.9998 20V16C22.9998 14.3431 21.6566 13 19.9998 13Z" fill="#2953E8"/>
        </svg>
      </a>
      <!-- Add Order -->
      <div class="modal fade" id="addOrderModal">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title">Add Contact</h5>
              <button type="button" class="close" data-dismiss="modal"><span>&times;</span>
              </button>
            </div>
            <div class="modal-body">
              <form>
                <div class="form-group">
                  <label class="text-black font-w500">First Name</label>
                  <input type="text" class="form-control">
                </div>
                <div class="form-group">
                  <label class="text-black font-w500">Last Name</label>
                  <input type="text" class="form-control">
                </div>
                <div class="form-group">
                  <label class="text-black font-w500">Address</label>
                  <input type="text" class="form-control">
                </div>
                <div class="form-group">
                  <button type="button" class="btn btn-primary">SAVE</button>
                </div>
              </form>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-xl-9 col-xxl-8 col-lg-8">
      <div class="tab-content">
        <div class="tab-pane fade show active" id="navpills-1" role="tabpanel">
          <div class="row loadmore-content" id="RecentActivitiesContent">
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/13.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Abdul Kean</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/14.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Angela Moss</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/15.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Afiff Skunder</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/16.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Abigail Smurt</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/17.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Bella Syuqr</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/18.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Benny Gacu</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/19.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Chloe Simatup..</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/20.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Denny Juan</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/21.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Franklin CS</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/22.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Fanny Saragih</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/23.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Hermanto</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/24.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Lulu Salam</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-xl-12 mb-4 text-center">
              <a href="javascript:void(0)" class="btn btn-outline-primary mx-auto dlab-load-more"  rel="contacts-ajax" id="RecentActivities">Load More</a>
            </div>
          </div>
        </div>
        <div class="tab-pane fade" id="navpills-2" role="tabpanel">
          <div class="row loadmore-content" id="RecentActivities2Content">
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/15.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Abdul Kean</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/13.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Angela Moss</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/17.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Afiff Skunder</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/19.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Abigail Smurt</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/17.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Bella Syuqr</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/18.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Benny Gacu</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/19.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Chloe Simatup..</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/20.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Denny Juan</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/21.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Franklin CS</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/22.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Fanny Saragih</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/23.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Hermanto</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-xl-4 col-xxl-6 col-sm-6">
              <div class="card contact-bx">	
                <div class="card-body">
                  <div class="media">
                    <div class="image-bx mr-3">
                      <img src="{{ asset('images/users/24.jpg') }}" alt="" class="rounded-circle" width="90">
                      <span class="active"></span>
                    </div>
                    <div class="media-body">
                      <h6 class="fs-20 font-w600 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Lulu Salam</a></h6>
                      <p class="fs-14">Highspeed Inc.</p>
                      <ul>
                        <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                        <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                        <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-xl-12 mb-4 text-center">
              <a href="javascript:void(0)" class="btn btn-outline-primary mx-auto dlab-load-more"  rel="contacts-ajax" id="RecentActivities2">Load More</a>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="col-xl-3 col-xxl-4 col-lg-4">
      <div class="row">
        <div class="col-xl-12">
          <div class="card profile-card">
            <div class="card-body pb-0 text-center">
              <div class="image-bx mb-3">
                <img src="{{ asset('images/users/25.jpg') }}" alt="" width="120" class="rounded-circle">
                <span class="active"></span>
              </div>
              <h4 class="fs-20 mb-0"><a href="{!! url('/app-profile'); !!}" class="text-black">Angela Moss</a></h4>
              <p class="fs-14">Highspeed Inc.</p>
              <ul>
                <li><a href="javascript:void(0)"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                <li><a href="javascript:void(0)"><i class="fa fa-video-camera" aria-hidden="true"></i></a></li>
                <li><a href="{!! url('/messages'); !!}"><i class="las la-sms"></i></a></li>
              </ul>
              <div class="row">
                <div class="col-6">
                  <a href="{!! url('/app-profile'); !!}" class="btn btn-sm btn-outline-primary rounded d-block">Edit</a>
                </div>
                <div class="col-6">
                  <a href="{!! url('/app-profile'); !!}" class="btn btn-sm btn-outline-dark rounded d-block">Remove</a>
                </div>
              </div>
            </div>
            <div class="card-body">
              <h6 class="fs-16 text-black font-w600">About</h6>
              <p class="fs-14">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
			
@endsection