@charset "UTF-8";
/* Styling for Philip Heppeler Portfolio */

/* Colors:
	RED - #FF6258 - rgba(255, 98, 88, 1)
	DARK RED - #BF4B43 - rgba(191, 75, 67, 1)
	GRAY - #DEDDD9 - rgba(222, 221, 217, 1)
*/

#navigation {
	max-width: 1920px;
	background: linear-gradient(175deg, white, #DEDDD9);
	margin: 0 auto;
	position: sticky;
	top: 0;
}

.logo img {
	width: 60px;
	margin: 20px;
	transition-duration: 300ms;
}

.logo img:hover {
	transform: scale(1.1, 1.1);
}

.nav {
	text-decoration: none;
	display: inline-block;
	vertical-align: top;
}

.nav p {
	font-family: ff-enzo-web, sans-serif;
	font-size: 1.3em;
	font-weight: 700;
	margin: 34px 25px 0 0;
}

.nav p:hover {
	border-bottom: 2px solid #333;
}

.active {
	border-bottom: 2px solid #333;
}



/* Footer Styling */
footer {
	max-width: 1920px;
	margin: 0 auto;
	padding: 30px 50px 50px 50px;
	background-color: #D1D1D1;
	box-sizing: border-box;
}

.logo-footer img {
	width: 50px;
	margin: 5px;
}

.nav-footer {
	text-decoration: none;
	display: inline-block;
	margin: 4px 0 0 15px;
	vertical-align: top;
}

.nav-footer p {
	font-family: ff-enzo-web, sans-serif;
	font-size: 1.3em;
	font-weight: 700;
}

#modified {
	font-size: 0.75em;
	margin: 15px 5px;
}



/* 1st Responsive Adjustments */
@media screen and (max-width: 800px) {
	.logo img {
		width: 50px;
	}

	.nav p {
		margin-top: 29px;
		margin-right: 15px;
	}

	footer {
		padding: 30px 20px 50px 20px;
	}

	.nav-footer {
		margin-left: 5px;
	}
}



/* Dark Mode Styling */
@media (prefers-color-scheme: dark) {
	#navigation {
		background: linear-gradient(175deg, #404040, #333);
	}

	.logo img, .logo-footer img {
		border: 2px solid #DEDDD9;
		background-color: #DEDDD9;
	}

	.nav p:hover, .active {
		border-bottom: 2px solid white;
	}

	footer {
		background-color: #404040;
	}
}