nonFuncButton {
  background-color: rgb(240, 240, 240);
  border: 1px solid rgb(150, 150, 150);
  color: black;
  padding: 2px 15px;
  border-radius: 4px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-family: arial, sans-serif;
  font-size: inherit;
}

helpItem {
  background-color: rgb(255, 240, 140);
  border: 1px solid black;
  color: black;
  padding: 2px 4px;
  border-radius: 4px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-family: arial, sans-serif;
  font-size: inherit;
}


menuItem {
  color: black;
  word-wrap: break-word;
  background: rgb(240, 240, 240);
  padding: 4px;
  border-radius: 4px;
  font-family: arial, sans-serif;
  font-size: inherit;
}

code {
  font-family: courier, monospace;
  font-size: inherit;
}

p > code {
  color: black;
  word-wrap: break-word;
  background: rgb(240, 240, 240);
  padding: 4px;
  border-radius: 4px;
}

p > code.cmd {
  font-weight: bold;
  color: blue;
  background: none;
  padding: 0px;
  border-radius: 0px;
}

p > code.ans {
  font-weight: bold;
  color: black;
  background: none;
  padding: 0px;
  border-radius: 0px;
}

.code-container > code {
  font-weight: bold;
  white-space: pre;
  padding: 0;
}

.code-container {
  width: 75vw;
  box-shadow: inset 0px 2px 4px 0px rgba(0, 0, 0, 0.4);
  border-radius: 10px;
  max-height: 250px;
  padding: 15px 20px;
  overflow-x: auto;
  overflow-y: auto;
  background: rgb(240, 240, 240);
  margin-bottom: 2em;
}

.code-container::-webkit-scrollbar {
  height: 8px;
	width: 8px;
}

.code-container::-webkit-scrollbar-track:horizontal {
  background: rgb(0, 0, 0, 0.1);
  border-radius: 0px 0px 0px 10px;
}

.code-container::-webkit-scrollbar-track:vertical {
  background: rgb(0, 0, 0, 0.1);
  border-radius: 0px 10px 0px 0px;
}

.code-container::-webkit-scrollbar-thumb {
	background: rgb(0, 0, 0, 0.4);
}

.code-container::-webkit-scrollbar-thumb:horizontal {
	border-radius: 0px 0px 10px 10px;
}

.code-container::-webkit-scrollbar-thumb:vertical {
	border-radius: 0px 10px 10px 0px;
}

.code-container::-webkit-scrollbar-thumb:hover {
	background: rgb(0, 0, 0, 0.6);
}

.code-container::-webkit-scrollbar-corner {
	background: rgb(0, 0, 0, 0.1);
  border-radius: 0px 0px 10px 0px;
}

.R-func {
  color: blue;
}
.R-bool {
  color: purple;
}

.R-num {
  color: blue;
}

.R-str, .R-str * {
  color: green;
}


@media (min-width: 650px) {

  .code-container {
    width: 560px;
    max-height: 350px;
  }

}

@media (min-width: 1200px) {

  .col-left .code-container {
    width: 560px;
  }

  .col-right .code-container {
    width: 380px;
    max-height: 450px;
  }

}