*[placeholder] {
  color: mix($fill-dark, $fill-primary, 50%);
  opacity: 0.85;
}

.u-input{
  padding-left: 16px;
  padding-top: 16px;
  padding-bottom: 16px;
  width: 100%;
  height: 61px;
  font-size: 18px;
  box-sizing: border-box;
  border: 0;
  border-bottom: solid 1px #eee;
  box-shadow: 1px 1px 3px #eee;
}

.s__area{
  
}

.s__content{
  min-height: 100px;
  background-color: #fff;
}

.s__content{
  min-height: 100px;
  background-color: #fff;
}


.s__result{
  margin: 16px;
  margin-top: 8px;
  padding-bottom: 8px;
}

.s__bar{
  position: absolute;
  
}

.s__bar--label{
  padding-top: 8px;
  font-size: 12px;
  color: $fill-dark-light;
}

.s__bar{
  position: absolute;
  top: 0;
  right: 0;
  width: 20%;
  padding-left: 1rem;
  padding-bottom: 8px;
}

.o-sel{
  &__is{
    width: 24px;
    height: 24px;
    border-radius:3rem;
    display: inline-block;
    // background-color: red;
  }

  &__not{
    width: 24px;
    height: 24px;
    border-radius:3rem;
    display: inline-block;
    background-color: #ddd;
    margin-right: 8px;
    vertical-align: top;
    &:hover{
      // background-color: red;
    }
  }
}

.box-therapy{
  box-shadow: 0 2px 24px 0 rgba(0, 0, 0, 0.14);
}

.box-therapy-lite{
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.095);
}

.o-author__name{  
  color: darken($fill-dark-light, 30%);
  font-family: $font-base;
}

.o-author__link{
  color: $fill-bright;
  text-decoration: none;
  font-weight: 600;
  &:hover{
    color: $fill-bright;
    border-bottom: solid 1px $fill-bright;
  }
}

.c-content{
  min-height: 400px;
}

.inline-icon svg{
  width: 20px;
  display: inline-block;
}


.cols{
  min-height: 40vh;
}

// Animation
.spinner {
  width: 80px;
  height: 80px;
  position: relative;
  margin: 0;
  display: inline-block;
  vertical-align: top;
  margin-right: 16px;
}

.spinner > div {
  width: 12px;
  height: 12px;
  background-color: #dcf70f;

  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0) }
  40% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bouncedelay {
  0%, 80%, 100% { 
    -webkit-transform: scale(0);
    transform: scale(0);
  } 40% { 
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}