In order to overlay text or images without creating whitespace, the text/images to be overlayed must be contained in a wrapper that has a defined height.

overlay-style.css

//For example
.school-directory-container{
  height: 250px;
}

.school-directory-copy{
	position:relative;
	top:-242px;
	font-size: 144%;
	width: 253px;
	margin-left:25px;
	font-weight:bold;
}

img.state-to-dir-button{
	position:relative;
	top:-232px;
	margin-left:25px;
}