:root {
	/* Colors */
	--accent-green: rgb(39, 186, 39);
	--lime-green: 0, 220, 0;
	--dark-green: 0, 110, 0;
	--white: 255, 255, 255;
	--black: 0, 9, 0;
	--alpha-7: 0.7;
	--alpha-9: 0.9;
	--alpha-full: 1;

	--clr-primary: rgba(var(--white));
	--clr-primary-no-focus: rgba(var(--white), var(--alpha-7));
	--clr-bg: rgba(var(--black), var(--alpha-full));
	--clr-accent: rgba(var(--lime-green), var(--alpha-full));
	--clr-accent-dark: rgba(var(--dark-green), var(--alpha-full));

	/* Font Families */
	--ff-base: Arial, Helvetica, sans-serif;
	--ff-accent: ;

	/* Font Weights */
	--fw-regular: 300;
	--fw-bold: 500;
	--fw-regular: 500;

	/* Font Sizes */
	--fs-16: 1rem;
	--fs-400: 1.125rem;
	--fs-32: 2rem;
	--fs-48: 3rem;
	--fs-64: 4rem;

	/* Spacings */
	--side-spacing: var(--fs-32);
	--top-bottom-spacing: calc(var(--side-spacing)/2);

	scroll-behavior: smooth;
}

html {
	color-scheme: dark;
	/* scroll-padding: 1rem; */
	/* scrollbar-color: var(--darker-green) var(--accent-green) ; */
}

/* html::-webkit-scrollbar {
    max-width: .8vw;
}
html::-webkit-scrollbar-track {
    background-color: var(--darker-green);
}
html::-webkit-scrollbar-thumb {
    background-color: var(--accent-green);
    border-radius: 100px;
    margin: 10px;
} */
body {
	display: flex;
	flex-direction: column;
	position: relative;
	margin: 0;
	width: 100%;
	min-height: 100svh;
	background: var(--clr-bg);
	color: var(--clr-primary);
	font-family: var(--ff-base);
	align-items: center;
}

*,
*::after,
*::before {
	box-sizing: border-box;
}

@keyframes fadeInAnimation {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

.wrapper {
	/* display: none; */
	/* scroll-behavior: inherit; */
	/*height: 100svh; */
	width: 100%;
	/* min-width: 98svw; */
	height: inherit;
	/* background: aqua; */
	animation: fadeInAnimation ease 1500ms;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
	/* overflow-y: auto; */
	/* perspective: 10px;

    
    
    
    
    align-content:start; */
}

.content {
	margin: 0 var(--side-spacing);
	/* background: orange; */
	padding-bottom: 5.5rem;
	flex: 1;
}

main {
	position: static;
	/* background: blueviolet; */
	text-align: center;
	display: inline-flex;
	flex-direction: column;
}

.main {
	padding-top: 80px;
}

h1 {
	/* font-size: 7rem; */
	font-size: clamp(3.5rem, 10vw, 7rem);
	font-weight: 900;
	line-height: 1.2;
}

h2 {
	/* font-size: 3.5rem; */
	font-size: clamp(2rem, 5vw, 3.5rem);
	font-weight: 700;
	line-height: 1.2;
}

h3 {
	width: max-content;
	font-size: 1.2rem;
	line-height: 1.5;
}

p {
	margin: 6vh 5vw 0vh;
	font-size: 2.25vh;
	line-height: 1.5;
	/* max-width: 75ch; */
	text-align: justify;
}

a {
	text-decoration: none;
	color: rgba(var(--white), var(--alpha, 1));
}

img {
	max-width: 100%;
}

.prevent-select {
	-webkit-user-select: none;
	/* Safari */
	-ms-user-select: none;
	/* IE 10 and IE 11 */
	user-select: none;
	/* Standard syntax */
}