.error.unsupported {
    width: 100%;
    max-width: 600px;
    border-radius: 4px;
    border: 1px solid #a8a8a8;
    background-color: #fff;
    display: flex;
    flex-flow: column nowrap;
    padding: 24px;
    color: #333333;
}

.error__heading {
    font-size: 28px;
    margin: 16px 0 8px 0;
}

.error__heading, .error__text {
    text-align: center;
}

.error__text {
    margin-bottom: 0;
}

.icon.unsupported {
    color: #ff0000;
    width: 64px;
    height: 64px;
    border-radius: 100%;
    border: 3px solid #ff0000;
    padding: 8px;
    display: flex;
    flex-flow: column nowrap;
    align-items: center;
    justify-content: center;
    font-size: 64px;
    align-self: center;
}

.icon>span {
    line-height: 10px;
}

.overlay.unsupported {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    min-height: 100vh;
    width: 100vw;
    overflow: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 200;
    background-color: #f0f0f0;
}

.bcLink {
    color: #525199;
}

.browsers-list {
    align-self: center;
    max-width: 100%;
}

@media(min-width: 320px) {
    .overlay.unsupported {
        height: 100vh;
        min-height: inherit;
    }
}

@media(max-width: 600px) {
    .error.unsupported {
        padding: 32px;
        margin: 10px;
    }
}