body {
    font-family: 'Inconsolata', sans-serif;
}

#levelHeader {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    padding: 0%;
}


@keyframes anjingJump {
    0% {top: 10px;}
    50% { top: -50px;}
    100% {top: 10px;}
}


.buttonAnimation {
    animation : ping2 0.5s infinite;
}

@keyframes ping {
  100% {
    left: 4px;
    top : 4px
  }
}

@keyframes ping2 {
  50% {
    left: 4px;
    top : 4px
  }
}


.buttonStyle {
    background-color: black;
    color: white;
    font-size: 1.25rem;
    padding: 5px 20px;
    border-radius: 5px;
    position: relative;
    cursor: pointer;
}

.buttonStyle::after{
     position : absolute;
     border : 1px solid black;
     left : 4%;
     top: 10%;
     border-radius: 5px;
     content: "";
     width: 100%;
     height: 100%;
}

.buttonStyle:hover {
    left: 4px;
    top : 4px
}

.buttonStyle:hover::after {
    left: 0px;
    top : 0px;
}

.aNav:hover {
  text-decoration-line: underline !important;
  text-decoration-style: wavy !important;
  text-decoration-color: black !important;
}

.flexColumn {
    display : flex;
    flex-direction : column;
    align-items : center;
    justify-content : center;    
}

.scoreBackground {
    background-color : rgba(0,0,0,0.25);
    position : fixed;
    z-index: 999;
    width : 100%;
    height : 100%;
    top : 0;
    left : 0;
}

.scoreSection {
    height : 100%;
    width : 100%;
    position : absolute;
}

.scoreDiv {
    padding : 3%;
    border-width : 1px;
    background-color : white;
    gap : 2%;
}

.scoreDiv2, .levelDiv2 {
    display : flex;
    align-items : center;
    justify-content : center;
    gap : 5%;
    width : 100%;
}

.scoreH2, .levelH2 {
    text-align : center;
    font-size : 1.25rem;
}

.scoreP2 {
    font-size : 2rem;
    text-align : center;
}

.levelDiv {
    padding : 2%;
    border-width : 1px;
}

.levelSpan {
    width: 65%;
    font-size : 1.1rem;
    text-align : left;
    line-height : 1.1;
    padding : 1%;
    border : 5px double;
}

.levelImg {
    width: 40%;
}

@media only screen and (max-width: 640px) {
.levelImg {
    width : 70%;
}

#levelHeader {
    padding-bottom: 7%;
}

.levelSpan {
    width: 90%;
}

}