/* --- FONT IMPORTS --- */
@import url(https://fonts.googleapis.com/css2?family=Delius+Unicase:wght@400;700&family=Jost:ital,wght@0,100..900;1,100..900&family=Major+Mono+Display&family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap);

@keyframes slideIn {
	from {
		transform: translateY(-100%);
		opacity: 0;
	}
	to {
		transform: translateY(0);
		opacity: 1;
	}
}

@keyframes slideDown {
	from {
		transform: translateY(-10px);
		opacity: 0.6;
	}
	to {
		transform: translateY(0);
		opacity: 1;
	}
}

@keyframes slideUp {
	from {
		transform: translateY(0);
		opacity: 1;
	}
	to {
		transform: translateY(0px);
		opacity: .8;
	}
}

@keyframes fadeIn {
	from {
		opacity: 0;
		transform: translateY(10px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes hueShift {
	from {
		filter: hue-rotate(0deg);
	}
	to {
		filter: hue-rotate(25deg);
	}
}

@keyframes hueReset {
	from {
		filter: hue-rotate(25deg);
	}
	to {
		filter: hue-rotate(0deg);
	}
}

@keyframes easeOut {
	from {
		opacity: 1;
	}
	to {
		opacity: 1;
	}
}

@keyframes fadeIn {
	from {
		opacity: 0;
		transform: translateY(10px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes fadeSlideIn {
	from {
		opacity: 0;
		transform: translateY(30px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes fadeSlideOut {
	from {
		opacity: 1;
		transform: translateY(0);
	}
	to {
		opacity: 0;
		transform: translateY(30px);
	}
}

@keyframes fadeInOnce {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes BgMovement {
  0% {
    background-size: 100%;
    background-position: 50% 50%;
  }
  10% {
    opacity: 1;
  }
  50% {
    background-size: 150%;
    background-position: 0% 0%;
  }
  100% {
    background-size: 150%;
    background-position: 70% 70%;
    opacity: 1;
  }
}

/* --- SCROLLBAR --- */ 

::-webkit-scrollbar-track {
  background: var(--darkeroverlay);
}

::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-thumb {
  background: var(--darkeroverlay);
  border: var(--border);
  background-clip: content-box;
}

/* --- DATA TITLES ---*/
[data-title] {
  position: relative;
  transition: all 0.5s;     
}

[data-title]:hover::after {
  content: attr(data-title);
  z-index: 5;
  position: absolute;
  background: #000;
  color: #ddd;
  font-size: 10px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-shadow: none;
  padding: 4px 8px;
  white-space: nowrap;
  top: 100%;
  left: 0;
  z-index: 1000;
  margin-top: 4px;
  transition: all 0.5s;
}

/* --- FRAME MASK --- */
.box {
	flex-grow: 1;
	backdrop-filter: blur(10px);
	z-index: 1;
	position: relative;
	overflow: hidden;
	background: var(--darkeroverlay);
	margin: 5px;
}

.content {
	z-index: 3;
	position: relative;
	width: auto;
	height: auto;
	padding: 3em 2em;
	overflow: hidden;
}

.frame-mask {
	z-index: 2;
	position: absolute;
	top: 0;
	left: 0;
	transform: scale(3.3, 1.4);
	background: var(--blurredbg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: cover;
	background-attachment: scroll;
	width: 100%;
	height: 100%;
	mask-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48Y2lyY2xlIGN4PSI1MCIgY3k9IjUwIiByPSI0MCIgZmlsbD0id2hpdGUiLz48L3N2Zz4=)url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDE2OC43MSAzMDUuNjciPgogIDxkZWZzPgogICAgPHN0eWxlPgogICAgICAuY2xzLTEgewogICAgICAgIGZpbGw6ICMwMDA7CiAgICAgICAgc3Ryb2tlLXdpZHRoOiAwcHg7CiAgICAgIH0KICAgIDwvc3R5bGU+CiAgPC9kZWZzPgogIDxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTE2Ny41LDYyLjVjLTIuMjIsMC00LjM2LS41LTYuMzktMS40M2guNTl2LTI0Ljg3aC0xNi4wNHYuNzJjLS41MS0yLjcxLS44Mi01LjU2LS45MS04LjUsMC0uMSwwLS4xOSwwLS4yOWwtLjAyLTEuMTFoLTQzLjc3TDgzLjUuOTFsLTE3LjQ2LDI2LjEySDI0LjA5di44N2MuMDEsMi41MS0uMiw1LjAxLS42Miw3LjQ0SDcuNzd2MjMuOTVjLS44Ny40MS0xLjc1LjczLTIuNjQuOTd2LTI4LjAxaDE4LjY1di0uODdINC41NXYyOS4wM2MtMS4wNy4yNS0yLjE1LjM4LTMuMjIuMzhsLS44My0uMDJ2MTgxLjFoLjU4YzEuMTguMDEsMi4zNC4xNywzLjQ3LjQ1djI4LjU2aDE4Ljc3Yy4yLDEuNjUuMzMsMy4zNC4zOCw1LjA3LDAsLjMsMCwuNi4wMS45djEuMDZoNDEuODVsMTcuOTQsMjYuODQsMTcuOTQtMjYuODRoNDMuNzFsLS4wMy0uOTFjLS4wNS0xLjc2LjAxLTMuNTIuMTctNS4yNmgxOS42MnYtMjguNGMuOTEtLjIsMS44Mi0uMzIsMi43Mi0uMzRoLjU3VjYyLjQ5bC0uNzEuMDJaTTE2MC41NCwzNy45NHYyMi44NmMtNi45Mi0zLjQ3LTEyLjQtMTEuOTgtMTQuNjgtMjIuODZoMTQuNjhaTTgzLjUsMy4zNmwxNS44MiwyMy42NywxLjE2LDEuNzMsNC4zNSw2LjVoLTkuNmwtNC4zNS02LjUtMS4xNi0xLjczLTYuMjItOS4zMS02LjIyLDkuMzEtMS4xNiwxLjczLTQuMzUsNi41aC05LjZsNC4zNS02LjUsMS4xNi0xLjczLDE1LjgyLTIzLjY3Wk0xMDYuNjYsMjY4LjgybC00LjM1LTYuNWgzMy43NGwuMTMtLjZjMS40OC02LjcsMy45NS0xMi44Miw3LjM0LTE4LjE5LDMuODQtNi4wOCw4LjY0LTEwLjczLDEzLjg3LTEzLjQ0bC4zOS0uMlY3NS44OWwtLjQtLjE5Yy0xMC4wMy00LjktMTguMDItMTcuMDMtMjEuMzUtMzIuNDZsLS4xMy0uNmgtMzMuMWw0LjMtNi40My0uMDUtLjA4aDMyLjIyYzIuNDIsMTcuNzksMTEuMzYsMzEuMzYsMjIuODYsMzQuN3YxNjQuMDFjLTUuNzgsMS44Ni0xMS4yNSw2LjUyLTE1LjQ0LDEzLjE2LTMuNzksNi4wMS02LjI5LDEzLjItNy4yNCwyMC44MmgtMzIuNzhaTTk1LjQzLDI2OC44MmwtNC4zNS02LjUtMS4xNi0xLjczLTYuNDItOS42MS02LjQyLDkuNjEtMS4xNiwxLjczLTQuMzUsNi41aC05LjZsNC4zNS02LjUsMS4xNi0xLjczLDE2LjAyLTIzLjk3LDE2LjAyLDIzLjk3LDEuMTYsMS43Myw0LjM1LDYuNWgtOS42Wk04OC41NiwyNzcuOTJsLTUuMDYsNy41Ny01LjA2LTcuNTctMS4xNi0xLjczLTQuMzUtNi41LS4xNS0uMjIuNDMtLjY0LDQuMzUtNi41LDEuMTYtMS43Myw0Ljc4LTcuMTYsNC43OCw3LjE2LDEuMTYsMS43Myw0LjM1LDYuNS40My42NC0uMTUuMjItNC4zNSw2LjUtMS4xNiwxLjczWk0yOS4yNiwyNjguODJjLTIuMjYtMTcuNjItMTEuMzMtMzEuNy0yMi42Ny0zNS4xOVY2OS4xM2M1LjctMS42OSwxMS4xNi02LjExLDE1LjM5LTEyLjQ3LDMuODktNS44Niw2LjUyLTEyLjk1LDcuNjItMjAuNTJoMzAuMzVsLS4wNS4wOCw0LjMsNi40M2gtMzEuMzFsLS4xNC41N2MtMS42LDYuNjktNC4xOSwxMi43Ni03LjcsMTguMDMtMy44NSw1Ljc5LTguNiwxMC4xOS0xMy43MywxMi43M2wtLjQuMnYxNTQuNDdsLjM5LjJjMTAsNS4xMSwxNy45MiwxNy40LDIxLjIsMzIuODdsLjEzLjZoMzIuMDJsLTQuMzUsNi41aC0zMS4wOFpNMTU2LjYyLDIxMi4yOWgwcy0zMi4zNyw0OC4yOS0zMi4zNyw0OC4yOWgtMi42NmwzNS4wNC01Mi4yOHYzLjk5Wk0xNTYuNjIsMjEzLjV2MTUuMTZjLTUuMjUsMi44My0xMC4wNyw3LjU1LTEzLjk0LDEzLjY5LTMuNDEsNS40LTUuOTIsMTEuNTMtNy40NiwxOC4yNGgtMTAuMTVsMzEuNTUtNDcuMDhaTTE1Ni42Miw5MS42bC0zMS42Ni00Ny4yNGgxMC4wOWMzLjQ4LDE1LjQ3LDExLjUsMjcuNjUsMjEuNTYsMzIuNzh2MTQuNDZaTTEyNC4xNCw0NC4zN2wzMi40OCw0OC40NWgwczAsMy45OCwwLDMuOThsLTM1LjE1LTUyLjQ0aDIuNjZaTTEyMC42NSw0NC4zN2wzNS45Niw1My42NmgwczAsMTA5LjA2LDAsMTA5LjA2aDBzLTM1Ljg2LDUzLjQ5LTM1Ljg2LDUzLjQ5aC0xOS42bC0xNy42Ni0yNi40Mi0xNy42NiwyNi40MmgtMTguMjZsLTM1LjQ4LTUyLjk0di0xMTAuMTdsMzUuNTktNTMuMWgxNy42OGwxOC4xNCwyNy4xNCwxOC4xNC0yNy4xNGgxOS4wMlpNMTIuMDksOTIuMjZsMzIuMS00Ny45aDIuNjdMMTIuMDksOTYuMjR2LTMuOThaTTEyLjA5LDkxLjA0di0xNS42MmM1LjE1LTIuNjUsOS45MS03LjEyLDEzLjc5LTEyLjk1LDMuNTMtNS4zMSw2LjE2LTExLjM5LDcuODItMTguMDloOS42NmwtMzEuMjgsNDYuNjdaTTEyLjA5LDIxNC4wN2wzMS4xNyw0Ni41MWgtOS43NmMtMy40Mi0xNS41LTExLjM4LTI3Ljg0LTIxLjQxLTMzLjE4di0xMy4zNFpNNDQuMDksMjYwLjU4bC0zMi00Ny43NHYtMy45OGwzNC42Niw1MS43MmgtMi42N1pNMTA1LjQ1LDM2LjIxbC00LjMsNi40My0xLjE2LDEuNzMtMTYuNSwyNC42OC0xNi41LTI0LjY4LTEuMTYtMS43My00LjMtNi40My4wNS0uMDhoOS42bC0uMDUuMDgsNC4zLDYuNDMsMS4xNiwxLjczLDYuOSwxMC4zMyw2LjktMTAuMzMsMS4xNi0xLjczLDQuMy02LjQzLS4wNS0uMDhoOS42bC4wNS4wOFpNNzMuNDEsMzUuMjZsNC4zNS02LjUsMS4xNi0xLjczLDQuNTgtNi44Niw0LjU4LDYuODYsMS4xNiwxLjczLDQuMzUsNi41LjU4Ljg3LjA1LjA4LTQuMyw2LjQzLTEuMTYsMS43My01LjI2LDcuODctNS4yNi03Ljg3LTEuMTYtMS43My00LjMtNi40My4wNS0uMDguNTgtLjg3Wk04LjkzLDM3LjA3aDE0LjJjLTEuMDQsNC43OC0yLjg5LDkuMjgtNS40NywxMy4xNi0yLjUyLDMuOC01LjUzLDYuNjgtOC43Myw4LjQ3di0yMS42M1pNNS4xMywyNzAuMDN2LTI3LjUzYy43LjIsMS4zOS40NiwyLjA2Ljc2djIyLjgyaDE1LjMyYy4yOCwxLjI4LjUxLDIuNi43LDMuOTVINS4xM1pNOC4zNSwyNDMuODJjNi4yNiwzLjM3LDExLjI5LDEwLjg5LDEzLjc1LDIwLjUyaC0xMy43NXYtMjAuNTJaTTI0Ljg3LDI3Ni4xOWMwLS4xLDAtLjIsMC0uMzEtLjEtMy40MS0uNS02LjctMS4xNC05LjgxaC4wOXYtMS43M2gtLjQ4Yy0zLjM1LTEzLjg2LTExLjc4LTIzLjczLTIxLjY3LTI0LjE4VjYyLjUzYzYuMTItLjE0LDEyLjIzLTQuMTYsMTYuODItMTEuMDcsNC4yNS02LjQsNi42NC0xNC40Myw2Ljc2LTIyLjdoMzkuNjNsLTQuMzUsNi41aC0zMS40bC0uMDUuMzVjLTEuMDUsNy41NC0zLjY0LDE0LjYxLTcuNTEsMjAuNDMtNC4yMSw2LjMzLTkuNjUsMTAuNy0xNS4zMiwxMi4zbC0uMjQuMDd2MTY1Ljk0bC4yMy4wN2MxMS4zLDMuMzIsMjAuMzQsMTcuMzUsMjIuNDksMzQuOTJsLjA0LjM2aDMxLjI4bDQuMzUsNi41SDI0Ljg3Wk04My41LDMwMi4zMWwtMTYuMy0yNC4zOC0xLjE2LTEuNzMtNC4zNS02LjVoOS42bDQuMzUsNi41LDEuMTYsMS43Myw2LjcsMTAuMDMsNi43LTEwLjAzLDEuMTYtMS43Myw0LjM1LTYuNWg5LjZsLTQuMzUsNi41LTEuMTYsMS43My0xNi4zLDI0LjM4Wk0xNjQuMzQsMjcwLjg5aC0xOC45NmMuMTUtMS4zMy4zNy0yLjY1LjY1LTMuOTVoMTYuMjV2LTIyLjc1Yy42OC0uMjgsMS4zNy0uNTIsMi4wNi0uN3YyNy40Wk0xNDYuNDMsMjY1LjIxYzEuMDEtMy45MywyLjU4LTcuNjUsNC42Ny0xMC45NiwyLjc4LTQuNCw2LjI5LTcuNjksMTAuMDEtOS41NHYyMC41aC0xNC42OVpNMTY3LjA1LDI0MS4zMWMtNi4xOS4zNS0xMi4yOCw0LjYtMTYuNzksMTEuNzUtNC4xNyw2LjYtNi40LDE0Ljc4LTYuMzIsMjMuMTNoLTQxLjM1bDQuMzUtNi41aDMyLjk5bC4wNC0uMzZjLjg5LTcuNTksMy4zNi0xNC43Niw3LjEzLTIwLjczLDQuMTYtNi41OSw5LjYyLTExLjIsMTUuMzctMTIuOThsLjIzLS4wN1Y3MC4xMmwtLjI0LS4wN2MtMTEuNDUtMy4xOC0yMC4zNi0xNi43LTIyLjY4LTM0LjQ0bC0uMDUtLjM1aC0zMy4yOGwtNC4zNS02LjVoNDEuNDhjLjY3LDE5LjY4LDEwLjkxLDM1LjExLDIzLjQ2LDM1LjQ3djE3Ny4wOFoiLz4KICA8cG9seWdvbiBjbGFzcz0iY2xzLTEiIHBvaW50cz0iMTY0LjM0IDYxLjg5IDE2NC45MiA2MS44OSAxNjQuOTIgMzIuMjYgMTQ1LjY5IDMyLjI2IDE0NS42OSAzMy4xMiAxNjQuMzQgMzMuMTIgMTY0LjM0IDYxLjg5Ii8+Cjwvc3ZnPg==);
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	-webkit-mask-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDE2OC43MSAzMDUuNjciPgogIDxkZWZzPgogICAgPHN0eWxlPgogICAgICAuY2xzLTEgewogICAgICAgIGZpbGw6ICMwMDA7CiAgICAgICAgc3Ryb2tlLXdpZHRoOiAwcHg7CiAgICAgIH0KICAgIDwvc3R5bGU+CiAgPC9kZWZzPgogIDxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTE2Ny41LDYyLjVjLTIuMjIsMC00LjM2LS41LTYuMzktMS40M2guNTl2LTI0Ljg3aC0xNi4wNHYuNzJjLS41MS0yLjcxLS44Mi01LjU2LS45MS04LjUsMC0uMSwwLS4xOSwwLS4yOWwtLjAyLTEuMTFoLTQzLjc3TDgzLjUuOTFsLTE3LjQ2LDI2LjEySDI0LjA5di44N2MuMDEsMi41MS0uMiw1LjAxLS42Miw3LjQ0SDcuNzd2MjMuOTVjLS44Ny40MS0xLjc1LjczLTIuNjQuOTd2LTI4LjAxaDE4LjY1di0uODdINC41NXYyOS4wM2MtMS4wNy4yNS0yLjE1LjM4LTMuMjIuMzhsLS44My0uMDJ2MTgxLjFoLjU4YzEuMTguMDEsMi4zNC4xNywzLjQ3LjQ1djI4LjU2aDE4Ljc3Yy4yLDEuNjUuMzMsMy4zNC4zOCw1LjA3LDAsLjMsMCwuNi4wMS45djEuMDZoNDEuODVsMTcuOTQsMjYuODQsMTcuOTQtMjYuODRoNDMuNzFsLS4wMy0uOTFjLS4wNS0xLjc2LjAxLTMuNTIuMTctNS4yNmgxOS42MnYtMjguNGMuOTEtLjIsMS44Mi0uMzIsMi43Mi0uMzRoLjU3VjYyLjQ5bC0uNzEuMDJaTTE2MC41NCwzNy45NHYyMi44NmMtNi45Mi0zLjQ3LTEyLjQtMTEuOTgtMTQuNjgtMjIuODZoMTQuNjhaTTgzLjUsMy4zNmwxNS44MiwyMy42NywxLjE2LDEuNzMsNC4zNSw2LjVoLTkuNmwtNC4zNS02LjUtMS4xNi0xLjczLTYuMjItOS4zMS02LjIyLDkuMzEtMS4xNiwxLjczLTQuMzUsNi41aC05LjZsNC4zNS02LjUsMS4xNi0xLjczLDE1LjgyLTIzLjY3Wk0xMDYuNjYsMjY4LjgybC00LjM1LTYuNWgzMy43NGwuMTMtLjZjMS40OC02LjcsMy45NS0xMi44Miw3LjM0LTE4LjE5LDMuODQtNi4wOCw4LjY0LTEwLjczLDEzLjg3LTEzLjQ0bC4zOS0uMlY3NS44OWwtLjQtLjE5Yy0xMC4wMy00LjktMTguMDItMTcuMDMtMjEuMzUtMzIuNDZsLS4xMy0uNmgtMzMuMWw0LjMtNi40My0uMDUtLjA4aDMyLjIyYzIuNDIsMTcuNzksMTEuMzYsMzEuMzYsMjIuODYsMzQuN3YxNjQuMDFjLTUuNzgsMS44Ni0xMS4yNSw2LjUyLTE1LjQ0LDEzLjE2LTMuNzksNi4wMS02LjI5LDEzLjItNy4yNCwyMC44MmgtMzIuNzhaTTk1LjQzLDI2OC44MmwtNC4zNS02LjUtMS4xNi0xLjczLTYuNDItOS42MS02LjQyLDkuNjEtMS4xNiwxLjczLTQuMzUsNi41aC05LjZsNC4zNS02LjUsMS4xNi0xLjczLDE2LjAyLTIzLjk3LDE2LjAyLDIzLjk3LDEuMTYsMS43Myw0LjM1LDYuNWgtOS42Wk04OC41NiwyNzcuOTJsLTUuMDYsNy41Ny01LjA2LTcuNTctMS4xNi0xLjczLTQuMzUtNi41LS4xNS0uMjIuNDMtLjY0LDQuMzUtNi41LDEuMTYtMS43Myw0Ljc4LTcuMTYsNC43OCw3LjE2LDEuMTYsMS43Myw0LjM1LDYuNS40My42NC0uMTUuMjItNC4zNSw2LjUtMS4xNiwxLjczWk0yOS4yNiwyNjguODJjLTIuMjYtMTcuNjItMTEuMzMtMzEuNy0yMi42Ny0zNS4xOVY2OS4xM2M1LjctMS42OSwxMS4xNi02LjExLDE1LjM5LTEyLjQ3LDMuODktNS44Niw2LjUyLTEyLjk1LDcuNjItMjAuNTJoMzAuMzVsLS4wNS4wOCw0LjMsNi40M2gtMzEuMzFsLS4xNC41N2MtMS42LDYuNjktNC4xOSwxMi43Ni03LjcsMTguMDMtMy44NSw1Ljc5LTguNiwxMC4xOS0xMy43MywxMi43M2wtLjQuMnYxNTQuNDdsLjM5LjJjMTAsNS4xMSwxNy45MiwxNy40LDIxLjIsMzIuODdsLjEzLjZoMzIuMDJsLTQuMzUsNi41aC0zMS4wOFpNMTU2LjYyLDIxMi4yOWgwcy0zMi4zNyw0OC4yOS0zMi4zNyw0OC4yOWgtMi42NmwzNS4wNC01Mi4yOHYzLjk5Wk0xNTYuNjIsMjEzLjV2MTUuMTZjLTUuMjUsMi44My0xMC4wNyw3LjU1LTEzLjk0LDEzLjY5LTMuNDEsNS40LTUuOTIsMTEuNTMtNy40NiwxOC4yNGgtMTAuMTVsMzEuNTUtNDcuMDhaTTE1Ni42Miw5MS42bC0zMS42Ni00Ny4yNGgxMC4wOWMzLjQ4LDE1LjQ3LDExLjUsMjcuNjUsMjEuNTYsMzIuNzh2MTQuNDZaTTEyNC4xNCw0NC4zN2wzMi40OCw0OC40NWgwczAsMy45OCwwLDMuOThsLTM1LjE1LTUyLjQ0aDIuNjZaTTEyMC42NSw0NC4zN2wzNS45Niw1My42NmgwczAsMTA5LjA2LDAsMTA5LjA2aDBzLTM1Ljg2LDUzLjQ5LTM1Ljg2LDUzLjQ5aC0xOS42bC0xNy42Ni0yNi40Mi0xNy42NiwyNi40MmgtMTguMjZsLTM1LjQ4LTUyLjk0di0xMTAuMTdsMzUuNTktNTMuMWgxNy42OGwxOC4xNCwyNy4xNCwxOC4xNC0yNy4xNGgxOS4wMlpNMTIuMDksOTIuMjZsMzIuMS00Ny45aDIuNjdMMTIuMDksOTYuMjR2LTMuOThaTTEyLjA5LDkxLjA0di0xNS42MmM1LjE1LTIuNjUsOS45MS03LjEyLDEzLjc5LTEyLjk1LDMuNTMtNS4zMSw2LjE2LTExLjM5LDcuODItMTguMDloOS42NmwtMzEuMjgsNDYuNjdaTTEyLjA5LDIxNC4wN2wzMS4xNyw0Ni41MWgtOS43NmMtMy40Mi0xNS41LTExLjM4LTI3Ljg0LTIxLjQxLTMzLjE4di0xMy4zNFpNNDQuMDksMjYwLjU4bC0zMi00Ny43NHYtMy45OGwzNC42Niw1MS43MmgtMi42N1pNMTA1LjQ1LDM2LjIxbC00LjMsNi40My0xLjE2LDEuNzMtMTYuNSwyNC42OC0xNi41LTI0LjY4LTEuMTYtMS43My00LjMtNi40My4wNS0uMDhoOS42bC0uMDUuMDgsNC4zLDYuNDMsMS4xNiwxLjczLDYuOSwxMC4zMyw2LjktMTAuMzMsMS4xNi0xLjczLDQuMy02LjQzLS4wNS0uMDhoOS42bC4wNS4wOFpNNzMuNDEsMzUuMjZsNC4zNS02LjUsMS4xNi0xLjczLDQuNTgtNi44Niw0LjU4LDYuODYsMS4xNiwxLjczLDQuMzUsNi41LjU4Ljg3LjA1LjA4LTQuMyw2LjQzLTEuMTYsMS43My01LjI2LDcuODctNS4yNi03Ljg3LTEuMTYtMS43My00LjMtNi40My4wNS0uMDguNTgtLjg3Wk04LjkzLDM3LjA3aDE0LjJjLTEuMDQsNC43OC0yLjg5LDkuMjgtNS40NywxMy4xNi0yLjUyLDMuOC01LjUzLDYuNjgtOC43Myw4LjQ3di0yMS42M1pNNS4xMywyNzAuMDN2LTI3LjUzYy43LjIsMS4zOS40NiwyLjA2Ljc2djIyLjgyaDE1LjMyYy4yOCwxLjI4LjUxLDIuNi43LDMuOTVINS4xM1pNOC4zNSwyNDMuODJjNi4yNiwzLjM3LDExLjI5LDEwLjg5LDEzLjc1LDIwLjUyaC0xMy43NXYtMjAuNTJaTTI0Ljg3LDI3Ni4xOWMwLS4xLDAtLjIsMC0uMzEtLjEtMy40MS0uNS02LjctMS4xNC05LjgxaC4wOXYtMS43M2gtLjQ4Yy0zLjM1LTEzLjg2LTExLjc4LTIzLjczLTIxLjY3LTI0LjE4VjYyLjUzYzYuMTItLjE0LDEyLjIzLTQuMTYsMTYuODItMTEuMDcsNC4yNS02LjQsNi42NC0xNC40Myw2Ljc2LTIyLjdoMzkuNjNsLTQuMzUsNi41aC0zMS40bC0uMDUuMzVjLTEuMDUsNy41NC0zLjY0LDE0LjYxLTcuNTEsMjAuNDMtNC4yMSw2LjMzLTkuNjUsMTAuNy0xNS4zMiwxMi4zbC0uMjQuMDd2MTY1Ljk0bC4yMy4wN2MxMS4zLDMuMzIsMjAuMzQsMTcuMzUsMjIuNDksMzQuOTJsLjA0LjM2aDMxLjI4bDQuMzUsNi41SDI0Ljg3Wk04My41LDMwMi4zMWwtMTYuMy0yNC4zOC0xLjE2LTEuNzMtNC4zNS02LjVoOS42bDQuMzUsNi41LDEuMTYsMS43Myw2LjcsMTAuMDMsNi43LTEwLjAzLDEuMTYtMS43Myw0LjM1LTYuNWg5LjZsLTQuMzUsNi41LTEuMTYsMS43My0xNi4zLDI0LjM4Wk0xNjQuMzQsMjcwLjg5aC0xOC45NmMuMTUtMS4zMy4zNy0yLjY1LjY1LTMuOTVoMTYuMjV2LTIyLjc1Yy42OC0uMjgsMS4zNy0uNTIsMi4wNi0uN3YyNy40Wk0xNDYuNDMsMjY1LjIxYzEuMDEtMy45MywyLjU4LTcuNjUsNC42Ny0xMC45NiwyLjc4LTQuNCw2LjI5LTcuNjksMTAuMDEtOS41NHYyMC41aC0xNC42OVpNMTY3LjA1LDI0MS4zMWMtNi4xOS4zNS0xMi4yOCw0LjYtMTYuNzksMTEuNzUtNC4xNyw2LjYtNi40LDE0Ljc4LTYuMzIsMjMuMTNoLTQxLjM1bDQuMzUtNi41aDMyLjk5bC4wNC0uMzZjLjg5LTcuNTksMy4zNi0xNC43Niw3LjEzLTIwLjczLDQuMTYtNi41OSw5LjYyLTExLjIsMTUuMzctMTIuOThsLjIzLS4wN1Y3MC4xMmwtLjI0LS4wN2MtMTEuNDUtMy4xOC0yMC4zNi0xNi43LTIyLjY4LTM0LjQ0bC0uMDUtLjM1aC0zMy4yOGwtNC4zNS02LjVoNDEuNDhjLjY3LDE5LjY4LDEwLjkxLDM1LjExLDIzLjQ2LDM1LjQ3djE3Ny4wOFoiLz4KICA8cG9seWdvbiBjbGFzcz0iY2xzLTEiIHBvaW50cz0iMTY0LjM0IDYxLjg5IDE2NC45MiA2MS44OSAxNjQuOTIgMzIuMjYgMTQ1LjY5IDMyLjI2IDE0NS42OSAzMy4xMiAxNjQuMzQgMzMuMTIgMTY0LjM0IDYxLjg5Ii8+Cjwvc3ZnPg==);
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
}

.frame-mask {
  animation: fadeInOnce 1.2s ease forwards, BgMovement 15s linear infinite;
  animation-direction: alternate;
  animation-delay: 0s;
  opacity: 0;
  transition: opacity 2s ease-in;
}

.recent_posts .frame-mask {
	transform: scale(2, 1.45);
}

.info-tabs .frame-mask {
}

body {
	background: #200325 var(--mainbg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 35%;
	background-attachment: fixed;
	color: var(--textcolor);
	font: var(--font);
	word-spacing: 2px;
	text-align: justify;
	line-height: 20px;
	margin: 0;
}

section#banner {
	height: 350px;
	background: var(--mainbg);
	background-position: 50% 15%;
	background-size: cover;
}

body.index section#banner {
	height: 900px;
	backdrop-filter: blur(0px);
	background: none;
}

body.error section#banner, body.error #container, body.error .container-overlay, body.errior .wrapper, body.error section#footer {
	display: none;
}

.pm_alert {
	z-index: 6969;
	position: sticky;
	top: 100px;
	margin: 0 auto;
	width: 50%;
	background: var(--darkeroverlay);
	padding: 1em;
	font-size: 10px;
	text-align: center;
	outline: var(--lightborder);
}

#container {
	overflow: hidden;
	background: var(--blurredbg);
	background-repeat: no-repeat;
	background-position: 50% 5%;
	background-size: cover;
	background-attachment: fixed;
	border-top: var(--lightborder);
	margin: 0 auto;
}

.container-overlay {
	overflow: hidden;
	background: var(--overlay);
	margin: 0 auto;
}

.wrapper {
	width: 65%;
	min-width: 950px;
	max-width: 1500px;
	padding: 1em 0 3em;
	margin: auto auto;
}

ol, ul {
	text-align: left;
}

ol {
	list-style: none;
	background: var(--overlay);
	padding: 3em;
	border: var(--border);
}

ol li {
  counter-increment: my-awesome-counter;
	margin-bottom: 1.5em;
}

ol li::before {
  content: counter(my-awesome-counter);
  color: #fff;
  font: var(--fancy);
  float: left;
  padding-right: .5em;
}

hr {
  height: 1px;
  background: var(--hrbg);
  border: 0;
  margin: 2em 0;
}

.thead {
	font: var(--theadfont);
	text-transform: uppercase;
	text-align: center;
	text-shadow: var(--textshadow);
	letter-spacing: .05em;
	margin: 1em 0;
}

.news .thead, .wanderers .thead, .index_stats .thead, .affiliates .thead {
	padding: 0 0 2em 0;
	color: var(--theadcolor);
	font: var(--fancy);
	margin: 0;
}

.wanderers .thead {
	background: var(--darkeroverlay);
	padding: 1.5em;
	border: var(--lightborder);
	border-bottom: 0;
}

.index_stats .thead {
	background: var(--overlay);
	padding: 1em;
	border-bottom: var(--lightborder);
}

.forum_default .thead {
	margin: 1em 1em 0;
}

.forum_default .thead a {
	color: var(--theadcolor);
}

.forum_default .thead a:hover {
	text-shadow: 0 0 15px var(--theadcolor);
}

.title {
	padding: 1em 0;
	font-family: 'Jost';
	font-weight: bold;
	text-align: center;
	text-transform: uppercase;
	transition: 1s;
}

.trow1 .title,
.trow2 .title,
.post_icons {
	background: var(--darkeroverlay);
	outline: var(--lightborder);
	margin: 2em 0;
}

/** --- LINK STYLES --- **/
a:link,
a:active,
a:visited {
  color: var(--links);
  text-decoration: none;
  transition: all 0.5s;
}

a:hover {
  color: var(--linkshover);
  text-decoration: none;
  text-shadow: 0 0 10px;
  cursor: pointer;
  transition: all 0.5s;
}

blockquote cite {border-bottom: var(--lightborder);padding-bottom: 1em;margin: 0 0 1em;}

blockquote cite > span {
	float: right;
}

blockquote cite span.highlight {
	float: none;
	font-weight: bold;
	padding-bottom: 0;
}

.codeblock .title {
	font-weight: bold;
}

.codeblock code {
	overflow: auto;
	height: auto;
	max-height: 200px;
	display: block;
	font-family: Monaco, Consolas, Courier, monospace;
}

.popup_menu .popup_item_container {
	margin: 1px;
	text-align: left;
}

.popup_menu .popup_item {
	display: block;
	padding: 4px;
	white-space: nowrap;
	text-decoration: none;
}

.popup_menu a.popup_item:hover {
	text-decoration: none;
}

.subject_new {
	font-weight: bold;
}

table { width: 100% }

input, select, textarea {
	background: var(--darkeroverlay);
	box-sizing: border-box;
	padding: 1.5em;
	color: inherit;
	font-size: inherit;
	font-family: inherit;
	border: var(--lightborder);
}

select {
	padding: .6em;
	background: var(--black);
	border-color: var(--black);
}

input.textbox, textarea {
	width:-webkit-fill-available;
}

.postbit_buttons a, .button, button, input.button, .pagination a {
	display: inline-block;
	background: var(--overlay);
	padding: 1.5em 2em;
	color: var(--links);
	font-size: 10px;
	letter-spacing: 1px;
	line-height: 0;
	text-transform: uppercase;
	text-align: center;
	border: var(--lightborder);
	margin: 0 .5em;
	transition: all 0.5s;
}

.pagination a, .pagination span, .pagination .pagination_current {
	font-size: 10px;
	letter-spacing: 1px;
	line-height: 0;
	text-transform: uppercase;
	margin: 0 .3em;
	transition: all 0.5s;
}

#census.modal .button,
.guide_links .button,
.recent_posts .button {
	margin: 2em auto 0;
}

.guide_links .button {
	flex: 20%;
	display: flex;
	align-content: center;
	align-items: center;
	justify-content: center;
	margin: 0;
}

.subforums .button {
	flex: 1;
	margin: 0;
	padding: 3em;
	background-position: 50% 50%;
	background-size: cover;
	font: var(--fancy);
	border-left: var(--lightborder);
	border-bottom: var(--lightborder);
	outline: 0;
}

.button:hover { 
	cursor: pointer;
	color: var(--linkshover);
	text-shadow: 0 0 15px var(--linksglow); 
	transition: all 0.5s;
}

.forum_default .button:hover { 
	cursor: pointer;
	color: var(--whitecolor);
	text-shadow: var(--whiteglow); 
	transition: all 0.5s;
}

fieldset { border: var(--border); }

/* --- MODAL OVERLAY --- */
.blocker {
	display: flex;
	position: fixed;
	inset: 0;
	justify-content: center;
	align-items: center;
	z-index: 9999;
	background: var(--darkeroverlay);
	background-size: cover;
	backdrop-filter: blur(10px);
	overflow: hidden; /* prevent scrollbars inside modal */
	align-content: center;
	flex-wrap: nowrap;
	flex-direction: column;
}

.blocker:before {
	display: none;
}

.blocker.behind {
	background-color: transparent;
}

/* --- MODAL WINDOW --- */
.modal {
	position: relative;
	z-index: 2;
	width: 90%;
	max-width: 600px;
	max-height: 90vh;
	padding: 2em;
	box-sizing: border-box;
	background: var(--darkeroverlay); /* different from overlay blur */
	border: var(--lightborder);
	text-align: left;
	);
	 /* only scroll the modal if content overflows */
}


.modal .thead {
	font: var(--fancy);
	color: var(--theadcolor);
	margin: 0 0 1em;
}

.modal .thead svg {
	display: inline-flex;
    opacity: .5;
    fill: var(--textcolor);
    width: 30px;
    height: 30px;
	margin-bottom: -8px;
    margin-left: -5px;
    margin-right: 5px;
}

.modal .guide_links {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
	gap: 1em;
	margin: 2em 2em 0;
}

.modal .guide_links svg {
	display: inline-flex;
    opacity: .5;
    fill: var(--links);
    width: 20px;
    height: 20px;
	margin-bottom: -5px;
    margin-left: -5px;
    margin-right: 5px;
}

.modal .census {
	display: flex;
	background: none;
	backdrop-filter: none;
	flex-direction: column;
	align-content: stretch;
	flex-wrap: wrap;
	justify-content: center;
	align-items: stretch;
}

.modal .census .census_row {display: flex;backdrop-filter: none;align-items: center;flex-direction: row;justify-content: center;flex-wrap: nowrap;padding: .5em 0;}

.modal form {
	background: transparent;
	backdrop-filter: none;
	border: none;
}

/* CLOSE BUTTON */
.modal a.close-modal {
	display: none;
	position: absolute;
	top: -12.5px;
	right: -12.5px;
	width: 30px;
	height: 30px;
	background: url(../../../images/close.png) no-repeat center center;
	background-size: contain;
	text-indent: -9999px;
	border: none;
	cursor: pointer;
}

/* --- CONTENT INSIDE MODAL --- */
#landing, #guidebook, #season, #census, #quick_login, #error {
	position: relative;
	width: 100%;
}

#landing, #guidebook, #season, #census, #quick_login, #error {
	overflow: hidden;
	background: #200325 var(--blurredbg);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: cover;
	background-attachment: fixed;
	padding: 0;
	text-align: center;
	border: none;
	box-shadow: var(--boxshadow);
}

#landing .box, #guidebook .box #season .box, #census .box, #quick_login .box, #error .box {
	z-index: 1;
	position: relative;
	overflow: hidden;
	background: var(--darkeroverlay);
	backdrop-filter: blur(10px);
}

#landing .content, #guidebook .content, #season .content, #census .content, #quick_login .content, #error .content {
	z-index: 3;
	position: relative;
	width: auto;
	height: auto;
	padding: 7em 5em;
	overflow: hidden;
}

