$(document).ready(function(){
$('.navicon').click(function(){
$('.leftbar').toggleClass('active');
});
});
.leftbar {-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;}
.leftbar.active {left: 0; position: relative;}
<div class="wrapper">
<div class="inner">
<div class="block-title">
<p>
наши партнеры
</p>
</div>
<ul class="partners-list">
<li class="partners-list-item">
<span class="item-thumbnail"></span>
</li>
<li class="partners-list-item">
<span class="item-thumbnail"></span>
</li>
<li class="partners-list-item">
<span class="item-thumbnail"></span>
</li>
<li class="partners-list-item">
<span class="item-thumbnail"></span>
</li>
<li class="partners-list-item">
<span class="item-thumbnail"></span>
</li>
<li class="partners-list-item">
<span class="item-thumbnail"></span>
</li>
</ul>
</div>
</div>
.wrapper {
background-color: #fff;
border-radius:10px;
padding:20px;
position: relative;
max-width: 500px;
clear: both;
overflow: hidden;
}
.inner {
position: relative;
border:1px solid green;
padding: 15px;
}
.block-title {
position: relative;
top:-25px;
text-align: center;
}
.block-title p {
color:green;
text-transform: uppercase;
display: inline;
margin: 0 auto;
background-color: white;
padding: 10px;
}
.partners-list {
width: 100%;
position: relative;
list-style-type: none;
font-size:0;
padding: 0;
margin: 0;
}
.partners-list-item {
display: inline-block;
text-align: center;
width: 15%;
margin-right: 2%;
min-height: 100px;
background-color: red;
}
.partners-list-item:last-of-type{
margin-right: 0;
}