.dropdown-container {
  display: flex;
  width: 50%;
}
.checkbox-container {
  display: flex;
  width: 50%;
}
.checkbox {
  flex: auto;
}
.box-container {
  width: 100%;
}
.input-container {
  float: left;
  width: 50%;
}
.output-container {
  white-space: pre-wrap;
  float: left;
  width: 100%;
  height: 100%;
  text-align: justify;
  text-justify: inter-word;
}
.edit {
  background-color: #0D6EFD;
  font-weight: bold;
  color: white;
  border-radius: 5px;
  text-decoration: none;
}

.edit:hover {
  color: white;
  text-decoration: none;
}

.circle-sketch-highlight{
  position:relative;
}

.circle-sketch-highlight:before{
  content:"";
  z-index:-1;
  left:-0.5em;
  top:-0.1em;
  border-width:2px;
  border-style:solid;
  border-color:red;
  position:absolute;
  border-right-color:transparent;
  width:100%;
  height:1em;
  transform:rotate(2deg);
  opacity:0.7;
  border-radius:50%;
  padding:0.1em 0.25em;
}

.circle-sketch-highlight:after{
  content:"";
  z-index:-1;
  left:-0.5em;
  top:0.1em;
  padding:0.1em 0.25em;
  border-width:2px;
  border-style:solid;
  border-color:red;
  border-left-color:transparent;
  border-top-color:transparent;
  position:absolute;
  width:100%;
  height:1em;
  transform:rotate(-1deg);
  opacity:0.7;
  border-radius:50%;
}