.synonym {
  height: 30px;
  background-color: whitesmoke;
  border-radius: 10px;
  padding: 6px 7.5px;
  padding-right: 25px;
  margin: 4px;
  margin-left: 5px;
  display: inline-block;
  box-shadow: 0px 0px 5px -2px #333;
  float: left;
  transition: border-radius 0.35s, background-color 0.15s, width 0.15s;
}
.synonym.for-view {
  padding-right: 0px;
  padding: 6px 7.5px;
}
.synonym .synonym-edit {
  /* width: auto; */
}
.synonym p {
  display: inline-block;
  margin-bottom: 0px;
}
.synonym:hover {
  background-color: lightgray;
}
.synonym.edit {
  height: 30px;
  /* padding: 0px; */
  border-radius: 0px;
}
.synonym.edit:hover {
  background-color: whitesmoke;
}
.synonym .delete-btn {
  position: absolute;
  background-color: transparent;
  border: none;
  float: right;
  margin-top: 2px;
  margin-left: 7px;
}
.synonym .delete-btn.on-edit-mode {
  /* margin-left: 0px; */
}
.synonym .delete-btn.hide {
  display: none;
}