#trailer {
  height: 20px;
  width: 20px;
  background-color: rgba(60, 76, 199, 0.7);
  border-radius: 20px;
  position: fixed;
  left: 0px;
  top: 0px;
  z-index: 10000;

  pointer-events: none;
  opacity: 0;
  transition: opacity 500ms ease;

  display: grid;
  place-items: center;
}

#trailer-icon {
  font-size: 6px;
  line-height: 4px;
  color: white;
  opacity: 0;
  transition: opacity 500ms ease;
}

body:hover > #trailer {
  opacity: 1;
}

#trailer:not([data-type='']) > #trailer-icon {
  opacity: 1;
}

.interactable {
  opacity: 0.7;
  transition: transform;
  transition-timing-function: ease;
  transition-duration: 800ms;
}

.interactable:hover {
  transition: transform;
  transition-timing-function: ease;
  transition-duration: 400ms;
  transform: scale(1.05);
  opacity: 1;
}