<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/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 href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<div class="container-fluid">
<div class="row">
<div class="col-sm-3">
<div class="nav-side-menu">
<div class="brand">Herramientas</div>
<i class="fa fa-bars fa-2x toggle-btn" data-toggle="collapse" data-target="#menu-content"></i>
<div class="menu-list">
<ul id="menu-content" class="menu-content collapse out">
<li>
<a href="">
<i class="fa fa-dashboard fa-lg"></i> Dashboard
</a>
</li>
<li data-toggle="collapse" data-target="#new" class="collapsed">
<a href="#"><i class="fa fa-car fa-lg"></i> New <span class="arrow"></span></a>
</li>
<ul class="sub-menu collapse" id="new">
<li>New New 1</li>
</ul>
</ul>
</div>
</div>
</div>
<div class="col-sm-9 col-sm-offset-1">
<h1>Welcome To Dashboard Panel :)</h1>
<p>
this is test text.this is test text.this is test text.this is test text.
this is test text.this is test text.this is test text.this is test text.
this is test text.this is test text.this is test text.this is test text.
this is test text.this is test text.this is test text.this is test text.
this is test text.this is test text.
</p>
</div>
</div>
</div>