.main input[type="radio"][id="all"]:checked ~ div nav label.all {
	 color: #fff;
	 letter-spacing: 0.5px;
}
 .main input[type="radio"][id="all"]:checked ~ div nav label.all span {
	 color: #fff;
}
 .main input[type="radio"][id="all"]:checked ~ div nav label.all img {
	 filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(2%) hue-rotate(4deg) brightness(110%) contrast(101%);
}
 .main input[type="radio"][id="all"]:checked ~ div article + [title]:not([title="all"]) {
	 animation: fade-in var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="all"]:checked ~ div article + [title]:not([title="all"]) {
		 display: flex;
	}
}
 .main input[type="radio"][id="about"]:checked ~ div nav label.about {
	 color: #fff;
	 letter-spacing: 0.5px;
}
 .main input[type="radio"][id="about"]:checked ~ div nav label.about span {
	 color: #fff;
}
 .main input[type="radio"][id="about"]:checked ~ div nav label.about img {
	 filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(2%) hue-rotate(4deg) brightness(110%) contrast(101%);
}
 .main input[type="radio"][id="about"]:checked ~ div .filer-bar label.about {
	 display: inline-block;
}
 .main input[type="radio"][id="about"]:checked ~ div .page-main {
	 animation: fade-out-main var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="about"]:checked ~ div .page-main {
		 display: none;
	}
}
 .main input[type="radio"][id="about"]:checked ~ div .page-main article + [title]:not([title="about"]) {
	 animation: fade-out var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="about"]:checked ~ div .page-main article + [title]:not([title="about"]) {
		 display: none;
	}
}
 .main input[type="radio"][id="about"]:checked ~ div .page-about {
	 opacity: 0;
	 display: grid;
	 animation: fade-in-main var(--duration-1) forwards;
	 animation-delay: var(--duration-1);
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="about"]:checked ~ div .page-about {
		 display: flex;
	}
}
 .main input[type="radio"][id="about"]:checked ~ div article + [title="about"] {
	 animation: fade-in var(--duration-1) forwards;
	 animation-delay: var(--duration-1);
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="about"]:checked ~ div article + [title="about"] {
		 display: flex;
	}
}
 .main input[type="radio"][id="ads"]:checked ~ div nav label.ads {
	 color: #fff;
	 letter-spacing: 0.5px;
}
 .main input[type="radio"][id="ads"]:checked ~ div nav label.ads span {
	 color: #fff;
}
 .main input[type="radio"][id="ads"]:checked ~ div nav label.ads img {
	 filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(2%) hue-rotate(4deg) brightness(110%) contrast(101%);
}
 .main input[type="radio"][id="ads"]:checked ~ div .filer-bar label.ads {
	 display: inline-block;
}
 .main input[type="radio"][id="ads"]:checked ~ div article + [title]:not([title~="ads"]) {
	 animation: fade-out var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="ads"]:checked ~ div article + [title]:not([title~="ads"]) {
		 display: none;
	}
}
 .main input[type="radio"][id="ads"]:checked ~ div article + [title~="ads"] {
	 animation: fade-in var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="ads"]:checked ~ div article + [title~="ads"] {
		 display: flex;
	}
}
 .main input[type="radio"][id="social"]:checked ~ div nav label.social {
	 color: #fff;
	 letter-spacing: 0.5px;
}
 .main input[type="radio"][id="social"]:checked ~ div nav label.social span {
	 color: #fff;
}
 .main input[type="radio"][id="social"]:checked ~ div nav label.social img {
	 filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(2%) hue-rotate(4deg) brightness(110%) contrast(101%);
}
 .main input[type="radio"][id="social"]:checked ~ div .filer-bar label.social {
	 display: inline-block;
}
 .main input[type="radio"][id="social"]:checked ~ div article + [title]:not([title~="social"]) {
	 animation: fade-out var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="social"]:checked ~ div article + [title]:not([title~="social"]) {
		 display: none;
	}
}
 .main input[type="radio"][id="social"]:checked ~ div article + [title~="social"] {
	 animation: fade-in var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="social"]:checked ~ div article + [title~="social"] {
		 display: flex;
	}
}
 .main input[type="radio"][id="web"]:checked ~ div nav label.web {
	 color: #fff;
	 letter-spacing: 0.5px;
}
 .main input[type="radio"][id="web"]:checked ~ div nav label.web span {
	 color: #fff;
}
 .main input[type="radio"][id="web"]:checked ~ div nav label.web img {
	 filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(2%) hue-rotate(4deg) brightness(110%) contrast(101%);
}
 .main input[type="radio"][id="web"]:checked ~ div .filer-bar label.web {
	 display: inline-block;
}
 .main input[type="radio"][id="web"]:checked ~ div article + [title]:not([title~="web"]) {
	 animation: fade-out var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="web"]:checked ~ div article + [title]:not([title~="web"]) {
		 display: none;
	}
}
 .main input[type="radio"][id="web"]:checked ~ div article + [title~="web"] {
	 animation: fade-in var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="web"]:checked ~ div article + [title~="web"] {
		 display: flex;
	}
}
 .main input[type="radio"][id="game"]:checked ~ div nav label.game {
	 color: #fff;
	 letter-spacing: 0.5px;
}
 .main input[type="radio"][id="game"]:checked ~ div nav label.game span {
	 color: #fff;
}
 .main input[type="radio"][id="game"]:checked ~ div nav label.game img {
	 filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(2%) hue-rotate(4deg) brightness(110%) contrast(101%);
}
 .main input[type="radio"][id="game"]:checked ~ div .filer-bar label.game {
	 display: inline-block;
}
 .main input[type="radio"][id="game"]:checked ~ div article + [title]:not([title~="game"]) {
	 animation: fade-out var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="game"]:checked ~ div article + [title]:not([title~="game"]) {
		 display: none;
	}
}
 .main input[type="radio"][id="game"]:checked ~ div article + [title~="game"] {
	 animation: fade-in var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="game"]:checked ~ div article + [title~="game"] {
		 display: flex;
	}
}
 .main input[type="radio"][id="video"]:checked ~ div nav label.video {
	 color: #fff;
	 letter-spacing: 0.5px;
}
 .main input[type="radio"][id="video"]:checked ~ div nav label.video span {
	 color: #fff;
}
 .main input[type="radio"][id="video"]:checked ~ div nav label.video img {
	 filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(2%) hue-rotate(4deg) brightness(110%) contrast(101%);
}
 .main input[type="radio"][id="video"]:checked ~ div .filer-bar label.video {
	 display: inline-block;
}
 .main input[type="radio"][id="video"]:checked ~ div article + [title]:not([title~="video"]) {
	 animation: fade-out var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="video"]:checked ~ div article + [title]:not([title~="video"]) {
		 display: none;
	}
}
 .main input[type="radio"][id="video"]:checked ~ div article + [title~="video"] {
	 animation: fade-in var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="video"]:checked ~ div article + [title~="video"] {
		 display: flex;
	}
}
 .main input[type="radio"][id="print"]:checked ~ div nav label.print {
	 color: #fff;
	 letter-spacing: 0.5px;
}
 .main input[type="radio"][id="print"]:checked ~ div nav label.print span {
	 color: #fff;
}
 .main input[type="radio"][id="print"]:checked ~ div nav label.print img {
	 filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(2%) hue-rotate(4deg) brightness(110%) contrast(101%);
}
 .main input[type="radio"][id="print"]:checked ~ div .filer-bar label.print {
	 display: inline-block;
}
 .main input[type="radio"][id="print"]:checked ~ div article + [title]:not([title~="print"]) {
	 animation: fade-out var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="print"]:checked ~ div article + [title]:not([title~="print"]) {
		 display: none;
	}
}
 .main input[type="radio"][id="print"]:checked ~ div article + [title~="print"] {
	 animation: fade-in var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="print"]:checked ~ div article + [title~="print"] {
		 display: flex;
	}
}
 .main input[type="radio"][id="other"]:checked ~ div nav label.other {
	 color: #fff;
	 letter-spacing: 0.5px;
}
 .main input[type="radio"][id="other"]:checked ~ div nav label.other span {
	 color: #fff;
}
 .main input[type="radio"][id="other"]:checked ~ div nav label.other img {
	 filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(2%) hue-rotate(4deg) brightness(110%) contrast(101%);
}
 .main input[type="radio"][id="other"]:checked ~ div .filer-bar label.other {
	 display: inline-block;
}
 .main input[type="radio"][id="other"]:checked ~ div article + [title]:not([title~="other"]) {
	 animation: fade-out var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="other"]:checked ~ div article + [title]:not([title~="other"]) {
		 display: none;
	}
}
 .main input[type="radio"][id="other"]:checked ~ div article + [title~="other"] {
	 animation: fade-in var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="other"]:checked ~ div article + [title~="other"] {
		 display: flex;
	}
}
 .main input[type="radio"][id="campaign"]:checked ~ div nav label.campaign {
	 color: #fff;
	 letter-spacing: 0.5px;
}
 .main input[type="radio"][id="campaign"]:checked ~ div nav label.campaign span {
	 color: #fff;
}
 .main input[type="radio"][id="campaign"]:checked ~ div nav label.campaign img {
	 filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(2%) hue-rotate(4deg) brightness(110%) contrast(101%);
}
 .main input[type="radio"][id="campaign"]:checked ~ div .filer-bar label.campaign {
	 display: inline-block;
}
 .main input[type="radio"][id="campaign"]:checked ~ div article + [title]:not([title~="campaign"]) {
	 animation: fade-out var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="campaign"]:checked ~ div article + [title]:not([title~="campaign"]) {
		 display: none;
	}
}
 .main input[type="radio"][id="campaign"]:checked ~ div article + [title~="campaign"] {
	 animation: fade-in var(--duration-1) forwards;
}
 @media (max-width: 991px) {
	 .main input[type="radio"][id="campaign"]:checked ~ div article + [title~="campaign"] {
		 display: flex;
	}
}
 .main .menu {
	 display: flex;
	 flex: 1;
	 flex-direction: column;
	 position: relative;
	 z-index: 10;
	 top: 0;
	 max-width: 0;
	 opacity: 0;
	 transition: all var(--duration) var(--animate);
	 overflow: clip;
}
 @media (max-width: 991px) {
	 .main .menu {
		 position: fixed;
		 top: 0;
		 left: 0;
		 width: 100%;
		 height: 100%;
		 padding: var(--header_h) 0 0;
		 max-width: inherit;
		 max-height: 0;
		 background: #1d1d1d;
	}
}
 .main .menu .menu-container {
	 position: sticky;
	 top: calc(var(--header_h) + 1rem);
	 background-color: #1d1d1d;
	 padding: var(--padding);
	 height: calc(100vh - var(--header_h) - 2rem);
}
 @media (max-width: 991px) {
	 .main .menu .menu-container {
		 position: relative;
		 height: 100%;
		 top: 0;
		 padding: 0 var(--padding);
	}
}
 .main .menu .menu-container > div {
	 justify-self: end;
	 padding-bottom: 1rem;
}
 @media (max-width: 991px) {
	 .main .menu .menu-container > div {
		 justify-self: center;
	}
}
 .main .menu .menu-container nav label {
	 padding: 1.2rem 0;
	 width: 100%;
	 border-bottom: 1px solid #fff;
	 cursor: pointer;
	 color: #ffffff66;
	 transition: all var(--duration) var(--animate);
}
 @media (max-width: 991px) {
	 .main .menu .menu-container nav label {
		 width: calc(100% - 1rem);
		 padding: 0.75rem 0;
	}
}
 .main .menu .menu-container nav label span {
	 font-size: 1.2em;
	 color: #ffffffaa;
	 transition: all var(--duration) var(--animate);
}
 .main .menu .menu-container nav label:hover {
	 letter-spacing: 0.5px;
}
 .main .menu .menu-container nav label:hover span {
	 color: #ffffffff;
}
 .main .menu.active {
	 max-width: 420px;
	 opacity: 1;
	 margin-left: var(--padding);
}
 @media (max-width: 991px) {
	 .main .menu.active {
		 max-width: inherit;
		 max-height: inherit;
		 margin-left: inherit;
	}
}
 .main .filer-bar {
	 transition: all var(--duration-1) var(--animate);
}
 .main .filer-bar label {
	 display: none;
	 color: #fff;
	 padding: 0.3rem 0.75rem;
	 border: 1px solid var(--vl-dark1);
	 background: var(--vl-dark1);
}
 .main .filer-bar label i {
	 font-size: 0.8em;
}
 .main .filer-bar label:hover {
	 background: var(--vl-color1);
}