/*--------------------
    CALCULATORS
  --------------------*/
  .calculators {
    max-width: 1130px;
    margin: 0 auto;
    margin-bottom: 40px;
    color: #044071;
  }
  .calculators__info {
    padding: 15px;
    background-color: #dfe9f2;
    margin-bottom: 20px;
    border-radius: 15px;
  }
  
  .calculators .list--dotted,
  .calculators .list--dotted > li:last-child {
    margin-bottom: 0;
  }
  
  .calculators .list--dotted > li {
    margin-bottom: 5px;
    color: #044071;
  }
  .calculators--flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
  .calculators__error-msg {
    display: none;
    background-color: rgba(255, 119, 0, 0.95);
    margin-bottom: 15px;
    padding: 3px;
    color: #fff;
    border-radius: 3px;
    text-align: center;
  }
  .calculators__error-msg--show {
    display: block;
  }
  .calculators__summary-list {
    display: flex;
  }
  .calculators__summary-list .calculators__summary-list-item:first-child {
    flex-grow: 1;
  }
  .calculators__summary-list-item:not(:last-child) {
    margin-right: 20px;
  }
  .calculators__summary-list-item:not(:first-child) {
    text-align: right;
  }
  .calculators__summary-block {
    margin-top: 50px;
    margin-bottom: 50px;
    border-radius: 15px;
    border: 1px solid #044071;
  }
  .calculators__summary-block--gray {
    background-color: #e9f1f7;
    border: none;
    border-radius: 5px;
  }
  .calculators__summary-text {
    padding: 15px;
  }
  .calculators__summary-text-reset {
    padding: 15px;
    border-top: 1px solid #044071;
    text-align: right;
  }
  .calculators__summary {
    margin-top: 50px;
    display: none;
  }
  .calculators__summary--show {
    display: block;
  }
  .calculators__converter {
    padding: 60px 75px;
    background-color: #ffffff;
    border-radius: 15px;
    -webkit-box-shadow: 0 4px 14px rgba(176, 176, 176, 0.25);
    box-shadow: 0 4px 14px rgba(176, 176, 176, 0.25);
  }
  .calculators__word-counter {
    width: 100%;
    max-width: 747px;
    margin-right: 20px;
    padding: 20px;
    background-color: #ffffff;
    border-radius: 15px;
    -webkit-box-shadow: 0 4px 14px rgba(176, 176, 176, 0.25);
    box-shadow: 0 4px 14px rgba(176, 176, 176, 0.25);
  }
  .calculators__text {
    margin-top: 5px;
  }
  .calculators__word-counter .calculators__label,
  .calculators__word-counter .calculators__counter {
    height: 100%;
  }
  .calculators__word-counter .calculators__counter {
    padding: 30px 35px;
    font-family: inherit;
    color: #828282;
    background-color: #ffffff;
    border: 1px solid #eaf1f7;
  }
  .calculators__counters {
    width: 100%;
    max-width: 364px;
    padding: 45px 48px;
    font-size: 40px;
    line-height: 54px;
    text-align: center;
    background-color: #eaf1f7;
    border-radius: 15px;
  }
  .calculators__counters-item:not(:first-child) {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #ffffff;
  }
  .calculators__counters-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .calculators__counters span {
    color: #f9a825;
  }
  .calculators__row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 20px;
  }
  .calculators__label {
    display: block;
    font-size: 18px;
    line-height: 27px;
  }
  .calculators__more-info {
    position: relative;
    height: 0;
    margin-top: 15px;
    overflow: hidden;
    opacity: 0;
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
  }
  .calculators__more-info--hide {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut;
    -webkit-animation-duration: 0.15s;
    animation-duration: 0.15s;
  }
  .calculators__more-info--show {
    height: auto;
    -webkit-transition: height 2s linear;
    transition: height 2s linear;
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
  }
  @-webkit-keyframes fadeIn {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  @keyframes fadeIn {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  @-webkit-keyframes fadeOut {
    0% {
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }
  @keyframes fadeOut {
    0% {
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }
  .calculators__title {
    display: block;
    margin-bottom: 10px;
  }
  .calculators__item {
    width: 100%;
    max-width: 455px;
  }
  .calculators__divider {
    margin: 52px 25px 0;
  }
  .calculators__clear-btn {
    position: absolute;
    top: 5px;
    right: 0;
    background-color: transparent;
    border: none;
    outline: none;
    cursor: pointer;
  }
  .calculators__results {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-right: 100px;
  }
  .calculators__results-item1 {
    margin: 0 16px 0 0;
  }
  .calculators__results-item2 {
    margin-right: 30px;
  }
  .calculators__checkers {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-right: -16px;
    margin-bottom: 5px;
  }
  .calculators__checker {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    min-width: 100px;
    margin-right: 16px;
    margin-bottom: 16px;
  }
  .calculators__checker span {
    display: block;
    width: 100%;
    padding: 15px 10px;
    text-align: center;
    border: 1px solid #044071;
    border-radius: 10px;
    cursor: pointer;
    -webkit-transition: border 0.15s linear;
    transition: border 0.15s linear;
  }
  .calculators__checker span:hover,
  .calculators__checker span:focus {
    border: 1px solid #0b94ff;
  }
  .calculators__checker input {
    display: none;
  }
  .calculators__checker input:checked + span {
    border-color: #e7b16a;
  }
  .calculators__checker input:checked + span:hover,
  .calculators__checker input:checked + span:focus {
    border-color: #f9a825;
  }
  .calculators__checker--bg span {
    background-color: #f2f2f2;
    border: 1px solid #f2f2f2;
    -webkit-transition: border 0.15s linear, background 0.15s linear;
    transition: border 0.15s linear, background 0.15s linear;
  }
  .calculators__checker--bg input:checked + span {
    background-color: #ffffff;
  }
  .calculators__checker--bg input:checked + span:hover,
  .calculators__checker--bg input:checked + span:focus {
    border-color: #f9a825;
  }
  .calculators__counter {
    width: 100%;
    height: 60px;
    padding: 18px 20px;
    font-size: 18px;
    color: #828282;
    background-color: #f2f2f2;
    border: 1px solid #f2f2f2;
    border-radius: 10px;
    outline: none;
    -webkit-transition: border 0.15s linear, height 0.15s linear;
    transition: border 0.15s linear, height 0.15s linear;
    resize: none;
  }
  .calculators__counter--error {
    border: 1px solid red;
  }
  .calculators__select {
    line-height: 18px;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTEiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDExIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik02LjI1NTkzIDcuMTI3MTNDNS44NTcxNiA3LjU4NzU5IDUuMTQyODQgNy41ODc1OSA0Ljc0NDA3IDcuMTI3MTNMMC40Mzc3ODEgMi4xNTQ2NUMtMC4xMjMwOTUgMS41MDcwMSAwLjMzNjk1OCAwLjUgMS4xOTM3MSAwLjVIOS44MDYyOUMxMC42NjMgMC41IDExLjEyMzEgMS41MDcwMSAxMC41NjIyIDIuMTU0NjVMNi4yNTU5MyA3LjEyNzEzWiIgZmlsbD0iI0Y5QTgyNSIvPgo8L3N2Zz4K");
    background-position: 96% center;
    background-repeat: no-repeat;
  }
  .calculators__counter--100 {
    height: 100%;
  }
  .calculators__counter--full {
    height: 180px;
  }
  .calculators__counter:hover,
  .calculators__counter:focus {
    border-color: #f9a825;
  }
  
  @media screen and (max-width: 768px) {
    .calculators--flex {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
    }
    .calculators__converter {
      padding: 25px 15px;
    }
    .calculators__word-counter {
      max-width: 100%;
      margin-right: 0;
      margin-bottom: 20px;
    }
    .calculators__word-counter .calculators__counter {
      padding: 15px;
    }
    .calculators__counters {
      max-width: 100%;
      padding: 15px;
      font-size: 18px;
      line-height: 27px;
    }
    .calculators__counters-item:not(:first-child) {
      margin-top: 0;
      padding-top: 0;
      border: none;
    }
    .calculators__counters-list {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      margin-bottom: -15px;
      margin-left: -15px;
    }
    .calculators__counters-item {
      -webkit-box-flex: 1;
      -ms-flex-positive: 1;
      flex-grow: 1;
      min-width: 150px;
      margin-bottom: 15px;
      margin-left: 15px;
      padding: 5px 15px;
      background-color: #ffffff;
      border-radius: 15px;
    }
    .calculators__results {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin-right: 0;
    }
    .calculators__results-item1 {
      margin-right: 0;
    }
    .calculators__results-item2 {
      margin-right: 0;
    }
  }
  
  @media screen and (max-width: 1130px) {
    .calculators__row {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
    }
    .calculators__item {
      max-width: 100%;
    }
    .calculators__divider {
      margin: 10px 0;
      text-align: center;
    }
  }