/* CSS Document */

#menu {
	display: block;
	position: relative;
	width: 164px;
	top: 20px;
	left: 0px;
	margin-left: 0px;
	padding-right: 6px;
	padding-left: 0px;
	padding-bottom: 10px;
/*	filter:alpha(opacity=85); */
	-webkit-opacity: 0.85;
	-moz-opacity:0.85;
	opacity: 0.85;
	
	overflow: hidden;
}


.menu>a, .menu>p {
/*	line-height: 14px; */

	display: block;
	width: 100%;
	padding: 3.5px 15px 4px;
	background-image: linear-gradient( to bottom, rgba(0,59,133,1), rgba(0,74,166,1) ), 
	                  linear-gradient( to bottom, rgba(0,59,133,1), rgba(0,74,166,1) );
	background-size: 12px 100%, auto;
	background-repeat: no-repeat, repeat-x;
	background-position: top right;

	left:-3px;
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFF;
	margin-top: 0;
	margin-bottom: 7px;
	border-radius: 0px 9px 9px 0px;
	box-shadow: -2px 2px 3px rgba(0,0,0,0.5), 0px -1px 3px rgba(0,0,0,0.3) inset;
	position: relative;
	text-decoration: none;
	
	transition: background 1s ease-out;	
	text-shadow: 0 0 1px rgba(0,0,0,0.5);
	
	z-index: 20;
	direction: ltr;

}

.menu>a.selected, .menu>p.selected {
	font-weight: bold;
}
.menu>a:hover {
	padding-left: 16px;
}
.menu>a::before {
	content: "";
	display: block; 
	position: absolute;
	right: 1px;
	top: 2px;
	width: 14px;
	height: 18px;
	border-radius: 0px 7px 7px 0px;
	background: linear-gradient( -110deg, rgba(255,255,255,0.8), rgba(255,255,255,0) 7.5px);
	z-index: 2;
/*	box-shadow: -3px 3px 3px rgba(255,255,255,0.01) inset;  */
}

/*#menu a::after {
	content: "";
	display: block; 
	position: relative;
	right: 0px;
	top: 0px;
	height: 100%; 
	position: absolute;
	width: 15px;
	z-index: 1;
	border-radius: 0px 10px 10px 0px;
	box-shadow: -2px -2px 4px rgba(0,0,0,0.4) inset; 
}*/
.menu .margin10 { margin-top: 16px; }
.menu .margin20 { margin-top: 26px; }



.subMenu {
	background-color: #9dbacf;
	background-color: rgba(255,255,255,0.4);
	display: block;
	padding-top: 6px;
	padding-bottom: 6px;
	top: -8px;
	z-index: 10;
	position: relative;
	width: 144px;
	border-bottom-right-radius: 8px;
}

.subMenu>a, .subMenu>p {
	display: block;
	padding: 1px 4px 3px 16px;
	color: #000; 
	position: relative;
	font-size: 12px;
	
	border-radius: 0px;
}
.subMenu>a:hover {
	background-color: #B4CADA;
	background-color: rgba(255,255,255,0.3);
	padding-left: 17px;
	box-shadow: none;
}
.subMenu>p {
	margin: 0;
	background-color: #c0d2e0;
	background-color: rgba(255,255,255,0.5);
	font-weight: bold;
}
.subMenu>a>span, .subMenu>p>span {
	font-size: 9px;
/*	font-weight: normal; */
}
/*
.subMenuBottom {
	font-size: 1px;
	display: block;
	background-image: url(Images/SubMenuBottom.gif);
	background-repeat: no-repeat;
	background-position: right top;
	height: 8px;
	width: 149px;
	position: relative;
	top: -8px;
	margin-bottom: 2px;
}
*/
.menu a.blue {
	background-image: linear-gradient( to bottom, rgba(0,0,236,1), rgba(0,88,250,1), rgba(5,117,255,1) ),
	                  linear-gradient( to bottom, rgba(0,59,133,1), rgba(0,74,166,1) );
}
.menu a.red {
	background-image: linear-gradient( to bottom, rgba(163,0,38,1), rgba(185,0,43,1), rgba(214,0,50,1) ),
	                  linear-gradient( to bottom, rgba(0,59,133,1), rgba(0,74,166,1) );
}
.menu a.yellow {
	background-image: linear-gradient( to bottom, rgba(246,142,6,1), rgba(255,181,6,1), rgba(255,220,21,1) ),
	                  linear-gradient( to bottom, rgba(0,59,133,1), rgba(0,74,166,1) );
}
.menu a.green {
	background-image: linear-gradient( to bottom, rgba(0,123,78,1), rgba(0,144,91,1), rgba(0,167,106,1) ),
	                  linear-gradient( to bottom, rgba(0,59,133,1), rgba(0,74,166,1) );
}
.menu a.magenta {
	background-image: linear-gradient( to bottom, rgba(146,16,172,1), rgba(158,17,186,1), rgba(177,19,209,1) ),
	                  linear-gradient( to bottom, rgba(0,59,133,1), rgba(0,74,166,1) );
}
.menu a.blue:hover {
	background-image: linear-gradient( to bottom, rgba(0,0,236,1), rgba(0,88,250,1), rgba(5,117,255,1) ),
					  linear-gradient( to bottom, rgba(0,0,236,1), rgba(0,0,174,1), rgba(5,117,255,1) );
}
.menu a.red:hover {
	background-image: linear-gradient( to bottom, rgba(163,0,38,1), rgba(185,0,43,1), rgba(214,0,50,1) ), 
					  linear-gradient( to bottom, rgba(163,0,38,1), rgba(128,0,29,1), rgba(214,0,50,1) );
}
.menu a.yellow:hover {
	background-image: linear-gradient( to bottom, rgba(246,142,6,1), rgba(255,181,6,1), rgba(255,220,21,1) ),
					  linear-gradient( to bottom, rgba(246,142,6,1), rgba(200,133,0,1), rgba(255,220,21,1) );
}
.menu a.green:hover {
	background-image: linear-gradient( to bottom, rgba(0,123,78,1), rgba(0,144,91,1), rgba(0,167,106,1) ),
					  linear-gradient( to bottom, rgba(0,123,78,1), rgba(0,78,49,1), rgba(0,167,106,1) );
}
.menu a.magenta:hover {
	background-image: linear-gradient( to bottom, rgba(146,16,172,1), rgba(158,17,186,1), rgba(177,19,209,1) ),
					  linear-gradient( to bottom, rgba(146,16,172,1), rgba(114,12,134,1), rgba(177,19,209,1) );
}

