<section class="overflow-hidden pt-0">
<div class="container">
<div class="row">
<div class="col-lg-8">
<div class="carousel-container carousel-container-visible">
<div class="carousel" data-carousel='{"mouseDrag": true, "gutter": 48, "loop": true, "items": 1, "navContainer": "#nav-1","controlsContainer": "#controls-1"}'>
<div class="item">
<figure class="figure hover-opacity equal equal-16-10">
<span class="image" title="Image Title" style="background-image: url('assets/images/coworking-1.jpg')"><span>
<figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>
</div>
<div class="item">
<figure class="figure hover-opacity equal equal-16-10">
<span class="image" title="Image Title" style="background-image: url('assets/images/coworking-2.jpg')"><span>
<figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>
</div>
<div class="item">
<figure class="figure hover-opacity equal equal-16-10">
<span class="image" title="Image Title" style="background-image: url('assets/images/coworking-3.jpg')"><span>
<figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>
</div>
<div class="item">
<figure class="figure hover-opacity equal equal-16-10">
<span class="image" title="Image Title" style="background-image: url('assets/images/coworking-4.jpg')"><span>
<figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>
</div>
</div>
<ul class="carousel-controls" id="controls-1">
<li class="prev"><i class="icon-chevron-left"></i></li>
<li class="next"><i class="icon-chevron-right"></i></li>
</ul>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<ul class="carousel-nav" id="nav-1">
<li><span></span></li>
<li><span></span></li>
<li><span></span></li>
<li><span></span></li>
</ul>
</div>
</div>
</div>
</section>
<section class="overflow-hidden">
<div class="container">
<div class="row">
<div class="col-12">
<div class="carousel-container carousel-container-visible">
<div class="carousel" data-carousel='{"gutter": 24, "autoplay": true , "controls": false, "responsive": {"0": {"items": 1}, "768": {"items": 2}, "1200": {"items": 3}}}'>
<div>
<a href="" class="card equal equal-2-1 hover-reveal text-white">
<figure class="image" style="background-image: url('assets/images/small-1.jpg')"></figure>
<div class="card-body">
<div class="text-center text-shadow">
<h5 class="mb-0 font-weight-bold">Web Design</h5>
<span class="text-secondary">22 Jobs</span>
</div>
</div>
</a>
</div>
<div>
<a href="" class="card equal equal-2-1 hover-reveal text-white">
<figure class="image" style="background-image: url('assets/images/small-2.jpg')"></figure>
<div class="card-body">
<div class="text-center text-shadow">
<h5 class="mb-0 font-weight-bold">Photography</h5>
<span class="text-secondary">22 Jobs</span>
</div>
</div>
</a>
</div>
<div>
<a href="" class="card equal equal-2-1 hover-reveal text-white">
<figure class="image" style="background-image: url('assets/images/small-4.jpg')"></figure>
<div class="card-body">
<div class="text-center text-shadow">
<h5 class="mb-0 font-weight-bold">Development</h5>
<span class="text-secondary">22 Jobs</span>
</div>
</div>
</a>
</div>
<div>
<a href="" class="card equal equal-2-1 hover-reveal text-white">
<figure class="image" style="background-image: url('assets/images/small-5.jpg')"></figure>
<div class="card-body">
<div class="text-center text-shadow">
<h5 class="mb-0 font-weight-bold">Marketing</h5>
<span class="text-secondary">22 Jobs</span>
</div>
</div>
</a>
</div>
<div>
<a href="" class="card equal equal-2-1 hover-reveal text-white">
<figure class="image" style="background-image: url('assets/images/small-6.jpg')"></figure>
<div class="card-body">
<div class="text-center text-shadow">
<h5 class="mb-0 font-weight-bold">Accounting</h5>
<span class="text-secondary">22 Jobs</span>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>