/*--------------- input type ---------------------- */

input {
  max-width: 100%;
  max-height: 1.5em;
  border: none;
  border-bottom: .1rem solid $color-sec;
  transition: width .5s;
  outline: 0;
  background: transparent;
  @media #{$brk-wide} {
    //		border-bottom-width: 0.1em;
  }
}

#typeans {
  display: inline-block;
  min-width: 5%;
  max-width: 99.99% !important;
  margin: -.25em auto; //	box-shadow: 0 1px 14px rgba(0, 0, 0, 0.12);
  box-sizing: border-box;
}

/*--------------- input focus---------------------- */

//inset 0 1px 1px rgba(0, 0, 0, 0.075), 
#typeans:focus,
#typeans1:focus,
#typeans2:focus,
#typeans3:focus,
#typeans4:focus,
#typeans5:focus,
#typeans6:focus,
#typeans7:focus,
#typeans8:focus,
#typeans9:focus,
#typeans10:focus,
#typeans11:focus,
#typeans12:focus,
#typeans13:focus,
#typeans14:focus,
#typeans15:focus,
#typeans16:focus,
#typeans17:focus,
#typeans18:focus,
#typeans19:focus,
#typeans20:focus,
#typeans21:focus {
  border-color: $color-prim;
  outline: 0;
  box-shadow: 0 1px 14px $color-shadow;
  border: none;
  border-bottom: .2rem solid $color-sec;
  border-bottom-left-radius: .1em;
  border-bottom-right-radius: .1em;
}

input#typeans {
  background: transparent;
  align-content: stretch;
  vertical-align: text-top;
}

.win input#typeans {
  margin-top: 0;
}

// code#typeans{
// 	background-color: $white;
// 	padding: 10px;
// 	border: none;
// 	border-bottom-left-radius: 8px;
// 	border-bottom-right-radius: 8px;
// }
code#typeans {
  display: block;
  background-color: $white; //  padding: 10px;
  border: none;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  white-space: nowrap;
  word-break: keep-all;
  tab-size: 4;
}

.question>div>div>span>span {
  color: $color-prim;
}

// correction for "dynamic resize input fields" function
.buffer {
  position: absolute;
  top: -1000px;
  left: -1000px;
  visibility: hidden;
  white-space: nowrap;
}