/
var
/
www
/
barefootlaw.org
/
bios2
/
manager
/
Upload File
HOME
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"> <meta name="description" content=""> <meta name="author" content=""> <!--<link rel="shortcut icon" href="../images/favicon.png" type="image/png">--> <title>Quirk Responsive Admin Templates</title> <link rel="stylesheet" href="../lib/fontawesome/css/font-awesome.css"> <link rel="stylesheet" href="../lib/weather-icons/css/weather-icons.css"> <link rel="stylesheet" href="../lib/jquery-toggles/toggles-full.css"> <link rel="stylesheet" href="../css/quirk.css"> <script src="../lib/modernizr/modernizr.js"></script> <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries --> <!--[if lt IE 9]> <script src="../lib/html5shiv/html5shiv.js"></script> <script src="../lib/respond/respond.src.js"></script> <![endif]--> </head> <body> <header> <div class="headerpanel"> <div class="logopanel"> <h2><a href="index.php">Quirk</a></h2> </div><!-- logopanel --> <div class="headerbar"> <a id="menuToggle" class="menutoggle"><i class="fa fa-bars"></i></a> <div class="searchpanel"> <div class="input-group"> <input type="text" class="form-control" placeholder="Search for..."> <span class="input-group-btn"> <button class="btn btn-default" type="button"><i class="fa fa-search"></i></button> </span> </div><!-- input-group --> </div> <div class="header-right"> <ul class="headermenu"> <li> <div id="noticePanel" class="btn-group"> <button class="btn btn-notice alert-notice" data-toggle="dropdown"> <i class="fa fa-globe"></i> </button> <div id="noticeDropdown" class="dropdown-menu dm-notice pull-right"> <div role="tabpanel"> <!-- Nav tabs --> <ul class="nav nav-tabs nav-justified" role="tablist"> <li class="active"><a data-target="#notification" data-toggle="tab">Notifications (2)</a></li> <li><a data-target="#reminders" data-toggle="tab">Reminders (4)</a></li> </ul> <!-- Tab panes --> <div class="tab-content"> <div role="tabpanel" class="tab-pane active" id="notification"> <ul class="list-group notice-list"> <li class="list-group-item unread"> <div class="row"> <div class="col-xs-2"> <i class="fa fa-envelope"></i> </div> <div class="col-xs-10"> <h5><a href="">New message from Weno Carasbong</a></h5> <small>June 20, 2015</small> <span>Soluta nobis est eligendi optio cumque...</span> </div> </div> </li> <li class="list-group-item unread"> <div class="row"> <div class="col-xs-2"> <i class="fa fa-user"></i> </div> <div class="col-xs-10"> <h5><a href="">Renov Leonga is now following you!</a></h5> <small>June 18, 2015</small> </div> </div> </li> <li class="list-group-item"> <div class="row"> <div class="col-xs-2"> <i class="fa fa-user"></i> </div> <div class="col-xs-10"> <h5><a href="">Zaham Sindil is now following you!</a></h5> <small>June 17, 2015</small> </div> </div> </li> <li class="list-group-item"> <div class="row"> <div class="col-xs-2"> <i class="fa fa-thumbs-up"></i> </div> <div class="col-xs-10"> <h5><a href="">Rey Reslaba likes your post!</a></h5> <small>June 16, 2015</small> <span>HTML5 For Beginners Chapter 1</span> </div> </div> </li> <li class="list-group-item"> <div class="row"> <div class="col-xs-2"> <i class="fa fa-comment"></i> </div> <div class="col-xs-10"> <h5><a href="">Socrates commented on your post!</a></h5> <small>June 16, 2015</small> <span>Temporibus autem et aut officiis debitis...</span> </div> </div> </li> </ul> <a class="btn-more" href="">View More Notifications <i class="fa fa-long-arrow-right"></i></a> </div><!-- tab-pane --> <div role="tabpanel" class="tab-pane" id="reminders"> <h1 id="todayDay" class="today-day">...</h1> <h3 id="todayDate" class="today-date">...</h3> <h5 class="today-weather"><i class="wi wi-hail"></i> Cloudy 77 Degree</h5> <p>Thunderstorm in the area this afternoon through this evening</p> <h4 class="panel-title">Upcoming Events</h4> <ul class="list-group"> <li class="list-group-item"> <div class="row"> <div class="col-xs-2"> <h4>20</h4> <p>Aug</p> </div> <div class="col-xs-10"> <h5><a href="">HTML5/CSS3 Live! United States</a></h5> <small>San Francisco, CA</small> </div> </div> </li> <li class="list-group-item"> <div class="row"> <div class="col-xs-2"> <h4>05</h4> <p>Sep</p> </div> <div class="col-xs-10"> <h5><a href="">Web Technology Summit</a></h5> <small>Sydney, Australia</small> </div> </div> </li> <li class="list-group-item"> <div class="row"> <div class="col-xs-2"> <h4>25</h4> <p>Sep</p> </div> <div class="col-xs-10"> <h5><a href="">HTML5 Developer Conference 2015</a></h5> <small>Los Angeles CA United States</small> </div> </div> </li> <li class="list-group-item"> <div class="row"> <div class="col-xs-2"> <h4>10</h4> <p>Oct</p> </div> <div class="col-xs-10"> <h5><a href="">AngularJS Conference 2015</a></h5> <small>Silicon Valley CA, United States</small> </div> </div> </li> </ul> <a class="btn-more" href="">View More Events <i class="fa fa-long-arrow-right"></i></a> </div> </div> </div> </div> </div> </li> <li> <div class="btn-group"> <button type="button" class="btn btn-logged" data-toggle="dropdown"> <img src="images/photos/loggeduser.png" alt="" /> Elen Adarna <span class="caret"></span> </button> <ul class="dropdown-menu pull-right"> <li><a href="profile.html"><i class="glyphicon glyphicon-user"></i> My Profile</a></li> <li><a href="#"><i class="glyphicon glyphicon-cog"></i> Account Settings</a></li> <li><a href="#"><i class="glyphicon glyphicon-question-sign"></i> Help</a></li> <li><a href="signin.php"><i class="glyphicon glyphicon-log-out"></i> Log Out</a></li> </ul> </div> </li> <li> <button id="chatview" class="btn btn-chat alert-notice"> <span class="badge-alert"></span> <i class="fa fa-comments-o"></i> </button> </li> </ul> </div><!-- header-right --> </div><!-- headerbar --> </div><!-- header--> </header> <section> <div class="leftpanel"> <div class="leftpanelinner"> <!-- ################## LEFT PANEL PROFILE ################## --> <div class="media leftpanel-profile"> <div class="media-left"> <a href="#"> <img src="../images/photos/loggeduser.png" alt="" class="media-object img-circle"> </a> </div> <div class="media-body"> <h4 class="media-heading">Elen Adarna <a data-toggle="collapse" data-target="#loguserinfo" class="pull-right"><i class="fa fa-angle-down"></i></a></h4> <span>Software Engineer</span> </div> </div><!-- leftpanel-profile --> <div class="leftpanel-userinfo collapse" id="loguserinfo"> <h5 class="sidebar-title">Address</h5> <address> 4975 Cambridge Road Miami Gardens, FL 33056 </address> <h5 class="sidebar-title">Contact</h5> <ul class="list-group"> <li class="list-group-item"> <label class="pull-left">Email</label> <span class="pull-right">me@themepixels.com</span> </li> <li class="list-group-item"> <label class="pull-left">Home</label> <span class="pull-right">(032) 1234 567</span> </li> <li class="list-group-item"> <label class="pull-left">Mobile</label> <span class="pull-right">+63012 3456 789</span> </li> <li class="list-group-item"> <label class="pull-left">Social</label> <div class="social-icons pull-right"> <a href="#"><i class="fa fa-facebook-official"></i></a> <a href="#"><i class="fa fa-twitter"></i></a> <a href="#"><i class="fa fa-pinterest"></i></a> </div> </li> </ul> </div><!-- leftpanel-userinfo --> <ul class="nav nav-tabs nav-justified nav-sidebar"> <li class="tooltips active" data-toggle="tooltip" title="Main Menu"><a data-toggle="tab" data-target="#mainmenu"><i class="tooltips fa fa-ellipsis-h"></i></a></li> <li class="tooltips unread" data-toggle="tooltip" title="Check Mail"><a data-toggle="tab" data-target="#emailmenu"><i class="tooltips fa fa-envelope"></i></a></li> <li class="tooltips" data-toggle="tooltip" title="Contacts"><a data-toggle="tab" data-target="#contactmenu"><i class="fa fa-user"></i></a></li> <li class="tooltips" data-toggle="tooltip" title="Settings"><a data-toggle="tab" data-target="#settings"><i class="fa fa-cog"></i></a></li> <li class="tooltips" data-toggle="tooltip" title="Log Out"><a href="signin.php"><i class="fa fa-sign-out"></i></a></li> </ul> <div class="tab-content"> <!-- ################# MAIN MENU ################### --> <div class="tab-pane active" id="mainmenu"> <h5 class="sidebar-title">Favorites</h5> <ul class="nav nav-pills nav-stacked nav-quirk"> <li><a href="index.php"><i class="fa fa-home"></i> <span>Dashboard</span></a></li> <li><a href="widgets.html"><span class="badge pull-right">10+</span><i class="fa fa-cube"></i> <span>Widgets</span></a></li> <li><a href="maps.php"><i class="fa fa-map-marker"></i> <span>Maps</span></a></li> </ul> <h5 class="sidebar-title">Main Menu</h5> <ul class="nav nav-pills nav-stacked nav-quirk"> <li class="nav-parent"> <a href=""><i class="fa fa-check-square"></i> <span>Forms</span></a> <ul class="children"> <li><a href="general-forms.php">Form Elements</a></li> <li><a href="form-validation.html">Form Validation</a></li> <li><a href="form-wizards.html">Form Wizards</a></li> <li><a href="wysiwyg.html">Text Editor</a></li> </ul> </li> <li class="nav-parent"><a href=""><i class="fa fa-suitcase"></i> <span>UI Elements</span></a> <ul class="children"> <li><a href="buttons.html">Buttons</a></li> <li><a href="icons.html">Icons</a></li> <li><a href="typography.html">Typography</a></li> <li><a href="alerts.html">Alerts & Notifications</a></li> <li><a href="tabs-accordions.html">Tabs & Accordions</a></li> <li><a href="sliders.html">Sliders</a></li> <li><a href="graphs.html">Graphs & Charts</a></li> <li><a href="panels.html">Panels</a></li> <li><a href="extras.html">Extras</a></li> </ul> </li> <li class="nav-parent"><a href=""><i class="fa fa-th-list"></i> <span>Tables</span></a> <ul class="children"> <li><a href="basic-tables.html">Basic Tables</a></li> <li><a href="data-tables.html">Data Tables</a></li> </ul> </li> <li class="nav-parent active"><a href=""><i class="fa fa-file-text"></i> <span>Pages</span></a> <ul class="children"> <li><a href="asset-manager.html">Asset Manager</a></li> <li><a href="people-directory.html">People Directory</a></li> <li><a href="timeline.html">Timeline</a></li> <li class="active"><a href="profile.html">Profile</a></li> <li><a href="blank.html">Blank Page</a></li> <li><a href="notfound.html">404 Page</a></li> <li><a href="signin.php">Sign In</a></li> <li><a href="signup.html">Sign Up</a></li> </ul> </li> </ul> </div><!-- tab-pane --> <!-- ######################## EMAIL MENU ##################### --> <div class="tab-pane" id="emailmenu"> <div class="sidebar-btn-wrapper"> <a href="compose.html" class="btn btn-danger btn-block">Compose</a> </div> <h5 class="sidebar-title">Mailboxes</h5> <ul class="nav nav-pills nav-stacked nav-quirk nav-mail"> <li><a href="email.html"><i class="fa fa-inbox"></i> <span>Inbox (3)</span></a></li> <li><a href="email.html"><i class="fa fa-pencil"></i> <span>Draft (2)</span></a></li> <li><a href="email.html"><i class="fa fa-paper-plane"></i> <span>Sent</span></a></li> </ul> <h5 class="sidebar-title">Tags</h5> <ul class="nav nav-pills nav-stacked nav-quirk nav-label"> <li><a href="#"><i class="fa fa-tags primary"></i> <span>Communication</span></a></li> <li><a href="#"><i class="fa fa-tags success"></i> <span>Updates</span></a></li> <li><a href="#"><i class="fa fa-tags warning"></i> <span>Promotions</span></a></li> <li><a href="#"><i class="fa fa-tags danger"></i> <span>Social</span></a></li> </ul> </div><!-- tab-pane --> <!-- ################### CONTACT LIST ################### --> <div class="tab-pane" id="contactmenu"> <div class="input-group input-search-contact"> <input type="text" class="form-control" placeholder="Search contact"> <span class="input-group-btn"> <button class="btn btn-default" type="button"><i class="fa fa-search"></i></button> </span> </div> <h5 class="sidebar-title">My Contacts</h5> <ul class="media-list media-list-contacts"> <li class="media"> <a href="#"> <div class="media-left"> <img class="media-object img-circle" src="../images/photos/user1.png" alt=""> </div> <div class="media-body"> <h4 class="media-heading">Christina R. Hill</h4> <span><i class="fa fa-phone"></i> 386-752-1860</span> </div> </a> </li> <li class="media"> <a href="#"> <div class="media-left"> <img class="media-object img-circle" src="../images/photos/user2.png" alt=""> </div> <div class="media-body"> <h4 class="media-heading">Floyd M. Romero</h4> <span><i class="fa fa-mobile"></i> +1614-650-8281</span> </div> </a> </li> <li class="media"> <a href="#"> <div class="media-left"> <img class="media-object img-circle" src="../images/photos/user3.png" alt=""> </div> <div class="media-body"> <h4 class="media-heading">Jennie S. Gray</h4> <span><i class="fa fa-phone"></i> 310-757-8444</span> </div> </a> </li> <li class="media"> <a href="#"> <div class="media-left"> <img class="media-object img-circle" src="../images/photos/user4.png" alt=""> </div> <div class="media-body"> <h4 class="media-heading">Alia J. Locher</h4> <span><i class="fa fa-mobile"></i> +1517-386-0059</span> </div> </a> </li> <li class="media"> <a href="#"> <div class="media-left"> <img class="media-object img-circle" src="../images/photos/user5.png" alt=""> </div> <div class="media-body"> <h4 class="media-heading">Nicholas T. Hinkle</h4> <span><i class="fa fa-skype"></i> nicholas.hinkle</span> </div> </a> </li> <li class="media"> <a href="#"> <div class="media-left"> <img class="media-object img-circle" src="../images/photos/user6.png" alt=""> </div> <div class="media-body"> <h4 class="media-heading">Jamie W. Bradford</h4> <span><i class="fa fa-phone"></i> 225-270-2425</span> </div> </a> </li> <li class="media"> <a href="#"> <div class="media-left"> <img class="media-object img-circle" src="../images/photos/user7.png" alt=""> </div> <div class="media-body"> <h4 class="media-heading">Pamela J. Stump</h4> <span><i class="fa fa-mobile"></i> +1773-879-2491</span> </div> </a> </li> <li class="media"> <a href="#"> <div class="media-left"> <img class="media-object img-circle" src="../images/photos/user8.png" alt=""> </div> <div class="media-body"> <h4 class="media-heading">Refugio C. Burgess</h4> <span><i class="fa fa-mobile"></i> +1660-627-7184</span> </div> </a> </li> <li class="media"> <a href="#"> <div class="media-left"> <img class="media-object img-circle" src="../images/photos/user9.png" alt=""> </div> <div class="media-body"> <h4 class="media-heading">Ashley T. Brewington</h4> <span><i class="fa fa-skype"></i> ashley.brewington</span> </div> </a> </li> <li class="media"> <a href="#"> <div class="media-left"> <img class="media-object img-circle" src="../images/photos/user10.png" alt=""> </div> <div class="media-body"> <h4 class="media-heading">Roberta F. Horn</h4> <span><i class="fa fa-phone"></i> 716-630-0132</span> </div> </a> </li> </ul> </div><!-- tab-pane --> <!-- #################### SETTINGS ################### --> <div class="tab-pane" id="settings"> <h5 class="sidebar-title">General Settings</h5> <ul class="list-group list-group-settings"> <li class="list-group-item"> <h5>Daily Newsletter</h5> <small>Get notified when someone else is trying to access your account.</small> <div class="toggle-wrapper"> <div class="leftpanel-toggle toggle-light success"></div> </div> </li> <li class="list-group-item"> <h5>Call Phones</h5> <small>Make calls to friends and family right from your account.</small> <div class="toggle-wrapper"> <div class="leftpanel-toggle-off toggle-light success"></div> </div> </li> </ul> <h5 class="sidebar-title">Security Settings</h5> <ul class="list-group list-group-settings"> <li class="list-group-item"> <h5>Login Notifications</h5> <small>Get notified when someone else is trying to access your account.</small> <div class="toggle-wrapper"> <div class="leftpanel-toggle toggle-light success"></div> </div> </li> <li class="list-group-item"> <h5>Phone Approvals</h5> <small>Use your phone when login as an extra layer of security.</small> <div class="toggle-wrapper"> <div class="leftpanel-toggle toggle-light success"></div> </div> </li> </ul> </div><!-- tab-pane --> </div><!-- tab-content --> </div><!-- leftpanelinner --> </div><!-- leftpanel --> <div class="mainpanel"> <div class="contentpanel"> <div class="row profile-wrapper"> <div class="col-xs-12 col-md-3 col-lg-2 profile-left"> <div class="profile-left-heading"> <ul class="panel-options"> <li><a><i class="glyphicon glyphicon-option-vertical"></i></a></li> </ul> <a href="" class="profile-photo"><img class="img-circle img-responsive" src="../images/photos/profilepic.png" alt=""></a> <h2 class="profile-name">Barbara Balashova</h2> <h4 class="profile-designation">Software Engineer</h4> <ul class="list-group"> <li class="list-group-item">Posts <a href="timeline.html">1,333</a></li> <li class="list-group-item">Following <a href="people-directory.html">541</a></li> <li class="list-group-item">Followers <a href="people-directory-grid.html">32,434</a></li> </ul> <button class="btn btn-danger btn-quirk btn-block profile-btn-follow">Follow</button> </div> <div class="profile-left-body"> <h4 class="panel-title">About Me</h4> <p>Social media ninja. Pop culture enthusiast. Zombie fanatic. General tv evangelist.</p> <p>Alcohol fanatic. Explorer. Passionate reader. Entrepreneur. Lifelong coffee advocate. Avid bacon aficionado. Travel evangelist.</p> <hr class="fadeout"> <h4 class="panel-title">Location</h4> <p><i class="glyphicon glyphicon-map-marker mr5"></i> San Francisco, CA, USA</p> <hr class="fadeout"> <h4 class="panel-title">Company</h4> <p><i class="glyphicon glyphicon-briefcase mr5"></i> Awesome Company, Inc.</p> <hr class="fadeout"> <h4 class="panel-title">Contacts</h4> <p><i class="glyphicon glyphicon-phone mr5"></i> +1 010 123 5678</p> <hr class="fadeout"> <h4 class="panel-title">Social</h4> <ul class="list-inline profile-social"> <li><a href=""><i class="fa fa-facebook-official"></i></a></li> <li><a href=""><i class="fa fa-twitter"></i></a></li> <li><a href=""><i class="fa fa-dribbble"></i></a></li> <li><a href=""><i class="fa fa-linkedin"></i></a></li> </ul> </div> </div> <div class="col-md-6 col-lg-8 profile-right"> <div class="profile-right-body"> <!-- Nav tabs --> <ul class="nav nav-tabs nav-justified nav-line"> <li class="active"><a href="#activity" data-toggle="tab"><strong>Activity</strong></a></li> <li><a href="#photos" data-toggle="tab"><strong>Photos (20)</strong></a></li> <li><a href="#music" data-toggle="tab"><strong>Music (10)</strong></a></li> <li><a href="#places" data-toggle="tab"><strong>Places (5)</strong></a></li> </ul> <!-- Tab panes --> <div class="tab-content"> <div class="tab-pane active" id="activity"> <div class="panel panel-post-item"> <div class="panel-heading"> <div class="media"> <div class="media-left"> <a href="#"> <img alt="" src="../images/photos/profilepic.png" class="media-object img-circle"> </a> </div> <div class="media-body"> <h4 class="media-heading">Barbara Balashova</h4> <p class="media-usermeta"> <span class="media-time">July 06, 2015 8:30am</span> </p> </div> </div><!-- media --> </div><!-- panel-heading --> <div class="panel-body"> <p>As a web designer it’s your job to help users find their way to what they’re looking for. It can be easy to put the needs of your users to one side, but knowing your users, understanding their roles, goals, motives and behavior will confirm how you structure your navigation model. <a href="http://goo.gl/QTccRE" target="_blank">#information</a> <a href="http://goo.gl/QTccRE" target="_blank">#design</a></p> <p>Source: <a href="http://goo.gl/QTccRE" target="_blank">http://goo.gl/QTccRE</a></p> </div> <div class="panel-footer"> <ul class="list-inline"> <li><a href=""><i class="glyphicon glyphicon-heart"></i> Like</a></li> <li><a><i class="glyphicon glyphicon-comment"></i> Comments (0)</a></li> <li class="pull-right">5 liked this</li> </ul> </div> <div class="form-group"> <input type="text" class="form-control" placeholder="Write some comments"> </div> </div><!-- panel panel-post --> <div class="panel panel-post-item"> <div class="panel-heading"> <div class="media"> <div class="media-left"> <a href="#"> <img alt="" src="../images/photos/profilepic.png" class="media-object img-circle"> </a> </div> <div class="media-body"> <h4 class="media-heading">Barbara Balashova</h4> <p class="media-usermeta"> <span class="media-time">July 05, 2015 11:33pm</span> </p> </div> </div><!-- media --> </div><!-- panel-heading --> <div class="panel-body"> <p>Improving the trustworthiness of a website can help improve its conversion rate, whether we’re talking about buying a product, downloading an ebook or subscribing to a newsletter. <a href="">#trust</a> <a href="">#security</a></p> <p>Source: <a href="http://goo.gl/LxDM8K" target="_blank">http://goo.gl/LxDM8K</a></p> </div> <div class="panel-footer"> <ul class="list-inline"> <li><a href=""><i class="glyphicon glyphicon-heart"></i> Like</a></li> <li><a><i class="glyphicon glyphicon-comment"></i> Comments (0)</a></li> <li class="pull-right">0 liked this</li> </ul> </div> <div class="form-group"> <input type="text" class="form-control" placeholder="Write some comments"> </div> </div><!-- panel panel-post --> <div class="panel panel-post-item"> <div class="panel-heading"> <div class="media"> <div class="media-left"> <a href="#"> <img alt="" src="../images/photos/profilepic.png" class="media-object img-circle"> </a> </div> <div class="media-body"> <h4 class="media-heading">Barbara Balashova <span>scheduled a meeting with</span> Elen Adarna</h4> <p class="media-usermeta"> <span class="media-time">July 06, 2015 8:30am</span> </p> </div> </div><!-- media --> </div><!-- panel-heading --> <div class="panel-body nopaddingbottom"> <div class="media"> <div class="media-left"> <a href="#"> <img class="media-object width80" src="../images/image.png" alt=""> </a> </div> <div class="media-body"> <h4 class="media-heading"><a href="">Telling Your Life Story: Memoir Workshop Series</a></h4> <p>Monday, July 06, 2015 - Tuesday, July 07, 2015 <br> SF Bay Theater <br> San Francisco, California, USA </p> </div> </div> </div><!-- panel-body --> </div><!-- panel panel-post --> <div class="panel panel-post-item"> <div class="panel-heading"> <div class="media"> <div class="media-left"> <a href="#"> <img alt="" src="../images/photos/profilepic.png" class="media-object img-circle"> </a> </div> <div class="media-body"> <h4 class="media-heading">Barbara Balashova <span>added new article from category</span> UI Workflow</h4> <p class="media-usermeta"> <span class="media-time">July 06, 2015 8:30am</span> </p> </div> </div><!-- media --> </div><!-- panel-heading --> <div class="panel-body nopaddingbottom"> <div class="media"> <div class="media-left"> <a href="#"> <img class="media-object width80" src="../images/image.png" alt=""> </a> </div> <div class="media-body"> <h4 class="media-heading"><a href="">Tips for Designing in the Browser</a></h4> <p>It's often thought that designing in the browser is a modern approach to web design. In fact, before the advent of tools such as Photoshop, there was little other choice --- <a href="http://goo.gl/SGfFJd" target="_blank">http://goo.gl/SGfFJd</a></p> </div> </div> </div><!-- panel-body --> </div><!-- panel panel-post --> </div><!-- tab-pane --> <div class="tab-pane" id="photos"> Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. </div> <div class="tab-pane" id="music"> Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. </div> </div> </div> </div> <div class="col-md-3 col-lg-2 profile-sidebar"> <div class="row"> <div class="col-sm-6 col-md-12"> <div class="panel"> <div class="panel-heading"> <h4 class="panel-title">People You May Know</h4> </div> <div class="panel-body"> <ul class="media-list user-list"> <li class="media"> <div class="media-left"> <a href="#"> <img class="media-object img-circle" src="../images/photos/user9.png" alt=""> </a> </div> <div class="media-body"> <h4 class="media-heading"><a href="">Ashley T. Brewington</a></h4> <span>5,323</span> Followers </div> </li> <li class="media"> <div class="media-left"> <a href="#"> <img class="media-object img-circle" src="../images/photos/user10.png" alt=""> </a> </div> <div class="media-body"> <h4 class="media-heading"><a href="">Roberta F. Horn</a></h4> <span>4,100</span> Followers </div> </li> <li class="media"> <div class="media-left"> <a href="#"> <img class="media-object img-circle" src="../images/photos/user3.png" alt=""> </a> </div> <div class="media-body"> <h4 class="media-heading"><a href="">Jennie S. Gray</a></h4> <span>3,508</span> Followers </div> </li> <li class="media"> <div class="media-left"> <a href="#"> <img class="media-object img-circle" src="../images/photos/user4.png" alt=""> </a> </div> <div class="media-body"> <h4 class="media-heading"><a href="">Alia J. Locher</a></h4> <span>3,508</span> Followers </div> </li> <li class="media"> <div class="media-left"> <a href="#"> <img class="media-object img-circle" src="../images/photos/user6.png" alt=""> </a> </div> <div class="media-body"> <h4 class="media-heading"><a href="">Jamie W. Bradford</a></h4> <span>2,001</span> Followers </div> </li> </ul> </div> </div><!-- panel --> </div> <div class="col-sm-6 col-md-12"> <div class="panel"> <div class="panel-heading"> <h4 class="panel-title">Following Activity</h4> </div> <div class="panel-body"> <ul class="media-list user-list"> <li class="media"> <div class="media-left"> <a href="#"> <img class="media-object img-circle" src="../images/photos/user2.png" alt=""> </a> </div> <div class="media-body"> <h4 class="media-heading nomargin"><a href="">Floyd M. Romero</a></h4> is now following <a href="">Christina R. Hill</a> <small class="date"><i class="glyphicon glyphicon-time"></i> Just now</small> </div> </li> <li class="media"> <div class="media-left"> <a href="#"> <img class="media-object img-circle" src="../images/photos/user10.png" alt=""> </a> </div> <div class="media-body"> <h4 class="media-heading nomargin"><a href="">Roberta F. Horn</a></h4> commented on <a href="">HTML5 Tutorial</a> <small class="date"><i class="glyphicon glyphicon-time"></i> Yesterday</small> </div> </li> <li class="media"> <div class="media-left"> <a href="#"> <img class="media-object img-circle" src="../images/photos/user3.png" alt=""> </a> </div> <div class="media-body"> <h4 class="media-heading nomargin"><a href="">Jennie S. Gray</a></h4> posted a video on <a href="">The Discovery</a> <small class="date"><i class="glyphicon glyphicon-time"></i> June 25, 2015</small> </div> </li> <li class="media"> <div class="media-left"> <a href="#"> <img class="media-object img-circle" src="../images/photos/user5.png" alt=""> </a> </div> <div class="media-body"> <h4 class="media-heading nomargin"><a href="">Nicholas T. Hinkle</a></h4> liked your video on <a href="">The Discovery</a> <small class="date"><i class="glyphicon glyphicon-time"></i> June 24, 2015</small> </div> </li> <li class="media"> <div class="media-left"> <a href="#"> <img class="media-object img-circle" src="../images/photos/user2.png" alt=""> </a> </div> <div class="media-body"> <h4 class="media-heading nomargin"><a href="">Floyd M. Romero</a></h4> liked your photo on <a href="">My Life Adventure</a> <small class="date"><i class="glyphicon glyphicon-time"></i> June 24, 2015</small> </div> </li> </ul> </div> </div><!-- panel --> </div> </div><!-- row --> </div> </div><!-- row --> </div><!-- contentpanel --> </div><!-- mainpanel --> </section> <script src="../lib/jquery/jquery.js"></script> <script src="../lib/jquery-ui/jquery-ui.js"></script> <script src="../lib/bootstrap/js/bootstrap.js"></script> <script src="../lib/jquery-toggles/toggles.js"></script> <script src="../js/quirk.js"></script> </body> </html>