Hide Bottom Header Border In Mobile Navigation

Site URL: https://www.useinpress.com/plans

How can I hide the bottom header border in the mobile navigation?

Add to Home > Design > Custom CSS

/* Remove mobile header border */
@media screen and (max-width:767px) {
.header-announcement-bar-wrapper {border: none !important;}
}

Is there a way to make the border disappear only when the mobile navigation opens?

This code didn't work for me. This is my site: https://violet-conch-62zc.squarespace.com/ password is brineintopedro. Thanks

/* Remove mobile header border */
@media screen and (max-width:767px) {
.header-announcement-bar-wrapper {border: none !important;}
}

On 2/25/2023 at 10:52 PM, ghostpep___ said:

This code didn't work for me. This is my site: https://violet-conch-62zc.squarespace.com/ password is brineintopedro. Thanks

/* Remove mobile header border */
@media screen and (max-width:767px) {
.header-announcement-bar-wrapper {border: none !important;}
}

Remove this?

Yes please. Also trying to remove the border on a single page in full screen view.

The border around the image should be there, but not the double border.

Add to Design > Custom CSS

@media screen and (max-width:767px) {
.header-border {
    border: none !important;
}
}