/*
$unvisited: white;
$visited: #788bff;
$path: #fec601;
$wall: #616163;
$start: #44ffd2;
$end: #ea7317;
*/
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica,
 Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
  text-align: center;
}

button {
  all: unset;
  cursor: pointer;
}

.visualize {
  margin-top: 10px;
  margin-bottom: 10px;
  background-color: #ffd166;
  font-weight: bold;
  width: 10%;
  padding: 10px;
  border-radius: 10px;
  border: solid #616163;
}

.visualize:hover {
  -webkit-filter: brightness(85%);
          filter: brightness(85%);
}

table {
  border-collapse: collapse;
  margin: auto;
  border: solid black;
}

.node {
  border: 1px solid #2c4251;
  height: 1.5em;
  width: 1.5em;
}

.node.visited {
  background-color: #118ab2;
}

.node.path {
  background-color: #ffd166;
}

.node.wall {
  background-color: #616163;
}

.node.start {
  background-color: #06d6a0;
}

.node.end {
  background-color: #ef476f;
}

.node:hover {
  opacity: 0.75;
}

.algo-select {
  margin-top: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  font-weight: bold;
  background-color: #f1faee;
}

.select-title {
  color: #e0eff5;
  width: 300px;
  pointer-events: none;
  background-color: #1b9aaa;
}

.algo-choices {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.algo-choice {
  color: #073b4c;
  position: relative;
  width: 100%;
  margin-left: 10px;
}

.algo-choice.selected {
  background-color: #06d6a0;
}

.select-title,
.algo-choice {
  text-align: center;
  border-radius: 10px;
  padding: 10px;
}
/*# sourceMappingURL=styles.css.map */