@font-face {
  font-family: PKMN RBYGSC Regular;
  src: url("/fonts/PKMN RBYGSC.ttf");
}

@font-face { font-family: Px437 Cordata PPC-400; src: url("/fonts/Px437_Cordata_PPC-400.ttf"); }

@font-face { font-family: LanaPixel; src: url('/fonts/LanaPixel.ttf'); }

body {
  background-image: url("https://wolfrayetlaw.com/imgs/background/lightbg1.png");
  background-size: cover;
  background-attachment: fixed;
  image-rendering: pixelated;
  font-family: "Px437 Cordata PPC-400";
}

.box {
  max-width: 1100px;
  margin: 0 auto 0 auto;
}

.pkmn1 {
  color: black;
  background: white;
  padding: 20px;
  padding-right: 0px;
  width: 550px;
  background-clip: padding-box;
  border-radius: 25px;
  border-image-slice: 7;
  border-image-width: 14px;
  border-image-repeat: round;
  border-style: solid;
  border-color: transparent;
  image-rendering: pixelated;
  border-image-source: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAVAgMAAAA/TvYGAAAAAXNSR0IB2cksfwAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAAxQTFRFAAAAAAAA////+Pj4EZhu1AAAAAR0Uk5TAP///7MtQIgAAABaSURBVHicY2T9zcDA+ptRUkeA4Yg6YyhrAMPq34xZ+nsYRdQYpbw/MLguY2TtLmBInc3IZnWAQfI5o+RzBgY2KxIodkuwPqgpkj4fGFyWo1ukLcBwVI0R4hYAN4IjlkoaqZsAAAAASUVORK5CYII=");
}

header.pkmn1 {
  width: 900px;
  padding-right: 20px;
  background-clip: padding-box;
  border-radius: 25px;
  border-image-slice: 7;
  border-image-width: 14px;
  border-image-repeat: round;
  border-style: solid;
  border-color: transparent;
  image-rendering: pixelated;
  border-image-source: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAVAgMAAAA/TvYGAAAAAXNSR0IB2cksfwAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAAxQTFRFAAAAAAAA////+Pj4EZhu1AAAAAR0Uk5TAP///7MtQIgAAABaSURBVHicY2T9zcDA+ptRUkeA4Yg6YyhrAMPq34xZ+nsYRdQYpbw/MLguY2TtLmBInc3IZnWAQfI5o+RzBgY2KxIodkuwPqgpkj4fGFyWo1ukLcBwVI0R4hYAN4IjlkoaqZsAAAAASUVORK5CYII=");
  margin-left: 35px;
}

h1.pkmnname {
  font-size: 35px;
  font-family: LanaPixel;
  -webkit-background-clip: text;
  background-clip: text;
  margin-top: 0;
  margin-bottom: 0;
  font-weight: 100;
  font-weight: bold;
  text-shadow:
    -3px -1px 0 black,
    3px -1px 0 black,
    -3px 1px 0 black,
    3px 1px 0 black,
    -2px -3px 0 black,
    2px -3px 0 black,
    -2px 3px 0 black,
    2px 3px 0 black;
  filter: drop-shadow(3px 3px 0 #8f8f8f);
}

h4 {
  margin: 0;
  font-family: LanaPixel;
}

a {
  color: gray;
  font-weight: bold;
}

a:hover {
  font-size: larger;
}

.dexentry {
  display: flex;
  margin: 1em;
  gap: 10px;
}

.dexentry.section {
  padding: 10px;
  margin: 0.9em;
}

.pkmntxt {
  flex: calc(50% - 2em);
  margin-right: 60px;
}

.pkmntxt p {
  padding: 15px;
  border: 3px double black;
  width: 490px;
}

.pkmntxt strong {
  font-family: PKMN RBYGSC Regular;
}

h1.generation {
  font-family: PKMN RBYGSC Regular;
  font-size: 1.3em;
}

h1.generation a {
  color: white;
  font-family: PKMN RBYGSC Regular;
  font-size: 1.3em;
  text-shadow:
    -3px -1px 0 black,
    3px -1px 0 black,
    -3px 1px 0 black,
    3px 1px 0 black,
    -2px -3px 0 black,
    2px -3px 0 black,
    -2px 3px 0 black,
    2px 3px 0 black;
  filter: drop-shadow(3px 3px 0 #8f8f8f);
  text-decoration: none;
}

h1.generation a:hover {
  font-size: 1.4em;
  text-decoration: none;
}

.row {
  display: flex;
}

.column {
  flex: 50%;
}

footer {
  justify-self: center;
}

.floating {
  animation-name: floating;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}

@keyframes floating {
  0% {
    transform: translate(0, 0px);
  }
  50% {
    transform: translate(0, 15px);
  }
  100% {
    transform: translate(0, -0px);
  }
}
