*{
    margin:0px;
    padding: 0px;
}
body{
    /* background-color: rgb(26, 1, 49);   */
    background-image: url('Images/bg2.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.card-inner {
  width: 100%;
  height: 100%;
  transition: transform 0.6s;
  transform-style: preserve-3d;
  position: relative;
}

.card-inner.flipped {
  transform: rotateY(180deg);
}

.background { 
    width: 100vw;
    height: 90vh;
    display :flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.container{
    height: 61vh;   
    width:500px;
    gap: 10px;
    display :flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-end;
    /* background-color: rgb(255, 75, 75); */
}

.timer{
    position: absolute;
    top: 10px;
    right: 20px;
    font-size: 50px;
    color:rgb(140, 17, 165);;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}

.btn:active{
    transition: .2s;
}

.score{
    position: absolute;
    top: 10px;
    color: rgb(208, 6, 144);
    font-size: 50px;
}

.tries{
    position: absolute;
    top: 10px;
    left: 10px;
    color: rgb(96, 18, 253);;
    font-size: 50px; 
}
    
.btn img {
  backface-visibility: hidden;
  transition: transform 0.6s;
}

.imager, .front {
  position: absolute;
  top: 0;
  left: 0;
  width: 100px;
  height: 100px;
  border-radius: 1em;
  backface-visibility: hidden;
  transition: transform 0.6s;
}

.btn,.imager{
    width:100px;
    height:100px;
    transition:transform 0.6s;
    backface-visibility: hidden;
}

.btn.flip .imager{
    transform: rotateY(180deg);
    z-index: 2;
}

.btn.flip .front{
    transform: rotateY(0deg);
    z-index: 1;
}

.front{
    position: absolute;
    transition:transform 0.6s;
    transform: rotateY(180deg);
}

.btn{
    width: 110px;
    height: 110px;
    border-radius: 1em;
    perspective: 1000px;
    transform-style: preserve-3d;
    position: relative;
}
.nova-square-regular {
  font-family: "Jersey 10", sans-serif;
  font-weight: 400;
  font-style: normal;
}
