
body{
    font-family: 'Courier New', Courier, monospace;
    background-color: #fff;
}

#inputContainer{
    display: flex;
    justify-content: center; 
}

#videosContainer{
    display: flex;
    justify-content: center;
    align-items: top;
}

#inputContainer{
    background-color: #fff ;
    padding: 1em;
}

.inputoutput{
    width: 640px;
    height: 360px;
}

#srcContainer{
    display: none;
    background-color: #343332 ;
    position: relative;
}

#dstContainer{
    background-color:lightgray ;
    position: relative;
}

.inputoutput{
    margin: 2px;
}

#svgInput, 
#svgOutput {
    position: absolute;
    top: 0;
    left: 0;
}
#svgInput,
#svgOutput {
    z-index: 10;    
}

#overlayImage {
    position: absolute;
    top: 0;
    left: 0; 
    opacity: 0.5;   
}

button {
    background-color: #fff; /* Green */
    border: 1px solid #dc5042;
    color: black;
    margin: 2px;
    padding: 10px 16px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
  }

  input {
    background-color: #dc5042;
    color: white;
    margin: 2px;
    padding: 10px 16px;
  }