.details_webapp > summary {
  font-size: large;
  font-weight: bold;
  margin-bottom: 1em;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 7px;
}
.details_webapp > summary::before {
  content: '';
  display: inline-block;
  height: 1.5em;
  width: 1.5em;
  background-image: url('../images/arrow_l.svg');
  background-size: contain;
  background-repeat: no-repeat;
  transition-duration: 0.2s;
}
.details_webapp[open] > summary::before {
  transform: rotate(90deg);
}

.inlineapp {
  padding-bottom: 1px;
}

.inlineapp .domainsetting {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
}

.inlineapp .domainform {
	display: grid;
	grid-template-columns: repeat(4, auto);
  grid-column-gap: 0.5em;
	float: left;
  justify-items: right;
}

.inlineapp .domainformbutton {
  display: flex;
  margin-left: 0.5em;
  margin-right: 1em;
}

.inlineapp .domainform input {
  width: 5ch;
}

.inlineapp .metricform {
  display: grid;
  grid-template-columns: auto auto auto;
  grid-template-rows: 2.5ex 2.5ch;
}

.inlineapp .metricdiv {
  display: flex;
  flex-wrap: wrap;
}

.inlineapp .metricdiv .centerdot {
  display: flex;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}

.inlineapp .canvascont {
/*background-color: #f1f1f1; */
  padding: 20px;
  margin: 20px;
  text-align: center;
}

.inlineapp .canvasInte {
	margin: 0 auto;
	display: block;
	cursor: pointer;
	background-color: #ffffff;
}

