.mapapimethod {
  font-size: 12px;
  font-family: Monaco, Andale Mono, Courier New, monospace;
}
#thumbnails {
  margin: 20px auto 16px auto;
  padding-bottom: 16px;
}
#thumbnails ul {
  margin: 0;
  text-align: center;
}
#thumbnails li {
  margin-left: 6px;
  margin-bottom: 0px;
}
.thumbnail {
  border-radius: 0;
  border: none;
  box-shadow: none;
}
.thumbnail img {
  border: solid 1px #a4a7a9;
}
.thumbnail img.disabled {
  cursor: default;
  filter: grayscale(100%);
}
#thumbnails h4 {
  margin: 2px 0 4px 10px;
  padding: 0;
  text-align: center;
}
#transitionwrapper {
  position: relative;
  margin: 370px auto -365px 5px;
  text-align: left;
  z-index: 1000;
}
#transitionwrapper input {
  min-width: 125px;
}
.demo-thumb {
  list-style: none;
  display: inline-block;
  margin-right: 25px;
  margin-bottom: 20px;
  margin-top: 20px;
  width: 260px;
  vertical-align: top;
  text-align: center;
}
.demo-title h4 {
  margin-bottom: 4px;
}
.demo-img img {
  border: solid 1px #a4a7a9;
}
.demo-desc {
  margin: 0px 30px;
}
.mapwrapper {
  text-align: center;
}
.mapwrapper .cichart,
.mapwrapper .klchart {
  display: inline-block;
  margin: 0 auto;
}
.mapwrapper .cichart {
  width: 100%;
  height: 370px;
}
.leaflet-control-attribution {
  text-align: right;
}
#thumbnail-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  flex-direction: row;
}
.map-thumbnail {
  padding: 5px;
}
@media (min-width: 1200px) {
  .mapwrapper .cichart {
    height: 500px;
  }
  #transitionwrapper {
    margin: 500px auto -495px 5px;
  }
}