.menu {
	background-color: #3e3e3e;
	padding-right: 12%;
	padding-left: 12%;
	margin-bottom: -10px;
	*padding-right: 20px; /* IE7 and below */
	*padding-left: 20px; /* IE7 and below */
	*padding-bottom:5px; /* IE7 and below */;

	
}


#nav
		{
	width: 100%;
	z-index: 100;
	position: relative;
	display: table;
	*display:block; /* IE7 and below */
	*background-color: #3e3e3e; /* IE7 and below */

	margin: 0px;
	padding: 0px;

		}

			#nav > a
			{
				display: none;
			}

			#nav li
			{
				position: relative;
				list-style-type: none;
				margin: 0px;
				padding: 0px;
			}
			
			#nav ul
			{
				padding: 0px;
				list-style-type: none;
				margin: 0px;
			}			
				#nav li a
				{
					color: #FFFFFF;
					display: block;
					text-decoration: none;
				}
				#nav li a:active
				{
					background-color: #c00 !important;
				}

			#nav span:after /*sageata drop down;*/
			{
	width: 0;
	height: 0;
	border: 0.25em solid transparent; /* 5 */
	border-bottom: none;
	border-top-color: #dcdcdc;
	content: '';
	vertical-align: middle;
	display: inline-block;
	position: relative;
	right: -0.25em; /* 5 */
	margin-left: 3px;
			}

			/* first level */

			#nav > ul
			{
	/*background-color: #4a4a4a;*/
	display: table-row;
	*display:block; /* IE7 and below */

			}
				#nav > ul > li
				{
	display: table-cell;
	text-align: center;
	*float:left; /* IE7 and below */
	*display:block; /* IE7 and below */
				}
					#nav > ul > li > a
					{
						height: 100%;
						text-align: center;
						display: block;
						padding-top: 15px;
						padding-right: 5px;
						padding-bottom: 15px;
						padding-left: 5px;
						*padding-right: 40px; /* IE7 and below */
						*padding-left: 40px; /* IE7 and below */
						
						
					}
						#nav > ul > li:not( :last-child ) > a
						{
							/*border-right: 1px solid #cc470d;*/
						}
						

						
						#nav > ul > li:hover > a,
						#nav > ul:not( :hover ) > li.active > a,
						.sect_activ
						{
							background-color: #c82423;
							
						}
						
						#nav > ul > li > a:hover {
							*text-decoration:underline; /* IE7 and below */
						}

				/* second level */

				#nav li ul
				{
					background-color: #da251d;
					display: none;
					position: absolute;
					top: 100%;

				}
					#nav li:hover ul
					{
						
						display: block;
						*display: none; /* IE7 and below */
						left: 0;
						right: 0;
						-webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.3);
						-moz-box-shadow:    0px 5px 5px 0px rgba(0, 0, 0, 0.3);
						box-shadow:         0px 5px 5px 0px rgba(0, 0, 0, 0.3);
					}
					

					
										
						#nav li:not( :first-child ):hover ul
						{
							/*left: -1px;*/
						}
						#nav li ul a
						{
	padding-top: 10px;
	padding-right:5px;
	padding-bottom: 10px;
	padding-left: 5px;
	border-top: 1px dotted #e15a1f;

						}
							#nav li ul li a:hover,
							#nav li ul:not( :hover ) li.active a
							{
								background-color: #c82423;
							}
							
							
					
						#nav > ul > li:hover > a, #nav li ul li a:hover { /*fade*/
						
						    -webkit-transition: background-color .2s ease-out;
							-moz-transition: background-color .2s ease-out;
							-o-transition: background-color .2s ease-out;;
							-ms-transition: background-color .2s ease-out;
							transition: background-color .2s ease-out;
						}				
				
				
				
					#nav > ul > li > a /*marime caracter nivel 1*/
					{
						font-size: 130%;

					}
					#nav > ul > li > ul> li > a /*marime caracter nivel 2*/
					{
						font-size: 120%;

					}	
					

		@media screen and (max-width: 600px) {
		
					.menu {
						padding-right: 0;
						padding-left: 0;
					}

					#nav > ul > li > a /*marime caracter nivel 1*/
					{
						font-size: 120%;

					}
					#nav > ul > li > ul> li > a /*marime caracter nivel 2*/
					{
						font-size: 110%;

					}			
		}

		@media screen and (max-width: 400px) {
		
					.menu {
						margin-bottom:0px;
					}


					#nav > ul > li > a /*marime caracter nivel 1*/
					{
						font-size: 110%;
					}
					#nav > ul > li > ul> li > a /*marime caracter nivel 2*/
					{
						font-size: 110%;
					}
					
			
			
			#nav
			{
				position: relative;
				top: auto;
				left: auto;
				display:block;
			}
				#nav > a
				{
					text-align: left;
					background-color: #323232;
					position: relative;
					padding-left:60px;
					padding-top:18px;
					padding-bottom:18px;
					color:#FFFFFF;
					text-decoration:none;
					
					font-weight: bold;
					background-image:url(../icon-menu-mobil.png);
					background-repeat: no-repeat;
					background-position: 5px center;
				}


				#nav:not( :target ) > a:first-of-type,
				#nav:target > a:last-of-type
				{
					display: block;
				}


			/* first level */

			#nav > ul
			{
				height: auto;
				display: none;
				position: relative;
				left: 0;
				right: 0;
				background-color: #3e3e3e;
			}
				#nav:target > ul 
				{
					display: block;!important
				}
				#nav > ul > li
				{
					width: 100%;
					float: none;
					display: block;
					
				}
				
			
				
				
				
					#nav > ul > li > a
					{
						height: auto;
						text-align: left;
						padding-top: 15px;
						padding-right: 5px;
						padding-bottom: 15px;
						padding-left: 15px;	
					}
						#nav > ul > li:not( :last-child ) > a /*separare linie meniu mobil*/
						{
							border-right: none;
							border-bottom: 1px solid #666666;
						}


				/* second level */

				#nav li.sect_activ ul
				{
					display: block;
				}



				#nav li ul
				{
					position: static;
					padding-top: 0;
				}
				
				#nav li ul a
				{
					padding-top: 10px;
					padding-bottom: 10px;
					padding-left:30px;
					text-align: left;
				}
				
				
				#nav li ul li.categ_activ a {
					background-color: #c82423;
					background-image: url(../sageata-alba-dreapta.png);
					background-position: 20px center;
					background-repeat: no-repeat;
					font-style: italic;
					font-weight:bold;
				}
				#nav > ul > li:hover > a,
				#nav > ul:not( :hover ) > li.active > a,
				.sect_activ
				{
					background-color: #323232;
			
				}				

}
