.main-nav {
  padding: 20px;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 2;
}

.main-nav__list {
  list-style-type: none;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.main-nav__list__item {
  display: inline-block;
  vertical-align: middle;
}

.main-nav__list__item > i {
  font-size: 20px;
}

.main-nav__list__item__logo {
  height: 22px;
}

.side-nav-wrapper {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 2;
  opacity: 1;
  transition: all .25s;
  overflow: hidden;
}

.side-nav-wrapper.ng-hide {
  transition: all .25s;
  opacity: 0;
}

.side-nav-wrapper .side-nav {
  position: relative;
  left: 0;
  transition: all .25s;
  overflow-y: scroll;
}

.side-nav-wrapper.ng-hide .side-nav {
  position: relative;
  left: -100%;
  transition: all .25s;
}

.side-nav {
  background: #111111;
  width: 100px;
  height: 100%;
  position: relative;
  z-index: 2;
}

.side-nav__overlay {
  position: absolute;
  height: 100%;
  width: 100%;
  z-index: 1;
  background-color: rgba(0,0,0, 0.25);
  top: 0;
  left: 0;
}

.side-nav__list {
  text-align: center;
  padding: 0;
  margin: 0;
  list-style-type: none;
}

.side-nav__list__item {
  padding: 15px 0;
  font-size: 13px;
  color: #999999;
  font-weight: 700;
  position: relative;
}

.side-nav__list__item.active {
  background-color: #171717;
  color: #ffcc00;
}

.main-nav.scrolled {
  background-color: #111111 !important;
  transition: background-color .5s linear;
}

.side-nav__list__item:hover, .side-nav__list__item:focus {
  color: #ffc527;
  background-color: #1d1d1d;
}

.wrapper.stopScroll {
  overflow: hidden;
  height: 100%;
  width: 100%;
}
.icon{
  display: block;
  margin: 0 auto;
  height:30px;
  width: 30px;
}
/*hover*/
.icon.icon-deposit:hover,.icon.icon-deposit:focus{
  background:url("/mobile/common/images/side-nav/deposit-icon-hover.svg")center center no-repeat ;
}
.icon.icon-withdraw:hover,.icon.icon-withdraw:focus{
  background:url("/mobile/common/images/side-nav/withdraw-icon-hover.svg")center center no-repeat ;
}
.icon.icon-transfer:hover,.icon.icon-transfer:focus{
  background:url("/mobile/common/images/side-nav/money-transfer-icon-hover.svg")center center no-repeat ;
}
.icon.icon-message:hover,.icon.icon-message:focus{
  background:url("/mobile/common/images/side-nav/dm-icon-hover.svg")center center no-repeat ;
}
.icon.icon-notice:hover,.icon.icon-notice:focus{
  background:url("/mobile/common/images/side-nav/notice-icon-hover.svg")center center no-repeat ;
}
.icon.icon-promotion:hover,.icon.icon-promotion:focus{
  background:url("/mobile/common/images/side-nav/promo-icon-hover.svg")center center no-repeat ;
}
.icon.icon-customer:hover,.icon.icon-customer:focus{
  background:url("/mobile/common/images/side-nav/customer-icon-hover.svg")center center no-repeat ;
}
.icon.icon-liveshow:hover,.icon.icon-liveshow:focus{
  background:url("/mobile/common/images/side-nav/live-chat-icon-hover.svg")center center no-repeat ;
}
.icon.icon-pc:hover,.icon.icon-pc:focus{
  background:url("/mobile/common/images/side-nav/desktop-icon-hover.svg")center center no-repeat ;
}
.icon.icon-logout:hover,.icon.icon-logout:focus{
  background:url("/mobile/common/images/side-nav/logout-icon-hover.svg")center center no-repeat ;
}


.icon.icon-deposit{
  background:url("/mobile/common/images/side-nav/deposit-icon.svg")center center no-repeat ;
}
.icon.icon-withdraw{
  background:url("/mobile/common/images/side-nav/withdraw-icon.svg")center center no-repeat ;
}
.icon.icon-transfer{
  background:url("/mobile/common/images/side-nav/money-transfer-icon.svg")center center no-repeat ;
}
.icon.icon-message{
  background:url("/mobile/common/images/side-nav/dm-icon.svg")center center no-repeat ;
}
.icon.icon-notice{
  background:url("/mobile/common/images/side-nav/notice-icon.svg")center center no-repeat ;
}
.icon.icon-promotion{
  background:url("/mobile/common/images/side-nav/promo-icon.svg")center center no-repeat ;
}
.icon.icon-customer{
  background:url("/mobile/common/images/side-nav/customer-icon.svg")center center no-repeat ;
}
.icon.icon-liveshow{
  background:url("/mobile/common/images/side-nav/live-chat-icon.svg")center center no-repeat ;
}
.icon.icon-pc{
  background:url("/mobile/common/images/side-nav/desktop-icon.svg")center center no-repeat ;
}
.icon.icon-logout{
  background:url("/mobile/common/images/side-nav/logout-icon.svg")center center no-repeat ;
}
.side-nav__list__item .badge{
  position: absolute!important;
}