.exchanges {
    background: #ffffff; }
.exchanges__container {
    padding-top: 108px;
    padding-bottom: 100px;
    max-width: 1027px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px; }
@media only screen and (max-width: 1279px) {
    .exchanges__container {
        max-width: 760px;
        padding-top: 105px; } }
@media only screen and (max-width: 959px) {
    .exchanges__container {
        max-width: 735px;
        padding-top: 93px;
        padding-bottom: 77px; } }
@media only screen and (max-width: 767px) {
    .exchanges__container {
        padding-top: 79px;
        padding-bottom: 60px; } }
.exchanges__header {
    text-align: center;
    margin-bottom: 75px; }
@media only screen and (max-width: 1279px) {
    .exchanges__header {
        margin-bottom: 60px; } }
@media only screen and (max-width: 959px) {
    .exchanges__header {
        margin-bottom: 50px; } }
@media only screen and (max-width: 767px) {
    .exchanges__header {
        margin-bottom: 57px; } }
.exchanges__title {
    font-size: 38px;
    font-weight: 500;
    color: #0d213a;
    line-height: 1;
    margin-bottom: 17px; }
@media only screen and (max-width: 1279px) {
    .exchanges__title {
        font-size: 32px; } }
@media only screen and (max-width: 767px) {
    .exchanges__title {
        font-size: 24px;
        margin-bottom: 14px; } }
.exchanges__footer {
    text-align: center;
    padding-top: 40px; }
@media only screen and (max-width: 1279px) {
    .exchanges__footer {
        padding-top: 50px; } }
@media only screen and (max-width: 767px) {
    .exchanges__footer {
        padding-top: 30px; } }
.exchanges__footer-btn {
    min-width: 380px;
    font-size: 16px; }
@media only screen and (max-width: 1279px) {
    .exchanges__footer-btn {
        min-width: 426px; }
    .exchanges__footer-btn .icon {
        display: none; } }
@media only screen and (max-width: 959px) {
    .exchanges__footer-btn {
        min-width: 462px; } }
@media only screen and (max-width: 767px) {
    .exchanges__footer-btn {
        min-width: 290px;
        font-size: 12px; } }

.exchanges-date {
    font-size: 12px;
    font-weight: 500;
    color: #575c65;
    position: relative;
    padding-left: 31px;
    display: inline-block; }
@media only screen and (max-width: 767px) {
    .exchanges-date {
        padding-left: 26px; } }
.exchanges-date::after {
    content: '';
    height: 21px;
    width: 21px;
    background: url(../img/i-calendar.svg) no-repeat center/contain;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -.6875rem; }
@media only screen and (max-width: 767px) {
    .exchanges-date::after {
        height: 18px;
        width: 18px; } }
.exchanges-date::before {
    content: attr(data-mob-text);
    display: none; }
@media only screen and (max-width: 767px) {
    .exchanges-date::before {
        display: inline; } }
@media only screen and (max-width: 767px) {
    .exchanges-date__short-text {
        display: none; } }

.exchanges-tabs-nav {
    display: flex;
    margin-bottom: 67px; }
@media only screen and (max-width: 1279px) {
    .exchanges-tabs-nav {
        margin-bottom: 77px; } }
@media only screen and (max-width: 959px) {
    .exchanges-tabs-nav {
        overflow-x: scroll;
        margin-bottom: 58px;
        margin-right: -30px; } }
@media only screen and (max-width: 767px) {
    .exchanges-tabs-nav {
        margin-right: -15px;
        margin-bottom: 39px; } }
.exchanges-tabs-nav__link {
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    height: 46px;
    font-size: 16px;
    font-weight: 500;
    color: #ff006d;
    border: 1px solid #E1E6EC;
    transition: .3s ease; }
@media only screen and (max-width: 1279px) {
    .exchanges-tabs-nav__link {
        font-size: 14px;
        height: 40px; } }
@media only screen and (max-width: 959px) {
    .exchanges-tabs-nav__link {
        flex: 0 0 229px;
        height: 46px;
        font-size: 16px; } }
@media only screen and (max-width: 767px) {
    .exchanges-tabs-nav__link {
        flex: 0 0 139px;
        height: 39px;
        font-size: 12px; } }
.exchanges-tabs-nav__link:not(:last-child) {
    border-right: none; }
.exchanges-tabs-nav__link:last-child {
    border-radius: 0 4px 4px 0; }
.exchanges-tabs-nav__link:first-child {
    border-radius: 4px 0 0 4px; }
.exchanges-tabs-nav__link:hover, .exchanges-tabs-nav__link.is-active {
    background: #A7B5C9;
    color: #ffffff;
    border-color: #A7B5C9; }

@media only screen and (max-width: 959px) {
    .exchanges-tabs-list {
        max-width: 585px;
        margin-left: auto;
        margin-right: auto; } }

.exchanges-tabs-list__item {
    opacity: 0;
    overflow: hidden;
    height: 0;
    transition: .3s ease-out; }
.exchanges-tabs-list__item.is-active {
    height: auto;
    overflow: visible;
    opacity: 1; }

.exchange-toggler {
    width: 9px;
    height: 17px;
    position: relative; }
@media only screen and (max-width: 1279px) {
    .exchange-toggler {
        width: 8px;
        height: 15px; } }
@media only screen and (max-width: 959px) {
    .exchange-toggler {
        width: 9px;
        height: 16px; } }
@media only screen and (max-width: 767px) {
    .exchange-toggler {
        width: 9px;
        height: 14px; } }
.exchange-toggler::before {
    content: '';
    display: inline-block;
    width: 100%;
    height: 7px;
    position: absolute;
    top: 0;
    left: 0;
    background: url(../img/up-dark.svg) no-repeat center/contain; }
@media only screen and (max-width: 767px) {
    .exchange-toggler::before {
        height: 6px; } }
.exchange-toggler::after {
    content: '';
    display: inline-block;
    width: 100%;
    height: 7px;
    position: absolute;
    bottom: 0;
    left: 0;
    background: url(../img/down-dark.svg) no-repeat center/contain; }
@media only screen and (max-width: 767px) {
    .exchange-toggler::after {
        height: 6px; } }
.exchange-toggler.is-asc::after {
    opacity: 0; }
.exchange-toggler.is-desc::before {
    opacity: 0; }

.exchange {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px; }
@media only screen and (max-width: 959px) {
    .exchange {
        margin-left: -11px;
        margin-right: -11px; } }
.exchange__col {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    flex: 0 0 50%;
    max-width: 50%; }
@media only screen and (max-width: 959px) {
    .exchange__col {
        padding-left: 11px;
        padding-right: 11px; } }
.exchange__header {
    border-bottom: 1px solid #EDF0F3;
    padding-bottom: 27px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 3px; }
@media only screen and (max-width: 1279px) {
    .exchange__header {
        padding-right: 1px; } }
@media only screen and (max-width: 959px) {
    .exchange__header {
        padding-bottom: 36px;
        padding-right: 4px; } }
@media only screen and (max-width: 767px) {
    .exchange__header {
        padding-bottom: 27px;
        padding-right: 11px; } }
.exchange__title {
    font-size: 22px;
    font-weight: 500;
    color: #0d213a;
    line-height: 1; }
@media only screen and (max-width: 1279px) {
    .exchange__title {
        font-size: 20px; } }
@media only screen and (max-width: 959px) {
    .exchange__title {
        font-size: 22px; } }
@media only screen and (max-width: 767px) {
    .exchange__title {
        font-size: 16px; } }

.exchange-table td {
    display: flex; }
@media only screen and (max-width: 767px) {
    .exchange-table td {
        flex-wrap: wrap; } }

.exchange-table__left-side {
    display: flex;
    align-items: baseline;
    height: 71px;
    padding-top: 27px;
    flex: 1;
    border-bottom: 1px solid #EDF0F3; }
@media only screen and (max-width: 1279px) {
    .exchange-table__left-side {
        padding-top: 22px;
        height: 65px; } }
@media only screen and (max-width: 959px) {
    .exchange-table__left-side {
        height: 88px;
        flex-wrap: wrap; } }
@media only screen and (max-width: 767px) {
    .exchange-table__left-side {
        width: 100%;
        height: auto;
        border: none;
        padding-top: 18px; } }

.exchange-table__right-side {
    display: flex;
    align-items: center;
    height: 71px;
    width: 36.15702%;
    border-bottom: 1px solid #D1D7E2; }
@media only screen and (max-width: 1279px) {
    .exchange-table__right-side {
        width: 34.85714%;
        height: 65px; } }
@media only screen and (max-width: 959px) {
    .exchange-table__right-side {
        height: 88px;
        flex-wrap: wrap; } }
@media only screen and (max-width: 767px) {
    .exchange-table__right-side {
        width: 100%;
        height: auto;
        padding-top: 5px;
        padding-bottom: 14px;
        padding-right: 9px; } }
.exchange-table__right-side_large {
    width: 45%; }
@media only screen and (max-width: 1279px) {
    .exchange-table__right-side_large {
        width: 55%; } }
@media only screen and (max-width: 959px) {
    .exchange-table__right-side_large {
        width: 65%; } }
.exchange-table__right-side_large .exchange-table__value {
    width: 100%; }
@media only screen and (max-width: 1279px) {
    .exchange-table__right-side_large .exchange-table__value {
        width: 100%; } }
@media only screen and (max-width: 959px) {
    .exchange-table__right-side_large .exchange-table__value {
        white-space: nowrap; } }
@media only screen and (max-width: 575px) {
    .exchange-table__right-side_large .exchange-table__value {
        width: 100%; } }
@media only screen and (max-width: 575px) {
    .exchange-table__right-side_large .exchange-table__diff {
        top: 0; } }
@media only screen and (max-width: 575px) {
    .exchange-table__right-side_large .exchange-table__direction {
        top: 0; } }

.exchange-table__title {
    font-size: 22px;
    font-weight: 500;
    color: #0d213a;
    line-height: 1;
    margin-right: 10px; }
@media only screen and (max-width: 1279px) {
    .exchange-table__title {
        font-size: 20px; } }
@media only screen and (max-width: 959px) {
    .exchange-table__title {
        font-size: 22px; } }
@media only screen and (max-width: 767px) {
    .exchange-table__title {
        font-size: 18px;
        margin-bottom: 4px; } }

.exchange-table__desc {
    font-size: 14px;
    font-weight: 500;
    color: #a6a8ac;
    position: relative; }
@media only screen and (max-width: 1279px) {
    .exchange-table__desc {
        font-size: 12px; } }
@media only screen and (max-width: 959px) {
    .exchange-table__desc {
        width: 100%;
        top: -9px; } }
@media only screen and (max-width: 767px) {
    .exchange-table__desc {
        position: static; } }

.exchange-table__value {
    flex-shrink: 0;
    font-size: 22px;
    font-weight: 500;
    color: #0d213a;
    width: 100%;
    position: relative;
    top: 3px; }
@media only screen and (max-width: 1279px) {
    .exchange-table__value {
        top: 1px;
        width: 100%;
        font-size: 20px; } }
@media only screen and (max-width: 959px) {
    .exchange-table__value {
        font-size: 22px;
        order: 1;
        margin-right: auto;
        top: 7px; } }
@media only screen and (max-width: 767px) {
    .exchange-table__value {
        font-size: 18px;
        position: static;
        width: 100%; } }

.exchange-table__diff {
    flex: 1;
    font-size: 15px;
    font-weight: 400;
    position: relative;
    top: -2px;
    margin-right: auto; }
@media only screen and (max-width: 1279px) {
    .exchange-table__diff {
        top: -3px;
        font-size: 12px; } }
@media only screen and (max-width: 959px) {
    .exchange-table__diff {
        font-size: 15px;
        flex: 0 0 100%;
        order: 3;
        top: -11px; } }
@media only screen and (max-width: 767px) {
    .exchange-table__diff {
        font-size: 12px;
        top: -2px;
        order: 2;
        flex: 0 0 auto; } }
.exchange-table__diff_up {
    color: #28bb7f; }
.exchange-table__diff_down {
    color: #ff006d; }

.exchange-table__direction {
    width: 13px;
    height: 11px;
    flex-shrink: 0;
    position: relative; }
@media only screen and (max-width: 1279px) {
    .exchange-table__direction {
        top: -3px;
        height: 8px;
        width: 9px; } }
@media only screen and (max-width: 959px) {
    .exchange-table__direction {
        order: 2;
        width: 13px;
        height: 11px;
        top: 4px; } }
@media only screen and (max-width: 767px) {
    .exchange-table__direction {
        width: 12px;
        height: 10px;
        order: 3;
        top: -2px; } }
.exchange-table__direction::after {
    content: '';
    height: 100%;
    width: 100%; }
.exchange-table__direction_up {
    background: url(../img/up.svg) no-repeat center/contain; }
.exchange-table__direction_down {
    background: url(../img/down.svg) no-repeat center/contain; }