#census .content {
	padding: 4em;
}

#landing .button {
	margin-top: 2em;
}

#landing .frame-mask, #guidebook .frame-mask, #season .frame-mask, #census .frame-mask, #quick_login .frame-mask, #error .frame-mask {
	z-index: 2;
	position: absolute;
	top: 0;
	left: 0;
	transform: scale(3.3, 1.4);
	background: #200325 var(--blurredbg);
	backdrop-filter: blur(10px);
	background-repeat: no-repeat;
	width: 100%;
	height: 100%;
	mask-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48Y2lyY2xlIGN4PSI1MCIgY3k9IjUwIiByPSI0MCIgZmlsbD0id2hpdGUiLz48L3N2Zz4=)url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDE2OC43MSAzMDUuNjciPgogIDxkZWZzPgogICAgPHN0eWxlPgogICAgICAuY2xzLTEgewogICAgICAgIGZpbGw6ICMwMDA7CiAgICAgICAgc3Ryb2tlLXdpZHRoOiAwcHg7CiAgICAgIH0KICAgIDwvc3R5bGU+CiAgPC9kZWZzPgogIDxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTE2Ny41LDYyLjVjLTIuMjIsMC00LjM2LS41LTYuMzktMS40M2guNTl2LTI0Ljg3aC0xNi4wNHYuNzJjLS41MS0yLjcxLS44Mi01LjU2LS45MS04LjUsMC0uMSwwLS4xOSwwLS4yOWwtLjAyLTEuMTFoLTQzLjc3TDgzLjUuOTFsLTE3LjQ2LDI2LjEySDI0LjA5di44N2MuMDEsMi41MS0uMiw1LjAxLS42Miw3LjQ0SDcuNzd2MjMuOTVjLS44Ny40MS0xLjc1LjczLTIuNjQuOTd2LTI4LjAxaDE4LjY1di0uODdINC41NXYyOS4wM2MtMS4wNy4yNS0yLjE1LjM4LTMuMjIuMzhsLS44My0uMDJ2MTgxLjFoLjU4YzEuMTguMDEsMi4zNC4xNywzLjQ3LjQ1djI4LjU2aDE4Ljc3Yy4yLDEuNjUuMzMsMy4zNC4zOCw1LjA3LDAsLjMsMCwuNi4wMS45djEuMDZoNDEuODVsMTcuOTQsMjYuODQsMTcuOTQtMjYuODRoNDMuNzFsLS4wMy0uOTFjLS4wNS0xLjc2LjAxLTMuNTIuMTctNS4yNmgxOS42MnYtMjguNGMuOTEtLjIsMS44Mi0uMzIsMi43Mi0uMzRoLjU3VjYyLjQ5bC0uNzEuMDJaTTE2MC41NCwzNy45NHYyMi44NmMtNi45Mi0zLjQ3LTEyLjQtMTEuOTgtMTQuNjgtMjIuODZoMTQuNjhaTTgzLjUsMy4zNmwxNS44MiwyMy42NywxLjE2LDEuNzMsNC4zNSw2LjVoLTkuNmwtNC4zNS02LjUtMS4xNi0xLjczLTYuMjItOS4zMS02LjIyLDkuMzEtMS4xNiwxLjczLTQuMzUsNi41aC05LjZsNC4zNS02LjUsMS4xNi0xLjczLDE1LjgyLTIzLjY3Wk0xMDYuNjYsMjY4LjgybC00LjM1LTYuNWgzMy43NGwuMTMtLjZjMS40OC02LjcsMy45NS0xMi44Miw3LjM0LTE4LjE5LDMuODQtNi4wOCw4LjY0LTEwLjczLDEzLjg3LTEzLjQ0bC4zOS0uMlY3NS44OWwtLjQtLjE5Yy0xMC4wMy00LjktMTguMDItMTcuMDMtMjEuMzUtMzIuNDZsLS4xMy0uNmgtMzMuMWw0LjMtNi40My0uMDUtLjA4aDMyLjIyYzIuNDIsMTcuNzksMTEuMzYsMzEuMzYsMjIuODYsMzQuN3YxNjQuMDFjLTUuNzgsMS44Ni0xMS4yNSw2LjUyLTE1LjQ0LDEzLjE2LTMuNzksNi4wMS02LjI5LDEzLjItNy4yNCwyMC44MmgtMzIuNzhaTTk1LjQzLDI2OC44MmwtNC4zNS02LjUtMS4xNi0xLjczLTYuNDItOS42MS02LjQyLDkuNjEtMS4xNiwxLjczLTQuMzUsNi41aC05LjZsNC4zNS02LjUsMS4xNi0xLjczLDE2LjAyLTIzLjk3LDE2LjAyLDIzLjk3LDEuMTYsMS43Myw0LjM1LDYuNWgtOS42Wk04OC41NiwyNzcuOTJsLTUuMDYsNy41Ny01LjA2LTcuNTctMS4xNi0xLjczLTQuMzUtNi41LS4xNS0uMjIuNDMtLjY0LDQuMzUtNi41LDEuMTYtMS43Myw0Ljc4LTcuMTYsNC43OCw3LjE2LDEuMTYsMS43Myw0LjM1LDYuNS40My42NC0uMTUuMjItNC4zNSw2LjUtMS4xNiwxLjczWk0yOS4yNiwyNjguODJjLTIuMjYtMTcuNjItMTEuMzMtMzEuNy0yMi42Ny0zNS4xOVY2OS4xM2M1LjctMS42OSwxMS4xNi02LjExLDE1LjM5LTEyLjQ3LDMuODktNS44Niw2LjUyLTEyLjk1LDcuNjItMjAuNTJoMzAuMzVsLS4wNS4wOCw0LjMsNi40M2gtMzEuMzFsLS4xNC41N2MtMS42LDYuNjktNC4xOSwxMi43Ni03LjcsMTguMDMtMy44NSw1Ljc5LTguNiwxMC4xOS0xMy43MywxMi43M2wtLjQuMnYxNTQuNDdsLjM5LjJjMTAsNS4xMSwxNy45MiwxNy40LDIxLjIsMzIuODdsLjEzLjZoMzIuMDJsLTQuMzUsNi41aC0zMS4wOFpNMTU2LjYyLDIxMi4yOWgwcy0zMi4zNyw0OC4yOS0zMi4zNyw0OC4yOWgtMi42NmwzNS4wNC01Mi4yOHYzLjk5Wk0xNTYuNjIsMjEzLjV2MTUuMTZjLTUuMjUsMi44My0xMC4wNyw3LjU1LTEzLjk0LDEzLjY5LTMuNDEsNS40LTUuOTIsMTEuNTMtNy40NiwxOC4yNGgtMTAuMTVsMzEuNTUtNDcuMDhaTTE1Ni42Miw5MS42bC0zMS42Ni00Ny4yNGgxMC4wOWMzLjQ4LDE1LjQ3LDExLjUsMjcuNjUsMjEuNTYsMzIuNzh2MTQuNDZaTTEyNC4xNCw0NC4zN2wzMi40OCw0OC40NWgwczAsMy45OCwwLDMuOThsLTM1LjE1LTUyLjQ0aDIuNjZaTTEyMC42NSw0NC4zN2wzNS45Niw1My42NmgwczAsMTA5LjA2LDAsMTA5LjA2aDBzLTM1Ljg2LDUzLjQ5LTM1Ljg2LDUzLjQ5aC0xOS42bC0xNy42Ni0yNi40Mi0xNy42NiwyNi40MmgtMTguMjZsLTM1LjQ4LTUyLjk0di0xMTAuMTdsMzUuNTktNTMuMWgxNy42OGwxOC4xNCwyNy4xNCwxOC4xNC0yNy4xNGgxOS4wMlpNMTIuMDksOTIuMjZsMzIuMS00Ny45aDIuNjdMMTIuMDksOTYuMjR2LTMuOThaTTEyLjA5LDkxLjA0di0xNS42MmM1LjE1LTIuNjUsOS45MS03LjEyLDEzLjc5LTEyLjk1LDMuNTMtNS4zMSw2LjE2LTExLjM5LDcuODItMTguMDloOS42NmwtMzEuMjgsNDYuNjdaTTEyLjA5LDIxNC4wN2wzMS4xNyw0Ni41MWgtOS43NmMtMy40Mi0xNS41LTExLjM4LTI3Ljg0LTIxLjQxLTMzLjE4di0xMy4zNFpNNDQuMDksMjYwLjU4bC0zMi00Ny43NHYtMy45OGwzNC42Niw1MS43MmgtMi42N1pNMTA1LjQ1LDM2LjIxbC00LjMsNi40My0xLjE2LDEuNzMtMTYuNSwyNC42OC0xNi41LTI0LjY4LTEuMTYtMS43My00LjMtNi40My4wNS0uMDhoOS42bC0uMDUuMDgsNC4zLDYuNDMsMS4xNiwxLjczLDYuOSwxMC4zMyw2LjktMTAuMzMsMS4xNi0xLjczLDQuMy02LjQzLS4wNS0uMDhoOS42bC4wNS4wOFpNNzMuNDEsMzUuMjZsNC4zNS02LjUsMS4xNi0xLjczLDQuNTgtNi44Niw0LjU4LDYuODYsMS4xNiwxLjczLDQuMzUsNi41LjU4Ljg3LjA1LjA4LTQuMyw2LjQzLTEuMTYsMS43My01LjI2LDcuODctNS4yNi03Ljg3LTEuMTYtMS43My00LjMtNi40My4wNS0uMDguNTgtLjg3Wk04LjkzLDM3LjA3aDE0LjJjLTEuMDQsNC43OC0yLjg5LDkuMjgtNS40NywxMy4xNi0yLjUyLDMuOC01LjUzLDYuNjgtOC43Myw4LjQ3di0yMS42M1pNNS4xMywyNzAuMDN2LTI3LjUzYy43LjIsMS4zOS40NiwyLjA2Ljc2djIyLjgyaDE1LjMyYy4yOCwxLjI4LjUxLDIuNi43LDMuOTVINS4xM1pNOC4zNSwyNDMuODJjNi4yNiwzLjM3LDExLjI5LDEwLjg5LDEzLjc1LDIwLjUyaC0xMy43NXYtMjAuNTJaTTI0Ljg3LDI3Ni4xOWMwLS4xLDAtLjIsMC0uMzEtLjEtMy40MS0uNS02LjctMS4xNC05LjgxaC4wOXYtMS43M2gtLjQ4Yy0zLjM1LTEzLjg2LTExLjc4LTIzLjczLTIxLjY3LTI0LjE4VjYyLjUzYzYuMTItLjE0LDEyLjIzLTQuMTYsMTYuODItMTEuMDcsNC4yNS02LjQsNi42NC0xNC40Myw2Ljc2LTIyLjdoMzkuNjNsLTQuMzUsNi41aC0zMS40bC0uMDUuMzVjLTEuMDUsNy41NC0zLjY0LDE0LjYxLTcuNTEsMjAuNDMtNC4yMSw2LjMzLTkuNjUsMTAuNy0xNS4zMiwxMi4zbC0uMjQuMDd2MTY1Ljk0bC4yMy4wN2MxMS4zLDMuMzIsMjAuMzQsMTcuMzUsMjIuNDksMzQuOTJsLjA0LjM2aDMxLjI4bDQuMzUsNi41SDI0Ljg3Wk04My41LDMwMi4zMWwtMTYuMy0yNC4zOC0xLjE2LTEuNzMtNC4zNS02LjVoOS42bDQuMzUsNi41LDEuMTYsMS43Myw2LjcsMTAuMDMsNi43LTEwLjAzLDEuMTYtMS43Myw0LjM1LTYuNWg5LjZsLTQuMzUsNi41LTEuMTYsMS43My0xNi4zLDI0LjM4Wk0xNjQuMzQsMjcwLjg5aC0xOC45NmMuMTUtMS4zMy4zNy0yLjY1LjY1LTMuOTVoMTYuMjV2LTIyLjc1Yy42OC0uMjgsMS4zNy0uNTIsMi4wNi0uN3YyNy40Wk0xNDYuNDMsMjY1LjIxYzEuMDEtMy45MywyLjU4LTcuNjUsNC42Ny0xMC45NiwyLjc4LTQuNCw2LjI5LTcuNjksMTAuMDEtOS41NHYyMC41aC0xNC42OVpNMTY3LjA1LDI0MS4zMWMtNi4xOS4zNS0xMi4yOCw0LjYtMTYuNzksMTEuNzUtNC4xNyw2LjYtNi40LDE0Ljc4LTYuMzIsMjMuMTNoLTQxLjM1bDQuMzUtNi41aDMyLjk5bC4wNC0uMzZjLjg5LTcuNTksMy4zNi0xNC43Niw3LjEzLTIwLjczLDQuMTYtNi41OSw5LjYyLTExLjIsMTUuMzctMTIuOThsLjIzLS4wN1Y3MC4xMmwtLjI0LS4wN2MtMTEuNDUtMy4xOC0yMC4zNi0xNi43LTIyLjY4LTM0LjQ0bC0uMDUtLjM1aC0zMy4yOGwtNC4zNS02LjVoNDEuNDhjLjY3LDE5LjY4LDEwLjkxLDM1LjExLDIzLjQ2LDM1LjQ3djE3Ny4wOFoiLz4KICA8cG9seWdvbiBjbGFzcz0iY2xzLTEiIHBvaW50cz0iMTY0LjM0IDYxLjg5IDE2NC45MiA2MS44OSAxNjQuOTIgMzIuMjYgMTQ1LjY5IDMyLjI2IDE0NS42OSAzMy4xMiAxNjQuMzQgMzMuMTIgMTY0LjM0IDYxLjg5Ii8+Cjwvc3ZnPg==);
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	-webkit-mask-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDE2OC43MSAzMDUuNjciPgogIDxkZWZzPgogICAgPHN0eWxlPgogICAgICAuY2xzLTEgewogICAgICAgIGZpbGw6ICMwMDA7CiAgICAgICAgc3Ryb2tlLXdpZHRoOiAwcHg7CiAgICAgIH0KICAgIDwvc3R5bGU+CiAgPC9kZWZzPgogIDxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTE2Ny41LDYyLjVjLTIuMjIsMC00LjM2LS41LTYuMzktMS40M2guNTl2LTI0Ljg3aC0xNi4wNHYuNzJjLS41MS0yLjcxLS44Mi01LjU2LS45MS04LjUsMC0uMSwwLS4xOSwwLS4yOWwtLjAyLTEuMTFoLTQzLjc3TDgzLjUuOTFsLTE3LjQ2LDI2LjEySDI0LjA5di44N2MuMDEsMi41MS0uMiw1LjAxLS42Miw3LjQ0SDcuNzd2MjMuOTVjLS44Ny40MS0xLjc1LjczLTIuNjQuOTd2LTI4LjAxaDE4LjY1di0uODdINC41NXYyOS4wM2MtMS4wNy4yNS0yLjE1LjM4LTMuMjIuMzhsLS44My0uMDJ2MTgxLjFoLjU4YzEuMTguMDEsMi4zNC4xNywzLjQ3LjQ1djI4LjU2aDE4Ljc3Yy4yLDEuNjUuMzMsMy4zNC4zOCw1LjA3LDAsLjMsMCwuNi4wMS45djEuMDZoNDEuODVsMTcuOTQsMjYuODQsMTcuOTQtMjYuODRoNDMuNzFsLS4wMy0uOTFjLS4wNS0xLjc2LjAxLTMuNTIuMTctNS4yNmgxOS42MnYtMjguNGMuOTEtLjIsMS44Mi0uMzIsMi43Mi0uMzRoLjU3VjYyLjQ5bC0uNzEuMDJaTTE2MC41NCwzNy45NHYyMi44NmMtNi45Mi0zLjQ3LTEyLjQtMTEuOTgtMTQuNjgtMjIuODZoMTQuNjhaTTgzLjUsMy4zNmwxNS44MiwyMy42NywxLjE2LDEuNzMsNC4zNSw2LjVoLTkuNmwtNC4zNS02LjUtMS4xNi0xLjczLTYuMjItOS4zMS02LjIyLDkuMzEtMS4xNiwxLjczLTQuMzUsNi41aC05LjZsNC4zNS02LjUsMS4xNi0xLjczLDE1LjgyLTIzLjY3Wk0xMDYuNjYsMjY4LjgybC00LjM1LTYuNWgzMy43NGwuMTMtLjZjMS40OC02LjcsMy45NS0xMi44Miw3LjM0LTE4LjE5LDMuODQtNi4wOCw4LjY0LTEwLjczLDEzLjg3LTEzLjQ0bC4zOS0uMlY3NS44OWwtLjQtLjE5Yy0xMC4wMy00LjktMTguMDItMTcuMDMtMjEuMzUtMzIuNDZsLS4xMy0uNmgtMzMuMWw0LjMtNi40My0uMDUtLjA4aDMyLjIyYzIuNDIsMTcuNzksMTEuMzYsMzEuMzYsMjIuODYsMzQuN3YxNjQuMDFjLTUuNzgsMS44Ni0xMS4yNSw2LjUyLTE1LjQ0LDEzLjE2LTMuNzksNi4wMS02LjI5LDEzLjItNy4yNCwyMC44MmgtMzIuNzhaTTk1LjQzLDI2OC44MmwtNC4zNS02LjUtMS4xNi0xLjczLTYuNDItOS42MS02LjQyLDkuNjEtMS4xNiwxLjczLTQuMzUsNi41aC05LjZsNC4zNS02LjUsMS4xNi0xLjczLDE2LjAyLTIzLjk3LDE2LjAyLDIzLjk3LDEuMTYsMS43Myw0LjM1LDYuNWgtOS42Wk04OC41NiwyNzcuOTJsLTUuMDYsNy41Ny01LjA2LTcuNTctMS4xNi0xLjczLTQuMzUtNi41LS4xNS0uMjIuNDMtLjY0LDQuMzUtNi41LDEuMTYtMS43Myw0Ljc4LTcuMTYsNC43OCw3LjE2LDEuMTYsMS43Myw0LjM1LDYuNS40My42NC0uMTUuMjItNC4zNSw2LjUtMS4xNiwxLjczWk0yOS4yNiwyNjguODJjLTIuMjYtMTcuNjItMTEuMzMtMzEuNy0yMi42Ny0zNS4xOVY2OS4xM2M1LjctMS42OSwxMS4xNi02LjExLDE1LjM5LTEyLjQ3LDMuODktNS44Niw2LjUyLTEyLjk1LDcuNjItMjAuNTJoMzAuMzVsLS4wNS4wOCw0LjMsNi40M2gtMzEuMzFsLS4xNC41N2MtMS42LDYuNjktNC4xOSwxMi43Ni03LjcsMTguMDMtMy44NSw1Ljc5LTguNiwxMC4xOS0xMy43MywxMi43M2wtLjQuMnYxNTQuNDdsLjM5LjJjMTAsNS4xMSwxNy45MiwxNy40LDIxLjIsMzIuODdsLjEzLjZoMzIuMDJsLTQuMzUsNi41aC0zMS4wOFpNMTU2LjYyLDIxMi4yOWgwcy0zMi4zNyw0OC4yOS0zMi4zNyw0OC4yOWgtMi42NmwzNS4wNC01Mi4yOHYzLjk5Wk0xNTYuNjIsMjEzLjV2MTUuMTZjLTUuMjUsMi44My0xMC4wNyw3LjU1LTEzLjk0LDEzLjY5LTMuNDEsNS40LTUuOTIsMTEuNTMtNy40NiwxOC4yNGgtMTAuMTVsMzEuNTUtNDcuMDhaTTE1Ni42Miw5MS42bC0zMS42Ni00Ny4yNGgxMC4wOWMzLjQ4LDE1LjQ3LDExLjUsMjcuNjUsMjEuNTYsMzIuNzh2MTQuNDZaTTEyNC4xNCw0NC4zN2wzMi40OCw0OC40NWgwczAsMy45OCwwLDMuOThsLTM1LjE1LTUyLjQ0aDIuNjZaTTEyMC42NSw0NC4zN2wzNS45Niw1My42NmgwczAsMTA5LjA2LDAsMTA5LjA2aDBzLTM1Ljg2LDUzLjQ5LTM1Ljg2LDUzLjQ5aC0xOS42bC0xNy42Ni0yNi40Mi0xNy42NiwyNi40MmgtMTguMjZsLTM1LjQ4LTUyLjk0di0xMTAuMTdsMzUuNTktNTMuMWgxNy42OGwxOC4xNCwyNy4xNCwxOC4xNC0yNy4xNGgxOS4wMlpNMTIuMDksOTIuMjZsMzIuMS00Ny45aDIuNjdMMTIuMDksOTYuMjR2LTMuOThaTTEyLjA5LDkxLjA0di0xNS42MmM1LjE1LTIuNjUsOS45MS03LjEyLDEzLjc5LTEyLjk1LDMuNTMtNS4zMSw2LjE2LTExLjM5LDcuODItMTguMDloOS42NmwtMzEuMjgsNDYuNjdaTTEyLjA5LDIxNC4wN2wzMS4xNyw0Ni41MWgtOS43NmMtMy40Mi0xNS41LTExLjM4LTI3Ljg0LTIxLjQxLTMzLjE4di0xMy4zNFpNNDQuMDksMjYwLjU4bC0zMi00Ny43NHYtMy45OGwzNC42Niw1MS43MmgtMi42N1pNMTA1LjQ1LDM2LjIxbC00LjMsNi40My0xLjE2LDEuNzMtMTYuNSwyNC42OC0xNi41LTI0LjY4LTEuMTYtMS43My00LjMtNi40My4wNS0uMDhoOS42bC0uMDUuMDgsNC4zLDYuNDMsMS4xNiwxLjczLDYuOSwxMC4zMyw2LjktMTAuMzMsMS4xNi0xLjczLDQuMy02LjQzLS4wNS0uMDhoOS42bC4wNS4wOFpNNzMuNDEsMzUuMjZsNC4zNS02LjUsMS4xNi0xLjczLDQuNTgtNi44Niw0LjU4LDYuODYsMS4xNiwxLjczLDQuMzUsNi41LjU4Ljg3LjA1LjA4LTQuMyw2LjQzLTEuMTYsMS43My01LjI2LDcuODctNS4yNi03Ljg3LTEuMTYtMS43My00LjMtNi40My4wNS0uMDguNTgtLjg3Wk04LjkzLDM3LjA3aDE0LjJjLTEuMDQsNC43OC0yLjg5LDkuMjgtNS40NywxMy4xNi0yLjUyLDMuOC01LjUzLDYuNjgtOC43Myw4LjQ3di0yMS42M1pNNS4xMywyNzAuMDN2LTI3LjUzYy43LjIsMS4zOS40NiwyLjA2Ljc2djIyLjgyaDE1LjMyYy4yOCwxLjI4LjUxLDIuNi43LDMuOTVINS4xM1pNOC4zNSwyNDMuODJjNi4yNiwzLjM3LDExLjI5LDEwLjg5LDEzLjc1LDIwLjUyaC0xMy43NXYtMjAuNTJaTTI0Ljg3LDI3Ni4xOWMwLS4xLDAtLjIsMC0uMzEtLjEtMy40MS0uNS02LjctMS4xNC05LjgxaC4wOXYtMS43M2gtLjQ4Yy0zLjM1LTEzLjg2LTExLjc4LTIzLjczLTIxLjY3LTI0LjE4VjYyLjUzYzYuMTItLjE0LDEyLjIzLTQuMTYsMTYuODItMTEuMDcsNC4yNS02LjQsNi42NC0xNC40Myw2Ljc2LTIyLjdoMzkuNjNsLTQuMzUsNi41aC0zMS40bC0uMDUuMzVjLTEuMDUsNy41NC0zLjY0LDE0LjYxLTcuNTEsMjAuNDMtNC4yMSw2LjMzLTkuNjUsMTAuNy0xNS4zMiwxMi4zbC0uMjQuMDd2MTY1Ljk0bC4yMy4wN2MxMS4zLDMuMzIsMjAuMzQsMTcuMzUsMjIuNDksMzQuOTJsLjA0LjM2aDMxLjI4bDQuMzUsNi41SDI0Ljg3Wk04My41LDMwMi4zMWwtMTYuMy0yNC4zOC0xLjE2LTEuNzMtNC4zNS02LjVoOS42bDQuMzUsNi41LDEuMTYsMS43Myw2LjcsMTAuMDMsNi43LTEwLjAzLDEuMTYtMS43Myw0LjM1LTYuNWg5LjZsLTQuMzUsNi41LTEuMTYsMS43My0xNi4zLDI0LjM4Wk0xNjQuMzQsMjcwLjg5aC0xOC45NmMuMTUtMS4zMy4zNy0yLjY1LjY1LTMuOTVoMTYuMjV2LTIyLjc1Yy42OC0uMjgsMS4zNy0uNTIsMi4wNi0uN3YyNy40Wk0xNDYuNDMsMjY1LjIxYzEuMDEtMy45MywyLjU4LTcuNjUsNC42Ny0xMC45NiwyLjc4LTQuNCw2LjI5LTcuNjksMTAuMDEtOS41NHYyMC41aC0xNC42OVpNMTY3LjA1LDI0MS4zMWMtNi4xOS4zNS0xMi4yOCw0LjYtMTYuNzksMTEuNzUtNC4xNyw2LjYtNi40LDE0Ljc4LTYuMzIsMjMuMTNoLTQxLjM1bDQuMzUtNi41aDMyLjk5bC4wNC0uMzZjLjg5LTcuNTksMy4zNi0xNC43Niw3LjEzLTIwLjczLDQuMTYtNi41OSw5LjYyLTExLjIsMTUuMzctMTIuOThsLjIzLS4wN1Y3MC4xMmwtLjI0LS4wN2MtMTEuNDUtMy4xOC0yMC4zNi0xNi43LTIyLjY4LTM0LjQ0bC0uMDUtLjM1aC0zMy4yOGwtNC4zNS02LjVoNDEuNDhjLjY3LDE5LjY4LDEwLjkxLDM1LjExLDIzLjQ2LDM1LjQ3djE3Ny4wOFoiLz4KICA8cG9seWdvbiBjbGFzcz0iY2xzLTEiIHBvaW50cz0iMTY0LjM0IDYxLjg5IDE2NC45MiA2MS44OSAxNjQuOTIgMzIuMjYgMTQ1LjY5IDMyLjI2IDE0NS42OSAzMy4xMiAxNjQuMzQgMzMuMTIgMTY0LjM0IDYxLjg5Ii8+Cjwvc3ZnPg==);
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
}

