body {
  color: white;
  font-family: "toby";
}

a:link {
  color: red;
  background-color: transparent;
  text-decoration: none;
}

a:visited {
  color: pink;
  background-color: transparent;
  text-decoration: none;
}

.back {
  background-image: url(back.gif);  
  background-size: cover;
  width:175px;
  height:105px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
}

.nutbutton2 {
  background-image: url(button.png);  
  background-size: cover;
  width:196px;
  height:82px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
}

.nutbutton2:hover {
  background-image: url(buttonglow.png);  
  background-size: cover;
  width:196px;
  height:82px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
}

.toby:hover {
  background-image: url(tobyannoy.gif);  
  background-size: cover;
  width:150px;
  height:123.75px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  margin-left:50px;
}

.toby {
  background-image: url(tobyannoy2.gif);  
  background-size: cover;
  width:135px;
  height:60px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  image-rendering: pixelated;
  margin-left:50px;
}

.guestbook {
  margin-left:50px;
}

.bonus {
  margin-left:50px;
}

.pirate {
  margin-left:50px;
}

.nut {
  background-image: url(nutria.png);  
  width:306px;
  height:306px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.nut:hover {
  background-image: url(nutriaglow.png);  
  width:306px;
  height:306px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
}

.four {
  background-image: url(4.gif);  
  width:199px;
  height:169px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.four:hover {
  background-image: url(4glow.webp);  
  width:199px;
  height:169px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.lion {
  background-image: url(lion.png);  
  width:519px;
  height:269.5px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.lion:hover {
  background-image: url(lionglow.png);  
  width:519px;
  height:269.5px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.texas {
  background-image: url(texas.png);  
  width:582px;
  height:567px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.texas:hover {
  background-image: url(texasglow.png);  
  width:582px;
  height:567px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.dip {
  background-image: url(dip.png);  
  width:466.5px;
  height:355px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.dip:hover {
  background-image: url(dipglow.png);  
  width:466.5px;
  height:355px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.water {
  background-image: url(water.gif);  
  width:240px;
  height:160px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.water:hover {
  background-image: url(waterWIDE.gif);  
  width:240px;
  height:160px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.turkey {
  background-image: url(turkey.gif);  
  width:287px;
  height:287px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.turkey:hover {
  background-image: url(turkeyglow.webp);  
  width:287px;
  height:287px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.tree {
  background-image: url(tree.gif);  
  width:142px;
  height:210px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.tree:hover {
  background-image: url(tree.webp);  
  width:142px;
  height:210px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.write {
  background-image: url(write.gif);  
  width:350px;
  height:269px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.write:hover {
  background-image: url(writeglow.webp);  
  width:350px;
  height:269px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.camp {
  background-image: url(cabin.gif);  
  width:448px;
  height:221px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.camp:hover {
  background-image: url(cabinglow.webp);  
  width:448px;
  height:221px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.spook {
  background-image: url(mold.gif);  
  width:225px;
  height:301px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.spook:hover {
  background-image: url(moldglow.webp);  
  width:225px;
  height:301px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.bat {
  background-image: url(bat.gif);  
  width:350px;
  height:303px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.bat:hover {
  background-image: url(batglow.webp);  
  width:350px;
  height:303px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.mam {
  background-image: url(mam.png);  
  width:400px;
  height:400px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.mam:hover {
  background-image: url(mamglow.png);  
  width:400px;
  height:400px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.swindle {
  background-image: url(dog.png);  
  width:364px;
  height:457.5px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.swindle:hover {
  background-image: url(dogglow.png);  
  width:364px;
  height:457.5px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.hog {
  background-image: url(huff.png);  
  width:231px;
  height:256px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.hog:hover {
  background-image: url(huffglow.png);  
  width:231px;
  height:256px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.yoda {
  background-image: url(yodaYES.gif);  
  width:140px;
  height:284px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.yoda2 {
  background-image: url(yodaNO.gif);  
  width:240px;
  height:180px;
  color: transparent;
  padding: 0;
  border: none;
  background-color: transparent;
  background-size: 100%;
}

.digital {
  color: lime;
  font-family: "digital";
}

@font-face {
  font-family: "digital";
  src: url("digital.ttf");
}

.archive {
 color: #fd43ff;
 font-family: "archive";
}

@font-face {
  font-family: "archive";
  src: url("archive.ttf");
}

@font-face {
  font-family: "toby";
  src: url("toby.ttf");
}

@font-face {
  font-family: "papyrus";
  src: url("papyrus.ttf");
}

div {
  background-color: transparent;
  background-image: url(box.gif);
  width: 1700px;
  border: 5px solid lime;
  padding: 10px;
  margin: 10px;
  border-radius: 25px;
}

.insidebox {
  background-color: transparent;
  width: 1500px;
  background-image: url(box2.gif);
  padding: 50px;
  margin: 20px;
  border: 0px solid transparent;
  border-radius: 0px;
}

.shake:hover {
    /* Start the shake animation and make the animation last for 0.5 seconds */
  animation: shake 0.5s;

  /* When the animation is finished, start again */
  animation-iteration-count: infinite;
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}

.yoda:hover {
    /* Start the shake animation and make the animation last for 0.5 seconds */
  animation: shake 0.5s;

  /* When the animation is finished, start again */
  animation-iteration-count: infinite;
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}

.yoda2:hover {
    /* Start the shake animation and make the animation last for 0.5 seconds */
  animation: shake 0.5s;

  /* When the animation is finished, start again */
  animation-iteration-count: infinite;
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}