eclass.unmer.ac.id

<!DOCTYPE html>

<title>Tabs & Accordions - UI elements - PixelAdmin: Responsive Bootstrap Template</title>

<script>function _pxDemo_loadStylesheet(a,b,c){var c=c||decodeURIComponent((new RegExp(";\\s*"+encodeURIComponent("px-demo-theme")+"\\s*=\\s*([^;]+)\\s*;","g").exec(";"+document.cookie+";")||[])[1]||"clean"),d="rtl"===document.getElementsByTagName("html")[0].getAttribute("dir");document.write(a.replace(/^(.*?)((?:\.min)?\.css)$/,'<link href="$1'+(c.indexOf("dark")!==-1&&a.indexOf("/css/")!==-1&&a.indexOf("/themes/")===-1?"-dark":"")+(!d||0!==a.indexOf("assets/css")&&0!==a.indexOf("assets/demo")?"":".rtl")+'$2" rel="stylesheet" type="text/css"'+(b?'class="'+b+'"':"")+">"))}</script>

<script>"ltr"!==document.getElementsByTagName("html")[0].getAttribute("dir")&&"1"===decodeURIComponent((new RegExp(";\\s*"+encodeURIComponent("px-demo-rtl")+"\\s*=\\s*([^;]+)\\s*;","g").exec(";"+document.cookie+";")||[])[1]||"0")&&document.getElementsByTagName("html")[0].setAttribute("dir","rtl");</script>

<script>
    _pxDemo_loadStylesheet('assets/css/bootstrap.min.css', 'px-demo-stylesheet-bs');
    _pxDemo_loadStylesheet('assets/css/pixeladmin.min.css', 'px-demo-stylesheet-core');
    _pxDemo_loadStylesheet('assets/css/widgets.min.css', 'px-demo-stylesheet-widgets');
  </script>

<script>
    function _pxDemo_loadTheme(a){var b=decodeURIComponent((new RegExp(";\\s*"+encodeURIComponent("px-demo-theme")+"\\s*=\\s*([^;]+)\\s*;","g").exec(";"+document.cookie+";")||[])[1]||"clean");_pxDemo_loadStylesheet(a+b+".min.css","px-demo-stylesheet-theme",b)}
    _pxDemo_loadTheme('assets/css/themes/');
  </script>

<script>_pxDemo_loadStylesheet('assets/demo/demo.css');</script>

<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/holder/2.9.0/holder.js"></script>

<script src="assets/pace/pace.min.js"></script>

<ul class="px-nav-content">
      <li class="px-nav-box p-a-3 b-b-1" id="demo-px-nav-box">
        <button type="button" class="close" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <img src="assets/demo/avatars/1.jpg" alt="" class="pull-xs-left m-r-2 border-round" style="width: 54px; height: 54px;">
        <div class="font-size-16"><span class="font-weight-light">Welcome, </span><strong>John</strong></div>
        <div class="btn-group" style="margin-top: 4px;">
          <a href="#" class="btn btn-xs btn-primary btn-outline"><i class="fa fa-envelope"></i></a>
          <a href="#" class="btn btn-xs btn-primary btn-outline"><i class="fa fa-user"></i></a>
          <a href="#" class="btn btn-xs btn-primary btn-outline"><i class="fa fa-cog"></i></a>
          <a href="#" class="btn btn-xs btn-danger btn-outline"><i class="fa fa-power-off"></i></a>
        </div>
      </li>

<li class="px-nav-item px-nav-dropdown">
        <a href="#"><i class="px-nav-icon ion-ios-pulse-strong"></i><span class="px-nav-label">Dashboards<span class="label label-danger">5</span></span></a>

<ul class="px-nav-dropdown-menu">
          <li class="px-nav-item"><a href="index.html"><span class="px-nav-label">Default</span></a></li>
          <li class="px-nav-item"><a href="dashboards-analytics.html"><span class="px-nav-label">Analytics</span></a></li>
          <li class="px-nav-item"><a href="dashboards-videos.html"><span class="px-nav-label">Videos</span></a></li>
          <li class="px-nav-item"><a href="dashboards-financial.html"><span class="px-nav-label">Financial</span></a></li>
          <li class="px-nav-item"><a href="dashboards-blog.html"><span class="px-nav-label">Blog</span></a></li>
        </ul>
      </li>
      <li class="px-nav-item">
        <a href="boxes.html"><i class="px-nav-icon ion-ios-analytics"></i><span class="px-nav-label">Boxes</span></a>
      </li>
      <li class="px-nav-item px-nav-dropdown">
        <a href="#"><i class="px-nav-icon ion-erlenmeyer-flask"></i><span class="px-nav-label">Widgets</span></a>

<ul class="px-nav-dropdown-menu">
          <li class="px-nav-item"><a href="widgets-lists.html"><span class="px-nav-label">Lists</span></a></li>
          <li class="px-nav-item"><a href="widgets-pricing.html"><span class="px-nav-label">Pricing</span></a></li>
          <li class="px-nav-item"><a href="widgets-timeline.html"><span class="px-nav-label">Timeline</span></a></li>
          <li class="px-nav-item"><a href="widgets-misc.html"><span class="px-nav-label">Misc</span></a></li>
        </ul>
      </li>
      <li class="px-nav-item">
        <a href="utilities.html"><i class="px-nav-icon ion-cube"></i><span class="px-nav-label">Utilities</span></a>
      </li>
      <li class="px-nav-item px-nav-dropdown">
        <a href="#"><i class="px-nav-icon ion-monitor"></i><span class="px-nav-label">UI elements</span></a>

