html {
	height:100%;
}

body {
	height:100%;
}

.bd {	
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 430px;
    height: auto;
	min-height: 620px;
}

.high {
	position: relative;
	margin-top: 0px;
	height: 0px;
	width: 430px;
}

.content {
	position: relative;
	margin-top: 1px;   
	width: 430px;
	height: auto;
	min-height: 300px;
	text-align: center;
	padding: 20px 0;
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1rem;
}

.content a
{
	font-weight: bold;
}

.content p
{
	padding: 10px 0;
}

* {
	margin:0;
	padding:0;
}

.distance { 
	width: 1px;
	height: 50%;
	margin-bottom: -16em; /* half of container's height */
	float: left;
}

.container {
	margin: 0 auto;
	position: relative; /* puts container in front of distance */
	text-align: left;
	height: 26em;
	clear: left;
}

@media only screen and (max-width: 768px) {

	.high {
		display: none;
	}
	
	img {
		width: 90%;
	}
	
	* {
		width: auto;
	}

	.distance { 
		display: none;
	}

	.container {
		margin: 0 auto;
		position: relative; /* puts container in front of distance */
		text-align: left;
		width: auto;
		height: auto;
		clear: left;
	}
}