<div>
<nav class="is-relative navbar py-2 has-background-primary">
<div class="navbar-brand is-align-items-center">
<a class="navbar-item" href="#">
<span class="navbar-item px-0 title is-size-5 has-text-dark">
<img src="bendis-assets/logos/bendis-light.svg" alt="" style="max-height: initial;">
</span>
</a>
<a class="navbar-menu-open navbar-burger is-hidden-desktop is-flex is-align-items-center is-justify-content-center" role="button" type="button" data-toggle="side-menu">
<svg width="24" height="24" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="2" y="6" width="20" height="2" fill="white"></rect><rect x="2" y="11" width="20" height="2" fill="white"></rect><rect x="2" y="16" width="20" height="2" fill="white"></rect></svg>
</a>
</div>
<div class="is-hidden-mobile is-hidden-tablet-only is-absolute" style="top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%);">
<ul class="navbar-item">
<li><a class="has-text-weight-semibold navbar-item has-text-white" href="#">About</a></li>
<li><a class="has-text-weight-semibold navbar-item has-text-white" href="#">Company</a></li>
<li><a class="has-text-weight-semibold navbar-item has-text-white" href="#">Services</a></li>
<li><a class="has-text-weight-semibold navbar-item has-text-white" href="#">Testimonials</a></li>
</ul>
</div>
<div class="navbar-menu is-hidden-mobile">
<div class="navbar-end"><a class="navbar-item has-text-white" href="#">Sign In</a><a class="navbar-item has-text-white" href="#">Support</a></div>
</div>
</nav>
<section class="is-relative section py-40-desktop is-overflow-hidden" style="background-image: url('bendis-assets/images/red-image.png'); background-size: cover; background-position: center; background-repeat: no-repeat;">
<div class="is-absolute is-bottom-0 is-top-0 is-left-0 is-flex is-align-items-center is-justify-content-center">
<h2 class="stroke" style="opacity: 80%;">BE BOLD</h2>
</div>
<div class="container">
<div class="has-mw-4xl mx-auto has-text-centered">
<span class="is-block is-size-5 has-text-white has-text-weight-semibold is-uppercase has-letter-space mb-2">Develop your skill</span>
<h1 class="title is-size-3-mobile is-size-2-tablet is-size-1-desktop has-leading-1 has-text-white is-uppercase mb-8">Take care of your performance every day.</h1>
<a class="button is-warning" href="#">Get Started Free</a>
</div>
</div>
</section>
<div class="is-relative has-background-white py-10">
<div class="container">
<div class="columns is-mobile is-multiline is-centered">
<div class="column is-6-mobile">
<img class="image is-block mx-auto" src="bendis-assets/logos/slack.svg" alt="">
</div>
<div class="column is-6-mobile">
<img class="image is-block mx-auto" src="bendis-assets/logos/dropbox.svg" alt="">
</div>
<div class="column is-6-mobile">
<img class="image is-block mx-auto" src="bendis-assets/logos/spotify.svg" alt="">
</div>
<div class="column is-6-mobile">
<img class="image is-block mx-auto" src="bendis-assets/logos/stripe.svg" alt="">
</div>
<div class="column is-6-mobile">
<img class="image is-block mx-auto" src="bendis-assets/logos/netflix.svg" alt="">
</div>
</div>
</div>
</div>
<div class="is-hidden navbar-side is-fixed is-top-0 is-bottom-0 is-left-0 has-mw-md" style="width: 75%; z-index: 9999;">
<div class="navbar-backdrop is-fixed is-inset-0 has-background-dark" style="opacity: 75%; z-index: 50;"></div>
<aside class="menu is-relative is-flex is-flex-direction-column py-8 px-10 has-background-white" style="width: 100%; height: 100%; z-index: 50; overflow-y: auto;">
<a class="mb-20" href="#">
<span class="navbar-item px-0 title is-5 has-text-dark">
<img src="bendis-assets/logos/bendis-blue.svg" style="max-height: initial" alt="">
</span>
</a>
<ul class="mb-40">
<li><a class="button is-ghost has-text-left has-text-primary" href="#">About</a></li>
<li><a class="button is-ghost has-text-left has-text-primary" href="#">Company</a></li>
<li><a class="button is-ghost has-text-left has-text-primary" href="#">Services</a></li>
<li><a class="button is-ghost has-text-left has-text-primary" href="#">Testimonials</a></li>
</ul>
<div class="mb-8"><a class="button is-ghost has-text-primary is-fullwidth" href="#">Sign In</a><a class="button is-outlined is-primary is-fullwidth" href="#">Sign up</a></div>
<small class="has-text-centered has-text-primary">All rights reserved © Wireframes Corporation 2022</small>
</aside>
</div>
</div>