.sf-translate {
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    outline: none; }
    .sf-translate select.sf-form-control {
      display: none; }
      .sf-translate select.sf-form-control:disabled ~ .select-items {
        display: none !important; }
    .sf-translate select.sf-form-control-sm + .select-items div {
      padding: 0.65625rem 2.49375rem 0.65625rem 0.875rem; }
    .sf-translate select.sf-form-control-lg + .select-items div {
      padding: 0.9375rem 3.5625rem 0.9375rem 1.25rem; }
    .sf-translate label {
      cursor: pointer;
      margin: 0;
      padding: 0.5rem 2.5rem 0.5rem 1rem;
      box-sizing: border-box;
      outline: none; }
      .theme-dark .sf-translate label:after {
        border-bottom: 1px solid #fff;
        border-left: 1px solid #fff;
      }
      .theme-light .theme-dark .sf-translate label:after {
        border-bottom: 1px solid #fff;
        border-left: 1px solid #fff;
      }
      .theme-light .sf-translate label:after {
        border-bottom: 1px solid rgba(21,25,30,.87);
        border-left: 1px solid rgba(21,25,30,.87);
      }
      .theme-dark .theme-light .sf-translate label:after {
        border-bottom: 1px solid rgba(21,25,30,.87);
        border-left: 1px solid rgba(21,25,30,.87);
      }
      .sf-translate label:after {
        content: "";
        position: absolute;
        top: calc(50% - 0.35rem);
        right: 1rem;
        width: 0.5rem;
        height: 0.5rem;
        border: none;
        border-bottom: 1px solid rgba(21,25,30,.87);
        border-left: 1px solid rgba(21,25,30,.87);
        transform: rotate(-45deg);
        font-size: 0.85rem;
        box-sizing: border-box;
        outline: none;
        transition: transform 0.25s; }
      .sf-translate label:hover {background-color: rgba(0,0,0,0.05);}
      .theme-dark .sf-translate label:hover {
        background-color: rgba(255,255,255,.12);
      }
      .theme-light .theme-dark .sf-translate label:hover {
        background-color: rgba(255,255,255,.12);
      }
      .theme-light .sf-translate label:hover {
        background-color: rgba(0,0,0,.05);
      }
      .theme-dark .theme-light .sf-translate label:hover {
        background-color: rgba(0,0,0,.05);
      }
      .theme-dark .sf-translate .select-items div {
        background-color: #212529;
      }
      .theme-dark .sf-translate .select-items div:hover {
        background-color: #333;
      }
      .theme-light .theme-dark .sf-translate .select-items div {
        background-color: #212529;
      }
      .theme-light .theme-dark .sf-translate .select-items div:hover {
        background-color: #333;
      }
      .theme-light .sf-translate .select-items div {
        background-color: #fff;
      }
      .theme-dark .theme-light .sf-translate .select-items div {
        background-color: #fff;
      }
      .sf-translate label.active {
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;}
        .sf-translate label.active:after {
          transform: rotate(135deg);
          top: calc(100% - 1.2rem); }
    .sf-translate .select-items {
      position: absolute;
      top: 100%;
      left: 0;
      z-index: 300;
      border: none;
      box-shadow: 0 3px 5px -1px rgba(0,0,0,.2), 0 6px 10px 0 rgba(0,0,0,.14), 0 6px 18px 0 rgba(0,0,0,.12);
      box-sizing: border-box;
      outline: none; }
      .sf-translate .select-items.inactive {
        display: none; }
      .sf-translate .select-items div {
        padding: 0.5rem 2.85rem 0.5rem 1rem;
        cursor: pointer;
        background-color: white;
        color: inherit;
        top: 100%;
        font-size: 0.85rem;
        box-sizing: border-box;
        outline: none; }
        .sf-translate .select-items div:hover {
            background-color: #eee;
          }
        .sf-translate .select-items div.same-as-selected {
          background-color: #eee;
          }