.zoom {
    padding: 50px;
    transition: transform .2s; /* Animation */
    width: 647px;
    height: 346px;
    margin: 0 auto;
  }
  
  .zoom:hover {
    transform: scale(1.45);
  }    
.buttons {
        margin-top: 25px;
        margin-left: 20%;
      }
      
      button {
        background: none;
        border: none;
        cursor: pointer;
        height: 24px;
        outline: none;
        padding: 0;
        width: 24px;
      }
      
      #play {
        background-image: url(https://rpsthecoder.github.io/js-speech-synthesis/play.svg);
      }
      
      #play.played {
        background-image: url(https://rpsthecoder.github.io/js-speech-synthesis/play1.svg);
      }
      
      #pause {
        background-image: url(https://rpsthecoder.github.io/js-speech-synthesis/pause.svg);
      }
      
      #pause.paused {
        background-image: url(https://rpsthecoder.github.io/js-speech-synthesis/pause1.svg);
      }
      
      #stop {
        background-image: url(https://rpsthecoder.github.io/js-speech-synthesis/stop.svg);
      }
      
      #stop.stopped {
        background-image: url(https://rpsthecoder.github.io/js-speech-synthesis/stop1.svg);
      }