.rnc__notification-container--bottom-center,
.rnc__notification-container--bottom-full,
.rnc__notification-container--bottom-left,
.rnc__notification-container--bottom-right,
.rnc__notification-container--center,
.rnc__notification-container--top-center,
.rnc__notification-container--top-full,
.rnc__notification-container--top-left,
.rnc__notification-container--top-right {
    min-width: 20rem;
    pointer-events: all;
    position: absolute
}

.rnc__notification-container--bottom-center,
.rnc__notification-container--center,
.rnc__notification-container--top-center {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    left: calc(50% - 10.9375rem);
    max-width: 21.875rem
}

.rnc__notification-container--center {
    height: 100%;
    pointer-events: none;
    top: 1.5rem
}

.rnc__notification-container--bottom-full,
.rnc__notification-container--top-full {
    min-width: 100%;
    width: 100%
}

.rnc__notification-container--bottom-full {
    bottom: 0
}

.rnc__util--flex-center {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 20rem;
    pointer-events: all
}

.rnc__notification-container--top-center {
    top: 1.5rem
}

.rnc__notification-container--bottom-center {
    bottom: 1.5rem
}

.rnc__notification-container--top-left {
    left: 1.5rem;
    top: 1.5rem
}

.rnc__notification-container--top-right {
    right: 1.5rem;
    top: 1.5rem
}

.rnc__notification-container--bottom-left {
    bottom: 1.5rem;
    left: 1.5rem
}

.rnc__notification-container--bottom-right {
    bottom: 1.5rem;
    right: 1.5rem
}

.rnc__notification-container--mobile-bottom,
.rnc__notification-container--mobile-top {
    pointer-events: all;
    position: absolute
}

.rnc__notification-container--mobile-top {
    left: 1.5rem;
    right: 1.5rem;
    top: 1.5rem
}

.rnc__notification-container--mobile-bottom {
    bottom: 1.5rem;
    left: 1.5rem;
    margin-bottom: 1.125rem;
    right: 1.5rem
}

.rnc__notification-item--default {
    -webkit-backdrop-filter: blur(.7rem);
    backdrop-filter: blur(.7rem);
    background-color: rgba(29, 31, 38, .65);
    will-change: backdrop-filter
}

.rnc__notification-item--default .rnc__notification-timer {
    background-color: #1f2128
}

.rnc__notification-item--default .rnc__notification-timer-filler {
    background-color: #fff
}

.rnc__notification-item--default .rnc__notification-close-mark {
    background-color: #1f2128
}

.rnc__notification-item--success {
    -webkit-backdrop-filter: blur(.7rem);
    backdrop-filter: blur(.7rem);
    background-color: rgba(67, 179, 162, .65);
    will-change: backdrop-filter
}

.rnc__notification-item--success .rnc__notification-timer {
    background-color: #46bcaa
}

.rnc__notification-item--success .rnc__notification-timer-filler {
    background-color: #fff
}

.rnc__notification-item--success .rnc__notification-close-mark {
    background-color: #46bcaa
}

.rnc__notification-item--info {
    -webkit-backdrop-filter: blur(.7rem);
    backdrop-filter: blur(.7rem);
    background-color: rgba(73, 100, 238, .65);
    will-change: backdrop-filter
}

.rnc__notification-item--info .rnc__notification-timer {
    background-color: #4d69fa
}

.rnc__notification-item--info .rnc__notification-timer-filler {
    background-color: #fff
}

.rnc__notification-item--info .rnc__notification-close-mark {
    background-color: #4d69fa
}

.rnc__notification-item--warning {
    -webkit-backdrop-filter: blur(.7rem);
    backdrop-filter: blur(.7rem);
    background-color: rgba(242, 197, 78, .65);
    will-change: backdrop-filter
}

.rnc__notification-item--warning .rnc__notification-timer {
    background-color: #ffcf52
}

.rnc__notification-item--warning .rnc__notification-timer-filler {
    background-color: #fff
}

.rnc__notification-item--warning .rnc__notification-close-mark {
    background-color: #ffcf52
}

.rnc__notification-item--danger {
    -webkit-backdrop-filter: blur(.7rem);
    backdrop-filter: blur(.7rem);
    background-color: rgba(231, 80, 31, .65);
    will-change: backdrop-filter
}

.rnc__notification-item--danger .rnc__notification-timer {
    background-color: #f35421
}

.rnc__notification-item--danger .rnc__notification-timer-filler {
    background-color: #fff
}

.rnc__notification-item--danger .rnc__notification-close-mark {
    background-color: #f35421
}

.rnc__notification-item--awesome {
    -webkit-backdrop-filter: blur(.7rem);
    backdrop-filter: blur(.7rem);
    background-color: rgba(103, 88, 200, .65);
    will-change: backdrop-filter
}

.rnc__notification-item--awesome .rnc__notification-timer {
    background-color: #6c5dd3
}

.rnc__notification-item--awesome .rnc__notification-timer-filler {
    background-color: #fff
}

.rnc__notification-item--awesome .rnc__notification-close-mark {
    background-color: #6c5dd3
}

@-webkit-keyframes timer {
    0% {
        width: 100%
    }

    to {
        width: 0
    }
}

@keyframes timer {
    0% {
        width: 100%
    }

    to {
        width: 0
    }
}

.rnc__base {
    height: 100%;
    pointer-events: none;
    position: fixed;
    width: 100%;
    z-index: 9000
}

.rnc__notification-item {
    border-radius: .875rem;
    box-shadow: 0 1.6rem 3rem rgba(0, 0, 0, .1);
    cursor: pointer;
    display: flex;
    margin-bottom: 1rem;
    position: relative
}

.rnc__notification-container--bottom-full .rnc__notification-item,
.rnc__notification-container--top-full .rnc__notification-item {
    border-radius: 0;
    margin-bottom: 0
}

.rnc__notification-timer {
    margin-top: 1rem;
    width: 100%
}

.rnc__notification-timer,
.rnc__notification-timer-filler {
    border-radius: .875rem;
    height: .25rem
}

.rnc__notification-title {
    color: #fff;
    font-size: .8125rem;
    font-weight: 700;
    margin-bottom: .5rem;
    margin-top: .5rem
}

.rnc__notification-message {
    word-wrap: break-word;
    color: #fff;
    font-size: .8125rem;
    line-height: 150%;
    margin-bottom: 0;
    margin-top: 0;
    max-width: calc(100% - 1rem)
}

.rnc__notification-content {
    display: inline-block;
    padding: .5rem 1rem;
    width: 100%
}

.rnc__notification-close-mark {
    border-radius: 50%;
    display: inline-block;
    height: 1.4rem;
    position: absolute;
    right: .5rem;
    top: .5rem;
    width: 1.4rem
}

.rnc__notification-close-mark:after {
    color: #fff;
    content: "×";
    font-size: 1.4rem;
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.rnc__notification-container--mobile-bottom .notification,
.rnc__notification-container--mobile-bottom .rnc__notification-item,
.rnc__notification-container--mobile-top .notification,
.rnc__notification-container--mobile-top .rnc__notification-item {
    max-width: 100%;
    width: 100%
}

.rnc__notification-container--bottom-right .notification,
.rnc__notification-container--top-right .notification {
    margin-left: auto
}

.rnc__notification-container--bottom-left .notification,
.rnc__notification-container--top-left .notification {
    margin-right: auto
}

.rnc__notification-container--mobile-bottom .notification,
.rnc__notification-container--mobile-top .notification {
    margin-left: auto;
    margin-right: auto
}