* {
	font-family     : 'SF Pro Display', 'SF Pro Text', 'Trebuchet MS', Helvetica, 'Helvetica Neue', sans-serif;
	list-style-type : none;
	vertical-align  : middle;
	&:not(body, a) {-webkit-transition : all 0.25s;-o-transition : all 0.25s;transition : all 0.25s;}
	&:not(.Content_Box) {min-width : -webkit-fit-content;min-width : -moz-fit-content;min-width : fit-content;}
	&::-webkit-input-placeholder {
		color   : #888;
		opacity : 0.75;
		}
	&::-moz-placeholder {
		color   : #888;
		opacity : 0.75;
		}
	&:-ms-input-placeholder {
		color   : #888;
		opacity : 0.75;
		}
	&::-ms-input-placeholder {
		color   : #888;
		opacity : 0.75;
		}
	&::placeholder {
		color   : #888;
		opacity : 0.75;
		}
	&::-webkit-scrollbar, &::-moz-viewport-scroll {background : #613;}
	&::-webkit-scrollbar-thumb {background : #214;}
	}

img {-webkit-filter : drop-shadow(0 3px 6px rgba(0, 0, 0, 0.16));filter : drop-shadow(0 3px 6px rgba(0, 0, 0, 0.16));}

body {
	background-image : url(../Resources/background.webp);
	background-size  : 5%;
	overflow-x       : hidden;
	text-align       : center;
	}

div {
	-webkit-box-align : center;
	-ms-flex-align    : center;
	align-items       : center;
	height            : -webkit-fit-content;
	height            : -moz-fit-content;
	height            : fit-content;
	-webkit-box-pack  : center;
	-ms-flex-pack     : center;
	justify-content   : center;
	margin            : 10px auto;
	padding           : 10px 25px;
	}

nav {
	background      : url(/Resources/nav.webp) no-repeat center;
	background-size : 100% 100%;
	border          : 6px ridge #315;
	border-radius   : 0;
	bottom          : 0;
	left            : 0;
	padding         : 10px 5px;
	position        : fixed;
	top             : 0;
	width           : 200px;
	-webkit-filter  : drop-shadow(0 3px 6px rgba(0, 0, 0, 0.16));
	filter          : drop-shadow(0 3px 6px rgba(0, 0, 0, 0.16));

	.Header {
		font-size      : 1.5rem;
		margin         : 0.75rem auto;
		padding        : 10px 10px;
		-webkit-filter : drop-shadow(0 0 2px rgba(0, 0, 0, 0.12));
		filter         : drop-shadow(0 0 2px rgba(0, 0, 0, 0.12));
		}

	.Nav_Items {
		margin  : 10px auto;
		padding : 16px 12px;

		li {
			-webkit-backdrop-filter : blur(2px);
			backdrop-filter         : blur(2px);
			background              : rgba(255, 255, 255, 50%);
			font-size               : 1.5rem;
			margin                  : 10px auto;
			padding                 : 16px;
			width                   : 75%;
			-webkit-box-shadow      : 3px 3px 6px 0 rgb(204, 219, 232) inset, -3px -3px 6px 1px rgba(255, 255, 255, 0.5) inset;
			box-shadow              : 3px 3px 6px 0 rgb(204, 219, 232) inset, -3px -3px 6px 1px rgba(255, 255, 255, 0.5) inset; border-radius : 100px;

			&:hover:not(.Active_Page) {background : rgba(255, 255, 255, 20%);}
			&:not(.Active_Page) {cursor : pointer;}
			}
		}
	}


input, button {
	background-color : #222;
	color            : #BBB;
	}

p {font-size : 1.2rem;}

a {
	color                   : #000;
	-webkit-text-decoration : 0;
	text-decoration         : 0;
	}

dl a {
	display     : inline-block;
	line-height : 1.2em;
	}

h1 {
	font-size      : 3.5rem;
	font-weight    : 800;
	line-height    : 1vh;
	margin         : 0 auto 2.5% auto;
	padding        : 2.5%;
	text-shadow    : 1px 1px #555;
	text-transform : lowercase;
	width          : -webkit-fit-content;
	width          : -moz-fit-content;
	width          : fit-content;
	}

ul {
	-webkit-box-align : center;
	-ms-flex-align    : center;
	align-items       : center;
	background-color  : #626;
	border-radius     : 10px;
	-webkit-box-pack  : center;
	-ms-flex-pack     : center;
	justify-content   : center;
	list-style        : none;
	min-width         : -webkit-fit-content;
	min-width         : -moz-fit-content;
	min-width         : fit-content;
	width             : 100%;
	}

.Big_Box {
	height     : max-content;
	max-height : 100vh;
	max-width  : 100vw;
	padding    : 1%;
	width      : 75%;
	filter     : drop-shadow(0 3px 6px rgba(0, 0, 0, 0.16));
	}

.Interests {
	background            : rgba(255, 255, 255, 0.5);
	border                : 3px outset rgba(170, 170, 170, 0.5);
	display               : -webkit-box;
	display               : -ms-flexbox;
	display               : flex;
	-webkit-box-orient    : vertical;
	-webkit-box-direction : normal;
	-ms-flex-direction    : column;
	flex-direction        : column;
	margin                : 1.5%;
	padding               : 2.5%;
	-webkit-filter        : drop-shadow(0 3px 6px rgba(0, 0, 0, 0.16));
	filter                : drop-shadow(0 3px 6px rgba(0, 0, 0, 0.16));
	}

.Bolder {font-weight : bolder;}

.Tempie {
	border        : 7px ridge #205;
	border-radius : 15px;
	}

.Time {
	background   : #513;
	border       : 5px ridge #215;
	font-family  : 'Courier New', 'Courier', 'monospace', 'sans-serif';
	font-size    : 1.3rem;
	font-weight  : 900;
	margin-left  : auto;
	margin-right : auto;
	max-width    : 75vw;
	min-width    : -webkit-max-content;
	min-width    : -moz-max-content;
	min-width    : max-content;
	padding      : 0.75%;
	text-align   : center;
	}

.Info_Head {
	font-size   : 1.8rem;
	font-weight : 400;
	line-height : 3vh;
	}

.Img_Sub {
	color       : #FFF;
	font-size   : 1.8rem;
	font-style  : italic;
	font-weight : 400;
	text-align  : center;
	}

.Content_Box {
	background-color      : #226;
	border                : 6px ridge #224;
	display               : -webkit-box;
	display               : -ms-flexbox;
	display               : flex;
	-webkit-box-orient    : vertical;
	-webkit-box-direction : normal;
	-ms-flex-direction    : column;
	flex-direction        : column;
	height                : -webkit-fit-content;
	height                : -moz-fit-content;
	height                : fit-content;
	margin                : 0 auto 18px calc(50vw - 500px);
	padding               : 25px;
	width                 : 1200px;

	& * {margin : initial auto;}
	}

.Inputs-Time {
	background    : #67143A;
	border        : 2px solid #000;
	border-radius : 8px;
	margin        : 1.5%;
	padding       : 1.5%;
	}

.Sub {
	font-size  : xx-large;
	margin-top : 1.5%;
	}

#Project_Icon {
	background-color                   : #620D40;
	border                             : 3px solid #202;
	height                             : 250px;
	text-align                         : left;
	width                              : 215px;
	border-radius                      : 2px;
	cursor                             : pointer;
	padding                            : 5px 10px;
	-webkit-transition                 : all 450ms cubic-bezier(0.685, -0.025, 0.355, 1.650);
	-o-transition                      : all 450ms cubic-bezier(0.685, -0.025, 0.355, 1.650);
	transition                         : all 450ms cubic-bezier(0.685, -0.025, 0.355, 1.650);
	-webkit-transition-timing-function : cubic-bezier(0.685, -0.025, 0.355, 1.650);
	-o-transition-timing-function      : cubic-bezier(0.685, -0.025, 0.355, 1.650);
	transition-timing-function         : cubic-bezier(0.685, -0.025, 0.355, 1.650);
	&:hover {
		-webkit-filter : drop-shadow(2px 2px 0.4em #000);
		filter         : drop-shadow(2px 2px 0.4em #000);
		}

	.Title {
		font-size   : 1.2rem;
		font-weight : 750;
		margin      : 1px auto;
		padding     : 8px 0;
		}
	}

#Footer {
	font-size       : 1.3rem;
	text-decoration : underline;
	> em {
		margin      : 0;
		line-height : 0;

		cursor      : pointer;
		&:hover {-webkit-filter : invert();filter : invert();}
		&:active {scale : 0.9;}
		}
	}

div.Content_Box {
	display               : table;
	-webkit-box-orient    : vertical;
	-webkit-box-direction : normal;
	-ms-flex-direction    : column;
	flex-direction        : column;
	}

#Music {
	background            : #DDD;
	border                : 1px solid #000;
	border-radius         : 15px;
	display               : -webkit-box;
	display               : -ms-flexbox;
	display               : flex;
	-webkit-box-orient    : vertical;
	-webkit-box-direction : normal;
	-ms-flex-direction    : column;
	flex-direction        : column;
	height                : 200px;
	margin                : 10px auto;
	overflow              : hidden;
	padding               : 8px;
	-webkit-transition    : all 0.5s;
	-o-transition         : all 0.5s;
	transition            : all 0.5s;
	width                 : 450px;
	&:hover {
		-webkit-filter : invert();
		filter         : invert();
		height         : 500px;
		width          : 700px;
		& img {
			-webkit-filter : invert();
			filter         : invert();
			margin         : initial 0;
			}
		}
	}

#Artist_Bio {
	height     : fit-content;
	padding    : 7px;
	text-align : justify;
	width      : fit-content;
	}

table#Archive {
	justify-content : center;
	text-align      : center;
	width           : 100%;

	& th {
		color       : #FFF;
		font-size   : x-large;
		font-weight : bolder;
		&:not(.Decor) {
			background-color : #333;
			padding          : 12px;
			border           : outset 3px #000;
			}
		&.Decor {
			background-color : #222;
			border           : outset 2px #000;
			}
		}
	}

.Eventful {
	position           : absolute;
	z-index            : 100;
	-webkit-transition : 0.2s ease-in-out;
	-o-transition      : 0.2s ease-in-out;
	transition         : 0.2s ease-in-out;
	}

canvas {
	position       : absolute;
	z-index        : 100;
	pointer-events : none;
	}

#BmzvizgBpmLqdi {
	width  : 100%;
	height : 750px;
	}