@import url(https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700);

@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,600,300);
@charset 'UTF-8';
/* Base Styles */
#cssmenu,
#cssmenu ul,
#cssmenu li,
#cssmenu a {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  font-weight: normal;
  text-decoration: none;
  line-height: 1;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  position: relative;
}
#cssmenu {
  width: 200px;
  border-bottom: 4px solid #656659;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
#cssmenu a {
  line-height: 1.3;
}
#cssmenu > ul > li:first-child {
  background: #66665e;
  background: -moz-linear-gradient(#66665e 0%, #45463d 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #66665e), color-stop(100%, #45463d));
  background: -webkit-linear-gradient(#66665e 0%, #45463d 100%);
  background: linear-gradient(#66665e 0%, #45463d 100%);
  border: 1px solid #45463d;
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
}
#cssmenu > ul > li:first-child > a {
  padding: 15px 10px;
  background: url(../images/pattern.png) top left repeat;
  border: none;
  border-top: 1px solid #818176;
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
  font-family: 'Ubuntu', sans-serif;
  text-align: center;
  font-size: 18px;
  font-weight: 300;
  text-shadow: 0 -1px 1px #000000;
}
#cssmenu > ul > li:first-child > a > span {
  padding: 0;
}
#cssmenu > ul > li:first-child:hover {
  background: #66665e;
  background: -moz-linear-gradient(#66665e 0%, #45463d 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #66665e), color-stop(100%, #45463d));
  background: -webkit-linear-gradient(#66665e 0%, #45463d 100%);
  background: linear-gradient(#66665e 0%, #45463d 100%);
}
#cssmenu > ul > li {
  background: #9ea8db;
  background: -moz-linear-gradient(#9ea8db 0%, #7987cd 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9ea8db), color-stop(100%, #7987cd));
  background: -webkit-linear-gradient(#9ea8db 0%, #7987cd 100%);
  background: linear-gradient(#9ea8db 0%, #7987cd 100%);
}
#cssmenu > ul > li:hover {
  background: #939ed7;
  background: -moz-linear-gradient(#939ed7 0%, #6e7dc9 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #939ed7), color-stop(100%, #6e7dc9));
  background: -webkit-linear-gradient(#939ed7 0%, #6e7dc9 100%);
  background: linear-gradient(#939ed7 0%, #6e7dc9 100%);
}
#cssmenu > ul > li > a {
  font-size: 16px;
  display: block;
  background: url(../images/pattern.png) top left repeat;
  color: #ffffff;
  border: 1px solid #6676c6;
  border-top: none;
  text-shadow: 0 -1px 1px #3d4da3;
}
#cssmenu > ul > li > a > span {
  display: block;
  padding: 12px 10px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
#cssmenu > ul > li > a:hover {
  text-decoration: none;
}
#cssmenu > ul > li.active {
  border-bottom: none;
}
#cssmenu > ul > li.has-sub > a span {
  background: url(../images/icon_plus.png) 96% center no-repeat;
}
#cssmenu > ul > li.has-sub.active > a span {
  background: url(../images/icon_minus.png) 96% center no-repeat;
}
/* Sub menu */
#cssmenu ul ul {
  //display: none;
  background: #fff;
  border-right: 1px solid #a2a194;
  border-left: 1px solid #a2a194;
}
#cssmenu ul ul li {
  padding: 0;
  border-bottom: 0px solid #d4d4d4;
  border-top: none;
  background: #f7f7f7;
  background: -moz-linear-gradient(#f7f7f7 0%, #ececec 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f7f7f7), color-stop(100%, #ececec));
  background: -webkit-linear-gradient(#f7f7f7 0%, #ececec 100%);
  background: linear-gradient(#f7f7f7 0%, #ececec 100%);
}
#cssmenu ul ul li:last-child {
  border-bottom: none;
}
#cssmenu ul ul a {
  padding: 10px 10px 10px 25px;
  display: block;
  color: #676767;
  font-size: 12px;
  font-weight: normal;
}
#cssmenu ul ul a:before {
  content: '»';
  position: absolute;
  left: 10px;
  color: #9ea8db;
}
#cssmenu ul ul a:hover {
  color: #9ea8db;
}

			#menu {
				font-family: Arial, sans-serif;
				font-weight: bold;
				//text-transform: uppercase;
				margin: 20px 0;
				padding: 0;
				list-style-type: none;
				background-color: #eee;
				font-size: 18px;
				height: 40px;
				border-top: 2px solid #eee;
				border-bottom: 2px solid #ccc;
			}
			#menu li {
				float: left;
				margin: 0;				
			}
			#menu li a {
				text-decoration: none;
				display: block;
				padding: 0 20px;
				line-height: 40px;
				color: #666;
			}
			#menu li a:hover, #menu li.active a {
				background-color: #f5f5f5;
                                background-color: #dae4ff;
                                //background-color: #BCBC80;
				border-bottom: 2px solid #DDD;
				color: #999;
                                //color:white;
			}
			#menu_wrapper ul {margin-left: 12px;}
			#menu_wrapper {padding: 0 16px 0 0; background: url(../images/grey.png) no-repeat right;}
			#menu_wrapper div {float: left; height: 44px; width: 12px; background: url(../images/grey.png) no-repeat left;}
			
			/* Black Menu */
			#menu_wrapper.black ul {
				border-top: 2px solid #333;
				border-bottom: 2px solid #000;
				background: #333;}
			#menu_wrapper.black a {color: #CCC;}
			#menu_wrapper.black li a:hover, #menu_wrapper.black li.active a {color: #999; background: #555; border-bottom: 2px solid #444;}
			#menu_wrapper.black {background: url(../images/black.png) no-repeat right;}
			#menu_wrapper.black div {background: url(../images/black.png) no-repeat left;}
			
			/* Blue Menu */
			#menu_wrapper.blue ul {
				border-top: 2px solid #356AA0;
				border-bottom: 2px solid #204061;
				background: #356AA0;}
			#menu_wrapper.blue a {color: #fff;}
			#menu_wrapper.blue li a:hover, #menu_wrapper.blue li.active a {color: #90CDFF; background: #3D7BBB; border-bottom: 2px solid #356AA0;}
			#menu_wrapper.blue {background: url(../images/blue.png) no-repeat right;}
			#menu_wrapper.blue div {background: url(../images/blue.png) no-repeat left;}
			
			/* Red Menu */
			#menu_wrapper.red ul {
				border-top: 2px solid #660000;
				border-bottom: 2px solid #450000;
				background: #660000;}
			#menu_wrapper.red a {color: #fff;}
			#menu_wrapper.red li a:hover, #menu_wrapper.red li.active a {color: #F27F84; background: #990000; border-bottom: 2px solid #660000;}
			#menu_wrapper.red {background: url(../images/red.png) no-repeat right;}
			#menu_wrapper.red div {background: url(../images/red.png) no-repeat left;}
			
			/* Orange Menu */
			#menu_wrapper.orange ul {
				border-top: 2px solid #d15600;
				border-bottom: 2px solid #B44500;
				background: #d15600;}
			#menu_wrapper.orange a {color: #fff;}
			#menu_wrapper.orange li a:hover, #menu_wrapper.orange li.active a {color: #FA9B5B; background: #B44500; border-bottom: 2px solid #d15600;}
			#menu_wrapper.orange {background: url(../images/orange.png) no-repeat right;}
			#menu_wrapper.orange div {background: url(../images/orange.png) no-repeat left;}