<ul class="px-nav-dropdown-menu">
          <li class="px-nav-item"><a href="ui-buttons.html"><span class="px-nav-label">Buttons</span></a></li>
          <li class="px-nav-item"><a href="ui-tabs.html"><span class="px-nav-label">Tabs & Accordions</span></a></li>
          <li class="px-nav-item"><a href="ui-modals.html"><span class="px-nav-label">Modals</span></a></li>
          <li class="px-nav-item"><a href="ui-alerts.html"><span class="px-nav-label">Alerts & Tooltips</span></a></li>
          <li class="px-nav-item"><a href="ui-panels.html"><span class="px-nav-label">Panels</span></a></li>
          <li class="px-nav-item"><a href="ui-sortable.html"><span class="px-nav-label">Sortable</span></a></li>
          <li class="px-nav-item"><a href="ui-carousel.html"><span class="px-nav-label">Carousel</span></a></li>
          <li class="px-nav-item"><a href="ui-misc.html"><span class="px-nav-label">Misc</span></a></li>
        </ul>
      </li>
      <li class="px-nav-item px-nav-dropdown">
        <a href="#"><i class="px-nav-icon ion-android-checkbox-outline"></i><span class="px-nav-label">Forms</span></a>

<ul class="px-nav-dropdown-menu">
          <li class="px-nav-item"><a href="forms-layout.html"><span class="px-nav-label">Layout</span></a></li>
          <li class="px-nav-item"><a href="forms-controls.html"><span class="px-nav-label">Controls</span></a></li>
          <li class="px-nav-item"><a href="forms-components.html"><span class="px-nav-label">Components</span></a></li>
          <li class="px-nav-item"><a href="forms-advanced.html"><span class="px-nav-label">Advanced</span></a></li>
          <li class="px-nav-item"><a href="forms-sliders.html"><span class="px-nav-label">Sliders</span></a></li>
          <li class="px-nav-item"><a href="forms-pickers.html"><span class="px-nav-label">Pickers</span></a></li>
          <li class="px-nav-item"><a href="forms-editors.html"><span class="px-nav-label">Editors</span></a></li>
          <li class="px-nav-item"><a href="forms-validation.html"><span class="px-nav-label">Validation</span></a></li>
        </ul>
      </li>
      <li class="px-nav-item px-nav-dropdown">
        <a href="#"><i class="px-nav-icon ion-ios-keypad"></i><span class="px-nav-label">Tables</span></a>

<ul class="px-nav-dropdown-menu">
          <li class="px-nav-item"><a href="tables-bootstrap.html"><span class="px-nav-label">Bootstrap</span></a></li>
          <li class="px-nav-item"><a href="tables-datatables.html"><span class="px-nav-label">DataTables</span></a></li>
          <li class="px-nav-item"><a href="tables-editable-table.html"><span class="px-nav-label">editableTableWidget</span></a></li>
        </ul>
      </li>
      <li class="px-nav-item px-nav-dropdown">
        <a href="#"><i class="px-nav-icon ion-stats-bars"></i><span class="px-nav-label">Charts</span></a>

<ul class="px-nav-dropdown-menu">
          <li class="px-nav-item"><a href="charts-flot.html"><span class="px-nav-label">Flot.js</span></a></li>
          <li class="px-nav-item"><a href="charts-morris.html"><span class="px-nav-label">Morris.js</span></a></li>
          <li class="px-nav-item"><a href="charts-chart.html"><span class="px-nav-label">Chart.js</span></a></li>
          <li class="px-nav-item"><a href="charts-chartist.html"><span class="px-nav-label">Chartist</span></a></li>
          <li class="px-nav-item"><a href="charts-c3.html"><span class="px-nav-label">C3.js</span></a></li>
          <li class="px-nav-item"><a href="charts-sparkline.html"><span class="px-nav-label">Sparkline</span></a></li>
          <li class="px-nav-item"><a href="charts-easy-pie-chart.html"><span class="px-nav-label">Easy Pie Chart</span></a></li>
        </ul>
      </li>
      <li class="px-nav-item px-nav-dropdown">
        <a href="#"><i class="px-nav-icon ion-ios-paper"></i><span class="px-nav-label">Pages<span class="label label-info">22</span></span></a>

<ul class="px-nav-dropdown-menu">
          <li class="px-nav-item px-nav-dropdown">
            <a href="#"><span class="px-nav-label">Authentication</span></a>

<ul class="px-nav-dropdown-menu">
              <li class="px-nav-item"><a href="pages-blog-posts.html"><span class="px-nav-label">Posts</span></a></li>
              <li class="px-nav-item"><a href="pages-blog-post.html"><span class="px-nav-label">Post</span></a></li>
            </ul>
          </li>
          <li class="px-nav-item px-nav-dropdown">
            <a href="#"><span class="px-nav-label">Error pages</span></a>

<ul class="px-nav-dropdown-menu">
              <li class="px-nav-item"><a href="pages-404.html"><span class="px-nav-label">404</span></a></li>
              <li class="px-nav-item"><a href="pages-500.html"><span class="px-nav-label">500</span></a></li>
            </ul>
          </li>
          <li class="px-nav-item px-nav-dropdown">
            <a href="#"><span class="px-nav-label">Forum</span></a>

