/* REGULAR SCANLINES SETTINGS */

.scanlines {
	position: relative;
	top: 0;
	left: 0;
	align-items: center;
	justify-content: center;
	min-height: 100dvh;;
}

.scanlines::before,
.scanlines::after {
	position: absolute;
	display: block;
	content: '';
	pointer-events: none;
}


/* Static scanlines overlay */
.scanlines::after {
	z-index: 2147483648;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	animation: scanlines 1.5s steps(100) infinite;
	background: linear-gradient(
			to bottom,
			transparent 50%,
			rgba(0, 0, 0, 0.3) 51%
	);
	background-size: auto 4px;
}

/* Animate unique scanline */
@keyframes scanline {
	0% {
		transform: translate3d(0, 95000%, 0);
	}
}

/* Animate scanline flicker effect */
@keyframes scanlines {
	0% {
		background-position: 0 50%;
	}
}

@font-face {
	font-family: 'Terminus';
	src: url(30593de33b541800797b.ttf) format('truetype');
}

@font-face {
	font-family: 'Blackletter';
	src: url(b53bf5395febe496a7a0.ttf) format('truetype');
}

@font-face {
	font-family: 'Calling Code';
	src: url(0bbb9410d698987fb4c5.ttf) format('truetype');
}

@font-face {
	font-family: 'Courier Prime';
	src: url(7503a2e9660bb6f608fb.ttf) format('truetype');
}

@font-face {
	font-family: 'Mohica Demo';
	src: url(d6b00e508303fbde67ac.otf) format('opentype');
}

* {
	color: #acfa70;
	background: none;
	-webkit-font-smoothing: none;
}

html, body {
	background: #111111;
}

.nav-button {
	font-family: 'Courier Prime', cursive;
	font-size: 2em;
	border: none;
	background-color: #2d332088;
}

.nav-button:hover {
	color: white;
	background-color: #98d560;
}

.main-container {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.index-root {
	display: flex;
	align-items: center;
	flex-direction: column;
	width: 100%;
	height: 100%;
}

.personal-links {
	position: relative;
	align-self: center;
	display: flex;
	align-items: center;
	flex-direction: row;
}

.git-icon, .linkedin-icon {
	scale: 0.75;
}

.git-icon:hover, .linkedin-icon:hover {
	rotate: 12deg;
	filter: hue-rotate(20deg);
}

.index-header {
	font-family: 'Mohica Demo', cursive;
	font-size: 10.8vh;
	position: relative;
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
	color: whitesmoke;
	text-shadow: 5px 5px 5px #3c502f;
	rotate: -3deg;
}

.index-header-message-subtitle {
	font-family: "Courier Prime", Courier, monospace;
	font-size: 0.1em;
	position: relative;
	bottom: 13em;
	left: 2em;
	rotate: -3deg;
}

.tm-sign {
	font-size: 3.0vh;
	position: relative;
	top: 2.0em;
	height: 1em;
	rotate: 3deg;
}


.index-header-message-signature {
	font-size: 6.8vh;
	position: relative;
	bottom: -2em;
	left: -1em;
	text-align: right;
}

.index-header-timer {
	font-family: 'Courier Prime', monospace;
	display: flex;
	justify-content: center;
	rotate: 3deg;
}

.index-header-time-since {
	font-size: 1.5vh;
	text-align: right;
}

.index-header-rect {
	position: relative;
	top: 1.23em;
	left: 0.2em;
	width: 1vh;
	height: 1.50vh;
	animation: cursor-flash 500ms infinite alternate;
	background: #98d560;
}

@keyframes cursor-flash {
	from {
		opacity: 0.5;
	}

	to {
		opacity: 0;
	}
}
.git-page {
	display: inline-flex;
	flex-direction: column;
	background-color: transparent;
	scale: 0.5;
}

.git-graph {
	display: inline-grid;
	gap: 1px;
}

.commit {
	position: relative;
	z-index: 1;
	width: 2.0vh;
	height: 2.0vh;
}

.info-div {
	font-family: 'Courier Prime', monospace;
	font-size: 1.0vw;
	position: relative;
	z-index: 2;
	bottom: 20px;
	left: 40px;
	width: fit-content;
	height: fit-content;
	padding: 2px 25px;
	white-space: nowrap;
	background-color: #586f3833;
}

.graphTitleTop, .graphTitleBottom {
	font-family: 'Mohica Demo', cursive;
	font-size: 3.8vh;
	position: relative;
}

.graphTitleTop {
	text-align: left;
	rotate: 2deg;
}

.graphTitleBottom {
	top: 1.5em;
	text-align: right;
	rotate: -2deg;
}

@media screen and (orientation: portrait) {
	.commit-wrapper {
		position: relative;
		width: 2.0vh;
		height: 2.0vh;
		margin: 0.2vh;
	}

	.commit {
		margin: 0.2vh;
	}

	.commit-hitbox {
		margin: 0.2vh;
	}

	.info-div {
	}
}

@media screen and (orientation: landscape) {

	.commit-wrapper {
		position: relative;
		width: 2.0vh;
		height: 2.0vh;
		margin: 0.2vw;
	}

	.commit-hitbox {
		margin: 0.2vw;
	}

	.commit {
		margin: 0.2vw;

	}

	.info-div {

	}
}

.commit0 {
	background-color: #181915;
}

.commit1 {
	background-color: #2d3320;
}

.commit2 {
	background-color: #43502c;
}

.commit3 {
	background-color: #586f38
}

.commit4 {
	background-color: #6e8f45
}

.commit5 {
	background-color: #83b252
}

.commit6 {
	background-color: #98d560
}

.commit7 {
	background-color: #acfa70
}

/*# sourceMappingURL=app.css.map*/