.display-viewport {
    margin-top: 64px;
    margin-bottom: 32px;
    margin-left: 32px;
    width: calc(100vw - 64px);
    height: calc(100vh - 172px);
    display: flex;
    background-color: #262423BF;
    position: relative;
}

#mainviewport {
    overflow: auto;
    scrollbar-width: none;
    /* Firefox */
    -ms-overflow-style: none;
    /* IE/Edge */
}

#mainviewport::-webkit-scrollbar {
    display: none;
    /* Chrome/Safari */
}

/* Маска-прозрачность сверху и снизу */
#mainviewport {
    -webkit-mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);
    mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);

    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

#alertviewport {
    overflow: auto;
    scrollbar-width: none;
    /* Firefox */
    -ms-overflow-style: none;
    /* IE/Edge */
}

#alertviewport::-webkit-scrollbar {
    display: none;
    /* Chrome/Safari */
}

/* Маска-прозрачность сверху и снизу */
#alertviewport {
    -webkit-mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);
    mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);

    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}