/*
  CURSOR HELP!
  ------------
  cursor: url("finger_curs.png"), auto; <-- this is for things with the finger cursor
  cursor: url("cursor.png"), auto;      <-- this is for things with the normal cursor
*/

@font-face { font-family: papyrus; src: url(papyrus.ttf); }
@font-face { font-family: comic; src: url(COMIC.TTF); }
@font-face { font-family: smiley; src: url(smileyfont.ttf); }
@font-face { font-family: wingdings; src: url(wingding.ttf); }
@font-face { font-family: remotie; src: url(remotie.ttf); }

html,body { cursor: url("cursor.png"), auto; height: 100%; }

body {
  font-family: comic;
  padding: 0px;
  margin: 0px;
  background-color: /*#1f3878*/ #007373;
  cursor: url("cursor.png"), auto;
}

#destroy {
  border: 6px solid grey;
  background-color: #b60001;
  font-family: papyrus, monospace;
  color: white;
  border-radius: 100px;
  padding: 5px;
  font-size: 20px;
  width: 70px;
  height: 70px;
  cursor: url("finger_curs.png"), auto;
  background-image: radial-gradient(#db1617, #b60001, #940607);
}

.rain {
  animation-name: rainbow;
  animation-duration: 13.3s;
  animation-iteration-count: infinite;
  filter: drop-shadow(3px 3px 0 #ccc370);
  text-decoration: none;
}

@keyframes rainbow {
  0% { color: #c40000; }
  16% { color: #ff8000; }
  32% { color: #f0c800; }
  48% { color: #1ccf00; }
  64% { color: #0083a1; }
  80% { color: #8a00c9; }
  100% { color: #c40000; }
  /*
  0% { color: red; }
  14% { color: orange; }
  28% { color: yellow; }
  42% { color: lime; }
  56% { color: cyan; }
  70% { color: blue; }
  85% { color: violet; }
  100% { color: red; }
  */
}

ul {
  list-style-type: none;
}

#footer {
  bottom: 0px;
  right: 0px;
  position: absolute;
  cursor: url("cursor.png");
}

.c00l {
  background-color: black;
  font-family: arial;
  padding: 14px;
  margin: 0px;
  color: white;
  border: 3.5px solid red;
  font-size: 14px;
}

#sidebar {
  background-color: #064737;
  color: #b5ffe1;
  font-size: 13.5px;
  padding: 0%;
  width: 100%;
  position: sticky;
  overflow-x: hidden;
  overflow-y: hidden;
  height: 100000px;
  /* 695 */
}

#talk {
  font-family: comic;
  color: black;
  background-color: white;
  font-size: 11px;
  border: 3px solid black;
}

.talkbox {
  width: 110px;
  height: 90px;
  margin: 25px auto;
  border: 4px solid #00bfb6;
  padding: 10px;
  text-align: center;
  font-weight: 900;
  color: #00bfb6;
  font-family: arial;
  position: relative;
}

a,button,#boy { cursor: url("finger_curs.png"), auto !important; }
div { cursor: url("cursor.png"), auto; }
#blinkie,#pages { overflow-x: hidden; overflow-y: scroll; scrollbar-width: thin; }

.bubble {
  background-color: #10735a;
  height: 30px;
  border-radius: 0px;
  padding: 2px;
  width: 100px;
}

.ff { color: #40ffa9; text-decoration: none; }
.ff:hover { font-weight: bold; text-decoration: underline; }

.fart { height: 16px; line-height: 16px; text-align: center; }

.window { color: black; }
.te { color: #b5ffe1; }
.bu { cursor: url("finger_curs.png"), auto !important; }
.rrr { font-size: 10px; }
.link {
  color: #220038;
  text-decoration: none;
  font-style: italic;
  filter: drop-shadow(3px 3px 0 #ccc370);
  font-size: 13px;
}

.link:hover { text-decoration: underline; }

#links {
  overflow-y: auto;
  height: 300px;
  width: 200px;
}

/* stolen from https://camp2.rectangle.zone/index.php?title=Glaggleland&action=edit */
.bouncy{
  animation: 0.6s bounce forwards infinite, colorChange 4s infinite;;
  display: inline-block;
}

@keyframes bounce {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(15px) scaleY(0.95);
  }
}

#c00l { cursor: url("cursor.png"), auto !important; }