/* ======================== */
/* GENERIC STYLING          */
/* ======================== */

footer {
	position:relative;
    box-shadow:inset 0px 3px 3px var(--colSecondaryLight), 0px -3px 3px rgba(0, 0, 0, 0.25);
	background:linear-gradient(180deg, var(--colSecondaryMid), var(--colSecondaryDark));
}

#footer {
	display:flex;
	align-items:center;
	gap:16px;
	margin:0px auto;
	padding:24px 16px;
	max-width:1000px;
}

#footerLogo {
	display:inline-block;
	position:relative;
	flex-shrink:0;
	border-radius:5px;
	width:200px;
	overflow:hidden;
	line-height:0px;
}

#footerLogo img {
	width:100%;
}

#footerLogo:after {
	position:absolute;
	inset:0;
	content:"";
}

#footerLogo:hover:after, #footerLogo:focus:after {
	background:rgba(255, 255, 255, 0.15);
}

#footerLogo:active:after {
	background:rgba(0, 0, 0, 0.15);
}

#footerContent {
	display:flex;
	flex-direction:column;
	gap:8px;
	color:var(--colPrimaryLight);
	font-weight:bold;
	font-size:13px;
}

#footerContent a {
	color:var(--colOrangeMid);
	text-decoration:none;
}

#footerContent a:hover, #footerContent a:focus {
	color:var(--colOrangeLight);
	text-decoration:underline;
}

#footerContent a:active {
	color:var(--colOrangeDark);
}

#footerLinks {
	display:flex;
	gap:16px;
}

@media (max-width: 1000px) {
	#footer {
		flex-direction:column !important;
	}
}