april.css

html, body{
	margin: 0;
	padding: 0;
}

#sidebar{
	font-family: 'Helvetica';
	padding: 10px;
	position: fixed;
	width: 300px;
	height: 100vh;
	background-color: black;
	color: white;
	box-shadow: 3px 0px 6px 0px rgba(174,174,174,0.50);
	opacity: 0.5;
}

#sidebar:hover{
	opacity: 1;
}


.image{
	display: block;
	width: 100%;
	height: 100%;
}

.image img{
	width: 100%;
	height: 100%;
}

.image p{
	display: none;
}

.flappy-button{
	right: 30;
	bottom: 30;
	position: fixed;
	width: 150px;
	height: 150px;
	-webkit-transition: -webkit-transform .5s ease-in-out;
    transition: transform .5s ease-in-out;
}

.flappy-button:hover{
	filter: drop-shadow(16px 16px 10px #FF69B4);
	-webkit-transform: rotate(360deg);
	transform: rotate(360deg);
}

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

	#sidebar{

		width: 100%;
		height: 100px;
	}
}