<ul class="px-nav-dropdown-menu">
              <li class="px-nav-item"><a href="pages-forum-forums-list.html"><span class="px-nav-label">Forums list</span></a></li>
              <li class="px-nav-item"><a href="pages-forum-topics.html"><span class="px-nav-label">Topics</span></a></li>
              <li class="px-nav-item"><a href="pages-forum-thread.html"><span class="px-nav-label">Thread</span></a></li>
            </ul>
          </li>
          <li class="px-nav-item px-nav-dropdown">
            <a href="#"><span class="px-nav-label">Messages</span></a>

<ul class="px-nav-dropdown-menu">
              <li class="px-nav-item"><a href="pages-messages-list.html"><span class="px-nav-label">List</span></a></li>
              <li class="px-nav-item"><a href="pages-messages-item.html"><span class="px-nav-label">Item</span></a></li>
              <li class="px-nav-item"><a href="pages-messages-new.html"><span class="px-nav-label">New message</span></a></li>
            </ul>
          </li>
          <li class="px-nav-item"><a href="pages-about-us.html"><span class="px-nav-label">About Us</span></a></li>
          <li class="px-nav-item"><a href="pages-account.html"><span class="px-nav-label">Account</span></a></li>
          <li class="px-nav-item"><a href="pages-invoice.html"><span class="px-nav-label">Invoice</span></a></li>
          <li class="px-nav-item"><a href="pages-pricing.html"><span class="px-nav-label">Pricing</span></a></li>
          <li class="px-nav-item"><a href="pages-profile-v1.html"><span class="px-nav-label">Profile v1</span></a></li>
          <li class="px-nav-item"><a href="pages-profile-v2.html"><span class="px-nav-label">Profile v2</span></a></li>
          <li class="px-nav-item"><a href="pages-search-results.html"><span class="px-nav-label">Search results</span></a></li>
          <li class="px-nav-item"><a href="pages-support-center.html"><span class="px-nav-label">Support center</span></a></li>
          <li class="px-nav-item"><a href="pages-blank.html"><span class="px-nav-label">Blank</span></a></li>
        </ul>
      </li>
      <li class="px-nav-item">
        <a href="../color_generator/index.html"><i class="px-nav-icon ion-aperture"></i><span class="px-nav-label">Color Generator</span></a>
      </li>
      <li class="px-nav-item">
        <a href="../docs/index.html" target="_blank" class="bg-success text-white b-a-0"><i class="px-nav-icon ion-social-buffer"></i><span class="px-nav-label">Docs</span></a>
      </li>
      <li class="px-nav-box b-t-1 p-a-2">
        <a href="pages-invoice.html" class="btn btn-primary btn-block btn-outline">Create Invoice</a>
      </li>
    </ul>
  </nav>

<nav class="navbar px-navbar">
    
    <div class="navbar-header">
      <a class="navbar-brand px-demo-brand" href="index.html"><span class="px-demo-logo bg-primary"><span class="px-demo-logo-1"></span><span class="px-demo-logo-2"></span><span class="px-demo-logo-3"></span><span class="px-demo-logo-4"></span><span class="px-demo-logo-5"></span><span class="px-demo-logo-6"></span><span class="px-demo-logo-7"></span><span class="px-demo-logo-8"></span><span class="px-demo-logo-9"></span></span>PixelAdmin</a>
    </div>

<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#px-demo-navbar-collapse" aria-expanded="false"><i class="navbar-toggle-icon"></i></button>

<div class="collapse navbar-collapse" id="px-demo-navbar-collapse">
      <ul class="nav navbar-nav">
        <li class="dropdown">
          <a href class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Categories</a>
          <div class="dropdown-multi-column">
            <ul class="dropdown-menu dropdown-column col-md-4">
              <li class="dropdown-header">Business</li>
              <li><a href="#">Design &amp; Urban Ecologies</a></li>
              <li><a href="#">Fine Art</a></li>
              <li><a href="#">Fashion Design</a></li>
              <li><a href="#">Strategic Design</a></li>
            </ul>
            <ul class="dropdown-menu dropdown-column col-md-4">
              <li class="dropdown-header">Liberal Arts</li>
              <li><a href="#">Anthropology</a></li>
              <li><a href="#">Media Studies</a></li>
              <li><a href="#">Philosophy</a></li>
            </ul>
            <ul class="dropdown-menu dropdown-column col-md-4">
              <li class="dropdown-header">Social Sciences</li>
              <li><a href="#">Food Studies</a></li>
              <li><a href="#">Journalism</a></li>
              <li><a href="#">Non Profit Management</a></li>
            </ul>
          </div>
        </li>

