// MaxSite CMS
// Copyright http://max-3000.com/

@menu_height: 40px;

height: @menu_height;

ul.menu {
	
	margin-left: 20px;
	
	li {
		height: @menu_height;
		line-height: @menu_height;
	}

	// только верхние пункты
	> li > a {
		.f > .upper;
		.f > .size(12px);
		padding: 0 15px;
		.transition(background 0.3s 0s ease-out);
		color: #D7E3E9;
		
		height: @menu_height;
		line-height: @menu_height;
		margin-right: 1px;
	}

	// выделенный пункт и при наведении - только верхние
	> li.selected > a, 
	> li > a:hover 
	{
		.bg(rgba(10,10,10, 0.2));
		color: #fff;
	}

	// только подпункты
	li.group ul li > a {
		.transition(background-color 0.3s 0s ease-out);
		.f > .size(12px);
	}
	
	li.group > a span {
		background: url("../images/bullets/menu-down-gray.png") no-repeat right center;
		
		&:hover {
			background: url("../images/bullets/menu-down-light.png") no-repeat right center;
		}
	} 
	
	// под-подпункт
	li.group ul li.group > a span  {
		background: url("../images/bullets/menu-down-right.png") no-repeat right center;
	}

	li.group ul {
		// тень выпадающего блока
		.box_shadow(0px, 3px, 3px, rgba(0,0,0, 0.4));
		.bg(#ddd);
	}
	
	// отслеживаем верхний пункт, когда ховер на нижних
	li.group:hover {
		.bg(rgba(10,10,10, 0.2));
	}
	
	// верхний пункт, где есть подпункты
	li.group > a {
	}
	
	// выделенный подпункт
	li.group li.selected > a {
		.bg(rgba(10,10,10, 0.2));
		
		&:hover {
			.bg(rgba(10,10,10, 0.1));
		}
	}
	
}

// адаптивное меню
select.tinynav {
	width: 100%;
	height: @menu_height;
}

@media @MOBILE 
{
	@import url('menu/_tinynav.less');
}

// стили для сенсорных устройств
html.detect-touch
{
	@import url('menu/_tinynav.less');
}
