style.css

html, body {
    /* stop margins */
      margin: 0;
    /* stop scrolling */
      overflow: hidden;
    /* set background */
      background-color: rgb(13, 32, 59);
    }
    
    * {
        font-size: 1.25vw;
    }
    
    #speedSlider {
      width: 9%;
    }
    
    textarea { /* for all text area */
      outline: none;
      color: white;
      margin: 1%;
      font-family: monospace;
      justify-content: space-between;
      white-space: pre-wrap;
      resize: none;
      border-style: hidden;
    }
    
    .LMCBox {
      background-color: rgb(26, 62, 116);
    }
    
    #codeInput { /* for just one element (the code input box here) */
      width: 20%;
      height: 88%;
    }
    
    #assembledCode {
      width: 7.5%;
      height: 88%;
    }
    
    #inputBox {
      width: 3.75%;
      height: 3%;
      overflow: hidden;
    }
    
    
    #titleBox {
      margin-top: 0;
      width: 20%;
      height: 4.5%;
    }
    
    #outputtedCode {
      width: 15%;
      height: 30%;
    }
    
    #inputSubmit {
      margin: 1%;
      background-color: grey;
    }
    
    .optionButton {
      height: 5%;
      margin-left: 1%;
      background-color: grey;
    }
    
    .optionButton:hover, #inputSubmit:hover {
      background-color: #616161
    }
    
    .optionButton:active, #inputSubmit:active {
      background-color: #454545
    }
    
    button {
      display: inline-block;
      border: none;
      cursor: pointer;
      text-align: center;
      border-style: hidden;
      font-family: monospace;
    }
    
    .menuButton {
      height: 5%;
      width: 7.5%;
      background-color: rgb(0, 122, 55);
      color: white;
    }
    
    .menuButton:hover { /* when the mouse is over the button */
      background-color: rgb(1, 96, 44);
    }
    
    .menuButton:active { /* when the mouse is clicked on the button */
      background-color: rgb(1, 65, 30);
    }