Change logo location - css

Question

I need to change my logo location. I've tried any code i know from css but still cant change the location.
I want the logo to be at the same height of my menu.
Need your help please!
My website is : http://ktiniatreio-keratea.gr/

Answer 1

Add to css
.navbar-header{
display: inline-block;}

Answer 2

Put the:
<div class="main-navigation navbar-collapse collapse">
inside the class="navbar-header".
Your final code should look like:
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"><i class="fa fa-bars"></i></button>
<img width="290" height="70" src="https://i2.wp.com/ktiniatreio-keratea.gr/wp-content/uploads/2018/03/cropped-logo_pet-2.png?fit=290%2C70" class="custom-logo" alt="Κτηνιατρικό Κέντρο : Λυγιάς – Νεοφύτου">
<div class="main-navigation navbar-collapse collapse">
<div id="mega-menu-wrap-primary" class="mega-menu-wrap">
<div class="mega-menu-toggle" tabindex="0">
<div class="mega-toggle-blocks-left">
<div class="mega-toggle-block mega-menu-toggle-block mega-toggle-block-1" id="mega-toggle-block-1"><span class="mega-toggle-label"><span class="mega-toggle-label-closed">MENU</span><span class="mega-toggle-label-open">MENU</span></span>
</div>
</div>
<div class="mega-toggle-blocks-center"></div>
<div class="mega-toggle-blocks-right">
<div class="mega-toggle-block mega-menu-toggle-block mega-toggle-block-2" id="mega-toggle-block-2"><span class="mega-toggle-label"><span class="mega-toggle-label-closed">MENU</span><span class="mega-toggle-label-open">MENU</span></span>
</div>
</div>
</div>
<ul id="mega-menu-primary" class="mega-menu max-mega-menu mega-menu-horizontal">
<li class="mega-menu-item mega-menu-item-type-post_type mega-menu-item-object-page mega-menu-item-home mega-current-menu-item mega-page_item mega-page-item-150 mega-current_page_item mega-align-bottom-left mega-menu-flyout mega-menu-item-157" id="mega-menu-item-157"><a class="mega-menu-link" href="http://ktiniatreio-keratea.gr/" tabindex="0">Αρχική</a></li>
<li class="mega-menu-item mega-menu-item-type-post_type mega-menu-item-object-page mega-align-bottom-left mega-menu-flyout mega-menu-item-241" id="mega-menu-item-241"><a class="mega-menu-link" href="http://ktiniatreio-keratea.gr/%ce%b9%ce%b1%cf%84%cf%81%ce%b5%ce%b9%ce%b1/" tabindex="0">Τα Ιατρεία</a></li>
<li class="mega-menu-item mega-menu-item-type-post_type mega-menu-item-object-page mega-align-bottom-left mega-menu-flyout mega-menu-item-242" id="mega-menu-item-242"><a class="mega-menu-link" href="http://ktiniatreio-keratea.gr/%cf%85%cf%80%ce%b7%cf%81%ce%b5%cf%83%ce%b9%ce%b5%cf%82/" tabindex="0">Υπηρεσίες</a></li>
<li class="mega-menu-item mega-menu-item-type-post_type mega-menu-item-object-page mega-align-bottom-left mega-menu-flyout mega-menu-item-521" id="mega-menu-item-521"><a class="mega-menu-link" href="http://ktiniatreio-keratea.gr/team/" tabindex="0">Προσωπικό</a></li>
<li class="mega-menu-item mega-menu-item-type-post_type mega-menu-item-object-page mega-align-bottom-left mega-menu-flyout mega-menu-item-244" id="mega-menu-item-244"><a class="mega-menu-link" href="http://ktiniatreio-keratea.gr/contact/" tabindex="0">Επικοινωνία</a></li>
</ul>
</div>
</div>
</div>

Answer 3

add display: inline; to your navbar-header
e.g.
<div class="navbar-header" style="
display: inline;
">

Answer 4

in your class container
.container{
display:flex;
justify-content:space-between;
}
and
.main-navigation{
margin:auto;}