/
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 class="active"><a href="timeline.html">Timeline</a></li> <li><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"> <ol class="breadcrumb breadcrumb-quirk"> <li><a href="index.php"><i class="fa fa-home mr5"></i> Home</a></li> <li><a href="buttons.html">Pages</a></li> <li class="active">Timeline</li> </ol> <hr class="darken"> <div class="row"> <div class="col-sm-8 col-md-9 col-lg-10"> <div class="timeline-wrapper"> <div class="timeline-date">Sunday, July 05, 2015</div> <div class="panel panel-post-item status"> <div class="panel-heading"> <div class="media"> <div class="media-left"> <a href="#"> <img alt="" src="../images/photos/user1.png" class="media-object img-circle"> </a> </div> <div class="media-body"> <h4 class="media-heading">Christina R. Hill</h4> <p class="media-usermeta"> <span class="media-time">10:30 am</span> <i class="glyphicon glyphicon-map-marker"></i> <a href="">San Francisco, CA</a> </p> </div> </div><!-- media --> <ul class="panel-options"> <li><a class="tooltips" href="" data-toggle="tooltip" title="View Options"><i class="glyphicon glyphicon-option-vertical"></i></a></li> </ul> </div><!-- panel-heading --> <div class="panel-body"> Prototyping is one of the best things that can happen within a project, yet it is extremely underutilized. <a href="">#prototype</a> </div> <div class="panel-footer"> <ul class="list-inline"> <li><a href=""><i class="glyphicon glyphicon-heart"></i> Like</a></li> <li><a data-target="#comment-1" data-toggle="collapse"><i class="glyphicon glyphicon-comment"></i> Comments (2)</a></li> <li class="pull-right">24 liked this</li> </ul> </div> <div class="collapse" id="comment-1"> <ul class="media-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">Floyd M. Romero <small>8 minutes ago</small></h4> Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium. </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">Jennie S. Gray <small>5 minutes ago</small></h4> Nor again is there anyone who loves or pursues or desires to obtain pain of itself, </div> </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 status"> <div class="panel-heading"> <div class="media"> <div class="media-left"> <a href="#"> <img alt="" src="../images/photos/user2.png" class="media-object img-circle"> </a> </div> <div class="media-body"> <h4 class="media-heading">Floyd M. Romero</h4> <p class="media-usermeta"> <span class="media-time">09:52 am</span> <i class="glyphicon glyphicon-map-marker"></i> <a href="">Sydney, Australia</a> </p> </div> </div><!-- media --> <ul class="panel-options"> <li><a class="tooltips" href="" data-toggle="tooltip" title="View Options"><i class="glyphicon glyphicon-option-vertical"></i></a></li> </ul> </div><!-- panel-heading --> <div class="panel-body"> In my experience, the most important factors are the client and the project’s complexity. Even if I understand the project well, I would like a high-fidelity, high-functionality prototype just in case. One of the fundamental mistakes you can make in projects is thinking you know them well. <a href="">#prototype</a> <a href="">#complexity</a> </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 commented"> <div class="panel-heading"> <div class="media"> <div class="media-left"> <a href="#"> <img alt="" src="../images/photos/user3.png" class="media-object img-circle"> </a> </div> <div class="media-body"> <h4 class="media-heading">Jennie S. Gray <span>commented on this</span></h4> <p class="media-usermeta"> <span class="media-time">09:24 am</span> <i class="glyphicon glyphicon-map-marker"></i> <a href="">Tokyo, Japan</a> </p> </div> </div><!-- media --> <ul class="panel-options"> <li><a class="tooltips" href="" data-toggle="tooltip" title="View Options"><i class="glyphicon glyphicon-option-vertical"></i></a></li> </ul> </div><!-- panel-heading --> <div class="panel-body"> <div class="media"> <div class="media-left"> <a href="#"> <img class="media-object width100" src="../images/image.png" alt=""> </a> </div> <div class="media-body"> <h4 class="media-heading"><a href="">Five steps to Website Redesign</a></h4> <p>For the past 12 years, Website Redesign Pros has been redesigning New York City’s very own breed of internet ventures. Once considered as the last recourse to rebirth by the rarest of rare internet entrepreneurs, ...</p> <p class="mt10"><a href="http://goo.gl/d0jake">http://goo.gl/d0jake</a></p> </div> </div> </div> <div class="panel-footer"> <ul class="list-inline"> <li><a href=""><i class="glyphicon glyphicon-heart"></i> Like</a></li> <li><a data-target="#comment-2" data-toggle="collapse"><i class="glyphicon glyphicon-comment"></i> Comments (1)</a></li> <li class="pull-right">2 liked this</li> </ul> </div> <div class="collapse" id="comment-2"> <ul class="media-list"> <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">Jennie S. Gray <small>8 minutes ago</small></h4> Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium. </div> </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 pictures"> <div class="panel-heading"> <div class="media"> <div class="media-left"> <a href="#"> <img alt="" src="../images/photos/user3.png" class="media-object img-circle"> </a> </div> <div class="media-body"> <h4 class="media-heading">Alia J. Locher <span>added 3 new photos</span></h4> <p class="media-usermeta"> <span class="media-time">09:06 am</span> <i class="glyphicon glyphicon-map-marker"></i> <a href="">Tokyo, Japan</a> </p> </div> </div><!-- media --> <ul class="panel-options"> <li><a class="tooltips" href="" data-toggle="tooltip" title="View Options"><i class="glyphicon glyphicon-option-vertical"></i></a></li> </ul> </div><!-- panel-heading --> <div class="panel-body"> <div class="row photos"> <div class="col-xs-8"> <a href=""><img class="img-responsive" src="../images/image.png" alt=""></a> </div> <div class="col-xs-4"> <a href=""><img class="img-responsive" src="../images/image.png" alt=""></a> <a href=""><img class="img-responsive" src="../images/image.png" alt=""></a> </div> </div> </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">19 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 twitter"> <div class="panel-heading"> <div class="media"> <div class="media-left"> <a href="#"> <img alt="" src="../images/photos/user5.png" class="media-object img-circle"> </a> </div> <div class="media-body"> <h4 class="media-heading">Nicholas T. Hinkle <span>shared a tweet</span></h4> <p class="media-usermeta"> <span class="media-time">08:46 am</span> <i class="glyphicon glyphicon-map-marker"></i> <a href="">Madrid, Spain</a> </p> </div> </div><!-- media --> <ul class="panel-options"> <li><a class="tooltips" href="" data-toggle="tooltip" title="View Options"><i class="glyphicon glyphicon-option-vertical"></i></a></li> </ul> </div><!-- panel-heading --> <div class="panel-body"> <p>Whenever there’s a crisis of confidence in terms of strategy, planning, or work mechanisms, a company is forced to take the restructuring route.</p> <p>via Twitter</p> </div> </div><!-- panel panel-post --> <div class="timeline-date">Friday, July 03, 2015</div> <div class="panel panel-post-item twitter"> <div class="panel-heading"> <div class="media"> <div class="media-left"> <a href="#"> <img alt="" src="../images/photos/user6.png" class="media-object img-circle"> </a> </div> <div class="media-body"> <h4 class="media-heading">Jamie W. Bradford <span>shared a tweet</span></h4> <p class="media-usermeta"> <span class="media-time">10:15 pm</span> <i class="glyphicon glyphicon-map-marker"></i> <a href="">Bali, Indonesia</a> </p> </div> </div><!-- media --> <ul class="panel-options"> <li><a class="tooltips" href="" data-toggle="tooltip" title="View Options"><i class="glyphicon glyphicon-option-vertical"></i></a></li> </ul> </div><!-- panel-heading --> <div class="panel-body"> <p>A friend of mine who is new to web designing told me he is having facing some difficulties creating layouts using tables.</p> <p>via Twitter</p> </div> </div><!-- panel panel-post --> <div class="panel panel-post-item commented"> <div class="panel-heading"> <div class="media"> <div class="media-left"> <a href="#"> <img alt="" src="../images/photos/user3.png" class="media-object img-circle"> </a> </div> <div class="media-body"> <h4 class="media-heading">Jennie S. Gray <span>published a new article</span></h4> <p class="media-usermeta"> <span class="media-time">09:24 pm</span> <i class="glyphicon glyphicon-map-marker"></i> <a href="">Sacramento, CA, USA</a> </p> </div> </div><!-- media --> <ul class="panel-options"> <li><a class="tooltips" href="" data-toggle="tooltip" title="View Options"><i class="glyphicon glyphicon-option-vertical"></i></a></li> </ul> </div><!-- panel-heading --> <div class="panel-body"> <div class="media"> <div class="media-left"> <a href="#"> <img class="media-object width100" src="../images/image.png" alt=""> </a> </div> <div class="media-body"> <h4 class="media-heading"><a href="">Getting started with Bootstrap</a></h4> <p>For any front-ender or coder, sooner or later the time comes to create his/her own small framework. It usually consists of those rules and functions that had to be repeated in every recent project...</p> <p class="mt10"><a href="http://goo.gl/dXxNxR">http://goo.gl/dXxNxR</a></p> </div> </div> </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">18 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="timeline-date"><a href="">Load more...</a></div> </div><!-- timeline-wrapper --> </div> <div class="col-sm-4 col-md-3 col-lg-2"> <div class="panel panel-primary-full"> <div class="panel-heading"> <h3 class="panel-title">Headlines</h3> </div> <div class="panel-body"> <p class="nomargin">Graeco feugait ea quo. Quot erat vidit ad nam, mea quod nostro dolores ad. Elitr theophrastus vis ex. Volutpat consulatu vel ex. Viderer consulatu ei pro, in has aliquid placerat philosophia, timeam admodum minimum vim no.</p> </div> </div><!-- panel --> <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 class="panel"> <div class="panel-heading"> <h4 class="panel-title">Your Followers 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><!-- 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>