index.css

body {
  background-color: rgb(0, 100, 139);
  height: 100%;
  width: 100%;
}
p{
  font-family: 'Luckiest Guy', cursive;
}
h2{
  font-family: 'Luckiest Guy', cursive;
  color:white;
}
h1{
  margin-top: 10%;
  font-family: 'Luckiest Guy', cursive;
  color: blue;
  text-shadow: -3px 0 black, 0 3px black, 3px 0 black, 0 -3px black;
  animation: h1-scale 1s ease-in-out 4 alternate;;
}
.yellow{
  color:yellow;
}
.green{
  color:green
}
.red{
  color:red
}
.home{
  text-align: center;
  vertical-align: middle;
}
img{
  max-height: 100px;
  min-height: 100px;
  max-width: 100px;
  min-width: 100px;
}
.card{
  height:200px;
  min-width:110px;
  max-width:110px;
}

.character-card:hover {
  cursor: pointer;
}
.random-card:hover{
  cursor: pointer;
}

.character{
  /* border: 1px solid; */
  margin:10px;
  padding: 10px;
}

.titleGame{
  font-size: 100px;
  margin-bottom: 40px;
}
/* .modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  display: none;
} */
/* #myPseudo{
  margin-bottom: 40px;
} */

/* #randomCharacter{
margin-top: 40px;
} */

/* h2{
  margin-bottom: 30px;
  margin-top:30px
} */
.goOnGame{
  margin-bottom: 30px;
  margin-top:30px
}
@keyframes h1-scale {
  from {
    transform: scale(1.0);
  }
  to {
    transform: scale(2);
  }
}