@media screen and (max-width: 1400px) {
    body.main {justify-content: center;}
}

@media screen and (max-width: 1150px) {
    .tv-wrap {margin: -11% 1% -11%;}

    .about video {width: 100%; margin: 0 0 20px 0;}
    footer {margin-bottom: 2%;}
}

@media screen and (max-width: 992px) {
    .tv-wrap {margin: -12% 0 -12%;}
    .tv {overflow: hidden;}
    .bubble {font-size: 13px; padding: 12px 16px;}
}

@media screen and (max-width: 768px) {
    .tv-wrap {margin: -14% -16% -14%}
    .line {margin: 3% auto;}
    footer {margin-bottom: 3%;}
    main section {width: 75%;}
}

@media screen and (max-width: 600px) {
    .tv-wrap {margin: -15% -16% -20%;}
    .links {flex-wrap: wrap;}
    .links > * {margin: 3%;}
    .exchange > div {margin: 0 2%;}
    .links .button {order: -1; margin: 5% 12%;}
    footer {margin: 5%;}
    .news-wrap {font-size: 16px;}
    .faq section {width: 85%;}
    .bubble {padding: 11px 14px;}
}

@media screen and (max-width: 530px) {
    .tv-wrap {margin: -19% -31% -18%;}
    .exchange > div {display: flex; flex-direction: column; align-items: center;}
    .exchange > div {margin: 0 4%;}
    .line {margin: 5% auto;}
    .exchange {margin-bottom: 4%;}
    footer {display: flex; flex-wrap: wrap; justify-content: center;}
    footer span {margin: 0 10px;}
    .bubble {padding: 9px 11px;}
    .bottom-wrap {margin-top: 2%;}
}

@media screen and (max-width: 360px) {
    main section {width: 85%;}
    .exchange {flex-direction: column;}
    .exchange > div {margin: 1% 4%;}
    .links > * {margin: 3% 5%;}
    .links .button {margin: 5% 9%;}
}