body, html {
	height: 100%;
	font-family: 'Arial', sans-serif;
	color: #ffffff;
	margin:0;
	background-color:#000000;
}

.bg {
	/* The image used */
	background-image: url("assets/tabletennis.jpg");

	/* Full height */
	height: 100%;

	/* Center and scale the image nicely */
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}



.caption{
	width:90%;
	margin: auto;
	text-align:center;
	
	position: absolute;
  	top: 50%;
  	left: 50%;
  	transform: translate(-50%, -50%);

}

.headline{
	font-weight: 900;
	font-size:40px;
	line-height:40px;
	margin-bottom: 40px;
}

.subline{
	font-weight: 300;
	font-size:20px;
	line-height:24px;
	margin-bottom: 40px;
}

.button_kt {
	background-color: #007acc;
	border: none;
	color: white;
	padding: 14px 28px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 24px;

}

.button_kt:hover {
	transition-duration: 0.4s;
	background-color: #005c99;

}


@media only screen and (min-width: 800px) { 

.caption{
	width:70%;
}

.headline{
	font-weight: 900;
	font-size:70px;
	line-height:70px;
	margin-bottom: 40px;
}

.subline{
	font-weight: 300;
	font-size:30px;
	line-height:34px;
	margin-bottom: 40px;
}


} 

@media only screen and (min-width: 1100px) { 

.caption{
	width:70%;
}

.headline{
	font-weight: 900;
	font-size:100px;
	line-height:90px;
	margin-bottom: 40px;
}

.subline{
	font-weight: 300;
	font-size:30px;
	line-height:34px;
	margin-bottom: 40px;
}


}