.view--map {

  display: flex;
  flex-wrap: nowrap;
  overflow: hidden;
  max-width: 960px;
  margin-inline: auto;
  align-items: stretch;

}

.view--map #map {
  flex: 0 0 510px;
}

.view--map .map__info {
  flex: 1;
  overflow-y: scroll;
}



@media screen and (max-width: 960px)  {
  .view--map {
    display: block;
    padding-bottom: 1.5rem;
  }

  #map {
    height: 500px;
    width: 100%;
  }

}

@media screen and (min-width: 960px) {
  .view--map {
    height: 455px;
  }
}