html {
	margin-top: 80px;
	margin-left: 30px;
}

body {
	text-align: center;
	font-family: 'Roboto', sans-serif;
	font-size: 40px;
	font-weight: 500;
}

ul {
	line-height: 1.5em;
}

img {
	width: 300px;
	height: 300px;
	padding-right: 20px;
	opacity: 1;
}

img:hover {
	opacity: 0.5;
	transition: opacity 0.8s;
}

#exclamation {
	position: absolute;
	top: 20px;
	bottom: 10px;
	left: 1330px;
	right: 10px;
	font-family: 'Roboto', sans-serif;
	font-size: 25px;
	font-weight: 400;
	color: black;
}

#question {
	position: absolute;
	top: 20px;
	font-family: 'Roboto', sans-serif;
	font-size: 25px;
	font-weight: 400;
	color: black;
	left: 50px;
}

.wrapper .text {
	position:relative;
	bottom:205px;
	visibility:hidden;
	float: left;
}

#dylan {
	left: 110px;
}

#onyou {
	left: 110px;
}

#alfie {
	left: 115px;
}

.wrapper:hover .text {
	visibility:visible;
}

.wrapper {
	width: 300px;
	height: 300px;
}

.text {
	font-family: 'Roboto', sans-serif;
	font-size: 30px;
	font-weight: 500;
}

#one {
	position: absolute;
	top: 250px;
	left: 230px;
}

#two {
	position: absolute;
	top: 250px;
	left: 560px;
}

#three {
	position: absolute;
	top: 250px;
	left: 890px;
	line-height: 34px;
	text-align: center;
}