.memoryGameContainer {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	overflow: hidden;
	text-align: center;
}
.memoryGameDeck {
	max-width: 500px;
	margin: 0 auto;
	background: #e3deff;
	padding: 16px;
	border-radius: 10px;
}

.memoryGameCardLarge {
		height: 120px;
		width: 120px;
		background: #9187d3;
		display: inline-block;
		margin: 8px;
		line-height: 18px;
		font-size:18px;
		color: white;
		text-align: center;
		border-radius: 8px;
		vertical-align: top;
		cursor: pointer;
		transform: rotateY(180deg);
		transform-style: preserve-3d;
		transition: transform .3s ease;
}

.memoryGameCardLarge.open {
	transform: rotateY(0);
	background: #89C4FF;
	cursor: default;
}
.memoryGameCardLarge.show {

}
.memoryGameCardLarge.open.show {
	transform: rotateY(0);
	background: #89C4FF;
	cursor: default;
}
.memoryGameCardLarge.match {
	transform: rotateY(0);
	cursor: default;
	background: #55ccaa;
}
.memoryGameCardLarge.open.match {
	transform: rotateY(0);
	cursor: default;
	background: #55ccaa;
}
.memoryGameCardLarge.open.notmatch {
	background: #fb7179;
}
.memoryGameCardLarge:hover:not(.open, .match) {
	background: #776ac8;
}
	
.memoryGameCard {
		height: 90px;
		width: 90px;
		background: #9187d3;
		display: inline-block;
		margin: 8px;
		line-height: 18px;
		font-size:18px;
		color: white;
		text-align: center;
		border-radius: 8px;
		vertical-align: top;
		cursor: pointer;
		transform: rotateY(180deg);
		transform-style: preserve-3d;
		transition: transform .3s ease;
}

.memoryGameCard.open {
	transform: rotateY(0);
	background: #89C4FF;
	cursor: default;
}
.memoryGameCard.show {

}
.memoryGameCard.open.show {
	transform: rotateY(0);
	background: #89C4FF;
	cursor: default;
}
.memoryGameCard.match {
	transform: rotateY(0);
	cursor: default;
	background: #55ccaa;
}
.memoryGameCard.open.match {
	transform: rotateY(0);
	cursor: default;
	background: #55ccaa;
}
.memoryGameCard.open.notmatch {
	background: #fb7179;
}
.memoryGameCard:hover:not(.open, .match) {
	background: #776ac8;
}

@media only screen and (max-width: 768px) {
	.memoryGameDeck {
		padding: 8px;
	}
	
	.memoryGameCard {
		margin: 4px;
	}
}

*::selection {
	background: transparent;
}