#contact {
	display: flex;
	flex-direction: row;
	gap: 2svw;
	align-items: center;
	justify-content: center;
}

#contact img {
	border-radius: 100%;
	max-height: 250px;
	display: block;
	background-color: var(--card-background-color);
	padding: 0.5rem;
}

#contact div {
	display: flex;
	justify-content: center;
	/* flex: 0 0 48%; */
}

#contact div div {
	display: flex;
	flex-direction: column;
	flex-basis: auto;
}

#contact div ul {
	display: flex;
	flex-direction: column;
}

#contact div ul div {
	display: flex;
	flex-direction: row;
}

#contact a {
	text-decoration: none;
	color: inherit;
}

#contact h4 {
	text-align: center;
	margin-bottom: 0px;
}

#contact div ul {
	list-style-type: none;
	gap: 1svh;
	padding: 0px;
}

#contact div ul li {
	/* display: flex;
	justify-content: flex-start; */
	/* text-wrap: nowrap; */
	padding-right: 1svw;
	background-color: var(--card-background-color);
	border-radius: var(--card-border-radius);
	/* border: 1px solid whitesmoke; */
	padding: 0.5svh 1svw;
}

#contact div ul li a {
	display: flex;
	flex-direction: row;
	align-items: center;
}

#contact div ul li a div {
	display: flex;
	flex-direction: column;
}

#contact ul li p {
	padding: 0px;
	margin: 0px;
}

#contact ul li img {
	height: var(--img-width);
	width: var(--img-height);
	object-fit: contain;
	border-radius: 0px;
	background-color: transparent;
	filter: invert() hue-rotate(180deg);
}

@media only screen and (max-width: 430px) {
	#contact ul li img {
		display: none;
	}
	#contact img {
		border-radius: 100%;
		max-width: 100%;
		max-height: 250px;
		display: block;
	}
}