.menu a.blue.selected {
	background-image: linear-gradient( to bottom, rgba(0,0,236,1), rgba(0,88,250,1), rgba(5,117,255,1) ),
					  linear-gradient( to bottom, rgba(0,0,216,1), rgba(0,78,230,1), rgba(5,107,235,1) );
}

.menu a.red.selected {
	background-image: linear-gradient( to bottom, rgba(163,0,38,1), rgba(185,0,43,1), rgba(214,0,50,1) ),
					  linear-gradient( to bottom, rgba(143,0,28,1), rgba(165,0,33,1), rgba(194,0,40,1) );
}
.menu a.yellow.selected {
	background-image: linear-gradient( to bottom, rgba(246,142,6,1), rgba(255,181,6,1), rgba(255,220,21,1) ),
	                  linear-gradient( to bottom, rgba(226,132,6,1), rgba(235,171,6,1), rgba(235,210,11,1) );
}
.menu a.green.selected {
	background-image: linear-gradient( to bottom, rgba(0,123,78,1), rgba(0,144,91,1), rgba(0,167,106,1) ),
					  linear-gradient( to bottom, rgba(0,103,68,1), rgba(0,124,81,1), rgba(0,147,96,1) );
}
.menu a.magenta.selected {
	background-image: linear-gradient( to bottom, rgba(146,16,172,1), rgba(158,17,186,1), rgba(177,19,209,1) ),
	                  linear-gradient( to bottom, rgba(136,16,152,1), rgba(148,17,166,1), rgba(167,19,199,1) );
}

.menu a.blue.selected:hover, .menu p.blue.selected {
	background-image: linear-gradient( to bottom, rgba(0,0,236,1), rgba(0,88,250,1), rgba(5,117,255,1) ),
					  linear-gradient( to bottom, rgba(0,0,236,1), rgba(0,88,250,1), rgba(5,117,255,1) );
}
.menu a.red.selected:hover, .menu p.red.selected {
	background-image: linear-gradient( to bottom, rgba(163,0,38,1), rgba(185,0,43,1), rgba(214,0,50,1) ),
					  linear-gradient( to bottom, rgba(163,0,38,1), rgba(185,0,43,1), rgba(214,0,50,1) );
}
.menu a.yellow.selected:hover, .menu p.yellow.selected {
	background-image: linear-gradient( to bottom, rgba(246,142,6,1), rgba(255,181,6,1), rgba(255,220,21,1) ),
	                  linear-gradient( to bottom, rgba(246,142,6,1), rgba(255,181,6,1), rgba(255,220,21,1) );
}
.menu a.green.selected:hover, .menu p.green.selected {
	background-image: linear-gradient( to bottom, rgba(0,123,78,1), rgba(0,144,91,1), rgba(0,167,106,1) ),
					  linear-gradient( to bottom, rgba(0,123,78,1), rgba(0,144,91,1), rgba(0,167,106,1) );
}
.menu a.magenta.selected:hover, .menu p.magenta.selected {
	background-image: linear-gradient( to bottom, rgba(146,16,172,1), rgba(158,17,186,1), rgba(177,19,209,1) ),
	                  linear-gradient( to bottom, rgba(146,16,172,1), rgba(158,17,186,1), rgba(177,19,209,1) );
}
