div.plans-container {
  width: 100%; }
  @media screen and (min-width: 768px) {
    div.plans-container:not(.mCustomScrollbar) {
      border-bottom: 2px #e1e1e1 solid;
      padding-bottom: 1.25rem; } }

ul.plans {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  white-space: nowrap;
  position: relative;
  display: box; }
  @media screen and (max-width: 767px) {
    ul.plans {
      white-space: normal;
      display: block; }
      ul.plans input[type=radio].multiline + label,
      ul.plans input[type=checkbox].multiline + label {
        line-height: 22px;
        white-space: normal;
        text-align: left;
        margin-left: -11px; }
      ul.plans input[type=radio].multiline + label > span,
      ul.plans input[type=checkbox].multiline + label > span {
        display: inline-block; } }
  ul.plans.more-5 li {
    -webkit-flex: 1 0 205px;
    -ms-flex: 1 0 205px;
    flex: 1 0 205px;
    width: 205px; }
  /*
  ul.plans.with-featured li div.frame, ul.plans.with-subscription li div.frame {
    margin-bottom: 138px; }
    */
  ul.plans.with-subscription.with-featured li div.frame {
    margin-bottom: 195px; }
  ul.plans > li {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex: 1 0 0;
    -ms-flex: 1 0 0;
    flex: 1 0 0;
    white-space: normal;
    position: relative;
    max-width: 33.33333%;
    display: box;
    box-flex: 1; }
    @media screen and (max-width: 767px) {
      ul.plans > li {
        width: 100% !important;
        max-width: none;
        display: block;
      margin-bottom: .5rem } }
    ul.plans > li > div.frame {
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-direction: column;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-flex: 1 0 auto;
      -ms-flex: 1 0 auto;
      flex: 1 0 auto;
      padding-bottom: 0.625rem;
      border: 1px #e1e1e1 solid;
      border-top-width: 2px;
      border-bottom-width: 2px;
      position: relative;
      margin-bottom: 80px;
      display: box;
      box-flex: 1; }
      @media screen and (max-width: 767px) {
        ul.plans > li > div.frame {
          border-width: 2px;
          border-top-width: 1px;
          border-bottom-width: 1px;
          display: block;
          margin-bottom: 0 !important;
          padding-bottom: 20px;
          border: none;
          border-bottom: 1px solid #ddd;
        }
      }
      ul.plans > li > div.frame:not(.disabled) {
        cursor: pointer; }
      ul.plans > li > div.frame > span,
      ul.plans > li > div.frame > .name {
        display: block;
        text-align: center; }
        ul.plans > li > div.frame > span.description {
          position: absolute;
          bottom: -9px;
          left: 50%;
          z-index: 1; }
          @media screen and (min-width: 768px) {
            ul.plans > li > div.frame > span.description {
              margin-left: -9px; } }
          ul.plans > li > div.frame > span.description img {
            margin: 0; }
        ul.plans > li > div.frame > .name {
          color: #2b2b2b;
          font-size: 1.571em;
          padding: 10px 0 0 0;
          height: 70px;
          margin-top: 1.5rem; }
          @media screen and (max-width: 767px) {
            ul.plans > li > div.frame > .name {
              padding: 15px 0 0 0;
              margin-top: 0; } }
        ul.plans > li > div.frame > span.price {
          color: #2b2b2b;
          font-size: 2.429em;
          font-weight: bold;/*sf*/
          padding: 1.5rem 0; }/*sf*/
          @media screen and (max-width: 767px) {
            ul.plans > li > div.frame > span.price {
              padding: 0 0 18px; } }
        ul.plans > li > div.frame > span.type {
          color: #2b2b2b;
          font-size: 1.286em;
          padding: 0 0 5px;
          font-weight: 400; }
        ul.plans > li > div.frame > span.count {
          color: #2b2b2b;
          font-size: 14px;
          line-height: 1.2;
          border-top: 1px solid #efefef;
          padding: 14px 8px; }
          ul.plans > li > div.frame.active > span.count {
            border-top: 1px solid #705ea3!important;
          }
          ul.plans > li:not(.current) > .frame:not(.active) span.count:nth-child(2n-1) {
            background: #f6f6f6;
          }
          ul.plans > li > .frame.active span.count:nth-child(2n-1) {
            background: #6d5e99;
          }
      ul.plans > li > div.frame > div.selector {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        text-align: center;
        /*padding: 1.875rem 0 0;*/ }
        ul.plans > li > div.frame > div.selector > div {
          margin-top: 10px; }
      @media screen and (max-width: 767px) {
        ul.plans > li > div.frame div.selector,
        ul.plans > li > div.frame span.description {
          position: static; }
        ul.plans > li > div.frame div.selector {
          padding-top: 20px; }
          ul.plans > li > div.frame div.selector > div {
            padding-top: 5px; } }
    ul.plans > li:first-child > div.frame {
      border-left-width: 2px; }
      @media screen and (max-width: 767px) {
        ul.plans > li:first-child > div.frame {
          border-top-width: 2px; } }
    ul.plans > li:last-child > div.frame {
      border-right-width: 2px; }

.price_period {
  font-weight: normal;
  color: #9e9e9e;
  font-size: 1rem;
}

/*sf nowe */

.plans_select {
  margin: 2rem auto;
  display: flex;
  flex-wrap: wrap;

}
.plans_select > span {
  padding: 0.5rem 1rem;
  margin-left: -2px;
  display: inline-block;
  border: 1px solid #ddd;
  min-width: fit-content;
}

.plans_select > span:not(:first-of-type) {
  border-left: 1px solid #ddd;
}
.plans_select > span:hover, .plans_select > span.active {
  background-color: var(--color-purple);
  color: #fff;
  cursor: pointer;
  user-select: none;
}
.plans-container {
  margin: auto;
  width: max-content;
  border-bottom: none!important;
}
@media screen and (min-width: 768px){
.plan.bestseller, .plan.additional_promotion:before, .plan.current:before {
  margin: -10px 0;
  z-index: 2;
  background: #fff;
}
.plan.additional_promotion:before, .plan.current:before{
  border: 1px solid var(--color-purple);
}
.plan.bestseller span.price {
  margin-bottom: 10px;
}
.plan.bestseller:before, .plan.for-tuners::before ,.plan.additional_promotion:before, .plan.current:before {
  margin: -20px auto;
}
.plan.bestseller:before, .plan.for-tuners:before {
  padding: .5rem 2rem;
  background: #ffc107;
  color: #fff;
}
}

@media screen and (max-width: 768px){
  .plan.bestseller:before, .plan.for-tuners::before ,.plan.additional_promotion:before, .plan.current:before {
    display: block;
  }
  .plan.bestseller:before, .plan.for-tuners:before {
    color: #ffc107
  }
}
.plan.bestseller:before, .plan.for-tuners:before {
  z-index: 4;
  font-weight: bold;
  text-align: center;
}
.plan.bestseller:not(.current):before {
  content: "BESTSELLER";
}
.plan.for-tuners:not(.current):before {
  content: var(--lang-for-tuners);
}
.plan.additional_promotion:before, .plan.current:before {
  padding: 0.5rem 2rem;
  z-index: 4;
  color: var(--color-purple);
  font-weight: bold;
  height: min-content;
  min-height: 38px;
  text-align: center;
}
.plans-container {
  margin-top: 3.5rem;
}