.circle {
	background-size:100% 100%;
	margin: 45% 25%;
	border-radius: 50%;
	height: 50%;
	width: 60%;
	transition: all .3s ease-in-out;
	
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.circle:hover {
	border-radius:2%;  
	cursor: pointer;
}

.text {
	font-family: Work Sans;
	color: gray;
	font-size: 1.8vmin;

	height: 50%;
	background-color: rgba(10,10,10,0.8);
	color: #fff;
	opacity: 0;
	text-align: center;
	transition: all .3s ease-in-out;
	
	display: flex;
	justify-content: center;
	align-items: center;
}

.circle:hover .text {
	opacity: 1;
}