<li class="dropdown">
          <a href class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><i class="fa fa-bookmark m-r-1"></i>Links</a>
          <ul class="dropdown-menu">
            <li class="dropdown-toggle">
              <a href>Products</a>
              <ul class="dropdown-menu">
                <li><a href="#">All</a></li>
                <li><a href="#">Popular</a></li>
                <li><a href="#">Recent</a></li>
                <li><a href="#">Featured</a></li>
                <li class="divider"></li>
                <li><a href="#"><i class="fa fa-plus m-r-1"></i>Add product</a></li>
              </ul>
            </li>
            <li class="dropdown-toggle">
              <a href>Users</a>
              <ul class="dropdown-menu">
                <li><a href="#">All</a></li>
                <li><a href="#">Recent</a></li>
                <li><a href="#">Banned</a></li>
                <li class="divider"></li>
                <li><a href="#"><i class="fa fa-user-plus m-r-1"></i>Create user</a></li>
              </ul>
            </li>
            <li class="dropdown-toggle">
              <a href>Blog</a>
              <ul class="dropdown-menu">
                <li><a href="#">All</a></li>
                <li><a href="#">Popular</a></li>
                <li class="divider"></li>
                <li><a href="#"><i class="fa fa-edit m-r-1"></i>New blog post</a></li>
              </ul>
            </li>
            <li class="divider"></li>
            <li><a href="#">Overview</a></li>
          </ul>
        </li>
      </ul>

<ul class="nav navbar-nav navbar-right">
        <li class="dropdown">
          <a href="https://stackoverflow.com" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
            <i class="px-navbar-icon fa fa-bullhorn font-size-14"></i>
            <span class="px-navbar-icon-label">Notifications</span>
            <span class="px-navbar-label label label-success">5</span>
          </a>
          <div class="dropdown-menu p-a-0" style="width: 300px">
            <div id="navbar-notifications" style="height: 280px; position: relative;">
              <div class="widget-notifications-item">
                <div class="widget-notifications-title text-danger">SYSTEM</div>
                <div class="widget-notifications-description"><strong>Error 500</strong>: Syntax error in index.php at line <strong>461</strong>.</div>
                <div class="widget-notifications-date">12h ago</div>
                <div class="widget-notifications-icon fa fa-hdd-o bg-danger"></div>
              </div>

<div class="widget-notifications-item">
                <div class="widget-notifications-title text-info">STORE</div>
                <div class="widget-notifications-description">You have <strong>9</strong> new orders.</div>
                <div class="widget-notifications-date">12h ago</div>
                <div class="widget-notifications-icon fa fa-truck bg-info"></div>
              </div>

<div class="widget-notifications-item">
                <div class="widget-notifications-title text-default">CRON DAEMON</div>
                <div class="widget-notifications-description">Job <strong>"Clean DB"</strong> has been completed.</div>
                <div class="widget-notifications-date">12h ago</div>
                <div class="widget-notifications-icon fa fa-clock-o bg-default"></div>
              </div>

<div class="widget-notifications-item">
                <div class="widget-notifications-title text-success">SYSTEM</div>
                <div class="widget-notifications-description">Server <strong>up</strong>.</div>
                <div class="widget-notifications-date">12h ago</div>
                <div class="widget-notifications-icon fa fa-hdd-o bg-success"></div>
              </div>

<div class="widget-notifications-item">
                <div class="widget-notifications-title text-warning">SYSTEM</div>
                <div class="widget-notifications-description"><strong>Warning</strong>: Processor load <strong>92%</strong>.</div>
                <div class="widget-notifications-date">12h ago</div>
                <div class="widget-notifications-icon fa fa-hdd-o bg-warning"></div>
              </div>
            </div>

<a href="#" class="widget-more-link">MORE NOTIFICATIONS</a>
          </div>
        </li>

<li class="dropdown">
          <a href="https://google.com" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
            <i class="px-navbar-icon fa fa-envelope font-size-14"></i>
            <span class="px-navbar-icon-label">Income messages</span>
            <span class="px-navbar-label label label-danger">8</span>
          </a>
          <div class="dropdown-menu p-a-0" style="width: 300px;">
            <div id="navbar-messages" style="height: 280px; position: relative;">
              <div class="widget-messages-alt-item">
                <img src="assets/demo/avatars/2.jpg" alt="" class="widget-messages-alt-avatar">
                <a href="#" class="widget-messages-alt-subject text-truncate">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</a>
                <div class="widget-messages-alt-description">from <a href="#">Robert Jang</a></div>
                <div class="widget-messages-alt-date">2h ago</div>
              </div>

<div class="widget-messages-alt-item">
                <img src="assets/demo/avatars/3.jpg" alt="" class="widget-messages-alt-avatar">
                <a href="#" class="widget-messages-alt-subject text-truncate">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</a>
                <div class="widget-messages-alt-description">from <a href="#">Michelle Bortz</a></div>
                <div class="widget-messages-alt-date">2h ago</div>
              </div>

<div class="widget-messages-alt-item">
                <img src="assets/demo/avatars/4.jpg" alt="" class="widget-messages-alt-avatar">
                <a href="#" class="widget-messages-alt-subject text-truncate">Lorem ipsum dolor sit amet.</a>
                <div class="widget-messages-alt-description">from <a href="#">Timothy Owens</a></div>
                <div class="widget-messages-alt-date">2h ago</div>
              </div>

<div class="widget-messages-alt-item">
                <img src="assets/demo/avatars/5.jpg" alt="" class="widget-messages-alt-avatar">
                <a href="#" class="widget-messages-alt-subject text-truncate">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</a>
                <div class="widget-messages-alt-description">from <a href="#">Denise Steiner</a></div>
                <div class="widget-messages-alt-date">2h ago</div>
              </div>

<div class="widget-messages-alt-item">
                <img src="assets/demo/avatars/2.jpg" alt="" class="widget-messages-alt-avatar">
                <a href="#" class="widget-messages-alt-subject text-truncate">Lorem ipsum dolor sit amet.</a>
                <div class="widget-messages-alt-description">from <a href="#">Robert Jang</a></div>
                <div class="widget-messages-alt-date">2h ago</div>
              </div>

