body {
    text-align: center;
    font-family: geneva;
    background-image: url('images/golden.gif');
}

.header {
    color: #fff;
    animation-name: pulse;
	-webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	animation-duration: .75s;
}
.header h1:hover, button:hover {
    animation-name: pulse;
    -webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	animation-duration: .90s;
}

canvas {
    margin-top: -4em; 
}

.overlay {
    /*background: rgba(0, 0, 0, 0.7);
    transition: opacity 500ms;
    width: 505px;
    height: 538px;
    position: absolute;
    top: 91px;
    left: 0;
    right: 0;
    margin: 0 auto;
    border-radius: 5px;*/
}

.hide {
	visibility: hidden;
	opacity: 0 !important;
}
.show {
	visibility: visible !important;
	opacity: 1 !important;
}

.game-over {
    font-family: 'Alegreya', serif;
    position: absolute;
    background-color: #990005;
    border-radius: 5px; 
    left: 0;
    right: 0;
    top: 153px;
    width: 347px;
    height: 303px;
    margin: 0 auto;
    padding: 3em 3em;
    color: #fff;
    visibility: hidden;
}

.game-over button {
    background-color: royalblue;
    border: none;
    border-radius: 3px;
    padding: 7px 15px;
    font-size: 20px;
    color: #fff;
    margin-top: 2em;
}

.winner {
    font-family: 'Alegreya', serif;
    position: absolute;
    
    border-radius: 5px; 
    left: 0;
    right: 0;
    top: 153px;
    width: 347px;
    height: 303px;
    margin: 0 auto;
    padding: 3em 3em;
    color: #fff;
    visibility: hidden;
}
.winner img{
    width: 250px;
}
.winner button {
    background-color: #D62246;
    border: none;
    border-radius: 3px;
    padding: 7px 15px;
    font-size: 20px;
    color: #fff;
    margin-top: 2em;
}

/* animations  */
@keyframes pulse {
	from {
		transform: scale3d(1, 1, 1);
	}

	50% {
		transform: scale3d(1.2, 1.2, 1.2);
	}

	to {
		transform: scale3d(1, 1, 1);
	}
}