@font-face {
	font-family: 'Poppins';
	src: url('/resources/fonts/Poppins-Regular.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'Poppins';
	src: url('/resources/fonts/Poppins-Light.ttf') format('truetype');
	font-weight: 300;
	font-style: normal;
}

@font-face {
	font-family: 'Poppins';
	src: url('/resources/fonts/Poppins-Medium.ttf') format('truetype');
	font-weight: 500;
	font-style: normal;
}

@font-face {
	font-family: 'Poppins';
	src: url('/resources/fonts/Poppins-SemiBold.ttf') format('truetype');
	font-weight: 600;
	font-style: normal;
}

@font-face {
	font-family: 'Poppins';
	src: url('/resources/fonts/Poppins-Bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
}

:root {
	/* Primary Color */
	--next-primary: #0D3817;
	/* Secondary (Accent) Color */
	--next-secondary: #00D773;
	/* Tertiary Color */
	--next-tertiary: #8B634B;
	/* Accent (White) */
	--next-accent: #FFFFFF;
}

/* Utility classes for easy color use */
.bg-primary {
	background-color: var(--next-primary) !important;
}

.bg-secondary {
	background-color: var(--next-secondary) !important;
}

.bg-tertiary {
	background-color: var(--next-tertiary) !important;
}

.bg-accent {
	background-color: var(--next-accent) !important;
}

.txt-primary {
	color: var(--next-primary) !important;
}

.txt-secondary {
	color: var(--next-secondary) !important;
}

.txt-tertiary {
	color: var(--next-tertiary) !important;
}

.txt-accent {
	color: var(--next-accent) !important;
}

/* Button overrides */
.btn-accent {
	background-color: var(--next-accent);
	color: var(--next-primary);
	border: 2px solid var(--next-primary);
	transition: background .2s, color .2s;
}

.btn-accent:hover, .btn-accent:focus {
	background-color: var(--next-secondary);
	color: var(--next-primary);
}

.btn-tertiary {
	background-color: var(--next-tertiary);
	color: var(--next-accent);
	border: none;
	transition: background .2s;
}

.btn-tertiary:hover, .btn-tertiary:focus {
	background-color: var(--next-primary);
	color: var(--next-accent);
}

/* Font Weights (for Poppins) */
.fw-light {
	font-weight: 300 !important;
}

.fw-medium {
	font-weight: 500 !important;
}

.fw-semibold {
	font-weight: 600 !important;
}

.fw-bold {
	font-weight: 700 !important;
}

.xxl-font {
  font-size: clamp(2rem, 8vw, 60px);
}

.xl-font {
	font-size: 50px;
}

.l-font {
	font-size: 30px;
}

.m-font {
	font-size: 20px;
}

a {
	text-decoration: none;	
}

body, h1, h2, h3, h4, h5, h6, .btn {
	font-family: 'Poppins', Arial, sans-serif;
}

body {
	background-color: var(--next-primary) !important;
	background-image: url('/resources/images/body-bg.jpg');
	background-position: center right;
	background-repeat: no-repeat;
	background-size: cover;
}

header {
	padding: 40px 0px;
}

.hero-photo {
	background-image: url('/resources/images/Next-Level_Hero-Photo.jpg');
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 400px;
	border-radius: 20px;
}

.landing-pg-button {
	color: #fff;
	border: 2px solid var(--next-secondary);
	padding: 8px;
	text-decoration: none;
	letter-spacing: 5px;
	font-weight: 600;
}

.ld-pg-button {
	border: 2px solid var(--next-secondary);
	border-radius: 10px;
	margin: 10px auto;
	padding: 14px;
	text-decoration: none;
	text-align: center;
	letter-spacing: 5px;
	font-weight: 700;
	width: 80%;
	display: inline-block;
	font-size: 12px;
}

.landing-pg-resume-button {
	background-color: #fff;
	color: var(--next-primary);
}

.landing-pg-signup-button {
	background-color: var(--next-secondary);
	color: #fff;
}


@media (max-width: 1400px) {
	.xxl-font {
	  	font-size: 50px;
	}
	.xl-font {
		font-size: 30px;
	}
	
	.l-font {
		font-size: 20px;
	}
	
	.m-font {
		font-size: 15px;
	}	
	
}