body {
	text-align: center;
	font-family: 'Kalam', cursive;
	background: #dfbcff;
	background: radial-gradient(circle, rgba(223,188,255,1) 8%, rgba(255,245,245,1) 100%);
}

h1 {
	line-height: 1em;
}

h2 {
	line-height: 1em;
	font-size: 1em;
}

a {
	color: black;
}

img {
    width: 24%;
    height: 200px;
    object-fit: cover;
    border-radius: 10px;
}

.container {
  position: relative;
  text-align: center;
  color: white;
  cursor: pointer;
}

.container:hover {
	opacity:0.8;

}

.container:active {
	opacity:0.5;
}

.text-overlay {
  position: absolute;
  bottom: 12px;
  left: 5px;
  color: white;
  font-size: 2em;	
  font-weight: 600;
  background: #A354BBAA;
  z-index: 100;
  user-select: none;
}

@media (max-width: 800px){
 img {
    width: 48%;
}
 
}