ul,ul li {list-style:none;}

		header nav
		{
			width: 100%;
			max-width:980px;
			margin:auto;
			font-weight: normal;
			font-size:.875em;/*14px*/
		}

			header nav > a
			{
				display: none;
				
			}

			header nav li
			{
				position: relative;
			}
				header nav li a
				{
					color:#fff;
					display: block;
				}
				header nav li a:active
				{
					
				}

			header nav span:after
			{
				
			}

			/* first level */

			header nav > ul
			{
				height: 2.375em; /* 38 */
				background: #52739c;
				padding:4px;
				
				
			}
				header nav > ul > li
				{
					padding:0 2em;
           		 height: 100%;
            	float: left;
				
				}
					header nav > ul > li > a
					{
						height: 100%;
						font-size: .875em; /* 16 */
						line-height: 2em; 
						text-align: left;
						font-weight: normal;
						
												
						
					}
					
					
						header nav > ul > li:not( :last-child ) > a
						
						{color:#fff;
							
						}
						header nav > ul > li:last-child > a
						
						{color:#fff;
							
						}
						header nav > ul > li:hover > a,
						header nav > ul:not( :hover ) > li.active > a
						{
							/*background: #fff;*/
							color: #1c3f5b
						}


				/* second level */

				header nav li ul
				{
					background: #fff;
					display: none;
					position: absolute;
					top: 100%;
					width:100%;
					z-index:9999;
				}
					header nav li:hover ul
					{
						display: block;
						left: 0;
						right: 0;
					}
						header nav li:not( :first-child ):hover ul
						{
							left: -1px;
						}
						header nav li ul a
						{
							font-size: 1em; /* 16*/
							text-align:left;
							/*padding: 2px 5px 0 30px; */
							
							
						}
							header nav li ul li a:hover,
							header nav li ul:not( :hover ) li.active a
							{
								background-color: #fff;
							}


		@media only screen and ( max-width: 62.5em ) /* 1000 */
		@media screen and (max-width: 768px)
		{
			header nav
			{
				width: 100%;
				position: static;
				margin: 0;
			}
		}
		
		@media screen and (max-width: 48em) /* 768 */ {
		header nav > ul > li
				{
					padding:0 .50em;
					}
		}
		
		@media only screen and ( max-width: 40em ) /* 640 */
		{
		header nav > ul > li
				{
					padding:0 0.85em;
					}
		}

		@media only screen and ( max-width: 30em ) /* 4800 */
		{
			html
			{
				font-size: 75%; /* 12 */
			}

			header nav
			{
				position: relative;
				height: 14em;
				overflow:hidden
			}
				header nav > a
				{
					/*width: 3.125em; /* 50 */
					height: 3.125em; /* 50 */
					text-align: left;
					text-indent: -9999px;
					background-color: #fff;
					position: relative;
				}
					header nav > a:before,
					header nav > a:after
					{
						position: absolute;
						
						/*top: 35%;
						left: 25%;
						right: 25%;
						content: '';*/
					}
					header nav > a:after
					{
						top: 60%;
					}

				header nav:not( :target ) > a:first-of-type,
				header nav:target > a:last-of-type
				{
					display: block;
				}


			/* first level */

			header nav > ul
			{
				height: auto;
				/*display: none;*/
				position: absolute;
				left: 0;
				right: 0;
			}
				header nav:target > ul
				{
					display: block;
				}
				header nav > ul > li
				{
					width: 100%;
					float: none;
				}
					header nav > ul > li > a
					{
						height: auto;
						text-align: left;
						padding: 2px :
					}
						header nav > ul > li:not( :last-child ) > a
						{
							border-right: none;
							
						}


				/* second level */

				header nav li ul
				{
					position: static;
					padding: 2px;
					
				}
				header nav li ul li a
				{
					text-align:left;
					
				}
		}