* {
    touch-action: manipulation;
}

@font-face {
    font-family: 'Zelda';
    src: url('fonts/zeldadxt.ttf');
}

body {

        height: 100%;
        overflow: hidden;

}
.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

#moveLeft {
    border: 0px solid rgb(221, 34, 34)
}

#moveRight {
    border: 0px solid rgb(133, 45, 45)
}

#score, #pause {
    font-family: 'Zelda';
    position: absolute;
}

.menu, #logContainer {
    position: absolute;
    border: 1px solid rgb(170, 167, 167);
    font-family: 'Zelda';
    padding: 8px;
    background-color: white;
}

#pVersion {
    font-family: 'Zelda';
    font-size: 0.66em;
    color:rgb(35, 33, 133)
}

#logo {
    font-family: 'Zelda';
    position: absolute;
    top: 60px;
    font-size: 1.3em
}

.menu div {
    margin-bottom:10px
}

.centerMenu {
    transform: translate(-50%,-50%)
}

/* https://www.florin-pop.com/blog/2019/03/css-pulse-effect/ */

.blob {
   
	animation: pulse 4s infinite;
}

@keyframes pulse {
	0% {
		transform: scale(0.95);
		box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7);
	}

	70% {
		transform: scale(2);
		box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
	}

	100% {
		transform: scale(0.95);
		box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
	}
}

@-webkit-keyframes shake {
    0% { -webkit-transform: translate(2px, 1px) rotate(0deg); } 
    10% { -webkit-transform: translate(-1px, -2px) rotate(-1deg); }
    20% { -webkit-transform: translate(-3px, 0px) rotate(1deg); }
    30% { -webkit-transform: translate(0px, 2px) rotate(0deg); }
    40% { -webkit-transform: translate(1px, -1px) rotate(1deg); }
    50% { -webkit-transform: translate(-1px, 2px) rotate(-1deg); }
    60% { -webkit-transform: translate(-3px, 1px) rotate(0deg); }
    70% { -webkit-transform: translate(2px, 1px) rotate(-1deg); }
    80% { -webkit-transform: translate(-1px, -1px) rotate(1deg); }
    90% { -webkit-transform: translate(2px, 2px) rotate(0deg); }
    100% { -webkit-transform: translate(1px, -2px) rotate(-1deg); }
}
.shake {
    -webkit-animation-name: shake;
    -webkit-animation-duration: 0.5s;
    -webkit-transform-origin:50% 50%;
    -webkit-animation-iteration-count: infinite;
}
.shake {
    display:inline-block
}