#h_menu{
	display: flex;
	height: 48px;
	max-width:98vw; /*limit submenu width to 98% viewport width*/
	flex-direction: row;
	position: absolute;
	vertical-align:bottom;
	bottom: -100px;
	left: 50%;
	transform: translate(-50%);  /*сдвиг меню на половину его ширины*/
	background-color: rgba(0, 0, 0, 0.75);
	border-radius: 5px 5px 5px 5px;
	z-index: 9006;
	-webkit-user-select:none;
	-khtml-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	-o-user-select:none;
	user-select:none;
} 


#h_holder {
	height: 48px;
	width: 28px;
	background: rgba(0,0,0,0.0);
	border-radius: 5px 0px 0px 5px;
	cursor: pointer;
	background-position: center; 
    background-repeat: no-repeat;
	background-image: url("../skin/icons/h_menu/down.svg");
    background-size: 85%;	
}
#h_submenu__holder_up {
	height: 48px;
	width: 30px;
	border-radius: 5px;
	cursor: pointer;
	position: absolute;
	vertical-align:bottom;
	bottom: -100px;
	left: 50%;
	transform: translate(-10%, -50%);
	background-color: rgba(0, 0, 0, 0.5);	
	background-position: center; 
    background-repeat: no-repeat;
	background-image: url("../skin/icons/h_menu/up.svg");
    background-size: 85%;	
	z-index: 9006;
}
#h_submenu__holder_up:hover {
	background-color: rgba(135, 133, 142, 0.7);
}

#h_menu_buttons {
	width: auto;
	height: 48px;
	display: flex;
	flex-direction: row;
	position: absolute;
	left: 28px;
	top: 50%;
	transform: translate(0, -50%);
	background-color: rgba(0, 0, 0, 0.75);
	border-radius: 0 5px 5px 0 ;
	transition: right 0.4s ease-out;
	z-index: 9005;
}

.h_menu_btn_logo {
	width: 48px;
	height: 48px;
	background-repeat: no-repeat;
	background-size: 68%;
	background-position: center;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	cursor: pointer;
	z-index: 9006;
}

.h_menu_btn {
	width: 48px;
	height: 48px;
	background-image: url('../skin/icons/h_menu/infra_white.svg');
	background-repeat: no-repeat;
	background-size: 55%;
	background-position: center;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	cursor: pointer;
	z-index: 9006;
}


.h_menu_btn:hover {
	background-color: rgba(135, 133, 142, 0.7);
}

 /*подменю */
#h_submenu {
	display: none;
	height: 48px;
	max-width:90vw; /*limit submenu width to 90% viewport width*/
	flex-direction: row;
	justify-content: flex-end;
	position: absolute;
	vertical-align:bottom;
	transform: translate(-50%);
	left: 50%;
	background-color: rgba(0, 0, 0, 0.75);
	border-radius: 15px;
	bottom: 80px;

	z-index: 9002;
	
	-webkit-user-select:none;
	-khtml-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	-o-user-select:none;
	user-select:none;
	
}
 


 .h_submenu__buttons {
	width: 38px;
	height: 48px;
	background-position: center;
    background-size: 80%;	
	border-radius: 0px 0px 0px 0px;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	cursor: pointer;
} 

 .close {
	background-image: url('../skin/icons/h_menu/close.svg');
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
    background-size: 80%;	
	justify-content: flex-end;
	align-items: right;
	position: relative; 
	border-radius: 0 15px 15px 0;
	margin-right: 0px;
}

 .right {
	width: 30px;
	background-image: url('../skin/icons/h_menu/arrow_right.svg');
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
    background-size: 35%;	
	justify-content: flex-end;
	align-items: right;
	position: relative; 
	border-radius: 0 0px 0px 0;
	margin-right: 0px;
}
 .left {
	width: 30px;
	background-image: url('../skin/icons/h_menu/arrow_left.svg');
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
    background-size: 35%;	
	justify-content: flex-end;
	align-items: right;
	position: relative; 
	border-radius: 0 0px 0px 0;
	margin-right: 0px;
}

 .month {
    padding: 0px 5px 0px 5px
}

