:root {
  --border-color: #FFFDB8;
}

* {
  margin: 0;
  padding: 0;
}

::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background-color: #fff;
  border: 1px solid #ffc6e1;
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  background-color: #fff;
  background-image: url(/media/background-content.png);
  border: 1px solid #ffbbdd;
  border-radius: 15px;
}

body {
  background-color: #fff;
  background-image: url(/media/pastelbg.png);
  font-family: ktegaki, zen maru gothic;
  color: #B18B8A;
  font-weight: 400;
  height: 900px;
  overflow-x: hidden;
}

a:hover {
  cursor: url(/media/pointer.png), auto !important;
}

#frill {
  width: 100%;
  height: 120px;
  background-image: url(/media/frillllll.gif);
  background-repeat: repeat-x;
  background-position: top;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 999999;
}

#pearl {
  width: 320px;
  height: 320px;
  background-image: url(/media/pearls.png);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: -90px;
  left: 0;
  z-index: 999;
  filter: saturate(1.5);
  pointer-events: none;
}

#pearl:nth-child(2) {
  left: 450px;
}

#pearl:nth-child(3) {
  left: 900px;
}

.airi {
  height: 550px;
  position: absolute;
  top: 94%;
  left: 42%;
  transform: rotate(10deg) scaleX(-1);
  pointer-events: none;
  filter: drop-shadow(0px 0px 1px white) drop-shadow(0px 0px 0px white) drop-shadow(0px 0px 1px white) drop-shadow(0px 0px 0px white) drop-shadow(0px 0px 1px white) drop-shadow(0px 0px 1px white) drop-shadow(0px 1px 0px #ffb5cf);
}

.container {
  width: 840px;
  height: 870px;
  padding: 6px;
  border: 10px solid;
  border-image: url(/media/aboutborder.gif) 7 fill round;
  margin: 30px auto;
}

.center {
  width: 820px;
  height: 850px;
  border: 10px solid;
  border-image: url(/media/borderrr.png) 11 fill round;
}

header {
  width: auto !important;
  height: 180px;
  background-color: #fff;
  background-image: url(/aboutmeheader.png);
  background-size: cover;
  box-shadow: 0 0 3px 15px inset #fff;
  border: 3px dashed #ffdbe1;
  margin-top: 5px;
  margin-bottom: 5px;
  overflow: hidden;
}

.button {
  width: auto;
  height: 30px;
  background: transparent;
  padding: 3px 5px 4px 3px;
  display: flex;
  gap: 7px;
}

.button button {
  width: 100%;
  height: 32px;
  color: #ff8dc6;
  font-family: cursive;
  background-color: #fff;
  padding: 5px 10px 10px 5px;
  border: 1px solid #ffacd5;
  border-radius: 25px;
  transition: .3s;
}

.button button:hover {
  background-color: #ffcbe4;
  color: #fff;
  border: 1px solid #ff8dc6;
}

#row {
  width: auto;
  height: 264px;
  padding: 3px 2px 2.5px 3px;
  border: 3px dashed #ffdbe1;
  margin-top: 10px;
  margin-bottom: 10px;
}

.nene {
  height: 210px;
  border: 25px solid;
  border-image: url(/media/precure_miracle_universe__resource__by_ffprecurespain_dcvocum.png) 55 fill round;
  border-radius: 5px;
  float: left;
}

span {
  font-size: 32px;
  font-family: mochiy pop one, cursive;
  color: #ffffff;
  filter: drop-shadow(-2px 0 1.2px #ffacd5) drop-shadow(2px 0 1px #ff8dc6) drop-shadow(0 2px 2px #ffecf5) drop-shadow(0 -2px 1.7px #ffcde6);
  margin-left: 5px;
  animation: title 1s linear infinite;
}

@keyframes title {
  0% {
    filter: drop-shadow(-2px 0 1.2px #ffacd5) drop-shadow(2px 0 1px #ff8dc6) drop-shadow(0 2px 2px #ffecf5) drop-shadow(0 -2px 1.7px #ffcde6);
  }

  50% {
    filter: drop-shadow(-2px 0 1.2px #ffcbe4) drop-shadow(2px 0 1px #ffe4f1) drop-shadow(0 2px 2px #ffbfdd) drop-shadow(0 -2px 1.7px #fff6fa);
  }

  100% {
    filter: drop-shadow(-2px 0 1.2px #ffacd5) drop-shadow(2px 0 1px #ff8dc6) drop-shadow(0 2px 2px #ffecf5) drop-shadow(0 -2px 1.7px #ffcde6);
  }
}

.meow {
  height: 200px;
  float: right;
  margin-top: -123px;
  margin-left: 5px;
}

.miku {
  height: 320px;
  position: absolute;
  margin-top: -10px;
  margin-left: -25px;
  pointer-events: none;
  filter: drop-shadow(-2px 0 1.2px #ffacd5) drop-shadow(2px 0 1px #ff8dc6) drop-shadow(0 2px 2px #ffecf5) drop-shadow(0 -2px 1.7px #ffcde6);
}

a {
  color: #ffc6e1;
  text-decoration: underline dotted;
}

a:visited {
  color: #ff8dc6;
}

::selection {
  background-color: #ffffcd;
}

@font-face {
  font-family: ktegaki;
  src: url(https://dl.dropbox.com/s/likp0uru5np58yn/KTEGAKI.ttf);
  }