#rotate {
  animation: rotation 8s infinite linear;
}

@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}

#zoom-in-out {
  animation: zoom-in-zoom-out 1s ease infinite;
}

@keyframes zoom-in-zoom-out {
  0% {
    transform: scale(1, 1);
  }
  50% {
    transform: scale(1.5, 1.5);
  }
  100% {
    transform: scale(1, 1);
  }
}

body {
  font-family: 'Georgia', serif;
}

img.custom-icon {
  height:50px;
  vertical-align: middle;
  margin:10px;
}

img.emoji {
  width:20px;
  vertical-align: middle;
  padding:0px;
  margin:0px 5px 0px 5px;
}

img.button {
  height:20px;
  margin:0px 5px 0px 5px;
  vertical-align:bottom;
}

h1 {
  text-align:center;
  font-size:2.25em;
}

h2 {
  border: solid 2px black;
  box-shadow: 5px 5px 0 0 black;
  padding:5px;
  display: inline-block;
}

footer {
    font-style:italic;
    font-size: 12px;
    text-align:center;
    padding:25px;
    margin:auto;
    margin-top:50px;
    border-top: 1px dotted;
    width:50%;
}

div#toc {
  position:fixed;
  width:15%;
  top:50%;
  bottom:auto;
  right:0;
  left:auto;
  transform: translate(0%, -50%);
  border: solid 2px black;
  box-shadow: 5px 5px 0 0 black;
  margin: 5px;
}

div#toc li {
  list-style: none;
  margin:10px 0 10px 0;
}

div#toc li::before{
  content: "\00BB";
  }

div#toc h3 {
  text-align: center;
  margin:0;
}

article {
  width:90%;
}

pre {
   padding:15px;
   }

blockquote {
  padding: 20px 30px 20px 30px;
  margin: 15px auto;
  border: solid 2px black;
  box-shadow: 5px 5px 0 0 black;
}