.active.photos {
  mask-image: url("https://cdn.swee.codes/icons/photos-active.svg");
}
.photos {
  mask-image: url("https://cdn.swee.codes/icons/photos.svg");
}
.active.art {
  mask-image: url("https://cdn.swee.codes/icons/art-active.svg");
}
.art {
  mask-image: url("https://cdn.swee.codes/icons/art.svg");
}
.active.services {
  mask-image: url("https://cdn.swee.codes/icons/services-active.svg");
}
.services {
  mask-image: url("https://cdn.swee.codes/icons/services.svg");
}
.active.misc {
  mask-image: url("https://cdn.swee.codes/icons/misc-active.svg");
}
.misc {
  mask-image: url("https://cdn.swee.codes/icons/misc.svg");
}
.active.videos {
  mask-image: url("https://cdn.swee.codes/icons/videos-active.svg");
}
.videos {
  mask-image: url("https://cdn.swee.codes/icons/videos.svg");
}
.active.links {
  mask-image: url("https://cdn.swee.codes/icons/links-active.svg");
}
.links {
  mask-image: url("https://cdn.swee.codes/icons/links.svg");
}
.active.apps {
  mask-image: url("https://cdn.swee.codes/icons/apps-active.svg");
}
.apps {
  mask-image: url("https://cdn.swee.codes/icons/apps.svg");
}
.active.home {
  mask-image: url("https://cdn.swee.codes/icons/home-active.svg");
}
.home {
  mask-image: url("https://cdn.swee.codes/icons/home.svg");
}
.navicon.active {
  background-color: #2854c5;
}
.navicon {
  background-color: #d9d9d9;
  width: 40px;
  height: 40px;
  display: inline-block;
  mask-size: cover;
}