Flatiron - Change mobile navigation line height

I am using the Flatiron template. in the MOBILE view, once the navigation is clicked to open, I would like the navigation items to be less spaced out in terms of line height. they currently take up the entire screen on my iPhone 7 plus.

Website: www.isissakomadajohn.com

Add to Home > Design > Custom CSS

@media screen and (max-width:640px) {
#mobileNav ul li {
    line-height: 1.5em;
}
}

Awesome thanks!

@tuanphan, on mobile, when the navigation is closed and you only see the "+", is there a way to have less spacing between the "+" and my logo? I'd like to decrease the vertical space there so the "+" is closer to my logo.

Thanks!

16 hours ago, isissa said:

Awesome thanks!

@tuanphan, on mobile, when the navigation is closed and you only see the "+", is there a way to have less spacing between the "+" and my logo? I'd like to decrease the vertical space there so the "+" is closer to my logo.

Thanks!

Add to Home > Design > Custom CSS

Not sure it will work

@media screen and (max-width:640px) {
.siteTitle {
    padding-top: 0 !important;
}
}

@tuanphan thanks for trying. this doesn't work.

7 hours ago, isissa said:

@tuanphan thanks for trying. this doesn't work.

try inserting code to Last Line in Custom CSS Box

@tuanphan, hmm still nothing.

3 minutes ago, isissa said:

@tuanphan, hmm still nothing.

try keeping the code & share url again. I will give a look.

code is in there. www.isissakomadajohn.com

11 hours ago, isissa said:

code is in there. www.isissakomadajohn.com

@media screen and (max-width:640px) {
nav#mobile-navigation {
    padding-bottom: 0;
}
#navigator .siteTitle {
    top: -20px;
}
}

thank you, @tuanphan.

This has helped with decreasing the space between the "+" and the logo, but it is instead now increasing the space between the logo and the page content.

How can I decrease the space between the logo and page content now?

www.isissakomadajohn.com

14 hours ago, isissa said:

thank you, @tuanphan.

This has helped with decreasing the space between the "+" and the logo, but it is instead now increasing the space between the logo and the page content.

How can I decrease the space between the logo and page content now?

www.isissakomadajohn.com

@media screen and (max-width:640px) {
section#container {
    margin-top: 130px !important;
}
}