#guidebook .frame-mask {
	transform: scale(3.9, 1.5)
}

#season .frame-mask {
	transform: scale(5.5, 1.9)
}

#census .frame-mask {
	transform: scale(2, 1.7);
}

#error .frame-mask {
	transform: scale(4.5, 1.5);
}

#topbar {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 696969;
	background: var(--blurredbg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 24%;
	background-attachment: fixed;
	padding-bottom: 5px;
	letter-spacing: 1px;
	text-transform: uppercase;
	box-shadow: var(--boxshadow);
	transition: all 1s ease-in-out;
	animation: slideIn 1s ease forwards;
}

#topbar svg {
	display: inline-flex;
	float: left;
	opacity: .5;
	fill: var(--links);
	width: 20px;
	height: 20px;
	margin-left: -5px;
	margin-right: 5px;
}

/* --- WRAPPER INSIDE TOPBAR --- */
.topbar-wrapper {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  backdrop-filter: brightness(0.3);
}

/* --- LEFT SIDE OF TOPBAR --- */
.topbar-left {
  padding: 1.5em;
  font: var(--fancy);
}

/* --- RIGHT SIDE OF TOPBAR --- */
.topbar-center {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 1.5em;
}

/* --- RIGHT SIDE OF TOPBAR --- */
.topbar-right {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 1.5em;
}

