@font-face {
    font-family: 'MTS Sans';
    src: url('../fonts/MTSSans-Regular.ttf') format("truetype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'MTS Sans';
    src: url('../fonts/MTSSans-Medium.ttf') format("truetype");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'MTS Sans';
    src: url('../fonts/MTSSans-Bold.ttf') format("truetype");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'MTS Sans';
    src: url('../fonts/MTSSans-Black.ttf') format("truetype");
    font-weight: 900;
    font-style: normal;
}

html {
    font-size: 1.24vh;
    overflow: hidden;
    height: -webkit-fill-available;
}

body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    width: 100%;
    background-color: white;
    font-family: "MTS Sans", sans-serif;
    min-height: -webkit-fill-available;
}

h1 {
    margin: 0;
    padding: 0;
    color: #000000;
    font-size: 2.4rem;
    line-height: 2.8rem;
    font-weight: 900;
}

a {
    text-decoration: none;
}

.message-text {
    color: #1D2023;
    font-size: 1.7rem;
    line-height: 2.4rem;
    font-weight: 400;
}

.message-text-p2 {
    color: #1D2023;
    font-size: 1.4rem;
    line-height: 2rem;
    font-weight: 400;
}

.message-text-p3 {
    color: #1D2023;
    font-size: 1.2rem;
    line-height: 1.6rem;
    font-weight: 400;
}

.message-text-secondary {
    color: #626C77;
}

.message-text__accent {
    font-weight: 500;
}

.message-text__bold {
    font-weight: 700;
}

.message-text__url {
    color: #007CFF;
    text-decoration: none;
}

.icon {
    display: grid;
    place-items: center;
    position: relative;
    width: 12rem;
    height: 12rem;
}
.icon .icon__shadow {
    width: 11.2rem;
    height: 11.2rem;
    border-radius: 100%;
}

.icon_error .icon__shadow {
    box-shadow: 0 0 64px rgba(255, 173, 173, 0.5);
}

.icon_success .icon__shadow {
    box-shadow: 0 0 64px rgba(134, 227, 132, 0.5);
}

.icon_warning .icon__shadow {
    box-shadow: 0 0 64px rgba(244, 218, 78, 0.5);
}


.icon .icon__image {
    width: 12rem;
    height: 12rem;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

.icon_error .icon__image {
    background-image: url('../img/icon-error.svg');
}

.icon_success .icon__image {
    background-image: url('../img/icon-success.svg');
}

.icon_warning .icon__image {
    background-image: url('../img/icon-warning.svg');
}

.dialog-shell {
    display: grid;
    place-items: center;
    width: 100%;
    height: 95vh;
}

.dialog-shell.dialog-shell_success {
    display: flex;
    flex-flow: column;
    padding-top: 25.9rem;
}

.dialog {
    display: flex;
    flex-flow: column nowrap;
    justify-content: flex-start;
    align-items: center;
}

.dialog .dialog__icon {
    margin-bottom: 5.7rem;
}

.dialog .dialog__title {
    margin-bottom: 2.2rem;
    text-align: center;
}

.dialog .dialog__message.dialog__message_paragraph {
    margin-bottom: 2.2rem;
}

.dialog .dialog__message {
    text-align: center;
}

.dialog .dialog__store {
    margin-top: 4.6rem;
}

.dialog .dialog__site {
    margin-top: 2.3rem;
}

.dialog__buttons {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: absolute;
    bottom: 0;
}

.icon-appstore {
    background-image: url('../img/download-appstore.svg');
    text-decoration: none;
    width: 18.4rem;
    height: 6.2rem;
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

.icon-google-play {
    background-image: url('../img/download-google-play.png');
    width: 21.1rem;
    height: 6.2rem;
    text-decoration: none;
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

.mts-button {
    padding: .9rem 2.4rem 1.1rem 2.4rem;
    color: #FFFFFF;
    background: #E30611;
    font-size: 1.7rem;
    line-height: 2.4rem;
    font-weight: 500;
    text-decoration: none;
    border-radius: 8px;
}