body {
	background-image: url('bglogo.jpg');


}

.menu-bar {
	position: relative;
	display: inline-block;


}

.menu {
	font-family: 'Ink Free';
	font-size: 18px;
	font-style: bold;
	text-decoration: none;
	color: white;
	padding: 2px 8px;	
}

.menu:hover {
	color: pink;
}

.main-title {
	position: relative;
	width: 365px;
	font-family: 'Ink Free';
	font-size: 42px;
	font-style: bold;
	color: pink;
	align-content: center;
	justify-content: center;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	-webkit-animation: bounce-in 0.4s ease-in-out 0s 1 normal;
	-moz-animation: bounce-in 0.4s ease-in-out 0s 1 normal;
	-ms-animation: bounce-in 0.4s ease-in-out 0s 1 normal;
	animation: bounce-in 0.4s ease-in-out 0s 1 normal;

}

@-webkit-keyframes bounce-in {
	0%{ opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); }
	50%{ opacity: 1; -webkit-transform: scale(1.0); transform: scale(1.0); }
	70%{ -webkit-transform: scale(0.9); transform: scale(0.9); }
	100%{ -webkit-transform: scale(1); transform: scale(1); }
}

@keyframes bounce-in {
	0%{ opacity: 0; transform: scale(.3); }
    50%{ opacity: 1; transform: scale(1.0); }
    70%{ transform: scale(0.9); }
    100%{ transform: scale(1); }
}

.app {
	position: relative;
    display: block;
	width: 365px;
	height: 100%;
	align-content: center;
	justify-content: center;
	margin-right: auto;
	margin-left: auto;
	text-decoration: none;
	color: white;
	font-family: sans-serif;
	background-color: black;
	border: 1px solid;
	border-color: purple;
	border-radius: 12px;
    box-shadow: 2px 2px 4px;
	padding: 16px 6px;


}

.coolest-box {
	position: relative;
	align-content: center;
	justify-content: center;
	text-align: center;
	margin-left: auto;
	margin-right: auto;



}

.coolbeanz-box {
	position: relative;
	align-content: center;
	justify-content: center;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	margin-top: 8px;

}

.phil-box {
	position: relative;
	align-content: center;
	justify-content: center;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	margin-top: 8px;	
	
}

.triipy-box {
	position: relative;
	align-content: center;
	justify-content: center;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	margin-top: 8px;
	
}

span {
	position: relative;
	display: block;
	border: 1px solid;
	border-color: pink;
	width: 60px;
	left: 145px;
	padding: 8px 8px;

}

span:hover {
	border-color: lime;
	background-color: pink;
	color: black;
}

a {
	text-decoration: none;
	color: white;
	font-size: 18px;
	font-family: "Ink Free";
	

}

img:hover {
	border: 2px solid;
	border-color: lime;

}



.foot {
	position: relative;
	color: white;
	align-content: center;
	justify-content: center;
	text-align: center;
	
}



