Changing the menu hamburger breakpoint

[Puneeth]

Hi,

What I am trying to do is, to change the main menu navigation’s bar breakpoint so we get the hamburger at a earlier point rather than later. Could you please help me with having this done.

Right now, the government funding goes under the logo before it reaches the next breakpoint.

If you could write back to me with the solution, that would be great.

[Rui Guerreiro – SUPPORT]

Hi,

Unfortunately it’s not easy to achieve since it would require a considerable customization.

-Rui

[Puneeth]

Hi Rui,
Could you please elaborate on how I could achieve this? that would be very helpful on your behalf.

[Rui Guerreiro – SUPPORT]

Hi,

I don’t know the specifics, I just remember that I asked this before to the development team and they reply that is complex.

I can forward the topic so they can reply you, but we can’t assist in complex customizations since we just don’t have the time to do it.

-Rui

[Swift Ideas – Ed]

Hi Puneeth,

You can probably achieve it with this custom css:

@media only screen and (max-width: 1200px) {
	.header-1 #logo, .header-2 #logo {
		width: 100%;
	}
	.header-3 #logo, .header-4 #logo, .header-5 #logo {
		width: 100%;
		padding-right: 30px;
		position: relative;
	}
	.header-6 #logo, .header-7 #logo {
		width: 100%;
		padding: 0 15px;
		left: 0;
		height: auto;
		position: relative;
	}
	.naked-header .header-wrap {
		top: 0;
		position: relative;
	}
	.naked-header.header-overlay .header-wrap {
		left: 0;
	}
	.naked-header #header-section #logo img {
		display: none;
	}
	.naked-header #header-section #logo img.standard {
		display: inline-block;
	}
	#logo img {
		height: auto!important;
		min-height: auto!important;
	}
	#header .header-container {
		height: auto;
		overflow: hidden;
		padding-bottom: 10px;
	}
	nav.search-nav {
		display: none;
	}
	#logo a {
		float: left;
		display: block!important;
	}
	#main-navigation {
		display: none;
	}
	.header-1 #main-nav, .header-1 #main-nav-sticky-wrapper, .header-1 .header-left, .header-1 .header-right, .header-2 .header-right, .header-2 #main-nav, .header-2 #main-nav-sticky-wrapper {
		display: none;
	}
	#logo {
		width: 100%!important;
	}
}

Hope that helps.

– Ed