.radio {
  display:inline-block;
  position:relative;
  .caption{
    display:inline-block;
    height:$component-size;
    line-height: $component-size;
    vertical-align:middle;
    font-size: $font-size;
    cursor: pointer;
  }
  input{
    position:absolute;
    opacity:0;
    display:block;
    width:100%;
    height:100%;
    cursor: pointer;
    &+ .check {
      border:$border-width solid $border-color;
      width:$component-size;
      height:$component-size;
      border-radius: 100%;
      display:inline-block;
      vertical-align:middle;
      position:relative;
      cursor: pointer;
      &:after {
        position: absolute;
        vertical-align: middle;
        font-size: 0;
        content: "";
        width:1rem;
        height:1rem;
        left:50%;
        top:50%;
        margin-left:-0.5rem;
        margin-top:-0.5rem;
        background:transparent;
        border-radius:100%;
        display: block;
        transition: all 0.2s linear;
      }
    }
    &:checked{
      &+  .check:after {
        transition: all 0.2s linear;
        background:$success-color;
      }
    }
  }
}

.radio-group{
  display: inline-block;
}