#topbar .topbar-right a,
#topbar .topbar-center a {
  padding: 0 4px;
  position: relative;
  transition: all 0.2s ease-in-out;
}

/* --- UNDERLINE LOGIC --- */
#topbar .topbar-center a::after,
#topbar .topbar-right a::after {
  content: '';
  position: absolute;
  bottom: -5px;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: var(--links);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease-in-out;
}

#topbar .topbar-center a:hover::after,
#topbar .topbar-center a.current::after,
#topbar .topbar-right a:hover::after,
#topbar .topbar-right a.current::after {
  transform: scaleX(1);
}

#topbar .topbar-right a,
#topbar .topbar-right a.current {
  text-shadow: none;
}

#topbar .topbar-right a:hover {
  color: var(--linkshover);
  text-shadow: 0 0 15px var(--linkshover);
}

/* --- INFO TABS --- */
.info-tabs {
	flex-basis: 65%;
  display: flex;
  flex-direction: column;
}

.info-tabs .box {}

.info-tabs .content {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: center;
	padding: 0;
	align-content: stretch;
	align-items: stretch;
}

.info-tabs input[name="info-tabs-control"] {
  display: none;
}

.info-tabs ul {
  display: flex;
  list-style: none;
  justify-content: space-evenly;
  background: var(--darkeroverlay);
  padding: 2em 0;
  border: var(--lightborder);
  margin: 0;
}

