#portfolio{
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	max-width: 1280px;
	justify-content: center;
	margin-top: 20px;
}

.item{
	width: 200px;
	height: 280px;
	margin: 10px;
	background: white;
	border-radius: 10px;
	color: black;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	user-select: none;
	border: 4px solid white;
	transition: all 0.3s ease;
}
.item:hover{
	filter:brightness(1.2);
}

.ybgc{
	background: #f2a008 url('../img/ybgc_logo.png') center center no-repeat;
	background-size: 250%;
}
.dw{
	background: url('../img/DW_logo.png') 44% 50% no-repeat;
	background-size: cover;
}
.threshold{
	background: url('../img/threshold.png') 50% 50% no-repeat;
	background-size: cover;
}
.oq{
	background: url('../img/quest.png') 50% 50% no-repeat;
	background-size: cover;
}
.mcs{
	background: url('../img/mcs.png') 50% 50% no-repeat;
	background-size: cover;
}
.puzzlerun{
	background: url('../img/puzzlerun.png') 50% 50% no-repeat;
	background-size: cover;
}
.clueup{
	background: url('../img/clueup.png') 50% 50% no-repeat;
	background-size: cover;
}