<a href="#" class="widget-more-link">MORE MESSAGES</a>
          </div> 
        </li>

<li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
            <img src="assets/demo/avatars/1.jpg" alt="" class="px-navbar-image">
            <span class="hidden-md">John Doe</span>
          </a>
          <ul class="dropdown-menu">
            <li><a href="pages-profile-v2.html"><span class="label label-warning pull-xs-right"><i class="fa fa-asterisk"></i></span>Profile</a></li>
            <li><a href="pages-account.html">Account</a></li>
            <li><a href="pages-messages-list.html"><i class="dropdown-icon fa fa-envelope"></i>&nbsp;&nbsp;Messages</a></li>
            <li class="divider"></li>
            <li><a href="pages-signin-v1.html"><i class="dropdown-icon fa fa-power-off"></i>&nbsp;&nbsp;Log Out</a></li>
          </ul>
        </li>

</ul>
    </div>
  </nav>

<div class="px-content">
    <div class="page-header">
      <h1><span class="text-muted font-weight-light"><i class="page-header-icon ion-monitor"></i>UI elements / </span>Tabs & Accordions</h1>
    </div>

<div class="row">
      <div class="col-md-6">
        <div class="panel">
          <div class="panel-heading">
            <div class="panel-title">Default tabs</div>
          </div>
          <div class="panel-body">
            <ul class="nav nav-tabs">
              <li class="active">
                <a href="#tabs-home" data-toggle="tab">
                  Home <span class="label label-success">12</span>
                </a>
              </li>
              <li>
                <a href="#tabs-profile" data-toggle="tab">
                  Profile <span class="badge badge-primary">12</span>
                </a>
              </li>
              <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>
                <ul class="dropdown-menu">
                  <li>
                    <a href="#tabs-dropdown1" data-toggle="tab">@fat</a>
                  </li>
                  <li>
                    <a href="#tabs-dropdown2" data-toggle="tab">@mdo</a>
                  </li>
                </ul>
              </li>
            </ul>

<div class="tab-content tab-content-bordered">
              <div class="tab-pane fade in active" id="tabs-home">
                <p>
                  Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt
                  tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor,
                  williamsburg carles vegan helvetica. Reprehenderit butcher retro keffiyed
                  dreamcatcher synth. Cosby sweater eu banh mi, qui irure terry richardson
                  ex squid. Aliquip placeat salvia cillum iphone. Seitan aliquip quis
                  cardigan american apparel, butcher voluptate nisi qui.
                </p>
              </div>
              <div class="tab-pane fade" id="tabs-profile">
                <p>
                  Food truck fixie locavore, accusamus mcsweeney's marfa nulla single-origin
                  coffee squid. Exercitation +1 labore velit, blog sartorial PBR leggings
                  next level wes anderson artisan four loko farm-to-table craft beer twee.
                  Qui photo booth letterpress, commodo enim craft beer mlkshk aliquip jean
                  shorts ullamco ad vinyl cillum PBR. Homo nostrud organic, assumenda labore
                  aesthetic magna delectus mollit. Keytar helvetica VHS salvia yr, vero magna
                  velit sapiente labore stumptown. Vegan fanny pack odio cillum wes anderson
                  8-bit, sustainable jean shorts beard ut DIY ethical culpa terry richardson
                  biodiesel.
                </p>
              </div>
              <div class="tab-pane fade" id="tabs-dropdown1">
                <p>
                  Etsy mixtape wayfarers, ethical wes anderson tofu before they sold out
                  mcsweeney's organic lomo retro fanny pack lo-fi farm-to-table readymade.
                  Messenger bag gentrify pitchfork tattooed craft beer, iphone skateboard
                  locavore carles etsy salvia banksy hoodie helvetica. DIY synth PBR banksy
                  irony. Leggings gentrify squid 8-bit cred pitchfork. Williamsburg banh mi
                  whatever gluten-free, carles pitchfork biodiesel fixie etsy retro mlkshk
                  vice blog. Scenester cred you probably haven't heard of them, vinyl craft
                  beer blog stumptown. Pitchfork sustainable tofu synth chambray yr.
                </p>
              </div>
              <div class="tab-pane fade" id="tabs-dropdown2">
                <p>
                  Trust fund seitan letterpress, keytar raw denim keffiyeh etsy art party
                  before they sold out master cleanse gluten-free squid scenester freegan
                  cosby sweater. Fanny pack portland seitan DIY, art party locavore wolf
                  cliche high life echo park Austin. Cred vinyl keffiyeh DIY salvia PBR,
                  banh mi before they sold out farm-to-table VHS viral locavore cosby
                  sweater. Lomo wolf viral, mustache readymade thundercats keffiyeh craft
                  beer marfa ethical. Wolf salvia freegan, sartorial keffiyeh echo park
                  vegan.
                </p>
              </div>
            </div>
          </div>
        </div>

<div class="panel">
          <div class="panel-heading">
            <div class="panel-title">Simple tabs</div>
          </div>
          <div class="panel-body">
            <ul class="nav nav-tabs nav-tabs-simple">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>
          </div>
        </div>

<div class="panel">
          <div class="panel-heading">
            <div class="panel-title">Pills</div>
          </div>
          <div class="panel-body">
            <ul class="nav nav-pills">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>
          </div>
        </div>

