*{box-sizing:border-box}body{font-family:calibri;margin:0}.container{height:100vh;background:#f1f1f1;display:grid;grid-template-rows:30px minmax(0, 1fr) 60px}.tabs{display:flex;grid-row:1 / span 1}.tabs label{padding:5px 10px;display:inline-block;border:solid 1px #ccc;border-bottom:solid 1px transparent;transform:translateY(1px);cursor:pointer}.tabs span{margin-left:auto;color:#ccc}.tabs select{margin-left:auto}.tab-content{display:none;flex:1 1 auto;position:relative;background:#fff;border:solid 1px #ccc;flex-direction:row;flex-wrap:wrap;grid-row:2 / span 1}.tab-content .editor{width:100%;height:100%;overflow:hidden;border-right:solid 1px #ccc}input[type="radio"]{display:none}input[type="radio"]#r1:checked ~ .tabs #lr1{background-color:#fff;border-bottom:solid 1px #f1f1f1}input[type="radio"]#r1:checked ~ .tab-content.src{display:flex}input[type="radio"]#r2:checked ~ .tabs #lr2{background-color:#fff;border-bottom:solid 1px #f1f1f1}input[type="radio"]#r2:checked ~ .tab-content.diff{display:flex}.button-container{display:flex;position:relative;z-index:3;grid-row:3 / span 1;margin:0 auto;align-items:center;width:100%;padding:0 10px}.button-container .file-inputs{display:flex}.button-container .file-inputs .src{display:flex;flex:1 1 auto;justify-content:center}.button-container .file-inputs .src .url{margin-right:50px}.button-container #lang{margin-left:auto;height:40px;padding:0 10px}.button-container #formatCode{background:#2196F3;color:#fff;display:inline-block;padding:10px 35px;border-radius:5px;cursor:pointer;border:solid 1px #147acc;margin-left:20px}.button-container #formatCode:hover{background:#147acc}
