/* https://www.fontspace.com/sf-distant-galaxy-font-f6436*/

@font-face {
  font-family: SfDistantGalaxy;
  src: url(../fonts/SfDistantGalaxy-0l3d.ttf);
}

@font-face {
  font-family: SfDistantGalaxyOutline;
  src: url(../fonts/SfDistantGalaxyOutline-xoeO.ttf);
}

@font-face{
  font-family: Luckiest-Guy;
  src: url(../fonts/LuckiestGuy-Regular.ttf);
}

@font-face{
  font-family: Bangers;
  src: url(../fonts/Bangers-Regular.ttf);
}

@import url('https://fonts.googleapis.com/css2?family=Staatliches&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Luckiest+Guy&display=swap');

header{
  font-family: Bangers, sans-serif;
  color: white;
  background-color: #0a6be9;
  padding: .5em;
  user-select: none;
  margin-bottom: .5rem;
}
h1{
  font-family: Bangers, sans-serif;
  letter-spacing: 1px;
  box-shadow: inset 1px black;
}



#character-info{
  height: 540px;
  width: 270px;
  border: 1px solid gray;
  padding: .5rem;
  background-color: #f4f4f4;
  overflow: scroll;
  font-size: .7rem;
}

#character-info h2{
  font-size: 1.1rem;
  font-family: 'Luckiest Guy', sans-serif;
  letter-spacing: .67px;
  line-height: 1.2;
  margin-top: 0;
}

#character-pic{
  width: 200px;
}

#card-h2{
  margin-left: auto;
  margin-right: auto;
}

#detective-pika{
  display:block;
  margin-left: auto;
  margin-right: auto;
}

#sleeping-pika{
  display:block;
  margin-top: auto;
  margin-bottom: auto;
  margin-left: auto;
  margin-right: auto;
}

#favorite-button{
  display:block;
  margin-left: auto;
  margin-right: auto;
}
#shiny-button{
  display:block;
  margin-left: auto;
  margin-right: auto;
}

.docHeader{
  font-family: Bangers, sans-serif;
  letter-spacing: 1px;
}

.card-list{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
poke-card{
  margin: 0 .5rem .5rem 0;
}