/* ######################## Suggest ################### */


.suggestAchor { position:relative; vertical-align:bottom; display:block; }
.suggestAchor.inlineAchor { display:inline-block; }
.suggestAchor .suggest {
  position:absolute;
  left:0px;
  top:42px;
  display:none;
  background:#fff;
  border: 1px solid #bbb3ab;
  z-index:90000;
  transition:opacity 0.3s;
  overflow-y:auto;
  border-radius:3px;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  -ms-box-sizing:border-box;
  min-width: 432px;
  opacity: 0;
  box-shadow:0 0 10px rgba(0, 30, 73, 0.5);
  max-width:300px;
}
.suggestAchor.inlineAchor .suggest {
  top:0px;
}

.suggestAchor .suggestMiniMap {
  position:absolute;
  top:42px;
  width:300px;
  display:none;
  background:#D10074;
  color:#fff;
  box-shadow:0 0 10px rgba(0, 30, 73, 0.5);
  border:1px solid #B0AFAD;
  box-sizing:border-box;
  z-index:10000;
}

.suggestAchor .suggestMiniMap .mapDiv {
  height:300px;
  background:#E9E9E9;
}

.suggestAchor .suggestMiniMap .mapHeader {
  background:#D10074;
  color:#fff;
  padding: 5px 10px;
  font-weight:bold;
  border-bottom:1px solid rgba(187,179,171, 0.3);
}

.suggestAchor .suggest .item {
  position: relative;
  padding: 10px 24px 10px 30px;
  vertical-align: middle;
  text-align:left;
  cursor:pointer;
  white-space:nowrap;
  text-overflow:ellipsis;
  overflow:hidden;
  border-bottom:1px solid rgba(187,179,171, 0.3);
  white-space:nowrap;
  font-weight:bold;
  color:#4d4d4d;
}

.suggestAchor .suggest .suggestHead {
  padding: 5px 24px 5px 30px;
  text-align:left;
  font-weight:bold;
  color:#fff;
  background-color:#D10074;
  border-bottom:1px solid #752864;
}

.suggestAchor .suggest .item.marked {
  color:#D10074;
  background:#eee;
}

.suggestAchor .suggest .item .suggestMiniMapIcon {
  position:absolute;
  top:50%;
  right:5px;
  margin-top:-7px;
}

.suggestAchor .suggest .item .suggestDeleteIcon {
  position:absolute;
  top:50%;
  right:28px;
  margin-top:-6px;
}

.suggestAchor .suggest .item i {
    position: absolute;
    display: inline-block;
    top: 50%;
    left: 4px;
  width:22px;
  height:22px;
  margin-top:-11px;
}

.suggestAchor .suggest .item:hover {
  color:#fff;
  background:#D10074;
}


/* ########################## HafasConnectionHistoryDisplay ################## */

.hafasConnectionHistoryDisplay .hafasHistoryContent {
  background:#F8F8F8;
  border: 1px solid #d6d6d6;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) inset;
  color: #1a1a1a;
  border-radius: 3px;
  overflow:hidden;
  max-height:250px;
  overflow-y;auto;
  margin-bottom:20px;
}

.hafasConnectionHistoryDisplay .hafasHistoryContent .hafasHistoryItem {
  padding:6px 30px 6px 15px;
  border-bottom:1px solid #d6d6d6;
  font-weight:bold;
  cursor:pointer;
  position:relative;
}

.hafasConnectionHistoryDisplay .hafasHistoryContent .hafasHistoryItem .hfsHistArrow {
  display:inline-block;
  vertical-align:middle;
  width:9px;
  height:9px;
  margin-right:10%;
}

.hafasConnectionHistoryDisplay .hafasHistoryContent .hafasHistoryItem  .hafasHistoryDeleteButton {
  position:absolute;
  right:5px;
  top:50%;
  margin-top:-6px;
  width:13px;
  height:13px;
}

.hafasConnectionHistoryDisplay .hafasHistoryContent .hafasHistoryItem:hover {
  background:#D10074;
  color:#fff;
}

.hafasConnectionHistoryDisplay .hafasHistoryContent .hafasHistoryItem.noEntry,
.hafasConnectionHistoryDisplay .hafasHistoryContent .hafasHistoryItem.noEntry:hover {
  cursor:default;
  font-style:italic;
  color:#999;
  background:#F8F8F8;
}

.hafasConnectionHistoryDisplay .hafasHistoryContent .hafasHistoryItem span.locName {
  vertical-align:middle;
}

.hafasConnectionHistoryDisplay .hafasHistoryContent .hafasHistoryItem span.locName:first-child {
  display:inline-block;
  width:40%;
  min-width:150px;
}

.hafasConnectionHistoryDisplay .hafasHistoryContent .hafasHistoryItem:last-child {
  border:none;
}

@media only screen and (max-width:768px) {

  body #HFS .suggestAchor .suggest .item .suggestMiniMapIcon {
    display:none;
  }

  body #HFS .suggestAchor .suggest {
      min-width: 250px;
  }

}