/*ползунок времени*/
.h_submenu__buttons_time {
	width: 200px;
	height: 48px;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
} 


/*отображение времени*/
.h_submenu__buttons_timedisplay {
	width: 50px;
	font-size: 13px;
	height: 48px;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
}

.h_submenu__buttons:hover {
	background-color: rgba(135, 133, 142, 0.7);
}

.h_submenu_btn {
	width: 56px;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center; 
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	cursor: pointer;
}

#h_holder:hover {
	background-color: rgba(135, 133, 142, 0.7);
}


/* подсказка к нижнему меню с лого*/
.h_menu_btn_logo:hover span {
	display: flex;
	flex-direction:column-reverse;
	top: -50px;
	background-color: rgba(0, 0, 0, 0.75);
	border-radius: 5px;
	padding: 12px 16px;
	position: absolute;
	font-family: Roboto;
	font-style: normal;
	font-weight: normal;
	font-size: 13px;
	line-height: 24px;
	white-space: nowrap;
	justify-content: center;
	align-items: center;
	text-transform: uppercase;
	
	
}
.h_menu_btn_logo span  {
	display: none;
	
}

/* подсказка к нижнему меню */
.h_menu_btn:hover span {
	display: flex;
	flex-direction:column-reverse;
	top: -50px;
	background-color: rgba(0, 0, 0, 0.75);
	border-radius: 5px;
	padding: 12px 16px;
	position: absolute;
	font-family: Roboto;
	font-style: normal;
	font-weight: normal;
	font-size: 13px;
	line-height: 24px;
	white-space: nowrap;
	justify-content: center;
	align-items: center;
	text-transform: uppercase;
}
.h_menu_btn span  {
	display: none;
}
.h_menu_btn_logo:hover {
	background-color: rgba(135, 133, 142, 0.7);
}

/* подсказка к h_holder (скрыть меню полностью) */
#h_holder:hover span {
	display: flex;
	flex-direction:column-reverse;
	top: -50px;
	background-color: rgba(0, 0, 0, 0.75);
	border-radius: 5px;
	padding: 12px 16px;
	position: absolute;
	font-family: Roboto;
	font-style: normal;
	font-weight: normal;
	font-size: 13px;
	line-height: 24px;
	white-space: nowrap;
	justify-content: center;
	align-items: center;
	text-transform: uppercase;
}
#h_holder span  {
	display: none;
}

/* подсказка к h_submenu__holder_up (показать меню полностью) */
#h_submenu__holder_up:hover span {
	display: flex;
	flex-direction:column-reverse;
	top: -50px;
	background-color: rgba(0, 0, 0, 0.5);
	border-radius: 5px;
	padding: 12px 16px;
	position: absolute;
	font-family: Roboto;
	font-style: normal;
	font-weight: normal;
	font-size: 13px;
	line-height: 24px;
	white-space: nowrap;
	justify-content: center;
	align-items: center;
	text-transform: uppercase;
}
#h_submenu__holder_up span  {
	display: none;
}

/*-------------- подсказки к подменю  -----------------*/
  
.h_submenu__buttons:hover span {
	display: flex;
	flex-direction:row;
	top: -50px;
	background-color: rgba(0, 0, 0, 0.75);
	border-radius: 5px;
	padding: 12px 16px;
	position: absolute;
	font-family: Roboto;
	font-style: normal;
	font-weight: normal;
	font-size: 13px;
	line-height: 24px;
	white-space: nowrap;
	justify-content: center;
	align-items: center;
	text-transform: uppercase;
}
.h_submenu__buttons span  {
	display: none;
}  

.h_submenu__buttons_time:hover span {
	display: flex;
	flex-direction:row;
	top: -50px;
	background-color: rgba(0, 0, 0, 0.75);
	border-radius: 5px;
	padding: 12px 16px;
	position: absolute;
	font-family: Roboto;
	font-style: normal;
	font-weight: normal;
	font-size: 13px;
	line-height: 24px;
	white-space: nowrap;
	justify-content: center;
	align-items: center;
	text-transform: uppercase;
}
.h_submenu__buttons_time span  {
	display: none;
}  
/*--------- end подсказка к подменю ------------*/