@import url('https://fonts.googleapis.com/css2?family=Eagle+Lake&display=swap');
@import url('https://fonts.googleapis.com/css2?family=UnifrakturMaguntia&display=swap');

.eagle-lake-regular {
  font-family: "Eagle Lake", serif;
  font-weight: 400;
  font-style: normal;
}

.unifrakturmaguntia-regular {
  font-family: "UnifrakturMaguntia", cursive;
  font-weight: 400;
  font-style: normal;
}

body {
  background-color: #080611;
  background-image:
  radial-gradient(white, rgba(255,255,255,.2) 2px, transparent 10px),
  radial-gradient(white, rgba(255,255,255,.15) 1px, transparent 5px),
  radial-gradient(white, rgba(255,255,255,.1) 2px, transparent 10px),
  radial-gradient(rgba(255,255,255,.4), rgba(255,255,255,.1) 2px, transparent 5px);
  background-size: 855px 810px, 350px 500px, 400px 295px, 375px 350px; 
  background-position: 0 0, 40px 60px, 130px 270px, 70px 100px;
  color: silver;
  font-family: Verdana;
  perspective: 15px;
  overflow-x: hidden;
  padding-top: 3em;
}

#content {
  background-color: rgba(255, 255, 255, 0.07);
  border-radius: 20px;
  outline: double 7px silver;
  padding: 1em 0;
  border:  #080611 solid 5px;
  box-shadow: 0 0 20px silver;
  width: 50%;
  float: center;
  margin: 0 auto;
}

a {
    background-image: linear-gradient(lightblue, cornflowerblue);
    color: transparent;
    background-clip: text;
}

a:hover { 
    background: linear-gradient(to right, 
    rgba(57, 72, 255, 1), 
    rgba(57, 213, 255, 1)
    );
    background-position: bottom;
    background-size: 100%;
    background-repeat: no-repeat;
    text-decoration: none;
    color: transparent;
    background-clip: text;
  }

#header {
  color: black;
  background-color: gray;
  position:fixed;
  left: 5em;
  margin: 0;
  padding: 0;
  border-radius: 360px;
  height: 18em;
  width: 18em;
  transition: 1.5s;
}

#header:hover {
  background-color: silver;
  box-shadow: 0 0 8px silver;
  transition: 1.5s;
}

#header h1 {
  letter-spacing: .1em;
  font-size: 1.8em;
  margin: 0;
  padding: 0;
  left: 0;
  text-align: center;
  float: center;
  text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff, 0px 0px 2px #fff;
  transition: 1s;
  
  font-family: "Eagle Lake";
}

#header h1:hover {
  letter-spacing: .27em;
  font-size: 1.51em;
  margin: 0 auto;
  text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff, 0px 0px 5px #fff;
  transition: 1s;
}

#header h3 {
  padding-top: 2em;
  font-size: 1.7em;
  text-align: center;
  color: gray;
  font-family: "UnifrakturMaguntia";
  width: 90%;
  margin: 0 auto;
}

#masterlist {
  border-radius: 3px;
  padding-left: 1em;
  margin: 0 auto;
}

#masterlist strong {
  font-family: "Eagle Lake";
  font-size: 120%;
}

.section {
  outline: soild 1px black;
  font-family: 
}

.section h1, .section h2, .section h3 {
  font-family: "Eagle Lake";
  padding-top: 1em;
  border-top: solid silver 2px;
}

#404 {
  text-align: center;
  float: center;
  margin-left: 2em;
  padding-left: 2em;
}