html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block
}

body {
    line-height: 1
}

ol, ul {
    list-style: none
}

blockquote, q {
    quotes: none
}

blockquote:before, blockquote:after {
    content: '';
    content: none
}

q:before, q:after {
    content: '';
    content: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

body {
    position: relative;
    font-family: "GothamPro", sans-serif;
    color: #000;
    margin: 0;
    min-width: 320px
}

ul, li {
    margin: 0;
    padding: 0
}

li {
    list-style: none
}

input {
    outline: none;
    margin: 0;
    font-family: "GothamPro", sans-serif
}

textarea {
    font-family: "GothamPro", sans-serif
}

b {
    font-weight: bold
}

button {
    padding: 0;
    margin: 0;
    border: none;
    outline: none;
    background-color: transparent
}

svg {
    display: block
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 10%, 0);
        transform: translate3d(0, 10%, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 10%, 0);
        transform: translate3d(0, 10%, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -10%, 0);
        transform: translate3d(0, -10%, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -10%, 0);
        transform: translate3d(0, -10%, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(10%);
        transform: translateX(10%)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0%);
        transform: translateY(0%)
    }
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(10%);
        transform: translateX(10%)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0%);
        transform: translateY(0%)
    }
}

@-webkit-keyframes alertIn {
    0% {
        -webkit-transform: translateX(200%);
        transform: translateX(200%)
    }
    100% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%)
    }
}

@keyframes alertIn {
    0% {
        -webkit-transform: translateX(200%);
        transform: translateX(200%)
    }
    100% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%)
    }
}

@-webkit-keyframes alertOut {
    0% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%)
    }
    100% {
        -webkit-transform: translateX(400%);
        transform: translateX(400%)
    }
}

@keyframes alertOut {
    0% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%)
    }
    100% {
        -webkit-transform: translateX(400%);
        transform: translateX(400%)
    }
}

@-webkit-keyframes fadeInLeft {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
    100% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%)
    }
}

@keyframes fadeInLeft {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
    100% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%)
    }
}

