﻿.navigation {
	padding: 0;
	margin: 0;
	border: 0;
	/*line-height: 1;*/
	color: rgb(102,44,167);
	display: none;
	position: absolute;
	background-color: #f9f9f9;
	/*min-width: 250px;*/
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index: 9999;
}

	.navigation ul,
	.navigation ul li,
	.navigation ul ul {
		list-style: none;
		margin: 0;
		padding: 0;
		border: none;
	}

	.navigation ul {
		position: relative;
		z-index: 500;
		float: left;
	}

/* level 1 content */
		.navigation ul li {
			float: left;
			/*min-height: 0.05em;
			line-height: 1em;
			vertical-align: middle;*/
			position: relative;
			white-space: nowrap;
		}

			.navigation ul ul li {
				float: none;
			}

			.navigation ul ul ul {
				top: 0;
				right: 0;
			}
				.navigation ul ul ul ul{
					top: 0;
					right: 0;
				}

/* Show level 2 on hover level 1 */
		.navigation ul li:hover > ul{
			visibility: visible;
		}

/* Level 2 box, border:NO, show shadow instead. border overlaps level 1*/
		.navigation ul ul {
			visibility: hidden;
			top: 0;
			left: 100%;
			padding-left: 5px;
			margin-top: 1px;
			/*border: 1px solid grey;*/
			position: absolute;
			left: 100%;
			background-color: #f9f9f9;
			box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
			min-width: 150px;
		}

		.navigation ul li {
			float: none;
		}

		/* Level 3 box, border:NO, show shadow instead. border overlaps level 1*/
		.navigation ul ul ul {
			visibility: hidden;
			top: 0;
			left: 100%;
			padding-left: 5px;
			margin-top: 1px;
			/*border: 1px solid grey;*/
			position: absolute;
			left: 100%;
			background-color: #f9f9f9;
			box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
			min-width: 150px;
		}
		/* Level 4 box, border:NO, show shadow instead. border overlaps level 1*/
			.navigation ul ul ul ul {
				visibility: hidden;
				top: 0;
				left: 100%;
				padding-left: 5px;
				margin-top: 1px;
				/*border: 1px solid grey;*/
				position: absolute;
				left: 100%;
				background-color: #f9f9f9;
				box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
				min-width:150px;
			}


/* level 1 item content*/
	.navigation a {
		display: block;
		text-decoration: none;
		/*text-transform: uppercase; */
		float: none;
		padding: 5px;
		font-size: 14px;
		text-align: left;
		background-color: #f9f9f9;
	}

/* caret after level 1 */
	/*.navigation ul li a:after {
		position: absolute;
		padding-left:5px;
		content: '»';
	}
*/
/*(Border on level 1 hover 
	.navigation   ul > li > a:hover{
		border: 1px solid grey;
		padding-top: 4px;
		padding-left: 4px;
	}
*/
	/*Border on level 1 hover*/
	.navigation ul li a:hover {
		border: 1px solid grey;
		padding-top: 4px;
		padding-left: 4px;
		background-color: #f9f9f9;
	}


	/*.navigation ul li.has-sub > a:after {
		content: '»';
		position: absolute;
		left:99%;
	}*/

/* border on level 2 content */
/*	.navigation ul li:hover ul li:hover a {
		border: 1px solid grey;
	}*/

/* caret after level 2 */
/*	.navigation  ul li ul li a:after {
		position: absolute;
		padding-left: 5px;
		content: '»';
	}
*/

	/* border on level 3 content */
	.navigation ul li a ul li a ul li a:hover {
		/*min-width: 50px;*/
		border: 1px solid grey;
		padding-top: 4px;
		padding-left: 4px;
		background-color: orange;
		/*background-color: #f9f9f9;*/
	}

	.navigation ul li ul li ul li a:after {
		position: absolute;
		content: ' ';
	}
	/* border on level 4 content */
	.navigation ul li a ul li a ul li a ul li a:hover {
		/*min-width: 50px;*/
		border: 1px solid grey;
		padding-top: 4px;
		padding-left: 4px;
		background-color: #f9f9f9;
	}

	.navigation ul li ul li ul li ul li a:after {
		position: absolute;
		content: '';
	}


		/*.navigation ul ul li {
			border-bottom: 1px solid grey;
			border:none;
		}*/
		/*.navigation ul li ul li {
			border-bottom: 1px solid grey;
			border: none;
		}*/


/*	.navigation ul ul li:hover > a {
		background: none;
		background-color: #f9f9f9;
		color: rgb(43,75,90);
		border: 1px solid green;
		border: none;
	}
*/
	.navigation.align-right > ul > li > a {
		/*border-left: 1px solid grey;
		border-right: none;*/
	}

	.navigation.align-right {
		float: right;
	}

		.navigation.align-right li {
			text-align: right;
		}

		.navigation.align-right ul li.has-sub > a:before {
			content: '+';
			position: absolute;
			top: 50%;
			left: 15px;
			margin-top: -6px;
		}

		.navigation.align-right ul li.has-sub > a:after {
			content: none;
		}

		.navigation.align-right ul ul {
			visibility: hidden;
			position: absolute;
			top: 0;
			left: -100%;
			z-index: 598;
			width: 100%;
		}

			.navigation.align-right ul ul li.first {
				/*-webkit-border-radius: 3px 0 0 0;
				-moz-border-radius: 3px 0 0 0;
				border-radius: 3px 0 0 0;*/
			}

			.navigation.align-right ul ul li.last {
				/*-webkit-border-radius: 0 0 0 3px;
				-moz-border-radius: 0 0 0 3px;
				border-radius: 0 0 0 3px;*/
			}

		.navigation.align-right ul ul {
			/*-webkit-border-radius: 3px 0 0 3px;
			-moz-border-radius: 3px 0 0 3px;
			border-radius: 3px 0 0 3px;*/
		}
