/* Menu *************************************/
body{
	--menuBackgroundColor: #FFFFFF;
	--menuBorderColor: #EDEAEA;
	--menuDefaultColor: #C2C2C2;
	--menuActiveColor: #5AAEFC;

	--menuAlertColor: #FFFFFF;
	--menuAlertBackground: #FF0000;

	--ContactsDefaultBackground: #5AAEFC;
	--ContactsDefaultColor: #FFFFFF;
	--ContactsActiveBackground: #4C92D4;
	--ContactsActiveColor: #FFFFFF;
}
#menu{
	display:none;
	position:fixed;
	bottom:0;
	left:0;
	width:100%;
	height:56px;
	z-index: 100;
	background: var(--menuBackgroundColor);
	border-radius: 18px 18px 0 0;
	border-top: 1px solid var(--menuBorderColor);
	transition:all 0.3s ease;
}
#menu ul{
	display:flex;
	justify-content: space-evenly;
	align-items: center;
	height:56px;
}
#menu ul li{
	list-style-type: none;
	min-width:56px;
	width: 100%;
	display:flex;
	align-items:center;
	position:relative;
	cursor: pointer;
}
#menu ul li i {
    margin: auto;
	font-size:1.8em;
	color:  var(--menuDefaultColor);
	transition:all 0.3s ease;
}
#menu ul li div.alert{
	display: flex;
	justify-content: center;
	position: absolute;
	left: 11vw;
	top: 0px;
}
#menu ul li.active i {
	font-size:2.2em;
	color: var(--menuActiveColor);
}
#menu ul li .alert span{
	font-size:0.8em;
	color: var(--menuAlertColor);
	background: var(--menuAlertBackground);
	border-radius: 2em;
	padding: 0 0.1em;
	display:inline-block;
	right:0.4em;
	min-width:1em;
	line-height:1.2em;
	display:none;
}
#menu ul li.itemmenu_people i{
	display:block;
	font-size:1.5em;
	color: var(--ContactsDefaultColor);
	background:  var(--ContactsDefaultBackground);
	border-radius: 50%;
	line-height: 40px;
	width: 40px;
}
#menu ul li.itemmenu_people.active i{
	font-size: 1.8em;
	color: var(--ContactsActiveColor);
	background:  var(--ContactsActiveBackground);
}
#menu ul li > span {
	flex:1;
	text-align: left;
	color: var(--menuDefaultColor);
}
#menu ul li.active > span {
	color: var(--menuActiveColor);
}
#menu img{
	width: 130px;
	margin: auto;
}
@media only screen and (min-width : 1324px){
	#menu{
		top:0;
		left: calc( 20px + 2% );
		width:250px;
		height: fit-content;
		margin-top:5vh;
		padding:20px;
		border-radius: 18px;
	}
	#menu ul{
		flex-direction:column;
		height:auto;
		align-items: flex-start;
	}
	#menu ul li{
		height:60px;
	}
	#menu ul li i{
		width: 40px;
		margin: 0 20px;
	}
	#menu ul li .alert span{
		position:relative;
		font-size:1em;
	}
	#menu ul li div.alert{
		position:initial;
	}
}