.info-tabs ul li {
  display: inline-block;
  font: var(--fancy);
  text-align: center;
  transition: all 0.2s ease-in-out;
}

.info-tabs ul li label {
  display: block;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}

.info-tabs ul li label:hover {
  color: var(--links);
  text-shadow: 0 0 15px;
  transition: all 0.2s ease-in-out;
}

.info-tabs-content {
  background: var(--overlay);
  backdrop-filter: blur(10px);
  flex-grow: 1;
  overflow: hidden;
  padding: 2em;
  border: var(--lightborder);
  border-top: 0;
}

.info-tabs-content section {
  display: none;
}

.info-tabs, .OTM_card, .recent_posts, 
.wanderers, .index_stats, .affiliates, #info {
  background: var(--blurredbg);
  background-repeat: no-repeat;
  background-position: 50% 5%;
  background-size: cover;
  background-attachment: fixed;
}

/* --- CHECKED TAB RULES --- */
#info-tabs-1:checked ~ ul li:nth-child(1) label, 
#info-tabs-2:checked ~ ul li:nth-child(2) label, 
#info-tabs-3:checked ~ ul li:nth-child(3) label {
  color: var(--theadcolor);
  transition: all 0.2s ease-in-out;
}

#info-tabs-1:checked ~ ul li:nth-child(1) label .info-tabs ul li,
#info-tabs-1:checked ~ ul li:nth-child(2) label .info-tabs ul li,
#info-tabs-1:checked ~ ul li:nth-child(3) label .info-tabs ul li{
  transition: all 0.2s ease-in-out;
}