<div class="panel">
          <div class="panel-heading">
            <div class="panel-title">Stacked</div>
          </div>
          <div class="panel-body">
            <ul class="nav nav-tabs nav-stacked">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>

<br>

<ul class="nav nav-pills nav-stacked">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>
          </div>
        </div>

<div class="panel">
          <div class="panel-heading">
            <div class="panel-title">Justified</div>
          </div>
          <div class="panel-body">
            <ul class="nav nav-tabs nav-justified">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>

<br>

<ul class="nav nav-pills nav-justified">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>
          </div>
        </div>

</div>
      <div class="col-md-6">
        <div class="panel">
          <div class="panel-heading">
            <div class="panel-title">Sizes</div>
          </div>
          <div class="panel-body">
            <ul class="nav nav-tabs nav-xs">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>

<br>

<ul class="nav nav-tabs nav-tabs-simple nav-xs">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>

<br>

<ul class="nav nav-pills nav-xs">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>

<ul class="nav nav-tabs nav-sm">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>

<br>

<ul class="nav nav-tabs nav-tabs-simple nav-sm">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>

<br>

<ul class="nav nav-pills nav-sm">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>

<ul class="nav nav-tabs nav-lg">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>

<br>

<ul class="nav nav-tabs nav-tabs-simple nav-lg">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>

<br>

<ul class="nav nav-pills nav-lg">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>

<ul class="nav nav-tabs nav-xl">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>

<br>

<ul class="nav nav-tabs nav-tabs-simple nav-xl">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>

<br>

<ul class="nav nav-pills nav-xl">
              <li class="active">
                <a href="#">Home<span class="label label-warning">14</span></a>
              </li>
              <li>
                <a href="#">Help<span class="badge badge-danger">16</span></a>
              </li>
              <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown</a>
                <ul class="dropdown-menu">
                  <li><a href="#">Action</a></li>
                  <li><a href="#">Another action</a></li>
                  <li><a href="#">Something else here</a></li>
                  <li class="divider"></li>
                  <li><a href="#">Separated link</a></li>
                </ul>
              </li>
            </ul>
          </div>
        </div>

<div class="panel">
          <div class="panel-heading">
            <div class="panel-title">Justified</div>
          </div>
          <div class="panel-body">
            <ul class="nav nav-tabs">
              <li>
                <a href="#">Clickable link</a>
              </li>
              <li>
                <a href="#">Clickable link</a>
              </li>
              <li class="disabled">
                <a href="#">Disabled link</a>
              </li>
            </ul>

<br>

<ul class="nav nav-pills">
              <li>
                <a href="#">Clickable link</a>
              </li>
              <li>
                <a href="#">Clickable link</a>
              </li>
              <li class="disabled">
                <a href="#">Disabled link</a>
              </li>
            </ul>
          </div>
        </div>

</div>
    </div>

<div class="panel">
      <div class="panel-heading">
        <div class="panel-title">Tab Resize Plugin</div>
      </div>
      <div class="panel-body">
        <div class="row">
          <div class="col-md-6">
            <ul class="nav nav-tabs" id="tab-resize-tabs">
              <li class="active"><a href="#tab-resize-tabs-1" data-toggle="tab">Section 1</a></li>
              <li><a href="#tab-resize-tabs-2" data-toggle="tab">Section 2</a></li>
              <li><a href="#tab-resize-tabs-3" data-toggle="tab">Section 3</a></li>
              <li><a href="#tab-resize-tabs-4" data-toggle="tab">Section 4</a></li>
              <li><a href="#tab-resize-tabs-5" data-toggle="tab">Section 5</a></li>
              <li><a href="#tab-resize-tabs-6" data-toggle="tab">Section 6</a></li>
              <li><a href="#tab-resize-tabs-7" data-toggle="tab">Section 7</a></li>
              <li><a href="#tab-resize-tabs-8" data-toggle="tab">Section 8</a></li>
              <li><a href="#tab-resize-tabs-9" data-toggle="tab">Section 9</a></li>
            </ul>
            <div class="tab-content">
              <div class="tab-pane active" id="tab-resize-tabs-1">
                <p>I'm in Section 1.</p>
              </div>
              <div class="tab-pane" id="tab-resize-tabs-2">
                <p>Howdy, I'm in Section 2.</p>
              </div>
              <div class="tab-pane" id="tab-resize-tabs-3">
                <p>Howdy, I'm in Section 3.</p>
              </div>
              <div class="tab-pane" id="tab-resize-tabs-4">
                <p>Howdy, I'm in Section 4.</p>
              </div>
              <div class="tab-pane" id="tab-resize-tabs-5">
                <p>Howdy, I'm in Section 5.</p>
              </div>
              <div class="tab-pane" id="tab-resize-tabs-6">
                <p>Howdy, I'm in Section 6.</p>
              </div>
              <div class="tab-pane" id="tab-resize-tabs-7">
                <p>Howdy, I'm in Section 7.</p>
              </div>
              <div class="tab-pane" id="tab-resize-tabs-8">
                <p>Howdy, I'm in Section 8.</p>
              </div>
              <div class="tab-pane" id="tab-resize-tabs-9">
                <p>Howdy, I'm in Section 9.</p>
              </div>
            </div>
          </div>
          <div class="col-md-6">
            <ul class="nav nav-pills" id="tab-resize-pills">
              <li class="active"><a href="#tab-resize-pills-1" data-toggle="tab">Section 1</a></li>
              <li><a href="#tab-resize-pills-2" data-toggle="tab">Section 2</a></li>
              <li><a href="#tab-resize-pills-3" data-toggle="tab">Section 3</a></li>
              <li><a href="#tab-resize-pills-4" data-toggle="tab">Section 4</a></li>
              <li><a href="#tab-resize-pills-5" data-toggle="tab">Section 5</a></li>
              <li><a href="#tab-resize-pills-6" data-toggle="tab">Section 6</a></li>
              <li><a href="#tab-resize-pills-7" data-toggle="tab">Section 7</a></li>
              <li><a href="#tab-resize-pills-8" data-toggle="tab">Section 8</a></li>
              <li><a href="#tab-resize-pills-9" data-toggle="tab">Section 9</a></li>
            </ul>
            <div class="tab-content">
              <div class="tab-pane active" id="tab-resize-pills-1">
                <p>I'm in Section 1.</p>
              </div>
              <div class="tab-pane" id="tab-resize-pills-2">
                <p>Howdy, I'm in Section 2.</p>
              </div>
              <div class="tab-pane" id="tab-resize-pills-3">
                <p>Howdy, I'm in Section 3.</p>
              </div>
              <div class="tab-pane" id="tab-resize-pills-4">
                <p>Howdy, I'm in Section 4.</p>
              </div>
              <div class="tab-pane" id="tab-resize-pills-5">
                <p>Howdy, I'm in Section 5.</p>
              </div>
              <div class="tab-pane" id="tab-resize-pills-6">
                <p>Howdy, I'm in Section 6.</p>
              </div>
              <div class="tab-pane" id="tab-resize-pills-7">
                <p>Howdy, I'm in Section 7.</p>
              </div>
              <div class="tab-pane" id="tab-resize-pills-8">
                <p>Howdy, I'm in Section 8.</p>
              </div>
              <div class="tab-pane" id="tab-resize-pills-9">
                <p>Howdy, I'm in Section 9.</p>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