@-webkit-keyframes rotate {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes rotate {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-webkit-keyframes moveUp {
    0% {
        -webkit-transform: translate3d(0, 10%, 0);
        transform: translate3d(0, 10%, 0)
    }
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@keyframes moveUp {
    0% {
        -webkit-transform: translate3d(0, 10%, 0);
        transform: translate3d(0, 10%, 0)
    }
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@-webkit-keyframes moveDown {
    0% {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@keyframes moveDown {
    0% {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@-webkit-keyframes flipFromLeft {
    0% {
        -webkit-transform: rotate3d(0, 1, 0, 90deg);
        transform: rotate3d(0, 1, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }
    100% {
        -webkit-transform: rotate3d(0, 0, 0, 0);
        transform: rotate3d(0, 0, 0, 0);
        opacity: 1
    }
}

@keyframes flipFromLeft {
    0% {
        -webkit-transform: rotate3d(0, 1, 0, 90deg);
        transform: rotate3d(0, 1, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }
    100% {
        -webkit-transform: rotate3d(0, 0, 0, 0);
        transform: rotate3d(0, 0, 0, 0);
        opacity: 1
    }
}

@-webkit-keyframes flipInX {
    from {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }
    40% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    60% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

@keyframes flipInX {
    from {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }
    40% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    60% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg)
    }
    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

@-webkit-keyframes flipOutX {
    from {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        opacity: 1
    }
    to {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        opacity: 0
    }
}

@keyframes flipOutX {
    from {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        opacity: 1
    }
    to {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        opacity: 0
    }
}

@-webkit-keyframes zoomIn {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3)
    }
    50% {
        opacity: 1
    }
}

@keyframes zoomIn {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3)
    }
    50% {
        opacity: 1
    }
}

@-webkit-keyframes slideRight {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@keyframes slideRight {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}

@-webkit-keyframes zoom {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0
    }
    5%, 95% {
        opacity: 1
    }
    100% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
        opacity: 0
    }
}

@keyframes zoom {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0
    }
    5%, 95% {
        opacity: 1
    }
    100% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
        opacity: 0
    }
}

.login-logo {
    display: block
}

.login-logo__img {
    height: 40px;
    width: 133px
}

.login-content {
    padding: 24px 63px
}

.login-content__item_logo {
    margin-bottom: 72px
}

.login-content__item_form {
    margin-bottom: 80px
}

.login-content__item_form-forgot {
    margin-bottom: 14px
}

.login-content__item_desc {
    margin-bottom: 16px
}

.login-content__item_headline {
    margin-bottom: 80px
}

.login-content__item_help {
    margin: 24px 0;
    width: 80%
}

@media only screen and (max-width: 1800px) {
    .layout-changetariff-grid__item {
        width: 33.333%
    }
}

@media only screen and (max-width: 1199px) {
    .login-content {
        padding: 24px
    }

    .login-content__item_help {
        width: 100%
    }
}

.hat--light .hat-breadcrumbs__item a, .hat--light .hat-headline, .hat--light .hat-menu__item, .hat--light .hat-menu-back__item, .hat--light .hat-breadcrumbs__item .hat-breadcrumbs-separator {
    color: white
}

.hat--light .hat-menu__item, .hat--light .hat-menu-back__item {
    border-color: white
}

.hat--light .hat-line {
    background-color: white
}

.hat-breadcrumbs {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 16px
}

.hat-breadcrumbs__item a, .hat-breadcrumbs__item .hat-breadcrumbs-separator {
    color: #00ACEC;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 16px;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden
}

.hat-breadcrumbs__item:last-child .hat-breadcrumbs-separator {
    display: none
}

@media only screen and (max-width: 1199px) {
    .hat-breadcrumbs__item a, .hat-breadcrumbs__item .hat-breadcrumbs-separator {
        font-size: 10px
    }
}

.hat-breadcrumbs-separator {
    margin: 0 16px
}

@media only screen and (max-width: 1199px) {
    .hat-breadcrumbs-separator {
        margin: 0 8px
    }
}

.hat-menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 64px
}

.hat-menu__item {
    border-left: 1px solid;
    border-color: black;
    display: block;
    padding: 0 40px;
    color: #000F28;
    opacity: 0.6;
    font-size: 24px;
    line-height: 64px;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 300px
}

.hat-menu__item:first-child {
    border-left: none
}

.hat-menu__item--active {
    opacity: 1
}

@media only screen and (max-width: 1199px) {
    .hat-menu {
        height: auto
    }

    .hat-menu__item {
        padding-left: 20px;
        padding-right: 20px;
        font-size: 14px;
        line-height: 24px
    }

    .hat-menu__item:first-child {
        padding-left: 0
    }
}

.hat-body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%
}

.hat-body__item_headline {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    margin-right: 40px
}

.hat-body__item_line {
    width: 100%
}

.hat-body__item_menu {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none
}

.hat-body__item_menu .hat-menu__item:last-child {
    padding-right: 0
}

@media only screen and (max-width: 1199px) {
    .hat-body {
        display: block
    }

    .hat-body__item {
        margin-bottom: 16px
    }

    .hat-body__item:last-child {
        margin-bottom: 0
    }

    .hat-body__item_headline {
        margin-right: 16px
    }
}

.hat-headline {
    color: #000F28;
    font-size: 24px;
    font-weight: bold;
    letter-spacing: 1px;
    text-transform: uppercase;
    overflow: hidden
}

@media only screen and (max-width: 1199px) {
    .hat-headline {
        font-size: 24px
    }
}

@media only screen and (max-width: 767px) {
    .hat-headline {
        font-size: 24px
    }
}

.hat-line {
    display: block;
    height: 1px;
    width: 100%;
    background-color: #000F28
}

.hat-menu-back {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 64px
}

.hat-menu-back__item {
    border-left: 1px solid;
    border-color: black;
    display: block;
    padding-left: 40px;
    color: #000F28;
    font-size: 24px;
    line-height: 64px;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 300px
}

@media only screen and (max-width: 1199px) {
    .hat-menu-back {
        height: auto
    }

    .hat-menu-back__item {
        padding-left: 0;
        padding-right: 0;
        font-size: 14px;
        line-height: 24px;
        border: none
    }
}

.hat-img {
    padding-left: 40px
}

.hat-img img {
    height: 48px
}

@media only screen and (max-width: 1199px) {
    .hat-img {
        padding-left: 0
    }
}

.link-default {
    color: #00acec;
    text-decoration: none
}

.link-default_bold {
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: bold
}

.link-default_dashed {
    border-bottom: 1px dashed #00acec;
    padding-bottom: 6px
}

.link-default:hover {
    color: rgba(0, 172, 236, 0.8);
    cursor: pointer
}

.link-default:active {
    color: rgba(0, 172, 236, 0.5)
}

.link-default:visited {
    color: rgba(0, 172, 236, 0.8)
}

.link-small-triangle {
    display: inline-block;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.link-default {
    color: #00acec;
    text-decoration: none
}

.link-default_bold {
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: bold
}

.link-default_dashed {
    border-bottom: 1px dashed #00acec;
    padding-bottom: 6px
}

.link-default:hover {
    color: rgba(0, 172, 236, 0.8);
    cursor: pointer
}

.link-default:active {
    color: rgba(0, 172, 236, 0.5)
}

.link-default:visited {
    color: rgba(0, 172, 236, 0.8)
}

.link-small-triangle {
    display: inline-block;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.input-default {
    position: relative;
    border-radius: 8px;
    height: 72px;
    width: 30%;
    background-color: #fff;
    border: 1px solid #cad3df;
    margin-bottom: 16px;
    transition: border .2s;
}

@media only screen and (max-width: 1800px) {
    .input-default {
        width: 40%
    }
}

@media only screen and (max-width: 1660px) {
    .input-default {
        width: 50%
    }
}

@media only screen and (max-width: 1199px) {
    .input-default {
        width: 100%
    }
}

.input-default:focus-within {
    border: 1px solid #00aaff;
}

.input-default input:focus {
    outline: none;
}

.input-default input {
    display: inline-block;
    background-color: transparent;
    height: 100%;
    width: 100%;
    padding: 0 1rem;
    padding-right: 10px;
    color: #47526B;
    font-family: "GothamPro", sans-serif;
    font-size: 17px;
    border-radius: 5px;
    border: none;
    outline: 0;
}

.input-default_with-icon {
    position: relative;
    padding-right: 40px;
}

.input-default-icon {
    overflow: hidden;
    position: absolute;
    top: 1px;
    right: 0;
    height: 100%;
    width: 40px;
    z-index: 10;
    cursor: pointer;
}

.input-default-icon__item {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 80%;
    width: 80%;
    transform: translate(-50%,-50%);
    overflow: hidden;
}

.input-default-icon__item svg {
    display: block;
    height: 100%;
    width: 100%;
    fill: #9ca8b4;
}

.ico_pass_hidden {
    width: 25px;
    height: 9px;
}

.input-default-wrapper {
    width: 100%
}

.input-default-field {
    position: relative;
    width: 100%;
    background-color: white;
    border-radius: 8px;
}

.input-autopayment {
    font-size: 17px;
    line-height: 22px;
    color: #47526B;
    letter-spacing: -0.07em;
}

.input-autopayment-bold {
    font-weight: 600;
    margin-top: 20px;
    line-height: 22px;
    color: #47526B;
}

.input-default-field__input {
    height: 72px
}

.input-default-field__input::placeholder {
    font-size: 17px;
}

.input-default-field__input:focus + label {
    -webkit-transform: translate(-10%, -16px) scale(.8);
    transform: translate(-10%, -16px) scale(.8)
}

.input-default-field__input:valid + label, .input-default-field__input:placeholder-shown + label {
    -webkit-transform: translate(-10%, -16px) scale(.8);
    transform: translate(-10%, -16px) scale(.8)
}

.input-default-field__input__not_enpty + label {
    background: transparent;
    -webkit-transform: translate(-10%, -16px) scale(.8);
    transform: translate(-10%, -16px) scale(.8);
}

/* Change autofill color to transparent */
input:-webkit-autofill,
input:-webkit-autofill:focus {
    transition: background-color 600000s 0s, color 600000s 0s;
}

/*input:not(:placeholder-shown):invalid {*/
/*    -webkit-transform: translate(-10%, -16px) scale(.8);*/
/*    transform: translate(-10%, -16px) scale(.8)*/
/*}*/

.input-default-field__textarea {
    resize: none;
    height: 224px
}

.input-default-field__textarea:focus + label {
    -webkit-transform: translate(-10%, -5px) scale(.8);
    transform: translate(-10%, -5px) scale(.8)
}

.input-default-field__textarea:valid + label {
    -webkit-transform: translate(-10%, -5px) scale(.8);
    transform: translate(-10%, -5px) scale(.8)
}

.input-default-field__textarea_small {
    height: 96px;
    padding: 8px
}

.input-default-field__textarea + .input-default-field__label {
    top: 16px;
    margin-top: auto;
    height: 16px;
    font-size: 14px;
    line-height: 16px
}

.input-default-field__input, .input-default-field__textarea {
    border-radius: 8px;
    border: 1px solid #E0E7EA;
    position: relative;
    padding-top: 30px;
    padding-bottom: 16px;
    padding-left: 16px;
    padding-right: 16px;
    z-index: 3;
    width: 100%;
    outline: none;
    display: block;
    background-color: transparent;
    color: #47526B;
    font-family: "GothamPro", sans-serif;
    font-size: 17px;
    line-height: 24px;
    -webkit-transition: border .2s;
    transition: border .2s
}

.input-default-field__input:hover, .input-default-field__textarea:hover {
    border: 1px solid #c2cfd5
}

.input-default-field__input:focus, .input-default-field__textarea:focus, .input-default:focus {
    border: 1px solid #26A0F8
}

.input-default-field__textarea_small {
    height: 96px;
    padding: 8px 16px;
    font-size: 14px
}

.input-default-field__label {
    width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    position: absolute;
    left: 16px;
    top: 50%;
    height: 24px;
    margin-top: -12px;
    display: block;
    color: #89909F;
    font-size: 18px;
    line-height: 24px;
    z-index: 2;
    -webkit-transition: .2s;
    transition: .2s
}

@media only screen and (max-width: 1199px) {
    .input-default-field__input {
        height: 72px / 2
    }

    .input-default-field__label {
        font-size: 14px;
        line-height: 24px
    }

    .input-autopayment{
        font-size: 15px;
    }

    .input-autopayment-bold {
        font-size: 15px;
    }
}

.input-default-help {
    margin-top: 8px;
    width: 100%
}

.input-default-help__text {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    color: #47526B;
    font-size: 13px;
    line-height: 16px
}

@media only screen and (max-width: 1199px) {
    .input-default-help__text {
        font-size: 12px
    }
}

.btn-simple {
    display: inline-block;
    width: auto;
    border-radius: 8px;
    background-color: #00ACEC;
    padding: 12px 24px;
    text-align: center
}

.btn-simple-autopayment {
    display: inline-block;
    width: 150px;
    border-radius: 8px;
    background-color: #00ACEC;
    padding: 12px 24px;
    text-align: center;
}

.btn-simple_transparent {
    background-color: transparent;
    outline: 2px solid #00acec;
    outline-offset: -2px;
}

.btn-simple_smaller {
    padding: 12px;
    height: auto
}

.btn-simple__text {
    display: block;
    text-transform: uppercase;
    color: #FFFFFF;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 24px;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.btn-simple__text_blue {
    color: #00ACEC;
}

.btn-simple:hover {
    opacity: 0.9;
    cursor: pointer
}

.btn-simple:active {
    opacity: .8
}

.btn-simple_fluid {
    width: 100%;
    display: block
}

.btn-simple_green {
    background-color: #86C453
}

.btn-simple_grey {
    background-color: darkgrey
}

.btn-simple_fat {
    padding: 24px 48px
}

.btn-simple__disabled {
    pointer-events: none;
    cursor: not-allowed;
    background-color: darkgrey;
}

.btn-simple__disabled:hover {
    background-color: darkgrey;
}

.btn-simple_sbp {
    --sbp-char-color: #FFF;
    padding: 20px 30px;
}
.btn-simple_sbp .btn-simple__text {
    display: flex;
    justify-content: center;
    line-height: 25px;
}

.login-form {
    width: 50%
}

.login-form__item {
    margin-bottom: 16px
}

.login-form__item:last-child {
    margin-bottom: 0
}

.login-form__item .btn-simple {
    width: 60%
}

@media only screen and (max-width: 1439px) {
    .login-form {
        width: 80%
    }

    .login-form__item .btn-simple {
        width: 50%
    }
}

@media only screen and (max-width: 1199px) {
    .login-form {
        width: 100%
    }

    .login-form__item {
        width: 100%;
        margin-right: 0
    }

    .login-form__item .btn-simple {
        width: 100%
    }
}

.login-headline__item {
    color: #000F28;
    font-weight: bold;
    letter-spacing: 1px;
    text-transform: uppercase
}

h1.login-headline__item {
    font-size: 64px;
    line-height: 64px
}

h2.login-headline__item {
    font-size: 48px;
    line-height: 48px
}

@media only screen and (max-width: 1439px) {
    h1.login-headline__item {
        font-size: 48px;
        line-height: 48px
    }

    h2.login-headline__item {
        font-size: 24px;
        line-height: 24px
    }
}

.login-help__item {
    color: #222222;
    font-size: 16px;
    font-weight: bold;
    line-height: 20px
}

.login-cover {
    background-color: #eee;
    height: 100%;
    width: 100%;
    display: block;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat
}

.main-content {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.main-content__item {
    padding: 144px 0;
    min-height: 100vh
}

.main-content__item_drawer {
    padding-left: 48px;
    background-color: #eee;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none
}

.main-content__item_content {
    width: 100%;
    padding-left: 48px;
    padding-right: 48px
}

.main-content__item_content__custom {
    width: 79.193%;
}

.main-content__item_content .hat {
    margin-bottom: 32px
}

@media only screen and (max-width: 1199px) {
    .main-content {
        display: block
    }

    .main-content__item {
        min-height: auto;
        padding: 0 20px;
        padding-top: 32px;
        padding-bottom: 32px;
        width: 100%
    }

    .main-content__item_drawer {
        display: none
    }
}

.menu {
    width: 100%
}

.menu__item {
    display: block;
    width: 100%;
    text-decoration: none;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
    margin-bottom: 16px
}

.menu__item:last-child {
    margin-bottom: 0
}

.menu__item--is-active .menu-text {
    padding-bottom: 2px;
    border-bottom: 4px solid #86C453
}

.menu-text {
    display: "inline-block";
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
    font-size: 16px;
    font-weight: bold;
    line-height: 21px;
    text-transform: uppercase;
    color: #222222
}

.menu-text:hover {
    cursor: pointer;
    opacity: 0.5
}

.menu-text:active {
    opacity: 0.2
}

.footer-and-header, .main-header, .main-footer {
    position: absolute;
    top: 0;
    width: 100%;
    padding: 32px 0;
    max-height: 112px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.footer-and-header:after, .main-header:after, .main-footer:after {
    content: "";
    bottom: 0;
    left: 48px;
    height: 1px;
    width: calc(100% - 48px);
    position: absolute;
    background-color: #E0E7EA;
    z-index: 200;
}

.main-header__item_hamburger-btn {
    display: none
}

.main-header__item_logo {
    padding-left: 48px
}

.main-header__item_contacts {
    width: 25%;
    padding-left: 48px
}

.main-header__item_info {
    width: 41.6666666667%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.main-header__item_btn {
    width: 12.5%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding-right: 48px
}

@media only screen and (max-width: 1439px) {
    .main-header__item_btn {
        width: 8.3333333333%
    }
}

@media only screen and (max-width: 1199px) {
    .main-header {
        position: fixed;
        background-color: white;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        height: 60px;
        max-height: none;
        padding: 0;
        border-bottom: 1px solid #E0E7EA;
        z-index: 244
    }

    .main-header:after {
        display: none
    }

    .main-header__item {
        padding: 0
    }

    .main-header__item_btn, .main-header__item_hamburger-btn {
        padding: 0 16px;
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        width: auto
    }

    .main-header__item_hamburger-btn {
        border-right: 1px solid #E0E7EA
    }

    .main-header__item_btn {
        border-left: 1px solid #E0E7EA
    }

    .main-header__item_logo {
        width: auto
    }

    .main-header__item_info {
        display: none
    }

    .main-header__item_contacts {
        display: none
    }
}

.main-header-logo {
    display: inline-block
}

.main-header-logo__logo {
    display: block;
    -webkit-transition: .2s;
    transition: .2s
}

.main-header-logo__logo:hover {
    cursor: pointer;
    opacity: 0.5
}

.main-header-logo__logo:active {
    opacity: 0.2
}

.main-header-logo__logo img {
    display: block
}

.main-header-contacts {
    display: block
}

.main-header-contacts__item a {
    display: "inline-block";
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 300;
    color: #000000;
    font-size: 13px;
    letter-spacing: 1px;
    line-height: 24px
}

.main-header-contacts__item a:hover {
    cursor: pointer;
    opacity: .5
}

.main-header-contacts__item a:active {
    opacity: .2
}

.main-header-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.main-header-info__item {
    margin-right: 53px
}

.main-header-info__item:last-child {
    margin-right: 0
}

@media only screen and (max-width: 1199px) {
    .main-header-info {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
}

.main-header-info-name, .main-header-info-value {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: uppercase
}

.main-header-info-name {
    color: #89909F;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 16px
}

@media only screen and (max-width: 767px) {
    .main-header-info-name {
        font-size: 10px
    }
}

.main-header-info-value {
    color: #000000;
    font-size: 26px;
    font-weight: bold;
    line-height: 32px
}

@media only screen and (max-width: 1400px) {
    .main-header-info-value {
        font-size: 20px;
        line-height: 22px
    }
}

@media only screen and (max-width: 767px) {
    .main-header-info-value {
        font-size: 16px;
        line-height: 22px
    }
}

.main-header-exitbtn__icon {
    display: block;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.main-header-exitbtn__icon svg {
    fill: #89909F;
    width: 24px;
    height: 24px
}

.main-header-exitbtn__icon:hover {
    cursor: pointer;
    opacity: 0.5
}

.main-header-exitbtn__icon:active {
    opacity: 0.2
}

.main-footer {
    bottom: 0;
    top: auto
}

.main-footer:after {
    top: 0;
    bottom: auto
}

.main-footer__item_copyright {
    padding-left: 48px
}

.main-footer__item_support {
    width: 58.3333333333%;
    padding: 0 48px
}

.main-footer__item_apps {
    width: 20.8333333333%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding-right: 48px
}

@media only screen and (max-width: 1439px) {
    .main-footer__item_apps {
        width: 16.6666666667%
    }
}

@media only screen and (max-width: 1199px) {
    .main-footer {
        display: block;
        position: static;
        left: auto;
        bottom: auto;
        max-height: none;
        border-top: 1px solid #E0E7EA;
        padding-right: 20px;
        padding-left: 20px
    }

    .main-footer:after {
        display: none
    }

    .main-footer__item {
        margin-bottom: 32px;
        padding: 0;
        width: 100%
    }

    .main-footer__item:last-child {
        margin-bottom: 0
    }
}

.footer-copyright__item {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #000000;
    font-size: 13px;
    letter-spacing: 1px;
    line-height: 24px;
    text-transform: uppercase
}

@media only screen and (max-width: 1199px) {
    .footer-copyright {
        text-align: center
    }
}

@media only screen and (max-width: 767px) {
    .footer-copyright {
        text-align: left
    }
}

.footer-support {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.footer-support__item {
    margin-right: 90px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-decoration: none;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.footer-support__item:last-child {
    margin-right: 0
}

.footer-support__item:hover {
    cursor: pointer;
    opacity: 0.5
}

.footer-support__item:active {
    opacity: 0.2
}

@media only screen and (max-width: 1199px) {
    .footer-support {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

@media only screen and (max-width: 767px) {
    .footer-support {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start
    }

    .footer-support__item {
        margin-right: 0;
        margin-bottom: 16px;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start
    }

    .footer-support__item:last-child {
        margin-bottom: 0
    }
}

.footer-support-icon {
    margin-right: 16px;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    width: 40px;
    height: 40px
}

.footer-support-icon__icon {
    position: relative;
    height: 100%;
    width: 100%;
    border-radius: 50%;
    border: 1px solid #89909F
}

.footer-support-icon__icon svg {
    width: 50%;
    height: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    fill: #89909F
}

.footer-support-text {
    overflow: hidden;
    max-width: 165px
}

.footer-support-text__item {
    color: #000000;
    font-size: 13px;
    letter-spacing: 1px;
    line-height: 16px;
    text-transform: uppercase
}

.footer-apps {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.footer-apps__item {
    margin-right: 8px
}

.footer-apps__item:last-child {
    margin-right: 0
}

.footer-apps__item a {
    display: block;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.footer-apps__item a svg {
    fill: #89909F;
    height: 40px;
    width: 138px
}

.footer-apps__item a:hover {
    cursor: pointer;
    opacity: 0.5
}

.footer-apps__item a:active {
    opacity: 0.2
}

@media only screen and (max-width: 1199px) {
    .footer-apps {
        width: 100%;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

@media only screen and (max-width: 767px) {
    .footer-apps {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

.link-default {
    color: #00acec;
    text-decoration: none
}

.link-default_bold {
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: bold
}

.link-default_dashed {
    border-bottom: 1px dashed #00acec;
    padding-bottom: 6px
}

.link-default:hover {
    color: rgba(0, 172, 236, 0.8);
    cursor: pointer
}

.link-default:active {
    color: rgba(0, 172, 236, 0.5)
}

.link-default:visited {
    color: rgba(0, 172, 236, 0.8)
}

.link-small-triangle {
    display: inline-block;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.link-default {
    color: #00acec;
    text-decoration: none
}

.link-default_bold {
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: bold
}

.link-default_dashed {
    border-bottom: 1px dashed #00acec;
    padding-bottom: 6px
}

.link-default:hover {
    color: rgba(0, 172, 236, 0.8);
    cursor: pointer
}

.link-default:active {
    color: rgba(0, 172, 236, 0.5)
}

.link-default:visited {
    color: rgba(0, 172, 236, 0.8)
}

.link-small-triangle {
    display: inline-block;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.infotile {
    padding: 16px 0;
    width: 100%
}

.infotile__item {
    margin-bottom: 8px
}

.infotile__item:last-child {
    margin-bottom: 0
}

.infotile__item_text {
    margin-bottom: 24px
}

.infotile__item_action .link-default {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: auto
}

.infotile-headline {
    max-width: 92px;
    overflow: hidden
}

.infotile-headline__item {
    color: #89909F;
    text-transform: uppercase;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 16px
}

.infotile-payment__period {
    display: none;
    color: #89909F;
    text-transform: uppercase;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 16px;

    @media only screen and (max-width: 1199px) {
        display: block;
    }
}

@media only screen and (max-width: 1199px) {
    .infotile-headline {
        max-width: 100%
    }
}

.infotile-text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.infotile-text__number {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: auto;
    color: #47526B;
    font-size: 48px;
    font-weight: bold;
    letter-spacing: -1px;
    line-height: 45px;
    margin-right: 8px
}

.overflow {
    overflow: visible;
}

.other-payments {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    border-radius: 8px;
    background-color: #F9F9FA;
    height: 56px;
    padding-right: 16px;
    margin-top: 15px;
}

.other-payments-switch {
    margin-left: 200px;
    filter: invert(52%) sepia(99%) saturate(1498%) hue-rotate(165deg) brightness(97%) contrast(92%);
    transform: rotate(45deg);
    transition: 0.3s;
}

.other-payments-switch img {
    max-width: 20px;
    max-height: 20px;
    transform: rotate(0deg);
    transition: 0.3s;
}

.other-payments-switch img:hover {
    cursor: pointer;
    opacity: 0.5;
}

.other-payments-close img {
    transform: rotate(45deg);
}

.other-payments-content {
    display: none;
}

@media only screen and (max-width: 1199px) {
    .other-payments-switch {
        margin-left: 0px;
    }
}

@media only screen and (max-width: 375px) {
    .other-payments .navtabs-link__text {
        letter-spacing: 0px;
    }
}

.infotile-text__rate {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 16px;
    width: auto;
    vertical-align: top;
    color: #47526B;
    font-size: 14px;
    line-height: 16px;
    text-transform: uppercase
}

.monthwidget {
    display: block;
    width: 100%
}

.monthwidget__item {
    margin-bottom: 16px
}

.monthwidget__item:last-child {
    margin-bottom: 0
}

.monthwidget-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 16px 0;
    max-height: 48px;
    border-bottom: 1px solid #E0E7EA;
    overflow: hidden
}

.monthwidget-row__item_months {
    width: 100%
}

.monthwidget-row__item_values {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.monthwidget-row-month {
    width: 100%
}

.monthwidget-row-month span {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: uppercase;
    color: #89909F;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 16px
}

.monthwidget-row-value {
    margin-right: 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.monthwidget-row-value:last-child {
    margin-right: 0
}

.monthwidget-row-value__icon {
    display: block;
    margin-right: 10px
}

.monthwidget-row-value__icon svg {
    display: block
}

.monthwidget-row-value__text span {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #47526B;
    font-size: 13px;
    text-align: right
}

.plus-icon svg {
    fill: #86C453
}

.minus-icon {
    background-color: #F55D3E;
    width: 10px;
    height: 2px
}

.sber-service {
    background-color: #F7F7F7;
    padding: 16px;
    display: block;
    text-decoration: none
}

.sber-service__text {
    height: 72px;
    overflow: hidden;
    -webkit-transition: 0.2s;
    transition: 0.2s
}

.sber-service__text p {
    color: #47526B;
    font-size: 18px;
    line-height: 24px
}

.sber-service__icon {
    overflow: hidden;
    position: relative;
    height: 64px;
    width: 100%
}

.sber-service__icon svg {
    display: block;
    position: relative;
    left: 0;
    top: 0;
    height: 64px;
    width: 64px;
    fill: #47526B;
    -webkit-transition: .2s;
    transition: .2s
}

.sber-service:hover {
    cursor: pointer;
    background-color: #59A5D8;
    -webkit-box-shadow: 0 8px 16px 0 rgba(89, 165, 216, 0.5);
    box-shadow: 0 8px 16px 0 rgba(89, 165, 216, 0.5)
}

.sber-service:hover .sber-service__text p {
    color: white
}

.sber-service:hover .sber-service__icon svg {
    fill: white
}

.sber-services {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -40px;
    margin-bottom: -40px
}

.sber-services__item {
    padding-right: 40px;
    padding-bottom: 40px;
    width: 33.333333333%
}

.sber-services__item .sber-service {
    height: 280px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background-color: transparent;
    border: 1px solid #E0E7EA;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: .2s;
    transition: .2s
}

.sber-services__item .sber-service:hover {
    cursor: pointer;
    background-color: #00ACEC
}

.sber-services__item .sber-service:hover .sber-service__icon {
    text-align: right
}

@media only screen and (max-width: 1199px) {
    .sber-services {
        margin-right: 0;
        margin-bottom: 0
    }

    .sber-services__item {
        padding-right: 0;
        padding-bottom: 0;
        margin-bottom: 32px
    }

    .sber-services__item:last-child {
        margin-bottom: 0
    }
}

@media only screen and (max-width: 1199px) {
    .sber-services {
        display: block
    }

    .sber-services__item {
        width: 100%;
        margin-right: 0;
        margin-bottom: 32px
    }

    .sber-services__item:last-child {
        margin-bottom: 0
    }
}

.sber-services__item a {
    text-decoration: none
}

.namevalue {
    display: block
}

.namevalue__item {
    margin-bottom: 32px;
    overflow: hidden;

    @media (max-width: 460px) {
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 460px) {
    .namevalue__item.block-div {
        margin-top: -16px;
        margin-bottom: 16px;
    }
}

.namevalue__item:last-child {
    margin-bottom: 0
}

@media only screen and (max-width: 1199px) {
    .namevalue .namevalue-action__text {
        font-size: 12px;
    }
}

.namevalue-name {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background-color: white;
    position: relative;
    top: 1px;
    width: auto;
    padding-right: 5px;
    height: 20px;
    color: #89909F;
    font-size: 14px;
    font-weight: bold;
    line-height: 24px
}

@media only screen and (max-width: 1199px) {
    .namevalue-name {
        font-size: 12px
    }
}

.namevalue-value {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #47526B;
    font-size: 18px;
    width: auto
}

@media only screen and (max-width: 1199px) {
    .namevalue-value {
        font-size: 14px
    }
}

@media only screen and (max-width: 460px) {
    .namevalue-value .block-span {
        font-size: 11px
    }
}

.namevalue-action {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-decoration: none;
    margin-left: 50px;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.namevalue-action__icon {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    margin-right: 8px
}

.namevalue-action__icon svg {
    fill: #00ACEC;
    width: 16px;
    height: 16px
}

.namevalue-action__icon .ico_eye {
    height: 16px;
    width: 27px
}

.namevalue-action__text {
    font-family: "GothamPro", sans-serif;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #00ACEC;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 1px;
    line-height: 16px
}

.namevalue-action__justtext {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #89909F;
    font-size: 14px;
    letter-spacing: 1px;
    line-height: 16px;
    text-transform: uppercase
}

.namevalue-action:hover {
    cursor: pointer;
    opacity: 0.5
}

.namevalue-action:active {
    opacity: 0.2
}

@media only screen and (max-width: 1199px) {
    .namevalue-action {
        margin-left: 8px
    }
}

.namevalue-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;

    @media (max-width: 460px) {
        display: block;
    }
}

.namevalue-row__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%
}

.namevalue-row__item_name {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    width: 41.6666666667%;
    border-bottom: 1px dotted #E6E6E6;
    margin-right: 16px;

    @media (max-width: 460px) {
        border: none;
    }
}

.namevalue-row__terminals {
    @media (max-width: 767px) {
        display: block;
    }
}

.namevalue-row__item_name.no_border {
    border-bottom: unset;
}

@media only screen and (max-width: 1199px) {
    .namevalue-row__item_name {
        -webkit-box-flex: 1;
        -ms-flex: auto;
        flex: auto;
        width: 100%
    }

    .namevalue-row__item_value {
        -webkit-box-flex: 0;
        -ms-flex: none;
        flex: none;
        width: auto;
        line-height: 1.3;
    }
}

.rate {
    position: relative;
    overflow: hidden;
    -webkit-transition: background-color 200ms;
    transition: background-color 200ms;
    height: 250px;
    border: 1px solid #E0E7EA;
    padding: 1px;
}

.rate--is-active {
    background-color: #F7F7F7;
    border: 2px solid #89909F;
    padding: 0;
}

.rate--is-active:hover {
    border: 2px solid #00ACEC
}

.rate--is-active .rate-content__headline, .rate--is-active .rate-content__desc {
    padding-right: 32px
}

.rate:hover {
    background-color: #00ACEC;
    cursor: pointer
}

.rate:hover .action-wrapper {
    -webkit-animation-name: action;
    animation-name: action
}

.rate:hover .rate-content__active-icon svg {
    fill: white
}

.rate:hover .rate-content__headline, .rate:hover .rate-content__desc, .rate:hover .rate-price__period, .rate:hover .rate-price__value, .rate:hover .rate-price__currency {
    color: white
}

@media only screen and (max-width: 1199px) {
    .rate .action-wrapper {
        width: 100%;
        height: 55px
    }

    .rate:hover .action-wrapper {
        -webkit-animation-name: none;
        animation-name: none
    }
}

.rate-content {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 16px;
    width: 100%;
    height: 100%
}

.rate-content__active-icon {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 32px;
    height: 32px
}

.rate-content__active-icon svg {
    fill: #89909F;
    width: 100%;
    height: 100%
}

.rate-content__headline {
    margin-bottom: 8px;
    width: 100%;
    color: #000000;
    display: flex;
}

.rate-content__headline h2 {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 20px;
    font-weight: bold;
    line-height: 32px
}

.rate-content__desc {
    color: #47526B;
    height: 45px
}

.rate-content__desc p {
    font-size: 13px;
    line-height: 21px;
    height: 100%;
    width: 100%;
    overflow: hidden
}

.rate-content__action {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    height: 56px
}

@media only screen and (max-width: 1199px) {
    .rate-content__desc {
        height: auto
    }

    .rate-content__action {
        height: auto;
        width: 100%
    }

    .rate-content__action .btn-tran {
        opacity: 1
    }
}

@media only screen and (max-width: 1439px) {
    .rate-content__action .btn-tran__text {
        font-size: 14px
    }
}

@-webkit-keyframes action {
    0% {
        width: 56px;
        height: 4px
    }
    50% {
        width: 100%;
        height: 4px
    }
    100% {
        width: 100%;
        height: 55px
    }
}

@keyframes action {
    0% {
        width: 56px;
        height: 4px
    }
    50% {
        width: 100%;
        height: 4px
    }
    100% {
        width: 100%;
        height: 55px
    }
}

.action-wrapper {
    -webkit-animation-duration: 500ms;
    animation-duration: 500ms;
    -webkit-animation-delay: 0;
    animation-delay: 0;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    width: 56px;
    height: 4px;
    overflow: hidden
}

.autopayment-flex {
    display: flex;
    flex-direction: row;
    align-items: center;
}

@media only screen and (max-width: 600px) {
    .autopayment-flex {
        display: flex;
        flex-direction: column-reverse;
        align-items: flex-start;
    }
}

.rate-price {
    overflow: hidden
}

.rate-price__value {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: auto;
    font-size: 48px;
    font-weight: bold;
    letter-spacing: -1px;
    line-height: 45px;
    margin-right: 8px;
    max-width: 50%
}

.rate-price__currency {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: auto;
    font-size: 48px;
    line-height: 45px;
    margin-right: 8px
}

.rate-price__period {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: auto;
    vertical-align: top;
    color: #222222;
    font-size: 14px;
    line-height: 16px;
    text-transform: uppercase;
    white-space: nowrap
}

@media only screen and (max-width: 1439px) {
    .rate-price__value, .rate-price__currency {
        font-size: 32px;
        line-height: 38px
    }

    .rate-price__period {
        font-size: 12px;
        line-height: 20px
    }
}

.checkbox-default {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-width: 27px
}

.checkbox-default input[type=checkbox] {
    position: absolute;
    left: -9999px
}

.checkbox-default input[type=checkbox] + label {
    cursor: pointer;
    position: relative;
    height: 27px;
    width: 27px;
    display: block
}

.checkbox-default input[type=checkbox] + label:before, .checkbox-default input[type=checkbox] + label:after {
    content: '';
    position: absolute
}

.checkbox-default input[type=checkbox] + label:before {
    width: 24px;
    height: 25px;
    border: 1px solid #E0E7EA;
    background-color: #fff;
    border-radius: 0;
    left: 0;
    border-radius: 3px
}

.checkbox-default input[type=checkbox] + label:after {
    display: none;
    width: 16px;
    height: 16px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("/img/components/checkbox-default/ico_check.svg");
    top: 5px;
    left: 5px
}

.checkbox-default input[type=checkbox]:checked + label:after {
    display: block
}

.checkbox-default__name {
    display: block;
    line-height: 27px;
    vertical-align: top;
    margin-left: 5px
}

.checkbox-default__trigger {
    display: block;
    width: 27px;
    height: 27px
}

.info-icon__icon svg {
    fill: #C4C7CF
}

.switch-btn {
    background-color: transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.switch-btn__trigger {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-right: 5px
}

.switch-btn__trigger:hover {
    cursor: pointer
}

.switch-btn__name {
    font-size: 16px;
    font-weight: 400
}

.switch-btn--disabled .switch__trigger {
    pointer-events: none
}

.switch-btn--disabled .switch__trigger .switch-label {
    opacity: 0.5
}

.switch-btn--disabled .switch__trigger:hover {
    cursor: default
}

.switch-btn-input {
    display: none
}

.switch-btn-label {
    position: relative;
    display: inline-block;
    cursor: pointer;
    font-weight: 500;
    text-align: left;
    padding: 11px 0 11px 66px
}

.switch-btn-label:before, .switch-btn-label:after {
    content: "";
    position: absolute;
    margin: 0;
    outline: 0;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.switch-btn-label:before {
    left: 1px;
    width: 50px;
    height: 22px;
    background-color: #E0E7EA;
    border-radius: 10px
}

.switch-btn-label:after {
    left: 0;
    width: 32px;
    height: 32px;
    background-color: #fff;
    border-radius: 50%;
    -webkit-box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.14), 0 2px 2px 0 rgba(0, 0, 0, 0.098), 0 1px 5px 0 rgba(0, 0, 0, 0.084);
    box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.14), 0 2px 2px 0 rgba(0, 0, 0, 0.098), 0 1px 5px 0 rgba(0, 0, 0, 0.084)
}

.switch-btn-label .toggle--on {
    display: none
}

.switch-btn-label .toggle--off {
    display: inline-block
}

.switch-btn-input:checked + .switch-btn-label:before {
    background-color: #86C453
}

.switch-btn-input:checked + .switch-btn-label:after {
    background-color: #fff;
    -webkit-transform: translate(80%, -50%);
    transform: translate(80%, -50%)
}

.switch-btn-input:checked + .switch-btn-label .toggle--on {
    display: inline-block
}

.switch-btn-input:checked + .switch-btn-label .toggle--off {
    display: none
}

.service {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    padding: 28px;
    border-radius: 2px;
    border: 1px solid #E0E7EA
}

.service__item_trigger {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    margin-right: 8px
}

.service__item_content {
    width: 100%
}

.service--is-active .service-status__icon {
    display: block
}

.service--is-active .service-status__text span {
    color: #86C453
}

@media only screen and (max-width: 767px) {
    .service {
        display: block
    }

    .service__item {
        margin-bottom: 32px
    }

    .service__item:last-child {
        margin-bottom: 0
    }
}

.service-status {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.service-status__icon {
    display: none;
    margin-right: 8px
}

.service-status__icon svg {
    width: 16px;
    height: 16px;
    fill: #86C453
}

.service-status__text {
    height: 16px
}

.service-status__text span {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #89909F;
    font-size: 16px;
    line-height: 16px
}

@media only screen and (max-width: 767px) {
    .service-status__icon svg {
        width: 8px;
        height: 8px
    }

    .service-status__text span {
        font-size: 12px
    }
}

.service-name {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #47526B;
    font-size: 22px;
    font-weight: bold;
    line-height: 32px
}

@media only screen and (max-width: 1199px) {
    .service-name {
        white-space: normal;
        font-size: 18px
    }
}

.service-desc {
    overflow: hidden;
    color: #47526B;
    font-size: 16px;
    line-height: 24px
}

@media only screen and (max-width: 1199px) {
    .service-desc {
        font-size: 14px
    }
}

.service-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.service-info__item {
    margin-right: 53px
}

.service-info__item:last-child {
    margin-right: 0
}

.service-info_vert {
    display: block
}

.service-info_vert .service-info__item {
    margin-right: 0
}

.service-info-value, .service-info-name {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.service-info-value {
    color: #000000;
    font-size: 22px;
    font-weight: bold;
    line-height: 32px
}

.service-info-name {
    color: #89909F;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 16px;
    text-transform: uppercase
}

.service-info-text {
    margin-top: 32px;
    color: #47526B;
    font-size: 14px;
    line-height: 16px
}

.service-text {
    width: 100%
}

.service-text__item {
    width: 100%;
    margin-bottom: 8px
}

.service-text__item:last-child {
    margin-bottom: 0
}

.service-under {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.service-under__item {
    margin-right: 52px
}

.service-under__item:last-child {
    margin-right: 0
}

.service-under__item_info {
    width: 35%
}

.service-under__item_name {
    width: 65%
}

@media only screen and (max-width: 1199px) {
    .service-under {
        display: block
    }

    .service-under__item {
        width: 100%;
        margin-bottom: 32px;
        margin-right: 0
    }

    .service-under__item:last-child {
        margin-bottom: 0
    }
}

.reportinfo__item {
    margin-bottom: 24px
}

.reportinfo__item:last-child {
    margin-bottom: 0
}

.reportinfo-text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%
}

.reportinfo-text__icon {
    margin-right: 20px;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    height: 40px;
    width: 40px;
    text-align: center
}

.reportinfo-text__icon:last-child {
    margin-right: 0
}

.reportinfo-text__icon svg {
    display: inline-block;
    fill: #89909F;
    width: 100%;
    height: 100%
}

.reportinfo-text__icon .incoming-icon, .reportinfo-text__icon .upcoming-icon {
    display: inline-block;
    height: 40px;
    width: 33px
}

.reportinfo-text__value {
    overflow: hidden;
    height: 40px
}

.reportinfo-name {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: uppercase;
    color: #89909F;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 16px
}

.reportinfo-value-num {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: auto;
    color: #47526B;
    font-size: 40px;
    font-weight: bold;
    line-height: 44px;
    margin-right: 6px
}

.reportinfo-value-count {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: auto;
    color: #47526B;
    font-size: 14px;
    font-weight: bold;
    line-height: 16px;
    vertical-align: top;
    margin-left: 8px
}

.itraffic {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 170px
}

.itraffic__icon {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    height: 16px;
    width: 13px;
    margin-right: 18px
}

.itraffic__icon .incoming-icon, .itraffic__icon .upcoming-icon {
    width: 100%;
    height: 100%
}

.itraffic__icon .incoming-icon svg, .itraffic__icon .upcoming-icon svg {
    width: 100%;
    height: 100%
}

.itraffic__text {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #47526B;
    font-size: 20px;
    line-height: 40px;
    text-align: right
}

@media only screen and (max-width: 1199px) {
    .itraffic {
        max-width: 100%
    }

    .itraffic__icon {
        height: 13px;
        width: 10px;
        margin-right: 8px
    }

    .itraffic__text {
        font-size: 14px
    }
}

.tablereport {
    width: 100%
}

.tablereport__item {
    width: 100%;
    border-bottom: 1px solid #E0E7EA
}

.tablereport__item .summarytext {
    border-bottom: none;
    line-height: 40px
}

.tablereport-simple-month {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #47526B;
    max-width: 500px;
    overflow: hidden
}

.tablereport-simple-month__month {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 20px;
    line-height: 40px;
    margin-right: 8px;
    width: auto
}

.tablereport-simple-month__year {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 14px;
    line-height: 14px;
    width: auto
}

@media only screen and (max-width: 767px) {
    .tablereport-simple-month__month {
        font-size: 14px
    }

    .tablereport-simple-month__year {
        font-size: 12px
    }
}

.tablereport-simple-dates {
    text-align: left;
    overflow: hidden
}

.tablereport-simple-dates__item {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #47526B;
    font-size: 14px;
    font-weight: bold;
    line-height: 16px
}

@media only screen and (max-width: 767px) {
    .tablereport-simple-dates__item {
        font-size: 12px
    }
}

.tablereport-row {
    padding: 16px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-align: center;
    width: 100%
}

.tablereport-row__col {
    margin-right: 32px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden
}

.tablereport-row__col:last-child {
    margin-right: 0
}

.tablereport-row__col_15 {
    width: 15%
}

.tablereport-row__col_25 {
    width: 25%
}

.tablereport-row__col_45 {
    width: 45%
}

.tablereport-row__col_20 {
    width: 20%
}

.tablereport-row__col_40 {
    width: 40%
}

.tablereport-row__col_30 {
    width: 30%
}

.tablereport-row__col_50 {
    width: 50%
}

.tablereport-row__col_55 {
    width: 55%
}

.tablereport-row__col_100 {
    width: 100%
}

.tablereport-row__col_80 {
    width: 80%
}

@media only screen and (max-width: 767px) {
    .tablereport-row {
        padding: 0
    }
}

.navtabs {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: auto;
    border-radius: 8px;
    background-color: #F9F9FA;
    height: 56px
}

.navtabs__item--is-active .navtabs-link {
    background-color: #FFFFFF;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.25);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.25)
}

.navtabs__item--is-active .navtabs-link__text {
    color: #89909F
}

.navtabs__item--is-active .navtabs-link:hover {
    opacity: 1;
    cursor: pointer
}

.navtabs__item--is-active .navtabs-link:active {
    -webkit-transform: scale(0.99);
    transform: scale(0.99)
}

@media only screen and (max-width: 1199px) {
    .navtabs {
        display: block;
        height: auto
    }

    .navtabs__item {
        width: 100%
    }
}

.navtabs-link {
    display: block;
    padding: 24px;
    text-decoration: none;
    border-radius: 4px;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.navtabs-link__text {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #00ACEC;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 16px;
    text-transform: uppercase
}

.navtabs-link:hover {
    cursor: pointer;
    opacity: 0.5
}

.navtabs-link:active {
    opacity: 0.2
}

.paymethod {
    display: block;
    text-decoration: none
}

.paymethod:hover .paymethod-content {
    background-color: #F1F1F1;
    -webkit-box-shadow: 0 8px 16px 0 #CCCCCC;
    box-shadow: 0 8px 16px 0 #CCCCCC
}

.paymethod--sber .paymethod-line {
    background-color: #1A9F29
}

.paymethod--cards .paymethod-line {
    background-color: #DD0816
}

.paymethod--terminals .paymethod-line {
    background-color: #006896
}

.paymethod--qiwi .paymethod-line {
    background-color: #FF8B00
}

.paymethod--mts .paymethod-line {
    background-color: #DD0816
}

.paymethod--rse .paymethod-line {
    background-color: #605843
}

.paymethod--pskb .paymethod-line {
    background-color: #86C453
}

.paymethod--banks .paymethod-line {
    background-color: #006896
}

.paymethod--yamoney .paymethod-line {
    background-color: #FFCF00
}

.paymethod--post .paymethod-line {
    background-color: #0054A6
}

.paymethod--sbp .paymethod-line {
    background-color: #ED6F26;
}

.paymethod-logo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.paymethod-logo__item {
    margin-right: 32px
}

.paymethod-logo__item:last-child {
    margin-right: 0
}

.paymethod-content {
    padding: 32px 16px;
    -webkit-transition: all .2s;
    transition: all .2s
}

.paymethod-content__headline, .paymethod-content__logo {
    margin-bottom: 16px
}

.paymethod-content__logo {
    display: flex;
    justify-content: space-between;
}

.paymethod-cashback__container {
    width: 165px;
    height: 48px;

    padding: 2px;
    border-radius: 93px;

    background: linear-gradient(0deg, #CACACA, #CACACA), linear-gradient(271.64deg, rgba(255, 0, 0, 0.4) -6.8%, rgba(255, 214, 0, 0.4) 15.63%, rgba(0, 255, 56, 0.4) 35.93%, rgba(0, 255, 224, 0.4) 53.55%, rgba(0, 71, 255, 0.4) 71.7%, rgba(189, 0, 255, 0.4) 90.4%, rgba(255, 0, 0, 0.4) 100%);
    background-blend-mode: overlay;
}

@media (max-width: 480px) {
    .paymethod-cashback__container {
        width: 130px;
        height: 40px;
    }
}

.paymethod-cashback__content {
    width: 100%;
    height: 100%;

    display: flex;
    justify-content: center;
    align-items: center;

    background-color: #FFFFFF;
    border-radius: 93px;

    font-family: "GothamPro", sans-serif;
    font-size: 16px;
    font-weight: bold;
    line-height: 15.31px;
    text-align: center;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #000000;
}

.paymethod-content__headline {
    width: 100%
}

.paymethod-content__headline h2 {
    color: #000000;
    font-size: 16px;
    font-weight: bold;
    line-height: 24px;
    white-space: nowrap;
    width: 100%;
    overflow: hidden
}

.paymethod-content__line {
    margin-bottom: 12px
}

.paymethod-content__desc {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 200px;
    overflow: hidden;
}

@media only screen and (max-width: 1782px) {
    .paymethod-content__desc {
        height: 220px
    }
}

@media only screen and (max-width: 1625px) {
    .paymethod-content__desc {
        height: 240px
    }
}

@media only screen and (max-width: 1199px) {
    .paymethod-content__desc {
        height: 150px
    }
}

.paymethod-content__desc .btn-simple {
    width: 150px;
}

@media only screen and (max-width: 1023px) {
    .paymethod-content {
        padding: 16px
    }

    .paymethod-content__desc {
        height: auto
    }

    .paymethod-content__desc .btn-simple {
        margin-top: 16px;
    }
}

.paymethod-line {
    display: block;
    height: 4px;
    width: 56px;
    background-color: #eee
}

.paymethod-desc {
    color: #47526B;
    font-size: 14px;
    line-height: 24px
}

.iptvpacket {
    width: 100%;
    max-height: 198px;
    padding: 28px 24px;
    border: 1px solid #E0E7EA;
    border-radius: 2px;
    min-height: 178px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;

    @media (max-width: 1023px) {
        max-height: none;
    }
}

.iptvpacket__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.iptvpacket__item:first-child {
    padding-left: 2px
}

.iptvpacket__item_down {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    overflow: hidden
}

.iptvpacket__item_down .iptvpacket-price {
    max-width: 50%
}

.iptvpacket-name {
    overflow: hidden;
    margin-right: 16px
}

.iptvpacket-name__desc {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #89909F;
    font-size: 14px;
    font-weight: bold;
    line-height: 16px;
    margin-bottom: 8px
}

.iptvpacket-name__headline {
    margin-bottom: 8px;
    width: 100%;
    overflow: hidden;
    max-height: 48px;
    color: #47526B;
    font-size: 22px;
    font-weight: bold;
    line-height: 24px
}

@media only screen and (max-width: 1199px) {
    .iptvpacket-name__desc {
        font-size: 12px
    }

    .iptvpacket-name__headline {
        font-size: 18px
    }
}

.iptvpacket-price {
    overflow: hidden;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    max-width: 80%;
    text-align: right
}

.iptvpacket-price__num {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #000000;
    font-size: 22px;
    font-weight: bold;
    line-height: 36px
}

.iptvpacket-price__num_method {
    margin-bottom: 8px
}

.iptvpacket-price__desc {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #89909F;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 16px;
    text-transform: uppercase
}

.iptvpacket-price__desc .namevalue-action {
    margin-left: 0
}

.iptvpacket-price_small .iptvpacket-price__num {
    color: #47526B;
    font-size: 18px;
    line-height: 24px
}

.iptvpacket-price_small .iptvpacket-price__desc {
    text-transform: none;
    font-weight: normal;
    color: #47526B;
    font-size: 13px;
    line-height: 16px
}

@media only screen and (max-width: 767px) {
    .iptvpacket-price .namevalue-action__text {
        font-size: 12px
    }
}

.iptv-pin {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%
}

.iptv-pin__item {
    margin-right: 32px
}

.iptv-pin__item:last-child {
    margin-right: 0
}

.iptv-pin__item_pin {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none
}

.iptv-pin__item_text {
    max-width: 50%
}

.iptv-channels__headline {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 35px;
    padding-left: 20px;

    @media (max-width: 910px) {
        margin-bottom: 20px;
        padding-left: 0;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    @media (max-width: 460px) {
        margin-bottom: 10px;
    }
}

.iptv-channels__headline__header {
    font-size: 34px;
    font-weight: 600;
    line-height: 48px;
    text-align: left;
    white-space: nowrap;

    @media (max-width: 1300px) {
        font-size: 30px;
    }

    @media (max-width: 910px) {
        font-size: 22px;
        margin-bottom: 15px;
        line-height: 30px;
    }

    @media (max-width: 460px) {
        line-height: 15px;
        font-size: 16px;
    }
}

.iptv-channels__headline__searchbar_container {
    width: 40%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 30px;

    @media (max-width: 910px) {
        width: 100%;
        margin-left: 0;
    }
}

.input-search__container {
    position: relative;
    min-width: 100%;
}

.input-search__container__input {
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    text-align: left;

    padding: 10px 60px;
    border: 1px solid #89909F;
    border-radius: 6px;
    min-width: 100%;

    @media (max-width: 460px) {
        border-radius: 2px;
        line-height: 11px;
        padding: 5px 0 5px 30px;
        font-size: 10px;
    }
}

.input-search__container__input:focus {
    border-color: #00ACEC;
}

.input-search__search-icon {
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    color: #89909F;

    @media (max-width: 460px) {
        left: 10px;
        max-width: 10px;
        max-height: 10px;
    }
}

.iptv-channels-container {
    display: flex;
    flex-wrap: wrap;
}

.iptv-grid-channel__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 20%;
    padding: 20px 0;
    border-right: 1px solid #f2f6fa;
    border-bottom: 1px solid #f2f6fa;

    @media (max-width: 767px) {
        padding: 20px;
        width: 25%;
    }
}

.iptv-grid-channel__item:nth-child(5n) {
    border-right: 0;
}

.iptv-channel-icon {
    display: flex;
    border-radius: 100%;
    width: 40px;
    height: 40px;

    & > * {
        margin: auto;
    }

    img {
        width: 100%;
        height: 100%;
        border-radius: 100%;
    }
}

.iptv-channel-name {
    margin-top: 0.5rem;
    font-size: 1rem;
    font-weight: 400;
    text-align: center;

    @media (max-width: 767px) {
        font-size: 0.8rem;
    }

    @media (max-width: 460px) {
        font-size: 0.6rem;
    }
}

@media only screen and (max-width: 1199px) {
    .iptv-pin {
        display: block
    }

    .iptv-pin__item {
        width: 100%;
        margin-right: 0;
        margin-bottom: 32px
    }

    .iptv-pin__item:last-child {
        margin-bottom: 0
    }
}

.iptv-pin-number {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #47526B;
    font-size: 40px;
    font-weight: bold;
    line-height: 48px
}

.iptv-pin-helptext {
    overflow: hidden;
    max-height: 48px;
    color: #47526B;
    font-size: 13px;
    line-height: 24px
}

.summarytext {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 16px 0;
    border-bottom: 1px solid #E0E7EA
}

.summarytext__item {
    width: 50%
}

.summarytext__item:last-child {
    text-align: right
}

.summarytext-number, .summarytext-text {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: uppercase
}

.summarytext-number, .summarytext-text {
    color: #47526B;
    font-size: 24px;
    font-weight: bold
}

.rates-list {
    padding-left: 60px
}

.rates-list__item {
    position: relative;
    padding-left: 40px;
    margin-bottom: 40px
}

.rates-list__item:last-child {
    margin-bottom: 0
}

.rates-list__item p {
    color: #47526B;
    font-size: 20px;
    line-height: 32px
}

.rates-list__item p.smaller {
    font-size: 16px;
    line-height: 24px
}

.rates-list__item .rates-list {
    margin-top: 16px;
    width: 83%;
    padding-left: 24px
}

.rates-list__item .rates-list__item {
    padding-left: 24px;
    margin-bottom: 24px
}

.rates-list__item .rates-list p {
    font-size: 16px;
    line-height: 24px
}

@media only screen and (max-width: 1199px) {
    .rates-list {
        padding-left: 0
    }

    .rates-list__item {
        margin-bottom: 20px;
        padding-left: 25px
    }

    .rates-list__item p {
        font-size: 14px;
        line-height: 24px
    }

    .rates-list__item p.smaller {
        font-size: 12px;
        line-height: 20px
    }

    .rates-list__item .rates-list__item {
        margin-bottom: 12px
    }

    .rates-list__item .rates-list p {
        font-size: 14px;
        line-height: 24px
    }
}

.rates-list-img {
    -webkit-box-shadow: 0 8px 16px 0 #CCCCCC;
    box-shadow: 0 8px 16px 0 #CCCCCC;
    width: 100%
}

.rates-list {
    padding-left: 60px
}

.rates-list__item {
    position: relative;
    padding-left: 40px;
    margin-bottom: 40px
}

.rates-list__item:last-child {
    margin-bottom: 0
}

.rates-list__item p {
    color: #47526B;
    font-size: 20px;
    line-height: 32px
}

.rates-list__item p.smaller {
    font-size: 16px;
    line-height: 24px
}

.rates-list__item .rates-list {
    margin-top: 16px;
    width: 83%;
    padding-left: 24px
}

.rates-list__item .rates-list__item {
    padding-left: 24px;
    margin-bottom: 24px
}

.rates-list__item .rates-list p {
    font-size: 16px;
    line-height: 24px
}

@media only screen and (max-width: 1199px) {
    .rates-list {
        padding-left: 0
    }

    .rates-list__item {
        margin-bottom: 20px;
        padding-left: 25px
    }

    .rates-list__item p {
        font-size: 14px;
        line-height: 24px
    }

    .rates-list__item p.smaller {
        font-size: 12px;
        line-height: 20px
    }

    .rates-list__item .rates-list__item {
        margin-bottom: 12px
    }

    .rates-list__item .rates-list p {
        font-size: 14px;
        line-height: 24px
    }
}

.rates-list-img {
    -webkit-box-shadow: 0 8px 16px 0 #CCCCCC;
    box-shadow: 0 8px 16px 0 #CCCCCC;
    width: 100%
}

.rates-list-img.paylogo {
    width: auto;
    margin: 10px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.rates-list-bullet {
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    overflow: hidden
}

.rates-list-bullet_inner {
    top: 8px
}

.rates-list-bullet__circle {
    display: block;
    background-color: black;
    height: 5px;
    width: 5px;
    border-radius: 50%
}

.rates-list-bullet__text {
    width: 25px;
    height: 32px;
    display: block;
    color: #89909F;
    font-size: 14px;
    font-weight: bold;
    line-height: 32px;
    width: 100%;
    overflow: hidden
}

@media only screen and (max-width: 1199px) {
    .rates-list-bullet__text {
        width: 16px;
        height: 20px;
        font-size: 9px;
        line-height: 20px
    }
}

.currentip {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.currentip__item {
    margin-right: 16px;
    width: 33.3333%
}

.currentip__item:last-child {
    margin-right: 0
}

@media only screen and (max-width: 1199px) {
    .currentip {
        display: block
    }

    .currentip__item {
        width: 100%;
        margin-right: 0;
        margin-bottom: 32px
    }

    .currentip__item:last-child {
        margin-bottom: 0
    }
}

.currentip-text__value span, .currentip-text__name span {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.currentip-text__name span {
    color: #47526B;
    font-size: 13px;
    line-height: 24px
}

.currentip-text__value span {
    color: #47526B;
    font-size: 40px;
    font-weight: bold;
    line-height: 48px
}

.ipgrid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -40px
}

.ipgrid__item {
    display: inline-block;
    width: 33.3333333%;
    padding-right: 40px;
    padding-bottom: 24px
}

@media only screen and (max-width: 1199px) {
    .ipgrid {
        display: block;
        margin-right: 0
    }

    .ipgrid__item {
        width: 100%;
        padding-right: 0
    }
}

.ipgrid-wrapper__item {
    margin-bottom: 24px
}

.ipgrid-wrapper__item:last-child {
    margin-bottom: 0
}

.ipgrid-tile {
    padding: 16px;
    border: 1px solid #E0E7EA;
    border-radius: 2px;
    width: 100%;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.ipgrid-tile__num {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #47526B;
    font-size: 26px;
    font-weight: bold;
    line-height: 32px
}

.ipgrid-tile--is-active {
    border: 2px solid #89909F;
    background-color: #F7F7F7
}

.ipgrid-tile:hover {
    cursor: pointer;
    opacity: 0.5
}

.ipgrid-tile:active {
    opacity: 0.2
}

.limittable {
    width: 100%;
    position: relative
}

.limittable-tiles {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%
}

.limittable-tiles__item {
    width: 100%;
    padding-right: 1px
}

.limittable-tiles__item:last-child {
    padding-right: 0
}

.limittable-tile {
    background-color: #E0E7EA;
    display: block;
    position: relative;
    height: 36px;
    width: 100%
}

.limittable-tile__popup {
    display: none;
    text-align: center;
    position: absolute;
    top: -30px;
    left: 50%;
    margin-left: -65px;
    height: 30px;
    width: 130px;
    border: 1px solid #E0E7EA;
    border-radius: 2px;
    background-color: #FFFFFF;
    z-index: 4;
    padding: 8px
}

.limittable-tile__popup span {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #47526B;
    font-size: 12px;
    font-weight: bold;
    line-height: 14px
}

.limittable-tile__popup:before {
    content: "";
    position: absolute;
    bottom: -4px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5.2px 3px 0 3px;
    border-color: white transparent transparent transparent;
    z-index: 2
}

.limittable-tile--is-active {
    background-color: #59A5D8
}

.limittable-tile:hover .limittable-tile__popup {
    display: block
}

.limittable-tile:hover {
    cursor: pointer;
    background-color: #00ACEC
}

.limittable-tile_fixed {
    width: 36px;
    height: 36px
}

@media only screen and (max-width: 767px) {
    .limittable-tile {
        height: 26px
    }
}

@media only screen and (max-width: 399px) {
    .limittable-tile {
        height: 16px
    }
}

.limittable-day {
    width: 42px;
    padding-right: 16px
}

.limittable-day span {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #47526B;
    font-size: 12px;
    font-weight: bold;
    line-height: 24px
}

@media only screen and (max-width: 767px) {
    .limittable-day {
        width: 32px
    }

    .limittable-day span {
        font-size: 10px
    }
}

.limittable-time {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 36px;
    padding-left: 42px
}

.limittable-time__item {
    width: 100%;
    margin-right: 1px
}

.limittable-time__item:last-child {
    margin-right: 0
}

.limittable-time__item span {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #47526B;
    font-size: 12px;
    font-weight: bold;
    line-height: 24px
}

@media only screen and (max-width: 767px) {
    .limittable-time {
        padding-left: 32px
    }

    .limittable-time__item span {
        font-size: 10px
    }
}

.limittable-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 1px
}

.limittable-row:last-child {
    margin-bottom: 0
}

.limittable-row__item_tiles {
    width: 100%
}

.limittable-action {
    margin-top: 22px;
    padding-left: 42px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media only screen and (max-width: 1023px) {
    .limittable-action {
        display: block;
        padding-left: 32px
    }

    .limittable-action__item {
        width: 100%;
        margin-bottom: 32px
    }

    .limittable-action__item:last-child {
        margin-bottom: 0
    }
}

.limittable-legend {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.limittable-legend__item {
    margin-right: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.limittable-legend__item:last-child {
    margin-right: 0
}

@media only screen and (max-width: 1023px) {
    .limittable-legend {
        display: block
    }

    .limittable-legend__item {
        margin-right: 0;
        margin-bottom: 16px
    }

    .limittable-legend__item:last-child {
        margin-bottom: 0
    }
}

.limittable-legend-marker {
    margin-right: 8px
}

.limittable-legend-name span {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: auto;
    color: #47526B;
    font-size: 16px;
    line-height: 24px
}

.limittable-btns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.limittable-btns__item {
    margin-right: 24px
}

.limittable-btns__item:last-child {
    margin-right: 0
}

@media only screen and (max-width: 1023px) {
    .limittable-btns {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        text-align: center
    }

    .limittable-btns__item {
        width: 100%;
        margin-right: 0;
        margin-bottom: 16px
    }

    .limittable-btns__item .btn-simple {
        width: 100%;
        display: block
    }

    .limittable-btns__item:first-child {
        margin-bottom: 0
    }
}

.link-clear {
    color: #89909f;
    text-decoration: none;
    background-color: white;
}

.link-clear_bold {
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: bold
}

.link-clear:hover {
    color: rgba(137, 144, 159, 0.5);
    cursor: pointer
}

.link-clear:active {
    color: rgba(137, 144, 159, 0.2)
}

.payments-history-date {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden;
}

.payments-history-date__month {
    display: block;
    width: auto;
    color: #47526B;
    font-size: 20px;
    line-height: 20px;
    margin-right: 8px;
    line-height: 40px
}

.payments-history-date__yearandtime {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-top: 4px;
    line-height: 40px;
    width: auto;
    font-size: 12px;
    color: #89909F
}

.payments-history-text {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #47526B;
    font-size: 16px;
    line-height: 40px
}

.payments-history-sum {
    text-align: right;
    line-height: 40px;
    width: 100%
}

.payments-history-sum_light .summarytext-number {
    font-weight: normal
}

.payments-history-sum .summarytext-number {
    font-size: 20px
}

.payments-history-period {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.payments-history-period__item {
    margin-right: 16px
}

.payments-history-period__item:last-child {
    margin-right: 0
}

.payments-history-period__item .link-default {
    font-size: 18px
}

.payments-history-period__item p {
    color: #47526B;
    font-size: 13px;
    line-height: 24px;
    max-width: 280px
}

.payments-history-period__item .btn-simple {
    padding: 16px 48px
}

@media only screen and (max-width: 1199px) {
    .payments-history-period {
        display: block
    }

    .payments-history-period__item {
        width: 100%;
        margin-right: 0;
        margin-bottom: 16px
    }

    .payments-history-period__item:last-child {
        margin-bottom: 0
    }
}

.payments-history-period-text {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #47526B;
    font-size: 18px;
    font-weight: bold;
    line-height: 24px
}

.payment-info-link {
    display: block;
    color: #00ACEC;
    font-size: 20px;
    font-weight: bold;
    line-height: 22px;
    text-transform: uppercase;
}

.payment-info-modal-content ul {
    margin-block-start: 0.5em;
    margin-block-end: 1em;
    line-height: 22px;
    font-size: 17px;
}

.payment-info-modal-content li {
    margin-left: 15px;
    line-height: 22px;
}

.payment-info-modal-content, .payment-info-modal-list__circle li {
    list-style: disc;
}

/* Список с цифрами */
.payment-info-modal-list {
    counter-reset: list-counter; /* Создаём новый счётчик */
}

.payment-info-modal-list li {
    counter-increment: list-counter; /* Увеличиваем счётчик */
    position: relative;
    margin-left: 20px;
}

/* Добавляем цифры перед каждым элементом */
.payment-info-modal-list li::before {
    content: counter(list-counter) "."; /* Число с точкой */
    position: absolute;
    left: -20px; /* Сдвигаем цифру влево */
    width: 20px;
    text-align: left;
}

@media only screen and (max-width: 1199px) {
    .payment-info-link {
        font-size: 15px;
    }
}

@media only screen and (max-width: 399px) {
    .payment-info-modal-content ul {
        font-size: 15px;
    }
}

.payment-info-title {
    display: block;
    margin-bottom: 10px;
}

.tip {
    padding: 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid #E0E7EA
}

.tip__item_icon {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    width: 70px;
    margin-right: 16px
}

.tip__item_text {
    width: 100%
}

@media only screen and (max-width: 1199px) {
    .tip {
        display: block
    }

    .tip__item_icon {
        width: 100%;
        margin-right: 0;
        margin-bottom: 16px;
        text-align: center
    }
}

.tip-text {
    width: 100%
}

.tip-text p {
    color: #47526B;
    font-size: 18px;
    line-height: 24px
}

@media only screen and (max-width: 1199px) {
    .tip-text p {
        font-size: 14px
    }
}

.tip-icon {
    display: inline-block;
    width: 70px;
    height: 70px
}

.tip-icon svg {
    fill: #89909F;
    height: 100%;
    width: 100%
}

.modal {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-color: white;
    min-width: 800px;
    -webkit-box-shadow: 0 8px 16px 0 #222222;
    box-shadow: 0 8px 16px 0 #222222;
    border-radius: 8px;
    overflow: auto
}

.modal-autopayment {
    width: 580px;
    min-width: 278px;
    height: auto;
}

.modal-close-btn {
    height: 20px;
    width: 20px;
    position: absolute;
    top: 15px;
    right: 15px;
    display: flex;
    background-color: #fff;

    svg {
        fill: #89909F;
        height: 50%;
        width: 50%;
        margin: auto;
    }
}

.modal__ok {
    max-width: 350px;
}

.modal-close-btn:hover {
    cursor: pointer;
}

.modal-close-btn:active {
    opacity: 0.5;
}

.modal-iptv-channels {
    min-width: 80%;
    height: 80%;
    overflow: hidden;
}

.modal-iptv-channels__content {
    height: 100%;
    overflow: auto;
    padding-right: 30px;

    @media (max-width: 460px) {
        padding-right: 15px;
    }
}

.modal__item {
    width: 100%;
    height: 100%;
    padding: 40px
}

.modal-action-autopayment {
    padding: 16px 16px;
    margin-right: 16px;
}

@media only screen and (max-width: 1199px) {
    .modal {
        width: 100%;
        height: 100%;
        border-radius: 0;
    }

    .modal-autopayment {
        width: 580px;
        height: auto;
        border-radius: 8px;
    }

    .modal-action-autopayment {
        margin-right: 16px;
    }

    .modal__ok {
        width: 90%;
        min-width: 90%;
        max-height: 270px;
    }

    .modal-iptv-channels {
        width: 90%;
        min-width: 90%;
        height: 80%;
    }

    .modal__item {
        height: auto
    }

    .modal-iptv-item {
        height: 100%;

        @media (max-width: 910px) {
            padding: 40px 20px;
        }
    }

    .modal__item .checkbox-default__name {
        font-size: 12px;
        line-height: 16px
    }
}

@media only screen and (max-width: 600px) {
    .modal-autopayment {
        width: calc(100% - 40px);
        position: fixed;
        height: auto;
        border-radius: 8px;
    }

    .modal-action-autopayment {
        margin-top: 16px;
    }
}

@media only screen and (max-width: 400px) {
    .modal-autopayment .modal__item {
        padding: 24px 20px;
    }
}

.modal-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    min-width: 100%;
    min-height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    width: auto;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    z-index: 245
}

.modal-wrapper--hide {
    display: none
}

.modal-head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 40px
}

.modal-head-autopayment {
    margin-bottom: 20px
}

.modal-head__item {
    margin-right: 32px
}

.modal-head__item:last-child {
    margin-right: 0
}

.modal-headline {
    color: #000000;
    font-size: 32px;
    font-weight: bold;
    line-height: 40px;
    max-height: 80px
}

.modal-headline-autopayment {
    font-size: 24px;
    font-weight: 700;
    line-height: 22px;
}

@media only screen and (max-width: 399px) {
    .modal-headline {
        font-size: 14px;
        line-height: normal
    }

    .modal-headline-autopayment {
        font-size: 23px;
        font-weight: 700;
        line-height: 22px;
        max-height: min-content;
    }
}

.modal-close__icon {
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.modal-close__icon svg {
    fill: black;
    width: 24px;
    height: 24px
}

.modal-close__icon:hover {
    cursor: pointer;
    opacity: 0.5
}

.modal-close__icon:active {
    opacity: 0.2
}

.calendar-month {
    width: 336px
}

.calendar-wrapper {
    position: relative;
    max-width: 734px;
    overflow: hidden
}

@media only screen and (max-width: 1199px) {
    .calendar-wrapper {
        margin: 0 auto;
        max-width: 367px
    }
}

.calendar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    overflow: auto;
    max-width: 100%
}

.calendar__item {
    margin-right: 48px
}

.calendar__item:last-child {
    margin-right: 0
}

.calendar-week {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%
}

.calendar-week__item {
    width: 48px;
    height: 48px
}

.calendar-week__item--is-past .calendar-day {
    opacity: 0.5
}

.calendar-week__item--is-past .calendar-day:hover {
    background-color: transparent;
    cursor: default
}

.calendar-week__item--is-current .calendar-day__text {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    line-height: 35px;
    background-color: #eee
}

.calendar-week__item--is-end .calendar-day {
    background-color: #86C453;
    color: #FFFFFF
}

.calendar-week__item--is-end .calendar-day:hover {
    background-color: #6daa3a
}

.calendar-week__item--is-between .calendar-day {
    background-color: rgba(134, 196, 83, 0.2)
}

.calendar-week__item:nth-last-child(-n+2) .calendar-day {
    color: #59A5D8
}

.calendar-day {
    position: relative;
    height: 48px;
    width: 48px;
    color: #47526B;
    overflow: hidden
}

.calendar-day__text {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    font-size: 16px;
    line-height: 16px;
    text-align: center
}

.calendar-day:hover {
    cursor: pointer;
    background-color: rgba(134, 196, 83, 0.2)
}

.calendar-day_hoveroff {
    pointer-events: none
}

.calendar-day_hoveroff:hover {
    cursor: default;
    background-color: transparent
}

.calendar-month-headline__name {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: uppercase;
    color: #89909F;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 2px;
    line-height: 24px;
    text-align: center
}

.calendar-controls {
    position: absolute;
    top: 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.calendar-controls__item svg {
    width: 24px;
    height: 24px;
    fill: #89909F
}

.calendar-controls__item:hover {
    cursor: pointer
}

.calendar-controls__item:hover svg {
    fill: #a5aab6
}

.calendar-controls__item:active svg {
    fill: #c1c5cd
}

.header-float {
    display: none;
    width: 100%;
    padding: 10px 16px;
    background: white;
    margin-top: 60px;
    border-bottom: 1px solid #E0E7EA
}

@media only screen and (max-width: 1199px) {
    .header-float {
        display: block
    }
}

.android-logo {
    width: 512px;
    height: 512px
}

.bage_appstore {
    width: 138px;
    height: 40px
}

.bage_google_play {
    width: 138px;
    height: 40px
}

.ico_arr_big {
    width: 64px;
    height: 64px
}

.ico_arr_down {
    width: 14px;
    height: 8px
}

.ico_call {
    width: 40px;
    height: 40px
}

.ico_chat_support {
    width: 40px;
    height: 35px
}

.ico_check {
    width: 32px;
    height: 32px
}

.ico_checked_service {
    width: 16px;
    height: 16px
}

.ico_close {
    width: 16px;
    height: 16px
}

.ico_close_big {
    width: 24px;
    height: 24px
}

.ico_eye {
    width: 27px;
    height: 16px
}

.ico_fb {
    width: 32px;
    height: 32px
}

.ico_gp {
    width: 32px;
    height: 32px
}

.ico_hamburger {
    width: 22px;
    height: 16px
}

.ico_incoming {
    width: 8px;
    height: 10px
}

.ico_info {
    width: 24px;
    height: 24px
}

.ico_left_arr {
    width: 24px;
    height: 24px
}

.ico_minus {
    width: 10px;
    height: 2px
}

.ico_pencil {
    width: 16px;
    height: 16px
}

.ico_plus {
    width: 10px;
    height: 10px
}

.ico_right_arr {
    width: 24px;
    height: 24px
}

.ico_sign-in {
    width: 24px;
    height: 24px
}

.ico_time {
    width: 40px;
    height: 40px
}

.ico_tw {
    width: 32px;
    height: 32px
}

.ico_vk {
    width: 32px;
    height: 32px
}

.logo_apple {
    width: 19px;
    height: 24px
}

.med-headline {
    color: #000000;
    font-size: 26px;
    font-weight: bold;
    line-height: 32px
}

.infoblock {
    display: block;
    border: 1px #86c453 solid;
    border-radius: 2px;
    margin-bottom: 15px;
    background-color: #86c453;
    color: white;
    height: 42px;
    z-index: 200;
    position: relative;
    top: -54px;
    font-weight: normal
}

.infoblock.alert {
    padding: 12px 0 15px 20px;
}

.infoblock.alert.fail {
    border-color: #F55D3E;
    background-color: #F55D3E;
}

@media only screen and (max-width: 767px) {
    .med-headline {
        font-size: 18px;
        line-height: 21px
    }
}

.parag {
    font-size: 20px;
    line-height: 32px
}

.parag_smaller {
    font-size: 18px;
    line-height: 24px
}

@media only screen and (max-width: 1199px) {
    .parag {
        font-size: 14px;
        line-height: 24px
    }

    .parag_smaller {
        font-size: 12px;
        line-height: 18px
    }
}

.animation--moveDown {
    -webkit-animation-name: moveDown;
    animation-name: moveDown;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.animation--slideRight {
    -webkit-animation-name: slideRight;
    animation-name: slideRight;
    -webkit-animation-duration: 0.2s;
    animation-duration: 0.2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease
}

.animation--fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.animation--delay-0 {
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

.animation--delay-0-25 {
    -webkit-animation-delay: 0.25s;
    animation-delay: 0.25s
}

.animation--delay-0-50 {
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s
}

.animation--delay-0-75 {
    -webkit-animation-delay: 0.75s;
    animation-delay: 0.75s
}

.animation--delay-1 {
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.animation--delay-1-25 {
    -webkit-animation-delay: 1.25s;
    animation-delay: 1.25s
}

.animation--delay-1-50 {
    -webkit-animation-delay: 1.50s;
    animation-delay: 1.50s
}

/*! Pushy - v1.1.0 - 2017-1-30
* Pushy is a responsive off-canvas navigation menu using CSS transforms & transitions.
* https://github.com/christophery/pushy/
* by Christopher Yee */
.pushy {
    position: fixed;
    width: 264px;
    height: 100%;
    top: 0;
    z-index: 9999;
    background: #47526B;
    overflow: auto;
    -webkit-overflow-scrolling: touch
}

.pushy a {
    display: block;
    color: #b3b3b1;
    padding: 15px 30px;
    text-decoration: none
}

.pushy a:hover {
    color: #FFF
}

.pushy ul:first-child {
    margin-top: 10px
}

.pushy.pushy-left {
    left: 0
}

.pushy.pushy-right {
    right: 0
}

.pushy-content {
    visibility: hidden;
    padding: 24px 0
}

.pushy-left {
    -webkit-transform: translate3d(-264px, 0, 0);
    transform: translate3d(-264px, 0, 0)
}

.pushy-open-left #container, .pushy-open-left .push {
    -webkit-transform: translate3d(264px, 0, 0);
    transform: translate3d(264px, 0, 0)
}

.pushy-right {
    -webkit-transform: translate3d(264px, 0, 0);
    transform: translate3d(264px, 0, 0)
}

.pushy-open-right #container, .pushy-open-right .push {
    -webkit-transform: translate3d(-264px, 0, 0);
    transform: translate3d(-264px, 0, 0)
}

.pushy-open-left .pushy, .pushy-open-right .pushy {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.pushy-open-left .pushy-content, .pushy-open-right .pushy-content {
    visibility: visible
}

#container, .pushy, .push {
    -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99);
    transition: -webkit-transform 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99);
    transition: transform 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99);
    transition: transform 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99), -webkit-transform 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99)
}

.pushy-content {
    -webkit-transition: visibility 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99);
    transition: visibility 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99)
}

.site-overlay {
    display: none
}

.pushy-open-left .site-overlay, .pushy-open-right .site-overlay {
    display: block;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 9998;
    background-color: rgba(0, 0, 0, 0.5);
    -webkit-animation: fade 500ms;
    animation: fade 500ms
}

@keyframes fade {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@-webkit-keyframes fade {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

.pushy-submenu ul {
    padding-left: 15px;
    -webkit-transition: max-height 0.2s ease-in-out, visibility 0.2s ease-in-out;
    transition: max-height 0.2s ease-in-out, visibility 0.2s ease-in-out
}

.pushy-submenu ul .pushy-link {
    -webkit-transition: opacity 0.2s ease-in-out;
    transition: opacity 0.2s ease-in-out
}

.pushy-submenu button {
    width: 100%;
    color: #b3b3b1;
    padding: 15px 30px;
    text-align: left;
    background: transparent;
    border: 0
}

.pushy-submenu button:hover {
    color: #FFF
}

.pushy-submenu > a, .pushy-submenu > button {
    position: relative
}

.pushy-submenu > a::after, .pushy-submenu > button::after {
    content: '';
    display: block;
    height: 11px;
    width: 8px;
    position: absolute;
    top: 50%;
    right: 15px;
    background: url("../img/arrow.svg") no-repeat;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: -webkit-transform 0.2s;
    transition: -webkit-transform 0.2s;
    transition: transform 0.2s;
    transition: transform 0.2s, -webkit-transform 0.2s
}

.pushy-submenu-closed ul {
    max-height: 0;
    overflow: hidden;
    visibility: hidden
}

.pushy-submenu-closed .pushy-link {
    opacity: 0
}

.pushy-submenu-open ul {
    max-height: 1000px;
    visibility: visible
}

.pushy-submenu-open .pushy-link {
    opacity: 1
}

.pushy-submenu-open a::after, .pushy-submenu-open button::after {
    -webkit-transform: translateY(-50%) rotate(90deg);
    transform: translateY(-50%) rotate(90deg)
}

.pushy {
    background-color: #F9F9FA
}

.pushy a {
    padding: 0
}

.pushy-content {
    padding: 40px 20px
}

.pushy .menu-text {
    font-size: 14px
}

.layout-login {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100vh
}

.layout-login__item {
    width: 100%
}

@media only screen and (max-width: 1199px) {
    .layout-login {
        width: 100%;
        display: block;
        height: auto
    }
}

.layout-index-infotile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-bottom: 32px;
    border-bottom: 1px solid #E0E7EA;
    width: 100%
}

.layout-index-infotile__item {
    width: 33.3333333333%;
    border-right: 1px solid #E0E7EA;
    margin-right: 48px
}

.layout-index-infotile__item:last-child {
    margin-right: 0
}

.layout-index-infotile__item:last-child {
    border-right: none
}

@media only screen and (max-width: 1199px) {
    .layout-index-infotile {
        display: block;
        border-bottom: none
    }

    .layout-index-infotile__item {
        border-right: none;
        margin-right: 0;
        width: 100%;
        border-bottom: 1px solid #E0E7EA
    }
}

.layout-index-monthcharts {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-bottom: 32px;
    padding-top: 28px;
    border-bottom: 1px solid #E0E7EA;
    width: 100%
}

.layout-index-monthcharts__item {
    margin-right: 48px
}

.layout-index-monthcharts__item:last-child {
    margin-right: 0
}

.layout-index-monthcharts__item_chart {
    width: 66.6666666667%
}

.layout-index-monthcharts__item_chart img {
    width: 100%
}

.layout-index-monthcharts__item_chart #monthchart1 {
    display: block;
    width: 100%;
    height: 200px
}

.layout-index-monthcharts__item_widget {
    width: 33.3333333333%
}

@media only screen and (max-width: 1199px) {
    .layout-index-monthcharts {
        display: block
    }

    .layout-index-monthcharts__item {
        width: 100%;
        margin-right: 0;
        margin-bottom: 32px
    }

    .layout-index-monthcharts__item:last-child {
        margin-bottom: 0
    }
}

.layout-index-payments {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-top: 32px
}

.layout-index-payments__item {
    width: 100%;
    margin-right: 48px
}

.layout-index-payments__item:last-child {
    margin-right: 0
}

.layout-index-payments__item .sber-service {
    height: 176px
}

@media only screen and (max-width: 1199px) {
    .layout-index-payments {
        display: block
    }

    .layout-index-payments__item {
        margin-bottom: 32px;
        margin-right: 0;
        width: 100%
    }

    .layout-index-payments__item:last-child {
        margin-bottom: 0
    }
}

.layout-changetariff-grid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -40px
}

.layout-changetariff-grid__item {
    width: 33.333%;
    padding-right: 40px;
    padding-bottom: 40px
}

@media only screen and (max-width: 1439px) {
    .layout-changetariff-grid {
        margin-right: -32px
    }

    .layout-changetariff-grid__item {
        padding-right: 32px;
        padding-bottom: 32px
    }

    .layout-changetariff-grid__item {
        width: 50%;
    }
}

@media only screen and (max-width: 1199px) {
    .layout-changetariff-grid {
        display: block;
        margin-right: 0
    }

    .layout-changetariff-grid__item {
        width: 100%;
        padding-right: 0
    }
}

.layout-changetariff-action {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.layout-changetariff-action__item {
    margin-right: 32px
}

.layout-changetariff-action__item:last-child {
    margin-right: 0
}

@media only screen and (max-width: 1199px) {
    .layout-changetariff-action {
        flex-direction: column-reverse;
    }

    .layout-changetariff-action__item {
        width: 100%;
        padding-right: 0;
        margin-right: 0;
    }

    .layout-changetariff-action__item .btn-simple {
        width: 100%
    }
}

.layout-services {
    width: 100%;
    margin-bottom: 32px
}

.layout-services__item {
    width: 100%;
    margin-bottom: 24px
}

.layout-services__item:last-child {
    margin-bottom: 0
}

.layout-account-report {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin-bottom: 32px
}

.layout-account-report__item_graph {
    width: 100%
}

.layout-account-report__item_graph img {
    width: 100%
}

.layout-account-report__item_graph .reportinfo__item {
    margin-bottom: 16px
}

.layout-account-report__item_graph .reportinfo__item:last-child {
    margin-bottom: 0
}

.layout-account-report__item_info {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    width: 29.1666666667%;
    margin-right: 32px
}

@media only screen and (max-width: 1199px) {
    .layout-account-report {
        display: block
    }

    .layout-account-report__item {
        width: 100%;
        margin-right: 0;
        margin-bottom: 32px
    }

    .layout-account-report__item:last-child {
        margin-bottom: 0
    }
}

.layout-account-tablereport {
    border-top: 1px solid #E0E7EA
}

.layout-account-tablereport__item {
    margin-bottom: 32px
}

.layout-account-tablereport__item:last-child {
    margin-bottom: 0
}

.layout-account-tablereport__item p {
    color: #47526B;
    font-size: 16px;
    line-height: 24px
}

@media only screen and (max-width: 767px) {
    .layout-account-tablereport__item p {
        font-size: 12px
    }
}

.layout-navtabs {
    width: 100%;
    margin-bottom: 32px
}

.layout-navtabs__item {
    display: inline-block
}

@media only screen and (max-width: 1199px) {
    .layout-navtabs__item {
        display: block
    }
}

.layout-payments {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.layout-payments__item {
    width: 25%
}

.layout-payments__item--sbp {
    width: 31%;
}

@media only screen and (max-width: 1439px) {
    .layout-payments__item {
        width: 33.33333%
    }
}

@media only screen and (max-width: 1199px) {
    .layout-payments__item {
        width: 50%
    }
}

@media only screen and (max-width: 1023px) {
    .layout-payments {
        display: block
    }

    .layout-payments__item {
        width: 100%
    }
}

.layout-iptv-packets {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -40px;
    margin-bottom: 20px
}

.layout-iptv-packets__item {
    width: 50%;
    padding-right: 40px;
    padding-bottom: 40px
}

@media only screen and (max-width: 1023px) {
    .layout-iptv-packets {
        margin-right: 0
    }

    .layout-iptv-packets__item {
        width: 100%;
        padding-right: 0
    }
}

.layout-iptv-namevalue {
    margin-bottom: 32px
}

.layout-iptv-namevalue__item {
    margin-bottom: 36px;
}

.layout-iptv-namevalue__item:last-child {
    margin-bottom: 0
}

.layout-iptv-terminals__item {
    margin-bottom: 32px
}

.layout-iptv-terminals__item:last-child {
    margin-bottom: 0
}

.layout-iptv-terminals__item .layout-iptv-packets {
    margin-bottom: 0
}

.layout-iptv-info {
    margin-bottom: 40px
}

.layout-iptv-info__item {
    margin-bottom: 32px
}

.layout-iptv-info__item:last-child {
    margin-bottom: 0
}

.layout-turbo-btns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 32px
}

.layout-turbo-btns__item {
    margin-right: 32px
}

.layout-turbo-btns__item:last-child {
    margin-right: 0
}

.layout-turbo-btns__item .btn-simple {
    padding: 16px 48px
}

@media only screen and (max-width: 1199px) {
    .layout-turbo-btns {
        display: block
    }

    .layout-turbo-btns__item {
        width: 100%;
        margin-right: 0;
        margin-bottom: 16px
    }

    .layout-turbo-btns__item:last-child {
        margin-bottom: 0
    }

    .layout-turbo-btns__item .btn-simple {
        width: 100%
    }
}

.layout-settings-changeip__item {
    margin-bottom: 32px
}

.layout-settings-changeip__item:last-child {
    margin-bottom: 0
}

.layout-settings-changeip__item .parag {
    font-size: 20px;
    margin-bottom: 16px
}

.layout-settings-changeip__item .checkbox-default__name {
    margin-left: 16px;
    font-size: 14px;
    line-height: 16px
}

.layout-settings-changeip__item_ips {
    margin-bottom: 18px
}

.layout-settings-changeip__item .btn-simple {
    display: inline-block;
    width: auto
}

.layout-settings-changepassword {
    width: 100%
}

.layout-settings-changepassword__item {
    width: 30%;
    margin-bottom: 16px
}

.layout-settings-changepassword__item .btn-simple {
    display: inline-block
}

.layout-settings-changepassword__item:last-child {
    margin-bottom: 0
}

.layout-settings-changemac__item {
    width: 50%;
    margin-bottom: 32px;
}

@media only screen and (max-width: 1199px) {
    .layout-settings-changepassword__item {
        width: 100%
    }

    .layout-settings-changemac__item {
        width: 100%;
    }

    .layout-settings-changepassword__item .btn-simple {
        display: block;
        width: 100%
    }
}

.layout-limit__item {
    margin-bottom: 32px
}

.layout-payments-history__item {
    margin-bottom: 32px
}

.layout-pm-text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-top: 80px;
    margin-bottom: 80px
}

.layout-pm-text__item {
    width: 66.6666666667%;
    margin-bottom: 40px
}

.layout-pm-text__item_double-down {
    margin-bottom: 80px
}

.layout-pm-text__item:last-child {
    margin-bottom: 0
}

.layout-pm-text__item .parag {
    margin-bottom: 32px
}

.layout-pm-text__item .parag:last-child {
    margin-bottom: 0
}

.layout-pm-text__item .rates-list {
    padding: 0
}

@media only screen and (max-width: 1199px) {
    .layout-pm-text {
        padding-top: 32px;
        padding-left: 20px;
        padding-right: 20px;
        margin-bottom: 32px
    }

    .layout-pm-text__item {
        width: 100%
    }

    .layout-pm-text__item .parag {
        margin-bottom: 16px
    }

    .layout-pm-text__item .parag:last-child {
        margin-bottom: 0
    }

    .layout-pm-text__item_double-down {
        margin-bottom: 24px
    }
}

.layout-sber-services {
    background-color: #F7F7F7;
    padding: 40px 63px
}

@media only screen and (max-width: 1199px) {
    .layout-sber-services {
        padding: 20px 20px
    }
}

.layout-pm-list {
    padding: 0 63px;
    margin: 80px 0
}

@media only screen and (max-width: 1199px) {
    .layout-pm-list {
        padding: 0 20px
    }
}

.layout-pm-list__item {
    margin-bottom: 40px
}

.layout-pm-list__item:last-child {
    margin-bottom: 0
}

.layout-pm-list__item .rates-list {
    padding: 0;
    width: 66%;
    margin: 0 auto
}

@media only screen and (max-width: 1199px) {
    .layout-pm-list__item .rates-list {
        width: 100%
    }
}

.layout-pm-miniform {
    width: 83.3333333333%;
    margin: 0 auto
}

.layout-pm-miniform__item {
    padding: 40px 103px;
    margin: 0 auto;
    background-color: #F7F7F7
}

@media only screen and (max-width: 1199px) {
    .layout-pm-miniform {
        width: 100%
    }

    .layout-pm-miniform__item {
        padding: 20px
    }
}

.layout-pm-terminals {
    padding: 80px 63px
}

@media only screen and (max-width: 1199px) {
    .layout-pm-terminals {
        padding: 40px 20px
    }
}

@media only screen and (max-width: 1199px) {
    .layout-pm-terminals {
        padding: 0 63px
    }
}

@media only screen and (max-width: 1199px) and (max-width: 1199px) {
    .layout-pm-terminals {
        padding: 0 20px
    }
}

.layout-payments-how__item {
    margin-bottom: 32px
}

.layout-modal {
    width: 100%
}

.layout-modal__item {
    width: 100%;
    margin-bottom: 32px
}

.layout-modal__item:last-child {
    margin-bottom: 0
}

@media only screen and (max-width: 460px) {
    .layout-modal__item form .btn-simple {
        width: 100%;
        margin-bottom: 10px;
    }

    .layout-modal__item {
        width: 100%;
        margin-bottom: 10px;
    }
}

.svg-icon-lib {
    border: 0 !important;
    clip: rect(0 0 0 0) !important;
    height: 1px !important;
    margin: -1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important
}

.container {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto
}

.container:after {
    content: " ";
    display: block;
    clear: both
}

.main-content__item_drawer, .main-header__item_logo, .main-footer__item_copyright {
    width: 20.8333333333%
}

@media only screen and (max-width: 1439px) {
    .main-content__item_drawer, .main-header__item_logo, .main-footer__item_copyright {
        width: 25%
    }
}

@media only screen and (max-width: 1199px) {
    .main-content__item_drawer, .main-header__item_logo, .main-footer__item_copyright {
        width: auto
    }
}

.vertical-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (max-width: 1199px) {
    .vertical-flex {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
}

.incoming-icon svg {
    fill: #86C453
}

.upcoming-icon svg {
    fill: #00ACEC;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.login-forgot {
    width: 302px
}

.login-content__item .infoblock {
    top: -8px
}

.changetariff_page.infoblock {
    height: unset;
    top: 0;
}

.account-head__item {
    width: 100%
}

.account-head__item:last-child {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

@media only screen and (max-width: 767px) {
    .account-head {
        display: block
    }

    .account-head__item:last-child {
        display: block
    }
}

.social-connect {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative
}

.social-connect__item {
    margin-right: 40px
}

.social-connect__item:last-child {
    margin-right: 0
}

.social-connect__item a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-decoration: none
}

.social-connect__item_vk .social-connect-text {
    color: #507299
}

.social-connect__item_vk .social-connect-icon svg {
    fill: #507299
}

.social-connect__item_fb .social-connect-text {
    color: #4267B2
}

.social-connect__item_fb .social-connect-icon svg {
    fill: #4267B2
}

@media only screen and (max-width: 767px) {
    .social-connect {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .social-connect__item {
        margin-right: 16px;
        margin-bottom: 32px
    }

    .social-connect__item:last-child {
        margin-right: 0
    }
}

.social-connect-icon {
    width: 40px;
    height: 40px;
    display: block;
    margin-right: 8px;
    background-color: #eee;
    border-radius: 50%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat
}

.social-connect-icon svg {
    width: 100%;
    height: 100%
}

.social-connect-text {
    max-width: 118px;
    max-height: 32px;
    overflow: hidden;
    text-align: left;
    display: block;
    font-size: 14px;
    letter-spacing: 1px;
    line-height: 16px;
    text-transform: uppercase;
    color: gray
}

.social-connect-banner {
    position: absolute;
    bottom: -100px;
    border-radius: 5px;
    width: 181px;
    height: 90px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 8px;
    padding-bottom: 12px;
    padding-bottom: 14px;
    border: 2px solid #75BB42;
    background-color: #fff;
    z-index: 2
}

@media only screen and (max-width: 767px) {
    .social-connect-banner {
        position: static
    }

    .modal-change-tariff .modal-headline {
        line-height: 25px;
        font-size: 18px !important;
        max-height: unset;
    }

    .modal-change-tariff .modal-head__item {
        margin-right: 10px;
    }

    .changetariff-btn-group .btn-simple {
        padding: 12px;
    }

    .changetariff-btn-group .btn-simple__text {
        font-size: 12px;
    }

    .period-cell {
        margin-bottom: 15px;
    }

}

.social-connect-banner__icon {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    margin-top: 2px;
    margin-right: 8px
}

.social-connect-banner__icon svg {
    fill: #75BB42
}

.social-connect-banner__text {
    width: 100%
}

.social-connect-banner__text p {
    font-size: 12px;
    font-weight: bold;
    line-height: 14px;
    color: #75BB42;
    max-height: 70px;
    overflow: hidden
}

.ico_gift {
    width: 32px;
    height: 31px
}

.social-connect-banner__text a {
    text-decoration: none
}

.contact_field, .email_field {
    position: relative
}

.contact_popup {
    min-height: 196px;
    width: 445px;
    min-width: 445px;
    border-radius: 2px;
    background-color: #E0E7EA;
    position: absolute;
    padding: 16px 16px 20px 24px;
    top: 0;
    right: 0;
    display: none;
    z-index: 900
}

.data_text:disabled {
    background: #fff;
    color: #c2c8d6
}

.data_text::placeholder {
    color: #f0f1f5
}

.contact_send, .code_send {
    cursor: pointer
}

.contact_popup .topline {
    margin-bottom: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.topline .title {
    color: #47526B;
    font-size: 22px;
    font-weight: 700
}

.topline .close {
    width: 24px;
    height: 24px;
    background: url(/img/icons/ico_close_big_blue.svg) center center no-repeat;
    cursor: pointer
}

.contact_data {
    display: flex
}

.contact_data .data_hint {
    color: #89909F;
    font-size: 14px;
    line-height: 16px
}

.contact_data .data_text {
    color: #47526B;
    font-size: 18px;
    line-height: 24px;
    border: none;
    width: 100%
}

.contact_data .contact_number, .contact_data .contact_email {
    width: 204px;
    max-width: 204px;
    height: 72px;
    border-radius: 8px 0 0 8px;
    padding: 16px;
    background: #fff
}

.contact_data .data_text#email_address {
    font-size: 12px
}

.contact_data .contact_code {
    width: 97px;
    max-width: 97px;
    height: 72px;
    padding: 16px;
    background: #fff;
    border-left: 1px solid #E0E7EA
}

.contact_data .contact_dummy {
    width: 97px;
    max-width: 97px;
    height: 72px;
    background: #fff
}

.contact_data .code_send.in_progress {
    background-color: #cae5b3
}

.contact_data .code_send {
    width: 72px;
    height: 72px;
    background: #86C453 url(/img/icons/ico_check_2.svg) center center no-repeat;
    border-radius: 0 8px 8px 0;
    box-shadow: inset 1px 0 0 0 #E0E7EA
}

.contact_data .contact_send {
    width: 72px;
    height: 72px;
    background: #00acee url(/img/icons/ico_arr_send.svg) center center no-repeat;
    border-radius: 0 8px 8px 0;
    box-shadow: inset 1px 0 0 0 #E0E7EA
}

.contact_data .contact_send.in_progress {
    background-color: #66d4ff
}

#new_phone {
    white-space: nowrap
}

.resend, .send_hint, .contact_error {
    color: #00ACEC;
    font-size: 14px;
    text-transform: uppercase;
    margin-top: 24px;
    padding-left: 24px;
    padding-top: 3px;
    background: url(/img/icons/resend.svg) left center no-repeat;
    height: 20px;
    cursor: pointer
}

.send_hint, .contact_error {
    cursor: default;
    background: none;
    padding-left: 0;
    font-size: 12px
}

.contact_error {
    color: red;
    display: none;
    margin-top: 16px
}

.contact_saved_title {
    display: none;
    color: #47526B;
    font-size: 22px;
    font-weight: 700;
    width: 70%;
    cursor: pointer
}

.contact_saved {
    display: none;
    border-radius: 6px;
    background: none;
    color: #47526B;
    border: 2px solid #47526B;
    padding: 16px 24px;
    margin-top: 16px;
    text-align: center;
    width: 40%;
    cursor: pointer
}

.active_remove {
    background-color: #F7F7F8
}

.remove_sheduler {
    font-size: 13px;
    color: #5e677d;
    line-height: 20px
}

.remove_sheduler a {
    color: #1db5ed;
    text-decoration: none;
}

.all-size {
    width: 100%
}

.terminal-box {
    white-space: normal;
    display: flex;
    width: 100%;
}

.terminal-data {
    width: inherit;
    line-height: 30px;

    @media (max-width: 910px) {
        line-height: 20px;
        margin: 5px 0;
    }

    @media (max-width: 460px) {
        font-size: 12px;
    }
}

.terminal-data strong {
    font-size: 20px;
    font-weight: 700;

    @media (max-width: 460px) {
        font-size: 14px;
    }
}

.termonal-sub {
    font-size: 14px;
    color: #89909f;

    @media (max-width: 460px) {
        font-size: 12px;
    }
}

.termonal-sub span {
    font-weight: 800;
}

.terminal-remove {
    align-items: center;
    justify-content: center;
    display: flex;
    width: 80px;
    text-align: right;
}

.remove_terminal {
    width: 30px;
    height: 30px;
}


.layout-changetariff-h2 {
    font-size: 24px;
    color: #000F28;
    margin-bottom: 46px;
    margin-top: 23px;
    font-weight: bold;
    overflow: hidden;
}

.btn-simple.layout-changetariff {
    border-radius: 3px;
}

.d-flex {
    display: flex;
}

.mb36 {
    margin-bottom: 36px;
}

.gigabit_port_diff {
    width: 15px;
    height: 15px;
    position: relative;
    margin-left: 5px;
}

.gigabit_port_diff_tooltip {
    position: absolute;
    width: 175px;
    color: red;
    font-size: 10px;
    line-height: 12px;
    background-color: #E0E7EA;
    left: 120%;
    padding: 5px 10px;
    top: 0;
    visibility: hidden;
}

.gigabit_port_diff_tooltip_left {
    right: 120%;
    left: unset;
}

.gigabit_port_diff:hover .gigabit_port_diff_tooltip {
    visibility: visible;
}

.current_tariff_row {
    margin-bottom: 0;
    padding-bottom: 32px;
}

#modal-action-support .modal-head, #modal-action.change_tariff .modal-head {
    margin-bottom: 10px;
}

.modal-change-tariff .modal-headline {
    font-size: 24px;
}

.modal-change-tariff .modal-head {
    margin-bottom: 10px;
}

#modal-payment-info-link {
    cursor: pointer;
}

.modal-payment-info {
    width: 835px;
    min-width: 835px;
    height: auto;
}

@media only screen and (max-width: 1199px) {
    .modal-payment-info {
        border-radius: 8px;
    }
}

@media only screen and (max-width: 870px) {
    .modal-payment-info {
        width: calc(100% - 40px);
        min-width: auto;
        height: auto;
        border-radius: 8px;
        position: absolute;
        left: 50%;
        top: 43%;
        overflow: auto;
    }

    .modal-wrapper-payment-info {
        position: absolute;
    }
}

/* @media only screen and (max-width: 870px) {
    .modal-wrapper-payment-info {
        position: absolute;
    }
} */

.empty-period-cell {
    display: none;
}

.period-cell {
    display: flex;
    margin-right: 15px;
}


.modal-change-tariff .total_price {
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 3px;
}

.modal-change-tariff .monthly_price {
    font-size: 12px;
    margin-bottom: 3px;
}

.modal-change-tariff .discount_price {
    font-size: 12px;
    color: #88BF55;
}

.modal-change-tariff .period-cell-text {
    margin-left: 7px;
}

.periods-row {
    flex-wrap: wrap;
}

.changetariff_cancel {
    margin-left: 19px;
}

.empty-period-cell-radio {
    display: block;
    position: relative;
    padding-left: 25px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default radio button */
.empty-period-cell-radio input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #eee;
    border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.empty-period-cell-radio:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.empty-period-cell-radio input:checked ~ .checkmark {
    background-color: #88BF55;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
.empty-period-cell-radio input:checked ~ .checkmark:after {
    display: block;
}

/* Style the indicator (dot/circle) */
.empty-period-cell-radio .checkmark:after {
    top: 9px;
    left: 9px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
}

.layout-changetariff-grid__item__desc__item {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

.rate-content__headline {
    margin-bottom: 30px;
}

.bold {
    font-weight: bold;
}

.layout-changetariff-grid__item__lowest {
    font-weight: bold;
    font-size: 24px;
    margin-bottom: 20px;
    margin-top: 30px;
}

.changetariff-btn-group {
    display: flex;
}

.changetariff-btn-group .bold {
    text-align: center;
    font-size: 20px;
}


@media screen and (max-width: 1000px) {
    .payments-history-text, .payments-history-date__month {
        font-size: 14px;
    }

    .layout-payments-history .tablereport-row__col {
        margin-right: 0;
    }

    .layout-payments-history .payments-history-sum .summarytext-number {
        font-size: 16px;
    }
}

@media screen and (max-width: 750px) {
    .layout-payments-history .payments-history-text, .payments-history-date__month {
        white-space: normal;
        text-align: center;
        line-height: 20px;
    }

    .layout-payments-history .tablereport-row__col {
        justify-content: center;
    }

    .writeoffs_list .period_divider {
        display: none;
    }

    .writeoffs_list .payments-history-text.period {
        display: flex;
        flex-direction: column;
    }

}

@media screen and (max-width: 500px) {

    .layout-payments-history .payments-history-text, .layout-payments-history .payments-history-sum .summarytext-number, .payments-history-date__month {
        font-size: 12px;
    }

    .layout-payments-history .tablereport-row__col {
        margin-right: 5px;
    }

    .writeoffs_list .tablereport-row__col_25 {
        width: 23%;
    }

    .writeoffs_list .tablereport-row__col_15 {
        width: 17%;
    }

}

@media screen and (max-width: 450px) {

    .layout-payments-history .tablereport-row .tablereport-row__col:nth-child(1) .payments-history-text {
        text-align: left;
    }

    .layout-payments-history .tablereport-row__col {
        margin-right: 0;
    }


}

@media screen and (max-width: 400px) {

    .payments-history-date__month {
        display: flex;
        flex-direction: column;
    }

}

.confirm-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    min-width: 100%;
    min-height: 100%;
    background-color: rgba(31, 38, 51, .8);
    width: auto;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    z-index: 201;
    -webkit-animation: fadeIn .2s ease 0s both;
    animation: fadeIn .2s ease 0s both
}

.confirm-wrapper--hide {
    display: none
}

.confirm {
    min-width: 464px;
    position: absolute;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    background-color: #fff;
    border-radius: 10px;
    overflow: auto;
}

@media only screen and (max-width: 1489px) {
    .confirm {
        max-height: 90vh
    }
}

@media only screen and (max-width: 639px) {
    .confirm {
        width: 100%;
        min-width: 100%
    }
}

.confirm-content {
    padding: 32px;
    max-height: 90vh;
    overflow: auto
}

.confirm-content__item--hide {
    display: none
}

@media only screen and (max-width: 639px) {
    .confirm-content {
        min-width: 100%;
        padding: 20px
    }
}

.confirm-close-btn {
    height: 20px;
    width: 20px;
    position: absolute;
    top: 15px;
    right: 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background-color: #fff
}

.confirm-close-btn svg {
    fill: #9ca8b4;
    height: 50%;
    width: 50%;
    margin: auto
}

.confirm-close-btn:hover {
    cursor: pointer
}

.confirm-close-btn:active {
    opacity: .5
}

.confirm-action-links {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.confirm-headline {
    text-align: center;
    font-size: 20px;
    line-height: 27px
}

.confirm-text {
    font-size: 1rem;
    text-align: center;
    line-height: 19px;
    margin-top: 16px
}

.confirm-action-links {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.confirm-action-links__item {
    margin-right: 24px
}

.confirm-action-links__item:last-child {
    margin-right: 0
}

@media only screen and (max-width: 639px) {
    .confirm-action-links {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

.confirm-headline {
    text-align: center;
    font-size: 20px;
    line-height: 27px
}

.confirm-text {
    font-size: 1rem;
    text-align: center;
    line-height: 19px;
    margin-top: 16px
}

.confirm-action {
    border-radius: 0 0 8px 8px;
    padding: 20px;
    background-color: #e4eaf0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.confirm-action__item {
    margin-right: 16px
}

.confirm-action__item:last-child {
    margin-right: 0
}

@media only screen and (max-width: 639px) {
    .confirm-action {
        height: auto;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .confirm-action__item {
        width: 100%;
        margin-bottom: 16px;
        margin-right: 0
    }

    Config .confirm-action__item:last-child {
        margin-bottom: 0
    }

    .confirm-action__item button {
        width: 100%
    }
}

.simple-btn {
    width: 100%
}

.simple-btn {
    color: #fff;
    background-color: #9ca8b4;
    border-radius: 5px;
    padding: 10px 16px;
    font-size: 1rem;
    white-space: nowrap;
    min-height: 40px;
    overflow: hidden
}

.simple-btn:hover {
    cursor: pointer;
    background-color: #8d9ba9
}

.simple-btn:active {
    background-color: #708293
}

.simple-btn_save {
    color: #fff;
    background-color: #08bf5e
}

.simple-btn_save:hover {
    background-color: #07a752
}

.simple-btn_save:active {
    background-color: #068e46
}

.transparent-button {
    display: block;
    text-decoration: none;
    background-color: transparent;
    padding: 12px 16px;
    font-size: 14px;
    border-radius: 5px;
    color: #fff;
    text-align: center;
    max-height: 40px
}

.transparent-button, .transparent-button:hover {
    -webkit-box-shadow: 0 0 0 1px #fff;
    box-shadow: 0 0 0 1px #fff
}

.transparent-button:hover {
    cursor: pointer;
    background-color: #fff;
    color: #000
}

.transparent-button_showmore {
    -webkit-box-shadow: 0 0 0 1px #20b1ed;
    box-shadow: 0 0 0 1px #20b1ed;
    color: #20b1ed;
    text-align: center
}

.transparent-button_showmore__icon {
    display: inline-block;
    margin-left: 10px;
    width: 13px;
    height: 13px;
    vertical-align: sub
}

.transparent-button_showmore__icon svg {
    height: 100%;
    width: 100%;
    fill: #20b1ed
}

.transparent-button_showmore svg {
    fill: #20b1ed
}

.transparent-button_showmore:hover {
    background-color: #20b1ed;
    -webkit-box-shadow: 0 0 0 1px #20b1ed;
    box-shadow: 0 0 0 1px #20b1ed;
    color: #fff
}

.transparent-button_showmore:hover svg {
    fill: #fff
}

.transparent-button_showmore:active {
    background-color: #1093ca
}

.custom-scroll::-webkit-scrollbar {
    border-radius: 5px;
    width: 8px;
}

@media (max-width: 910px) {
    .custom-scroll::-webkit-scrollbar {
        width: 4px;
    }
}

.custom-scroll::-webkit-scrollbar-track {
    background-color: #F2F6FA;
}

.custom-scroll::-webkit-scrollbar-thumb {
    background-color: #489CC1;
    border-radius: 5px;
}

.custom-scroll::-webkit-scrollbar-thumb:hover {
    background-color: #3781a2;
}

.spinner-overlay {
    position: fixed;
    top: 0;
    left: 0;
    min-width: 100%;
    min-height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    width: auto;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    justify-content: center;
    align-items: center;
    display: flex;
    overflow: hidden;
    z-index: 245
}

.spinner-overlay--hide {
    display: none;
}

.loader {
    width: 48px;
    height: 48px;
    border: 5px solid #FFF;
    border-bottom-color: #489CC1;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* Input range styles */
/*generated with Input range slider CSS style generator (version 20211225)
https://toughengineer.github.io/demo/slider-styler*/
input[type=range].styled-slider {
    width: 100%;
    height: 24px;
    -webkit-appearance: none;
}

/*progress support*/
input[type=range].styled-slider.slider-progress {
    --range: calc(var(--max) - var(--min));
    --ratio: calc((var(--value) - var(--min)) / var(--range));
    --sx: calc(0.5 * 24px + var(--ratio) * (100% - 24px));
}

/*webkit*/
input[type=range].styled-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 24px;
    height: 24px;
    border-radius: 1em;
    background: #88BF55;
    border: none;
    box-shadow: 0 0 2px black;
    margin-top: calc(7px * 0.5 - 24px * 0.5);
}

input[type=range].styled-slider::-webkit-slider-runnable-track {
    height: 7px;
    border: none;
    border-radius: 30px;
    background: #E1E8F0;
    box-shadow: none;
}

input[type=range].styled-slider::-webkit-slider-thumb:hover {
    background: #7db34c;
}

input[type=range].styled-slider:hover::-webkit-slider-runnable-track {
    background: #D3DBE4;
}

input[type=range].styled-slider.slider-progress::-webkit-slider-runnable-track {
    background: linear-gradient(#123C55, #0d2f43) 0/var(--sx) 100% no-repeat, #E1E8F0;
}

input[type=range].styled-slider.slider-progress:hover::-webkit-slider-runnable-track {
    background: linear-gradient(#123C55, #0c2e42) 0/var(--sx) 100% no-repeat, #D3DBE4;
}

/*mozilla*/
input[type=range].styled-slider::-moz-range-thumb {
    width: 24px;
    height: 24px;
    border-radius: 1em;
    background: #88BF55;
    border: none;
    box-shadow: 0 0 2px black;
}

input[type=range].styled-slider::-moz-range-track {
    height: 7px;
    border: none;
    border-radius: 30px;
    background: #E1E8F0;
    box-shadow: none;
}

input[type=range].styled-slider::-moz-range-thumb:hover {
    background: #75a846;
}

input[type=range].styled-slider:hover::-moz-range-track {
    background: #D3DBE4;
}

input[type=range].styled-slider.slider-progress::-moz-range-track {
    background: linear-gradient(#123C55, #0d3046) 0/var(--sx) 100% no-repeat, #E1E8F0;
}

input[type=range].styled-slider.slider-progress:hover::-moz-range-track {
    background: linear-gradient(#123C55, #0c2c40) 0/var(--sx) 100% no-repeat, #D3DBE4;
}

/*ms*/
input[type=range].styled-slider::-ms-fill-upper {
    background: transparent;
    border-color: transparent;
}

input[type=range].styled-slider::-ms-fill-lower {
    background: transparent;
    border-color: transparent;
}

input[type=range].styled-slider::-ms-thumb {
    width: 24px;
    height: 24px;
    border-radius: 1em;
    background: #88BF55;
    border: none;
    box-shadow: 0 0 2px black;
    margin-top: 0;
    box-sizing: border-box;
}

input[type=range].styled-slider::-ms-track {
    height: 7px;
    border-radius: 30px;
    background: #E1E8F0;
    border: none;
    box-shadow: none;
    box-sizing: border-box;
}

input[type=range].styled-slider::-ms-thumb:hover {
    background: #75a846;
}

input[type=range].styled-slider:hover::-ms-track {
    background: #D3DBE4;
}

input[type=range].styled-slider.slider-progress::-ms-fill-lower {
    height: 7px;
    border-radius: 30px 0 0 30px;
    margin: -undefined 0 -undefined -undefined;
    background: #123C55;
    border: none;
    border-right-width: 0;
}

input[type=range].styled-slider.slider-progress:hover::-ms-fill-lower {
    background: #0d2d41;
}

/* Ya js shadow fix */
.ya-share2__container_size_l .ya-share2__popup:not(.ya-share2__popup_mobile) {
    border-radius: 16px;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.18), 0 0 8px rgba(0, 0, 0, 0.1);
}

.ya-share2__badge .ya-share2__icon {
    @media (max-width: 1023px) {
        background-size: 35px 35px !important;
        height: 48px !important;
        width: 48px !important;
    }

    @media (max-width: 639px) {
        background-size: 30px 30px !important;
        height: 38px !important;
        width: 38px !important;
    }
}

.telegram_image {
    position: absolute;
    bottom: 10px;
    width: 227px !important;
    height: 227px !important;

    @media (max-width: 380px) {
        left: 50%;
        bottom: 15px;
    }
}

.telegram_image__wide {
    right: 4%;
    position: absolute;
    width: 138px !important;
    height: 140px !important;

    @media (max-width: 1022px) {
        width: 108px !important;
        height: 110px !important;
    }

    @media (max-width: 640px) {
        width: 45px !important;
        height: 45px !important;
        right: 1%;
        bottom: 5%;
    }
}