#info-tabs-1:checked ~ .info-tabs-content section:nth-child(1) {
  display: block;
}

#info-tabs-2:checked ~ .info-tabs-content section:nth-child(2) {
  display: block;
}

#info-tabs-3:checked ~ .info-tabs-content section:nth-child(3) {
	display: block;
	height: 100%;
}

.wanderers {
	margin-bottom: 2em;
}

.whos_online {background: var(--overlay);backdrop-filter: blur(10px);padding: 2em;text-align: center;border: var(--lightborder);}

.whos_online a { margin: 0 .3em;}

img.spy {
	opacity: .5;
	width: 22px;
	margin: 0 .2em -5px;
	transition: all .5s;
}

img.spy:hover {
	opacity: 1;
	transition: all .5s;
}

.category_default {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	align-items: stretch;
	justify-content: center;
	gap: 3em;
}

.Godless.Lands {
	flex-direction: row;
}

.Out.of.Character {
	flex-direction: row;
}

.Out.of.Character .description {
	display: none;
}

.news, .forum_default {
	display: flex;
}

.forum_default {
	display: flex;
	background: var(--blurredbg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 5%;
	background-attachment: fixed;
}

.Out.of.Character .forum_default {
	flex: 45%;
}

.Out.of.Character .forum_info {
	border-bottom: var(--lightborder);
}

.Godless.Lands .forum_default {
	flex: 45%;
}

.forum_default:hover {
	box-shadow: var(--boxshadow), var(--boxglow);
}

.forum_default:hover .overlay {
	background: var(--darkeroverlay);
	backdrop-filter: brightness(.5) blur(10px);
}

.forum_default:hover .thead a {
	opacity: 1;
}

.forum_default:hover .description {
	opacity: 1;
	transition: all .8s ease-in-out;
}

.news {margin: 0 0 2em;outline: 0;gap: 2em;}

.navigation, .newest {
	width: -webkit-fill-available;
	background: var(--darkeroverlay);
	padding: 2em;
	font-family: 'Jost';
	text-align: center;
	text-transform: uppercase;
	border: var(--lightborder);
	border-top: 0;
}

.navigation {
	padding-top: 2em;
	border: 0;
	border-bottom: var(--lightborder);
	box-shadow: var(--boxshadow);
}

.index_stats {
	display: flex;
	flex-direction: column;
}

.index_stats .census {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: stretch;
	justify-content: space-around;
	gap: 2em;
	background: var(--darkeroverlay);
	padding: 2em;
	border: var(--lightborder);
}

.index_stats .census_row {
	flex: 30%;
	display: flex;
	opacity: .7;
	text-align: center;
	align-items: stretch;
	justify-content: center;
	flex-direction: column;
}
.index_stats .census_row div {
	flex: 1;
	padding: 3em 1em;
}

body.index .navigation { display: none; }

.General, .Characters, {
	width: 0;
	background: none;
	box-shadow: none;
	flex: 1;
	flex-basis: 33.33%;
	transition: all 1s ease-in-out;
}

.overlay {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-items: stretch;
	justify-content: space-evenly;
	width: -webkit-fill-available;
	background: var(--overlay);
	backdrop-filter: brightness(0.6) blur(0px);
	transition: all 1s ease-in-out;
	border: var(--lightborder);
}

.General .overlay,
.Characters .overlay {
	flex-direction: column;
}

.news .overlay {
	flex-basis: 100%;
	display: flex;
	flex-direction: row;
	padding: 0;
	transition: all 1s ease-in-out;
}

.forum_info {
	flex: 2;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: stretch;
}

.lastpost {
	display: flex;
	height: 55px;
	background: var(--darkeroverlay);
	border-top: var(--lightborder);
	font-size: 10px;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.lastpost .lastpost_cell {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 1em 1.5em;
}

.General .lastpost,
.Characters .lastpost {
	background: none;
	backdrop-filter: none;
	padding: 0 0 1em;
	border: 0;
}

.General .lastpost_cell,
.Characters .lastpost_cell {
	justify-content: center;
}

.General .lastpost_av,
.Characters .lastpost_av {
	display: none;
}

.subforums {
	flex: 1;
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	align-items: stretch;
	justify-content: stretch;
	align-content: stretch;
}

.General .subforums,
.Characters .subforums {
	flex-direction: row;
}

.General .subforums .button,
.Characters .subforums .button {
	padding: 1em 3em;
}

.General .subforums .button:last-child,
.Characters .subforums .button:nth-child(3),
.Characters .subforums .button:last-child {
	border-top: var(--lightborder);
}

.General .subforums .button:nth-child(1),
.Characters .subforums .button:nth-child(1),
.Characters .subforums .button:nth-child(3),
.General .subforums .button:last-child {
	border-left: 0;
}

.Characters .subforums .button:nth-child(3) {
	border-top: 0;
	border-bottom: 0;
}

.General .subforums .button:last-child,
.Characters .subforums .button:last-child {
	border-top: 0;
	border-bottom: 0;
}

.Godless.Lands .subforums {
	display: none;
}

.description {
	opacity: 0;
	height: 100px;
	padding-right: 2em;
	margin: 3em;
	overflow-y: scroll;
	transition: all .8s ease-in-out;
}

/* --- FORUM DESCRIPTIONS INSIDE FORUMS --- */

.display_description {background: var(--mainbg);background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;background-attachment: local;box-shadow: var(--boxshadow);}

#display_forum {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
	gap: 2em;
	margin: 2em 0;
}

#display_forum .forum_default {
	box-shadow: none;
	flex: 1 1 0;
	flex-basis: 31%;
}

