@charset "utf-8";
/* CSS Document */

	/* You don't need the above styles, they are demo-specific ----------- */
	#menu-wrap {
		text-align:center;
		width: auto;
		padding-left:2.0%;
		border-bottom: none;
		line-height:1.0em;
		height:3.0em;
		background-image: -moz-linear-gradient(#DDDDDD, #ABA7A7); 
		background-image: -webkit-gradient(linear, left top, left bottom, from(#DDDDDD), to(#ABA7A7));	
		background-image: -webkit-linear-gradient(#DDDDDD, #ABA7A7);	
		background-image: -o-linear-gradient(#DDDDDD, #ABA7A7);
		background-image: -ms-linear-gradient(#DDDDDD, #ABA7A7);
		background-image: linear-gradient(#DDDDDD, #ABA7A7);
		z-index:1;
		}
	
	#menu, #menu ul {
		margin: 0;
		padding: 0;
		list-style: none;
		z-index:1;
	}
	
	#menu {
		min-width:35%;
		width: 99%;
		margin:  0 auto 0 auto;
		background-color: transparent;
		text-align:center;
		z-index:1;
	}
	
	#menu:before,
	#menu:after {
		content: "";
		display: table;
	}
	
	#menu:after {
		clear: both;
	}
	
	#menu {
		zoom:1;
	}
	
	#menu li {
		float: left;
		position: relative;
		width: auto;
		width:11.0%;
		}

	#menu a {	
		float: left;
		padding-top:1.0em;
		color: #666;
		text-align: center;
		text-transform: uppercase;
		font-family: 'Didact Gothic', sans-serif;
		font-size: 1.0em ;
		text-decoration: none;
		width:100.0%;
		height:2.0em;
		}
	
	#menu li:hover > a {
		color: #fff ;
		font-size: 1.0em ;
	}
	
				/* menü színátmenet hover */
				.hvr-sweep-to-bottom {
				  display: inline-block;
				  vertical-align: middle;
				  -webkit-transform: perspective(1px) translateZ(0);
				  transform: perspective(1px) translateZ(0);
				  box-shadow: 0 0 1px transparent;
				  position: relative;
				  -webkit-transition-property: color;
				  transition-property: color;
				  -webkit-transition-duration: 0.3s;
				  transition-duration: 0.3s;
				}
				.hvr-sweep-to-bottom:before {
				  content: "";
				  position: absolute;
				  z-index: -1;
				  top: 0;
				  left: 0;
				  right: 0;
				  bottom: 0;
				  background: #7a84c1;
				  -webkit-transform: scaleY(0);
				  transform: scaleY(0);
				  -webkit-transform-origin: 50% 0;
				  transform-origin: 50% 0;
				  -webkit-transition-property: transform;
				  transition-property: transform;
				  -webkit-transition-duration: 0.3s;
				  transition-duration: 0.3s;
				  -webkit-transition-timing-function: ease-out;
				  transition-timing-function: ease-out;
				}
				.hvr-sweep-to-bottom:hover, .hvr-sweep-to-bottom:focus, .hvr-sweep-to-bottom:active {
				  color: white;
				}
				.hvr-sweep-to-bottom:hover:before, .hvr-sweep-to-bottom:focus:before, .hvr-sweep-to-bottom:active:before {
				  -webkit-transform: scaleY(1);
				  transform: scaleY(1);
				}
					
	
	*html #menu li a:hover { /* IE6 only */
		color: #fafafa;
	}
	#menu ul {
		margin: 20px 0 0 0;
		_margin: 0; /*IE6 only*/
		opacity: 0;
		visibility: hidden;
		position: absolute;
		top: 3.0em;
		left: 0;
		z-index: 999999;    
		background:#7a84c1;  
	}

	#menu li:hover > ul {
		opacity: 1;
		visibility: visible;
		margin: 0;
	}
	
	#menu ul ul {
		top: 0;
		left: 2.0%;
		margin: 0 0 0 20px;
		z-index:999999;
		_margin: 0; /*IE6 only*/
		
	}
	
	#menu ul li {
		float: none;
		display: block;
		border: 0;
		z-index:999999;
		_line-height: 0; /*IE6 only*/
	}
	
	#menu ul li:last-child {   
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		z-index:999999;
		box-shadow: none;    
	}
	
	#menu ul a {    
		padding: 10px;
		color:#FFF;
		width: 180px;
		_height: 10px; /*IE6 only*/
		display: block;
		white-space: nowrap;
		float: none;
		z-index:999999;
		text-transform: none;
	}
	
	#menu ul a:hover {
		background-color: #e4e4e4;
		color:#333;
	}
	
	#menu ul li:first-child > a {
		-moz-border-radius: 3px 3px 0 0;
		-webkit-border-radius: 3px 3px 0 0;
		border-radius: 3px 3px 0 0;
	}
	
	#menu ul li:first-child a:hover:after {
		border-bottom-color: #fff; 
	}
	
	#menu ul ul li:first-child a:hover:after {
		border-right-color: #fff; 
		border-bottom-color: transparent; 	
	}
	
	#menu ul li:last-child > a {
		-moz-border-radius: 0 0 3px 3px;
		-webkit-border-radius: 0 0 3px 3px;
		border-radius: 0 0 3px 3px;
	}
	
	/* Mobile */
	#menu-trigger {
		display: none;
	}
	
	@media only screen and (min-width: 900px) and (max-width: 1200px) {

	#menu-wrap {
		background-image: none;
		}

		#menu a {
		float: left;
		padding: 10px;
		color: #666;
		text-transform: uppercase;
		font-family: 'Didact Gothic', sans-serif;
		font-size: 0.55em ;
		text-decoration: none;
		height:2.0em;
	}
	}

	@media screen and (max-width: 900px) {

		/* nav-wrap */
		#menu-wrap {
			background-image: none;
			position: relative;
			width:99%;
			padding-left:0;
		}

		#menu-wrap * {
			-moz-box-sizing: border-box;
			-webkit-box-sizing: border-box;
			box-sizing: border-box;
		}

		/* menu icon */
		#menu-trigger {
			display: block; /* show menu icon */
			height: 40px;
			line-height: 40px;
			cursor: pointer;		
			padding: 0 0 0 0;
			border: 1px solid #222;
			color: #fafafa;
			font-weight: bold;
				background-color: #7a84c1;
			-moz-border-radius: 6px;
			-webkit-border-radius: 6px;
			border-radius: 6px;
		}
		
		/* main nav */
		#menu {
			margin: 0; 
			padding: 10px;
			position: absolute;
			top: 40px;
			width: 99%;
			z-index: 999999;
			background-color: #CCC;
			display: none;
			-moz-box-shadow: none;
			-webkit-box-shadow: none;
			box-shadow: none;	
			text-align: left;	
		}

		#menu:after {
			content: '';
			position: absolute;
			left: 25px;
			top: -8px;
			border-left: 8px solid transparent;
			border-right: 8px solid transparent;
			border-bottom: 8px solid #CCC;
		}	

		#menu ul {
			position: static;
			visibility: visible;
			opacity: 1;
			margin: 0;
			background: none;
			-moz-box-shadow: none;
			-webkit-box-shadow: none;
			box-shadow: none;				
		}
		#menu li:hover > a {
			color: #fff ;
			background: none;
		}

		#menu ul ul {
			margin: 0 0 0 0 !important;
			-moz-box-shadow: none;
			-webkit-box-shadow: none;
			box-shadow: none;		
		}
	

		#menu li {
			width: auto;
			height: auto;
			position: static;
			display: block;
			float: none;
			border-bottom:1px solid #fff;
			padding: 5px;
			-moz-box-shadow: none;
			-webkit-box-shadow: none;
			box-shadow: none;			
		}

		#menu ul li{
			height:1.0em;
			margin-top:1.0em;
			margin-left: -20px;
			-moz-box-shadow: none;
			-webkit-box-shadow: none;
			box-shadow: none;		
		}
		
		#menu ul ul li {
			background: #0F3;
			height: auto;
			}

		#menu a{
			display: block;
			float: none;
			padding: 0;
			color: #333;
		}

		#menu a:hover{
			color: #fafafa;
		}	

		#menu ul a{
			color:#333;
			margin-left:25%;
			text-transform: uppercase;
			padding: 0;
			width: auto;		
		}

		#menu ul a:hover{
			background: none;
			color:#fff;	
		}

		#menu ul li:first-child a:after,
		#menu ul ul li:first-child a:after {
			border: 0;
		}		

	}

	@media screen and (min-width: 900px) {
		#menu {
			display: block !important;
		}
	}	

	/* iPad */
	.no-transition {
		-webkit-transition: none;
		-moz-transition: none;
		-ms-transition: none;
		-o-transition: none;
		transition: none;
		opacity: 1;
		visibility: visible;
		display: none;  		
	}

	#menu li:hover > .no-transition {
		display: block;
	}