@header-size: 50px;
@menu-color: #31394A;

.dojoPanelMenu {
	header.main {
		.linear-gradient(@blue, mix(@blue, @blue-dark, 25%));
		.box-shadow(0,1px,5px,rgba(@black,.5));
		position: fixed;
		top: 0;
		width: 100% - (@horizontal-space-xl*2);
		max-width: none;
		height: @header-size;
		margin: 0;
		padding: 0 @horizontal-space-xl;
		border-bottom: 1px solid @blue-dark;
		z-index: 10;

		.logo a, .menu-trigger {
			display: block;
			height: 100%;
			text-shadow: 0 -1px 1px @black;
			line-height: @header-size;
			color: @white;
		}

		.logo {
			.type-medium;
			float: none;
			width: 60%;
			margin: 0 auto;

			a {
				position: static;
			}

			a:before { display: none !important; }
		}

		.menu-trigger, .left-menu {
			position: absolute;
			top: 0;
			left: 0;
			padding: 0 @vertical-space*1.5;
			font-size: 1.2em;
			line-height: @header-size*1.15;

			&:active { text-shadow: 0 -1px 1px @black, 0 0 50px @white; }
		}

		.left-menu {
			left: auto;
			right: 0 !important;
		}

		nav {
			text-indent: -9999px;
		}
	}

	.content {
		padding-top: @vertical-space-xl;

		section.intro h2 {
			padding-top: 0;
		}

		h2 {
			margin-top: 0;
			padding-top: @header-size*1.25;
		}

		.spec, h3 {
			margin-top: 0;
			padding-top: @vertical-space-xl;
		}

		.spec h3 { padding-top: 0; }

		.jPM-specific {
			display: block;
		}
	}
}

.menu-background {
	background: @menu-color;

	ul {
		border-bottom: 1px solid lighten(@menu-color,5%);
		padding: 0;
		margin: 0px;
	}

	li {
		list-style: none;
	}

	li.selected {
		background-color: #262C3A;
	}

	li a {
		//.linear-gradient(lighten(@menu-color,1%), darken(@menu-color,1%));
		background-color: #31394A;
		.type-medium;
		display: block;
		padding: @vertical-space-small @horizontal-space-large;
		border-top: 1px solid lighten(@menu-color,5%);
		border-bottom: 1px solid darken(@menu-color,5%);
		text-decoration: none;
		text-shadow: 0 -1px 2px @black;
		//color: @white;
		color: #C4CCDA;

		&:hover, &:focus { .linear-gradient(lighten(@menu-color,5%), darken(@menu-color,1%)); }
		&:active {
			.linear-gradient(lighten(@menu-color,1%), darken(@menu-color,5%));
			.box-shadow(0,2px,7px,@black,true);
			border-top-color: darken(@menu-color,10%);
			padding-top: @vertical-space-small*1.1;
			padding-bottom: @vertical-space-small*.9;
		}
	}
}

.jPanelMenu-panel {
	.box-shadow(0,0,25px,@black);
}