#display_forum .forum_default:hover {
	box-shadow: none;
}

.display_description .overlay,
#display_forum .overlay,
.rules .overlay {
	flex-direction: column;
}

.display_description .overlay {
	background: var(--darkeroverlay);
	backdrop-filter: blur(10px);
}

.rules .overlay {
	padding: 2em;
}

#display_forum .thead {
	margin: 3em;
	font: var(--fancy);
}

.display_description .description {
	opacity: 1;
	height: auto;
	overflow-y: auto;
	margin: 3em;
	padding-right: 0;
}

#display_forum .description,
#display_forum .lastpost
{display: none;}

#display_forum .forum_default .button {
	display: none;
}

.Apollyon {
	background-image: var(--forumtwo);
}

.Solkarion {
	background-image: var(--forumthree);
}

.Sora {
	background-image: var(--forumfour);
}

.Mother.Magdalene {
	background-image: var(--forumfive);
}

.Hjaalmar {
	background-image: var(--forumfour);
}

.Godseeds {
	background-image: var(--forumfour);
}

.Forum.Six {
	background-image: var(--forumfour);
}

/* --- RECENT POSTS STYLES --- */
.recent_posts {
	flex-basis: 35%;
}

.recent_posts .overlay {
	display: flex;
	flex-direction: column;
	justify-content: normal;
	align-items: stretch;
	height: -webkit-fill-available;
	background: var(--darkeroverlay);
	backdrop-filter: blur(10px);
	padding: 2em;
	border: var(--border);
}

