body, td { font-family: 'Questrial', sans-serif; color: white; background-color:#333333; }
a { color: gold; text-decoration: none; border-bottom: 1px solid gold; font-weight: bold; }
a:hover { animation-name: aHover; animation-duration: 3s; }
a.foot { text-decoration: none; color: gold; font-weight: normal; }
a.foot:hover { color: orange; text-decoration: none; }
.bot { position: fixed; bottom: 0; font-size: 60%; color: orange; background-color: #333333; }
h1, h2, h3, h4 { font-family: 'Orbitron', sans-serif; }
.delay, a {
  -webkit-transition-duration: 0.35s;
  -moz-transition-duration: 0.35s;
  -ms-transition-duration: 0.35s;
  -o-transition-duration: 0.35s;
  transition-duration: 0.35s;
}
i {
  color: grey;
  font-style: normal;
}
ul, #myUL {
  line-height: 200%;
}
#myUL {
  margin: 0;
  padding: 0;
}
#myUL { list-style-type: none; }
#myUL ul { list-style-type: none; }
#myUL ul li::before { content: "\25A3\0020"; }
#myUL ul ul { list-style-type: none; }
#myUL ul ul li::before { content: "\25CE\0020"; }
#myUL ul ul ul { list-style-type: none; }
#myUL ul ul ul li::before { content: "\25EC\0020"; }
#myUL ul ul ul ul { list-style-type: none; }
#myUL ul ul ul ul li::before { content: "\25C8\0020"; }
#myUL ul ul ul ul ul { list-style-type: circle; }
#myUL ul ul ul ul ul li::before { content: ""; }
#myUL ul ul ul ul ul ul { list-style-type: square; }
#myUL ul ul ul ul ul ul li::before { content: ""; }
#myUL ul ul ul ul ul ul ul { list-style-type: disc; }
#myUL ul ul ul ul ul ul ul li::before { content: ""; }
.butX { color: #000;}
.butX span { color: white;}
.but {
  display: inline-block;
  text-transform: capitalize;
  min-width: 5em;
  padding: 5px;
  padding-top: 0;
  padding-bottom: 0;
  margin-bottom: 5px;
  cursor: pointer;
  border: 1px solid #000;
  border-radius: 5px;
  background-color: #222;
  color: #fff;
}
.but:hover {
  animation-name: butHover;
  animation-duration: 2s;
}
.nested {
  display: none;
}
.active {
  display: block;
}
@keyframes aHover {
  33% {
    color: orange;
    border-bottom: 1px solid orange;
  }
}
@keyframes butHover {
  50% { 
    color: orange;
    border: 1px solid #fff;
    background-color: #111;
    border-radius: 10px;
    border-bottom-right-radius: 0;
    padding-right: 20px;
  }
}