

@font-face {
font-family: teraskreasi;
src:url("teraskreasi.eot?") format("eot"),url("teraskreasi.woff") format("woff"),url("teraskreasi.html") format("truetype"),url("teraskreasi.svg#U.S.101") format("svg");
font-weight:normal;
font-style:normal;
}



/* ========== MAIN DIV THAT HOLDS THE ENTIRE MENU ========== */
.menu{
	width:100%; 
	height:42px; 
	margin:0px auto 0; 
	background:#003470; 
	border-bottom:solid 4px #C4E958;
	-webkit-box-shadow:0 0 4px #BBBBBB;
	-moz-box-shadow:0 0 4px #BBBBBB;
	box-shadow:0 0 4px #BBBBBB;
	}
/* ========== DIV THAT HOLDS MAIN LINKS ========== */
.menu ul{
	margin:0; 
	padding:0; 
	float:left; 
	list-style:none;	margin-left:15px;

	}
/* ========== MAIN LINKS ========== */
.menu ul li{
	position:relative;
	float:left; 
	}
.menu ul li a{
	display:block;
	height:42px;
	padding:0 8px; 
	font:18px/45px 'teraskreasi', sans-serif; 
	color:#fff; 
	text-transform:uppercase; 
	text-decoration:none;
	-webkit-transition:background 190ms ease-in, color 190ms ease-in;
	-moz-transition:background 190ms ease-in, color 190ms ease-in;
	-ms-transition:background 190ms ease-in, color 190ms ease-in;
	-o-transition:background 190ms ease-in, color 190ms ease-in;
	transition:background 190ms ease-in, color 190ms ease-in;
	}
/* ========== MAIN LINKS ON MOUSEOVER  ========== */
.menu ul:hover li.active > a{
	background:#003470; 
	color:#777; 
	}	
.menu ul li.active > a, .menu ul li:hover > a, .menu ul li.active:hover > a{
	background:#C4E958; 
	color:#003470; 
	}
/* ========== MAIN LINKS ON MOUSE CLICK ========== */	
.menu ul li a:active, .menu ul li.active a:active{
	color:#CCC;
	}
/* ========== DROPDOWN MENU ========== */
.menu ul ul{
	position:absolute;
	visibility:hidden;
	opacity:0;
	margin:14px 0 0 14px;
	padding-top:4px; 
	background:#C4E958; 
	border-bottom:solid 2px #B4E225;
	-webkit-border-bottom-right-radius:3px;
	-webkit-border-bottom-left-radius:3px;
	-moz-border-radius:0 0 3px 3px;
	border-radius:0 0 3px 3px;
	-webkit-transition:all 210ms ease-out 10ms;
	-moz-transition:all 210ms ease-out 10ms;
	-ms-transition:all 210ms ease-out 10ms;
	-o-transition:all 210ms ease-out 10ms;
	transition:all 210ms ease-out 10ms;	 z-index: 1000;

	}
.menu ul li:hover > ul{
	visibility:visible;
	opacity:1;
	margin:0;
	}
/* ========== LINKS IN DROPDOWN MENU ========== */
.menu ul ul li{
	cursor:pointer;
	border:solid 1px #B4E225;
	border-bottom:none;
	}
.menu ul ul li a{
	min-width:134px; 
	height:31px;
	padding-right:0; 
	font-size:18px; 
	color:#003470; 
	line-height:32px;
	text-transform:none;
	}
.menu ul ul li span{
	position:absolute;
	top:0;
	right:10px;
	font-size:16px; 
	}
/* ========== LINKS ON MOUSEOVER IN DROPDOWN MENU ========== */
.menu ul ul li:hover > a{
	background:#96BF1A;
	}
/* ========== LINKS ON MOUSE CLICK IN DROPDOWN MENU ========== */
.menu ul ul li a:active{
	color:#CCC; 
	}
/* ========== DROPDOWN MENU LVL 2,3,4,... ========== */
.menu ul ul ul{
	top:-1px;
	left:100%;
	padding:0;
	}
