Mobile toggle button right next to LOGO

Here is some CSS that should do the trick for you. Just copy and paste into Appearance> Theme Options> Advanced Settings.

@media (max-width: 767px){
    .kad-header-left {
    width: 80%;
}
}
header .nav-trigger .nav-trigger-case {
    top: -50px;
    position: absolute;
}
#kad-mobile-nav {
    margin-top: 0px;
}

OK,,,, so I’ve added below CSS and it got pretty close,,,,
The last thing to be resolved is to kill the space between menu list (after click on menu toggle, menu list shows up).
Can anybody help??

https://www.at-newyork-hotel.com

@media (max-width: 767px){
.kad-header-left {
width: 80%;
}
}
header .nav-trigger .nav-trigger-case {
top: -50px;
position: absolute;
}
#kad-mobile-nav {
margin-top: 0px;
}

@media (max-width: 480px) {
.kad-retina-logo {
width: 70%;
}
}
@media (max-width: 767px) {
.wrap.clearfix.contentclass.hfeed {
margin-top: -40px;
}
}

Hey,
If you add the css into your theme options > advanced settings > custom css box you would be set.

If your going to use something else then you will need to make the css more specific so it overrides css that shows later.

For example if your not going to use the theme options, this css:

#kad-mobile-nav {
margin-top: 0px;
}

would need to be something more like this:

.headerclass #kad-mobile-nav {
    margin-top: 0;
}

It’s all about css specificity.

You will want to remove this:

@media (max-width: 767px) {
.wrap.clearfix.contentclass.hfeed {
margin-top: -40px;
}
}

Kadence Themes

it doesn’t work properly yet,,, but I forgot to tell you that I am using my own CSS (copied from the original, as child theme).
Is this why it’s not working ?

Is this why it’s not working ? – yes.
all because of css specificity.

If you want to use the child theme you have to make all the css more specific.

Kadence Themes