.translator-component {
  position: fixed;
  z-index: 99999999;
  width: 400px;
  height: 600px;
  background: white;
  border-radius: 10px;
  box-shadow: 0 0 10px black;
  overflow: hidden;
}
.translator-component .title {
  text-align: center;
  padding: 5px;
  background: #4820ab;
  color: white;
  box-shadow: 0 0 5px #00000066;
}
.translator-component .search {
  padding: 10px;
  box-shadow: 0 0 10px #e4e4e4;
}
.translator-component .search i {
  margin-right: 5px;
  margin-top: 3px;
  opacity: 0.41;
}
.translator-component .search .clean {
  color: #4820ab;
  opacity: 1;
  margin-left: 5px;
  margin-right: 0;
}
.translator-component .search input {
  border-color: #d2d2d2;
  border-style: solid;
}
.translator-component .text {
  padding: 12px 5px;
  border-bottom: 1px solid #eeeeee;
}
.translator-component .text .key {
  font-size: 12px;
  margin-bottom: 3px;
  color: #4e0ed1;
}
.translator-component .text .value {
  border-style: dashed;
  border-color: #cbcbcb;
  color: #3f3f3f;
}
.translator-component .text .value.modified {
  background-color: #e9fff7;
}
.translator-component .buttons {
  text-align: right;
  padding: 10px;
}