body {
       background-color: #000000;
   }
   h1{
     text-align: left;
     font-family: "Space Grotesk";
     color: white;

   }
   h2,h3,h4{
     text-align: center;
     font-family: "Space Grotesk";
     color: white;
   }

   a:link, a:visited{
     color:white;
     text-decoration: none;
     text-align: left;
   }
   .selector-container{
     text-align: center;
     display:inline-grid;
     grid-template-columns: 3;
     grid-template-rows: 3;
     grid-gap: 5px;
   }
   .tile{
     height: 65px;
     width:65px;
   }
#tile-1{
  grid-column: 1;
  grid-row: 1;
  background-color: firebrick;
}
#tile-2{
  grid-column: 2;
  grid-row: 1;
  background-color: slateblue;
}
#tile-3{
  grid-column: 3;
  grid-row: 1;
  background-color: seagreen;
}
#tile-4{
  grid-column: 1;
  grid-row: 2;
  background-color: aqua;
}
#tile-5{
  grid-column: 2;
  grid-row: 2;
  background-color: indigo;
}
#tile-6{
  grid-column: 3;
  grid-row: 2;
  background-color:gold;
}
#tile-7{
  grid-column: 1;
  grid-row: 3;
  background-color: Lime;
}
#tile-8{
  grid-column: 2;
  grid-row: 3;
  background-color: steelblue;
}
#tile-9{
  grid-column: 3;
  grid-row: 3;
  background-color: saddlebrown;
}
   button {
       height: 150px;
       width: 150px;
       background-color: ivory;
       border: 0px transparent;
       border-radius: 50%;
       margin: 4px;
       padding: 4px;
   }

   .fa {
       font-size: 48px;
       color: black;
   }

   .reset {
       padding: 8px;
   }

   .reset:hover {
       opacity: 0.8;
   }