body {
  margin: 0;
  padding: 2%;
  position: relative;
}

#switch, #a, #b {
  position: absolute;
}
#switch:focus, #a:focus, #b:focus {
  outline: 0;
}

#switch {
  left: 48.25%;
  width: 3.5%;
  height: 50px;
  top: 155px;
  text-align: center;
  font-weight: bolder;
  font-size: 22px;
  font-family: Arial;
}

#a, #b {
  width: 44%;
  height: 225px;
  box-sizing: border-box;
  border: 2px solid #888;
  border-bottom: 0;
  top: 30px;
  resize: none;
}
#a:nth-letter(even), #b:nth-letter(even) {
  color: #f00;
  background: #000;
}

#a {
  left: 3%;
}
#a::-webkit-scrollbar {
  display: none;
}

#b {
  left: 97%;
  transform: translateX(-100%);
}

#a_, #b_ {
  position: absolute;
  top: 255px;
  width: 44%;
  height: 75px;
  box-sizing: border-box;
  border: 2px solid #454545;
  border-top: 0px;
  background: #888;
  color: #fff;
  font-size: 63px;
  font-family: Consolas;
  text-indent: 1.5%;
}

#a_ {
  left: 3%;
}

#b_ {
  left: 97%;
  transform: translateX(-100%);
}

#exec {
  position: absolute;
  top: 300px;
  left: 48.25%;
  width: 3.5%;
  height: 30px;
  font-size: 15px;
  text-align: center;
}

#article {
  padding: 350px 10% 0;
  font-family: Arial, Helvetica, sans-serif;
}