#toolapp > div {
  /* display: flex;
  gap: 0.5em;
  flex-direction: column; */
}
html {
  --height-width1: 500px;
  --height-width2: 300px;
}
#toolapp {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  place-items: center;
}
#toolapp .cnv:nth-child(1) {
  height: var(--height-width1);
  width: var(--height-width1);
  place-self: center;
  grid-area: 1 / 1 / 2 / 3;
  /* border: 1px solid; */
}
#toolapp .cnv:nth-child(1) img {
  height: var(--height-width1);
  width: var(--height-width1);
}
#toolapp .cnv:nth-child(2) img,
#toolapp .cnv:nth-child(3) img {
  height: var(--height-width2);
  width: var(--height-width2);
}
#toolapp .cnv:nth-child(2),
#toolapp .cnv:nth-child(3) {
  height: var(--height-width2);
  width: var(--height-width2);
  /* border: 1px solid; */
}
.cnv .view {
  position: relative;
  height: inherit;
  width: inherit;
}
.cnv .view .gloveslice {
  position: absolute;
}
option,
select {
  text-transform: capitalize;
}
.views {
  padding: 1em;
  background: #708287;
}
#toolapp > aside {
  display: grid;
  column-count: 2;
  grid-template-columns: repeat(2, 10em);
  gap: 1em;
}
#toolapp > aside > hr,
#webster {
  grid-column: 1/4;
}
#toolapp > .views {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  grid-column-gap: 0px;
  grid-row-gap: 0px;
}