input[type=number] {
    height: 3rem;
    font-size: 1rem;
    font-weight: bold;
    width: 3rem;
    text-align: center;
}

@font-face {
	font-family: 'MyFont';
	src: url(https://lucem-joc-en-grup.github.io/Per-Aspera-Ad-Lucem/resources/fonts/long_pixel-7.ttf);
}

#title{
	font-size: 40px;
	line-height: 50px;
	font-family: 'MyFont';
	color: rgb(255, 255, 255);
}

body {
	background-image: url(https://lucem-joc-en-grup.github.io/Per-Aspera-Ad-Lucem/resources/backgrounds/blue_lights.jpg);
	background-size: 100%;
} 

.menu-object{
	display:block;
	margin-left: auto;
	margin-right: auto;
	width: 300px;
	height: 75px;
	font-size: 16px;
	margin-top: 10px;
	margin-bottom: 10px; 
	font-weight: bold;
}

p{
	text-align: center;
	font-family: 'MyFont';
}

button.menu-object {
	height: 65px;
	border-radius: 5px;
	background-color: rgb(60, 134, 231);
}

button.menu-object:active{
	font-size: 16px;
	width: 275px;
	height: 65px;
}

button.menu-object:hover:not(:active){
	font-size: 20px;
	width: 325px;
}

svg.menu-object {
	height: 300px;
}
svg {
	align-self: center;
	padding-top: 50px;
}

svg:hover #light2 {
	animation: light-animation 1.3s infinite ease-in; 
}

@keyframes light-animation {
  0% {
	translate: 0; opacity: 0;
  }
  60% {
	opacity: 1;
  }
  100% {
	translate: 40px; opacity: 0;
  }
}

#title {
    font-size: 25px;
    line-height: 75px;
}

.menu-object {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 300px;
    height: 75px;
    font-size: 16px;
    margin-top: 10px;
	font-family: 'MyFont';
}

p {
    text-align: center;
}

button.menu-object:active {
    font-size: 18px;
    width: 275px;
    height: 70px;
	color: aliceblue;
}

button.menu-object:hover:not(:active) {
    font-size: 22px;
    width: 325px;
    height: 85px;
	color: aliceblue;
}