pre.code-toolbar {
  position: relative;
}

pre.code-toolbar>.toolbar {
  position: absolute;
  top: .3em;
  right: .2em;
  transition: opacity 0.3s ease-in-out;
  opacity: 0;
}

pre.code-toolbar:hover>.toolbar {
  opacity: 1;
}

pre.code-toolbar>.toolbar .toolbar-item {
  display: inline-block;
}

pre.code-toolbar>.toolbar a {
  cursor: pointer;
}

pre.code-toolbar>.toolbar button {
  background: none;
  border: 0;
  color: inherit;
  font: inherit;
  line-height: normal;
  overflow: visible;
  padding: 0;
  user-select: none;
  /* for button */
}

pre.code-toolbar>.toolbar a,
pre.code-toolbar>.toolbar button,
pre.code-toolbar>.toolbar span {
  color: #bbb;
  font-size: .8em;
  padding: 0 .5em;
  background: #f5f2f0;
  background: rgba(224, 224, 224, 0.2);
  box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.2);
  border-radius: .5em;
}

pre.code-toolbar>.toolbar a:hover,
pre.code-toolbar>.toolbar a:focus,
pre.code-toolbar>.toolbar button:hover,
pre.code-toolbar>.toolbar button:focus,
pre.code-toolbar>.toolbar span:hover,
pre.code-toolbar>.toolbar span:focus {
  color: inherit;
  text-decoration: none;
}

button {
  cursor: pointer;
}

button.copy-to-clipboard-button {
  background: #795548 !important;
  padding: 2px !important;
}