/*
 ****************************************************************
 * @author: Martijn De Jongh (Martino), martijn.de.jongh@gmail.com
 * https://github.com/Martinomagnifico
 *
 * CopyCode.js for Reveal.js
 * Version 1.1.0
 * 
 * @license 
 * MIT licensed
 *****************************************************************
*/
:root {
  --cc-copy-bg: orange;
  --cc-copied-bg: green;
  --cc-copy-color: black;
  --cc-copied-color: white;
  --cc-scale: 1;
  --cc-offset: 0;
  --cc-radius: 0;
  --cc-borderwidth: 2;
  --cc-copyborder: 0;
  --cc-copiedborder: 0;
}

.reveal pre, .codeblock {
  width: 100%;
}

.codeblock {
  margin: 20px auto;
  position: relative;
}
.sourceCode .codeblock {
  margin: 0;
}
.codeblock pre .code-copy-button {
  display: none;
}
.codeblock > button {
  opacity: 0.5;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  right: 0;
  right: calc(var(--cc-offset, 0) * 1em);
  top: 0;
  top: calc(var(--cc-offset, 0) * 1em);
  background-color: var(--cc-copy-bg, orange);
  color: var(--cc-copy-color, black);
  border: var(--cc-copyborder, 0);
  margin: 0;
  padding: 0.2em 0.5em;
  font-family: inherit;
  font-size: 1.5rem;
  border-radius: 0;
  border-radius: calc(var(--cc-radius, 0) * 1em);
  font-size: calc(var(--cc-scale, 1) * 1.5rem);
  line-height: 1.25em;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  -webkit-transition: background-color 0.25s ease-in-out, opacity 0.25s ease-in-out;
  -o-transition: background-color 0.25s ease-in-out, opacity 0.25s ease-in-out;
  transition: background-color 0.25s ease-in-out, opacity 0.25s ease-in-out;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  cursor: pointer;
}
.codeblock > button svg {
  fill: var(--cc-copy-color);
  height: 1.25em;
  width: 0.8em;
}
.codeblock > button svg + span {
  margin-left: 0.25em;
}
.codeblock > button svg:last-of-type {
  display: none;
}
.codeblock > button[data-cc-display=icons] span {
  line-height: 1.25em;
  -webkit-transform: translate3d(-100%, -50%, 1px);
          transform: translate3d(-100%, -50%, 1px);
  pointer-events: none;
  opacity: 0;
  -webkit-transition: all 0.15s ease-in-out;
  -o-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
  font-size: 1.2rem;
  position: absolute;
  background: black;
  padding: 0.25em 0.5em;
  left: 0;
  top: 50%;
  border-radius: 0.2em;
  color: white;
  margin-left: -0.5em;
}
.codeblock > button[data-cc-display=icons] span::after {
  content: "";
  display: block;
  width: 0.66em;
  height: 0.66em;
  background: black;
  position: absolute;
  right: 0;
  top: 50%;
  -webkit-transform: translate3d(45%, -50%, -1px) rotate(45deg);
          transform: translate3d(45%, -50%, -1px) rotate(45deg);
}
.codeblock > button[data-cc=hover] {
  opacity: 0;
}
@media (hover: none) {
  .codeblock > button[data-cc=hover] {
    opacity: 1;
  }
}
.codeblock > button[data-cc=false] {
  display: none;
}
.codeblock > button[disabled] {
  opacity: 1;
  background-color: var(--cc-copied-bg, green);
  color: var(--cc-copied-color, white);
  border: var(--cc-copiedborder, 0);
  cursor: default;
}
.codeblock > button[disabled] svg {
  fill: var(--cc-copied-color, white);
}
.codeblock > button[disabled] svg:first-of-type {
  display: none;
}
.codeblock > button[disabled] svg:last-of-type {
  display: inline-block;
}
.codeblock > button[disabled][data-cc-display=icons] span {
  opacity: 1;
}
.codeblock > button:focus {
  outline: 0;
}
.codeblock:hover > button[data-cc=hover] {
  opacity: 0.5;
}

.codeblock > button:hover,
.codeblock > button[data-cc=hover]:hover,
.codeblock > button[disabled],
.codeblock:hover > button[disabled],
pre > button:hover {
  opacity: 1;
}