<div class="panel">
      <div class="panel-heading">
        <div class="panel-title">Default Accordion</div>
      </div>
      <div class="panel-body">
        <div class="panel-group" id="accordion-example">
          <div class="panel">
            <div class="panel-heading">
              <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example" href="#collapseOne">
                Collapsible Group Item #1
              </a>
            </div>
            <div id="collapseOne" class="panel-collapse collapse">
              <div class="panel-body">
                Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
              </div>
            </div>
          </div>
          <div class="panel">
            <div class="panel-heading">
              <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example" href="#collapseTwo">
                Collapsible Group Item #2
              </a>
            </div>
            <div id="collapseTwo" class="panel-collapse collapse">
              <div class="panel-body">
                Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
              </div>
            </div>
          </div>
          <div class="panel">
            <div class="panel-heading">
              <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion-example" href="#collapseThree">
                Collapsible Group Item #3
              </a>
            </div>
            <div id="collapseThree" class="panel-collapse collapse in">
              <div class="panel-body">
                Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

<div class="panel">
      <div class="panel-heading">
        <div class="panel-title">Accordion colors</div>
      </div>
      <div class="panel-body">

<div class="row">
          <div class="col-md-6">
            <div class="panel-group panel-group-danger" id="accordion-example-danger">
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-danger" href="#collapseOne-danger">
                    Collapsible Group Item #1
                  </a>
                </div>
                <div id="collapseOne-danger" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-danger" href="#collapseTwo-danger">
                    Collapsible Group Item #2
                  </a>
                </div>
                <div id="collapseTwo-danger" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion-example-danger" href="#collapseThree-danger">
                    Collapsible Group Item #3
                  </a>
                </div>
                <div id="collapseThree-danger" class="panel-collapse collapse in">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="col-md-6">
            <div class="panel-group panel-group-danger panel-group-dark" id="accordion-example-danger-dark">
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-danger-dark" href="#collapseOne-danger-dark">
                    Collapsible Group Item #1
                  </a>
                </div>
                <div id="collapseOne-danger-dark" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-danger-dark" href="#collapseTwo-danger-dark">
                    Collapsible Group Item #2
                  </a>
                </div>
                <div id="collapseTwo-danger-dark" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion-example-danger-dark" href="#collapseThree-danger-dark">
                    Collapsible Group Item #3
                  </a>
                </div>
                <div id="collapseThree-danger-dark" class="panel-collapse collapse in">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

<div class="row">
          <div class="col-md-6">
            <div class="panel-group panel-group-success" id="accordion-example-success">
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-success" href="#collapseOne-success">
                    Collapsible Group Item #1
                  </a>
                </div>
                <div id="collapseOne-success" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-success" href="#collapseTwo-success">
                    Collapsible Group Item #2
                  </a>
                </div>
                <div id="collapseTwo-success" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion-example-success" href="#collapseThree-success">
                    Collapsible Group Item #3
                  </a>
                </div>
                <div id="collapseThree-success" class="panel-collapse collapse in">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="col-md-6">
            <div class="panel-group panel-group-success panel-group-dark" id="accordion-example-success-dark">
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-success-dark" href="#collapseOne-success-dark">
                    Collapsible Group Item #1
                  </a>
                </div>
                <div id="collapseOne-success-dark" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-success-dark" href="#collapseTwo-success-dark">
                    Collapsible Group Item #2
                  </a>
                </div>
                <div id="collapseTwo-success-dark" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion-example-success-dark" href="#collapseThree-success-dark">
                    Collapsible Group Item #3
                  </a>
                </div>
                <div id="collapseThree-success-dark" class="panel-collapse collapse in">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

