.map {
  margin: 2rem 0;
  display: grid;
  grid-template-columns: 1fr 60%;
  a {
    color: inherit;
    text-decoration: none;
  }
  & > ul {
    padding-right: 1rem;
    li {
      text-transform: capitalize;
    }
    a:hover {
      color: red;
    }
    margin: 0;
    padding-left: 2rem;

    ul:not(:last-child) {
      margin-bottom: 0.5rem;
    }
  }
  .show {
    border: 1px solid white;
    padding: 1rem;
    max-height: 60vh;
    overflow-y: scroll;

    &::-webkit-scrollbar{
      background-color: #000;
    }

    &::-webkit-scrollbar-thumb{
      background-color: #fff;
      border-radius: 50px;
      border: 4px solid #000;
    }

    ul{
      margin: .5rem 0;
    }
  }
}

.fixbottom {
  position: fixed;
  bottom: 0;
  right: 0;
  overflow: hidden;
  box-sizing: border-box;
}

@media (max-width: 500px){
  .fixbottom{
    display: none;
  }
  .map{
    grid-template-columns: 1fr;
  }
}