Positioning and Size of Mobile Menu and Navigation Search

I have two (related I think) questions, that's why I put them in the same topic.

1) I would like to reduce the size of the mobile menu which appears after clicking the hamburger menu, so it doesn't cover the whole screen on mobile but leaves part of the underlying page visible. Also I would like to move it a couple of pixels down. How would I go about this?

2) Regarding navigation search, I have found forum topics how to change size of the nav search:

/* search form styling */
.navigation-search {
      max-width: 300px;
      max-height: 50%;
}

I would like to also move it a couple of pixels down, because it is "stuck" to the top of the page.

I tried:
vertical-align: -25px !important;

(in the code above for the .navigation-search element), but that didn't change anything.

Thanks for your help :)