<div class="row">
          <div class="col-md-6">
            <div class="panel-group panel-group-warning" id="accordion-example-warning">
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-warning" href="#collapseOne-warning">
                    Collapsible Group Item #1
                  </a>
                </div>
                <div id="collapseOne-warning" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-warning" href="#collapseTwo-warning">
                    Collapsible Group Item #2
                  </a>
                </div>
                <div id="collapseTwo-warning" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion-example-warning" href="#collapseThree-warning">
                    Collapsible Group Item #3
                  </a>
                </div>
                <div id="collapseThree-warning" class="panel-collapse collapse in">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="col-md-6">
            <div class="panel-group panel-group-warning panel-group-dark" id="accordion-example-warning-dark">
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-warning-dark" href="#collapseOne-warning-dark">
                    Collapsible Group Item #1
                  </a>
                </div>
                <div id="collapseOne-warning-dark" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-warning-dark" href="#collapseTwo-warning-dark">
                    Collapsible Group Item #2
                  </a>
                </div>
                <div id="collapseTwo-warning-dark" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion-example-warning-dark" href="#collapseThree-warning-dark">
                    Collapsible Group Item #3
                  </a>
                </div>
                <div id="collapseThree-warning-dark" class="panel-collapse collapse in">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

<div class="row">
          <div class="col-md-6">
            <div class="panel-group panel-group-info" id="accordion-example-info">
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-info" href="#collapseOne-info">
                    Collapsible Group Item #1
                  </a>
                </div>
                <div id="collapseOne-info" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-info" href="#collapseTwo-info">
                    Collapsible Group Item #2
                  </a>
                </div>
                <div id="collapseTwo-info" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion-example-info" href="#collapseThree-info">
                    Collapsible Group Item #3
                  </a>
                </div>
                <div id="collapseThree-info" class="panel-collapse collapse in">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="col-md-6">
            <div class="panel-group panel-group-info panel-group-dark" id="accordion-example-info-dark">
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-info-dark" href="#collapseOne-info-dark">
                    Collapsible Group Item #1
                  </a>
                </div>
                <div id="collapseOne-info-dark" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion-example-info-dark" href="#collapseTwo-info-dark">
                    Collapsible Group Item #2
                  </a>
                </div>
                <div id="collapseTwo-info-dark" class="panel-collapse collapse">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
              <div class="panel">
                <div class="panel-heading">
                  <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion-example-info-dark" href="#collapseThree-info-dark">
                    Collapsible Group Item #3
                  </a>
                </div>
                <div id="collapseThree-info-dark" class="panel-collapse collapse in">
                  <div class="panel-body">
                    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

</div>
    </div>

</div>

<footer class="px-footer px-footer-bottom p-t-0">
    <div class="box m-a-0 bg-transparent">
      <div class="box-cell col-md-3 p-t-3">
        <h5 class="m-t-0 m-b-1 font-size-13">About Us</h5>
        <a href="#">Who we are</a><br>
        <a href="#">Jobs</a><br>
        <a href="#">Newsletters</a><br>
      </div>
      <div class="box-cell col-md-3 p-t-3">
        <h5 class="m-t-0 m-b-1 font-size-13">Help</h5>
        <a href="#">Support Center</a><br>
        <a href="#">Terms of Use</a><br>
        <a href="#">Privacy Policy</a><br>
      </div>
      <div class="box-cell col-md-3 p-t-3">
        <h5 class="m-t-0 m-b-1 font-size-13">Products</h5>
        <a href="#">Popular</a><br>
        <a href="#">Most rated</a><br>
        <a href="#">Recent</a><br>
      </div>
      <div class="box-cell col-md-3 p-t-3 valign-middle">
        <a href="#" class="display-block m-b-1 text-nowrap"><i class="fa fa-twitter"></i>&nbsp;&nbsp;@pixeladmin</a>
        <a href="#" class="display-block m-b-1 text-nowrap"><i class="fa fa-facebook"></i>&nbsp;&nbsp;PixelAdmin</a>
        <a href="#" class="display-block text-nowrap"><i class="fa fa-envelope"></i>&nbsp;&nbsp;support@pixeladmin.com</a>
      </div>
    </div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

$(function() {
      pxDemo.initializeDemoSidebar();

$('#px-demo-sidebar').pxSidebar();
      pxDemo.initializeDemo();
    });
  </script>

$(function() {
      var file = String(document.location).split('/').pop();

// Remove unnecessary file parts
      file = file.replace(/(\.html).*/i, '$1');

if (!/.html$/i.test(file)) {
        file = 'index.html';
      }

// Activate current nav item
      $('body > .px-nav')
        .find('.px-nav-item > a[href="' + file + '"]')
        .parent()
        .addClass('active');

$('body > .px-nav').pxNav();
      $('body > .px-footer').pxFooter();

$('#navbar-notifications').perfectScrollbar();
      $('#navbar-messages').perfectScrollbar();
    });
  </script>

$(function() {
      $('#tab-resize-tabs').pxTabResize();
      $('#tab-resize-pills').pxTabResize();
    });
  </script>
</body>
</html>