.drop-radios {
  display: block;
  position: relative; }
  .drop-radios ul {
    list-style: none;
    padding: 0;
    margin: 0; }
  .drop-radios > em {
    display: block;
    position: relative; }
    .drop-radios > em:before {
      content: '';
      display: block;
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: 10;
      cursor: pointer;
      display: none; }
  .drop-radios button.toggle {
    display: block;
    position: relative;
    width: 100%;
    padding-right: 16px; }
    .drop-radios button.toggle strong {
      display: block;
      font-weight: 700;
      font-size: 16px;
      line-height: 19px;
      text-align: left;
      color: #333333;
      font-style: normal; }
    .drop-radios button.toggle:after {
      content: '';
      display: block;
      position: absolute;
      right: 4px;
      top: calc( 50% - 3.5px );
      width: 5px;
      height: 5px;
      margin-left: 8px;
      border: solid #111111;
      border-width: 0 1px 1px 0;
      transform: rotate(45deg);
      transition: all .4s ease-in-out; }
  .drop-radios label {
    display: block; }
  .drop-radios--options label {
    display: block;
    position: relative;
    padding: 0 16px; }
  .drop-radios--options input {
    display: none; }
  .drop-radios.opened em:before {
    display: block; }
  .drop-radios.opened button.toggle:after {
    top: calc( 50% - 1.5px );
    transform: rotate(225deg); }
  .drop-radios.filled button.toggle strong, .drop-radios.force-filled button.toggle strong {
    color: #0043C9; }
  .drop-radios.filled button.toggle:after, .drop-radios.force-filled button.toggle:after {
    border-color: #0043C9; }

@media (min-width: 551px) {
  .drop-radios--options {
    position: absolute;
    top: calc( 100% + 4px );
    padding: 8px 0;
    margin-top: -10px;
    background: #FFFFFF;
    border: 1px solid #0043C9;
    box-shadow: 0px 8px 12px rgba(20, 46, 82, 0.2);
    border-radius: 4px;
    opacity: 0;
    transform: translateX(-200vw);
    z-index: 999;
    transition: opacity 0.4s ease-in-out, margin 0.4s ease-in-out, transform 1ms ease 0.4s; }
    .drop-radios--options .list-wrapper {
      display: block;
      width: 100%;
      max-height: 150px;
      overflow-y: auto;
      overflow-x: hidden; }
    .drop-radios--options > div:first-of-type {
      display: none; }
    .drop-radios--options label {
      height: 34px;
      line-height: 34px;
      font-size: 16px;
      font-weight: 700;
      color: transparent;
      white-space: nowrap;
      cursor: pointer;
      transition: color .4s ease-in-out; }
      .drop-radios--options label:before {
        content: attr(title);
        display: block;
        position: absolute;
        top: 50%;
        left: 16px;
        font-weight: 400;
        color: #333333;
        transform: translateY(-50%);
        transition: opacity .4s ease-in-out; }
    .drop-radios--options input:checked + label {
      cursor: default;
      color: #0043C9; }
      .drop-radios--options input:checked + label:before {
        opacity: 0; }
  .drop-radios.opened .drop-radios--options {
    transition: opacity 0.4s ease-in-out, margin 0.4s ease-in-out;
    opacity: 1;
    transform: translateX(0);
    margin-top: 0; }
  .drop-radios:not(.filled) li.option-all {
    display: none; } }
@media (max-width: 550px) {
  .drop-radios--options {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0);
    z-index: 9999999999;
    transform: translateY(110vh);
    transition: background 0.2s ease-in-out, transform 0.4s ease-in-out 0.2s; }
    .drop-radios--options ul {
      list-style: none;
      padding: 0;
      margin: 0;
      max-height: calc( 100vh - 55px );
      overflow-y: auto;
      overflow-x: hidden;
      background: #FAFAFA; }
    .drop-radios--options li:not(:first-of-type) {
      border-top: 1px solid rgba(18, 26, 33, 0.1); }
    .drop-radios--options > div:first-of-type {
      position: relative;
      min-height: 55px;
      height: 55px;
      padding: 15px 16px;
      background: #FAFAFC;
      border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
      .drop-radios--options > div:first-of-type strong {
        display: block;
        font-size: 20px;
        line-height: 24px;
        text-align: center;
        color: #3B4AFF; }
      .drop-radios--options > div:first-of-type button {
        position: absolute;
        top: 50%;
        right: 9px;
        width: 40px;
        height: 40px;
        overflow: hidden;
        text-indent: -99999px;
        background-repeat: no-repeat;
        background-position: center center;
        background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNCAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuMDAwNzIgNS41ODU5OUwxMS45NTA3IDAuNjM1OTg2TDEzLjM2NDcgMi4wNDk5OUw4LjQxNDcyIDYuOTk5OTlMMTMuMzY0NyAxMS45NUwxMS45NTA3IDEzLjM2NEw3LjAwMDcyIDguNDEzOTlMMi4wNTA3MiAxMy4zNjRMMC42MzY3MTkgMTEuOTVMNS41ODY3MiA2Ljk5OTk5TDAuNjM2NzE5IDIuMDQ5OTlMMi4wNTA3MiAwLjYzNTk4Nkw3LjAwMDcyIDUuNTg1OTlaIiBmaWxsPSIjMDMwNTNEIi8+Cjwvc3ZnPgo=);
        transform: translateY(-50%); }
    .drop-radios--options label {
      padding-top: 15px;
      padding-bottom: 15px;
      font-size: 16px;
      line-height: 19px;
      color: #333333;
      transition: background .4s ease-in-out; }
      .drop-radios--options label:hover {
        background: #F0F6FE; }
      .drop-radios--options label:not(:first-of-type) {
        border-top: 1px solid rgba(18, 26, 33, 0.1); }
    .drop-radios--options input:focus + label {
      background: #F0F6FE; }
    .drop-radios--options input:checked + label {
      background: #0043C9;
      color: #FFFFFF; }
    .drop-radios--options.opened {
      transition: transform 0.4s ease-in-out, background 0.2s ease-in-out 0.4s;
      transform: translateY(0);
      background: rgba(0, 0, 0, 0.5); } }

/*# sourceMappingURL=styles.css.map */
