@import 'indexfile.css';

img {
  width: 40%;
}


* {box-sizing: border-box}

/*Container needed to position overlay */
.container{
	position: relative;
	width: 100%;
	max-width: 1000px;
}

/* Make image responsive */
.image {
	display: block;
	width: 100%;
	height: auto;
}

/* Overlay will lay on top of image*/
.overlay {
	position: absolute;
	bottom: 0;
	background: rgb(0,0,0);
	background: rgba(0,0,0,0.5); /* Black see-through */
	color: #f1f1f1;
	transition: .5s ease;
	opacity: 0;
	color: white;
	font-size: 20px;
	padding: 20px;
	text-align: centre;
}

/* Mouse hover to give title */
.container:hover .overlay{
	opacity: 1;
}