* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
html {
	font-family: 'Open Sans', sans-serif;
	background-color: #C9F3FF;
}
h1 {
	margin: 50px 0;
	color: #3E707F;
	text-transform: uppercase;
	text-align: center;
}
.game {
	text-align: center;	
}
.game-board {
	margin: 50px 0;
	position: relative;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 60%;
	height: 60vh;
	display: flex;
	flex-wrap: wrap;
}
.game-board div.tile {
	flex-basis: 15%;
	flex-grow: 1;
	height: 15vh;
	border: 4px solid #7DE1FF;
	cursor: pointer;
	transition: .3s;
	border-radius: 15px;
	margin: 3px;
}
.game-score {
	position: relative;	
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	display: block;
	width: 60px;
	height: 60px;
	border-radius: 6px;
	background-color: #3E707F;
}
.game-start {	
	background-color: #64B4CC;
	margin: 30px;
	padding: 15px 30px;
	font-size: 20px;
	color: #C9F3FF;
	border: none;
	border-radius: 6px;
	text-transform: uppercase;
	letter-spacing: 3px;
	cursor: pointer;	
	transition: .3s;
}
.game-start:hover {
	background-image: linear-gradient(#64B4CC, #79bed2);
}
.game-board div {
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
.apricots {
	background-image: url(images/apricots.jpg);
}
.bananas {
	background-image: url(images/bananas.jpg);
}
.blackberries {
	background-image: url(images/blackberries.jpg);
} 
.blueberries {
	background-image: url(images/blueberries.jpg);
}
.cherries {
	background-image: url(images/cherries.jpg);
}
.gooseberries {
	background-image: url(images/gooseberries.jpg);
}
.kiwi {
	background-image: url(images/kiwi.jpg);
}
.lime {
	background-image: url(images/lime.jpg);
}
.pears {
	background-image: url(images/pears.jpg);
}
.plums {
	background-image: url(images/plums.jpg);
}
.raseberries {
	background-image: url(images/raspberries.jpg);
}
.strawberries {
	background-image: url(images/strawberries.jpg);
}
.off {
	background-image: url(images/fruit.jpg);
	opacity: 0.4;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
.hidden {
	background-image: url(images/fruit.jpg);
	opacity: 0.8;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
@media (orientation: portrait) {
	/*.game-score {
		margin: 150px 0 20px;
	}*/
	.game-board div.tile {
		flex-basis: calc(100% / 4 - 6px);
		height: 12vh;
	}
}