/* 

 Menu background — EF0E1D2F

*/

.menu {
	position: relative;
	float: left;
	
	height: 100%;

	background: rgba(14, 29, 47, 0.937);
}


.menu__item {
	height: 36px;
	position: relative;
	padding: 12px;
}

.menu__item.active {
	background: rgba(0, 204, 250, 0.56);
}

.menu__item.selected {
	background: rgba(250, 63, 55, 0.56);
}

.menu__item:hover {
	background: rgba(250, 63, 55, 0.36);
}

.menu__item:active {
	background: rgba(0, 204, 250, 0.56);
}

.menu_folded .menu__item {
	background: none;
}

.menu__icon {
	position: relative;
	float: left;

	width: 36px;
	height: 36px;

	background-position: 0 0;
	background-repeat: no-repeat;
}

.menu__title {
	position: relative;
	float: left;

	left: 12px;
	top: 8px;
	padding-right: 8px;

	color: white;

	font-size: 22px;
}

.menu__icon_channels {
	background: url(../img/menu_channels_icon.png);
}

.menu__icon_settings {
	background: url(../img/menu_settings_icon.png);
}

.menu__icon_popular {
	background: url(../img/menu_popular_icon.png);
}

.menu__icon_cameras {
	background: url(../img/menu_cameras_icon.png);
}

.menu__icon_hd {
	background: url(../img/menu_hd_icon.png);
}

.menu__icon_vod {
	background: url(../img/menu_vod_icon.png);
}

.active > .menu__icon,
.selected > .menu__icon,
:hover > .menu__icon,
:active > .menu__icon {
	background-position: 0 -36px;
}

.menu_folded .menu__icon {
	background-position: 0 -72px;
}

.menu_folded .active .menu__icon {
	background-position: 0 0;
}