.code {
  position: relative;
}

#copyButton {
  position: absolute;
  top: 10px;
  right: 10px;
}

button.copy-code-button {
    float: right;
}

.wpdevph-code {
  background: #343541;
  border-radius: 10px;
  padding-top: 3px;
  padding-bottom: 0 !important;
  margin-bottom: 13px;
}

.type-of-code {
  color: #ebebeb;
  margin-left: 10px;
  font-size: 12px;
  margin-bottom: 2px;
  position: absolute
}

.copy-code-button {
  background: #343541;
  color: #ebebeb;
  margin-right: 10px;
  cursor: pointer;
  outline: none;
  font-size: 12px;
  border:none;
}

.copy-code-snippet {
  border-radius: 0 !important;
  font-family: Consolas,monospace !important;
  font-size: 15px !important;
  background: #fdfdfd;
  color: #181818 !important;
  max-height: 500px !important;

  border-radius: 0 0 10px 10px !important;
  overflow-y: scroll !important;

}

/* width */
.copy-code-snippet::-webkit-scrollbar {
  width: 17px;
  background: #f1f1f1;

}

/* Track */
.copy-code-snippet::-webkit-scrollbar-track {
  background: #f1f1f1; 

}

.copy-code-snippet::-webkit-resizer {
  display: none;
  background: #f1f1f1; 
}
 
/* Handle */
.copy-code-snippet::-webkit-scrollbar-thumb {
  background: #888; 
  cursor: default !important;
}

/* Handle on hover */
.copy-code-snippet::-webkit-scrollbar-thumb:hover {
  background: #555; 
}