.post_box {
	display: flex;
	background: none;
	backdrop-filter: none;
	justify-content: center;
	align-items: center;
	padding: .8em 0;
}

.modal .census_row hr, .post_box hr {
	flex: 1;
	margin: 0 1em;
}

#display_foruks {}

#display_forums .overlay {
	background: var(--darkeroverlay);
}

#display_forums .description {
	opacity: 1;	
}

.post_box a.post_link {text-transform: none;}

/* --- POST STYLES --- */
#posts_container {
	padding: 0;
}

.post {
	margin: 1em auto 2em;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-items: stretch;
	align-content: stretch;
	background: var(--blurredbg);
	background-repeat: no-repeat;
	background-position: 50% 5%;
	background-size: cover;
	background-attachment: fixed;
}

.post_author {
	flex: 1;
	overflow: hidden;
	background: var(--darkeroverlay);
	padding: 2em;
	color: var(--whitecolor);
	font-size: 10px;
	letter-spacing: 1px;
	text-transform: uppercase;
	text-shadow: 0 0 5px;
	border: var(--lightborder);
}

.tfoot {
	margin: 0 auto;
	text-align: center;
}

.quick_reply {
	background: var(--blurredbg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 5%;
	background-attachment: fixed;
	border-spacing: 0;
	border: var(--lightborder);
	margin-bottom: 5em;
}

.quick_reply td {
	background: var(--darkeroverlay);
	padding: 2em;
}

.quick_reply .tfoot {
	padding-top: 0;
}

#OOC .ic_info, #OOC .author_mood, #OOC .pvp_category {
	display: none;
}

#IC .ooc_info, #IC .triggers {
	display: none;
}

.flip-card {
  width: -webkit-fill-available;
  height: 500px;
  perspective: 1000px;
  position: relative;
}

.flip-card-inner {
  width: 100%;
  height: 100%;
  position: relative;
  background-size: cover;
  background-position: 50% 50%;
  text-align: center;
  outline: var(--lightborder);
  transition: transform 0.6s;
  transform-style: preserve-3d;
}

.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

.flip-card-front,
.flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  backface-visibility: hidden;
}

.flip-card-back {
  transform: rotateY(180deg);
}

.author_information,
.author_statistics {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: space-between;
  gap: 2em;
  height: 100%;
  padding: 2em;
  box-sizing: border-box;
}


.author_statistics {
	background: var(--darkeroverlay);
}

.author_name span {
	display: block;
	padding: 1em;
	text-align: center;
	outline: var(--lightborder);
	margin: 2em 0;
}

.author_title, .starshards, .player, .pvp_category, .triggers, .author_mood {
	background: var(--overlay);
	padding: 1em;
	color: var(--theadcolor);
	font-size: 10px;
	letter-spacing: 1px;
	text-shadow: 0 0 5px;
	text-transform: uppercase;
	outline: var(--lightborder);
}

.author_cell {
	flex: 1;
	flex-basis: 33.33%;
	display: flex;
	flex-direction: row;
	justify-content: center;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
}

.author_cell hr {
	flex: 1;
	margin: 0 1em;
}

.pvp_category, .triggers, .author_mood {
	margin: 2em 0;
	background: var(--overlay);
	padding: 1em;
	text-align: center;
}

.Hostile.pvp_category {
}

.post_content {
	flex: 30%;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	background: var(--overlay);
	border: var(--lightborder);
	border-left: 0;
	align-content: center;
}

.post_head, .post_body, .signature, .post_meta {
	padding: 2em;
	border-bottom: var(--lightborder);
}

.post_head, .post_meta {
	background: var(--darkeroverlay);
	font-size: 8px;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.post_body {
	flex: 1;
	display: flex;
	justify-content: space-evenly;
	align-items: center;
	background: var(--overlay);
	flex-direction: column;
}

h1, h2, h3 {
	font: var(--fancy);
	text-transform: uppercase;
	margin: 0;
}

h1 { font-size: 25px; }
h2 { font-size: 20px; }
h3 { font-size: 17px; }

.signature, .post_meta {
	background: var(--darkeroverlay);
	border: 0;
}

blockquote {
	background: var(--overlay);
	margin: 0;
	padding: 2em;
	text-align: justify;
	border: var(--lightborder);
}

cite {
	padding-bottom: 1em;
	border-bottom: var(--lightborder);
	margin-bottom: 1em;
}

.post_controls {
	display: inline-flex;
	flex: 100%;
	flex-direction: row;
	flex-wrap: nowrap;
	align-content: flex-start;
	justify-content: space-evenly;
	align-items: stretch;
	background: var(--darkeroverlay);
	padding: 2em;
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 1px;
	border: var(--lightborder);
	border-top: 0;
}

.affiliates {
	margin-top: 3em;
	border: var(--lightborder);
}

.affiliates a {filter: grayscale(1); opacity: .4; }
.affiliates a:hover { filter: grayscale(0); opacity: 1; }
.affiliates a.concord_ad,
.affiliates a.macabre_ad { filter: none; opacity: 1;}
.affiliates a.concord_ad img:hover { box-shadow: var(--boxglow); transition: all 0.5s; }
.affiliates img {margin-right: 1em;border: var(--lightborder);box-shadow: var(--boxshadow); transition: all 0.5s; }

/* --- FOOTER STYLES --- */

section#footer {
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99999;
  position: relative;
  display: flex;
  background: var(--blurredbg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50% 5%;
  padding-top: 5px;
  box-shadow: var(--boxshadow);
  flex-direction: column-reverse;
}

section#footer .title {
  padding-bottom: .3em;
}

section#footer a:link,
section#footer a:active,
section#footer a:visited {
  font-weight: bold;
  text-transform: uppercase;
  text-shadow: ;
}

/* --- FORUM STAT STYLES --- */

#info, #online {
  text-align: center;
  background: var(--darkeroverlay);
  padding: 2em;
}

#online { padding: 2em 0; }

.theme {
}

/* --- SCREEN FRIENDLY --- */

@media only screen and (max-width: 1000px) {

	.topbar-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
		font-size: 18px;
	}

	#topbar svg, .topbar-left, 
	.info-tabs ul li:last-child, 
	section#index_stats, 
	.Out.of.Character .subforums, .Domains .subforums {
		display: none;
	}
	
	.topbar-left {
		padding: 0;
		display: none;
	}

	.topbar-center {
		padding: 1.5em 0;
	}

	.topbar-right {
		padding-left: 1em;
	}


	body.index section#banner, section#banner {
		height: 0;
	}
	
	.wrapper {
	  width: 90%;
	  min-width: 700px;
	 }
	
	.info-tabs, .recent_posts {
		flex-basis: 50%;
	}

	.forum_default .overlay {
	background: var(--darkeroverlay);
	backdrop-filter: brightness(.5) blur(10px);
	}

	.Out.of.Character {
		flex-direction: column;
	}

	.Out.of.Character .forum_info {
		border: 0;
	}

	.Godless.Lands {
		flex-direction: column;
	}
	
	.description {
		opacity: 1;
		height: auto;
		max-height: 100px;
	}
}
