style.css

textarea {
	width: 600px;
	height: 120px;
	border: 3px solid #cccccc;
	padding: 5px;
	font-family: Tahoma, sans-serif;
	background-image: url(bg.gif);
	background-position: bottom right;
	background-repeat: no-repeat;
}

p.rtl {
  font-family: "AlefMultiGenderHebrew";
  direction: rtl;
}

@font-face {
    font-family: "AlefMultiGenderHebrew";
    src: url("fonts/AlefMultiGndr-Regular.woff");
}

#app_container {
  font-family: "AlefMultiGenderHebrew";
  display: grid;
  grid-template-columns: 80px 200px auto 40px;
  width: 70%;
  padding: 10px;
}

span{
  white-space: pre;
}

.wrapper{
  width: 20%;
  /* Center vertically and horizontally */
  position: absolute;
  top: 20%;
  left: 50%;
  margin: -25px 0 0 -25px; /* apply negative top and left margins to truly center the element */
}

.output{
  font-size: 24px;
}

h4.rev-input{
  width: 15%;
  height: 200px;
  color: red;
  float: right;
}