<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
<nav class="navbar navbar-expand-lg navbar-light sticky-top">
<div class="container">
<a class="navbar-brand" href="#">Mega Menu</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#mobile_nav" aria-controls="mobile_nav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="mobile_nav">
<ul class="navbar-nav mr-auto mt-2 mt-lg-0 float-md-right">
</ul>
<ul class="navbar-nav navbar-light">
<li class="nav-item"><a class="nav-link" href="#">Home</a></li>
<li class="nav-item"><a class="nav-link" href="#">About Us</a></li>
<li class="nav-item dmenu dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Services
</a>
<div class="dropdown-menu sm-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="#">Software Development</a>
<a class="dropdown-item" href="#">Web Designing & Development</a>
<a class="dropdown-item" href="#">Mobile Application</a>
<a class="dropdown-item" href="#">Business Solutions & Business Process</a>
<a class="dropdown-item" href="#">Digital Marketing & SEO Services</a>
<a class="dropdown-item" href="#">Web Hosting & Maintenance</a>
<a class="dropdown-item" href="#">Cyber Security</a>
<a class="dropdown-item" href="#">Block Chain Implementation</a>
<a class="dropdown-item" href="#">Big Data</a>
</div>
</li>
<!--========-->
<li class="nav-item dropdown megamenu-li dmenu">
<a class="nav-link dropdown-toggle" href="" id="dropdown01" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">All Services</a>
<div class="dropdown-menu megamenu sm-menu border-top" aria-labelledby="dropdown01">
<div class="row">
<div class="col-sm-6 col-lg-3 border-right mb-4">
<h6>Ecommerce</h6>
<a class="dropdown-item" href="#"><i class="fab fa-magento"></i> Magento Development</a>
<a class="dropdown-item" href="#"><i class="fab fa-magento"></i> Magento 2 Migration</a>
<a class="dropdown-item" href="#"><i class="fab fa-magento"></i> Odoo ERP</a>
<a class="dropdown-item" href="#"><i class="fab fa-magento"></i> Mobile Commerce</a>
<a class="dropdown-item" href="#"><i class="fab fa-magento"></i> CRM for Commerce</a>
</div>
<div class="col-sm-6 col-lg-3 border-right mb-4">
<h6>LAMP Technology</h6>
<a class="dropdown-item" href="#"><i class="fab fa-php"></i> PHP Website Development</a>
<a class="dropdown-item" href="#"><i class="fas fa-circle"></i> Phalcon Development</a>
<a class="dropdown-item" href="#"><i class="fab fa-laravel"></i> Laravel Development</a>
<a class="dropdown-item" href="#"><i class="fab fa-wordpress-simple"></i> WordPress Development</a>
<a class="dropdown-item" href="#"><i class="fab fa-php"></i> Symfony Development</a>
</div>
<div class="col-sm-6 col-lg-3 border-right mb-4">
<h6>Mobile</h6>
<a class="dropdown-item" href="#"><i class="fab fa-apple"></i> iPhone App Development</a>
<a class="dropdown-item" href="#"><i class="fab fa-android"></i> Android App Development</a>
<a class="dropdown-item" href="#"><i class="fas fa-mobile-alt"></i> Phone Gap App Development</a>
<a class="dropdown-item" href="#"><i class="fas fa-tablet-alt"></i> Hybrid App Development</a>
<a class="dropdown-item" href="#"><i class="fas fa-mobile-alt"></i> Ionic Development</a>
<a class="dropdown-item" href="#"><i class="fas fa-tablet-alt"></i> React Native Development</a>
<a class="dropdown-item" href="#"><i class="fas fa-mobile-alt"></i> Xamarin App Development</a>
</div>
<div class="col-sm-6 col-lg-3 mb-4">
<h6>Node.js & MongoDB</h6>
<a class="dropdown-item" href="#"><i class="fas fa-cubes"></i> Full Stack Development</a>
<a class="dropdown-item" href="#"><i class="fas fa-cube"></i> MEAN Stack</a>
<a class="dropdown-item" href="#"><i class="fab fa-angular"></i> AngularJS</a>
<a class="dropdown-item" href="#"><i class="fab fa-node-js"></i> Node.JS Development</a>
<a class="dropdown-item" href="#"><i class="fas fa-leaf fa-rotate-90"></i> MongoDB Development</a>
</div>
</div>
<div class="row">
<div class="col-sm-6 col-lg-3 border-right mb-4">
<h6>Microsoft Technology</h6>
<a class="dropdown-item" href="#"><i class="fab fa-windows"></i> Microsoft App Development</a>
<a class="dropdown-item" href="#"><i class="fab fa-windows"></i> MS Desktop App Development</a>
<a class="dropdown-item" href="#"><i class="fab fa-windows"></i> SharePoint Development</a>
<a class="dropdown-item" href="#"><i class="fab fa-windows"></i> ASP.NET Development</a>
<a class="dropdown-item" href="#"><i class="fab fa-windows"></i> CMS Development</a>
</div>
<div class="col-sm-6 col-lg-3 border-right mb-4">
<h6>Cloud Services</h6>
<a class="dropdown-item" href="#"><i class="fas fa-cloud"></i> DevOps</a>
<a class="dropdown-item" href="#"><i class="fab fa-amazon"></i> Amazon Web Services</a>
<a class="dropdown-item" href="#"><i class="fab fa-windows"></i> Azure Cloud Service</a>
<a class="dropdown-item" href="#"><i class="fab fa-google"></i> Google App Engine Services</a>
</div>
<div class="col-sm-6 col-lg-3 border-right mb-4">
<h6>Enterprise Services</h6>
<a class="dropdown-item" href="#"><i class="fas fa-laptop"></i> Augmented Reality</a>
<a class="dropdown-item" href="#"><i class="fas fa-laptop"></i> CRM</a>
<a class="dropdown-item" href="#"><i class="fab fa-buromobelexperte"></i> Enterprise Mobility Services</a>
<a class="dropdown-item" href="#"><i class="fas fa-th-large"></i> Blockchain Services</a>
<a class="dropdown-item" href="#"><i class="fas fa-briefcase"></i> Business Intelligence</a>
</div>
<div class="col-sm-6 col-lg-3 mb-4">
<h6>Digital Marketing</h6>
<a class="dropdown-item" href="#"><i class="fas fa-laptop"></i> Digital Marketing</a>
<a class="dropdown-item" href="#"><i class="fas fa-laptop"></i> PPC Management Services</a>
<a class="dropdown-item" href="#"><i class="fas fa-laptop"></i> E-commerce SEO Services</a>
<a class="dropdown-item" href="#"><i class="fas fa-laptop"></i> Conversion Rate Optimization</a>
</div>
</div>
</div>
</li>
<!--=========-->
<li class="nav-item"><a class="nav-link" href="<?php echo siteURL;?>portfolio.php">Portfolio</a></li>
<li class="nav-item"><a class="nav-link" href="<?php echo siteURL;?>career.php">Careers</a></li>
<li class="nav-item"><a class="nav-link" href="<?php echo siteURL;?>contact-us.php">Sair</a></li>
</ul>
</div>
</div>
</nav>
<section id="about-us" class="py-5">
<div class="container">
<div class="row">
<!--left sidebar-->
<div class="col-md-3 pr-md-4">
<div class="sidebar-left">
<!--sidebar menu-->
<ul class="list-unstyled sidebar-menu pl-md-2 pr-md-0">
<li>
<a class="sidebar-item active d-flex justify-content-between align-items-center" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
Dashboard
<span class="fas fa-tachometer-alt"></span>
</a>
</li>
<li>
<a class="sidebar-item d-flex justify-content-between align-items-center" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
Profile
<span class="fas fa-user"></span>
</a>
</li>
<li>
<a class="sidebar-item d-flex justify-content-between align-items-center" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
Post
<span class="fas fa-copy"></span>
</a>
</li>
<li>
<a class="sidebar-item d-flex justify-content-between align-items-center" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
Comment
<span class="side-notif" title="1 new comment">1</span>
<span class="fas fa-comment"></span>
</a>
</li>
<li>
<a class="sidebar-item d-flex justify-content-between align-items-center" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
Messages
<span class="side-notif" title="1 new messages">1</span>
<span class="fas fa-envelope"></span>
</a>
</li>
<li>
<a class="sidebar-item d-flex justify-content-between align-items-center" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
Favorite
<span class="fas fa-heart"></span>
</a>
</li>
<li>
<a class="sidebar-item d-flex justify-content-between align-items-center" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
Setting
<span class="fas fa-cog"></span>
</a>
</li>
<li>
<a class="sidebar-item d-flex justify-content-between align-items-center" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
Sign out
<span class="fas fa-sign-out-alt"></span>
</a>
</li>
</ul>
</div>
</div>
<!--Content-->
<div class="col-md-9">
<div class="dashboard-area">
<div class="row">
<div class="col-12">
<div class="mb-3 bg-dark">
<div class="row">
<div class="col-12">
<a class="position-absolute ml-3 mt-3 text-white" href="setting.html" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="Edit cover images"><i class="fas fa-cog"></i></a>
<div class="row">
<div class="col-md-6 ml-auto mr-auto">
<div class="profiles p-3 my-4 rounded text-center shadow-sm">
<div class="avatars">
<a href="setting.html">
<img src="https://demo.bootstrap.news/bootnews/assets/img/avatar/avatar1.png" alt="Circle Image" class="avatar-lg rounded-circle img-fluid" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="Edit avatar images">
</a>
</div>
<div class="names">
<h3 class="title text-light">@jenifer</h3>
<a href="#" class="btn btn-link btn-facebook"><i class="fab fa-facebook"></i></a>
<a href="#" class="btn btn-link btn-twitter"><i class="fab fa-twitter"></i></a>
<a href="#" class="btn btn-link btn-gplus"><i class="fab fa-google-plus"></i></a>
<a href="#" class="btn btn-link btn-instagram"><i class="fab fa-instagram"></i></a>
<a href="#" class="btn btn-link btn-youtube"><i class="fab fa-youtube"></i></a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
<li class="nav-item">
<a class="nav-link active show" id="pills-home-tab" data-toggle="pill" href="#pills-home" role="tab" aria-controls="pills-home" aria-selected="true">Statistic</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#pills-profile" role="tab" aria-controls="pills-profile" aria-selected="false">Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-contact-tab" data-toggle="pill" href="#pills-contact" role="tab" aria-controls="pills-contact" aria-selected="false">Latest post</a>
</li>
</ul>
<div class="tab-content" id="pills-tabContent">
<div class="tab-pane fade active show" id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab">
<div class="row">
<div class="col-lg-4 col-sm-6">
<a class="member-item" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
<div class="card mb-2 mb-md-5 py-3">
<div class="content">
<div class="row">
<div class="col-6 d-flex justify-content-center align-items-center">
<div class="icon-big text-warning text-center">
<i class="fas fa-copy"></i>
</div>
</div>
<div class="col-6 d-flex justify-content-center align-items-center">
<div class="numbers">
<p>Article</p>
112
</div>
</div>
</div>
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-sm-6">
<a class="member-item" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
<div class="card mb-2 mb-md-5 py-3">
<div class="content">
<div class="row">
<div class="col-6 d-flex justify-content-center align-items-center">
<div class="icon-big text-info text-center" title="1 new comment">
<div class="notif">1</div>
<i class="fas fa-comment"></i>
</div>
</div>
<div class="col-6 d-flex justify-content-center align-items-center">
<div class="numbers">
<p>Comments</p>
454
</div>
</div>
</div>
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-sm-6">
<a class="member-item" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
<div class="card mb-2 mb-md-5 py-3">
<div class="content">
<div class="row">
<div class="col-6 d-flex justify-content-center align-items-center">
<div class="icon-big text-danger text-center">
<i class="fas fa-heart"></i>
</div>
</div>
<div class="col-6 d-flex justify-content-center align-items-center">
<div class="numbers">
<p>Favorite</p>
56
</div>
</div>
</div>
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-sm-6">
<a class="member-item" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
<div class="card mb-2 mb-md-5 py-3">
<div class="content">
<div class="row">
<div class="col-6 d-flex justify-content-center align-items-center">
<div class="icon-big text-twitter text-center" title="1 new messages">
<div class="notif">1</div>
<i class="fas fa-envelope"></i>
</div>
</div>
<div class="col-6 d-flex justify-content-center align-items-center">
<div class="numbers">
<p>Messages</p>
23
</div>
</div>
</div>
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-sm-6">
<a class="member-item" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
<div class="card mb-2 mb-md-5 py-3">
<div class="content">
<div class="row">
<div class="col-6 d-flex justify-content-center align-items-center">
<div class="icon-big text-facebook text-center">
<i class="fas fa-star"></i>
</div>
</div>
<div class="col-6 d-flex justify-content-center align-items-center">
<div class="numbers">
<p>Following</p>
112
</div>
</div>
</div>
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-sm-6">
<a class="member-item" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">
<div class="card mb-2 mb-md-5 py-3">
<div class="content">
<div class="row">
<div class="col-6 d-flex justify-content-center align-items-center">
<div class="icon-big text-success text-center">
<i class="fas fa-users"></i>
</div>
</div>
<div class="col-6 d-flex justify-content-center align-items-center">
<div class="numbers">
<p>Follower</p>
1567
</div>
</div>
</div>
</div>
</div>
</a>
</div>
</div>
</div>
<div class="tab-pane fade" id="pills-profile" role="tabpanel" aria-labelledby="pills-profile-tab">
<div class="p-3 border mb-3">
<a class="position-absolute" style="right: 25px" href="setting.html" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="Edit profile"><i class="fas fa-cog"></i></a>
<h3>Jenifer Tan</h3>
<p><b>Jobs:</b> Writter</p>
<p><b>About:</b> Hello my name is Jenifer, My passion is writting. I hope you enjoy with my article.</p>
<p><b>Address:</b> Street 12 vo 05, California, United States</p>
<p><b>Phone:</b> +1 987654321</p>
</div>
</div>
<div class="tab-pane fade" id="pills-contact" role="tabpanel" aria-labelledby="pills-contact-tab">
<div class="p-3 border mb-3">
<h5>Recently Published</h5>
<div class="row">
<div class="col-12">
<ul class="list-unstyled statistics">
<li>
<span class="text-primary">Oct 20</span> <a class="h6" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">Toyota Sienna rates marginal in passenger-side overlap crash test</a>
</li>
<li>
<span class="text-primary">Oct 12</span> <a class="h6" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">Ford reveals autonomous vehicle philosophies, priorities</a>
</li>
<li>
<span class="text-primary">Oct 7</span> <a class="h6" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">Offer Hints to How Dogs Became Domesticated</a>
</li>
<li>
<span class="text-primary">Oct 6</span> <a class="h6" href="https://bootstrap.news/bootstrap-4-template-news-portal-magazine/">Consumer apprehension grows over autonomous tech, study says</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<div class="container">
<div class="row">
<div class="col-md-12">
<div style="height: 2em"></div>
<div class="card">
<div class="card-header">
<h5>Atomic Bicycle V1</h5>
<ul class="nav nav-tabs card-header-tabs">
<li class="nav-item">
<a class="nav-link active" id="stat-1-tab" data-toggle="tab" href="#stat-1" role="tab" aria-controls="stat-1" aria-selected="true">Statistics</a>
</li>
<li class="nav-item">
<a class="nav-link"id="task-1-tab" data-toggle="tab" href="#task-1" role="tab" aria-controls="task-1" aria-selected="false">Tasks</a>
</li>
<li class="nav-item">
<a class="nav-link"id="team-1-tab" data-toggle="tab" href="#team-1" role="tab" aria-controls="team-1" aria-selected="false">Team</a>
</li>
</ul>
</div>
<div class="card-body">
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active" id="stat-1" role="tabpanel" aria-labelledby="stat-1-tab">
<div class="row">
<div class="col-md-12">
<table class="table table-bordered table-striped">
<thead>
<tr class="table">
<th scope="col">Today date</td>
<th scope="col">Deadline</td>
<th scope="col">Time left</td>
<th scope="col">Time needed</td>
</tr>
</thead>
<tbody>
<tr>
<td>17/07/2019</td>
<td>27/09/2019</td>
<td>52 days</td>
<td>45 days <span class="badge badge-pill badge-success">- 7d</span></td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="row">
<div class="col-md-4">
<div class="card">
<div class="card-body">
<span><strong style="font-size: 2em" class="card-title">28</strong></span>
<small class="card-text">Agile Velocity <span class="badge badge-pill badge-success">+ 2</span></small>
</div>
<div class="card-footer">
<button class="btn btn-link btn-sm">Burndown Chart</button>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card">
<div class="card-body">
<span><strong style="font-size: 2em" class="card-title">74</strong></span>
<small class="card-text">Unit test <span class="badge badge-pill badge-success">OK</span></small>
</div>
<div class="card-footer">
<button class="btn btn-link btn-sm">Test report</button>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card">
<div class="card-body">
<span><strong style="font-size: 2em" class="card-title">7</strong></span>
<small class="card-text">Unit test <span class="badge badge-pill badge-danger">KO</span></small>
</div>
<div class="card-footer">
<button class="btn btn-link btn-sm">Test resport</button>
</div>
</div>
</div>
</div>
<div class="spacer"></div>
<div class="row">
<div class="col-md-12">
<label>Completion Percentage :</label>
<div class="progress">
<div class="progress-bar bg-success" role="progressbar" style="width: 85%;" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100">85%</div>
</div>
</div>
</div>
<div class="spacer"></div>
<div class="row">
<div class="col-md-12">
<label>Man-days used percentage : <span class="badge badge-pill badge-warning">+ 5%</span></label>
<div class="progress">
<div class="progress-bar bg-success" role="progressbar" style="width: 85%;" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100">85%</div>
<div class="progress-bar bg-warning" role="progressbar" style="width: 5%;" aria-valuenow="5" aria-valuemin="0" aria-valuemax="100">5%</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="task-1" role="tabpanel" aria-labelledby="task-1-tab">
<table class="table table-striped">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Name</th>
<th scope="col">Desc</th>
<th scope="col">State</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>Conception</td>
<td>Make studies on UX design, technology needs and budget.</td>
<td><span class="badge badge-pill badge-success">Ended</span></td>
<td><button class="btn btn-link btn-sm">Go to task info</button></td>
</tr>
<tr>
<th scope="row">2</th>
<td>Piece developement</td>
<td>Construct motor, wheels, lights ...</td>
<td><span class="badge badge-pill badge-success">Ended</span></td>
<td><button class="btn btn-link btn-sm">Go to task info</button></td>
</tr>
<tr>
<th scope="row">3</th>
<td>Assembly</td>
<td>Make the bicycle with pieces.</td>
<td><span class="badge badge-pill badge-warning">Work in progress</span></td>
<td><button class="btn btn-link btn-sm">Go to task info</button></td>
</tr>
<tr>
<th scope="row">4</th>
<td>Tests</td>
<td>Verify product with the Testing plan.</td>
<td><span class="badge badge-pill badge-primary">To do</span></td>
<td><button class="btn btn-link btn-sm">Go to task info</button></td>
</tr>
<tr>
<th scope="row">5</th>
<td>Sending</td>
<td>Send the bicycle</td>
<td><span class="badge badge-pill badge-primary">To do</span></td>
<td><button class="btn btn-link btn-sm">Go to task info</button></td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="team-1" role="tabpanel" aria-labelledby="team-1-tab">
<table class="table table-striped">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Name</th>
<th scope="col">Type</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>Mark Otto</td>
<td><span class="badge badge-pill badge-primary">UX/UI Designer</span></td>
<td><button class="btn btn-link btn-sm">Go to profile</button></td>
</tr>
<tr>
<th scope="row">2</th>
<td>Jhon Doe</td>
<td><span class="badge badge-pill badge-warning">Engineer</span></td>
<td><button class="btn btn-link btn-sm">Go to profile</button></td>
</tr>
<tr>
<th scope="row">3</th>
<td>Thibault Leveau</td>
<td><span class="badge badge-pill badge-warning">Engineer</span></td>
<td><button class="btn btn-link btn-sm">Go to profile</button></td>
</tr>
<tr>
<th scope="row">4</th>
<td>Jean Zobbix</td>
<td><span class="badge badge-pill badge-primary">UX/UI Designer</span></td>
<td><button class="btn btn-link btn-sm">Go to profile</button></td>
</tr>
<tr>
<th scope="row">5</th>
<td>Thibeauf Dupont</td>
<td><span class="badge badge-pill badge-danger">Project Manager</span></td>
<td><button class="btn btn-link btn-sm">Go to profile</button></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
.navbar{
background: black;
padding-top: 0;
padding-bottom: 0;
box-shadow: 1px 3px 4px 0 #adadad33;
}
.navbar-light .navbar-brand {
color: white;
}
.navbar-light .navbar-nav .nav-link {
color: white;
}
.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover {
color: #1ebdc2;
}
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
color: #fff;
}
.navbar-light .navbar-nav .nav-link{
padding-top: 22px;
padding-bottom: 22px;
transition: 0.3s;
padding-left: 24px;
padding-right: 24px;
font-size: 14px;
}
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover{
background: #1ebdc2;
transition: 0.3s;
}
.dropdown-item:focus, .dropdown-item:hover {
color: #fff;
text-decoration: none;
background-color: #1ebdc2 !important;
}
.sm-menu{
border-radius: 0px;
border: 0px;
top: 97%;
box-shadow: rgba(173, 173, 173, 0.2) 1px 3px 4px 0px;
}
.dropdown-item {
color: #3c3c3c;
font-size: 14px;
}
.dropdown-item.active, .dropdown-item:active {
color: #fff;
text-decoration: none;
background-color: #2196F3;
}
.navbar-toggler{
outline: none !important;
}
.navbar-tog{
color: #1ebdc2;
}
.megamenu-li {
position: static;
}
.megamenu {
position: absolute;
width: 100%;
left: 0;
right: 0;
padding: 15px;
}
.megamenu h6{
margin-left: 21px;
}
.megamenu i{
width: 20px;
}
.text-facebook, .hover-facebook-text:hover i, .hover-facebook a:hover i {
color: #3b5998;
}
.bg-facebook, .btn-facebook {
background-color: #3b5998;
color: #fff;
}
.text-twitter, .hover-twitter-text:hover i, .hover-twitter a:hover i {
color: #00aced;
}
.bg-twitter, .btn-twitter {
background-color: #00aced;
color: #fff;
}
.text-instagram, .hover-instagram-text:hover i, .hover-instagram a:hover i {
color: #b300ad;
}
.bg-instagram, .btn-instagram {
background-color: #b300ad;
color: #fff;
}
.text-youtube, .hover-youtube-text:hover i, .hover-youtube a:hover i {
color: #bd0000;
}
.bg-youtube, .btn-youtube {
background-color: #bd0000;
color: #fff;
}
.text-gplus, .hover-gplus-text:hover i, .hover-gplus a:hover i {
color: #eb5e4c;
}
.bg-gplus, .btn-gplus {
background-color: #eb5e4c;
color: #fff;
}
.text-vimeo, .hover-vimeo-text:hover i, .hover-vimeo a:hover i {
color: #35c6ea;
}
.bg-vimeo, .btn-vimeo {
background-color: #35c6ea;
color: #fff;
}
.text-envelope, .hover-envelope-text:hover i, .hover-envelope a:hover i {
color: #faa33d;
}
.bg-envelope, .btn-envelope {
background-color: #faa33d;
color: #fff;
}
.text-linkedin, .hover-linkedin-text:hover i, .hover-linkedin a:hover i {
color: #6697ff;
}
.bg-linkedin, .btn-linkedin {
background-color: #6697ff;
color: #fff;
}
.text-telegram, .hover-telegram-text:hover i, .hover-telegram a:hover i {
color: #30a8dc;
}
.bg-telegram, .btn-telegram {
background-color: #30a8dc;
color: #fff;
}
.text-pinterest, .hover-pinterest-text:hover i, .hover-pinterest a:hover i {
color: #bd081b;
}
.bg-pinterest, .btn-pinterest {
background-color: #bd081b;
color: #fff;
}
.black a {
color: #000;
}
.post-content ul {
color: #474b5f;
}
.white a {
color: #fff;
}
/*------------------------------------
Member area
------------------------------------*/
.sidebar-item.active, .sidebar-item:hover {
background-color: #fff;
border: 1px solid #e6e7e9;
border-right: 0;
margin-right: -1px;
}
.sidebar-menu {
border-bottom: 1px solid #e6e7e9;
border-top: 1px solid #e6e7e9;
border-right: 1px solid #e6e7e9;
padding-bottom: 1rem;
padding-top: 1rem;
background-color: #f4f4f4;
}
.sidebar-item {
position: relative;
display: block;
padding: 0.75rem 1.25rem;
margin-bottom: 0.5rem;
border: 1px solid transparent;
}
.sidebar-item.active:hover {
background-color: #fff;
}
.card .icon-big {
font-size: 3rem;
}
.card .icon-big .notif {
position: absolute;
min-width: 25px;
border-radius: 5rem;
font-size: 1rem;
background: #dc3545;
color: #fff;
}
.card .numbers {
text-align: right;
}
.card .numbers p {
font-size: 1rem;
margin: 0;
}
.card .footer {
padding: 0;
line-height: 30px;
}
.side-notif {
padding-left: 7px;
padding-right: 7px;
font-size: 0.8rem;
border-radius: 5rem;
background-color: #dc3545;
color: #fff;
}
.statistics li {
padding: 0.25rem 0;
}
.member-item:hover .card {
background-color: #f4f4f4;
}
.table-striped tbody tr:nth-of-type(odd) {
background-color: #f4f4f4;
}
@media (max-width: 767.98px) {
.sidebar-item.active, .sidebar-item:hover {
border-right: 1px solid #e6e7e9;
margin-left: 0.25rem;
margin-right: 0.25rem;
}
}
.spacer {
height: 1em;
}
$(document).ready(function () {
$('.navbar-light .dmenu').hover(function () {
$(this).find('.sm-menu').first().stop(true, true).slideDown(150);
}, function () {
$(this).find('.sm-menu').first().stop(true, true).slideUp(105)
});
});
$(document).ready(function() {
$(".megamenu").on("click", function(e) {
e.stopPropagation();
});
});
