.project-section {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	column-gap: 1svw;
}
.project-card {
	flex: 0 1 30%;
	margin-bottom: 3svh;
	background-color: var(--card-background-color);
	border-radius: var(--card-border-radius);
}

@media only screen and (max-width: 800px) {
	.project-card {
		flex: 0 1 auto;
	}
}

.project-card img {
	max-width: 100%;

	justify-self: center;
	padding-top: 1svh;
	object-fit: contain;
	color: transparent;
	display: flex;
	aspect-ratio: 3/2;
}

.project-title-info {
	display: flex;
	flex-direction: row;

	border-bottom: var(--underlineTitle);
	border-radius: var(--underlineTitleBorderRadius);
	margin: 0px 2svw;
	padding: 0px 2svw;

	justify-content: space-between;
	align-items: center;
	flex-wrap: nowrap;
}
.project-title-info h3 {
	margin: 0px;
	text-align: start;
	white-space: nowrap;
	align-self: center;
	font-weight: normal;
	text-wrap: wrap;
	border-radius: var(--underlineTitleBorderRadius);
}

.project-title-info img {
	height: var(--img-width);
	width: var(--img-height);
	margin: 1svh 6px;
	padding: 0px;
	filter: invert() hue-rotate(180deg);
}

.project-title-info div {
	display: flex;
	gap: 1svw;
	justify-content: flex-end;
	border-bottom: none;
}

.project-card div p {
	display: flex;
	width: 90%;
	justify-self: center;
	text-align: start;
}

.project-tech-logos {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	align-self: center;
	width: 90%;
	justify-content: flex-start;
	column-gap: 0.5svw;
	row-gap: 1svw;
	padding-left: 2svw;
	padding-bottom: 1svh;
}

.project-tech-logos img {
	aspect-ratio: 1;
	height: var(--img-width);
	width: var(--img-height);

	/* flex: 0 1 19%; */
}