.footnav {
	z-index: 999;
	/*background: #fff;*/
	background: #FAFAFA;
	position: fixed;
	bottom: 0;
	width: 100%;
	text-align: center;
	overflow: hidden;
	padding-top: 5px;
	/*box-shadow: 0px -1px 1px #EDEDED;*/
}

.footnav .mui-col-xs-3 {
	text-align: center;
	float: left;
}

.footnav .mui-col-xs-3 p {
	margin-bottom: 0;
	font-size: 10px;
	color: #999;
}

.footnav .mui-col-xs-3.active p {
	color: #CC9E68;
}

.footnav .navicon {
	width: 17px;
	height: 17px;
	margin: 0 auto;
	margin-top: 2px;
	display: block;
}

.footnav .navicon.nav1 {
	background: url(../images/nav1-off@2x.png);
	background-size: cover;
}

.footnav .navicon.nav2 {
	background: url(../images/nav2-off@2x.png);
	background-size: cover;
}

.footnav .navicon.nav3 {
	background: url(../images/nav3-off@2x.png);
	background-size: cover;
}

.footnav .navicon.nav4 {
	background: url(../images/nav4-off@2x.png);
	background-size: cover;
}

.footnav .mui-col-xs-3.active .nav1 {
	background: url(../images/nav1-on@2x.png);
	background-size: cover;
}

.footnav .mui-col-xs-3.active .nav2 {
	background: url(../images/nav2-on@2x.png);
	background-size: cover;
}

.footnav .mui-col-xs-3.active .nav3 {
	background: url(../images/nav3-on@2x.png);
	background-size: cover;
}

.footnav .mui-col-xs-3.active .nav4 {
	background: url(../images/nav4-on@2x.png);
	background-size: cover;
}