A couple of days ago you gave me a great solution for a problem I had concerning forcing the mobile menu on the Royalty theme. Thanks again. I would like to use the same solution for the Medical theme.

When I use the code on Medical as is, it looks like Gantry is showing errors when the css if recompiled. They come up too fast to see what they are.

Will the following custom.scss code work (what you suggested for Royalty) for Medical? Or does it need to be tweaked?

#g-header {

	@include breakpoint(desktop-range) {

		position: relative;

		width: auto;

		top: auto;

		bottom: auto;

		height: auto;

		margin-left: 0 !important;

	}



	> .g-container {

		@include breakpoint(desktop-range) {

			width: auto;

			margin: 0 auto;

		}



		> .g-grid {

			@include breakpoint(desktop-range) {

				display: flex !important;

			}

		}

	}



	.g-content {

		@include breakpoint(desktop-range) {

			padding: 0 $content-padding;

			margin: 0 $content-margin;

		}

	}

}



@if $header-position == 'left' {

	#g-page-surround {

		@include breakpoint(desktop-range) {

			margin-left: 0 !important;

		}

	}

} @else {

	#g-page-surround {

		@include breakpoint(desktop-range) {

			margin-right: 0 !important;

		}

	}	

}



.g-social-copyright {

	@include breakpoint(desktop-range) {

		display: none;

	}

}



#g-offcanvas {

	.g-social-copyright {

		text-align: center;

		@include breakpoint(desktop-range) {

			display: block;

		}

	}

}



.search-toggle-container {

	@include breakpoint(desktop-range) {

		display: none;

	}

}



.g-logo {

	@include breakpoint(desktop-range) {

		margin: 10px 0;

	}



	.g-mobile-logo {

		@include breakpoint(desktop-range) {

			display: inline-block;

		}

	}

	.g-normal-logo {

		@include breakpoint(desktop-range) {

			display: none;

		}

	}

}



.g-offcanvas-toggle {

	@include breakpoint(desktop-range) {

		display: block;

	}

}

Thanks.