nav
{
	position: fixed;
	width: 100%;
	height: 32mm;
	left: 0mm;
	top: 0mm;
	
	z-index: 1000;
	
	background: white;
	
	
	transition: height 400ms ease;
}

.scroll nav
{
	height: 12mm;
}

nav > .wrapper
{
	position: relative;
	width: 100%;
	max-width: 240mm;
	height: 100%;
	margin: 0mm auto;
}

nav h1
{
	margin: 0mm;
	height: 100%;
}

nav h1 a
{
	height: 100%;
}

nav h1 img
{
	height: 100%;
}

nav h2
{
	position: absolute;
	top: 10mm;
	right: 4mm;
	margin: 0mm;
	font-size: 4mm;
	font-weight: bold;
	font-style: italic;
	color: #3F3571;
	
	opacity: 1.0;
	transition: 1000ms ease;
}

nav button
{
	border: none;
	outline: none;
	background: none;
	cursor: pointer;
}

.scroll nav h2
{
	opacity: 0.0;
	transition: 150ms ease;
}

/* Mobile: */

@media ( max-width: 699px )
{
	nav
	{
		height: 12mm;
	}
	
	nav h2
	{
		display: none;
	}
	
	nav .menu
	{
		display: none;

		position: fixed;
		width: 100%;
		height: 100%;
		left: 0mm;
		top: 0mm;

		padding: 6mm;

		z-index: 1000;

		overscroll-behavior-block: contain;
		overflow-x: hidden;
		overflow-y: auto;

		background: rgba( 0, 0, 0, 0.7 );
	}
	
	nav .menu.show
	{
		display: block;
	}
	
	nav .opener
	{
		position: absolute;
		width: 12mm;
		height: 12mm;
		right: 0mm;
		bottom: 0mm;

		font-size: 6mm;
		line-height: 12mm;

		border: none;
		outline: none;
		background: none;
		/*color: #3F3571;*/
		color: #053782;

		cursor: pointer;
	}

	nav .menu .closer
	{
		position: fixed;
		width: 12mm;
		height: 12mm;
		top: 0mm;
		right: 0mm;

		z-index: 1;

		font-size: 8mm;
		line-height: 12mm;
		border: none;
		outline: none;

		text-shadow: 0mm 1mm 2mm rgba( 0, 0, 0, 0.5 );
		background: none;
		color: white;
		cursor: pointer;
	}

	nav .menu .closer:hover
	{
		background: rgba( 0, 0, 0, 0.7 );
	}

	nav .menu ul
	{
		list-style-type: none;
	}

	nav .menu > ul
	{
		width: 100%;
		max-width: 120mm;
		margin: 0mm auto;
		text-align: center;
	}

	nav .menu > ul > li
	{
		margin: 6mm auto;
	}

	nav .menu a,
	nav .menu button
	{
		display: block;
		position: relative;
		width: 100%;
		height: 12mm;
		line-height: 12mm;

		text-decoration: none;
		/*font-weight: bold;*/
		color: inherit;

		padding-left: 4mm;
		padding-right: 4mm;

		z-index: 1;

		background: white;
	}
	
	nav .menu > ul > li > a
	{
		font-weight: bold;
	}

	nav .menu a:hover,
	nav .menu button:hover
	{
		text-decoration: none;
		/*background: #3F3571;*/
		/*background: #053782;*/
		background: #3f79cc;
		color: white;
	}
	
}

/* Large */

@media ( min-width: 700px )
{
	nav .opener,
	nav .closer
	{
		display: none;
	}
	
	
	nav ul
	{
		position: absolute;
		margin: 0mm;
		padding: 0mm;
		list-style-type: none;
		float: left;
	}

	nav .menu
	{
		position: absolute;
		width: 100%;
		height: 12mm;
		right: 0mm;
		bottom: 0mm;
		pointer-events: none;
	}
	
	nav .menu > ul
	{
		right: 0mm;
		pointer-events: initial;
	}

	nav li
	{
		position: relative;
		float: left;
		/*width: 40mm;*/
	}

	nav li > a
	{
		z-index: 2;
	}

	nav a,
	nav button
	{
		position: relative;
		box-sizing: border-box;
		display: inline-block;
		/*width: 100%;*/
		/*width: 36mm;*/
		height: 12mm;
		line-height: 12mm;
		/*text-align: center;*/

		text-decoration: none;
		font-weight: bold;
		color: inherit;

		/*padding-left: 4mm;
		text-align: left;*/
		padding-left: 4mm;
		padding-right: 4mm;
		/*text-align: right;*/
		/*border-left: 2mm solid #FFEF14;*/
	}

	nav li
	{
		white-space: nowrap;
		/*color: #3F3571;*/
		color: #053782;
	}

	nav li:hover
	{
		/*background: #3F3571;*/
		background: #053782;
		color: white;

		z-index: 2;
	}

	nav li ul
	{
		display: none;
		
		/*position: absolute;*/
		/*right: 0mm;*/
		min-width: 40mm;

		background: white;
		/*color: #3F3571;*/
		color: #053782;
		
		/*transform: translateY( -100% );

		transition: opacity 0ms ease;
		opacity: 0.0;*/
	}

	nav li:hover ul
	{
		display: block;
		
		/*transform: translateY( 0% );
		
		transition: opacity 660ms ease;
		opacity: 1.0;*/
	}

	nav li ul li
	{
		float: none;
	}

	nav li ul a
	{
		box-sizing: border-box;
		width: 100%;
	}

	nav li a:hover,
	nav li button:hover
	{
		/*background: #5D4FA8;*/
		/*background: #053782;*/
		background: #3f79cc;
		text-decoration: none;
	}
	
	nav .menu > ul > li > a
	{
		z-index: 10;
	}
	
	nav li ul
	{
		z-index: 0;
	}
}


