style.css

body {
  background: #131417;
  color:#fff;
  font-family: "Courier New", Courier, monospace;
  padding-left: 20px;
}

button {
  display: inline;
  font-weight: bold;
  font-family: 'Fira Code';
  color: #fff;
  padding-top: 5px;
  padding-bottom: 5px;
  margin-top: 5px;
  margin-bottom: 5px;
  border-radius: 12px;
  background-color: #32343b;
  border-color:#1D1E22;
}
#color{

  font-weight: bold;
  font-family: 'Fira Code';
  color: #fff;
  padding-top: 5px;
  padding-bottom: 5px;
  margin-top: 5px;
  margin-bottom: 5px;
  border-radius: 12px;
  background-color: #32343b;
  border-color:#1D1E22;
}

.container{
  width: 100%;
  overflow:scroll;
  padding:10px;
}
#c {
  background-color: #fff;
}
.wrapper {
  float: left;
  width: 550px;
}

#generatedCode {
  float: left;
  color:white;
  background-color:#1D1E22;
  overflow: scroll;
  
  font-family: 'Fira Code', 'Inconsolata', monospace;
  font-weight: bold;
  
  width: 50%;  
  height: 500px;
  border-radius: 12px;
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
  
}
#generatedCode::-webkit-scrollbar {
  display: none;
}