style.css

body{
	background-image: url('sky-and-clouds.jpg');
	background-size: cover;
	height: 100%;
	}
.birdTitle {
	color: gray;
}
.startGame{
	position: absolute;
	top: 50%;
	left: 50%;
}
#start{
	background-color: rgb(0,100,100);
	font-weight: bold;
	font-size: 15px;
	border-radius: 15px;
	width: 100px;
	height: 50px;
}
#start:hover{
	cursor: pointer;
	color: skyblue;
}
@media only screen and (max-width: 600px) {
	h1 {
		font-size: 20px;
	}
	h2 {
		font-size: 15px;
	}
  body{
		background-image: url('sky-and-clouds-rotated.jpg');
		height: 50%;
	}
	.startGame{
		position: absolute;
		top: 50%;
		left: 50%;
	}
	#start{
		background-color: rgb(0,100,100);
		color: white;
		font-weight: bold;
		font-size: 15px;
		border-radius: 15px;
		width: 100px;
		height: 50px;
	}
	#start:hover{
		cursor: pointer;
		color: skyblue;
	}
	img {
		height: 30px;
		width: 30px;
	}
	.wrapper{
    transform: rotate(90deg);
    transform-origin:bottom left;
    
    position:absolute;
    top: -100vw;
    left: 0;
    
    height:100vw;
    width:100vh;

    overflow:auto;
	}
}